@chaibuilder/sdk 1.2.104 → 1.2.106

package/dist/{index-dB_zEyAf.js → index-FXBj1MyA.js}

@@ -5,7 +5,7 @@ import { j as jsxRuntimeExports } from "./jsx-runtime-Sp0orL4X.js";
 import * as React from "react";
 import React__default, { createContext, useReducer, useEffect, useDebugValue, useCallback, useContext, useState, useMemo, Component, Children, Suspense, useRef, memo, createElement, lazy } from "react";
 import { a as Skeleton, B as Button, aA as ContextMenu, aB as ContextMenuTrigger, aC as ContextMenuContent, aD as ContextMenuItem, P as Tooltip, Q as TooltipTrigger, R as TooltipContent, C as Card, z as CardHeader, G as CardDescription, H as CardContent, L as Label, T as Textarea, E as CardFooter, D as Dialog, t as DialogTrigger, u as DialogContent, v as DialogHeader, x as DialogTitle, y as DialogDescription, w as DialogFooter, W as Popover, X as PopoverTrigger, Y as PopoverContent, ar as Command, at as CommandInput, au as CommandList, av as CommandEmpty, aw as CommandGroup, ax as CommandItem, K as Tabs, M as TabsList, N as TabsTrigger, O as TabsContent, d as Switch, A as Accordion, f as AccordionItem, g as AccordionTrigger, h as AccordionContent, ao as useToast, I as Input$1, V as TooltipPortal, a8 as DropdownMenu, a9 as DropdownMenuTrigger, aa as DropdownMenuContent, S as ScrollArea, ae as DropdownMenuLabel, af as DropdownMenuSeparator, ah as DropdownMenuGroup, ab as DropdownMenuItem, ag as DropdownMenuShortcut, k as AlertDialog, m as AlertDialogContent, n as AlertDialogHeader, p as AlertDialogTitle, l as AlertDialogTrigger, q as AlertDialogDescription, o as AlertDialogFooter, s as AlertDialogCancel, r as AlertDialogAction, ac as DropdownMenuCheckboxItem, Z as HoverCard, _ as HoverCardTrigger, $ as HoverCardContent, b as Separator, i as Badge, a0 as Select, a3 as SelectTrigger, a2 as SelectValue, a4 as SelectContent, a6 as SelectItem, U as TooltipProvider, aq as Toaster } from "./context-menu-YGd09SE1.js";
-import { has, find, filter, flatten, map, omit, isString as isString$1, includes, without, get, compact, set, endsWith, isEmpty, forIn, isObject as isObject$1, each, first, noop, keys, startsWith, range, values, flattenDeep, isNull, pick, sortBy, memoize, forEach, unset, chunk, throttle, cloneDeep, reverse, debounce, flatMapDeep, capitalize, last, startCase, truncate, isArray as isArray$1, split, toLower, reject, nth, isNumber as isNumber$1, parseInt as parseInt$1, isNaN as isNaN$1, findLast, intersection, groupBy, isFunction as isFunction$1, uniq, toUpper, round } from "lodash-es";
+import { has, find, filter, flatten, map, omit, isString as isString$1, includes, without, get, compact, set, endsWith, isEmpty, forIn, isObject as isObject$1, each, first, noop, merge, keys, startsWith, range, values, flattenDeep, isNull, pick, sortBy, memoize, forEach, unset, chunk, throttle, cloneDeep, reverse, debounce, flatMapDeep, capitalize, last, startCase, truncate, isArray as isArray$1, split, toLower, reject, nth, isNumber as isNumber$1, parseInt as parseInt$1, isNaN as isNaN$1, findLast, intersection, groupBy, isFunction as isFunction$1, uniq, toUpper, round } from "lodash-es";
 import { atom as atom$1, useAtomValue as useAtomValue$1, useAtom as useAtom$1, useSetAtom as useSetAtom$1, getDefaultStore as getDefaultStore$1 } from "jotai";
 import { g as generateUUID, a as getBreakpointValue, c as cn, G as GenIcon } from "./iconBase-Ief2hJUZ.js";
 import { getBlockComponent, useChaiBlocks, getChaiDataProviders, useGlobalStylingPresets, syncBlocksWithDefaults } from "@chaibuilder/runtime";
@@ -19,7 +19,7 @@ import { useFeature, FlagsProvider } from "flagged";
 import { useHotkeys } from "react-hotkeys-hook";
 import { flip } from "@floating-ui/dom";
 import { useFloating, shift } from "@floating-ui/react-dom";
-import { ArrowUpIcon, PlusIcon, CopyIcon, GearIcon, TrashIcon, DragHandleDots2Icon, BoxModelIcon, BoxIcon, DragHandleHorizontalIcon, ViewHorizontalIcon, BorderAllIcon, BorderTopIcon, TableIcon, DropdownMenuIcon, RadiobuttonIcon, InputIcon, ButtonIcon, CheckboxIcon, GroupIcon, SpaceBetweenVerticallyIcon, ColumnsIcon, RowsIcon, TextIcon, SketchLogoIcon, DividerHorizontalIcon, CodeIcon, CursorTextIcon, VideoIcon, Link1Icon, HeadingIcon, ImageIcon, CardStackPlusIcon, CardStackIcon, ScissorsIcon, TriangleRightIcon, EyeOpenIcon, Cross2Icon, EyeClosedIcon, WidthIcon, HeightIcon, ArrowRightIcon, ArrowDownIcon, ArrowLeftIcon, ArrowTopLeftIcon, ArrowTopRightIcon, ArrowBottomRightIcon, ArrowBottomLeftIcon, AlignLeftIcon, AlignCenterHorizontallyIcon, AlignRightIcon, StretchHorizontallyIcon, FontItalicIcon, UnderlineIcon, OverlineIcon, LetterCaseUppercaseIcon, Cross1Icon, InfoCircledIcon, MinusIcon, TriangleDownIcon, RowSpacingIcon, CrossCircledIcon, CaretDownIcon, CaretRightIcon, CheckIcon, ResetIcon, SunIcon, DotsVerticalIcon, MobileIcon, LaptopIcon, DesktopIcon, EraserIcon, GlobeIcon as GlobeIcon$1, ZoomInIcon, MixerHorizontalIcon, KeyboardIcon, LightningBoltIcon } from "@radix-ui/react-icons";
+import { ArrowUpIcon, PlusIcon, CopyIcon, GearIcon, TrashIcon, DragHandleDots2Icon, BoxModelIcon, BoxIcon, DragHandleHorizontalIcon, ViewHorizontalIcon, BorderAllIcon, BorderTopIcon, TableIcon, DropdownMenuIcon, RadiobuttonIcon, InputIcon, ButtonIcon, CheckboxIcon, GroupIcon, SpaceBetweenVerticallyIcon, ColumnsIcon, RowsIcon, TextIcon, SketchLogoIcon, DividerHorizontalIcon, CodeIcon, CursorTextIcon, VideoIcon, Link1Icon, HeadingIcon, ImageIcon, CardStackPlusIcon, CardStackIcon, ScissorsIcon, TriangleRightIcon, EyeOpenIcon, Cross2Icon, EyeClosedIcon, WidthIcon, HeightIcon, ArrowRightIcon, ArrowDownIcon, ArrowLeftIcon, ArrowTopLeftIcon, ArrowTopRightIcon, ArrowBottomRightIcon, ArrowBottomLeftIcon, AlignLeftIcon, AlignCenterHorizontallyIcon, AlignRightIcon, StretchHorizontallyIcon, FontItalicIcon, UnderlineIcon, OverlineIcon, LetterCaseUppercaseIcon, Cross1Icon, InfoCircledIcon, MinusIcon, TriangleDownIcon, RowSpacingIcon, CrossCircledIcon, CaretDownIcon, CaretRightIcon, CheckIcon, ResetIcon, SunIcon, DotsVerticalIcon, MobileIcon, LaptopIcon, DesktopIcon, EraserIcon, ChevronDownIcon, ZoomInIcon, MixerHorizontalIcon, KeyboardIcon, LightningBoltIcon } from "@radix-ui/react-icons";
 import { createEvent } from "react-event-hook";
 import typography$1 from "@tailwindcss/typography";
 import forms from "@tailwindcss/forms";
@@ -89,23 +89,23 @@ const hasInitialValue = (o) => "init" in o, isActuallyWritableAtom = (o) => !!o.
   const o = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap(), r = /* @__PURE__ */ new Map();
   let a, l, i;
   (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set());
-  const c = (b) => o.get(b), d = (b, _) => {
-    (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && Object.freeze(_);
+  const c = (b) => o.get(b), d = (b, k) => {
+    (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && Object.freeze(k);
     const C = o.get(b);
-    if (o.set(b, _), r.has(b) || r.set(b, C), C && hasPromiseAtomValue(C)) {
-      const R = "v" in _ ? _.v instanceof Promise ? _.v : Promise.resolve(_.v) : Promise.reject(_.e);
+    if (o.set(b, k), r.has(b) || r.set(b, C), C && hasPromiseAtomValue(C)) {
+      const R = "v" in k ? k.v instanceof Promise ? k.v : Promise.resolve(k.v) : Promise.reject(k.e);
       cancelPromise(C.v, R);
     }
-  }, u = (b, _, C) => {
+  }, u = (b, k, C) => {
     const R = /* @__PURE__ */ new Map();
     let I = !1;
     C.forEach((L, P) => {
-      !L && P === b && (L = _), L ? (R.set(P, L), _.d.get(P) !== L && (I = !0)) : (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && console.warn("[Bug] atom state not found");
-    }), (I || _.d.size !== R.size) && (_.d = R);
-  }, p = (b, _, C) => {
+      !L && P === b && (L = k), L ? (R.set(P, L), k.d.get(P) !== L && (I = !0)) : (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && console.warn("[Bug] atom state not found");
+    }), (I || k.d.size !== R.size) && (k.d = R);
+  }, p = (b, k, C) => {
     const R = c(b), I = {
       d: (R == null ? void 0 : R.d) || /* @__PURE__ */ new Map(),
-      v: _
+      v: k
     };
     if (C && u(b, I, C), R && isEqualAtomValue(R, I) && R.d === I.d)
       return R;
@@ -115,75 +115,75 @@ const hasInitialValue = (o) => "init" in o, isActuallyWritableAtom = (o) => !!o.
       I.v = R.v;
     }
     return d(b, I), I;
-  }, m = (b, _, C, R) => {
-    if (isPromiseLike$2(_)) {
+  }, m = (b, k, C, R) => {
+    if (isPromiseLike$2(k)) {
       let I;
       const L = new Promise((P, V) => {
-        let $ = !1;
-        _.then(
+        let M = !1;
+        k.then(
           (O) => {
-            if (!$) {
-              $ = !0;
-              const M = c(b), H = p(
+            if (!M) {
+              M = !0;
+              const $ = c(b), H = p(
                 b,
                 L,
                 C
               );
-              resolvePromise(L, O), P(O), (M == null ? void 0 : M.d) !== H.d && N(b, H, M == null ? void 0 : M.d);
+              resolvePromise(L, O), P(O), ($ == null ? void 0 : $.d) !== H.d && N(b, H, $ == null ? void 0 : $.d);
             }
           },
           (O) => {
-            if (!$) {
-              $ = !0;
-              const M = c(b), H = p(
+            if (!M) {
+              M = !0;
+              const $ = c(b), H = p(
                 b,
                 L,
                 C
               );
-              rejectPromise(L, O), V(O), (M == null ? void 0 : M.d) !== H.d && N(b, H, M == null ? void 0 : M.d);
+              rejectPromise(L, O), V(O), ($ == null ? void 0 : $.d) !== H.d && N(b, H, $ == null ? void 0 : $.d);
             }
           }
         ), I = (O) => {
-          $ || ($ = !0, O.then(
-            (M) => resolvePromise(L, M),
-            (M) => rejectPromise(L, M)
+          M || (M = !0, O.then(
+            ($) => resolvePromise(L, $),
+            ($) => rejectPromise(L, $)
           ), P(O));
         };
       });
-      return L.orig = _, L.status = "pending", registerCancelPromise(L, (P) => {
+      return L.orig = k, L.status = "pending", registerCancelPromise(L, (P) => {
         P && I(P), R == null || R();
       }), p(b, L, C);
     }
-    return p(b, _, C);
-  }, x = (b, _, C) => {
+    return p(b, k, C);
+  }, x = (b, k, C) => {
     const R = c(b), I = {
       d: (R == null ? void 0 : R.d) || /* @__PURE__ */ new Map(),
-      e: _
+      e: k
     };
     return C && u(b, I, C), R && isEqualAtomError(R, I) && R.d === I.d ? R : (d(b, I), I);
   }, g = (b) => {
-    const _ = c(b);
-    if (_ && (_.d.forEach(($, O) => {
+    const k = c(b);
+    if (k && (k.d.forEach((M, O) => {
       O !== b && !n.has(O) && g(O);
-    }), Array.from(_.d).every(([$, O]) => {
-      const M = c($);
-      return $ === b || M === O || // TODO This is a hack, we should find a better solution.
-      M && !hasPromiseAtomValue(M) && isEqualAtomValue(M, O);
+    }), Array.from(k.d).every(([M, O]) => {
+      const $ = c(M);
+      return M === b || $ === O || // TODO This is a hack, we should find a better solution.
+      $ && !hasPromiseAtomValue($) && isEqualAtomValue($, O);
     })))
-      return _;
+      return k;
     const C = /* @__PURE__ */ new Map();
     let R = !0;
-    const I = ($) => {
-      if ($ === b) {
-        const M = c($);
-        if (M)
-          return C.set($, M), returnAtomValue(M);
-        if (hasInitialValue($))
-          return C.set($, void 0), $.init;
+    const I = (M) => {
+      if (M === b) {
+        const $ = c(M);
+        if ($)
+          return C.set(M, $), returnAtomValue($);
+        if (hasInitialValue(M))
+          return C.set(M, void 0), M.init;
         throw new Error("no atom init");
       }
-      const O = g($);
-      return C.set($, O), returnAtomValue(O);
+      const O = g(M);
+      return C.set(M, O), returnAtomValue(O);
     };
     let L, P;
     const V = {
@@ -191,38 +191,38 @@ const hasInitialValue = (o) => "init" in o, isActuallyWritableAtom = (o) => !!o.
         return L || (L = new AbortController()), L.signal;
       },
       get setSelf() {
-        return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && !isActuallyWritableAtom(b) && console.warn("setSelf function cannot be used with read-only atom"), !P && isActuallyWritableAtom(b) && (P = (...$) => {
+        return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && !isActuallyWritableAtom(b) && console.warn("setSelf function cannot be used with read-only atom"), !P && isActuallyWritableAtom(b) && (P = (...M) => {
           if ((define_import_meta_env_default$2 ? "production" : void 0) !== "production" && R && console.warn("setSelf function cannot be called in sync"), !R)
-            return B(b, ...$);
+            return B(b, ...M);
         }), P;
       }
     };
     try {
-      const $ = b.read(I, V);
+      const M = b.read(I, V);
       return m(
         b,
-        $,
+        M,
         C,
         () => L == null ? void 0 : L.abort()
       );
-    } catch ($) {
-      return x(b, $, C);
+    } catch (M) {
+      return x(b, M, C);
     } finally {
       R = !1;
     }
   }, E = (b) => returnAtomValue(g(b)), j = (b) => {
-    let _ = n.get(b);
-    return _ || (_ = A(b)), _;
-  }, f = (b, _) => !_.l.size && (!_.t.size || _.t.size === 1 && _.t.has(b)), k = (b) => {
-    const _ = n.get(b);
-    _ && f(b, _) && w(b);
+    let k = n.get(b);
+    return k || (k = w(b)), k;
+  }, f = (b, k) => !k.l.size && (!k.t.size || k.t.size === 1 && k.t.has(b)), _ = (b) => {
+    const k = n.get(b);
+    k && f(b, k) && A(b);
   }, v = (b) => {
-    const _ = /* @__PURE__ */ new Map(), C = /* @__PURE__ */ new WeakMap(), R = (L) => {
+    const k = /* @__PURE__ */ new Map(), C = /* @__PURE__ */ new WeakMap(), R = (L) => {
       const P = n.get(L);
       P == null || P.t.forEach((V) => {
-        V !== L && (_.set(
+        V !== L && (k.set(
           V,
-          (_.get(V) || /* @__PURE__ */ new Set()).add(L)
+          (k.get(V) || /* @__PURE__ */ new Set()).add(L)
         ), C.set(V, (C.get(V) || 0) + 1), R(V));
       });
     };
@@ -230,89 +230,89 @@ const hasInitialValue = (o) => "init" in o, isActuallyWritableAtom = (o) => !!o.
     const I = (L) => {
       const P = n.get(L);
       P == null || P.t.forEach((V) => {
-        var $;
+        var M;
         if (V !== L) {
           let O = C.get(V);
           if (O && C.set(V, --O), !O) {
-            let M = !!(($ = _.get(V)) != null && $.size);
-            if (M) {
+            let $ = !!((M = k.get(V)) != null && M.size);
+            if ($) {
               const H = c(V), F = g(V);
-              M = !H || !isEqualAtomValue(H, F);
+              $ = !H || !isEqualAtomValue(H, F);
             }
-            M || _.forEach((H) => H.delete(V));
+            $ || k.forEach((H) => H.delete(V));
           }
           I(V);
         }
       });
     };
     I(b);
-  }, S = (b, ..._) => {
+  }, S = (b, ...k) => {
     let C = !0;
     const R = (P) => returnAtomValue(g(P)), I = (P, ...V) => {
-      let $;
+      let M;
       if (P === b) {
         if (!hasInitialValue(P))
           throw new Error("atom not writable");
-        const O = c(P), M = m(P, V[0]);
-        (!O || !isEqualAtomValue(O, M)) && v(P);
+        const O = c(P), $ = m(P, V[0]);
+        (!O || !isEqualAtomValue(O, $)) && v(P);
       } else
-        $ = S(P, ...V);
+        M = S(P, ...V);
       if (!C) {
         const O = D();
         (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && l.forEach(
-          (M) => M({ type: "async-write", flushed: O })
+          ($) => $({ type: "async-write", flushed: O })
         );
       }
-      return $;
-    }, L = b.write(R, I, ..._);
+      return M;
+    }, L = b.write(R, I, ...k);
     return C = !1, L;
-  }, B = (b, ..._) => {
-    const C = S(b, ..._), R = D();
+  }, B = (b, ...k) => {
+    const C = S(b, ...k), R = D();
     return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && l.forEach(
       (I) => I({ type: "write", flushed: R })
     ), C;
-  }, A = (b, _) => {
+  }, w = (b, k) => {
     const C = {
-      t: new Set(_ && [_]),
+      t: new Set(k && [k]),
       l: /* @__PURE__ */ new Set()
     };
     if (n.set(b, C), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && i.add(b), g(b).d.forEach((R, I) => {
       const L = n.get(I);
-      L ? L.t.add(b) : I !== b && A(I, b);
+      L ? L.t.add(b) : I !== b && w(I, b);
     }), g(b), isActuallyWritableAtom(b) && b.onMount) {
       const R = b.onMount((...I) => B(b, ...I));
       R && (C.u = R);
     }
     return C;
-  }, w = (b) => {
-    var _;
-    const C = (_ = n.get(b)) == null ? void 0 : _.u;
+  }, A = (b) => {
+    var k;
+    const C = (k = n.get(b)) == null ? void 0 : k.u;
     C && C(), n.delete(b), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && i.delete(b);
     const R = c(b);
     R ? (hasPromiseAtomValue(R) && cancelPromise(R.v), R.d.forEach((I, L) => {
       if (L !== b) {
         const P = n.get(L);
-        P && (P.t.delete(b), f(L, P) && w(L));
+        P && (P.t.delete(b), f(L, P) && A(L));
       }
     })) : (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && console.warn("[Bug] could not find atom state to unmount", b);
-  }, N = (b, _, C) => {
-    const R = new Set(_.d.keys());
+  }, N = (b, k, C) => {
+    const R = new Set(k.d.keys());
     C == null || C.forEach((I, L) => {
       if (R.has(L)) {
         R.delete(L);
         return;
       }
       const P = n.get(L);
-      P && (P.t.delete(b), f(L, P) && w(L));
+      P && (P.t.delete(b), f(L, P) && A(L));
     }), R.forEach((I) => {
       const L = n.get(I);
-      L ? L.t.add(b) : n.has(b) && A(I, b);
+      L ? L.t.add(b) : n.has(b) && w(I, b);
     });
   }, D = () => {
     let b;
     for ((define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (b = /* @__PURE__ */ new Set()); r.size; ) {
-      const _ = Array.from(r);
-      r.clear(), _.forEach(([C, R]) => {
+      const k = Array.from(r);
+      r.clear(), k.forEach(([C, R]) => {
         const I = c(C);
         if (I) {
           I.d !== (R == null ? void 0 : R.d) && N(C, I, R == null ? void 0 : R.d);
@@ -325,13 +325,13 @@ const hasInitialValue = (o) => "init" in o, isActuallyWritableAtom = (o) => !!o.
       });
     }
     if ((define_import_meta_env_default$2 ? "production" : void 0) !== "production")
-      return a.forEach((_) => _("state")), b;
-  }, T = (b, _) => {
+      return a.forEach((k) => k("state")), b;
+  }, T = (b, k) => {
     const C = j(b), R = D(), I = C.l;
-    return I.add(_), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a.forEach((L) => L("sub")), l.forEach(
+    return I.add(k), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a.forEach((L) => L("sub")), l.forEach(
       (L) => L({ type: "sub", flushed: R })
     )), () => {
-      I.delete(_), k(b), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a.forEach((L) => L("unsub")), l.forEach((L) => L({ type: "unsub" })));
+      I.delete(k), _(b), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a.forEach((L) => L("unsub")), l.forEach((L) => L({ type: "unsub" })));
     };
   };
   return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" ? {
@@ -339,7 +339,7 @@ const hasInitialValue = (o) => "init" in o, isActuallyWritableAtom = (o) => !!o.
     set: B,
     sub: T,
     // store dev methods (these are tentative and subject to change without notice)
-    dev_subscribe_store: (b, _) => _ !== 2 ? (console.warn(
+    dev_subscribe_store: (b, k) => k !== 2 ? (console.warn(
       "The current StoreListener revision is 2. The older ones are deprecated."
     ), a.add(b), () => {
       a.delete(b);
@@ -352,9 +352,9 @@ const hasInitialValue = (o) => "init" in o, isActuallyWritableAtom = (o) => !!o.
     dev_restore_atoms: (b) => {
       for (const [C, R] of b)
         hasInitialValue(C) && (m(C, R), v(C));
-      const _ = D();
+      const k = D();
       l.forEach(
-        (C) => C({ type: "restore", flushed: _ })
+        (C) => C({ type: "restore", flushed: k })
       );
     }
   } : {
@@ -386,27 +386,27 @@ function splitAtom(o, n) {
             m[E] = f;
             return;
           }
-          const k = (S) => {
-            const B = S(l), A = S(o), N = a(A, B == null ? void 0 : B.arr).keyList.indexOf(j);
-            if (N < 0 || N >= A.length) {
+          const _ = (S) => {
+            const B = S(l), w = S(o), N = a(w, B == null ? void 0 : B.arr).keyList.indexOf(j);
+            if (N < 0 || N >= w.length) {
               const D = c[a(c).keyList.indexOf(j)];
               if (D)
                 return D;
               throw new Error("splitAtom: index out of bounds for read");
             }
-            return A[N];
-          }, v = (S, B, A) => {
-            const w = S(l), N = S(o), T = a(N, w == null ? void 0 : w.arr).keyList.indexOf(j);
+            return w[N];
+          }, v = (S, B, w) => {
+            const A = S(l), N = S(o), T = a(N, A == null ? void 0 : A.arr).keyList.indexOf(j);
             if (T < 0 || T >= N.length)
               throw new Error("splitAtom: index out of bounds for write");
-            const b = isFunction(A) ? A(N[T]) : A;
+            const b = isFunction(w) ? w(N[T]) : w;
             B(o, [
               ...N.slice(0, T),
               b,
               ...N.slice(T + 1)
             ]);
           };
-          m[E] = isWritable(o) ? atom(k, v) : atom(k);
+          m[E] = isWritable(o) ? atom(_, v) : atom(_);
         }), p && p.keyList.length === x.length && p.keyList.every((g, E) => g === x[E]) ? u = p : u = { arr: c, atomList: m, keyList: x }, r.set(c, u), u;
       }, l = atom((c) => {
         const d = c(l), u = c(o);
@@ -1179,7 +1179,7 @@ const useBlocksStoreManager = () => {
         return r.map((l) => {
           if (a.includes(l._id)) {
             const i = find(n, { _id: l._id });
-            return { ...l, ...omit(i, "_id") };
+            return merge({}, l, { ...omit(i, "_id") });
           }
           return l;
         });
@@ -1195,22 +1195,22 @@ const useBlocksStoreManager = () => {
     updateBlocksProps: c
   } = useBlocksStoreManager();
   return {
-    moveBlocks: (j, f, k) => {
+    moveBlocks: (j, f, _) => {
       const v = map(j, (B) => {
-        const w = n.find((T) => T._id === B)._parent || null, D = n.filter((T) => w ? T._parent === w : !T._parent).map((T) => T._id).indexOf(B);
-        return { _id: B, oldParent: w, oldPosition: D };
+        const A = n.find((T) => T._id === B)._parent || null, D = n.filter((T) => A ? T._parent === A : !T._parent).map((T) => T._id).indexOf(B);
+        return { _id: B, oldParent: A, oldPosition: D };
       }), S = v.find(({ _id: B }) => B === j[0]);
-      S && S.oldParent === f && S.oldPosition === k || (i(j, f, k), o({
-        undo: () => each(v, ({ _id: B, oldParent: A, oldPosition: w }) => {
-          i([B], A, w);
+      S && S.oldParent === f && S.oldPosition === _ || (i(j, f, _), o({
+        undo: () => each(v, ({ _id: B, oldParent: w, oldPosition: A }) => {
+          i([B], w, A);
         }),
-        redo: () => i(j, f, k)
+        redo: () => i(j, f, _)
       }));
     },
-    addBlocks: (j, f, k) => {
-      a(j, f, k), o({
+    addBlocks: (j, f, _) => {
+      a(j, f, _), o({
         undo: () => l(map(j, "_id")),
-        redo: () => a(j, f, k)
+        redo: () => a(j, f, _)
       });
     },
     removeBlocks: (j) => {
@@ -1221,15 +1221,15 @@ const useBlocksStoreManager = () => {
         redo: () => l(map(j, "_id"))
       });
     },
-    updateBlocks: (j, f, k) => {
+    updateBlocks: (j, f, _) => {
       let v = [];
-      if (k)
-        v = map(j, (S) => ({ _id: S, ...k }));
+      if (_)
+        v = map(j, (S) => ({ _id: S, ..._ }));
       else {
         const S = keys(f);
         v = map(j, (B) => {
-          const A = n.find((N) => N._id === B), w = { _id: B };
-          return each(S, (N) => w[N] = A[N]), w;
+          const w = n.find((N) => N._id === B), A = { _id: B };
+          return each(S, (N) => A[N] = w[N]), A;
         });
       }
       c(map(j, (S) => ({ _id: S, ...f }))), o({
@@ -1238,7 +1238,7 @@ const useBlocksStoreManager = () => {
       });
     },
     updateBlocksRuntime: (j, f) => {
-      c(map(j, (k) => ({ _id: k, ...f })));
+      c(map(j, (_) => ({ _id: _, ...f })));
     },
     setNewBlocks: (j) => {
       r(j), o({
@@ -1248,9 +1248,9 @@ const useBlocksStoreManager = () => {
     },
     updateMultipleBlocksProps: (j) => {
       let f = [];
-      f = map(j, (k) => {
-        const v = keys(k), S = n.find((A) => A._id === k._id), B = {};
-        return each(v, (A) => B[A] = S[A]), B;
+      f = map(j, (_) => {
+        const v = keys(_), S = n.find((w) => w._id === _._id), B = {};
+        return each(v, (w) => B[w] = S[w]), B;
       }), c(j), o({
         undo: () => c(f),
         redo: () => c(j)
@@ -1265,8 +1265,8 @@ const useBlocksStoreManager = () => {
         const { _id: j } = i[E];
         i[E]._id = generateUUID();
         const f = filter(i, { _parent: j });
-        for (let k = 0; k < f.length; k++)
-          f[k]._parent = i[E]._id;
+        for (let _ = 0; _ < f.length; _++)
+          f[_]._parent = i[E]._id;
       }
       const u = first(i);
       let p, m;
@@ -1277,13 +1277,13 @@ const useBlocksStoreManager = () => {
   return { addCoreBlock: useCallback(
     (i, c, d) => {
       if (has(i, "blocks")) {
-        const k = i.blocks;
-        return a(k, c, d);
+        const _ = i.blocks;
+        return a(_, c, d);
       }
       const u = generateUUID(), p = getBlockDefaultProps(i.props), m = [];
-      forIn(p, (k, v) => {
-        if (startsWith(k, SLOT_KEY)) {
-          const S = k.replace(SLOT_KEY, "");
+      forIn(p, (_, v) => {
+        if (startsWith(_, SLOT_KEY)) {
+          const S = _.replace(SLOT_KEY, "");
           m.push({
             _id: S,
             _type: "Slot",
@@ -2661,7 +2661,7 @@ const useLanguages = () => {
       const c = updatePropsForLanguage(l, n, r);
       o(a, c, i);
     },
-    [o, n]
+    [n, r, o]
   );
 }, useUpdateMultipleBlocksProps = () => {
   const { updateMultipleBlocksProps: o } = useBlocksStoreUndoableActions();
@@ -2697,7 +2697,7 @@ const useLanguages = () => {
         await n(a._id, a);
       o(r);
     },
-    [o]
+    [n, o]
   );
 }, useUpdateBlocksPropsRealtime = () => {
   const { updateBlocksRuntime: o } = useBlocksStoreUndoableActions(), { selectedLang: n } = useLanguages(), r = useSelectedBlock();
@@ -2706,7 +2706,7 @@ const useLanguages = () => {
       const i = updatePropsForLanguage(l, n, r);
       o(a, i);
     },
-    [o, n]
+    [n, r, o]
   );
 }, selectedBreakpointsAtom = atomWithStorage("selectedBreakpoints", ["XS", "MD", "XL"]), useSelectedBreakpoints = () => {
   const [o, n] = useAtom$1(selectedBreakpointsAtom);
@@ -3062,26 +3062,26 @@ const useDnd = () => {
       g.preventDefault(), g.stopPropagation(), throttledDragOver(g);
     },
     onDrop: (g) => {
-      var A;
-      const E = dropTarget, f = getOrientation(E) === "vertical" ? g.clientY + ((A = iframeDocument == null ? void 0 : iframeDocument.defaultView) == null ? void 0 : A.scrollY) : g.clientX;
+      var w;
+      const E = dropTarget, f = getOrientation(E) === "vertical" ? g.clientY + ((w = iframeDocument == null ? void 0 : iframeDocument.defaultView) == null ? void 0 : w.scrollY) : g.clientX;
       dropIndex = calculateDropIndex(f, possiblePositions);
-      const k = d, v = E.getAttribute("data-block-id"), S = dropTarget.getAttribute("data-dnd-dragged") !== "yes";
-      if ((k == null ? void 0 : k._id) === v || !S) {
+      const _ = d, v = E.getAttribute("data-block-id"), S = dropTarget.getAttribute("data-dnd-dragged") !== "yes";
+      if ((_ == null ? void 0 : _._id) === v || !S) {
         x();
         return;
       }
-      if (!has(k, "_id")) {
-        a(k, v === "canvas" ? null : v, dropIndex), setTimeout(x, 300);
+      if (!has(_, "_id")) {
+        a(_, v === "canvas" ? null : v, dropIndex), setTimeout(x, 300);
         return;
       }
       let B = E.getAttribute("data-block-id");
-      B === null && (B = g.target.parentElement.getAttribute("data-block-id")), c([k._id], B === "canvas" ? null : B, dropIndex), x(), setTimeout(removePlaceholder, 300);
+      B === null && (B = g.target.parentElement.getAttribute("data-block-id")), c([_._id], B === "canvas" ? null : B, dropIndex), x(), setTimeout(removePlaceholder, 300);
     },
     onDragEnter: (g) => {
       const E = g, j = E.target;
       dropTarget = j;
-      const f = j.getAttribute("data-block-id"), k = j.getAttribute("data-dnd-dragged") !== "yes";
-      p(f), E.stopPropagation(), E.preventDefault(), possiblePositions = [], k && calculatePossiblePositions(j), r(!0), l(""), i([]);
+      const f = j.getAttribute("data-block-id"), _ = j.getAttribute("data-dnd-dragged") !== "yes";
+      p(f), E.stopPropagation(), E.preventDefault(), possiblePositions = [], _ && calculatePossiblePositions(j), r(!0), l(""), i([]);
     },
     onDragLeave: (g) => {
       g.target.getAttribute("data-block-id") === "canvas" && (p(null), r(!1), removePlaceholder(), possiblePositions = []);
@@ -3293,16 +3293,16 @@ const useHandleCanvasDblClick = () => {
   }, [r, d]);
   const E = get(o, "headingFont", "DM Sans"), j = get(o, "bodyFont", "DM Sans");
   return useEffect(() => {
-    const f = get(o, "primaryColor", "#000"), k = get(o, "secondaryColor", "#FFF"), v = get(o, "bodyBgLightColor", "#fff"), S = get(o, "bodyBgDarkColor", "#000"), B = get(o, "bodyTextDarkColor", "#000"), A = get(o, "bodyTextLightColor", "#fff"), w = s({
-      colors: [f, k],
+    const f = get(o, "primaryColor", "#000"), _ = get(o, "secondaryColor", "#FFF"), v = get(o, "bodyBgLightColor", "#fff"), S = get(o, "bodyBgDarkColor", "#000"), B = get(o, "bodyTextDarkColor", "#000"), w = get(o, "bodyTextLightColor", "#fff"), A = s({
+      colors: [f, _],
       names: ["primary", "secondary"]
     });
-    set(w, "primary.DEFAULT", f), set(w, "secondary.DEFAULT", k);
+    set(A, "primary.DEFAULT", f), set(A, "secondary.DEFAULT", _);
     const N = {
       "bg-light": v,
       "bg-dark": S,
       "text-dark": B,
-      "text-light": A
+      "text-light": w
     }, D = get(o, "roundedCorners", "0");
     !u || !u.tailwind || (u.tailwind.config = {
       darkMode: "class",
@@ -3322,7 +3322,7 @@ const useHandleCanvasDblClick = () => {
           borderRadius: {
             DEFAULT: `${D || "0"}px`
           },
-          colors: { ...N, ...w }
+          colors: { ...N, ...A }
         }
       },
       plugins: [
@@ -3484,14 +3484,14 @@ function applyLanguage(o, n, r) {
 }
 function BlocksRendererStatic({ blocks: o, allBlocks: n }) {
   const { selectedLang: r } = useLanguages(), [a] = useAtom$1(xShowBlocksAtom), [l] = useCutBlockIds(), [i] = useAtom$1(draggedBlockAtom), [c] = useAtom$1(dropTargetBlockIdAtom), [, d] = useCanvasWidth(), [u] = useCanvasSettings(), [p] = useHiddenBlockIds(), { getGlobalBlocks: m } = useGlobalBlocksStore(), x = useCallback((f) => getStyleAttrs(f, d), [d]), [g] = useChaiExternalData(), [E] = useAtom$1(inlineEditingActiveAtom), j = useCallback(
-    (f) => f.reduce((k, v) => {
+    (f) => f.reduce((_, v) => {
       const S = get(u, v, {});
-      return { ...k, ...S };
+      return { ..._, ...S };
     }, {}),
     [u]
   );
   return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: React__default.Children.toArray(
-    o.map((f, k) => {
+    o.map((f, _) => {
       if (E === f._id || p.includes(f._id))
         return null;
       const v = {}, S = filter(n, { _parent: f._id });
@@ -3499,13 +3499,13 @@ function BlocksRendererStatic({ blocks: o, allBlocks: n }) {
         const C = m(f);
         v.children = /* @__PURE__ */ jsxRuntimeExports.jsx(RenderGlobalBlock, { blocks: filter(C, (R) => !R._parent), allBlocks: C });
       }
-      const B = getBlockComponent(f._type), A = get(B, "server", !1), w = A ? RSCBlock : get(B, "builderComponent", get(B, "component", null));
-      if (isNull(w))
+      const B = getBlockComponent(f._type), w = get(B, "server", !1), A = w ? RSCBlock : get(B, "builderComponent", get(B, "component", null));
+      if (isNull(A))
         return /* @__PURE__ */ jsxRuntimeExports.jsx("noscript", { children: `<!-- ${f == null ? void 0 : f._type} not registered -->` });
       const N = has(B, "getBlockStateFrom") ? B == null ? void 0 : B.getBlockStateFrom(f, n) : [], D = j(N), T = x(f);
       if (get(T, "__isHidden", !1) && !includes(a, f._id))
         return null;
-      const b = i && isDescendant(i._id, f._id, n), _ = {
+      const b = i && isDescendant(i._id, f._id, n), k = {
         ...includes(a, f._id) ? { "force-show": "" } : {},
         "data-block-id": f._id,
         "data-block-type": f._type,
@@ -3519,9 +3519,9 @@ function BlocksRendererStatic({ blocks: o, allBlocks: n }) {
         ...c === f._id && !b ? { "data-drop": "yes" } : {},
         ...includes(l, f._id) ? { "data-cut-block": "yes" } : {}
       };
-      return A ? /* @__PURE__ */ jsxRuntimeExports.jsx(RSCBlock, { block: f, blockProps: _ }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { children: React__default.createElement(w, {
-        blockProps: _,
-        index: k,
+      return w ? /* @__PURE__ */ jsxRuntimeExports.jsx(RSCBlock, { block: f, blockProps: k }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { children: React__default.createElement(A, {
+        blockProps: k,
+        index: _,
         ...applyBindings(applyLanguage(f, r, B), g),
         ...omit(T, ["__isHidden"]),
         ...v,
@@ -3576,41 +3576,41 @@ const useAllDataProviders = () => useMemo(() => getChaiDataProviders(), []), Blo
     n(i);
   }, []), /* @__PURE__ */ jsxRuntimeExports.jsx("div", { id: "main-content", className: "h-full w-full p-8 pb-0", ref: a, children: o });
 }, getElementByStyleId = (o, n) => o.querySelector(`[data-style-id="${n}"]`), StaticCanvas = () => {
-  const [o] = useAtom$1(networkModeAtom), [n] = useCanvasWidth(), [, r] = useSelectedBlockIds(), a = useSelectedBlock(), [, l] = useHighlightBlockId(), i = useRef(null), c = useRef(null), [d, u] = useState({ width: 0, height: 0 }), p = useCanvasScale(d), [m, x] = useState([]), [, g] = useState([]), [, E] = useAtom$1(canvasIframeAtom), [j, f] = useSelectedStylingBlocks(), k = useBuilderProp("loading", !1), v = useBuilderProp("htmlDir", "ltr"), S = (w) => {
-    u((N) => ({ ...N, width: w }));
+  const [o] = useAtom$1(networkModeAtom), [n] = useCanvasWidth(), [, r] = useSelectedBlockIds(), a = useSelectedBlock(), [, l] = useHighlightBlockId(), i = useRef(null), c = useRef(null), [d, u] = useState({ width: 0, height: 0 }), p = useCanvasScale(d), [m, x] = useState([]), [, g] = useState([]), [, E] = useAtom$1(canvasIframeAtom), [j, f] = useSelectedStylingBlocks(), _ = useBuilderProp("loading", !1), v = useBuilderProp("htmlDir", "ltr"), S = (A) => {
+    u((N) => ({ ...N, width: A }));
   };
   useEffect(() => {
     if (!c.current)
       return;
-    const { clientWidth: w, clientHeight: N } = c.current;
-    u({ width: w, height: N });
+    const { clientWidth: A, clientHeight: N } = c.current;
+    u({ width: A, height: N });
   }, [c, n]);
-  const B = (w, N = 0) => {
-    const { top: D } = w.getBoundingClientRect();
+  const B = (A, N = 0) => {
+    const { top: D } = A.getBoundingClientRect();
     return D + N >= 0 && D - N <= window.innerHeight;
   };
   useEffect(() => {
-    var w, N;
+    var A, N;
     if (a && a.type !== "Multiple" && i.current) {
       const D = getElementByDataBlockId(i.current.contentDocument, a._id);
-      D && (B(D) || (N = (w = i.current) == null ? void 0 : w.contentWindow) == null || N.scrollTo({ top: D.offsetTop, behavior: "smooth" }), x([D]));
+      D && (B(D) || (N = (A = i.current) == null ? void 0 : A.contentWindow) == null || N.scrollTo({ top: D.offsetTop, behavior: "smooth" }), x([D]));
     }
   }, [a]), useEffect(() => {
     if (!isEmpty(j) && i.current) {
-      const w = getElementByStyleId(
+      const A = getElementByStyleId(
         i.current.contentDocument,
         first(j).id
       );
-      g(w ? [w] : [null]);
+      g(A ? [A] : [null]);
     } else
       g([null]);
   }, [j]);
-  const A = useMemo(() => {
-    let w = IframeInitialContent;
-    return w = w.replace("__HTML_DIR__", v), o === "offline" && (w = w.replace(
+  const w = useMemo(() => {
+    let A = IframeInitialContent;
+    return A = A.replace("__HTML_DIR__", v), o === "offline" && (A = A.replace(
       "https://old.chaibuilder.com/offline/tailwind.cdn.js",
       "/offline/tailwind.cdn.js"
-    ), w = w.replace("https://unpkg.com/aos@next/dist/aos.css", "/offline/aos.css"), w = w.replace("https://unpkg.com/aos@next/dist/aos.js", "/offline/aos.js")), w;
+    ), A = A.replace("https://unpkg.com/aos@next/dist/aos.css", "/offline/aos.css"), A = A.replace("https://unpkg.com/aos@next/dist/aos.js", "/offline/aos.js")), A;
   }, [o, v]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(ResizableCanvasWrapper, { onMount: S, onResize: S, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
     "div",
@@ -3629,7 +3629,7 @@ const useAllDataProviders = () => useMemo(() => getChaiDataProviders(), []), Blo
           id: "canvas-iframe",
           style: { ...p, ...isEmpty(p) ? { width: `${n}px` } : {} },
           className: "relative mx-auto box-content h-full w-full max-w-full shadow-lg transition-all duration-300 ease-linear",
-          initialContent: A,
+          initialContent: w,
           children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(KeyboardHandler, {}),
             /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -3641,7 +3641,7 @@ const useAllDataProviders = () => useMemo(() => getChaiDataProviders(), []), Blo
             ),
             /* @__PURE__ */ jsxRuntimeExports.jsx(HeadTags, {}),
             /* @__PURE__ */ jsxRuntimeExports.jsx(Provider, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Canvas, { children: [
-              k ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { className: "h-full" }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(StaticBlocksRenderer, {}),
+              _ ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { className: "h-full" }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(StaticBlocksRenderer, {}),
               /* @__PURE__ */ jsxRuntimeExports.jsx(AddBlockAtBottom, {}),
               /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
               /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
@@ -3752,7 +3752,7 @@ const useAllDataProviders = () => useMemo(() => getChaiDataProviders(), []), Blo
       l !== o.length - 1 && /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "rtl:rotate-180", size: 16 })
     ] }, l))
   ] }) });
-}, CodeEditor$1 = React__default.lazy(() => import("./CodeEditor-xKHFmP7r.js")), CanvasArea = () => {
+}, CodeEditor$1 = React__default.lazy(() => import("./CodeEditor-IHn5dpOk.js")), CanvasArea = () => {
   const [o] = useCodeEditor(), n = useBuilderProp("onError", noop);
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex h-full max-h-full w-full flex-1 flex-col", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative flex h-full max-h-full flex-col overflow-hidden bg-gray-100/40 px-2", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { className: "h-full" }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorBoundary, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(FallbackError, {}), onError: n, children: /* @__PURE__ */ jsxRuntimeExports.jsx(StaticCanvas$1, {}) }) }),
@@ -3827,8 +3827,8 @@ const useAllDataProviders = () => useMemo(() => getChaiDataProviders(), []), Blo
   showHeading: o = !0,
   className: n = ""
 }) => {
-  const [r, a] = useBrandingOptions(), [l] = useBlocksContainer(), i = React.useRef(r), { t: c } = useTranslation(), d = ({ formData: A }, w) => {
-    w && (a(A), i.current = A);
+  const [r, a] = useBrandingOptions(), [l] = useBlocksContainer(), i = React.useRef(r), { t: c } = useTranslation(), d = ({ formData: w }, A) => {
+    A && (a(w), i.current = w);
   }, {
     bodyFont: u,
     headingFont: p,
@@ -3838,7 +3838,7 @@ const useAllDataProviders = () => useMemo(() => getChaiDataProviders(), []), Blo
     bodyBgDarkColor: E,
     secondaryColor: j,
     bodyBgLightColor: f,
-    roundedCorners: k
+    roundedCorners: _
   } = r;
   let v = {
     headingFont: y({
@@ -3853,7 +3853,7 @@ const useAllDataProviders = () => useMemo(() => getChaiDataProviders(), []), Blo
     }),
     roundedCorners: s$1({
       title: c("theme_config.rounded_corner"),
-      default: parseInt(k || 5, 10)
+      default: parseInt(_ || 5, 10)
     }),
     primaryColor: h({ title: c("theme_config.primary"), default: m }),
     secondaryColor: h({ title: c("theme_config.secondary"), default: j })
@@ -3881,9 +3881,9 @@ const useAllDataProviders = () => useMemo(() => getChaiDataProviders(), []), Blo
     type: "object",
     properties: {}
   }, B = {};
-  return Object.keys(v).forEach((A) => {
-    const w = v[A];
-    return S.properties || (S.properties = {}), S.properties[A] = w.schema, B[A] = w.uiSchema, !0;
+  return Object.keys(v).forEach((w) => {
+    const A = v[w];
+    return S.properties || (S.properties = {}), S.properties[w] = A.schema, B[w] = A.uiSchema, !0;
   }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("flex h-full w-full select-none flex-col", n), children: [
     o ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md bg-background/30 p-1", children: /* @__PURE__ */ jsxRuntimeExports.jsx("h1", { className: "px-1 font-semibold", children: c("Theme Configuration") }) }) : null,
     /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -4079,13 +4079,13 @@ function BiExpandVertical(o) {
 const Node = memo(({ node: o, style: n, dragHandle: r }) => {
   const a = useBuilderProp("outlineMenuItems", []), { t: l } = useTranslation(), [i, , c] = useHiddenBlockIds(), [, d] = useHighlightBlockId(), [u] = useAtom$1(canvasIframeAtom);
   let p = null;
-  const m = o.children.length > 0, { id: x, data: g, isSelected: E, willReceiveDrop: j, isDragging: f, isEditing: k, handleClick: v } = o, S = (T) => {
+  const m = o.children.length > 0, { id: x, data: g, isSelected: E, willReceiveDrop: j, isDragging: f, isEditing: _, handleClick: v } = o, S = (T) => {
     T.stopPropagation(), !i.includes(x) && o.toggle();
   }, B = (T) => {
     T.isInternal && (p = T.isOpen, T.isOpen && T.close());
-  }, A = (T) => {
-    T.isInternal && p !== null && (p ? T.open() : T.close(), p = null);
   }, w = (T) => {
+    T.isInternal && p !== null && (p ? T.open() : T.close(), p = null);
+  }, A = (T) => {
     T.stopPropagation(), !o.isOpen && !i.includes(x) && o.toggle(), v(T);
   };
   useEffect(() => {
@@ -4096,17 +4096,17 @@ const Node = memo(({ node: o, style: n, dragHandle: r }) => {
   }, [j, o, f]);
   const N = useMemo(() => {
     const T = Object.keys(g), b = [];
-    for (let _ = 0; _ < T.length; _++)
-      if (T[_].endsWith("_attrs")) {
-        const C = g[T[_]], R = Object.keys(C).join("|");
+    for (let k = 0; k < T.length; k++)
+      if (T[k].endsWith("_attrs")) {
+        const C = g[T[k]], R = Object.keys(C).join("|");
         R.match(/x-data/) && b.push("data"), R.match(/x-on/) && b.push("event"), R.match(/x-show|x-if/) && b.push("show");
       }
     return b;
   }, [g]), D = (T, b) => {
-    const _ = u.contentDocument || u.contentWindow.document, C = _.querySelector(`[data-block-id=${T}]`);
+    const k = u.contentDocument || u.contentWindow.document, C = k.querySelector(`[data-block-id=${T}]`);
     C && C.setAttribute("data-drop", b);
     const R = C.getBoundingClientRect(), I = u.getBoundingClientRect();
-    R.top >= I.top && R.left >= I.left && R.bottom <= I.bottom && R.right <= I.right || (_.documentElement.scrollTop = C.offsetTop - I.top);
+    R.top >= I.top && R.left >= I.left && R.bottom <= I.bottom && R.right <= I.right || (k.documentElement.scrollTop = C.offsetTop - I.top);
   };
   return x === ROOT_TEMP_KEY ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
     "button",
@@ -4122,12 +4122,12 @@ const Node = memo(({ node: o, style: n, dragHandle: r }) => {
     "div",
     {
       onMouseEnter: () => d(x),
-      onClick: w,
+      onClick: A,
       style: n,
       "data-node-id": x,
       ref: i.includes(x) ? null : r,
       onDragStart: () => B(o),
-      onDragEnd: () => A(o),
+      onDragEnd: () => w(o),
       onDragOver: (T) => {
         T.preventDefault(), D(x, "yes");
       },
@@ -4155,7 +4155,7 @@ const Node = memo(({ node: o, style: n, dragHandle: r }) => {
           ),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "-mt-0.5 h-3 w-3", children: /* @__PURE__ */ jsxRuntimeExports.jsx(TypeIcon, { type: g == null ? void 0 : g._type }) }),
-            k ? /* @__PURE__ */ jsxRuntimeExports.jsx(Input, { node: o }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            _ ? /* @__PURE__ */ jsxRuntimeExports.jsx(Input, { node: o }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(
               "div",
               {
                 className: "ml-2 flex items-center gap-x-1 truncate text-[11px]",
@@ -4624,8 +4624,8 @@ function ExpandableObject(o) {
   useEffect(() => {
     x.current ? j(p(d, r, n)) : x.current = !0;
   }, [p]);
-  const f = g ? u.collapseIcon : u.expandIcon, k = g ? "collapse JSON" : "expand JSON", v = useComponentId(), S = d + 1, B = a.length - 1, A = (w) => {
-    w.key === " " && (w.preventDefault(), E());
+  const f = g ? u.collapseIcon : u.expandIcon, _ = g ? "collapse JSON" : "expand JSON", v = useComponentId(), S = d + 1, B = a.length - 1, w = (A) => {
+    A.key === " " && (A.preventDefault(), E());
   };
   return /* @__PURE__ */ createElement("div", {
     className: u.basicChildStyle,
@@ -4633,16 +4633,16 @@ function ExpandableObject(o) {
   }, /* @__PURE__ */ createElement("span", {
     className: f,
     onClick: E,
-    onKeyDown: A,
+    onKeyDown: w,
     role: "button",
     tabIndex: 0,
-    "aria-label": k,
+    "aria-label": _,
     "aria-expanded": g,
     "aria-controls": g ? v : void 0
   }), n && (m ? /* @__PURE__ */ createElement("span", {
     className: u.clickableLabel,
     onClick: E,
-    onKeyDown: A,
+    onKeyDown: w,
     role: "button",
     tabIndex: -1
   }, n, ":") : /* @__PURE__ */ createElement("span", {
@@ -4651,10 +4651,10 @@ function ExpandableObject(o) {
     className: u.punctuation
   }, i), g ? /* @__PURE__ */ createElement("div", {
     id: v
-  }, a.map((w, N) => /* @__PURE__ */ createElement(DataRender, {
-    key: w[0] || N,
-    field: w[0],
-    value: w[1],
+  }, a.map((A, N) => /* @__PURE__ */ createElement(DataRender, {
+    key: A[0] || N,
+    field: A[0],
+    value: A[1],
     style: u,
     lastElement: N === B,
     level: S,
@@ -4663,11 +4663,11 @@ function ExpandableObject(o) {
   }))) : /* @__PURE__ */ createElement("span", {
     className: u.collapsedContent,
     onClick: E,
-    onKeyDown: A,
+    onKeyDown: w,
     role: "button",
     tabIndex: -1,
     "aria-hidden": !0,
-    "aria-label": k,
+    "aria-label": _,
     "aria-expanded": g
   }), /* @__PURE__ */ createElement("span", {
     className: u.punctuation
@@ -4858,7 +4858,7 @@ const ViewData = ({ data: o, fullView: n }) => {
                 value: j,
                 className: `cursor-pointer ${m ? "flex items-center justify-between" : "flex flex-col items-start justify-start"}`,
                 onSelect: (f) => {
-                  r(find(E, (k) => k === f) || null), g(!1);
+                  r(find(E, (_) => _ === f) || null), g(!1);
                 },
                 children: [
                   /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-x-2", children: [
@@ -4890,8 +4890,8 @@ const ViewData = ({ data: o, fullView: n }) => {
         const f = get(j === "PROP" ? u : p, E, "");
         if (isArray$1(f))
           return "list";
-        const k = typeof f;
-        return k === "string" ? "text" : k === "object" ? "model" : k;
+        const _ = typeof f;
+        return _ === "string" ? "text" : _ === "object" ? "model" : _;
       }
     },
     [u, p]
@@ -5137,7 +5137,7 @@ const ViewData = ({ data: o, fullView: n }) => {
       }
     )
   ] });
-}, UnsplashImages = React__default.lazy(() => import("./UnsplashImages-C9snpLoA.js")), UploadImages = React__default.lazy(() => import("./UploadImages-yrFhyBgy.js")), ImagesPanel = ({
+}, UnsplashImages = React__default.lazy(() => import("./UnsplashImages-cgDgay1j.js")), UploadImages = React__default.lazy(() => import("./UploadImages-mC_nhMam.js")), ImagesPanel = ({
   isModalView: o = !1,
   onSelect: n = () => {
   }
@@ -5301,8 +5301,8 @@ const ImagePickerModal$1 = ImagePickerModal, ImagePickerField = ({ value: o, onC
     const f = n[j];
     if (includes(["slot", "styles"], f.type))
       return;
-    const k = j;
-    c.properties[k] = getBlockJSONFromSchemas(f, u, g), d[k] = getBlockJSONFromUISchemas(f);
+    const _ = j;
+    c.properties[_] = getBlockJSONFromSchemas(f, u, g), d[_] = getBlockJSONFromUISchemas(f);
   }), useEffect(() => {
     i(r);
   }, [o, p]);
@@ -5404,29 +5404,29 @@ const ImagePickerModal$1 = ImagePickerModal, ImagePickerField = ({ value: o, onC
   }), a;
 };
 function BlockSettings() {
-  const { selectedLang: o } = useLanguages(), n = useSelectedBlock(), r = useUpdateBlocksPropsRealtime(), a = useUpdateBlocksProps(), l = getBlockComponent(n == null ? void 0 : n._type), i = formDataWithSelectedLang(n, o, l), [c, d] = useState(i), u = useBuilderProp("dataBindingSupport", !1), p = ({ formData: f }, k, v) => {
-    if (k && (c == null ? void 0 : c._id) === n._id) {
-      const S = k.replace("root.", "");
+  const { selectedLang: o } = useLanguages(), n = useSelectedBlock(), r = useUpdateBlocksPropsRealtime(), a = useUpdateBlocksProps(), l = getBlockComponent(n == null ? void 0 : n._type), i = formDataWithSelectedLang(n, o, l), [c, d] = useState(i), u = useBuilderProp("dataBindingSupport", !1), p = ({ formData: f }, _, v) => {
+    if (_ && (c == null ? void 0 : c._id) === n._id) {
+      const S = _.replace("root.", "");
       a([n._id], { [S]: get(f, S) }, v);
     }
   }, m = useCallback(
-    debounce(({ formData: f }, k, v) => {
-      p({ formData: f }, k, v), d(f);
+    debounce(({ formData: f }, _, v) => {
+      p({ formData: f }, _, v), d(f);
     }, 1500),
     [n == null ? void 0 : n._id, o]
-  ), x = ({ formData: f }, k) => {
-    if (k) {
-      const v = k.replace("root.", "");
+  ), x = ({ formData: f }, _) => {
+    if (_) {
+      const v = _.replace("root.", "");
       r(
         [n._id],
         convertDotNotationToObject(v, get(f, v.split(".")))
-      ), m({ formData: f }, k, { [v]: get(c, v) });
+      ), m({ formData: f }, _, { [v]: get(c, v) });
     }
   }, g = keys(get(i, "_bindings", {})), E = useMemo(() => {
     const f = cloneDeep(get(l, "props", {}));
-    return each(f, (k, v) => {
-      get(k, "hidden", !1) && delete f[v];
-    }), u && each(g, (k) => delete f[k]), f;
+    return each(f, (_, v) => {
+      get(_, "hidden", !1) && delete f[v];
+    }), u && each(g, (_) => delete f[_]), f;
   }, [l, g, u]), j = get(l, "server", !1);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "overflow-x-hidden px-px", children: [
     u ? /* @__PURE__ */ jsxRuntimeExports.jsxs(Accordion, { type: "multiple", defaultValue: ["STATIC", "BINDING"], className: "mt-4 h-full w-full", children: [
@@ -5515,14 +5515,14 @@ const askAiProcessingAtom = atom$1(!1), useAskAi = () => {
         if (l) {
           n(!0), a(null);
           try {
-            const f = x === "content" ? cloneDeep(getBlockWithChildren(g, d)) : [cloneDeep(d.find((B) => B._id === g))];
+            const f = x === "content" ? cloneDeep(getBlockWithChildren(g, d)) : [cloneDeep(d.find((w) => w._id === g))];
             set(f, "0._parent", null);
-            const k = await l(x, promptWithLanguage(E, m, x), f), { blocks: v, error: S } = k;
-            if (S) {
-              a(S);
+            const _ = u === p ? "" : u, v = await l(x, promptWithLanguage(E, m, x), f, _), { blocks: S, error: B } = v;
+            if (B) {
+              a(B);
               return;
             }
-            x === "styles" ? c(v) : i(v), j && j(k);
+            x === "styles" ? c(S) : i(S), j && j(v);
           } catch (f) {
             a(f);
           } finally {
@@ -5530,12 +5530,24 @@ const askAiProcessingAtom = atom$1(!1), useAskAi = () => {
           }
         }
       },
-      [l, n, d, c, i]
+      [
+        l,
+        n,
+        d,
+        u,
+        p,
+        m,
+        c,
+        i
+      ]
     ),
     loading: o,
     error: r
   };
 };
+function FaLanguage$1(o) {
+  return GenIcon({ tag: "svg", attr: { viewBox: "0 0 640 512" }, child: [{ tag: "path", attr: { d: "M152.1 236.2c-3.5-12.1-7.8-33.2-7.8-33.2h-.5s-4.3 21.1-7.8 33.2l-11.1 37.5H163zM616 96H336v320h280c13.3 0 24-10.7 24-24V120c0-13.3-10.7-24-24-24zm-24 120c0 6.6-5.4 12-12 12h-11.4c-6.9 23.6-21.7 47.4-42.7 69.9 8.4 6.4 17.1 12.5 26.1 18 5.5 3.4 7.3 10.5 4.1 16.2l-7.9 13.9c-3.4 5.9-10.9 7.8-16.7 4.3-12.6-7.8-24.5-16.1-35.4-24.9-10.9 8.7-22.7 17.1-35.4 24.9-5.8 3.5-13.3 1.6-16.7-4.3l-7.9-13.9c-3.2-5.6-1.4-12.8 4.2-16.2 9.3-5.7 18-11.7 26.1-18-7.9-8.4-14.9-17-21-25.7-4-5.7-2.2-13.6 3.7-17.1l6.5-3.9 7.3-4.3c5.4-3.2 12.4-1.7 16 3.4 5 7 10.8 14 17.4 20.9 13.5-14.2 23.8-28.9 30-43.2H412c-6.6 0-12-5.4-12-12v-16c0-6.6 5.4-12 12-12h64v-16c0-6.6 5.4-12 12-12h16c6.6 0 12 5.4 12 12v16h64c6.6 0 12 5.4 12 12zM0 120v272c0 13.3 10.7 24 24 24h280V96H24c-13.3 0-24 10.7-24 24zm58.9 216.1L116.4 167c1.7-4.9 6.2-8.1 11.4-8.1h32.5c5.1 0 9.7 3.3 11.4 8.1l57.5 169.1c2.6 7.8-3.1 15.9-11.4 15.9h-22.9a12 12 0 0 1-11.5-8.6l-9.4-31.9h-60.2l-9.1 31.8c-1.5 5.1-6.2 8.7-11.5 8.7H70.3c-8.2 0-14-8.1-11.4-15.9z" }, child: [] }] })(o);
+}
 function FaMoon(o) {
   return GenIcon({ tag: "svg", attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M283.211 512c78.962 0 151.079-35.925 198.857-94.792 7.068-8.708-.639-21.43-11.562-19.35-124.203 23.654-238.262-71.576-238.262-196.954 0-72.222 38.662-138.635 101.498-174.394 9.686-5.512 7.25-20.197-3.756-22.23A258.156 258.156 0 0 0 283.211 0c-141.309 0-256 114.511-256 256 0 141.309 114.511 256 256 256z" }, child: [] }] })(o);
 }
@@ -5665,23 +5677,23 @@ const AskAIStyles = ({ blockId: o }) => {
   keys: ["name"]
 });
 function ManualClasses() {
-  var w;
-  const { t: o } = useTranslation(), [n] = useSelectedStylingBlocks(), r = useSelectedBlock(), a = useAddClassesToBlocks(), l = useRemoveClassesFromBlocks(), [i] = useSelectedBlockIds(), c = useBuilderProp("askAiCallBack", null), [d, u] = useState(""), { toast: p } = useToast(), m = (w = first(n)) == null ? void 0 : w.prop, x = reject((get(r, m, "").replace(STYLES_KEY, "").split(",").pop() || "").split(" "), isEmpty), g = () => {
+  var A;
+  const { t: o } = useTranslation(), [n] = useSelectedStylingBlocks(), r = useSelectedBlock(), a = useAddClassesToBlocks(), l = useRemoveClassesFromBlocks(), [i] = useSelectedBlockIds(), c = useBuilderProp("askAiCallBack", null), [d, u] = useState(""), { toast: p } = useToast(), m = (A = first(n)) == null ? void 0 : A.prop, x = reject((get(r, m, "").replace(STYLES_KEY, "").split(",").pop() || "").split(" "), isEmpty), g = () => {
     const N = d.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
     a(i, N, !0), u("");
   }, [E, j] = useState([]), f = ({ value: N }) => {
     const D = N.trim().toLowerCase(), T = D.match(/.+:/g);
     let b = [];
     if (T && T.length > 0) {
-      const [_] = T, C = D.replace(_, "");
+      const [k] = T, C = D.replace(k, "");
       b = fuse.search(C).map((I) => ({
         ...I,
-        item: { ...I.item, name: _ + I.item.name }
+        item: { ...I.item, name: k + I.item.name }
       }));
     } else
       b = fuse.search(D);
     return j(map(b, "item"));
-  }, k = () => {
+  }, _ = () => {
     j([]);
   }, v = (N) => N.name, S = (N) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md p-1", children: N.name }), B = {
     autoComplete: "off",
@@ -5695,7 +5707,7 @@ function ManualClasses() {
     },
     onChange: (N, { newValue: D }) => u(D),
     className: "w-full rounded-md text-xs px-2 hover:outline-0 bg-background border-border py-1"
-  }, A = () => {
+  }, w = () => {
     if (navigator.clipboard === void 0) {
       p({
         title: o("clipboard_not_supported"),
@@ -5718,7 +5730,7 @@ function ManualClasses() {
           /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-x-2 text-muted-foreground", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: o("classes") }),
             /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(CopyIcon, { onClick: A, className: "cursor-pointer" }) }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(CopyIcon, { onClick: w, className: "cursor-pointer" }) }),
               /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: o("copy_classes_to_clipboard") }) })
             ] })
           ] }),
@@ -5736,7 +5748,7 @@ function ManualClasses() {
             {
               suggestions: E,
               onSuggestionsFetchRequested: f,
-              onSuggestionsClearRequested: k,
+              onSuggestionsClearRequested: _,
               getSuggestionValue: v,
               renderSuggestion: S,
               inputProps: B,
@@ -6428,50 +6440,50 @@ const RangeChoices = ({ property: o, onChange: n }) => {
   },
   a
 )) }), THROTTLE_TIME = 50, AdvanceChoices = (o) => {
-  const [n, r] = useState(!1), [a, l] = useState(""), { currentClass: i, onChange: c, classPrefix: d, cssProperty: u, units: p, negative: m } = o, [x, g] = useState(u != null && u.toLowerCase().includes("width") ? "%" : p[0]), [E, j] = useState(!1), [f, k] = useState(""), [v, S] = useState(!1), [B, A] = useState(!1);
+  const [n, r] = useState(!1), [a, l] = useState(""), { currentClass: i, onChange: c, classPrefix: d, cssProperty: u, units: p, negative: m } = o, [x, g] = useState(u != null && u.toLowerCase().includes("width") ? "%" : p[0]), [E, j] = useState(!1), [f, _] = useState(""), [v, S] = useState(!1), [B, w] = useState(!1);
   useEffect(() => {
-    const { value: b, unit: _ } = getClassValueAndUnit(i);
-    if (_ === "") {
+    const { value: b, unit: k } = getClassValueAndUnit(i);
+    if (k === "") {
       l(b), g(u != null && u.toLowerCase().includes("width") ? "%" : first(p));
       return;
     }
-    g(_), l(_ === "class" || isEmpty(b) ? "" : b);
+    g(k), l(k === "class" || isEmpty(b) ? "" : b);
   }, [i, u, p]);
-  const w = useThrottledCallback((b) => c(b), [c], THROTTLE_TIME), N = useThrottledCallback((b) => c(b, !1), [c], THROTTLE_TIME), D = useCallback(
+  const A = useThrottledCallback((b) => c(b), [c], THROTTLE_TIME), N = useThrottledCallback((b) => c(b, !1), [c], THROTTLE_TIME), D = useCallback(
     (b = !1) => {
-      const _ = getUserInputValues(`${a}`, p);
-      if (get(_, "error", !1)) {
+      const k = getUserInputValues(`${a}`, p);
+      if (get(k, "error", !1)) {
         j(!0);
         return;
       }
-      const C = get(_, "unit") !== "" ? get(_, "unit") : x;
+      const C = get(k, "unit") !== "" ? get(k, "unit") : x;
       if (C === "auto" || C === "none") {
-        w(`${d}${C}`);
+        A(`${d}${C}`);
         return;
       }
-      if (get(_, "value") === "")
+      if (get(k, "value") === "")
         return;
-      const I = `${get(_, "value", "").startsWith("-") ? "-" : ""}${d}[${get(_, "value", "").replace("-", "")}${C === "-" ? "" : C}]`;
-      b ? N(I) : w(I);
+      const I = `${get(k, "value", "").startsWith("-") ? "-" : ""}${d}[${get(k, "value", "").replace("-", "")}${C === "-" ? "" : C}]`;
+      b ? N(I) : A(I);
     },
-    [w, N, a, x, d, p]
+    [A, N, a, x, d, p]
   ), T = useCallback(
     (b) => {
-      const _ = getUserInputValues(`${a}`, p);
-      if (get(_, "error", !1)) {
+      const k = getUserInputValues(`${a}`, p);
+      if (get(k, "error", !1)) {
         j(!0);
         return;
       }
       if (b === "auto" || b === "none") {
-        w(`${d}${b}`);
+        A(`${d}${b}`);
         return;
       }
-      if (get(_, "value") === "")
+      if (get(k, "value") === "")
         return;
-      const C = get(_, "unit") !== "" ? get(_, "unit") : b, I = `${get(_, "value", "").startsWith("-") ? "-" : ""}${d}[${get(_, "value", "").replace("-", "")}${C === "-" ? "" : C}]`;
-      w(I);
+      const C = get(k, "unit") !== "" ? get(k, "unit") : b, I = `${get(k, "value", "").startsWith("-") ? "-" : ""}${d}[${get(k, "value", "").replace("-", "")}${C === "-" ? "" : C}]`;
+      A(I);
     },
-    [w, a, d, p]
+    [A, a, d, p]
   );
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex w-full flex-col", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-start", children: x === "class" ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("input", { className: "w-20 rounded py-1", readOnly: !0, value: i }),
@@ -6491,23 +6503,23 @@ const RangeChoices = ({ property: o, onChange: n }) => {
           onKeyDown: (b) => {
             if (b.keyCode !== 38 && b.keyCode !== 40)
               return;
-            b.preventDefault(), A(!0);
-            const _ = parseInt$1(b.target.value);
-            let C = isNaN$1(_) ? 0 : _;
+            b.preventDefault(), w(!0);
+            const k = parseInt$1(b.target.value);
+            let C = isNaN$1(k) ? 0 : k;
             b.keyCode === 38 && (C += 1), b.keyCode === 40 && (C -= 1);
             const R = `${C}`, L = `${R.startsWith("-") ? "-" : ""}${d}[${R.replace("-", "")}${x === "-" ? "" : x}]`;
             N(L);
           },
           onKeyUp: (b) => {
-            B && (b.preventDefault(), A(!1));
+            B && (b.preventDefault(), w(!1));
           },
           onBlur: () => D(),
           onChange: (b) => {
             j(!1), l(b.target.value);
           },
           onClick: (b) => {
-            var _;
-            (_ = b == null ? void 0 : b.target) == null || _.select(), r(!1);
+            var k;
+            (k = b == null ? void 0 : b.target) == null || k.select(), r(!1);
           },
           value: v ? f : a,
           className: "h-6 w-14 rounded rounded-r-none border border-transparent bg-background pl-2 text-sm focus-visible:outline-0".concat(
@@ -6546,16 +6558,16 @@ const RangeChoices = ({ property: o, onChange: n }) => {
       {
         onDragStart: () => S(!0),
         onDragEnd: (b) => {
-          if (k(() => ""), S(!1), isEmpty(b))
+          if (_(() => ""), S(!1), isEmpty(b))
             return;
-          const _ = `${b}`, R = `${_.startsWith("-") ? "-" : ""}${d}[${_.replace("-", "")}${x === "-" ? "" : x}]`;
-          w(R);
+          const k = `${b}`, R = `${k.startsWith("-") ? "-" : ""}${d}[${k.replace("-", "")}${x === "-" ? "" : x}]`;
+          A(R);
         },
         onDrag: (b) => {
           if (isEmpty(b))
             return;
-          k(b);
-          const _ = `${b}`, R = `${_.startsWith("-") ? "-" : ""}${d}[${_.replace("-", "")}${x === "-" ? "" : x}]`;
+          _(b);
+          const k = `${b}`, R = `${k.startsWith("-") ? "-" : ""}${d}[${k.replace("-", "")}${x === "-" ? "" : x}]`;
           N(R);
         },
         currentValue: a,
@@ -6653,7 +6665,7 @@ const RangeChoices = ({ property: o, onChange: n }) => {
   "2xl": "1536px"
 }, getBreakpoint = (o) => `${o.toUpperCase()} ${BREAKPOINTS[o] ? `(${BREAKPOINTS[o]} & up)` : ""}`, BlockStyle = (o) => {
   const { t: n } = useTranslation(), { type: r = "icons", label: a, property: l, onEmitChange: i = () => {
-  }, units: c, negative: d = !1 } = o, [u] = useDarkMode(), [p] = useStylingState(), [, m] = useCanvasWidth(), x = useCurrentClassByProperty(l), g = useAddClassesToBlocks(), E = useRemoveClassesFromBlocks(), [j] = useSelectedBlockIds(), f = useMemo(() => get(x, "fullCls", ""), [x]), k = useCallback(
+  }, units: c, negative: d = !1 } = o, [u] = useDarkMode(), [p] = useStylingState(), [, m] = useCanvasWidth(), x = useCurrentClassByProperty(l), g = useAddClassesToBlocks(), E = useRemoveClassesFromBlocks(), [j] = useSelectedBlockIds(), f = useMemo(() => get(x, "fullCls", ""), [x]), _ = useCallback(
     (N, D = !0) => {
       const T = { dark: u, mq: m, mod: p, cls: N, property: l, fullCls: "" };
       (u || p !== "") && (T.mq = "xs");
@@ -6667,7 +6679,7 @@ const RangeChoices = ({ property: o, onChange: n }) => {
   useEffect(() => {
     i(S, x);
   }, [S, i, x]);
-  const [, , B] = useCanvasWidth(), A = useCallback(
+  const [, , B] = useCanvasWidth(), w = useCallback(
     (N) => {
       B({
         xs: 400,
@@ -6679,9 +6691,9 @@ const RangeChoices = ({ property: o, onChange: n }) => {
       }[N]);
     },
     [B]
-  ), w = get(x, "dark", null) === u && get(x, "mod", null) === p && get(x, "mq", null) === m;
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(BlockStyleProvider, { canChange: S, canReset: x && w, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "group flex flex-row items-center py-2 first:pt-0 last:pb-0", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative w-[70px] truncate text-xs text-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-[11px] ${x && !w ? "text-foreground" : ""}`, children: n(a) }) }),
+  ), A = get(x, "dark", null) === u && get(x, "mod", null) === p && get(x, "mq", null) === m;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(BlockStyleProvider, { canChange: S, canReset: x && A, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "group flex flex-row items-center py-2 first:pt-0 last:pb-0", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative w-[70px] truncate text-xs text-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-[11px] ${x && !A ? "text-foreground" : ""}`, children: n(a) }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-row items-center", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "w-[150px]", children: [
         r === "arbitrary" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -6690,17 +6702,17 @@ const RangeChoices = ({ property: o, onChange: n }) => {
             currentClass: get(x, "cls", ""),
             classPrefix: get(CLASS_PREFIXES, l, ""),
             units: c || [],
-            onChange: k,
+            onChange: _,
             negative: d,
             cssProperty: l
           }
         ) : null,
-        r === "icons" && /* @__PURE__ */ jsxRuntimeExports.jsx(IconChoices, { property: l, onChange: k }),
-        r === "range" && /* @__PURE__ */ jsxRuntimeExports.jsx(RangeChoices, { property: l, onChange: k }),
-        r === "color" && /* @__PURE__ */ jsxRuntimeExports.jsx(ColorChoice, { property: l, onChange: k }),
-        r === "dropdown" && /* @__PURE__ */ jsxRuntimeExports.jsx(DropDownChoices, { label: a, property: l, onChange: k })
+        r === "icons" && /* @__PURE__ */ jsxRuntimeExports.jsx(IconChoices, { property: l, onChange: _ }),
+        r === "range" && /* @__PURE__ */ jsxRuntimeExports.jsx(RangeChoices, { property: l, onChange: _ }),
+        r === "color" && /* @__PURE__ */ jsxRuntimeExports.jsx(ColorChoice, { property: l, onChange: _ }),
+        r === "dropdown" && /* @__PURE__ */ jsxRuntimeExports.jsx(DropDownChoices, { label: a, property: l, onChange: _ })
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-[30px] cursor-pointer ${f ? "visible" : "invisible"}`, children: w ? /* @__PURE__ */ jsxRuntimeExports.jsx("button", { type: "button", onClick: () => v(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ jsxRuntimeExports.jsx(CrossCircledIcon, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : S && x ? /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { delayDuration: 100, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-[30px] cursor-pointer ${f ? "visible" : "invisible"}`, children: A ? /* @__PURE__ */ jsxRuntimeExports.jsx("button", { type: "button", onClick: () => v(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ jsxRuntimeExports.jsx(CrossCircledIcon, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : S && x ? /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { delayDuration: 100, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
           "button",
           {
@@ -6720,7 +6732,7 @@ const RangeChoices = ({ property: o, onChange: n }) => {
             "button",
             {
               type: "button",
-              onClick: () => A(get(x, "mq")),
+              onClick: () => w(get(x, "mq")),
               className: "block w-full cursor-default text-right font-semibold text-blue-500",
               children: [
                 "Switch to ",
@@ -6977,12 +6989,12 @@ const BlockCard = ({
   library: n,
   parentId: r = void 0
 }) => {
-  const [a, l] = useState(!1), i = useBuilderProp("getUILibraryBlock", noop), { addCoreBlock: c, addPredefinedBlock: d } = useAddBlock(), [, u] = useSelectedBlockIds(), [, p] = useHighlightBlockId(), m = get(o, "name", get(o, "label")), x = useFeature("dnd"), [, g] = useAtom$1(draggedBlockAtom), E = (k) => {
-    const v = has(k, "styles_attrs.data-page-section");
-    return k._type === "Box" && v;
+  const [a, l] = useState(!1), i = useBuilderProp("getUILibraryBlock", noop), { addCoreBlock: c, addPredefinedBlock: d } = useAddBlock(), [, u] = useSelectedBlockIds(), [, p] = useHighlightBlockId(), m = get(o, "name", get(o, "label")), x = useFeature("dnd"), [, g] = useAtom$1(draggedBlockAtom), E = (_) => {
+    const v = has(_, "styles_attrs.data-page-section");
+    return _._type === "Box" && v;
   }, j = useCallback(
-    async (k) => {
-      if (k.stopPropagation(), has(o, "component")) {
+    async (_) => {
+      if (_.stopPropagation(), has(o, "component")) {
         c(o, r), emitChaiBuilderMsg({ name: CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK });
         return;
       }
@@ -6991,18 +7003,18 @@ const BlockCard = ({
       isEmpty(v) || d(syncBlocksWithDefaults(v), r), emitChaiBuilderMsg({ name: CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK });
     },
     [o]
-  ), f = async (k) => {
+  ), f = async (_) => {
     const v = await i(n, o);
     let S = r;
     if (E(first(v)) && (S = null), !isEmpty(v)) {
       const B = { blocks: v, uiLibrary: !0, parent: S };
-      if (k.dataTransfer.setData("text/plain", JSON.stringify(B)), o.preview) {
-        const A = new Image();
-        A.src = o.preview, A.onload = () => {
-          k.dataTransfer.setDragImage(A, 0, 0);
+      if (_.dataTransfer.setData("text/plain", JSON.stringify(B)), o.preview) {
+        const w = new Image();
+        w.src = o.preview, w.onload = () => {
+          _.dataTransfer.setDragImage(w, 0, 0);
         };
       } else
-        k.dataTransfer.setDragImage(new Image(), 0, 0);
+        _.dataTransfer.setDragImage(new Image(), 0, 0);
       g(B), setTimeout(() => {
         u([]), p(null), emitChaiBuilderMsg({ name: CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK });
       }, 200);
@@ -7054,7 +7066,7 @@ const BlockCard = ({
       /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { className: "col-span-3 h-full" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { className: "col-span-9 h-full" })
     ] });
-  const k = filter(g, (S, B) => B % 2 === 0), v = filter(g, (S, B) => B % 2 === 1);
+  const _ = filter(g, (S, B) => B % 2 === 0), v = filter(g, (S, B) => B % 2 === 1);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative mt-2 flex h-full max-h-full overflow-hidden bg-background", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full pt-2", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full max-h-full w-60 flex-col gap-1 px-1 pr-2", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(UILibrariesSelect, { library: c == null ? void 0 : c.uuid, setLibrary: r, uiLibraries: a }),
@@ -7090,7 +7102,7 @@ const BlockCard = ({
         children: [
           /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-2 gap-2 px-2", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-1", children: React__default.Children.toArray(
-              k.map((S) => /* @__PURE__ */ jsxRuntimeExports.jsx(BlockCard, { parentId: o, block: S, library: c }))
+              _.map((S) => /* @__PURE__ */ jsxRuntimeExports.jsx(BlockCard, { parentId: o, block: S, library: c }))
             ) }),
             /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-1", children: React__default.Children.toArray(
               v.map((S) => /* @__PURE__ */ jsxRuntimeExports.jsx(BlockCard, { parentId: o, block: S, library: c }))
@@ -7647,7 +7659,201 @@ function FaCheck(o) {
 function FaFilePen(o) {
   return GenIcon({ tag: "svg", attr: { viewBox: "0 0 576 512" }, child: [{ tag: "path", attr: { d: "M0 64C0 28.7 28.7 0 64 0H224V128c0 17.7 14.3 32 32 32H384V299.6l-94.7 94.7c-8.2 8.2-14 18.5-16.8 29.7l-15 60.1c-2.3 9.4-1.8 19 1.4 27.8H64c-35.3 0-64-28.7-64-64V64zm384 64H256V0L384 128zM549.8 235.7l14.4 14.4c15.6 15.6 15.6 40.9 0 56.6l-29.4 29.4-71-71 29.4-29.4c15.6-15.6 40.9-15.6 56.6 0zM311.9 417L441.1 287.8l71 71L382.9 487.9c-4.1 4.1-9.2 7-14.9 8.4l-60.1 15c-5.5 1.4-11.2-.2-15.2-4.2s-5.6-9.7-4.2-15.2l15-60.1c1.4-5.6 4.3-10.8 8.4-14.9z" }, child: [] }] })(o);
 }
-const QUICK_PROMPTS = [
+function FaLanguage(o) {
+  return GenIcon({ tag: "svg", attr: { viewBox: "0 0 640 512" }, child: [{ tag: "path", attr: { d: "M0 128C0 92.7 28.7 64 64 64H256h48 16H576c35.3 0 64 28.7 64 64V384c0 35.3-28.7 64-64 64H320 304 256 64c-35.3 0-64-28.7-64-64V128zm320 0V384H576V128H320zM178.3 175.9c-3.2-7.2-10.4-11.9-18.3-11.9s-15.1 4.7-18.3 11.9l-64 144c-4.5 10.1 .1 21.9 10.2 26.4s21.9-.1 26.4-10.2l8.9-20.1h73.6l8.9 20.1c4.5 10.1 16.3 14.6 26.4 10.2s14.6-16.3 10.2-26.4l-64-144zM160 233.2L179 276H141l19-42.8zM448 164c11 0 20 9 20 20v4h44 16c11 0 20 9 20 20s-9 20-20 20h-2l-1.6 4.5c-8.9 24.4-22.4 46.6-39.6 65.4c.9 .6 1.8 1.1 2.7 1.6l18.9 11.3c9.5 5.7 12.5 18 6.9 27.4s-18 12.5-27.4 6.9l-18.9-11.3c-4.5-2.7-8.8-5.5-13.1-8.5c-10.6 7.5-21.9 14-34 19.4l-3.6 1.6c-10.1 4.5-21.9-.1-26.4-10.2s.1-21.9 10.2-26.4l3.6-1.6c6.4-2.9 12.6-6.1 18.5-9.8l-12.2-12.2c-7.8-7.8-7.8-20.5 0-28.3s20.5-7.8 28.3 0l14.6 14.6 .5 .5c12.4-13.1 22.5-28.3 29.8-45H448 376c-11 0-20-9-20-20s9-20 20-20h52v-4c0-11 9-20 20-20z" }, child: [] }] })(o);
+}
+function FaStar(o) {
+  return GenIcon({ tag: "svg", attr: { viewBox: "0 0 576 512" }, child: [{ tag: "path", attr: { d: "M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z" }, child: [] }] })(o);
+}
+const LANGUAGES = {
+  ab: "Abkhazian",
+  aa: "Afar",
+  af: "Afrikaans",
+  ak: "Akan",
+  sq: "Albanian",
+  am: "Amharic",
+  ar: "Arabic",
+  an: "Aragonese",
+  hy: "Armenian",
+  as: "Assamese",
+  av: "Avaric",
+  ae: "Avestan",
+  ay: "Aymara",
+  az: "Azerbaijani",
+  bm: "Bambara",
+  ba: "Bashkir",
+  eu: "Basque",
+  be: "Belarusian",
+  bn: "Bengali",
+  bh: "Bihari",
+  bi: "Bislama",
+  bs: "Bosnian",
+  br: "Breton",
+  bg: "Bulgarian",
+  my: "Burmese",
+  ca: "Catalan",
+  ch: "Chamorro",
+  ce: "Chechen",
+  ny: "Chichewa",
+  zh: "Chinese",
+  "zh-Hans": "Chinese (Simplified)",
+  "zh-Hant": "Chinese (Traditional)",
+  cv: "Chuvash",
+  kw: "Cornish",
+  co: "Corsican",
+  cr: "Cree",
+  hr: "Croatian",
+  cs: "Czech",
+  da: "Danish",
+  dv: "Maldivian",
+  nl: "Dutch",
+  dz: "Dzongkha",
+  en: "English",
+  eo: "Esperanto",
+  et: "Estonian",
+  ee: "Ewe",
+  fo: "Faroese",
+  fj: "Fijian",
+  fi: "Finnish",
+  fr: "French",
+  ff: "Fula, Pular",
+  gl: "Galician",
+  gd: "Gaelic (Scottish)",
+  gv: "Manx",
+  ka: "Georgian",
+  de: "German",
+  el: "Greek",
+  kl: "Kalaallisut",
+  gn: "Guarani",
+  gu: "Gujarati",
+  ht: "Haitian Creole",
+  ha: "Hausa",
+  he: "Hebrew",
+  hz: "Herero",
+  hi: "Hindi",
+  ho: "Hiri Motu",
+  hu: "Hungarian",
+  is: "Icelandic",
+  io: "Ido",
+  ig: "Igbo",
+  id: "Indonesian",
+  ia: "Interlingua",
+  ie: "Interlingue",
+  iu: "Inuktitut",
+  ik: "Inupiak",
+  ga: "Irish",
+  it: "Italian",
+  ja: "Japanese",
+  jv: "Javanese",
+  kn: "Kannada",
+  kr: "Kanuri",
+  ks: "Kashmiri",
+  kk: "Kazakh",
+  km: "Khmer",
+  ki: "Kikuyu",
+  rw: "Kinyarwanda",
+  rn: "Kirundi",
+  ky: "Kyrgyz",
+  kv: "Komi",
+  kg: "Kongo",
+  ko: "Korean",
+  ku: "Kurdish",
+  kj: "Kwanyama",
+  lo: "Lao",
+  la: "Latin",
+  lv: "Latvian",
+  li: "Limburgish",
+  ln: "Lingala",
+  lt: "Lithuanian",
+  lu: "Luga-Katanga",
+  lg: "Luganda, Ganda",
+  lb: "Luxembourgish",
+  mk: "Macedonian",
+  mg: "Malagasy",
+  ms: "Malay",
+  ml: "Malayalam",
+  mt: "Maltese",
+  mi: "Maori",
+  mr: "Marathi",
+  mh: "Marshallese",
+  mo: "Moldavian",
+  mn: "Mongolian",
+  na: "Nauru",
+  nv: "Navajo",
+  ng: "Ndonga",
+  nd: "Northern Ndebele",
+  ne: "Nepali",
+  no: "Norwegian",
+  nb: "Norwegian bokmål",
+  nn: "Norwegian nynorsk",
+  ii: "Sichuan Yi",
+  oc: "Occitan",
+  oj: "Ojibwe",
+  cu: "Old Church Slavonic",
+  or: "Oriya",
+  om: "Oromo",
+  os: "Ossetian",
+  pi: "Pāli",
+  ps: "Pashto, Pushto",
+  fa: "Persian (Farsi)",
+  pl: "Polish",
+  pt: "Portuguese",
+  pa: "Punjabi (Eastern)",
+  qu: "Quechua",
+  rm: "Romansh",
+  ro: "Romanian",
+  ru: "Russian",
+  se: "Sami",
+  sm: "Samoan",
+  sg: "Sango",
+  sa: "Sanskrit",
+  sr: "Serbian",
+  sh: "Serbo-Croatian",
+  st: "Sesotho",
+  tn: "Setswana",
+  sn: "Shona",
+  sd: "Sindhi",
+  si: "Sinhalese",
+  ss: "Swati",
+  sk: "Slovak",
+  sl: "Slovenian",
+  so: "Somali",
+  nr: "Southern Ndebele",
+  es: "Spanish",
+  su: "Sundanese",
+  sw: "Swahili (Kiswahili)",
+  sv: "Swedish",
+  tl: "Tagalog",
+  ty: "Tahitian",
+  tg: "Tajik",
+  ta: "Tamil",
+  tt: "Tatar",
+  te: "Telugu",
+  th: "Thai",
+  bo: "Tibetan",
+  ti: "Tigrinya",
+  to: "Tonga",
+  ts: "Tsonga",
+  tr: "Turkish",
+  tk: "Turkmen",
+  tw: "Twi",
+  ug: "Uyghur",
+  uk: "Ukrainian",
+  ur: "Urdu",
+  uz: "Uzbek",
+  ve: "Venda",
+  vi: "Vietnamese",
+  vo: "Volapük",
+  wa: "Wallon",
+  cy: "Welsh",
+  wo: "Wolof",
+  fy: "Western Frisian",
+  xh: "Xhosa",
+  yi: "Yiddish",
+  yo: "Yoruba",
+  za: "Zhuang, Chuang",
+  zu: "Zulu"
+}, QUICK_PROMPTS = [
   {
     name: "Improve writing",
     icon: FaFilePen,
@@ -7658,6 +7864,7 @@ const QUICK_PROMPTS = [
     icon: FaRecycle,
     prompt: "Discard current placeholder content and replace with meaningful relevant content."
   },
+  //TODO: Add tone options
   // {
   //   name: "Change tone",
   //   icon: MegaphoneIcon,
@@ -7669,12 +7876,6 @@ const QUICK_PROMPTS = [
     icon: CheckIcon,
     prompt: "Fix grammar in all text elements. Ensuring the text is grammatically correct and free of errors."
   },
-  // {
-  //   name: "Translate",
-  //   icon: GlobeIcon,
-  //   subMenus: ["English", "Spanish", "French", "German", "Italian", "Portuguese", "Chinese", "Japanese", "Korean"],
-  //   prompt: "Translate all text elements to a __LANG__ language.",
-  // },
   {
     name: "Make longer",
     icon: ArrowUpIcon,
@@ -7697,32 +7898,36 @@ const QUICK_PROMPTS = [
   }
 ];
 function QuickPrompts({ onClick: o }) {
-  const { loading: n } = useAskAi(), { t: r } = useTranslation();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: n ? "pointer-events-none opacity-50" : "", children: /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "space-y-2", children: QUICK_PROMPTS.map(
-    ({ name: a, icon: l, subMenus: i, prompt: c }) => i ? /* @__PURE__ */ jsxRuntimeExports.jsxs(Popover, { children: [
+  const { loading: n } = useAskAi(), { t: r } = useTranslation(), { selectedLang: a, fallbackLang: l } = useLanguages(), i = [...QUICK_PROMPTS];
+  return a && a !== l && i.splice(0, 0, {
+    name: `Translate to ${get(LANGUAGES, a, a)}`,
+    icon: FaLanguage$1,
+    prompt: `Translate the content to ${get(LANGUAGES, a, a)}. Maintain same tone, style and length.`
+  }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: n ? "pointer-events-none opacity-50" : "", children: /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "space-y-2", children: i.map(
+    ({ name: c, icon: d, subMenus: u, prompt: p }) => u ? /* @__PURE__ */ jsxRuntimeExports.jsxs(Popover, { children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(PopoverTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
         "li",
         {
           className: "flex cursor-pointer items-center space-x-2 rounded p-1 pl-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800",
           children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(l, { className: "h-4 w-4" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: a })
+            /* @__PURE__ */ jsxRuntimeExports.jsx(d, { className: "h-4 w-4" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: c })
           ]
         },
-        a
+        c
       ) }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(PopoverContent, { side: "right", children: /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("li", { children: "Happy" }) }) })
     ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "li",
       {
-        onClick: () => o(c),
+        onClick: () => o(p),
         className: "flex cursor-pointer items-center space-x-2 rounded p-1 text-sm hover:bg-gray-100 dark:hover:bg-gray-800",
         children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(l, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: r(a) })
+          /* @__PURE__ */ jsxRuntimeExports.jsx(d, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: r(c) })
         ]
       },
-      a
+      c
     )
   ) }) });
 }
@@ -7922,32 +8127,32 @@ const AIUserPrompt = ({ blockId: o }) => {
       return;
     }
     if (i) {
-      const A = [...a, { key: i, value: d }];
-      r(A), l(a), c(""), u(""), g("");
+      const w = [...a, { key: i, value: d }];
+      r(w), l(a), c(""), u(""), g("");
     }
-  }, k = (A) => {
-    const w = a.filter((N, D) => D !== A);
-    r(w), l(w);
-  }, v = (A) => {
-    m(A), c(a[A].key), u(a[A].value);
+  }, _ = (w) => {
+    const A = a.filter((N, D) => D !== w);
+    r(A), l(A);
+  }, v = (w) => {
+    m(w), c(a[w].key), u(a[w].value);
   }, S = () => {
     if (i.startsWith("@")) {
       g("Attribute keys cannot start with '@'");
       return;
     }
     if (p !== null && i) {
-      const A = [...a];
-      A[p] = { key: i, value: d }, r(A), l(A), m(null), c(""), u(""), g("");
+      const w = [...a];
+      w[p] = { key: i, value: d }, r(w), l(w), m(null), c(""), u(""), g("");
     }
-  }, B = (A) => {
-    A.key === "Enter" && !A.shiftKey && (A.preventDefault(), p !== null ? S() : f());
+  }, B = (w) => {
+    w.key === "Enter" && !w.shiftKey && (w.preventDefault(), p !== null ? S() : f());
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-full", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "form",
       {
-        onSubmit: (A) => {
-          A.preventDefault(), p !== null ? S() : f();
+        onSubmit: (w) => {
+          w.preventDefault(), p !== null ? S() : f();
         },
         className: "space-y-3",
         children: [
@@ -7963,7 +8168,7 @@ const AIUserPrompt = ({ blockId: o }) => {
                   id: "attrKey",
                   ref: E,
                   value: i,
-                  onChange: (A) => c(A.target.value),
+                  onChange: (w) => c(w.target.value),
                   placeholder: "Key",
                   className: "h-8 text-sm"
                 }
@@ -7981,7 +8186,7 @@ const AIUserPrompt = ({ blockId: o }) => {
                   rows: 2,
                   ref: j,
                   value: d,
-                  onChange: (A) => u(A.target.value),
+                  onChange: (w) => u(w.target.value),
                   onKeyDown: B,
                   placeholder: "Value",
                   className: "bg-background text-sm"
@@ -7994,22 +8199,22 @@ const AIUserPrompt = ({ blockId: o }) => {
         ]
       }
     ),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-4 space-y-1 overflow-y-auto", children: a.map((A, w) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between rounded bg-muted p-1.5 text-sm", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-4 space-y-1 overflow-y-auto", children: a.map((w, A) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between rounded bg-muted p-1.5 text-sm", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mr-2 flex flex-col", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate font-semibold", children: A.key }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-wrap max-w-[200px] text-muted-foreground", children: A.value.toString() })
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate font-semibold", children: w.key }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-wrap max-w-[200px] text-muted-foreground", children: w.value.toString() })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-shrink-0", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => v(w), children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => v(A), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(Edit2, { className: "h-3 w-3" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sr-only", children: "Edit attribute" })
         ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => k(w), children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => _(A), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "h-3 w-3" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sr-only", children: "Remove attribute" })
         ] })
       ] })
-    ] }, w)) })
+    ] }, A)) })
   ] });
 }), BlockAttributesEditor = React.memo(() => {
   const o = useSelectedBlock(), [n, r] = useState([]), [a] = useSelectedStylingBlocks(), l = useUpdateBlocksProps(), i = `${get(a, "0.prop")}_attrs`;
@@ -8194,221 +8399,42 @@ const TabletIcon = ({ landscape: o = !1 }) => /* @__PURE__ */ jsxRuntimeExports.
       ] })
     ] })
   ] }) });
-}, LANGUAGES = {
-  ab: "Abkhazian",
-  aa: "Afar",
-  af: "Afrikaans",
-  ak: "Akan",
-  sq: "Albanian",
-  am: "Amharic",
-  ar: "Arabic",
-  an: "Aragonese",
-  hy: "Armenian",
-  as: "Assamese",
-  av: "Avaric",
-  ae: "Avestan",
-  ay: "Aymara",
-  az: "Azerbaijani",
-  bm: "Bambara",
-  ba: "Bashkir",
-  eu: "Basque",
-  be: "Belarusian",
-  bn: "Bengali",
-  bh: "Bihari",
-  bi: "Bislama",
-  bs: "Bosnian",
-  br: "Breton",
-  bg: "Bulgarian",
-  my: "Burmese",
-  ca: "Catalan",
-  ch: "Chamorro",
-  ce: "Chechen",
-  ny: "Chichewa",
-  zh: "Chinese",
-  "zh-Hans": "Chinese (Simplified)",
-  "zh-Hant": "Chinese (Traditional)",
-  cv: "Chuvash",
-  kw: "Cornish",
-  co: "Corsican",
-  cr: "Cree",
-  hr: "Croatian",
-  cs: "Czech",
-  da: "Danish",
-  dv: "Maldivian",
-  nl: "Dutch",
-  dz: "Dzongkha",
-  en: "English",
-  eo: "Esperanto",
-  et: "Estonian",
-  ee: "Ewe",
-  fo: "Faroese",
-  fj: "Fijian",
-  fi: "Finnish",
-  fr: "French",
-  ff: "Fula, Pular",
-  gl: "Galician",
-  gd: "Gaelic (Scottish)",
-  gv: "Manx",
-  ka: "Georgian",
-  de: "German",
-  el: "Greek",
-  kl: "Kalaallisut",
-  gn: "Guarani",
-  gu: "Gujarati",
-  ht: "Haitian Creole",
-  ha: "Hausa",
-  he: "Hebrew",
-  hz: "Herero",
-  hi: "Hindi",
-  ho: "Hiri Motu",
-  hu: "Hungarian",
-  is: "Icelandic",
-  io: "Ido",
-  ig: "Igbo",
-  id: "Indonesian",
-  ia: "Interlingua",
-  ie: "Interlingue",
-  iu: "Inuktitut",
-  ik: "Inupiak",
-  ga: "Irish",
-  it: "Italian",
-  ja: "Japanese",
-  jv: "Javanese",
-  kn: "Kannada",
-  kr: "Kanuri",
-  ks: "Kashmiri",
-  kk: "Kazakh",
-  km: "Khmer",
-  ki: "Kikuyu",
-  rw: "Kinyarwanda",
-  rn: "Kirundi",
-  ky: "Kyrgyz",
-  kv: "Komi",
-  kg: "Kongo",
-  ko: "Korean",
-  ku: "Kurdish",
-  kj: "Kwanyama",
-  lo: "Lao",
-  la: "Latin",
-  lv: "Latvian",
-  li: "Limburgish",
-  ln: "Lingala",
-  lt: "Lithuanian",
-  lu: "Luga-Katanga",
-  lg: "Luganda, Ganda",
-  lb: "Luxembourgish",
-  mk: "Macedonian",
-  mg: "Malagasy",
-  ms: "Malay",
-  ml: "Malayalam",
-  mt: "Maltese",
-  mi: "Maori",
-  mr: "Marathi",
-  mh: "Marshallese",
-  mo: "Moldavian",
-  mn: "Mongolian",
-  na: "Nauru",
-  nv: "Navajo",
-  ng: "Ndonga",
-  nd: "Northern Ndebele",
-  ne: "Nepali",
-  no: "Norwegian",
-  nb: "Norwegian bokmål",
-  nn: "Norwegian nynorsk",
-  ii: "Sichuan Yi",
-  oc: "Occitan",
-  oj: "Ojibwe",
-  cu: "Old Church Slavonic",
-  or: "Oriya",
-  om: "Oromo",
-  os: "Ossetian",
-  pi: "Pāli",
-  ps: "Pashto, Pushto",
-  fa: "Persian (Farsi)",
-  pl: "Polish",
-  pt: "Portuguese",
-  pa: "Punjabi (Eastern)",
-  qu: "Quechua",
-  rm: "Romansh",
-  ro: "Romanian",
-  ru: "Russian",
-  se: "Sami",
-  sm: "Samoan",
-  sg: "Sango",
-  sa: "Sanskrit",
-  sr: "Serbian",
-  sh: "Serbo-Croatian",
-  st: "Sesotho",
-  tn: "Setswana",
-  sn: "Shona",
-  sd: "Sindhi",
-  si: "Sinhalese",
-  ss: "Swati",
-  sk: "Slovak",
-  sl: "Slovenian",
-  so: "Somali",
-  nr: "Southern Ndebele",
-  es: "Spanish",
-  su: "Sundanese",
-  sw: "Swahili (Kiswahili)",
-  sv: "Swedish",
-  tl: "Tagalog",
-  ty: "Tahitian",
-  tg: "Tajik",
-  ta: "Tamil",
-  tt: "Tatar",
-  te: "Telugu",
-  th: "Thai",
-  bo: "Tibetan",
-  ti: "Tigrinya",
-  to: "Tonga",
-  ts: "Tsonga",
-  tr: "Turkish",
-  tk: "Turkmen",
-  tw: "Twi",
-  ug: "Uyghur",
-  uk: "Ukrainian",
-  ur: "Urdu",
-  uz: "Uzbek",
-  ve: "Venda",
-  vi: "Vietnamese",
-  vo: "Volapük",
-  wa: "Wallon",
-  cy: "Welsh",
-  wo: "Wolof",
-  fy: "Western Frisian",
-  xh: "Xhosa",
-  yi: "Yiddish",
-  yo: "Yoruba",
-  za: "Zhuang, Chuang",
-  zu: "Zulu"
 }, LanguageSelector = () => {
   const { fallbackLang: o, languages: n, selectedLang: r, setSelectedLang: a } = useLanguages(), l = (r == null ? void 0 : r.length) > 0 ? r : o, i = useMemo(() => {
     const c = [];
-    return forEach(uniq([...n, o]), (d) => {
+    return forEach(uniq([o, ...n]), (d) => {
       const u = get(LANGUAGES, d);
       u && c.push({ key: d, value: u, default: d === o });
     }), c;
   }, [o, n]);
-  return isEmpty(n) ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-x-1 text-sm", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(GlobeIcon$1, { className: "h-4 w-4" }),
-    get(LANGUAGES, l),
-    l === o && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "h-full pl-1 text-[10px] leading-4 text-green-400", children: "Default" })
+  return isEmpty(n) && l === "en" ? null : isEmpty(n) && l !== "en" ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-x-1 text-sm text-blue-500 hover:text-blue-600", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(FaLanguage, { className: "h-4 w-4" }),
+    get(LANGUAGES, l)
   ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenu, { children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { size: "sm", variant: "outline", className: "flex items-center gap-x-1 text-blue-500 hover:text-blue-600", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(GlobeIcon$1, { className: "h-4 w-4" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-end", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1 text-blue-500 hover:text-blue-600", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(FaLanguage, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
           " ",
           get(LANGUAGES, l)
         ] }),
-        l === o && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "h-full pl-1 text-[10px] leading-4 text-gray-400", children: "Default" })
+        /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDownIcon, { className: "h-4 w-4" })
       ] })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuContent, { children: map(i, (c) => /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuItem, { className: "flex cursor-pointer items-end", onClick: () => a(c.key), children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: c.value }),
-      c.key === o && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "h-full pl-1 text-[10px] leading-4 text-green-400", children: "Default" })
-    ] })) })
+    /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuContent, { className: "border-border", children: map(i, (c) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      DropdownMenuItem,
+      {
+        className: cn(
+          "flex cursor-pointer items-center text-sm",
+          c.key === l && "!bg-blue-500 text-white hover:!text-white"
+        ),
+        onClick: () => a(c.key),
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: c.value }),
+          c.key === o ? /* @__PURE__ */ jsxRuntimeExports.jsx(FaStar, { className: "ml-2 h-4 w-4 text-yellow-400" }) : null
+        ]
+      }
+    )) })
   ] });
 }, CanvasTopBar = () => {
   const o = useBuilderProp("darkMode", !0), [n] = useCanvasZoom();
@@ -8650,10 +8676,10 @@ const PageDataProviders = () => {
     n.map((f) => map(i, "providerKey").includes(f.providerKey) ? null : { value: f.providerKey, label: f.name }),
     (f) => !isNull(f)
   ), g = (f) => {
-    const k = find(n, { providerKey: f });
-    c((v) => [...v, k]), a((v) => [...v, { providerKey: k.providerKey, args: {} }]), u(""), l("UNSAVED");
+    const _ = find(n, { providerKey: f });
+    c((v) => [...v, _]), a((v) => [...v, { providerKey: _.providerKey, args: {} }]), u(""), l("UNSAVED");
   }, E = (f) => {
-    c((k) => filter(k, (v) => v.providerKey !== f.providerKey)), a((k) => filter(k, (v) => v.providerKey !== f.providerKey)), l("UNSAVED");
+    c((_) => filter(_, (v) => v.providerKey !== f.providerKey)), a((_) => filter(_, (v) => v.providerKey !== f.providerKey)), l("UNSAVED");
   }, j = (f) => m(f);
   return isEmpty(n) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mb-1.5 p-4 text-xs text-gray-500", children: [
     o("no_data_providers"),
@@ -8750,7 +8776,7 @@ const PageDataProviders = () => {
 function AiFillDatabase(o) {
   return GenIcon({ tag: "svg", attr: { viewBox: "0 0 1024 1024" }, child: [{ tag: "path", attr: { d: "M832 64H192c-17.7 0-32 14.3-32 32v224h704V96c0-17.7-14.3-32-32-32zM288 232c-22.1 0-40-17.9-40-40s17.9-40 40-40 40 17.9 40 40-17.9 40-40 40zM160 928c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V704H160v224zm128-136c22.1 0 40 17.9 40 40s-17.9 40-40 40-40-17.9-40-40 17.9-40 40-40zM160 640h704V384H160v256zm128-168c22.1 0 40 17.9 40 40s-17.9 40-40 40-40-17.9-40-40 17.9-40 40-40z" }, child: [] }] })(o);
 }
-const TopBar = lazy(() => import("./Topbar-Z4cQD_EP.js"));
+const TopBar = lazy(() => import("./Topbar-21XY-_r9.js"));
 function useSidebarMenuItems(o) {
   const n = o === "SINGLE_SIDE_PANEL", { t: r } = useTranslation(), a = useBuilderProp("dataBindingSupport", !1), l = useBuilderProp("askAiCallBack", null);
   return useMemo(() => {