From e9b4f4595fcc751711922a30009fac9f957a25cf Mon Sep 17 00:00:00 2001
From: Douglas Armstrong <dougarmstrong@fb.com>
Date: Tue, 12 Apr 2022 19:25:33 -0700
Subject: [PATCH] Add explicit `children` prop to
 `useRecoilBridgeAcrossReactRoots()` (#1731)

Summary:
Pull Request resolved: https://github.com/facebookexperimental/Recoil/pull/1731

Add explicit `children` prop to `useRecoilBridgeAcrossReactRoots_UNSTABLE()`, similar to `<RecoilRoot>` for TypeScript.  This aligns it with the Flow typing and is necessary for the new `types/react` for React 18.

Reviewed By: mondaychen

Differential Revision: D35599296

fbshipit-source-id: 699c2c06d5a3ac6ed3f64dda824c6290a2defc42
---
 CHANGELOG.md          | 1 +
 typescript/index.d.ts | 2 +-
 typescript/tests.ts   | 7 +++++--
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 74865dd97..7d5a38863 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@
 - Update typing for family parameters to better support Map, Set, and classes with `toJSON()`. (#1709, #1703)
 - Cleanup potential memory leak when using async selectors (#1714)
 - Fix potentially hung async selectors when shared across multiple roots that depend on atoms initialized with promises that don't resolve (#1714)
+- Add explict `children` prop to `<RecoilRoot>` and `useRecoilBridgeAcrossReactRoots_UNSTABLE()` for TypeScript for `@types/react` with React 18 (#1718, #1717, #1726, #1731)
 
 ## 0.7 (2022-03-31)
 
diff --git a/typescript/index.d.ts b/typescript/index.d.ts
index 3209cd3c7..27e3c1079 100644
--- a/typescript/index.d.ts
+++ b/typescript/index.d.ts
@@ -308,7 +308,7 @@
  export function useRecoilRefresher_UNSTABLE(recoilValue: RecoilValue<any>): () => void;
 
  // useRecoilBridgeAcrossReactRoots.d.ts
- export const RecoilBridge: React.FC;
+ export const RecoilBridge: React.FC<{children: React.ReactNode}>;
  /**
   * Returns a component that acts like a <RecoilRoot> but shares the same store
   * as the current <RecoilRoot>.
diff --git a/typescript/tests.ts b/typescript/tests.ts
index ab65e98d9..ad85539c5 100644
--- a/typescript/tests.ts
+++ b/typescript/tests.ts
@@ -406,9 +406,12 @@ const transact: (p: number) => void = useRecoilTransaction_UNSTABLE(({get, set,
  */
 {
   const RecoilBridgeComponent: typeof RecoilBridge = useRecoilBridgeAcrossReactRoots_UNSTABLE();
-  RecoilBridgeComponent({});
+  RecoilBridgeComponent({children: React.createElement('div')});
   // eslint-disable-next-line @typescript-eslint/no-empty-function
-  RecoilBridgeComponent({initializeState: () => {}}); // $ExpectError
+  RecoilBridgeComponent({
+    children: React.createElement('div'),
+    initializeState: () => {}, // $ExpectError
+  });
 }
 
 /**