@warp-drive-mirror/react 5.8.0-alpha.4 → 5.8.0-alpha.41
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/README.md +36 -15
- package/declarations/-private/request.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/unpkg/dev/index.js +324 -0
- package/dist/unpkg/dev/install.js +102 -0
- package/dist/unpkg/dev/reactive-context-CTtwoaBx.js +290 -0
- package/dist/unpkg/dev-deprecated/index.js +324 -0
- package/dist/unpkg/dev-deprecated/install.js +102 -0
- package/dist/unpkg/dev-deprecated/reactive-context-sqyJMb7I.js +290 -0
- package/dist/unpkg/prod/index.js +250 -0
- package/dist/unpkg/prod/install.js +56 -0
- package/dist/unpkg/prod/reactive-context-DKimDkR3.js +110 -0
- package/dist/unpkg/prod-deprecated/index.js +250 -0
- package/dist/unpkg/prod-deprecated/install.js +56 -0
- package/dist/unpkg/prod-deprecated/reactive-context-DKimDkR3.js +110 -0
- package/logos/README.md +2 -2
- package/logos/logo-yellow-slab.svg +1 -0
- package/logos/word-mark-black.svg +1 -0
- package/logos/word-mark-white.svg +1 -0
- package/package.json +13 -5
- package/logos/NCC-1701-a-blue.svg +0 -4
- package/logos/NCC-1701-a-gold.svg +0 -4
- package/logos/NCC-1701-a-gold_100.svg +0 -1
- package/logos/NCC-1701-a-gold_base-64.txt +0 -1
- package/logos/NCC-1701-a.svg +0 -4
- package/logos/docs-badge.svg +0 -2
- package/logos/ember-data-logo-dark.svg +0 -12
- package/logos/ember-data-logo-light.svg +0 -12
- package/logos/social1.png +0 -0
- package/logos/social2.png +0 -0
- package/logos/warp-drive-logo-dark.svg +0 -4
- package/logos/warp-drive-logo-gold.svg +0 -4
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import { use } from 'react';
|
|
2
|
+
import { Signal } from 'signal-polyfill';
|
|
3
|
+
import { setupSignals } from '@warp-drive-mirror/core/configure';
|
|
4
|
+
import { g as getGlobalConfig, W as WatcherContext } from "./reactive-context-sqyJMb7I.js";
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* {@include ./install.md}
|
|
8
|
+
* @module
|
|
9
|
+
*/
|
|
10
|
+
|
|
11
|
+
function tryConsumeContext(signal) {
|
|
12
|
+
// eslint-disable-next-line no-console
|
|
13
|
+
const logError = console.error;
|
|
14
|
+
try {
|
|
15
|
+
// eslint-disable-next-line no-console
|
|
16
|
+
console.error = () => {};
|
|
17
|
+
// ensure signals are watched by our closest watcher
|
|
18
|
+
const watcher = use(WatcherContext);
|
|
19
|
+
// eslint-disable-next-line no-console
|
|
20
|
+
console.error = logError;
|
|
21
|
+
watcher?.watcher.watch(signal);
|
|
22
|
+
{
|
|
23
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
24
|
+
// eslint-disable-next-line no-console
|
|
25
|
+
console.log(`[WarpDrive] Consumed Context Signal`, signal, watcher);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
} catch {
|
|
29
|
+
// eslint-disable-next-line no-console
|
|
30
|
+
console.error = logError;
|
|
31
|
+
// if we are not in a React context, we will Error
|
|
32
|
+
// so we just ignore it.
|
|
33
|
+
{
|
|
34
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
35
|
+
// eslint-disable-next-line no-console
|
|
36
|
+
console.log(`[WarpDrive] No Context Available To Consume Signal`, signal);
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
let pending;
|
|
42
|
+
async function settled() {
|
|
43
|
+
{
|
|
44
|
+
// in testing mode we provide a test waiter integration
|
|
45
|
+
if (!pending || !pending.length) return;
|
|
46
|
+
const current = pending ?? [];
|
|
47
|
+
pending = [];
|
|
48
|
+
await Promise.allSettled(current);
|
|
49
|
+
await Promise.resolve();
|
|
50
|
+
await Promise.resolve();
|
|
51
|
+
await Promise.resolve();
|
|
52
|
+
return settled();
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
function buildSignalConfig(options) {
|
|
56
|
+
return {
|
|
57
|
+
createSignal: (obj, key) => new Signal.State({
|
|
58
|
+
obj,
|
|
59
|
+
key
|
|
60
|
+
}, {
|
|
61
|
+
equals: () => false
|
|
62
|
+
}),
|
|
63
|
+
notifySignal: signal => {
|
|
64
|
+
{
|
|
65
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
66
|
+
if (Signal.subtle.hasSinks(signal)) {
|
|
67
|
+
// eslint-disable-next-line no-console
|
|
68
|
+
console.log(`[WarpDrive] Notifying Signal`, signal);
|
|
69
|
+
} else {
|
|
70
|
+
// eslint-disable-next-line no-console
|
|
71
|
+
console.log(`[WarpDrive] Notified Signal That Has No Watcher`, signal);
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
signal.set(signal.get());
|
|
76
|
+
},
|
|
77
|
+
consumeSignal: signal => {
|
|
78
|
+
tryConsumeContext(signal);
|
|
79
|
+
void signal.get();
|
|
80
|
+
},
|
|
81
|
+
createMemo: (object, key, fn) => {
|
|
82
|
+
const memo = new Signal.Computed(fn);
|
|
83
|
+
return () => {
|
|
84
|
+
tryConsumeContext(memo);
|
|
85
|
+
return memo.get();
|
|
86
|
+
};
|
|
87
|
+
},
|
|
88
|
+
waitFor: promise => {
|
|
89
|
+
{
|
|
90
|
+
pending = pending || [];
|
|
91
|
+
const newPromise = promise.finally(() => {
|
|
92
|
+
pending = pending.filter(p => p !== newPromise);
|
|
93
|
+
});
|
|
94
|
+
pending.push(newPromise);
|
|
95
|
+
return newPromise;
|
|
96
|
+
}
|
|
97
|
+
},
|
|
98
|
+
willSyncFlushWatchers: () => false
|
|
99
|
+
};
|
|
100
|
+
}
|
|
101
|
+
setupSignals(buildSignalConfig);
|
|
102
|
+
export { buildSignalConfig, settled };
|
|
@@ -0,0 +1,290 @@
|
|
|
1
|
+
import { Signal } from 'signal-polyfill';
|
|
2
|
+
import { createContext, useMemo, useSyncExternalStore } from 'react';
|
|
3
|
+
import { jsxDEV } from 'react/jsx-dev-runtime';
|
|
4
|
+
|
|
5
|
+
/*
|
|
6
|
+
These are the runtime implementations for the javascript macros that have
|
|
7
|
+
runtime implementations.
|
|
8
|
+
|
|
9
|
+
Not every macro has a runtime implementation, some only make sense in the
|
|
10
|
+
build and always run there.
|
|
11
|
+
|
|
12
|
+
Even when we have runtime implementations, we are still careful to emit static
|
|
13
|
+
errors during the build wherever possible, and runtime errors when necessary,
|
|
14
|
+
so that you're not surprised when you switch from runtime-mode to compile-time
|
|
15
|
+
mode.
|
|
16
|
+
*/
|
|
17
|
+
|
|
18
|
+
// This is here as a compile target for `getConfig` and `getOwnConfig` when
|
|
19
|
+
// we're in runtime mode. This is not public API to call from your own code.
|
|
20
|
+
function config(packageRoot) {
|
|
21
|
+
return runtimeConfig.packages[packageRoot];
|
|
22
|
+
}
|
|
23
|
+
function getGlobalConfig() {
|
|
24
|
+
return runtimeConfig.global;
|
|
25
|
+
}
|
|
26
|
+
const runtimeConfig = initializeRuntimeMacrosConfig();
|
|
27
|
+
|
|
28
|
+
// this exists to be targeted by our babel plugin
|
|
29
|
+
function initializeRuntimeMacrosConfig() {
|
|
30
|
+
return {
|
|
31
|
+
"packages": {},
|
|
32
|
+
"global": {
|
|
33
|
+
"@embroider/macros": {
|
|
34
|
+
"isTesting": false
|
|
35
|
+
},
|
|
36
|
+
"WarpDrive": {
|
|
37
|
+
"debug": {
|
|
38
|
+
"DEBUG_RELATIONSHIP_NOTIFICATIONS": false,
|
|
39
|
+
"LOG_CACHE": false,
|
|
40
|
+
"LOG_CACHE_POLICY": false,
|
|
41
|
+
"LOG_GRAPH": false,
|
|
42
|
+
"LOG_IDENTIFIERS": false,
|
|
43
|
+
"LOG_INSTANCE_CACHE": false,
|
|
44
|
+
"LOG_METRIC_COUNTS": false,
|
|
45
|
+
"LOG_MUTATIONS": false,
|
|
46
|
+
"LOG_NOTIFICATIONS": false,
|
|
47
|
+
"LOG_OPERATIONS": false,
|
|
48
|
+
"LOG_PAYLOADS": false,
|
|
49
|
+
"LOG_REACT_SIGNAL_INTEGRATION": false,
|
|
50
|
+
"LOG_REQUESTS": false,
|
|
51
|
+
"LOG_REQUEST_STATUS": false,
|
|
52
|
+
"__INTERNAL_LOG_NATIVE_MAP_SET_COUNTS": false
|
|
53
|
+
},
|
|
54
|
+
"polyfillUUID": false,
|
|
55
|
+
"includeDataAdapter": true,
|
|
56
|
+
"compatWith": null,
|
|
57
|
+
"deprecations": {
|
|
58
|
+
"DEPRECATE_CATCH_ALL": true,
|
|
59
|
+
"DEPRECATE_COMPUTED_CHAINS": true,
|
|
60
|
+
"DEPRECATE_EMBER_INFLECTOR": true,
|
|
61
|
+
"DEPRECATE_LEGACY_IMPORTS": true,
|
|
62
|
+
"DEPRECATE_MANY_ARRAY_DUPLICATES": true,
|
|
63
|
+
"DEPRECATE_NON_STRICT_ID": true,
|
|
64
|
+
"DEPRECATE_NON_STRICT_TYPES": true,
|
|
65
|
+
"DEPRECATE_NON_UNIQUE_PAYLOADS": true,
|
|
66
|
+
"DEPRECATE_RELATIONSHIP_REMOTE_UPDATE_CLEARING_LOCAL_STATE": true,
|
|
67
|
+
"DEPRECATE_STORE_EXTENDS_EMBER_OBJECT": true,
|
|
68
|
+
"DEPRECATE_TRACKING_PACKAGE": true,
|
|
69
|
+
"DISABLE_7X_DEPRECATIONS": true,
|
|
70
|
+
"ENABLE_LEGACY_REQUEST_METHODS": true,
|
|
71
|
+
"ENABLE_LEGACY_SCHEMA_SERVICE": true
|
|
72
|
+
},
|
|
73
|
+
"features": {
|
|
74
|
+
"ENFORCE_STRICT_RESOURCE_FINALIZATION": false,
|
|
75
|
+
"JSON_API_CACHE_VALIDATION_ERRORS": false,
|
|
76
|
+
"SAMPLE_FEATURE_FLAG": null
|
|
77
|
+
},
|
|
78
|
+
"activeLogging": {
|
|
79
|
+
"DEBUG_RELATIONSHIP_NOTIFICATIONS": true,
|
|
80
|
+
"LOG_CACHE": true,
|
|
81
|
+
"LOG_CACHE_POLICY": true,
|
|
82
|
+
"LOG_GRAPH": true,
|
|
83
|
+
"LOG_IDENTIFIERS": true,
|
|
84
|
+
"LOG_INSTANCE_CACHE": true,
|
|
85
|
+
"LOG_METRIC_COUNTS": true,
|
|
86
|
+
"LOG_MUTATIONS": true,
|
|
87
|
+
"LOG_NOTIFICATIONS": true,
|
|
88
|
+
"LOG_OPERATIONS": true,
|
|
89
|
+
"LOG_PAYLOADS": true,
|
|
90
|
+
"LOG_REACT_SIGNAL_INTEGRATION": true,
|
|
91
|
+
"LOG_REQUESTS": true,
|
|
92
|
+
"LOG_REQUEST_STATUS": true,
|
|
93
|
+
"__INTERNAL_LOG_NATIVE_MAP_SET_COUNTS": true
|
|
94
|
+
},
|
|
95
|
+
"env": {
|
|
96
|
+
"TESTING": true,
|
|
97
|
+
"PRODUCTION": false,
|
|
98
|
+
"DEBUG": true,
|
|
99
|
+
"IS_RECORDING": false,
|
|
100
|
+
"IS_CI": true,
|
|
101
|
+
"SHOULD_RECORD": false
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
};
|
|
106
|
+
}
|
|
107
|
+
function updaterMethods() {
|
|
108
|
+
return {
|
|
109
|
+
config,
|
|
110
|
+
getGlobalConfig,
|
|
111
|
+
setConfig(packageRoot, value) {
|
|
112
|
+
runtimeConfig.packages[packageRoot] = value;
|
|
113
|
+
},
|
|
114
|
+
setGlobalConfig(key, value) {
|
|
115
|
+
runtimeConfig.global[key] = value;
|
|
116
|
+
}
|
|
117
|
+
};
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
// this is how runtime config can get injected at boot. I'm not sure yet if this
|
|
121
|
+
// should be public API, but we certainly need it internally to set things like
|
|
122
|
+
// the global fastboot.isRunning.
|
|
123
|
+
//
|
|
124
|
+
// consumers of this API push a function onto
|
|
125
|
+
// window._embroider_macros_runtime_config. The function is given four methods
|
|
126
|
+
// which allow it to read and write the per-package and global configs. The
|
|
127
|
+
// reason for allowing both read & write is that merging strategies are up to
|
|
128
|
+
// each consumers -- read first, then merge, then write.
|
|
129
|
+
//
|
|
130
|
+
// For an example user of this API, see where we generate
|
|
131
|
+
// embroider_macros_fastboot_init.js' in @embroider/core.
|
|
132
|
+
let updaters = typeof window !== 'undefined' ? window._embroider_macros_runtime_config : undefined;
|
|
133
|
+
if (updaters) {
|
|
134
|
+
let methods = updaterMethods();
|
|
135
|
+
for (let updater of updaters) {
|
|
136
|
+
updater(methods);
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
var _jsxFileName = "/home/runner/work/warp-drive/warp-drive/warp-drive-packages/react/src/-private/reactive-context.tsx";
|
|
140
|
+
let nextFlush = null;
|
|
141
|
+
let watchers = [];
|
|
142
|
+
let watcherId = 0;
|
|
143
|
+
function clearWatcher(state) {
|
|
144
|
+
state.watcher.unwatch(...Signal.subtle.introspectSources(state.watcher));
|
|
145
|
+
}
|
|
146
|
+
function flush(state) {
|
|
147
|
+
state.pending = false;
|
|
148
|
+
if (state.destroyed) {
|
|
149
|
+
{
|
|
150
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
151
|
+
console.log(`[WarpDrive] Detected Watcher Destroyed During Notify Flush, clearing signals`);
|
|
152
|
+
}
|
|
153
|
+
}
|
|
154
|
+
state.snapshot = null;
|
|
155
|
+
clearWatcher(state);
|
|
156
|
+
return;
|
|
157
|
+
}
|
|
158
|
+
{
|
|
159
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
160
|
+
console.log(`[WarpDrive] Notifying React That WatcherContext:${state.watcherId} Has Updated`);
|
|
161
|
+
console.log("all signals", new Set(Signal.subtle.introspectSources(state.watcher)));
|
|
162
|
+
console.log("dirty signals", new Set(state.watcher.getPending()));
|
|
163
|
+
}
|
|
164
|
+
} // any time signals have changed, we notify React that our store has updated
|
|
165
|
+
state.snapshot = {
|
|
166
|
+
watcher: state.watcher
|
|
167
|
+
};
|
|
168
|
+
if (state.notifyReact) state.notifyReact();
|
|
169
|
+
|
|
170
|
+
// tell the Watcher to start watching for changes again
|
|
171
|
+
// by signaling that notifications have been flushed.
|
|
172
|
+
state.watcher.watch();
|
|
173
|
+
}
|
|
174
|
+
function _createWatcher() {
|
|
175
|
+
const id = watcherId++;
|
|
176
|
+
{
|
|
177
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
178
|
+
console.log(`[WarpDrive] Creating a WatcherContext:${id}`);
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
const state = {
|
|
182
|
+
watcherId: id,
|
|
183
|
+
pending: false,
|
|
184
|
+
destroyed: false,
|
|
185
|
+
notifyReact: null,
|
|
186
|
+
watcher: null,
|
|
187
|
+
// the extra wrapper returned here ensures that the context value for the watcher
|
|
188
|
+
// changes causing a re-render when the watcher is updated.
|
|
189
|
+
snapshot: null
|
|
190
|
+
};
|
|
191
|
+
state.watcher = new Signal.subtle.Watcher((...args) => {
|
|
192
|
+
{
|
|
193
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
194
|
+
console.log(`watcher ${state.watcherId} notified`, args, state.watcher);
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
if (!state.pending && !state.destroyed) {
|
|
198
|
+
watchers.push(state);
|
|
199
|
+
state.pending = true;
|
|
200
|
+
if (!nextFlush) {
|
|
201
|
+
nextFlush = new Promise(resolve => {
|
|
202
|
+
queueMicrotask(() => {
|
|
203
|
+
queueMicrotask(() => {
|
|
204
|
+
queueMicrotask(() => {
|
|
205
|
+
watchers.forEach(flush);
|
|
206
|
+
{
|
|
207
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
208
|
+
console.log("Flushed watcher:", watchers.map(w => w.watcherId));
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
watchers = [];
|
|
212
|
+
nextFlush = null;
|
|
213
|
+
resolve();
|
|
214
|
+
});
|
|
215
|
+
});
|
|
216
|
+
});
|
|
217
|
+
});
|
|
218
|
+
}
|
|
219
|
+
} else if (state.destroyed) {
|
|
220
|
+
{
|
|
221
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
222
|
+
console.log(`[WarpDrive] Detected Watcher Destroyed During Notify, clearing signals`);
|
|
223
|
+
}
|
|
224
|
+
} // if we are destroyed, we clear the watcher signals
|
|
225
|
+
// so that it does not continue to watch for changes.
|
|
226
|
+
state.snapshot = null;
|
|
227
|
+
clearWatcher(state);
|
|
228
|
+
}
|
|
229
|
+
});
|
|
230
|
+
|
|
231
|
+
// The watcher won't begin watching until we call `watcher.watch()`
|
|
232
|
+
state.watcher.watch();
|
|
233
|
+
state.snapshot = {
|
|
234
|
+
watcher: state.watcher
|
|
235
|
+
};
|
|
236
|
+
return state;
|
|
237
|
+
}
|
|
238
|
+
function useWatcher() {
|
|
239
|
+
const state = useMemo(_createWatcher, []);
|
|
240
|
+
return useSyncExternalStore(notifyChanged => {
|
|
241
|
+
{
|
|
242
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
243
|
+
console.log(`[WarpDrive] Subscribing to Watcher`);
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
state.destroyed = false;
|
|
247
|
+
state.notifyReact = notifyChanged;
|
|
248
|
+
|
|
249
|
+
// The watcher won't begin watching until we call `watcher.watch()`
|
|
250
|
+
state.watcher.watch();
|
|
251
|
+
return () => {
|
|
252
|
+
{
|
|
253
|
+
if (getGlobalConfig().WarpDriveMirror.debug.LOG_REACT_SIGNAL_INTEGRATION || globalThis.getWarpDriveRuntimeConfig().debug.LOG_REACT_SIGNAL_INTEGRATION) {
|
|
254
|
+
console.log(`[WarpDrive] Deactivating Watcher Subscription`);
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
state.destroyed = true;
|
|
258
|
+
state.notifyReact = null;
|
|
259
|
+
};
|
|
260
|
+
}, () => state.snapshot);
|
|
261
|
+
}
|
|
262
|
+
|
|
263
|
+
/**
|
|
264
|
+
* @category Contexts
|
|
265
|
+
*/
|
|
266
|
+
const WatcherContext = /*#__PURE__*/createContext(null);
|
|
267
|
+
|
|
268
|
+
/**
|
|
269
|
+
*
|
|
270
|
+
* @category Components
|
|
271
|
+
*/
|
|
272
|
+
function ReactiveContext({
|
|
273
|
+
children
|
|
274
|
+
}) {
|
|
275
|
+
const watcher = useWatcher();
|
|
276
|
+
/**
|
|
277
|
+
* Unlike other frameworks, React does not have a built-in way to provide
|
|
278
|
+
* a context value other than by rendering an extra component.
|
|
279
|
+
*
|
|
280
|
+
*/
|
|
281
|
+
return /*#__PURE__*/jsxDEV(WatcherContext, {
|
|
282
|
+
value: watcher,
|
|
283
|
+
children: children
|
|
284
|
+
}, void 0, false, {
|
|
285
|
+
fileName: _jsxFileName,
|
|
286
|
+
lineNumber: 159,
|
|
287
|
+
columnNumber: 10
|
|
288
|
+
}, this);
|
|
289
|
+
}
|
|
290
|
+
export { ReactiveContext as R, WatcherContext as W, getGlobalConfig as g };
|
|
@@ -0,0 +1,250 @@
|
|
|
1
|
+
import { R as ReactiveContext } from "./reactive-context-DKimDkR3.js";
|
|
2
|
+
export { W as WatcherContext } from "./reactive-context-DKimDkR3.js";
|
|
3
|
+
import '@warp-drive-mirror/core';
|
|
4
|
+
import { useMemo, createContext, use, useRef, useEffect } from 'react';
|
|
5
|
+
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
6
|
+
import { createRequestSubscription } from '@warp-drive-mirror/core/reactive';
|
|
7
|
+
import { DISPOSE, signal } from '@warp-drive-mirror/core/signals/-leaked';
|
|
8
|
+
import '@warp-drive-mirror/core/request';
|
|
9
|
+
const StoreContext = /*#__PURE__*/createContext(null);
|
|
10
|
+
|
|
11
|
+
/**
|
|
12
|
+
* @category Hooks
|
|
13
|
+
*/
|
|
14
|
+
function useStore() {
|
|
15
|
+
const store = use(StoreContext);
|
|
16
|
+
return store;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* @category Components
|
|
20
|
+
*/
|
|
21
|
+
function StoreProvider($props) {
|
|
22
|
+
const store = useMemo(() => "store" in $props ? $props.store : new $props.Store(), ["store" in $props ? $props.store : $props.Store]);
|
|
23
|
+
return /*#__PURE__*/jsx(StoreContext, {
|
|
24
|
+
value: store,
|
|
25
|
+
children: $props.children
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
const deferred = /* @__PURE__ */new WeakMap();
|
|
29
|
+
function deferDecorator(proto, prop, desc) {
|
|
30
|
+
let map = deferred.get(proto);
|
|
31
|
+
if (!map) {
|
|
32
|
+
map = /* @__PURE__ */new Map();
|
|
33
|
+
deferred.set(proto, map);
|
|
34
|
+
}
|
|
35
|
+
map.set(prop, desc);
|
|
36
|
+
}
|
|
37
|
+
function findDeferredDecorator(target, prop) {
|
|
38
|
+
var _a;
|
|
39
|
+
let cursor = target.prototype;
|
|
40
|
+
while (cursor) {
|
|
41
|
+
let desc = (_a = deferred.get(cursor)) == null ? void 0 : _a.get(prop);
|
|
42
|
+
if (desc) {
|
|
43
|
+
return desc;
|
|
44
|
+
}
|
|
45
|
+
cursor = cursor.prototype;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
function decorateFieldV2(prototype, prop, decorators, initializer) {
|
|
49
|
+
let desc = {
|
|
50
|
+
configurable: true,
|
|
51
|
+
enumerable: true,
|
|
52
|
+
writable: true,
|
|
53
|
+
initializer: null
|
|
54
|
+
};
|
|
55
|
+
if (initializer) {
|
|
56
|
+
desc.initializer = initializer;
|
|
57
|
+
}
|
|
58
|
+
for (let decorator of decorators) {
|
|
59
|
+
desc = decorator(prototype, prop, desc) || desc;
|
|
60
|
+
}
|
|
61
|
+
if (desc.initializer === void 0) {
|
|
62
|
+
Object.defineProperty(prototype, prop, desc);
|
|
63
|
+
} else {
|
|
64
|
+
deferDecorator(prototype, prop, desc);
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
function initializeDeferredDecorator(target, prop) {
|
|
68
|
+
let desc = findDeferredDecorator(target.constructor, prop);
|
|
69
|
+
if (desc) {
|
|
70
|
+
Object.defineProperty(target, prop, {
|
|
71
|
+
enumerable: desc.enumerable,
|
|
72
|
+
configurable: desc.configurable,
|
|
73
|
+
writable: desc.writable,
|
|
74
|
+
value: desc.initializer ? desc.initializer.call(target) : void 0
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
const IdleBlockMissingError = new Error("No idle block provided for <Request> component, and no query or request was provided.");
|
|
79
|
+
class ReactiveArgs {
|
|
80
|
+
static {
|
|
81
|
+
decorateFieldV2(this.prototype, "request", [signal]);
|
|
82
|
+
}
|
|
83
|
+
#request = (initializeDeferredDecorator(this, "request"), void 0);
|
|
84
|
+
static {
|
|
85
|
+
decorateFieldV2(this.prototype, "query", [signal]);
|
|
86
|
+
}
|
|
87
|
+
#query = (initializeDeferredDecorator(this, "query"), void 0);
|
|
88
|
+
static {
|
|
89
|
+
decorateFieldV2(this.prototype, "autorefresh", [signal]);
|
|
90
|
+
}
|
|
91
|
+
#autorefresh = (initializeDeferredDecorator(this, "autorefresh"), void 0);
|
|
92
|
+
static {
|
|
93
|
+
decorateFieldV2(this.prototype, "autorefreshThreshold", [signal]);
|
|
94
|
+
}
|
|
95
|
+
#autorefreshThreshold = (initializeDeferredDecorator(this, "autorefreshThreshold"), void 0);
|
|
96
|
+
static {
|
|
97
|
+
decorateFieldV2(this.prototype, "autorefreshBehavior", [signal]);
|
|
98
|
+
}
|
|
99
|
+
#autorefreshBehavior = (initializeDeferredDecorator(this, "autorefreshBehavior"), void 0);
|
|
100
|
+
}
|
|
101
|
+
const DefaultChrome = ({
|
|
102
|
+
children
|
|
103
|
+
}) => {
|
|
104
|
+
return /*#__PURE__*/jsx(Fragment, {
|
|
105
|
+
children: children
|
|
106
|
+
});
|
|
107
|
+
};
|
|
108
|
+
function Throw({
|
|
109
|
+
error
|
|
110
|
+
}) {
|
|
111
|
+
throw error;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
/**
|
|
115
|
+
* The `<Request />` component is a powerful tool for managing data fetching and
|
|
116
|
+
* state in your React application. It provides a declarative approach to reactive
|
|
117
|
+
* control-flow for managing requests and state in your application.
|
|
118
|
+
*
|
|
119
|
+
* The `<Request />` component is ideal for handling "boundaries", outside which some
|
|
120
|
+
* state is still allowed to be unresolved and within which it MUST be resolved.
|
|
121
|
+
*
|
|
122
|
+
* ## Request States
|
|
123
|
+
*
|
|
124
|
+
* `<Request />` has five states, only one of which will be active and rendered at a time.
|
|
125
|
+
*
|
|
126
|
+
* - `idle`: The component is waiting to be given a request to monitor
|
|
127
|
+
* - `loading`: The request is in progress
|
|
128
|
+
* - `error`: The request failed
|
|
129
|
+
* - `content`: The request succeeded
|
|
130
|
+
* - `cancelled`: The request was cancelled
|
|
131
|
+
*
|
|
132
|
+
* Additionally, the `content` state has a `refresh` method that can be used to
|
|
133
|
+
* refresh the request in the background, which is available as a sub-state of
|
|
134
|
+
* the `content` state.
|
|
135
|
+
*
|
|
136
|
+
* ### Example Usage
|
|
137
|
+
*
|
|
138
|
+
* ```tsx
|
|
139
|
+
* import { Request } from "@warp-drive-mirror/react";
|
|
140
|
+
*
|
|
141
|
+
* export function UserPreview($props: { id: string | null }) {
|
|
142
|
+
* return (
|
|
143
|
+
* <Request
|
|
144
|
+
* query={findRecord('user', $props.id)}
|
|
145
|
+
* states={{
|
|
146
|
+
* idle: () => <div>Waiting for User Selection</div>,
|
|
147
|
+
* loading: ({ state }) => <div>Loading user data...</div>,
|
|
148
|
+
* cancelled: ({ error, features }) => (
|
|
149
|
+
* <div>
|
|
150
|
+
* <p>Request Cancelled</p>
|
|
151
|
+
* <p><button onClick={features.retry}>Start Again?</button></p>
|
|
152
|
+
* </div>
|
|
153
|
+
* ),
|
|
154
|
+
* error: ({ error, features }) => (
|
|
155
|
+
* <div>
|
|
156
|
+
* <p>Error: {error.message}</p>
|
|
157
|
+
* <p><button onClick={features.retry}>Try Again?</button></p>
|
|
158
|
+
* </div>
|
|
159
|
+
* ),
|
|
160
|
+
* content: ({ result, features }) => (
|
|
161
|
+
* <div>
|
|
162
|
+
* <h2>User Details</h2>
|
|
163
|
+
* <p>ID: {result.id}</p>
|
|
164
|
+
* <p>Name: {result.name}</p>
|
|
165
|
+
* </div>
|
|
166
|
+
* ),
|
|
167
|
+
* }}
|
|
168
|
+
* />
|
|
169
|
+
* );
|
|
170
|
+
* }
|
|
171
|
+
*
|
|
172
|
+
* ```
|
|
173
|
+
*
|
|
174
|
+
* @category Components
|
|
175
|
+
*/
|
|
176
|
+
function Request($props) {
|
|
177
|
+
return /*#__PURE__*/jsx(ReactiveContext, {
|
|
178
|
+
children: /*#__PURE__*/jsx(InternalRequest, {
|
|
179
|
+
...$props
|
|
180
|
+
})
|
|
181
|
+
});
|
|
182
|
+
}
|
|
183
|
+
function isStrictModeRender() {
|
|
184
|
+
useRef(0);
|
|
185
|
+
|
|
186
|
+
// in debug we need to skip every second invocation
|
|
187
|
+
|
|
188
|
+
return false;
|
|
189
|
+
}
|
|
190
|
+
function InternalRequest($props) {
|
|
191
|
+
isStrictModeRender();
|
|
192
|
+
const store = $props.store ?? useStore();
|
|
193
|
+
const Chrome = $props.chrome ?? DefaultChrome;
|
|
194
|
+
const sink = useRef(null);
|
|
195
|
+
const args = useRef(null);
|
|
196
|
+
if (!args.current) {
|
|
197
|
+
args.current = new ReactiveArgs();
|
|
198
|
+
}
|
|
199
|
+
Object.assign(args.current, $props);
|
|
200
|
+
if (sink.current && (sink.current.store !== store || $props.subscription)) {
|
|
201
|
+
sink.current[DISPOSE]();
|
|
202
|
+
sink.current = null;
|
|
203
|
+
}
|
|
204
|
+
if (!sink.current && !$props.subscription) {
|
|
205
|
+
sink.current = createRequestSubscription(store, args.current);
|
|
206
|
+
}
|
|
207
|
+
const initialized = useRef(null);
|
|
208
|
+
const effect = () => {
|
|
209
|
+
if (sink.current && (!initialized.current || initialized.current.disposable !== sink.current)) {
|
|
210
|
+
initialized.current = {
|
|
211
|
+
disposable: sink.current,
|
|
212
|
+
dispose: () => {
|
|
213
|
+
sink.current?.[DISPOSE]();
|
|
214
|
+
initialized.current = null;
|
|
215
|
+
sink.current = null;
|
|
216
|
+
}
|
|
217
|
+
};
|
|
218
|
+
}
|
|
219
|
+
return sink.current ? initialized.current.dispose : undefined;
|
|
220
|
+
};
|
|
221
|
+
let maybeEffect = effect;
|
|
222
|
+
useEffect(maybeEffect, [sink.current]);
|
|
223
|
+
const state = $props.subscription ?? sink.current;
|
|
224
|
+
const slots = $props.states;
|
|
225
|
+
return /*#__PURE__*/jsx(Chrome, {
|
|
226
|
+
state: state.isIdle ? null : state.reqState,
|
|
227
|
+
features: state.contentFeatures,
|
|
228
|
+
children:
|
|
229
|
+
// prettier-ignore
|
|
230
|
+
state.isIdle && slots.idle ? /*#__PURE__*/jsx(slots.idle, {}) : state.isIdle ? /*#__PURE__*/jsx(Throw, {
|
|
231
|
+
error: IdleBlockMissingError
|
|
232
|
+
}) : state.reqState.isLoading ? slots.loading ? /*#__PURE__*/jsx(slots.loading, {
|
|
233
|
+
state: state.reqState.loadingState
|
|
234
|
+
}) : '' : state.reqState.isCancelled && slots.cancelled ? /*#__PURE__*/jsx(slots.cancelled, {
|
|
235
|
+
error: state.reqState.reason,
|
|
236
|
+
features: state.errorFeatures
|
|
237
|
+
}) : state.reqState.isError && slots.error ? /*#__PURE__*/jsx(slots.error, {
|
|
238
|
+
error: state.reqState.reason,
|
|
239
|
+
features: state.errorFeatures
|
|
240
|
+
}) : state.reqState.isSuccess ? slots.content ? /*#__PURE__*/jsx(slots.content, {
|
|
241
|
+
result: state.reqState.value,
|
|
242
|
+
features: state.contentFeatures
|
|
243
|
+
}) : /*#__PURE__*/jsx(Throw, {
|
|
244
|
+
error: new Error('No content block provided for <Request> component.')
|
|
245
|
+
}) : !state.reqState.isCancelled ? /*#__PURE__*/jsx(Throw, {
|
|
246
|
+
error: state.reqState.reason
|
|
247
|
+
}) : '' // never
|
|
248
|
+
});
|
|
249
|
+
}
|
|
250
|
+
export { ReactiveContext, Request, StoreProvider, Throw, useStore };
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import { use } from 'react';
|
|
2
|
+
import { Signal } from 'signal-polyfill';
|
|
3
|
+
import { setupSignals } from '@warp-drive-mirror/core/configure';
|
|
4
|
+
import { W as WatcherContext } from "./reactive-context-DKimDkR3.js";
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* {@include ./install.md}
|
|
8
|
+
* @module
|
|
9
|
+
*/
|
|
10
|
+
|
|
11
|
+
function tryConsumeContext(signal) {
|
|
12
|
+
// eslint-disable-next-line no-console
|
|
13
|
+
const logError = console.error;
|
|
14
|
+
try {
|
|
15
|
+
// eslint-disable-next-line no-console
|
|
16
|
+
console.error = () => {};
|
|
17
|
+
// ensure signals are watched by our closest watcher
|
|
18
|
+
const watcher = use(WatcherContext);
|
|
19
|
+
// eslint-disable-next-line no-console
|
|
20
|
+
console.error = logError;
|
|
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
|
+
}
|
|
28
|
+
}
|
|
29
|
+
async function settled() {}
|
|
30
|
+
function buildSignalConfig(options) {
|
|
31
|
+
return {
|
|
32
|
+
createSignal: (obj, key) => new Signal.State(null, {
|
|
33
|
+
equals: () => false
|
|
34
|
+
}),
|
|
35
|
+
notifySignal: signal => {
|
|
36
|
+
signal.set(signal.get());
|
|
37
|
+
},
|
|
38
|
+
consumeSignal: signal => {
|
|
39
|
+
tryConsumeContext(signal);
|
|
40
|
+
void signal.get();
|
|
41
|
+
},
|
|
42
|
+
createMemo: (object, key, fn) => {
|
|
43
|
+
const memo = new Signal.Computed(fn);
|
|
44
|
+
return () => {
|
|
45
|
+
tryConsumeContext(memo);
|
|
46
|
+
return memo.get();
|
|
47
|
+
};
|
|
48
|
+
},
|
|
49
|
+
waitFor: promise => {
|
|
50
|
+
return promise;
|
|
51
|
+
},
|
|
52
|
+
willSyncFlushWatchers: () => false
|
|
53
|
+
};
|
|
54
|
+
}
|
|
55
|
+
setupSignals(buildSignalConfig);
|
|
56
|
+
export { buildSignalConfig, settled };
|