cogsbox-state 0.5.464 → 0.5.466

package/dist/CogsState.jsx

@@ -1,870 +1,916 @@
 "use client";
-import { jsx as rt, Fragment as kt } from "react/jsx-runtime";
-import { memo as Dt, useState as X, useRef as q, useCallback as ot, useEffect as Z, useLayoutEffect as lt, useMemo as dt, createElement as st, startTransition as Ot } from "react";
-import { createRoot as bt } from "react-dom/client";
-import { transformStateFunc as Rt, isFunction as K, isArray as wt, getDifferences as Et, isDeepEqual as nt } from "./utility.js";
-import { ValidationWrapper as Vt } from "./Functions.jsx";
-import Ut from "superjson";
-import { v4 as tt } from "uuid";
-import { getGlobalStore as a, formRefStore as ht } from "./store.js";
-import { useCogsConfig as At } from "./CogsStateClient.jsx";
-import { useInView as $t } from "react-intersection-observer";
-function St(t, r) {
-  const y = a.getState().getInitialOptions, m = a.getState().setInitialStateOptions, v = y(t) || {};
-  m(t, {
-    ...v,
+import { jsx as ie, Fragment as Ce } from "react/jsx-runtime";
+import { useState as K, useRef as L, useEffect as W, useCallback as we, useLayoutEffect as ce, useMemo as le, createElement as Ie, startTransition as De } from "react";
+import { transformStateFunc as Ue, isFunction as z, isDeepEqual as ae, isArray as Fe, getDifferences as $e } from "./utility.js";
+import { ValidationWrapper as je, FormElementWrapper as Oe, MemoizedCogsItemWrapper as Ne } from "./Components.jsx";
+import xe from "superjson";
+import { v4 as X } from "uuid";
+import { getGlobalStore as T, formRefStore as Ee } from "./store.js";
+import { useCogsConfig as Ve } from "./CogsStateClient.jsx";
+const {
+  getInitialOptions: G,
+  updateInitialStateGlobal: ke,
+  // ALIAS THE NEW FUNCTIONS TO THE OLD NAMES
+  getShadowMetadata: V,
+  setShadowMetadata: J,
+  getShadowValue: R,
+  initializeShadowState: oe,
+  updateShadowAtPath: Re,
+  insertShadowArrayElement: Le,
+  insertManyShadowArrayElements: qe,
+  removeShadowArrayElement: Be,
+  getSelectedIndex: Tt,
+  setInitialStateOptions: ue,
+  setServerStateUpdate: We,
+  markAsDirty: de,
+  registerComponent: It,
+  unregisterComponent: bt,
+  addPathComponent: Ge,
+  clearSelectedIndexesForState: He,
+  addStateLog: ze,
+  setSyncInfo: Je,
+  clearSelectedIndex: Ze,
+  getSyncInfo: Ye,
+  notifyPathSubscribers: Qe,
+  subscribeToPath: Et
+  // Note: The old functions are no longer imported under their original names
+} = T.getState();
+function B(e, r, l) {
+  const a = V(e, r);
+  if (!!!a?.arrayKeys)
+    return { isArray: !1, value: T.getState().getShadowValue(e, r), keys: [] };
+  const s = r.length > 0 ? r.join(".") : "root", c = l?.arrayViews?.[s] ?? a.arrayKeys;
+  return Array.isArray(c) && c.length === 0 ? { isArray: !0, value: [], keys: [] } : { isArray: !0, value: T.getState().getShadowValue(e, r, c), keys: c ?? [] };
+}
+function ve(e, r, l) {
+  for (let a = 0; a < e.length; a++)
+    if (l(e[a], a)) {
+      const S = r[a];
+      if (S)
+        return { key: S, index: a, value: e[a] };
+    }
+  return null;
+}
+function pe(e, r) {
+  const l = G(e) || {};
+  ue(e, {
+    ...l,
     ...r
   });
 }
-function It({
-  stateKey: t,
+function Me({
+  stateKey: e,
   options: r,
-  initialOptionsPart: y
+  initialOptionsPart: l
 }) {
-  const m = et(t) || {}, v = y[t] || {}, g = a.getState().setInitialStateOptions, T = { ...v, ...m };
-  let h = !1;
+  const a = G(e) || {}, s = { ...l[e] || {}, ...a };
+  let c = !1;
   if (r)
-    for (const e in r)
-      T.hasOwnProperty(e) ? (e == "localStorage" && r[e] && T[e].key !== r[e]?.key && (h = !0, T[e] = r[e]), e == "defaultState" && r[e] && T[e] !== r[e] && !nt(T[e], r[e]) && (h = !0, T[e] = r[e])) : (h = !0, T[e] = r[e]);
-  T.syncOptions && (!r || !r.hasOwnProperty("syncOptions")) && (h = !0), h && g(t, T);
+    for (const i in r)
+      s.hasOwnProperty(i) ? (i == "localStorage" && r[i] && s[i].key !== r[i]?.key && (c = !0, s[i] = r[i]), i == "defaultState" && r[i] && s[i] !== r[i] && !ae(s[i], r[i]) && (c = !0, s[i] = r[i])) : (c = !0, s[i] = r[i]);
+  s.syncOptions && (!r || !r.hasOwnProperty("syncOptions")) && (c = !0), c && ue(e, s);
 }
-function ne(t, { formElements: r, validation: y }) {
-  return { initialState: t, formElements: r, validation: y };
+function Mt(e, { formElements: r, validation: l }) {
+  return { initialState: e, formElements: r, validation: l };
 }
-const Nt = (t, r) => {
-  let y = t;
-  const [m, v] = Rt(y);
-  r?.__fromSyncSchema && r?.__syncNotifications && a.getState().setInitialStateOptions("__notifications", r.__syncNotifications), r?.__fromSyncSchema && r?.__apiParamsMap && a.getState().setInitialStateOptions("__apiParamsMap", r.__apiParamsMap), Object.keys(m).forEach((h) => {
-    let e = v[h] || {};
-    const s = {
-      ...e
+const Xe = (e, r) => {
+  let l = e;
+  const [a, S] = Ue(l);
+  r?.__fromSyncSchema && r?.__syncNotifications && T.getState().setInitialStateOptions("__notifications", r.__syncNotifications), r?.__fromSyncSchema && r?.__apiParamsMap && T.getState().setInitialStateOptions("__apiParamsMap", r.__apiParamsMap), Object.keys(a).forEach((i) => {
+    let f = S[i] || {};
+    const t = {
+      ...f
     };
-    if (r?.formElements && (s.formElements = {
+    if (r?.formElements && (t.formElements = {
       ...r.formElements,
-      ...e.formElements || {}
-    }), r?.validation && (s.validation = {
+      ...f.formElements || {}
+    }), r?.validation && (t.validation = {
       ...r.validation,
-      ...e.validation || {}
-    }, r.validation.key && !e.validation?.key && (s.validation.key = `${r.validation.key}.${h}`)), r?.__syncSchemas?.[h]?.schemas?.validation && (s.validation = {
-      zodSchemaV4: r.__syncSchemas[h].schemas.validation,
-      ...e.validation
-    }), Object.keys(s).length > 0) {
-      const p = et(h);
-      p ? a.getState().setInitialStateOptions(h, {
-        ...p,
-        ...s
-      }) : a.getState().setInitialStateOptions(h, s);
+      ...f.validation || {}
+    }, r.validation.key && !f.validation?.key && (t.validation.key = `${r.validation.key}.${i}`)), r?.__syncSchemas?.[i]?.schemas?.validation && (t.validation = {
+      zodSchemaV4: r.__syncSchemas[i].schemas.validation,
+      ...f.validation
+    }), Object.keys(t).length > 0) {
+      const u = G(i);
+      u ? ue(i, {
+        ...u,
+        ...t
+      }) : ue(i, t);
     }
-  }), Object.keys(m).forEach((h) => {
-    a.getState().initializeShadowState(h, m[h]);
-  });
-  const g = (h, e) => {
-    const [s] = X(e?.componentId ?? tt());
-    It({
-      stateKey: h,
-      options: e,
-      initialOptionsPart: v
+  }), Object.keys(a).forEach((i) => {
+    oe(i, a[i]);
+  }), console.log("new stateObject ", T.getState().shadowStateStore);
+  const s = (i, f) => {
+    const [t] = K(f?.componentId ?? X());
+    Me({
+      stateKey: i,
+      options: f,
+      initialOptionsPart: S
     });
-    const p = a.getState().getShadowValue(h) || m[h], F = e?.modifyState ? e.modifyState(p) : p;
-    return Wt(F, {
-      stateKey: h,
-      syncUpdate: e?.syncUpdate,
-      componentId: s,
-      localStorage: e?.localStorage,
-      middleware: e?.middleware,
-      reactiveType: e?.reactiveType,
-      reactiveDeps: e?.reactiveDeps,
-      defaultState: e?.defaultState,
-      dependencies: e?.dependencies,
-      serverState: e?.serverState,
-      syncOptions: e?.syncOptions,
+    const u = R(i, []) || a[i], I = f?.modifyState ? f.modifyState(u) : u;
+    return lt(I, {
+      stateKey: i,
+      syncUpdate: f?.syncUpdate,
+      componentId: t,
+      localStorage: f?.localStorage,
+      middleware: f?.middleware,
+      reactiveType: f?.reactiveType,
+      reactiveDeps: f?.reactiveDeps,
+      defaultState: f?.defaultState,
+      dependencies: f?.dependencies,
+      serverState: f?.serverState,
+      syncOptions: f?.syncOptions,
       __useSync: r?.__useSync
     });
   };
-  function T(h, e) {
-    It({ stateKey: h, options: e, initialOptionsPart: v }), e.localStorage && Lt(h, e), pt(h);
+  function c(i, f) {
+    Me({ stateKey: i, options: f, initialOptionsPart: S }), f.localStorage && et(i, f), be(i);
   }
-  return { useCogsState: g, setCogsOptions: T };
+  return { useCogsState: s, setCogsOptions: c };
 };
-function oe(t, r) {
-  const y = t.schemas, m = {}, v = {};
-  for (const g in y) {
-    const T = y[g];
-    m[g] = T?.schemas?.defaultValues || {}, T?.api?.queryData?._paramType && (v[g] = T.api.queryData._paramType);
+function At(e, r) {
+  const l = e.schemas, a = {}, S = {};
+  for (const s in l) {
+    const c = l[s];
+    a[s] = c?.schemas?.defaultValues || {}, c?.api?.queryData?._paramType && (S[s] = c.api.queryData._paramType);
   }
-  return Nt(m, {
+  return Xe(a, {
     __fromSyncSchema: !0,
-    __syncNotifications: t.notifications,
-    __apiParamsMap: v,
+    __syncNotifications: e.notifications,
+    __apiParamsMap: S,
     __useSync: r,
-    __syncSchemas: y
+    __syncSchemas: l
   });
 }
-const {
-  getInitialOptions: et,
-  addStateLog: Ft,
-  updateInitialStateGlobal: _t
-} = a.getState(), jt = (t, r, y, m, v) => {
-  y?.log && console.log(
+const Ke = (e, r, l, a, S) => {
+  l?.log && console.log(
     "saving to localstorage",
     r,
-    y.localStorage?.key,
-    m
+    l.localStorage?.key,
+    a
   );
-  const g = K(y?.localStorage?.key) ? y.localStorage?.key(t) : y?.localStorage?.key;
-  if (g && m) {
-    const T = `${m}-${r}-${g}`;
-    let h;
+  const s = z(l?.localStorage?.key) ? l.localStorage?.key(e) : l?.localStorage?.key;
+  if (s && a) {
+    const c = `${a}-${r}-${s}`;
+    let i;
     try {
-      h = ft(T)?.lastSyncedWithServer;
+      i = ge(c)?.lastSyncedWithServer;
     } catch {
     }
-    const e = a.getState().getShadowMetadata(r, []), s = {
-      state: t,
+    const f = V(r, []), t = {
+      state: e,
       lastUpdated: Date.now(),
-      lastSyncedWithServer: h,
-      stateSource: e?.stateSource,
-      baseServerState: e?.baseServerState
-    }, p = Ut.serialize(s);
+      lastSyncedWithServer: i,
+      stateSource: f?.stateSource,
+      baseServerState: f?.baseServerState
+    }, u = xe.serialize(t);
     window.localStorage.setItem(
-      T,
-      JSON.stringify(p.json)
+      c,
+      JSON.stringify(u.json)
     );
   }
-}, ft = (t) => {
-  if (!t) return null;
+}, ge = (e) => {
+  if (!e) return null;
   try {
-    const r = window.localStorage.getItem(t);
+    const r = window.localStorage.getItem(e);
     return r ? JSON.parse(r) : null;
   } catch (r) {
     return console.error("Error loading from localStorage:", r), null;
   }
-}, Lt = (t, r) => {
-  const y = a.getState().getShadowValue(t), { sessionId: m } = At(), v = K(r?.localStorage?.key) ? r.localStorage.key(y) : r?.localStorage?.key;
-  if (v && m) {
-    const g = ft(
-      `${m}-${t}-${v}`
+}, et = (e, r) => {
+  const l = R(e, []), { sessionId: a } = Ve(), S = z(r?.localStorage?.key) ? r.localStorage.key(l) : r?.localStorage?.key;
+  if (S && a) {
+    const s = ge(
+      `${a}-${e}-${S}`
     );
-    if (g && g.lastUpdated > (g.lastSyncedWithServer || 0))
-      return pt(t), !0;
+    if (s && s.lastUpdated > (s.lastSyncedWithServer || 0))
+      return be(e), !0;
   }
   return !1;
-}, pt = (t) => {
-  const r = a.getState().getShadowMetadata(t, []);
+}, be = (e) => {
+  const r = V(e, []);
   if (!r) return;
-  const y = /* @__PURE__ */ new Set();
-  r?.components?.forEach((m) => {
-    (m ? Array.isArray(m.reactiveType) ? m.reactiveType : [m.reactiveType || "component"] : null)?.includes("none") || y.add(() => m.forceUpdate());
+  const l = /* @__PURE__ */ new Set();
+  r?.components?.forEach((a) => {
+    (a ? Array.isArray(a.reactiveType) ? a.reactiveType : [a.reactiveType || "component"] : null)?.includes("none") || l.add(() => a.forceUpdate());
   }), queueMicrotask(() => {
-    y.forEach((m) => m());
+    l.forEach((a) => a());
   });
-}, se = (t, r) => {
-  const y = a.getState().getShadowMetadata(t, []);
-  if (y) {
-    const m = `${t}////${r}`, v = y?.components?.get(m);
-    if ((v ? Array.isArray(v.reactiveType) ? v.reactiveType : [v.reactiveType || "component"] : null)?.includes("none"))
-      return;
-    v && v.forceUpdate();
-  }
 };
-function mt(t, r, y, m) {
-  const v = a.getState(), g = v.getShadowMetadata(t, r);
-  if (v.setShadowMetadata(t, r, {
-    ...g,
+function fe(e, r, l, a) {
+  const S = V(e, r);
+  if (J(e, r, {
+    ...S,
     isDirty: !1,
     stateSource: "server",
-    lastServerSync: m || Date.now()
-  }), Array.isArray(y)) {
-    const T = v.getShadowMetadata(t, r);
-    T?.arrayKeys && T.arrayKeys.forEach((h, e) => {
-      const s = h.split(".").slice(1), p = y[e];
-      p !== void 0 && mt(
+    lastServerSync: a || Date.now()
+  }), Array.isArray(l)) {
+    const s = V(e, r);
+    s?.arrayKeys && s.arrayKeys.forEach((c, i) => {
+      const f = [...r, c], t = l[i];
+      t !== void 0 && fe(
+        e,
+        f,
         t,
-        s,
-        p,
-        m
+        a
       );
     });
-  } else y && typeof y == "object" && y.constructor === Object && Object.keys(y).forEach((T) => {
-    const h = [...r, T], e = y[T];
-    mt(t, h, e, m);
+  } else l && typeof l == "object" && l.constructor === Object && Object.keys(l).forEach((s) => {
+    const c = [...r, s], i = l[s];
+    fe(e, c, i, a);
   });
 }
-let ct = /* @__PURE__ */ new Map(), gt = !1;
-function Wt(t, {
+let Se = [], Te = !1;
+function tt() {
+  Te || (Te = !0, queueMicrotask(it));
+}
+function rt(e, r, l) {
+  const a = T.getState().getShadowValue(e, r), S = z(l) ? l(a) : l;
+  Re(e, r, S), de(e, r, { bubble: !0 });
+  const s = V(e, r);
+  return {
+    type: "update",
+    oldValue: a,
+    newValue: S,
+    shadowMeta: s
+  };
+}
+function nt(e, r) {
+  e?.signals?.length && e.signals.forEach(({ parentId: l, position: a, effect: S }) => {
+    const s = document.querySelector(`[data-parent-id="${l}"]`);
+    if (!s) return;
+    const c = Array.from(s.childNodes);
+    if (!c[a]) return;
+    let i = r;
+    if (S && r !== null)
+      try {
+        i = new Function("state", `return (${S})(state)`)(
+          r
+        );
+      } catch (f) {
+        console.error("Error evaluating effect function:", f);
+      }
+    i !== null && typeof i == "object" && (i = JSON.stringify(i)), c[a].textContent = String(i ?? "");
+  });
+}
+function at(e, r, l) {
+  const a = V(e, []);
+  if (!a?.components)
+    return /* @__PURE__ */ new Set();
+  const S = /* @__PURE__ */ new Set();
+  if (l.type === "update") {
+    let s = [...r];
+    for (; ; ) {
+      const c = V(e, s);
+      if (c?.pathComponents && c.pathComponents.forEach((i) => {
+        const f = a.components?.get(i);
+        f && ((Array.isArray(f.reactiveType) ? f.reactiveType : [f.reactiveType || "component"]).includes("none") || S.add(f));
+      }), s.length === 0) break;
+      s.pop();
+    }
+    l.newValue && typeof l.newValue == "object" && !Fe(l.newValue) && $e(l.newValue, l.oldValue).forEach((i) => {
+      const f = i.split("."), t = [...r, ...f], u = V(e, t);
+      u?.pathComponents && u.pathComponents.forEach((I) => {
+        const U = a.components?.get(I);
+        U && ((Array.isArray(U.reactiveType) ? U.reactiveType : [U.reactiveType || "component"]).includes("none") || S.add(U));
+      });
+    });
+  } else if (l.type === "insert" || l.type === "cut") {
+    const s = l.type === "insert" ? r : r.slice(0, -1), c = V(e, s);
+    c?.pathComponents && c.pathComponents.forEach((i) => {
+      const f = a.components?.get(i);
+      f && S.add(f);
+    });
+  }
+  return a.components.forEach((s, c) => {
+    if (S.has(s))
+      return;
+    const i = Array.isArray(s.reactiveType) ? s.reactiveType : [s.reactiveType || "component"];
+    if (i.includes("all"))
+      S.add(s);
+    else if (i.includes("deps") && s.depsFunction) {
+      const f = R(e, []), t = s.depsFunction(f);
+      (t === !0 || Array.isArray(t) && !ae(s.prevDeps, t)) && (s.prevDeps = t, S.add(s));
+    }
+  }), S;
+}
+function ot(e, r, l) {
+  let a;
+  if (z(l)) {
+    const { value: s } = Q(e, r);
+    a = l({ state: s, uuid: X() });
+  } else
+    a = l;
+  Le(e, r, a), de(e, r, { bubble: !0 });
+  const S = V(e, r);
+  if (S?.arrayKeys) {
+    const s = S.arrayKeys[S.arrayKeys.length - 1];
+    if (s) {
+      const c = s.split(".").slice(1);
+      de(e, c, { bubble: !1 });
+    }
+  }
+  return { type: "insert", newValue: a, shadowMeta: S };
+}
+function st(e, r) {
+  const l = r.slice(0, -1), a = R(e, r);
+  return Be(e, r), de(e, l, { bubble: !0 }), { type: "cut", oldValue: a, parentPath: l };
+}
+function it() {
+  const e = /* @__PURE__ */ new Set(), r = [], l = [];
+  for (const a of Se) {
+    if (a.status && a.updateType) {
+      l.push(a);
+      continue;
+    }
+    const S = a, s = S.type === "cut" ? null : S.newValue;
+    S.shadowMeta?.signals?.length > 0 && r.push({ shadowMeta: S.shadowMeta, displayValue: s }), at(
+      S.stateKey,
+      S.path,
+      S
+    ).forEach((i) => {
+      e.add(i);
+    });
+  }
+  l.length > 0 && ze(l), r.forEach(({ shadowMeta: a, displayValue: S }) => {
+    nt(a, S);
+  }), e.forEach((a) => {
+    a.forceUpdate();
+  }), Se = [], Te = !1;
+}
+function ct(e, r, l, a) {
+  return (s, c, i, f) => {
+    S(e, c, s, i);
+  };
+  function S(s, c, i, f) {
+    let t;
+    switch (f.updateType) {
+      case "update":
+        t = rt(s, c, i);
+        break;
+      case "insert":
+        t = ot(s, c, i);
+        break;
+      case "cut":
+        t = st(s, c);
+        break;
+    }
+    t.stateKey = s, t.path = c, Se.push(t), tt();
+    const u = {
+      timeStamp: Date.now(),
+      stateKey: s,
+      path: c,
+      updateType: f.updateType,
+      status: "new",
+      oldValue: t.oldValue,
+      newValue: t.newValue ?? null
+    };
+    Se.push(u), t.newValue !== void 0 && Ke(
+      t.newValue,
+      s,
+      a.current,
+      l
+    ), a.current?.middleware && a.current.middleware({ update: u }), f.sync !== !1 && r.current?.connected && r.current.updateState({ operation: u });
+  }
+}
+function lt(e, {
   stateKey: r,
-  localStorage: y,
-  formElements: m,
-  reactiveDeps: v,
-  reactiveType: g,
-  componentId: T,
-  defaultState: h,
-  syncUpdate: e,
-  dependencies: s,
-  serverState: p,
-  __useSync: F
+  localStorage: l,
+  formElements: a,
+  reactiveDeps: S,
+  reactiveType: s,
+  componentId: c,
+  defaultState: i,
+  syncUpdate: f,
+  dependencies: t,
+  serverState: u,
+  __useSync: I
 } = {}) {
-  const [j, k] = X({}), { sessionId: N } = At();
-  let G = !r;
-  const [S] = X(r ?? tt()), Q = q(T ?? tt()), d = q(
+  const [U, O] = K({}), { sessionId: F } = Ve();
+  let x = !r;
+  const [w] = K(r ?? X()), ee = L(c ?? X()), m = L(
     null
   );
-  d.current = et(S) ?? null, Z(() => {
-    if (e && e.stateKey === S && e.path?.[0]) {
-      const l = `${e.stateKey}:${e.path.join(".")}`;
-      a.getState().setSyncInfo(l, {
-        timeStamp: e.timeStamp,
-        userId: e.userId
+  m.current = G(w) ?? null, W(() => {
+    if (f && f.stateKey === w && f.path?.[0]) {
+      const g = `${f.stateKey}:${f.path.join(".")}`;
+      Je(g, {
+        timeStamp: f.timeStamp,
+        userId: f.userId
       });
     }
-  }, [e]);
-  const W = ot(
-    (l) => {
-      const u = l ? { ...et(S), ...l } : et(S), E = u?.defaultState || h || t;
-      if (u?.serverState?.status === "success" && u?.serverState?.data !== void 0)
+  }, [f]);
+  const te = we(
+    (g) => {
+      const p = g ? { ...G(w), ...g } : G(w), b = p?.defaultState || i || e;
+      if (p?.serverState?.status === "success" && p?.serverState?.data !== void 0)
         return {
-          value: u.serverState.data,
+          value: p.serverState.data,
           source: "server",
-          timestamp: u.serverState.timestamp || Date.now()
+          timestamp: p.serverState.timestamp || Date.now()
         };
-      if (u?.localStorage?.key && N) {
-        const V = K(u.localStorage.key) ? u.localStorage.key(E) : u.localStorage.key, M = ft(
-          `${N}-${S}-${V}`
+      if (p?.localStorage?.key && F) {
+        const M = z(p.localStorage.key) ? p.localStorage.key(b) : p.localStorage.key, A = ge(
+          `${F}-${w}-${M}`
         );
-        if (M && M.lastUpdated > (u?.serverState?.timestamp || 0))
+        if (A && A.lastUpdated > (p?.serverState?.timestamp || 0))
           return {
-            value: M.state,
+            value: A.state,
             source: "localStorage",
-            timestamp: M.lastUpdated
+            timestamp: A.lastUpdated
           };
       }
       return {
-        value: E || t,
+        value: b || e,
         source: "default",
         timestamp: Date.now()
       };
     },
-    [S, h, t, N]
+    [w, i, e, F]
   );
-  Z(() => {
-    a.getState().setServerStateUpdate(S, p);
-  }, [p, S]), Z(() => a.getState().subscribeToPath(S, (i) => {
-    if (i?.type === "SERVER_STATE_UPDATE") {
-      const u = i.serverState;
-      if (console.log("SERVER_STATE_UPDATE", i), u?.status === "success" && u.data !== void 0) {
-        St(S, { serverState: u });
-        const w = typeof u.merge == "object" ? u.merge : u.merge === !0 ? {} : null, V = a.getState().getShadowValue(S), M = u.data;
-        if (w && Array.isArray(V) && Array.isArray(M)) {
-          const U = w.key, $ = new Set(
-            V.map((x) => x[U])
-          ), z = M.filter((x) => !$.has(x[U]));
-          z.length > 0 && z.forEach((x) => {
-            a.getState().insertShadowArrayElement(S, [], x);
-            const B = a.getState().getShadowMetadata(S, []);
-            if (B?.arrayKeys) {
-              const C = B.arrayKeys[B.arrayKeys.length - 1];
-              if (C) {
-                const O = C.split(".").slice(1);
-                a.getState().setShadowMetadata(S, O, {
-                  isDirty: !1,
-                  stateSource: "server",
-                  lastServerSync: u.timestamp || Date.now()
-                });
-                const I = a.getState().getShadowValue(C);
-                I && typeof I == "object" && !Array.isArray(I) && Object.keys(I).forEach((b) => {
-                  const A = [...O, b];
-                  a.getState().setShadowMetadata(S, A, {
-                    isDirty: !1,
-                    stateSource: "server",
-                    lastServerSync: u.timestamp || Date.now()
-                  });
-                });
-              }
-            }
-          });
-        } else
-          a.getState().initializeShadowState(S, M), mt(
-            S,
-            [],
-            M,
-            u.timestamp
+  W(() => {
+    We(w, u);
+  }, [u, w]), W(() => T.getState().subscribeToPath(w, (y) => {
+    if (y?.type === "SERVER_STATE_UPDATE") {
+      const p = y.serverState;
+      if (p?.status !== "success" || p.data === void 0)
+        return;
+      pe(w, { serverState: p });
+      const b = typeof p.merge == "object" ? p.merge : p.merge === !0 ? { strategy: "append" } : null, _ = R(w, []), M = p.data;
+      if (b && b.strategy === "append" && "key" in b && // Type guard for key
+      Array.isArray(_) && Array.isArray(M)) {
+        const A = b.key;
+        if (!A) {
+          console.error(
+            "CogsState: Merge strategy 'append' requires a 'key' field."
           );
-        const _ = a.getState().getShadowMetadata(S, []);
-        a.getState().setShadowMetadata(S, [], {
-          ..._,
-          stateSource: "server",
-          lastServerSync: u.timestamp || Date.now(),
-          isDirty: !1
-        });
-      }
+          return;
+        }
+        const D = new Set(
+          _.map((j) => j[A])
+        ), E = M.filter(
+          (j) => !D.has(j[A])
+        );
+        E.length > 0 && qe(w, [], E);
+        const k = R(w, []);
+        fe(
+          w,
+          [],
+          k,
+          p.timestamp
+        );
+      } else
+        oe(w, M), fe(
+          w,
+          [],
+          M,
+          p.timestamp
+        );
     }
-  }), [S, W]), Z(() => {
-    const l = a.getState().getShadowMetadata(S, []);
-    if (l && l.stateSource)
+  }), [w, te]), W(() => {
+    const g = T.getState().getShadowMetadata(w, []);
+    if (g && g.stateSource)
       return;
-    const i = et(S);
-    if (i?.defaultState !== void 0 || h !== void 0) {
-      const u = i?.defaultState || h;
-      i?.defaultState || St(S, {
-        defaultState: u
+    const y = G(w), p = {
+      syncEnabled: !!v && !!h,
+      validationEnabled: !!(y?.validation?.zodSchemaV4 || y?.validation?.zodSchemaV3),
+      localStorageEnabled: !!y?.localStorage?.key
+    };
+    if (J(w, [], {
+      ...g,
+      features: p
+    }), y?.defaultState !== void 0 || i !== void 0) {
+      const b = y?.defaultState || i;
+      y?.defaultState || pe(w, {
+        defaultState: b
       });
-      const { value: E, source: w, timestamp: V } = W();
-      a.getState().initializeShadowState(S, E), a.getState().setShadowMetadata(S, [], {
-        stateSource: w,
-        lastServerSync: w === "server" ? V : void 0,
+      const { value: _, source: M, timestamp: A } = te();
+      oe(w, _), J(w, [], {
+        stateSource: M,
+        lastServerSync: M === "server" ? A : void 0,
         isDirty: !1,
-        baseServerState: w === "server" ? E : void 0
-      }), pt(S);
+        baseServerState: M === "server" ? _ : void 0
+      }), be(w);
     }
-  }, [S, ...s || []]), lt(() => {
-    G && St(S, {
-      formElements: m,
-      defaultState: h,
-      localStorage: y,
-      middleware: d.current?.middleware
+  }, [w, ...t || []]), ce(() => {
+    x && pe(w, {
+      formElements: a,
+      defaultState: i,
+      localStorage: l,
+      middleware: m.current?.middleware
     });
-    const l = `${S}////${Q.current}`, i = a.getState().getShadowMetadata(S, []), u = i?.components || /* @__PURE__ */ new Map();
-    return u.set(l, {
-      forceUpdate: () => k({}),
-      reactiveType: g ?? ["component", "deps"],
+    const g = `${w}////${ee.current}`, y = V(w, []), p = y?.components || /* @__PURE__ */ new Map();
+    return p.set(g, {
+      forceUpdate: () => O({}),
+      reactiveType: s ?? ["component"],
       paths: /* @__PURE__ */ new Set(),
-      depsFunction: v || void 0,
-      deps: v ? v(a.getState().getShadowValue(S)) : [],
-      prevDeps: v ? v(a.getState().getShadowValue(S)) : []
-    }), a.getState().setShadowMetadata(S, [], {
-      ...i,
-      components: u
-    }), k({}), () => {
-      const E = a.getState().getShadowMetadata(S, []), w = E?.components?.get(l);
-      w?.paths && w.paths.forEach((V) => {
-        const _ = V.split(".").slice(1), U = a.getState().getShadowMetadata(S, _);
-        U?.pathComponents && U.pathComponents.size === 0 && (delete U.pathComponents, a.getState().setShadowMetadata(S, _, U));
-      }), E?.components && a.getState().setShadowMetadata(S, [], E);
+      depsFunction: S || void 0,
+      deps: S ? S(R(w, [])) : [],
+      prevDeps: S ? S(R(w, [])) : []
+    }), J(w, [], {
+      ...y,
+      components: p
+    }), O({}), () => {
+      const b = V(w, []), _ = b?.components?.get(g);
+      _?.paths && _.paths.forEach((M) => {
+        const D = M.split(".").slice(1), E = T.getState().getShadowMetadata(w, D);
+        E?.pathComponents && E.pathComponents.size === 0 && (delete E.pathComponents, T.getState().setShadowMetadata(w, D, E));
+      }), b?.components && J(w, [], b);
     };
   }, []);
-  const J = q(null), n = (l, i, u) => {
-    const E = [S, ...i].join("."), w = a.getState(), V = w.getShadowMetadata(S, i), M = w.getShadowValue(E), _ = u.updateType === "insert" && K(l) ? l({ state: M, uuid: tt() }) : K(l) ? l(M) : l, $ = {
-      timeStamp: Date.now(),
-      stateKey: S,
-      path: i,
-      updateType: u.updateType,
-      status: "new",
-      oldValue: M,
-      newValue: _
-    };
-    switch (u.updateType) {
-      case "insert": {
-        w.insertShadowArrayElement(S, i, $.newValue), w.markAsDirty(S, i, { bubble: !0 });
-        const C = V;
-        if (C?.arrayKeys) {
-          const O = C.arrayKeys[C.arrayKeys.length - 1];
-          if (O) {
-            const I = O.split(".").slice(1);
-            w.markAsDirty(S, I, { bubble: !1 });
-          }
-        }
-        break;
-      }
-      case "cut": {
-        const C = i.slice(0, -1);
-        w.removeShadowArrayElement(S, i), w.markAsDirty(S, C, { bubble: !0 });
-        break;
-      }
-      case "update": {
-        w.updateShadowAtPath(S, i, $.newValue), w.markAsDirty(S, i, { bubble: !0 });
-        break;
-      }
-    }
-    if (u.sync !== !1 && J.current && J.current.connected && J.current.updateState({ operation: $ }), V?.signals && V.signals.length > 0) {
-      const C = u.updateType === "cut" ? null : _;
-      V.signals.forEach(({ parentId: O, position: I, effect: b }) => {
-        const A = document.querySelector(`[data-parent-id="${O}"]`);
-        if (A) {
-          const D = Array.from(A.childNodes);
-          if (D[I]) {
-            let P = C;
-            if (b && C !== null)
-              try {
-                P = new Function(
-                  "state",
-                  `return (${b})(state)`
-                )(C);
-              } catch (R) {
-                console.error("Error evaluating effect function:", R);
-              }
-            P != null && typeof P == "object" && (P = JSON.stringify(P)), D[I].textContent = String(P ?? "");
-          }
-        }
-      });
-    }
-    if (u.updateType === "insert" && V?.mapWrappers && V.mapWrappers.length > 0) {
-      const C = w.getShadowMetadata(S, i)?.arrayKeys || [], O = C[C.length - 1], I = w.getShadowValue(O), b = w.getShadowValue(
-        [S, ...i].join(".")
-      );
-      if (!O || I === void 0) return;
-      V.mapWrappers.forEach((A) => {
-        let D = !0, P = -1;
-        if (A.meta?.transforms && A.meta.transforms.length > 0) {
-          for (const R of A.meta.transforms)
-            if (R.type === "filter" && !R.fn(I, -1)) {
-              D = !1;
-              break;
-            }
-          if (D) {
-            const R = yt(
-              S,
-              i,
-              A.meta.transforms
-            ), Y = A.meta.transforms.find(
-              (L) => L.type === "sort"
-            );
-            if (Y) {
-              const L = R.map((H) => ({
-                key: H,
-                value: w.getShadowValue(H)
-              }));
-              L.push({ key: O, value: I }), L.sort((H, at) => Y.fn(H.value, at.value)), P = L.findIndex(
-                (H) => H.key === O
-              );
-            } else
-              P = R.length;
-          }
-        } else
-          D = !0, P = C.length - 1;
-        if (D && A.containerRef && A.containerRef.isConnected) {
-          const R = document.createElement("div");
-          R.setAttribute("data-item-path", O);
-          const Y = Array.from(A.containerRef.children);
-          P >= 0 && P < Y.length ? A.containerRef.insertBefore(
-            R,
-            Y[P]
-          ) : A.containerRef.appendChild(R);
-          const L = bt(R), H = tt(), at = O.split(".").slice(1), it = A.rebuildStateShape({
-            path: A.path,
-            currentState: b,
-            componentId: A.componentId,
-            meta: A.meta
-          });
-          L.render(
-            st(vt, {
-              stateKey: S,
-              itemComponentId: H,
-              itemPath: at,
-              localIndex: P,
-              arraySetter: it,
-              rebuildStateShape: A.rebuildStateShape,
-              renderFn: A.mapFn
-            })
-          );
-        }
-      });
-    }
-    if (u.updateType === "cut") {
-      const C = i.slice(0, -1), O = w.getShadowMetadata(S, C);
-      O?.mapWrappers && O.mapWrappers.length > 0 && O.mapWrappers.forEach((I) => {
-        if (I.containerRef && I.containerRef.isConnected) {
-          const b = I.containerRef.querySelector(
-            `[data-item-path="${E}"]`
-          );
-          b && b.remove();
-        }
-      });
-    }
-    const x = w.getShadowMetadata(S, []), B = /* @__PURE__ */ new Set();
-    if (x?.components) {
-      if (u.updateType === "update") {
-        let C = [...i];
-        for (; ; ) {
-          const O = w.getShadowMetadata(S, C);
-          if (O?.pathComponents && O.pathComponents.forEach((I) => {
-            if (B.has(I))
-              return;
-            const b = x.components?.get(I);
-            b && ((Array.isArray(b.reactiveType) ? b.reactiveType : [b.reactiveType || "component"]).includes("none") || (b.forceUpdate(), B.add(I)));
-          }), C.length === 0)
-            break;
-          C.pop();
-        }
-        _ && typeof _ == "object" && !wt(_) && M && typeof M == "object" && !wt(M) && Et(_, M).forEach((I) => {
-          const b = I.split("."), A = [...i, ...b], D = w.getShadowMetadata(S, A);
-          D?.pathComponents && D.pathComponents.forEach((P) => {
-            if (B.has(P))
-              return;
-            const R = x.components?.get(P);
-            R && ((Array.isArray(R.reactiveType) ? R.reactiveType : [R.reactiveType || "component"]).includes("none") || (R.forceUpdate(), B.add(P)));
-          });
-        });
-      } else if (u.updateType === "insert" || u.updateType === "cut") {
-        const C = u.updateType === "insert" ? i : i.slice(0, -1), O = w.getShadowMetadata(S, C);
-        if (O?.signals && O.signals.length > 0) {
-          const I = [S, ...C].join("."), b = w.getShadowValue(I);
-          O.signals.forEach(({ parentId: A, position: D, effect: P }) => {
-            const R = document.querySelector(
-              `[data-parent-id="${A}"]`
-            );
-            if (R) {
-              const Y = Array.from(R.childNodes);
-              if (Y[D]) {
-                let L = b;
-                if (P)
-                  try {
-                    L = new Function(
-                      "state",
-                      `return (${P})(state)`
-                    )(b);
-                  } catch (H) {
-                    console.error("Error evaluating effect function:", H), L = b;
-                  }
-                L != null && typeof L == "object" && (L = JSON.stringify(L)), Y[D].textContent = String(L ?? "");
-              }
-            }
-          });
-        }
-        O?.pathComponents && O.pathComponents.forEach((I) => {
-          if (!B.has(I)) {
-            const b = x.components?.get(I);
-            b && (b.forceUpdate(), B.add(I));
-          }
-        });
-      }
-      x.components.forEach((C, O) => {
-        if (B.has(O))
-          return;
-        const I = Array.isArray(C.reactiveType) ? C.reactiveType : [C.reactiveType || "component"];
-        if (I.includes("all")) {
-          C.forceUpdate(), B.add(O);
-          return;
-        }
-        if (I.includes("deps") && C.depsFunction) {
-          const b = w.getShadowValue(S), A = C.depsFunction(b);
-          let D = !1;
-          A === !0 ? D = !0 : Array.isArray(A) && (nt(C.prevDeps, A) || (C.prevDeps = A, D = !0)), D && (C.forceUpdate(), B.add(O));
-        }
-      }), B.clear(), Ft(S, $), jt(
-        _,
-        S,
-        d.current,
-        N
-      ), d.current?.middleware && d.current.middleware({
-        update: $
-      });
-    }
-  };
-  a.getState().initialStateGlobal[S] || _t(S, t);
-  const o = dt(() => Ct(
-    S,
-    n,
-    Q.current,
-    N
-  ), [S, N]), c = F, f = d.current?.syncOptions;
-  return c && (J.current = c(
+  const o = L(null), n = ct(
+    w,
     o,
-    f ?? {}
-  )), o;
-}
-function Ht(t) {
-  return !t || t.length === 0 ? "" : t.map(
-    (r) => `${r.type}${JSON.stringify(r.dependencies || [])}`
-  ).join("");
+    F,
+    m
+  );
+  T.getState().initialStateGlobal[w] || ke(w, e);
+  const d = le(() => Pe(
+    w,
+    n,
+    ee.current,
+    F
+  ), [w, F]), v = I, h = m.current?.syncOptions;
+  return v && (o.current = v(
+    d,
+    h ?? {}
+  )), d;
 }
-const yt = (t, r, y) => {
-  let m = a.getState().getShadowMetadata(t, r)?.arrayKeys || [];
-  if (!y || y.length === 0)
-    return m;
-  let v = m.map((g) => ({
-    key: g,
-    value: a.getState().getShadowValue(g)
-  }));
-  for (const g of y)
-    g.type === "filter" ? v = v.filter(
-      ({ value: T }, h) => g.fn(T, h)
-    ) : g.type === "sort" && v.sort((T, h) => g.fn(T.value, h.value));
-  return v.map(({ key: g }) => g);
-}, Mt = (t, r, y) => {
-  const m = `${t}////${r}`, { addPathComponent: v, getShadowMetadata: g } = a.getState(), h = g(t, [])?.components?.get(m);
-  !h || h.reactiveType === "none" || !(Array.isArray(h.reactiveType) ? h.reactiveType : [h.reactiveType]).includes("component") || v(t, y, m);
-}, ut = (t, r, y) => {
-  const m = a.getState(), v = m.getShadowMetadata(t, []), g = /* @__PURE__ */ new Set();
-  v?.components && v.components.forEach((h, e) => {
-    (Array.isArray(h.reactiveType) ? h.reactiveType : [h.reactiveType || "component"]).includes("all") && (h.forceUpdate(), g.add(e));
-  }), m.getShadowMetadata(t, [...r, "getSelected"])?.pathComponents?.forEach((h) => {
-    v?.components?.get(h)?.forceUpdate();
+const ut = (e, r, l) => {
+  let a = V(e, r)?.arrayKeys || [];
+  const S = l?.transforms;
+  if (!S || S.length === 0)
+    return a;
+  for (const s of S)
+    if (s.type === "filter") {
+      const c = [];
+      a.forEach((i, f) => {
+        const t = R(e, [...r, i]);
+        s.fn(t, f) && c.push(i);
+      }), a = c;
+    } else s.type === "sort" && a.sort((c, i) => {
+      const f = R(e, [...r, c]), t = R(e, [...r, i]);
+      return s.fn(f, t);
+    });
+  return a;
+}, Ae = (e, r, l) => {
+  const a = `${e}////${r}`, s = V(e, [])?.components?.get(a);
+  !s || s.reactiveType === "none" || !(Array.isArray(s.reactiveType) ? s.reactiveType : [s.reactiveType]).includes("component") || Ge(e, l, a);
+}, ne = (e, r, l) => {
+  const a = V(e, []), S = /* @__PURE__ */ new Set();
+  a?.components && a.components.forEach((c, i) => {
+    (Array.isArray(c.reactiveType) ? c.reactiveType : [c.reactiveType || "component"]).includes("all") && (c.forceUpdate(), S.add(i));
+  }), V(e, [
+    ...r,
+    "getSelected"
+  ])?.pathComponents?.forEach((c) => {
+    a?.components?.get(c)?.forceUpdate();
   });
-  const T = m.getShadowMetadata(t, r);
-  for (let h of T?.arrayKeys || []) {
-    const e = h + ".selected", s = m.getShadowMetadata(
-      t,
-      e.split(".").slice(1)
-    );
-    h == y && s?.pathComponents?.forEach((p) => {
-      v?.components?.get(p)?.forceUpdate();
+  const s = V(e, r);
+  for (let c of s?.arrayKeys || []) {
+    const i = c + ".selected", f = V(e, i.split(".").slice(1));
+    c == l && f?.pathComponents?.forEach((t) => {
+      a?.components?.get(t)?.forceUpdate();
     });
   }
 };
-function Ct(t, r, y, m) {
-  const v = /* @__PURE__ */ new Map();
-  function g({
-    path: e = [],
-    meta: s,
-    componentId: p
+function Q(e, r, l) {
+  const a = V(e, r), S = r.length > 0 ? r.join(".") : "root", s = l?.arrayViews?.[S];
+  if (Array.isArray(s) && s.length === 0)
+    return {
+      shadowMeta: a,
+      value: [],
+      arrayKeys: a?.arrayKeys
+    };
+  const c = R(e, r, s);
+  return {
+    shadowMeta: a,
+    value: c,
+    arrayKeys: a?.arrayKeys
+  };
+}
+function Pe(e, r, l, a) {
+  const S = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Set([
+    "sync",
+    "getStatus",
+    "removeStorage",
+    "showValidationErrors",
+    "getSelected",
+    "getSelectedIndex",
+    "clearSelected",
+    "useVirtualView",
+    "stateMap",
+    "$stateMap",
+    "stateFind",
+    "stateFilter",
+    "stateSort",
+    "stream",
+    "stateList",
+    "stateFlattenOn",
+    "index",
+    "last",
+    "insert",
+    "uniqueInsert",
+    "cut",
+    "cutSelected",
+    "cutByValue",
+    "toggleByValue",
+    "findWith",
+    "cutThis",
+    "get",
+    "getState",
+    "$derive",
+    "$get",
+    "lastSynced",
+    "getLocalStorage",
+    "isSelected",
+    "setSelected",
+    "toggleSelected",
+    "_componentId",
+    "addZodValidation",
+    "clearZodValidation",
+    "applyJsonPatch",
+    "getComponents",
+    "getAllFormRefs",
+    "getFormRef",
+    "validationWrapper",
+    "_stateKey",
+    "_path",
+    "update",
+    "toggle",
+    "formElement"
+    // Add ANY other method names here
+  ]);
+  function c({
+    path: t = [],
+    meta: u,
+    componentId: I
   }) {
-    const F = s ? JSON.stringify(s.validIds || s.transforms) : "", j = e.join(".") + ":" + F;
-    if (console.log("PROXY CACHE KEY ", j), v.has(j))
-      return console.log("PROXY CACHE HIT"), v.get(j);
-    const k = [t, ...e].join("."), N = function() {
-      return a().getShadowValue(t, e);
-    }, G = {
-      get(Q, d) {
-        if (d === "_rebuildStateShape")
-          return g;
-        if (Object.getOwnPropertyNames(T).includes(d) && e.length === 0)
-          return T[d];
-        if (d === "getDifferences")
-          return () => {
-            const n = a.getState().getShadowMetadata(t, []), o = a.getState().getShadowValue(t);
-            let c;
-            return n?.stateSource === "server" && n.baseServerState ? c = n.baseServerState : c = a.getState().initialStateGlobal[t], Et(o, c);
-          };
-        if (d === "sync" && e.length === 0)
+    const U = u ? JSON.stringify(u.arrayViews || u.transforms) : "", O = t.join(".") + ":" + U;
+    if (S.has(O))
+      return S.get(O);
+    const F = [e, ...t].join("."), x = {
+      get(ee, m) {
+        if (t.length === 0 && m in i)
+          return i[m];
+        if (!s.has(m)) {
+          const o = [...t, m];
+          return c({
+            path: o,
+            componentId: I,
+            meta: u
+          });
+        }
+        if (m === "_rebuildStateShape")
+          return c;
+        if (m === "sync" && t.length === 0)
           return async function() {
-            const n = a.getState().getInitialOptions(t), o = n?.sync;
-            if (!o)
-              return console.error(`No mutation defined for state key "${t}"`), { success: !1, error: "No mutation defined" };
-            const c = a.getState().getShadowValue(t, []), f = n?.validation?.key;
+            const o = T.getState().getInitialOptions(e), n = o?.sync;
+            if (!n)
+              return console.error(`No mutation defined for state key "${e}"`), { success: !1, error: "No mutation defined" };
+            const d = T.getState().getShadowValue(e, []), v = o?.validation?.key;
             try {
-              const l = await o.action(c);
-              if (l && !l.success && l.errors, l?.success) {
-                const i = a.getState().getShadowMetadata(t, []);
-                a.getState().setShadowMetadata(t, [], {
-                  ...i,
+              const h = await n.action(d);
+              if (h && !h.success && h.errors, h?.success) {
+                const g = T.getState().getShadowMetadata(e, []);
+                J(e, [], {
+                  ...g,
                   isDirty: !1,
                   lastServerSync: Date.now(),
                   stateSource: "server",
-                  baseServerState: c
+                  baseServerState: d
                   // Update base server state
-                }), o.onSuccess && o.onSuccess(l.data);
-              } else !l?.success && o.onError && o.onError(l.error);
-              return l;
-            } catch (l) {
-              return o.onError && o.onError(l), { success: !1, error: l };
+                }), n.onSuccess && n.onSuccess(h.data);
+              } else !h?.success && n.onError && n.onError(h.error);
+              return h;
+            } catch (h) {
+              return n.onError && n.onError(h), { success: !1, error: h };
             }
           };
-        if (d === "_status" || d === "getStatus") {
-          const n = () => {
-            const o = a.getState().getShadowMetadata(t, e), c = a.getState().getShadowValue(k);
-            return o?.isDirty === !0 ? "dirty" : o?.isDirty === !1 || o?.stateSource === "server" ? "synced" : o?.stateSource === "localStorage" ? "restored" : o?.stateSource === "default" ? "fresh" : a.getState().getShadowMetadata(t, [])?.stateSource === "server" && !o?.isDirty ? "synced" : c !== void 0 && !o ? "fresh" : "unknown";
+        if (m === "_status" || m === "getStatus") {
+          const o = () => {
+            const { shadowMeta: n, value: d } = Q(e, t, u);
+            return n?.isDirty === !0 ? "dirty" : n?.stateSource === "server" || n?.isDirty === !1 ? "synced" : n?.stateSource === "localStorage" ? "restored" : n?.stateSource === "default" || d !== void 0 && !n ? "fresh" : "unknown";
           };
-          return d === "_status" ? n() : n;
+          return m === "_status" ? o() : o;
         }
-        if (d === "removeStorage")
+        if (m === "removeStorage")
           return () => {
-            const n = a.getState().initialStateGlobal[t], o = et(t), c = K(o?.localStorage?.key) ? o.localStorage.key(n) : o?.localStorage?.key, f = `${m}-${t}-${c}`;
-            f && localStorage.removeItem(f);
+            const o = T.getState().initialStateGlobal[e], n = G(e), d = z(n?.localStorage?.key) ? n.localStorage.key(o) : n?.localStorage?.key, v = `${a}-${e}-${d}`;
+            v && localStorage.removeItem(v);
           };
-        if (d === "showValidationErrors")
+        if (m === "showValidationErrors")
           return () => {
-            const n = a.getState().getShadowMetadata(t, e);
-            return n?.validation?.status === "VALIDATION_FAILED" && n.validation.message ? [n.validation.message] : [];
+            const { shadowMeta: o } = Q(e, t, u);
+            return o?.validation?.status === "INVALID" && o.validation.errors.length > 0 ? o.validation.errors.filter((n) => n.severity === "error").map((n) => n.message) : [];
           };
-        if (d === "getSelected")
+        if (m === "getSelected")
           return () => {
-            const n = t + "." + e.join(".");
-            Mt(t, p, [
-              ...e,
+            const o = [e, ...t].join(".");
+            Ae(e, I, [
+              ...t,
               "getSelected"
             ]);
-            const o = a.getState().selectedIndicesMap;
-            if (!o || !o.has(n))
+            const n = T.getState().selectedIndicesMap.get(o);
+            if (!n)
               return;
-            const c = o.get(n);
-            if (!(s?.validIds && !s.validIds.includes(c) || !a.getState().getShadowValue(c)))
-              return g({
-                path: c.split(".").slice(1),
-                componentId: p
+            const d = t.join("."), v = u?.arrayViews?.[d], h = n.split(".").pop();
+            if (!(v && !v.includes(h) || R(
+              e,
+              n.split(".").slice(1)
+            ) === void 0))
+              return c({
+                path: n.split(".").slice(1),
+                componentId: I,
+                meta: u
               });
           };
-        if (d === "getSelectedIndex")
-          return () => a.getState().getSelectedIndex(
-            t + "." + e.join("."),
-            s?.validIds
-          );
-        if (d === "clearSelected")
-          return ut(t, e), () => {
-            a.getState().clearSelectedIndex({
-              arrayKey: t + "." + e.join(".")
+        if (m === "getSelectedIndex")
+          return () => {
+            const o = e + "." + t.join(".");
+            t.join(".");
+            const n = T.getState().selectedIndicesMap.get(o);
+            if (!n)
+              return -1;
+            const { keys: d } = B(e, t, u);
+            if (!d)
+              return -1;
+            const v = n.split(".").pop();
+            return d.indexOf(v);
+          };
+        if (m === "clearSelected")
+          return ne(e, t), () => {
+            Ze({
+              arrayKey: e + "." + t.join(".")
             });
           };
-        if (d === "useVirtualView")
-          return (n) => {
+        if (m === "useVirtualView")
+          return (o) => {
             const {
-              itemHeight: o = 50,
-              overscan: c = 6,
-              stickToBottom: f = !1,
-              scrollStickTolerance: l = 75
-            } = n, i = q(null), [u, E] = X({
+              itemHeight: n = 50,
+              overscan: d = 6,
+              stickToBottom: v = !1,
+              scrollStickTolerance: h = 75
+            } = o, g = L(null), [y, p] = K({
               startIndex: 0,
               endIndex: 10
-            }), [w, V] = X({}), M = q(!0), _ = q({
+            }), [b, _] = K({}), M = L(!0);
+            W(() => {
+              const C = setInterval(() => {
+                _({});
+              }, 1e3);
+              return () => clearInterval(C);
+            }, []);
+            const A = L({
               isUserScrolling: !1,
               lastScrollTop: 0,
               scrollUpCount: 0,
               isNearBottom: !0
-            }), U = q(
+            }), D = L(
               /* @__PURE__ */ new Map()
-            );
-            lt(() => {
-              if (!f || !i.current || _.current.isUserScrolling)
-                return;
-              const I = i.current;
-              I.scrollTo({
-                top: I.scrollHeight,
-                behavior: M.current ? "instant" : "smooth"
+            ), { keys: E } = B(e, t, u);
+            W(() => {
+              const C = [e, ...t].join("."), P = T.getState().subscribeToPath(C, (N) => {
+                N.type !== "GET_SELECTED" && N.type;
               });
-            }, [w, f]);
-            const $ = a.getState().getShadowMetadata(t, e)?.arrayKeys || [], { totalHeight: z, itemOffsets: x } = dt(() => {
-              let I = 0;
-              const b = /* @__PURE__ */ new Map();
-              return (a.getState().getShadowMetadata(t, e)?.arrayKeys || []).forEach((D) => {
-                const P = D.split(".").slice(1), R = a.getState().getShadowMetadata(t, P)?.virtualizer?.itemHeight || o;
-                b.set(D, {
-                  height: R,
-                  offset: I
-                }), I += R;
-              }), U.current = b, { totalHeight: I, itemOffsets: b };
-            }, [$.length, o]);
-            lt(() => {
-              if (f && $.length > 0 && i.current && !_.current.isUserScrolling && M.current) {
-                const I = i.current, b = () => {
-                  if (I.clientHeight > 0) {
-                    const A = Math.ceil(
-                      I.clientHeight / o
-                    ), D = $.length - 1, P = Math.max(
+              return () => {
+                P();
+              };
+            }, [I, e, t.join(".")]), ce(() => {
+              if (v && E.length > 0 && g.current && !A.current.isUserScrolling && M.current) {
+                const C = g.current, P = () => {
+                  if (C.clientHeight > 0) {
+                    const N = Math.ceil(
+                      C.clientHeight / n
+                    ), q = E.length - 1, $ = Math.max(
                       0,
-                      D - A - c
+                      q - N - d
                     );
-                    E({ startIndex: P, endIndex: D }), requestAnimationFrame(() => {
-                      C("instant"), M.current = !1;
+                    p({ startIndex: $, endIndex: q }), requestAnimationFrame(() => {
+                      Y("instant"), M.current = !1;
                     });
                   } else
-                    requestAnimationFrame(b);
+                    requestAnimationFrame(P);
                 };
-                b();
+                P();
               }
-            }, [$.length, f, o, c]);
-            const B = ot(() => {
-              const I = i.current;
-              if (!I) return;
-              const b = I.scrollTop, { scrollHeight: A, clientHeight: D } = I, P = _.current, R = A - (b + D), Y = P.isNearBottom;
-              P.isNearBottom = R <= l, b < P.lastScrollTop ? (P.scrollUpCount++, P.scrollUpCount > 3 && Y && (P.isUserScrolling = !0, console.log("User scrolled away from bottom"))) : P.isNearBottom && (P.isUserScrolling = !1, P.scrollUpCount = 0), P.lastScrollTop = b;
-              let L = 0;
-              for (let H = 0; H < $.length; H++) {
-                const at = $[H], it = U.current.get(at);
-                if (it && it.offset + it.height > b) {
-                  L = H;
+            }, [E.length, v, n, d]);
+            const k = L(y);
+            ce(() => {
+              k.current = y;
+            }, [y]);
+            const j = L(E);
+            ce(() => {
+              j.current = E;
+            }, [E]);
+            const se = we(() => {
+              const C = g.current;
+              if (!C) return;
+              const P = C.scrollTop, { scrollHeight: N, clientHeight: q } = C, $ = A.current, re = N - (P + q), ye = $.isNearBottom;
+              $.isNearBottom = re <= h, P < $.lastScrollTop ? ($.scrollUpCount++, $.scrollUpCount > 3 && ye && ($.isUserScrolling = !0, console.log("User scrolled away from bottom"))) : $.isNearBottom && ($.isUserScrolling = !1, $.scrollUpCount = 0), $.lastScrollTop = P;
+              let Z = 0;
+              for (let H = 0; H < E.length; H++) {
+                const me = E[H], he = D.current.get(me);
+                if (he && he.offset + he.height > P) {
+                  Z = H;
                   break;
                 }
               }
-              if (L !== u.startIndex) {
-                const H = Math.ceil(D / o);
-                E({
-                  startIndex: Math.max(0, L - c),
+              if (console.log(
+                "hadnlescroll ",
+                D.current,
+                Z,
+                y
+              ), Z !== y.startIndex && y.startIndex != 0) {
+                const H = Math.ceil(q / n);
+                p({
+                  startIndex: Math.max(0, Z - d),
                   endIndex: Math.min(
-                    $.length - 1,
-                    L + H + c
+                    E.length - 1,
+                    Z + H + d
                   )
                 });
               }
             }, [
-              $.length,
-              u.startIndex,
-              o,
-              c,
-              l
+              E.length,
+              y.startIndex,
+              n,
+              d,
+              h
             ]);
-            Z(() => {
-              const I = i.current;
-              if (!(!I || !f))
-                return I.addEventListener("scroll", B, {
+            W(() => {
+              const C = g.current;
+              if (C)
+                return C.addEventListener("scroll", se, {
                   passive: !0
                 }), () => {
-                  I.removeEventListener("scroll", B);
+                  C.removeEventListener("scroll", se);
                 };
-            }, [B, f]);
-            const C = ot(
-              (I = "smooth") => {
-                const b = i.current;
-                if (!b) return;
-                _.current.isUserScrolling = !1, _.current.isNearBottom = !0, _.current.scrollUpCount = 0;
-                const A = () => {
-                  const D = (P = 0) => {
-                    if (P > 5) return;
-                    const R = b.scrollHeight, Y = b.scrollTop, L = b.clientHeight;
-                    Y + L >= R - 1 || (b.scrollTo({
-                      top: R,
-                      behavior: I
+            }, [se, v]);
+            const Y = we(
+              (C = "smooth") => {
+                const P = g.current;
+                if (!P) return;
+                A.current.isUserScrolling = !1, A.current.isNearBottom = !0, A.current.scrollUpCount = 0;
+                const N = () => {
+                  const q = ($ = 0) => {
+                    if ($ > 5) return;
+                    const re = P.scrollHeight, ye = P.scrollTop, Z = P.clientHeight;
+                    ye + Z >= re - 1 || (P.scrollTo({
+                      top: re,
+                      behavior: C
                     }), setTimeout(() => {
-                      const H = b.scrollHeight, at = b.scrollTop;
-                      (H !== R || at + L < H - 1) && D(P + 1);
+                      const H = P.scrollHeight, me = P.scrollTop;
+                      (H !== re || me + Z < H - 1) && q($ + 1);
                     }, 50));
                   };
-                  D();
+                  q();
                 };
-                "requestIdleCallback" in window ? requestIdleCallback(A, { timeout: 100 }) : requestAnimationFrame(() => {
-                  requestAnimationFrame(A);
+                "requestIdleCallback" in window ? requestIdleCallback(N, { timeout: 100 }) : requestAnimationFrame(() => {
+                  requestAnimationFrame(N);
                 });
               },
               []
             );
-            return Z(() => {
-              if (!f || !i.current) return;
-              const I = i.current, b = _.current;
-              let A;
-              const D = () => {
-                clearTimeout(A), A = setTimeout(() => {
-                  !b.isUserScrolling && b.isNearBottom && C(
+            return W(() => {
+              if (!v || !g.current) return;
+              const C = g.current, P = A.current;
+              let N;
+              const q = () => {
+                clearTimeout(N), N = setTimeout(() => {
+                  !P.isUserScrolling && P.isNearBottom && Y(
                     M.current ? "instant" : "smooth"
                   );
                 }, 100);
-              }, P = new MutationObserver(() => {
-                b.isUserScrolling || D();
+              }, $ = new MutationObserver(() => {
+                P.isUserScrolling || q();
               });
-              P.observe(I, {
+              return $.observe(C, {
                 childList: !0,
                 subtree: !0,
                 attributes: !0,
                 attributeFilter: ["style", "class"]
-                // More specific than just 'height'
-              });
-              const R = (Y) => {
-                Y.target instanceof HTMLImageElement && !b.isUserScrolling && D();
-              };
-              return I.addEventListener("load", R, !0), M.current ? setTimeout(() => {
-                C("instant");
-              }, 0) : D(), () => {
-                clearTimeout(A), P.disconnect(), I.removeEventListener("load", R, !0);
+              }), M.current ? setTimeout(() => {
+                Y("instant");
+              }, 0) : q(), () => {
+                clearTimeout(N), $.disconnect();
               };
-            }, [f, $.length, C]), {
-              virtualState: dt(() => {
-                const I = a.getState(), b = I.getShadowValue(
-                  [t, ...e].join(".")
-                ), A = I.getShadowMetadata(t, e)?.arrayKeys || [];
-                b.slice(
-                  u.startIndex,
-                  u.endIndex + 1
-                );
-                const D = A.slice(
-                  u.startIndex,
-                  u.endIndex + 1
-                );
-                return g({
-                  path: e,
-                  componentId: p,
-                  meta: { ...s, validIds: D }
+            }, [v, E.length, Y]), {
+              virtualState: le(() => {
+                const C = Array.isArray(E) ? E.slice(y.startIndex, y.endIndex + 1) : [], P = t.length > 0 ? t.join(".") : "root";
+                return c({
+                  path: t,
+                  componentId: I,
+                  meta: {
+                    ...u,
+                    arrayViews: { [P]: C },
+                    serverStateIsUpStream: !0
+                  }
                 });
-              }, [u.startIndex, u.endIndex, $.length]),
+              }, [y.startIndex, y.endIndex, E, u]),
               virtualizerProps: {
                 outer: {
-                  ref: i,
+                  ref: g,
                   style: {
                     overflowY: "auto",
                     height: "100%",
@@ -873,1018 +919,689 @@ function Ct(t, r, y, m) {
                 },
                 inner: {
                   style: {
-                    height: `${z}px`,
                     position: "relative"
                   }
                 },
                 list: {
                   style: {
-                    transform: `translateY(${U.current.get($[u.startIndex])?.offset || 0}px)`
+                    transform: `translateY(${D.current.get(E[y.startIndex])?.offset || 0}px)`
                   }
                 }
               },
-              scrollToBottom: C,
-              scrollToIndex: (I, b = "smooth") => {
-                if (i.current && $[I]) {
-                  const A = U.current.get($[I])?.offset || 0;
-                  i.current.scrollTo({ top: A, behavior: b });
+              scrollToBottom: Y,
+              scrollToIndex: (C, P = "smooth") => {
+                if (g.current && E[C]) {
+                  const N = D.current.get(E[C])?.offset || 0;
+                  g.current.scrollTo({ top: N, behavior: P });
                 }
               }
             };
           };
-        if (d === "stateMap")
-          return (n) => {
-            const [o, c] = X(
-              s?.validIds ?? a.getState().getShadowMetadata(t, e)?.arrayKeys
-            ), f = a.getState().getShadowValue(k, s?.validIds);
-            if (!o)
-              throw new Error("No array keys found for mapping");
-            const l = g({
-              path: e,
-              componentId: p,
-              meta: s
+        if (m === "stateMap")
+          return (o) => {
+            const { value: n, keys: d } = B(
+              e,
+              t,
+              u
+            );
+            if (!d || !Array.isArray(n))
+              return [];
+            const v = c({
+              path: t,
+              componentId: I,
+              meta: u
             });
-            return f.map((i, u) => {
-              const E = o[u]?.split(".").slice(1), w = g({
-                path: E,
-                componentId: p,
-                meta: s
+            return n.map((h, g) => {
+              const y = d[g];
+              if (!y) return;
+              const p = [...t, y], b = c({
+                path: p,
+                // This now correctly points to the item in the shadow store.
+                componentId: I,
+                meta: u
               });
-              return n(
-                w,
-                u,
-                l
-              );
+              return o(b, g, v);
             });
           };
-        if (d === "$stateMap")
-          return (n) => st(xt, {
-            proxy: {
-              _stateKey: t,
-              _path: e,
-              _mapFn: n,
-              _meta: s
-            },
-            rebuildStateShape: g
-          });
-        if (d === "stateFind")
-          return (n) => {
-            const o = s?.validIds ?? a.getState().getShadowMetadata(t, e)?.arrayKeys;
-            if (o)
-              for (let c = 0; c < o.length; c++) {
-                const f = o[c];
-                if (!f) continue;
-                const l = a.getState().getShadowValue(f);
-                if (n(l, c)) {
-                  const i = f.split(".").slice(1);
-                  return g({
-                    path: i,
-                    componentId: p,
-                    meta: s
-                    // Pass along meta for potential further chaining
-                  });
-                }
+        if (m === "stateFilter")
+          return (o) => {
+            const n = t.length > 0 ? t.join(".") : "root", { keys: d, value: v } = B(
+              e,
+              t,
+              u
+            );
+            if (!Array.isArray(v))
+              throw new Error("stateFilter can only be used on arrays");
+            const h = [];
+            return v.forEach((g, y) => {
+              if (o(g, y)) {
+                const p = d[y];
+                p && h.push(p);
               }
-          };
-        if (d === "stateFilter")
-          return (n) => {
-            const o = a.getState().getShadowValue([t, ...e].join("."), s?.validIds);
-            if (!Array.isArray(o)) return [];
-            const c = s?.validIds ?? a.getState().getShadowMetadata(t, e)?.arrayKeys;
-            if (!c)
-              throw new Error("No array keys found for filtering.");
-            const f = [];
-            return o.filter(
-              (l, i) => n(l, i) ? (f.push(c[i]), !0) : !1
-            ), g({
-              path: e,
-              componentId: p,
+            }), c({
+              path: t,
+              componentId: I,
               meta: {
-                validIds: f,
+                ...u,
+                arrayViews: {
+                  ...u?.arrayViews || {},
+                  [n]: h
+                },
                 transforms: [
-                  ...s?.transforms || [],
-                  {
-                    type: "filter",
-                    fn: n
-                  }
+                  ...u?.transforms || [],
+                  { type: "filter", fn: o, path: t }
                 ]
               }
             });
           };
-        if (d === "stateSort")
-          return (n) => {
-            const o = a.getState().getShadowValue([t, ...e].join("."), s?.validIds);
-            if (!Array.isArray(o)) return [];
-            const c = s?.validIds ?? a.getState().getShadowMetadata(t, e)?.arrayKeys;
-            if (!c)
+        if (m === "stateSort")
+          return (o) => {
+            const n = t.length > 0 ? t.join(".") : "root", { value: d, keys: v } = B(
+              e,
+              t,
+              u
+            );
+            if (!Array.isArray(d) || !v)
               throw new Error("No array keys found for sorting");
-            const f = o.map((l, i) => ({
-              item: l,
-              key: c[i]
+            const h = d.map((y, p) => ({
+              item: y,
+              key: v[p]
             }));
-            return f.sort((l, i) => n(l.item, i.item)).filter(Boolean), g({
-              path: e,
-              componentId: p,
+            h.sort((y, p) => o(y.item, p.item));
+            const g = h.map((y) => y.key);
+            return c({
+              path: t,
+              componentId: I,
               meta: {
-                validIds: f.map((l) => l.key),
+                ...u,
+                arrayViews: {
+                  ...u?.arrayViews || {},
+                  [n]: g
+                },
                 transforms: [
-                  ...s?.transforms || [],
-                  { type: "sort", fn: n }
+                  ...u?.transforms || [],
+                  { type: "sort", fn: o, path: t }
                 ]
               }
             });
           };
-        if (d === "stream")
-          return function(n = {}) {
+        if (m === "stream")
+          return function(o = {}) {
             const {
-              bufferSize: o = 100,
-              flushInterval: c = 100,
-              bufferStrategy: f = "accumulate",
-              store: l,
-              onFlush: i
-            } = n;
-            let u = [], E = !1, w = null;
-            const V = (z) => {
-              if (!E) {
-                if (f === "sliding" && u.length >= o)
-                  u.shift();
-                else if (f === "dropping" && u.length >= o)
+              bufferSize: n = 100,
+              flushInterval: d = 100,
+              bufferStrategy: v = "accumulate",
+              store: h,
+              onFlush: g
+            } = o;
+            let y = [], p = !1, b = null;
+            const _ = (k) => {
+              if (!p) {
+                if (v === "sliding" && y.length >= n)
+                  y.shift();
+                else if (v === "dropping" && y.length >= n)
                   return;
-                u.push(z), u.length >= o && M();
+                y.push(k), y.length >= n && M();
               }
             }, M = () => {
-              if (u.length === 0) return;
-              const z = [...u];
-              if (u = [], l) {
-                const x = l(z);
-                x !== void 0 && (Array.isArray(x) ? x : [x]).forEach((C) => {
-                  r(C, e, {
+              if (y.length === 0) return;
+              const k = [...y];
+              if (y = [], h) {
+                const j = h(k);
+                j !== void 0 && (Array.isArray(j) ? j : [j]).forEach((Y) => {
+                  r(Y, t, {
                     updateType: "insert"
                   });
                 });
               } else
-                z.forEach((x) => {
-                  r(x, e, {
+                k.forEach((j) => {
+                  r(j, t, {
                     updateType: "insert"
                   });
                 });
-              i?.(z);
+              g?.(k);
             };
-            c > 0 && (w = setInterval(M, c));
-            const _ = tt(), U = a.getState().getShadowMetadata(t, e) || {}, $ = U.streams || /* @__PURE__ */ new Map();
-            return $.set(_, { buffer: u, flushTimer: w }), a.getState().setShadowMetadata(t, e, {
-              ...U,
-              streams: $
+            d > 0 && (b = setInterval(M, d));
+            const A = X(), D = V(e, t) || {}, E = D.streams || /* @__PURE__ */ new Map();
+            return E.set(A, { buffer: y, flushTimer: b }), J(e, t, {
+              ...D,
+              streams: E
             }), {
-              write: (z) => V(z),
-              writeMany: (z) => z.forEach(V),
+              write: (k) => _(k),
+              writeMany: (k) => k.forEach(_),
               flush: () => M(),
               pause: () => {
-                E = !0;
+                p = !0;
               },
               resume: () => {
-                E = !1, u.length > 0 && M();
+                p = !1, y.length > 0 && M();
               },
               close: () => {
-                M(), w && clearInterval(w);
-                const z = a.getState().getShadowMetadata(t, e);
-                z?.streams && z.streams.delete(_);
+                M(), b && clearInterval(b);
+                const k = T.getState().getShadowMetadata(e, t);
+                k?.streams && k.streams.delete(A);
               }
             };
           };
-        if (d === "stateList")
-          return (n) => /* @__PURE__ */ rt(() => {
-            const c = q(/* @__PURE__ */ new Map()), f = s?.transforms && s.transforms.length > 0 ? `${p}-${Ht(s.transforms)}` : `${p}-base`, [l, i] = X({}), { validIds: u, arrayValues: E } = dt(() => {
-              const V = a.getState().getShadowMetadata(t, e)?.transformCaches?.get(f);
-              let M;
-              V && V.validIds ? M = V.validIds : (M = yt(
-                t,
-                e,
-                s?.transforms
-              ), a.getState().setTransformCache(t, e, f, {
-                validIds: M,
-                computedAt: Date.now(),
-                transforms: s?.transforms || []
-              }));
-              const _ = a.getState().getShadowValue(k, M);
-              return {
-                validIds: M,
-                arrayValues: _ || []
-              };
-            }, [f, l]);
-            if (Z(() => {
-              const V = a.getState().subscribeToPath(k, (M) => {
-                if (M.type === "GET_SELECTED")
+        if (m === "stateList")
+          return (o) => /* @__PURE__ */ ie(() => {
+            const d = L(/* @__PURE__ */ new Map()), [v, h] = K({}), g = t.length > 0 ? t.join(".") : "root", y = le(() => ut(e, t, u), [
+              e,
+              t.join("."),
+              // Only recalculate if the underlying array keys or transforms change
+              V(e, t)?.arrayKeys,
+              u?.transforms
+            ]), p = le(() => ({
+              ...u,
+              arrayViews: {
+                ...u?.arrayViews || {},
+                [g]: y
+              }
+            }), [u, g, y]), { value: b } = B(
+              e,
+              t,
+              p
+            );
+            if (W(() => {
+              const A = T.getState().subscribeToPath(F, (D) => {
+                if (D.type === "GET_SELECTED")
                   return;
-                const U = a.getState().getShadowMetadata(t, e)?.transformCaches;
-                if (U)
-                  for (const $ of U.keys())
-                    $.startsWith(p) && U.delete($);
-                (M.type === "INSERT" || M.type === "REMOVE" || M.type === "CLEAR_SELECTION") && i({});
+                const k = T.getState().getShadowMetadata(e, t)?.transformCaches;
+                if (k)
+                  for (const j of k.keys())
+                    j.startsWith(I) && k.delete(j);
+                (D.type === "INSERT" || D.type === "INSERT_MANY" || D.type === "REMOVE" || D.type === "CLEAR_SELECTION" || D.type === "SERVER_STATE_UPDATE" && !u?.serverStateIsUpStream) && h({});
               });
               return () => {
-                V();
+                A();
               };
-            }, [p, k]), !Array.isArray(E))
+            }, [I, F]), !Array.isArray(b))
               return null;
-            const w = g({
-              path: e,
-              componentId: p,
-              meta: {
-                ...s,
-                validIds: u
-              }
-            });
-            return /* @__PURE__ */ rt(kt, { children: E.map((V, M) => {
-              const _ = u[M];
-              if (!_)
+            const _ = c({
+              path: t,
+              componentId: I,
+              meta: p
+              // Use updated meta here
+            }), M = b.map((A, D) => {
+              const E = y[D];
+              if (!E)
                 return null;
-              let U = c.current.get(_);
-              U || (U = tt(), c.current.set(_, U));
-              const $ = _.split(".").slice(1);
-              return st(vt, {
-                key: _,
-                stateKey: t,
-                itemComponentId: U,
-                itemPath: $,
-                localIndex: M,
-                arraySetter: w,
-                rebuildStateShape: g,
-                renderFn: n
+              let k = d.current.get(E);
+              k || (k = X(), d.current.set(E, k));
+              const j = [...t, E];
+              return Ie(Ne, {
+                key: E,
+                stateKey: e,
+                itemComponentId: k,
+                itemPath: j,
+                localIndex: D,
+                arraySetter: _,
+                rebuildStateShape: c,
+                renderFn: o
               });
-            }) });
+            });
+            return /* @__PURE__ */ ie(Ce, { children: M });
           }, {});
-        if (d === "stateFlattenOn")
-          return (n) => {
-            const o = a.getState().getShadowValue([t, ...e].join("."), s?.validIds);
-            return Array.isArray(o) ? (o.flatMap(
-              (f) => f[n] ?? []
-            ), g({
-              path: [...e, "[*]", n],
-              componentId: p,
-              meta: s
-            })) : [];
+        if (m === "stateFlattenOn")
+          return (o) => {
+            const n = t.length > 0 ? t.join(".") : "root", d = u?.arrayViews?.[n], v = T.getState().getShadowValue(e, t, d);
+            return Array.isArray(v) ? c({
+              path: [...t, "[*]", o],
+              componentId: I,
+              meta: u
+            }) : [];
           };
-        if (d === "index")
-          return (n) => {
-            const c = a.getState().getShadowMetadata(t, e)?.arrayKeys?.filter(
-              (l) => !s?.validIds || s?.validIds && s?.validIds?.includes(l)
-            )?.[n];
-            return c ? (a.getState().getShadowValue(c, s?.validIds), g({
-              path: c.split(".").slice(1),
-              componentId: p,
-              meta: s
-            })) : void 0;
+        if (m === "index")
+          return (o) => {
+            const n = t.length > 0 ? t.join(".") : "root", d = u?.arrayViews?.[n];
+            if (d) {
+              const g = d[o];
+              return g ? c({
+                path: [...t, g],
+                componentId: I,
+                meta: u
+              }) : void 0;
+            }
+            const v = V(e, t);
+            if (!v?.arrayKeys) return;
+            const h = v.arrayKeys[o];
+            if (h)
+              return c({
+                path: [...t, h],
+                componentId: I,
+                meta: u
+              });
           };
-        if (d === "last")
+        if (m === "last")
           return () => {
-            const n = a.getState().getShadowValue(t, e);
-            if (n.length === 0) return;
-            const o = n.length - 1;
-            n[o];
-            const c = [...e, o.toString()];
-            return g({
-              path: c,
-              componentId: p,
-              meta: s
+            const { keys: o } = B(e, t, u);
+            if (!o || o.length === 0)
+              return;
+            const n = o[o.length - 1];
+            if (!n)
+              return;
+            const d = [...t, n];
+            return c({
+              path: d,
+              componentId: I,
+              meta: u
             });
           };
-        if (d === "insert")
-          return (n, o) => (r(n, e, { updateType: "insert" }), g({
-            path: e,
-            componentId: p,
-            meta: s
-          }));
-        if (d === "uniqueInsert")
-          return (n, o, c) => {
-            const f = a.getState().getShadowValue(t, e), l = K(n) ? n(f) : n;
-            let i = null;
-            if (!f.some((E) => {
-              const w = o ? o.every(
-                (V) => nt(E[V], l[V])
-              ) : nt(E, l);
-              return w && (i = E), w;
+        if (m === "insert")
+          return (o, n) => {
+            r(o, t, { updateType: "insert" });
+          };
+        if (m === "uniqueInsert")
+          return (o, n, d) => {
+            const { value: v } = Q(
+              e,
+              t,
+              u
+            ), h = z(o) ? o(v) : o;
+            let g = null;
+            if (!v.some((p) => {
+              const b = n ? n.every(
+                (_) => ae(p[_], h[_])
+              ) : ae(p, h);
+              return b && (g = p), b;
             }))
-              r(l, e, { updateType: "insert" });
-            else if (c && i) {
-              const E = c(i), w = f.map(
-                (V) => nt(V, i) ? E : V
+              r(h, t, { updateType: "insert" });
+            else if (d && g) {
+              const p = d(g), b = v.map(
+                (_) => ae(_, g) ? p : _
               );
-              r(w, e, {
+              r(b, t, {
                 updateType: "update"
               });
             }
           };
-        if (d === "cut")
-          return (n, o) => {
-            const c = a.getState().getShadowValue([t, ...e].join("."), s?.validIds), f = s?.validIds ?? a.getState().getShadowMetadata(t, e)?.arrayKeys;
-            if (!f || f.length === 0) return;
-            const l = n == -1 ? f.length - 1 : n !== void 0 ? n : f.length - 1, i = f[l];
-            if (!i) return;
-            const u = i.split(".").slice(1);
-            r(c, u, {
+        if (m === "cut")
+          return (o, n) => {
+            const d = V(e, t);
+            if (!d?.arrayKeys || d.arrayKeys.length === 0)
+              return;
+            const v = o === -1 ? d.arrayKeys.length - 1 : o !== void 0 ? o : d.arrayKeys.length - 1, h = d.arrayKeys[v];
+            h && r(null, [...t, h], {
               updateType: "cut"
             });
           };
-        if (d === "cutSelected")
+        if (m === "cutSelected")
           return () => {
-            const n = yt(t, e, s?.transforms), o = a.getState().getShadowValue([t, ...e].join("."), s?.validIds);
-            if (!n || n.length === 0) return;
-            const c = a.getState().selectedIndicesMap.get(k);
-            let f = n.findIndex(
-              (u) => u === c
-            );
-            const l = n[f == -1 ? n.length - 1 : f]?.split(".").slice(1);
-            a.getState().clearSelectedIndex({ arrayKey: k });
-            const i = l?.slice(0, -1);
-            ut(t, i), r(o, l, {
+            const o = [e, ...t].join("."), { keys: n } = B(e, t, u);
+            if (!n || n.length === 0)
+              return;
+            const d = T.getState().selectedIndicesMap.get(o);
+            if (!d)
+              return;
+            const v = d.split(".").pop();
+            if (!n.includes(v))
+              return;
+            const h = d.split(".").slice(1);
+            T.getState().clearSelectedIndex({ arrayKey: o });
+            const g = h.slice(0, -1);
+            ne(e, g), r(null, h, {
               updateType: "cut"
             });
           };
-        if (d === "cutByValue")
-          return (n) => {
-            const o = a.getState().getShadowMetadata(t, e), c = s?.validIds ?? o?.arrayKeys;
-            if (!c) return;
-            let f = null;
-            for (const l of c)
-              if (a.getState().getShadowValue(l) === n) {
-                f = l;
-                break;
-              }
-            if (f) {
-              const l = f.split(".").slice(1);
-              r(null, l, { updateType: "cut" });
-            }
+        if (m === "cutByValue")
+          return (o) => {
+            const {
+              isArray: n,
+              value: d,
+              keys: v
+            } = B(e, t, u);
+            if (!n) return;
+            const h = ve(d, v, (g) => g === o);
+            h && r(null, [...t, h.key], {
+              updateType: "cut"
+            });
           };
-        if (d === "toggleByValue")
-          return (n) => {
-            const o = a.getState().getShadowMetadata(t, e), c = s?.validIds ?? o?.arrayKeys;
-            if (!c) return;
-            let f = null;
-            for (const l of c) {
-              const i = a.getState().getShadowValue(l);
-              if (console.log("itemValue sdasdasdasd", i), i === n) {
-                f = l;
-                break;
-              }
-            }
-            if (console.log("itemValue keyToCut", f), f) {
-              const l = f.split(".").slice(1);
-              console.log("itemValue keyToCut", f), r(n, l, {
+        if (m === "toggleByValue")
+          return (o) => {
+            const {
+              isArray: n,
+              value: d,
+              keys: v
+            } = B(e, t, u);
+            if (!n) return;
+            const h = ve(d, v, (g) => g === o);
+            if (h) {
+              const g = [...t, h.key];
+              r(null, g, {
                 updateType: "cut"
               });
             } else
-              r(n, e, { updateType: "insert" });
+              r(o, t, { updateType: "insert" });
           };
-        if (d === "findWith")
-          return (n, o) => {
-            const c = a.getState().getShadowMetadata(t, e)?.arrayKeys;
-            if (!c)
-              throw new Error("No array keys found for sorting");
-            let f = [];
-            for (const l of c) {
-              let i = a.getState().getShadowValue(l, s?.validIds);
-              if (i && i[n] === o) {
-                f = l.split(".").slice(1);
-                break;
-              }
-            }
-            return g({
-              path: f,
-              componentId: p,
-              meta: s
+        if (m === "findWith")
+          return (o, n) => {
+            const { isArray: d, value: v, keys: h } = B(e, t, u);
+            if (!d)
+              throw new Error("findWith can only be used on arrays");
+            const g = ve(
+              v,
+              h,
+              (y) => y?.[o] === n
+            );
+            return c(g ? {
+              path: [...t, g.key],
+              componentId: I,
+              meta: u
+            } : {
+              path: [...t, `not_found_${X()}`],
+              componentId: I,
+              meta: u
             });
           };
-        if (d === "cutThis") {
-          let n = a.getState().getShadowValue(e.join("."));
-          return () => {
-            r(n, e, { updateType: "cut" });
+        if (m === "cutThis") {
+          const { value: o } = Q(e, t, u), n = t.slice(0, -1);
+          return ne(e, n), () => {
+            r(o, t, { updateType: "cut" });
           };
         }
-        if (d === "get")
-          return () => (Mt(t, p, e), a.getState().getShadowValue(k, s?.validIds));
-        if (d === "getState")
-          return () => a.getState().getShadowValue(k, s?.validIds);
-        if (d === "$derive")
-          return (n) => Tt({
-            _stateKey: t,
-            _path: e,
-            _effect: n.toString(),
-            _meta: s
+        if (m === "get")
+          return () => {
+            Ae(e, I, t);
+            const { value: o } = Q(e, t, u);
+            return o;
+          };
+        if (m === "$derive")
+          return (o) => _e({
+            _stateKey: e,
+            _path: t,
+            _effect: o.toString(),
+            _meta: u
           });
-        if (d === "$get")
-          return () => Tt({ _stateKey: t, _path: e, _meta: s });
-        if (d === "lastSynced") {
-          const n = `${t}:${e.join(".")}`;
-          return a.getState().getSyncInfo(n);
+        if (m === "$get")
+          return () => _e({ _stateKey: e, _path: t, _meta: u });
+        if (m === "lastSynced") {
+          const o = `${e}:${t.join(".")}`;
+          return Ye(o);
         }
-        if (d == "getLocalStorage")
-          return (n) => ft(m + "-" + t + "-" + n);
-        if (d === "isSelected") {
-          const n = [t, ...e].slice(0, -1);
-          if (ut(t, e, void 0), Array.isArray(
-            a.getState().getShadowValue(n.join("."), s?.validIds)
-          )) {
-            e[e.length - 1];
-            const o = n.join("."), c = a.getState().selectedIndicesMap.get(o), f = t + "." + e.join(".");
-            return c === f;
+        if (m == "getLocalStorage")
+          return (o) => ge(a + "-" + e + "-" + o);
+        if (m === "isSelected") {
+          const o = t.slice(0, -1);
+          if (V(e, o)?.arrayKeys) {
+            const d = e + "." + o.join("."), v = T.getState().selectedIndicesMap.get(d), h = e + "." + t.join(".");
+            return v === h;
           }
           return;
         }
-        if (d === "setSelected")
-          return (n) => {
-            const o = e.slice(0, -1), c = t + "." + o.join("."), f = t + "." + e.join(".");
-            ut(t, o, void 0), a.getState().selectedIndicesMap.get(c), n && a.getState().setSelectedIndex(c, f);
+        if (m === "setSelected")
+          return (o) => {
+            const n = t.slice(0, -1), d = e + "." + n.join("."), v = e + "." + t.join(".");
+            ne(e, n, void 0), T.getState().selectedIndicesMap.get(d), o && T.getState().setSelectedIndex(d, v);
           };
-        if (d === "toggleSelected")
+        if (m === "toggleSelected")
           return () => {
-            const n = e.slice(0, -1), o = t + "." + n.join("."), c = t + "." + e.join(".");
-            a.getState().selectedIndicesMap.get(o) === c ? a.getState().clearSelectedIndex({ arrayKey: o }) : a.getState().setSelectedIndex(o, c);
+            const o = t.slice(0, -1), n = e + "." + o.join("."), d = e + "." + t.join(".");
+            T.getState().selectedIndicesMap.get(n) === d ? T.getState().clearSelectedIndex({ arrayKey: n }) : T.getState().setSelectedIndex(n, d), ne(e, o);
           };
-        if (d === "_componentId")
-          return p;
-        if (e.length == 0) {
-          if (d === "addZodValidation")
-            return (n) => {
-              a.getState().getInitialOptions(t)?.validation, n.forEach((o) => {
-                const c = a.getState().getShadowMetadata(t, o.path) || {};
-                a.getState().setShadowMetadata(t, o.path, {
-                  ...c,
+        if (m === "_componentId")
+          return I;
+        if (t.length == 0) {
+          if (m === "addZodValidation")
+            return (o) => {
+              o.forEach((n) => {
+                const d = T.getState().getShadowMetadata(e, n.path) || {};
+                T.getState().setShadowMetadata(e, n.path, {
+                  ...d,
                   validation: {
-                    status: "VALIDATION_FAILED",
-                    message: o.message,
+                    status: "INVALID",
+                    errors: [
+                      {
+                        source: "client",
+                        message: n.message,
+                        severity: "error",
+                        code: n.code
+                      }
+                    ],
+                    lastValidated: Date.now(),
                     validatedValue: void 0
                   }
-                }), a.getState().notifyPathSubscribers(o.path, {
-                  type: "VALIDATION_FAILED",
-                  message: o.message,
-                  validatedValue: void 0
                 });
               });
             };
-          if (d === "clearZodValidation")
-            return (n) => {
-              if (!n)
+          if (m === "clearZodValidation")
+            return (o) => {
+              if (!o)
                 throw new Error("clearZodValidation requires a path");
-              const o = a.getState().getShadowMetadata(t, n) || {};
-              o.validation && (a.getState().setShadowMetadata(t, n, {
-                ...o,
-                validation: void 0
-              }), a.getState().notifyPathSubscribers([t, ...n].join("."), {
-                type: "VALIDATION_CLEARED"
-              }));
+              const n = V(e, o) || {};
+              J(e, o, {
+                ...n,
+                validation: {
+                  status: "NOT_VALIDATED",
+                  errors: [],
+                  lastValidated: Date.now()
+                }
+              });
             };
-          if (d === "applyJsonPatch")
-            return (n) => {
-              const o = a.getState(), c = o.getShadowMetadata(t, []);
-              if (!c?.components) return;
-              const f = (i) => !i || i === "/" ? [] : i.split("/").slice(1).map((u) => u.replace(/~1/g, "/").replace(/~0/g, "~")), l = /* @__PURE__ */ new Set();
-              for (const i of n) {
-                const u = f(i.path);
-                switch (i.op) {
+          if (m === "applyJsonPatch")
+            return (o) => {
+              const n = T.getState(), d = n.getShadowMetadata(e, []);
+              if (!d?.components) return;
+              const v = (g) => !g || g === "/" ? [] : g.split("/").slice(1).map((y) => y.replace(/~1/g, "/").replace(/~0/g, "~")), h = /* @__PURE__ */ new Set();
+              for (const g of o) {
+                const y = v(g.path);
+                switch (g.op) {
                   case "add":
                   case "replace": {
-                    const { value: E } = i;
-                    o.updateShadowAtPath(t, u, E), o.markAsDirty(t, u, { bubble: !0 });
-                    let w = [...u];
+                    const { value: p } = g;
+                    n.updateShadowAtPath(e, y, p), n.markAsDirty(e, y, { bubble: !0 });
+                    let b = [...y];
                     for (; ; ) {
-                      const V = o.getShadowMetadata(
-                        t,
-                        w
+                      const _ = n.getShadowMetadata(
+                        e,
+                        b
                       );
-                      if (V?.pathComponents && V.pathComponents.forEach((M) => {
-                        if (!l.has(M)) {
-                          const _ = c.components?.get(M);
-                          _ && (_.forceUpdate(), l.add(M));
+                      if (_?.pathComponents && _.pathComponents.forEach((M) => {
+                        if (!h.has(M)) {
+                          const A = d.components?.get(M);
+                          A && (A.forceUpdate(), h.add(M));
                         }
-                      }), w.length === 0) break;
-                      w.pop();
+                      }), b.length === 0) break;
+                      b.pop();
                     }
                     break;
                   }
                   case "remove": {
-                    const E = u.slice(0, -1);
-                    o.removeShadowArrayElement(t, u), o.markAsDirty(t, E, { bubble: !0 });
-                    let w = [...E];
+                    const p = y.slice(0, -1);
+                    n.removeShadowArrayElement(e, y), n.markAsDirty(e, p, { bubble: !0 });
+                    let b = [...p];
                     for (; ; ) {
-                      const V = o.getShadowMetadata(
-                        t,
-                        w
+                      const _ = n.getShadowMetadata(
+                        e,
+                        b
                       );
-                      if (V?.pathComponents && V.pathComponents.forEach((M) => {
-                        if (!l.has(M)) {
-                          const _ = c.components?.get(M);
-                          _ && (_.forceUpdate(), l.add(M));
+                      if (_?.pathComponents && _.pathComponents.forEach((M) => {
+                        if (!h.has(M)) {
+                          const A = d.components?.get(M);
+                          A && (A.forceUpdate(), h.add(M));
                         }
-                      }), w.length === 0) break;
-                      w.pop();
+                      }), b.length === 0) break;
+                      b.pop();
                     }
                     break;
                   }
                 }
               }
             };
-          if (d === "getComponents")
-            return () => a.getState().getShadowMetadata(t, [])?.components;
-          if (d === "getAllFormRefs")
-            return () => ht.getState().getFormRefsByStateKey(t);
+          if (m === "getComponents")
+            return () => V(e, [])?.components;
+          if (m === "getAllFormRefs")
+            return () => Ee.getState().getFormRefsByStateKey(e);
         }
-        if (d === "getFormRef")
-          return () => ht.getState().getFormRef(t + "." + e.join("."));
-        if (d === "validationWrapper")
+        if (m === "getFormRef")
+          return () => Ee.getState().getFormRef(e + "." + t.join("."));
+        if (m === "validationWrapper")
           return ({
-            children: n,
-            hideMessage: o
-          }) => /* @__PURE__ */ rt(
-            Vt,
+            children: o,
+            hideMessage: n
+          }) => /* @__PURE__ */ ie(
+            je,
             {
-              formOpts: o ? { validation: { message: "" } } : void 0,
-              path: e,
-              stateKey: t,
-              children: n
+              formOpts: n ? { validation: { message: "" } } : void 0,
+              path: t,
+              stateKey: e,
+              children: o
             }
           );
-        if (d === "_stateKey") return t;
-        if (d === "_path") return e;
-        if (d === "update")
-          return (n) => {
-            const c = new Error().stack || "";
-            if (c.includes("onClick") || c.includes("dispatchEvent") || c.includes("batchedUpdates")) {
-              const l = `${t}.${e.join(".")}`;
-              gt || (ct.clear(), gt = !0, queueMicrotask(() => {
-                for (const [u, E] of ct) {
-                  const w = u.split(".");
-                  w[0];
-                  const V = w.slice(1), M = E.reduce(
-                    (_, U) => typeof U == "function" && typeof _ == "function" ? ($) => U(_($)) : U
-                  );
-                  r(M, V, {
-                    updateType: "update"
-                  });
-                }
-                ct.clear(), gt = !1;
-              }));
-              const i = ct.get(l) || [];
-              i.push(n), ct.set(l, i);
-            } else
-              r(n, e, { updateType: "update" });
-            return {
-              synced: () => {
-                const l = a.getState().getShadowMetadata(t, e);
-                a.getState().setShadowMetadata(t, e, {
-                  ...l,
-                  isDirty: !1,
-                  stateSource: "server",
-                  lastServerSync: Date.now()
-                });
-                const i = [t, ...e].join(".");
-                a.getState().notifyPathSubscribers(i, {
-                  type: "SYNC_STATUS_CHANGE",
-                  isDirty: !1
-                });
-              }
-            };
-          };
-        if (d === "toggle") {
-          const n = a.getState().getShadowValue([t, ...e].join("."), s?.validIds);
-          if (typeof n != "boolean")
+        if (m === "_stateKey") return e;
+        if (m === "_path") return t;
+        if (m === "update")
+          return (o) => (console.log("udpating", o, t), r(o, t, { updateType: "update" }), {
+            synced: () => {
+              const n = T.getState().getShadowMetadata(e, t);
+              J(e, t, {
+                ...n,
+                isDirty: !1,
+                stateSource: "server",
+                lastServerSync: Date.now()
+              });
+              const d = [e, ...t].join(".");
+              Qe(d, {
+                type: "SYNC_STATUS_CHANGE",
+                isDirty: !1
+              });
+            }
+          });
+        if (m === "toggle") {
+          const { value: o } = Q(
+            e,
+            t,
+            u
+          );
+          if (typeof o != "boolean")
             throw new Error("toggle() can only be used on boolean values");
           return () => {
-            r(!n, e, {
+            r(!o, t, {
               updateType: "update"
             });
           };
         }
-        if (d === "formElement")
-          return (n, o) => /* @__PURE__ */ rt(
-            Gt,
+        if (m === "formElement")
+          return (o, n) => /* @__PURE__ */ ie(
+            Oe,
             {
-              stateKey: t,
-              path: e,
-              rebuildStateShape: g,
+              stateKey: e,
+              path: t,
+              rebuildStateShape: c,
               setState: r,
-              formOpts: o,
-              renderFn: n
+              formOpts: n,
+              renderFn: o
             }
           );
-        const J = [...e, d];
-        return a.getState().getShadowValue(t, J), g({
-          path: J,
-          componentId: p,
-          meta: s
+        const te = [...t, m];
+        return T.getState().getShadowValue(e, te), c({
+          path: te,
+          componentId: I,
+          meta: u
         });
       }
-    }, S = new Proxy(N, G);
-    return v.set(j, S), S;
+    }, w = new Proxy({}, x);
+    return S.set(O, w), w;
   }
-  const T = {
-    revertToInitialState: (e) => {
-      a.getState().getInitialOptions(t)?.validation;
-      const s = a.getState().getShadowMetadata(t, []);
-      s?.stateSource === "server" && s.baseServerState ? s.baseServerState : a.getState().initialStateGlobal[t];
-      const p = a.getState().initialStateGlobal[t];
-      a.getState().clearSelectedIndexesForState(t), a.getState().initializeShadowState(t, p), g({
+  const i = {
+    revertToInitialState: (t) => {
+      const u = T.getState().getShadowMetadata(e, []);
+      u?.stateSource === "server" && u.baseServerState ? u.baseServerState : T.getState().initialStateGlobal[e];
+      const I = T.getState().initialStateGlobal[e];
+      He(e), oe(e, I), c({
         path: [],
-        componentId: y
+        componentId: l
       });
-      const F = et(t), j = K(F?.localStorage?.key) ? F?.localStorage?.key(p) : F?.localStorage?.key, k = `${m}-${t}-${j}`;
-      k && localStorage.removeItem(k);
-      const N = a.getState().getShadowMetadata(t, []);
-      return N && N?.components?.forEach((G) => {
-        G.forceUpdate();
-      }), p;
+      const U = G(e), O = z(U?.localStorage?.key) ? U?.localStorage?.key(I) : U?.localStorage?.key, F = `${a}-${e}-${O}`;
+      F && localStorage.removeItem(F);
+      const x = T.getState().getShadowMetadata(e, []);
+      return x && x?.components?.forEach((w) => {
+        w.forceUpdate();
+      }), I;
     },
-    updateInitialState: (e) => {
-      const s = Ct(
-        t,
+    updateInitialState: (t) => {
+      const u = Pe(
+        e,
         r,
-        y,
-        m
-      ), p = a.getState().initialStateGlobal[t], F = et(t), j = K(F?.localStorage?.key) ? F?.localStorage?.key(p) : F?.localStorage?.key, k = `${m}-${t}-${j}`;
-      return localStorage.getItem(k) && localStorage.removeItem(k), Ot(() => {
-        _t(t, e), a.getState().initializeShadowState(t, e);
-        const N = a.getState().getShadowMetadata(t, []);
-        N && N?.components?.forEach((G) => {
-          G.forceUpdate();
+        l,
+        a
+      ), I = T.getState().initialStateGlobal[e], U = G(e), O = z(U?.localStorage?.key) ? U?.localStorage?.key(I) : U?.localStorage?.key, F = `${a}-${e}-${O}`;
+      return localStorage.getItem(F) && localStorage.removeItem(F), De(() => {
+        ke(e, t), oe(e, t);
+        const x = T.getState().getShadowMetadata(e, []);
+        x && x?.components?.forEach((w) => {
+          w.forceUpdate();
         });
       }), {
-        fetchId: (N) => s.get()[N]
+        fetchId: (x) => u.get()[x]
       };
     }
   };
-  return g({
-    componentId: y,
+  return c({
+    componentId: l,
     path: []
   });
 }
-function Tt(t) {
-  return st(Bt, { proxy: t });
-}
-function xt({
-  proxy: t,
-  rebuildStateShape: r
-}) {
-  const y = q(null), m = q(`map-${crypto.randomUUID()}`), v = q(!1), g = q(/* @__PURE__ */ new Map());
-  Z(() => {
-    const h = y.current;
-    if (!h || v.current) return;
-    const e = setTimeout(() => {
-      const s = a.getState().getShadowMetadata(t._stateKey, t._path) || {}, p = s.mapWrappers || [];
-      p.push({
-        instanceId: m.current,
-        mapFn: t._mapFn,
-        containerRef: h,
-        rebuildStateShape: r,
-        path: t._path,
-        componentId: m.current,
-        meta: t._meta
-      }), a.getState().setShadowMetadata(t._stateKey, t._path, {
-        ...s,
-        mapWrappers: p
-      }), v.current = !0, T();
-    }, 0);
-    return () => {
-      if (clearTimeout(e), m.current) {
-        const s = a.getState().getShadowMetadata(t._stateKey, t._path) || {};
-        s.mapWrappers && (s.mapWrappers = s.mapWrappers.filter(
-          (p) => p.instanceId !== m.current
-        ), a.getState().setShadowMetadata(t._stateKey, t._path, s));
-      }
-      g.current.forEach((s) => s.unmount());
-    };
-  }, []);
-  const T = () => {
-    const h = y.current;
-    if (!h) return;
-    const e = a.getState().getShadowValue(
-      [t._stateKey, ...t._path].join("."),
-      t._meta?.validIds
-    );
-    if (!Array.isArray(e)) return;
-    const s = t._meta?.validIds ?? a.getState().getShadowMetadata(t._stateKey, t._path)?.arrayKeys ?? [], p = r({
-      currentState: e,
-      path: t._path,
-      componentId: m.current,
-      meta: t._meta
-    });
-    e.forEach((F, j) => {
-      const k = s[j];
-      if (!k) return;
-      const N = tt(), G = document.createElement("div");
-      G.setAttribute("data-item-path", k), h.appendChild(G);
-      const S = bt(G);
-      g.current.set(k, S);
-      const Q = k.split(".").slice(1);
-      S.render(
-        st(vt, {
-          stateKey: t._stateKey,
-          itemComponentId: N,
-          itemPath: Q,
-          localIndex: j,
-          arraySetter: p,
-          rebuildStateShape: r,
-          renderFn: t._mapFn
-        })
-      );
-    });
-  };
-  return /* @__PURE__ */ rt("div", { ref: y, "data-map-container": m.current });
+function _e(e) {
+  return Ie(dt, { proxy: e });
 }
-function Bt({
-  proxy: t
+function dt({
+  proxy: e
 }) {
-  const r = q(null), y = q(null), m = q(!1), v = `${t._stateKey}-${t._path.join(".")}`, g = a.getState().getShadowValue(
-    [t._stateKey, ...t._path].join("."),
-    t._meta?.validIds
-  );
-  return Z(() => {
-    const T = r.current;
-    if (!T || m.current) return;
-    const h = setTimeout(() => {
-      if (!T.parentElement) {
-        console.warn("Parent element not found for signal", v);
+  const r = L(null), l = L(null), a = L(!1), S = `${e._stateKey}-${e._path.join(".")}`, s = e._path.length > 0 ? e._path.join(".") : "root", c = e._meta?.arrayViews?.[s], i = R(e._stateKey, e._path, c);
+  return W(() => {
+    const f = r.current;
+    if (!f || a.current) return;
+    const t = setTimeout(() => {
+      if (!f.parentElement) {
+        console.warn("Parent element not found for signal", S);
         return;
       }
-      const e = T.parentElement, p = Array.from(e.childNodes).indexOf(T);
-      let F = e.getAttribute("data-parent-id");
-      F || (F = `parent-${crypto.randomUUID()}`, e.setAttribute("data-parent-id", F)), y.current = `instance-${crypto.randomUUID()}`;
-      const j = a.getState().getShadowMetadata(t._stateKey, t._path) || {}, k = j.signals || [];
-      k.push({
-        instanceId: y.current,
-        parentId: F,
-        position: p,
-        effect: t._effect
-      }), a.getState().setShadowMetadata(t._stateKey, t._path, {
-        ...j,
-        signals: k
+      const u = f.parentElement, U = Array.from(u.childNodes).indexOf(f);
+      let O = u.getAttribute("data-parent-id");
+      O || (O = `parent-${crypto.randomUUID()}`, u.setAttribute("data-parent-id", O)), l.current = `instance-${crypto.randomUUID()}`;
+      const F = T.getState().getShadowMetadata(e._stateKey, e._path) || {}, x = F.signals || [];
+      x.push({
+        instanceId: l.current,
+        parentId: O,
+        position: U,
+        effect: e._effect
+      }), T.getState().setShadowMetadata(e._stateKey, e._path, {
+        ...F,
+        signals: x
       });
-      let N = g;
-      if (t._effect)
+      let w = i;
+      if (e._effect)
         try {
-          N = new Function(
+          w = new Function(
             "state",
-            `return (${t._effect})(state)`
-          )(g);
-        } catch (S) {
-          console.error("Error evaluating effect function:", S);
+            `return (${e._effect})(state)`
+          )(i);
+        } catch (m) {
+          console.error("Error evaluating effect function:", m);
         }
-      N !== null && typeof N == "object" && (N = JSON.stringify(N));
-      const G = document.createTextNode(String(N ?? ""));
-      T.replaceWith(G), m.current = !0;
+      w !== null && typeof w == "object" && (w = JSON.stringify(w));
+      const ee = document.createTextNode(String(w ?? ""));
+      f.replaceWith(ee), a.current = !0;
     }, 0);
     return () => {
-      if (clearTimeout(h), y.current) {
-        const e = a.getState().getShadowMetadata(t._stateKey, t._path) || {};
-        e.signals && (e.signals = e.signals.filter(
-          (s) => s.instanceId !== y.current
-        ), a.getState().setShadowMetadata(t._stateKey, t._path, e));
+      if (clearTimeout(t), l.current) {
+        const u = T.getState().getShadowMetadata(e._stateKey, e._path) || {};
+        u.signals && (u.signals = u.signals.filter(
+          (I) => I.instanceId !== l.current
+        ), T.getState().setShadowMetadata(e._stateKey, e._path, u));
       }
     };
-  }, []), st("span", {
+  }, []), Ie("span", {
     ref: r,
     style: { display: "contents" },
-    "data-signal-id": v
-  });
-}
-const vt = Dt(
-  zt,
-  (t, r) => t.itemPath.join(".") === r.itemPath.join(".") && t.stateKey === r.stateKey && t.itemComponentId === r.itemComponentId && t.localIndex === r.localIndex
-), qt = (t) => {
-  const [r, y] = X(!1);
-  return lt(() => {
-    if (!t.current) {
-      y(!0);
-      return;
-    }
-    const m = Array.from(t.current.querySelectorAll("img"));
-    if (m.length === 0) {
-      y(!0);
-      return;
-    }
-    let v = 0;
-    const g = () => {
-      v++, v === m.length && y(!0);
-    };
-    return m.forEach((T) => {
-      T.complete ? g() : (T.addEventListener("load", g), T.addEventListener("error", g));
-    }), () => {
-      m.forEach((T) => {
-        T.removeEventListener("load", g), T.removeEventListener("error", g);
-      });
-    };
-  }, [t.current]), r;
-};
-function zt({
-  stateKey: t,
-  itemComponentId: r,
-  itemPath: y,
-  localIndex: m,
-  arraySetter: v,
-  rebuildStateShape: g,
-  renderFn: T
-}) {
-  const [, h] = X({}), { ref: e, inView: s } = $t(), p = q(null), F = qt(p), j = q(!1), k = [t, ...y].join(".");
-  Pt(t, r, h);
-  const N = ot(
-    (W) => {
-      p.current = W, e(W);
-    },
-    [e]
-  );
-  Z(() => {
-    a.getState().subscribeToPath(k, (W) => {
-      h({});
-    });
-  }, []), Z(() => {
-    if (!s || !F || j.current)
-      return;
-    const W = p.current;
-    if (W && W.offsetHeight > 0) {
-      j.current = !0;
-      const J = W.offsetHeight;
-      a.getState().setShadowMetadata(t, y, {
-        virtualizer: {
-          itemHeight: J,
-          domRef: W
-        }
-      });
-      const n = y.slice(0, -1), o = [t, ...n].join(".");
-      a.getState().notifyPathSubscribers(o, {
-        type: "ITEMHEIGHT",
-        itemKey: y.join("."),
-        ref: p.current
-      });
-    }
-  }, [s, F, t, y]);
-  const G = [t, ...y].join("."), S = a.getState().getShadowValue(G);
-  if (S === void 0)
-    return null;
-  const Q = g({
-    currentState: S,
-    path: y,
-    componentId: r
-  }), d = T(Q, m, v);
-  return /* @__PURE__ */ rt("div", { ref: N, children: d });
-}
-function Gt({
-  stateKey: t,
-  path: r,
-  rebuildStateShape: y,
-  renderFn: m,
-  formOpts: v,
-  setState: g
-}) {
-  const [T] = X(() => tt()), [, h] = X({}), e = [t, ...r].join(".");
-  Pt(t, T, h);
-  const s = a.getState().getShadowValue(e), [p, F] = X(s), j = q(!1), k = q(null);
-  Z(() => {
-    !j.current && !nt(s, p) && F(s);
-  }, [s]), Z(() => {
-    const d = a.getState().subscribeToPath(e, (W) => {
-      !j.current && p !== W && h({});
-    });
-    return () => {
-      d(), k.current && (clearTimeout(k.current), j.current = !1);
-    };
-  }, []);
-  const N = ot(
-    (d) => {
-      typeof s === "number" && typeof d == "string" && (d = d === "" ? 0 : Number(d)), F(d), j.current = !0, k.current && clearTimeout(k.current);
-      const J = v?.debounceTime ?? 200;
-      k.current = setTimeout(() => {
-        j.current = !1, g(d, r, { updateType: "update" });
-        const { getInitialOptions: n, setShadowMetadata: o, getShadowMetadata: c } = a.getState(), f = n(t)?.validation, l = f?.zodSchemaV4 || f?.zodSchemaV3;
-        if (l) {
-          const i = a.getState().getShadowValue(t), u = l.safeParse(i), E = c(t, r) || {};
-          if (u.success)
-            o(t, r, {
-              ...E,
-              validation: {
-                status: "VALID_LIVE",
-                validatedValue: d,
-                message: void 0
-              }
-            });
-          else {
-            const V = ("issues" in u.error ? u.error.issues : u.error.errors).filter(
-              (M) => JSON.stringify(M.path) === JSON.stringify(r)
-            );
-            V.length > 0 ? o(t, r, {
-              ...E,
-              validation: {
-                status: "INVALID_LIVE",
-                message: V[0]?.message,
-                validatedValue: d
-              }
-            }) : o(t, r, {
-              ...E,
-              validation: {
-                status: "VALID_LIVE",
-                validatedValue: d,
-                message: void 0
-              }
-            });
-          }
-        }
-      }, J), h({});
-    },
-    [g, r, v?.debounceTime, t]
-  ), G = ot(async () => {
-    console.log("handleBlur triggered"), k.current && (clearTimeout(k.current), k.current = null, j.current = !1, g(p, r, { updateType: "update" }));
-    const { getInitialOptions: d } = a.getState(), W = d(t)?.validation, J = W?.zodSchemaV4 || W?.zodSchemaV3;
-    if (!J) return;
-    const n = a.getState().getShadowMetadata(t, r);
-    a.getState().setShadowMetadata(t, r, {
-      ...n,
-      validation: {
-        status: "DIRTY",
-        validatedValue: p
-      }
-    });
-    const o = a.getState().getShadowValue(t), c = J.safeParse(o);
-    if (console.log("result ", c), c.success)
-      a.getState().setShadowMetadata(t, r, {
-        ...n,
-        validation: {
-          status: "VALID_PENDING_SYNC",
-          validatedValue: p
-        }
-      });
-    else {
-      const f = "issues" in c.error ? c.error.issues : c.error.errors;
-      console.log("All validation errors:", f), console.log("Current blur path:", r);
-      const l = f.filter((i) => {
-        if (console.log("Processing error:", i), r.some((E) => E.startsWith("id:"))) {
-          console.log("Detected array path with ULID");
-          const E = r[0].startsWith("id:") ? [] : r.slice(0, -1);
-          console.log("Parent path:", E);
-          const w = a.getState().getShadowMetadata(t, E);
-          if (console.log("Array metadata:", w), w?.arrayKeys) {
-            const V = [t, ...r.slice(0, -1)].join("."), M = w.arrayKeys.indexOf(V);
-            console.log("Item key:", V, "Index:", M);
-            const _ = [...E, M, ...r.slice(-1)], U = JSON.stringify(i.path) === JSON.stringify(_);
-            return console.log("Zod path comparison:", {
-              zodPath: _,
-              errorPath: i.path,
-              match: U
-            }), U;
-          }
-        }
-        const u = JSON.stringify(i.path) === JSON.stringify(r);
-        return console.log("Direct path comparison:", {
-          errorPath: i.path,
-          currentPath: r,
-          match: u
-        }), u;
-      });
-      console.log("Filtered path errors:", l), a.getState().setShadowMetadata(t, r, {
-        ...n,
-        validation: {
-          status: "VALIDATION_FAILED",
-          message: l[0]?.message,
-          validatedValue: p
-        }
-      });
-    }
-    h({});
-  }, [t, r, p, g]), S = y({
-    currentState: s,
-    path: r,
-    componentId: T
-  }), Q = new Proxy(S, {
-    get(d, W) {
-      return W === "inputProps" ? {
-        value: p ?? "",
-        onChange: (J) => {
-          N(J.target.value);
-        },
-        // 5. Wire the new onBlur handler to the input props.
-        onBlur: G,
-        ref: ht.getState().getFormRef(t + "." + r.join("."))
-      } : d[W];
-    }
+    "data-signal-id": S
   });
-  return /* @__PURE__ */ rt(Vt, { formOpts: v, path: r, stateKey: t, children: m(Q) });
-}
-function Pt(t, r, y) {
-  const m = `${t}////${r}`;
-  lt(() => {
-    const { registerComponent: v, unregisterComponent: g } = a.getState();
-    return v(t, m, {
-      forceUpdate: () => y({}),
-      paths: /* @__PURE__ */ new Set(),
-      reactiveType: ["component"]
-    }), () => {
-      g(t, m);
-    };
-  }, [t, m]);
 }
 export {
-  Tt as $cogsSignal,
-  ne as addStateOptions,
-  Nt as createCogsState,
-  oe as createCogsStateFromSync,
-  se as notifyComponent,
-  Wt as useCogsStateFn
+  _e as $cogsSignal,
+  Mt as addStateOptions,
+  Xe as createCogsState,
+  At as createCogsStateFromSync,
+  lt as useCogsStateFn
 };
 //# sourceMappingURL=CogsState.jsx.map