@chaibuilder/sdk 1.2.56 → 1.2.57

package/dist/{CanvasArea-CqILE5PR.js → CanvasArea-8f_Ki3B7.js}

@@ -1,47 +1,44 @@
 var He = Object.defineProperty;
-var Pe = (n, s, e) => s in n ? He(n, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[s] = e;
-var N = (n, s, e) => (Pe(n, typeof s != "symbol" ? s + "" : s, e), e);
+var ze = (n, s, e) => s in n ? He(n, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[s] = e;
+var T = (n, s, e) => (ze(n, typeof s != "symbol" ? s + "" : s, e), e);
 import { j as r } from "./jsx-runtime-WbnYoNE9.js";
-import A, { createElement as ce, useCallback as O, useState as B, useEffect as j, Component as $e, Children as ze, Suspense as J, useRef as de, useMemo as Oe } from "react";
-import { map as H, includes as pe, toUpper as X, round as Ue, throttle as ye, has as be, isEmpty as I, first as U, omit as We, pick as qe, get as f, isString as se, memoize as Ke, each as Ye, find as Ge, filter as ke, isNull as Xe } from "lodash-es";
-import { ResetIcon as ue, SunIcon as Qe, MobileIcon as he, LaptopIcon as Ze, DesktopIcon as Je, DotsVerticalIcon as Ve, EraserIcon as et, ZoomInIcon as tt, DragHandleDots2Icon as st, ArrowUpIcon as ot, CopyIcon as nt, TrashIcon as rt } from "@radix-ui/react-icons";
-import { k as we, B as W, w as je, aq as Ce, ar as it, as as at, at as lt, au as ct, p as oe, X as dt, h as P, av as pt, aw as ut, ax as ht, ay as mt, az as gt, aA as ft, aB as _e, L as D, Y as M, A as xt, a as vt, b as $t, c as yt, d as bt, e as kt, f as wt, g as jt, a3 as Ct, aC as _t, aD as Bt, q as Be, ap as z, aE as Dt, n as At, D as T, aF as De, Q as It, aG as F, aH as St, j as ne, x as Ae, F as Ie, H as Se, V as Et, aI as Nt, aJ as Mt, aK as Tt, G as Lt, aL as Ft, aM as Rt, aN as Ht, aO as Pt, M as zt, aP as Ot, ah as V, i as Ut, a2 as Wt } from "./ChaiBuilderEditor-tkzS851D.js";
-import { useTranslation as re } from "react-i18next";
+import S, { createElement as pe, useCallback as q, useState as B, useEffect as j, Component as be, Children as Oe, Suspense as J, useRef as ue, useMemo as Ue } from "react";
+import { map as O, includes as V, toUpper as G, round as We, throttle as ye, has as ee, isEmpty as I, first as K, omit as ke, pick as qe, get as f, isString as ne, memoize as Ke, each as Ye, find as Xe, filter as we, isNull as Ge } from "lodash-es";
+import { ResetIcon as he, SunIcon as Qe, MobileIcon as me, LaptopIcon as Ze, DesktopIcon as Je, DotsVerticalIcon as Ve, EraserIcon as et, ZoomInIcon as tt, DragHandleDots2Icon as st, ArrowUpIcon as ot, CopyIcon as nt, TrashIcon as rt } from "@radix-ui/react-icons";
+import { v as je, B as Y, aa as Ce, aR as _e, aS as it, aT as lt, aU as at, a4 as re, as as ct, h as U, E as dt, F as pt, G as ut, H as ht, I as mt, aV as gt, aW as Be, r as D, at as M, A as ft, a as xt, b as vt, c as $t, d as bt, e as yt, f as kt, g as wt, P as jt, U as Ct, aX as _t, a5 as De, aQ as W, aY as Bt, a2 as Dt, ad as L, aZ as Ae, am as At, a_ as R, a$ as St, D as ie, t as Se, q as Ie, s as Ee, Q as It, b0 as Et, b1 as Nt, b2 as Tt, X as Mt, b3 as Lt, b4 as Ft, b5 as Rt, b6 as Pt, ai as Ht, b7 as zt, S as te, $ as Ot } from "./index-uLn8W3eR.js";
+import { a as Ut, u as Wt, B as qt, E as Kt } from "./index-IgLSTkN6.js";
+import { useTranslation as le } from "react-i18next";
 import { useAtom as b } from "jotai";
-import { SparklesIcon as qt } from "lucide-react";
-import me from "react-dom";
+import { SparklesIcon as Yt } from "lucide-react";
+import ge from "react-dom";
 import w from "prop-types";
-import { Quill as Kt } from "react-quill";
-import { d as ie, a as Ee } from "./atoms-ZOWyNoiC.js";
-import { flip as Yt } from "@floating-ui/dom";
-import { useFloating as Gt, shift as Xt } from "@floating-ui/react-dom";
-import { useResizeObserver as Qt } from "@react-hookz/web";
-import { useFeature as Zt } from "flagged";
-import Jt from "@tailwindcss/typography";
-import Vt from "@tailwindcss/forms";
-import es from "@tailwindcss/aspect-ratio";
-import ts from "tailwindcss-palette-generator";
-import { twMerge as ss } from "tailwind-merge";
-import { S as ge, a as Ne } from "./MODIFIERS-fd5XOmum.js";
-import { getBlockComponent as os } from "@chaibuilder/runtime";
-import { u as ns } from "./useCanvasSettings-rEZHbw3s.js";
-import { Provider as rs } from "react-wrap-balancer";
-import { Resizable as is } from "re-resizable";
+import { Quill as Xt } from "react-quill";
+import { d as ae, a as Ne } from "./atoms-ZOWyNoiC.js";
+import { flip as Gt } from "@floating-ui/dom";
+import { useFloating as Qt, shift as Zt } from "@floating-ui/react-dom";
+import { useResizeObserver as Jt } from "@react-hookz/web";
+import { useFeature as Vt } from "flagged";
+import es from "@tailwindcss/typography";
+import ts from "@tailwindcss/forms";
+import ss from "@tailwindcss/aspect-ratio";
+import os from "tailwindcss-palette-generator";
+import { twMerge as ns } from "tailwind-merge";
+import { S as fe, a as Te } from "./MODIFIERS-fd5XOmum.js";
+import { getBlockComponent as rs } from "@chaibuilder/runtime";
+import { Provider as is } from "react-wrap-balancer";
+import { Resizable as ls } from "re-resizable";
 import "./_commonjsHelpers-UyOWmZb0.js";
-import "clsx";
-import "@radix-ui/react-scroll-area";
-import "i18next";
-import "./Functions-7jnEwJyw.js";
-import "tree-model";
-import "./utils-VpVqnC9m.js";
 import "@radix-ui/react-toggle";
 import "class-variance-authority";
+import "./utils-VpVqnC9m.js";
+import "clsx";
 import "@radix-ui/react-switch";
 import "@radix-ui/react-slot";
 import "@radix-ui/react-accordion";
 import "@radix-ui/react-alert-dialog";
 import "@radix-ui/react-dialog";
 import "@radix-ui/react-label";
+import "@radix-ui/react-scroll-area";
 import "@radix-ui/react-tabs";
 import "@radix-ui/react-tooltip";
 import "@radix-ui/react-popover";
@@ -54,21 +51,24 @@ import "@radix-ui/react-toast";
 import "cmdk";
 import "@radix-ui/react-context-menu";
 import "react-icons-picker";
+import "./Functions-7jnEwJyw.js";
+import "tree-model";
+import "i18next";
 import "react-hotkeys-hook";
 import "./index-VBXQixVm.js";
 const as = () => {
-  const { hasUndo: n, hasRedo: s, undo: e, redo: t } = we();
+  const { hasUndo: n, hasRedo: s, undo: e, redo: t } = je();
   return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ r.jsx(W, { disabled: !n(), size: "sm", onClick: e, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(ue, {}) }),
-    /* @__PURE__ */ r.jsx(W, { disabled: !s(), onClick: t, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(ue, { className: "rotate-180 scale-y-[-1] transform" }) })
+    /* @__PURE__ */ r.jsx(Y, { disabled: !n(), size: "sm", onClick: e, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(he, {}) }),
+    /* @__PURE__ */ r.jsx(Y, { disabled: !s(), onClick: t, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(he, { className: "rotate-180 scale-y-[-1] transform" }) })
   ] });
 };
-function ls() {
-  const [n, s] = je();
+function cs() {
+  const [n, s] = Ce();
   return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
     /* @__PURE__ */ r.jsx(Qe, { className: "size-4 shrink-0" }),
     /* @__PURE__ */ r.jsx(
-      Ce,
+      _e,
       {
         id: "dark-mode-switch",
         checked: n,
@@ -85,10 +85,10 @@ function ls() {
         )
       }
     ),
-    /* @__PURE__ */ r.jsx(it, { className: "size-4 ml-3 shrink-0" })
+    /* @__PURE__ */ r.jsx(Ut, { className: "size-4 ml-3 shrink-0" })
   ] });
 }
-const fe = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
+const xe = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
   "svg",
   {
     className: n ? "rotate-90" : "",
@@ -111,33 +111,33 @@ const fe = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
       )
     ]
   }
-), cs = [
+), ds = [
   {
     title: "mobile_xs_title",
     content: "mobile_xs_content",
     breakpoint: "xs",
-    icon: /* @__PURE__ */ r.jsx(he, {}),
+    icon: /* @__PURE__ */ r.jsx(me, {}),
     width: 400
   },
   {
     title: "mobile_sm_title",
     content: "mobile_sm_content",
     breakpoint: "sm",
-    icon: /* @__PURE__ */ r.jsx(he, { className: "rotate-90" }),
+    icon: /* @__PURE__ */ r.jsx(me, { className: "rotate-90" }),
     width: 640
   },
   {
     title: "tablet_md_title",
     content: "tablet_md_content",
     breakpoint: "md",
-    icon: /* @__PURE__ */ r.jsx(fe, {}),
+    icon: /* @__PURE__ */ r.jsx(xe, {}),
     width: 800
   },
   {
     title: "tablet_lg_title",
     content: "tablet_lg_content",
     breakpoint: "lg",
-    icon: /* @__PURE__ */ r.jsx(fe, { landscape: !0 }),
+    icon: /* @__PURE__ */ r.jsx(xe, { landscape: !0 }),
     width: 1024
   },
   {
@@ -154,51 +154,51 @@ const fe = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
     icon: /* @__PURE__ */ r.jsx(Je, {}),
     width: 1920
   }
-], xe = ({
+], ve = ({
   title: n,
   content: s,
   currentBreakpoint: e,
   breakpoint: t,
   width: o,
   icon: c,
-  onClick: a
+  onClick: l
 }) => {
-  const { t: i } = re();
-  return /* @__PURE__ */ r.jsxs(at, { children: [
+  const { t: i } = le();
+  return /* @__PURE__ */ r.jsxs(it, { children: [
     /* @__PURE__ */ r.jsx(lt, { asChild: !0, children: /* @__PURE__ */ r.jsx(
-      W,
+      Y,
       {
-        onClick: () => a(o),
+        onClick: () => l(o),
         size: "sm",
         variant: t === e ? "secondary" : "ghost",
         children: c
       }
     ) }),
-    /* @__PURE__ */ r.jsx(ct, { 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(at, { 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: i(n) }),
       /* @__PURE__ */ r.jsx("p", { className: "text-xs", children: i(s) })
     ] }) }) })
   ] });
-}, ds = () => {
-  const [, n, s] = oe(), [e, t] = dt(), { t: o } = re(), c = P("breakpoints", cs), a = (i) => {
+}, ps = () => {
+  const [, n, s] = re(), [e, t] = ct(), { t: o } = le(), c = U("breakpoints", ds), l = (i) => {
     e.includes(i) ? e.length > 2 && t(e.filter((d) => d !== i)) : t((d) => [...d, i]);
   };
-  return c.length < 4 ? /* @__PURE__ */ r.jsx("div", { className: "flex items-center rounded-md", children: H(c, (i) => /* @__PURE__ */ ce(xe, { ...i, onClick: s, key: i.breakpoint, currentBreakpoint: n })) }) : /* @__PURE__ */ r.jsxs("div", { className: "flex items-center rounded-md", children: [
-    H(
-      c.filter((i) => pe(e, X(i.breakpoint))),
-      (i) => /* @__PURE__ */ ce(xe, { ...i, onClick: s, key: i.breakpoint, currentBreakpoint: n })
+  return c.length < 4 ? /* @__PURE__ */ r.jsx("div", { className: "flex items-center rounded-md", children: O(c, (i) => /* @__PURE__ */ pe(ve, { ...i, onClick: s, key: i.breakpoint, currentBreakpoint: n })) }) : /* @__PURE__ */ r.jsxs("div", { className: "flex items-center rounded-md", children: [
+    O(
+      c.filter((i) => V(e, G(i.breakpoint))),
+      (i) => /* @__PURE__ */ pe(ve, { ...i, onClick: s, key: i.breakpoint, currentBreakpoint: n })
     ),
-    /* @__PURE__ */ r.jsxs(pt, { children: [
-      /* @__PURE__ */ r.jsx(ut, { asChild: !0, children: /* @__PURE__ */ r.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ r.jsx(Ve, { className: "scale-90 transform" }) }) }),
-      /* @__PURE__ */ r.jsxs(ht, { className: "w-56 border-border text-xs", children: [
-        /* @__PURE__ */ r.jsx(mt, { children: o("Breakpoints") }),
-        /* @__PURE__ */ r.jsx(gt, {}),
-        H(c, (i) => /* @__PURE__ */ r.jsx(
-          ft,
+    /* @__PURE__ */ r.jsxs(dt, { children: [
+      /* @__PURE__ */ r.jsx(pt, { asChild: !0, children: /* @__PURE__ */ r.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ r.jsx(Ve, { className: "scale-90 transform" }) }) }),
+      /* @__PURE__ */ r.jsxs(ut, { className: "w-56 border-border text-xs", children: [
+        /* @__PURE__ */ r.jsx(ht, { children: o("Breakpoints") }),
+        /* @__PURE__ */ r.jsx(mt, {}),
+        O(c, (i) => /* @__PURE__ */ r.jsx(
+          gt,
           {
             disabled: i.breakpoint === "xs",
-            onCheckedChange: () => a(X(i.breakpoint)),
-            checked: pe(e, X(i.breakpoint)),
+            onCheckedChange: () => l(G(i.breakpoint)),
+            checked: V(e, G(i.breakpoint)),
             children: o(i.title)
           },
           i.breakpoint
@@ -206,36 +206,36 @@ const fe = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
       ] })
     ] })
   ] });
-}, ps = () => {
-  const { t: n } = re(), { setNewBlocks: s } = _e(), [, e] = D(), [, t] = M(), o = O(() => {
+}, us = () => {
+  const { t: n } = le(), { setNewBlocks: s } = Be(), [, e] = D(), [, t] = M(), o = q(() => {
     s([]), e([]), t([]);
   }, [s]);
-  return /* @__PURE__ */ r.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ r.jsxs(xt, { children: [
-    /* @__PURE__ */ r.jsx(vt, { asChild: !0, children: /* @__PURE__ */ r.jsxs(W, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
+  return /* @__PURE__ */ r.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ r.jsxs(ft, { children: [
+    /* @__PURE__ */ r.jsx(xt, { asChild: !0, children: /* @__PURE__ */ r.jsxs(Y, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
       /* @__PURE__ */ r.jsx(et, {}),
       " ",
       n("clear")
     ] }) }),
-    /* @__PURE__ */ r.jsxs($t, { className: "border-border", children: [
-      /* @__PURE__ */ r.jsxs(yt, { children: [
+    /* @__PURE__ */ r.jsxs(vt, { className: "border-border", children: [
+      /* @__PURE__ */ r.jsxs($t, { children: [
         /* @__PURE__ */ r.jsx(bt, { children: n("clear_canvas_title") }),
-        /* @__PURE__ */ r.jsx(kt, { children: n("clear_canvas_description") })
+        /* @__PURE__ */ r.jsx(yt, { children: n("clear_canvas_description") })
       ] }),
-      /* @__PURE__ */ r.jsxs(wt, { children: [
-        /* @__PURE__ */ r.jsx(jt, { children: n("cancel") }),
-        /* @__PURE__ */ r.jsx(Ct, { onClick: o, children: n("yes") })
+      /* @__PURE__ */ r.jsxs(kt, { children: [
+        /* @__PURE__ */ r.jsx(wt, { children: n("cancel") }),
+        /* @__PURE__ */ r.jsx(jt, { onClick: o, children: n("yes") })
       ] })
     ] })
   ] }) });
-}, us = () => {
-  const [n, s] = b(_t);
-  return P("askAiCallBack", null) ? /* @__PURE__ */ r.jsxs("div", { className: "flex items-center space-x-2", children: [
-    /* @__PURE__ */ r.jsxs(Bt, { htmlFor: "ai-assistant", className: "flex items-center gap-x-1 text-sm text-yellow-600", children: [
-      /* @__PURE__ */ r.jsx(qt, { className: "w-4" }),
+}, hs = () => {
+  const [n, s] = b(Ct);
+  return U("askAiCallBack", null) ? /* @__PURE__ */ r.jsxs("div", { className: "flex items-center space-x-2", children: [
+    /* @__PURE__ */ r.jsxs(_t, { htmlFor: "ai-assistant", className: "flex items-center gap-x-1 text-sm text-yellow-600", children: [
+      /* @__PURE__ */ r.jsx(Yt, { className: "w-4" }),
       "AI Assistant"
     ] }),
     /* @__PURE__ */ r.jsx(
-      Ce,
+      _e,
       {
         className: "scale-90",
         checked: n,
@@ -246,34 +246,34 @@ const fe = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
       }
     )
   ] }) : null;
-}, hs = () => {
-  const n = P("darkMode", !0), [s] = Be();
+}, ms = () => {
+  const n = U("darkMode", !0), [s] = De();
   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: [
-      /* @__PURE__ */ r.jsx(ds, {}),
-      /* @__PURE__ */ r.jsx(z, { orientation: "vertical" }),
+      /* @__PURE__ */ r.jsx(ps, {}),
+      /* @__PURE__ */ r.jsx(W, { orientation: "vertical" }),
       n ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-        /* @__PURE__ */ r.jsx(ls, {}),
-        /* @__PURE__ */ r.jsx(z, { orientation: "vertical" })
+        /* @__PURE__ */ r.jsx(cs, {}),
+        /* @__PURE__ */ r.jsx(W, { orientation: "vertical" })
       ] }) : null,
       /* @__PURE__ */ r.jsxs("div", { className: "flex w-12 cursor-not-allowed items-center justify-center gap-x-1 space-x-0 font-medium text-gray-400", children: [
         /* @__PURE__ */ r.jsx(tt, { className: "h-3.5 w-3.5 flex-shrink-0" }),
         " ",
         /* @__PURE__ */ r.jsxs("div", { className: "text-xs leading-3", children: [
-          Ue(s, 0),
+          We(s, 0),
           "%"
         ] })
       ] }),
-      /* @__PURE__ */ r.jsx(z, { orientation: "vertical" }),
+      /* @__PURE__ */ r.jsx(W, { orientation: "vertical" }),
       /* @__PURE__ */ r.jsx(as, {})
     ] }),
     /* @__PURE__ */ r.jsxs("div", { className: "flex h-full items-center space-x-2", children: [
-      /* @__PURE__ */ r.jsx(ps, {}),
-      /* @__PURE__ */ r.jsx(z, { orientation: "vertical" }),
-      /* @__PURE__ */ r.jsx(us, {})
+      /* @__PURE__ */ r.jsx(us, {}),
+      /* @__PURE__ */ r.jsx(W, { orientation: "vertical" }),
+      /* @__PURE__ */ r.jsx(hs, {})
     ] })
   ] });
-}, ms = `<!doctype html>
+}, gs = `<!doctype html>
 <html lang="en" dir="__HTML_DIR__" class="scroll-smooth h-full overflow-y-auto">
   <head>
     <meta charset="UTF-8">
@@ -324,22 +324,22 @@ const fe = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
     <div class="frame-root h-full"></div>
     <script src="https://cdn.jsdelivr.net/npm/quill@2.0.0/dist/quill.js"><\/script>
   </body>
-</html>`, gs = (n) => {
-  const [s] = oe(), [, e] = Be(), [t, o] = B({}), c = O(() => {
-    const { width: a, height: i } = n;
-    if (a < s) {
-      const d = parseFloat((a / s).toFixed(2).toString());
-      let l = {};
-      const h = i * d;
-      i && (l = {
+</html>`, fs = (n) => {
+  const [s] = re(), [, e] = De(), [t, o] = B({}), c = q(() => {
+    const { width: l, height: i } = n;
+    if (l < s) {
+      const d = parseFloat((l / s).toFixed(2).toString());
+      let m = {};
+      const a = i * d;
+      i && (m = {
         // Eureka! This is the formula to calculate the height of the scaled element. Thank you ChatGPT 4
-        height: 100 + (i - h) / h * 100 + "%"
+        height: 100 + (i - a) / a * 100 + "%"
       }), o({
         position: "relative",
         top: 0,
         transform: `scale(${d})`,
         transformOrigin: "top left",
-        ...l,
+        ...m,
         maxWidth: "none"
       }), e(d * 100);
     } else
@@ -349,11 +349,11 @@ const fe = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
     c();
   }, [s, n, e, c]), t;
 };
-let Me, Te;
+let Me, Le;
 typeof document < "u" && (Me = document);
-typeof window < "u" && (Te = window);
-const Le = A.createContext({ document: Me, window: Te }), q = () => A.useContext(Le), { Provider: fs, Consumer: Yo } = Le;
-class Fe extends $e {
+typeof window < "u" && (Le = window);
+const Fe = S.createContext({ document: Me, window: Le }), X = () => S.useContext(Fe), { Provider: xs, Consumer: Go } = Fe;
+class Re extends be {
   componentDidMount() {
     this.props.contentDidMount();
   }
@@ -361,31 +361,31 @@ class Fe extends $e {
     this.props.contentDidUpdate();
   }
   render() {
-    return ze.only(this.props.children);
+    return Oe.only(this.props.children);
   }
 }
-N(Fe, "propTypes", {
+T(Re, "propTypes", {
   children: w.element.isRequired,
   contentDidMount: w.func.isRequired,
   contentDidUpdate: w.func.isRequired
 });
-class ee extends $e {
+class se extends be {
   constructor(e, t) {
     super(e, t);
-    N(this, "setRef", (e) => {
+    T(this, "setRef", (e) => {
       this.nodeRef.current = e;
       const { forwardedRef: t } = this.props;
       typeof t == "function" ? t(e) : t && (t.current = e);
     });
-    N(this, "handleLoad", () => {
+    T(this, "handleLoad", () => {
       clearInterval(this.loadCheck), this.state.iframeLoaded || this.setState({ iframeLoaded: !0 });
     });
     // In certain situations on a cold cache DOMContentLoaded never gets called
     // fallback to an interval to check if that's the case
-    N(this, "loadCheck", () => setInterval(() => {
+    T(this, "loadCheck", () => setInterval(() => {
       this.handleLoad();
     }, 500));
-    this._isMounted = !1, this.nodeRef = A.createRef(), this.state = { iframeLoaded: !1 };
+    this._isMounted = !1, this.nodeRef = S.createRef(), this.state = { iframeLoaded: !1 };
   }
   componentDidMount() {
     this._isMounted = !0, this.getDoc() && this.nodeRef.current.contentWindow.addEventListener("DOMContentLoaded", this.handleLoad);
@@ -406,8 +406,8 @@ class ee extends $e {
     const e = this.getDoc();
     if (!e)
       return null;
-    const t = this.props.contentDidMount, o = this.props.contentDidUpdate, c = e.defaultView || e.parentView, a = /* @__PURE__ */ r.jsx(Fe, { contentDidMount: t, contentDidUpdate: o, children: /* @__PURE__ */ r.jsx(fs, { value: { document: e, window: c }, children: /* @__PURE__ */ r.jsx("div", { className: "frame-content", children: this.props.children }) }) }), i = this.getMountTarget();
-    return [me.createPortal(this.props.head, this.getDoc().head), me.createPortal(a, i)];
+    const t = this.props.contentDidMount, o = this.props.contentDidUpdate, c = e.defaultView || e.parentView, l = /* @__PURE__ */ r.jsx(Re, { contentDidMount: t, contentDidUpdate: o, children: /* @__PURE__ */ r.jsx(xs, { value: { document: e, window: c }, children: /* @__PURE__ */ r.jsx("div", { className: "frame-content", children: this.props.children }) }) }), i = this.getMountTarget();
+    return [ge.createPortal(this.props.head, this.getDoc().head), ge.createPortal(l, i)];
   }
   render() {
     const e = {
@@ -423,7 +423,7 @@ class ee extends $e {
 // also inject into the body and can mess up React. For this reason
 // initialContent is expected to have a div inside of the body
 // element that we render react into.
-N(ee, "propTypes", {
+T(se, "propTypes", {
   style: w.object,
   // eslint-disable-line
   head: w.node,
@@ -432,7 +432,7 @@ N(ee, "propTypes", {
   contentDidMount: w.func,
   contentDidUpdate: w.func,
   children: w.oneOfType([w.element, w.arrayOf(w.element)])
-}), N(ee, "defaultProps", {
+}), T(se, "defaultProps", {
   style: {},
   head: null,
   children: void 0,
@@ -443,8 +443,8 @@ N(ee, "propTypes", {
   },
   initialContent: '<!DOCTYPE html><html><head></head><body><div class="frame-root"></div></body></html>'
 });
-const xs = A.forwardRef((n, s) => /* @__PURE__ */ r.jsx(ee, { ...n, forwardedRef: s }));
-function ae(n) {
+const vs = S.forwardRef((n, s) => /* @__PURE__ */ r.jsx(se, { ...n, forwardedRef: s }));
+function ce(n) {
   const s = window.getComputedStyle(n), e = s.display;
   if (e === "flex" || e === "inline-flex") {
     const t = s.flexDirection;
@@ -456,82 +456,82 @@ function ae(n) {
     return "vertical";
   return "horizontal";
 }
-let v = null, _ = [], R = null, Q = null;
-const ve = (n, s, e) => {
-  if (!v || !n)
+let $ = null, C = [], z = null, Q = null;
+const $e = (n, s, e) => {
+  if (!$ || !n)
     return;
-  const t = v == null ? void 0 : v.getElementById("placeholder"), o = _.map(([d]) => d), c = o.reduce(
-    (d, l) => Math.abs(l - e) < Math.abs(d - e) ? l : d,
+  const t = $ == null ? void 0 : $.getElementById("placeholder"), o = C.map(([d]) => d), c = o.reduce(
+    (d, m) => Math.abs(m - e) < Math.abs(d - e) ? m : d,
     0
-  ), a = o.indexOf(c);
-  if (!_[a])
+  ), l = o.indexOf(c);
+  if (!C[l])
     return;
-  const i = _[a];
+  const i = C[l];
   t.style.width = s === "vertical" ? i[2] + "px" : "2px", t.style.height = s === "vertical" ? "2px" : i[2] + "px", t.style.display = "block", s === "vertical" ? (t.style.top = i[0] + "px", t.style.left = i[1] + "px") : (t.style.top = i[1] + "px", t.style.left = i[0] + "px");
 };
-function vs(n, s) {
+function $s(n, s) {
   let e = 0, t = 1 / 0;
   return s.forEach((o, c) => {
-    const a = Math.abs(o[0] - n);
-    a < t && (t = a, e = c);
+    const l = Math.abs(o[0] - n);
+    l < t && (t = l, e = c);
   }), e;
 }
-const $s = (n) => {
-  const e = ae(n) === "horizontal";
-  _ = [], Array.from(n.children).forEach((t, o) => {
+const bs = (n) => {
+  const e = ce(n) === "horizontal";
+  C = [], Array.from(n.children).forEach((t, o) => {
     if (t.classList.contains("pointer-events-none"))
       return;
-    const c = e ? t.offsetLeft : t.offsetTop, a = e ? [t.offsetTop, t.clientHeight] : [t.offsetLeft, t.clientWidth];
-    if (_.push([c, a[0], a[1]]), o === n.children.length - 1) {
+    const c = e ? t.offsetLeft : t.offsetTop, l = e ? [t.offsetTop, t.clientHeight] : [t.offsetLeft, t.clientWidth];
+    if (C.push([c, l[0], l[1]]), o === n.children.length - 1) {
       const i = e ? t.offsetLeft + t.clientWidth : t.offsetTop + t.clientHeight;
-      _.push([i, a[0], a[1]]);
+      C.push([i, l[0], l[1]]);
     }
   });
 }, ys = ye((n) => {
   var o;
-  const s = n.target, e = ae(s), t = (o = v == null ? void 0 : v.defaultView) == null ? void 0 : o.scrollY;
-  e === "vertical" ? ve(s, e, n.clientY + t) : ve(s, e, n.clientX);
+  const s = n.target, e = ce(s), t = (o = $ == null ? void 0 : $.defaultView) == null ? void 0 : o.scrollY;
+  e === "vertical" ? $e(s, e, n.clientY + t) : $e(s, e, n.clientX);
 }, 0);
 function Z() {
-  const n = v == null ? void 0 : v.getElementById("placeholder");
-  n.style.display = "none", bs("pointer-none"), ks();
+  const n = $ == null ? void 0 : $.getElementById("placeholder");
+  n.style.display = "none", ks("pointer-none"), ws();
 }
-function bs(n) {
-  (v == null ? void 0 : v.querySelectorAll(`.${n}`)).forEach((e) => {
+function ks(n) {
+  ($ == null ? void 0 : $.querySelectorAll(`.${n}`)).forEach((e) => {
     e.classList.remove(n);
   });
 }
-function ks() {
-  const n = v == null ? void 0 : v.querySelector('[data-drop="yes"]');
+function ws() {
+  const n = $ == null ? void 0 : $.querySelector('[data-drop="yes"]');
   n && n.removeAttribute("data-drop");
 }
-const ws = () => {
-  const { document: n } = q(), [s, e] = b(Dt), { addCoreBlock: t } = At(), [, o] = T(), [, c] = D(), { moveBlocks: a } = _e(), [, i] = b(De), [d, l] = b(ie), [, h] = b(Ee);
-  return v = n, {
+const js = () => {
+  const { document: n } = X(), [s, e] = b(Bt), { addCoreBlock: t } = Dt(), [, o] = L(), [, c] = D(), { moveBlocks: l } = Be(), [, i] = b(Ae), [d, m] = b(ae), [, a] = b(Ne);
+  return $ = n, {
     isDragging: s,
-    onDragOver: (p) => {
-      p.preventDefault(), p.stopPropagation(), ys(p);
+    onDragOver: (u) => {
+      u.preventDefault(), u.stopPropagation(), ys(u);
     },
-    onDrop: (p) => {
-      var C;
-      R == null || R.classList.remove("drop-target");
-      const u = R, y = ae(u) === "vertical" ? p.clientY + ((C = v == null ? void 0 : v.defaultView) == null ? void 0 : C.scrollY) : p.clientX;
-      Q = vs(y, _);
-      const g = d, m = u.getAttribute("data-block-id");
-      if (!be(g, "_id")) {
-        t(g, m === "canvas" ? null : m, Q), setTimeout(() => {
+    onDrop: (u) => {
+      var _;
+      z == null || z.classList.remove("drop-target");
+      const p = z, k = ce(p) === "vertical" ? u.clientY + ((_ = $ == null ? void 0 : $.defaultView) == null ? void 0 : _.scrollY) : u.clientX;
+      Q = $s(k, C);
+      const g = d, h = p.getAttribute("data-block-id");
+      if (!ee(g, "_id")) {
+        t(g, h === "canvas" ? null : h, Q), setTimeout(() => {
           Z();
-        }, 300), _ = [], e(!1), i(""), l(null), h(null);
+        }, 300), C = [], e(!1), i(""), m(null), a(null);
         return;
       }
-      let k = u.getAttribute("data-block-id");
-      k === null && (k = p.target.parentElement.getAttribute("data-block-id")), a([g._id], k, Q), Z(), e(!1), i(""), _ = [], setTimeout(() => Z(), 300);
+      let y = p.getAttribute("data-block-id");
+      y === null && (y = u.target.parentElement.getAttribute("data-block-id")), l([g._id], y, Q), Z(), e(!1), i(""), C = [], setTimeout(() => Z(), 300);
     },
-    onDragEnter: (p) => {
-      const u = p, $ = u.target;
-      R = $;
-      const y = $.getAttribute("data-block-id");
-      h(y), u.stopPropagation(), u.preventDefault(), _ = [], $s($), console.log(_, p.clientY, v.defaultView.scrollY), $.classList.add("drop-target"), e(!0), o(""), c([]);
+    onDragEnter: (u) => {
+      const p = u, x = p.target;
+      z = x;
+      const k = x.getAttribute("data-block-id");
+      a(k), p.stopPropagation(), p.preventDefault(), C = [], bs(x), console.log(C, u.clientY, $.defaultView.scrollY), x.classList.add("drop-target"), e(!0), o(""), c([]);
     }
     // onDragLeave: (e: DragEvent) => {
     //   const event = e;
@@ -548,134 +548,134 @@ const ws = () => {
     // },
   };
 };
-function le(n) {
+function de(n) {
   return n.getAttribute("data-block-id") ? n : n.closest("[data-block-id]");
 }
-function js(n) {
+function Cs(n) {
   n.container.innerHTML = "", n.container.parentNode.removeChild(n.container);
   var s = document.querySelector(".ql-toolbar");
   s && s.parentNode.removeChild(s), n = null;
 }
-const Cs = () => {
-  const n = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], s = It(), [, e] = T(), [t, o] = b(F);
+const _s = () => {
+  const n = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], s = At(), [, e] = L(), [t, o] = b(R);
   return (c) => {
-    var p;
+    var u;
     if (t)
       return;
-    const a = le(c.target), i = a.getAttribute("data-block-type");
+    const l = de(c.target), i = l.getAttribute("data-block-type");
     if (!i || !n.includes(i))
       return;
-    const d = a.cloneNode(!0);
-    a.style.display = "none", Array.from(d.attributes).forEach((u) => {
-      u.name !== "class" && d.removeAttribute(u.name);
-    }), i === "Text" && (d.style.display = "inline-block"), a.parentNode.insertBefore(d, a.nextSibling);
-    const l = new Kt(d, { placeholder: "Type here..." });
-    function h() {
-      const u = l.getText(0, l.getLength());
-      s([a.getAttribute("data-block-id")], { content: u }), a.removeAttribute("style"), d.removeEventListener("blur", h, !0), js(l), o(""), e("");
+    const d = l.cloneNode(!0);
+    l.style.display = "none", Array.from(d.attributes).forEach((p) => {
+      p.name !== "class" && d.removeAttribute(p.name);
+    }), i === "Text" && (d.style.display = "inline-block"), l.parentNode.insertBefore(d, l.nextSibling);
+    const m = new Xt(d, { placeholder: "Type here..." });
+    function a() {
+      const p = m.getText(0, m.getLength());
+      s([l.getAttribute("data-block-id")], { content: p }), l.removeAttribute("style"), d.removeEventListener("blur", a, !0), Cs(m), o(""), e("");
     }
-    d.addEventListener("blur", h, !0), d.addEventListener("keydown", (u) => {
-      (u.key === "Enter" || u.key === "Escape") && h();
-    }), l.focus(), (p = d.querySelector(".ql-clipboard")) == null || p.remove(), o(a.getAttribute("data-block-id"));
+    d.addEventListener("blur", a, !0), d.addEventListener("keydown", (p) => {
+      (p.key === "Enter" || p.key === "Escape") && a();
+    }), m.focus(), (u = d.querySelector(".ql-clipboard")) == null || u.remove(), o(l.getAttribute("data-block-id"));
   };
-}, _s = () => {
-  const [, n] = M(), [s, e] = D(), [, t] = T(), [o] = b(F), [c] = b(St);
-  return (a) => {
+}, Bs = () => {
+  const [, n] = M(), [s, e] = D(), [, t] = L(), [o] = b(R), [c] = b(St);
+  return (l) => {
     if (o)
       return;
-    a.stopPropagation();
-    const i = le(a.target);
+    l.stopPropagation();
+    const i = de(l.target);
     if (i != null && i.getAttribute("data-block-id") && (i == null ? void 0 : i.getAttribute("data-block-id")) === "container") {
       e([]), n([]), t("");
       return;
     }
     if (i != null && i.getAttribute("data-block-parent")) {
-      const d = i.getAttribute("data-style-prop"), l = i.getAttribute("data-style-id"), h = i.getAttribute("data-block-parent");
-      s.includes(h) || c == null || c.closeAll(), n([{ id: l, prop: d, blockId: h }]), e([h]);
+      const d = i.getAttribute("data-style-prop"), m = i.getAttribute("data-style-id"), a = i.getAttribute("data-block-parent");
+      s.includes(a) || c == null || c.closeAll(), n([{ id: m, prop: d, blockId: a }]), e([a]);
     } else if (i != null && i.getAttribute("data-block-id")) {
       let d = i.getAttribute("data-block-id");
       s.includes(d) || c == null || c.closeAll(), e([d]);
     }
     t("");
   };
-}, Bs = ye((n, s) => {
-  const e = le(n.target);
+}, Ds = ye((n, s) => {
+  const e = de(n.target);
   e != null && e.getAttribute("data-style-id") && s(e.getAttribute("data-style-id"));
-}, 100), Ds = () => {
-  const [, n] = T(), [s] = b(F);
+}, 100), As = () => {
+  const [, n] = L(), [s] = b(R);
   return (e) => {
-    s || Bs(e, n);
+    s || Ds(e, n);
   };
-}, As = ({ children: n }) => {
-  const { document: s } = q(), [e] = D(), [t, o] = M();
+}, Ss = ({ children: n }) => {
+  const { document: s } = X(), [e] = D(), [t, o] = M();
   j(() => {
     setTimeout(() => {
       if (!I(t))
         return;
-      const l = Re(s, U(e));
-      if (l) {
-        const h = l.getAttribute("data-style-prop");
-        if (h) {
-          const p = l.getAttribute("data-style-id"), u = l.getAttribute("data-block-parent");
-          o([{ id: p, prop: h, blockId: u }]);
+      const m = Pe(s, K(e));
+      if (m) {
+        const a = m.getAttribute("data-style-prop");
+        if (a) {
+          const u = m.getAttribute("data-style-id"), p = m.getAttribute("data-block-parent");
+          o([{ id: u, prop: a, blockId: p }]);
         }
       }
     }, 100);
   }, [s, e, o, t]);
-  const c = Cs(), a = _s(), i = Ds(), d = ws();
+  const c = _s(), l = Bs(), i = As(), d = js();
   return /* @__PURE__ */ r.jsx(
     "div",
     {
       "data-block-id": "canvas",
       id: "canvas",
-      onClick: a,
+      onClick: l,
       onDoubleClick: c,
       onMouseMove: i,
-      ...We(d, "isDragging"),
+      ...ke(d, "isDragging"),
       className: "relative mb-5 h-full max-w-full " + (d.isDragging ? "dragging" : ""),
       children: n
     }
   );
-}, Re = (n, s) => n.querySelector(`[data-block-id="${s}"]`), Is = () => {
-  const { window: n } = q(), [s, e] = D(), [t] = ne(), [, o] = M(), { undo: c, redo: a } = we(), i = Ae(), [, d] = Ie(), l = Se(), { savePage: h } = Et(), [p] = b(F), [, u] = b(Nt), $ = (g) => {
-    g.key === "Enter" && (g.preventDefault(), s.length === 1 && u(U(s)));
-  }, y = (g) => {
-    const m = t.find((k) => k._id === g);
-    return m ? m._parent : null;
+}, Pe = (n, s) => n.querySelector(`[data-block-id="${s}"]`), Is = () => {
+  const { window: n } = X(), [s, e] = D(), [t] = ie(), [, o] = M(), { undo: c, redo: l } = je(), i = Se(), [, d] = Ie(), m = Ee(), { savePage: a } = It(), [u] = b(R), [, p] = b(Et), x = (g) => {
+    g.key === "Enter" && (g.preventDefault(), s.length === 1 && p(K(s)));
+  }, k = (g) => {
+    const h = t.find((y) => y._id === g);
+    return h ? h._parent : null;
   };
   return j(() => {
-    const g = (m) => {
-      if (m.key === "Escape") {
+    const g = (h) => {
+      if (h.key === "Escape") {
         e([]), o([]);
         return;
       }
-      if ($(m), !p && (m.key === "Delete" || m.key === "Backspace") && (m.preventDefault(), l(s)), m.ctrlKey || m.metaKey) {
-        if (m.key === "ArrowUp") {
-          m.preventDefault();
-          const k = s.length > 0 ? y(s[0]) : null;
-          k && e([k]);
+      if (x(h), !u && (h.key === "Delete" || h.key === "Backspace") && (h.preventDefault(), m(s)), h.ctrlKey || h.metaKey) {
+        if (h.key === "ArrowUp") {
+          h.preventDefault();
+          const y = s.length > 0 ? k(s[0]) : null;
+          y && e([y]);
         }
-        if (["z", "y", "d", "x", "c", "p", "s", "v"].includes(m.key)) {
-          if (p && ["x", "z", "v"].includes(m.key))
+        if (["z", "y", "d", "x", "c", "p", "s", "v"].includes(h.key)) {
+          if (u && ["x", "z", "v"].includes(h.key))
             return !0;
-          m.preventDefault();
+          h.preventDefault();
         }
-        m.key === "s" && (m.stopPropagation(), m.preventDefault(), h()), m.key === "z" && c(), m.key === "y" && a(), m.key === "d" && i(s);
+        h.key === "s" && (h.stopPropagation(), h.preventDefault(), a()), h.key === "z" && c(), h.key === "y" && l(), h.key === "d" && i(s);
       }
     };
     return n.removeEventListener("keydown", g), n.addEventListener("keydown", g), () => {
       n.removeEventListener("keydown", g);
     };
-  }, [s, e, c, l, d, a, i, p, h, n]), null;
-}, Ss = ({ block: n, label: s }) => {
-  const [, e] = D(), [, t] = T(), [, o] = b(ie), c = Zt("dnd");
+  }, [s, e, c, m, d, l, i, u, a, n]), null;
+}, Es = ({ block: n, label: s }) => {
+  const [, e] = D(), [, t] = L(), [, o] = b(ae), c = Vt("dnd");
   return /* @__PURE__ */ r.jsxs(
     "div",
     {
       className: "mr-10 flex cursor-grab items-center space-x-1 px-1",
       draggable: c ? "true" : "false",
-      onDragStart: (a) => {
-        a.dataTransfer.setData("text/plain", JSON.stringify(qe(n, ["_id", "_type", "_name"]))), o(n), setTimeout(() => {
+      onDragStart: (l) => {
+        l.dataTransfer.setData("text/plain", JSON.stringify(qe(n, ["_id", "_type", "_name"]))), o(n), setTimeout(() => {
           e([]), t(null);
         }, 200);
       },
@@ -685,47 +685,47 @@ const Cs = () => {
       ]
     }
   );
-}, Es = ({ selectedBlockElement: n, block: s }) => {
-  const e = Se(), t = Ae(), [, o] = D(), [, c] = M(), [a] = b(F), { floatingStyles: i, refs: d, update: l } = Gt({
+}, Ns = ({ selectedBlockElement: n, block: s }) => {
+  const e = Ee(), t = Se(), [, o] = D(), [, c] = M(), [l] = b(R), { floatingStyles: i, refs: d, update: m } = Qt({
     placement: "top-start",
-    middleware: [Xt(), Yt()],
+    middleware: [Zt(), Gt()],
     elements: {
       reference: n
     }
   });
-  Qt(n, () => l(), n !== null);
-  const h = f(s, "_parent", null), p = I(f(s, "_name", "")) ? f(s, "_type", "") : f(s, "_name", "");
-  return !n || !s || a ? null : /* @__PURE__ */ r.jsx(r.Fragment, { children: /* @__PURE__ */ r.jsxs(
+  Jt(n, () => m(), n !== null);
+  const a = f(s, "_parent", null), u = I(f(s, "_name", "")) ? f(s, "_type", "") : f(s, "_name", "");
+  return !n || !s || l ? null : /* @__PURE__ */ r.jsx(r.Fragment, { children: /* @__PURE__ */ r.jsxs(
     "div",
     {
       role: "button",
       tabIndex: 0,
       ref: d.setFloating,
       style: i,
-      onClick: (u) => {
-        u.stopPropagation(), u.preventDefault();
+      onClick: (p) => {
+        p.stopPropagation(), p.preventDefault();
       },
-      onKeyDown: (u) => u.stopPropagation(),
+      onKeyDown: (p) => p.stopPropagation(),
       className: "z-[99999] flex h-6 items-center bg-blue-500 py-2 text-xs text-white",
       children: [
-        /* @__PURE__ */ r.jsx(Ss, { label: p, block: s }),
+        /* @__PURE__ */ r.jsx(Es, { label: u, block: s }),
         /* @__PURE__ */ r.jsxs("div", { className: "flex gap-2 px-1", children: [
-          h && /* @__PURE__ */ r.jsx(
+          a && /* @__PURE__ */ r.jsx(
             ot,
             {
               className: "hover:scale-105",
               onClick: () => {
-                c([]), o([h]);
+                c([]), o([a]);
               }
             }
           ),
-          Mt(f(s, "_type", "")) ? /* @__PURE__ */ r.jsx(nt, { className: "hover:scale-105", onClick: () => t([s == null ? void 0 : s._id]) }) : null,
+          Nt(f(s, "_type", "")) ? /* @__PURE__ */ r.jsx(nt, { className: "hover:scale-105", onClick: () => t([s == null ? void 0 : s._id]) }) : null,
           Tt(f(s, "_type", "")) ? /* @__PURE__ */ r.jsx(rt, { className: "hover:scale-105", onClick: () => e([s == null ? void 0 : s._id]) }) : null
         ] })
       ]
     }
   ) });
-}, Ns = ({ addVariant: n, e: s }) => {
+}, Ts = ({ addVariant: n, e: s }) => {
   n("hs-dropdown-open", [
     ({ modifySelectors: e, separator: t }) => {
       e(({ className: o }) => `.hs-dropdown.open > .${s(`hs-dropdown-open${t}${o}`)}`);
@@ -979,25 +979,25 @@ const Cs = () => {
     e(({ className: o }) => `.auto .${s(`hs-auto-mode-active${t}${o}`)}`);
   });
 }, Ms = ({ model: n }) => {
-  const [s] = Lt(), [e] = D(), [t] = je(), [o] = T(), [c] = M(), [a] = b(De), { document: i, window: d } = q(), [l] = B(i == null ? void 0 : i.getElementById("highlighted-block")), [h] = B(
+  const [s] = Mt(), [e] = D(), [t] = Ce(), [o] = L(), [c] = M(), [l] = b(Ae), { document: i, window: d } = X(), [m] = B(i == null ? void 0 : i.getElementById("highlighted-block")), [a] = B(
     i == null ? void 0 : i.getElementById("selected-block")
-  ), [p] = B(
+  ), [u] = B(
     i == null ? void 0 : i.getElementById("selected-styling-block")
-  ), [u] = B(i == null ? void 0 : i.getElementById("dragged-block"));
+  ), [p] = B(i == null ? void 0 : i.getElementById("dragged-block"));
   j(() => {
     t ? i == null || i.documentElement.classList.add("dark") : i == null || i.documentElement.classList.remove("dark");
   }, [t, i]);
-  const $ = f(s, "headingFont", "DM Sans"), y = f(s, "bodyFont", "DM Sans");
+  const x = f(s, "headingFont", "DM Sans"), k = f(s, "bodyFont", "DM Sans");
   return j(() => {
-    const g = f(s, "primaryColor", "#000"), m = f(s, "secondaryColor", "#FFF"), k = f(s, "bodyBgLightColor", "#fff"), C = f(s, "bodyBgDarkColor", "#000"), L = f(s, "bodyTextDarkColor", "#000"), K = f(s, "bodyTextLightColor", "#fff"), Y = ts([
+    const g = f(s, "primaryColor", "#000"), h = f(s, "secondaryColor", "#FFF"), y = f(s, "bodyBgLightColor", "#fff"), _ = f(s, "bodyBgDarkColor", "#000"), A = f(s, "bodyTextDarkColor", "#000"), P = f(s, "bodyTextLightColor", "#fff"), F = os([
       { color: g, name: "primary" },
-      { color: m, name: "secondary" }
-    ]), G = {
-      "bg-light": k,
-      "bg-dark": C,
-      "text-dark": L,
-      "text-light": K
-    }, x = f(s, "roundedCorners", "0");
+      { color: h, name: "secondary" }
+    ]), H = {
+      "bg-light": y,
+      "bg-dark": _,
+      "text-dark": A,
+      "text-light": P
+    }, v = f(s, "roundedCorners", "0");
     !d || !d.tailwind || (d.tailwind.config = {
       darkMode: "class",
       theme: {
@@ -1010,208 +1010,208 @@ const Cs = () => {
             }
           },
           fontFamily: {
-            heading: [$],
-            body: [y]
+            heading: [x],
+            body: [k]
           },
           borderRadius: {
-            DEFAULT: `${x || "0"}px`
+            DEFAULT: `${v || "0"}px`
           },
-          colors: { ...G, ...Y }
+          colors: { ...H, ...F }
         }
       },
-      plugins: [Jt, Vt, es, d.tailwind.plugin.withOptions(() => Ns)]
+      plugins: [es, ts, ss, d.tailwind.plugin.withOptions(() => Ts)]
     });
-  }, [s, d, $, y]), j(() => {
-    h && (h.textContent = `${H(e, (g) => `[data-block-id="${g}"]`).join(",")}{
+  }, [s, d, x, k]), j(() => {
+    a && (a.textContent = `${O(e, (g) => `[data-block-id="${g}"]`).join(",")}{
                 outline: 1px solid ${e.length === 1 ? "#42a1fc" : "orange"} !important; outline-offset: -1px;
             }`);
-  }, [e, h]), j(() => {
-    if (!a) {
-      u.textContent = "";
+  }, [e, a]), j(() => {
+    if (!l) {
+      p.textContent = "";
       return;
     }
-    u.textContent = `[data-block-id="${a}"]{ pointer-events: none !important; opacity: 0.2 !important}`;
-  }, [a]), j(() => {
-    l && (l.textContent = o ? `[data-style-id="${o}"]{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}` : "");
-  }, [o, e, l]), j(() => {
-    p && (p.textContent = `${H(c, ({ id: g }) => `[data-style-id="${g}"]`).join(",")}{
+    p.textContent = `[data-block-id="${l}"]{ pointer-events: none !important; opacity: 0.2 !important}`;
+  }, [l]), j(() => {
+    m && (m.textContent = o ? `[data-style-id="${o}"]{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}` : "");
+  }, [o, e, m]), j(() => {
+    u && (u.textContent = `${O(c, ({ id: g }) => `[data-style-id="${g}"]`).join(",")}{
                 outline: 1px solid #42a1fc !important; outline-offset: -1px;
             }`);
-  }, [c, p]), j(() => {
-    const g = f(s, "bodyTextLightColor", "#64748b"), m = f(s, "bodyTextDarkColor", "#94a3b8"), k = f(s, "bodyBgLightColor", "#FFFFFF"), C = f(s, "bodyBgDarkColor", "#0f172a");
-    i.body.className = `font-body antialiased text-[${g}] bg-[${k}] dark:text-[${m}] dark:bg-[${C}]`;
+  }, [c, u]), j(() => {
+    const g = f(s, "bodyTextLightColor", "#64748b"), h = f(s, "bodyTextDarkColor", "#94a3b8"), y = f(s, "bodyBgLightColor", "#FFFFFF"), _ = f(s, "bodyBgDarkColor", "#0f172a");
+    i.body.className = `font-body antialiased text-[${g}] bg-[${y}] dark:text-[${h}] dark:bg-[${_}]`;
   }, [s, i, n]), n === "page" ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    $ && /* @__PURE__ */ r.jsx(
+    x && /* @__PURE__ */ r.jsx(
       "link",
       {
         id: "heading-font",
         rel: "stylesheet",
         type: "text/css",
-        href: `https://fonts.googleapis.com/css2?family=${$.replace(
+        href: `https://fonts.googleapis.com/css2?family=${x.replace(
           / /g,
           "+"
         )}:wght@300;400;500;600;700;800;900&display=swap`,
         media: "all"
       }
     ),
-    y && $ !== y && /* @__PURE__ */ r.jsx(
+    k && x !== k && /* @__PURE__ */ r.jsx(
       "link",
       {
         id: "body-font",
         rel: "stylesheet",
         type: "text/css",
-        href: `https://fonts.googleapis.com/css2?family=${y.replace(
+        href: `https://fonts.googleapis.com/css2?family=${k.replace(
           / /g,
           "+"
         )}:wght@300;400;500;600;700;800;900&display=swap`,
         media: "all"
       }
     ),
-    $ && /* @__PURE__ */ r.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${$}",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";}` })
+    x && /* @__PURE__ */ r.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${x}",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;
-}, Ts = (n) => {
+}, Ls = () => b(Lt), Fs = (n) => {
   const s = {};
   return Object.keys(n).forEach((e) => {
-    se(n[e]) && n[e].startsWith(ge) && (s[e] = n[e].replace(ge, "").split(","));
+    ne(n[e]) && n[e].startsWith(fe) && (s[e] = n[e].replace(fe, "").split(","));
   }), s;
-}, Ls = Ke((n) => {
-  const s = n.replace(Ne, "").split(",");
-  return ss(s[0], s[1]);
+}, Rs = Ke((n) => {
+  const s = n.replace(Te, "").split(",");
+  return ns(s[0], s[1]);
 });
-function Fs(n, s) {
+function Ps(n, s) {
   return f(n, `${s}_attrs`, {});
 }
-function Rs(n) {
+function Hs(n) {
   const s = {};
   return Object.keys(n).forEach((e) => {
-    if (se(n[e]) && n[e].startsWith(Ne)) {
-      const t = Ls(n[e]);
-      s[e] = {
+    if (ne(n[e]) && n[e].startsWith(Te)) {
+      const t = Rs(n[e]);
+      s.__key = e, s[e] = {
         className: t,
         "data-style-prop": e,
         "data-block-parent": n._id,
         "data-style-id": `${e}-${n._id}`,
-        ...Fs(n, e)
+        ...Ps(n, e)
       };
     }
   }), s;
 }
-function Hs(n, s) {
+function zs(n, s) {
   const e = f(n, "_bindings", {});
   return I(e) ? { ...n } : (Ye(e, (t, o) => {
-    se(t) && f(s, t, null) && (n[o] = f(s, t, null));
+    ne(t) && f(s, t, null) && (n[o] = f(s, t, null));
   }), n);
 }
-function te({ blocks: n }) {
-  const [s] = ne(), [e] = b(ie), [t] = b(Ee), [o] = ns(), c = O((l) => Rs(l), []), [a] = Ft(), [i] = b(F), d = O(
-    (l) => l.reduce((h, p) => {
-      const u = f(o, p, {});
-      return { ...h, ...u };
+function oe({ blocks: n }) {
+  const [s] = ie(), [e] = b(Ft), [t] = b(ae), [o] = b(Ne), [c] = Ls(), l = q((a) => Hs(a), []), [i] = Wt(), [d] = b(R), m = q(
+    (a) => a.reduce((u, p) => {
+      const x = f(c, p, {});
+      return { ...u, ...x };
     }, {}),
-    [o, s]
+    [c, s]
   );
-  return /* @__PURE__ */ r.jsx(r.Fragment, { children: A.Children.toArray(
-    n.map((l, h) => {
-      if (i === l._id)
+  return /* @__PURE__ */ r.jsx(r.Fragment, { children: S.Children.toArray(
+    n.map((a, u) => {
+      if (d === a._id)
         return null;
-      const p = Ts(l), u = {};
-      I(p) || Object.keys(p).forEach((C) => {
-        u[C] = A.Children.toArray(
-          p[C].map((L) => /* @__PURE__ */ r.jsx(te, { blocks: [Ge(s, { _id: L })] }))
+      const p = Fs(a), x = {};
+      I(p) || Object.keys(p).forEach((F) => {
+        x[F] = S.Children.toArray(
+          p[F].map((H) => /* @__PURE__ */ r.jsx(oe, { blocks: [Xe(s, { _id: H })] }))
         );
       });
-      const $ = ke(s, { _parent: l._id });
-      u.children = $.length ? /* @__PURE__ */ r.jsx(te, { blocks: $ }) : null;
-      const y = os(l._type), g = f(y, "builderComponent", f(y, "component", null));
-      if (Xe(g))
-        return /* @__PURE__ */ r.jsx("noscript", { children: `<!-- ${l == null ? void 0 : l._type} not registered -->` });
-      const m = be(y, "getBlockStateFrom") ? y == null ? void 0 : y.getBlockStateFrom(l, s) : [], k = d(m);
-      return /* @__PURE__ */ r.jsx(J, { children: A.createElement(g, {
+      const k = we(s, { _parent: a._id });
+      x.children = k.length ? /* @__PURE__ */ r.jsx(oe, { blocks: k }) : null;
+      const g = rs(a._type), h = f(g, "builderComponent", f(g, "component", null));
+      if (Ge(h))
+        return /* @__PURE__ */ r.jsx("noscript", { children: `<!-- ${a == null ? void 0 : a._type} not registered -->` });
+      const y = ee(g, "getBlockStateFrom") ? g == null ? void 0 : g.getBlockStateFrom(a, s) : [], _ = m(y), A = l(a), P = f(A, "__key", "styles");
+      return ee(A, P + ".x-show") && !V(e, a._id) ? null : /* @__PURE__ */ r.jsx(J, { children: S.createElement(h, {
         blockProps: {
-          "data-block-id": l._id,
-          "data-block-type": l._type,
-          ...e ? (
+          "data-block-id": a._id,
+          "data-block-type": a._type,
+          ...t ? (
             // @ts-ignore
-            { "data-dnd": Rt(l._type, e == null ? void 0 : e._type) ? "yes" : "no" }
+            { "data-dnd": Rt(a._type, t == null ? void 0 : t._type) ? "yes" : "no" }
           ) : {},
-          ...t === l._id ? { "data-drop": "yes" } : {}
+          ...o === a._id ? { "data-drop": "yes" } : {}
         },
-        index: h,
-        ...Hs(l, a),
-        ...c(l),
-        ...u,
+        index: u,
+        ...zs(a, i),
+        ...ke(A, ["__key"]),
+        ...x,
         inBuilder: !0,
-        blockState: k
+        blockState: _
       }) });
     })
   ) });
 }
-const Ps = () => {
-  const [n] = ne(), s = I(n) ? null : /* @__PURE__ */ r.jsx(Ht, { children: /* @__PURE__ */ r.jsx(te, { blocks: ke(n, (e) => I(e._parent)) }) });
+const Os = () => {
+  const [n] = ie(), s = I(n) ? null : /* @__PURE__ */ r.jsx(qt, { children: /* @__PURE__ */ r.jsx(oe, { blocks: we(n, (e) => I(e._parent)) }) });
   return /* @__PURE__ */ r.jsx(r.Fragment, { children: s });
-}, zs = (n, s) => n.querySelector(`[data-style-id="${s}"]`), Os = () => {
-  const [n] = b(Pt), [s] = Ie(), [e] = oe(), [, t] = D(), o = zt(), [, c] = T(), a = de(null), i = de(null), [d, l] = B({ width: 0, height: 0 }), h = gs(d), [p, u] = B(0), [$, y] = B([]), [, g] = B([]), [, m] = b(Ot), [k, C] = M(), L = P("loading", !1), K = P("htmlDir", "ltr");
+}, Us = (n, s) => n.querySelector(`[data-style-id="${s}"]`), Ws = () => {
+  const [n] = b(Pt), [s] = Ie(), [e] = re(), [, t] = D(), o = Ht(), [, c] = L(), l = ue(null), i = ue(null), [d, m] = B({ width: 0, height: 0 }), a = fs(d), [u, p] = B(0), [x, k] = B([]), [, g] = B([]), [, h] = b(zt), [y, _] = M(), A = U("loading", !1), P = U("htmlDir", "ltr");
   j(() => {
-    const { clientWidth: x, clientHeight: S } = i.current;
-    l({ width: x, height: S }), p === 0 && u(x);
-  }, [i, e, p]);
-  const Y = (x, S = 0) => {
-    const { top: E } = x.getBoundingClientRect();
-    return E + S >= 0 && E - S <= window.innerHeight;
+    const { clientWidth: v, clientHeight: E } = i.current;
+    m({ width: v, height: E }), u === 0 && p(v);
+  }, [i, e, u]);
+  const F = (v, E = 0) => {
+    const { top: N } = v.getBoundingClientRect();
+    return N + E >= 0 && N - E <= window.innerHeight;
   };
   j(() => {
-    var x, S;
-    if (o && o.type !== "Multiple" && a.current) {
-      const E = Re(a.current.contentDocument, o._id);
-      E && (Y(E) || (S = (x = a.current) == null ? void 0 : x.contentWindow) == null || S.scrollTo({ top: E.offsetTop, behavior: "smooth" }), y([E]));
+    var v, E;
+    if (o && o.type !== "Multiple" && l.current) {
+      const N = Pe(l.current.contentDocument, o._id);
+      N && (F(N) || (E = (v = l.current) == null ? void 0 : v.contentWindow) == null || E.scrollTo({ top: N.offsetTop, behavior: "smooth" }), k([N]));
     }
   }, [o]), j(() => {
-    if (!I(k) && a.current) {
-      const x = zs(
-        a.current.contentDocument,
-        U(k).id
+    if (!I(y) && l.current) {
+      const v = Us(
+        l.current.contentDocument,
+        K(y).id
       );
-      g(x ? [x] : [null]);
+      g(v ? [v] : [null]);
     } else
       g([null]);
-  }, [k]);
-  const G = Oe(() => {
-    let x = ms;
-    return x = x.replace("__HTML_DIR__", K), n === "offline" && (x = x.replace(
+  }, [y]);
+  const H = Ue(() => {
+    let v = gs;
+    return v = v.replace("__HTML_DIR__", P), n === "offline" && (v = v.replace(
       "https://old.chaibuilder.com/offline/tailwind.cdn.js",
       "/offline/tailwind.cdn.js"
-    ), x = x.replace("https://unpkg.com/aos@next/dist/aos.css", "/offline/aos.css"), x = x.replace("https://unpkg.com/aos@next/dist/aos.js", "/offline/aos.js")), x;
+    ), v = v.replace("https://unpkg.com/aos@next/dist/aos.css", "/offline/aos.css"), v = v.replace("https://unpkg.com/aos@next/dist/aos.js", "/offline/aos.js")), v;
   }, [n]);
   return /* @__PURE__ */ r.jsx(
     "div",
     {
       onClick: () => {
-        t([]), C([]);
+        t([]), _([]);
       },
       onMouseLeave: () => setTimeout(() => c(""), 300),
       className: "relative mx-auto h-full w-full overflow-hidden",
-      style: p > 0 && !I(h) ? { width: s ? "100%" : p } : {},
+      style: u > 0 && !I(a) ? { width: s ? "100%" : u } : {},
       ref: i,
       children: /* @__PURE__ */ r.jsxs(
-        xs,
+        vs,
         {
-          contentDidMount: () => m(a.current),
-          ref: a,
+          contentDidMount: () => h(l.current),
+          ref: l,
           id: "canvas-iframe",
-          style: { width: `${e}px`, ...h },
+          style: { width: `${e}px`, ...a },
           className: "relative mx-auto box-content h-full max-w-full shadow-lg transition-all duration-300 ease-linear",
-          initialContent: G,
+          initialContent: H,
           children: [
             /* @__PURE__ */ r.jsx(Is, {}),
             /* @__PURE__ */ r.jsx(
-              Es,
+              Ns,
               {
                 block: o,
-                selectedBlockElement: U($)
+                selectedBlockElement: K(x)
               }
             ),
             /* @__PURE__ */ r.jsx(Ms, { model: "page" }),
-            /* @__PURE__ */ r.jsx(rs, { children: /* @__PURE__ */ r.jsx(As, { children: L ? /* @__PURE__ */ r.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ r.jsx(V, { className: "h-full" }) }) : /* @__PURE__ */ r.jsx(Ps, {}) }) }),
+            /* @__PURE__ */ r.jsx(is, { children: /* @__PURE__ */ r.jsx(Ss, { children: A ? /* @__PURE__ */ r.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ r.jsx(te, { className: "h-full" }) }) : /* @__PURE__ */ r.jsx(Os, {}) }) }),
             /* @__PURE__ */ r.jsx("br", {}),
             /* @__PURE__ */ r.jsx(
               "div",
@@ -1225,16 +1225,16 @@ const Ps = () => {
       )
     }
   );
-}, Us = A.lazy(() => import("./CodeEditor-kxV5RCpd.js")), Go = () => {
-  const [n] = Ut();
+}, qs = S.lazy(() => import("./CodeEditor-zYBqhBv3.js")), Qo = () => {
+  const [n] = Ot();
   return /* @__PURE__ */ r.jsxs("div", { className: "flex h-full w-full flex-col", children: [
-    /* @__PURE__ */ r.jsx(hs, {}),
+    /* @__PURE__ */ r.jsx(ms, {}),
     /* @__PURE__ */ r.jsxs("div", { className: "relative flex h-full flex-col overflow-hidden bg-slate-800/90 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] px-2", children: [
-      /* @__PURE__ */ r.jsx(J, { fallback: /* @__PURE__ */ r.jsx(V, { className: "h-full" }), children: /* @__PURE__ */ r.jsx(Wt, { children: /* @__PURE__ */ r.jsx(Os, {}) }) }),
-      n ? /* @__PURE__ */ r.jsx(J, { fallback: /* @__PURE__ */ r.jsx(V, { className: "h-full" }), children: /* @__PURE__ */ r.jsx(is, { enable: { top: !0, bottom: !1 }, className: "max-h-[400px] min-h-[200px]", children: /* @__PURE__ */ r.jsx(Us, {}) }) }) : null
+      /* @__PURE__ */ r.jsx(J, { fallback: /* @__PURE__ */ r.jsx(te, { className: "h-full" }), children: /* @__PURE__ */ r.jsx(Kt, { children: /* @__PURE__ */ r.jsx(Ws, {}) }) }),
+      n ? /* @__PURE__ */ r.jsx(J, { fallback: /* @__PURE__ */ r.jsx(te, { className: "h-full" }), children: /* @__PURE__ */ r.jsx(ls, { enable: { top: !0, bottom: !1 }, className: "max-h-[400px] min-h-[200px]", children: /* @__PURE__ */ r.jsx(qs, {}) }) }) : null
     ] })
   ] });
 };
 export {
-  Go as default
+  Qo as default
 };