@janbox/storefront-builder 1.0.8 → 1.0.9

package/dist/editor.js

@@ -1,16 +1,17 @@
 import { jsx as n, Fragment as ye, jsxs as k } from "@emotion/react/jsx-runtime";
-import { Q as _e, W as re, c as P, X as we, Y as fe, x as ze, y as Ge, N as F, J as L, i as qe, P as Ue, V as Ze, S as Qe, G as Ye, f as Xe, h as Ke, F as Je, l as et, e as tt, j as rt, I as nt, L as st, s as ot, r as it, B as ct, a as at, g as lt, Z as A, _ as E, $ as Le, a0 as Ie, a1 as dt, a2 as ht, a3 as ut, a4 as wt, v as Ee, z as ft, a5 as pt, m as mt } from "./countdown-timer.node-BwrDThFq.js";
-import { useNode as gt, ROOT_NODE as W, serializeNode as kt } from "@craftjs/core";
-import { useRef as Se, useState as O, useEffect as G, createElement as Me, Fragment as ee, Suspense as vt } from "react";
+import { N as we, v as fe, i as ze, m as _e, V as Ge, S as qe, G as Ue, e as Ze, h as Qe, F as Ye, l as Ke, d as Xe, j as Je, I as et, L as tt, t as rt, s as nt, B as ot, a as st, g as it, f as ct, n as at } from "./countdown-timer.node-j79tvSTR.js";
+import { useNode as lt, ROOT_NODE as W, serializeNode as dt } from "@craftjs/core";
+import { f as re, c as ht, e as ut, u as F, r as L, a as Le, i as wt } from "./color-picker-popover-B3AVFuei.js";
+import { useRef as Ie, useState as O, useEffect as G, createElement as Ee, Fragment as ee, Suspense as ft } from "react";
 import "flat";
-import { throttle as bt, isFunction as pe, isNumber as me } from "lodash-es";
+import { throttle as pt, isFunction as pe, isNumber as me } from "lodash-es";
 import "@janbox/storefront-ui";
-import { Q as ne, R as Ct, W as xt, f as Nt, H as yt, h as Lt, P as It, k as Et, i as St, G as Mt, b as Rt, e as $t, F as At, M as jt, a as Tt, g as Pt, I as Dt, L as Bt, U as Ft, T as Wt, B as Ht, A as Ot, d as Vt, X as _t, Y as zt, Z as Gt, _ as qt, $ as ge, a0 as Ut, a1 as ke, a2 as ce, a3 as Re, c as $e, C as Ae, a4 as Zt, a5 as ve } from "./index-Br_MUhzZ.js";
-import { a6 as Un } from "./index-Br_MUhzZ.js";
+import { D as mt, a as gt, H as kt, P as vt, k as bt, i as Ct, G as xt, c as Nt, g as yt, F as Lt, M as It, b as Et, h as St, I as Mt, L as At, U as jt, T as Rt, B as $t, A as Tt, f as Dt, e as Pt, d as Se, C as Me } from "./index-C9Q0Iqvf.js";
 import "@janbox/storefront-ui/hooks";
-import { ThemeProvider as Qt, FLOATING_Z_INDEX as Yt, breakpoint as Xt } from "@janbox/storefront-ui/theme";
+import { ThemeProvider as Bt, FLOATING_Z_INDEX as Ft, breakpoint as Wt } from "@janbox/storefront-ui/theme";
 import "@janbox/storefront-ui/utils";
-import { useFloating as Kt, autoUpdate as Jt, flip as er, size as tr, useHover as rr, safePolygon as nr, useFocus as sr, useDismiss as or, useRole as ir, useInteractions as cr, FloatingPortal as je } from "@floating-ui/react";
+import { G as Ht, c as D, l as R, W as E, d as Ae, m as je, e as Ot, v as Vt, F as zt, C as _t, P as Gt } from "./dialog-header-DPLOS7TT.js";
+import { useFloating as qt, autoUpdate as Ut, flip as Zt, size as Qt, useHover as Yt, safePolygon as Kt, useFocus as Xt, useDismiss as Jt, useRole as er, useInteractions as tr, FloatingPortal as Re } from "@floating-ui/react";
 import "react-use";
 import "react-colorful";
 import "overlayscrollbars-react";
@@ -22,13 +23,15 @@ import "@tiptap/extension-text-style";
 import "@tiptap/react";
 import "@tiptap/react/menus";
 import "@tiptap/starter-kit";
-import ar, { useFrame as lr } from "react-frame-component";
-import { CacheProvider as dr, Global as hr, createElement as ur } from "@emotion/react";
+import rr, { useFrame as nr } from "react-frame-component";
+import { CacheProvider as or, Global as sr, createElement as ir } from "@emotion/react";
 import "@hello-pangea/dnd";
+import { useToggle as $e } from "usehooks-ts";
 import "clsx";
 import "tailwind-merge";
-import "react-router";
-import { useToggle as Te } from "usehooks-ts";
+import { w as ne, x as cr, y as ar, z as ge } from "./anchor-target-BlOvysAr.js";
+import { E as Yn } from "./anchor-target-BlOvysAr.js";
+import { a as lr, l as dr, j as hr, h as ke, i as ur, k as ve, W as ce, A as Te } from "./dropzone-Dbfed3jK.js";
 import { Layers as wr, useLayer as fr } from "@craftjs/layers";
 class pr {
   constructor() {
@@ -57,15 +60,15 @@ class pr {
    *
    * @public
    */
-  start(t, s) {
+  start(t, o) {
     this.componentControls.forEach((r) => {
-      r.start(t.nativeEvent || t, s);
+      r.start(t.nativeEvent || t, o);
     });
   }
 }
 const mr = () => new pr();
 function gr() {
-  return _e(mr);
+  return Ht(mr);
 }
 function kr(e) {
   if (e.sheet)
@@ -79,12 +82,12 @@ function vr(e) {
   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 br = /* @__PURE__ */ (function() {
-  function e(s) {
+  function e(o) {
     var r = this;
     this._insertTag = function(i) {
-      var o;
-      r.tags.length === 0 ? r.insertionPoint ? o = r.insertionPoint.nextSibling : r.prepend ? o = r.container.firstChild : o = r.before : o = r.tags[r.tags.length - 1].nextSibling, r.container.insertBefore(i, o), r.tags.push(i);
-    }, this.isSpeedy = s.speedy === void 0 ? !0 : s.speedy, this.tags = [], this.ctr = 0, this.nonce = s.nonce, this.key = s.key, this.container = s.container, this.prepend = s.prepend, this.insertionPoint = s.insertionPoint, this.before = null;
+      var s;
+      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(r) {
@@ -93,9 +96,9 @@ var br = /* @__PURE__ */ (function() {
     this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(vr(this));
     var i = this.tags[this.tags.length - 1];
     if (this.isSpeedy) {
-      var o = kr(i);
+      var s = kr(i);
       try {
-        o.insertRule(r, o.cssRules.length);
+        s.insertRule(r, s.cssRules.length);
       } catch {
       }
     } else
@@ -107,7 +110,7 @@ var br = /* @__PURE__ */ (function() {
       return (i = r.parentNode) == null ? void 0 : i.removeChild(r);
     }), this.tags = [], this.ctr = 0;
   }, e;
-})(), S = "-ms-", te = "-moz-", p = "-webkit-", Pe = "comm", de = "rule", he = "decl", Cr = "@import", De = "@keyframes", xr = "@layer", Nr = Math.abs, se = String.fromCharCode, yr = Object.assign;
+})(), S = "-ms-", te = "-moz-", p = "-webkit-", De = "comm", de = "rule", he = "decl", Cr = "@import", Pe = "@keyframes", xr = "@layer", Nr = Math.abs, oe = String.fromCharCode, yr = Object.assign;
 function Lr(e, t) {
   return I(e, 0) ^ 45 ? (((t << 2 ^ I(e, 0)) << 2 ^ I(e, 1)) << 2 ^ I(e, 2)) << 2 ^ I(e, 3) : 0;
 }
@@ -117,8 +120,8 @@ function Be(e) {
 function Ir(e, t) {
   return (e = t.exec(e)) ? e[0] : e;
 }
-function m(e, t, s) {
-  return e.replace(t, s);
+function m(e, t, o) {
+  return e.replace(t, o);
 }
 function ae(e, t) {
   return e.indexOf(t);
@@ -126,8 +129,8 @@ function ae(e, t) {
 function I(e, t) {
   return e.charCodeAt(t) | 0;
 }
-function q(e, t, s) {
-  return e.slice(t, s);
+function q(e, t, o) {
+  return e.slice(t, o);
 }
 function T(e) {
   return e.length;
@@ -141,30 +144,30 @@ function Y(e, t) {
 function Er(e, t) {
   return e.map(t).join("");
 }
-var oe = 1, V = 1, Fe = 0, R = 0, N = 0, _ = "";
-function ie(e, t, s, r, i, o, h) {
-  return { value: e, root: t, parent: s, type: r, props: i, children: o, line: oe, column: V, length: h, return: "" };
+var se = 1, V = 1, Fe = 0, A = 0, N = 0, z = "";
+function ie(e, t, o, r, i, s, h) {
+  return { value: e, root: t, parent: o, type: r, props: i, children: s, line: se, column: V, length: h, return: "" };
 }
-function z(e, t) {
+function _(e, t) {
   return yr(ie("", null, null, "", null, null, 0), e, { length: -e.length }, t);
 }
 function Sr() {
   return N;
 }
 function Mr() {
-  return N = R > 0 ? I(_, --R) : 0, V--, N === 10 && (V = 1, oe--), N;
+  return N = A > 0 ? I(z, --A) : 0, V--, N === 10 && (V = 1, se--), N;
 }
-function $() {
-  return N = R < Fe ? I(_, R++) : 0, V++, N === 10 && (V = 1, oe++), N;
+function j() {
+  return N = A < Fe ? I(z, A++) : 0, V++, N === 10 && (V = 1, se++), N;
 }
-function D() {
-  return I(_, R);
+function P() {
+  return I(z, A);
 }
-function X() {
-  return R;
+function K() {
+  return A;
 }
 function Z(e, t) {
-  return q(_, e, t);
+  return q(z, e, t);
 }
 function U(e) {
   switch (e) {
@@ -205,30 +208,30 @@ function U(e) {
   return 0;
 }
 function We(e) {
-  return oe = V = 1, Fe = T(_ = e), R = 0, [];
+  return se = V = 1, Fe = T(z = e), A = 0, [];
 }
 function He(e) {
-  return _ = "", e;
+  return z = "", e;
 }
-function K(e) {
-  return Be(Z(R - 1, le(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
+function X(e) {
+  return Be(Z(A - 1, le(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
 }
-function Rr(e) {
-  for (; (N = D()) && N < 33; )
-    $();
+function Ar(e) {
+  for (; (N = P()) && N < 33; )
+    j();
   return U(e) > 2 || U(N) > 3 ? "" : " ";
 }
-function $r(e, t) {
-  for (; --t && $() && !(N < 48 || N > 102 || N > 57 && N < 65 || N > 70 && N < 97); )
+function jr(e, t) {
+  for (; --t && j() && !(N < 48 || N > 102 || N > 57 && N < 65 || N > 70 && N < 97); )
     ;
-  return Z(e, X() + (t < 6 && D() == 32 && $() == 32));
+  return Z(e, K() + (t < 6 && P() == 32 && j() == 32));
 }
 function le(e) {
-  for (; $(); )
+  for (; j(); )
     switch (N) {
       // ] ) " '
       case e:
-        return R;
+        return A;
       // " '
       case 34:
       case 39:
@@ -240,57 +243,57 @@ function le(e) {
         break;
       // \
       case 92:
-        $();
+        j();
         break;
     }
-  return R;
+  return A;
 }
-function Ar(e, t) {
-  for (; $() && e + N !== 57; )
-    if (e + N === 84 && D() === 47)
+function Rr(e, t) {
+  for (; j() && e + N !== 57; )
+    if (e + N === 84 && P() === 47)
       break;
-  return "/*" + Z(t, R - 1) + "*" + se(e === 47 ? e : $());
+  return "/*" + Z(t, A - 1) + "*" + oe(e === 47 ? e : j());
 }
-function jr(e) {
-  for (; !U(D()); )
-    $();
-  return Z(e, R);
+function $r(e) {
+  for (; !U(P()); )
+    j();
+  return Z(e, A);
 }
 function Tr(e) {
   return He(J("", null, null, null, [""], e = We(e), 0, [0], e));
 }
-function J(e, t, s, r, i, o, h, c, u) {
-  for (var b = 0, l = 0, a = h, f = 0, v = 0, w = 0, d = 1, y = 1, g = 1, x = 0, M = "", Q = i, B = o, j = r, C = M; y; )
-    switch (w = x, x = $()) {
+function J(e, t, o, r, i, s, h, c, u) {
+  for (var b = 0, l = 0, a = h, f = 0, v = 0, w = 0, d = 1, y = 1, g = 1, x = 0, M = "", Q = i, B = s, $ = r, C = M; y; )
+    switch (w = x, x = j()) {
       // (
       case 40:
         if (w != 108 && I(C, a - 1) == 58) {
-          ae(C += m(K(x), "&", "&\f"), "&\f") != -1 && (g = -1);
+          ae(C += m(X(x), "&", "&\f"), "&\f") != -1 && (g = -1);
           break;
         }
       // " ' [
       case 34:
       case 39:
       case 91:
-        C += K(x);
+        C += X(x);
         break;
       // \t \n \r \s
       case 9:
       case 10:
       case 13:
       case 32:
-        C += Rr(w);
+        C += Ar(w);
         break;
       // \
       case 92:
-        C += $r(X() - 1, 7);
+        C += jr(K() - 1, 7);
         continue;
       // /
       case 47:
-        switch (D()) {
+        switch (P()) {
           case 42:
           case 47:
-            Y(Pr(Ar($(), X()), t, s), u);
+            Y(Dr(Rr(j(), K()), t, o), u);
             break;
           default:
             C += "/";
@@ -310,16 +313,16 @@ function J(e, t, s, r, i, o, h, c, u) {
             y = 0;
           // ;
           case 59 + l:
-            g == -1 && (C = m(C, /\f/g, "")), v > 0 && T(C) - a && Y(v > 32 ? Ce(C + ";", r, s, a - 1) : Ce(m(C, " ", "") + ";", r, s, a - 2), u);
+            g == -1 && (C = m(C, /\f/g, "")), v > 0 && T(C) - a && Y(v > 32 ? Ce(C + ";", r, o, a - 1) : Ce(m(C, " ", "") + ";", r, o, a - 2), u);
             break;
           // @ ;
           case 59:
             C += ";";
           // { rule/at-rule
           default:
-            if (Y(j = be(C, t, s, b, l, i, c, M, Q = [], B = [], a), o), x === 123)
+            if (Y($ = be(C, t, o, b, l, i, c, M, Q = [], B = [], a), s), x === 123)
               if (l === 0)
-                J(C, t, j, j, Q, o, a, c, B);
+                J(C, t, $, $, Q, s, a, c, B);
               else
                 switch (f === 99 && I(C, 3) === 110 ? 100 : f) {
                   // d l m s
@@ -327,10 +330,10 @@ function J(e, t, s, r, i, o, h, c, u) {
                   case 108:
                   case 109:
                   case 115:
-                    J(e, j, j, r && Y(be(e, j, j, 0, 0, i, c, M, i, Q = [], a), B), i, B, a, c, r ? Q : B);
+                    J(e, $, $, r && Y(be(e, $, $, 0, 0, i, c, M, i, Q = [], a), B), i, B, a, c, r ? Q : B);
                     break;
                   default:
-                    J(C, j, j, j, [""], B, 0, c, B);
+                    J(C, $, $, $, [""], B, 0, c, B);
                 }
         }
         b = l = v = 0, d = g = 1, M = C = "", a = h;
@@ -345,7 +348,7 @@ function J(e, t, s, r, i, o, h, c, u) {
           else if (x == 125 && d++ == 0 && Mr() == 125)
             continue;
         }
-        switch (C += se(x), x * d) {
+        switch (C += oe(x), x * d) {
           // &
           case 38:
             g = l > 0 ? 1 : (C += "\f", -1);
@@ -356,53 +359,53 @@ function J(e, t, s, r, i, o, h, c, u) {
             break;
           // @
           case 64:
-            D() === 45 && (C += K($())), f = D(), l = a = T(M = C += jr(X())), x++;
+            P() === 45 && (C += X(j())), f = P(), l = a = T(M = C += $r(K())), x++;
             break;
           // -
           case 45:
             w === 45 && T(C) == 2 && (d = 0);
         }
     }
-  return o;
+  return s;
 }
-function be(e, t, s, r, i, o, h, c, u, b, l) {
-  for (var a = i - 1, f = i === 0 ? o : [""], v = ue(f), w = 0, d = 0, y = 0; w < r; ++w)
+function be(e, t, o, r, i, s, h, c, u, b, l) {
+  for (var a = i - 1, f = i === 0 ? s : [""], v = ue(f), w = 0, d = 0, y = 0; w < r; ++w)
     for (var g = 0, x = q(e, a + 1, a = Nr(d = h[w])), M = e; g < v; ++g)
       (M = Be(d > 0 ? f[g] + " " + x : m(x, /&\f/g, f[g]))) && (u[y++] = M);
-  return ie(e, t, s, i === 0 ? de : c, u, b, l);
+  return ie(e, t, o, i === 0 ? de : c, u, b, l);
 }
-function Pr(e, t, s) {
-  return ie(e, t, s, Pe, se(Sr()), q(e, 2, -2), 0);
+function Dr(e, t, o) {
+  return ie(e, t, o, De, oe(Sr()), q(e, 2, -2), 0);
 }
-function Ce(e, t, s, r) {
-  return ie(e, t, s, he, q(e, 0, r), q(e, r + 1, -1), r);
+function Ce(e, t, o, r) {
+  return ie(e, t, o, he, q(e, 0, r), q(e, r + 1, -1), r);
 }
 function H(e, t) {
-  for (var s = "", r = ue(e), i = 0; i < r; i++)
-    s += t(e[i], i, e, t) || "";
-  return s;
+  for (var o = "", r = ue(e), i = 0; i < r; i++)
+    o += t(e[i], i, e, t) || "";
+  return o;
 }
-function Dr(e, t, s, r) {
+function Pr(e, t, o, r) {
   switch (e.type) {
     case xr:
       if (e.children.length) break;
     case Cr:
     case he:
       return e.return = e.return || e.value;
-    case Pe:
-      return "";
     case De:
+      return "";
+    case Pe:
       return e.return = e.value + "{" + H(e.children, r) + "}";
     case de:
       e.value = e.props.join(",");
   }
-  return T(s = H(e.children, r)) ? e.return = e.value + "{" + s + "}" : "";
+  return T(o = H(e.children, r)) ? e.return = e.value + "{" + o + "}" : "";
 }
 function Br(e) {
   var t = ue(e);
-  return function(s, r, i, o) {
+  return function(o, r, i, s) {
     for (var h = "", c = 0; c < t; c++)
-      h += e[c](s, r, i, o) || "";
+      h += e[c](o, r, i, s) || "";
     return h;
   };
 }
@@ -411,52 +414,52 @@ function Fr(e) {
     t.root || (t = t.return) && e(t);
   };
 }
-var Wr = function(t, s, r) {
-  for (var i = 0, o = 0; i = o, o = D(), i === 38 && o === 12 && (s[r] = 1), !U(o); )
-    $();
-  return Z(t, R);
-}, Hr = function(t, s) {
+var Wr = function(t, o, r) {
+  for (var i = 0, s = 0; i = s, s = P(), i === 38 && s === 12 && (o[r] = 1), !U(s); )
+    j();
+  return Z(t, A);
+}, Hr = function(t, o) {
   var r = -1, i = 44;
   do
     switch (U(i)) {
       case 0:
-        i === 38 && D() === 12 && (s[r] = 1), t[r] += Wr(R - 1, s, r);
+        i === 38 && P() === 12 && (o[r] = 1), t[r] += Wr(A - 1, o, r);
         break;
       case 2:
-        t[r] += K(i);
+        t[r] += X(i);
         break;
       case 4:
         if (i === 44) {
-          t[++r] = D() === 58 ? "&\f" : "", s[r] = t[r].length;
+          t[++r] = P() === 58 ? "&\f" : "", o[r] = t[r].length;
           break;
         }
       // fallthrough
       default:
-        t[r] += se(i);
+        t[r] += oe(i);
     }
-  while (i = $());
+  while (i = j());
   return t;
-}, Or = function(t, s) {
-  return He(Hr(We(t), s));
+}, Or = function(t, o) {
+  return He(Hr(We(t), o));
 }, xe = /* @__PURE__ */ new WeakMap(), Vr = function(t) {
   if (!(t.type !== "rule" || !t.parent || // positive .length indicates that this rule contains pseudo
   // negative .length indicates that this rule has been already prefixed
   t.length < 1)) {
-    for (var s = t.value, r = t.parent, i = t.column === r.column && t.line === r.line; r.type !== "rule"; )
+    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 && s.charCodeAt(0) !== 58 && !xe.get(r)) && !i) {
+    if (!(t.props.length === 1 && o.charCodeAt(0) !== 58 && !xe.get(r)) && !i) {
       xe.set(t, !0);
-      for (var o = [], h = Or(s, o), c = r.props, u = 0, b = 0; u < h.length; u++)
+      for (var s = [], h = Or(o, s), c = r.props, u = 0, b = 0; u < h.length; u++)
         for (var l = 0; l < c.length; l++, b++)
-          t.props[b] = o[u] ? h[u].replace(/&\f/g, c[l]) : c[l] + " " + h[u];
+          t.props[b] = s[u] ? h[u].replace(/&\f/g, c[l]) : c[l] + " " + h[u];
     }
   }
-}, _r = function(t) {
+}, zr = function(t) {
   if (t.type === "decl") {
-    var s = t.value;
+    var o = t.value;
     // charcode for l
-    s.charCodeAt(0) === 108 && // charcode for b
-    s.charCodeAt(2) === 98 && (t.return = "", t.value = "");
+    o.charCodeAt(0) === 108 && // charcode for b
+    o.charCodeAt(2) === 98 && (t.return = "", t.value = "");
   }
 };
 function Oe(e, t) {
@@ -601,60 +604,60 @@ function Oe(e, t) {
   }
   return e;
 }
-var zr = function(t, s, r, i) {
+var _r = function(t, o, r, i) {
   if (t.length > -1 && !t.return) switch (t.type) {
     case he:
       t.return = Oe(t.value, t.length);
       break;
-    case De:
-      return H([z(t, {
+    case Pe:
+      return H([_(t, {
         value: m(t.value, "@", "@" + p)
       })], i);
     case de:
-      if (t.length) return Er(t.props, function(o) {
-        switch (Ir(o, /(::plac\w+|:read-\w+)/)) {
+      if (t.length) return Er(t.props, function(s) {
+        switch (Ir(s, /(::plac\w+|:read-\w+)/)) {
           // :read-(only|write)
           case ":read-only":
           case ":read-write":
-            return H([z(t, {
-              props: [m(o, /:(read-\w+)/, ":" + te + "$1")]
+            return H([_(t, {
+              props: [m(s, /:(read-\w+)/, ":" + te + "$1")]
             })], i);
           // :placeholder
           case "::placeholder":
-            return H([z(t, {
-              props: [m(o, /:(plac\w+)/, ":" + p + "input-$1")]
-            }), z(t, {
-              props: [m(o, /:(plac\w+)/, ":" + te + "$1")]
-            }), z(t, {
-              props: [m(o, /:(plac\w+)/, S + "input-$1")]
+            return H([_(t, {
+              props: [m(s, /:(plac\w+)/, ":" + p + "input-$1")]
+            }), _(t, {
+              props: [m(s, /:(plac\w+)/, ":" + te + "$1")]
+            }), _(t, {
+              props: [m(s, /:(plac\w+)/, S + "input-$1")]
             })], i);
         }
         return "";
       });
   }
-}, Gr = [zr], qr = function(t) {
-  var s = t.key;
-  if (s === "css") {
+}, Gr = [_r], qr = function(t) {
+  var o = t.key;
+  if (o === "css") {
     var r = document.querySelectorAll("style[data-emotion]:not([data-s])");
     Array.prototype.forEach.call(r, function(d) {
       var y = d.getAttribute("data-emotion");
       y.indexOf(" ") !== -1 && (document.head.appendChild(d), d.setAttribute("data-s", ""));
     });
   }
-  var i = t.stylisPlugins || Gr, o = {}, h, c = [];
+  var i = t.stylisPlugins || Gr, s = {}, h, c = [];
   h = t.container || document.head, Array.prototype.forEach.call(
     // this means we will ignore elements which don't have a space in them which
     // means that the style elements we're looking at are only Emotion 11 server-rendered style elements
-    document.querySelectorAll('style[data-emotion^="' + s + ' "]'),
+    document.querySelectorAll('style[data-emotion^="' + o + ' "]'),
     function(d) {
       for (var y = d.getAttribute("data-emotion").split(" "), g = 1; g < y.length; g++)
-        o[y[g]] = !0;
+        s[y[g]] = !0;
       c.push(d);
     }
   );
-  var u, b = [Vr, _r];
+  var u, b = [Vr, zr];
   {
-    var l, a = [Dr, Fr(function(d) {
+    var l, a = [Pr, Fr(function(d) {
       l.insert(d);
     })], f = Br(b.concat(i, a)), v = function(y) {
       return H(Tr(y), f);
@@ -664,9 +667,9 @@ var zr = function(t, s, r, i) {
     };
   }
   var w = {
-    key: s,
+    key: o,
     sheet: new br({
-      key: s,
+      key: o,
       container: h,
       nonce: t.nonce,
       speedy: t.speedy,
@@ -674,19 +677,19 @@ var zr = function(t, s, r, i) {
       insertionPoint: t.insertionPoint
     }),
     nonce: t.nonce,
-    inserted: o,
+    inserted: s,
     registered: {},
     insert: u
   };
   return w.sheet.hydrate(c), w;
 };
-const Ve = ({ children: e, viewport: t, containerProps: s }) => {
-  const r = Se(null), { theme: i } = re(), [o, h] = O({
+const Ve = ({ children: e, viewport: t, containerProps: o }) => {
+  const r = Ie(null), { theme: i } = re(), [s, h] = O({
     width: 0,
     height: 0
   });
   G(() => {
-    const w = bt((y) => {
+    const w = pt((y) => {
       const g = y.at(0)?.target;
       if (!g) return;
       const { width: x, height: M } = g.getBoundingClientRect();
@@ -697,20 +700,20 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
     }, 200), d = new ResizeObserver(w);
     return r.current && d.observe(r.current), () => d.disconnect();
   }, []);
-  const c = pe(t?.width) ? t.width(o.width) : t?.width, u = pe(t?.height) ? t.height(o.height) : t?.height, b = me(c) ? o.width / c : 1, l = me(u) ? o.height / u : 1, a = Math.min(b, l, 1), f = (u ?? o.height / a) || 0, v = (c ?? o.width / a) || 0;
-  return /* @__PURE__ */ n("div", { ...s, className: P("tw:w-full tw:h-full tw:p-2 tw:bg-ic-ink-1s", s?.className), children: /* @__PURE__ */ n("div", { className: P("tw:w-full tw:h-full tw:overflow-hidden tw:relative"), ref: r, children: /* @__PURE__ */ n(
+  const c = pe(t?.width) ? t.width(s.width) : t?.width, u = pe(t?.height) ? t.height(s.height) : t?.height, b = me(c) ? s.width / c : 1, l = me(u) ? s.height / u : 1, a = Math.min(b, l, 1), f = (u ?? s.height / a) || 0, v = (c ?? s.width / a) || 0;
+  return /* @__PURE__ */ n("div", { ...o, className: D("tw:w-full tw:h-full tw:p-2 tw:bg-ic-ink-1s", o?.className), children: /* @__PURE__ */ n("div", { className: D("tw:w-full tw:h-full tw:overflow-hidden tw:relative"), ref: r, children: /* @__PURE__ */ n(
     "div",
     {
       style: {
         transform: `scale(${a})`,
         width: v,
         height: f,
-        marginLeft: (o.width - v) / 2,
-        marginTop: (o.height - f) / 2
+        marginLeft: (s.width - v) / 2,
+        marginTop: (s.height - f) / 2
       },
       className: "tw:absolute",
       children: /* @__PURE__ */ n(
-        ar,
+        rr,
         {
           sandbox: "allow-same-origin allow-scripts allow-popups allow-presentation",
           allow: "autoplay; encrypted-media",
@@ -722,22 +725,22 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
     }
   ) }) });
 }, Ur = ({ children: e, theme: t }) => {
-  const { document: s, window: r } = lr(), [i, o] = O(!1), h = Se(window.customElements.define.bind(window.customElements));
+  const { document: o, window: r } = nr(), [i, s] = O(!1), h = Ie(window.customElements.define.bind(window.customElements));
   G(() => {
     const u = h.current;
     return r && (window.customElements.define = function(b, l, a) {
       window.customElements.get(b) || r.customElements.define(b, l, a), u(b, l, a);
-    }), s?.head.replaceWith(document.head.cloneNode(!0)), o(!0), () => {
+    }), o?.head.replaceWith(document.head.cloneNode(!0)), s(!0), () => {
       window.customElements.define = u;
     };
-  }, [s, r]);
+  }, [o, r]);
   const c = qr({
     key: "css",
-    container: s?.head
+    container: o?.head
   });
-  return i ? /* @__PURE__ */ n(ye, { children: /* @__PURE__ */ k(dr, { value: c, children: [
+  return i ? /* @__PURE__ */ n(ye, { children: /* @__PURE__ */ k(or, { value: c, children: [
     /* @__PURE__ */ n(
-      hr,
+      sr,
       {
         styles: {
           ".frame-content": {
@@ -758,43 +761,44 @@ const Ve = ({ children: e, viewport: t, containerProps: s }) => {
         }
       }
     ),
-    /* @__PURE__ */ n(Qt, { theme: t, children: e })
+    /* @__PURE__ */ n(Bt, { theme: t, children: e })
   ] }) }) : null;
 }, Zr = ({ render: e }) => {
-  const { id: t, renderer: s } = gt((o) => ({
-    resolvedId: Ge(o),
-    renderer: ze(o).renderer
+  const { id: t, renderer: o } = lt((s) => ({
+    resolvedId: ut(s),
+    renderer: ht(s).renderer
   })), {
     queryParams: { mode: r }
-  } = ne(), { isActive: i } = F((o, h) => ({
+  } = ne(), { isActive: i } = F((s, h) => ({
     isActive: h.getEvent("selected").contains(t) && t !== W
   }));
-  return s ? Me(s, { render: e }) : /* @__PURE__ */ k(ee, { children: [
+  return o ? Ee(o, { render: e }) : /* @__PURE__ */ k(ee, { children: [
     i && r === "full" && /* @__PURE__ */ k(ee, { children: [
-      /* @__PURE__ */ n(Ct, {}),
-      /* @__PURE__ */ n(xt, {})
+      /* @__PURE__ */ n(mt, {}),
+      /* @__PURE__ */ n(gt, {})
     ] }),
     e
   ] });
 };
-L(qe, { inspector: yt, renderer: Nt });
-L(Ue, { inspector: It, renderer: Lt });
-L(Ze, { inspector: Et });
-L(Qe, { inspector: St });
-L(Ye, { inspector: Mt });
-L(Xe, { inspector: Rt });
-L(Ke, { inspector: $t });
-L(Je, { inspector: At });
-L(et, { inspector: jt });
-L(tt, { inspector: Tt });
-L(rt, { inspector: Pt });
-L(nt, { inspector: Dt });
-L(st, { inspector: Bt });
-L(ot, { inspector: Ft });
-L(it, { inspector: Wt });
-L(ct, { inspector: Ht });
-L(at, { inspector: Ot });
-L(lt, { inspector: Vt });
+L(ze, { inspector: kt });
+L(_e, { inspector: vt });
+L(Ge, { inspector: bt });
+L(qe, { inspector: Ct });
+L(Ue, { inspector: xt });
+L(Ze, { inspector: Nt });
+L(Qe, { inspector: yt });
+L(Ye, { inspector: Lt });
+L(Ke, { inspector: It });
+L(Xe, { inspector: Et });
+L(Je, { inspector: St });
+L(et, { inspector: Mt });
+L(tt, { inspector: At });
+L(rt, { inspector: jt });
+L(nt, { inspector: Rt });
+L(ot, { inspector: $t });
+L(st, { inspector: Tt });
+L(it, { inspector: Dt });
+L(ct, { inspector: Pt });
 const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M8 5L5 8L8 11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M5 8H14C17.314 8 20 10.462 20 13.5V13.5C20 16.538 17.314 19 14 19H6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
@@ -811,25 +815,25 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
 <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>
-`, Xr = '<svg width="20" height="20" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg" class=""><path d="M9.75 3C8.50736 3 7.5 4.00736 7.5 5.25C7.5 5.66421 7.83579 6 8.25 6C8.66421 6 9 5.66421 9 5.25C9 4.83579 9.33579 4.5 9.75 4.5H13.75C14.1642 4.5 14.5 4.83579 14.5 5.25V14.75C14.5 15.1642 14.1642 15.5 13.75 15.5H9.75C9.33579 15.5 9 15.1642 9 14.75C9 14.3358 8.66421 14 8.25 14C7.83579 14 7.5 14.3358 7.5 14.75C7.5 15.9926 8.50736 17 9.75 17H13.75C14.9926 17 16 15.9926 16 14.75V5.25C16 4.00736 14.9926 3 13.75 3H9.75Z" fill="currentColor"></path><path d="M12.25 10.75C12.6642 10.75 13 10.4142 13 10C13 9.58579 12.6642 9.25 12.25 9.25L6.56066 9.25L7.53033 8.28033C7.82322 7.98744 7.82322 7.51256 7.53033 7.21967C7.23744 6.92678 6.76256 6.92678 6.46967 7.21967L4.21967 9.46967C4.07902 9.61032 4 9.80109 4 10C4 10.1989 4.07902 10.3897 4.21967 10.5303L6.46967 12.7803C6.76256 13.0732 7.23744 13.0732 7.53033 12.7803C7.82322 12.4874 7.82322 12.0126 7.53033 11.7197L6.56066 10.75H12.25Z" fill="currentColor"></path></svg>', Kr = () => {
+`, Kr = '<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>', Xr = () => {
   const {
     queryParams: { mode: e, screen: t },
-    setQueryParams: s
-  } = ne(), [r, i] = O(!1), { handlers: o } = re(), { actions: h, canRedo: c, canUndo: u, query: b } = F((w, d) => ({
+    setQueryParams: o
+  } = ne(), [r, i] = O(!1), { handlers: s } = re(), { actions: h, canRedo: c, canUndo: u, query: b } = F((w, d) => ({
     enabled: w.options.enabled,
     canUndo: d.history.canUndo(),
     canRedo: d.history.canRedo()
   })), l = (w) => {
-    s({
+    o({
       screen: w
     });
   }, a = () => {
-    s({ mode: e === "full" ? "compact" : "full" });
+    o({ mode: e === "full" ? "compact" : "full" });
   }, f = () => {
-    o.close();
+    s.close();
   }, v = async () => {
     try {
-      return h.selectNode(), o.submit(b.getSerializedNodes());
+      return h.selectNode(), s.submit(b.getSerializedNodes());
     } catch {
     } finally {
       i(!1);
@@ -838,20 +842,20 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
   return /* @__PURE__ */ k(
     "div",
     {
-      className: P(
+      className: D(
         "tw:flex tw:items-center tw:gap-4 tw:p-2 tw:justify-between tw:bg-ic-ink-6s tw:text-ic-white-6s tw:text-sm"
       ),
       children: [
         /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:gap-3", children: [
-          /* @__PURE__ */ n(A, { size: "32", onClick: f, children: /* @__PURE__ */ n(E, { source: Xr }) }),
-          /* @__PURE__ */ n(_t, { onSelectionChange: l, value: t, children: zt.map(({ icon: w, size: d }) => /* @__PURE__ */ n(A, { value: d, children: /* @__PURE__ */ n(E, { source: w }) }, d)) }),
+          /* @__PURE__ */ n(R, { size: "32", onClick: f, children: /* @__PURE__ */ n(E, { source: Kr }) }),
+          /* @__PURE__ */ n(lr, { onSelectionChange: l, value: t, children: cr.map(({ icon: w, size: d }) => /* @__PURE__ */ n(R, { value: d, children: /* @__PURE__ */ n(E, { source: w }) }, d)) }),
           /* @__PURE__ */ k("div", { className: "tw:p-1 tw:flex tw:items-center tw:gap-2 tw:bg-ic-white-1s tw:rounded-lg", children: [
-            /* @__PURE__ */ n(A, { onClick: h.history.undo, disabled: !u, children: /* @__PURE__ */ n(E, { source: Ne }) }),
-            /* @__PURE__ */ n(A, { onClick: h.history.redo, disabled: !c, children: /* @__PURE__ */ n(E, { source: Ne, className: "tw:rotate-180" }) })
+            /* @__PURE__ */ n(R, { onClick: h.history.undo, disabled: !u, children: /* @__PURE__ */ n(E, { source: Ne }) }),
+            /* @__PURE__ */ n(R, { onClick: h.history.redo, disabled: !c, children: /* @__PURE__ */ n(E, { source: Ne, className: "tw:rotate-180" }) })
           ] }),
-          /* @__PURE__ */ n("div", { className: "tw:p-1 tw:flex tw:items-center tw:gap-2 tw:bg-ic-white-1s tw:rounded-lg", children: /* @__PURE__ */ n(A, { onClick: a, children: /* @__PURE__ */ n(E, { source: e === "full" ? Yr : Qr }) }) })
+          /* @__PURE__ */ n("div", { className: "tw:p-1 tw:flex tw:items-center tw:gap-2 tw:bg-ic-white-1s tw:rounded-lg", children: /* @__PURE__ */ n(R, { onClick: a, children: /* @__PURE__ */ n(E, { source: e === "full" ? Yr : Qr }) }) })
         ] }),
-        /* @__PURE__ */ n("div", { className: "tw:flex tw:items-center tw:gap-3", children: /* @__PURE__ */ n(Le, { isLoading: r, onClick: v, children: "Save" }) })
+        /* @__PURE__ */ n("div", { className: "tw:flex tw:items-center tw:gap-3", children: /* @__PURE__ */ n(Ae, { isLoading: r, onClick: v, children: "Save" }) })
       ]
     }
   );
@@ -863,82 +867,82 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
 <path d="M15 6L9 12L15 18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `, tn = ({ elements: e, sections: t }) => /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:h-full", children: [
-  /* @__PURE__ */ n("div", { className: "tw:flex tw:items-center tw:p-2 tw:gap-3", children: /* @__PURE__ */ n(Ie, { fullWidth: !0, placeholder: "Search...", prefix: /* @__PURE__ */ n(E, { source: Jr }) }) }),
-  /* @__PURE__ */ k(Gt, { defaultIndex: 1, className: "tw:flex-1 tw:overflow-hidden tw:border-t tw:border-ic-white-1s", children: [
-    /* @__PURE__ */ k(qt, { children: [
-      /* @__PURE__ */ n(ge, { className: "tw:flex-1", children: "Sections" }),
-      /* @__PURE__ */ n(ge, { className: "tw:flex-1", children: "Elements" })
+  /* @__PURE__ */ n("div", { className: "tw:flex tw:items-center tw:p-2 tw:gap-3", children: /* @__PURE__ */ n(je, { fullWidth: !0, placeholder: "Search...", prefix: /* @__PURE__ */ n(E, { source: Jr }) }) }),
+  /* @__PURE__ */ k(dr, { defaultIndex: 1, className: "tw:flex-1 tw:overflow-hidden tw:border-t tw:border-ic-white-1s", children: [
+    /* @__PURE__ */ k(hr, { children: [
+      /* @__PURE__ */ n(ke, { className: "tw:flex-1", children: "Sections" }),
+      /* @__PURE__ */ n(ke, { className: "tw:flex-1", children: "Elements" })
     ] }),
-    /* @__PURE__ */ k(Ut, { className: "tw:flex-1 tw:overflow-hidden", children: [
-      /* @__PURE__ */ n(ke, { children: /* @__PURE__ */ n(ce, { className: "tw:h-full tw:py-2", children: t?.map((s, r) => /* @__PURE__ */ n(nn, { group: s }, r)) }) }),
-      /* @__PURE__ */ n(ke, { className: "tw:h-full tw:overflow-hidden", children: /* @__PURE__ */ n(ce, { className: "tw:h-full tw:py-2", children: e?.map((s, r) => /* @__PURE__ */ n(rn, { group: s }, r)) }) })
+    /* @__PURE__ */ k(ur, { className: "tw:flex-1 tw:overflow-hidden", children: [
+      /* @__PURE__ */ n(ve, { children: /* @__PURE__ */ n(ce, { className: "tw:h-full tw:py-2", children: t?.map((o, r) => /* @__PURE__ */ n(nn, { group: o }, r)) }) }),
+      /* @__PURE__ */ n(ve, { className: "tw:h-full tw:overflow-hidden", children: /* @__PURE__ */ n(ce, { className: "tw:h-full tw:py-2", children: e?.map((o, r) => /* @__PURE__ */ n(rn, { group: o }, r)) }) })
     ] })
   ] })
 ] }), rn = ({ group: e }) => {
-  const [t, s] = Te(!0), { actions: r, connectors: i } = F();
+  const [t, o] = $e(!0), { actions: r, connectors: i } = F();
   return /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:text-sm", children: [
-    /* @__PURE__ */ n(Le, { onClick: s, className: "tw:bg-transparent", children: /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:justify-between tw:flex-1 tw:text-sm", children: [
+    /* @__PURE__ */ n(Ae, { onClick: o, className: "tw:bg-transparent", children: /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:justify-between tw:flex-1 tw:text-sm", children: [
       e.name,
       /* @__PURE__ */ n(
         E,
         {
-          source: Re,
-          className: P("tw:transition-transform", {
+          source: Te,
+          className: D("tw:transition-transform", {
             "tw:rotate-180": !t
           })
         }
       )
     ] }) }),
-    /* @__PURE__ */ n(dt, { open: t, children: /* @__PURE__ */ n("div", { className: "tw:px-4 tw:py-2 tw:grid tw:grid-cols-2 tw:gap-4", children: e.elements.map((o, h) => /* @__PURE__ */ k("div", { className: "tw:space-y-1", children: [
+    /* @__PURE__ */ n(Ot, { open: t, children: /* @__PURE__ */ n("div", { className: "tw:px-4 tw:py-2 tw:grid tw:grid-cols-2 tw:gap-4", children: e.elements.map((s, h) => /* @__PURE__ */ k("div", { className: "tw:space-y-1", children: [
       /* @__PURE__ */ n(
         "div",
         {
-          className: P(
+          className: D(
             "tw:bg-ic-ink-6s tw:relative tw:transition-transform tw:rounded-lg tw:hover:scale-105 tw:pointer-events-auto tw:aspect-video tw:overflow-hidden",
             "tw:cursor-grabbing tw:flex tw:flex-col tw:gap-1 tw:items-center tw:justify-center tw:p-1 tw:opacity-100 tw:text-ic-white-5s",
             "tw:after:absolute tw:after:inset-0 tw:after:content-empty tw:after:bg-ic-white-1s"
           ),
           ref: (c) => {
-            c && i.create(c, o.template, {
+            c && i.create(c, s.template, {
               onCreate(u) {
-                (typeof o.autoFocus == "function" ? o.autoFocus(u) : o.autoFocus) && r.selectNode(u.rootNodeId), o.onCreate?.(u);
+                (typeof s.autoFocus == "function" ? s.autoFocus(u) : s.autoFocus) && r.selectNode(u.rootNodeId), s.onCreate?.(u);
               }
             });
           },
-          children: /* @__PURE__ */ n(ht, { width: void 0, height: void 0, ...o.icon })
+          children: /* @__PURE__ */ n(Vt, { width: void 0, height: void 0, ...s.icon })
         }
       ),
-      /* @__PURE__ */ n("p", { className: "tw:text-xs tw:mx-auto tw:text-center", children: o.name })
+      /* @__PURE__ */ n("p", { className: "tw:text-xs tw:mx-auto tw:text-center", children: s.name })
     ] }, h)) }) })
   ] });
 }, nn = ({ group: e }) => {
-  const [t, s] = O(!1), { refs: r, floatingStyles: i, context: o } = Kt({
+  const [t, o] = O(!1), { refs: r, floatingStyles: i, context: s } = qt({
     open: t,
-    onOpenChange: s,
+    onOpenChange: o,
     placement: "right-start",
     middleware: [
-      er(),
-      tr({
+      Zt(),
+      Qt({
         apply({ elements: f }) {
           const v = {
-            zIndex: `${Yt}`,
+            zIndex: `${Ft}`,
             height: `${f.reference.getBoundingClientRect().height}px`
           };
           Object.assign(f.floating.style, v);
         }
       })
     ],
-    whileElementsMounted: Jt
+    whileElementsMounted: Ut
   });
   G(() => {
     r.setPositionReference(document.querySelector("aside"));
   }, [r]);
-  const h = rr(o, { move: !1, handleClose: nr() }), c = sr(o), u = or(o), b = ir(o), { getReferenceProps: l, getFloatingProps: a } = cr([h, c, u, b]);
+  const h = Yt(s, { move: !1, handleClose: Kt() }), c = Xt(s), u = Jt(s), b = er(s), { getReferenceProps: l, getFloatingProps: a } = tr([h, c, u, b]);
   return /* @__PURE__ */ k(ee, { children: [
     /* @__PURE__ */ k(
       "button",
       {
-        className: P(
+        className: D(
           "tw:w-full tw:text-left tw:flex tw:items-center tw:text-ic-white-5s tw:gap-2 tw:p-2 tw:rounded-lg",
           "tw:hover:text-ic-white-6s tw:hover:bg-ic-white-1s tw:hover:font-medium"
         ),
@@ -951,13 +955,13 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
         ]
       }
     ),
-    t && /* @__PURE__ */ n(je, { children: /* @__PURE__ */ n("div", { style: i, ...a(), ref: r.setFloating, children: /* @__PURE__ */ k("div", { className: "tw:h-full tw:flex tw:flex-col tw:border-l tw:border-t tw:border-ic-white-2s tw:bg-ic-ink-6s tw:text-ic-white-6s tw:text-sm", children: [
+    t && /* @__PURE__ */ n(Re, { children: /* @__PURE__ */ n("div", { style: i, ...a(), ref: r.setFloating, children: /* @__PURE__ */ k("div", { className: "tw:h-full tw:flex tw:flex-col tw:border-l tw:border-t tw:border-ic-white-2s tw:bg-ic-ink-6s tw:text-ic-white-6s tw:text-sm", children: [
       /* @__PURE__ */ n("div", { className: "tw:h-12 tw:px-2 tw:flex tw:items-center", children: /* @__PURE__ */ n("h6", { className: "tw:font-medium", children: e.name }) }),
-      /* @__PURE__ */ n(ce, { className: "tw:flex-1 tw:px-3", children: /* @__PURE__ */ n("div", { className: "tw:flex tw:flex-col tw:gap-4", children: e.sections.map((f, v) => /* @__PURE__ */ ur(sn, { ...f, key: v })) }) })
+      /* @__PURE__ */ n(ce, { className: "tw:flex-1 tw:px-3", children: /* @__PURE__ */ n("div", { className: "tw:flex tw:flex-col tw:gap-4", children: e.sections.map((f, v) => /* @__PURE__ */ ir(on, { ...f, key: v })) }) })
     ] }) }) })
   ] });
-}, sn = ({ template: e, autoFocus: t = !0, onCreate: s }) => {
-  const [, r] = O(!1), i = re(), { actions: o, connectors: h, resolver: c, query: u } = F((l) => ({
+}, on = ({ template: e, autoFocus: t = !0, onCreate: o }) => {
+  const [, r] = O(!1), i = re(), { actions: s, connectors: h, resolver: c, query: u } = F((l) => ({
     resolver: l.options.resolver
   })), b = O(() => {
     const l = typeof e == "function" ? e() : e;
@@ -965,7 +969,7 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
     "rootNodeId" in l ? a = l : a = u.parseReactElement(l).toNodeTree();
     const { rootNodeId: f, nodes: v } = a, w = {};
     return Object.entries(v).forEach(([d, y]) => {
-      const g = kt(y.data, c), x = d === f ? W : d;
+      const g = dt(y.data, c), x = d === f ? W : d;
       w[x] = {
         ...g,
         parent: g.parent === f ? W : g.parent,
@@ -980,7 +984,7 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
       ref: (l) => {
         l && h.create(l, e, {
           onCreate(a) {
-            t && o.selectNode(a.rootNodeId), s?.(a);
+            t && s.selectNode(a.rootNodeId), o?.(a);
           }
         });
       },
@@ -994,13 +998,13 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
               backgroundColor: i.theme.palette.background.default
             }
           },
-          viewport: { width: Xt.md.minWidth },
-          children: /* @__PURE__ */ n($e, { resolver: c, children: /* @__PURE__ */ n(Ae, { data: b }) })
+          viewport: { width: Wt.md.minWidth },
+          children: /* @__PURE__ */ n(Se, { resolver: c, children: /* @__PURE__ */ n(Me, { data: b }) })
         }
       ) }) })
     }
   );
-}, on = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+}, sn = `<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"/>
@@ -1019,37 +1023,37 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
 <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) => {
-  const { query: t, actions: s } = F(), {
+  const { query: t, actions: o } = F(), {
     id: r,
     expanded: i,
-    actions: o,
+    actions: s,
     displayName: h,
     children: c,
     depth: u
   } = fr((v) => ({
     expanded: v.expanded,
-    displayName: Ee(t.node(v.id).get())
+    displayName: Le(t.node(v.id).get())
   })), { selected: b, selectable: l } = F((v, w) => {
     const d = w.node(r).get();
     return {
       selected: w.getEvent("selected").contains(r),
       nodeDOM: d.dom,
-      selectable: ft(d)
+      selectable: wt(d)
     };
   });
   G(() => {
-    r === W && o.setExpandedState(!0);
-  }, [o, r]), G(() => {
+    r === W && s.setExpandedState(!0);
+  }, [s, r]), G(() => {
     if (c.length === 0) return;
     c.some((w) => {
       const d = t.getEvent("selected").all();
       return d.includes(w) ? !0 : t.node(w).descendants(!0).some((g) => d.includes(g));
-    }) && o.setExpandedState(!0);
-  }, [c, o, t]);
+    }) && s.setExpandedState(!0);
+  }, [c, s, t]);
   const a = () => {
-    s.selectNode(r);
+    o.selectNode(r);
   }, f = (v) => {
-    v.stopPropagation(), o.toggleLayer();
+    v.stopPropagation(), s.toggleLayer();
   };
   return /* @__PURE__ */ k(
     "div",
@@ -1063,7 +1067,7 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
             style: {
               paddingLeft: Math.max(0, u - 1) * 16
             },
-            className: P(
+            className: D(
               "tw:flex tw:items-center tw:gap-0.5 tw:cursor-pointer tw:rounded-1 tw:pr-2 tw:py-1 tw:border tw:border-ic-white-1s tw:hover:bg-ic-white-1s",
               {
                 hidden: r === W,
@@ -1072,20 +1076,20 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
               }
             ),
             children: [
-              c.length ? /* @__PURE__ */ n(A, { className: "tw:pointer-events-auto", onClick: f, children: /* @__PURE__ */ n(
+              c.length ? /* @__PURE__ */ n(R, { className: "tw:pointer-events-auto", onClick: f, children: /* @__PURE__ */ n(
                 E,
                 {
-                  className: P("tw:transition-transform tw:-rotate-90", {
+                  className: D("tw:transition-transform tw:-rotate-90", {
                     "tw:rotate-0": i
                   }),
                   size: 16,
-                  source: Re
+                  source: Te
                 }
               ) }) : /* @__PURE__ */ n("div", { className: "tw:p-1", children: /* @__PURE__ */ n(E, { size: 16, source: cn }) }),
               /* @__PURE__ */ n(
                 "span",
                 {
-                  className: P("tw:flex-1 tw:truncate", {
+                  className: D("tw:flex-1 tw:truncate", {
                     "tw:text-ic-white-3s": !l
                   }),
                   children: h
@@ -1099,29 +1103,29 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
     }
   );
 }, ln = ({ onClose: e }) => {
-  const t = gr(), s = (r) => {
+  const t = gr(), o = (r) => {
     t.start(r);
   };
-  return /* @__PURE__ */ n(je, { children: /* @__PURE__ */ k(
-    ut.div,
+  return /* @__PURE__ */ n(Re, { children: /* @__PURE__ */ k(
+    zt.div,
     {
       drag: !0,
       dragControls: t,
       dragListener: !1,
       style: { zIndex: 1e5, width: 320, height: 400, top: 80, right: 40 },
-      className: "tw:fixed tw:rounded-2 tw:bg-ic-ink-6s tw:text-white tw:flex tw:flex-col tw:border tw:border-ic-white-2s",
+      className: "tw:fixed tw:rounded-md tw:bg-ic-ink-6s tw:text-white tw:flex tw:flex-col tw:border tw:border-ic-white-2s",
       children: [
         /* @__PURE__ */ k(
           "div",
           {
-            onPointerDown: s,
+            onPointerDown: o,
             className: "tw:py-2 tw:cursor-grab tw:flex tw:items-center tw:justify-between tw:px-4",
             children: [
               /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:gap-2", children: [
-                /* @__PURE__ */ n(E, { source: on }),
+                /* @__PURE__ */ n(E, { source: sn }),
                 /* @__PURE__ */ n("p", { className: "tw:text-sm tw:font-medium", children: "Layers" })
               ] }),
-              /* @__PURE__ */ n(A, { onClick: e, children: /* @__PURE__ */ n(E, { source: wt }) })
+              /* @__PURE__ */ n(R, { onClick: e, children: /* @__PURE__ */ n(E, { source: _t }) })
             ]
           }
         ),
@@ -1140,13 +1144,13 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
 <path d="M10 17L5 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `, un = ({ insert: e }) => {
-  const [t, s] = Te(!1), {
+  const [t, o] = $e(!1), {
     queryParams: {
       action: r = "insert"
       /* Insert */
     },
     setQueryParams: i
-  } = ne(), { actions: o, isDeletable: h, focusedNode: c } = F((a, f) => {
+  } = ne(), { actions: s, isDeletable: h, focusedNode: c } = F((a, f) => {
     const v = f.getEvent("selected").first(), w = v ? f.node(v) : null;
     return {
       enabled: a.options.enabled,
@@ -1154,12 +1158,12 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
       focusedNode: w?.get()
     };
   }), u = () => {
-    o.selectNode();
+    s.selectNode();
   }, b = (a) => {
-    o.delete(a.currentTarget.value);
+    s.delete(a.currentTarget.value);
   }, l = (a) => {
     const f = a.currentTarget.value;
-    f === "layers" ? s() : (u(), i({
+    f === "layers" ? o() : (u(), i({
       action: f
     }));
   };
@@ -1168,7 +1172,7 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
       /* @__PURE__ */ k("div", { className: "tw:px-1 tw:flex tw:flex-col tw:gap-1", children: [
         !!e && /* @__PURE__ */ k(ye, { children: [
           /* @__PURE__ */ n(
-            A,
+            R,
             {
               tooltip: {
                 content: "Insert",
@@ -1178,13 +1182,13 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
               value: "insert",
               className: "tw:relative",
               size: "32",
-              children: /* @__PURE__ */ n(E, { source: pt })
+              children: /* @__PURE__ */ n(E, { source: Gt })
             }
           ),
           /* @__PURE__ */ n("hr", { className: "tw:border-ic-white-2s" })
         ] }),
         /* @__PURE__ */ n(
-          A,
+          R,
           {
             tooltip: {
               content: "Layers",
@@ -1201,49 +1205,49 @@ const Ne = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
       /* @__PURE__ */ k(
         "div",
         {
-          className: P("tw:relative tw:flex tw:flex-col tw:border-l tw:border-ic-white-1s tw:w-72 tw:overflow-auto"),
+          className: D("tw:relative tw:flex tw:flex-col tw:border-l tw:border-ic-white-1s tw:w-72 tw:overflow-auto"),
           children: [
             !c?.related.inspector && /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto scrollbar", children: r === "insert" && !!e && /* @__PURE__ */ n(tn, { elements: e.elements, sections: e.sections }) }),
             !!c?.related?.inspector && /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:flex-1 tw:overflow-hidden", children: [
               /* @__PURE__ */ k("div", { className: "tw:flex tw:items-center tw:gap-2 tw:px-2 tw:py-2", children: [
-                /* @__PURE__ */ n(A, { onClick: u, children: /* @__PURE__ */ n(E, { source: hn }) }),
-                /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-hidden", children: /* @__PURE__ */ n(Ie, { fullWidth: !0, value: Ee(c), size: "32" }) }),
-                h && /* @__PURE__ */ n(A, { value: c.id, onClick: b, children: /* @__PURE__ */ n(E, { className: "tw:text-ic-red-4s", source: Zt }) })
+                /* @__PURE__ */ n(R, { onClick: u, children: /* @__PURE__ */ n(E, { source: hn }) }),
+                /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-hidden", children: /* @__PURE__ */ n(je, { fullWidth: !0, value: Le(c), size: "32" }) }),
+                h && /* @__PURE__ */ n(R, { value: c.id, onClick: b, children: /* @__PURE__ */ n(E, { className: "tw:text-ic-red-4s", source: ar }) })
               ] }),
-              /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto tw:border-t tw:border-ic-white-1s scrollbar-hidden", children: /* @__PURE__ */ n(vt, { fallback: null, children: Me(c.related.inspector) }) })
+              /* @__PURE__ */ n("div", { className: "tw:flex-1 tw:overflow-auto tw:border-t tw:border-ic-white-1s scrollbar-hidden", children: /* @__PURE__ */ n(ft, { fallback: null, children: Ee(c.related.inspector) }) })
             ] })
           ]
         }
       )
     ] }),
-    t && /* @__PURE__ */ n(ln, { onClose: s })
+    t && /* @__PURE__ */ n(ln, { onClose: o })
   ] });
-}, zn = ({ theme: e, insert: t, resolver: s, handlers: r }) => {
+}, Un = ({ theme: e, insert: t, resolver: o, handlers: r }) => {
   const {
     queryParams: { screen: i }
   } = ne();
   return re({
     theme: e,
     handlers: r
-  }), /* @__PURE__ */ n($e, { enabled: !0, onRender: Zr, resolver: s, children: /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:w-screen tw:h-screen tw:bg-ic-ink-6s tw:text-ic-white-6s", children: [
-    /* @__PURE__ */ n(Kr, {}),
+  }), /* @__PURE__ */ n(Se, { enabled: !0, onRender: Zr, resolver: o, children: /* @__PURE__ */ k("div", { className: "tw:flex tw:flex-col tw:w-screen tw:h-screen tw:bg-ic-ink-6s tw:text-ic-white-6s", children: [
+    /* @__PURE__ */ n(Xr, {}),
     /* @__PURE__ */ k("div", { className: "tw:flex-1 tw:overflow-hidden tw:flex", children: [
       /* @__PURE__ */ n(un, { insert: t }),
       /* @__PURE__ */ n(
         Ve,
         {
           viewport: {
-            width: (o) => i === "lg" ? Math.max(o, ve[i]) : ve[i]
+            width: (s) => i === "lg" ? Math.max(s, ge[i]) : ge[i]
           },
-          children: /* @__PURE__ */ n(Ae, { children: /* @__PURE__ */ n(mt, {}) })
+          children: /* @__PURE__ */ n(Me, { children: /* @__PURE__ */ n(at, {}) })
         }
       )
     ] })
   ] }) });
 };
 export {
-  zn as Editor,
+  Un as Editor,
   re as useEditor,
   ne as useEditorQueryParams,
-  Un as useEditorResponsive
+  Yn as useEditorResponsive
 };