@streamlayer/react-polyfills 0.1.1

package/lib/index.d.ts

@@ -0,0 +1,4 @@
+import * as modern from '@nanostores/react';
+import * as modernReact from 'react';
+export declare const useStore: typeof modern.useStore;
+export declare const useTransition: (() => (boolean | ((fn: Function) => void))[]) | typeof modernReact.useTransition;

package/lib/index.js

@@ -0,0 +1,13 @@
+import * as modern from '@nanostores/react';
+import * as modernReact from 'react';
+import * as legacy from './legacy';
+export const useStore = process.env.REACT_LEGACY ? legacy.useStore : modern.useStore;
+const legacyUseTransition = () => {
+    return [
+        false,
+        (fn) => {
+            window.requestAnimationFrame(() => fn());
+        },
+    ];
+};
+export const useTransition = process.env.REACT_LEGACY ? legacyUseTransition : modernReact.useTransition;

package/lib/legacy.d.ts

@@ -0,0 +1,12 @@
+import { type Store, type StoreValue } from 'nanostores';
+type StoreKeys<T> = T extends {
+    setKey: (k: infer K, v: any) => unknown;
+} ? K : never;
+export interface UseStoreOptions<SomeStore> {
+    /**
+     * Will re-render components only on specific key changes.
+     */
+    keys?: StoreKeys<SomeStore>[];
+}
+export declare function useStore<SomeStore extends Store>(store: Store, opts?: UseStoreOptions<SomeStore>): StoreValue<SomeStore>;
+export {};

package/lib/legacy.js

@@ -0,0 +1,10 @@
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-nocheck
+import { listenKeys } from 'nanostores';
+import { useCallback } from 'react';
+import { useSyncExternalStore } from 'use-sync-external-store/shim';
+export function useStore(store, opts = {}) {
+    const subscribe = useCallback((onChange) => (opts.keys ? listenKeys(store, opts.keys, onChange) : store.listen(onChange)), [opts.keys, store]);
+    const get = store.get.bind(store);
+    return useSyncExternalStore(subscribe, get, get);
+}

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "@streamlayer/react-polyfills",
+  "version": "0.1.1",
+  "type": "module",
+  "main": "./lib/index.js",
+  "typings": "./lib/index.d.ts",
+  "files": [
+    "lib/",
+    "package.json"
+  ],
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "import": "./lib/index.js",
+      "default": "./lib/index.js"
+    },
+    "./queries/*": {
+      "types": "./lib/grpc/queries/*.d.ts",
+      "import": "./lib/grpc/queries/*.js",
+      "default": "./lib/grpc/queries/*.js"
+    }
+  },
+  "dependencies": {
+    "@nanostores/react": "^0.7.1",
+    "nanostores": "^0.9.4",
+    "react": "^18.2.0",
+    "use-sync-external-store": "^1.2.0"
+  }
+}