@chaibuilder/sdk 3.1.7 → 3.1.8

package/dist/{index-Cj8rTugy.js → index-C7JEjy8N.js}

@@ -4,7 +4,7 @@ var $ = (o, n, r) => W(o, typeof n != "symbol" ? n + "" : n, r);
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useRegisteredChaiBlocks, getRegisteredChaiBlock, getDefaultBlockProps, syncBlocksWithDefaults, useRegisteredFonts, getBlockFormSchemas } from "@chaibuilder/runtime";
 import { get, find, filter, flatten, has, map, includes, without, compact, isEmpty, isString, each, omit, values, pick, startsWith, isFunction, isObject as isObject$1, memoize, noop, first, keys, range, flattenDeep, set, forEach, unset, chunk, cloneDeep, isNull, kebabCase, round, reverse, findIndex, uniq, isArray, split, reject, take, debounce, startCase, isNumber, parseInt as parseInt$1, isNaN as isNaN$1, toLower, nth, findLast, intersection, toUpper, capitalize, groupBy, sortBy } from "lodash-es";
-import { SquareIcon, ZoomInIcon, ChevronRightIcon, PinTopIcon, PinBottomIcon, PinLeftIcon, PinRightIcon, ArrowUpIcon, PlusIcon, CopyIcon, TrashIcon, CaretDownIcon, Cross1Icon, FontBoldIcon, FontItalicIcon, UnderlineIcon, StrikethroughIcon, ListBulletIcon, ValueIcon, TextAlignCenterIcon, TextAlignRightIcon, TextAlignLeftIcon, Link2Icon, LinkBreak2Icon, EnterFullScreenIcon, ExclamationTriangleIcon, Pencil2Icon, ChevronLeftIcon, LoopIcon, IdCardIcon, PlusCircledIcon, ChevronDownIcon, InfoCircledIcon, FileIcon, DotsVerticalIcon, TriangleDownIcon, RowSpacingIcon, EyeOpenIcon, EyeClosedIcon, BorderAllIcon, WidthIcon, HeightIcon, ArrowRightIcon, ArrowDownIcon, ArrowLeftIcon, ArrowTopLeftIcon, ArrowTopRightIcon, ArrowBottomRightIcon, ArrowBottomLeftIcon, AlignLeftIcon, AlignCenterHorizontallyIcon, AlignRightIcon, StretchHorizontallyIcon, OverlineIcon, LetterCaseUppercaseIcon, Cross2Icon, BoxIcon, MinusIcon, CrossCircledIcon, MobileIcon, LaptopIcon, DesktopIcon, CircleIcon, MagnifyingGlassIcon, ReloadIcon, CaretRightIcon, FrameIcon, EraserIcon, CheckIcon, DownloadIcon, CardStackPlusIcon, CardStackIcon, ScissorsIcon, DoubleArrowDownIcon, DoubleArrowUpIcon, ResetIcon, UploadIcon, TextIcon, CornerTopRightIcon, MixerHorizontalIcon, SunIcon, MoonIcon, FaceIcon, ShuffleIcon, ChatBubbleIcon, StopIcon, DotsHorizontalIcon, LightningBoltIcon, StackIcon, DragHandleDots2Icon } from "@radix-ui/react-icons";
+import { SquareIcon, ZoomInIcon, ChevronRightIcon, PinTopIcon, PinBottomIcon, PinLeftIcon, PinRightIcon, GearIcon, ArrowUpIcon, PlusIcon, CopyIcon, TrashIcon, CaretDownIcon, Cross1Icon, FontBoldIcon, FontItalicIcon, UnderlineIcon, StrikethroughIcon, ListBulletIcon, ValueIcon, TextAlignCenterIcon, TextAlignRightIcon, TextAlignLeftIcon, Link2Icon, LinkBreak2Icon, EnterFullScreenIcon, ExclamationTriangleIcon, Pencil2Icon, ChevronLeftIcon, LoopIcon, IdCardIcon, PlusCircledIcon, ChevronDownIcon, InfoCircledIcon, FileIcon, DotsVerticalIcon, TriangleDownIcon, RowSpacingIcon, EyeOpenIcon, EyeClosedIcon, BorderAllIcon, WidthIcon, HeightIcon, ArrowRightIcon, ArrowDownIcon, ArrowLeftIcon, ArrowTopLeftIcon, ArrowTopRightIcon, ArrowBottomRightIcon, ArrowBottomLeftIcon, AlignLeftIcon, AlignCenterHorizontallyIcon, AlignRightIcon, StretchHorizontallyIcon, OverlineIcon, LetterCaseUppercaseIcon, Cross2Icon, BoxIcon, MinusIcon, CrossCircledIcon, MobileIcon, LaptopIcon, DesktopIcon, CircleIcon, MagnifyingGlassIcon, ReloadIcon, CaretRightIcon, FrameIcon, EraserIcon, CheckIcon, DownloadIcon, CardStackPlusIcon, CardStackIcon, ScissorsIcon, DoubleArrowDownIcon, DoubleArrowUpIcon, ResetIcon, UploadIcon, TextIcon, CornerTopRightIcon, MixerHorizontalIcon, SunIcon, MoonIcon, FaceIcon, ShuffleIcon, ChatBubbleIcon, StopIcon, DotsHorizontalIcon, LightningBoltIcon, StackIcon, DragHandleDots2Icon } from "@radix-ui/react-icons";
 import * as React from "react";
 import React__default, { useMemo, useCallback, useEffect, useState, useRef, Component, Children, memo, createElement, createContext, useContext, Suspense, lazy, useReducer, useDebugValue } from "react";
 import { atom, useAtom as useAtom$1, useAtomValue as useAtomValue$1, getDefaultStore as getDefaultStore$1, useSetAtom as useSetAtom$1, Provider } from "jotai";
@@ -728,12 +728,12 @@ const undoRedoStateAtom = atom({
   } = useBlocksStoreManager();
   return {
     moveBlocks: (x, b, y) => {
-      const S = map(x, (w) => {
+      const C = map(x, (w) => {
         const B = n.find((A) => A._id === w)._parent || null, k = n.filter((A) => B ? A._parent === B : !A._parent).map((A) => A._id).indexOf(w);
         return { _id: w, oldParent: B, oldPosition: k };
-      }), C = S.find(({ _id: w }) => w === x[0]);
-      C && C.oldParent === b && C.oldPosition === y || (i(x, b, y), o({
-        undo: () => each(S, ({ _id: w, oldParent: _, oldPosition: B }) => {
+      }), S = C.find(({ _id: w }) => w === x[0]);
+      S && S.oldParent === b && S.oldPosition === y || (i(x, b, y), o({
+        undo: () => each(C, ({ _id: w, oldParent: _, oldPosition: B }) => {
           i([w], _, B);
         }),
         redo: () => i(x, b, y)
@@ -746,27 +746,27 @@ const undoRedoStateAtom = atom({
       });
     },
     removeBlocks: (x) => {
-      var C;
-      const b = (C = first(x)) == null ? void 0 : C._parent, S = n.filter((w) => b ? w._parent === b : !w._parent).indexOf(first(x));
+      var S;
+      const b = (S = first(x)) == null ? void 0 : S._parent, C = n.filter((w) => b ? w._parent === b : !w._parent).indexOf(first(x));
       l(map(x, "_id")), o({
-        undo: () => a(x, b, S),
+        undo: () => a(x, b, C),
         redo: () => l(map(x, "_id"))
       });
     },
     updateBlocks: (x, b, y) => {
-      let S = [];
+      let C = [];
       if (y)
-        S = map(x, (C) => ({ _id: C, ...y }));
+        C = map(x, (S) => ({ _id: S, ...y }));
       else {
-        const C = keys(b);
-        S = map(x, (w) => {
+        const S = keys(b);
+        C = map(x, (w) => {
           const _ = n.find((I) => I._id === w), B = { _id: w };
-          return each(C, (I) => B[I] = _[I]), B;
+          return each(S, (I) => B[I] = _[I]), B;
         });
       }
-      c(map(x, (C) => ({ _id: C, ...b }))), o({
-        undo: () => c(S),
-        redo: () => c(map(x, (C) => ({ _id: C, ...b })))
+      c(map(x, (S) => ({ _id: S, ...b }))), o({
+        undo: () => c(C),
+        redo: () => c(map(x, (S) => ({ _id: S, ...b })))
       });
     },
     updateBlocksRuntime: (x, b) => {
@@ -781,8 +781,8 @@ const undoRedoStateAtom = atom({
     updateMultipleBlocksProps: (x) => {
       let b = [];
       b = map(x, (y) => {
-        const S = keys(y), C = n.find((_) => _._id === y._id), w = {};
-        return each(S, (_) => w[_] = C[_]), w;
+        const C = keys(y), S = n.find((_) => _._id === y._id), w = {};
+        return each(C, (_) => w[_] = S[_]), w;
       }), c(x), o({
         undo: () => c(b),
         redo: () => c(x)
@@ -2285,8 +2285,8 @@ const getBlockWithChildren = (o, n) => {
     for (const b in x) {
       const y = x[b];
       if (typeof y == "string" && startsWith(y, STYLES_KEY)) {
-        const { baseClasses: S, classes: C } = getSplitChaiClasses(y);
-        x[b] = compact(flattenDeep([S, C])).join(" ");
+        const { baseClasses: C, classes: S } = getSplitChaiClasses(y);
+        x[b] = compact(flattenDeep([C, S])).join(" ");
       } else
         b !== "_id" && delete x[b];
     }
@@ -2298,7 +2298,7 @@ const getBlockWithChildren = (o, n) => {
         if (l) {
           n(!0), a(null);
           try {
-            const y = p === d ? "" : p, S = x.toLowerCase().includes("translate the content"), C = h === "content" ? pickOnlyAIProps(cloneDeep(getBlockWithChildren(f, u)), p, S) : [m(f, u)], w = await l(h, addLangToPrompt(x, g, h), C, y), { blocks: _, error: B } = w;
+            const y = p === d ? "" : p, C = x.toLowerCase().includes("translate the content"), S = h === "content" ? pickOnlyAIProps(cloneDeep(getBlockWithChildren(f, u)), p, C) : [m(f, u)], w = await l(h, addLangToPrompt(x, g, h), S, y), { blocks: _, error: B } = w;
             if (B) {
               a(B);
               return;
@@ -2971,6 +2971,7 @@ const useSidebarActivePanel = () => useAtom$1(sidebarActivePanelAtom), ScalePerc
   OPEN_ADD_BLOCK: "OPEN_ADD_BLOCK",
   CLOSE_ADD_BLOCK: "CLOSE_ADD_BLOCK",
   SHOW_BLOCK_SETTINGS: "SHOW_BLOCK_SETTINGS",
+  GOTO_BLOCK_SETTINGS: "GOTO_BLOCK_SETTINGS",
   //CANVAS Events
   CLEAR_CANVAS_SELECTION: "CLEAR_CANVAS_SELECTION",
   CANVAS_BLOCK_SELECTED: "CANVAS_BLOCK_SELECTED",
@@ -3061,7 +3062,9 @@ const FrameContext = React__default.createContext({ document: doc, window: win }
 }, AiIcon = ({
   className: o = "h-full w-full",
   onClick: n = noop$1
-}) => /* @__PURE__ */ jsx("svg", { className: o, viewBox: "0 0 256 256", fill: "currentColor", onClick: n, children: /* @__PURE__ */ jsx("path", { d: "m198.39 128.986-52.16-19.216-19.216-52.16a16 16 0 0 0-30.028 0L77.77 109.77l-52.16 19.216a16 16 0 0 0 0 30.028l52.16 19.216 19.216 52.16a16 16 0 0 0 30.028 0l19.216-52.16 52.16-19.216a16 16 0 0 0 0-30.028m-57.69 34.23a15.97 15.97 0 0 0-9.483 9.483l-19.22 52.152-19.214-52.15a15.97 15.97 0 0 0-9.482-9.484l-52.152-19.22 52.15-19.214a15.97 15.97 0 0 0 9.484-9.482l19.22-52.152 19.214 52.15a15.97 15.97 0 0 0 9.482 9.484l52.152 19.22ZM144 40a8 8 0 0 1 8-8h16V16a8 8 0 0 1 16 0v16h16a8 8 0 0 1 0 16h-16v16a8 8 0 0 1-16 0V48h-16a8 8 0 0 1-8-8m104 48a8 8 0 0 1-8 8h-8v8a8 8 0 0 1-16 0v-8h-8a8 8 0 0 1 0-16h8v-8a8 8 0 0 1 16 0v8h8a8 8 0 0 1 8 8" }) });
+}) => /* @__PURE__ */ jsx("svg", { className: o, viewBox: "0 0 256 256", fill: "currentColor", onClick: n, children: /* @__PURE__ */ jsx("path", { d: "m198.39 128.986-52.16-19.216-19.216-52.16a16 16 0 0 0-30.028 0L77.77 109.77l-52.16 19.216a16 16 0 0 0 0 30.028l52.16 19.216 19.216 52.16a16 16 0 0 0 30.028 0l19.216-52.16 52.16-19.216a16 16 0 0 0 0-30.028m-57.69 34.23a15.97 15.97 0 0 0-9.483 9.483l-19.22 52.152-19.214-52.15a15.97 15.97 0 0 0-9.482-9.484l-52.152-19.22 52.15-19.214a15.97 15.97 0 0 0 9.484-9.482l19.22-52.152 19.214 52.15a15.97 15.97 0 0 0 9.482 9.484l52.152 19.22ZM144 40a8 8 0 0 1 8-8h16V16a8 8 0 0 1 16 0v16h16a8 8 0 0 1 0 16h-16v16a8 8 0 0 1-16 0V48h-16a8 8 0 0 1-8-8m104 48a8 8 0 0 1-8 8h-8v8a8 8 0 0 1-16 0v-8h-8a8 8 0 0 1 0-16h8v-8a8 8 0 0 1 16 0v8h8a8 8 0 0 1 8 8" }) }), GotoSettingsIcon = ({ blockId: o, className: n }) => /* @__PURE__ */ jsx(GearIcon, { className: n, onClick: () => {
+  o && pubsub.publish(CHAI_BUILDER_EVENTS.GOTO_BLOCK_SETTINGS, o);
+} });
 function getTargetedBlock(o) {
   if (o.getAttribute("data-block-id") === "canvas")
     return null;
@@ -3180,7 +3183,7 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span",
       i([null]);
   }, [r, n]), /* @__PURE__ */ jsx(BlockFloatingSelector, { block: o, selectedBlockElement: a[0] });
 }, BlockFloatingSelector = ({ block: o, selectedBlockElement: n }) => {
-  const r = useRemoveBlocks(), a = useDuplicateBlocks(), [, l] = useSelectedBlockIds(), [, i] = useHighlightBlockId(), [, c] = useSelectedStylingBlocks(), { hasPermission: u } = usePermissions(), { editingBlockId: p } = useInlineEditing(), { document: d } = useFrame(), { floatingStyles: g, refs: m, update: h } = useFloating({
+  const r = useRemoveBlocks(), a = useDuplicateBlocks(), [, l] = useSelectedBlockIds(), [, i] = useHighlightBlockId(), [, c] = useSelectedStylingBlocks(), { hasPermission: u } = usePermissions(), { editingBlockId: p } = useInlineEditing(), { document: d } = useFrame(), g = useBuilderProp("flags.gotoSettings", !1), { floatingStyles: m, refs: h, update: f } = useFloating({
     placement: "top-start",
     middleware: [
       shift({
@@ -3197,9 +3200,9 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span",
       }),
       size({
         boundary: d == null ? void 0 : d.body,
-        apply({ availableWidth: y, availableHeight: S, elements: C }) {
-          Object.assign(C.floating.style, {
-            maxWidth: `${Math.max(200, y)}px`,
+        apply({ availableWidth: C, availableHeight: S, elements: w }) {
+          Object.assign(w.floating.style, {
+            maxWidth: `${Math.max(200, C)}px`,
             maxHeight: `${Math.max(100, S)}px`
           });
         }
@@ -3207,48 +3210,55 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span",
     ],
     elements: { reference: n }
   });
-  useResizeObserver(n, () => h(), n !== null), useResizeObserver(d == null ? void 0 : d.body, () => h(), (d == null ? void 0 : d.body) !== null);
-  const f = get(o, "_parent", null), x = isEmpty(get(o, "_name", "")) ? get(o, "_type", "") : get(o, "_name", "");
+  useResizeObserver(n, () => f(), n !== null), useResizeObserver(d == null ? void 0 : d.body, () => f(), (d == null ? void 0 : d.body) !== null);
+  const x = get(o, "_parent", null), b = isEmpty(get(o, "_name", "")) ? get(o, "_type", "") : get(o, "_name", "");
   useEffect(() => {
     if (n) {
-      const y = setTimeout(() => h(), 500);
-      return () => clearTimeout(y);
+      const C = setTimeout(() => f(), 500);
+      return () => clearTimeout(C);
     } else
-      h();
+      f();
   }, [n]);
-  const [, b] = useSidebarActivePanel();
+  const [, y] = useSidebarActivePanel();
   return !n || !o || p ? null : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
     "div",
     {
       role: "button",
       tabIndex: 0,
-      ref: m.setFloating,
-      style: g,
-      onClick: (y) => {
-        y.stopPropagation(), y.preventDefault();
+      ref: h.setFloating,
+      style: m,
+      onClick: (C) => {
+        C.stopPropagation(), C.preventDefault();
       },
-      onMouseEnter: (y) => {
-        y.stopPropagation(), i(null);
+      onMouseEnter: (C) => {
+        C.stopPropagation(), i(null);
       },
-      onKeyDown: (y) => y.stopPropagation(),
+      onKeyDown: (C) => C.stopPropagation(),
       className: "isolate z-[999] flex h-6 items-center bg-blue-500 py-2 text-xs text-white",
       children: [
-        f && /* @__PURE__ */ jsx(
+        x && /* @__PURE__ */ jsx(
           ArrowUpIcon,
           {
             className: "rounded p-0.5 hover:bg-white/20",
             onClick: () => {
-              c([]), l([f]);
+              c([]), l([x]);
             }
           }
         ),
-        /* @__PURE__ */ jsx(BlockActionLabel, { label: x, block: o }),
+        /* @__PURE__ */ jsx(BlockActionLabel, { label: b, block: o }),
         /* @__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: () => b("chai-chat-panel")
+              onClick: () => y("chai-chat-panel")
+            }
+          ),
+          g && /* @__PURE__ */ jsx(
+            GotoSettingsIcon,
+            {
+              blockId: o == null ? void 0 : o._id,
+              className: "h-4 w-4 rounded p-px hover:bg-white hover:text-blue-500"
             }
           ),
           /* @__PURE__ */ jsx(AddBlockDropdown, { block: o, children: /* @__PURE__ */ jsx(PlusIcon, { className: "h-4 w-4 rounded p-px hover:bg-white hover:text-blue-500" }) }),
@@ -3266,7 +3276,7 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span",
               onClick: () => r([o == null ? void 0 : o._id])
             }
           ) : null,
-          u(PERMISSIONS.MOVE_BLOCK) && /* @__PURE__ */ jsx(BlockController, { block: o, updateFloatingBar: h })
+          u(PERMISSIONS.MOVE_BLOCK) && /* @__PURE__ */ jsx(BlockController, { block: o, updateFloatingBar: f })
         ] })
       ]
     }
@@ -3693,12 +3703,12 @@ const RteDropdownMenu = ({
 }) => {
   const { document: i } = useFrame(), [c, u] = useState({ left: void 0, right: void 0, top: void 0, bottom: void 0 }), [p, d] = useState(!1), g = useRef(null);
   if (useEffect(() => {
-    var S, C;
+    var C, S;
     if (!p) {
       u({ left: void 0, right: void 0, top: void 0, bottom: void 0 });
       return;
     }
-    const m = (S = g.current) == null ? void 0 : S.getBoundingClientRect(), h = (C = l.current) == null ? void 0 : C.getBoundingClientRect();
+    const m = (C = g.current) == null ? void 0 : C.getBoundingClientRect(), h = (S = l.current) == null ? void 0 : S.getBoundingClientRect();
     let f = m == null ? void 0 : m.left, x = (m == null ? void 0 : m.bottom) + 4, b, y;
     (h == null ? void 0 : h.left) + (h == null ? void 0 : h.width) + 50 >= i.body.offsetWidth && (f = void 0, b = i.body.offsetWidth - (m == null ? void 0 : m.right)), x + 202 >= i.body.clientHeight && (x = null, y = i.body.clientHeight - (m == null ? void 0 : m.bottom) + (h == null ? void 0 : h.height)), u({ left: f, top: x, right: b, bottom: y });
   }, [p]), a === "canvas") {
@@ -3848,8 +3858,8 @@ const getActiveClasses$1 = (o, n, r) => {
     )
   ] });
 }, RteColorPicker = ({ editor: o, from: n, menuRef: r }) => {
-  var C, w;
-  const a = (C = o == null ? void 0 : o.getAttributes("textStyle")) == null ? void 0 : C.color, l = (w = o == null ? void 0 : o.getAttributes("highlight")) == null ? void 0 : w.color, [i, c] = useState(a || "#000000F2"), [u, p] = useState(l || "#00000057"), [d, g] = useDebouncedState(i, 150), [m, h] = useDebouncedState(u, 150), f = (_, B) => {
+  var S, w;
+  const a = (S = o == null ? void 0 : o.getAttributes("textStyle")) == null ? void 0 : S.color, l = (w = o == null ? void 0 : o.getAttributes("highlight")) == null ? void 0 : w.color, [i, c] = useState(a || "#000000F2"), [u, p] = useState(l || "#00000057"), [d, g] = useDebouncedState(i, 150), [m, h] = useDebouncedState(u, 150), f = (_, B) => {
     B ? (c(_), g(_)) : (o == null || o.chain().setColor(_).run(), c(_));
   }, x = (_, B) => {
     B ? (p(_), h(_)) : (o == null || o.chain().setHighlight({ color: _ }).run(), p(_));
@@ -4160,8 +4170,8 @@ const RichTextEditor = memo(
       placeholder: "Enter text here",
       onUpdate: ({ editor: d }) => a((d == null ? void 0 : d.getHTML()) || ""),
       onBlur: ({ editor: d, event: g }) => {
-        const m = g == null ? void 0 : g.relatedTarget, h = i.querySelector(".ProseMirror"), f = i.querySelector(".tippy-box"), x = i.querySelector("#chai-rich-text-menu-bar"), b = h == null ? void 0 : h.contains(m), y = f == null ? void 0 : f.contains(m), S = x == null ? void 0 : x.contains(m), C = window.document.getElementById("rte-widget-color-picker");
-        if (!b && !y && !S && !C) {
+        const m = g == null ? void 0 : g.relatedTarget, h = i.querySelector(".ProseMirror"), f = i.querySelector(".tippy-box"), x = i.querySelector("#chai-rich-text-menu-bar"), b = h == null ? void 0 : h.contains(m), y = f == null ? void 0 : f.contains(m), C = x == null ? void 0 : x.contains(m), S = window.document.getElementById("rte-widget-color-picker");
+        if (!b && !y && !C && !S) {
           const w = (d == null ? void 0 : d.getHTML()) || "";
           r(w);
         }
@@ -4254,7 +4264,7 @@ const RichTextEditor = memo(
   }
 ), WithBlockTextEditor = memo(
   ({ block: o, children: n }) => {
-    const r = "content", { document: a } = useFrame(), { editingBlockId: l, editingItemIndex: i, setEditingBlockId: c, setEditingItemIndex: u } = useInlineEditing(), [p, d] = useState(null), g = useRef(null), { clearHighlight: m } = useBlockHighlight(), h = useUpdateBlocksProps(), { selectedLang: f } = useLanguages(), [, x] = useSelectedBlockIds(), b = useRef(null), y = l, { blockContent: S, blockType: C } = useMemo(() => {
+    const r = "content", { document: a } = useFrame(), { editingBlockId: l, editingItemIndex: i, setEditingBlockId: c, setEditingItemIndex: u } = useInlineEditing(), [p, d] = useState(null), g = useRef(null), { clearHighlight: m } = useBlockHighlight(), h = useUpdateBlocksProps(), { selectedLang: f } = useLanguages(), [, x] = useSelectedBlockIds(), b = useRef(null), y = l, { blockContent: C, blockType: S } = useMemo(() => {
       var j;
       const k = o._type;
       let A = o[r];
@@ -4287,11 +4297,11 @@ const RichTextEditor = memo(
       if (!y) return;
       const k = `[data-block-id="${y}"]`, A = i >= 0 ? `[data-block-index="${i}"]` : "", v = a.querySelector(`${k}${A}`);
       v && ((E = v == null ? void 0 : v.classList) == null || E.add("sr-only"), d(v));
-    }, [y, C, a, i]);
-    const I = useMemo(() => p ? (m(), ["RichText", "Paragraph"].includes(C) ? /* @__PURE__ */ jsx(
+    }, [y, S, a, i]);
+    const I = useMemo(() => p ? (m(), ["RichText", "Paragraph"].includes(S) ? /* @__PURE__ */ jsx(
       RichTextEditor,
       {
-        blockContent: S,
+        blockContent: C,
         editingElement: p,
         onChange: _,
         onClose: w,
@@ -4301,13 +4311,13 @@ const RichTextEditor = memo(
       MemoizedEditor,
       {
         editorRef: g,
-        blockContent: S,
+        blockContent: C,
         editingElement: p,
         onClose: w,
         onChange: _,
         onEscape: B
       }
-    )) : null, [p, y, C, S, w, f]);
+    )) : null, [p, y, S, C, w, f]);
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       I,
       n
@@ -4351,7 +4361,7 @@ const RichTextEditor = memo(
       key: x
     }) : applyLanguage(i, u, c),
     [i, u, c, g, m, f, x]
-  ), S = useMemo(() => getBlockTagAttributes(i), [i, getBlockTagAttributes]), C = useMemo(
+  ), C = useMemo(() => getBlockTagAttributes(i), [i, getBlockTagAttributes]), S = useMemo(
     () => d(i._id, getBlockRuntimeProps(i._type)),
     [i._id, i._type, d, getBlockRuntimeProps]
   ), w = useMemo(
@@ -4360,8 +4370,8 @@ const RichTextEditor = memo(
       inBuilder: b === "edit",
       lang: u || p,
       ...y,
-      ...S,
       ...C,
+      ...S,
       ...o
     }),
     [
@@ -4371,8 +4381,8 @@ const RichTextEditor = memo(
       u,
       p,
       y,
-      S,
       C,
+      S,
       o
     ]
   ), _ = useMemo(() => !CORE_BLOCKS.includes(i._type), [i._type]), B = useMemo(() => get(i, "_show", !0), [i]);
@@ -4552,7 +4562,7 @@ const RichTextEditor = memo(
     /* @__PURE__ */ jsx("p", { className: "font-semibold", children: o("Oops! Something went wrong.") }),
     /* @__PURE__ */ jsx("p", { children: o("Please try again.") })
   ] }) });
-}, CodeEditor$1 = React__default.lazy(() => import("./code-editor-D1w8nUwt.js")), CanvasArea = () => {
+}, CodeEditor$1 = React__default.lazy(() => import("./code-editor-CihZ_PJK.js")), CanvasArea = () => {
   const [o] = 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, {}) }) }),
@@ -4695,8 +4705,8 @@ const PLACEHOLDER_IMAGE = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWl
     if (!o || !c || !/\{\{.*?\}\}/.test(o)) return o;
     const w = { ...c, [d]: o }, _ = applyBindingToBlockProps(w, p, { index: -1, key: "" });
     return get(_, d, o);
-  }, [o, c, p, d]), x = !!h || f !== PLACEHOLDER_IMAGE, b = (C) => {
-    const w = isArray(C) ? first(C) : C;
+  }, [o, c, p, d]), x = !!h || f !== PLACEHOLDER_IMAGE, b = (S) => {
+    const w = isArray(S) ? first(S) : S;
     if (w) {
       n(w == null ? void 0 : w.url);
       const _ = w == null ? void 0 : w.width, B = w == null ? void 0 : w.height, I = g.includes("mobile");
@@ -4712,10 +4722,10 @@ const PLACEHOLDER_IMAGE = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWl
     }
   }, y = useCallback(() => {
     if (n(PLACEHOLDER_IMAGE), c != null && c._id) {
-      const C = {}, w = g.includes("mobile");
-      set(C, g, ""), set(C, w ? "mobileWidth" : "width", ""), set(C, w ? "mobileHeight" : "height", ""), u([c._id], C);
+      const S = {}, w = g.includes("mobile");
+      set(S, g, ""), set(S, w ? "mobileWidth" : "width", ""), set(S, w ? "mobileHeight" : "height", ""), u([c._id], S);
     }
-  }, [n, c == null ? void 0 : c._id, u, g]), S = getFileName(f);
+  }, [n, c == null ? void 0 : c._id, u, g]), C = getFileName(f);
   return /* @__PURE__ */ jsxs("div", { className: "mt-1.5 flex items-start gap-x-3", children: [
     f ? /* @__PURE__ */ jsxs("div", { className: "group relative", children: [
       /* @__PURE__ */ jsx(
@@ -4746,7 +4756,7 @@ const PLACEHOLDER_IMAGE = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWl
     ] }) : /* @__PURE__ */ jsx(MediaManagerModal, { onSelect: b, mode: "image", assetId: h, 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, { children: [
-        /* @__PURE__ */ jsx("p", { className: "max-w-[250px] truncate pr-2 text-xs text-gray-400", children: S }),
+        /* @__PURE__ */ jsx("p", { className: "max-w-[250px] truncate pr-2 text-xs text-gray-400", children: C }),
         /* @__PURE__ */ jsx(MediaManagerModal, { onSelect: b, 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(f) && f !== PLACEHOLDER_IMAGE ? l("Replace image") : l("Choose image") }) }),
         /* @__PURE__ */ jsx("div", { className: "text-center text-xs text-gray-400", children: "OR" })
       ] }),
@@ -4761,8 +4771,8 @@ const PLACEHOLDER_IMAGE = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWl
           className: "h-6  text-xs",
           placeholder: l("Enter image URL"),
           value: o === PLACEHOLDER_IMAGE ? "" : o,
-          onBlur: ({ target: { value: C } }) => a(r, C),
-          onChange: (C) => n(C.target.value)
+          onBlur: ({ target: { value: S } }) => a(r, S),
+          onChange: (S) => n(S.target.value)
         }
       )
     ] })
@@ -4878,10 +4888,10 @@ const DataBindingSelector = ({
         n(`{{${m}}}`, {}, r);
         return;
       }
-      const f = (S) => /[.,!?;:]/.test(S), x = (S, C, w) => {
+      const f = (C) => /[.,!?;:]/.test(C), x = (C, S, w) => {
         let _ = "", B = "";
-        const I = C > 0 ? S[C - 1] : "", k = C < S.length ? S[C] : "";
-        return C > 0 && (I === "." || !f(I) && I !== " ") && (_ = " "), C < S.length && !f(k) && k !== " " && (B = " "), {
+        const I = S > 0 ? C[S - 1] : "", k = S < C.length ? C[S] : "";
+        return S > 0 && (I === "." || !f(I) && I !== " ") && (_ = " "), S < C.length && !f(k) && k !== " " && (B = " "), {
           text: _ + w + B,
           prefixLength: _.length,
           suffixLength: B.length
@@ -4890,31 +4900,31 @@ const DataBindingSelector = ({
       if (!b) return;
       const y = document.getElementById(`chai-rte-${r}`) || document.getElementById(`chai-rte-modal-${r}`);
       if (y && (y.querySelector(".ProseMirror") || y.__chaiRTE)) {
-        const S = y.__chaiRTE;
-        if (S) {
-          const C = `{{${m}}}`;
-          S.commands.focus();
-          const { from: w, to: _ } = S.state.selection;
+        const C = y.__chaiRTE;
+        if (C) {
+          const S = `{{${m}}}`;
+          C.commands.focus();
+          const { from: w, to: _ } = C.state.selection;
           if (w !== _)
-            S.chain().deleteSelection().insertContent(C).run();
+            C.chain().deleteSelection().insertContent(S).run();
           else {
-            const { state: I } = S, k = I.selection.from, A = I.doc.textBetween(Math.max(0, k - 1), k), v = I.doc.textBetween(k, Math.min(k + 1, I.doc.content.size));
+            const { state: I } = C, k = I.selection.from, A = I.doc.textBetween(Math.max(0, k - 1), k), v = I.doc.textBetween(k, Math.min(k + 1, I.doc.content.size));
             let E = "";
             k > 0 && A !== " " && !f(A) && (E = " ");
             let j = "";
-            v && v !== " " && !f(v) && (j = " "), S.chain().insertContent(E + C + j).run();
+            v && v !== " " && !f(v) && (j = " "), C.chain().insertContent(E + S + j).run();
           }
-          setTimeout(() => n(S.getHTML(), {}, r), 100);
+          setTimeout(() => n(C.getHTML(), {}, r), 100);
           return;
         }
       } else {
-        const S = b, C = S.selectionStart || 0, w = S.value || "", _ = S.selectionEnd || C;
-        if (_ > C) {
-          const v = `{{${m}}}`, { text: E } = x(w, C, v), j = w.slice(0, C) + E + w.slice(_);
+        const C = b, S = C.selectionStart || 0, w = C.value || "", _ = C.selectionEnd || S;
+        if (_ > S) {
+          const v = `{{${m}}}`, { text: E } = x(w, S, v), j = w.slice(0, S) + E + w.slice(_);
           n(j, {}, r);
           return;
         }
-        const I = `{{${m}}}`, { text: k } = x(w, C, I), A = w.slice(0, C) + k + w.slice(C);
+        const I = `{{${m}}}`, { text: k } = x(w, S, I), A = w.slice(0, S) + k + w.slice(S);
         n(A, {}, r);
       }
     },
@@ -4937,7 +4947,7 @@ const DataBindingSelector = ({
   onChange: r
 }) => {
   var A;
-  const { t: a } = useTranslation(), l = useBuilderProp("searchPageTypeItems", (v, E) => []), [i, c] = useState(!1), [u, p] = useState(!1), [d, g] = useState("page"), [m, h] = useState(""), [f, x] = useState([]), [b, y] = useState(-1), S = useRef(null), C = (A = n == null ? void 0 : n.find((v) => v.key === d)) == null ? void 0 : A.name;
+  const { t: a } = useTranslation(), l = useBuilderProp("searchPageTypeItems", (v, E) => []), [i, c] = useState(!1), [u, p] = useState(!1), [d, g] = useState("page"), [m, h] = useState(""), [f, x] = useState([]), [b, y] = useState(-1), C = useRef(null), S = (A = n == null ? void 0 : n.find((v) => v.key === d)) == null ? void 0 : A.name;
   useEffect(() => {
     if (h(""), x([]), y(-1), p(!1), !o || i || !startsWith(o, "pageType:")) return;
     const v = split(o, ":"), E = get(v, 1, "page") || "page";
@@ -4979,8 +4989,8 @@ const DataBindingSelector = ({
     }
   };
   useEffect(() => {
-    if (b >= 0 && S.current) {
-      const v = S.current.children[b];
+    if (b >= 0 && C.current) {
+      const v = C.current.children[b];
       v == null || v.scrollIntoView({ block: "nearest" });
     }
   }, [b]);
@@ -4999,7 +5009,7 @@ const DataBindingSelector = ({
           value: m,
           onChange: (v) => k(v.target.value),
           onKeyDown: B,
-          placeholder: a(`Search ${C ?? ""}`),
+          placeholder: a(`Search ${S ?? ""}`),
           className: "w-full rounded-md border border-gray-300 p-2 pr-16"
         }
       ),
@@ -5013,7 +5023,7 @@ const DataBindingSelector = ({
       ' "',
       m,
       '"'
-    ] }) : /* @__PURE__ */ jsx("ul", { ref: S, children: map(f == null ? void 0 : f.slice(0, 20), (v, E) => /* @__PURE__ */ jsxs(
+    ] }) : /* @__PURE__ */ jsx("ul", { ref: C, children: map(f == null ? void 0 : f.slice(0, 20), (v, E) => /* @__PURE__ */ jsxs(
       "li",
       {
         onClick: () => _(v),
@@ -5122,7 +5132,7 @@ const DataBindingSelector = ({
       ]
     }
   ) });
-}, RTEModal = React__default.lazy(() => import("./rte-widget-modal-CsOaIXCW.js")), RichTextEditorFieldComp = ({ blockId: o, id: n, placeholder: r, value: a, onChange: l, onBlur: i }) => {
+}, RTEModal = React__default.lazy(() => import("./rte-widget-modal-DpWQvFjm.js")), RichTextEditorFieldComp = ({ blockId: o, id: n, placeholder: r, value: a, onChange: l, onBlur: i }) => {
   const c = useRef(null), [u, p] = useState(!1), d = useRTEditor({
     blockId: o,
     value: a,
@@ -5371,9 +5381,9 @@ const DataBindingSelector = ({
   const { id: n, classNames: r, label: a, children: l, errors: i, help: c, hidden: u, required: p, schema: d, formData: g, onChange: m } = o, { selectedLang: h, fallbackLang: f, languages: x } = useLanguages(), b = useMemo(
     () => isEmpty(x) ? "" : isEmpty(h) ? f : h,
     [x, h, f]
-  ), y = useMemo(() => get(LANGUAGES, b, b), [b]), S = usePageExternalData(), C = useSelectedBlock(), w = useRegisteredChaiBlocks(), _ = useMemo(
-    () => get(w, [C == null ? void 0 : C._type, "i18nProps"], []),
-    [w, C == null ? void 0 : C._type]
+  ), y = useMemo(() => get(LANGUAGES, b, b), [b]), C = usePageExternalData(), S = useSelectedBlock(), w = useRegisteredChaiBlocks(), _ = useMemo(
+    () => get(w, [S == null ? void 0 : S._type, "i18nProps"], []),
+    [w, S == null ? void 0 : S._type]
   ), [B, I] = useState(null);
   if (u)
     return null;
@@ -5433,7 +5443,7 @@ const DataBindingSelector = ({
           /* @__PURE__ */ jsx(TooltipContent, { className: "max-w-xs", children: d.description })
         ] }) })
       ] }),
-      !d.enum && !d.oneOf && S && /* @__PURE__ */ jsxs("span", { className: "flex items-center space-x-1", children: [
+      !d.enum && !d.oneOf && C && /* @__PURE__ */ jsxs("span", { className: "flex items-center space-x-1", children: [
         E ? /* @__PURE__ */ jsxs(Tooltip, { children: [
           /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxs(
             "svg",
@@ -5584,7 +5594,7 @@ function BlockSettings() {
     I && (r([n._id], { [I]: get(B, I) }), x({ formData: B }, I, { [I]: get(c, I) }));
   }, y = ({ formData: B }, I) => {
     I && (r([g._id], { [I]: get(B, I) }), x({ formData: B }, I, { [I]: get(c, I) }));
-  }, { schema: S, uiSchema: C } = useMemo(() => {
+  }, { schema: C, uiSchema: S } = useMemo(() => {
     const B = n == null ? void 0 : n._type;
     if (!B)
       return { schema: {}, uiSchema: {} };
@@ -5635,14 +5645,14 @@ function BlockSettings() {
         }
       ) })
     ] }),
-    isEmpty(S) ? null : /* @__PURE__ */ jsx(
+    isEmpty(C) ? null : /* @__PURE__ */ jsx(
       JSONForm,
       {
         blockId: n == null ? void 0 : n._id,
         onChange: b,
         formData: i,
-        schema: S,
-        uiSchema: C
+        schema: C,
+        uiSchema: S
       }
     )
   ] });
@@ -5853,7 +5863,7 @@ const BlockStylingProps = () => {
   },
   a
 )) }), THROTTLE_TIME = 50, AdvanceChoices = (o) => {
-  const [n, r] = useState(!1), [a, l] = useState(""), { currentClass: i, onChange: c, classPrefix: u, cssProperty: p, units: d, negative: g } = o, [m, h] = useState(p != null && p.toLowerCase().includes("width") ? "%" : d[0]), [f, x] = useState(!1), [b, y] = useState(""), [S, C] = useState(!1), [w, _] = useState(!1);
+  const [n, r] = useState(!1), [a, l] = useState(""), { currentClass: i, onChange: c, classPrefix: u, cssProperty: p, units: d, negative: g } = o, [m, h] = useState(p != null && p.toLowerCase().includes("width") ? "%" : d[0]), [f, x] = useState(!1), [b, y] = useState(""), [C, S] = useState(!1), [w, _] = useState(!1);
   useEffect(() => {
     const { value: v, unit: E } = getClassValueAndUnit(i);
     if (E === "") {
@@ -5911,7 +5921,7 @@ 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 ${S ? "z-auto" : ""}`, children: [
+  ] }) : /* @__PURE__ */ jsxs("div", { className: `group relative flex items-center ${C ? "z-auto" : ""}`, children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center rounded-md border border-border", children: [
       ["none", "auto"].indexOf(m) !== -1 ? null : /* @__PURE__ */ jsx(
         "input",
@@ -5941,7 +5951,7 @@ const BlockStylingProps = () => {
             var E;
             (E = v == null ? void 0 : v.target) == null || E.select(), r(!1);
           },
-          value: S ? b : a,
+          value: C ? b : a,
           className: "h-6 w-14 rounded rounded-r-none border border-transparent bg-background pl-2 text-sm focus-visible:outline-0".concat(
             " ",
             f ? "border-red-500 text-red-500" : "border-foreground/20"
@@ -5973,12 +5983,12 @@ const BlockStylingProps = () => {
         ) })
       ] })
     ] }),
-    ["none", "auto"].indexOf(m) !== -1 || S ? null : /* @__PURE__ */ jsx(
+    ["none", "auto"].indexOf(m) !== -1 || C ? null : /* @__PURE__ */ jsx(
       DragStyleButton,
       {
-        onDragStart: () => C(!0),
+        onDragStart: () => S(!0),
         onDragEnd: (v) => {
-          if (y(() => ""), C(!1), isEmpty(v))
+          if (y(() => ""), S(!1), isEmpty(v))
             return;
           const E = `${v}`, N = `${E.startsWith("-") ? "-" : ""}${u}[${E.replace("-", "")}${m === "-" ? "" : m}]`;
           B(N);
@@ -6459,12 +6469,12 @@ const COLOR_PROP = {
       h(x, [v], k);
     },
     [x, p, g, d, l, h]
-  ), S = useCallback(() => {
+  ), C = useCallback(() => {
     f(x, [b], !0);
-  }, [x, b, f]), C = useMemo(() => canChangeClass(m, g), [m, g]);
+  }, [x, b, f]), S = useMemo(() => canChangeClass(m, g), [m, g]);
   useEffect(() => {
-    i(C, m);
-  }, [C, i, m]);
+    i(S, m);
+  }, [S, i, m]);
   const [, , w] = useScreenSizeWidth(), _ = useCallback(
     (I) => {
       w({
@@ -6478,7 +6488,7 @@ const COLOR_PROP = {
     },
     [w]
   ), B = get(m, "dark", null) === p && get(m, "mod", null) === d && get(m, "mq", null) === g;
-  return /* @__PURE__ */ jsx(BlockStyleProvider, { canChange: C, canReset: m && 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: S, canReset: m && 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] ${m && !B ? "text-foreground" : ""}`, children: n(a) }) }),
     /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center", children: [
       /* @__PURE__ */ jsxs("div", { className: "w-[150px]", children: [
@@ -6498,7 +6508,7 @@ const COLOR_PROP = {
         r === "color" && /* @__PURE__ */ jsx(ColorChoice, { property: l, onChange: y }),
         r === "dropdown" && /* @__PURE__ */ jsx(DropDownChoices, { label: a, property: l, onChange: y })
       ] }),
-      /* @__PURE__ */ jsx("div", { className: `w-[30px] cursor-pointer ${b ? "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" }) }) : C && m ? /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 100, children: [
+      /* @__PURE__ */ jsx("div", { className: `w-[30px] cursor-pointer ${b ? "visible" : "invisible"}`, children: B ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => C(), 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 && m ? /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 100, children: [
         /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsx(
           "button",
           {
@@ -6717,7 +6727,7 @@ const COLOR_PROP = {
   tooltip: r = !0
 }) => {
   const [a, , l] = useScreenSizeWidth(), [i, c] = useCanvasDisplayWidth(), [u, p] = useSelectedBreakpoints(), d = u, g = p, { t: m } = useTranslation(), h = useBuilderProp("breakpoints", WEB_BREAKPOINTS), f = (y) => {
-    d.includes(y) ? d.length > 2 && g(d.filter((S) => S !== y)) : g((S) => [...S, y]);
+    d.includes(y) ? d.length > 2 && g(d.filter((C) => C !== y)) : g((C) => [...C, y]);
   }, x = (y) => {
     n || l(y), c(y);
   }, b = getBreakpointValue(n ? i : a).toLowerCase();
@@ -6757,7 +6767,7 @@ const COLOR_PROP = {
             disabled: y.breakpoint === "xs",
             onCheckedChange: () => f(toUpper(y.breakpoint)),
             checked: includes(d, toUpper(y.breakpoint)),
-            onSelect: (S) => S.preventDefault(),
+            onSelect: (C) => C.preventDefault(),
             children: m(y.title)
           },
           y.breakpoint
@@ -6785,7 +6795,7 @@ function BreakpointSelector() {
 }
 function ManualClasses() {
   var N;
-  const o = useRef(null), [n, r] = useState(""), [a, l] = useState(-1), i = useFuseSearch(), { t: c } = useTranslation(), [u] = useSelectedStylingBlocks(), p = useSelectedBlock(), d = useAddClassesToBlocks(), g = useRemoveClassesFromBlocks(), [m] = useSelectedBlockIds(), [h, f] = useState(""), x = (N = first(u)) == null ? void 0 : N.prop, { classes: b } = getSplitChaiClasses(get(p, x, "")), y = b.split(" ").filter((T) => !isEmpty(T)), S = useBuilderProp("flags.copyPaste", !0), C = () => {
+  const o = useRef(null), [n, r] = useState(""), [a, l] = useState(-1), i = useFuseSearch(), { t: c } = useTranslation(), [u] = useSelectedStylingBlocks(), p = useSelectedBlock(), d = useAddClassesToBlocks(), g = useRemoveClassesFromBlocks(), [m] = useSelectedBlockIds(), [h, f] = useState(""), x = (N = first(u)) == null ? void 0 : N.prop, { classes: b } = getSplitChaiClasses(get(p, x, "")), y = b.split(" ").filter((T) => !isEmpty(T)), C = useBuilderProp("flags.copyPaste", !0), S = () => {
     const T = h.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
     d(m, T, !0), f("");
   }, [w, _] = useState([]), B = ({ value: T }) => {
@@ -6817,7 +6827,7 @@ function ManualClasses() {
         }, 0);
       },
       onKeyDown: (T) => {
-        T.key === "Enter" && h.trim() !== "" && C();
+        T.key === "Enter" && h.trim() !== "" && S();
       },
       onChange: (T, { newValue: P }) => f(P),
       className: "w-full rounded-md text-xs px-2 hover:outline-0 bg-background border-border py-1"
@@ -6837,7 +6847,7 @@ function ManualClasses() {
   return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-y-1.5 border-b border-border pb-4", children: [
     /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between gap-x-2", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2 text-muted-foreground", children: [
       /* @__PURE__ */ jsx("span", { children: c("Classes") }),
-      S && /* @__PURE__ */ jsxs(Tooltip, { children: [
+      C && /* @__PURE__ */ jsxs(Tooltip, { children: [
         /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsx(CopyIcon, { onClick: j, className: "cursor-pointer" }) }),
         /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: c("Copy classes to clipboard") }) })
       ] })
@@ -6867,7 +6877,7 @@ function ManualClasses() {
         {
           variant: "outline",
           className: "h-6 border-border",
-          onClick: C,
+          onClick: S,
           disabled: h.trim() === "",
           size: "sm",
           children: /* @__PURE__ */ jsx(PlusIcon, {})
@@ -7240,12 +7250,12 @@ const registerChaiLibrary = (o, n) => {
   parentId: r = void 0,
   position: a = -1
 }) => {
-  const [l, i] = useState(!1), c = useMemo(() => (n == null ? void 0 : n.getBlock) || (() => []), [n]), { addCoreBlock: u, addPredefinedBlock: p } = useAddBlock(), [, d] = useSelectedBlockIds(), { clearHighlight: g } = useBlockHighlight(), m = get(o, "name", get(o, "label")), h = get(o, "description", ""), f = useFeature("dnd"), [, x] = useAtom$1(draggedBlockAtom), b = (C) => {
-    const w = has(C, "styles_attrs.data-page-section");
-    return C._type === "Box" && w;
+  const [l, i] = useState(!1), c = useMemo(() => (n == null ? void 0 : n.getBlock) || (() => []), [n]), { addCoreBlock: u, addPredefinedBlock: p } = useAddBlock(), [, d] = useSelectedBlockIds(), { clearHighlight: g } = useBlockHighlight(), m = get(o, "name", get(o, "label")), h = get(o, "description", ""), f = useFeature("dnd"), [, x] = useAtom$1(draggedBlockAtom), b = (S) => {
+    const w = has(S, "styles_attrs.data-page-section");
+    return S._type === "Box" && w;
   }, y = useCallback(
-    async (C) => {
-      if (C.stopPropagation(), has(o, "component")) {
+    async (S) => {
+      if (S.stopPropagation(), has(o, "component")) {
         u(o, r, a), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
         return;
       }
@@ -7262,18 +7272,18 @@ const registerChaiLibrary = (o, n) => {
         onClick: l ? () => {
         } : y,
         draggable: f ? "true" : "false",
-        onDragStart: async (C) => {
+        onDragStart: async (S) => {
           const w = await c({ library: n, block: o });
           let _ = r;
           if (b(first(w)) && (_ = null), !isEmpty(w)) {
             const B = { blocks: w, uiLibrary: !0, parent: _ };
-            if (C.dataTransfer.setData("text/plain", JSON.stringify(B)), o.preview) {
+            if (S.dataTransfer.setData("text/plain", JSON.stringify(B)), o.preview) {
               const I = new Image();
               I.src = o.preview, I.onload = () => {
-                C.dataTransfer.setDragImage(I, 0, 0);
+                S.dataTransfer.setDragImage(I, 0, 0);
               };
             } else
-              C.dataTransfer.setDragImage(new Image(), 0, 0);
+              S.dataTransfer.setDragImage(new Image(), 0, 0);
             x(B), setTimeout(() => {
               d([]), g(), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
             }, 200);
@@ -7312,20 +7322,20 @@ const registerChaiLibrary = (o, n) => {
     const E = f.current.search(d).map((j) => j.item);
     h(E);
   }, [d]);
-  const x = d.trim() && !isEmpty(m) ? m : c, b = groupBy(x, "group"), [y, S] = useState(null);
+  const x = d.trim() && !isEmpty(m) ? m : c, b = groupBy(x, "group"), [y, C] = useState(null);
   useEffect(() => {
     if (isEmpty(keys(b))) {
-      S(null);
+      C(null);
       return;
     }
     if (!y || !b[y]) {
-      S(first(keys(b)));
+      C(first(keys(b)));
       return;
     }
   }, [b, y]);
-  const C = get(b, y, []), w = useRef(null), { t: _ } = useTranslation(), B = (E) => {
+  const S = get(b, y, []), w = useRef(null), { t: _ } = useTranslation(), B = (E) => {
     w.current && (clearTimeout(w.current), w.current = null), w.current = setTimeout(() => {
-      w.current && S(E);
+      w.current && C(E);
     }, 400);
   }, I = () => {
     i != null && i.id && p(i.id);
@@ -7337,7 +7347,7 @@ const registerChaiLibrary = (o, n) => {
       /* @__PURE__ */ jsx(Skeleton, { className: "col-span-3 h-full" }),
       /* @__PURE__ */ jsx(Skeleton, { className: "col-span-9 h-full" })
     ] });
-  const A = filter(C, (E, j) => j % 2 === 0), v = filter(C, (E, j) => j % 2 === 1);
+  const A = filter(S, (E, j) => j % 2 === 0), v = filter(S, (E, j) => j % 2 === 1);
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "flex h-full max-h-full flex-col", children: [
     /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 border-border py-2", children: /* @__PURE__ */ jsxs("div", { className: "relative w-full", children: [
       /* @__PURE__ */ jsx(MagnifyingGlassIcon, { className: "absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" }),
@@ -7377,7 +7387,7 @@ const registerChaiLibrary = (o, n) => {
               onMouseEnter: () => B(j),
               onMouseLeave: () => clearTimeout(w.current),
               role: "button",
-              onClick: () => S(j),
+              onClick: () => C(j),
               className: cn$1(
                 "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 === y ? "bg-primary text-primary-foreground hover:bg-primary/80" : ""
@@ -7397,7 +7407,7 @@ const registerChaiLibrary = (o, n) => {
           onMouseEnter: () => w.current ? clearTimeout(w.current) : null,
           className: "z-10 flex h-full max-h-full w-full flex-col gap-2 transition-all ease-linear",
           children: [
-            isEmpty(C) && !isEmpty(b) ? /* @__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: _("No blocks found in this group") }) }) : /* @__PURE__ */ jsxs("div", { className: "grid w-full grid-cols-2 gap-2 px-2", children: [
+            isEmpty(S) && !isEmpty(b) ? /* @__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: _("No blocks found in this group") }) }) : /* @__PURE__ */ jsxs("div", { className: "grid w-full grid-cols-2 gap-2 px-2", children: [
               /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1", children: A.map((E, j) => /* @__PURE__ */ jsx(
                 BlockCard,
                 {
@@ -7453,14 +7463,14 @@ const registerChaiLibrary = (o, n) => {
         }), g(!0);
       else if (!l && Object.keys(a || {}).length > 0) {
         const h = Object.entries(a).map(([x, b]) => {
-          const y = b, S = y.type || "partial", C = formatReadableName(S);
+          const y = b, C = y.type || "partial", S = formatReadableName(C);
           return {
             type: "PartialBlock",
             // Set the type to PartialBlock
             label: formatReadableName(y.name || x),
             description: y.description || "",
             icon: FrameIcon,
-            group: C,
+            group: S,
             // Use formatted type as group
             category: "partial",
             partialBlockId: x,
@@ -7516,7 +7526,7 @@ const registerChaiLibrary = (o, n) => {
   has(ADD_BLOCK_TABS, o) && console.warn(`Add block tab with id ${o} already registered`), set(ADD_BLOCK_TABS, o, { id: o, ...n });
 }, useChaiAddBlockTabs = () => useMemo(() => values(ADD_BLOCK_TABS), []), CORE_GROUPS = ["basic", "typography", "media", "layout", "form", "advanced", "other"], ChaiBuilderBlocks = ({ groups: o, blocks: n, parentId: r, position: a, gridCols: l = "grid-cols-4", disableBlockGroupsSidebar: i }) => {
   var E;
-  const { t: c } = useTranslation(), [u] = useBlocksStore(), [p, d] = useState(""), g = useRef(null), [m] = useAtom$1(addBlockTabAtom), h = (E = find(u, (j) => j._id === r)) == null ? void 0 : E._type, [f, x] = useState("all"), [b, y] = useState(null), S = useRef(null);
+  const { t: c } = useTranslation(), [u] = useBlocksStore(), [p, d] = useState(""), g = useRef(null), [m] = useAtom$1(addBlockTabAtom), h = (E = find(u, (j) => j._id === r)) == null ? void 0 : E._type, [f, x] = useState("all"), [b, y] = useState(null), C = useRef(null);
   useEffect(() => {
     const j = setTimeout(() => {
       var N;
@@ -7525,17 +7535,17 @@ const registerChaiLibrary = (o, n) => {
     return () => clearTimeout(j);
   }, [m]), useEffect(() => {
     p && (x("all"), y(null));
-  }, [p]), useEffect(() => (S.current = debounce((j) => {
+  }, [p]), useEffect(() => (C.current = debounce((j) => {
     x(j);
   }, 500), () => {
-    S.current && S.current.cancel();
+    C.current && C.current.cancel();
   }), []);
-  const C = useCallback((j) => {
-    y(j), S.current && S.current(j);
+  const S = useCallback((j) => {
+    y(j), C.current && C.current(j);
   }, []), w = useCallback(() => {
-    y(null), S.current && S.current.cancel();
+    y(null), C.current && C.current.cancel();
   }, []), _ = useCallback((j) => {
-    S.current && S.current.cancel(), x(j), y(null);
+    C.current && C.current.cancel(), x(j), y(null);
   }, []), B = useMemo(
     () => p ? values(n).filter(
       (j) => {
@@ -7554,7 +7564,7 @@ const registerChaiLibrary = (o, n) => {
     [I]
   ), A = useMemo(() => f === "all" ? B : filter(values(B), { group: f }), [B, f]), v = useMemo(() => f === "all" ? k : [f], [k, f]);
   return /* @__PURE__ */ jsxs("div", { className: "mx-auto flex h-full w-full max-w-3xl flex-col", children: [
-    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-10 bg-background/80 px-4 py-2 backdrop-blur-sm", children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: `${i ? "px-2" : "px-4"} sticky top-0 py-2 z-10 bg-background/80 backdrop-blur-sm`, children: /* @__PURE__ */ jsx(
       Input$1,
       {
         ref: g,
@@ -7571,7 +7581,7 @@ const registerChaiLibrary = (o, n) => {
           "button",
           {
             onClick: () => _("all"),
-            onMouseEnter: () => C("all"),
+            onMouseEnter: () => S("all"),
             onMouseLeave: w,
             className: `w-full rounded-md px-2 py-1.5 text-left text-sm font-medium ${f === "all" || b === "all" ? "bg-primary text-primary-foreground" : "hover:bg-primary/50 hover:text-primary-foreground"}`,
             children: c("All")
@@ -7582,7 +7592,7 @@ const registerChaiLibrary = (o, n) => {
           "button",
           {
             onClick: () => _(j),
-            onMouseEnter: () => C(j),
+            onMouseEnter: () => S(j),
             onMouseLeave: w,
             className: `w-full rounded-md px-2 py-1.5 text-left text-sm ${f === j || b === j ? "bg-primary text-primary-foreground" : "hover:bg-primary/50 hover:text-primary-foreground"}`,
             children: capitalize(c(j.toLowerCase()))
@@ -7599,7 +7609,7 @@ const registerChaiLibrary = (o, n) => {
             ' "',
             p,
             '"'
-          ] }) }) : /* @__PURE__ */ jsx("div", { className: "space-y-6 p-4", children: v.map((j) => /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          ] }) }) : /* @__PURE__ */ jsx("div", { className: `${i ? "p-0" : "p-4"} space-y-6`, children: v.map((j) => /* @__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 " + l, children: reject(
               f === "all" ? filter(values(A), { group: j }) : values(A),
@@ -7642,8 +7652,8 @@ const registerChaiLibrary = (o, n) => {
     /* @__PURE__ */ jsxs(
       Tabs,
       {
-        onValueChange: (S) => {
-          u(""), c(S);
+        onValueChange: (C) => {
+          u(""), c(C);
         },
         value: i,
         className: "flex h-full max-h-full flex-col overflow-hidden",
@@ -7653,13 +7663,13 @@ const registerChaiLibrary = (o, n) => {
             /* @__PURE__ */ jsx(TabsTrigger, { value: "core", children: l("Blocks") }),
             g && /* @__PURE__ */ jsx(TabsTrigger, { value: "partials", children: l("Partials") }),
             x ? /* @__PURE__ */ jsx(TabsTrigger, { value: "html", children: l("Import") }) : null,
-            map(f, (S) => /* @__PURE__ */ jsx(TabsTrigger, { value: S.id, children: React__default.createElement(S.tab) }, `tab-add-block-${S.id}`))
+            map(f, (C) => /* @__PURE__ */ jsx(TabsTrigger, { value: C.id, children: React__default.createElement(C.tab) }, `tab-add-block-${C.id}`))
           ] }),
           /* @__PURE__ */ jsx(TabsContent, { value: "core", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx("div", { className: "-mx-1.5 h-full max-h-full overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "mt-2 h-full w-full", children: /* @__PURE__ */ jsx(DefaultChaiBlocks, { gridCols: "grid-cols-4", parentId: r, position: a }) }) }) }),
           y && /* @__PURE__ */ jsx(TabsContent, { value: "library", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx(UILibrariesPanel, { parentId: r, position: a }) }),
           g && /* @__PURE__ */ jsx(TabsContent, { value: "partials", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx("div", { className: "-mx-1.5 h-full max-h-full overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "mt-2 h-full w-full", children: /* @__PURE__ */ jsx(PartialBlocks, { gridCols: "grid-cols-4", parentId: r, position: a }) }) }) }),
           x ? /* @__PURE__ */ jsx(TabsContent, { value: "html", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx(ImportHTML, { parentId: r, position: a }) }) : null,
-          map(f, (S) => /* @__PURE__ */ jsx(TabsContent, { value: S.id, children: React__default.createElement(S.tabContent, { close: h, parentId: r, position: a }) }, `panel-add-block-${S.id}`))
+          map(f, (C) => /* @__PURE__ */ jsx(TabsContent, { value: C.id, children: React__default.createElement(C.tabContent, { close: h, parentId: r, position: a }) }, `panel-add-block-${C.id}`))
         ]
       }
     )
@@ -8033,8 +8043,8 @@ const Input = ({ node: o }) => {
   var D;
   const { t: a } = useTranslation(), l = useUpdateBlocksProps(), [i] = useAtom$1(canvasIframeAtom), { hasPermission: c } = usePermissions();
   let u = null;
-  const p = o.children.length > 0, { highlightBlock: d, clearHighlight: g } = useBlockHighlight(), { id: m, data: h, isSelected: f, willReceiveDrop: x, isDragging: b, isEditing: y, handleClick: S } = o, C = get(h, "_show", !0), w = (L) => {
-    L.stopPropagation(), C && o.toggle();
+  const p = o.children.length > 0, { highlightBlock: d, clearHighlight: g } = useBlockHighlight(), { id: m, data: h, isSelected: f, willReceiveDrop: x, isDragging: b, isEditing: y, handleClick: C } = o, S = get(h, "_show", !0), w = (L) => {
+    L.stopPropagation(), S && o.toggle();
   }, _ = (L) => {
     L.isInternal && (u = L.isOpen, L.isOpen && L.close());
   }, B = (L) => {
@@ -8045,11 +8055,11 @@ const Input = ({ node: o }) => {
   }, v = () => {
     k(null);
   }, E = (L) => {
-    v(), L.stopPropagation(), !o.isOpen && C && o.toggle(), S(L);
+    v(), L.stopPropagation(), !o.isOpen && S && o.toggle(), C(L);
   };
   useEffect(() => {
     const L = setTimeout(() => {
-      x && !o.isOpen && !b && C && o.toggle();
+      x && !o.isOpen && !b && S && o.toggle();
     }, 500);
     return () => clearTimeout(L);
   }, [x, o, b]);
@@ -8124,7 +8134,7 @@ const Input = ({ node: o }) => {
               x && canAcceptChildBlock(h._type, "Icon") ? "bg-green-200" : "",
               (o == null ? void 0 : o.id) === I ? "bg-primary/10" : "",
               b && "opacity-20",
-              C ? "" : "line-through opacity-50",
+              S ? "" : "line-through opacity-50",
               P && f && "bg-primary/20 text-primary"
             ),
             children: [
@@ -8163,7 +8173,7 @@ const Input = ({ node: o }) => {
                 )
               ] }),
               /* @__PURE__ */ jsxs("div", { className: "invisible flex items-center space-x-1.5 pr-px group-hover:visible", children: [
-                canAddChildBlock(h == null ? void 0 : h._type) && C && c(PERMISSIONS.ADD_BLOCK) ? /* @__PURE__ */ jsxs(Tooltip, { children: [
+                canAddChildBlock(h == null ? void 0 : h._type) && S && c(PERMISSIONS.ADD_BLOCK) ? /* @__PURE__ */ jsxs(Tooltip, { children: [
                   /* @__PURE__ */ jsx(
                     TooltipTrigger,
                     {
@@ -8180,14 +8190,14 @@ const Input = ({ node: o }) => {
                     TooltipTrigger,
                     {
                       onClick: (L) => {
-                        L.stopPropagation(), l([m], { _show: !C }), o.isOpen && o.toggle();
+                        L.stopPropagation(), l([m], { _show: !S }), o.isOpen && o.toggle();
                       },
                       className: "cursor-pointer rounded bg-transparent p-0.5 hover:bg-primary/10",
                       asChild: !0,
-                      children: C ? /* @__PURE__ */ jsx(EyeClosedIcon, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(EyeOpenIcon, { className: "h-4 w-4" })
+                      children: S ? /* @__PURE__ */ jsx(EyeClosedIcon, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(EyeOpenIcon, { className: "h-4 w-4" })
                     }
                   ),
-                  /* @__PURE__ */ jsx(TooltipContent, { className: "isolate z-[9999] text-xs", side: "bottom", children: a(C ? "Hide the block from page" : "Show the block on page") })
+                  /* @__PURE__ */ jsx(TooltipContent, { className: "isolate z-[9999] text-xs", side: "bottom", children: a(S ? "Hide the block from page" : "Show the block on page") })
                 ] }),
                 /* @__PURE__ */ jsx(BlockMoreOptions, { node: o, id: m, children: /* @__PURE__ */ jsx("div", { className: "cursor-pointer rounded bg-transparent p-px hover:bg-primary/10", children: /* @__PURE__ */ jsx(DotsVerticalIcon, { className: "h-3 w-3" }) }) })
               ] })
@@ -8610,7 +8620,7 @@ const Input = ({ node: o }) => {
     "popover-foreground": ["#3d3436", "#f2e9e4"]
   }
 }, LazyCssImportModal = lazy(
-  () => import("./css-import-modal-DK2j6oGY.js").then((o) => ({ default: o.CssImportModal }))
+  () => import("./css-import-modal-DgLi5BIu.js").then((o) => ({ default: o.CssImportModal }))
 ), PREV_THEME_KEY = "chai-builder-previous-theme", DEFAULT_THEME_PRESET = [
   { shadcn_default: defaultShadcnPreset },
   { twitter_theme: twitter },
@@ -8658,14 +8668,14 @@ const Input = ({ node: o }) => {
       });
     },
     [h, f]
-  ), S = () => {
+  ), C = () => {
     const k = u.find((A) => Object.keys(A)[0] === a);
     if (k) {
       const A = Object.values(k)[0];
       A && typeof A == "object" && "fontFamily" in A && "borderRadius" in A && "colors" in A ? (y(A), l("")) : console.error("Invalid preset structure:", A);
     } else
       console.error("Preset not found:", a);
-  }, C = (k) => {
+  }, S = (k) => {
     y(k), l("");
   }, w = useDebouncedCallback(
     (k, A) => {
@@ -8727,20 +8737,20 @@ const Input = ({ node: o }) => {
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-0", children: [
           /* @__PURE__ */ jsx("div", { className: "w-[70%]", children: /* @__PURE__ */ jsxs(Select$1, { value: a, onValueChange: l, children: [
-            /* @__PURE__ */ jsx(SelectTrigger, { className: "h-9 w-full text-sm", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select preset" }) }),
+            /* @__PURE__ */ jsx(SelectTrigger, { className: "h-9 w-full text-sm", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: b("Select preset") }) }),
             /* @__PURE__ */ jsx(SelectContent, { children: Array.isArray(u) && u.map((k) => {
               const A = Object.keys(k)[0], v = A.replaceAll("_", " ");
               return /* @__PURE__ */ jsx(SelectItem, { value: A, children: capitalize(v) }, A);
             }) })
           ] }) }),
-          /* @__PURE__ */ jsx("div", { className: "w-[25%]", children: /* @__PURE__ */ jsx(Button, { className: "w-full text-sm", disabled: !a, onClick: S, children: b("Apply") }) })
+          /* @__PURE__ */ jsx("div", { className: "w-[25%]", children: /* @__PURE__ */ jsx(Button, { className: "w-full text-sm", disabled: !a, onClick: C, children: b("Apply") }) })
         ] })
       ] }),
       /* @__PURE__ */ jsx(Separator, {}),
       /* @__PURE__ */ jsxs("div", { className: cn$1("my-2 space-y-3", o), children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ jsx(TextIcon, { className: "h-3 w-3 text-gray-600" }),
-          /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: "Typography" })
+          /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: b("Typography") })
         ] }),
         (x == null ? void 0 : x.fontFamily) && /* @__PURE__ */ jsx("div", { className: "space-y-2", children: Object.entries(x.fontFamily).map(([k, A]) => /* @__PURE__ */ jsx(
           FontSelector,
@@ -8756,7 +8766,7 @@ const Input = ({ node: o }) => {
           /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsx(CornerTopRightIcon, { className: "h-3 w-3 text-gray-600" }),
-              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: "Border Radius" })
+              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: b("Border Radius") })
             ] }),
             /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "text-xs", children: h.borderRadius })
           ] }),
@@ -8767,7 +8777,7 @@ const Input = ({ node: o }) => {
           /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsx(MixerHorizontalIcon, { className: "h-3 w-3 text-gray-600" }),
-              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: "Colors" })
+              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: b("Colors") })
             ] }),
             m && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsx(SunIcon, { className: "h-4 w-4" }),
@@ -8785,12 +8795,12 @@ const Input = ({ node: o }) => {
           ] }),
           /* @__PURE__ */ jsx("div", { className: "space-y-2", children: x.colors.map((k) => I(k)) })
         ] }),
-        /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: i && g && /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: b("Loading...") }), children: i && g && /* @__PURE__ */ jsx(
           LazyCssImportModal,
           {
             open: i,
             onOpenChange: c,
-            onImport: C
+            onImport: S
           }
         ) })
       ] }),
@@ -8800,7 +8810,7 @@ const Input = ({ node: o }) => {
       /* @__PURE__ */ jsx("br", {})
     ] }),
     p && /* @__PURE__ */ jsx("div", { className: "absolute bottom-4 w-full", children: React.createElement(p) })
-  ] }) : /* @__PURE__ */ jsx("div", { className: "relative w-full", children: /* @__PURE__ */ jsx("div", { className: cn$1("no-scrollbar h-full w-full overflow-y-auto text-center", o), children: /* @__PURE__ */ jsx("div", { className: "mt-10 h-full items-center justify-center gap-2 text-muted-foreground", children: /* @__PURE__ */ jsx("p", { className: "text-sm", children: "You don't have permission to edit the theme. Please contact your administrator to get access." }) }) }) });
+  ] }) : /* @__PURE__ */ jsx("div", { className: "relative w-full", children: /* @__PURE__ */ jsx("div", { className: cn$1("no-scrollbar h-full w-full overflow-y-auto text-center", o), children: /* @__PURE__ */ jsx("div", { className: "mt-10 h-full items-center justify-center gap-2 text-muted-foreground", children: /* @__PURE__ */ jsx("p", { className: "text-sm", children: b("You don't have permission to edit the theme. Please contact your administrator to get access.") }) }) }) });
 }), Core = "Core", Import = "Import", Breakpoints = "Breakpoints", Clear = "Clear", Cancel = "Cancel", Yes = "Yes", Preview = "Preview", Settings = "Settings", Styling = "Style", SVG_code = "Enter SVG code here", Remove = "Remove", Choose = "Choose", Cut = "Cut", Copy = "Copy", Paste = "Paste", Delete = "Delete", classes = "classes", Theme = "Theme", Outline = "Outline", Copied = "Copied", Stop = "Stop", Edit = "Edit", Tag = "Tag", Value = "Value", URL$1 = "URL", Images = "Images", Library = "Library", Blocks = "Blocks", Basic = "Basic", Media = "Media", Advanced = "Advanced", Form = "Form", Groups = "Groups", Accordions = "Accordions", Buttons = "Buttons", Layouts = "Layouts", FAQ = "FAQ", Hero = "Hero", Features = "Features", Footer = "Footer", Navbar = "Navbar", Icons = "Icons", Testimonials = "Testimonials", Blog = "Blog", Saved = "Saved", Unsaved = "Unsaved", Randomize = "Randomize", Classes = "Classes", All = "All", Undo = "Undo", Redo = "Redo", Duplicate = "Duplicate", Close = "Close", Selected = "Selected", Select = "Select", Attributes = "Attributes", apply = "apply", presets = "presets", Orientation = "Orientation", Color = "Color", Upload = "Upload", Apply = "Apply", Back = "Back", Insert = "Insert", Rename = "Rename", Partials = "Partials", Happy = "Happy", Sad = "Sad", Retry = "Retry", canvas_empty = "Canvas is empty", Presets = "Presets", No = "No", Saving = "Saving", theme_config = { heading_font: "Heading Font", body_font: "Body Font", rounded_corner: "Rounded Corners", primary: "Primary", secondary: "Secondary", background: "Background", text_color: "Text Color", background_dark_mode: "Background (Dark Mode)", text_color_dark_mode: "Text Color (Dark Mode)" }, web_blocks = { box: "box", tag: "Tag", div: "div", level: "Level", header: "header", footer: "footer", section: "section", article: "article", aside: "aside", main: "main", nav: "navigation", figure: "figure", details: "details", summary: "summary", dialog: "dialog", strike: "strike", caption: "caption", legend: "legend", figcaption: "figure caption", mark: "mark", background_image: "Background Image", label: "Label", default: "default", icon_size: "Icon Size", icon_position: "Icon Position", start: "Start", end: "End", button: "Button", custom_html: "Custom HTML", html_code: "HTML Code", default_snippet: "The HTML snippet goes here...", placeholder: "Enter custom HTML code here", custom_script: "Custom Script", dark_mode: "Dark Mode", divider: "Divider", empty_box: "Empty Box", heading: "Heading", image: "Image", alt: "Alt", width: "Width", height: "Height", video: "Video", span: "Span", content: "Content", icon: "Icon", richtext: "Rich Text", list: "List", list_type: "List Type", listitem: "List Item", link: "Link", list_item: "List Item", none: "None", disc: "Disc", number: "Number", paragraph: "Paragraph", lightbox_link: "Lightbox Link", href: "Link", type: "Type", iframe: "iframe", inline: "inline", ajax: "ajax", autoplay: "Video autoplay", max_width: "Max Width", backdrop_color: "Background Color", gallery_name: "Gallery Name", slot: "Slot", empty_slot: "Empty Slot", text: "Text", video_url: "Video URL", controls: "Show Controls", loop: "Loop", muted: "Muted", checkbox: "Checkbox", required: "Required", checked: "Checked", submit_button: "Submit Button", form: "Form", submit_url: "Submit URL", error_message: "Error Message", success_message: "Success Message", input: "Input", value: "Value", show_label: "Show Label", field_name: "Field Name", radio: "Radio", multiple: "Multiple", options: "Options", select: "Select", multiple_choice: "Multiple Choice", textarea: "Textarea", rows: "Rows" }, lngEn = {
   "Add block": "Add Block",
   "Add Block": "Add Block",
@@ -9479,7 +9489,7 @@ const UndoRedo = () => {
   useEffect(() => {
     l(n);
   }, [n]);
-  const S = () => {
+  const C = () => {
     if (i.startsWith("@")) {
       h("Attribute keys cannot start with '@'");
       return;
@@ -9488,7 +9498,7 @@ const UndoRedo = () => {
       const k = [...a, { key: i, value: u }];
       r(k), l(a), c(""), p(""), h("");
     }
-  }, C = (k) => {
+  }, S = (k) => {
     const A = a.filter((v, E) => E !== k);
     r(A), l(A);
   }, w = (k) => {
@@ -9503,7 +9513,7 @@ const UndoRedo = () => {
       k[d] = { key: i, value: u }, r(k), l(k), g(null), c(""), p(""), h("");
     }
   }, B = (k) => {
-    k.key === "Enter" && !k.shiftKey && (k.preventDefault(), d !== null ? _() : S());
+    k.key === "Enter" && !k.shiftKey && (k.preventDefault(), d !== null ? _() : C());
   }, I = useCallback((k) => {
     const A = (j) => /[.,!?;:]/.test(j), v = (j, N, T) => {
       let P = "", R = "";
@@ -9530,7 +9540,7 @@ const UndoRedo = () => {
       "form",
       {
         onSubmit: (k) => {
-          k.preventDefault(), d !== null ? _() : S();
+          k.preventDefault(), d !== null ? _() : C();
         },
         className: "space-y-3",
         children: [
@@ -9587,7 +9597,7 @@ const UndoRedo = () => {
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "flex-shrink-0 text-slate-400", children: [
         /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => w(A), children: /* @__PURE__ */ jsx(Pencil2Icon, { className: "h-3 w-3" }) }),
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => C(A), children: /* @__PURE__ */ jsx(Cross1Icon, { className: "h-3 w-3" }) })
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => S(A), children: /* @__PURE__ */ jsx(Cross1Icon, { className: "h-3 w-3" }) })
       ] })
     ] }, A)) })
   ] });
@@ -9757,7 +9767,7 @@ const RootLayout = () => {
       console.log("handleMenuItemClick", k, n), r(n === k ? null : k);
     },
     [n, r]
-  ), { t: x } = useTranslation(), b = useMemo(() => [...p, ...d], [p, d]), y = useBuilderProp("htmlDir", "ltr"), S = find(b, { id: n }) ?? first(b), C = get(S, "width", DEFAULT_PANEL_WIDTH);
+  ), { t: x } = useTranslation(), b = useMemo(() => [...p, ...d], [p, d]), y = useBuilderProp("htmlDir", "ltr"), C = find(b, { id: n }) ?? first(b), S = get(C, "width", DEFAULT_PANEL_WIDTH);
   useEffect(() => {
     if (n !== null) {
       const k = find(b, { id: n });
@@ -9767,8 +9777,8 @@ const RootLayout = () => {
   const w = useMemo(() => {
     if (n === null) return 0;
     const k = find(b, { id: n });
-    return get(k, "view", "standard") === "standard" ? C : l;
-  }, [n, C, l, b]), _ = useCallback(() => {
+    return get(k, "view", "standard") === "standard" ? S : l;
+  }, [n, S, l, b]), _ = useCallback(() => {
     r(a.current);
   }, [r, n]), B = useCallback(() => {
     r("outline");
@@ -9820,15 +9830,15 @@ const RootLayout = () => {
                 initial: { width: w },
                 animate: { width: w },
                 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(C, "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(C, "isInternal", !1) ? "" : "w-64"}`,
+                      children: /* @__PURE__ */ jsx("span", { children: x(get(C, "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(C, "panel", NoopComponent), {}) }) })
                 ] })
               }
             ),
@@ -9874,34 +9884,34 @@ const RootLayout = () => {
       }
     ),
     /* @__PURE__ */ jsx(AddBlocksDialog, {}),
-    n !== null && get(S, "view") === "drawer" && /* @__PURE__ */ jsx(Sheet, { open: !0, onOpenChange: () => _(), children: /* @__PURE__ */ jsxs(
+    n !== null && get(C, "view") === "drawer" && /* @__PURE__ */ jsx(Sheet, { open: !0, onOpenChange: () => _(), children: /* @__PURE__ */ jsxs(
       SheetContent,
       {
         side: "left",
         className: "flex flex-col gap-0 p-0 sm:max-w-full",
-        style: { width: `${C}px` },
+        style: { width: `${S}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(C, "icon", null) }),
+            /* @__PURE__ */ jsx("span", { children: x(get(C, "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(C, "panel", NoopComponent), {
             close: B
           }) }) })
         ]
       }
     ) }),
     " ",
-    n !== null && get(S, "view") === "modal" && /* @__PURE__ */ jsx(Dialog, { open: !0, onOpenChange: () => _(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "gap-0 p-0", style: { maxWidth: `${C}px` }, children: [
+    n !== null && get(C, "view") === "modal" && /* @__PURE__ */ jsx(Dialog, { open: !0, onOpenChange: () => _(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "gap-0 p-0", style: { maxWidth: `${S}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(C, "icon", null) }),
+        /* @__PURE__ */ jsx("span", { children: x(get(C, "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(C, "panel", NoopComponent), {
         close: B
       }) }) })
     ] }) }),
-    n !== null && get(S, "view") === "overlay" && /* @__PURE__ */ jsx(
+    n !== null && get(C, "view") === "overlay" && /* @__PURE__ */ jsx(
       motion.div,
       {
         className: "absolute bottom-0 left-12 right-0 top-0 z-50",
@@ -9920,12 +9930,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(C, "icon", null) }),
+                  /* @__PURE__ */ jsx("span", { children: x(get(C, "label", "")) })
                 ] }),
                 /* @__PURE__ */ jsx(Button, { onClick: () => _(), 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(C, "panel", NoopComponent), {
                 close: B
               }) }) })
             ]
@@ -9986,8 +9996,8 @@ const RootLayout = () => {
     const x = l.toLowerCase();
     return Object.fromEntries(
       Object.entries(a).filter(([b, y]) => {
-        var S;
-        return (b == null ? void 0 : b.toLowerCase().includes(x)) || ((S = y == null ? void 0 : y.description) == null ? void 0 : S.toLowerCase().includes(x));
+        var C;
+        return (b == null ? void 0 : b.toLowerCase().includes(x)) || ((C = y == null ? void 0 : y.description) == null ? void 0 : C.toLowerCase().includes(x));
       })
     );
   }, [a, l]), m = (x) => {
@@ -9997,7 +10007,7 @@ const RootLayout = () => {
     });
   }, h = (x) => {
     if (!c) return;
-    const b = x.clientX - p.x, y = x.clientY - p.y, S = x.currentTarget, C = S.offsetWidth, w = S.offsetHeight, _ = window.innerWidth - C, B = window.innerHeight - w, I = Math.max(0, Math.min(b, _)), k = Math.max(0, Math.min(y, B));
+    const b = x.clientX - p.x, y = x.clientY - p.y, C = x.currentTarget, S = C.offsetWidth, w = C.offsetHeight, _ = window.innerWidth - S, B = window.innerHeight - w, I = Math.max(0, Math.min(b, _)), k = Math.max(0, Math.min(y, B));
     r(I, k);
   }, f = () => {
     u(!1);
@@ -10249,10 +10259,10 @@ const atomRead = (o, n, ...r) => n.read(...r), atomWrite = (o, n, ...r) => n.wri
     return b;
   b.d.clear();
   let y = !0;
-  function S() {
+  function C() {
     l.has(n) && (x(o, n), m(o), g(o));
   }
-  function C(k) {
+  function S(k) {
     var A;
     if (isSelfAtom(n, k)) {
       const E = d(o, k);
@@ -10267,7 +10277,7 @@ const atomRead = (o, n, ...r) => n.read(...r), atomWrite = (o, n, ...r) => n.wri
     try {
       return returnAtomValue(v);
     } finally {
-      b.d.set(k, v.n), isPendingPromise(b.v) && addPendingPromiseToDependency(n, b.v, v), (A = l.get(k)) == null || A.t.add(n), y || S();
+      b.d.set(k, v.n), isPendingPromise(b.v) && addPendingPromiseToDependency(n, b.v, v), (A = l.get(k)) == null || A.t.add(n), y || C();
     }
   }
   let w, _;
@@ -10287,8 +10297,8 @@ const atomRead = (o, n, ...r) => n.read(...r), atomWrite = (o, n, ...r) => n.wri
     }
   }, I = b.n;
   try {
-    const k = p(o, n, C, B);
-    return setAtomStateValueOrPromise(o, n, k), isPromiseLike$1(k) && (registerAbortHandler(k, () => w == null ? void 0 : w.abort()), k.then(S, S)), b;
+    const k = p(o, n, S, B);
+    return setAtomStateValueOrPromise(o, n, k), isPromiseLike$1(k) && (registerAbortHandler(k, () => w == null ? void 0 : w.abort()), k.then(C, C)), b;
   } catch (k) {
     return delete b.v, b.e = k, ++b.n, b;
   } finally {
@@ -10306,18 +10316,18 @@ const atomRead = (o, n, ...r) => n.read(...r), atomWrite = (o, n, ...r) => n.wri
 }, writeAtomState = (o, n, ...r) => {
   const a = getBuildingBlocks(o), l = a[3], i = a[6], c = a[8], u = a[11], p = a[12], d = a[13], g = a[14], m = a[15], h = a[17];
   let f = !0;
-  const x = (y) => returnAtomValue(g(o, y)), b = (y, ...S) => {
-    var C;
+  const x = (y) => returnAtomValue(g(o, y)), b = (y, ...C) => {
+    var S;
     const w = u(o, y);
     try {
       if (isSelfAtom(n, y)) {
         if (!hasInitialValue(y))
           throw new Error("atom not writable");
-        const _ = w.n, B = S[0];
-        setAtomStateValueOrPromise(o, y, B), h(o, y), _ !== w.n && (l.add(y), (C = i.c) == null || C.call(i, y), m(o, y));
+        const _ = w.n, B = C[0];
+        setAtomStateValueOrPromise(o, y, B), h(o, y), _ !== w.n && (l.add(y), (S = i.c) == null || S.call(i, y), m(o, y));
         return;
       } else
-        return writeAtomState(o, y, ...S);
+        return writeAtomState(o, y, ...C);
     } finally {
       f || (d(o), p(o));
     }
@@ -10358,19 +10368,19 @@ const atomRead = (o, n, ...r) => n.read(...r), atomWrite = (o, n, ...r) => n.wri
     }, l.set(n, x), (r = c.m) == null || r.call(c, n), isActuallyWritableAtom(n)) {
       const b = () => {
         let y = !0;
-        const S = (...C) => {
+        const C = (...S) => {
           try {
-            return h(o, n, ...C);
+            return h(o, n, ...S);
           } finally {
             y || (g(o), d(o));
           }
         };
         try {
-          const C = u(o, n, S);
-          C && (x.u = () => {
+          const S = u(o, n, C);
+          S && (x.u = () => {
             y = !0;
             try {
-              C();
+              S();
             } finally {
               y = !1;
             }
@@ -10613,10 +10623,10 @@ function domToJsx(o, n = 0) {
       } else if (h.name === "style" && h.value) {
         const f = h.value.split(";").reduce(
           (x, b) => {
-            const [y, S] = b.split(":").map((C) => C.trim());
-            if (y && S) {
-              const C = y.replace(/-([a-z])/g, (w) => w[1].toUpperCase());
-              x[C] = S.replace(/['"]/g, "");
+            const [y, C] = b.split(":").map((S) => S.trim());
+            if (y && C) {
+              const S = y.replace(/-([a-z])/g, (w) => w[1].toUpperCase());
+              x[S] = C.replace(/['"]/g, "");
             }
             return x;
           },
@@ -10644,7 +10654,7 @@ function domToJsx(o, n = 0) {
         (h, f) => {
           const [x, b] = f.split(":").map((y) => y.trim());
           if (x && b) {
-            const y = x.replace(/-([a-z])/g, (S) => S[1].toUpperCase());
+            const y = x.replace(/-([a-z])/g, (C) => C[1].toUpperCase());
             h[y] = b.replace(/['"]/g, "");
           }
           return h;
@@ -10713,7 +10723,7 @@ ${l}${l}${i == null ? void 0 : i.trimEnd()}
 ${l})
 }`, { jsx: i, html: formatHtml(c), componentName: a };
 }, ExportCodeModalContent = ({ tab: o }) => {
-  var S;
+  var C;
   const { t: n } = useTranslation(), [r, a] = useState({ html: "", jsx: "" }), l = useSelectedBlock(), i = useBlocksHtmlForAi(), [c, u] = useState(""), [p, d] = useState(!1), g = () => {
     switch (o) {
       case "js":
@@ -10738,13 +10748,13 @@ ${l})
   }, h = useCallback(async () => {
     try {
       d(!1), await new Promise((k) => setTimeout(k, 1e3));
-      const C = i({ EXTRA_CORE_BLOCKS: ["Icon"] }), w = o === "ts", {
+      const S = i({ EXTRA_CORE_BLOCKS: ["Icon"] }), w = o === "ts", {
         jsx: _,
         html: B,
         componentName: I
       } = await getExportedCoded({
         selectedBlock: l,
-        html: C,
+        html: S,
         isTypeScript: w
       });
       a({ html: B, jsx: _ }), u(I), d(!0);
@@ -10757,22 +10767,22 @@ ${l})
     h();
   }, [h, o]);
   const f = useCallback(
-    async (C) => {
+    async (S) => {
       try {
-        navigator.clipboard.writeText(C), toast.success(n("Export code copied!"));
+        navigator.clipboard.writeText(S), toast.success(n("Export code copied!"));
       } catch {
         toast.error(n("Failed to copy export code"));
       }
     },
     [n]
-  ), x = (C) => {
-    const w = new Blob([C], { type: "text/jsx" }), _ = URL.createObjectURL(w), B = document.createElement("a");
+  ), x = (S) => {
+    const w = new Blob([S], { type: "text/jsx" }), _ = URL.createObjectURL(w), B = document.createElement("a");
     B.href = _, B.download = g(), document.body.appendChild(B), B.click(), URL.revokeObjectURL(_), document.body.removeChild(B), toast.success(n("Export code downloaded successfully!"));
   }, b = /* @__PURE__ */ jsxs("span", { children: [
     "Download ",
     /* @__PURE__ */ jsx("span", { className: "font-mono text-xs font-light text-gray-300", children: g() })
   ] }), y = useMemo(() => {
-    const C = { extend: shadcnTheme() }, w = JSON.stringify(C, null, 2);
+    const S = { extend: shadcnTheme() }, w = JSON.stringify(S, null, 2);
     return `{
   // Your tailwind config ...
 
@@ -10781,7 +10791,7 @@ ${l})
   `)},
 }`;
   }, []);
-  return ((S = r == null ? void 0 : r.jsx) == null ? void 0 : S.length) > 0 && p ? /* @__PURE__ */ jsx(
+  return ((C = r == null ? void 0 : r.jsx) == null ? void 0 : C.length) > 0 && p ? /* @__PURE__ */ jsx(
     CodeDisplay,
     {
       onCopy: f,