@chaibuilder/sdk 1.2.43 → 1.2.45

package/dist/CanvasArea-a3WMBMi3.js

@@ -1,1199 +0,0 @@
-var Pe = Object.defineProperty;
-var He = (o, s, e) => s in o ? Pe(o, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[s] = e;
-var _ = (o, s, e) => (He(o, typeof s != "symbol" ? s + "" : s, e), e);
-import { j as r } from "./jsx-runtime-WbnYoNE9.js";
-import A, { createElement as se, useCallback as H, useState as j, useEffect as k, Component as ue, Children as Oe, Suspense as he, useRef as ne, useMemo as ze } from "react";
-import { map as P, includes as oe, toUpper as Y, round as Ue, noop as T, has as Q, throttle as me, isEmpty as D, first as U, omit as We, pick as qe, get as f, isString as G, memoize as Ke, each as Ye, find as Je, filter as ge, isNull as Qe } from "lodash-es";
-import { ResetIcon as re, MobileIcon as ie, LaptopIcon as Ze, DesktopIcon as Xe, DotsVerticalIcon as Ge, EraserIcon as Ve, ZoomInIcon as et, DragHandleDots2Icon as tt, ArrowUpIcon as st, CopyIcon as nt, TrashIcon as ot } from "@radix-ui/react-icons";
-import { j as fe, B as W, v as xe, aq as ve, ar as $e, as as rt, at as it, au as at, o as V, X as lt, h as L, av as ct, aw as dt, ax as pt, ay as ut, az as ht, aA as mt, aB as gt, L as C, Y as N, A as ft, a as xt, b as vt, c as $t, d as yt, e as bt, f as kt, g as wt, a3 as jt, aC as Ct, p as ye, ap as z, m as Bt, aD as Dt, z as M, Q as It, aE as R, aF as St, i as ee, w as be, E as ke, H as we, V as _t, aG as At, aH as je, aI as Nt, aJ as Mt, F as Et, aK as Tt, aL as Lt, aM as Rt, M as Ft, aN as Pt, ah as Ce, a2 as Ht } from "./ChaiBuilderEditor-yf2LRjL1.js";
-import { useTranslation as q } from "react-i18next";
-import { useAtom as y } from "jotai";
-import { SparklesIcon as Ot } from "lucide-react";
-import ae from "react-dom";
-import b from "prop-types";
-import { Quill as zt } from "react-quill";
-import { useFeature as Be } from "flagged";
-import { flip as Ut } from "@floating-ui/dom";
-import { useFloating as Wt, shift as qt } from "@floating-ui/react-dom";
-import { useResizeObserver as Kt } from "@react-hookz/web";
-import Yt from "@tailwindcss/typography";
-import Jt from "@tailwindcss/forms";
-import Qt from "@tailwindcss/aspect-ratio";
-import Zt from "tailwindcss-palette-generator";
-import { Provider as Xt } from "react-wrap-balancer";
-import { twMerge as Gt } from "tailwind-merge";
-import { S as le, a as De } from "./STRINGS--j49GZJP.js";
-import { getBlockComponent as Vt } from "@chaibuilder/runtime";
-import { u as es } from "./useCanvasSettings-tkzd9Qrw.js";
-import "./_commonjsHelpers-UyOWmZb0.js";
-import "clsx";
-import "@radix-ui/react-scroll-area";
-import "i18next";
-import "./Functions-7jnEwJyw.js";
-import "./MODIFIERS-cBT31iqE.js";
-import "@radix-ui/react-toggle";
-import "class-variance-authority";
-import "./Class-6Hz2KzYb.js";
-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-tabs";
-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 "react-hotkeys-hook";
-const ts = () => {
-  const { hasUndo: o, hasRedo: s, undo: e, redo: t } = fe();
-  return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ r.jsx(W, { disabled: !o(), size: "sm", onClick: e, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(re, {}) }),
-    /* @__PURE__ */ r.jsx(W, { disabled: !s(), onClick: t, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(re, { className: "rotate-180 scale-y-[-1] transform" }) })
-  ] });
-};
-function ss() {
-  const [o, s] = xe(), { t: e } = q();
-  return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ r.jsx(ve, { htmlFor: "dark-mode-switch", children: e("dark_mode") }),
-    /* @__PURE__ */ r.jsxs(
-      $e,
-      {
-        id: "dark-mode-switch",
-        checked: o,
-        onCheckedChange: () => {
-          s(!o);
-        },
-        className: `${o ? "bg-violet-600" : "bg-violet-300"}
-          relative ml-2 inline-flex h-[20px] w-[40px] shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus-visible:ring-2  focus-visible:ring-white focus-visible:ring-opacity-75`,
-        children: [
-          /* @__PURE__ */ r.jsx("span", { className: "sr-only", children: e("use_setting") }),
-          /* @__PURE__ */ r.jsx(
-            "span",
-            {
-              "aria-hidden": "true",
-              className: `${o ? "translate-x-5" : "translate-x-0"}
-            pointer-events-none -mt-px inline-block h-[18px] w-[20px] transform rounded-full bg-white shadow-lg ring-0 transition duration-200 ease-in-out`
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-const ce = ({ landscape: o = !1 }) => /* @__PURE__ */ r.jsxs(
-  "svg",
-  {
-    className: o ? "rotate-90" : "",
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 13 13",
-    xmlSpace: "preserve",
-    width: 13,
-    height: 13,
-    children: [
-      /* @__PURE__ */ r.jsx("g", { strokeWidth: 0 }),
-      /* @__PURE__ */ r.jsx("g", { strokeLinecap: "round", strokeLinejoin: "round" }),
-      /* @__PURE__ */ r.jsx(
-        "path",
-        {
-          d: "M10.65 0H2.349a.851.851 0 0 0-.851.852v11.299c0 .47.382.852.851.852h8.3a.851.851 0 0 0 .851-.852V.852A.851.851 0 0 0 10.65 0zM6.599 12.466a.367.367 0 1 1 0-.735.367.367 0 0 1 0 .735zm3.9-1.267H2.5V1h8.001v10.199z",
-          style: {
-            fill: "#000"
-          }
-        }
-      )
-    ]
-  }
-), ns = [
-  {
-    title: "mobile_xs_title",
-    content: "mobile_xs_content",
-    breakpoint: "xs",
-    icon: /* @__PURE__ */ r.jsx(ie, {}),
-    width: 400
-  },
-  {
-    title: "mobile_sm_title",
-    content: "mobile_sm_content",
-    breakpoint: "sm",
-    icon: /* @__PURE__ */ r.jsx(ie, { className: "rotate-90" }),
-    width: 640
-  },
-  {
-    title: "tablet_md_title",
-    content: "tablet_md_content",
-    breakpoint: "md",
-    icon: /* @__PURE__ */ r.jsx(ce, {}),
-    width: 800
-  },
-  {
-    title: "tablet_lg_title",
-    content: "tablet_lg_content",
-    breakpoint: "lg",
-    icon: /* @__PURE__ */ r.jsx(ce, { landscape: !0 }),
-    width: 1024
-  },
-  {
-    title: "desktop_xl_title",
-    content: "desktop_xl_content",
-    breakpoint: "xl",
-    icon: /* @__PURE__ */ r.jsx(Ze, {}),
-    width: 1420
-  },
-  {
-    title: "large_desktop_2xl_title",
-    content: "large_desktop_2xl_content",
-    breakpoint: "2xl",
-    icon: /* @__PURE__ */ r.jsx(Xe, {}),
-    width: 1920
-  }
-], de = ({
-  title: o,
-  content: s,
-  currentBreakpoint: e,
-  breakpoint: t,
-  width: n,
-  icon: d,
-  onClick: a
-}) => {
-  const { t: i } = q();
-  return /* @__PURE__ */ r.jsxs(rt, { children: [
-    /* @__PURE__ */ r.jsx(it, { asChild: !0, children: /* @__PURE__ */ r.jsx(
-      W,
-      {
-        onClick: () => a(n),
-        size: "sm",
-        variant: t === e ? "secondary" : "ghost",
-        children: d
-      }
-    ) }),
-    /* @__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(o) }),
-      /* @__PURE__ */ r.jsx("p", { className: "text-xs", children: i(s) })
-    ] }) }) })
-  ] });
-}, os = () => {
-  const [, o, s] = V(), [e, t] = lt(), { t: n } = q(), d = L("breakpoints", ns), a = (i) => {
-    e.includes(i) ? e.length > 2 && t(e.filter((l) => l !== i)) : t((l) => [...l, i]);
-  };
-  return d.length < 4 ? /* @__PURE__ */ r.jsx("div", { className: "flex items-center rounded-md", children: P(d, (i) => /* @__PURE__ */ se(de, { ...i, onClick: s, key: i.breakpoint, currentBreakpoint: o })) }) : /* @__PURE__ */ r.jsxs("div", { className: "flex items-center rounded-md", children: [
-    P(
-      d.filter((i) => oe(e, Y(i.breakpoint))),
-      (i) => /* @__PURE__ */ se(de, { ...i, onClick: s, key: i.breakpoint, currentBreakpoint: o })
-    ),
-    /* @__PURE__ */ r.jsxs(ct, { children: [
-      /* @__PURE__ */ r.jsx(dt, { asChild: !0, children: /* @__PURE__ */ r.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ r.jsx(Ge, { className: "scale-90 transform" }) }) }),
-      /* @__PURE__ */ r.jsxs(pt, { className: "w-56 border-border text-xs", children: [
-        /* @__PURE__ */ r.jsx(ut, { children: n("Breakpoints") }),
-        /* @__PURE__ */ r.jsx(ht, {}),
-        P(d, (i) => /* @__PURE__ */ r.jsx(
-          mt,
-          {
-            disabled: i.breakpoint === "xs",
-            onCheckedChange: () => a(Y(i.breakpoint)),
-            checked: oe(e, Y(i.breakpoint)),
-            children: n(i.title)
-          },
-          i.breakpoint
-        ))
-      ] })
-    ] })
-  ] });
-}, rs = () => {
-  const { t: o } = q(), { setNewBlocks: s } = gt(), [, e] = C(), [, t] = N(), n = H(() => {
-    s([]), e([]), t([]);
-  }, [s]);
-  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(W, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
-      /* @__PURE__ */ r.jsx(Ve, {}),
-      " ",
-      o("clear")
-    ] }) }),
-    /* @__PURE__ */ r.jsxs(vt, { className: "border-border", children: [
-      /* @__PURE__ */ r.jsxs($t, { children: [
-        /* @__PURE__ */ r.jsx(yt, { children: o("clear_canvas_title") }),
-        /* @__PURE__ */ r.jsx(bt, { children: o("clear_canvas_description") })
-      ] }),
-      /* @__PURE__ */ r.jsxs(kt, { children: [
-        /* @__PURE__ */ r.jsx(wt, { children: o("cancel") }),
-        /* @__PURE__ */ r.jsx(jt, { onClick: n, children: o("yes") })
-      ] })
-    ] })
-  ] }) });
-}, is = () => {
-  const [o, s] = y(Ct);
-  return L("askAiCallBack", null) ? /* @__PURE__ */ r.jsxs("div", { className: "flex items-center space-x-2", children: [
-    /* @__PURE__ */ r.jsxs(ve, { htmlFor: "ai-assistant", className: "flex items-center gap-x-1 text-sm text-yellow-600", children: [
-      /* @__PURE__ */ r.jsx(Ot, { className: "w-4" }),
-      "AI Assistant"
-    ] }),
-    /* @__PURE__ */ r.jsx(
-      $e,
-      {
-        className: "scale-90",
-        checked: o,
-        onCheckedChange: (t) => {
-          s(t);
-        },
-        id: "ai-assitantt"
-      }
-    )
-  ] }) : null;
-}, as = () => {
-  const o = L("darkMode", !1), [s] = ye();
-  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: [
-      o ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-        /* @__PURE__ */ r.jsx(ss, {}),
-        /* @__PURE__ */ r.jsx(z, { orientation: "vertical" })
-      ] }) : null,
-      /* @__PURE__ */ r.jsx(os, {}),
-      /* @__PURE__ */ r.jsx(z, { orientation: "vertical" }),
-      /* @__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(et, { className: "h-3.5 w-3.5 flex-shrink-0" }),
-        " ",
-        /* @__PURE__ */ r.jsxs("div", { className: "text-xs leading-3", children: [
-          Ue(s, 0),
-          "%"
-        ] })
-      ] }),
-      /* @__PURE__ */ r.jsx(z, { orientation: "vertical" }),
-      /* @__PURE__ */ r.jsx(ts, {})
-    ] }),
-    /* @__PURE__ */ r.jsxs("div", { className: "flex h-full items-center space-x-2", children: [
-      /* @__PURE__ */ r.jsx(rs, {}),
-      /* @__PURE__ */ r.jsx(z, { orientation: "vertical" }),
-      /* @__PURE__ */ r.jsx(is, {})
-    ] })
-  ] });
-}, ls = `<!doctype html>
-<html lang="en" dir="__HTML_DIR__" class="scroll-smooth h-full overflow-y-auto">
-  <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio"><\/script>
-    <style>
-    html { height: 100%; overflow:auto; }
-    body { height: 100%; }
-    .air-highlight{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}
-    .air-highlight-multi{ outline: 1px solid #29e503 !important; outline-offset: -1px;}
-    body{   -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none;
-            -moz-user-select: none;-ms-user-select: none; user-select: none; }
-    html{
-      -ms-overflow-style: none;  /* IE and Edge */
-        scrollbar-width: none;  /* Firefox */
-    }
-    /** IMPORTANT: Make fields content editable in SAFARI */
-    [contenteditable] {-webkit-user-select: text;user-select: text;}
-
-    html::-webkit-scrollbar { width: 0 !important }
-    .aspect-auto{aspect-ratio: auto;}
-    .aspect-square{aspect-ratio: 1/1;}
-    .aspect-video{aspect-ratio: 16/9;}
-    .dragging [data-dnd="leaf"] { pointer-events: none; } .dragging [data-dnd="leaf"] * { pointer-events: none; }
-    .dragging [data-dnd="ignore"], .dragging [data-dnd="ignore"] * { pointer-events: none; }
-    a{ pointer-events: none !important; }
-    [contenteditable="true"], [contenteditable="true"] * { cursor: text !important; }
-    [contenteditable="true"] {
-        outline: none;
-        box-shadow: 0 0 0px 4px rgba(36, 150, 255, 0.2);
-        -webkit-user-select: text;
-        -moz-user-select: text;
-        user-select: text;
-    }
-    .frame-root .frame-content { height: 100%; }
-    </style>    
-    <style id="hidden-blocks"></style>
-    <style id="selected-block"></style>
-    <style id="selected-styling-block"></style>
-    <style id="highlighted-block"></style>
-    <style id="dragged-block"></style>
-
-  </head>
-  <body class="font-body antialiased h-full">
-    <div class="frame-root h-full"></div>
-    <script src="https://cdn.jsdelivr.net/npm/quill@2.0.0/dist/quill.js"><\/script>
-  </body>
-</html>`, cs = (o) => {
-  const [s] = V(), [, e] = ye(), [t, n] = j({}), d = H(() => {
-    const { width: a, height: i } = o;
-    if (a < s) {
-      const l = parseFloat((a / s).toFixed(2).toString());
-      let c = {};
-      const p = i * l;
-      i && (c = {
-        // Eureka! This is the formula to calculate the height of the scaled element. Thank you ChatGPT 4
-        height: 100 + (i - p) / p * 100 + "%"
-      }), n({
-        position: "relative",
-        top: 0,
-        transform: `scale(${l})`,
-        transformOrigin: "top left",
-        ...c,
-        maxWidth: "none"
-      }), e(l * 100);
-    } else
-      n({}), e(100);
-  }, [s, o, e]);
-  return k(() => {
-    d();
-  }, [s, o, e, d]), t;
-};
-let Ie, Se;
-typeof document < "u" && (Ie = document);
-typeof window < "u" && (Se = window);
-const _e = A.createContext({ document: Ie, window: Se }), K = () => A.useContext(_e), { Provider: ds, Consumer: Rn } = _e;
-class Ae extends ue {
-  componentDidMount() {
-    this.props.contentDidMount();
-  }
-  componentDidUpdate() {
-    this.props.contentDidUpdate();
-  }
-  render() {
-    return Oe.only(this.props.children);
-  }
-}
-_(Ae, "propTypes", {
-  children: b.element.isRequired,
-  contentDidMount: b.func.isRequired,
-  contentDidUpdate: b.func.isRequired
-});
-class Z extends ue {
-  constructor(e, t) {
-    super(e, t);
-    _(this, "setRef", (e) => {
-      this.nodeRef.current = e;
-      const { forwardedRef: t } = this.props;
-      typeof t == "function" ? t(e) : t && (t.current = e);
-    });
-    _(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
-    _(this, "loadCheck", () => setInterval(() => {
-      this.handleLoad();
-    }, 500));
-    this._isMounted = !1, this.nodeRef = A.createRef(), this.state = { iframeLoaded: !1 };
-  }
-  componentDidMount() {
-    this._isMounted = !0, this.getDoc() && this.nodeRef.current.contentWindow.addEventListener("DOMContentLoaded", this.handleLoad);
-  }
-  componentWillUnmount() {
-    this._isMounted = !1, this.nodeRef.current.removeEventListener("DOMContentLoaded", this.handleLoad);
-  }
-  getDoc() {
-    return this.nodeRef.current ? this.nodeRef.current.contentDocument : null;
-  }
-  getMountTarget() {
-    const e = this.getDoc();
-    return this.props.mountTarget ? e.querySelector(this.props.mountTarget) : e.body.children[0];
-  }
-  renderFrameContents() {
-    if (!this._isMounted)
-      return null;
-    const e = this.getDoc();
-    if (!e)
-      return null;
-    const t = this.props.contentDidMount, n = this.props.contentDidUpdate, d = e.defaultView || e.parentView, a = /* @__PURE__ */ r.jsx(Ae, { contentDidMount: t, contentDidUpdate: n, children: /* @__PURE__ */ r.jsx(ds, { value: { document: e, window: d }, children: /* @__PURE__ */ r.jsx("div", { className: "frame-content", children: this.props.children }) }) }), i = this.getMountTarget();
-    return [ae.createPortal(this.props.head, this.getDoc().head), ae.createPortal(a, i)];
-  }
-  render() {
-    const e = {
-      ...this.props,
-      srcDoc: this.props.initialContent,
-      children: void 0
-      // The iframe isn't ready so we drop children from props here. #12, #17
-    };
-    return delete e.head, delete e.initialContent, delete e.mountTarget, delete e.contentDidMount, delete e.contentDidUpdate, delete e.forwardedRef, /* @__PURE__ */ r.jsx("iframe", { ...e, ref: this.setRef, onLoad: this.handleLoad, children: this.state.iframeLoaded && this.renderFrameContents() });
-  }
-}
-// React warns when you render directly into the body since browser extensions
-// 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.
-_(Z, "propTypes", {
-  style: b.object,
-  // eslint-disable-line
-  head: b.node,
-  initialContent: b.string,
-  mountTarget: b.string,
-  contentDidMount: b.func,
-  contentDidUpdate: b.func,
-  children: b.oneOfType([b.element, b.arrayOf(b.element)])
-}), _(Z, "defaultProps", {
-  style: {},
-  head: null,
-  children: void 0,
-  mountTarget: void 0,
-  contentDidMount: () => {
-  },
-  contentDidUpdate: () => {
-  },
-  initialContent: '<!DOCTYPE html><html><head></head><body><div class="frame-root"></div></body></html>'
-});
-const ps = A.forwardRef((o, s) => /* @__PURE__ */ r.jsx(Z, { ...o, forwardedRef: s })), us = () => {
-  const { addCoreBlock: o } = Bt(), s = L("getExternalPredefinedBlock", T);
-  return H(
-    async (e) => {
-      const { block: t, dropTargetId: n, relativeIndex: d } = e;
-      if (Q(t, "format")) {
-        const a = await s(t);
-        return o({ blocks: a }, n === 0 ? null : n, d);
-      }
-      return o(t, n === 0 ? null : n, d);
-    },
-    [o]
-  );
-};
-let B = null, O = [], F = null, Ne = null;
-function hs(o) {
-  const s = window.getComputedStyle(o), e = parseInt(s.paddingLeft, 10), t = parseInt(s.paddingTop, 10), n = parseInt(s.paddingRight, 10), d = parseInt(s.paddingBottom, 10);
-  return { paddingLeft: e, paddingTop: t, paddingRight: n, paddingBottom: d };
-}
-const pe = (o, s, e) => {
-  if (!B)
-    return;
-  const t = o.getBoundingClientRect(), n = B == null ? void 0 : B.getElementById("placeholder"), { paddingLeft: d, paddingTop: a, paddingRight: i, paddingBottom: l } = hs(o);
-  n.style.width = s === "vertical" ? t.width - d - i + "px" : "2px", n.style.height = s === "vertical" ? "2px" : t.height - a - l + "px", n.style.display = "block";
-  const c = O.reduce(
-    (p, m) => Math.abs(m - e) < Math.abs(p - e) ? m : p
-  );
-  Ne = O.indexOf(c), s === "vertical" ? (n.style.top = o.offsetTop + c + "px", n.style.left = o.offsetLeft + d + "px") : (n.style.top = o.offsetTop + a + "px", n.style.left = o.offsetLeft + c + "px");
-}, ms = (o) => {
-  const s = Me(o), e = window.getComputedStyle(o), t = s === "horizontal", n = parseInt(e.paddingLeft), d = parseInt(e.paddingTop);
-  let a = t ? n : d;
-  O = [a], Array.from(o.children).forEach((i) => {
-    const l = window.getComputedStyle(i), c = parseInt(
-      t ? l.marginLeft + l.marginRight : l.marginTop + l.marginBottom
-    ), p = t ? i.offsetWidth : i.offsetHeight;
-    O.push(a + p + c), a += p + c;
-  });
-};
-function Me(o) {
-  const s = window.getComputedStyle(o).display, e = window.getComputedStyle(o).flexDirection;
-  if (s === "flex")
-    return e === "column" || e === "column-reverse" ? "vertical" : "horizontal";
-  if (s === "grid") {
-    const t = window.getComputedStyle(o).gridTemplateRows, n = window.getComputedStyle(o).gridTemplateColumns;
-    if (t.includes("auto"))
-      return "vertical";
-    if (n.includes("auto"))
-      return "horizontal";
-  }
-  return s === "block" ? "vertical" : "horizontal";
-}
-const gs = me((o) => {
-  const s = o.target, e = Me(s);
-  if (e === "vertical") {
-    const t = o.clientY - s.offsetTop;
-    pe(s, e, t);
-  } else {
-    const t = o.clientX - s.offsetLeft;
-    pe(s, e, t);
-  }
-}, 200), fs = (o) => {
-  o.preventDefault(), o.stopPropagation(), gs(o);
-};
-function J() {
-  const o = B == null ? void 0 : B.getElementById("placeholder");
-  o.style.display = "none";
-}
-const xs = () => {
-  const { document: o } = K(), [s, e] = y(Dt), t = us(), n = Be("dnd"), [, d] = M(), [, a] = C();
-  return B = o, {
-    isDragging: s,
-    "data-dnd": "branch",
-    onDragOver: n ? fs : T,
-    onDrop: n ? (i) => {
-      F == null || F.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
-      const l = JSON.parse(i.dataTransfer.getData("text/plain"));
-      let c = i.target.getAttribute("data-block-id");
-      c === null && (c = i.target.parentElement.getAttribute("data-block-id")), t({ block: l, dropTargetId: c || null, relativeIndex: Ne }), e(!1), J(), setTimeout(() => {
-        J();
-      }, 300);
-    } : T,
-    onDragEnter: n ? (i) => {
-      const l = i;
-      F = l.target, l.stopPropagation(), l.preventDefault(), O = [];
-      const c = l.target;
-      ms(c), c.classList.add("outline", "outline-green-300", "outline-2", "-outline-offset-2"), e(!0), d(""), a([]);
-    } : T,
-    onDragLeave: n ? (i) => {
-      const l = i;
-      F = null, l.stopPropagation(), l.preventDefault(), l.target.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
-    } : T,
-    onMouseOut: n ? () => {
-      e(!1), J();
-    } : T
-  };
-};
-function te(o) {
-  return o.getAttribute("data-block-id") ? o : o.closest("[data-block-id]");
-}
-function vs(o) {
-  o.container.innerHTML = "", o.container.parentNode.removeChild(o.container);
-  var s = document.querySelector(".ql-toolbar");
-  s && s.parentNode.removeChild(s), o = null;
-}
-const $s = () => {
-  const o = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], s = It(), [, e] = M(), [t, n] = y(R);
-  return (d) => {
-    var m;
-    if (t)
-      return;
-    const a = te(d.target), i = a.getAttribute("data-block-type");
-    if (!i || !o.includes(i))
-      return;
-    const l = a.cloneNode(!0);
-    a.style.display = "none", Array.from(l.attributes).forEach((h) => {
-      h.name !== "class" && l.removeAttribute(h.name);
-    }), i === "Text" && (l.style.display = "inline-block"), a.parentNode.insertBefore(l, a.nextSibling);
-    const c = new zt(l, { placeholder: "Type here..." });
-    function p() {
-      const h = c.getText(0, c.getLength());
-      s([a.getAttribute("data-block-id")], { content: h }), a.removeAttribute("style"), l.removeEventListener("blur", p, !0), vs(c), n(""), e("");
-    }
-    l.addEventListener("blur", p, !0), l.addEventListener("keydown", (h) => {
-      (h.key === "Enter" || h.key === "Escape") && p();
-    }), c.focus(), (m = l.querySelector(".ql-clipboard")) == null || m.remove(), n(a.getAttribute("data-block-id"));
-  };
-}, ys = () => {
-  const [, o] = N(), [, s] = C(), [, e] = M(), [t] = y(R), [n] = y(St);
-  return (d) => {
-    if (t)
-      return;
-    n.closeAll(), d.stopPropagation();
-    const a = te(d.target);
-    if (a != null && a.getAttribute("data-block-id") && (a == null ? void 0 : a.getAttribute("data-block-id")) === "container") {
-      s([]), o([]), e("");
-      return;
-    }
-    if (a != null && a.getAttribute("data-block-parent")) {
-      const i = a.getAttribute("data-style-prop"), l = a.getAttribute("data-style-id"), c = a.getAttribute("data-block-parent");
-      o([{ id: l, prop: i, blockId: c }]), s([c]);
-    } else
-      a != null && a.getAttribute("data-block-id") && s([a.getAttribute("data-block-id")]);
-    e("");
-  };
-}, bs = me((o, s) => {
-  const e = te(o.target);
-  e != null && e.getAttribute("data-style-id") && s(e.getAttribute("data-style-id"));
-}, 100), ks = () => {
-  const [, o] = M(), [s] = y(R);
-  return (e) => {
-    s || bs(e, o);
-  };
-}, ws = ({ children: o }) => {
-  const { document: s } = K(), [e] = C(), [t, n] = N();
-  k(() => {
-    setTimeout(() => {
-      if (!D(t))
-        return;
-      const c = Ee(s, U(e));
-      if (c) {
-        const p = c.getAttribute("data-style-prop");
-        if (p) {
-          const m = c.getAttribute("data-style-id"), h = c.getAttribute("data-block-parent");
-          n([{ id: m, prop: p, blockId: h }]);
-        }
-      }
-    }, 100);
-  }, [s, e, n, t]);
-  const d = $s(), a = ys(), i = ks(), l = xs();
-  return /* @__PURE__ */ r.jsx(
-    "div",
-    {
-      "data-block-id": "container",
-      id: "canvas",
-      onClick: a,
-      onDoubleClick: d,
-      onMouseMove: i,
-      ...We(l, "isDragging"),
-      className: "relative mb-5 h-full max-w-full " + (l.isDragging ? "dragging" : ""),
-      children: o
-    }
-  );
-}, Ee = (o, s) => o.querySelector(`[data-block-id="${s}"]`), js = () => {
-  const { window: o } = K(), [s, e] = C(), [t] = ee(), [, n] = N(), { undo: d, redo: a } = fe(), i = be(), [, l] = ke(), c = we(), { savePage: p } = _t(), [m] = y(R), [, h] = y(At), v = (g) => {
-    g.key === "Enter" && (g.preventDefault(), s.length === 1 && h(U(s)));
-  }, w = (g) => {
-    const u = t.find(($) => $._id === g);
-    return u ? u._parent : null;
-  };
-  return k(() => {
-    const g = (u) => {
-      if (u.key === "Escape") {
-        e([]), n([]);
-        return;
-      }
-      if (v(u), !m && (u.key === "Delete" || u.key === "Backspace") && (u.preventDefault(), c(s)), u.ctrlKey || u.metaKey) {
-        if (u.key === "ArrowUp") {
-          u.preventDefault();
-          const $ = s.length > 0 ? w(s[0]) : null;
-          $ && e([$]);
-        }
-        if (["z", "y", "d", "x", "c", "p", "s", "v"].includes(u.key)) {
-          if (m && ["x", "z", "v"].includes(u.key))
-            return !0;
-          u.preventDefault();
-        }
-        u.key === "s" && (u.stopPropagation(), u.preventDefault(), p()), u.key === "z" && d(), u.key === "y" && a(), u.key === "d" && i(s);
-      }
-    };
-    return o.removeEventListener("keydown", g), o.addEventListener("keydown", g), () => {
-      o.removeEventListener("keydown", g);
-    };
-  }, [s, e, d, c, l, a, i, m, p, o]), null;
-}, Cs = ({ block: o, label: s }) => {
-  const [, e] = C(), [, t] = M(), [, n] = y(je), d = Be("dnd");
-  return /* @__PURE__ */ r.jsxs(
-    "div",
-    {
-      className: "mr-10 flex cursor-grab items-center space-x-1 px-1",
-      draggable: d ? "true" : "false",
-      onDragStart: (a) => {
-        a.dataTransfer.setData("text/plain", JSON.stringify(qe(o, ["_id", "_type"]))), n(o._id), setTimeout(() => {
-          e([]), t(null);
-        }, 200);
-      },
-      children: [
-        /* @__PURE__ */ r.jsx(tt, {}),
-        s
-      ]
-    }
-  );
-}, Bs = ({ selectedBlockElement: o, block: s }) => {
-  const e = we(), t = be(), [, n] = C(), [, d] = N(), [a] = y(R), { floatingStyles: i, refs: l, update: c } = Wt({
-    placement: "top-start",
-    middleware: [qt(), Ut()],
-    elements: {
-      reference: o
-    }
-  });
-  Kt(o, () => c(), o !== null);
-  const p = f(s, "_parent", null), m = D(f(s, "_name", "")) ? f(s, "_type", "") : f(s, "_name", "");
-  return !o || !s || a ? null : /* @__PURE__ */ r.jsx(r.Fragment, { children: /* @__PURE__ */ r.jsxs(
-    "div",
-    {
-      role: "button",
-      tabIndex: 0,
-      ref: l.setFloating,
-      style: i,
-      onClick: (h) => {
-        h.stopPropagation(), h.preventDefault();
-      },
-      onKeyDown: (h) => h.stopPropagation(),
-      className: "z-[99999] flex h-6 items-center bg-blue-500 py-2 text-xs text-white",
-      children: [
-        /* @__PURE__ */ r.jsx(Cs, { label: m, block: s }),
-        /* @__PURE__ */ r.jsxs("div", { className: "flex gap-2 px-1", children: [
-          p && /* @__PURE__ */ r.jsx(
-            st,
-            {
-              className: "hover:scale-105",
-              onClick: () => {
-                d([]), n([p]);
-              }
-            }
-          ),
-          Nt(f(s, "_type", "")) ? /* @__PURE__ */ r.jsx(nt, { className: "hover:scale-105", onClick: () => t([s == null ? void 0 : s._id]) }) : null,
-          Mt(f(s, "_type", "")) ? /* @__PURE__ */ r.jsx(ot, { className: "hover:scale-105", onClick: () => e([s == null ? void 0 : s._id]) }) : null
-        ] })
-      ]
-    }
-  ) });
-}, Ds = ({ addVariant: o, e: s }) => {
-  o("hs-dropdown-open", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-dropdown.open > .${s(`hs-dropdown-open${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-dropdown.open .hs-dropdown-toggle .${s(`hs-dropdown-open${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-dropdown.open > .hs-dropdown-menu > .${s(`hs-dropdown-open${t}${n}`)}`);
-    }
-  ]), o("hs-removing", ({ modifySelectors: e, separator: t }) => {
-    e(({ className: n }) => `.hs-removing.${s(`hs-removing${t}${n}`)}`);
-  }), o("hs-tooltip-shown", ({ modifySelectors: e, separator: t }) => {
-    e(({ className: n }) => `.hs-tooltip.show .${s(`hs-tooltip-shown${t}${n}`)}`);
-  }), o("hs-accordion-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-accordion.active.${s(`hs-accordion-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-accordion.active > .${s(`hs-accordion-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-accordion.active > .hs-accordion-toggle .${s(`hs-accordion-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-accordion.active > .hs-accordion-heading > .hs-accordion-toggle .${s(
-        `hs-accordion-active${t}${n}`
-      )}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-accordion.active > .hs-accordion-toggle.${s(`hs-accordion-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-accordion.active > .hs-accordion-heading > .hs-accordion-toggle.${s(
-        `hs-accordion-active${t}${n}`
-      )}`);
-    }
-  ]), o("hs-accordion-selected", ({ modifySelectors: e, separator: t }) => {
-    e(({ className: n }) => `.hs-accordion .selected.${s(`hs-accordion-selected${t}${n}`)}`);
-  }), o("hs-collapse-open", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-collapse.open .${s(`hs-collapse-open${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-collapse.open.${s(`hs-collapse-open${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-collapse-toggle.open .${s(`hs-collapse-open${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-collapse-toggle.open.${s(`hs-collapse-open${t}${n}`)}`);
-    }
-  ]), o("hs-tab-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `[data-hs-tab].active.${s(`hs-tab-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `[data-hs-tab].active .${s(`hs-tab-active${t}${n}`)}`);
-    }
-  ]), o("hs-overlay-open", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.open.${s(`hs-overlay-open${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.open .${s(`hs-overlay-open${t}${n}`)}`);
-    }
-  ]), o("hs-overlay-layout-open", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-overlay-body-open.${s(`hs-overlay-layout-open${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-overlay-body-open .${s(`hs-overlay-layout-open${t}${n}`)}`);
-    }
-  ]), o("hs-overlay-backdrop-open", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-overlay-backdrop.${s(`hs-overlay-backdrop-open${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.hs-overlay-backdrop .${s(`hs-overlay-backdrop-open${t}${n}`)}`);
-    }
-  ]), o("hs-scrollspy-active", ({ modifySelectors: e, separator: t }) => {
-    e(({ className: n }) => `.active.${s(`hs-scrollspy-active${t}${n}`)}`);
-  }), o("hs-carousel-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active.${s(`hs-carousel-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active .${s(`hs-carousel-active${t}${n}`)}`);
-    }
-  ]), o("hs-carousel-disabled", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.disabled.${s(`hs-carousel${t}disabled${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.disabled .${s(`hs-carousel${t}disabled${t}${n}`)}`);
-    }
-  ]), o("hs-selected", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.selected.${s(`hs-selected${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.selected .${s(`hs-selected${t}${n}`)}`);
-    }
-  ]), o("hs-select-disabled", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.disabled.${s(`hs-select-disabled${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.disabled .${s(`hs-select-disabled${t}${n}`)}`);
-    }
-  ]), o("hs-select-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active.${s(`hs-select-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active .${s(`hs-select-active${t}${n}`)}`);
-    }
-  ]), o("hs-input-number-disabled", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.disabled.${s(`hs-input-number-disabled${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.disabled .${s(`hs-input-number-disabled${t}${n}`)}`);
-    }
-  ]), o("hs-pin-input-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active.${s(`hs-pin-input-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active .${s(`hs-pin-input-active${t}${n}`)}`);
-    }
-  ]), o("hs-select-opened", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.opened.${s(`hs-select-opened${t}${n}`)}`);
-    }
-  ]), o("hs-password-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active.${s(`hs-password-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active .${s(`hs-password-active${t}${n}`)}`);
-    }
-  ]), o("hs-stepper-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active.${s(`hs-stepper-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active .${s(`hs-stepper-active${t}${n}`)}`);
-    }
-  ]), o("hs-stepper-success", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.success.${s(`hs-stepper-success${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.success .${s(`hs-stepper-success${t}${n}`)}`);
-    }
-  ]), o("hs-stepper-completed", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.completed.${s(`hs-stepper-completed${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.completed .${s(`hs-stepper-completed${t}${n}`)}`);
-    }
-  ]), o("hs-stepper-error", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.error.${s(`hs-stepper-error${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.error .${s(`hs-stepper-error${t}${n}`)}`);
-    }
-  ]), o("hs-stepper-processed", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.processed.${s(`hs-stepper-processed${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.processed .${s(`hs-stepper-processed${t}${n}`)}`);
-    }
-  ]), o("hs-stepper-disabled", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.disabled.${s(`hs-stepper-disabled${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.disabled .${s(`hs-stepper-disabled${t}${n}`)}`);
-    }
-  ]), o("hs-stepper-skipped", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.skipped.${s(`hs-stepper-skipped${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.skipped .${s(`hs-stepper-skipped${t}${n}`)}`);
-    }
-  ]), o("hs-strong-password", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.passed.${s(`hs-strong-password${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.passed .${s(`hs-strong-password${t}${n}`)}`);
-    }
-  ]), o("hs-strong-password-accepted", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.accepted.${s(`hs-strong-password-accepted${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.accepted .${s(`hs-strong-password-accepted${t}${n}`)}`);
-    }
-  ]), o("hs-strong-password-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active.${s(`hs-strong-password-active${t}${n}`)}`);
-    }
-  ]), o("hs-combo-box-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active .${s(`hs-combo-box-active${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active.${s(`hs-combo-box-active${t}${n}`)}`);
-    }
-  ]), o("hs-combo-box-selected", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.selected .${s(`hs-combo-box-selected${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.selected.${s(`hs-combo-box-selected${t}${n}`)}`);
-    }
-  ]), o("hs-combo-box-tab-active", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.active.${s(`hs-combo-box-tab-active${t}${n}`)}`);
-    }
-  ]), o("hs-apexcharts-tooltip-dark", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.dark.${s(`hs-apexcharts-tooltip-dark${t}${n}`)}`);
-    }
-  ]), o("hs-success", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.success .${s(`hs-success${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.success.${s(`hs-success${t}${n}`)}`);
-    }
-  ]), o("hs-error", [
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.error .${s(`hs-error${t}${n}`)}`);
-    },
-    ({ modifySelectors: e, separator: t }) => {
-      e(({ className: n }) => `.error.${s(`hs-error${t}${n}`)}`);
-    }
-  ]), o("hs-default-mode-active", ({ modifySelectors: e, separator: t }) => {
-    e(({ className: n }) => `.default .${s(`hs-default-mode-active${t}${n}`)}`);
-  }), o("hs-dark-mode-active", ({ modifySelectors: e, separator: t }) => {
-    e(({ className: n }) => `.dark .${s(`hs-dark-mode-active${t}${n}`)}`);
-  }), o("hs-auto-mode-active", ({ modifySelectors: e, separator: t }) => {
-    e(({ className: n }) => `.auto .${s(`hs-auto-mode-active${t}${n}`)}`);
-  });
-}, Is = ({ model: o }) => {
-  const [s] = Et(), [e] = C(), [t] = xe(), [n] = M(), [d] = N(), [a] = y(je), { document: i, window: l } = K(), [c] = j(i == null ? void 0 : i.getElementById("highlighted-block")), [p] = j(
-    i == null ? void 0 : i.getElementById("selected-block")
-  ), [m] = j(
-    i == null ? void 0 : i.getElementById("selected-styling-block")
-  ), [h] = j(i == null ? void 0 : i.getElementById("dragged-block"));
-  k(() => {
-    t ? i == null || i.documentElement.classList.add("dark") : i == null || i.documentElement.classList.remove("dark");
-  }, [t, i]);
-  const v = f(s, "headingFont", "DM Sans"), w = f(s, "bodyFont", "DM Sans");
-  return k(() => {
-    const g = f(s, "primaryColor", "#000"), u = f(s, "secondaryColor", "#FFF"), $ = Zt([
-      { color: g, name: "primary" },
-      { color: u, name: "secondary" }
-    ]), E = f(s, "roundedCorners", "0");
-    !l || !l.tailwind || (l.tailwind.config = {
-      darkMode: "class",
-      theme: {
-        extend: {
-          fontFamily: {
-            heading: [v],
-            body: [w]
-          },
-          borderRadius: {
-            global: `${E || "0"}px`
-          },
-          colors: $
-        }
-      },
-      plugins: [Yt, Jt, Qt, l.tailwind.plugin.withOptions(() => Ds)]
-    });
-  }, [s, l, v, w]), k(() => {
-    p && (p.textContent = `${P(e, (g) => `[data-block-id="${g}"]`).join(",")}{
-                outline: 1px solid ${e.length === 1 ? "#42a1fc" : "orange"} !important; outline-offset: -1px;
-            }`);
-  }, [e, p]), k(() => {
-    if (!a) {
-      h.textContent = "";
-      return;
-    }
-    h.textContent = `[data-block-id="${a}"]{ pointer-events: none !important; opacity: 0.2 !important}`;
-  }, [a]), k(() => {
-    c && (c.textContent = n ? `[data-style-id="${n}"]{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}` : "");
-  }, [n, e, c]), k(() => {
-    m && (m.textContent = `${P(d, ({ id: g }) => `[data-style-id="${g}"]`).join(",")}{
-                outline: 1px solid #42a1fc !important; outline-offset: -1px;
-            }`);
-  }, [d, m]), k(() => {
-    const g = f(s, "bodyTextLightColor", "#64748b"), u = f(s, "bodyTextDarkColor", "#94a3b8"), $ = f(s, "bodyBgLightColor", "#FFFFFF"), E = f(s, "bodyBgDarkColor", "#0f172a");
-    i.body.className = `font-body antialiased text-[${g}] bg-[${$}] dark:text-[${u}] dark:bg-[${E}]`;
-  }, [s, i, o]), o === "page" ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    v && /* @__PURE__ */ r.jsx(
-      "link",
-      {
-        id: "heading-font",
-        rel: "stylesheet",
-        type: "text/css",
-        href: `https://fonts.googleapis.com/css2?family=${v.replace(
-          / /g,
-          "+"
-        )}:wght@300;400;500;600;700;800;900&display=swap`,
-        media: "all"
-      }
-    ),
-    w && v !== w && /* @__PURE__ */ r.jsx(
-      "link",
-      {
-        id: "body-font",
-        rel: "stylesheet",
-        type: "text/css",
-        href: `https://fonts.googleapis.com/css2?family=${w.replace(
-          / /g,
-          "+"
-        )}:wght@300;400;500;600;700;800;900&display=swap`,
-        media: "all"
-      }
-    ),
-    v && /* @__PURE__ */ r.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${v}",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;
-}, Ss = (o) => {
-  const s = {};
-  return Object.keys(o).forEach((e) => {
-    G(o[e]) && o[e].startsWith(le) && (s[e] = o[e].replace(le, "").split(","));
-  }), s;
-}, _s = Ke((o) => {
-  const s = o.replace(De, "").split(",");
-  return Gt(s[0], s[1]);
-});
-function As(o, s) {
-  return f(o, `${s}_attrs`, {});
-}
-function Ns(o) {
-  const s = {};
-  return Object.keys(o).forEach((e) => {
-    if (G(o[e]) && o[e].startsWith(De)) {
-      const t = _s(o[e]);
-      s[e] = {
-        className: t,
-        "data-style-prop": e,
-        "data-block-parent": o._id,
-        "data-style-id": `${e}-${o._id}`,
-        ...As(o, e)
-      };
-    }
-  }), s;
-}
-function Ms(o, s) {
-  const e = f(o, "_bindings", {});
-  return D(e) ? { ...o } : (Ye(e, (t, n) => {
-    G(t) && f(s, t, null) && (o[n] = f(s, t, null));
-  }), o);
-}
-function X({ blocks: o }) {
-  const [s] = ee(), [e] = es(), t = H((i) => Ns(i), []), [n] = Tt(), [d] = y(R), a = H(
-    (i) => i.reduce((l, c) => {
-      const p = f(e, c, {});
-      return { ...l, ...p };
-    }, {}),
-    [e, s]
-  );
-  return /* @__PURE__ */ r.jsx(r.Fragment, { children: A.Children.toArray(
-    o.map((i, l) => {
-      if (d === i._id)
-        return null;
-      const c = Ss(i), p = {};
-      D(c) || Object.keys(c).forEach((u) => {
-        p[u] = A.Children.toArray(
-          c[u].map(($) => /* @__PURE__ */ r.jsx(X, { blocks: [Je(s, { _id: $ })] }))
-        );
-      });
-      const m = ge(s, { _parent: i._id });
-      p.children = m.length ? /* @__PURE__ */ r.jsx(X, { blocks: m }) : null;
-      const h = Vt(i._type), v = f(h, "builderComponent", f(h, "component", null));
-      if (Qe(v))
-        return /* @__PURE__ */ r.jsx("noscript", { children: `<!-- ${i == null ? void 0 : i._type} not registered -->` });
-      const w = Q(h, "getBlockStateFrom") ? h == null ? void 0 : h.getBlockStateFrom(i, s) : [], g = a(w);
-      return /* @__PURE__ */ r.jsx(he, { children: A.createElement(v, {
-        blockProps: {
-          "data-block-id": i._id,
-          "data-block-type": i._type,
-          "data-dnd": Q(h, "canAcceptBlock") ? "branch" : "leaf"
-        },
-        index: l,
-        ...Ms(i, n),
-        ...t(i),
-        ...p,
-        inBuilder: !0,
-        blockState: g
-      }) });
-    })
-  ) });
-}
-const Es = () => {
-  const [o] = ee(), s = D(o) ? null : /* @__PURE__ */ r.jsx(Lt, { children: /* @__PURE__ */ r.jsx(X, { blocks: ge(o, (e) => D(e._parent)) }) });
-  return /* @__PURE__ */ r.jsx(Xt, { children: s });
-}, Ts = (o, s) => o.querySelector(`[data-style-id="${s}"]`), Ls = () => {
-  const [o] = y(Rt), [s] = ke(), [e] = V(), [, t] = C(), n = Ft(), [, d] = M(), a = ne(null), i = ne(null), [l, c] = j({ width: 0, height: 0 }), p = cs(l), [m, h] = j(0), [v, w] = j([]), [, g] = j([]), [, u] = y(Pt), [$, E] = N(), Te = L("loading", !1), Le = L("htmlDir", "ltr");
-  k(() => {
-    const { clientWidth: x, clientHeight: I } = i.current;
-    c({ width: x, height: I }), m === 0 && h(x);
-  }, [i, e, m]);
-  const Re = (x, I = 0) => {
-    const { top: S } = x.getBoundingClientRect();
-    return S + I >= 0 && S - I <= window.innerHeight;
-  };
-  k(() => {
-    var x, I;
-    if (n && n.type !== "Multiple" && a.current) {
-      const S = Ee(a.current.contentDocument, n._id);
-      S && (Re(S) || (I = (x = a.current) == null ? void 0 : x.contentWindow) == null || I.scrollTo({ top: S.offsetTop, behavior: "smooth" }), w([S]));
-    }
-  }, [n]), k(() => {
-    if (!D($) && a.current) {
-      const x = Ts(
-        a.current.contentDocument,
-        U($).id
-      );
-      g(x ? [x] : [null]);
-    } else
-      g([null]);
-  }, [$]);
-  const Fe = ze(() => {
-    let x = ls;
-    return x = x.replace("__HTML_DIR__", Le), o === "offline" && (x = x.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;
-  }, [o]);
-  return /* @__PURE__ */ r.jsx(
-    "div",
-    {
-      onClick: () => {
-        t([]), E([]);
-      },
-      onMouseLeave: () => setTimeout(() => d(""), 300),
-      className: "relative mx-auto h-full w-full overflow-hidden",
-      style: m > 0 && !D(p) ? { width: s ? "100%" : m } : {},
-      ref: i,
-      children: /* @__PURE__ */ r.jsxs(
-        ps,
-        {
-          contentDidMount: () => u(a.current),
-          ref: a,
-          id: "canvas-iframe",
-          style: { width: `${e}px`, ...p },
-          className: "relative mx-auto box-content h-full max-w-full shadow-lg transition-all duration-300 ease-linear",
-          initialContent: Fe,
-          children: [
-            /* @__PURE__ */ r.jsx(js, {}),
-            /* @__PURE__ */ r.jsx(
-              Bs,
-              {
-                block: n,
-                selectedBlockElement: U(v)
-              }
-            ),
-            /* @__PURE__ */ r.jsx(Is, { model: "page" }),
-            /* @__PURE__ */ r.jsx(ws, { children: Te ? /* @__PURE__ */ r.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ r.jsx(Ce, { className: "h-full" }) }) : /* @__PURE__ */ r.jsx(Es, {}) }),
-            /* @__PURE__ */ r.jsx("br", {}),
-            /* @__PURE__ */ r.jsx("div", { id: "placeholder", className: "absolute z-[99999] max-w-full bg-green-500 transition-transform" })
-          ]
-        }
-      )
-    }
-  );
-}, Fn = () => /* @__PURE__ */ r.jsxs("div", { className: "flex h-full w-full flex-col", children: [
-  /* @__PURE__ */ r.jsx(as, {}),
-  /* @__PURE__ */ r.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__ */ r.jsx(he, { fallback: /* @__PURE__ */ r.jsx(Ce, { className: "h-full" }), children: /* @__PURE__ */ r.jsx(Ht, { children: /* @__PURE__ */ r.jsx(Ls, {}) }) }) })
-] });
-export {
-  Fn as default
-};