@derivesome/react 1.0.0

package/src/hooks/index.ts

@@ -0,0 +1 @@
+export * from './useDerived';

package/src/hooks/index.ts~

@@ -0,0 +1 @@
+export * from './useDerived';

package/src/hooks/useDerived.ts

@@ -0,0 +1,73 @@
+import { Reference, compare } from "@derivesome/core";
+import {
+  Dispatch,
+  SetStateAction,
+  useCallback,
+  useRef,
+  useSyncExternalStore,
+} from "react";
+
+export const useDerivedValue = <
+  D extends Reference<any>,
+  R = D extends Reference<infer K> ? K : never,
+>(
+  d: D,
+): R => {
+  const ref = useRef(d).current;
+  const old = useRef<R>(d.peek());
+
+  return useSyncExternalStore(
+    useCallback(
+      (callback) => {
+        const unsub = ref.subscribe((next) => {
+          callback();
+          old.current = next;
+        });
+        callback();
+        return () => {
+          unsub();
+        };
+      },
+      [ref],
+    ),
+    () => {
+      const nextSnap = ref.peek();
+
+      if (compare(old.current, nextSnap)) {
+        return old.current;
+      }
+
+      return nextSnap;
+    },
+  );
+};
+
+export const useSetDerived = <
+  D extends Reference<any>,
+  R = D extends Reference<infer K> ? K : never,
+>(
+  d: D,
+): Dispatch<SetStateAction<R>> => {
+  const ref = useRef(d).current;
+
+  const setter: Dispatch<SetStateAction<R>> = useCallback(
+    (fn) => {
+      ref.set(fn);
+    },
+    [ref],
+  );
+
+  return setter;
+};
+
+export const useDerived = <
+  D extends Reference<any>,
+  R = D extends Reference<infer K> ? K : never,
+>(
+  d: D,
+): [R, Dispatch<SetStateAction<R>>] => {
+  const ref = useRef(d).current;
+  const current = useDerivedValue<D, R>(ref);
+  const setter = useSetDerived<D, R>(ref);
+  return [current, setter];
+};

package/src/hooks/useDerived.ts~

@@ -0,0 +1,75 @@
+import { Reference, compare } from "@derivesome/core";
+import {
+  Dispatch,
+  SetStateAction,
+  useCallback,
+  useRef,
+  useSyncExternalStore,
+} from "react";
+
+export const useDerivedValue = <
+  D extends Reference<any>,
+  R = D extends Reference<infer K> ? K : never,
+>(
+  d: D,
+): R => {
+  const ref = useRef(d).current;
+  const old = useRef<R>(d.peek());
+  
+  return useSyncExternalStore(
+    useCallback(
+      (callback) => {
+        const unsub = ref.subscribe((next) => {
+          callback();
+          old.current = next;
+        });
+        callback();
+        return () => {
+          unsub();
+        };
+      },
+      [ref],
+    ),
+    () => {
+      const nextSnap = ref.peek();
+
+      if (compare(old.current, nextSnap)) {
+        return old.current;
+      }
+
+      return nextSnap;
+    },
+  );
+}
+
+export const useSetDerived = <
+  D extends Reference<any>,
+  R = D extends Reference<infer K> ? K : never,
+>(
+  d: D,
+): Dispatch<SetStateAction<R>> => {
+  const ref = useRef(d).current;
+
+  const setter: Dispatch<SetStateAction<R>> = useCallback(
+    (fn) => {
+      ref.set(fn);
+    },
+    [ref],
+  );
+
+  return setter;
+};
+
+export const useDerived = <
+  D extends Reference<any>,
+  R = D extends Reference<infer K> ? K : never,
+>(
+  d: D,
+): [R, Dispatch<SetStateAction<R>>] => {
+  const ref = useRef(d).current;
+  const current = useDerivedValue<D, R>(ref);
+  const setter = useSetDerived<D, R>(ref);
+  return [current, setter];
+};
+
+

package/src/index.ts

@@ -0,0 +1 @@
+export * from './hooks';

package/tsconfig.cjs.json

@@ -0,0 +1,8 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "module": "commonjs",
+    "moduleResolution": "node10",
+    "outDir": "./dist/cjs"
+  }
+}

package/tsconfig.json

@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "rootDir": "./src",
+    "outDir": "./dist/esm",
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "target": "esnext",
+    "lib": ["esnext"],
+    "types": ["node"],
+    "sourceMap": true,
+    "declaration": true,
+    "declarationMap": true,
+    "noUncheckedIndexedAccess": true,
+    "exactOptionalPropertyTypes": true,
+    "strict": true,
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "noUncheckedSideEffectImports": true,
+    "moduleDetection": "force",
+    "skipLibCheck": true
+  },
+  "include": ["./src/**/*.ts"],
+  "exclude": ["./src/**/*.test.ts"]
+}