@chaibuilder/sdk 1.2.23 → 1.2.25

package/dist/{CanvasArea-ulUy_rmB.js → CanvasArea-dZjng782.js}

@@ -1,70 +1,86 @@
-var Re = Object.defineProperty;
-var $e = (e, t, n) => t in e ? Re(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
-var E = (e, t, n) => ($e(e, typeof t != "symbol" ? t + "" : t, n), n);
-import { j as o } from "./jsx-runtime-WbnYoNE9.js";
-import M, { createElement as se, useCallback as K, useState as I, useEffect as j, Component as me, Children as Fe, Suspense as ge, useRef as ie, useMemo as Pe } from "react";
-import { map as O, includes as re, toUpper as Q, round as Oe, noop as $, has as fe, throttle as xe, isEmpty as N, first as W, omit as He, pick as ze, get as y, isString as ee, memoize as Ue, each as We, find as qe, filter as ye, isNull as Ke } from "lodash-es";
-import { ResetIcon as ae, MobileIcon as le, LaptopIcon as Ve, DesktopIcon as Ye, DotsVerticalIcon as Je, EraserIcon as Qe, ZoomInIcon as Ze, DragHandleDots2Icon as Ge, ArrowUpIcon as Xe, CopyIcon as et, TrashIcon as tt } from "@radix-ui/react-icons";
-import { v as ve, B as q, V as be, aB as nt, aC as ot, aD as st, aE as it, aF as rt, N as te, ab as at, h as V, aG as lt, aH as ct, aI as dt, aJ as pt, aK as ut, aL as ht, aM as mt, r as S, ac as T, A as gt, a as ft, b as xt, c as yt, d as vt, e as bt, f as kt, g as wt, ai as jt, O as ke, aA as U, L as Ct, aN as Bt, Y as L, a5 as Dt, aO as F, E as ne, t as we, q as je, s as Ce, z as It, aP as St, aQ as Be, aR as _t, aS as Nt, F as At, aT as Et, a1 as Mt, aU as Tt, S as De } from "./index-HD1UKc4P.js";
+var He = Object.defineProperty;
+var Oe = (e, t, n) => t in e ? He(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
+var E = (e, t, n) => (Oe(e, typeof t != "symbol" ? t + "" : t, n), n);
+import { j as o } from "./jsx-runtime-Sp0orL4X.js";
+import M, { useMemo as ge, useEffect as k, createElement as ie, useCallback as q, useState as I, Component as fe, Children as ze, Suspense as xe, useRef as re } from "react";
+import { each as G, find as ye, map as H, includes as ae, toUpper as J, round as Ue, noop as R, has as ve, throttle as be, isEmpty as A, first as W, omit as We, get as y, pick as Ke, memoize as qe, filter as ke, isNull as Ve, isString as te } from "lodash-es";
+import { ResetIcon as le, DotsVerticalIcon as Ye, MobileIcon as ce, LaptopIcon as Ze, DesktopIcon as Je, EraserIcon as Qe, ZoomInIcon as Ge, ArrowUpIcon as Xe, CopyIcon as et, TrashIcon as tt, DragHandleDots2Icon as nt } from "@radix-ui/react-icons";
+import { B as K, u as V, S as we } from "./skeleton-lu8e7q2y.js";
+import { o as ot, b as je, t as st, j as S, n as T, v as it, f as L, w as F, a as ne, u as Ce, g as Be, i as De, m as rt, x as at, y as Ie, h as lt, z as ct, k as dt, A as pt, E as ut } from "./ChaiBuilderEditor-vP4at00I.js";
+import { S as U } from "./separator-SctTn0Qi.js";
 import { useTranslation as Y } from "react-i18next";
+import { a as Se, u as oe } from "./useDarkMode-8VHJlYyE.js";
+import { S as ht, H as mt, a as gt, b as ft } from "./hover-card-q138xxXR.js";
+import { L as xt } from "./label-KaP7MRrs.js";
+import { D as yt, a as vt, b as bt, f as kt, g as wt, d as jt } from "./dropdown-menu-El86_9Uo.js";
+import { a as Ct, u as _e } from "./useSelectedBreakpoints-6NK5qd7T.js";
+import { A as Bt, a as Dt, b as It, c as St, e as _t, f as At, d as Nt, h as Et, g as Mt } from "./alert-dialog-rypfO5ly.js";
 import { useAtom as C } from "jotai";
-import ce from "react-dom";
-import w from "prop-types";
+import { u as Tt } from "./useUpdateBlocksProps-vWcDp-P9.js";
 import { Quill as Lt } from "react-quill";
-import { useFeature as Ie } from "flagged";
+import { u as $t } from "./useAddBlock-FEKFJNwQ.js";
+import { useFeature as Ae } from "flagged";
 import { flip as Rt } from "@floating-ui/dom";
-import { useFloating as $t, shift as Ft } from "@floating-ui/react-dom";
-import { useResizeObserver as Pt } from "@react-hookz/web";
-import { tailwindcssPaletteGenerator as Ot } from "@bobthered/tailwindcss-palette-generator";
-import Ht from "@tailwindcss/typography";
-import zt from "@tailwindcss/forms";
-import Ut from "@tailwindcss/aspect-ratio";
-import { Provider as Wt } from "react-wrap-balancer";
-import { twMerge as qt } from "tailwind-merge";
-import { S as de, a as Se } from "./STRINGS--j49GZJP.js";
-import { getBlockComponent as Kt } from "@chaibuilder/runtime";
-import { u as Vt, B as Yt, E as Jt } from "./index-uLtBNl55.js";
-import "./_commonjsHelpers-UyOWmZb0.js";
-import "./Functions-7jnEwJyw.js";
-import "clsx";
-import "./MODIFIERS-dytZ-osO.js";
-import "@radix-ui/react-toggle";
-import "class-variance-authority";
-import "./Class-lGzsNBOK.js";
-import "@radix-ui/react-switch";
+import { useFloating as Ft, shift as Pt } from "@floating-ui/react-dom";
+import { c as Ht, a as Ot } from "./block-helpers-oSFpSsGz.js";
+import { useResizeObserver as zt } from "@react-hookz/web";
+import { tailwindcssPaletteGenerator as Ut } from "@bobthered/tailwindcss-palette-generator";
+import Wt from "@tailwindcss/typography";
+import Kt from "@tailwindcss/forms";
+import qt from "@tailwindcss/aspect-ratio";
+import { Provider as Vt } from "react-wrap-balancer";
+import { twMerge as Yt } from "tailwind-merge";
+import { S as Ne, a as de } from "./STRINGS-b432aBJJ.js";
+import { getChaiDataProviders as Zt, getBlockComponent as Jt } from "@chaibuilder/runtime";
+import { u as Ee } from "./useChaiExternalData-fkFgoS80.js";
+import pe from "react-dom";
+import j from "prop-types";
 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 "class-variance-authority";
+import "./utils-dze1SGvB.js";
+import "clsx";
 import "@radix-ui/react-tooltip";
-import "@radix-ui/react-popover";
-import "@radix-ui/react-menubar";
-import "@radix-ui/react-hover-card";
-import "@radix-ui/react-select";
-import "@radix-ui/react-dropdown-menu";
-import "@radix-ui/react-separator";
 import "@radix-ui/react-toast";
-import "cmdk";
-import "@radix-ui/react-context-menu";
-import "react-icons-picker";
+import "./MODIFIERS-CNqNUapY.js";
+import "@radix-ui/react-scroll-area";
 import "i18next";
+import "./Functions-NzT2Six_.js";
 import "react-hotkeys-hook";
-const Qt = () => {
-  const { hasUndo: e, hasRedo: t, undo: n, redo: r } = ve();
+import "@radix-ui/react-separator";
+import "@radix-ui/react-switch";
+import "@radix-ui/react-hover-card";
+import "@radix-ui/react-label";
+import "@radix-ui/react-dropdown-menu";
+import "@radix-ui/react-alert-dialog";
+import "./Controls-3Cc1XYXg.js";
+const Qt = () => ge(() => Zt(), []), Gt = ({ children: e }) => {
+  const [, t] = Ee(), [n] = ot(), a = Qt();
+  return k(() => (t({}), G(n, (r) => {
+    const i = ye(a, { providerKey: r.providerKey });
+    if (i) {
+      const c = (i == null ? void 0 : i.mockFn) || (i == null ? void 0 : i.dataFn);
+      c && c(r.args).then(
+        (s) => t((l) => ({ ...l, [r.providerKey]: s }))
+      );
+    }
+  }), () => {
+    G(n, (r) => {
+      t((i) => (delete i[r.providerKey], i));
+    });
+  }), [a, n, t]), /* @__PURE__ */ o.jsx(o.Fragment, { children: e });
+}, Xt = () => {
+  const { hasUndo: e, hasRedo: t, undo: n, redo: a } = je();
   return /* @__PURE__ */ o.jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ o.jsx(q, { disabled: !e(), size: "sm", onClick: n, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ o.jsx(ae, {}) }),
-    /* @__PURE__ */ o.jsx(q, { disabled: !t(), onClick: r, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ o.jsx(ae, { className: "rotate-180 scale-y-[-1] transform" }) })
+    /* @__PURE__ */ o.jsx(K, { disabled: !e(), size: "sm", onClick: n, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ o.jsx(le, {}) }),
+    /* @__PURE__ */ o.jsx(K, { disabled: !t(), onClick: a, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ o.jsx(le, { className: "rotate-180 scale-y-[-1] transform" }) })
   ] });
 };
-function Zt() {
-  const [e, t] = be(), { t: n } = Y();
+function en() {
+  const [e, t] = Se(), { t: n } = Y();
   return /* @__PURE__ */ o.jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ o.jsx(nt, { htmlFor: "dark-mode-switch", children: n("dark_mode") }),
+    /* @__PURE__ */ o.jsx(xt, { htmlFor: "dark-mode-switch", children: n("dark_mode") }),
     /* @__PURE__ */ o.jsxs(
-      ot,
+      ht,
       {
         id: "dark-mode-switch",
         checked: e,
@@ -88,7 +104,7 @@ function Zt() {
     )
   ] });
 }
-const pe = ({ landscape: e = !1 }) => /* @__PURE__ */ o.jsxs(
+const ue = ({ landscape: e = !1 }) => /* @__PURE__ */ o.jsxs(
   "svg",
   {
     className: e ? "rotate-90" : "",
@@ -111,149 +127,149 @@ const pe = ({ landscape: e = !1 }) => /* @__PURE__ */ o.jsxs(
       )
     ]
   }
-), Gt = [
+), tn = [
   {
     title: "mobile_xs_title",
     content: "mobile_xs_content",
     breakpoint: "xs",
-    icon: /* @__PURE__ */ o.jsx(le, {}),
+    icon: /* @__PURE__ */ o.jsx(ce, {}),
     width: 400
   },
   {
     title: "mobile_sm_title",
     content: "mobile_sm_content",
     breakpoint: "sm",
-    icon: /* @__PURE__ */ o.jsx(le, { className: "rotate-90" }),
+    icon: /* @__PURE__ */ o.jsx(ce, { className: "rotate-90" }),
     width: 640
   },
   {
     title: "tablet_md_title",
     content: "tablet_md_content",
     breakpoint: "md",
-    icon: /* @__PURE__ */ o.jsx(pe, {}),
+    icon: /* @__PURE__ */ o.jsx(ue, {}),
     width: 800
   },
   {
     title: "tablet_lg_title",
     content: "tablet_lg_content",
     breakpoint: "lg",
-    icon: /* @__PURE__ */ o.jsx(pe, { landscape: !0 }),
+    icon: /* @__PURE__ */ o.jsx(ue, { landscape: !0 }),
     width: 1024
   },
   {
     title: "desktop_xl_title",
     content: "desktop_xl_content",
     breakpoint: "xl",
-    icon: /* @__PURE__ */ o.jsx(Ve, {}),
+    icon: /* @__PURE__ */ o.jsx(Ze, {}),
     width: 1420
   },
   {
     title: "large_desktop_2xl_title",
     content: "large_desktop_2xl_content",
     breakpoint: "2xl",
-    icon: /* @__PURE__ */ o.jsx(Ye, {}),
+    icon: /* @__PURE__ */ o.jsx(Je, {}),
     width: 1920
   }
-], ue = ({
+], he = ({
   title: e,
   content: t,
   currentBreakpoint: n,
-  breakpoint: r,
-  width: a,
+  breakpoint: a,
+  width: r,
   icon: i,
   onClick: c
 }) => {
   const { t: s } = Y();
-  return /* @__PURE__ */ o.jsxs(st, { children: [
-    /* @__PURE__ */ o.jsx(it, { asChild: !0, children: /* @__PURE__ */ o.jsx(
-      q,
+  return /* @__PURE__ */ o.jsxs(mt, { children: [
+    /* @__PURE__ */ o.jsx(gt, { asChild: !0, children: /* @__PURE__ */ o.jsx(
+      K,
       {
-        onClick: () => c(a),
+        onClick: () => c(r),
         size: "sm",
-        variant: r === n ? "secondary" : "ghost",
+        variant: a === n ? "secondary" : "ghost",
         children: i
       }
     ) }),
-    /* @__PURE__ */ o.jsx(rt, { className: "w-52 border-border", children: /* @__PURE__ */ o.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ o.jsxs("div", { className: "space-y-1", children: [
+    /* @__PURE__ */ o.jsx(ft, { className: "w-52 border-border", children: /* @__PURE__ */ o.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ o.jsxs("div", { className: "space-y-1", children: [
       /* @__PURE__ */ o.jsx("h4", { className: "text-sm font-semibold", children: s(e) }),
       /* @__PURE__ */ o.jsx("p", { className: "text-xs", children: s(t) })
     ] }) }) })
   ] });
-}, Xt = () => {
-  const [, e, t] = te(), [n, r] = at(), { t: a } = Y(), i = V("breakpoints", Gt), c = (s) => {
-    n.includes(s) ? n.length > 2 && r(n.filter((l) => l !== s)) : r((l) => [...l, s]);
+}, nn = () => {
+  const [, e, t] = oe(), [n, a] = Ct(), { t: r } = Y(), i = V("breakpoints", tn), c = (s) => {
+    n.includes(s) ? n.length > 2 && a(n.filter((l) => l !== s)) : a((l) => [...l, s]);
   };
-  return i.length < 4 ? /* @__PURE__ */ o.jsx("div", { className: "flex items-center rounded-md", children: O(i, (s) => /* @__PURE__ */ se(ue, { ...s, onClick: t, key: s.breakpoint, currentBreakpoint: e })) }) : /* @__PURE__ */ o.jsxs("div", { className: "flex items-center rounded-md", children: [
-    O(
-      i.filter((s) => re(n, Q(s.breakpoint))),
-      (s) => /* @__PURE__ */ se(ue, { ...s, onClick: t, key: s.breakpoint, currentBreakpoint: e })
+  return i.length < 4 ? /* @__PURE__ */ o.jsx("div", { className: "flex items-center rounded-md", children: H(i, (s) => /* @__PURE__ */ ie(he, { ...s, onClick: t, key: s.breakpoint, currentBreakpoint: e })) }) : /* @__PURE__ */ o.jsxs("div", { className: "flex items-center rounded-md", children: [
+    H(
+      i.filter((s) => ae(n, J(s.breakpoint))),
+      (s) => /* @__PURE__ */ ie(he, { ...s, onClick: t, key: s.breakpoint, currentBreakpoint: e })
     ),
-    /* @__PURE__ */ o.jsxs(lt, { children: [
-      /* @__PURE__ */ o.jsx(ct, { asChild: !0, children: /* @__PURE__ */ o.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ o.jsx(Je, { className: "scale-90 transform" }) }) }),
-      /* @__PURE__ */ o.jsxs(dt, { className: "w-56 border-border text-xs", children: [
-        /* @__PURE__ */ o.jsx(pt, { children: a("Breakpoints") }),
-        /* @__PURE__ */ o.jsx(ut, {}),
-        O(i, (s) => /* @__PURE__ */ o.jsx(
-          ht,
+    /* @__PURE__ */ o.jsxs(yt, { children: [
+      /* @__PURE__ */ o.jsx(vt, { asChild: !0, children: /* @__PURE__ */ o.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ o.jsx(Ye, { className: "scale-90 transform" }) }) }),
+      /* @__PURE__ */ o.jsxs(bt, { className: "w-56 border-border text-xs", children: [
+        /* @__PURE__ */ o.jsx(kt, { children: r("Breakpoints") }),
+        /* @__PURE__ */ o.jsx(wt, {}),
+        H(i, (s) => /* @__PURE__ */ o.jsx(
+          jt,
           {
             disabled: s.breakpoint === "xs",
-            onCheckedChange: () => c(Q(s.breakpoint)),
-            checked: re(n, Q(s.breakpoint)),
-            children: a(s.title)
+            onCheckedChange: () => c(J(s.breakpoint)),
+            checked: ae(n, J(s.breakpoint)),
+            children: r(s.title)
           },
           s.breakpoint
         ))
       ] })
     ] })
   ] });
-}, en = () => {
-  const { t: e } = Y(), { setNewBlocks: t } = mt(), [, n] = S(), [, r] = T(), a = K(() => {
-    t([]), n([]), r([]);
+}, on = () => {
+  const { t: e } = Y(), { setNewBlocks: t } = st(), [, n] = S(), [, a] = T(), r = q(() => {
+    t([]), n([]), a([]);
   }, [t]);
-  return /* @__PURE__ */ o.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ o.jsxs(gt, { children: [
-    /* @__PURE__ */ o.jsx(ft, { asChild: !0, children: /* @__PURE__ */ o.jsxs(q, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
+  return /* @__PURE__ */ o.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ o.jsxs(Bt, { children: [
+    /* @__PURE__ */ o.jsx(Dt, { asChild: !0, children: /* @__PURE__ */ o.jsxs(K, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
       /* @__PURE__ */ o.jsx(Qe, {}),
       " ",
       e("clear")
     ] }) }),
-    /* @__PURE__ */ o.jsxs(xt, { className: "border-border", children: [
-      /* @__PURE__ */ o.jsxs(yt, { children: [
-        /* @__PURE__ */ o.jsx(vt, { children: e("clear_canvas_title") }),
-        /* @__PURE__ */ o.jsx(bt, { children: e("clear_canvas_description") })
+    /* @__PURE__ */ o.jsxs(It, { className: "border-border", children: [
+      /* @__PURE__ */ o.jsxs(St, { children: [
+        /* @__PURE__ */ o.jsx(_t, { children: e("clear_canvas_title") }),
+        /* @__PURE__ */ o.jsx(At, { children: e("clear_canvas_description") })
       ] }),
-      /* @__PURE__ */ o.jsxs(kt, { children: [
-        /* @__PURE__ */ o.jsx(wt, { children: e("cancel") }),
-        /* @__PURE__ */ o.jsx(jt, { onClick: a, children: e("yes") })
+      /* @__PURE__ */ o.jsxs(Nt, { children: [
+        /* @__PURE__ */ o.jsx(Et, { children: e("cancel") }),
+        /* @__PURE__ */ o.jsx(Mt, { onClick: r, children: e("yes") })
       ] })
     ] })
   ] }) });
-}, tn = () => {
-  const e = V("darkMode", !1), [t] = ke();
+}, sn = () => {
+  const e = V("darkMode", !1), [t] = _e();
   return /* @__PURE__ */ o.jsxs("div", { className: "flex h-10 items-center justify-between border-b bg-background/70 px-2", children: [
     /* @__PURE__ */ o.jsxs("div", { className: "flex h-full space-x-2", children: [
       e ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-        /* @__PURE__ */ o.jsx(Zt, {}),
+        /* @__PURE__ */ o.jsx(en, {}),
         /* @__PURE__ */ o.jsx(U, { orientation: "vertical" })
       ] }) : null,
-      /* @__PURE__ */ o.jsx(Xt, {}),
+      /* @__PURE__ */ o.jsx(nn, {}),
       /* @__PURE__ */ o.jsx(U, { orientation: "vertical" }),
       /* @__PURE__ */ o.jsxs("div", { className: "flex w-12 items-center justify-center gap-x-1 space-x-0 font-medium", children: [
-        /* @__PURE__ */ o.jsx(Ze, { className: "h-3.5 w-3.5 flex-shrink-0" }),
+        /* @__PURE__ */ o.jsx(Ge, { className: "h-3.5 w-3.5 flex-shrink-0" }),
         " ",
         /* @__PURE__ */ o.jsxs("div", { className: "text-xs leading-3", children: [
-          Oe(t, 0),
+          Ue(t, 0),
           "%"
         ] })
       ] }),
       /* @__PURE__ */ o.jsx(U, { orientation: "vertical" }),
-      /* @__PURE__ */ o.jsx(Qt, {})
+      /* @__PURE__ */ o.jsx(Xt, {})
     ] }),
     /* @__PURE__ */ o.jsxs("div", { className: "flex h-full items-center space-x-2", children: [
       /* @__PURE__ */ o.jsx(U, { orientation: "vertical" }),
-      /* @__PURE__ */ o.jsx(en, {})
+      /* @__PURE__ */ o.jsx(on, {})
     ] })
   ] });
-}, nn = `<!doctype html>
+}, rn = `<!doctype html>
 <html class="scroll-smooth h-full overflow-y-auto">
   <head>
     <meta charset="UTF-8">
@@ -301,8 +317,8 @@ const pe = ({ landscape: e = !1 }) => /* @__PURE__ */ o.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>`, on = (e) => {
-  const [t] = te(), [, n] = ke(), [r, a] = I({}), i = K(() => {
+</html>`, an = (e) => {
+  const [t] = oe(), [, n] = _e(), [a, r] = I({}), i = q(() => {
     const { width: c, height: s } = e;
     if (c < t) {
       const l = parseFloat((c / t).toFixed(2).toString());
@@ -311,7 +327,7 @@ const pe = ({ landscape: e = !1 }) => /* @__PURE__ */ o.jsxs(
       s && (d = {
         // Eureka! This is the formula to calculate the height of the scaled element. Thank you ChatGPT 4
         height: 100 + (s - p) / p * 100 + "%"
-      }), a({
+      }), r({
         position: "relative",
         top: 0,
         transform: `scale(${l})`,
@@ -320,17 +336,17 @@ const pe = ({ landscape: e = !1 }) => /* @__PURE__ */ o.jsxs(
         maxWidth: "none"
       }), n(l * 100);
     } else
-      a({}), n(100);
+      r({}), n(100);
   }, [t, e, n]);
-  return j(() => {
+  return k(() => {
     i();
-  }, [t, e, n, i]), r;
+  }, [t, e, n, i]), a;
 };
-let _e, Ne;
-typeof document < "u" && (_e = document);
-typeof window < "u" && (Ne = window);
-const Ae = M.createContext({ document: _e, window: Ne }), J = () => M.useContext(Ae), { Provider: sn, Consumer: No } = Ae;
-class Ee extends me {
+let Me, Te;
+typeof document < "u" && (Me = document);
+typeof window < "u" && (Te = window);
+const Le = M.createContext({ document: Me, window: Te }), Z = () => M.useContext(Le), { Provider: ln, Consumer: To } = Le;
+class $e extends fe {
   componentDidMount() {
     this.props.contentDidMount();
   }
@@ -338,21 +354,21 @@ class Ee extends me {
     this.props.contentDidUpdate();
   }
   render() {
-    return Fe.only(this.props.children);
+    return ze.only(this.props.children);
   }
 }
-E(Ee, "propTypes", {
-  children: w.element.isRequired,
-  contentDidMount: w.func.isRequired,
-  contentDidUpdate: w.func.isRequired
+E($e, "propTypes", {
+  children: j.element.isRequired,
+  contentDidMount: j.func.isRequired,
+  contentDidUpdate: j.func.isRequired
 });
-class G extends me {
-  constructor(n, r) {
-    super(n, r);
+class X extends fe {
+  constructor(n, a) {
+    super(n, a);
     E(this, "setRef", (n) => {
       this.nodeRef.current = n;
-      const { forwardedRef: r } = this.props;
-      typeof r == "function" ? r(n) : r && (r.current = n);
+      const { forwardedRef: a } = this.props;
+      typeof a == "function" ? a(n) : a && (a.current = n);
     });
     E(this, "handleLoad", () => {
       clearInterval(this.loadCheck), this.state.iframeLoaded || this.setState({ iframeLoaded: !0 });
@@ -383,8 +399,8 @@ class G extends me {
     const n = this.getDoc();
     if (!n)
       return null;
-    const r = this.props.contentDidMount, a = this.props.contentDidUpdate, i = n.defaultView || n.parentView, c = /* @__PURE__ */ o.jsx(Ee, { contentDidMount: r, contentDidUpdate: a, children: /* @__PURE__ */ o.jsx(sn, { value: { document: n, window: i }, children: /* @__PURE__ */ o.jsx("div", { className: "frame-content", children: this.props.children }) }) }), s = this.getMountTarget();
-    return [ce.createPortal(this.props.head, this.getDoc().head), ce.createPortal(c, s)];
+    const a = this.props.contentDidMount, r = this.props.contentDidUpdate, i = n.defaultView || n.parentView, c = /* @__PURE__ */ o.jsx($e, { contentDidMount: a, contentDidUpdate: r, children: /* @__PURE__ */ o.jsx(ln, { value: { document: n, window: i }, children: /* @__PURE__ */ o.jsx("div", { className: "frame-content", children: this.props.children }) }) }), s = this.getMountTarget();
+    return [pe.createPortal(this.props.head, this.getDoc().head), pe.createPortal(c, s)];
   }
   render() {
     const n = {
@@ -400,16 +416,16 @@ class G extends me {
 // 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.
-E(G, "propTypes", {
-  style: w.object,
+E(X, "propTypes", {
+  style: j.object,
   // eslint-disable-line
-  head: w.node,
-  initialContent: w.string,
-  mountTarget: w.string,
-  contentDidMount: w.func,
-  contentDidUpdate: w.func,
-  children: w.oneOfType([w.element, w.arrayOf(w.element)])
-}), E(G, "defaultProps", {
+  head: j.node,
+  initialContent: j.string,
+  mountTarget: j.string,
+  contentDidMount: j.func,
+  contentDidUpdate: j.func,
+  children: j.oneOfType([j.element, j.arrayOf(j.element)])
+}), E(X, "defaultProps", {
   style: {},
   head: null,
   children: void 0,
@@ -420,117 +436,117 @@ E(G, "propTypes", {
   },
   initialContent: '<!DOCTYPE html><html><head></head><body><div class="frame-root"></div></body></html>'
 });
-const rn = M.forwardRef((e, t) => /* @__PURE__ */ o.jsx(G, { ...e, forwardedRef: t })), an = () => {
-  const { addCoreBlock: e } = Ct(), t = V("getExternalPredefinedBlock", $);
-  return K(
+const cn = M.forwardRef((e, t) => /* @__PURE__ */ o.jsx(X, { ...e, forwardedRef: t })), dn = () => {
+  const { addCoreBlock: e } = $t(), t = V("getExternalPredefinedBlock", R);
+  return q(
     async (n) => {
-      const { block: r, dropTargetId: a, relativeIndex: i } = n;
-      if (fe(r, "format")) {
-        const c = await t(r);
-        return e({ blocks: c }, a === 0 ? null : a, i);
+      const { block: a, dropTargetId: r, relativeIndex: i } = n;
+      if (ve(a, "format")) {
+        const c = await t(a);
+        return e({ blocks: c }, r === 0 ? null : r, i);
       }
-      return e(r, a === 0 ? null : a, i);
+      return e(a, r === 0 ? null : r, i);
     },
     [e]
   );
 };
-let _ = null, H = [], P = null, Me = null;
-function ln(e) {
-  const t = window.getComputedStyle(e), n = parseInt(t.paddingLeft, 10), r = parseInt(t.paddingTop, 10), a = parseInt(t.paddingRight, 10), i = parseInt(t.paddingBottom, 10);
-  return { paddingLeft: n, paddingTop: r, paddingRight: a, paddingBottom: i };
+let _ = null, O = [], P = null, Re = null;
+function pn(e) {
+  const t = window.getComputedStyle(e), n = parseInt(t.paddingLeft, 10), a = parseInt(t.paddingTop, 10), r = parseInt(t.paddingRight, 10), i = parseInt(t.paddingBottom, 10);
+  return { paddingLeft: n, paddingTop: a, paddingRight: r, paddingBottom: i };
 }
-const he = (e, t, n) => {
+const me = (e, t, n) => {
   if (!_)
     return;
-  const r = e.getBoundingClientRect(), a = _ == null ? void 0 : _.getElementById("placeholder"), { paddingLeft: i, paddingTop: c, paddingRight: s, paddingBottom: l } = ln(e);
-  a.style.width = t === "vertical" ? r.width - i - s + "px" : "2px", a.style.height = t === "vertical" ? "2px" : r.height - c - l + "px", a.style.display = "block";
-  const d = H.reduce(
+  const a = e.getBoundingClientRect(), r = _ == null ? void 0 : _.getElementById("placeholder"), { paddingLeft: i, paddingTop: c, paddingRight: s, paddingBottom: l } = pn(e);
+  r.style.width = t === "vertical" ? a.width - i - s + "px" : "2px", r.style.height = t === "vertical" ? "2px" : a.height - c - l + "px", r.style.display = "block";
+  const d = O.reduce(
     (p, m) => Math.abs(m - n) < Math.abs(p - n) ? m : p
   );
-  Me = H.indexOf(d), t === "vertical" ? (a.style.top = e.offsetTop + d + "px", a.style.left = e.offsetLeft + i + "px") : (a.style.top = e.offsetTop + c + "px", a.style.left = e.offsetLeft + d + "px");
-}, cn = (e) => {
-  const t = Te(e), n = window.getComputedStyle(e), r = t === "horizontal", a = parseInt(n.paddingLeft), i = parseInt(n.paddingTop);
-  let c = r ? a : i;
-  H = [c], Array.from(e.children).forEach((s) => {
+  Re = O.indexOf(d), t === "vertical" ? (r.style.top = e.offsetTop + d + "px", r.style.left = e.offsetLeft + i + "px") : (r.style.top = e.offsetTop + c + "px", r.style.left = e.offsetLeft + d + "px");
+}, un = (e) => {
+  const t = Fe(e), n = window.getComputedStyle(e), a = t === "horizontal", r = parseInt(n.paddingLeft), i = parseInt(n.paddingTop);
+  let c = a ? r : i;
+  O = [c], Array.from(e.children).forEach((s) => {
     const l = window.getComputedStyle(s), d = parseInt(
-      r ? l.marginLeft + l.marginRight : l.marginTop + l.marginBottom
-    ), p = r ? s.offsetWidth : s.offsetHeight;
-    H.push(c + p + d), c += p + d;
+      a ? l.marginLeft + l.marginRight : l.marginTop + l.marginBottom
+    ), p = a ? s.offsetWidth : s.offsetHeight;
+    O.push(c + p + d), c += p + d;
   });
 };
-function Te(e) {
+function Fe(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 r = window.getComputedStyle(e).gridTemplateRows, a = window.getComputedStyle(e).gridTemplateColumns;
-    if (r.includes("auto"))
-      return "vertical";
+    const a = window.getComputedStyle(e).gridTemplateRows, r = window.getComputedStyle(e).gridTemplateColumns;
     if (a.includes("auto"))
+      return "vertical";
+    if (r.includes("auto"))
       return "horizontal";
   }
   return t === "block" ? "vertical" : "horizontal";
 }
-const dn = xe((e) => {
-  const t = e.target, n = Te(t);
+const hn = be((e) => {
+  const t = e.target, n = Fe(t);
   if (n === "vertical") {
-    const r = e.clientY - t.offsetTop;
-    he(t, n, r);
+    const a = e.clientY - t.offsetTop;
+    me(t, n, a);
   } else {
-    const r = e.clientX - t.offsetLeft;
-    he(t, n, r);
+    const a = e.clientX - t.offsetLeft;
+    me(t, n, a);
   }
-}, 200), pn = (e) => {
-  e.preventDefault(), e.stopPropagation(), dn(e);
+}, 200), mn = (e) => {
+  e.preventDefault(), e.stopPropagation(), hn(e);
 };
-function Z() {
+function Q() {
   const e = _ == null ? void 0 : _.getElementById("placeholder");
   e.style.display = "none";
 }
-const un = () => {
-  const { document: e } = J(), [t, n] = C(Bt), r = an(), a = Ie("dnd"), [, i] = L(), [, c] = S();
+const gn = () => {
+  const { document: e } = Z(), [t, n] = C(it), a = dn(), r = Ae("dnd"), [, i] = L(), [, c] = S();
   return _ = e, {
     isDragging: t,
     "data-dnd": "branch",
-    onDragOver: a ? pn : $,
-    onDrop: a ? (s) => {
+    onDragOver: r ? mn : R,
+    onDrop: r ? (s) => {
       P == null || P.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
       const l = JSON.parse(s.dataTransfer.getData("text/plain"));
       let d = s.target.getAttribute("data-block-id");
-      d === null && (d = s.target.parentElement.getAttribute("data-block-id")), r({ block: l, dropTargetId: d || null, relativeIndex: Me }), n(!1), Z(), setTimeout(() => {
-        Z();
+      d === null && (d = s.target.parentElement.getAttribute("data-block-id")), a({ block: l, dropTargetId: d || null, relativeIndex: Re }), n(!1), Q(), setTimeout(() => {
+        Q();
       }, 300);
-    } : $,
-    onDragEnter: a ? (s) => {
+    } : R,
+    onDragEnter: r ? (s) => {
       const l = s;
-      P = l.target, l.stopPropagation(), l.preventDefault(), H = [];
+      P = l.target, l.stopPropagation(), l.preventDefault(), O = [];
       const d = l.target;
-      cn(d), d.classList.add("outline", "outline-green-300", "outline-2", "-outline-offset-2"), n(!0), i(""), c([]);
-    } : $,
-    onDragLeave: a ? (s) => {
+      un(d), d.classList.add("outline", "outline-green-300", "outline-2", "-outline-offset-2"), n(!0), i(""), c([]);
+    } : R,
+    onDragLeave: r ? (s) => {
       const l = s;
       P = null, l.stopPropagation(), l.preventDefault(), l.target.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
-    } : $,
-    onMouseOut: a ? () => {
-      n(!1), Z();
-    } : $
+    } : R,
+    onMouseOut: r ? () => {
+      n(!1), Q();
+    } : R
   };
 };
-function oe(e) {
+function se(e) {
   return e.getAttribute("data-block-id") ? e : e.closest("[data-block-id]");
 }
-function hn(e) {
+function fn(e) {
   e.container.innerHTML = "", e.container.parentNode.removeChild(e.container);
   var t = document.querySelector(".ql-toolbar");
   t && t.parentNode.removeChild(t), e = null;
 }
-const mn = () => {
-  const e = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], t = Dt(), [, n] = L(), [r, a] = C(F);
+const xn = () => {
+  const e = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], t = Tt(), [, n] = L(), [a, r] = C(F);
   return (i) => {
     var m;
-    if (r)
+    if (a)
       return;
-    const c = oe(i.target), s = c.getAttribute("data-block-type");
+    const c = se(i.target), s = c.getAttribute("data-block-type");
     if (!s || !e.includes(s))
       return;
     const l = c.cloneNode(!0);
@@ -540,17 +556,17 @@ const mn = () => {
     const d = new Lt(l, { placeholder: "Type here..." });
     function p() {
       const g = d.getText(0, d.getLength());
-      t([c.getAttribute("data-block-id")], { content: g }), c.removeAttribute("style"), l.removeEventListener("blur", p, !0), hn(d), a(""), n("");
+      t([c.getAttribute("data-block-id")], { content: g }), c.removeAttribute("style"), l.removeEventListener("blur", p, !0), fn(d), r(""), n("");
     }
-    l.addEventListener("blur", p, !0), d.focus(), (m = l.querySelector(".ql-clipboard")) == null || m.remove(), a(c.getAttribute("data-block-id"));
+    l.addEventListener("blur", p, !0), d.focus(), (m = l.querySelector(".ql-clipboard")) == null || m.remove(), r(c.getAttribute("data-block-id"));
   };
-}, gn = () => {
-  const [, e] = T(), [, t] = S(), [, n] = L(), [r] = C(F);
-  return (a) => {
-    if (r)
+}, yn = () => {
+  const [, e] = T(), [, t] = S(), [, n] = L(), [a] = C(F);
+  return (r) => {
+    if (a)
       return;
-    a.stopPropagation();
-    const i = oe(a.target);
+    r.stopPropagation();
+    const i = se(r.target);
     if (i != null && i.getAttribute("data-block-id") && (i == null ? void 0 : i.getAttribute("data-block-id")) === "container") {
       t([]), e([]), n("");
       return;
@@ -562,31 +578,31 @@ const mn = () => {
       i != null && i.getAttribute("data-block-id") && t([i.getAttribute("data-block-id")]);
     n("");
   };
-}, fn = xe((e, t) => {
-  const n = oe(e.target);
+}, vn = be((e, t) => {
+  const n = se(e.target);
   n != null && n.getAttribute("data-style-id") && t(n.getAttribute("data-style-id"));
-}, 100), xn = () => {
+}, 100), bn = () => {
   const [, e] = L(), [t] = C(F);
   return (n) => {
-    t || fn(n, e);
+    t || vn(n, e);
   };
-}, yn = ({ children: e }) => {
-  const { document: t } = J(), [n] = S(), [r, a] = T();
-  j(() => {
+}, kn = ({ children: e }) => {
+  const { document: t } = Z(), [n] = S(), [a, r] = T();
+  k(() => {
     setTimeout(() => {
-      if (!N(r))
+      if (!A(a))
         return;
-      const d = Le(t, W(n));
+      const d = Pe(t, W(n));
       if (d) {
         const p = d.getAttribute("data-style-prop");
         if (p) {
           const m = d.getAttribute("data-style-id"), g = d.getAttribute("data-block-parent");
-          a([{ id: m, prop: p, blockId: g }]);
+          r([{ id: m, prop: p, blockId: g }]);
         }
       }
     }, 100);
-  }, [t, n, a, r]);
-  const i = mn(), c = gn(), s = xn(), l = un();
+  }, [t, n, r, a]);
+  const i = xn(), c = yn(), s = bn(), l = gn();
   return /* @__PURE__ */ o.jsx(
     "div",
     {
@@ -595,25 +611,25 @@ const mn = () => {
       onClick: c,
       onDoubleClick: i,
       onMouseMove: s,
-      ...He(l, "isDragging"),
+      ...We(l, "isDragging"),
       className: "relative mb-5 h-full max-w-full " + (l.isDragging ? "dragging" : ""),
       children: e
     }
   );
-}, Le = (e, t) => e.querySelector(`[data-block-id="${t}"]`), vn = () => {
-  const { window: e } = J(), [t, n] = S(), [r] = ne(), [, a] = T(), { undo: i, redo: c } = ve(), s = we(), [, l] = je(), d = Ce(), { savePage: p } = It(), [m] = C(F), [, g] = C(St), k = (f) => {
+}, Pe = (e, t) => e.querySelector(`[data-block-id="${t}"]`), wn = () => {
+  const { window: e } = Z(), [t, n] = S(), [a] = ne(), [, r] = T(), { undo: i, redo: c } = je(), s = Ce(), [, l] = Be(), d = De(), { savePage: p } = rt(), [m] = C(F), [, g] = C(at), w = (f) => {
     f.key === "Enter" && (f.preventDefault(), t.length === 1 && g(W(t)));
   }, B = (f) => {
-    const h = r.find((b) => b._id === f);
+    const h = a.find((b) => b._id === f);
     return h ? h._parent : null;
   };
-  return j(() => {
+  return k(() => {
     const f = (h) => {
       if (h.key === "Escape") {
-        n([]), a([]);
+        n([]), r([]);
         return;
       }
-      if (k(h), !m && (h.key === "Delete" || h.key === "Backspace") && (h.preventDefault(), d(t)), h.ctrlKey || h.metaKey) {
+      if (w(h), !m && (h.key === "Delete" || h.key === "Backspace") && (h.preventDefault(), d(t)), h.ctrlKey || h.metaKey) {
         if (h.key === "ArrowUp") {
           h.preventDefault();
           const b = t.length > 0 ? B(t[0]) : null;
@@ -631,34 +647,34 @@ const mn = () => {
       e.removeEventListener("keydown", f);
     };
   }, [t, n, i, d, l, c, s, m, p, e]), null;
-}, bn = ({ block: e, label: t }) => {
-  const [, n] = S(), [, r] = L(), [, a] = C(Be), i = Ie("dnd");
+}, jn = ({ block: e, label: t }) => {
+  const [, n] = S(), [, a] = L(), [, r] = C(Ie), i = Ae("dnd");
   return /* @__PURE__ */ o.jsxs(
     "div",
     {
       className: "mr-10 flex cursor-grab items-center space-x-1 px-1",
       draggable: i ? "true" : "false",
       onDragStart: (c) => {
-        c.dataTransfer.setData("text/plain", JSON.stringify(ze(e, ["_id", "_type"]))), a(e._id), setTimeout(() => {
-          n([]), r(null);
+        c.dataTransfer.setData("text/plain", JSON.stringify(Ke(e, ["_id", "_type"]))), r(e._id), setTimeout(() => {
+          n([]), a(null);
         }, 200);
       },
       children: [
-        /* @__PURE__ */ o.jsx(Ge, {}),
+        /* @__PURE__ */ o.jsx(nt, {}),
         t
       ]
     }
   );
-}, kn = ({ selectedBlockElement: e, block: t }) => {
-  const n = Ce(), r = we(), [, a] = S(), [, i] = T(), [c] = C(F), { floatingStyles: s, refs: l, update: d } = $t({
+}, Cn = ({ selectedBlockElement: e, block: t }) => {
+  const n = De(), a = Ce(), [, r] = S(), [, i] = T(), [c] = C(F), { floatingStyles: s, refs: l, update: d } = Ft({
     placement: "top-start",
-    middleware: [Ft(), Rt()],
+    middleware: [Pt(), Rt()],
     elements: {
       reference: e
     }
   });
-  Pt(e, () => d(), e !== null);
-  const p = y(t, "_parent", null), m = N(y(t, "_name", "")) ? y(t, "_type", "") : y(t, "_name", "");
+  zt(e, () => d(), e !== null);
+  const p = y(t, "_parent", null), m = A(y(t, "_name", "")) ? y(t, "_type", "") : y(t, "_name", "");
   return !e || !t || c ? null : /* @__PURE__ */ o.jsxs(
     "div",
     {
@@ -672,58 +688,58 @@ const mn = () => {
       onKeyDown: (g) => g.stopPropagation(),
       className: "z-[99999] flex h-6 items-center bg-blue-500 py-2 text-xs text-white",
       children: [
-        /* @__PURE__ */ o.jsx(bn, { label: m, block: t }),
+        /* @__PURE__ */ o.jsx(jn, { label: m, block: t }),
         /* @__PURE__ */ o.jsxs("div", { className: "flex gap-2 px-1", children: [
           p && /* @__PURE__ */ o.jsx(
             Xe,
             {
               className: "hover:scale-105",
               onClick: () => {
-                i([]), a([p]);
+                i([]), r([p]);
               }
             }
           ),
-          _t(y(t, "_type", "")) ? /* @__PURE__ */ o.jsx(et, { className: "hover:scale-105", onClick: () => r([t == null ? void 0 : t._id]) }) : null,
-          Nt(y(t, "_type", "")) ? /* @__PURE__ */ o.jsx(tt, { className: "hover:scale-105", onClick: () => n([t == null ? void 0 : t._id]) }) : null
+          Ht(y(t, "_type", "")) ? /* @__PURE__ */ o.jsx(et, { className: "hover:scale-105", onClick: () => a([t == null ? void 0 : t._id]) }) : null,
+          Ot(y(t, "_type", "")) ? /* @__PURE__ */ o.jsx(tt, { className: "hover:scale-105", onClick: () => n([t == null ? void 0 : t._id]) }) : null
         ] })
       ]
     }
   );
-}, wn = ({ model: e }) => {
-  const [t] = At(), [n] = S(), [r] = be(), [a] = L(), [i] = T(), [c] = C(Be), { document: s, window: l } = J(), [d] = I(s == null ? void 0 : s.getElementById("highlighted-block")), [p] = I(
+}, Bn = ({ model: e }) => {
+  const [t] = lt(), [n] = S(), [a] = Se(), [r] = L(), [i] = T(), [c] = C(Ie), { document: s, window: l } = Z(), [d] = I(s == null ? void 0 : s.getElementById("highlighted-block")), [p] = I(
     s == null ? void 0 : s.getElementById("selected-block")
   ), [m] = I(
     s == null ? void 0 : s.getElementById("selected-styling-block")
   ), [g] = I(s == null ? void 0 : s.getElementById("dragged-block"));
-  j(() => {
-    r ? s == null || s.documentElement.classList.add("dark") : s == null || s.documentElement.classList.remove("dark");
-  }, [r, s]);
-  const k = y(t, "headingFont", "DM Sans"), B = y(t, "bodyFont", "DM Sans");
-  return j(() => {
-    const f = y(t, "primaryColor", "#000"), h = y(t, "secondaryColor", "#FFF"), b = Ot({
+  k(() => {
+    a ? s == null || s.documentElement.classList.add("dark") : s == null || s.documentElement.classList.remove("dark");
+  }, [a, s]);
+  const w = y(t, "headingFont", "DM Sans"), B = y(t, "bodyFont", "DM Sans");
+  return k(() => {
+    const f = y(t, "primaryColor", "#000"), h = y(t, "secondaryColor", "#FFF"), b = Ut({
       colors: [f, h],
       names: ["primary", "secondary"]
     });
     b.primary.DEFAULT = f, b.secondary.DEFAULT = h;
-    const R = y(t, "roundedCorners", "0");
+    const $ = y(t, "roundedCorners", "0");
     !l || !l.tailwind || (l.tailwind.config = {
       darkMode: "class",
       theme: {
         fontFamily: {
-          heading: [k],
+          heading: [w],
           body: [B]
         },
         extend: {
           borderRadius: {
-            global: `${R || "0"}px`
+            global: `${$ || "0"}px`
           },
           colors: b
         }
       },
       plugins: [
-        Ht,
-        zt,
-        Ut,
+        Wt,
+        Kt,
+        qt,
         l.tailwind.plugin.withOptions(() => ({ addVariant: z, e: D }) => {
           z("hs-accordion-active", [
             ({ modifySelectors: v, separator: u }) => {
@@ -758,40 +774,40 @@ const mn = () => {
         })
       ]
     });
-  }, [t, l, k, B]), j(() => {
-    p && (p.textContent = `${O(n, (f) => `[data-block-id="${f}"]`).join(",")}{
+  }, [t, l, w, B]), k(() => {
+    p && (p.textContent = `${H(n, (f) => `[data-block-id="${f}"]`).join(",")}{
                 outline: 1px solid ${n.length === 1 ? "#42a1fc" : "orange"} !important; outline-offset: -1px;
             }`);
-  }, [n, p]), j(() => {
+  }, [n, p]), k(() => {
     if (!c) {
       g.textContent = "";
       return;
     }
     g.textContent = `[data-block-id="${c}"]{ pointer-events: none !important; opacity: 0.2 !important}`;
-  }, [c]), j(() => {
-    d && (d.textContent = a ? `[data-style-id="${a}"]{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}` : "");
-  }, [a, n, d]), j(() => {
-    m && (m.textContent = `${O(i, ({ id: f }) => `[data-style-id="${f}"]`).join(",")}{
+  }, [c]), k(() => {
+    d && (d.textContent = r ? `[data-style-id="${r}"]{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}` : "");
+  }, [r, n, d]), k(() => {
+    m && (m.textContent = `${H(i, ({ id: f }) => `[data-style-id="${f}"]`).join(",")}{
                 outline: 1px solid #42a1fc !important; outline-offset: -1px;
             }`);
-  }, [i, m]), j(() => {
-    const f = y(t, "bodyTextLightColor", "#64748b"), h = y(t, "bodyTextDarkColor", "#94a3b8"), b = y(t, "bodyBgLightColor", "#FFFFFF"), R = y(t, "bodyBgDarkColor", "#0f172a");
-    s.body.className = `font-body antialiased text-[${f}] bg-[${b}] dark:text-[${h}] dark:bg-[${R}]`;
+  }, [i, m]), k(() => {
+    const f = y(t, "bodyTextLightColor", "#64748b"), h = y(t, "bodyTextDarkColor", "#94a3b8"), b = y(t, "bodyBgLightColor", "#FFFFFF"), $ = y(t, "bodyBgDarkColor", "#0f172a");
+    s.body.className = `font-body antialiased text-[${f}] bg-[${b}] dark:text-[${h}] dark:bg-[${$}]`;
   }, [t, s, e]), e === "page" ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-    k && /* @__PURE__ */ o.jsx(
+    w && /* @__PURE__ */ o.jsx(
       "link",
       {
         id: "heading-font",
         rel: "stylesheet",
         type: "text/css",
-        href: `https://fonts.googleapis.com/css2?family=${k.replace(
+        href: `https://fonts.googleapis.com/css2?family=${w.replace(
           / /g,
           "+"
         )}:wght@300;400;500;600;700;800;900&display=swap`,
         media: "all"
       }
     ),
-    B && k !== B && /* @__PURE__ */ o.jsx(
+    B && w !== B && /* @__PURE__ */ o.jsx(
       "link",
       {
         id: "body-font",
@@ -804,93 +820,93 @@ const mn = () => {
         media: "all"
       }
     ),
-    k && /* @__PURE__ */ o.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${k}",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";}` })
+    w && /* @__PURE__ */ o.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${w}",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;
-}, jn = (e) => {
+}, Dn = (e) => {
   const t = {};
   return Object.keys(e).forEach((n) => {
-    ee(e[n]) && e[n].startsWith(de) && (t[n] = e[n].replace(de, "").split(","));
+    te(e[n]) && e[n].startsWith(de) && (t[n] = e[n].replace(de, "").split(","));
   }), t;
-}, Cn = Ue((e) => {
-  const t = e.replace(Se, "").split(",");
-  return qt(t[0], t[1]);
+}, In = qe((e) => {
+  const t = e.replace(Ne, "").split(",");
+  return Yt(t[0], t[1]);
 });
-function Bn(e, t) {
+function Sn(e, t) {
   return y(e, `${t}_attrs`, {});
 }
-function Dn(e) {
+function _n(e) {
   const t = {};
   return Object.keys(e).forEach((n) => {
-    if (ee(e[n]) && e[n].startsWith(Se)) {
-      const r = Cn(e[n]);
+    if (te(e[n]) && e[n].startsWith(Ne)) {
+      const a = In(e[n]);
       t[n] = {
-        className: r,
+        className: a,
         "data-style-prop": n,
         "data-block-parent": e._id,
         "data-style-id": `${n}-${e._id}`,
-        ...Bn(e, n)
+        ...Sn(e, n)
       };
     }
   }), t;
 }
-function In(e, t) {
+function An(e, t) {
   const n = y(e, "_bindings", {});
-  return N(n) ? { ...e } : (We(n, (r, a) => {
-    ee(r) && y(t, r, null) && (e[a] = y(t, r, null));
+  return A(n) ? { ...e } : (G(n, (a, r) => {
+    te(a) && y(t, a, null) && (e[r] = y(t, a, null));
   }), e);
 }
-function X({ blocks: e }) {
-  const [t] = ne(), n = K((i) => Dn(i), []), [r] = Vt(), [a] = C(F);
+function ee({ blocks: e }) {
+  const [t] = ne(), n = q((i) => _n(i), []), [a] = Ee(), [r] = C(F);
   return /* @__PURE__ */ o.jsx(o.Fragment, { children: M.Children.toArray(
     e.map((i, c) => {
-      if (a === i._id)
+      if (r === i._id)
         return null;
-      const s = jn(i), l = {};
-      N(s) || Object.keys(s).forEach((g) => {
+      const s = Dn(i), l = {};
+      A(s) || Object.keys(s).forEach((g) => {
         l[g] = M.Children.toArray(
-          s[g].map((k) => /* @__PURE__ */ o.jsx(X, { blocks: [qe(t, { _id: k })] }))
+          s[g].map((w) => /* @__PURE__ */ o.jsx(ee, { blocks: [ye(t, { _id: w })] }))
         );
       });
-      const d = ye(t, { _parent: i._id });
-      l.children = d.length ? /* @__PURE__ */ o.jsx(X, { blocks: d }) : null;
-      const p = Kt(i._type), m = y(p, "builderComponent", y(p, "component", null));
-      return Ke(m) ? /* @__PURE__ */ o.jsx("noscript", { children: `<!-- ${i == null ? void 0 : i._type} not registered -->` }) : /* @__PURE__ */ o.jsx(ge, { children: M.createElement(m, {
+      const d = ke(t, { _parent: i._id });
+      l.children = d.length ? /* @__PURE__ */ o.jsx(ee, { blocks: d }) : null;
+      const p = Jt(i._type), m = y(p, "builderComponent", y(p, "component", null));
+      return Ve(m) ? /* @__PURE__ */ o.jsx("noscript", { children: `<!-- ${i == null ? void 0 : i._type} not registered -->` }) : /* @__PURE__ */ o.jsx(xe, { children: M.createElement(m, {
         blockProps: {
           "data-block-id": i._id,
           "data-block-type": i._type,
-          "data-dnd": fe(p, "canAcceptBlock") ? "branch" : "leaf"
+          "data-dnd": ve(p, "canAcceptBlock") ? "branch" : "leaf"
         },
         inBuilder: !0,
         index: c,
-        ...In(i, r),
+        ...An(i, a),
         ...n(i),
         ...l
       }) });
     })
   ) });
 }
-const Sn = () => {
-  const [e] = ne(), t = N(e) ? null : /* @__PURE__ */ o.jsx(Yt, { children: /* @__PURE__ */ o.jsx(X, { blocks: ye(e, (n) => N(n._parent)) }) });
-  return /* @__PURE__ */ o.jsx(Wt, { children: t });
-}, _n = (e, t) => e.querySelector(`[data-style-id="${t}"]`), Nn = () => {
-  const [e] = C(Et), [t] = je(), [n] = te(), [, r] = S(), a = Mt(), [, i] = L(), c = ie(null), s = ie(null), [l, d] = I({ width: 0, height: 0 }), p = on(l), [m, g] = I(0), [k, B] = I([]), [, f] = I([]), [, h] = C(Tt), [b, R] = T(), z = V("loading", !1);
-  j(() => {
+const Nn = () => {
+  const [e] = ne(), t = A(e) ? null : /* @__PURE__ */ o.jsx(Gt, { children: /* @__PURE__ */ o.jsx(ee, { blocks: ke(e, (n) => A(n._parent)) }) });
+  return /* @__PURE__ */ o.jsx(Vt, { children: t });
+}, En = (e, t) => e.querySelector(`[data-style-id="${t}"]`), Mn = () => {
+  const [e] = C(ct), [t] = Be(), [n] = oe(), [, a] = S(), r = dt(), [, i] = L(), c = re(null), s = re(null), [l, d] = I({ width: 0, height: 0 }), p = an(l), [m, g] = I(0), [w, B] = I([]), [, f] = I([]), [, h] = C(pt), [b, $] = T(), z = V("loading", !1);
+  k(() => {
     const { clientWidth: u, clientHeight: x } = s.current;
     d({ width: u, height: x }), m === 0 && g(u);
   }, [s, n, m]);
   const D = (u, x = 0) => {
-    const { top: A } = u.getBoundingClientRect();
-    return A + x >= 0 && A - x <= window.innerHeight;
+    const { top: N } = u.getBoundingClientRect();
+    return N + x >= 0 && N - x <= window.innerHeight;
   };
-  j(() => {
+  k(() => {
     var u, x;
-    if (a && a.type !== "Multiple" && c.current) {
-      const A = Le(c.current.contentDocument, a._id);
-      A && (D(A) || (x = (u = c.current) == null ? void 0 : u.contentWindow) == null || x.scrollTo({ top: A.offsetTop, behavior: "smooth" }), B([A]));
+    if (r && r.type !== "Multiple" && c.current) {
+      const N = Pe(c.current.contentDocument, r._id);
+      N && (D(N) || (x = (u = c.current) == null ? void 0 : u.contentWindow) == null || x.scrollTo({ top: N.offsetTop, behavior: "smooth" }), B([N]));
     }
-  }, [a]), j(() => {
-    if (!N(b) && c.current) {
-      const u = _n(
+  }, [r]), k(() => {
+    if (!A(b) && c.current) {
+      const u = En(
         c.current.contentDocument,
         W(b).id
       );
@@ -898,8 +914,8 @@ const Sn = () => {
     } else
       f([null]);
   }, [b]);
-  const v = Pe(() => {
-    let u = nn;
+  const v = ge(() => {
+    let u = rn;
     return e === "offline" && (u = u.replace(
       "https://old.chaibuilder.com/offline/tailwind.cdn.js",
       "/offline/tailwind.cdn.js"
@@ -909,14 +925,14 @@ const Sn = () => {
     "div",
     {
       onClick: () => {
-        r([]), R([]);
+        a([]), $([]);
       },
       onMouseLeave: () => setTimeout(() => i(""), 300),
       className: "relative mx-auto h-full w-full overflow-hidden",
-      style: m > 0 && !N(p) ? { width: t ? "100%" : m } : {},
+      style: m > 0 && !A(p) ? { width: t ? "100%" : m } : {},
       ref: s,
       children: /* @__PURE__ */ o.jsxs(
-        rn,
+        cn,
         {
           contentDidMount: () => h(c.current),
           ref: c,
@@ -925,16 +941,16 @@ const Sn = () => {
           className: "relative mx-auto box-content h-full max-w-full shadow-lg transition-all duration-300 ease-linear",
           initialContent: v,
           children: [
-            /* @__PURE__ */ o.jsx(vn, {}),
+            /* @__PURE__ */ o.jsx(wn, {}),
             /* @__PURE__ */ o.jsx(
-              kn,
+              Cn,
               {
-                block: a,
-                selectedBlockElement: W(k)
+                block: r,
+                selectedBlockElement: W(w)
               }
             ),
-            /* @__PURE__ */ o.jsx(wn, { model: "page" }),
-            /* @__PURE__ */ o.jsx(yn, { children: z ? /* @__PURE__ */ o.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ o.jsx(De, { className: "h-full" }) }) : /* @__PURE__ */ o.jsx(Sn, {}) }),
+            /* @__PURE__ */ o.jsx(Bn, { model: "page" }),
+            /* @__PURE__ */ o.jsx(kn, { children: z ? /* @__PURE__ */ o.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ o.jsx(we, { className: "h-full" }) }) : /* @__PURE__ */ o.jsx(Nn, {}) }),
             /* @__PURE__ */ o.jsx("br", {}),
             /* @__PURE__ */ o.jsx("div", { id: "placeholder", className: "absolute z-[99999] max-w-full bg-green-500 transition-transform" })
           ]
@@ -942,10 +958,10 @@ const Sn = () => {
       )
     }
   );
-}, Ao = () => /* @__PURE__ */ o.jsxs("div", { className: "flex h-full w-full flex-col", children: [
-  /* @__PURE__ */ o.jsx(tn, {}),
-  /* @__PURE__ */ o.jsx("div", { className: "relative h-full 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__ */ o.jsx(ge, { fallback: /* @__PURE__ */ o.jsx(De, { className: "h-full" }), children: /* @__PURE__ */ o.jsx(Jt, { children: /* @__PURE__ */ o.jsx(Nn, {}) }) }) })
+}, Lo = () => /* @__PURE__ */ o.jsxs("div", { className: "flex h-full w-full flex-col", children: [
+  /* @__PURE__ */ o.jsx(sn, {}),
+  /* @__PURE__ */ o.jsx("div", { className: "relative h-full 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__ */ o.jsx(xe, { fallback: /* @__PURE__ */ o.jsx(we, { className: "h-full" }), children: /* @__PURE__ */ o.jsx(ut, { children: /* @__PURE__ */ o.jsx(Mn, {}) }) }) })
 ] });
 export {
-  Ao as default
+  Lo as default
 };