UNPKG

17.6 kBJavaScriptView Raw
1System.register(['react', 'jotai'], (function (exports) {
2 'use strict';
3 var useContext, useState, useEffect, useDebugValue, useRef, useCallback, SECRET_INTERNAL_getScopeContext, useAtom;
4 return {
5 setters: [function (module) {
6 useContext = module.useContext;
7 useState = module.useState;
8 useEffect = module.useEffect;
9 useDebugValue = module.useDebugValue;
10 useRef = module.useRef;
11 useCallback = module.useCallback;
12 }, function (module) {
13 SECRET_INTERNAL_getScopeContext = module.SECRET_INTERNAL_getScopeContext;
14 useAtom = module.useAtom;
15 }],
16 execute: (function () {
17
18 exports({
19 useAtomDevtools: useAtomDevtools,
20 useAtomsDevtools: useAtomsDevtools,
21 useAtomsSnapshot: useAtomsSnapshot,
22 useGotoAtomsSnapshot: useGotoAtomsSnapshot
23 });
24
25 const RESTORE_ATOMS = "h";
26 const DEV_SUBSCRIBE_STATE = "n";
27 const DEV_GET_MOUNTED_ATOMS = "l";
28 const DEV_GET_ATOM_STATE = "a";
29 const DEV_GET_MOUNTED = "m";
30
31 const atomToPrintable$1 = (atom) => atom.debugLabel || atom.toString();
32 const stateToPrintable = ([store, atoms]) => Object.fromEntries(
33 atoms.flatMap((atom) => {
34 var _a, _b;
35 const mounted = (_a = store[DEV_GET_MOUNTED]) == null ? void 0 : _a.call(store, atom);
36 if (!mounted) {
37 return [];
38 }
39 const dependents = mounted.t;
40 const atomState = ((_b = store[DEV_GET_ATOM_STATE]) == null ? void 0 : _b.call(store, atom)) || {};
41 return [
42 [
43 atomToPrintable$1(atom),
44 {
45 ..."e" in atomState && { error: atomState.e },
46 ..."p" in atomState && { promise: atomState.p },
47 ..."v" in atomState && { value: atomState.v },
48 dependents: Array.from(dependents).map(atomToPrintable$1)
49 }
50 ]
51 ];
52 })
53 );
54 const useAtomsDebugValue = exports('useAtomsDebugValue', (options) => {
55 var _a;
56 const enabled = (_a = options == null ? void 0 : options.enabled) != null ? _a : true;
57 const ScopeContext = SECRET_INTERNAL_getScopeContext(options == null ? void 0 : options.scope);
58 const { s: store } = useContext(ScopeContext);
59 const [atoms, setAtoms] = useState([]);
60 useEffect(() => {
61 var _a2;
62 if (!enabled) {
63 return;
64 }
65 const callback = () => {
66 var _a3;
67 setAtoms(Array.from(((_a3 = store[DEV_GET_MOUNTED_ATOMS]) == null ? void 0 : _a3.call(store)) || []));
68 };
69 const unsubscribe = (_a2 = store[DEV_SUBSCRIBE_STATE]) == null ? void 0 : _a2.call(store, callback);
70 callback();
71 return unsubscribe;
72 }, [enabled, store]);
73 useDebugValue([store, atoms], stateToPrintable);
74 });
75
76 function useAtomDevtools(anAtom, options, deprecatedScope) {
77 if (typeof options === "string" || typeof deprecatedScope !== "undefined") {
78 console.warn("DEPRECATED [useAtomDevtools] use DevtoolOptions");
79 options = {
80 name: options,
81 scope: deprecatedScope
82 };
83 }
84 const { enabled, name, scope } = options || {};
85 let extension;
86 try {
87 extension = (enabled != null ? enabled : true) && window.__REDUX_DEVTOOLS_EXTENSION__;
88 } catch {
89 }
90 if (!extension) {
91 if (enabled) {
92 console.warn("Please install/enable Redux devtools extension");
93 }
94 }
95 const [value, setValue] = useAtom(anAtom, scope);
96 const lastValue = useRef(value);
97 const isTimeTraveling = useRef(false);
98 const devtools = useRef();
99 const atomName = name || anAtom.debugLabel || anAtom.toString();
100 useEffect(() => {
101 if (!extension) {
102 return;
103 }
104 const setValueIfWritable = (value2) => {
105 if (typeof setValue === "function") {
106 setValue(value2);
107 return;
108 }
109 console.warn(
110 "[Warn] you cannot do write operations (Time-travelling, etc) in read-only atoms\n",
111 anAtom
112 );
113 };
114 devtools.current = extension.connect({ name: atomName });
115 const unsubscribe = devtools.current.subscribe((message) => {
116 var _a, _b, _c, _d, _e, _f;
117 if (message.type === "ACTION" && message.payload) {
118 try {
119 setValueIfWritable(JSON.parse(message.payload));
120 } catch (e) {
121 console.error(
122 "please dispatch a serializable value that JSON.parse() support\n",
123 e
124 );
125 }
126 } else if (message.type === "DISPATCH" && message.state) {
127 if (((_a = message.payload) == null ? void 0 : _a.type) === "JUMP_TO_ACTION" || ((_b = message.payload) == null ? void 0 : _b.type) === "JUMP_TO_STATE") {
128 isTimeTraveling.current = true;
129 setValueIfWritable(JSON.parse(message.state));
130 }
131 } else if (message.type === "DISPATCH" && ((_c = message.payload) == null ? void 0 : _c.type) === "COMMIT") {
132 (_d = devtools.current) == null ? void 0 : _d.init(lastValue.current);
133 } else if (message.type === "DISPATCH" && ((_e = message.payload) == null ? void 0 : _e.type) === "IMPORT_STATE") {
134 const computedStates = ((_f = message.payload.nextLiftedState) == null ? void 0 : _f.computedStates) || [];
135 computedStates.forEach(({ state }, index) => {
136 var _a2;
137 if (index === 0) {
138 (_a2 = devtools.current) == null ? void 0 : _a2.init(state);
139 } else {
140 setValueIfWritable(state);
141 }
142 });
143 }
144 });
145 devtools.current.shouldInit = true;
146 return unsubscribe;
147 }, [anAtom, extension, atomName, setValue]);
148 useEffect(() => {
149 if (!devtools.current) {
150 return;
151 }
152 lastValue.current = value;
153 if (devtools.current.shouldInit) {
154 devtools.current.init(value);
155 devtools.current.shouldInit = false;
156 } else if (isTimeTraveling.current) {
157 isTimeTraveling.current = false;
158 } else {
159 devtools.current.send(
160 `${atomName} - ${new Date().toLocaleString()}`,
161 value
162 );
163 }
164 }, [anAtom, extension, atomName, value]);
165 }
166
167 const isEqualAtomsValues$1 = (left, right) => left.size === right.size && Array.from(left).every(([left2, v]) => Object.is(right.get(left2), v));
168 const isEqualAtomsDependents$1 = (left, right) => left.size === right.size && Array.from(left).every(([a, dLeft]) => {
169 const dRight = right.get(a);
170 return dRight && dLeft.size === dRight.size && Array.from(dLeft).every((d) => dRight.has(d));
171 });
172 function useAtomsSnapshot(scope) {
173 const ScopeContext = SECRET_INTERNAL_getScopeContext(scope);
174 const scopeContainer = useContext(ScopeContext);
175 const store = scopeContainer.s;
176 if (!store[DEV_SUBSCRIBE_STATE]) {
177 throw new Error("useAtomsSnapshot can only be used in dev mode.");
178 }
179 const [atomsSnapshot, setAtomsSnapshot] = useState(() => ({
180 values: /* @__PURE__ */ new Map(),
181 dependents: /* @__PURE__ */ new Map()
182 }));
183 useEffect(() => {
184 var _a;
185 let prevValues = /* @__PURE__ */ new Map();
186 let prevDependents = /* @__PURE__ */ new Map();
187 const invalidatedAtoms = /* @__PURE__ */ new Set();
188 const callback = () => {
189 var _a2, _b, _c;
190 const values = /* @__PURE__ */ new Map();
191 const dependents = /* @__PURE__ */ new Map();
192 let hasNewInvalidatedAtoms = false;
193 for (const atom of ((_a2 = store[DEV_GET_MOUNTED_ATOMS]) == null ? void 0 : _a2.call(store)) || []) {
194 const atomState = (_b = store[DEV_GET_ATOM_STATE]) == null ? void 0 : _b.call(store, atom);
195 if (atomState) {
196 if (!atomState.y) {
197 if ("p" in atomState) {
198 return;
199 }
200 if (!invalidatedAtoms.has(atom)) {
201 invalidatedAtoms.add(atom);
202 hasNewInvalidatedAtoms = true;
203 }
204 }
205 if ("v" in atomState) {
206 values.set(atom, atomState.v);
207 }
208 }
209 const mounted = (_c = store[DEV_GET_MOUNTED]) == null ? void 0 : _c.call(store, atom);
210 if (mounted) {
211 dependents.set(atom, mounted.t);
212 }
213 }
214 if (hasNewInvalidatedAtoms) {
215 return;
216 }
217 if (isEqualAtomsValues$1(prevValues, values) && isEqualAtomsDependents$1(prevDependents, dependents)) {
218 return;
219 }
220 prevValues = values;
221 prevDependents = dependents;
222 invalidatedAtoms.clear();
223 setAtomsSnapshot({ values, dependents });
224 };
225 const unsubscribe = (_a = store[DEV_SUBSCRIBE_STATE]) == null ? void 0 : _a.call(store, callback);
226 callback();
227 return unsubscribe;
228 }, [store]);
229 return atomsSnapshot;
230 }
231
232 function useGotoAtomsSnapshot(scope) {
233 const ScopeContext = SECRET_INTERNAL_getScopeContext(scope);
234 const { s: store, w: versionedWrite } = useContext(ScopeContext);
235 if (!store[DEV_SUBSCRIBE_STATE]) {
236 throw new Error("useGotoAtomsSnapshot can only be used in dev mode.");
237 }
238 return useCallback(
239 (snapshot) => {
240 const restoreAtoms = (values) => {
241 if (versionedWrite) {
242 versionedWrite((version) => {
243 store[RESTORE_ATOMS](values, version);
244 });
245 } else {
246 store[RESTORE_ATOMS](values);
247 }
248 };
249 if (isIterable(snapshot)) {
250 {
251 console.warn(
252 "snapshot as iterable is deprecated. use an object instead."
253 );
254 }
255 restoreAtoms(snapshot);
256 return;
257 }
258 restoreAtoms(snapshot.values);
259 },
260 [store, versionedWrite]
261 );
262 }
263 const isIterable = (item) => {
264 return typeof item[Symbol.iterator] === "function";
265 };
266
267 const isEqualAtomsValues = (left, right) => left.size === right.size && Array.from(left).every(([left2, v]) => Object.is(right.get(left2), v));
268 const isEqualAtomsDependents = (left, right) => left.size === right.size && Array.from(left).every(([a, dLeft]) => {
269 const dRight = right.get(a);
270 return dRight && dLeft.size === dRight.size && Array.from(dLeft).every((d) => dRight.has(d));
271 });
272 const atomToPrintable = (atom) => atom.debugLabel ? `${atom}:${atom.debugLabel}` : `${atom}`;
273 const getDevtoolsState = (atomsSnapshot) => {
274 const values = {};
275 atomsSnapshot.values.forEach((v, atom) => {
276 values[atomToPrintable(atom)] = v;
277 });
278 const dependents = {};
279 atomsSnapshot.dependents.forEach((d, atom) => {
280 dependents[atomToPrintable(atom)] = Array.from(d).map(atomToPrintable);
281 });
282 return {
283 values,
284 dependents
285 };
286 };
287 function useAtomsDevtools(name, options) {
288 if (typeof options !== "undefined" && typeof options !== "object") {
289 console.warn("DEPRECATED [useAtomsDevtools] use DevtoolsOptions");
290 options = { scope: options };
291 }
292 const { enabled, scope } = options || {};
293 const ScopeContext = SECRET_INTERNAL_getScopeContext(scope);
294 const { s: store, w: versionedWrite } = useContext(ScopeContext);
295 let extension;
296 try {
297 extension = (enabled != null ? enabled : true) && window.__REDUX_DEVTOOLS_EXTENSION__;
298 } catch {
299 }
300 if (!extension) {
301 if (enabled) {
302 console.warn("Please install/enable Redux devtools extension");
303 }
304 }
305 if (extension && !store[DEV_SUBSCRIBE_STATE]) {
306 throw new Error("useAtomsDevtools can only be used in dev mode.");
307 }
308 const [atomsSnapshot, setAtomsSnapshot] = useState(() => ({
309 values: /* @__PURE__ */ new Map(),
310 dependents: /* @__PURE__ */ new Map()
311 }));
312 useEffect(() => {
313 var _a;
314 if (!extension) {
315 return;
316 }
317 let prevValues = /* @__PURE__ */ new Map();
318 let prevDependents = /* @__PURE__ */ new Map();
319 const invalidatedAtoms = /* @__PURE__ */ new Set();
320 const callback = () => {
321 var _a2, _b, _c;
322 const values = /* @__PURE__ */ new Map();
323 const dependents = /* @__PURE__ */ new Map();
324 let hasNewInvalidatedAtoms = false;
325 for (const atom of ((_a2 = store[DEV_GET_MOUNTED_ATOMS]) == null ? void 0 : _a2.call(store)) || []) {
326 const atomState = (_b = store[DEV_GET_ATOM_STATE]) == null ? void 0 : _b.call(store, atom);
327 if (atomState) {
328 if (!atomState.y) {
329 if ("p" in atomState) {
330 return;
331 }
332 if (!invalidatedAtoms.has(atom)) {
333 invalidatedAtoms.add(atom);
334 hasNewInvalidatedAtoms = true;
335 }
336 }
337 if ("v" in atomState) {
338 values.set(atom, atomState.v);
339 }
340 }
341 const mounted = (_c = store[DEV_GET_MOUNTED]) == null ? void 0 : _c.call(store, atom);
342 if (mounted) {
343 dependents.set(atom, mounted.t);
344 }
345 }
346 if (hasNewInvalidatedAtoms) {
347 return;
348 }
349 if (isEqualAtomsValues(prevValues, values) && isEqualAtomsDependents(prevDependents, dependents)) {
350 return;
351 }
352 prevValues = values;
353 prevDependents = dependents;
354 invalidatedAtoms.clear();
355 setAtomsSnapshot({ values, dependents });
356 };
357 const unsubscribe = (_a = store[DEV_SUBSCRIBE_STATE]) == null ? void 0 : _a.call(store, callback);
358 callback();
359 return unsubscribe;
360 }, [extension, store]);
361 const goToSnapshot = useCallback(
362 (snapshot) => {
363 const { values } = snapshot;
364 if (versionedWrite) {
365 versionedWrite((version) => {
366 store[RESTORE_ATOMS](values, version);
367 });
368 } else {
369 store[RESTORE_ATOMS](values);
370 }
371 },
372 [store, versionedWrite]
373 );
374 const isTimeTraveling = useRef(false);
375 const isRecording = useRef(true);
376 const devtools = useRef();
377 const snapshots = useRef([]);
378 useEffect(() => {
379 if (!extension) {
380 return;
381 }
382 const getSnapshotAt = (index = snapshots.current.length - 1) => {
383 const snapshot = snapshots.current[index >= 0 ? index : 0];
384 if (!snapshot) {
385 throw new Error("snaphost index out of bounds");
386 }
387 return snapshot;
388 };
389 const connection = extension.connect({ name });
390 const devtoolsUnsubscribe = connection.subscribe((message) => {
391 var _a;
392 switch (message.type) {
393 case "DISPATCH":
394 switch ((_a = message.payload) == null ? void 0 : _a.type) {
395 case "RESET":
396 break;
397 case "COMMIT":
398 connection.init(getDevtoolsState(getSnapshotAt()));
399 snapshots.current = [];
400 break;
401 case "JUMP_TO_ACTION":
402 case "JUMP_TO_STATE":
403 isTimeTraveling.current = true;
404 goToSnapshot(getSnapshotAt(message.payload.actionId - 1));
405 break;
406 case "PAUSE_RECORDING":
407 isRecording.current = !isRecording.current;
408 break;
409 }
410 }
411 });
412 devtools.current = connection;
413 devtools.current.shouldInit = true;
414 return devtoolsUnsubscribe;
415 }, [extension, goToSnapshot, name]);
416 useEffect(() => {
417 if (!devtools.current) {
418 return;
419 }
420 if (devtools.current.shouldInit) {
421 devtools.current.init(void 0);
422 devtools.current.shouldInit = false;
423 return;
424 }
425 if (isTimeTraveling.current) {
426 isTimeTraveling.current = false;
427 } else if (isRecording.current) {
428 snapshots.current.push(atomsSnapshot);
429 devtools.current.send(
430 {
431 type: `${snapshots.current.length}`,
432 updatedAt: new Date().toLocaleString()
433 },
434 getDevtoolsState(atomsSnapshot)
435 );
436 }
437 }, [atomsSnapshot]);
438 }
439
440 })
441 };
442}));