@chaibuilder/sdk 3.2.8 → 3.2.9

package/dist/{index-DvdOXKUE.js → index-CIez6R-d.js}

@@ -16,9 +16,9 @@ import React__default, { useEffect, useCallback, useState, useMemo, useRef, Comp
 import { C as COLLECTION_PREFIX, S as STYLES_KEY, j as getSplitChaiClasses, h as getBlocksFromHTML, m as mergeBlocksWithExisting, e as adjustSpacingInContentBlocks, a as applyBindingToBlockProps, b as applyLanguage, g as getBlockTagAttributes, c as getBlockRuntimeProps, d as applyLimit, R as REPEATER_PREFIX, D as DESIGN_TOKEN_PREFIX, k as ROOT_TEMP_KEY } from "./apply-binding-DLaiD20q.js";
 import { d as defaultThemeOptions, f as defaultThemeValues, a as getChaiThemeCssVariables, g as getChaiThemeOptions, p as plugin, h as getThemeFontsUrls, i as getThemeCustomFontFace } from "./plugin-BOcGV_IY.js";
 import { isObject } from "@rjsf/utils";
-import { useDebouncedCallback, useThrottledCallback, useResizeObserver, useDebouncedState } from "@react-hookz/web";
 import { toast, Toaster } from "sonner";
 import { useTranslation, initReactI18next } from "react-i18next";
+import { useDebouncedCallback, useThrottledCallback, useResizeObserver, useDebouncedState } from "@react-hookz/web";
 import Fuse from "fuse.js";
 import UndoManager from "undo-manager";
 import { ab as DropdownMenu, ap as DropdownMenuTrigger, ad as DropdownMenuContent, af as DropdownMenuItem, at as Input$1, aW as Skeleton, d as Alert, e as AlertDescription, v as Button, a1 as Dialog, aa as DialogTrigger, a3 as DialogContent, a9 as DialogTitle, av as Popover, b4 as Tooltip, b7 as TooltipTrigger, ay as PopoverTrigger, b5 as TooltipContent, ax as PopoverContent, F as Command, H as CommandInput, I as CommandList, J as CommandEmpty, K as CommandGroup, L as CommandItem, B as Badge, b6 as TooltipProvider, a as AccordionItem, b as AccordionTrigger, c as AccordionContent, ag as DropdownMenuLabel, ak as DropdownMenuSeparator, ac as DropdownMenuCheckboxItem, aq as HoverCard, as as HoverCardTrigger, ar as HoverCardContent, au as Label, A as Accordion, C as Card, D as CardHeader, y as CardDescription, x as CardContent, b1 as Textarea, z as CardFooter, aB as Select$1, aJ as SelectTrigger, aK as SelectValue, aC as SelectContent, aE as SelectItem, b8 as cn$2, az as ScrollArea, aZ as Tabs, a$ as TabsList, b0 as TabsTrigger, a_ as TabsContent, g as AlertDialog, q as AlertDialogTrigger, j as AlertDialogContent, m as AlertDialogHeader, p as AlertDialogTitle, k as AlertDialogDescription, l as AlertDialogFooter, i as AlertDialogCancel, h as AlertDialogAction, a6 as DialogHeader, aX as Slider, aL as Separator, aY as Switch, aM as Sheet, aO as SheetContent, aR as SheetHeader, aU as SheetTitle } from "./tooltip-DUosa-uC.js";
@@ -708,22 +708,23 @@ class StructureRuleRegistry {
   }
 }
 const defaultRuleRegistry = new StructureRuleRegistry(), useCheckStructure = (r = {}) => {
-  const n = useBuilderProp("flags.validateStructure", !0), o = useSetAtom$1(structureErrorsAtom), a = useSetAtom$1(structureValidationValidAtom), i = useSetAtom$1(hasStructureErrorsAtom), l = useSetAtom$1(hasStructureWarningsAtom), c = useCallback(
-    (u) => {
-      const p = u;
-      if (!n || !p || p.length === 0) return;
-      const h = convertToBlocksTree(p), f = [];
-      let m = defaultRuleRegistry.getRules();
-      r.enableAccessibilityRules && (defaultRuleRegistry.enableAccessibilityRules(), m = defaultRuleRegistry.getRules()), r.customRules && r.customRules.length > 0 && m.push(...r.customRules), m.forEach((y) => {
+  const n = useBuilderProp("flags.validateStructure", !0), o = useSetAtom$1(structureErrorsAtom), a = useSetAtom$1(structureValidationValidAtom), i = useSetAtom$1(hasStructureErrorsAtom), l = useSetAtom$1(hasStructureWarningsAtom);
+  return useCallback(
+    (d) => {
+      const u = d;
+      if (!n || u.length === 0) return;
+      const p = convertToBlocksTree(u), h = [];
+      let f = defaultRuleRegistry.getRules();
+      r.enableAccessibilityRules && (defaultRuleRegistry.enableAccessibilityRules(), f = defaultRuleRegistry.getRules()), r.customRules && r.customRules.length > 0 && f.push(...r.customRules), f.forEach((x) => {
         try {
-          const k = y.validate(p, h);
-          f.push(...k);
-        } catch (k) {
-          console.error(`Error running structure rule "${y.name}":`, k);
+          const y = x.validate(u, p);
+          h.push(...y);
+        } catch (y) {
+          console.error(`Error running structure rule "${x.name}":`, y);
         }
       });
-      const g = f.filter((y) => y.severity === "error").length > 0, b = f.filter((y) => y.severity === "warning").length > 0, x = !g;
-      o(f), a(x), i(g), l(b);
+      const m = h.filter((x) => x.severity === "error").length > 0, g = h.filter((x) => x.severity === "warning").length > 0, b = !m;
+      o(h), a(b), i(m), l(g);
     },
     [
       n,
@@ -734,18 +735,6 @@ const defaultRuleRegistry = new StructureRuleRegistry(), useCheckStructure = (r
       l
     ]
   );
-  return useDebouncedCallback(
-    c,
-    [
-      n,
-      r,
-      o,
-      a,
-      i,
-      l
-    ],
-    1e3
-  );
 }, useBlocksStoreManager = () => {
   const [, r] = useBlocksStore(), { postMessage: n } = useBroadcastChannel(), o = useUpdateBlockAtom(), a = useCheckStructure(), i = useIncrementActionsCount();
   return {
@@ -779,7 +768,7 @@ const defaultRuleRegistry = new StructureRuleRegistry(), useCheckStructure = (r
       l.forEach((c) => {
         const d = omit(c, "_id");
         o({ id: c._id, props: d });
-      }), n({ type: "blocks-props-updated", blocks: l }), r((c) => (a(c), c)), i();
+      }), n({ type: "blocks-props-updated", blocks: l }), i();
     }
   };
 }, blockRepeaterDataAtom = atom({});
@@ -977,13 +966,13 @@ const checkMissingTranslations = (r, n) => n ? r.some((o) => {
     return !d || d === u ? !1 : checkMissingTranslations(y.blocks || [], d);
   };
   return { savePage: useThrottledCallback(
-    async (y = !1, k = !1) => {
-      if (!k && (!c("save_page") || !p))
+    async (y = !1, S = !1) => {
+      if (!S && (!c("save_page") || !p))
         return;
-      const S = i();
-      return S != null && S.blocks && f(S.blocks), n("SAVING"), a("SAVING"), m(0), await o({
+      const k = i();
+      return k != null && k.blocks && f(k.blocks), n("SAVING"), a("SAVING"), m(0), await o({
         autoSave: y,
-        blocks: S.blocks,
+        blocks: k.blocks,
         theme: l,
         needTranslations: g(),
         designTokens: h
@@ -1008,10 +997,10 @@ const checkMissingTranslations = (r, n) => n ? r.some((o) => {
     if (!y && (!c("save_page") || !p))
       return;
     n("SAVING"), a("SAVING");
-    const k = i();
+    const S = i();
     return m(0), await o({
       autoSave: !0,
-      blocks: k.blocks,
+      blocks: S.blocks,
       theme: l,
       needTranslations: g(),
       designTokens: h
@@ -1071,13 +1060,13 @@ const undoRedoStateAtom = atom({
   } = useBlocksStoreManager();
   return {
     moveBlocks: (g, b, x) => {
-      const y = builderStore.get(presentBlocksAtom), k = map(g, (v) => {
-        const B = y.find((w) => w._id === v)._parent || null, A = y.filter((w) => B ? w._parent === B : !w._parent).map((w) => w._id).indexOf(v);
-        return { _id: v, oldParent: B, oldPosition: A };
-      }), S = k.find(({ _id: v }) => v === g[0]);
-      S && S.oldParent === b && S.oldPosition === x || (i(g, b, x), r({
-        undo: () => each(k, ({ _id: v, oldParent: E, oldPosition: B }) => {
-          i([v], E, B);
+      const y = builderStore.get(presentBlocksAtom), S = map(g, (C) => {
+        const B = y.find((w) => w._id === C)._parent || null, A = y.filter((w) => B ? w._parent === B : !w._parent).map((w) => w._id).indexOf(C);
+        return { _id: C, oldParent: B, oldPosition: A };
+      }), k = S.find(({ _id: C }) => C === g[0]);
+      k && k.oldParent === b && k.oldPosition === x || (i(g, b, x), r({
+        undo: () => each(S, ({ _id: C, oldParent: E, oldPosition: B }) => {
+          i([C], E, B);
         }),
         redo: () => i(g, b, x)
       }));
@@ -1089,28 +1078,28 @@ const undoRedoStateAtom = atom({
       });
     },
     removeBlocks: (g) => {
-      var S;
-      const b = builderStore.get(presentBlocksAtom), x = (S = first$1(g)) == null ? void 0 : S._parent, k = b.filter((v) => x ? v._parent === x : !v._parent).indexOf(first$1(g));
+      var k;
+      const b = builderStore.get(presentBlocksAtom), x = (k = first$1(g)) == null ? void 0 : k._parent, S = b.filter((C) => x ? C._parent === x : !C._parent).indexOf(first$1(g));
       a(map(g, "_id")), r({
-        undo: () => o(g, x, k),
+        undo: () => o(g, x, S),
         redo: () => a(map(g, "_id"))
       });
     },
     updateBlocks: (g, b, x) => {
       const y = builderStore.get(presentBlocksAtom);
-      let k = [];
+      let S = [];
       if (x)
-        k = map(g, (S) => ({ _id: S, ...x }));
+        S = map(g, (k) => ({ _id: k, ...x }));
       else {
-        const S = keys$1(b);
-        k = map(g, (v) => {
-          const E = y.find((I) => I._id === v), B = { _id: v };
-          return each(S, (I) => B[I] = E[I]), B;
+        const k = keys$1(b);
+        S = map(g, (C) => {
+          const E = y.find((I) => I._id === C), B = { _id: C };
+          return each(k, (I) => B[I] = E[I]), B;
         });
       }
-      l(map(g, (S) => ({ _id: S, ...b }))), r({
-        undo: () => l(k),
-        redo: () => l(map(g, (S) => ({ _id: S, ...b })))
+      l(map(g, (k) => ({ _id: k, ...b }))), r({
+        undo: () => l(S),
+        redo: () => l(map(g, (k) => ({ _id: k, ...b })))
       });
     },
     updateBlocksRuntime: (g, b) => {
@@ -1127,8 +1116,8 @@ const undoRedoStateAtom = atom({
       const b = builderStore.get(presentBlocksAtom);
       let x = [];
       x = map(g, (y) => {
-        const k = keys$1(y), S = b.find((E) => E._id === y._id), v = {};
-        return each(k, (E) => v[E] = S[E]), v;
+        const S = keys$1(y), k = b.find((E) => E._id === y._id), C = {};
+        return each(S, (E) => C[E] = k[E]), C;
       }), l(g), r({
         undo: () => l(x),
         redo: () => l(g)
@@ -2604,8 +2593,8 @@ const getBlockWithChildren = (r, n) => {
     for (const x in b) {
       const y = b[x];
       if (typeof y == "string" && startsWith(y, STYLES_KEY)) {
-        const { baseClasses: k, classes: S } = getSplitChaiClasses(y);
-        b[x] = compact(flattenDeep([k, S])).join(" ");
+        const { baseClasses: S, classes: k } = getSplitChaiClasses(y);
+        b[x] = compact(flattenDeep([S, k])).join(" ");
       } else
         x !== "_id" && delete b[x];
     }
@@ -2617,7 +2606,7 @@ const getBlockWithChildren = (r, n) => {
         if (i) {
           n(!0), a(null);
           try {
-            const y = u === p ? "" : u, k = b.toLowerCase().includes("translate the content"), S = m === "content" ? pickOnlyAIProps(cloneDeep(getBlockWithChildren(g, d)), u, k) : [f(g, d)], v = await i(m, addLangToPrompt(b, h, m), S, y), { blocks: E, error: B } = v;
+            const y = u === p ? "" : u, S = b.toLowerCase().includes("translate the content"), k = m === "content" ? pickOnlyAIProps(cloneDeep(getBlockWithChildren(g, d)), u, S) : [f(g, d)], C = await i(m, addLangToPrompt(b, h, m), k, y), { blocks: E, error: B } = C;
             if (B) {
               a(B);
               return;
@@ -2631,7 +2620,7 @@ const getBlockWithChildren = (r, n) => {
               c(I);
             } else
               l(E);
-            x && x(v);
+            x && x(C);
           } catch (y) {
             a(y);
           } finally {
@@ -3178,7 +3167,7 @@ const useWrapperBlock = () => useAtomValue$1(wrapperBlockAtom), useCanvasIframe
   const [r] = useBlocksStore();
   return useCallback(
     (n) => {
-      const o = getBlocksFromHTML(n), a = mergeBlocksWithExisting(o, r);
+      const o = syncBlocksWithDefaults(getBlocksFromHTML(n)), a = mergeBlocksWithExisting(o, r);
       return handlei18N(a, r);
     },
     [r]
@@ -3534,23 +3523,23 @@ function calculateElementZone(r, n, o, a, i) {
   }
 }
 function detectDropZone(r, n, o, a, i) {
-  var v, E, B, I;
+  var C, E, B, I;
   const l = r.getAttribute("data-block-id"), c = r.getAttribute("data-block-type") || "Box";
   if (!l)
     return null;
   let d = r.parentElement;
   for (; d && !d.hasAttribute("data-block-id"); )
     d = d.parentElement;
-  const u = l === "canvas" ? l : d == null ? void 0 : d.getAttribute("data-block-id"), p = d ? getOrientation(d) : "vertical", h = getOrientation(r), f = isLeafBlock(c), m = !f && canAcceptChildBlock(c, a), g = ((v = i.defaultView) == null ? void 0 : v.scrollY) || 0, b = ((E = i.defaultView) == null ? void 0 : E.scrollX) || 0;
+  const u = l === "canvas" ? l : d == null ? void 0 : d.getAttribute("data-block-id"), p = d ? getOrientation(d) : "vertical", h = getOrientation(r), f = isLeafBlock(c), m = !f && canAcceptChildBlock(c, a), g = ((C = i.defaultView) == null ? void 0 : C.scrollY) || 0, b = ((E = i.defaultView) == null ? void 0 : E.scrollX) || 0;
   if (l === "canvas" && hasChildBlocks(r)) {
     const A = getChildBlocks(r), w = A[A.length - 1];
     if (w) {
-      const C = w.getBoundingClientRect(), T = r.getBoundingClientRect(), N = window.getComputedStyle(r), j = parseFloat(N.paddingLeft) || 0, P = parseFloat(N.paddingRight) || 0, L = T.width - j - P, D = T.left + b + j;
+      const v = w.getBoundingClientRect(), T = r.getBoundingClientRect(), N = window.getComputedStyle(r), j = parseFloat(N.paddingLeft) || 0, P = parseFloat(N.paddingRight) || 0, L = T.width - j - P, D = T.left + b + j;
       return {
         position: "after",
         placeholderOrientation: "horizontal",
         rect: {
-          top: C.bottom + g,
+          top: v.bottom + g,
           left: D,
           width: L,
           height: 4
@@ -3566,7 +3555,7 @@ function detectDropZone(r, n, o, a, i) {
   if (m && !f && hasChildBlocks(r)) {
     const A = detectGapZone(r, n, o, h);
     if (A) {
-      const w = A.before.getBoundingClientRect(), C = A.after.getBoundingClientRect(), T = r.getBoundingClientRect(), N = window.getComputedStyle(r), j = parseFloat(N.paddingLeft) || 0, P = parseFloat(N.paddingRight) || 0, L = getChildBlocks(r), D = getSiblingsInSameRow(L, A.before, h);
+      const w = A.before.getBoundingClientRect(), v = A.after.getBoundingClientRect(), T = r.getBoundingClientRect(), N = window.getComputedStyle(r), j = parseFloat(N.paddingLeft) || 0, P = parseFloat(N.paddingRight) || 0, L = getChildBlocks(r), D = getSiblingsInSameRow(L, A.before, h);
       let $ = 0;
       if (D.forEach((M) => {
         const O = M.getBoundingClientRect();
@@ -3590,7 +3579,7 @@ function detectDropZone(r, n, o, a, i) {
           // High confidence for gap zones
         };
       } else {
-        const M = w.top + g, O = $ > 0 ? $ : Math.max(w.height, C.height);
+        const M = w.top + g, O = $ > 0 ? $ : Math.max(w.height, v.height);
         return {
           position: "after",
           placeholderOrientation: "vertical",
@@ -3612,7 +3601,7 @@ function detectDropZone(r, n, o, a, i) {
   if (d && u) {
     const A = detectParentEdgeProximity(d, n, o, p);
     if (A) {
-      const w = d.getBoundingClientRect(), C = window.getComputedStyle(d), T = parseFloat(C.paddingLeft) || 0, N = parseFloat(C.paddingRight) || 0, j = parseFloat(C.paddingTop) || 0, P = parseFloat(C.paddingBottom) || 0, L = ((B = i.defaultView) == null ? void 0 : B.scrollY) || 0, D = ((I = i.defaultView) == null ? void 0 : I.scrollX) || 0, $ = p === "vertical" ? "horizontal" : "vertical", M = getMaxSiblingDimensions(d);
+      const w = d.getBoundingClientRect(), v = window.getComputedStyle(d), T = parseFloat(v.paddingLeft) || 0, N = parseFloat(v.paddingRight) || 0, j = parseFloat(v.paddingTop) || 0, P = parseFloat(v.paddingBottom) || 0, L = ((B = i.defaultView) == null ? void 0 : B.scrollY) || 0, D = ((I = i.defaultView) == null ? void 0 : I.scrollX) || 0, $ = p === "vertical" ? "horizontal" : "vertical", M = getMaxSiblingDimensions(d);
       if (A === "start") {
         const O = getChildBlocks(d)[0];
         if (O) {
@@ -3705,20 +3694,20 @@ function detectDropZone(r, n, o, a, i) {
   }
   let y;
   x.position === "inside" ? y = h === "vertical" ? "horizontal" : "vertical" : y = p === "vertical" ? "horizontal" : "vertical";
-  const k = calculatePlaceholderRect(
+  const S = calculatePlaceholderRect(
     r,
     d,
     x.position,
     y,
     i
-  ), S = x.position === "inside" ? l : u;
+  ), k = x.position === "inside" ? l : u;
   return {
     position: x.position,
     placeholderOrientation: y,
-    rect: k,
+    rect: S,
     targetElement: r,
     targetBlockId: l,
-    targetParentId: S,
+    targetParentId: k,
     isEmpty: x.position === "inside" && !hasChildBlocks(r),
     confidence: x.confidence
   };
@@ -3767,14 +3756,14 @@ function getSiblingsInSameRow(r, n, o) {
 }
 function calculatePlaceholderRect(r, n, o, a, i) {
   var j, P;
-  const l = r.getBoundingClientRect(), c = window.getComputedStyle(r), d = ((j = i.defaultView) == null ? void 0 : j.scrollY) || 0, u = ((P = i.defaultView) == null ? void 0 : P.scrollX) || 0, p = parseFloat(c.marginTop) || 0, h = parseFloat(c.marginBottom) || 0, f = parseFloat(c.marginLeft) || 0, m = parseFloat(c.marginRight) || 0, g = parseFloat(c.paddingTop) || 0, b = parseFloat(c.paddingBottom) || 0, x = parseFloat(c.paddingLeft) || 0, y = parseFloat(c.paddingRight) || 0, k = n == null ? void 0 : n.getBoundingClientRect(), S = n && parseFloat(window.getComputedStyle(n).paddingLeft) || 0, v = n && parseFloat(window.getComputedStyle(n).paddingRight) || 0, E = n && parseFloat(window.getComputedStyle(n).paddingTop) || 0, B = n && parseFloat(window.getComputedStyle(n).paddingBottom) || 0, I = n ? getMaxSiblingDimensions(n) : { maxWidth: 0, maxHeight: 0 }, A = n ? getOrientation(n) : "vertical", w = n ? getChildBlocks(n) : [], C = getSiblingsInSameRow(w, r, A);
+  const l = r.getBoundingClientRect(), c = window.getComputedStyle(r), d = ((j = i.defaultView) == null ? void 0 : j.scrollY) || 0, u = ((P = i.defaultView) == null ? void 0 : P.scrollX) || 0, p = parseFloat(c.marginTop) || 0, h = parseFloat(c.marginBottom) || 0, f = parseFloat(c.marginLeft) || 0, m = parseFloat(c.marginRight) || 0, g = parseFloat(c.paddingTop) || 0, b = parseFloat(c.paddingBottom) || 0, x = parseFloat(c.paddingLeft) || 0, y = parseFloat(c.paddingRight) || 0, S = n == null ? void 0 : n.getBoundingClientRect(), k = n && parseFloat(window.getComputedStyle(n).paddingLeft) || 0, C = n && parseFloat(window.getComputedStyle(n).paddingRight) || 0, E = n && parseFloat(window.getComputedStyle(n).paddingTop) || 0, B = n && parseFloat(window.getComputedStyle(n).paddingBottom) || 0, I = n ? getMaxSiblingDimensions(n) : { maxWidth: 0, maxHeight: 0 }, A = n ? getOrientation(n) : "vertical", w = n ? getChildBlocks(n) : [], v = getSiblingsInSameRow(w, r, A);
   let T = 0, N = 0;
-  if (C.forEach((L) => {
+  if (v.forEach((L) => {
     const D = L.getBoundingClientRect();
     D.height > T && (T = D.height), D.width > N && (N = D.width);
   }), o === "before")
     if (a === "horizontal") {
-      const L = k ? k.width - S - v : l.width, D = k ? k.left + u + S : l.left + u;
+      const L = S ? S.width - k - C : l.width, D = S ? S.left + u + k : l.left + u;
       return {
         top: l.top + d - p - 2,
         left: D,
@@ -3782,7 +3771,7 @@ function calculatePlaceholderRect(r, n, o, a, i) {
         height: 4
       };
     } else {
-      const L = l.top + d, D = A === "horizontal" && T > 0 ? T : I.maxHeight > 0 ? I.maxHeight : k ? k.height - E - B : l.height;
+      const L = l.top + d, D = A === "horizontal" && T > 0 ? T : I.maxHeight > 0 ? I.maxHeight : S ? S.height - E - B : l.height;
       return {
         top: L,
         left: l.left + u - f - 2,
@@ -3792,7 +3781,7 @@ function calculatePlaceholderRect(r, n, o, a, i) {
     }
   else if (o === "after")
     if (a === "horizontal") {
-      const L = k ? k.width - S - v : l.width, D = k ? k.left + u + S : l.left + u;
+      const L = S ? S.width - k - C : l.width, D = S ? S.left + u + k : l.left + u;
       return {
         top: l.bottom + d + h - 2,
         left: D,
@@ -3800,7 +3789,7 @@ function calculatePlaceholderRect(r, n, o, a, i) {
         height: 4
       };
     } else {
-      const L = l.top + d, D = A === "horizontal" && T > 0 ? T : I.maxHeight > 0 ? I.maxHeight : k ? k.height - E - B : l.height;
+      const L = l.top + d, D = A === "horizontal" && T > 0 ? T : I.maxHeight > 0 ? I.maxHeight : S ? S.height - E - B : l.height;
       return {
         top: L,
         left: l.right + u + m - 2,
@@ -3884,31 +3873,31 @@ const useBlockDrop = () => {
         return;
       }
       n(null);
-      const k = o.targetBlockId, S = o.targetParentId;
-      if (!k)
+      const S = o.targetBlockId, k = o.targetParentId;
+      if (!S)
         return;
-      const { parentId: v, index: E, replaceImageUrl: B } = calculateInsertionIndex(
+      const { parentId: C, index: E, replaceImageUrl: B } = calculateInsertionIndex(
         i,
-        k,
         S,
+        k,
         o.position,
         r
       ), I = r._id !== void 0;
       if (B && isDraggingOnlyImageBlock(r)) {
-        b([k], { image: get(r, "blocks.0.image") }), setTimeout(() => {
+        b([S], { image: get(r, "blocks.0.image") }), setTimeout(() => {
           g(m + 1);
         }, 50);
         return;
       }
       if (I)
-        d([r._id], v === null ? void 0 : v, E), h(), p([]), u([r._id]);
+        d([r._id], C === null ? void 0 : C, E), h(), p([]), u([r._id]);
       else {
         const A = r._type || r.type, w = r != null && r.blocks ? isFunction$1(r == null ? void 0 : r.blocks) ? syncBlocksWithDefaults(r == null ? void 0 : r.blocks()) : r == null ? void 0 : r.blocks : null;
         c(
           A === "PartialBlock" ? {
             blocks: [{ _type: A, _id: "partial-block", partialBlockId: r.partialBlockId }]
           } : (w == null ? void 0 : w.length) > 0 ? { blocks: [...w] } : { type: A },
-          v,
+          C,
           E
         );
       }
@@ -4013,22 +4002,22 @@ const LEAF_BLOCK_TYPES = [
       if (!(c != null && c.defaultView)) return;
       const m = c.defaultView, g = m.innerHeight, b = m.scrollY, x = c.documentElement.scrollHeight;
       u.current = f;
-      const y = f, k = g - f;
-      let S = !1, v = null, E = 0;
-      if (y < AUTO_SCROLL_CONFIG.EDGE_ZONE && b > 0 ? (S = !0, v = "up", E = y) : k < AUTO_SCROLL_CONFIG.EDGE_ZONE && b + g < x && (S = !0, v = "down", E = k), !S && d.current !== null) {
+      const y = f, S = g - f;
+      let k = !1, C = null, E = 0;
+      if (y < AUTO_SCROLL_CONFIG.EDGE_ZONE && b > 0 ? (k = !0, C = "up", E = y) : S < AUTO_SCROLL_CONFIG.EDGE_ZONE && b + g < x && (k = !0, C = "down", E = S), !k && d.current !== null) {
         cancelAnimationFrame(d.current), d.current = null;
         return;
       }
-      if (S && v) {
+      if (k && C) {
         const B = 1 - E / AUTO_SCROLL_CONFIG.EDGE_ZONE, I = AUTO_SCROLL_CONFIG.MIN_SCROLL_SPEED + (AUTO_SCROLL_CONFIG.MAX_SCROLL_SPEED - AUTO_SCROLL_CONFIG.MIN_SCROLL_SPEED) * B, A = () => {
           if (!isDragging || !m) {
             d.current = null;
             return;
           }
-          const w = v === "up" ? -I : I;
+          const w = C === "up" ? -I : I;
           m.scrollBy(0, w);
-          const C = m.scrollY, T = C > 0, N = C + g < x, j = u.current, P = g - u.current;
-          v === "up" && T && j < AUTO_SCROLL_CONFIG.EDGE_ZONE || v === "down" && N && P < AUTO_SCROLL_CONFIG.EDGE_ZONE ? d.current = requestAnimationFrame(A) : d.current = null;
+          const v = m.scrollY, T = v > 0, N = v + g < x, j = u.current, P = g - u.current;
+          C === "up" && T && j < AUTO_SCROLL_CONFIG.EDGE_ZONE || C === "down" && N && P < AUTO_SCROLL_CONFIG.EDGE_ZONE ? d.current = requestAnimationFrame(A) : d.current = null;
         };
         d.current === null && (d.current = requestAnimationFrame(A));
       }
@@ -4051,18 +4040,18 @@ const LEAF_BLOCK_TYPES = [
       const y = r._id;
       if (y && (b === y || isDescendantOf(b, y, l)))
         return;
-      const k = r._type || r.type;
-      if (!k)
+      const S = r._type || r.type;
+      if (!S)
         return;
-      const S = f.clientX, v = f.clientY;
-      p(v);
-      const E = detectDropZone(g, S, v, k, c);
+      const k = f.clientX, C = f.clientY;
+      p(C);
+      const E = detectDropZone(g, k, C, S, c);
       if (!E)
         return;
       const B = g.getAttribute("data-block-type") || "Box";
       let I = !1;
       const A = LEAF_BLOCK_TYPES.includes(B);
-      if (B === "Image" && k === "Image" && isDraggingOnlyImageBlock(r)) {
+      if (B === "Image" && S === "Image" && isDraggingOnlyImageBlock(r)) {
         i(b), o({
           isVisible: !0,
           isValid: !0,
@@ -4081,14 +4070,14 @@ const LEAF_BLOCK_TYPES = [
       if (E.position === "inside") {
         if (A || y && !canDropWithoutCircularReference(y, b, l))
           return;
-        I = canAcceptChildBlock(B, k);
+        I = canAcceptChildBlock(B, S);
       } else {
-        let C = g.parentElement, T = "Box";
-        for (; C && !C.hasAttribute("data-block-id"); )
-          C = C.parentElement;
-        if (C && (T = C.getAttribute("data-block-type") || "Box"), y && !canDropAsSiblingWithoutCircularReference(y, b, l))
+        let v = g.parentElement, T = "Box";
+        for (; v && !v.hasAttribute("data-block-id"); )
+          v = v.parentElement;
+        if (v && (T = v.getAttribute("data-block-type") || "Box"), y && !canDropAsSiblingWithoutCircularReference(y, b, l))
           return;
-        I = canAcceptChildBlock(T, k);
+        I = canAcceptChildBlock(T, S);
       }
       if (!I)
         return;
@@ -4425,9 +4414,9 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span",
       }),
       size({
         boundary: h == null ? void 0 : h.body,
-        apply({ availableWidth: v, availableHeight: E, elements: B }) {
+        apply({ availableWidth: C, availableHeight: E, elements: B }) {
           Object.assign(B.floating.style, {
-            maxWidth: `${Math.max(200, v)}px`,
+            maxWidth: `${Math.max(200, C)}px`,
             maxHeight: `${Math.max(100, E)}px`
           });
         }
@@ -4436,16 +4425,16 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span",
     elements: { reference: o }
   });
   useResizeObserver(o, () => x(), o !== null), useResizeObserver(h == null ? void 0 : h.body, () => x(), (h == null ? void 0 : h.body) !== null);
-  const y = get(r, "_parent", null), k = isEmpty(get(r, "_name", "")) ? get(r, "_type", "") : get(r, "_name", "");
+  const y = get(r, "_parent", null), S = isEmpty(get(r, "_name", "")) ? get(r, "_type", "") : get(r, "_name", "");
   useEffect(() => {
-    let v = null;
-    return o ? (v = setTimeout(() => x(), 500), () => {
-      v && clearTimeout(v);
+    let C = null;
+    return o ? (C = setTimeout(() => x(), 500), () => {
+      C && clearTimeout(C);
     }) : (x(), () => {
-      v && clearTimeout(v);
+      C && clearTimeout(C);
     });
   }, [o, r == null ? void 0 : r._id]);
-  const [, S] = useSidebarActivePanel();
+  const [, k] = useSidebarActivePanel();
   return !n && (!o || !r || p) ? null : /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(
     "div",
     {
@@ -4453,13 +4442,13 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span",
       tabIndex: 0,
       ref: b.setFloating,
       style: g,
-      onClick: (v) => {
-        v.stopPropagation(), v.preventDefault();
+      onClick: (C) => {
+        C.stopPropagation(), C.preventDefault();
       },
-      onMouseEnter: (v) => {
-        v.stopPropagation(), c(null);
+      onMouseEnter: (C) => {
+        C.stopPropagation(), c(null);
       },
-      onKeyDown: (v) => v.stopPropagation(),
+      onKeyDown: (C) => C.stopPropagation(),
       className: `isolate z-[999] flex h-6 items-center justify-between bg-blue-500 py-2 text-xs text-white ${n ? "opacity-0" : ""}`,
       children: /* @__PURE__ */ jsxs(Fragment$1, { children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
@@ -4474,14 +4463,14 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span",
             }
           )
         ] }),
-        /* @__PURE__ */ jsx("div", { className: `w-full ${f ? "cursor-grab active:cursor-grabbing" : ""}`, children: /* @__PURE__ */ jsx("div", { className: "mr-10 w-full items-center space-x-1 px-1 leading-tight", children: k }) }),
+        /* @__PURE__ */ jsx("div", { className: `w-full ${f ? "cursor-grab active:cursor-grabbing" : ""}`, children: /* @__PURE__ */ jsx("div", { className: "mr-10 w-full items-center space-x-1 px-1 leading-tight", children: S }) }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 pl-1 pr-1.5", children: [
           u(PERMISSIONS.ADD_BLOCK) && /* @__PURE__ */ jsx(
             AiIcon,
             {
               className: "h-4 w-4 rounded hover:bg-white hover:text-blue-500",
               onClick: () => {
-                S("chai-chat-panel"), pubsub.publish(CHAI_BUILDER_EVENTS.OPEN_AI_PANEL);
+                k("chai-chat-panel"), pubsub.publish(CHAI_BUILDER_EVENTS.OPEN_AI_PANEL);
               }
             }
           ),
@@ -4886,7 +4875,7 @@ const ChaiFrame = React__default.forwardRef((r, n) => /* @__PURE__ */ jsx(Frame,
 }, useDirectBlockDrag = () => {
   const [, r] = useSelectedBlockIds(), { onDragStart: n, onDragEnd: o } = useDragAndDrop(), [a] = useBlocksStore(), i = useRef(null), [l, c] = useAtom$1(lastClickTimeAtom), [d, u] = useAtom$1(clickCountAtom), p = useCallback(
     (m) => {
-      var k;
+      var S;
       if (m.button !== 0) return;
       const g = Date.now(), b = g - l;
       if (b < 400 && b > 0) {
@@ -4894,7 +4883,7 @@ const ChaiFrame = React__default.forwardRef((r, n) => /* @__PURE__ */ jsx(Frame,
         return;
       }
       c(g);
-      const y = (k = m.target.closest("[data-block-id]")) == null ? void 0 : k.getAttribute("data-block-id");
+      const y = (S = m.target.closest("[data-block-id]")) == null ? void 0 : S.getAttribute("data-block-id");
       y && (r([y]), i.current = y);
     },
     [r, l, c, d, u]
@@ -4945,12 +4934,12 @@ const RteDropdownMenu = ({
 }) => {
   const { document: l } = useFrame(), [c, d] = useState({ left: void 0, right: void 0, top: void 0, bottom: void 0 }), [u, p] = useState(!1), h = useRef(null);
   if (useEffect(() => {
-    var k, S;
+    var S, k;
     if (!u) {
       d({ left: void 0, right: void 0, top: void 0, bottom: void 0 });
       return;
     }
-    const f = (k = h.current) == null ? void 0 : k.getBoundingClientRect(), m = (S = i.current) == null ? void 0 : S.getBoundingClientRect();
+    const f = (S = h.current) == null ? void 0 : S.getBoundingClientRect(), m = (k = i.current) == null ? void 0 : k.getBoundingClientRect();
     let g = f == null ? void 0 : f.left, b = (f == null ? void 0 : f.bottom) + 4, x, y;
     (m == null ? void 0 : m.left) + (m == null ? void 0 : m.width) + 50 >= l.body.offsetWidth && (g = void 0, x = l.body.offsetWidth - (f == null ? void 0 : f.right)), b + 202 >= l.body.clientHeight && (b = null, y = l.body.clientHeight - (f == null ? void 0 : f.bottom) + (m == null ? void 0 : m.height)), d({ left: g, top: b, right: x, bottom: y });
   }, [u]), a === "canvas") {
@@ -5101,8 +5090,8 @@ const getActiveClasses$1 = (r, n, o) => {
     )
   ] });
 }, RteColorPicker = ({ editor: r, from: n, menuRef: o }) => {
-  var S, v;
-  const a = (S = r == null ? void 0 : r.getAttributes("textStyle")) == null ? void 0 : S.color, i = (v = r == null ? void 0 : r.getAttributes("highlight")) == null ? void 0 : v.color, [l, c] = useState(a || "#000000F2"), [d, u] = useState(i || "#00000057"), [p, h] = useDebouncedState(l, 150), [f, m] = useDebouncedState(d, 150), g = (E, B) => {
+  var k, C;
+  const a = (k = r == null ? void 0 : r.getAttributes("textStyle")) == null ? void 0 : k.color, i = (C = r == null ? void 0 : r.getAttributes("highlight")) == null ? void 0 : C.color, [l, c] = useState(a || "#000000F2"), [d, u] = useState(i || "#00000057"), [p, h] = useDebouncedState(l, 150), [f, m] = useDebouncedState(d, 150), g = (E, B) => {
     B ? (c(E), h(E)) : (r == null || r.chain().setColor(E).run(), c(E));
   }, b = (E, B) => {
     B ? (u(E), m(E)) : (r == null || r.chain().setHighlight({ color: E }).run(), u(E));
@@ -8725,8 +8714,8 @@ class Fitter {
     let b = p == d.childCount;
     b || (g = -1), this.placed = addToFragment(this.placed, o, Fragment.from(h)), this.frontier[o].match = f, b && g < 0 && a && a.type == this.frontier[this.depth].type && this.frontier.length > 1 && this.closeFrontierNode();
     for (let x = 0, y = d; x < g; x++) {
-      let k = y.lastChild;
-      this.frontier.push({ type: k.type, match: k.contentMatchAt(k.childCount) }), y = k.content;
+      let S = y.lastChild;
+      this.frontier.push({ type: S.type, match: S.contentMatchAt(S.childCount) }), y = S.content;
     }
     this.unplaced = b ? n == 0 ? Slice.empty : new Slice(dropFromFragment(c.content, n - 1, 1), n - 1, g < 0 ? c.openEnd : n - 1) : new Slice(dropFromFragment(c.content, n, p), c.openStart, c.openEnd);
   }
@@ -9605,8 +9594,8 @@ function deleteBarrier(r, n, o, a) {
   if (p && (c = (d = i.contentMatchAt(i.childCount)).findWrapping(l.type)) && d.matchType(c[0] || l.type).validEnd) {
     if (o) {
       let g = n.pos + l.nodeSize, b = Fragment.empty;
-      for (let k = c.length - 1; k >= 0; k--)
-        b = Fragment.from(c[k].create(null, b));
+      for (let S = c.length - 1; S >= 0; S--)
+        b = Fragment.from(c[S].create(null, b));
       b = Fragment.from(i.copy(b));
       let x = r.tr.step(new ReplaceAroundStep(n.pos - 1, g, n.pos, g, new Slice(b, 1, 0), c.length, !0)), y = x.doc.resolve(g + 2 * c.length);
       y.nodeAfter && y.nodeAfter.type == i.type && canJoin(x.doc, y.pos) && x.join(y.pos), o(x.scrollIntoView());
@@ -9625,11 +9614,11 @@ function deleteBarrier(r, n, o, a) {
       y++;
     if (g.canReplace(g.childCount, g.childCount, x.content)) {
       if (o) {
-        let k = Fragment.empty;
-        for (let v = b.length - 1; v >= 0; v--)
-          k = Fragment.from(b[v].copy(k));
-        let S = r.tr.step(new ReplaceAroundStep(n.pos - b.length, n.pos + l.nodeSize, n.pos + y, n.pos + l.nodeSize - y, new Slice(k, b.length, 0), 0, !0));
-        o(S.scrollIntoView());
+        let S = Fragment.empty;
+        for (let C = b.length - 1; C >= 0; C--)
+          S = Fragment.from(b[C].copy(S));
+        let k = r.tr.step(new ReplaceAroundStep(n.pos - b.length, n.pos + l.nodeSize, n.pos + y, n.pos + l.nodeSize - y, new Slice(S, b.length, 0), 0, !0));
+        o(k.scrollIntoView());
       }
       return !0;
     }
@@ -9816,8 +9805,8 @@ class CommandManager {
   createChain(n, o = !0) {
     const { rawCommands: a, editor: i, state: l } = this, { view: c } = i, d = [], u = !!n, p = n || l.tr, h = () => (!u && o && !p.getMeta("preventDispatch") && !this.hasCustomState && c.dispatch(p), d.every((m) => m === !0)), f = {
       ...Object.fromEntries(Object.entries(a).map(([m, g]) => [m, (...x) => {
-        const y = this.buildProps(p, o), k = g(...x)(y);
-        return d.push(k), f;
+        const y = this.buildProps(p, o), S = g(...x)(y);
+        return d.push(S), f;
       }])),
       run: h
     };
@@ -10258,8 +10247,8 @@ const isFragment = (r) => !("type" in r), insertContentAt = (r, n, o) => ({ tr:
         x = n.map((y) => y.text || "").join("");
       else if (n instanceof Fragment) {
         let y = "";
-        n.forEach((k) => {
-          k.text && (y += k.text);
+        n.forEach((S) => {
+          S.text && (y += S.text);
         }), x = y;
       } else typeof n == "object" && n && n.text ? x = n.text : x = n;
       a.insertText(x, h, f);
@@ -10440,11 +10429,11 @@ function isMarkActive(r, n, o = {}) {
     r.doc.nodesBetween(g, b, (x, y) => {
       if (!x.isText && !x.marks.length)
         return;
-      const k = Math.max(g, y), S = Math.min(b, y + x.nodeSize), v = S - k;
-      c += v, d.push(...x.marks.map((E) => ({
+      const S = Math.max(g, y), k = Math.min(b, y + x.nodeSize), C = k - S;
+      c += C, d.push(...x.marks.map((E) => ({
         mark: E,
-        from: k,
-        to: S
+        from: S,
+        to: k
       })));
     });
   }), c === 0)
@@ -10521,9 +10510,9 @@ const setMark = (r, n = {}) => ({ tr: o, state: a, dispatch: i }) => {
         const h = p.$from.pos, f = p.$to.pos;
         a.doc.nodesBetween(h, f, (m, g) => {
           const b = Math.max(g, h), x = Math.min(g + m.nodeSize, f);
-          m.marks.find((k) => k.type === u) ? m.marks.forEach((k) => {
-            u === k.type && o.addMark(b, x, u.create({
-              ...k.attrs,
+          m.marks.find((S) => S.type === u) ? m.marks.forEach((S) => {
+            u === S.type && o.addMark(b, x, u.create({
+              ...S.attrs,
               ...n
             }));
           }) : o.addMark(b, x, u.create(n));
@@ -10596,22 +10585,22 @@ const splitBlock = ({ keepMarks: r = !0 } = {}) => ({ tr: n, state: o, dispatch:
     if (u.depth === 2 || u.node(-3).type !== d || u.index(-2) !== u.node(-2).childCount - 1)
       return !1;
     if (i) {
-      let k = Fragment.empty;
-      const S = u.index(-1) ? 1 : u.index(-2) ? 2 : 3;
-      for (let w = u.depth - S; w >= u.depth - 3; w -= 1)
-        k = Fragment.from(u.node(w).copy(k));
-      const v = u.indexAfter(-1) < u.node(-2).childCount ? 1 : u.indexAfter(-2) < u.node(-3).childCount ? 2 : 3, E = {
+      let S = Fragment.empty;
+      const k = u.index(-1) ? 1 : u.index(-2) ? 2 : 3;
+      for (let w = u.depth - k; w >= u.depth - 3; w -= 1)
+        S = Fragment.from(u.node(w).copy(S));
+      const C = u.indexAfter(-1) < u.node(-2).childCount ? 1 : u.indexAfter(-2) < u.node(-3).childCount ? 2 : 3, E = {
         ...getSplittedAttributes(m, u.node().type.name, u.node().attrs),
         ...n
       }, B = ((c = d.contentMatch.defaultType) === null || c === void 0 ? void 0 : c.createAndFill(E)) || void 0;
-      k = k.append(Fragment.from(d.createAndFill(null, B) || void 0));
-      const I = u.before(u.depth - (S - 1));
-      o.replace(I, u.after(-v), new Slice(k, 4 - S, 0));
+      S = S.append(Fragment.from(d.createAndFill(null, B) || void 0));
+      const I = u.before(u.depth - (k - 1));
+      o.replace(I, u.after(-C), new Slice(S, 4 - k, 0));
       let A = -1;
-      o.doc.nodesBetween(I, o.doc.content.size, (w, C) => {
+      o.doc.nodesBetween(I, o.doc.content.size, (w, v) => {
         if (A > -1)
           return !1;
-        w.isTextblock && w.content.size === 0 && (A = C + 1);
+        w.isTextblock && w.content.size === 0 && (A = v + 1);
       }), A > -1 && o.setSelection(TextSelection.near(o.doc.resolve(A))), o.scrollIntoView();
     }
     return !0;
@@ -10631,10 +10620,10 @@ const splitBlock = ({ keepMarks: r = !0 } = {}) => ({ tr: n, state: o, dispatch:
   if (!canSplit(o.doc, u.pos, 2))
     return !1;
   if (i) {
-    const { selection: k, storedMarks: S } = a, { splittableMarks: v } = l.extensionManager, E = S || k.$to.parentOffset && k.$from.marks();
+    const { selection: S, storedMarks: k } = a, { splittableMarks: C } = l.extensionManager, E = k || S.$to.parentOffset && S.$from.marks();
     if (o.split(u.pos, 2, y).scrollIntoView(), !E || !i)
       return !0;
-    const B = E.filter((I) => v.includes(I.type.name));
+    const B = E.filter((I) => C.includes(I.type.name));
     o.ensureMarks(B);
   }
   return !0;
@@ -10657,11 +10646,11 @@ const splitBlock = ({ keepMarks: r = !0 } = {}) => ({ tr: n, state: o, dispatch:
   const i = r.doc.nodeAt(a);
   return o.node.type === (i == null ? void 0 : i.type) && canJoin(r.doc, a) && r.join(a), !0;
 }, toggleList = (r, n, o, a = {}) => ({ editor: i, tr: l, state: c, dispatch: d, chain: u, commands: p, can: h }) => {
-  const { extensions: f, splittableMarks: m } = i.extensionManager, g = getNodeType(r, c.schema), b = getNodeType(n, c.schema), { selection: x, storedMarks: y } = c, { $from: k, $to: S } = x, v = k.blockRange(S), E = y || x.$to.parentOffset && x.$from.marks();
-  if (!v)
+  const { extensions: f, splittableMarks: m } = i.extensionManager, g = getNodeType(r, c.schema), b = getNodeType(n, c.schema), { selection: x, storedMarks: y } = c, { $from: S, $to: k } = x, C = S.blockRange(k), E = y || x.$to.parentOffset && x.$from.marks();
+  if (!C)
     return !1;
   const B = findParentNode((I) => isList(I.type.name, f))(x);
-  if (v.depth >= 1 && B && v.depth - B.depth <= 1) {
+  if (C.depth >= 1 && B && C.depth - B.depth <= 1) {
     if (B.node.type === g)
       return p.liftListItem(b);
     if (isList(B.node.type.name, f) && g.validContent(B.node.content) && d)
@@ -10732,11 +10721,11 @@ const splitBlock = ({ keepMarks: r = !0 } = {}) => ({ tr: n, state: o, dispatch:
       y < p && l && l === x.type && (g = Math.max(y, p), b = Math.min(y + x.nodeSize, h), f = y, m = x), y >= p && y <= h && (l && l === x.type && o.setNodeMarkup(y, void 0, {
         ...x.attrs,
         ...n
-      }), c && x.marks.length && x.marks.forEach((k) => {
-        if (c === k.type) {
-          const S = Math.max(y, p), v = Math.min(y + x.nodeSize, h);
-          o.addMark(S, v, c.create({
-            ...k.attrs,
+      }), c && x.marks.length && x.marks.forEach((S) => {
+        if (c === S.type) {
+          const k = Math.max(y, p), C = Math.min(y + x.nodeSize, h);
+          o.addMark(k, C, c.create({
+            ...S.attrs,
             ...n
           }));
         }
@@ -10893,8 +10882,8 @@ Extension.create({
       () => c.undoInputRule(),
       // maybe convert first text block node to default node
       () => c.command(({ tr: d }) => {
-        const { selection: u, doc: p } = d, { empty: h, $anchor: f } = u, { pos: m, parent: g } = f, b = f.parent.isTextblock && m > 0 ? d.doc.resolve(m - 1) : f, x = b.parent.type.spec.isolating, y = f.pos - f.parentOffset, k = x && b.parent.childCount === 1 ? y === f.pos : Selection.atStart(p).from === m;
-        return !h || !g.type.isTextblock || g.textContent.length || !k || k && f.parent.type.name === "paragraph" ? !1 : c.clearNodes();
+        const { selection: u, doc: p } = d, { empty: h, $anchor: f } = u, { pos: m, parent: g } = f, b = f.parent.isTextblock && m > 0 ? d.doc.resolve(m - 1) : f, x = b.parent.type.spec.isolating, y = f.pos - f.parentOffset, S = x && b.parent.childCount === 1 ? y === f.pos : Selection.atStart(p).from === m;
+        return !h || !g.type.isTextblock || g.textContent.length || !S || S && f.parent.type.name === "paragraph" ? !1 : c.clearNodes();
       }),
       () => c.deleteSelection(),
       () => c.joinBackward(),
@@ -11105,10 +11094,10 @@ const RichTextEditor = memo(
       placeholder: "Enter text here",
       onUpdate: ({ editor: p }) => a((p == null ? void 0 : p.getHTML()) || ""),
       onBlur: ({ editor: p, event: h }) => {
-        const f = h == null ? void 0 : h.relatedTarget, m = l.querySelector(".ProseMirror"), g = l.querySelector(".tippy-box"), b = l.querySelector("#chai-rich-text-menu-bar"), x = m == null ? void 0 : m.contains(f), y = g == null ? void 0 : g.contains(f), k = b == null ? void 0 : b.contains(f), S = window.document.getElementById("rte-widget-color-picker");
-        if (!x && !y && !k && !S) {
-          const v = (p == null ? void 0 : p.getHTML()) || "";
-          o(v);
+        const f = h == null ? void 0 : h.relatedTarget, m = l.querySelector(".ProseMirror"), g = l.querySelector(".tippy-box"), b = l.querySelector("#chai-rich-text-menu-bar"), x = m == null ? void 0 : m.contains(f), y = g == null ? void 0 : g.contains(f), S = b == null ? void 0 : b.contains(f), k = window.document.getElementById("rte-widget-color-picker");
+        if (!x && !y && !S && !k) {
+          const C = (p == null ? void 0 : p.getHTML()) || "";
+          o(C);
         }
       },
       from: "canvas"
@@ -11208,16 +11197,16 @@ const RichTextEditor = memo(
   }
 ), WithBlockTextEditor = memo(
   ({ block: r, children: n }) => {
-    const o = "content", { document: a } = useFrame(), { editingBlockId: i, editingItemIndex: l, setEditingBlockId: c, setEditingItemIndex: d } = useInlineEditing(), [u, p] = useState(null), h = useRef(null), { clearHighlight: f } = useBlockHighlight(), m = useUpdateBlocksProps(), { selectedLang: g } = useLanguages(), [, b] = useSelectedBlockIds(), x = useRef(null), y = i, { blockContent: k, blockType: S } = useMemo(() => {
+    const o = "content", { document: a } = useFrame(), { editingBlockId: i, editingItemIndex: l, setEditingBlockId: c, setEditingItemIndex: d } = useInlineEditing(), [u, p] = useState(null), h = useRef(null), { clearHighlight: f } = useBlockHighlight(), m = useUpdateBlocksProps(), { selectedLang: g } = useLanguages(), [, b] = useSelectedBlockIds(), x = useRef(null), y = i, { blockContent: S, blockType: k } = useMemo(() => {
       var N;
       const A = r._type;
       let w = r[o];
-      const C = getRegisteredChaiBlock(r._type);
-      return g && ((N = C == null ? void 0 : C.i18nProps) == null ? void 0 : N.includes(o)) && has(r, `${o}-${g}`) && (w = get(r, `${o}-${g}`)), { blockContent: w, blockType: A };
-    }, [r, g]), v = useCallback(
+      const v = getRegisteredChaiBlock(r._type);
+      return g && ((N = v == null ? void 0 : v.i18nProps) == null ? void 0 : N.includes(o)) && has(r, `${o}-${g}`) && (w = get(r, `${o}-${g}`)), { blockContent: w, blockType: A };
+    }, [r, g]), C = useCallback(
       (A) => {
-        var C;
-        const w = A || ((C = h.current) == null ? void 0 : C.innerText);
+        var v;
+        const w = A || ((v = h.current) == null ? void 0 : v.innerText);
         m([y], { [o]: w }), p(null), c(null), d(-1), b([]), y && setTimeout(() => b([y]), 100);
       },
       [y, m, c, b, g]
@@ -11229,7 +11218,7 @@ const RichTextEditor = memo(
       1e3
     ), B = useCallback(
       (A) => {
-        A.preventDefault(), y && (x.current = y), v(), setTimeout(() => {
+        A.preventDefault(), y && (x.current = y), C(), setTimeout(() => {
           const w = x.current;
           x.current = null, b([w]);
         }, 100);
@@ -11239,29 +11228,29 @@ const RichTextEditor = memo(
     useEffect(() => {
       var T;
       if (!y) return;
-      const A = `[data-block-id="${y}"]`, w = l >= 0 ? `[data-block-index="${l}"]` : "", C = a.querySelector(`${A}${w}`);
-      C && ((T = C == null ? void 0 : C.classList) == null || T.add("sr-only"), p(C));
-    }, [y, S, a, l]);
-    const I = useMemo(() => u ? (f(), ["RichText", "Paragraph"].includes(S) ? /* @__PURE__ */ jsx(
+      const A = `[data-block-id="${y}"]`, w = l >= 0 ? `[data-block-index="${l}"]` : "", v = a.querySelector(`${A}${w}`);
+      v && ((T = v == null ? void 0 : v.classList) == null || T.add("sr-only"), p(v));
+    }, [y, k, a, l]);
+    const I = useMemo(() => u ? (f(), ["RichText", "Paragraph"].includes(k) ? /* @__PURE__ */ jsx(
       RichTextEditor,
       {
-        blockContent: k,
+        blockContent: S,
         editingElement: u,
         onChange: E,
-        onClose: v,
+        onClose: C,
         onEscape: B
       }
     ) : /* @__PURE__ */ jsx(
       MemoizedEditor,
       {
         editorRef: h,
-        blockContent: k,
+        blockContent: S,
         editingElement: u,
-        onClose: v,
+        onClose: C,
         onChange: E,
         onEscape: B
       }
-    )) : null, [u, y, S, k, v, g]);
+    )) : null, [u, y, k, S, C, g]);
     return /* @__PURE__ */ jsxs(Fragment$1, { children: [
       I,
       n
@@ -11296,7 +11285,7 @@ const RichTextEditor = memo(
   blockAtom: n,
   children: o
 }) => {
-  const { editingBlockId: a, editingItemIndex: i } = useInlineEditing(), [l] = useAtom$1(n), c = useMemo(() => getRegisteredChaiBlock(l._type), [l._type]), { selectedLang: d, fallbackLang: u } = useLanguages(), p = useBlockRuntimeProps(), h = usePageExternalData(), [f] = useAtom$1(dataBindingActiveAtom), m = get(c, "component", null), { index: g, key: b } = useContext(RepeaterContext), { mode: x } = useEditorMode(), y = useAtomValue$1(chaiDesignTokensAtom), k = useIsDragAndDropEnabled(), S = x === "edit", v = useDirectBlockDrag(), E = useMemo(
+  const { editingBlockId: a, editingItemIndex: i } = useInlineEditing(), [l] = useAtom$1(n), c = useMemo(() => getRegisteredChaiBlock(l._type), [l._type]), { selectedLang: d, fallbackLang: u } = useLanguages(), p = useBlockRuntimeProps(), h = usePageExternalData(), [f] = useAtom$1(dataBindingActiveAtom), m = get(c, "component", null), { index: g, key: b } = useContext(RepeaterContext), { mode: x } = useEditorMode(), y = useAtomValue$1(chaiDesignTokensAtom), S = useIsDragAndDropEnabled(), k = x === "edit", C = useDirectBlockDrag(), E = useMemo(
     () => f ? applyBindingToBlockProps(applyLanguage(l, d, c), h, {
       index: g,
       key: b
@@ -11314,14 +11303,14 @@ const RichTextEditor = memo(
       "data-block-type": l._type,
       "data-block-index": g
     };
-    return S && k ? {
+    return k && S ? {
       ...P,
       draggable: !a,
-      onMouseDown: v.onMouseDown,
-      onDragStart: v.onDragStart,
-      onDragEnd: v.onDragEnd
+      onMouseDown: C.onMouseDown,
+      onDragStart: C.onDragStart,
+      onDragEnd: C.onDragEnd
     } : P;
-  }, [l._id, l._type, g, S, k, v, a]), w = useMemo(
+  }, [l._id, l._type, g, k, S, C, a]), w = useMemo(
     () => ({
       blockProps: A,
       inBuilder: x === "edit",
@@ -11333,7 +11322,7 @@ const RichTextEditor = memo(
       ...r
     }),
     [x, A, d, u, E, B, I, r]
-  ), C = useMemo(() => !CORE_BLOCKS.includes(l._type), [l._type]), T = useMemo(() => get(l, "_show", !0), [l]);
+  ), v = useMemo(() => !CORE_BLOCKS.includes(l._type), [l._type]), T = useMemo(() => get(l, "_show", !0), [l]);
   if (isNull(m) || !T) return null;
   let N = /* @__PURE__ */ jsx(Suspense, { children: createElement(m, {
     ...w,
@@ -11349,7 +11338,7 @@ const RichTextEditor = memo(
     })
   }) });
   const j = a === l._id && (i === g || g < 0) ? /* @__PURE__ */ jsx(WithBlockTextEditor, { block: l, children: N }) : N;
-  return C ? /* @__PURE__ */ jsx(ErrorBoundary, { fallbackRender: ErrorFallback, children: j }) : j;
+  return v ? /* @__PURE__ */ jsx(ErrorBoundary, { fallbackRender: ErrorFallback, children: j }) : j;
 }, PartialWrapper$1 = ({ children: r, partialBlockId: n }) => {
   const o = useBuilderProp("gotoPage", noop), { saveState: a } = useSavePage(), { selectedLang: i, fallbackLang: l } = useLanguages(), c = useCallback(
     (d) => {
@@ -11453,14 +11442,14 @@ const RichTextEditor = memo(
 }, StaticCanvas = () => {
   const [r] = useCanvasDisplayWidth(), [, n] = useHighlightBlockId(), o = useRef(null), a = useRef(null), [i, l] = useState({ width: 0, height: 0 }), c = useCanvasScale(i), [, d] = useCanvasIframe(), u = useBuilderProp("loading", !1), p = useBuilderProp("htmlDir", "ltr"), { onDragOver: h, onDrop: f, onDragEnd: m } = useDragAndDrop(), g = useDropIndicator(), b = useCallback(
     (y) => {
-      l((k) => ({ ...k, width: y }));
+      l((S) => ({ ...S, width: y }));
     },
     [l]
   );
   useEffect(() => {
     if (!a.current) return;
-    const { clientWidth: y, clientHeight: k } = a.current;
-    l({ width: y, height: k });
+    const { clientWidth: y, clientHeight: S } = a.current;
+    l({ width: y, height: S });
   }, [a, r]);
   const x = useMemo(() => {
     let y = IframeInitialContent;
@@ -11519,7 +11508,7 @@ const RichTextEditor = memo(
     /* @__PURE__ */ jsx("p", { className: "font-semibold", children: r("Oops! Something went wrong.") }),
     /* @__PURE__ */ jsx("p", { children: r("Please try again.") })
   ] }) });
-}, CodeEditor$1 = React__default.lazy(() => import("./code-editor-vpbOSO05.js")), CanvasArea = () => {
+}, CodeEditor$1 = React__default.lazy(() => import("./code-editor-DPr4HDOV.js")), CanvasArea = () => {
   const [r] = useCodeEditor(), n = useBuilderProp("onError", noop);
   return /* @__PURE__ */ jsx("div", { className: "flex h-full max-h-full w-full flex-1 flex-col", children: /* @__PURE__ */ jsxs("div", { className: "relative flex h-full max-h-full flex-col overflow-hidden bg-gray-100/40", children: [
     /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(Skeleton, { className: "h-full" }), children: /* @__PURE__ */ jsx(ErrorBoundary, { fallback: /* @__PURE__ */ jsx(FallbackError, {}), onError: n, children: /* @__PURE__ */ jsx(StaticCanvas, {}) }) }),
@@ -11656,52 +11645,52 @@ const PLACEHOLDER_IMAGE = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWl
   if (!r || startsWith(r, "data")) return "";
   const n = ((i = r.split("/").pop()) == null ? void 0 : i.split("?")[0]) || "";
   return [".jpg", ".jpeg", ".png", ".gif", ".webp", ".svg", ".bmp", ".ico", ".avif"].some((l) => n.toLowerCase().endsWith(l)) ? n : "";
-}, ImagePickerField = ({ value: r, onChange: n, id: o, onBlur: a, uiSchema: i }) => {
-  const { t: l } = useTranslation(), { selectedLang: c } = useLanguages(), d = useSelectedBlock(), u = useUpdateBlocksProps(), p = usePageExternalData(), h = (i == null ? void 0 : i["ui:allowEmpty"]) === !0, f = o.split(".").pop() || "", m = c ? `_${f}Id-${c}` : `_${f}Id`, g = isEmpty(c) && (d == null ? void 0 : d._type) === "Image" && has(d, "assetId"), b = get(d, m, g ? d == null ? void 0 : d.assetId : ""), x = useMemo(() => {
-    if (!r || !d || !/\{\{.*?\}\}/.test(r)) return r;
-    const B = { ...d, [f]: r }, I = applyBindingToBlockProps(B, p, { index: -1, key: "" });
-    return get(I, f, r);
-  }, [r, d, p, f]), y = !!b || x !== PLACEHOLDER_IMAGE && x !== "", k = (E) => {
-    const B = isArray(E) ? first$1(E) : E;
-    if (B) {
-      n(B == null ? void 0 : B.url);
-      const I = B == null ? void 0 : B.width, A = B == null ? void 0 : B.height, w = m.includes("mobile");
-      if (d != null && d._id) {
-        const C = {
-          ...I && { [w ? "mobileWidth" : "width"]: I },
-          ...A && { [w ? "mobileHeight" : "height"]: A },
-          ...B.description && { alt: B.description }
+}, ImagePickerField = ({ value: r, onChange: n, id: o, onBlur: a }) => {
+  const { t: i } = useTranslation(), { selectedLang: l } = useLanguages(), c = useSelectedBlock(), d = useUpdateBlocksProps(), u = usePageExternalData(), p = o.split(".").pop() || "", h = l ? `_${p}Id-${l}` : `_${p}Id`, f = isEmpty(l) && (c == null ? void 0 : c._type) === "Image" && has(c, "assetId"), m = get(c, h, f ? c == null ? void 0 : c.assetId : ""), g = useMemo(() => {
+    if (!r || !c || !/\{\{.*?\}\}/.test(r)) return r;
+    const C = { ...c, [p]: r }, E = applyBindingToBlockProps(C, u, { index: -1, key: "" });
+    return get(E, p, r);
+  }, [r, c, u, p]), b = !!m || g !== PLACEHOLDER_IMAGE, x = (k) => {
+    const C = isArray(k) ? first$1(k) : k;
+    if (C) {
+      n(C == null ? void 0 : C.url);
+      const E = C == null ? void 0 : C.width, B = C == null ? void 0 : C.height, I = h.includes("mobile");
+      if (c != null && c._id) {
+        const A = {
+          ...E && { [I ? "mobileWidth" : "width"]: E },
+          ...B && { [I ? "mobileHeight" : "height"]: B },
+          ...C.description && { alt: C.description }
         };
-        if (set(C, m, B.id), isEmpty(C)) return;
-        u([d._id], C);
+        if (set(A, h, C.id), isEmpty(A)) return;
+        d([c._id], A);
       }
     }
-  }, S = useCallback(() => {
-    if (n(h ? "" : PLACEHOLDER_IMAGE), d != null && d._id) {
-      const B = {}, I = m.includes("mobile");
-      set(B, m, ""), set(B, I ? "mobileWidth" : "width", ""), set(B, I ? "mobileHeight" : "height", ""), u([d._id], B);
+  }, y = useCallback(() => {
+    if (n(PLACEHOLDER_IMAGE), c != null && c._id) {
+      const k = {}, C = h.includes("mobile");
+      set(k, h, ""), set(k, C ? "mobileWidth" : "width", ""), set(k, C ? "mobileHeight" : "height", ""), d([c._id], k);
     }
-  }, [n, d == null ? void 0 : d._id, u, m, h]), v = getFileName(x);
+  }, [n, c == null ? void 0 : c._id, d, h]), S = getFileName(g);
   return /* @__PURE__ */ jsxs("div", { className: "mt-1.5 flex items-start gap-x-3", children: [
-    x ? /* @__PURE__ */ jsxs("div", { className: "group relative", children: [
+    g ? /* @__PURE__ */ jsxs("div", { className: "group relative", children: [
       /* @__PURE__ */ jsx(
         "img",
         {
-          src: x,
-          className: "h-14 w-14 overflow-hidden rounded-md border border-border object-cover transition duration-200 " + (b && b !== "" ? "cursor-pointer group-hover:blur-sm" : ""),
+          src: g,
+          className: "h-14 w-14 overflow-hidden rounded-md border border-border object-cover transition duration-200 " + (m && m !== "" ? "cursor-pointer group-hover:blur-sm" : ""),
           alt: ""
         }
       ),
-      y && /* @__PURE__ */ jsx(
+      b && /* @__PURE__ */ jsx(
         "button",
         {
           type: "button",
-          onClick: S,
+          onClick: y,
           className: "absolute -right-2 -top-2 z-20 rounded-full bg-destructive p-1 text-destructive-foreground hover:bg-destructive/90",
           children: /* @__PURE__ */ jsx(Cross1Icon, { className: "h-3 w-3" })
         }
       ),
-      b && b !== "" && /* @__PURE__ */ jsx(MediaManagerModal, { onSelect: k, assetId: b, children: /* @__PURE__ */ jsx(
+      m && m !== "" && /* @__PURE__ */ jsx(MediaManagerModal, { onSelect: x, assetId: m, children: /* @__PURE__ */ jsx(
         "button",
         {
           type: "button",
@@ -11709,11 +11698,11 @@ const PLACEHOLDER_IMAGE = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWl
           children: /* @__PURE__ */ jsx(Pencil2Icon, { className: "h-4 w-4 text-white" })
         }
       ) })
-    ] }) : /* @__PURE__ */ jsx(MediaManagerModal, { onSelect: k, mode: "image", assetId: b, children: /* @__PURE__ */ jsx("div", { className: "h-14 w-14 cursor-pointer rounded-md border border-border bg-[radial-gradient(#AAA,transparent_1px)] duration-300 [background-size:10px_10px]" }) }),
+    ] }) : /* @__PURE__ */ jsx(MediaManagerModal, { onSelect: x, mode: "image", assetId: m, children: /* @__PURE__ */ jsx("div", { className: "h-14 w-14 cursor-pointer rounded-md border border-border bg-[radial-gradient(#AAA,transparent_1px)] duration-300 [background-size:10px_10px]" }) }),
     /* @__PURE__ */ jsxs("div", { className: "flex w-3/5 flex-col", children: [
       /* @__PURE__ */ jsxs(Fragment$1, { children: [
-        /* @__PURE__ */ jsx("p", { className: "max-w-[250px] truncate pr-2 text-xs text-gray-400", children: v }),
-        /* @__PURE__ */ jsx(MediaManagerModal, { onSelect: k, assetId: "", children: /* @__PURE__ */ jsx("small", { className: "h-6 mb-1 w-full cursor-pointer rounded-md bg-secondary px-1 py-1 text-center text-xs text-secondary-foreground hover:bg-secondary/80", children: !isEmpty(x) && x !== PLACEHOLDER_IMAGE ? l("Replace image") : l("Choose image") }) }),
+        /* @__PURE__ */ jsx("p", { className: "max-w-[250px] truncate pr-2 text-xs text-gray-400", children: S }),
+        /* @__PURE__ */ jsx(MediaManagerModal, { onSelect: x, assetId: "", children: /* @__PURE__ */ jsx("small", { className: "h-6 mb-1 w-full cursor-pointer rounded-md bg-secondary px-1 py-1 text-center text-xs text-secondary-foreground hover:bg-secondary/80", children: !isEmpty(g) && g !== PLACEHOLDER_IMAGE ? i("Replace image") : i("Choose image") }) }),
         /* @__PURE__ */ jsx("div", { className: "text-center text-xs text-gray-400", children: "OR" })
       ] }),
       /* @__PURE__ */ jsx(
@@ -11725,10 +11714,10 @@ const PLACEHOLDER_IMAGE = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWl
           spellCheck: "false",
           type: "url",
           className: "h-6  text-xs",
-          placeholder: l("Enter image URL"),
+          placeholder: i("Enter image URL"),
           value: r === PLACEHOLDER_IMAGE ? "" : r,
-          onBlur: ({ target: { value: E } }) => a(o, E),
-          onChange: (E) => n(E.target.value)
+          onBlur: ({ target: { value: k } }) => a(o, k),
+          onChange: (k) => n(k.target.value)
         }
       )
     ] })
@@ -11844,11 +11833,11 @@ const DataBindingSelector = ({
         n(`{{${f}}}`, {}, o);
         return;
       }
-      const g = (k) => /[.,!?;:]/.test(k), b = (k, S, v) => {
+      const g = (S) => /[.,!?;:]/.test(S), b = (S, k, C) => {
         let E = "", B = "";
-        const I = S > 0 ? k[S - 1] : "", A = S < k.length ? k[S] : "";
-        return S > 0 && (I === "." || !g(I) && I !== " ") && (E = " "), S < k.length && !g(A) && A !== " " && (B = " "), {
-          text: E + v + B,
+        const I = k > 0 ? S[k - 1] : "", A = k < S.length ? S[k] : "";
+        return k > 0 && (I === "." || !g(I) && I !== " ") && (E = " "), k < S.length && !g(A) && A !== " " && (B = " "), {
+          text: E + C + B,
           prefixLength: E.length,
           suffixLength: B.length
         };
@@ -11856,31 +11845,31 @@ const DataBindingSelector = ({
       if (!x) return;
       const y = document.getElementById(`chai-rte-${o}`) || document.getElementById(`chai-rte-modal-${o}`);
       if (y && (y.querySelector(".ProseMirror") || y.__chaiRTE)) {
-        const k = y.__chaiRTE;
-        if (k) {
-          const S = `{{${f}}}`;
-          k.commands.focus();
-          const { from: v, to: E } = k.state.selection;
-          if (v !== E)
-            k.chain().deleteSelection().insertContent(S).run();
+        const S = y.__chaiRTE;
+        if (S) {
+          const k = `{{${f}}}`;
+          S.commands.focus();
+          const { from: C, to: E } = S.state.selection;
+          if (C !== E)
+            S.chain().deleteSelection().insertContent(k).run();
           else {
-            const { state: I } = k, A = I.selection.from, w = I.doc.textBetween(Math.max(0, A - 1), A), C = I.doc.textBetween(A, Math.min(A + 1, I.doc.content.size));
+            const { state: I } = S, A = I.selection.from, w = I.doc.textBetween(Math.max(0, A - 1), A), v = I.doc.textBetween(A, Math.min(A + 1, I.doc.content.size));
             let T = "";
             A > 0 && w !== " " && !g(w) && (T = " ");
             let N = "";
-            C && C !== " " && !g(C) && (N = " "), k.chain().insertContent(T + S + N).run();
+            v && v !== " " && !g(v) && (N = " "), S.chain().insertContent(T + k + N).run();
           }
-          setTimeout(() => n(k.getHTML(), {}, o), 100);
+          setTimeout(() => n(S.getHTML(), {}, o), 100);
           return;
         }
       } else {
-        const k = x, S = k.selectionStart || 0, v = k.value || "", E = k.selectionEnd || S;
-        if (E > S) {
-          const C = `{{${f}}}`, { text: T } = b(v, S, C), N = v.slice(0, S) + T + v.slice(E);
+        const S = x, k = S.selectionStart || 0, C = S.value || "", E = S.selectionEnd || k;
+        if (E > k) {
+          const v = `{{${f}}}`, { text: T } = b(C, k, v), N = C.slice(0, k) + T + C.slice(E);
           n(N, {}, o);
           return;
         }
-        const I = `{{${f}}}`, { text: A } = b(v, S, I), w = v.slice(0, S) + A + v.slice(S);
+        const I = `{{${f}}}`, { text: A } = b(C, k, I), w = C.slice(0, k) + A + C.slice(k);
         n(w, {}, o);
       }
     },
@@ -11903,69 +11892,69 @@ const DataBindingSelector = ({
   onChange: o
 }) => {
   var w;
-  const { t: a } = useTranslation(), i = useBuilderProp("searchPageTypeItems", (C, T) => []), [l, c] = useState(!1), [d, u] = useState(!1), [p, h] = useState("page"), [f, m] = useState(""), [g, b] = useState([]), [x, y] = useState(-1), k = useRef(null), S = (w = n == null ? void 0 : n.find((C) => C.key === p)) == null ? void 0 : w.name;
+  const { t: a } = useTranslation(), i = useBuilderProp("searchPageTypeItems", (v, T) => []), [l, c] = useState(!1), [d, u] = useState(!1), [p, h] = useState("page"), [f, m] = useState(""), [g, b] = useState([]), [x, y] = useState(-1), S = useRef(null), k = (w = n == null ? void 0 : n.find((v) => v.key === p)) == null ? void 0 : w.name;
   useEffect(() => {
     if (m(""), b([]), y(-1), u(!1), !r || l || !startsWith(r, "pageType:")) return;
-    const C = split(r, ":"), T = get(C, 1, "page") || "page";
+    const v = split(r, ":"), T = get(v, 1, "page") || "page";
     h(T), (async () => {
-      const N = await i(T, [get(C, 2, "page")]);
+      const N = await i(T, [get(v, 2, "page")]);
       N && Array.isArray(N) && m(get(N, [0, "name"], ""));
     })();
   }, [r]);
-  const v = useDebouncedCallback(
-    async (C) => {
-      if (isEmpty(C))
+  const C = useDebouncedCallback(
+    async (v) => {
+      if (isEmpty(v))
         b([]);
       else {
-        const T = await i(p, C);
+        const T = await i(p, v);
         b(T);
       }
       c(!1), y(-1);
     },
     [p],
     300
-  ), E = (C) => {
-    const T = ["pageType", p, C.id];
-    T[1] && (o(T.join(":")), m(C.name), u(!1), b([]), y(-1));
-  }, B = (C) => {
-    switch (C.key) {
+  ), E = (v) => {
+    const T = ["pageType", p, v.id];
+    T[1] && (o(T.join(":")), m(v.name), u(!1), b([]), y(-1));
+  }, B = (v) => {
+    switch (v.key) {
       case "ArrowDown":
-        C.preventDefault(), y((T) => T < g.length - 1 ? T + 1 : T);
+        v.preventDefault(), y((T) => T < g.length - 1 ? T + 1 : T);
         break;
       case "ArrowUp":
-        C.preventDefault(), y((T) => T > 0 ? T - 1 : T);
+        v.preventDefault(), y((T) => T > 0 ? T - 1 : T);
         break;
       case "Enter":
-        if (C.preventDefault(), g.length === 0) return;
+        if (v.preventDefault(), g.length === 0) return;
         x >= 0 && E(g[x]);
         break;
       case "Escape":
-        C.preventDefault(), I();
+        v.preventDefault(), I();
         break;
     }
   };
   useEffect(() => {
-    if (x >= 0 && k.current) {
-      const C = k.current.children[x];
-      C == null || C.scrollIntoView({ block: "nearest" });
+    if (x >= 0 && S.current) {
+      const v = S.current.children[x];
+      v == null || v.scrollIntoView({ block: "nearest" });
     }
   }, [x]);
   const I = () => {
     m(""), b([]), y(-1), u(!1), o("");
-  }, A = (C) => {
-    m(C), u(!isEmpty(C)), c(!0), v(C);
+  }, A = (v) => {
+    m(v), u(!isEmpty(v)), c(!0), C(v);
   };
   return /* @__PURE__ */ jsxs("div", { children: [
-    /* @__PURE__ */ jsx("select", { name: "pageType", value: p, onChange: (C) => h(C.target.value), children: map(n, (C) => /* @__PURE__ */ jsx("option", { value: C.key, children: C.name }, C.key)) }),
+    /* @__PURE__ */ jsx("select", { name: "pageType", value: p, onChange: (v) => h(v.target.value), children: map(n, (v) => /* @__PURE__ */ jsx("option", { value: v.key, children: v.name }, v.key)) }),
     p && /* @__PURE__ */ jsxs("div", { className: "group relative mt-2 flex items-center", children: [
       /* @__PURE__ */ jsx(
         "input",
         {
           type: "text",
           value: f,
-          onChange: (C) => A(C.target.value),
+          onChange: (v) => A(v.target.value),
           onKeyDown: B,
-          placeholder: a(`Search ${S ?? ""}`),
+          placeholder: a(`Search ${k ?? ""}`),
           className: "w-full rounded-md border border-gray-300 p-2 pr-16"
         }
       ),
@@ -11979,22 +11968,22 @@ const DataBindingSelector = ({
       ' "',
       f,
       '"'
-    ] }) : /* @__PURE__ */ jsx("ul", { ref: k, children: map(g == null ? void 0 : g.slice(0, 20), (C, T) => /* @__PURE__ */ jsxs(
+    ] }) : /* @__PURE__ */ jsx("ul", { ref: S, children: map(g == null ? void 0 : g.slice(0, 20), (v, T) => /* @__PURE__ */ jsxs(
       "li",
       {
-        onClick: () => E(C),
-        className: `cursor-pointer p-2 text-xs ${r != null && r.includes(C.id) ? "bg-blue-200" : T === x ? "bg-gray-100" : "hover:bg-gray-100"}`,
+        onClick: () => E(v),
+        className: `cursor-pointer p-2 text-xs ${r != null && r.includes(v.id) ? "bg-blue-200" : T === x ? "bg-gray-100" : "hover:bg-gray-100"}`,
         children: [
-          C.name,
+          v.name,
           " ",
-          C.slug && /* @__PURE__ */ jsxs("small", { className: "font-light text-gray-500", children: [
+          v.slug && /* @__PURE__ */ jsxs("small", { className: "font-light text-gray-500", children: [
             "( ",
-            C.slug,
+            v.slug,
             " )"
           ] })
         ]
       },
-      C.id
+      v.id
     )) }) })
   ] });
 }, LinkField = ({ schema: r, formData: n, onChange: o, name: a }) => {
@@ -12088,7 +12077,7 @@ const DataBindingSelector = ({
       ]
     }
   ) });
-}, RTEModal = React__default.lazy(() => import("./rte-widget-modal-CXbmmhcb.js")), RichTextEditorFieldComp = ({ blockId: r, id: n, placeholder: o, value: a, onChange: i, onBlur: l }) => {
+}, RTEModal = React__default.lazy(() => import("./rte-widget-modal-CsBCpJSY.js")), RichTextEditorFieldComp = ({ blockId: r, id: n, placeholder: o, value: a, onChange: i, onBlur: l }) => {
   const c = useRef(null), [d, u] = useState(!1), p = useRTEditor({
     blockId: r,
     value: a,
@@ -12337,9 +12326,9 @@ const DataBindingSelector = ({
   const { id: n, classNames: o, label: a, children: i, errors: l, help: c, hidden: d, required: u, schema: p, formData: h, onChange: f } = r, { selectedLang: m, fallbackLang: g, languages: b } = useLanguages(), x = useMemo(
     () => isEmpty(b) ? "" : isEmpty(m) ? g : m,
     [b, m, g]
-  ), y = useMemo(() => get(LANGUAGES, x, x), [x]), k = usePageExternalData(), S = useSelectedBlock(), v = useRegisteredChaiBlocks(), E = useMemo(
-    () => get(v, [S == null ? void 0 : S._type, "i18nProps"], []),
-    [v, S == null ? void 0 : S._type]
+  ), y = useMemo(() => get(LANGUAGES, x, x), [x]), S = usePageExternalData(), k = useSelectedBlock(), C = useRegisteredChaiBlocks(), E = useMemo(
+    () => get(C, [k == null ? void 0 : k._type, "i18nProps"], []),
+    [C, k == null ? void 0 : k._type]
   ), [B, I] = useState(null);
   if (d)
     return null;
@@ -12381,7 +12370,7 @@ const DataBindingSelector = ({
       ] })
     ] });
   }
-  const C = n.replace("root.", ""), T = E.includes(C) && !isEmpty(m) && isEmpty(h);
+  const v = n.replace("root.", ""), T = E.includes(v) && !isEmpty(m) && isEmpty(h);
   return /* @__PURE__ */ jsxs("div", { className: o, children: [
     p.title && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
@@ -12399,7 +12388,7 @@ const DataBindingSelector = ({
           /* @__PURE__ */ jsx(TooltipContent, { className: "max-w-xs", children: p.description })
         ] }) })
       ] }),
-      !p.enum && !p.oneOf && k && /* @__PURE__ */ jsxs("span", { className: "flex items-center space-x-1", children: [
+      !p.enum && !p.oneOf && S && /* @__PURE__ */ jsxs("span", { className: "flex items-center space-x-1", children: [
         T ? /* @__PURE__ */ jsxs(Tooltip, { children: [
           /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxs(
             "svg",
@@ -12550,7 +12539,7 @@ function BlockSettings() {
     I && (o([n._id], { [I]: get(B, I) }), b({ formData: B }, I, { [I]: get(c, I) }));
   }, y = ({ formData: B }, I) => {
     I && (o([h._id], { [I]: get(B, I) }), b({ formData: B }, I, { [I]: get(c, I) }));
-  }, { schema: k, uiSchema: S } = useMemo(() => {
+  }, { schema: S, uiSchema: k } = useMemo(() => {
     const B = n == null ? void 0 : n._type;
     if (!B)
       return { schema: {}, uiSchema: {} };
@@ -12564,7 +12553,7 @@ function BlockSettings() {
     } catch {
       return { schema: {}, uiSchema: {} };
     }
-  }, [n]), { wrapperSchema: v, wrapperUiSchema: E } = useMemo(() => {
+  }, [n]), { wrapperSchema: C, wrapperUiSchema: E } = useMemo(() => {
     if (!h || !(h != null && h._type))
       return { wrapperSchema: {}, wrapperUiSchema: {} };
     const B = h == null ? void 0 : h._type, { schema: I = {}, uiSchema: A = {} } = getBlockFormSchemas(B);
@@ -12596,19 +12585,19 @@ function BlockSettings() {
           blockId: h == null ? void 0 : h._id,
           onChange: y,
           formData: m,
-          schema: v,
+          schema: C,
           uiSchema: E
         }
       ) })
     ] }),
-    isEmpty(k) ? null : /* @__PURE__ */ jsx(
+    isEmpty(S) ? null : /* @__PURE__ */ jsx(
       JSONForm,
       {
         blockId: n == null ? void 0 : n._id,
         onChange: x,
         formData: l,
-        schema: k,
-        uiSchema: S
+        schema: S,
+        uiSchema: k
       }
     )
   ] });
@@ -12819,17 +12808,17 @@ const BlockStylingProps = () => {
   },
   a
 )) }), THROTTLE_TIME = 50, AdvanceChoices = (r) => {
-  const [n, o] = useState(!1), [a, i] = useState(""), { currentClass: l, onChange: c, classPrefix: d, cssProperty: u, units: p, negative: h } = r, [f, m] = useState(u != null && u.toLowerCase().includes("width") ? "%" : p[0]), [g, b] = useState(!1), [x, y] = useState(""), [k, S] = useState(!1), [v, E] = useState(!1);
+  const [n, o] = useState(!1), [a, i] = useState(""), { currentClass: l, onChange: c, classPrefix: d, cssProperty: u, units: p, negative: h } = r, [f, m] = useState(u != null && u.toLowerCase().includes("width") ? "%" : p[0]), [g, b] = useState(!1), [x, y] = useState(""), [S, k] = useState(!1), [C, E] = useState(!1);
   useEffect(() => {
-    const { value: C, unit: T } = getClassValueAndUnit(l);
+    const { value: v, unit: T } = getClassValueAndUnit(l);
     if (T === "") {
-      i(C), m(u != null && u.toLowerCase().includes("width") ? "%" : first$1(p));
+      i(v), m(u != null && u.toLowerCase().includes("width") ? "%" : first$1(p));
       return;
     }
-    m(T), i(T === "class" || isEmpty(C) ? "" : C);
+    m(T), i(T === "class" || isEmpty(v) ? "" : v);
   }, [l, u, p]);
-  const B = useThrottledCallback((C) => c(C), [c], THROTTLE_TIME), I = useThrottledCallback((C) => c(C, !1), [c], THROTTLE_TIME), A = useCallback(
-    (C = !1) => {
+  const B = useThrottledCallback((v) => c(v), [c], THROTTLE_TIME), I = useThrottledCallback((v) => c(v, !1), [c], THROTTLE_TIME), A = useCallback(
+    (v = !1) => {
       const T = getUserInputValues(`${a}`, p);
       if (get(T, "error", !1)) {
         b(!0);
@@ -12843,23 +12832,23 @@ const BlockStylingProps = () => {
       if (get(T, "value") === "")
         return;
       const P = `${get(T, "value", "").startsWith("-") ? "-" : ""}${d}[${get(T, "value", "").replace("-", "")}${N === "-" ? "" : N}]`;
-      C ? I(P) : B(P);
+      v ? I(P) : B(P);
     },
     [B, I, a, f, d, p]
   ), w = useCallback(
-    (C) => {
+    (v) => {
       const T = getUserInputValues(`${a}`, p);
       if (get(T, "error", !1)) {
         b(!0);
         return;
       }
-      if (C === "auto" || C === "none") {
-        B(`${d}${C}`);
+      if (v === "auto" || v === "none") {
+        B(`${d}${v}`);
         return;
       }
       if (get(T, "value") === "")
         return;
-      const N = get(T, "unit") !== "" ? get(T, "unit") : C, P = `${get(T, "value", "").startsWith("-") ? "-" : ""}${d}[${get(T, "value", "").replace("-", "")}${N === "-" ? "" : N}]`;
+      const N = get(T, "unit") !== "" ? get(T, "unit") : v, P = `${get(T, "value", "").startsWith("-") ? "-" : ""}${d}[${get(T, "value", "").replace("-", "")}${N === "-" ? "" : N}]`;
       B(P);
     },
     [B, a, d, p]
@@ -12877,37 +12866,37 @@ const BlockStylingProps = () => {
       /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsx("button", { type: "button", className: "invisible ml-3 mt-1 text-blue-600 group-hover:visible", children: /* @__PURE__ */ jsx(InfoCircledIcon, {}) }) }),
       /* @__PURE__ */ jsx(TooltipContent, { children: "Current value is using a Tailwind preset class." })
     ] })
-  ] }) : /* @__PURE__ */ jsxs("div", { className: `group relative flex items-center ${k ? "z-auto" : ""}`, children: [
+  ] }) : /* @__PURE__ */ jsxs("div", { className: `group relative flex items-center ${S ? "z-auto" : ""}`, children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center rounded-md border border-border", children: [
       ["none", "auto"].indexOf(f) !== -1 ? null : /* @__PURE__ */ jsx(
         "input",
         {
           readOnly: f === "class",
-          onKeyPress: (C) => {
-            C.key === "Enter" && A();
+          onKeyPress: (v) => {
+            v.key === "Enter" && A();
           },
-          onKeyDown: (C) => {
-            if (C.keyCode !== 38 && C.keyCode !== 40)
+          onKeyDown: (v) => {
+            if (v.keyCode !== 38 && v.keyCode !== 40)
               return;
-            C.preventDefault(), E(!0);
-            const T = parseInt$1(C.target.value);
+            v.preventDefault(), E(!0);
+            const T = parseInt$1(v.target.value);
             let N = isNaN$1(T) ? 0 : T;
-            C.keyCode === 38 && (N += 1), C.keyCode === 40 && (N -= 1);
+            v.keyCode === 38 && (N += 1), v.keyCode === 40 && (N -= 1);
             const j = `${N}`, L = `${j.startsWith("-") ? "-" : ""}${d}[${j.replace("-", "")}${f === "-" ? "" : f}]`;
             I(L);
           },
-          onKeyUp: (C) => {
-            v && (C.preventDefault(), E(!1));
+          onKeyUp: (v) => {
+            C && (v.preventDefault(), E(!1));
           },
           onBlur: () => A(),
-          onChange: (C) => {
-            b(!1), i(C.target.value);
+          onChange: (v) => {
+            b(!1), i(v.target.value);
           },
-          onClick: (C) => {
+          onClick: (v) => {
             var T;
-            (T = C == null ? void 0 : C.target) == null || T.select(), o(!1);
+            (T = v == null ? void 0 : v.target) == null || T.select(), o(!1);
           },
-          value: k ? x : a,
+          value: S ? x : a,
           className: "h-6 w-14 rounded rounded-r-none border border-transparent bg-background pl-2 text-sm focus-visible:outline-0".concat(
             " ",
             g ? "border-red-500 text-red-500" : "border-foreground/20"
@@ -12932,28 +12921,28 @@ const BlockStylingProps = () => {
           {
             units: p,
             current: f,
-            onSelect: (C) => {
-              o(!1), m(C), w(C);
+            onSelect: (v) => {
+              o(!1), m(v), w(v);
             }
           }
         ) })
       ] })
     ] }),
-    ["none", "auto"].indexOf(f) !== -1 || k ? null : /* @__PURE__ */ jsx(
+    ["none", "auto"].indexOf(f) !== -1 || S ? null : /* @__PURE__ */ jsx(
       DragStyleButton,
       {
-        onDragStart: () => S(!0),
-        onDragEnd: (C) => {
-          if (y(() => ""), S(!1), isEmpty(C))
+        onDragStart: () => k(!0),
+        onDragEnd: (v) => {
+          if (y(() => ""), k(!1), isEmpty(v))
             return;
-          const T = `${C}`, j = `${T.startsWith("-") ? "-" : ""}${d}[${T.replace("-", "")}${f === "-" ? "" : f}]`;
+          const T = `${v}`, j = `${T.startsWith("-") ? "-" : ""}${d}[${T.replace("-", "")}${f === "-" ? "" : f}]`;
           B(j);
         },
-        onDrag: (C) => {
-          if (isEmpty(C))
+        onDrag: (v) => {
+          if (isEmpty(v))
             return;
-          y(C);
-          const T = `${C}`, j = `${T.startsWith("-") ? "-" : ""}${d}[${T.replace("-", "")}${f === "-" ? "" : f}]`;
+          y(v);
+          const T = `${v}`, j = `${T.startsWith("-") ? "-" : ""}${d}[${T.replace("-", "")}${f === "-" ? "" : f}]`;
           I(j);
         },
         currentValue: a,
@@ -13421,19 +13410,19 @@ const COLOR_PROP = {
     (I, A = !0) => {
       const w = { dark: u, mq: h, mod: p, cls: I, property: i, fullCls: "" };
       (u || p !== "") && (w.mq = "xs");
-      const C = generateFullClsName(w);
-      m(b, [C], A);
+      const v = generateFullClsName(w);
+      m(b, [v], A);
     },
     [b, u, h, p, i, m]
-  ), k = useCallback(() => {
+  ), S = useCallback(() => {
     g(b, [x], !0);
-  }, [b, x, g]), S = useMemo(() => canChangeClass(f, h), [f, h]);
+  }, [b, x, g]), k = useMemo(() => canChangeClass(f, h), [f, h]);
   useEffect(() => {
-    l(S, f);
-  }, [S, l, f]);
-  const [, , v] = useScreenSizeWidth(), E = useCallback(
+    l(k, f);
+  }, [k, l, f]);
+  const [, , C] = useScreenSizeWidth(), E = useCallback(
     (I) => {
-      v({
+      C({
         xs: 400,
         sm: 640,
         md: 800,
@@ -13442,9 +13431,9 @@ const COLOR_PROP = {
         "2xl": 1920
       }[I]);
     },
-    [v]
+    [C]
   ), B = get(f, "dark", null) === u && get(f, "mod", null) === p && get(f, "mq", null) === h;
-  return /* @__PURE__ */ jsx(BlockStyleProvider, { canChange: S, canReset: f && B, children: /* @__PURE__ */ jsxs("div", { className: "group flex flex-row items-center py-2 first:pt-0 last:pb-0", children: [
+  return /* @__PURE__ */ jsx(BlockStyleProvider, { canChange: k, canReset: f && B, children: /* @__PURE__ */ jsxs("div", { className: "group flex flex-row items-center py-2 first:pt-0 last:pb-0", children: [
     /* @__PURE__ */ jsx("div", { className: "relative w-[70px] truncate text-xs text-foreground", children: /* @__PURE__ */ jsx("span", { className: `text-[11px] ${f && !B ? "text-foreground" : ""}`, children: n(a) }) }),
     /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center", children: [
       /* @__PURE__ */ jsxs("div", { className: "w-[150px]", children: [
@@ -13464,7 +13453,7 @@ const COLOR_PROP = {
         o === "color" && /* @__PURE__ */ jsx(ColorChoice, { property: i, onChange: y }),
         o === "dropdown" && /* @__PURE__ */ jsx(DropDownChoices, { label: a, property: i, onChange: y })
       ] }),
-      /* @__PURE__ */ jsx("div", { className: `w-[30px] cursor-pointer ${x ? "visible" : "invisible"}`, children: B ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => k(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ jsx(CrossCircledIcon, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : S && f ? /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 100, children: [
+      /* @__PURE__ */ jsx("div", { className: `w-[30px] cursor-pointer ${x ? "visible" : "invisible"}`, children: B ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => S(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ jsx(CrossCircledIcon, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : k && f ? /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 100, children: [
         /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsx(
           "button",
           {
@@ -13686,33 +13675,33 @@ const COLOR_PROP = {
   buttonClass: a = "",
   activeButtonClass: i = ""
 }) => {
-  const [l, , c] = useScreenSizeWidth(), [d, u] = useCanvasDisplayWidth(), [p, h] = useSelectedBreakpoints(), f = p, m = h, { t: g } = useTranslation(), b = useBuilderProp("breakpoints", WEB_BREAKPOINTS), x = (S) => {
-    f.includes(S) ? f.length > 2 && m(f.filter((v) => v !== S)) : m((v) => [...v, S]);
-  }, y = (S) => {
-    n || c(S), u(S);
-  }, k = getBreakpointValue(n ? d : l).toLowerCase();
-  return b.length < 4 ? /* @__PURE__ */ jsx("div", { className: "flex items-center rounded-md", children: map(b, (S) => /* @__PURE__ */ createElement(
+  const [l, , c] = useScreenSizeWidth(), [d, u] = useCanvasDisplayWidth(), [p, h] = useSelectedBreakpoints(), f = p, m = h, { t: g } = useTranslation(), b = useBuilderProp("breakpoints", WEB_BREAKPOINTS), x = (k) => {
+    f.includes(k) ? f.length > 2 && m(f.filter((C) => C !== k)) : m((C) => [...C, k]);
+  }, y = (k) => {
+    n || c(k), u(k);
+  }, S = getBreakpointValue(n ? d : l).toLowerCase();
+  return b.length < 4 ? /* @__PURE__ */ jsx("div", { className: "flex items-center rounded-md", children: map(b, (k) => /* @__PURE__ */ createElement(
     BreakpointCard,
     {
       canvas: n,
-      ...S,
+      ...k,
       onClick: y,
-      key: S.breakpoint,
-      currentBreakpoint: k
+      key: k.breakpoint,
+      currentBreakpoint: S
     }
   )) }) : /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between rounded-md", children: [
     /* @__PURE__ */ jsx("div", { className: "flex items-center", children: map(
-      b.filter((S) => includes(f, toUpper(S.breakpoint))),
-      (S) => /* @__PURE__ */ createElement(
+      b.filter((k) => includes(f, toUpper(k.breakpoint))),
+      (k) => /* @__PURE__ */ createElement(
         BreakpointCard,
         {
           canvas: n,
           openDelay: r,
           tooltip: o,
-          ...S,
+          ...k,
           onClick: y,
-          key: S.breakpoint,
-          currentBreakpoint: k,
+          key: k.breakpoint,
+          currentBreakpoint: S,
           buttonClass: a,
           activeButtonClass: i
         }
@@ -13723,16 +13712,16 @@ const COLOR_PROP = {
       /* @__PURE__ */ jsxs(DropdownMenuContent, { className: "w-56 border-border text-xs", children: [
         /* @__PURE__ */ jsx(DropdownMenuLabel, { children: g("Screen sizes") }),
         /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
-        map(b, (S) => /* @__PURE__ */ jsx(
+        map(b, (k) => /* @__PURE__ */ jsx(
           DropdownMenuCheckboxItem,
           {
-            disabled: S.breakpoint === "xs",
-            onCheckedChange: () => x(toUpper(S.breakpoint)),
-            checked: includes(f, toUpper(S.breakpoint)),
-            onSelect: (v) => v.preventDefault(),
-            children: g(S.title)
+            disabled: k.breakpoint === "xs",
+            onCheckedChange: () => x(toUpper(k.breakpoint)),
+            checked: includes(f, toUpper(k.breakpoint)),
+            onSelect: (C) => C.preventDefault(),
+            children: g(k.title)
           },
-          S.breakpoint
+          k.breakpoint
         ))
       ] })
     ] })
@@ -13766,10 +13755,10 @@ function ManualClasses({
   onRemove: a
 }) {
   var G;
-  const i = useRef(null), [l, c] = useState(""), [d, u] = useState(!1), [p, h] = useState(-1), [, f] = useRightPanel(), m = useFuseSearch(), { t: g } = useTranslation(), [b] = useSelectedStylingBlocks(), x = useSelectedBlock(), y = useAddClassesToBlocks(), k = useRemoveClassesFromBlocks(), [S] = useSelectedBlockIds(), [v, E] = useState(""), B = useAtomValue$1(chaiDesignTokensAtom), I = (G = first$1(b)) == null ? void 0 : G.prop, { classes: A } = getSplitChaiClasses(get(x, I, "")), C = (r === "default" ? A : n ?? "").split(" ").filter((_) => !isEmpty(_)), T = useMemo(() => [...C].sort((_, F) => {
+  const i = useRef(null), [l, c] = useState(""), [d, u] = useState(!1), [p, h] = useState(-1), [, f] = useRightPanel(), m = useFuseSearch(), { t: g } = useTranslation(), [b] = useSelectedStylingBlocks(), x = useSelectedBlock(), y = useAddClassesToBlocks(), S = useRemoveClassesFromBlocks(), [k] = useSelectedBlockIds(), [C, E] = useState(""), B = useAtomValue$1(chaiDesignTokensAtom), I = (G = first$1(b)) == null ? void 0 : G.prop, { classes: A } = getSplitChaiClasses(get(x, I, "")), v = (r === "default" ? A : n ?? "").split(" ").filter((_) => !isEmpty(_)), T = useMemo(() => [...v].sort((_, F) => {
     const z = _.startsWith(DESIGN_TOKEN_PREFIX), U = F.startsWith(DESIGN_TOKEN_PREFIX);
     return z && !U ? -1 : !z && U ? 1 : 0;
-  }), [C]), N = useBuilderProp("flags.copyPaste", !0), j = (_) => {
+  }), [v]), N = useBuilderProp("flags.copyPaste", !0), j = (_) => {
     if (_.startsWith(DESIGN_TOKEN_PREFIX)) {
       const F = B[_];
       return F ? F.name : _;
@@ -13779,8 +13768,8 @@ function ManualClasses({
     const F = Object.entries(B).find(([z, U]) => U.name === _);
     return F ? `${F[0]}` : _;
   }, L = () => {
-    const _ = v.trim().replace(/ +(?= )/g, "").split(" ").map(P);
-    r === "designToken" ? isFunction$1(o) && o(_) : y(S, _, !0), E("");
+    const _ = C.trim().replace(/ +(?= )/g, "").split(" ").map(P);
+    r === "designToken" ? isFunction$1(o) && o(_) : y(k, _, !0), E("");
   }, [D, $] = useState([]), M = useBuilderProp("flags.designTokens", !1), O = ({ value: _ }) => {
     const F = _.trim().toLowerCase(), z = F.match(/.+:/g);
     let U = [], q = [];
@@ -13815,14 +13804,14 @@ function ManualClasses({
       autoCapitalize: "off",
       spellCheck: !1,
       placeholder: g("Enter classes separated by space"),
-      value: v,
+      value: C,
       onFocus: (_) => {
         setTimeout(() => {
           _.target && _.target.select();
         }, 0);
       },
       onKeyDown: (_) => {
-        if (_.key === "Enter" && v.trim() !== "" && (_.preventDefault(), L()), _.key === "Tab" && D.length > 0) {
+        if (_.key === "Enter" && C.trim() !== "" && (_.preventDefault(), L()), _.key === "Tab" && D.length > 0) {
           _.preventDefault();
           const F = new KeyboardEvent("keydown", {
             key: "ArrowDown",
@@ -13836,16 +13825,16 @@ function ManualClasses({
       onChange: (_, { newValue: F }) => E(F),
       className: `w-full rounded-md text-xs px-2 hover:outline-0 bg-background border-border ${r === "default" ? "py-1" : "py-1.5"}`
     }),
-    [v, g, i, D.length]
+    [C, g, i, D.length]
   ), K = (_) => {
     const F = l.trim().replace(/ +(?= )/g, "").split(" ").map(P);
-    k(S, [_]), y(S, F, !0), c(""), h(-1);
+    S(k, [_]), y(k, F, !0), c(""), h(-1);
   }, Z = () => {
     if (navigator.clipboard === void 0) {
       toast.error(g("Clipboard not supported"));
       return;
     }
-    navigator.clipboard.writeText(C.join(" ")), toast.success(g("Classes copied to clipboard")), u(!0), setTimeout(() => u(!1), 2e3);
+    navigator.clipboard.writeText(v.join(" ")), toast.success(g("Classes copied to clipboard")), u(!0), setTimeout(() => u(!1), 2e3);
   };
   return /* @__PURE__ */ jsxs(
     "div",
@@ -13874,7 +13863,7 @@ function ManualClasses({
               inputProps: W,
               onSuggestionSelected: (_, { suggestionValue: F }) => {
                 const U = [P(F)];
-                r === "designToken" ? isFunction$1(o) && o(U) : y(S, U, !0), E("");
+                r === "designToken" ? isFunction$1(o) && o(U) : y(k, U, !0), E("");
               },
               containerProps: {
                 className: "relative h-8 w-full gap-y-1 py-1 border-border text-xs"
@@ -13892,7 +13881,7 @@ function ManualClasses({
               variant: "outline",
               className: `border-border ${r === "default" ? "h-6" : "mt-1 h-7"}`,
               onClick: L,
-              disabled: v.trim() === "",
+              disabled: C.trim() === "",
               size: "sm",
               children: /* @__PURE__ */ jsx(PlusIcon, {})
             }
@@ -13923,7 +13912,7 @@ function ManualClasses({
             "button",
             {
               onDoubleClick: () => {
-                E(j(_)), r === "default" ? k(S, [_]) : (isFunction$1(a) && a(_), E(_)), setTimeout(() => {
+                E(j(_)), r === "default" ? S(k, [_]) : (isFunction$1(a) && a(_), E(_)), setTimeout(() => {
                   i.current && i.current.focus();
                 }, 10);
               },
@@ -13934,7 +13923,7 @@ function ManualClasses({
                     Cross2Icon,
                     {
                       onClick: () => {
-                        r === "default" ? k(S, [_]) : isFunction$1(a) && a(_);
+                        r === "default" ? S(k, [_]) : isFunction$1(a) && a(_);
                       },
                       className: "hidden h-max w-3.5 cursor-pointer rounded bg-gray-100 p-0.5 text-red-500 hover:bg-gray-50 group-hover:block"
                     }
@@ -14276,16 +14265,16 @@ const registerChaiLibrary = (r, n) => {
     "div",
     {
       draggable: b,
-      onDragStart: async (k) => {
+      onDragStart: async (S) => {
         try {
           if (i) {
-            i(k);
+            i(S);
             return;
           }
-          let S = null;
+          let k = null;
           if (u === "Image") {
             if (!(r != null && r.image)) return;
-            S = {
+            k = {
               type: "Image",
               blocks: [
                 {
@@ -14298,35 +14287,35 @@ const registerChaiLibrary = (r, n) => {
               ]
             };
           } else if (n) {
-            const v = typeof n == "function" ? await n() : n, E = getBlocksFromHTML(v);
+            const C = typeof n == "function" ? await n() : n, E = getBlocksFromHTML(C);
             if (isEmpty(E)) return;
-            S = {
+            k = {
               type: "Box",
               blocks: E,
               name: get(E, "0._type", "Block")
             };
           } else if (o) {
-            const v = typeof o == "function" ? await o() : o;
-            if (isEmpty(v)) return;
-            S = {
+            const C = typeof o == "function" ? await o() : o;
+            if (isEmpty(C)) return;
+            k = {
               type: "Box",
-              blocks: v,
-              name: get(v, "0._type", "Block")
+              blocks: C,
+              name: get(C, "0._type", "Block")
             };
           } else if (r) {
-            const v = typeof r == "function" ? await r() : r;
-            S = typeof v == "object" ? omit(v, ["component", "icon"]) : v;
+            const C = typeof r == "function" ? await r() : r;
+            k = typeof C == "object" ? omit(C, ["component", "icon"]) : C;
           }
-          if (!S) return;
-          p(k, S, !0), setTimeout(() => {
+          if (!k) return;
+          p(S, k, !0), setTimeout(() => {
             m([]), g();
           }, 200);
-        } catch (S) {
-          console.error("Error in ChaiDraggableBlock drag start:", S);
+        } catch (k) {
+          console.error("Error in ChaiDraggableBlock drag start:", k);
         }
       },
-      onDragEnd: (k) => {
-        l ? l(k) : h();
+      onDragEnd: (S) => {
+        l ? l(S) : h();
       },
       className: `${b ? "cursor-grab active:cursor-grabbing" : ""} ${d}`.trim(),
       children: a
@@ -14371,16 +14360,16 @@ const BlockCard = ({
         return;
       }
       l(!0);
-      let k = await c({ library: n, block: r });
-      typeof k == "string" && (k = getBlocksFromHTML(k)), isEmpty(k) || u(syncBlocksWithDefaults(k), o, a), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK), setTimeout(() => l(!1), 1e3);
+      let S = await c({ library: n, block: r });
+      typeof S == "string" && (S = getBlocksFromHTML(S)), isEmpty(S) || u(syncBlocksWithDefaults(S), o, a), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK), setTimeout(() => l(!1), 1e3);
     },
     [d, u, r, c, n, o, a]
   );
   return /* @__PURE__ */ jsxs(Tooltip, { children: [
     /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsx(ChaiDraggableBlock, { draggable: g, onDragStart: async (y) => {
       if (!g) return;
-      let k = await c({ library: n, block: r });
-      typeof k == "string" && (k = getBlocksFromHTML(k)), f(y, { type: "Box", blocks: k, name: p }, !0);
+      let S = await c({ library: n, block: r });
+      typeof S == "string" && (S = getBlocksFromHTML(S)), f(y, { type: "Box", blocks: S, name: p }, !0);
     }, onDragEnd: m, children: /* @__PURE__ */ jsxs(
       "div",
       {
@@ -14424,26 +14413,26 @@ const BlockCard = ({
     const N = b.current.search(h).map((j) => j.item);
     g(N);
   }, [h]);
-  const x = h.trim() && !isEmpty(m) ? m : d, y = groupBy(x, "group"), [k, S] = useState(null);
+  const x = h.trim() && !isEmpty(m) ? m : d, y = groupBy(x, "group"), [S, k] = useState(null);
   useEffect(() => {
     if (isEmpty(keys$1(y))) {
-      S(null);
+      k(null);
       return;
     }
-    if (!k || !y[k]) {
-      S(first$1(keys$1(y)));
+    if (!S || !y[S]) {
+      k(first$1(keys$1(y)));
       return;
     }
-  }, [y, k]);
-  const v = get(y, k, []), E = useRef(null), { t: B } = useTranslation(), I = useRef(null);
+  }, [y, S]);
+  const C = get(y, S, []), E = useRef(null), { t: B } = useTranslation(), I = useRef(null);
   useEffect(() => {
     var j;
     const N = (j = I.current) == null ? void 0 : j.querySelector("[data-radix-scroll-area-viewport]");
     N && N.scrollTo({ top: 0, behavior: "smooth" });
-  }, [c, k]);
+  }, [c, S]);
   const A = (N) => {
     E.current && (clearTimeout(E.current), E.current = null), E.current = setTimeout(() => {
-      E.current && S(N);
+      E.current && k(N);
     }, 400);
   }, w = () => {
     c != null && c.id && p(c.id);
@@ -14453,7 +14442,7 @@ const BlockCard = ({
       /* @__PURE__ */ jsx(Skeleton, { className: "col-span-3 h-full" }),
       /* @__PURE__ */ jsx(Skeleton, { className: "col-span-9 h-full" })
     ] });
-  const C = filter(v, (N, j) => j % 2 === 0), T = filter(v, (N, j) => j % 2 === 1);
+  const v = filter(C, (N, j) => j % 2 === 0), T = filter(C, (N, j) => j % 2 === 1);
   return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsxs("div", { className: "flex h-full max-h-full flex-col", children: [
     /* @__PURE__ */ jsx(SearchInput, { value: h, setValue: f }),
     /* @__PURE__ */ jsx("div", { className: "relative flex h-full max-h-full flex-1 overflow-hidden bg-background", children: /* @__PURE__ */ jsxs("div", { className: `flex h-full flex-1 pt-2 ${o ? "flex-col" : ""}`, children: [
@@ -14476,7 +14465,7 @@ const BlockCard = ({
                       /* @__PURE__ */ jsx(ReloadIcon, { className: "h-4 w-4" }),
                       B("Retry")
                     ] })
-                  ] }) }) : o ? /* @__PURE__ */ jsxs(Select$1, { value: k, onValueChange: S, children: [
+                  ] }) }) : o ? /* @__PURE__ */ jsxs(Select$1, { value: S, onValueChange: k, children: [
                     /* @__PURE__ */ jsx(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: B("Select a group") }) }),
                     /* @__PURE__ */ jsx(SelectContent, { children: map(y, (N, j) => /* @__PURE__ */ jsx(SelectItem, { value: j, children: capitalize(B(j.toLowerCase())) }, j)) })
                   ] }) : map(y, (N, j) => /* @__PURE__ */ jsxs(
@@ -14485,10 +14474,10 @@ const BlockCard = ({
                       onMouseEnter: () => A(j),
                       onMouseLeave: () => clearTimeout(E.current),
                       role: "button",
-                      onClick: () => S(j),
+                      onClick: () => k(j),
                       className: cn$2(
                         "flex w-full cursor-pointer items-center justify-between rounded-md p-2 text-sm text-foreground transition-all ease-in-out hover:bg-gray-200 dark:hover:bg-gray-800",
-                        j === k ? "bg-primary text-primary-foreground hover:bg-primary/80" : ""
+                        j === S ? "bg-primary text-primary-foreground hover:bg-primary/80" : ""
                       ),
                       children: [
                         /* @__PURE__ */ jsx("span", { children: capitalize(B(j.toLowerCase())) }),
@@ -14510,8 +14499,8 @@ const BlockCard = ({
           onMouseEnter: () => E.current ? clearTimeout(E.current) : null,
           className: "z-10 flex h-full max-h-full w-full flex-col gap-2 transition-all ease-linear",
           children: [
-            isEmpty(v) && !isEmpty(y) ? /* @__PURE__ */ jsx("div", { className: "flex h-full flex-col items-center justify-center p-6 text-center", children: /* @__PURE__ */ jsx("p", { className: "text-sm", children: B("No blocks found in this group") }) }) : /* @__PURE__ */ jsxs("div", { className: `grid w-full gap-2 ${o ? "grid-cols-1 pb-20" : "grid-cols-2 px-2"}`, children: [
-              /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1", children: C.map((N, j) => /* @__PURE__ */ jsx(
+            isEmpty(C) && !isEmpty(y) ? /* @__PURE__ */ jsx("div", { className: "flex h-full flex-col items-center justify-center p-6 text-center", children: /* @__PURE__ */ jsx("p", { className: "text-sm", children: B("No blocks found in this group") }) }) : /* @__PURE__ */ jsxs("div", { className: `grid w-full gap-2 ${o ? "grid-cols-1 pb-20" : "grid-cols-2 px-2"}`, children: [
+              /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1", children: v.map((N, j) => /* @__PURE__ */ jsx(
                 BlockCard,
                 {
                   parentId: r,
@@ -14571,19 +14560,19 @@ const BlockCard = ({
         }), f(!0);
       else if (!l && Object.keys(i || {}).length > 0) {
         const g = Object.entries(i).map(([x, y]) => {
-          const k = y, S = k.type || "partial", v = formatReadableName(S);
+          const S = y, k = S.type || "partial", C = formatReadableName(k);
           return {
             type: "PartialBlock",
             // Set the type to PartialBlock
-            label: formatReadableName(k.name || x),
-            description: k.description || "",
+            label: formatReadableName(S.name || x),
+            description: S.description || "",
             icon: FrameIcon,
-            group: v,
+            group: C,
             // Use formatted type as group
             category: "partial",
             partialBlockId: x,
             // Store the original ID as partialBlockId
-            _name: k.name
+            _name: S.name
           };
         }), b = uniq(map(g, "group"));
         p({
@@ -14642,7 +14631,7 @@ const BlockCard = ({
   disableBlockGroupsSidebar: l
 }) => {
   var N;
-  const { t: c } = useTranslation(), [d] = useBlocksStore(), [u, p] = useState(""), h = useRef(null), [f] = useAtom$1(addBlockTabAtom), m = (N = find(d, (j) => j._id === o)) == null ? void 0 : N._type, [g, b] = useState("all"), [x, y] = useState(null), k = useRef(null), S = useBuilderProp("flags.dragAndDrop", !1);
+  const { t: c } = useTranslation(), [d] = useBlocksStore(), [u, p] = useState(""), h = useRef(null), [f] = useAtom$1(addBlockTabAtom), m = (N = find(d, (j) => j._id === o)) == null ? void 0 : N._type, [g, b] = useState("all"), [x, y] = useState(null), S = useRef(null), k = useBuilderProp("flags.dragAndDrop", !1);
   useEffect(() => {
     const j = setTimeout(() => {
       var P;
@@ -14651,17 +14640,17 @@ const BlockCard = ({
     return () => clearTimeout(j);
   }, [f]), useEffect(() => {
     u && (b("all"), y(null));
-  }, [u]), useEffect(() => (k.current = debounce((j) => {
+  }, [u]), useEffect(() => (S.current = debounce((j) => {
     b(j);
   }, 500), () => {
-    k.current && k.current.cancel();
+    S.current && S.current.cancel();
   }), []);
-  const v = useCallback((j) => {
-    y(j), k.current && k.current(j);
+  const C = useCallback((j) => {
+    y(j), S.current && S.current(j);
   }, []), E = useCallback(() => {
-    y(null), k.current && k.current.cancel();
+    y(null), S.current && S.current.cancel();
   }, []), B = useCallback((j) => {
-    k.current && k.current.cancel(), b(j), y(null);
+    S.current && S.current.cancel(), b(j), y(null);
   }, []), I = useMemo(
     () => u ? values(n).filter(
       (j) => {
@@ -14678,7 +14667,7 @@ const BlockCard = ({
   ), w = useMemo(
     () => sortBy(A, (j) => CORE_GROUPS.indexOf(j) === -1 ? 99 : CORE_GROUPS.indexOf(j)),
     [A]
-  ), C = useMemo(() => g === "all" ? I : filter(values(I), { group: g }), [I, g]), T = useMemo(() => g === "all" ? w : [g], [w, g]);
+  ), v = useMemo(() => g === "all" ? I : filter(values(I), { group: g }), [I, g]), T = useMemo(() => g === "all" ? w : [g], [w, g]);
   return /* @__PURE__ */ jsxs("div", { className: "mx-auto flex h-full w-full flex-col", children: [
     /* @__PURE__ */ jsx(SearchInput, { value: u, setValue: p }),
     /* @__PURE__ */ jsxs("div", { className: "sticky top-10 flex h-[calc(100%-48px)] overflow-hidden pt-2", children: [
@@ -14687,7 +14676,7 @@ const BlockCard = ({
           "button",
           {
             onClick: () => B("all"),
-            onMouseEnter: () => v("all"),
+            onMouseEnter: () => C("all"),
             onMouseLeave: E,
             className: `w-full rounded-md px-2 py-1.5 text-left text-sm font-medium ${g === "all" || x === "all" ? "bg-primary text-primary-foreground" : "hover:bg-primary/50 hover:text-primary-foreground"}`,
             children: c("All")
@@ -14698,7 +14687,7 @@ const BlockCard = ({
           "button",
           {
             onClick: () => B(j),
-            onMouseEnter: () => v(j),
+            onMouseEnter: () => C(j),
             onMouseLeave: E,
             className: `w-full rounded-md px-2 py-1.5 text-left text-sm ${g === j || x === j ? "bg-primary text-primary-foreground" : "hover:bg-primary/50 hover:text-primary-foreground"}`,
             children: capitalize(c(j.toLowerCase()))
@@ -14718,7 +14707,7 @@ const BlockCard = ({
           ] }) }) : /* @__PURE__ */ jsx("div", { className: `${l ? "p-0" : "p-4"} space-y-6`, children: T.map((j, P) => /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
             /* @__PURE__ */ jsx("h3", { className: "px-1 text-sm font-medium", children: capitalize(c(j.toLowerCase())) }),
             /* @__PURE__ */ jsx("div", { className: "grid gap-2 " + i, children: reject(
-              g === "all" ? filter(values(C), { group: j }) : values(C),
+              g === "all" ? filter(values(v), { group: j }) : values(v),
               { hidden: !0 }
             ).map((L, D) => /* @__PURE__ */ jsx(
               CoreBlock,
@@ -14726,7 +14715,7 @@ const BlockCard = ({
                 parentId: o,
                 position: a,
                 block: L,
-                disabled: !S && (!canAcceptChildBlock(m, L.type) || !canBeNestedInside(m, L.type))
+                disabled: !k && (!canAcceptChildBlock(m, L.type) || !canBeNestedInside(m, L.type))
               },
               L.type + "-" + P + "-" + D
             )) })
@@ -14748,10 +14737,10 @@ const BlockCard = ({
   }, [c, f, d]);
   const g = useCallback(() => {
     pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
-  }, []), b = useChaiAddBlockTabs(), x = p && m(PERMISSIONS.IMPORT_HTML), k = useChaiLibraries().length > 0;
+  }, []), b = useChaiAddBlockTabs(), x = p && m(PERMISSIONS.IMPORT_HTML), S = useChaiLibraries().length > 0;
   return useEffect(() => {
-    c === "library" && !k && d("core");
-  }, [c, k, d]), /* @__PURE__ */ jsxs("div", { className: cn$1("flex h-full w-full flex-col overflow-hidden", r), children: [
+    c === "library" && !S && d("core");
+  }, [c, S, d]), /* @__PURE__ */ jsxs("div", { className: cn$1("flex h-full w-full flex-col overflow-hidden", r), children: [
     n ? /* @__PURE__ */ jsxs("div", { className: "mb-2 flex flex-col justify-between rounded-md bg-background/30 p-1", children: [
       /* @__PURE__ */ jsx("h1", { className: "flex flex-col items-baseline px-1 text-xl font-semibold xl:flex-col", children: l("Add block") }),
       /* @__PURE__ */ jsx("span", { className: "p-0 text-xs font-light leading-3 opacity-80 xl:pl-1", children: l(c === "html" ? "Enter or paste TailwindCSS HTML snippet" : "Click to add block to page") })
@@ -14759,25 +14748,25 @@ const BlockCard = ({
     /* @__PURE__ */ jsxs(
       Tabs,
       {
-        onValueChange: (S) => {
-          u(""), d(S);
+        onValueChange: (k) => {
+          u(""), d(k);
         },
         value: c,
         className: "flex h-full max-h-full flex-col overflow-hidden",
         children: [
           /* @__PURE__ */ jsxs(TabsList, { className: `flex items-center ${i ? "h-max w-max justify-start p-1" : "w-full"}`, children: [
-            k && /* @__PURE__ */ jsx(TabsTrigger, { value: "library", className: i ? "h-5 px-2 text-xs" : "", children: l("Library") }),
+            S && /* @__PURE__ */ jsx(TabsTrigger, { value: "library", className: i ? "h-5 px-2 text-xs" : "", children: l("Library") }),
             /* @__PURE__ */ jsx(TabsTrigger, { value: "core", className: i ? "h-5 px-2 text-xs" : "", children: l("Blocks") }),
             f && /* @__PURE__ */ jsx(TabsTrigger, { value: "partials", className: i ? "h-5 px-2 text-xs" : "", children: l("Partials") }),
             x ? /* @__PURE__ */ jsx(TabsTrigger, { value: "html", className: i ? "h-5 px-2 text-xs" : "", children: l("Import") }) : null,
-            map(b, (S) => /* @__PURE__ */ jsx(
+            map(b, (k) => /* @__PURE__ */ jsx(
               TabsTrigger,
               {
-                value: S.id,
+                value: k.id,
                 className: i ? "h-5 px-2 text-xs" : "",
-                children: React__default.createElement(S.tab)
+                children: React__default.createElement(k.tab)
               },
-              `tab-add-block-${S.id}`
+              `tab-add-block-${k.id}`
             ))
           ] }),
           /* @__PURE__ */ jsx(TabsContent, { value: "core", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx("div", { className: "h-full max-h-full overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "h-full w-full", children: /* @__PURE__ */ jsx(
@@ -14789,7 +14778,7 @@ const BlockCard = ({
               disableBlockGroupsSidebar: i
             }
           ) }) }) }),
-          k && /* @__PURE__ */ jsx(TabsContent, { value: "library", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx(UILibrariesPanel, { fromSidebar: i, parentId: o, position: a }) }),
+          S && /* @__PURE__ */ jsx(TabsContent, { value: "library", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx(UILibrariesPanel, { fromSidebar: i, parentId: o, position: a }) }),
           f && /* @__PURE__ */ jsx(TabsContent, { value: "partials", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx("div", { className: "h-full max-h-full overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "h-full w-full", children: /* @__PURE__ */ jsx(
             PartialBlocks,
             {
@@ -14800,7 +14789,7 @@ const BlockCard = ({
             }
           ) }) }) }),
           x ? /* @__PURE__ */ jsx(TabsContent, { value: "html", className: "h-full max-h-full flex-1 pb-20 ", children: /* @__PURE__ */ jsx(ImportHTML, { parentId: o, position: a, fromSidebar: i }) }) : null,
-          map(b, (S) => /* @__PURE__ */ jsx(TabsContent, { value: S.id, children: React__default.createElement(S.tabContent, { close: g, parentId: o, position: a }) }, `panel-add-block-${S.id}`))
+          map(b, (k) => /* @__PURE__ */ jsx(TabsContent, { value: k.id, children: React__default.createElement(k.tabContent, { close: g, parentId: o, position: a }) }, `panel-add-block-${k.id}`))
         ]
       }
     )
@@ -15205,19 +15194,19 @@ const useStructureValidation = () => {
   var H;
   const { t: a } = useTranslation(), i = useUpdateBlocksProps(), [l] = useAtom$1(canvasIframeAtom), { hasPermission: c } = usePermissions();
   let d = null;
-  const u = r.children.length > 0, { highlightBlock: p, clearHighlight: h } = useBlockHighlight(), f = useIsDragAndDropEnabled(), { id: m, data: g, isSelected: b, willReceiveDrop: x, isDragging: y, isEditing: k, handleClick: S } = r, v = useStructureValidation(), E = useMemo(() => v.getBlockErrors(m), [v, m]), B = get(g, "_show", !0), I = (R) => {
+  const u = r.children.length > 0, { highlightBlock: p, clearHighlight: h } = useBlockHighlight(), f = useIsDragAndDropEnabled(), { id: m, data: g, isSelected: b, willReceiveDrop: x, isDragging: y, isEditing: S, handleClick: k } = r, C = useStructureValidation(), E = useMemo(() => C.getBlockErrors(m), [C, m]), B = get(g, "_show", !0), I = (R) => {
     R.stopPropagation(), B && r.toggle();
   }, A = (R) => {
     R.isInternal && (d = R.isOpen, R.isOpen && R.close());
   }, w = (R) => {
     R.isInternal && d !== null && (d ? R.open() : R.close(), d = null);
-  }, [C, T] = useAtom$1(currentAddSelection), N = () => {
+  }, [v, T] = useAtom$1(currentAddSelection), N = () => {
     var R;
     j(), r.parent.isSelected || T((R = r == null ? void 0 : r.parent) == null ? void 0 : R.id);
   }, j = () => {
     T(null);
   }, P = (R) => {
-    j(), R.stopPropagation(), !r.isOpen && B && r.toggle(), S(R);
+    j(), R.stopPropagation(), !r.isOpen && B && r.toggle(), k(R);
   };
   useEffect(() => {
     const R = setTimeout(() => {
@@ -15294,7 +15283,7 @@ const useStructureValidation = () => {
               "group flex w-full cursor-pointer items-center justify-between space-x-px !rounded p-1 py-0 outline-none",
               b ? "bg-primary/20" : "hover:bg-primary/10",
               x && canAcceptChildBlock(g._type, "Icon") ? "bg-green-200" : "",
-              (r == null ? void 0 : r.id) === C ? "bg-primary/10" : "",
+              (r == null ? void 0 : r.id) === v ? "bg-primary/10" : "",
               y && "opacity-20",
               B ? "" : "line-through opacity-50",
               M && b && "bg-primary/20 text-primary"
@@ -15320,7 +15309,7 @@ const useStructureValidation = () => {
                     ),
                     children: [
                       E.length > 0 ? /* @__PURE__ */ jsx("div", { className: "text-red-500", children: /* @__PURE__ */ jsx(ExclamationTriangleIcon, { className: "h-3 w-3" }) }) : /* @__PURE__ */ jsx(TypeIcon, { type: g == null ? void 0 : g._type }),
-                      k ? /* @__PURE__ */ jsx(Input, { node: r }) : /* @__PURE__ */ jsx(
+                      S ? /* @__PURE__ */ jsx(Input, { node: r }) : /* @__PURE__ */ jsx(
                         "div",
                         {
                           className: "ml-1.5 flex items-center gap-x-1 truncate text-[13px]",
@@ -15808,17 +15797,17 @@ const useStructureValidation = () => {
   (!d || d.length === 0) && DEFAULT_THEME_PRESET.map((w) => {
     d.push(w);
   });
-  const [g, b] = useTheme(), x = useThemeOptions(), { t: y } = useTranslation(), k = React.useCallback(
+  const [g, b] = useTheme(), x = useThemeOptions(), { t: y } = useTranslation(), S = React.useCallback(
     (w) => {
-      const C = { ...g };
-      setPreviousTheme(C), b(w), m(), toast.success("Theme updated", {
+      const v = { ...g };
+      setPreviousTheme(v), b(w), m(), toast.success("Theme updated", {
         action: {
           label: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ jsx(ResetIcon, { className: "h-4 w-4" }),
             " Undo"
           ] }),
           onClick: () => {
-            b(C), clearPreviousTheme(), toast.dismiss();
+            b(v), clearPreviousTheme(), toast.dismiss();
           }
         },
         closeButton: !0,
@@ -15826,22 +15815,22 @@ const useStructureValidation = () => {
       });
     },
     [g, b, m]
-  ), S = () => {
-    const w = d.find((C) => Object.keys(C)[0] === a);
+  ), k = () => {
+    const w = d.find((v) => Object.keys(v)[0] === a);
     if (w) {
-      const C = Object.values(w)[0];
-      C && typeof C == "object" && "fontFamily" in C && "borderRadius" in C && "colors" in C ? (k(C), i(""), m()) : console.error("Invalid preset structure:", C);
+      const v = Object.values(w)[0];
+      v && typeof v == "object" && "fontFamily" in v && "borderRadius" in v && "colors" in v ? (S(v), i(""), m()) : console.error("Invalid preset structure:", v);
     } else
       console.error("Preset not found:", a);
-  }, v = (w) => {
-    k(w), i(""), m();
+  }, C = (w) => {
+    S(w), i(""), m();
   }, E = useDebouncedCallback(
-    (w, C) => {
+    (w, v) => {
       b(() => ({
         ...g,
         fontFamily: {
           ...g.fontFamily,
-          [w.replace(/font-/g, "")]: C
+          [w.replace(/font-/g, "")]: v
         }
       })), m();
     },
@@ -15856,10 +15845,10 @@ const useStructureValidation = () => {
     },
     [g, m]
   ), I = useDebouncedCallback(
-    (w, C) => {
+    (w, v) => {
       b(() => {
         const T = get(g, `colors.${w}`);
-        return n ? set(T, 1, C) : set(T, 0, C), m(), {
+        return n ? set(T, 1, v) : set(T, 0, v), m(), {
           ...g,
           colors: {
             ...g.colors,
@@ -15870,18 +15859,18 @@ const useStructureValidation = () => {
     },
     [g, m],
     200
-  ), A = (w) => /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1", children: Object.entries(w.items).map(([C]) => {
-    const T = get(g, `colors.${C}.${n ? 1 : 0}`);
-    return T ? /* @__PURE__ */ jsxs("div", { id: `theme-${C}`, className: "mt-1 flex items-center gap-x-2", children: [
+  ), A = (w) => /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1", children: Object.entries(w.items).map(([v]) => {
+    const T = get(g, `colors.${v}.${n ? 1 : 0}`);
+    return T ? /* @__PURE__ */ jsxs("div", { id: `theme-${v}`, className: "mt-1 flex items-center gap-x-2", children: [
       /* @__PURE__ */ jsx(
         ColorPickerInput,
         {
           value: T,
-          onChange: (N) => I(C, N)
+          onChange: (N) => I(v, N)
         }
       ),
-      /* @__PURE__ */ jsx(Label, { className: "text-xs font-normal leading-tight", children: C.split(/(?=[A-Z])/).join(" ").replace(/-/g, " ").split(" ").map((N) => N.charAt(0).toUpperCase() + N.slice(1)).join(" ") + (!C.toLowerCase().includes("foreground") && !C.toLowerCase().includes("border") && !C.toLowerCase().includes("input") && !C.toLowerCase().includes("ring") && !C.toLowerCase().includes("background") ? " Background" : "") })
-    ] }, C) : null;
+      /* @__PURE__ */ jsx(Label, { className: "text-xs font-normal leading-tight", children: v.split(/(?=[A-Z])/).join(" ").replace(/-/g, " ").split(" ").map((N) => N.charAt(0).toUpperCase() + N.slice(1)).join(" ") + (!v.toLowerCase().includes("foreground") && !v.toLowerCase().includes("border") && !v.toLowerCase().includes("input") && !v.toLowerCase().includes("ring") && !v.toLowerCase().includes("background") ? " Background" : "") })
+    ] }, v) : null;
   }) });
   return p("edit_theme") ? /* @__PURE__ */ jsxs("div", { className: "relative w-full", children: [
     /* @__PURE__ */ jsxs("div", { className: cn$1("no-scrollbar h-full w-full overflow-y-auto", r), children: [
@@ -15897,11 +15886,11 @@ const useStructureValidation = () => {
           /* @__PURE__ */ jsx("div", { className: "w-[70%]", children: /* @__PURE__ */ jsxs(Select$1, { value: a, onValueChange: i, children: [
             /* @__PURE__ */ jsx(SelectTrigger, { className: "h-9 w-full text-sm", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: y("Select preset") }) }),
             /* @__PURE__ */ jsx(SelectContent, { children: Array.isArray(d) && d.map((w) => {
-              const C = Object.keys(w)[0], T = C.replaceAll("_", " ");
-              return /* @__PURE__ */ jsx(SelectItem, { value: C, children: capitalize(T) }, C);
+              const v = Object.keys(w)[0], T = v.replaceAll("_", " ");
+              return /* @__PURE__ */ jsx(SelectItem, { value: v, children: capitalize(T) }, v);
             }) })
           ] }) }),
-          /* @__PURE__ */ jsx("div", { className: "w-[25%]", children: /* @__PURE__ */ jsx(Button, { className: "w-full text-sm", disabled: !a, onClick: S, children: y("Apply") }) })
+          /* @__PURE__ */ jsx("div", { className: "w-[25%]", children: /* @__PURE__ */ jsx(Button, { className: "w-full text-sm", disabled: !a, onClick: k, children: y("Apply") }) })
         ] })
       ] }),
       /* @__PURE__ */ jsx(Separator, {}),
@@ -15910,11 +15899,11 @@ const useStructureValidation = () => {
           /* @__PURE__ */ jsx(TextIcon, { className: "h-3 w-3 text-gray-600" }),
           /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: y("Typography") })
         ] }),
-        (x == null ? void 0 : x.fontFamily) && /* @__PURE__ */ jsx("div", { className: "space-y-2", children: Object.entries(x.fontFamily).map(([w, C]) => /* @__PURE__ */ jsx(
+        (x == null ? void 0 : x.fontFamily) && /* @__PURE__ */ jsx("div", { className: "space-y-2", children: Object.entries(x.fontFamily).map(([w, v]) => /* @__PURE__ */ jsx(
           FontSelector,
           {
             label: w,
-            value: g.fontFamily[w.replace(/font-/g, "")] || C[Object.keys(C)[0]],
+            value: g.fontFamily[w.replace(/font-/g, "")] || v[Object.keys(v)[0]],
             onChange: (T) => E(w, T)
           },
           w
@@ -15958,7 +15947,7 @@ const useStructureValidation = () => {
           {
             open: l,
             onOpenChange: c,
-            onImport: v
+            onImport: C
           }
         ) })
       ] }),
@@ -16701,7 +16690,7 @@ const UndoRedo = () => {
   useEffect(() => {
     i(n);
   }, [n]);
-  const k = () => {
+  const S = () => {
     if (l.startsWith("@")) {
       m(y("Attribute keys cannot start with @"));
       return;
@@ -16710,10 +16699,10 @@ const UndoRedo = () => {
       const A = [...a, { key: l, value: d }];
       o(A), i(a), c(""), u(""), m("");
     }
-  }, S = (A) => {
-    const w = a.filter((C, T) => T !== A);
+  }, k = (A) => {
+    const w = a.filter((v, T) => T !== A);
     o(w), i(w);
-  }, v = (A) => {
+  }, C = (A) => {
     h(A), c(a[A].key), u(a[A].value);
   }, E = () => {
     if (l.startsWith("@")) {
@@ -16725,9 +16714,9 @@ const UndoRedo = () => {
       A[p] = { key: l, value: d }, o(A), i(A), h(null), c(""), u(""), m("");
     }
   }, B = (A) => {
-    A.key === "Enter" && !A.shiftKey && (A.preventDefault(), p !== null ? E() : k());
+    A.key === "Enter" && !A.shiftKey && (A.preventDefault(), p !== null ? E() : S());
   }, I = useCallback((A) => {
-    const w = (N) => /[.,!?;:]/.test(N), C = (N, j, P) => {
+    const w = (N) => /[.,!?;:]/.test(N), v = (N, j, P) => {
       let L = "", D = "";
       const $ = j > 0 ? N[j - 1] : "", M = j < N.length ? N[j] : "";
       return j > 0 && ($ === "." || !w($) && $ !== " ") && (L = " "), j < N.length && !w(M) && M !== " " && (D = " "), {
@@ -16739,11 +16728,11 @@ const UndoRedo = () => {
     if (T) {
       const N = T.selectionStart || 0, j = T.value || "", P = T.selectionEnd || N;
       if (P > N) {
-        const O = `{{${A}}}`, { text: H } = C(j, N, O), R = j.slice(0, N) + H + j.slice(P);
+        const O = `{{${A}}}`, { text: H } = v(j, N, O), R = j.slice(0, N) + H + j.slice(P);
         u(R);
         return;
       }
-      const D = `{{${A}}}`, { text: $ } = C(j, N, D), M = j.slice(0, N) + $ + j.slice(N);
+      const D = `{{${A}}}`, { text: $ } = v(j, N, D), M = j.slice(0, N) + $ + j.slice(N);
       u(M);
     }
   }, []);
@@ -16752,7 +16741,7 @@ const UndoRedo = () => {
       "form",
       {
         onSubmit: (A) => {
-          A.preventDefault(), p !== null ? E() : k();
+          A.preventDefault(), p !== null ? E() : S();
         },
         className: "space-y-3",
         children: [
@@ -16807,8 +16796,8 @@ const UndoRedo = () => {
         /* @__PURE__ */ jsx("span", { className: "max-w-[200px] text-wrap font-normal", children: A.value.toString() })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "flex-shrink-0 text-slate-400", children: [
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => v(w), children: /* @__PURE__ */ jsx(Pencil2Icon, { className: "h-3 w-3" }) }),
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => S(w), children: /* @__PURE__ */ jsx(Cross1Icon, { className: "h-3 w-3" }) })
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => C(w), children: /* @__PURE__ */ jsx(Pencil2Icon, { className: "h-3 w-3" }) }),
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => k(w), children: /* @__PURE__ */ jsx(Cross1Icon, { className: "h-3 w-3" }) })
       ] })
     ] }, w)) })
   ] });
@@ -16952,7 +16941,7 @@ const PartialWrapper = ({ partialBlockId: r }) => {
   component: DefaultTopBar
 }, registerChaiTopBar = (r) => {
   TOP_BAR.component = r;
-}, useTopBarComponent = () => useMemo(() => TOP_BAR.component, []), ManageDesignTokens = React__default.lazy(() => import("./manage-design-tokens-DUoMdCBl.js")), DEFAULT_PANEL_WIDTH = 280, OutlineButton = ({ isActive: r, show: n }) => /* @__PURE__ */ jsx(Button, { variant: r ? "default" : "ghost", size: "icon", onClick: n, children: /* @__PURE__ */ jsx(StackIcon, { className: "h-5 w-5" }) }), AddBlocksButton = ({ isActive: r, show: n }) => useIsDragAndDropEnabled() && /* @__PURE__ */ jsx(Button, { variant: r ? "default" : "ghost", size: "icon", onClick: n, children: /* @__PURE__ */ jsx(PlusCircledIcon, { className: "h-5 w-5" }) }), AskAiButton = ({ isActive: r, show: n }) => /* @__PURE__ */ jsx(Button, { variant: r ? "default" : "ghost", size: "icon", onClick: n, children: /* @__PURE__ */ jsx(AiIcon, {}) });
+}, useTopBarComponent = () => useMemo(() => TOP_BAR.component, []), ManageDesignTokens = React__default.lazy(() => import("./manage-design-tokens-BHCCrWFS.js")), DEFAULT_PANEL_WIDTH = 280, OutlineButton = ({ isActive: r, show: n }) => /* @__PURE__ */ jsx(Button, { variant: r ? "default" : "ghost", size: "icon", onClick: n, children: /* @__PURE__ */ jsx(StackIcon, { className: "h-5 w-5" }) }), AddBlocksButton = ({ isActive: r, show: n }) => useIsDragAndDropEnabled() && /* @__PURE__ */ jsx(Button, { variant: r ? "default" : "ghost", size: "icon", onClick: n, children: /* @__PURE__ */ jsx(PlusCircledIcon, { className: "h-5 w-5" }) }), AskAiButton = ({ isActive: r, show: n }) => /* @__PURE__ */ jsx(Button, { variant: r ? "default" : "ghost", size: "icon", onClick: n, children: /* @__PURE__ */ jsx(AiIcon, {}) });
 registerChaiSidebarPanel("add-block", {
   button: AddBlocksButton,
   label: "Add Blocks",
@@ -16985,7 +16974,7 @@ const RootLayout = () => {
       console.log("handleMenuItemClick", w, n), o(n === w ? null : w);
     },
     [n, o]
-  ), { t: x } = useTranslation(), y = useMemo(() => [...p, ...h], [p, h]), k = useBuilderProp("htmlDir", "ltr"), S = find(y, { id: n }) ?? first$1(y), v = get(S, "width", DEFAULT_PANEL_WIDTH);
+  ), { t: x } = useTranslation(), y = useMemo(() => [...p, ...h], [p, h]), S = useBuilderProp("htmlDir", "ltr"), k = find(y, { id: n }) ?? first$1(y), C = get(k, "width", DEFAULT_PANEL_WIDTH);
   useEffect(() => {
     if (n !== null) {
       const w = find(y, { id: n });
@@ -16995,8 +16984,8 @@ const RootLayout = () => {
   const E = useMemo(() => {
     if (n === null) return 0;
     const w = find(y, { id: n });
-    return get(w, "view", "standard") === "standard" ? v : i;
-  }, [n, v, i, y]), B = useCallback(() => {
+    return get(w, "view", "standard") === "standard" ? C : i;
+  }, [n, C, i, y]), B = useCallback(() => {
     o(a.current);
   }, [o, n]), I = useCallback(() => {
     o("outline");
@@ -17010,7 +16999,7 @@ const RootLayout = () => {
     },
     [b]
   );
-  return /* @__PURE__ */ jsx("div", { dir: k, className: "h-screen max-h-full w-screen overflow-x-hidden bg-background text-foreground", children: /* @__PURE__ */ jsxs(TooltipProvider, { children: [
+  return /* @__PURE__ */ jsx("div", { dir: S, className: "h-screen max-h-full w-screen overflow-x-hidden bg-background text-foreground", children: /* @__PURE__ */ jsxs(TooltipProvider, { children: [
     /* @__PURE__ */ jsxs(
       "div",
       {
@@ -17020,7 +17009,7 @@ const RootLayout = () => {
           /* @__PURE__ */ jsx("div", { className: "flex h-[50px] w-screen items-center border-b border-border", children: /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(r, {}) }) }),
           /* @__PURE__ */ jsxs("main", { className: "relative flex h-[calc(100vh-56px)] max-w-full flex-1 flex-row", children: [
             /* @__PURE__ */ jsxs("div", { id: "sidebar", className: "flex w-12 flex-col items-center justify-between border-r border-border py-2", children: [
-              /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1", children: g.map((w, C) => /* @__PURE__ */ jsxs(Tooltip, { children: [
+              /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1", children: g.map((w, v) => /* @__PURE__ */ jsxs(Tooltip, { children: [
                 /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: createElement(get(w, "button", NoopComponent), {
                   position: "top",
                   panelId: w.id,
@@ -17028,9 +17017,9 @@ const RootLayout = () => {
                   show: () => A(w.id)
                 }) }),
                 /* @__PURE__ */ jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsx("p", { children: x(w.label) }) })
-              ] }, "button-top-" + C)) }),
+              ] }, "button-top-" + v)) }),
               /* @__PURE__ */ jsx("div", { className: "flex flex-col space-y-1" }),
-              /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: f == null ? void 0 : f.map((w, C) => /* @__PURE__ */ jsxs(Tooltip, { children: [
+              /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: f == null ? void 0 : f.map((w, v) => /* @__PURE__ */ jsxs(Tooltip, { children: [
                 /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: createElement(get(w, "button", NoopComponent), {
                   position: "bottom",
                   panelId: w.id,
@@ -17038,7 +17027,7 @@ const RootLayout = () => {
                   show: () => A(w.id)
                 }) }),
                 /* @__PURE__ */ jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsx("p", { children: x(w.label) }) })
-              ] }, "button-bottom-" + C)) })
+              ] }, "button-bottom-" + v)) })
             ] }),
             /* @__PURE__ */ jsx(
               motion.div,
@@ -17048,15 +17037,15 @@ const RootLayout = () => {
                 initial: { width: E },
                 animate: { width: E },
                 transition: { duration: 0.3, ease: "easeInOut" },
-                children: n !== null && get(S, "view", "standard") === "standard" && /* @__PURE__ */ jsxs("div", { className: "no-scrollbar flex h-full flex-col overflow-hidden px-3 py-2", children: [
+                children: n !== null && get(k, "view", "standard") === "standard" && /* @__PURE__ */ jsxs("div", { className: "no-scrollbar flex h-full flex-col overflow-hidden px-3 py-2", children: [
                   /* @__PURE__ */ jsx(
                     "div",
                     {
-                      className: `absolute top-2 flex h-10 items-center space-x-1 py-2 text-base font-bold ${get(S, "isInternal", !1) ? "" : "w-64"}`,
-                      children: /* @__PURE__ */ jsx("span", { children: x(get(S, "label", "")) })
+                      className: `absolute top-2 flex h-10 items-center space-x-1 py-2 text-base font-bold ${get(k, "isInternal", !1) ? "" : "w-64"}`,
+                      children: /* @__PURE__ */ jsx("span", { children: x(get(k, "label", "")) })
                     }
                   ),
-                  /* @__PURE__ */ jsx("div", { className: "no-scrollbar h-full max-h-full overflow-y-auto pt-10", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: React__default.createElement(get(S, "panel", NoopComponent), {}) }) })
+                  /* @__PURE__ */ jsx("div", { className: "no-scrollbar h-full max-h-full overflow-y-auto pt-10", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: React__default.createElement(get(k, "panel", NoopComponent), {}) }) })
                 ] })
               }
             ),
@@ -17119,34 +17108,34 @@ const RootLayout = () => {
       }
     ),
     /* @__PURE__ */ jsx(AddBlocksDialog, {}),
-    n !== null && get(S, "view") === "drawer" && /* @__PURE__ */ jsx(Sheet, { open: !0, onOpenChange: () => B(), children: /* @__PURE__ */ jsxs(
+    n !== null && get(k, "view") === "drawer" && /* @__PURE__ */ jsx(Sheet, { open: !0, onOpenChange: () => B(), children: /* @__PURE__ */ jsxs(
       SheetContent,
       {
         side: "left",
         className: "flex flex-col gap-0 p-0 sm:max-w-full",
-        style: { width: `${v}px` },
+        style: { width: `${C}px` },
         children: [
           /* @__PURE__ */ jsx(SheetHeader, { className: "border-b border-border px-2 py-2.5", children: /* @__PURE__ */ jsxs(SheetTitle, { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "inline-block", children: get(S, "icon", null) }),
-            /* @__PURE__ */ jsx("span", { children: x(get(S, "label", "")) })
+            /* @__PURE__ */ jsx("span", { className: "inline-block", children: get(k, "icon", null) }),
+            /* @__PURE__ */ jsx("span", { children: x(get(k, "label", "")) })
           ] }) }),
-          /* @__PURE__ */ jsx("div", { className: "h-full max-h-full overflow-y-auto p-4", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: React__default.createElement(get(S, "panel", NoopComponent), {
+          /* @__PURE__ */ jsx("div", { className: "h-full max-h-full overflow-y-auto p-4", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: React__default.createElement(get(k, "panel", NoopComponent), {
             close: I
           }) }) })
         ]
       }
     ) }),
     " ",
-    n !== null && get(S, "view") === "modal" && /* @__PURE__ */ jsx(Dialog, { open: !0, onOpenChange: () => B(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "gap-0 p-0", style: { maxWidth: `${v}px` }, children: [
+    n !== null && get(k, "view") === "modal" && /* @__PURE__ */ jsx(Dialog, { open: !0, onOpenChange: () => B(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "gap-0 p-0", style: { maxWidth: `${C}px` }, children: [
       /* @__PURE__ */ jsx(DialogHeader, { className: "border-b border-border px-2 py-3.5", children: /* @__PURE__ */ jsxs(DialogTitle, { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx("span", { className: "inline-block", children: get(S, "icon", null) }),
-        /* @__PURE__ */ jsx("span", { children: x(get(S, "label", "")) })
+        /* @__PURE__ */ jsx("span", { className: "inline-block", children: get(k, "icon", null) }),
+        /* @__PURE__ */ jsx("span", { children: x(get(k, "label", "")) })
       ] }) }),
-      /* @__PURE__ */ jsx("div", { className: "max-h-[70vh] overflow-y-auto p-4", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: React__default.createElement(get(S, "panel", NoopComponent), {
+      /* @__PURE__ */ jsx("div", { className: "max-h-[70vh] overflow-y-auto p-4", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: React__default.createElement(get(k, "panel", NoopComponent), {
         close: I
       }) }) })
     ] }) }),
-    n !== null && get(S, "view") === "overlay" && /* @__PURE__ */ jsx(
+    n !== null && get(k, "view") === "overlay" && /* @__PURE__ */ jsx(
       motion.div,
       {
         className: "absolute bottom-0 left-12 right-0 top-0 z-50",
@@ -17165,12 +17154,12 @@ const RootLayout = () => {
             children: [
               /* @__PURE__ */ jsxs("div", { className: "flex h-[50px] items-center justify-between border-b border-border p-4", children: [
                 /* @__PURE__ */ jsxs("div", { className: "-ml-2 flex items-center gap-2 text-lg font-bold", children: [
-                  /* @__PURE__ */ jsx("span", { className: "rtl:ml-2 rtl:inline-block", children: get(S, "icon", null) }),
-                  /* @__PURE__ */ jsx("span", { children: x(get(S, "label", "")) })
+                  /* @__PURE__ */ jsx("span", { className: "rtl:ml-2 rtl:inline-block", children: get(k, "icon", null) }),
+                  /* @__PURE__ */ jsx("span", { children: x(get(k, "label", "")) })
                 ] }),
                 /* @__PURE__ */ jsx(Button, { onClick: () => B(), variant: "ghost", size: "icon", className: "", children: /* @__PURE__ */ jsx(Cross1Icon, { className: "h-5 w-5" }) })
               ] }),
-              /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto p-4", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: React__default.createElement(get(S, "panel", NoopComponent), {
+              /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto p-4", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: React__default.createElement(get(k, "panel", NoopComponent), {
                 close: I
               }) }) })
             ]
@@ -17231,8 +17220,8 @@ const RootLayout = () => {
     const b = i.toLowerCase();
     return Object.fromEntries(
       Object.entries(a).filter(([x, y]) => {
-        var k;
-        return (x == null ? void 0 : x.toLowerCase().includes(b)) || ((k = y == null ? void 0 : y.description) == null ? void 0 : k.toLowerCase().includes(b));
+        var S;
+        return (x == null ? void 0 : x.toLowerCase().includes(b)) || ((S = y == null ? void 0 : y.description) == null ? void 0 : S.toLowerCase().includes(b));
       })
     );
   }, [a, i]), f = (b) => {
@@ -17242,7 +17231,7 @@ const RootLayout = () => {
     });
   }, m = (b) => {
     if (!c) return;
-    const x = b.clientX - u.x, y = b.clientY - u.y, k = b.currentTarget, S = k.offsetWidth, v = k.offsetHeight, E = window.innerWidth - S, B = window.innerHeight - v, I = Math.max(0, Math.min(x, E)), A = Math.max(0, Math.min(y, B));
+    const x = b.clientX - u.x, y = b.clientY - u.y, S = b.currentTarget, k = S.offsetWidth, C = S.offsetHeight, E = window.innerWidth - k, B = window.innerHeight - C, I = Math.max(0, Math.min(x, E)), A = Math.max(0, Math.min(y, B));
     o(I, A);
   }, g = () => {
     d(!1);
@@ -17497,10 +17486,10 @@ const atomRead = (r, n, ...o) => n.read(...o), atomWrite = (r, n, ...o) => n.wri
     return x;
   x.d.clear();
   let y = !0;
-  function k() {
+  function S() {
     i.has(n) && (b(r, n), f(r), h(r));
   }
-  function S(A) {
+  function k(A) {
     var w;
     if (isSelfAtom(n, A)) {
       const T = p(r, A);
@@ -17511,17 +17500,17 @@ const atomRead = (r, n, ...o) => n.read(...o), atomWrite = (r, n, ...o) => n.wri
           throw new Error("no atom init");
       return returnAtomValue(T);
     }
-    const C = m(r, A);
+    const v = m(r, A);
     try {
-      return returnAtomValue(C);
+      return returnAtomValue(v);
     } finally {
-      x.d.set(A, C.n), isPendingPromise(x.v) && addPendingPromiseToDependency(n, x.v, C), (w = i.get(A)) == null || w.t.add(n), y || k();
+      x.d.set(A, v.n), isPendingPromise(x.v) && addPendingPromiseToDependency(n, x.v, v), (w = i.get(A)) == null || w.t.add(n), y || S();
     }
   }
-  let v, E;
+  let C, E;
   const B = {
     get signal() {
-      return v || (v = new AbortController()), v.signal;
+      return C || (C = new AbortController()), C.signal;
     },
     get setSelf() {
       return !E && isActuallyWritableAtom(n) && (E = (...A) => {
@@ -17535,8 +17524,8 @@ const atomRead = (r, n, ...o) => n.read(...o), atomWrite = (r, n, ...o) => n.wri
     }
   }, I = x.n;
   try {
-    const A = u(r, n, S, B);
-    return setAtomStateValueOrPromise(r, n, A), isPromiseLike$1(A) && (registerAbortHandler(A, () => v == null ? void 0 : v.abort()), A.then(k, k)), x;
+    const A = u(r, n, k, B);
+    return setAtomStateValueOrPromise(r, n, A), isPromiseLike$1(A) && (registerAbortHandler(A, () => C == null ? void 0 : C.abort()), A.then(S, S)), x;
   } catch (A) {
     return delete x.v, x.e = A, ++x.n, x;
   } finally {
@@ -17554,18 +17543,18 @@ const atomRead = (r, n, ...o) => n.read(...o), atomWrite = (r, n, ...o) => n.wri
 }, writeAtomState = (r, n, ...o) => {
   const a = getBuildingBlocks(r), i = a[3], l = a[6], c = a[8], d = a[11], u = a[12], p = a[13], h = a[14], f = a[15], m = a[17];
   let g = !0;
-  const b = (y) => returnAtomValue(h(r, y)), x = (y, ...k) => {
-    var S;
-    const v = d(r, y);
+  const b = (y) => returnAtomValue(h(r, y)), x = (y, ...S) => {
+    var k;
+    const C = d(r, y);
     try {
       if (isSelfAtom(n, y)) {
         if (!hasInitialValue(y))
           throw new Error("atom not writable");
-        const E = v.n, B = k[0];
-        setAtomStateValueOrPromise(r, y, B), m(r, y), E !== v.n && (i.add(y), (S = l.c) == null || S.call(l, y), f(r, y));
+        const E = C.n, B = S[0];
+        setAtomStateValueOrPromise(r, y, B), m(r, y), E !== C.n && (i.add(y), (k = l.c) == null || k.call(l, y), f(r, y));
         return;
       } else
-        return writeAtomState(r, y, ...k);
+        return writeAtomState(r, y, ...S);
     } finally {
       g || (p(r), u(r));
     }
@@ -17606,19 +17595,19 @@ const atomRead = (r, n, ...o) => n.read(...o), atomWrite = (r, n, ...o) => n.wri
     }, i.set(n, b), (o = c.m) == null || o.call(c, n), isActuallyWritableAtom(n)) {
       const x = () => {
         let y = !0;
-        const k = (...S) => {
+        const S = (...k) => {
           try {
-            return m(r, n, ...S);
+            return m(r, n, ...k);
           } finally {
             y || (h(r), p(r));
           }
         };
         try {
-          const S = d(r, n, k);
-          S && (b.u = () => {
+          const k = d(r, n, S);
+          k && (b.u = () => {
             y = !0;
             try {
-              S();
+              k();
             } finally {
               y = !1;
             }
@@ -17971,10 +17960,10 @@ function domToJsx(r, n = 0) {
       } else if (m.name === "style" && m.value) {
         const g = m.value.split(";").reduce(
           (b, x) => {
-            const [y, k] = x.split(":").map((S) => S.trim());
-            if (y && k) {
-              const S = y.replace(/-([a-z])/g, (v) => v[1].toUpperCase());
-              b[S] = k.replace(/['"]/g, "");
+            const [y, S] = x.split(":").map((k) => k.trim());
+            if (y && S) {
+              const k = y.replace(/-([a-z])/g, (C) => C[1].toUpperCase());
+              b[k] = S.replace(/['"]/g, "");
             }
             return b;
           },
@@ -18000,7 +17989,7 @@ function domToJsx(r, n = 0) {
         (m, g) => {
           const [b, x] = g.split(":").map((y) => y.trim());
           if (b && x) {
-            const y = b.replace(/-([a-z])/g, (k) => k[1].toUpperCase());
+            const y = b.replace(/-([a-z])/g, (S) => S[1].toUpperCase());
             m[y] = x.replace(/['"]/g, "");
           }
           return m;
@@ -18073,7 +18062,7 @@ ${i}${i}${l == null ? void 0 : l.trimEnd()}
 ${i})
 }`, { jsx: l, html: formatHtml(c), componentName: a };
 }, ExportCodeModalContent = ({ tab: r }) => {
-  var k;
+  var S;
   const { t: n } = useTranslation(), [o, a] = useState({ html: "", jsx: "" }), i = useSelectedBlock(), l = useBlocksHtmlForAi(), [c, d] = useState(""), [u, p] = useState(!1), h = () => {
     switch (r) {
       case "js":
@@ -18098,52 +18087,52 @@ ${i})
   }, m = useCallback(async () => {
     try {
       p(!1);
-      let S = l({ blockId: i == null ? void 0 : i._id, additionalCoreBlocks: ["Icon"] });
-      S = S.replace(/\s*bid=["'][^"']*["']/g, "");
-      const v = r === "ts", {
+      let k = l({ blockId: i == null ? void 0 : i._id, additionalCoreBlocks: ["Icon"] });
+      k = k.replace(/\s*bid=["'][^"']*["']/g, "");
+      const C = r === "ts", {
         jsx: E,
         html: B,
         componentName: I
       } = await getExportedCoded({
         selectedBlock: i,
-        html: S,
-        isTypeScript: v
+        html: k,
+        isTypeScript: C
       });
       a({ html: B, jsx: E }), d(I), p(!0);
     } catch {
-      const v = "<div>Export failed. Close the modal and try again.</div>";
-      a({ html: v, jsx: v }), toast.error(n("Failed to generate export HTML"));
+      const C = "<div>Export failed. Close the modal and try again.</div>";
+      a({ html: C, jsx: C }), toast.error(n("Failed to generate export HTML"));
     }
   }, [n, r, i, l]);
   useEffect(() => {
     m();
   }, [m, r]);
   const g = useCallback(
-    async (S) => {
+    async (k) => {
       try {
-        navigator.clipboard.writeText(S), toast.success(n("Export code copied!"));
+        navigator.clipboard.writeText(k), toast.success(n("Export code copied!"));
       } catch {
         toast.error(n("Failed to copy export code"));
       }
     },
     [n]
-  ), b = (S) => {
-    const v = new Blob([S], { type: "text/jsx" }), E = URL.createObjectURL(v), B = document.createElement("a");
+  ), b = (k) => {
+    const C = new Blob([k], { type: "text/jsx" }), E = URL.createObjectURL(C), B = document.createElement("a");
     B.href = E, B.download = h(), document.body.appendChild(B), B.click(), URL.revokeObjectURL(E), document.body.removeChild(B), toast.success(n("Export code downloaded successfully!"));
   }, x = /* @__PURE__ */ jsxs("span", { children: [
     "Download ",
     /* @__PURE__ */ jsx("span", { className: "font-mono text-xs font-light text-gray-300", children: h() })
   ] }), y = useMemo(() => {
-    const S = { extend: shadcnTheme() }, v = JSON.stringify(S, null, 2);
+    const k = { extend: shadcnTheme() }, C = JSON.stringify(k, null, 2);
     return `{
   // Your tailwind config ...
 
-  "theme": ${v == null ? void 0 : v.split(`
+  "theme": ${C == null ? void 0 : C.split(`
 `).join(`
   `)},
 }`;
   }, []);
-  return ((k = o == null ? void 0 : o.jsx) == null ? void 0 : k.length) > 0 && u ? /* @__PURE__ */ jsx(
+  return ((S = o == null ? void 0 : o.jsx) == null ? void 0 : S.length) > 0 && u ? /* @__PURE__ */ jsx(
     CodeDisplay,
     {
       onCopy: g,