@chaibuilder/sdk 0.1.0 → 0.1.1

package/dist/AddBlocks-52d9b4d7.cjs

@@ -0,0 +1,3 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./jsx-runtime-5c3ac4f7.cjs"),a=require("react"),s=require("lodash"),g=require("jotai"),k=require("./accordion-0afd8143.cjs"),C=require("./scroll-area-088530b9.cjs"),y=require("./tabs-860e37aa.cjs"),E=require("./useBuilderProp-5e57d0c8.cjs"),B=require("react-dnd"),v=require("@radix-ui/react-icons"),n=require("./index-506fb888.cjs");require("react-i18next");const w=require("@chaibuilder/blocks"),N=require("lucide-react"),q=require("./utils-3c452dd0.cjs"),f=require("./textarea-a338ede6.cjs"),I=require("./label-167415e5.cjs"),P=require("./html-to-json-d8ac554d.cjs");require("@radix-ui/react-accordion");require("@radix-ui/react-scroll-area");require("@radix-ui/react-tabs");require("@radix-ui/react-slot");require("class-variance-authority");require("@radix-ui/react-tooltip");require("@radix-ui/react-toast");require("i18next");require("flagged");require("@minoru/react-dnd-treeview");require("react-hotkeys-hook");require("flat-to-nested");require("./Class-0801d193.cjs");require("redux-undo");require("@react-hookz/web");require("./CONTROLS-031e1de3.cjs");require("clsx");require("tailwind-merge");require("@radix-ui/react-label");require("himalaya");const L=({block:t})=>{const{type:r,icon:l,label:d}=t,{addCoreBlock:u,addPredefinedBlock:p}=n.useAddBlock(),[j]=n.useSelectedBlockIds(),[,x]=g.useAtom(n.activePanelAtom),[,i]=g.useAtom(n.addBlocksModalAtom),b=()=>{s.has(t,"blocks")?p(w.syncBlocksWithDefaults(t.blocks),s.first(j)):u(t,s.first(j)),i(!1),x("layers")},[,h,c]=B.useDrag(()=>({type:"CHAI_BLOCK",item:t}));return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(B.DragPreviewImage,{connect:c,src:"https://placehold.co/100x30/000000/FFF?text="+(d||r).replace(/ /g,"+")}),e.jsxRuntimeExports.jsxs(E.Tooltip,{children:[e.jsxRuntimeExports.jsx(E.TooltipTrigger,{asChild:!0,children:e.jsxRuntimeExports.jsxs("button",{onClick:b,type:"button",ref:h,className:"cursor-grab space-y-2 rounded-lg border border-border p-3 text-center hover:bg-slate-300/50",children:[a.createElement(l||v.BoxIcon,{className:"w-4 h-4 mx-auto"}),e.jsxRuntimeExports.jsx("p",{className:"truncate text-xs",children:d||r})]})}),e.jsxRuntimeExports.jsx(E.TooltipContent,{children:e.jsxRuntimeExports.jsx("p",{children:d||r})})]})]})},S=({block:t,closePopover:r})=>{var c;const[l,d]=a.useState(!1),u=E.useBuilderProp("getExternalPredefinedBlock"),{addCoreBlock:p,addPredefinedBlock:j}=n.useAddBlock(),[x]=n.useSelectedBlockIds(),[,i,b]=B.useDrag(()=>({type:"CHAI_BLOCK",item:t}),[t]),h=a.useCallback(async R=>{if(R.stopPropagation(),s.has(t,"component")){p(t,s.first(x)),r();return}d(!0);const o=await u(t);s.isEmpty(o)||j(w.syncBlocksWithDefaults(o),s.first(x)),r()},[t]);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(B.DragPreviewImage,{connect:b,src:"https://placehold.co/100x30/000000/FFF?text="+((c=t.name||t.label)==null?void 0:c.replace(" ","+"))}),e.jsxRuntimeExports.jsxs("div",{ref:i,onClick:l?()=>{}:h,className:"relative cursor-grab overflow-hidden rounded-md border border-transparent duration-200 hover:scale-x-105 hover:border-foreground/20 hover:shadow-2xl",children:[l&&e.jsxRuntimeExports.jsxs("div",{className:"absolute flex h-full w-full items-center justify-center bg-black bg-opacity-70",children:[e.jsxRuntimeExports.jsx(N.Loader,{className:"animate-spin",size:15,color:"white"})," ",e.jsxRuntimeExports.jsx("span",{className:"pl-2 text-sm text-white",children:"Adding..."})]}),t.preview?e.jsxRuntimeExports.jsx("img",{src:t.preview,className:"min-h-[50px] w-full rounded-md border border-gray-300",alt:t.name}):e.jsxRuntimeExports.jsx("div",{className:"flex h-20 items-center justify-center rounded-md border border-border border-gray-300 bg-gray-200",children:e.jsxRuntimeExports.jsx("p",{className:"max-w-xs text-center text-sm text-gray-700",children:t.name})})]})]})},M=()=>{const{data:t,isLoading:r}=n.useUILibraryBlocks(),l=w.useChaiBlocks(),d=s.filter(s.values(l),{category:"custom"}),u=s.groupBy(d,"group"),p=s.groupBy(t,"group"),[j,x]=a.useState(null),i=a.useMemo(()=>s.mergeWith(u,p,(o,m)=>{if(s.isArray(o)&&s.isArray(m))return[...o,...m]}),[u,p]),[,b]=g.useAtom(n.addBlocksModalAtom),[h,c]=a.useState("Navbar"),R=s.get(i,h,[]);return e.jsxRuntimeExports.jsxs("div",{className:"relative flex h-full max-h-full overflow-hidden py-2",children:[e.jsxRuntimeExports.jsx("ul",{className:"sticky top-0 h-full w-48 space-y-1 overflow-y-auto border-r px-2",children:r?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("li",{className:"h-8 w-full animate-pulse bg-gray-200"}),e.jsxRuntimeExports.jsx("li",{className:"mt-2 h-8 w-full animate-pulse bg-gray-200"}),e.jsxRuntimeExports.jsx("li",{className:"mt-2 h-8 w-full animate-pulse bg-gray-200"}),e.jsxRuntimeExports.jsx("li",{className:"mt-2 h-8 w-full animate-pulse bg-gray-200"}),e.jsxRuntimeExports.jsx("li",{className:"mt-2 h-8 w-full animate-pulse bg-gray-200"}),e.jsxRuntimeExports.jsx("li",{className:"mt-2 h-8 w-full animate-pulse bg-gray-200"})]}):a.Children.toArray(s.map(i,(o,m)=>e.jsxRuntimeExports.jsx("li",{onMouseOut:()=>{clearTimeout(j),x(null)},onMouseEnter:()=>{const A=setTimeout(()=>{c(m)},300);x(A)},onClick:()=>c(m),className:q.cn("-mx-2 cursor-default rounded-md rounded-r-none px-2 py-1 text-sm font-medium capitalize",h===m?"bg-blue-500 text-white":" text-gray-700 hover:bg-foreground/10"),children:m})))}),e.jsxRuntimeExports.jsx("div",{className:"h-full w-full space-y-2 overflow-y-auto px-8",children:a.Children.toArray(R.map(o=>e.jsxRuntimeExports.jsx(S,{block:o,closePopover:()=>b(!1)})))})]})},F=()=>{const[t,r]=a.useState(""),{addPredefinedBlock:l}=n.useAddBlock(),[d]=n.useSelectedBlockIds(),[,u]=g.useAtom(n.addBlockOffCanvasAtom),[,p]=g.useAtom(n.activePanelAtom),[,j]=g.useAtom(n.addBlocksModalAtom),x=()=>{const i=P.getBlocksFromHTML(t);l([...i],s.first(d)||null),r(""),u(!1),p("layers"),j(!1)};return e.jsxRuntimeExports.jsxs(f.Card,{className:"border-border/0 p-0 shadow-none",children:[e.jsxRuntimeExports.jsxs(f.CardHeader,{className:"p-3",children:[e.jsxRuntimeExports.jsx(f.CardTitle,{children:"Import HTML"}),e.jsxRuntimeExports.jsx(f.CardDescription,{children:"Use HTML snippets from component libraries like Tailwind UI, Flowbite, Preline, Kitwind, Tailblocks etc. or just copy paste your own HTML code. Only Tailwind CSS markup is supported."})]}),e.jsxRuntimeExports.jsx(f.CardContent,{className:"space-y-2 px-3 py-0",children:e.jsxRuntimeExports.jsxs("div",{className:"space-y-1",children:[e.jsxRuntimeExports.jsx(I.Label,{htmlFor:"current",className:"text-sm",children:"Enter HTML Code:"}),e.jsxRuntimeExports.jsx(f.Textarea,{autoFocus:!0,tabIndex:1,ref:i=>i&&i.focus(),defaultValue:t,onChange:i=>r(i.target.value),rows:12,placeholder:`<div>
+    <h1>Enter code here</h1>
+</div>`,className:"resize-none overflow-x-auto whitespace-pre font-mono font-normal"})]})}),e.jsxRuntimeExports.jsxs(f.CardFooter,{className:"flex flex-col justify-end p-3",children:[e.jsxRuntimeExports.jsx(E.Button,{disabled:t.trim()==="",onClick:()=>x(),size:"sm",className:"w-full",children:"Import"}),e.jsxRuntimeExports.jsxs(f.Alert,{variant:"default",className:"mt-2 p-1 text-blue-400",children:[e.jsxRuntimeExports.jsx(v.ExclamationTriangleIcon,{className:"h-4 w-4"}),e.jsxRuntimeExports.jsx(f.AlertTitle,{className:"text-sm leading-4",children:"Imported html will be added to the currently selected block. If no block is selected, the html will be added to the page."})]})]})]})},H=F,T=["ListItem","TableHead","TableBody","TableRow","TableCell","Column"],D=(t,r)=>{if(!t)return!s.includes(T,r);const l=t._type;return l==="List"?r==="ListItem":l==="Table"?r==="TableHead"||r==="TableBody":l==="TableHead"||l==="TableBody"?r==="TableRow":l==="TableRow"?r==="TableCell":l==="Row"?r==="Column":!s.includes(T,r)},O=()=>{const[t,r]=a.useState("core"),[l,d]=a.useState("basic"),u=w.useChaiBlocks(),[,p]=g.useAtom(n.showPredefinedBlockCategoryAtom),[,j]=g.useAtom(n.addBlocksModalAtom),[x]=n.useSelectedBlockIds(),i=n.useAllBlocks(),b=s.find(i,{_id:s.first(x)});console.log("chaiBlocks",u);const h=s.groupBy(s.filter(u,o=>D(b,o.type)),"category"),c=s.uniq(s.map(h.core,"group"));a.useEffect(()=>{!s.includes(c,l)&&!s.isEmpty(c)&&!s.isEmpty(l)&&d(s.first(c))},[c,l]);const R=o=>d(m=>m===o?"":o);return e.jsxRuntimeExports.jsxs("div",{className:"flex h-full flex-col overflow-hidden",children:[e.jsxRuntimeExports.jsxs("div",{className:"mb-2 flex justify-between rounded-md bg-background/30 p-1",children:[e.jsxRuntimeExports.jsxs("h1",{className:"flex flex-col items-baseline px-1 text-2xl font-semibold xl:flex-row",children:["Add block",e.jsxRuntimeExports.jsx("span",{className:"p-0 text-xs font-light leading-3 opacity-80 xl:pl-1",children:t==="html"?"(Enter or paste your own HTML code)":"(Drag & drop into tree view or click to add)"})]}),e.jsxRuntimeExports.jsxs("button",{onClick:()=>j(!1),className:"flex h-max items-center gap-x-1 rounded-full border p-px text-xs text-gray-800 hover:bg-gray-100 md:p-2",children:[e.jsxRuntimeExports.jsx(v.Cross1Icon,{width:12})," Close"]})]}),e.jsxRuntimeExports.jsx(y.Tabs,{onValueChange:o=>{p(""),r(o)},value:t,className:"h-max",children:e.jsxRuntimeExports.jsxs(y.TabsList,{className:"grid w-full grid-cols-3",children:[e.jsxRuntimeExports.jsx(y.TabsTrigger,{value:"core",children:"Core"}),e.jsxRuntimeExports.jsx(y.TabsTrigger,{value:"ui-blocks",children:"UI Blocks"}),e.jsxRuntimeExports.jsx(y.TabsTrigger,{value:"html",children:"Import"})]})}),t==="core"&&e.jsxRuntimeExports.jsx(C.ScrollArea,{className:"-mx-1.5 h-full",children:e.jsxRuntimeExports.jsx(k.Accordion,{type:"single",value:l,className:"w-full px-3",children:a.Children.toArray(s.map(c,o=>s.reject(s.filter(s.values(h.core),{group:o}),{hidden:!0}).length?e.jsxRuntimeExports.jsxs(k.AccordionItem,{value:o,className:"border-border",children:[e.jsxRuntimeExports.jsx(k.AccordionTrigger,{onClick:()=>R(o),className:"py-2 capitalize",children:o}),e.jsxRuntimeExports.jsx(k.AccordionContent,{children:e.jsxRuntimeExports.jsx("div",{className:"grid grid-cols-4 gap-2",children:a.Children.toArray(s.reject(s.filter(s.values(h.core),{group:o}),{hidden:!0}).map(m=>e.jsxRuntimeExports.jsx(L,{block:m})))})})]}):null))})}),t==="ui-blocks"&&e.jsxRuntimeExports.jsx(a.Suspense,{fallback:e.jsxRuntimeExports.jsx(E.Skeleton,{className:"h-32 w-full"}),children:e.jsxRuntimeExports.jsx(M,{})}),t==="html"&&e.jsxRuntimeExports.jsx(H,{})]})};exports.default=O;

package/dist/{AddBlocks-04c49399.js → AddBlocks-e047b93d.js}

@@ -1,6 +1,6 @@
 import { j as e } from "./jsx-runtime-944c88e2.js";
 import y, { createElement as z, useState as g, useMemo as D, useCallback as G, useEffect as U, Suspense as K } from "react";
-import { has as H, first as f, filter as j, values as C, groupBy as v, mergeWith as q, isArray as L, get as V, map as B, isEmpty as N, find as W, uniq as $, includes as A, reject as P } from "lodash";
+import { has as H, first as f, filter as j, values as B, groupBy as C, mergeWith as q, isArray as L, get as V, map as v, isEmpty as N, find as W, uniq as $, includes as A, reject as P } from "lodash";
 import { useAtom as x } from "jotai";
 import { A as J, a as Q, b as X, c as Y } from "./accordion-c0176dc5.js";
 import { S as Z } from "./scroll-area-9f64a082.js";
@@ -8,13 +8,13 @@ import { T as ee, a as se, b as T } from "./tabs-85caa1e8.js";
 import { d as re, e as oe, f as te, u as le, B as ae, S as ce } from "./useBuilderProp-81a14920.js";
 import { useDrag as M, DragPreviewImage as E } from "react-dnd";
 import { BoxIcon as ne, ExclamationTriangleIcon as ie, Cross1Icon as de } from "@radix-ui/react-icons";
-import { O as I, h as w, a as S, b as k, R as me, S as ue, T as pe, y as xe } from "./index-cdd49c4c.js";
+import { O as I, h as w, a as S, b as k, R as me, S as ue, T as pe, y as xe } from "./index-32d7b6e5.js";
 import "react-i18next";
-import { syncBlocksWithDefaults as R, useChaiBlocks as O } from "chaibuilder-blocks";
+import { syncBlocksWithDefaults as R, useChaiBlocks as O } from "@chaibuilder/blocks";
 import { Loader as he } from "lucide-react";
 import { c as fe } from "./utils-ac68b2c8.js";
-import { C as ge, c as be, e as je, f as ye, g as we, T as ke, d as Te, A as Ce, a as ve } from "./textarea-0750bcd2.js";
-import { L as Be } from "./label-e770a087.js";
+import { C as ge, c as be, e as je, f as ye, g as we, T as ke, d as Te, A as Be, a as Ce } from "./textarea-0750bcd2.js";
+import { L as ve } from "./label-e770a087.js";
 import { g as Ne } from "./html-to-json-fecbbe16.js";
 import "@radix-ui/react-accordion";
 import "@radix-ui/react-scroll-area";
@@ -37,8 +37,8 @@ import "tailwind-merge";
 import "@radix-ui/react-label";
 import "himalaya";
 const Ae = ({ block: s }) => {
-  const { type: r, icon: t, label: c } = s, { addCoreBlock: d, addPredefinedBlock: m } = I(), [u] = w(), [, n] = x(S), [, l] = x(k), h = () => {
-    H(s, "blocks") ? m(R(s.blocks), f(u)) : d(s, f(u)), l(!1), n("layers");
+  const { type: r, icon: t, label: c } = s, { addCoreBlock: n, addPredefinedBlock: m } = I(), [u] = w(), [, i] = x(S), [, l] = x(k), h = () => {
+    H(s, "blocks") ? m(R(s.blocks), f(u)) : n(s, f(u)), l(!1), i("layers");
   }, [, p, a] = M(() => ({
     type: "CHAI_BLOCK",
     item: s
@@ -70,7 +70,7 @@ const Ae = ({ block: s }) => {
   ] });
 }, Ie = ({ block: s, closePopover: r }) => {
   var a;
-  const [t, c] = g(!1), d = le("getExternalPredefinedBlock"), { addCoreBlock: m, addPredefinedBlock: u } = I(), [n] = w(), [, l, h] = M(
+  const [t, c] = g(!1), n = le("getExternalPredefinedBlock"), { addCoreBlock: m, addPredefinedBlock: u } = I(), [i] = w(), [, l, h] = M(
     () => ({
       type: "CHAI_BLOCK",
       item: s
@@ -79,12 +79,12 @@ const Ae = ({ block: s }) => {
   ), p = G(
     async (b) => {
       if (b.stopPropagation(), H(s, "component")) {
-        m(s, f(n)), r();
+        m(s, f(i)), r();
         return;
       }
       c(!0);
-      const o = await d(s);
-      N(o) || u(R(o), f(n)), r();
+      const o = await n(s);
+      N(o) || u(R(o), f(i)), r();
     },
     [s]
   );
@@ -115,10 +115,10 @@ const Ae = ({ block: s }) => {
     )
   ] });
 }, Le = () => {
-  const { data: s, isLoading: r } = me(), t = O(), c = j(C(t), { category: "custom" }), d = v(c, "group"), m = v(s, "group"), [u, n] = g(null), l = D(() => q(d, m, (o, i) => {
-    if (L(o) && L(i))
-      return [...o, ...i];
-  }), [d, m]), [, h] = x(k), [p, a] = g("Navbar"), b = V(l, p, []);
+  const { data: s, isLoading: r } = me(), t = O(), c = j(B(t), { category: "custom" }), n = C(c, "group"), m = C(s, "group"), [u, i] = g(null), l = D(() => q(n, m, (o, d) => {
+    if (L(o) && L(d))
+      return [...o, ...d];
+  }), [n, m]), [, h] = x(k), [p, a] = g("Navbar"), b = V(l, p, []);
   return /* @__PURE__ */ e.jsxs("div", { className: "relative flex h-full max-h-full overflow-hidden py-2", children: [
     /* @__PURE__ */ e.jsx("ul", { className: "sticky top-0 h-full w-48 space-y-1 overflow-y-auto border-r px-2", children: r ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
       /* @__PURE__ */ e.jsx("li", { className: "h-8 w-full animate-pulse bg-gray-200" }),
@@ -128,24 +128,24 @@ const Ae = ({ block: s }) => {
       /* @__PURE__ */ e.jsx("li", { className: "mt-2 h-8 w-full animate-pulse bg-gray-200" }),
       /* @__PURE__ */ e.jsx("li", { className: "mt-2 h-8 w-full animate-pulse bg-gray-200" })
     ] }) : y.Children.toArray(
-      B(l, (o, i) => /* @__PURE__ */ e.jsx(
+      v(l, (o, d) => /* @__PURE__ */ e.jsx(
         "li",
         {
           onMouseOut: () => {
-            clearTimeout(u), n(null);
+            clearTimeout(u), i(null);
           },
           onMouseEnter: () => {
             const _ = setTimeout(() => {
-              a(i);
+              a(d);
             }, 300);
-            n(_);
+            i(_);
           },
-          onClick: () => a(i),
+          onClick: () => a(d),
           className: fe(
             "-mx-2 cursor-default rounded-md rounded-r-none px-2 py-1 text-sm font-medium capitalize",
-            p === i ? "bg-blue-500 text-white" : " text-gray-700 hover:bg-foreground/10"
+            p === d ? "bg-blue-500 text-white" : " text-gray-700 hover:bg-foreground/10"
           ),
-          children: i
+          children: d
         }
       ))
     ) }),
@@ -154,9 +154,9 @@ const Ae = ({ block: s }) => {
     ) })
   ] });
 }, Pe = () => {
-  const [s, r] = g(""), { addPredefinedBlock: t } = I(), [c] = w(), [, d] = x(ue), [, m] = x(S), [, u] = x(k), n = () => {
+  const [s, r] = g(""), { addPredefinedBlock: t } = I(), [c] = w(), [, n] = x(ue), [, m] = x(S), [, u] = x(k), i = () => {
     const l = Ne(s);
-    t([...l], f(c) || null), r(""), d(!1), m("layers"), u(!1);
+    t([...l], f(c) || null), r(""), n(!1), m("layers"), u(!1);
   };
   return /* @__PURE__ */ e.jsxs(ge, { className: "border-border/0 p-0 shadow-none", children: [
     /* @__PURE__ */ e.jsxs(be, { className: "p-3", children: [
@@ -164,7 +164,7 @@ const Ae = ({ block: s }) => {
       /* @__PURE__ */ e.jsx(ye, { children: "Use HTML snippets from component libraries like Tailwind UI, Flowbite, Preline, Kitwind, Tailblocks etc. or just copy paste your own HTML code. Only Tailwind CSS markup is supported." })
     ] }),
     /* @__PURE__ */ e.jsx(we, { className: "space-y-2 px-3 py-0", children: /* @__PURE__ */ e.jsxs("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ e.jsx(Be, { htmlFor: "current", className: "text-sm", children: "Enter HTML Code:" }),
+      /* @__PURE__ */ e.jsx(ve, { htmlFor: "current", className: "text-sm", children: "Enter HTML Code:" }),
       /* @__PURE__ */ e.jsx(
         ke,
         {
@@ -182,10 +182,10 @@ const Ae = ({ block: s }) => {
       )
     ] }) }),
     /* @__PURE__ */ e.jsxs(Te, { className: "flex flex-col justify-end p-3", children: [
-      /* @__PURE__ */ e.jsx(ae, { disabled: s.trim() === "", onClick: () => n(), size: "sm", className: "w-full", children: "Import" }),
-      /* @__PURE__ */ e.jsxs(Ce, { variant: "default", className: "mt-2 p-1 text-blue-400", children: [
+      /* @__PURE__ */ e.jsx(ae, { disabled: s.trim() === "", onClick: () => i(), size: "sm", className: "w-full", children: "Import" }),
+      /* @__PURE__ */ e.jsxs(Be, { variant: "default", className: "mt-2 p-1 text-blue-400", children: [
         /* @__PURE__ */ e.jsx(ie, { className: "h-4 w-4" }),
-        /* @__PURE__ */ e.jsx(ve, { className: "text-sm leading-4", children: "Imported html will be added to the currently selected block. If no block is selected, the html will be added to the page." })
+        /* @__PURE__ */ e.jsx(Ce, { className: "text-sm leading-4", children: "Imported html will be added to the currently selected block. If no block is selected, the html will be added to the page." })
       ] })
     ] })
   ] });
@@ -195,14 +195,16 @@ const Ae = ({ block: s }) => {
   const t = s._type;
   return t === "List" ? r === "ListItem" : t === "Table" ? r === "TableHead" || r === "TableBody" : t === "TableHead" || t === "TableBody" ? r === "TableRow" : t === "TableRow" ? r === "TableCell" : t === "Row" ? r === "Column" : !A(F, r);
 }, bs = () => {
-  const [s, r] = g("core"), [t, c] = g("basic"), d = O(), [, m] = x(pe), [, u] = x(k), [n] = w(), l = xe(), h = W(l, { _id: f(n) }), p = v(
-    j(d, (o) => He(h, o.type)),
+  const [s, r] = g("core"), [t, c] = g("basic"), n = O(), [, m] = x(pe), [, u] = x(k), [i] = w(), l = xe(), h = W(l, { _id: f(i) });
+  console.log("chaiBlocks", n);
+  const p = C(
+    j(n, (o) => He(h, o.type)),
     "category"
-  ), a = $(B(p.core, "group"));
+  ), a = $(v(p.core, "group"));
   U(() => {
     !A(a, t) && !N(a) && !N(t) && c(f(a));
   }, [a, t]);
-  const b = (o) => c((i) => i === o ? "" : o);
+  const b = (o) => c((d) => d === o ? "" : o);
   return /* @__PURE__ */ e.jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "mb-2 flex justify-between rounded-md bg-background/30 p-1", children: [
       /* @__PURE__ */ e.jsxs("h1", { className: "flex flex-col items-baseline px-1 text-2xl font-semibold xl:flex-row", children: [
@@ -237,14 +239,14 @@ const Ae = ({ block: s }) => {
       }
     ),
     s === "core" && /* @__PURE__ */ e.jsx(Z, { className: "-mx-1.5 h-full", children: /* @__PURE__ */ e.jsx(J, { type: "single", value: t, className: "w-full px-3", children: y.Children.toArray(
-      B(
+      v(
         a,
-        (o) => P(j(C(p.core), { group: o }), {
+        (o) => P(j(B(p.core), { group: o }), {
           hidden: !0
         }).length ? /* @__PURE__ */ e.jsxs(Q, { value: o, className: "border-border", children: [
           /* @__PURE__ */ e.jsx(X, { onClick: () => b(o), className: "py-2 capitalize", children: o }),
           /* @__PURE__ */ e.jsx(Y, { children: /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-4 gap-2", children: y.Children.toArray(
-            P(j(C(p.core), { group: o }), { hidden: !0 }).map((i) => /* @__PURE__ */ e.jsx(Ae, { block: i }))
+            P(j(B(p.core), { group: o }), { hidden: !0 }).map((d) => /* @__PURE__ */ e.jsx(Ae, { block: d }))
           ) }) })
         ] }) : null
       )

package/dist/BrandingOptions-77957074.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./jsx-runtime-5c3ac4f7.cjs"),C=require("react"),q=require("@rjsf/validator-ajv8"),B=require("@rjsf/core"),_=require("./index-506fb888.cjs");require("react-i18next");const j=require("./useBuilderProp-5e57d0c8.cjs"),e=require("@chaibuilder/blocks");require("i18next");require("flagged");require("react-dnd");require("lodash");require("@minoru/react-dnd-treeview");require("jotai");require("./utils-3c452dd0.cjs");require("clsx");require("tailwind-merge");require("react-hotkeys-hook");require("flat-to-nested");require("./Class-0801d193.cjs");require("redux-undo");require("@react-hookz/web");require("./CONTROLS-031e1de3.cjs");require("@radix-ui/react-slot");require("class-variance-authority");require("@radix-ui/react-tooltip");require("@radix-ui/react-icons");require("@radix-ui/react-toast");function R(t){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const i in t)if(i!=="default"){const r=Object.getOwnPropertyDescriptor(t,i);Object.defineProperty(a,i,r.get?r:{enumerable:!0,get:()=>t[i]})}}return a.default=t,Object.freeze(a)}const c=R(C),v=[{title:"Roboto",value:"Roboto"},{title:"Open Sans",value:"Open Sans"},{title:"Montserrat",value:"Montserrat"},{title:"Lato",value:"Lato"},{title:"Poppins",value:"Poppins"},{title:"Oswald",value:"Oswald"},{title:"Raleway",value:"Raleway"},{title:"Ubuntu",value:"Ubuntu"},{title:"Nunito",value:"Nunito"},{title:"Merriweather",value:"Merriweather"},{title:"Nunito Sans",value:"Nunito Sans"},{title:"Playfair Display",value:"Playfair Display"},{title:"Rubik",value:"Rubik"},{title:"Inter",value:"Inter"},{title:"Lora",value:"Lora"},{title:"Kanit",value:"Kanit"},{title:"Fira Sans",value:"Fira Sans"},{title:"Hind",value:"Hind"},{title:"Quicksand",value:"Quicksand"},{title:"Mulish",value:"Mulish"},{title:"Barlow",value:"Barlow"},{title:"Inconsolata",value:"Inconsolata"},{title:"Titillium Web",value:"Titillium Web"},{title:"Heebo",value:"Heebo"},{title:"IBM Plex Sans",value:"IBM Plex Sans"},{title:"DM Sans",value:"DM Sans"},{title:"Nanum Gothic",value:"Nanum Gothic"},{title:"Karla",value:"Karla"},{title:"Arimo",value:"Arimo"},{title:"Cabin",value:"Cabin"},{title:"Oxygen",value:"Oxygen"},{title:"Overpass",value:"Overpass"},{title:"Assistant",value:"Assistant"},{title:"Tajawal",value:"Tajawal"},{title:"Play",value:"Play"},{title:"Exo",value:"Exo"},{title:"Cinzel",value:"Cinzel"},{title:"Faustina",value:"Faustina"},{title:"Philosopher",value:"Philosopher"},{title:"Gelasio",value:"Gelasio"},{title:"Sofia Sans Condensed",value:"Sofia Sans Condensed"},{title:"Noto Sans Devanagari",value:"Noto Sans Devanagari"},{title:"Actor",value:"Actor"},{title:"Epilogue",value:"Epilogue"},{title:"Glegoo",value:"Glegoo"},{title:"Overlock",value:"Overlock"},{title:"Lustria",value:"Lustria"},{title:"Ovo",value:"Ovo"},{title:"Suranna",value:"Suranna"}],P=()=>{const t=j.useBuilderProp("onSaveBrandingOptions",async()=>{}),[a,i]=_.useBrandingOptions(),r=c.useRef(a);c.useEffect(()=>()=>t(r.current),[r]);const p=({formData:l},u)=>{u&&(i(l),r.current=l)},{_bodyFont:g,_headingFont:b,_primaryColor:f,_bodyTextDarkColor:m,_bodyTextLightColor:y,_bodyBgDarkColor:x,_secondaryColor:S,_bodyBgLightColor:h,_roundedCorners:O}=a,s={_headingFont:e.SelectOption({title:"Heading font",default:b,options:v}),_bodyFont:e.SelectOption({title:"Body font",default:g,options:v}),_roundedCorners:e.Numeric({title:"Rounded Corner",default:parseInt(O||5,10)}),_primaryColor:e.Color({title:"Primary",default:f}),_secondaryColor:e.Color({title:"Secondary",default:S}),_bodyBgLightColor:e.Color({title:"Body Background (Light)",default:h}),_bodyBgDarkColor:e.Color({title:"Body Background (Dark)",default:x}),_bodyTextLightColor:e.Color({title:"Body Text (Light)",default:m}),_bodyTextDarkColor:e.Color({title:"Body Text (Dark)",default:y})},n={type:"object",properties:{}},d={};return Object.keys(s).forEach(l=>{const u=s[l];return n.properties||(n.properties={}),n.properties[l]=u.schema,d[l]=u.uiSchema,!0}),o.jsxRuntimeExports.jsxs("div",{className:"flex h-full select-none flex-col",children:[o.jsxRuntimeExports.jsx("div",{className:"rounded-md bg-background/30 p-1",children:o.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:"Branding Options"})}),o.jsxRuntimeExports.jsx("div",{className:"-mx-2",children:o.jsxRuntimeExports.jsx(B,{idSeparator:".",autoComplete:"off",omitExtraData:!0,liveOmit:!0,liveValidate:!0,uiSchema:d,schema:n,formData:a,validator:q,onChange:p})})]})};exports.default=P;

package/dist/{BrandingOptions-055cf22a.js → BrandingOptions-86dc389a.js}

@@ -2,10 +2,10 @@ import { j as a } from "./jsx-runtime-944c88e2.js";
 import * as s from "react";
 import B from "@rjsf/validator-ajv8";
 import _ from "@rjsf/core";
-import { w as k } from "./index-cdd49c4c.js";
+import { w as k } from "./index-32d7b6e5.js";
 import "react-i18next";
 import { u as N } from "./useBuilderProp-81a14920.js";
-import { SelectOption as p, Numeric as D, Color as e } from "chaibuilder-blocks";
+import { SelectOption as p, Numeric as D, Color as e } from "@chaibuilder/blocks";
 import "i18next";
 import "flagged";
 import "react-dnd";

package/dist/{CanvasArea-a7901131.js → CanvasArea-29d479f2.js}

@@ -6,7 +6,7 @@ import G, { createElement as gt, useCallback as Q, useState as H, useEffect as F
 import { map as ie, includes as Me, toUpper as ye, round as St, isEmpty as ee, first as ce, get as $, memoize as Tt, find as jt, filter as Ze, isString as Je } from "lodash";
 import { ResetIcon as De, DotsVerticalIcon as Ct, MobileIcon as Be, LaptopIcon as kt, DesktopIcon as _t, EraserIcon as Rt, ZoomInIcon as At, ArrowUpIcon as Pt, CopyIcon as It, TrashIcon as Ot, DragHandleDots2Icon as Mt } from "@radix-ui/react-icons";
 import { B as le, u as Qe, S as et } from "./useBuilderProp-81a14920.js";
-import { c as ke, d as tt, e as _e, f as Dt, g as Bt, h as X, i as Z, j as $t, k as nt, l as rt, m as Nt, n as Lt, o as Ft, p as ot, q as st, u as Wt, r as qt, s as Ut, t as Yt, v as zt, w as Ht, x as Re, y as at, z as Kt, A as Vt, B as Gt, b as Xt, E as Zt } from "./index-cdd49c4c.js";
+import { c as ke, d as tt, e as _e, f as Dt, g as Bt, h as X, i as Z, j as $t, k as nt, l as rt, m as Nt, n as Lt, o as Ft, p as ot, q as st, u as Wt, r as qt, s as Ut, t as Yt, v as zt, w as Ht, x as Re, y as at, z as Kt, A as Vt, B as Gt, b as Xt, E as Zt } from "./index-32d7b6e5.js";
 import { useTranslation as it } from "react-i18next";
 import { S as se } from "./separator-a80d065b.js";
 import { S as Jt, D as Qt, k as en, l as tn, p as nn, q as rn, n as on, H as sn, i as an, j as cn, A as ln, a as dn, b as un, c as fn, e as pn, f as hn, d as mn, h as yn, g as vn } from "./dropdown-menu-d912a52e.js";
@@ -20,7 +20,7 @@ import { tailwindcssPaletteGenerator as Tn } from "@bobthered/tailwindcss-palett
 import { Provider as jn } from "react-wrap-balancer";
 import { twMerge as Cn } from "tailwind-merge";
 import { S as ct, a as $e } from "./CONTROLS-442caee5.js";
-import { getBlockComponent as kn } from "chaibuilder-blocks";
+import { getBlockComponent as kn } from "@chaibuilder/blocks";
 import Ne from "react-dom";
 import { g as _n } from "./_commonjsHelpers-d4512b9c.js";
 import "@radix-ui/react-slot";
@@ -1423,7 +1423,7 @@ const or = () => {
       )
     }
   );
-}, ir = wt(() => import("./AddBlocks-04c49399.js")), Zr = () => {
+}, ir = wt(() => import("./AddBlocks-e047b93d.js")), Zr = () => {
   const e = Qe("mode", ve.STATIC), [n, r] = te(Xt), i = {
     [ve.STATIC]: /* @__PURE__ */ t.jsx(ar, {}),
     [ve.FRAMEWORK]: null

package/dist/{CanvasArea-97dfbb52.cjs → CanvasArea-9ce217a4.cjs}

@@ -1,6 +1,6 @@
-"use strict";var He=Object.defineProperty;var Ke=(e,r,n)=>r in e?He(e,r,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[r]=n;var Z=(e,r,n)=>(Ke(e,typeof r!="symbol"?r+"":r,n),n);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./jsx-runtime-5c3ac4f7.cjs"),g=require("react"),v=require("lodash"),Y=require("@radix-ui/react-icons"),G=require("./useBuilderProp-5e57d0c8.cjs"),h=require("./index-aea5c557.cjs"),$e=require("react-i18next"),ne=require("./separator-a597dba7.cjs"),L=require("./dropdown-menu-a9b096f9.cjs"),Ve=require("./label-167415e5.cjs"),Q=require("jotai"),Ge=require("@floating-ui/dom"),we=require("@floating-ui/react-dom"),Xe=require("react-dnd"),Ze=require("@react-hookz/web"),Je=require("@bobthered/tailwindcss-palette-generator"),Qe=require("react-wrap-balancer"),et=require("tailwind-merge"),oe=require("./CONTROLS-031e1de3.cjs"),tt=require("chaibuilder-blocks"),ke=require("react-dom"),rt=require("./_commonjsHelpers-5a53b418.cjs");require("@radix-ui/react-slot");require("class-variance-authority");require("./utils-3c452dd0.cjs");require("clsx");require("@radix-ui/react-tooltip");require("@radix-ui/react-toast");require("i18next");require("flagged");require("@minoru/react-dnd-treeview");require("react-hotkeys-hook");require("flat-to-nested");require("./Class-0801d193.cjs");require("redux-undo");require("@radix-ui/react-separator");require("@radix-ui/react-switch");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-hover-card");require("@radix-ui/react-dropdown-menu");require("@radix-ui/react-label");const nt=()=>{const{undoCount:e,redoCount:r,undo:n,redo:a}=h.useCanvasHistory();return t.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[t.jsxRuntimeExports.jsx(G.Button,{disabled:!e,size:"sm",onClick:n,className:"rounded-full",variant:"ghost",children:t.jsxRuntimeExports.jsx(Y.ResetIcon,{})}),t.jsxRuntimeExports.jsx(G.Button,{disabled:!r,onClick:a,size:"sm",className:"rounded-full",variant:"ghost",children:t.jsxRuntimeExports.jsx(Y.ResetIcon,{className:"rotate-180 scale-y-[-1] transform"})})]})};function st(){const[e,r]=h.useDarkMode(),{t:n}=$e.useTranslation();return t.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[t.jsxRuntimeExports.jsx(Ve.Label,{htmlFor:"dark-mode-switch",children:n("dark_mode")}),t.jsxRuntimeExports.jsxs(L.Switch,{id:"dark-mode-switch",checked:e,onCheckedChange:()=>{r(!e)},className:`${e?"bg-violet-600":"bg-violet-300"}
+"use strict";var He=Object.defineProperty;var Ke=(e,n,r)=>n in e?He(e,n,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[n]=r;var Z=(e,n,r)=>(Ke(e,typeof n!="symbol"?n+"":n,r),r);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./jsx-runtime-5c3ac4f7.cjs"),g=require("react"),v=require("lodash"),Y=require("@radix-ui/react-icons"),G=require("./useBuilderProp-5e57d0c8.cjs"),h=require("./index-506fb888.cjs"),$e=require("react-i18next"),re=require("./separator-a597dba7.cjs"),L=require("./dropdown-menu-a9b096f9.cjs"),Ve=require("./label-167415e5.cjs"),Q=require("jotai"),Ge=require("@floating-ui/dom"),we=require("@floating-ui/react-dom"),Xe=require("react-dnd"),Ze=require("@react-hookz/web"),Je=require("@bobthered/tailwindcss-palette-generator"),Qe=require("react-wrap-balancer"),et=require("tailwind-merge"),oe=require("./CONTROLS-031e1de3.cjs"),tt=require("@chaibuilder/blocks"),ke=require("react-dom"),nt=require("./_commonjsHelpers-5a53b418.cjs");require("@radix-ui/react-slot");require("class-variance-authority");require("./utils-3c452dd0.cjs");require("clsx");require("@radix-ui/react-tooltip");require("@radix-ui/react-toast");require("i18next");require("flagged");require("@minoru/react-dnd-treeview");require("react-hotkeys-hook");require("flat-to-nested");require("./Class-0801d193.cjs");require("redux-undo");require("@radix-ui/react-separator");require("@radix-ui/react-switch");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-hover-card");require("@radix-ui/react-dropdown-menu");require("@radix-ui/react-label");const rt=()=>{const{undoCount:e,redoCount:n,undo:r,redo:a}=h.useCanvasHistory();return t.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[t.jsxRuntimeExports.jsx(G.Button,{disabled:!e,size:"sm",onClick:r,className:"rounded-full",variant:"ghost",children:t.jsxRuntimeExports.jsx(Y.ResetIcon,{})}),t.jsxRuntimeExports.jsx(G.Button,{disabled:!n,onClick:a,size:"sm",className:"rounded-full",variant:"ghost",children:t.jsxRuntimeExports.jsx(Y.ResetIcon,{className:"rotate-180 scale-y-[-1] transform"})})]})};function st(){const[e,n]=h.useDarkMode(),{t:r}=$e.useTranslation();return t.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[t.jsxRuntimeExports.jsx(Ve.Label,{htmlFor:"dark-mode-switch",children:r("dark_mode")}),t.jsxRuntimeExports.jsxs(L.Switch,{id:"dark-mode-switch",checked:e,onCheckedChange:()=>{n(!e)},className:`${e?"bg-violet-600":"bg-violet-300"}
           relative ml-2 inline-flex h-[20px] w-[40px] shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus-visible:ring-2  focus-visible:ring-white focus-visible:ring-opacity-75`,children:[t.jsxRuntimeExports.jsx("span",{className:"sr-only",children:"Use setting"}),t.jsxRuntimeExports.jsx("span",{"aria-hidden":"true",className:`${e?"translate-x-5":"translate-x-0"}
-            pointer-events-none -mt-px inline-block h-[18px] w-[20px] transform rounded-full bg-white shadow-lg ring-0 transition duration-200 ease-in-out`})]})]})}const Ce=({landscape:e=!1})=>t.jsxRuntimeExports.jsxs("svg",{className:e?"rotate-90":"",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 13 13",xmlSpace:"preserve",width:13,height:13,children:[t.jsxRuntimeExports.jsx("g",{strokeWidth:0}),t.jsxRuntimeExports.jsx("g",{strokeLinecap:"round",strokeLinejoin:"round"}),t.jsxRuntimeExports.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"}})]}),Te=[{title:"Mobile (XS)",content:"Styles set here are applied to all screen unless edited at higher breakpoint",breakpoint:"xs",icon:t.jsxRuntimeExports.jsx(Y.MobileIcon,{}),width:400},{title:"Mobile landscape (SM)",content:"Styles set here are applied at 640px and up unless edited at higher breakpoint",breakpoint:"sm",icon:t.jsxRuntimeExports.jsx(Y.MobileIcon,{className:"rotate-90"}),width:640},{title:"Tablet (MD)",content:"Styles set here are applied at 768px and up",breakpoint:"md",icon:t.jsxRuntimeExports.jsx(Ce,{}),width:800},{title:"Tablet Landscape (LG)",content:"Styles set here are applied at 1024px and up unless edited at higher breakpoint",breakpoint:"lg",icon:t.jsxRuntimeExports.jsx(Ce,{landscape:!0}),width:1024},{title:"Desktop (XL)",content:"Styles set here are applied at 1280px and up unless edited at higher breakpoint",breakpoint:"xl",icon:t.jsxRuntimeExports.jsx(Y.LaptopIcon,{}),width:1420},{title:"Large Desktop (2XL)",content:"Styles set here are applied at 1536px and up",breakpoint:"2xl",icon:t.jsxRuntimeExports.jsx(Y.DesktopIcon,{}),width:1920}],ot=({title:e,content:r,currentBreakpoint:n,breakpoint:a,width:u,icon:o,onClick:i})=>t.jsxRuntimeExports.jsxs(L.HoverCard,{children:[t.jsxRuntimeExports.jsx(L.HoverCardTrigger,{asChild:!0,children:t.jsxRuntimeExports.jsx(G.Button,{onClick:()=>i(u),size:"sm",variant:a===n?"secondary":"ghost",children:o})}),t.jsxRuntimeExports.jsx(L.HoverCardContent,{className:"w-52 border-border",children:t.jsxRuntimeExports.jsx("div",{className:"flex justify-between space-x-4",children:t.jsxRuntimeExports.jsxs("div",{className:"space-y-1",children:[t.jsxRuntimeExports.jsx("h4",{className:"text-sm font-semibold",children:e}),t.jsxRuntimeExports.jsx("p",{className:"text-xs",children:r})]})})})]}),it=()=>{const[,e,r]=h.useCanvasWidth(),[n,a]=h.useSelectedBreakpoints(),u=o=>{n.includes(o)?n.length>2&&a(n.filter(i=>i!==o)):a(i=>[...i,o])};return t.jsxRuntimeExports.jsxs("div",{className:"flex items-center rounded-md",children:[v.map(Te.filter(o=>v.includes(n,v.toUpper(o.breakpoint))),o=>g.createElement(ot,{...o,onClick:r,key:o.breakpoint,currentBreakpoint:e})),t.jsxRuntimeExports.jsxs(L.DropdownMenu,{children:[t.jsxRuntimeExports.jsx(L.DropdownMenuTrigger,{asChild:!0,children:t.jsxRuntimeExports.jsx("span",{className:"cursor-pointer px-2.5 hover:opacity-80",children:t.jsxRuntimeExports.jsx(Y.DotsVerticalIcon,{className:"scale-90 transform"})})}),t.jsxRuntimeExports.jsxs(L.DropdownMenuContent,{className:"w-56 border-border text-xs",children:[t.jsxRuntimeExports.jsx(L.DropdownMenuLabel,{children:"Breakpoints"}),t.jsxRuntimeExports.jsx(L.DropdownMenuSeparator,{}),v.map(Te,o=>t.jsxRuntimeExports.jsx(L.DropdownMenuCheckboxItem,{disabled:o.breakpoint==="xs",onCheckedChange:()=>u(v.toUpper(o.breakpoint)),checked:v.includes(n,v.toUpper(o.breakpoint)),children:o.title},o.breakpoint))]})]})]})},at=()=>{const[e]=h.useSetAllBlocks(),{createSnapshot:r}=h.useCanvasHistory(),[,n]=h.useSelectedBlockIds(),[,a]=h.useSelectedStylingBlocks(),u=g.useCallback(()=>{e([]),n([]),a([]),r()},[e,r]);return t.jsxRuntimeExports.jsx("div",{className:"flex items-center",children:t.jsxRuntimeExports.jsxs(L.AlertDialog,{children:[t.jsxRuntimeExports.jsx(L.AlertDialogTrigger,{asChild:!0,children:t.jsxRuntimeExports.jsxs(G.Button,{size:"sm",variant:"ghost",className:"flex items-center gap-x-1",children:[t.jsxRuntimeExports.jsx(Y.EraserIcon,{})," Clear"]})}),t.jsxRuntimeExports.jsxs(L.AlertDialogContent,{className:"border-border",children:[t.jsxRuntimeExports.jsxs(L.AlertDialogHeader,{children:[t.jsxRuntimeExports.jsx(L.AlertDialogTitle,{children:"Clear whole canvas?"}),t.jsxRuntimeExports.jsx(L.AlertDialogDescription,{children:"Are you sure you want to clear the whole canvas?"})]}),t.jsxRuntimeExports.jsxs(L.AlertDialogFooter,{children:[t.jsxRuntimeExports.jsx(L.AlertDialogCancel,{children:"Cancel"}),t.jsxRuntimeExports.jsx(L.AlertDialogAction,{onClick:u,children:"Yes"})]})]})]})})},ct=()=>{const e=h.useFeatureSupport("darkMode",!1),[r]=h.useCanvasZoom();return t.jsxRuntimeExports.jsxs("div",{className:"flex h-10 items-center justify-between border-b bg-background/70 px-2",children:[t.jsxRuntimeExports.jsxs("div",{className:"flex h-full space-x-2",children:[e?t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(st,{}),t.jsxRuntimeExports.jsx(ne.Separator,{orientation:"vertical"})]}):null,t.jsxRuntimeExports.jsx(it,{}),t.jsxRuntimeExports.jsx(ne.Separator,{orientation:"vertical"}),t.jsxRuntimeExports.jsxs("div",{className:"flex w-12 items-center justify-center gap-x-1 space-x-0 font-medium",children:[t.jsxRuntimeExports.jsx(Y.ZoomInIcon,{className:"h-3.5 w-3.5 flex-shrink-0"})," ",t.jsxRuntimeExports.jsxs("div",{className:"text-xs leading-3",children:[v.round(r,0),"%"]})]}),t.jsxRuntimeExports.jsx(ne.Separator,{orientation:"vertical"}),t.jsxRuntimeExports.jsx(nt,{})]}),t.jsxRuntimeExports.jsxs("div",{className:"flex h-full items-center space-x-2",children:[t.jsxRuntimeExports.jsx(ne.Separator,{orientation:"vertical"}),t.jsxRuntimeExports.jsx(at,{})]})]})},pe={FRAMEWORK:"FRAMEWORK",STATIC:"STATIC",EMAIL:"EMAIL",PRESENTATION:"PRESENTATION",GRAPHIC:"GRAPHIC"},lt=`<!doctype html>
+            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:e=!1})=>t.jsxRuntimeExports.jsxs("svg",{className:e?"rotate-90":"",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 13 13",xmlSpace:"preserve",width:13,height:13,children:[t.jsxRuntimeExports.jsx("g",{strokeWidth:0}),t.jsxRuntimeExports.jsx("g",{strokeLinecap:"round",strokeLinejoin:"round"}),t.jsxRuntimeExports.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"}})]}),Te=[{title:"Mobile (XS)",content:"Styles set here are applied to all screen unless edited at higher breakpoint",breakpoint:"xs",icon:t.jsxRuntimeExports.jsx(Y.MobileIcon,{}),width:400},{title:"Mobile landscape (SM)",content:"Styles set here are applied at 640px and up unless edited at higher breakpoint",breakpoint:"sm",icon:t.jsxRuntimeExports.jsx(Y.MobileIcon,{className:"rotate-90"}),width:640},{title:"Tablet (MD)",content:"Styles set here are applied at 768px and up",breakpoint:"md",icon:t.jsxRuntimeExports.jsx(Ce,{}),width:800},{title:"Tablet Landscape (LG)",content:"Styles set here are applied at 1024px and up unless edited at higher breakpoint",breakpoint:"lg",icon:t.jsxRuntimeExports.jsx(Ce,{landscape:!0}),width:1024},{title:"Desktop (XL)",content:"Styles set here are applied at 1280px and up unless edited at higher breakpoint",breakpoint:"xl",icon:t.jsxRuntimeExports.jsx(Y.LaptopIcon,{}),width:1420},{title:"Large Desktop (2XL)",content:"Styles set here are applied at 1536px and up",breakpoint:"2xl",icon:t.jsxRuntimeExports.jsx(Y.DesktopIcon,{}),width:1920}],ot=({title:e,content:n,currentBreakpoint:r,breakpoint:a,width:u,icon:o,onClick:i})=>t.jsxRuntimeExports.jsxs(L.HoverCard,{children:[t.jsxRuntimeExports.jsx(L.HoverCardTrigger,{asChild:!0,children:t.jsxRuntimeExports.jsx(G.Button,{onClick:()=>i(u),size:"sm",variant:a===r?"secondary":"ghost",children:o})}),t.jsxRuntimeExports.jsx(L.HoverCardContent,{className:"w-52 border-border",children:t.jsxRuntimeExports.jsx("div",{className:"flex justify-between space-x-4",children:t.jsxRuntimeExports.jsxs("div",{className:"space-y-1",children:[t.jsxRuntimeExports.jsx("h4",{className:"text-sm font-semibold",children:e}),t.jsxRuntimeExports.jsx("p",{className:"text-xs",children:n})]})})})]}),it=()=>{const[,e,n]=h.useCanvasWidth(),[r,a]=h.useSelectedBreakpoints(),u=o=>{r.includes(o)?r.length>2&&a(r.filter(i=>i!==o)):a(i=>[...i,o])};return t.jsxRuntimeExports.jsxs("div",{className:"flex items-center rounded-md",children:[v.map(Te.filter(o=>v.includes(r,v.toUpper(o.breakpoint))),o=>g.createElement(ot,{...o,onClick:n,key:o.breakpoint,currentBreakpoint:e})),t.jsxRuntimeExports.jsxs(L.DropdownMenu,{children:[t.jsxRuntimeExports.jsx(L.DropdownMenuTrigger,{asChild:!0,children:t.jsxRuntimeExports.jsx("span",{className:"cursor-pointer px-2.5 hover:opacity-80",children:t.jsxRuntimeExports.jsx(Y.DotsVerticalIcon,{className:"scale-90 transform"})})}),t.jsxRuntimeExports.jsxs(L.DropdownMenuContent,{className:"w-56 border-border text-xs",children:[t.jsxRuntimeExports.jsx(L.DropdownMenuLabel,{children:"Breakpoints"}),t.jsxRuntimeExports.jsx(L.DropdownMenuSeparator,{}),v.map(Te,o=>t.jsxRuntimeExports.jsx(L.DropdownMenuCheckboxItem,{disabled:o.breakpoint==="xs",onCheckedChange:()=>u(v.toUpper(o.breakpoint)),checked:v.includes(r,v.toUpper(o.breakpoint)),children:o.title},o.breakpoint))]})]})]})},at=()=>{const[e]=h.useSetAllBlocks(),{createSnapshot:n}=h.useCanvasHistory(),[,r]=h.useSelectedBlockIds(),[,a]=h.useSelectedStylingBlocks(),u=g.useCallback(()=>{e([]),r([]),a([]),n()},[e,n]);return t.jsxRuntimeExports.jsx("div",{className:"flex items-center",children:t.jsxRuntimeExports.jsxs(L.AlertDialog,{children:[t.jsxRuntimeExports.jsx(L.AlertDialogTrigger,{asChild:!0,children:t.jsxRuntimeExports.jsxs(G.Button,{size:"sm",variant:"ghost",className:"flex items-center gap-x-1",children:[t.jsxRuntimeExports.jsx(Y.EraserIcon,{})," Clear"]})}),t.jsxRuntimeExports.jsxs(L.AlertDialogContent,{className:"border-border",children:[t.jsxRuntimeExports.jsxs(L.AlertDialogHeader,{children:[t.jsxRuntimeExports.jsx(L.AlertDialogTitle,{children:"Clear whole canvas?"}),t.jsxRuntimeExports.jsx(L.AlertDialogDescription,{children:"Are you sure you want to clear the whole canvas?"})]}),t.jsxRuntimeExports.jsxs(L.AlertDialogFooter,{children:[t.jsxRuntimeExports.jsx(L.AlertDialogCancel,{children:"Cancel"}),t.jsxRuntimeExports.jsx(L.AlertDialogAction,{onClick:u,children:"Yes"})]})]})]})})},ct=()=>{const e=h.useFeatureSupport("darkMode",!1),[n]=h.useCanvasZoom();return t.jsxRuntimeExports.jsxs("div",{className:"flex h-10 items-center justify-between border-b bg-background/70 px-2",children:[t.jsxRuntimeExports.jsxs("div",{className:"flex h-full space-x-2",children:[e?t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(st,{}),t.jsxRuntimeExports.jsx(re.Separator,{orientation:"vertical"})]}):null,t.jsxRuntimeExports.jsx(it,{}),t.jsxRuntimeExports.jsx(re.Separator,{orientation:"vertical"}),t.jsxRuntimeExports.jsxs("div",{className:"flex w-12 items-center justify-center gap-x-1 space-x-0 font-medium",children:[t.jsxRuntimeExports.jsx(Y.ZoomInIcon,{className:"h-3.5 w-3.5 flex-shrink-0"})," ",t.jsxRuntimeExports.jsxs("div",{className:"text-xs leading-3",children:[v.round(n,0),"%"]})]}),t.jsxRuntimeExports.jsx(re.Separator,{orientation:"vertical"}),t.jsxRuntimeExports.jsx(rt,{})]}),t.jsxRuntimeExports.jsxs("div",{className:"flex h-full items-center space-x-2",children:[t.jsxRuntimeExports.jsx(re.Separator,{orientation:"vertical"}),t.jsxRuntimeExports.jsx(at,{})]})]})},pe={FRAMEWORK:"FRAMEWORK",STATIC:"STATIC",EMAIL:"EMAIL",PRESENTATION:"PRESENTATION",GRAPHIC:"GRAPHIC"},lt=`<!doctype html>
 <html class="scroll-smooth h-full overflow-y-auto">
   <head>
     <meta charset="UTF-8">
@@ -34,27 +34,27 @@
   <body class="font-body antialiased h-full">
     <div class="frame-root"></div>
   </body>
-</html>`,ut=e=>{const[r]=h.useCanvasWidth(),[,n]=h.useCanvasZoom(),[a,u]=g.useState({}),o=g.useCallback(()=>{const{width:i,height:p}=e;if(i<r){const y=parseFloat((i/r).toString());let f={};p&&(f={height:p+2*p*(1-y)}),u({transform:`scale(${y})`,transformOrigin:"top left",...f,maxWidth:"none"}),n(y*100)}else u({}),n(100)},[r,e,n]);return g.useEffect(()=>{o()},[r,e,n,o]),a};var ge={exports:{}},se={exports:{}},O={};/** @license React v16.13.1
+</html>`,ut=e=>{const[n]=h.useCanvasWidth(),[,r]=h.useCanvasZoom(),[a,u]=g.useState({}),o=g.useCallback(()=>{const{width:i,height:p}=e;if(i<n){const y=parseFloat((i/n).toString());let f={};p&&(f={height:p+2*p*(1-y)}),u({transform:`scale(${y})`,transformOrigin:"top left",...f,maxWidth:"none"}),r(y*100)}else u({}),r(100)},[n,e,r]);return g.useEffect(()=>{o()},[n,e,r,o]),a};var ge={exports:{}},se={exports:{}},O={};/** @license React v16.13.1
  * react-is.production.min.js
  *
  * Copyright (c) Facebook, Inc. and its affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var _e;function dt(){if(_e)return O;_e=1;var e=typeof Symbol=="function"&&Symbol.for,r=e?Symbol.for("react.element"):60103,n=e?Symbol.for("react.portal"):60106,a=e?Symbol.for("react.fragment"):60107,u=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,p=e?Symbol.for("react.context"):60110,y=e?Symbol.for("react.async_mode"):60111,f=e?Symbol.for("react.concurrent_mode"):60111,m=e?Symbol.for("react.forward_ref"):60112,x=e?Symbol.for("react.suspense"):60113,R=e?Symbol.for("react.suspense_list"):60120,E=e?Symbol.for("react.memo"):60115,B=e?Symbol.for("react.lazy"):60116,w=e?Symbol.for("react.block"):60121,_=e?Symbol.for("react.fundamental"):60117,j=e?Symbol.for("react.responder"):60118,H=e?Symbol.for("react.scope"):60119;function q(l){if(typeof l=="object"&&l!==null){var $=l.$$typeof;switch($){case r:switch(l=l.type,l){case y:case f:case a:case o:case u:case x:return l;default:switch(l=l&&l.$$typeof,l){case p:case m:case B:case E:case i:return l;default:return $}}case n:return $}}}function N(l){return q(l)===f}return O.AsyncMode=y,O.ConcurrentMode=f,O.ContextConsumer=p,O.ContextProvider=i,O.Element=r,O.ForwardRef=m,O.Fragment=a,O.Lazy=B,O.Memo=E,O.Portal=n,O.Profiler=o,O.StrictMode=u,O.Suspense=x,O.isAsyncMode=function(l){return N(l)||q(l)===y},O.isConcurrentMode=N,O.isContextConsumer=function(l){return q(l)===p},O.isContextProvider=function(l){return q(l)===i},O.isElement=function(l){return typeof l=="object"&&l!==null&&l.$$typeof===r},O.isForwardRef=function(l){return q(l)===m},O.isFragment=function(l){return q(l)===a},O.isLazy=function(l){return q(l)===B},O.isMemo=function(l){return q(l)===E},O.isPortal=function(l){return q(l)===n},O.isProfiler=function(l){return q(l)===o},O.isStrictMode=function(l){return q(l)===u},O.isSuspense=function(l){return q(l)===x},O.isValidElementType=function(l){return typeof l=="string"||typeof l=="function"||l===a||l===f||l===o||l===u||l===x||l===R||typeof l=="object"&&l!==null&&(l.$$typeof===B||l.$$typeof===E||l.$$typeof===i||l.$$typeof===p||l.$$typeof===m||l.$$typeof===_||l.$$typeof===j||l.$$typeof===H||l.$$typeof===w)},O.typeOf=q,O}var M={};/** @license React v16.13.1
+ */var _e;function dt(){if(_e)return O;_e=1;var e=typeof Symbol=="function"&&Symbol.for,n=e?Symbol.for("react.element"):60103,r=e?Symbol.for("react.portal"):60106,a=e?Symbol.for("react.fragment"):60107,u=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,p=e?Symbol.for("react.context"):60110,y=e?Symbol.for("react.async_mode"):60111,f=e?Symbol.for("react.concurrent_mode"):60111,m=e?Symbol.for("react.forward_ref"):60112,x=e?Symbol.for("react.suspense"):60113,R=e?Symbol.for("react.suspense_list"):60120,E=e?Symbol.for("react.memo"):60115,B=e?Symbol.for("react.lazy"):60116,w=e?Symbol.for("react.block"):60121,_=e?Symbol.for("react.fundamental"):60117,j=e?Symbol.for("react.responder"):60118,H=e?Symbol.for("react.scope"):60119;function q(l){if(typeof l=="object"&&l!==null){var $=l.$$typeof;switch($){case n:switch(l=l.type,l){case y:case f:case a:case o:case u:case x:return l;default:switch(l=l&&l.$$typeof,l){case p:case m:case B:case E:case i:return l;default:return $}}case r:return $}}}function N(l){return q(l)===f}return O.AsyncMode=y,O.ConcurrentMode=f,O.ContextConsumer=p,O.ContextProvider=i,O.Element=n,O.ForwardRef=m,O.Fragment=a,O.Lazy=B,O.Memo=E,O.Portal=r,O.Profiler=o,O.StrictMode=u,O.Suspense=x,O.isAsyncMode=function(l){return N(l)||q(l)===y},O.isConcurrentMode=N,O.isContextConsumer=function(l){return q(l)===p},O.isContextProvider=function(l){return q(l)===i},O.isElement=function(l){return typeof l=="object"&&l!==null&&l.$$typeof===n},O.isForwardRef=function(l){return q(l)===m},O.isFragment=function(l){return q(l)===a},O.isLazy=function(l){return q(l)===B},O.isMemo=function(l){return q(l)===E},O.isPortal=function(l){return q(l)===r},O.isProfiler=function(l){return q(l)===o},O.isStrictMode=function(l){return q(l)===u},O.isSuspense=function(l){return q(l)===x},O.isValidElementType=function(l){return typeof l=="string"||typeof l=="function"||l===a||l===f||l===o||l===u||l===x||l===R||typeof l=="object"&&l!==null&&(l.$$typeof===B||l.$$typeof===E||l.$$typeof===i||l.$$typeof===p||l.$$typeof===m||l.$$typeof===_||l.$$typeof===j||l.$$typeof===H||l.$$typeof===w)},O.typeOf=q,O}var M={};/** @license React v16.13.1
  * react-is.development.js
  *
  * Copyright (c) Facebook, Inc. and its affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var Ae;function pt(){return Ae||(Ae=1,process.env.NODE_ENV!=="production"&&function(){var e=typeof Symbol=="function"&&Symbol.for,r=e?Symbol.for("react.element"):60103,n=e?Symbol.for("react.portal"):60106,a=e?Symbol.for("react.fragment"):60107,u=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,p=e?Symbol.for("react.context"):60110,y=e?Symbol.for("react.async_mode"):60111,f=e?Symbol.for("react.concurrent_mode"):60111,m=e?Symbol.for("react.forward_ref"):60112,x=e?Symbol.for("react.suspense"):60113,R=e?Symbol.for("react.suspense_list"):60120,E=e?Symbol.for("react.memo"):60115,B=e?Symbol.for("react.lazy"):60116,w=e?Symbol.for("react.block"):60121,_=e?Symbol.for("react.fundamental"):60117,j=e?Symbol.for("react.responder"):60118,H=e?Symbol.for("react.scope"):60119;function q(c){return typeof c=="string"||typeof c=="function"||c===a||c===f||c===o||c===u||c===x||c===R||typeof c=="object"&&c!==null&&(c.$$typeof===B||c.$$typeof===E||c.$$typeof===i||c.$$typeof===p||c.$$typeof===m||c.$$typeof===_||c.$$typeof===j||c.$$typeof===H||c.$$typeof===w)}function N(c){if(typeof c=="object"&&c!==null){var V=c.$$typeof;switch(V){case r:var re=c.type;switch(re){case y:case f:case a:case o:case u:case x:return re;default:var Se=re&&re.$$typeof;switch(Se){case p:case m:case B:case E:case i:return Se;default:return V}}case n:return V}}}var l=y,$=f,U=p,z=i,ie=r,ae=m,ee=a,ce=B,le=E,J=n,ue=o,K=u,X=x,te=!1;function de(c){return te||(te=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")),s(c)||N(c)===y}function s(c){return N(c)===f}function d(c){return N(c)===p}function T(c){return N(c)===i}function k(c){return typeof c=="object"&&c!==null&&c.$$typeof===r}function b(c){return N(c)===m}function A(c){return N(c)===a}function S(c){return N(c)===B}function C(c){return N(c)===E}function I(c){return N(c)===n}function D(c){return N(c)===o}function P(c){return N(c)===u}function F(c){return N(c)===x}M.AsyncMode=l,M.ConcurrentMode=$,M.ContextConsumer=U,M.ContextProvider=z,M.Element=ie,M.ForwardRef=ae,M.Fragment=ee,M.Lazy=ce,M.Memo=le,M.Portal=J,M.Profiler=ue,M.StrictMode=K,M.Suspense=X,M.isAsyncMode=de,M.isConcurrentMode=s,M.isContextConsumer=d,M.isContextProvider=T,M.isElement=k,M.isForwardRef=b,M.isFragment=A,M.isLazy=S,M.isMemo=C,M.isPortal=I,M.isProfiler=D,M.isStrictMode=P,M.isSuspense=F,M.isValidElementType=q,M.typeOf=N}()),M}var Ie;function Ne(){return Ie||(Ie=1,process.env.NODE_ENV==="production"?se.exports=dt():se.exports=pt()),se.exports}/*
+ */var Ae;function pt(){return Ae||(Ae=1,process.env.NODE_ENV!=="production"&&function(){var e=typeof Symbol=="function"&&Symbol.for,n=e?Symbol.for("react.element"):60103,r=e?Symbol.for("react.portal"):60106,a=e?Symbol.for("react.fragment"):60107,u=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,p=e?Symbol.for("react.context"):60110,y=e?Symbol.for("react.async_mode"):60111,f=e?Symbol.for("react.concurrent_mode"):60111,m=e?Symbol.for("react.forward_ref"):60112,x=e?Symbol.for("react.suspense"):60113,R=e?Symbol.for("react.suspense_list"):60120,E=e?Symbol.for("react.memo"):60115,B=e?Symbol.for("react.lazy"):60116,w=e?Symbol.for("react.block"):60121,_=e?Symbol.for("react.fundamental"):60117,j=e?Symbol.for("react.responder"):60118,H=e?Symbol.for("react.scope"):60119;function q(c){return typeof c=="string"||typeof c=="function"||c===a||c===f||c===o||c===u||c===x||c===R||typeof c=="object"&&c!==null&&(c.$$typeof===B||c.$$typeof===E||c.$$typeof===i||c.$$typeof===p||c.$$typeof===m||c.$$typeof===_||c.$$typeof===j||c.$$typeof===H||c.$$typeof===w)}function N(c){if(typeof c=="object"&&c!==null){var V=c.$$typeof;switch(V){case n:var ne=c.type;switch(ne){case y:case f:case a:case o:case u:case x:return ne;default:var Se=ne&&ne.$$typeof;switch(Se){case p:case m:case B:case E:case i:return Se;default:return V}}case r:return V}}}var l=y,$=f,U=p,z=i,ie=n,ae=m,ee=a,ce=B,le=E,J=r,ue=o,K=u,X=x,te=!1;function de(c){return te||(te=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")),s(c)||N(c)===y}function s(c){return N(c)===f}function d(c){return N(c)===p}function T(c){return N(c)===i}function k(c){return typeof c=="object"&&c!==null&&c.$$typeof===n}function b(c){return N(c)===m}function A(c){return N(c)===a}function S(c){return N(c)===B}function C(c){return N(c)===E}function I(c){return N(c)===r}function D(c){return N(c)===o}function P(c){return N(c)===u}function F(c){return N(c)===x}M.AsyncMode=l,M.ConcurrentMode=$,M.ContextConsumer=U,M.ContextProvider=z,M.Element=ie,M.ForwardRef=ae,M.Fragment=ee,M.Lazy=ce,M.Memo=le,M.Portal=J,M.Profiler=ue,M.StrictMode=K,M.Suspense=X,M.isAsyncMode=de,M.isConcurrentMode=s,M.isContextConsumer=d,M.isContextProvider=T,M.isElement=k,M.isForwardRef=b,M.isFragment=A,M.isLazy=S,M.isMemo=C,M.isPortal=I,M.isProfiler=D,M.isStrictMode=P,M.isSuspense=F,M.isValidElementType=q,M.typeOf=N}()),M}var Ie;function Ne(){return Ie||(Ie=1,process.env.NODE_ENV==="production"?se.exports=dt():se.exports=pt()),se.exports}/*
 object-assign
 (c) Sindre Sorhus
 @license MIT
-*/var fe,Pe;function ft(){if(Pe)return fe;Pe=1;var e=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,n=Object.prototype.propertyIsEnumerable;function a(o){if(o==null)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(o)}function u(){try{if(!Object.assign)return!1;var o=new String("abc");if(o[5]="de",Object.getOwnPropertyNames(o)[0]==="5")return!1;for(var i={},p=0;p<10;p++)i["_"+String.fromCharCode(p)]=p;var y=Object.getOwnPropertyNames(i).map(function(m){return i[m]});if(y.join("")!=="0123456789")return!1;var f={};return"abcdefghijklmnopqrst".split("").forEach(function(m){f[m]=m}),Object.keys(Object.assign({},f)).join("")==="abcdefghijklmnopqrst"}catch{return!1}}return fe=u()?Object.assign:function(o,i){for(var p,y=a(o),f,m=1;m<arguments.length;m++){p=Object(arguments[m]);for(var x in p)r.call(p,x)&&(y[x]=p[x]);if(e){f=e(p);for(var R=0;R<f.length;R++)n.call(p,f[R])&&(y[f[R]]=p[f[R]])}}return y},fe}var xe,Oe;function be(){if(Oe)return xe;Oe=1;var e="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";return xe=e,xe}var me,Me;function Le(){return Me||(Me=1,me=Function.call.bind(Object.prototype.hasOwnProperty)),me}var he,De;function xt(){if(De)return he;De=1;var e=function(){};if(process.env.NODE_ENV!=="production"){var r=be(),n={},a=Le();e=function(o){var i="Warning: "+o;typeof console<"u"&&console.error(i);try{throw new Error(i)}catch{}}}function u(o,i,p,y,f){if(process.env.NODE_ENV!=="production"){for(var m in o)if(a(o,m)){var x;try{if(typeof o[m]!="function"){var R=Error((y||"React class")+": "+p+" type `"+m+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof o[m]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw R.name="Invariant Violation",R}x=o[m](i,m,y,p,null,r)}catch(B){x=B}if(x&&!(x instanceof Error)&&e((y||"React class")+": type specification of "+p+" `"+m+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof x+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."),x instanceof Error&&!(x.message in n)){n[x.message]=!0;var E=f?f():"";e("Failed "+p+" type: "+x.message+(E??""))}}}}return u.resetWarningCache=function(){process.env.NODE_ENV!=="production"&&(n={})},he=u,he}var ye,Be;function mt(){if(Be)return ye;Be=1;var e=Ne(),r=ft(),n=be(),a=Le(),u=xt(),o=function(){};process.env.NODE_ENV!=="production"&&(o=function(p){var y="Warning: "+p;typeof console<"u"&&console.error(y);try{throw new Error(y)}catch{}});function i(){return null}return ye=function(p,y){var f=typeof Symbol=="function"&&Symbol.iterator,m="@@iterator";function x(s){var d=s&&(f&&s[f]||s[m]);if(typeof d=="function")return d}var R="<<anonymous>>",E={array:j("array"),bigint:j("bigint"),bool:j("boolean"),func:j("function"),number:j("number"),object:j("object"),string:j("string"),symbol:j("symbol"),any:H(),arrayOf:q,element:N(),elementType:l(),instanceOf:$,node:ae(),objectOf:z,oneOf:U,oneOfType:ie,shape:ce,exact:le};function B(s,d){return s===d?s!==0||1/s===1/d:s!==s&&d!==d}function w(s,d){this.message=s,this.data=d&&typeof d=="object"?d:{},this.stack=""}w.prototype=Error.prototype;function _(s){if(process.env.NODE_ENV!=="production")var d={},T=0;function k(A,S,C,I,D,P,F){if(I=I||R,P=P||C,F!==n){if(y){var c=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");throw c.name="Invariant Violation",c}else if(process.env.NODE_ENV!=="production"&&typeof console<"u"){var V=I+":"+C;!d[V]&&T<3&&(o("You are manually calling a React.PropTypes validation function for the `"+P+"` prop on `"+I+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),d[V]=!0,T++)}}return S[C]==null?A?S[C]===null?new w("The "+D+" `"+P+"` is marked as required "+("in `"+I+"`, but its value is `null`.")):new w("The "+D+" `"+P+"` is marked as required in "+("`"+I+"`, but its value is `undefined`.")):null:s(S,C,I,D,P)}var b=k.bind(null,!1);return b.isRequired=k.bind(null,!0),b}function j(s){function d(T,k,b,A,S,C){var I=T[k],D=K(I);if(D!==s){var P=X(I);return new w("Invalid "+A+" `"+S+"` of type "+("`"+P+"` supplied to `"+b+"`, expected ")+("`"+s+"`."),{expectedType:s})}return null}return _(d)}function H(){return _(i)}function q(s){function d(T,k,b,A,S){if(typeof s!="function")return new w("Property `"+S+"` of component `"+b+"` has invalid PropType notation inside arrayOf.");var C=T[k];if(!Array.isArray(C)){var I=K(C);return new w("Invalid "+A+" `"+S+"` of type "+("`"+I+"` supplied to `"+b+"`, expected an array."))}for(var D=0;D<C.length;D++){var P=s(C,D,b,A,S+"["+D+"]",n);if(P instanceof Error)return P}return null}return _(d)}function N(){function s(d,T,k,b,A){var S=d[T];if(!p(S)){var C=K(S);return new w("Invalid "+b+" `"+A+"` of type "+("`"+C+"` supplied to `"+k+"`, expected a single ReactElement."))}return null}return _(s)}function l(){function s(d,T,k,b,A){var S=d[T];if(!e.isValidElementType(S)){var C=K(S);return new w("Invalid "+b+" `"+A+"` of type "+("`"+C+"` supplied to `"+k+"`, expected a single ReactElement type."))}return null}return _(s)}function $(s){function d(T,k,b,A,S){if(!(T[k]instanceof s)){var C=s.name||R,I=de(T[k]);return new w("Invalid "+A+" `"+S+"` of type "+("`"+I+"` supplied to `"+b+"`, expected ")+("instance of `"+C+"`."))}return null}return _(d)}function U(s){if(!Array.isArray(s))return process.env.NODE_ENV!=="production"&&(arguments.length>1?o("Invalid arguments supplied to oneOf, expected an array, got "+arguments.length+" arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."):o("Invalid argument supplied to oneOf, expected an array.")),i;function d(T,k,b,A,S){for(var C=T[k],I=0;I<s.length;I++)if(B(C,s[I]))return null;var D=JSON.stringify(s,function(F,c){var V=X(c);return V==="symbol"?String(c):c});return new w("Invalid "+A+" `"+S+"` of value `"+String(C)+"` "+("supplied to `"+b+"`, expected one of "+D+"."))}return _(d)}function z(s){function d(T,k,b,A,S){if(typeof s!="function")return new w("Property `"+S+"` of component `"+b+"` has invalid PropType notation inside objectOf.");var C=T[k],I=K(C);if(I!=="object")return new w("Invalid "+A+" `"+S+"` of type "+("`"+I+"` supplied to `"+b+"`, expected an object."));for(var D in C)if(a(C,D)){var P=s(C,D,b,A,S+"."+D,n);if(P instanceof Error)return P}return null}return _(d)}function ie(s){if(!Array.isArray(s))return process.env.NODE_ENV!=="production"&&o("Invalid argument supplied to oneOfType, expected an instance of array."),i;for(var d=0;d<s.length;d++){var T=s[d];if(typeof T!="function")return o("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+te(T)+" at index "+d+"."),i}function k(b,A,S,C,I){for(var D=[],P=0;P<s.length;P++){var F=s[P],c=F(b,A,S,C,I,n);if(c==null)return null;c.data&&a(c.data,"expectedType")&&D.push(c.data.expectedType)}var V=D.length>0?", expected one of type ["+D.join(", ")+"]":"";return new w("Invalid "+C+" `"+I+"` supplied to "+("`"+S+"`"+V+"."))}return _(k)}function ae(){function s(d,T,k,b,A){return J(d[T])?null:new w("Invalid "+b+" `"+A+"` supplied to "+("`"+k+"`, expected a ReactNode."))}return _(s)}function ee(s,d,T,k,b){return new w((s||"React class")+": "+d+" type `"+T+"."+k+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+b+"`.")}function ce(s){function d(T,k,b,A,S){var C=T[k],I=K(C);if(I!=="object")return new w("Invalid "+A+" `"+S+"` of type `"+I+"` "+("supplied to `"+b+"`, expected `object`."));for(var D in s){var P=s[D];if(typeof P!="function")return ee(b,A,S,D,X(P));var F=P(C,D,b,A,S+"."+D,n);if(F)return F}return null}return _(d)}function le(s){function d(T,k,b,A,S){var C=T[k],I=K(C);if(I!=="object")return new w("Invalid "+A+" `"+S+"` of type `"+I+"` "+("supplied to `"+b+"`, expected `object`."));var D=r({},T[k],s);for(var P in D){var F=s[P];if(a(s,P)&&typeof F!="function")return ee(b,A,S,P,X(F));if(!F)return new w("Invalid "+A+" `"+S+"` key `"+P+"` supplied to `"+b+"`.\nBad object: "+JSON.stringify(T[k],null,"  ")+`
-Valid keys: `+JSON.stringify(Object.keys(s),null,"  "));var c=F(C,P,b,A,S+"."+P,n);if(c)return c}return null}return _(d)}function J(s){switch(typeof s){case"number":case"string":case"undefined":return!0;case"boolean":return!s;case"object":if(Array.isArray(s))return s.every(J);if(s===null||p(s))return!0;var d=x(s);if(d){var T=d.call(s),k;if(d!==s.entries){for(;!(k=T.next()).done;)if(!J(k.value))return!1}else for(;!(k=T.next()).done;){var b=k.value;if(b&&!J(b[1]))return!1}}else return!1;return!0;default:return!1}}function ue(s,d){return s==="symbol"?!0:d?d["@@toStringTag"]==="Symbol"||typeof Symbol=="function"&&d instanceof Symbol:!1}function K(s){var d=typeof s;return Array.isArray(s)?"array":s instanceof RegExp?"object":ue(d,s)?"symbol":d}function X(s){if(typeof s>"u"||s===null)return""+s;var d=K(s);if(d==="object"){if(s instanceof Date)return"date";if(s instanceof RegExp)return"regexp"}return d}function te(s){var d=X(s);switch(d){case"array":case"object":return"an "+d;case"boolean":case"date":case"regexp":return"a "+d;default:return d}}function de(s){return!s.constructor||!s.constructor.name?R:s.constructor.name}return E.checkPropTypes=u,E.resetWarningCache=u.resetWarningCache,E.PropTypes=E,E},ye}var ve,qe;function ht(){if(qe)return ve;qe=1;var e=be();function r(){}function n(){}return n.resetWarningCache=r,ve=function(){function a(i,p,y,f,m,x){if(x!==e){var R=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw R.name="Invariant Violation",R}}a.isRequired=a;function u(){return a}var o={array:a,bigint:a,bool:a,func:a,number:a,object:a,string:a,symbol:a,any:a,arrayOf:u,element:a,elementType:a,instanceOf:u,node:a,objectOf:u,oneOf:u,oneOfType:u,shape:u,exact:u,checkPropTypes:n,resetWarningCache:r};return o.PropTypes=o,o},ve}if(process.env.NODE_ENV!=="production"){var yt=Ne(),vt=!0;ge.exports=mt()(yt.isElement,vt)}else ge.exports=ht()();var gt=ge.exports;const W=rt.getDefaultExportFromCjs(gt);let Fe,We;typeof document<"u"&&(Fe=document);typeof window<"u"&&(We=window);const Ye=g.createContext({document:Fe,window:We}),Re=()=>g.useContext(Ye),{Provider:Et,Consumer:$t}=Ye;class Ue extends g.Component{componentDidMount(){this.props.contentDidMount()}componentDidUpdate(){this.props.contentDidUpdate()}render(){return g.Children.only(this.props.children)}}Z(Ue,"propTypes",{children:W.element.isRequired,contentDidMount:W.func.isRequired,contentDidUpdate:W.func.isRequired});class Ee extends g.Component{constructor(n,a){super(n,a);Z(this,"setRef",n=>{this.nodeRef.current=n;const{forwardedRef:a}=this.props;typeof a=="function"?a(n):a&&(a.current=n)});Z(this,"handleLoad",()=>{clearInterval(this.loadCheck),this.state.iframeLoaded||this.setState({iframeLoaded:!0})});Z(this,"loadCheck",()=>setInterval(()=>{this.handleLoad()},500));this._isMounted=!1,this.nodeRef=g.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 n=this.getDoc();return this.props.mountTarget?n.querySelector(this.props.mountTarget):n.body.children[0]}renderFrameContents(){if(!this._isMounted)return null;const n=this.getDoc();if(!n)return null;const a=this.props.contentDidMount,u=this.props.contentDidUpdate,o=n.defaultView||n.parentView,i=t.jsxRuntimeExports.jsx(Ue,{contentDidMount:a,contentDidUpdate:u,children:t.jsxRuntimeExports.jsx(Et,{value:{document:n,window:o},children:t.jsxRuntimeExports.jsx("div",{className:"frame-content",children:this.props.children})})}),p=this.getMountTarget();return[ke.createPortal(this.props.head,this.getDoc().head),ke.createPortal(i,p)]}render(){const n={...this.props,srcDoc:this.props.initialContent,children:void 0};return delete n.head,delete n.initialContent,delete n.mountTarget,delete n.contentDidMount,delete n.contentDidUpdate,delete n.forwardedRef,t.jsxRuntimeExports.jsx("iframe",{...n,ref:this.setRef,onLoad:this.handleLoad,children:this.state.iframeLoaded&&this.renderFrameContents()})}}Z(Ee,"propTypes",{style:W.object,head:W.node,initialContent:W.string,mountTarget:W.string,contentDidMount:W.func,contentDidUpdate:W.func,children:W.oneOfType([W.element,W.arrayOf(W.element)])}),Z(Ee,"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 jt=g.forwardRef((e,r)=>t.jsxRuntimeExports.jsx(Ee,{...e,forwardedRef:r})),bt=({children:e})=>{const{document:r}=Re(),[n]=h.useSelectedBlockIds(),[a,u]=h.useSelectedStylingBlocks();return g.useEffect(()=>{setTimeout(()=>{if(!v.isEmpty(a))return;const o=ze(r,v.first(n));if(o){const i=o.getAttribute("data-style-prop");if(i){const p=o.getAttribute("data-style-id"),y=o.getAttribute("data-block-parent");u([{id:p,prop:i,blockId:y}])}}},100)},[r,n,u,a]),t.jsxRuntimeExports.jsx("div",{id:"canvas",className:"relative h-screen max-w-full outline-2",children:e})},ze=(e,r)=>e.querySelector(`[data-block-id="${r}"]`),Rt=()=>{const{window:e}=Re(),[r,n]=h.useSelectedBlockIds(),[,a]=h.useSelectedStylingBlocks(),{undo:u,redo:o}=h.useCanvasHistory(),i=h.useDuplicateBlocks(),[,p]=h.useCutBlockIds(),[,y]=h.useCopyBlockIds(),{pasteBlocks:f}=h.usePasteBlocks(),[,m]=h.usePreviewMode(),x=h.useRemoveBlocks(),{savePage:R}=h.useSavePage(),[E]=Q.useAtom(h.inlineEditingActiveAtom),[,B]=Q.useAtom(h.editLayerNameAtom),w=_=>{_.key==="Enter"&&(_.preventDefault(),r.length===1&&B(v.first(r)))};return g.useEffect(()=>{const _=j=>{if(j.key==="Escape"){n([]),a([]);return}if(w(j),!E&&(j.key==="Delete"||j.key==="Backspace")&&(j.preventDefault(),x(r)),j.ctrlKey||j.metaKey){if(["z","y","d","x","c","p","s","v"].includes(j.key)){if(E&&["x","z","v"].includes(j.key))return!0;j.preventDefault()}j.key==="s"&&(j.stopPropagation(),j.preventDefault(),R()),j.key==="z"&&u(),j.key==="y"&&o(),j.key==="d"&&i(r),j.key==="x"&&p(r),j.key==="c"&&y(r),j.key==="v"&&r.length>0&&f(r[0])}};return e.removeEventListener("keydown",_),e.addEventListener("keydown",_),()=>{e.removeEventListener("keydown",_)}},[r,n,u,x,m,o,i,p,y,f,E,R,e]),null},St=({block:e,label:r})=>{const[,n]=Xe.useDrag(()=>({type:"CANVAS_BLOCK",item:e}));return t.jsxRuntimeExports.jsxs("div",{className:"mr-10 flex cursor-grab items-center space-x-1 px-1",ref:n,onDragStart:()=>{console.log("drag start")},children:[t.jsxRuntimeExports.jsx(Y.DragHandleDots2Icon,{}),r]})},wt=({selectedBlockElement:e,block:r})=>{const n=h.useRemoveBlocks(),a=h.useDuplicateBlocks(),[,u]=h.useSelectedBlockIds(),[,o]=h.useSelectedStylingBlocks(),{floatingStyles:i,refs:p,update:y}=we.useFloating({placement:"top-start",middleware:[we.shift(),Ge.flip()],elements:{reference:e}});Ze.useResizeObserver(e,()=>y(),e!==null);const f=v.get(r,"_parent",null),m=v.isEmpty(v.get(r,"_name",""))?v.get(r,"_type",""):v.get(r,"_name","");return!e||!r?null:t.jsxRuntimeExports.jsxs("div",{role:"button",tabIndex:0,ref:p.setFloating,style:i,onClick:x=>{x.stopPropagation(),x.preventDefault()},onKeyDown:x=>x.stopPropagation(),className:"z-50 flex h-6 items-center bg-blue-500  py-2 text-xs text-white",children:[t.jsxRuntimeExports.jsx(St,{label:m,block:r}),t.jsxRuntimeExports.jsxs("div",{className:"flex gap-2 px-1 ",children:[f&&t.jsxRuntimeExports.jsx(Y.ArrowUpIcon,{className:"hover:scale-105 ",onClick:()=>{o([]),u([f])}}),h.canDuplicateBlock(v.get(r,"_type",""))?t.jsxRuntimeExports.jsx(Y.CopyIcon,{className:"hover:scale-105 ",onClick:()=>a([r==null?void 0:r._id])}):null,h.canDeleteBlock(v.get(r,"_type",""))?t.jsxRuntimeExports.jsx(Y.TrashIcon,{className:"hover:scale-105 ",onClick:()=>n([r==null?void 0:r._id])}):null]})]})},kt=({model:e})=>{const[r]=h.useBrandingOptions(),[n]=h.useSelectedBlockIds(),[a]=h.useDarkMode(),[u]=h.useHighlightBlockId(),[o]=h.useSelectedStylingBlocks(),{document:i,window:p}=Re(),[y]=g.useState(i==null?void 0:i.getElementById("highlighted-block")),[f]=g.useState(i==null?void 0:i.getElementById("selected-block")),[m]=g.useState(i==null?void 0:i.getElementById("selected-styling-block"));g.useEffect(()=>{a?i==null||i.documentElement.classList.add("dark"):i==null||i.documentElement.classList.remove("dark")},[a,i]);const x=v.get(r,"_headingFont","DM Sans"),R=v.get(r,"_bodyFont","DM Sans");return g.useEffect(()=>{const E=v.get(r,"_primaryColor","#000"),B=v.get(r,"_secondaryColor","#FFF"),w=Je.tailwindcssPaletteGenerator({colors:[E,B],names:["primary","secondary"]});w.primary.DEFAULT=E,w.secondary.DEFAULT=B;const _=v.get(r,"_roundedCorners","0");!p||!p.tailwind||(p.tailwind.config={darkMode:"class",theme:{fontFamily:{heading:[x],body:[R]},extend:{borderRadius:{global:`${_||"0"}px`},colors:w}},plugins:[p.tailwind.plugin.withOptions(({prefix:j="ui"}={})=>({addVariant:H})=>{for(const q of["open","checked","selected","active","disabled"])H(`${j}-${q}`,[`&[data-headlessui-state~="${q}"]`,`:where([data-headlessui-state~="${q}"]) &`]),H(`${j}-not-${q}`,[`&[data-headlessui-state]:not([data-headlessui-state~="${q}"])`,`:where([data-headlessui-state]:not([data-headlessui-state~="${q}"])) &:not([data-headlessui-state])`])})]})},[r,p,x,R]),g.useEffect(()=>{f&&(f.textContent=`${v.map(n,E=>`[data-block-id="${E}"]`).join(",")}{
-                outline: 1px solid ${n.length===1?"#42a1fc":"orange"} !important; outline-offset: -1px;
-            }`)},[n,f]),g.useEffect(()=>{y&&(y.textContent=u?`[data-style-id="${u}"]{ outline: 1px solid orange !important; outline-offset: -1px;}`:"")},[u,n,y]),g.useEffect(()=>{m&&(m.textContent=`${v.map(o,({id:E})=>`[data-style-id="${E}"]`).join(",")}{
+*/var fe,Pe;function ft(){if(Pe)return fe;Pe=1;var e=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;function a(o){if(o==null)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(o)}function u(){try{if(!Object.assign)return!1;var o=new String("abc");if(o[5]="de",Object.getOwnPropertyNames(o)[0]==="5")return!1;for(var i={},p=0;p<10;p++)i["_"+String.fromCharCode(p)]=p;var y=Object.getOwnPropertyNames(i).map(function(m){return i[m]});if(y.join("")!=="0123456789")return!1;var f={};return"abcdefghijklmnopqrst".split("").forEach(function(m){f[m]=m}),Object.keys(Object.assign({},f)).join("")==="abcdefghijklmnopqrst"}catch{return!1}}return fe=u()?Object.assign:function(o,i){for(var p,y=a(o),f,m=1;m<arguments.length;m++){p=Object(arguments[m]);for(var x in p)n.call(p,x)&&(y[x]=p[x]);if(e){f=e(p);for(var R=0;R<f.length;R++)r.call(p,f[R])&&(y[f[R]]=p[f[R]])}}return y},fe}var xe,Oe;function be(){if(Oe)return xe;Oe=1;var e="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";return xe=e,xe}var me,Me;function Le(){return Me||(Me=1,me=Function.call.bind(Object.prototype.hasOwnProperty)),me}var he,De;function xt(){if(De)return he;De=1;var e=function(){};if(process.env.NODE_ENV!=="production"){var n=be(),r={},a=Le();e=function(o){var i="Warning: "+o;typeof console<"u"&&console.error(i);try{throw new Error(i)}catch{}}}function u(o,i,p,y,f){if(process.env.NODE_ENV!=="production"){for(var m in o)if(a(o,m)){var x;try{if(typeof o[m]!="function"){var R=Error((y||"React class")+": "+p+" type `"+m+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof o[m]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw R.name="Invariant Violation",R}x=o[m](i,m,y,p,null,n)}catch(B){x=B}if(x&&!(x instanceof Error)&&e((y||"React class")+": type specification of "+p+" `"+m+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof x+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."),x instanceof Error&&!(x.message in r)){r[x.message]=!0;var E=f?f():"";e("Failed "+p+" type: "+x.message+(E??""))}}}}return u.resetWarningCache=function(){process.env.NODE_ENV!=="production"&&(r={})},he=u,he}var ye,Be;function mt(){if(Be)return ye;Be=1;var e=Ne(),n=ft(),r=be(),a=Le(),u=xt(),o=function(){};process.env.NODE_ENV!=="production"&&(o=function(p){var y="Warning: "+p;typeof console<"u"&&console.error(y);try{throw new Error(y)}catch{}});function i(){return null}return ye=function(p,y){var f=typeof Symbol=="function"&&Symbol.iterator,m="@@iterator";function x(s){var d=s&&(f&&s[f]||s[m]);if(typeof d=="function")return d}var R="<<anonymous>>",E={array:j("array"),bigint:j("bigint"),bool:j("boolean"),func:j("function"),number:j("number"),object:j("object"),string:j("string"),symbol:j("symbol"),any:H(),arrayOf:q,element:N(),elementType:l(),instanceOf:$,node:ae(),objectOf:z,oneOf:U,oneOfType:ie,shape:ce,exact:le};function B(s,d){return s===d?s!==0||1/s===1/d:s!==s&&d!==d}function w(s,d){this.message=s,this.data=d&&typeof d=="object"?d:{},this.stack=""}w.prototype=Error.prototype;function _(s){if(process.env.NODE_ENV!=="production")var d={},T=0;function k(A,S,C,I,D,P,F){if(I=I||R,P=P||C,F!==r){if(y){var c=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");throw c.name="Invariant Violation",c}else if(process.env.NODE_ENV!=="production"&&typeof console<"u"){var V=I+":"+C;!d[V]&&T<3&&(o("You are manually calling a React.PropTypes validation function for the `"+P+"` prop on `"+I+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),d[V]=!0,T++)}}return S[C]==null?A?S[C]===null?new w("The "+D+" `"+P+"` is marked as required "+("in `"+I+"`, but its value is `null`.")):new w("The "+D+" `"+P+"` is marked as required in "+("`"+I+"`, but its value is `undefined`.")):null:s(S,C,I,D,P)}var b=k.bind(null,!1);return b.isRequired=k.bind(null,!0),b}function j(s){function d(T,k,b,A,S,C){var I=T[k],D=K(I);if(D!==s){var P=X(I);return new w("Invalid "+A+" `"+S+"` of type "+("`"+P+"` supplied to `"+b+"`, expected ")+("`"+s+"`."),{expectedType:s})}return null}return _(d)}function H(){return _(i)}function q(s){function d(T,k,b,A,S){if(typeof s!="function")return new w("Property `"+S+"` of component `"+b+"` has invalid PropType notation inside arrayOf.");var C=T[k];if(!Array.isArray(C)){var I=K(C);return new w("Invalid "+A+" `"+S+"` of type "+("`"+I+"` supplied to `"+b+"`, expected an array."))}for(var D=0;D<C.length;D++){var P=s(C,D,b,A,S+"["+D+"]",r);if(P instanceof Error)return P}return null}return _(d)}function N(){function s(d,T,k,b,A){var S=d[T];if(!p(S)){var C=K(S);return new w("Invalid "+b+" `"+A+"` of type "+("`"+C+"` supplied to `"+k+"`, expected a single ReactElement."))}return null}return _(s)}function l(){function s(d,T,k,b,A){var S=d[T];if(!e.isValidElementType(S)){var C=K(S);return new w("Invalid "+b+" `"+A+"` of type "+("`"+C+"` supplied to `"+k+"`, expected a single ReactElement type."))}return null}return _(s)}function $(s){function d(T,k,b,A,S){if(!(T[k]instanceof s)){var C=s.name||R,I=de(T[k]);return new w("Invalid "+A+" `"+S+"` of type "+("`"+I+"` supplied to `"+b+"`, expected ")+("instance of `"+C+"`."))}return null}return _(d)}function U(s){if(!Array.isArray(s))return process.env.NODE_ENV!=="production"&&(arguments.length>1?o("Invalid arguments supplied to oneOf, expected an array, got "+arguments.length+" arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."):o("Invalid argument supplied to oneOf, expected an array.")),i;function d(T,k,b,A,S){for(var C=T[k],I=0;I<s.length;I++)if(B(C,s[I]))return null;var D=JSON.stringify(s,function(F,c){var V=X(c);return V==="symbol"?String(c):c});return new w("Invalid "+A+" `"+S+"` of value `"+String(C)+"` "+("supplied to `"+b+"`, expected one of "+D+"."))}return _(d)}function z(s){function d(T,k,b,A,S){if(typeof s!="function")return new w("Property `"+S+"` of component `"+b+"` has invalid PropType notation inside objectOf.");var C=T[k],I=K(C);if(I!=="object")return new w("Invalid "+A+" `"+S+"` of type "+("`"+I+"` supplied to `"+b+"`, expected an object."));for(var D in C)if(a(C,D)){var P=s(C,D,b,A,S+"."+D,r);if(P instanceof Error)return P}return null}return _(d)}function ie(s){if(!Array.isArray(s))return process.env.NODE_ENV!=="production"&&o("Invalid argument supplied to oneOfType, expected an instance of array."),i;for(var d=0;d<s.length;d++){var T=s[d];if(typeof T!="function")return o("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+te(T)+" at index "+d+"."),i}function k(b,A,S,C,I){for(var D=[],P=0;P<s.length;P++){var F=s[P],c=F(b,A,S,C,I,r);if(c==null)return null;c.data&&a(c.data,"expectedType")&&D.push(c.data.expectedType)}var V=D.length>0?", expected one of type ["+D.join(", ")+"]":"";return new w("Invalid "+C+" `"+I+"` supplied to "+("`"+S+"`"+V+"."))}return _(k)}function ae(){function s(d,T,k,b,A){return J(d[T])?null:new w("Invalid "+b+" `"+A+"` supplied to "+("`"+k+"`, expected a ReactNode."))}return _(s)}function ee(s,d,T,k,b){return new w((s||"React class")+": "+d+" type `"+T+"."+k+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+b+"`.")}function ce(s){function d(T,k,b,A,S){var C=T[k],I=K(C);if(I!=="object")return new w("Invalid "+A+" `"+S+"` of type `"+I+"` "+("supplied to `"+b+"`, expected `object`."));for(var D in s){var P=s[D];if(typeof P!="function")return ee(b,A,S,D,X(P));var F=P(C,D,b,A,S+"."+D,r);if(F)return F}return null}return _(d)}function le(s){function d(T,k,b,A,S){var C=T[k],I=K(C);if(I!=="object")return new w("Invalid "+A+" `"+S+"` of type `"+I+"` "+("supplied to `"+b+"`, expected `object`."));var D=n({},T[k],s);for(var P in D){var F=s[P];if(a(s,P)&&typeof F!="function")return ee(b,A,S,P,X(F));if(!F)return new w("Invalid "+A+" `"+S+"` key `"+P+"` supplied to `"+b+"`.\nBad object: "+JSON.stringify(T[k],null,"  ")+`
+Valid keys: `+JSON.stringify(Object.keys(s),null,"  "));var c=F(C,P,b,A,S+"."+P,r);if(c)return c}return null}return _(d)}function J(s){switch(typeof s){case"number":case"string":case"undefined":return!0;case"boolean":return!s;case"object":if(Array.isArray(s))return s.every(J);if(s===null||p(s))return!0;var d=x(s);if(d){var T=d.call(s),k;if(d!==s.entries){for(;!(k=T.next()).done;)if(!J(k.value))return!1}else for(;!(k=T.next()).done;){var b=k.value;if(b&&!J(b[1]))return!1}}else return!1;return!0;default:return!1}}function ue(s,d){return s==="symbol"?!0:d?d["@@toStringTag"]==="Symbol"||typeof Symbol=="function"&&d instanceof Symbol:!1}function K(s){var d=typeof s;return Array.isArray(s)?"array":s instanceof RegExp?"object":ue(d,s)?"symbol":d}function X(s){if(typeof s>"u"||s===null)return""+s;var d=K(s);if(d==="object"){if(s instanceof Date)return"date";if(s instanceof RegExp)return"regexp"}return d}function te(s){var d=X(s);switch(d){case"array":case"object":return"an "+d;case"boolean":case"date":case"regexp":return"a "+d;default:return d}}function de(s){return!s.constructor||!s.constructor.name?R:s.constructor.name}return E.checkPropTypes=u,E.resetWarningCache=u.resetWarningCache,E.PropTypes=E,E},ye}var ve,qe;function ht(){if(qe)return ve;qe=1;var e=be();function n(){}function r(){}return r.resetWarningCache=n,ve=function(){function a(i,p,y,f,m,x){if(x!==e){var R=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw R.name="Invariant Violation",R}}a.isRequired=a;function u(){return a}var o={array:a,bigint:a,bool:a,func:a,number:a,object:a,string:a,symbol:a,any:a,arrayOf:u,element:a,elementType:a,instanceOf:u,node:a,objectOf:u,oneOf:u,oneOfType:u,shape:u,exact:u,checkPropTypes:r,resetWarningCache:n};return o.PropTypes=o,o},ve}if(process.env.NODE_ENV!=="production"){var yt=Ne(),vt=!0;ge.exports=mt()(yt.isElement,vt)}else ge.exports=ht()();var gt=ge.exports;const W=nt.getDefaultExportFromCjs(gt);let Fe,We;typeof document<"u"&&(Fe=document);typeof window<"u"&&(We=window);const Ye=g.createContext({document:Fe,window:We}),Re=()=>g.useContext(Ye),{Provider:Et,Consumer:$t}=Ye;class Ue extends g.Component{componentDidMount(){this.props.contentDidMount()}componentDidUpdate(){this.props.contentDidUpdate()}render(){return g.Children.only(this.props.children)}}Z(Ue,"propTypes",{children:W.element.isRequired,contentDidMount:W.func.isRequired,contentDidUpdate:W.func.isRequired});class Ee extends g.Component{constructor(r,a){super(r,a);Z(this,"setRef",r=>{this.nodeRef.current=r;const{forwardedRef:a}=this.props;typeof a=="function"?a(r):a&&(a.current=r)});Z(this,"handleLoad",()=>{clearInterval(this.loadCheck),this.state.iframeLoaded||this.setState({iframeLoaded:!0})});Z(this,"loadCheck",()=>setInterval(()=>{this.handleLoad()},500));this._isMounted=!1,this.nodeRef=g.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 r=this.getDoc();return this.props.mountTarget?r.querySelector(this.props.mountTarget):r.body.children[0]}renderFrameContents(){if(!this._isMounted)return null;const r=this.getDoc();if(!r)return null;const a=this.props.contentDidMount,u=this.props.contentDidUpdate,o=r.defaultView||r.parentView,i=t.jsxRuntimeExports.jsx(Ue,{contentDidMount:a,contentDidUpdate:u,children:t.jsxRuntimeExports.jsx(Et,{value:{document:r,window:o},children:t.jsxRuntimeExports.jsx("div",{className:"frame-content",children:this.props.children})})}),p=this.getMountTarget();return[ke.createPortal(this.props.head,this.getDoc().head),ke.createPortal(i,p)]}render(){const r={...this.props,srcDoc:this.props.initialContent,children:void 0};return delete r.head,delete r.initialContent,delete r.mountTarget,delete r.contentDidMount,delete r.contentDidUpdate,delete r.forwardedRef,t.jsxRuntimeExports.jsx("iframe",{...r,ref:this.setRef,onLoad:this.handleLoad,children:this.state.iframeLoaded&&this.renderFrameContents()})}}Z(Ee,"propTypes",{style:W.object,head:W.node,initialContent:W.string,mountTarget:W.string,contentDidMount:W.func,contentDidUpdate:W.func,children:W.oneOfType([W.element,W.arrayOf(W.element)])}),Z(Ee,"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 jt=g.forwardRef((e,n)=>t.jsxRuntimeExports.jsx(Ee,{...e,forwardedRef:n})),bt=({children:e})=>{const{document:n}=Re(),[r]=h.useSelectedBlockIds(),[a,u]=h.useSelectedStylingBlocks();return g.useEffect(()=>{setTimeout(()=>{if(!v.isEmpty(a))return;const o=ze(n,v.first(r));if(o){const i=o.getAttribute("data-style-prop");if(i){const p=o.getAttribute("data-style-id"),y=o.getAttribute("data-block-parent");u([{id:p,prop:i,blockId:y}])}}},100)},[n,r,u,a]),t.jsxRuntimeExports.jsx("div",{id:"canvas",className:"relative h-screen max-w-full outline-2",children:e})},ze=(e,n)=>e.querySelector(`[data-block-id="${n}"]`),Rt=()=>{const{window:e}=Re(),[n,r]=h.useSelectedBlockIds(),[,a]=h.useSelectedStylingBlocks(),{undo:u,redo:o}=h.useCanvasHistory(),i=h.useDuplicateBlocks(),[,p]=h.useCutBlockIds(),[,y]=h.useCopyBlockIds(),{pasteBlocks:f}=h.usePasteBlocks(),[,m]=h.usePreviewMode(),x=h.useRemoveBlocks(),{savePage:R}=h.useSavePage(),[E]=Q.useAtom(h.inlineEditingActiveAtom),[,B]=Q.useAtom(h.editLayerNameAtom),w=_=>{_.key==="Enter"&&(_.preventDefault(),n.length===1&&B(v.first(n)))};return g.useEffect(()=>{const _=j=>{if(j.key==="Escape"){r([]),a([]);return}if(w(j),!E&&(j.key==="Delete"||j.key==="Backspace")&&(j.preventDefault(),x(n)),j.ctrlKey||j.metaKey){if(["z","y","d","x","c","p","s","v"].includes(j.key)){if(E&&["x","z","v"].includes(j.key))return!0;j.preventDefault()}j.key==="s"&&(j.stopPropagation(),j.preventDefault(),R()),j.key==="z"&&u(),j.key==="y"&&o(),j.key==="d"&&i(n),j.key==="x"&&p(n),j.key==="c"&&y(n),j.key==="v"&&n.length>0&&f(n[0])}};return e.removeEventListener("keydown",_),e.addEventListener("keydown",_),()=>{e.removeEventListener("keydown",_)}},[n,r,u,x,m,o,i,p,y,f,E,R,e]),null},St=({block:e,label:n})=>{const[,r]=Xe.useDrag(()=>({type:"CANVAS_BLOCK",item:e}));return t.jsxRuntimeExports.jsxs("div",{className:"mr-10 flex cursor-grab items-center space-x-1 px-1",ref:r,onDragStart:()=>{console.log("drag start")},children:[t.jsxRuntimeExports.jsx(Y.DragHandleDots2Icon,{}),n]})},wt=({selectedBlockElement:e,block:n})=>{const r=h.useRemoveBlocks(),a=h.useDuplicateBlocks(),[,u]=h.useSelectedBlockIds(),[,o]=h.useSelectedStylingBlocks(),{floatingStyles:i,refs:p,update:y}=we.useFloating({placement:"top-start",middleware:[we.shift(),Ge.flip()],elements:{reference:e}});Ze.useResizeObserver(e,()=>y(),e!==null);const f=v.get(n,"_parent",null),m=v.isEmpty(v.get(n,"_name",""))?v.get(n,"_type",""):v.get(n,"_name","");return!e||!n?null:t.jsxRuntimeExports.jsxs("div",{role:"button",tabIndex:0,ref:p.setFloating,style:i,onClick:x=>{x.stopPropagation(),x.preventDefault()},onKeyDown:x=>x.stopPropagation(),className:"z-50 flex h-6 items-center bg-blue-500  py-2 text-xs text-white",children:[t.jsxRuntimeExports.jsx(St,{label:m,block:n}),t.jsxRuntimeExports.jsxs("div",{className:"flex gap-2 px-1 ",children:[f&&t.jsxRuntimeExports.jsx(Y.ArrowUpIcon,{className:"hover:scale-105 ",onClick:()=>{o([]),u([f])}}),h.canDuplicateBlock(v.get(n,"_type",""))?t.jsxRuntimeExports.jsx(Y.CopyIcon,{className:"hover:scale-105 ",onClick:()=>a([n==null?void 0:n._id])}):null,h.canDeleteBlock(v.get(n,"_type",""))?t.jsxRuntimeExports.jsx(Y.TrashIcon,{className:"hover:scale-105 ",onClick:()=>r([n==null?void 0:n._id])}):null]})]})},kt=({model:e})=>{const[n]=h.useBrandingOptions(),[r]=h.useSelectedBlockIds(),[a]=h.useDarkMode(),[u]=h.useHighlightBlockId(),[o]=h.useSelectedStylingBlocks(),{document:i,window:p}=Re(),[y]=g.useState(i==null?void 0:i.getElementById("highlighted-block")),[f]=g.useState(i==null?void 0:i.getElementById("selected-block")),[m]=g.useState(i==null?void 0:i.getElementById("selected-styling-block"));g.useEffect(()=>{a?i==null||i.documentElement.classList.add("dark"):i==null||i.documentElement.classList.remove("dark")},[a,i]);const x=v.get(n,"_headingFont","DM Sans"),R=v.get(n,"_bodyFont","DM Sans");return g.useEffect(()=>{const E=v.get(n,"_primaryColor","#000"),B=v.get(n,"_secondaryColor","#FFF"),w=Je.tailwindcssPaletteGenerator({colors:[E,B],names:["primary","secondary"]});w.primary.DEFAULT=E,w.secondary.DEFAULT=B;const _=v.get(n,"_roundedCorners","0");!p||!p.tailwind||(p.tailwind.config={darkMode:"class",theme:{fontFamily:{heading:[x],body:[R]},extend:{borderRadius:{global:`${_||"0"}px`},colors:w}},plugins:[p.tailwind.plugin.withOptions(({prefix:j="ui"}={})=>({addVariant:H})=>{for(const q of["open","checked","selected","active","disabled"])H(`${j}-${q}`,[`&[data-headlessui-state~="${q}"]`,`:where([data-headlessui-state~="${q}"]) &`]),H(`${j}-not-${q}`,[`&[data-headlessui-state]:not([data-headlessui-state~="${q}"])`,`:where([data-headlessui-state]:not([data-headlessui-state~="${q}"])) &:not([data-headlessui-state])`])})]})},[n,p,x,R]),g.useEffect(()=>{f&&(f.textContent=`${v.map(r,E=>`[data-block-id="${E}"]`).join(",")}{
+                outline: 1px solid ${r.length===1?"#42a1fc":"orange"} !important; outline-offset: -1px;
+            }`)},[r,f]),g.useEffect(()=>{y&&(y.textContent=u?`[data-style-id="${u}"]{ outline: 1px solid orange !important; outline-offset: -1px;}`:"")},[u,r,y]),g.useEffect(()=>{m&&(m.textContent=`${v.map(o,({id:E})=>`[data-style-id="${E}"]`).join(",")}{
                 outline: 1px solid orange !important; outline-offset: -1px;
-            }`)},[o,m]),g.useEffect(()=>{if(e==="section")return;const E=v.get(r,"_bodyTextLightColor","#64748b"),B=v.get(r,"_bodyTextDarkColor","#94a3b8"),w=v.get(r,"_bodyBgLightColor","#FFFFFF"),_=v.get(r,"_bodyBgDarkColor","#0f172a");i.body.className=`font-body antialiased text-[${E}] bg-[${w}] dark:text-[${B}] dark:bg-[${_}]`},[r,i,e]),e==="page"?t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[x&&t.jsxRuntimeExports.jsx("link",{id:"heading-font",rel:"stylesheet",type:"text/css",href:`https://fonts.googleapis.com/css2?family=${x.replace(/ /g,"+")}:wght@300;400;500;600;700;800;900&display=swap`,media:"all"}),R&&x!==R&&t.jsxRuntimeExports.jsx("link",{id:"body-font",rel:"stylesheet",type:"text/css",href:`https://fonts.googleapis.com/css2?family=${R.replace(/ /g,"+")}:wght@300;400;500;600;700;800;900&display=swap`,media:"all"}),x&&t.jsxRuntimeExports.jsx("style",{children:`h1,h2,h3,h4,h5,h6{font-family: "${x}",ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}`})]}):null},Ct=()=>{const{t:e}=$e.useTranslation();return t.jsxRuntimeExports.jsx("div",{className:"my-auto py-24 text-center text-gray-600 dark:text-white",children:t.jsxRuntimeExports.jsx("h1",{className:"mb-10 text-4xl ",children:e("canvas_empty")})})},Tt=e=>{const r={};return Object.keys(e).forEach(n=>{v.isString(e[n])&&e[n].startsWith(oe.SLOT_KEY)&&(r[n]=e[n].replace(oe.SLOT_KEY,"").split(","))}),r},_t=v.memoize(e=>{const r=e.replace(oe.STYLES_KEY,"").split(",");return et.twMerge(r[0],r[1])});function At(e,r){return v.get(e,`${r}_attrs`,{})}function It(e,r,n,a){const u={};return Object.keys(e).forEach(o=>{if(v.isString(e[o])&&e[o].startsWith(oe.STYLES_KEY)){const i=_t(e[o]);u[o]={className:i,"data-style-prop":o,"data-block-parent":e._id,"data-style-id":`${o}-${e._id}`,onMouseEnter:r,onMouseLeave:n,onClick:a,...At(e,o)}}}),u}function je({blocks:e}){const r=h.useAllBlocks(),[,n]=h.useHighlightBlockId(),[,a]=h.useSelectedStylingBlocks(),[,u]=h.useSelectedBlockIds(),o=g.useCallback(f=>{var x;const m=(x=f.currentTarget)==null?void 0:x.getAttribute("data-style-id");n(m||""),f.stopPropagation()},[n]),i=g.useCallback(f=>{n(""),f.stopPropagation()},[n]),p=g.useCallback(f=>{f.stopPropagation();const m=f.currentTarget;if(m.getAttribute("data-block-parent")){const x=m.getAttribute("data-style-prop"),R=m.getAttribute("data-style-id"),E=m.getAttribute("data-block-parent");a([{id:R,prop:x,blockId:E}]),u([E])}else if(m.getAttribute("data-block-id")&&(u([m.getAttribute("data-block-id")]),m.getAttribute("data-block-parent"))){const x=m.getAttribute("data-style-prop"),R=m.getAttribute("data-style-id"),E=m.getAttribute("data-block-parent");a([{id:R,prop:x,blockId:E}])}},[a,u]),y=g.useCallback(f=>It(f,o,i,p),[o,i]);return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:g.Children.toArray(e.map((f,m)=>{const x=Tt(f),R={};v.isEmpty(x)||Object.keys(x).forEach(_=>{R[_]=g.Children.toArray(x[_].map(j=>t.jsxRuntimeExports.jsx(je,{blocks:[v.find(r,{_id:j})]})))});const E=v.filter(r,{_parent:f._id});R.children=E.length?t.jsxRuntimeExports.jsx(je,{blocks:E}):null;const B=tt.getBlockComponent(f._type),w=(B==null?void 0:B.component)||null;return g.createElement(w,{blockProps:{onClick:p,"data-block-id":f._id,"data-block-type":f._type},...f,index:m,...y(f),...R,inBuilder:!0})}))})}const Pt=()=>{const e=h.useAllBlocks();return t.jsxRuntimeExports.jsx(Qe.Provider,{children:e.length?t.jsxRuntimeExports.jsx(je,{blocks:v.filter(e,r=>v.isEmpty(r._parent))}):t.jsxRuntimeExports.jsx(Ct,{})})},Ot=(e,r)=>e.querySelector(`[data-style-id="${r}"]`),Mt=()=>{const[e]=Q.useAtom(h.networkModeAtom),[r]=h.usePreviewMode(),[n]=h.useCanvasWidth(),[,a]=h.useSelectedBlockIds(),u=h.useSelectedBlock(),[,o]=h.useHighlightBlockId(),i=g.useRef(null),p=g.useRef(null),[y,f]=g.useState({width:0,height:0}),m=ut(y),[x,R]=g.useState(0),[E,B]=g.useState([]),[,w]=g.useState([]),[,_]=Q.useAtom(h.canvasIframeAtom),[j,H]=h.useSelectedStylingBlocks(),q=G.useBuilderProp("loadingCanvas",!1);g.useEffect(()=>{const{clientWidth:$,clientHeight:U}=p.current;f({width:$,height:U}),x===0&&R($)},[p,n,x]);const N=($,U=0)=>{const{top:z}=$.getBoundingClientRect();return z+U>=0&&z-U<=window.innerHeight};g.useEffect(()=>{var $,U;if(u&&u.type!=="Multiple"&&i.current){const z=ze(i.current.contentDocument,u._id);z&&(N(z)||(U=($=i.current)==null?void 0:$.contentWindow)==null||U.scrollTo({top:z.offsetTop,behavior:"smooth"}),B([z]))}},[u]),g.useEffect(()=>{if(!v.isEmpty(j)&&i.current){const $=Ot(i.current.contentDocument,v.first(j).id);w($?[$]:[null])}else w([null])},[j]);const l=g.useMemo(()=>{let $=lt;return e==="offline"&&($=$.replace("https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio","/offline/tailwind.cdn.js"),$=$.replace("https://unpkg.com/aos@next/dist/aos.css","/offline/aos.css"),$=$.replace("https://unpkg.com/aos@next/dist/aos.js","/offline/aos.js")),$},[e]);return t.jsxRuntimeExports.jsx("div",{onClick:()=>{a([]),H([])},onMouseLeave:()=>setTimeout(()=>o(""),300),className:"relative mx-auto h-full w-full bg-black/80",style:x>0&&!v.isEmpty(m)?{width:r?"100%":x}:{},ref:p,children:t.jsxRuntimeExports.jsxs(jt,{contentDidMount:()=>_(i.current),ref:i,id:"canvas-iframe",style:{width:`${n}px`,...m},className:"relative mx-auto box-content h-full max-w-full shadow-md transition-all duration-300 ease-linear",initialContent:l,children:[t.jsxRuntimeExports.jsx(Rt,{}),t.jsxRuntimeExports.jsx(wt,{block:u,selectedBlockElement:v.first(E)}),t.jsxRuntimeExports.jsx(kt,{model:"page"}),t.jsxRuntimeExports.jsxs(bt,{children:[q?t.jsxRuntimeExports.jsx("div",{className:"h-full p-4",children:t.jsxRuntimeExports.jsx(G.Skeleton,{className:"h-full"})}):t.jsxRuntimeExports.jsx(Pt,{}),t.jsxRuntimeExports.jsx("div",{className:"h-60"})]})]})})},Dt=g.lazy(()=>Promise.resolve().then(()=>require("./AddBlocks-c27c81fa.cjs"))),Bt=()=>{const e=G.useBuilderProp("mode",pe.STATIC),[r,n]=Q.useAtom(h.addBlocksModalAtom),a={[pe.STATIC]:t.jsxRuntimeExports.jsx(Mt,{}),[pe.FRAMEWORK]:null}[e];return t.jsxRuntimeExports.jsxs("div",{className:"flex h-full w-full flex-col",children:[t.jsxRuntimeExports.jsx(ct,{}),t.jsxRuntimeExports.jsxs("div",{className:"relative flex-1 overflow-hidden bg-slate-800/20 bg-[linear-gradient(to_right,#EEE_0.5px,transparent_0.5px),linear-gradient(to_bottom,#EEE_0.5px,transparent_0.5px)] bg-[size:12px_12px]",children:[t.jsxRuntimeExports.jsx(g.Suspense,{fallback:t.jsxRuntimeExports.jsx(G.Skeleton,{className:"h-full"}),children:t.jsxRuntimeExports.jsx(h.ErrorBoundary,{children:a})}),r?t.jsxRuntimeExports.jsx("div",{onClick:()=>n(!1),className:"absolute inset-0 z-50 flex items-center bg-black/30 backdrop-blur-sm",children:t.jsxRuntimeExports.jsx("div",{onClick:u=>u.stopPropagation(),className:"mx-auto h-[90%] w-[90%] max-w-3xl rounded-md bg-white p-4 shadow-lg shadow-black/10 xl:w-[65%]",children:t.jsxRuntimeExports.jsx(Dt,{})})}):null]})]})};exports.default=Bt;
+            }`)},[o,m]),g.useEffect(()=>{if(e==="section")return;const E=v.get(n,"_bodyTextLightColor","#64748b"),B=v.get(n,"_bodyTextDarkColor","#94a3b8"),w=v.get(n,"_bodyBgLightColor","#FFFFFF"),_=v.get(n,"_bodyBgDarkColor","#0f172a");i.body.className=`font-body antialiased text-[${E}] bg-[${w}] dark:text-[${B}] dark:bg-[${_}]`},[n,i,e]),e==="page"?t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[x&&t.jsxRuntimeExports.jsx("link",{id:"heading-font",rel:"stylesheet",type:"text/css",href:`https://fonts.googleapis.com/css2?family=${x.replace(/ /g,"+")}:wght@300;400;500;600;700;800;900&display=swap`,media:"all"}),R&&x!==R&&t.jsxRuntimeExports.jsx("link",{id:"body-font",rel:"stylesheet",type:"text/css",href:`https://fonts.googleapis.com/css2?family=${R.replace(/ /g,"+")}:wght@300;400;500;600;700;800;900&display=swap`,media:"all"}),x&&t.jsxRuntimeExports.jsx("style",{children:`h1,h2,h3,h4,h5,h6{font-family: "${x}",ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}`})]}):null},Ct=()=>{const{t:e}=$e.useTranslation();return t.jsxRuntimeExports.jsx("div",{className:"my-auto py-24 text-center text-gray-600 dark:text-white",children:t.jsxRuntimeExports.jsx("h1",{className:"mb-10 text-4xl ",children:e("canvas_empty")})})},Tt=e=>{const n={};return Object.keys(e).forEach(r=>{v.isString(e[r])&&e[r].startsWith(oe.SLOT_KEY)&&(n[r]=e[r].replace(oe.SLOT_KEY,"").split(","))}),n},_t=v.memoize(e=>{const n=e.replace(oe.STYLES_KEY,"").split(",");return et.twMerge(n[0],n[1])});function At(e,n){return v.get(e,`${n}_attrs`,{})}function It(e,n,r,a){const u={};return Object.keys(e).forEach(o=>{if(v.isString(e[o])&&e[o].startsWith(oe.STYLES_KEY)){const i=_t(e[o]);u[o]={className:i,"data-style-prop":o,"data-block-parent":e._id,"data-style-id":`${o}-${e._id}`,onMouseEnter:n,onMouseLeave:r,onClick:a,...At(e,o)}}}),u}function je({blocks:e}){const n=h.useAllBlocks(),[,r]=h.useHighlightBlockId(),[,a]=h.useSelectedStylingBlocks(),[,u]=h.useSelectedBlockIds(),o=g.useCallback(f=>{var x;const m=(x=f.currentTarget)==null?void 0:x.getAttribute("data-style-id");r(m||""),f.stopPropagation()},[r]),i=g.useCallback(f=>{r(""),f.stopPropagation()},[r]),p=g.useCallback(f=>{f.stopPropagation();const m=f.currentTarget;if(m.getAttribute("data-block-parent")){const x=m.getAttribute("data-style-prop"),R=m.getAttribute("data-style-id"),E=m.getAttribute("data-block-parent");a([{id:R,prop:x,blockId:E}]),u([E])}else if(m.getAttribute("data-block-id")&&(u([m.getAttribute("data-block-id")]),m.getAttribute("data-block-parent"))){const x=m.getAttribute("data-style-prop"),R=m.getAttribute("data-style-id"),E=m.getAttribute("data-block-parent");a([{id:R,prop:x,blockId:E}])}},[a,u]),y=g.useCallback(f=>It(f,o,i,p),[o,i]);return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:g.Children.toArray(e.map((f,m)=>{const x=Tt(f),R={};v.isEmpty(x)||Object.keys(x).forEach(_=>{R[_]=g.Children.toArray(x[_].map(j=>t.jsxRuntimeExports.jsx(je,{blocks:[v.find(n,{_id:j})]})))});const E=v.filter(n,{_parent:f._id});R.children=E.length?t.jsxRuntimeExports.jsx(je,{blocks:E}):null;const B=tt.getBlockComponent(f._type),w=(B==null?void 0:B.component)||null;return g.createElement(w,{blockProps:{onClick:p,"data-block-id":f._id,"data-block-type":f._type},...f,index:m,...y(f),...R,inBuilder:!0})}))})}const Pt=()=>{const e=h.useAllBlocks();return t.jsxRuntimeExports.jsx(Qe.Provider,{children:e.length?t.jsxRuntimeExports.jsx(je,{blocks:v.filter(e,n=>v.isEmpty(n._parent))}):t.jsxRuntimeExports.jsx(Ct,{})})},Ot=(e,n)=>e.querySelector(`[data-style-id="${n}"]`),Mt=()=>{const[e]=Q.useAtom(h.networkModeAtom),[n]=h.usePreviewMode(),[r]=h.useCanvasWidth(),[,a]=h.useSelectedBlockIds(),u=h.useSelectedBlock(),[,o]=h.useHighlightBlockId(),i=g.useRef(null),p=g.useRef(null),[y,f]=g.useState({width:0,height:0}),m=ut(y),[x,R]=g.useState(0),[E,B]=g.useState([]),[,w]=g.useState([]),[,_]=Q.useAtom(h.canvasIframeAtom),[j,H]=h.useSelectedStylingBlocks(),q=G.useBuilderProp("loadingCanvas",!1);g.useEffect(()=>{const{clientWidth:$,clientHeight:U}=p.current;f({width:$,height:U}),x===0&&R($)},[p,r,x]);const N=($,U=0)=>{const{top:z}=$.getBoundingClientRect();return z+U>=0&&z-U<=window.innerHeight};g.useEffect(()=>{var $,U;if(u&&u.type!=="Multiple"&&i.current){const z=ze(i.current.contentDocument,u._id);z&&(N(z)||(U=($=i.current)==null?void 0:$.contentWindow)==null||U.scrollTo({top:z.offsetTop,behavior:"smooth"}),B([z]))}},[u]),g.useEffect(()=>{if(!v.isEmpty(j)&&i.current){const $=Ot(i.current.contentDocument,v.first(j).id);w($?[$]:[null])}else w([null])},[j]);const l=g.useMemo(()=>{let $=lt;return e==="offline"&&($=$.replace("https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio","/offline/tailwind.cdn.js"),$=$.replace("https://unpkg.com/aos@next/dist/aos.css","/offline/aos.css"),$=$.replace("https://unpkg.com/aos@next/dist/aos.js","/offline/aos.js")),$},[e]);return t.jsxRuntimeExports.jsx("div",{onClick:()=>{a([]),H([])},onMouseLeave:()=>setTimeout(()=>o(""),300),className:"relative mx-auto h-full w-full bg-black/80",style:x>0&&!v.isEmpty(m)?{width:n?"100%":x}:{},ref:p,children:t.jsxRuntimeExports.jsxs(jt,{contentDidMount:()=>_(i.current),ref:i,id:"canvas-iframe",style:{width:`${r}px`,...m},className:"relative mx-auto box-content h-full max-w-full shadow-md transition-all duration-300 ease-linear",initialContent:l,children:[t.jsxRuntimeExports.jsx(Rt,{}),t.jsxRuntimeExports.jsx(wt,{block:u,selectedBlockElement:v.first(E)}),t.jsxRuntimeExports.jsx(kt,{model:"page"}),t.jsxRuntimeExports.jsxs(bt,{children:[q?t.jsxRuntimeExports.jsx("div",{className:"h-full p-4",children:t.jsxRuntimeExports.jsx(G.Skeleton,{className:"h-full"})}):t.jsxRuntimeExports.jsx(Pt,{}),t.jsxRuntimeExports.jsx("div",{className:"h-60"})]})]})})},Dt=g.lazy(()=>Promise.resolve().then(()=>require("./AddBlocks-52d9b4d7.cjs"))),Bt=()=>{const e=G.useBuilderProp("mode",pe.STATIC),[n,r]=Q.useAtom(h.addBlocksModalAtom),a={[pe.STATIC]:t.jsxRuntimeExports.jsx(Mt,{}),[pe.FRAMEWORK]:null}[e];return t.jsxRuntimeExports.jsxs("div",{className:"flex h-full w-full flex-col",children:[t.jsxRuntimeExports.jsx(ct,{}),t.jsxRuntimeExports.jsxs("div",{className:"relative flex-1 overflow-hidden bg-slate-800/20 bg-[linear-gradient(to_right,#EEE_0.5px,transparent_0.5px),linear-gradient(to_bottom,#EEE_0.5px,transparent_0.5px)] bg-[size:12px_12px]",children:[t.jsxRuntimeExports.jsx(g.Suspense,{fallback:t.jsxRuntimeExports.jsx(G.Skeleton,{className:"h-full"}),children:t.jsxRuntimeExports.jsx(h.ErrorBoundary,{children:a})}),n?t.jsxRuntimeExports.jsx("div",{onClick:()=>r(!1),className:"absolute inset-0 z-50 flex items-center bg-black/30 backdrop-blur-sm",children:t.jsxRuntimeExports.jsx("div",{onClick:u=>u.stopPropagation(),className:"mx-auto h-[90%] w-[90%] max-w-3xl rounded-md bg-white p-4 shadow-lg shadow-black/10 xl:w-[65%]",children:t.jsxRuntimeExports.jsx(Dt,{})})}):null]})]})};exports.default=Bt;

package/dist/{ImagesPanel-160aa664.cjs → ImagesPanel-5cde797f.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./jsx-runtime-5c3ac4f7.cjs"),l=require("react"),s=require("./tabs-860e37aa.cjs");require("@radix-ui/react-tabs");require("./utils-3c452dd0.cjs");require("clsx");require("tailwind-merge");const x=l.lazy(()=>Promise.resolve().then(()=>require("./UnsplashImages-04fffeed.cjs"))),i=l.lazy(()=>Promise.resolve().then(()=>require("./UploadImages-43c16a2d.cjs"))),o=({isModalView:a=!1,onSelect:t=()=>{}})=>{const[r,n]=l.useState("unsplash");return e.jsxRuntimeExports.jsxs("div",{className:"flex h-full flex-col",children:[e.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-between rounded-md bg-background/30 p-1",children:e.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:a?"Select or upload images":"Images"})}),e.jsxRuntimeExports.jsxs(s.Tabs,{value:r,onValueChange:u=>n(u),className:"flex h-full w-full flex-col py-2",children:[e.jsxRuntimeExports.jsxs(s.TabsList,{className:"w-full",children:[e.jsxRuntimeExports.jsx(s.TabsTrigger,{value:"unsplash",className:"w-1/2",children:"Unsplash"}),e.jsxRuntimeExports.jsx(s.TabsTrigger,{value:"upload",className:"w-1/2",children:"Upload"})]}),r==="unsplash"?e.jsxRuntimeExports.jsx(s.TabsContent,{value:"unsplash",className:"flex h-full flex-col overflow-hidden",children:e.jsxRuntimeExports.jsx(l.Suspense,{fallback:e.jsxRuntimeExports.jsx("div",{className:"h-64 w-full animate-pulse bg-gray-100"}),children:e.jsxRuntimeExports.jsx(x,{isModalView:a,onSelect:t})})}):e.jsxRuntimeExports.jsx(s.TabsContent,{value:"upload",className:"flex h-full flex-col overflow-hidden",children:e.jsxRuntimeExports.jsx(l.Suspense,{fallback:e.jsxRuntimeExports.jsx("div",{className:"h-64 w-full animate-pulse bg-gray-100"}),children:e.jsxRuntimeExports.jsx(i,{isModalView:a,onSelect:t})})})]})]})},c=o;exports.default=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./jsx-runtime-5c3ac4f7.cjs"),l=require("react"),s=require("./tabs-860e37aa.cjs");require("@radix-ui/react-tabs");require("./utils-3c452dd0.cjs");require("clsx");require("tailwind-merge");const x=l.lazy(()=>Promise.resolve().then(()=>require("./UnsplashImages-1b2310ad.cjs"))),i=l.lazy(()=>Promise.resolve().then(()=>require("./UploadImages-d398bc93.cjs"))),o=({isModalView:a=!1,onSelect:t=()=>{}})=>{const[r,n]=l.useState("unsplash");return e.jsxRuntimeExports.jsxs("div",{className:"flex h-full flex-col",children:[e.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-between rounded-md bg-background/30 p-1",children:e.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:a?"Select or upload images":"Images"})}),e.jsxRuntimeExports.jsxs(s.Tabs,{value:r,onValueChange:u=>n(u),className:"flex h-full w-full flex-col py-2",children:[e.jsxRuntimeExports.jsxs(s.TabsList,{className:"w-full",children:[e.jsxRuntimeExports.jsx(s.TabsTrigger,{value:"unsplash",className:"w-1/2",children:"Unsplash"}),e.jsxRuntimeExports.jsx(s.TabsTrigger,{value:"upload",className:"w-1/2",children:"Upload"})]}),r==="unsplash"?e.jsxRuntimeExports.jsx(s.TabsContent,{value:"unsplash",className:"flex h-full flex-col overflow-hidden",children:e.jsxRuntimeExports.jsx(l.Suspense,{fallback:e.jsxRuntimeExports.jsx("div",{className:"h-64 w-full animate-pulse bg-gray-100"}),children:e.jsxRuntimeExports.jsx(x,{isModalView:a,onSelect:t})})}):e.jsxRuntimeExports.jsx(s.TabsContent,{value:"upload",className:"flex h-full flex-col overflow-hidden",children:e.jsxRuntimeExports.jsx(l.Suspense,{fallback:e.jsxRuntimeExports.jsx("div",{className:"h-64 w-full animate-pulse bg-gray-100"}),children:e.jsxRuntimeExports.jsx(i,{isModalView:a,onSelect:t})})})]})]})},c=o;exports.default=c;

package/dist/{ImagesPanel-815d5e6f.js → ImagesPanel-6595528d.js}

@@ -5,7 +5,7 @@ import "@radix-ui/react-tabs";
 import "./utils-ac68b2c8.js";
 import "clsx";
 import "tailwind-merge";
-const f = o.lazy(() => import("./UnsplashImages-315ce7a8.js")), p = o.lazy(() => import("./UploadImages-f317eef0.js")), x = ({
+const f = o.lazy(() => import("./UnsplashImages-43ec34a9.js")), p = o.lazy(() => import("./UploadImages-1839950f.js")), x = ({
   isModalView: l = !1,
   onSelect: a = () => {
   }

package/dist/Layers-3a270af5.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./jsx-runtime-5c3ac4f7.cjs"),a=require("lodash"),t=require("@radix-ui/react-icons"),B=require("react-dnd"),y=require("@minoru/react-dnd-treeview"),_=require("react-i18next"),x=require("./index-506fb888.cjs"),v=require("./utils-3c452dd0.cjs"),m=require("react"),P=require("./CONTROLS-031e1de3.cjs"),C=require("./dialog-170eaad9.cjs"),u=require("./context-menu-fec580f2.cjs"),S=require("./useBuilderProp-5e57d0c8.cjs"),H=require("./scroll-area-088530b9.cjs"),L=require("jotai");require("i18next");require("flagged");require("react-hotkeys-hook");require("flat-to-nested");require("./Class-0801d193.cjs");require("redux-undo");require("@react-hookz/web");require("@chaibuilder/blocks");require("clsx");require("tailwind-merge");require("@radix-ui/react-dialog");require("@radix-ui/react-context-menu");require("@radix-ui/react-slot");require("class-variance-authority");require("@radix-ui/react-tooltip");require("@radix-ui/react-toast");require("@radix-ui/react-scroll-area");const w=s=>{switch(s.type){case"Image":return e.jsxRuntimeExports.jsx(t.ImageIcon,{});case"Heading":return e.jsxRuntimeExports.jsx(t.HeadingIcon,{});case"Text":return e.jsxRuntimeExports.jsx(t.TextIcon,{});case"Link":return e.jsxRuntimeExports.jsx(t.Link1Icon,{});case"Video":return e.jsxRuntimeExports.jsx(t.VideoIcon,{});case"RichText":return e.jsxRuntimeExports.jsx(t.CursorTextIcon,{});case"Button":return e.jsxRuntimeExports.jsx(t.ButtonIcon,{});case"CustomHTML":return e.jsxRuntimeExports.jsx(t.CodeIcon,{});case"Divider":return e.jsxRuntimeExports.jsx(t.DividerHorizontalIcon,{});case"Icon":return e.jsxRuntimeExports.jsx(t.SketchLogoIcon,{});case"List":return e.jsxRuntimeExports.jsx(t.RowsIcon,{});case"Paragraph":return e.jsxRuntimeExports.jsx(t.TextIcon,{});case"Row":return e.jsxRuntimeExports.jsx(t.RowsIcon,{});case"ListItem":return e.jsxRuntimeExports.jsx(t.ColumnsIcon,{});case"LineBreak":return e.jsxRuntimeExports.jsx(t.SpaceBetweenVerticallyIcon,{});case"Form":return e.jsxRuntimeExports.jsx(t.GroupIcon,{});case"Checkbox":return e.jsxRuntimeExports.jsx(t.CheckboxIcon,{});case"FormButton":return e.jsxRuntimeExports.jsx(t.ButtonIcon,{});case"Input":case"TextArea":return e.jsxRuntimeExports.jsx(t.InputIcon,{});case"Radio":return e.jsxRuntimeExports.jsx(t.RadiobuttonIcon,{});case"Select":return e.jsxRuntimeExports.jsx(t.DropdownMenuIcon,{});case"Table":return e.jsxRuntimeExports.jsx(t.TableIcon,{});case"TableHead":return e.jsxRuntimeExports.jsx(t.BorderTopIcon,{});case"TableBody":return e.jsxRuntimeExports.jsx(t.BorderAllIcon,{});case"TableRow":return e.jsxRuntimeExports.jsx(t.ViewHorizontalIcon,{});case"TableCell":return e.jsxRuntimeExports.jsx(t.DragHandleHorizontalIcon,{});case"Box":return e.jsxRuntimeExports.jsx(t.BoxIcon,{});default:return e.jsxRuntimeExports.jsx(t.BoxModelIcon,{})}};function V(s=""){const n={xs:"390px",sm:"640px",md:"768px",lg:"1024px",xl:"1366px","2xl":"1536px"};if(new RegExp(/\bsr-only\b/).test(s))return"Sr Only";if(new RegExp(/\b(sm|md|lg|xl|2xl):hidden\b/).test(s))return"Visible on mobile";if(s.match(/(^| )hidden( |$)/g)){const i=new RegExp(/\b(sm|md|lg|xl|2xl):(block|grid|flex|inline|inline-grid|inline-flex|inline-block)\b/),l=s.match(i);if(a.nth(l,1))return`Visible >=${n[a.nth(l,1)]}`}return""}const F=s=>{let n="";return Object.keys(s).forEach(r=>{a.startsWith(s[r],P.STYLES_KEY)&&(n=s[r])}),n},z=s=>{var R;const[,n]=x.useHighlightBlockId(),[r]=x.useHiddenBlockIds(),{isSelected:c}=s,{id:i,data:l}=s.node,d=s.depth*10,j=p=>{p.stopPropagation(),s.onToggle(s.node.id)},h=y.useDragOver(i,s.isOpen,s.onToggle),g=m.useMemo(()=>{const p=F(s.node.data);return V(p)},[s.node.data]);return e.jsxRuntimeExports.jsx("div",{onMouseEnter:()=>n(i),className:v.cn("group flex w-full items-center justify-between space-x-px py-px ",c?"bg-blue-500 text-white":"hover:bg-gray-200 dark:hover:bg-gray-800"),onClick:p=>{p.stopPropagation(),!r.includes(i)&&s.onSelect(i)},onContextMenu:()=>s.onSelect(i),style:{paddingInlineStart:d},...h,children:e.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[e.jsxRuntimeExports.jsx("div",{className:`flex h-4 w-4 rotate-0 transform cursor-pointer items-center justify-center text-xs transition-transform duration-100 ${s.isOpen?"rotate-90":""}`,children:s.node.droppable&&e.jsxRuntimeExports.jsx("button",{onClick:j,type:"button",children:e.jsxRuntimeExports.jsx(t.TriangleRightIcon,{})})}),e.jsxRuntimeExports.jsxs("button",{type:"button",className:"flex items-center",children:[e.jsxRuntimeExports.jsx("div",{className:"-mt-1 h-3 w-3",children:e.jsxRuntimeExports.jsx(w,{type:l==null?void 0:l._type})}),e.jsxRuntimeExports.jsx("div",{className:"ml-2 truncate text-[11px]",children:((R=s.node.data)==null?void 0:R._name)||s.node.text}),g?e.jsxRuntimeExports.jsxs("span",{className:"ml-2 flex items-center text-[10px] italic "+(c?"text-gray-200":"text-gray-500"),children:["(",g,")"]}):null]})]})})},G=s=>{var r;const{item:n}=s.monitorProps;return e.jsxRuntimeExports.jsxs("div",{className:"flex w-max items-center bg-blue-200 bg-opacity-30 p-1 font-semibold text-blue-700",children:[e.jsxRuntimeExports.jsx("div",{className:"",children:e.jsxRuntimeExports.jsx(w,{type:(r=n==null?void 0:n.data)==null?void 0:r._type})}),e.jsxRuntimeExports.jsx("div",{className:"ml-2 truncate text-[11px]",children:n.text})]})},$=s=>{const n=s.depth*10+16;return e.jsxRuntimeExports.jsx("div",{className:"absolute right-0 top-0 h-0.5 -translate-y-1/2 transform bg-green-500",style:{left:n}})},K=m.lazy(()=>Promise.resolve().then(()=>require("./MarkAsGlobalBlock-f2186631.cjs"))),Q=()=>{const[s]=x.useSelectedBlockIds(),[,n]=x.useCutBlockIds();return e.jsxRuntimeExports.jsxs(u.ContextMenuItem,{className:"flex items-center gap-x-4 text-xs",onClick:()=>n(s),children:[e.jsxRuntimeExports.jsx(t.ScissorsIcon,{})," Cut"]})},U=()=>{const[s]=x.useSelectedBlockIds(),[,n]=x.useCopyBlockIds();return e.jsxRuntimeExports.jsxs(u.ContextMenuItem,{className:"flex items-center gap-x-4 text-xs",onClick:()=>n(s),children:[e.jsxRuntimeExports.jsx(t.ClipboardIcon,{})," Copy"]})},Y=()=>{const[s]=x.useSelectedBlockIds(),n=x.useRemoveBlocks(),r=x.useSelectedBlock();return e.jsxRuntimeExports.jsxs(u.ContextMenuItem,{disabled:(r==null?void 0:r._type)==="Slot",className:"flex items-center gap-x-4 text-xs",onClick:()=>n(s),children:[e.jsxRuntimeExports.jsx(t.TrashIcon,{})," Remove"]})},W=({id:s=null,openMarkAsGlobalModal:n})=>{const[r]=x.useSelectedBlockIds(),c=x.useDuplicateBlocks(),{pasteBlocks:i,canPaste:l}=x.usePasteBlocks(),d=S.useBuilderProp("globalBlocksSupport",!1),j=m.useCallback(()=>{c(r)},[r,c]);return e.jsxRuntimeExports.jsxs(u.ContextMenuContent,{className:"text-xs",children:[d&&e.jsxRuntimeExports.jsx(u.ContextMenuItem,{className:"flex items-center gap-x-4 border-b text-xs",onClick:n,children:e.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-4",children:[e.jsxRuntimeExports.jsx(t.GlobeIcon,{})," Mark as global"]})}),e.jsxRuntimeExports.jsxs(u.ContextMenuItem,{className:"flex items-center gap-x-4 text-xs",onClick:j,children:[e.jsxRuntimeExports.jsx(t.CopyIcon,{})," Duplicate"]}),e.jsxRuntimeExports.jsx(Q,{}),e.jsxRuntimeExports.jsx(U,{}),e.jsxRuntimeExports.jsxs(u.ContextMenuItem,{className:"flex items-center gap-x-4 text-xs",onClick:()=>i(s),disabled:!l,children:[e.jsxRuntimeExports.jsx(t.ClipboardCopyIcon,{})," Paste"]}),e.jsxRuntimeExports.jsx(Y,{})]})},J=({children:s,id:n=null})=>{const[r,c]=m.useState(!1);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(C.Dialog,{open:r,onOpenChange:c,children:r&&e.jsxRuntimeExports.jsx(C.DialogContent,{children:e.jsxRuntimeExports.jsx(m.Suspense,{fallback:e.jsxRuntimeExports.jsx("div",{className:"h-96 w-full animate-pulse bg-gray-200"}),children:e.jsxRuntimeExports.jsx(K,{closeModal:()=>c(!1),id:n})})})}),e.jsxRuntimeExports.jsxs(u.ContextMenu,{children:[e.jsxRuntimeExports.jsx(u.ContextMenuTrigger,{children:s}),e.jsxRuntimeExports.jsx(W,{id:n,openMarkAsGlobalModal:()=>c(!0)})]})]})},X=()=>{const{addCoreBlock:s}=x.useAddBlock(),n=S.useBuilderProp("getExternalPredefinedBlock");return m.useCallback(async r=>{const{block:c,dropTargetId:i,relativeIndex:l}=r;if(a.has(c,"format")){const d=await n(c);return s({blocks:d},i===0?null:i,l)}return s(c,i===0?null:i,l)},[s])};function Z(s){return a.map(s,n=>{const{data:r}=n;return{...r,_parent:n.parent===0?null:n.parent}})}const ee=()=>{const s=x.useAllBlocks(),[n]=x.useSetAllBlocks(),[r,c,i]=x.useSelectedBlockIds(),[,l]=x.useSelectedStylingBlocks(),{t:d}=_.useTranslation(),{createSnapshot:j}=x.useCanvasHistory(),h=x.useExpandedIds(),g=X(),[,R]=L.useAtom(x.addBlocksModalAtom),p=async(o,E)=>{const{dragSource:b,destinationIndex:k,relativeIndex:f,dropTargetId:D,monitor:O}=E,A=Z(o);n(A),b?j():(await g({block:O.getItem(),dropTargetId:D,destinationIndex:k,relativeIndex:f}),R(!1))},T=a.map(s,o=>({id:o._id,text:o._type,parent:o._parent||0,droppable:!a.isUndefined(a.find(s,{_parent:o._id})),data:o})),q=()=>{c([]),l([])},[{isOver:I},M]=B.useDrop(()=>({accept:["CHAI_BLOCK"],collect:o=>({canDrop:o.canDrop(),isOver:o.isOver()}),drop:o=>{(async()=>(await g({block:o,dropTargetId:"",destinationIndex:0,relativeIndex:0}),R(!1)))()}})),{isDragging:N}=B.useDragLayer(o=>({isDragging:o.isDragging()}));return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:e.jsxRuntimeExports.jsxs("div",{onClick:()=>q(),className:v.cn("-mx-1 -mt-1 flex h-full select-none flex-col space-y-1",N?"bg-green-50/80":"bg-background"),children:[e.jsxRuntimeExports.jsx("div",{className:"mx-1 h-10 rounded-md bg-background/30 p-1",children:e.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:"Tree view"})}),a.isEmpty(s)?e.jsxRuntimeExports.jsxs("div",{ref:M,className:`mx-1 mt-4 h-full p-6 text-center text-sm text-gray-400 ${I?"bg-blue-200":""}`,children:[I?e.jsxRuntimeExports.jsx(t.DoubleArrowDownIcon,{className:"mx-auto h-12 w-12 animate-bounce"}):e.jsxRuntimeExports.jsx(t.StackIcon,{className:"mx-auto h-10 w-10"}),e.jsxRuntimeExports.jsx("p",{className:"mt-2",children:d(I?"drop_here_message":"tree_view_no_blocks")})]}):e.jsxRuntimeExports.jsx(H.ScrollArea,{id:"layers-view",className:"no-scrollbar h-full overflow-y-auto p-1",children:e.jsxRuntimeExports.jsx(y.Tree,{initialOpen:h,extraAcceptTypes:["CHAI_BLOCK"],tree:T,rootId:0,render:(o,{depth:E,isOpen:b,onToggle:k})=>e.jsxRuntimeExports.jsx(J,{id:o.id,children:e.jsxRuntimeExports.jsx(z,{onSelect:f=>{l([]),c([f])},isSelected:a.includes(r,o.id),node:o,depth:E,isOpen:b,onToggle:k,toggleIds:i})}),dragPreviewRender:o=>e.jsxRuntimeExports.jsx(G,{monitorProps:o}),onDrop:p,classes:{root:"h-full pt-2",draggingSource:"opacity-30",dropTarget:"bg-green-100",placeholder:"relative"},sort:!1,insertDroppableFirst:!1,canDrop:x.canDropBlock,dropTargetOffset:2,enableAnimateExpand:!0,placeholderRender:(o,{depth:E})=>e.jsxRuntimeExports.jsx($,{node:o,depth:E})})})]})})};exports.default=ee;