cogsbox-state 0.5.475-canary.6 → 0.5.475-canary.9

package/dist/CogsState.jsx

@@ -1,9 +1,9 @@
 "use client";
-import { jsx as Z, Fragment as Me } from "react/jsx-runtime";
-import { pluginStore as x } from "./pluginStore.js";
-import { useState as ee, useRef as q, useCallback as Ae, useEffect as J, useLayoutEffect as $e, useMemo as ye, createElement as ue, startTransition as Ee } from "react";
-import { transformStateFunc as Ve, isFunction as R, isDeepEqual as Y, isArray as Te, getDifferences as Ie } from "./utility.js";
-import { ValidationWrapper as be, IsolatedComponentWrapper as Pe, FormElementWrapper as ke, MemoizedCogsItemWrapper as De } from "./Components.jsx";
+import { jsx as Q, Fragment as Me } from "react/jsx-runtime";
+import { pluginStore as q } from "./pluginStore.js";
+import { useState as ee, useRef as x, useCallback as Ae, useEffect as J, useLayoutEffect as $e, useMemo as ye, createElement as ue, startTransition as Ee } from "react";
+import { transformStateFunc as Ve, isFunction as R, isDeepEqual as Z, isArray as Te, getDifferences as be } from "./utility.js";
+import { ValidationWrapper as Ie, IsolatedComponentWrapper as Pe, FormElementWrapper as ke, MemoizedCogsItemWrapper as De } from "./Components.jsx";
 import Ce from "superjson";
 import { v4 as X } from "uuid";
 import { getGlobalStore as p, updateShadowTypeInfo as fe } from "./store.js";
@@ -12,13 +12,13 @@ import { runValidation as _e } from "./validation.js";
 const {
   getInitialOptions: N,
   updateInitialStateGlobal: he,
-  getShadowMetadata: A,
-  setShadowMetadata: L,
+  getShadowMetadata: E,
+  setShadowMetadata: B,
   getShadowValue: D,
   initializeShadowState: K,
   initializeAndMergeShadowState: Oe,
-  updateShadowAtPath: Ue,
-  insertShadowArrayElement: je,
+  updateShadowAtPath: je,
+  insertShadowArrayElement: Ue,
   insertManyShadowArrayElements: ve,
   removeShadowArrayElement: Ne,
   setInitialStateOptions: de,
@@ -27,28 +27,26 @@ const {
   addPathComponent: Fe,
   clearSelectedIndexesForState: ze,
   addStateLog: Re,
-  setSyncInfo: wt,
   clearSelectedIndex: Le,
   getSyncInfo: We,
   notifyPathSubscribers: Be,
   getPluginMetaDataMap: Ge,
-  setPluginMetaData: xe,
-  removePluginMetaData: qe
-  // Note: The old functions are no longer imported under their original names
-} = p.getState(), { notifyUpdate: Je } = x.getState();
-function j(e, a, l) {
-  const s = A(e, a);
+  setPluginMetaData: qe,
+  removePluginMetaData: xe
+} = p.getState(), { notifyUpdate: Je } = q.getState();
+function U(e, a, l) {
+  const s = E(e, a);
   if (!!!s?.arrayKeys)
     return { isArray: !1, value: p.getState().getShadowValue(e, a), keys: [] };
-  const i = a.length > 0 ? a.join(".") : "root", m = l?.arrayViews?.[i] ?? s.arrayKeys;
-  return Array.isArray(m) && m.length === 0 ? { isArray: !0, value: [], keys: [] } : { isArray: !0, value: p.getState().getShadowValue(e, a, m), keys: m ?? [] };
+  const c = a.length > 0 ? a.join(".") : "root", h = l?.arrayViews?.[c] ?? s.arrayKeys;
+  return Array.isArray(h) && h.length === 0 ? { isArray: !0, value: [], keys: [] } : { isArray: !0, value: p.getState().getShadowValue(e, a, h), keys: h ?? [] };
 }
 function oe(e, a, l) {
   for (let s = 0; s < e.length; s++)
     if (l(e[s], s)) {
-      const g = a[s];
-      if (g)
-        return { key: g, index: s, value: e[s] };
+      const S = a[s];
+      if (S)
+        return { key: S, index: s, value: e[s] };
     }
   return null;
 }
@@ -64,40 +62,40 @@ function ce({
   options: a,
   initialOptionsPart: l
 }) {
-  const s = N(e) || {}, g = l[e] || {};
-  let i = { ...g, ...s }, m = !1;
+  const s = N(e) || {}, S = l[e] || {};
+  let c = { ...S, ...s }, h = !1;
   if (a) {
     const u = (t, o) => {
       for (const y in o)
-        o.hasOwnProperty(y) && (o[y] instanceof Object && !Array.isArray(o[y]) && t[y] instanceof Object ? Y(t[y], o[y]) || (u(t[y], o[y]), m = !0) : t[y] !== o[y] && (t[y] = o[y], m = !0));
+        o.hasOwnProperty(y) && (o[y] instanceof Object && !Array.isArray(o[y]) && t[y] instanceof Object ? Z(t[y], o[y]) || (u(t[y], o[y]), h = !0) : t[y] !== o[y] && (t[y] = o[y], h = !0));
       return t;
     };
-    i = u(i, a);
+    c = u(c, a);
   }
-  if (i.validation && (a?.validation?.hasOwnProperty("onBlur") || s?.validation?.hasOwnProperty("onBlur") || g?.validation?.hasOwnProperty("onBlur") || (i.validation.onBlur = "error", m = !0)), m) {
-    de(e, i);
-    const u = s?.validation?.zodSchemaV4 || s?.validation?.zodSchemaV3, t = i.validation?.zodSchemaV4 && !s?.validation?.zodSchemaV4, o = i.validation?.zodSchemaV3 && !s?.validation?.zodSchemaV3;
+  if (c.validation && (a?.validation?.hasOwnProperty("onBlur") || s?.validation?.hasOwnProperty("onBlur") || S?.validation?.hasOwnProperty("onBlur") || (c.validation.onBlur = "error", h = !0)), h) {
+    de(e, c);
+    const u = s?.validation?.zodSchemaV4 || s?.validation?.zodSchemaV3, t = c.validation?.zodSchemaV4 && !s?.validation?.zodSchemaV4, o = c.validation?.zodSchemaV3 && !s?.validation?.zodSchemaV3;
     !u && (t || o) && (t ? fe(
       e,
-      i.validation.zodSchemaV4,
+      c.validation.zodSchemaV4,
       "zod4"
     ) : o && fe(
       e,
-      i.validation.zodSchemaV3,
+      c.validation.zodSchemaV3,
       "zod3"
-    ), B(e));
+    ), L(e));
   }
-  return i;
+  return c;
 }
-function pt(e, a) {
+function wt(e, a) {
   return {
     ...a,
     initialState: e,
     _addStateOptions: !0
   };
 }
-const Mt = (e, a) => {
-  a?.plugins && x.getState().setRegisteredPlugins(a.plugins);
+const pt = (e, a) => {
+  a?.plugins && q.getState().setRegisteredPlugins(a.plugins);
   const [l, s] = Ve(e);
   Object.keys(l).forEach((u) => {
     let t = s[u] || {};
@@ -128,14 +126,14 @@ const Mt = (e, a) => {
   }), Object.keys(l).forEach((u) => {
     K(u, l[u]);
   });
-  const g = (u, t) => {
+  const S = (u, t) => {
     const [o] = ee(t?.componentId ?? X()), y = ce({
       stateKey: u,
       options: t,
       initialOptionsPart: s
-    }), $ = q(y);
+    }), $ = x(y);
     $.current = y;
-    const V = D(u, []) || l[u], I = ot(
+    const V = D(u, []) || l[u], b = ot(
       V,
       {
         stateKey: u,
@@ -151,47 +149,47 @@ const Mt = (e, a) => {
       }
     );
     return J(() => {
-      t && x.getState().setPluginOptionsForState(u, t);
-    }, [u, t]), J(() => (x.getState().stateHandlers.set(u, I), () => {
-      x.getState().stateHandlers.delete(u);
-    }), [u, I]), I;
+      t && q.getState().setPluginOptionsForState(u, t);
+    }, [u, t]), J(() => (q.getState().stateHandlers.set(u, b), () => {
+      q.getState().stateHandlers.delete(u);
+    }), [u, b]), b;
   };
-  function i(u, t) {
-    if (ce({ stateKey: u, options: t, initialOptionsPart: s }), t.localStorage && Ze(u, t), t.formElements) {
-      const y = x.getState().registeredPlugins.map(($) => t.formElements.hasOwnProperty($.name) ? {
+  function c(u, t) {
+    if (ce({ stateKey: u, options: t, initialOptionsPart: s }), t.localStorage && Qe(u, t), t.formElements) {
+      const y = q.getState().registeredPlugins.map(($) => t.formElements.hasOwnProperty($.name) ? {
         ...$,
         formWrapper: t.formElements[$.name]
       } : $);
-      x.getState().setRegisteredPlugins(y);
+      q.getState().setRegisteredPlugins(y);
     }
-    B(u);
+    L(u);
   }
-  function m(u) {
+  function h(u) {
     Object.keys(l).forEach((o) => {
-      i(o, u);
+      c(o, u);
     });
   }
   return {
-    useCogsState: g,
-    setCogsOptionsByKey: i,
-    setCogsOptions: m
+    useCogsState: S,
+    setCogsOptionsByKey: c,
+    setCogsOptions: h
   };
-}, He = (e, a, l, s, g) => {
+}, He = (e, a, l, s, S) => {
   l?.log && console.log(
     "saving to localstorage",
     a,
     l.localStorage?.key,
     s
   );
-  const i = R(l?.localStorage?.key) ? l.localStorage?.key(e) : l?.localStorage?.key;
-  if (i && s) {
-    const m = `${s}-${a}-${i}`;
+  const c = R(l?.localStorage?.key) ? l.localStorage?.key(e) : l?.localStorage?.key;
+  if (c && s) {
+    const h = `${s}-${a}-${c}`;
     let u;
     try {
-      u = ae(m)?.lastSyncedWithServer;
+      u = ae(h)?.lastSyncedWithServer;
     } catch {
     }
-    const t = A(a, []), o = {
+    const t = E(a, []), o = {
       state: e,
       lastUpdated: Date.now(),
       lastSyncedWithServer: u,
@@ -199,7 +197,7 @@ const Mt = (e, a) => {
       baseServerState: t?.baseServerState
     }, y = Ce.serialize(o);
     window.localStorage.setItem(
-      m,
+      h,
       JSON.stringify(y.json)
     );
   }
@@ -211,18 +209,18 @@ const Mt = (e, a) => {
   } catch (a) {
     return console.error("Error loading from localStorage:", a), null;
   }
-}, Ze = (e, a) => {
-  const l = D(e, []), { sessionId: s } = me(), g = R(a?.localStorage?.key) ? a.localStorage.key(l) : a?.localStorage?.key;
-  if (g && s) {
-    const i = ae(
-      `${s}-${e}-${g}`
+}, Qe = (e, a) => {
+  const l = D(e, []), { sessionId: s } = me(), S = R(a?.localStorage?.key) ? a.localStorage.key(l) : a?.localStorage?.key;
+  if (S && s) {
+    const c = ae(
+      `${s}-${e}-${S}`
     );
-    if (i && i.lastUpdated > (i.lastSyncedWithServer || 0))
-      return B(e), !0;
+    if (c && c.lastUpdated > (c.lastSyncedWithServer || 0))
+      return L(e), !0;
   }
   return !1;
-}, B = (e) => {
-  const a = A(e, []);
+}, L = (e) => {
+  const a = E(e, []);
   if (!a) return;
   const l = /* @__PURE__ */ new Set();
   a?.components?.forEach((s) => {
@@ -232,16 +230,16 @@ const Mt = (e, a) => {
   });
 };
 function te(e, a, l, s) {
-  const g = A(e, a);
-  if (L(e, a, {
-    ...g,
+  const S = E(e, a);
+  if (B(e, a, {
+    ...S,
     isDirty: !1,
     stateSource: "server",
     lastServerSync: s || Date.now()
   }), Array.isArray(l)) {
-    const i = A(e, a);
-    i?.arrayKeys && i.arrayKeys.forEach((m, u) => {
-      const t = [...a, m], o = l[u];
+    const c = E(e, a);
+    c?.arrayKeys && c.arrayKeys.forEach((h, u) => {
+      const t = [...a, h], o = l[u];
       o !== void 0 && te(
         e,
         t,
@@ -249,86 +247,86 @@ function te(e, a, l, s) {
         s
       );
     });
-  } else l && typeof l == "object" && l.constructor === Object && Object.keys(l).forEach((i) => {
-    const m = [...a, i], u = l[i];
-    te(e, m, u, s);
+  } else l && typeof l == "object" && l.constructor === Object && Object.keys(l).forEach((c) => {
+    const h = [...a, c], u = l[c];
+    te(e, h, u, s);
   });
 }
 let re = [], le = !1;
-function Qe() {
-  le || (le = !0, console.log("Scheduling flush"), queueMicrotask(() => {
-    console.log("Actually flushing"), nt();
+function Ye() {
+  le || (le = !0, queueMicrotask(() => {
+    nt();
   }));
 }
-function Ye(e, a) {
-  e?.signals?.length && e.signals.forEach(({ parentId: l, position: s, effect: g }) => {
-    const i = document.querySelector(`[data-parent-id="${l}"]`);
-    if (!i) return;
-    const m = Array.from(i.childNodes);
-    if (!m[s]) return;
+function Ze(e, a) {
+  e?.signals?.length && e.signals.forEach(({ parentId: l, position: s, effect: S }) => {
+    const c = document.querySelector(`[data-parent-id="${l}"]`);
+    if (!c) return;
+    const h = Array.from(c.childNodes);
+    if (!h[s]) return;
     let u = a;
-    if (g && a !== null)
+    if (S && a !== null)
       try {
-        u = new Function("state", `return (${g})(state)`)(
+        u = new Function("state", `return (${S})(state)`)(
           a
         );
       } catch (t) {
         console.error("Error evaluating effect function:", t);
       }
-    u !== null && typeof u == "object" && (u = JSON.stringify(u)), m[s].textContent = String(u ?? "");
+    u !== null && typeof u == "object" && (u = JSON.stringify(u)), h[s].textContent = String(u ?? "");
   });
 }
 function Xe(e, a, l) {
-  const s = A(e, []);
+  const s = E(e, []);
   if (!s?.components)
     return /* @__PURE__ */ new Set();
-  const g = /* @__PURE__ */ new Set();
+  const S = /* @__PURE__ */ new Set();
   if (l.type === "update") {
-    let i = [...a];
+    let c = [...a];
     for (; ; ) {
-      const m = A(e, i);
-      if (m?.pathComponents && m.pathComponents.forEach((u) => {
+      const h = E(e, c);
+      if (h?.pathComponents && h.pathComponents.forEach((u) => {
         const t = s.components?.get(u);
-        t && ((Array.isArray(t.reactiveType) ? t.reactiveType : [t.reactiveType || "component"]).includes("none") || g.add(t));
-      }), i.length === 0) break;
-      i.pop();
+        t && ((Array.isArray(t.reactiveType) ? t.reactiveType : [t.reactiveType || "component"]).includes("none") || S.add(t));
+      }), c.length === 0) break;
+      c.pop();
     }
-    l.newValue && typeof l.newValue == "object" && !Te(l.newValue) && Ie(l.newValue, l.oldValue).forEach((u) => {
-      const t = u.split("."), o = [...a, ...t], y = A(e, o);
+    l.newValue && typeof l.newValue == "object" && !Te(l.newValue) && be(l.newValue, l.oldValue).forEach((u) => {
+      const t = u.split("."), o = [...a, ...t], y = E(e, o);
       y?.pathComponents && y.pathComponents.forEach(($) => {
         const V = s.components?.get($);
-        V && ((Array.isArray(V.reactiveType) ? V.reactiveType : [V.reactiveType || "component"]).includes("none") || g.add(V));
+        V && ((Array.isArray(V.reactiveType) ? V.reactiveType : [V.reactiveType || "component"]).includes("none") || S.add(V));
       });
     });
   } else if (l.type === "insert" || l.type === "cut" || l.type === "insert_many") {
-    let m = [...l.type === "insert" ? a : a.slice(0, -1)];
+    let h = [...l.type === "insert" ? a : a.slice(0, -1)];
     for (; ; ) {
-      const u = A(e, m);
+      const u = E(e, h);
       if (u?.pathComponents && u.pathComponents.forEach((t) => {
         const o = s.components?.get(t);
-        o && g.add(o);
-      }), m.length === 0) break;
-      m.pop();
+        o && S.add(o);
+      }), h.length === 0) break;
+      h.pop();
     }
   }
-  return g;
+  return S;
 }
 function Ke(e, a, l) {
-  const s = p.getState().getShadowValue(e, a), g = R(l) ? l(s) : l;
-  if (Y(s, g))
+  const s = p.getState().getShadowValue(e, a), S = R(l) ? l(s) : l;
+  if (Z(s, S))
     return null;
-  Ue(e, a, g), ne(e, a, { bubble: !0 });
-  const i = A(e, a);
+  je(e, a, S), ne(e, a, { bubble: !0 });
+  const c = E(e, a);
   return {
     type: "update",
     oldValue: s,
-    newValue: g,
-    shadowMeta: i
+    newValue: S,
+    shadowMeta: c
   };
 }
 function et(e, a, l) {
   ve(e, a, l), ne(e, a, { bubble: !0 });
-  const s = A(e, a);
+  const s = E(e, a);
   return {
     type: "insert_many",
     count: l.length,
@@ -336,29 +334,29 @@ function et(e, a, l) {
     path: a
   };
 }
-function tt(e, a, l, s, g) {
-  let i;
+function tt(e, a, l, s, S) {
+  let c;
   if (R(l)) {
     const { value: o } = W(e, a);
-    i = l({ state: o });
+    c = l({ state: o });
   } else
-    i = l;
-  const m = je(
+    c = l;
+  const h = Ue(
     e,
     a,
-    i,
+    c,
     s,
-    g
+    S
   );
   ne(e, a, { bubble: !0 });
-  const u = A(e, a);
+  const u = E(e, a);
   let t;
   return u?.arrayKeys && s !== void 0 && s > 0 && (t = u.arrayKeys[s - 1]), {
     type: "insert",
-    newValue: i,
+    newValue: c,
     shadowMeta: u,
     path: a,
-    itemId: m,
+    itemId: h,
     insertAfterId: t
   };
 }
@@ -373,54 +371,54 @@ function nt() {
       l.push(s);
       continue;
     }
-    const g = s, i = g.type === "cut" ? null : g.newValue;
-    g.shadowMeta?.signals?.length > 0 && a.push({ shadowMeta: g.shadowMeta, displayValue: i }), Xe(
-      g.stateKey,
-      g.path,
-      g
+    const S = s, c = S.type === "cut" ? null : S.newValue;
+    S.shadowMeta?.signals?.length > 0 && a.push({ shadowMeta: S.shadowMeta, displayValue: c }), Xe(
+      S.stateKey,
+      S.path,
+      S
     ).forEach((u) => {
       e.add(u);
     });
   }
-  l.length > 0 && Re(l), a.forEach(({ shadowMeta: s, displayValue: g }) => {
-    Ye(s, g);
+  l.length > 0 && Re(l), a.forEach(({ shadowMeta: s, displayValue: S }) => {
+    Ze(s, S);
   }), e.forEach((s) => {
     s.forceUpdate();
   }), re = [], le = !1;
 }
 function at(e, a, l) {
-  return (g, i, m) => {
-    s(e, i, g, m);
+  return (S, c, h) => {
+    s(e, c, S, h);
   };
-  function s(g, i, m, u) {
+  function s(S, c, h, u) {
     let t;
     switch (u.updateType) {
       case "update":
-        t = Ke(g, i, m);
+        t = Ke(S, c, h);
         break;
       case "insert":
         t = tt(
-          g,
-          i,
-          m,
+          S,
+          c,
+          h,
           u.index,
           u.itemId
         );
         break;
       case "insert_many":
-        t = et(g, i, m);
+        t = et(S, c, h);
         break;
       case "cut":
-        t = rt(g, i);
+        t = rt(S, c);
         break;
     }
     if (t === null)
       return;
-    t.stateKey = g, t.path = i, re.push(t), Qe();
+    t.stateKey = S, t.path = c, re.push(t), Ye();
     const o = {
       timeStamp: Date.now(),
-      stateKey: g,
-      path: i,
+      stateKey: S,
+      path: c,
       updateType: u.updateType,
       status: "new",
       oldValue: t.oldValue,
@@ -431,7 +429,7 @@ function at(e, a, l) {
     };
     re.push(o), t.newValue !== void 0 && He(
       t.newValue,
-      g,
+      S,
       l.current,
       a
     ), l.current?.middleware && l.current.middleware({ update: o }), _e(o, u.validationTrigger || "programmatic"), Je(o);
@@ -441,22 +439,22 @@ function ot(e, {
   stateKey: a,
   localStorage: l,
   formElements: s,
-  reactiveDeps: g,
-  reactiveType: i,
-  componentId: m,
+  reactiveDeps: S,
+  reactiveType: c,
+  componentId: h,
   defaultState: u,
   dependencies: t,
   serverState: o
 } = {}) {
   const [y, $] = ee({}), { sessionId: V } = me();
-  let I = !a;
-  const [v] = ee(a ?? X()), F = q(m ?? X()), C = q(
+  let b = !a;
+  const [v] = ee(a ?? X()), F = x(h ?? X()), C = x(
     null
   );
   C.current = N(v) ?? null;
   const G = Ae(
     (P) => {
-      const n = P ? { ...N(v), ...P } : N(v), c = n?.defaultState || u || e;
+      const n = P ? { ...N(v), ...P } : N(v), i = n?.defaultState || u || e;
       if (n?.serverState?.status === "success" && n?.serverState?.data !== void 0)
         return {
           value: n.serverState.data,
@@ -464,18 +462,18 @@ function ot(e, {
           timestamp: n.serverState.timestamp || Date.now()
         };
       if (n?.localStorage?.key && V) {
-        const d = R(n.localStorage.key) ? n.localStorage.key(c) : n.localStorage.key, h = ae(
+        const d = R(n.localStorage.key) ? n.localStorage.key(i) : n.localStorage.key, m = ae(
           `${V}-${v}-${d}`
         );
-        if (h && h.lastUpdated > (n?.serverState?.timestamp || 0))
+        if (m && m.lastUpdated > (n?.serverState?.timestamp || 0))
           return {
-            value: h.state,
+            value: m.state,
             source: "localStorage",
-            timestamp: h.lastUpdated
+            timestamp: m.lastUpdated
           };
       }
       return {
-        value: c || e,
+        value: i || e,
         source: "default",
         timestamp: Date.now()
       };
@@ -490,26 +488,26 @@ function ot(e, {
       if (n?.status !== "success" || n.data === void 0)
         return;
       se(v, { serverState: n });
-      const c = typeof n.merge == "object" ? n.merge : n.merge === !0 ? { strategy: "append", key: "id" } : null, S = D(v, []), d = n.data;
-      if (c && c.strategy === "append" && "key" in c && Array.isArray(S) && Array.isArray(d)) {
-        const h = c.key;
-        if (!h) {
+      const i = typeof n.merge == "object" ? n.merge : n.merge === !0 ? { strategy: "append", key: "id" } : null, f = D(v, []), d = n.data;
+      if (i && i.strategy === "append" && "key" in i && Array.isArray(f) && Array.isArray(d)) {
+        const m = i.key;
+        if (!m) {
           console.error(
             "CogsState: Merge strategy 'append' requires a 'key' field."
           );
           return;
         }
         const w = new Set(
-          S.map((b) => b[h])
+          f.map((I) => I[m])
         ), M = d.filter(
-          (b) => !w.has(b[h])
+          (I) => !w.has(I[m])
         );
         M.length > 0 && ve(v, [], M);
-        const E = D(v, []);
+        const A = D(v, []);
         te(
           v,
           [],
-          E,
+          A,
           n.timestamp || Date.now()
         );
       } else
@@ -519,7 +517,7 @@ function ot(e, {
           d,
           n.timestamp || Date.now()
         );
-      B(v);
+      L(v);
     }
   }), [v]), J(() => {
     const P = p.getState().getShadowMetadata(v, []);
@@ -528,126 +526,126 @@ function ot(e, {
     const r = N(v), n = {
       localStorageEnabled: !!r?.localStorage?.key
     };
-    if (L(v, [], {
+    if (B(v, [], {
       ...P,
       features: n
     }), r?.defaultState !== void 0 || u !== void 0) {
-      const h = r?.defaultState || u;
+      const m = r?.defaultState || u;
       r?.defaultState || se(v, {
-        defaultState: h
+        defaultState: m
       });
     }
-    const { value: c, source: S, timestamp: d } = G();
-    K(v, c), L(v, [], {
-      stateSource: S,
-      lastServerSync: S === "server" ? d : void 0,
-      isDirty: S === "server" ? !1 : void 0,
-      baseServerState: S === "server" ? c : void 0
-    }), S === "server" && o && ge(v, o), B(v);
+    const { value: i, source: f, timestamp: d } = G();
+    K(v, i), B(v, [], {
+      stateSource: f,
+      lastServerSync: f === "server" ? d : void 0,
+      isDirty: f === "server" ? !1 : void 0,
+      baseServerState: f === "server" ? i : void 0
+    }), f === "server" && o && ge(v, o), L(v);
   }, [v, ...t || []]), $e(() => {
-    I && se(v, {
+    b && se(v, {
       formElements: s,
       defaultState: u,
       localStorage: l,
       middleware: C.current?.middleware
     });
-    const P = `${v}////${F.current}`, r = A(v, []), n = r?.components || /* @__PURE__ */ new Map();
+    const P = `${v}////${F.current}`, r = E(v, []), n = r?.components || /* @__PURE__ */ new Map();
     return n.set(P, {
       forceUpdate: () => $({}),
-      reactiveType: i ?? ["component"],
+      reactiveType: c ?? ["component"],
       paths: /* @__PURE__ */ new Set(),
-      depsFunction: g || void 0,
-      deps: g ? g(D(v, [])) : [],
-      prevDeps: g ? g(D(v, [])) : []
-    }), L(v, [], {
+      depsFunction: S || void 0,
+      deps: S ? S(D(v, [])) : [],
+      prevDeps: S ? S(D(v, [])) : []
+    }), B(v, [], {
       ...r,
       components: n
     }), $({}), () => {
-      const c = A(v, []), S = c?.components?.get(P);
-      S?.paths && S.paths.forEach((d) => {
+      const i = E(v, []), f = i?.components?.get(P);
+      f?.paths && f.paths.forEach((d) => {
         const w = d.split(".").slice(1), M = p.getState().getShadowMetadata(v, w);
         M?.pathComponents && M.pathComponents.size === 0 && (delete M.pathComponents, p.getState().setShadowMetadata(v, w, M));
-      }), c?.components && L(v, [], c);
+      }), i?.components && B(v, [], i);
     };
   }, []);
-  const f = at(
+  const g = at(
     v,
     V,
     C
   );
   return p.getState().initialStateGlobal[v] || he(v, e), ye(() => we(
     v,
-    f,
+    g,
     F.current,
     V
   ), [v, V]);
 }
 const st = (e, a, l) => {
-  let s = A(e, a)?.arrayKeys || [];
-  const g = l?.transforms;
-  if (!g || g.length === 0)
+  let s = E(e, a)?.arrayKeys || [];
+  const S = l?.transforms;
+  if (!S || S.length === 0)
     return s;
-  for (const i of g)
-    if (i.type === "filter") {
-      const m = [];
+  for (const c of S)
+    if (c.type === "filter") {
+      const h = [];
       s.forEach((u, t) => {
         const o = D(e, [...a, u]);
-        i.fn(o, t) && m.push(u);
-      }), s = m;
-    } else i.type === "sort" && s.sort((m, u) => {
-      const t = D(e, [...a, m]), o = D(e, [...a, u]);
-      return i.fn(t, o);
+        c.fn(o, t) && h.push(u);
+      }), s = h;
+    } else c.type === "sort" && s.sort((h, u) => {
+      const t = D(e, [...a, h]), o = D(e, [...a, u]);
+      return c.fn(t, o);
     });
   return s;
 }, ie = (e, a, l) => {
-  const s = `${e}////${a}`, i = A(e, [])?.components?.get(s);
-  !i || i.reactiveType === "none" || !(Array.isArray(i.reactiveType) ? i.reactiveType : [i.reactiveType]).includes("component") || Fe(e, l, s);
-}, Q = (e, a, l) => {
-  const s = A(e, []), g = /* @__PURE__ */ new Set();
-  s?.components && s.components.forEach((m, u) => {
-    (Array.isArray(m.reactiveType) ? m.reactiveType : [m.reactiveType || "component"]).includes("all") && (m.forceUpdate(), g.add(u));
-  }), A(e, [
+  const s = `${e}////${a}`, c = E(e, [])?.components?.get(s);
+  !c || c.reactiveType === "none" || !(Array.isArray(c.reactiveType) ? c.reactiveType : [c.reactiveType]).includes("component") || Fe(e, l, s);
+}, Y = (e, a, l) => {
+  const s = E(e, []), S = /* @__PURE__ */ new Set();
+  s?.components && s.components.forEach((h, u) => {
+    (Array.isArray(h.reactiveType) ? h.reactiveType : [h.reactiveType || "component"]).includes("all") && (h.forceUpdate(), S.add(u));
+  }), E(e, [
     ...a,
     "getSelected"
-  ])?.pathComponents?.forEach((m) => {
-    s?.components?.get(m)?.forceUpdate();
+  ])?.pathComponents?.forEach((h) => {
+    s?.components?.get(h)?.forceUpdate();
   });
-  const i = A(e, a);
-  for (let m of i?.arrayKeys || []) {
-    const u = m + ".selected", t = A(e, u.split(".").slice(1));
-    m == l && t?.pathComponents?.forEach((o) => {
+  const c = E(e, a);
+  for (let h of c?.arrayKeys || []) {
+    const u = h + ".selected", t = E(e, u.split(".").slice(1));
+    h == l && t?.pathComponents?.forEach((o) => {
       s?.components?.get(o)?.forceUpdate();
     });
   }
 };
 function W(e, a, l) {
-  const s = A(e, a), g = a.length > 0 ? a.join(".") : "root", i = l?.arrayViews?.[g];
-  if (Array.isArray(i) && i.length === 0)
+  const s = E(e, a), S = a.length > 0 ? a.join(".") : "root", c = l?.arrayViews?.[S];
+  if (Array.isArray(c) && c.length === 0)
     return {
       shadowMeta: s,
       value: [],
       arrayKeys: s?.arrayKeys
     };
-  const m = D(e, a, i);
+  const h = D(e, a, c);
   return {
     shadowMeta: s,
-    value: m,
+    value: h,
     arrayKeys: s?.arrayKeys
   };
 }
 function we(e, a, l, s) {
-  const g = /* @__PURE__ */ new Map();
-  function i({
+  const S = /* @__PURE__ */ new Map();
+  function c({
     path: t = [],
     meta: o,
     componentId: y
   }) {
     const $ = o ? JSON.stringify(o.arrayViews || o.transforms) : "", V = t.join(".") + ":" + y + ":" + $;
-    if (g.has(V))
-      return g.get(V);
-    const I = [e, ...t].join("."), v = () => {
+    if (S.has(V))
+      return S.get(V);
+    const b = [e, ...t].join("."), v = () => {
     }, F = {
-      apply(G, f, H) {
+      apply(G, g, H) {
         if (H.length === 0) {
           const r = t.length > 0 ? t.join(".") : "root", n = o?.arrayViews?.[r];
           return D(e, t, n);
@@ -655,39 +653,39 @@ function we(e, a, l, s) {
         const P = H[0];
         return a(P, t, { updateType: "update" }), !0;
       },
-      get(G, f, H) {
-        if (f === "call" || f === "apply" || f === "bind")
-          return Reflect.get(G, f, H);
-        if (typeof f != "string")
-          return Reflect.get(G, f);
-        if (t.length === 0 && f in m)
-          return m[f];
-        if (typeof f == "string" && !f.startsWith("$")) {
-          const r = [...t, f];
-          return i({
+      get(G, g, H) {
+        if (g === "call" || g === "apply" || g === "bind")
+          return Reflect.get(G, g, H);
+        if (typeof g != "string")
+          return Reflect.get(G, g);
+        if (t.length === 0 && g in h)
+          return h[g];
+        if (typeof g == "string" && !g.startsWith("$")) {
+          const r = [...t, g];
+          return c({
             path: r,
             componentId: y,
             meta: o
           });
         }
-        if (f === "$_rebuildStateShape")
-          return i;
-        if (f === "$sync" && t.length === 0)
+        if (g === "$_rebuildStateShape")
+          return c;
+        if (g === "$sync" && t.length === 0)
           return async function() {
             const r = p.getState().getInitialOptions(e), n = r?.sync;
             if (!n)
               return console.error(`No mutation defined for state key "${e}"`), { success: !1, error: "No mutation defined" };
-            const c = p.getState().getShadowValue(e, []), S = r?.validation?.key;
+            const i = p.getState().getShadowValue(e, []), f = r?.validation?.key;
             try {
-              const d = await n.action(c);
+              const d = await n.action(i);
               if (d && !d.success && d.errors, d?.success) {
-                const h = p.getState().getShadowMetadata(e, []);
-                L(e, [], {
-                  ...h,
+                const m = p.getState().getShadowMetadata(e, []);
+                B(e, [], {
+                  ...m,
                   isDirty: !1,
                   lastServerSync: Date.now(),
                   stateSource: "server",
-                  baseServerState: c
+                  baseServerState: i
                   // Update base server state
                 }), n.onSuccess && n.onSuccess(d.data);
               } else !d?.success && n.onError && n.onError(d.error);
@@ -696,28 +694,28 @@ function we(e, a, l, s) {
               return n.onError && n.onError(d), { success: !1, error: d };
             }
           };
-        if (f === "$_status" || f === "$getStatus") {
+        if (g === "$_status" || g === "$getStatus") {
           const r = () => {
-            const { shadowMeta: n, value: c } = W(e, t, o);
-            return n?.isDirty === !0 ? "dirty" : n?.stateSource === "server" || n?.isDirty === !1 ? "synced" : n?.stateSource === "localStorage" ? "restored" : n?.stateSource === "default" || c !== void 0 ? "fresh" : "unknown";
+            const { shadowMeta: n, value: i } = W(e, t, o);
+            return n?.isDirty === !0 ? "dirty" : n?.stateSource === "server" || n?.isDirty === !1 ? "synced" : n?.stateSource === "localStorage" ? "restored" : n?.stateSource === "default" || i !== void 0 ? "fresh" : "unknown";
           };
-          return f === "$_status" ? r() : r;
+          return g === "$_status" ? r() : r;
         }
-        if (f === "$removeStorage")
+        if (g === "$removeStorage")
           return () => {
-            const r = p.getState().initialStateGlobal[e], n = N(e), c = R(n?.localStorage?.key) ? n.localStorage.key(r) : n?.localStorage?.key, S = `${s}-${e}-${c}`;
-            S && localStorage.removeItem(S);
+            const r = p.getState().initialStateGlobal[e], n = N(e), i = R(n?.localStorage?.key) ? n.localStorage.key(r) : n?.localStorage?.key, f = `${s}-${e}-${i}`;
+            f && localStorage.removeItem(f);
           };
-        if (f === "$validate")
+        if (g === "$validate")
           return () => {
-            const r = p.getState(), { value: n } = W(e, t, o), c = r.getInitialOptions(e), S = c?.validation?.zodSchemaV4 || c?.validation?.zodSchemaV3;
-            if (!S)
+            const r = p.getState(), { value: n } = W(e, t, o), i = r.getInitialOptions(e), f = i?.validation?.zodSchemaV4 || i?.validation?.zodSchemaV3;
+            if (!f)
               return { success: !0, data: n };
-            const d = S.safeParse(n);
+            const d = f.safeParse(n);
             if (d.success) {
-              const h = r.getShadowMetadata(e, t) || {};
+              const m = r.getShadowMetadata(e, t) || {};
               r.setShadowMetadata(e, t, {
-                ...h,
+                ...m,
                 validation: {
                   status: "VALID",
                   errors: [],
@@ -726,9 +724,9 @@ function we(e, a, l, s) {
               });
             } else
               (d.error?.issues || d.error?.errors || []).forEach((w) => {
-                const M = [...t, ...w.path.map(String)], E = r.getShadowMetadata(e, M) || {};
+                const M = [...t, ...w.path.map(String)], A = r.getShadowMetadata(e, M) || {};
                 r.setShadowMetadata(e, M, {
-                  ...E,
+                  ...A,
                   validation: {
                     status: "INVALID",
                     errors: [
@@ -744,14 +742,14 @@ function we(e, a, l, s) {
                   }
                 });
               });
-            return B(e), d;
+            return L(e), d;
           };
-        if (f === "$showValidationErrors")
+        if (g === "$showValidationErrors")
           return () => {
             const { shadowMeta: r } = W(e, t, o);
             return r?.validation?.status === "INVALID" && r.validation.errors.length > 0 ? r.validation.errors.filter((n) => n.severity === "error").map((n) => n.message) : [];
           };
-        if (f === "$getSelected")
+        if (g === "$getSelected")
           return () => {
             const r = [e, ...t].join(".");
             ie(e, y, [
@@ -761,78 +759,78 @@ function we(e, a, l, s) {
             const n = p.getState().selectedIndicesMap.get(r);
             if (!n)
               return;
-            const c = t.join("."), S = o?.arrayViews?.[c], d = n.split(".").pop();
-            if (!(S && !S.includes(d) || D(
+            const i = t.join("."), f = o?.arrayViews?.[i], d = n.split(".").pop();
+            if (!(f && !f.includes(d) || D(
               e,
               n.split(".").slice(1)
             ) === void 0))
-              return i({
+              return c({
                 path: n.split(".").slice(1),
                 componentId: y,
                 meta: o
               });
           };
-        if (f === "$getSelectedIndex")
+        if (g === "$getSelectedIndex")
           return () => {
             const r = e + "." + t.join(".");
             t.join(".");
             const n = p.getState().selectedIndicesMap.get(r);
             if (!n)
               return -1;
-            const { keys: c } = j(e, t, o);
-            if (!c)
+            const { keys: i } = U(e, t, o);
+            if (!i)
               return -1;
-            const S = n.split(".").pop();
-            return c.indexOf(S);
+            const f = n.split(".").pop();
+            return i.indexOf(f);
           };
-        if (f === "$clearSelected")
-          return Q(e, t), () => {
+        if (g === "$clearSelected")
+          return Y(e, t), () => {
             Le({
               arrayKey: e + "." + t.join(".")
             });
           };
-        if (f === "$map")
+        if (g === "$map")
           return (r) => {
-            const { value: n, keys: c } = j(
+            const { value: n, keys: i } = U(
               e,
               t,
               o
             );
-            if (ie(e, y, t), !c || !Array.isArray(n))
+            if (ie(e, y, t), !i || !Array.isArray(n))
               return [];
-            const S = i({
+            const f = c({
               path: t,
               componentId: y,
               meta: o
             });
-            return n.map((d, h) => {
-              const w = c[h];
+            return n.map((d, m) => {
+              const w = i[m];
               if (!w) return;
-              const M = [...t, w], E = i({
+              const M = [...t, w], A = c({
                 path: M,
                 // This now correctly points to the item in the shadow store.
                 componentId: y,
                 meta: o
               });
-              return r(E, h, S);
+              return r(A, m, f);
             });
           };
-        if (f === "$filter")
+        if (g === "$filter")
           return (r) => {
-            const n = t.length > 0 ? t.join(".") : "root", { keys: c, value: S } = j(
+            const n = t.length > 0 ? t.join(".") : "root", { keys: i, value: f } = U(
               e,
               t,
               o
             );
-            if (!Array.isArray(S))
+            if (!Array.isArray(f))
               throw new Error("filter can only be used on arrays");
             const d = [];
-            return S.forEach((h, w) => {
-              if (r(h, w)) {
-                const M = c[w];
+            return f.forEach((m, w) => {
+              if (r(m, w)) {
+                const M = i[w];
                 M && d.push(M);
               }
-            }), i({
+            }), c({
               path: t,
               componentId: y,
               meta: {
@@ -848,29 +846,29 @@ function we(e, a, l, s) {
               }
             });
           };
-        if (f === "$sort")
+        if (g === "$sort")
           return (r) => {
-            const n = t.length > 0 ? t.join(".") : "root", { value: c, keys: S } = j(
+            const n = t.length > 0 ? t.join(".") : "root", { value: i, keys: f } = U(
               e,
               t,
               o
             );
-            if (!Array.isArray(c) || !S)
+            if (!Array.isArray(i) || !f)
               throw new Error("No array keys found for sorting");
-            const d = c.map((w, M) => ({
+            const d = i.map((w, M) => ({
               item: w,
-              key: S[M]
+              key: f[M]
             }));
             d.sort((w, M) => r(w.item, M.item));
-            const h = d.map((w) => w.key);
-            return i({
+            const m = d.map((w) => w.key);
+            return c({
               path: t,
               componentId: y,
               meta: {
                 ...o,
                 arrayViews: {
                   ...o?.arrayViews || {},
-                  [n]: h
+                  [n]: m
                 },
                 transforms: [
                   ...o?.transforms || [],
@@ -879,21 +877,21 @@ function we(e, a, l, s) {
               }
             });
           };
-        if (f === "$stream")
+        if (g === "$stream")
           return function(r = {}) {
             const {
               bufferSize: n = 100,
-              flushInterval: c = 100,
-              bufferStrategy: S = "accumulate",
+              flushInterval: i = 100,
+              bufferStrategy: f = "accumulate",
               store: d,
-              onFlush: h
+              onFlush: m
             } = r;
-            let w = [], M = !1, E = null;
-            const b = (T) => {
+            let w = [], M = !1, A = null;
+            const I = (T) => {
               if (!M) {
-                if (S === "sliding" && w.length >= n)
+                if (f === "sliding" && w.length >= n)
                   w.shift();
-                else if (S === "dropping" && w.length >= n)
+                else if (f === "dropping" && w.length >= n)
                   return;
                 w.push(T), w.length >= n && k();
               }
@@ -901,28 +899,28 @@ function we(e, a, l, s) {
               if (w.length === 0) return;
               const T = [...w];
               if (w = [], d) {
-                const U = d(T);
-                U !== void 0 && (Array.isArray(U) ? U : [U]).forEach((pe) => {
+                const j = d(T);
+                j !== void 0 && (Array.isArray(j) ? j : [j]).forEach((pe) => {
                   a(pe, t, {
                     updateType: "insert"
                   });
                 });
               } else
-                T.forEach((U) => {
-                  a(U, t, {
+                T.forEach((j) => {
+                  a(j, t, {
                     updateType: "insert"
                   });
                 });
-              h?.(T);
+              m?.(T);
             };
-            c > 0 && (E = setInterval(k, c));
-            const O = X(), _ = A(e, t) || {}, z = _.streams || /* @__PURE__ */ new Map();
-            return z.set(O, { buffer: w, flushTimer: E }), L(e, t, {
+            i > 0 && (A = setInterval(k, i));
+            const O = X(), _ = E(e, t) || {}, z = _.streams || /* @__PURE__ */ new Map();
+            return z.set(O, { buffer: w, flushTimer: A }), B(e, t, {
               ..._,
               streams: z
             }), {
-              write: (T) => b(T),
-              writeMany: (T) => T.forEach(b),
+              write: (T) => I(T),
+              writeMany: (T) => T.forEach(I),
               flush: () => k(),
               pause: () => {
                 M = !0;
@@ -931,301 +929,325 @@ function we(e, a, l, s) {
                 M = !1, w.length > 0 && k();
               },
               close: () => {
-                k(), E && clearInterval(E);
+                k(), A && clearInterval(A);
                 const T = p.getState().getShadowMetadata(e, t);
                 T?.streams && T.streams.delete(O);
               }
             };
           };
-        if (f === "$list")
-          return (r) => /* @__PURE__ */ Z(() => {
-            const c = q(/* @__PURE__ */ new Map()), [S, d] = ee({}), h = t.length > 0 ? t.join(".") : "root", w = st(e, t, o), M = ye(() => ({
+        if (g === "$list")
+          return (r) => /* @__PURE__ */ Q(() => {
+            const i = x(/* @__PURE__ */ new Map()), [f, d] = ee({}), m = t.length > 0 ? t.join(".") : "root", w = st(e, t, o), M = ye(() => ({
               ...o,
               arrayViews: {
                 ...o?.arrayViews || {},
-                [h]: w
+                [m]: w
               }
-            }), [o, h, w]), { value: E } = j(
+            }), [o, m, w]), { value: A } = U(
               e,
               t,
               M
             );
             if (J(() => {
-              const O = p.getState().subscribeToPath(I, (_) => {
+              const O = p.getState().subscribeToPath(b, (_) => {
                 if (_.type === "GET_SELECTED")
                   return;
                 const T = p.getState().getShadowMetadata(e, t)?.transformCaches;
                 if (T)
-                  for (const U of T.keys())
-                    U.startsWith(y) && T.delete(U);
+                  for (const j of T.keys())
+                    j.startsWith(y) && T.delete(j);
                 (_.type === "INSERT" || _.type === "INSERT_MANY" || _.type === "REMOVE" || _.type === "CLEAR_SELECTION" || _.type === "SERVER_STATE_UPDATE" && !o?.serverStateIsUpStream) && d({});
               });
               return () => {
                 O();
               };
-            }, [y, I]), !Array.isArray(E))
+            }, [y, b]), !Array.isArray(A))
               return null;
-            const b = i({
+            const I = c({
               path: t,
               componentId: y,
               meta: M
               // Use updated meta here
-            }), k = E.map((O, _) => {
+            }), k = A.map((O, _) => {
               const z = w[_];
               if (!z)
                 return null;
-              let T = c.current.get(z);
-              T || (T = X(), c.current.set(z, T));
-              const U = [...t, z];
+              let T = i.current.get(z);
+              T || (T = X(), i.current.set(z, T));
+              const j = [...t, z];
               return ue(De, {
                 key: z,
                 stateKey: e,
                 itemComponentId: T,
-                itemPath: U,
+                itemPath: j,
                 localIndex: _,
-                arraySetter: b,
-                rebuildStateShape: i,
+                arraySetter: I,
+                rebuildStateShape: c,
                 renderFn: r
               });
             });
-            return /* @__PURE__ */ Z(Me, { children: k });
+            return /* @__PURE__ */ Q(Me, { children: k });
           }, {});
-        if (f === "$stateFlattenOn")
+        if (g === "$stateFlattenOn")
           return (r) => {
-            const n = t.length > 0 ? t.join(".") : "root", c = o?.arrayViews?.[n], S = p.getState().getShadowValue(e, t, c);
-            return Array.isArray(S) ? i({
+            const n = t.length > 0 ? t.join(".") : "root", i = o?.arrayViews?.[n], f = p.getState().getShadowValue(e, t, i);
+            return Array.isArray(f) ? c({
               path: [...t, "[*]", r],
               componentId: y,
               meta: o
             }) : [];
           };
-        if (f === "$index")
+        if (g === "$index")
           return (r) => {
-            const n = t.length > 0 ? t.join(".") : "root", c = o?.arrayViews?.[n];
-            if (c) {
-              const h = c[r];
-              return h ? i({
-                path: [...t, h],
+            const n = t.length > 0 ? t.join(".") : "root", i = o?.arrayViews?.[n];
+            if (i) {
+              const m = i[r];
+              return m ? c({
+                path: [...t, m],
                 componentId: y,
                 meta: o
               }) : void 0;
             }
-            const S = A(e, t);
-            if (!S?.arrayKeys) return;
-            const d = S.arrayKeys[r];
+            const f = E(e, t);
+            if (!f?.arrayKeys) return;
+            const d = f.arrayKeys[r];
             if (d)
-              return i({
+              return c({
                 path: [...t, d],
                 componentId: y,
                 meta: o
               });
           };
-        if (f === "$last")
+        if (g === "$last")
           return () => {
-            const { keys: r } = j(e, t, o);
+            const { keys: r } = U(e, t, o);
             if (!r || r.length === 0)
               return;
             const n = r[r.length - 1];
             if (!n)
               return;
-            const c = [...t, n];
-            return i({
-              path: c,
+            const i = [...t, n];
+            return c({
+              path: i,
               componentId: y,
               meta: o
             });
           };
-        if (f === "$insert")
+        if (g === "$insert")
           return (r, n) => {
             a(r, t, {
               updateType: "insert",
               index: n
             });
           };
-        if (f === "$insertMany")
+        if (g === "$insertMany")
           return (r) => {
             a(r, t, {
               updateType: "insert_many"
             });
           };
-        if (f === "$uniqueInsert")
-          return (r, n, c) => {
-            const { value: S } = W(
+        if (g === "$uniqueInsert")
+          return (r, n, i) => {
+            const { value: f } = W(
               e,
               t,
               o
-            ), d = R(r) ? r(S) : r;
-            let h = null;
-            if (!S.some((M) => {
-              const E = n ? n.every(
-                (b) => Y(M[b], d[b])
-              ) : Y(M, d);
-              return E && (h = M), E;
+            ), d = R(r) ? r(f) : r;
+            let m = null;
+            if (!f.some((M) => {
+              const A = n ? n.every(
+                (I) => Z(M[I], d[I])
+              ) : Z(M, d);
+              return A && (m = M), A;
             }))
               a(d, t, { updateType: "insert" });
-            else if (c && h) {
-              const M = c(h), E = S.map(
-                (b) => Y(b, h) ? M : b
+            else if (i && m) {
+              const M = i(m), A = f.map(
+                (I) => Z(I, m) ? M : I
               );
-              a(E, t, {
+              a(A, t, {
                 updateType: "update"
               });
             }
           };
-        if (f === "$cut")
+        if (g === "$cut")
           return (r, n) => {
-            const c = A(e, t);
-            if (console.log("shadowMeta ->>>>>>>>>>>>>>>>", c), !c?.arrayKeys || c.arrayKeys.length === 0)
+            const i = E(e, t);
+            if (!i?.arrayKeys || i.arrayKeys.length === 0)
               return;
-            const S = r === -1 ? c.arrayKeys.length - 1 : r !== void 0 ? r : c.arrayKeys.length - 1;
-            console.log("indexToCut ->>>>>>>>>>>>>>>>", S);
-            const d = c.arrayKeys[S];
-            d && (console.log("idToCut ->>>>>>>>>>>>>>>>", d), a(null, [...t, d], {
+            const f = r === -1 ? i.arrayKeys.length - 1 : r !== void 0 ? r : i.arrayKeys.length - 1, d = i.arrayKeys[f];
+            d && a(null, [...t, d], {
               updateType: "cut"
-            }));
+            });
           };
-        if (f === "$cutSelected")
+        if (g === "$cutSelected")
           return () => {
-            const r = [e, ...t].join("."), { keys: n } = j(e, t, o);
+            const r = [e, ...t].join("."), { keys: n } = U(e, t, o);
             if (!n || n.length === 0)
               return;
-            const c = p.getState().selectedIndicesMap.get(r);
-            if (!c)
+            const i = p.getState().selectedIndicesMap.get(r);
+            if (!i)
               return;
-            const S = c.split(".").pop();
-            if (!n.includes(S))
+            const f = i.split(".").pop();
+            if (!n.includes(f))
               return;
-            const d = c.split(".").slice(1);
+            const d = i.split(".").slice(1);
             p.getState().clearSelectedIndex({ arrayKey: r });
-            const h = d.slice(0, -1);
-            Q(e, h), a(null, d, {
+            const m = d.slice(0, -1);
+            Y(e, m), a(null, d, {
               updateType: "cut"
             });
           };
-        if (f === "$cutByValue")
+        if (g === "$cutByValue")
           return (r) => {
             const {
               isArray: n,
-              value: c,
-              keys: S
-            } = j(e, t, o);
+              value: i,
+              keys: f
+            } = U(e, t, o);
             if (!n) return;
-            const d = oe(c, S, (h) => h === r);
+            const d = oe(i, f, (m) => m === r);
             d && a(null, [...t, d.key], {
               updateType: "cut"
             });
           };
-        if (f === "$toggleByValue")
+        if (g === "$toggleByValue")
           return (r) => {
             const {
               isArray: n,
-              value: c,
-              keys: S
-            } = j(e, t, o);
+              value: i,
+              keys: f
+            } = U(e, t, o);
             if (!n) return;
-            const d = oe(c, S, (h) => h === r);
+            const d = oe(i, f, (m) => m === r);
             if (d) {
-              const h = [...t, d.key];
-              a(null, h, {
+              const m = [...t, d.key];
+              a(null, m, {
                 updateType: "cut"
               });
             } else
               a(r, t, { updateType: "insert" });
           };
-        if (f === "$findWith")
+        if (g === "$findWith")
           return (r, n) => {
-            const { isArray: c, value: S, keys: d } = j(e, t, o);
-            if (!c)
+            const { isArray: i, value: f, keys: d } = U(e, t, o);
+            if (!i)
               throw new Error("findWith can only be used on arrays");
-            const h = oe(
-              S,
+            const m = oe(
+              f,
               d,
               (w) => w?.[r] === n
             );
-            return h ? i({
-              path: [...t, h.key],
+            return m ? c({
+              path: [...t, m.key],
               componentId: y,
               meta: o
             }) : null;
           };
-        if (f === "$cutThis") {
+        if (g === "$cutThis") {
           const { value: r } = W(e, t, o), n = t.slice(0, -1);
-          return Q(e, n), () => {
+          return Y(e, n), () => {
             a(r, t, { updateType: "cut" });
           };
         }
-        if (f === "$get")
+        if (g === "$get")
           return () => {
             ie(e, y, t);
             const { value: r } = W(e, t, o);
             return r;
           };
-        if (f === "$$derive")
+        if (g === "$$derive")
           return (r) => Se({
             _stateKey: e,
             _path: t,
             _effect: r.toString(),
             _meta: o
           });
-        if (f === "$$get")
+        if (g === "$$get")
           return () => Se({ _stateKey: e, _path: t, _meta: o });
-        if (f === "$lastSynced") {
+        if (g === "$lastSynced") {
           const r = `${e}:${t.join(".")}`;
           return We(r);
         }
-        if (f == "getLocalStorage")
+        if (g == "getLocalStorage")
           return (r) => ae(s + "-" + e + "-" + r);
-        if (f === "$isSelected") {
+        if (g === "$isSelected") {
           const r = t.slice(0, -1);
-          if (A(e, r)?.arrayKeys) {
-            const c = e + "." + r.join("."), S = p.getState().selectedIndicesMap.get(c), d = e + "." + t.join(".");
-            return S === d;
+          if (E(e, r)?.arrayKeys) {
+            const i = e + "." + r.join("."), f = p.getState().selectedIndicesMap.get(i), d = e + "." + t.join(".");
+            return f === d;
           }
           return;
         }
-        if (f === "$setSelected")
+        if (g === "$setSelected")
           return (r) => {
-            const n = t.slice(0, -1), c = e + "." + n.join("."), S = e + "." + t.join(".");
-            Q(e, n, void 0), p.getState().selectedIndicesMap.get(c), r && p.getState().setSelectedIndex(c, S);
+            const n = t.slice(0, -1), i = e + "." + n.join("."), f = e + "." + t.join(".");
+            Y(e, n, void 0), p.getState().selectedIndicesMap.get(i), r && p.getState().setSelectedIndex(i, f);
           };
-        if (f === "$toggleSelected")
+        if (g === "$toggleSelected")
           return () => {
-            const r = t.slice(0, -1), n = e + "." + r.join("."), c = e + "." + t.join(".");
-            p.getState().selectedIndicesMap.get(n) === c ? p.getState().clearSelectedIndex({ arrayKey: n }) : p.getState().setSelectedIndex(n, c), Q(e, r);
+            const r = t.slice(0, -1), n = e + "." + r.join("."), i = e + "." + t.join(".");
+            p.getState().selectedIndicesMap.get(n) === i ? p.getState().clearSelectedIndex({ arrayKey: n }) : p.getState().setSelectedIndex(n, i), Y(e, r);
+          };
+        if (g === "$clearValidation")
+          return (r) => {
+            const n = r ? [...t, ...r] : t, i = p.getState(), f = i.getShadowNode(e, n);
+            if (console.log("startNode ", f), !f) return;
+            const d = [[f, n]];
+            for (console.log("stack ", d); d.length > 0; ) {
+              const [m, w] = d.pop();
+              if (console.log("while (stack.length ", m, w), !m || typeof m != "object") continue;
+              if (m._meta?.validation) {
+                m._meta.validation = {
+                  status: "NOT_VALIDATED",
+                  errors: [],
+                  lastValidated: Date.now(),
+                  validatedValue: void 0
+                };
+                const A = [e, ...w].join(".");
+                i.notifyPathSubscribers(A, {
+                  type: "VALIDATION_CLEAR"
+                });
+              }
+              const M = Object.keys(m);
+              for (const A of M)
+                A !== "_meta" && d.push([m[A], [...w, A]]);
+            }
+            L(e);
           };
-        if (f === "$_componentId")
-          return y;
         if (t.length == 0) {
-          if (f === "$setOptions")
+          if (g === "$_componentId")
+            return y;
+          if (g === "$setOptions")
             return (r) => {
               ce({ stateKey: e, options: r, initialOptionsPart: {} });
             };
-          if (f === "$_applyUpdate")
-            return (r, n, c = "update") => {
-              a(r, n, { updateType: c });
+          if (g === "$_applyUpdate")
+            return (r, n, i = "update") => {
+              a(r, n, { updateType: i });
             };
-          if (f === "$_getEffectiveSetState")
+          if (g === "$_getEffectiveSetState")
             return a;
-          if (f === "$getPluginMetaData")
+          if (g === "$getPluginMetaData")
             return (r) => Ge(e, t)?.get(r);
-          if (f === "$addPluginMetaData")
-            return console.log("$addPluginMetaDat"), (r, n) => xe(e, t, r, n);
-          if (f === "$removePluginMetaData")
-            return (r) => qe(e, t, r);
-          if (f === "$addZodValidation")
+          if (g === "$addPluginMetaData")
+            return (r, n) => qe(e, t, r, n);
+          if (g === "$removePluginMetaData")
+            return (r) => xe(e, t, r);
+          if (g === "$addZodValidation")
             return (r, n) => {
-              r.forEach((c) => {
-                const S = p.getState().getShadowMetadata(e, c.path) || {};
-                p.getState().setShadowMetadata(e, c.path, {
-                  ...S,
+              r.forEach((i) => {
+                const f = p.getState().getShadowMetadata(e, i.path) || {};
+                p.getState().setShadowMetadata(e, i.path, {
+                  ...f,
                   validation: {
                     status: "INVALID",
                     errors: [
                       {
                         source: n || "client",
-                        message: c.message,
+                        message: i.message,
                         severity: "error",
-                        code: c.code
+                        code: i.code
                       }
                     ],
                     lastValidated: Date.now(),
@@ -1234,103 +1256,85 @@ function we(e, a, l, s) {
                 });
               });
             };
-          if (f === "$clearZodValidation")
-            return (r) => {
-              if (!r)
-                throw new Error("clearZodValidation requires a path");
-              const n = A(e, r) || {};
-              L(e, r, {
-                ...n,
-                validation: {
-                  status: "NOT_VALIDATED",
-                  errors: [],
-                  lastValidated: Date.now()
-                }
-              });
-            };
-          if (f === "$applyOperation")
+          if (g === "$applyOperation")
             return (r, n) => {
-              console.log(
-                "getGlobalStore",
-                p.getState().getShadowMetadata(e, r.path)
-              );
-              let c;
+              let i;
               if (r.insertAfterId && r.updateType === "insert") {
-                const S = A(e, r.path);
-                if (S?.arrayKeys) {
-                  const d = S.arrayKeys.indexOf(
+                const f = E(e, r.path);
+                if (f?.arrayKeys) {
+                  const d = f.arrayKeys.indexOf(
                     r.insertAfterId
                   );
-                  d !== -1 && (c = d + 1);
+                  d !== -1 && (i = d + 1);
                 }
               }
               a(r.newValue, r.path, {
                 updateType: r.updateType,
                 itemId: r.itemId,
-                index: c,
+                index: i,
                 // Pass the calculated index
                 metaData: n
               });
             };
-          if (f === "$applyJsonPatch")
+          if (g === "$applyJsonPatch")
             return (r) => {
-              const n = p.getState(), c = n.getShadowMetadata(e, []);
-              if (!c?.components) return;
-              const S = (h) => !h || h === "/" ? [] : h.split("/").slice(1).map((w) => w.replace(/~1/g, "/").replace(/~0/g, "~")), d = /* @__PURE__ */ new Set();
-              for (const h of r) {
-                const w = S(h.path);
-                switch (h.op) {
+              const n = p.getState(), i = n.getShadowMetadata(e, []);
+              if (!i?.components) return;
+              const f = (m) => !m || m === "/" ? [] : m.split("/").slice(1).map((w) => w.replace(/~1/g, "/").replace(/~0/g, "~")), d = /* @__PURE__ */ new Set();
+              for (const m of r) {
+                const w = f(m.path);
+                switch (m.op) {
                   case "add":
                   case "replace": {
-                    const { value: M } = h;
+                    const { value: M } = m;
                     n.updateShadowAtPath(e, w, M), n.markAsDirty(e, w, { bubble: !0 });
-                    let E = [...w];
+                    let A = [...w];
                     for (; ; ) {
-                      const b = n.getShadowMetadata(
+                      const I = n.getShadowMetadata(
                         e,
-                        E
+                        A
                       );
-                      if (b?.pathComponents && b.pathComponents.forEach((k) => {
+                      if (I?.pathComponents && I.pathComponents.forEach((k) => {
                         if (!d.has(k)) {
-                          const O = c.components?.get(k);
+                          const O = i.components?.get(k);
                           O && (O.forceUpdate(), d.add(k));
                         }
-                      }), E.length === 0) break;
-                      E.pop();
+                      }), A.length === 0) break;
+                      A.pop();
                     }
                     break;
                   }
                   case "remove": {
                     const M = w.slice(0, -1);
                     n.removeShadowArrayElement(e, w), n.markAsDirty(e, M, { bubble: !0 });
-                    let E = [...M];
+                    let A = [...M];
                     for (; ; ) {
-                      const b = n.getShadowMetadata(
+                      const I = n.getShadowMetadata(
                         e,
-                        E
+                        A
                       );
-                      if (b?.pathComponents && b.pathComponents.forEach((k) => {
+                      if (I?.pathComponents && I.pathComponents.forEach((k) => {
                         if (!d.has(k)) {
-                          const O = c.components?.get(k);
+                          const O = i.components?.get(k);
                           O && (O.forceUpdate(), d.add(k));
                         }
-                      }), E.length === 0) break;
-                      E.pop();
+                      }), A.length === 0) break;
+                      A.pop();
                     }
                     break;
                   }
                 }
               }
             };
-          if (f === "$getComponents")
-            return () => A(e, [])?.components;
+          if (g === "$getComponents")
+            return () => E(e, [])?.components;
         }
-        if (f === "$validationWrapper")
+        if (g === "$validationWrapper")
           return ({
             children: r,
             hideMessage: n
-          }) => /* @__PURE__ */ Z(
-            be,
+          }) => /* @__PURE__ */ Q(
+            Ie,
             {
               formOpts: n ? { validation: { message: "" } } : void 0,
               path: t,
@@ -1338,26 +1342,26 @@ function we(e, a, l, s) {
               children: r
             }
           );
-        if (f === "$_stateKey") return e;
-        if (f === "$_path") return t;
-        if (f === "$update")
+        if (g === "$_stateKey") return e;
+        if (g === "$_path") return t;
+        if (g === "$update")
           return (r) => (a(r, t, { updateType: "update" }), {
             synced: () => {
               const n = p.getState().getShadowMetadata(e, t);
-              L(e, t, {
+              B(e, t, {
                 ...n,
                 isDirty: !1,
                 stateSource: "server",
                 lastServerSync: Date.now()
               });
-              const c = [e, ...t].join(".");
-              Be(c, {
+              const i = [e, ...t].join(".");
+              Be(i, {
                 type: "SYNC_STATUS_CHANGE",
                 isDirty: !1
               });
             }
           });
-        if (f === "$toggle") {
+        if (g === "$toggle") {
           const { value: r } = W(
             e,
             t,
@@ -1371,51 +1375,59 @@ function we(e, a, l, s) {
             });
           };
         }
-        if (f === "$isolate")
-          return (r) => /* @__PURE__ */ Z(
-            Pe,
-            {
-              stateKey: e,
-              path: t,
-              rebuildStateShape: i,
-              renderFn: r
-            }
-          );
-        if (f === "$formElement")
-          return (r, n) => /* @__PURE__ */ Z(
+        if (g === "$isolate")
+          return (r, n) => {
+            const i = Array.isArray(r), f = i ? r : void 0, d = i ? n : r;
+            if (!d || typeof d != "function")
+              throw new Error(
+                "CogsState: $isolate requires a render function."
+              );
+            return /* @__PURE__ */ Q(
+              Pe,
+              {
+                stateKey: e,
+                path: t,
+                dependencies: f,
+                rebuildStateShape: c,
+                renderFn: d
+              }
+            );
+          };
+        if (g === "$formElement")
+          return (r, n) => /* @__PURE__ */ Q(
             ke,
             {
               stateKey: e,
               path: t,
-              rebuildStateShape: i,
+              rebuildStateShape: c,
               setState: a,
               formOpts: n,
               renderFn: r
             }
           );
-        const P = [...t, f];
-        return i({
+        const P = [...t, g];
+        return c({
           path: P,
           componentId: y,
           meta: o
         });
       }
     }, C = new Proxy(v, F);
-    return g.set(V, C), C;
+    return S.set(V, C), C;
   }
-  const m = {
+  const h = {
     $revertToInitialState: (t) => {
       const o = p.getState().getShadowMetadata(e, []);
       let y;
-      o?.stateSource === "server" && o.baseServerState ? y = o.baseServerState : y = p.getState().initialStateGlobal[e], ze(e), K(e, y), i({
+      o?.stateSource === "server" && o.baseServerState ? y = o.baseServerState : y = p.getState().initialStateGlobal[e], ze(e), K(e, y), c({
         path: [],
         componentId: l
       });
-      const $ = N(e), V = R($?.localStorage?.key) ? $?.localStorage?.key(y) : $?.localStorage?.key, I = `${s}-${e}-${V}`;
-      return I && localStorage.removeItem(I), B(e), y;
+      const $ = N(e), V = R($?.localStorage?.key) ? $?.localStorage?.key(y) : $?.localStorage?.key, b = `${s}-${e}-${V}`;
+      return b && localStorage.removeItem(b), L(e), y;
     },
     $initializeAndMergeShadowState: (t) => {
-      Oe(e, t), B(e);
+      Oe(e, t), L(e);
     },
     $updateInitialState: (t) => {
       const o = we(
@@ -1423,8 +1435,8 @@ function we(e, a, l, s) {
         a,
         l,
         s
-      ), y = p.getState().initialStateGlobal[e], $ = N(e), V = R($?.localStorage?.key) ? $?.localStorage?.key(y) : $?.localStorage?.key, I = `${s}-${e}-${V}`;
-      return localStorage.getItem(I) && localStorage.removeItem(I), Ee(() => {
+      ), y = p.getState().initialStateGlobal[e], $ = N(e), V = R($?.localStorage?.key) ? $?.localStorage?.key(y) : $?.localStorage?.key, b = `${s}-${e}-${V}`;
+      return localStorage.getItem(b) && localStorage.removeItem(b), Ee(() => {
         he(e, t), K(e, t);
         const v = p.getState().getShadowMetadata(e, []);
         v && v?.components?.forEach((F) => {
@@ -1435,7 +1447,7 @@ function we(e, a, l, s) {
       };
     }
   };
-  return i({
+  return c({
     componentId: l,
     path: []
   });
@@ -1446,22 +1458,22 @@ function Se(e) {
 function it({
   proxy: e
 }) {
-  const a = q(null), l = q(null), s = q(!1), g = `${e._stateKey}-${e._path.join(".")}`, i = e._path.length > 0 ? e._path.join(".") : "root", m = e._meta?.arrayViews?.[i], u = D(e._stateKey, e._path, m);
+  const a = x(null), l = x(null), s = x(!1), S = `${e._stateKey}-${e._path.join(".")}`, c = e._path.length > 0 ? e._path.join(".") : "root", h = e._meta?.arrayViews?.[c], u = D(e._stateKey, e._path, h);
   return J(() => {
     const t = a.current;
     if (!t || s.current) return;
     const o = setTimeout(() => {
       if (!t.parentElement) {
-        console.warn("Parent element not found for signal", g);
+        console.warn("Parent element not found for signal", S);
         return;
       }
       const y = t.parentElement, V = Array.from(y.childNodes).indexOf(t);
-      let I = y.getAttribute("data-parent-id");
-      I || (I = `parent-${crypto.randomUUID()}`, y.setAttribute("data-parent-id", I)), l.current = `instance-${crypto.randomUUID()}`;
+      let b = y.getAttribute("data-parent-id");
+      b || (b = `parent-${crypto.randomUUID()}`, y.setAttribute("data-parent-id", b)), l.current = `instance-${crypto.randomUUID()}`;
       const v = p.getState().getShadowMetadata(e._stateKey, e._path) || {}, F = v.signals || [];
       F.push({
         instanceId: l.current,
-        parentId: I,
+        parentId: b,
         position: V,
         effect: e._effect
       }), p.getState().setShadowMetadata(e._stateKey, e._path, {
@@ -1475,8 +1487,8 @@ function it({
             "state",
             `return (${e._effect})(state)`
           )(u);
-        } catch (f) {
-          console.error("Error evaluating effect function:", f);
+        } catch (g) {
+          console.error("Error evaluating effect function:", g);
         }
       C !== null && typeof C == "object" && (C = JSON.stringify(C));
       const G = document.createTextNode(String(C ?? ""));
@@ -1493,13 +1505,13 @@ function it({
   }, []), ue("span", {
     ref: a,
     style: { display: "contents" },
-    "data-signal-id": g
+    "data-signal-id": S
   });
 }
 export {
   Se as $cogsSignal,
-  pt as addStateOptions,
-  Mt as createCogsState,
+  wt as addStateOptions,
+  pt as createCogsState,
   ot as useCogsStateFn
 };
 //# sourceMappingURL=CogsState.jsx.map