react-state-custom 1.0.30 → 1.0.31

package/dist/index.es.js

@@ -49,7 +49,7 @@ var I;
 function re() {
   return I || (I = 1, process.env.NODE_ENV === "production" ? j.exports = ne() : j.exports = ie()), j.exports;
 }
-var _ = re();
+var y = re();
 function H(n, e) {
   let t = null, s = function(...r) {
     t && clearTimeout(t), t = setTimeout(() => {
@@ -150,7 +150,7 @@ const k = oe((n) => new ce(n)), z = (n = "noname") => {
     }, 100);
   }), [e]), e;
 }, Y = (n, ...e) => {
-  const t = _.c(6), s = e;
+  const t = y.c(6), s = e;
   new Error("[ctx] useRegistryChecker failed " + JSON.stringify({
     names: s,
     ctx: n?.name ?? "undefined"
@@ -165,35 +165,35 @@ const k = oe((n) => new ce(n)), z = (n = "noname") => {
   let i;
   t[3] !== n || t[4] !== s.length ? (i = [n, s.length], t[3] = n, t[4] = s.length, t[5] = i) : i = t[5], w(r, i);
 }, ke = (n, e, t) => {
-  const s = _.c(5);
+  const s = y.c(5);
   let r, i;
   s[0] !== n || s[1] !== e || s[2] !== t ? (r = () => {
     n && n.data[e] != t && n.publish(e, t);
   }, i = [e, t, n], s[0] = n, s[1] = e, s[2] = t, s[3] = r, s[4] = i) : (r = s[3], i = s[4]), w(r, i), Y(n, e);
 }, ue = (n, e, t) => {
-  const s = _.c(11), r = t === void 0 ? 0 : t;
+  const s = y.c(11), r = t === void 0 ? 0 : t;
   let i;
   s[0] !== n?.data || s[1] !== e ? (i = () => ({
     value: n?.data?.[e]
   }), s[0] = n?.data, s[1] = e, s[2] = i) : i = s[2];
-  const [l, a] = N(i), {
-    value: o
+  const [l, o] = N(i), {
+    value: a
   } = l;
   let u;
-  s[3] !== n || s[4] !== r || s[5] !== e || s[6] !== o ? (u = () => {
+  s[3] !== n || s[4] !== r || s[5] !== e || s[6] !== a ? (u = () => {
     if (n) {
-      const d = r == 0 ? (m) => a({
-        value: m
-      }) : H((m) => a({
-        value: m
+      const d = r == 0 ? (p) => o({
+        value: p
+      }) : H((p) => o({
+        value: p
       }), r), f = n.subscribe(e, d);
-      return o != n.data[e] && a({
+      return a != n.data[e] && o({
         value: n.data[e]
       }), () => {
         f();
       };
     }
-  }, s[3] = n, s[4] = r, s[5] = e, s[6] = o, s[7] = u) : u = s[7];
+  }, s[3] = n, s[4] = r, s[5] = e, s[6] = a, s[7] = u) : u = s[7];
   let c;
   return s[8] !== n || s[9] !== e ? (c = [e, n], s[8] = n, s[9] = e, s[10] = c) : c = s[10], w(u, c), n?.data[e];
 }, We = (n, e, t) => {
@@ -201,10 +201,10 @@ const k = oe((n) => new ce(n)), z = (n = "noname") => {
   return w(() => {
     if (n) {
       let i = r, l = () => {
-        let o = t(n.data[e]);
-        o != i && (i = o, s((u) => u + 1));
-      }, a = n.subscribe(e, l);
-      return l(), () => a();
+        let a = t(n.data[e]);
+        a != i && (i = a, s((u) => u + 1));
+      }, o = n.subscribe(e, l);
+      return l(), () => o();
     }
   }, [e, n]), r;
 }, q = (n, ...e) => {
@@ -214,7 +214,7 @@ const k = oe((n) => new ce(n)), z = (n = "noname") => {
         n.data[t] != s && n.publish(t, s);
   }, [n, ae(e.flat())]), Y(n, ...e.map((t) => t[0]));
 }, je = (n, ...e) => {
-  const t = _.c(18), s = e, [, r] = N(0);
+  const t = y.c(18), s = e, [, r] = N(0);
   let i;
   if (t[0] !== n?.data || t[1] !== s) {
     let c;
@@ -222,21 +222,21 @@ const k = oe((n) => new ce(n)), z = (n = "noname") => {
   } else
     i = t[2];
   const l = i;
-  let a;
-  t[5] !== n || t[6] !== s || t[7] !== l || t[8] !== r ? (a = () => {
+  let o;
+  t[5] !== n || t[6] !== s || t[7] !== l || t[8] !== r ? (o = () => {
     if (n) {
       let c = l;
       const d = H(() => {
         const g = s.map((h) => n?.data?.[h]);
-        s.some((h, p) => c[p] != g[p]) && (c = g, r(he));
-      }, 1), f = s.map((g) => n.subscribe(g, d)), m = setTimeout(d, 1);
+        s.some((h, m) => c[m] != g[m]) && (c = g, r(he));
+      }, 1), f = s.map((g) => n.subscribe(g, d)), p = setTimeout(d, 1);
       return () => {
-        clearTimeout(m), d.cancel(), f.forEach(de);
+        clearTimeout(p), d.cancel(), f.forEach(de);
       };
     }
-  }, t[5] = n, t[6] = s, t[7] = l, t[8] = r, t[9] = a) : a = t[9];
-  let o;
-  t[10] !== n || t[11] !== s ? (o = [n, ...s], t[10] = n, t[11] = s, t[12] = o) : o = t[12], w(a, o);
+  }, t[5] = n, t[6] = s, t[7] = l, t[8] = r, t[9] = o) : o = t[9];
+  let a;
+  t[10] !== n || t[11] !== s ? (a = [n, ...s], t[10] = n, t[11] = s, t[12] = a) : a = t[12], w(o, a);
   let u;
   if (t[13] !== s || t[14] !== l) {
     let c;
@@ -245,29 +245,29 @@ const k = oe((n) => new ce(n)), z = (n = "noname") => {
     u = t[15];
   return u;
 }, Le = (n, e, ...t) => {
-  const s = _.c(14), r = e === void 0 ? 50 : e, i = t, [, l] = N(0);
-  let a;
+  const s = y.c(14), r = e === void 0 ? 50 : e, i = t, [, l] = N(0);
+  let o;
   if (s[0] !== n?.data || s[1] !== i) {
     let d;
-    s[3] !== n?.data ? (d = (f) => n?.data?.[f], s[3] = n?.data, s[4] = d) : d = s[4], a = i.map(d), s[0] = n?.data, s[1] = i, s[2] = a;
+    s[3] !== n?.data ? (d = (f) => n?.data?.[f], s[3] = n?.data, s[4] = d) : d = s[4], o = i.map(d), s[0] = n?.data, s[1] = i, s[2] = o;
   } else
-    a = s[2];
-  const o = a;
+    o = s[2];
+  const a = o;
   let u;
-  s[5] !== n || s[6] !== r || s[7] !== i || s[8] !== o || s[9] !== l ? (u = () => {
+  s[5] !== n || s[6] !== r || s[7] !== i || s[8] !== a || s[9] !== l ? (u = () => {
     if (n) {
-      let d = o;
+      let d = a;
       const f = H(() => {
-        const h = i.map((p) => n?.data?.[p]);
-        i.some((p, b) => d[b] != h[b]) && (d = h, l(fe));
-      }, r), m = i.map((h) => n.subscribe(h, f)), g = setTimeout(f, 1);
+        const h = i.map((m) => n?.data?.[m]);
+        i.some((m, b) => d[b] != h[b]) && (d = h, l(fe));
+      }, r), p = i.map((h) => n.subscribe(h, f)), g = setTimeout(f, 1);
       return () => {
-        clearTimeout(g), f.cancel(), m.forEach(pe);
+        clearTimeout(g), f.cancel(), p.forEach(pe);
       };
     }
-  }, s[5] = n, s[6] = r, s[7] = i, s[8] = o, s[9] = l, s[10] = u) : u = s[10];
+  }, s[5] = n, s[6] = r, s[7] = i, s[8] = a, s[9] = l, s[10] = u) : u = s[10];
   let c;
-  return s[11] !== n || s[12] !== i ? (c = [n, ...i], s[11] = n, s[12] = i, s[13] = c) : c = s[13], w(u, c), o;
+  return s[11] !== n || s[12] !== i ? (c = [n, ...i], s[11] = n, s[12] = i, s[13] = c) : c = s[13], w(u, c), a;
 };
 function he(n) {
   return n + 1;
@@ -287,31 +287,31 @@ const J = (n = void 0) => Object.keys(n ?? {}).sort().map((e) => {
     throw new Error(`Parameter "${e}" must be a primitive value (string, number, bigint, null, or undefined), but received ${typeof t}`);
   return e + "=" + t;
 }).join("&"), Ae = (n, e) => {
-  const t = (a) => [n, J(a)].filter(Boolean).join("?"), s = /* @__PURE__ */ new Set(), r = (a) => {
-    const o = _.c(5), u = e(a), c = t(a), d = z(c);
+  const t = (o) => [n, J(o)].filter(Boolean).join("?"), s = /* @__PURE__ */ new Set(), r = (o) => {
+    const a = y.c(5), u = e(o), c = t(o), d = z(c);
     let f;
-    o[0] === Symbol.for("react.memo_cache_sentinel") ? (f = new Error(), o[0] = f) : f = o[0];
-    const m = f.stack;
+    a[0] === Symbol.for("react.memo_cache_sentinel") ? (f = new Error(), a[0] = f) : f = a[0];
+    const p = f.stack;
     let g;
-    o[1] !== u ? (g = Object.entries(u), o[1] = u, o[2] = g) : g = o[2], q(d, ...g);
+    a[1] !== u ? (g = Object.entries(u), a[1] = u, a[2] = g) : g = a[2], q(d, ...g);
     let h;
-    return o[3] !== c ? (h = () => {
+    return a[3] !== c ? (h = () => {
       if (s.has(c)) {
-        const p = new Error("RootContext " + c + " are mounted more than once");
-        throw p.stack = m, p;
+        const m = new Error("RootContext " + c + " are mounted more than once");
+        throw m.stack = p, m;
       }
       return s.add(c), () => {
         s.delete(c);
       };
-    }, o[3] = c, o[4] = h) : h = o[4], w(h), u;
-  }, i = (a) => {
-    const o = _.c(1);
+    }, a[3] = c, a[4] = h) : h = a[4], w(h), u;
+  }, i = (o) => {
+    const a = y.c(1);
     let u;
-    return o[0] === Symbol.for("react.memo_cache_sentinel") ? (u = /* @__PURE__ */ v($, {}), o[0] = u) : u = o[0], u;
-  }, l = (a) => {
-    const o = _.c(3), u = r(a);
+    return a[0] === Symbol.for("react.memo_cache_sentinel") ? (u = /* @__PURE__ */ v($, {}), a[0] = u) : u = a[0], u;
+  }, l = (o) => {
+    const a = y.c(3), u = r(o);
     let c;
-    return o[0] !== a || o[1] !== u ? (c = /* @__PURE__ */ v(i, { ...a, ...u }), o[0] = a, o[1] = u, o[2] = c) : c = o[2], c;
+    return a[0] !== o || a[1] !== u ? (c = /* @__PURE__ */ v(i, { ...o, ...u }), a[0] = o, a[1] = u, a[2] = c) : c = a[2], c;
   };
   return r.displayName = `useState[${n}]`, l.displayName = `StateContainer[${n}]`, i.displayName = `Debug[${n}]`, {
     name: n,
@@ -322,33 +322,33 @@ const J = (n = void 0) => Object.keys(n ?? {}).sort().map((e) => {
      * Strict consumer: throws if the corresponding Root for these props isn't mounted.
      * Use in development/tests to fail fast when wiring is incorrect.
      */
-    useCtxStateStrict: (a) => {
-      const o = t(a), u = x(() => new Error().stack, []);
+    useCtxStateStrict: (o) => {
+      const a = t(o), u = x(() => new Error().stack, []);
       return w(() => {
-        if (!s.has(o)) {
-          const c = new Error("RootContext [" + o + "] is not mounted");
+        if (!s.has(a)) {
+          const c = new Error("RootContext [" + a + "] is not mounted");
           throw c.stack = u, c;
         }
-      }, [o]), z(o);
+      }, [a]), z(a);
     },
     /**
      * Lenient consumer: schedules a console.error if the Root isn't mounted instead of throwing.
      * Useful in production to avoid hard crashes while still surfacing misconfiguration.
      */
-    useCtxState: (a) => {
-      const o = t(a), u = x(() => new Error().stack, []);
+    useCtxState: (o) => {
+      const a = t(o), u = x(() => new Error().stack, []);
       return w(() => {
-        if (!s.has(o)) {
-          const c = new Error("RootContext [" + o + "] is not mounted");
+        if (!s.has(a)) {
+          const c = new Error("RootContext [" + a + "] is not mounted");
           c.stack = u;
           let d = setTimeout(() => console.error(c), 1e3);
           return () => clearTimeout(d);
         }
-      }, [s.has(o)]), z(o);
+      }, [s.has(a)]), z(a);
     }
   };
 }, me = (n) => {
-  const e = _.c(1);
+  const e = y.c(1);
   let t;
   return e[0] === Symbol.for("react.memo_cache_sentinel") ? (t = /* @__PURE__ */ v($, {}), e[0] = t) : t = e[0], t;
 }, ge = ({
@@ -362,71 +362,77 @@ const J = (n = void 0) => Object.keys(n ?? {}).sort().map((e) => {
   Wrapper: n = te,
   debugging: e = !1
 }) => {
-  const t = z("auto-ctx"), [s, r] = N({}), i = ee((a, o, u, c = 0) => {
-    const d = [a, J(u)].filter(Boolean).join("?");
-    return r((f) => ({
-      ...f,
-      [d]: {
-        ...f[d] ?? {
-          useStateFn: o,
-          params: u
+  const t = z("auto-ctx"), [s, r] = N({}), i = ee((o, a, u, c = 0, d = void 0) => {
+    const f = [o, J(u)].filter(Boolean).join("?");
+    return r((p) => ({
+      ...p,
+      [f]: {
+        ...p[f] ?? {
+          useStateFn: a,
+          params: u,
+          AttatchedComponent: d
         },
-        counter: (f[d]?.counter ?? 0) + 1,
+        counter: (p[f]?.counter ?? 0) + 1,
         keepUntil: void 0,
-        useStateFn: o
+        useStateFn: a,
+        AttatchedComponent: d
       }
     })), () => r(({
-      [d]: f,
-      ...m
+      [f]: p,
+      ...g
     }) => ({
-      ...m,
-      ...f?.counter > 1 || c > 0 ? {
-        [d]: {
-          ...f,
-          counter: f.counter - 1,
-          keepUntil: f.counter > 1 ? void 0 : Date.now() + c
+      ...g,
+      ...p?.counter > 1 || c > 0 ? {
+        [f]: {
+          ...p,
+          counter: p.counter - 1,
+          keepUntil: p.counter > 1 ? void 0 : Date.now() + c
         }
       } : {}
     }));
   }, []), l = x(() => Object.entries(s).filter(([, {
-    counter: a,
-    keepUntil: o
-  }]) => a <= 0 && o).toSorted(([, {
-    keepUntil: a = 0
-  }], [, {
+    counter: o,
+    keepUntil: a
+  }]) => o <= 0 && a).toSorted(([, {
     keepUntil: o = 0
-  }]) => a - o)?.at(0), [s]);
+  }], [, {
+    keepUntil: a = 0
+  }]) => o - a)?.at(0), [s]);
   return w(() => {
     if (l) {
-      const [a, {
-        keepUntil: o
+      const [o, {
+        keepUntil: a
       }] = l;
-      if (typeof o > "u") throw new Error("Invalid state mgr");
+      if (typeof a > "u") throw new Error("Invalid state mgr");
       let u = setTimeout(() => {
         r(({
-          [a]: c,
+          [o]: c,
           ...d
         }) => d);
-      }, Math.max(0, o - Date.now()));
+      }, Math.max(0, a - Date.now()));
       return () => {
         clearTimeout(u);
       };
     }
   }, [l]), q(t, ["subscribe", i], ["state", s]), /* @__PURE__ */ v($, { children: Object.entries(s).filter(([, {
-    counter: a,
-    keepUntil: o = 0
-  }]) => a > 0 || o >= Date.now()).map(([a, {
-    useStateFn: o,
-    params: u
-  }]) => /* @__PURE__ */ v(n, { children: /* @__PURE__ */ v(ge, { params: u, useStateFn: o, debugging: e }, a) }, a)) });
+    counter: o,
+    keepUntil: a = 0
+  }]) => o > 0 || a >= Date.now()).map(([o, {
+    useStateFn: a,
+    params: u,
+    AttatchedComponent: c
+  }]) => /* @__PURE__ */ R(n, { children: [
+    /* @__PURE__ */ v(ge, { params: u, useStateFn: a, debugging: e }, o),
+    c && /* @__PURE__ */ v(c, { ...u }, "attatch_" + o)
+  ] }, o)) });
 }, Me = ({
   useRootState: n,
   getCtxName: e,
   name: t
-}, s = 0) => ({
-  useCtxState: (r) => {
-    const i = e(r), l = ue(z("auto-ctx"), "subscribe");
-    return w(() => l?.(t, n, r, s), [n, l, t, i, s]), z(i);
+}, s = 0, r = void 0) => ({
+  useCtxState: (i) => {
+    const l = e(i), o = ue(z("auto-ctx"), "subscribe");
+    return w(() => o?.(t, n, i, s, r), [n, o, t, l, s, r]), z(l);
   }
 }), Ue = (n) => {
   const [, e] = N(0), {
@@ -435,10 +441,10 @@ const J = (n = void 0) => Object.keys(n ?? {}).sort().map((e) => {
     openGetter: r,
     clean: i
   } = x(() => {
-    const l = /* @__PURE__ */ new Set(), a = {}, o = /* @__PURE__ */ new Map(), u = new Proxy(n?.data, {
-      get(h, p) {
+    const l = /* @__PURE__ */ new Set(), o = {}, a = /* @__PURE__ */ new Map(), u = new Proxy(n?.data, {
+      get(h, m) {
         if (c)
-          return l.add(p), a[p] = h[p];
+          return l.add(m), o[m] = h[m];
         throw new Error("useQuickSubscribe: Cannot access context data outside render phase. Destructure needed properties immediately during render.");
       },
       ownKeys(h) {
@@ -446,29 +452,29 @@ const J = (n = void 0) => Object.keys(n ?? {}).sort().map((e) => {
       }
     });
     let c = !0, d = H(() => {
-      [...l.values()].some((h) => a[h] != n?.data?.[h]) && e((h) => h + 1);
+      [...l.values()].some((h) => o[h] != n?.data?.[h]) && e((h) => h + 1);
     }, 0), f = () => {
       c = !0, l.clear();
-    }, m = () => {
-      c = !1, [...l.values()].filter((h) => !o.has(h)).forEach((h) => {
-        o.set(h, n?.subscribe(h, d));
-      }), [...o.keys()].filter((h) => !l.has(h)).forEach((h) => {
-        o.get(h)?.(), o.delete(h);
+    }, p = () => {
+      c = !1, [...l.values()].filter((h) => !a.has(h)).forEach((h) => {
+        a.set(h, n?.subscribe(h, d));
+      }), [...a.keys()].filter((h) => !l.has(h)).forEach((h) => {
+        a.get(h)?.(), a.delete(h);
       });
     };
     return {
       proxy: u,
-      finalGetter: m,
+      finalGetter: p,
       openGetter: f,
       clean: () => {
-        f(), m(), e((h) => h + 1);
+        f(), p(), e((h) => h + 1);
       }
     };
   }, [n]);
   return r(), setTimeout(s, 0), w(() => () => i(), [i]), t;
 };
 function ve(n) {
-  const e = _.c(4);
+  const e = y.c(4);
   let t;
   e[0] !== n ? (t = n ? Se(n.trim().toLowerCase().split(" "), "gi") : void 0, e[0] = n, e[1] = t) : t = e[1];
   const s = t;
@@ -484,7 +490,7 @@ function Se(n, e = "gi") {
   const t = n.map(be).join("|");
   return new RegExp(`(${t})`, e);
 }
-function Ce(n, e) {
+function Ee(n, e) {
   const t = [];
   let s = 0;
   for (const r of n.matchAll(e)) {
@@ -495,85 +501,85 @@ function Ce(n, e) {
 }
 const X = D.createContext({
   highlight: void 0
-}), Ee = (n) => {
-  const e = _.c(3), {
+}), Ce = (n) => {
+  const e = y.c(3), {
     children: t,
     highlight: s
   } = n, r = ve(s);
   let i;
   return e[0] !== t || e[1] !== r ? (i = /* @__PURE__ */ v(X.Provider, { value: r, children: t }), e[0] = t, e[1] = r, e[2] = i) : i = e[2], i;
 }, we = (n) => {
-  const e = _.c(5), {
+  const e = y.c(5), {
     text: t
   } = n, {
     highlight: s
   } = se(X);
   let r;
-  e[0] !== s || e[1] !== t ? (r = s ? Ce(t, s) : t, e[0] = s, e[1] = t, e[2] = r) : r = e[2];
+  e[0] !== s || e[1] !== t ? (r = s ? Ee(t, s) : t, e[0] = s, e[1] = t, e[2] = r) : r = e[2];
   const i = r;
   let l;
   return e[3] !== i ? (l = /* @__PURE__ */ v($, { children: i }), e[3] = i, e[4] = l) : l = e[4], l;
 }, Q = (n) => {
-  const e = _.c(5), {
+  const e = y.c(5), {
     name: t,
     value: s
   } = n;
   let r;
   try {
-    let a;
-    e[0] !== t || e[1] !== s ? (a = JSON.stringify({
+    let o;
+    e[0] !== t || e[1] !== s ? (o = JSON.stringify({
       [t]: s
-    }, null, 2), e[0] = t, e[1] = s, e[2] = a) : a = e[2], r = a;
-  } catch (a) {
-    r = String(a);
+    }, null, 2), e[0] = t, e[1] = s, e[2] = o) : o = e[2], r = o;
+  } catch (o) {
+    r = String(o);
   }
   const i = r;
   let l;
   return e[3] !== i ? (l = /* @__PURE__ */ v("pre", { children: i }), e[3] = i, e[4] = l) : l = e[4], l;
-}, _e = (n) => {
-  const e = _.c(26);
+}, ye = (n) => {
+  const e = y.c(26);
   let t, s, r, i;
   if (e[0] !== n) {
     const {
       selectedKey: S,
-      setKey: C,
-      currentKey: E,
+      setKey: E,
+      currentKey: C,
       highlight: O,
-      ...y
+      ..._
     } = n;
-    r = S, i = C, t = E, s = y, e[0] = n, e[1] = t, e[2] = s, e[3] = r, e[4] = i;
+    r = S, i = E, t = C, s = _, e[0] = n, e[1] = t, e[2] = s, e[3] = r, e[4] = i;
   } else
     t = e[1], s = e[2], r = e[3], i = e[4];
   let l;
   e[5] !== t ? (l = k(t), e[5] = t, e[6] = l) : l = e[6];
-  const a = l, o = P(void 0);
+  const o = l, a = P(void 0);
   let u, c;
-  e[7] !== a ? (u = () => {
-    if (o.current) {
+  e[7] !== o ? (u = () => {
+    if (a.current) {
       const S = H(() => {
-        o.current && (o.current?.classList.add("state-key-updated"), requestAnimationFrame(() => o.current?.classList.remove("state-key-updated")));
+        a.current && (a.current?.classList.add("state-key-updated"), requestAnimationFrame(() => a.current?.classList.remove("state-key-updated")));
       }, 5);
-      return a.subscribeAll(S);
+      return o.subscribeAll(S);
     }
-  }, c = [a, o], e[7] = a, e[8] = u, e[9] = c) : (u = e[8], c = e[9]), w(u, c);
+  }, c = [o, a], e[7] = o, e[8] = u, e[9] = c) : (u = e[8], c = e[9]), w(u, c);
   const d = t == r;
   let f;
   e[10] !== t || e[11] !== i ? (f = () => i(t), e[10] = t, e[11] = i, e[12] = f) : f = e[12];
-  const m = String(t);
+  const p = String(t);
   let g;
-  e[13] !== m ? (g = /* @__PURE__ */ v("div", { className: "state-key-name", children: /* @__PURE__ */ v(we, { text: m }) }), e[13] = m, e[14] = g) : g = e[14];
+  e[13] !== p ? (g = /* @__PURE__ */ v("div", { className: "state-key-name", children: /* @__PURE__ */ v(we, { text: p }) }), e[13] = p, e[14] = g) : g = e[14];
   let h;
-  e[15] !== a.data ? (h = Object.keys(a.data), e[15] = a.data, e[16] = h) : h = e[16];
-  let p;
-  e[17] !== h.length ? (p = /* @__PURE__ */ R("div", { className: "state-key-meta", children: [
+  e[15] !== o.data ? (h = Object.keys(o.data), e[15] = o.data, e[16] = h) : h = e[16];
+  let m;
+  e[17] !== h.length ? (m = /* @__PURE__ */ R("div", { className: "state-key-meta", children: [
     h.length,
     " items"
-  ] }), e[17] = h.length, e[18] = p) : p = e[18];
+  ] }), e[17] = h.length, e[18] = m) : m = e[18];
   let b;
-  return e[19] !== t || e[20] !== s || e[21] !== d || e[22] !== f || e[23] !== g || e[24] !== p ? (b = /* @__PURE__ */ R("div", { ref: o, className: "state-key", title: t, "data-active": d, onClick: f, ...s, children: [
+  return e[19] !== t || e[20] !== s || e[21] !== d || e[22] !== f || e[23] !== g || e[24] !== m ? (b = /* @__PURE__ */ R("div", { ref: a, className: "state-key", title: t, "data-active": d, onClick: f, ...s, children: [
     g,
-    p
-  ] }), e[19] = t, e[20] = s, e[21] = d, e[22] = f, e[23] = g, e[24] = p, e[25] = b) : b = e[25], b;
+    m
+  ] }), e[19] = t, e[20] = s, e[21] = d, e[22] = f, e[23] = g, e[24] = m, e[25] = b) : b = e[25], b;
 };
 function T() {
   return T = Object.assign ? Object.assign.bind() : function(n) {
@@ -584,7 +590,7 @@ function T() {
     return n;
   }, T.apply(null, arguments);
 }
-function ye(n, e) {
+function _e(n, e) {
   if (n == null) return {};
   var t = {};
   for (var s in n) if ({}.hasOwnProperty.call(n, s)) {
@@ -623,14 +629,14 @@ class U extends D.Component {
       var {
         mode: t,
         onDragging: s
-      } = this.props, r = this.target.nextElementSibling, i = this.target.previousElementSibling, l = e.clientX - this.startX, a = e.clientY - this.startY;
+      } = this.props, r = this.target.nextElementSibling, i = this.target.previousElementSibling, l = e.clientX - this.startX, o = e.clientY - this.startY;
       if (this.preSize = 0, this.nextSize = 0, t === "horizontal") {
         if (this.preSize = this.preWidth + l > -1 ? this.preWidth + l : 0, this.nextSize = this.nextWidth - l > -1 ? this.nextWidth - l : 0, this.preSize === 0 || this.nextSize === 0)
           return;
         this.preSize = (this.preSize / this.boxWidth >= 1 ? 1 : this.preSize / this.boxWidth) * 100, this.nextSize = (this.nextSize / this.boxWidth >= 1 ? 1 : this.nextSize / this.boxWidth) * 100, i && r && (i.style.width = this.preSize + "%", r.style.width = this.nextSize + "%");
       }
-      if (t === "vertical" && this.preHeight + a > -1 && this.nextHeight - a > -1) {
-        if (this.preSize = this.preHeight + a > -1 ? this.preHeight + a : 0, this.nextSize = this.nextHeight - a > -1 ? this.nextHeight - a : 0, this.preSize = (this.preSize / this.boxHeight >= 1 ? 1 : this.preSize / this.boxHeight) * 100, this.nextSize = (this.nextSize / this.boxHeight >= 1 ? 1 : this.nextSize / this.boxHeight) * 100, this.preSize === 0 || this.nextSize === 0)
+      if (t === "vertical" && this.preHeight + o > -1 && this.nextHeight - o > -1) {
+        if (this.preSize = this.preHeight + o > -1 ? this.preHeight + o : 0, this.nextSize = this.nextHeight - o > -1 ? this.nextHeight - o : 0, this.preSize = (this.preSize / this.boxHeight >= 1 ? 1 : this.preSize / this.boxHeight) * 100, this.nextSize = (this.nextSize / this.boxHeight >= 1 ? 1 : this.nextSize / this.boxHeight) * 100, this.preSize === 0 || this.nextSize === 0)
           return;
         i && r && (i.style.height = this.preSize + "%", r.style.height = this.nextSize + "%");
       }
@@ -651,33 +657,33 @@ class U extends D.Component {
       className: r,
       children: i,
       mode: l,
-      visible: a = (e = this.props.visible) != null ? e : this.props.visiable,
-      renderBar: o,
+      visible: o = (e = this.props.visible) != null ? e : this.props.visiable,
+      renderBar: a,
       lineBar: u,
       disable: c
-    } = t, d = ye(t, Ne), {
+    } = t, d = _e(t, Ne), {
       dragging: f
-    } = this.state, m = [s, r, s + "-" + l, f ? "dragging" : null].filter(Boolean).join(" ").trim(), g = D.Children.toArray(i);
+    } = this.state, p = [s, r, s + "-" + l, f ? "dragging" : null].filter(Boolean).join(" ").trim(), g = D.Children.toArray(i);
     return /* @__PURE__ */ v("div", T({
-      className: m
+      className: p
     }, d, {
       ref: (h) => this.warpper = h,
-      children: D.Children.map(g, (h, p) => {
+      children: D.Children.map(g, (h, m) => {
         var b = Object.assign({}, h.props, {
           className: [s + "-pane", h.props.className].filter(Boolean).join(" ").trim(),
           style: T({}, h.props.style)
-        }), S = a === !0 || a && a.includes(p + 1) || !1, C = {
+        }), S = o === !0 || o && o.includes(m + 1) || !1, E = {
           className: [s + "-bar", u ? s + "-line-bar" : null, u ? null : s + "-large-bar"].filter(Boolean).join(" ").trim()
         };
-        (c === !0 || c && c.includes(p + 1)) && (C.className = [C.className, c ? "disable" : null].filter(Boolean).join(" ").trim());
-        var E = null;
-        return p !== 0 && S && o ? E = o(T({}, C, {
-          onMouseDown: this.onMouseDown.bind(this, p + 1)
-        })) : p !== 0 && S && (E = /* @__PURE__ */ D.createElement("div", T({}, C), /* @__PURE__ */ v("div", {
-          onMouseDown: this.onMouseDown.bind(this, p + 1)
+        (c === !0 || c && c.includes(m + 1)) && (E.className = [E.className, c ? "disable" : null].filter(Boolean).join(" ").trim());
+        var C = null;
+        return m !== 0 && S && a ? C = a(T({}, E, {
+          onMouseDown: this.onMouseDown.bind(this, m + 1)
+        })) : m !== 0 && S && (C = /* @__PURE__ */ D.createElement("div", T({}, E), /* @__PURE__ */ v("div", {
+          onMouseDown: this.onMouseDown.bind(this, m + 1)
         }))), /* @__PURE__ */ R(D.Fragment, {
-          children: [E, /* @__PURE__ */ D.cloneElement(h, T({}, b))]
-        }, p);
+          children: [C, /* @__PURE__ */ D.cloneElement(h, T({}, b))]
+        }, m);
       })
     }));
   }
@@ -688,71 +694,71 @@ U.defaultProps = {
   mode: "horizontal"
 };
 const L = k.cache, De = (n) => {
-  const e = _.c(27), {
+  const e = y.c(27), {
     Component: t
-  } = n, [s, r] = N(Te), [i, l] = N(""), [a, o] = N("");
+  } = n, [s, r] = N(Te), [i, l] = N(""), [o, a] = N("");
   let u, c;
   e[0] === Symbol.for("react.memo_cache_sentinel") ? (u = () => {
-    const y = setInterval(() => {
+    const _ = setInterval(() => {
       r(ze);
     }, 50);
-    return () => clearInterval(y);
+    return () => clearInterval(_);
   }, c = [L], e[0] = u, e[1] = c) : (u = e[0], c = e[1]), w(u, c);
   let d;
   e[2] !== i ? (d = i.toLowerCase().split(" "), e[2] = i, e[3] = d) : d = e[3];
   const f = d;
-  let m;
-  e[4] !== f ? (m = (y) => {
-    const W = y.toLowerCase();
+  let p;
+  e[4] !== f ? (p = (_) => {
+    const W = _.toLowerCase();
     return f.every((Z) => W.includes(Z));
-  }, e[4] = f, e[5] = m) : m = e[5];
-  const g = m;
+  }, e[4] = f, e[5] = p) : p = e[5];
+  const g = p;
   let h;
-  e[6] === Symbol.for("react.memo_cache_sentinel") ? (h = (y) => l(y.target.value), e[6] = h) : h = e[6];
-  let p;
-  e[7] !== i ? (p = /* @__PURE__ */ v("input", { placeholder: "Type to Filter ...", className: "state-filter", value: i, onChange: h }), e[7] = i, e[8] = p) : p = e[8];
+  e[6] === Symbol.for("react.memo_cache_sentinel") ? (h = (_) => l(_.target.value), e[6] = h) : h = e[6];
+  let m;
+  e[7] !== i ? (m = /* @__PURE__ */ v("input", { placeholder: "Type to Filter ...", className: "state-filter", value: i, onChange: h }), e[7] = i, e[8] = m) : m = e[8];
   let b;
-  if (e[9] !== s || e[10] !== g || e[11] !== a) {
-    let y;
-    e[13] !== a ? (y = (W) => /* @__PURE__ */ v(_e, { selectedKey: a, setKey: o, currentKey: W }, W), e[13] = a, e[14] = y) : y = e[14], b = s.map(xe).filter($e).filter(g).map(y), e[9] = s, e[10] = g, e[11] = a, e[12] = b;
+  if (e[9] !== s || e[10] !== g || e[11] !== o) {
+    let _;
+    e[13] !== o ? (_ = (W) => /* @__PURE__ */ v(ye, { selectedKey: o, setKey: a, currentKey: W }, W), e[13] = o, e[14] = _) : _ = e[14], b = s.map(xe).filter($e).filter(g).map(_), e[9] = s, e[10] = g, e[11] = o, e[12] = b;
   } else
     b = e[12];
   let S;
-  e[15] !== i || e[16] !== b ? (S = /* @__PURE__ */ v(Ee, { highlight: i, children: b }), e[15] = i, e[16] = b, e[17] = S) : S = e[17];
-  let C;
-  e[18] !== p || e[19] !== S ? (C = /* @__PURE__ */ R("div", { className: "state-list", children: [
-    p,
-    S
-  ] }), e[18] = p, e[19] = S, e[20] = C) : C = e[20];
+  e[15] !== i || e[16] !== b ? (S = /* @__PURE__ */ v(Ce, { highlight: i, children: b }), e[15] = i, e[16] = b, e[17] = S) : S = e[17];
   let E;
-  e[21] !== t || e[22] !== a ? (E = /* @__PURE__ */ v("div", { className: "state-view", children: /* @__PURE__ */ v(Re, { dataKey: a, Component: t }, a) }), e[21] = t, e[22] = a, e[23] = E) : E = e[23];
+  e[18] !== m || e[19] !== S ? (E = /* @__PURE__ */ R("div", { className: "state-list", children: [
+    m,
+    S
+  ] }), e[18] = m, e[19] = S, e[20] = E) : E = e[20];
+  let C;
+  e[21] !== t || e[22] !== o ? (C = /* @__PURE__ */ v("div", { className: "state-view", children: /* @__PURE__ */ v(Re, { dataKey: o, Component: t }, o) }), e[21] = t, e[22] = o, e[23] = C) : C = e[23];
   let O;
-  return e[24] !== E || e[25] !== C ? (O = /* @__PURE__ */ R(U, { mode: "horizontal", className: "main-panel", children: [
-    C,
-    E
-  ] }), e[24] = E, e[25] = C, e[26] = O) : O = e[26], O;
+  return e[24] !== C || e[25] !== E ? (O = /* @__PURE__ */ R(U, { mode: "horizontal", className: "main-panel", children: [
+    E,
+    C
+  ] }), e[24] = C, e[25] = E, e[26] = O) : O = e[26], O;
 }, Re = (n) => {
-  const e = _.c(11), {
+  const e = y.c(11), {
     dataKey: t,
     Component: s
   } = n, r = s === void 0 ? Q : s;
   let i;
   e[0] !== t ? (i = k(t), e[0] = t, e[1] = i) : i = e[1];
-  const l = i, a = l?.data;
-  let o;
-  e[2] !== a ? (o = {
-    ...a
-  }, e[2] = a, e[3] = o) : o = e[3];
-  const [u, c] = N(o);
+  const l = i, o = l?.data;
+  let a;
+  e[2] !== o ? (a = {
+    ...o
+  }, e[2] = o, e[3] = a) : a = e[3];
+  const [u, c] = N(a);
   let d, f;
   e[4] !== l ? (d = () => {
     const g = H(c, 5);
-    return l.subscribeAll((h, p) => g({
-      ...p
+    return l.subscribeAll((h, m) => g({
+      ...m
     }));
   }, f = [l], e[4] = l, e[5] = d, e[6] = f) : (d = e[5], f = e[6]), w(d, f);
-  let m;
-  return e[7] !== r || e[8] !== u || e[9] !== t ? (m = /* @__PURE__ */ v(r, { value: u, name: t }), e[7] = r, e[8] = u, e[9] = t, e[10] = m) : m = e[10], m;
+  let p;
+  return e[7] !== r || e[8] !== u || e[9] !== t ? (p = /* @__PURE__ */ v(r, { value: u, name: t }), e[7] = r, e[8] = u, e[9] = t, e[10] = p) : p = e[10], p;
 };
 function Te() {
   return [...L.keys()];
@@ -767,28 +773,28 @@ function $e(n) {
   return n != "auto-ctx" && n;
 }
 const Be = (n) => {
-  const e = _.c(29);
+  const e = y.c(29);
   let t, s, r;
   e[0] !== n ? ({
     toggleButton: s,
     Component: r,
     ...t
   } = n, e[0] = n, e[1] = t, e[2] = s, e[3] = r) : (t = e[1], s = e[2], r = e[3]);
-  const i = r === void 0 ? Q : r, [l, a] = N(!1);
-  let o;
-  e[4] === Symbol.for("react.memo_cache_sentinel") ? (o = () => a(!0), e[4] = o) : o = e[4];
+  const i = r === void 0 ? Q : r, [l, o] = N(!1);
+  let a;
+  e[4] === Symbol.for("react.memo_cache_sentinel") ? (a = () => o(!0), e[4] = a) : a = e[4];
   const u = t?.children ?? "Toggle Dev Tool";
   let c;
-  e[5] !== l || e[6] !== t || e[7] !== u ? (c = /* @__PURE__ */ v("button", { className: "react-state-dev-btn", "data-active": l, onClick: o, ...t, children: u }), e[5] = l, e[6] = t, e[7] = u, e[8] = c) : c = e[8];
+  e[5] !== l || e[6] !== t || e[7] !== u ? (c = /* @__PURE__ */ v("button", { className: "react-state-dev-btn", "data-active": l, onClick: a, ...t, children: u }), e[5] = l, e[6] = t, e[7] = u, e[8] = c) : c = e[8];
   let d;
   e[9] === Symbol.for("react.memo_cache_sentinel") ? (d = {
     height: "100%"
   }, e[9] = d) : d = e[9];
   const f = l ? "66.66%" : "100%";
-  let m;
-  e[10] !== f ? (m = /* @__PURE__ */ v("div", { style: {
+  let p;
+  e[10] !== f ? (p = /* @__PURE__ */ v("div", { style: {
     height: f
-  } }), e[10] = f, e[11] = m) : m = e[11];
+  } }), e[10] = f, e[11] = p) : p = e[11];
   const g = l ? "33.33%" : "0";
   let h;
   e[12] !== g ? (h = {
@@ -796,25 +802,25 @@ const Be = (n) => {
     backgroundColor: "var(--rs-bg-color)",
     position: "relative"
   }, e[12] = g, e[13] = h) : h = e[13];
-  let p;
-  e[14] !== l ? (p = l && /* @__PURE__ */ v("button", { className: "close-btn", onClick: () => a(!1), children: "[x]" }), e[14] = l, e[15] = p) : p = e[15];
+  let m;
+  e[14] !== l ? (m = l && /* @__PURE__ */ v("button", { className: "close-btn", onClick: () => o(!1), children: "[x]" }), e[14] = l, e[15] = m) : m = e[15];
   let b;
   e[16] !== i || e[17] !== l ? (b = l && /* @__PURE__ */ v(De, { Component: i }), e[16] = i, e[17] = l, e[18] = b) : b = e[18];
   let S;
-  e[19] !== h || e[20] !== p || e[21] !== b ? (S = /* @__PURE__ */ R("div", { className: "react-state-dev-panel", style: h, children: [
-    p,
-    b
-  ] }), e[19] = h, e[20] = p, e[21] = b, e[22] = S) : S = e[22];
-  let C;
-  e[23] !== S || e[24] !== m ? (C = /* @__PURE__ */ v("div", { className: "react-state-dev-container", children: /* @__PURE__ */ R(U, { mode: "vertical", style: d, children: [
+  e[19] !== h || e[20] !== m || e[21] !== b ? (S = /* @__PURE__ */ R("div", { className: "react-state-dev-panel", style: h, children: [
     m,
-    S
-  ] }) }), e[23] = S, e[24] = m, e[25] = C) : C = e[25];
+    b
+  ] }), e[19] = h, e[20] = m, e[21] = b, e[22] = S) : S = e[22];
   let E;
-  return e[26] !== C || e[27] !== c ? (E = /* @__PURE__ */ R($, { children: [
+  e[23] !== S || e[24] !== p ? (E = /* @__PURE__ */ v("div", { className: "react-state-dev-container", children: /* @__PURE__ */ R(U, { mode: "vertical", style: d, children: [
+    p,
+    S
+  ] }) }), e[23] = S, e[24] = p, e[25] = E) : E = e[25];
+  let C;
+  return e[26] !== E || e[27] !== c ? (C = /* @__PURE__ */ R($, { children: [
     c,
-    C
-  ] }), e[26] = C, e[27] = c, e[28] = E) : E = e[28], E;
+    E
+  ] }), e[26] = E, e[27] = c, e[28] = C) : C = e[28], C;
 };
 export {
   Ke as AutoRootCtx,
@@ -823,6 +829,7 @@ export {
   Me as createAutoCtx,
   Ae as createRootCtx,
   k as getContext,
+  J as paramsToId,
   ae as useArrayChangeId,
   z as useDataContext,
   ke as useDataSource,