@warp-drive-mirror/react 5.9.0-beta.0 → 5.9.0-beta.2
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/CHANGELOG.md +38 -0
- package/dist/index.d.ts +180 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +216 -251
- package/dist/index.js.map +1 -0
- package/dist/install.d.ts +21 -0
- package/dist/install.d.ts.map +1 -0
- package/dist/install.js +90 -94
- package/dist/install.js.map +1 -0
- package/dist/reactive-context-DhUW_l--.js +122 -0
- package/dist/reactive-context-DhUW_l--.js.map +1 -0
- package/dist/unpkg/dev/index.js +260 -299
- package/dist/unpkg/dev/index.js.map +1 -0
- package/dist/unpkg/dev/install.js +82 -92
- package/dist/unpkg/dev/install.js.map +1 -0
- package/dist/unpkg/dev/reactive-context-Ax2U-96G.js +218 -0
- package/dist/unpkg/dev/reactive-context-Ax2U-96G.js.map +1 -0
- package/dist/unpkg/dev-deprecated/index.js +260 -299
- package/dist/unpkg/dev-deprecated/index.js.map +1 -0
- package/dist/unpkg/dev-deprecated/install.js +82 -92
- package/dist/unpkg/dev-deprecated/install.js.map +1 -0
- package/dist/unpkg/dev-deprecated/reactive-context-B-pn7tS7.js +218 -0
- package/dist/unpkg/dev-deprecated/reactive-context-B-pn7tS7.js.map +1 -0
- package/dist/unpkg/prod/index.js +199 -226
- package/dist/unpkg/prod/index.js.map +1 -0
- package/dist/unpkg/prod/install.js +56 -48
- package/dist/unpkg/prod/install.js.map +1 -0
- package/dist/unpkg/prod/reactive-context-eAEvPuqb.js +92 -0
- package/dist/unpkg/prod/reactive-context-eAEvPuqb.js.map +1 -0
- package/dist/unpkg/prod-deprecated/index.js +199 -226
- package/dist/unpkg/prod-deprecated/index.js.map +1 -0
- package/dist/unpkg/prod-deprecated/install.js +56 -48
- package/dist/unpkg/prod-deprecated/install.js.map +1 -0
- package/dist/unpkg/prod-deprecated/reactive-context-eAEvPuqb.js +92 -0
- package/dist/unpkg/prod-deprecated/reactive-context-eAEvPuqb.js.map +1 -0
- package/package.json +25 -33
- package/declarations/-private/reactive-context.d.ts +0 -18
- package/declarations/-private/request.d.ts +0 -142
- package/declarations/-private/store-provider.d.ts +0 -19
- package/declarations/index.d.ts +0 -7
- package/declarations/install.d.ts +0 -3
- package/dist/reactive-context-ClTRYXie.js +0 -154
- package/dist/unpkg/dev/reactive-context-B815u0_c.js +0 -290
- package/dist/unpkg/dev-deprecated/reactive-context-DMgQ7YV_.js +0 -290
- package/dist/unpkg/prod/reactive-context-DKimDkR3.js +0 -110
- package/dist/unpkg/prod-deprecated/reactive-context-DKimDkR3.js +0 -110
|
@@ -1,56 +1,64 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
1
|
+
import { n as WatcherContext } from "./reactive-context-eAEvPuqb.js";
|
|
2
|
+
import { use } from "react";
|
|
3
|
+
import { Signal } from "signal-polyfill";
|
|
4
|
+
import { setupSignals } from "@warp-drive-mirror/core/configure";
|
|
5
5
|
|
|
6
|
+
//#region src/install.ts
|
|
6
7
|
/**
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
* {@include ./install.md}
|
|
9
|
+
* @module
|
|
10
|
+
*/
|
|
11
11
|
function tryConsumeContext(signal) {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
watcher?.watcher.watch(signal);
|
|
22
|
-
} catch {
|
|
23
|
-
// eslint-disable-next-line no-console
|
|
24
|
-
console.error = logError;
|
|
25
|
-
// if we are not in a React context, we will Error
|
|
26
|
-
// so we just ignore it.
|
|
27
|
-
}
|
|
12
|
+
const logError = console.error;
|
|
13
|
+
try {
|
|
14
|
+
console.error = () => {};
|
|
15
|
+
const watcher = use(WatcherContext);
|
|
16
|
+
console.error = logError;
|
|
17
|
+
watcher?.watcher.watch(signal);
|
|
18
|
+
} catch {
|
|
19
|
+
console.error = logError;
|
|
20
|
+
}
|
|
28
21
|
}
|
|
22
|
+
/**
|
|
23
|
+
* Resolves once all pending requests started via WarpDrive's React signal
|
|
24
|
+
* integration have settled. Only tracks requests while `TESTING` is enabled;
|
|
25
|
+
* a no-op otherwise.
|
|
26
|
+
*
|
|
27
|
+
* @public
|
|
28
|
+
*/
|
|
29
29
|
async function settled() {}
|
|
30
|
+
/**
|
|
31
|
+
* Builds the {@link SignalHooks} implementation backed by the
|
|
32
|
+
* [Signal Polyfill](https://github.com/proposal-signals/signal-polyfill),
|
|
33
|
+
* used to wire WarpDrive's reactivity primitives into React.
|
|
34
|
+
*
|
|
35
|
+
* @public
|
|
36
|
+
*/
|
|
30
37
|
function buildSignalConfig(options) {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
willSyncFlushWatchers: () => false
|
|
53
|
-
};
|
|
38
|
+
return {
|
|
39
|
+
createSignal: (obj, key) => new Signal.State(null, { equals: () => false }),
|
|
40
|
+
notifySignal: (signal) => {
|
|
41
|
+
signal.set(signal.get());
|
|
42
|
+
},
|
|
43
|
+
consumeSignal: (signal) => {
|
|
44
|
+
tryConsumeContext(signal);
|
|
45
|
+
signal.get();
|
|
46
|
+
},
|
|
47
|
+
createMemo: (object, key, fn) => {
|
|
48
|
+
const memo = new Signal.Computed(fn);
|
|
49
|
+
return () => {
|
|
50
|
+
tryConsumeContext(memo);
|
|
51
|
+
return memo.get();
|
|
52
|
+
};
|
|
53
|
+
},
|
|
54
|
+
waitFor: (promise) => {
|
|
55
|
+
return promise;
|
|
56
|
+
},
|
|
57
|
+
willSyncFlushWatchers: () => false
|
|
58
|
+
};
|
|
54
59
|
}
|
|
55
60
|
setupSignals(buildSignalConfig);
|
|
56
|
-
|
|
61
|
+
|
|
62
|
+
//#endregion
|
|
63
|
+
export { buildSignalConfig, settled };
|
|
64
|
+
//# sourceMappingURL=install.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"install.js","names":["use","Signal","setupSignals","WatcherContext","tryConsumeContext","signal","logError","console","error","watcher","watch","pending","settled","buildSignalConfig","options","createSignal","obj","key","State","equals","notifySignal","set","get","consumeSignal","createMemo","object","fn","memo","Computed","waitFor","promise","willSyncFlushWatchers"],"sources":["../../../src/install.ts"],"sourcesContent":["/**\n * {@include ./install.md}\n * @module\n */\n\nimport { use } from 'react';\nimport { Signal } from 'signal-polyfill';\n\nimport { LOG_REACT_SIGNAL_INTEGRATION } from '@warp-drive-mirror/core/build-config/debugging';\nimport { DEBUG, TESTING } from '@warp-drive-mirror/core/build-config/env';\nimport { type HooksOptions, setupSignals, type SignalHooks } from '@warp-drive-mirror/core/configure';\n\nimport { WatcherContext } from './-private/reactive-context';\n\nfunction tryConsumeContext(signal: Signal.State<unknown> | Signal.Computed<unknown>): void {\n // oxlint-disable-next-line no-console\n const logError = console.error;\n try {\n // oxlint-disable-next-line no-console\n console.error = () => {};\n // ensure signals are watched by our closest watcher\n const watcher = use(WatcherContext);\n // oxlint-disable-next-line no-console\n console.error = logError;\n watcher?.watcher.watch(signal);\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // oxlint-disable-next-line no-console\n console.log(`[WarpDrive] Consumed Context Signal`, signal, watcher);\n }\n } catch {\n // oxlint-disable-next-line no-console\n console.error = logError;\n // if we are not in a React context, we will Error\n // so we just ignore it.\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // oxlint-disable-next-line no-console\n console.log(`[WarpDrive] No Context Available To Consume Signal`, signal);\n }\n }\n}\n\nlet pending: Promise<unknown>[];\n/**\n * Resolves once all pending requests started via WarpDrive's React signal\n * integration have settled. Only tracks requests while `TESTING` is enabled;\n * a no-op otherwise.\n *\n * @public\n */\nexport async function settled(): Promise<void> {\n if (TESTING) {\n // in testing mode we provide a test waiter integration\n if (!pending || !pending.length) return;\n const current = pending ?? [];\n pending = [];\n await Promise.allSettled(current);\n await Promise.resolve();\n await Promise.resolve();\n await Promise.resolve();\n\n return settled();\n }\n}\n\n/**\n * Builds the {@link SignalHooks} implementation backed by the\n * [Signal Polyfill](https://github.com/proposal-signals/signal-polyfill),\n * used to wire WarpDrive's reactivity primitives into React.\n *\n * @public\n */\nexport function buildSignalConfig(options: HooksOptions): SignalHooks {\n return {\n createSignal: (obj: object, key: string | symbol) =>\n new Signal.State(DEBUG ? { obj, key } : null, { equals: () => false }),\n\n notifySignal: (signal: Signal.State<unknown>) => {\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n if (Signal.subtle.hasSinks(signal)) {\n // oxlint-disable-next-line no-console\n console.log(`[WarpDrive] Notifying Signal`, signal);\n } else {\n // oxlint-disable-next-line no-console\n console.log(`[WarpDrive] Notified Signal That Has No Watcher`, signal);\n }\n }\n signal.set(signal.get());\n },\n\n consumeSignal: (signal: Signal.State<unknown>) => {\n tryConsumeContext(signal);\n void signal.get();\n },\n\n createMemo: <F>(object: object, key: string | symbol, fn: () => F): (() => F) => {\n const memo = new Signal.Computed<F>(fn);\n return () => {\n tryConsumeContext(memo);\n\n return memo.get();\n };\n },\n\n waitFor: (promise) => {\n if (TESTING) {\n pending = pending || [];\n const newPromise = promise.finally(() => {\n pending = pending.filter((p) => p !== newPromise);\n });\n pending.push(newPromise);\n return newPromise;\n }\n return promise;\n },\n\n willSyncFlushWatchers: () => false,\n } as SignalHooks;\n}\n\nsetupSignals(buildSignalConfig);\n"],"mappings":";;;;;;;;;;AAcA,SAASI,kBAAkBC,QAAgE;CAEzF,MAAMC,WAAWC,QAAQC;CACzB,IAAI;EAEFD,QAAQC,cAAc,CAAC;EAEvB,MAAMC,UAAUT,IAAIG,cAAc;EAElCI,QAAQC,QAAQF;EAChBG,SAASA,QAAQC,MAAML,MAAM;CAK/B,QAAQ;EAENE,QAAQC,QAAQF;CAOlB;AACF;;;;;;;;AAUA,eAAsBM,UAAyB,CAa/C;;;;;;;;AASA,SAAgBC,kBAAkBC,SAAoC;CACpE,OAAO;EACLC,eAAeC,KAAaC,QAC1B,IAAIhB,OAAOiB,MAA6B,MAAM,EAAEC,cAAc,MAAM,CAAC;EAEvEC,eAAef,WAAkC;GAU/CA,OAAOgB,IAAIhB,OAAOiB,IAAI,CAAC;EACzB;EAEAC,gBAAgBlB,WAAkC;GAChDD,kBAAkBC,MAAM;GACxB,AAAKA,OAAOiB,IAAI;EAClB;EAEAE,aAAgBC,QAAgBR,KAAsBS,OAA2B;GAC/E,MAAMC,OAAO,IAAI1B,OAAO2B,SAAYF,EAAE;GACtC,aAAa;IACXtB,kBAAkBuB,IAAI;IAEtB,OAAOA,KAAKL,IAAI;GAClB;EACF;EAEAO,UAAUC,YAAY;GASpB,OAAOA;EACT;EAEAC,6BAA6B;CAC/B;AACF;AAEA7B,aAAaW,iBAAiB"}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
import { createContext, useMemo, useSyncExternalStore } from "react";
|
|
2
|
+
import { Signal } from "signal-polyfill";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
|
|
5
|
+
//#region src/-private/reactive-context.tsx
|
|
6
|
+
let nextFlush = null;
|
|
7
|
+
let watchers = [];
|
|
8
|
+
let watcherId = 0;
|
|
9
|
+
function clearWatcher(state) {
|
|
10
|
+
state.watcher.unwatch(...Signal.subtle.introspectSources(state.watcher));
|
|
11
|
+
}
|
|
12
|
+
function flush(state) {
|
|
13
|
+
state.pending = false;
|
|
14
|
+
if (state.destroyed) {
|
|
15
|
+
state.snapshot = null;
|
|
16
|
+
clearWatcher(state);
|
|
17
|
+
return;
|
|
18
|
+
}
|
|
19
|
+
state.snapshot = { watcher: state.watcher };
|
|
20
|
+
if (state.notifyReact) state.notifyReact();
|
|
21
|
+
state.watcher.watch();
|
|
22
|
+
}
|
|
23
|
+
function _createWatcher() {
|
|
24
|
+
const state = {
|
|
25
|
+
watcherId: watcherId++,
|
|
26
|
+
pending: false,
|
|
27
|
+
destroyed: false,
|
|
28
|
+
notifyReact: null,
|
|
29
|
+
watcher: null,
|
|
30
|
+
snapshot: null
|
|
31
|
+
};
|
|
32
|
+
state.watcher = new Signal.subtle.Watcher((...args) => {
|
|
33
|
+
if (!state.pending && !state.destroyed) {
|
|
34
|
+
watchers.push(state);
|
|
35
|
+
state.pending = true;
|
|
36
|
+
if (!nextFlush) nextFlush = new Promise((resolve) => {
|
|
37
|
+
queueMicrotask(() => {
|
|
38
|
+
queueMicrotask(() => {
|
|
39
|
+
queueMicrotask(() => {
|
|
40
|
+
watchers.forEach(flush);
|
|
41
|
+
watchers = [];
|
|
42
|
+
nextFlush = null;
|
|
43
|
+
resolve();
|
|
44
|
+
});
|
|
45
|
+
});
|
|
46
|
+
});
|
|
47
|
+
});
|
|
48
|
+
} else if (state.destroyed) {
|
|
49
|
+
state.snapshot = null;
|
|
50
|
+
clearWatcher(state);
|
|
51
|
+
}
|
|
52
|
+
});
|
|
53
|
+
state.watcher.watch();
|
|
54
|
+
state.snapshot = { watcher: state.watcher };
|
|
55
|
+
return state;
|
|
56
|
+
}
|
|
57
|
+
function useWatcher() {
|
|
58
|
+
const state = useMemo(_createWatcher, []);
|
|
59
|
+
return useSyncExternalStore((notifyChanged) => {
|
|
60
|
+
state.destroyed = false;
|
|
61
|
+
state.notifyReact = notifyChanged;
|
|
62
|
+
state.watcher.watch();
|
|
63
|
+
return () => {
|
|
64
|
+
state.destroyed = true;
|
|
65
|
+
state.notifyReact = null;
|
|
66
|
+
};
|
|
67
|
+
}, () => state.snapshot);
|
|
68
|
+
}
|
|
69
|
+
/**
|
|
70
|
+
* @category Contexts
|
|
71
|
+
*/
|
|
72
|
+
const WatcherContext = /*#__PURE__*/ createContext(null);
|
|
73
|
+
/**
|
|
74
|
+
*
|
|
75
|
+
* @category Components
|
|
76
|
+
*/
|
|
77
|
+
function ReactiveContext({ children }) {
|
|
78
|
+
const watcher = useWatcher();
|
|
79
|
+
/**
|
|
80
|
+
* Unlike other frameworks, React does not have a built-in way to provide
|
|
81
|
+
* a context value other than by rendering an extra component.
|
|
82
|
+
*
|
|
83
|
+
*/
|
|
84
|
+
return /*#__PURE__*/ jsx(WatcherContext, {
|
|
85
|
+
value: watcher,
|
|
86
|
+
children
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
//#endregion
|
|
91
|
+
export { WatcherContext as n, ReactiveContext as t };
|
|
92
|
+
//# sourceMappingURL=reactive-context-eAEvPuqb.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"reactive-context-eAEvPuqb.js","names":["createContext","useSyncExternalStore","useMemo","Signal","jsx","_jsx","nextFlush","watchers","watcherId","clearWatcher","state","watcher","unwatch","subtle","introspectSources","flush","pending","destroyed","snapshot","notifyReact","watch","_createWatcher","id","Watcher","args","push","Promise","resolve","queueMicrotask","forEach","useWatcher","notifyChanged","WatcherContext","ReactiveContext","children","value"],"sources":["../../../src/-private/reactive-context.tsx"],"sourcesContent":["import { createContext, type JSX, type ReactNode, useSyncExternalStore, type Context, useMemo } from \"react\";\nimport { Signal } from \"signal-polyfill\";\n\nimport { LOG_REACT_SIGNAL_INTEGRATION } from \"@warp-drive-mirror/core/build-config/debugging\";\n\nlet nextFlush: Promise<void> | null = null;\nlet watchers: WatcherState[] = [];\nlet watcherId = 0;\n\ninterface WatcherState {\n watcherId: number;\n pending: boolean;\n destroyed: boolean;\n notifyReact: (() => void) | null;\n watcher: Signal.subtle.Watcher;\n\n // the extra wrapper returned here ensures that the context value for the watcher\n // changes causing a re-render when the watcher is updated.\n snapshot: { watcher: Signal.subtle.Watcher } | null;\n}\n\nfunction clearWatcher(state: WatcherState) {\n state.watcher.unwatch(...Signal.subtle.introspectSources(state.watcher));\n}\n\nfunction flush(state: WatcherState) {\n state.pending = false;\n if (state.destroyed) {\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // eslint-disable-next-line no-console\n console.log(`[WarpDrive] Detected Watcher Destroyed During Notify Flush, clearing signals`);\n }\n state.snapshot = null;\n clearWatcher(state);\n return;\n }\n\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n /* eslint-disable no-console */\n console.log(`[WarpDrive] Notifying React That WatcherContext:${state.watcherId} Has Updated`);\n console.log(\"all signals\", new Set(Signal.subtle.introspectSources(state.watcher)));\n console.log(\"dirty signals\", new Set(state.watcher.getPending()));\n /* eslint-enable no-console */\n }\n\n // any time signals have changed, we notify React that our store has updated\n state.snapshot = { watcher: state.watcher };\n if (state.notifyReact) state.notifyReact();\n\n // tell the Watcher to start watching for changes again\n // by signaling that notifications have been flushed.\n state.watcher.watch();\n}\n\nfunction _createWatcher() {\n const id = watcherId++;\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // eslint-disable-next-line no-console\n console.log(`[WarpDrive] Creating a WatcherContext:${id}`);\n }\n const state: WatcherState = {\n watcherId: id,\n pending: false,\n destroyed: false,\n notifyReact: null as (() => void) | null,\n watcher: null as unknown as Signal.subtle.Watcher,\n\n // the extra wrapper returned here ensures that the context value for the watcher\n // changes causing a re-render when the watcher is updated.\n snapshot: null as { watcher: Signal.subtle.Watcher } | null,\n };\n\n state.watcher = new Signal.subtle.Watcher((...args) => {\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // eslint-disable-next-line no-console\n console.log(`watcher ${state.watcherId} notified`, args, state.watcher);\n }\n if (!state.pending && !state.destroyed) {\n watchers.push(state);\n state.pending = true;\n\n if (!nextFlush) {\n nextFlush = new Promise((resolve) => {\n queueMicrotask(() => {\n queueMicrotask(() => {\n queueMicrotask(() => {\n watchers.forEach(flush);\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // eslint-disable-next-line no-console\n console.log(\n \"Flushed watcher:\",\n watchers.map((w) => w.watcherId)\n );\n }\n watchers = [];\n nextFlush = null;\n\n resolve();\n });\n });\n });\n });\n }\n } else if (state.destroyed) {\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // eslint-disable-next-line no-console\n console.log(`[WarpDrive] Detected Watcher Destroyed During Notify, clearing signals`);\n }\n // if we are destroyed, we clear the watcher signals\n // so that it does not continue to watch for changes.\n state.snapshot = null;\n clearWatcher(state);\n }\n });\n\n // The watcher won't begin watching until we call `watcher.watch()`\n state.watcher.watch();\n state.snapshot = { watcher: state.watcher };\n\n return state;\n}\n\nexport function useWatcher(): { watcher: Signal.subtle.Watcher } | null {\n const state = useMemo(_createWatcher, []);\n\n return useSyncExternalStore(\n (notifyChanged: () => void) => {\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // eslint-disable-next-line no-console\n console.log(`[WarpDrive] Subscribing to Watcher`);\n }\n state.destroyed = false;\n state.notifyReact = notifyChanged;\n\n // The watcher won't begin watching until we call `watcher.watch()`\n state.watcher.watch();\n\n return () => {\n if (LOG_REACT_SIGNAL_INTEGRATION) {\n // eslint-disable-next-line no-console\n console.log(`[WarpDrive] Deactivating Watcher Subscription`);\n }\n state.destroyed = true;\n state.notifyReact = null;\n };\n },\n () => state.snapshot\n );\n}\n\n/**\n * @category Contexts\n */\nexport const WatcherContext: Context<{\n /**\n * The `Signal.subtle.Watcher` used to observe signal changes for the nearest {@link ReactiveContext}.\n */\n watcher: Signal.subtle.Watcher;\n} | null> = createContext<{\n watcher: Signal.subtle.Watcher;\n} | null>(null);\n\n/**\n *\n * @category Components\n */\nexport function ReactiveContext({ children }: { children: ReactNode }): JSX.Element {\n const watcher = useWatcher();\n /**\n * Unlike other frameworks, React does not have a built-in way to provide\n * a context value other than by rendering an extra component.\n *\n */\n return <WatcherContext value={watcher}>{children}</WatcherContext>;\n}\n"],"mappings":";;;;;AAKA,IAAIM,YAAkC;AACtC,IAAIC,WAA2B,CAAA;AAC/B,IAAIC,YAAY;AAchB,SAASC,aAAaC,OAAqB;CACzCA,MAAMC,QAAQC,QAAQ,GAAGT,OAAOU,OAAOC,kBAAkBJ,MAAMC,OAAO,CAAC;AACzE;AAEA,SAASI,MAAML,OAAqB;CAClCA,MAAMM,UAAU;CAChB,IAAIN,MAAMO,WAAW;EAKnBP,MAAMQ,WAAW;EACjBT,aAAaC,KAAK;EAClB;CACF;CAWAA,MAAMQ,WAAW,EAAEP,SAASD,MAAMC,QAAQ;CAC1C,IAAID,MAAMS,aAAaT,MAAMS,YAAY;CAIzCT,MAAMC,QAAQS,MAAM;AACtB;AAEA,SAASC,iBAAiB;CAMxB,MAAMX,QAAsB;EAC1BF,WAAWc,AANFd;EAOTQ,SAAS;EACTC,WAAW;EACXE,aAAa;EACbR,SAAS;EAITO,UAAU;CACZ;CAEAR,MAAMC,UAAU,IAAIR,OAAOU,OAAOU,SAAS,GAAGC,SAAS;EAKrD,IAAI,CAACd,MAAMM,WAAW,CAACN,MAAMO,WAAW;GACtCV,SAASkB,KAAKf,KAAK;GACnBA,MAAMM,UAAU;GAEhB,IAAI,CAACV,WACHA,YAAY,IAAIoB,SAASC,YAAY;IACnCC,qBAAqB;KACnBA,qBAAqB;MACnBA,qBAAqB;OACnBrB,SAASsB,QAAQd,KAAK;OAQtBR,WAAW,CAAA;OACXD,YAAY;OAEZqB,QAAQ;MACV,CAAC;KACH,CAAC;IACH,CAAC;GACH,CAAC;EAEL,OAAO,IAAIjB,MAAMO,WAAW;GAO1BP,MAAMQ,WAAW;GACjBT,aAAaC,KAAK;EACpB;CACF,CAAC;CAGDA,MAAMC,QAAQS,MAAM;CACpBV,MAAMQ,WAAW,EAAEP,SAASD,MAAMC,QAAQ;CAE1C,OAAOD;AACT;AAEA,SAAgBoB,aAAwD;CACtE,MAAMpB,QAAQR,QAAQmB,gBAAgB,CAAA,CAAE;CAExC,OAAOpB,sBACJ8B,kBAA8B;EAK7BrB,MAAMO,YAAY;EAClBP,MAAMS,cAAcY;EAGpBrB,MAAMC,QAAQS,MAAM;EAEpB,aAAa;GAKXV,MAAMO,YAAY;GAClBP,MAAMS,cAAc;EACtB;CACF,SACMT,MAAMQ,QACd;AACF;;;;AAKA,MAAac,iBAKDhC,4BAEF,IAAI;;;;;AAMd,SAAgBiC,gBAAgB,EAAEC,YAAkD;CAClF,MAAMvB,UAAUmB,WAAW;;;;;;CAM3B,OAAOzB,kBAAC2B,gBAAc;EAACG,OAAOxB;EAAUuB;CAAQ,CAAiB;AACnE"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@warp-drive-mirror/react",
|
|
3
3
|
"description": "Data bindings and utilities for React applications using WarpDrive",
|
|
4
|
-
"version": "5.9.0-beta.
|
|
4
|
+
"version": "5.9.0-beta.2",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Chris Thoburn <runspired@users.noreply.github.com>",
|
|
7
7
|
"repository": {
|
|
@@ -18,7 +18,6 @@
|
|
|
18
18
|
"warp-drive"
|
|
19
19
|
],
|
|
20
20
|
"files": [
|
|
21
|
-
"declarations",
|
|
22
21
|
"addon-main.cjs",
|
|
23
22
|
"dist",
|
|
24
23
|
"README.md",
|
|
@@ -31,7 +30,7 @@
|
|
|
31
30
|
"unpkg-dev": "./dist/unpkg/dev/index.js",
|
|
32
31
|
"unpkg-deprecated": "./dist/unpkg/prod-deprecated/index.js",
|
|
33
32
|
"unpkg": "./dist/unpkg/prod/index.js",
|
|
34
|
-
"types": "./
|
|
33
|
+
"types": "./dist/index.d.ts",
|
|
35
34
|
"default": "./dist/index.js"
|
|
36
35
|
},
|
|
37
36
|
"./*": {
|
|
@@ -39,52 +38,45 @@
|
|
|
39
38
|
"unpkg-dev": "./dist/unpkg/dev/*.js",
|
|
40
39
|
"unpkg-deprecated": "./dist/unpkg/prod-deprecated/*.js",
|
|
41
40
|
"unpkg": "./dist/unpkg/prod/*.js",
|
|
42
|
-
"types": "./
|
|
41
|
+
"types": "./dist/*.d.ts",
|
|
43
42
|
"default": "./dist/*.js"
|
|
44
43
|
}
|
|
45
44
|
},
|
|
46
|
-
"peerDependencies": {},
|
|
47
45
|
"dependencies": {
|
|
48
|
-
"@embroider/macros": "^1.
|
|
49
|
-
"@warp-drive-mirror/core": "5.9.0-beta.
|
|
50
|
-
"@warp-drive-mirror/tc39-proposal-signals": "5.9.0-beta.
|
|
51
|
-
"
|
|
52
|
-
"
|
|
46
|
+
"@embroider/macros": "^1.20.6",
|
|
47
|
+
"@warp-drive-mirror/core": "5.9.0-beta.2",
|
|
48
|
+
"@warp-drive-mirror/tc39-proposal-signals": "5.9.0-beta.2",
|
|
49
|
+
"react": "^19.2.8",
|
|
50
|
+
"signal-polyfill": "^0.2.2"
|
|
53
51
|
},
|
|
54
52
|
"peerDependenciesMeta": {},
|
|
55
53
|
"devDependencies": {
|
|
56
|
-
"@babel/core": "^7.
|
|
57
|
-
"@babel/plugin-transform-typescript": "^7.
|
|
58
|
-
"@babel/preset-env": "^7.
|
|
59
|
-
"@babel/preset-
|
|
60
|
-
"@babel/preset-
|
|
61
|
-
"@babel/runtime": "^7.
|
|
62
|
-
"
|
|
63
|
-
"@
|
|
64
|
-
"@warp-drive/internal-config": "5.9.0-beta.
|
|
65
|
-
"
|
|
66
|
-
"
|
|
67
|
-
"
|
|
68
|
-
"
|
|
69
|
-
"typescript": "^5.9.2",
|
|
70
|
-
"vite": "^7.1.3"
|
|
71
|
-
},
|
|
72
|
-
"volta": {
|
|
73
|
-
"extends": "../../../../../../package.json"
|
|
54
|
+
"@babel/core": "^7.29.7",
|
|
55
|
+
"@babel/plugin-transform-typescript": "^7.29.7",
|
|
56
|
+
"@babel/preset-env": "^7.29.7",
|
|
57
|
+
"@babel/preset-react": "^7.29.7",
|
|
58
|
+
"@babel/preset-typescript": "^7.29.7",
|
|
59
|
+
"@babel/runtime": "^7.29.7",
|
|
60
|
+
"@types/react": "^19.2.18",
|
|
61
|
+
"@warp-drive-mirror/core": "5.9.0-beta.2",
|
|
62
|
+
"@warp-drive/internal-config": "5.9.0-beta.2",
|
|
63
|
+
"decorator-transforms": "^2.4.0",
|
|
64
|
+
"react": "^19.2.8",
|
|
65
|
+
"tsdown": "^0.22.14",
|
|
66
|
+
"typescript-7": "npm:typescript@7.1.0-dev.20260828.1"
|
|
74
67
|
},
|
|
75
68
|
"ember-addon": {
|
|
76
69
|
"main": "addon-main.cjs",
|
|
77
70
|
"type": "addon",
|
|
78
|
-
"version": 2
|
|
79
|
-
"externals": []
|
|
71
|
+
"version": 2
|
|
80
72
|
},
|
|
81
73
|
"ember": {
|
|
82
74
|
"edition": "octane"
|
|
83
75
|
},
|
|
84
76
|
"scripts": {
|
|
85
|
-
"build:pkg": "
|
|
77
|
+
"build:pkg": "NODE_ENV=production node node_modules/tsdown/dist/run.mjs",
|
|
86
78
|
"sync": "echo \"syncing\"",
|
|
87
|
-
"
|
|
88
|
-
"start": "
|
|
79
|
+
"check:types": "node ./node_modules/typescript-7/bin/tsc --noEmit",
|
|
80
|
+
"start": "node node_modules/tsdown/dist/run.mjs --watch"
|
|
89
81
|
}
|
|
90
82
|
}
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { Signal } from "signal-polyfill";
|
|
2
|
-
import { type JSX, type ReactNode, type Context } from "react";
|
|
3
|
-
export declare function useWatcher(): {
|
|
4
|
-
watcher: Signal.subtle.Watcher;
|
|
5
|
-
} | null;
|
|
6
|
-
/**
|
|
7
|
-
* @category Contexts
|
|
8
|
-
*/
|
|
9
|
-
export declare const WatcherContext: Context<{
|
|
10
|
-
watcher: Signal.subtle.Watcher;
|
|
11
|
-
} | null>;
|
|
12
|
-
/**
|
|
13
|
-
*
|
|
14
|
-
* @category Components
|
|
15
|
-
*/
|
|
16
|
-
export declare function ReactiveContext({ children }: {
|
|
17
|
-
children: ReactNode;
|
|
18
|
-
}): JSX.Element;
|
|
@@ -1,142 +0,0 @@
|
|
|
1
|
-
import { type RequestLoadingState, type RequestState } from "@warp-drive-mirror/core/reactive";
|
|
2
|
-
import { RequestArgs, type ContentFeatures, type RecoveryFeatures } from "@warp-drive-mirror/core/signals/-leaked";
|
|
3
|
-
import type { StructuredErrorDocument } from "@warp-drive-mirror/core/types/request";
|
|
4
|
-
import { JSX, ReactNode } from "react";
|
|
5
|
-
interface ChromeComponentProps<RT> {
|
|
6
|
-
children: ReactNode;
|
|
7
|
-
state: RequestState | null;
|
|
8
|
-
features: ContentFeatures<RT>;
|
|
9
|
-
}
|
|
10
|
-
export interface RequestProps<
|
|
11
|
-
RT,
|
|
12
|
-
E
|
|
13
|
-
> extends RequestArgs<RT, E> {
|
|
14
|
-
chrome?: React.FC<ChromeComponentProps<RT>>;
|
|
15
|
-
states: RequestStates<RT, E>;
|
|
16
|
-
}
|
|
17
|
-
interface RequestStates<
|
|
18
|
-
RT,
|
|
19
|
-
E
|
|
20
|
-
> {
|
|
21
|
-
/**
|
|
22
|
-
* The block to render when the component is idle and waiting to be given a request.
|
|
23
|
-
*
|
|
24
|
-
*/
|
|
25
|
-
idle?: React.FC<{}>;
|
|
26
|
-
/**
|
|
27
|
-
* The block to render when the request is loading.
|
|
28
|
-
*
|
|
29
|
-
*/
|
|
30
|
-
loading?: React.FC<{
|
|
31
|
-
state: RequestLoadingState;
|
|
32
|
-
}>;
|
|
33
|
-
/**
|
|
34
|
-
* The block to render when the request was cancelled.
|
|
35
|
-
*
|
|
36
|
-
*/
|
|
37
|
-
cancelled?: React.FC<{
|
|
38
|
-
/**
|
|
39
|
-
* The Error the request rejected with.
|
|
40
|
-
*/
|
|
41
|
-
error: StructuredErrorDocument<E>;
|
|
42
|
-
/**
|
|
43
|
-
* Utilities to assist in recovering from the error.
|
|
44
|
-
*/
|
|
45
|
-
features: RecoveryFeatures;
|
|
46
|
-
}>;
|
|
47
|
-
/**
|
|
48
|
-
* The block to render when the request failed. If this block is not provided,
|
|
49
|
-
* the error will be rethrown.
|
|
50
|
-
*
|
|
51
|
-
* Thus it is required to provide an error block and proper error handling if
|
|
52
|
-
* you do not want the error to crash the application.
|
|
53
|
-
*/
|
|
54
|
-
error: React.FC<{
|
|
55
|
-
/**
|
|
56
|
-
* The Error the request rejected with.
|
|
57
|
-
*/
|
|
58
|
-
error: StructuredErrorDocument<E>;
|
|
59
|
-
/**
|
|
60
|
-
* Utilities to assist in recovering from the error.
|
|
61
|
-
*/
|
|
62
|
-
features: RecoveryFeatures;
|
|
63
|
-
}>;
|
|
64
|
-
/**
|
|
65
|
-
* The block to render when the request succeeded.
|
|
66
|
-
*
|
|
67
|
-
*/
|
|
68
|
-
content: React.FC<{
|
|
69
|
-
result: RT;
|
|
70
|
-
features: ContentFeatures<RT>;
|
|
71
|
-
}>;
|
|
72
|
-
}
|
|
73
|
-
export declare function Throw({ error }: {
|
|
74
|
-
error: Error;
|
|
75
|
-
}): never;
|
|
76
|
-
/**
|
|
77
|
-
* The `<Request />` component is a powerful tool for managing data fetching and
|
|
78
|
-
* state in your React application. It provides a declarative approach to reactive
|
|
79
|
-
* control-flow for managing requests and state in your application.
|
|
80
|
-
*
|
|
81
|
-
* The `<Request />` component is ideal for handling "boundaries", outside which some
|
|
82
|
-
* state is still allowed to be unresolved and within which it MUST be resolved.
|
|
83
|
-
*
|
|
84
|
-
* ## Request States
|
|
85
|
-
*
|
|
86
|
-
* `<Request />` has five states, only one of which will be active and rendered at a time.
|
|
87
|
-
*
|
|
88
|
-
* - `idle`: The component is waiting to be given a request to monitor
|
|
89
|
-
* - `loading`: The request is in progress
|
|
90
|
-
* - `error`: The request failed
|
|
91
|
-
* - `content`: The request succeeded
|
|
92
|
-
* - `cancelled`: The request was cancelled
|
|
93
|
-
*
|
|
94
|
-
* Additionally, the `content` state has a `refresh` method that can be used to
|
|
95
|
-
* refresh the request in the background, which is available as a sub-state of
|
|
96
|
-
* the `content` state.
|
|
97
|
-
*
|
|
98
|
-
* ### Example Usage
|
|
99
|
-
*
|
|
100
|
-
* ```tsx
|
|
101
|
-
* import { Request } from "@warp-drive-mirror/react";
|
|
102
|
-
*
|
|
103
|
-
* export function UserPreview($props: { id: string | null }) {
|
|
104
|
-
* return (
|
|
105
|
-
* <Request
|
|
106
|
-
* query={findRecord('user', $props.id)}
|
|
107
|
-
* states={{
|
|
108
|
-
* idle: () => <div>Waiting for User Selection</div>,
|
|
109
|
-
* loading: ({ state }) => <div>Loading user data...</div>,
|
|
110
|
-
* cancelled: ({ error, features }) => (
|
|
111
|
-
* <div>
|
|
112
|
-
* <p>Request Cancelled</p>
|
|
113
|
-
* <p><button onClick={features.retry}>Start Again?</button></p>
|
|
114
|
-
* </div>
|
|
115
|
-
* ),
|
|
116
|
-
* error: ({ error, features }) => (
|
|
117
|
-
* <div>
|
|
118
|
-
* <p>Error: {error.message}</p>
|
|
119
|
-
* <p><button onClick={features.retry}>Try Again?</button></p>
|
|
120
|
-
* </div>
|
|
121
|
-
* ),
|
|
122
|
-
* content: ({ result, features }) => (
|
|
123
|
-
* <div>
|
|
124
|
-
* <h2>User Details</h2>
|
|
125
|
-
* <p>ID: {result.id}</p>
|
|
126
|
-
* <p>Name: {result.name}</p>
|
|
127
|
-
* </div>
|
|
128
|
-
* ),
|
|
129
|
-
* }}
|
|
130
|
-
* />
|
|
131
|
-
* );
|
|
132
|
-
* }
|
|
133
|
-
*
|
|
134
|
-
* ```
|
|
135
|
-
*
|
|
136
|
-
* @category Components
|
|
137
|
-
*/
|
|
138
|
-
export declare function Request<
|
|
139
|
-
RT,
|
|
140
|
-
E
|
|
141
|
-
>($props: RequestProps<RT, E>): JSX.Element;
|
|
142
|
-
export {};
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { Store } from "@warp-drive-mirror/core";
|
|
2
|
-
import { JSX, ReactNode } from "react";
|
|
3
|
-
/**
|
|
4
|
-
* @category Hooks
|
|
5
|
-
*/
|
|
6
|
-
export declare function useStore(): Store;
|
|
7
|
-
type WithExistingStore = {
|
|
8
|
-
store: Store;
|
|
9
|
-
children: ReactNode;
|
|
10
|
-
};
|
|
11
|
-
type WithNewStore = {
|
|
12
|
-
Store: typeof Store;
|
|
13
|
-
children: ReactNode;
|
|
14
|
-
};
|
|
15
|
-
/**
|
|
16
|
-
* @category Components
|
|
17
|
-
*/
|
|
18
|
-
export declare function StoreProvider($props: WithExistingStore | WithNewStore): JSX.Element;
|
|
19
|
-
export {};
|
package/declarations/index.d.ts
DELETED