sia-reactor 0.0.19 → 0.0.21

package/dist/adapters/react.cjs

@@ -17,27 +17,32 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// src/adapters/react.ts
+// src/ts/adapters/react.ts
 var react_exports = {};
 __export(react_exports, {
+  TimeTravelOverlay: () => TimeTravelOverlay2,
   useAnyReactor: () => useAnyReactor,
   useAnySelector: () => useAnySelector,
   useISOLayoutEffect: () => useISOLayoutEffect,
   usePath: () => usePath,
   useReactor: () => useReactor,
-  useSelector: () => useSelector
+  useReactorSnapshot: () => useReactorSnapshot,
+  useSelector: () => useSelector,
+  useSelectorSnapshot: () => useSelectorSnapshot
 });
 module.exports = __toCommonJS(react_exports);
 
-// src/adapters/react/utils.ts
+// src/ts/adapters/react/hooks/useReactor.ts
+var import_react2 = require("react");
+
+// src/ts/adapters/react/utils.ts
 var import_react = require("react");
 var useISOLayoutEffect = "undefined" !== typeof window ? import_react.useLayoutEffect : import_react.useEffect;
 
-// src/adapters/react/hooks/useReactor.ts
-var import_react2 = require("react");
-
-// src/core/consts.ts
+// src/ts/core/consts.ts
 var CTX = {
+  /** Flag indicating whether the application is running in development mode. */
+  isDevEnv: "undefined" !== typeof process ? process.env.NODE_ENV !== "production" : true,
   /** active `Autotracker` instance, override for automatic dependency collection on `Reactor` traps. */
   autotracker: null
 };
@@ -56,7 +61,7 @@ var NIL = Object.freeze({});
 var NOOP = () => {
 };
 
-// src/utils/obj.ts
+// src/ts/utils/obj.ts
 var arrRx = /^([^\[\]]+)\[(\d+)\]$/;
 function isObj(obj, arraycheck = true) {
   return "object" === typeof obj && obj !== null && (arraycheck ? !Array.isArray(obj) : true);
@@ -73,10 +78,10 @@ function canHandle(obj, config = NIL, typecheck = true) {
 function getAny(source, key, separator = ".", keyFunc) {
   if (key === "*") return source;
   if (!key.includes(separator)) return source[keyFunc ? keyFunc(key) : key];
-  const keys = key.split(separator);
+  const keys2 = key.split(separator);
   let currObj = source;
-  for (let i = 0, len = keys.length; i < len; i++) {
-    const key2 = keyFunc ? keyFunc(keys[i]) : keys[i], match = key2.includes("[") && key2.match(arrRx);
+  for (let i = 0, len = keys2.length; i < len; i++) {
+    const key2 = keyFunc ? keyFunc(keys2[i]) : keys2[i], match = key2.includes("[") && key2.match(arrRx);
     if (match) {
       const [, key3, iStr] = match;
       if (!Array.isArray(currObj[key3]) || !(key3 in currObj)) return void 0;
@@ -91,9 +96,9 @@ function getAny(source, key, separator = ".", keyFunc) {
 function setAny(target, key, value, separator = ".", keyFunc) {
   if (key === "*") return Object.assign(target, value);
   if (!key.includes(separator)) return void (target[keyFunc ? keyFunc(key) : key] = value);
-  const keys = key.split(separator);
-  for (let currObj = target, i = 0, len = keys.length; i < len; i++) {
-    const key2 = keyFunc ? keyFunc(keys[i]) : keys[i], match = key2.includes("[") && key2.match(arrRx);
+  const keys2 = key.split(separator);
+  for (let currObj = target, i = 0, len = keys2.length; i < len; i++) {
+    const key2 = keyFunc ? keyFunc(keys2[i]) : keys2[i], match = key2.includes("[") && key2.match(arrRx);
     if (match) {
       const [, key3, iStr] = match;
       if (!Array.isArray(currObj[key3])) currObj[key3] = [];
@@ -107,14 +112,14 @@ function setAny(target, key, value, separator = ".", keyFunc) {
 }
 function deleteAny(target, key, separator = ".", keyFunc) {
   if (key === "*") {
-    const keys2 = Object.keys(target);
-    for (let i = 0, len = keys2.length; i < len; i++) delete target[keys2[i]];
+    const keys3 = Object.keys(target);
+    for (let i = 0, len = keys3.length; i < len; i++) delete target[keys3[i]];
     return;
   }
   if (!key.includes(separator)) return void delete target[keyFunc ? keyFunc(key) : key];
-  const keys = key.split(separator);
-  for (let currObj = target, i = 0, len = keys.length; i < len; i++) {
-    const key2 = keyFunc ? keyFunc(keys[i]) : keys[i], match = key2.includes("[") && key2.match(arrRx);
+  const keys2 = key.split(separator);
+  for (let currObj = target, i = 0, len = keys2.length; i < len; i++) {
+    const key2 = keyFunc ? keyFunc(keys2[i]) : keys2[i], match = key2.includes("[") && key2.match(arrRx);
     if (match) {
       const [, key3, iStr] = match;
       if (!Array.isArray(currObj[key3]) || !(key3 in currObj)) return;
@@ -130,9 +135,9 @@ function deleteAny(target, key, separator = ".", keyFunc) {
 function inAny(source, key, separator = ".", keyFunc) {
   if (key === "*") return true;
   if (!key.includes(separator)) return key in source;
-  const keys = key.split(separator);
-  for (let currObj = source, i = 0, len = keys.length; i < len; i++) {
-    const key2 = keyFunc ? keyFunc(keys[i]) : keys[i], match = key2.includes("[") && key2.match(arrRx);
+  const keys2 = key.split(separator);
+  for (let currObj = source, i = 0, len = keys2.length; i < len; i++) {
+    const key2 = keyFunc ? keyFunc(keys2[i]) : keys2[i], match = key2.includes("[") && key2.match(arrRx);
     if (match) {
       const [, key3, iStr] = match;
       if (!Array.isArray(currObj[key3]) || !(key3 in currObj)) return false;
@@ -161,18 +166,18 @@ function getTrailRecords(obj, path, reverse = false) {
 function nuke(target) {
   let proto = target;
   while (proto && proto !== Object.prototype) {
-    const keys = Object.getOwnPropertyNames(proto);
-    for (let i = 0, len = keys.length; i < len; i++) {
-      if (keys[i] === "constructor") continue;
-      const desc = Object.getOwnPropertyDescriptor(proto, keys[i]);
+    const keys2 = Object.getOwnPropertyNames(proto);
+    for (let i = 0, len = keys2.length; i < len; i++) {
+      if (keys2[i] === "constructor") continue;
+      const desc = Object.getOwnPropertyDescriptor(proto, keys2[i]);
       if (desc && ("function" === typeof desc.value || desc.get || desc.set)) continue;
-      proto[keys[i]] = null;
+      proto[keys2[i]] = null;
     }
     proto = Object.getPrototypeOf(proto);
   }
 }
 
-// src/core/event.ts
+// src/ts/core/event.ts
 var ReactorEvent = class _ReactorEvent {
   /** No active propagation phase. */
   static NONE = 0;
@@ -295,7 +300,7 @@ var ReactorEvent = class _ReactorEvent {
   }
 };
 
-// src/core/reactor.ts
+// src/ts/core/reactor.ts
 var Reactor = class {
   log = NOOP;
   core;
@@ -323,27 +328,27 @@ var Reactor = class {
   listeners;
   /**
    * Creates a new Reactor instance.
-   * @param object Initial state object.
+   * @param target Initial state target.
    * @param build Reactor bootstrap/build configuration.
    * @example
    * const rtr = new Reactor({ count: 0 });
    */
-  constructor(object = {}, build) {
+  constructor(target = {}, build) {
     this[INERTIA] = true;
     this.config = { crossRealms: false, smartCloning: false, eventBubbling: true, lineageTracing: false, preserveContext: false, equalityFunction: Object.is, batchingFunction: RTR_BATCH, ...build };
-    this.core = this.proxied(object);
+    this.core = this.proxied(target);
     if (build) this.canLog = !!build.debug;
   }
-  proxied(obj, rejectable = false, indiffable = false, parent, key, path) {
-    if (!obj || "object" !== typeof obj) return obj;
-    obj = obj[RAW] || obj;
-    if (this.config.referenceTracking && parent && key && !this.link(obj, parent, key, false)) return obj;
-    const cached = this.proxyCache.get(obj);
+  proxied(target, rejectable = false, indiffable = false, parent, key, path) {
+    if (!target || "object" !== typeof target) return target;
+    target = target[RAW] || target;
+    if (this.config.referenceTracking && parent && key && !this.link(target, parent, key, false)) return target;
+    const cached = this.proxyCache.get(target);
     if (cached) return cached;
-    if (obj[INERTIA] || !canHandle(obj, this.config, false)) return obj;
-    rejectable ||= obj[REJECTABLE];
-    indiffable ||= obj[INDIFFABLE];
-    const proxy = new Proxy(obj, {
+    if (target[INERTIA] || !canHandle(target, this.config, false)) return target;
+    rejectable ||= target[REJECTABLE];
+    indiffable ||= target[INDIFFABLE];
+    const proxy = new Proxy(target, {
       // Robust Proxy handler
       get: (object, key2, receiver) => {
         if (key2 === RAW) return this.log(`\u{1F440} [Reactor \`get\` Trap] Peeked at ${object}`), object;
@@ -356,10 +361,10 @@ var Reactor = class {
           for (let i = 0, len = this.config.lineageTracing ? paths.length : 1; i < len; i++) {
             const currPath = this.config.lineageTracing ? paths[i] : fullPath, cords = this.getters.get(currPath);
             if (!cords && !wildcords) continue;
-            const target = { path: currPath, value, key: keyStr, keyExisted: true, object: receiver }, payload = { type: "get", target, currentTarget: target, root: this.core, rejectable };
+            const target2 = { path: currPath, value, key: keyStr, hadKey: true, object: receiver }, payload = { type: "get", target: target2, currentTarget: target2, root: this.core, rejectable };
             if (cords) value = this.mediate(currPath, payload, "get", cords);
             if (!wildcords) continue;
-            target.value = value;
+            target2.value = value;
             value = this.mediate("*", payload, "get", wildcords);
           }
         }
@@ -367,7 +372,7 @@ var Reactor = class {
       },
       set: (object, key2, value, receiver) => {
         let unchanged, safeValue, safeOldValue, terminated = false;
-        const keyStr = String(key2), fullPath = path ? path + "." + keyStr : keyStr, paths = this.config.lineageTracing ? this.trace(object, keyStr) : fullPath, loopLen = this.config.lineageTracing ? paths.length : 1, oldValue = !this.config.preserveContext ? object[key2] : Reflect.get(object, key2, receiver), keyExisted = !this.config.preserveContext ? key2 in object : Reflect.has(object, key2);
+        const keyStr = String(key2), fullPath = path ? path + "." + keyStr : keyStr, paths = this.config.lineageTracing ? this.trace(object, keyStr) : fullPath, loopLen = this.config.lineageTracing ? paths.length : 1, oldValue = !this.config.preserveContext ? object[key2] : Reflect.get(object, key2, receiver), hadKey = !this.config.preserveContext ? key2 in object : Reflect.has(object, key2);
         this.log(`\u270F\uFE0F [Reactor \`set\` Trap] Initiated for "${keyStr}" on "${paths}"`), CTX.autotracker?.track(fullPath, this, true);
         if (this.config.referenceTracking || !indiffable) {
           safeOldValue = oldValue?.[RAW] || oldValue;
@@ -381,13 +386,13 @@ var Reactor = class {
           for (let i = 0; i < loopLen; i++) {
             const currPath = this.config.lineageTracing ? paths[i] : fullPath, cords = this.setters.get(currPath);
             if (!cords && !wildcords) continue;
-            const target = { path: currPath, value, oldValue, key: keyStr, keyExisted, object: receiver }, payload = { type: "set", target, currentTarget: target, root: this.core, terminated, rejectable };
+            const target2 = { path: currPath, value, oldValue, key: keyStr, hadKey, object: receiver }, payload = { type: "set", target: target2, currentTarget: target2, root: this.core, terminated, rejectable };
             if (cords) {
               const result2 = this.mediate(currPath, payload, "set", cords);
               if (!(terminated ||= payload.terminated)) value = result2;
             }
             if (!wildcords) continue;
-            target.value = value;
+            target2.value = value;
             const result = this.mediate("*", payload, "set", wildcords);
             if (!(terminated ||= payload.terminated)) value = result;
           }
@@ -398,14 +403,14 @@ var Reactor = class {
         if (this.config.referenceTracking && !unchanged) this.config.smartCloning && this.stamp(object), this.unlink(safeOldValue, object, keyStr), this.link(safeValue, object, keyStr);
         if (this.watchers || this.listeners)
           for (let i = 0; i < loopLen; i++) {
-            const currPath = this.config.lineageTracing ? paths[i] : fullPath, target = { path: currPath, value, oldValue, key: keyStr, keyExisted, object: receiver };
-            this.notify(currPath, { type: "set", target, currentTarget: target, root: this.core, terminated, rejectable });
+            const currPath = this.config.lineageTracing ? paths[i] : fullPath, target2 = { path: currPath, value, oldValue, key: keyStr, hadKey, object: receiver };
+            this.notify(currPath, { type: "set", target: target2, currentTarget: target2, root: this.core, terminated, rejectable });
           }
         return true;
       },
       deleteProperty: (object, key2) => {
         let value, receiver = this.proxyCache.get(object), terminated = false;
-        const keyStr = String(key2), fullPath = path ? path + "." + keyStr : keyStr, paths = this.config.lineageTracing ? this.trace(object, keyStr) : fullPath, loopLen = this.config.lineageTracing ? paths.length : 1, oldValue = !this.config.preserveContext ? object[key2] : Reflect.get(object, key2, receiver), keyExisted = !this.config.preserveContext ? key2 in object : Reflect.has(object, key2);
+        const keyStr = String(key2), fullPath = path ? path + "." + keyStr : keyStr, paths = this.config.lineageTracing ? this.trace(object, keyStr) : fullPath, loopLen = this.config.lineageTracing ? paths.length : 1, oldValue = !this.config.preserveContext ? object[key2] : Reflect.get(object, key2, receiver), hadKey = !this.config.preserveContext ? key2 in object : Reflect.has(object, key2);
         this.log(`\u{1F5D1}\uFE0F [Reactor \`deleteProperty\` Trap] Initiated for "${keyStr}" on "${paths}"`), CTX.autotracker?.track(fullPath, this, true);
         if (this.config.deleteProperty) terminated = (value = this.config.deleteProperty(object, key2, oldValue, receiver, paths)) === TERMINATOR;
         if (this.deleters) {
@@ -413,7 +418,7 @@ var Reactor = class {
           for (let i = 0; i < loopLen; i++) {
             const currPath = this.config.lineageTracing ? paths[i] : fullPath, cords = this.deleters.get(currPath);
             if (!cords && !wildcords) continue;
-            const target = { path: currPath, value, oldValue, key: keyStr, keyExisted, object: receiver }, payload = { type: "delete", target, currentTarget: target, root: this.core, rejectable };
+            const target2 = { path: currPath, value, oldValue, key: keyStr, hadKey, object: receiver }, payload = { type: "delete", target: target2, currentTarget: target2, root: this.core, rejectable };
             if (cords) {
               const result2 = this.mediate(currPath, payload, "delete", cords);
               if (!(terminated ||= payload.terminated)) value = result2;
@@ -429,8 +434,8 @@ var Reactor = class {
         if (this.config.referenceTracking) this.config.smartCloning && this.stamp(object), this.unlink(oldValue?.[RAW] || oldValue, object, keyStr);
         if (this.watchers || this.listeners)
           for (let i = 0; i < loopLen; i++) {
-            const currPath = this.config.lineageTracing ? paths[i] : fullPath, target = { path: currPath, value, oldValue, key: keyStr, keyExisted, object: receiver };
-            this.notify(currPath, { type: "delete", target, currentTarget: target, root: this.core, rejectable });
+            const currPath = this.config.lineageTracing ? paths[i] : fullPath, target2 = { path: currPath, value, oldValue, key: keyStr, hadKey, object: receiver };
+            this.notify(currPath, { type: "delete", target: target2, currentTarget: target2, root: this.core, rejectable });
           }
         return true;
       },
@@ -456,7 +461,7 @@ var Reactor = class {
         return ownKeys;
       }
     });
-    return this.proxyCache.set(obj, proxy), proxy;
+    return this.proxyCache.set(target, proxy), proxy;
   }
   trace(target, path, paths = [], seen = /* @__PURE__ */ new WeakSet()) {
     if (Object.is(target, this.core[RAW] || this.core)) return paths.push(path), paths;
@@ -548,7 +553,7 @@ var Reactor = class {
   fire([path, object, value], e, isCapture, cords = this.listeners.get(path)) {
     if (!cords) return;
     e.type = path !== e.target.path ? "update" : e.staticType;
-    e.currentTarget = { path, value, oldValue: e.type !== "update" ? e.target.oldValue : void 0, key: e.type !== "update" ? path : path.slice(path.lastIndexOf(".") + 1) || "", keyExisted: e.type !== "update" ? e.target.keyExisted : true, object };
+    e.currentTarget = { path, value, oldValue: e.type !== "update" ? e.target.oldValue : void 0, key: e.type !== "update" ? path : path.slice(path.lastIndexOf(".") + 1) || "", hadKey: e.type !== "update" ? e.target.hadKey : true, object };
     for (let i = 0, len = cords.length, tDepth; i < len; i++) {
       if (e.immediatePropagationStopped) break;
       if (cords[i].capture !== isCapture) continue;
@@ -603,24 +608,23 @@ var Reactor = class {
   }
   getContext(path) {
     const lastDot = path.lastIndexOf("."), value = getAny(this.core, path), object = lastDot === -1 ? this.core : getAny(this.core, path.slice(0, lastDot));
-    return { path, value, key: path.slice(lastDot + 1) || "", keyExisted: true, object };
+    return { path, value, key: path.slice(lastDot + 1) || "", hadKey: true, object };
   }
   bindSignal(cord, sig) {
     if (sig) sig.aborted ? cord.clup() : sig.addEventListener("abort", cord.clup, { once: true });
     return cord.sclup = !sig || sig.aborted ? NOOP : () => sig.removeEventListener("abort", cord.clup), cord.clup;
   }
-  cloned(obj, raw, seen = /* @__PURE__ */ new WeakMap()) {
-    if (!obj || "object" !== typeof obj) return obj;
-    obj = obj[RAW] || obj;
-    const cloned = seen.get(obj);
+  cloned(target, raw, seen = /* @__PURE__ */ new WeakMap()) {
+    if (!target || "object" !== typeof target) return target;
+    const obj = target[RAW] || target, cloned = seen.get(obj);
     if (cloned) return cloned;
     if (!canHandle(obj, this.config, false)) return obj;
     const version = obj[VERSION] || 0, cached = !raw && this.config.smartCloning && (this.snapCache ??= /* @__PURE__ */ new WeakMap()).get(obj);
     if (cached && obj[SSVERSION] === version) return cached;
-    const clone = !raw ? this.config.preserveContext ? Object.create(Object.getPrototypeOf(obj)) : Array.isArray(obj) ? [] : {} : obj[RAW] || obj;
+    const clone = !raw ? this.config.preserveContext ? Object.create(Object.getPrototypeOf(obj)) : Array.isArray(obj) ? [] : {} : obj;
     seen.set(obj, clone);
-    const keys = this.config.preserveContext ? Reflect.ownKeys(obj) : Object.keys(obj);
-    for (let i = 0, len = keys.length; i < len; i++) clone[keys[i]] = this.cloned(obj[keys[i]], raw, seen);
+    const keys2 = this.config.preserveContext ? Reflect.ownKeys(obj) : Object.keys(obj);
+    for (let i = 0, len = keys2.length; i < len; i++) clone[keys2[i]] = this.cloned(obj[keys2[i]], raw, seen);
     if (!raw && this.config.smartCloning) this.snapCache.set(obj, clone), obj[SSVERSION] = version;
     return clone;
   }
@@ -801,19 +805,8 @@ var Reactor = class {
     for (let i = 0, len = cords.length; i < len; i++) if (Object.is(cords[i].cb, callback) && cords[i].capture === capture) return cords[i].sclup(), cords.splice((len--, i--), 1), !cords.length && this.listeners.delete(path), true;
     return false;
   }
-  /**
-   * Creates a snapshot; possibly clone of state (or a state branch).
-   * You could alternatively use or serialize your proxied state "as is" except the environment demands no proxies or new references.
-   * @param raw Use raw (deep unproxied & uncloned) version of branch.
-   * @param branch Branch to clone.
-   * @returns Snapshot deep or smart (structurally shared) clone.
-   * @example
-   * const snap = rtr.snapshot();
-   * @example
-   * const snap = rtr.snapshot(false, rtr.core.history.past);
-   */
-  snapshot(raw = !this.config.smartCloning, branch = this.core) {
-    return this.cloned(branch, raw);
+  snapshot(raw = !this.config.smartCloning, branch) {
+    return this.cloned(arguments.length < 2 ? this.core : branch, raw);
   }
   /**
    * Cascades object updates into direct child paths.
@@ -826,9 +819,9 @@ var Reactor = class {
    */
   cascade({ type, currentTarget: { path, value: news, oldValue: olds } }, objectSafe = true) {
     if (type !== "set" && type !== "delete" || !canHandle(news, this.config) || (objectSafe ? !canHandle(olds, this.config) : false)) return;
-    const obj = objectSafe ? mergeObjs(olds, news) : news, keys = Object.keys(obj);
+    const obj = objectSafe ? mergeObjs(olds, news) : news, keys2 = Object.keys(obj);
     this.isCascading = true;
-    for (let i = 0, len = keys.length; i < len; i++) setAny(this.core, path === "*" ? keys[i] : path + "." + keys[i], obj[keys[i]]);
+    for (let i = 0, len = keys2.length; i < len; i++) setAny(this.core, path === "*" ? keys2[i] : path + "." + keys2[i], obj[keys2[i]]);
     this.isCascading = false;
   }
   /**
@@ -864,7 +857,25 @@ var Reactor = class {
   }
 };
 
-// src/adapters/autotracker.ts
+// src/ts/core/mixins.ts
+var methods = ["tick", "stall", "nostall", "get", "gonce", "noget", "set", "sonce", "noset", "delete", "donce", "nodelete", "watch", "wonce", "nowatch", "on", "once", "off", "snapshot", "cascade", "plugIn", "reset", "destroy"];
+function reactive(target, build, preferences = NIL) {
+  if ("__Reactor__" in target) return target;
+  const descriptors = {}, rtr = getReactor(target, true, build), locks = { enumerable: false, configurable: true, writable: false }, hasAffix = !!(preferences.prefix || preferences.suffix);
+  for (let i = 0, len = methods.length; i < len; i++) {
+    let key = methods[i];
+    if (hasAffix) (preferences.whitelist?.includes(key) ?? true) && (key = `${preferences.prefix || ""}${key}${preferences.suffix || ""}`);
+    else if (preferences.whitelist?.includes(key)) continue;
+    descriptors[key] = { value: rtr[key].bind(rtr), ...locks };
+  }
+  descriptors["__Reactor__"] = { value: rtr, ...locks };
+  return Object.defineProperties(rtr.core, descriptors), rtr.core;
+}
+function getReactor(target, create = false, build) {
+  return (target instanceof Reactor ? target : target.__Reactor__) || (create ? new Reactor(target, build) : void 0);
+}
+
+// src/ts/adapters/autotracker.ts
 var Autotracker = class {
   proxy;
   deps = /* @__PURE__ */ new Map();
@@ -1006,24 +1017,40 @@ function withTracker(tracker, run, rtr) {
   }
 }
 
-// src/adapters/react/hooks/useReactor.ts
-function useReactor(target, options = NIL) {
-  const [, reRender] = (0, import_react2.useReducer)((s) => s + 1, 0), tgtRef = (0, import_react2.useRef)(), rtrRef = (0, import_react2.useRef)(), rtr = tgtRef.current !== target || !rtrRef.current ? (tgtRef.current = target, rtrRef.current = target instanceof Reactor ? target : target.__Reactor__ || new Reactor(target)) : rtrRef.current, atrkrRef = (0, import_react2.useRef)(), prevTrkr = CTX.autotracker, atrkr = CTX.autotracker = atrkrRef.current ||= new Autotracker(), optsRef = (0, import_react2.useRef)(options);
+// src/ts/adapters/react/hooks/useReactor.ts
+function useReactor(target, options = NIL, build) {
+  const versionRef = (0, import_react2.useRef)(0), tgtRef = (0, import_react2.useRef)(), rtrRef = (0, import_react2.useRef)(), rtr = tgtRef.current !== target || !rtrRef.current ? (tgtRef.current = target, rtrRef.current = getReactor(target, true, build)) : rtrRef.current, atrkrRef = (0, import_react2.useRef)(), prevTrkr = CTX.autotracker, atrkr = CTX.autotracker = atrkrRef.current ||= new Autotracker(), optsRef = (0, import_react2.useRef)(options), notifyRef = (0, import_react2.useRef)(NOOP);
   optsRef.current = options;
   atrkr.unblock(rtr), queueMicrotask(() => CTX.autotracker === atrkr && (CTX.autotracker = prevTrkr));
-  return useISOLayoutEffect(() => (CTX.autotracker = prevTrkr, atrkr.callback(reRender, optsRef.current)), [atrkr]), rtr.core;
+  const subscribe = (0, import_react2.useCallback)((notify) => atrkr.callback(notifyRef.current = () => (versionRef.current++, notify())), [atrkr]);
+  const getSnapshot = (0, import_react2.useCallback)(() => versionRef.current, []);
+  (0, import_react2.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+  return useISOLayoutEffect(() => (CTX.autotracker = prevTrkr, atrkr.callback(notifyRef.current, optsRef.current)), [atrkr]), rtr.core;
 }
 function useAnyReactor(options = NIL) {
-  const [, reRender] = (0, import_react2.useReducer)((s) => s + 1, 0), atrkrRef = (0, import_react2.useRef)(), prevTrkr = CTX.autotracker, atrkr = CTX.autotracker = atrkrRef.current ||= new Autotracker(), optsRef = (0, import_react2.useRef)(options);
+  const versionRef = (0, import_react2.useRef)(0), atrkrRef = (0, import_react2.useRef)(), prevTrkr = CTX.autotracker, atrkr = CTX.autotracker = atrkrRef.current ||= new Autotracker(), optsRef = (0, import_react2.useRef)(options), notifyRef = (0, import_react2.useRef)(NOOP);
   optsRef.current = options;
   atrkr.unblock(), queueMicrotask(() => CTX.autotracker === atrkr && (CTX.autotracker = prevTrkr));
-  useISOLayoutEffect(() => (CTX.autotracker = prevTrkr, atrkr.callback(reRender, optsRef.current)), [atrkr]);
+  const subscribe = (0, import_react2.useCallback)((notify) => atrkr.callback(notifyRef.current = () => (versionRef.current++, notify())), [atrkr]);
+  const getSnapshot = (0, import_react2.useCallback)(() => versionRef.current, []);
+  (0, import_react2.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+  useISOLayoutEffect(() => (CTX.autotracker = prevTrkr, atrkr.callback(notifyRef.current, optsRef.current)), [atrkr]);
+}
+function useReactorSnapshot(target, options, build = { referenceTracking: true, smartCloning: true }) {
+  const tgtRef = (0, import_react2.useRef)(), rtrRef = (0, import_react2.useRef)(), rtr = tgtRef.current !== target || !rtrRef.current ? (tgtRef.current = target, rtrRef.current = getReactor(target, true, build)) : rtrRef.current, atrkrRef = (0, import_react2.useRef)(), atrkrRtrRef = (0, import_react2.useRef)(), atrkr = atrkrRtrRef.current !== rtr || !atrkrRef.current ? (atrkrRtrRef.current = rtr, atrkrRef.current = new Autotracker(rtr)) : atrkrRef.current, notifyRef = (0, import_react2.useRef)(NOOP), optsRef = (0, import_react2.useRef)(options);
+  rtr.config.referenceTracking = rtr.config.smartCloning = true;
+  optsRef.current = options;
+  const subscribe = (0, import_react2.useCallback)((notify) => (atrkr.callback(notifyRef.current = notify, optsRef.current), () => atrkr.cleanup()), [atrkr]);
+  const getSnapshot = () => rtr.snapshot();
+  const snapshot = (0, import_react2.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+  const proxy = (0, import_react2.useMemo)(() => atrkr.tracked(snapshot), [atrkr, snapshot]);
+  return useISOLayoutEffect(() => atrkr.callback(notifyRef.current, optsRef.current), [atrkr, proxy]), proxy;
 }
 
-// src/adapters/react/hooks/useSelector.ts
+// src/ts/adapters/react/hooks/useSelector.ts
 var import_react3 = require("react");
-function useSelector(target, sel, eq = Object.is, options = NIL) {
-  const rtrRef = (0, import_react3.useRef)(), tgtRef = (0, import_react3.useRef)(), rtr = tgtRef.current !== target || !rtrRef.current ? (tgtRef.current = target, rtrRef.current = target instanceof Reactor ? target : target.__Reactor__ || new Reactor(target)) : rtrRef.current, atrkrRef = (0, import_react3.useRef)(), atrkr = atrkrRef.current ||= new Autotracker(), notifyRef = (0, import_react3.useRef)(NOOP), sliceRef = (0, import_react3.useRef)(), selRef = (0, import_react3.useRef)(sel), eqRef = (0, import_react3.useRef)(eq), optsRef = (0, import_react3.useRef)(options);
+function useSelector(target, sel, eq = Object.is, options = NIL, build) {
+  const rtrRef = (0, import_react3.useRef)(), tgtRef = (0, import_react3.useRef)(), rtr = tgtRef.current !== target || !rtrRef.current ? (tgtRef.current = target, rtrRef.current = getReactor(target, true, build)) : rtrRef.current, atrkrRef = (0, import_react3.useRef)(), atrkr = atrkrRef.current ||= new Autotracker(), notifyRef = (0, import_react3.useRef)(NOOP), sliceRef = (0, import_react3.useRef)(), selRef = (0, import_react3.useRef)(sel), eqRef = (0, import_react3.useRef)(eq), optsRef = (0, import_react3.useRef)(options);
   selRef.current = sel, eqRef.current = eq, optsRef.current = options;
   const subscribe = (0, import_react3.useCallback)((notify) => atrkr.callback(notifyRef.current = notify, optsRef.current), [atrkr]);
   const getSnapshot = (0, import_react3.useCallback)(() => {
@@ -1044,20 +1071,209 @@ function useAnySelector(sel, eq = Object.is, options = NIL) {
   const slice = (0, import_react3.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
   return useISOLayoutEffect(() => atrkr.callback(notifyRef.current, optsRef.current), [atrkr, slice]), slice;
 }
+function useSelectorSnapshot(target, sel, eq = Object.is, options, build = { referenceTracking: true, smartCloning: true }) {
+  const tgtRef = (0, import_react3.useRef)(), rtrRef = (0, import_react3.useRef)(), rtr = tgtRef.current !== target || !rtrRef.current ? (tgtRef.current = target, rtrRef.current = getReactor(target, true, build)) : rtrRef.current, atrkrRef = (0, import_react3.useRef)(), atrkrRtrRef = (0, import_react3.useRef)(), atrkr = atrkrRtrRef.current !== rtr || !atrkrRef.current ? (atrkrRtrRef.current = rtr, atrkrRef.current = new Autotracker(rtr)) : atrkrRef.current, notifyRef = (0, import_react3.useRef)(NOOP), sliceRef = (0, import_react3.useRef)(), selRef = (0, import_react3.useRef)(sel), eqRef = (0, import_react3.useRef)(eq), optsRef = (0, import_react3.useRef)(options);
+  rtr.config.referenceTracking = rtr.config.smartCloning = true;
+  optsRef.current = options, selRef.current = sel, eqRef.current = eq;
+  const subscribe = (0, import_react3.useCallback)((notify) => (atrkr.callback(notifyRef.current = notify, optsRef.current), () => atrkr.cleanup()), [atrkr]);
+  const getSnapshot = (0, import_react3.useCallback)(() => {
+    const next = selRef.current(atrkr.tracked(rtr.snapshot()));
+    return eqRef.current(sliceRef.current, next) ? sliceRef.current : sliceRef.current = next;
+  }, [atrkr]);
+  const slice = (0, import_react3.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+  return useISOLayoutEffect(() => atrkr.callback(notifyRef.current, optsRef.current), [atrkr, slice]), slice;
+}
 
-// src/adapters/react/hooks/usePath.ts
+// src/ts/adapters/react/hooks/usePath.ts
 var import_react4 = require("react");
-function usePath(target, path, options = NIL) {
-  const [, reRender] = (0, import_react4.useReducer)((s) => s + 1, 0), tgtRef = (0, import_react4.useRef)(), rtrRef = (0, import_react4.useRef)(), rtr = tgtRef.current !== target || !rtrRef.current ? (tgtRef.current = target, rtrRef.current = target instanceof Reactor ? target : target.__Reactor__ || new Reactor(target)) : rtrRef.current, optsRef = (0, import_react4.useRef)(options);
+function usePath(target, path, options = NIL, build) {
+  const versionRef = (0, import_react4.useRef)(0), tgtRef = (0, import_react4.useRef)(), rtrRef = (0, import_react4.useRef)(), rtr = tgtRef.current !== target || !rtrRef.current ? (tgtRef.current = target, rtrRef.current = getReactor(target, true, build)) : rtrRef.current, optsRef = (0, import_react4.useRef)(options);
   optsRef.current = options;
-  return useISOLayoutEffect(() => void rtr[optsRef.current.sync ? "watch" : "on"](path, reRender, optsRef.current), [rtr, path]), getAny(rtr.core, path);
+  const subscribe = (0, import_react4.useCallback)((notify) => rtr[optsRef.current.sync ? "watch" : "on"](path, () => (versionRef.current++, notify()), optsRef.current), [rtr, path]);
+  const getSnapshot = (0, import_react4.useCallback)(() => versionRef.current, []);
+  (0, import_react4.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+  return getAny(rtr.core, path);
+}
+
+// src/ts/adapters/react/TimeTravelOverlay.tsx
+var import_react5 = require("react");
+
+// src/ts/utils/keys.ts
+function stringifyKeyEvent(e) {
+  const parts = [];
+  if (e.ctrlKey) parts.push("ctrl");
+  if (e.altKey) parts.push("alt");
+  if (e.shiftKey) parts.push("shift");
+  if (e.metaKey) parts.push("meta");
+  parts.push(e.key?.toLowerCase() ?? "");
+  return parts.join("+");
+}
+function cleanKeyCombo(combo) {
+  const clean = (combo2) => {
+    const m = ["ctrl", "alt", "shift", "meta"], alias = { cmd: "meta", space: " " };
+    if (combo2 === " " || combo2 === "+") return combo2;
+    combo2 = combo2.replace(/\+\s*\+$/, "+plus");
+    const p = combo2.toLowerCase().split("+").filter((k) => k !== "").map((k) => alias[k] || (k === "plus" ? "+" : k.trim() || " "));
+    return [...p.filter((k) => m.includes(k)).sort((a, b) => m.indexOf(a) - m.indexOf(b)), ...p.filter((k) => !m.includes(k)) || ""].join("+");
+  };
+  return Array.isArray(combo) ? combo.map(clean) : clean(combo);
+}
+function matchKeys(required, actual, strict = false) {
+  actual = cleanKeyCombo(actual);
+  const match = (required2, actual2) => {
+    required2 = cleanKeyCombo(required2);
+    if (strict) return required2 === actual2;
+    const reqKeys = required2.split("+"), actKeys = actual2.split("+");
+    return reqKeys.every((k) => actKeys.includes(k));
+  };
+  return Array.isArray(required) ? required.some((req) => match(req, actual)) : match(required, actual);
+}
+function getTermsForKey(combo, settings) {
+  const terms = { override: false, block: false, whitelisted: false, action: null }, { overrides = [], shortcuts = {}, blocks = [], strictMatches: s = false, whitelist = [] } = settings || {};
+  combo = cleanKeyCombo(combo);
+  if (matchKeys(overrides, combo, s)) terms.override = true;
+  if (matchKeys(blocks, combo, s)) terms.block = true;
+  if (matchKeys(whitelist, combo)) terms.whitelisted = true;
+  terms.action = Object.keys(shortcuts).find((key) => matchKeys(shortcuts[key], combo, s)) || null;
+  return terms;
+}
+function keyEventAllowed(e, settings) {
+  if (settings.disabled || (e.key === " " || e.key === "Enter") && (e.target?.ownerDocument || document).activeElement?.tagName === "BUTTON" || (e.target?.ownerDocument || document).activeElement?.matches("input,textarea,[contenteditable='true']")) return false;
+  const combo = stringifyKeyEvent(e), { override, block, action, whitelisted } = getTermsForKey(combo, settings);
+  if (block) return false;
+  if (override) e.preventDefault();
+  if (action) return action;
+  if (whitelisted) return e.key.toLowerCase();
+  return false;
+}
+var formatKeyForDisplay = (combo) => ` ${(Array.isArray(combo) ? combo : [combo]).map((c) => `(${cleanKeyCombo(c).replace(" ", "space")})`).join(" or ")}`;
+function parseForARIAKS(s, formatted = true) {
+  const m = { ctrl: "Control", cmd: "Meta", space: "Space", plus: "+" };
+  return (formatted && !Array.isArray(s) ? s : formatKeyForDisplay(s)).toLowerCase().replace(/[()]/g, "").replace(/\bor\b/g, " ").replace(/\w+/g, (k) => m[k] || k).replace(/\s+/g, " ").trim();
+}
+
+// src/ts/utils/dom.ts
+function createEl(tag, props, dataset, styles, el = tag ? document?.createElement(tag) : null) {
+  return assignEl(el, props, dataset, styles), el;
+}
+function assignEl(el, props, dataset, styles) {
+  if (!el) return;
+  if (props) {
+    for (const k of Object.keys(props)) if (props[k] !== void 0) el[k] = props[k];
+  }
+  if (dataset) {
+    for (const k of Object.keys(dataset)) if (dataset[k] !== void 0) el.dataset[k] = String(dataset[k]);
+  }
+  if (styles) {
+    for (const k of Object.keys(styles)) if (styles[k] !== void 0) el.style[k] = styles[k];
+  }
+}
+
+// src/ts/adapters/vanilla/effect.ts
+function effect(callback, options) {
+  const atrkr = new Autotracker();
+  let destroyed = false;
+  (function execute() {
+    if (!destroyed) withTracker(atrkr, () => callback()), atrkr.callback(execute, options);
+  })();
+  return () => (destroyed = true, atrkr.destroy());
+}
+
+// src/ts/adapters/vanilla/TimeTravelOverlay.ts
+var keys = {
+  overrides: ["Ctrl+z", "Cmd+z", "Ctrl+y", "Cmd+y", "Ctrl+Shift+z", "Cmd+Shift+z", "Ctrl+g", "Cmd+g", ",", ".", "ArrowLeft", "ArrowRight", "Space", "Alt+Space", "Escape", "Delete", "e", "i", "c"],
+  shortcuts: { undo: ["Ctrl+z", "Cmd+z"], redo: ["Ctrl+y", "Cmd+y", "Ctrl+Shift+z", "Cmd+Shift+z"], genesis: ["Ctrl+g", "Cmd+g"], prevFrame: ",", nextFrame: ".", skipBwd: "ArrowLeft", skipFwd: "ArrowRight", playPause: "Space", rewind: "Alt+Space", closeOverlay: "Escape", clrHistory: "Delete", export: "e", import: "i", clear: "c" }
+};
+var TimeTravelOverlay = class _TimeTravelOverlay {
+  static count = 0;
+  index = _TimeTravelOverlay.count;
+  config;
+  state = reactive({ open: false, import: "" });
+  time;
+  els;
+  clups = [];
+  keyup;
+  /** Creates a docked TimeTravel overlay bound to a plugin instance.
+   * @param time TimeTravel plugin instance that owns timeline operations.
+   * @param build Optional initial overlay config overrides.
+   */
+  constructor(time, build = {}) {
+    this.time = time;
+    this.config = reactive({ title: `Time Travel Overlay ${this.index = ++_TimeTravelOverlay.count}`, ...build });
+    this.state.open = !!this.config.startOpen;
+    const s = this.time.state, host = createEl("div", { className: "tt-overlay-host" }), toggle = createEl("button", { className: "tt-overlay-toggle", type: "button", onclick: () => this.state.open = !this.state.open }), panel = createEl("aside", { className: "tt-overlay", ariaLabel: "time travel overlay" }), title = createEl("div", { className: "title" }), frame = createEl("span", { className: "muted" }), clrHistory = createEl("button", { textContent: `Clear History${formatKeyForDisplay(keys.shortcuts.clrHistory)}`, ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.clrHistory, false), onclick: () => (this.time.clear(), this.state.import = "") }), undo = createEl("button", { textContent: `Undo${formatKeyForDisplay(keys.shortcuts.undo[0])}`, ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.undo, false), onclick: this.time.undo }), redo = createEl("button", { textContent: `Redo${formatKeyForDisplay(keys.shortcuts.redo[0])}`, ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.redo, false), onclick: this.time.redo }), genesis = createEl("button", { textContent: `Genesis${formatKeyForDisplay(keys.shortcuts.genesis[0])}`, ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.genesis, false), onclick: () => this.time.jumpTo(0) }), playPause = createEl("button", { onclick: () => this.time[s.paused ? "play" : "pause"](), ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.playPause, false) }), rewind = createEl("button", { textContent: `Rewind${formatKeyForDisplay(keys.shortcuts.rewind)}`, ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.rewind, false), onclick: this.time.rewind }), range = createEl("input", { type: "range", min: "0", max: "0", value: "0", title: "time travel frame", ariaLabel: "time travel frame", oninput: () => this.time.jumpTo(Number(range.value)) }), exp = createEl("button", { textContent: `Export${formatKeyForDisplay(keys.shortcuts.export)}`, ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.export, false), onclick: () => this.state.import = this.time.export(null, 2) }), imp = createEl("button", { textContent: `Import${formatKeyForDisplay(keys.shortcuts.import)}`, ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.import, false), onclick: () => this.state.import.trim().length && this.time.import(this.state.import) }), clr = createEl("button", { textContent: `Clear${formatKeyForDisplay(keys.shortcuts.clear)}`, ariaKeyShortcuts: parseForARIAKS(keys.shortcuts.clear, false), onclick: () => this.state.import = "" }), payload = createEl("textarea", { className: "tt-io", readOnly: true, placeholder: "current payload json", title: "current payload" }), io = createEl("textarea", { className: "tt-io", placeholder: "timeline payload json", oninput: () => this.state.import = io.value }), foot = createEl("p", { className: "tt-footnote", textContent: "Want this in your app? " }), link = createEl("a", { target: "_blank", rel: "noreferrer noopener", textContent: "sia-reactor", href: "https://www.npmjs.com/package/sia-reactor" }), box = createEl("div", { className: "tt-status-box" }), status = createEl("div", { className: "tt-status-row" }), row1 = createEl("div", { className: "tt-row" }), row2 = createEl("div", { className: "tt-row" }), row3 = createEl("div", { className: "tt-row" });
+    status.append((box.append(frame), box), clrHistory);
+    panel.append(title, status, (row1.append(undo, redo, genesis), row1), (row2.append(playPause, rewind), row2), payload, range, (row3.append(exp, imp, clr), row3), io, (foot.appendChild(link), foot));
+    host.append(toggle, panel);
+    this.els = { host, toggle, panel, title, frame, clrHistory, undo, redo, genesis, playPause, rewind, range, exp, imp, clr, payload, io };
+    this.keyup = (e) => {
+      const a = this.state.open && keyEventAllowed(e, keys);
+      a === "undo" ? this.time.undo() : a === "redo" ? this.time.redo() : a === "genesis" ? this.time.jumpTo(0) : a === "prevFrame" ? this.time.step(1, false) : a === "nextFrame" ? this.time.step(1, true) : a === "skipBwd" ? this.time.step(5, false) : a === "skipFwd" ? this.time.step(5, true) : a === "rewind" ? this.time.rewind() : a === "playPause" ? this.time[s.paused ? "play" : "pause"]() : a === "clrHistory" ? this.time.clear() : a === "closeOverlay" ? this.state.open = false : a === "export" ? this.state.import = this.time.export() : a === "import" ? this.state.import.trim().length && this.time.import(this.state.import) : a === "clear" && (this.state.import = "");
+    };
+    window.addEventListener("keydown", this.keyup);
+    const sync = [
+      effect(() => this.config.color ? host.style.setProperty("--sia-tt-color", this.config.color) : host.style.removeProperty("--sia-tt-color")),
+      effect(() => {
+        if (this.config.devOnly && !CTX.isDevEnv) return void host.remove();
+        const dock = getDock(this.config.container);
+        if (host.parentNode !== dock) dock.appendChild(host);
+      }),
+      effect(() => toggle.textContent = `${(panel.hidden = !this.state.open) ? "Show" : "Hide"} ${title.textContent = this.config.title ?? ""}`),
+      effect(() => playPause.textContent = `${s.paused ? "Play" : "Pause"}${formatKeyForDisplay(keys.shortcuts.playPause)}`),
+      effect(() => {
+        frame.textContent = `Frame: ${s.currentFrame} / ${s.history.length}`;
+        range.disabled = clrHistory.disabled = !s.history.length;
+        genesis.disabled = rewind.disabled = undo.disabled = !s.currentFrame;
+        playPause.disabled = redo.disabled = s.currentFrame >= s.history.length;
+        range.max = String(s.history.length);
+        range.value = String(Math.min(s.currentFrame, s.history.length));
+        payload.value = JSON.stringify(s.currentFrame ? s.history[s.currentFrame - 1] : { type: "genesis", value: s.initialState }, null, 2);
+      }),
+      effect(() => {
+        clr.disabled = imp.disabled = !this.state.import.trim().length;
+        io.value !== this.state.import && (io.value = this.state.import);
+      })
+    ];
+    this.clups.push(...sync);
+  }
+  destroy() {
+    this.clups.forEach((fn) => fn());
+    this.keyup && window.removeEventListener("keydown", this.keyup);
+    this.els.host.remove();
+    nuke(this), --_TimeTravelOverlay.count;
+  }
+};
+function getDirChild(parent, className) {
+  for (const child of parent.children) if (child instanceof HTMLElement && child.classList.contains(className)) return child;
+}
+function getDock(container) {
+  const host = container && container !== document.documentElement ? container : document.body;
+  if (host !== document.body && getComputedStyle(host).position === "static") host.style.position = "relative";
+  const layer = getDirChild(host, "tt-overlay-layer") || createEl("div", { className: "tt-overlay-layer" }, void 0, { position: host === document.body ? "fixed" : "absolute" });
+  if (layer.parentElement !== host) host.appendChild(layer);
+  const dock = getDirChild(layer, "tt-overlay-dock") || createEl("div", { className: "tt-overlay-dock" });
+  return dock.parentElement !== layer && layer.appendChild(dock), dock;
+}
+
+// src/ts/adapters/react/TimeTravelOverlay.tsx
+function TimeTravelOverlay2(props) {
+  const vRef = (0, import_react5.useRef)(null), { time, title, color, devOnly, startOpen, container } = props;
+  useISOLayoutEffect(() => {
+    vRef.current = new TimeTravelOverlay(time, props);
+    return () => void (vRef.current?.destroy(), vRef.current = null);
+  }, [time]);
+  useISOLayoutEffect(() => void (vRef.current && (title !== void 0 && (vRef.current.config.title = title), vRef.current.config.color = color, vRef.current.config.devOnly = devOnly, vRef.current.config.container = container, vRef.current.state.open = startOpen)), [title, color, devOnly, container, startOpen]);
+  return null;
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  TimeTravelOverlay,
   useAnyReactor,
   useAnySelector,
   useISOLayoutEffect,
   usePath,
   useReactor,
-  useSelector
+  useReactorSnapshot,
+  useSelector,
+  useSelectorSnapshot
 });