@instantdb/components 1.0.4 → 1.0.5

package/dist/index.js

@@ -1,6 +1,6 @@
 import { jsxs as h, jsx as r, Fragment as j } from "react/jsx-runtime";
 import { toast as Nt, Toaster as fa } from "sonner";
-import { Toaster as tl, toast as rl } from "sonner";
+import { Toaster as rl, toast as al } from "sonner";
 import { VisuallyHidden as ma } from "@radix-ui/react-visually-hidden";
 import { Editor as ba, DiffEditor as wa } from "@monaco-editor/react";
 import _e from "clsx";
@@ -711,7 +711,10 @@ function Pn(e) {
 function Jt(e, t) {
   return e.name === "id" ? -1 : t.name === "id" ? 1 : e.name < t.name ? -1 : e.name > t.name ? 1 : 0;
 }
-function qn(e, t) {
+function qn(e, t, a) {
+  return t || (e ? [] : a);
+}
+function Gn(e, t) {
   const a = {};
   return e && (a[e[0]] = e[1]), t?.length && (a.or = t.map(([n, o, l]) => {
     switch (o) {
@@ -724,8 +727,8 @@ function qn(e, t) {
     }
   })), a;
 }
-function Gn(e, t, a, n, o, l, i, g) {
-  const c = g ? "asc" : "desc", p = qn(a, n), m = t ? {
+function Hn(e, t, a, n, o, l, i, g) {
+  const c = g ? "asc" : "desc", p = Gn(a, n), m = t ? {
     [t.name]: {
       ...Object.fromEntries(
         t.attrs.filter((f) => f.type === "ref").map((f) => [f.name, { $: { fields: ["id"] } }])
@@ -752,7 +755,7 @@ function Gn(e, t, a, n, o, l, i, g) {
     allCount: s
   };
 }
-function Hn(e) {
+function Wn(e) {
   const [t, a] = C({ namespaces: null, attrs: null });
   return e.useQuery({ ____explorer___: {} }), P(() => {
     function n(o) {
@@ -773,7 +776,7 @@ const er = (e) => {
   } catch (a) {
     return console.error("Failed to parse column visibility", a), {};
   }
-}, Wn = (e) => {
+}, Vn = (e) => {
   const [t, a] = C(
     er(e.appId)
   );
@@ -795,7 +798,7 @@ function tr(e) {
     } catch {
     }
 }
-function Vn(e, t) {
+function Yn(e, t) {
   if (typeof window > "u")
     throw new Error("useLocalStorage/setState needs to run on the client");
   const a = JSON.stringify(t);
@@ -822,9 +825,9 @@ function Rt(e, t) {
     n,
     () => a.current,
     () => t
-  ), (l) => Vn(e, l)];
+  ), (l) => Yn(e, l)];
 }
-function Yn(e) {
+function Kn(e) {
   const t = ["bytes", "kb", "mb", "gb", "tb", "pb", "eb", "zb", "yb"];
   let a = 0;
   if (!e) return "0 bytes";
@@ -832,7 +835,7 @@ function Yn(e) {
     e /= 1024, a++;
   return e.toFixed(2) + " " + t[a];
 }
-const Kn = (e, t) => {
+const Xn = (e, t) => {
   const a = document.querySelector(`.th-${e}`);
   if (!a)
     throw new Error(`Element with class th-${e} not found`);
@@ -852,7 +855,7 @@ const Kn = (e, t) => {
     document.body.removeChild(o);
   }
 };
-function Xn() {
+function Zn() {
   const e = X(null), [t, a] = C(!1);
   return yt(() => {
     const { current: n } = e;
@@ -862,7 +865,7 @@ function Xn() {
     })();
   }, [e]), { ref: e, isOverflow: t, setIsOverflow: a };
 }
-const Zn = ({
+const Qn = ({
   header: e,
   table: t,
   headerGroup: a,
@@ -973,11 +976,11 @@ const Zn = ({
     },
     e.id
   );
-}, Qn = ({ cell: e }) => {
+}, Jn = ({ cell: e }) => {
   const t = e.column.getIsResizing(), { history: a } = ut(), n = e.column.columnDef.meta, { isDragging: o, setNodeRef: l, transform: i } = yr({
     id: e.column.id,
     disabled: e.column.id === "select-col"
-  }), [g, c] = C(!1), { ref: p, isOverflow: m, setIsOverflow: d } = Xn(), u = (m || Se(e.getValue())) && !n?.isLink;
+  }), [g, c] = C(!1), { ref: p, isOverflow: m, setIsOverflow: d } = Zn(), u = (m || Se(e.getValue())) && !n?.isLink;
   P(() => {
     const w = new ResizeObserver(() => {
       const v = p.current.scrollWidth > p.current.clientWidth || p.current.scrollHeight > p.current.clientHeight;
@@ -1040,7 +1043,7 @@ const Zn = ({
       {
         className: O(Se(b) && "p-0"),
         side: "bottom",
-        children: typeof b == "string" ? lt(e.column.columnDef.cell, e.getContext()) : /* @__PURE__ */ r(Jn, { pretty: !0, data: b })
+        children: typeof b == "string" ? lt(e.column.columnDef.cell, e.getContext()) : /* @__PURE__ */ r(eo, { pretty: !0, data: b })
       }
     )
   ] });
@@ -1048,7 +1051,7 @@ const Zn = ({
 function Tr(e, t) {
   return Se(e) ? JSON.stringify(e, null, t ? 2 : void 0) : String(e);
 }
-function Jn({ data: e, pretty: t }) {
+function eo({ data: e, pretty: t }) {
   const a = Tr(e, t), n = de();
   return t && Se(e) ? /* @__PURE__ */ r(
     $t,
@@ -1059,7 +1062,7 @@ function Jn({ data: e, pretty: t }) {
     }
   ) : /* @__PURE__ */ r(j, { children: a });
 }
-const eo = ({
+const to = ({
   visiblity: e,
   localDates: t,
   setLocalDates: a
@@ -1119,7 +1122,7 @@ const eo = ({
     )
   ] });
 };
-async function to({
+async function ro({
   appId: e,
   attrId: t,
   jobType: a,
@@ -1174,7 +1177,7 @@ function me(e) {
 function be(e) {
   return e.job_status === "completed" || e.job_status === "errored";
 }
-const ro = ({
+const ao = ({
   attr: e,
   appId: t,
   isRequired: a,
@@ -1253,7 +1256,7 @@ const ro = ({
     running: p,
     apply: w
   };
-}, ao = () => {
+}, no = () => {
   const [e, t] = C({});
   return {
     notes: e,
@@ -1267,7 +1270,7 @@ const ro = ({
       });
     }
   };
-}, no = (e, t, a) => {
+}, oo = (e, t, a) => {
   const n = t.name, o = [];
   return t.attrs.forEach((l) => {
     o.push([
@@ -1297,7 +1300,7 @@ const ro = ({
     });
   }), o;
 };
-function oo({
+function io({
   db: e,
   namespace: t,
   namespaces: a,
@@ -1318,7 +1321,7 @@ function oo({
       f("Namespace name cannot start with $");
       return;
     }
-    const _ = no(x, t, a);
+    const _ = oo(x, t, a);
     await e.core._reactor.pushOps(_), g.push(
       {
         namespace: x
@@ -1326,7 +1329,7 @@ function oo({
       !0
     ), oe("Renamed namespace to " + x), u(""), m({ type: "main" });
   }
-  const v = ao(), k = se(() => p.type === "edit" && t.attrs.find(
+  const v = no(), k = se(() => p.type === "edit" && t.attrs.find(
     (x) => x.id === p.attrId && x.isForward === p.isForward
   ), [
     p.type === "edit" ? p.attrId : null,
@@ -1471,7 +1474,7 @@ function oo({
         }
       )
     ] }) : p.type === "add" ? /* @__PURE__ */ r(
-      io,
+      lo,
       {
         db: e,
         namespace: t,
@@ -1491,7 +1494,7 @@ function oo({
         onConfirm: b
       }
     ) : p.type === "edit" && k ? /* @__PURE__ */ r(
-      mo,
+      bo,
       {
         db: e,
         attr: k,
@@ -1545,7 +1548,7 @@ function _r({
     ] })
   ] });
 }
-function io({
+function lo({
   db: e,
   namespace: t,
   namespaces: a,
@@ -1980,7 +1983,7 @@ function Dr({
     /* @__PURE__ */ h("div", { className: "flex flex-col gap-1", children: [
       /* @__PURE__ */ r("h6", { className: "text-md font-bold", children: "Relationship" }),
       /* @__PURE__ */ r(
-        lo,
+        so,
         {
           disabled: !v || w.attr.disabled,
           value: o,
@@ -1998,7 +2001,7 @@ function Dr({
         "div",
         {
           className: "text-xs wrap-break-word text-gray-500 dark:text-neutral-400",
-          children: v ? so[o](
+          children: v ? co[o](
             a,
             n,
             e,
@@ -2069,7 +2072,7 @@ function Dr({
     ] })
   ] });
 }
-function lo({
+function so({
   value: e,
   disabled: t,
   onChange: a,
@@ -2109,7 +2112,7 @@ function lo({
     }
   );
 }
-const so = {
+const co = {
   "many-many": (e, t, a, n) => /* @__PURE__ */ h(j, { children: [
     /* @__PURE__ */ r("strong", { children: e }),
     " can have many ",
@@ -2153,7 +2156,7 @@ const so = {
     /* @__PURE__ */ r("strong", { children: n })
   ] })
 };
-async function co({
+async function uo({
   appId: e,
   attr: t,
   isRequired: a,
@@ -2167,7 +2170,7 @@ async function co({
   l.current?.();
   const g = `${t.namespace}.${t.name}`;
   try {
-    const c = await to(
+    const c = await ro(
       {
         appId: e,
         attrId: t.id,
@@ -2196,7 +2199,7 @@ async function co({
     return console.error(c), le(`Unexpected error while updating ${g}`), "errored";
   }
 }
-const uo = ({
+const po = ({
   pendingJob: e,
   runningJob: t,
   value: a,
@@ -2271,7 +2274,7 @@ const uo = ({
       }
     )
   ] });
-}, po = ({
+}, go = ({
   pendingJob: e,
   runningJob: t,
   value: a,
@@ -2327,7 +2330,7 @@ const uo = ({
       }
     )
   ] });
-}, go = ({
+}, ho = ({
   pendingJob: e,
   runningJob: t,
   value: a,
@@ -2383,7 +2386,7 @@ const uo = ({
       }
     )
   ] });
-}, ho = ({
+}, fo = ({
   pendingJob: e,
   runningJob: t,
   value: a,
@@ -2439,14 +2442,14 @@ const uo = ({
       }
     )
   ] });
-}, fo = ({
+}, mo = ({
   appId: e,
   attr: t,
   constraints: a
 }) => {
   const [n, o] = C(
     t.isRequired || !1
-  ), [l, i] = C(t.isIndex), [g, c] = C(t.isUniq), [p, m] = C(t.checkedDataType || "any"), d = de(), { isPending: u, pending: s, apply: f, isRunning: b, running: w, progress: v } = ro({
+  ), [l, i] = C(t.isIndex), [g, c] = C(t.isUniq), [p, m] = C(t.checkedDataType || "any"), d = de(), { isPending: u, pending: s, apply: f, isRunning: b, running: w, progress: v } = ao({
     attr: t,
     appId: e,
     token: d.adminToken,
@@ -2458,7 +2461,7 @@ const uo = ({
   return /* @__PURE__ */ r("div", { children: /* @__PURE__ */ h("div", { className: "flex flex-col gap-2", children: [
     /* @__PURE__ */ r("h6", { className: "text-md font-bold", children: "Constraints" }),
     /* @__PURE__ */ r(
-      po,
+      go,
       {
         pendingJob: s.require,
         runningJob: w.require,
@@ -2470,7 +2473,7 @@ const uo = ({
       }
     ),
     /* @__PURE__ */ r(
-      go,
+      ho,
       {
         pendingJob: s.index,
         runningJob: w.index,
@@ -2482,7 +2485,7 @@ const uo = ({
       }
     ),
     /* @__PURE__ */ r(
-      ho,
+      fo,
       {
         pendingJob: s.unique,
         runningJob: w.unique,
@@ -2494,7 +2497,7 @@ const uo = ({
       }
     ),
     /* @__PURE__ */ r(
-      uo,
+      po,
       {
         pendingJob: s.type,
         runningJob: w.type,
@@ -2519,7 +2522,7 @@ const uo = ({
     )
   ] }) });
 };
-function mo({
+function bo({
   db: e,
   attr: t,
   onClose: a,
@@ -2547,7 +2550,7 @@ function mo({
   async function I() {
     if (!t.linkConfig.reverse)
       throw new Error("No reverse link config");
-    if (_ !== M && await co({
+    if (_ !== M && await uo({
       appId: l,
       attr: t,
       isRequired: _,
@@ -2637,7 +2640,7 @@ function mo({
     ] }),
     t.type === "blob" ? /* @__PURE__ */ h(j, { children: [
       /* @__PURE__ */ r(
-        fo,
+        mo,
         {
           appId: l,
           attr: t,
@@ -2763,7 +2766,7 @@ const Ge = [
   { value: "boolean", label: "boolean" },
   { value: "json", label: "json" }
 ];
-function bo({
+function wo({
   onSave: e,
   onChange: t,
   onKeyDown: a,
@@ -2798,27 +2801,27 @@ const vt = {
   boolean: !1,
   json: {}
 };
-function wo(e) {
+function vo(e) {
   return e ? e === "date" ? Ge.filter(
     (t) => t.value === "string" || t.value === "number"
   ) : Ge.filter((t) => t.value === e) : Ge;
 }
 const Fr = (e) => !!e && typeof e == "object";
-function vo(e) {
+function yo(e) {
   try {
     return JSON.parse(e), !0;
   } catch {
     return !1;
   }
 }
-function yo(e) {
+function ko(e) {
   try {
     return JSON.parse(e);
   } catch {
     return e;
   }
 }
-function ko(e, t) {
+function xo(e, t) {
   if (e.checkedDataType)
     return e.checkedDataType === "date" ? "string" : e.checkedDataType;
   if (t != null) {
@@ -2843,11 +2846,11 @@ function ar(e, t) {
     if (t === "string")
       return Fr(e) ? JSON.stringify(e) : String(e);
     if (t === "json")
-      return yo(e);
+      return ko(e);
   }
   return e;
 }
-function xo(e) {
+function So(e) {
   return Cn(e) ? null : "Invalid UUID.";
 }
 function nr({
@@ -2891,7 +2894,7 @@ function nr({
     ] }) })
   ] }) });
 }
-function So({
+function No({
   q: e,
   option: t,
   uniqueAttrs: a,
@@ -2949,7 +2952,7 @@ function So({
     t.id
   );
 }
-function No({
+function Eo({
   db: e,
   namespace: t,
   onLinkRef: a,
@@ -3015,7 +3018,7 @@ function No({
             static: !0,
             className: "absolute left-0 z-10 mt-1 max-h-[25vh] w-full divide-y overflow-scroll rounded-md border border-gray-300 bg-white shadow-lg empty:invisible dark:border-neutral-700 dark:bg-neutral-800",
             children: (s || []).map((f) => /* @__PURE__ */ r(
-              So,
+              No,
               {
                 q: l,
                 option: f,
@@ -3035,7 +3038,7 @@ function No({
     u ? "query-loading" : "query-loaded"
   ) });
 }
-function Eo({
+function Co({
   db: e,
   item: t,
   attr: a,
@@ -3092,7 +3095,7 @@ function Eo({
         ] }, u);
     }),
     g ? /* @__PURE__ */ r(
-      No,
+      Eo,
       {
         namespace: n,
         onLinkRef: (u) => l(a, u),
@@ -3103,7 +3106,7 @@ function Eo({
     ) : /* @__PURE__ */ r(V, { variant: "secondary", onClick: () => c(!0), children: m === "many" || !d ? "Add link" : "Replace link" })
   ] });
 }
-const Co = (e, t) => {
+const Io = (e, t) => {
   switch (e.name) {
     case "$files":
       return t.type === "blob" && t.name === "path";
@@ -3112,7 +3115,7 @@ const Co = (e, t) => {
     default:
       return t.type === "blob";
   }
-}, Io = (e) => {
+}, Ao = (e) => {
   switch (e.namespace) {
     case "$streams":
       return !1;
@@ -3128,10 +3131,10 @@ function or({
 }) {
   const o = a.id ? "edit" : "add", l = de(), i = [], g = [];
   for (const S of t.attrs)
-    S.name !== "id" && (Co(t, S) && i.push(S), S.type === "ref" && Io(S) && g.push(S));
+    S.name !== "id" && (Io(t, S) && i.push(S), S.type === "ref" && Ao(S) && g.push(S));
   const c = i.reduce(
     (S, T) => {
-      const I = a[T.name], A = ko(T, I), D = o === "add" ? T.isRequired ? vt[A] : null : I;
+      const I = a[T.name], A = xo(T, I), D = o === "add" ? T.isRequired ? vt[A] : null : I;
       return {
         ...S,
         [T.name]: {
@@ -3190,7 +3193,7 @@ function or({
         [S]: { type: "json", value: void 0, error: "Invalid JSON" }
       } : {
         ...I,
-        [S]: vo(T) ? { type: "json", value: JSON.parse(T), error: null } : { ...A, type: "json", error: "Invalid JSON" }
+        [S]: yo(T) ? { type: "json", value: JSON.parse(T), error: null } : { ...A, type: "json", error: "Invalid JSON" }
       };
     });
   }, G = (S, T) => {
@@ -3324,7 +3327,7 @@ function or({
           {
             className: "flex w-full flex-1 rounded-xs border-gray-200 bg-white px-3 py-1 placeholder:text-gray-400 dark:border-neutral-700 dark:bg-neutral-800",
             value: p.id?.value ?? "",
-            onChange: (S) => M("id", S.target.value, xo)
+            onChange: (S) => M("id", S.target.value, So)
           }
         ) }),
         " ",
@@ -3352,7 +3355,7 @@ function or({
                 {
                   className: "w-24 rounded-sm px-2 py-0.5 text-sm",
                   value: A,
-                  options: wo(S.checkedDataType),
+                  options: vo(S.checkedDataType),
                   onChange: (W) => q(
                     S.name,
                     W.value
@@ -3402,7 +3405,7 @@ function or({
                   onChange: (W) => M(S.name, W.target.value)
                 }
               ) : /* @__PURE__ */ r(
-                bo,
+                wo,
                 {
                   tabIndex: I,
                   value: D ?? "",
@@ -3443,7 +3446,7 @@ function or({
             ] })
           ] }),
           /* @__PURE__ */ r("div", { className: "flex flex-col gap-1", children: /* @__PURE__ */ r(
-            Eo,
+            Co,
             {
               db: e,
               item: a,
@@ -3477,8 +3480,8 @@ function or({
     ] })
   ] });
 }
-const Ao = [];
-function Ro(e, t, a, n = !1) {
+const Ro = [];
+function To(e, t, a, n = !1) {
   if (e.length === 0) return;
   const o = t.filter(
     (c) => c.id !== "select-col" && c.header !== void 0 && !c.meta?.isLink
@@ -3496,7 +3499,7 @@ function Ro(e, t, a, n = !1) {
   }), g = sn(i)(l);
   n ? (dn(i)(g), oe("CSV file downloaded")) : (We(g.toString()), oe("CSV copied to clipboard"));
 }
-function To(e, t, a, n = !1) {
+function Oo(e, t, a, n = !1) {
   if (e.length === 0) return;
   const o = t.filter(
     (c) => c.id !== "select-col" && c.header !== void 0 && !c.meta?.isLink
@@ -3510,7 +3513,7 @@ function To(e, t, a, n = !1) {
   } else
     We(g), oe("Markdown copied to clipboard");
 }
-function Oo(e, t, a, n = !1) {
+function _o(e, t, a, n = !1) {
   if (e.length === 0) return;
   const o = t.filter(
     (g) => g.id !== "select-col" && g.header !== void 0 && !g.meta?.isLink
@@ -3527,7 +3530,7 @@ function Oo(e, t, a, n = !1) {
   } else
     We(i), oe("JSON copied to clipboard");
 }
-const _o = ({ db: e, namespaces: t }) => {
+const Do = ({ db: e, namespaces: t }) => {
   const { explorerState: a, history: n } = ut(), o = de(), l = a, i = t.find(
     (E) => E.id === l.namespace
   ), [g, c] = C(50), [p, m] = C([]), [d, u] = C(!1), [s, f] = C(""), [b, w] = C(!1), [v, k] = C(null), [x, _] = C(null), [q, M] = C(!1), L = X(null), [G, H] = C({}), Y = X(null), z = i?.name?.startsWith("$") ?? !1, B = i?.name ?? "", S = z && !["$users", "$files", "$streams"].includes(B), T = G[B] || 0, I = l?.sortAttr || "serverCreatedAt", A = l?.sortAsc ?? !0, D = (E, N) => {
@@ -3543,16 +3546,16 @@ const _o = ({ db: e, namespaces: t }) => {
       }
       return Be;
     });
-  }, [F, Q] = C([]), { itemsRes: re, allCount: W } = Gn(
+  }, [F, Q] = C([]), { itemsRes: re, allCount: W } = Hn(
     e,
     i,
     l?.where,
-    l?.filters || F,
+    qn(l?.where, l?.filters, F),
     g,
     T,
     I,
     A
-  ), ie = re.data?.[i?.name ?? ""] ?? Ao;
+  ), ie = re.data?.[i?.name ?? ""] ?? Ro;
   function ye(E, N) {
     return E.filter((R) => N[R.id]);
   }
@@ -3561,7 +3564,7 @@ const _o = ({ db: e, namespaces: t }) => {
       if (u(!0), p.length === 0)
         return;
       const [E] = p;
-      await $o(
+      await zo(
         o.adminToken,
         o.appId,
         E,
@@ -3578,7 +3581,7 @@ const _o = ({ db: e, namespaces: t }) => {
       Gt(E, 285);
       return;
     }
-    const N = Kn(E, 800);
+    const N = Xn(E, 800);
     Gt(E, N);
   }, Gt = (E, N = 200) => {
     if (!i)
@@ -3681,7 +3684,7 @@ const _o = ({ db: e, namespaces: t }) => {
                 }
               );
             if (N.name === "size")
-              return Yn(R.row.original[N.name]);
+              return Kn(R.row.original[N.name]);
           }
           if (N.checkedDataType === "boolean")
             return R.row.original[N.name] ? "true" : "false";
@@ -3689,7 +3692,7 @@ const _o = ({ db: e, namespaces: t }) => {
             const $ = Ma(R.row.original[N.name]);
             return ke && $?.toLocaleString() || R.row.original[N.name];
           }
-          return Se(R.row.original[N.name]) ? /* @__PURE__ */ r(Lo, { data: R.row.original[N.name] }) : R.row.original[N.name];
+          return Se(R.row.original[N.name]) ? /* @__PURE__ */ r(Fo, { data: R.row.original[N.name] }) : R.row.original[N.name];
         }
       });
     }), E;
@@ -3711,7 +3714,7 @@ const _o = ({ db: e, namespaces: t }) => {
       });
     }
     qt(!1), ae.setColumnSizing(() => ({ ...E }));
-  }, ia = "onChange", la = "ltr", et = Wn({
+  }, ia = "onChange", la = "ltr", et = Vn({
     appId: o.appId,
     attrs: i?.attrs,
     namespaceId: i?.id
@@ -3953,7 +3956,7 @@ const _o = ({ db: e, namespaces: t }) => {
         open: !!v,
         onClose: () => k(null),
         children: i ? /* @__PURE__ */ r(
-          oo,
+          io,
           {
             readOnly: S,
             isSystemCatalogNs: z,
@@ -4038,7 +4041,15 @@ const _o = ({ db: e, namespaces: t }) => {
           /* @__PURE__ */ r(
             Mn,
             {
-              onSearchChange: (E) => Q(E),
+              onSearchChange: (E) => {
+                Q(E), n.push(
+                  (N) => ({
+                    ...N,
+                    filters: E.length ? E : void 0
+                  }),
+                  !0
+                );
+              },
               attrs: i?.attrs,
               initialFilters: l?.filters || []
             },
@@ -4249,7 +4260,7 @@ const _o = ({ db: e, namespaces: t }) => {
                           ie,
                           Ee
                         );
-                        Ro(
+                        To(
                           N,
                           Le,
                           i.name,
@@ -4272,7 +4283,7 @@ const _o = ({ db: e, namespaces: t }) => {
                           ie,
                           Ee
                         );
-                        To(
+                        Oo(
                           N,
                           Le,
                           i.name,
@@ -4295,7 +4306,7 @@ const _o = ({ db: e, namespaces: t }) => {
                           ie,
                           Ee
                         );
-                        Oo(
+                        _o(
                           N,
                           Le,
                           i.name,
@@ -4341,7 +4352,7 @@ const _o = ({ db: e, namespaces: t }) => {
         ] }),
         /* @__PURE__ */ r("div", { className: "grow" }),
         /* @__PURE__ */ r("div", { className: "px-2", children: /* @__PURE__ */ r(
-          eo,
+          to,
           {
             localDates: ke,
             setLocalDates: ea,
@@ -4394,7 +4405,7 @@ const _o = ({ db: e, namespaces: t }) => {
                         items: Fe,
                         strategy: Wt,
                         children: E.headers.map((N, R) => /* @__PURE__ */ r(
-                          Zn,
+                          Qn,
                           {
                             header: N,
                             table: ae,
@@ -4424,7 +4435,7 @@ const _o = ({ db: e, namespaces: t }) => {
                           {
                             items: Fe,
                             strategy: Wt,
-                            children: /* @__PURE__ */ r(Qn, { cell: N }, N.id)
+                            children: /* @__PURE__ */ r(Jn, { cell: N }, N.id)
                           },
                           N.id
                         ))
@@ -4451,31 +4462,31 @@ const _o = ({ db: e, namespaces: t }) => {
     ] })
   ] });
 };
-function Do(e, t) {
+function Lo(e, t) {
   return Se(e) ? JSON.stringify(e, null, t ? 2 : void 0) : String(e);
 }
-function Lo({ data: e, pretty: t }) {
-  const a = de(), n = Do(e, t);
+function Fo({ data: e, pretty: t }) {
+  const a = de(), n = Lo(e, t);
   return t && Se(e) ? /* @__PURE__ */ r($t, { darkMode: a.darkMode, code: n, language: "json" }) : /* @__PURE__ */ r(j, { children: n });
 }
-async function Fo(e, t) {
+async function $o(e, t) {
   const a = await fetch(e, t), n = await a.json();
   return a.status === 200 ? Promise.resolve(n) : Promise.reject({ status: a.status, body: n });
 }
-async function $o(e, t, a, n, o) {
+async function zo(e, t, a, n, o) {
   const l = {
     app_id: t,
     path: n || a.name,
     authorization: `Bearer ${e}`,
     "content-type": a.type
   };
-  return await Fo(`${o}/dash/apps/${t}/storage/upload`, {
+  return await $o(`${o}/dash/apps/${t}/storage/upload`, {
     method: "PUT",
     headers: l,
     body: a
   });
 }
-function zo(e, t) {
+function Bo(e, t) {
   const a = (n) => {
     e.current && n.target instanceof HTMLElement && !e.current.contains(n.target) && t();
   };
@@ -4483,7 +4494,7 @@ function zo(e, t) {
     document.removeEventListener("click", a);
   }));
 }
-const Bo = ({
+const jo = ({
   namespaces: e,
   db: t,
   appId: a
@@ -4494,7 +4505,7 @@ const Bo = ({
     `${a}:recentExplorerNamespace`,
     i?.id || ""
   );
-  zo(p, () => {
+  Bo(p, () => {
     c(!1);
   }), P(
     function() {
@@ -4613,11 +4624,11 @@ const Bo = ({
             children: /* @__PURE__ */ r(Ya, { height: "1rem", className: "dark:text-white" })
           }
         ) }),
-        n.explorerState && /* @__PURE__ */ r(_o, { namespaces: e, db: t })
+        n.explorerState && /* @__PURE__ */ r(Do, { namespaces: e, db: t })
       ]
     }
   );
-}, jo = ({
+}, Mo = ({
   appId: e,
   apiURI: t,
   websocketURI: a,
@@ -4634,7 +4645,7 @@ const Bo = ({
   }),
   [e, t, a, n]
 );
-class Mo extends dr {
+class Uo extends dr {
   state = {
     hasError: !1,
     error: null
@@ -4688,7 +4699,7 @@ const Tt = cr({ props: null, history: { push: () => {
       "useExplorerProps must be used within an Explorer component"
     );
   return { explorerState: e.props.explorerState, history: e.history };
-}, $r = (e) => e.explorerState !== void 0 || e.setExplorerState !== void 0, Uo = (e, t, a) => {
+}, $r = (e) => e.explorerState !== void 0 || e.setExplorerState !== void 0, Po = (e, t, a) => {
   const n = $r(e);
   return {
     ...e,
@@ -4701,10 +4712,10 @@ const Tt = cr({ props: null, history: { push: () => {
     setExplorerState: e.setExplorerState || a,
     useShadowDOM: e.useShadowDOM === void 0 ? !0 : e.useShadowDOM
   };
-}, Zi = (e) => {
+}, Qi = (e) => {
   const [t, a] = C(
     null
-  ), n = Uo(
+  ), n = Po(
     e,
     t,
     a
@@ -4726,7 +4737,7 @@ const Tt = cr({ props: null, history: { push: () => {
       }
       return w;
     });
-  }, [l]), m = jo({
+  }, [l]), m = Mo({
     appId: n.appId,
     apiURI: n.apiURI,
     websocketURI: n.websocketURI,
@@ -4739,7 +4750,7 @@ const Tt = cr({ props: null, history: { push: () => {
     }
     u.current !== n.appId && (u.current = n.appId, g([]), $r(e) || a(null));
   }, [n.appId, e]);
-  const s = Hn(m), f = se(
+  const s = Wn(m), f = se(
     () => ({
       props: n,
       history: {
@@ -4749,9 +4760,9 @@ const Tt = cr({ props: null, history: { push: () => {
       }
     }),
     [n, c, p, i]
-  ), b = n.useShadowDOM ? Po : He.Fragment;
-  return /* @__PURE__ */ r(Tt.Provider, { value: f, children: /* @__PURE__ */ r(b, { children: /* @__PURE__ */ r(Mo, { children: /* @__PURE__ */ r(
-    Bo,
+  ), b = n.useShadowDOM ? qo : He.Fragment;
+  return /* @__PURE__ */ r(Tt.Provider, { value: f, children: /* @__PURE__ */ r(b, { children: /* @__PURE__ */ r(Uo, { children: /* @__PURE__ */ r(
+    jo,
     {
       appId: n.appId,
       db: m,
@@ -4769,7 +4780,7 @@ function Xe() {
 function pt() {
   return dt(Ot).darkMode;
 }
-const Po = ({ children: e }) => {
+const qo = ({ children: e }) => {
   const t = X(null), a = X(null), [n, o] = C(null), i = de().darkMode;
   P(() => {
     if (t.current && !n)
@@ -4800,7 +4811,7 @@ function zr({
 }) {
   return /* @__PURE__ */ r(J.Root, { "data-slot": "select", ...e });
 }
-function qo({
+function Go({
   ...e
 }) {
   return /* @__PURE__ */ r(J.Group, { "data-slot": "select-group", ...e });
@@ -4860,7 +4871,7 @@ function Mr({
       position: a,
       ...n,
       children: [
-        /* @__PURE__ */ r(Wo, {}),
+        /* @__PURE__ */ r(Vo, {}),
         /* @__PURE__ */ r(
           J.Viewport,
           {
@@ -4871,12 +4882,12 @@ function Mr({
             children: t
           }
         ),
-        /* @__PURE__ */ r(Vo, {})
+        /* @__PURE__ */ r(Yo, {})
       ]
     }
   ) });
 }
-function Go({
+function Ho({
   className: e,
   ...t
 }) {
@@ -4910,7 +4921,7 @@ function Ur({
     }
   );
 }
-function Ho({
+function Wo({
   className: e,
   ...t
 }) {
@@ -4923,7 +4934,7 @@ function Ho({
     }
   );
 }
-function Wo({
+function Vo({
   className: e,
   ...t
 }) {
@@ -4940,7 +4951,7 @@ function Wo({
     }
   );
 }
-function Vo({
+function Yo({
   className: e,
   ...t
 }) {
@@ -7929,7 +7940,7 @@ y.languages.wasm = {
   number: /[+-]?\b(?:\d(?:_?\d)*(?:\.\d(?:_?\d)*)?(?:[eE][+-]?\d(?:_?\d)*)?|0x[\da-fA-F](?:_?[\da-fA-F])*(?:\.[\da-fA-F](?:_?[\da-fA-D])*)?(?:[pP][+-]?\d(?:_?\d)*)?)\b|\binf\b|\bnan(?::0x[\da-fA-F](?:_?[\da-fA-D])*)?\b/,
   punctuation: /[()]/
 };
-var Yo = {
+var Ko = {
   plain: {
     backgroundColor: "#2a2734",
     color: "#9a86fd"
@@ -7995,10 +8006,10 @@ var Yo = {
       color: "#c4b9fe"
     }
   }]
-}, Ko = {
+}, Xo = {
   // $FlowFixMe
   Prism: y,
-  theme: Yo
+  theme: Ko
 };
 function Ue(e, t, a) {
   return t in e ? Object.defineProperty(e, t, {
@@ -8018,7 +8029,7 @@ function he() {
     return e;
   }, he.apply(this, arguments);
 }
-var Xo = /\r\n|\r|\n/, ir = function(e) {
+var Zo = /\r\n|\r|\n/, ir = function(e) {
   e.length === 0 ? e.push({
     types: ["plain"],
     content: `
@@ -8029,7 +8040,7 @@ var Xo = /\r\n|\r|\n/, ir = function(e) {
 }, lr = function(e, t) {
   var a = e.length;
   return a > 0 && e[a - 1] === t ? e : e.concat(t);
-}, Zo = function(e) {
+}, Qo = function(e) {
   for (var t = [[]], a = [e], n = [0], o = [e.length], l = 0, i = 0, g = [], c = [g]; i > -1; ) {
     for (; (l = n[i]++) < o[i]; ) {
       var p = void 0, m = t[i], d = a[i], u = d[l];
@@ -8037,7 +8048,7 @@ var Xo = /\r\n|\r|\n/, ir = function(e) {
         i++, t.push(m), a.push(p), n.push(0), o.push(p.length);
         continue;
       }
-      var s = p.split(Xo), f = s.length;
+      var s = p.split(Zo), f = s.length;
       g.push({
         types: m,
         content: s[0]
@@ -8051,7 +8062,7 @@ var Xo = /\r\n|\r|\n/, ir = function(e) {
     i--, t.pop(), a.pop(), n.pop(), o.pop();
   }
   return ir(g), c;
-}, Qo = function(e, t) {
+}, Jo = function(e, t) {
   var a = e.plain, n = /* @__PURE__ */ Object.create(null), o = e.styles.reduce(function(l, i) {
     var g = i.languages, c = i.style;
     return g && !g.includes(t) || i.types.forEach(function(p) {
@@ -8068,14 +8079,14 @@ function sr(e, t) {
   for (var n in e) Object.prototype.hasOwnProperty.call(e, n) && t.indexOf(n) === -1 && (a[n] = e[n]);
   return a;
 }
-var Jo = /* @__PURE__ */ function(e) {
+var ei = /* @__PURE__ */ function(e) {
   function t() {
     for (var a = this, n = [], o = arguments.length; o--; ) n[o] = arguments[o];
     e.apply(this, n), Ue(this, "getThemeDict", function(l) {
       if (a.themeDict !== void 0 && l.theme === a.prevTheme && l.language === a.prevLanguage)
         return a.themeDict;
       a.prevTheme = l.theme, a.prevLanguage = l.language;
-      var i = l.theme ? Qo(l.theme, l.language) : void 0;
+      var i = l.theme ? Jo(l.theme, l.language) : void 0;
       return a.themeDict = i;
     }), Ue(this, "getLineProps", function(l) {
       var i = l.key, g = l.className, c = l.style, p = sr(l, ["key", "className", "style", "line"]), m = p, d = he({}, m, {
@@ -8123,7 +8134,7 @@ var Jo = /* @__PURE__ */ function(e) {
     });
   }
   return e && (t.__proto__ = e), t.prototype = Object.create(e && e.prototype), t.prototype.constructor = t, t.prototype.render = function() {
-    var n = this.props, o = n.Prism, l = n.language, i = n.code, g = n.children, c = this.getThemeDict(this.props), p = o.languages[l], m = p !== void 0 ? this.tokenize(o, i, p, l) : [i], d = Zo(m);
+    var n = this.props, o = n.Prism, l = n.language, i = n.code, g = n.children, c = this.getThemeDict(this.props), p = o.languages[l], m = p !== void 0 ? this.tokenize(o, i, p, l) : [i], d = Qo(m);
     return g({
       tokens: d,
       className: "prism-code language-" + l,
@@ -8133,16 +8144,16 @@ var Jo = /* @__PURE__ */ function(e) {
     });
   }, t;
 }(dr);
-const ei = (e) => ti(
+const ti = (e) => ri(
   () => In.parse(e, (a, n) => n === !0 ? "true" : n === !1 ? "false" : n)
-), ti = (e) => {
+), ri = (e) => {
   try {
     return { status: "ok", value: e() };
   } catch (t) {
     return { status: "error", error: t };
   }
 };
-function ri(e, t, a) {
+function ai(e, t, a) {
   const n = ur();
   P(() => {
     if (!t || !a) return;
@@ -8166,7 +8177,7 @@ function ri(e, t, a) {
     };
   }, [t, e, a, n]);
 }
-const ai = {
+const ni = {
   plain: {
     backgroundColor: "#fff",
     color: "#575279"
@@ -8209,10 +8220,10 @@ const ai = {
       style: { color: "#b4637a" }
     }
   ]
-}, ni = ue("div", "flex flex-col gap-2"), oi = ue("div", "flex flex-col gap-2 md:flex-row"), gt = ue("div", "prose dark:text-neutral-400"), ii = ue("div", "text-2xl font-bold"), li = ue("div", "text-xl font-bold"), si = ue("div", "text-lg"), di = ue("div", "text-md font-bold"), ci = ue("div", "text-sm text-gray-400"), Re = ue(
+}, oi = ue("div", "flex flex-col gap-2"), ii = ue("div", "flex flex-col gap-2 md:flex-row"), gt = ue("div", "prose dark:text-neutral-400"), li = ue("div", "text-2xl font-bold"), si = ue("div", "text-xl font-bold"), di = ue("div", "text-lg"), ci = ue("div", "text-md font-bold"), ui = ue("div", "text-sm text-gray-400"), Re = ue(
   "div",
   "text-sm font-bold dark:text-neutral-400 text-gray-700"
-), ui = ({
+), pi = ({
   size: e = "mini",
   className: t
 }) => /* @__PURE__ */ r(
@@ -8343,7 +8354,7 @@ function Ne({
     g ? /* @__PURE__ */ r("div", { className: "text-sm text-red-600", children: g }) : null
   ] });
 }
-function pi({
+function gi({
   value: e,
   autoFocus: t,
   className: a,
@@ -8596,7 +8607,7 @@ function st() {
     }
   };
 }
-function gi({
+function hi({
   ...e
 }) {
   return /* @__PURE__ */ r(Te.Root, { "data-slot": "dialog", ...e });
@@ -8618,7 +8629,7 @@ const Hr = He.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ r(
     ...t
   }
 ));
-function hi({ title: e }) {
+function fi({ title: e }) {
   const t = Xe(), a = He.useRef(null);
   return He.useEffect(() => {
     if (!t || process.env.NODE_ENV === "production")
@@ -8651,7 +8662,7 @@ function Wr({
       ),
       ...o,
       children: [
-        /* @__PURE__ */ r(hi, { title: n }),
+        /* @__PURE__ */ r(fi, { title: n }),
         t,
         a && /* @__PURE__ */ h(
           Te.Close,
@@ -8678,7 +8689,7 @@ function fe({
   hideCloseButton: i = !1
 }) {
   return /* @__PURE__ */ r(
-    gi,
+    hi,
     {
       onOpenChange: (g) => {
         g || a();
@@ -8715,7 +8726,7 @@ function ge({
 }) {
   return /* @__PURE__ */ r("form", { onSubmit: (a) => a.preventDefault(), className: e, children: t });
 }
-function fi(e, t) {
+function mi(e, t) {
   let a = e;
   const n = t?.message, o = t?.hint?.errors?.[0]?.message, l = n?.length;
   return l && (a += `
@@ -8742,7 +8753,7 @@ function ve({
       try {
         await c(), g && oe(g);
       } catch (f) {
-        le(fi(i, f));
+        le(mi(i, f));
       } finally {
         u(!1);
       }
@@ -8765,7 +8776,7 @@ function ve({
 function _t(e) {
   return e.length === 36 && e.indexOf("-") === 8 ? e.replaceAll(/[^-]/g, "*") : e.replaceAll(/./g, "*");
 }
-function mi({
+function bi({
   value: e,
   label: t,
   size: a = "normal",
@@ -8830,7 +8841,7 @@ function mi({
     }
   );
 }
-function bi({
+function wi({
   value: e,
   label: t,
   size: a = "normal",
@@ -8922,7 +8933,7 @@ function bi({
     }
   );
 }
-function wi({ value: e }) {
+function vi({ value: e }) {
   const [t, a] = C(!1);
   return /* @__PURE__ */ h("span", { className: "inline-flex items-center rounded-sm bg-gray-500 px-2 text-sm text-white", children: [
     /* @__PURE__ */ r(
@@ -9004,7 +9015,7 @@ const ft = ({
       )
     ]
   }
-), vi = ({
+), yi = ({
   children: e,
   className: t
 }) => /* @__PURE__ */ r(
@@ -9200,9 +9211,9 @@ function Ft(e) {
     }
   );
 }
-function yi(e) {
+function ki(e) {
   const [t, a] = C(e.value), o = `json-editor-${ur()}.json`, [l, i] = C(void 0);
-  return ri(o, l, e.schema), P(() => {
+  return ai(o, l, e.schema), P(() => {
     a(e.value);
   }, [e.value]), /* @__PURE__ */ h("div", { className: "flex h-full min-h-0 flex-col bg-gray-50 dark:bg-[#252525]", children: [
     /* @__PURE__ */ h("div", { className: "flex items-center justify-between gap-4 border-b px-4 py-2 dark:border-b-neutral-700", children: [
@@ -9235,7 +9246,7 @@ function yi(e) {
             m && setTimeout(async () => {
               const d = m.getValue();
               if (!d.trim()) return;
-              const u = ei(d);
+              const u = ti(d);
               u.status === "ok" && m.setValue(JSON.stringify(u.value, null, 2));
             }, 20);
           });
@@ -9244,7 +9255,7 @@ function yi(e) {
     ) })
   ] });
 }
-function ki(e) {
+function xi(e) {
   const [t, a] = Rt("diffSideBySide", !1), n = X(null);
   return P(() => {
     const o = n.current;
@@ -9304,9 +9315,9 @@ function $t({
 }) {
   const [i, g] = C("Copy");
   return /* @__PURE__ */ r(
-    Jo,
+    ei,
     {
-      ...Ko,
+      ...Xo,
       code: e.trimEnd(),
       language: t,
       theme: n ? {
@@ -9315,7 +9326,7 @@ function $t({
           color: "white"
         },
         styles: []
-      } : ai,
+      } : ni,
       children: ({ className: c, style: p, tokens: m, getTokenProps: d }) => /* @__PURE__ */ h(
         "pre",
         {
@@ -9386,19 +9397,19 @@ function Jr({
     }
   );
 }
-const Qi = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const Ji = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   ActionButton: ve,
   ActionForm: ge,
-  Badge: vi,
+  Badge: yi,
   BaseSelect: zr,
-  BlockHeading: di,
+  BlockHeading: ci,
   Button: V,
   Checkbox: te,
   CodeEditor: Ft,
   Content: gt,
-  Copyable: bi,
-  Copytext: wi,
+  Copyable: wi,
+  Copytext: vi,
   Dialog: fe,
   DialogContent: Wr,
   DialogOverlay: Hr,
@@ -9411,30 +9422,30 @@ const Qi = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   DropdownMenuTrigger: Xr,
   Fence: $t,
   FullscreenLoading: Lt,
-  Group: oi,
-  Hint: ci,
+  Group: ii,
+  Hint: ui,
   IconButton: ht,
   InfoTip: Dt,
-  JSONDiffEditor: ki,
-  JSONEditor: yi,
+  JSONDiffEditor: xi,
+  JSONEditor: ki,
   Label: Re,
-  LogoIcon: ui,
+  LogoIcon: pi,
   ProgressButton: Vr,
-  ScreenHeading: ii,
-  SectionHeading: li,
+  ScreenHeading: li,
+  SectionHeading: si,
   Select: we,
   SelectContent: Mr,
-  SelectGroup: qo,
+  SelectGroup: Go,
   SelectItem: Ur,
-  SelectLabel: Go,
-  SelectSeparator: Ho,
+  SelectLabel: Ho,
+  SelectSeparator: Wo,
   SelectTrigger: jr,
   SelectValue: Br,
-  SmallCopyable: mi,
-  Stack: ni,
-  SubsectionHeading: si,
+  SmallCopyable: bi,
+  Stack: oi,
+  SubsectionHeading: di,
   Switch: Jr,
-  TextArea: pi,
+  TextArea: gi,
   TextInput: Ne,
   Toaster: fa,
   ToggleCollection: Pr,
@@ -9452,15 +9463,15 @@ const Qi = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
 export {
   ve as ActionButton,
   ge as ActionForm,
-  vi as Badge,
+  yi as Badge,
   zr as BaseSelect,
-  di as BlockHeading,
+  ci as BlockHeading,
   V as Button,
   te as Checkbox,
   Ft as CodeEditor,
   gt as Content,
-  bi as Copyable,
-  wi as Copytext,
+  wi as Copyable,
+  vi as Copytext,
   fe as Dialog,
   Wr as DialogContent,
   Hr as DialogOverlay,
@@ -9471,36 +9482,36 @@ export {
   Pe as DropdownMenuItem,
   Qr as DropdownMenuSeparator,
   Xr as DropdownMenuTrigger,
-  Zi as Explorer,
+  Qi as Explorer,
   $t as Fence,
   Lt as FullscreenLoading,
-  oi as Group,
-  ci as Hint,
+  ii as Group,
+  ui as Hint,
   ht as IconButton,
   Dt as InfoTip,
-  ki as JSONDiffEditor,
-  yi as JSONEditor,
+  xi as JSONDiffEditor,
+  ki as JSONEditor,
   Re as Label,
-  ui as LogoIcon,
+  pi as LogoIcon,
   Vr as ProgressButton,
-  ii as ScreenHeading,
-  li as SectionHeading,
+  li as ScreenHeading,
+  si as SectionHeading,
   we as Select,
   Mr as SelectContent,
-  qo as SelectGroup,
+  Go as SelectGroup,
   Ur as SelectItem,
-  Go as SelectLabel,
-  Ho as SelectSeparator,
+  Ho as SelectLabel,
+  Wo as SelectSeparator,
   jr as SelectTrigger,
   Br as SelectValue,
-  mi as SmallCopyable,
-  ni as Stack,
-  Po as StyleMe,
-  si as SubsectionHeading,
+  bi as SmallCopyable,
+  oi as Stack,
+  qo as StyleMe,
+  di as SubsectionHeading,
   Jr as Switch,
-  pi as TextArea,
+  gi as TextArea,
   Ne as TextInput,
-  tl as Toaster,
+  rl as Toaster,
   Pr as ToggleCollection,
   qr as ToggleGroup,
   Ze as Tooltip,
@@ -9509,8 +9520,8 @@ export {
   Qe as TooltipTrigger,
   O as cn,
   _t as redactedValue,
-  rl as toast,
+  al as toast,
   ue as twel,
-  Qi as ui,
+  Ji as ui,
   st as useDialog
 };