@janbox/storefront-builder 1.0.5 → 1.0.7

package/dist/editor.js

@@ -1,18 +1,36 @@
-import { jsx as n, Fragment as Ne, jsxs as g } from "@emotion/react/jsx-runtime";
-import { u as _e, a as ae, b as te, D as ze, c as qe, W as j, d as E, e as Ge, f as Ue, g as Le, h as Ee, i as Ze, j as Qe, k as we, l as Ye, m as ue, n as oe, A as Se, o as Ke, C as Me, p as Re, q as Xe, r as Je, T as et, s as fe, R as tt } from "./index-DrJkOkbq.js";
-import { t as qr } from "./index-DrJkOkbq.js";
-import rt from "mitt";
-import { c as I, N as pe, B as ge, g as nt, a as st, u as W, W as ot, b as $e, i as it, P as ct } from "./countdown-timer.node-CAsCNVin.js";
-import { useRef as je, useState as _, useEffect as z, createElement as Ae, Fragment as J, Suspense as at } from "react";
-import { useToggle as De } from "usehooks-ts";
-import { CacheProvider as lt, Global as dt, createElement as ht } from "@emotion/react";
-import { useFloating as wt, autoUpdate as ut, flip as ft, size as pt, useHover as gt, safePolygon as mt, useFocus as kt, useDismiss as vt, useRole as bt, useInteractions as Ct, FloatingPortal as Ie } from "@floating-ui/react";
-import { ThemeProvider as xt, FLOATING_Z_INDEX as yt, breakpoint as Nt } from "@janbox/storefront-ui/theme";
-import { useNode as Lt, ROOT_NODE as B, serializeNode as Et } from "@craftjs/core";
-import { throttle as St, isFunction as me, isNumber as ke } from "lodash-es";
-import Mt, { useFrame as Rt } from "react-frame-component";
-import { Layers as $t, useLayer as jt } from "@craftjs/layers";
-class At {
+import { jsx as n, Fragment as ye, jsxs as k } from "@emotion/react/jsx-runtime";
+import { Q as _e, W as re, c as P, X as we, Y as fe, x as ze, y as Ge, N as F, J as L, i as qe, P as Ue, V as Ze, S as Qe, G as Ye, f as Xe, h as Ke, F as Je, l as et, e as tt, j as rt, I as nt, L as st, s as ot, r as it, B as ct, a as at, g as lt, Z as A, _ as E, $ as Le, a0 as Ie, a1 as dt, a2 as ht, a3 as ut, a4 as wt, v as Ee, z as ft, a5 as pt, m as mt } from "./countdown-timer.node-CGKz1DZI.js";
+import { useNode as gt, ROOT_NODE as W, serializeNode as kt } from "@craftjs/core";
+import { useRef as Se, useState as O, useEffect as G, createElement as Me, Fragment as ee, Suspense as vt } from "react";
+import "flat";
+import { throttle as bt, isFunction as pe, isNumber as me } from "lodash-es";
+import "@janbox/storefront-ui";
+import { Q as ne, R as Ct, W as xt, f as Nt, H as yt, h as Lt, P as It, k as Et, i as St, G as Mt, b as Rt, e as $t, F as At, M as jt, a as Tt, g as Pt, I as Dt, L as Bt, U as Ft, T as Wt, B as Ht, A as Ot, d as Vt, X as _t, Y as zt, Z as Gt, _ as qt, $ as ge, a0 as Ut, a1 as ke, a2 as ce, a3 as Re, c as $e, C as Ae, a4 as Zt, a5 as ve } from "./index-Du5uN6Rq.js";
+import { a6 as Un } from "./index-Du5uN6Rq.js";
+import "@janbox/storefront-ui/hooks";
+import { ThemeProvider as Qt, FLOATING_Z_INDEX as Yt, breakpoint as Xt } from "@janbox/storefront-ui/theme";
+import "@janbox/storefront-ui/utils";
+import { useFloating as Kt, autoUpdate as Jt, flip as er, size as tr, useHover as rr, safePolygon as nr, useFocus as sr, useDismiss as or, useRole as ir, useInteractions as cr, FloatingPortal as je } from "@floating-ui/react";
+import "react-use";
+import "react-colorful";
+import "overlayscrollbars-react";
+import "@tanstack/react-virtual";
+import "react-dropzone";
+import "react-datepicker/dist/react-datepicker.css";
+import "react-datepicker";
+import "@tiptap/extension-text-style";
+import "@tiptap/react";
+import "@tiptap/react/menus";
+import "@tiptap/starter-kit";
+import ar, { useFrame as lr } from "react-frame-component";
+import { CacheProvider as dr, Global as hr, createElement as ur } from "@emotion/react";
+import "@hello-pangea/dnd";
+import "clsx";
+import "tailwind-merge";
+import "react-router";
+import { useToggle as Te } from "usehooks-ts";
+import { Layers as wr, useLayer as fr } from "@craftjs/layers";
+class pr {
   constructor() {
     this.componentControls = /* @__PURE__ */ new Set();
   }
@@ -45,22 +63,22 @@ class At {
     });
   }
 }
-const Dt = () => new At();
-function It() {
-  return _e(Dt);
+const mr = () => new pr();
+function gr() {
+  return _e(mr);
 }
-function Tt(e) {
+function kr(e) {
   if (e.sheet)
     return e.sheet;
   for (var t = 0; t < document.styleSheets.length; t++)
     if (document.styleSheets[t].ownerNode === e)
       return document.styleSheets[t];
 }
-function Pt(e) {
+function vr(e) {
   var t = document.createElement("style");
   return t.setAttribute("data-emotion", e.key), e.nonce !== void 0 && t.setAttribute("nonce", e.nonce), t.appendChild(document.createTextNode("")), t.setAttribute("data-s", ""), t;
 }
-var Wt = /* @__PURE__ */ (function() {
+var br = /* @__PURE__ */ (function() {
   function e(s) {
     var r = this;
     this._insertTag = function(i) {
@@ -72,10 +90,10 @@ var Wt = /* @__PURE__ */ (function() {
   return t.hydrate = function(r) {
     r.forEach(this._insertTag);
   }, t.insert = function(r) {
-    this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(Pt(this));
+    this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(vr(this));
     var i = this.tags[this.tags.length - 1];
     if (this.isSpeedy) {
-      var o = Tt(i);
+      var o = kr(i);
       try {
         o.insertRule(r, o.cssRules.length);
       } catch {
@@ -89,66 +107,66 @@ var Wt = /* @__PURE__ */ (function() {
       return (i = r.parentNode) == null ? void 0 : i.removeChild(r);
     }), this.tags = [], this.ctr = 0;
   }, e;
-})(), S = "-ms-", ee = "-moz-", u = "-webkit-", Te = "comm", le = "rule", de = "decl", Bt = "@import", Pe = "@keyframes", Ot = "@layer", Ft = Math.abs, re = String.fromCharCode, Ht = Object.assign;
-function Vt(e, t) {
-  return L(e, 0) ^ 45 ? (((t << 2 ^ L(e, 0)) << 2 ^ L(e, 1)) << 2 ^ L(e, 2)) << 2 ^ L(e, 3) : 0;
+})(), S = "-ms-", te = "-moz-", p = "-webkit-", Pe = "comm", de = "rule", he = "decl", Cr = "@import", De = "@keyframes", xr = "@layer", Nr = Math.abs, se = String.fromCharCode, yr = Object.assign;
+function Lr(e, t) {
+  return I(e, 0) ^ 45 ? (((t << 2 ^ I(e, 0)) << 2 ^ I(e, 1)) << 2 ^ I(e, 2)) << 2 ^ I(e, 3) : 0;
 }
-function We(e) {
+function Be(e) {
   return e.trim();
 }
-function _t(e, t) {
+function Ir(e, t) {
   return (e = t.exec(e)) ? e[0] : e;
 }
-function f(e, t, s) {
+function m(e, t, s) {
   return e.replace(t, s);
 }
-function ie(e, t) {
+function ae(e, t) {
   return e.indexOf(t);
 }
-function L(e, t) {
+function I(e, t) {
   return e.charCodeAt(t) | 0;
 }
 function q(e, t, s) {
   return e.slice(t, s);
 }
-function D(e) {
+function T(e) {
   return e.length;
 }
-function he(e) {
+function ue(e) {
   return e.length;
 }
-function Q(e, t) {
+function Y(e, t) {
   return t.push(e), e;
 }
-function zt(e, t) {
+function Er(e, t) {
   return e.map(t).join("");
 }
-var ne = 1, F = 1, Be = 0, R = 0, y = 0, H = "";
-function se(e, t, s, r, i, o, h) {
-  return { value: e, root: t, parent: s, type: r, props: i, children: o, line: ne, column: F, length: h, return: "" };
+var oe = 1, V = 1, Fe = 0, R = 0, N = 0, _ = "";
+function ie(e, t, s, r, i, o, h) {
+  return { value: e, root: t, parent: s, type: r, props: i, children: o, line: oe, column: V, length: h, return: "" };
 }
-function V(e, t) {
-  return Ht(se("", null, null, "", null, null, 0), e, { length: -e.length }, t);
+function z(e, t) {
+  return yr(ie("", null, null, "", null, null, 0), e, { length: -e.length }, t);
 }
-function qt() {
-  return y;
+function Sr() {
+  return N;
 }
-function Gt() {
-  return y = R > 0 ? L(H, --R) : 0, F--, y === 10 && (F = 1, ne--), y;
+function Mr() {
+  return N = R > 0 ? I(_, --R) : 0, V--, N === 10 && (V = 1, oe--), N;
 }
 function $() {
-  return y = R < Be ? L(H, R++) : 0, F++, y === 10 && (F = 1, ne++), y;
+  return N = R < Fe ? I(_, R++) : 0, V++, N === 10 && (V = 1, oe++), N;
 }
-function T() {
-  return L(H, R);
+function D() {
+  return I(_, R);
 }
-function Y() {
+function X() {
   return R;
 }
-function U(e, t) {
-  return q(H, e, t);
+function Z(e, t) {
+  return q(_, e, t);
 }
-function G(e) {
+function U(e) {
   switch (e) {
     // \0 \t \n \r \s whitespace token
     case 0:
@@ -186,39 +204,39 @@ function G(e) {
   }
   return 0;
 }
-function Oe(e) {
-  return ne = F = 1, Be = D(H = e), R = 0, [];
+function We(e) {
+  return oe = V = 1, Fe = T(_ = e), R = 0, [];
 }
-function Fe(e) {
-  return H = "", e;
+function He(e) {
+  return _ = "", e;
 }
 function K(e) {
-  return We(U(R - 1, ce(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
+  return Be(Z(R - 1, le(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
 }
-function Ut(e) {
-  for (; (y = T()) && y < 33; )
+function Rr(e) {
+  for (; (N = D()) && N < 33; )
     $();
-  return G(e) > 2 || G(y) > 3 ? "" : " ";
+  return U(e) > 2 || U(N) > 3 ? "" : " ";
 }
-function Zt(e, t) {
-  for (; --t && $() && !(y < 48 || y > 102 || y > 57 && y < 65 || y > 70 && y < 97); )
+function $r(e, t) {
+  for (; --t && $() && !(N < 48 || N > 102 || N > 57 && N < 65 || N > 70 && N < 97); )
     ;
-  return U(e, Y() + (t < 6 && T() == 32 && $() == 32));
+  return Z(e, X() + (t < 6 && D() == 32 && $() == 32));
 }
-function ce(e) {
+function le(e) {
   for (; $(); )
-    switch (y) {
+    switch (N) {
       // ] ) " '
       case e:
         return R;
       // " '
       case 34:
       case 39:
-        e !== 34 && e !== 39 && ce(y);
+        e !== 34 && e !== 39 && le(N);
         break;
       // (
       case 40:
-        e === 41 && ce(e);
+        e === 41 && le(e);
         break;
       // \
       case 92:
@@ -227,27 +245,27 @@ function ce(e) {
     }
   return R;
 }
-function Qt(e, t) {
-  for (; $() && e + y !== 57; )
-    if (e + y === 84 && T() === 47)
+function Ar(e, t) {
+  for (; $() && e + N !== 57; )
+    if (e + N === 84 && D() === 47)
       break;
-  return "/*" + U(t, R - 1) + "*" + re(e === 47 ? e : $());
+  return "/*" + Z(t, R - 1) + "*" + se(e === 47 ? e : $());
 }
-function Yt(e) {
-  for (; !G(T()); )
+function jr(e) {
+  for (; !U(D()); )
     $();
-  return U(e, R);
+  return Z(e, R);
 }
-function Kt(e) {
-  return Fe(X("", null, null, null, [""], e = Oe(e), 0, [0], e));
+function Tr(e) {
+  return He(J("", null, null, null, [""], e = We(e), 0, [0], e));
 }
-function X(e, t, s, r, i, o, h, c, d) {
-  for (var k = 0, l = 0, a = h, m = 0, b = 0, v = 0, w = 1, N = 1, p = 1, x = 0, M = "", Z = i, P = o, A = r, C = M; N; )
-    switch (v = x, x = $()) {
+function J(e, t, s, r, i, o, h, c, u) {
+  for (var b = 0, l = 0, a = h, f = 0, v = 0, w = 0, d = 1, y = 1, g = 1, x = 0, M = "", Q = i, B = o, j = r, C = M; y; )
+    switch (w = x, x = $()) {
       // (
       case 40:
-        if (v != 108 && L(C, a - 1) == 58) {
-          ie(C += f(K(x), "&", "&\f"), "&\f") != -1 && (p = -1);
+        if (w != 108 && I(C, a - 1) == 58) {
+          ae(C += m(K(x), "&", "&\f"), "&\f") != -1 && (g = -1);
           break;
         }
       // " ' [
@@ -261,179 +279,179 @@ function X(e, t, s, r, i, o, h, c, d) {
       case 10:
       case 13:
       case 32:
-        C += Ut(v);
+        C += Rr(w);
         break;
       // \
       case 92:
-        C += Zt(Y() - 1, 7);
+        C += $r(X() - 1, 7);
         continue;
       // /
       case 47:
-        switch (T()) {
+        switch (D()) {
           case 42:
           case 47:
-            Q(Xt(Qt($(), Y()), t, s), d);
+            Y(Pr(Ar($(), X()), t, s), u);
             break;
           default:
             C += "/";
         }
         break;
       // {
-      case 123 * w:
-        c[k++] = D(C) * p;
+      case 123 * d:
+        c[b++] = T(C) * g;
       // } ; \0
-      case 125 * w:
+      case 125 * d:
       case 59:
       case 0:
         switch (x) {
           // \0 }
           case 0:
           case 125:
-            N = 0;
+            y = 0;
           // ;
           case 59 + l:
-            p == -1 && (C = f(C, /\f/g, "")), b > 0 && D(C) - a && Q(b > 32 ? be(C + ";", r, s, a - 1) : be(f(C, " ", "") + ";", r, s, a - 2), d);
+            g == -1 && (C = m(C, /\f/g, "")), v > 0 && T(C) - a && Y(v > 32 ? Ce(C + ";", r, s, a - 1) : Ce(m(C, " ", "") + ";", r, s, a - 2), u);
             break;
           // @ ;
           case 59:
             C += ";";
           // { rule/at-rule
           default:
-            if (Q(A = ve(C, t, s, k, l, i, c, M, Z = [], P = [], a), o), x === 123)
+            if (Y(j = be(C, t, s, b, l, i, c, M, Q = [], B = [], a), o), x === 123)
               if (l === 0)
-                X(C, t, A, A, Z, o, a, c, P);
+                J(C, t, j, j, Q, o, a, c, B);
               else
-                switch (m === 99 && L(C, 3) === 110 ? 100 : m) {
+                switch (f === 99 && I(C, 3) === 110 ? 100 : f) {
                   // d l m s
                   case 100:
                   case 108:
                   case 109:
                   case 115:
-                    X(e, A, A, r && Q(ve(e, A, A, 0, 0, i, c, M, i, Z = [], a), P), i, P, a, c, r ? Z : P);
+                    J(e, j, j, r && Y(be(e, j, j, 0, 0, i, c, M, i, Q = [], a), B), i, B, a, c, r ? Q : B);
                     break;
                   default:
-                    X(C, A, A, A, [""], P, 0, c, P);
+                    J(C, j, j, j, [""], B, 0, c, B);
                 }
         }
-        k = l = b = 0, w = p = 1, M = C = "", a = h;
+        b = l = v = 0, d = g = 1, M = C = "", a = h;
         break;
       // :
       case 58:
-        a = 1 + D(C), b = v;
+        a = 1 + T(C), v = w;
       default:
-        if (w < 1) {
+        if (d < 1) {
           if (x == 123)
-            --w;
-          else if (x == 125 && w++ == 0 && Gt() == 125)
+            --d;
+          else if (x == 125 && d++ == 0 && Mr() == 125)
             continue;
         }
-        switch (C += re(x), x * w) {
+        switch (C += se(x), x * d) {
           // &
           case 38:
-            p = l > 0 ? 1 : (C += "\f", -1);
+            g = l > 0 ? 1 : (C += "\f", -1);
             break;
           // ,
           case 44:
-            c[k++] = (D(C) - 1) * p, p = 1;
+            c[b++] = (T(C) - 1) * g, g = 1;
             break;
           // @
           case 64:
-            T() === 45 && (C += K($())), m = T(), l = a = D(M = C += Yt(Y())), x++;
+            D() === 45 && (C += K($())), f = D(), l = a = T(M = C += jr(X())), x++;
             break;
           // -
           case 45:
-            v === 45 && D(C) == 2 && (w = 0);
+            w === 45 && T(C) == 2 && (d = 0);
         }
     }
   return o;
 }
-function ve(e, t, s, r, i, o, h, c, d, k, l) {
-  for (var a = i - 1, m = i === 0 ? o : [""], b = he(m), v = 0, w = 0, N = 0; v < r; ++v)
-    for (var p = 0, x = q(e, a + 1, a = Ft(w = h[v])), M = e; p < b; ++p)
-      (M = We(w > 0 ? m[p] + " " + x : f(x, /&\f/g, m[p]))) && (d[N++] = M);
-  return se(e, t, s, i === 0 ? le : c, d, k, l);
+function be(e, t, s, r, i, o, h, c, u, b, l) {
+  for (var a = i - 1, f = i === 0 ? o : [""], v = ue(f), w = 0, d = 0, y = 0; w < r; ++w)
+    for (var g = 0, x = q(e, a + 1, a = Nr(d = h[w])), M = e; g < v; ++g)
+      (M = Be(d > 0 ? f[g] + " " + x : m(x, /&\f/g, f[g]))) && (u[y++] = M);
+  return ie(e, t, s, i === 0 ? de : c, u, b, l);
 }
-function Xt(e, t, s) {
-  return se(e, t, s, Te, re(qt()), q(e, 2, -2), 0);
+function Pr(e, t, s) {
+  return ie(e, t, s, Pe, se(Sr()), q(e, 2, -2), 0);
 }
-function be(e, t, s, r) {
-  return se(e, t, s, de, q(e, 0, r), q(e, r + 1, -1), r);
+function Ce(e, t, s, r) {
+  return ie(e, t, s, he, q(e, 0, r), q(e, r + 1, -1), r);
 }
-function O(e, t) {
-  for (var s = "", r = he(e), i = 0; i < r; i++)
+function H(e, t) {
+  for (var s = "", r = ue(e), i = 0; i < r; i++)
     s += t(e[i], i, e, t) || "";
   return s;
 }
-function Jt(e, t, s, r) {
+function Dr(e, t, s, r) {
   switch (e.type) {
-    case Ot:
+    case xr:
       if (e.children.length) break;
-    case Bt:
-    case de:
+    case Cr:
+    case he:
       return e.return = e.return || e.value;
-    case Te:
-      return "";
     case Pe:
-      return e.return = e.value + "{" + O(e.children, r) + "}";
-    case le:
+      return "";
+    case De:
+      return e.return = e.value + "{" + H(e.children, r) + "}";
+    case de:
       e.value = e.props.join(",");
   }
-  return D(s = O(e.children, r)) ? e.return = e.value + "{" + s + "}" : "";
+  return T(s = H(e.children, r)) ? e.return = e.value + "{" + s + "}" : "";
 }
-function er(e) {
-  var t = he(e);
+function Br(e) {
+  var t = ue(e);
   return function(s, r, i, o) {
     for (var h = "", c = 0; c < t; c++)
       h += e[c](s, r, i, o) || "";
     return h;
   };
 }
-function tr(e) {
+function Fr(e) {
   return function(t) {
     t.root || (t = t.return) && e(t);
   };
 }
-var rr = function(t, s, r) {
-  for (var i = 0, o = 0; i = o, o = T(), i === 38 && o === 12 && (s[r] = 1), !G(o); )
+var Wr = function(t, s, r) {
+  for (var i = 0, o = 0; i = o, o = D(), i === 38 && o === 12 && (s[r] = 1), !U(o); )
     $();
-  return U(t, R);
-}, nr = function(t, s) {
+  return Z(t, R);
+}, Hr = function(t, s) {
   var r = -1, i = 44;
   do
-    switch (G(i)) {
+    switch (U(i)) {
       case 0:
-        i === 38 && T() === 12 && (s[r] = 1), t[r] += rr(R - 1, s, r);
+        i === 38 && D() === 12 && (s[r] = 1), t[r] += Wr(R - 1, s, r);
         break;
       case 2:
         t[r] += K(i);
         break;
       case 4:
         if (i === 44) {
-          t[++r] = T() === 58 ? "&\f" : "", s[r] = t[r].length;
+          t[++r] = D() === 58 ? "&\f" : "", s[r] = t[r].length;
           break;
         }
       // fallthrough
       default:
-        t[r] += re(i);
+        t[r] += se(i);
     }
   while (i = $());
   return t;
-}, sr = function(t, s) {
-  return Fe(nr(Oe(t), s));
-}, Ce = /* @__PURE__ */ new WeakMap(), or = function(t) {
+}, Or = function(t, s) {
+  return He(Hr(We(t), s));
+}, xe = /* @__PURE__ */ new WeakMap(), Vr = function(t) {
   if (!(t.type !== "rule" || !t.parent || // positive .length indicates that this rule contains pseudo
   // negative .length indicates that this rule has been already prefixed
   t.length < 1)) {
     for (var s = t.value, r = t.parent, i = t.column === r.column && t.line === r.line; r.type !== "rule"; )
       if (r = r.parent, !r) return;
-    if (!(t.props.length === 1 && s.charCodeAt(0) !== 58 && !Ce.get(r)) && !i) {
-      Ce.set(t, !0);
-      for (var o = [], h = sr(s, o), c = r.props, d = 0, k = 0; d < h.length; d++)
-        for (var l = 0; l < c.length; l++, k++)
-          t.props[k] = o[d] ? h[d].replace(/&\f/g, c[l]) : c[l] + " " + h[d];
+    if (!(t.props.length === 1 && s.charCodeAt(0) !== 58 && !xe.get(r)) && !i) {
+      xe.set(t, !0);
+      for (var o = [], h = Or(s, o), c = r.props, u = 0, b = 0; u < h.length; u++)
+        for (var l = 0; l < c.length; l++, b++)
+          t.props[b] = o[u] ? h[u].replace(/&\f/g, c[l]) : c[l] + " " + h[u];
     }
   }
-}, ir = function(t) {
+}, _r = function(t) {
   if (t.type === "decl") {
     var s = t.value;
     // charcode for l
@@ -441,11 +459,11 @@ var rr = function(t, s, r) {
     s.charCodeAt(2) === 98 && (t.return = "", t.value = "");
   }
 };
-function He(e, t) {
-  switch (Vt(e, t)) {
+function Oe(e, t) {
+  switch (Lr(e, t)) {
     // color-adjust
     case 5103:
-      return u + "print-" + e + e;
+      return p + "print-" + e + e;
     // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
     case 5737:
     case 4201:
@@ -475,58 +493,58 @@ function He(e, t) {
     case 5365:
     case 5621:
     case 3829:
-      return u + e + e;
+      return p + e + e;
     // appearance, user-select, transform, hyphens, text-size-adjust
     case 5349:
     case 4246:
     case 4810:
     case 6968:
     case 2756:
-      return u + e + ee + e + S + e + e;
+      return p + e + te + e + S + e + e;
     // flex, flex-direction
     case 6828:
     case 4268:
-      return u + e + S + e + e;
+      return p + e + S + e + e;
     // order
     case 6165:
-      return u + e + S + "flex-" + e + e;
+      return p + e + S + "flex-" + e + e;
     // align-items
     case 5187:
-      return u + e + f(e, /(\w+).+(:[^]+)/, u + "box-$1$2" + S + "flex-$1$2") + e;
+      return p + e + m(e, /(\w+).+(:[^]+)/, p + "box-$1$2" + S + "flex-$1$2") + e;
     // align-self
     case 5443:
-      return u + e + S + "flex-item-" + f(e, /flex-|-self/, "") + e;
+      return p + e + S + "flex-item-" + m(e, /flex-|-self/, "") + e;
     // align-content
     case 4675:
-      return u + e + S + "flex-line-pack" + f(e, /align-content|flex-|-self/, "") + e;
+      return p + e + S + "flex-line-pack" + m(e, /align-content|flex-|-self/, "") + e;
     // flex-shrink
     case 5548:
-      return u + e + S + f(e, "shrink", "negative") + e;
+      return p + e + S + m(e, "shrink", "negative") + e;
     // flex-basis
     case 5292:
-      return u + e + S + f(e, "basis", "preferred-size") + e;
+      return p + e + S + m(e, "basis", "preferred-size") + e;
     // flex-grow
     case 6060:
-      return u + "box-" + f(e, "-grow", "") + u + e + S + f(e, "grow", "positive") + e;
+      return p + "box-" + m(e, "-grow", "") + p + e + S + m(e, "grow", "positive") + e;
     // transition
     case 4554:
-      return u + f(e, /([^-])(transform)/g, "$1" + u + "$2") + e;
+      return p + m(e, /([^-])(transform)/g, "$1" + p + "$2") + e;
     // cursor
     case 6187:
-      return f(f(f(e, /(zoom-|grab)/, u + "$1"), /(image-set)/, u + "$1"), e, "") + e;
+      return m(m(m(e, /(zoom-|grab)/, p + "$1"), /(image-set)/, p + "$1"), e, "") + e;
     // background, background-image
     case 5495:
     case 3959:
-      return f(e, /(image-set\([^]*)/, u + "$1$`$1");
+      return m(e, /(image-set\([^]*)/, p + "$1$`$1");
     // justify-content
     case 4968:
-      return f(f(e, /(.+:)(flex-)?(.*)/, u + "box-pack:$3" + S + "flex-pack:$3"), /s.+-b[^;]+/, "justify") + u + e + e;
+      return m(m(e, /(.+:)(flex-)?(.*)/, p + "box-pack:$3" + S + "flex-pack:$3"), /s.+-b[^;]+/, "justify") + p + e + e;
     // (margin|padding)-inline-(start|end)
     case 4095:
     case 3583:
     case 4068:
     case 2532:
-      return f(e, /(.+)-inline(.+)/, u + "$1$2") + e;
+      return m(e, /(.+)-inline(.+)/, p + "$1$2") + e;
     // (min|max)?(width|height|inline-size|block-size)
     case 8116:
     case 7059:
@@ -540,114 +558,114 @@ function He(e, t) {
     case 5789:
     case 5021:
     case 4765:
-      if (D(e) - 1 - t > 6) switch (L(e, t + 1)) {
+      if (T(e) - 1 - t > 6) switch (I(e, t + 1)) {
         // (m)ax-content, (m)in-content
         case 109:
-          if (L(e, t + 4) !== 45) break;
+          if (I(e, t + 4) !== 45) break;
         // (f)ill-available, (f)it-content
         case 102:
-          return f(e, /(.+:)(.+)-([^]+)/, "$1" + u + "$2-$3$1" + ee + (L(e, t + 3) == 108 ? "$3" : "$2-$3")) + e;
+          return m(e, /(.+:)(.+)-([^]+)/, "$1" + p + "$2-$3$1" + te + (I(e, t + 3) == 108 ? "$3" : "$2-$3")) + e;
         // (s)tretch
         case 115:
-          return ~ie(e, "stretch") ? He(f(e, "stretch", "fill-available"), t) + e : e;
+          return ~ae(e, "stretch") ? Oe(m(e, "stretch", "fill-available"), t) + e : e;
       }
       break;
     // position: sticky
     case 4949:
-      if (L(e, t + 1) !== 115) break;
+      if (I(e, t + 1) !== 115) break;
     // display: (flex|inline-flex)
     case 6444:
-      switch (L(e, D(e) - 3 - (~ie(e, "!important") && 10))) {
+      switch (I(e, T(e) - 3 - (~ae(e, "!important") && 10))) {
         // stic(k)y
         case 107:
-          return f(e, ":", ":" + u) + e;
+          return m(e, ":", ":" + p) + e;
         // (inline-)?fl(e)x
         case 101:
-          return f(e, /(.+:)([^;!]+)(;|!.+)?/, "$1" + u + (L(e, 14) === 45 ? "inline-" : "") + "box$3$1" + u + "$2$3$1" + S + "$2box$3") + e;
+          return m(e, /(.+:)([^;!]+)(;|!.+)?/, "$1" + p + (I(e, 14) === 45 ? "inline-" : "") + "box$3$1" + p + "$2$3$1" + S + "$2box$3") + e;
       }
       break;
     // writing-mode
     case 5936:
-      switch (L(e, t + 11)) {
+      switch (I(e, t + 11)) {
         // vertical-l(r)
         case 114:
-          return u + e + S + f(e, /[svh]\w+-[tblr]{2}/, "tb") + e;
+          return p + e + S + m(e, /[svh]\w+-[tblr]{2}/, "tb") + e;
         // vertical-r(l)
         case 108:
-          return u + e + S + f(e, /[svh]\w+-[tblr]{2}/, "tb-rl") + e;
+          return p + e + S + m(e, /[svh]\w+-[tblr]{2}/, "tb-rl") + e;
         // horizontal(-)tb
         case 45:
-          return u + e + S + f(e, /[svh]\w+-[tblr]{2}/, "lr") + e;
+          return p + e + S + m(e, /[svh]\w+-[tblr]{2}/, "lr") + e;
       }
-      return u + e + S + e + e;
+      return p + e + S + e + e;
   }
   return e;
 }
-var cr = function(t, s, r, i) {
+var zr = function(t, s, r, i) {
   if (t.length > -1 && !t.return) switch (t.type) {
-    case de:
-      t.return = He(t.value, t.length);
+    case he:
+      t.return = Oe(t.value, t.length);
       break;
-    case Pe:
-      return O([V(t, {
-        value: f(t.value, "@", "@" + u)
+    case De:
+      return H([z(t, {
+        value: m(t.value, "@", "@" + p)
       })], i);
-    case le:
-      if (t.length) return zt(t.props, function(o) {
-        switch (_t(o, /(::plac\w+|:read-\w+)/)) {
+    case de:
+      if (t.length) return Er(t.props, function(o) {
+        switch (Ir(o, /(::plac\w+|:read-\w+)/)) {
           // :read-(only|write)
           case ":read-only":
           case ":read-write":
-            return O([V(t, {
-              props: [f(o, /:(read-\w+)/, ":" + ee + "$1")]
+            return H([z(t, {
+              props: [m(o, /:(read-\w+)/, ":" + te + "$1")]
             })], i);
           // :placeholder
           case "::placeholder":
-            return O([V(t, {
-              props: [f(o, /:(plac\w+)/, ":" + u + "input-$1")]
-            }), V(t, {
-              props: [f(o, /:(plac\w+)/, ":" + ee + "$1")]
-            }), V(t, {
-              props: [f(o, /:(plac\w+)/, S + "input-$1")]
+            return H([z(t, {
+              props: [m(o, /:(plac\w+)/, ":" + p + "input-$1")]
+            }), z(t, {
+              props: [m(o, /:(plac\w+)/, ":" + te + "$1")]
+            }), z(t, {
+              props: [m(o, /:(plac\w+)/, S + "input-$1")]
             })], i);
         }
         return "";
       });
   }
-}, ar = [cr], lr = function(t) {
+}, Gr = [zr], qr = function(t) {
   var s = t.key;
   if (s === "css") {
     var r = document.querySelectorAll("style[data-emotion]:not([data-s])");
-    Array.prototype.forEach.call(r, function(w) {
-      var N = w.getAttribute("data-emotion");
-      N.indexOf(" ") !== -1 && (document.head.appendChild(w), w.setAttribute("data-s", ""));
+    Array.prototype.forEach.call(r, function(d) {
+      var y = d.getAttribute("data-emotion");
+      y.indexOf(" ") !== -1 && (document.head.appendChild(d), d.setAttribute("data-s", ""));
     });
   }
-  var i = t.stylisPlugins || ar, o = {}, h, c = [];
+  var i = t.stylisPlugins || Gr, o = {}, h, c = [];
   h = t.container || document.head, Array.prototype.forEach.call(
     // this means we will ignore elements which don't have a space in them which
     // means that the style elements we're looking at are only Emotion 11 server-rendered style elements
     document.querySelectorAll('style[data-emotion^="' + s + ' "]'),
-    function(w) {
-      for (var N = w.getAttribute("data-emotion").split(" "), p = 1; p < N.length; p++)
-        o[N[p]] = !0;
-      c.push(w);
+    function(d) {
+      for (var y = d.getAttribute("data-emotion").split(" "), g = 1; g < y.length; g++)
+        o[y[g]] = !0;
+      c.push(d);
     }
   );
-  var d, k = [or, ir];
+  var u, b = [Vr, _r];
   {
-    var l, a = [Jt, tr(function(w) {
-      l.insert(w);
-    })], m = er(k.concat(i, a)), b = function(N) {
-      return O(Kt(N), m);
+    var l, a = [Dr, Fr(function(d) {
+      l.insert(d);
+    })], f = Br(b.concat(i, a)), v = function(y) {
+      return H(Tr(y), f);
     };
-    d = function(N, p, x, M) {
-      l = x, b(N ? N + "{" + p.styles + "}" : p.styles), M && (v.inserted[p.name] = !0);
+    u = function(y, g, x, M) {
+      l = x, v(y ? y + "{" + g.styles + "}" : g.styles), M && (w.inserted[g.name] = !0);
     };
   }
-  var v = {
+  var w = {
     key: s,
-    sheet: new Wt({
+    sheet: new br({
       key: s,
       container: h,
       nonce: t.nonce,
@@ -658,68 +676,68 @@ var cr = function(t, s, r, i) {
     nonce: t.nonce,
     inserted: o,
     registered: {},
-    insert: d
+    insert: u
   };
-  return v.sheet.hydrate(c), v;
+  return w.sheet.hydrate(c), w;
 };
 const Ve = ({ children: e, viewport: t, containerProps: s }) => {
-  const r = je(null), [{ theme: i }] = ae(), [o, h] = _({
+  const r = Se(null), { theme: i } = re(), [o, h] = O({
     width: 0,
     height: 0
   });
-  z(() => {
-    const v = St((N) => {
-      const p = N.at(0)?.target;
-      if (!p) return;
-      const { width: x, height: M } = p.getBoundingClientRect();
+  G(() => {
+    const w = bt((y) => {
+      const g = y.at(0)?.target;
+      if (!g) return;
+      const { width: x, height: M } = g.getBoundingClientRect();
       h(() => ({
         width: x,
         height: M
       }));
-    }, 200), w = new ResizeObserver(v);
-    return r.current && w.observe(r.current), () => w.disconnect();
+    }, 200), d = new ResizeObserver(w);
+    return r.current && d.observe(r.current), () => d.disconnect();
   }, []);
-  const c = me(t?.width) ? t.width(o.width) : t?.width, d = me(t?.height) ? t.height(o.height) : t?.height, k = ke(c) ? o.width / c : 1, l = ke(d) ? o.height / d : 1, a = Math.min(k, l, 1), m = (d ?? o.height / a) || 0, b = (c ?? o.width / a) || 0;
-  return /* @__PURE__ */ n("div", { ...s, className: I("tw:w-full tw:h-full tw:p-2 tw:bg-ic-ink-1s", s?.className), children: /* @__PURE__ */ n("div", { className: I("tw:w-full tw:h-full tw:overflow-hidden tw:relative"), ref: r, children: /* @__PURE__ */ n(
+  const c = pe(t?.width) ? t.width(o.width) : t?.width, u = pe(t?.height) ? t.height(o.height) : t?.height, b = me(c) ? o.width / c : 1, l = me(u) ? o.height / u : 1, a = Math.min(b, l, 1), f = (u ?? o.height / a) || 0, v = (c ?? o.width / a) || 0;
+  return /* @__PURE__ */ n("div", { ...s, className: P("tw:w-full tw:h-full tw:p-2 tw:bg-ic-ink-1s", s?.className), children: /* @__PURE__ */ n("div", { className: P("tw:w-full tw:h-full tw:overflow-hidden tw:relative"), ref: r, children: /* @__PURE__ */ n(
     "div",
     {
       style: {
         transform: `scale(${a})`,
-        width: b,
-        height: m,
-        marginLeft: (o.width - b) / 2,
-        marginTop: (o.height - m) / 2
+        width: v,
+        height: f,
+        marginLeft: (o.width - v) / 2,
+        marginTop: (o.height - f) / 2
       },
       className: "tw:absolute",
       children: /* @__PURE__ */ n(
-        Mt,
+        ar,
         {
           sandbox: "allow-same-origin allow-scripts allow-popups allow-presentation",
           allow: "autoplay; encrypted-media",
           width: c ?? "100%",
-          height: d ?? "100%",
-          children: /* @__PURE__ */ n(dr, { theme: i, children: e })
+          height: u ?? "100%",
+          children: /* @__PURE__ */ n(Ur, { theme: i, children: e })
         }
       )
     }
   ) }) });
-}, dr = ({ children: e, theme: t }) => {
-  const { document: s, window: r } = Rt(), [i, o] = _(!1), h = je(window.customElements.define.bind(window.customElements));
-  z(() => {
-    const d = h.current;
-    return r && (window.customElements.define = function(k, l, a) {
-      window.customElements.get(k) || r.customElements.define(k, l, a), d(k, l, a);
+}, Ur = ({ children: e, theme: t }) => {
+  const { document: s, window: r } = lr(), [i, o] = O(!1), h = Se(window.customElements.define.bind(window.customElements));
+  G(() => {
+    const u = h.current;
+    return r && (window.customElements.define = function(b, l, a) {
+      window.customElements.get(b) || r.customElements.define(b, l, a), u(b, l, a);
     }), s?.head.replaceWith(document.head.cloneNode(!0)), o(!0), () => {
-      window.customElements.define = d;
+      window.customElements.define = u;
     };
   }, [s, r]);
-  const c = lr({
+  const c = qr({
     key: "css",
     container: s?.head
   });
-  return i ? /* @__PURE__ */ n(Ne, { children: /* @__PURE__ */ g(lt, { value: c, children: [
+  return i ? /* @__PURE__ */ n(ye, { children: /* @__PURE__ */ k(dr, { value: c, children: [
     /* @__PURE__ */ n(
-      dt,
+      hr,
       {
         styles: {
           ".frame-content": {
@@ -728,41 +746,60 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
             minHeight: "100vh",
             justifyContent: "center"
           },
-          [`& *[${pe.DATA_NODE_DROP_TARGET}=${ge.True}]`]: {
+          [`& *[${we.DATA_NODE_DROP_TARGET}=${fe.True}]`]: {
             outlineWidth: 1,
             outlineStyle: "solid",
             outlineOffset: -1,
             outlineColor: "green"
           },
-          [`& *[${pe.DATA_NODE_DROP_TARGET_ERROR}=${ge.True}]`]: {
+          [`& *[${we.DATA_NODE_DROP_TARGET_ERROR}=${fe.True}]`]: {
             outlineColor: "red"
           }
         }
       }
     ),
-    /* @__PURE__ */ n(xt, { theme: t, children: e })
+    /* @__PURE__ */ n(Qt, { theme: t, children: e })
   ] }) }) : null;
-}, hr = ({ render: e }) => {
-  const { id: t, renderer: s } = Lt((o) => ({
-    resolvedId: st(o),
-    renderer: nt(o).renderer
+}, Zr = ({ render: e }) => {
+  const { id: t, renderer: s } = gt((o) => ({
+    resolvedId: Ge(o),
+    renderer: ze(o).renderer
   })), {
     queryParams: { mode: r }
-  } = te(), { isActive: i } = W((o, h) => ({
-    isActive: h.getEvent("selected").contains(t) && t !== B
+  } = ne(), { isActive: i } = F((o, h) => ({
+    isActive: h.getEvent("selected").contains(t) && t !== W
   }));
-  return s ? Ae(s, { render: e }) : /* @__PURE__ */ g(J, { children: [
-    i && r === "full" && /* @__PURE__ */ g(J, { children: [
-      /* @__PURE__ */ n(ze, {}),
-      /* @__PURE__ */ n(qe, {})
+  return s ? Me(s, { render: e }) : /* @__PURE__ */ k(ee, { children: [
+    i && r === "full" && /* @__PURE__ */ k(ee, { children: [
+      /* @__PURE__ */ n(Ct, {}),
+      /* @__PURE__ */ n(xt, {})
     ] }),
     e
   ] });
-}, xe = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+};
+L(qe, { inspector: yt, renderer: Nt });
+L(Ue, { inspector: It, renderer: Lt });
+L(Ze, { inspector: Et });
+L(Qe, { inspector: St });
+L(Ye, { inspector: Mt });
+L(Xe, { inspector: Rt });
+L(Ke, { inspector: $t });
+L(Je, { inspector: At });
+L(et, { inspector: jt });
+L(tt, { inspector: Tt });
+L(rt, { inspector: Pt });
+L(nt, { inspector: Dt });
+L(st, { inspector: Bt });
+L(ot, { inspector: Ft });
+L(it, { inspector: Wt });
+L(ct, { inspector: Ht });
+L(at, { inspector: Ot });
+L(lt, { inspector: Vt });
+const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M8 5L5 8L8 11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M5 8H14C17.314 8 20 10.462 20 13.5V13.5C20 16.538 17.314 19 14 19H6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, wr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, Qr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M12 19.0004C11.158 19.0004 10.315 18.8224 9.496 18.5054" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M20.882 12.4678C18.99 15.9668 15.495 18.9998 12 18.9998" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M19.079 8.9209C19.77 9.7299 20.384 10.6119 20.882 11.5329C21.039 11.8239 21.039 12.1769 20.882 12.4679" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
@@ -770,133 +807,138 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
 <path d="M9.77299 14.2271C8.54299 12.9971 8.54299 11.0021 9.77299 9.77211C11.003 8.54211 12.998 8.54211 14.228 9.77211" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M17.044 6.956C15.497 5.759 13.748 5 12 5C8.50499 5 5.00999 8.033 3.11799 11.533C2.96099 11.824 2.96099 12.177 3.11799 12.468C4.06399 14.217 5.40999 15.849 6.95599 17.045" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, ur = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, Yr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M3.11799 12.467C2.96099 12.176 2.96099 11.823 3.11799 11.532C5.00999 8.033 8.50499 5 12 5C15.495 5 18.99 8.033 20.882 11.533C21.039 11.824 21.039 12.177 20.882 12.468C18.99 15.967 15.495 19 12 19C8.50499 19 5.00999 15.967 3.11799 12.467Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M14.1213 9.87868C15.2929 11.0502 15.2929 12.9497 14.1213 14.1213C12.9497 15.2929 11.0502 15.2929 9.87866 14.1213C8.70709 12.9497 8.70709 11.0502 9.87866 9.87868C11.0502 8.70711 12.9497 8.70711 14.1213 9.87868" stroke="currentColor" stroke-width="1.4286" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, fr = '<svg width="20" height="20" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg" class=""><path d="M9.75 3C8.50736 3 7.5 4.00736 7.5 5.25C7.5 5.66421 7.83579 6 8.25 6C8.66421 6 9 5.66421 9 5.25C9 4.83579 9.33579 4.5 9.75 4.5H13.75C14.1642 4.5 14.5 4.83579 14.5 5.25V14.75C14.5 15.1642 14.1642 15.5 13.75 15.5H9.75C9.33579 15.5 9 15.1642 9 14.75C9 14.3358 8.66421 14 8.25 14C7.83579 14 7.5 14.3358 7.5 14.75C7.5 15.9926 8.50736 17 9.75 17H13.75C14.9926 17 16 15.9926 16 14.75V5.25C16 4.00736 14.9926 3 13.75 3H9.75Z" fill="currentColor"></path><path d="M12.25 10.75C12.6642 10.75 13 10.4142 13 10C13 9.58579 12.6642 9.25 12.25 9.25L6.56066 9.25L7.53033 8.28033C7.82322 7.98744 7.82322 7.51256 7.53033 7.21967C7.23744 6.92678 6.76256 6.92678 6.46967 7.21967L4.21967 9.46967C4.07902 9.61032 4 9.80109 4 10C4 10.1989 4.07902 10.3897 4.21967 10.5303L6.46967 12.7803C6.76256 13.0732 7.23744 13.0732 7.53033 12.7803C7.82322 12.4874 7.82322 12.0126 7.53033 11.7197L6.56066 10.75H12.25Z" fill="currentColor"></path></svg>', ye = rt(), pr = () => {
+`, Xr = '<svg width="20" height="20" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg" class=""><path d="M9.75 3C8.50736 3 7.5 4.00736 7.5 5.25C7.5 5.66421 7.83579 6 8.25 6C8.66421 6 9 5.66421 9 5.25C9 4.83579 9.33579 4.5 9.75 4.5H13.75C14.1642 4.5 14.5 4.83579 14.5 5.25V14.75C14.5 15.1642 14.1642 15.5 13.75 15.5H9.75C9.33579 15.5 9 15.1642 9 14.75C9 14.3358 8.66421 14 8.25 14C7.83579 14 7.5 14.3358 7.5 14.75C7.5 15.9926 8.50736 17 9.75 17H13.75C14.9926 17 16 15.9926 16 14.75V5.25C16 4.00736 14.9926 3 13.75 3H9.75Z" fill="currentColor"></path><path d="M12.25 10.75C12.6642 10.75 13 10.4142 13 10C13 9.58579 12.6642 9.25 12.25 9.25L6.56066 9.25L7.53033 8.28033C7.82322 7.98744 7.82322 7.51256 7.53033 7.21967C7.23744 6.92678 6.76256 6.92678 6.46967 7.21967L4.21967 9.46967C4.07902 9.61032 4 9.80109 4 10C4 10.1989 4.07902 10.3897 4.21967 10.5303L6.46967 12.7803C6.76256 13.0732 7.23744 13.0732 7.53033 12.7803C7.82322 12.4874 7.82322 12.0126 7.53033 11.7197L6.56066 10.75H12.25Z" fill="currentColor"></path></svg>', Kr = () => {
   const {
     queryParams: { mode: e, screen: t },
     setQueryParams: s
-  } = te(), { actions: r, canRedo: i, canUndo: o } = W((l, a) => ({
-    enabled: l.options.enabled,
-    canUndo: a.history.canUndo(),
-    canRedo: a.history.canRedo()
-  })), h = (l) => {
+  } = ne(), [r, i] = O(!1), { handlers: o } = re(), { actions: h, canRedo: c, canUndo: u, query: b } = F((w, d) => ({
+    enabled: w.options.enabled,
+    canUndo: d.history.canUndo(),
+    canRedo: d.history.canRedo()
+  })), l = (w) => {
     s({
-      screen: l
+      screen: w
     });
-  }, c = () => {
+  }, a = () => {
     s({ mode: e === "full" ? "compact" : "full" });
-  }, d = () => {
-    ye.emit("close");
-  }, k = () => {
-    r.selectNode(), ye.emit("submit");
+  }, f = () => {
+    o.close();
+  }, v = async () => {
+    try {
+      return h.selectNode(), o.submit(b.getSerializedNodes());
+    } catch {
+    } finally {
+      i(!1);
+    }
   };
-  return /* @__PURE__ */ g(
+  return /* @__PURE__ */ k(
     "div",
     {
-      className: I(
+      className: P(
         "tw:flex tw:items-center tw:gap-4 tw:p-2 tw:justify-between tw:bg-ic-ink-6s tw:text-ic-white-6s tw:text-sm"
       ),
       children: [
-        /* @__PURE__ */ g("div", { className: "tw:flex tw:items-center tw:gap-3", children: [
-          /* @__PURE__ */ n(j, { size: "32", onClick: d, children: /* @__PURE__ */ n(E, { source: fr }) }),
-          /* @__PURE__ */ n(Ge, { onSelectionChange: h, value: t, children: Ue.map(({ icon: l, size: a }) => /* @__PURE__ */ n(j, { value: a, children: /* @__PURE__ */ n(E, { source: l }) }, a)) }),
-          /* @__PURE__ */ g("div", { className: "tw:p-1 tw:flex tw:items-center tw:gap-2 tw:bg-ic-white-1s tw:rounded-lg", children: [
-            /* @__PURE__ */ n(j, { onClick: r.history.undo, disabled: !o, children: /* @__PURE__ */ n(E, { source: xe }) }),
-            /* @__PURE__ */ n(j, { onClick: r.history.redo, disabled: !i, children: /* @__PURE__ */ n(E, { source: xe, className: "tw:rotate-180" }) })
+        /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:gap-3", children: [
+          /* @__PURE__ */ n(A, { size: "32", onClick: f, children: /* @__PURE__ */ n(E, { source: Xr }) }),
+          /* @__PURE__ */ n(_t, { onSelectionChange: l, value: t, children: zt.map(({ icon: w, size: d }) => /* @__PURE__ */ n(A, { value: d, children: /* @__PURE__ */ n(E, { source: w }) }, d)) }),
+          /* @__PURE__ */ k("div", { className: "tw:p-1 tw:flex tw:items-center tw:gap-2 tw:bg-ic-white-1s tw:rounded-lg", children: [
+            /* @__PURE__ */ n(A, { onClick: h.history.undo, disabled: !u, children: /* @__PURE__ */ n(E, { source: Ne }) }),
+            /* @__PURE__ */ n(A, { onClick: h.history.redo, disabled: !c, children: /* @__PURE__ */ n(E, { source: Ne, className: "tw:rotate-180" }) })
           ] }),
-          /* @__PURE__ */ n("div", { className: "tw:p-1 tw:flex tw:items-center tw:gap-2 tw:bg-ic-white-1s tw:rounded-lg", children: /* @__PURE__ */ n(j, { onClick: c, children: /* @__PURE__ */ n(E, { source: e === "full" ? ur : wr }) }) })
+          /* @__PURE__ */ n("div", { className: "tw:p-1 tw:flex tw:items-center tw:gap-2 tw:bg-ic-white-1s tw:rounded-lg", children: /* @__PURE__ */ n(A, { onClick: a, children: /* @__PURE__ */ n(E, { source: e === "full" ? Yr : Qr }) }) })
         ] }),
-        /* @__PURE__ */ n("div", { className: "tw:flex tw:items-center tw:gap-3", children: /* @__PURE__ */ n(Le, { onClick: k, children: "Save" }) })
+        /* @__PURE__ */ n("div", { className: "tw:flex tw:items-center tw:gap-3", children: /* @__PURE__ */ n(Le, { isLoading: r, onClick: v, children: "Save" }) })
       ]
     }
   );
-}, gr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+}, Jr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M20 19.9997L16.3763 16.376" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M4 11.25C4 15.2541 7.24594 18.5 11.25 18.5C15.2541 18.5 18.5 15.2541 18.5 11.25C18.5 7.24594 15.2541 4 11.25 4V4C7.24606 4.00029 4.00029 7.24606 4 11.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, mr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, en = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M15 6L9 12L15 18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, kr = ({ elements: e, sections: t }) => /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:h-full", children: [
-  /* @__PURE__ */ n("div", { className: "tw:flex tw:items-center tw:p-2 tw:gap-3", children: /* @__PURE__ */ n(Ee, { fullWidth: !0, placeholder: "Search...", prefix: /* @__PURE__ */ n(E, { source: gr }) }) }),
-  /* @__PURE__ */ g(Ze, { defaultIndex: 1, className: "tw:flex-1 tw:overflow-hidden tw:border-t tw:border-ic-white-1s", children: [
-    /* @__PURE__ */ g(Qe, { children: [
-      /* @__PURE__ */ n(we, { className: "tw:flex-1", children: "Sections" }),
-      /* @__PURE__ */ n(we, { className: "tw:flex-1", children: "Elements" })
+`, tn = ({ elements: e, sections: t }) => /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:h-full", children: [
+  /* @__PURE__ */ n("div", { className: "tw:flex tw:items-center tw:p-2 tw:gap-3", children: /* @__PURE__ */ n(Ie, { fullWidth: !0, placeholder: "Search...", prefix: /* @__PURE__ */ n(E, { source: Jr }) }) }),
+  /* @__PURE__ */ k(Gt, { defaultIndex: 1, className: "tw:flex-1 tw:overflow-hidden tw:border-t tw:border-ic-white-1s", children: [
+    /* @__PURE__ */ k(qt, { children: [
+      /* @__PURE__ */ n(ge, { className: "tw:flex-1", children: "Sections" }),
+      /* @__PURE__ */ n(ge, { className: "tw:flex-1", children: "Elements" })
     ] }),
-    /* @__PURE__ */ g(Ye, { className: "tw:flex-1 tw:overflow-hidden", children: [
-      /* @__PURE__ */ n(ue, { children: /* @__PURE__ */ n(oe, { className: "tw:h-full tw:py-2", children: t?.map((s, r) => /* @__PURE__ */ n(br, { group: s }, r)) }) }),
-      /* @__PURE__ */ n(ue, { className: "tw:h-full tw:overflow-hidden", children: /* @__PURE__ */ n(oe, { className: "tw:h-full tw:py-2", children: e?.map((s, r) => /* @__PURE__ */ n(vr, { group: s }, r)) }) })
+    /* @__PURE__ */ k(Ut, { className: "tw:flex-1 tw:overflow-hidden", children: [
+      /* @__PURE__ */ n(ke, { children: /* @__PURE__ */ n(ce, { className: "tw:h-full tw:py-2", children: t?.map((s, r) => /* @__PURE__ */ n(nn, { group: s }, r)) }) }),
+      /* @__PURE__ */ n(ke, { className: "tw:h-full tw:overflow-hidden", children: /* @__PURE__ */ n(ce, { className: "tw:h-full tw:py-2", children: e?.map((s, r) => /* @__PURE__ */ n(rn, { group: s }, r)) }) })
     ] })
   ] })
-] }), vr = ({ group: e }) => {
-  const [t, s] = De(!0), { actions: r, connectors: i } = W();
-  return /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:text-sm", children: [
-    /* @__PURE__ */ n(Le, { onClick: s, className: "tw:bg-transparent", children: /* @__PURE__ */ g("div", { className: "tw:flex tw:items-center tw:justify-between tw:flex-1 tw:text-sm", children: [
+] }), rn = ({ group: e }) => {
+  const [t, s] = Te(!0), { actions: r, connectors: i } = F();
+  return /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:text-sm", children: [
+    /* @__PURE__ */ n(Le, { onClick: s, className: "tw:bg-transparent", children: /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:justify-between tw:flex-1 tw:text-sm", children: [
       e.name,
       /* @__PURE__ */ n(
         E,
         {
-          source: Se,
-          className: I("tw:transition-transform", {
+          source: Re,
+          className: P("tw:transition-transform", {
             "tw:rotate-180": !t
           })
         }
       )
     ] }) }),
-    /* @__PURE__ */ n(Ke, { open: t, children: /* @__PURE__ */ n("div", { className: "tw:px-4 tw:py-2 tw:grid tw:grid-cols-2 tw:gap-4", children: e.elements.map((o, h) => /* @__PURE__ */ g("div", { className: "tw:space-y-1", children: [
+    /* @__PURE__ */ n(dt, { open: t, children: /* @__PURE__ */ n("div", { className: "tw:px-4 tw:py-2 tw:grid tw:grid-cols-2 tw:gap-4", children: e.elements.map((o, h) => /* @__PURE__ */ k("div", { className: "tw:space-y-1", children: [
       /* @__PURE__ */ n(
         "div",
         {
-          className: I(
+          className: P(
             "tw:bg-ic-ink-6s tw:relative tw:transition-transform tw:rounded-lg tw:hover:scale-105 tw:pointer-events-auto tw:aspect-video tw:overflow-hidden",
             "tw:cursor-grabbing tw:flex tw:flex-col tw:gap-1 tw:items-center tw:justify-center tw:p-1 tw:opacity-100 tw:text-ic-white-5s",
             "tw:after:absolute tw:after:inset-0 tw:after:content-empty tw:after:bg-ic-white-1s"
           ),
           ref: (c) => {
             c && i.create(c, o.template, {
-              onCreate(d) {
-                (typeof o.autoFocus == "function" ? o.autoFocus(d) : o.autoFocus) && r.selectNode(d.rootNodeId), o.onCreate?.(d);
+              onCreate(u) {
+                (typeof o.autoFocus == "function" ? o.autoFocus(u) : o.autoFocus) && r.selectNode(u.rootNodeId), o.onCreate?.(u);
               }
             });
           },
-          children: /* @__PURE__ */ n(ot, { width: void 0, height: void 0, ...o.icon })
+          children: /* @__PURE__ */ n(ht, { width: void 0, height: void 0, ...o.icon })
         }
       ),
       /* @__PURE__ */ n("p", { className: "tw:text-xs tw:mx-auto tw:text-center", children: o.name })
     ] }, h)) }) })
   ] });
-}, br = ({ group: e }) => {
-  const [t, s] = _(!1), { refs: r, floatingStyles: i, context: o } = wt({
+}, nn = ({ group: e }) => {
+  const [t, s] = O(!1), { refs: r, floatingStyles: i, context: o } = Kt({
     open: t,
     onOpenChange: s,
     placement: "right-start",
     middleware: [
-      ft(),
-      pt({
-        apply({ elements: m }) {
-          const b = {
-            zIndex: `${yt}`,
-            height: `${m.reference.getBoundingClientRect().height}px`
+      er(),
+      tr({
+        apply({ elements: f }) {
+          const v = {
+            zIndex: `${Yt}`,
+            height: `${f.reference.getBoundingClientRect().height}px`
           };
-          Object.assign(m.floating.style, b);
+          Object.assign(f.floating.style, v);
         }
       })
     ],
-    whileElementsMounted: ut
+    whileElementsMounted: Jt
   });
-  z(() => {
+  G(() => {
     r.setPositionReference(document.querySelector("aside"));
   }, [r]);
-  const h = gt(o, { move: !1, handleClose: mt() }), c = kt(o), d = vt(o), k = bt(o), { getReferenceProps: l, getFloatingProps: a } = Ct([h, c, d, k]);
-  return /* @__PURE__ */ g(J, { children: [
-    /* @__PURE__ */ g(
+  const h = rr(o, { move: !1, handleClose: nr() }), c = sr(o), u = or(o), b = ir(o), { getReferenceProps: l, getFloatingProps: a } = cr([h, c, u, b]);
+  return /* @__PURE__ */ k(ee, { children: [
+    /* @__PURE__ */ k(
       "button",
       {
-        className: I(
+        className: P(
           "tw:w-full tw:text-left tw:flex tw:items-center tw:text-ic-white-5s tw:gap-2 tw:p-2 tw:rounded-lg",
           "tw:hover:text-ic-white-6s tw:hover:bg-ic-white-1s tw:hover:font-medium"
         ),
@@ -905,31 +947,31 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
         children: [
           /* @__PURE__ */ n("div", { className: "tw:bg-ic-white-1s tw:p-1.5 tw:rounded-lg", children: /* @__PURE__ */ n(E, { ...e.icon }) }),
           /* @__PURE__ */ n("span", { className: "tw:flex-1 tw:truncate", children: e.name }),
-          /* @__PURE__ */ n(E, { className: "tw:rotate-180", source: mr })
+          /* @__PURE__ */ n(E, { className: "tw:rotate-180", source: en })
         ]
       }
     ),
-    t && /* @__PURE__ */ n(Ie, { children: /* @__PURE__ */ n("div", { style: i, ...a(), ref: r.setFloating, children: /* @__PURE__ */ g("div", { className: "tw:h-full tw:flex tw:flex-col tw:border-l tw:border-t tw:border-ic-white-2s tw:bg-ic-ink-6s tw:text-ic-white-6s tw:text-sm", children: [
+    t && /* @__PURE__ */ n(je, { children: /* @__PURE__ */ n("div", { style: i, ...a(), ref: r.setFloating, children: /* @__PURE__ */ k("div", { className: "tw:h-full tw:flex tw:flex-col tw:border-l tw:border-t tw:border-ic-white-2s tw:bg-ic-ink-6s tw:text-ic-white-6s tw:text-sm", children: [
       /* @__PURE__ */ n("div", { className: "tw:h-12 tw:px-2 tw:flex tw:items-center", children: /* @__PURE__ */ n("h6", { className: "tw:font-medium", children: e.name }) }),
-      /* @__PURE__ */ n(oe, { className: "tw:flex-1 tw:px-3", children: /* @__PURE__ */ n("div", { className: "tw:flex tw:flex-col tw:gap-4", children: e.sections.map((m, b) => /* @__PURE__ */ ht(Cr, { ...m, key: b })) }) })
+      /* @__PURE__ */ n(ce, { className: "tw:flex-1 tw:px-3", children: /* @__PURE__ */ n("div", { className: "tw:flex tw:flex-col tw:gap-4", children: e.sections.map((f, v) => /* @__PURE__ */ ur(sn, { ...f, key: v })) }) })
     ] }) }) })
   ] });
-}, Cr = ({ template: e, autoFocus: t = !0, onCreate: s }) => {
-  const [, r] = _(!1), [i] = ae(), { actions: o, connectors: h, resolver: c, query: d } = W((l) => ({
+}, sn = ({ template: e, autoFocus: t = !0, onCreate: s }) => {
+  const [, r] = O(!1), i = re(), { actions: o, connectors: h, resolver: c, query: u } = F((l) => ({
     resolver: l.options.resolver
-  })), k = _(() => {
+  })), b = O(() => {
     const l = typeof e == "function" ? e() : e;
     let a;
-    "rootNodeId" in l ? a = l : a = d.parseReactElement(l).toNodeTree();
-    const { rootNodeId: m, nodes: b } = a, v = {};
-    return Object.entries(b).forEach(([w, N]) => {
-      const p = Et(N.data, c), x = w === m ? B : w;
-      v[x] = {
-        ...p,
-        parent: p.parent === m ? B : p.parent,
-        nodes: p.nodes?.map((M) => M === m ? B : M)
+    "rootNodeId" in l ? a = l : a = u.parseReactElement(l).toNodeTree();
+    const { rootNodeId: f, nodes: v } = a, w = {};
+    return Object.entries(v).forEach(([d, y]) => {
+      const g = kt(y.data, c), x = d === f ? W : d;
+      w[x] = {
+        ...g,
+        parent: g.parent === f ? W : g.parent,
+        nodes: g.nodes?.map((M) => M === f ? W : M)
       };
-    }), v;
+    }), w;
   })[0];
   return /* @__PURE__ */ n(
     "div",
@@ -952,13 +994,13 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
               backgroundColor: i.theme.palette.background.default
             }
           },
-          viewport: { width: Nt.md.minWidth },
-          children: /* @__PURE__ */ n(Me, { resolver: c, children: /* @__PURE__ */ n(Re, { data: k }) })
+          viewport: { width: Xt.md.minWidth },
+          children: /* @__PURE__ */ n($e, { resolver: c, children: /* @__PURE__ */ n(Ae, { data: b }) })
         }
       ) }) })
     }
   );
-}, xr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+}, on = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M12.5 2H9.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M2 9.5V12.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M10.257 16.6214L7.075 13.4394C6.489 12.8534 6.489 11.9034 7.075 11.3184V11.3184C7.661 10.7324 8.611 10.7324 9.196 11.3184" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
@@ -969,81 +1011,81 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
 <path d="M2 17V18C2 19.105 2.895 20 4 20H5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M20 5V4C20 2.895 19.105 2 18 2H17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, yr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, cn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <circle cx="6.49771" cy="5.49762" r="2.50104" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <circle cx="6.49771" cy="18.503" r="2.50104" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M6.49771 7.99854V16.0019" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <circle cx="17.5023" cy="13.0006" r="2.50104" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M6.49771 7.99854V7.99854C6.49771 10.7611 8.73722 13.0006 11.4998 13.0006H15.0013" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, Nr = (e) => {
-  const { query: t, actions: s } = W(), {
+`, an = (e) => {
+  const { query: t, actions: s } = F(), {
     id: r,
     expanded: i,
     actions: o,
     displayName: h,
     children: c,
-    depth: d
-  } = jt((b) => ({
-    expanded: b.expanded,
-    displayName: $e(t.node(b.id).get())
-  })), { selected: k, selectable: l } = W((b, v) => {
-    const w = v.node(r).get();
+    depth: u
+  } = fr((v) => ({
+    expanded: v.expanded,
+    displayName: Ee(t.node(v.id).get())
+  })), { selected: b, selectable: l } = F((v, w) => {
+    const d = w.node(r).get();
     return {
-      selected: v.getEvent("selected").contains(r),
-      nodeDOM: w.dom,
-      selectable: it(w)
+      selected: w.getEvent("selected").contains(r),
+      nodeDOM: d.dom,
+      selectable: ft(d)
     };
   });
-  z(() => {
-    r === B && o.setExpandedState(!0);
-  }, [o, r]), z(() => {
+  G(() => {
+    r === W && o.setExpandedState(!0);
+  }, [o, r]), G(() => {
     if (c.length === 0) return;
-    c.some((v) => {
-      const w = t.getEvent("selected").all();
-      return w.includes(v) ? !0 : t.node(v).descendants(!0).some((p) => w.includes(p));
+    c.some((w) => {
+      const d = t.getEvent("selected").all();
+      return d.includes(w) ? !0 : t.node(w).descendants(!0).some((g) => d.includes(g));
     }) && o.setExpandedState(!0);
   }, [c, o, t]);
   const a = () => {
     s.selectNode(r);
-  }, m = (b) => {
-    b.stopPropagation(), o.toggleLayer();
+  }, f = (v) => {
+    v.stopPropagation(), o.toggleLayer();
   };
-  return /* @__PURE__ */ g(
+  return /* @__PURE__ */ k(
     "div",
     {
       className: "tw:py-1",
       children: [
-        /* @__PURE__ */ g(
+        /* @__PURE__ */ k(
           "div",
           {
             onClick: a,
             style: {
-              paddingLeft: Math.max(0, d - 1) * 16
+              paddingLeft: Math.max(0, u - 1) * 16
             },
-            className: I(
+            className: P(
               "tw:flex tw:items-center tw:gap-0.5 tw:cursor-pointer tw:rounded-1 tw:pr-2 tw:py-1 tw:border tw:border-ic-white-1s tw:hover:bg-ic-white-1s",
               {
-                hidden: r === B,
-                "tw:bg-ic-black-7s": k,
+                hidden: r === W,
+                "tw:bg-ic-black-7s": b,
                 "tw:pointer-events-none": !l
               }
             ),
             children: [
-              c.length ? /* @__PURE__ */ n(j, { className: "tw:pointer-events-auto", onClick: m, children: /* @__PURE__ */ n(
+              c.length ? /* @__PURE__ */ n(A, { className: "tw:pointer-events-auto", onClick: f, children: /* @__PURE__ */ n(
                 E,
                 {
-                  className: I("tw:transition-transform tw:-rotate-90", {
+                  className: P("tw:transition-transform tw:-rotate-90", {
                     "tw:rotate-0": i
                   }),
                   size: 16,
-                  source: Se
+                  source: Re
                 }
-              ) }) : /* @__PURE__ */ n("div", { className: "tw:p-1", children: /* @__PURE__ */ n(E, { size: 16, source: yr }) }),
+              ) }) : /* @__PURE__ */ n("div", { className: "tw:p-1", children: /* @__PURE__ */ n(E, { size: 16, source: cn }) }),
               /* @__PURE__ */ n(
                 "span",
                 {
-                  className: I("tw:flex-1 tw:truncate", {
+                  className: P("tw:flex-1 tw:truncate", {
                     "tw:text-ic-white-3s": !l
                   }),
                   children: h
@@ -1056,12 +1098,12 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
       ]
     }
   );
-}, Lr = ({ onClose: e }) => {
-  const t = It(), s = (r) => {
+}, ln = ({ onClose: e }) => {
+  const t = gr(), s = (r) => {
     t.start(r);
   };
-  return /* @__PURE__ */ n(Ie, { children: /* @__PURE__ */ g(
-    Xe.div,
+  return /* @__PURE__ */ n(je, { children: /* @__PURE__ */ k(
+    ut.div,
     {
       drag: !0,
       dragControls: t,
@@ -1069,64 +1111,64 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
       style: { zIndex: 1e5, width: 320, height: 400, top: 80, right: 40 },
       className: "tw:fixed tw:rounded-2 tw:bg-ic-ink-6s tw:text-white tw:flex tw:flex-col tw:border tw:border-ic-white-2s",
       children: [
-        /* @__PURE__ */ g(
+        /* @__PURE__ */ k(
           "div",
           {
             onPointerDown: s,
             className: "tw:py-2 tw:cursor-grab tw:flex tw:items-center tw:justify-between tw:px-4",
             children: [
-              /* @__PURE__ */ g("div", { className: "tw:flex tw:items-center tw:gap-2", children: [
-                /* @__PURE__ */ n(E, { source: xr }),
+              /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:gap-2", children: [
+                /* @__PURE__ */ n(E, { source: on }),
                 /* @__PURE__ */ n("p", { className: "tw:text-sm tw:font-medium", children: "Layers" })
               ] }),
-              /* @__PURE__ */ n(j, { onClick: e, children: /* @__PURE__ */ n(E, { source: Je }) })
+              /* @__PURE__ */ n(A, { onClick: e, children: /* @__PURE__ */ n(E, { source: wt }) })
             ]
           }
         ),
-        /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto tw:border-t tw:border-ic-white-1s tw:p-2", children: /* @__PURE__ */ n($t, { renderLayer: Nr }) })
+        /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto tw:border-t tw:border-ic-white-1s tw:p-2", children: /* @__PURE__ */ n(wr, { renderLayer: an }) })
       ]
     }
   ) });
-}, Er = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+}, dn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M3 7.024L11.987 11.049L21 7.024L12.013 3L3 7.024Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M15.436 14.484L21 16.976L11.987 21L3 16.976L8.564 14.491" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M15.436 9.50903L21 12L11.987 16.024L3 12L8.564 9.51603" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, Sr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, hn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M5 12H19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M10 7L5 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M10 17L5 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, Mr = ({ insert: e }) => {
-  const [t, s] = De(!1), {
+`, un = ({ insert: e }) => {
+  const [t, s] = Te(!1), {
     queryParams: {
       action: r = "insert"
       /* Insert */
     },
     setQueryParams: i
-  } = te(), { actions: o, isDeletable: h, focusedNode: c } = W((a, m) => {
-    const b = m.getEvent("selected").first(), v = b ? m.node(b) : null;
+  } = ne(), { actions: o, isDeletable: h, focusedNode: c } = F((a, f) => {
+    const v = f.getEvent("selected").first(), w = v ? f.node(v) : null;
     return {
       enabled: a.options.enabled,
-      isDeletable: !!(v?.isDeletable() && (v.get().data.custom?.deletable ?? !0)),
-      focusedNode: v?.get()
+      isDeletable: !!(w?.isDeletable() && (w.get().data.custom?.deletable ?? !0)),
+      focusedNode: w?.get()
     };
-  }), d = () => {
+  }), u = () => {
     o.selectNode();
-  }, k = (a) => {
+  }, b = (a) => {
     o.delete(a.currentTarget.value);
   }, l = (a) => {
-    const m = a.currentTarget.value;
-    m === "layers" ? s() : (d(), i({
-      action: m
+    const f = a.currentTarget.value;
+    f === "layers" ? s() : (u(), i({
+      action: f
     }));
   };
-  return /* @__PURE__ */ g(J, { children: [
-    /* @__PURE__ */ g("aside", { className: "tw:flex tw:items-stretch tw:bg-ic-ink-6s tw:relative tw:border-t tw:border-ic-white-2s tw:text-ic-white-6s tw:text-sm", children: [
-      /* @__PURE__ */ g("div", { className: "tw:px-1 tw:flex tw:flex-col tw:gap-1", children: [
-        !!e && /* @__PURE__ */ g(Ne, { children: [
+  return /* @__PURE__ */ k(ee, { children: [
+    /* @__PURE__ */ k("aside", { className: "tw:flex tw:items-stretch tw:bg-ic-ink-6s tw:relative tw:border-t tw:border-ic-white-2s tw:text-ic-white-6s tw:text-sm", children: [
+      /* @__PURE__ */ k("div", { className: "tw:px-1 tw:flex tw:flex-col tw:gap-1", children: [
+        !!e && /* @__PURE__ */ k(ye, { children: [
           /* @__PURE__ */ n(
-            j,
+            A,
             {
               tooltip: {
                 content: "Insert",
@@ -1136,13 +1178,13 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
               value: "insert",
               className: "tw:relative",
               size: "32",
-              children: /* @__PURE__ */ n(E, { source: ct })
+              children: /* @__PURE__ */ n(E, { source: pt })
             }
           ),
           /* @__PURE__ */ n("hr", { className: "tw:border-ic-white-2s" })
         ] }),
         /* @__PURE__ */ n(
-          j,
+          A,
           {
             tooltip: {
               content: "Layers",
@@ -1152,55 +1194,56 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
             value: "layers",
             className: "tw:relative",
             size: "32",
-            children: /* @__PURE__ */ n(E, { source: Er })
+            children: /* @__PURE__ */ n(E, { source: dn })
           }
         )
       ] }),
-      /* @__PURE__ */ g(
+      /* @__PURE__ */ k(
         "div",
         {
-          className: I("tw:relative tw:flex tw:flex-col tw:border-l tw:border-ic-white-1s tw:w-72 tw:overflow-auto"),
+          className: P("tw:relative tw:flex tw:flex-col tw:border-l tw:border-ic-white-1s tw:w-72 tw:overflow-auto"),
           children: [
-            !c?.related.inspector && /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto scrollbar", children: r === "insert" && !!e && /* @__PURE__ */ n(kr, { elements: e.elements, sections: e.sections }) }),
-            !!c?.related?.inspector && /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:flex-1 tw:overflow-hidden", children: [
-              /* @__PURE__ */ g("div", { className: "tw:flex tw:items-center tw:gap-2 tw:px-2 tw:py-2", children: [
-                /* @__PURE__ */ n(j, { onClick: d, children: /* @__PURE__ */ n(E, { source: Sr }) }),
-                /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-hidden", children: /* @__PURE__ */ n(Ee, { fullWidth: !0, value: $e(c), size: "32" }) }),
-                h && /* @__PURE__ */ n(j, { value: c.id, onClick: k, children: /* @__PURE__ */ n(E, { className: "tw:text-ic-red-4s", source: et }) })
+            !c?.related.inspector && /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto scrollbar", children: r === "insert" && !!e && /* @__PURE__ */ n(tn, { elements: e.elements, sections: e.sections }) }),
+            !!c?.related?.inspector && /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:flex-1 tw:overflow-hidden", children: [
+              /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:gap-2 tw:px-2 tw:py-2", children: [
+                /* @__PURE__ */ n(A, { onClick: u, children: /* @__PURE__ */ n(E, { source: hn }) }),
+                /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-hidden", children: /* @__PURE__ */ n(Ie, { fullWidth: !0, value: Ee(c), size: "32" }) }),
+                h && /* @__PURE__ */ n(A, { value: c.id, onClick: b, children: /* @__PURE__ */ n(E, { className: "tw:text-ic-red-4s", source: Zt }) })
               ] }),
-              /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto tw:border-t tw:border-ic-white-1s scrollbar-hidden", children: /* @__PURE__ */ n(at, { fallback: null, children: Ae(c.related.inspector) }) })
+              /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto tw:border-t tw:border-ic-white-1s scrollbar-hidden", children: /* @__PURE__ */ n(vt, { fallback: null, children: Me(c.related.inspector) }) })
             ] })
           ]
         }
       )
     ] }),
-    t && /* @__PURE__ */ n(Lr, { onClose: s })
+    t && /* @__PURE__ */ n(ln, { onClose: s })
   ] });
-}, Vr = ({ theme: e, insert: t, resolver: s }) => {
+}, zn = ({ theme: e, insert: t, resolver: s, handlers: r }) => {
   const {
-    queryParams: { screen: r }
-  } = te();
-  return ae({
-    theme: e
-  }), /* @__PURE__ */ n(Me, { enabled: !0, onRender: hr, resolver: s, children: /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:w-screen tw:h-screen tw:bg-ic-ink-6s tw:text-ic-white-6s", children: [
-    /* @__PURE__ */ n(pr, {}),
-    /* @__PURE__ */ g("div", { className: "tw:flex-1 tw:overflow-hidden tw:flex", children: [
-      /* @__PURE__ */ n(Mr, { insert: t }),
+    queryParams: { screen: i }
+  } = ne();
+  return re({
+    theme: e,
+    handlers: r
+  }), /* @__PURE__ */ n($e, { enabled: !0, onRender: Zr, resolver: s, children: /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:w-screen tw:h-screen tw:bg-ic-ink-6s tw:text-ic-white-6s", children: [
+    /* @__PURE__ */ n(Kr, {}),
+    /* @__PURE__ */ k("div", { className: "tw:flex-1 tw:overflow-hidden tw:flex", children: [
+      /* @__PURE__ */ n(un, { insert: t }),
       /* @__PURE__ */ n(
         Ve,
         {
           viewport: {
-            width: (i) => r === "lg" ? Math.max(i, fe[r]) : fe[r]
+            width: (o) => i === "lg" ? Math.max(o, ve[i]) : ve[i]
           },
-          children: /* @__PURE__ */ n(Re, { children: /* @__PURE__ */ n(tt, {}) })
+          children: /* @__PURE__ */ n(Ae, { children: /* @__PURE__ */ n(mt, {}) })
         }
       )
     ] })
   ] }) });
 };
 export {
-  Vr as Editor,
-  te as useEditorQueryParams,
-  qr as useEditorResponsive,
-  ae as useEditorState
+  zn as Editor,
+  re as useEditor,
+  ne as useEditorQueryParams,
+  Un as useEditorResponsive
 };