@chaibuilder/sdk 1.2.88 → 1.2.89

package/dist/{index-JAlLL51L.js → index-dee0FZm6.js}

@@ -4,7 +4,7 @@ var ze = (r, n, o) => (gt(r, typeof n != "symbol" ? n + "" : n, o), o);
 import { j as jsxRuntimeExports } from "./jsx-runtime-Sp0orL4X.js";
 import * as React from "react";
 import React__default, { createContext as createContext$1, useReducer, useEffect as useEffect$1, useDebugValue, useCallback as useCallback$1, useContext as useContext$1, useState as useState$1, Component, Children, Suspense, useMemo as useMemo$1, useRef as useRef$1, memo, createElement as createElement$1, useLayoutEffect as useLayoutEffect$1, forwardRef as forwardRef$1, cloneElement, Fragment, lazy } from "react";
-import { S as Skeleton, B as Button$1, C as ContextMenu, a as ContextMenuTrigger, b as ContextMenuContent, c as ContextMenuItem, T as Tooltip$1, d as TooltipTrigger, e as TooltipContent, f as Card, g as CardHeader, h as CardDescription, i as CardContent, L as Label, j as Textarea, k as CardFooter, D as Dialog, l as DialogTrigger, m as DialogContent, n as DialogHeader, o as DialogTitle, p as DialogDescription, q as DialogFooter, P as Popover$1, r as PopoverTrigger, s as PopoverContent, t as Command, u as CommandInput, v as CommandList, w as CommandEmpty, x as CommandGroup, y as CommandItem, z as Tabs$1, A as TabsList$1, E as TabsTrigger, F as TabsContent, G as Switch, H as Accordion, I as AccordionItem, J as AccordionTrigger, K as AccordionContent, M as useToast, N as Input$2, O as TooltipPortal, Q as DropdownMenu, R as DropdownMenuTrigger, U as DropdownMenuContent, V as ScrollArea$1, W as DropdownMenuLabel, X as DropdownMenuSeparator, Y as DropdownMenuGroup, Z as DropdownMenuItem, _ as DropdownMenuShortcut, $ as AlertDialog, a0 as AlertDialogContent, a1 as AlertDialogHeader, a2 as AlertDialogTitle, a3 as AlertDialogTrigger, a4 as AlertDialogDescription, a5 as AlertDialogFooter, a6 as AlertDialogCancel, a7 as AlertDialogAction, a8 as DropdownMenuCheckboxItem, a9 as HoverCard, aa as HoverCardTrigger, ab as HoverCardContent, ac as Separator, ad as TooltipProvider, ae as Toaster } from "./context-menu-LFlr5p9-.js";
+import { S as Skeleton, B as Button$1, C as ContextMenu, a as ContextMenuTrigger, b as ContextMenuContent, c as ContextMenuItem, T as Tooltip$1, d as TooltipTrigger, e as TooltipContent, f as Card, g as CardHeader, h as CardDescription, i as CardContent, L as Label, j as Textarea, k as CardFooter, D as Dialog, l as DialogTrigger, m as DialogContent, n as DialogHeader, o as DialogTitle, p as DialogDescription, q as DialogFooter, P as Popover$1, r as PopoverTrigger, s as PopoverContent, t as Command, u as CommandInput, v as CommandList, w as CommandEmpty, x as CommandGroup, y as CommandItem, z as Tabs$1, A as TabsList$1, E as TabsTrigger, F as TabsContent, G as Switch, H as Accordion, I as AccordionItem, J as AccordionTrigger, K as AccordionContent, M as useToast, N as Input$2, O as TooltipPortal, Q as DropdownMenu, R as DropdownMenuTrigger, U as DropdownMenuContent, V as ScrollArea$1, W as DropdownMenuLabel, X as DropdownMenuSeparator, Y as DropdownMenuGroup, Z as DropdownMenuItem, _ as DropdownMenuShortcut, $ as AlertDialog, a0 as AlertDialogContent, a1 as AlertDialogHeader, a2 as AlertDialogTitle, a3 as AlertDialogTrigger, a4 as AlertDialogDescription, a5 as AlertDialogFooter, a6 as AlertDialogCancel, a7 as AlertDialogAction, a8 as DropdownMenuCheckboxItem, a9 as HoverCard, aa as HoverCardTrigger, ab as HoverCardContent, ac as Separator, ad as Badge$1, ae as TooltipProvider, af as Toaster } from "./context-menu-DeUUflYX.js";
 import { has, find, filter, flatten, map, omit, isString as isString$1, includes, without, get as get$1, compact, set, isEmpty, forIn, isObject as isObject$2, each, first, noop as noop$1, keys, startsWith, range, values, flattenDeep, isNull, pick, sortBy, chunk, throttle, memoize as memoize$1, reverse, debounce as debounce$1, flatMapDeep, forEach, capitalize, last, startCase, truncate, isArray as isArray$5, split, toLower, cloneDeep, reject, nth, isNumber as isNumber$1, parseInt as parseInt$1, isNaN as isNaN$1, findLast, intersection, groupBy, isFunction as isFunction$2, 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$1, f, y, s, c as cn, G as GenIcon } from "./iconBase-zweRWSz0.js";
@@ -19,7 +19,7 @@ import { useFeature, FlagsProvider } from "flagged";
 import { useHotkeys } from "react-hotkeys-hook";
 import { flip as flip$2 } from "@floating-ui/dom";
 import { useFloating as useFloating$1, shift, getOverflowAncestors, autoUpdate, size, offset, limitShift, flip as flip$3, inline, arrow } from "@floating-ui/react-dom";
-import { ArrowUpIcon, PlusIcon, CopyIcon as CopyIcon$1, 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, ZoomInIcon, MixerHorizontalIcon, LightningBoltIcon } from "@radix-ui/react-icons";
+import { ArrowUpIcon, PlusIcon, CopyIcon as CopyIcon$1, 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, 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";
@@ -90,23 +90,23 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
   const r = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap(), o = /* @__PURE__ */ new Map();
   let a, i, l;
   (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Set());
-  const c = (P) => r.get(P), u = (P, j) => {
-    (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && Object.freeze(j);
+  const c = (P) => r.get(P), u = (P, O) => {
+    (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && Object.freeze(O);
     const T = r.get(P);
-    if (r.set(P, j), o.has(P) || o.set(P, T), T && hasPromiseAtomValue(T)) {
-      const N = "v" in j ? j.v instanceof Promise ? j.v : Promise.resolve(j.v) : Promise.reject(j.e);
+    if (r.set(P, O), o.has(P) || o.set(P, T), T && hasPromiseAtomValue(T)) {
+      const N = "v" in O ? O.v instanceof Promise ? O.v : Promise.resolve(O.v) : Promise.reject(O.e);
       cancelPromise(T.v, N);
     }
-  }, d = (P, j, T) => {
+  }, d = (P, O, T) => {
     const N = /* @__PURE__ */ new Map();
     let L = !1;
     T.forEach((M, W) => {
-      !M && W === P && (M = j), M ? (N.set(W, M), j.d.get(W) !== M && (L = !0)) : (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && console.warn("[Bug] atom state not found");
-    }), (L || j.d.size !== N.size) && (j.d = N);
-  }, p = (P, j, T) => {
+      !M && W === P && (M = O), M ? (N.set(W, M), O.d.get(W) !== M && (L = !0)) : (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && console.warn("[Bug] atom state not found");
+    }), (L || O.d.size !== N.size) && (O.d = N);
+  }, p = (P, O, T) => {
     const N = c(P), L = {
       d: (N == null ? void 0 : N.d) || /* @__PURE__ */ new Map(),
-      v: j
+      v: O
     };
     if (T && d(P, L, T), N && isEqualAtomValue(N, L) && N.d === L.d)
       return N;
@@ -116,12 +116,12 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
       L.v = N.v;
     }
     return u(P, L), L;
-  }, m = (P, j, T, N) => {
-    if (isPromiseLike$2(j)) {
+  }, m = (P, O, T, N) => {
+    if (isPromiseLike$2(O)) {
       let L;
       const M = new Promise((W, J) => {
         let F = !1;
-        j.then(
+        O.then(
           (V) => {
             if (!F) {
               F = !0;
@@ -151,27 +151,27 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
           ), W(V));
         };
       });
-      return M.orig = j, M.status = "pending", registerCancelPromise(M, (W) => {
+      return M.orig = O, M.status = "pending", registerCancelPromise(M, (W) => {
         W && L(W), N == null || N();
       }), p(P, M, T);
     }
-    return p(P, j, T);
-  }, g = (P, j, T) => {
+    return p(P, O, T);
+  }, g = (P, O, T) => {
     const N = c(P), L = {
       d: (N == null ? void 0 : N.d) || /* @__PURE__ */ new Map(),
-      e: j
+      e: O
     };
     return T && d(P, L, T), N && isEqualAtomError(N, L) && N.d === L.d ? N : (u(P, L), L);
   }, h = (P) => {
-    const j = c(P);
-    if (j && (j.d.forEach((F, V) => {
+    const O = c(P);
+    if (O && (O.d.forEach((F, V) => {
       V !== P && !n.has(V) && h(V);
-    }), Array.from(j.d).every(([F, V]) => {
+    }), Array.from(O.d).every(([F, V]) => {
       const q = c(F);
       return F === P || q === V || // TODO This is a hack, we should find a better solution.
       q && !hasPromiseAtomValue(q) && isEqualAtomValue(q, V);
     })))
-      return j;
+      return O;
     const T = /* @__PURE__ */ new Map();
     let N = !0;
     const L = (F) => {
@@ -212,18 +212,18 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
       N = !1;
     }
   }, b = (P) => returnAtomValue(h(P)), x = (P) => {
-    let j = n.get(P);
-    return j || (j = C(P)), j;
-  }, v = (P, j) => !j.l.size && (!j.t.size || j.t.size === 1 && j.t.has(P)), S = (P) => {
-    const j = n.get(P);
-    j && v(P, j) && R(P);
+    let O = n.get(P);
+    return O || (O = C(P)), O;
+  }, v = (P, O) => !O.l.size && (!O.t.size || O.t.size === 1 && O.t.has(P)), S = (P) => {
+    const O = n.get(P);
+    O && v(P, O) && R(P);
   }, E = (P) => {
-    const j = /* @__PURE__ */ new Map(), T = /* @__PURE__ */ new WeakMap(), N = (M) => {
+    const O = /* @__PURE__ */ new Map(), T = /* @__PURE__ */ new WeakMap(), N = (M) => {
       const W = n.get(M);
       W == null || W.t.forEach((J) => {
-        J !== M && (j.set(
+        J !== M && (O.set(
           J,
-          (j.get(J) || /* @__PURE__ */ new Set()).add(M)
+          (O.get(J) || /* @__PURE__ */ new Set()).add(M)
         ), T.set(J, (T.get(J) || 0) + 1), N(J));
       });
     };
@@ -235,19 +235,19 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
         if (J !== M) {
           let V = T.get(J);
           if (V && T.set(J, --V), !V) {
-            let q = !!((F = j.get(J)) != null && F.size);
+            let q = !!((F = O.get(J)) != null && F.size);
             if (q) {
               const G = c(J), ee = h(J);
               q = !G || !isEqualAtomValue(G, ee);
             }
-            q || j.forEach((G) => G.delete(J));
+            q || O.forEach((G) => G.delete(J));
           }
           L(J);
         }
       });
     };
     L(P);
-  }, w = (P, ...j) => {
+  }, w = (P, ...O) => {
     let T = !0;
     const N = (W) => returnAtomValue(h(W)), L = (W, ...J) => {
       let F;
@@ -265,16 +265,16 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
         );
       }
       return F;
-    }, M = P.write(N, L, ...j);
+    }, M = P.write(N, L, ...O);
     return T = !1, M;
-  }, A = (P, ...j) => {
-    const T = w(P, ...j), N = I();
+  }, A = (P, ...O) => {
+    const T = w(P, ...O), N = I();
     return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && i.forEach(
       (L) => L({ type: "write", flushed: N })
     ), T;
-  }, C = (P, j) => {
+  }, C = (P, O) => {
     const T = {
-      t: new Set(j && [j]),
+      t: new Set(O && [O]),
       l: /* @__PURE__ */ new Set()
     };
     if (n.set(P, T), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && l.add(P), h(P).d.forEach((N, L) => {
@@ -286,8 +286,8 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
     }
     return T;
   }, R = (P) => {
-    var j;
-    const T = (j = n.get(P)) == null ? void 0 : j.u;
+    var O;
+    const T = (O = n.get(P)) == null ? void 0 : O.u;
     T && T(), n.delete(P), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && l.delete(P);
     const N = c(P);
     N ? (hasPromiseAtomValue(N) && cancelPromise(N.v), N.d.forEach((L, M) => {
@@ -296,8 +296,8 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
         W && (W.t.delete(P), v(M, W) && R(M));
       }
     })) : (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && console.warn("[Bug] could not find atom state to unmount", P);
-  }, k = (P, j, T) => {
-    const N = new Set(j.d.keys());
+  }, k = (P, O, T) => {
+    const N = new Set(O.d.keys());
     T == null || T.forEach((L, M) => {
       if (N.has(M)) {
         N.delete(M);
@@ -312,8 +312,8 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
   }, I = () => {
     let P;
     for ((define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (P = /* @__PURE__ */ new Set()); o.size; ) {
-      const j = Array.from(o);
-      o.clear(), j.forEach(([T, N]) => {
+      const O = Array.from(o);
+      o.clear(), O.forEach(([T, N]) => {
         const L = c(T);
         if (L) {
           L.d !== (N == null ? void 0 : N.d) && k(T, L, N == null ? void 0 : N.d);
@@ -326,21 +326,21 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
       });
     }
     if ((define_import_meta_env_default$2 ? "production" : void 0) !== "production")
-      return a.forEach((j) => j("state")), P;
-  }, O = (P, j) => {
+      return a.forEach((O) => O("state")), P;
+  }, j = (P, O) => {
     const T = x(P), N = I(), L = T.l;
-    return L.add(j), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a.forEach((M) => M("sub")), i.forEach(
+    return L.add(O), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a.forEach((M) => M("sub")), i.forEach(
       (M) => M({ type: "sub", flushed: N })
     )), () => {
-      L.delete(j), S(P), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a.forEach((M) => M("unsub")), i.forEach((M) => M({ type: "unsub" })));
+      L.delete(O), S(P), (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && (a.forEach((M) => M("unsub")), i.forEach((M) => M({ type: "unsub" })));
     };
   };
   return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" ? {
     get: b,
     set: A,
-    sub: O,
+    sub: j,
     // store dev methods (these are tentative and subject to change without notice)
-    dev_subscribe_store: (P, j) => j !== 2 ? (console.warn(
+    dev_subscribe_store: (P, O) => O !== 2 ? (console.warn(
       "The current StoreListener revision is 2. The older ones are deprecated."
     ), a.add(P), () => {
       a.delete(P);
@@ -353,15 +353,15 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
     dev_restore_atoms: (P) => {
       for (const [T, N] of P)
         hasInitialValue(T) && (m(T, N), E(T));
-      const j = I();
+      const O = I();
       i.forEach(
-        (T) => T({ type: "restore", flushed: j })
+        (T) => T({ type: "restore", flushed: O })
       );
     }
   } : {
     get: b,
     set: A,
-    sub: O
+    sub: j
   };
 };
 let defaultStore;
@@ -397,14 +397,14 @@ function splitAtom(r, n) {
             }
             return C[k];
           }, E = (w, A, C) => {
-            const R = w(i), k = w(r), O = a(k, R == null ? void 0 : R.arr).keyList.indexOf(x);
-            if (O < 0 || O >= k.length)
+            const R = w(i), k = w(r), j = a(k, R == null ? void 0 : R.arr).keyList.indexOf(x);
+            if (j < 0 || j >= k.length)
               throw new Error("splitAtom: index out of bounds for write");
-            const P = isFunction$1(C) ? C(k[O]) : C;
+            const P = isFunction$1(C) ? C(k[j]) : C;
             A(r, [
-              ...k.slice(0, O),
+              ...k.slice(0, j),
               P,
-              ...k.slice(O + 1)
+              ...k.slice(j + 1)
             ]);
           };
           m[b] = isWritable(r) ? atom(S, E) : atom(S);
@@ -1214,7 +1214,7 @@ const useBlocksStoreManager = () => {
   return {
     moveBlocks: (x, v, S) => {
       const E = map(x, (A) => {
-        const R = n.find((O) => O._id === A)._parent || null, I = n.filter((O) => R ? O._parent === R : !O._parent).map((O) => O._id).indexOf(A);
+        const R = n.find((j) => j._id === A)._parent || null, I = n.filter((j) => R ? j._parent === R : !j._parent).map((j) => j._id).indexOf(A);
         return { _id: A, oldParent: R, oldPosition: I };
       }), w = E.find(({ _id: A }) => A === x[0]);
       w && w.oldParent === v && w.oldPosition === S || (l(x, v, S), r({
@@ -3279,7 +3279,7 @@ const useHandleCanvasDblClick = () => {
       "bg-dark": A,
       "text-dark": C,
       "text-light": R
-    }, O = get$1(n, "roundedCorners", "0");
+    }, j = get$1(n, "roundedCorners", "0");
     !p || !p.tailwind || (p.tailwind.config = {
       darkMode: "class",
       theme: {
@@ -3296,7 +3296,7 @@ const useHandleCanvasDblClick = () => {
             body: [v]
           },
           borderRadius: {
-            DEFAULT: `${O || "0"}px`
+            DEFAULT: `${j || "0"}px`
           },
           colors: { ...I, ...k }
         }
@@ -3305,19 +3305,19 @@ const useHandleCanvasDblClick = () => {
         typography$1,
         forms,
         aspectRatio,
-        plugin(function({ addBase: P, theme: j }) {
+        plugin(function({ addBase: P, theme: O }) {
           P({
             "h1,h2,h3,h4,h5,h6": {
-              fontFamily: j("fontFamily.heading")
+              fontFamily: O("fontFamily.heading")
             },
             body: {
-              fontFamily: j("fontFamily.body"),
-              color: j("colors.text-light"),
-              backgroundColor: j("colors.bg-light")
+              fontFamily: O("fontFamily.body"),
+              color: O("colors.text-light"),
+              backgroundColor: O("colors.bg-light")
             },
             ".dark body": {
-              color: j("colors.text-dark"),
-              backgroundColor: j("colors.bg-dark")
+              color: O("colors.text-dark"),
+              backgroundColor: O("colors.bg-dark")
             }
           });
         })
@@ -3416,9 +3416,9 @@ function BlocksRendererStatic({ blocks: r }) {
       if (g === b._id || d.includes(b._id))
         return null;
       const v = getSlots(b), S = {};
-      isEmpty(v) || Object.keys(v).forEach((O) => {
-        S[O] = React__default.Children.toArray(
-          v[O].map((P) => /* @__PURE__ */ jsxRuntimeExports.jsx(BlocksRendererStatic, { blocks: [find(n, { _id: P })] }))
+      isEmpty(v) || Object.keys(v).forEach((j) => {
+        S[j] = React__default.Children.toArray(
+          v[j].map((P) => /* @__PURE__ */ jsxRuntimeExports.jsx(BlocksRendererStatic, { blocks: [find(n, { _id: P })] }))
         );
       });
       const E = filter(n, { _parent: b._id });
@@ -3650,7 +3650,7 @@ const useAllDataProviders = () => useMemo$1(() => getChaiDataProviders(), []), B
   }
 }, Breadcrumb = () => {
   const r = useSelectedBlockHierarchy(), [, n] = useSelectedBlockIds(), [, o] = useHighlightBlockId();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "-mx-2 bg-background px-2 py-1 text-xs text-muted-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("ol", { className: "flex items-center whitespace-nowrap", children: [
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "-mx-2 border-t border-border bg-background px-2 py-1 text-xs text-muted-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("ol", { className: "flex items-center whitespace-nowrap", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { className: "inline-flex items-center", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, { onClick: () => n([]), variant: "ghost", className: "h-fit p-1 text-xs font-normal", children: "Body" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { size: 16 })
@@ -3674,7 +3674,7 @@ const useAllDataProviders = () => useMemo$1(() => getChaiDataProviders(), []), B
       i !== r.length - 1 && /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { size: 16 })
     ] }, i))
   ] }) });
-}, CodeEditor$1 = React__default.lazy(() => import("./CodeEditor-86swShPz.js")), CanvasArea = () => {
+}, CodeEditor$1 = React__default.lazy(() => import("./CodeEditor-tlLB_emd.js")), CanvasArea = () => {
   const [r] = useCodeEditor(), n = useBuilderProp("onError", noop$1);
   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$1, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(FallbackError, {}), onError: n, children: /* @__PURE__ */ jsxRuntimeExports.jsx(StaticCanvas$1, {}) }) }),
@@ -4001,34 +4001,34 @@ function BiExpandVertical(r) {
 const Node = memo(({ node: r, style: n, dragHandle: o }) => {
   const a = useBuilderProp("outlineMenuItems", []), { t: i } = useTranslation(), [l, , c] = useHiddenBlockIds(), [, u] = useHighlightBlockId(), [d] = useAtom$1(canvasIframeAtom);
   let p = null;
-  const m = r.children.length > 0, { id: g, data: h, isSelected: b, willReceiveDrop: x, isDragging: v, isEditing: S, handleClick: E } = r, w = (O) => {
-    O.stopPropagation(), !l.includes(g) && r.toggle();
-  }, A = (O) => {
-    O.isInternal && (p = O.isOpen, O.isOpen && O.close());
-  }, C = (O) => {
-    O.isInternal && p !== null && (p ? O.open() : O.close(), p = null);
-  }, R = (O) => {
-    O.stopPropagation(), !r.isOpen && !l.includes(g) && r.toggle(), E(O);
+  const m = r.children.length > 0, { id: g, data: h, isSelected: b, willReceiveDrop: x, isDragging: v, isEditing: S, handleClick: E } = r, w = (j) => {
+    j.stopPropagation(), !l.includes(g) && r.toggle();
+  }, A = (j) => {
+    j.isInternal && (p = j.isOpen, j.isOpen && j.close());
+  }, C = (j) => {
+    j.isInternal && p !== null && (p ? j.open() : j.close(), p = null);
+  }, R = (j) => {
+    j.stopPropagation(), !r.isOpen && !l.includes(g) && r.toggle(), E(j);
   };
   useEffect$1(() => {
-    const O = setTimeout(() => {
+    const j = setTimeout(() => {
       x && !r.isOpen && !v && !l.includes(g) && r.toggle();
     }, 500);
-    return () => clearTimeout(O);
+    return () => clearTimeout(j);
   }, [x, r, v]);
   const k = useMemo$1(() => {
-    const O = Object.keys(h), P = [];
-    for (let j = 0; j < O.length; j++)
-      if (O[j].endsWith("_attrs")) {
-        const T = h[O[j]], N = Object.keys(T).join("|");
+    const j = Object.keys(h), P = [];
+    for (let O = 0; O < j.length; O++)
+      if (j[O].endsWith("_attrs")) {
+        const T = h[j[O]], N = Object.keys(T).join("|");
         N.match(/x-data/) && P.push("data"), N.match(/x-on/) && P.push("event"), N.match(/x-show|x-if/) && P.push("show");
       }
     return P;
-  }, [h]), I = (O, P) => {
-    const j = d.contentDocument || d.contentWindow.document, T = j.querySelector(`[data-block-id=${O}]`);
+  }, [h]), I = (j, P) => {
+    const O = d.contentDocument || d.contentWindow.document, T = O.querySelector(`[data-block-id=${j}]`);
     T && T.setAttribute("data-drop", P);
     const N = T.getBoundingClientRect(), L = d.getBoundingClientRect();
-    N.top >= L.top && N.left >= L.left && N.bottom <= L.bottom && N.right <= L.right || (j.documentElement.scrollTop = T.offsetTop - L.top);
+    N.top >= L.top && N.left >= L.left && N.bottom <= L.bottom && N.right <= L.right || (O.documentElement.scrollTop = T.offsetTop - L.top);
   };
   return g === ROOT_TEMP_KEY ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
     "button",
@@ -4050,17 +4050,17 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
       ref: l.includes(g) ? null : o,
       onDragStart: () => A(r),
       onDragEnd: () => C(r),
-      onDragOver: (O) => {
-        O.preventDefault(), I(g, "yes");
+      onDragOver: (j) => {
+        j.preventDefault(), I(g, "yes");
       },
-      onDragLeave: (O) => {
-        O.preventDefault(), I(g, "no");
+      onDragLeave: (j) => {
+        j.preventDefault(), I(g, "no");
       },
-      onDrop: (O) => {
-        O.preventDefault(), I(g, "no");
+      onDrop: (j) => {
+        j.preventDefault(), I(g, "no");
       },
       className: cn(
-        "group flex !h-full w-full items-center justify-between space-x-px !rounded py-px outline-none",
+        "group flex !h-full w-full items-center justify-between space-x-px !rounded py-px text-foreground/80 outline-none",
         b ? "bg-blue-500 text-white" : "hover:bg-gray-200 dark:hover:bg-gray-800",
         x && canAcceptChildBlock(h._type, "Icon") ? "bg-green-200" : "",
         v && "opacity-20",
@@ -4081,8 +4081,8 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
               "div",
               {
                 className: "ml-2 flex items-center gap-x-1 truncate text-[11px]",
-                onDoubleClick: (O) => {
-                  O.stopPropagation(), r.edit(), r.deselect();
+                onDoubleClick: (j) => {
+                  j.stopPropagation(), r.edit(), r.deselect();
                 },
                 children: [
                   /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: (h == null ? void 0 : h._name) || (h == null ? void 0 : h._type.split("/").pop()) }),
@@ -4095,16 +4095,16 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "invisible flex items-center space-x-1 pr-2 group-hover:visible", children: [
-          !l.includes(g) && a.map((O) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip$1, { children: [
+          !l.includes(g) && a.map((j) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip$1, { children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               TooltipTrigger,
               {
                 className: "cursor-pointer rounded bg-transparent hover:bg-white hover:text-blue-500",
                 asChild: !0,
-                children: React__default.createElement(O.item, { blockId: g })
+                children: React__default.createElement(j.item, { blockId: g })
               }
             ),
-            /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { className: "isolate z-10", children: O.tooltip })
+            /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { className: "isolate z-10", children: j.tooltip })
           ] })),
           canAddChildBlock(h == null ? void 0 : h._type) && !l.includes(g) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip$1, { children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -4122,8 +4122,8 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               TooltipTrigger,
               {
-                onClick: (O) => {
-                  O.stopPropagation(), c(g), r.isOpen && r.toggle();
+                onClick: (j) => {
+                  j.stopPropagation(), c(g), r.isOpen && r.toggle();
                 },
                 className: "cursor-pointer rounded bg-transparent hover:bg-white hover:text-black",
                 asChild: !0,
@@ -4142,7 +4142,7 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
     "input",
     {
       autoFocus: !0,
-      className: "ml-2 w-full rounded-sm border border-black/30 bg-transparent px-1 text-[11px] outline-none",
+      className: "ml-2 !h-4 w-full rounded-sm border border-border bg-background px-1 text-[11px] outline-none",
       type: "text",
       defaultValue: ((n = r.data) == null ? void 0 : n._name) || ((o = r.data) == null ? void 0 : o._type),
       onFocus: (a) => a.currentTarget.select(),
@@ -4229,8 +4229,8 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
           break;
       }
   };
-  return isEmpty(treeData) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex h-full w-full items-center justify-center p-8 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mb-1.5 text-sm text-gray-400", children: [
-    t("page_is_empty"),
+  return isEmpty(treeData) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-10 flex h-full w-full items-center justify-center p-8 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mb-1.5 text-sm text-gray-400", children: [
+    t("This page is empty"),
     /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
     /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
@@ -4516,7 +4516,7 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(CardFooter, { className: "flex flex-col justify-end p-3", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, { disabled: o.trim() === "", onClick: () => l(), size: "sm", className: "w-full", children: n("Import HTML") }) })
+    /* @__PURE__ */ jsxRuntimeExports.jsx(CardFooter, { className: "flex flex-col justify-end p-3", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, { disabled: o.trim() === "", onClick: () => l(), size: "sm", className: "w-fit", children: n("Import HTML") }) })
   ] });
 }, ImportHTML$1 = ImportHTML, isBoolean = (r) => typeof r == "boolean" || r instanceof Boolean, isNumber = (r) => typeof r == "number" || r instanceof Number, isBigInt = (r) => typeof r == "bigint" || r instanceof BigInt, isDate = (r) => !!r && r instanceof Date, isString = (r) => typeof r == "string" || r instanceof String, isArray$4 = (r) => Array.isArray(r), isObject$1 = (r) => r instanceof Object && r !== null;
 function useBool(r) {
@@ -5059,7 +5059,7 @@ const ViewData = ({ data: r, fullView: n }) => {
       }
     )
   ] });
-}, UnsplashImages = React__default.lazy(() => import("./UnsplashImages-JkK2qDpq.js")), UploadImages = React__default.lazy(() => import("./UploadImages--oXePb3w.js")), ImagesPanel = ({
+}, UnsplashImages = React__default.lazy(() => import("./UnsplashImages-7f-L_-9x.js")), UploadImages = React__default.lazy(() => import("./UploadImages-hXRywPyk.js")), ImagesPanel = ({
   isModalView: r = !1,
   onSelect: n = () => {
   }
@@ -5179,7 +5179,7 @@ const ViewData = ({ data: r, fullView: n }) => {
           placeholder: c === "page" || c === "url" ? "Enter URL" : c === "scroll" ? "#ElementID" : "Enter detail"
         }
       ),
-      (c === "page" || c === "url") && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-x-2", children: [
+      (c === "page" || c === "url") && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-x-2 text-muted-foreground", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           "input",
           {
@@ -5188,7 +5188,7 @@ const ViewData = ({ data: r, fullView: n }) => {
             spellCheck: "false",
             type: "checkbox",
             defaultChecked: d === "_blank",
-            className: "cursor-pointer rounded-md border border-border",
+            className: "!w-fit cursor-pointer rounded-md border border-border",
             onChange: () => o({ ...n, target: d === "_blank" ? "_self" : "_blank" })
           }
         ),
@@ -5265,12 +5265,12 @@ const ViewData = ({ data: r, fullView: n }) => {
     return null;
   const c = r.includes(o._id);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "py-2 text-xs hover:no-underline", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-x-2 border-b border-border bg-gray-200 px-4 py-2 font-normal", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-x-2 border-b border-border bg-background py-2 font-normal text-muted-foreground", children: [
       o._name || o._type,
-      "  ",
+      " ",
       i("visibility settings")
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2 px-2 pt-2", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2 pt-2", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         Switch,
         {
@@ -5539,13 +5539,13 @@ function ManualClasses() {
     const k = u.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
     a(l, k, !0), d("");
   }, [b, x] = useState$1([]), v = ({ value: k }) => {
-    const I = k.trim().toLowerCase(), O = I.match(/.+:/g);
+    const I = k.trim().toLowerCase(), j = I.match(/.+:/g);
     let P = [];
-    if (O && O.length > 0) {
-      const [j] = O, T = I.replace(j, "");
+    if (j && j.length > 0) {
+      const [O] = j, T = I.replace(O, "");
       P = fuse.search(T).map((L) => ({
         ...L,
-        item: { ...L.item, name: j + L.item.name }
+        item: { ...L.item, name: O + L.item.name }
       }));
     } else
       P = fuse.search(I);
@@ -5614,8 +5614,8 @@ function ManualClasses() {
               },
               theme: {
                 suggestion: "bg-transparent",
-                suggestionHighlighted: "!bg-gray-300 ",
-                suggestionsContainerOpen: "absolute bg-gray-100 z-50 max-h-[230px] overflow-y-auto w-full  border border-border rounded-md"
+                suggestionHighlighted: "!bg-gray-300 dark:!bg-gray-800 cursor-pointer",
+                suggestionsContainerOpen: "absolute bg-background no-scrollbar z-50 max-h-[230px] overflow-y-auto w-full  border border-border rounded-md"
               }
             }
           ) }),
@@ -6299,35 +6299,35 @@ const RangeChoices = ({ property: r, onChange: n }) => {
 )) }), THROTTLE_TIME = 50, AdvanceChoices = (r) => {
   const [n, o] = useState$1(!1), [a, i] = useState$1(""), { currentClass: l, onChange: c, classPrefix: u, cssProperty: d, units: p, negative: m } = r, [g, h] = useState$1(d != null && d.toLowerCase().includes("width") ? "%" : p[0]), [b, x] = useState$1(!1), [v, S] = useState$1(""), [E, w] = useState$1(!1), [A, C] = useState$1(!1);
   useEffect$1(() => {
-    const { value: P, unit: j } = getClassValueAndUnit(l);
-    if (j === "") {
+    const { value: P, unit: O } = getClassValueAndUnit(l);
+    if (O === "") {
       i(P), h(d != null && d.toLowerCase().includes("width") ? "%" : first(p));
       return;
     }
-    h(j), i(j === "class" || isEmpty(P) ? "" : P);
+    h(O), i(O === "class" || isEmpty(P) ? "" : P);
   }, [l, d, p]);
   const R = useThrottledCallback((P) => c(P), [c], THROTTLE_TIME), k = useThrottledCallback((P) => c(P, !1), [c], THROTTLE_TIME), I = useCallback$1(
     (P = !1) => {
-      const j = getUserInputValues(`${a}`, p);
-      if (get$1(j, "error", !1)) {
+      const O = getUserInputValues(`${a}`, p);
+      if (get$1(O, "error", !1)) {
         x(!0);
         return;
       }
-      const T = get$1(j, "unit") !== "" ? get$1(j, "unit") : g;
+      const T = get$1(O, "unit") !== "" ? get$1(O, "unit") : g;
       if (T === "auto" || T === "none") {
         R(`${u}${T}`);
         return;
       }
-      if (get$1(j, "value") === "")
+      if (get$1(O, "value") === "")
         return;
-      const L = `${get$1(j, "value", "").startsWith("-") ? "-" : ""}${u}[${get$1(j, "value", "").replace("-", "")}${T === "-" ? "" : T}]`;
+      const L = `${get$1(O, "value", "").startsWith("-") ? "-" : ""}${u}[${get$1(O, "value", "").replace("-", "")}${T === "-" ? "" : T}]`;
       P ? k(L) : R(L);
     },
     [R, k, a, g, u, p]
-  ), O = useCallback$1(
+  ), j = useCallback$1(
     (P) => {
-      const j = getUserInputValues(`${a}`, p);
-      if (get$1(j, "error", !1)) {
+      const O = getUserInputValues(`${a}`, p);
+      if (get$1(O, "error", !1)) {
         x(!0);
         return;
       }
@@ -6335,9 +6335,9 @@ const RangeChoices = ({ property: r, onChange: n }) => {
         R(`${u}${P}`);
         return;
       }
-      if (get$1(j, "value") === "")
+      if (get$1(O, "value") === "")
         return;
-      const T = get$1(j, "unit") !== "" ? get$1(j, "unit") : P, L = `${get$1(j, "value", "").startsWith("-") ? "-" : ""}${u}[${get$1(j, "value", "").replace("-", "")}${T === "-" ? "" : T}]`;
+      const T = get$1(O, "unit") !== "" ? get$1(O, "unit") : P, L = `${get$1(O, "value", "").startsWith("-") ? "-" : ""}${u}[${get$1(O, "value", "").replace("-", "")}${T === "-" ? "" : T}]`;
       R(L);
     },
     [R, a, u, p]
@@ -6361,8 +6361,8 @@ const RangeChoices = ({ property: r, onChange: n }) => {
             if (P.keyCode !== 38 && P.keyCode !== 40)
               return;
             P.preventDefault(), C(!0);
-            const j = parseInt$1(P.target.value);
-            let T = isNaN$1(j) ? 0 : j;
+            const O = parseInt$1(P.target.value);
+            let T = isNaN$1(O) ? 0 : O;
             P.keyCode === 38 && (T += 1), P.keyCode === 40 && (T -= 1);
             const N = `${T}`, M = `${N.startsWith("-") ? "-" : ""}${u}[${N.replace("-", "")}${g === "-" ? "" : g}]`;
             k(M);
@@ -6375,8 +6375,8 @@ const RangeChoices = ({ property: r, onChange: n }) => {
             x(!1), i(P.target.value);
           },
           onClick: (P) => {
-            var j;
-            (j = P == null ? void 0 : P.target) == null || j.select(), o(!1);
+            var O;
+            (O = P == null ? void 0 : P.target) == null || O.select(), o(!1);
           },
           value: E ? v : a,
           className: "h-6 w-14 rounded rounded-r-none border border-transparent bg-background pl-2 text-sm focus-visible:outline-0".concat(
@@ -6404,7 +6404,7 @@ const RangeChoices = ({ property: r, onChange: n }) => {
             units: p,
             current: g,
             onSelect: (P) => {
-              o(!1), h(P), O(P);
+              o(!1), h(P), j(P);
             }
           }
         ) }) })
@@ -6417,14 +6417,14 @@ const RangeChoices = ({ property: r, onChange: n }) => {
         onDragEnd: (P) => {
           if (S(() => ""), w(!1), isEmpty(P))
             return;
-          const j = `${P}`, N = `${j.startsWith("-") ? "-" : ""}${u}[${j.replace("-", "")}${g === "-" ? "" : g}]`;
+          const O = `${P}`, N = `${O.startsWith("-") ? "-" : ""}${u}[${O.replace("-", "")}${g === "-" ? "" : g}]`;
           R(N);
         },
         onDrag: (P) => {
           if (isEmpty(P))
             return;
           S(P);
-          const j = `${P}`, N = `${j.startsWith("-") ? "-" : ""}${u}[${j.replace("-", "")}${g === "-" ? "" : g}]`;
+          const O = `${P}`, N = `${O.startsWith("-") ? "-" : ""}${u}[${O.replace("-", "")}${g === "-" ? "" : g}]`;
           k(N);
         },
         currentValue: a,
@@ -6524,9 +6524,9 @@ const RangeChoices = ({ property: r, onChange: n }) => {
   const { t: n } = useTranslation(), { type: o = "icons", label: a, property: i, onEmitChange: l = () => {
   }, units: c, negative: u = !1 } = r, [d] = useDarkMode(), [p] = useStylingState(), [, m] = useCanvasWidth(), g = useCurrentClassByProperty(i), h = useAddClassesToBlocks(), b = useRemoveClassesFromBlocks(), [x] = useSelectedBlockIds(), v = useMemo$1(() => get$1(g, "fullCls", ""), [g]), S = useCallback$1(
     (k, I = !0) => {
-      const O = { dark: d, mq: m, mod: p, cls: k, property: i, fullCls: "" };
-      (d || p !== "") && (O.mq = "xs");
-      const P = generateFullClsName(O);
+      const j = { dark: d, mq: m, mod: p, cls: k, property: i, fullCls: "" };
+      (d || p !== "") && (j.mq = "xs");
+      const P = generateFullClsName(j);
       h(x, [P], I);
     },
     [x, d, m, p, i, h]
@@ -7461,12 +7461,12 @@ const CoreBlock = ({ block: r, disabled: n, parentId: o }) => {
       ] }) }) : null
     )
   );
-}, AddBlocksPanel = ({
+}, addBlockTabAtom = atomWithStorage("__add_block_tab", "library"), AddBlocksPanel = ({
   className: r,
   showHeading: n = !0,
   parentId: o = void 0
 }) => {
-  const { t: a } = useTranslation(), [i, l] = useState$1("library"), [, c] = useAtom$1(showPredefinedBlockCategoryAtom), u = useBuilderProp("importHTMLSupport", !0);
+  const { t: a } = useTranslation(), [i, l] = useAtom$1(addBlockTabAtom), [, c] = useAtom$1(showPredefinedBlockCategoryAtom), u = useBuilderProp("importHTMLSupport", !0);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("flex h-full w-full flex-col overflow-hidden", r), children: [
     n ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-2 flex flex-col justify-between rounded-md bg-background/30 p-1", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx("h1", { className: "flex flex-col items-baseline px-1 text-xl font-semibold xl:flex-col", children: a("Add block") }),
@@ -7479,8 +7479,8 @@ const CoreBlock = ({ block: r, disabled: n, parentId: o }) => {
           c(""), l(d);
         },
         value: i,
-        className: cn("h-max", u ? "" : "hidden"),
-        children: /* @__PURE__ */ jsxRuntimeExports.jsxs(TabsList$1, { className: "grid w-full " + (u ? "grid-cols-3" : "grid-cols-1"), children: [
+        className: cn("h-max"),
+        children: /* @__PURE__ */ jsxRuntimeExports.jsxs(TabsList$1, { className: "grid w-full " + (u ? "grid-cols-3" : "grid-cols-2"), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { value: "library", children: a("library") }),
           /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { value: "core", children: a("blocks") }),
           u ? /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { value: "html", children: a("import") }) : null
@@ -8760,7 +8760,7 @@ function requireReactIs_development() {
         }
       }
     }
-    var R = d, k = p, I = u, O = c, P = n, j = m, T = a, N = x, L = b, M = o, W = l, J = i, F = g, V = !1;
+    var R = d, k = p, I = u, j = c, P = n, O = m, T = a, N = x, L = b, M = o, W = l, J = i, F = g, V = !1;
     function q(K) {
       return V || (V = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), G(K) || C(K) === d;
     }
@@ -8800,7 +8800,7 @@ function requireReactIs_development() {
     function se(K) {
       return C(K) === g;
     }
-    reactIs_development.AsyncMode = R, reactIs_development.ConcurrentMode = k, reactIs_development.ContextConsumer = I, reactIs_development.ContextProvider = O, reactIs_development.Element = P, reactIs_development.ForwardRef = j, reactIs_development.Fragment = T, reactIs_development.Lazy = N, reactIs_development.Memo = L, reactIs_development.Portal = M, reactIs_development.Profiler = W, reactIs_development.StrictMode = J, reactIs_development.Suspense = F, reactIs_development.isAsyncMode = q, reactIs_development.isConcurrentMode = G, reactIs_development.isContextConsumer = ee, reactIs_development.isContextProvider = z, reactIs_development.isElement = U, reactIs_development.isForwardRef = te, reactIs_development.isFragment = _, reactIs_development.isLazy = Q, reactIs_development.isMemo = ne, reactIs_development.isPortal = re, reactIs_development.isProfiler = $, reactIs_development.isStrictMode = ae, reactIs_development.isSuspense = se, reactIs_development.isValidElementType = A, reactIs_development.typeOf = C;
+    reactIs_development.AsyncMode = R, reactIs_development.ConcurrentMode = k, reactIs_development.ContextConsumer = I, reactIs_development.ContextProvider = j, reactIs_development.Element = P, reactIs_development.ForwardRef = O, reactIs_development.Fragment = T, reactIs_development.Lazy = N, reactIs_development.Memo = L, reactIs_development.Portal = M, reactIs_development.Profiler = W, reactIs_development.StrictMode = J, reactIs_development.Suspense = F, reactIs_development.isAsyncMode = q, reactIs_development.isConcurrentMode = G, reactIs_development.isContextConsumer = ee, reactIs_development.isContextProvider = z, reactIs_development.isElement = U, reactIs_development.isForwardRef = te, reactIs_development.isFragment = _, reactIs_development.isLazy = Q, reactIs_development.isMemo = ne, reactIs_development.isPortal = re, reactIs_development.isProfiler = $, reactIs_development.isStrictMode = ae, reactIs_development.isSuspense = se, reactIs_development.isValidElementType = A, reactIs_development.typeOf = C;
   }()), reactIs_development;
 }
 process.env.NODE_ENV === "production" ? reactIs$1.exports = requireReactIs_production_min() : reactIs$1.exports = requireReactIs_development();
@@ -10972,11 +10972,11 @@ function useScrollIntoView({
     }) - (m.current ? 0 : w);
     function C() {
       d.current === 0 && (d.current = performance.now());
-      const k = performance.now() - d.current, I = h || r === 0 ? 1 : k / r, O = w + A * a(I);
+      const k = performance.now() - d.current, I = h || r === 0 ? 1 : k / r, j = w + A * a(I);
       setScrollParam({
         parent: m.current,
         axis: n,
-        distance: O
+        distance: j
       }), !p.current && I < 1 ? u.current = requestAnimationFrame(C) : (typeof o == "function" && o(), d.current = 0, u.current = 0, b());
     }
     C();
@@ -11039,9 +11039,9 @@ function extractSystemStyles(r) {
     fw: R,
     lts: k,
     ta: I,
-    lh: O,
+    lh: j,
     fs: P,
-    tt: j,
+    tt: O,
     td: T,
     w: N,
     miw: L,
@@ -11128,9 +11128,9 @@ function extractSystemStyles(r) {
     fw: R,
     lts: k,
     ta: I,
-    lh: O,
+    lh: j,
     fs: P,
-    tt: j,
+    tt: O,
     td: T,
     w: N,
     miw: L,
@@ -12216,7 +12216,7 @@ const defaultProps$A = {
     "unstyled",
     "span",
     "__staticSelector"
-  ]), { classes: O, cx: P } = useStyles$H({
+  ]), { classes: j, cx: P } = useStyles$H({
     color: u,
     lineClamp: m,
     truncate: g,
@@ -12232,7 +12232,7 @@ const defaultProps$A = {
   }, { unstyled: C, name: k || "Text", variant: p, size: i });
   return /* @__PURE__ */ React__default.createElement(Box, __spreadValues$14({
     ref: n,
-    className: P(O.root, { [O.gradient]: p === "gradient" }, a),
+    className: P(j.root, { [j.gradient]: p === "gradient" }, a),
     component: R ? "span" : "div"
   }, I));
 });
@@ -12498,39 +12498,39 @@ function SelectItems({
     size: g
   }), w = [], A = [];
   let C = null;
-  const R = (I, O) => {
+  const R = (I, j) => {
     const P = typeof i == "function" ? i(I.value) : !1;
     return /* @__PURE__ */ React__default.createElement(m, __spreadValues$$({
       key: I.value,
       className: E.item,
       "data-disabled": I.disabled || void 0,
-      "data-hovered": !I.disabled && n === O || void 0,
+      "data-hovered": !I.disabled && n === j || void 0,
       "data-selected": !I.disabled && P || void 0,
       selected: P,
-      onMouseEnter: () => u(O),
-      id: `${l}-${O}`,
+      onMouseEnter: () => u(j),
+      id: `${l}-${j}`,
       role: "option",
       tabIndex: -1,
-      "aria-selected": n === O,
-      ref: (j) => {
-        p && p.current && (p.current[I.value] = j);
+      "aria-selected": n === j,
+      ref: (O) => {
+        p && p.current && (p.current[I.value] = O);
       },
-      onMouseDown: I.disabled ? null : (j) => {
-        j.preventDefault(), d(I);
+      onMouseDown: I.disabled ? null : (O) => {
+        O.preventDefault(), d(I);
       },
       disabled: I.disabled,
       variant: S
     }, I));
   };
   let k = null;
-  if (r.forEach((I, O) => {
-    I.creatable ? C = O : I.group ? (k !== I.group && (k = I.group, A.push(/* @__PURE__ */ React__default.createElement("div", {
+  if (r.forEach((I, j) => {
+    I.creatable ? C = j : I.group ? (k !== I.group && (k = I.group, A.push(/* @__PURE__ */ React__default.createElement("div", {
       className: E.separator,
-      key: `__mantine-divider-${O}`
+      key: `__mantine-divider-${j}`
     }, /* @__PURE__ */ React__default.createElement(Divider, {
       classNames: { label: E.separatorLabel },
       label: I.group
-    })))), A.push(R(I, O))) : w.push(R(I, O));
+    })))), A.push(R(I, j))) : w.push(R(I, j));
   }), b) {
     const I = r[C];
     w.push(/* @__PURE__ */ React__default.createElement("div", {
@@ -12538,12 +12538,12 @@ function SelectItems({
       className: E.item,
       "data-hovered": n === C || void 0,
       onMouseEnter: () => u(C),
-      onMouseDown: (O) => {
-        O.preventDefault(), d(I);
+      onMouseDown: (j) => {
+        j.preventDefault(), d(I);
       },
       tabIndex: -1,
-      ref: (O) => {
-        p && p.current && (p.current[I.value] = O);
+      ref: (j) => {
+        p && p.current && (p.current[I.value] = j);
       }
     }, x));
   }
@@ -12924,8 +12924,8 @@ const useHover = function(r, n) {
       floating: b
     },
     refs: x
-  } = r, v = useFloatingTree(), S = useFloatingParentNodeId(), E = useLatestRef(i), w = useLatestRef(a), A = React.useRef(), C = React.useRef(), R = React.useRef(), k = React.useRef(), I = React.useRef(!0), O = React.useRef(!1), P = React.useRef(() => {
-  }), j = React.useCallback(() => {
+  } = r, v = useFloatingTree(), S = useFloatingParentNodeId(), E = useLatestRef(i), w = useLatestRef(a), A = React.useRef(), C = React.useRef(), R = React.useRef(), k = React.useRef(), I = React.useRef(!0), j = React.useRef(!1), P = React.useRef(() => {
+  }), O = React.useCallback(() => {
     var M;
     const W = (M = m.current.openEvent) == null ? void 0 : M.type;
     return (W == null ? void 0 : W.includes("mouse")) && W !== "mousedown";
@@ -12943,13 +12943,13 @@ const useHover = function(r, n) {
     if (!o || !E.current || !d)
       return;
     function M() {
-      j() && p(!1);
+      O() && p(!1);
     }
     const W = getDocument(b).documentElement;
     return W.addEventListener("mouseleave", M), () => {
       W.removeEventListener("mouseleave", M);
     };
-  }, [b, d, p, o, E, m, j]);
+  }, [b, d, p, o, E, m, O]);
   const T = React.useCallback(function(M) {
     M === void 0 && (M = !0);
     const W = getDelay(w.current, "close", A.current);
@@ -12957,9 +12957,9 @@ const useHover = function(r, n) {
   }, [w, p]), N = React.useCallback(() => {
     P.current(), R.current = void 0;
   }, []), L = React.useCallback(() => {
-    if (O.current) {
+    if (j.current) {
       const M = getDocument(x.floating.current).body;
-      M.style.pointerEvents = "", M.removeAttribute(safePolygonIdentifier), O.current = !1;
+      M.style.pointerEvents = "", M.removeAttribute(safePolygonIdentifier), j.current = !1;
     }
   }, [x]);
   return React.useEffect(() => {
@@ -13021,9 +13021,9 @@ const useHover = function(r, n) {
     }
   }, [h, b, o, r, l, c, u, T, N, L, p, d, v, w, E, m]), index(() => {
     var M;
-    if (o && d && (M = E.current) != null && M.__options.blockPointerEvents && j()) {
+    if (o && d && (M = E.current) != null && M.__options.blockPointerEvents && O()) {
       const F = getDocument(b).body;
-      if (F.setAttribute(safePolygonIdentifier, ""), F.style.pointerEvents = "none", O.current = !0, isElement(h) && b) {
+      if (F.setAttribute(safePolygonIdentifier, ""), F.style.pointerEvents = "none", j.current = !0, isElement(h) && b) {
         var W, J;
         const V = h, q = v == null || (W = v.nodesRef.current.find((G) => G.id === S)) == null || (J = W.context) == null ? void 0 : J.elements.floating;
         return q && (q.style.pointerEvents = ""), V.style.pointerEvents = "auto", b.style.pointerEvents = "auto", () => {
@@ -13031,7 +13031,7 @@ const useHover = function(r, n) {
         };
       }
     }
-  }, [o, d, S, b, h, v, E, m, j]), index(() => {
+  }, [o, d, S, b, h, v, E, m, O]), index(() => {
     d || (A.current = void 0, N(), L());
   }, [d, N, L]), React.useEffect(() => () => {
     N(), clearTimeout(C.current), clearTimeout(k.current), L();
@@ -13251,12 +13251,12 @@ const bubbleHandlerKeys = {
   } = n === void 0 ? {} : n;
   const w = useFloatingTree(), A = useFloatingParentNodeId() != null, C = useEvent(typeof h == "function" ? h : () => !1), R = typeof h == "function" ? C : h, k = React.useRef(!1), {
     escapeKeyBubbles: I,
-    outsidePressBubbles: O
+    outsidePressBubbles: j
   } = normalizeBubblesProp(E);
   return React.useEffect(() => {
     if (!o || !m)
       return;
-    p.current.__escapeKeyBubbles = I, p.current.__outsidePressBubbles = O;
+    p.current.__escapeKeyBubbles = I, p.current.__outsidePressBubbles = j;
     function P(M) {
       if (M.key === "Escape") {
         const W = w ? getChildren(w.nodesRef.current, l) : [];
@@ -13281,7 +13281,7 @@ const bubbleHandlerKeys = {
         }), a(!1);
       }
     }
-    function j(M) {
+    function O(M) {
       const W = k.current;
       if (k.current = !1, W || typeof R == "function" && !R(M))
         return;
@@ -13323,7 +13323,7 @@ const bubbleHandlerKeys = {
       a(!1);
     }
     const N = getDocument(d);
-    g && N.addEventListener("keydown", P), R && N.addEventListener(b, j);
+    g && N.addEventListener("keydown", P), R && N.addEventListener(b, O);
     let L = [];
     return S && (isElement(u) && (L = getOverflowAncestors(u)), isElement(d) && (L = L.concat(getOverflowAncestors(d))), !isElement(c) && c && c.contextElement && (L = L.concat(getOverflowAncestors(c.contextElement)))), L = L.filter((M) => {
       var W;
@@ -13333,11 +13333,11 @@ const bubbleHandlerKeys = {
         passive: !0
       });
     }), () => {
-      g && N.removeEventListener("keydown", P), R && N.removeEventListener(b, j), L.forEach((M) => {
+      g && N.removeEventListener("keydown", P), R && N.removeEventListener(b, O), L.forEach((M) => {
         M.removeEventListener("scroll", T);
       });
     };
-  }, [p, d, u, c, g, R, b, i, w, l, o, a, S, m, I, O, A]), React.useEffect(() => {
+  }, [p, d, u, c, g, R, b, i, w, l, o, a, S, m, I, j, A]), React.useEffect(() => {
     k.current = !1;
   }, [R, b]), React.useMemo(() => m ? {
     reference: {
@@ -14027,9 +14027,9 @@ function Popover(r) {
     arrowRadius: R,
     arrowPosition: k,
     unstyled: I,
-    classNames: O,
+    classNames: j,
     styles: P,
-    closeOnClickOutside: j,
+    closeOnClickOutside: O,
     withinPortal: T,
     portalProps: N,
     closeOnEscape: L,
@@ -14102,7 +14102,7 @@ function Popover(r) {
     onOpen: F,
     onClose: J
   });
-  useClickOutside(() => be.opened && j && be.onClose(), M, [se, Z]);
+  useClickOutside(() => be.opened && O && be.onClose(), M, [se, Z]);
   const Ze = useCallback$1((ge) => {
     K(ge), be.floating.reference(ge);
   }, [be.floating.reference]), Ne = useCallback$1((ge) => {
@@ -14143,7 +14143,7 @@ function Popover(r) {
       withRoles: _,
       targetProps: ae,
       __staticSelector: te,
-      classNames: O,
+      classNames: j,
       styles: P,
       unstyled: I,
       variant: re,
@@ -14295,7 +14295,7 @@ function useInputProps(r, n, o) {
     inputContainer: R,
     inputWrapperOrder: k,
     withAsterisk: I,
-    variant: O
+    variant: j
   } = a, P = __objRest$A(a, [
     "label",
     "description",
@@ -14318,7 +14318,7 @@ function useInputProps(r, n, o) {
     "inputWrapperOrder",
     "withAsterisk",
     "variant"
-  ]), j = useId$2(w), { systemStyles: T, rest: N } = extractSystemStyles(P), L = __spreadValues$R({
+  ]), O = useId$2(w), { systemStyles: T, rest: N } = extractSystemStyles(P), L = __spreadValues$R({
     label: i,
     description: l,
     error: c,
@@ -14332,13 +14332,13 @@ function useInputProps(r, n, o) {
     descriptionProps: S,
     unstyled: g,
     styles: p,
-    id: j,
+    id: O,
     size: A,
     style: C,
     inputContainer: R,
     inputWrapperOrder: k,
     withAsterisk: I,
-    variant: O
+    variant: j
   }, E);
   return __spreadProps$z(__spreadValues$R({}, N), {
     classNames: d,
@@ -14350,11 +14350,11 @@ function useInputProps(r, n, o) {
       classNames: d,
       styles: p,
       unstyled: g,
-      id: j,
+      id: O,
       size: A,
       __staticSelector: h,
       error: c,
-      variant: O
+      variant: j
     }
   });
 }
@@ -14643,14 +14643,14 @@ const defaultProps$q = {
     "inputWrapperOrder",
     "withAsterisk",
     "variant"
-  ]), { classes: O, cx: P } = useStyles$w(null, {
+  ]), { classes: j, cx: P } = useStyles$w(null, {
     classNames: x,
     styles: v,
     name: ["InputWrapper", w],
     unstyled: A,
     variant: k,
     size: S
-  }), j = {
+  }), O = {
     classNames: x,
     styles: v,
     unstyled: A,
@@ -14663,15 +14663,15 @@ const defaultProps$q = {
     id: u ? `${u}-label` : void 0,
     htmlFor: u,
     required: T
-  }, j), g), i), V = p && /* @__PURE__ */ React__default.createElement(InputDescription, __spreadProps$x(__spreadValues$M(__spreadValues$M({
+  }, O), g), i), V = p && /* @__PURE__ */ React__default.createElement(InputDescription, __spreadProps$x(__spreadValues$M(__spreadValues$M({
     key: "description"
-  }, h), j), {
-    size: (h == null ? void 0 : h.size) || j.size,
+  }, h), O), {
+    size: (h == null ? void 0 : h.size) || O.size,
     id: (h == null ? void 0 : h.id) || L
   }), p), q = /* @__PURE__ */ React__default.createElement(Fragment, {
     key: "input"
-  }, E(l)), G = typeof d != "boolean" && d && /* @__PURE__ */ React__default.createElement(InputError, __spreadProps$x(__spreadValues$M(__spreadValues$M({}, b), j), {
-    size: (b == null ? void 0 : b.size) || j.size,
+  }, E(l)), G = typeof d != "boolean" && d && /* @__PURE__ */ React__default.createElement(InputError, __spreadProps$x(__spreadValues$M(__spreadValues$M({}, b), O), {
+    size: (b == null ? void 0 : b.size) || O.size,
     key: "error",
     id: (b == null ? void 0 : b.id) || N
   }), d), ee = C.map((z) => {
@@ -14696,7 +14696,7 @@ const defaultProps$q = {
       hasError: !!G
     }))
   }, /* @__PURE__ */ React__default.createElement(Box, __spreadValues$M({
-    className: P(O.root, a),
+    className: P(j.root, a),
     ref: n
   }, I), ee));
 });
@@ -14916,7 +14916,7 @@ const defaultProps$o = {
     sx: R,
     unstyled: k,
     pointer: I
-  } = o, O = __objRest$u(o, [
+  } = o, j = __objRest$u(o, [
     "className",
     "error",
     "required",
@@ -14938,7 +14938,7 @@ const defaultProps$o = {
     "sx",
     "unstyled",
     "pointer"
-  ]), { offsetBottom: P, offsetTop: j, describedBy: T } = useInputWrapperContext(), { classes: N, cx: L } = useStyles$v({
+  ]), { offsetBottom: P, offsetTop: O, describedBy: T } = useInputWrapperContext(), { classes: N, cx: L } = useStyles$v({
     radius: x,
     multiline: C,
     invalid: !!i,
@@ -14946,9 +14946,9 @@ const defaultProps$o = {
     iconWidth: g,
     withRightSection: !!h,
     offsetBottom: P,
-    offsetTop: j,
+    offsetTop: O,
     pointer: I
-  }, { classNames: E, styles: w, name: ["Input", A], unstyled: k, variant: u, size: v }), { systemStyles: M, rest: W } = extractSystemStyles(O);
+  }, { classNames: E, styles: w, name: ["Input", A], unstyled: k, variant: u, size: v }), { systemStyles: M, rest: W } = extractSystemStyles(j);
   return /* @__PURE__ */ React__default.createElement(Box, __spreadValues$J(__spreadValues$J({
     className: L(N.wrapper, a),
     sx: R,
@@ -15370,7 +15370,7 @@ const defaultProps$l = {
     "classNames",
     "styles",
     "unstyled"
-  ]), { classes: O, cx: P, theme: j } = useStyles$r({
+  ]), { classes: j, cx: P, theme: O } = useStyles$r({
     radius: b,
     color: l,
     fullWidth: g,
@@ -15378,12 +15378,12 @@ const defaultProps$l = {
     gradient: A,
     withLeftIcon: !!p,
     withRightIcon: !!m
-  }, { name: "Button", unstyled: k, classNames: C, styles: R, variant: h, size: i }), T = j.fn.variant({ color: l, variant: h }), N = /* @__PURE__ */ React__default.createElement(Loader, __spreadValues$E({
+  }, { name: "Button", unstyled: k, classNames: C, styles: R, variant: h, size: i }), T = O.fn.variant({ color: l, variant: h }), N = /* @__PURE__ */ React__default.createElement(Loader, __spreadValues$E({
     color: T.color,
     size: `calc(${getSize({ size: i, sizes: sizes$1 }).height} / 2)`
   }, w));
   return /* @__PURE__ */ React__default.createElement(UnstyledButton, __spreadValues$E({
-    className: P(O.root, a),
+    className: P(j.root, a),
     type: c,
     disabled: u,
     "data-button": !0,
@@ -15392,16 +15392,16 @@ const defaultProps$l = {
     ref: n,
     unstyled: k
   }, I), /* @__PURE__ */ React__default.createElement("div", {
-    className: O.inner
+    className: j.inner
   }, (p || S && E === "left") && /* @__PURE__ */ React__default.createElement("span", {
-    className: P(O.icon, O.leftIcon)
+    className: P(j.icon, j.leftIcon)
   }, S && E === "left" ? N : p), S && E === "center" && /* @__PURE__ */ React__default.createElement("span", {
-    className: O.centerLoader
+    className: j.centerLoader
   }, N), /* @__PURE__ */ React__default.createElement("span", {
-    className: O.label,
+    className: j.label,
     style: { textTransform: x ? "uppercase" : void 0 }
   }, d), (m || S && E === "right") && /* @__PURE__ */ React__default.createElement("span", {
-    className: P(O.icon, O.rightIcon)
+    className: P(j.icon, j.rightIcon)
   }, S && E === "right" ? N : m)));
 });
 _Button.displayName = "@mantine/core/Button";
@@ -16309,48 +16309,48 @@ const defaultProps$c = {
     "childrenOffset",
     "disabled",
     "onClick"
-  ]), { classes: O, cx: P } = useStyles$i({ color: h, noWrap: x, childrenOffset: C, alignIcon: i ? "top" : "center" }, { name: "NavLink", classNames: d, styles: p, unstyled: m, variant: b }), [j, T] = useUncontrolled({
+  ]), { classes: j, cx: P } = useStyles$i({ color: h, noWrap: x, childrenOffset: C, alignIcon: i ? "top" : "center" }, { name: "NavLink", classNames: d, styles: p, unstyled: m, variant: b }), [O, T] = useUncontrolled({
     value: S,
     defaultValue: E,
     finalValue: !1,
     onChange: w
   }), N = !!v, L = (M) => {
-    N ? (M.preventDefault(), k == null || k(M), T(!j)) : k == null || k(M);
+    N ? (M.preventDefault(), k == null || k(M), T(!O)) : k == null || k(M);
   };
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(UnstyledButton, __spreadValues$m({
     ref: n,
-    className: P(O.root, u),
+    className: P(j.root, u),
     "data-active": g || void 0,
     onClick: L,
     unstyled: m,
-    "data-expanded": j || void 0,
+    "data-expanded": O || void 0,
     "data-disabled": R || void 0,
     disabled: R
   }, I), l && /* @__PURE__ */ React__default.createElement("span", {
-    className: O.icon
+    className: j.icon
   }, l), /* @__PURE__ */ React__default.createElement("span", {
-    className: O.body
+    className: j.body
   }, /* @__PURE__ */ React__default.createElement(Text, {
     component: "span",
     size: "sm",
-    className: O.label
+    className: j.label
   }, a), /* @__PURE__ */ React__default.createElement(Text, {
     component: "span",
     color: "dimmed",
     size: "xs",
     "data-active": g || void 0,
-    className: O.description
+    className: j.description
   }, i)), (N || c) && /* @__PURE__ */ React__default.createElement("span", {
-    className: O.rightSection,
-    "data-rotate": j && !A || void 0
+    className: j.rightSection,
+    "data-rotate": O && !A || void 0
   }, N ? c || /* @__PURE__ */ React__default.createElement(ChevronIcon$1, {
     width: rem(14),
     height: rem(14),
     style: { transform: "rotate(-90deg)" }
   }) : c)), /* @__PURE__ */ React__default.createElement(Collapse, {
-    in: j
+    in: O
   }, /* @__PURE__ */ React__default.createElement("div", {
-    className: O.children
+    className: j.children
   }, v)));
 });
 _NavLink.displayName = "@mantine/core/NavLink";
@@ -16540,7 +16540,7 @@ function TooltipFloating(r) {
     "zIndex",
     "disabled",
     "variant"
-  ]), { handleMouseMove: I, x: O, y: P, opened: j, boundaryRef: T, floating: N, setOpened: L } = useFloatingTooltip({
+  ]), { handleMouseMove: I, x: j, y: P, opened: O, boundaryRef: T, floating: N, setOpened: L } = useFloatingTooltip({
     offset: v,
     position: S
   }), { classes: M, cx: W } = useStyles$h({ radius: h, color: b, multiline: E, width: w }, { name: "TooltipFloating", classNames: p, styles: m, unstyled: g, variant: R });
@@ -16560,9 +16560,9 @@ function TooltipFloating(r) {
     className: W(M.tooltip, d),
     style: __spreadProps$g(__spreadValues$j({}, u), {
       zIndex: A,
-      display: !C && j ? "block" : "none",
+      display: !C && O ? "block" : "none",
       top: P ?? "",
-      left: (n = Math.round(O)) != null ? n : ""
+      left: (n = Math.round(j)) != null ? n : ""
     })
   }), x)), cloneElement(a, __spreadProps$g(__spreadValues$j({}, a.props), {
     [i]: J,
@@ -16572,8 +16572,8 @@ function TooltipFloating(r) {
 }
 TooltipFloating.displayName = "@mantine/core/TooltipFloating";
 function useTooltip(r) {
-  const [n, o] = useState$1(!1), i = typeof r.opened == "boolean" ? r.opened : n, l = useTooltipGroupContext(), c = useId$2(), { delay: u, currentId: d, setCurrentId: p } = useDelayGroupContext(), m = useCallback$1((O) => {
-    o(O), O && p(c);
+  const [n, o] = useState$1(!1), i = typeof r.opened == "boolean" ? r.opened : n, l = useTooltipGroupContext(), c = useId$2(), { delay: u, currentId: d, setCurrentId: p } = useDelayGroupContext(), m = useCallback$1((j) => {
+    o(j), j && p(c);
   }, [p, c]), {
     x: g,
     y: h,
@@ -16612,8 +16612,8 @@ function useTooltip(r) {
     positionDependencies: r.positionDependencies,
     floating: { refs: S, update: E }
   }), useDidUpdate(() => {
-    var O;
-    (O = r.onPositionChange) == null || O.call(r, w);
+    var j;
+    (j = r.onPositionChange) == null || j.call(r, w);
   }, [w]), {
     x: g,
     y: h,
@@ -16681,9 +16681,9 @@ const defaultProps$9 = {
     className: R,
     withArrow: k,
     arrowSize: I,
-    arrowOffset: O,
+    arrowOffset: j,
     arrowRadius: P,
-    arrowPosition: j,
+    arrowPosition: O,
     offset: T,
     transitionProps: N,
     multiline: L,
@@ -16743,7 +16743,7 @@ const defaultProps$9 = {
     opened: h,
     events: W,
     arrowRef: a,
-    arrowOffset: O,
+    arrowOffset: j,
     offset: T + (k ? I / 2 : 0),
     positionDependencies: [...V, l],
     inline: z
@@ -16776,9 +16776,9 @@ const defaultProps$9 = {
       visible: k,
       position: $.placement,
       arrowSize: I,
-      arrowOffset: O,
+      arrowOffset: j,
       arrowRadius: P,
-      arrowPosition: j,
+      arrowPosition: O,
       className: Q.arrow
     }));
   })), cloneElement(l, $.getReferenceProps(__spreadValues$i({
@@ -16897,9 +16897,9 @@ const defaultProps$8 = {
     searchable: R,
     clearable: k,
     nothingFound: I,
-    limit: O,
+    limit: j,
     disabled: P,
-    onSearchChange: j,
+    onSearchChange: O,
     searchValue: T,
     rightSection: N,
     rightSectionWidth: L,
@@ -16997,20 +16997,20 @@ const defaultProps$8 = {
     value: T,
     defaultValue: (ke == null ? void 0 : ke.label) || "",
     finalValue: void 0,
-    onChange: j
-  }), Oe = (H) => {
-    at(H), R && typeof j == "function" && j(H);
+    onChange: O
+  }), je = (H) => {
+    at(H), R && typeof O == "function" && O(H);
   }, st = () => {
     var H;
-    Z || (Be(null), Xe || Oe(""), (H = He.current) == null || H.focus());
+    Z || (Be(null), Xe || je(""), (H = He.current) == null || H.focus());
   };
   useEffect$1(() => {
     const H = Ue.find((ie) => ie.value === Ce);
-    H ? Oe(H.label) : (!qe || !Ce) && Oe("");
+    H ? je(H.label) : (!qe || !Ce) && je("");
   }, [Ce]), useEffect$1(() => {
-    ke && (!R || !ge) && Oe(ke.label);
+    ke && (!R || !ge) && je(ke.label);
   }, [ke == null ? void 0 : ke.label]);
-  const je = (H) => {
+  const Oe = (H) => {
     if (!Z)
       if (Ye && (ke == null ? void 0 : ke.value) === H.value)
         Be(null), Se(!1);
@@ -17020,12 +17020,12 @@ const defaultProps$8 = {
           typeof ie < "u" && ie !== null && Be(typeof ie == "string" ? ie : ie.value);
         } else
           Be(H.value);
-        Xe || Oe(H.label), ve(-1), Se(!1), He.current.focus();
+        Xe || je(H.label), ve(-1), Se(!1), He.current.focus();
       }
   }, he = filterData({
     data: Ue,
     searchable: R,
-    limit: O,
+    limit: j,
     searchValue: Ie,
     filter: A,
     filterDataOnExactSearchMatch: ae,
@@ -17092,20 +17092,20 @@ const defaultProps$8 = {
         break;
       }
       case " ": {
-        R || (H.preventDefault(), he[Pe] && ge ? je(he[Pe]) : (Se(!0), ve(Ve), Ke()));
+        R || (H.preventDefault(), he[Pe] && ge ? Oe(he[Pe]) : (Se(!0), ve(Ve), Ke()));
         break;
       }
       case "Enter":
-        R || H.preventDefault(), he[Pe] && ge && (H.preventDefault(), je(he[Pe]));
+        R || H.preventDefault(), he[Pe] && ge && (H.preventDefault(), Oe(he[Pe]));
     }
   }, D = (H) => {
     typeof h == "function" && h(H);
     const ie = Ue.find((ue) => ue.value === Ce);
-    F && he[Pe] && ge && je(he[Pe]), Oe((ie == null ? void 0 : ie.label) || ""), Se(!1);
+    F && he[Pe] && ge && Oe(he[Pe]), je((ie == null ? void 0 : ie.label) || ""), Se(!1);
   }, Y = (H) => {
     typeof b == "function" && b(H), R && Se(!0);
   }, oe = (H) => {
-    Z || (Oe(H.currentTarget.value), k && H.currentTarget.value === "" && Be(null), ve(-1), Se(!0));
+    Z || (je(H.currentTarget.value), k && H.currentTarget.value === "" && Be(null), ve(-1), Se(!0));
   }, ce = () => {
     Z || (Se(!ge), Ce && !ge && ve(Ve));
   };
@@ -17194,7 +17194,7 @@ const defaultProps$8 = {
     uuid: a.id,
     __staticSelector: "Select",
     onItemHover: ve,
-    onItemSelect: je,
+    onItemSelect: Oe,
     itemsRefs: Fe,
     itemComponent: m,
     size: a.size,
@@ -17322,10 +17322,10 @@ const Thumb = forwardRef$1(({
   children: R = null,
   disabled: k,
   unstyled: I,
-  thumbSize: O,
+  thumbSize: j,
   variant: P
-}, j) => {
-  const { classes: T, cx: N, theme: L } = useStyles$d({ color: d, disabled: k, thumbSize: O }, { name: "Slider", classNames: p, styles: m, unstyled: I, variant: P, size: g }), [M, W] = useState$1(!1), J = v || l || M || A && C;
+}, O) => {
+  const { classes: T, cx: N, theme: L } = useStyles$d({ color: d, disabled: k, thumbSize: j }, { name: "Slider", classNames: p, styles: m, unstyled: I, variant: P, size: g }), [M, W] = useState$1(!1), J = v || l || M || A && C;
   return /* @__PURE__ */ React__default.createElement(Box, {
     tabIndex: 0,
     role: "slider",
@@ -17333,7 +17333,7 @@ const Thumb = forwardRef$1(({
     "aria-valuemax": r,
     "aria-valuemin": n,
     "aria-valuenow": o,
-    ref: j,
+    ref: O,
     className: N(T.thumb, { [T.dragging]: l }),
     onFocus: () => {
       W(!0), typeof E == "function" && E();
@@ -17675,9 +17675,9 @@ const defaultProps$7 = {
     labelTransitionTimingFunction: R,
     labelAlwaysOn: k,
     thumbLabel: I,
-    showLabelOnHover: O,
+    showLabelOnHover: j,
     thumbChildren: P,
-    disabled: j,
+    disabled: O,
     unstyled: T,
     thumbSize: N,
     scale: L,
@@ -17719,12 +17719,12 @@ const defaultProps$7 = {
     finalValue: clamp$1(0, g, h),
     onChange: u
   }), U = useRef$1(ee), te = useRef$1(), _ = useRef$1(), Q = getPosition({ value: ee, min: g, max: h }), ne = L(ee), re = typeof w == "function" ? w(ne) : w, $ = useCallback$1(({ x: Z }) => {
-    if (!j) {
+    if (!O) {
       const le = getChangeValue({ value: Z, min: g, max: h, step: b, precision: F });
       z(le), U.current = le;
     }
-  }, [j, g, h, b, F, z]), { ref: ae, active: se } = useMove($, { onScrubEnd: () => d == null ? void 0 : d(U.current) }, V.dir), K = (Z) => {
-    if (!j)
+  }, [O, g, h, b, F, z]), { ref: ae, active: se } = useMove($, { onScrubEnd: () => d == null ? void 0 : d(U.current) }, V.dir), K = (Z) => {
+    if (!O)
       switch (Z.key) {
         case "ArrowUp": {
           Z.preventDefault(), _.current.focus();
@@ -17770,7 +17770,7 @@ const defaultProps$7 = {
     size: p,
     classNames: a,
     styles: i,
-    disabled: j,
+    disabled: O,
     unstyled: T,
     variant: W
   }), /* @__PURE__ */ React__default.createElement(Track, {
@@ -17788,13 +17788,13 @@ const defaultProps$7 = {
     onChange: z,
     classNames: a,
     styles: i,
-    disabled: j,
+    disabled: O,
     unstyled: T,
     variant: W,
     containerProps: {
       ref: ae,
-      onMouseEnter: O ? () => G(!0) : void 0,
-      onMouseLeave: O ? () => G(!1) : void 0
+      onMouseEnter: j ? () => G(!0) : void 0,
+      onMouseLeave: j ? () => G(!1) : void 0
     }
   }, /* @__PURE__ */ React__default.createElement(Thumb, {
     max: h,
@@ -17813,9 +17813,9 @@ const defaultProps$7 = {
     classNames: a,
     styles: i,
     thumbLabel: I,
-    showLabelOnHover: O,
+    showLabelOnHover: j,
     isHovered: q,
-    disabled: j,
+    disabled: O,
     unstyled: T,
     thumbSize: N,
     variant: W
@@ -18249,7 +18249,7 @@ const defaultProps$2 = {
     "inverted",
     "keepMounted",
     "placement"
-  ]), { classes: I, cx: O } = useStyles$4({ orientation: l, color: b, radius: w, inverted: A, placement: R }, { unstyled: v, name: "Tabs", classNames: S, styles: E, variant: h });
+  ]), { classes: I, cx: j } = useStyles$4({ orientation: l, color: b, radius: w, inverted: A, placement: R }, { unstyled: v, name: "Tabs", classNames: S, styles: E, variant: h });
   return /* @__PURE__ */ React__default.createElement(TabsProvider, {
     activateTabWithKeyboard: u,
     defaultValue: a,
@@ -18269,7 +18269,7 @@ const defaultProps$2 = {
     styles: E,
     unstyled: v
   }, /* @__PURE__ */ React__default.createElement(Box, __spreadProps$4(__spreadValues$5({}, k), {
-    className: O(I.root, x),
+    className: j(I.root, x),
     id: m,
     ref: n
   }), p));
@@ -18665,8 +18665,8 @@ function stringify(r, n, o, a = {}) {
 ` : "";
     let C = `var x${w}=${w}${E};${A}`;
     for (const [R, k] of d.entries()) {
-      const I = quote_1.stringifyPath(R, v), O = quote_1.stringifyPath(k, v);
-      C += `x${I}${w}=${w}x${O};${A}`;
+      const I = quote_1.stringifyPath(R, v), j = quote_1.stringifyPath(k, v);
+      C += `x${I}${w}=${w}x${j};${A}`;
     }
     return `(function${w}()${w}{${A}${C}return x;${A}}())`;
   }
@@ -18737,7 +18737,7 @@ function PanelWithForwardedRef({
       throw Error(`Panel defaultSize must be between 0 and 100, but was ${i}`);
     d > i && !a && (console.error(`Panel minSize ${d} cannot be greater than defaultSize ${i}`), i = d);
   }
-  const I = w(v, i), O = useRef({
+  const I = w(v, i), j = useRef({
     size: parseSizeFromStyle(I)
   }), P = useRef({
     callbacksRef: k,
@@ -18751,19 +18751,19 @@ function PanelWithForwardedRef({
     order: g
   });
   return useIsomorphicLayoutEffect(() => {
-    O.current.size = parseSizeFromStyle(I), P.current.callbacksRef = k, P.current.collapsedSize = o, P.current.collapsible = a, P.current.defaultSize = i, P.current.id = v, P.current.idWasAutoGenerated = c == null, P.current.maxSize = u, P.current.minSize = d, P.current.order = g;
+    j.current.size = parseSizeFromStyle(I), P.current.callbacksRef = k, P.current.collapsedSize = o, P.current.collapsible = a, P.current.defaultSize = i, P.current.id = v, P.current.idWasAutoGenerated = c == null, P.current.maxSize = u, P.current.minSize = d, P.current.order = g;
   }), useIsomorphicLayoutEffect(() => (A(v, P), () => {
     R(v);
   }), [g, v, A, R]), useImperativeHandle(l, () => ({
     collapse: () => S(v),
     expand: () => E(v),
     getCollapsed() {
-      return O.current.size === 0;
+      return j.current.size === 0;
     },
     getSize() {
-      return O.current.size;
+      return j.current.size;
     },
-    resize: (j) => C(v, j)
+    resize: (O) => C(v, O)
   }), [S, E, v, C]), createElement(b, {
     children: r,
     className: n,
@@ -18933,8 +18933,8 @@ function useWindowSplitterPanelGroupBehavior({
       v.forEach((T) => {
         T.current.id === S ? (A = T.current.maxSize, w = T.current.minSize) : (C += T.current.minSize, R += T.current.maxSize);
       });
-      const k = Math.min(A, 100 - C), I = Math.max(w, (v.length - 1) * 100 - R), O = getFlexGrow(u, S, i);
-      b.setAttribute("aria-valuemax", "" + Math.round(k)), b.setAttribute("aria-valuemin", "" + Math.round(I)), b.setAttribute("aria-valuenow", "" + Math.round(parseInt(O)));
+      const k = Math.min(A, 100 - C), I = Math.max(w, (v.length - 1) * 100 - R), j = getFlexGrow(u, S, i);
+      b.setAttribute("aria-valuemax", "" + Math.round(k)), b.setAttribute("aria-valuemin", "" + Math.round(I)), b.setAttribute("aria-valuenow", "" + Math.round(parseInt(j)));
       const P = (T) => {
         if (!T.defaultPrevented)
           switch (T.key) {
@@ -18955,9 +18955,9 @@ function useWindowSplitterPanelGroupBehavior({
           }
       };
       b.addEventListener("keydown", P);
-      const j = getPanel(S);
-      return j != null && b.setAttribute("aria-controls", j.id), () => {
-        b.removeAttribute("aria-valuemax"), b.removeAttribute("aria-valuemin"), b.removeAttribute("aria-valuenow"), b.removeEventListener("keydown", P), j != null && b.removeAttribute("aria-controls");
+      const O = getPanel(S);
+      return O != null && b.setAttribute("aria-controls", O.id), () => {
+        b.removeAttribute("aria-valuemax"), b.removeAttribute("aria-valuemin"), b.removeAttribute("aria-valuenow"), b.removeEventListener("keydown", P), O != null && b.removeAttribute("aria-controls");
       };
     });
     return () => {
@@ -19261,7 +19261,7 @@ function PanelGroupWithForwardedRef({
       debounceMap[r] || (debounceMap[r] = debounce(savePanelGroupLayout, 100)), debounceMap[r](r, F, A, d);
     }
   }, [r, x, A, d]);
-  const O = useCallback((F, V) => {
+  const j = useCallback((F, V) => {
     const {
       panels: q
     } = I.current;
@@ -19288,7 +19288,7 @@ function PanelGroupWithForwardedRef({
       const G = new Map(q);
       return G.set(F, V), G;
     });
-  }, []), j = useCallback((F) => (q) => {
+  }, []), O = useCallback((F) => (q) => {
     q.preventDefault();
     const {
       direction: G,
@@ -19399,10 +19399,10 @@ function PanelGroupWithForwardedRef({
     collapsePanel: N,
     direction: a,
     expandPanel: L,
-    getPanelStyle: O,
+    getPanelStyle: j,
     groupId: g,
     registerPanel: P,
-    registerResizeHandle: j,
+    registerResizeHandle: O,
     resizePanel: M,
     startDragging: (F, V) => {
       if (b(F), isMouseEvent(V) || isTouchEvent(V)) {
@@ -19418,7 +19418,7 @@ function PanelGroupWithForwardedRef({
       resetGlobalCursorStyle(), b(null), S.current = null;
     },
     unregisterPanel: T
-  }), [h, N, a, L, O, g, P, j, M, T]), J = {
+  }), [h, N, a, L, j, g, P, O, M, T]), J = {
     display: "flex",
     flexDirection: a === "horizontal" ? "row" : "column",
     height: "100%",
@@ -19482,19 +19482,19 @@ function PanelResizeHandle$1({
     if (o)
       R(null);
     else {
-      const O = b(S);
-      R(() => O);
+      const j = b(S);
+      R(() => j);
     }
   }, [o, S, b]), useEffect(() => {
     if (o || C == null || !E)
       return;
-    const O = (N) => {
+    const j = (N) => {
       C(N);
     }, P = (N) => {
       C(N);
     }, T = u.current.ownerDocument;
-    return T.body.addEventListener("contextmenu", k), T.body.addEventListener("mousemove", O), T.body.addEventListener("touchmove", O), T.body.addEventListener("mouseleave", P), window.addEventListener("mouseup", k), window.addEventListener("touchend", k), () => {
-      T.body.removeEventListener("contextmenu", k), T.body.removeEventListener("mousemove", O), T.body.removeEventListener("touchmove", O), T.body.removeEventListener("mouseleave", P), window.removeEventListener("mouseup", k), window.removeEventListener("touchend", k);
+    return T.body.addEventListener("contextmenu", k), T.body.addEventListener("mousemove", j), T.body.addEventListener("touchmove", j), T.body.addEventListener("mouseleave", P), window.addEventListener("mouseup", k), window.addEventListener("touchend", k), () => {
+      T.body.removeEventListener("contextmenu", k), T.body.removeEventListener("mousemove", j), T.body.removeEventListener("touchmove", j), T.body.removeEventListener("mouseleave", P), window.removeEventListener("mouseup", k), window.removeEventListener("touchend", k);
     };
   }, [g, o, E, C, k]), useWindowSplitterResizeHandlerBehavior({
     disabled: o,
@@ -19516,8 +19516,8 @@ function PanelResizeHandle$1({
     "data-panel-resize-handle-id": S,
     onBlur: () => A(!1),
     onFocus: () => A(!0),
-    onMouseDown: (O) => {
-      x(S, O.nativeEvent);
+    onMouseDown: (j) => {
+      x(S, j.nativeEvent);
       const {
         onDragging: P
       } = d.current;
@@ -19526,8 +19526,8 @@ function PanelResizeHandle$1({
     onMouseUp: k,
     onTouchCancel: k,
     onTouchEnd: k,
-    onTouchStart: (O) => {
-      x(S, O.nativeEvent);
+    onTouchStart: (j) => {
+      x(S, j.nativeEvent);
       const {
         onDragging: P
       } = d.current;
@@ -21939,8 +21939,8 @@ function createHybrid(r, n, o, a, i, l, c, u, d, p) {
         p - E
       );
     }
-    var I = g ? o : this, O = h ? I[r] : r;
-    return E = w.length, u ? w = reorder(w, u) : x && E > 1 && w.reverse(), m && d < E && (w.length = d), this && this !== root && this instanceof S && (O = v || createCtor(O)), O.apply(I, w);
+    var I = g ? o : this, j = h ? I[r] : r;
+    return E = w.length, u ? w = reorder(w, u) : x && E > 1 && w.reverse(), m && d < E && (w.length = d), this && this !== root && this instanceof S && (j = v || createCtor(j)), j.apply(I, w);
   }
   return S;
 }
@@ -22966,19 +22966,19 @@ var Prism$1 = function() {
         for (var A = 0; A < w.length; ++A) {
           if (S && S.cause == E + "," + A)
             return;
-          var C = w[A], R = C.inside, k = !!C.lookbehind, I = !!C.greedy, O = C.alias;
+          var C = w[A], R = C.inside, k = !!C.lookbehind, I = !!C.greedy, j = C.alias;
           if (I && !C.pattern.global) {
             var P = C.pattern.toString().match(/[imsuy]*$/)[0];
             C.pattern = RegExp(C.pattern.source, P + "g");
           }
-          for (var j = C.pattern || C, T = x.next, N = v; T !== h.tail && !(S && N >= S.reach); N += T.value.length, T = T.next) {
+          for (var O = C.pattern || C, T = x.next, N = v; T !== h.tail && !(S && N >= S.reach); N += T.value.length, T = T.next) {
             var L = T.value;
             if (h.length > g.length)
               return;
             if (!(L instanceof i)) {
               var M = 1, W;
               if (I) {
-                if (W = l(j, N, g, k), !W || W.index >= g.length)
+                if (W = l(O, N, g, k), !W || W.index >= g.length)
                   break;
                 var q = W.index, J = W.index + W[0].length, F = N;
                 for (F += T.value.length; q >= F; )
@@ -22988,13 +22988,13 @@ var Prism$1 = function() {
                 for (var V = T; V !== h.tail && (F < J || typeof V.value == "string"); V = V.next)
                   M++, F += V.value.length;
                 M--, L = g.slice(N, F), W.index -= N;
-              } else if (W = l(j, 0, L, k), !W)
+              } else if (W = l(O, 0, L, k), !W)
                 continue;
               var q = W.index, G = W[0], ee = L.slice(0, q), z = L.slice(q + G.length), U = N + L.length;
               S && U > S.reach && (S.reach = U);
               var te = T.prev;
               ee && (te = d(h, te, ee), N += ee.length), p(h, te, M);
-              var _ = new i(E, R ? a.tokenize(G, R) : G, O, G);
+              var _ = new i(E, R ? a.tokenize(G, R) : G, j, G);
               if (T = d(h, te, _), z && d(h, T, z), M > 1) {
                 var Q = {
                   cause: E + "," + A,
@@ -24481,29 +24481,29 @@ prism.languages.sql = {
     }), E = 0, w = {}, A = S.map(function(I) {
       if (typeof I == "string")
         return I;
-      for (var O = I.content, P; b.indexOf(P = u(E++, v)) !== -1; )
+      for (var j = I.content, P; b.indexOf(P = u(E++, v)) !== -1; )
         ;
-      return w[P] = O, P;
+      return w[P] = j, P;
     }).join(""), C = d(A, x, v), R = Object.keys(w);
     E = 0;
     function k(I) {
-      for (var O = 0; O < I.length; O++) {
+      for (var j = 0; j < I.length; j++) {
         if (E >= R.length)
           return;
-        var P = I[O];
+        var P = I[j];
         if (typeof P == "string" || typeof P.content == "string") {
-          var j = R[E], T = typeof P == "string" ? P : (
+          var O = R[E], T = typeof P == "string" ? P : (
             /** @type {string} */
             P.content
-          ), N = T.indexOf(j);
+          ), N = T.indexOf(O);
           if (N !== -1) {
             ++E;
-            var L = T.substring(0, N), M = p(w[j]), W = T.substring(N + j.length), J = [];
+            var L = T.substring(0, N), M = p(w[O]), W = T.substring(N + O.length), J = [];
             if (L && J.push(L), J.push(M), W) {
               var F = [W];
               k(F), J.push.apply(J, F);
             }
-            typeof P == "string" ? (I.splice.apply(I, [O, 1].concat(J)), O += J.length - 1) : P.content = J;
+            typeof P == "string" ? (I.splice.apply(I, [j, 1].concat(J)), j += J.length - 1) : P.content = J;
           }
         } else {
           var V = P.content;
@@ -24536,10 +24536,10 @@ prism.languages.sql = {
           if (w.type === "template-string") {
             var C = A[1];
             if (A.length === 3 && typeof C != "string" && C.type === "embedded-code") {
-              var R = h(C), k = C.alias, I = Array.isArray(k) ? k[0] : k, O = r.languages[I];
-              if (!O)
+              var R = h(C), k = C.alias, I = Array.isArray(k) ? k[0] : k, j = r.languages[I];
+              if (!j)
                 continue;
-              A[1] = m(R, O, I);
+              A[1] = m(R, j, I);
             }
           } else
             x(A);
@@ -26008,32 +26008,32 @@ const prismDefaultProps = {
     "getPrismTheme",
     "variant"
   ]), R = v && typeof i == "string" ? i.trim() : i, k = R.split(`
-`).length.toString().length, I = useMantineTheme(), O = useClipboard(), P = x || I.colorScheme, { classes: j, cx: T } = useStyles$2({
+`).length.toString().length, I = useMantineTheme(), j = useClipboard(), P = x || I.colorScheme, { classes: O, cx: T } = useStyles$2({
     colorScheme: P,
     native: b !== ScrollArea,
     maxLineSize: k,
     radius: E
   }, { name: "Prism", classNames: u, styles: d, unstyled: S, variant: A });
   return /* @__PURE__ */ React__default.createElement(Box, __spreadProps$2(__spreadValues$2({
-    className: T(j.root, a),
+    className: T(O.root, a),
     ref: n
   }, C), {
     translate: "no"
   }), !c && /* @__PURE__ */ React__default.createElement(Tooltip, {
-    label: O.copied ? m : p,
+    label: j.copied ? m : p,
     position: "left",
     withArrow: !0,
     arrowSize: 6,
     offset: 6,
-    color: O.copied ? "teal" : void 0,
+    color: j.copied ? "teal" : void 0,
     unstyled: S
   }, /* @__PURE__ */ React__default.createElement(ActionIcon, {
-    className: j.copy,
-    "aria-label": O.copied ? m : p,
-    onClick: () => O.copy(R),
+    className: O.copy,
+    "aria-label": j.copied ? m : p,
+    onClick: () => j.copy(R),
     unstyled: S
   }, /* @__PURE__ */ React__default.createElement(CopyIcon, {
-    copied: O.copied
+    copied: j.copied
   }))), /* @__PURE__ */ React__default.createElement(Highlight$1, __spreadProps$2(__spreadValues$2({}, defaultProps), {
     theme: w(I, P),
     code: R,
@@ -26045,10 +26045,10 @@ const prismDefaultProps = {
     getLineProps: W,
     getTokenProps: J
   }) => /* @__PURE__ */ React__default.createElement(b, {
-    className: j.scrollArea,
+    className: O.scrollArea,
     dir: "ltr"
   }, /* @__PURE__ */ React__default.createElement("pre", {
-    className: T(j.code, N),
+    className: T(O.code, N),
     style: L,
     dir: "ltr"
   }, M.map((F, V) => {
@@ -26058,15 +26058,15 @@ const prismDefaultProps = {
       return null;
     const U = V + 1, te = W({ line: F, key: V }), _ = U in h, Q = P === "dark" ? I.fn.rgba(I.fn.themeColor((q = h[U]) == null ? void 0 : q.color, 9), 0.25) : I.fn.themeColor((G = h[U]) == null ? void 0 : G.color, 0);
     return /* @__PURE__ */ React__default.createElement("div", __spreadProps$2(__spreadValues$2({}, te), {
-      className: T(j.line, te.className),
+      className: T(O.line, te.className),
       style: __spreadValues$2({}, _ ? { backgroundColor: Q } : null)
     }), g && /* @__PURE__ */ React__default.createElement("div", {
-      className: j.lineNumber,
+      className: O.lineNumber,
       style: {
         color: _ ? I.fn.themeColor((ee = h[U]) == null ? void 0 : ee.color, P === "dark" ? 5 : 8) : void 0
       }
     }, ((z = h[U]) == null ? void 0 : z.label) || U), /* @__PURE__ */ React__default.createElement("div", {
-      className: j.lineContent
+      className: O.lineContent
     }, F.map((ne, re) => {
       var $, ae;
       const se = J({ token: ne, key: re });
@@ -26287,20 +26287,20 @@ var diffMatchPatch = { exports: {} };
     b[g + 1] = 0, x[g + 1] = 0;
     for (var S = d - p, E = S % 2 != 0, w = 0, A = 0, C = 0, R = 0, k = 0; k < m && !((/* @__PURE__ */ new Date()).getTime() > u); k++) {
       for (var I = -k + w; I <= k - A; I += 2) {
-        var O = g + I, P;
-        I == -k || I != k && b[O - 1] < b[O + 1] ? P = b[O + 1] : P = b[O - 1] + 1;
-        for (var j = P - I; P < d && j < p && l.charAt(P) == c.charAt(j); )
-          P++, j++;
-        if (b[O] = P, P > d)
+        var j = g + I, P;
+        I == -k || I != k && b[j - 1] < b[j + 1] ? P = b[j + 1] : P = b[j - 1] + 1;
+        for (var O = P - I; P < d && O < p && l.charAt(P) == c.charAt(O); )
+          P++, O++;
+        if (b[j] = P, P > d)
           A += 2;
-        else if (j > p)
+        else if (O > p)
           w += 2;
         else if (E) {
           var T = g + S - I;
           if (T >= 0 && T < h && x[T] != -1) {
             var N = d - x[T];
             if (P >= N)
-              return this.diff_bisectSplit_(l, c, P, j, u);
+              return this.diff_bisectSplit_(l, c, P, O, u);
           }
         }
       }
@@ -26314,11 +26314,11 @@ var diffMatchPatch = { exports: {} };
         else if (M > p)
           C += 2;
         else if (!E) {
-          var O = g + S - L;
-          if (O >= 0 && O < h && b[O] != -1) {
-            var P = b[O], j = g + P - O;
+          var j = g + S - L;
+          if (j >= 0 && j < h && b[j] != -1) {
+            var P = b[j], O = g + P - j;
             if (N = d - N, P >= N)
-              return this.diff_bisectSplit_(l, c, P, j, u);
+              return this.diff_bisectSplit_(l, c, P, O, u);
           }
         }
       }
@@ -26386,7 +26386,7 @@ var diffMatchPatch = { exports: {} };
       return null;
     var p = this;
     function m(A, C, R) {
-      for (var k = A.substring(R, R + Math.floor(A.length / 4)), I = -1, O = "", P, j, T, N; (I = C.indexOf(k, I + 1)) != -1; ) {
+      for (var k = A.substring(R, R + Math.floor(A.length / 4)), I = -1, j = "", P, O, T, N; (I = C.indexOf(k, I + 1)) != -1; ) {
         var L = p.diff_commonPrefix(
           A.substring(R),
           C.substring(I)
@@ -26394,14 +26394,14 @@ var diffMatchPatch = { exports: {} };
           A.substring(0, R),
           C.substring(0, I)
         );
-        O.length < M + L && (O = C.substring(I - M, I) + C.substring(I, I + L), P = A.substring(0, R - M), j = A.substring(R + L), T = C.substring(0, I - M), N = C.substring(I + L));
+        j.length < M + L && (j = C.substring(I - M, I) + C.substring(I, I + L), P = A.substring(0, R - M), O = A.substring(R + L), T = C.substring(0, I - M), N = C.substring(I + L));
       }
-      return O.length * 2 >= A.length ? [
+      return j.length * 2 >= A.length ? [
         P,
-        j,
+        O,
         T,
         N,
-        O
+        j
       ] : null;
     }
     var g = m(
@@ -26447,8 +26447,8 @@ var diffMatchPatch = { exports: {} };
     function c(w, A) {
       if (!w || !A)
         return 6;
-      var C = w.charAt(w.length - 1), R = A.charAt(0), k = C.match(n.nonAlphaNumericRegex_), I = R.match(n.nonAlphaNumericRegex_), O = k && C.match(n.whitespaceRegex_), P = I && R.match(n.whitespaceRegex_), j = O && C.match(n.linebreakRegex_), T = P && R.match(n.linebreakRegex_), N = j && w.match(n.blanklineEndRegex_), L = T && A.match(n.blanklineStartRegex_);
-      return N || L ? 5 : j || T ? 4 : k && !O && P ? 3 : O || P ? 2 : k || I ? 1 : 0;
+      var C = w.charAt(w.length - 1), R = A.charAt(0), k = C.match(n.nonAlphaNumericRegex_), I = R.match(n.nonAlphaNumericRegex_), j = k && C.match(n.whitespaceRegex_), P = I && R.match(n.whitespaceRegex_), O = j && C.match(n.linebreakRegex_), T = P && R.match(n.linebreakRegex_), N = O && w.match(n.blanklineEndRegex_), L = T && A.match(n.blanklineStartRegex_);
+      return N || L ? 5 : O || T ? 4 : k && !j && P ? 3 : j || P ? 2 : k || I ? 1 : 0;
     }
     for (var u = 1; u < l.length - 1; ) {
       if (l[u - 1][0] == i && l[u + 1][0] == i) {
@@ -26598,8 +26598,8 @@ var diffMatchPatch = { exports: {} };
     if (c.length > this.Match_MaxBits)
       throw new Error("Pattern too long for this browser.");
     var d = this.match_alphabet_(c), p = this;
-    function m(P, j) {
-      var T = P / c.length, N = Math.abs(u - j);
+    function m(P, O) {
+      var T = P / c.length, N = Math.abs(u - O);
       return p.Match_Distance ? T + N / p.Match_Distance : N ? 1 : T;
     }
     var g = this.Match_Threshold, h = l.indexOf(c, u);
@@ -26615,9 +26615,9 @@ var diffMatchPatch = { exports: {} };
       for (var k = C; k >= A; k--) {
         var I = d[l.charAt(k - 1)];
         if (w === 0 ? R[k] = (R[k + 1] << 1 | 1) & I : R[k] = (R[k + 1] << 1 | 1) & I | ((E[k + 1] | E[k]) << 1 | 1) | E[k + 1], R[k] & b) {
-          var O = m(w, k - 1);
-          if (O <= g)
-            if (g = O, h = k - 1, h > u)
+          var j = m(w, k - 1);
+          if (j <= g)
+            if (g = j, h = k - 1, h > u)
               A = Math.max(1, 2 * u - h);
             else
               break;
@@ -28550,7 +28550,7 @@ var require_react_is_production_min = __commonJS({
           }
         }
       }
-      var k = p, I = m, O = d, P = u, j = o, T = g, N = i, L = v, M = x, W = a, J = c, F = l, V = h, q = !1;
+      var k = p, I = m, j = d, P = u, O = o, T = g, N = i, L = v, M = x, W = a, J = c, F = l, V = h, q = !1;
       function G(Z) {
         return q || (q = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), ee(Z) || R(Z) === p;
       }
@@ -28590,7 +28590,7 @@ var require_react_is_production_min = __commonJS({
       function K(Z) {
         return R(Z) === h;
       }
-      r.AsyncMode = k, r.ConcurrentMode = I, r.ContextConsumer = O, r.ContextProvider = P, r.Element = j, r.ForwardRef = T, r.Fragment = N, r.Lazy = L, r.Memo = M, r.Portal = W, r.Profiler = J, r.StrictMode = F, r.Suspense = V, r.isAsyncMode = G, r.isConcurrentMode = ee, r.isContextConsumer = z, r.isContextProvider = U, r.isElement = te, r.isForwardRef = _, r.isFragment = Q, r.isLazy = ne, r.isMemo = re, r.isPortal = $, r.isProfiler = ae, r.isStrictMode = se, r.isSuspense = K, r.isValidElementType = C, r.typeOf = R;
+      r.AsyncMode = k, r.ConcurrentMode = I, r.ContextConsumer = j, r.ContextProvider = P, r.Element = O, r.ForwardRef = T, r.Fragment = N, r.Lazy = L, r.Memo = M, r.Portal = W, r.Profiler = J, r.StrictMode = F, r.Suspense = V, r.isAsyncMode = G, r.isConcurrentMode = ee, r.isContextConsumer = z, r.isContextProvider = U, r.isElement = te, r.isForwardRef = _, r.isFragment = Q, r.isLazy = ne, r.isMemo = re, r.isPortal = $, r.isProfiler = ae, r.isStrictMode = se, r.isSuspense = K, r.isValidElementType = C, r.typeOf = R;
     }();
   }
 }), require_react_is = __commonJS({
@@ -28734,9 +28734,9 @@ var require_react_is_production_min = __commonJS({
         arrayOf: R,
         element: k(),
         elementType: I(),
-        instanceOf: O,
+        instanceOf: j,
         node: N(),
-        objectOf: j,
+        objectOf: O,
         oneOf: P,
         oneOfType: T,
         shape: M,
@@ -28829,7 +28829,7 @@ var require_react_is_production_min = __commonJS({
         }
         return w(z);
       }
-      function O(z) {
+      function j(z) {
         function U(te, _, Q, ne, re) {
           if (!(te[_] instanceof z)) {
             var $ = z.name || x, ae = ee(te[_]);
@@ -28856,7 +28856,7 @@ var require_react_is_production_min = __commonJS({
         }
         return w(U);
       }
-      function j(z) {
+      function O(z) {
         function U(te, _, Q, ne, re) {
           if (typeof z != "function")
             return new E("Property `" + re + "` of component `" + Q + "` has invalid PropType notation inside objectOf.");
@@ -30112,12 +30112,12 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     r.greenscreen = n(k);
     var I = require_harmonic();
     r.harmonic = n(I);
-    var O = require_hopscotch();
-    r.hopscotch = n(O);
+    var j = require_hopscotch();
+    r.hopscotch = n(j);
     var P = require_isotope();
     r.isotope = n(P);
-    var j = require_marrakesh();
-    r.marrakesh = n(j);
+    var O = require_marrakesh();
+    r.marrakesh = n(O);
     var T = require_mocha();
     r.mocha = n(T);
     var N = require_monokai();
@@ -30954,10 +30954,10 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
         if (!(k in c))
           throw new Error("Unable to parse color from object: " + JSON.stringify(v));
         this.model = c[k];
-        var I = a[this.model].labels, O = [];
+        var I = a[this.model].labels, j = [];
         for (E = 0; E < I.length; E++)
-          O.push(v[I[E]]);
-        this.color = x(O);
+          j.push(v[I[E]]);
+        this.color = x(j);
       }
       if (u[this.model])
         for (w = a[this.model].channels, E = 0; E < w; E++) {
@@ -31176,7 +31176,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       ["partial", p],
       ["partialRight", m],
       ["rearg", h]
-    ], A = "[object Function]", C = "[object GeneratorFunction]", R = "[object Symbol]", k = /[\\^$.*+?()[\]{}|]/g, I = /^\s+|\s+$/g, O = /\{(?:\n\/\* \[wrapped with .+\] \*\/)?\n?/, P = /\{\n\/\* \[wrapped with (.+)\] \*/, j = /,? & /, T = /^[-+]0x[0-9a-f]+$/i, N = /^0b[01]+$/i, L = /^\[object .+?Constructor\]$/, M = /^0o[0-7]+$/i, W = /^(?:0|[1-9]\d*)$/, J = parseInt, F = typeof global == "object" && global && global.Object === Object && global, V = typeof self == "object" && self && self.Object === Object && self, q = F || V || Function("return this")();
+    ], A = "[object Function]", C = "[object GeneratorFunction]", R = "[object Symbol]", k = /[\\^$.*+?()[\]{}|]/g, I = /^\s+|\s+$/g, j = /\{(?:\n\/\* \[wrapped with .+\] \*\/)?\n?/, P = /\{\n\/\* \[wrapped with (.+)\] \*/, O = /,? & /, T = /^[-+]0x[0-9a-f]+$/i, N = /^0b[01]+$/i, L = /^\[object .+?Constructor\]$/, M = /^0o[0-7]+$/i, W = /^(?:0|[1-9]\d*)$/, J = parseInt, F = typeof global == "object" && global && global.Object === Object && global, V = typeof self == "object" && self && self.Object === Object && self, q = F || V || Function("return this")();
     function G(B, D, Y) {
       switch (Y.length) {
         case 0:
@@ -31250,10 +31250,10 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       return D && D.length > 2 ? B : void 0;
     }();
     function Pe(B) {
-      return je(B) ? Ze(B) : {};
+      return Oe(B) ? Ze(B) : {};
     }
     function ve(B) {
-      if (!je(B) || Be(B))
+      if (!Oe(B) || Be(B))
         return !1;
       var D = st(B) || re(B) ? be : L;
       return D.test(Ie(B));
@@ -31312,7 +31312,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
             return new B(D[0], D[1], D[2], D[3], D[4], D[5], D[6]);
         }
         var Y = Pe(B.prototype), oe = B.apply(Y, D);
-        return je(oe) ? oe : Y;
+        return Oe(oe) ? oe : Y;
       };
     }
     function De(B, D, Y) {
@@ -31420,11 +31420,11 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     }
     function ot(B) {
       var D = B.match(P);
-      return D ? D[1].split(j) : [];
+      return D ? D[1].split(O) : [];
     }
     function Ue(B, D) {
       var Y = D.length, oe = Y - 1;
-      return D[oe] = (Y > 1 ? "& " : "") + D[oe], D = D.join(Y > 2 ? ", " : " "), B.replace(O, `{
+      return D[oe] = (Y > 1 ? "& " : "") + D[oe], D = D.join(Y > 2 ? ", " : " "), B.replace(j, `{
 /* [wrapped with ` + D + `] */
 `);
     }
@@ -31468,16 +31468,16 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
         D & Y[1] && !z(B, oe) && B.push(oe);
       }), B.sort();
     }
-    function Oe(B, D, Y) {
+    function je(B, D, Y) {
       D = Y ? void 0 : D;
       var oe = Se(B, u, void 0, void 0, void 0, void 0, void 0, D);
-      return oe.placeholder = Oe.placeholder, oe;
+      return oe.placeholder = je.placeholder, oe;
     }
     function st(B) {
-      var D = je(B) ? Te.call(B) : "";
+      var D = Oe(B) ? Te.call(B) : "";
       return D == A || D == C;
     }
-    function je(B) {
+    function Oe(B) {
       var D = typeof B;
       return !!B && (D == "object" || D == "function");
     }
@@ -31505,9 +31505,9 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
         return B;
       if (Qe(B))
         return E;
-      if (je(B)) {
+      if (Oe(B)) {
         var D = typeof B.valueOf == "function" ? B.valueOf() : B;
-        B = je(D) ? D + "" : D;
+        B = Oe(D) ? D + "" : D;
       }
       if (typeof B != "string")
         return B === 0 ? B : +B;
@@ -31523,7 +31523,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     function Ke(B) {
       return B;
     }
-    Oe.placeholder = {}, n.exports = Oe;
+    je.placeholder = {}, n.exports = je;
   }
 });
 init_react_shim();
@@ -34088,7 +34088,37 @@ const ChooseLayout = ({ open: r, close: n }) => {
       )
     ] }) })
   ] }) });
-}, TopBar = lazy(() => import("./Topbar-Hvj7y8Yj.js")), useAutoSave = () => {
+}, HotKeys = () => {
+  const { t: r } = useTranslation(), n = {
+    "ctrl + Z": "Undo",
+    "ctrl + Y": "Redo",
+    "ctrl + D": "Duplicate"
+  }, o = {
+    // "ctrl + /": "Rename block",
+    "ctrl + S": "Save page",
+    esc: "Deselect blocks",
+    del: "Delete block"
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(Dialog, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(DialogTrigger, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip$1, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, { variant: "ghost", children: /* @__PURE__ */ jsxRuntimeExports.jsx(KeyboardIcon, {}) }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: r("Keyboard shortcuts") }) })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(DialogContent, { className: "border-border sm:max-w-[525px]", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(DialogTitle, { className: "text-foreground", children: r("Keyboard shortcuts") }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-2", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mr-8 flex flex-col space-y-2 border-r border-border", children: Object.keys(n).map((a) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-4", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Badge$1, { variant: "outline", className: "border border-border p-1 px-2", children: r(a) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-muted-foreground", children: r(n[a]) })
+        ] }, a)) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col space-y-2", children: Object.keys(o).map((a) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-4", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Badge$1, { variant: "outline", className: "border border-border p-1 px-2", children: r(a) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-muted-foreground", children: r(o[a]) })
+        ] }, a)) })
+      ] }) })
+    ] })
+  ] });
+}, TopBar = lazy(() => import("./Topbar-4sclJZrd.js")), useAutoSave = () => {
   const { savePage: r } = useSavePage(), n = useBuilderProp("autoSaveSupport", !0), o = useBuilderProp("autoSaveInterval", 60);
   useIntervalEffect(() => {
     n && r();
@@ -34149,17 +34179,13 @@ const RootLayout = () => {
                 ) }),
                 /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: p(h.label) }) })
               ] }, "button" + b)) }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip$1, { children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                  "button",
-                  {
-                    onClick: () => i(!0),
-                    className: "mb-2 rounded-lg p-2 text-gray-500 transition-colors hover:bg-primary hover:text-white",
-                    children: /* @__PURE__ */ jsxRuntimeExports.jsx(LayoutTemplate, { size: 20 })
-                  }
-                ) }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: p("Choose Builder Layout") }) })
-              ] }) })
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col space-y-1", children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip$1, { children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, { variant: "ghost", onClick: () => i(!0), children: /* @__PURE__ */ jsxRuntimeExports.jsx(LayoutTemplate, { size: 20 }) }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: p("Choose Builder Layout") }) })
+                ] }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx(HotKeys, {})
+              ] })
             ] }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               motion.div,