react-rx 4.1.2-canary.9 → 4.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +38 -42
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +0 -2
- package/dist/index.d.ts +0 -2
- package/dist/index.js +38 -42
- package/dist/index.js.map +1 -1
- package/package.json +12 -10
- package/src/__tests__/useObservable.test.ts +51 -1
- package/src/useObservable.ts +61 -59
package/dist/index.cjs
CHANGED
|
@@ -5,57 +5,53 @@ function getValue(value) {
|
|
|
5
5
|
return typeof value == "function" ? value() : value;
|
|
6
6
|
}
|
|
7
7
|
const cache = /* @__PURE__ */ new WeakMap();
|
|
8
|
-
function useObservable(observable, initialValue
|
|
9
|
-
const $ = reactCompilerRuntime.c(
|
|
8
|
+
function useObservable(observable, initialValue) {
|
|
9
|
+
const $ = reactCompilerRuntime.c(9);
|
|
10
10
|
let t0;
|
|
11
11
|
if (!cache.has(observable)) {
|
|
12
|
-
const
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
12
|
+
const state = {
|
|
13
|
+
didEmit: !1
|
|
14
|
+
}, entry = {
|
|
15
|
+
state,
|
|
16
|
+
observable: observable.pipe(operators.map((value) => ({
|
|
17
|
+
snapshot: value,
|
|
18
|
+
error: void 0
|
|
19
|
+
})), rxjs.catchError((error) => rxjs.of({
|
|
20
|
+
snapshot: void 0,
|
|
21
|
+
error
|
|
22
|
+
})), operators.tap((t12) => {
|
|
23
|
+
const {
|
|
24
|
+
snapshot,
|
|
25
|
+
error: error_0
|
|
26
|
+
} = t12;
|
|
27
|
+
state.didEmit = !0, state.snapshot = snapshot, state.error = error_0;
|
|
28
|
+
}), operators.map((value_0) => {
|
|
29
|
+
}), rxjs.finalize(() => cache.delete(observable)), rxjs.share({
|
|
30
|
+
resetOnRefCountZero: () => rxjs.timer(0, rxjs.asapScheduler)
|
|
31
|
+
})),
|
|
32
|
+
getSnapshot: (initialValue_0) => {
|
|
33
|
+
if (state.error)
|
|
34
|
+
throw state.error;
|
|
35
|
+
return state.didEmit ? state.snapshot : getValue(initialValue_0);
|
|
36
|
+
}
|
|
37
|
+
};
|
|
38
|
+
entry.observable.subscribe().unsubscribe(), cache.set(observable, entry);
|
|
29
39
|
}
|
|
30
40
|
let t1;
|
|
31
|
-
$[0] !== observable ? (t1 = cache.get(observable), $[0] = observable, $[1] = t1) : t1 = $[1];
|
|
32
|
-
const instance =
|
|
41
|
+
$[0] !== observable ? (t1 = cache.get(observable), $[0] = observable, $[1] = t1) : t1 = $[1], t0 = t1;
|
|
42
|
+
const instance = t0;
|
|
33
43
|
let t2;
|
|
34
|
-
$[2] !==
|
|
35
|
-
|
|
36
|
-
const subscription_0 = instance.observable.subscribe(() => {
|
|
37
|
-
debug && console.log("onStoreChange", observable), onStoreChange();
|
|
38
|
-
});
|
|
44
|
+
$[2] !== instance.observable ? (t2 = (onStoreChange) => {
|
|
45
|
+
const subscription_0 = instance.observable.subscribe(onStoreChange);
|
|
39
46
|
return () => {
|
|
40
|
-
|
|
47
|
+
subscription_0.unsubscribe();
|
|
41
48
|
};
|
|
42
|
-
}, $[2] =
|
|
49
|
+
}, $[2] = instance.observable, $[3] = t2) : t2 = $[3];
|
|
50
|
+
const subscribe = t2;
|
|
43
51
|
let t3;
|
|
44
|
-
$[
|
|
45
|
-
if (debug && console.log("getSnapshot", instance.snapshot, instance.error), instance.error)
|
|
46
|
-
throw instance.error;
|
|
47
|
-
return instance.snapshot;
|
|
48
|
-
}, $[6] = debug, $[7] = instance.snapshot, $[8] = instance.error, $[9] = t3) : t3 = $[9];
|
|
52
|
+
$[4] !== instance || $[5] !== initialValue ? (t3 = () => instance.getSnapshot(initialValue), $[4] = instance, $[5] = initialValue, $[6] = t3) : t3 = $[6];
|
|
49
53
|
let t4;
|
|
50
|
-
$[
|
|
51
|
-
subscribe: t2,
|
|
52
|
-
getSnapshot: t3
|
|
53
|
-
}, $[10] = t2, $[11] = t3, $[12] = t4) : t4 = $[12], t0 = t4;
|
|
54
|
-
const store = t0;
|
|
55
|
-
let t5;
|
|
56
|
-
$[13] !== store || $[14] !== initialValue ? (t5 = () => store.getSnapshot() ?? getValue(initialValue), $[13] = store, $[14] = initialValue, $[15] = t5) : t5 = $[15];
|
|
57
|
-
let t6;
|
|
58
|
-
return $[16] !== initialValue ? (t6 = typeof initialValue > "u" ? void 0 : () => getValue(initialValue), $[16] = initialValue, $[17] = t6) : t6 = $[17], react.useSyncExternalStore(store.subscribe, t5, t6);
|
|
54
|
+
return $[7] !== initialValue ? (t4 = typeof initialValue > "u" ? void 0 : () => getValue(initialValue), $[7] = initialValue, $[8] = t4) : t4 = $[8], react.useSyncExternalStore(subscribe, t3, t4);
|
|
59
55
|
}
|
|
60
56
|
function useObservableEvent(handleEvent) {
|
|
61
57
|
const $ = reactCompilerRuntime.c(6), [t0] = react.useState(_temp), [calls$, call] = t0;
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/useObservable.ts","../src/useObservableEvent.ts"],"sourcesContent":["import {useMemo, useSyncExternalStore} from 'react'\nimport {\n asapScheduler,\n catchError,\n finalize,\n type Observable,\n type ObservedValueOf,\n of,\n share,\n timer,\n} from 'rxjs'\nimport {map, tap} from 'rxjs/operators'\n\nfunction getValue<T>(value: T): T extends () => infer U ? U : T {\n return typeof value === 'function' ? value() : value\n}\n\ninterface CacheRecord<T> {\n observable: Observable<void>\n
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../src/useObservable.ts","../src/useObservableEvent.ts"],"sourcesContent":["import {useCallback, useMemo, useSyncExternalStore} from 'react'\nimport {\n asapScheduler,\n catchError,\n finalize,\n type Observable,\n type ObservedValueOf,\n of,\n share,\n timer,\n} from 'rxjs'\nimport {map, tap} from 'rxjs/operators'\n\nfunction getValue<T>(value: T): T extends () => infer U ? U : T {\n return typeof value === 'function' ? value() : value\n}\n\ninterface ObservableState<T> {\n didEmit: boolean\n snapshot?: T\n error?: unknown\n}\n\ninterface CacheRecord<T> {\n observable: Observable<void>\n state: {\n didEmit: boolean\n snapshot?: T\n error?: unknown\n }\n getSnapshot: (initialValue: unknown) => T\n}\n\nconst cache = new WeakMap<Observable<any>, CacheRecord<any>>()\n\n/** @public */\nexport function useObservable<ObservableType extends Observable<any>>(\n observable: ObservableType,\n initialValue: ObservedValueOf<ObservableType> | (() => ObservedValueOf<ObservableType>),\n): ObservedValueOf<ObservableType>\n/** @public */\nexport function useObservable<ObservableType extends Observable<any>>(\n observable: ObservableType,\n): undefined | ObservedValueOf<ObservableType>\n/** @public */\nexport function useObservable<ObservableType extends Observable<any>, InitialValue>(\n observable: ObservableType,\n initialValue: InitialValue | (() => InitialValue),\n): InitialValue | ObservedValueOf<ObservableType>\n/** @public */\nexport function useObservable<ObservableType extends Observable<any>, InitialValue>(\n observable: ObservableType,\n initialValue?: InitialValue | (() => InitialValue),\n): InitialValue | ObservedValueOf<ObservableType> {\n const instance = useMemo(() => {\n if (!cache.has(observable)) {\n // This separate object is used as a stable reference to the cache entry's snapshot and error.\n // It's used by the `getSnapshot` closure.\n const state: ObservableState<ObservedValueOf<ObservableType>> = {\n didEmit: false,\n }\n const entry: CacheRecord<ObservedValueOf<ObservableType>> = {\n state,\n observable: observable.pipe(\n map((value) => ({snapshot: value, error: undefined})),\n catchError((error) => of({snapshot: undefined, error})),\n tap(({snapshot, error}) => {\n state.didEmit = true\n state.snapshot = snapshot\n state.error = error\n }),\n // Note: any value or error emitted by the provided observable will be mapped to the cache entry's mutable state\n // and the observable is thereafter only used as a notifier to call `onStoreChange`, hence the `void` return type.\n map((value) => void value),\n // Ensure that the cache entry is deleted when the observable completes or errors.\n finalize(() => cache.delete(observable)),\n share({resetOnRefCountZero: () => timer(0, asapScheduler)}),\n ),\n getSnapshot: (initialValue) => {\n if (state.error) {\n throw state.error\n }\n return (\n state.didEmit ? state.snapshot : getValue(initialValue)\n ) as ObservedValueOf<ObservableType>\n },\n }\n\n // Eagerly subscribe to sync set `state.snapshot` to what the observable returns, and keep the observable alive until the component unmounts.\n const subscription = entry.observable.subscribe()\n subscription.unsubscribe()\n\n cache.set(observable, entry)\n }\n return cache.get(observable)!\n }, [observable])\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n const subscription = instance.observable.subscribe(onStoreChange)\n return () => {\n subscription.unsubscribe()\n }\n },\n [instance.observable],\n )\n\n return useSyncExternalStore<ObservedValueOf<ObservableType>>(\n subscribe,\n () => {\n return instance.getSnapshot(initialValue)\n },\n typeof initialValue === 'undefined'\n ? undefined\n : () => getValue(initialValue) as ObservedValueOf<ObservableType>,\n )\n}\n","import {observableCallback} from 'observable-callback'\nimport {useEffect, useState} from 'react'\nimport {type Observable} from 'rxjs'\nimport {useEffectEvent} from 'use-effect-event'\n\n/** @public */\nexport function useObservableEvent<T, U>(\n handleEvent: (arg: Observable<T>) => Observable<U>,\n): (arg: T) => void {\n const [[calls$, call]] = useState(() => observableCallback<T>())\n\n const onEvent = useEffectEvent((observable: Observable<T>) => handleEvent(observable))\n\n useEffect(() => {\n const subscription = calls$.pipe((observable) => onEvent(observable)).subscribe()\n return () => subscription.unsubscribe()\n }, [calls$, onEvent])\n\n return call\n}\n"],"names":["getValue","value","cache","WeakMap","useObservable","observable","initialValue","$","_c","t0","has","state","didEmit","entry","pipe","map","snapshot","error","undefined","catchError","of","tap","t1","error_0","value_0","finalize","delete","share","resetOnRefCountZero","timer","asapScheduler","getSnapshot","initialValue_0","subscribe","unsubscribe","set","get","instance","t2","onStoreChange","subscription_0","subscription","t3","t4","useSyncExternalStore","useObservableEvent","handleEvent","useState","_temp","calls$","call","onEvent","useEffectEvent","observable_0","useEffect","observableCallback"],"mappings":"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"}
|
package/dist/index.d.cts
CHANGED
|
@@ -5,7 +5,6 @@ import {ObservedValueOf} from 'rxjs'
|
|
|
5
5
|
export declare function useObservable<ObservableType extends Observable<any>>(
|
|
6
6
|
observable: ObservableType,
|
|
7
7
|
initialValue: ObservedValueOf<ObservableType> | (() => ObservedValueOf<ObservableType>),
|
|
8
|
-
debug?: boolean,
|
|
9
8
|
): ObservedValueOf<ObservableType>
|
|
10
9
|
|
|
11
10
|
/** @public */
|
|
@@ -17,7 +16,6 @@ export declare function useObservable<ObservableType extends Observable<any>>(
|
|
|
17
16
|
export declare function useObservable<ObservableType extends Observable<any>, InitialValue>(
|
|
18
17
|
observable: ObservableType,
|
|
19
18
|
initialValue: InitialValue | (() => InitialValue),
|
|
20
|
-
debug?: boolean,
|
|
21
19
|
): InitialValue | ObservedValueOf<ObservableType>
|
|
22
20
|
|
|
23
21
|
/** @public */
|
package/dist/index.d.ts
CHANGED
|
@@ -5,7 +5,6 @@ import {ObservedValueOf} from 'rxjs'
|
|
|
5
5
|
export declare function useObservable<ObservableType extends Observable<any>>(
|
|
6
6
|
observable: ObservableType,
|
|
7
7
|
initialValue: ObservedValueOf<ObservableType> | (() => ObservedValueOf<ObservableType>),
|
|
8
|
-
debug?: boolean,
|
|
9
8
|
): ObservedValueOf<ObservableType>
|
|
10
9
|
|
|
11
10
|
/** @public */
|
|
@@ -17,7 +16,6 @@ export declare function useObservable<ObservableType extends Observable<any>>(
|
|
|
17
16
|
export declare function useObservable<ObservableType extends Observable<any>, InitialValue>(
|
|
18
17
|
observable: ObservableType,
|
|
19
18
|
initialValue: InitialValue | (() => InitialValue),
|
|
20
|
-
debug?: boolean,
|
|
21
19
|
): InitialValue | ObservedValueOf<ObservableType>
|
|
22
20
|
|
|
23
21
|
/** @public */
|
package/dist/index.js
CHANGED
|
@@ -8,57 +8,53 @@ function getValue(value) {
|
|
|
8
8
|
return typeof value == "function" ? value() : value;
|
|
9
9
|
}
|
|
10
10
|
const cache = /* @__PURE__ */ new WeakMap();
|
|
11
|
-
function useObservable(observable, initialValue
|
|
12
|
-
const $ = c(
|
|
11
|
+
function useObservable(observable, initialValue) {
|
|
12
|
+
const $ = c(9);
|
|
13
13
|
let t0;
|
|
14
14
|
if (!cache.has(observable)) {
|
|
15
|
-
const
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
15
|
+
const state = {
|
|
16
|
+
didEmit: !1
|
|
17
|
+
}, entry = {
|
|
18
|
+
state,
|
|
19
|
+
observable: observable.pipe(map((value) => ({
|
|
20
|
+
snapshot: value,
|
|
21
|
+
error: void 0
|
|
22
|
+
})), catchError((error) => of({
|
|
23
|
+
snapshot: void 0,
|
|
24
|
+
error
|
|
25
|
+
})), tap((t12) => {
|
|
26
|
+
const {
|
|
27
|
+
snapshot,
|
|
28
|
+
error: error_0
|
|
29
|
+
} = t12;
|
|
30
|
+
state.didEmit = !0, state.snapshot = snapshot, state.error = error_0;
|
|
31
|
+
}), map((value_0) => {
|
|
32
|
+
}), finalize(() => cache.delete(observable)), share({
|
|
33
|
+
resetOnRefCountZero: () => timer(0, asapScheduler)
|
|
34
|
+
})),
|
|
35
|
+
getSnapshot: (initialValue_0) => {
|
|
36
|
+
if (state.error)
|
|
37
|
+
throw state.error;
|
|
38
|
+
return state.didEmit ? state.snapshot : getValue(initialValue_0);
|
|
39
|
+
}
|
|
40
|
+
};
|
|
41
|
+
entry.observable.subscribe().unsubscribe(), cache.set(observable, entry);
|
|
32
42
|
}
|
|
33
43
|
let t1;
|
|
34
|
-
$[0] !== observable ? (t1 = cache.get(observable), $[0] = observable, $[1] = t1) : t1 = $[1];
|
|
35
|
-
const instance =
|
|
44
|
+
$[0] !== observable ? (t1 = cache.get(observable), $[0] = observable, $[1] = t1) : t1 = $[1], t0 = t1;
|
|
45
|
+
const instance = t0;
|
|
36
46
|
let t2;
|
|
37
|
-
$[2] !==
|
|
38
|
-
|
|
39
|
-
const subscription_0 = instance.observable.subscribe(() => {
|
|
40
|
-
debug && console.log("onStoreChange", observable), onStoreChange();
|
|
41
|
-
});
|
|
47
|
+
$[2] !== instance.observable ? (t2 = (onStoreChange) => {
|
|
48
|
+
const subscription_0 = instance.observable.subscribe(onStoreChange);
|
|
42
49
|
return () => {
|
|
43
|
-
|
|
50
|
+
subscription_0.unsubscribe();
|
|
44
51
|
};
|
|
45
|
-
}, $[2] =
|
|
52
|
+
}, $[2] = instance.observable, $[3] = t2) : t2 = $[3];
|
|
53
|
+
const subscribe = t2;
|
|
46
54
|
let t3;
|
|
47
|
-
$[
|
|
48
|
-
if (debug && console.log("getSnapshot", instance.snapshot, instance.error), instance.error)
|
|
49
|
-
throw instance.error;
|
|
50
|
-
return instance.snapshot;
|
|
51
|
-
}, $[6] = debug, $[7] = instance.snapshot, $[8] = instance.error, $[9] = t3) : t3 = $[9];
|
|
55
|
+
$[4] !== instance || $[5] !== initialValue ? (t3 = () => instance.getSnapshot(initialValue), $[4] = instance, $[5] = initialValue, $[6] = t3) : t3 = $[6];
|
|
52
56
|
let t4;
|
|
53
|
-
$[
|
|
54
|
-
subscribe: t2,
|
|
55
|
-
getSnapshot: t3
|
|
56
|
-
}, $[10] = t2, $[11] = t3, $[12] = t4) : t4 = $[12], t0 = t4;
|
|
57
|
-
const store = t0;
|
|
58
|
-
let t5;
|
|
59
|
-
$[13] !== store || $[14] !== initialValue ? (t5 = () => store.getSnapshot() ?? getValue(initialValue), $[13] = store, $[14] = initialValue, $[15] = t5) : t5 = $[15];
|
|
60
|
-
let t6;
|
|
61
|
-
return $[16] !== initialValue ? (t6 = typeof initialValue > "u" ? void 0 : () => getValue(initialValue), $[16] = initialValue, $[17] = t6) : t6 = $[17], useSyncExternalStore(store.subscribe, t5, t6);
|
|
57
|
+
return $[7] !== initialValue ? (t4 = typeof initialValue > "u" ? void 0 : () => getValue(initialValue), $[7] = initialValue, $[8] = t4) : t4 = $[8], useSyncExternalStore(subscribe, t3, t4);
|
|
62
58
|
}
|
|
63
59
|
function useObservableEvent(handleEvent) {
|
|
64
60
|
const $ = c(6), [t0] = useState(_temp), [calls$, call] = t0;
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../src/useObservable.ts","../src/useObservableEvent.ts"],"sourcesContent":["import {useMemo, useSyncExternalStore} from 'react'\nimport {\n asapScheduler,\n catchError,\n finalize,\n type Observable,\n type ObservedValueOf,\n of,\n share,\n timer,\n} from 'rxjs'\nimport {map, tap} from 'rxjs/operators'\n\nfunction getValue<T>(value: T): T extends () => infer U ? U : T {\n return typeof value === 'function' ? value() : value\n}\n\ninterface CacheRecord<T> {\n observable: Observable<void>\n
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/useObservable.ts","../src/useObservableEvent.ts"],"sourcesContent":["import {useCallback, useMemo, useSyncExternalStore} from 'react'\nimport {\n asapScheduler,\n catchError,\n finalize,\n type Observable,\n type ObservedValueOf,\n of,\n share,\n timer,\n} from 'rxjs'\nimport {map, tap} from 'rxjs/operators'\n\nfunction getValue<T>(value: T): T extends () => infer U ? U : T {\n return typeof value === 'function' ? value() : value\n}\n\ninterface ObservableState<T> {\n didEmit: boolean\n snapshot?: T\n error?: unknown\n}\n\ninterface CacheRecord<T> {\n observable: Observable<void>\n state: {\n didEmit: boolean\n snapshot?: T\n error?: unknown\n }\n getSnapshot: (initialValue: unknown) => T\n}\n\nconst cache = new WeakMap<Observable<any>, CacheRecord<any>>()\n\n/** @public */\nexport function useObservable<ObservableType extends Observable<any>>(\n observable: ObservableType,\n initialValue: ObservedValueOf<ObservableType> | (() => ObservedValueOf<ObservableType>),\n): ObservedValueOf<ObservableType>\n/** @public */\nexport function useObservable<ObservableType extends Observable<any>>(\n observable: ObservableType,\n): undefined | ObservedValueOf<ObservableType>\n/** @public */\nexport function useObservable<ObservableType extends Observable<any>, InitialValue>(\n observable: ObservableType,\n initialValue: InitialValue | (() => InitialValue),\n): InitialValue | ObservedValueOf<ObservableType>\n/** @public */\nexport function useObservable<ObservableType extends Observable<any>, InitialValue>(\n observable: ObservableType,\n initialValue?: InitialValue | (() => InitialValue),\n): InitialValue | ObservedValueOf<ObservableType> {\n const instance = useMemo(() => {\n if (!cache.has(observable)) {\n // This separate object is used as a stable reference to the cache entry's snapshot and error.\n // It's used by the `getSnapshot` closure.\n const state: ObservableState<ObservedValueOf<ObservableType>> = {\n didEmit: false,\n }\n const entry: CacheRecord<ObservedValueOf<ObservableType>> = {\n state,\n observable: observable.pipe(\n map((value) => ({snapshot: value, error: undefined})),\n catchError((error) => of({snapshot: undefined, error})),\n tap(({snapshot, error}) => {\n state.didEmit = true\n state.snapshot = snapshot\n state.error = error\n }),\n // Note: any value or error emitted by the provided observable will be mapped to the cache entry's mutable state\n // and the observable is thereafter only used as a notifier to call `onStoreChange`, hence the `void` return type.\n map((value) => void value),\n // Ensure that the cache entry is deleted when the observable completes or errors.\n finalize(() => cache.delete(observable)),\n share({resetOnRefCountZero: () => timer(0, asapScheduler)}),\n ),\n getSnapshot: (initialValue) => {\n if (state.error) {\n throw state.error\n }\n return (\n state.didEmit ? state.snapshot : getValue(initialValue)\n ) as ObservedValueOf<ObservableType>\n },\n }\n\n // Eagerly subscribe to sync set `state.snapshot` to what the observable returns, and keep the observable alive until the component unmounts.\n const subscription = entry.observable.subscribe()\n subscription.unsubscribe()\n\n cache.set(observable, entry)\n }\n return cache.get(observable)!\n }, [observable])\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n const subscription = instance.observable.subscribe(onStoreChange)\n return () => {\n subscription.unsubscribe()\n }\n },\n [instance.observable],\n )\n\n return useSyncExternalStore<ObservedValueOf<ObservableType>>(\n subscribe,\n () => {\n return instance.getSnapshot(initialValue)\n },\n typeof initialValue === 'undefined'\n ? undefined\n : () => getValue(initialValue) as ObservedValueOf<ObservableType>,\n )\n}\n","import {observableCallback} from 'observable-callback'\nimport {useEffect, useState} from 'react'\nimport {type Observable} from 'rxjs'\nimport {useEffectEvent} from 'use-effect-event'\n\n/** @public */\nexport function useObservableEvent<T, U>(\n handleEvent: (arg: Observable<T>) => Observable<U>,\n): (arg: T) => void {\n const [[calls$, call]] = useState(() => observableCallback<T>())\n\n const onEvent = useEffectEvent((observable: Observable<T>) => handleEvent(observable))\n\n useEffect(() => {\n const subscription = calls$.pipe((observable) => onEvent(observable)).subscribe()\n return () => subscription.unsubscribe()\n }, [calls$, onEvent])\n\n return call\n}\n"],"names":["getValue","value","cache","WeakMap","useObservable","observable","initialValue","$","_c","t0","has","state","didEmit","entry","pipe","map","snapshot","error","undefined","catchError","of","tap","t1","error_0","value_0","finalize","delete","share","resetOnRefCountZero","timer","asapScheduler","getSnapshot","initialValue_0","subscribe","unsubscribe","set","get","instance","t2","onStoreChange","subscription_0","subscription","t3","t4","useSyncExternalStore","useObservableEvent","handleEvent","useState","_temp","calls$","call","onEvent","useEffectEvent","observable_0","useEffect","observableCallback"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-rx",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.3",
|
|
4
4
|
"description": "React + RxJS = <3",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"action",
|
|
@@ -62,6 +62,15 @@
|
|
|
62
62
|
"dist",
|
|
63
63
|
"src"
|
|
64
64
|
],
|
|
65
|
+
"scripts": {
|
|
66
|
+
"build": "pkg build --strict --clean --check",
|
|
67
|
+
"dev": "pnpm --filter 'react-rx-website' dev",
|
|
68
|
+
"format": "prettier --cache --write .",
|
|
69
|
+
"lint": "eslint --cache .",
|
|
70
|
+
"prepublishOnly": "pnpm build",
|
|
71
|
+
"test": "vitest run --typecheck",
|
|
72
|
+
"watch": "pnpm build -- --watch"
|
|
73
|
+
},
|
|
65
74
|
"browserslist": "extends @sanity/browserslist-config",
|
|
66
75
|
"prettier": "@sanity/prettier-config",
|
|
67
76
|
"dependencies": {
|
|
@@ -103,12 +112,5 @@
|
|
|
103
112
|
"react": "^18.3 || >=19.0.0-0",
|
|
104
113
|
"rxjs": "^7"
|
|
105
114
|
},
|
|
106
|
-
"
|
|
107
|
-
|
|
108
|
-
"dev": "pnpm --filter 'react-rx-website' dev",
|
|
109
|
-
"format": "prettier --cache --write .",
|
|
110
|
-
"lint": "eslint --cache .",
|
|
111
|
-
"test": "vitest run --typecheck",
|
|
112
|
-
"watch": "pnpm build -- --watch"
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
+
"packageManager": "pnpm@9.12.3"
|
|
116
|
+
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {act, render, renderHook} from '@testing-library/react'
|
|
2
|
-
import {createElement, Fragment} from 'react'
|
|
2
|
+
import {createElement, Fragment, useMemo} from 'react'
|
|
3
3
|
import {asyncScheduler, Observable, of, ReplaySubject, scheduled, share, Subject, timer} from 'rxjs'
|
|
4
4
|
import {map} from 'rxjs/operators'
|
|
5
5
|
import {expect, test} from 'vitest'
|
|
@@ -236,3 +236,53 @@ test('should re-subscribe when receiving a new observable', () => {
|
|
|
236
236
|
|
|
237
237
|
unmount()
|
|
238
238
|
})
|
|
239
|
+
|
|
240
|
+
test('should return undefined if observable emits undefined, also when given initial value', () => {
|
|
241
|
+
const values$ = new Subject<string | undefined>()
|
|
242
|
+
const {result, unmount} = renderHook(() => useObservable(values$, 'initial'))
|
|
243
|
+
|
|
244
|
+
expect(result.current).toBe('initial')
|
|
245
|
+
|
|
246
|
+
act(() => values$.next(undefined))
|
|
247
|
+
|
|
248
|
+
expect(result.current).toBe(undefined)
|
|
249
|
+
|
|
250
|
+
unmount()
|
|
251
|
+
})
|
|
252
|
+
|
|
253
|
+
test('should return undefined if observable emits undefined, also when given initial value, and also when unsubscribe + resubscribe', () => {
|
|
254
|
+
const snapshots: (string | undefined)[] = []
|
|
255
|
+
const subject = new Subject<string | undefined>()
|
|
256
|
+
|
|
257
|
+
function ObservableComponent(props: {prefix: string}) {
|
|
258
|
+
// will create a new observable every time prefix changes
|
|
259
|
+
const observable = useMemo(
|
|
260
|
+
() => subject.pipe(map((v) => (typeof v === 'string' ? `${props.prefix}-${v}` : v))),
|
|
261
|
+
[props.prefix],
|
|
262
|
+
)
|
|
263
|
+
snapshots.push(useObservable(observable, 'initial'))
|
|
264
|
+
return createElement(Fragment, null)
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
const {unmount, rerender} = render(createElement(ObservableComponent, {prefix: 'first'}))
|
|
268
|
+
act(() => subject.next('foo'))
|
|
269
|
+
act(() => subject.next(undefined))
|
|
270
|
+
act(() => subject.next('bar'))
|
|
271
|
+
|
|
272
|
+
// now change the prefix
|
|
273
|
+
rerender(createElement(ObservableComponent, {prefix: 'second'}))
|
|
274
|
+
act(() => subject.next('foo again'))
|
|
275
|
+
act(() => subject.next(undefined))
|
|
276
|
+
act(() => subject.next('bar again'))
|
|
277
|
+
expect(snapshots).toEqual([
|
|
278
|
+
'initial',
|
|
279
|
+
'first-foo',
|
|
280
|
+
undefined,
|
|
281
|
+
'first-bar',
|
|
282
|
+
'initial',
|
|
283
|
+
'second-foo again',
|
|
284
|
+
undefined,
|
|
285
|
+
'second-bar again',
|
|
286
|
+
])
|
|
287
|
+
unmount()
|
|
288
|
+
})
|
package/src/useObservable.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {useMemo, useSyncExternalStore} from 'react'
|
|
1
|
+
import {useCallback, useMemo, useSyncExternalStore} from 'react'
|
|
2
2
|
import {
|
|
3
3
|
asapScheduler,
|
|
4
4
|
catchError,
|
|
@@ -15,10 +15,20 @@ function getValue<T>(value: T): T extends () => infer U ? U : T {
|
|
|
15
15
|
return typeof value === 'function' ? value() : value
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
+
interface ObservableState<T> {
|
|
19
|
+
didEmit: boolean
|
|
20
|
+
snapshot?: T
|
|
21
|
+
error?: unknown
|
|
22
|
+
}
|
|
23
|
+
|
|
18
24
|
interface CacheRecord<T> {
|
|
19
25
|
observable: Observable<void>
|
|
20
|
-
|
|
21
|
-
|
|
26
|
+
state: {
|
|
27
|
+
didEmit: boolean
|
|
28
|
+
snapshot?: T
|
|
29
|
+
error?: unknown
|
|
30
|
+
}
|
|
31
|
+
getSnapshot: (initialValue: unknown) => T
|
|
22
32
|
}
|
|
23
33
|
|
|
24
34
|
const cache = new WeakMap<Observable<any>, CacheRecord<any>>()
|
|
@@ -27,7 +37,6 @@ const cache = new WeakMap<Observable<any>, CacheRecord<any>>()
|
|
|
27
37
|
export function useObservable<ObservableType extends Observable<any>>(
|
|
28
38
|
observable: ObservableType,
|
|
29
39
|
initialValue: ObservedValueOf<ObservableType> | (() => ObservedValueOf<ObservableType>),
|
|
30
|
-
debug?: boolean,
|
|
31
40
|
): ObservedValueOf<ObservableType>
|
|
32
41
|
/** @public */
|
|
33
42
|
export function useObservable<ObservableType extends Observable<any>>(
|
|
@@ -37,77 +46,70 @@ export function useObservable<ObservableType extends Observable<any>>(
|
|
|
37
46
|
export function useObservable<ObservableType extends Observable<any>, InitialValue>(
|
|
38
47
|
observable: ObservableType,
|
|
39
48
|
initialValue: InitialValue | (() => InitialValue),
|
|
40
|
-
debug?: boolean,
|
|
41
49
|
): InitialValue | ObservedValueOf<ObservableType>
|
|
42
50
|
/** @public */
|
|
43
51
|
export function useObservable<ObservableType extends Observable<any>, InitialValue>(
|
|
44
52
|
observable: ObservableType,
|
|
45
53
|
initialValue?: InitialValue | (() => InitialValue),
|
|
46
|
-
debug?: boolean,
|
|
47
54
|
): InitialValue | ObservedValueOf<ObservableType> {
|
|
48
|
-
const
|
|
55
|
+
const instance = useMemo(() => {
|
|
49
56
|
if (!cache.has(observable)) {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
+
// This separate object is used as a stable reference to the cache entry's snapshot and error.
|
|
58
|
+
// It's used by the `getSnapshot` closure.
|
|
59
|
+
const state: ObservableState<ObservedValueOf<ObservableType>> = {
|
|
60
|
+
didEmit: false,
|
|
61
|
+
}
|
|
62
|
+
const entry: CacheRecord<ObservedValueOf<ObservableType>> = {
|
|
63
|
+
state,
|
|
64
|
+
observable: observable.pipe(
|
|
65
|
+
map((value) => ({snapshot: value, error: undefined})),
|
|
66
|
+
catchError((error) => of({snapshot: undefined, error})),
|
|
67
|
+
tap(({snapshot, error}) => {
|
|
68
|
+
state.didEmit = true
|
|
69
|
+
state.snapshot = snapshot
|
|
70
|
+
state.error = error
|
|
71
|
+
}),
|
|
72
|
+
// Note: any value or error emitted by the provided observable will be mapped to the cache entry's mutable state
|
|
73
|
+
// and the observable is thereafter only used as a notifier to call `onStoreChange`, hence the `void` return type.
|
|
74
|
+
map((value) => void value),
|
|
75
|
+
// Ensure that the cache entry is deleted when the observable completes or errors.
|
|
76
|
+
finalize(() => cache.delete(observable)),
|
|
77
|
+
share({resetOnRefCountZero: () => timer(0, asapScheduler)}),
|
|
78
|
+
),
|
|
79
|
+
getSnapshot: (initialValue) => {
|
|
80
|
+
if (state.error) {
|
|
81
|
+
throw state.error
|
|
57
82
|
}
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
map((value) => void value),
|
|
64
|
-
// Ensure that the cache entry is deleted when the observable completes or errors.
|
|
65
|
-
finalize(() => cache.delete(observable)),
|
|
66
|
-
share({resetOnRefCountZero: () => timer(0, asapScheduler)}),
|
|
67
|
-
)
|
|
83
|
+
return (
|
|
84
|
+
state.didEmit ? state.snapshot : getValue(initialValue)
|
|
85
|
+
) as ObservedValueOf<ObservableType>
|
|
86
|
+
},
|
|
87
|
+
}
|
|
68
88
|
|
|
69
|
-
// Eagerly subscribe to sync set `
|
|
89
|
+
// Eagerly subscribe to sync set `state.snapshot` to what the observable returns, and keep the observable alive until the component unmounts.
|
|
70
90
|
const subscription = entry.observable.subscribe()
|
|
71
91
|
subscription.unsubscribe()
|
|
72
92
|
|
|
73
|
-
cache.set(observable, entry
|
|
93
|
+
cache.set(observable, entry)
|
|
74
94
|
}
|
|
75
|
-
|
|
76
|
-
|
|
95
|
+
return cache.get(observable)!
|
|
96
|
+
}, [observable])
|
|
77
97
|
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
onStoreChange()
|
|
88
|
-
})
|
|
89
|
-
return () => {
|
|
90
|
-
if (debug) {
|
|
91
|
-
console.log('unsubscribe', observable)
|
|
92
|
-
}
|
|
93
|
-
subscription.unsubscribe()
|
|
94
|
-
}
|
|
95
|
-
},
|
|
96
|
-
getSnapshot: () => {
|
|
97
|
-
if (debug) {
|
|
98
|
-
console.log('getSnapshot', instance.snapshot, instance.error)
|
|
99
|
-
}
|
|
100
|
-
if (instance.error) {
|
|
101
|
-
throw instance.error
|
|
102
|
-
}
|
|
103
|
-
return instance.snapshot
|
|
104
|
-
},
|
|
105
|
-
}
|
|
106
|
-
}, [debug, observable])
|
|
98
|
+
const subscribe = useCallback(
|
|
99
|
+
(onStoreChange: () => void) => {
|
|
100
|
+
const subscription = instance.observable.subscribe(onStoreChange)
|
|
101
|
+
return () => {
|
|
102
|
+
subscription.unsubscribe()
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
[instance.observable],
|
|
106
|
+
)
|
|
107
107
|
|
|
108
108
|
return useSyncExternalStore<ObservedValueOf<ObservableType>>(
|
|
109
|
-
|
|
110
|
-
() =>
|
|
109
|
+
subscribe,
|
|
110
|
+
() => {
|
|
111
|
+
return instance.getSnapshot(initialValue)
|
|
112
|
+
},
|
|
111
113
|
typeof initialValue === 'undefined'
|
|
112
114
|
? undefined
|
|
113
115
|
: () => getValue(initialValue) as ObservedValueOf<ObservableType>,
|