@chaibuilder/sdk 2.6.2 → 2.6.3

package/dist/core.js

@@ -4,7 +4,7 @@ var F = (o, r, n) => V(o, typeof r != "symbol" ? r + "" : r, n);
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useRegisteredChaiBlocks, getRegisteredChaiBlock, getDefaultBlockProps, useRegisteredFonts, getBlockFormSchemas, syncBlocksWithDefaults } from "@chaibuilder/runtime";
 import { BoxModelIcon, PinTopIcon, PinBottomIcon, PinLeftIcon, PinRightIcon, ArrowUpIcon, PlusIcon, CopyIcon, TrashIcon, DragHandleDots2Icon, FontBoldIcon, FontItalicIcon, UnderlineIcon, StrikethroughIcon, CodeIcon, Link1Icon, ListBulletIcon, HeadingIcon, QuoteIcon, TextAlignLeftIcon, TextAlignCenterIcon, TextAlignRightIcon, LoopIcon, InfoCircledIcon, TriangleDownIcon, RowSpacingIcon, EyeOpenIcon, EyeClosedIcon, BorderAllIcon, WidthIcon, HeightIcon, ArrowRightIcon, ArrowDownIcon, ArrowLeftIcon, ArrowTopLeftIcon, ArrowTopRightIcon, ArrowBottomRightIcon, ArrowBottomLeftIcon, AlignLeftIcon, AlignCenterHorizontallyIcon, AlignRightIcon, StretchHorizontallyIcon, OverlineIcon, LetterCaseUppercaseIcon, Cross2Icon, Cross1Icon, BoxIcon, MinusIcon, CrossCircledIcon, DotsVerticalIcon, MobileIcon, LaptopIcon, DesktopIcon, CaretRightIcon, CardStackPlusIcon, CardStackIcon, ScissorsIcon, CheckIcon, ResetIcon, EraserIcon, ZoomInIcon, MixerHorizontalIcon, LightningBoltIcon } from "@radix-ui/react-icons";
-import { get, find, filter, flatten, has, map, includes, without, compact, reverse, findIndex, isEmpty, isString, each, omit, values, pick, startsWith, isFunction, isObject as isObject$1, memoize, noop, first, keys, range, flattenDeep, set, forEach, unset, chunk, cloneDeep, isNull, isArray, split, reject, take, debounce, startCase, isNumber, parseInt as parseInt$1, isNaN as isNaN$1, toLower, nth, findLast, intersection, toUpper, capitalize, groupBy, uniq, flatMapDeep, some, trim, sortBy, round } from "lodash-es";
+import { get, find, filter, flatten, has, map, includes, without, compact, reverse, findIndex, isEmpty, isString, each, omit, values, pick, startsWith, isFunction, isObject as isObject$1, memoize, noop, first, keys, range, flattenDeep, set, forEach, unset, chunk, cloneDeep, isNull, isArray, split, reject, take, debounce, startCase, isNumber, parseInt as parseInt$1, isNaN as isNaN$1, toLower, nth, findLast, intersection, toUpper, capitalize, groupBy, uniq, sortBy, round } from "lodash-es";
 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";
@@ -15,7 +15,7 @@ import { ChevronRight, PlusIcon as PlusIcon$1, AlertCircle, X, Edit2Icon, Chevro
 import clsx$1, { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
 import TreeModel from "tree-model";
-import { C as COLLECTION_PREFIX, S as STYLES_KEY, f as getSplitChaiClasses, a as applyBindingToBlockProps, b as applyLanguage, g as getBlockTagAttributes, c as getBlockRuntimeProps, d as applyLimit, R as REPEATER_PREFIX, h as ROOT_TEMP_KEY } from "./apply-binding-BL-JPMms.js";
+import { C as COLLECTION_PREFIX, S as STYLES_KEY, h as getSplitChaiClasses, a as applyBindingToBlockProps, b as applyLanguage, g as getBlockTagAttributes, c as getBlockRuntimeProps, d as applyLimit, R as REPEATER_PREFIX, f as getBlocksFromHTML, i as ROOT_TEMP_KEY } from "./apply-binding-OTp8TO_7.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, useIntervalEffect } from "@react-hookz/web";
@@ -34,10 +34,10 @@ import RjForm from "@rjsf/core";
 import validator from "@rjsf/validator-ajv8";
 import Autosuggest from "react-autosuggest";
 import { useFeature } from "flagged";
-import { parse, stringify } from "himalaya";
 import { Tree } from "react-arborist";
 import i18n from "i18next";
 import { default as Ue } from "i18next";
+import "himalaya";
 import tailwindAspectRatio from "@tailwindcss/aspect-ratio";
 import tailwindForms from "@tailwindcss/forms";
 import tailwindTypography from "@tailwindcss/typography";
@@ -839,13 +839,13 @@ const undoRedoStateAtom = atom({
   } = useBlocksStoreManager();
   return {
     moveBlocks: (f, y, b) => {
-      const A = map(f, (E) => {
-        const w = r.find((j) => j._id === E)._parent || null, k = r.filter((j) => w ? j._parent === w : !j._parent).map((j) => j._id).indexOf(E);
-        return { _id: E, oldParent: w, oldPosition: k };
-      }), _ = A.find(({ _id: E }) => E === f[0]);
-      _ && _.oldParent === y && _.oldPosition === b || (i(f, y, b), o({
-        undo: () => each(A, ({ _id: E, oldParent: N, oldPosition: w }) => {
-          i([E], N, w);
+      const w = map(f, (_) => {
+        const A = r.find((E) => E._id === _)._parent || null, C = r.filter((E) => A ? E._parent === A : !E._parent).map((E) => E._id).indexOf(_);
+        return { _id: _, oldParent: A, oldPosition: C };
+      }), B = w.find(({ _id: _ }) => _ === f[0]);
+      B && B.oldParent === y && B.oldPosition === b || (i(f, y, b), o({
+        undo: () => each(w, ({ _id: _, oldParent: N, oldPosition: A }) => {
+          i([_], N, A);
         }),
         redo: () => i(f, y, b)
       }));
@@ -857,27 +857,27 @@ const undoRedoStateAtom = atom({
       });
     },
     removeBlocks: (f) => {
-      var _;
-      const y = (_ = first(f)) == null ? void 0 : _._parent, A = r.filter((E) => y ? E._parent === y : !E._parent).indexOf(first(f));
+      var B;
+      const y = (B = first(f)) == null ? void 0 : B._parent, w = r.filter((_) => y ? _._parent === y : !_._parent).indexOf(first(f));
       l(map(f, "_id")), o({
-        undo: () => a(f, y, A),
+        undo: () => a(f, y, w),
         redo: () => l(map(f, "_id"))
       });
     },
     updateBlocks: (f, y, b) => {
-      let A = [];
+      let w = [];
       if (b)
-        A = map(f, (_) => ({ _id: _, ...b }));
+        w = map(f, (B) => ({ _id: B, ...b }));
       else {
-        const _ = keys(y);
-        A = map(f, (E) => {
-          const N = r.find((S) => S._id === E), w = { _id: E };
-          return each(_, (S) => w[S] = N[S]), w;
+        const B = keys(y);
+        w = map(f, (_) => {
+          const N = r.find((v) => v._id === _), A = { _id: _ };
+          return each(B, (v) => A[v] = N[v]), A;
         });
       }
-      c(map(f, (_) => ({ _id: _, ...y }))), o({
-        undo: () => c(A),
-        redo: () => c(map(f, (_) => ({ _id: _, ...y })))
+      c(map(f, (B) => ({ _id: B, ...y }))), o({
+        undo: () => c(w),
+        redo: () => c(map(f, (B) => ({ _id: B, ...y })))
       });
     },
     updateBlocksRuntime: (f, y) => {
@@ -892,8 +892,8 @@ const undoRedoStateAtom = atom({
     updateMultipleBlocksProps: (f) => {
       let y = [];
       y = map(f, (b) => {
-        const A = keys(b), _ = r.find((N) => N._id === b._id), E = {};
-        return each(A, (N) => E[N] = _[N]), E;
+        const w = keys(b), B = r.find((N) => N._id === b._id), _ = {};
+        return each(w, (N) => _[N] = B[N]), _;
       }), c(f), o({
         undo: () => c(y),
         redo: () => c(f)
@@ -2367,8 +2367,8 @@ const getBlockWithChildren = (o, r) => {
     for (const y in f) {
       const b = f[y];
       if (typeof b == "string" && startsWith(b, STYLES_KEY)) {
-        const { baseClasses: A, classes: _ } = getSplitChaiClasses(b);
-        f[y] = compact(flattenDeep([A, _])).join(" ");
+        const { baseClasses: w, classes: B } = getSplitChaiClasses(b);
+        f[y] = compact(flattenDeep([w, B])).join(" ");
       } else
         y !== "_id" && delete f[y];
     }
@@ -2382,21 +2382,21 @@ const getBlockWithChildren = (o, r) => {
           try {
             const b = p === u ? "" : p;
             console.log("prompt", f);
-            const A = f.toLowerCase().includes("translate the content"), _ = m === "content" ? pickOnlyAIProps(cloneDeep(getBlockWithChildren(x, d)), p, A) : [h(x, d)], E = await l(m, addLangToPrompt(f, g, m), _, b), { blocks: N, error: w } = E;
-            if (w) {
-              a(w);
+            const w = f.toLowerCase().includes("translate the content"), B = m === "content" ? pickOnlyAIProps(cloneDeep(getBlockWithChildren(x, d)), p, w) : [h(x, d)], _ = await l(m, addLangToPrompt(f, g, m), B, b), { blocks: N, error: A } = _;
+            if (A) {
+              a(A);
               return;
             }
             if (m === "styles") {
-              const S = N.map((k) => {
-                for (const j in k)
-                  j !== "_id" && (k[j] = `${STYLES_KEY},${k[j]}`);
-                return k;
+              const v = N.map((C) => {
+                for (const E in C)
+                  E !== "_id" && (C[E] = `${STYLES_KEY},${C[E]}`);
+                return C;
               });
-              c(S);
+              c(v);
             } else
               i(N);
-            y && y(E);
+            y && y(_);
           } catch (b) {
             a(b);
           } finally {
@@ -3008,8 +3008,8 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span"],
       }),
       size({
         boundary: u == null ? void 0 : u.body,
-        apply({ availableWidth: y, availableHeight: b, elements: A }) {
-          Object.assign(A.floating.style, {
+        apply({ availableWidth: y, availableHeight: b, elements: w }) {
+          Object.assign(w.floating.style, {
             maxWidth: `${Math.max(200, y)}px`,
             maxHeight: `${Math.max(100, b)}px`
           });
@@ -3600,62 +3600,62 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
   }
 ), WithBlockTextEditor = memo(
   ({ block: o, children: r }) => {
-    const n = "content", { document: a } = useFrame(), { editingBlockId: l, editingItemIndex: i, setEditingBlockId: c, setEditingItemIndex: d } = useInlineEditing(), [p, u] = useState(null), g = useRef(null), { clearHighlight: h } = useBlockHighlight(), m = useUpdateBlocksProps(), { selectedLang: x } = useLanguages(), [, f] = useSelectedBlockIds(), y = useRef(null), b = l, { blockContent: A, blockType: _ } = useMemo(() => {
-      var B;
-      const k = o._type;
-      let j = o[n];
-      const C = getRegisteredChaiBlock(o._type);
-      return x && ((B = C == null ? void 0 : C.i18nProps) == null ? void 0 : B.includes(n)) && has(o, `${n}-${x}`) && (j = get(o, `${n}-${x}`)), { blockContent: j, blockType: k };
-    }, [o, x]), E = useCallback(
-      (k) => {
-        var C;
-        const j = k || ((C = g.current) == null ? void 0 : C.innerText);
-        m([b], { [n]: j }), u(null), c(null), d(-1), f(b ? [b] : []);
+    const n = "content", { document: a } = useFrame(), { editingBlockId: l, editingItemIndex: i, setEditingBlockId: c, setEditingItemIndex: d } = useInlineEditing(), [p, u] = useState(null), g = useRef(null), { clearHighlight: h } = useBlockHighlight(), m = useUpdateBlocksProps(), { selectedLang: x } = useLanguages(), [, f] = useSelectedBlockIds(), y = useRef(null), b = l, { blockContent: w, blockType: B } = useMemo(() => {
+      var j;
+      const C = o._type;
+      let E = o[n];
+      const S = getRegisteredChaiBlock(o._type);
+      return x && ((j = S == null ? void 0 : S.i18nProps) == null ? void 0 : j.includes(n)) && has(o, `${n}-${x}`) && (E = get(o, `${n}-${x}`)), { blockContent: E, blockType: C };
+    }, [o, x]), _ = useCallback(
+      (C) => {
+        var S;
+        const E = C || ((S = g.current) == null ? void 0 : S.innerText);
+        m([b], { [n]: E }), u(null), c(null), d(-1), f(b ? [b] : []);
       },
       [b, m, c, f, x]
     ), N = useDebouncedCallback(
-      (k) => {
-        m([b], { [n]: k });
+      (C) => {
+        m([b], { [n]: C });
       },
       [b, o, m, x],
       1e3
-    ), w = useCallback(
-      (k) => {
-        k.preventDefault(), b && (y.current = b), E(), setTimeout(() => {
-          const j = y.current;
-          y.current = null, f([j]);
+    ), A = useCallback(
+      (C) => {
+        C.preventDefault(), b && (y.current = b), _(), setTimeout(() => {
+          const E = y.current;
+          y.current = null, f([E]);
         }, 100);
       },
       [f, b, x]
     );
     useEffect(() => {
-      var v;
+      var k;
       if (!b) return;
-      const k = `[data-block-id="${b}"]`, j = i >= 0 ? `[data-block-index="${i}"]` : "", C = a.querySelector(`${k}${j}`);
-      C && ((v = C == null ? void 0 : C.classList) == null || v.add("sr-only"), u(C));
-    }, [b, _, a, i]);
-    const S = useMemo(() => p ? (h(), _ === "RichText" ? /* @__PURE__ */ jsx(
+      const C = `[data-block-id="${b}"]`, E = i >= 0 ? `[data-block-index="${i}"]` : "", S = a.querySelector(`${C}${E}`);
+      S && ((k = S == null ? void 0 : S.classList) == null || k.add("sr-only"), u(S));
+    }, [b, B, a, i]);
+    const v = useMemo(() => p ? (h(), B === "RichText" ? /* @__PURE__ */ jsx(
       RichTextEditor,
       {
-        blockContent: A,
+        blockContent: w,
         editingElement: p,
         onChange: N,
-        onClose: E,
-        onEscape: w
+        onClose: _,
+        onEscape: A
       }
     ) : /* @__PURE__ */ jsx(
       MemoizedEditor,
       {
         editorRef: g,
-        blockContent: A,
+        blockContent: w,
         editingElement: p,
-        onClose: E,
+        onClose: _,
         onChange: N,
-        onEscape: w
+        onEscape: A
       }
-    )) : null, [p, b, _, A, E, x]);
+    )) : null, [p, b, B, w, _, x]);
     return /* @__PURE__ */ jsxs(Fragment, { children: [
-      S,
+      v,
       r
     ] });
   },
@@ -3694,17 +3694,17 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
       key: y
     }) : applyLanguage(i, d, c),
     [i, d, c, g, m, f, y]
-  ), A = useMemo(() => getBlockTagAttributes(i), [i, getBlockTagAttributes]), _ = useMemo(
+  ), w = useMemo(() => getBlockTagAttributes(i), [i, getBlockTagAttributes]), B = useMemo(
     () => u(i._id, getBlockRuntimeProps(i._type)),
     [i._id, i._type, u, getBlockRuntimeProps]
-  ), E = useMemo(
+  ), _ = useMemo(
     () => ({
       blockProps: { "data-block-id": i._id, "data-block-type": i._type, "data-block-index": f },
       inBuilder: !0,
       lang: d || p,
       ...b,
-      ...A,
-      ..._,
+      ...w,
+      ...B,
       ...o
     }),
     [
@@ -3713,14 +3713,14 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
       d,
       p,
       b,
-      A,
-      _,
+      w,
+      B,
       o
     ]
   ), N = useMemo(() => !CORE_BLOCKS.includes(i._type), [i._type]);
   if (isNull(x) || h.includes(i._id)) return null;
-  let w = /* @__PURE__ */ jsx(Suspense, { children: createElement(x, {
-    ...E,
+  let A = /* @__PURE__ */ jsx(Suspense, { children: createElement(x, {
+    ..._,
     children: n({
       _id: i._id,
       _type: i._type,
@@ -3732,8 +3732,8 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
       ...i.globalBlock ? { partialBlockId: i.globalBlock } : ""
     })
   }) });
-  const S = a === i._id && (l === f || f < 0) ? /* @__PURE__ */ jsx(WithBlockTextEditor, { block: i, children: w }) : w;
-  return N ? /* @__PURE__ */ jsx(ErrorBoundary, { fallbackRender: ErrorFallback, children: S }) : S;
+  const v = a === i._id && (l === f || f < 0) ? /* @__PURE__ */ jsx(WithBlockTextEditor, { block: i, children: A }) : A;
+  return N ? /* @__PURE__ */ jsx(ErrorBoundary, { fallbackRender: ErrorFallback, children: v }) : v;
 }, PartialWrapper = ({ children: o, partialBlockId: r }) => {
   const n = useBuilderProp("gotoPage", noop), { saveState: a } = useSavePage(), { selectedLang: l, fallbackLang: i } = useLanguages(), c = useCallback(
     (d) => {
@@ -4032,15 +4032,15 @@ const PLACEHOLDER_IMAGE = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWl
     const b = isArray(y) ? first(y) : y;
     if (b) {
       r(b == null ? void 0 : b.url);
-      const A = b == null ? void 0 : b.width, _ = b == null ? void 0 : b.height;
+      const w = b == null ? void 0 : b.width, B = b == null ? void 0 : b.height;
       if (c != null && c._id) {
-        const E = {
-          ...A && { width: A },
-          ..._ && { height: _ },
+        const _ = {
+          ...w && { width: w },
+          ...B && { height: B },
           ...b.description && { alt: b.description }
         };
-        if (set(E, u, b.id), isEmpty(E)) return;
-        d([c._id], E);
+        if (set(_, u, b.id), isEmpty(_)) return;
+        d([c._id], _);
       }
     }
   }, f = useCallback(() => {
@@ -4207,12 +4207,12 @@ const DataBindingSelector = ({
         r(`{{${g}}}`, {}, n);
         return;
       }
-      const m = (b) => /[.,!?;:]/.test(b), x = (b, A, _) => {
-        let E = "", N = "";
-        const w = A > 0 ? b[A - 1] : "", S = A < b.length ? b[A] : "";
-        return A > 0 && (w === "." || !m(w) && w !== " ") && (E = " "), A < b.length && !m(S) && S !== " " && (N = " "), {
-          text: E + _ + N,
-          prefixLength: E.length,
+      const m = (b) => /[.,!?;:]/.test(b), x = (b, w, B) => {
+        let _ = "", N = "";
+        const A = w > 0 ? b[w - 1] : "", v = w < b.length ? b[w] : "";
+        return w > 0 && (A === "." || !m(A) && A !== " ") && (_ = " "), w < b.length && !m(v) && v !== " " && (N = " "), {
+          text: _ + B + N,
+          prefixLength: _.length,
           suffixLength: N.length
         };
       }, f = document.getElementById(n);
@@ -4221,30 +4221,30 @@ const DataBindingSelector = ({
       if (y && (y.querySelector(".ProseMirror") || y.__chaiRTE)) {
         const b = y.__chaiRTE;
         if (b) {
-          const A = `{{${g}}}`;
+          const w = `{{${g}}}`;
           b.commands.focus();
-          const { from: _, to: E } = b.state.selection;
-          if (_ !== E)
-            b.chain().deleteSelection().insertContent(A).run();
+          const { from: B, to: _ } = b.state.selection;
+          if (B !== _)
+            b.chain().deleteSelection().insertContent(w).run();
           else {
-            const { state: w } = b, S = w.selection.from, k = w.doc.textBetween(Math.max(0, S - 1), S), j = w.doc.textBetween(S, Math.min(S + 1, w.doc.content.size));
-            let C = "";
-            S > 0 && k !== " " && !m(k) && (C = " ");
-            let v = "";
-            j && j !== " " && !m(j) && (v = " "), b.chain().insertContent(C + A + v).run();
+            const { state: A } = b, v = A.selection.from, C = A.doc.textBetween(Math.max(0, v - 1), v), E = A.doc.textBetween(v, Math.min(v + 1, A.doc.content.size));
+            let S = "";
+            v > 0 && C !== " " && !m(C) && (S = " ");
+            let k = "";
+            E && E !== " " && !m(E) && (k = " "), b.chain().insertContent(S + w + k).run();
           }
           setTimeout(() => r(b.getHTML(), {}, n), 100);
           return;
         }
       } else {
-        const b = f, A = b.selectionStart || 0, _ = b.value || "", E = b.selectionEnd || A;
-        if (E > A) {
-          const j = `{{${g}}}`, { text: C } = x(_, A, j), v = _.slice(0, A) + C + _.slice(E);
-          r(v, {}, n);
+        const b = f, w = b.selectionStart || 0, B = b.value || "", _ = b.selectionEnd || w;
+        if (_ > w) {
+          const E = `{{${g}}}`, { text: S } = x(B, w, E), k = B.slice(0, w) + S + B.slice(_);
+          r(k, {}, n);
           return;
         }
-        const w = `{{${g}}}`, { text: S } = x(_, A, w), k = _.slice(0, A) + S + _.slice(A);
-        r(k, {}, n);
+        const A = `{{${g}}}`, { text: v } = x(B, w, A), C = B.slice(0, w) + v + B.slice(w);
+        r(C, {}, n);
       }
     },
     [n, r, a, c == null ? void 0 : c._id, d]
@@ -4265,74 +4265,74 @@ const DataBindingSelector = ({
   pageTypes: r,
   onChange: n
 }) => {
-  var j;
-  const { t: a } = useTranslation(), l = useBuilderProp("searchPageTypeItems", (C, v) => []), [i, c] = useState(!1), [d, p] = useState(!1), [u, g] = useState("page"), [h, m] = useState(""), [x, f] = useState([]), [y, b] = useState(-1), A = useRef(null), _ = (j = r == null ? void 0 : r.find((C) => C.key === u)) == null ? void 0 : j.name;
+  var E;
+  const { t: a } = useTranslation(), l = useBuilderProp("searchPageTypeItems", (S, k) => []), [i, c] = useState(!1), [d, p] = useState(!1), [u, g] = useState("page"), [h, m] = useState(""), [x, f] = useState([]), [y, b] = useState(-1), w = useRef(null), B = (E = r == null ? void 0 : r.find((S) => S.key === u)) == null ? void 0 : E.name;
   useEffect(() => {
     if (m(""), f([]), b(-1), p(!1), !o || i || !startsWith(o, "pageType:")) return;
-    const C = split(o, ":"), v = get(C, 1, "page") || "page";
-    g(v), (async () => {
-      const B = await l(v, [get(C, 2, "page")]);
-      B && Array.isArray(B) && m(get(B, [0, "name"], ""));
+    const S = split(o, ":"), k = get(S, 1, "page") || "page";
+    g(k), (async () => {
+      const j = await l(k, [get(S, 2, "page")]);
+      j && Array.isArray(j) && m(get(j, [0, "name"], ""));
     })();
   }, [o]);
-  const E = useDebouncedCallback(
-    async (C) => {
-      if (isEmpty(C))
+  const _ = useDebouncedCallback(
+    async (S) => {
+      if (isEmpty(S))
         f([]);
       else {
-        const v = await l(u, C);
-        f(v);
+        const k = await l(u, S);
+        f(k);
       }
       c(!1), b(-1);
     },
     [u],
     300
-  ), N = (C) => {
-    const v = ["pageType", u, C.id];
-    v[1] && (n(v.join(":")), m(C.name), p(!1), f([]), b(-1));
-  }, w = (C) => {
-    switch (C.key) {
+  ), N = (S) => {
+    const k = ["pageType", u, S.id];
+    k[1] && (n(k.join(":")), m(S.name), p(!1), f([]), b(-1));
+  }, A = (S) => {
+    switch (S.key) {
       case "ArrowDown":
-        C.preventDefault(), b((v) => v < x.length - 1 ? v + 1 : v);
+        S.preventDefault(), b((k) => k < x.length - 1 ? k + 1 : k);
         break;
       case "ArrowUp":
-        C.preventDefault(), b((v) => v > 0 ? v - 1 : v);
+        S.preventDefault(), b((k) => k > 0 ? k - 1 : k);
         break;
       case "Enter":
-        if (C.preventDefault(), x.length === 0) return;
+        if (S.preventDefault(), x.length === 0) return;
         y >= 0 && N(x[y]);
         break;
       case "Escape":
-        C.preventDefault(), S();
+        S.preventDefault(), v();
         break;
     }
   };
   useEffect(() => {
-    if (y >= 0 && A.current) {
-      const C = A.current.children[y];
-      C == null || C.scrollIntoView({ block: "nearest" });
+    if (y >= 0 && w.current) {
+      const S = w.current.children[y];
+      S == null || S.scrollIntoView({ block: "nearest" });
     }
   }, [y]);
-  const S = () => {
+  const v = () => {
     m(""), f([]), b(-1), p(!1), n("");
-  }, k = (C) => {
-    m(C), p(!isEmpty(C)), c(!0), E(C);
+  }, C = (S) => {
+    m(S), p(!isEmpty(S)), c(!0), _(S);
   };
   return /* @__PURE__ */ jsxs("div", { children: [
-    /* @__PURE__ */ jsx("select", { name: "pageType", value: u, onChange: (C) => g(C.target.value), children: map(r, (C) => /* @__PURE__ */ jsx("option", { value: C.key, children: C.name }, C.key)) }),
+    /* @__PURE__ */ jsx("select", { name: "pageType", value: u, onChange: (S) => g(S.target.value), children: map(r, (S) => /* @__PURE__ */ jsx("option", { value: S.key, children: S.name }, S.key)) }),
     u && /* @__PURE__ */ jsxs("div", { className: "group relative mt-2 flex items-center", children: [
       /* @__PURE__ */ jsx(
         "input",
         {
           type: "text",
           value: h,
-          onChange: (C) => k(C.target.value),
-          onKeyDown: w,
-          placeholder: a(`Search ${_ ?? ""}`),
+          onChange: (S) => C(S.target.value),
+          onKeyDown: A,
+          placeholder: a(`Search ${B ?? ""}`),
           className: "w-full rounded-md border border-gray-300 p-2 pr-16"
         }
       ),
-      /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 right-2 top-3 flex items-center gap-1.5", children: h && /* @__PURE__ */ jsx("button", { onClick: S, className: "text-gray-400 hover:text-gray-600", title: a("Clear search"), children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) }) })
+      /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 right-2 top-3 flex items-center gap-1.5", children: h && /* @__PURE__ */ jsx("button", { onClick: v, className: "text-gray-400 hover:text-gray-600", title: a("Clear search"), children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) }) })
     ] }),
     (i || !isEmpty(x) || d && isEmpty(x)) && /* @__PURE__ */ jsx("div", { className: "absolute z-40 mt-2 max-h-40 w-full max-w-[250px] overflow-y-auto rounded-md border border-border bg-background shadow-lg", children: i ? /* @__PURE__ */ jsxs("div", { className: "space-y-1 p-2", children: [
       /* @__PURE__ */ jsx("div", { className: "h-6 w-full animate-pulse rounded bg-gray-200" }),
@@ -4342,22 +4342,22 @@ const DataBindingSelector = ({
       ' "',
       h,
       '"'
-    ] }) : /* @__PURE__ */ jsx("ul", { ref: A, children: map(x == null ? void 0 : x.slice(0, 20), (C, v) => /* @__PURE__ */ jsxs(
+    ] }) : /* @__PURE__ */ jsx("ul", { ref: w, children: map(x == null ? void 0 : x.slice(0, 20), (S, k) => /* @__PURE__ */ jsxs(
       "li",
       {
-        onClick: () => N(C),
-        className: `cursor-pointer p-2 text-xs ${o != null && o.includes(C.id) ? "bg-blue-200" : v === y ? "bg-gray-100" : "hover:bg-gray-100"}`,
+        onClick: () => N(S),
+        className: `cursor-pointer p-2 text-xs ${o != null && o.includes(S.id) ? "bg-blue-200" : k === y ? "bg-gray-100" : "hover:bg-gray-100"}`,
         children: [
-          C.name,
+          S.name,
           " ",
-          C.slug && /* @__PURE__ */ jsxs("small", { className: "font-light text-gray-500", children: [
+          S.slug && /* @__PURE__ */ jsxs("small", { className: "font-light text-gray-500", children: [
             "( ",
-            C.slug,
+            S.slug,
             " )"
           ] })
         ]
       },
-      C.id
+      S.id
     )) }) })
   ] });
 }, LinkField = ({ schema: o, formData: r, onChange: n, name: a }) => {
@@ -4661,11 +4661,11 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
     if (x !== f)
       u.chain().deleteSelection().insertContent(m).run();
     else {
-      const { state: b } = u, A = b.selection.from, _ = b.doc.textBetween(Math.max(0, A - 1), A), E = b.doc.textBetween(A, Math.min(A + 1, b.doc.content.size));
+      const { state: b } = u, w = b.selection.from, B = b.doc.textBetween(Math.max(0, w - 1), w), _ = b.doc.textBetween(w, Math.min(w + 1, b.doc.content.size));
       let N = "";
-      A > 0 && _ !== " " && !/[.,!?;:]/.test(_) && (N = " ");
-      let w = "";
-      E && E !== " " && !/[.,!?;:]/.test(E) && (w = " "), u.chain().insertContent(N + m + w).run();
+      w > 0 && B !== " " && !/[.,!?;:]/.test(B) && (N = " ");
+      let A = "";
+      _ && _ !== " " && !/[.,!?;:]/.test(_) && (A = " "), u.chain().insertContent(N + m + A).run();
     }
   };
   return /* @__PURE__ */ jsx(Dialog, { open: o, onOpenChange: (h) => !h && r(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-h-[90vh] overflow-y-auto sm:max-w-[800px]", children: [
@@ -4965,25 +4965,25 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   const { selectedLang: h, fallbackLang: m, languages: x } = useLanguages(), f = useMemo(
     () => isEmpty(x) ? "" : isEmpty(h) ? m : h,
     [x, h, m]
-  ), y = useMemo(() => get(LANGUAGES, f, f), [f]), b = usePageExternalData(), A = useSelectedBlock(), _ = useRegisteredChaiBlocks(), E = useMemo(
-    () => get(_, [A == null ? void 0 : A._type, "i18nProps"], []),
-    [_, A == null ? void 0 : A._type]
-  ), [N, w] = useState(null);
+  ), y = useMemo(() => get(LANGUAGES, f, f), [f]), b = usePageExternalData(), w = useSelectedBlock(), B = useRegisteredChaiBlocks(), _ = useMemo(
+    () => get(B, [w == null ? void 0 : w._type, "i18nProps"], []),
+    [B, w == null ? void 0 : w._type]
+  ), [N, A] = useState(null);
   if (c)
     return null;
   if (p.type === "boolean") return /* @__PURE__ */ jsx("div", { className: r, children: a });
-  const k = E == null ? void 0 : E.includes(o.replace("root.", ""));
+  const C = _ == null ? void 0 : _.includes(o.replace("root.", ""));
   if (p.type === "array") {
-    const j = N === o;
+    const E = N === o;
     return /* @__PURE__ */ jsxs("div", { className: `${r} relative`, children: [
       p.title && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between gap-1", children: /* @__PURE__ */ jsxs(
         "label",
         {
           htmlFor: o,
-          onClick: () => w(j ? null : o),
+          onClick: () => A(E ? null : o),
           className: "flex cursor-pointer items-center gap-x-1 py-1 leading-tight duration-200 hover:bg-slate-100",
           children: [
-            j ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3" }),
+            E ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3" }),
             /* @__PURE__ */ jsx(List, { className: "h-3 w-3" }),
             /* @__PURE__ */ jsx("span", { className: "leading-tight", children: n }),
             " ",
@@ -4993,8 +4993,8 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
                 Info,
                 {
                   className: "h-3 w-3 text-muted-foreground/70",
-                  onClick: (C) => C.stopPropagation(),
-                  onMouseDown: (C) => C.stopPropagation()
+                  onClick: (S) => S.stopPropagation(),
+                  onMouseDown: (S) => S.stopPropagation()
                 }
               ) }),
               /* @__PURE__ */ jsx(TooltipContent, { className: "max-w-xs", children: p.description })
@@ -5002,7 +5002,7 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
           ]
         }
       ) }),
-      (u == null ? void 0 : u.length) === 0 ? /* @__PURE__ */ jsx("div", { className: "h-0 overflow-hidden", children: a }) : /* @__PURE__ */ jsxs("div", { className: `${j ? "pt-0.5" : "h-0 overflow-hidden"}`, children: [
+      (u == null ? void 0 : u.length) === 0 ? /* @__PURE__ */ jsx("div", { className: "h-0 overflow-hidden", children: a }) : /* @__PURE__ */ jsxs("div", { className: `${E ? "pt-0.5" : "h-0 overflow-hidden"}`, children: [
         a,
         l,
         i
@@ -5015,7 +5015,7 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
         /* @__PURE__ */ jsxs("label", { htmlFor: o, className: p.type === "object" ? "pb-2" : "", children: [
           n,
           " ",
-          k && /* @__PURE__ */ jsxs("small", { className: "text-[9px] text-zinc-400", children: [
+          C && /* @__PURE__ */ jsxs("small", { className: "text-[9px] text-zinc-400", children: [
             " ",
             y
           ] }),
@@ -5030,8 +5030,8 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
         DataBindingSelector,
         {
           schema: p,
-          onChange: (j) => {
-            g(j, u, o);
+          onChange: (E) => {
+            g(E, u, o);
           },
           id: o,
           formData: u
@@ -5137,43 +5137,43 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   }), a;
 };
 function BlockSettings() {
-  const { selectedLang: o } = useLanguages(), r = useSelectedBlock(), n = useUpdateBlocksPropsRealtime(), a = useUpdateBlocksProps(), l = getRegisteredChaiBlock(r == null ? void 0 : r._type), i = formDataWithSelectedLang(r, o, l), [c, d] = useState(i), [p, u] = useState(!1), g = useWrapperBlock(), h = getRegisteredChaiBlock(g == null ? void 0 : g._type), m = formDataWithSelectedLang(g, o, h), x = ({ formData: w }, S, k) => {
-    S && (c == null ? void 0 : c._id) === r._id && a([r._id], { [S]: get(w, S) }, k);
+  const { selectedLang: o } = useLanguages(), r = useSelectedBlock(), n = useUpdateBlocksPropsRealtime(), a = useUpdateBlocksProps(), l = getRegisteredChaiBlock(r == null ? void 0 : r._type), i = formDataWithSelectedLang(r, o, l), [c, d] = useState(i), [p, u] = useState(!1), g = useWrapperBlock(), h = getRegisteredChaiBlock(g == null ? void 0 : g._type), m = formDataWithSelectedLang(g, o, h), x = ({ formData: A }, v, C) => {
+    v && (c == null ? void 0 : c._id) === r._id && a([r._id], { [v]: get(A, v) }, C);
   }, f = useCallback(
-    debounce(({ formData: w }, S, k) => {
-      x({ formData: w }, S, k), d(w);
+    debounce(({ formData: A }, v, C) => {
+      x({ formData: A }, v, C), d(A);
     }, 1500),
     [r == null ? void 0 : r._id, o]
-  ), y = ({ formData: w }, S) => {
-    S && (n([r._id], { [S]: get(w, S) }), f({ formData: w }, S, { [S]: get(c, S) }));
-  }, b = ({ formData: w }, S) => {
-    S && (n([g._id], { [S]: get(w, S) }), f({ formData: w }, S, { [S]: get(c, S) }));
-  }, { schema: A, uiSchema: _ } = useMemo(() => {
-    const w = r == null ? void 0 : r._type;
-    if (!w)
+  ), y = ({ formData: A }, v) => {
+    v && (n([r._id], { [v]: get(A, v) }), f({ formData: A }, v, { [v]: get(c, v) }));
+  }, b = ({ formData: A }, v) => {
+    v && (n([g._id], { [v]: get(A, v) }), f({ formData: A }, v, { [v]: get(c, v) }));
+  }, { schema: w, uiSchema: B } = useMemo(() => {
+    const A = r == null ? void 0 : r._type;
+    if (!A)
       return { schema: {}, uiSchema: {} };
     try {
-      const { schema: S, uiSchema: k } = getBlockFormSchemas(w);
-      if (w === "Repeater") {
-        const j = get(r, "repeaterItems", "");
-        startsWith(j, `{{${COLLECTION_PREFIX}`) ? (set(k, "filter", { "ui:widget": "collectionSelect" }), set(k, "sort", { "ui:widget": "collectionSelect" })) : (set(k, "filter", { "ui:widget": "hidden" }), set(k, "sort", { "ui:widget": "hidden" }));
+      const { schema: v, uiSchema: C } = getBlockFormSchemas(A);
+      if (A === "Repeater") {
+        const E = get(r, "repeaterItems", "");
+        startsWith(E, `{{${COLLECTION_PREFIX}`) ? (set(C, "filter", { "ui:widget": "collectionSelect" }), set(C, "sort", { "ui:widget": "collectionSelect" })) : (set(C, "filter", { "ui:widget": "hidden" }), set(C, "sort", { "ui:widget": "hidden" }));
       }
-      return { schema: S, uiSchema: k };
+      return { schema: v, uiSchema: C };
     } catch {
       return { schema: {}, uiSchema: {} };
     }
-  }, [r]), { wrapperSchema: E, wrapperUiSchema: N } = useMemo(() => {
+  }, [r]), { wrapperSchema: _, wrapperUiSchema: N } = useMemo(() => {
     if (!g || !(g != null && g._type))
       return { wrapperSchema: {}, wrapperUiSchema: {} };
-    const w = g == null ? void 0 : g._type, { schema: S = {}, uiSchema: k = {} } = getBlockFormSchemas(w);
-    return { wrapperSchema: S, wrapperUiSchema: k };
+    const A = g == null ? void 0 : g._type, { schema: v = {}, uiSchema: C = {} } = getBlockFormSchemas(A);
+    return { wrapperSchema: v, wrapperUiSchema: C };
   }, [g]);
   return /* @__PURE__ */ jsxs("div", { className: "no-scrollbar overflow-x-hidden px-px", children: [
     !isEmpty(g) && /* @__PURE__ */ jsxs("div", { className: "mb-4 rounded border bg-zinc-100 px-1", children: [
       /* @__PURE__ */ jsxs(
         "div",
         {
-          onClick: () => u((w) => !w),
+          onClick: () => u((A) => !A),
           className: "flex cursor-pointer items-center gap-x-1 py-2 text-xs font-medium leading-tight hover:bg-slate-100",
           children: [
             p ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 stroke-[3] text-slate-400" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 stroke-[3] text-slate-400" }),
@@ -5194,19 +5194,19 @@ function BlockSettings() {
           blockId: g == null ? void 0 : g._id,
           onChange: b,
           formData: m,
-          schema: E,
+          schema: _,
           uiSchema: N
         }
       ) })
     ] }),
-    isEmpty(A) ? null : /* @__PURE__ */ jsx(
+    isEmpty(w) ? null : /* @__PURE__ */ jsx(
       JSONForm,
       {
         blockId: r == null ? void 0 : r._id,
         onChange: y,
         formData: i,
-        schema: A,
-        uiSchema: _
+        schema: w,
+        uiSchema: B
       }
     )
   ] });
@@ -5417,50 +5417,50 @@ const BlockStylingProps = () => {
   },
   a
 )) }), THROTTLE_TIME = 50, AdvanceChoices = (o) => {
-  const [r, n] = useState(!1), [a, l] = useState(""), { currentClass: i, onChange: c, classPrefix: d, cssProperty: p, units: u, negative: g } = o, [h, m] = useState(p != null && p.toLowerCase().includes("width") ? "%" : u[0]), [x, f] = useState(!1), [y, b] = useState(""), [A, _] = useState(!1), [E, N] = useState(!1);
+  const [r, n] = useState(!1), [a, l] = useState(""), { currentClass: i, onChange: c, classPrefix: d, cssProperty: p, units: u, negative: g } = o, [h, m] = useState(p != null && p.toLowerCase().includes("width") ? "%" : u[0]), [x, f] = useState(!1), [y, b] = useState(""), [w, B] = useState(!1), [_, N] = useState(!1);
   useEffect(() => {
-    const { value: C, unit: v } = getClassValueAndUnit(i);
-    if (v === "") {
-      l(C), m(p != null && p.toLowerCase().includes("width") ? "%" : first(u));
+    const { value: S, unit: k } = getClassValueAndUnit(i);
+    if (k === "") {
+      l(S), m(p != null && p.toLowerCase().includes("width") ? "%" : first(u));
       return;
     }
-    m(v), l(v === "class" || isEmpty(C) ? "" : C);
+    m(k), l(k === "class" || isEmpty(S) ? "" : S);
   }, [i, p, u]);
-  const w = useThrottledCallback((C) => c(C), [c], THROTTLE_TIME), S = useThrottledCallback((C) => c(C, !1), [c], THROTTLE_TIME), k = useCallback(
-    (C = !1) => {
-      const v = getUserInputValues(`${a}`, u);
-      if (get(v, "error", !1)) {
+  const A = useThrottledCallback((S) => c(S), [c], THROTTLE_TIME), v = useThrottledCallback((S) => c(S, !1), [c], THROTTLE_TIME), C = useCallback(
+    (S = !1) => {
+      const k = getUserInputValues(`${a}`, u);
+      if (get(k, "error", !1)) {
         f(!0);
         return;
       }
-      const B = get(v, "unit") !== "" ? get(v, "unit") : h;
-      if (B === "auto" || B === "none") {
-        w(`${d}${B}`);
+      const j = get(k, "unit") !== "" ? get(k, "unit") : h;
+      if (j === "auto" || j === "none") {
+        A(`${d}${j}`);
         return;
       }
-      if (get(v, "value") === "")
+      if (get(k, "value") === "")
         return;
-      const T = `${get(v, "value", "").startsWith("-") ? "-" : ""}${d}[${get(v, "value", "").replace("-", "")}${B === "-" ? "" : B}]`;
-      C ? S(T) : w(T);
+      const T = `${get(k, "value", "").startsWith("-") ? "-" : ""}${d}[${get(k, "value", "").replace("-", "")}${j === "-" ? "" : j}]`;
+      S ? v(T) : A(T);
     },
-    [w, S, a, h, d, u]
-  ), j = useCallback(
-    (C) => {
-      const v = getUserInputValues(`${a}`, u);
-      if (get(v, "error", !1)) {
+    [A, v, a, h, d, u]
+  ), E = useCallback(
+    (S) => {
+      const k = getUserInputValues(`${a}`, u);
+      if (get(k, "error", !1)) {
         f(!0);
         return;
       }
-      if (C === "auto" || C === "none") {
-        w(`${d}${C}`);
+      if (S === "auto" || S === "none") {
+        A(`${d}${S}`);
         return;
       }
-      if (get(v, "value") === "")
+      if (get(k, "value") === "")
         return;
-      const B = get(v, "unit") !== "" ? get(v, "unit") : C, T = `${get(v, "value", "").startsWith("-") ? "-" : ""}${d}[${get(v, "value", "").replace("-", "")}${B === "-" ? "" : B}]`;
-      w(T);
+      const j = get(k, "unit") !== "" ? get(k, "unit") : S, T = `${get(k, "value", "").startsWith("-") ? "-" : ""}${d}[${get(k, "value", "").replace("-", "")}${j === "-" ? "" : j}]`;
+      A(T);
     },
-    [w, a, d, u]
+    [A, a, d, u]
   );
   return /* @__PURE__ */ jsx("div", { className: "flex w-full flex-col", children: /* @__PURE__ */ jsx("div", { className: "flex items-center justify-start", children: h === "class" ? /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
@@ -5475,37 +5475,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 ${A ? "z-auto" : ""}`, children: [
+  ] }) : /* @__PURE__ */ jsxs("div", { className: `group relative flex items-center ${w ? "z-auto" : ""}`, children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center rounded-md border border-border", children: [
       ["none", "auto"].indexOf(h) !== -1 ? null : /* @__PURE__ */ jsx(
         "input",
         {
           readOnly: h === "class",
-          onKeyPress: (C) => {
-            C.key === "Enter" && k();
+          onKeyPress: (S) => {
+            S.key === "Enter" && C();
           },
-          onKeyDown: (C) => {
-            if (C.keyCode !== 38 && C.keyCode !== 40)
+          onKeyDown: (S) => {
+            if (S.keyCode !== 38 && S.keyCode !== 40)
               return;
-            C.preventDefault(), N(!0);
-            const v = parseInt$1(C.target.value);
-            let B = isNaN$1(v) ? 0 : v;
-            C.keyCode === 38 && (B += 1), C.keyCode === 40 && (B -= 1);
-            const I = `${B}`, P = `${I.startsWith("-") ? "-" : ""}${d}[${I.replace("-", "")}${h === "-" ? "" : h}]`;
-            S(P);
+            S.preventDefault(), N(!0);
+            const k = parseInt$1(S.target.value);
+            let j = isNaN$1(k) ? 0 : k;
+            S.keyCode === 38 && (j += 1), S.keyCode === 40 && (j -= 1);
+            const I = `${j}`, P = `${I.startsWith("-") ? "-" : ""}${d}[${I.replace("-", "")}${h === "-" ? "" : h}]`;
+            v(P);
           },
-          onKeyUp: (C) => {
-            E && (C.preventDefault(), N(!1));
+          onKeyUp: (S) => {
+            _ && (S.preventDefault(), N(!1));
           },
-          onBlur: () => k(),
-          onChange: (C) => {
-            f(!1), l(C.target.value);
+          onBlur: () => C(),
+          onChange: (S) => {
+            f(!1), l(S.target.value);
           },
-          onClick: (C) => {
-            var v;
-            (v = C == null ? void 0 : C.target) == null || v.select(), n(!1);
+          onClick: (S) => {
+            var k;
+            (k = S == null ? void 0 : S.target) == null || k.select(), n(!1);
           },
-          value: A ? y : a,
+          value: w ? y : a,
           className: "h-6 w-14 rounded rounded-r-none border border-transparent bg-background pl-2 text-sm focus-visible:outline-0".concat(
             " ",
             x ? "border-red-500 text-red-500" : "border-foreground/20"
@@ -5530,29 +5530,29 @@ const BlockStylingProps = () => {
           {
             units: u,
             current: h,
-            onSelect: (C) => {
-              n(!1), m(C), j(C);
+            onSelect: (S) => {
+              n(!1), m(S), E(S);
             }
           }
         ) })
       ] })
     ] }),
-    ["none", "auto"].indexOf(h) !== -1 || A ? null : /* @__PURE__ */ jsx(
+    ["none", "auto"].indexOf(h) !== -1 || w ? null : /* @__PURE__ */ jsx(
       DragStyleButton,
       {
-        onDragStart: () => _(!0),
-        onDragEnd: (C) => {
-          if (b(() => ""), _(!1), isEmpty(C))
+        onDragStart: () => B(!0),
+        onDragEnd: (S) => {
+          if (b(() => ""), B(!1), isEmpty(S))
             return;
-          const v = `${C}`, I = `${v.startsWith("-") ? "-" : ""}${d}[${v.replace("-", "")}${h === "-" ? "" : h}]`;
-          w(I);
+          const k = `${S}`, I = `${k.startsWith("-") ? "-" : ""}${d}[${k.replace("-", "")}${h === "-" ? "" : h}]`;
+          A(I);
         },
-        onDrag: (C) => {
-          if (isEmpty(C))
+        onDrag: (S) => {
+          if (isEmpty(S))
             return;
-          b(C);
-          const v = `${C}`, I = `${v.startsWith("-") ? "-" : ""}${d}[${v.replace("-", "")}${h === "-" ? "" : h}]`;
-          S(I);
+          b(S);
+          const k = `${S}`, I = `${k.startsWith("-") ? "-" : ""}${d}[${k.replace("-", "")}${h === "-" ? "" : h}]`;
+          v(I);
         },
         currentValue: a,
         unit: h,
@@ -6016,34 +6016,34 @@ const COLOR_PROP = {
 }, getBreakpoint = (o) => `${o.toUpperCase()} ${BREAKPOINTS[o] ? `(${BREAKPOINTS[o]} & up)` : ""}`, BlockStyle = (o) => {
   const { t: r } = useTranslation(), { type: n = "icons", label: a, property: l, onEmitChange: i = () => {
   }, units: c, negative: d = !1 } = o, [p] = useDarkMode(), [u] = useStylingState(), [, g] = useScreenSizeWidth(), h = useCurrentClassByProperty(l), m = useAddClassesToBlocks(), x = useRemoveClassesFromBlocks(), [f] = useSelectedBlockIds(), y = useMemo(() => get(h, "fullCls", ""), [h]), b = useCallback(
-    (S, k = !0) => {
-      const j = { dark: p, mq: g, mod: u, cls: S, property: l, fullCls: "" };
-      (p || u !== "") && (j.mq = "xs");
-      const C = generateFullClsName(j);
-      m(f, [C], k);
+    (v, C = !0) => {
+      const E = { dark: p, mq: g, mod: u, cls: v, property: l, fullCls: "" };
+      (p || u !== "") && (E.mq = "xs");
+      const S = generateFullClsName(E);
+      m(f, [S], C);
     },
     [f, p, g, u, l, m]
-  ), A = useCallback(() => {
+  ), w = useCallback(() => {
     x(f, [y], !0);
-  }, [f, y, x]), _ = useMemo(() => canChangeClass(h, g), [h, g]);
+  }, [f, y, x]), B = useMemo(() => canChangeClass(h, g), [h, g]);
   useEffect(() => {
-    i(_, h);
-  }, [_, i, h]);
-  const [, , E] = useScreenSizeWidth(), N = useCallback(
-    (S) => {
-      E({
+    i(B, h);
+  }, [B, i, h]);
+  const [, , _] = useScreenSizeWidth(), N = useCallback(
+    (v) => {
+      _({
         xs: 400,
         sm: 640,
         md: 800,
         lg: 1024,
         xl: 1420,
         "2xl": 1920
-      }[S]);
+      }[v]);
     },
-    [E]
-  ), w = get(h, "dark", null) === p && get(h, "mod", null) === u && get(h, "mq", null) === g;
-  return /* @__PURE__ */ jsx(BlockStyleProvider, { canChange: _, canReset: h && w, 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] ${h && !w ? "text-foreground" : ""}`, children: r(a) }) }),
+    [_]
+  ), A = get(h, "dark", null) === p && get(h, "mod", null) === u && get(h, "mq", null) === g;
+  return /* @__PURE__ */ jsx(BlockStyleProvider, { canChange: B, canReset: h && A, 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] ${h && !A ? "text-foreground" : ""}`, children: r(a) }) }),
     /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center", children: [
       /* @__PURE__ */ jsxs("div", { className: "w-[150px]", children: [
         n === "arbitrary" ? /* @__PURE__ */ jsx(
@@ -6062,7 +6062,7 @@ const COLOR_PROP = {
         n === "color" && /* @__PURE__ */ jsx(ColorChoice, { property: l, onChange: b }),
         n === "dropdown" && /* @__PURE__ */ jsx(DropDownChoices, { label: a, property: l, onChange: b })
       ] }),
-      /* @__PURE__ */ jsx("div", { className: `w-[30px] cursor-pointer ${y ? "visible" : "invisible"}`, children: w ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => A(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ jsx(CrossCircledIcon, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : _ && h ? /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 100, children: [
+      /* @__PURE__ */ jsx("div", { className: `w-[30px] cursor-pointer ${y ? "visible" : "invisible"}`, children: A ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => w(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ jsx(CrossCircledIcon, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : B && h ? /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 100, children: [
         /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsx(
           "button",
           {
@@ -6283,7 +6283,7 @@ const COLOR_PROP = {
   tooltip: n = !0
 }) => {
   const [a, , l] = useScreenSizeWidth(), [i, c] = useCanvasDisplayWidth(), [d, p] = useSelectedBreakpoints(), u = d, g = p, { t: h } = useTranslation(), m = useBuilderProp("breakpoints", WEB_BREAKPOINTS), x = (b) => {
-    u.includes(b) ? u.length > 2 && g(u.filter((A) => A !== b)) : g((A) => [...A, b]);
+    u.includes(b) ? u.length > 2 && g(u.filter((w) => w !== b)) : g((w) => [...w, b]);
   }, f = (b) => {
     r || l(b), c(b);
   }, y = getBreakpointValue(r ? i : a).toLowerCase();
@@ -6463,10 +6463,10 @@ const AskAIStyles = ({ blockId: o }) => {
 };
 function ManualClasses() {
   var I;
-  const o = useRef(null), [r, n] = useState(""), [a, l] = useState(-1), i = useFuseSearch(), { t: c } = useTranslation(), [d] = useSelectedStylingBlocks(), p = useSelectedBlock(), u = useAddClassesToBlocks(), g = useRemoveClassesFromBlocks(), [h] = useSelectedBlockIds(), m = useBuilderProp("askAiCallBack", null), [x, f] = useState(""), y = (I = first(d)) == null ? void 0 : I.prop, { classes: b } = getSplitChaiClasses(get(p, y, "")), A = b.split(" ").filter((T) => !isEmpty(T)), _ = () => {
+  const o = useRef(null), [r, n] = useState(""), [a, l] = useState(-1), i = useFuseSearch(), { t: c } = useTranslation(), [d] = useSelectedStylingBlocks(), p = useSelectedBlock(), u = useAddClassesToBlocks(), g = useRemoveClassesFromBlocks(), [h] = useSelectedBlockIds(), m = useBuilderProp("askAiCallBack", null), [x, f] = useState(""), y = (I = first(d)) == null ? void 0 : I.prop, { classes: b } = getSplitChaiClasses(get(p, y, "")), w = b.split(" ").filter((T) => !isEmpty(T)), B = () => {
     const T = x.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
     u(h, T, !0), f("");
-  }, [E, N] = useState([]), w = ({ value: T }) => {
+  }, [_, N] = useState([]), A = ({ value: T }) => {
     const P = T.trim().toLowerCase(), L = P.match(/.+:/g);
     let D = [];
     if (L && L.length > 0) {
@@ -6478,9 +6478,9 @@ function ManualClasses() {
     } else
       D = i.search(P);
     return N(map(D, "item"));
-  }, S = () => {
+  }, v = () => {
     N([]);
-  }, k = (T) => T.name, j = (T) => /* @__PURE__ */ jsx("div", { className: "rounded-md p-1", children: T.name }), C = useMemo(
+  }, C = (T) => T.name, E = (T) => /* @__PURE__ */ jsx("div", { className: "rounded-md p-1", children: T.name }), S = useMemo(
     () => ({
       ref: o,
       autoComplete: "off",
@@ -6495,29 +6495,29 @@ function ManualClasses() {
         }, 0);
       },
       onKeyDown: (T) => {
-        T.key === "Enter" && x.trim() !== "" && _();
+        T.key === "Enter" && x.trim() !== "" && B();
       },
       onChange: (T, { newValue: P }) => f(P),
       className: "w-full rounded-md text-xs px-2 hover:outline-0 bg-background border-border py-1"
     }),
     [x, c, o]
-  ), v = (T) => {
+  ), k = (T) => {
     debugger;
     const P = r.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
     g(h, [T]), u(h, P, !0), n(""), l(-1);
-  }, B = () => {
+  }, j = () => {
     if (navigator.clipboard === void 0) {
       toast.error(c("Clipboard not supported"));
       return;
     }
-    navigator.clipboard.writeText(A.join(" ")), toast.success(c("Classes copied to clipboard"));
+    navigator.clipboard.writeText(w.join(" ")), toast.success(c("Classes copied to clipboard"));
   };
   return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-y-1.5 border-b border-border pb-4", children: [
     /* @__PURE__ */ jsxs("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") }),
         /* @__PURE__ */ jsxs(Tooltip, { children: [
-          /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsx(CopyIcon, { onClick: B, className: "cursor-pointer" }) }),
+          /* @__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") }) })
         ] })
       ] }),
@@ -6533,12 +6533,12 @@ function ManualClasses() {
       /* @__PURE__ */ jsx("div", { className: "relative flex w-full items-center gap-x-3", children: /* @__PURE__ */ jsx(
         Autosuggest,
         {
-          suggestions: E,
-          onSuggestionsFetchRequested: w,
-          onSuggestionsClearRequested: S,
-          getSuggestionValue: k,
-          renderSuggestion: j,
-          inputProps: C,
+          suggestions: _,
+          onSuggestionsFetchRequested: A,
+          onSuggestionsClearRequested: v,
+          getSuggestionValue: C,
+          renderSuggestion: E,
+          inputProps: S,
           containerProps: {
             className: "relative h-8 w-full gap-y-1 py-1 border-border text-xs"
           },
@@ -6554,14 +6554,14 @@ function ManualClasses() {
         {
           variant: "outline",
           className: "h-6 border-border",
-          onClick: _,
+          onClick: B,
           disabled: x.trim() === "",
           size: "sm",
           children: /* @__PURE__ */ jsx(PlusIcon, {})
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "flex w-full flex-wrap gap-2 overflow-x-hidden", children: A.map(
+    /* @__PURE__ */ jsx("div", { className: "flex w-full flex-wrap gap-2 overflow-x-hidden", children: w.map(
       (T, P) => a === P ? /* @__PURE__ */ jsx(
         "input",
         {
@@ -6569,10 +6569,10 @@ function ManualClasses() {
           value: r,
           onChange: (L) => n(L.target.value),
           onBlur: () => {
-            v(T);
+            k(T);
           },
           onKeyDown: (L) => {
-            L.key === "Enter" && v(T);
+            L.key === "Enter" && k(T);
           },
           onFocus: (L) => {
             setTimeout(() => {
@@ -6832,306 +6832,6 @@ const CoreBlock = ({
       blocks: l.core
     }
   );
-}, hasVideoEmbed = (o) => {
-  const r = /(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^\/\n\s]+\/\S+\/|(?:v|e(?:mbed)?)\/|\S*?[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/, n = /(?:https?:\/\/)?(?:www\.)?(player)?.vimeo\.com/;
-  return r.test(o) || n.test(o);
-}, getVideoURLFromHTML = (o) => {
-  if (isEmpty(o)) return o;
-  const r = /<video[^>]+src=['"]([^'">]+)['"]/, n = /<iframe[^>]+src=['"]([^'">]+)['"]/, a = o.match(r), l = o.match(n), i = a ? a[1] : l ? l[1] : null, c = /(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^\/\n\s]+\/\S+\/|(?:v|e(?:mbed)?)\/|\S*?[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/, d = /(?:https?:\/\/)?(?:www\.)?player.vimeo\.com/;
-  return i && (c.test(i) || d.test(i)) ? i : o;
-}, NAME_ATTRIBUTES = ["chai-name", "data-chai-name"], ATTRIBUTE_MAP = {
-  img: { alt: "alt", width: "width", height: "height", src: "image" },
-  video: {
-    src: "url",
-    autoplay: "controls.autoPlay",
-    muted: "controls.muted",
-    loop: "controls.loop",
-    controls: "controls.widgets"
-  },
-  a: {
-    href: "link.href",
-    target: "link.target",
-    type: ""
-    // @TODO: Detect here what to url, email, phone, elementId
-  },
-  input: {
-    placeholder: "placeholder",
-    required: "required",
-    type: "inputType",
-    name: "fieldName"
-  },
-  textarea: {
-    placeholder: "placeholder",
-    required: "required",
-    type: "inputType",
-    name: "fieldName"
-  },
-  select: {
-    placeholder: "placeholder",
-    required: "required",
-    multiple: "multiple",
-    name: "fieldName"
-  },
-  form: {
-    action: "action"
-  }
-}, shouldAddText = (o, r) => o.children.length === 1 && includes(
-  ["Heading", "Paragraph", "Span", "ListItem", "Button", "Label", "TableCell", "Link", "RichText"],
-  r._type
-), getTextContent = (o) => o.map((r) => r.type === "text" ? get(r, "content", "") : isEmpty(r.children) ? "" : getTextContent(r.children)).join(""), getSanitizedValue = (o) => o === null ? "" : o, getHeightAndWidthFromClass = (o) => {
-  const r = compact(map(o.split(/\s+/), trim)), n = find(r, (d) => /^w-/.test(d)), a = find(r, (d) => /^h-/.test(d));
-  if (!a || !n) return { height: "", width: "" };
-  const l = (d) => {
-    if (!d) return;
-    const p = d.match(/^[wh]-(?:\[(.*?)\]|(.+))$/);
-    if (!p) return;
-    if (p[1]) return p[1];
-    const u = p[2];
-    return /^\d+(\.\d+)?$/.test(u) ? `${Number(u) * 4}px` : u === "auto" || includes(u, "%") ? u : "16px";
-  }, i = l(n), c = l(a);
-  return {
-    width: includes(i, "px") ? i : "16px",
-    height: includes(c, "px") ? c : "16px"
-  };
-}, getAttrs = (o) => {
-  if (o.tagName === "svg") return {};
-  const r = {}, n = ATTRIBUTE_MAP[o.tagName] || {}, a = o.attributes;
-  return forEach(a, ({ key: l, value: i }) => {
-    if (!includes(NAME_ATTRIBUTES, l))
-      if (n[l]) {
-        if (o.tagName === "img" && l === "src" && !i.startsWith("http")) {
-          const c = find(o.attributes, { key: "width" }), d = find(o.attributes, { key: "height" });
-          c && d ? i = `https://via.placeholder.com/${c == null ? void 0 : c.value}x${d == null ? void 0 : d.value}` : i = "https://via.placeholder.com/150x150";
-        }
-        set(r, n[l], getSanitizedValue(i));
-      } else includes(["style", "class", "srcset"], l) || (has(r, "styles_attrs") || (r.styles_attrs = {}), startsWith(l, "@") && (l = l.replace("@", "x-on:")), r.styles_attrs[`${l}`] = getSanitizedValue(i));
-  }), delete r.class, r;
-}, getStyles = (o, r = "styles") => {
-  if (!o.attributes) return { [r]: `${STYLES_KEY},` };
-  const n = find(o.attributes, { key: "class" });
-  if (n) {
-    const a = n.value;
-    return { [r]: `${STYLES_KEY},${a}` };
-  }
-  return { [r]: `${STYLES_KEY},` };
-}, getBlockProps = (o) => {
-  const r = get(o, "attributes", []), n = r.find((d) => d.key === "data-chai-richtext" || d.key === "chai-richtext"), a = r.find((d) => d.key === "data-chai-lightbox" || d.key === "chai-lightbox"), l = r.find((d) => d.key === "data-chai-dropdown" || d.key === "chai-dropdown"), i = r.find(
-    (d) => d.key === "data-chai-dropdown-button" || d.key === "chai-dropdown-button"
-  ), c = r.find(
-    (d) => d.key === "data-chai-dropdown-content" || d.key === "chai-dropdown-content"
-  );
-  if (l)
-    return { _type: "Dropdown" };
-  if (i)
-    return { _type: "DropdownButton" };
-  if (c)
-    return { _type: "DropdownContent" };
-  if (n)
-    return { _type: "RichText" };
-  if (a)
-    return { _type: "LightBoxLink" };
-  switch (o.tagName) {
-    // self closing tags
-    case "img":
-      return { _type: "Image" };
-    case "input":
-      return { _type: "Input", showLabel: !1 };
-    // showLabel: hiding default block label
-    case "hr":
-      return { _type: "Divider" };
-    case "br":
-      return { _type: "LineBreak" };
-    case "textarea":
-      return { _type: "TextArea", showLabel: !1 };
-    case "audio":
-      return { _type: "Audio" };
-    case "canvas":
-      return { _type: "Canvas" };
-    case "video":
-    case "iframe":
-      return { _type: "CustomHTML" };
-    case "svg":
-      return { _type: "Icon" };
-    // non self closing tags
-    // fixed structure
-    case "select":
-      return { _type: "Select", options: [] };
-    case "option":
-      return { _type: "Option" };
-    case "ul":
-    case "ol":
-    case "dl":
-      return {
-        _type: "List",
-        tag: o.tagName,
-        _listType: o.tagName === "ol" ? "list-decimal" : "list-none"
-      };
-    case "li":
-    case "dt":
-      return { _type: "ListItem", tag: o.tagName };
-    // non self closing tags
-    // free flow structure
-    case "span":
-    case "figcaption":
-    case "legend":
-      return { _type: "Span", tag: o.tagName };
-    case "p":
-      return { _type: "Paragraph", content: "" };
-    case "a":
-      return { _type: "Link" };
-    case "form":
-      return { _type: "Form" };
-    case "label":
-      return { _type: "Label" };
-    case "button":
-      return { _type: "Button" };
-    case "code":
-      return { _type: "Box", _name: "Code" };
-    case "h1":
-    case "h2":
-    case "h3":
-    case "h4":
-    case "h5":
-    case "h6":
-      return { _type: "Heading", tag: o.tagName };
-    case "table":
-      return { _type: "Table" };
-    case "tr":
-      return { _type: "TableRow" };
-    case "td":
-    case "th":
-      return { _type: "TableCell", tag: o.tagName };
-    case "thead":
-      return { _type: "TableHead" };
-    case "tbody":
-      return { _type: "TableBody" };
-    case "tfoot":
-      return { _type: "TableFooter" };
-    default: {
-      const d = get(o, "children", []).length > 0 ? "Box" : "EmptyBox";
-      return {
-        _type: d,
-        tag: o.tagName,
-        _name: d == "EmptyBox" || o.tagName === "div" ? d : capitalize(o.tagName)
-      };
-    }
-  }
-}, traverseNodes = (o, r = null) => flatMapDeep(o, (n) => {
-  var h, m, x, f, y, b, A, _, E, N;
-  if (n.type === "comment") return [];
-  let a = { _id: generateUUID() };
-  if (r && (a._parent = r.block._id), n.type === "text")
-    return isEmpty(get(n, "content", "")) ? [] : r && shouldAddText(r.node, r.block) ? (set(r, "block.content", get(n, "content", "")), []) : { ...a, _type: "Text", content: get(n, "content", "") };
-  const l = get(n, "attributes", []), i = l.find(
-    (w) => w.key === "data-chai-richtext" || w.key === "chai-richtext"
-  ), c = l.find(
-    (w) => w.key === "data-chai-lightbox" || w.key === "chai-lightbox"
-  ), d = l.find(
-    (w) => w.key === "data-chai-dropdown" || w.key === "chai-dropdown"
-  ), p = l.find(
-    (w) => w.key === "data-chai-dropdown-button" || w.key === "chai-dropdown-button"
-  ), u = l.find(
-    (w) => w.key === "data-chai-dropdown-content" || w.key === "chai-dropdown-content"
-  );
-  if (a = {
-    ...a,
-    ...getBlockProps(n),
-    ...getAttrs(n),
-    ...getStyles(n)
-  }, n.attributes) {
-    const w = n.attributes.find((S) => includes(NAME_ATTRIBUTES, S.key));
-    w && (a._name = w.value);
-  }
-  if (i)
-    return a.content = stringify(n.children), has(a, "styles_attrs.data-chai-richtext") && delete a.styles_attrs["data-chai-richtext"], has(a, "styles_attrs.chai-richtext") && delete a.styles_attrs["chai-richtext"], [a];
-  if (c) {
-    const w = [
-      "data-chai-lightbox",
-      "chai-lightbox",
-      "data-vbtype",
-      "data-autoplay",
-      "data-maxwidth",
-      "data-overlay",
-      "data-gall",
-      "href"
-    ];
-    a = {
-      ...a,
-      href: ((h = l.find((S) => S.key === "href")) == null ? void 0 : h.value) || "",
-      hrefType: ((m = l.find((S) => S.key === "data-vbtype")) == null ? void 0 : m.value) || "video",
-      autoplay: ((x = l.find((S) => S.key === "data-autoplay")) == null ? void 0 : x.value) === "true" ? "true" : "false",
-      maxWidth: ((y = (f = l.find((S) => S.key === "data-maxwidth")) == null ? void 0 : f.value) == null ? void 0 : y.replace("px", "")) || "",
-      backdropColor: ((b = l.find((S) => S.key === "data-overlay")) == null ? void 0 : b.value) || "",
-      galleryName: ((A = l.find((S) => S.key === "data-gall")) == null ? void 0 : A.value) || ""
-    }, forEach(w, (S) => {
-      has(a, `styles_attrs.${S}`) && delete a.styles_attrs[S];
-    });
-  }
-  if (d && (delete a.styles_attrs, a.showDropdown = !1), u && delete a.styles_attrs, p) {
-    delete a.styles_attrs;
-    const w = filter(n.children || [], (k) => (k == null ? void 0 : k.tagName) !== "span");
-    a.content = getTextContent(w);
-    const S = find(
-      n.children || [],
-      (k) => (k == null ? void 0 : k.tagName) === "span" && some(k.children || [], (j) => (j == null ? void 0 : j.tagName) === "svg")
-    );
-    if (S) {
-      const k = find(S.children || [], (j) => (j == null ? void 0 : j.tagName) === "svg");
-      if (k) {
-        a.icon = stringify([k]);
-        const { height: j, width: C } = getSvgDimensions(k, "16px", "16px");
-        a.iconHeight = j, a.iconWidth = C;
-      }
-    }
-    return [a];
-  }
-  if (a._type === "Input") {
-    const w = a.inputType || "text";
-    w === "checkbox" ? set(a, "_type", "Checkbox") : w === "radio" && set(a, "_type", "Radio");
-  } else if (n.tagName === "video" || n.tagName === "iframe") {
-    const w = stringify([n]);
-    return hasVideoEmbed(w) && (set(a, "_type", "Video"), set(a, "url", getVideoURLFromHTML(w)), set(a, "styles", `${STYLES_KEY},`), set(a, "controls", { autoPlay: !1, muted: !0, loop: !1, controls: !1 })), a.content = w, [a];
-  } else if (n.tagName === "svg") {
-    const w = get(find(n.attributes, { key: "class" }), "value", ""), { height: S, width: k } = getHeightAndWidthFromClass(w);
-    if (S && k)
-      a.styles = `${STYLES_KEY}, ${cn$2(`w-${k} h-${S}`, w)}`.trim(), a.height = S == null ? void 0 : S.replace("px", ""), a.width = k == null ? void 0 : k.replace("px", "");
-    else {
-      const j = (_ = find(n.attributes, { key: "height" })) == null ? void 0 : _.value, C = (E = find(n.attributes, { key: "width" })) == null ? void 0 : E.value;
-      j && C ? (a.styles = `${STYLES_KEY}, ${cn$2(`w-[${C}px] h-[${j}px]`, w)}`.trim(), a.height = j, a.width = C) : a.styles = `${STYLES_KEY}, ${cn$2("w-full h-full", w)}`.trim();
-    }
-    return n.attributes = filter(n.attributes, (j) => !includes(["style", "width", "height", "class"], j.key)), a.icon = stringify([n]), [a];
-  } else if (n.tagName == "option" && r && ((N = r.block) == null ? void 0 : N._type) === "Select")
-    return r.block.options.push({
-      label: getTextContent(n.children),
-      ...getAttrs(n)
-    }), [];
-  const g = traverseNodes(n.children, { block: a, node: n });
-  return [a, ...g];
-}), getSvgDimensions = (o, r, n) => {
-  var p, u;
-  const a = get(o, "attributes", []), { height: l, width: i } = getHeightAndWidthFromClass(
-    get(find(a, { key: "class" }), "value", "")
-  );
-  if (l && i)
-    return {
-      height: `[${l}px]`,
-      width: `[${i}px]`
-    };
-  const c = (p = find(a, { key: "height" })) == null ? void 0 : p.value, d = (u = find(a, { key: "width" })) == null ? void 0 : u.value;
-  return {
-    height: c ? `[${c}px]` : n,
-    width: d ? `[${d}px]` : r
-  };
-}, getSanitizedHTML = (o) => {
-  o = o.replace(/(\w+)=\\?"(.*?)\\?"/g, (a, l, i) => {
-    let c = i.replace(/\\"/g, '"');
-    return c = c.replace(/{([^}]+)}/g, (d) => d.replace(/"/g, '\\"')), `${l}="${c.replace(/\\"/g, '"')}"`;
-  }), o = o.replace(/\\n/g, "").replace(/\\\\/g, "").replace(/\\([/<>])/g, "$1").replace(/\\./g, "").replace(/[\n\r\t\f\v]/g, ""), o = o.replace(/\$name="[^"]*"/g, "");
-  const r = o.match(/<body[^>]*>[\s\S]*?<\/body>/);
-  return (r && r.length > 0 ? r[0].replace(/<body/, "<div").replace(/<\/body>/, "</div>") : o).replace(/\s+/g, " ").replaceAll("> <", "><").replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, "").trim();
-}, getBlocksFromHTML = (o) => {
-  const r = parse(getSanitizedHTML(o));
-  return isEmpty(o) ? [] : flatten(traverseNodes(r));
 }, ImportHTML = ({ parentId: o, position: r }) => {
   const { t: n } = useTranslation(), [a, l] = useState(""), { addPredefinedBlock: i } = useAddBlock(), c = () => {
     const d = getBlocksFromHTML(a);
@@ -7216,18 +6916,18 @@ const registerChaiLibrary = (o, r) => {
   parentId: n = void 0,
   position: a = -1
 }) => {
-  const [l, i] = useState(!1), c = useMemo(() => (r == null ? void 0 : r.getBlock) || (() => []), [r]), { addCoreBlock: d, addPredefinedBlock: p } = useAddBlock(), [, u] = useSelectedBlockIds(), { clearHighlight: g } = useBlockHighlight(), h = get(o, "name", get(o, "label")), m = get(o, "description", ""), x = useFeature("dnd"), [, f] = useAtom$1(draggedBlockAtom), y = (_) => {
-    const E = has(_, "styles_attrs.data-page-section");
-    return _._type === "Box" && E;
+  const [l, i] = useState(!1), c = useMemo(() => (r == null ? void 0 : r.getBlock) || (() => []), [r]), { addCoreBlock: d, addPredefinedBlock: p } = useAddBlock(), [, u] = useSelectedBlockIds(), { clearHighlight: g } = useBlockHighlight(), h = get(o, "name", get(o, "label")), m = get(o, "description", ""), x = useFeature("dnd"), [, f] = useAtom$1(draggedBlockAtom), y = (B) => {
+    const _ = has(B, "styles_attrs.data-page-section");
+    return B._type === "Box" && _;
   }, b = useCallback(
-    async (_) => {
-      if (_.stopPropagation(), has(o, "component")) {
+    async (B) => {
+      if (B.stopPropagation(), has(o, "component")) {
         d(o, n, a), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
         return;
       }
       i(!0);
-      let E = await c({ library: r, block: o });
-      typeof E == "string" && (E = getBlocksFromHTML(E)), isEmpty(E) || p(syncBlocksWithDefaults(E), n, a), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
+      let _ = await c({ library: r, block: o });
+      typeof _ == "string" && (_ = getBlocksFromHTML(_)), isEmpty(_) || p(syncBlocksWithDefaults(_), n, a), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
     },
     [d, p, o, c, r, n, a]
   );
@@ -7238,19 +6938,19 @@ const registerChaiLibrary = (o, r) => {
         onClick: l ? () => {
         } : b,
         draggable: x ? "true" : "false",
-        onDragStart: async (_) => {
-          const E = await c({ library: r, block: o });
+        onDragStart: async (B) => {
+          const _ = await c({ library: r, block: o });
           let N = n;
-          if (y(first(E)) && (N = null), !isEmpty(E)) {
-            const w = { blocks: E, uiLibrary: !0, parent: N };
-            if (_.dataTransfer.setData("text/plain", JSON.stringify(w)), o.preview) {
-              const S = new Image();
-              S.src = o.preview, S.onload = () => {
-                _.dataTransfer.setDragImage(S, 0, 0);
+          if (y(first(_)) && (N = null), !isEmpty(_)) {
+            const A = { blocks: _, uiLibrary: !0, parent: N };
+            if (B.dataTransfer.setData("text/plain", JSON.stringify(A)), o.preview) {
+              const v = new Image();
+              v.src = o.preview, v.onload = () => {
+                B.dataTransfer.setDragImage(v, 0, 0);
               };
             } else
-              _.dataTransfer.setDragImage(new Image(), 0, 0);
-            f(w), setTimeout(() => {
+              B.dataTransfer.setDragImage(new Image(), 0, 0);
+            f(A), setTimeout(() => {
               u([]), g(), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
             }, 200);
           }
@@ -7276,7 +6976,7 @@ const registerChaiLibrary = (o, r) => {
     ] }) })
   ] });
 }, UILibrarySection = ({ parentId: o, position: r }) => {
-  const [n, a] = useSelectedLibrary(), l = useChaiLibraries(), i = l.find((v) => v.id === n) || first(l), { data: c, isLoading: d, resetLibrary: p } = useLibraryBlocks(i), [u, g] = useState(""), [h, m] = useState([]), x = useRef(null);
+  const [n, a] = useSelectedLibrary(), l = useChaiLibraries(), i = l.find((k) => k.id === n) || first(l), { data: c, isLoading: d, resetLibrary: p } = useLibraryBlocks(i), [u, g] = useState(""), [h, m] = useState([]), x = useRef(null);
   useEffect(() => {
     c && c.length > 0 && (x.current = new Fuse(c, {
       keys: ["name", "label", "description", "group"],
@@ -7288,27 +6988,27 @@ const registerChaiLibrary = (o, r) => {
       m([]);
       return;
     }
-    const v = x.current.search(u).map((B) => B.item);
-    m(v);
+    const k = x.current.search(u).map((j) => j.item);
+    m(k);
   }, [u]);
-  const f = u.trim() && !isEmpty(h) ? h : c, y = groupBy(f, "group"), [b, A] = useState(null);
+  const f = u.trim() && !isEmpty(h) ? h : c, y = groupBy(f, "group"), [b, w] = useState(null);
   useEffect(() => {
     if (isEmpty(keys(y))) {
-      A(null);
+      w(null);
       return;
     }
     if (!b || !y[b]) {
-      A(first(keys(y)));
+      w(first(keys(y)));
       return;
     }
   }, [y, b]);
-  const _ = get(y, b, []), E = useRef(null), { t: N } = useTranslation(), w = (v) => {
-    E.current && (clearTimeout(E.current), E.current = null), E.current = setTimeout(() => {
-      E.current && A(v);
+  const B = get(y, b, []), _ = useRef(null), { t: N } = useTranslation(), A = (k) => {
+    _.current && (clearTimeout(_.current), _.current = null), _.current = setTimeout(() => {
+      _.current && w(k);
     }, 400);
-  }, S = () => {
+  }, v = () => {
     i != null && i.id && p(i.id);
-  }, k = () => {
+  }, C = () => {
     g("");
   };
   if (d)
@@ -7316,7 +7016,7 @@ const registerChaiLibrary = (o, r) => {
       /* @__PURE__ */ jsx(Skeleton, { className: "col-span-3 h-full" }),
       /* @__PURE__ */ jsx(Skeleton, { className: "col-span-9 h-full" })
     ] });
-  const j = filter(_, (v, B) => B % 2 === 0), C = filter(_, (v, B) => B % 2 === 1);
+  const E = filter(B, (k, j) => j % 2 === 0), S = filter(B, (k, 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(Search, { className: "absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" }),
@@ -7325,14 +7025,14 @@ const registerChaiLibrary = (o, r) => {
         {
           placeholder: N("Search blocks..."),
           value: u,
-          onChange: (v) => g(v.target.value),
+          onChange: (k) => g(k.target.value),
           className: "w-full pl-8 pr-8"
         }
       ),
       u && /* @__PURE__ */ jsx(
         "button",
         {
-          onClick: k,
+          onClick: C,
           className: "absolute right-2 top-2.5 text-muted-foreground hover:text-foreground",
           children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
         }
@@ -7346,56 +7046,56 @@ const registerChaiLibrary = (o, r) => {
           /* @__PURE__ */ jsx("hr", { className: "mt-1 border-border" }),
           /* @__PURE__ */ jsx("div", { className: "no-scrollbar mt-2 h-full max-h-full flex-1 overflow-y-auto pb-20", children: isEmpty(y) ? /* @__PURE__ */ jsx("div", { className: "mt-4 flex flex-col items-center justify-center gap-3 p-4 text-center", children: u ? /* @__PURE__ */ jsx("p", { className: "text-sm", children: N("No matching blocks found") }) : /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx("p", { className: "text-sm", children: N("Failed to load the UI library. Try again") }),
-            /* @__PURE__ */ jsxs(Button, { onClick: S, variant: "outline", size: "sm", className: "gap-2", children: [
+            /* @__PURE__ */ jsxs(Button, { onClick: v, variant: "outline", size: "sm", className: "gap-2", children: [
               /* @__PURE__ */ jsx(RefreshCw, { className: "h-4 w-4" }),
               N("Retry")
             ] })
-          ] }) }) : map(y, (v, B) => /* @__PURE__ */ jsxs(
+          ] }) }) : map(y, (k, j) => /* @__PURE__ */ jsxs(
             "div",
             {
-              onMouseEnter: () => w(B),
-              onMouseLeave: () => clearTimeout(E.current),
+              onMouseEnter: () => A(j),
+              onMouseLeave: () => clearTimeout(_.current),
               role: "button",
-              onClick: () => A(B),
+              onClick: () => w(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",
-                B === b ? "bg-primary text-primary-foreground hover:bg-primary/80" : ""
+                j === b ? "bg-primary text-primary-foreground hover:bg-primary/80" : ""
               ),
               children: [
-                /* @__PURE__ */ jsx("span", { children: capitalize(N(B.toLowerCase())) }),
+                /* @__PURE__ */ jsx("span", { children: capitalize(N(j.toLowerCase())) }),
                 /* @__PURE__ */ jsx(CaretRightIcon, { className: "ml-2 h-5 w-5" })
               ]
             },
-            B
+            j
           )) })
         ] })
       ] }),
       /* @__PURE__ */ jsx("div", { className: "flex h-full max-h-full w-full flex-col border-l border-border", children: /* @__PURE__ */ jsxs(
         ScrollArea,
         {
-          onMouseEnter: () => E.current ? clearTimeout(E.current) : null,
+          onMouseEnter: () => _.current ? clearTimeout(_.current) : null,
           className: "z-10 flex h-full max-h-full w-full flex-col gap-2 transition-all ease-linear",
           children: [
-            isEmpty(_) && !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: N("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: j.map((v, B) => /* @__PURE__ */ jsx(
+            isEmpty(B) && !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: N("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: E.map((k, j) => /* @__PURE__ */ jsx(
                 BlockCard,
                 {
                   parentId: o,
                   position: r,
-                  block: v,
+                  block: k,
                   library: i
                 },
-                `block-${B}`
+                `block-${j}`
               )) }),
-              /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1", children: C.map((v, B) => /* @__PURE__ */ jsx(
+              /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1", children: S.map((k, j) => /* @__PURE__ */ jsx(
                 BlockCard,
                 {
                   parentId: o,
                   position: r,
-                  block: v,
+                  block: k,
                   library: i
                 },
-                `block-second-${B}`
+                `block-second-${j}`
               )) })
             ] }),
             /* @__PURE__ */ jsx("br", {}),
@@ -7432,14 +7132,14 @@ const registerChaiLibrary = (o, r) => {
         }), g(!0);
       else if (!l && Object.keys(a || {}).length > 0) {
         const m = Object.entries(a).map(([f, y]) => {
-          const b = y, A = b.type || "partial", _ = formatReadableName(A);
+          const b = y, w = b.type || "partial", B = formatReadableName(w);
           return {
             type: "PartialBlock",
             // Set the type to PartialBlock
             label: formatReadableName(b.name || f),
             description: b.description || "",
             icon: Globe,
-            group: _,
+            group: B,
             // Use formatted type as group
             category: "partial",
             partialBlockId: f,
@@ -7494,44 +7194,44 @@ const registerChaiLibrary = (o, r) => {
 }, ADD_BLOCK_TABS = {}, registerChaiAddBlockTab = (o, r) => {
   has(ADD_BLOCK_TABS, o) && console.warn(`Add block tab with id ${o} already registered`), set(ADD_BLOCK_TABS, o, { id: o, ...r });
 }, useChaiAddBlockTabs = () => useMemo(() => values(ADD_BLOCK_TABS), []), CORE_GROUPS = ["basic", "typography", "media", "layout", "form", "advanced", "other"], ChaiBuilderBlocks = ({ groups: o, blocks: r, parentId: n, position: a, gridCols: l = "grid-cols-4" }) => {
-  var C;
-  const { t: i } = useTranslation(), [c] = useBlocksStore(), [d, p] = useState(""), u = useRef(null), [g] = useAtom$1(addBlockTabAtom), h = (C = find(c, (v) => v._id === n)) == null ? void 0 : C._type, [m, x] = useState("all"), [f, y] = useState(null), b = useRef(null);
+  var S;
+  const { t: i } = useTranslation(), [c] = useBlocksStore(), [d, p] = useState(""), u = useRef(null), [g] = useAtom$1(addBlockTabAtom), h = (S = find(c, (k) => k._id === n)) == null ? void 0 : S._type, [m, x] = useState("all"), [f, y] = useState(null), b = useRef(null);
   useEffect(() => {
-    const v = setTimeout(() => {
-      var B;
-      (B = u.current) == null || B.focus();
+    const k = setTimeout(() => {
+      var j;
+      (j = u.current) == null || j.focus();
     }, 0);
-    return () => clearTimeout(v);
+    return () => clearTimeout(k);
   }, [g]), useEffect(() => {
     d && (x("all"), y(null));
-  }, [d]), useEffect(() => (b.current = debounce((v) => {
-    x(v);
+  }, [d]), useEffect(() => (b.current = debounce((k) => {
+    x(k);
   }, 500), () => {
     b.current && b.current.cancel();
   }), []);
-  const A = useCallback((v) => {
-    y(v), b.current && b.current(v);
-  }, []), _ = useCallback(() => {
+  const w = useCallback((k) => {
+    y(k), b.current && b.current(k);
+  }, []), B = useCallback(() => {
     y(null), b.current && b.current.cancel();
-  }, []), E = useCallback((v) => {
-    b.current && b.current.cancel(), x(v), y(null);
+  }, []), _ = useCallback((k) => {
+    b.current && b.current.cancel(), x(k), y(null);
   }, []), N = useMemo(
     () => d ? values(r).filter(
-      (v) => {
-        var B, I;
-        return (((B = v.label) == null ? void 0 : B.toLowerCase()) + " " + ((I = v.type) == null ? void 0 : I.toLowerCase())).includes(d.toLowerCase());
+      (k) => {
+        var j, I;
+        return (((j = k.label) == null ? void 0 : j.toLowerCase()) + " " + ((I = k.type) == null ? void 0 : I.toLowerCase())).includes(d.toLowerCase());
       }
     ) : r,
     [r, d]
-  ), w = useMemo(
+  ), A = useMemo(
     () => d ? o.filter(
-      (v) => reject(filter(values(N), { group: v }), { hidden: !0 }).length > 0
-    ) : o.filter((v) => reject(filter(values(r), { group: v }), { hidden: !0 }).length > 0),
+      (k) => reject(filter(values(N), { group: k }), { hidden: !0 }).length > 0
+    ) : o.filter((k) => reject(filter(values(r), { group: k }), { hidden: !0 }).length > 0),
     [r, N, o, d]
-  ), S = useMemo(
-    () => sortBy(w, (v) => CORE_GROUPS.indexOf(v) === -1 ? 99 : CORE_GROUPS.indexOf(v)),
-    [w]
-  ), k = useMemo(() => m === "all" ? N : filter(values(N), { group: m }), [N, m]), j = useMemo(() => m === "all" ? S : [m], [S, m]);
+  ), v = useMemo(
+    () => sortBy(A, (k) => CORE_GROUPS.indexOf(k) === -1 ? 99 : CORE_GROUPS.indexOf(k)),
+    [A]
+  ), C = useMemo(() => m === "all" ? N : filter(values(N), { group: m }), [N, m]), E = useMemo(() => m === "all" ? v : [m], [v, m]);
   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(
       Input$1,
@@ -7541,55 +7241,55 @@ const registerChaiLibrary = (o, r) => {
         placeholder: i("Search blocks..."),
         value: d,
         className: "-ml-2",
-        onChange: (v) => p(v.target.value)
+        onChange: (k) => p(k.target.value)
       }
     ) }),
     /* @__PURE__ */ jsxs("div", { className: "sticky top-10 flex h-[calc(100%-48px)] overflow-hidden", children: [
-      S.length > 0 && /* @__PURE__ */ jsx("div", { className: "w-1/4 min-w-[120px] border-r border-border", children: /* @__PURE__ */ jsx(ScrollArea, { className: "h-full", children: /* @__PURE__ */ jsxs("div", { className: "space-y-1 p-2", children: [
+      v.length > 0 && /* @__PURE__ */ jsx("div", { className: "w-1/4 min-w-[120px] border-r border-border", children: /* @__PURE__ */ jsx(ScrollArea, { className: "h-full", children: /* @__PURE__ */ jsxs("div", { className: "space-y-1 p-2", children: [
         /* @__PURE__ */ jsx(
           "button",
           {
-            onClick: () => E("all"),
-            onMouseEnter: () => A("all"),
-            onMouseLeave: _,
+            onClick: () => _("all"),
+            onMouseEnter: () => w("all"),
+            onMouseLeave: B,
             className: `w-full rounded-md px-2 py-1.5 text-left text-sm font-medium ${m === "all" || f === "all" ? "bg-primary text-primary-foreground" : "hover:bg-primary/50 hover:text-primary-foreground"}`,
             children: i("All")
           },
           "sidebar-all"
         ),
-        S.map((v) => /* @__PURE__ */ jsx(
+        v.map((k) => /* @__PURE__ */ jsx(
           "button",
           {
-            onClick: () => E(v),
-            onMouseEnter: () => A(v),
-            onMouseLeave: _,
-            className: `w-full rounded-md px-2 py-1.5 text-left text-sm ${m === v || f === v ? "bg-primary text-primary-foreground" : "hover:bg-primary/50 hover:text-primary-foreground"}`,
-            children: capitalize(i(v.toLowerCase()))
+            onClick: () => _(k),
+            onMouseEnter: () => w(k),
+            onMouseLeave: B,
+            className: `w-full rounded-md px-2 py-1.5 text-left text-sm ${m === k || f === k ? "bg-primary text-primary-foreground" : "hover:bg-primary/50 hover:text-primary-foreground"}`,
+            children: capitalize(i(k.toLowerCase()))
           },
-          `sidebar-${v}`
+          `sidebar-${k}`
         ))
       ] }) }) }),
-      /* @__PURE__ */ jsx("div", { className: "h-full w-3/4 flex-1 overflow-hidden", children: /* @__PURE__ */ jsx(ScrollArea, { id: "add-blocks-scroll-area", className: "no-scrollbar mr-4 h-full", children: w.length === 0 && d ? /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center justify-center p-8 text-center text-muted-foreground", children: /* @__PURE__ */ jsxs("p", { children: [
+      /* @__PURE__ */ jsx("div", { className: "h-full w-3/4 flex-1 overflow-hidden", children: /* @__PURE__ */ jsx(ScrollArea, { id: "add-blocks-scroll-area", className: "no-scrollbar mr-4 h-full", children: A.length === 0 && d ? /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center justify-center p-8 text-center text-muted-foreground", children: /* @__PURE__ */ jsxs("p", { children: [
         i("No blocks found matching"),
         ' "',
         d,
         '"'
-      ] }) }) : /* @__PURE__ */ jsx("div", { className: "space-y-6 p-4", children: j.map((v) => /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
-        /* @__PURE__ */ jsx("h3", { className: "px-1 text-sm font-medium", children: capitalize(i(v.toLowerCase())) }),
+      ] }) }) : /* @__PURE__ */ jsx("div", { className: "space-y-6 p-4", children: E.map((k) => /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+        /* @__PURE__ */ jsx("h3", { className: "px-1 text-sm font-medium", children: capitalize(i(k.toLowerCase())) }),
         /* @__PURE__ */ jsx("div", { className: "grid gap-2 " + l, children: reject(
-          m === "all" ? filter(values(k), { group: v }) : values(k),
+          m === "all" ? filter(values(C), { group: k }) : values(C),
           { hidden: !0 }
-        ).map((B) => /* @__PURE__ */ jsx(
+        ).map((j) => /* @__PURE__ */ jsx(
           CoreBlock,
           {
             parentId: n,
             position: a,
-            block: B,
-            disabled: !canAcceptChildBlock(h, B.type) || !canBeNestedInside(h, B.type)
+            block: j,
+            disabled: !canAcceptChildBlock(h, j.type) || !canBeNestedInside(h, j.type)
           },
-          B.type
+          j.type
         )) })
-      ] }, v)) }) }) })
+      ] }, k)) }) }) })
     ] })
   ] });
 }, addBlockTabAtom = atomWithStorage("__add_block_tab", "library"), AddBlocksPanel = ({
@@ -7615,8 +7315,8 @@ const registerChaiLibrary = (o, r) => {
     /* @__PURE__ */ jsxs(
       Tabs,
       {
-        onValueChange: (A) => {
-          d(""), c(A);
+        onValueChange: (w) => {
+          d(""), c(w);
         },
         value: i,
         className: "flex h-full max-h-full flex-col overflow-hidden",
@@ -7626,13 +7326,13 @@ const registerChaiLibrary = (o, r) => {
             /* @__PURE__ */ jsx(TabsTrigger, { value: "core", children: l("Blocks") }),
             g && /* @__PURE__ */ jsx(TabsTrigger, { value: "partials", children: l("Partials") }),
             f ? /* @__PURE__ */ jsx(TabsTrigger, { value: "html", children: l("Import") }) : null,
-            map(x, (A) => /* @__PURE__ */ jsx(TabsTrigger, { value: A.id, children: React__default.createElement(A.tab) }, `tab-add-block-${A.id}`))
+            map(x, (w) => /* @__PURE__ */ jsx(TabsTrigger, { value: w.id, children: React__default.createElement(w.tab) }, `tab-add-block-${w.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: n, position: a }) }) }) }),
           b && /* @__PURE__ */ jsx(TabsContent, { value: "library", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx(UILibrariesPanel, { parentId: n, 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: n, position: a }) }) }) }),
           f ? /* @__PURE__ */ jsx(TabsContent, { value: "html", className: "h-full max-h-full flex-1 pb-20", children: /* @__PURE__ */ jsx(ImportHTML, { parentId: n, position: a }) }) : null,
-          map(x, (A) => /* @__PURE__ */ jsx(TabsContent, { value: A.id, children: React__default.createElement(A.tabContent, { close: m, parentId: n, position: a }) }, `panel-add-block-${A.id}`))
+          map(x, (w) => /* @__PURE__ */ jsx(TabsContent, { value: w.id, children: React__default.createElement(w.tabContent, { close: m, parentId: n, position: a }) }, `panel-add-block-${w.id}`))
         ]
       }
     )
@@ -7942,19 +7642,19 @@ const Input = ({ node: o }) => {
   var P;
   const { t: a } = useTranslation(), [l, , i] = useHiddenBlockIds(), [c] = useAtom$1(canvasIframeAtom), { hasPermission: d } = usePermissions();
   let p = null;
-  const u = o.children.length > 0, { highlightBlock: g, clearHighlight: h } = useBlockHighlight(), { id: m, data: x, isSelected: f, willReceiveDrop: y, isDragging: b, isEditing: A, handleClick: _ } = o, E = (L) => {
+  const u = o.children.length > 0, { highlightBlock: g, clearHighlight: h } = useBlockHighlight(), { id: m, data: x, isSelected: f, willReceiveDrop: y, isDragging: b, isEditing: w, handleClick: B } = o, _ = (L) => {
     L.stopPropagation(), !l.includes(m) && o.toggle();
   }, N = (L) => {
     L.isInternal && (p = L.isOpen, L.isOpen && L.close());
-  }, w = (L) => {
+  }, A = (L) => {
     L.isInternal && p !== null && (p ? L.open() : L.close(), p = null);
-  }, [S, k] = useAtom$1(currentAddSelection), j = () => {
+  }, [v, C] = useAtom$1(currentAddSelection), E = () => {
     var L;
-    C(), o.parent.isSelected || k((L = o == null ? void 0 : o.parent) == null ? void 0 : L.id);
-  }, C = () => {
-    k(null);
-  }, v = (L) => {
-    C(), L.stopPropagation(), !o.isOpen && !l.includes(m) && o.toggle(), _(L);
+    S(), o.parent.isSelected || C((L = o == null ? void 0 : o.parent) == null ? void 0 : L.id);
+  }, S = () => {
+    C(null);
+  }, k = (L) => {
+    S(), L.stopPropagation(), !o.isOpen && !l.includes(m) && o.toggle(), B(L);
   };
   useEffect(() => {
     const L = setTimeout(() => {
@@ -7962,13 +7662,13 @@ const Input = ({ node: o }) => {
     }, 500);
     return () => clearTimeout(L);
   }, [y, o, b]);
-  const B = (L, D) => {
+  const j = (L, D) => {
     const R = c.contentDocument || c.contentWindow.document, M = R.querySelector(`[data-block-id=${L}]`);
     M && M.setAttribute("data-drop", D);
     const $ = M.getBoundingClientRect(), O = c.getBoundingClientRect();
     $.top >= O.top && $.left >= O.left && $.bottom <= O.bottom && $.right <= O.right || (R.documentElement.scrollTop = M.offsetTop - O.top);
   }, I = (L) => {
-    C();
+    S();
     const D = get(o, "parent.id");
     D !== "__REACT_ARBORIST_INTERNAL_ROOT__" ? pubsub.publish(CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK, { _id: D, position: L }) : pubsub.publish(CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK, { position: L });
   };
@@ -7996,20 +7696,20 @@ const Input = ({ node: o }) => {
     {
       onMouseEnter: () => g(m),
       onMouseLeave: () => h(),
-      onClick: v,
+      onClick: k,
       style: r,
       "data-node-id": m,
       ref: l.includes(m) ? null : n,
       onDragStart: () => N(o),
-      onDragEnd: () => w(o),
+      onDragEnd: () => A(o),
       onDragOver: (L) => {
-        L.preventDefault(), B(m, "yes");
+        L.preventDefault(), j(m, "yes");
       },
       onDragLeave: (L) => {
-        L.preventDefault(), B(m, "no");
+        L.preventDefault(), j(m, "no");
       },
       onDrop: (L) => {
-        L.preventDefault(), B(m, "no");
+        L.preventDefault(), j(m, "no");
       },
       children: [
         d(PERMISSIONS.ADD_BLOCK) && (o == null ? void 0 : o.rowIndex) > 0 && (o.parent.isOpen && canAddChildBlock(get(o, "parent.data._type")) || ((P = o == null ? void 0 : o.parent) == null ? void 0 : P.id) === "__REACT_ARBORIST_INTERNAL_ROOT__") && /* @__PURE__ */ jsx("div", { className: "group relative ml-5 h-full w-full cursor-pointer", children: /* @__PURE__ */ jsx(
@@ -8018,8 +7718,8 @@ const Input = ({ node: o }) => {
             onClick: (L) => {
               L.stopPropagation(), I(o.childIndex);
             },
-            onMouseEnter: j,
-            onMouseLeave: C,
+            onMouseEnter: E,
+            onMouseLeave: S,
             className: "absolute -top-0.5 h-1 w-[90%] rounded bg-primary opacity-0 delay-200 duration-200 group-hover:opacity-100",
             children: /* @__PURE__ */ jsx("div", { className: "absolute left-1/2 top-1/2 flex h-4 w-4 -translate-x-1/2 -translate-y-1/2 transform items-center justify-center rounded-full bg-primary p-1 outline outline-2 outline-white hover:bg-primary", children: /* @__PURE__ */ jsx(PlusIcon, { className: "h-3 w-3 stroke-[4] text-white" }) })
           }
@@ -8031,7 +7731,7 @@ const Input = ({ node: o }) => {
               "group flex w-full cursor-pointer items-center justify-between space-x-px !rounded p-1 outline-none",
               f ? "bg-primary text-primary-foreground" : "hover:bg-primary/10 dark:hover:bg-gray-800",
               y && canAcceptChildBlock(x._type, "Icon") ? "bg-green-200" : "",
-              (o == null ? void 0 : o.id) === S ? "bg-primary/10" : "",
+              (o == null ? void 0 : o.id) === v ? "bg-primary/10" : "",
               b && "opacity-20",
               l.includes(m) ? "opacity-50" : "",
               T && f && "bg-primary/20 text-primary"
@@ -8042,7 +7742,7 @@ const Input = ({ node: o }) => {
                   "div",
                   {
                     className: `flex h-4 w-4 rotate-0 transform cursor-pointer items-center justify-center transition-transform duration-100 ${o.isOpen ? "rotate-90" : ""}`,
-                    children: u && /* @__PURE__ */ jsx("button", { onClick: E, type: "button", children: /* @__PURE__ */ jsx(ChevronRight, { className: `h-3 w-3 stroke-[3] ${f ? "text-white" : "text-slate-400"}` }) })
+                    children: u && /* @__PURE__ */ jsx("button", { onClick: _, type: "button", children: /* @__PURE__ */ jsx(ChevronRight, { className: `h-3 w-3 stroke-[3] ${f ? "text-white" : "text-slate-400"}` }) })
                   }
                 ),
                 /* @__PURE__ */ jsxs(
@@ -8055,7 +7755,7 @@ const Input = ({ node: o }) => {
                     ),
                     children: [
                       /* @__PURE__ */ jsx(TypeIcon, { type: x == null ? void 0 : x._type }),
-                      A ? /* @__PURE__ */ jsx(Input, { node: o }) : /* @__PURE__ */ jsx(
+                      w ? /* @__PURE__ */ jsx(Input, { node: o }) : /* @__PURE__ */ jsx(
                         "div",
                         {
                           className: "ml-1.5 flex items-center gap-x-1 truncate text-[13px]",
@@ -8526,23 +8226,23 @@ const Input = ({ node: o }) => {
 }, ThemeConfigPanel = React.memo(({ className: o = "" }) => {
   const [r, n] = useDarkMode(), [a, l] = React.useState(""), [i, c] = React.useState(!1), d = useBuilderProp("themePresets", []), p = useBuilderProp("themePanelComponent", null), { hasPermission: u } = usePermissions();
   if (d) {
-    const w = d.map((S) => Object.keys(S)[0]);
-    DEFAULT_THEME_PRESET.forEach((S) => {
-      const k = Object.keys(S)[0];
-      w.includes(k) || d.push(S);
+    const A = d.map((v) => Object.keys(v)[0]);
+    DEFAULT_THEME_PRESET.forEach((v) => {
+      const C = Object.keys(v)[0];
+      A.includes(C) || d.push(v);
     });
   }
   const [g, h] = useTheme(), m = useThemeOptions(), { t: x } = useTranslation(), f = React.useCallback(
-    (w) => {
-      const S = { ...g };
-      setPreviousTheme(S), h(w), toast.success("Theme updated", {
+    (A) => {
+      const v = { ...g };
+      setPreviousTheme(v), h(A), toast.success("Theme updated", {
         action: {
           label: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ jsx(Undo$1, { className: "h-4 w-4" }),
             " Undo"
           ] }),
           onClick: () => {
-            h(S), clearPreviousTheme(), toast.dismiss();
+            h(v), clearPreviousTheme(), toast.dismiss();
           }
         },
         closeButton: !0,
@@ -8551,61 +8251,61 @@ const Input = ({ node: o }) => {
     },
     [g, h]
   ), y = () => {
-    const w = d.find((S) => Object.keys(S)[0] === a);
-    if (w) {
-      const S = Object.values(w)[0];
-      S && typeof S == "object" && "fontFamily" in S && "borderRadius" in S && "colors" in S ? (f(S), l("")) : console.error("Invalid preset structure:", S);
+    const A = d.find((v) => Object.keys(v)[0] === a);
+    if (A) {
+      const v = Object.values(A)[0];
+      v && typeof v == "object" && "fontFamily" in v && "borderRadius" in v && "colors" in v ? (f(v), l("")) : console.error("Invalid preset structure:", v);
     } else
       console.error("Preset not found:", a);
-  }, b = (w) => {
-    f(w), l("");
-  }, A = useDebouncedCallback(
-    (w, S) => {
+  }, b = (A) => {
+    f(A), l("");
+  }, w = useDebouncedCallback(
+    (A, v) => {
       h(() => ({
         ...g,
         fontFamily: {
           ...g.fontFamily,
-          [w.replace(/font-/g, "")]: S
+          [A.replace(/font-/g, "")]: v
         }
       }));
     },
     [g],
     200
-  ), _ = React.useCallback(
-    (w) => {
+  ), B = React.useCallback(
+    (A) => {
       h(() => ({
         ...g,
-        borderRadius: `${w}px`
+        borderRadius: `${A}px`
       }));
     },
     [g]
-  ), E = useDebouncedCallback(
-    (w, S) => {
+  ), _ = useDebouncedCallback(
+    (A, v) => {
       h(() => {
-        const k = get(g, `colors.${w}`);
-        return r ? set(k, 1, S) : set(k, 0, S), {
+        const C = get(g, `colors.${A}`);
+        return r ? set(C, 1, v) : set(C, 0, v), {
           ...g,
           colors: {
             ...g.colors,
-            [w]: k
+            [A]: C
           }
         };
       });
     },
     [g],
     200
-  ), N = (w) => /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1", children: Object.entries(w.items).map(([S]) => {
-    const k = get(g, `colors.${S}.${r ? 1 : 0}`);
-    return k ? /* @__PURE__ */ jsxs("div", { className: "mt-1 flex items-center gap-x-2", children: [
+  ), N = (A) => /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1", children: Object.entries(A.items).map(([v]) => {
+    const C = get(g, `colors.${v}.${r ? 1 : 0}`);
+    return C ? /* @__PURE__ */ jsxs("div", { className: "mt-1 flex items-center gap-x-2", children: [
       /* @__PURE__ */ jsx(
         ColorPickerInput,
         {
-          value: k,
-          onChange: (j) => E(S, j)
+          value: C,
+          onChange: (E) => _(v, E)
         }
       ),
-      /* @__PURE__ */ jsx(Label, { className: "text-xs font-normal leading-tight", children: S.split(/(?=[A-Z])/).join(" ").replace(/-/g, " ").split(" ").map((j) => j.charAt(0).toUpperCase() + j.slice(1)).join(" ") + (!S.toLowerCase().includes("foreground") && !S.toLowerCase().includes("border") && !S.toLowerCase().includes("input") && !S.toLowerCase().includes("ring") && !S.toLowerCase().includes("background") ? " Background" : "") })
-    ] }, S) : null;
+      /* @__PURE__ */ jsx(Label, { className: "text-xs font-normal leading-tight", children: v.split(/(?=[A-Z])/).join(" ").replace(/-/g, " ").split(" ").map((E) => E.charAt(0).toUpperCase() + E.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 u("edit_theme") ? /* @__PURE__ */ jsxs("div", { className: "relative w-full", children: [
     /* @__PURE__ */ jsxs("div", { className: cn$2("no-scrollbar h-full w-full overflow-y-auto", o), children: [
@@ -8620,9 +8320,9 @@ 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(SelectContent, { children: Array.isArray(d) && d.map((w) => {
-              const S = Object.keys(w)[0], k = S.replaceAll("_", " ");
-              return /* @__PURE__ */ jsx(SelectItem, { value: S, children: capitalize(k) }, S);
+            /* @__PURE__ */ jsx(SelectContent, { children: Array.isArray(d) && d.map((A) => {
+              const v = Object.keys(A)[0], C = v.replaceAll("_", " ");
+              return /* @__PURE__ */ jsx(SelectItem, { value: v, children: capitalize(C) }, v);
             }) })
           ] }) }),
           /* @__PURE__ */ jsx("div", { className: "w-[25%]", children: /* @__PURE__ */ jsx(Button, { className: "w-full text-sm", disabled: !a, onClick: y, children: x("Apply") }) })
@@ -8634,14 +8334,14 @@ const Input = ({ node: o }) => {
           /* @__PURE__ */ jsx(Type, { className: "h-3 w-3 text-gray-600" }),
           /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: "Typography" })
         ] }),
-        (m == null ? void 0 : m.fontFamily) && /* @__PURE__ */ jsx("div", { className: "space-y-2", children: Object.entries(m.fontFamily).map(([w, S]) => /* @__PURE__ */ jsx(
+        (m == null ? void 0 : m.fontFamily) && /* @__PURE__ */ jsx("div", { className: "space-y-2", children: Object.entries(m.fontFamily).map(([A, v]) => /* @__PURE__ */ jsx(
           FontSelector,
           {
-            label: w,
-            value: g.fontFamily[w.replace(/font-/g, "")] || S[Object.keys(S)[0]],
-            onChange: (k) => A(w, k)
+            label: A,
+            value: g.fontFamily[A.replace(/font-/g, "")] || v[Object.keys(v)[0]],
+            onChange: (C) => w(A, C)
           },
-          w
+          A
         )) }),
         /* @__PURE__ */ jsx(Separator, {}),
         (m == null ? void 0 : m.borderRadius) && /* @__PURE__ */ jsxs("div", { className: "space-y-0.5", children: [
@@ -8652,7 +8352,7 @@ const Input = ({ node: o }) => {
             ] }),
             /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "text-xs", children: g.borderRadius })
           ] }),
-          /* @__PURE__ */ jsx("div", { className: "flex items-center gap-4 py-2", children: /* @__PURE__ */ jsx(BorderRadiusInput, { value: g.borderRadius, onChange: _ }) })
+          /* @__PURE__ */ jsx("div", { className: "flex items-center gap-4 py-2", children: /* @__PURE__ */ jsx(BorderRadiusInput, { value: g.borderRadius, onChange: B }) })
         ] }),
         /* @__PURE__ */ jsx(Separator, {}),
         (m == null ? void 0 : m.colors) && /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
@@ -8667,7 +8367,7 @@ const Input = ({ node: o }) => {
                 Switch,
                 {
                   checked: r,
-                  onCheckedChange: (w) => n(w),
+                  onCheckedChange: (A) => n(A),
                   "aria-label": "Toggle dark mode",
                   className: "mx-1"
                 }
@@ -8675,7 +8375,7 @@ const Input = ({ node: o }) => {
               /* @__PURE__ */ jsx(Moon, { className: "h-4 w-4" })
             ] }) })
           ] }),
-          /* @__PURE__ */ jsx("div", { className: "space-y-2", children: m.colors.map((w) => N(w)) })
+          /* @__PURE__ */ jsx("div", { className: "space-y-2", children: m.colors.map((A) => N(A)) })
         ] }),
         /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: i && /* @__PURE__ */ jsx(
           LazyCssImportModal,
@@ -9298,26 +8998,26 @@ function AIChatPanel() {
       content: n,
       timestamp: /* @__PURE__ */ new Date()
     };
-    r((A) => [...A, b]), a(""), i(!0), setTimeout(() => {
-      const A = {
+    r((w) => [...w, b]), a(""), i(!0), setTimeout(() => {
+      const w = {
         id: (Date.now() + 1).toString(),
         role: "assistant",
         content: "This is a sample response from the AI assistant. In a real implementation, this would be replaced with an actual response from the AI model.",
         timestamp: /* @__PURE__ */ new Date()
       };
-      r((_) => [..._, A]), i(!1), d(null);
+      r((B) => [...B, w]), i(!1), d(null);
     }, 1500);
   }, m = (b) => {
     b.key === "Enter" && !b.shiftKey && (b.preventDefault(), h());
   }, x = (b) => {
-    var _;
-    const A = (_ = b.target.files) == null ? void 0 : _[0];
-    if (A) {
-      const E = new FileReader();
-      E.onload = (N) => {
-        var w;
-        d((w = N.target) == null ? void 0 : w.result);
-      }, E.readAsDataURL(A);
+    var B;
+    const w = (B = b.target.files) == null ? void 0 : B[0];
+    if (w) {
+      const _ = new FileReader();
+      _.onload = (N) => {
+        var A;
+        d((A = N.target) == null ? void 0 : A.result);
+      }, _.readAsDataURL(w);
     }
   }, f = () => {
     var b;
@@ -9521,43 +9221,43 @@ const AiAssistant = () => {
       return;
     }
     if (i) {
-      const S = [...a, { key: i, value: d }];
-      n(S), l(a), c(""), p(""), m("");
+      const v = [...a, { key: i, value: d }];
+      n(v), l(a), c(""), p(""), m("");
     }
-  }, A = (S) => {
-    const k = a.filter((j, C) => C !== S);
-    n(k), l(k);
-  }, _ = (S) => {
-    g(S), c(a[S].key), p(a[S].value);
-  }, E = () => {
+  }, w = (v) => {
+    const C = a.filter((E, S) => S !== v);
+    n(C), l(C);
+  }, B = (v) => {
+    g(v), c(a[v].key), p(a[v].value);
+  }, _ = () => {
     if (i.startsWith("@")) {
       m("Attribute keys cannot start with '@'");
       return;
     }
     if (u !== null && i) {
-      const S = [...a];
-      S[u] = { key: i, value: d }, n(S), l(S), g(null), c(""), p(""), m("");
+      const v = [...a];
+      v[u] = { key: i, value: d }, n(v), l(v), g(null), c(""), p(""), m("");
     }
-  }, N = (S) => {
-    S.key === "Enter" && !S.shiftKey && (S.preventDefault(), u !== null ? E() : b());
-  }, w = useCallback((S) => {
-    const k = (v) => /[.,!?;:]/.test(v), j = (v, B, I) => {
+  }, N = (v) => {
+    v.key === "Enter" && !v.shiftKey && (v.preventDefault(), u !== null ? _() : b());
+  }, A = useCallback((v) => {
+    const C = (k) => /[.,!?;:]/.test(k), E = (k, j, I) => {
       let T = "", P = "";
-      const L = B > 0 ? v[B - 1] : "", D = B < v.length ? v[B] : "";
-      return B > 0 && (L === "." || !k(L) && L !== " ") && (T = " "), B < v.length && !k(D) && D !== " " && (P = " "), {
+      const L = j > 0 ? k[j - 1] : "", D = j < k.length ? k[j] : "";
+      return j > 0 && (L === "." || !C(L) && L !== " ") && (T = " "), j < k.length && !C(D) && D !== " " && (P = " "), {
         text: T + I + P,
         prefixLength: T.length,
         suffixLength: P.length
       };
-    }, C = f.current;
-    if (C) {
-      const v = C.selectionStart || 0, B = C.value || "", I = C.selectionEnd || v;
-      if (I > v) {
-        const R = `{{${S}}}`, { text: M } = j(B, v, R), $ = B.slice(0, v) + M + B.slice(I);
+    }, S = f.current;
+    if (S) {
+      const k = S.selectionStart || 0, j = S.value || "", I = S.selectionEnd || k;
+      if (I > k) {
+        const R = `{{${v}}}`, { text: M } = E(j, k, R), $ = j.slice(0, k) + M + j.slice(I);
         p($);
         return;
       }
-      const P = `{{${S}}}`, { text: L } = j(B, v, P), D = B.slice(0, v) + L + B.slice(v);
+      const P = `{{${v}}}`, { text: L } = E(j, k, P), D = j.slice(0, k) + L + j.slice(k);
       p(D);
     }
   }, []);
@@ -9565,8 +9265,8 @@ const AiAssistant = () => {
     /* @__PURE__ */ jsxs(
       "form",
       {
-        onSubmit: (S) => {
-          S.preventDefault(), u !== null ? E() : b();
+        onSubmit: (v) => {
+          v.preventDefault(), u !== null ? _() : b();
         },
         className: "space-y-3",
         children: [
@@ -9582,7 +9282,7 @@ const AiAssistant = () => {
                   id: "attrKey",
                   ref: x,
                   value: i,
-                  onChange: (S) => c(S.target.value),
+                  onChange: (v) => c(v.target.value),
                   placeholder: "Enter Key",
                   className: "py-0 text-xs font-normal leading-tight placeholder:text-slate-400"
                 }
@@ -9591,7 +9291,7 @@ const AiAssistant = () => {
             /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
               /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
                 /* @__PURE__ */ jsx(Label, { htmlFor: "attrValue", className: "text-[11px] font-normal text-slate-600", children: "Value" }),
-                !isEmpty(y) && /* @__PURE__ */ jsx(NestedPathSelector, { data: y, onSelect: w })
+                !isEmpty(y) && /* @__PURE__ */ jsx(NestedPathSelector, { data: y, onSelect: A })
               ] }),
               /* @__PURE__ */ jsx(
                 Textarea,
@@ -9603,7 +9303,7 @@ const AiAssistant = () => {
                   rows: 2,
                   ref: f,
                   value: d,
-                  onChange: (S) => p(S.target.value),
+                  onChange: (v) => p(v.target.value),
                   onKeyDown: N,
                   placeholder: "Enter Value",
                   className: "text-xs font-normal leading-tight placeholder:text-slate-400"
@@ -9616,16 +9316,16 @@ const AiAssistant = () => {
         ]
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: "space-y-1 py-4", children: a.map((S, k) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between rounded border p-2 text-sm", children: [
+    /* @__PURE__ */ jsx("div", { className: "space-y-1 py-4", children: a.map((v, C) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between rounded border p-2 text-sm", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex flex-col text-xs leading-tight", children: [
-        /* @__PURE__ */ jsx("span", { className: "truncate text-[12px] font-light text-muted-foreground", children: S.key }),
-        /* @__PURE__ */ jsx("span", { className: "max-w-[200px] text-wrap font-normal", children: S.value.toString() })
+        /* @__PURE__ */ jsx("span", { className: "truncate text-[12px] font-light text-muted-foreground", children: v.key }),
+        /* @__PURE__ */ jsx("span", { className: "max-w-[200px] text-wrap font-normal", children: v.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: () => _(k), children: /* @__PURE__ */ jsx(Edit2, { className: "h-3 w-3" }) }),
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => A(k), children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" }) })
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => B(C), children: /* @__PURE__ */ jsx(Edit2, { className: "h-3 w-3" }) }),
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => w(C), children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" }) })
       ] })
-    ] }, k)) })
+    ] }, C)) })
   ] });
 }), BlockAttributesEditor = React.memo(() => {
   const o = useSelectedBlock(), [r, n] = useState([]), [a] = useSelectedStylingBlocks(), l = useUpdateBlocksProps(), i = `${get(a, "0.prop")}_attrs`;
@@ -9787,38 +9487,38 @@ const RootLayout = () => {
   usePubSub(CHAI_BUILDER_EVENTS.SHOW_BLOCK_SETTINGS, () => {
     n("outline");
   });
-  const p = useSidebarDefaultPanels(), u = useChaiSidebarPanels("top"), g = useChaiSidebarPanels("bottom"), h = reverse([...g ?? []]), m = useCallback((k) => {
-    k.preventDefault();
+  const p = useSidebarDefaultPanels(), u = useChaiSidebarPanels("top"), g = useChaiSidebarPanels("bottom"), h = reverse([...g ?? []]), m = useCallback((C) => {
+    C.preventDefault();
   }, []), x = useCallback(
-    (k) => {
-      n(r === k ? null : k);
+    (C) => {
+      n(r === C ? null : C);
     },
     [r]
   ), { t: f } = useTranslation(), y = useMemo(
     () => [...p, ...u, ...g],
     [p, u, g]
-  ), b = useBuilderProp("htmlDir", "ltr"), A = find(y, { id: r }) ?? first(y), _ = get(A, "width", DEFAULT_PANEL_WIDTH);
+  ), b = useBuilderProp("htmlDir", "ltr"), w = find(y, { id: r }) ?? first(y), B = get(w, "width", DEFAULT_PANEL_WIDTH);
   useEffect(() => {
     if (r !== null) {
-      const k = find(y, { id: r });
-      k && get(k, "view", "standard") === "standard" && (a.current = r, i(get(k, "width", DEFAULT_PANEL_WIDTH)));
+      const C = find(y, { id: r });
+      C && get(C, "view", "standard") === "standard" && (a.current = r, i(get(C, "width", DEFAULT_PANEL_WIDTH)));
     }
   }, [r, y]);
-  const E = useMemo(() => {
+  const _ = useMemo(() => {
     if (r === null) return 0;
-    const k = find(y, { id: r });
-    return get(k, "view", "standard") === "standard" ? _ : l;
-  }, [r, _, l, y]), N = useCallback(() => {
+    const C = find(y, { id: r });
+    return get(C, "view", "standard") === "standard" ? B : l;
+  }, [r, B, l, y]), N = useCallback(() => {
     n(a.current);
-  }, [n]), w = useCallback(() => {
+  }, [n]), A = useCallback(() => {
     n("outline");
   }, [n]);
   useEffect(() => {
     find(y, { id: r }) || n("outline");
   }, [r, y]);
-  const S = useCallback(
-    (k) => {
-      x(k);
+  const v = useCallback(
+    (C) => {
+      x(C);
     },
     [x]
   );
@@ -9832,43 +9532,43 @@ const RootLayout = () => {
           /* @__PURE__ */ jsx("div", { className: "flex h-[50px] w-screen items-center border-b border-border", children: /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(o, {}) }) }),
           /* @__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: [p, u].flat().map((k, j) => /* @__PURE__ */ jsxs(Tooltip, { children: [
-                /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: createElement(get(k, "button", NoopComponent), {
+              /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1", children: [p, u].flat().map((C, E) => /* @__PURE__ */ jsxs(Tooltip, { children: [
+                /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: createElement(get(C, "button", NoopComponent), {
                   position: "top",
-                  panelId: k.id,
-                  isActive: r === k.id,
-                  show: () => S(k.id)
+                  panelId: C.id,
+                  isActive: r === C.id,
+                  show: () => v(C.id)
                 }) }),
-                /* @__PURE__ */ jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsx("p", { children: f(k.label) }) })
-              ] }, "button-top-" + j)) }),
+                /* @__PURE__ */ jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsx("p", { children: f(C.label) }) })
+              ] }, "button-top-" + E)) }),
               /* @__PURE__ */ jsx("div", { className: "flex flex-col space-y-1" }),
-              /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: h == null ? void 0 : h.map((k, j) => /* @__PURE__ */ jsxs(Tooltip, { children: [
-                /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: createElement(get(k, "button", NoopComponent), {
+              /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: h == null ? void 0 : h.map((C, E) => /* @__PURE__ */ jsxs(Tooltip, { children: [
+                /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: createElement(get(C, "button", NoopComponent), {
                   position: "bottom",
-                  panelId: k.id,
-                  isActive: r === k.id,
-                  show: () => S(k.id)
+                  panelId: C.id,
+                  isActive: r === C.id,
+                  show: () => v(C.id)
                 }) }),
-                /* @__PURE__ */ jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsx("p", { children: f(k.label) }) })
-              ] }, "button-bottom-" + j)) })
+                /* @__PURE__ */ jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsx("p", { children: f(C.label) }) })
+              ] }, "button-bottom-" + E)) })
             ] }),
             /* @__PURE__ */ jsx(
               motion.div,
               {
                 id: "left-panel",
                 className: "h-full max-h-full border-r border-border",
-                initial: { width: E },
-                animate: { width: E },
+                initial: { width: _ },
+                animate: { width: _ },
                 transition: { duration: 0.3, ease: "easeInOut" },
-                children: r !== null && get(A, "view", "standard") === "standard" && /* @__PURE__ */ jsxs("div", { className: "no-scrollbar flex h-full flex-col overflow-hidden px-3 py-2", children: [
+                children: r !== null && get(w, "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(A, "isInternal", !1) ? "" : "w-64"}`,
-                      children: /* @__PURE__ */ jsx("span", { children: f(get(A, "label", "")) })
+                      className: `absolute top-2 flex h-10 items-center space-x-1 py-2 text-base font-bold ${get(w, "isInternal", !1) ? "" : "w-64"}`,
+                      children: /* @__PURE__ */ jsx("span", { children: f(get(w, "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(A, "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(w, "panel", NoopComponent), {}) }) })
                 ] })
               }
             ),
@@ -9914,34 +9614,34 @@ const RootLayout = () => {
       }
     ),
     /* @__PURE__ */ jsx(AddBlocksDialog, {}),
-    r !== null && get(A, "view") === "drawer" && /* @__PURE__ */ jsx(Sheet, { open: !0, onOpenChange: () => N(), children: /* @__PURE__ */ jsxs(
+    r !== null && get(w, "view") === "drawer" && /* @__PURE__ */ jsx(Sheet, { open: !0, onOpenChange: () => N(), children: /* @__PURE__ */ jsxs(
       SheetContent,
       {
         side: "left",
         className: "flex flex-col gap-0 p-0 sm:max-w-full",
-        style: { width: `${_}px` },
+        style: { width: `${B}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(A, "icon", null) }),
-            /* @__PURE__ */ jsx("span", { children: f(get(A, "label", "")) })
+            /* @__PURE__ */ jsx("span", { className: "inline-block", children: get(w, "icon", null) }),
+            /* @__PURE__ */ jsx("span", { children: f(get(w, "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(A, "panel", NoopComponent), {
-            close: w
+          /* @__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(w, "panel", NoopComponent), {
+            close: A
           }) }) })
         ]
       }
     ) }),
     " ",
-    r !== null && get(A, "view") === "modal" && /* @__PURE__ */ jsx(Dialog, { open: !0, onOpenChange: () => N(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "gap-0 p-0", style: { maxWidth: `${_}px` }, children: [
+    r !== null && get(w, "view") === "modal" && /* @__PURE__ */ jsx(Dialog, { open: !0, onOpenChange: () => N(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "gap-0 p-0", style: { maxWidth: `${B}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(A, "icon", null) }),
-        /* @__PURE__ */ jsx("span", { children: f(get(A, "label", "")) })
+        /* @__PURE__ */ jsx("span", { className: "inline-block", children: get(w, "icon", null) }),
+        /* @__PURE__ */ jsx("span", { children: f(get(w, "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(A, "panel", NoopComponent), {
-        close: w
+      /* @__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(w, "panel", NoopComponent), {
+        close: A
       }) }) })
     ] }) }),
-    r !== null && get(A, "view") === "overlay" && /* @__PURE__ */ jsx(
+    r !== null && get(w, "view") === "overlay" && /* @__PURE__ */ jsx(
       motion.div,
       {
         className: "absolute bottom-0 left-12 right-0 top-0 z-50",
@@ -9960,13 +9660,13 @@ 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(A, "icon", null) }),
-                  /* @__PURE__ */ jsx("span", { children: f(get(A, "label", "")) })
+                  /* @__PURE__ */ jsx("span", { className: "rtl:ml-2 rtl:inline-block", children: get(w, "icon", null) }),
+                  /* @__PURE__ */ jsx("span", { children: f(get(w, "label", "")) })
                 ] }),
                 /* @__PURE__ */ jsx(Button, { onClick: () => N(), variant: "ghost", size: "icon", className: "", children: /* @__PURE__ */ jsx(X, { 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(A, "panel", NoopComponent), {
-                close: w
+              /* @__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(w, "panel", NoopComponent), {
+                close: A
               }) }) })
             ]
           }
@@ -10008,8 +9708,8 @@ const RootLayout = () => {
     const f = l.toLowerCase();
     return Object.fromEntries(
       Object.entries(a).filter(([y, b]) => {
-        var A;
-        return (y == null ? void 0 : y.toLowerCase().includes(f)) || ((A = b == null ? void 0 : b.description) == null ? void 0 : A.toLowerCase().includes(f));
+        var w;
+        return (y == null ? void 0 : y.toLowerCase().includes(f)) || ((w = b == null ? void 0 : b.description) == null ? void 0 : w.toLowerCase().includes(f));
       })
     );
   }, [a, l]), h = (f) => {
@@ -10019,8 +9719,8 @@ const RootLayout = () => {
     });
   }, m = (f) => {
     if (!c) return;
-    const y = f.clientX - p.x, b = f.clientY - p.y, A = f.currentTarget, _ = A.offsetWidth, E = A.offsetHeight, N = window.innerWidth - _, w = window.innerHeight - E, S = Math.max(0, Math.min(y, N)), k = Math.max(0, Math.min(b, w));
-    n(S, k);
+    const y = f.clientX - p.x, b = f.clientY - p.y, w = f.currentTarget, B = w.offsetWidth, _ = w.offsetHeight, N = window.innerWidth - B, A = window.innerHeight - _, v = Math.max(0, Math.min(y, N)), C = Math.max(0, Math.min(b, A));
+    n(v, C);
   }, x = () => {
     d(!1);
   };
@@ -10197,71 +9897,71 @@ const RootLayout = () => {
   var f;
   return (f = m.onMount) == null ? void 0 : f.call(m, x);
 }, ...h) => {
-  const m = h[0] || ((k) => {
-    let j = o.get(k);
-    return j || (j = { d: /* @__PURE__ */ new Map(), p: /* @__PURE__ */ new Set(), n: 0 }, o.set(k, j), u == null || u(k, S)), j;
+  const m = h[0] || ((C) => {
+    let E = o.get(C);
+    return E || (E = { d: /* @__PURE__ */ new Map(), p: /* @__PURE__ */ new Set(), n: 0 }, o.set(C, E), u == null || u(C, v)), E;
   }), x = h[1] || (() => {
-    const k = [], j = (C) => {
+    const C = [], E = (S) => {
       try {
-        C();
-      } catch (v) {
-        k.push(v);
+        S();
+      } catch (k) {
+        C.push(k);
       }
     };
     do {
-      c.f && j(c.f);
-      const C = /* @__PURE__ */ new Set(), v = C.add.bind(C);
-      a.forEach((B) => {
+      c.f && E(c.f);
+      const S = /* @__PURE__ */ new Set(), k = S.add.bind(S);
+      a.forEach((j) => {
         var I;
-        return (I = r.get(B)) == null ? void 0 : I.l.forEach(v);
-      }), a.clear(), i.forEach(v), i.clear(), l.forEach(v), l.clear(), C.forEach(j), a.size && f();
+        return (I = r.get(j)) == null ? void 0 : I.l.forEach(k);
+      }), a.clear(), i.forEach(k), i.clear(), l.forEach(k), l.clear(), S.forEach(E), a.size && f();
     } while (a.size || i.size || l.size);
-    if (k.length)
-      throw new AggregateError(k);
+    if (C.length)
+      throw new AggregateError(C);
   }), f = h[2] || (() => {
-    const k = [], j = /* @__PURE__ */ new WeakSet(), C = /* @__PURE__ */ new WeakSet(), v = Array.from(a);
-    for (; v.length; ) {
-      const B = v[v.length - 1], I = m(B);
-      if (C.has(B)) {
-        v.pop();
+    const C = [], E = /* @__PURE__ */ new WeakSet(), S = /* @__PURE__ */ new WeakSet(), k = Array.from(a);
+    for (; k.length; ) {
+      const j = k[k.length - 1], I = m(j);
+      if (S.has(j)) {
+        k.pop();
         continue;
       }
-      if (j.has(B)) {
-        n.get(B) === I.n && k.push([B, I]), C.add(B), v.pop();
+      if (E.has(j)) {
+        n.get(j) === I.n && C.push([j, I]), S.add(j), k.pop();
         continue;
       }
-      j.add(B);
-      for (const T of getMountedOrPendingDependents(B, I, r))
-        j.has(T) || v.push(T);
+      E.add(j);
+      for (const T of getMountedOrPendingDependents(j, I, r))
+        E.has(T) || k.push(T);
     }
-    for (let B = k.length - 1; B >= 0; --B) {
-      const [I, T] = k[B];
+    for (let j = C.length - 1; j >= 0; --j) {
+      const [I, T] = C[j];
       let P = !1;
       for (const L of T.d.keys())
         if (L !== I && a.has(L)) {
           P = !0;
           break;
         }
-      P && (y(I), _(I)), n.delete(I);
+      P && (y(I), B(I)), n.delete(I);
     }
-  }), y = h[3] || ((k) => {
-    var j;
-    const C = m(k);
-    if (isAtomStateInitialized(C) && (r.has(k) && n.get(k) !== C.n || Array.from(C.d).every(
+  }), y = h[3] || ((C) => {
+    var E;
+    const S = m(C);
+    if (isAtomStateInitialized(S) && (r.has(C) && n.get(C) !== S.n || Array.from(S.d).every(
       ([R, M]) => (
         // Recursively, read the atom state of the dependency, and
         // check if the atom epoch number is unchanged
         y(R).n === M
       )
     )))
-      return C;
-    C.d.clear();
-    let v = !0;
-    const B = () => {
-      r.has(k) && (_(k), f(), x());
+      return S;
+    S.d.clear();
+    let k = !0;
+    const j = () => {
+      r.has(C) && (B(C), f(), x());
     }, I = (R) => {
       var M;
-      if (isSelfAtom(k, R)) {
+      if (isSelfAtom(C, R)) {
         const O = m(R);
         if (!isAtomStateInitialized(O))
           if (hasInitialValue(R))
@@ -10274,7 +9974,7 @@ const RootLayout = () => {
       try {
         return returnAtomValue($);
       } finally {
-        C.d.set(R, $.n), isPendingPromise(C.v) && addPendingPromiseToDependency(k, C.v, $), (M = r.get(R)) == null || M.t.add(k), v || B();
+        S.d.set(R, $.n), isPendingPromise(S.v) && addPendingPromiseToDependency(C, S.v, $), (M = r.get(R)) == null || M.t.add(C), k || j();
       }
     };
     let T, P;
@@ -10283,100 +9983,100 @@ const RootLayout = () => {
         return T || (T = new AbortController()), T.signal;
       },
       get setSelf() {
-        return !P && isActuallyWritableAtom(k) && (P = (...R) => {
-          if (!v)
+        return !P && isActuallyWritableAtom(C) && (P = (...R) => {
+          if (!k)
             try {
-              return A(k, ...R);
+              return w(C, ...R);
             } finally {
               f(), x();
             }
         }), P;
       }
-    }, D = C.n;
+    }, D = S.n;
     try {
-      const R = d(k, I, L);
-      return setAtomStateValueOrPromise(k, R, m), isPromiseLike$1(R) && (registerAbortHandler(R, () => T == null ? void 0 : T.abort()), R.then(
-        B,
-        B
-      )), C;
+      const R = d(C, I, L);
+      return setAtomStateValueOrPromise(C, R, m), isPromiseLike$1(R) && (registerAbortHandler(R, () => T == null ? void 0 : T.abort()), R.then(
+        j,
+        j
+      )), S;
     } catch (R) {
-      return delete C.v, C.e = R, ++C.n, C;
+      return delete S.v, S.e = R, ++S.n, S;
     } finally {
-      v = !1, D !== C.n && n.get(k) === D && (n.set(k, C.n), a.add(k), (j = c.c) == null || j.call(c, k));
+      k = !1, D !== S.n && n.get(C) === D && (n.set(C, S.n), a.add(C), (E = c.c) == null || E.call(c, C));
     }
-  }), b = h[4] || ((k) => {
-    const j = [k];
-    for (; j.length; ) {
-      const C = j.pop(), v = m(C);
-      for (const B of getMountedOrPendingDependents(C, v, r)) {
-        const I = m(B);
-        n.set(B, I.n), j.push(B);
+  }), b = h[4] || ((C) => {
+    const E = [C];
+    for (; E.length; ) {
+      const S = E.pop(), k = m(S);
+      for (const j of getMountedOrPendingDependents(S, k, r)) {
+        const I = m(j);
+        n.set(j, I.n), E.push(j);
       }
     }
-  }), A = h[5] || ((k, ...j) => {
-    let C = !0;
-    const v = (I) => returnAtomValue(y(I)), B = (I, ...T) => {
+  }), w = h[5] || ((C, ...E) => {
+    let S = !0;
+    const k = (I) => returnAtomValue(y(I)), j = (I, ...T) => {
       var P;
       const L = m(I);
       try {
-        if (isSelfAtom(k, I)) {
+        if (isSelfAtom(C, I)) {
           if (!hasInitialValue(I))
             throw new Error("atom not writable");
           const D = L.n, R = T[0];
-          setAtomStateValueOrPromise(I, R, m), _(I), D !== L.n && (a.add(I), (P = c.c) == null || P.call(c, I), b(I));
+          setAtomStateValueOrPromise(I, R, m), B(I), D !== L.n && (a.add(I), (P = c.c) == null || P.call(c, I), b(I));
           return;
         } else
-          return A(I, ...T);
+          return w(I, ...T);
       } finally {
-        C || (f(), x());
+        S || (f(), x());
       }
     };
     try {
-      return p(k, v, B, ...j);
+      return p(C, k, j, ...E);
     } finally {
-      C = !1;
+      S = !1;
     }
-  }), _ = h[6] || ((k) => {
-    var j;
-    const C = m(k), v = r.get(k);
-    if (v && !isPendingPromise(C.v)) {
-      for (const [B, I] of C.d)
-        if (!v.d.has(B)) {
-          const T = m(B);
-          E(B).t.add(k), v.d.add(B), I !== T.n && (a.add(B), (j = c.c) == null || j.call(c, B), b(B));
+  }), B = h[6] || ((C) => {
+    var E;
+    const S = m(C), k = r.get(C);
+    if (k && !isPendingPromise(S.v)) {
+      for (const [j, I] of S.d)
+        if (!k.d.has(j)) {
+          const T = m(j);
+          _(j).t.add(C), k.d.add(j), I !== T.n && (a.add(j), (E = c.c) == null || E.call(c, j), b(j));
         }
-      for (const B of v.d || [])
-        if (!C.d.has(B)) {
-          v.d.delete(B);
-          const I = N(B);
-          I == null || I.t.delete(k);
+      for (const j of k.d || [])
+        if (!S.d.has(j)) {
+          k.d.delete(j);
+          const I = N(j);
+          I == null || I.t.delete(C);
         }
     }
-  }), E = h[7] || ((k) => {
-    var j;
-    const C = m(k);
-    let v = r.get(k);
-    if (!v) {
-      y(k);
-      for (const B of C.d.keys())
-        E(B).t.add(k);
-      if (v = {
+  }), _ = h[7] || ((C) => {
+    var E;
+    const S = m(C);
+    let k = r.get(C);
+    if (!k) {
+      y(C);
+      for (const j of S.d.keys())
+        _(j).t.add(C);
+      if (k = {
         l: /* @__PURE__ */ new Set(),
-        d: new Set(C.d.keys()),
+        d: new Set(S.d.keys()),
         t: /* @__PURE__ */ new Set()
-      }, r.set(k, v), (j = c.m) == null || j.call(c, k), isActuallyWritableAtom(k)) {
-        const B = () => {
+      }, r.set(C, k), (E = c.m) == null || E.call(c, C), isActuallyWritableAtom(C)) {
+        const j = () => {
           let I = !0;
           const T = (...P) => {
             try {
-              return A(k, ...P);
+              return w(C, ...P);
             } finally {
               I || (f(), x());
             }
           };
           try {
-            const P = g(k, T);
-            P && (v.u = () => {
+            const P = g(C, T);
+            P && (k.u = () => {
               I = !0;
               try {
                 P();
@@ -10388,27 +10088,27 @@ const RootLayout = () => {
             I = !1;
           }
         };
-        l.add(B);
+        l.add(j);
       }
     }
-    return v;
-  }), N = h[8] || ((k) => {
-    var j;
-    const C = m(k);
-    let v = r.get(k);
-    if (v && !v.l.size && !Array.from(v.t).some((B) => {
+    return k;
+  }), N = h[8] || ((C) => {
+    var E;
+    const S = m(C);
+    let k = r.get(C);
+    if (k && !k.l.size && !Array.from(k.t).some((j) => {
       var I;
-      return (I = r.get(B)) == null ? void 0 : I.d.has(k);
+      return (I = r.get(j)) == null ? void 0 : I.d.has(C);
     })) {
-      v.u && i.add(v.u), v = void 0, r.delete(k), (j = c.u) == null || j.call(c, k);
-      for (const B of C.d.keys()) {
-        const I = N(B);
-        I == null || I.t.delete(k);
+      k.u && i.add(k.u), k = void 0, r.delete(C), (E = c.u) == null || E.call(c, C);
+      for (const j of S.d.keys()) {
+        const I = N(j);
+        I == null || I.t.delete(C);
       }
       return;
     }
-    return v;
-  }), w = [
+    return k;
+  }), A = [
     // store state
     o,
     r,
@@ -10428,27 +10128,27 @@ const RootLayout = () => {
     f,
     y,
     b,
-    A,
+    w,
+    B,
     _,
-    E,
     N
-  ], S = {
-    get: (k) => returnAtomValue(y(k)),
-    set: (k, ...j) => {
+  ], v = {
+    get: (C) => returnAtomValue(y(C)),
+    set: (C, ...E) => {
       try {
-        return A(k, ...j);
+        return w(C, ...E);
       } finally {
         f(), x();
       }
     },
-    sub: (k, j) => {
-      const v = E(k).l;
-      return v.add(j), x(), () => {
-        v.delete(j), N(k), x();
+    sub: (C, E) => {
+      const k = _(C).l;
+      return k.add(E), x(), () => {
+        k.delete(E), N(C), x();
       };
     }
   };
-  return Object.defineProperty(S, BUILDING_BLOCKS, { value: w }), S;
+  return Object.defineProperty(v, BUILDING_BLOCKS, { value: A }), v;
 }, INTERNAL_buildStoreRev1 = buildStore, INTERNAL_registerAbortHandler = registerAbortHandler;
 function createStore() {
   return INTERNAL_buildStoreRev1();