@chaibuilder/sdk 1.1.13 → 1.1.15

package/dist/AddBlocks-AG_J7s2Z.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./jsx-runtime-WUGKV8jN.cjs"),c=require("react"),t=require("./lodash-2us0VT8I.cjs"),g=require("jotai"),s=require("./index-d55M5MRz.cjs"),v=require("@radix-ui/react-icons"),b=require("@chaibuilder/runtime"),T=require("flagged"),q=require("lucide-react"),B=require("react-dnd"),A=require("./html-to-json-aAZkA0f5.cjs");require("./MODIFIERS-WFzDQfiT.cjs");require("@radix-ui/react-toggle");require("class-variance-authority");require("./utils-37UXq2O5.cjs");require("clsx");require("tailwind-merge");require("@radix-ui/react-switch");require("@radix-ui/react-slot");require("@radix-ui/react-accordion");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-dialog");require("@radix-ui/react-label");require("@radix-ui/react-scroll-area");require("@radix-ui/react-tabs");require("@radix-ui/react-tooltip");require("@radix-ui/react-popover");require("@radix-ui/react-menubar");require("@radix-ui/react-hover-card");require("@radix-ui/react-select");require("@radix-ui/react-dropdown-menu");require("@radix-ui/react-separator");require("@radix-ui/react-toast");require("cmdk");require("@radix-ui/react-context-menu");require("react-icons-picker");require("react-dom");require("react-quill");require("flat-to-nested");require("redux-undo");require("@react-hookz/web");require("react-i18next");require("himalaya");const C=({block:r})=>{const{type:o,icon:l,label:d}=r,{addCoreBlock:x,addPredefinedBlock:m}=s.useAddBlock(),[j,p]=s.useSelectedBlockIds(),[,i]=s.useHighlightBlockId(),[,f]=g.useAtom(s.activePanelAtom),[,a]=g.useAtom(s.addBlocksModalAtom),n=()=>{t.has(r,"blocks")?m(b.syncBlocksWithDefaults(r.blocks),t.head(j)):x(r,t.head(j)),a(!1),f("layers")},h=T.useFeature("dnd");return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:e.jsxRuntimeExports.jsxs(s.Tooltip,{children:[e.jsxRuntimeExports.jsx(s.TooltipTrigger,{asChild:!0,children:e.jsxRuntimeExports.jsxs("button",{onClick:n,type:"button",onDragStart:E=>{E.dataTransfer.setData("text/plain",JSON.stringify(t.omit(r,["component","icon"]))),setTimeout(()=>{p([]),i(null),a(!1),f("layers")},200)},draggable:h?"true":"false",className:"space-y-2 rounded-lg border border-border p-3 text-center hover:bg-slate-300/50 "+(h?"cursor-grab":"cursor-pointer"),children:[c.createElement(l||v.BoxIcon,{className:"w-4 h-4 mx-auto"}),e.jsxRuntimeExports.jsx("p",{className:"truncate text-xs",children:d||o})]})}),e.jsxRuntimeExports.jsx(s.TooltipContent,{children:e.jsxRuntimeExports.jsx("p",{children:d||o})})]})})},w=({block:r,closePopover:o})=>{var n;const[l,d]=c.useState(!1),x=s.useBuilderProp("getExternalPredefinedBlock"),{addCoreBlock:m,addPredefinedBlock:j}=s.useAddBlock(),[p]=s.useSelectedBlockIds(),[,i,f]=B.useDrag(()=>({type:"CHAI_BLOCK",item:r}),[r]),a=c.useCallback(async h=>{if(h.stopPropagation(),t.has(r,"component")){m(r,t.head(p)),o();return}d(!0);const E=await x(r);t.isEmpty(E)||j(b.syncBlocksWithDefaults(E),t.head(p)),o()},[r]);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(B.DragPreviewImage,{connect:f,src:"https://placehold.co/100x30/000000/FFF?text="+((n=r.name||r.label)==null?void 0:n.replace(" ","+"))}),e.jsxRuntimeExports.jsxs("div",{ref:i,onClick:l?()=>{}:a,className:"relative cursor-pointer 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(q.Loader,{className:"animate-spin",size:15,color:"white"})," ",e.jsxRuntimeExports.jsx("span",{className:"pl-2 text-sm text-white",children:"Adding..."})]}),r.preview?e.jsxRuntimeExports.jsx("img",{src:r.preview,className:"min-h-[50px] w-full rounded-md border border-gray-300",alt:r.label}):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:r.label})})]})]})},N=()=>{const{data:r}=s.useUILibraryBlocks(),o=b.useChaiBlocks(),l=t.filter(t.values(o),{category:"custom"}),d=t.groupBy(l,"group"),x=t.groupBy(r,"group"),m=c.useMemo(()=>t.mergeWith(d,x,(a,n)=>{if(t.isArray(a)&&t.isArray(n))return[...a,...n]}),[d,x]),[,j]=g.useAtom(s.addBlocksModalAtom),[p,i]=c.useState(t.head(t.keys(m))||""),f=t.get(m,p,[]);return e.jsxRuntimeExports.jsxs("div",{className:"relative flex flex-col h-full max-h-full overflow-hidden py-2",children:[e.jsxRuntimeExports.jsx("div",{className:"p-3 sticky top-0 flex w-full items-center",children:e.jsxRuntimeExports.jsxs(s.Select,{value:p,onValueChange:a=>i(a),children:[e.jsxRuntimeExports.jsx(s.SelectTrigger,{className:"w-full",children:e.jsxRuntimeExports.jsx(s.SelectValue,{placeholder:"Select a provider"})}),e.jsxRuntimeExports.jsxs(s.SelectContent,{children:[e.jsxRuntimeExports.jsx(s.SelectItem,{value:"",children:"Choose"}),c.Children.toArray(t.map(m,(a,n)=>e.jsxRuntimeExports.jsx(s.SelectItem,{value:n,children:n},n)))]})]})}),e.jsxRuntimeExports.jsx("div",{className:"h-full w-full space-y-2 overflow-y-auto px-2",children:c.Children.toArray(f.map(a=>e.jsxRuntimeExports.jsx(w,{block:a,closePopover:()=>j(!1)})))})]})},S=()=>{const[r,o]=c.useState(""),{addPredefinedBlock:l}=s.useAddBlock(),[d]=s.useSelectedBlockIds(),[,x]=g.useAtom(s.addBlockOffCanvasAtom),[,m]=g.useAtom(s.activePanelAtom),[,j]=g.useAtom(s.addBlocksModalAtom),p=()=>{const i=A.getBlocksFromHTML(r);l([...i],t.head(d)||null),o(""),x(!1),m("layers"),j(!1)};return e.jsxRuntimeExports.jsxs(s.Card,{className:"border-border/0 p-0 shadow-none",children:[e.jsxRuntimeExports.jsx(s.CardHeader,{className:"p-3",children:e.jsxRuntimeExports.jsx(s.CardDescription,{children:"Use HTML snippets from Tailwind CSS component libraries etc. or just copy paste your own HTML code."})}),e.jsxRuntimeExports.jsx(s.CardContent,{className:"space-y-2 px-3 py-0",children:e.jsxRuntimeExports.jsxs("div",{className:"space-y-1",children:[e.jsxRuntimeExports.jsx(s.Label,{htmlFor:"current",className:"text-sm",children:"Tailwind HTML snippet:"}),e.jsxRuntimeExports.jsx(s.Textarea,{autoFocus:!0,tabIndex:1,ref:i=>i&&i.focus(),defaultValue:r,onChange:i=>o(i.target.value),rows:12,placeholder:"Enter your code snippet here...",className:"resize-none bg-gray-100 overflow-x-auto whitespace-pre text-xs font-mono font-normal"})]})}),e.jsxRuntimeExports.jsxs(s.CardFooter,{className:"flex flex-col justify-end p-3",children:[e.jsxRuntimeExports.jsx(s.Button,{disabled:r.trim()==="",onClick:()=>p(),size:"sm",className:"w-full",children:"Import HTML"}),e.jsxRuntimeExports.jsx(s.Alert,{variant:"default",className:"mt-2 p-1 border-none text-gray-400",children:e.jsxRuntimeExports.jsx(s.AlertTitle,{className:"text-xs  font-normal leading-4",children:"NOTE: Imported html will be added to the currently selected block. If no block is selected, the html will be added to the page."})})]})]})},k=["ListItem","TableHead","TableBody","TableRow","TableCell","Column"],I=(r,o)=>{if(!r)return!t.includes(k,o);const l=r._type;return l==="List"?o==="ListItem":l==="Table"?o==="TableHead"||o==="TableBody":l==="TableHead"||l==="TableBody"?o==="TableRow":l==="TableRow"?o==="TableCell":l==="Row"?o==="Column":!t.includes(k,o)},L=()=>{const[r,o]=c.useState("core"),[l,d]=c.useState("basic"),x=b.useChaiBlocks(),[,m]=g.useAtom(s.showPredefinedBlockCategoryAtom),[j]=s.useSelectedBlockIds(),p=s.useAllBlocks(),i=t.find(p,{_id:t.head(j)}),{data:f,isLoading:a}=s.useUILibraryBlocks(),n=t.groupBy(t.filter(x,u=>I(i,u.type)),"category"),h=t.uniq(t.map(n.core,"group"));c.useEffect(()=>{!t.includes(h,l)&&!t.isEmpty(h)&&!t.isEmpty(l)&&d(t.head(h))},[h,l]);const E=u=>d(R=>R===u?"":u),y=!a&&!t.isEmpty(f)||t.find(t.values(x),{category:"custom"})!==void 0;return e.jsxRuntimeExports.jsxs("div",{className:"flex h-full flex-col overflow-hidden",children:[e.jsxRuntimeExports.jsxs("div",{className:"mb-2 flex flex-col justify-between rounded-md bg-background/30 p-1",children:[e.jsxRuntimeExports.jsx("h1",{className:"flex flex-col items-baseline px-1 text-xl font-semibold xl:flex-col",children:"Add block"}),e.jsxRuntimeExports.jsx("span",{className:"p-0 text-xs font-light leading-3 opacity-80 xl:pl-1",children:r==="html"?"(Enter or paste TailwindCSS HTML snippet)":"(Click to add block to page)"})]}),e.jsxRuntimeExports.jsx(s.Tabs,{onValueChange:u=>{m(""),o(u)},value:r,className:"h-max",children:e.jsxRuntimeExports.jsxs(s.TabsList,{className:"grid w-full "+(y?"grid-cols-3":"grid-cols-2"),children:[e.jsxRuntimeExports.jsx(s.TabsTrigger,{value:"core",children:"Core"}),y?e.jsxRuntimeExports.jsx(s.TabsTrigger,{value:"ui-blocks",children:"Custom Blocks"}):null,e.jsxRuntimeExports.jsx(s.TabsTrigger,{value:"html",children:"Import "})]})}),r==="core"&&e.jsxRuntimeExports.jsx(s.ScrollArea,{className:"-mx-1.5 h-full",children:e.jsxRuntimeExports.jsx(s.Accordion,{type:"single",value:l,className:"w-full px-3",children:c.Children.toArray(t.map(h,u=>t.reject(t.filter(t.values(n.core),{group:u}),{hidden:!0}).length?e.jsxRuntimeExports.jsxs(s.AccordionItem,{value:u,className:"border-border",children:[e.jsxRuntimeExports.jsx(s.AccordionTrigger,{onClick:()=>E(u),className:"py-2 capitalize",children:u}),e.jsxRuntimeExports.jsx(s.AccordionContent,{children:e.jsxRuntimeExports.jsx("div",{className:"grid grid-cols-3 gap-2",children:c.Children.toArray(t.reject(t.filter(t.values(n.core),{group:u}),{hidden:!0}).map(R=>e.jsxRuntimeExports.jsx(C,{block:R})))})})]}):null))})}),r==="ui-blocks"&&e.jsxRuntimeExports.jsx(c.Suspense,{fallback:e.jsxRuntimeExports.jsx(s.Skeleton,{className:"h-32 w-full"}),children:e.jsxRuntimeExports.jsx(N,{})}),r==="html"&&e.jsxRuntimeExports.jsx(S,{})]})};exports.default=L;

package/dist/{AddBlocks-A7WofxHV.js → AddBlocks-FsdsASNp.js}

@@ -1,18 +1,18 @@
 import { j as e } from "./jsx-runtime-NV737rRe.js";
 import B, { createElement as z, useState as b, useCallback as q, useMemo as V, useEffect as U, Suspense as W } from "react";
-import { has as D, first as h, omit as J, isEmpty as j, filter as y, values as k, groupBy as T, mergeWith as K, isArray as P, keys as Q, get as X, map as N, includes as A, find as H, uniq as Y, reject as E } from "lodash";
+import { t as R, h, o as J, a as j, b as y, F as k, Y as T, Z as K, L as P, k as Y, g as Z, d as N, c as A, j as H, _ as Q, R as E } from "./lodash-3gkdNK5u.js";
 import { useAtom as f } from "jotai";
-import { O as I, j as v, _ as Z, av as R, aw as S, aD as $, aE as ee, aG as se, i as te, a8 as _, aq as re, ar as oe, as as le, at as ae, au as F, bp as ce, bq as ne, br as ie, bs as de, bt as me, aI as pe, bu as ue, bv as xe, B as he, bw as fe, bx as ge, by as be, ae as je, ax as ye, ay as ke, az as w, bo as Be, bh as ve, bi as Ce, bj as we, bk as Te, S as Ne } from "./index-89A3jPHh.js";
+import { O as I, j as v, _ as X, av as _, aw as L, aD as $, aE as ee, aG as se, i as te, a8 as D, aq as oe, ar as re, as as ae, at as le, au as F, bp as ce, bq as ne, br as ie, bs as de, bt as me, aI as pe, bu as ue, bv as xe, B as he, bw as fe, bx as ge, by as be, ae as je, ax as ye, ay as ke, az as w, bo as Be, bh as ve, bi as Ce, bj as we, bk as Te, S as Ne } from "./index-0OqmBgqo.js";
 import { BoxIcon as Ae } from "@radix-ui/react-icons";
 import { syncBlocksWithDefaults as G, useChaiBlocks as O } from "@chaibuilder/runtime";
 import { useFeature as Ie } from "flagged";
-import { Loader as Se } from "lucide-react";
-import { useDrag as Le, DragPreviewImage as Pe } from "react-dnd";
-import { g as He } from "./html-to-json-kGgp07Hv.js";
+import { Loader as Le } from "lucide-react";
+import { useDrag as Se, DragPreviewImage as Pe } from "react-dnd";
+import { g as He } from "./html-to-json-Y5M0N8PH.js";
 import "./MODIFIERS-MLfpKQY1.js";
 import "@radix-ui/react-toggle";
 import "class-variance-authority";
-import "./utils-zWMk4dB2.js";
+import "./utils-XsPKXMVo.js";
 import "clsx";
 import "tailwind-merge";
 import "@radix-ui/react-switch";
@@ -42,24 +42,24 @@ import "@react-hookz/web";
 import "react-i18next";
 import "himalaya";
 const Ee = ({ block: s }) => {
-  const { type: t, icon: r, label: c } = s, { addCoreBlock: i, addPredefinedBlock: d } = I(), [p, m] = v(), [, l] = Z(), [, x] = f(R), [, a] = f(S), o = () => {
-    D(s, "blocks") ? d(G(s.blocks), h(p)) : i(s, h(p)), a(!1), x("layers");
+  const { type: t, icon: o, label: c } = s, { addCoreBlock: i, addPredefinedBlock: d } = I(), [p, m] = v(), [, a] = X(), [, x] = f(_), [, l] = f(L), r = () => {
+    R(s, "blocks") ? d(G(s.blocks), h(p)) : i(s, h(p)), l(!1), x("layers");
   }, u = Ie("dnd");
   return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs($, { children: [
     /* @__PURE__ */ e.jsx(ee, { asChild: !0, children: /* @__PURE__ */ e.jsxs(
       "button",
       {
-        onClick: o,
+        onClick: r,
         type: "button",
         onDragStart: (g) => {
           g.dataTransfer.setData("text/plain", JSON.stringify(J(s, ["component", "icon"]))), setTimeout(() => {
-            m([]), l(null), a(!1), x("layers");
+            m([]), a(null), l(!1), x("layers");
           }, 200);
         },
         draggable: u ? "true" : "false",
         className: "space-y-2 rounded-lg border border-border p-3 text-center hover:bg-slate-300/50 " + (u ? "cursor-grab" : "cursor-pointer"),
         children: [
-          z(r || Ae, { className: "w-4 h-4 mx-auto" }),
+          z(o || Ae, { className: "w-4 h-4 mx-auto" }),
           /* @__PURE__ */ e.jsx("p", { className: "truncate text-xs", children: c || t })
         ]
       }
@@ -67,16 +67,16 @@ const Ee = ({ block: s }) => {
     /* @__PURE__ */ e.jsx(se, { children: /* @__PURE__ */ e.jsx("p", { children: c || t }) })
   ] }) });
 }, Fe = ({ block: s, closePopover: t }) => {
-  var o;
-  const [r, c] = b(!1), i = te("getExternalPredefinedBlock"), { addCoreBlock: d, addPredefinedBlock: p } = I(), [m] = v(), [, l, x] = Le(
+  var r;
+  const [o, c] = b(!1), i = te("getExternalPredefinedBlock"), { addCoreBlock: d, addPredefinedBlock: p } = I(), [m] = v(), [, a, x] = Se(
     () => ({
       type: "CHAI_BLOCK",
       item: s
     }),
     [s]
-  ), a = q(
+  ), l = q(
     async (u) => {
-      if (u.stopPropagation(), D(s, "component")) {
+      if (u.stopPropagation(), R(s, "component")) {
         d(s, h(m)), t();
         return;
       }
@@ -91,19 +91,19 @@ const Ee = ({ block: s }) => {
       Pe,
       {
         connect: x,
-        src: "https://placehold.co/100x30/000000/FFF?text=" + ((o = s.name || s.label) == null ? void 0 : o.replace(" ", "+"))
+        src: "https://placehold.co/100x30/000000/FFF?text=" + ((r = s.name || s.label) == null ? void 0 : r.replace(" ", "+"))
       }
     ),
     /* @__PURE__ */ e.jsxs(
       "div",
       {
-        ref: l,
-        onClick: r ? () => {
-        } : a,
+        ref: a,
+        onClick: o ? () => {
+        } : l,
         className: "relative cursor-pointer overflow-hidden rounded-md border border-transparent duration-200 hover:scale-x-105 hover:border-foreground/20 hover:shadow-2xl",
         children: [
-          r && /* @__PURE__ */ e.jsxs("div", { className: "absolute flex h-full w-full items-center justify-center bg-black bg-opacity-70", children: [
-            /* @__PURE__ */ e.jsx(Se, { className: "animate-spin", size: 15, color: "white" }),
+          o && /* @__PURE__ */ e.jsxs("div", { className: "absolute flex h-full w-full items-center justify-center bg-black bg-opacity-70", children: [
+            /* @__PURE__ */ e.jsx(Le, { className: "animate-spin", size: 15, color: "white" }),
             " ",
             /* @__PURE__ */ e.jsx("span", { className: "pl-2 text-sm text-white", children: "Adding..." })
           ] }),
@@ -120,28 +120,28 @@ const Ee = ({ block: s }) => {
     )
   ] });
 }, Me = () => {
-  const { data: s } = _(), t = O(), r = y(k(t), { category: "custom" }), c = T(r, "group"), i = T(s, "group"), d = V(() => K(c, i, (a, o) => {
-    if (P(a) && P(o))
-      return [...a, ...o];
-  }), [c, i]), [, p] = f(S), [m, l] = b(h(Q(d)) || ""), x = X(d, m, []);
+  const { data: s } = D(), t = O(), o = y(k(t), { category: "custom" }), c = T(o, "group"), i = T(s, "group"), d = V(() => K(c, i, (l, r) => {
+    if (P(l) && P(r))
+      return [...l, ...r];
+  }), [c, i]), [, p] = f(L), [m, a] = b(h(Y(d)) || ""), x = Z(d, m, []);
   return /* @__PURE__ */ e.jsxs("div", { className: "relative flex flex-col h-full max-h-full overflow-hidden py-2", children: [
-    /* @__PURE__ */ e.jsx("div", { className: "p-3 sticky top-0 flex w-full items-center", children: /* @__PURE__ */ e.jsxs(re, { value: m, onValueChange: (a) => l(a), children: [
-      /* @__PURE__ */ e.jsx(oe, { className: "w-full", children: /* @__PURE__ */ e.jsx(le, { placeholder: "Select a provider" }) }),
-      /* @__PURE__ */ e.jsxs(ae, { children: [
+    /* @__PURE__ */ e.jsx("div", { className: "p-3 sticky top-0 flex w-full items-center", children: /* @__PURE__ */ e.jsxs(oe, { value: m, onValueChange: (l) => a(l), children: [
+      /* @__PURE__ */ e.jsx(re, { className: "w-full", children: /* @__PURE__ */ e.jsx(ae, { placeholder: "Select a provider" }) }),
+      /* @__PURE__ */ e.jsxs(le, { children: [
         /* @__PURE__ */ e.jsx(F, { value: "", children: "Choose" }),
         B.Children.toArray(
-          N(d, (a, o) => /* @__PURE__ */ e.jsx(F, { value: o, children: o }, o))
+          N(d, (l, r) => /* @__PURE__ */ e.jsx(F, { value: r, children: r }, r))
         )
       ] })
     ] }) }),
     /* @__PURE__ */ e.jsx("div", { className: "h-full w-full space-y-2 overflow-y-auto px-2", children: B.Children.toArray(
-      x.map((a) => /* @__PURE__ */ e.jsx(Fe, { block: a, closePopover: () => p(!1) }))
+      x.map((l) => /* @__PURE__ */ e.jsx(Fe, { block: l, closePopover: () => p(!1) }))
     ) })
   ] });
-}, De = () => {
-  const [s, t] = b(""), { addPredefinedBlock: r } = I(), [c] = v(), [, i] = f(ce), [, d] = f(R), [, p] = f(S), m = () => {
-    const l = He(s);
-    r([...l], h(c) || null), t(""), i(!1), d("layers"), p(!1);
+}, Re = () => {
+  const [s, t] = b(""), { addPredefinedBlock: o } = I(), [c] = v(), [, i] = f(ce), [, d] = f(_), [, p] = f(L), m = () => {
+    const a = He(s);
+    o([...a], h(c) || null), t(""), i(!1), d("layers"), p(!1);
   };
   return /* @__PURE__ */ e.jsxs(ne, { className: "border-border/0 p-0 shadow-none", children: [
     /* @__PURE__ */ e.jsx(ie, { className: "p-3", children: /* @__PURE__ */ e.jsx(de, { children: "Use HTML snippets from Tailwind CSS component libraries etc. or just copy paste your own HTML code." }) }),
@@ -152,9 +152,9 @@ const Ee = ({ block: s }) => {
         {
           autoFocus: !0,
           tabIndex: 1,
-          ref: (l) => l && l.focus(),
+          ref: (a) => a && a.focus(),
           defaultValue: s,
-          onChange: (l) => t(l.target.value),
+          onChange: (a) => t(a.target.value),
           rows: 12,
           placeholder: "Enter your code snippet here...",
           className: "resize-none bg-gray-100 overflow-x-auto whitespace-pre text-xs font-mono font-normal"
@@ -166,20 +166,20 @@ const Ee = ({ block: s }) => {
       /* @__PURE__ */ e.jsx(fe, { variant: "default", className: "mt-2 p-1 border-none text-gray-400", children: /* @__PURE__ */ e.jsx(ge, { className: "text-xs  font-normal leading-4", children: "NOTE: Imported html will be added to the currently selected block. If no block is selected, the html will be added to the page." }) })
     ] })
   ] });
-}, M = ["ListItem", "TableHead", "TableBody", "TableRow", "TableCell", "Column"], Re = (s, t) => {
+}, M = ["ListItem", "TableHead", "TableBody", "TableRow", "TableCell", "Column"], _e = (s, t) => {
   if (!s)
     return !A(M, t);
-  const r = s._type;
-  return r === "List" ? t === "ListItem" : r === "Table" ? t === "TableHead" || t === "TableBody" : r === "TableHead" || r === "TableBody" ? t === "TableRow" : r === "TableRow" ? t === "TableCell" : r === "Row" ? t === "Column" : !A(M, t);
+  const o = s._type;
+  return o === "List" ? t === "ListItem" : o === "Table" ? t === "TableHead" || t === "TableBody" : o === "TableHead" || o === "TableBody" ? t === "TableRow" : o === "TableRow" ? t === "TableCell" : o === "Row" ? t === "Column" : !A(M, t);
 }, As = () => {
-  const [s, t] = b("core"), [r, c] = b("basic"), i = O(), [, d] = f(be), [p] = v(), m = je(), l = H(m, { _id: h(p) }), { data: x, isLoading: a } = _(), o = T(
-    y(i, (n) => Re(l, n.type)),
+  const [s, t] = b("core"), [o, c] = b("basic"), i = O(), [, d] = f(be), [p] = v(), m = je(), a = H(m, { _id: h(p) }), { data: x, isLoading: l } = D(), r = T(
+    y(i, (n) => _e(a, n.type)),
     "category"
-  ), u = Y(N(o.core, "group"));
+  ), u = Q(N(r.core, "group"));
   U(() => {
-    !A(u, r) && !j(u) && !j(r) && c(h(u));
-  }, [u, r]);
-  const g = (n) => c((C) => C === n ? "" : n), L = !a && !j(x) || H(k(i), { category: "custom" }) !== void 0;
+    !A(u, o) && !j(u) && !j(o) && c(h(u));
+  }, [u, o]);
+  const g = (n) => c((C) => C === n ? "" : n), S = !l && !j(x) || H(k(i), { category: "custom" }) !== void 0;
   return /* @__PURE__ */ e.jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "mb-2 flex flex-col justify-between rounded-md bg-background/30 p-1", children: [
       /* @__PURE__ */ e.jsx("h1", { className: "flex flex-col items-baseline px-1 text-xl font-semibold xl:flex-col", children: "Add block" }),
@@ -193,28 +193,28 @@ const Ee = ({ block: s }) => {
         },
         value: s,
         className: "h-max",
-        children: /* @__PURE__ */ e.jsxs(ke, { className: "grid w-full " + (L ? "grid-cols-3" : "grid-cols-2"), children: [
+        children: /* @__PURE__ */ e.jsxs(ke, { className: "grid w-full " + (S ? "grid-cols-3" : "grid-cols-2"), children: [
           /* @__PURE__ */ e.jsx(w, { value: "core", children: "Core" }),
-          L ? /* @__PURE__ */ e.jsx(w, { value: "ui-blocks", children: "Custom Blocks" }) : null,
+          S ? /* @__PURE__ */ e.jsx(w, { value: "ui-blocks", children: "Custom Blocks" }) : null,
           /* @__PURE__ */ e.jsx(w, { value: "html", children: "Import " })
         ] })
       }
     ),
-    s === "core" && /* @__PURE__ */ e.jsx(Be, { className: "-mx-1.5 h-full", children: /* @__PURE__ */ e.jsx(ve, { type: "single", value: r, className: "w-full px-3", children: B.Children.toArray(
+    s === "core" && /* @__PURE__ */ e.jsx(Be, { className: "-mx-1.5 h-full", children: /* @__PURE__ */ e.jsx(ve, { type: "single", value: o, className: "w-full px-3", children: B.Children.toArray(
       N(
         u,
-        (n) => E(y(k(o.core), { group: n }), {
+        (n) => E(y(k(r.core), { group: n }), {
           hidden: !0
         }).length ? /* @__PURE__ */ e.jsxs(Ce, { value: n, className: "border-border", children: [
           /* @__PURE__ */ e.jsx(we, { onClick: () => g(n), className: "py-2 capitalize", children: n }),
           /* @__PURE__ */ e.jsx(Te, { children: /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-3 gap-2", children: B.Children.toArray(
-            E(y(k(o.core), { group: n }), { hidden: !0 }).map((C) => /* @__PURE__ */ e.jsx(Ee, { block: C }))
+            E(y(k(r.core), { group: n }), { hidden: !0 }).map((C) => /* @__PURE__ */ e.jsx(Ee, { block: C }))
           ) }) })
         ] }) : null
       )
     ) }) }),
     s === "ui-blocks" && /* @__PURE__ */ e.jsx(W, { fallback: /* @__PURE__ */ e.jsx(Ne, { className: "h-32 w-full" }), children: /* @__PURE__ */ e.jsx(Me, {}) }),
-    s === "html" && /* @__PURE__ */ e.jsx(De, {})
+    s === "html" && /* @__PURE__ */ e.jsx(Re, {})
   ] });
 };
 export {

package/dist/BrandingOptions-TRVyCvVq.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./jsx-runtime-WUGKV8jN.cjs"),j=require("react"),B=require("@rjsf/validator-ajv8"),E=require("@rjsf/core"),g=require("./index-d55M5MRz.cjs"),r=require("./controls-QnyBNkXG.cjs"),m=require("./lodash-2us0VT8I.cjs");require("./MODIFIERS-WFzDQfiT.cjs");require("@radix-ui/react-toggle");require("class-variance-authority");require("./utils-37UXq2O5.cjs");require("clsx");require("tailwind-merge");require("@radix-ui/react-switch");require("@radix-ui/react-slot");require("@radix-ui/react-accordion");require("@radix-ui/react-icons");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-dialog");require("@radix-ui/react-label");require("@radix-ui/react-scroll-area");require("@radix-ui/react-tabs");require("@radix-ui/react-tooltip");require("@radix-ui/react-popover");require("@radix-ui/react-menubar");require("@radix-ui/react-hover-card");require("@radix-ui/react-select");require("@radix-ui/react-dropdown-menu");require("@radix-ui/react-separator");require("@radix-ui/react-toast");require("cmdk");require("@radix-ui/react-context-menu");require("react-icons-picker");require("react-dom");require("react-quill");require("jotai");require("flat-to-nested");require("redux-undo");require("@chaibuilder/runtime");require("@react-hookz/web");require("react-i18next");function R(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const i in t)if(i!=="default"){const a=Object.getOwnPropertyDescriptor(t,i);Object.defineProperty(e,i,a.get?a:{enumerable:!0,get:()=>t[i]})}}return e.default=t,Object.freeze(e)}const x=R(j),N=({value:t,onChange:e,id:i,onBlur:a})=>{const d=m.debounce(e,200),c=n=>d(n.target.value);return l.jsxRuntimeExports.jsx("div",{className:"mt-1.5 flex items-center gap-x-3",children:l.jsxRuntimeExports.jsx("div",{className:"flex w-3/5 flex-col",children:l.jsxRuntimeExports.jsx("input",{type:"color",className:"text-xs p-0",value:t,onBlur:({target:{value:n}})=>a(i,n),onChange:c})})})},y=[{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=g.useBuilderProp("onSaveBrandingOptions",async()=>{}),[e,i]=g.useBrandingOptions(),a=x.useRef(e);x.useEffect(()=>()=>{m.isEqual(e,a.current)||t(a.current)},[]);const d=({formData:o},s)=>{s&&(i(o),a.current=o)},{bodyFont:c,headingFont:n,primaryColor:f,bodyTextDarkColor:q,bodyTextLightColor:b,bodyBgDarkColor:h,secondaryColor:S,bodyBgLightColor:C,roundedCorners:O}=e,v={headingFont:r.Ty({title:"Heading font",default:n,options:y}),bodyFont:r.Ty({title:"Body font",default:c,options:y}),roundedCorners:r.my({title:"Rounded Corner",default:parseInt(O||5,10)}),primaryColor:r.Ey({title:"Primary",default:f}),secondaryColor:r.Ey({title:"Secondary",default:S}),bodyBgLightColor:r.Ey({title:"Body Background (Light)",default:C}),bodyBgDarkColor:r.Ey({title:"Body Background (Dark)",default:h}),bodyTextLightColor:r.Ey({title:"Body Text (Light)",default:q}),bodyTextDarkColor:r.Ey({title:"Body Text (Dark)",default:b})},u={type:"object",properties:{}},p={};return Object.keys(v).forEach(o=>{const s=v[o];return u.properties||(u.properties={}),u.properties[o]=s.schema,p[o]=s.uiSchema,!0}),l.jsxRuntimeExports.jsxs("div",{className:"flex h-full select-none flex-col",children:[l.jsxRuntimeExports.jsx("div",{className:"rounded-md bg-background/30 p-1",children:l.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:"Branding Options"})}),l.jsxRuntimeExports.jsx("div",{className:"-mx-2",children:l.jsxRuntimeExports.jsx(E,{widgets:{color:N},idSeparator:".",autoComplete:"off",omitExtraData:!0,liveOmit:!0,liveValidate:!0,uiSchema:p,schema:u,formData:e,validator:B,onChange:d})})]})};exports.default=P;

package/dist/{BrandingOptions-wkFrLFI_.js → BrandingOptions-zFJ28xmJ.js}

@@ -2,13 +2,13 @@ import { j as t } from "./jsx-runtime-NV737rRe.js";
 import * as c from "react";
 import O from "@rjsf/validator-ajv8";
 import N from "@rjsf/core";
-import { i as j, x as k } from "./index-89A3jPHh.js";
-import { f as g, c as D, y as a } from "./controls-G0puEH71.js";
-import { debounce as P, isEqual as R } from "lodash";
+import { i as j, x as k } from "./index-0OqmBgqo.js";
+import { T as g, m as D, E as o } from "./controls-kEuiMMDf.js";
+import { $ as P, X as R } from "./lodash-3gkdNK5u.js";
 import "./MODIFIERS-MLfpKQY1.js";
 import "@radix-ui/react-toggle";
 import "class-variance-authority";
-import "./utils-zWMk4dB2.js";
+import "./utils-XsPKXMVo.js";
 import "clsx";
 import "tailwind-merge";
 import "@radix-ui/react-switch";
@@ -39,7 +39,7 @@ import "redux-undo";
 import "@chaibuilder/runtime";
 import "@react-hookz/web";
 import "react-i18next";
-const w = ({ value: s, onChange: e, id: u, onBlur: i }) => {
+const T = ({ value: s, onChange: e, id: u, onBlur: i }) => {
   const p = P(e, 200), d = (l) => p(l.target.value);
   return /* @__PURE__ */ t.jsx("div", { className: "mt-1.5 flex items-center gap-x-3", children: /* @__PURE__ */ t.jsx("div", { className: "flex w-3/5 flex-col", children: /* @__PURE__ */ t.jsx(
     "input",
@@ -101,20 +101,20 @@ const w = ({ value: s, onChange: e, id: u, onBlur: i }) => {
   { title: "Lustria", value: "Lustria" },
   { title: "Ovo", value: "Ovo" },
   { title: "Suranna", value: "Suranna" }
-], xt = () => {
+], yt = () => {
   const s = j("onSaveBrandingOptions", async () => {
   }), [e, u] = k(), i = c.useRef(e);
   c.useEffect(() => () => {
     R(e, i.current) || s(i.current);
   }, []);
-  const p = ({ formData: o }, n) => {
-    n && (u(o), i.current = o);
+  const p = ({ formData: a }, n) => {
+    n && (u(a), i.current = a);
   }, {
     bodyFont: d,
     headingFont: l,
     primaryColor: h,
-    bodyTextDarkColor: x,
-    bodyTextLightColor: y,
+    bodyTextDarkColor: y,
+    bodyTextLightColor: x,
     bodyBgDarkColor: b,
     secondaryColor: C,
     bodyBgLightColor: S,
@@ -134,39 +134,39 @@ const w = ({ value: s, onChange: e, id: u, onBlur: i }) => {
       title: "Rounded Corner",
       default: parseInt(B || 5, 10)
     }),
-    primaryColor: a({ title: "Primary", default: h }),
-    secondaryColor: a({ title: "Secondary", default: C }),
-    bodyBgLightColor: a({
+    primaryColor: o({ title: "Primary", default: h }),
+    secondaryColor: o({ title: "Secondary", default: C }),
+    bodyBgLightColor: o({
       title: "Body Background (Light)",
       default: S
     }),
-    bodyBgDarkColor: a({
+    bodyBgDarkColor: o({
       title: "Body Background (Dark)",
       default: b
     }),
-    bodyTextLightColor: a({
+    bodyTextLightColor: o({
       title: "Body Text (Light)",
-      default: x
+      default: y
     }),
-    bodyTextDarkColor: a({
+    bodyTextDarkColor: o({
       title: "Body Text (Dark)",
-      default: y
+      default: x
     })
     // TODO: exteend more options from user
   }, r = {
     type: "object",
     properties: {}
   }, v = {};
-  return Object.keys(m).forEach((o) => {
-    const n = m[o];
-    return r.properties || (r.properties = {}), r.properties[o] = n.schema, v[o] = n.uiSchema, !0;
+  return Object.keys(m).forEach((a) => {
+    const n = m[a];
+    return r.properties || (r.properties = {}), r.properties[a] = n.schema, v[a] = n.uiSchema, !0;
   }), /* @__PURE__ */ t.jsxs("div", { className: "flex h-full select-none flex-col", children: [
     /* @__PURE__ */ t.jsx("div", { className: "rounded-md bg-background/30 p-1", children: /* @__PURE__ */ t.jsx("h1", { className: "px-1 font-semibold", children: "Branding Options" }) }),
     /* @__PURE__ */ t.jsx("div", { className: "-mx-2", children: /* @__PURE__ */ t.jsx(
       N,
       {
         widgets: {
-          color: w
+          color: T
         },
         idSeparator: ".",
         autoComplete: "off",
@@ -183,5 +183,5 @@ const w = ({ value: s, onChange: e, id: u, onBlur: i }) => {
   ] });
 };
 export {
-  xt as default
+  yt as default
 };

package/dist/{CanvasArea-chEYQhH8.js → CanvasArea-IiD0f6Eq.js}

@@ -3,16 +3,16 @@ var bt = (e, t, n) => t in e ? xt(e, t, { enumerable: !0, configurable: !0, writ
 var J = (e, t, n) => (bt(e, typeof t != "symbol" ? t + "" : t, n), n);
 import { j as r } from "./jsx-runtime-NV737rRe.js";
 import X, { createElement as wt, useCallback as we, useState as U, useEffect as _, Component as Ue, Children as kt, Suspense as ze, useRef as De, useMemo as jt, lazy as Ct } from "react";
-import { map as ie, includes as Be, toUpper as ue, round as Tt, throttle as Ye, noop as ee, isEmpty as K, first as ae, omit as St, pick as It, get as O, isString as ke, memoize as Et, each as Dt, find as Bt, filter as Ke, isNull as Ot } from "lodash";
+import { d as ie, c as Be, H as ue, I as Tt, J as Ye, K as ee, a as K, h as ae, o as St, B as It, g as O, i as ke, m as Et, f as Dt, j as Bt, b as Ke, A as Ot } from "./lodash-3gkdNK5u.js";
 import { ResetIcon as Oe, MobileIcon as Ae, LaptopIcon as At, DesktopIcon as Pt, DotsVerticalIcon as Rt, EraserIcon as Mt, ZoomInIcon as _t, DragHandleDots2Icon as Lt, ArrowUpIcon as Nt, CopyIcon as Ft, TrashIcon as $t } from "@radix-ui/react-icons";
-import { p as je, B as le, W as Je, aI as Wt, aJ as Ht, aK as qt, aL as Ut, aM as zt, R as Ce, ai as Yt, aN as Kt, aO as Jt, aP as Xt, aQ as Vt, aR as Zt, aS as Gt, w as Qt, j as W, aj as V, D as en, E as tn, F as nn, G as rn, H as sn, I as on, J as an, K as ln, ap as cn, L as dn, U as Xe, aH as oe, aT as un, _ as G, ab as pn, aU as re, ae as Te, m as Ve, n as fn, k as hn, o as gn, h as Ze, l as Ge, ag as mn, aV as yn, aW as Qe, aX as vn, aY as xn, x as bn, a as wn, aZ as kn, a_ as jn, a6 as Cn, a$ as Tn, i as Sn, S as et, aw as In } from "./index-89A3jPHh.js";
+import { p as je, B as le, W as Je, aI as Wt, aJ as Ht, aK as qt, aL as Ut, aM as zt, R as Ce, ai as Yt, aN as Kt, aO as Jt, aP as Xt, aQ as Vt, aR as Zt, aS as Gt, w as Qt, j as W, aj as V, D as en, E as tn, F as nn, G as rn, H as sn, I as on, J as an, K as ln, ap as cn, L as dn, U as Xe, aH as oe, aT as un, _ as G, ab as pn, aU as re, ae as Te, m as Ve, n as fn, k as hn, o as gn, h as Ze, l as Ge, ag as mn, aV as yn, aW as Qe, aX as vn, aY as xn, x as bn, a as wn, aZ as kn, a_ as jn, a6 as Cn, a$ as Tn, i as Sn, S as et, aw as In } from "./index-0OqmBgqo.js";
 import { useTranslation as En } from "react-i18next";
 import { useAtom as F } from "jotai";
 import Pe from "react-dom";
 import { g as Dn, S as Re, a as tt } from "./MODIFIERS-MLfpKQY1.js";
-import { r as nt, u as Bn, B as On, E as An } from "./index-Q5q5Y_8a.js";
+import { r as nt, u as Bn, B as On, E as An } from "./index-4fMl4eN2.js";
 import { Quill as Pn } from "react-quill";
-import { u as Rn } from "./useAddBlockByDrop-_kyR0iI4.js";
+import { u as Rn } from "./useAddBlockByDrop-5QW86HjG.js";
 import { useFeature as rt } from "flagged";
 import { flip as Mn } from "@floating-ui/dom";
 import { useFloating as _n, shift as Ln } from "@floating-ui/react-dom";
@@ -23,7 +23,7 @@ import { twMerge as Wn } from "tailwind-merge";
 import { getBlockComponent as Hn } from "@chaibuilder/runtime";
 import "@radix-ui/react-toggle";
 import "class-variance-authority";
-import "./utils-zWMk4dB2.js";
+import "./utils-XsPKXMVo.js";
 import "clsx";
 import "@radix-ui/react-switch";
 import "@radix-ui/react-slot";
@@ -52,7 +52,7 @@ import "react-dnd";
 import "@minoru/react-dnd-treeview";
 import "react-hotkeys-hook";
 import "sonner";
-import "./html-to-json-kGgp07Hv.js";
+import "./html-to-json-Y5M0N8PH.js";
 import "himalaya";
 import "lucide-react";
 const qn = () => {
@@ -1405,7 +1405,7 @@ const Sr = () => {
       )
     }
   );
-}, Dr = Ct(() => import("./AddBlocks-A7WofxHV.js")), Ps = () => {
+}, Dr = Ct(() => import("./AddBlocks-FsdsASNp.js")), Ps = () => {
   const [e, t] = F(In);
   return /* @__PURE__ */ r.jsxs("div", { className: "flex h-full w-full flex-col", children: [
     /* @__PURE__ */ r.jsx(Jn, {}),