@chaibuilder/sdk 1.1.1 → 1.1.3

package/dist/{CanvasArea-JzBGfXSp.js → CanvasArea-K9fOlyJl.js}

@@ -1,26 +1,26 @@
-var yt = Object.defineProperty;
-var vt = (t, e, n) => e in t ? yt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
-var z = (t, e, n) => (vt(t, typeof e != "symbol" ? e + "" : e, n), n);
+var mt = Object.defineProperty;
+var yt = (e, t, n) => t in e ? mt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
+var z = (e, t, n) => (yt(e, typeof t != "symbol" ? t + "" : t, n), n);
 import { j as r } from "./jsx-runtime-NV737rRe.js";
-import Y, { createElement as xt, useCallback as xe, useState as W, useEffect as M, Component as qe, Children as bt, Suspense as Ue, useRef as Se, useMemo as kt, lazy as wt } from "react";
-import { map as ne, includes as Ee, toUpper as de, round as jt, throttle as He, noop as G, isEmpty as U, first as re, omit as Ct, get as B, isString as be, memoize as Tt, each as St, find as Et, filter as ze, isNull as It } from "lodash";
-import { ResetIcon as Ie, MobileIcon as De, LaptopIcon as Dt, DesktopIcon as Bt, DotsVerticalIcon as Ot, EraserIcon as At, ZoomInIcon as Rt, DragHandleDots2Icon as Pt, ArrowUpIcon as Mt, CopyIcon as _t, TrashIcon as Lt } from "@radix-ui/react-icons";
-import { p as ke, B as se, W as Ye, aM as Nt, aN as Ft, aO as $t, aP as Wt, aQ as qt, R as we, ai as Ut, aR as Ht, aS as zt, aT as Yt, aU as Kt, aV as Vt, aW as Xt, w as Jt, j as H, aj as K, D as Zt, E as Gt, F as Qt, G as en, H as tn, I as nn, J as rn, K as sn, at as on, L as an, U as Ke, aL as te, aX as ln, ab as cn, _ as ie, aY as Q, m as Ve, n as dn, k as un, o as pn, h as Xe, l as Je, ag as fn, aZ as hn, a_ as gn, a$ as mn, x as yn, ae as Ze, a as vn, b0 as xn, b1 as bn, a6 as kn, b2 as wn, i as jn, S as Ge, aA as Cn } from "./index-ORFlyrBx.js";
-import { useTranslation as Tn } from "react-i18next";
+import Y, { createElement as vt, useCallback as xe, useState as $, useEffect as M, Component as qe, Children as xt, Suspense as Ue, useRef as Se, useMemo as bt, lazy as wt } from "react";
+import { map as ne, includes as Ee, toUpper as de, round as kt, throttle as He, noop as Z, isEmpty as U, first as re, omit as jt, get as B, isString as be, memoize as Ct, each as Tt, find as St, filter as ze, isNull as Et } from "lodash";
+import { ResetIcon as Ie, MobileIcon as De, LaptopIcon as It, DesktopIcon as Dt, DotsVerticalIcon as Bt, EraserIcon as Ot, ZoomInIcon as At, DragHandleDots2Icon as Pt, ArrowUpIcon as Rt, CopyIcon as Mt, TrashIcon as Lt } from "@radix-ui/react-icons";
+import { p as we, B as se, W as Ye, aM as _t, aN as Nt, aO as Ft, aP as Wt, aQ as $t, R as ke, ai as qt, aR as Ut, aS as Ht, aT as zt, aU as Yt, aV as Kt, aW as Vt, w as Xt, j as H, aj as K, D as Jt, E as Zt, F as Gt, G as Qt, H as en, I as tn, J as nn, K as rn, at as sn, L as on, U as Ke, aL as te, aX as an, ab as ln, _ as ie, aY as Q, m as Ve, n as cn, k as dn, o as un, h as Xe, l as Je, ag as pn, aZ as fn, a_ as hn, a$ as gn, x as mn, ae as Ze, a as yn, b0 as vn, b1 as xn, a6 as bn, b2 as wn, i as kn, S as Ge, aA as jn } from "./index-ORFlyrBx.js";
+import { useTranslation as Cn } from "react-i18next";
 import { useAtom as F } from "jotai";
 import Be from "react-dom";
-import { g as Sn, S as Oe, a as Qe } from "./MODIFIERS-MLfpKQY1.js";
-import { r as et, u as En, B as In, E as Dn } from "./index-aDqFUJ8v.js";
-import { Quill as Bn } from "react-quill";
-import { u as On } from "./useAddBlockByDrop-UA_Iw_4l.js";
-import { useFeature as An } from "flagged";
-import { flip as Rn } from "@floating-ui/dom";
-import { useFloating as Pn, shift as Mn } from "@floating-ui/react-dom";
-import { useDrag as _n } from "react-dnd";
+import { g as Tn, S as Oe, a as Qe } from "./MODIFIERS-MLfpKQY1.js";
+import { r as et, u as Sn, B as En, E as In } from "./index-CMHxUxre.js";
+import { Quill as Dn } from "react-quill";
+import { u as Bn } from "./useAddBlockByDrop-UA_Iw_4l.js";
+import { useFeature as On } from "flagged";
+import { flip as An } from "@floating-ui/dom";
+import { useFloating as Pn, shift as Rn } from "@floating-ui/react-dom";
+import { useDrag as Mn } from "react-dnd";
 import { useResizeObserver as Ln } from "@react-hookz/web";
-import { tailwindcssPaletteGenerator as Nn } from "@bobthered/tailwindcss-palette-generator";
-import { Provider as Fn } from "react-wrap-balancer";
-import { twMerge as $n } from "tailwind-merge";
+import { tailwindcssPaletteGenerator as _n } from "@bobthered/tailwindcss-palette-generator";
+import { Provider as Nn } from "react-wrap-balancer";
+import { twMerge as Fn } from "tailwind-merge";
 import { getBlockComponent as Wn } from "@chaibuilder/runtime";
 import "@radix-ui/react-toggle";
 import "class-variance-authority";
@@ -62,26 +62,26 @@ import "./tailwind-config-d1VL1lzE.js";
 import "react-hotkeys-hook";
 import "sonner";
 import "lucide-react";
-const qn = () => {
-  const { undoCount: t, redoCount: e, undo: n, redo: i } = ke();
+const $n = () => {
+  const { undoCount: e, redoCount: t, undo: n, redo: o } = we();
   return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ r.jsx(se, { disabled: !t, size: "sm", onClick: n, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(Ie, {}) }),
-    /* @__PURE__ */ r.jsx(se, { disabled: !e, onClick: i, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(Ie, { className: "rotate-180 scale-y-[-1] transform" }) })
+    /* @__PURE__ */ r.jsx(se, { disabled: !e, size: "sm", onClick: n, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(Ie, {}) }),
+    /* @__PURE__ */ r.jsx(se, { disabled: !t, onClick: o, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(Ie, { className: "rotate-180 scale-y-[-1] transform" }) })
   ] });
 };
-function Un() {
-  const [t, e] = Ye(), { t: n } = Tn();
+function qn() {
+  const [e, t] = Ye(), { t: n } = Cn();
   return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ r.jsx(Nt, { htmlFor: "dark-mode-switch", children: n("dark_mode") }),
+    /* @__PURE__ */ r.jsx(_t, { htmlFor: "dark-mode-switch", children: n("dark_mode") }),
     /* @__PURE__ */ r.jsxs(
-      Ft,
+      Nt,
       {
         id: "dark-mode-switch",
-        checked: t,
+        checked: e,
         onCheckedChange: () => {
-          e(!t);
+          t(!e);
         },
-        className: `${t ? "bg-violet-600" : "bg-violet-300"}
+        className: `${e ? "bg-violet-600" : "bg-violet-300"}
           relative ml-2 inline-flex h-[20px] w-[40px] shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus-visible:ring-2  focus-visible:ring-white focus-visible:ring-opacity-75`,
         children: [
           /* @__PURE__ */ r.jsx("span", { className: "sr-only", children: "Use setting" }),
@@ -89,7 +89,7 @@ function Un() {
             "span",
             {
               "aria-hidden": "true",
-              className: `${t ? "translate-x-5" : "translate-x-0"}
+              className: `${e ? "translate-x-5" : "translate-x-0"}
             pointer-events-none -mt-px inline-block h-[18px] w-[20px] transform rounded-full bg-white shadow-lg ring-0 transition duration-200 ease-in-out`
             }
           )
@@ -98,10 +98,10 @@ function Un() {
     )
   ] });
 }
-const Ae = ({ landscape: t = !1 }) => /* @__PURE__ */ r.jsxs(
+const Ae = ({ landscape: e = !1 }) => /* @__PURE__ */ r.jsxs(
   "svg",
   {
-    className: t ? "rotate-90" : "",
+    className: e ? "rotate-90" : "",
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 13 13",
     xmlSpace: "preserve",
@@ -121,7 +121,7 @@ const Ae = ({ landscape: t = !1 }) => /* @__PURE__ */ r.jsxs(
       )
     ]
   }
-), Re = [
+), Pe = [
   {
     title: "Mobile (XS)",
     content: "Styles set here are applied to all screen unless edited at higher breakpoint",
@@ -154,57 +154,57 @@ const Ae = ({ landscape: t = !1 }) => /* @__PURE__ */ r.jsxs(
     title: "Desktop (XL)",
     content: "Styles set here are applied at 1280px and up unless edited at higher breakpoint",
     breakpoint: "xl",
-    icon: /* @__PURE__ */ r.jsx(Dt, {}),
+    icon: /* @__PURE__ */ r.jsx(It, {}),
     width: 1420
   },
   {
     title: "Large Desktop (2XL)",
     content: "Styles set here are applied at 1536px and up",
     breakpoint: "2xl",
-    icon: /* @__PURE__ */ r.jsx(Bt, {}),
+    icon: /* @__PURE__ */ r.jsx(Dt, {}),
     width: 1920
   }
-], Hn = ({
-  title: t,
-  content: e,
+], Un = ({
+  title: e,
+  content: t,
   currentBreakpoint: n,
-  breakpoint: i,
-  width: c,
+  breakpoint: o,
+  width: l,
   icon: s,
-  onClick: a
-}) => /* @__PURE__ */ r.jsxs($t, { children: [
+  onClick: i
+}) => /* @__PURE__ */ r.jsxs(Ft, { children: [
   /* @__PURE__ */ r.jsx(Wt, { asChild: !0, children: /* @__PURE__ */ r.jsx(
     se,
     {
-      onClick: () => a(c),
+      onClick: () => i(l),
       size: "sm",
-      variant: i === n ? "secondary" : "ghost",
+      variant: o === n ? "secondary" : "ghost",
       children: s
     }
   ) }),
-  /* @__PURE__ */ r.jsx(qt, { className: "w-52 border-border", children: /* @__PURE__ */ r.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ r.jsxs("div", { className: "space-y-1", children: [
-    /* @__PURE__ */ r.jsx("h4", { className: "text-sm font-semibold", children: t }),
-    /* @__PURE__ */ r.jsx("p", { className: "text-xs", children: e })
+  /* @__PURE__ */ r.jsx($t, { className: "w-52 border-border", children: /* @__PURE__ */ r.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ r.jsxs("div", { className: "space-y-1", children: [
+    /* @__PURE__ */ r.jsx("h4", { className: "text-sm font-semibold", children: e }),
+    /* @__PURE__ */ r.jsx("p", { className: "text-xs", children: t })
   ] }) }) })
-] }), zn = () => {
-  const [, t, e] = we(), [n, i] = Ut(), c = (s) => {
-    n.includes(s) ? n.length > 2 && i(n.filter((a) => a !== s)) : i((a) => [...a, s]);
+] }), Hn = () => {
+  const [, e, t] = ke(), [n, o] = qt(), l = (s) => {
+    n.includes(s) ? n.length > 2 && o(n.filter((i) => i !== s)) : o((i) => [...i, s]);
   };
   return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center rounded-md", children: [
     ne(
-      Re.filter((s) => Ee(n, de(s.breakpoint))),
-      (s) => /* @__PURE__ */ xt(Hn, { ...s, onClick: e, key: s.breakpoint, currentBreakpoint: t })
+      Pe.filter((s) => Ee(n, de(s.breakpoint))),
+      (s) => /* @__PURE__ */ vt(Un, { ...s, onClick: t, key: s.breakpoint, currentBreakpoint: e })
     ),
-    /* @__PURE__ */ r.jsxs(Ht, { children: [
-      /* @__PURE__ */ r.jsx(zt, { asChild: !0, children: /* @__PURE__ */ r.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ r.jsx(Ot, { className: "scale-90 transform" }) }) }),
-      /* @__PURE__ */ r.jsxs(Yt, { className: "w-56 border-border text-xs", children: [
-        /* @__PURE__ */ r.jsx(Kt, { children: "Breakpoints" }),
-        /* @__PURE__ */ r.jsx(Vt, {}),
-        ne(Re, (s) => /* @__PURE__ */ r.jsx(
-          Xt,
+    /* @__PURE__ */ r.jsxs(Ut, { children: [
+      /* @__PURE__ */ r.jsx(Ht, { asChild: !0, children: /* @__PURE__ */ r.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ r.jsx(Bt, { className: "scale-90 transform" }) }) }),
+      /* @__PURE__ */ r.jsxs(zt, { className: "w-56 border-border text-xs", children: [
+        /* @__PURE__ */ r.jsx(Yt, { children: "Breakpoints" }),
+        /* @__PURE__ */ r.jsx(Kt, {}),
+        ne(Pe, (s) => /* @__PURE__ */ r.jsx(
+          Vt,
           {
             disabled: s.breakpoint === "xs",
-            onCheckedChange: () => c(de(s.breakpoint)),
+            onCheckedChange: () => l(de(s.breakpoint)),
             checked: Ee(n, de(s.breakpoint)),
             children: s.title
           },
@@ -213,53 +213,53 @@ const Ae = ({ landscape: t = !1 }) => /* @__PURE__ */ r.jsxs(
       ] })
     ] })
   ] });
-}, Yn = () => {
-  const [t] = Jt(), { createSnapshot: e } = ke(), [, n] = H(), [, i] = K(), c = xe(() => {
-    t([]), n([]), i([]), e();
-  }, [t, e]);
-  return /* @__PURE__ */ r.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ r.jsxs(Zt, { children: [
-    /* @__PURE__ */ r.jsx(Gt, { asChild: !0, children: /* @__PURE__ */ r.jsxs(se, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
-      /* @__PURE__ */ r.jsx(At, {}),
+}, zn = () => {
+  const [e] = Xt(), { createSnapshot: t } = we(), [, n] = H(), [, o] = K(), l = xe(() => {
+    e([]), n([]), o([]), t();
+  }, [e, t]);
+  return /* @__PURE__ */ r.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ r.jsxs(Jt, { children: [
+    /* @__PURE__ */ r.jsx(Zt, { asChild: !0, children: /* @__PURE__ */ r.jsxs(se, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
+      /* @__PURE__ */ r.jsx(Ot, {}),
       " Clear"
     ] }) }),
-    /* @__PURE__ */ r.jsxs(Qt, { className: "border-border", children: [
-      /* @__PURE__ */ r.jsxs(en, { children: [
-        /* @__PURE__ */ r.jsx(tn, { children: "Clear whole canvas?" }),
-        /* @__PURE__ */ r.jsx(nn, { children: "Are you sure you want to clear the whole canvas?" })
+    /* @__PURE__ */ r.jsxs(Gt, { className: "border-border", children: [
+      /* @__PURE__ */ r.jsxs(Qt, { children: [
+        /* @__PURE__ */ r.jsx(en, { children: "Clear whole canvas?" }),
+        /* @__PURE__ */ r.jsx(tn, { children: "Are you sure you want to clear the whole canvas?" })
       ] }),
-      /* @__PURE__ */ r.jsxs(rn, { children: [
-        /* @__PURE__ */ r.jsx(sn, { children: "Cancel" }),
-        /* @__PURE__ */ r.jsx(on, { onClick: c, children: "Yes" })
+      /* @__PURE__ */ r.jsxs(nn, { children: [
+        /* @__PURE__ */ r.jsx(rn, { children: "Cancel" }),
+        /* @__PURE__ */ r.jsx(sn, { onClick: l, children: "Yes" })
       ] })
     ] })
   ] }) });
-}, Kn = () => {
-  const t = an("darkMode", !1), [e] = Ke();
+}, Yn = () => {
+  const e = on("darkMode", !1), [t] = Ke();
   return /* @__PURE__ */ r.jsxs("div", { className: "flex h-10 items-center justify-between border-b bg-background/70 px-2", children: [
     /* @__PURE__ */ r.jsxs("div", { className: "flex h-full space-x-2", children: [
-      t ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-        /* @__PURE__ */ r.jsx(Un, {}),
+      e ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+        /* @__PURE__ */ r.jsx(qn, {}),
         /* @__PURE__ */ r.jsx(te, { orientation: "vertical" })
       ] }) : null,
-      /* @__PURE__ */ r.jsx(zn, {}),
+      /* @__PURE__ */ r.jsx(Hn, {}),
       /* @__PURE__ */ r.jsx(te, { orientation: "vertical" }),
       /* @__PURE__ */ r.jsxs("div", { className: "flex w-12 items-center justify-center gap-x-1 space-x-0 font-medium", children: [
-        /* @__PURE__ */ r.jsx(Rt, { className: "h-3.5 w-3.5 flex-shrink-0" }),
+        /* @__PURE__ */ r.jsx(At, { className: "h-3.5 w-3.5 flex-shrink-0" }),
         " ",
         /* @__PURE__ */ r.jsxs("div", { className: "text-xs leading-3", children: [
-          jt(e, 0),
+          kt(t, 0),
           "%"
         ] })
       ] }),
       /* @__PURE__ */ r.jsx(te, { orientation: "vertical" }),
-      /* @__PURE__ */ r.jsx(qn, {})
+      /* @__PURE__ */ r.jsx($n, {})
     ] }),
     /* @__PURE__ */ r.jsxs("div", { className: "flex h-full items-center space-x-2", children: [
       /* @__PURE__ */ r.jsx(te, { orientation: "vertical" }),
-      /* @__PURE__ */ r.jsx(Yn, {})
+      /* @__PURE__ */ r.jsx(zn, {})
     ] })
   ] });
-}, Vn = `<!doctype html>
+}, Kn = `<!doctype html>
 <html class="scroll-smooth h-full overflow-y-auto">
   <head>
     <meta charset="UTF-8">
@@ -305,24 +305,24 @@ const Ae = ({ landscape: t = !1 }) => /* @__PURE__ */ r.jsxs(
     <div class="frame-root"></div>
     <script src="https://cdn.jsdelivr.net/npm/quill@2.0.0/dist/quill.js"><\/script>
   </body>
-</html>`, Xn = (t) => {
-  const [e] = we(), [, n] = Ke(), [i, c] = W({}), s = xe(() => {
-    const { width: a, height: l } = t;
-    if (a < e) {
-      const f = parseFloat((a / e).toString());
+</html>`, Vn = (e) => {
+  const [t] = ke(), [, n] = Ke(), [o, l] = $({}), s = xe(() => {
+    const { width: i, height: c } = e;
+    if (i < t) {
+      const p = parseFloat((i / t).toString());
       let u = {};
-      l && (u = { height: l + 2 * l * (1 - f) }), c({
-        transform: `scale(${f})`,
+      c && (u = { height: c + 2 * c * (1 - p) }), l({
+        transform: `scale(${p})`,
         transformOrigin: "top left",
         ...u,
         maxWidth: "none"
-      }), n(f * 100);
+      }), n(p * 100);
     } else
-      c({}), n(100);
-  }, [e, t, n]);
+      l({}), n(100);
+  }, [t, e, n]);
   return M(() => {
     s();
-  }, [e, t, n, s]), i;
+  }, [t, e, n, s]), o;
 };
 var oe = { exports: {} };
 /*
@@ -330,30 +330,30 @@ object-assign
 (c) Sindre Sorhus
 @license MIT
 */
-var ue, Pe;
-function Jn() {
-  if (Pe)
+var ue, Re;
+function Xn() {
+  if (Re)
     return ue;
-  Pe = 1;
-  var t = Object.getOwnPropertySymbols, e = Object.prototype.hasOwnProperty, n = Object.prototype.propertyIsEnumerable;
-  function i(s) {
+  Re = 1;
+  var e = Object.getOwnPropertySymbols, t = Object.prototype.hasOwnProperty, n = Object.prototype.propertyIsEnumerable;
+  function o(s) {
     if (s == null)
       throw new TypeError("Object.assign cannot be called with null or undefined");
     return Object(s);
   }
-  function c() {
+  function l() {
     try {
       if (!Object.assign)
         return !1;
       var s = new String("abc");
       if (s[5] = "de", Object.getOwnPropertyNames(s)[0] === "5")
         return !1;
-      for (var a = {}, l = 0; l < 10; l++)
-        a["_" + String.fromCharCode(l)] = l;
-      var f = Object.getOwnPropertyNames(a).map(function(h) {
-        return a[h];
+      for (var i = {}, c = 0; c < 10; c++)
+        i["_" + String.fromCharCode(c)] = c;
+      var p = Object.getOwnPropertyNames(i).map(function(h) {
+        return i[h];
       });
-      if (f.join("") !== "0123456789")
+      if (p.join("") !== "0123456789")
         return !1;
       var u = {};
       return "abcdefghijklmnopqrst".split("").forEach(function(h) {
@@ -363,18 +363,18 @@ function Jn() {
       return !1;
     }
   }
-  return ue = c() ? Object.assign : function(s, a) {
-    for (var l, f = i(s), u, h = 1; h < arguments.length; h++) {
-      l = Object(arguments[h]);
-      for (var p in l)
-        e.call(l, p) && (f[p] = l[p]);
-      if (t) {
-        u = t(l);
+  return ue = l() ? Object.assign : function(s, i) {
+    for (var c, p = o(s), u, h = 1; h < arguments.length; h++) {
+      c = Object(arguments[h]);
+      for (var f in c)
+        t.call(c, f) && (p[f] = c[f]);
+      if (e) {
+        u = e(c);
         for (var v = 0; v < u.length; v++)
-          n.call(l, u[v]) && (f[u[v]] = l[u[v]]);
+          n.call(c, u[v]) && (p[u[v]] = c[u[v]]);
       }
     }
-    return f;
+    return p;
   }, ue;
 }
 var pe, Me;
@@ -382,89 +382,89 @@ function je() {
   if (Me)
     return pe;
   Me = 1;
-  var t = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";
-  return pe = t, pe;
+  var e = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";
+  return pe = e, pe;
 }
-var fe, _e;
+var fe, Le;
 function tt() {
-  return _e || (_e = 1, fe = Function.call.bind(Object.prototype.hasOwnProperty)), fe;
+  return Le || (Le = 1, fe = Function.call.bind(Object.prototype.hasOwnProperty)), fe;
 }
-var he, Le;
-function Zn() {
-  if (Le)
+var he, _e;
+function Jn() {
+  if (_e)
     return he;
-  Le = 1;
-  var t = function() {
+  _e = 1;
+  var e = function() {
   };
   if (process.env.NODE_ENV !== "production") {
-    var e = je(), n = {}, i = tt();
-    t = function(s) {
-      var a = "Warning: " + s;
-      typeof console < "u" && console.error(a);
+    var t = je(), n = {}, o = tt();
+    e = function(s) {
+      var i = "Warning: " + s;
+      typeof console < "u" && console.error(i);
       try {
-        throw new Error(a);
+        throw new Error(i);
       } catch {
       }
     };
   }
-  function c(s, a, l, f, u) {
+  function l(s, i, c, p, u) {
     if (process.env.NODE_ENV !== "production") {
       for (var h in s)
-        if (i(s, h)) {
-          var p;
+        if (o(s, h)) {
+          var f;
           try {
             if (typeof s[h] != "function") {
               var v = Error(
-                (f || "React class") + ": " + l + " type `" + h + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof s[h] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
+                (p || "React class") + ": " + c + " type `" + h + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof s[h] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
               );
               throw v.name = "Invariant Violation", v;
             }
-            p = s[h](a, h, f, l, null, e);
-          } catch (R) {
-            p = R;
+            f = s[h](i, h, p, c, null, t);
+          } catch (P) {
+            f = P;
           }
-          if (p && !(p instanceof Error) && t(
-            (f || "React class") + ": type specification of " + l + " `" + h + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof p + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
-          ), p instanceof Error && !(p.message in n)) {
-            n[p.message] = !0;
-            var w = u ? u() : "";
-            t(
-              "Failed " + l + " type: " + p.message + (w ?? "")
+          if (f && !(f instanceof Error) && e(
+            (p || "React class") + ": type specification of " + c + " `" + h + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof f + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
+          ), f instanceof Error && !(f.message in n)) {
+            n[f.message] = !0;
+            var k = u ? u() : "";
+            e(
+              "Failed " + c + " type: " + f.message + (k ?? "")
             );
           }
         }
     }
   }
-  return c.resetWarningCache = function() {
+  return l.resetWarningCache = function() {
     process.env.NODE_ENV !== "production" && (n = {});
-  }, he = c, he;
+  }, he = l, he;
 }
 var ge, Ne;
-function Gn() {
+function Zn() {
   if (Ne)
     return ge;
   Ne = 1;
-  var t = et, e = Jn(), n = je(), i = tt(), c = Zn(), s = function() {
+  var e = et, t = Xn(), n = je(), o = tt(), l = Jn(), s = function() {
   };
-  process.env.NODE_ENV !== "production" && (s = function(l) {
-    var f = "Warning: " + l;
-    typeof console < "u" && console.error(f);
+  process.env.NODE_ENV !== "production" && (s = function(c) {
+    var p = "Warning: " + c;
+    typeof console < "u" && console.error(p);
     try {
-      throw new Error(f);
+      throw new Error(p);
     } catch {
     }
   });
-  function a() {
+  function i() {
     return null;
   }
-  return ge = function(l, f) {
+  return ge = function(c, p) {
     var u = typeof Symbol == "function" && Symbol.iterator, h = "@@iterator";
-    function p(o) {
-      var d = o && (u && o[u] || o[h]);
+    function f(a) {
+      var d = a && (u && a[u] || a[h]);
       if (typeof d == "function")
         return d;
     }
-    var v = "<<anonymous>>", w = {
+    var v = "<<anonymous>>", k = {
       array: m("array"),
       bigint: m("bigint"),
       bool: m("boolean"),
@@ -474,30 +474,30 @@ function Gn() {
       string: m("string"),
       symbol: m("symbol"),
       any: V(),
-      arrayOf: _,
+      arrayOf: L,
       element: le(),
       elementType: ce(),
       instanceOf: D,
-      node: ut(),
+      node: dt(),
       objectOf: N,
-      oneOf: L,
-      oneOfType: dt,
-      shape: pt,
-      exact: ft
+      oneOf: _,
+      oneOfType: ct,
+      shape: ut,
+      exact: pt
     };
-    function R(o, d) {
-      return o === d ? o !== 0 || 1 / o === 1 / d : o !== o && d !== d;
+    function P(a, d) {
+      return a === d ? a !== 0 || 1 / a === 1 / d : a !== a && d !== d;
     }
-    function j(o, d) {
-      this.message = o, this.data = d && typeof d == "object" ? d : {}, this.stack = "";
+    function j(a, d) {
+      this.message = a, this.data = d && typeof d == "object" ? d : {}, this.stack = "";
     }
     j.prototype = Error.prototype;
-    function I(o) {
+    function I(a) {
       if (process.env.NODE_ENV !== "production")
-        var d = {}, k = 0;
-      function x(C, y, b, T, E, S, P) {
-        if (T = T || v, S = S || b, P !== n) {
-          if (f) {
+        var d = {}, w = 0;
+      function x(C, y, b, T, E, S, R) {
+        if (T = T || v, S = S || b, R !== n) {
+          if (p) {
             var O = new Error(
               "Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types"
             );
@@ -505,24 +505,24 @@ function Gn() {
           } else if (process.env.NODE_ENV !== "production" && typeof console < "u") {
             var X = T + ":" + b;
             !d[X] && // Avoid spamming the console because they are often not actionable except for lib authors
-            k < 3 && (s(
+            w < 3 && (s(
               "You are manually calling a React.PropTypes validation function for the `" + S + "` prop on `" + T + "`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."
-            ), d[X] = !0, k++);
+            ), d[X] = !0, w++);
           }
         }
-        return y[b] == null ? C ? y[b] === null ? new j("The " + E + " `" + S + "` is marked as required " + ("in `" + T + "`, but its value is `null`.")) : new j("The " + E + " `" + S + "` is marked as required in " + ("`" + T + "`, but its value is `undefined`.")) : null : o(y, b, T, E, S);
+        return y[b] == null ? C ? y[b] === null ? new j("The " + E + " `" + S + "` is marked as required " + ("in `" + T + "`, but its value is `null`.")) : new j("The " + E + " `" + S + "` is marked as required in " + ("`" + T + "`, but its value is `undefined`.")) : null : a(y, b, T, E, S);
       }
       var g = x.bind(null, !1);
       return g.isRequired = x.bind(null, !0), g;
     }
-    function m(o) {
-      function d(k, x, g, C, y, b) {
-        var T = k[x], E = $(T);
-        if (E !== o) {
-          var S = Z(T);
+    function m(a) {
+      function d(w, x, g, C, y, b) {
+        var T = w[x], E = W(T);
+        if (E !== a) {
+          var S = J(T);
           return new j(
-            "Invalid " + C + " `" + y + "` of type " + ("`" + S + "` supplied to `" + g + "`, expected ") + ("`" + o + "`."),
-            { expectedType: o }
+            "Invalid " + C + " `" + y + "` of type " + ("`" + S + "` supplied to `" + g + "`, expected ") + ("`" + a + "`."),
+            { expectedType: a }
           );
         }
         return null;
@@ -530,19 +530,19 @@ function Gn() {
       return I(d);
     }
     function V() {
-      return I(a);
+      return I(i);
     }
-    function _(o) {
-      function d(k, x, g, C, y) {
-        if (typeof o != "function")
+    function L(a) {
+      function d(w, x, g, C, y) {
+        if (typeof a != "function")
           return new j("Property `" + y + "` of component `" + g + "` has invalid PropType notation inside arrayOf.");
-        var b = k[x];
+        var b = w[x];
         if (!Array.isArray(b)) {
-          var T = $(b);
+          var T = W(b);
           return new j("Invalid " + C + " `" + y + "` of type " + ("`" + T + "` supplied to `" + g + "`, expected an array."));
         }
         for (var E = 0; E < b.length; E++) {
-          var S = o(b, E, g, C, y + "[" + E + "]", n);
+          var S = a(b, E, g, C, y + "[" + E + "]", n);
           if (S instanceof Error)
             return S;
         }
@@ -551,64 +551,64 @@ function Gn() {
       return I(d);
     }
     function le() {
-      function o(d, k, x, g, C) {
-        var y = d[k];
-        if (!l(y)) {
-          var b = $(y);
+      function a(d, w, x, g, C) {
+        var y = d[w];
+        if (!c(y)) {
+          var b = W(y);
           return new j("Invalid " + g + " `" + C + "` of type " + ("`" + b + "` supplied to `" + x + "`, expected a single ReactElement."));
         }
         return null;
       }
-      return I(o);
+      return I(a);
     }
     function ce() {
-      function o(d, k, x, g, C) {
-        var y = d[k];
-        if (!t.isValidElementType(y)) {
-          var b = $(y);
+      function a(d, w, x, g, C) {
+        var y = d[w];
+        if (!e.isValidElementType(y)) {
+          var b = W(y);
           return new j("Invalid " + g + " `" + C + "` of type " + ("`" + b + "` supplied to `" + x + "`, expected a single ReactElement type."));
         }
         return null;
       }
-      return I(o);
+      return I(a);
     }
-    function D(o) {
-      function d(k, x, g, C, y) {
-        if (!(k[x] instanceof o)) {
-          var b = o.name || v, T = mt(k[x]);
+    function D(a) {
+      function d(w, x, g, C, y) {
+        if (!(w[x] instanceof a)) {
+          var b = a.name || v, T = gt(w[x]);
           return new j("Invalid " + C + " `" + y + "` of type " + ("`" + T + "` supplied to `" + g + "`, expected ") + ("instance of `" + b + "`."));
         }
         return null;
       }
       return I(d);
     }
-    function L(o) {
-      if (!Array.isArray(o))
+    function _(a) {
+      if (!Array.isArray(a))
         return process.env.NODE_ENV !== "production" && (arguments.length > 1 ? s(
           "Invalid arguments supplied to oneOf, expected an array, got " + arguments.length + " arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."
-        ) : s("Invalid argument supplied to oneOf, expected an array.")), a;
-      function d(k, x, g, C, y) {
-        for (var b = k[x], T = 0; T < o.length; T++)
-          if (R(b, o[T]))
+        ) : s("Invalid argument supplied to oneOf, expected an array.")), i;
+      function d(w, x, g, C, y) {
+        for (var b = w[x], T = 0; T < a.length; T++)
+          if (P(b, a[T]))
             return null;
-        var E = JSON.stringify(o, function(P, O) {
-          var X = Z(O);
+        var E = JSON.stringify(a, function(R, O) {
+          var X = J(O);
           return X === "symbol" ? String(O) : O;
         });
         return new j("Invalid " + C + " `" + y + "` of value `" + String(b) + "` " + ("supplied to `" + g + "`, expected one of " + E + "."));
       }
       return I(d);
     }
-    function N(o) {
-      function d(k, x, g, C, y) {
-        if (typeof o != "function")
+    function N(a) {
+      function d(w, x, g, C, y) {
+        if (typeof a != "function")
           return new j("Property `" + y + "` of component `" + g + "` has invalid PropType notation inside objectOf.");
-        var b = k[x], T = $(b);
+        var b = w[x], T = W(b);
         if (T !== "object")
           return new j("Invalid " + C + " `" + y + "` of type " + ("`" + T + "` supplied to `" + g + "`, expected an object."));
         for (var E in b)
-          if (i(b, E)) {
-            var S = o(b, E, g, C, y + "." + E, n);
+          if (o(b, E)) {
+            var S = a(b, E, g, C, y + "." + E, n);
             if (S instanceof Error)
               return S;
           }
@@ -616,72 +616,72 @@ function Gn() {
       }
       return I(d);
     }
-    function dt(o) {
-      if (!Array.isArray(o))
-        return process.env.NODE_ENV !== "production" && s("Invalid argument supplied to oneOfType, expected an instance of array."), a;
-      for (var d = 0; d < o.length; d++) {
-        var k = o[d];
-        if (typeof k != "function")
+    function ct(a) {
+      if (!Array.isArray(a))
+        return process.env.NODE_ENV !== "production" && s("Invalid argument supplied to oneOfType, expected an instance of array."), i;
+      for (var d = 0; d < a.length; d++) {
+        var w = a[d];
+        if (typeof w != "function")
           return s(
-            "Invalid argument supplied to oneOfType. Expected an array of check functions, but received " + gt(k) + " at index " + d + "."
-          ), a;
+            "Invalid argument supplied to oneOfType. Expected an array of check functions, but received " + ht(w) + " at index " + d + "."
+          ), i;
       }
       function x(g, C, y, b, T) {
-        for (var E = [], S = 0; S < o.length; S++) {
-          var P = o[S], O = P(g, C, y, b, T, n);
+        for (var E = [], S = 0; S < a.length; S++) {
+          var R = a[S], O = R(g, C, y, b, T, n);
           if (O == null)
             return null;
-          O.data && i(O.data, "expectedType") && E.push(O.data.expectedType);
+          O.data && o(O.data, "expectedType") && E.push(O.data.expectedType);
         }
         var X = E.length > 0 ? ", expected one of type [" + E.join(", ") + "]" : "";
         return new j("Invalid " + b + " `" + T + "` supplied to " + ("`" + y + "`" + X + "."));
       }
       return I(x);
     }
-    function ut() {
-      function o(d, k, x, g, C) {
-        return ee(d[k]) ? null : new j("Invalid " + g + " `" + C + "` supplied to " + ("`" + x + "`, expected a ReactNode."));
+    function dt() {
+      function a(d, w, x, g, C) {
+        return ee(d[w]) ? null : new j("Invalid " + g + " `" + C + "` supplied to " + ("`" + x + "`, expected a ReactNode."));
       }
-      return I(o);
+      return I(a);
     }
-    function Te(o, d, k, x, g) {
+    function Te(a, d, w, x, g) {
       return new j(
-        (o || "React class") + ": " + d + " type `" + k + "." + x + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + g + "`."
+        (a || "React class") + ": " + d + " type `" + w + "." + x + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + g + "`."
       );
     }
-    function pt(o) {
-      function d(k, x, g, C, y) {
-        var b = k[x], T = $(b);
+    function ut(a) {
+      function d(w, x, g, C, y) {
+        var b = w[x], T = W(b);
         if (T !== "object")
           return new j("Invalid " + C + " `" + y + "` of type `" + T + "` " + ("supplied to `" + g + "`, expected `object`."));
-        for (var E in o) {
-          var S = o[E];
+        for (var E in a) {
+          var S = a[E];
           if (typeof S != "function")
-            return Te(g, C, y, E, Z(S));
-          var P = S(b, E, g, C, y + "." + E, n);
-          if (P)
-            return P;
+            return Te(g, C, y, E, J(S));
+          var R = S(b, E, g, C, y + "." + E, n);
+          if (R)
+            return R;
         }
         return null;
       }
       return I(d);
     }
-    function ft(o) {
-      function d(k, x, g, C, y) {
-        var b = k[x], T = $(b);
+    function pt(a) {
+      function d(w, x, g, C, y) {
+        var b = w[x], T = W(b);
         if (T !== "object")
           return new j("Invalid " + C + " `" + y + "` of type `" + T + "` " + ("supplied to `" + g + "`, expected `object`."));
-        var E = e({}, k[x], o);
+        var E = t({}, w[x], a);
         for (var S in E) {
-          var P = o[S];
-          if (i(o, S) && typeof P != "function")
-            return Te(g, C, y, S, Z(P));
-          if (!P)
+          var R = a[S];
+          if (o(a, S) && typeof R != "function")
+            return Te(g, C, y, S, J(R));
+          if (!R)
             return new j(
-              "Invalid " + C + " `" + y + "` key `" + S + "` supplied to `" + g + "`.\nBad object: " + JSON.stringify(k[x], null, "  ") + `
-Valid keys: ` + JSON.stringify(Object.keys(o), null, "  ")
+              "Invalid " + C + " `" + y + "` key `" + S + "` supplied to `" + g + "`.\nBad object: " + JSON.stringify(w[x], null, "  ") + `
+Valid keys: ` + JSON.stringify(Object.keys(a), null, "  ")
             );
-          var O = P(b, S, g, C, y + "." + S, n);
+          var O = R(b, S, g, C, y + "." + S, n);
           if (O)
             return O;
         }
@@ -689,28 +689,28 @@ Valid keys: ` + JSON.stringify(Object.keys(o), null, "  ")
       }
       return I(d);
     }
-    function ee(o) {
-      switch (typeof o) {
+    function ee(a) {
+      switch (typeof a) {
         case "number":
         case "string":
         case "undefined":
           return !0;
         case "boolean":
-          return !o;
+          return !a;
         case "object":
-          if (Array.isArray(o))
-            return o.every(ee);
-          if (o === null || l(o))
+          if (Array.isArray(a))
+            return a.every(ee);
+          if (a === null || c(a))
             return !0;
-          var d = p(o);
+          var d = f(a);
           if (d) {
-            var k = d.call(o), x;
-            if (d !== o.entries) {
-              for (; !(x = k.next()).done; )
+            var w = d.call(a), x;
+            if (d !== a.entries) {
+              for (; !(x = w.next()).done; )
                 if (!ee(x.value))
                   return !1;
             } else
-              for (; !(x = k.next()).done; ) {
+              for (; !(x = w.next()).done; ) {
                 var g = x.value;
                 if (g && !ee(g[1]))
                   return !1;
@@ -722,27 +722,27 @@ Valid keys: ` + JSON.stringify(Object.keys(o), null, "  ")
           return !1;
       }
     }
-    function ht(o, d) {
-      return o === "symbol" ? !0 : d ? d["@@toStringTag"] === "Symbol" || typeof Symbol == "function" && d instanceof Symbol : !1;
+    function ft(a, d) {
+      return a === "symbol" ? !0 : d ? d["@@toStringTag"] === "Symbol" || typeof Symbol == "function" && d instanceof Symbol : !1;
     }
-    function $(o) {
-      var d = typeof o;
-      return Array.isArray(o) ? "array" : o instanceof RegExp ? "object" : ht(d, o) ? "symbol" : d;
+    function W(a) {
+      var d = typeof a;
+      return Array.isArray(a) ? "array" : a instanceof RegExp ? "object" : ft(d, a) ? "symbol" : d;
     }
-    function Z(o) {
-      if (typeof o > "u" || o === null)
-        return "" + o;
-      var d = $(o);
+    function J(a) {
+      if (typeof a > "u" || a === null)
+        return "" + a;
+      var d = W(a);
       if (d === "object") {
-        if (o instanceof Date)
+        if (a instanceof Date)
           return "date";
-        if (o instanceof RegExp)
+        if (a instanceof RegExp)
           return "regexp";
       }
       return d;
     }
-    function gt(o) {
-      var d = Z(o);
+    function ht(a) {
+      var d = J(a);
       switch (d) {
         case "array":
         case "object":
@@ -755,73 +755,73 @@ Valid keys: ` + JSON.stringify(Object.keys(o), null, "  ")
           return d;
       }
     }
-    function mt(o) {
-      return !o.constructor || !o.constructor.name ? v : o.constructor.name;
+    function gt(a) {
+      return !a.constructor || !a.constructor.name ? v : a.constructor.name;
     }
-    return w.checkPropTypes = c, w.resetWarningCache = c.resetWarningCache, w.PropTypes = w, w;
+    return k.checkPropTypes = l, k.resetWarningCache = l.resetWarningCache, k.PropTypes = k, k;
   }, ge;
 }
 var me, Fe;
-function Qn() {
+function Gn() {
   if (Fe)
     return me;
   Fe = 1;
-  var t = je();
-  function e() {
+  var e = je();
+  function t() {
   }
   function n() {
   }
-  return n.resetWarningCache = e, me = function() {
-    function i(a, l, f, u, h, p) {
-      if (p !== t) {
+  return n.resetWarningCache = t, me = function() {
+    function o(i, c, p, u, h, f) {
+      if (f !== e) {
         var v = new Error(
           "Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types"
         );
         throw v.name = "Invariant Violation", v;
       }
     }
-    i.isRequired = i;
-    function c() {
-      return i;
+    o.isRequired = o;
+    function l() {
+      return o;
     }
     var s = {
-      array: i,
-      bigint: i,
-      bool: i,
-      func: i,
-      number: i,
-      object: i,
-      string: i,
-      symbol: i,
-      any: i,
-      arrayOf: c,
-      element: i,
-      elementType: i,
-      instanceOf: c,
-      node: i,
-      objectOf: c,
-      oneOf: c,
-      oneOfType: c,
-      shape: c,
-      exact: c,
+      array: o,
+      bigint: o,
+      bool: o,
+      func: o,
+      number: o,
+      object: o,
+      string: o,
+      symbol: o,
+      any: o,
+      arrayOf: l,
+      element: o,
+      elementType: o,
+      instanceOf: l,
+      node: o,
+      objectOf: l,
+      oneOf: l,
+      oneOfType: l,
+      shape: l,
+      exact: l,
       checkPropTypes: n,
-      resetWarningCache: e
+      resetWarningCache: t
     };
     return s.PropTypes = s, s;
   }, me;
 }
-var _s = oe.exports;
+var Ls = oe.exports;
 if (process.env.NODE_ENV !== "production") {
-  var er = et, tr = !0;
-  oe.exports = Gn()(er.isElement, tr);
+  var Qn = et, er = !0;
+  oe.exports = Zn()(Qn.isElement, er);
 } else
-  oe.exports = Qn()();
-var nr = oe.exports;
-const A = /* @__PURE__ */ Sn(nr);
+  oe.exports = Gn()();
+var tr = oe.exports;
+const A = /* @__PURE__ */ Tn(tr);
 let nt, rt;
 typeof document < "u" && (nt = document);
 typeof window < "u" && (rt = window);
-const st = Y.createContext({ document: nt, window: rt }), ae = () => Y.useContext(st), { Provider: rr, Consumer: Ls } = st;
+const st = Y.createContext({ document: nt, window: rt }), ae = () => Y.useContext(st), { Provider: nr, Consumer: _s } = st;
 class ot extends qe {
   componentDidMount() {
     this.props.contentDidMount();
@@ -830,7 +830,7 @@ class ot extends qe {
     this.props.contentDidUpdate();
   }
   render() {
-    return bt.only(this.props.children);
+    return xt.only(this.props.children);
   }
 }
 z(ot, "propTypes", {
@@ -839,12 +839,12 @@ z(ot, "propTypes", {
   contentDidUpdate: A.func.isRequired
 });
 class ye extends qe {
-  constructor(n, i) {
-    super(n, i);
+  constructor(n, o) {
+    super(n, o);
     z(this, "setRef", (n) => {
       this.nodeRef.current = n;
-      const { forwardedRef: i } = this.props;
-      typeof i == "function" ? i(n) : i && (i.current = n);
+      const { forwardedRef: o } = this.props;
+      typeof o == "function" ? o(n) : o && (o.current = n);
     });
     z(this, "handleLoad", () => {
       clearInterval(this.loadCheck), this.state.iframeLoaded || this.setState({ iframeLoaded: !0 });
@@ -875,8 +875,8 @@ class ye extends qe {
     const n = this.getDoc();
     if (!n)
       return null;
-    const i = this.props.contentDidMount, c = this.props.contentDidUpdate, s = n.defaultView || n.parentView, a = /* @__PURE__ */ r.jsx(ot, { contentDidMount: i, contentDidUpdate: c, children: /* @__PURE__ */ r.jsx(rr, { value: { document: n, window: s }, children: /* @__PURE__ */ r.jsx("div", { className: "frame-content", children: this.props.children }) }) }), l = this.getMountTarget();
-    return [Be.createPortal(this.props.head, this.getDoc().head), Be.createPortal(a, l)];
+    const o = this.props.contentDidMount, l = this.props.contentDidUpdate, s = n.defaultView || n.parentView, i = /* @__PURE__ */ r.jsx(ot, { contentDidMount: o, contentDidUpdate: l, children: /* @__PURE__ */ r.jsx(nr, { value: { document: n, window: s }, children: /* @__PURE__ */ r.jsx("div", { className: "frame-content", children: this.props.children }) }) }), c = this.getMountTarget();
+    return [Be.createPortal(this.props.head, this.getDoc().head), Be.createPortal(i, c)];
   }
   render() {
     const n = {
@@ -912,198 +912,205 @@ z(ye, "propTypes", {
   },
   initialContent: '<!DOCTYPE html><html><head></head><body><div class="frame-root"></div></body></html>'
 });
-const sr = Y.forwardRef((t, e) => /* @__PURE__ */ r.jsx(ye, { ...t, forwardedRef: e }));
-let q = null, J = [], it = null;
-function at(t) {
-  const e = window.getComputedStyle(t), n = parseInt(e.paddingLeft, 10), i = parseInt(e.paddingTop, 10), c = parseInt(e.paddingRight, 10), s = parseInt(e.paddingBottom, 10);
-  return { paddingLeft: n, paddingTop: i, paddingRight: c, paddingBottom: s };
+const rr = Y.forwardRef((e, t) => /* @__PURE__ */ r.jsx(ye, { ...e, forwardedRef: t }));
+let q = null, G = [], it = null;
+function sr(e) {
+  const t = window.getComputedStyle(e), n = parseInt(t.paddingLeft, 10), o = parseInt(t.paddingTop, 10), l = parseInt(t.paddingRight, 10), s = parseInt(t.paddingBottom, 10);
+  return { paddingLeft: n, paddingTop: o, paddingRight: l, paddingBottom: s };
 }
-const $e = (t, e, n) => {
+const We = (e, t, n) => {
   if (!q)
     return;
-  const i = t.getBoundingClientRect(), c = q == null ? void 0 : q.getElementById("placeholder"), { paddingLeft: s, paddingTop: a, paddingRight: l, paddingBottom: f } = at(t);
-  c.style.width = e === "vertical" ? i.width - s - l + "px" : "2px", c.style.height = e === "vertical" ? "5px" : i.height - a - f + "px", c.style.display = "block";
-  const u = J.reduce(
-    (h, p) => Math.abs(p - n) < Math.abs(h - n) ? p : h
+  const o = e.getBoundingClientRect(), l = q == null ? void 0 : q.getElementById("placeholder"), { paddingLeft: s, paddingTop: i, paddingRight: c, paddingBottom: p } = sr(e);
+  l.style.width = t === "vertical" ? o.width - s - c + "px" : "2px", l.style.height = t === "vertical" ? "2px" : o.height - i - p + "px", l.style.display = "block";
+  const u = G.reduce(
+    (h, f) => Math.abs(f - n) < Math.abs(h - n) ? f : h
   );
-  it = J.indexOf(u), c.style.top = t.offsetTop + (e === "vertical" ? u : 0) + "px", c.style.left = t.offsetLeft + (e === "horizontal" ? u : 0) + "px";
-}, or = (t) => {
-  const e = lt(t), n = t.getBoundingClientRect(), i = Array.from(t.children);
-  i.filter((a) => a.getAttribute("data-dnd") !== "ignore");
-  const { paddingLeft: c, paddingTop: s } = at(t);
-  J = [e === "vertical" ? c : s], J = [
-    ...J,
-    ...i.map((a) => {
-      const l = a.getBoundingClientRect();
-      return e === "vertical" ? l.top - n.top + l.height : l.left - n.left + l.width;
-    })
-  ];
+  it = G.indexOf(u), t === "vertical" ? (l.style.top = e.offsetTop + u + "px", l.style.left = e.offsetLeft + s + "px") : (l.style.top = e.offsetTop + i + "px", l.style.left = e.offsetLeft + u + "px");
+}, or = (e) => {
+  const t = at(e), n = window.getComputedStyle(e), o = t === "horizontal", l = parseInt(n.paddingLeft), s = parseInt(n.paddingTop);
+  let i = o ? l : s;
+  G = [i], Array.from(e.children).forEach((c) => {
+    const p = window.getComputedStyle(c), u = parseInt(
+      o ? p.marginLeft + p.marginRight : p.marginTop + p.marginBottom
+    ), h = o ? c.offsetWidth : c.offsetHeight;
+    G.push(i + h + u), i += h + u;
+  });
 };
-function lt(t) {
-  const e = window.getComputedStyle(t).display, n = e === "block" ? "vertical" : "horizontal";
-  return e === "flex" && t.style.flexDirection === "column" ? "vertical" : n;
+function at(e) {
+  const t = window.getComputedStyle(e).display, n = window.getComputedStyle(e).flexDirection;
+  if (t === "flex")
+    return n === "column" || n === "column-reverse" ? "vertical" : "horizontal";
+  if (t === "grid") {
+    const o = window.getComputedStyle(e).gridTemplateRows, l = window.getComputedStyle(e).gridTemplateColumns;
+    if (o.includes("auto"))
+      return "vertical";
+    if (l.includes("auto"))
+      return "horizontal";
+  }
+  return t === "block" ? "vertical" : "horizontal";
 }
-const ir = He((t) => {
-  const e = t.target, n = lt(e);
+const ir = He((e) => {
+  const t = e.target, n = at(t);
   if (n === "vertical") {
-    const i = t.clientY - e.offsetTop;
-    $e(e, n, i);
+    const o = e.clientY - t.offsetTop;
+    We(t, n, o);
   } else {
-    const i = t.clientX - e.offsetLeft;
-    $e(e, n, i);
+    const o = e.clientX - t.offsetLeft;
+    We(t, n, o);
   }
-}, 200), ar = (t) => {
-  t.preventDefault(), t.stopPropagation(), ir(t);
+}, 200), ar = (e) => {
+  e.preventDefault(), e.stopPropagation(), ir(e);
 };
-function We() {
-  const t = q == null ? void 0 : q.getElementById("placeholder");
-  t.style.display = "none";
+function $e() {
+  const e = q == null ? void 0 : q.getElementById("placeholder");
+  e.style.display = "none";
 }
 const lr = () => {
-  const { document: t } = ae(), [e, n] = F(ln), i = On(), c = An("dnd");
-  return q = t, {
-    isDragging: e,
+  const { document: e } = ae(), [t, n] = F(an), o = Bn(), l = On("dnd");
+  return q = e, {
+    isDragging: t,
     "data-dnd": "branch",
-    onDragOver: c ? ar : G,
-    onDrop: c ? (s) => {
-      const a = JSON.parse(s.dataTransfer.getData("text/plain"));
-      let l = s.target.getAttribute("data-block-id");
-      l === null && (l = s.target.parentElement.getAttribute("data-block-id")), i({ block: a, dropTargetId: l || null, relativeIndex: it }), n(!1), setTimeout(() => We(), 300);
-    } : G,
-    onDragEnter: c ? (s) => {
-      const a = s;
-      a.stopPropagation(), a.preventDefault(), J = [];
-      const l = a.target;
-      or(l), l.classList.add("outline", "outline-blue-500", "outline-4", "-outline-offset-4"), n(!0);
-    } : G,
-    onDragLeave: c ? (s) => {
-      const a = s;
-      a.stopPropagation(), a.preventDefault(), a.target.classList.remove("outline", "outline-blue-500", "outline-4", "-outline-offset-4");
-    } : G,
-    onMouseOut: c ? () => {
-      n(!1), We();
-    } : G
+    onDragOver: l ? ar : Z,
+    onDrop: l ? (s) => {
+      const i = JSON.parse(s.dataTransfer.getData("text/plain"));
+      let c = s.target.getAttribute("data-block-id");
+      c === null && (c = s.target.parentElement.getAttribute("data-block-id")), o({ block: i, dropTargetId: c || null, relativeIndex: it }), n(!1), setTimeout(() => $e(), 300);
+    } : Z,
+    onDragEnter: l ? (s) => {
+      const i = s;
+      i.stopPropagation(), i.preventDefault(), G = [];
+      const c = i.target;
+      or(c), c.classList.add("outline", "outline-green-300", "outline-2", "-outline-offset-2"), n(!0);
+    } : Z,
+    onDragLeave: l ? (s) => {
+      const i = s;
+      i.stopPropagation(), i.preventDefault(), i.target.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
+    } : Z,
+    onMouseOut: l ? () => {
+      n(!1), $e();
+    } : Z
   };
 };
-function Ce(t) {
-  return t.getAttribute("data-block-id") ? t : t.closest("[data-block-id]");
+function Ce(e) {
+  return e.getAttribute("data-block-id") ? e : e.closest("[data-block-id]");
 }
-function cr(t) {
-  t.container.innerHTML = "", t.container.parentNode.removeChild(t.container);
-  var e = document.querySelector(".ql-toolbar");
-  e && e.parentNode.removeChild(e), t = null;
+function cr(e) {
+  e.container.innerHTML = "", e.container.parentNode.removeChild(e.container);
+  var t = document.querySelector(".ql-toolbar");
+  t && t.parentNode.removeChild(t), e = null;
 }
 const dr = () => {
-  const t = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], e = cn(), [, n] = H(), [, i] = ie(), [c, s] = F(Q);
-  return (a) => {
+  const e = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], t = ln(), [, n] = H(), [, o] = ie(), [l, s] = F(Q);
+  return (i) => {
     var v;
-    if (c)
+    if (l)
       return;
-    const l = Ce(a.target), f = l.getAttribute("data-block-type");
-    if (!f || !t.includes(f))
+    const c = Ce(i.target), p = c.getAttribute("data-block-type");
+    if (!p || !e.includes(p))
       return;
-    const u = l.cloneNode(!0);
-    l.style.display = "none", Array.from(u.attributes).forEach((w) => {
-      w.name !== "class" && u.removeAttribute(w.name);
-    }), f === "Text" && (u.style.display = "inline-block"), l.parentNode.insertBefore(u, l.nextSibling);
-    const h = new Bn(u, { placeholder: "Type here..." });
-    function p() {
-      const w = h.getText(0, h.getLength());
-      e([l.getAttribute("data-block-id")], { content: w }), l.removeAttribute("style"), u.removeEventListener("blur", p, !0), cr(h), s(""), i("");
+    const u = c.cloneNode(!0);
+    c.style.display = "none", Array.from(u.attributes).forEach((k) => {
+      k.name !== "class" && u.removeAttribute(k.name);
+    }), p === "Text" && (u.style.display = "inline-block"), c.parentNode.insertBefore(u, c.nextSibling);
+    const h = new Dn(u, { placeholder: "Type here..." });
+    function f() {
+      const k = h.getText(0, h.getLength());
+      t([c.getAttribute("data-block-id")], { content: k }), c.removeAttribute("style"), u.removeEventListener("blur", f, !0), cr(h), s(""), o("");
     }
-    u.addEventListener("blur", p, !0), h.focus(), (v = u.querySelector(".ql-clipboard")) == null || v.remove(), n([]), s(l.getAttribute("data-block-id"));
+    u.addEventListener("blur", f, !0), h.focus(), (v = u.querySelector(".ql-clipboard")) == null || v.remove(), n([]), s(c.getAttribute("data-block-id"));
   };
 }, ur = () => {
-  const [, t] = K(), [, e] = H(), [n] = F(Q);
-  return (i) => {
+  const [, e] = K(), [, t] = H(), [n] = F(Q);
+  return (o) => {
     if (n)
       return;
-    i.stopPropagation();
-    const c = Ce(i.target);
-    if (c.getAttribute("data-block-parent")) {
-      const s = c.getAttribute("data-style-prop"), a = c.getAttribute("data-style-id"), l = c.getAttribute("data-block-parent");
-      t([{ id: a, prop: s, blockId: l }]), e([l]);
+    o.stopPropagation();
+    const l = Ce(o.target);
+    if (l.getAttribute("data-block-parent")) {
+      const s = l.getAttribute("data-style-prop"), i = l.getAttribute("data-style-id"), c = l.getAttribute("data-block-parent");
+      e([{ id: i, prop: s, blockId: c }]), t([c]);
     } else
-      c.getAttribute("data-block-id") && e([c.getAttribute("data-block-id")]);
+      l.getAttribute("data-block-id") && t([l.getAttribute("data-block-id")]);
   };
-}, pr = He((t, e) => {
-  const n = Ce(t.target);
-  n.getAttribute("data-style-id") && e(n.getAttribute("data-style-id"));
+}, pr = He((e, t) => {
+  const n = Ce(e.target);
+  n.getAttribute("data-style-id") && t(n.getAttribute("data-style-id"));
 }, 100), fr = () => {
-  const [, t] = ie(), [e] = F(Q);
+  const [, e] = ie(), [t] = F(Q);
   return (n) => {
-    e || pr(n, t);
+    t || pr(n, e);
   };
-}, hr = ({ children: t }) => {
-  const { document: e } = ae(), [n] = H(), [i, c] = K();
+}, hr = ({ children: e }) => {
+  const { document: t } = ae(), [n] = H(), [o, l] = K();
   M(() => {
     setTimeout(() => {
-      if (!U(i))
+      if (!U(o))
         return;
-      const u = ct(e, re(n));
+      const u = lt(t, re(n));
       if (u) {
         const h = u.getAttribute("data-style-prop");
         if (h) {
-          const p = u.getAttribute("data-style-id"), v = u.getAttribute("data-block-parent");
-          c([{ id: p, prop: h, blockId: v }]);
+          const f = u.getAttribute("data-style-id"), v = u.getAttribute("data-block-parent");
+          l([{ id: f, prop: h, blockId: v }]);
         }
       }
     }, 100);
-  }, [e, n, c, i]);
-  const s = dr(), a = ur(), l = fr(), f = lr();
+  }, [t, n, l, o]);
+  const s = dr(), i = ur(), c = fr(), p = lr();
   return /* @__PURE__ */ r.jsx(
     "div",
     {
       id: "canvas",
-      onClick: a,
+      onClick: i,
       onDoubleClick: s,
-      onMouseMove: l,
-      ...Ct(f, "isDragging"),
-      className: "relative h-screen max-w-full " + (f.isDragging ? "dragging" : ""),
-      children: t
+      onMouseMove: c,
+      ...jt(p, "isDragging"),
+      className: "relative h-screen max-w-full " + (p.isDragging ? "dragging" : ""),
+      children: e
     }
   );
-}, ct = (t, e) => t.querySelector(`[data-block-id="${e}"]`), gr = () => {
-  const { window: t } = ae(), [e, n] = H(), [, i] = K(), { undo: c, redo: s } = ke(), a = Ve(), [, l] = dn(), [, f] = un(), { pasteBlocks: u } = pn(), [, h] = Xe(), p = Je(), { savePage: v } = fn(), [w] = F(Q), [, R] = F(hn), j = (I) => {
-    I.key === "Enter" && (I.preventDefault(), e.length === 1 && R(re(e)));
+}, lt = (e, t) => e.querySelector(`[data-block-id="${t}"]`), gr = () => {
+  const { window: e } = ae(), [t, n] = H(), [, o] = K(), { undo: l, redo: s } = we(), i = Ve(), [, c] = cn(), [, p] = dn(), { pasteBlocks: u } = un(), [, h] = Xe(), f = Je(), { savePage: v } = pn(), [k] = F(Q), [, P] = F(fn), j = (I) => {
+    I.key === "Enter" && (I.preventDefault(), t.length === 1 && P(re(t)));
   };
   return M(() => {
     const I = (m) => {
       if (m.key === "Escape") {
-        n([]), i([]);
+        n([]), o([]);
         return;
       }
-      if (j(m), !w && (m.key === "Delete" || m.key === "Backspace") && (m.preventDefault(), p(e)), m.ctrlKey || m.metaKey) {
+      if (j(m), !k && (m.key === "Delete" || m.key === "Backspace") && (m.preventDefault(), f(t)), m.ctrlKey || m.metaKey) {
         if (["z", "y", "d", "x", "c", "p", "s", "v"].includes(m.key)) {
-          if (w && ["x", "z", "v"].includes(m.key))
+          if (k && ["x", "z", "v"].includes(m.key))
             return !0;
           m.preventDefault();
         }
-        m.key === "s" && (m.stopPropagation(), m.preventDefault(), v()), m.key === "z" && c(), m.key === "y" && s(), m.key === "d" && a(e), m.key === "x" && l(e), m.key === "c" && f(e), m.key === "v" && e.length > 0 && u(e[0]);
+        m.key === "s" && (m.stopPropagation(), m.preventDefault(), v()), m.key === "z" && l(), m.key === "y" && s(), m.key === "d" && i(t), m.key === "x" && c(t), m.key === "c" && p(t), m.key === "v" && t.length > 0 && u(t[0]);
       }
     };
-    return t.removeEventListener("keydown", I), t.addEventListener("keydown", I), () => {
-      t.removeEventListener("keydown", I);
+    return e.removeEventListener("keydown", I), e.addEventListener("keydown", I), () => {
+      e.removeEventListener("keydown", I);
     };
   }, [
-    e,
+    t,
     n,
-    c,
-    p,
-    h,
-    s,
-    a,
     l,
     f,
+    h,
+    s,
+    i,
+    c,
+    p,
     u,
-    w,
+    k,
     v,
-    t
+    e
   ]), null;
-}, mr = ({ block: t, label: e }) => {
-  const [, n] = _n(() => ({
+}, mr = ({ block: e, label: t }) => {
+  const [, n] = Mn(() => ({
     type: "CANVAS_BLOCK",
-    item: t
+    item: e
   }));
   return /* @__PURE__ */ r.jsxs(
     "div",
@@ -1115,72 +1122,72 @@ const dr = () => {
       },
       children: [
         /* @__PURE__ */ r.jsx(Pt, {}),
-        e
+        t
       ]
     }
   );
-}, yr = ({ selectedBlockElement: t, block: e }) => {
-  const n = Je(), i = Ve(), [, c] = H(), [, s] = K(), { floatingStyles: a, refs: l, update: f } = Pn({
+}, yr = ({ selectedBlockElement: e, block: t }) => {
+  const n = Je(), o = Ve(), [, l] = H(), [, s] = K(), { floatingStyles: i, refs: c, update: p } = Pn({
     placement: "top-start",
-    middleware: [Mn(), Rn()],
+    middleware: [Rn(), An()],
     elements: {
-      reference: t
+      reference: e
     }
   });
-  Ln(t, () => f(), t !== null);
-  const u = B(e, "_parent", null), h = U(B(e, "_name", "")) ? B(e, "_type", "") : B(e, "_name", "");
-  return !t || !e ? null : /* @__PURE__ */ r.jsxs(
+  Ln(e, () => p(), e !== null);
+  const u = B(t, "_parent", null), h = U(B(t, "_name", "")) ? B(t, "_type", "") : B(t, "_name", "");
+  return !e || !t ? null : /* @__PURE__ */ r.jsxs(
     "div",
     {
       role: "button",
       tabIndex: 0,
-      ref: l.setFloating,
-      style: a,
-      onClick: (p) => {
-        p.stopPropagation(), p.preventDefault();
+      ref: c.setFloating,
+      style: i,
+      onClick: (f) => {
+        f.stopPropagation(), f.preventDefault();
       },
-      onKeyDown: (p) => p.stopPropagation(),
+      onKeyDown: (f) => f.stopPropagation(),
       className: "z-50 flex h-6 items-center bg-blue-500  py-2 text-xs text-white",
       children: [
-        /* @__PURE__ */ r.jsx(mr, { label: h, block: e }),
+        /* @__PURE__ */ r.jsx(mr, { label: h, block: t }),
         /* @__PURE__ */ r.jsxs("div", { className: "flex gap-2 px-1 ", children: [
           u && /* @__PURE__ */ r.jsx(
-            Mt,
+            Rt,
             {
               className: "hover:scale-105 ",
               onClick: () => {
-                s([]), c([u]);
+                s([]), l([u]);
               }
             }
           ),
-          gn(B(e, "_type", "")) ? /* @__PURE__ */ r.jsx(_t, { className: "hover:scale-105 ", onClick: () => i([e == null ? void 0 : e._id]) }) : null,
-          mn(B(e, "_type", "")) ? /* @__PURE__ */ r.jsx(Lt, { className: "hover:scale-105 ", onClick: () => n([e == null ? void 0 : e._id]) }) : null
+          hn(B(t, "_type", "")) ? /* @__PURE__ */ r.jsx(Mt, { className: "hover:scale-105 ", onClick: () => o([t == null ? void 0 : t._id]) }) : null,
+          gn(B(t, "_type", "")) ? /* @__PURE__ */ r.jsx(Lt, { className: "hover:scale-105 ", onClick: () => n([t == null ? void 0 : t._id]) }) : null
         ] })
       ]
     }
   );
-}, vr = ({ model: t }) => {
-  const [e] = yn(), [n] = H(), [i] = Ye(), [c] = ie(), [s] = K(), { document: a, window: l } = ae(), [f] = W(a == null ? void 0 : a.getElementById("highlighted-block")), [u] = W(
-    a == null ? void 0 : a.getElementById("selected-block")
-  ), [h] = W(
-    a == null ? void 0 : a.getElementById("selected-styling-block")
+}, vr = ({ model: e }) => {
+  const [t] = mn(), [n] = H(), [o] = Ye(), [l] = ie(), [s] = K(), { document: i, window: c } = ae(), [p] = $(i == null ? void 0 : i.getElementById("highlighted-block")), [u] = $(
+    i == null ? void 0 : i.getElementById("selected-block")
+  ), [h] = $(
+    i == null ? void 0 : i.getElementById("selected-styling-block")
   );
   M(() => {
-    i ? a == null || a.documentElement.classList.add("dark") : a == null || a.documentElement.classList.remove("dark");
-  }, [i, a]);
-  const p = B(e, "headingFont", "DM Sans"), v = B(e, "bodyFont", "DM Sans");
+    o ? i == null || i.documentElement.classList.add("dark") : i == null || i.documentElement.classList.remove("dark");
+  }, [o, i]);
+  const f = B(t, "headingFont", "DM Sans"), v = B(t, "bodyFont", "DM Sans");
   return M(() => {
-    const w = B(e, "primaryColor", "#000"), R = B(e, "secondaryColor", "#FFF"), j = Nn({
-      colors: [w, R],
+    const k = B(t, "primaryColor", "#000"), P = B(t, "secondaryColor", "#FFF"), j = _n({
+      colors: [k, P],
       names: ["primary", "secondary"]
     });
-    j.primary.DEFAULT = w, j.secondary.DEFAULT = R;
-    const I = B(e, "roundedCorners", "0");
-    !l || !l.tailwind || (l.tailwind.config = {
+    j.primary.DEFAULT = k, j.secondary.DEFAULT = P;
+    const I = B(t, "roundedCorners", "0");
+    !c || !c.tailwind || (c.tailwind.config = {
       darkMode: "class",
       theme: {
         fontFamily: {
-          heading: [p],
+          heading: [f],
           body: [v]
         },
         extend: {
@@ -1192,48 +1199,48 @@ const dr = () => {
       },
       plugins: [
         // @ts-ignore
-        l.tailwind.plugin.withOptions(({ prefix: m = "ui" } = {}) => ({ addVariant: V }) => {
-          for (const _ of ["open", "checked", "selected", "active", "disabled"])
-            V(`${m}-${_}`, [
-              `&[data-headlessui-state~="${_}"]`,
-              `:where([data-headlessui-state~="${_}"]) &`
-            ]), V(`${m}-not-${_}`, [
-              `&[data-headlessui-state]:not([data-headlessui-state~="${_}"])`,
-              `:where([data-headlessui-state]:not([data-headlessui-state~="${_}"])) &:not([data-headlessui-state])`
+        c.tailwind.plugin.withOptions(({ prefix: m = "ui" } = {}) => ({ addVariant: V }) => {
+          for (const L of ["open", "checked", "selected", "active", "disabled"])
+            V(`${m}-${L}`, [
+              `&[data-headlessui-state~="${L}"]`,
+              `:where([data-headlessui-state~="${L}"]) &`
+            ]), V(`${m}-not-${L}`, [
+              `&[data-headlessui-state]:not([data-headlessui-state~="${L}"])`,
+              `:where([data-headlessui-state]:not([data-headlessui-state~="${L}"])) &:not([data-headlessui-state])`
             ]);
         })
       ]
     });
-  }, [e, l, p, v]), M(() => {
-    u && (u.textContent = `${ne(n, (w) => `[data-block-id="${w}"]`).join(",")}{
+  }, [t, c, f, v]), M(() => {
+    u && (u.textContent = `${ne(n, (k) => `[data-block-id="${k}"]`).join(",")}{
                 outline: 1px solid ${n.length === 1 ? "#42a1fc" : "orange"} !important; outline-offset: -1px;
             }`);
   }, [n, u]), M(() => {
-    f && (f.textContent = c ? `[data-style-id="${c}"]{ outline: 1px solid orange !important; outline-offset: -1px;}` : "");
-  }, [c, n, f]), M(() => {
-    h && (h.textContent = `${ne(s, ({ id: w }) => `[data-style-id="${w}"]`).join(",")}{
+    p && (p.textContent = l ? `[data-style-id="${l}"]{ outline: 1px solid orange !important; outline-offset: -1px;}` : "");
+  }, [l, n, p]), M(() => {
+    h && (h.textContent = `${ne(s, ({ id: k }) => `[data-style-id="${k}"]`).join(",")}{
                 outline: 1px solid orange !important; outline-offset: -1px;
             }`);
   }, [s, h]), M(() => {
-    if (t === "section")
+    if (e === "section")
       return;
-    const w = B(e, "bodyTextLightColor", "#64748b"), R = B(e, "bodyTextDarkColor", "#94a3b8"), j = B(e, "bodyBgLightColor", "#FFFFFF"), I = B(e, "bodyBgDarkColor", "#0f172a");
-    a.body.className = `font-body antialiased text-[${w}] bg-[${j}] dark:text-[${R}] dark:bg-[${I}]`;
-  }, [e, a, t]), t === "page" ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    p && /* @__PURE__ */ r.jsx(
+    const k = B(t, "bodyTextLightColor", "#64748b"), P = B(t, "bodyTextDarkColor", "#94a3b8"), j = B(t, "bodyBgLightColor", "#FFFFFF"), I = B(t, "bodyBgDarkColor", "#0f172a");
+    i.body.className = `font-body antialiased text-[${k}] bg-[${j}] dark:text-[${P}] dark:bg-[${I}]`;
+  }, [t, i, e]), e === "page" ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+    f && /* @__PURE__ */ r.jsx(
       "link",
       {
         id: "heading-font",
         rel: "stylesheet",
         type: "text/css",
-        href: `https://fonts.googleapis.com/css2?family=${p.replace(
+        href: `https://fonts.googleapis.com/css2?family=${f.replace(
           / /g,
           "+"
         )}:wght@300;400;500;600;700;800;900&display=swap`,
         media: "all"
       }
     ),
-    v && p !== v && /* @__PURE__ */ r.jsx(
+    v && f !== v && /* @__PURE__ */ r.jsx(
       "link",
       {
         id: "body-font",
@@ -1246,122 +1253,122 @@ const dr = () => {
         media: "all"
       }
     ),
-    p && /* @__PURE__ */ r.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${p}",ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}` })
+    f && /* @__PURE__ */ r.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${f}",ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}` })
   ] }) : null;
-}, xr = (t) => {
-  const e = {};
-  return Object.keys(t).forEach((n) => {
-    be(t[n]) && t[n].startsWith(Oe) && (e[n] = t[n].replace(Oe, "").split(","));
-  }), e;
-}, br = Tt((t) => {
-  const e = t.replace(Qe, "").split(",");
-  return $n(e[0], e[1]);
+}, xr = (e) => {
+  const t = {};
+  return Object.keys(e).forEach((n) => {
+    be(e[n]) && e[n].startsWith(Oe) && (t[n] = e[n].replace(Oe, "").split(","));
+  }), t;
+}, br = Ct((e) => {
+  const t = e.replace(Qe, "").split(",");
+  return Fn(t[0], t[1]);
 });
-function kr(t, e) {
-  return B(t, `${e}_attrs`, {});
+function wr(e, t) {
+  return B(e, `${t}_attrs`, {});
 }
-function wr(t) {
-  const e = {};
-  return Object.keys(t).forEach((n) => {
-    if (be(t[n]) && t[n].startsWith(Qe)) {
-      const i = br(t[n]);
-      e[n] = {
-        className: i,
+function kr(e) {
+  const t = {};
+  return Object.keys(e).forEach((n) => {
+    if (be(e[n]) && e[n].startsWith(Qe)) {
+      const o = br(e[n]);
+      t[n] = {
+        className: o,
         "data-style-prop": n,
-        "data-block-parent": t._id,
-        "data-style-id": `${n}-${t._id}`,
-        ...kr(t, n)
+        "data-block-parent": e._id,
+        "data-style-id": `${n}-${e._id}`,
+        ...wr(e, n)
       };
     }
-  }), e;
+  }), t;
 }
-function jr(t, e) {
-  const n = B(t, "_bindings", {});
-  return U(n) ? { ...t } : (St(n, (i, c) => {
-    be(i) && B(e, i, null) && (t[c] = B(e, i, null));
-  }), t);
+function jr(e, t) {
+  const n = B(e, "_bindings", {});
+  return U(n) ? { ...e } : (Tt(n, (o, l) => {
+    be(o) && B(t, o, null) && (e[l] = B(t, o, null));
+  }), e);
 }
-function ve({ blocks: t }) {
-  const e = Ze(), n = xe((s) => wr(s), []), [i] = En(), [c] = vn(Q);
+function ve({ blocks: e }) {
+  const t = Ze(), n = xe((s) => kr(s), []), [o] = Sn(), [l] = yn(Q);
   return /* @__PURE__ */ r.jsx(r.Fragment, { children: Y.Children.toArray(
-    t.map((s, a) => {
-      if (c === s._id)
+    e.map((s, i) => {
+      if (l === s._id)
         return null;
-      const l = xr(s), f = {};
-      U(l) || Object.keys(l).forEach((v) => {
-        f[v] = Y.Children.toArray(
-          l[v].map((w) => /* @__PURE__ */ r.jsx(ve, { blocks: [Et(e, { _id: w })] }))
+      const c = xr(s), p = {};
+      U(c) || Object.keys(c).forEach((v) => {
+        p[v] = Y.Children.toArray(
+          c[v].map((k) => /* @__PURE__ */ r.jsx(ve, { blocks: [St(t, { _id: k })] }))
         );
       });
-      const u = ze(e, { _parent: s._id });
-      f.children = u.length ? /* @__PURE__ */ r.jsx(ve, { blocks: u }) : null;
-      const h = Wn(s._type), p = B(h, "component", null);
-      return It(p) ? /* @__PURE__ */ r.jsx("noscript", { children: `<!-- ${s == null ? void 0 : s._type} not registered -->` }) : /* @__PURE__ */ r.jsx(Ue, { children: Y.createElement(p, {
+      const u = ze(t, { _parent: s._id });
+      p.children = u.length ? /* @__PURE__ */ r.jsx(ve, { blocks: u }) : null;
+      const h = Wn(s._type), f = B(h, "component", null);
+      return Et(f) ? /* @__PURE__ */ r.jsx("noscript", { children: `<!-- ${s == null ? void 0 : s._type} not registered -->` }) : /* @__PURE__ */ r.jsx(Ue, { children: Y.createElement(f, {
         blockProps: {
           "data-block-id": s._id,
           "data-block-type": s._type,
-          "data-dnd": xn(s._type) ? "branch" : "leaf"
+          "data-dnd": vn(s._type) ? "branch" : "leaf"
         },
         inBuilder: !0,
-        index: a,
-        ...jr(s, i),
+        index: i,
+        ...jr(s, o),
         ...n(s),
-        ...f
+        ...p
       }) });
     })
   ) });
 }
 const Cr = () => {
-  const t = Ze();
-  return /* @__PURE__ */ r.jsx(Fn, { children: U(t) ? null : /* @__PURE__ */ r.jsx(In, { children: /* @__PURE__ */ r.jsx(ve, { blocks: ze(t, (e) => U(e._parent)) }) }) });
-}, Tr = (t, e) => t.querySelector(`[data-style-id="${e}"]`), Sr = () => {
-  const [t] = F(bn), [e] = Xe(), [n] = we(), [, i] = H(), c = kn(), [, s] = ie(), a = Se(null), l = Se(null), [f, u] = W({ width: 0, height: 0 }), h = Xn(f), [p, v] = W(0), [w, R] = W([]), [, j] = W([]), [, I] = F(wn), [m, V] = K(), _ = jn("loadingCanvas", !1);
+  const e = Ze();
+  return /* @__PURE__ */ r.jsx(Nn, { children: U(e) ? null : /* @__PURE__ */ r.jsx(En, { children: /* @__PURE__ */ r.jsx(ve, { blocks: ze(e, (t) => U(t._parent)) }) }) });
+}, Tr = (e, t) => e.querySelector(`[data-style-id="${t}"]`), Sr = () => {
+  const [e] = F(xn), [t] = Xe(), [n] = ke(), [, o] = H(), l = bn(), [, s] = ie(), i = Se(null), c = Se(null), [p, u] = $({ width: 0, height: 0 }), h = Vn(p), [f, v] = $(0), [k, P] = $([]), [, j] = $([]), [, I] = F(wn), [m, V] = K(), L = kn("loadingCanvas", !1);
   M(() => {
-    const { clientWidth: D, clientHeight: L } = l.current;
-    u({ width: D, height: L }), p === 0 && v(D);
-  }, [l, n, p]);
-  const le = (D, L = 0) => {
+    const { clientWidth: D, clientHeight: _ } = c.current;
+    u({ width: D, height: _ }), f === 0 && v(D);
+  }, [c, n, f]);
+  const le = (D, _ = 0) => {
     const { top: N } = D.getBoundingClientRect();
-    return N + L >= 0 && N - L <= window.innerHeight;
+    return N + _ >= 0 && N - _ <= window.innerHeight;
   };
   M(() => {
-    var D, L;
-    if (c && c.type !== "Multiple" && a.current) {
-      const N = ct(a.current.contentDocument, c._id);
-      N && (le(N) || (L = (D = a.current) == null ? void 0 : D.contentWindow) == null || L.scrollTo({ top: N.offsetTop, behavior: "smooth" }), R([N]));
+    var D, _;
+    if (l && l.type !== "Multiple" && i.current) {
+      const N = lt(i.current.contentDocument, l._id);
+      N && (le(N) || (_ = (D = i.current) == null ? void 0 : D.contentWindow) == null || _.scrollTo({ top: N.offsetTop, behavior: "smooth" }), P([N]));
     }
-  }, [c]), M(() => {
-    if (!U(m) && a.current) {
+  }, [l]), M(() => {
+    if (!U(m) && i.current) {
       const D = Tr(
-        a.current.contentDocument,
+        i.current.contentDocument,
         re(m).id
       );
       j(D ? [D] : [null]);
     } else
       j([null]);
   }, [m]);
-  const ce = kt(() => {
-    let D = Vn;
-    return t === "offline" && (D = D.replace(
+  const ce = bt(() => {
+    let D = Kn;
+    return e === "offline" && (D = D.replace(
       "https://old.chaibuilder.com/offline/tailwind.cdn.js",
       "/offline/tailwind.cdn.js"
     ), D = D.replace("https://unpkg.com/aos@next/dist/aos.css", "/offline/aos.css"), D = D.replace("https://unpkg.com/aos@next/dist/aos.js", "/offline/aos.js")), D;
-  }, [t]);
+  }, [e]);
   return /* @__PURE__ */ r.jsx(
     "div",
     {
       onClick: () => {
-        i([]), V([]);
+        o([]), V([]);
       },
       onMouseLeave: () => setTimeout(() => s(""), 300),
       className: "relative mx-auto h-full w-full",
-      style: p > 0 && !U(h) ? { width: e ? "100%" : p } : {},
-      ref: l,
+      style: f > 0 && !U(h) ? { width: t ? "100%" : f } : {},
+      ref: c,
       children: /* @__PURE__ */ r.jsxs(
-        sr,
+        rr,
         {
-          contentDidMount: () => I(a.current),
-          ref: a,
+          contentDidMount: () => I(i.current),
+          ref: i,
           id: "canvas-iframe",
           style: { width: `${n}px`, ...h },
           className: "relative mx-auto box-content h-full max-w-full shadow-lg transition-all duration-300 ease-linear",
@@ -1371,12 +1378,12 @@ const Cr = () => {
             /* @__PURE__ */ r.jsx(
               yr,
               {
-                block: c,
-                selectedBlockElement: re(w)
+                block: l,
+                selectedBlockElement: re(k)
               }
             ),
             /* @__PURE__ */ r.jsx(vr, { model: "page" }),
-            /* @__PURE__ */ r.jsx(hr, { children: _ ? /* @__PURE__ */ r.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ r.jsx(Ge, { className: "h-full" }) }) : /* @__PURE__ */ r.jsx(Cr, {}) }),
+            /* @__PURE__ */ r.jsx(hr, { children: L ? /* @__PURE__ */ r.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ r.jsx(Ge, { className: "h-full" }) }) : /* @__PURE__ */ r.jsx(Cr, {}) }),
             /* @__PURE__ */ r.jsx("div", { id: "placeholder", className: "absolute bg-green-500 z-[99999] max-w-full transition-transform" })
           ]
         }
@@ -1384,15 +1391,15 @@ const Cr = () => {
     }
   );
 }, Er = wt(() => import("./AddBlocks-imyQSCbI.js")), Ns = () => {
-  const [t, e] = F(Cn);
+  const [e, t] = F(jn);
   return /* @__PURE__ */ r.jsxs("div", { className: "flex h-full w-full flex-col", children: [
-    /* @__PURE__ */ r.jsx(Kn, {}),
+    /* @__PURE__ */ r.jsx(Yn, {}),
     /* @__PURE__ */ r.jsxs("div", { className: "relative flex-1 overflow-hidden bg-slate-800/90 px-2 bg-[linear-gradient(to_right,#222_0.5px,transparent_0.5px),linear-gradient(to_bottom,#222_0.5px,transparent_0.5px)] bg-[size:12px_12px]", children: [
-      /* @__PURE__ */ r.jsx(Ue, { fallback: /* @__PURE__ */ r.jsx(Ge, { className: "h-full" }), children: /* @__PURE__ */ r.jsx(Dn, { children: /* @__PURE__ */ r.jsx(Sr, {}) }) }),
-      t ? /* @__PURE__ */ r.jsx(
+      /* @__PURE__ */ r.jsx(Ue, { fallback: /* @__PURE__ */ r.jsx(Ge, { className: "h-full" }), children: /* @__PURE__ */ r.jsx(In, { children: /* @__PURE__ */ r.jsx(Sr, {}) }) }),
+      e ? /* @__PURE__ */ r.jsx(
         "div",
         {
-          onClick: () => e(!1),
+          onClick: () => t(!1),
           className: "absolute inset-0 z-50 flex items-center bg-black/30 backdrop-blur-sm",
           children: /* @__PURE__ */ r.jsx(
             "div",