@motiadev/plugin-states 0.13.0-beta.162-945354 → 0.13.0-beta.162-080298

package/dist/index.js

@@ -1,775 +1,1996 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Button, Checkbox, Input, Sidebar, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, cn, useThemeStore } from "@motiadev/ui";
-import { AlertCircle, Check, Loader2, RefreshCw, Save, Search, Trash, X } from "lucide-react";
-import { create } from "zustand";
-import JsonView from "react18-json-view";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import Editor, { useMonaco } from "@monaco-editor/react";
-
-import './index.css';
-//#region rolldown:runtime
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __commonJS = (cb, mod) => function() {
-	return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+import * as D from "react";
+import W, { forwardRef as _t, createElement as Te, useState as P, useCallback as K, useEffect as Y, createContext as Yt, useContext as te, isValidElement as qt, useRef as V, useMemo as ue, memo as Fe } from "react";
+import { useThemeStore as Bt, Button as ye, Sidebar as Wt, Input as Kt, Table as Gt, TableHeader as Xt, TableRow as Ke, TableHead as pe, Checkbox as Ge, TableBody as Qt, cn as er, TableCell as ge } from "@motiadev/ui";
+var he = { exports: {} }, se = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var Xe;
+function tr() {
+  if (Xe) return se;
+  Xe = 1;
+  var e = Symbol.for("react.transitional.element"), t = Symbol.for("react.fragment");
+  function r(n, s, o) {
+    var c = null;
+    if (o !== void 0 && (c = "" + o), s.key !== void 0 && (c = "" + s.key), "key" in s) {
+      o = {};
+      for (var l in s)
+        l !== "key" && (o[l] = s[l]);
+    } else o = s;
+    return s = o.ref, {
+      $$typeof: e,
+      type: n,
+      key: c,
+      ref: s !== void 0 ? s : null,
+      props: o
+    };
+  }
+  return se.Fragment = t, se.jsx = r, se.jsxs = r, se;
+}
+var oe = {};
+/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var Qe;
+function rr() {
+  return Qe || (Qe = 1, process.env.NODE_ENV !== "production" && function() {
+    function e(i) {
+      if (i == null) return null;
+      if (typeof i == "function")
+        return i.$$typeof === C ? null : i.displayName || i.name || null;
+      if (typeof i == "string") return i;
+      switch (i) {
+        case A:
+          return "Fragment";
+        case N:
+          return "Profiler";
+        case f:
+          return "StrictMode";
+        case m:
+          return "Suspense";
+        case w:
+          return "SuspenseList";
+        case _:
+          return "Activity";
+      }
+      if (typeof i == "object")
+        switch (typeof i.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), i.$$typeof) {
+          case O:
+            return "Portal";
+          case M:
+            return (i.displayName || "Context") + ".Provider";
+          case E:
+            return (i._context.displayName || "Context") + ".Consumer";
+          case b:
+            var p = i.render;
+            return i = i.displayName, i || (i = p.displayName || p.name || "", i = i !== "" ? "ForwardRef(" + i + ")" : "ForwardRef"), i;
+          case y:
+            return p = i.displayName || null, p !== null ? p : e(i.type) || "Memo";
+          case H:
+            p = i._payload, i = i._init;
+            try {
+              return e(i(p));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function t(i) {
+      return "" + i;
+    }
+    function r(i) {
+      try {
+        t(i);
+        var p = !1;
+      } catch {
+        p = !0;
+      }
+      if (p) {
+        p = console;
+        var x = p.error, h = typeof Symbol == "function" && Symbol.toStringTag && i[Symbol.toStringTag] || i.constructor.name || "Object";
+        return x.call(
+          p,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          h
+        ), t(i);
+      }
+    }
+    function n(i) {
+      if (i === A) return "<>";
+      if (typeof i == "object" && i !== null && i.$$typeof === H)
+        return "<...>";
+      try {
+        var p = e(i);
+        return p ? "<" + p + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function s() {
+      var i = $.A;
+      return i === null ? null : i.getOwner();
+    }
+    function o() {
+      return Error("react-stack-top-frame");
+    }
+    function c(i) {
+      if (L.call(i, "key")) {
+        var p = Object.getOwnPropertyDescriptor(i, "key").get;
+        if (p && p.isReactWarning) return !1;
+      }
+      return i.key !== void 0;
+    }
+    function l(i, p) {
+      function x() {
+        j || (j = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          p
+        ));
+      }
+      x.isReactWarning = !0, Object.defineProperty(i, "key", {
+        get: x,
+        configurable: !0
+      });
+    }
+    function g() {
+      var i = e(this.type);
+      return R[i] || (R[i] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), i = this.props.ref, i !== void 0 ? i : null;
+    }
+    function u(i, p, x, h, k, q, Se, Oe) {
+      return x = q.ref, i = {
+        $$typeof: T,
+        type: i,
+        key: p,
+        props: q,
+        _owner: k
+      }, (x !== void 0 ? x : null) !== null ? Object.defineProperty(i, "ref", {
+        enumerable: !1,
+        get: g
+      }) : Object.defineProperty(i, "ref", { enumerable: !1, value: null }), i._store = {}, Object.defineProperty(i._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(i, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(i, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: Se
+      }), Object.defineProperty(i, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: Oe
+      }), Object.freeze && (Object.freeze(i.props), Object.freeze(i)), i;
+    }
+    function d(i, p, x, h, k, q, Se, Oe) {
+      var J = p.children;
+      if (J !== void 0)
+        if (h)
+          if (U(J)) {
+            for (h = 0; h < J.length; h++)
+              v(J[h]);
+            Object.freeze && Object.freeze(J);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else v(J);
+      if (L.call(p, "key")) {
+        J = e(i);
+        var re = Object.keys(p).filter(function(Jt) {
+          return Jt !== "key";
+        });
+        h = 0 < re.length ? "{key: someKey, " + re.join(": ..., ") + ": ...}" : "{key: someKey}", Z[J + h] || (re = 0 < re.length ? "{" + re.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          h,
+          J,
+          re,
+          J
+        ), Z[J + h] = !0);
+      }
+      if (J = null, x !== void 0 && (r(x), J = "" + x), c(p) && (r(p.key), J = "" + p.key), "key" in p) {
+        x = {};
+        for (var Ee in p)
+          Ee !== "key" && (x[Ee] = p[Ee]);
+      } else x = p;
+      return J && l(
+        x,
+        typeof i == "function" ? i.displayName || i.name || "Unknown" : i
+      ), u(
+        i,
+        J,
+        q,
+        k,
+        s(),
+        x,
+        Se,
+        Oe
+      );
+    }
+    function v(i) {
+      typeof i == "object" && i !== null && i.$$typeof === T && i._store && (i._store.validated = 1);
+    }
+    var S = W, T = Symbol.for("react.transitional.element"), O = Symbol.for("react.portal"), A = Symbol.for("react.fragment"), f = Symbol.for("react.strict_mode"), N = Symbol.for("react.profiler"), E = Symbol.for("react.consumer"), M = Symbol.for("react.context"), b = Symbol.for("react.forward_ref"), m = Symbol.for("react.suspense"), w = Symbol.for("react.suspense_list"), y = Symbol.for("react.memo"), H = Symbol.for("react.lazy"), _ = Symbol.for("react.activity"), C = Symbol.for("react.client.reference"), $ = S.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, L = Object.prototype.hasOwnProperty, U = Array.isArray, F = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    S = {
+      react_stack_bottom_frame: function(i) {
+        return i();
+      }
+    };
+    var j, R = {}, I = S.react_stack_bottom_frame.bind(
+      S,
+      o
+    )(), z = F(n(o)), Z = {};
+    oe.Fragment = A, oe.jsx = function(i, p, x, h, k) {
+      var q = 1e4 > $.recentlyCreatedOwnerStacks++;
+      return d(
+        i,
+        p,
+        x,
+        !1,
+        h,
+        k,
+        q ? Error("react-stack-top-frame") : I,
+        q ? F(n(i)) : z
+      );
+    }, oe.jsxs = function(i, p, x, h, k) {
+      var q = 1e4 > $.recentlyCreatedOwnerStacks++;
+      return d(
+        i,
+        p,
+        x,
+        !0,
+        h,
+        k,
+        q ? Error("react-stack-top-frame") : I,
+        q ? F(n(i)) : z
+      );
+    };
+  }()), oe;
+}
+var et;
+function nr() {
+  return et || (et = 1, process.env.NODE_ENV === "production" ? he.exports = tr() : he.exports = rr()), he.exports;
+}
+var a = nr();
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const ar = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), sr = (e) => e.replace(
+  /^([A-Z])|[\s-_]+(\w)/g,
+  (t, r, n) => n ? n.toUpperCase() : r.toLowerCase()
+), tt = (e) => {
+  const t = sr(e);
+  return t.charAt(0).toUpperCase() + t.slice(1);
+}, Rt = (...e) => e.filter((t, r, n) => !!t && t.trim() !== "" && n.indexOf(t) === r).join(" ").trim(), or = (e) => {
+  for (const t in e)
+    if (t.startsWith("aria-") || t === "role" || t === "title")
+      return !0;
 };
-var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, { get: (a, b) => (typeof require !== "undefined" ? require : a)[b] }) : x)(function(x) {
-	if (typeof require !== "undefined") return require.apply(this, arguments);
-	throw Error("Calling `require` for \"" + x + "\" in an environment that doesn't expose the `require` function.");
-});
-
-//#endregion
-//#region ../../node_modules/.pnpm/react@19.2.0/node_modules/react/cjs/react-compiler-runtime.production.js
 /**
-* @license React
-* react-compiler-runtime.production.js
-*
-* Copyright (c) Meta Platforms, Inc. and affiliates.
-*
-* This source code is licensed under the MIT license found in the
-* LICENSE file in the root directory of this source tree.
-*/
-var require_react_compiler_runtime_production = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/react@19.2.0/node_modules/react/cjs/react-compiler-runtime.production.js": ((exports) => {
-	var ReactSharedInternals = __require("react").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
-	exports.c = function(size) {
-		return ReactSharedInternals.H.useMemoCache(size);
-	};
-}) });
-
-//#endregion
-//#region ../../node_modules/.pnpm/react@19.2.0/node_modules/react/cjs/react-compiler-runtime.development.js
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+var ir = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
 /**
-* @license React
-* react-compiler-runtime.development.js
-*
-* Copyright (c) Meta Platforms, Inc. and affiliates.
-*
-* This source code is licensed under the MIT license found in the
-* LICENSE file in the root directory of this source tree.
-*/
-var require_react_compiler_runtime_development = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/react@19.2.0/node_modules/react/cjs/react-compiler-runtime.development.js": ((exports) => {
-	"production" !== process.env.NODE_ENV && function() {
-		var ReactSharedInternals$1 = __require("react").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
-		exports.c = function(size) {
-			var dispatcher = ReactSharedInternals$1.H;
-			null === dispatcher && console.error("Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:\n1. You might have mismatching versions of React and the renderer (such as React DOM)\n2. You might be breaking the Rules of Hooks\n3. You might have more than one copy of React in the same app\nSee https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem.");
-			return dispatcher.useMemoCache(size);
-		};
-	}();
-}) });
-
-//#endregion
-//#region ../../node_modules/.pnpm/react@19.2.0/node_modules/react/compiler-runtime.js
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const cr = _t(
+  ({
+    color: e = "currentColor",
+    size: t = 24,
+    strokeWidth: r = 2,
+    absoluteStrokeWidth: n,
+    className: s = "",
+    children: o,
+    iconNode: c,
+    ...l
+  }, g) => Te(
+    "svg",
+    {
+      ref: g,
+      ...ir,
+      width: t,
+      height: t,
+      stroke: e,
+      strokeWidth: n ? Number(r) * 24 / Number(t) : r,
+      className: Rt("lucide", s),
+      ...!o && !or(l) && { "aria-hidden": "true" },
+      ...l
+    },
+    [
+      ...c.map(([u, d]) => Te(u, d)),
+      ...Array.isArray(o) ? o : [o]
+    ]
+  )
+);
 /**
-* Copyright (c) Meta Platforms, Inc. and affiliates.
-*
-* This source code is licensed under the MIT license found in the
-* LICENSE file in the root directory of this source tree.
-*/
-var require_compiler_runtime = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/react@19.2.0/node_modules/react/compiler-runtime.js": ((exports, module) => {
-	if (process.env.NODE_ENV === "production") module.exports = require_react_compiler_runtime_production();
-	else module.exports = require_react_compiler_runtime_development();
-}) });
-
-//#endregion
-//#region src/hooks/states-hooks.ts
-var import_compiler_runtime$4 = require_compiler_runtime();
-const useGetStateItems = () => {
-	const $ = (0, import_compiler_runtime$4.c)(7);
-	let t0;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-		t0 = [];
-		$[0] = t0;
-	} else t0 = $[0];
-	const [items, setItems] = useState(t0);
-	let t1;
-	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-		t1 = () => {
-			fetch("/__motia/state").then(_temp$2).then(setItems).catch(_temp2$1);
-		};
-		$[1] = t1;
-	} else t1 = $[1];
-	const refetch = t1;
-	let t2;
-	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-		t2 = (ids) => {
-			fetch("/__motia/state/delete", {
-				method: "POST",
-				headers: { "Content-Type": "application/json" },
-				body: JSON.stringify({ ids })
-			}).then(() => refetch());
-		};
-		$[2] = t2;
-	} else t2 = $[2];
-	const deleteItems = t2;
-	let t3;
-	let t4;
-	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-		t3 = () => {
-			refetch();
-		};
-		t4 = [refetch];
-		$[3] = t3;
-		$[4] = t4;
-	} else {
-		t3 = $[3];
-		t4 = $[4];
-	}
-	useEffect(t3, t4);
-	let t5;
-	if ($[5] !== items) {
-		t5 = {
-			items,
-			deleteItems,
-			refetch
-		};
-		$[5] = items;
-		$[6] = t5;
-	} else t5 = $[6];
-	return t5;
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const X = (e, t) => {
+  const r = _t(
+    ({ className: n, ...s }, o) => Te(cr, {
+      ref: o,
+      iconNode: t,
+      className: Rt(
+        `lucide-${ar(tt(e))}`,
+        `lucide-${e}`,
+        n
+      ),
+      ...s
+    })
+  );
+  return r.displayName = tt(e), r;
 };
-async function _temp$2(res) {
-	if (res.ok) return res.json();
-	else throw await res.json();
-}
-function _temp2$1(err) {
-	return console.error(err);
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const lr = [
+  ["path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8", key: "v9h5vc" }],
+  ["path", { d: "M21 3v5h-5", key: "1q7to0" }],
+  ["path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16", key: "3uifl3" }],
+  ["path", { d: "M8 16H3v5", key: "1cv678" }]
+], ur = X("refresh-cw", lr);
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const dr = [
+  ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
+  ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
+], fr = X("search", dr);
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const pr = [
+  ["path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6", key: "miytrc" }],
+  ["path", { d: "M3 6h18", key: "d0wm0j" }],
+  ["path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2", key: "e791ji" }]
+], gr = X("trash", pr);
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const hr = [
+  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
+  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
+], Mt = X("x", hr), vr = () => {
+  const [e, t] = P([]), r = K(() => {
+    fetch("/__motia/state").then(async (s) => {
+      if (s.ok)
+        return s.json();
+      throw await s.json();
+    }).then(t).catch((s) => console.error(s));
+  }, []), n = (s) => {
+    fetch("/__motia/state/delete", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ ids: s })
+    }).then(() => r());
+  };
+  return Y(() => {
+    r();
+  }, [r]), { items: e, deleteItems: n, refetch: r };
+}, rt = (e) => {
+  let t;
+  const r = /* @__PURE__ */ new Set(), n = (u, d) => {
+    const v = typeof u == "function" ? u(t) : u;
+    if (!Object.is(v, t)) {
+      const S = t;
+      t = d ?? (typeof v != "object" || v === null) ? v : Object.assign({}, t, v), r.forEach((T) => T(t, S));
+    }
+  }, s = () => t, l = { setState: n, getState: s, getInitialState: () => g, subscribe: (u) => (r.add(u), () => r.delete(u)) }, g = t = e(n, s, l);
+  return l;
+}, mr = (e) => e ? rt(e) : rt, yr = (e) => e;
+function jr(e, t = yr) {
+  const r = W.useSyncExternalStore(
+    e.subscribe,
+    W.useCallback(() => t(e.getState()), [e, t]),
+    W.useCallback(() => t(e.getInitialState()), [e, t])
+  );
+  return W.useDebugValue(r), r;
 }
-
-//#endregion
-//#region src/stores/use-states-store.ts
-const useStatesStore = create()((set) => ({
-	selectedStateId: void 0,
-	selectStateId: (stateId) => set({ selectedStateId: stateId })
+const br = (e) => {
+  const t = mr(e), r = (n) => jr(t, n);
+  return Object.assign(r, t), r;
+}, wr = (e) => br, nt = wr()((e) => ({
+  selectedStateId: void 0,
+  selectStateId: (t) => e({ selectedStateId: t })
 }));
-
-//#endregion
-//#region src/components/state-details.tsx
-var import_compiler_runtime$3 = require_compiler_runtime();
-const StateDetails = (t0) => {
-	const $ = (0, import_compiler_runtime$3.c)(2);
-	const { state } = t0;
-	let t1;
-	if ($[0] !== state.value) {
-		t1 = /* @__PURE__ */ jsx(JsonView, {
-			src: state.value,
-			theme: "default"
-		});
-		$[0] = state.value;
-		$[1] = t1;
-	} else t1 = $[1];
-	return t1;
+function xr(e, t, r, n) {
+  function s(o) {
+    return o instanceof r ? o : new r(function(c) {
+      c(o);
+    });
+  }
+  return new (r || (r = Promise))(function(o, c) {
+    function l(d) {
+      try {
+        u(n.next(d));
+      } catch (v) {
+        c(v);
+      }
+    }
+    function g(d) {
+      try {
+        u(n.throw(d));
+      } catch (v) {
+        c(v);
+      }
+    }
+    function u(d) {
+      d.done ? o(d.value) : s(d.value).then(l, g);
+    }
+    u((n = n.apply(e, [])).next());
+  });
+}
+var Cr = function() {
+  var e = document.getSelection();
+  if (!e.rangeCount)
+    return function() {
+    };
+  for (var t = document.activeElement, r = [], n = 0; n < e.rangeCount; n++)
+    r.push(e.getRangeAt(n));
+  switch (t.tagName.toUpperCase()) {
+    // .toUpperCase handles XHTML
+    case "INPUT":
+    case "TEXTAREA":
+      t.blur();
+      break;
+    default:
+      t = null;
+      break;
+  }
+  return e.removeAllRanges(), function() {
+    e.type === "Caret" && e.removeAllRanges(), e.rangeCount || r.forEach(function(s) {
+      e.addRange(s);
+    }), t && t.focus();
+  };
+}, Sr = Cr, at = {
+  "text/plain": "Text",
+  "text/html": "Url",
+  default: "Text"
+}, Or = "Copy to clipboard: #{key}, Enter";
+function Er(e) {
+  var t = (/mac os x/i.test(navigator.userAgent) ? "⌘" : "Ctrl") + "+C";
+  return e.replace(/#{\s*key\s*}/g, t);
+}
+function kr(e, t) {
+  var r, n, s, o, c, l, g = !1;
+  t || (t = {}), r = t.debug || !1;
+  try {
+    s = Sr(), o = document.createRange(), c = document.getSelection(), l = document.createElement("span"), l.textContent = e, l.ariaHidden = "true", l.style.all = "unset", l.style.position = "fixed", l.style.top = 0, l.style.clip = "rect(0, 0, 0, 0)", l.style.whiteSpace = "pre", l.style.webkitUserSelect = "text", l.style.MozUserSelect = "text", l.style.msUserSelect = "text", l.style.userSelect = "text", l.addEventListener("copy", function(d) {
+      if (d.stopPropagation(), t.format)
+        if (d.preventDefault(), typeof d.clipboardData > "u") {
+          r && console.warn("unable to use e.clipboardData"), r && console.warn("trying IE specific stuff"), window.clipboardData.clearData();
+          var v = at[t.format] || at.default;
+          window.clipboardData.setData(v, e);
+        } else
+          d.clipboardData.clearData(), d.clipboardData.setData(t.format, e);
+      t.onCopy && (d.preventDefault(), t.onCopy(d.clipboardData));
+    }), document.body.appendChild(l), o.selectNodeContents(l), c.addRange(o);
+    var u = document.execCommand("copy");
+    if (!u)
+      throw new Error("copy command was unsuccessful");
+    g = !0;
+  } catch (d) {
+    r && console.error("unable to copy using execCommand: ", d), r && console.warn("trying IE specific stuff");
+    try {
+      window.clipboardData.setData(t.format || "text", e), t.onCopy && t.onCopy(window.clipboardData), g = !0;
+    } catch (v) {
+      r && console.error("unable to copy using clipboardData: ", v), r && console.error("falling back to prompt"), n = Er("message" in t ? t.message : Or), window.prompt(n, e);
+    }
+  } finally {
+    c && (typeof c.removeRange == "function" ? c.removeRange(o) : c.removeAllRanges()), l && document.body.removeChild(l), s();
+  }
+  return g;
+}
+var Ar = kr;
+function Q(e) {
+  return Object.prototype.toString.call(e) === "[object Object]";
+}
+function ce(e) {
+  return Array.isArray(e) ? e.length : Q(e) ? Object.keys(e).length : 0;
+}
+function Nr(e, t) {
+  if (typeof e == "string")
+    return e;
+  try {
+    return JSON.stringify(e, (r, n) => {
+      switch (typeof n) {
+        case "bigint":
+          return String(n) + "n";
+        case "number":
+        case "boolean":
+        case "object":
+        case "string":
+          return n;
+        default:
+          return String(n);
+      }
+    }, t);
+  } catch (r) {
+    return `${r.name}: ${r.message}` || "JSON.stringify failed";
+  }
+}
+function Tr(e) {
+  return xr(this, void 0, void 0, function* () {
+    try {
+      yield navigator.clipboard.writeText(e);
+    } catch {
+      Ar(e);
+    }
+  });
+}
+function st(e, t, r, n, s, o) {
+  if (o && o.collapsed !== void 0)
+    return !!o.collapsed;
+  if (typeof n == "boolean")
+    return n;
+  if (typeof n == "number" && t > n)
+    return !0;
+  const c = ce(e);
+  if (typeof n == "function") {
+    const l = Ue(n, [{ node: e, depth: t, indexOrName: r, size: c }]);
+    if (typeof l == "boolean")
+      return l;
+  }
+  return !!(Array.isArray(e) && c > s || Q(e) && c > s);
+}
+function ot(e, t, r, n, s, o) {
+  if (o && o.collapsed !== void 0)
+    return !!o.collapsed;
+  if (typeof n == "boolean")
+    return n;
+  if (typeof n == "number" && t > n)
+    return !0;
+  const c = Math.ceil(e.length / 100);
+  if (typeof n == "function") {
+    const l = Ue(n, [{ node: e, depth: t, indexOrName: r, size: c }]);
+    if (typeof l == "boolean")
+      return l;
+  }
+  return !!(Array.isArray(e) && c > s || Q(e) && c > s);
+}
+function ae(e, t, r) {
+  return typeof e == "boolean" ? e : !!(typeof e == "number" && t > e || e === "collapsed" && r || e === "expanded" && !r);
+}
+function Ue(e, t) {
+  try {
+    return e(...t);
+  } catch (r) {
+    reportError(r);
+  }
+}
+function It(e) {
+  if (e === !0 || Q(e) && e.add === !0)
+    return !0;
+}
+function it(e) {
+  if (e === !0 || Q(e) && e.edit === !0)
+    return !0;
+}
+function ze(e) {
+  if (e === !0 || Q(e) && e.delete === !0)
+    return !0;
+}
+function _r(e) {
+  return typeof e == "function";
+}
+function Pt(e) {
+  return !e || e.add === void 0 || !!e.add;
+}
+function ct(e) {
+  return !e || e.edit === void 0 || !!e.edit;
+}
+function Ze(e) {
+  return !e || e.delete === void 0 || !!e.delete;
+}
+function we(e) {
+  return !e || e.enableClipboard === void 0 || !!e.enableClipboard;
+}
+function Rr(e) {
+  return !e || e.matchesURL === void 0 || !!e.matchesURL;
+}
+function Mr(e, t) {
+  return e === "string" ? t.trim().replace(/^\"([\s\S]+?)\"$/, "$1") : t;
+}
+var lt;
+function _e() {
+  return _e = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, _e.apply(this, arguments);
+}
+var Je = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", _e({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    fill: "none",
+    viewBox: "0 0 16 16"
+  }, t), lt || (lt = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M12.473 5.806a.666.666 0 0 0-.946 0L8.473 8.86a.667.667 0 0 1-.946 0L4.473 5.806a.667.667 0 1 0-.946.94l3.06 3.06a2 2 0 0 0 2.826 0l3.06-3.06a.667.667 0 0 0 0-.94Z"
+  })));
+}, ut;
+function Re() {
+  return Re = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, Re.apply(this, arguments);
+}
+var Ir = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", Re({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, t), ut || (ut = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M17.542 2.5h-4.75a3.963 3.963 0 0 0-3.959 3.958v4.75a3.963 3.963 0 0 0 3.959 3.959h4.75a3.963 3.963 0 0 0 3.958-3.959v-4.75A3.963 3.963 0 0 0 17.542 2.5Zm2.375 8.708a2.378 2.378 0 0 1-2.375 2.375h-4.75a2.378 2.378 0 0 1-2.375-2.375v-4.75a2.378 2.378 0 0 1 2.375-2.375h4.75a2.378 2.378 0 0 1 2.375 2.375v4.75Zm-4.75 6.334a3.963 3.963 0 0 1-3.959 3.958h-4.75A3.963 3.963 0 0 1 2.5 17.542v-4.75a3.963 3.963 0 0 1 3.958-3.959.791.791 0 1 1 0 1.584 2.378 2.378 0 0 0-2.375 2.375v4.75a2.378 2.378 0 0 0 2.375 2.375h4.75a2.378 2.378 0 0 0 2.375-2.375.792.792 0 1 1 1.584 0Z"
+  })));
+}, dt, ft;
+function Me() {
+  return Me = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, Me.apply(this, arguments);
+}
+var Pr = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", Me({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, t), dt || (dt = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M17.25 3H6.75A3.755 3.755 0 0 0 3 6.75v10.5A3.754 3.754 0 0 0 6.75 21h10.5A3.754 3.754 0 0 0 21 17.25V6.75A3.755 3.755 0 0 0 17.25 3Zm2.25 14.25a2.25 2.25 0 0 1-2.25 2.25H6.75a2.25 2.25 0 0 1-2.25-2.25V6.75A2.25 2.25 0 0 1 6.75 4.5h10.5a2.25 2.25 0 0 1 2.25 2.25v10.5Z"
+  })), ft || (ft = /* @__PURE__ */ D.createElement("path", {
+    fill: "#14C786",
+    d: "M10.312 14.45 7.83 11.906a.625.625 0 0 0-.896 0 .659.659 0 0 0 0 .918l2.481 2.546a1.264 1.264 0 0 0 .896.381 1.237 1.237 0 0 0 .895-.38l5.858-6.011a.658.658 0 0 0 0-.919.625.625 0 0 0-.896 0l-5.857 6.01Z"
+  })));
 };
-
-//#endregion
-//#region src/components/json-editor.tsx
-var import_compiler_runtime$2 = require_compiler_runtime();
-const JsonEditor = (t0) => {
-	const $ = (0, import_compiler_runtime$2.c)(23);
-	const { value, height: t1, schema, onChange, onValidate, language: t2, readOnly: t3 } = t0;
-	const height = t1 === void 0 ? 300 : t1;
-	const language = t2 === void 0 ? "json" : t2;
-	const readOnly = t3 === void 0 ? false : t3;
-	const monaco = useMonaco();
-	const editorTheme = useThemeStore(_temp$1) === "dark" ? "vs-dark" : "light";
-	let t4;
-	if ($[0] !== monaco || $[1] !== schema) {
-		t4 = () => {
-			if (!monaco) return;
-			monaco.languages.typescript.javascriptDefaults.setCompilerOptions({ isolatedModules: true });
-			monaco.languages.json.jsonDefaults.setDiagnosticsOptions({ schemas: schema ? [{
-				uri: window.location.href,
-				fileMatch: ["*"],
-				schema
-			}] : [] });
-		};
-		$[0] = monaco;
-		$[1] = schema;
-		$[2] = t4;
-	} else t4 = $[2];
-	let t5;
-	if ($[3] !== language || $[4] !== monaco || $[5] !== schema) {
-		t5 = [
-			monaco,
-			schema,
-			language
-		];
-		$[3] = language;
-		$[4] = monaco;
-		$[5] = schema;
-		$[6] = t5;
-	} else t5 = $[6];
-	useEffect(t4, t5);
-	let t6;
-	if ($[7] !== onChange || $[8] !== onValidate) {
-		t6 = (value_0) => {
-			if (!value_0) onValidate?.(false);
-			onChange?.(value_0 ?? "");
-		};
-		$[7] = onChange;
-		$[8] = onValidate;
-		$[9] = t6;
-	} else t6 = $[9];
-	let t7;
-	if ($[10] !== onValidate) {
-		t7 = (markers) => onValidate?.(markers.length === 0);
-		$[10] = onValidate;
-		$[11] = t7;
-	} else t7 = $[11];
-	let t8;
-	if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
-		t8 = { enabled: false };
-		$[12] = t8;
-	} else t8 = $[12];
-	let t9;
-	if ($[13] !== readOnly) {
-		t9 = {
-			readOnly,
-			scrollBeyondLastLine: false,
-			minimap: t8
-		};
-		$[13] = readOnly;
-		$[14] = t9;
-	} else t9 = $[14];
-	let t10;
-	if ($[15] !== editorTheme || $[16] !== height || $[17] !== language || $[18] !== t6 || $[19] !== t7 || $[20] !== t9 || $[21] !== value) {
-		t10 = /* @__PURE__ */ jsx(Editor, {
-			"data-testid": "json-editor",
-			height,
-			language,
-			value,
-			theme: editorTheme,
-			onChange: t6,
-			onValidate: t7,
-			options: t9
-		});
-		$[15] = editorTheme;
-		$[16] = height;
-		$[17] = language;
-		$[18] = t6;
-		$[19] = t7;
-		$[20] = t9;
-		$[21] = value;
-		$[22] = t10;
-	} else t10 = $[22];
-	return t10;
+function xe({ node: e, nodeMeta: t }) {
+  const { customizeCopy: r, CopyComponent: n, CopiedComponent: s } = te(ee), [o, c] = P(!1), l = (g) => {
+    g.stopPropagation();
+    const u = r(e, t);
+    typeof u == "string" && u && Tr(u), c(!0), setTimeout(() => c(!1), 3e3);
+  };
+  return o ? typeof s == "function" ? a.jsx(s, { className: "json-view--copy", style: { display: "inline-block" } }) : a.jsx(Pr, { className: "json-view--copy", style: { display: "inline-block" } }) : typeof n == "function" ? a.jsx(n, { onClick: l, className: "json-view--copy" }) : a.jsx(Ir, { onClick: l, className: "json-view--copy" });
+}
+function Ie({ indexOrName: e, value: t, depth: r, deleteHandle: n, editHandle: s, parent: o, parentPath: c }) {
+  const { displayArrayIndex: l } = te(ee), g = Array.isArray(o);
+  return a.jsxs("div", Object.assign({ className: "json-view--pair" }, { children: [!g || g && l ? a.jsxs(a.Fragment, { children: [a.jsx("span", Object.assign({ className: typeof e == "number" ? "json-view--index" : "json-view--property" }, { children: e })), ":", " "] }) : a.jsx(a.Fragment, {}), a.jsx(Dt, { node: t, depth: r + 1, deleteHandle: (u, d) => n(u, d), editHandle: (u, d, v, S) => s(u, d, v, S), parent: o, indexOrName: e, parentPath: c })] }));
+}
+var pt, gt;
+function Pe() {
+  return Pe = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, Pe.apply(this, arguments);
+}
+var Ye = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", Pe({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, t), pt || (pt = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M18.75 6h-2.325a3.757 3.757 0 0 0-3.675-3h-1.5a3.757 3.757 0 0 0-3.675 3H5.25a.75.75 0 0 0 0 1.5H6v9.75A3.754 3.754 0 0 0 9.75 21h4.5A3.754 3.754 0 0 0 18 17.25V7.5h.75a.75.75 0 1 0 0-1.5Zm-7.5-1.5h1.5A2.255 2.255 0 0 1 14.872 6H9.128a2.255 2.255 0 0 1 2.122-1.5Zm5.25 12.75a2.25 2.25 0 0 1-2.25 2.25h-4.5a2.25 2.25 0 0 1-2.25-2.25V7.5h9v9.75Z"
+  })), gt || (gt = /* @__PURE__ */ D.createElement("path", {
+    fill: "#DA0000",
+    d: "M10.5 16.5a.75.75 0 0 0 .75-.75v-4.5a.75.75 0 1 0-1.5 0v4.5a.75.75 0 0 0 .75.75ZM13.5 16.5a.75.75 0 0 0 .75-.75v-4.5a.75.75 0 1 0-1.5 0v4.5a.75.75 0 0 0 .75.75Z"
+  })));
+}, ht, vt;
+function $e() {
+  return $e = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, $e.apply(this, arguments);
+}
+var $t = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", $e({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, t), ht || (ht = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M21 6.75v10.5A3.754 3.754 0 0 1 17.25 21H6.75A3.754 3.754 0 0 1 3 17.25V6.75A3.754 3.754 0 0 1 6.75 3h10.5A3.754 3.754 0 0 1 21 6.75Zm-1.5 0c0-1.24-1.01-2.25-2.25-2.25H6.75C5.51 4.5 4.5 5.51 4.5 6.75v10.5c0 1.24 1.01 2.25 2.25 2.25h10.5c1.24 0 2.25-1.01 2.25-2.25V6.75Z"
+  })), vt || (vt = /* @__PURE__ */ D.createElement("path", {
+    fill: "#14C786",
+    d: "M15 12.75a.75.75 0 1 0 0-1.5h-2.25V9a.75.75 0 1 0-1.5 0v2.25H9a.75.75 0 1 0 0 1.5h2.25V15a.75.75 0 1 0 1.5 0v-2.25H15Z"
+  })));
+}, mt, yt;
+function De() {
+  return De = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, De.apply(this, arguments);
+}
+var qe = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", De({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, t), mt || (mt = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M12 3a9 9 0 1 0 9 9 9.01 9.01 0 0 0-9-9Zm0 16.5a7.5 7.5 0 1 1 7.5-7.5 7.509 7.509 0 0 1-7.5 7.5Z"
+  })), yt || (yt = /* @__PURE__ */ D.createElement("path", {
+    fill: "#14C786",
+    d: "m10.85 13.96-1.986-2.036a.5.5 0 0 0-.716 0 .527.527 0 0 0 0 .735l1.985 2.036a1.01 1.01 0 0 0 .717.305.99.99 0 0 0 .716-.305l4.686-4.808a.526.526 0 0 0 0-.735.5.5 0 0 0-.716 0l-4.687 4.809Z"
+  })));
+}, jt, bt;
+function Le() {
+  return Le = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, Le.apply(this, arguments);
+}
+var Be = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", Le({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, t), jt || (jt = /* @__PURE__ */ D.createElement("path", {
+    fill: "#DA0000",
+    d: "M15 9a.75.75 0 0 0-1.06 0L12 10.94 10.06 9A.75.75 0 0 0 9 10.06L10.94 12 9 13.94A.75.75 0 0 0 10.06 15L12 13.06 13.94 15A.75.75 0 0 0 15 13.94L13.06 12 15 10.06A.75.75 0 0 0 15 9Z"
+  })), bt || (bt = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M12 3a9 9 0 1 0 9 9 9.01 9.01 0 0 0-9-9Zm0 16.5a7.5 7.5 0 1 1 7.5-7.5 7.509 7.509 0 0 1-7.5 7.5Z"
+  })));
 };
-function _temp$1(state) {
-	return state.theme;
+function $r({ originNode: e, node: t, depth: r, index: n, deleteHandle: s, customOptions: o, startIndex: c, parent: l, parentPath: g }) {
+  const { enableClipboard: u, src: d, onEdit: v, onChange: S, forceUpdate: T, displaySize: O, CustomOperation: A } = te(ee), f = [...g, String(n)], [N, E] = P(!0), M = K((w, y, H) => {
+    e[w] = y, v && v({
+      newValue: y,
+      oldValue: H,
+      depth: r,
+      src: d,
+      indexOrName: w,
+      parentType: "array",
+      parentPath: g
+    }), S && S({ type: "edit", depth: r, src: d, indexOrName: w, parentType: "array", parentPath: g }), T();
+  }, [t, v, S, T]), b = (w) => {
+    e.splice(w, 1), s && s(w, g), T();
+  }, m = a.jsxs(a.Fragment, { children: [!N && a.jsxs("span", Object.assign({ onClick: () => E(!0), className: "jv-size-chevron" }, { children: [ae(O, r, N) && a.jsxs("span", Object.assign({ className: "jv-size" }, { children: [ce(t), " Items"] })), a.jsx(Je, { className: "jv-chevron" })] })), !N && u && we(o) && a.jsx(xe, { node: t, nodeMeta: { depth: r, indexOrName: n, parent: l, parentPath: g, currentPath: f } }), typeof A == "function" ? a.jsx(A, { node: t }) : null] });
+  return a.jsxs("div", { children: [a.jsx("span", { children: "[" }), m, N ? a.jsxs("button", Object.assign({ onClick: () => E(!1), className: "jv-button" }, { children: [c, " ... ", c + t.length - 1] })) : a.jsx("div", Object.assign({ className: "jv-indent" }, { children: t.map((w, y) => a.jsx(Ie, { indexOrName: y + c, value: w, depth: r, parent: t, deleteHandle: b, editHandle: M, parentPath: g }, String(n) + String(y))) })), a.jsx("span", { children: "]" })] });
 }
-
-//#endregion
-//#region src/components/state-editor.tsx
-const StateEditor = ({ state }) => {
-	const [isRequestLoading, setIsRequestLoading] = useState(false);
-	const [isValid, setIsValid] = useState(true);
-	const [jsonValue, setJsonValue] = useState(JSON.stringify(state.value, null, 2));
-	const [hasChanges, setHasChanges] = useState(false);
-	const [saveStatus, setSaveStatus] = useState("idle");
-	const lastSavedValue = useRef(JSON.stringify(state.value, null, 2));
-	useEffect(() => {
-		setJsonValue(JSON.stringify(state.value, null, 2));
-	}, [state.value]);
-	const handleJsonChange = useCallback((value) => {
-		setHasChanges(value !== lastSavedValue.current);
-		setJsonValue(value);
-		setSaveStatus("idle");
-	}, []);
-	const handleSave = async () => {
-		if (!isValid || !hasChanges) return;
-		try {
-			setIsRequestLoading(true);
-			setSaveStatus("idle");
-			const response = await fetch("/__motia/state", {
-				method: "POST",
-				headers: { "Content-Type": "application/json" },
-				body: JSON.stringify({
-					key: state.key,
-					groupId: state.groupId,
-					value: JSON.parse(jsonValue)
-				})
-			});
-			if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
-			lastSavedValue.current = jsonValue;
-			setSaveStatus("success");
-			setHasChanges(false);
-			setTimeout(() => {
-				setSaveStatus("idle");
-			}, 3e3);
-		} catch (error) {
-			console.error("Failed to save state:", error);
-			setSaveStatus("error");
-		} finally {
-			setIsRequestLoading(false);
-		}
-	};
-	const resetChanges = useCallback(() => {
-		setJsonValue(JSON.stringify(state.value, null, 2));
-		setHasChanges(false);
-		setSaveStatus("idle");
-	}, [state.value]);
-	const statusView = useMemo(() => {
-		if (saveStatus === "success") return /* @__PURE__ */ jsx("div", {
-			className: "bg-green-50 dark:bg-green-950/20 border border-green-200 dark:border-green-800 rounded-lg p-2",
-			children: /* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-2 text-green-700 dark:text-green-400 text-sm",
-				children: [/* @__PURE__ */ jsx(Check, { className: "w-4 h-4" }), "State saved successfully!"]
-			})
-		});
-		if (saveStatus === "error") return /* @__PURE__ */ jsx("div", {
-			className: "bg-red-50 dark:bg-red-950/20 border border-red-200 dark:border-red-800 rounded-lg p-2",
-			children: /* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-2 text-red-700 dark:text-red-400 text-sm",
-				children: [/* @__PURE__ */ jsx(AlertCircle, { className: "w-4 h-4" }), "Failed to save state. Please try again."]
-			})
-		});
-		return /* @__PURE__ */ jsx("div", {
-			className: "text-xs text-muted-foreground",
-			children: hasChanges ? /* @__PURE__ */ jsxs("span", {
-				className: "flex items-center gap-1",
-				children: [/* @__PURE__ */ jsx("div", { className: "w-2 h-2 bg-orange-500 rounded-full" }), "Unsaved changes"]
-			}) : /* @__PURE__ */ jsxs("span", {
-				className: "flex items-center gap-1",
-				children: [/* @__PURE__ */ jsx("div", { className: "w-2 h-2 bg-green-500 rounded-full" }), "Up to date"]
-			})
-		});
-	}, [saveStatus, hasChanges]);
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-2 h-full",
-		children: [
-			/* @__PURE__ */ jsx("p", {
-				className: "text-xs text-muted-foreground",
-				children: "Modify the state value using the JSON editor below."
-			}),
-			/* @__PURE__ */ jsx("div", {
-				className: "space-y-3 pt-2 flex flex-col",
-				children: /* @__PURE__ */ jsxs("div", {
-					className: "relative flex-1",
-					children: [/* @__PURE__ */ jsx(JsonEditor, {
-						value: jsonValue,
-						onChange: handleJsonChange,
-						onValidate: setIsValid,
-						height: "calc(100vh - 300px)"
-					}), !isValid && /* @__PURE__ */ jsxs("div", {
-						className: "absolute top-2 right-2 bg-destructive/90 text-destructive-foreground px-2 py-1 rounded text-xs flex items-center gap-1",
-						children: [/* @__PURE__ */ jsx(AlertCircle, { className: "w-3 h-3" }), "Invalid JSON"]
-					})]
-				})
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex items-center justify-between pt-2",
-				children: [statusView, /* @__PURE__ */ jsxs("div", {
-					className: "flex items-center gap-2",
-					children: [hasChanges && /* @__PURE__ */ jsx(Button, {
-						variant: "secondary",
-						onClick: resetChanges,
-						disabled: isRequestLoading,
-						children: "Reset"
-					}), /* @__PURE__ */ jsx(Button, {
-						onClick: handleSave,
-						variant: "accent",
-						disabled: isRequestLoading || !isValid || !hasChanges,
-						"data-testid": "state-save-button",
-						children: isRequestLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Loader2, { className: "w-3 h-3 animate-spin mr-1" }), "Saving..."] }) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Save, { className: "w-3 h-3 mr-1" }), "Save Changes"] })
-					})]
-				})]
-			})
-		]
-	});
+function Dr({ node: e, depth: t, deleteHandle: r, indexOrName: n, customOptions: s, parent: o, parentPath: c }) {
+  const l = typeof n < "u" ? [...c, String(n)] : c, g = [];
+  for (let j = 0; j < e.length; j += 100)
+    g.push(e.slice(j, j + 100));
+  const { collapsed: u, enableClipboard: d, collapseObjectsAfterLength: v, editable: S, onDelete: T, src: O, onAdd: A, CustomOperation: f, onChange: N, forceUpdate: E, displaySize: M } = te(ee), [b, m] = P(ot(e, t, n, u, v, s));
+  Y(() => {
+    m(ot(e, t, n, u, v, s));
+  }, [u, v]);
+  const [w, y] = P(!1), H = () => {
+    y(!1), r && r(n, c), T && T({ value: e, depth: t, src: O, indexOrName: n, parentType: "array", parentPath: c }), N && N({
+      type: "delete",
+      depth: t,
+      src: O,
+      indexOrName: n,
+      parentType: "array",
+      parentPath: c
+    });
+  }, [_, C] = P(!1), $ = () => {
+    const j = e;
+    j.push(null), A && A({ indexOrName: j.length - 1, depth: t, src: O, parentType: "array", parentPath: c }), N && N({ type: "add", indexOrName: j.length - 1, depth: t, src: O, parentType: "array", parentPath: c }), E();
+  }, L = w || _, U = () => {
+    y(!1), C(!1);
+  }, F = a.jsxs(a.Fragment, { children: [!b && !L && a.jsxs("span", Object.assign({ onClick: () => m(!0), className: "jv-size-chevron" }, { children: [ae(M, t, b) && a.jsxs("span", Object.assign({ className: "jv-size" }, { children: [e.length, " Items"] })), a.jsx(Je, { className: "jv-chevron" })] })), L && a.jsx(qe, { className: "json-view--edit", style: { display: "inline-block" }, onClick: _ ? $ : H }), L && a.jsx(Be, { className: "json-view--edit", style: { display: "inline-block" }, onClick: U }), !b && !L && d && we(s) && a.jsx(xe, { node: e, nodeMeta: { depth: t, indexOrName: n, parent: o, parentPath: c, currentPath: l } }), !b && !L && It(S) && Pt(s) && a.jsx($t, { className: "json-view--edit", onClick: () => {
+    $();
+  } }), !b && !L && ze(S) && Ze(s) && r && a.jsx(Ye, { className: "json-view--edit", onClick: () => y(!0) }), typeof f == "function" ? a.jsx(f, { node: e }) : null] });
+  return a.jsxs(a.Fragment, { children: [a.jsx("span", { children: "[" }), F, b ? a.jsx("button", Object.assign({ onClick: () => m(!1), className: "jv-button" }, { children: "..." })) : a.jsx("div", Object.assign({ className: "jv-indent" }, { children: g.map((j, R) => a.jsx($r, { originNode: e, node: j, depth: t, index: R, startIndex: R * 100, deleteHandle: r, customOptions: s, parentPath: c }, String(n) + String(R))) })), a.jsx("span", { children: "]" }), b && ae(M, t, b) && a.jsxs("span", Object.assign({ onClick: () => m(!1), className: "jv-size" }, { children: [e.length, " Items"] }))] });
+}
+function Lr({ node: e, depth: t, indexOrName: r, deleteHandle: n, customOptions: s, parent: o, parentPath: c }) {
+  const { collapsed: l, onCollapse: g, enableClipboard: u, ignoreLargeArray: d, collapseObjectsAfterLength: v, editable: S, onDelete: T, src: O, onAdd: A, onEdit: f, onChange: N, forceUpdate: E, displaySize: M, CustomOperation: b } = te(ee), m = typeof r < "u" ? [...c, String(r)] : c;
+  if (!d && Array.isArray(e) && e.length > 100)
+    return a.jsx(Dr, { node: e, depth: t, indexOrName: r, deleteHandle: n, customOptions: s, parentPath: m });
+  const w = Q(e), [y, H] = P(st(e, t, r, l, v, s)), _ = (h) => {
+    g?.({ isCollapsing: !h, node: e, depth: t, indexOrName: r }), H(h);
+  };
+  Y(() => {
+    _(st(e, t, r, l, v, s));
+  }, [l, v]);
+  const C = K((h, k, q) => {
+    Array.isArray(e) ? e[+h] = k : e && (e[h] = k), f && f({
+      newValue: k,
+      oldValue: q,
+      depth: t,
+      src: O,
+      indexOrName: h,
+      parentType: w ? "object" : "array",
+      parentPath: m
+    }), N && N({ type: "edit", depth: t, src: O, indexOrName: h, parentType: w ? "object" : "array", parentPath: m }), E();
+  }, [e, f, N, E]), $ = (h) => {
+    Array.isArray(e) ? e.splice(+h, 1) : e && delete e[h], E();
+  }, [L, U] = P(!1), F = () => {
+    U(!1), n && n(r, m), T && T({ value: e, depth: t, src: O, indexOrName: r, parentType: w ? "object" : "array", parentPath: m }), N && N({
+      type: "delete",
+      depth: t,
+      src: O,
+      indexOrName: r,
+      parentType: w ? "object" : "array",
+      parentPath: m
+    });
+  }, [j, R] = P(!1), I = V(null), z = () => {
+    var h;
+    if (w) {
+      const k = (h = I.current) === null || h === void 0 ? void 0 : h.value;
+      k && (e[k] = null, I.current && (I.current.value = ""), R(!1), A && A({ indexOrName: k, depth: t, src: O, parentType: "object", parentPath: m }), N && N({ type: "add", indexOrName: k, depth: t, src: O, parentType: "object", parentPath: m }));
+    } else if (Array.isArray(e)) {
+      const k = e;
+      k.push(null), A && A({ indexOrName: k.length - 1, depth: t, src: O, parentType: "array", parentPath: m }), N && N({ type: "add", indexOrName: k.length - 1, depth: t, src: O, parentType: "array", parentPath: m });
+    }
+    E();
+  }, Z = (h) => {
+    h.key === "Enter" ? (h.preventDefault(), z()) : h.key === "Escape" && p();
+  }, i = L || j, p = () => {
+    U(!1), R(!1);
+  }, x = a.jsxs(a.Fragment, { children: [!y && !i && a.jsxs("span", Object.assign({ onClick: () => _(!0), className: "jv-size-chevron" }, { children: [ae(M, t, y) && a.jsxs("span", Object.assign({ className: "jv-size" }, { children: [ce(e), " Items"] })), a.jsx(Je, { className: "jv-chevron" })] })), j && w && a.jsx("input", { className: "json-view--input", placeholder: "property", ref: I, onKeyDown: Z }), i && a.jsx(qe, { className: "json-view--edit", style: { display: "inline-block" }, onClick: j ? z : F }), i && a.jsx(Be, { className: "json-view--edit", style: { display: "inline-block" }, onClick: p }), !y && !i && u && we(s) && a.jsx(xe, { node: e, nodeMeta: { depth: t, indexOrName: r, parent: o, parentPath: c, currentPath: m } }), !y && !i && It(S) && Pt(s) && a.jsx($t, { className: "json-view--edit", onClick: () => {
+    w ? (R(!0), setTimeout(() => {
+      var h;
+      return (h = I.current) === null || h === void 0 ? void 0 : h.focus();
+    })) : z();
+  } }), !y && !i && ze(S) && Ze(s) && n && a.jsx(Ye, { className: "json-view--edit", onClick: () => U(!0) }), typeof b == "function" ? a.jsx(b, { node: e }) : null] });
+  return Array.isArray(e) ? a.jsxs(a.Fragment, { children: [a.jsx("span", { children: "[" }), x, y ? a.jsx("button", Object.assign({ onClick: () => _(!1), className: "jv-button" }, { children: "..." })) : a.jsx("div", Object.assign({ className: "jv-indent" }, { children: e.map((h, k) => a.jsx(Ie, { indexOrName: k, value: h, depth: t, parent: e, deleteHandle: $, editHandle: C, parentPath: m }, String(r) + String(k))) })), a.jsx("span", { children: "]" }), y && ae(M, t, y) && a.jsxs("span", Object.assign({ onClick: () => _(!1), className: "jv-size" }, { children: [ce(e), " Items"] }))] }) : w ? a.jsxs(a.Fragment, { children: [a.jsx("span", { children: "{" }), x, y ? a.jsx("button", Object.assign({ onClick: () => _(!1), className: "jv-button" }, { children: "..." })) : a.jsx("div", Object.assign({ className: "jv-indent" }, { children: Object.entries(e).map(([h, k]) => a.jsx(Ie, { indexOrName: h, value: k, depth: t, parent: e, deleteHandle: $, editHandle: C, parentPath: m }, String(r) + String(h))) })), a.jsx("span", { children: "}" }), y && ae(M, t, y) && a.jsxs("span", Object.assign({ onClick: () => _(!1), className: "jv-size" }, { children: [ce(e), " Items"] }))] }) : a.jsx("span", { children: String(e) });
+}
+const Vr = W.forwardRef(({ str: e, className: t, ctrlClick: r }, n) => {
+  let { collapseStringMode: s, collapseStringsAfterLength: o, customizeCollapseStringUI: c } = te(ee);
+  const [l, g] = P(!0), u = V(null);
+  o = o > 0 ? o : 0;
+  const d = e.replace(/\s+/g, " "), v = typeof c == "function" ? c(d, l) : typeof c == "string" ? c : "...", S = (T) => {
+    var O;
+    if ((T.ctrlKey || T.metaKey) && r)
+      r(T);
+    else {
+      const A = window.getSelection();
+      if (A && A.anchorOffset !== A.focusOffset && ((O = A.anchorNode) === null || O === void 0 ? void 0 : O.parentElement) === u.current)
+        return;
+      g(!l);
+    }
+  };
+  if (e.length <= o)
+    return a.jsxs("span", Object.assign({ ref: u, className: t, onClick: r }, { children: ['"', e, '"'] }));
+  if (s === "address")
+    return e.length <= 10 ? a.jsxs("span", Object.assign({ ref: u, className: t, onClick: r }, { children: ['"', e, '"'] })) : a.jsxs("span", Object.assign({ ref: u, onClick: S, className: t + " cursor-pointer" }, { children: ['"', l ? [d.slice(0, 6), v, d.slice(-4)] : e, '"'] }));
+  if (s === "directly")
+    return a.jsxs("span", Object.assign({ ref: u, onClick: S, className: t + " cursor-pointer" }, { children: ['"', l ? [d.slice(0, o), v] : e, '"'] }));
+  if (s === "word") {
+    let T = o, O = o + 1, A = d, f = 1;
+    for (; ; ) {
+      if (/\W/.test(e[T])) {
+        A = e.slice(0, T);
+        break;
+      }
+      if (/\W/.test(e[O])) {
+        A = e.slice(0, O);
+        break;
+      }
+      if (f === 6) {
+        A = e.slice(0, o);
+        break;
+      }
+      f++, T--, O++;
+    }
+    return a.jsxs("span", Object.assign({ ref: u, onClick: S, className: t + " cursor-pointer" }, { children: ['"', l ? [A, v] : e, '"'] }));
+  }
+  return a.jsxs("span", Object.assign({ ref: u, className: t }, { children: ['"', e, '"'] }));
+});
+var wt;
+function Ve() {
+  return Ve = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, Ve.apply(this, arguments);
+}
+var Hr = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", Ve({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, t), wt || (wt = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M17.25 3H6.75A3.754 3.754 0 0 0 3 6.75v10.5A3.754 3.754 0 0 0 6.75 21h10.5A3.754 3.754 0 0 0 21 17.25V6.75A3.754 3.754 0 0 0 17.25 3Zm2.25 14.25c0 1.24-1.01 2.25-2.25 2.25H6.75c-1.24 0-2.25-1.01-2.25-2.25V6.75c0-1.24 1.01-2.25 2.25-2.25h10.5c1.24 0 2.25 1.01 2.25 2.25v10.5Zm-6.09-9.466-5.031 5.03a2.981 2.981 0 0 0-.879 2.121v1.19c0 .415.336.75.75.75h1.19c.8 0 1.554-.312 2.12-.879l5.03-5.03a2.252 2.252 0 0 0 0-3.182c-.85-.85-2.331-.85-3.18 0Zm-2.91 7.151c-.28.28-.666.44-1.06.44H9v-.44c0-.4.156-.777.44-1.06l3.187-3.188 1.06 1.061-3.187 3.188Zm5.03-5.03-.782.783-1.06-1.061.782-.782a.766.766 0 0 1 1.06 0 .75.75 0 0 1 0 1.06Z"
+  })));
+}, xt, Ct;
+function He() {
+  return He = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, He.apply(this, arguments);
+}
+var Fr = function(t) {
+  return /* @__PURE__ */ D.createElement("svg", He({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, t), xt || (xt = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M6.75 3h5.5v1.5h-5.5C5.51 4.5 4.5 5.51 4.5 6.75v10.5c0 1.24 1.01 2.25 2.25 2.25h10.5c1.24 0 2.25-1.01 2.25-2.25v-5.5H21v5.5A3.754 3.754 0 0 1 17.25 21H6.75A3.754 3.754 0 0 1 3 17.25V6.75A3.754 3.754 0 0 1 6.75 3Z"
+  })), Ct || (Ct = /* @__PURE__ */ D.createElement("path", {
+    fill: "currentColor",
+    d: "M20.013 3h-3.946a.987.987 0 0 0 0 1.973h1.564l-6.342 6.342a1.004 1.004 0 0 0 0 1.396 1.004 1.004 0 0 0 1.396 0l6.342-6.342v1.564a.987.987 0 0 0 1.973 0V3.987A.987.987 0 0 0 20.013 3Z"
+  })));
 };
-
-//#endregion
-//#region src/components/state-sidebar.tsx
-var import_compiler_runtime$1 = require_compiler_runtime();
-const StateSidebar = (t0) => {
-	const $ = (0, import_compiler_runtime$1.c)(14);
-	const { state, onClose } = t0;
-	let t1;
-	if ($[0] !== state) {
-		t1 = {
-			label: "Overview",
-			content: /* @__PURE__ */ jsx(StateDetails, { state })
-		};
-		$[0] = state;
-		$[1] = t1;
-	} else t1 = $[1];
-	let t2;
-	if ($[2] !== state) {
-		t2 = {
-			label: "Editor",
-			content: /* @__PURE__ */ jsx(StateEditor, { state })
-		};
-		$[2] = state;
-		$[3] = t2;
-	} else t2 = $[3];
-	let t3;
-	if ($[4] !== t1 || $[5] !== t2) {
-		t3 = [t1, t2];
-		$[4] = t1;
-		$[5] = t2;
-		$[6] = t3;
-	} else t3 = $[6];
-	let t4;
-	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
-		t4 = /* @__PURE__ */ jsx(X, {});
-		$[7] = t4;
-	} else t4 = $[7];
-	let t5;
-	if ($[8] !== onClose) {
-		t5 = [{
-			icon: t4,
-			onClick: onClose,
-			label: "Close"
-		}];
-		$[8] = onClose;
-		$[9] = t5;
-	} else t5 = $[9];
-	let t6;
-	if ($[10] !== onClose || $[11] !== t3 || $[12] !== t5) {
-		t6 = /* @__PURE__ */ jsx(Sidebar, {
-			onClose,
-			title: "State Details",
-			initialWidth: 500,
-			tabs: t3,
-			actions: t5
-		});
-		$[10] = onClose;
-		$[11] = t3;
-		$[12] = t5;
-		$[13] = t6;
-	} else t6 = $[13];
-	return t6;
+function Dt({ node: e, depth: t, deleteHandle: r, indexOrName: n, parent: s, editHandle: o, parentPath: c }) {
+  const { collapseStringsAfterLength: l, enableClipboard: g, editable: u, src: d, onDelete: v, onChange: S, customizeNode: T, matchesURL: O, urlRegExp: A, EditComponent: f, DoneComponent: N, CancelComponent: E, CustomOperation: M } = te(ee);
+  let b;
+  if (typeof T == "function" && (b = Ue(T, [{ node: e, depth: t, indexOrName: n }])), b) {
+    if (qt(b))
+      return b;
+    if (_r(b)) {
+      const m = b;
+      return a.jsx(m, { node: e, depth: t, indexOrName: n });
+    }
+  }
+  if (Array.isArray(e) || Q(e))
+    return a.jsx(Lr, { parent: s, node: e, depth: t, indexOrName: n, deleteHandle: r, parentPath: c, customOptions: typeof b == "object" ? b : void 0 });
+  {
+    const m = typeof e, w = typeof n < "u" ? [...c, String(n)] : c, [y, H] = P(!1), [_, C] = P(!1), $ = V(null), L = () => {
+      H(!0), setTimeout(() => {
+        var h, k;
+        (h = window.getSelection()) === null || h === void 0 || h.selectAllChildren($.current), (k = $.current) === null || k === void 0 || k.focus();
+      });
+    }, U = K(() => {
+      let h = $.current.innerText;
+      try {
+        const k = JSON.parse(h);
+        o && o(n, k, e, c);
+      } catch {
+        const q = Mr(m, h);
+        o && o(n, q, e, c);
+      }
+      H(!1);
+    }, [o, n, e, c, m]), F = () => {
+      H(!1), C(!1);
+    }, j = () => {
+      C(!1), r && r(n, c), v && v({
+        value: e,
+        depth: t,
+        src: d,
+        indexOrName: n,
+        parentType: Array.isArray(s) ? "array" : "object",
+        parentPath: c
+      }), S && S({
+        depth: t,
+        src: d,
+        indexOrName: n,
+        parentType: Array.isArray(s) ? "array" : "object",
+        type: "delete",
+        parentPath: c
+      });
+    }, R = K((h) => {
+      h.key === "Enter" ? (h.preventDefault(), U()) : h.key === "Escape" && F();
+    }, [U]), I = y || _, z = !I && it(u) && ct(b) && o ? (h) => {
+      (h.ctrlKey || h.metaKey) && L();
+    } : void 0, Z = a.jsxs(a.Fragment, { children: [I && (typeof N == "function" ? a.jsx(N, { className: "json-view--edit", style: { display: "inline-block" }, onClick: _ ? j : U }) : a.jsx(qe, { className: "json-view--edit", style: { display: "inline-block" }, onClick: _ ? j : U })), I && (typeof E == "function" ? a.jsx(E, { className: "json-view--edit", style: { display: "inline-block" }, onClick: F }) : a.jsx(Be, { className: "json-view--edit", style: { display: "inline-block" }, onClick: F })), !I && g && we(b) && a.jsx(xe, { node: e, nodeMeta: { depth: t, indexOrName: n, parent: s, parentPath: c, currentPath: w } }), !I && O && m === "string" && A.test(e) && Rr(b) && a.jsx("a", Object.assign({ href: e, target: "_blank", className: "json-view--link" }, { children: a.jsx(Fr, {}) })), !I && it(u) && ct(b) && o && (typeof f == "function" ? a.jsx(f, { className: "json-view--edit", onClick: L }) : a.jsx(Hr, { className: "json-view--edit", onClick: L })), !I && ze(u) && Ze(b) && r && a.jsx(Ye, { className: "json-view--edit", onClick: () => C(!0) }), typeof M == "function" ? a.jsx(M, { node: e }) : null] });
+    let i = "json-view--string";
+    switch (m) {
+      case "number":
+      case "bigint":
+        i = "json-view--number";
+        break;
+      case "boolean":
+        i = "json-view--boolean";
+        break;
+      case "object":
+        i = "json-view--null";
+        break;
+    }
+    typeof b?.className == "string" && (i += " " + b.className), _ && (i += " json-view--deleting");
+    let p = String(e);
+    m === "bigint" && (p += "n");
+    const x = ue(() => a.jsx("span", { contentEditable: !0, className: i, dangerouslySetInnerHTML: { __html: m === "string" ? `"${p}"` : p }, ref: $, onKeyDown: R }), [p, m, R]);
+    return m === "string" ? a.jsxs(a.Fragment, { children: [y ? x : e.length > l ? a.jsx(Vr, { str: e, ref: $, className: i, ctrlClick: z }) : a.jsxs("span", Object.assign({ className: i, onClick: z }, { children: ['"', p, '"'] })), Z] }) : a.jsxs(a.Fragment, { children: [y ? x : a.jsx("span", Object.assign({ className: i, onClick: z }, { children: p })), Z] });
+  }
+}
+const Lt = /^(((ht|f)tps?):\/\/)?([^!@#$%^&*?.\s-]([^!@#$%^&*?.\s]{0,63}[^!@#$%^&*?.\s])?\.)+[a-z]{2,6}\/?/, ee = Yt({
+  src: void 0,
+  collapseStringsAfterLength: 99,
+  collapseStringMode: "directly",
+  customizeCollapseStringUI: void 0,
+  collapseObjectsAfterLength: 20,
+  collapsed: !1,
+  onCollapse: void 0,
+  enableClipboard: !0,
+  editable: !1,
+  onEdit: void 0,
+  onDelete: void 0,
+  onAdd: void 0,
+  onChange: void 0,
+  forceUpdate: () => {
+  },
+  customizeNode: void 0,
+  customizeCopy: () => {
+  },
+  displaySize: void 0,
+  displayArrayIndex: !0,
+  matchesURL: !1,
+  urlRegExp: Lt,
+  ignoreLargeArray: !1,
+  CopyComponent: void 0,
+  CopiedComponent: void 0,
+  EditComponent: void 0,
+  CancelComponent: void 0,
+  DoneComponent: void 0,
+  CustomOperation: void 0
+});
+function Ur({ src: e, collapseStringsAfterLength: t = 99, collapseStringMode: r = "directly", customizeCollapseStringUI: n, collapseObjectsAfterLength: s = 99, collapsed: o, onCollapse: c, enableClipboard: l = !0, editable: g = !1, onEdit: u, onDelete: d, onAdd: v, onChange: S, dark: T = !1, theme: O = "default", customizeNode: A, customizeCopy: f = (F) => Nr(F), displaySize: N, displayArrayIndex: E = !0, style: M, className: b, matchesURL: m = !1, urlRegExp: w = Lt, ignoreLargeArray: y = !1, CopyComponent: H, CopiedComponent: _, EditComponent: C, CancelComponent: $, DoneComponent: L, CustomOperation: U }) {
+  const [F, j] = P(0), R = K(() => j((Z) => ++Z), []), [I, z] = P(e);
+  return Y(() => z(e), [e]), a.jsx(ee.Provider, Object.assign({ value: {
+    src: I,
+    collapseStringsAfterLength: t,
+    collapseStringMode: r,
+    customizeCollapseStringUI: n,
+    collapseObjectsAfterLength: s,
+    collapsed: o,
+    onCollapse: c,
+    enableClipboard: l,
+    editable: g,
+    onEdit: u,
+    onDelete: d,
+    onAdd: v,
+    onChange: S,
+    forceUpdate: R,
+    customizeNode: A,
+    customizeCopy: f,
+    displaySize: N,
+    displayArrayIndex: E,
+    matchesURL: m,
+    urlRegExp: w,
+    ignoreLargeArray: y,
+    CopyComponent: H,
+    CopiedComponent: _,
+    EditComponent: C,
+    CancelComponent: $,
+    DoneComponent: L,
+    CustomOperation: U
+  } }, { children: a.jsx("code", Object.assign({ className: "json-view" + (T ? " dark" : "") + (O && O !== "default" ? " json-view_" + O : "") + (b ? " " + b : ""), style: M }, { children: a.jsx(Dt, { node: I, depth: 1, editHandle: (Z, i, p, x) => {
+    z(i), u && u({
+      newValue: i,
+      oldValue: p,
+      depth: 1,
+      src: I,
+      indexOrName: Z,
+      parentType: null,
+      parentPath: x
+    }), S && S({ type: "edit", depth: 1, src: I, indexOrName: Z, parentType: null, parentPath: x });
+  }, deleteHandle: (Z, i) => {
+    z(void 0), d && d({
+      value: I,
+      depth: 1,
+      src: I,
+      indexOrName: Z,
+      parentType: null,
+      parentPath: i
+    }), S && S({
+      depth: 1,
+      src: I,
+      indexOrName: Z,
+      parentType: null,
+      type: "delete",
+      parentPath: i
+    });
+  }, parentPath: [] }) })) }));
+}
+const zr = ({ state: e }) => /* @__PURE__ */ a.jsx(Ur, { src: e.value, theme: "default" });
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Zr = [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
+  ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
+], St = X("circle-alert", Zr);
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Jr = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]], Yr = X("check", Jr);
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const qr = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]], Br = X("loader-circle", qr);
+/**
+ * @license lucide-react v0.545.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Wr = [
+  [
+    "path",
+    {
+      d: "M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z",
+      key: "1c8476"
+    }
+  ],
+  ["path", { d: "M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7", key: "1ydtos" }],
+  ["path", { d: "M7 3v4a1 1 0 0 0 1 1h7", key: "t51u73" }]
+], Kr = X("save", Wr);
+function Gr(e, t, r) {
+  return t in e ? Object.defineProperty(e, t, {
+    value: r,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e[t] = r, e;
+}
+function Ot(e, t) {
+  var r = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var n = Object.getOwnPropertySymbols(e);
+    t && (n = n.filter(function(s) {
+      return Object.getOwnPropertyDescriptor(e, s).enumerable;
+    })), r.push.apply(r, n);
+  }
+  return r;
+}
+function Et(e) {
+  for (var t = 1; t < arguments.length; t++) {
+    var r = arguments[t] != null ? arguments[t] : {};
+    t % 2 ? Ot(Object(r), !0).forEach(function(n) {
+      Gr(e, n, r[n]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : Ot(Object(r)).forEach(function(n) {
+      Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
+    });
+  }
+  return e;
+}
+function Xr(e, t) {
+  if (e == null) return {};
+  var r = {}, n = Object.keys(e), s, o;
+  for (o = 0; o < n.length; o++)
+    s = n[o], !(t.indexOf(s) >= 0) && (r[s] = e[s]);
+  return r;
+}
+function Qr(e, t) {
+  if (e == null) return {};
+  var r = Xr(e, t), n, s;
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    for (s = 0; s < o.length; s++)
+      n = o[s], !(t.indexOf(n) >= 0) && Object.prototype.propertyIsEnumerable.call(e, n) && (r[n] = e[n]);
+  }
+  return r;
+}
+function en(e, t) {
+  return tn(e) || rn(e, t) || nn(e, t) || an();
+}
+function tn(e) {
+  if (Array.isArray(e)) return e;
+}
+function rn(e, t) {
+  if (!(typeof Symbol > "u" || !(Symbol.iterator in Object(e)))) {
+    var r = [], n = !0, s = !1, o = void 0;
+    try {
+      for (var c = e[Symbol.iterator](), l; !(n = (l = c.next()).done) && (r.push(l.value), !(t && r.length === t)); n = !0)
+        ;
+    } catch (g) {
+      s = !0, o = g;
+    } finally {
+      try {
+        !n && c.return != null && c.return();
+      } finally {
+        if (s) throw o;
+      }
+    }
+    return r;
+  }
+}
+function nn(e, t) {
+  if (e) {
+    if (typeof e == "string") return kt(e, t);
+    var r = Object.prototype.toString.call(e).slice(8, -1);
+    if (r === "Object" && e.constructor && (r = e.constructor.name), r === "Map" || r === "Set") return Array.from(e);
+    if (r === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)) return kt(e, t);
+  }
+}
+function kt(e, t) {
+  (t == null || t > e.length) && (t = e.length);
+  for (var r = 0, n = new Array(t); r < t; r++) n[r] = e[r];
+  return n;
+}
+function an() {
+  throw new TypeError(`Invalid attempt to destructure non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
+}
+function sn(e, t, r) {
+  return t in e ? Object.defineProperty(e, t, {
+    value: r,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e[t] = r, e;
+}
+function At(e, t) {
+  var r = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var n = Object.getOwnPropertySymbols(e);
+    t && (n = n.filter(function(s) {
+      return Object.getOwnPropertyDescriptor(e, s).enumerable;
+    })), r.push.apply(r, n);
+  }
+  return r;
+}
+function Nt(e) {
+  for (var t = 1; t < arguments.length; t++) {
+    var r = arguments[t] != null ? arguments[t] : {};
+    t % 2 ? At(Object(r), !0).forEach(function(n) {
+      sn(e, n, r[n]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : At(Object(r)).forEach(function(n) {
+      Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
+    });
+  }
+  return e;
+}
+function on() {
+  for (var e = arguments.length, t = new Array(e), r = 0; r < e; r++)
+    t[r] = arguments[r];
+  return function(n) {
+    return t.reduceRight(function(s, o) {
+      return o(s);
+    }, n);
+  };
+}
+function ie(e) {
+  return function t() {
+    for (var r = this, n = arguments.length, s = new Array(n), o = 0; o < n; o++)
+      s[o] = arguments[o];
+    return s.length >= e.length ? e.apply(this, s) : function() {
+      for (var c = arguments.length, l = new Array(c), g = 0; g < c; g++)
+        l[g] = arguments[g];
+      return t.apply(r, [].concat(s, l));
+    };
+  };
+}
+function je(e) {
+  return {}.toString.call(e).includes("Object");
+}
+function cn(e) {
+  return !Object.keys(e).length;
+}
+function de(e) {
+  return typeof e == "function";
+}
+function ln(e, t) {
+  return Object.prototype.hasOwnProperty.call(e, t);
+}
+function un(e, t) {
+  return je(t) || G("changeType"), Object.keys(t).some(function(r) {
+    return !ln(e, r);
+  }) && G("changeField"), t;
+}
+function dn(e) {
+  de(e) || G("selectorType");
+}
+function fn(e) {
+  de(e) || je(e) || G("handlerType"), je(e) && Object.values(e).some(function(t) {
+    return !de(t);
+  }) && G("handlersType");
+}
+function pn(e) {
+  e || G("initialIsRequired"), je(e) || G("initialType"), cn(e) && G("initialContent");
+}
+function gn(e, t) {
+  throw new Error(e[t] || e.default);
+}
+var hn = {
+  initialIsRequired: "initial state is required",
+  initialType: "initial state should be an object",
+  initialContent: "initial state shouldn't be an empty object",
+  handlerType: "handler should be an object or a function",
+  handlersType: "all handlers should be a functions",
+  selectorType: "selector should be a function",
+  changeType: "provided value of changes should be an object",
+  changeField: 'it seams you want to change a field in the state which is not specified in the "initial" state',
+  default: "an unknown error accured in `state-local` package"
+}, G = ie(gn)(hn), ve = {
+  changes: un,
+  selector: dn,
+  handler: fn,
+  initial: pn
 };
-
-//#endregion
-//#region src/components/states-page.tsx
-var import_compiler_runtime = require_compiler_runtime();
-const StatesPage = () => {
-	const $ = (0, import_compiler_runtime.c)(70);
-	const selectedStateId = useStatesStore(_temp);
-	const selectStateId = useStatesStore(_temp2);
-	const { items, deleteItems, refetch } = useGetStateItems();
-	const [search, setSearch] = useState("");
-	let t0;
-	if ($[0] !== items || $[1] !== search) {
-		let t1$1;
-		if ($[3] !== search) {
-			t1$1 = (item) => item.groupId.toLowerCase().includes(search.toLowerCase()) || item.key.toLowerCase().includes(search.toLowerCase());
-			$[3] = search;
-			$[4] = t1$1;
-		} else t1$1 = $[4];
-		t0 = items.filter(t1$1);
-		$[0] = items;
-		$[1] = search;
-		$[2] = t0;
-	} else t0 = $[2];
-	const filteredItems = t0;
-	let t1;
-	if ($[5] !== filteredItems || $[6] !== selectedStateId) {
-		t1 = selectedStateId ? filteredItems.find((item_0) => `${item_0.groupId}:${item_0.key}` === selectedStateId) : null;
-		$[5] = filteredItems;
-		$[6] = selectedStateId;
-		$[7] = t1;
-	} else t1 = $[7];
-	const selectedItem = t1;
-	let t2;
-	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
-		t2 = /* @__PURE__ */ new Set();
-		$[8] = t2;
-	} else t2 = $[8];
-	const [checkedItems, setCheckedItems] = useState(t2);
-	let t3;
-	if ($[9] !== selectStateId) {
-		t3 = (item_1) => selectStateId(`${item_1.groupId}:${item_1.key}`);
-		$[9] = selectStateId;
-		$[10] = t3;
-	} else t3 = $[10];
-	const handleRowClick = t3;
-	let t4;
-	if ($[11] !== selectStateId) {
-		t4 = () => selectStateId(void 0);
-		$[11] = selectStateId;
-		$[12] = t4;
-	} else t4 = $[12];
-	const onClose = t4;
-	let t5;
-	if ($[13] !== checkedItems || $[14] !== deleteItems) {
-		t5 = () => {
-			deleteItems(Array.from(checkedItems));
-			setCheckedItems(/* @__PURE__ */ new Set());
-		};
-		$[13] = checkedItems;
-		$[14] = deleteItems;
-		$[15] = t5;
-	} else t5 = $[15];
-	const deleteStates = t5;
-	let t6;
-	if ($[16] !== checkedItems) {
-		t6 = (item_2) => {
-			const isChecked = checkedItems.has(`${item_2.groupId}:${item_2.key}`);
-			setCheckedItems((prev) => {
-				const newSet = new Set(prev);
-				if (isChecked) newSet.delete(`${item_2.groupId}:${item_2.key}`);
-				else newSet.add(`${item_2.groupId}:${item_2.key}`);
-				return newSet;
-			});
-		};
-		$[16] = checkedItems;
-		$[17] = t6;
-	} else t6 = $[17];
-	const handleCheckboxChange = t6;
-	let t7;
-	if ($[18] !== filteredItems) {
-		t7 = (checked) => {
-			setCheckedItems((prev_0) => {
-				const newSet_0 = new Set(prev_0);
-				if (checked) filteredItems.forEach((item_3) => {
-					newSet_0.add(`${item_3.groupId}:${item_3.key}`);
-				});
-				else filteredItems.forEach((item_4) => {
-					newSet_0.delete(`${item_4.groupId}:${item_4.key}`);
-				});
-				return newSet_0;
-			});
-		};
-		$[18] = filteredItems;
-		$[19] = t7;
-	} else t7 = $[19];
-	const toggleSelectAll = t7;
-	let t8;
-	if ($[20] !== onClose || $[21] !== selectedItem) {
-		t8 = selectedItem && /* @__PURE__ */ jsx(StateSidebar, {
-			state: selectedItem,
-			onClose
-		});
-		$[20] = onClose;
-		$[21] = selectedItem;
-		$[22] = t8;
-	} else t8 = $[22];
-	let t9;
-	if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
-		t9 = (e) => setSearch(e.target.value);
-		$[23] = t9;
-	} else t9 = $[23];
-	let t10;
-	if ($[24] !== search) {
-		t10 = /* @__PURE__ */ jsx(Input, {
-			variant: "shade",
-			value: search,
-			onChange: t9,
-			className: "px-9! font-medium",
-			placeholder: "Search by Group ID or Key"
-		});
-		$[24] = search;
-		$[25] = t10;
-	} else t10 = $[25];
-	let t11;
-	if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
-		t11 = /* @__PURE__ */ jsx(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50" });
-		$[26] = t11;
-	} else t11 = $[26];
-	let t12;
-	if ($[27] === Symbol.for("react.memo_cache_sentinel")) {
-		t12 = /* @__PURE__ */ jsx(X, {
-			className: "cursor-pointer absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50 hover:text-muted-foreground",
-			onClick: () => setSearch("")
-		});
-		$[27] = t12;
-	} else t12 = $[27];
-	let t13;
-	if ($[28] !== t10) {
-		t13 = /* @__PURE__ */ jsxs("div", {
-			className: "flex-1 relative",
-			children: [
-				t10,
-				t11,
-				t12
-			]
-		});
-		$[28] = t10;
-		$[29] = t13;
-	} else t13 = $[29];
-	const t14 = checkedItems.size === 0;
-	let t15;
-	if ($[30] === Symbol.for("react.memo_cache_sentinel")) {
-		t15 = /* @__PURE__ */ jsx(Trash, {});
-		$[30] = t15;
-	} else t15 = $[30];
-	let t16;
-	if ($[31] !== deleteStates || $[32] !== t14) {
-		t16 = /* @__PURE__ */ jsxs(Button, {
-			variant: "default",
-			className: "h-[34px]",
-			disabled: t14,
-			onClick: deleteStates,
-			children: [t15, " Delete"]
-		});
-		$[31] = deleteStates;
-		$[32] = t14;
-		$[33] = t16;
-	} else t16 = $[33];
-	let t17;
-	if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
-		t17 = /* @__PURE__ */ jsx(RefreshCw, { className: "w-4 h-4 text-muted-foreground" });
-		$[34] = t17;
-	} else t17 = $[34];
-	let t18;
-	if ($[35] !== refetch) {
-		t18 = /* @__PURE__ */ jsx(Button, {
-			variant: "default",
-			className: "h-[34px]",
-			onClick: refetch,
-			children: t17
-		});
-		$[35] = refetch;
-		$[36] = t18;
-	} else t18 = $[36];
-	let t19;
-	if ($[37] !== t13 || $[38] !== t16 || $[39] !== t18) {
-		t19 = /* @__PURE__ */ jsxs("div", {
-			className: "flex p-2 border-b gap-2",
-			"data-testid": "logs-search-container",
-			children: [
-				t13,
-				t16,
-				t18
-			]
-		});
-		$[37] = t13;
-		$[38] = t16;
-		$[39] = t18;
-		$[40] = t19;
-	} else t19 = $[40];
-	let t20;
-	if ($[41] !== toggleSelectAll) {
-		t20 = /* @__PURE__ */ jsx(TableHead, { children: /* @__PURE__ */ jsx(Checkbox, {
-			onClick: _temp3,
-			onCheckedChange: toggleSelectAll
-		}) });
-		$[41] = toggleSelectAll;
-		$[42] = t20;
-	} else t20 = $[42];
-	let t21;
-	let t22;
-	let t23;
-	if ($[43] === Symbol.for("react.memo_cache_sentinel")) {
-		t21 = /* @__PURE__ */ jsx(TableHead, {
-			className: "rounded-0",
-			children: "Group ID"
-		});
-		t22 = /* @__PURE__ */ jsx(TableHead, { children: "Key" });
-		t23 = /* @__PURE__ */ jsx(TableHead, { children: "Type" });
-		$[43] = t21;
-		$[44] = t22;
-		$[45] = t23;
-	} else {
-		t21 = $[43];
-		t22 = $[44];
-		t23 = $[45];
-	}
-	let t24;
-	if ($[46] !== t20) {
-		t24 = /* @__PURE__ */ jsx(TableHeader, {
-			className: "sticky top-0 bg-background/20 backdrop-blur-sm",
-			children: /* @__PURE__ */ jsxs(TableRow, { children: [
-				t20,
-				t21,
-				t22,
-				t23
-			] })
-		});
-		$[46] = t20;
-		$[47] = t24;
-	} else t24 = $[47];
-	let t25;
-	if ($[48] !== checkedItems || $[49] !== filteredItems || $[50] !== handleCheckboxChange || $[51] !== handleRowClick || $[52] !== selectedItem) {
-		let t26$1;
-		if ($[54] !== checkedItems || $[55] !== handleCheckboxChange || $[56] !== handleRowClick || $[57] !== selectedItem) {
-			t26$1 = (item_5) => /* @__PURE__ */ jsxs(TableRow, {
-				"data-testid": `item-${item_5}`,
-				onClick: () => handleRowClick(item_5),
-				className: cn("font-mono font-semibold cursor-pointer border-0", selectedItem === item_5 ? "bg-muted-foreground/10 hover:bg-muted-foreground/20" : "hover:bg-muted-foreground/10"),
-				children: [
-					/* @__PURE__ */ jsx(TableCell, {
-						onClick: _temp4,
-						children: /* @__PURE__ */ jsx(Checkbox, {
-							checked: checkedItems.has(`${item_5.groupId}:${item_5.key}`),
-							onClick: () => handleCheckboxChange(item_5)
-						})
-					}),
-					/* @__PURE__ */ jsx(TableCell, {
-						className: "hover:bg-transparent",
-						children: item_5.groupId
-					}),
-					/* @__PURE__ */ jsx(TableCell, {
-						className: "hover:bg-transparent",
-						children: item_5.key
-					}),
-					/* @__PURE__ */ jsx(TableCell, {
-						className: "hover:bg-transparent",
-						children: item_5.type
-					})
-				]
-			}, `${item_5.groupId}:${item_5.key}`);
-			$[54] = checkedItems;
-			$[55] = handleCheckboxChange;
-			$[56] = handleRowClick;
-			$[57] = selectedItem;
-			$[58] = t26$1;
-		} else t26$1 = $[58];
-		t25 = filteredItems.map(t26$1);
-		$[48] = checkedItems;
-		$[49] = filteredItems;
-		$[50] = handleCheckboxChange;
-		$[51] = handleRowClick;
-		$[52] = selectedItem;
-		$[53] = t25;
-	} else t25 = $[53];
-	let t26;
-	if ($[59] !== t25) {
-		t26 = /* @__PURE__ */ jsx(TableBody, { children: t25 });
-		$[59] = t25;
-		$[60] = t26;
-	} else t26 = $[60];
-	let t27;
-	if ($[61] !== t24 || $[62] !== t26) {
-		t27 = /* @__PURE__ */ jsxs(Table, { children: [t24, t26] });
-		$[61] = t24;
-		$[62] = t26;
-		$[63] = t27;
-	} else t27 = $[63];
-	let t28;
-	if ($[64] !== t19 || $[65] !== t27) {
-		t28 = /* @__PURE__ */ jsxs("div", {
-			className: "grid grid-rows-[auto_1fr] h-full",
-			"data-testid": "states-container",
-			children: [t19, t27]
-		});
-		$[64] = t19;
-		$[65] = t27;
-		$[66] = t28;
-	} else t28 = $[66];
-	let t29;
-	if ($[67] !== t28 || $[68] !== t8) {
-		t29 = /* @__PURE__ */ jsxs(Fragment, { children: [t8, t28] });
-		$[67] = t28;
-		$[68] = t8;
-		$[69] = t29;
-	} else t29 = $[69];
-	return t29;
+function vn(e) {
+  var t = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
+  ve.initial(e), ve.handler(t);
+  var r = {
+    current: e
+  }, n = ie(jn)(r, t), s = ie(yn)(r), o = ie(ve.changes)(e), c = ie(mn)(r);
+  function l() {
+    var u = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : function(d) {
+      return d;
+    };
+    return ve.selector(u), u(r.current);
+  }
+  function g(u) {
+    on(n, s, o, c)(u);
+  }
+  return [l, g];
+}
+function mn(e, t) {
+  return de(t) ? t(e.current) : t;
+}
+function yn(e, t) {
+  return e.current = Nt(Nt({}, e.current), t), t;
+}
+function jn(e, t, r) {
+  return de(t) ? t(e.current) : Object.keys(r).forEach(function(n) {
+    var s;
+    return (s = t[n]) === null || s === void 0 ? void 0 : s.call(t, e.current[n]);
+  }), r;
+}
+var bn = {
+  create: vn
+}, wn = {
+  paths: {
+    vs: "https://cdn.jsdelivr.net/npm/monaco-editor@0.52.2/min/vs"
+  }
 };
-function _temp(state) {
-	return state.selectedStateId;
+function xn(e) {
+  return function t() {
+    for (var r = this, n = arguments.length, s = new Array(n), o = 0; o < n; o++)
+      s[o] = arguments[o];
+    return s.length >= e.length ? e.apply(this, s) : function() {
+      for (var c = arguments.length, l = new Array(c), g = 0; g < c; g++)
+        l[g] = arguments[g];
+      return t.apply(r, [].concat(s, l));
+    };
+  };
 }
-function _temp2(state_0) {
-	return state_0.selectStateId;
+function Cn(e) {
+  return {}.toString.call(e).includes("Object");
 }
-function _temp3(evt) {
-	return evt.stopPropagation();
+function Sn(e) {
+  return e || Tt("configIsRequired"), Cn(e) || Tt("configType"), e.urls ? (On(), {
+    paths: {
+      vs: e.urls.monacoBase
+    }
+  }) : e;
 }
-function _temp4(evt_0) {
-	return evt_0.stopPropagation();
+function On() {
+  console.warn(Vt.deprecation);
 }
+function En(e, t) {
+  throw new Error(e[t] || e.default);
+}
+var Vt = {
+  configIsRequired: "the configuration object is required",
+  configType: "the configuration object should be an object",
+  default: "an unknown error accured in `@monaco-editor/loader` package",
+  deprecation: `Deprecation warning!
+    You are using deprecated way of configuration.
+
+    Instead of using
+      monaco.config({ urls: { monacoBase: '...' } })
+    use
+      monaco.config({ paths: { vs: '...' } })
 
-//#endregion
-export { StatesPage };
-//# sourceMappingURL=index.js.map
+    For more please check the link https://github.com/suren-atoyan/monaco-loader#config
+  `
+}, Tt = xn(En)(Vt), kn = {
+  config: Sn
+}, An = function() {
+  for (var t = arguments.length, r = new Array(t), n = 0; n < t; n++)
+    r[n] = arguments[n];
+  return function(s) {
+    return r.reduceRight(function(o, c) {
+      return c(o);
+    }, s);
+  };
+};
+function Ht(e, t) {
+  return Object.keys(t).forEach(function(r) {
+    t[r] instanceof Object && e[r] && Object.assign(t[r], Ht(e[r], t[r]));
+  }), Et(Et({}, e), t);
+}
+var Nn = {
+  type: "cancelation",
+  msg: "operation is manually canceled"
+};
+function ke(e) {
+  var t = !1, r = new Promise(function(n, s) {
+    e.then(function(o) {
+      return t ? s(Nn) : n(o);
+    }), e.catch(s);
+  });
+  return r.cancel = function() {
+    return t = !0;
+  }, r;
+}
+var Tn = bn.create({
+  config: wn,
+  isInitialized: !1,
+  resolve: null,
+  reject: null,
+  monaco: null
+}), Ft = en(Tn, 2), fe = Ft[0], Ce = Ft[1];
+function _n(e) {
+  var t = kn.config(e), r = t.monaco, n = Qr(t, ["monaco"]);
+  Ce(function(s) {
+    return {
+      config: Ht(s.config, n),
+      monaco: r
+    };
+  });
+}
+function Rn() {
+  var e = fe(function(t) {
+    var r = t.monaco, n = t.isInitialized, s = t.resolve;
+    return {
+      monaco: r,
+      isInitialized: n,
+      resolve: s
+    };
+  });
+  if (!e.isInitialized) {
+    if (Ce({
+      isInitialized: !0
+    }), e.monaco)
+      return e.resolve(e.monaco), ke(Ae);
+    if (window.monaco && window.monaco.editor)
+      return Ut(window.monaco), e.resolve(window.monaco), ke(Ae);
+    An(Mn, Pn)($n);
+  }
+  return ke(Ae);
+}
+function Mn(e) {
+  return document.body.appendChild(e);
+}
+function In(e) {
+  var t = document.createElement("script");
+  return e && (t.src = e), t;
+}
+function Pn(e) {
+  var t = fe(function(n) {
+    var s = n.config, o = n.reject;
+    return {
+      config: s,
+      reject: o
+    };
+  }), r = In("".concat(t.config.paths.vs, "/loader.js"));
+  return r.onload = function() {
+    return e();
+  }, r.onerror = t.reject, r;
+}
+function $n() {
+  var e = fe(function(r) {
+    var n = r.config, s = r.resolve, o = r.reject;
+    return {
+      config: n,
+      resolve: s,
+      reject: o
+    };
+  }), t = window.require;
+  t.config(e.config), t(["vs/editor/editor.main"], function(r) {
+    Ut(r), e.resolve(r);
+  }, function(r) {
+    e.reject(r);
+  });
+}
+function Ut(e) {
+  fe().monaco || Ce({
+    monaco: e
+  });
+}
+function Dn() {
+  return fe(function(e) {
+    var t = e.monaco;
+    return t;
+  });
+}
+var Ae = new Promise(function(e, t) {
+  return Ce({
+    resolve: e,
+    reject: t
+  });
+}), be = {
+  config: _n,
+  init: Rn,
+  __getMonacoInstance: Dn
+}, Ln = { wrapper: { display: "flex", position: "relative", textAlign: "initial" }, fullWidth: { width: "100%" }, hide: { display: "none" } }, Ne = Ln, Vn = { container: { display: "flex", height: "100%", width: "100%", justifyContent: "center", alignItems: "center" } }, Hn = Vn;
+function Fn({ children: e }) {
+  return W.createElement("div", { style: Hn.container }, e);
+}
+var Un = Fn, zn = Un;
+function Zn({ width: e, height: t, isEditorReady: r, loading: n, _ref: s, className: o, wrapperProps: c }) {
+  return W.createElement("section", { style: { ...Ne.wrapper, width: e, height: t }, ...c }, !r && W.createElement(zn, null, n), W.createElement("div", { ref: s, style: { ...Ne.fullWidth, ...!r && Ne.hide }, className: o }));
+}
+var Jn = Zn, zt = Fe(Jn);
+function Yn(e) {
+  Y(e, []);
+}
+var We = Yn;
+function qn(e, t, r = !0) {
+  let n = V(!0);
+  Y(n.current || !r ? () => {
+    n.current = !1;
+  } : e, t);
+}
+var B = qn;
+function le() {
+}
+function ne(e, t, r, n) {
+  return Bn(e, n) || Wn(e, t, r, n);
+}
+function Bn(e, t) {
+  return e.editor.getModel(Zt(e, t));
+}
+function Wn(e, t, r, n) {
+  return e.editor.createModel(t, r, n ? Zt(e, n) : void 0);
+}
+function Zt(e, t) {
+  return e.Uri.parse(t);
+}
+function Kn({ original: e, modified: t, language: r, originalLanguage: n, modifiedLanguage: s, originalModelPath: o, modifiedModelPath: c, keepCurrentOriginalModel: l = !1, keepCurrentModifiedModel: g = !1, theme: u = "light", loading: d = "Loading...", options: v = {}, height: S = "100%", width: T = "100%", className: O, wrapperProps: A = {}, beforeMount: f = le, onMount: N = le }) {
+  let [E, M] = P(!1), [b, m] = P(!0), w = V(null), y = V(null), H = V(null), _ = V(N), C = V(f), $ = V(!1);
+  We(() => {
+    let j = be.init();
+    return j.then((R) => (y.current = R) && m(!1)).catch((R) => R?.type !== "cancelation" && console.error("Monaco initialization: error:", R)), () => w.current ? F() : j.cancel();
+  }), B(() => {
+    if (w.current && y.current) {
+      let j = w.current.getOriginalEditor(), R = ne(y.current, e || "", n || r || "text", o || "");
+      R !== j.getModel() && j.setModel(R);
+    }
+  }, [o], E), B(() => {
+    if (w.current && y.current) {
+      let j = w.current.getModifiedEditor(), R = ne(y.current, t || "", s || r || "text", c || "");
+      R !== j.getModel() && j.setModel(R);
+    }
+  }, [c], E), B(() => {
+    let j = w.current.getModifiedEditor();
+    j.getOption(y.current.editor.EditorOption.readOnly) ? j.setValue(t || "") : t !== j.getValue() && (j.executeEdits("", [{ range: j.getModel().getFullModelRange(), text: t || "", forceMoveMarkers: !0 }]), j.pushUndoStop());
+  }, [t], E), B(() => {
+    w.current?.getModel()?.original.setValue(e || "");
+  }, [e], E), B(() => {
+    let { original: j, modified: R } = w.current.getModel();
+    y.current.editor.setModelLanguage(j, n || r || "text"), y.current.editor.setModelLanguage(R, s || r || "text");
+  }, [r, n, s], E), B(() => {
+    y.current?.editor.setTheme(u);
+  }, [u], E), B(() => {
+    w.current?.updateOptions(v);
+  }, [v], E);
+  let L = K(() => {
+    if (!y.current) return;
+    C.current(y.current);
+    let j = ne(y.current, e || "", n || r || "text", o || ""), R = ne(y.current, t || "", s || r || "text", c || "");
+    w.current?.setModel({ original: j, modified: R });
+  }, [r, t, s, e, n, o, c]), U = K(() => {
+    !$.current && H.current && (w.current = y.current.editor.createDiffEditor(H.current, { automaticLayout: !0, ...v }), L(), y.current?.editor.setTheme(u), M(!0), $.current = !0);
+  }, [v, u, L]);
+  Y(() => {
+    E && _.current(w.current, y.current);
+  }, [E]), Y(() => {
+    !b && !E && U();
+  }, [b, E, U]);
+  function F() {
+    let j = w.current?.getModel();
+    l || j?.original?.dispose(), g || j?.modified?.dispose(), w.current?.dispose();
+  }
+  return W.createElement(zt, { width: T, height: S, isEditorReady: E, loading: d, _ref: H, className: O, wrapperProps: A });
+}
+var Gn = Kn;
+Fe(Gn);
+function Xn() {
+  let [e, t] = P(be.__getMonacoInstance());
+  return We(() => {
+    let r;
+    return e || (r = be.init(), r.then((n) => {
+      t(n);
+    })), () => r?.cancel();
+  }), e;
+}
+var Qn = Xn;
+function ea(e) {
+  let t = V();
+  return Y(() => {
+    t.current = e;
+  }, [e]), t.current;
+}
+var ta = ea, me = /* @__PURE__ */ new Map();
+function ra({ defaultValue: e, defaultLanguage: t, defaultPath: r, value: n, language: s, path: o, theme: c = "light", line: l, loading: g = "Loading...", options: u = {}, overrideServices: d = {}, saveViewState: v = !0, keepCurrentModel: S = !1, width: T = "100%", height: O = "100%", className: A, wrapperProps: f = {}, beforeMount: N = le, onMount: E = le, onChange: M, onValidate: b = le }) {
+  let [m, w] = P(!1), [y, H] = P(!0), _ = V(null), C = V(null), $ = V(null), L = V(E), U = V(N), F = V(), j = V(n), R = ta(o), I = V(!1), z = V(!1);
+  We(() => {
+    let p = be.init();
+    return p.then((x) => (_.current = x) && H(!1)).catch((x) => x?.type !== "cancelation" && console.error("Monaco initialization: error:", x)), () => C.current ? i() : p.cancel();
+  }), B(() => {
+    let p = ne(_.current, e || n || "", t || s || "", o || r || "");
+    p !== C.current?.getModel() && (v && me.set(R, C.current?.saveViewState()), C.current?.setModel(p), v && C.current?.restoreViewState(me.get(o)));
+  }, [o], m), B(() => {
+    C.current?.updateOptions(u);
+  }, [u], m), B(() => {
+    !C.current || n === void 0 || (C.current.getOption(_.current.editor.EditorOption.readOnly) ? C.current.setValue(n) : n !== C.current.getValue() && (z.current = !0, C.current.executeEdits("", [{ range: C.current.getModel().getFullModelRange(), text: n, forceMoveMarkers: !0 }]), C.current.pushUndoStop(), z.current = !1));
+  }, [n], m), B(() => {
+    let p = C.current?.getModel();
+    p && s && _.current?.editor.setModelLanguage(p, s);
+  }, [s], m), B(() => {
+    l !== void 0 && C.current?.revealLine(l);
+  }, [l], m), B(() => {
+    _.current?.editor.setTheme(c);
+  }, [c], m);
+  let Z = K(() => {
+    if (!(!$.current || !_.current) && !I.current) {
+      U.current(_.current);
+      let p = o || r, x = ne(_.current, n || e || "", t || s || "", p || "");
+      C.current = _.current?.editor.create($.current, { model: x, automaticLayout: !0, ...u }, d), v && C.current.restoreViewState(me.get(p)), _.current.editor.setTheme(c), l !== void 0 && C.current.revealLine(l), w(!0), I.current = !0;
+    }
+  }, [e, t, r, n, s, o, u, d, v, c, l]);
+  Y(() => {
+    m && L.current(C.current, _.current);
+  }, [m]), Y(() => {
+    !y && !m && Z();
+  }, [y, m, Z]), j.current = n, Y(() => {
+    m && M && (F.current?.dispose(), F.current = C.current?.onDidChangeModelContent((p) => {
+      z.current || M(C.current.getValue(), p);
+    }));
+  }, [m, M]), Y(() => {
+    if (m) {
+      let p = _.current.editor.onDidChangeMarkers((x) => {
+        let h = C.current.getModel()?.uri;
+        if (h && x.find((k) => k.path === h.path)) {
+          let k = _.current.editor.getModelMarkers({ resource: h });
+          b?.(k);
+        }
+      });
+      return () => {
+        p?.dispose();
+      };
+    }
+    return () => {
+    };
+  }, [m, b]);
+  function i() {
+    F.current?.dispose(), S ? v && me.set(o, C.current.saveViewState()) : C.current.getModel()?.dispose(), C.current.dispose();
+  }
+  return W.createElement(zt, { width: T, height: O, isEditorReady: m, loading: g, _ref: $, className: A, wrapperProps: f });
+}
+var na = ra, aa = Fe(na), sa = aa;
+const oa = ({
+  value: e,
+  height: t = 300,
+  schema: r,
+  onChange: n,
+  onValidate: s,
+  language: o = "json",
+  readOnly: c = !1
+}) => {
+  const l = Qn(), g = Bt((d) => d.theme), u = ue(() => g === "dark" ? "vs-dark" : "light", [g]);
+  return Y(() => {
+    l && (l.languages.typescript.javascriptDefaults.setCompilerOptions({ isolatedModules: !0 }), l.languages.json.jsonDefaults.setDiagnosticsOptions({
+      schemas: r ? [
+        {
+          uri: window.location.href,
+          fileMatch: ["*"],
+          schema: r
+        }
+      ] : []
+    }));
+  }, [l, r, o]), /* @__PURE__ */ a.jsx(
+    sa,
+    {
+      "data-testid": "json-editor",
+      height: t,
+      language: o,
+      value: e,
+      theme: u,
+      onChange: (d) => {
+        d || s?.(!1), n?.(d ?? "");
+      },
+      onValidate: (d) => s?.(d.length === 0),
+      options: {
+        readOnly: c,
+        scrollBeyondLastLine: !1,
+        minimap: { enabled: !1 }
+      }
+    }
+  );
+}, ia = ({ state: e }) => {
+  const [t, r] = P(!1), [n, s] = P(!0), [o, c] = P(JSON.stringify(e.value, null, 2)), [l, g] = P(!1), [u, d] = P("idle"), v = V(JSON.stringify(e.value, null, 2));
+  Y(() => {
+    c(JSON.stringify(e.value, null, 2));
+  }, [e.value]);
+  const S = K((f) => {
+    g(f !== v.current), c(f), d("idle");
+  }, []), T = async () => {
+    if (!(!n || !l))
+      try {
+        r(!0), d("idle");
+        const f = await fetch("/__motia/state", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify({
+            key: e.key,
+            groupId: e.groupId,
+            value: JSON.parse(o)
+          })
+        });
+        if (!f.ok)
+          throw new Error(`HTTP error! status: ${f.status}`);
+        v.current = o, d("success"), g(!1), setTimeout(() => {
+          d("idle");
+        }, 3e3);
+      } catch (f) {
+        console.error("Failed to save state:", f), d("error");
+      } finally {
+        r(!1);
+      }
+  }, O = K(() => {
+    c(JSON.stringify(e.value, null, 2)), g(!1), d("idle");
+  }, [e.value]), A = ue(() => u === "success" ? /* @__PURE__ */ a.jsx("div", { className: "bg-green-50 dark:bg-green-950/20 border border-green-200 dark:border-green-800 rounded-lg p-2", children: /* @__PURE__ */ a.jsxs("div", { className: "flex items-center gap-2 text-green-700 dark:text-green-400 text-sm", children: [
+    /* @__PURE__ */ a.jsx(Yr, { className: "w-4 h-4" }),
+    "State saved successfully!"
+  ] }) }) : u === "error" ? /* @__PURE__ */ a.jsx("div", { className: "bg-red-50 dark:bg-red-950/20 border border-red-200 dark:border-red-800 rounded-lg p-2", children: /* @__PURE__ */ a.jsxs("div", { className: "flex items-center gap-2 text-red-700 dark:text-red-400 text-sm", children: [
+    /* @__PURE__ */ a.jsx(St, { className: "w-4 h-4" }),
+    "Failed to save state. Please try again."
+  ] }) }) : /* @__PURE__ */ a.jsx("div", { className: "text-xs text-muted-foreground", children: l ? /* @__PURE__ */ a.jsxs("span", { className: "flex items-center gap-1", children: [
+    /* @__PURE__ */ a.jsx("div", { className: "w-2 h-2 bg-orange-500 rounded-full" }),
+    "Unsaved changes"
+  ] }) : /* @__PURE__ */ a.jsxs("span", { className: "flex items-center gap-1", children: [
+    /* @__PURE__ */ a.jsx("div", { className: "w-2 h-2 bg-green-500 rounded-full" }),
+    "Up to date"
+  ] }) }), [u, l]);
+  return /* @__PURE__ */ a.jsxs("div", { className: "flex flex-col gap-2 h-full", children: [
+    /* @__PURE__ */ a.jsx("p", { className: "text-xs text-muted-foreground", children: "Modify the state value using the JSON editor below." }),
+    /* @__PURE__ */ a.jsx("div", { className: "space-y-3 pt-2 flex flex-col", children: /* @__PURE__ */ a.jsxs("div", { className: "relative flex-1", children: [
+      /* @__PURE__ */ a.jsx(
+        oa,
+        {
+          value: o,
+          onChange: S,
+          onValidate: s,
+          height: "calc(100vh - 300px)"
+        }
+      ),
+      !n && /* @__PURE__ */ a.jsxs("div", { className: "absolute top-2 right-2 bg-destructive/90 text-destructive-foreground px-2 py-1 rounded text-xs flex items-center gap-1", children: [
+        /* @__PURE__ */ a.jsx(St, { className: "w-3 h-3" }),
+        "Invalid JSON"
+      ] })
+    ] }) }),
+    /* @__PURE__ */ a.jsxs("div", { className: "flex items-center justify-between pt-2", children: [
+      A,
+      /* @__PURE__ */ a.jsxs("div", { className: "flex items-center gap-2", children: [
+        l && /* @__PURE__ */ a.jsx(ye, { variant: "secondary", onClick: O, disabled: t, children: "Reset" }),
+        /* @__PURE__ */ a.jsx(
+          ye,
+          {
+            onClick: T,
+            variant: "accent",
+            disabled: t || !n || !l,
+            "data-testid": "state-save-button",
+            children: t ? /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+              /* @__PURE__ */ a.jsx(Br, { className: "w-3 h-3 animate-spin mr-1" }),
+              "Saving..."
+            ] }) : /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+              /* @__PURE__ */ a.jsx(Kr, { className: "w-3 h-3 mr-1" }),
+              "Save Changes"
+            ] })
+          }
+        )
+      ] })
+    ] })
+  ] });
+}, ca = ({ state: e, onClose: t }) => /* @__PURE__ */ a.jsx(
+  Wt,
+  {
+    onClose: t,
+    title: "State Details",
+    initialWidth: 500,
+    tabs: [
+      {
+        label: "Overview",
+        content: /* @__PURE__ */ a.jsx(zr, { state: e })
+      },
+      {
+        label: "Editor",
+        content: /* @__PURE__ */ a.jsx(ia, { state: e })
+      }
+    ],
+    actions: [{ icon: /* @__PURE__ */ a.jsx(Mt, {}), onClick: t, label: "Close" }]
+  }
+), da = () => {
+  const e = nt((f) => f.selectedStateId), t = nt((f) => f.selectStateId), { items: r, deleteItems: n, refetch: s } = vr(), [o, c] = P(""), l = ue(() => r.filter((f) => f.groupId.toLowerCase().includes(o.toLowerCase()) || f.key.toLowerCase().includes(o.toLowerCase())), [r, o]), g = ue(
+    () => e ? l.find((f) => `${f.groupId}:${f.key}` === e) : null,
+    [l, e]
+  ), [u, d] = P(/* @__PURE__ */ new Set()), v = (f) => t(`${f.groupId}:${f.key}`), S = () => t(void 0), T = () => {
+    n(Array.from(u)), d(/* @__PURE__ */ new Set());
+  }, O = (f) => {
+    const N = u.has(`${f.groupId}:${f.key}`);
+    d((E) => {
+      const M = new Set(E);
+      return N ? M.delete(`${f.groupId}:${f.key}`) : M.add(`${f.groupId}:${f.key}`), M;
+    });
+  }, A = (f) => {
+    d((N) => {
+      const E = new Set(N);
+      return f ? l.forEach((M) => E.add(`${M.groupId}:${M.key}`)) : l.forEach((M) => E.delete(`${M.groupId}:${M.key}`)), E;
+    });
+  };
+  return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+    g && /* @__PURE__ */ a.jsx(ca, { state: g, onClose: S }),
+    /* @__PURE__ */ a.jsxs("div", { className: "grid grid-rows-[auto_1fr] h-full", "data-testid": "states-container", children: [
+      /* @__PURE__ */ a.jsxs("div", { className: "flex p-2 border-b gap-2", "data-testid": "logs-search-container", children: [
+        /* @__PURE__ */ a.jsxs("div", { className: "flex-1 relative", children: [
+          /* @__PURE__ */ a.jsx(
+            Kt,
+            {
+              variant: "shade",
+              value: o,
+              onChange: (f) => c(f.target.value),
+              className: "px-9! font-medium",
+              placeholder: "Search by Group ID or Key"
+            }
+          ),
+          /* @__PURE__ */ a.jsx(fr, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50" }),
+          /* @__PURE__ */ a.jsx(
+            Mt,
+            {
+              className: "cursor-pointer absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50 hover:text-muted-foreground",
+              onClick: () => c("")
+            }
+          )
+        ] }),
+        /* @__PURE__ */ a.jsxs(ye, { variant: "default", className: "h-[34px]", disabled: u.size === 0, onClick: T, children: [
+          /* @__PURE__ */ a.jsx(gr, {}),
+          " Delete"
+        ] }),
+        /* @__PURE__ */ a.jsx(ye, { variant: "default", className: "h-[34px]", onClick: s, children: /* @__PURE__ */ a.jsx(ur, { className: "w-4 h-4 text-muted-foreground" }) })
+      ] }),
+      /* @__PURE__ */ a.jsxs(Gt, { children: [
+        /* @__PURE__ */ a.jsx(Xt, { className: "sticky top-0 bg-background/20 backdrop-blur-sm", children: /* @__PURE__ */ a.jsxs(Ke, { children: [
+          /* @__PURE__ */ a.jsx(pe, { children: /* @__PURE__ */ a.jsx(Ge, { onClick: (f) => f.stopPropagation(), onCheckedChange: A }) }),
+          /* @__PURE__ */ a.jsx(pe, { className: "rounded-0", children: "Group ID" }),
+          /* @__PURE__ */ a.jsx(pe, { children: "Key" }),
+          /* @__PURE__ */ a.jsx(pe, { children: "Type" })
+        ] }) }),
+        /* @__PURE__ */ a.jsx(Qt, { children: l.map((f) => /* @__PURE__ */ a.jsxs(
+          Ke,
+          {
+            "data-testid": `item-${f}`,
+            onClick: () => v(f),
+            className: er(
+              "font-mono font-semibold cursor-pointer border-0",
+              g === f ? "bg-muted-foreground/10 hover:bg-muted-foreground/20" : "hover:bg-muted-foreground/10"
+            ),
+            children: [
+              /* @__PURE__ */ a.jsx(ge, { onClick: (N) => N.stopPropagation(), children: /* @__PURE__ */ a.jsx(
+                Ge,
+                {
+                  checked: u.has(`${f.groupId}:${f.key}`),
+                  onClick: () => O(f)
+                }
+              ) }),
+              /* @__PURE__ */ a.jsx(ge, { className: "hover:bg-transparent", children: f.groupId }),
+              /* @__PURE__ */ a.jsx(ge, { className: "hover:bg-transparent", children: f.key }),
+              /* @__PURE__ */ a.jsx(ge, { className: "hover:bg-transparent", children: f.type })
+            ]
+          },
+          `${f.groupId}:${f.key}`
+        )) })
+      ] })
+    ] })
+  ] });
+};
+export {
+  da as StatesPage
+};