@hefang/react-store 0.0.1

package/README.md

@@ -0,0 +1,15 @@
+# @hefang/store
+
+To install dependencies:
+
+```bash
+bun install
+```
+
+To run:
+
+```bash
+bun run src/index.ts
+```
+
+This project was created using `bun init` in bun v1.3.11. [Bun](https://bun.com) is a fast all-in-one JavaScript runtime.

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+export interface CreateStoreOptions {
+    deepCompareFunc: (a: unknown, b: unknown) => boolean;
+}
+export declare function createStore<V extends Record<string, unknown>>(defaultValue?: V, options?: Partial<CreateStoreOptions>): readonly [() => V, (newValues: Partial<V> | ((prev: V) => Partial<V>), { immediately, deepCompare, }?: {
+    immediately?: boolean;
+    deepCompare?: boolean;
+}) => void, () => V];

package/dist/index.js

@@ -0,0 +1,61 @@
+import { useSyncExternalStore } from "react";
+export function createStore(defaultValue, options) {
+    const opt = {
+        deepCompareFunc: Object.is,
+        ...options,
+    };
+    const store = {
+        queues: 0,
+        queueTimer: 0,
+        value: { ...defaultValue },
+        listeners: new Set(),
+    };
+    function subscribe(onStoreChange) {
+        store.listeners.add(onStoreChange);
+        return () => {
+            store.listeners.delete(onStoreChange);
+        };
+    }
+    function getSnapshot() {
+        return store.value;
+    }
+    function getServerSnapshot() {
+        return store.value;
+    }
+    function emitChanges() {
+        store.queues = 0;
+        store.listeners.forEach((listener) => listener());
+        if (store.queueTimer) {
+            window.clearTimeout(store.queueTimer);
+        }
+    }
+    function setStore(newValues, { immediately, deepCompare, } = {}) {
+        const values = typeof newValues === "function" ? newValues(store.value) : newValues;
+        if (deepCompare) {
+            Object.keys(values).forEach((key) => {
+                if (!opt.deepCompareFunc(values[key], store.value[key])) {
+                    store.value = { ...store.value, [key]: values[key] };
+                }
+            });
+        }
+        else {
+            store.value = { ...store.value, ...values };
+        }
+        if (immediately) {
+            emitChanges();
+        }
+        else {
+            if (!store.queues) {
+                queueMicrotask(emitChanges);
+            }
+            store.queues++;
+        }
+    }
+    function useStore() {
+        return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+    }
+    function getStore() {
+        return store.value;
+    }
+    return [useStore, setStore, getStore];
+}

package/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "@hefang/react-store",
+  "version": "0.0.1",
+  "type": "module",
+  "exports": {
+    "types": "./dist/index.d.ts",
+    "require": "./dist/index.js",
+    "import": "./dist/index.js",
+    "default": "./src/index.ts"
+  },
+  "scripts": {
+    "build": "bun tsc --noEmit false",
+    "prepack": "bun run build"
+  },
+  "devDependencies": {
+    "@types/react": "^18"
+  },
+  "peerDependencies": {
+    "typescript": "^5",
+    "react": "^18"
+  }
+}

package/src/index.ts

@@ -0,0 +1,91 @@
+import { useSyncExternalStore } from "react";
+
+interface Store<V extends Record<string, unknown>> {
+  value: V;
+  queueTimer: number;
+  listeners: Set<() => void>;
+  queues: number;
+}
+
+export interface CreateStoreOptions {
+  deepCompareFunc: (a: unknown, b: unknown) => boolean;
+}
+
+export function createStore<V extends Record<string, unknown>>(
+  defaultValue?: V,
+  options?: Partial<CreateStoreOptions>,
+) {
+  const opt: CreateStoreOptions = {
+    deepCompareFunc: Object.is,
+    ...options,
+  };
+  const store: Store<V> = {
+    queues: 0,
+    queueTimer: 0,
+    value: { ...defaultValue } as V,
+    listeners: new Set<() => void>(),
+  };
+
+  function subscribe(onStoreChange: () => void) {
+    store.listeners.add(onStoreChange);
+    return () => {
+      store.listeners.delete(onStoreChange);
+    };
+  }
+
+  function getSnapshot() {
+    return store.value;
+  }
+
+  function getServerSnapshot() {
+    return store.value;
+  }
+
+  function emitChanges() {
+    store.queues = 0;
+    store.listeners.forEach((listener) => listener());
+    if (store.queueTimer) {
+      window.clearTimeout(store.queueTimer);
+    }
+  }
+
+  function setStore(
+    newValues: Partial<V> | ((prev: V) => Partial<V>),
+    {
+      immediately,
+      deepCompare,
+    }: { immediately?: boolean; deepCompare?: boolean } = {},
+  ) {
+    const values =
+      typeof newValues === "function" ? newValues(store.value) : newValues;
+
+    if (deepCompare) {
+      Object.keys(values).forEach((key) => {
+        if (!opt.deepCompareFunc(values[key], store.value[key])) {
+          store.value = { ...store.value, [key]: values[key] };
+        }
+      });
+    } else {
+      store.value = { ...store.value, ...values };
+    }
+
+    if (immediately) {
+      emitChanges();
+    } else {
+      if (!store.queues) {
+        queueMicrotask(emitChanges);
+      }
+      store.queues++;
+    }
+  }
+
+  function useStore() {
+    return useSyncExternalStore<V>(subscribe, getSnapshot, getServerSnapshot);
+  }
+
+  function getStore() {
+    return store.value;
+  }
+
+  return [useStore, setStore, getStore] as const;
+}

package/tsconfig.json

@@ -0,0 +1,31 @@
+{
+  "compilerOptions": {
+    // Environment setup & latest features
+    "lib": ["ESNext", "DOM"],
+    "target": "ESNext",
+    "module": "Preserve",
+    "moduleDetection": "force",
+    "jsx": "react-jsx",
+    "allowJs": true,
+
+    // Bundler mode
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": false,
+    "verbatimModuleSyntax": true,
+    "noEmit": true,
+
+    // Best practices
+    "strict": true,
+    "skipLibCheck": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedIndexedAccess": true,
+    "noImplicitOverride": true,
+
+    // Some stricter flags (disabled by default)
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "noPropertyAccessFromIndexSignature": false,
+    "declaration": true,
+    "outDir": "dist"
+  }
+}