From 00f017b281f85693d556aeba014e2e4c0eb81b43 Mon Sep 17 00:00:00 2001
From: Andrew Clark <git@andrewclark.io>
Date: Sat, 28 Aug 2021 11:37:22 -0400
Subject: [PATCH] Set up use-sync-external-store package

This package will be a shim for the built-in useSyncExternalStore API
(not yet implemented).
---
 ReactVersions.js                              |  1 +
 packages/use-sync-external-store/README.md    |  5 +++++
 packages/use-sync-external-store/index.js     | 12 +++++++++++
 packages/use-sync-external-store/npm/index.js |  7 +++++++
 packages/use-sync-external-store/package.json | 21 +++++++++++++++++++
 .../__tests__/useSyncExternalStore-test.js    | 14 +++++++++++++
 .../src/useSyncExternalStore.js               | 12 +++++++++++
 scripts/rollup/bundles.js                     |  9 ++++++++
 8 files changed, 81 insertions(+)
 create mode 100644 packages/use-sync-external-store/README.md
 create mode 100644 packages/use-sync-external-store/index.js
 create mode 100644 packages/use-sync-external-store/npm/index.js
 create mode 100644 packages/use-sync-external-store/package.json
 create mode 100644 packages/use-sync-external-store/src/__tests__/useSyncExternalStore-test.js
 create mode 100644 packages/use-sync-external-store/src/useSyncExternalStore.js

diff --git a/ReactVersions.js b/ReactVersions.js
index 95d4bd8b7c278..2ce7680f0191c 100644
--- a/ReactVersions.js
+++ b/ReactVersions.js
@@ -47,6 +47,7 @@ const experimentalPackages = [
   'react-fs',
   'react-pg',
   'react-server-dom-webpack',
+  'use-sync-external-store',
 ];
 
 module.exports = {
diff --git a/packages/use-sync-external-store/README.md b/packages/use-sync-external-store/README.md
new file mode 100644
index 0000000000000..c799272a93ef4
--- /dev/null
+++ b/packages/use-sync-external-store/README.md
@@ -0,0 +1,5 @@
+# use-sync-external-store
+
+Backwards compatible shim for React's `useSyncExternalStore`. Works with any React that supports hooks.
+
+Until `useSyncExternalStore` is documented, refer to https://github.com/reactwg/react-18/discussions/86
diff --git a/packages/use-sync-external-store/index.js b/packages/use-sync-external-store/index.js
new file mode 100644
index 0000000000000..ff57d66d841bc
--- /dev/null
+++ b/packages/use-sync-external-store/index.js
@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+'use strict';
+
+export * from './src/useSyncExternalStore';
diff --git a/packages/use-sync-external-store/npm/index.js b/packages/use-sync-external-store/npm/index.js
new file mode 100644
index 0000000000000..a9d619acec0ac
--- /dev/null
+++ b/packages/use-sync-external-store/npm/index.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/use-sync-external-store.production.min.js');
+} else {
+  module.exports = require('./cjs/use-sync-external-store.development.js');
+}
diff --git a/packages/use-sync-external-store/package.json b/packages/use-sync-external-store/package.json
new file mode 100644
index 0000000000000..cc9a7c3a393c1
--- /dev/null
+++ b/packages/use-sync-external-store/package.json
@@ -0,0 +1,21 @@
+{
+  "name": "use-sync-external-store",
+  "description": "Backwards compatible shim for React's useSyncExternalStore. Works with any React that supports hooks.",
+  "version": "0.0.1",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/facebook/react.git",
+    "directory": "packages/use-sync-external-store"
+  },
+  "files": [
+    "LICENSE",
+    "README.md",
+    "build-info.json",
+    "index.js",
+    "cjs/"
+  ],
+  "license": "MIT",
+  "peerDependencies": {
+    "react": "^16.8.0 || ^17.0.0"
+  }
+}
diff --git a/packages/use-sync-external-store/src/__tests__/useSyncExternalStore-test.js b/packages/use-sync-external-store/src/__tests__/useSyncExternalStore-test.js
new file mode 100644
index 0000000000000..be6eeb5caf8cc
--- /dev/null
+++ b/packages/use-sync-external-store/src/__tests__/useSyncExternalStore-test.js
@@ -0,0 +1,14 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @emails react-core
+ */
+
+'use strict';
+
+describe('useSyncExternalStore', () => {
+  test('TODO', () => {});
+});
diff --git a/packages/use-sync-external-store/src/useSyncExternalStore.js b/packages/use-sync-external-store/src/useSyncExternalStore.js
new file mode 100644
index 0000000000000..8967bff10d33a
--- /dev/null
+++ b/packages/use-sync-external-store/src/useSyncExternalStore.js
@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export function useSyncExternalStore() {
+  throw new Error('Not yet implemented');
+}
diff --git a/scripts/rollup/bundles.js b/scripts/rollup/bundles.js
index 54c0552ba5649..7e87f4cc355e2 100644
--- a/scripts/rollup/bundles.js
+++ b/scripts/rollup/bundles.js
@@ -684,6 +684,15 @@ const bundles = [
     externals: ['react'],
   },
 
+  /******* Shim for useSyncExternalState *******/
+  {
+    bundleTypes: [NODE_DEV, NODE_PROD],
+    moduleType: ISOMORPHIC,
+    entry: 'use-sync-external-store',
+    global: 'useSyncExternalStore',
+    externals: ['react'],
+  },
+
   /******* React Scheduler (experimental) *******/
   {
     bundleTypes: [