@janbox/storefront-builder 2.0.19 → 2.0.20

package/dist/editor.js

@@ -1,27 +1,25 @@
-import { jsx as r, jsxs as w, Fragment as Oe } from "@emotion/react/jsx-runtime";
-import { ap as ft, aq as bt, ar as wt, as as b, at as kt, au as ce, av as $, aw as fe, N as Te, B as Ie, Z as mt, ax as J, ay as Fe, az as Ct, aA as W, aB as I, ao as He, an as vt, aC as xt, aD as yt, aE as Tt, aF as It, aG as Mt, aH as St, aI as Et, aJ as $e, aK as Lt, aL as Wt, aM as Nt, aN as Rt, aO as At, u as H, aP as Dt, aQ as Bt, aR as oe, k as Pt, f as jt, G as Vt, j as Me, m as Ot, F as Se, p as Ft, V as Ht, I as $t, aS as _t, o as zt, P as Gt, aT as _e, aU as Ut, aV as Zt, aW as Yt, aX as Xt, aY as ze, aZ as qt, a_ as Jt, a$ as Ge, b0 as Kt, O as Ue, Y as Ze, b1 as Ee, b2 as Qt, X as er, b3 as tr, b4 as rr, b5 as nr, b6 as Le, b7 as or } from "./toaster-j03A1kAt.js";
-import { b8 as Lo, b9 as Wo, ba as No, bb as Ro, bc as Ao, bd as Do, be as Bo, bf as Po, bg as jo, bh as Vo, bi as Oo, bj as Fo, bk as Ho, bl as $o, bm as _o, bn as zo, bo as Go, bp as Uo, bq as Zo, br as Yo, bs as Xo, bt as qo, bu as Jo, bv as Ko, bw as Qo, bx as es, by as ts, bz as rs, bA as ns, bB as os, bC as ss, bD as is, bE as as, bF as cs, bG as ls, bH as ds, bI as hs, bJ as us, bK as ps, bL as gs, bM as fs, bN as bs, bO as ws, bP as ks, bQ as ms, bR as Cs, bS as vs, bT as xs, bU as ys, bV as Ts, bW as Is, bX as Ms, W as Ss, bY as Es, bZ as Ls, b_ as Ws, b$ as Ns, c0 as Rs } from "./toaster-j03A1kAt.js";
-import { serializeNode as sr, ROOT_NODE as _, useNode as ke } from "@craftjs/core";
-import { throttle as ir, isFunction as We, isNumber as se, isNil as ee, isEqual as ar } from "lodash-es";
-import { useImperativeHandle as cr, useMemo as lr, isValidElement as dr, useState as P, useRef as G, useEffect as V, Fragment as ie, Suspense as hr, createElement as Ye, useCallback as ur } from "react";
+import { jsx as n, jsxs as w, Fragment as Fe } from "@emotion/react/jsx-runtime";
+import { at as ft, au as bt, av as wt, aw as b, ax as kt, ay as ce, az as $, aA as fe, b as Te, B as Ie, a1 as mt, aB as J, aC as Oe, aD as Ct, aE as W, aF as I, as as He, ar as vt, aG as xt, aH as yt, aI as Tt, aJ as It, aK as Mt, aL as St, aM as Et, aN as $e, aO as Lt, aP as Wt, aQ as Nt, aR as Rt, aS as At, u as H, aT as Dt, aU as Bt, aV as oe, m as Pt, i as jt, G as Vt, l as Me, o as Ft, F as Se, s as Ot, V as Ht, I as $t, aW as _t, q as Gt, P as zt, aX as _e, aY as Ut, aZ as Zt, a_ as Yt, a$ as Xt, b0 as qt, b1 as _, b2 as Ge, b3 as Jt, b4 as Kt, b5 as ze, b6 as Qt, b7 as en, b8 as tn, a0 as Ue, Z as Ze, b9 as Ee, ba as nn, N as ke, bb as rn, bc as on, bd as sn, $ as an, be as Le, bf as cn } from "./toaster-BoEJoz-T.js";
+import { bg as So, bh as Eo, bi as Lo, bj as Wo, bk as No, bl as Ro, bm as Ao, bn as Do, bo as Bo, bp as Po, bq as jo, br as Vo, bs as Fo, bt as Oo, bu as Ho, bv as $o, bw as _o, bx as Go, by as zo, bz as Uo, bA as Zo, bB as Yo, bC as Xo, bD as qo, bE as Jo, bF as Ko, bG as Qo, bH as es, bI as ts, bJ as ns, bK as rs, bL as os, bM as ss, bN as is, bO as as, bP as cs, bQ as ls, bR as ds, bS as hs, bT as us, bU as ps, bV as gs, bW as fs, bX as bs, bY as ws, bZ as ks, b_ as ms, b$ as Cs, c0 as vs, c1 as xs, c2 as ys, c3 as Ts, W as Is, c4 as Ms, c5 as Ss, c6 as Es, c7 as Ls, c8 as Ws } from "./toaster-BoEJoz-T.js";
+import { throttle as ln, isFunction as We, isNumber as se, isNil as ee, isEqual as dn } from "lodash-es";
+import { useImperativeHandle as hn, useMemo as un, isValidElement as pn, useState as P, useRef as z, useEffect as V, Fragment as ie, Suspense as gn, createElement as Ye, useCallback as fn } from "react";
 import "flat";
-import { FLOATING_Z_INDEX as Xe, ThemeProvider as pr, breakpoint as gr, createTheme as Ne } from "@janbox/storefront-ui/theme";
+import { FLOATING_Z_INDEX as Xe, ThemeProvider as bn, breakpoint as wn, createTheme as Ne } from "@janbox/storefront-ui/theme";
 import "@janbox/storefront-ui/hooks";
-import { CacheProvider as fr, Global as br, createElement as wr } from "@emotion/react";
-import { useFloatingParentNodeId as kr, FloatingTree as mr, useFloating as le, autoUpdate as de, offset as qe, size as Je, flip as me, useClick as Cr, useHover as Ke, useFocus as Qe, useDismiss as et, useRole as tt, useInteractions as rt, safePolygon as vr, FloatingPortal as he } from "@floating-ui/react";
+import { CacheProvider as kn, Global as mn, createElement as Cn } from "@emotion/react";
+import { useFloatingParentNodeId as vn, FloatingTree as xn, useFloating as le, autoUpdate as de, offset as qe, size as Je, flip as me, useClick as yn, useHover as Ke, useFocus as Qe, useDismiss as et, useRole as tt, useInteractions as nt, safePolygon as Tn, FloatingPortal as he } from "@floating-ui/react";
 import "react-colorful";
 import "overlayscrollbars-react";
 import "@tanstack/react-virtual";
-import xr, { useFrame as Ce } from "react-frame-component";
+import In, { useFrame as Ce } from "react-frame-component";
 import "react-dropzone";
 import "react-datepicker";
-import { a as nt, C as ot } from "./index-CAk0Z6SL.js";
+import { a as rt, C as ot } from "./index-CX1ysbQd.js";
 import "@janbox/storefront-ui/utils";
 import { useToggle as st } from "usehooks-ts";
 import "@hello-pangea/dnd";
-import { Layers as yr, useLayer as Tr } from "@craftjs/layers";
 import "@janbox/storefront-ui";
-class Ir {
+class Mn {
   constructor() {
     this.componentControls = /* @__PURE__ */ new Set();
   }
@@ -49,20 +47,20 @@ class Ir {
    * @public
    */
   start(t, o) {
-    this.componentControls.forEach((n) => {
-      n.start(t.nativeEvent || t, o);
+    this.componentControls.forEach((r) => {
+      r.start(t.nativeEvent || t, o);
     });
   }
 }
-const Mr = () => new Ir();
-function Sr() {
-  return ft(Mr);
+const Sn = () => new Mn();
+function En() {
+  return ft(Sn);
 }
-const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr, { children: /* @__PURE__ */ r(Re, { ...e }) }), Re = ({
+const Ln = (e) => vn() ? /* @__PURE__ */ n(Re, { ...e }) : /* @__PURE__ */ n(xn, { children: /* @__PURE__ */ n(Re, { ...e }) }), Re = ({
   open: e,
   placement: t = "bottom",
   onOpenChange: o,
-  dismissProps: n = {
+  dismissProps: r = {
     enabled: !1
   },
   children: i,
@@ -89,17 +87,17 @@ const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr,
     whileElementsMounted: (...A) => de(...A, p),
     elements: d
   });
-  cr(c, () => g, [g]);
-  const { context: f } = g, h = Cr(f, s), y = Ke(f, a), m = Qe(f, l), T = et(f, n), S = tt(f), O = rt([h, T, S, y, m]), j = lr(
+  hn(c, () => g, [g]);
+  const { context: f } = g, h = yn(f, s), y = Ke(f, a), m = Qe(f, l), T = et(f, r), S = tt(f), F = nt([h, T, S, y, m]), j = un(
     () => ({
       ...g,
-      ...O
+      ...F
     }),
-    [g, O]
+    [g, F]
   );
-  return /* @__PURE__ */ r(bt.Provider, { value: j, children: i });
-}, bo = ({ width: e = 600, children: t, ...o }) => /* @__PURE__ */ r(
-  Er,
+  return /* @__PURE__ */ n(bt.Provider, { value: j, children: i });
+}, go = ({ width: e = 600, children: t, ...o }) => /* @__PURE__ */ n(
+  Ln,
   {
     dismissProps: {
       enabled: !0
@@ -120,7 +118,7 @@ const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr,
         },
         css: { display: "flex", overflow: "hidden", flexDirection: "column", maxWidth: "100%", maxHeight: "100%" },
         children: [
-          /* @__PURE__ */ r(
+          /* @__PURE__ */ n(
             "div",
             {
               css: {
@@ -132,7 +130,7 @@ const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr,
               }
             }
           ),
-          /* @__PURE__ */ r(
+          /* @__PURE__ */ n(
             "div",
             {
               css: {
@@ -154,18 +152,18 @@ const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr,
       }
     )
   }
-), wo = () => kt(), ko = ({ ref: e, ...t }) => /* @__PURE__ */ r(
+), fo = () => kt(), bo = ({ ref: e, ...t }) => /* @__PURE__ */ n(
   ce,
   {
     css: { paddingBlock: 12, paddingInline: 20, flex: 1, overflow: "auto", ...b.text.xs },
     ...t,
     ref: e
   }
-), mo = ({ required: e, children: t, ...o }) => /* @__PURE__ */ w("div", { css: { marginBottom: 6, display: "flex", width: "fit-content" }, ...o, children: [
-  dr(t) ? t : /* @__PURE__ */ r("label", { children: t }),
-  e && /* @__PURE__ */ r("span", { css: { color: b.palette.red["6s"] }, children: " *" })
-] }), Co = () => {
-  const [e, t] = P(0), [o, n] = P(!1), i = G(null), s = (k, u) => {
+), wo = ({ required: e, children: t, ...o }) => /* @__PURE__ */ w("div", { css: { marginBottom: 6, display: "flex", width: "fit-content" }, ...o, children: [
+  pn(t) ? t : /* @__PURE__ */ n("label", { children: t }),
+  e && /* @__PURE__ */ n("span", { css: { color: b.palette.red["6s"] }, children: " *" })
+] }), ko = () => {
+  const [e, t] = P(0), [o, r] = P(!1), i = z(null), s = (k, u) => {
     if (!i.current) return 0;
     const p = i.current.getBoundingClientRect(), c = p.left + p.width / 2, g = p.top + p.height / 2, f = k - c, h = u - g;
     return (Math.atan2(h, f) * (180 / Math.PI) + 360) % 360;
@@ -185,7 +183,7 @@ const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr,
         }
       },
       onMouseUp: () => {
-        n(!1);
+        r(!1);
       },
       children: [
         /* @__PURE__ */ w("h3", { children: [
@@ -201,14 +199,14 @@ const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr,
             height: "200",
             viewBox: "0 0 200 200",
             onMouseDown: (k) => {
-              n(!0);
+              r(!0);
               const u = s(k.clientX, k.clientY);
               t(Math.round(u));
             },
             style: { cursor: "grab" },
             children: [
-              /* @__PURE__ */ r("circle", { cx: "100", cy: "100", r: "90", fill: "#EAEAEA", stroke: "#CCC", strokeWidth: "2" }),
-              /* @__PURE__ */ r(
+              /* @__PURE__ */ n("circle", { cx: "100", cy: "100", r: "90", fill: "#EAEAEA", stroke: "#CCC", strokeWidth: "2" }),
+              /* @__PURE__ */ n(
                 "line",
                 {
                   x1: "100",
@@ -219,7 +217,7 @@ const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr,
                   strokeWidth: "2"
                 }
               ),
-              /* @__PURE__ */ r(
+              /* @__PURE__ */ n(
                 "circle",
                 {
                   cx: 100 + 90 * Math.cos((e - 90) * (Math.PI / 180)),
@@ -236,54 +234,54 @@ const Er = (e) => kr() ? /* @__PURE__ */ r(Re, { ...e }) : /* @__PURE__ */ r(mr,
     }
   );
 };
-function Lr(e) {
+function Wn(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 Wr(e) {
+function Nn(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 Nr = /* @__PURE__ */ (function() {
+var Rn = /* @__PURE__ */ (function() {
   function e(o) {
-    var n = this;
+    var r = this;
     this._insertTag = function(i) {
       var s;
-      n.tags.length === 0 ? n.insertionPoint ? s = n.insertionPoint.nextSibling : n.prepend ? s = n.container.firstChild : s = n.before : s = n.tags[n.tags.length - 1].nextSibling, n.container.insertBefore(i, s), n.tags.push(i);
+      r.tags.length === 0 ? r.insertionPoint ? s = r.insertionPoint.nextSibling : r.prepend ? s = r.container.firstChild : s = r.before : s = r.tags[r.tags.length - 1].nextSibling, r.container.insertBefore(i, s), r.tags.push(i);
     }, this.isSpeedy = o.speedy === void 0 ? !0 : o.speedy, this.tags = [], this.ctr = 0, this.nonce = o.nonce, this.key = o.key, this.container = o.container, this.prepend = o.prepend, this.insertionPoint = o.insertionPoint, this.before = null;
   }
   var t = e.prototype;
-  return t.hydrate = function(n) {
-    n.forEach(this._insertTag);
-  }, t.insert = function(n) {
-    this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(Wr(this));
+  return t.hydrate = function(r) {
+    r.forEach(this._insertTag);
+  }, t.insert = function(r) {
+    this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(Nn(this));
     var i = this.tags[this.tags.length - 1];
     if (this.isSpeedy) {
-      var s = Lr(i);
+      var s = Wn(i);
       try {
-        s.insertRule(n, s.cssRules.length);
+        s.insertRule(r, s.cssRules.length);
       } catch {
       }
     } else
-      i.appendChild(document.createTextNode(n));
+      i.appendChild(document.createTextNode(r));
     this.ctr++;
   }, t.flush = function() {
-    this.tags.forEach(function(n) {
+    this.tags.forEach(function(r) {
       var i;
-      return (i = n.parentNode) == null ? void 0 : i.removeChild(n);
+      return (i = r.parentNode) == null ? void 0 : i.removeChild(r);
     }), this.tags = [], this.ctr = 0;
   }, e;
-})(), L = "-ms-", ae = "-moz-", C = "-webkit-", it = "comm", ve = "rule", xe = "decl", Rr = "@import", at = "@keyframes", Ar = "@layer", Dr = Math.abs, ue = String.fromCharCode, Br = Object.assign;
-function Pr(e, t) {
+})(), L = "-ms-", ae = "-moz-", C = "-webkit-", it = "comm", ve = "rule", xe = "decl", An = "@import", at = "@keyframes", Dn = "@layer", Bn = Math.abs, ue = String.fromCharCode, Pn = Object.assign;
+function jn(e, t) {
   return E(e, 0) ^ 45 ? (((t << 2 ^ E(e, 0)) << 2 ^ E(e, 1)) << 2 ^ E(e, 2)) << 2 ^ E(e, 3) : 0;
 }
 function ct(e) {
   return e.trim();
 }
-function jr(e, t) {
+function Vn(e, t) {
   return (e = t.exec(e)) ? e[0] : e;
 }
 function v(e, t, o) {
@@ -307,20 +305,20 @@ function ye(e) {
 function Q(e, t) {
   return t.push(e), e;
 }
-function Vr(e, t) {
+function Fn(e, t) {
   return e.map(t).join("");
 }
 var pe = 1, U = 1, lt = 0, N = 0, M = 0, Z = "";
-function ge(e, t, o, n, i, s, l) {
-  return { value: e, root: t, parent: o, type: n, props: i, children: s, line: pe, column: U, length: l, return: "" };
+function ge(e, t, o, r, i, s, l) {
+  return { value: e, root: t, parent: o, type: r, props: i, children: s, line: pe, column: U, length: l, return: "" };
 }
 function Y(e, t) {
-  return Br(ge("", null, null, "", null, null, 0), e, { length: -e.length }, t);
+  return Pn(ge("", null, null, "", null, null, 0), e, { length: -e.length }, t);
 }
-function Or() {
+function On() {
   return M;
 }
-function Fr() {
+function Hn() {
   return M = N > 0 ? E(Z, --N) : 0, U--, M === 10 && (U = 1, pe--), M;
 }
 function R() {
@@ -379,15 +377,15 @@ function dt(e) {
 function ht(e) {
   return Z = "", e;
 }
-function re(e) {
+function ne(e) {
   return ct(K(N - 1, we(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
 }
-function Hr(e) {
+function $n(e) {
   for (; (M = B()) && M < 33; )
     R();
   return q(e) > 2 || q(M) > 3 ? "" : " ";
 }
-function $r(e, t) {
+function _n(e, t) {
   for (; --t && R() && !(M < 48 || M > 102 || M > 57 && M < 65 || M > 70 && M < 97); )
     ;
   return K(e, te() + (t < 6 && B() == 32 && R() == 32));
@@ -414,52 +412,52 @@ function we(e) {
     }
   return N;
 }
-function _r(e, t) {
+function Gn(e, t) {
   for (; R() && e + M !== 57; )
     if (e + M === 84 && B() === 47)
       break;
   return "/*" + K(t, N - 1) + "*" + ue(e === 47 ? e : R());
 }
-function zr(e) {
+function zn(e) {
   for (; !q(B()); )
     R();
   return K(e, N);
 }
-function Gr(e) {
-  return ht(ne("", null, null, null, [""], e = dt(e), 0, [0], e));
+function Un(e) {
+  return ht(re("", null, null, null, [""], e = dt(e), 0, [0], e));
 }
-function ne(e, t, o, n, i, s, l, a, d) {
-  for (var k = 0, u = 0, p = l, c = 0, g = 0, f = 0, h = 1, y = 1, m = 1, T = 0, S = "", O = i, j = s, A = n, x = S; y; )
+function re(e, t, o, r, i, s, l, a, d) {
+  for (var k = 0, u = 0, p = l, c = 0, g = 0, f = 0, h = 1, y = 1, m = 1, T = 0, S = "", F = i, j = s, A = r, x = S; y; )
     switch (f = T, T = R()) {
       // (
       case 40:
         if (f != 108 && E(x, p - 1) == 58) {
-          be(x += v(re(T), "&", "&\f"), "&\f") != -1 && (m = -1);
+          be(x += v(ne(T), "&", "&\f"), "&\f") != -1 && (m = -1);
           break;
         }
       // " ' [
       case 34:
       case 39:
       case 91:
-        x += re(T);
+        x += ne(T);
         break;
       // \t \n \r \s
       case 9:
       case 10:
       case 13:
       case 32:
-        x += Hr(f);
+        x += $n(f);
         break;
       // \
       case 92:
-        x += $r(te() - 1, 7);
+        x += _n(te() - 1, 7);
         continue;
       // /
       case 47:
         switch (B()) {
           case 42:
           case 47:
-            Q(Ur(_r(R(), te()), t, o), d);
+            Q(Zn(Gn(R(), te()), t, o), d);
             break;
           default:
             x += "/";
@@ -479,16 +477,16 @@ function ne(e, t, o, n, i, s, l, a, d) {
             y = 0;
           // ;
           case 59 + u:
-            m == -1 && (x = v(x, /\f/g, "")), g > 0 && D(x) - p && Q(g > 32 ? De(x + ";", n, o, p - 1) : De(v(x, " ", "") + ";", n, o, p - 2), d);
+            m == -1 && (x = v(x, /\f/g, "")), g > 0 && D(x) - p && Q(g > 32 ? De(x + ";", r, o, p - 1) : De(v(x, " ", "") + ";", r, o, p - 2), d);
             break;
           // @ ;
           case 59:
             x += ";";
           // { rule/at-rule
           default:
-            if (Q(A = Ae(x, t, o, k, u, i, a, S, O = [], j = [], p), s), T === 123)
+            if (Q(A = Ae(x, t, o, k, u, i, a, S, F = [], j = [], p), s), T === 123)
               if (u === 0)
-                ne(x, t, A, A, O, s, p, a, j);
+                re(x, t, A, A, F, s, p, a, j);
               else
                 switch (c === 99 && E(x, 3) === 110 ? 100 : c) {
                   // d l m s
@@ -496,10 +494,10 @@ function ne(e, t, o, n, i, s, l, a, d) {
                   case 108:
                   case 109:
                   case 115:
-                    ne(e, A, A, n && Q(Ae(e, A, A, 0, 0, i, a, S, i, O = [], p), j), i, j, p, a, n ? O : j);
+                    re(e, A, A, r && Q(Ae(e, A, A, 0, 0, i, a, S, i, F = [], p), j), i, j, p, a, r ? F : j);
                     break;
                   default:
-                    ne(x, A, A, A, [""], j, 0, a, j);
+                    re(x, A, A, A, [""], j, 0, a, j);
                 }
         }
         k = u = g = 0, h = m = 1, S = x = "", p = l;
@@ -511,7 +509,7 @@ function ne(e, t, o, n, i, s, l, a, d) {
         if (h < 1) {
           if (T == 123)
             --h;
-          else if (T == 125 && h++ == 0 && Fr() == 125)
+          else if (T == 125 && h++ == 0 && Hn() == 125)
             continue;
         }
         switch (x += ue(T), T * h) {
@@ -525,7 +523,7 @@ function ne(e, t, o, n, i, s, l, a, d) {
             break;
           // @
           case 64:
-            B() === 45 && (x += re(R())), c = B(), u = p = D(S = x += zr(te())), T++;
+            B() === 45 && (x += ne(R())), c = B(), u = p = D(S = x += zn(te())), T++;
             break;
           // -
           case 45:
@@ -534,93 +532,93 @@ function ne(e, t, o, n, i, s, l, a, d) {
     }
   return s;
 }
-function Ae(e, t, o, n, i, s, l, a, d, k, u) {
-  for (var p = i - 1, c = i === 0 ? s : [""], g = ye(c), f = 0, h = 0, y = 0; f < n; ++f)
-    for (var m = 0, T = X(e, p + 1, p = Dr(h = l[f])), S = e; m < g; ++m)
+function Ae(e, t, o, r, i, s, l, a, d, k, u) {
+  for (var p = i - 1, c = i === 0 ? s : [""], g = ye(c), f = 0, h = 0, y = 0; f < r; ++f)
+    for (var m = 0, T = X(e, p + 1, p = Bn(h = l[f])), S = e; m < g; ++m)
       (S = ct(h > 0 ? c[m] + " " + T : v(T, /&\f/g, c[m]))) && (d[y++] = S);
   return ge(e, t, o, i === 0 ? ve : a, d, k, u);
 }
-function Ur(e, t, o) {
-  return ge(e, t, o, it, ue(Or()), X(e, 2, -2), 0);
+function Zn(e, t, o) {
+  return ge(e, t, o, it, ue(On()), X(e, 2, -2), 0);
 }
-function De(e, t, o, n) {
-  return ge(e, t, o, xe, X(e, 0, n), X(e, n + 1, -1), n);
+function De(e, t, o, r) {
+  return ge(e, t, o, xe, X(e, 0, r), X(e, r + 1, -1), r);
 }
-function z(e, t) {
-  for (var o = "", n = ye(e), i = 0; i < n; i++)
+function G(e, t) {
+  for (var o = "", r = ye(e), i = 0; i < r; i++)
     o += t(e[i], i, e, t) || "";
   return o;
 }
-function Zr(e, t, o, n) {
+function Yn(e, t, o, r) {
   switch (e.type) {
-    case Ar:
+    case Dn:
       if (e.children.length) break;
-    case Rr:
+    case An:
     case xe:
       return e.return = e.return || e.value;
     case it:
       return "";
     case at:
-      return e.return = e.value + "{" + z(e.children, n) + "}";
+      return e.return = e.value + "{" + G(e.children, r) + "}";
     case ve:
       e.value = e.props.join(",");
   }
-  return D(o = z(e.children, n)) ? e.return = e.value + "{" + o + "}" : "";
+  return D(o = G(e.children, r)) ? e.return = e.value + "{" + o + "}" : "";
 }
-function Yr(e) {
+function Xn(e) {
   var t = ye(e);
-  return function(o, n, i, s) {
+  return function(o, r, i, s) {
     for (var l = "", a = 0; a < t; a++)
-      l += e[a](o, n, i, s) || "";
+      l += e[a](o, r, i, s) || "";
     return l;
   };
 }
-function Xr(e) {
+function qn(e) {
   return function(t) {
     t.root || (t = t.return) && e(t);
   };
 }
-var qr = function(t, o, n) {
-  for (var i = 0, s = 0; i = s, s = B(), i === 38 && s === 12 && (o[n] = 1), !q(s); )
+var Jn = function(t, o, r) {
+  for (var i = 0, s = 0; i = s, s = B(), i === 38 && s === 12 && (o[r] = 1), !q(s); )
     R();
   return K(t, N);
-}, Jr = function(t, o) {
-  var n = -1, i = 44;
+}, Kn = function(t, o) {
+  var r = -1, i = 44;
   do
     switch (q(i)) {
       case 0:
-        i === 38 && B() === 12 && (o[n] = 1), t[n] += qr(N - 1, o, n);
+        i === 38 && B() === 12 && (o[r] = 1), t[r] += Jn(N - 1, o, r);
         break;
       case 2:
-        t[n] += re(i);
+        t[r] += ne(i);
         break;
       case 4:
         if (i === 44) {
-          t[++n] = B() === 58 ? "&\f" : "", o[n] = t[n].length;
+          t[++r] = B() === 58 ? "&\f" : "", o[r] = t[r].length;
           break;
         }
       // fallthrough
       default:
-        t[n] += ue(i);
+        t[r] += ue(i);
     }
   while (i = R());
   return t;
-}, Kr = function(t, o) {
-  return ht(Jr(dt(t), o));
-}, Be = /* @__PURE__ */ new WeakMap(), Qr = function(t) {
+}, Qn = function(t, o) {
+  return ht(Kn(dt(t), o));
+}, Be = /* @__PURE__ */ new WeakMap(), er = 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 o = t.value, n = t.parent, i = t.column === n.column && t.line === n.line; n.type !== "rule"; )
-      if (n = n.parent, !n) return;
-    if (!(t.props.length === 1 && o.charCodeAt(0) !== 58 && !Be.get(n)) && !i) {
+    for (var o = 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 && o.charCodeAt(0) !== 58 && !Be.get(r)) && !i) {
       Be.set(t, !0);
-      for (var s = [], l = Kr(o, s), a = n.props, d = 0, k = 0; d < l.length; d++)
+      for (var s = [], l = Qn(o, s), a = r.props, d = 0, k = 0; d < l.length; d++)
         for (var u = 0; u < a.length; u++, k++)
           t.props[k] = s[d] ? l[d].replace(/&\f/g, a[u]) : a[u] + " " + l[d];
     }
   }
-}, en = function(t) {
+}, tr = function(t) {
   if (t.type === "decl") {
     var o = t.value;
     // charcode for l
@@ -629,7 +627,7 @@ var qr = function(t, o, n) {
   }
 };
 function ut(e, t) {
-  switch (Pr(e, t)) {
+  switch (jn(e, t)) {
     // color-adjust
     case 5103:
       return C + "print-" + e + e;
@@ -770,27 +768,27 @@ function ut(e, t) {
   }
   return e;
 }
-var tn = function(t, o, n, i) {
+var nr = function(t, o, r, i) {
   if (t.length > -1 && !t.return) switch (t.type) {
     case xe:
       t.return = ut(t.value, t.length);
       break;
     case at:
-      return z([Y(t, {
+      return G([Y(t, {
         value: v(t.value, "@", "@" + C)
       })], i);
     case ve:
-      if (t.length) return Vr(t.props, function(s) {
-        switch (jr(s, /(::plac\w+|:read-\w+)/)) {
+      if (t.length) return Fn(t.props, function(s) {
+        switch (Vn(s, /(::plac\w+|:read-\w+)/)) {
           // :read-(only|write)
           case ":read-only":
           case ":read-write":
-            return z([Y(t, {
+            return G([Y(t, {
               props: [v(s, /:(read-\w+)/, ":" + ae + "$1")]
             })], i);
           // :placeholder
           case "::placeholder":
-            return z([Y(t, {
+            return G([Y(t, {
               props: [v(s, /:(plac\w+)/, ":" + C + "input-$1")]
             }), Y(t, {
               props: [v(s, /:(plac\w+)/, ":" + ae + "$1")]
@@ -801,16 +799,16 @@ var tn = function(t, o, n, i) {
         return "";
       });
   }
-}, rn = [tn], nn = function(t) {
+}, rr = [nr], or = function(t) {
   var o = t.key;
   if (o === "css") {
-    var n = document.querySelectorAll("style[data-emotion]:not([data-s])");
-    Array.prototype.forEach.call(n, function(h) {
+    var r = document.querySelectorAll("style[data-emotion]:not([data-s])");
+    Array.prototype.forEach.call(r, function(h) {
       var y = h.getAttribute("data-emotion");
       y.indexOf(" ") !== -1 && (document.head.appendChild(h), h.setAttribute("data-s", ""));
     });
   }
-  var i = t.stylisPlugins || rn, s = {}, l, a = [];
+  var i = t.stylisPlugins || rr, s = {}, l, a = [];
   l = 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
@@ -821,12 +819,12 @@ var tn = function(t, o, n, i) {
       a.push(h);
     }
   );
-  var d, k = [Qr, en];
+  var d, k = [er, tr];
   {
-    var u, p = [Zr, Xr(function(h) {
+    var u, p = [Yn, qn(function(h) {
       u.insert(h);
-    })], c = Yr(k.concat(i, p)), g = function(y) {
-      return z(Gr(y), c);
+    })], c = Xn(k.concat(i, p)), g = function(y) {
+      return G(Un(y), c);
     };
     d = function(y, m, T, S) {
       u = T, g(y ? y + "{" + m.styles + "}" : m.styles), S && (f.inserted[m.name] = !0);
@@ -834,7 +832,7 @@ var tn = function(t, o, n, i) {
   }
   var f = {
     key: o,
-    sheet: new Nr({
+    sheet: new Rn({
       key: o,
       container: l,
       nonce: t.nonce,
@@ -850,12 +848,12 @@ var tn = function(t, o, n, i) {
   return f.sheet.hydrate(a), f;
 };
 const pt = ({ children: e, viewport: t, containerProps: o }) => {
-  const n = G(null), { theme: i } = $(), [s, l] = P({
+  const r = z(null), { theme: i } = $(), [s, l] = P({
     width: 0,
     height: 0
   });
   V(() => {
-    const f = ir((y) => {
+    const f = ln((y) => {
       const m = y.at(0)?.target;
       if (!m) return;
       const { width: T, height: S } = m.getBoundingClientRect();
@@ -864,10 +862,10 @@ const pt = ({ children: e, viewport: t, containerProps: o }) => {
         height: S
       }));
     }, 200), h = new ResizeObserver(f);
-    return n.current && h.observe(n.current), () => h.disconnect();
+    return r.current && h.observe(r.current), () => h.disconnect();
   }, []);
   const a = We(t?.width) ? t.width(s.width) : t?.width, d = We(t?.height) ? t.height(s.height) : t?.height, k = se(a) ? s.width / a : 1, u = se(d) ? s.height / d : 1, p = Math.min(k, u, 1), c = (d ?? s.height / p) || 0, g = (a ?? s.width / p) || 0;
-  return /* @__PURE__ */ r("div", { ...o, css: { padding: 8, width: "100%", height: "100%", backgroundColor: fe.ink["1s"] }, children: /* @__PURE__ */ r("div", { css: { position: "relative", overflow: "hidden", width: "100%", height: "100%" }, ref: n, children: /* @__PURE__ */ r(
+  return /* @__PURE__ */ n("div", { ...o, css: { padding: 8, width: "100%", height: "100%", backgroundColor: fe.ink["1s"] }, children: /* @__PURE__ */ n("div", { css: { position: "relative", overflow: "hidden", width: "100%", height: "100%" }, ref: r, children: /* @__PURE__ */ n(
     "div",
     {
       style: {
@@ -878,35 +876,35 @@ const pt = ({ children: e, viewport: t, containerProps: o }) => {
         marginTop: (s.height - c) / 2
       },
       css: { position: "absolute" },
-      children: /* @__PURE__ */ r(
-        xr,
+      children: /* @__PURE__ */ n(
+        In,
         {
           sandbox: "allow-same-origin allow-scripts allow-popups allow-presentation",
           allow: "autoplay; encrypted-media",
           width: a ?? "100%",
           height: d ?? "100%",
-          children: /* @__PURE__ */ r(on, { theme: i, children: e })
+          children: /* @__PURE__ */ n(sr, { theme: i, children: e })
         }
       )
     }
   ) }) });
-}, on = ({ children: e, theme: t }) => {
-  const { document: o, window: n } = Ce(), [i, s] = P(!1), l = G(window.customElements.define.bind(window.customElements));
+}, sr = ({ children: e, theme: t }) => {
+  const { document: o, window: r } = Ce(), [i, s] = P(!1), l = z(window.customElements.define.bind(window.customElements));
   V(() => {
     const d = l.current;
-    return n && (window.customElements.define = function(k, u, p) {
-      window.customElements.get(k) || n.customElements.define(k, u, p), d(k, u, p);
+    return r && (window.customElements.define = function(k, u, p) {
+      window.customElements.get(k) || r.customElements.define(k, u, p), d(k, u, p);
     }), o?.head.replaceWith(document.head.cloneNode(!0)), s(!0), () => {
       window.customElements.define = d;
     };
-  }, [o, n]);
-  const a = nn({
+  }, [o, r]);
+  const a = or({
     key: "css",
     container: o?.head
   });
-  return i ? /* @__PURE__ */ r(Oe, { children: /* @__PURE__ */ w(fr, { value: a, children: [
-    /* @__PURE__ */ r(
-      br,
+  return i ? /* @__PURE__ */ n(Fe, { children: /* @__PURE__ */ w(kn, { value: a, children: [
+    /* @__PURE__ */ n(
+      mn,
       {
         styles: {
           ".frame-content": {
@@ -927,11 +925,11 @@ const pt = ({ children: e, viewport: t, containerProps: o }) => {
         }
       }
     ),
-    /* @__PURE__ */ r(pr, { root: o?.body, theme: t, children: e })
+    /* @__PURE__ */ n(bn, { root: o?.body, theme: t, children: e })
   ] }) }) : null;
 };
-var F = /* @__PURE__ */ ((e) => (e[e.Pixels = 0] = "Pixels", e[e.Unitless = 1] = "Unitless", e))(F || {});
-const sn = [
+var O = /* @__PURE__ */ ((e) => (e[e.Pixels = 0] = "Pixels", e[e.Unitless = 1] = "Unitless", e))(O || {});
+const ir = [
   {
     label: "Pixels",
     value: 0
@@ -942,16 +940,16 @@ const sn = [
     value: 1
     /* Unitless */
   }
-], vo = ({ name: e, responsive: t = !0, value: o, onChange: n }) => {
-  const i = se(o?.lineHeight) ? F.Unitless : F.Pixels, s = i === F.Unitless ? 0.1 : 1, l = mt(o?.lineHeight, "float"), a = ({ unit: c, value: g }) => {
+], mo = ({ name: e, responsive: t = !0, value: o, onChange: r }) => {
+  const i = se(o?.lineHeight) ? O.Unitless : O.Pixels, s = i === O.Unitless ? 0.1 : 1, l = mt(o?.lineHeight, "float"), a = ({ unit: c, value: g }) => {
     if (ee(g)) {
-      n?.({
-        lineHeight: c === F.Unitless ? 1 : g
+      r?.({
+        lineHeight: c === O.Unitless ? 1 : g
       });
       return;
     }
-    n?.({
-      lineHeight: c === F.Unitless ? Number(g.toFixed(1)) : `${g}px`
+    r?.({
+      lineHeight: c === O.Unitless ? Number(g.toFixed(1)) : `${g}px`
     });
   }, d = (c) => {
     a({ unit: Number(c.target.value) });
@@ -964,8 +962,8 @@ const sn = [
     c.stopPropagation(), !ee(l) && a({ unit: i, value: Math.max(l - s, 0) });
   };
   return /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", gap: 8 }, children: [
-    /* @__PURE__ */ r(J, { responsive: t, name: e ?? "Line height", children: /* @__PURE__ */ r("div", { css: { display: "flex", alignItems: "center", gap: 4 }, children: sn.map((c) => /* @__PURE__ */ r(
-      Fe,
+    /* @__PURE__ */ n(J, { responsive: t, name: e ?? "Line height", children: /* @__PURE__ */ n("div", { css: { display: "flex", alignItems: "center", gap: 4 }, children: ir.map((c) => /* @__PURE__ */ n(
+      Oe,
       {
         onChange: d,
         checked: c.value === i,
@@ -975,15 +973,15 @@ const sn = [
       },
       c.value
     )) }) }),
-    /* @__PURE__ */ r("div", { css: { display: "flex", justifyContent: "flex-end" }, children: /* @__PURE__ */ r("div", { css: { width: "50%" }, children: /* @__PURE__ */ r(
+    /* @__PURE__ */ n("div", { css: { display: "flex", justifyContent: "flex-end" }, children: /* @__PURE__ */ n("div", { css: { width: "50%" }, children: /* @__PURE__ */ n(
       Ct,
       {
         fractionDigits: 1,
-        type: i === F.Unitless ? "decimal" : "integer",
+        type: i === O.Unitless ? "decimal" : "integer",
         value: l ?? "",
         onChange: k,
-        prefix: /* @__PURE__ */ r(W, { disabled: se(l) && l <= 0, onClick: p, children: /* @__PURE__ */ r(I, { source: vt }) }),
-        suffix: /* @__PURE__ */ r(W, { onClick: u, children: /* @__PURE__ */ r(I, { source: He }) }),
+        prefix: /* @__PURE__ */ n(W, { disabled: se(l) && l <= 0, onClick: p, children: /* @__PURE__ */ n(I, { source: vt }) }),
+        suffix: /* @__PURE__ */ n(W, { onClick: u, children: /* @__PURE__ */ n(I, { source: He }) }),
         mode: "onBlur",
         css: { textAlign: "center" },
         placeholder: "normal"
@@ -1019,17 +1017,17 @@ const sn = [
     label: "Inline Grid",
     value: "inline-grid"
   }
-], xo = ({
+], Co = ({
   name: e,
   responsive: t = !1,
   availableDisplays: o,
-  onChange: n,
+  onChange: r,
   value: i
 }) => {
   const s = ee(o) ? Pe : Pe.filter((a) => o.includes(a.value)), l = (a) => {
-    n?.({ display: a });
+    r?.({ display: a });
   };
-  return /* @__PURE__ */ r(J, { name: e ?? "Display", responsive: t, children: /* @__PURE__ */ r(
+  return /* @__PURE__ */ n(J, { name: e ?? "Display", responsive: t, children: /* @__PURE__ */ n(
     xt,
     {
       css: {
@@ -1042,7 +1040,7 @@ const sn = [
       onChange: l
     }
   ) });
-}, yo = ({ value: e, onChange: t, name: o, responsive: n = !1 }) => {
+}, vo = ({ value: e, onChange: t, name: o, responsive: r = !1 }) => {
   const i = {
     flexBasis: e?.flexBasis ?? "auto",
     flexGrow: e?.flexGrow ?? 0,
@@ -1066,12 +1064,12 @@ const sn = [
         flexShrink: 1
       }
     }
-  ], l = s.find((d) => ar(d.rawValue, i))?.value, a = (d) => {
+  ], l = s.find((d) => dn(d.rawValue, i))?.value, a = (d) => {
     const k = s.find((u) => u.value === Number(d.target.value));
     k && t?.(k.rawValue);
   };
-  return /* @__PURE__ */ r(J, { name: o ?? "Content", responsive: n, children: /* @__PURE__ */ r("div", { css: { display: "inline-flex", alignItems: "center", gap: 8 }, children: s.map((d) => /* @__PURE__ */ r(
-    Fe,
+  return /* @__PURE__ */ n(J, { name: o ?? "Content", responsive: r, children: /* @__PURE__ */ n("div", { css: { display: "inline-flex", alignItems: "center", gap: 8 }, children: s.map((d) => /* @__PURE__ */ n(
+    Oe,
     {
       checked: d.value === l,
       value: d.value,
@@ -1080,13 +1078,13 @@ const sn = [
     },
     d.value
   )) }) });
-}, To = ({ name: e, value: t, onChange: o, responsive: n = !0 }) => {
-  const i = G(null), s = (l) => {
+}, xo = ({ name: e, value: t, onChange: o, responsive: r = !0 }) => {
+  const i = z(null), s = (l) => {
     o?.({
       minWidth: l
     });
   };
-  return /* @__PURE__ */ r(J, { name: e ?? "Min width", responsive: n, children: /* @__PURE__ */ r("div", { css: { position: "relative", width: "50%" }, children: /* @__PURE__ */ r(
+  return /* @__PURE__ */ n(J, { name: e ?? "Min width", responsive: r, children: /* @__PURE__ */ n("div", { css: { position: "relative", width: "50%" }, children: /* @__PURE__ */ n(
     yt,
     {
       fullWidth: !0,
@@ -1099,8 +1097,8 @@ const sn = [
       }
     }
   ) }) });
-}, Io = ({ value: e, onChange: t }) => {
-  const [o, n] = P(!1), i = (l) => {
+}, yo = ({ value: e, onChange: t }) => {
+  const [o, r] = P(!1), i = (l) => {
     t?.({ ...e, sizeVariant: l });
   }, s = (l) => {
     t?.({
@@ -1111,8 +1109,8 @@ const sn = [
       }
     });
   };
-  return /* @__PURE__ */ r(J, { name: "Text style", children: /* @__PURE__ */ w(Tt, { open: o, onOpenChange: n, placement: "right", children: [
-    /* @__PURE__ */ r(It, { children: /* @__PURE__ */ w(
+  return /* @__PURE__ */ n(J, { name: "Text style", children: /* @__PURE__ */ w(Tt, { open: o, onOpenChange: r, placement: "right", children: [
+    /* @__PURE__ */ n(It, { children: /* @__PURE__ */ w(
       "button",
       {
         css: [
@@ -1134,21 +1132,21 @@ const sn = [
           o && { backgroundColor: b.palette.black["7s"] }
         ],
         children: [
-          /* @__PURE__ */ r(I, { css: { color: "white" }, source: Mt }),
-          /* @__PURE__ */ r("span", { children: "Auto" })
+          /* @__PURE__ */ n(I, { css: { color: "white" }, source: Mt }),
+          /* @__PURE__ */ n("span", { children: "Auto" })
         ]
       }
     ) }),
-    /* @__PURE__ */ r(St, { children: /* @__PURE__ */ w("div", { style: { width: 280 }, children: [
+    /* @__PURE__ */ n(St, { children: /* @__PURE__ */ w("div", { style: { width: 280 }, children: [
       /* @__PURE__ */ w("div", { css: { display: "flex", justifyContent: "space-between", alignItems: "center", gap: 8 }, children: [
-        /* @__PURE__ */ r("div", { css: { fontWeight: 500 }, children: "Text style" }),
-        /* @__PURE__ */ r(Et, { children: /* @__PURE__ */ r(W, { children: /* @__PURE__ */ r(I, { source: $e }) }) })
+        /* @__PURE__ */ n("div", { css: { fontWeight: 500 }, children: "Text style" }),
+        /* @__PURE__ */ n(Et, { children: /* @__PURE__ */ n(W, { children: /* @__PURE__ */ n(I, { source: $e }) }) })
       ] }),
-      /* @__PURE__ */ r("hr", { css: { marginBlock: 8, borderColor: b.palette.white["1s"] } }),
+      /* @__PURE__ */ n("hr", { css: { marginBlock: 8, borderColor: b.palette.white["1s"] } }),
       /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", gap: 12 }, children: [
-        /* @__PURE__ */ r(Lt, { value: e?.sizeVariant, onChange: i }),
-        /* @__PURE__ */ r(Wt, { value: { color: e?.css?.color }, onChange: s }),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ n(Lt, { value: e?.sizeVariant, onChange: i }),
+        /* @__PURE__ */ n(Wt, { value: { color: e?.css?.color }, onChange: s }),
+        /* @__PURE__ */ n(
           Nt,
           {
             name: "Style",
@@ -1160,8 +1158,8 @@ const sn = [
             onChange: s
           }
         ),
-        /* @__PURE__ */ r(Rt, { value: { fontWeight: e?.css?.fontWeight }, onChange: s }),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ n(Rt, { value: { fontWeight: e?.css?.fontWeight }, onChange: s }),
+        /* @__PURE__ */ n(
           At,
           {
             value: {
@@ -1177,7 +1175,7 @@ const sn = [
 <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>
-`, an = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, ar = `<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"/>
@@ -1185,12 +1183,12 @@ const sn = [
 <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>
-`, cn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, cr = `<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>
-`, ln = '<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>', dn = () => {
-  const { mode: e, screen: t, setState: o, handlers: n } = $(), [i, s] = P(!1), { actions: l, canRedo: a, canUndo: d, query: k } = H((f, h) => ({
+`, lr = '<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>', dr = () => {
+  const { mode: e, screen: t, setState: o, handlers: r } = $(), [i, s] = P(!1), { actions: l, canRedo: a, canUndo: d, query: k } = H((f, h) => ({
     enabled: f.options.enabled,
     canUndo: h.history.canUndo(),
     canRedo: h.history.canRedo()
@@ -1199,10 +1197,10 @@ const sn = [
   }, p = () => {
     o({ mode: e === "full" ? "compact" : "full" });
   }, c = () => {
-    n.close();
+    r.close();
   }, g = async () => {
     try {
-      s(!0), l.selectNode(), await n.submit(k.getSerializedNodes());
+      s(!0), l.selectNode(), await r.submit(k.getSerializedNodes());
     } finally {
       s(!1);
     }
@@ -1222,8 +1220,8 @@ const sn = [
       },
       children: [
         /* @__PURE__ */ w("div", { css: { display: "flex", alignItems: "center", gap: 12 }, children: [
-          /* @__PURE__ */ r(W, { size: "32", onClick: c, children: /* @__PURE__ */ r(I, { source: ln }) }),
-          /* @__PURE__ */ r(Dt, { onSelectionChange: u, value: t, children: Bt.map(({ icon: f, size: h }) => /* @__PURE__ */ r(W, { value: h, children: /* @__PURE__ */ r(I, { source: f }) }, h)) }),
+          /* @__PURE__ */ n(W, { size: "32", onClick: c, children: /* @__PURE__ */ n(I, { source: lr }) }),
+          /* @__PURE__ */ n(Dt, { onSelectionChange: u, value: t, children: Bt.map(({ icon: f, size: h }) => /* @__PURE__ */ n(W, { value: h, children: /* @__PURE__ */ n(I, { source: f }) }, h)) }),
           /* @__PURE__ */ w(
             "div",
             {
@@ -1236,12 +1234,12 @@ const sn = [
                 backgroundColor: b.palette.white["1s"]
               },
               children: [
-                /* @__PURE__ */ r(W, { onClick: l.history.undo, disabled: !d, children: /* @__PURE__ */ r(I, { source: je }) }),
-                /* @__PURE__ */ r(W, { onClick: l.history.redo, disabled: !a, children: /* @__PURE__ */ r(I, { source: je, css: { transform: "rotate(180deg)" } }) })
+                /* @__PURE__ */ n(W, { onClick: l.history.undo, disabled: !d, children: /* @__PURE__ */ n(I, { source: je }) }),
+                /* @__PURE__ */ n(W, { onClick: l.history.redo, disabled: !a, children: /* @__PURE__ */ n(I, { source: je, css: { transform: "rotate(180deg)" } }) })
               ]
             }
           ),
-          /* @__PURE__ */ r(
+          /* @__PURE__ */ n(
             "div",
             {
               css: {
@@ -1252,28 +1250,28 @@ const sn = [
                 borderRadius: 8,
                 backgroundColor: b.palette.white["1s"]
               },
-              children: /* @__PURE__ */ r(W, { onClick: p, children: /* @__PURE__ */ r(I, { source: e === "full" ? cn : an }) })
+              children: /* @__PURE__ */ n(W, { onClick: p, children: /* @__PURE__ */ n(I, { source: e === "full" ? cr : ar }) })
             }
           )
         ] }),
-        /* @__PURE__ */ r("div", { css: { display: "flex", alignItems: "center", gap: 12 }, children: /* @__PURE__ */ r(oe, { isLoading: i, onClick: g, children: "Save" }) })
+        /* @__PURE__ */ n("div", { css: { display: "flex", alignItems: "center", gap: 12 }, children: /* @__PURE__ */ n(oe, { isLoading: i, onClick: g, children: "Save" }) })
       ]
     }
   );
-}, hn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+}, hr = `<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>
-`, un = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, ur = `<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>
-`, pn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, pr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <rect x="3.00024" y="3" width="17.9997" height="17.9997" rx="2" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M13.5 20.9998V12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M9.50011 11.9998V3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M20.9999 12H3.00024" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, gn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, gr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <rect x="3" y="3" width="18" height="18" rx="2" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M3 12H21" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M12 21V3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
@@ -1284,17 +1282,17 @@ const sn = [
 <path d="M6 21H18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M6 3H18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, fn = {
+`, fr = {
   name: "Layout",
   templates: [
     {
       name: "Container",
-      template: /* @__PURE__ */ r(Pt, {}),
+      template: /* @__PURE__ */ n(Pt, {}),
       icon: { source: Ve, height: 32 }
     },
     {
       name: "Block",
-      template: /* @__PURE__ */ r(jt, {}),
+      template: /* @__PURE__ */ n(jt, {}),
       icon: { source: Ve, height: 32 }
     },
     {
@@ -1311,17 +1309,17 @@ const sn = [
             paddingBottom: 16
           },
           children: [
-            /* @__PURE__ */ r(Me, {}),
-            /* @__PURE__ */ r(Me, {})
+            /* @__PURE__ */ n(Me, {}),
+            /* @__PURE__ */ n(Me, {})
           ]
         }
       ),
-      icon: { source: gn, height: 32 }
+      icon: { source: gr, height: 32 }
     },
     {
       name: "Flex",
-      template: /* @__PURE__ */ w(Ot, { sx: { columnGap: 8, rowGap: 8, paddingTop: 16, paddingBottom: 16 }, children: [
-        /* @__PURE__ */ r(
+      template: /* @__PURE__ */ w(Ft, { sx: { columnGap: 8, rowGap: 8, paddingTop: 16, paddingBottom: 16 }, children: [
+        /* @__PURE__ */ n(
           Se,
           {
             sx: {
@@ -1329,7 +1327,7 @@ const sn = [
             }
           }
         ),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ n(
           Se,
           {
             sx: {
@@ -1338,10 +1336,10 @@ const sn = [
           }
         )
       ] }),
-      icon: { source: pn, height: 32 }
+      icon: { source: pr, height: 32 }
     }
   ]
-}, bn = `<svg height="24" width="24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512" xml:space="preserve">
+}, br = `<svg height="24" width="24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512" xml:space="preserve">
   <style type="text/css">
     .st0{fill:currentColor;}
   </style>
@@ -1370,30 +1368,30 @@ const sn = [
 		c4.709,14.802,17.357,22.204,33.644,22.204c16.286,0,28.668-8.204,33.374-22.881c1.617-5.111,2.29-12.645,2.29-20.716v-0.95
 		C372.362,303.664,369.538,300.836,364.556,300.836z"/>
   </g>
-</svg>`, wn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+</svg>`, wr = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M20.64 15.3735L16.5187 11.2522C16.1434 10.8769 15.5357 10.8769 15.1613 11.2522L11.04 15.3735" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path fill-rule="evenodd" clip-rule="evenodd" d="M17.76 20.1736H6.24C4.64928 20.1736 3.36 18.8843 3.36 17.2936V5.77355C3.36 4.18283 4.64928 2.89355 6.24 2.89355H17.76C19.3507 2.89355 20.64 4.18283 20.64 5.77355V17.2936C20.64 18.8843 19.3507 20.1736 17.76 20.1736Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M15.84 20.1734L9.79872 14.1321C9.42336 13.7567 8.81568 13.7567 8.44128 14.1321L3.78816 18.7852" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M9.37456 8.39927C9.51515 8.53986 9.51515 8.7678 9.37456 8.90839C9.23397 9.04898 9.00603 9.04898 8.86544 8.90839C8.72485 8.7678 8.72485 8.53986 8.86544 8.39927C9.00603 8.25868 9.23397 8.25868 9.37456 8.39927" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, kn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, kr = `<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="M10.2939 12L14.6229 9.5L10.2939 7V12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path fill-rule="evenodd" clip-rule="evenodd" d="M19.889 3.38867H4.111C3.497 3.38867 3 3.88567 3 4.49967V14.4997C3 15.1137 3.497 15.6107 4.111 15.6107H19.889C20.503 15.6107 21 15.1137 21 14.4997V4.49967C21 3.88567 20.503 3.38867 19.889 3.38867Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M8.56066 18.9393C9.14645 19.5251 9.14645 20.4749 8.56066 21.0607C7.97487 21.6464 7.02513 21.6464 6.43934 21.0607C5.85355 20.4749 5.85355 19.5251 6.43934 18.9393C7.02513 18.3536 7.97487 18.3536 8.56066 18.9393" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M21 20H9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M3 20H6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, mn = {
+`, mr = {
   name: "Media",
   templates: [
     {
       name: "Image",
-      template: /* @__PURE__ */ r(Ft, { src: "https://ucarecdn.com/ee6d5074-1640-4cc7-8933-47c8589c3dee/-/format/auto/" }),
-      icon: { source: wn, height: 32 }
+      template: /* @__PURE__ */ n(Ot, { src: "https://ucarecdn.com/ee6d5074-1640-4cc7-8933-47c8589c3dee/-/format/auto/" }),
+      icon: { source: wr, height: 32 }
     },
     {
       name: "Video",
-      template: /* @__PURE__ */ r(
+      template: /* @__PURE__ */ n(
         Ht,
         {
           sx: {
@@ -1402,53 +1400,53 @@ const sn = [
           src: "https://cdn.shopify.com/videos/c/o/v/2cd3deb506b54b009063f7270ab5cf2e.mp4"
         }
       ),
-      icon: { source: kn, height: 32 }
+      icon: { source: kr, height: 32 }
     },
     {
       name: "Icon",
-      template: /* @__PURE__ */ r($t, { source: _t }),
-      icon: { source: bn, height: 32 }
+      template: /* @__PURE__ */ n($t, { source: _t }),
+      icon: { source: br, height: 32 }
     }
   ]
-}, Cn = `<svg fill="currentColor" width="24" height="24" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
+}, Cr = `<svg fill="currentColor" width="24" height="24" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
   <title>h</title>
   <path d="M25.264 3.993h-0.928c-0.442 0-0.8 0.358-0.801 0.8v9.952h-15.038v-9.952c-0-0.442-0.358-0.8-0.8-0.8h-0.928c-0.442 0-0.8 0.358-0.8 0.8v22.4c0 0.442 0.358 0.8 0.8 0.801h0.928c0.442-0.001 0.8-0.359 0.8-0.801v0-9.952h15.038v9.952c0.001 0.442 0.359 0.8 0.801 0.801h0.928c0.442-0.001 0.8-0.359 0.801-0.801v-22.4c-0.001-0.442-0.359-0.8-0.801-0.8h-0z"/>
 </svg>
-`, vn = `<svg fill="currentColor" width="24" height="24" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
+`, vr = `<svg fill="currentColor" width="24" height="24" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
   <title>p</title>
   <path d="M24.223 6.397c-1.592-1.495-3.741-2.413-6.104-2.413-0.137 0-0.274 0.003-0.41 0.009l0.019-0.001h-8.416c-0.442 0-0.8 0.358-0.8 0.8v22.4c0 0.442 0.358 0.8 0.8 0.801h0.928c0.442-0.001 0.8-0.359 0.8-0.801v0-6.561h6.688c0.117 0.005 0.253 0.009 0.391 0.009 2.363 0 4.512-0.918 6.108-2.417l-0.005 0.004c1.521-1.457 2.466-3.504 2.466-5.772 0-0.050-0-0.101-0.001-0.151l0 0.008c0.001-0.042 0.001-0.093 0.001-0.143 0-2.268-0.945-4.316-2.463-5.771l-0.003-0.003zM11.040 6.521h6.624c0.12-0.008 0.259-0.012 0.4-0.012 1.678 0 3.208 0.636 4.361 1.68l-0.006-0.005c1.054 0.998 1.709 2.407 1.709 3.969 0 0.056-0.001 0.112-0.003 0.168l0-0.008c0.001 0.047 0.002 0.101 0.002 0.156 0 1.569-0.656 2.985-1.709 3.988l-0.002 0.002c-1.145 1.047-2.676 1.689-4.357 1.689-0.14 0-0.278-0.004-0.416-0.013l0.019 0.001h-6.624z"/>
 </svg>
-`, xn = {
+`, xr = {
   name: "Text",
   templates: [
     {
       name: "Heading",
-      template: /* @__PURE__ */ r(zt, { as: "h2", sizeVariant: "4xl", md: { sizeVariant: "5xl" }, children: "Your heading text goes here" }),
-      icon: { source: Cn, height: 32 }
+      template: /* @__PURE__ */ n(Gt, { as: "h2", sizeVariant: "4xl", md: { sizeVariant: "5xl" }, children: "Your heading text goes here" }),
+      icon: { source: Cr, height: 32 }
     },
     {
       name: "Paragraph",
-      template: /* @__PURE__ */ r(Gt, { children: "Replace this text with your content" }),
-      icon: { source: vn, height: 32 }
+      template: /* @__PURE__ */ n(zt, { children: "Replace this text with your content" }),
+      icon: { source: vr, height: 32 }
     }
   ]
-}, yn = [
-  fn,
-  xn,
-  mn,
+}, yr = [
+  fr,
+  xr,
+  mr,
   Ut,
   Zt,
   Yt,
   Xt
-], Tn = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/></svg>', In = {
+], Tr = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/></svg>', Ir = {
   name: "Basics",
-  icon: { source: Tn },
-  renderer: () => /* @__PURE__ */ r(Sn, { elementGroups: yn })
-}, Mn = ({ groups: e }) => {
-  const t = [In, ...e ?? []];
+  icon: { source: Tr },
+  renderer: () => /* @__PURE__ */ n(Sr, { elementGroups: yr })
+}, Mr = ({ groups: e }) => {
+  const t = [Ir, ...e ?? []];
   return /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", height: "100%" }, children: [
-    /* @__PURE__ */ r("div", { css: { display: "flex", padding: 8, alignItems: "center", gap: 12 }, children: /* @__PURE__ */ r(_e, { fullWidth: !0, placeholder: "Search...", prefix: /* @__PURE__ */ r(I, { source: hn }) }) }),
-    /* @__PURE__ */ r(
+    /* @__PURE__ */ n("div", { css: { display: "flex", padding: 8, alignItems: "center", gap: 12 }, children: /* @__PURE__ */ n(_e, { fullWidth: !0, placeholder: "Search...", prefix: /* @__PURE__ */ n(I, { source: hr }) }) }),
+    /* @__PURE__ */ n(
       ce,
       {
         css: {
@@ -1458,31 +1456,31 @@ const sn = [
           borderColor: b.palette.white["1s"],
           flex: 1
         },
-        children: t.map((o, n) => /* @__PURE__ */ r(Ln, { group: o }, n))
+        children: t.map((o, r) => /* @__PURE__ */ n(Lr, { group: o }, r))
       }
     )
   ] });
-}, Sn = ({ elementGroups: e }) => /* @__PURE__ */ r("div", { css: { display: "flex", flexDirection: "column", gap: 8 }, children: e.map((t, o) => /* @__PURE__ */ r(En, { group: t }, o)) }), En = ({ group: e }) => {
-  const [t, o] = st(!0), { actions: n, connectors: i } = H();
+}, Sr = ({ elementGroups: e }) => /* @__PURE__ */ n("div", { css: { display: "flex", flexDirection: "column", gap: 8 }, children: e.map((t, o) => /* @__PURE__ */ n(Er, { group: t }, o)) }), Er = ({ group: e }) => {
+  const [t, o] = st(!0), { actions: r, connectors: i } = H();
   return /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", ...b.text.sm }, children: [
-    /* @__PURE__ */ r(oe, { onClick: o, css: { paddingInline: 0, backgroundColor: "transparent" }, children: /* @__PURE__ */ w(
+    /* @__PURE__ */ n(oe, { onClick: o, css: { paddingInline: 0, backgroundColor: "transparent" }, children: /* @__PURE__ */ w(
       "div",
       {
         css: { display: "flex", alignItems: "center", justifyContent: "space-between", flex: 1, ...b.text.sm },
         children: [
           e.name,
-          /* @__PURE__ */ r(
+          /* @__PURE__ */ n(
             I,
             {
-              source: ze,
+              source: Ge,
               css: [{ transition: "transform" }, !t && { transform: "rotate(180deg)" }]
             }
           )
         ]
       }
     ) }),
-    /* @__PURE__ */ r(qt, { open: t, children: /* @__PURE__ */ r("div", { css: { display: "grid", paddingBlock: 8, gap: 16, gridTemplateColumns: "repeat(2, minmax(0, 1fr))" }, children: e.templates?.map((s, l) => /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", gap: 4 }, children: [
-      /* @__PURE__ */ r(
+    /* @__PURE__ */ n(Jt, { open: t, children: /* @__PURE__ */ n("div", { css: { display: "grid", paddingBlock: 8, gap: 16, gridTemplateColumns: "repeat(2, minmax(0, 1fr))" }, children: e.templates?.map((s, l) => /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", gap: 4 }, children: [
+      /* @__PURE__ */ n(
         "div",
         {
           css: {
@@ -1513,18 +1511,18 @@ const sn = [
           ref: (a) => {
             a && i.create(a, s.template, {
               onCreate(d) {
-                (typeof s.autoFocus == "function" ? s.autoFocus(d) : s.autoFocus) && n.selectNode(d.rootNodeId), s.onCreate?.(d);
+                (typeof s.autoFocus == "function" ? s.autoFocus(d) : s.autoFocus) && r.selectNode(d.rootNodeId), s.onCreate?.(d);
               }
             });
           },
-          children: s.icon && /* @__PURE__ */ r(Jt, { width: void 0, height: void 0, ...s.icon })
+          children: s.icon && /* @__PURE__ */ n(Kt, { width: void 0, height: void 0, ...s.icon })
         }
       ),
-      /* @__PURE__ */ r("p", { css: { marginInline: "auto", textAlign: "center", ...Ge.xs }, children: s.name })
+      /* @__PURE__ */ n("p", { css: { marginInline: "auto", textAlign: "center", ...ze.xs }, children: s.name })
     ] }, l)) }) })
   ] });
-}, Ln = ({ group: e }) => {
-  const [t, o] = P(!1), { refs: n, floatingStyles: i, context: s } = le({
+}, Lr = ({ group: e }) => {
+  const [t, o] = P(!1), { refs: r, floatingStyles: i, context: s } = le({
     open: t,
     onOpenChange: o,
     placement: "right-start",
@@ -1543,9 +1541,9 @@ const sn = [
     whileElementsMounted: de
   });
   V(() => {
-    n.setPositionReference(document.querySelector("aside"));
-  }, [n]);
-  const l = Ke(s, { move: !1, handleClose: vr() }), a = Qe(s), d = et(s), k = tt(s), { getReferenceProps: u, getFloatingProps: p } = rt([l, a, d, k]), c = e.renderer;
+    r.setPositionReference(document.querySelector("aside"));
+  }, [r]);
+  const l = Ke(s, { move: !1, handleClose: Tn() }), a = Qe(s), d = et(s), k = tt(s), { getReferenceProps: u, getFloatingProps: p } = nt([l, a, d, k]), c = e.renderer;
   return /* @__PURE__ */ w(ie, { children: [
     /* @__PURE__ */ w(
       "button",
@@ -1566,10 +1564,10 @@ const sn = [
           }
         },
         ...u(),
-        ref: n.setReference,
+        ref: r.setReference,
         children: [
-          e.icon && /* @__PURE__ */ r("div", { css: { padding: 6, borderRadius: 8, backgroundColor: b.palette.white["1s"] }, children: /* @__PURE__ */ r(I, { ...e.icon }) }),
-          /* @__PURE__ */ r(
+          e.icon && /* @__PURE__ */ n("div", { css: { padding: 6, borderRadius: 8, backgroundColor: b.palette.white["1s"] }, children: /* @__PURE__ */ n(I, { ...e.icon }) }),
+          /* @__PURE__ */ n(
             "span",
             {
               css: {
@@ -1581,11 +1579,11 @@ const sn = [
               children: e.name
             }
           ),
-          /* @__PURE__ */ r(I, { css: { transform: "rotate(180deg)" }, source: un })
+          /* @__PURE__ */ n(I, { css: { transform: "rotate(180deg)" }, source: ur })
         ]
       }
     ),
-    t && /* @__PURE__ */ r(he, { children: /* @__PURE__ */ r("div", { style: i, ...p(), ref: n.setFloating, children: /* @__PURE__ */ w(
+    t && /* @__PURE__ */ n(he, { children: /* @__PURE__ */ n("div", { style: i, ...p(), ref: r.setFloating, children: /* @__PURE__ */ w(
       "div",
       {
         css: {
@@ -1602,14 +1600,14 @@ const sn = [
           ...b.text.sm
         },
         children: [
-          /* @__PURE__ */ r("div", { css: { display: "flex", paddingInline: 8, alignItems: "center", height: 48 }, children: /* @__PURE__ */ r("h6", { css: { fontWeight: 500 }, children: e.name }) }),
-          /* @__PURE__ */ r(ce, { css: { paddingInline: 12, flex: 1 }, children: c ? /* @__PURE__ */ r(c, {}) : /* @__PURE__ */ r("div", { css: { display: "flex", flexDirection: "column", gap: 16 }, children: e.templates?.map((g, f) => /* @__PURE__ */ wr(Wn, { ...g, key: f })) }) })
+          /* @__PURE__ */ n("div", { css: { display: "flex", paddingInline: 8, alignItems: "center", height: 48 }, children: /* @__PURE__ */ n("h6", { css: { fontWeight: 500 }, children: e.name }) }),
+          /* @__PURE__ */ n(ce, { css: { paddingInline: 12, flex: 1 }, children: c ? /* @__PURE__ */ n(c, {}) : /* @__PURE__ */ n("div", { css: { display: "flex", flexDirection: "column", gap: 16 }, children: e.templates?.map((g, f) => /* @__PURE__ */ Cn(Wr, { ...g, key: f })) }) })
         ]
       }
     ) }) })
   ] });
-}, Wn = ({ template: e, autoFocus: t = !0, onCreate: o }) => {
-  const [, n] = P(!1), i = $(), { actions: s, connectors: l, resolver: a, query: d } = H((u) => ({
+}, Wr = ({ template: e, autoFocus: t = !0, onCreate: o }) => {
+  const [, r] = P(!1), i = $(), { actions: s, connectors: l, resolver: a, query: d } = H((u) => ({
     resolver: u.options.resolver
   })), k = P(() => {
     const u = typeof e == "function" ? e() : e;
@@ -1617,7 +1615,7 @@ const sn = [
     "rootNodeId" in u ? p = u : p = d.parseReactElement(u).toNodeTree();
     const { rootNodeId: c, nodes: g } = p, f = {};
     return Object.entries(g).forEach(([h, y]) => {
-      const m = sr(y.data, a), T = h === c ? _ : h;
+      const m = qt(y.data, a), T = h === c ? _ : h;
       f[T] = {
         ...m,
         parent: m.parent === c ? _ : m.parent,
@@ -1625,7 +1623,7 @@ const sn = [
       };
     }), f;
   })[0];
-  return /* @__PURE__ */ r(
+  return /* @__PURE__ */ n(
     "div",
     {
       css: {
@@ -1643,9 +1641,9 @@ const sn = [
           }
         });
       },
-      onDragStart: () => n(!0),
-      onDragEnd: () => n(!1),
-      children: /* @__PURE__ */ r(
+      onDragStart: () => r(!0),
+      onDragEnd: () => r(!1),
+      children: /* @__PURE__ */ n(
         "div",
         {
           css: {
@@ -1656,7 +1654,7 @@ const sn = [
             width: 240,
             aspectRatio: "16 / 9"
           },
-          children: /* @__PURE__ */ r("div", { css: { position: "absolute", inset: 0 }, children: /* @__PURE__ */ r(
+          children: /* @__PURE__ */ n("div", { css: { position: "absolute", inset: 0 }, children: /* @__PURE__ */ n(
             pt,
             {
               containerProps: {
@@ -1664,15 +1662,15 @@ const sn = [
                   backgroundColor: i.theme.palette.background.default
                 }
               },
-              viewport: { width: gr.md.minWidth },
-              children: /* @__PURE__ */ r(nt, { resolver: a, children: /* @__PURE__ */ r(ot, { data: k }) })
+              viewport: { width: wn.md.minWidth },
+              children: /* @__PURE__ */ n(rt, { resolver: a, children: /* @__PURE__ */ n(ot, { data: k }) })
             }
           ) })
         }
       )
     }
   );
-}, Nn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+}, Nr = `<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"/>
@@ -1683,35 +1681,35 @@ const sn = [
 <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>
-`, Rn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, Rr = `<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>
-`, An = (e) => {
+`, Ar = (e) => {
   const { query: t, actions: o } = H(), {
-    id: n,
+    id: r,
     expanded: i,
     actions: s,
     displayName: l,
     children: a,
     depth: d
-  } = Tr((g) => ({
+  } = tn((g) => ({
     expanded: g.expanded,
-    displayName: Ue(t.node(g.id).get())
+    displayName: Ze(t.node(g.id).get())
   })), { selected: k, selectable: u } = H((g, f) => {
-    const h = f.node(n).get();
+    const h = f.node(r).get();
     return {
-      selected: f.getEvent("selected").contains(n),
+      selected: f.getEvent("selected").contains(r),
       nodeDOM: h.dom,
-      selectable: Ze(h)
+      selectable: Ue(h)
     };
   });
   V(() => {
-    n === _ && s.setExpandedState(!0);
-  }, [s, n]), V(() => {
+    r === _ && s.setExpandedState(!0);
+  }, [s, r]), V(() => {
     if (a.length === 0) return;
     a.some((f) => {
       const h = t.getEvent("selected").all();
@@ -1719,7 +1717,7 @@ const sn = [
     }) && s.setExpandedState(!0);
   }, [a, s, t]);
   const p = () => {
-    o.selectNode(n);
+    o.selectNode(r);
   }, c = (g) => {
     g.stopPropagation(), s.toggleLayer();
   };
@@ -1751,10 +1749,10 @@ const sn = [
               },
               !u && { pointerEvents: "none" },
               k && { backgroundColor: b.palette.black["7s"] },
-              n === _ && { display: "none" }
+              r === _ && { display: "none" }
             ],
             children: [
-              a.length ? /* @__PURE__ */ r(W, { css: { pointerEvents: "auto" }, onClick: c, children: /* @__PURE__ */ r(
+              a.length ? /* @__PURE__ */ n(W, { css: { pointerEvents: "auto" }, onClick: c, children: /* @__PURE__ */ n(
                 I,
                 {
                   css: [
@@ -1762,10 +1760,10 @@ const sn = [
                     i && { transform: "rotate(0deg)" }
                   ],
                   size: 16,
-                  source: ze
+                  source: Ge
                 }
-              ) }) : /* @__PURE__ */ r("div", { css: { padding: 4 }, children: /* @__PURE__ */ r(I, { size: 16, source: Rn }) }),
-              /* @__PURE__ */ r(
+              ) }) : /* @__PURE__ */ n("div", { css: { padding: 4 }, children: /* @__PURE__ */ n(I, { size: 16, source: Rr }) }),
+              /* @__PURE__ */ n(
                 "span",
                 {
                   css: [
@@ -1783,7 +1781,7 @@ const sn = [
             ]
           }
         ),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ n(
           "div",
           {
             css: {
@@ -1797,12 +1795,12 @@ const sn = [
       ]
     }
   );
-}, Dn = ({ onClose: e }) => {
-  const t = Sr(), o = (n) => {
-    t.start(n);
+}, Dr = ({ onClose: e }) => {
+  const t = En(), o = (r) => {
+    t.start(r);
   };
-  return /* @__PURE__ */ r(he, { children: /* @__PURE__ */ w(
-    Kt.div,
+  return /* @__PURE__ */ n(he, { children: /* @__PURE__ */ w(
+    Qt.div,
     {
       drag: !0,
       dragControls: t,
@@ -1834,8 +1832,8 @@ const sn = [
             },
             children: [
               /* @__PURE__ */ w("div", { css: { display: "flex", alignItems: "center", gap: 8 }, children: [
-                /* @__PURE__ */ r(I, { source: Nn }),
-                /* @__PURE__ */ r(
+                /* @__PURE__ */ n(I, { source: Nr }),
+                /* @__PURE__ */ n(
                   "p",
                   {
                     css: {
@@ -1846,11 +1844,11 @@ const sn = [
                   }
                 )
               ] }),
-              /* @__PURE__ */ r(W, { onClick: e, children: /* @__PURE__ */ r(I, { source: $e }) })
+              /* @__PURE__ */ n(W, { onClick: e, children: /* @__PURE__ */ n(I, { source: $e }) })
             ]
           }
         ),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ n(
           "div",
           {
             css: {
@@ -1861,7 +1859,7 @@ const sn = [
               borderColor: b.palette.white["1s"],
               flex: 1
             },
-            children: /* @__PURE__ */ r(yr, { renderLayer: An })
+            children: /* @__PURE__ */ n(en, { renderLayer: Ar })
           }
         )
       ]
@@ -1877,10 +1875,10 @@ const sn = [
   blue: "Blue",
   neutral: "Neutral",
   violet: "Violet"
-}, Bn = ["primary", "secondary"], Pn = Object.keys(gt), jn = [100, 200, 300, 400, 500, 600, 700, 800], Vn = () => {
-  const e = $(), t = !!e.handlers.saveTheme, o = e.theme.palette, n = G(e.theme), i = G(!1);
+}, Br = ["primary", "secondary"], Pr = Object.keys(gt), jr = [100, 200, 300, 400, 500, 600, 700, 800], Vr = () => {
+  const e = $(), t = !!e.handlers.saveTheme, o = e.theme.palette, r = z(e.theme), i = z(!1);
   V(() => {
-    const c = n.current;
+    const c = r.current;
     return () => {
       i.current || e.setState({ theme: c });
     };
@@ -1913,11 +1911,11 @@ const sn = [
       k(!1);
     }
   }, p = () => {
-    e.setState({ theme: n.current, action: void 0 });
+    e.setState({ theme: r.current, action: void 0 });
   };
   return /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", height: "100%" }, children: [
-    /* @__PURE__ */ r("div", { css: { display: "flex", padding: 8, alignItems: "center" }, children: /* @__PURE__ */ r("h6", { css: { fontWeight: 500 }, children: "Palette" }) }),
-    /* @__PURE__ */ r(
+    /* @__PURE__ */ n("div", { css: { display: "flex", padding: 8, alignItems: "center" }, children: /* @__PURE__ */ n("h6", { css: { fontWeight: 500 }, children: "Palette" }) }),
+    /* @__PURE__ */ n(
       ce,
       {
         css: {
@@ -1928,13 +1926,13 @@ const sn = [
           borderColor: b.palette.white["1s"],
           flex: 1
         },
-        children: /* @__PURE__ */ r("div", { css: { display: "flex", flexDirection: "column", gap: 12 }, children: Pn.map((c) => {
-          const g = s(c), f = Bn.includes(c);
+        children: /* @__PURE__ */ n("div", { css: { display: "flex", flexDirection: "column", gap: 12 }, children: Pr.map((c) => {
+          const g = s(c), f = Br.includes(c);
           return /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", gap: 4 }, children: [
-            /* @__PURE__ */ r("p", { css: { ...Ge.xs, color: b.palette.white["4s"] }, children: gt[c] }),
+            /* @__PURE__ */ n("p", { css: { ...ze.xs, color: b.palette.white["4s"] }, children: gt[c] }),
             /* @__PURE__ */ w("div", { css: { display: "flex", alignItems: "center", gap: 8 }, children: [
               t && f && /* @__PURE__ */ w("div", { css: { display: "flex", gap: 4 }, children: [
-                /* @__PURE__ */ r(
+                /* @__PURE__ */ n(
                   Ee,
                   {
                     hidePalette: !0,
@@ -1943,7 +1941,7 @@ const sn = [
                     placement: "right-start"
                   }
                 ),
-                /* @__PURE__ */ r(
+                /* @__PURE__ */ n(
                   Ee,
                   {
                     hidePalette: !0,
@@ -1953,7 +1951,7 @@ const sn = [
                   }
                 )
               ] }),
-              /* @__PURE__ */ r(
+              /* @__PURE__ */ n(
                 "div",
                 {
                   css: {
@@ -1961,7 +1959,7 @@ const sn = [
                     gap: 4,
                     flex: 1
                   },
-                  children: jn.map((h) => /* @__PURE__ */ r(
+                  children: jr.map((h) => /* @__PURE__ */ n(
                     "div",
                     {
                       css: {
@@ -1974,7 +1972,7 @@ const sn = [
                         borderColor: b.palette.white["3s"]
                       },
                       title: `${c}.${h}`,
-                      children: /* @__PURE__ */ r(
+                      children: /* @__PURE__ */ n(
                         "div",
                         {
                           css: { width: "100%", height: "100%", borderRadius: 1 },
@@ -2003,29 +2001,29 @@ const sn = [
           borderColor: b.palette.white["1s"]
         },
         children: [
-          /* @__PURE__ */ r(oe, { variant: "text", onClick: p, disabled: d, css: { flex: 1 }, children: "Cancel" }),
-          /* @__PURE__ */ r(oe, { onClick: u, isLoading: d, css: { flex: 1 }, children: d ? "Saving..." : "Save" })
+          /* @__PURE__ */ n(oe, { variant: "text", onClick: p, disabled: d, css: { flex: 1 }, children: "Cancel" }),
+          /* @__PURE__ */ n(oe, { onClick: u, isLoading: d, css: { flex: 1 }, children: d ? "Saving..." : "Save" })
         ]
       }
     )
   ] });
-}, On = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+}, Fr = `<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>
-`, Fn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, Or = `<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>
-`, Hn = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, Hr = `<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="M20.221 4.29206V4.29206C19.438 3.50906 18.183 3.46806 17.35 4.19606L9.31298 11.2281C8.44198 11.9901 8.39798 13.3291 9.21598 14.1471L10.365 15.2961C11.183 16.1141 12.523 16.0691 13.284 15.1991L20.316 7.16206C21.045 6.33006 21.003 5.07506 20.221 4.29206V4.29206Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M10.87 9.87012L14.65 13.6501" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path fill-rule="evenodd" clip-rule="evenodd" d="M3.59903 20.3231H7.30203C10.287 20.3231 11.782 16.7141 9.67103 14.6031V14.6031C8.11903 13.0511 5.48303 13.6221 4.71303 15.6771L3.19103 19.7351C3.08503 20.0201 3.29503 20.3231 3.59903 20.3231Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
-`, $n = ({ insert: e }) => {
-  const [t, o] = st(!1), { action: n = "insert", setState: i } = $(), { actions: s, isDeletable: l, focusedNode: a } = H((p, c) => {
+`, $r = ({ insert: e }) => {
+  const [t, o] = st(!1), { action: r = "insert", setState: i } = $(), { actions: s, isDeletable: l, focusedNode: a } = H((p, c) => {
     const g = c.getEvent("selected").first(), f = g ? c.node(g) : null;
     return {
       enabled: p.options.enabled,
@@ -2057,8 +2055,8 @@ const sn = [
         },
         children: [
           /* @__PURE__ */ w("div", { css: { display: "flex", paddingInline: 4, flexDirection: "column", gap: 4 }, children: [
-            !!e && /* @__PURE__ */ w(Oe, { children: [
-              /* @__PURE__ */ r(
+            !!e && /* @__PURE__ */ w(Fe, { children: [
+              /* @__PURE__ */ n(
                 W,
                 {
                   tooltip: {
@@ -2069,12 +2067,12 @@ const sn = [
                   value: "insert",
                   css: { position: "relative" },
                   size: "32",
-                  children: /* @__PURE__ */ r(I, { source: He })
+                  children: /* @__PURE__ */ n(I, { source: He })
                 }
               ),
-              /* @__PURE__ */ r("hr", { css: { borderColor: b.palette.white["2s"] } })
+              /* @__PURE__ */ n("hr", { css: { borderColor: b.palette.white["2s"] } })
             ] }),
-            /* @__PURE__ */ r(
+            /* @__PURE__ */ n(
               W,
               {
                 tooltip: {
@@ -2085,11 +2083,11 @@ const sn = [
                 value: "layers",
                 css: { position: "relative" },
                 size: "32",
-                children: /* @__PURE__ */ r(I, { source: On })
+                children: /* @__PURE__ */ n(I, { source: Fr })
               }
             ),
-            /* @__PURE__ */ r("hr", { css: { borderColor: b.palette.white["2s"] } }),
-            /* @__PURE__ */ r(
+            /* @__PURE__ */ n("hr", { css: { borderColor: b.palette.white["2s"] } }),
+            /* @__PURE__ */ n(
               W,
               {
                 tooltip: {
@@ -2100,7 +2098,7 @@ const sn = [
                 value: "theme",
                 css: { position: "relative" },
                 size: "32",
-                children: /* @__PURE__ */ r(I, { source: Hn })
+                children: /* @__PURE__ */ n(I, { source: Hr })
               }
             )
           ] }),
@@ -2118,15 +2116,15 @@ const sn = [
                 borderColor: b.palette.white["1s"]
               },
               children: [
-                n === "theme" && /* @__PURE__ */ r("div", { css: { overflow: "auto", flex: 1 }, children: /* @__PURE__ */ r(Vn, {}) }),
-                n !== "theme" && !a?.related.inspector && /* @__PURE__ */ r("div", { css: { overflow: "auto", flex: 1 }, children: n === "insert" && !!e && /* @__PURE__ */ r(Mn, { groups: e.groups }) }),
-                n !== "theme" && !!a?.related?.inspector && /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", overflow: "hidden", flex: 1 }, children: [
+                r === "theme" && /* @__PURE__ */ n("div", { css: { overflow: "auto", flex: 1 }, children: /* @__PURE__ */ n(Vr, {}) }),
+                r !== "theme" && !a?.related.inspector && /* @__PURE__ */ n("div", { css: { overflow: "auto", flex: 1 }, children: r === "insert" && !!e && /* @__PURE__ */ n(Mr, { groups: e.groups }) }),
+                r !== "theme" && !!a?.related?.inspector && /* @__PURE__ */ w("div", { css: { display: "flex", flexDirection: "column", overflow: "hidden", flex: 1 }, children: [
                   /* @__PURE__ */ w("div", { css: { display: "flex", paddingInline: 8, paddingBlock: 8, alignItems: "center", gap: 8 }, children: [
-                    /* @__PURE__ */ r(W, { onClick: d, children: /* @__PURE__ */ r(I, { source: Fn }) }),
-                    /* @__PURE__ */ r("div", { css: { overflow: "hidden", flex: 1 }, children: /* @__PURE__ */ r(_e, { fullWidth: !0, value: Ue(a), size: "32" }) }),
-                    l && /* @__PURE__ */ r(W, { value: a.id, onClick: k, children: /* @__PURE__ */ r(I, { css: { color: b.palette.red["4s"] }, source: Qt }) })
+                    /* @__PURE__ */ n(W, { onClick: d, children: /* @__PURE__ */ n(I, { source: Or }) }),
+                    /* @__PURE__ */ n("div", { css: { overflow: "hidden", flex: 1 }, children: /* @__PURE__ */ n(_e, { fullWidth: !0, value: Ze(a), size: "32" }) }),
+                    l && /* @__PURE__ */ n(W, { value: a.id, onClick: k, children: /* @__PURE__ */ n(I, { css: { color: b.palette.red["4s"] }, source: nn }) })
                   ] }),
-                  /* @__PURE__ */ r(
+                  /* @__PURE__ */ n(
                     "div",
                     {
                       css: {
@@ -2136,7 +2134,7 @@ const sn = [
                         borderTopStyle: "solid",
                         borderColor: b.palette.white["1s"]
                       },
-                      children: /* @__PURE__ */ r(hr, { fallback: null, children: Ye(a.related.inspector) })
+                      children: /* @__PURE__ */ n(gn, { fallback: null, children: Ye(a.related.inspector) })
                     }
                   )
                 ] })
@@ -2146,12 +2144,12 @@ const sn = [
         ]
       }
     ),
-    t && /* @__PURE__ */ r(Dn, { onClose: o })
+    t && /* @__PURE__ */ n(Dr, { onClose: o })
   ] });
-}, _n = () => {
+}, _r = () => {
   const { dom: e } = ke((s) => ({
     dom: s.dom
-  })), { document: t } = Ce(), { floatingStyles: o, refs: n } = le({
+  })), { document: t } = Ce(), { floatingStyles: o, refs: r } = le({
     open: !0,
     strategy: "fixed",
     placement: "bottom-start",
@@ -2172,10 +2170,10 @@ const sn = [
     whileElementsMounted: de
   });
   V(() => {
-    n.setReference(e);
-  }, [e, n]);
-  const i = ur((s) => n.setFloating(s), [n]);
-  return e ? /* @__PURE__ */ r(he, { root: t?.body, children: /* @__PURE__ */ r(
+    r.setReference(e);
+  }, [e, r]);
+  const i = fn((s) => r.setFloating(s), [r]);
+  return e ? /* @__PURE__ */ n(he, { root: t?.body, children: /* @__PURE__ */ n(
     "div",
     {
       ref: i,
@@ -2189,22 +2187,22 @@ const sn = [
       }
     }
   ) }) : null;
-}, zn = ({ render: e }) => {
+}, Gr = ({ render: e }) => {
   const { id: t, toolbar: o } = ke((s) => ({
-    toolbar: er(s).toolbar
-  })), { mode: n } = $(), { isActiveSelectable: i } = H((s, l) => {
-    const a = l.getEvent("selected").contains(t) && t !== _, d = a ? Ze(l.node(t).get()) : !1;
+    toolbar: an(s).toolbar
+  })), { mode: r } = $(), { isActiveSelectable: i } = H((s, l) => {
+    const a = l.getEvent("selected").contains(t) && t !== _, d = a ? Ue(l.node(t).get()) : !1;
     return { isActiveSelectable: a && d };
   });
   return /* @__PURE__ */ w(ie, { children: [
-    i && n === "full" && /* @__PURE__ */ w(ie, { children: [
-      /* @__PURE__ */ r(Gn, { children: o ? Ye(o) : /* @__PURE__ */ r(Un, {}) }),
-      /* @__PURE__ */ r(_n, {})
+    i && r === "full" && /* @__PURE__ */ w(ie, { children: [
+      /* @__PURE__ */ n(zr, { children: o ? Ye(o) : /* @__PURE__ */ n(Ur, {}) }),
+      /* @__PURE__ */ n(_r, {})
     ] }),
     e
   ] });
-}, Gn = ({ children: e }) => {
-  const { dom: t } = ke((s) => ({ dom: s.dom })), { document: o } = Ce(), { floatingStyles: n, refs: i } = le({
+}, zr = ({ children: e }) => {
+  const { dom: t } = ke((s) => ({ dom: s.dom })), { document: o } = Ce(), { floatingStyles: r, refs: i } = le({
     open: !0,
     placement: "bottom-start",
     middleware: [me(), qe(4)],
@@ -2212,7 +2210,7 @@ const sn = [
   });
   return V(() => {
     i.setReference(t);
-  }, [t, i]), t ? /* @__PURE__ */ r(he, { root: o?.body, children: /* @__PURE__ */ r(
+  }, [t, i]), t ? /* @__PURE__ */ n(he, { root: o?.body, children: /* @__PURE__ */ n(
     "div",
     {
       css: {
@@ -2223,11 +2221,11 @@ const sn = [
         borderRadius: 4
       },
       ref: i.setFloating,
-      style: n,
+      style: r,
       children: e
     }
   ) }) : null;
-}, Un = () => /* @__PURE__ */ w(
+}, Ur = () => /* @__PURE__ */ w(
   "div",
   {
     css: {
@@ -2236,28 +2234,28 @@ const sn = [
       gap: 4
     },
     children: [
-      /* @__PURE__ */ r(tr, {}),
-      /* @__PURE__ */ r(rr, {}),
-      /* @__PURE__ */ r(nr, {})
+      /* @__PURE__ */ n(rn, {}),
+      /* @__PURE__ */ n(on, {}),
+      /* @__PURE__ */ n(sn, {})
     ]
   }
-), Mo = ({
+), To = ({
   theme: e,
   insert: t,
   resolver: o,
-  handlers: n,
+  handlers: r,
   serializedNodes: i,
   variableDefinitions: s,
   children: l
 }) => {
   const { screen: a } = $({
     theme: e,
-    handlers: n,
+    handlers: r,
     mode: "full",
     screen: "xs",
     variableDefinitions: s
   });
-  return /* @__PURE__ */ w(nt, { enabled: !0, onRender: zn, resolver: o, children: [
+  return /* @__PURE__ */ w(rt, { enabled: !0, onRender: Gr, resolver: o, children: [
     /* @__PURE__ */ w(
       "div",
       {
@@ -2270,125 +2268,125 @@ const sn = [
           color: fe.white["6s"]
         },
         children: [
-          /* @__PURE__ */ r(dn, {}),
+          /* @__PURE__ */ n(dr, {}),
           /* @__PURE__ */ w("div", { css: { display: "flex", overflow: "hidden", flex: 1 }, children: [
-            /* @__PURE__ */ r($n, { insert: t }),
-            /* @__PURE__ */ r(
+            /* @__PURE__ */ n($r, { insert: t }),
+            /* @__PURE__ */ n(
               pt,
               {
                 viewport: {
                   width: (d) => a === "lg" ? Math.max(d, Le[a]) : Le[a]
                 },
-                children: i ? /* @__PURE__ */ r(ot, { data: i }) : l
+                children: i ? /* @__PURE__ */ n(ot, { data: i }) : l
               }
             )
           ] })
         ]
       }
     ),
-    /* @__PURE__ */ r(or, {})
+    /* @__PURE__ */ n(cn, {})
   ] });
 };
 export {
-  Lo as AspectRatioToolbar,
-  Wo as BackgroundToolbar,
-  No as BorderRadiusToolbar,
-  Ro as BorderToolbar,
-  Ao as ChildNodesToolbar,
-  Do as ColorPickerContent,
+  So as AspectRatioToolbar,
+  Eo as BackgroundToolbar,
+  Lo as BorderRadiusToolbar,
+  Wo as BorderToolbar,
+  No as ChildNodesToolbar,
+  Ro as ColorPickerContent,
   Ee as ColorPickerPopover,
-  Bo as ColorPreview,
+  Ao as ColorPreview,
   Wt as ColorToolbar,
-  Po as ColorVariantToolbar,
-  jo as ColumnGapToolbar,
+  Do as ColorVariantToolbar,
+  Bo as ColumnGapToolbar,
   Rt as CssFontWeightToolbar,
   yt as CssSizeInput,
-  Vo as CssTextAlignToolbar,
-  Oo as CssWidthToolbar,
-  Co as DegreePicker,
-  xo as DisplayToolbar,
-  Mo as Editor,
-  Fo as FlexAlignItemsToolbar,
-  yo as FlexToolbar,
-  Ho as FlexWrapToolbar,
-  $o as FontSizeToolbar,
+  Po as CssTextAlignToolbar,
+  jo as CssWidthToolbar,
+  ko as DegreePicker,
+  Co as DisplayToolbar,
+  To as Editor,
+  Vo as FlexAlignItemsToolbar,
+  vo as FlexToolbar,
+  Fo as FlexWrapToolbar,
+  Oo as FontSizeToolbar,
   pt as FramePreview,
-  _o as GridAlignItemsToolbar,
-  zo as HeightToolbar,
-  Go as HtmlAnchorTargetToolbar,
-  Uo as ImageSourceSelection,
-  Zo as InsertInlineToolbar,
-  Yo as InsertLinkToolbar,
-  Xo as JustifyContentToolbar,
-  qo as JustifyItemsToolbar,
-  vo as LineHeightToolbar,
-  Jo as MarginToolbar,
-  To as MinWidthToolbar,
-  nr as NodeDeleteToolbar,
-  tr as NodeDragToolbar,
-  rr as NodeNameToolbar,
-  Ko as NumberField,
-  Qo as NumberFieldMixOptions,
-  es as ObjectFitToolbar,
-  ts as OrderToolbar,
-  rs as PaddingToolbar,
-  ns as RowGapToolbar,
-  os as SvgSourceToolbar,
-  ss as TagNameToolbar,
+  Ho as GridAlignItemsToolbar,
+  $o as HeightToolbar,
+  _o as HtmlAnchorTargetToolbar,
+  Go as ImageSourceSelection,
+  zo as InsertInlineToolbar,
+  Uo as InsertLinkToolbar,
+  Zo as JustifyContentToolbar,
+  Yo as JustifyItemsToolbar,
+  mo as LineHeightToolbar,
+  Xo as MarginToolbar,
+  xo as MinWidthToolbar,
+  sn as NodeDeleteToolbar,
+  rn as NodeDragToolbar,
+  on as NodeNameToolbar,
+  qo as NumberField,
+  Jo as NumberFieldMixOptions,
+  Ko as ObjectFitToolbar,
+  Qo as OrderToolbar,
+  es as PaddingToolbar,
+  ts as RowGapToolbar,
+  ns as SvgSourceToolbar,
+  rs as TagNameToolbar,
   Lt as TextSizeVariantToolbar,
-  Io as TextStyleGroupToolbar,
+  yo as TextStyleGroupToolbar,
   Nt as TextStyleToolbar,
   At as TextTransformToolbar,
   J as ToolbarField,
-  is as ToolbarGroup,
-  as as VisibilityToolbar,
+  os as ToolbarGroup,
+  ss as VisibilityToolbar,
   oe as WbButton,
   Dt as WbButtonGroup,
-  qt as WbCollapse,
-  cs as WbColorPicker,
-  ls as WbDatePicker,
-  bo as WbDialog,
-  ko as WbDialogBody,
-  ds as WbDialogClose,
-  hs as WbDialogFooter,
-  us as WbDialogHeader,
-  ps as WbDropzone,
-  Er as WbFloating,
-  gs as WbFloatingClose,
+  Jt as WbCollapse,
+  is as WbColorPicker,
+  as as WbDatePicker,
+  go as WbDialog,
+  bo as WbDialogBody,
+  cs as WbDialogClose,
+  ls as WbDialogFooter,
+  ds as WbDialogHeader,
+  hs as WbDropzone,
+  Ln as WbFloating,
+  us as WbFloatingClose,
   wt as WbFloatingContent,
   bt as WbFloatingContext,
-  mo as WbFormLabel,
+  wo as WbFormLabel,
   I as WbIcon,
   W as WbIconButton,
   _e as WbInput,
   Ct as WbInputNumber,
-  fs as WbLoadingOverlay,
-  bs as WbMenu,
-  ws as WbMenuItem,
-  ks as WbMenuList,
-  ms as WbMenuTrigger,
+  ps as WbLoadingOverlay,
+  gs as WbMenu,
+  fs as WbMenuItem,
+  bs as WbMenuList,
+  ws as WbMenuTrigger,
   Tt as WbPopover,
   Et as WbPopoverClose,
   St as WbPopoverContent,
   It as WbPopoverTrigger,
-  Fe as WbRadioButton,
+  Oe as WbRadioButton,
   ce as WbScrollView,
   xt as WbSelect,
-  Jt as WbSvgLoader,
-  Cs as WbSwitch,
-  vs as WbTab,
-  xs as WbTabContent,
-  ys as WbTabList,
-  Ts as WbTabPanel,
-  Is as WbTabs,
-  Ms as WbTextarea,
-  Ss as WbTooltip,
-  Es as WbVirtualizedList,
-  Ls as pushToast,
-  Ws as textSizeVariantOptions,
-  wo as useDialogContext,
+  Kt as WbSvgLoader,
+  ks as WbSwitch,
+  ms as WbTab,
+  Cs as WbTabContent,
+  vs as WbTabList,
+  xs as WbTabPanel,
+  ys as WbTabs,
+  Ts as WbTextarea,
+  Is as WbTooltip,
+  Ms as WbVirtualizedList,
+  Ss as pushToast,
+  Es as textSizeVariantOptions,
+  fo as useDialogContext,
   $ as useEditor,
-  Ns as useEditorResponsive,
-  Rs as useInlineEditable,
+  Ls as useEditorResponsive,
+  Ws as useInlineEditable,
   kt as useWbFloatingContext
 };