@chaibuilder/sdk 2.2.19 → 2.2.21

package/dist/core.js

@@ -1,10 +1,10 @@
 var V = Object.defineProperty;
 var F = (o, r, n) => r in o ? V(o, r, { enumerable: !0, configurable: !0, writable: !0, value: n }) : o[r] = n;
-var H = (o, r, n) => F(o, typeof r != "symbol" ? r + "" : r, n);
+var U = (o, r, n) => F(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, isArray, isObject as isObject$1, memoize, noop, first, keys, range, flattenDeep, set, forEach, unset, chunk, cloneDeep, isNull, split, reject, take, debounce, startCase, isNumber, parseInt as parseInt$1, isNaN as isNaN$1, toLower, nth, findLast, intersection, toUpper, capitalize, isFunction, groupBy, uniq, flatMapDeep, some, sortBy, round } from "lodash-es";
+import { get, find, filter, flatten, has, map, includes, without, compact, reverse, findIndex, isEmpty, isString, each, omit, values, pick, startsWith, isUndefined, isFunction, isArray, isObject as isObject$1, memoize, noop, first, keys, range, flattenDeep, set, forEach, unset, chunk, cloneDeep, isNull, split, reject, take, debounce, startCase, isNumber, parseInt as parseInt$1, isNaN as isNaN$1, toLower, nth, findLast, intersection, toUpper, capitalize, groupBy, uniq, flatMapDeep, some, 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, 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";
@@ -285,7 +285,7 @@ import.meta.vitest && describe("canDropBlock Function", () => {
 });
 class PubSub {
   constructor() {
-    H(this, "subscribers", /* @__PURE__ */ new Map());
+    U(this, "subscribers", /* @__PURE__ */ new Map());
   }
   subscribe(r, n) {
     return this.subscribers.has(r) || this.subscribers.set(r, /* @__PURE__ */ new Set()), this.subscribers.get(r).add(n), () => {
@@ -299,20 +299,20 @@ class PubSub {
   }
 }
 const pubsub = new PubSub(), AddBlockDropdown = ({ block: o, children: r }) => {
-  const { t: n } = useTranslation(), [a] = useBlocksStore(), { hasPermission: l } = usePermissions(), i = get(o, "_id"), c = get(o, "_parent"), d = filter(a, (m) => c ? get(m, "_parent") === c : !get(m, "_parent")), p = canAddChildBlock(get(o, "_type", "")), u = findIndex(d, { _id: i }), g = (m) => {
-    if (m === "CHILD")
+  const { t: n } = useTranslation(), [a] = useBlocksStore(), { hasPermission: l } = usePermissions(), i = get(o, "_id"), c = get(o, "_parent"), d = filter(a, (g) => c ? get(g, "_parent") === c : !get(g, "_parent")), p = canAddChildBlock(get(o, "_type", "")), u = findIndex(d, { _id: i }), m = (g) => {
+    if (g === "CHILD")
       pubsub.publish(CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK, o);
     else {
       const h = { _id: c || "", position: d == null ? void 0 : d.length };
-      m === "BEFORE" ? h.position = Math.max(u, 0) : m === "AFTER" && (h.position = u + 1), pubsub.publish(CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK, h);
+      g === "BEFORE" ? h.position = Math.max(u, 0) : g === "AFTER" && (h.position = u + 1), pubsub.publish(CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK, h);
     }
   };
   return l(PERMISSIONS.ADD_BLOCK) ? /* @__PURE__ */ jsxs(DropdownMenu, { children: [
     /* @__PURE__ */ jsx(DropdownMenuTrigger, { children: r }),
     /* @__PURE__ */ jsxs(DropdownMenuContent, { className: "border border-blue-500 bg-primary text-white shadow-2xl", children: [
-      p && /* @__PURE__ */ jsx(DropdownMenuItem, { className: "cursor-pointer text-xs", onClick: () => g("CHILD"), children: n("Add inside") }),
-      /* @__PURE__ */ jsx(DropdownMenuItem, { className: "cursor-pointer text-xs", onClick: () => g("BEFORE"), children: n("Add before") }),
-      /* @__PURE__ */ jsx(DropdownMenuItem, { className: "cursor-pointer text-xs", onClick: () => g("AFTER"), children: n("Add after") })
+      p && /* @__PURE__ */ jsx(DropdownMenuItem, { className: "cursor-pointer text-xs", onClick: () => m("CHILD"), children: n("Add inside") }),
+      /* @__PURE__ */ jsx(DropdownMenuItem, { className: "cursor-pointer text-xs", onClick: () => m("BEFORE"), children: n("Add before") }),
+      /* @__PURE__ */ jsx(DropdownMenuItem, { className: "cursor-pointer text-xs", onClick: () => m("AFTER"), children: n("Add after") })
     ] })
   ] }) : null;
 }, draggedBlockAtom = atom(null);
@@ -338,8 +338,8 @@ function insertBlocksAtPosition(o, r, n, a) {
   const l = [...r];
   let i = [...o];
   if (n) {
-    const u = o.find((g) => g._id === n);
-    if (u && u.content !== void 0 && u.content !== "" && !o.some((m) => m._parent === n)) {
+    const u = o.find((m) => m._id === n);
+    if (u && u.content !== void 0 && u.content !== "" && !o.some((g) => g._parent === n)) {
       const h = {
         _id: generateUUID(),
         _parent: n,
@@ -363,13 +363,13 @@ function insertBlocksAtPosition(o, r, n, a) {
   n && (c = i.filter((u) => u._parent === n));
   const d = !isNaN(a) || a > -1 ? Math.min(a, c.length) : c.length;
   let p = i.length;
-  for (let u = 0, g = 0; u < i.length; u++)
+  for (let u = 0, m = 0; u < i.length; u++)
     if (n !== void 0 ? i[u]._parent === n : !i[u]._parent) {
-      if (g === d) {
+      if (m === d) {
         p = u;
         break;
       }
-      g++;
+      m++;
     }
   return !n && a !== void 0 && a >= c.length && (p = i.length), [...i.slice(0, p), ...l, ...i.slice(p)];
 }
@@ -384,17 +384,17 @@ function findNodeById(o, r) {
   return o.first((n) => n.model._id === r) || null;
 }
 function moveNode(o, r, n, a) {
-  var u, g;
+  var u, m;
   const l = findNodeById(o, r), i = findNodeById(o, n);
   if (!l || !i) return !1;
   i.children || (i.model.children = []);
-  let c = (u = i == null ? void 0 : i.children) == null ? void 0 : u.findIndex((m) => m.model._id === r);
+  let c = (u = i == null ? void 0 : i.children) == null ? void 0 : u.findIndex((g) => g.model._id === r);
   l.drop(), c = Math.max(c, 0);
-  const p = (((g = l == null ? void 0 : l.model) == null ? void 0 : g._parent) || "root") === n && c <= a ? a - 1 : a;
+  const p = (((m = l == null ? void 0 : l.model) == null ? void 0 : m._parent) || "root") === n && c <= a ? a - 1 : a;
   try {
     i.addChildAtIndex(l, p);
-  } catch (m) {
-    return console.error("Error adding child to parent:", m), !1;
+  } catch (g) {
+    return console.error("Error adding child to parent:", g), !1;
   }
   return !0;
 }
@@ -434,10 +434,10 @@ function handleNewParentTextBlock(o, r, n) {
     });
     const d = o.map((u) => {
       if (u._id === n) {
-        const g = { ...u, content: "" };
-        return Object.keys(g).forEach((m) => {
-          m.startsWith("content-") && (g[m] = "");
-        }), g;
+        const m = { ...u, content: "" };
+        return Object.keys(m).forEach((g) => {
+          g.startsWith("content-") && (m[g] = "");
+        }), m;
       }
       return u;
     }), p = d.findIndex((u) => u._id === r._id);
@@ -453,8 +453,8 @@ function moveBlocksWithChildren(o, r, n, a) {
   const c = n || "root", p = new TreeModel().parse({ _id: "root", children: getBlocksTree(i) });
   if (moveNode(p, r, c, a)) {
     let u = flattenTree(p);
-    const g = u.find((m) => m._id === r);
-    return g && (g._parent = c === "root" ? null : c), u.shift(), n && (u = handleNewParentTextBlock(u, l, n)), u;
+    const m = u.find((g) => g._id === r);
+    return m && (m._parent = c === "root" ? null : c), u.shift(), n && (u = handleNewParentTextBlock(u, l, n)), u;
   }
   return i;
 }
@@ -477,22 +477,22 @@ const broadcastChannel = new BroadcastChannel("chaibuilder"), useBroadcastChanne
 }, removeNestedBlocks = (o, r) => {
   let n = [...o], a = [];
   r.forEach((d) => {
-    const p = n.find((m) => m._id === d);
+    const p = n.find((g) => g._id === d);
     if (!p || !p._parent) return;
-    const u = p._parent, g = n.filter((m) => m._parent === u);
-    if (g.length === 2) {
-      const m = g.find((h) => h._id !== d);
-      if (m && m._type === "Text") {
+    const u = p._parent, m = n.filter((g) => g._parent === u);
+    if (m.length === 2) {
+      const g = m.find((h) => h._id !== d);
+      if (g && g._type === "Text") {
         const h = n.find((f) => f._id === u);
         h && "content" in h && (n = n.map((f) => {
           if (f._id === u) {
-            const x = { ...f, content: m.content };
-            return Object.keys(m).forEach((y) => {
-              y.startsWith("content-") && (x[y] = m[y]);
+            const x = { ...f, content: g.content };
+            return Object.keys(g).forEach((y) => {
+              y.startsWith("content-") && (x[y] = g[y]);
             }), x;
           }
           return f;
-        }), a.push(m._id));
+        }), a.push(g._id));
       }
     }
   });
@@ -555,7 +555,7 @@ const broadcastChannel = new BroadcastChannel("chaibuilder"), useBroadcastChanne
         for (let p = 0; p < a.length; p++)
           d = moveBlocksWithChildren(d, a[p], l, i);
         return each(a, (p) => {
-          const u = find(d, (g) => g._id === p);
+          const u = find(d, (m) => m._id === p);
           u && n({ id: p, props: { _parent: u._parent || null } });
         }), r({ type: "blocks-updated", blocks: d }), d;
       });
@@ -569,27 +569,37 @@ const broadcastChannel = new BroadcastChannel("chaibuilder"), useBroadcastChanne
   };
 }, blockRepeaterDataAtom = atom({});
 blockRepeaterDataAtom.debugLabel = "blockRepeaterDataAtom";
-const useBlockRepeaterDataAtom = () => useAtom$1(blockRepeaterDataAtom), useAsyncProps = (o, r = []) => {
-  const [n, a] = useState({
+const useBlockRepeaterDataAtom = () => useAtom$1(blockRepeaterDataAtom), useAsyncProps = (o, r, n) => {
+  const [a, l] = useState({
     status: "idle",
     props: {},
     error: void 0
-  }), l = useBuilderProp("getBlockAsyncProps", async (u) => ({})), i = useSetAtom$1(blockRepeaterDataAtom), c = JSON.stringify([o == null ? void 0 : o._id, ...values(pick(o, r))]), d = get(n, "status"), p = (o == null ? void 0 : o._type) === "Repeater" && startsWith(o.repeaterItems, `{{${COLLECTION_PREFIX}`);
+  }), i = useBuilderProp("getBlockAsyncProps", async (g) => ({})), c = useSetAtom$1(blockRepeaterDataAtom), d = JSON.stringify([o == null ? void 0 : o._id, ...values(pick(o, r ?? []))]), p = (o == null ? void 0 : o._type) === "Repeater" && startsWith(o.repeaterItems, `{{${COLLECTION_PREFIX}`), u = (o == null ? void 0 : o._type) !== "Repeater" && !isUndefined(r);
   return useEffect(() => {
-    o && (a((u) => ({ ...u, status: "loading", props: {} })), l(o).then((u = {}) => {
-      p ? i((g) => ({
-        ...g,
-        [o._id]: { status: "loaded", props: isArray(u) ? u : {}, repeaterItems: o.repeaterItems }
-      })) : a((g) => ({ ...g, status: "loaded", props: isObject(u) ? u : {} }));
-    }).catch((u) => {
-      p ? i((g) => ({
-        ...g,
-        [o._id]: { status: "error", error: u, props: {} }
-      })) : a((g) => ({ ...g, status: "error", error: u, props: {} }));
-    }));
-  }, [o == null ? void 0 : o._id, c, p]), {
-    $loading: d === "loading",
-    ...o ? get(n, "props", {}) : {}
+    if (o) {
+      if (isFunction(n)) {
+        l((h) => ({ ...h, status: "loading", props: {} }));
+        const g = n({ block: o });
+        if (!isObject(g))
+          throw new Error("mockDataProvider should return an object");
+        l((h) => ({ ...h, status: "loaded", props: g }));
+        return;
+      }
+      !p && !u || (l((g) => ({ ...g, status: "loading", props: {} })), i({ block: o }).then((g = {}) => {
+        p ? (c((h) => ({
+          ...h,
+          [o._id]: { status: "loaded", props: isArray(g) ? g : [], repeaterItems: o.repeaterItems }
+        })), l((h) => ({ ...h, status: "loaded" }))) : l((h) => ({ ...h, status: "loaded", props: isObject(g) ? g : {} }));
+      }).catch((g) => {
+        p ? (c((h) => ({
+          ...h,
+          [o._id]: { status: "error", error: g, props: [] }
+        })), l((h) => ({ ...h, status: "error", error: g }))) : l((h) => ({ ...h, status: "error", error: g, props: {} }));
+      }));
+    }
+  }, [o == null ? void 0 : o._id, d, p, u, n]), {
+    $loading: get(a, "status") === "loading",
+    ...o ? get(a, "props", {}) : {}
   };
 }, chaiBuilderPropsAtom = atom(null);
 chaiBuilderPropsAtom.debugLabel = "chaiBuilderPropsAtom";
@@ -861,8 +871,8 @@ const undoRedoStateAtom = atom({
           y[b]._parent = i[f]._id;
       }
       const p = first(i);
-      let u, g;
-      return c && (u = find(o, { _id: c }), i[0]._parent = c, g = c), !(u ? canAcceptChildBlock(u == null ? void 0 : u._type, p._type) : !0) && u && (i[0]._parent = u._parent, g = u._parent), n(i, g, d), r([(h = first(i)) == null ? void 0 : h._id]), first(i);
+      let u, m;
+      return c && (u = find(o, { _id: c }), i[0]._parent = c, m = c), !(u ? canAcceptChildBlock(u == null ? void 0 : u._type, p._type) : !0) && u && (i[0]._parent = u._parent, m = u._parent), n(i, m, d), r([(h = first(i)) == null ? void 0 : h._id]), first(i);
     },
     [n, o, r]
   );
@@ -872,15 +882,15 @@ const undoRedoStateAtom = atom({
         const y = i.blocks;
         return a(y, c, d);
       }
-      const p = generateUUID(), u = getDefaultBlockProps(i.type), g = {
+      const p = generateUUID(), u = getDefaultBlockProps(i.type), m = {
         _type: i.type,
         _id: p,
         ...u,
         ...has(i, "_name") && { _name: i._name },
         ...has(i, "partialBlockId") && { partialBlockId: i.partialBlockId }
       };
-      let m, h;
-      return c && (m = find(o, { _id: c }), g._parent = c, h = c), !canAcceptChildBlock(m == null ? void 0 : m._type, g._type) && m && (g._parent = m._parent, h = m._parent), n([g], h, d), r([g._id]), g;
+      let g, h;
+      return c && (g = find(o, { _id: c }), m._parent = c, h = c), !canAcceptChildBlock(g == null ? void 0 : g._type, m._type) && g && (m._parent = g._parent, h = g._parent), n([m], h, d), r([m._id]), m;
     },
     [n, a, o, r]
   ), addPredefinedBlock: a };
@@ -1997,7 +2007,7 @@ function removeDuplicateClasses(o) {
   for (const l of n) {
     const i = l.property, c = r.indexOf(l.mq);
     for (let d = c + 1; d < r.length; d++) {
-      const p = r[d], u = n.find((g) => g.property === i && g.mq === p);
+      const p = r[d], u = n.find((m) => m.property === i && m.mq === p);
       if (u && u.cls === l.cls)
         a = a.replace(u.fullCls, "");
       else if (u && u.cls !== l.cls)
@@ -2282,7 +2292,7 @@ const useLanguages = () => {
           let p = "";
           o([r], { [i]: "" });
           for (let u = 0; u < d.length; u++)
-            p += d[u].join(""), o([r], { [i]: p }), await new Promise((g) => setTimeout(g, a));
+            p += d[u].join(""), o([r], { [i]: p }), await new Promise((m) => setTimeout(m, a));
         }
       }
     },
@@ -2326,7 +2336,7 @@ const getBlockWithChildren = (o, r) => {
     return isEmpty(c) ? !1 : (has(l, "_parent") && isEmpty(l._parent) && delete l._parent, { ...l, ...c });
   })
 ), addLangToPrompt = (o, r, n) => !r || n !== "content" ? o : `${o}. Generate content in ${get(LANGUAGES, r, r)} language.`, askAiProcessingAtom = atom(!1), useAskAi = () => {
-  const [o, r] = useAtom$1(askAiProcessingAtom), [n, a] = useState(null), l = useBuilderProp("askAiCallBack", null), i = useStreamMultipleBlocksProps(), c = useUpdateMultipleBlocksProps(), [d] = useBlocksStore(), { selectedLang: p, fallbackLang: u } = useLanguages(), g = p.length ? p : u, m = (h, f) => {
+  const [o, r] = useAtom$1(askAiProcessingAtom), [n, a] = useState(null), l = useBuilderProp("askAiCallBack", null), i = useStreamMultipleBlocksProps(), c = useUpdateMultipleBlocksProps(), [d] = useBlocksStore(), { selectedLang: p, fallbackLang: u } = useLanguages(), m = p.length ? p : u, g = (h, f) => {
     const x = cloneDeep(f.find((y) => y._id === h));
     for (const y in x) {
       const b = x[y];
@@ -2344,7 +2354,7 @@ const getBlockWithChildren = (o, r) => {
         if (l) {
           r(!0), a(null);
           try {
-            const b = p === u ? "" : p, v = h === "content" ? pickOnlyAIProps(cloneDeep(getBlockWithChildren(f, d)), p) : [m(f, d)], A = await l(h, addLangToPrompt(x, g, h), v, b), { blocks: w, error: E } = A;
+            const b = p === u ? "" : p, v = h === "content" ? pickOnlyAIProps(cloneDeep(getBlockWithChildren(f, d)), p) : [g(f, d)], A = await l(h, addLangToPrompt(x, m, h), v, b), { blocks: w, error: E } = A;
             if (E) {
               a(E);
               return;
@@ -2372,7 +2382,7 @@ const getBlockWithChildren = (o, r) => {
         p,
         u,
         d,
-        g,
+        m,
         c,
         i
       ]
@@ -2443,19 +2453,19 @@ const getBlockWithChildren = (o, r) => {
   return [o, a];
 }, copiedBlockIdsAtom = atom([]), useCopyBlocks = () => {
   const [o] = useBlocksStore(), [r, n] = useAtom$1(copiedBlockIdsAtom), a = useSetAtom$1(cutBlockIdsAtom), { getPartailBlocks: l } = usePartialBlocksStore(), i = useCallback(
-    (d) => d.some((p) => getDuplicatedBlocks(o, p, null).some((g) => g._type === "PartialBlock" || g._type === "GlobalBlock")),
+    (d) => d.some((p) => getDuplicatedBlocks(o, p, null).some((m) => m._type === "PartialBlock" || m._type === "GlobalBlock")),
     [o]
   ), c = useCallback(
     async (d, p = !1) => {
       try {
         n(d), a([]);
         const u = {
-          _chai_copied_blocks: d.flatMap((g) => {
-            const m = getDuplicatedBlocks(o, g, null);
+          _chai_copied_blocks: d.flatMap((m) => {
+            const g = getDuplicatedBlocks(o, m, null);
             if (!p)
-              return m;
+              return g;
             let h = [];
-            for (const f of m)
+            for (const f of g)
               if (f._type === "PartialBlock" || f._type === "GlobalBlock") {
                 let x = l(f.partialBlockId);
                 f._parent && (x == null ? void 0 : x.length) > 0 && (x = x.map((y) => (isEmpty(y._parent) && set(y, "_parent", f._parent), y))), h = [...h, ...x];
@@ -2501,11 +2511,11 @@ const getBlockWithChildren = (o, r) => {
       each(a, (c) => {
         const d = o.find((h) => h._id === c);
         l ? l === "root" && (l = null) : l = d._parent;
-        const g = filter(
+        const m = filter(
           o,
           (h) => isString(l) ? h._parent === l : !h._parent
-        ).indexOf(d) + 1, m = getDuplicatedBlocks(o, c, l);
-        n(m, l, g), i.push(get(m, "0._id", ""));
+        ).indexOf(d) + 1, g = getDuplicatedBlocks(o, c, l);
+        n(g, l, m), i.push(get(g, "0._id", ""));
       }), r(i);
     },
     [o, r]
@@ -2641,19 +2651,19 @@ const getBlockWithChildren = (o, r) => {
   );
   return map(i, (c) => {
     const d = o(c), p = a;
-    let { classes: u, baseClasses: g } = getSplitChaiClasses(get(d, l.prop, `${STYLES_KEY},`));
-    return each(p, (m) => {
-      const h = m.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), f = new RegExp(`(^|\\s)${h}(?=\\s|$)`, "g");
+    let { classes: u, baseClasses: m } = getSplitChaiClasses(get(d, l.prop, `${STYLES_KEY},`));
+    return each(p, (g) => {
+      const h = g.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), f = new RegExp(`(^|\\s)${h}(?=\\s|$)`, "g");
       u = u.replace(f, " ").replace(/\s+/g, " ").trim();
-      const x = first(m.split(":"));
-      includes(["2xl", "xl", "lg", "md", "sm"], x) && p.push(m.split(":").pop().trim());
-    }), each(p, (m) => {
-      const h = m.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), f = new RegExp(`(^|\\s)${h}(?=\\s|$)`, "g");
-      g = g.replace(f, " ").replace(/\s+/g, " ").trim();
+      const x = first(g.split(":"));
+      includes(["2xl", "xl", "lg", "md", "sm"], x) && p.push(g.split(":").pop().trim());
+    }), each(p, (g) => {
+      const h = g.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), f = new RegExp(`(^|\\s)${h}(?=\\s|$)`, "g");
+      m = m.replace(f, " ").replace(/\s+/g, " ").trim();
     }), {
       ids: [d._id],
       props: {
-        [l.prop]: `${STYLES_KEY}${g},${u}`
+        [l.prop]: `${STYLES_KEY}${m},${u}`
       }
     };
   });
@@ -2752,11 +2762,11 @@ const useSidebarActivePanel = () => useAtom$1(sidebarActivePanelAtom), CONTROLS
     return "VERTICAL";
   }
 }, isDisabledControl = (o, r, n) => !!(o && (n === "UP" || n === "LEFT") || r && (n === "DOWN" || n === "RIGHT")), useBlockController = (o, r) => {
-  const [n] = useBlocksStore(), { document: a } = useFrame(), { moveBlocks: l } = useBlocksStoreUndoableActions(), i = get(o, "_id"), c = get(o, "_parent"), d = filter(n, (x) => c ? get(x, "_parent") === c : !get(x, "_parent")), p = (d == null ? void 0 : d.length) <= 1, u = findIndex(d, { _id: i }), g = u <= 0, m = u + 1 === (d == null ? void 0 : d.length), h = getParentBlockOrientation(c, i, a), f = useCallback(
+  const [n] = useBlocksStore(), { document: a } = useFrame(), { moveBlocks: l } = useBlocksStoreUndoableActions(), i = get(o, "_id"), c = get(o, "_parent"), d = filter(n, (x) => c ? get(x, "_parent") === c : !get(x, "_parent")), p = (d == null ? void 0 : d.length) <= 1, u = findIndex(d, { _id: i }), m = u <= 0, g = u + 1 === (d == null ? void 0 : d.length), h = getParentBlockOrientation(c, i, a), f = useCallback(
     (x) => {
-      isDisabledControl(g, m, x) || p || (x === "UP" || x === "LEFT" ? l([i], c || null, u - 1) : (x === "DOWN" || x === "RIGHT") && l([i], c || null, u + 2), r());
+      isDisabledControl(m, g, x) || p || (x === "UP" || x === "LEFT" ? l([i], c || null, u - 1) : (x === "DOWN" || x === "RIGHT") && l([i], c || null, u + 2), r());
     },
-    [g, m, p, u, i, c, r]
+    [m, g, p, u, i, c, r]
   );
   return useHotkeys(
     "shift+up, shift+down, shift+left, shift+right",
@@ -2766,7 +2776,7 @@ const useSidebarActivePanel = () => useAtom$1(sidebarActivePanelAtom), CONTROLS
     },
     { document: a == null ? void 0 : a.contentDocument },
     [f]
-  ), { isOnlyChild: p, isFirstBlock: g, isLastBlock: m, moveBlock: f, orientation: h };
+  ), { isOnlyChild: p, isFirstBlock: m, isLastBlock: g, moveBlock: f, orientation: h };
 }, BlockController = ({ block: o, updateFloatingBar: r }) => {
   const { isOnlyChild: n, isFirstBlock: a, isLastBlock: l, moveBlock: i, orientation: c } = useBlockController(
     o,
@@ -2774,12 +2784,12 @@ const useSidebarActivePanel = () => useAtom$1(sidebarActivePanelAtom), CONTROLS
   );
   return n ? null : /* @__PURE__ */ jsx(Fragment, { children: CONTROLS.map(({ ControlIcon: d, dir: p, key: u }) => {
     if (c !== p) return null;
-    const g = isDisabledControl(a, l, u);
-    return g ? null : /* @__PURE__ */ jsx(
+    const m = isDisabledControl(a, l, u);
+    return m ? null : /* @__PURE__ */ jsx(
       d,
       {
         onClick: () => i(u),
-        className: `${g ? "pointer-events-none cursor-not-allowed opacity-50" : "duration-300 hover:scale-95 hover:opacity-80"}`
+        className: `${m ? "pointer-events-none cursor-not-allowed opacity-50" : "duration-300 hover:scale-95 hover:opacity-80"}`
       },
       u
     );
@@ -2901,7 +2911,7 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span"],
       i([null]);
   }, [n, r]), /* @__PURE__ */ jsx(BlockFloatingSelector, { block: o, selectedBlockElement: a[0] });
 }, BlockFloatingSelector = ({ block: o, selectedBlockElement: r }) => {
-  const n = useRemoveBlocks(), a = useDuplicateBlocks(), [, l] = useSelectedBlockIds(), [, i] = useHighlightBlockId(), [, c] = useSelectedStylingBlocks(), { hasPermission: d } = usePermissions(), [p] = useAtom$1(inlineEditingActiveAtom), { document: u } = useFrame(), { floatingStyles: g, refs: m, update: h } = useFloating({
+  const n = useRemoveBlocks(), a = useDuplicateBlocks(), [, l] = useSelectedBlockIds(), [, i] = useHighlightBlockId(), [, c] = useSelectedStylingBlocks(), { hasPermission: d } = usePermissions(), [p] = useAtom$1(inlineEditingActiveAtom), { document: u } = useFrame(), { floatingStyles: m, refs: g, update: h } = useFloating({
     placement: "top-start",
     middleware: [shift(), flip()],
     elements: { reference: r }
@@ -2913,8 +2923,8 @@ const INLINE_EDITABLE_BLOCKS = ["Heading", "Paragraph", "Text", "Link", "Span"],
     {
       role: "button",
       tabIndex: 0,
-      ref: m.setFloating,
-      style: g,
+      ref: g.setFloating,
+      style: m,
       onClick: (y) => {
         y.stopPropagation(), y.preventDefault();
       },
@@ -3012,17 +3022,17 @@ class Content extends Component {
 class Frame extends Component {
   constructor(n, a) {
     super(n, a);
-    H(this, "setRef", (n) => {
+    U(this, "setRef", (n) => {
       this.nodeRef.current = n;
       const { forwardedRef: a } = this.props;
       typeof a == "function" ? a(n) : a && (a.current = n);
     });
-    H(this, "handleLoad", () => {
+    U(this, "handleLoad", () => {
       clearInterval(this.loadCheck), this.state.iframeLoaded || this.setState({ iframeLoaded: !0 });
     });
     // In certain situations on a cold cache DOMContentLoaded never gets called
     // fallback to an interval to check if that's the case
-    H(this, "loadCheck", () => setInterval(() => {
+    U(this, "loadCheck", () => setInterval(() => {
       this.handleLoad();
     }, 500));
     this._isMounted = !1, this.nodeRef = React__default.createRef(), this.state = { iframeLoaded: !1 };
@@ -3059,7 +3069,7 @@ class Frame extends Component {
     return delete n.head, delete n.initialContent, delete n.mountTarget, delete n.contentDidMount, delete n.contentDidUpdate, delete n.forwardedRef, /* @__PURE__ */ jsx("iframe", { ...n, ref: this.setRef, onLoad: this.handleLoad, children: this.state.iframeLoaded && this.renderFrameContents() });
   }
 }
-H(Frame, "defaultProps", {
+U(Frame, "defaultProps", {
   style: {},
   head: null,
   children: void 0,
@@ -3071,14 +3081,14 @@ H(Frame, "defaultProps", {
   initialContent: '<!DOCTYPE html><html><head></head><body><div class="frame-root"></div></body></html>'
 });
 const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame, { ...o, forwardedRef: r })), useKeyEventWatcher = (o) => {
-  const [r, n] = useSelectedBlockIds(), a = useSelectedBlock(), l = useRemoveBlocks(), i = useDuplicateBlocks(), { undo: c, redo: d } = useUndoManager(), [, p] = useCutBlockIds(), [, u] = useCopyBlocks(), { canPaste: g, pasteBlocks: m } = usePasteBlocks(), h = o ? { document: o } : {};
+  const [r, n] = useSelectedBlockIds(), a = useSelectedBlock(), l = useRemoveBlocks(), i = useDuplicateBlocks(), { undo: c, redo: d } = useUndoManager(), [, p] = useCutBlockIds(), [, u] = useCopyBlocks(), { canPaste: m, pasteBlocks: g } = usePasteBlocks(), h = o ? { document: o } : {};
   useHotkeys("ctrl+z,command+z", () => c(), {}, [c]), useHotkeys("ctrl+y,command+y", () => d(), {}, [d]), useHotkeys("ctrl+x,command+x", () => p(r), {}, [r, p]), useHotkeys("ctrl+c,command+c", () => u(r), {}, [r, u]), useHotkeys(
     "ctrl+v,command+v",
     () => {
-      g(r[0]) && m(r);
+      m(r[0]) && g(r);
     },
     { ...h, preventDefault: !0 },
-    [r, g, m]
+    [r, m, g]
   ), useHotkeys("esc", () => n([]), h, [n]), useHotkeys("ctrl+d,command+d", () => i(r), { ...h, preventDefault: !0 }, [
     r,
     i
@@ -3202,11 +3212,12 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
   }, [a, l]);
   return /* @__PURE__ */ jsx("div", { id: "main-content", onClick: d, className: "h-full w-full p-8 pb-0", ref: i, children: o });
 }, MayBeAsyncPropsWrapper = ({ children: o, block: r }) => {
-  const n = useMemo(() => getRegisteredChaiBlock(r._type), [r._type]), a = has(n, "asyncProps"), l = useAsyncProps(
+  const n = useMemo(() => getRegisteredChaiBlock(r._type), [r._type]), a = has(n, "dataProviderDependencies"), l = get(n, "dataProvider"), i = useAsyncProps(
     a ? r : void 0,
-    get(n, "asyncProps", [])
+    get(n, "dataProviderDependencies"),
+    l ?? void 0
   );
-  return o(l);
+  return o(i);
 }, ErrorFallback = () => /* @__PURE__ */ jsx("div", { className: "flex min-h-[100px] items-center justify-center bg-red-50 p-2 text-center text-red-500", children: "Something went wrong." }), useBlockRuntimeProps = () => {
   const [o] = useBlocksStore();
   return useCallback(
@@ -3380,8 +3391,8 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
           })
         ],
         onUpdate: ({ editor: u }) => a((u == null ? void 0 : u.getHTML()) || ""),
-        onBlur: ({ editor: u, event: g }) => {
-          const m = g.relatedTarget, h = i.querySelector(".ProseMirror"), f = i.querySelector(".tippy-box"), x = h == null ? void 0 : h.contains(m), y = f == null ? void 0 : f.contains(m);
+        onBlur: ({ editor: u, event: m }) => {
+          const g = m.relatedTarget, h = i.querySelector(".ProseMirror"), f = i.querySelector(".tippy-box"), x = h == null ? void 0 : h.contains(g), y = f == null ? void 0 : f.contains(g);
           if (!x && !y) {
             const b = (u == null ? void 0 : u.getHTML()) || "";
             n(b);
@@ -3399,11 +3410,11 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
       });
     }, [c]);
     const d = useMemo(() => {
-      var m;
+      var g;
       const u = "max-w-none shadow-none outline outline-[2px] outline-green-500 [&_*]:shadow-none";
       if (!r) return u;
-      const g = ((m = r == null ? void 0 : r.className) == null ? void 0 : m.replace("sr-only", "")) || "";
-      return `${u} ${g}`;
+      const m = ((g = r == null ? void 0 : r.className) == null ? void 0 : g.replace("sr-only", "")) || "";
+      return `${u} ${m}`;
     }, [r]), p = useCallback(
       (u) => {
         u.key === "Escape" && l(u);
@@ -3451,9 +3462,9 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
         (h.key === "Enter" || h.key === "Escape") && i(h);
       },
       [i]
-    ), g = useCallback(() => {
+    ), m = useCallback(() => {
       n();
-    }, [n]), m = useMemo(() => {
+    }, [n]), g = useMemo(() => {
       var h;
       return {
         id: "active-inline-editing-element",
@@ -3471,31 +3482,31 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
     }, [o == null ? void 0 : o.className, o == null ? void 0 : o.style]);
     return /* @__PURE__ */ jsx(Fragment, { children: createElement(p, {
       ref: a,
-      onBlur: g,
+      onBlur: m,
       onKeyDown: u,
-      ...m
+      ...g
     }) });
   }
 ), WithBlockTextEditor = memo(
   ({ block: o, children: r }) => {
-    const n = "content", { document: a } = useFrame(), [l, i] = useAtom$1(inlineEditingActiveAtom), [c, d] = useState(null), p = useRef(null), { clearHighlight: u } = useBlockHighlight(), g = useUpdateBlocksProps(), { selectedLang: m } = useLanguages(), [, h] = useSelectedBlockIds(), f = useRef(null), x = l, { blockContent: y, blockType: b } = useMemo(() => {
+    const n = "content", { document: a } = useFrame(), [l, i] = useAtom$1(inlineEditingActiveAtom), [c, d] = useState(null), p = useRef(null), { clearHighlight: u } = useBlockHighlight(), m = useUpdateBlocksProps(), { selectedLang: g } = useLanguages(), [, h] = useSelectedBlockIds(), f = useRef(null), x = l, { blockContent: y, blockType: b } = useMemo(() => {
       var C;
       const _ = o._type;
       let S = o[n];
       const B = getRegisteredChaiBlock(o._type);
-      return m && ((C = B == null ? void 0 : B.i18nProps) == null ? void 0 : C.includes(n)) && has(o, `${n}-${m}`) && (S = get(o, `${n}-${m}`)), { blockContent: S, blockType: _ };
-    }, [o, m]), v = useCallback(
+      return g && ((C = B == null ? void 0 : B.i18nProps) == null ? void 0 : C.includes(n)) && has(o, `${n}-${g}`) && (S = get(o, `${n}-${g}`)), { blockContent: S, blockType: _ };
+    }, [o, g]), v = useCallback(
       (_) => {
         var B;
         const S = _ || ((B = p.current) == null ? void 0 : B.innerText);
-        g([x], { [n]: S }), d(null), i(null), h([]);
+        m([x], { [n]: S }), d(null), i(null), h([]);
       },
-      [x, g, i, h, m]
+      [x, m, i, h, g]
     ), A = useDebouncedCallback(
       (_) => {
-        g([x], { [n]: _ });
+        m([x], { [n]: _ });
       },
-      [x, o, g, m],
+      [x, o, m, g],
       1e3
     ), w = useCallback(
       (_) => {
@@ -3504,7 +3515,7 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
           f.current = null, h([S]);
         }, 100);
       },
-      [h, x, m]
+      [h, x, g]
     );
     useEffect(() => {
       var S;
@@ -3531,7 +3542,7 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
         onChange: A,
         onEscape: w
       }
-    )) : null, [c, x, b, y, v, m]);
+    )) : null, [c, x, b, y, v, g]);
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       E,
       r
@@ -3566,12 +3577,12 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
   blockAtom: r,
   children: n
 }) => {
-  const [a] = useAtom$1(inlineEditingActiveAtom), [l] = useAtom$1(r), i = useMemo(() => getRegisteredChaiBlock(l._type), [l._type]), { selectedLang: c, fallbackLang: d } = useLanguages(), p = useBlockRuntimeProps(), u = usePageExternalData(), [g] = useHiddenBlockIds(), [m] = useAtom$1(dataBindingActiveAtom), h = get(i, "component", null), { index: f, key: x } = useContext(RepeaterContext), y = useMemo(
-    () => m ? applyBindingToBlockProps(applyLanguage(l, c, i), u, {
+  const [a] = useAtom$1(inlineEditingActiveAtom), [l] = useAtom$1(r), i = useMemo(() => getRegisteredChaiBlock(l._type), [l._type]), { selectedLang: c, fallbackLang: d } = useLanguages(), p = useBlockRuntimeProps(), u = usePageExternalData(), [m] = useHiddenBlockIds(), [g] = useAtom$1(dataBindingActiveAtom), h = get(i, "component", null), { index: f, key: x } = useContext(RepeaterContext), y = useMemo(
+    () => g ? applyBindingToBlockProps(applyLanguage(l, c, i), u, {
       index: f,
       key: x
     }) : applyLanguage(l, c, i),
-    [l, c, i, u, m, f, x]
+    [l, c, i, u, g, f, x]
   ), b = useMemo(() => getBlockTagAttributes(l), [l, getBlockTagAttributes]), v = useMemo(
     () => p(l._id, getBlockRuntimeProps(l._type)),
     [l._id, l._type, p, getBlockRuntimeProps]
@@ -3596,7 +3607,7 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
       o
     ]
   ), w = useMemo(() => !CORE_BLOCKS.includes(l._type), [l._type]);
-  if (isNull(h) || g.includes(l._id)) return null;
+  if (isNull(h) || m.includes(l._id)) return null;
   let E = /* @__PURE__ */ jsx(Suspense, { children: createElement(h, {
     ...A,
     children: n({
@@ -3629,7 +3640,7 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
   );
   return map(l, (c) => {
     const d = a(c._id);
-    return d ? /* @__PURE__ */ jsx(MayBeAsyncPropsWrapper, { block: c, children: (p) => /* @__PURE__ */ jsx(BlockRenderer, { blockAtom: d, asyncProps: p, children: ({ _id: u, _type: g, partialBlockId: m, repeaterItems: h, $repeaterItemsKey: f }) => g === "Repeater" ? isArray(h) && h.map((x, y) => /* @__PURE__ */ jsx(RepeaterContext.Provider, { value: { index: y, key: f }, children: /* @__PURE__ */ jsx(BlocksRenderer, { splitAtoms: n, blocks: o, parent: c._id }) }, `${u}-${y}`)) : g === "GlobalBlock" || g === "PartialBlock" ? /* @__PURE__ */ jsx(Provider, { store: builderStore, children: /* @__PURE__ */ jsx(PartialBlocksRenderer, { partialBlockId: m }) }) : i(u) ? /* @__PURE__ */ jsx(BlocksRenderer, { splitAtoms: n, blocks: o, parent: c._id }) : null }) }, c._id) : null;
+    return d ? /* @__PURE__ */ jsx(MayBeAsyncPropsWrapper, { block: c, children: (p) => /* @__PURE__ */ jsx(BlockRenderer, { blockAtom: d, asyncProps: p, children: ({ _id: u, _type: m, partialBlockId: g, repeaterItems: h, $repeaterItemsKey: f }) => m === "Repeater" ? isArray(h) && h.map((x, y) => /* @__PURE__ */ jsx(RepeaterContext.Provider, { value: { index: y, key: f }, children: /* @__PURE__ */ jsx(BlocksRenderer, { splitAtoms: n, blocks: o, parent: c._id }) }, `${u}-${y}`)) : m === "GlobalBlock" || m === "PartialBlock" ? /* @__PURE__ */ jsx(Provider, { store: builderStore, children: /* @__PURE__ */ jsx(PartialBlocksRenderer, { partialBlockId: g }) }) : i(u) ? /* @__PURE__ */ jsx(BlocksRenderer, { splitAtoms: n, blocks: o, parent: c._id }) : null }) }, c._id) : null;
   });
 }, PageBlocksRenderer = () => {
   const [o] = useBlocksStore();
@@ -3642,18 +3653,18 @@ const ChaiFrame = React__default.forwardRef((o, r) => /* @__PURE__ */ jsx(Frame,
     const { width: d, height: p } = o;
     if (d < r) {
       const u = parseFloat((d / r).toFixed(2).toString());
-      let g = {};
-      const m = p * u, h = d * u;
-      p && (g = {
+      let m = {};
+      const g = p * u, h = d * u;
+      p && (m = {
         // Eureka! This is the formula to calculate the height of the scaled element. Thank you ChatGPT 4
-        height: 100 + (p - m) / m * 100 + "%",
+        height: 100 + (p - g) / g * 100 + "%",
         width: 100 + (d - h) / h * 100 + "%"
       }), i({
         position: "relative",
         top: 0,
         transform: `scale(${u})`,
         transformOrigin: a === "rtl" ? "top right" : "top left",
-        ...g,
+        ...m,
         maxWidth: "none"
         // TODO: Add max-width to the wrapper
       }), n(u * 100);
@@ -3680,8 +3691,8 @@ const CanvasEventsWatcher = () => {
       if (d) {
         const p = d.getAttribute("data-style-prop");
         if (p) {
-          const u = d.getAttribute("data-style-id"), g = d.getAttribute("data-block-parent");
-          n([{ id: u, prop: p, blockId: g }]);
+          const u = d.getAttribute("data-style-id"), m = d.getAttribute("data-block-parent");
+          n([{ id: u, prop: p, blockId: m }]);
         }
       }
     }, 100);
@@ -3691,13 +3702,13 @@ const CanvasEventsWatcher = () => {
     i.includes(p) || c == null || c.closeAll(), o([p]);
   }), usePubSub(CHAI_BUILDER_EVENTS.CANVAS_BLOCK_STYLE_SELECTED, (d) => {
     if (!d) return;
-    const { blockId: p, styleId: u, styleProp: g } = d;
-    p && (i.includes(p) || c == null || c.closeAll(), n([{ id: u, prop: g, blockId: p }]), o([p]));
+    const { blockId: p, styleId: u, styleProp: m } = d;
+    p && (i.includes(p) || c == null || c.closeAll(), n([{ id: u, prop: m, blockId: p }]), o([p]));
   }), usePubSub(CHAI_BUILDER_EVENTS.CLEAR_CANVAS_SELECTION, () => {
     l(), o([]), n([]);
   }), null;
 }, StaticCanvas = () => {
-  const [o] = useCanvasDisplayWidth(), [, r] = useHighlightBlockId(), n = useRef(null), a = useRef(null), [l, i] = useState({ width: 0, height: 0 }), c = useCanvasScale(l), [, d] = useAtom$1(canvasIframeAtom), p = useBuilderProp("loading", !1), u = useBuilderProp("htmlDir", "ltr"), g = useCallback(
+  const [o] = useCanvasDisplayWidth(), [, r] = useHighlightBlockId(), n = useRef(null), a = useRef(null), [l, i] = useState({ width: 0, height: 0 }), c = useCanvasScale(l), [, d] = useAtom$1(canvasIframeAtom), p = useBuilderProp("loading", !1), u = useBuilderProp("htmlDir", "ltr"), m = useCallback(
     (h) => {
       i((f) => ({ ...f, width: h }));
     },
@@ -3708,11 +3719,11 @@ const CanvasEventsWatcher = () => {
     const { clientWidth: h, clientHeight: f } = a.current;
     i({ width: h, height: f });
   }, [a, o]);
-  const m = useMemo(() => {
+  const g = useMemo(() => {
     let h = IframeInitialContent;
     return h = h.replace("__HTML_DIR__", u), h;
   }, [u]);
-  return /* @__PURE__ */ jsx(ResizableCanvasWrapper, { onMount: g, onResize: g, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(ResizableCanvasWrapper, { onMount: m, onResize: m, children: /* @__PURE__ */ jsx(
     "div",
     {
       onMouseLeave: () => setTimeout(() => r(""), 300),
@@ -3726,7 +3737,7 @@ const CanvasEventsWatcher = () => {
           id: "canvas-iframe",
           style: { ...c, ...isEmpty(c) ? { width: `${o}px` } : {} },
           className: "relative mx-auto box-content h-full w-full max-w-full shadow-lg transition-all duration-300 ease-linear",
-          initialContent: m,
+          initialContent: g,
           children: [
             /* @__PURE__ */ jsx(KeyboardHandler, {}),
             /* @__PURE__ */ jsx(BlockSelectionHighlighter, {}),
@@ -3821,15 +3832,15 @@ const CanvasEventsWatcher = () => {
     /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: a("Paste SVG code to use as an icon") })
   ] });
 }, DefaultMediaManager = ({ close: o, onSelect: r, mode: n = "image" }) => {
-  const [a, l] = useState(""), [i, c] = useState(!1), [d, p] = useState(!1), [u, g] = useState(null), m = async (f) => {
+  const [a, l] = useState(""), [i, c] = useState(!1), [d, p] = useState(!1), [u, m] = useState(null), g = async (f) => {
     if (!f.trim()) {
-      p(!1), g("Please enter a URL");
+      p(!1), m("Please enter a URL");
       return;
     }
     try {
-      c(!0), g(null), p(!0), g(null);
+      c(!0), m(null), p(!0), m(null);
     } catch {
-      p(!1), g("Error validating URL");
+      p(!1), m("Error validating URL");
     } finally {
       c(!1);
     }
@@ -3847,7 +3858,7 @@ const CanvasEventsWatcher = () => {
           placeholder: h(`Enter ${n} URL`),
           value: a,
           onChange: (f) => l(f.target.value),
-          onKeyUp: () => m(a)
+          onKeyUp: () => g(a)
         }
       ),
       /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
@@ -3883,17 +3894,17 @@ const CanvasEventsWatcher = () => {
 };
 MediaManagerModal.displayName = "MediaManagerModal";
 const ImagePickerField = ({ value: o, onChange: r, id: n, onBlur: a }) => {
-  const { t: l } = useTranslation(), i = useSelectedBlock(), c = useUpdateBlocksProps(), d = (g) => {
-    const m = isArray(g) ? first(g) : g;
-    if (m) {
-      r(m == null ? void 0 : m.url);
-      const h = m == null ? void 0 : m.width, f = m == null ? void 0 : m.height;
+  const { t: l } = useTranslation(), i = useSelectedBlock(), c = useUpdateBlocksProps(), d = (m) => {
+    const g = isArray(m) ? first(m) : m;
+    if (g) {
+      r(g == null ? void 0 : g.url);
+      const h = g == null ? void 0 : g.width, f = g == null ? void 0 : g.height;
       if (i != null && i._id) {
         const x = {
           ...h && { width: h },
           ...f && { height: f },
-          ...m.description && { alt: m.description },
-          ...m.id && { assetId: m.id }
+          ...g.description && { alt: g.description },
+          ...g.id && { assetId: g.id }
         };
         if (isEmpty(x)) return;
         c([i._id], x);
@@ -3931,25 +3942,25 @@ const ImagePickerField = ({ value: o, onChange: r, id: n, onBlur: a }) => {
           className: "text-xs",
           placeholder: l("Enter image URL"),
           value: o,
-          onBlur: ({ target: { value: g } }) => a(n, g),
-          onChange: (g) => r(g.target.value)
+          onBlur: ({ target: { value: m } }) => a(n, m),
+          onChange: (m) => r(m.target.value)
         }
       )
     ] })
   ] });
 }, PathDropdown = ({ data: o, onSelect: r, dataType: n }) => {
-  const [a, l] = React__default.useState([]), [i, c] = React__default.useState(o), d = (m) => Array.isArray(m) ? "array" : typeof m == "object" && m !== null ? "object" : "value", p = React__default.useCallback(
-    (m) => {
+  const [a, l] = React__default.useState([]), [i, c] = React__default.useState(o), d = (g) => Array.isArray(g) ? "array" : typeof g == "object" && g !== null ? "object" : "value", p = React__default.useCallback(
+    (g) => {
       const h = (f) => n === "value" ? f === "value" || f === "object" : n === "array" ? f === "array" : f === n;
-      m.type === "object" ? (l((f) => [...f, m.key]), c(m.value)) : h(m.type) && r([...a, m.key].join("."), n);
+      g.type === "object" ? (l((f) => [...f, g.key]), c(g.value)) : h(g.type) && r([...a, g.key].join("."), n);
     },
     [a, r, n]
   ), u = React__default.useCallback(() => {
     if (a.length > 0) {
-      const m = a.slice(0, -1);
-      l(m), c(m.reduce((h, f) => h[f], o));
+      const g = a.slice(0, -1);
+      l(g), c(g.reduce((h, f) => h[f], o));
     }
-  }, [a, o]), g = React__default.useMemo(() => i ? Object.entries(i).map(([m, h]) => ({ key: m, value: h, type: d(h) })).filter((m) => !startsWith(m.key, REPEATER_PREFIX) && m.key.includes("/") ? !1 : n === "value" ? m.type === "value" || m.type === "object" : n === "array" ? m.type === "array" || m.type === "object" : n === "object" ? m.type === "object" : !0) : [], [i, n]);
+  }, [a, o]), m = React__default.useMemo(() => i ? Object.entries(i).map(([g, h]) => ({ key: g, value: h, type: d(h) })).filter((g) => !startsWith(g.key, REPEATER_PREFIX) && g.key.includes("/") ? !1 : n === "value" ? g.type === "value" || g.type === "object" : n === "array" ? g.type === "array" || g.type === "object" : n === "object" ? g.type === "object" : !0) : [], [i, n]);
   return /* @__PURE__ */ jsxs(Command, { className: "fields-command", children: [
     /* @__PURE__ */ jsx(CommandInput, { className: "border-none", placeholder: "Search..." }),
     /* @__PURE__ */ jsxs(CommandList, { children: [
@@ -3959,36 +3970,36 @@ const ImagePickerField = ({ value: o, onChange: r, id: n, onBlur: a }) => {
           /* @__PURE__ */ jsx(ChevronLeft, { className: "mr-2 h-4 w-4" }),
           "Back"
         ] }),
-        g.map((m) => /* @__PURE__ */ jsxs(
+        m.map((g) => /* @__PURE__ */ jsxs(
           CommandItem,
           {
-            value: m.key,
+            value: g.key,
             disabled: !1,
-            onSelect: () => p(m),
+            onSelect: () => p(g),
             className: "flex items-center justify-between",
             children: [
               /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-x-2", children: [
-                startsWith(m.key, REPEATER_PREFIX) ? /* @__PURE__ */ jsx(LoopIcon, {}) : startsWith(m.key, COLLECTION_PREFIX) ? /* @__PURE__ */ jsx(DatabaseIcon, {}) : null,
-                startsWith(m.key, REPEATER_PREFIX) ? "Repeater Data" : startsWith(m.key, COLLECTION_PREFIX) ? m.key.replace(COLLECTION_PREFIX, "") : m.key
+                startsWith(g.key, REPEATER_PREFIX) ? /* @__PURE__ */ jsx(LoopIcon, {}) : startsWith(g.key, COLLECTION_PREFIX) ? /* @__PURE__ */ jsx(DatabaseIcon, {}) : null,
+                startsWith(g.key, REPEATER_PREFIX) ? "Repeater Data" : startsWith(g.key, COLLECTION_PREFIX) ? g.key.replace(COLLECTION_PREFIX, "") : g.key
               ] }),
               /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-                n === "object" && m.type === "object" && /* @__PURE__ */ jsx(
+                n === "object" && g.type === "object" && /* @__PURE__ */ jsx(
                   Button,
                   {
                     size: "sm",
                     variant: "ghost",
                     className: "h-6 px-2 hover:bg-primary hover:text-primary-foreground",
                     onClick: (h) => {
-                      h.stopPropagation(), r([...a, m.key].join("."), n);
+                      h.stopPropagation(), r([...a, g.key].join("."), n);
                     },
                     children: "Select"
                   }
                 ),
-                m.type === "object" && /* @__PURE__ */ jsx("div", { className: "cursor-pointer rounded p-1 hover:bg-muted", children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 opacity-50" }) })
+                g.type === "object" && /* @__PURE__ */ jsx("div", { className: "cursor-pointer rounded p-1 hover:bg-muted", children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 opacity-50" }) })
               ] })
             ]
           },
-          m.key
+          g.key
         ))
       ] })
     ] })
@@ -4040,12 +4051,12 @@ const DataBindingSelector = ({
 }) => {
   const l = usePageExternalData(), i = useSelectedBlockHierarchy(), c = useSelectedBlock(), d = useMemo(() => {
     if (i.length === 1) return "";
-    const g = i.find((f) => f._type === "Repeater"), h = get(g, "repeaterItems", "").replace(/\{\{(.*)\}\}/g, "$1");
-    return `${REPEATER_PREFIX}${startsWith(h, COLLECTION_PREFIX) ? `${h}/${g._id}` : h}`;
+    const m = i.find((f) => f._type === "Repeater"), h = get(m, "repeaterItems", "").replace(/\{\{(.*)\}\}/g, "$1");
+    return `${REPEATER_PREFIX}${startsWith(h, COLLECTION_PREFIX) ? `${h}/${m._id}` : h}`;
   }, [i]), p = useMemo(() => first(get(l, d.replace(REPEATER_PREFIX, ""), [])), [d, l]), u = useCallback(
-    (g, m) => {
-      if (g = isEmpty(d) ? g : g.replace(`${d}`, "$index"), m === "array" || m === "object") {
-        r(`{{${g}}}`, {}, n);
+    (m, g) => {
+      if (m = isEmpty(d) ? m : m.replace(`${d}`, "$index"), g === "array" || g === "object") {
+        r(`{{${m}}}`, {}, n);
         return;
       }
       const h = (b) => /[.,!?;:]/.test(b), f = (b, v, A) => {
@@ -4062,7 +4073,7 @@ const DataBindingSelector = ({
       if (y && (y.querySelector(".ProseMirror") || y.__chaiRTE)) {
         const b = y.__chaiRTE;
         if (b) {
-          const v = `{{${g}}}`;
+          const v = `{{${m}}}`;
           b.commands.focus();
           const { from: A, to: w } = b.state.selection;
           if (A !== w)
@@ -4080,11 +4091,11 @@ const DataBindingSelector = ({
       } else {
         const b = x, v = b.selectionStart || 0, A = b.value || "", w = b.selectionEnd || v;
         if (w > v) {
-          const N = `{{${g}}}`, { text: C } = f(A, v, N), k = A.slice(0, v) + C + A.slice(w);
+          const N = `{{${m}}}`, { text: C } = f(A, v, N), k = A.slice(0, v) + C + A.slice(w);
           r(k, {}, n);
           return;
         }
-        const _ = `{{${g}}}`, { text: S } = f(A, v, _), B = A.slice(0, v) + S + A.slice(v);
+        const _ = `{{${m}}}`, { text: S } = f(A, v, _), B = A.slice(0, v) + S + A.slice(v);
         r(B, {}, n);
       }
     },
@@ -4107,11 +4118,11 @@ const DataBindingSelector = ({
   onChange: n
 }) => {
   var N;
-  const { t: a } = useTranslation(), l = useBuilderProp("searchPageTypeItems", (C, k) => []), [i, c] = useState(!1), [d, p] = useState(!1), [u, g] = useState("page"), [m, h] = useState(""), [f, x] = useState([]), [y, b] = useState(-1), v = useRef(null), A = (N = r == null ? void 0 : r.find((C) => C.key === u)) == null ? void 0 : N.name;
+  const { t: a } = useTranslation(), l = useBuilderProp("searchPageTypeItems", (C, k) => []), [i, c] = useState(!1), [d, p] = useState(!1), [u, m] = useState("page"), [g, h] = useState(""), [f, x] = useState([]), [y, b] = useState(-1), v = useRef(null), A = (N = r == null ? void 0 : r.find((C) => C.key === u)) == null ? void 0 : N.name;
   useEffect(() => {
     if (h(""), x([]), b(-1), p(!1), !o || i || !startsWith(o, "pageType:")) return;
     const C = split(o, ":"), k = get(C, 1, "page") || "page";
-    g(k), (async () => {
+    m(k), (async () => {
       const j = await l(k, [get(C, 2, "page")]);
       j && Array.isArray(j) && h(get(j, [0, "name"], ""));
     })();
@@ -4160,20 +4171,20 @@ const DataBindingSelector = ({
     h(C), p(!isEmpty(C)), c(!0), w(C);
   };
   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: (C) => m(C.target.value), children: map(r, (C) => /* @__PURE__ */ jsx("option", { value: C.key, children: C.name }, C.key)) }),
     u && /* @__PURE__ */ jsxs("div", { className: "group relative mt-2 flex items-center", children: [
       /* @__PURE__ */ jsx(
         "input",
         {
           type: "text",
-          value: m,
+          value: g,
           onChange: (C) => B(C.target.value),
           onKeyDown: _,
           placeholder: a(`Search ${A ?? ""}`),
           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: m && /* @__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: g && /* @__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" }) }) })
     ] }),
     (i || !isEmpty(f) || d && isEmpty(f)) && /* @__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" }),
@@ -4181,7 +4192,7 @@ const DataBindingSelector = ({
     ] }) : d && isEmpty(f) ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center p-4 text-sm text-gray-500", children: [
       a("No results found for"),
       ' "',
-      m,
+      g,
       '"'
     ] }) : /* @__PURE__ */ jsx("ul", { ref: v, children: map(f == null ? void 0 : f.slice(0, 20), (C, k) => /* @__PURE__ */ jsxs(
       "li",
@@ -4210,8 +4221,8 @@ const DataBindingSelector = ({
         DataBindingSelector,
         {
           schema: o,
-          onChange: (g) => {
-            console.log("value", r, g), n({ ...r, href: g, ...u === "pageType" ? { type: "url" } : {} });
+          onChange: (m) => {
+            console.log("value", r, m), n({ ...r, href: m, ...u === "pageType" ? { type: "url" } : {} });
           },
           id: `root.${a}.href`,
           formData: r
@@ -4219,7 +4230,7 @@ const DataBindingSelector = ({
       )
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-1.5", children: [
-      /* @__PURE__ */ jsx("select", { name: "type", value: i, onChange: (g) => n({ ...r, type: g.target.value }), children: map(
+      /* @__PURE__ */ jsx("select", { name: "type", value: i, onChange: (m) => n({ ...r, type: m.target.value }), children: map(
         [
           ...isEmpty(p) ? [] : [{ const: "pageType", title: l("Goto Page") }],
           { const: "url", title: l("Open URL") },
@@ -4227,14 +4238,14 @@ const DataBindingSelector = ({
           { const: "telephone", title: l("Call Phone") },
           { const: "scroll", title: l("Scroll to element") }
         ],
-        (g) => /* @__PURE__ */ jsx("option", { value: g.const, children: g.title }, g.const)
+        (m) => /* @__PURE__ */ jsx("option", { value: m.const, children: m.title }, m.const)
       ) }),
       u === "pageType" && !isEmpty(p) ? /* @__PURE__ */ jsx(
         PageTypeField,
         {
           href: c,
           pageTypes: p,
-          onChange: (g) => n({ ...r, href: g })
+          onChange: (m) => n({ ...r, href: m })
         }
       ) : null,
       /* @__PURE__ */ jsx(
@@ -4248,7 +4259,7 @@ const DataBindingSelector = ({
           type: "text",
           className: u === "pageType" ? "!hidden" : "",
           value: c,
-          onChange: (g) => n({ ...r, href: g.target.value }),
+          onChange: (m) => n({ ...r, href: m.target.value }),
           placeholder: l(i === "url" ? "Enter URL" : i === "scroll" ? "#ElementID" : "Enter details")
         }
       ),
@@ -4439,14 +4450,14 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   const c = useRef(null), d = useRef(a || ""), p = usePageExternalData();
   useEffect(() => {
     if (o) {
-      const m = document.createElement("style");
-      return m.id = "rte-modal-styles", m.innerHTML = `
+      const g = document.createElement("style");
+      return g.id = "rte-modal-styles", g.innerHTML = `
         /* Ensure the NestedPathSelector popover appears above the dialog */
         .rte-path-selector + [data-radix-popper-content-wrapper],
         [data-radix-popper-content-wrapper] {
           z-index: 9999 !important;
         }
-      `, document.head.appendChild(m), () => {
+      `, document.head.appendChild(g), () => {
         const h = document.getElementById("rte-modal-styles");
         h && h.remove();
       };
@@ -4473,12 +4484,12 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
       })
     ],
     content: a || "",
-    onUpdate: ({ editor: m }) => {
-      const h = m.getHTML();
+    onUpdate: ({ editor: g }) => {
+      const h = g.getHTML();
       l(h);
     },
-    onBlur: ({ editor: m }) => {
-      const h = m.getHTML();
+    onBlur: ({ editor: g }) => {
+      const h = g.getHTML();
       i(n, h);
     },
     editorProps: {
@@ -4494,9 +4505,9 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   }, [o, u]), useEffect(() => {
     c.current && u && (c.current.__chaiRTE = u);
   }, [u, o]);
-  const g = (m) => {
+  const m = (g) => {
     if (!u) return;
-    const h = `{{${m}}}`;
+    const h = `{{${g}}}`;
     u.commands.focus();
     const { from: f, to: x } = u.state.selection;
     if (f !== x)
@@ -4509,12 +4520,12 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
       w && w !== " " && !/[.,!?;:]/.test(w) && (_ = " "), u.chain().insertContent(E + h + _).run();
     }
   };
-  return /* @__PURE__ */ jsx(Dialog, { open: o, onOpenChange: (m) => !m && r(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-h-[90vh] overflow-y-auto sm:max-w-[800px]", children: [
+  return /* @__PURE__ */ jsx(Dialog, { open: o, onOpenChange: (g) => !g && r(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-h-[90vh] overflow-y-auto sm:max-w-[800px]", children: [
     /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsxs(DialogTitle, { className: "flex items-center justify-between pr-8", children: [
       /* @__PURE__ */ jsx("span", { children: "Rich Text Editor" }),
       Object.keys(p).length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
         /* @__PURE__ */ jsx("span", { className: "mr-2 text-sm text-muted-foreground", children: "Add field:" }),
-        /* @__PURE__ */ jsx("div", { className: "rte-path-selector", children: /* @__PURE__ */ jsx(NestedPathSelector, { data: p, onSelect: g }) })
+        /* @__PURE__ */ jsx("div", { className: "rte-path-selector", children: /* @__PURE__ */ jsx(NestedPathSelector, { data: p, onSelect: m }) })
       ] })
     ] }) }),
     /* @__PURE__ */ jsxs("div", { id: `chai-rte-modal-${n}`, ref: c, className: "rounded-md border border-input", children: [
@@ -4524,7 +4535,7 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
     /* @__PURE__ */ jsx("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ jsx(Button, { onClick: r, children: "Done" }) })
   ] }) });
 }, RichTextEditorField = ({ id: o, placeholder: r, value: n, onChange: a, onBlur: l }) => {
-  const i = useRef(null), [c, d] = useState(!1), [p, u] = useState(""), g = useEditor({
+  const i = useRef(null), [c, d] = useState(!1), [p, u] = useState(""), m = useEditor({
     extensions: [
       StarterKit,
       Link.configure({
@@ -4560,19 +4571,19 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
     }
   });
   useEffect(() => {
-    i.current.__chaiRTE = g;
-  }, [g]), useEffect(() => {
+    i.current.__chaiRTE = m;
+  }, [m]), useEffect(() => {
     u(n || "");
   }, [n]);
-  const m = (f) => {
+  const g = (f) => {
     a(f);
   }, h = () => {
-    d(!1), g && g.commands.setContent(p);
+    d(!1), m && m.commands.setContent(p);
   };
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsxs("div", { id: `chai-rte-${o}`, ref: i, className: "mt-1 rounded-md border border-input", children: [
-      /* @__PURE__ */ jsx(MenuBar, { editor: g, onExpand: () => d(!0) }),
-      /* @__PURE__ */ jsx(EditorContent, { editor: g, id: o, placeholder: r })
+      /* @__PURE__ */ jsx(MenuBar, { editor: m, onExpand: () => d(!0) }),
+      /* @__PURE__ */ jsx(EditorContent, { editor: m, id: o, placeholder: r })
     ] }) }),
     c && /* @__PURE__ */ jsx(
       RTEModal,
@@ -4581,7 +4592,7 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
         onClose: h,
         id: o,
         value: p,
-        onChange: m,
+        onChange: g,
         onBlur: l
       }
     )
@@ -4591,21 +4602,21 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   if (!a && !l) return null;
   const d = (a == null ? void 0 : a._type) === "Slider" ? a : l, p = find(n, { _parent: d == null ? void 0 : d._id, _type: "Slides" });
   if (!p) return null;
-  const u = filter(n, { _parent: p == null ? void 0 : p._id, _type: "Slide" }), g = (o == null ? void 0 : o.currentSlide) || get(u, "0._id");
+  const u = filter(n, { _parent: p == null ? void 0 : p._id, _type: "Slide" }), m = (o == null ? void 0 : o.currentSlide) || get(u, "0._id");
   useEffect(() => {
     (a == null ? void 0 : a._type) === "Slide" && (o == null ? void 0 : o.currentSlide) !== (a == null ? void 0 : a._id) && r({ ...o, currentSlide: a == null ? void 0 : a._id });
   }, [a]), useEffect(() => {
     u != null && u.length && !find(u, { _id: o == null ? void 0 : o.currentSlide }) && r({ ...o, currentSlide: get(u, "0._id") });
   }, [o, u]);
-  const m = () => {
-    const x = findIndex(u, { _id: g });
+  const g = () => {
+    const x = findIndex(u, { _id: m });
     if (x > -1) {
       const y = (x + 1) % u.length, b = get(u, [y, "_id"]);
       if (!b) return;
       r({ ...o, currentSlide: b }), c([b]);
     }
   }, h = () => {
-    const x = findIndex(u, { _id: g });
+    const x = findIndex(u, { _id: m });
     if (x > -1) {
       const y = (x - 1 + u.length) % u.length, b = get(u, [y, "_id"]);
       if (!b) return;
@@ -4621,15 +4632,15 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 px-2", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2 pb-2 text-[12px]", children: [
       /* @__PURE__ */ jsx("button", { onClick: h, className: "rounded bg-gray-200 p-1.5 hover:opacity-80", children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-3 w-3 stroke-[3]" }) }),
-      /* @__PURE__ */ jsx("div", { className: "whitespace-nowrap text-center text-[10px] text-slate-500", children: g ? /* @__PURE__ */ jsxs("span", { className: "", children: [
+      /* @__PURE__ */ jsx("div", { className: "whitespace-nowrap text-center text-[10px] text-slate-500", children: m ? /* @__PURE__ */ jsxs("span", { className: "", children: [
         /* @__PURE__ */ jsxs("b", { className: "text-[12px]", children: [
           " ",
-          findIndex(u, { _id: g }) + 1
+          findIndex(u, { _id: m }) + 1
         ] }),
         "/",
         u.length
       ] }) : "-" }),
-      /* @__PURE__ */ jsx("button", { onClick: m, className: "rounded bg-gray-200 p-1.5 hover:opacity-80", children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3 stroke-[3]" }) }),
+      /* @__PURE__ */ jsx("button", { onClick: g, className: "rounded bg-gray-200 p-1.5 hover:opacity-80", children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3 stroke-[3]" }) }),
       /* @__PURE__ */ jsxs(
         "button",
         {
@@ -4707,7 +4718,7 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   const n = get(o, "srcsets", []) || [], a = (c, d) => {
     const p = c.target.name, u = c.target.value;
     r({
-      srcsets: map(n, (g, m) => m === d ? { ...g, [p]: u } : g)
+      srcsets: map(n, (m, g) => g === d ? { ...m, [p]: u } : m)
     });
   }, l = () => {
     r({ srcsets: [...n, {}] });
@@ -4786,9 +4797,9 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   ] });
 }, CollectionFilterSortField = ({ id: o, value: r, onChange: n, onBlur: a }) => {
   const l = useBuilderProp("collections", []), i = useSelectedBlock(), c = get(i, "repeaterItems", "").replace(/\{\{(.*)\}\}/g, "$1").replace(COLLECTION_PREFIX, ""), d = find(l, { id: c }), u = get(d, o === "root.filter" ? "filters" : "sorts", []);
-  return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("select", { value: r, onChange: (g) => n(g.target.value), onBlur: (g) => a(o, g.target.value), children: [
+  return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("select", { value: r, onChange: (m) => n(m.target.value), onBlur: (m) => a(o, m.target.value), children: [
     /* @__PURE__ */ jsx("option", { value: "", children: "Select" }),
-    u.map((g) => /* @__PURE__ */ jsx("option", { value: g.id, children: g.name }, g.id))
+    u.map((m) => /* @__PURE__ */ jsx("option", { value: m.id, children: m.name }, m.id))
   ] }) });
 }, JSONFormFieldTemplate = ({
   id: o,
@@ -4801,8 +4812,8 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   hidden: d,
   required: p,
   schema: u,
-  formData: g,
-  onChange: m
+  formData: m,
+  onChange: g
 }) => {
   const { selectedLang: h, fallbackLang: f, languages: x } = useLanguages(), y = useMemo(
     () => isEmpty(x) ? "" : isEmpty(h) ? f : h,
@@ -4829,11 +4840,11 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
             /* @__PURE__ */ jsx(List, { className: "h-3 w-3" }),
             /* @__PURE__ */ jsx("span", { className: "leading-tight", children: n }),
             " ",
-            /* @__PURE__ */ jsx(Badge, { className: "m-0 bg-gray-200 px-2 leading-tight text-gray-500 hover:bg-gray-200 hover:text-gray-500", children: /* @__PURE__ */ jsx("span", { className: "text-[9px] font-medium text-slate-600", children: g == null ? void 0 : g.length }) })
+            /* @__PURE__ */ jsx(Badge, { className: "m-0 bg-gray-200 px-2 leading-tight text-gray-500 hover:bg-gray-200 hover:text-gray-500", children: /* @__PURE__ */ jsx("span", { className: "text-[9px] font-medium text-slate-600", children: m == null ? void 0 : m.length }) })
           ]
         }
       ),
-      (g == null ? void 0 : g.length) === 0 ? /* @__PURE__ */ jsx("div", { className: "h-0 overflow-hidden", children: a }) : /* @__PURE__ */ jsxs("div", { className: `${C ? "pt-0.5" : "h-0 overflow-hidden"}`, children: [
+      (m == null ? void 0 : m.length) === 0 ? /* @__PURE__ */ jsx("div", { className: "h-0 overflow-hidden", children: a }) : /* @__PURE__ */ jsxs("div", { className: `${C ? "pt-0.5" : "h-0 overflow-hidden"}`, children: [
         c,
         a,
         l,
@@ -4857,10 +4868,10 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
         {
           schema: u,
           onChange: (C) => {
-            m(C, g, o);
+            g(C, m, o);
           },
           id: o,
-          formData: g
+          formData: m
         }
       ) })
     ] }),
@@ -4875,8 +4886,8 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
   /* @__PURE__ */ jsx("span", { children: "Add" })
 ] }) }), JSONForm = memo(({ blockId: o, schema: r, uiSchema: n, formData: a, onChange: l }) => {
   const { selectedLang: i } = useLanguages(), c = useBlockSettingComponents("widget"), d = useBlockSettingComponents("field"), p = useBlockSettingComponents("template"), u = useThrottledCallback(
-    async ({ formData: g }, m) => {
-      l({ formData: g }, m);
+    async ({ formData: m }, g) => {
+      l({ formData: m }, g);
     },
     [l, i],
     400
@@ -4916,10 +4927,10 @@ const MenuBar = ({ editor: o, onExpand: r }) => {
       uiSchema: n,
       schema: r,
       formData: a,
-      onChange: ({ formData: g }, m) => {
-        if (!m || o !== (g == null ? void 0 : g._id)) return;
-        const h = take(m.split("."), 2).join(".").replace("root.", "");
-        u({ formData: g }, h);
+      onChange: ({ formData: m }, g) => {
+        if (!g || o !== (m == null ? void 0 : m._id)) return;
+        const h = take(g.split("."), 2).join(".").replace("root.", "");
+        u({ formData: m }, h);
       }
     },
     i
@@ -4931,7 +4942,7 @@ 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(), m = getRegisteredChaiBlock(g == null ? void 0 : g._type), h = formDataWithSelectedLang(g, o, m), f = ({ formData: _ }, S, B) => {
+  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), m = useWrapperBlock(), g = getRegisteredChaiBlock(m == null ? void 0 : m._type), h = formDataWithSelectedLang(m, o, g), f = ({ formData: _ }, S, B) => {
     S && (c == null ? void 0 : c._id) === r._id && a([r._id], { [S]: get(_, S) }, B);
   }, x = useCallback(
     debounce(({ formData: _ }, S, B) => {
@@ -4941,7 +4952,7 @@ function BlockSettings() {
   ), y = ({ formData: _ }, S) => {
     S && (n([r._id], { [S]: get(_, S) }), x({ formData: _ }, S, { [S]: get(c, S) }));
   }, b = ({ formData: _ }, S) => {
-    S && (n([g._id], { [S]: get(_, S) }), x({ formData: _ }, S, { [S]: get(c, S) }));
+    S && (n([m._id], { [S]: get(_, S) }), x({ formData: _ }, S, { [S]: get(c, S) }));
   }, { schema: v, uiSchema: A } = useMemo(() => {
     const _ = r == null ? void 0 : r._type;
     if (!_)
@@ -4952,13 +4963,13 @@ function BlockSettings() {
       return { schema: {}, uiSchema: {} };
     }
   }, [r]), { wrapperSchema: w, wrapperUiSchema: E } = useMemo(() => {
-    if (!g || !(g != null && g._type))
+    if (!m || !(m != null && m._type))
       return { wrapperSchema: {}, wrapperUiSchema: {} };
-    const _ = g == null ? void 0 : g._type, { schema: S = {}, uiSchema: B = {} } = getBlockFormSchemas(_);
+    const _ = m == null ? void 0 : m._type, { schema: S = {}, uiSchema: B = {} } = getBlockFormSchemas(_);
     return { wrapperSchema: S, wrapperUiSchema: B };
-  }, [g]);
+  }, [m]);
   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: [
+    !isEmpty(m) && /* @__PURE__ */ jsxs("div", { className: "mb-4 rounded border bg-zinc-100 px-1", children: [
       /* @__PURE__ */ jsxs(
         "div",
         {
@@ -4966,12 +4977,12 @@ function BlockSettings() {
           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" }),
-            startCase(g._type),
+            startCase(m._type),
             " settings",
             " ",
-            g._name && /* @__PURE__ */ jsxs("span", { className: "text-[11px] font-light text-slate-400", children: [
+            m._name && /* @__PURE__ */ jsxs("span", { className: "text-[11px] font-light text-slate-400", children: [
               "(",
-              g._name,
+              m._name,
               ")"
             ] })
           ]
@@ -4980,7 +4991,7 @@ function BlockSettings() {
       /* @__PURE__ */ jsx("div", { className: p ? "h-auto" : "invisible h-0", children: /* @__PURE__ */ jsx(
         JSONForm,
         {
-          blockId: g == null ? void 0 : g._id,
+          blockId: m == null ? void 0 : m._id,
           onChange: b,
           formData: h,
           schema: w,
@@ -5172,7 +5183,7 @@ 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, [m, h] = useState(p != null && p.toLowerCase().includes("width") ? "%" : u[0]), [f, x] = useState(!1), [y, b] = useState(""), [v, A] = useState(!1), [w, E] = useState(!1);
+  const [r, n] = useState(!1), [a, l] = useState(""), { currentClass: i, onChange: c, classPrefix: d, cssProperty: p, units: u, negative: m } = o, [g, h] = useState(p != null && p.toLowerCase().includes("width") ? "%" : u[0]), [f, x] = useState(!1), [y, b] = useState(""), [v, A] = useState(!1), [w, E] = useState(!1);
   useEffect(() => {
     const { value: C, unit: k } = getClassValueAndUnit(i);
     if (k === "") {
@@ -5188,7 +5199,7 @@ const BlockStylingProps = () => {
         x(!0);
         return;
       }
-      const j = get(k, "unit") !== "" ? get(k, "unit") : m;
+      const j = get(k, "unit") !== "" ? get(k, "unit") : g;
       if (j === "auto" || j === "none") {
         _(`${d}${j}`);
         return;
@@ -5198,7 +5209,7 @@ const BlockStylingProps = () => {
       const I = `${get(k, "value", "").startsWith("-") ? "-" : ""}${d}[${get(k, "value", "").replace("-", "")}${j === "-" ? "" : j}]`;
       C ? S(I) : _(I);
     },
-    [_, S, a, m, d, u]
+    [_, S, a, g, d, u]
   ), N = useCallback(
     (C) => {
       const k = getUserInputValues(`${a}`, u);
@@ -5217,7 +5228,7 @@ const BlockStylingProps = () => {
     },
     [_, a, d, u]
   );
-  return /* @__PURE__ */ jsx("div", { className: "flex w-full flex-col", children: /* @__PURE__ */ jsx("div", { className: "flex items-center justify-start", children: m === "class" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+  return /* @__PURE__ */ jsx("div", { className: "flex w-full flex-col", children: /* @__PURE__ */ jsx("div", { className: "flex items-center justify-start", children: g === "class" ? /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       "input",
       {
@@ -5232,10 +5243,10 @@ const BlockStylingProps = () => {
     ] })
   ] }) : /* @__PURE__ */ jsxs("div", { className: `group relative flex items-center ${v ? "z-auto" : ""}`, children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center rounded-md border border-border", children: [
-      ["none", "auto"].indexOf(m) !== -1 ? null : /* @__PURE__ */ jsx(
+      ["none", "auto"].indexOf(g) !== -1 ? null : /* @__PURE__ */ jsx(
         "input",
         {
-          readOnly: m === "class",
+          readOnly: g === "class",
           onKeyPress: (C) => {
             C.key === "Enter" && B();
           },
@@ -5246,7 +5257,7 @@ const BlockStylingProps = () => {
             const k = parseInt$1(C.target.value);
             let j = isNaN$1(k) ? 0 : k;
             C.keyCode === 38 && (j += 1), C.keyCode === 40 && (j -= 1);
-            const T = `${j}`, P = `${T.startsWith("-") ? "-" : ""}${d}[${T.replace("-", "")}${m === "-" ? "" : m}]`;
+            const T = `${j}`, P = `${T.startsWith("-") ? "-" : ""}${d}[${T.replace("-", "")}${g === "-" ? "" : g}]`;
             S(P);
           },
           onKeyUp: (C) => {
@@ -5275,7 +5286,7 @@ const BlockStylingProps = () => {
             onClick: () => n(!r),
             className: "flex h-6 cursor-pointer items-center gap-x-1 rounded rounded-l-none bg-background p-px px-1 text-[11px] uppercase",
             children: [
-              /* @__PURE__ */ jsx("span", { className: `inline-block ${u.length === 1 ? "px-2 font-semibold" : ""}`, children: m }),
+              /* @__PURE__ */ jsx("span", { className: `inline-block ${u.length === 1 ? "px-2 font-semibold" : ""}`, children: g }),
               u.length > 1 ? /* @__PURE__ */ jsx(TriangleDownIcon, {}) : null
             ]
           }
@@ -5284,7 +5295,7 @@ const BlockStylingProps = () => {
           UnitSelection,
           {
             units: u,
-            current: m,
+            current: g,
             onSelect: (C) => {
               n(!1), h(C), N(C);
             }
@@ -5292,26 +5303,26 @@ const BlockStylingProps = () => {
         ) })
       ] })
     ] }),
-    ["none", "auto"].indexOf(m) !== -1 || v ? null : /* @__PURE__ */ jsx(
+    ["none", "auto"].indexOf(g) !== -1 || v ? null : /* @__PURE__ */ jsx(
       DragStyleButton,
       {
         onDragStart: () => A(!0),
         onDragEnd: (C) => {
           if (b(() => ""), A(!1), isEmpty(C))
             return;
-          const k = `${C}`, T = `${k.startsWith("-") ? "-" : ""}${d}[${k.replace("-", "")}${m === "-" ? "" : m}]`;
+          const k = `${C}`, T = `${k.startsWith("-") ? "-" : ""}${d}[${k.replace("-", "")}${g === "-" ? "" : g}]`;
           _(T);
         },
         onDrag: (C) => {
           if (isEmpty(C))
             return;
           b(C);
-          const k = `${C}`, T = `${k.startsWith("-") ? "-" : ""}${d}[${k.replace("-", "")}${m === "-" ? "" : m}]`;
+          const k = `${C}`, T = `${k.startsWith("-") ? "-" : ""}${d}[${k.replace("-", "")}${g === "-" ? "" : g}]`;
           S(T);
         },
         currentValue: a,
-        unit: m,
-        negative: g,
+        unit: g,
+        negative: m,
         cssProperty: p
       }
     )
@@ -5370,7 +5381,7 @@ const COLOR_PROP = {
   ringColor: "ring",
   ringOffsetColor: "ring-offset"
 }, ColorChoice = ({ property: o, onChange: r }) => {
-  const n = useCurrentClassByProperty(o), a = useMemo(() => get(n, "cls", ""), [n]), { canChange: l } = useContext(StyleContext), [i, c] = useState([]), [d, p] = useState({ color: "", shade: "" }), u = a.split("-"), g = get(u, "1", ""), m = get(u, "2", ""), h = useCallback(
+  const n = useCurrentClassByProperty(o), a = useMemo(() => get(n, "cls", ""), [n]), { canChange: l } = useContext(StyleContext), [i, c] = useState([]), [d, p] = useState({ color: "", shade: "" }), u = a.split("-"), m = get(u, "1", ""), g = get(u, "2", ""), h = useCallback(
     // eslint-disable-next-line no-shadow
     (y) => {
       ["current", "inherit", "transparent", "black", "white"].includes(y) ? (c([]), p({ color: y })) : (c(["50", "100", "200", "300", "400", "500", "600", "700", "800", "900"]), p((b) => ({ ...b, color: y, shade: b.shade ? b.shade : "500" })));
@@ -5378,16 +5389,16 @@ const COLOR_PROP = {
     [c, p]
   );
   useEffect(() => {
-    if (["current", "inherit", "transparent", "black", "white"].includes(g))
+    if (["current", "inherit", "transparent", "black", "white"].includes(m))
       return c([]);
     c(["50", "100", "200", "300", "400", "500", "600", "700", "800", "900"]);
-  }, [g]);
+  }, [m]);
   const f = useCallback(
     // eslint-disable-next-line no-shadow
     (y) => {
-      p({ color: g, shade: y });
+      p({ color: m, shade: y });
     },
-    [g]
+    [m]
   );
   useEffect(() => {
     p({ color: "", shade: "" });
@@ -5402,7 +5413,7 @@ const COLOR_PROP = {
       {
         disabled: !l,
         rounded: !0,
-        selected: g,
+        selected: m,
         onChange: h,
         options: [
           "current",
@@ -5436,7 +5447,7 @@ const COLOR_PROP = {
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx("button", { type: "button", className: "grow text-center", children: /* @__PURE__ */ jsx(DropDown, { rounded: !0, selected: m, disabled: !g || !l, onChange: f, options: i }) })
+    /* @__PURE__ */ jsx("button", { type: "button", className: "grow text-center", children: /* @__PURE__ */ jsx(DropDown, { rounded: !0, selected: g, disabled: !m || !l, onChange: f, options: i }) })
   ] });
 }, EDITOR_ICONS = {
   "not-italic": () => /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9 3H11V5H9V11H11V13H5V11H7V5H5V3H9Z", fill: "white" }) }),
@@ -5770,20 +5781,20 @@ const COLOR_PROP = {
   "2xl": "1536px"
 }, 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(), m = useCurrentClassByProperty(l), h = useAddClassesToBlocks(), f = useRemoveClassesFromBlocks(), [x] = useSelectedBlockIds(), y = useMemo(() => get(m, "fullCls", ""), [m]), b = useCallback(
+  }, units: c, negative: d = !1 } = o, [p] = useDarkMode(), [u] = useStylingState(), [, m] = useScreenSizeWidth(), g = useCurrentClassByProperty(l), h = useAddClassesToBlocks(), f = useRemoveClassesFromBlocks(), [x] = useSelectedBlockIds(), y = useMemo(() => get(g, "fullCls", ""), [g]), b = useCallback(
     (S, B = !0) => {
-      const N = { dark: p, mq: g, mod: u, cls: S, property: l, fullCls: "" };
+      const N = { dark: p, mq: m, mod: u, cls: S, property: l, fullCls: "" };
       (p || u !== "") && (N.mq = "xs");
       const C = generateFullClsName(N);
       h(x, [C], B);
     },
-    [x, p, g, u, l, h]
+    [x, p, m, u, l, h]
   ), v = useCallback(() => {
     f(x, [y], !0);
-  }, [x, y, f]), A = useMemo(() => canChangeClass(m, g), [m, g]);
+  }, [x, y, f]), A = useMemo(() => canChangeClass(g, m), [g, m]);
   useEffect(() => {
-    i(A, m);
-  }, [A, i, m]);
+    i(A, g);
+  }, [A, i, g]);
   const [, , w] = useScreenSizeWidth(), E = useCallback(
     (S) => {
       w({
@@ -5796,15 +5807,15 @@ const COLOR_PROP = {
       }[S]);
     },
     [w]
-  ), _ = get(m, "dark", null) === p && get(m, "mod", null) === u && get(m, "mq", null) === g;
-  return /* @__PURE__ */ jsx(BlockStyleProvider, { canChange: A, canReset: m && _, children: /* @__PURE__ */ jsxs("div", { className: "group flex flex-row items-center py-2 first:pt-0 last:pb-0", children: [
-    /* @__PURE__ */ jsx("div", { className: "relative w-[70px] truncate text-xs text-foreground", children: /* @__PURE__ */ jsx("span", { className: `text-[11px] ${m && !_ ? "text-foreground" : ""}`, children: r(a) }) }),
+  ), _ = get(g, "dark", null) === p && get(g, "mod", null) === u && get(g, "mq", null) === m;
+  return /* @__PURE__ */ jsx(BlockStyleProvider, { canChange: A, canReset: g && _, 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] ${g && !_ ? "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(
           AdvanceChoices,
           {
-            currentClass: get(m, "cls", ""),
+            currentClass: get(g, "cls", ""),
             classPrefix: get(CLASS_PREFIXES, l, ""),
             units: c || [],
             onChange: b,
@@ -5817,7 +5828,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: _ ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => v(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ jsx(CrossCircledIcon, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : A && m ? /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 100, children: [
+      /* @__PURE__ */ jsx("div", { className: `w-[30px] cursor-pointer ${y ? "visible" : "invisible"}`, children: _ ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => v(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ jsx(CrossCircledIcon, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : A && g ? /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 100, children: [
         /* @__PURE__ */ jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsx(
           "button",
           {
@@ -5829,19 +5840,19 @@ const COLOR_PROP = {
         /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("div", { className: "text-right", children: /* @__PURE__ */ jsxs("div", { children: [
           "Current style is set at  ",
           /* @__PURE__ */ jsxs("span", { className: "font-bold", children: [
-            getBreakpoint(get(m, "mq")),
-            p && !m.dark ? "(Light mode)" : ""
+            getBreakpoint(get(g, "mq")),
+            p && !g.dark ? "(Light mode)" : ""
           ] }),
           /* @__PURE__ */ jsx("br", {}),
           /* @__PURE__ */ jsxs(
             "button",
             {
               type: "button",
-              onClick: () => E(get(m, "mq")),
+              onClick: () => E(get(g, "mq")),
               className: "block w-full cursor-default text-right font-semibold text-blue-500",
               children: [
                 "Switch to ",
-                get(m, "mq").toUpperCase()
+                get(g, "mq").toUpperCase()
               ]
             }
           )
@@ -5858,7 +5869,7 @@ const COLOR_PROP = {
   units: i = basicUnits,
   negative: c = !1
 }) => {
-  const { t: d } = useTranslation(), [p, u] = useState(r[0].key), g = useSelectedBlockCurrentClasses(), m = useCallback((h) => map(g, "property").includes(h), [g]);
+  const { t: d } = useTranslation(), [p, u] = useState(r[0].key), m = useSelectedBlockCurrentClasses(), g = useCallback((h) => map(m, "property").includes(h), [m]);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -5875,7 +5886,7 @@ const COLOR_PROP = {
                 className: `relative cursor-pointer rounded-full p-1 text-[8px] ${f === p ? "bg-[#3E57F0] text-white" : "text-gray-600 dark:text-gray-300"}`,
                 children: [
                   React__default.createElement("div", {
-                    className: m(f) ? "-bottom-1.5 absolute bg-[#3E57F0] h-[2px] left-0 w-full" : ""
+                    className: g(f) ? "-bottom-1.5 absolute bg-[#3E57F0] h-[2px] left-0 w-full" : ""
                   }),
                   React__default.createElement(get(EDITOR_ICONS, f, BoxIcon), { className: "text-inherit w-3 h-3" })
                 ]
@@ -6006,7 +6017,7 @@ const COLOR_PROP = {
   icon: p,
   onClick: u
 }) => {
-  const { t: g } = useTranslation();
+  const { t: m } = useTranslation();
   return n ? /* @__PURE__ */ jsxs(HoverCard, { openDelay: r, children: [
     /* @__PURE__ */ jsx(HoverCardTrigger, { asChild: !0, children: /* @__PURE__ */ jsx(
       Button,
@@ -6019,8 +6030,8 @@ const COLOR_PROP = {
       }
     ) }),
     /* @__PURE__ */ jsx(HoverCardContent, { className: "w-fit max-w-52 border-border", children: /* @__PURE__ */ jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ jsx("h4", { className: "text-sm font-semibold", children: g(a) }),
-      o && /* @__PURE__ */ jsx("p", { className: "text-xs", children: g(l) })
+      /* @__PURE__ */ jsx("h4", { className: "text-sm font-semibold", children: m(a) }),
+      o && /* @__PURE__ */ jsx("p", { className: "text-xs", children: m(l) })
     ] }) }) })
   ] }) : /* @__PURE__ */ jsx(
     Button,
@@ -6037,8 +6048,8 @@ const COLOR_PROP = {
   canvas: r = !1,
   tooltip: n = !0
 }) => {
-  const [a, , l] = useScreenSizeWidth(), [i, c] = useCanvasDisplayWidth(), [d, p] = useSelectedBreakpoints(), u = d, g = p, { t: m } = useTranslation(), h = useBuilderProp("breakpoints", WEB_BREAKPOINTS), f = (b) => {
-    u.includes(b) ? u.length > 2 && g(u.filter((v) => v !== b)) : g((v) => [...v, b]);
+  const [a, , l] = useScreenSizeWidth(), [i, c] = useCanvasDisplayWidth(), [d, p] = useSelectedBreakpoints(), u = d, m = p, { t: g } = useTranslation(), h = useBuilderProp("breakpoints", WEB_BREAKPOINTS), f = (b) => {
+    u.includes(b) ? u.length > 2 && m(u.filter((v) => v !== b)) : m((v) => [...v, b]);
   }, x = (b) => {
     r || l(b), c(b);
   }, y = getBreakpointValue(r ? i : a).toLowerCase();
@@ -6070,7 +6081,7 @@ const COLOR_PROP = {
     /* @__PURE__ */ jsxs(DropdownMenu, { children: [
       /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: !0, children: /* @__PURE__ */ jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ jsx(DotsVerticalIcon, { className: "scale-90 transform" }) }) }),
       /* @__PURE__ */ jsxs(DropdownMenuContent, { className: "w-56 border-border text-xs", children: [
-        /* @__PURE__ */ jsx(DropdownMenuLabel, { children: m("Screen sizes") }),
+        /* @__PURE__ */ jsx(DropdownMenuLabel, { children: g("Screen sizes") }),
         /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
         map(h, (b) => /* @__PURE__ */ jsx(
           DropdownMenuCheckboxItem,
@@ -6078,7 +6089,7 @@ const COLOR_PROP = {
             disabled: b.breakpoint === "xs",
             onCheckedChange: () => f(toUpper(b.breakpoint)),
             checked: includes(u, toUpper(b.breakpoint)),
-            children: m(b.title)
+            children: g(b.title)
           },
           b.breakpoint
         ))
@@ -6155,14 +6166,14 @@ function Countdown() {
   ] });
 }
 const AskAIStyles = ({ blockId: o }) => {
-  const { t: r } = useTranslation(), { askAi: n, loading: a, error: l } = useAskAi(), [i, c] = useState(""), d = useRef(null), p = useRef(null), [u, g] = useState();
+  const { t: r } = useTranslation(), { askAi: n, loading: a, error: l } = useAskAi(), [i, c] = useState(""), d = useRef(null), p = useRef(null), [u, m] = useState();
   useEffect(() => {
     var h;
     (h = d.current) == null || h.focus();
   }, []);
-  const m = (h) => {
+  const g = (h) => {
     const { usage: f } = h || {};
-    !l && f && g(f), p.current = setTimeout(() => g(void 0), 1e4), l || c("");
+    !l && f && m(f), p.current = setTimeout(() => m(void 0), 1e4), l || c("");
   };
   return /* @__PURE__ */ jsxs("div", { className: "", children: [
     /* @__PURE__ */ jsx("h2", { className: "mb-1 text-sm font-semibold leading-none tracking-tight", children: r("Ask AI") }),
@@ -6176,7 +6187,7 @@ const AskAIStyles = ({ blockId: o }) => {
         className: "no-scrollbar my-2 w-full border border-border p-2 text-xs",
         rows: 4,
         onKeyDown: (h) => {
-          h.key === "Enter" && (h.preventDefault(), p.current && clearTimeout(p.current), g(void 0), n("styles", o, i, m));
+          h.key === "Enter" && (h.preventDefault(), p.current && clearTimeout(p.current), m(void 0), n("styles", o, i, g));
         }
       }
     ),
@@ -6186,7 +6197,7 @@ const AskAIStyles = ({ blockId: o }) => {
         {
           disabled: i.trim().length < 5 || a,
           onClick: () => {
-            p.current && clearTimeout(p.current), g(void 0), n("styles", o, i, m);
+            p.current && clearTimeout(p.current), m(void 0), n("styles", o, i, g);
           },
           variant: "default",
           className: "w-fit",
@@ -6218,9 +6229,9 @@ const AskAIStyles = ({ blockId: o }) => {
 };
 function ManualClasses() {
   var 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(), [m] = useSelectedBlockIds(), h = useBuilderProp("askAiCallBack", null), [f, x] = useState(""), y = (T = first(d)) == null ? void 0 : T.prop, { classes: b } = getSplitChaiClasses(get(p, y, "")), v = b.split(" ").filter((I) => !isEmpty(I)), A = () => {
+  const o = useRef(null), [r, n] = useState(""), [a, l] = useState(-1), i = useFuseSearch(), { t: c } = useTranslation(), [d] = useSelectedStylingBlocks(), p = useSelectedBlock(), u = useAddClassesToBlocks(), m = useRemoveClassesFromBlocks(), [g] = useSelectedBlockIds(), h = useBuilderProp("askAiCallBack", null), [f, x] = useState(""), y = (T = first(d)) == null ? void 0 : T.prop, { classes: b } = getSplitChaiClasses(get(p, y, "")), v = b.split(" ").filter((I) => !isEmpty(I)), A = () => {
     const I = f.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
-    u(m, I, !0), x("");
+    u(g, I, !0), x("");
   }, [w, E] = useState([]), _ = ({ value: I }) => {
     const P = I.trim().toLowerCase(), L = P.match(/.+:/g);
     let D = [];
@@ -6259,7 +6270,7 @@ function ManualClasses() {
   ), k = (I) => {
     debugger;
     const P = r.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
-    g(m, [I]), u(m, P, !0), n(""), l(-1);
+    m(g, [I]), u(g, P, !0), n(""), l(-1);
   }, j = () => {
     if (navigator.clipboard === void 0) {
       toast.error(c("Clipboard not supported"));
@@ -6341,7 +6352,7 @@ function ManualClasses() {
         "button",
         {
           onDoubleClick: () => {
-            x(I), g(m, [I]), setTimeout(() => {
+            x(I), m(g, [I]), setTimeout(() => {
               o.current && o.current.focus();
             }, 10);
           },
@@ -6351,7 +6362,7 @@ function ManualClasses() {
             r !== I && /* @__PURE__ */ jsx(
               Cross2Icon,
               {
-                onClick: () => g(m, [I], !0),
+                onClick: () => m(g, [I], !0),
                 className: "invisible absolute right-1 rounded-full bg-red-400 hover:text-white group-hover:visible group-hover:cursor-pointer"
               }
             )
@@ -6471,13 +6482,13 @@ function BlockStyling() {
     cssProperty: ""
   }), d = useThrottledCallback(
     (u) => {
-      const g = !get(i, "negative", !1), m = get(i, "cssProperty", "");
+      const m = !get(i, "negative", !1), g = get(i, "cssProperty", "");
       let h = parseFloat(i.dragStartValue);
       h = isNaN(h) ? 0 : h;
       let f = MAPPER[i.dragUnit];
-      (startsWith(m, "scale") || m === "opacity") && (f = 10);
+      (startsWith(g, "scale") || g === "opacity") && (f = 10);
       let y = (i.dragStartY - u.pageY) / f + h;
-      g && y < 0 && (y = 0), m === "opacity" && y > 1 && (y = 1), i.onDrag(`${y}`), l(`${y}`);
+      m && y < 0 && (y = 0), g === "opacity" && y > 1 && (y = 1), i.onDrag(`${y}`), l(`${y}`);
     },
     [i],
     50
@@ -6518,7 +6529,7 @@ const CoreBlock = ({
   parentId: n,
   position: a
 }) => {
-  const [, l] = useAtom$1(draggedBlockAtom), { type: i, icon: c, label: d } = o, { addCoreBlock: p, addPredefinedBlock: u } = useAddBlock(), [, g] = useSelectedBlockIds(), { clearHighlight: m } = useBlockHighlight(), h = () => {
+  const [, l] = useAtom$1(draggedBlockAtom), { type: i, icon: c, label: d } = o, { addCoreBlock: p, addPredefinedBlock: u } = useAddBlock(), [, m] = useSelectedBlockIds(), { clearHighlight: g } = useBlockHighlight(), h = () => {
     if (has(o, "blocks")) {
       const y = isFunction(o.blocks) ? o.blocks() : o.blocks;
       u(syncBlocksWithDefaults(y), n || null, a);
@@ -6535,7 +6546,7 @@ const CoreBlock = ({
         type: "button",
         onDragStart: (y) => {
           y.dataTransfer.setData("text/plain", JSON.stringify(omit(o, ["component", "icon"]))), y.dataTransfer.setDragImage(new Image(), 0, 0), l(omit(o, ["component", "icon"])), setTimeout(() => {
-            g([]), m();
+            m([]), g();
           }, 200);
         },
         draggable: f ? "true" : "false",
@@ -6734,7 +6745,7 @@ const CoreBlock = ({
     }
   }
 }, traverseNodes = (o, r = null) => flatMapDeep(o, (n) => {
-  var m, h, f, x, y, b, v, A;
+  var g, h, f, x, y, b, v, A;
   if (n.type === "comment") return [];
   console.log("node ===>", n);
   let a = { _id: generateUUID() };
@@ -6775,7 +6786,7 @@ const CoreBlock = ({
     ];
     a = {
       ...a,
-      href: ((m = l.find((E) => E.key === "href")) == null ? void 0 : m.value) || "",
+      href: ((g = l.find((E) => E.key === "href")) == null ? void 0 : g.value) || "",
       hrefType: ((h = l.find((E) => E.key === "data-vbtype")) == null ? void 0 : h.value) || "video",
       autoplay: ((f = l.find((E) => E.key === "data-autoplay")) == null ? void 0 : f.value) === "true" ? "true" : "false",
       maxWidth: ((y = (x = l.find((E) => E.key === "data-maxwidth")) == null ? void 0 : x.value) == null ? void 0 : y.replace("px", "")) || "",
@@ -6817,8 +6828,8 @@ const CoreBlock = ({
       label: getTextContent(n.children),
       ...getAttrs(n)
     }), [];
-  const g = traverseNodes(n.children, { block: a, node: n });
-  return [a, ...g];
+  const m = traverseNodes(n.children, { block: a, node: n });
+  return [a, ...m];
 }), getSvgDimensions = (o, r, n) => {
   const a = get(o, "attributes", []), l = find(a, { key: "height" }), i = find(a, { key: "width" });
   return {
@@ -6869,8 +6880,8 @@ const CoreBlock = ({
   height: i = ""
 }) => {
   const [c, d] = useState(o), p = (u) => {
-    const g = u.target.value;
-    d(g), r(g);
+    const m = u.target.value;
+    d(m), r(m);
   };
   return /* @__PURE__ */ jsx("div", { className: cn$2("relative inline-block w-full", l), children: /* @__PURE__ */ jsxs(
     "select",
@@ -6916,7 +6927,7 @@ const BlockCard = ({
   parentId: n = void 0,
   position: a = -1
 }) => {
-  const [l, i] = useState(!1), c = useBuilderProp("getUILibraryBlock", noop), { addCoreBlock: d, addPredefinedBlock: p } = useAddBlock(), [, u] = useSelectedBlockIds(), { clearHighlight: g } = useBlockHighlight(), m = get(o, "name", get(o, "label")), h = get(o, "description", ""), f = useFeature("dnd"), [, x] = useAtom$1(draggedBlockAtom), y = (A) => {
+  const [l, i] = useState(!1), c = useBuilderProp("getUILibraryBlock", noop), { addCoreBlock: d, addPredefinedBlock: p } = useAddBlock(), [, u] = useSelectedBlockIds(), { clearHighlight: m } = useBlockHighlight(), g = get(o, "name", get(o, "label")), h = get(o, "description", ""), f = useFeature("dnd"), [, x] = useAtom$1(draggedBlockAtom), y = (A) => {
     const w = has(A, "styles_attrs.data-page-section");
     return A._type === "Box" && w;
   }, b = useCallback(
@@ -6951,7 +6962,7 @@ const BlockCard = ({
             } else
               A.dataTransfer.setDragImage(new Image(), 0, 0);
             x(_), setTimeout(() => {
-              u([]), g(), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
+              u([]), m(), pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
             }, 200);
           }
         },
@@ -6963,20 +6974,20 @@ const BlockCard = ({
             /* @__PURE__ */ jsx(Loader, { className: "animate-spin", size: 15, color: "white" }),
             /* @__PURE__ */ jsx("span", { className: "pl-2 text-sm text-white", children: "Adding..." })
           ] }),
-          o.preview ? /* @__PURE__ */ jsx("img", { src: o.preview, className: "min-h-[45px] w-full rounded-md", alt: m }) : /* @__PURE__ */ jsxs("div", { className: "flex h-fit w-full flex-col items-center justify-center gap-1 rounded-md border border-border p-6 py-10 text-center", children: [
-            /* @__PURE__ */ jsx("p", { className: "font-medium text-gray-800", children: m }),
+          o.preview ? /* @__PURE__ */ jsx("img", { src: o.preview, className: "min-h-[45px] w-full rounded-md", alt: g }) : /* @__PURE__ */ jsxs("div", { className: "flex h-fit w-full flex-col items-center justify-center gap-1 rounded-md border border-border p-6 py-10 text-center", children: [
+            /* @__PURE__ */ jsx("p", { className: "font-medium text-gray-800", children: g }),
             h && /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600", children: h })
           ] })
         ]
       }
     ) }),
     /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsxs("div", { className: "max-w-xs", children: [
-      /* @__PURE__ */ jsx("p", { className: "font-medium", children: m }),
+      /* @__PURE__ */ jsx("p", { className: "font-medium", children: g }),
       h && o.preview && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-primary-foreground", children: h })
     ] }) })
   ] });
 }, UILibrarySection = ({ parentId: o, position: r }) => {
-  const [n, a] = useSelectedLibrary(), l = useBuilderProp("uiLibraries", []), i = l.find((k) => k.id === n) || first(l), { data: c, isLoading: d, resetLibrary: p } = useLibraryBlocks(i), [u, g] = useState(""), [m, h] = useState([]), f = useRef(null);
+  const [n, a] = useSelectedLibrary(), l = useBuilderProp("uiLibraries", []), i = l.find((k) => k.id === n) || first(l), { data: c, isLoading: d, resetLibrary: p } = useLibraryBlocks(i), [u, m] = useState(""), [g, h] = useState([]), f = useRef(null);
   useEffect(() => {
     c && c.length > 0 && (f.current = new Fuse(c, {
       keys: ["name", "label", "description", "group"],
@@ -6991,7 +7002,7 @@ const BlockCard = ({
     const k = f.current.search(u).map((j) => j.item);
     h(k);
   }, [u]);
-  const x = u.trim() && !isEmpty(m) ? m : c, y = groupBy(x, "group"), [b, v] = useState(null);
+  const x = u.trim() && !isEmpty(g) ? g : c, y = groupBy(x, "group"), [b, v] = useState(null);
   useEffect(() => {
     if (isEmpty(keys(y))) {
       v(null);
@@ -7009,7 +7020,7 @@ const BlockCard = ({
   }, S = () => {
     i != null && i.id && p(i.id);
   }, B = () => {
-    g("");
+    m("");
   };
   if (d)
     return /* @__PURE__ */ jsxs("div", { className: "mt-4 grid h-full w-full grid-cols-12 gap-2", children: [
@@ -7025,7 +7036,7 @@ const BlockCard = ({
         {
           placeholder: E("Search blocks..."),
           value: u,
-          onChange: (k) => g(k.target.value),
+          onChange: (k) => m(k.target.value),
           className: "w-full pl-8 pr-8"
         }
       ),
@@ -7120,7 +7131,7 @@ const BlockCard = ({
   position: r,
   gridCols: n = "grid-cols-2"
 }) => {
-  const { data: a, isLoading: l, refetch: i, error: c } = usePartialBlocksList(), [d, p] = useAtom$1(partialBlocksDataAtom), [u, g] = useAtom$1(hasInitializedPartialBlocksAtom);
+  const { data: a, isLoading: l, refetch: i, error: c } = usePartialBlocksList(), [d, p] = useAtom$1(partialBlocksDataAtom), [u, m] = useAtom$1(hasInitializedPartialBlocksAtom);
   useEffect(() => {
     if (!u || Object.keys(d.blocks).length === 0)
       if (c)
@@ -7129,7 +7140,7 @@ const BlockCard = ({
           groups: [],
           isLoading: !1,
           error: c
-        }), g(!0);
+        }), m(!0);
       else if (!l && Object.keys(a || {}).length > 0) {
         const h = Object.entries(a).map(([x, y]) => {
           const b = y, v = b.type || "partial", A = formatReadableName(v);
@@ -7152,31 +7163,31 @@ const BlockCard = ({
           groups: f,
           isLoading: !1,
           error: null
-        }), g(!0);
+        }), m(!0);
       } else l ? p((h) => ({ ...h, isLoading: !0, error: null })) : !l && Object.keys(a || {}).length === 0 && (p({
         blocks: [],
         groups: [],
         isLoading: !1,
         error: "No partial blocks available"
-      }), g(!0));
+      }), m(!0));
   }, [
     l,
     a,
     u,
-    g,
+    m,
     p,
     d.blocks,
     c
   ]);
-  const m = () => {
-    p((h) => ({ ...h, isLoading: !0, error: null })), g(!1), i();
+  const g = () => {
+    p((h) => ({ ...h, isLoading: !0, error: null })), m(!1), i();
   };
   return d.isLoading ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8 text-center text-muted-foreground", children: "Loading partial blocks..." }) : d.error || d.blocks.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-4 p-8 text-center text-muted-foreground", children: [
     /* @__PURE__ */ jsx("p", { children: d.error || "No partial blocks available" }),
     /* @__PURE__ */ jsx(
       "button",
       {
-        onClick: m,
+        onClick: g,
         className: "rounded-md bg-primary px-3 py-1 text-sm text-primary-foreground hover:bg-primary/90",
         children: "Refresh"
       }
@@ -7195,14 +7206,14 @@ const BlockCard = ({
   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), m = (C = find(c, (k) => k._id === n)) == null ? void 0 : C._type, [h, f] = useState("all"), [x, y] = useState(null), b = useRef(null);
+  const { t: i } = useTranslation(), [c] = useBlocksStore(), [d, p] = useState(""), u = useRef(null), [m] = useAtom$1(addBlockTabAtom), g = (C = find(c, (k) => k._id === n)) == null ? void 0 : C._type, [h, f] = useState("all"), [x, y] = useState(null), b = useRef(null);
   useEffect(() => {
     const k = setTimeout(() => {
       var j;
       (j = u.current) == null || j.focus();
     }, 0);
     return () => clearTimeout(k);
-  }, [g]), useEffect(() => {
+  }, [m]), useEffect(() => {
     d && (f("all"), y(null));
   }, [d]), useEffect(() => (b.current = debounce((k) => {
     f(k);
@@ -7285,7 +7296,7 @@ const BlockCard = ({
             parentId: n,
             position: a,
             block: j,
-            disabled: !canAcceptChildBlock(m, j.type) || !canBeNestedInside(m, j.type)
+            disabled: !canAcceptChildBlock(g, j.type) || !canBeNestedInside(g, j.type)
           },
           j.type
         )) })
@@ -7298,13 +7309,13 @@ const BlockCard = ({
   parentId: n = void 0,
   position: a = -1
 }) => {
-  const { t: l } = useTranslation(), [i, c] = useAtom$1(addBlockTabAtom), [, d] = useAtom$1(showPredefinedBlockCategoryAtom), p = useBuilderProp("importHTMLSupport", !0), { data: u } = usePartialBlocksList(), g = Object.keys(u || {}).length > 0, { hasPermission: m } = usePermissions();
+  const { t: l } = useTranslation(), [i, c] = useAtom$1(addBlockTabAtom), [, d] = useAtom$1(showPredefinedBlockCategoryAtom), p = useBuilderProp("importHTMLSupport", !0), { data: u } = usePartialBlocksList(), m = Object.keys(u || {}).length > 0, { hasPermission: g } = usePermissions();
   useEffect(() => {
-    i === "partials" && !g && c("library");
-  }, [i, g, c]);
+    i === "partials" && !m && c("library");
+  }, [i, m, c]);
   const h = useCallback(() => {
     pubsub.publish(CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK);
-  }, []), f = useChaiAddBlockTabs(), x = p && m(PERMISSIONS.IMPORT_HTML), b = useBuilderProp("uiLibraries", []).length > 0;
+  }, []), f = useChaiAddBlockTabs(), x = p && g(PERMISSIONS.IMPORT_HTML), b = useBuilderProp("uiLibraries", []).length > 0;
   return useEffect(() => {
     i === "library" && !b && c("core");
   }, [i, b, c]), /* @__PURE__ */ jsxs("div", { className: cn$2("flex h-full w-full flex-col overflow-hidden", o), children: [
@@ -7324,13 +7335,13 @@ const BlockCard = ({
           /* @__PURE__ */ jsxs(TabsList, { className: "flex w-full items-center", children: [
             b && /* @__PURE__ */ jsx(TabsTrigger, { value: "library", children: l("Library") }),
             /* @__PURE__ */ jsx(TabsTrigger, { value: "core", children: l("Blocks") }),
-            g && /* @__PURE__ */ jsx(TabsTrigger, { value: "partials", children: l("Partials") }),
+            m && /* @__PURE__ */ jsx(TabsTrigger, { value: "partials", children: l("Partials") }),
             x ? /* @__PURE__ */ jsx(TabsTrigger, { value: "html", children: l("Import") }) : null,
             map(f, (v) => /* @__PURE__ */ jsx(TabsTrigger, { value: v.id, children: React__default.createElement(v.tab) }, `tab-add-block-${v.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 }) }) }) }),
+          m && /* @__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 }) }) }) }),
           x ? /* @__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(f, (v) => /* @__PURE__ */ jsx(TabsContent, { value: v.id, children: React__default.createElement(v.tabContent, { close: h, parentId: n, position: a }) }, `panel-add-block-${v.id}`))
         ]
@@ -7454,10 +7465,10 @@ const registerChaiSaveToLibrary = (o) => {
 }, CANNOT_COPY_BLOCKS = !navigator.clipboard, CopyPasteBlocks = () => {
   const [o] = useBlocksStore(), [r] = useSelectedBlockIds(), { pasteBlocks: n } = usePasteBlocks(), [, a, l] = useCopyBlocks(), { t: i } = useTranslation(), c = useSelectedBlock(), d = useCallback(() => {
     const p = r.map((u) => {
-      const g = o.find((m) => m._id === u);
+      const m = o.find((g) => g._id === u);
       return {
         id: u,
-        data: g
+        data: m
       };
     });
     l(p.map((u) => u.id)) ? toast.warning("Partial blocks detected. Clone partial blocks?", {
@@ -7639,7 +7650,7 @@ 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: m } = useBlockHighlight(), { id: h, data: f, isSelected: x, willReceiveDrop: y, isDragging: b, isEditing: v, handleClick: A } = o, w = (L) => {
+  const u = o.children.length > 0, { highlightBlock: m, clearHighlight: g } = useBlockHighlight(), { id: h, data: f, isSelected: x, willReceiveDrop: y, isDragging: b, isEditing: v, handleClick: A } = o, w = (L) => {
     L.stopPropagation(), !l.includes(h) && o.toggle();
   }, E = (L) => {
     L.isInternal && (p = L.isOpen, L.isOpen && L.close());
@@ -7691,8 +7702,8 @@ const Input = ({ node: o }) => {
   return /* @__PURE__ */ jsx("div", { className: "w-full", children: /* @__PURE__ */ jsxs(
     "div",
     {
-      onMouseEnter: () => g(h),
-      onMouseLeave: () => m(),
+      onMouseEnter: () => m(h),
+      onMouseLeave: () => g(),
       onClick: k,
       style: r,
       "data-node-id": h,
@@ -8058,7 +8069,7 @@ const Input = ({ node: o }) => {
     )
   ] });
 }, ThemeConfigPanel = React.memo(({ className: o = "" }) => {
-  const [r] = useDarkMode(), [n, a] = React.useState(""), l = useBuilderProp("themePresets", []), i = useBuilderProp("themePanelComponent", null), { hasPermission: c } = usePermissions(), [d, p] = useTheme(), u = useThemeOptions(), { t: g } = useTranslation(), m = (v) => {
+  const [r] = useDarkMode(), [n, a] = React.useState(""), l = useBuilderProp("themePresets", []), i = useBuilderProp("themePanelComponent", null), { hasPermission: c } = usePermissions(), [d, p] = useTheme(), u = useThemeOptions(), { t: m } = useTranslation(), g = (v) => {
     a(v);
   }, h = () => {
     const v = l.find((A) => Object.keys(A)[0] === n);
@@ -8120,12 +8131,12 @@ const Input = ({ node: o }) => {
     /* @__PURE__ */ jsxs("div", { className: cn$2("no-scrollbar h-full w-full overflow-y-auto", o), children: [
       l.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex gap-2 py-2", children: [
         /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-sm", children: g("Presets") }),
+          /* @__PURE__ */ jsx(Label, { className: "text-sm", children: m("Presets") }),
           /* @__PURE__ */ jsxs(
             "select",
             {
               value: n,
-              onChange: (v) => m(v.target.value),
+              onChange: (v) => g(v.target.value),
               className: "w-full space-y-0.5 rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
               children: [
                 /* @__PURE__ */ jsx("option", { value: "", children: "Select preset" }),
@@ -8141,7 +8152,7 @@ const Input = ({ node: o }) => {
             disabled: n === "",
             variant: "default",
             onClick: h,
-            children: g("Apply")
+            children: m("Apply")
           }
         ) })
       ] }),
@@ -8156,14 +8167,14 @@ const Input = ({ node: o }) => {
           v
         )) }),
         (u == null ? void 0 : u.borderRadius) && /* @__PURE__ */ jsxs("div", { className: "space-y-0.5 py-3", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-sm", children: g("Border Radius") }),
+          /* @__PURE__ */ jsx(Label, { className: "text-sm", children: m("Border Radius") }),
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 py-2", children: [
             /* @__PURE__ */ jsx(BorderRadiusInput, { value: d.borderRadius, onChange: x }),
             /* @__PURE__ */ jsx("span", { className: "w-12 text-sm", children: d.borderRadius })
           ] })
         ] }),
         (u == null ? void 0 : u.colors) && /* @__PURE__ */ jsxs("div", { className: "mt-4 space-y-0.5", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-sm", children: g("Colors") }),
+          /* @__PURE__ */ jsx(Label, { className: "text-sm", children: m("Colors") }),
           /* @__PURE__ */ jsx("div", { className: "w-full space-y-4 pt-2", children: u.colors.map((v) => b(v)) }, r ? "dark" : "light")
         ] })
       ] }),
@@ -8634,14 +8645,14 @@ function QuickPrompts({ onClick: o }) {
   ) }) });
 }
 const AIUserPrompt = ({ blockId: o }) => {
-  const { t: r } = useTranslation(), { askAi: n, loading: a, error: l } = useAskAi(), [i, c] = useState(""), [d, p] = useState(!0), [u, g] = useState(), m = useRef(null), h = useRef(null);
+  const { t: r } = useTranslation(), { askAi: n, loading: a, error: l } = useAskAi(), [i, c] = useState(""), [d, p] = useState(!0), [u, m] = useState(), g = useRef(null), h = useRef(null);
   useEffect(() => {
     var x;
-    (x = m.current) == null || x.focus();
+    (x = g.current) == null || x.focus();
   }, []);
   const f = (x) => {
     const { usage: y } = x || {};
-    !l && y && g(y), h.current = setTimeout(() => g(void 0), 1e4), l || c("");
+    !l && y && m(y), h.current = setTimeout(() => m(void 0), 1e4), l || c("");
   };
   return /* @__PURE__ */ jsxs("div", { className: "", children: [
     /* @__PURE__ */ jsxs(
@@ -8659,14 +8670,14 @@ const AIUserPrompt = ({ blockId: o }) => {
       /* @__PURE__ */ jsx(
         Textarea,
         {
-          ref: m,
+          ref: g,
           value: i,
           onChange: (x) => c(x.target.value),
           placeholder: r("Ask AI to edit content"),
           className: "w-full",
           rows: 3,
           onKeyDown: (x) => {
-            x.key === "Enter" && (x.preventDefault(), h.current && clearTimeout(h.current), g(void 0), n("content", o, i, f));
+            x.key === "Enter" && (x.preventDefault(), h.current && clearTimeout(h.current), m(void 0), n("content", o, i, f));
           }
         }
       ),
@@ -8676,7 +8687,7 @@ const AIUserPrompt = ({ blockId: o }) => {
           {
             disabled: i.trim().length < 5 || a,
             onClick: () => {
-              h.current && clearTimeout(h.current), g(void 0), n("content", o, i, f);
+              h.current && clearTimeout(h.current), m(void 0), n("content", o, i, f);
             },
             variant: "default",
             className: "w-fit",
@@ -8709,7 +8720,7 @@ const AIUserPrompt = ({ blockId: o }) => {
         QuickPrompts,
         {
           onClick: (x) => {
-            h.current && clearTimeout(h.current), g(void 0), n("content", o, x, f);
+            h.current && clearTimeout(h.current), m(void 0), n("content", o, x, f);
           }
         }
       )
@@ -8719,13 +8730,13 @@ const AIUserPrompt = ({ blockId: o }) => {
     ] }) }) : null
   ] });
 }, AISetContext = () => {
-  const { t: o } = useTranslation(), r = useBuilderProp("aiContext", ""), [n, a] = useState(r), l = useRef(null), i = useBuilderProp("saveAiContextCallback", noop), [c, d] = useState(!1), [p, u] = useState(null), [, g] = useState(!1), m = useRef(null);
+  const { t: o } = useTranslation(), r = useBuilderProp("aiContext", ""), [n, a] = useState(r), l = useRef(null), i = useBuilderProp("saveAiContextCallback", noop), [c, d] = useState(!1), [p, u] = useState(null), [, m] = useState(!1), g = useRef(null);
   useEffect(() => {
     r && a(r);
   }, [r]);
   const h = async () => {
     try {
-      d(!0), u(null), await i(n), toast.success(o("Updated AI Context")), m.current.click();
+      d(!0), u(null), await i(n), toast.success(o("Updated AI Context")), g.current.click();
     } catch (f) {
       u(f);
     } finally {
@@ -8736,12 +8747,12 @@ const AIUserPrompt = ({ blockId: o }) => {
     Accordion,
     {
       onValueChange: (f) => {
-        g(f !== "");
+        m(f !== "");
       },
       type: "single",
       collapsible: !0,
       children: /* @__PURE__ */ jsxs(AccordionItem, { value: "set-context", className: "border-none", children: [
-        /* @__PURE__ */ jsx(AccordionTrigger, { ref: m, className: "border-0 border-border py-2", children: /* @__PURE__ */ jsx("div", { className: "flex w-full items-center justify-between", children: /* @__PURE__ */ jsx("span", { className: "font-medium", children: o("AI Context") }) }) }),
+        /* @__PURE__ */ jsx(AccordionTrigger, { ref: g, className: "border-0 border-border py-2", children: /* @__PURE__ */ jsx("div", { className: "flex w-full items-center justify-between", children: /* @__PURE__ */ jsx("span", { className: "font-medium", children: o("AI Context") }) }) }),
         /* @__PURE__ */ jsxs(AccordionContent, { children: [
           /* @__PURE__ */ jsx(
             Textarea,
@@ -8848,14 +8859,14 @@ const UndoRedo = () => {
   ] });
 };
 function AIChatPanel() {
-  const [o, r] = useState([]), [n, a] = useState(""), [l, i] = useState(!1), [c, d] = useState(null), p = useRef(null), u = useRef(null), g = useRef(null);
+  const [o, r] = useState([]), [n, a] = useState(""), [l, i] = useState(!1), [c, d] = useState(null), p = useRef(null), u = useRef(null), m = useRef(null);
   useEffect(() => {
     var b;
     (b = u.current) == null || b.scrollIntoView({ behavior: "smooth" });
   }, [o]), useEffect(() => {
-    g.current && (g.current.style.height = "auto", g.current.style.height = `${Math.min(g.current.scrollHeight, 120)}px`);
+    m.current && (m.current.style.height = "auto", m.current.style.height = `${Math.min(m.current.scrollHeight, 120)}px`);
   }, [n]);
-  const m = async () => {
+  const g = async () => {
     if (!n.trim() && !c) return;
     const b = {
       id: Date.now().toString(),
@@ -8873,7 +8884,7 @@ function AIChatPanel() {
       r((A) => [...A, v]), i(!1), d(null);
     }, 1500);
   }, h = (b) => {
-    b.key === "Enter" && !b.shiftKey && (b.preventDefault(), m());
+    b.key === "Enter" && !b.shiftKey && (b.preventDefault(), g());
   }, f = (b) => {
     var A;
     const v = (A = b.target.files) == null ? void 0 : A[0];
@@ -8943,7 +8954,7 @@ function AIChatPanel() {
         /* @__PURE__ */ jsx(
           Textarea,
           {
-            ref: g,
+            ref: m,
             value: n,
             onChange: (b) => a(b.target.value),
             onKeyDown: h,
@@ -8968,7 +8979,7 @@ function AIChatPanel() {
         {
           size: "sm",
           className: "h-10 px-3",
-          onClick: m,
+          onClick: g,
           disabled: l || !n.trim() && !c,
           children: [
             /* @__PURE__ */ jsx(Send, { className: "mr-1 h-4 w-4" }),
@@ -9076,7 +9087,7 @@ const AiAssistant = () => {
   preloadedAttributes: r = [],
   onAttributesChange: n
 }) {
-  const [a, l] = useState([]), [i, c] = useState(""), [d, p] = useState(""), [u, g] = useState(null), [m, h] = useState(""), f = useRef(null), x = useRef(null), y = usePageExternalData();
+  const [a, l] = useState([]), [i, c] = useState(""), [d, p] = useState(""), [u, m] = useState(null), [g, h] = useState(""), f = useRef(null), x = useRef(null), y = usePageExternalData();
   useEffect(() => {
     l(r);
   }, [r]);
@@ -9093,7 +9104,7 @@ const AiAssistant = () => {
     const B = a.filter((N, C) => C !== S);
     n(B), l(B);
   }, A = (S) => {
-    g(S), c(a[S].key), p(a[S].value);
+    m(S), c(a[S].key), p(a[S].value);
   }, w = () => {
     if (i.startsWith("@")) {
       h("Attribute keys cannot start with '@'");
@@ -9101,7 +9112,7 @@ const AiAssistant = () => {
     }
     if (u !== null && i) {
       const S = [...a];
-      S[u] = { key: i, value: d }, n(S), l(S), g(null), c(""), p(""), h("");
+      S[u] = { key: i, value: d }, n(S), l(S), m(null), c(""), p(""), h("");
     }
   }, E = (S) => {
     S.key === "Enter" && !S.shiftKey && (S.preventDefault(), u !== null ? w() : b());
@@ -9177,7 +9188,7 @@ const AiAssistant = () => {
             ] })
           ] }),
           /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx(Button, { type: "submit", disabled: !i.length, variant: "default", size: "sm", className: "h-8 w-24 text-xs", children: u !== null ? "Save" : "Add" }) }),
-          m && /* @__PURE__ */ jsx("p", { className: "text-xs text-red-500", children: m })
+          g && /* @__PURE__ */ jsx("p", { className: "text-xs text-red-500", children: g })
         ]
       }
     ),
@@ -9308,9 +9319,9 @@ const RootLayout = () => {
   usePubSub(CHAI_BUILDER_EVENTS.SHOW_BLOCK_SETTINGS, () => {
     n("outline");
   });
-  const p = useChaiSidebarPanels("top"), u = useChaiSidebarPanels("bottom"), g = useCallback((S) => {
+  const p = useChaiSidebarPanels("top"), u = useChaiSidebarPanels("bottom"), m = useCallback((S) => {
     S.preventDefault();
-  }, []), m = useCallback((S) => {
+  }, []), g = useCallback((S) => {
     n(r === S ? null : S);
   }, []), h = useSidebarMenuItems(), { t: f } = useTranslation(), x = useMemo(() => [...h, ...p], [h, p]), y = useBuilderProp("htmlDir", "ltr"), b = find(x, { id: r }) ?? first(x), v = get(b, "width", DEFAULT_PANEL_WIDTH);
   useEffect(() => {
@@ -9333,15 +9344,15 @@ const RootLayout = () => {
   }, [r, x]);
   const _ = useCallback(
     (S) => {
-      m(S);
+      g(S);
     },
-    [m]
+    [g]
   );
   return /* @__PURE__ */ jsx("div", { dir: y, className: "h-screen max-h-full w-screen overflow-x-hidden bg-background text-foreground", children: /* @__PURE__ */ jsxs(TooltipProvider, { children: [
     /* @__PURE__ */ jsxs(
       "div",
       {
-        onContextMenu: g,
+        onContextMenu: m,
         className: "flex h-screen max-h-full flex-col bg-background text-foreground",
         children: [
           /* @__PURE__ */ jsx("div", { className: "h-14 w-screen shrink-0 border-b border-border", children: /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(o, {}) }) }),
@@ -9573,14 +9584,14 @@ const FEATURE_TOGGLES = {
 }, BUILDING_BLOCKS = Symbol(), buildStore = (o = /* @__PURE__ */ new WeakMap(), r = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap(), a = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), c = {}, d = (h, ...f) => h.read(...f), p = (h, ...f) => h.write(...f), u = (h, f) => {
   var x;
   return (x = h.unstable_onInit) == null ? void 0 : x.call(h, f);
-}, g = (h, f) => {
+}, m = (h, f) => {
   var x;
   return (x = h.onMount) == null ? void 0 : x.call(h, f);
-}, ...m) => {
-  const h = m[0] || ((B) => {
+}, ...g) => {
+  const h = g[0] || ((B) => {
     let N = o.get(B);
     return N || (N = { d: /* @__PURE__ */ new Map(), p: /* @__PURE__ */ new Set(), n: 0 }, o.set(B, N), u == null || u(B, S)), N;
-  }), f = m[1] || (() => {
+  }), f = g[1] || (() => {
     let B, N;
     const C = (k) => {
       try {
@@ -9599,7 +9610,7 @@ const FEATURE_TOGGLES = {
     } while (a.size || i.size || l.size);
     if (B)
       throw N;
-  }), x = m[2] || (() => {
+  }), x = g[2] || (() => {
     const B = [], N = /* @__PURE__ */ new WeakSet(), C = /* @__PURE__ */ new WeakSet(), k = Array.from(a);
     for (; k.length; ) {
       const j = k[k.length - 1], T = h(j);
@@ -9625,7 +9636,7 @@ const FEATURE_TOGGLES = {
         }
       P && (y(T), A(T)), n.delete(T);
     }
-  }), y = m[3] || ((B) => {
+  }), y = g[3] || ((B) => {
     var N, C;
     const k = h(B);
     if (isAtomStateInitialized(k) && (r.has(B) && n.get(B) !== k.n || Array.from(k.d).every(
@@ -9643,13 +9654,13 @@ const FEATURE_TOGGLES = {
     }, I = (R) => {
       var $;
       if (isSelfAtom(B, R)) {
-        const U = h(R);
-        if (!isAtomStateInitialized(U))
+        const H = h(R);
+        if (!isAtomStateInitialized(H))
           if (hasInitialValue(R))
             setAtomStateValueOrPromise(R, R.init, h);
           else
             throw new Error("no atom init");
-        return returnAtomValue(U);
+        return returnAtomValue(H);
       }
       const M = y(R);
       try {
@@ -9685,7 +9696,7 @@ const FEATURE_TOGGLES = {
     } finally {
       j = !1, O !== k.n && n.get(B) === O && (n.set(B, k.n), a.add(B), (C = c.c) == null || C.call(c, B));
     }
-  }), b = m[4] || ((B) => {
+  }), b = g[4] || ((B) => {
     const N = [B];
     for (; N.length; ) {
       const C = N.pop(), k = h(C);
@@ -9694,7 +9705,7 @@ const FEATURE_TOGGLES = {
         n.set(j, T.n), N.push(j);
       }
     }
-  }), v = m[5] || ((B, ...N) => {
+  }), v = g[5] || ((B, ...N) => {
     let C = !0;
     const k = (T) => returnAtomValue(y(T)), j = (T, ...I) => {
       var P;
@@ -9717,7 +9728,7 @@ const FEATURE_TOGGLES = {
     } finally {
       C = !1;
     }
-  }), A = m[6] || ((B) => {
+  }), A = g[6] || ((B) => {
     var N;
     const C = h(B), k = r.get(B);
     if (k && !isPendingPromise(C.v)) {
@@ -9733,7 +9744,7 @@ const FEATURE_TOGGLES = {
           T == null || T.t.delete(B);
         }
     }
-  }), w = m[7] || ((B) => {
+  }), w = g[7] || ((B) => {
     var N;
     const C = h(B);
     let k = r.get(B);
@@ -9756,7 +9767,7 @@ const FEATURE_TOGGLES = {
             }
           };
           try {
-            const P = g(B, I);
+            const P = m(B, I);
             P && (k.u = () => {
               T = !0;
               try {
@@ -9773,7 +9784,7 @@ const FEATURE_TOGGLES = {
       }
     }
     return k;
-  }), E = m[8] || ((B) => {
+  }), E = g[8] || ((B) => {
     var N;
     const C = h(B);
     let k = r.get(B);
@@ -9802,7 +9813,7 @@ const FEATURE_TOGGLES = {
     d,
     p,
     u,
-    g,
+    m,
     // building-block functions
     h,
     f,
@@ -9868,8 +9879,8 @@ const getDefaultStore = () => (defaultStore || (defaultStore = createStore()), d
 function useAtomValue(o, r) {
   const n = useStore(), [[a, l, i], c] = useReducer(
     (u) => {
-      const g = n.get(o);
-      return Object.is(u[0], g) && u[1] === n && u[2] === o ? u : [g, n, o];
+      const m = n.get(o);
+      return Object.is(u[0], m) && u[1] === n && u[2] === o ? u : [m, n, o];
     },
     void 0,
     () => [n.get(o), n, o]