synstate-react-hooks 1.0.1 → 2.0.0

package/README.md

@@ -110,3 +110,45 @@ const UserProfile = (): React.JSX.Element => {
     );
 };
 ```
+
+## Subscribing to Observables: `useObservableValue`
+
+Use `useObservableValue` to read any `Observable` — including derived ones produced by `pipe` / `combine` — from a React component. It is implemented on top of `useSyncExternalStore`, so the component re-renders whenever the source emits.
+
+### Overloads
+
+| Signature                                                           | Return type      | When to use                                                                                                                   |
+| ------------------------------------------------------------------- | ---------------- | ----------------------------------------------------------------------------------------------------------------------------- |
+| `useObservableValue<A>(obs: InitializedObservable<A>)`              | `A`              | The observable always has a current value (e.g. came from `createState`, or a `pipe` chain that preserves the initial value). |
+| `useObservableValue<A>(obs: Observable<A>)`                         | `A \| undefined` | The observable may not have emitted yet (no initial value).                                                                   |
+| `useObservableValue<A, B = A>(obs: Observable<A>, initialValue: B)` | `A \| B`         | Provide a fallback used while the observable has no value. Implemented via `Optional.unwrapOr`.                               |
+
+### Example
+
+```tsx
+import type * as React from 'react';
+import { map, type Observable } from 'synstate';
+import { createState, useObservableValue } from 'synstate-react-hooks';
+
+const [useCount, setCount, { state: count$ }] = createState(0);
+
+// Derived InitializedObservable — no fallback needed.
+const doubled$ = count$.pipe(map((n) => n * 2));
+
+// Imagine an Observable<string> that has no initial value
+// (e.g. one waiting on an async source).
+declare const userName$: Observable<string>;
+
+const Profile = (): React.JSX.Element => {
+    const doubled = useObservableValue(doubled$); // number
+
+    const userName = useObservableValue(userName$, 'Guest'); // string
+
+    return (
+        <div>
+            <p>{`Doubled count: ${doubled}`}</p>
+            <p>{`Hello, ${userName}`}</p>
+        </div>
+    );
+};
+```

package/dist/create-boolean-state.d.mts

@@ -1,5 +1,5 @@
 import { type InitializedObservable } from 'synstate';
-export declare const createBooleanState: (initialState: boolean) => readonly [useCurrentValue: () => boolean, Readonly<{
+export declare const createBooleanState: (initialState: boolean) => readonly [useCurrentValue: () => boolean, utils: Readonly<{
     state: InitializedObservable<boolean>;
     setTrue: () => void;
     setFalse: () => void;

package/dist/create-boolean-state.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"create-boolean-state.d.mts","sourceRoot":"","sources":["../src/create-boolean-state.mts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,qBAAqB,EAE3B,MAAM,UAAU,CAAC;AAGlB,eAAO,MAAM,kBAAkB,GAC7B,cAAc,OAAO,KACpB,SAAS,CACV,eAAe,EAAE,MAAM,OAAO,EAC9B,QAAQ,CAAC;IACP,KAAK,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAC;IACtC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,OAAO,CAAC;IACrC,MAAM,EAAE,MAAM,OAAO,CAAC;IACtB,WAAW,EAAE,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,OAAO,KAAK,OAAO,CAAC;IAC/D,UAAU,EAAE,MAAM,OAAO,CAAC;IAC1B,WAAW,EAAE,MAAM,OAAO,CAAC;IAC3B,YAAY,EAAE,OAAO,CAAC;CACvB,CAAC,CA+BH,CAAC"}
+{"version":3,"file":"create-boolean-state.d.mts","sourceRoot":"","sources":["../src/create-boolean-state.mts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,qBAAqB,EAE3B,MAAM,UAAU,CAAC;AAGlB,eAAO,MAAM,kBAAkB,iBACf,OAAO,KACpB,SAAS,CACV,eAAe,EAAE,MAAM,OAAO,EAC9B,KAAK,EAAE,QAAQ,CAAC;IACd,KAAK,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAC;IACtC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,OAAO,CAAC;IACrC,MAAM,EAAE,MAAM,OAAO,CAAC;IACtB,WAAW,EAAE,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,OAAO,KAAK,OAAO,CAAC;IAC/D,UAAU,EAAE,MAAM,OAAO,CAAC;IAC1B,WAAW,EAAE,MAAM,OAAO,CAAC;IAC3B,YAAY,EAAE,OAAO,CAAC;CACvB,CAAC,CA+BH,CAAC"}

package/dist/create-boolean-state.mjs

@@ -2,22 +2,33 @@ import { createBooleanState as createBooleanState$1 } from 'synstate';
 import { useObservableValue } from './use-observable-value.mjs';
 
 const createBooleanState = (initialState) => {
-    const [state, { setTrue, setFalse, setState, toggle, updateState, resetState, getSnapshot, },] = createBooleanState$1(initialState);
-    const useCurrentValue = () => useObservableValue(state);
-    return [
-        useCurrentValue,
-        {
-            state,
-            setTrue,
-            setFalse,
-            setState,
-            toggle,
-            updateState,
-            resetState,
-            getSnapshot,
-            initialState,
-        },
-    ];
+  const [
+    state,
+    {
+      setTrue,
+      setFalse,
+      setState,
+      toggle,
+      updateState,
+      resetState,
+      getSnapshot
+    }
+  ] = createBooleanState$1(initialState);
+  const useCurrentValue = () => useObservableValue(state);
+  return [
+    useCurrentValue,
+    {
+      state,
+      setTrue,
+      setFalse,
+      setState,
+      toggle,
+      updateState,
+      resetState,
+      getSnapshot,
+      initialState
+    }
+  ];
 };
 
 export { createBooleanState };

package/dist/create-boolean-state.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"create-boolean-state.mjs","sources":["../src/create-boolean-state.mts"],"sourcesContent":[null],"names":["createBooleanStateBase"],"mappings":";;;AAMO,MAAM,kBAAkB,GAAG,CAChC,YAAqB,KAcnB;IACF,MAAM,CACJ,KAAK,EACL,EACE,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,WAAW,EACX,UAAU,EACV,WAAW,GACZ,EACF,GAAGA,oBAAsB,CAAC,YAAY,CAAC;IAExC,MAAM,eAAe,GAAG,MAAe,kBAAkB,CAAC,KAAK,CAAC;IAEhE,OAAO;QACL,eAAe;AACf,QAAA;YACE,KAAK;YACL,OAAO;YACP,QAAQ;YACR,QAAQ;YACR,MAAM;YACN,WAAW;YACX,UAAU;YACV,WAAW;YACX,YAAY;AACb,SAAA;KACO;AACZ;;;;"}
+{"version":3,"file":"create-boolean-state.mjs","sources":["../src/create-boolean-state.mts"],"sourcesContent":["import {\n  type InitializedObservable,\n  createBooleanState as createBooleanStateBase,\n} from 'synstate';\nimport { useObservableValue } from './use-observable-value.mjs';\n\nexport const createBooleanState = (\n  initialState: boolean,\n): readonly [\n  useCurrentValue: () => boolean,\n  utils: Readonly<{\n    state: InitializedObservable<boolean>;\n    setTrue: () => void;\n    setFalse: () => void;\n    setState: (next: boolean) => boolean;\n    toggle: () => boolean;\n    updateState: (updateFn: (prev: boolean) => boolean) => boolean;\n    resetState: () => boolean;\n    getSnapshot: () => boolean;\n    initialState: boolean;\n  }>,\n] => {\n  const [\n    state,\n    {\n      setTrue,\n      setFalse,\n      setState,\n      toggle,\n      updateState,\n      resetState,\n      getSnapshot,\n    },\n  ] = createBooleanStateBase(initialState);\n\n  const useCurrentValue = (): boolean => useObservableValue(state);\n\n  return [\n    useCurrentValue,\n    {\n      state,\n      setTrue,\n      setFalse,\n      setState,\n      toggle,\n      updateState,\n      resetState,\n      getSnapshot,\n      initialState,\n    },\n  ] as const;\n};\n"],"names":["createBooleanStateBase"],"mappings":";;;AAMO,MAAM,kBAAA,GAAqB,CAChC,YAAA,KAcG;AACH,EAAA,MAAM;AAAA,IACJ,KAAA;AAAA,IACA;AAAA,MACE,OAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA;AACF,GACF,GAAIA,qBAAuB,YAAY,CAAA;AAEvC,EAAA,MAAM,eAAA,GAAkB,MAAe,kBAAA,CAAmB,KAAK,CAAA;AAE/D,EAAA,OAAO;AAAA,IACL,eAAA;AAAA,IACA;AAAA,MACE,KAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA;AAAA,MACA;AAAA;AACF,GACF;AACF;;;;"}

package/dist/create-reducer.d.mts

@@ -1,6 +1,6 @@
 import { type InitializedObservable } from 'synstate';
 import { type Reducer } from 'ts-type-forge';
-export declare const createReducer: <S, A>(reducer: Reducer<S, A>, initialState: S) => readonly [useCurrentValue: () => S, dispatch: (action: A) => S, Readonly<{
+export declare const createReducer: <S, A>(reducer: Reducer<S, A>, initialState: S) => readonly [useCurrentValue: () => S, dispatch: (action: A) => S, utils: Readonly<{
     state: InitializedObservable<S>;
     getSnapshot: () => S;
     initialState: S;

package/dist/create-reducer.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"create-reducer.d.mts","sourceRoot":"","sources":["../src/create-reducer.mts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AAG7C,eAAO,MAAM,aAAa,GAAI,CAAC,EAAE,CAAC,EAChC,SAAS,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC,EACtB,cAAc,CAAC,KACd,SAAS,CACV,eAAe,EAAE,MAAM,CAAC,EACxB,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAC1B,QAAQ,CAAC;IACP,KAAK,EAAE,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAChC,WAAW,EAAE,MAAM,CAAC,CAAC;IACrB,YAAY,EAAE,CAAC,CAAC;CACjB,CAAC,CAUH,CAAC"}
+{"version":3,"file":"create-reducer.d.mts","sourceRoot":"","sources":["../src/create-reducer.mts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AAG7C,eAAO,MAAM,aAAa,GAAI,CAAC,EAAE,CAAC,WACvB,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC,gBACR,CAAC,KACd,SAAS,CACV,eAAe,EAAE,MAAM,CAAC,EACxB,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAC1B,KAAK,EAAE,QAAQ,CAAC;IACd,KAAK,EAAE,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAChC,WAAW,EAAE,MAAM,CAAC,CAAC;IACrB,YAAY,EAAE,CAAC,CAAC;CACjB,CAAC,CAUH,CAAC"}

package/dist/create-reducer.mjs

@@ -2,9 +2,12 @@ import { createReducer as createReducer$1 } from 'synstate';
 import { useObservableValue } from './use-observable-value.mjs';
 
 const createReducer = (reducer, initialState) => {
-    const [state, dispatch, { getSnapshot }] = createReducer$1(reducer, initialState);
-    const useCurrentValue = () => useObservableValue(state);
-    return [useCurrentValue, dispatch, { state, getSnapshot, initialState }];
+  const [state, dispatch, { getSnapshot }] = createReducer$1(
+    reducer,
+    initialState
+  );
+  const useCurrentValue = () => useObservableValue(state);
+  return [useCurrentValue, dispatch, { state, getSnapshot, initialState }];
 };
 
 export { createReducer };

package/dist/create-reducer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"create-reducer.mjs","sources":["../src/create-reducer.mts"],"sourcesContent":[null],"names":["createReducerBase"],"mappings":";;;MAOa,aAAa,GAAG,CAC3B,OAAsB,EACtB,YAAe,KASb;AACF,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,EAAE,WAAW,EAAE,CAAC,GAAGA,eAAiB,CAC1D,OAAO,EACP,YAAY,CACb;IAED,MAAM,eAAe,GAAG,MAAS,kBAAkB,CAAC,KAAK,CAAC;AAE1D,IAAA,OAAO,CAAC,eAAe,EAAE,QAAQ,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,CAAC;AAC1E;;;;"}
+{"version":3,"file":"create-reducer.mjs","sources":["../src/create-reducer.mts"],"sourcesContent":["import {\n  createReducer as createReducerBase,\n  type InitializedObservable,\n} from 'synstate';\nimport { type Reducer } from 'ts-type-forge';\nimport { useObservableValue } from './use-observable-value.mjs';\n\nexport const createReducer = <S, A>(\n  reducer: Reducer<S, A>,\n  initialState: S,\n): readonly [\n  useCurrentValue: () => S,\n  dispatch: (action: A) => S,\n  utils: Readonly<{\n    state: InitializedObservable<S>;\n    getSnapshot: () => S;\n    initialState: S;\n  }>,\n] => {\n  const [state, dispatch, { getSnapshot }] = createReducerBase(\n    reducer,\n    initialState,\n  );\n\n  const useCurrentValue = (): S => useObservableValue(state);\n\n  return [useCurrentValue, dispatch, { state, getSnapshot, initialState }];\n};\n"],"names":["createReducerBase"],"mappings":";;;AAOO,MAAM,aAAA,GAAgB,CAC3B,OAAA,EACA,YAAA,KASG;AACH,EAAA,MAAM,CAAC,KAAA,EAAO,QAAA,EAAU,EAAE,WAAA,EAAa,CAAA,GAAIA,eAAA;AAAA,IACzC,OAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,MAAM,eAAA,GAAkB,MAAS,kBAAA,CAAmB,KAAK,CAAA;AAEzD,EAAA,OAAO,CAAC,eAAA,EAAiB,QAAA,EAAU,EAAE,KAAA,EAAO,WAAA,EAAa,cAAc,CAAA;AACzE;;;;"}

package/dist/create-state.d.mts

@@ -1,5 +1,5 @@
 import { type InitializedObservable } from 'synstate';
-export declare const createState: <S>(initialState: S) => readonly [useCurrentValue: () => S, setState: (v: S) => S, Readonly<{
+export declare const createState: <S>(initialState: S) => readonly [useCurrentValue: () => S, setState: (v: S) => S, utils: Readonly<{
     state: InitializedObservable<S>;
     updateState: (updateFn: (prev: S) => S) => S;
     resetState: () => S;

package/dist/create-state.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"create-state.d.mts","sourceRoot":"","sources":["../src/create-state.mts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,UAAU,CAAC;AAGlB,eAAO,MAAM,WAAW,GAAI,CAAC,EAC3B,cAAc,CAAC,KACd,SAAS,CACV,eAAe,EAAE,MAAM,CAAC,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,EACrB,QAAQ,CAAC;IACP,KAAK,EAAE,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAChC,WAAW,EAAE,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAC7C,UAAU,EAAE,MAAM,CAAC,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC,CAAC;IACrB,YAAY,EAAE,CAAC,CAAC;CACjB,CAAC,CAkBH,CAAC"}
+{"version":3,"file":"create-state.d.mts","sourceRoot":"","sources":["../src/create-state.mts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,UAAU,CAAC;AAGlB,eAAO,MAAM,WAAW,GAAI,CAAC,gBACb,CAAC,KACd,SAAS,CACV,eAAe,EAAE,MAAM,CAAC,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,EACrB,KAAK,EAAE,QAAQ,CAAC;IACd,KAAK,EAAE,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAChC,WAAW,EAAE,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAC7C,UAAU,EAAE,MAAM,CAAC,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC,CAAC;IACrB,YAAY,EAAE,CAAC,CAAC;CACjB,CAAC,CAkBH,CAAC"}

package/dist/create-state.mjs

@@ -2,19 +2,19 @@ import { createState as createState$1 } from 'synstate';
 import { useObservableValue } from './use-observable-value.mjs';
 
 const createState = (initialState) => {
-    const [state, setState, { updateState, resetState, getSnapshot }] = createState$1(initialState);
-    const useCurrentValue = () => useObservableValue(state);
-    return [
-        useCurrentValue,
-        setState,
-        {
-            state,
-            updateState,
-            resetState,
-            getSnapshot,
-            initialState,
-        },
-    ];
+  const [state, setState, { updateState, resetState, getSnapshot }] = createState$1(initialState);
+  const useCurrentValue = () => useObservableValue(state);
+  return [
+    useCurrentValue,
+    setState,
+    {
+      state,
+      updateState,
+      resetState,
+      getSnapshot,
+      initialState
+    }
+  ];
 };
 
 export { createState };

package/dist/create-state.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"create-state.mjs","sources":["../src/create-state.mts"],"sourcesContent":[null],"names":["createStateBase"],"mappings":";;;AAMO,MAAM,WAAW,GAAG,CACzB,YAAe,KAWb;AACF,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC,GAC/DA,aAAe,CAAC,YAAY,CAAC;IAE/B,MAAM,eAAe,GAAG,MAAS,kBAAkB,CAAC,KAAK,CAAC;IAE1D,OAAO;QACL,eAAe;QACf,QAAQ;AACR,QAAA;YACE,KAAK;YACL,WAAW;YACX,UAAU;YACV,WAAW;YACX,YAAY;AACb,SAAA;KACO;AACZ;;;;"}
+{"version":3,"file":"create-state.mjs","sources":["../src/create-state.mts"],"sourcesContent":["import {\n  createState as createStateBase,\n  type InitializedObservable,\n} from 'synstate';\nimport { useObservableValue } from './use-observable-value.mjs';\n\nexport const createState = <S,>(\n  initialState: S,\n): readonly [\n  useCurrentValue: () => S,\n  setState: (v: S) => S,\n  utils: Readonly<{\n    state: InitializedObservable<S>;\n    updateState: (updateFn: (prev: S) => S) => S;\n    resetState: () => S;\n    getSnapshot: () => S;\n    initialState: S;\n  }>,\n] => {\n  const [state, setState, { updateState, resetState, getSnapshot }] =\n    createStateBase(initialState);\n\n  const useCurrentValue = (): S => useObservableValue(state);\n\n  return [\n    useCurrentValue,\n    setState,\n    {\n      state,\n      updateState,\n      resetState,\n      getSnapshot,\n      initialState,\n    },\n  ] as const;\n};\n"],"names":["createStateBase"],"mappings":";;;AAMO,MAAM,WAAA,GAAc,CACzB,YAAA,KAWG;AACH,EAAA,MAAM,CAAC,KAAA,EAAO,QAAA,EAAU,EAAE,WAAA,EAAa,YAAY,WAAA,EAAa,CAAA,GAC9DA,aAAA,CAAgB,YAAY,CAAA;AAE9B,EAAA,MAAM,eAAA,GAAkB,MAAS,kBAAA,CAAmB,KAAK,CAAA;AAEzD,EAAA,OAAO;AAAA,IACL,eAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,MACE,KAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA;AAAA,MACA;AAAA;AACF,GACF;AACF;;;;"}

package/dist/use-observable-effect.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"use-observable-effect.d.mts","sourceRoot":"","sources":["../src/use-observable-effect.mts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAE3C,eAAO,MAAM,mBAAmB,GAAI,CAAC,EACnC,aAAa,UAAU,CAAC,CAAC,CAAC,EAC1B,gBAAgB,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,KAC7B,IAQF,CAAC"}
+{"version":3,"file":"use-observable-effect.d.mts","sourceRoot":"","sources":["../src/use-observable-effect.mts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAE3C,eAAO,MAAM,mBAAmB,GAAI,CAAC,eACtB,UAAU,CAAC,CAAC,CAAC,kBACV,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,KAC7B,IAQF,CAAC"}

package/dist/use-observable-effect.mjs

@@ -1,12 +1,12 @@
 import * as React from 'react';
 
 const useObservableEffect = (observable$, subscriptionFn) => {
-    React.useEffect(() => {
-        const s = observable$.subscribe(subscriptionFn);
-        return () => {
-            s.unsubscribe();
-        };
-    }, []);
+  React.useEffect(() => {
+    const s = observable$.subscribe(subscriptionFn);
+    return () => {
+      s.unsubscribe();
+    };
+  }, []);
 };
 
 export { useObservableEffect };

package/dist/use-observable-effect.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-observable-effect.mjs","sources":["../src/use-observable-effect.mts"],"sourcesContent":[null],"names":[],"mappings":";;MAGa,mBAAmB,GAAG,CACjC,WAA0B,EAC1B,cAA8B,KACtB;AACR,IAAA,KAAK,CAAC,SAAS,CAAC,MAAK;QACnB,MAAM,CAAC,GAAG,WAAW,CAAC,SAAS,CAAC,cAAc,CAAC;AAE/C,QAAA,OAAO,MAAK;YACV,CAAC,CAAC,WAAW,EAAE;AACjB,QAAA,CAAC;IACH,CAAC,EAAE,EAAE,CAAC;AACR;;;;"}
+{"version":3,"file":"use-observable-effect.mjs","sources":["../src/use-observable-effect.mts"],"sourcesContent":["import * as React from 'react';\nimport { type Observable } from 'synstate';\n\nexport const useObservableEffect = <A,>(\n  observable$: Observable<A>,\n  subscriptionFn: (v: A) => void,\n): void => {\n  React.useEffect(() => {\n    const s = observable$.subscribe(subscriptionFn);\n\n    return () => {\n      s.unsubscribe();\n    };\n  }, []);\n};\n"],"names":[],"mappings":";;AAGO,MAAM,mBAAA,GAAsB,CACjC,WAAA,EACA,cAAA,KACS;AACT,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,MAAM,CAAA,GAAI,WAAA,CAAY,SAAA,CAAU,cAAc,CAAA;AAE9C,IAAA,OAAO,MAAM;AACX,MAAA,CAAA,CAAE,WAAA,EAAY;AAAA,IAChB,CAAA;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AACP;;;;"}

package/dist/use-observable-value.mjs

@@ -2,11 +2,14 @@ import * as React from 'react';
 import { Optional } from 'ts-data-forge';
 
 function useObservableValue(observable$, initialValue) {
-    const value = React.useSyncExternalStore((onStoreChange) => {
-        const { unsubscribe } = observable$.subscribe(onStoreChange);
-        return unsubscribe;
-    }, () => observable$.getSnapshot());
-    return Optional.unwrapOr(value, initialValue);
+  const value = React.useSyncExternalStore(
+    (onStoreChange) => {
+      const { unsubscribe } = observable$.subscribe(onStoreChange);
+      return unsubscribe;
+    },
+    () => observable$.getSnapshot()
+  );
+  return Optional.unwrapOr(value, initialValue);
 }
 
 export { useObservableValue };

package/dist/use-observable-value.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-observable-value.mjs","sources":["../src/use-observable-value.mts"],"sourcesContent":[null],"names":[],"mappings":";;;AAoBM,SAAU,kBAAkB,CAChC,WAA0B,EAC1B,YAAgB,EAAA;IAEhB,MAAM,KAAK,GAAG,KAAK,CAAC,oBAAoB,CACtC,CAAC,aAAyB,KAAI;QAC5B,MAAM,EAAE,WAAW,EAAE,GAAG,WAAW,CAAC,SAAS,CAAC,aAAa,CAAC;AAE5D,QAAA,OAAO,WAAW;IACpB,CAAC,EACD,MAAM,WAAW,CAAC,WAAW,EAAE,CAChC;IAED,OAAO,QAAQ,CAAC,QAAQ,CAAC,KAAK,EAAE,YAAY,CAAC;AAC/C;;;;"}
+{"version":3,"file":"use-observable-value.mjs","sources":["../src/use-observable-value.mts"],"sourcesContent":["import * as React from 'react';\nimport { type InitializedObservable, type Observable } from 'synstate';\nimport { Optional } from 'ts-data-forge';\n\nexport function useObservableValue<A, B = A>(\n  observable$: Observable<A>,\n  initialValue: B,\n): A | B;\n\nexport function useObservableValue<A>(observable$: InitializedObservable<A>): A;\n\nexport function useObservableValue<A>(\n  observable$: Observable<A>,\n): A | undefined;\n\nexport function useObservableValue<A, B = A>(\n  observable$: Observable<A>,\n  initialValue: B,\n): A | B;\n\nexport function useObservableValue<A, B = A>(\n  observable$: Observable<A>,\n  initialValue?: B,\n): A | B | undefined {\n  const value = React.useSyncExternalStore(\n    (onStoreChange: () => void) => {\n      const { unsubscribe } = observable$.subscribe(onStoreChange);\n\n      return unsubscribe;\n    },\n    () => observable$.getSnapshot(),\n  );\n\n  return Optional.unwrapOr(value, initialValue);\n}\n"],"names":[],"mappings":";;;AAoBO,SAAS,kBAAA,CACd,aACA,YAAA,EACmB;AACnB,EAAA,MAAM,QAAQ,KAAA,CAAM,oBAAA;AAAA,IAClB,CAAC,aAAA,KAA8B;AAC7B,MAAA,MAAM,EAAE,WAAA,EAAY,GAAI,WAAA,CAAY,UAAU,aAAa,CAAA;AAE3D,MAAA,OAAO,WAAA;AAAA,IACT,CAAA;AAAA,IACA,MAAM,YAAY,WAAA;AAAY,GAChC;AAEA,EAAA,OAAO,QAAA,CAAS,QAAA,CAAS,KAAA,EAAO,YAAY,CAAA;AAC9C;;;;"}

package/dist/use-value-as-observable.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"use-value-as-observable.d.mts","sourceRoot":"","sources":["../src/use-value-as-observable.mts"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,UAAU,EAEhB,MAAM,UAAU,CAAC;AAElB,eAAO,MAAM,oBAAoB,GAAI,CAAC,EAAG,OAAO,CAAC,KAAG,UAAU,CAAC,CAAC,CA0B/D,CAAC"}
+{"version":3,"file":"use-value-as-observable.d.mts","sourceRoot":"","sources":["../src/use-value-as-observable.mts"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,UAAU,EAEhB,MAAM,UAAU,CAAC;AAElB,eAAO,MAAM,oBAAoB,GAAI,CAAC,SAAU,CAAC,KAAG,UAAU,CAAC,CAAC,CA0B/D,CAAC"}

package/dist/use-value-as-observable.mjs

@@ -2,19 +2,25 @@ import * as React from 'react';
 import { source, withInitialValue } from 'synstate';
 
 const useValueAsObservable = (input) => {
-    const sourceObservable = React.useMemo(source, []);
-    const state = React.useMemo(() => sourceObservable.pipe(withInitialValue(input)), []);
-    React.useEffect(() => () => {
-        state.complete();
-    }, []);
-    const setState = React.useCallback((nextState) => {
-        sourceObservable.next(nextState);
-        return nextState;
-    }, []);
-    React.useEffect(() => {
-        setState(input);
-    }, [input]);
-    return state;
+  const sourceObservable = React.useMemo(source, []);
+  const state = React.useMemo(
+    () => sourceObservable.pipe(withInitialValue(input)),
+    []
+  );
+  React.useEffect(
+    () => () => {
+      state.complete();
+    },
+    []
+  );
+  const setState = React.useCallback((nextState) => {
+    sourceObservable.next(nextState);
+    return nextState;
+  }, []);
+  React.useEffect(() => {
+    setState(input);
+  }, [input]);
+  return state;
 };
 
 export { useValueAsObservable };

package/dist/use-value-as-observable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-value-as-observable.mjs","sources":["../src/use-value-as-observable.mts"],"sourcesContent":[null],"names":[],"mappings":";;;AAQO,MAAM,oBAAoB,GAAG,CAAK,KAAQ,KAAmB;IAClE,MAAM,gBAAgB,GAAG,KAAK,CAAC,OAAO,CAAsB,MAAM,EAAE,EAAE,CAAC;IAEvE,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CACzB,MAAM,gBAAgB,CAAC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,EACpD,EAAE,CACH;AAED,IAAA,KAAK,CAAC,SAAS,CACb,MAAM,MAAK;QACT,KAAK,CAAC,QAAQ,EAAE;IAClB,CAAC,EACD,EAAE,CACH;IAED,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,SAAY,KAAO;AACrD,QAAA,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC;AAEhC,QAAA,OAAO,SAAS;IAClB,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,KAAK,CAAC,SAAS,CAAC,MAAK;QACnB,QAAQ,CAAC,KAAK,CAAC;AACjB,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AAEX,IAAA,OAAO,KAAK;AACd;;;;"}
+{"version":3,"file":"use-value-as-observable.mjs","sources":["../src/use-value-as-observable.mts"],"sourcesContent":["import * as React from 'react';\nimport {\n  source,\n  withInitialValue,\n  type Observable,\n  type SourceObservable,\n} from 'synstate';\n\nexport const useValueAsObservable = <A,>(input: A): Observable<A> => {\n  const sourceObservable = React.useMemo<SourceObservable<A>>(source, []);\n\n  const state = React.useMemo(\n    () => sourceObservable.pipe(withInitialValue(input)),\n    [],\n  );\n\n  React.useEffect(\n    () => () => {\n      state.complete();\n    },\n    [],\n  );\n\n  const setState = React.useCallback((nextState: A): A => {\n    sourceObservable.next(nextState);\n\n    return nextState;\n  }, []);\n\n  React.useEffect(() => {\n    setState(input);\n  }, [input]);\n\n  return state;\n};\n"],"names":[],"mappings":";;;AAQO,MAAM,oBAAA,GAAuB,CAAK,KAAA,KAA4B;AACnE,EAAA,MAAM,gBAAA,GAAmB,KAAA,CAAM,OAAA,CAA6B,MAAA,EAAQ,EAAE,CAAA;AAEtE,EAAA,MAAM,QAAQ,KAAA,CAAM,OAAA;AAAA,IAClB,MAAM,gBAAA,CAAiB,IAAA,CAAK,gBAAA,CAAiB,KAAK,CAAC,CAAA;AAAA,IACnD;AAAC,GACH;AAEA,EAAA,KAAA,CAAM,SAAA;AAAA,IACJ,MAAM,MAAM;AACV,MAAA,KAAA,CAAM,QAAA,EAAS;AAAA,IACjB,CAAA;AAAA,IACA;AAAC,GACH;AAEA,EAAA,MAAM,QAAA,GAAW,KAAA,CAAM,WAAA,CAAY,CAAC,SAAA,KAAoB;AACtD,IAAA,gBAAA,CAAiB,KAAK,SAAS,CAAA;AAE/B,IAAA,OAAO,SAAA;AAAA,EACT,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,QAAA,CAAS,KAAK,CAAA;AAAA,EAChB,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,OAAO,KAAA;AACT;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "synstate-react-hooks",
-  "version": "1.0.1",
+  "version": "2.0.0",
   "description": "Type-safe State Management Library for TypeScript/JavaScript",
   "repository": {
     "type": "git",
@@ -27,15 +27,15 @@
     "LICENSE"
   ],
   "dependencies": {
-    "ts-data-forge": "6.9.4",
-    "ts-type-forge": "3.0.0",
-    "synstate": "1.0.1"
+    "ts-data-forge": "^14.2.0",
+    "ts-type-forge": "^9.2.0",
+    "synstate": "2.0.0"
   },
   "devDependencies": {
     "@types/argparse": "2.0.17",
-    "@types/react": "19.2.14",
-    "argparse": "2.0.1",
-    "react": "19.2.5"
+    "@types/react": "19.2.18",
+    "argparse": "3.0.0",
+    "react": "19.2.8"
   },
   "peerDependencies": {
     "react": ">=18.0.0"
@@ -49,7 +49,8 @@
     "doc": "run-s doc:embed doc:embed:jsdoc fmt",
     "doc:embed": "tsx ./scripts/cmd/embed-examples.mts",
     "doc:embed:jsdoc": "tsx ./scripts/cmd/embed-examples-in-jsdoc.mts",
-    "fmt": "format-uncommitted",
+    "fmt": "format-uncommitted --cwd .",
+    "fmt:diff": "format-diff-from origin/main --cwd .",
     "fmt:full": "pnpm run z:prettier .",
     "gen:re-export": "run-s gen:re-export:script fmt",
     "gen:re-export:script": "tsx ./scripts/cmd/generate-re-export-script.mts",
@@ -63,10 +64,9 @@
     "test:cov:ui": "vite preview --outDir ./coverage",
     "test:ui": "pnpm run z:vitest:node --ui",
     "testw": "pnpm run z:vitest:node watch",
-    "tsc": "tsc --noEmit",
-    "tscw": "tsc --noEmit --watch",
-    "type-check": "tsc --noEmit",
-    "update-packages": "pnpm update --latest",
+    "tsc": "node ../../node_modules/typescript-native/bin/tsc --noEmit",
+    "tscw": "node ../../node_modules/typescript-native/bin/tsc --noEmit --watch",
+    "type-check": "node ../../node_modules/typescript-native/bin/tsc --noEmit",
     "z:prettier": "prettier --config ../../.prettierrc --ignore-path ../../.prettierignore --ignore-path ../../.gitignore --ignore-unknown --no-error-on-unmatched-pattern --write",
     "z:vitest": "vitest --config ./configs/vitest.config.mts",
     "z:vitest:node": "pnpm run z:vitest --project='Node.js'"

package/src/create-boolean-state.mts

@@ -8,7 +8,7 @@ export const createBooleanState = (
   initialState: boolean,
 ): readonly [
   useCurrentValue: () => boolean,
-  Readonly<{
+  utils: Readonly<{
     state: InitializedObservable<boolean>;
     setTrue: () => void;
     setFalse: () => void;

package/src/create-reducer.mts

@@ -11,7 +11,7 @@ export const createReducer = <S, A>(
 ): readonly [
   useCurrentValue: () => S,
   dispatch: (action: A) => S,
-  Readonly<{
+  utils: Readonly<{
     state: InitializedObservable<S>;
     getSnapshot: () => S;
     initialState: S;

package/src/create-state.mts

@@ -9,7 +9,7 @@ export const createState = <S,>(
 ): readonly [
   useCurrentValue: () => S,
   setState: (v: S) => S,
-  Readonly<{
+  utils: Readonly<{
     state: InitializedObservable<S>;
     updateState: (updateFn: (prev: S) => S) => S;
     resetState: () => S;