@chaibuilder/sdk 1.2.81 → 1.2.83

package/dist/{index-kTk1tj2l.js → index-Yjb0I-g2.js}

@@ -5,7 +5,7 @@ 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, C as ContextMenu, a as ContextMenuTrigger, b as ContextMenuContent, c as ContextMenuItem, T as Tooltip$1, d as TooltipTrigger, e as TooltipContent, B as Button$1, 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 AlertDialogTrigger, a1 as AlertDialogContent, a2 as AlertDialogHeader, a3 as AlertDialogTitle, 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-zu6r7B6f.js";
-import { has, find, filter, flatten, map, omit, isString as isString$1, includes, without, get as get$1, 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, debounce as debounce$1, isEqual, 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 { has, find, filter, flatten, map, omit, isString as isString$1, includes, without, get as get$1, 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, debounce as debounce$1, isEqual, 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, compact } 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";
 import { getBlockComponent, getChaiDataProviders, useGlobalStylingPresets, useChaiBlocks, syncBlocksWithDefaults } from "@chaibuilder/runtime";
@@ -34,7 +34,7 @@ import { Resizable } from "re-resizable";
 import validator from "@rjsf/validator-ajv8";
 import Form from "@rjsf/core";
 import { Tree } from "react-arborist";
-import { DatabaseIcon, PlusIcon as PlusIcon$1, EditIcon, TrashIcon as TrashIcon$1, Check, Loader as Loader$1, SparklesIcon, SmileIcon, ShuffleIcon, ChevronDown, Edit2, X, Layers, PaintBucketIcon } from "lucide-react";
+import { DatabaseIcon, PlusIcon as PlusIcon$1, EditIcon, TrashIcon as TrashIcon$1, Check, Loader as Loader$1, SparklesIcon, SmileIcon, ShuffleIcon, ChevronDown, Edit2, X, LayoutTemplate, Layers, PaintBucketIcon } from "lucide-react";
 import { parse as parse$1, stringify as stringify$3 } from "himalaya";
 import IconPicker, { IconPickerItem } from "react-icons-picker";
 import Autosuggest from "react-autosuggest";
@@ -130,7 +130,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
                 D,
                 T
               );
-              resolvePromise(D, V), W(V), (q == null ? void 0 : q.d) !== G.d && R(k, G, q == null ? void 0 : q.d);
+              resolvePromise(D, V), W(V), (q == null ? void 0 : q.d) !== G.d && C(k, G, q == null ? void 0 : q.d);
             }
           },
           (V) => {
@@ -141,7 +141,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
                 D,
                 T
               );
-              rejectPromise(D, V), J(V), (q == null ? void 0 : q.d) !== G.d && R(k, G, q == null ? void 0 : q.d);
+              rejectPromise(D, V), J(V), (q == null ? void 0 : q.d) !== G.d && C(k, G, q == null ? void 0 : q.d);
             }
           }
         ), L = (V) => {
@@ -194,7 +194,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
       get setSelf() {
         return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && !isActuallyWritableAtom(k) && console.warn("setSelf function cannot be used with read-only atom"), !W && isActuallyWritableAtom(k) && (W = (...F) => {
           if ((define_import_meta_env_default$2 ? "production" : void 0) !== "production" && B && console.warn("setSelf function cannot be called in sync"), !B)
-            return C(k, ...F);
+            return R(k, ...F);
         }), W;
       }
     };
@@ -267,7 +267,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
       return F;
     }, D = k.write(B, L, ...O);
     return T = !1, D;
-  }, C = (k, ...O) => {
+  }, R = (k, ...O) => {
     const T = w(k, ...O), B = I();
     return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && i.forEach(
       (L) => L({ type: "write", flushed: B })
@@ -281,7 +281,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
       const D = n.get(L);
       D ? D.t.add(k) : L !== k && P(L, k);
     }), h(k), isActuallyWritableAtom(k) && k.onMount) {
-      const B = k.onMount((...L) => C(k, ...L));
+      const B = k.onMount((...L) => R(k, ...L));
       B && (T.u = B);
     }
     return T;
@@ -296,7 +296,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
         W && (W.t.delete(k), v(D, W) && A(D));
       }
     })) : (define_import_meta_env_default$2 ? "production" : void 0) !== "production" && console.warn("[Bug] could not find atom state to unmount", k);
-  }, R = (k, O, T) => {
+  }, C = (k, O, T) => {
     const B = new Set(O.d.keys());
     T == null || T.forEach((L, D) => {
       if (B.has(D)) {
@@ -316,7 +316,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
       o.clear(), O.forEach(([T, B]) => {
         const L = c(T);
         if (L) {
-          L.d !== (B == null ? void 0 : B.d) && R(T, L, B == null ? void 0 : B.d);
+          L.d !== (B == null ? void 0 : B.d) && C(T, L, B == null ? void 0 : B.d);
           const D = n.get(T);
           D && !// TODO This seems pretty hacky. Hope to fix it.
           // Maybe we could `mountDependencies` in `setAtomState`?
@@ -337,7 +337,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
   };
   return (define_import_meta_env_default$2 ? "production" : void 0) !== "production" ? {
     get: b,
-    set: C,
+    set: R,
     sub: j,
     // store dev methods (these are tentative and subject to change without notice)
     dev_subscribe_store: (k, O) => O !== 2 ? (console.warn(
@@ -360,7 +360,7 @@ const hasInitialValue = (r) => "init" in r, isActuallyWritableAtom = (r) => !!r.
     }
   } : {
     get: b,
-    set: C,
+    set: R,
     sub: j
   };
 };
@@ -388,23 +388,23 @@ function splitAtom(r, n) {
             return;
           }
           const S = (w) => {
-            const C = w(i), P = w(r), R = a(P, C == null ? void 0 : C.arr).keyList.indexOf(x);
-            if (R < 0 || R >= P.length) {
+            const R = w(i), P = w(r), C = a(P, R == null ? void 0 : R.arr).keyList.indexOf(x);
+            if (C < 0 || C >= P.length) {
               const I = c[a(c).keyList.indexOf(x)];
               if (I)
                 return I;
               throw new Error("splitAtom: index out of bounds for read");
             }
-            return P[R];
-          }, E = (w, C, P) => {
-            const A = w(i), R = w(r), j = a(R, A == null ? void 0 : A.arr).keyList.indexOf(x);
-            if (j < 0 || j >= R.length)
+            return P[C];
+          }, E = (w, R, P) => {
+            const A = w(i), C = w(r), j = a(C, A == null ? void 0 : A.arr).keyList.indexOf(x);
+            if (j < 0 || j >= C.length)
               throw new Error("splitAtom: index out of bounds for write");
-            const k = isFunction$1(P) ? P(R[j]) : P;
-            C(r, [
-              ...R.slice(0, j),
+            const k = isFunction$1(P) ? P(C[j]) : P;
+            R(r, [
+              ...C.slice(0, j),
               k,
-              ...R.slice(j + 1)
+              ...C.slice(j + 1)
             ]);
           };
           m[b] = isWritable(r) ? atom(S, E) : atom(S);
@@ -1216,13 +1216,13 @@ const useBlocksStoreManager = () => {
   } = useBlocksStoreManager();
   return {
     moveBlocks: (x, v, S) => {
-      const E = map(x, (C) => {
-        const A = n.find((j) => j._id === C)._parent || null, I = n.filter((j) => A ? j._parent === A : !j._parent).map((j) => j._id).indexOf(C);
-        return { _id: C, oldParent: A, oldPosition: I };
-      }), w = E.find(({ _id: C }) => C === x[0]);
+      const E = map(x, (R) => {
+        const A = n.find((j) => j._id === R)._parent || null, I = n.filter((j) => A ? j._parent === A : !j._parent).map((j) => j._id).indexOf(R);
+        return { _id: R, oldParent: A, oldPosition: I };
+      }), w = E.find(({ _id: R }) => R === x[0]);
       w && w.oldParent === v && w.oldPosition === S || (l(x, v, S), r({
-        undo: () => each(E, ({ _id: C, oldParent: P, oldPosition: A }) => {
-          l([C], P, A);
+        undo: () => each(E, ({ _id: R, oldParent: P, oldPosition: A }) => {
+          l([R], P, A);
         }),
         redo: () => l(x, v, S)
       }));
@@ -1235,7 +1235,7 @@ const useBlocksStoreManager = () => {
     },
     removeBlocks: (x) => {
       var w;
-      const v = (w = first(x)) == null ? void 0 : w._parent, E = n.filter((C) => v ? C._parent === v : !C._parent).indexOf(first(x));
+      const v = (w = first(x)) == null ? void 0 : w._parent, E = n.filter((R) => v ? R._parent === v : !R._parent).indexOf(first(x));
       i(map(x, "_id")), r({
         undo: () => a(x, v, E),
         redo: () => i(map(x, "_id"))
@@ -1247,9 +1247,9 @@ const useBlocksStoreManager = () => {
         E = map(x, (w) => ({ _id: w, ...S }));
       else {
         const w = keys(v);
-        E = map(x, (C) => {
-          const P = n.find((R) => R._id === C), A = { _id: C };
-          return each(w, (R) => A[R] = P[R]), A;
+        E = map(x, (R) => {
+          const P = n.find((C) => C._id === R), A = { _id: R };
+          return each(w, (C) => A[C] = P[C]), A;
         });
       }
       c(map(x, (w) => ({ _id: w, ...v }))), r({
@@ -1269,8 +1269,8 @@ const useBlocksStoreManager = () => {
     updateMultipleBlocksProps: (x) => {
       let v = [];
       v = map(x, (S) => {
-        const E = keys(S), w = n.find((P) => P._id === S._id), C = {};
-        return each(E, (P) => C[P] = w[P]), C;
+        const E = keys(S), w = n.find((P) => P._id === S._id), R = {};
+        return each(E, (P) => R[P] = w[P]), R;
       }), c(x), r({
         undo: () => c(v),
         redo: () => c(x)
@@ -2782,7 +2782,14 @@ const useReadOnlyMode = () => useAtomValue$1(readOnlyModeAtom), activePanelAtom
     }
   }, []);
   return [r, o];
-}, codeEditorAtom = atom$1(null), useCodeEditor = () => useAtom$1(codeEditorAtom), IframeInitialContent = `<!doctype html>
+}, codeEditorAtom = atom$1(null), useCodeEditor = () => useAtom$1(codeEditorAtom), LAYOUT_VARIANTS = {
+  SINGLE_SIDE_PANEL: "SINGLE_SIDE_PANEL",
+  DUAL_SIDE_PANEL: "DUAL_SIDE_PANEL",
+  DUAL_SIDE_PANEL_ADVANCED: "DUAL_SIDE_PANEL_ADVANCED"
+}, layoutVariantAtom = atomWithStorage("__layout_variant", LAYOUT_VARIANTS.SINGLE_SIDE_PANEL), useLayoutVariant = () => {
+  const [r, n] = useAtom$1(layoutVariantAtom), o = useBuilderProp("layoutVariant", LAYOUT_VARIANTS.SINGLE_SIDE_PANEL);
+  return [r || o, n];
+}, IframeInitialContent = `<!doctype html>
 <html lang="en" dir="__HTML_DIR__" class="scroll-smooth h-full overflow-y-auto">
   <head>
     <meta charset="UTF-8">
@@ -3033,8 +3040,8 @@ const useDnd = () => {
       g.preventDefault(), g.stopPropagation(), throttledDragOver(g);
     },
     onDrop: (g) => {
-      var C;
-      const h = dropTarget, x = getOrientation(h) === "vertical" ? g.clientY + ((C = iframeDocument == null ? void 0 : iframeDocument.defaultView) == null ? void 0 : C.scrollY) : g.clientX;
+      var R;
+      const h = dropTarget, x = getOrientation(h) === "vertical" ? g.clientY + ((R = iframeDocument == null ? void 0 : iframeDocument.defaultView) == null ? void 0 : R.scrollY) : g.clientX;
       dropIndex = calculateDropIndex(x, possiblePositions);
       const v = u, S = h.getAttribute("data-block-id"), E = dropTarget.getAttribute("data-dnd-dragged") !== "yes";
       if ((v == null ? void 0 : v._id) === S || !E) {
@@ -3264,12 +3271,12 @@ const useHandleCanvasDblClick = () => {
   }, [a, d]);
   const x = get$1(n, "headingFont", "DM Sans"), v = get$1(n, "bodyFont", "DM Sans");
   return useEffect$1(() => {
-    const S = get$1(n, "primaryColor", "#000"), E = get$1(n, "secondaryColor", "#FFF"), w = get$1(n, "bodyBgLightColor", "#fff"), C = get$1(n, "bodyBgDarkColor", "#000"), P = get$1(n, "bodyTextDarkColor", "#000"), A = get$1(n, "bodyTextLightColor", "#fff"), R = getPalette([
+    const S = get$1(n, "primaryColor", "#000"), E = get$1(n, "secondaryColor", "#FFF"), w = get$1(n, "bodyBgLightColor", "#fff"), R = get$1(n, "bodyBgDarkColor", "#000"), P = get$1(n, "bodyTextDarkColor", "#000"), A = get$1(n, "bodyTextLightColor", "#fff"), C = getPalette([
       { color: S, name: "primary" },
       { color: E, name: "secondary" }
     ]), I = {
       "bg-light": w,
-      "bg-dark": C,
+      "bg-dark": R,
       "text-dark": P,
       "text-light": A
     }, j = get$1(n, "roundedCorners", "0");
@@ -3291,7 +3298,7 @@ const useHandleCanvasDblClick = () => {
           borderRadius: {
             DEFAULT: `${j || "0"}px`
           },
-          colors: { ...I, ...R }
+          colors: { ...I, ...C }
         }
       },
       plugins: [
@@ -3419,10 +3426,10 @@ function BlocksRendererStatic({ blocks: r }) {
       const E = getBlockComponent(h._type), w = get$1(E, "builderComponent", get$1(E, "component", null));
       if (isNull(w))
         return /* @__PURE__ */ jsxRuntimeExports.jsx("noscript", { children: `<!-- ${h == null ? void 0 : h._type} not registered -->` });
-      const C = has(E, "getBlockStateFrom") ? E == null ? void 0 : E.getBlockStateFrom(h, n) : [], P = g(C), A = d(h);
+      const R = has(E, "getBlockStateFrom") ? E == null ? void 0 : E.getBlockStateFrom(h, n) : [], P = g(R), A = d(h);
       if (get$1(A, "__isHidden", !1) && !includes(o, h._id))
         return null;
-      const R = i && isDescendant(i._id, h._id, n);
+      const C = i && isDescendant(i._id, h._id, n);
       return /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { children: React__default.createElement(w, {
         blockProps: {
           ...includes(o, h._id) ? { "force-show": "" } : {},
@@ -3432,10 +3439,10 @@ function BlocksRendererStatic({ blocks: r }) {
             // @ts-ignore
             {
               "data-dnd": canAcceptChildBlock(h._type, i == null ? void 0 : i._type) ? "yes" : "no",
-              "data-dnd-dragged": i._id === h._id || R ? "yes" : "no"
+              "data-dnd-dragged": i._id === h._id || C ? "yes" : "no"
             }
           ) : {},
-          ...l === h._id && !R ? { "data-drop": "yes" } : {},
+          ...l === h._id && !C ? { "data-drop": "yes" } : {},
           ...includes(a, h._id) ? { "data-cut-block": "yes" } : {}
         },
         index: b,
@@ -3494,23 +3501,23 @@ const useAllDataProviders = () => useMemo$1(() => getChaiDataProviders(), []), B
   }, []), /* @__PURE__ */ jsxRuntimeExports.jsx("div", { id: "main-content", className: "h-full w-full p-10 pb-0", ref: a, children: r });
 }, getElementByStyleId = (r, n) => r.querySelector(`[data-style-id="${n}"]`), StaticCanvas = () => {
   const [r] = useAtom$1(networkModeAtom), [n] = useCanvasWidth(), [, o] = useSelectedBlockIds(), a = useSelectedBlock(), [, i] = useHighlightBlockId(), l = useRef$1(null), c = useRef$1(null), [u, d] = useState$1({ width: 0, height: 0 }), p = useCanvasScale(u), [m, g] = useState$1([]), [, h] = useState$1([]), [, b] = useAtom$1(canvasIframeAtom), [x, v] = useSelectedStylingBlocks(), S = useBuilderProp("loading", !1), E = useBuilderProp("htmlDir", "ltr"), w = (A) => {
-    d((R) => ({ ...R, width: A }));
+    d((C) => ({ ...C, width: A }));
   };
   useEffect$1(() => {
     if (!c.current)
       return;
-    const { clientWidth: A, clientHeight: R } = c.current;
-    d({ width: A, height: R });
+    const { clientWidth: A, clientHeight: C } = c.current;
+    d({ width: A, height: C });
   }, [c, n]);
-  const C = (A, R = 0) => {
+  const R = (A, C = 0) => {
     const { top: I } = A.getBoundingClientRect();
-    return I + R >= 0 && I - R <= window.innerHeight;
+    return I + C >= 0 && I - C <= window.innerHeight;
   };
   useEffect$1(() => {
-    var A, R;
+    var A, C;
     if (a && a.type !== "Multiple" && l.current) {
       const I = getElementByDataBlockId(l.current.contentDocument, a._id);
-      I && (C(I) || (R = (A = l.current) == null ? void 0 : A.contentWindow) == null || R.scrollTo({ top: I.offsetTop, behavior: "smooth" }), g([I]));
+      I && (R(I) || (C = (A = l.current) == null ? void 0 : A.contentWindow) == null || C.scrollTo({ top: I.offsetTop, behavior: "smooth" }), g([I]));
     }
   }, [a]), useEffect$1(() => {
     if (!isEmpty(x) && l.current) {
@@ -3579,7 +3586,7 @@ const useAllDataProviders = () => useMemo$1(() => getChaiDataProviders(), []), B
 }, StaticCanvas$1 = StaticCanvas, FallbackError = () => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full w-full rounded-md bg-red-200 p-4 text-red-500", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full w-full flex-col items-center justify-center", children: [
   /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "font-semibold", children: "Oops! Something went wrong." }),
   /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: "Please try again." })
-] }) }), CodeEditor$1 = React__default.lazy(() => import("./CodeEditor-u-gDiPZ2.js")), CanvasArea = () => {
+] }) }), CodeEditor$1 = React__default.lazy(() => import("./CodeEditor-1Hftwojo.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, {}) }) }),
@@ -3657,8 +3664,8 @@ const useAllDataProviders = () => useMemo$1(() => getChaiDataProviders(), []), B
   React.useEffect(() => () => {
     isEqual(a, c.current) || o(c.current);
   }, []);
-  const d = ({ formData: A }, R) => {
-    R && (i(A), c.current = A);
+  const d = ({ formData: A }, C) => {
+    C && (i(A), c.current = A);
   }, {
     bodyFont: p,
     headingFont: m,
@@ -3707,13 +3714,13 @@ const useAllDataProviders = () => useMemo$1(() => getChaiDataProviders(), []), B
       default: b
     })
   });
-  const C = {
+  const R = {
     type: "object",
     properties: {}
   }, P = {};
   return Object.keys(w).forEach((A) => {
-    const R = w[A];
-    return C.properties || (C.properties = {}), C.properties[A] = R.schema, P[A] = R.uiSchema, !0;
+    const C = w[A];
+    return R.properties || (R.properties = {}), R.properties[A] = C.schema, P[A] = C.uiSchema, !0;
   }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("flex h-full w-full select-none flex-col", n), children: [
     r ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md bg-background/30 p-1", children: /* @__PURE__ */ jsxRuntimeExports.jsx("h1", { className: "px-1 font-semibold", children: u("Theme Configuration") }) }) : null,
     /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -3726,7 +3733,7 @@ const useAllDataProviders = () => useMemo$1(() => getChaiDataProviders(), []), B
         liveOmit: !0,
         liveValidate: !0,
         uiSchema: P,
-        schema: C,
+        schema: R,
         formData: a,
         validator,
         onChange: d
@@ -3980,17 +3987,17 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
     }, 500);
     return () => clearTimeout(A);
   }, [g, r, h]);
-  const C = useMemo$1(() => {
-    const A = Object.keys(p), R = [];
+  const R = useMemo$1(() => {
+    const A = Object.keys(p), C = [];
     for (let I = 0; I < A.length; I++)
       if (A[I].endsWith("_attrs")) {
         const j = p[A[I]], k = Object.keys(j).join("|");
-        k.match(/x-data/) && R.push("data"), k.match(/x-on/) && R.push("event"), k.match(/x-show|x-if/) && R.push("show");
+        k.match(/x-data/) && C.push("data"), k.match(/x-on/) && C.push("event"), k.match(/x-show|x-if/) && C.push("show");
       }
-    return R;
-  }, [p]), P = (A, R) => {
+    return C;
+  }, [p]), P = (A, C) => {
     const I = l.contentDocument || l.contentWindow.document, j = I.querySelector(`[data-block-id=${A}]`);
-    j && j.setAttribute("data-drop", R);
+    j && j.setAttribute("data-drop", C);
     const k = j.getBoundingClientRect(), O = l.getBoundingClientRect();
     k.top >= O.top && k.left >= O.left && k.bottom <= O.bottom && k.right <= O.right || (I.documentElement.scrollTop = j.offsetTop - O.top);
   };
@@ -4048,9 +4055,9 @@ const Node = memo(({ node: r, style: n, dragHandle: o }) => {
                 },
                 children: [
                   /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: (p == null ? void 0 : p._name) || (p == null ? void 0 : p._type.split("/").pop()) }),
-                  C.includes("data") && /* @__PURE__ */ jsxRuntimeExports.jsx(VscJson, { className: "h-3 w-3 text-orange-600" }),
-                  C.includes("event") && /* @__PURE__ */ jsxRuntimeExports.jsx(BsLightningFill, { className: "h-3 w-3 text-yellow-500" }),
-                  C.includes("show") && /* @__PURE__ */ jsxRuntimeExports.jsx(TbEyeDown, { className: "h-3 w-3 text-orange-600" })
+                  R.includes("data") && /* @__PURE__ */ jsxRuntimeExports.jsx(VscJson, { className: "h-3 w-3 text-orange-600" }),
+                  R.includes("event") && /* @__PURE__ */ jsxRuntimeExports.jsx(BsLightningFill, { className: "h-3 w-3 text-yellow-500" }),
+                  R.includes("show") && /* @__PURE__ */ jsxRuntimeExports.jsx(TbEyeDown, { className: "h-3 w-3 text-orange-600" })
                 ]
               }
             )
@@ -4463,7 +4470,7 @@ function ExpandableObject(r) {
   useEffect$1(() => {
     g.current ? x(p(u, o, n)) : g.current = !0;
   }, [p]);
-  const v = h ? d.collapseIcon : d.expandIcon, S = h ? "collapse JSON" : "expand JSON", E = useComponentId(), w = u + 1, C = a.length - 1, P = (A) => {
+  const v = h ? d.collapseIcon : d.expandIcon, S = h ? "collapse JSON" : "expand JSON", E = useComponentId(), w = u + 1, R = a.length - 1, P = (A) => {
     A.key === " " && (A.preventDefault(), b());
   };
   return /* @__PURE__ */ createElement$1("div", {
@@ -4490,12 +4497,12 @@ function ExpandableObject(r) {
     className: d.punctuation
   }, l), h ? /* @__PURE__ */ createElement$1("div", {
     id: E
-  }, a.map((A, R) => /* @__PURE__ */ createElement$1(DataRender, {
-    key: A[0] || R,
+  }, a.map((A, C) => /* @__PURE__ */ createElement$1(DataRender, {
+    key: A[0] || C,
     field: A[0],
     value: A[1],
     style: d,
-    lastElement: R === C,
+    lastElement: C === R,
     level: w,
     shouldExpandNode: p,
     clickToExpandNode: m
@@ -4976,7 +4983,7 @@ const ViewData = ({ data: r, fullView: n }) => {
       }
     )
   ] });
-}, UnsplashImages = React__default.lazy(() => import("./UnsplashImages-gys3oUzE.js")), UploadImages = React__default.lazy(() => import("./UploadImages-EQnGq0Zj.js")), ImagesPanel = ({
+}, UnsplashImages = React__default.lazy(() => import("./UnsplashImages-umIxGYt_.js")), UploadImages = React__default.lazy(() => import("./UploadImages-0lyXeo9Q.js")), ImagesPanel = ({
   isModalView: r = !1,
   onSelect: n = () => {
   }
@@ -5453,10 +5460,10 @@ const AskAIStyles = ({ blockId: r }) => {
 function ManualClasses() {
   var A;
   const { t: r } = useTranslation(), [n] = useSelectedStylingBlocks(), o = useSelectedBlock(), a = useAddClassesToBlocks(), i = useRemoveClassesFromBlocks(), [l] = useSelectedBlockIds(), c = useBuilderProp("askAiCallBack", null), [u, d] = useState$1(""), { toast: p } = useToast(), m = (A = first(n)) == null ? void 0 : A.prop, g = reject((get$1(o, m, "").replace(STYLES_KEY, "").split(",").pop() || "").split(" "), isEmpty), h = () => {
-    const R = u.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
-    a(l, R, !0), d("");
-  }, [b, x] = useState$1([]), v = ({ value: R }) => {
-    const I = R.trim().toLowerCase(), j = I.match(/.+:/g);
+    const C = u.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
+    a(l, C, !0), d("");
+  }, [b, x] = useState$1([]), v = ({ value: C }) => {
+    const I = C.trim().toLowerCase(), j = I.match(/.+:/g);
     let k = [];
     if (j && j.length > 0) {
       const [O] = j, T = I.replace(O, "");
@@ -5469,17 +5476,17 @@ function ManualClasses() {
     return x(map(k, "item"));
   }, S = () => {
     x([]);
-  }, E = (R) => R.name, w = (R) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md p-1", children: R.name }), C = {
+  }, E = (C) => C.name, w = (C) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md p-1", children: C.name }), R = {
     autoComplete: "off",
     autoCorrect: "off",
     autoCapitalize: "off",
     spellCheck: !1,
     placeholder: r("enter_classes_separated_by_space"),
     value: u,
-    onKeyDown: (R) => {
-      R.key === "Enter" && u.trim() !== "" && h();
+    onKeyDown: (C) => {
+      C.key === "Enter" && u.trim() !== "" && h();
     },
-    onChange: (R, { newValue: I }) => d(I),
+    onChange: (C, { newValue: I }) => d(I),
     className: "w-full rounded-md text-xs px-2 hover:outline-0 bg-background border-border py-1"
   }, P = () => {
     if (navigator.clipboard === void 0) {
@@ -5525,7 +5532,7 @@ function ManualClasses() {
               onSuggestionsClearRequested: S,
               getSuggestionValue: E,
               renderSuggestion: w,
-              inputProps: C,
+              inputProps: R,
               containerProps: {
                 className: "relative h-8 w-full gap-y-1 py-1 border-gray-600"
               },
@@ -5549,22 +5556,22 @@ function ManualClasses() {
           )
         ] }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex w-full flex-wrap gap-2 overflow-x-hidden", children: React.Children.toArray(
-          g.map((R) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          g.map((C) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "div",
             {
               className: "group relative flex max-w-[260px] cursor-default items-center gap-x-1 truncate rounded border border-gray-300 bg-gray-200 p-px px-1.5 text-[11px] text-gray-600 hover:border-gray-300",
               children: [
-                R,
+                C,
                 /* @__PURE__ */ jsxRuntimeExports.jsx(
                   Cross2Icon,
                   {
-                    onClick: () => i(l, [R]),
+                    onClick: () => i(l, [C]),
                     className: "invisible absolute right-1 rounded-full bg-red-400 hover:text-white group-hover:visible group-hover:cursor-pointer"
                   }
                 )
               ]
             },
-            R
+            C
           ))
         ) })
       ]
@@ -6214,7 +6221,7 @@ const RangeChoices = ({ property: r, onChange: n }) => {
   },
   a
 )) }), 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), [C, P] = useState$1(!1);
+  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), [R, P] = useState$1(!1);
   useEffect$1(() => {
     const { value: k, unit: O } = getClassValueAndUnit(l);
     if (O === "") {
@@ -6223,7 +6230,7 @@ const RangeChoices = ({ property: r, onChange: n }) => {
     }
     h(O), i(O === "class" || isEmpty(k) ? "" : k);
   }, [l, d, p]);
-  const A = useThrottledCallback((k) => c(k), [c], THROTTLE_TIME), R = useThrottledCallback((k) => c(k, !1), [c], THROTTLE_TIME), I = useCallback$1(
+  const A = useThrottledCallback((k) => c(k), [c], THROTTLE_TIME), C = useThrottledCallback((k) => c(k, !1), [c], THROTTLE_TIME), I = useCallback$1(
     (k = !1) => {
       const O = getUserInputValues(`${a}`, p);
       if (get$1(O, "error", !1)) {
@@ -6238,9 +6245,9 @@ const RangeChoices = ({ property: r, onChange: n }) => {
       if (get$1(O, "value") === "")
         return;
       const L = `${get$1(O, "value", "").startsWith("-") ? "-" : ""}${u}[${get$1(O, "value", "").replace("-", "")}${T === "-" ? "" : T}]`;
-      k ? R(L) : A(L);
+      k ? C(L) : A(L);
     },
-    [A, R, a, g, u, p]
+    [A, C, a, g, u, p]
   ), j = useCallback$1(
     (k) => {
       const O = getUserInputValues(`${a}`, p);
@@ -6282,10 +6289,10 @@ const RangeChoices = ({ property: r, onChange: n }) => {
             let T = isNaN$1(O) ? 0 : O;
             k.keyCode === 38 && (T += 1), k.keyCode === 40 && (T -= 1);
             const B = `${T}`, D = `${B.startsWith("-") ? "-" : ""}${u}[${B.replace("-", "")}${g === "-" ? "" : g}]`;
-            R(D);
+            C(D);
           },
           onKeyUp: (k) => {
-            C && (k.preventDefault(), P(!1));
+            R && (k.preventDefault(), P(!1));
           },
           onBlur: () => I(),
           onChange: (k) => {
@@ -6342,7 +6349,7 @@ const RangeChoices = ({ property: r, onChange: n }) => {
             return;
           S(k);
           const O = `${k}`, B = `${O.startsWith("-") ? "-" : ""}${u}[${O.replace("-", "")}${g === "-" ? "" : g}]`;
-          R(B);
+          C(B);
         },
         currentValue: a,
         unit: g,
@@ -6440,8 +6447,8 @@ const RangeChoices = ({ property: r, onChange: n }) => {
 }, getBreakpoint = (r) => `${r.toUpperCase()} ${BREAKPOINTS[r] ? `(${BREAKPOINTS[r]} & up)` : ""}`, BlockStyle = (r) => {
   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(
-    (R, I = !0) => {
-      const j = { dark: d, mq: m, mod: p, cls: R, property: i, fullCls: "" };
+    (C, I = !0) => {
+      const j = { dark: d, mq: m, mod: p, cls: C, property: i, fullCls: "" };
       (d || p !== "") && (j.mq = "xs");
       const k = generateFullClsName(j);
       h(x, [k], I);
@@ -6453,18 +6460,18 @@ const RangeChoices = ({ property: r, onChange: n }) => {
   useEffect$1(() => {
     l(w, g);
   }, [w, l, g]);
-  const [, , C] = useCanvasWidth(), P = useCallback$1(
-    (R) => {
-      C({
+  const [, , R] = useCanvasWidth(), P = useCallback$1(
+    (C) => {
+      R({
         xs: 400,
         sm: 640,
         md: 800,
         lg: 1024,
         xl: 1420,
         "2xl": 1920
-      }[R]);
+      }[C]);
     },
-    [C]
+    [R]
   ), A = get$1(g, "dark", null) === d && get$1(g, "mod", null) === p && get$1(g, "mq", null) === m;
   return /* @__PURE__ */ jsxRuntimeExports.jsx(BlockStyleProvider, { canChange: w, canReset: g && A, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "group flex flex-row items-center py-2 first:pt-0 last:pb-0", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative w-[70px] truncate text-xs text-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-[11px] ${g && !A ? "text-foreground" : ""}`, children: n(a) }) }),
@@ -6781,15 +6788,15 @@ const BlockCard = ({
     const E = await l(n, r);
     let w = o;
     if (b(first(E)) && (w = null), !isEmpty(E)) {
-      const C = { blocks: E, uiLibrary: !0, parent: w };
-      if (S.dataTransfer.setData("text/plain", JSON.stringify(C)), r.preview) {
+      const R = { blocks: E, uiLibrary: !0, parent: w };
+      if (S.dataTransfer.setData("text/plain", JSON.stringify(R)), r.preview) {
         const P = new Image();
         P.src = r.preview, P.onload = () => {
           S.dataTransfer.setDragImage(P, 0, 0);
         };
       } else
         S.dataTransfer.setDragImage(new Image(), 0, 0);
-      h(C), setTimeout(() => {
+      h(R), setTimeout(() => {
         d([]), p(null), emitChaiBuilderMsg({ name: CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK });
       }, 200);
     }
@@ -6840,7 +6847,7 @@ const BlockCard = ({
       /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { className: "col-span-3 h-full" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { className: "col-span-9 h-full" })
     ] });
-  const S = filter(h, (w, C) => C % 2 === 0), E = filter(h, (w, C) => C % 2 === 1);
+  const S = filter(h, (w, R) => R % 2 === 0), E = filter(h, (w, R) => R % 2 === 1);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative mt-2 flex h-full max-h-full overflow-hidden bg-background", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full pt-2", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full max-h-full w-60 flex-col gap-1 px-1 pr-2", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(UILibrariesSelect, { library: c == null ? void 0 : c.uuid, setLibrary: o, uiLibraries: a }),
@@ -6848,22 +6855,22 @@ const BlockCard = ({
         /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs font-bold text-gray-500", children: x("groups") }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("hr", { className: "mt-1" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "no-scrollbar mt-2 h-full max-h-full flex-1 overflow-y-auto pb-20", children: React__default.Children.toArray(
-          map(p, (w, C) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          map(p, (w, R) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "div",
             {
-              onMouseEnter: () => v(C),
+              onMouseEnter: () => v(R),
               onMouseLeave: () => clearTimeout(b.current),
-              onClick: () => g(C),
+              onClick: () => g(R),
               className: cn(
                 "flex w-full cursor-pointer items-center justify-between rounded-md p-2 text-sm transition-all ease-in-out hover:bg-gray-200",
-                C === m ? "bg-blue-500 text-white hover:bg-blue-600" : ""
+                R === m ? "bg-blue-500 text-white hover:bg-blue-600" : ""
               ),
               children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: capitalize(x(C.toLowerCase())) }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: capitalize(x(R.toLowerCase())) }),
                 /* @__PURE__ */ jsxRuntimeExports.jsx(CaretRightIcon, { className: "ml-2 h-5 w-5" })
               ]
             },
-            C
+            R
           ))
         ) })
       ] })
@@ -7693,7 +7700,7 @@ const AIUserPrompt = ({ blockId: r }) => {
       o(P), i(a), c(""), d(""), h("");
     }
   }, S = (P) => {
-    const A = a.filter((R, I) => I !== P);
+    const A = a.filter((C, I) => I !== P);
     o(A), i(A);
   }, E = (P) => {
     m(P), c(a[P].key), d(a[P].value);
@@ -7706,7 +7713,7 @@ const AIUserPrompt = ({ blockId: r }) => {
       const P = [...a];
       P[p] = { key: l, value: u }, o(P), i(P), m(null), c(""), d(""), h("");
     }
-  }, C = (P) => {
+  }, R = (P) => {
     P.key === "Enter" && !P.shiftKey && (P.preventDefault(), p !== null ? w() : v());
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-full", children: [
@@ -7749,7 +7756,7 @@ const AIUserPrompt = ({ blockId: r }) => {
                   ref: x,
                   value: u,
                   onChange: (P) => d(P.target.value),
-                  onKeyDown: C,
+                  onKeyDown: R,
                   placeholder: "Value",
                   className: "bg-background text-sm"
                 }
@@ -7851,8 +7858,8 @@ function useAtomsSnapshot({
       for (const w of ((v = o.dev_get_mounted_atoms) == null ? void 0 : v.call(o)) || []) {
         if (!r && w.debugPrivate)
           continue;
-        const C = (S = o.dev_get_atom_state) == null ? void 0 : S.call(o, w);
-        C && "v" in C && h.set(w, C.v);
+        const R = (S = o.dev_get_atom_state) == null ? void 0 : S.call(o, w);
+        R && "v" in R && h.set(w, R.v);
         const P = (E = o.dev_get_mounted) == null ? void 0 : E.call(o, w);
         if (P) {
           let A = P.t;
@@ -7861,7 +7868,7 @@ function useAtomsSnapshot({
               /* NOTE: This just removes private atoms from the dependents list,
                 instead of hiding them from the dependency chain and showing
                 the nested dependents of the private atoms. */
-              (R) => !R.debugPrivate
+              (C) => !C.debugPrivate
             )
           )), b.set(w, A);
         }
@@ -8078,7 +8085,7 @@ function compile(r) {
   return dealloc(parse("", null, null, null, [""], r = alloc(r), 0, [0], r));
 }
 function parse(r, n, o, a, i, l, c, u, d) {
-  for (var p = 0, m = 0, g = c, h = 0, b = 0, x = 0, v = 1, S = 1, E = 1, w = 0, C = "", P = i, A = l, R = a, I = C; S; )
+  for (var p = 0, m = 0, g = c, h = 0, b = 0, x = 0, v = 1, S = 1, E = 1, w = 0, R = "", P = i, A = l, C = a, I = R; S; )
     switch (x = w, w = next()) {
       case 40:
         if (x != 108 && charat(I, g - 1) == 58) {
@@ -8124,22 +8131,22 @@ function parse(r, n, o, a, i, l, c, u, d) {
           case 59:
             I += ";";
           default:
-            if (append(R = ruleset(I, n, o, p, m, i, u, C, P = [], A = [], g), l), w === 123)
+            if (append(C = ruleset(I, n, o, p, m, i, u, R, P = [], A = [], g), l), w === 123)
               if (m === 0)
-                parse(I, n, R, R, P, l, g, u, A);
+                parse(I, n, C, C, P, l, g, u, A);
               else
                 switch (h === 99 && charat(I, 3) === 110 ? 100 : h) {
                   case 100:
                   case 108:
                   case 109:
                   case 115:
-                    parse(r, R, R, a && append(ruleset(r, R, R, 0, 0, i, u, C, i, P = [], g), A), i, A, g, u, a ? P : A);
+                    parse(r, C, C, a && append(ruleset(r, C, C, 0, 0, i, u, R, i, P = [], g), A), i, A, g, u, a ? P : A);
                     break;
                   default:
-                    parse(I, R, R, R, [""], A, 0, u, A);
+                    parse(I, C, C, C, [""], A, 0, u, A);
                 }
         }
-        p = m = b = 0, v = E = 1, C = I = "", g = c;
+        p = m = b = 0, v = E = 1, R = I = "", g = c;
         break;
       case 58:
         g = 1 + strlen(I), b = x;
@@ -8158,7 +8165,7 @@ function parse(r, n, o, a, i, l, c, u, d) {
             u[p++] = (strlen(I) - 1) * E, E = 1;
             break;
           case 64:
-            peek() === 45 && (I += delimit(next())), h = peek(), m = g = strlen(C = I += identifier(caret())), w++;
+            peek() === 45 && (I += delimit(next())), h = peek(), m = g = strlen(R = I += identifier(caret())), w++;
             break;
           case 45:
             x === 45 && strlen(I) == 2 && (v = 0);
@@ -8168,8 +8175,8 @@ function parse(r, n, o, a, i, l, c, u, d) {
 }
 function ruleset(r, n, o, a, i, l, c, u, d, p, m) {
   for (var g = i - 1, h = i === 0 ? l : [""], b = sizeof(h), x = 0, v = 0, S = 0; x < a; ++x)
-    for (var E = 0, w = substr(r, g + 1, g = abs(v = c[x])), C = r; E < b; ++E)
-      (C = trim(v > 0 ? h[E] + " " + w : replace(w, /&\f/g, h[E]))) && (d[S++] = C);
+    for (var E = 0, w = substr(r, g + 1, g = abs(v = c[x])), R = r; E < b; ++E)
+      (R = trim(v > 0 ? h[E] + " " + w : replace(w, /&\f/g, h[E]))) && (d[S++] = R);
   return node(r, n, o, i === 0 ? RULESET : u, d, p, m);
 }
 function comment(r, n, o) {
@@ -8498,12 +8505,12 @@ If multiple caches share the same key they might "fight" for each other's style
     })], h = middleware(p.concat(i, g)), b = function(S) {
       return serialize(compile(S), h);
     };
-    d = function(S, E, w, C) {
+    d = function(S, E, w, R) {
       m = w, process.env.NODE_ENV !== "production" && E.map !== void 0 && (m = {
         insert: function(A) {
           w.insert(A + E.map);
         }
-      }), b(S ? S + "{" + E.styles + "}" : E.styles), C && (x.inserted[E.name] = !0);
+      }), b(S ? S + "{" + E.styles + "}" : E.styles), R && (x.inserted[E.name] = !0);
     };
   }
   var x = {
@@ -8548,10 +8555,10 @@ function requireReactIs_production_min() {
     return reactIs_production_min;
   hasRequiredReactIs_production_min = 1;
   var r = typeof Symbol == "function" && Symbol.for, n = r ? Symbol.for("react.element") : 60103, o = r ? Symbol.for("react.portal") : 60106, a = r ? Symbol.for("react.fragment") : 60107, i = r ? Symbol.for("react.strict_mode") : 60108, l = r ? Symbol.for("react.profiler") : 60114, c = r ? Symbol.for("react.provider") : 60109, u = r ? Symbol.for("react.context") : 60110, d = r ? Symbol.for("react.async_mode") : 60111, p = r ? Symbol.for("react.concurrent_mode") : 60111, m = r ? Symbol.for("react.forward_ref") : 60112, g = r ? Symbol.for("react.suspense") : 60113, h = r ? Symbol.for("react.suspense_list") : 60120, b = r ? Symbol.for("react.memo") : 60115, x = r ? Symbol.for("react.lazy") : 60116, v = r ? Symbol.for("react.block") : 60121, S = r ? Symbol.for("react.fundamental") : 60117, E = r ? Symbol.for("react.responder") : 60118, w = r ? Symbol.for("react.scope") : 60119;
-  function C(A) {
+  function R(A) {
     if (typeof A == "object" && A !== null) {
-      var R = A.$$typeof;
-      switch (R) {
+      var C = A.$$typeof;
+      switch (C) {
         case n:
           switch (A = A.type, A) {
             case d:
@@ -8570,44 +8577,44 @@ function requireReactIs_production_min() {
                 case c:
                   return A;
                 default:
-                  return R;
+                  return C;
               }
           }
         case o:
-          return R;
+          return C;
       }
     }
   }
   function P(A) {
-    return C(A) === p;
+    return R(A) === p;
   }
   return reactIs_production_min.AsyncMode = d, reactIs_production_min.ConcurrentMode = p, reactIs_production_min.ContextConsumer = u, reactIs_production_min.ContextProvider = c, reactIs_production_min.Element = n, reactIs_production_min.ForwardRef = m, reactIs_production_min.Fragment = a, reactIs_production_min.Lazy = x, reactIs_production_min.Memo = b, reactIs_production_min.Portal = o, reactIs_production_min.Profiler = l, reactIs_production_min.StrictMode = i, reactIs_production_min.Suspense = g, reactIs_production_min.isAsyncMode = function(A) {
-    return P(A) || C(A) === d;
+    return P(A) || R(A) === d;
   }, reactIs_production_min.isConcurrentMode = P, reactIs_production_min.isContextConsumer = function(A) {
-    return C(A) === u;
+    return R(A) === u;
   }, reactIs_production_min.isContextProvider = function(A) {
-    return C(A) === c;
+    return R(A) === c;
   }, reactIs_production_min.isElement = function(A) {
     return typeof A == "object" && A !== null && A.$$typeof === n;
   }, reactIs_production_min.isForwardRef = function(A) {
-    return C(A) === m;
+    return R(A) === m;
   }, reactIs_production_min.isFragment = function(A) {
-    return C(A) === a;
+    return R(A) === a;
   }, reactIs_production_min.isLazy = function(A) {
-    return C(A) === x;
+    return R(A) === x;
   }, reactIs_production_min.isMemo = function(A) {
-    return C(A) === b;
+    return R(A) === b;
   }, reactIs_production_min.isPortal = function(A) {
-    return C(A) === o;
+    return R(A) === o;
   }, reactIs_production_min.isProfiler = function(A) {
-    return C(A) === l;
+    return R(A) === l;
   }, reactIs_production_min.isStrictMode = function(A) {
-    return C(A) === i;
+    return R(A) === i;
   }, reactIs_production_min.isSuspense = function(A) {
-    return C(A) === g;
+    return R(A) === g;
   }, reactIs_production_min.isValidElementType = function(A) {
     return typeof A == "string" || typeof A == "function" || A === a || A === p || A === l || A === i || A === g || A === h || typeof A == "object" && A !== null && (A.$$typeof === x || A.$$typeof === b || A.$$typeof === c || A.$$typeof === u || A.$$typeof === m || A.$$typeof === S || A.$$typeof === E || A.$$typeof === w || A.$$typeof === v);
-  }, reactIs_production_min.typeOf = C, reactIs_production_min;
+  }, reactIs_production_min.typeOf = R, reactIs_production_min;
 }
 var reactIs_development = {};
 /** @license React v16.13.1
@@ -8622,7 +8629,7 @@ var hasRequiredReactIs_development;
 function requireReactIs_development() {
   return hasRequiredReactIs_development || (hasRequiredReactIs_development = 1, process.env.NODE_ENV !== "production" && function() {
     var r = typeof Symbol == "function" && Symbol.for, n = r ? Symbol.for("react.element") : 60103, o = r ? Symbol.for("react.portal") : 60106, a = r ? Symbol.for("react.fragment") : 60107, i = r ? Symbol.for("react.strict_mode") : 60108, l = r ? Symbol.for("react.profiler") : 60114, c = r ? Symbol.for("react.provider") : 60109, u = r ? Symbol.for("react.context") : 60110, d = r ? Symbol.for("react.async_mode") : 60111, p = r ? Symbol.for("react.concurrent_mode") : 60111, m = r ? Symbol.for("react.forward_ref") : 60112, g = r ? Symbol.for("react.suspense") : 60113, h = r ? Symbol.for("react.suspense_list") : 60120, b = r ? Symbol.for("react.memo") : 60115, x = r ? Symbol.for("react.lazy") : 60116, v = r ? Symbol.for("react.block") : 60121, S = r ? Symbol.for("react.fundamental") : 60117, E = r ? Symbol.for("react.responder") : 60118, w = r ? Symbol.for("react.scope") : 60119;
-    function C(K) {
+    function R(K) {
       return typeof K == "string" || typeof K == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
       K === a || K === p || K === l || K === i || K === g || K === h || typeof K == "object" && K !== null && (K.$$typeof === x || K.$$typeof === b || K.$$typeof === c || K.$$typeof === u || K.$$typeof === m || K.$$typeof === S || K.$$typeof === E || K.$$typeof === w || K.$$typeof === v);
     }
@@ -8658,7 +8665,7 @@ function requireReactIs_development() {
         }
       }
     }
-    var A = d, R = p, I = u, j = c, k = n, O = m, T = a, B = x, L = b, D = o, W = l, J = i, F = g, V = !1;
+    var A = d, C = p, I = u, j = c, k = n, O = m, T = a, B = x, L = b, D = 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) || P(K) === d;
     }
@@ -8698,7 +8705,7 @@ function requireReactIs_development() {
     function se(K) {
       return P(K) === g;
     }
-    reactIs_development.AsyncMode = A, reactIs_development.ConcurrentMode = R, reactIs_development.ContextConsumer = I, reactIs_development.ContextProvider = j, reactIs_development.Element = k, reactIs_development.ForwardRef = O, reactIs_development.Fragment = T, reactIs_development.Lazy = B, reactIs_development.Memo = L, reactIs_development.Portal = D, 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 = C, reactIs_development.typeOf = P;
+    reactIs_development.AsyncMode = A, reactIs_development.ConcurrentMode = C, reactIs_development.ContextConsumer = I, reactIs_development.ContextProvider = j, reactIs_development.Element = k, reactIs_development.ForwardRef = O, reactIs_development.Fragment = T, reactIs_development.Lazy = B, reactIs_development.Memo = L, reactIs_development.Portal = D, 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 = R, reactIs_development.typeOf = P;
   }()), reactIs_development;
 }
 process.env.NODE_ENV === "production" ? reactIs$1.exports = requireReactIs_production_min() : reactIs$1.exports = requireReactIs_development();
@@ -10734,7 +10741,7 @@ function useMove(r, n, o = "ltr") {
   return useEffect$1(() => {
     i.current = !0;
   }, []), useEffect$1(() => {
-    const p = ({ x: w, y: C }) => {
+    const p = ({ x: w, y: R }) => {
       cancelAnimationFrame(c.current), c.current = requestAnimationFrame(() => {
         if (i.current && a.current) {
           a.current.style.userSelect = "none";
@@ -10743,7 +10750,7 @@ function useMove(r, n, o = "ltr") {
             const A = clamp$1((w - P.left) / P.width, 0, 1);
             r({
               x: o === "ltr" ? A : 1 - A,
-              y: clamp$1((C - P.top) / P.height, 0, 1)
+              y: clamp$1((R - P.top) / P.height, 0, 1)
             });
           }
         }
@@ -10860,7 +10867,7 @@ function useScrollIntoView({
   }, x = useCallback$1(({ alignment: S = "start" } = {}) => {
     var E;
     p.current = !1, u.current && b();
-    const w = (E = getScrollStart({ parent: m.current, axis: n })) != null ? E : 0, C = getRelativePosition({
+    const w = (E = getScrollStart({ parent: m.current, axis: n })) != null ? E : 0, R = getRelativePosition({
       parent: m.current,
       target: g.current,
       axis: n,
@@ -10870,7 +10877,7 @@ function useScrollIntoView({
     }) - (m.current ? 0 : w);
     function P() {
       d.current === 0 && (d.current = performance.now());
-      const R = performance.now() - d.current, I = h || r === 0 ? 1 : R / r, j = w + C * a(I);
+      const C = performance.now() - d.current, I = h || r === 0 ? 1 : C / r, j = w + R * a(I);
       setScrollParam({
         parent: m.current,
         axis: n,
@@ -10932,10 +10939,10 @@ function extractSystemStyles(r) {
     bg: S,
     c: E,
     opacity: w,
-    ff: C,
+    ff: R,
     fz: P,
     fw: A,
-    lts: R,
+    lts: C,
     ta: I,
     lh: j,
     fs: k,
@@ -11021,10 +11028,10 @@ function extractSystemStyles(r) {
     bg: S,
     c: E,
     opacity: w,
-    ff: C,
+    ff: R,
     fz: P,
     fw: A,
-    lts: R,
+    lts: C,
     ta: I,
     lh: j,
     fs: k,
@@ -11321,11 +11328,11 @@ function useCollapse({
   };
   function b(x = {}) {
     var v = x, { style: S = {}, refKey: E = "ref" } = v, w = __objRest$X(v, ["style", "refKey"]);
-    const C = w[E];
+    const R = w[E];
     return __spreadProps$L(__spreadValues$1i({
       "aria-hidden": !a
     }, w), {
-      [E]: mergeRefs(i, C),
+      [E]: mergeRefs(i, R),
       onTransitionEnd: h,
       style: __spreadValues$1i(__spreadValues$1i({ boxSizing: "border-box" }, S), u)
     });
@@ -11846,7 +11853,7 @@ const defaultProps$C = {
     "loading",
     "unstyled",
     "__staticSelector"
-  ]), { classes: S, cx: E, theme: w } = useStyles$I({ radius: c, color: i, gradient: p }, { name: ["ActionIcon", x], unstyled: b, size: u, variant: d }), C = /* @__PURE__ */ React__default.createElement(Loader, __spreadValues$1a({
+  ]), { classes: S, cx: E, theme: w } = useStyles$I({ radius: c, color: i, gradient: p }, { name: ["ActionIcon", x], unstyled: b, size: u, variant: d }), R = /* @__PURE__ */ React__default.createElement(Loader, __spreadValues$1a({
     color: w.fn.variant({ color: i, variant: d }).color,
     size: "100%",
     "data-action-icon-loader": !0
@@ -11858,7 +11865,7 @@ const defaultProps$C = {
     "data-disabled": m || void 0,
     "data-loading": h || void 0,
     unstyled: b
-  }, v), h ? C : l);
+  }, v), h ? R : l);
 });
 _ActionIcon.displayName = "@mantine/core/ActionIcon";
 const ActionIcon = _ActionIcon;
@@ -12089,10 +12096,10 @@ const defaultProps$A = {
     strikethrough: S,
     italic: E,
     classNames: w,
-    styles: C,
+    styles: R,
     unstyled: P,
     span: A,
-    __staticSelector: R
+    __staticSelector: C
   } = o, I = __objRest$L(o, [
     "className",
     "size",
@@ -12127,7 +12134,7 @@ const defaultProps$A = {
     transform: c,
     align: d,
     gradient: h
-  }, { unstyled: P, name: R || "Text", variant: p, size: i });
+  }, { unstyled: P, name: C || "Text", variant: p, size: i });
   return /* @__PURE__ */ React__default.createElement(Box, __spreadValues$14({
     ref: n,
     className: k(j.root, { [j.gradient]: p === "gradient" }, a),
@@ -12290,16 +12297,16 @@ const defaultProps$y = {
     "styles",
     "classNames",
     "unstyled"
-  ]), { classes: v, cx: S } = useStyles$F({ color: i }, { classNames: h, styles: g, unstyled: b, name: "Divider", variant: m, size: c }), E = l === "vertical", w = l === "horizontal", C = !!u && w, P = !(p != null && p.color);
+  ]), { classes: v, cx: S } = useStyles$F({ color: i }, { classNames: h, styles: g, unstyled: b, name: "Divider", variant: m, size: c }), E = l === "vertical", w = l === "horizontal", R = !!u && w, P = !(p != null && p.color);
   return /* @__PURE__ */ React__default.createElement(Box, __spreadValues$11({
     ref: n,
     className: S(v.root, {
       [v.vertical]: E,
       [v.horizontal]: w,
-      [v.withLabel]: C
+      [v.withLabel]: R
     }, a),
     role: "separator"
-  }, x), C && /* @__PURE__ */ React__default.createElement(Text, __spreadProps$H(__spreadValues$11({}, p), {
+  }, x), R && /* @__PURE__ */ React__default.createElement(Text, __spreadProps$H(__spreadValues$11({}, p), {
     size: (p == null ? void 0 : p.size) || "xs",
     mt: rem(2),
     className: S(v.label, v[d], {
@@ -12394,7 +12401,7 @@ function SelectItems({
     name: c,
     variant: S,
     size: g
-  }), w = [], C = [];
+  }), w = [], R = [];
   let P = null;
   const A = (I, j) => {
     const k = typeof i == "function" ? i(I.value) : !1;
@@ -12420,15 +12427,15 @@ function SelectItems({
       variant: S
     }, I));
   };
-  let R = null;
+  let C = null;
   if (r.forEach((I, j) => {
-    I.creatable ? P = j : I.group ? (R !== I.group && (R = I.group, C.push(/* @__PURE__ */ React__default.createElement("div", {
+    I.creatable ? P = j : I.group ? (C !== I.group && (C = I.group, R.push(/* @__PURE__ */ React__default.createElement("div", {
       className: E.separator,
       key: `__mantine-divider-${j}`
     }, /* @__PURE__ */ React__default.createElement(Divider, {
       classNames: { label: E.separatorLabel },
       label: I.group
-    })))), C.push(A(I, j))) : w.push(A(I, j));
+    })))), R.push(A(I, j))) : w.push(A(I, j));
   }), b) {
     const I = r[P];
     w.push(/* @__PURE__ */ React__default.createElement("div", {
@@ -12445,10 +12452,10 @@ function SelectItems({
       }
     }, x));
   }
-  return C.length > 0 && w.length > 0 && w.unshift(/* @__PURE__ */ React__default.createElement("div", {
+  return R.length > 0 && w.length > 0 && w.unshift(/* @__PURE__ */ React__default.createElement("div", {
     className: E.separator,
     key: "empty-group-separator"
-  }, /* @__PURE__ */ React__default.createElement(Divider, null))), C.length > 0 || w.length > 0 ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, C, w) : /* @__PURE__ */ React__default.createElement(Text, {
+  }, /* @__PURE__ */ React__default.createElement(Divider, null))), R.length > 0 || w.length > 0 ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, R, w) : /* @__PURE__ */ React__default.createElement(Text, {
     size: g,
     unstyled: v,
     className: E.nothingFound
@@ -12592,7 +12599,7 @@ const defaultProps$x = {
     "unstyled",
     "variant",
     "viewportProps"
-  ]), [w, C] = useState$1(!1), P = useMantineTheme(), { classes: A, cx: R } = useStyles$D({ scrollbarSize: u, offsetScrollbars: g, scrollbarHovered: w, hidden: p === "never" }, { name: "ScrollArea", classNames: l, styles: c, unstyled: x, variant: v });
+  ]), [w, R] = useState$1(!1), P = useMantineTheme(), { classes: A, cx: C } = useStyles$D({ scrollbarSize: u, offsetScrollbars: g, scrollbarHovered: w, hidden: p === "never" }, { name: "ScrollArea", classNames: l, styles: c, unstyled: x, variant: v });
   return /* @__PURE__ */ React__default.createElement(ScrollAreaPrimitive.Root, {
     type: p === "never" ? "always" : p,
     scrollHideDelay: d,
@@ -12600,7 +12607,7 @@ const defaultProps$x = {
     ref: n,
     asChild: !0
   }, /* @__PURE__ */ React__default.createElement(Box, __spreadValues$Z({
-    className: R(A.root, i)
+    className: C(A.root, i)
   }, E), /* @__PURE__ */ React__default.createElement(ScrollAreaPrimitive.Viewport, __spreadProps$F(__spreadValues$Z({}, S), {
     className: A.viewport,
     ref: h,
@@ -12612,16 +12619,16 @@ const defaultProps$x = {
     orientation: "horizontal",
     className: A.scrollbar,
     forceMount: !0,
-    onMouseEnter: () => C(!0),
-    onMouseLeave: () => C(!1)
+    onMouseEnter: () => R(!0),
+    onMouseLeave: () => R(!1)
   }, /* @__PURE__ */ React__default.createElement(ScrollAreaPrimitive.Thumb, {
     className: A.thumb
   })), /* @__PURE__ */ React__default.createElement(ScrollAreaPrimitive.Scrollbar, {
     orientation: "vertical",
     className: A.scrollbar,
     forceMount: !0,
-    onMouseEnter: () => C(!0),
-    onMouseLeave: () => C(!1)
+    onMouseEnter: () => R(!0),
+    onMouseLeave: () => R(!1)
   }, /* @__PURE__ */ React__default.createElement(ScrollAreaPrimitive.Thumb, {
     className: A.thumb
   })), /* @__PURE__ */ React__default.createElement(ScrollAreaPrimitive.Corner, {
@@ -12822,7 +12829,7 @@ const useHover = function(r, n) {
       floating: b
     },
     refs: x
-  } = r, v = useFloatingTree(), S = useFloatingParentNodeId(), E = useLatestRef(i), w = useLatestRef(a), C = React.useRef(), P = React.useRef(), A = React.useRef(), R = React.useRef(), I = React.useRef(!0), j = React.useRef(!1), k = React.useRef(() => {
+  } = r, v = useFloatingTree(), S = useFloatingParentNodeId(), E = useLatestRef(i), w = useLatestRef(a), R = React.useRef(), P = React.useRef(), A = React.useRef(), C = React.useRef(), I = React.useRef(!0), j = React.useRef(!1), k = React.useRef(() => {
   }), O = React.useCallback(() => {
     var D;
     const W = (D = m.current.openEvent) == null ? void 0 : D.type;
@@ -12832,7 +12839,7 @@ const useHover = function(r, n) {
     if (!o)
       return;
     function D() {
-      clearTimeout(P.current), clearTimeout(R.current), I.current = !0;
+      clearTimeout(P.current), clearTimeout(C.current), I.current = !0;
     }
     return g.on("dismiss", D), () => {
       g.off("dismiss", D);
@@ -12850,7 +12857,7 @@ const useHover = function(r, n) {
   }, [b, d, p, o, E, m, O]);
   const T = React.useCallback(function(D) {
     D === void 0 && (D = !0);
-    const W = getDelay(w.current, "close", C.current);
+    const W = getDelay(w.current, "close", R.current);
     W && !A.current ? (clearTimeout(P.current), P.current = setTimeout(() => p(!1), W)) : D && (clearTimeout(P.current), p(!1));
   }, [w, p]), B = React.useCallback(() => {
     k.current(), A.current = void 0;
@@ -12867,10 +12874,10 @@ const useHover = function(r, n) {
       return m.current.openEvent ? ["click", "mousedown"].includes(m.current.openEvent.type) : !1;
     }
     function W(V) {
-      if (clearTimeout(P.current), I.current = !1, l && !isMouseLikePointerType(C.current) || c > 0 && getDelay(w.current, "open") === 0)
+      if (clearTimeout(P.current), I.current = !1, l && !isMouseLikePointerType(R.current) || c > 0 && getDelay(w.current, "open") === 0)
         return;
       m.current.openEvent = V;
-      const q = getDelay(w.current, "open", C.current);
+      const q = getDelay(w.current, "open", R.current);
       q ? P.current = setTimeout(() => {
         p(!0);
       }, q) : p(!0);
@@ -12880,7 +12887,7 @@ const useHover = function(r, n) {
         return;
       k.current();
       const q = getDocument(b);
-      if (clearTimeout(R.current), E.current) {
+      if (clearTimeout(C.current), E.current) {
         d || clearTimeout(P.current), A.current = E.current({
           ...r,
           tree: v,
@@ -12930,21 +12937,21 @@ const useHover = function(r, n) {
       }
     }
   }, [o, d, S, b, h, v, E, m, O]), index(() => {
-    d || (C.current = void 0, B(), L());
+    d || (R.current = void 0, B(), L());
   }, [d, B, L]), React.useEffect(() => () => {
-    B(), clearTimeout(P.current), clearTimeout(R.current), L();
+    B(), clearTimeout(P.current), clearTimeout(C.current), L();
   }, [o, B, L]), React.useMemo(() => {
     if (!o)
       return {};
     function D(W) {
-      C.current = W.pointerType;
+      R.current = W.pointerType;
     }
     return {
       reference: {
         onPointerDown: D,
         onPointerEnter: D,
         onMouseMove() {
-          d || c === 0 || (clearTimeout(R.current), R.current = setTimeout(() => {
+          d || c === 0 || (clearTimeout(C.current), C.current = setTimeout(() => {
             I.current || p(!0);
           }, c));
         }
@@ -13147,7 +13154,7 @@ const bubbleHandlerKeys = {
     ancestorScroll: S = !1,
     bubbles: E = !0
   } = n === void 0 ? {} : n;
-  const w = useFloatingTree(), C = useFloatingParentNodeId() != null, P = useEvent(typeof h == "function" ? h : () => !1), A = typeof h == "function" ? P : h, R = React.useRef(!1), {
+  const w = useFloatingTree(), R = useFloatingParentNodeId() != null, P = useEvent(typeof h == "function" ? h : () => !1), A = typeof h == "function" ? P : h, C = React.useRef(!1), {
     escapeKeyBubbles: I,
     outsidePressBubbles: j
   } = normalizeBubblesProp(E);
@@ -13180,8 +13187,8 @@ const bubbleHandlerKeys = {
       }
     }
     function O(D) {
-      const W = R.current;
-      if (R.current = !1, W || typeof A == "function" && !A(D))
+      const W = C.current;
+      if (C.current = !1, W || typeof A == "function" && !A(D))
         return;
       const J = getTarget(D);
       if (isHTMLElement(J) && d) {
@@ -13211,7 +13218,7 @@ const bubbleHandlerKeys = {
       i.emit("dismiss", {
         type: "outsidePress",
         data: {
-          returnFocus: C ? {
+          returnFocus: R ? {
             preventScroll: !0
           } : isVirtualClick(D) || isVirtualPointerEvent(D)
         }
@@ -13235,8 +13242,8 @@ const bubbleHandlerKeys = {
         D.removeEventListener("scroll", T);
       });
     };
-  }, [p, d, u, c, g, A, b, i, w, l, o, a, S, m, I, j, C]), React.useEffect(() => {
-    R.current = !1;
+  }, [p, d, u, c, g, A, b, i, w, l, o, a, S, m, I, j, R]), React.useEffect(() => {
+    C.current = !1;
   }, [A, b]), React.useMemo(() => m ? {
     reference: {
       [bubbleHandlerKeys[v]]: () => {
@@ -13250,7 +13257,7 @@ const bubbleHandlerKeys = {
     },
     floating: {
       [captureHandlerKeys[b]]: () => {
-        R.current = !0;
+        C.current = !0;
       }
     }
   } : {}, [m, i, x, b, v, a]);
@@ -13624,17 +13631,17 @@ function useTransition({
   onExited: u
 }) {
   const d = useMantineTheme(), p = useReducedMotion(), m = d.respectReducedMotion ? p : !1, [g, h] = useState$1(m ? 0 : r), [b, x] = useState$1(a ? "entered" : "exited"), v = useRef$1(-1), S = (E) => {
-    const w = E ? i : l, C = E ? c : u;
+    const w = E ? i : l, R = E ? c : u;
     x(E ? "pre-entering" : "pre-exiting"), window.clearTimeout(v.current);
     const P = m ? 0 : E ? r : n;
     if (h(P), P === 0)
-      typeof w == "function" && w(), typeof C == "function" && C(), x(E ? "entered" : "exited");
+      typeof w == "function" && w(), typeof R == "function" && R(), x(E ? "entered" : "exited");
     else {
       const A = window.setTimeout(() => {
         typeof w == "function" && w(), x(E ? "entering" : "exiting");
       }, 10);
       v.current = window.setTimeout(() => {
-        window.clearTimeout(A), typeof C == "function" && C(), x(E ? "entered" : "exited");
+        window.clearTimeout(A), typeof R == "function" && R(), x(E ? "entered" : "exited");
       }, P);
     }
   };
@@ -13920,10 +13927,10 @@ function Popover(r) {
     width: S,
     middlewares: E,
     withArrow: w,
-    arrowSize: C,
+    arrowSize: R,
     arrowOffset: P,
     arrowRadius: A,
-    arrowPosition: R,
+    arrowPosition: C,
     unstyled: I,
     classNames: j,
     styles: k,
@@ -13989,7 +13996,7 @@ function Popover(r) {
     middlewares: E,
     width: S,
     position: getFloatingPosition(Te.dir, m),
-    offset: typeof g == "number" ? g + (w ? C / 2 : 0) : g,
+    offset: typeof g == "number" ? g + (w ? R / 2 : 0) : g,
     arrowRef: u,
     arrowOffset: P,
     onPositionChange: h,
@@ -14022,10 +14029,10 @@ function Popover(r) {
       transitionProps: v,
       width: S,
       withArrow: w,
-      arrowSize: C,
+      arrowSize: R,
       arrowOffset: P,
       arrowRadius: A,
-      arrowPosition: R,
+      arrowPosition: C,
       placement: be.floating.placement,
       trapFocus: W,
       withinPortal: T,
@@ -14188,10 +14195,10 @@ function useInputProps(r, n, o) {
     descriptionProps: S,
     wrapperProps: E,
     id: w,
-    size: C,
+    size: R,
     style: P,
     inputContainer: A,
-    inputWrapperOrder: R,
+    inputWrapperOrder: C,
     withAsterisk: I,
     variant: j
   } = a, k = __objRest$A(a, [
@@ -14231,10 +14238,10 @@ function useInputProps(r, n, o) {
     unstyled: g,
     styles: p,
     id: O,
-    size: C,
+    size: R,
     style: P,
     inputContainer: A,
-    inputWrapperOrder: R,
+    inputWrapperOrder: C,
     withAsterisk: I,
     variant: j
   }, E);
@@ -14249,7 +14256,7 @@ function useInputProps(r, n, o) {
       styles: p,
       unstyled: g,
       id: O,
-      size: C,
+      size: R,
       __staticSelector: h,
       error: c,
       variant: j
@@ -14516,10 +14523,10 @@ const defaultProps$q = {
     size: S,
     inputContainer: E,
     __staticSelector: w,
-    unstyled: C,
+    unstyled: R,
     inputWrapperOrder: P,
     withAsterisk: A,
-    variant: R
+    variant: C
   } = o, I = __objRest$w(o, [
     "className",
     "label",
@@ -14545,15 +14552,15 @@ const defaultProps$q = {
     classNames: x,
     styles: v,
     name: ["InputWrapper", w],
-    unstyled: C,
-    variant: R,
+    unstyled: R,
+    variant: C,
     size: S
   }), O = {
     classNames: x,
     styles: v,
-    unstyled: C,
+    unstyled: R,
     size: S,
-    variant: R,
+    variant: C,
     __staticSelector: w
   }, T = typeof A == "boolean" ? A : c, B = u ? `${u}-error` : b == null ? void 0 : b.id, L = u ? `${u}-description` : h == null ? void 0 : h.id, W = `${!!d && typeof d != "boolean" ? B : ""} ${p ? L : ""}`, J = W.trim().length > 0 ? W.trim() : void 0, F = i && /* @__PURE__ */ React__default.createElement(InputLabel, __spreadValues$M(__spreadValues$M({
     key: "label",
@@ -14809,10 +14816,10 @@ const defaultProps$o = {
     wrapperProps: S,
     classNames: E,
     styles: w,
-    __staticSelector: C,
+    __staticSelector: R,
     multiline: P,
     sx: A,
-    unstyled: R,
+    unstyled: C,
     pointer: I
   } = o, j = __objRest$u(o, [
     "className",
@@ -14846,7 +14853,7 @@ const defaultProps$o = {
     offsetBottom: k,
     offsetTop: O,
     pointer: I
-  }, { classNames: E, styles: w, name: ["Input", C], unstyled: R, variant: u, size: v }), { systemStyles: D, rest: W } = extractSystemStyles(j);
+  }, { classNames: E, styles: w, name: ["Input", R], unstyled: C, variant: u, size: v }), { systemStyles: D, rest: W } = extractSystemStyles(j);
   return /* @__PURE__ */ React__default.createElement(Box, __spreadValues$J(__spreadValues$J({
     className: L(B.wrapper, a),
     sx: A,
@@ -15243,10 +15250,10 @@ const defaultProps$l = {
     loading: S,
     loaderPosition: E,
     loaderProps: w,
-    gradient: C,
+    gradient: R,
     classNames: P,
     styles: A,
-    unstyled: R
+    unstyled: C
   } = o, I = __objRest$r(o, [
     "className",
     "size",
@@ -15273,10 +15280,10 @@ const defaultProps$l = {
     color: l,
     fullWidth: g,
     compact: v,
-    gradient: C,
+    gradient: R,
     withLeftIcon: !!p,
     withRightIcon: !!m
-  }, { name: "Button", unstyled: R, classNames: P, styles: A, variant: h, size: i }), T = O.fn.variant({ color: l, variant: h }), B = /* @__PURE__ */ React__default.createElement(Loader, __spreadValues$E({
+  }, { name: "Button", unstyled: C, classNames: P, styles: A, variant: h, size: i }), T = O.fn.variant({ color: l, variant: h }), B = /* @__PURE__ */ React__default.createElement(Loader, __spreadValues$E({
     color: T.color,
     size: `calc(${getSize({ size: i, sizes: sizes$1 }).height} / 2)`
   }, w));
@@ -15288,7 +15295,7 @@ const defaultProps$l = {
     "data-disabled": u || void 0,
     "data-loading": S || void 0,
     ref: n,
-    unstyled: R
+    unstyled: C
   }, I), /* @__PURE__ */ React__default.createElement("div", {
     className: j.inner
   }, (p || S && E === "left") && /* @__PURE__ */ React__default.createElement("span", {
@@ -15434,10 +15441,10 @@ const defaultProps$j = {
     "unstyled",
     "center",
     "fixed"
-  ]), { classes: w, cx: C } = useStyles$p({ color: l, opacity: i, blur: c, radius: p, gradient: u, fixed: S, zIndex: d }, { name: "Overlay", classNames: h, styles: b, unstyled: x, variant: a });
+  ]), { classes: w, cx: R } = useStyles$p({ color: l, opacity: i, blur: c, radius: p, gradient: u, fixed: S, zIndex: d }, { name: "Overlay", classNames: h, styles: b, unstyled: x, variant: a });
   return /* @__PURE__ */ React__default.createElement(Box, __spreadValues$A({
     ref: n,
-    className: C(w.root, g),
+    className: R(w.root, g),
     "data-center": v || void 0
   }, E), m);
 });
@@ -15677,7 +15684,7 @@ const defaultProps$g = {
     zIndex: S,
     unstyled: E,
     processing: w,
-    variant: C
+    variant: R
   } = o, P = __objRest$m(o, [
     "children",
     "position",
@@ -15696,14 +15703,14 @@ const defaultProps$g = {
     "unstyled",
     "processing",
     "variant"
-  ]), { classes: A, cx: R } = useStyles$m({ position: i, offset: l, radius: u, inline: d, color: g, withBorder: p, zIndex: S, withLabel: !!b }, { name: "Indicator", classNames: x, styles: h, unstyled: E, variant: C, size: c });
+  ]), { classes: A, cx: C } = useStyles$m({ position: i, offset: l, radius: u, inline: d, color: g, withBorder: p, zIndex: S, withLabel: !!b }, { name: "Indicator", classNames: x, styles: h, unstyled: E, variant: R, size: c });
   return /* @__PURE__ */ React__default.createElement(Box, __spreadValues$w({
     ref: n,
-    className: R(A.root, m)
+    className: C(A.root, m)
   }, P), !v && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", {
-    className: R(A.indicator, A.common)
+    className: C(A.indicator, A.common)
   }, b), w && /* @__PURE__ */ React__default.createElement("div", {
-    className: R(A.processing, A.common)
+    className: C(A.processing, A.common)
   })), a);
 });
 Indicator.displayName = "@mantine/core/Indicator";
@@ -15773,10 +15780,10 @@ const defaultProps$f = {}, ListItem = forwardRef$1((r, n) => {
     styles: x,
     unstyled: v,
     variant: S
-  } = useListContext(), E = l || u, { classes: w, cx: C } = useStyles$l({ withPadding: h, listStyleType: m, center: p, spacing: d }, { classNames: b, styles: x, unstyled: v, name: "List", variant: S, size: g });
+  } = useListContext(), E = l || u, { classes: w, cx: R } = useStyles$l({ withPadding: h, listStyleType: m, center: p, spacing: d }, { classNames: b, styles: x, unstyled: v, name: "List", variant: S, size: g });
   return /* @__PURE__ */ React__default.createElement(Box, __spreadValues$v({
     component: "li",
-    className: C(w.item, a),
+    className: R(w.item, a),
     "data-with-icon": !!E || void 0,
     ref: n
   }, c), /* @__PURE__ */ React__default.createElement("div", {
@@ -15942,7 +15949,7 @@ const defaultProps$d = {
     "unstyled",
     "variant",
     "keepMounted"
-  ]), { classes: C, cx: P, theme: A } = useStyles$j(null, { name: "LoadingOverlay", unstyled: v, variant: S }), R = `calc(${m} + 1)`;
+  ]), { classes: R, cx: P, theme: A } = useStyles$j(null, { name: "LoadingOverlay", unstyled: v, variant: S }), C = `calc(${m} + 1)`;
   return /* @__PURE__ */ React__default.createElement(Transition, {
     keepMounted: E,
     duration: d,
@@ -15950,13 +15957,13 @@ const defaultProps$d = {
     mounted: i,
     transition: "fade"
   }, (I) => /* @__PURE__ */ React__default.createElement(Box, __spreadValues$r({
-    className: P(C.root, a),
+    className: P(R.root, a),
     style: __spreadProps$m(__spreadValues$r(__spreadValues$r({}, I), g), { zIndex: m }),
     ref: n
   }, w), h ? /* @__PURE__ */ React__default.createElement("div", {
-    style: { zIndex: R }
+    style: { zIndex: C }
   }, h) : /* @__PURE__ */ React__default.createElement(Loader, __spreadValues$r({
-    style: { zIndex: R }
+    style: { zIndex: C }
   }, l)), /* @__PURE__ */ React__default.createElement(Overlay, {
     opacity: c,
     zIndex: m,
@@ -16182,10 +16189,10 @@ const defaultProps$c = {
     opened: S,
     defaultOpened: E,
     onChange: w,
-    disableRightSectionRotation: C,
+    disableRightSectionRotation: R,
     childrenOffset: P,
     disabled: A,
-    onClick: R
+    onClick: C
   } = o, I = __objRest$g(o, [
     "label",
     "description",
@@ -16213,7 +16220,7 @@ const defaultProps$c = {
     finalValue: !1,
     onChange: w
   }), B = !!v, L = (D) => {
-    B ? (D.preventDefault(), R == null || R(D), T(!O)) : R == null || R(D);
+    B ? (D.preventDefault(), C == null || C(D), T(!O)) : C == null || C(D);
   };
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(UnstyledButton, __spreadValues$m({
     ref: n,
@@ -16240,7 +16247,7 @@ const defaultProps$c = {
     className: j.description
   }, i)), (B || c) && /* @__PURE__ */ React__default.createElement("span", {
     className: j.rightSection,
-    "data-rotate": O && !C || void 0
+    "data-rotate": O && !R || void 0
   }, B ? c || /* @__PURE__ */ React__default.createElement(ChevronIcon$1, {
     width: rem(14),
     height: rem(14),
@@ -16415,10 +16422,10 @@ function TooltipFloating(r) {
     position: S,
     multiline: E,
     width: w,
-    zIndex: C,
+    zIndex: R,
     disabled: P,
     variant: A
-  } = o, R = __objRest$e(o, [
+  } = o, C = __objRest$e(o, [
     "children",
     "refProp",
     "withinPortal",
@@ -16453,11 +16460,11 @@ function TooltipFloating(r) {
   };
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(OptionalPortal, __spreadProps$g(__spreadValues$j({}, c), {
     withinPortal: l
-  }), /* @__PURE__ */ React__default.createElement(Box, __spreadProps$g(__spreadValues$j({}, R), {
+  }), /* @__PURE__ */ React__default.createElement(Box, __spreadProps$g(__spreadValues$j({}, C), {
     ref: B,
     className: W(D.tooltip, d),
     style: __spreadProps$g(__spreadValues$j({}, u), {
-      zIndex: C,
+      zIndex: R,
       display: !P && O ? "block" : "none",
       top: k ?? "",
       left: (n = Math.round(j)) != null ? n : ""
@@ -16481,7 +16488,7 @@ function useTooltip(r) {
     refs: S,
     update: E,
     placement: w,
-    middlewareData: { arrow: { x: C, y: P } = {} }
+    middlewareData: { arrow: { x: R, y: P } = {} }
   } = useFloating({
     placement: r.position,
     open: i,
@@ -16493,7 +16500,7 @@ function useTooltip(r) {
       arrow({ element: r.arrowRef, padding: r.arrowOffset }),
       ...r.inline ? [inline()] : []
     ]
-  }), { getReferenceProps: A, getFloatingProps: R } = useInteractions([
+  }), { getReferenceProps: A, getFloatingProps: C } = useInteractions([
     useHover(v, {
       enabled: r.events.hover,
       delay: l ? u : { open: r.openDelay, close: r.closeDelay },
@@ -16515,11 +16522,11 @@ function useTooltip(r) {
   }, [w]), {
     x: g,
     y: h,
-    arrowX: C,
+    arrowX: R,
     arrowY: P,
     reference: b,
     floating: x,
-    getFloatingProps: R,
+    getFloatingProps: C,
     getReferenceProps: A,
     isGroupPhase: i && d && d !== c,
     opened: i,
@@ -16574,10 +16581,10 @@ const defaultProps$9 = {
     color: S,
     classNames: E,
     styles: w,
-    unstyled: C,
+    unstyled: R,
     style: P,
     className: A,
-    withArrow: R,
+    withArrow: C,
     arrowSize: I,
     arrowOffset: j,
     arrowRadius: k,
@@ -16633,7 +16640,7 @@ const defaultProps$9 = {
     "inline",
     "variant",
     "keepMounted"
-  ]), { classes: Q, cx: ne, theme: re } = useStyles$h({ radius: v, color: S, width: D, multiline: L }, { name: "Tooltip", classNames: E, styles: w, unstyled: C, variant: U }), $ = useTooltip({
+  ]), { classes: Q, cx: ne, theme: re } = useStyles$h({ radius: v, color: S, width: D, multiline: L }, { name: "Tooltip", classNames: E, styles: w, unstyled: R, variant: U }), $ = useTooltip({
     position: getFloatingPosition(re.dir, c),
     closeDelay: m,
     openDelay: p,
@@ -16642,7 +16649,7 @@ const defaultProps$9 = {
     events: W,
     arrowRef: a,
     arrowOffset: j,
-    offset: T + (R ? I / 2 : 0),
+    offset: T + (C ? I / 2 : 0),
     positionDependencies: [...V, l],
     inline: z
   });
@@ -16671,7 +16678,7 @@ const defaultProps$9 = {
       ref: a,
       arrowX: $.arrowX,
       arrowY: $.arrowY,
-      visible: R,
+      visible: C,
       position: $.placement,
       arrowSize: I,
       arrowOffset: j,
@@ -16790,10 +16797,10 @@ const defaultProps$8 = {
     unstyled: S,
     classNames: E,
     styles: w,
-    filter: C,
+    filter: R,
     maxDropdownHeight: P,
     searchable: A,
-    clearable: R,
+    clearable: C,
     nothingFound: I,
     limit: j,
     disabled: k,
@@ -16873,12 +16880,12 @@ const defaultProps$8 = {
     "readOnly",
     "clearButtonProps",
     "hoverOnSearchChange"
-  ]), { classes: be, cx: Ze, theme: Ne } = useStyles$g(), [ge, Ge] = useState$1(v), [ke, ve] = useState$1(-1), He = useRef$1(), Fe = useRef$1({}), [Je, rt] = useState$1("column"), Ce = Je === "column", { scrollIntoView: De, targetRef: Le, scrollableRef: nt } = useScrollIntoView({
+  ]), { classes: be, cx: Ze, theme: Ne } = useStyles$g(), [ge, Ge] = useState$1(v), [ke, ve] = useState$1(-1), He = useRef$1(), Fe = useRef$1({}), [Je, rt] = useState$1("column"), Re = Je === "column", { scrollIntoView: De, targetRef: Le, scrollableRef: nt } = useScrollIntoView({
     duration: 0,
     offset: 5,
     cancelable: !1,
     isList: !0
-  }), Ye = re === void 0 ? R : re, Se = (H) => {
+  }), Ye = re === void 0 ? C : re, Se = (H) => {
     if (ge !== H) {
       Ge(H);
       const ie = H ? ee : G;
@@ -16886,12 +16893,12 @@ const defaultProps$8 = {
     }
   }, qe = D && typeof W == "function";
   let We = null;
-  const ot = c.map((H) => typeof H == "string" ? { label: H, value: H } : H), Ue = groupOptions({ data: ot }), [Re, Be, Xe] = useUncontrolled({
+  const ot = c.map((H) => typeof H == "string" ? { label: H, value: H } : H), Ue = groupOptions({ data: ot }), [Ce, Be, Xe] = useUncontrolled({
     value: u,
     defaultValue: d,
     finalValue: null,
     onChange: p
-  }), Pe = Ue.find((H) => H.value === Re), [Ie, at] = useUncontrolled({
+  }), Pe = Ue.find((H) => H.value === Ce), [Ie, at] = useUncontrolled({
     value: T,
     defaultValue: (Pe == null ? void 0 : Pe.label) || "",
     finalValue: void 0,
@@ -16903,9 +16910,9 @@ const defaultProps$8 = {
     Z || (Be(null), Xe || Oe(""), (H = He.current) == null || H.focus());
   };
   useEffect$1(() => {
-    const H = Ue.find((ie) => ie.value === Re);
-    H ? Oe(H.label) : (!qe || !Re) && Oe("");
-  }, [Re]), useEffect$1(() => {
+    const H = Ue.find((ie) => ie.value === Ce);
+    H ? Oe(H.label) : (!qe || !Ce) && Oe("");
+  }, [Ce]), useEffect$1(() => {
     Pe && (!A || !ge) && Oe(Pe.label);
   }, [Pe == null ? void 0 : Pe.label]);
   const je = (H) => {
@@ -16925,9 +16932,9 @@ const defaultProps$8 = {
     searchable: A,
     limit: j,
     searchValue: Ie,
-    filter: C,
+    filter: R,
     filterDataOnExactSearchMatch: ae,
-    value: Re
+    value: Ce
   });
   qe && J(Ie, he) && (We = W(Ie), he.push({ label: Ie, value: Ie, creatable: !0 }));
   const Qe = (H, ie, ue) => {
@@ -16940,21 +16947,21 @@ const defaultProps$8 = {
   useDidUpdate(() => {
     ve(fe && Ie ? 0 : -1);
   }, [Ie, fe]);
-  const Ve = Re ? he.findIndex((H) => H.value === Re) : 0, Ee = !Z && (he.length > 0 ? ge : ge && !!I), _e = () => {
+  const Ve = Ce ? he.findIndex((H) => H.value === Ce) : 0, Ee = !Z && (he.length > 0 ? ge : ge && !!I), _e = () => {
     ve((H) => {
       var ie;
       const ue = Qe(H, (de) => de - 1, (de) => de > 0);
-      return Le.current = Fe.current[(ie = he[ue]) == null ? void 0 : ie.value], Ee && De({ alignment: Ce ? "start" : "end" }), ue;
+      return Le.current = Fe.current[(ie = he[ue]) == null ? void 0 : ie.value], Ee && De({ alignment: Re ? "start" : "end" }), ue;
     });
   }, $e = () => {
     ve((H) => {
       var ie;
       const ue = Qe(H, (de) => de + 1, (de) => de < he.length - 1);
-      return Le.current = Fe.current[(ie = he[ue]) == null ? void 0 : ie.value], Ee && De({ alignment: Ce ? "end" : "start" }), ue;
+      return Le.current = Fe.current[(ie = he[ue]) == null ? void 0 : ie.value], Ee && De({ alignment: Re ? "end" : "start" }), ue;
     });
   }, Ke = () => window.setTimeout(() => {
     var H;
-    Le.current = Fe.current[(H = he[Ve]) == null ? void 0 : H.value], De({ alignment: Ce ? "end" : "start" });
+    Le.current = Fe.current[(H = he[Ve]) == null ? void 0 : H.value], De({ alignment: Re ? "end" : "start" });
   }, 50);
   useDidUpdate(() => {
     Ee && Ke();
@@ -16962,18 +16969,18 @@ const defaultProps$8 = {
   const N = (H) => {
     switch (typeof g == "function" && g(H), H.key) {
       case "ArrowUp": {
-        H.preventDefault(), ge ? Ce ? _e() : $e() : (ve(Ve), Se(!0), Ke());
+        H.preventDefault(), ge ? Re ? _e() : $e() : (ve(Ve), Se(!0), Ke());
         break;
       }
       case "ArrowDown": {
-        H.preventDefault(), ge ? Ce ? $e() : _e() : (ve(Ve), Se(!0), Ke());
+        H.preventDefault(), ge ? Re ? $e() : _e() : (ve(Ve), Se(!0), Ke());
         break;
       }
       case "Home": {
         if (!A) {
           H.preventDefault(), ge || Se(!0);
           const ie = he.findIndex((ue) => !ue.disabled);
-          ve(ie), Ee && De({ alignment: Ce ? "end" : "start" });
+          ve(ie), Ee && De({ alignment: Re ? "end" : "start" });
         }
         break;
       }
@@ -16981,7 +16988,7 @@ const defaultProps$8 = {
         if (!A) {
           H.preventDefault(), ge || Se(!0);
           const ie = he.map((ue) => !!ue.disabled).lastIndexOf(!1);
-          ve(ie), Ee && De({ alignment: Ce ? "end" : "start" });
+          ve(ie), Ee && De({ alignment: Re ? "end" : "start" });
         }
         break;
       }
@@ -16998,14 +17005,14 @@ const defaultProps$8 = {
     }
   }, M = (H) => {
     typeof h == "function" && h(H);
-    const ie = Ue.find((ue) => ue.value === Re);
+    const ie = Ue.find((ue) => ue.value === Ce);
     F && he[ke] && ge && je(he[ke]), Oe((ie == null ? void 0 : ie.label) || ""), Se(!1);
   }, Y = (H) => {
     typeof b == "function" && b(H), A && Se(!0);
   }, oe = (H) => {
-    Z || (Oe(H.currentTarget.value), R && H.currentTarget.value === "" && Be(null), ve(-1), Se(!0));
+    Z || (Oe(H.currentTarget.value), C && H.currentTarget.value === "" && Be(null), ve(-1), Se(!0));
   }, ce = () => {
-    Z || (Se(!ge), Re && !ge && ve(Ve));
+    Z || (Se(!ge), Ce && !ge && ve(Ve));
   };
   return /* @__PURE__ */ React__default.createElement(Input.Wrapper, __spreadProps$e(__spreadValues$h({}, i), {
     __staticSelector: "Select"
@@ -17036,7 +17043,7 @@ const defaultProps$8 = {
   }, /* @__PURE__ */ React__default.createElement("input", {
     type: "hidden",
     name: Q,
-    value: Re || "",
+    value: Ce || "",
     form: se,
     disabled: k
   }), /* @__PURE__ */ React__default.createElement(Input, __spreadValues$h(__spreadProps$e(__spreadValues$h(__spreadValues$h({
@@ -17068,7 +17075,7 @@ const defaultProps$8 = {
     rightSectionWidth: L,
     styles: w,
     size: a.size,
-    shouldClear: R && !!Pe,
+    shouldClear: C && !!Pe,
     onClear: st,
     error: i.error,
     clearButtonProps: le,
@@ -17088,7 +17095,7 @@ const defaultProps$8 = {
     hovered: ke,
     classNames: E,
     styles: w,
-    isItemSelected: (H) => H === Re,
+    isItemSelected: (H) => H === Ce,
     uuid: a.id,
     __staticSelector: "Select",
     onItemHover: ve,
@@ -17215,15 +17222,15 @@ const Thumb = forwardRef$1(({
   thumbLabel: S,
   onFocus: E,
   onBlur: w,
-  showLabelOnHover: C,
+  showLabelOnHover: R,
   isHovered: P,
   children: A = null,
-  disabled: R,
+  disabled: C,
   unstyled: I,
   thumbSize: j,
   variant: k
 }, O) => {
-  const { classes: T, cx: B, theme: L } = useStyles$d({ color: d, disabled: R, thumbSize: j }, { name: "Slider", classNames: p, styles: m, unstyled: I, variant: k, size: g }), [D, W] = useState$1(!1), J = v || l || D || C && P;
+  const { classes: T, cx: B, theme: L } = useStyles$d({ color: d, disabled: C, thumbSize: j }, { name: "Slider", classNames: p, styles: m, unstyled: I, variant: k, size: g }), [D, W] = useState$1(!1), J = v || l || D || R && P;
   return /* @__PURE__ */ React__default.createElement(Box, {
     tabIndex: 0,
     role: "slider",
@@ -17315,10 +17322,10 @@ function Marks({
   inverted: b,
   variant: x
 }) {
-  const { classes: v, cx: S } = useStyles$c({ color: n, disabled: g, thumbSize: a }, { name: "Slider", classNames: u, styles: d, unstyled: h, variant: x, size: o }), E = r.map((w, C) => /* @__PURE__ */ React__default.createElement(Box, {
+  const { classes: v, cx: S } = useStyles$c({ color: n, disabled: g, thumbSize: a }, { name: "Slider", classNames: u, styles: d, unstyled: h, variant: x, size: o }), E = r.map((w, R) => /* @__PURE__ */ React__default.createElement(Box, {
     className: v.markWrapper,
     sx: { left: `${getPosition({ value: w.value, min: i, max: l })}%` },
-    key: C
+    key: R
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: S(v.mark, {
       [v.markFilled]: isMarkFilled({ mark: w, value: c, offset: p, inverted: b })
@@ -17568,10 +17575,10 @@ const defaultProps$7 = {
     name: S,
     marks: E,
     label: w,
-    labelTransition: C,
+    labelTransition: R,
     labelTransitionDuration: P,
     labelTransitionTimingFunction: A,
-    labelAlwaysOn: R,
+    labelAlwaysOn: C,
     thumbLabel: I,
     showLabelOnHover: j,
     thumbChildren: k,
@@ -17704,10 +17711,10 @@ const defaultProps$7 = {
     size: p,
     label: re,
     ref: _,
-    labelTransition: C,
+    labelTransition: R,
     labelTransitionDuration: P,
     labelTransitionTimingFunction: A,
-    labelAlwaysOn: R,
+    labelAlwaysOn: C,
     classNames: a,
     styles: i,
     thumbLabel: I,
@@ -17991,8 +17998,8 @@ const defaultProps$3 = {}, Tab = forwardRef$1((r, n) => {
     classNames: h.classNames,
     styles: h.styles,
     variant: h.variant
-  }), w = a === h.value, C = h.getPanelId(a), P = h.mountedPanelIds.includes(a) ? C : void 0, A = (R) => {
-    h.onTabChange(h.allowTabDeactivation && a === h.value ? null : a), c == null || c(R);
+  }), w = a === h.value, R = h.getPanelId(a), P = h.mountedPanelIds.includes(a) ? R : void 0, A = (C) => {
+    h.onTabChange(h.allowTabDeactivation && a === h.value ? null : a), c == null || c(C);
   };
   return /* @__PURE__ */ React__default.createElement(UnstyledButton, __spreadProps$5(__spreadValues$6({}, g), {
     unstyled: h.unstyled,
@@ -18044,7 +18051,7 @@ function TabsProvider({
   styles: S,
   unstyled: E
 }) {
-  const w = useId$2(c), [C, P] = useState$1([]), [A, R] = useUncontrolled({
+  const w = useId$2(c), [R, P] = useState$1([]), [A, C] = useUncontrolled({
     value: n,
     defaultValue: r,
     finalValue: null,
@@ -18060,9 +18067,9 @@ function TabsProvider({
       activateTabWithKeyboard: u,
       getTabId: getSafeId(`${w}-tab`, TABS_ERRORS.value),
       getPanelId: getSafeId(`${w}-panel`, TABS_ERRORS.value),
-      onTabChange: R,
+      onTabChange: C,
       setMountedPanelIds: P,
-      mountedPanelIds: C,
+      mountedPanelIds: R,
       allowTabDeactivation: d,
       variant: p,
       color: m,
@@ -18124,10 +18131,10 @@ const defaultProps$2 = {
     classNames: S,
     styles: E,
     radius: w,
-    inverted: C,
+    inverted: R,
     keepMounted: P,
     placement: A
-  } = o, R = __objRest$4(o, [
+  } = o, C = __objRest$4(o, [
     "defaultValue",
     "value",
     "orientation",
@@ -18147,7 +18154,7 @@ const defaultProps$2 = {
     "inverted",
     "keepMounted",
     "placement"
-  ]), { classes: I, cx: j } = useStyles$4({ orientation: l, color: b, radius: w, inverted: C, placement: A }, { unstyled: v, name: "Tabs", classNames: S, styles: E, variant: h });
+  ]), { classes: I, cx: j } = useStyles$4({ orientation: l, color: b, radius: w, inverted: R, placement: A }, { unstyled: v, name: "Tabs", classNames: S, styles: E, variant: h });
   return /* @__PURE__ */ React__default.createElement(TabsProvider, {
     activateTabWithKeyboard: u,
     defaultValue: a,
@@ -18160,13 +18167,13 @@ const defaultProps$2 = {
     color: b,
     variant: h,
     radius: w,
-    inverted: C,
+    inverted: R,
     keepMounted: P,
     placement: A,
     classNames: S,
     styles: E,
     unstyled: v
-  }, /* @__PURE__ */ React__default.createElement(Box, __spreadProps$4(__spreadValues$5({}, R), {
+  }, /* @__PURE__ */ React__default.createElement(Box, __spreadProps$4(__spreadValues$5({}, C), {
     className: j(I.root, x),
     id: m,
     ref: n
@@ -18536,37 +18543,37 @@ const stringify_1 = stringify$1, quote_1 = quote, ROOT_SENTINEL = Symbol("root")
 function stringify(r, n, o, a = {}) {
   const i = typeof o == "string" ? o : " ".repeat(o || 0), l = [], c = /* @__PURE__ */ new Set(), u = /* @__PURE__ */ new Map(), d = /* @__PURE__ */ new Map();
   let p = 0;
-  const { maxDepth: m = 100, references: g = !1, skipUndefinedProperties: h = !1, maxValues: b = 1e5 } = a, x = replacerToString(n), v = (w, C) => {
+  const { maxDepth: m = 100, references: g = !1, skipUndefinedProperties: h = !1, maxValues: b = 1e5 } = a, x = replacerToString(n), v = (w, R) => {
     if (++p > b || h && w === void 0 || l.length > m)
       return;
-    if (C === void 0)
-      return x(w, i, v, C);
-    l.push(C);
-    const P = S(w, C === ROOT_SENTINEL ? void 0 : C);
+    if (R === void 0)
+      return x(w, i, v, R);
+    l.push(R);
+    const P = S(w, R === ROOT_SENTINEL ? void 0 : R);
     return l.pop(), P;
-  }, S = g ? (w, C) => {
+  }, S = g ? (w, R) => {
     if (w !== null && (typeof w == "object" || typeof w == "function" || typeof w == "symbol")) {
       if (u.has(w))
-        return d.set(l.slice(1), u.get(w)), x(void 0, i, v, C);
+        return d.set(l.slice(1), u.get(w)), x(void 0, i, v, R);
       u.set(w, l.slice(1));
     }
-    return x(w, i, v, C);
-  } : (w, C) => {
+    return x(w, i, v, R);
+  } : (w, R) => {
     if (c.has(w))
       return;
     c.add(w);
-    const P = x(w, i, v, C);
+    const P = x(w, i, v, R);
     return c.delete(w), P;
   }, E = v(r, ROOT_SENTINEL);
   if (d.size) {
-    const w = i ? " " : "", C = i ? `
+    const w = i ? " " : "", R = i ? `
 ` : "";
-    let P = `var x${w}=${w}${E};${C}`;
-    for (const [A, R] of d.entries()) {
-      const I = quote_1.stringifyPath(A, v), j = quote_1.stringifyPath(R, v);
-      P += `x${I}${w}=${w}x${j};${C}`;
+    let P = `var x${w}=${w}${E};${R}`;
+    for (const [A, C] of d.entries()) {
+      const I = quote_1.stringifyPath(A, v), j = quote_1.stringifyPath(C, v);
+      P += `x${I}${w}=${w}x${j};${R}`;
     }
-    return `(function${w}()${w}{${C}${P}return x;${C}}())`;
+    return `(function${w}()${w}{${R}${P}return x;${R}}())`;
   }
   return E;
 }
@@ -18617,15 +18624,15 @@ function PanelWithForwardedRef({
     collapsePanel: S,
     expandPanel: E,
     getPanelStyle: w,
-    registerPanel: C,
+    registerPanel: R,
     resizePanel: P,
     unregisterPanel: A
-  } = x, R = useRef({
+  } = x, C = useRef({
     onCollapse: p,
     onResize: m
   });
   if (useEffect(() => {
-    R.current.onCollapse = p, R.current.onResize = m;
+    C.current.onCollapse = p, C.current.onResize = m;
   }), d < 0 || d > 100)
     throw Error(`Panel minSize must be between 0 and 100, but was ${d}`);
   if (u < 0 || u > 100)
@@ -18638,7 +18645,7 @@ function PanelWithForwardedRef({
   const I = w(v, i), j = useRef({
     size: parseSizeFromStyle(I)
   }), k = useRef({
-    callbacksRef: R,
+    callbacksRef: C,
     collapsedSize: o,
     collapsible: a,
     defaultSize: i,
@@ -18649,10 +18656,10 @@ function PanelWithForwardedRef({
     order: g
   });
   return useIsomorphicLayoutEffect(() => {
-    j.current.size = parseSizeFromStyle(I), k.current.callbacksRef = R, k.current.collapsedSize = o, k.current.collapsible = a, k.current.defaultSize = i, k.current.id = v, k.current.idWasAutoGenerated = c == null, k.current.maxSize = u, k.current.minSize = d, k.current.order = g;
-  }), useIsomorphicLayoutEffect(() => (C(v, k), () => {
+    j.current.size = parseSizeFromStyle(I), k.current.callbacksRef = C, k.current.collapsedSize = o, k.current.collapsible = a, k.current.defaultSize = i, k.current.id = v, k.current.idWasAutoGenerated = c == null, k.current.maxSize = u, k.current.minSize = d, k.current.order = g;
+  }), useIsomorphicLayoutEffect(() => (R(v, k), () => {
     A(v);
-  }), [g, v, C, A]), useImperativeHandle(l, () => ({
+  }), [g, v, R, A]), useImperativeHandle(l, () => ({
     collapse: () => S(v),
     expand: () => E(v),
     getCollapsed() {
@@ -18698,10 +18705,10 @@ function adjustByDelta(r, n, o, a, i, l, c, u) {
   const m = panelsMapToSortedArray(n), g = p.concat();
   let h = 0;
   {
-    const v = i < 0 ? a : o, S = m.findIndex((P) => P.current.id === v), E = m[S], w = p[S], C = safeResizePanel(E, Math.abs(i), w, r);
-    if (w === C)
+    const v = i < 0 ? a : o, S = m.findIndex((P) => P.current.id === v), E = m[S], w = p[S], R = safeResizePanel(E, Math.abs(i), w, r);
+    if (w === R)
       return p;
-    C === 0 && w > 0 && c.set(v, w), i = i < 0 ? w - C : C - w;
+    R === 0 && w > 0 && c.set(v, w), i = i < 0 ? w - R : R - w;
   }
   let b = i < 0 ? o : a, x = m.findIndex((v) => v.current.id === b);
   for (; ; ) {
@@ -18827,12 +18834,12 @@ function useWindowSplitterPanelGroupBehavior({
       if (S == null || E == null)
         return () => {
         };
-      let w = 0, C = 100, P = 0, A = 0;
+      let w = 0, R = 100, P = 0, A = 0;
       v.forEach((T) => {
-        T.current.id === S ? (C = T.current.maxSize, w = T.current.minSize) : (P += T.current.minSize, A += T.current.maxSize);
+        T.current.id === S ? (R = T.current.maxSize, w = T.current.minSize) : (P += T.current.minSize, A += T.current.maxSize);
       });
-      const R = Math.min(C, 100 - P), I = Math.max(w, (v.length - 1) * 100 - A), j = getFlexGrow(u, S, i);
-      b.setAttribute("aria-valuemax", "" + Math.round(R)), b.setAttribute("aria-valuemin", "" + Math.round(I)), b.setAttribute("aria-valuenow", "" + Math.round(parseInt(j)));
+      const C = Math.min(R, 100 - P), I = Math.max(w, (v.length - 1) * 100 - A), j = getFlexGrow(u, S, i);
+      b.setAttribute("aria-valuemax", "" + Math.round(C)), b.setAttribute("aria-valuemin", "" + Math.round(I)), b.setAttribute("aria-valuenow", "" + Math.round(parseInt(j)));
       const k = (T) => {
         if (!T.defaultPrevented)
           switch (T.key) {
@@ -18951,10 +18958,10 @@ function getMovement(r, n, o, a, i, l, c) {
         E = -x;
         break;
     }
-    const [w, C] = getResizeHandlePanelIds(n, o, a), P = E < 0 ? w : C, A = a.findIndex((I) => I.current.id === P), R = a[A];
-    if (R.current.collapsible) {
+    const [w, R] = getResizeHandlePanelIds(n, o, a), P = E < 0 ? w : R, A = a.findIndex((I) => I.current.id === P), C = a[A];
+    if (C.current.collapsible) {
       const I = m[A];
-      (I === 0 || I.toPrecision(PRECISION) === R.current.minSize.toPrecision(PRECISION)) && (E = E < 0 ? -R.current.minSize * x : R.current.minSize * x);
+      (I === 0 || I.toPrecision(PRECISION) === C.current.minSize.toPrecision(PRECISION)) && (E = E < 0 ? -C.current.minSize * x : C.current.minSize * x);
     }
     return E;
   } else
@@ -19087,10 +19094,10 @@ function PanelGroupWithForwardedRef({
   useEffect(() => {
     E.current.onLayout = u;
   });
-  const w = useRef({}), [C, P] = useState([]), A = useRef(/* @__PURE__ */ new Map()), R = useRef(0), I = useRef({
+  const w = useRef({}), [R, P] = useState([]), A = useRef(/* @__PURE__ */ new Map()), C = useRef(0), I = useRef({
     direction: a,
     panels: x,
-    sizes: C
+    sizes: R
   });
   useImperativeHandle(l, () => ({
     getLayout: () => {
@@ -19108,13 +19115,13 @@ function PanelGroupWithForwardedRef({
       P(F), callPanelCallbacks(ee, F, G);
     }
   }), []), useIsomorphicLayoutEffect(() => {
-    I.current.direction = a, I.current.panels = x, I.current.sizes = C;
+    I.current.direction = a, I.current.panels = x, I.current.sizes = R;
   }), useWindowSplitterPanelGroupBehavior({
     committedValuesRef: I,
     groupId: g,
     panels: x,
     setSizes: P,
-    sizes: C,
+    sizes: R,
     panelSizeBeforeCollapse: A
   }), useEffect(() => {
     const {
@@ -19128,7 +19135,7 @@ function PanelGroupWithForwardedRef({
       const G = w.current, ee = panelsMapToSortedArray(V);
       callPanelCallbacks(ee, q, G);
     }
-  }, [C]), useIsomorphicLayoutEffect(() => {
+  }, [R]), useIsomorphicLayoutEffect(() => {
     if (I.current.sizes.length === x.size)
       return;
     let V = null;
@@ -19153,12 +19160,12 @@ function PanelGroupWithForwardedRef({
     }
   }, [r, x, d]), useEffect(() => {
     if (r) {
-      if (C.length === 0 || C.length !== x.size)
+      if (R.length === 0 || R.length !== x.size)
         return;
       const F = panelsMapToSortedArray(x);
-      debounceMap[r] || (debounceMap[r] = debounce(savePanelGroupLayout, 100)), debounceMap[r](r, F, C, d);
+      debounceMap[r] || (debounceMap[r] = debounce(savePanelGroupLayout, 100)), debounceMap[r](r, F, R, d);
     }
-  }, [r, x, C, d]);
+  }, [r, x, R, d]);
   const j = useCallback((F, V) => {
     const {
       panels: q
@@ -19171,7 +19178,7 @@ function PanelGroupWithForwardedRef({
       overflow: "hidden"
     } : {
       flexBasis: 0,
-      flexGrow: getFlexGrow(q, F, C),
+      flexGrow: getFlexGrow(q, F, R),
       flexShrink: 1,
       // Without this, Panel sizes may be unintentionally overridden by their content.
       overflow: "hidden",
@@ -19179,7 +19186,7 @@ function PanelGroupWithForwardedRef({
       // This avoid edge cases like nested iframes.
       pointerEvents: i && h !== null ? "none" : void 0
     };
-  }, [h, i, C]), k = useCallback((F, V) => {
+  }, [h, i, R]), k = useCallback((F, V) => {
     v((q) => {
       if (q.has(F))
         return q;
@@ -19201,11 +19208,11 @@ function PanelGroupWithForwardedRef({
     const re = getPanelGroup(g).getBoundingClientRect(), $ = G === "horizontal";
     document.dir === "rtl" && $ && (Q = -Q);
     const ae = $ ? re.width : re.height, se = Q / ae * 100, K = adjustByDelta(q, ee, te, _, se, z, A.current, S.current), Z = !areEqual(z, K);
-    if ((isMouseEvent(q) || isTouchEvent(q)) && R.current != se && setGlobalCursorStyle(Z ? $ ? "horizontal" : "vertical" : $ ? Q < 0 ? "horizontal-min" : "horizontal-max" : Q < 0 ? "vertical-min" : "vertical-max"), Z) {
+    if ((isMouseEvent(q) || isTouchEvent(q)) && C.current != se && setGlobalCursorStyle(Z ? $ ? "horizontal" : "vertical" : $ ? Q < 0 ? "horizontal-min" : "horizontal-max" : Q < 0 ? "vertical-min" : "vertical-max"), Z) {
       const le = w.current;
       P(K), callPanelCallbacks(U, K, le);
     }
-    R.current = se;
+    C.current = se;
   }, [g]), T = useCallback((F) => {
     v((V) => {
       if (!V.has(F))
@@ -19369,7 +19376,7 @@ function PanelResizeHandle$1({
     registerResizeHandle: b,
     startDragging: x,
     stopDragging: v
-  } = p, S = useUniqueId(a), E = m === S, [w, C] = useState(!1), [P, A] = useState(null), R = useCallback(() => {
+  } = p, S = useUniqueId(a), E = m === S, [w, R] = useState(!1), [P, A] = useState(null), C = useCallback(() => {
     u.current.blur(), v();
     const {
       onDragging: k
@@ -19391,10 +19398,10 @@ function PanelResizeHandle$1({
     }, k = (B) => {
       P(B);
     }, T = u.current.ownerDocument;
-    return T.body.addEventListener("contextmenu", R), T.body.addEventListener("mousemove", j), T.body.addEventListener("touchmove", j), T.body.addEventListener("mouseleave", k), window.addEventListener("mouseup", R), window.addEventListener("touchend", R), () => {
-      T.body.removeEventListener("contextmenu", R), T.body.removeEventListener("mousemove", j), T.body.removeEventListener("touchmove", j), T.body.removeEventListener("mouseleave", k), window.removeEventListener("mouseup", R), window.removeEventListener("touchend", R);
+    return T.body.addEventListener("contextmenu", C), T.body.addEventListener("mousemove", j), T.body.addEventListener("touchmove", j), T.body.addEventListener("mouseleave", k), window.addEventListener("mouseup", C), window.addEventListener("touchend", C), () => {
+      T.body.removeEventListener("contextmenu", C), T.body.removeEventListener("mousemove", j), T.body.removeEventListener("touchmove", j), T.body.removeEventListener("mouseleave", k), window.removeEventListener("mouseup", C), window.removeEventListener("touchend", C);
     };
-  }, [g, o, E, P, R]), useWindowSplitterResizeHandlerBehavior({
+  }, [g, o, E, P, C]), useWindowSplitterResizeHandlerBehavior({
     disabled: o,
     handleId: S,
     resizeHandler: P
@@ -19412,8 +19419,8 @@ function PanelResizeHandle$1({
     "data-panel-group-id": h,
     "data-panel-resize-handle-enabled": !o,
     "data-panel-resize-handle-id": S,
-    onBlur: () => C(!1),
-    onFocus: () => C(!0),
+    onBlur: () => R(!1),
+    onFocus: () => R(!0),
     onMouseDown: (j) => {
       x(S, j.nativeEvent);
       const {
@@ -19421,9 +19428,9 @@ function PanelResizeHandle$1({
       } = d.current;
       k && k(!0);
     },
-    onMouseUp: R,
-    onTouchCancel: R,
-    onTouchEnd: R,
+    onMouseUp: C,
+    onTouchCancel: C,
+    onTouchEnd: C,
     onTouchStart: (j) => {
       x(S, j.nativeEvent);
       const {
@@ -19625,21 +19632,21 @@ function JSONNestedNode(r) {
     d ? !1 : x(p, i, g)
   ), w = useCallback$1(() => {
     l && E(!S);
-  }, [l, S]), C = S || u && g === 0 ? renderChildNodes({
+  }, [l, S]), R = S || u && g === 0 ? renderChildNodes({
     ...r,
     circularCache: n,
     level: g + 1
-  }) : null, P = /* @__PURE__ */ React__default.createElement("span", v("nestedNodeItemType", S), b), A = c(h, i, P, a(i, o), p), R = [p, h, S, l];
-  return u ? /* @__PURE__ */ React__default.createElement("li", v("rootNode", ...R), /* @__PURE__ */ React__default.createElement("ul", v("rootNodeChildren", ...R), C)) : /* @__PURE__ */ React__default.createElement("li", v("nestedNode", ...R), l && /* @__PURE__ */ React__default.createElement(JSONArrow, {
+  }) : null, P = /* @__PURE__ */ React__default.createElement("span", v("nestedNodeItemType", S), b), A = c(h, i, P, a(i, o), p), C = [p, h, S, l];
+  return u ? /* @__PURE__ */ React__default.createElement("li", v("rootNode", ...C), /* @__PURE__ */ React__default.createElement("ul", v("rootNodeChildren", ...C), R)) : /* @__PURE__ */ React__default.createElement("li", v("nestedNode", ...C), l && /* @__PURE__ */ React__default.createElement(JSONArrow, {
     styling: v,
     nodeType: h,
     expanded: S,
     onClick: w
-  }), /* @__PURE__ */ React__default.createElement("label", _extends$1({}, v(["label", "nestedNodeLabel"], ...R), {
+  }), /* @__PURE__ */ React__default.createElement("label", _extends$1({}, v(["label", "nestedNodeLabel"], ...C), {
     onClick: w
-  }), m(...R)), /* @__PURE__ */ React__default.createElement("span", _extends$1({}, v("nestedNodeItemString", ...R), {
+  }), m(...C)), /* @__PURE__ */ React__default.createElement("span", _extends$1({}, v("nestedNodeItemString", ...C), {
     onClick: w
-  }), A), /* @__PURE__ */ React__default.createElement("ul", v("nestedNodeChildren", ...R), C));
+  }), A), /* @__PURE__ */ React__default.createElement("ul", v("nestedNodeChildren", ...C), R));
 }
 function createItemString$2(r) {
   const n = Object.getOwnPropertyNames(r).length;
@@ -21818,12 +21825,12 @@ function createCurry(r, n, o) {
 function createHybrid(r, n, o, a, i, l, c, u, d, p) {
   var m = n & ARY_FLAG, g = n & BIND_FLAG, h = n & BIND_KEY_FLAG, b = n & (CURRY_FLAG | CURRY_RIGHT_FLAG), x = n & FLIP_FLAG, v = h ? void 0 : createCtor(r);
   function S() {
-    for (var E = arguments.length, w = Array(E), C = E; C--; )
-      w[C] = arguments[C];
+    for (var E = arguments.length, w = Array(E), R = E; R--; )
+      w[R] = arguments[R];
     if (b)
       var P = getHolder(S), A = countHolders(w, P);
     if (a && (w = composeArgs(w, a, i, b)), l && (w = composeArgsRight(w, l, c, b)), E -= A, b && E < p) {
-      var R = replaceHolders(w, P);
+      var C = replaceHolders(w, P);
       return createRecurry(
         r,
         n,
@@ -21831,7 +21838,7 @@ function createHybrid(r, n, o, a, i, l, c, u, d, p) {
         S.placeholder,
         o,
         w,
-        R,
+        C,
         u,
         d,
         p - E
@@ -22700,9 +22707,9 @@ var Prism$1 = function() {
                 b.hasOwnProperty(w) && (S[w] = b[w]);
             b.hasOwnProperty(E) || (S[E] = v[E]);
           }
-        var C = x[g];
+        var R = x[g];
         return x[g] = S, a.languages.DFS(a.languages, function(P, A) {
-          A === C && P != g && (this[P] = S);
+          A === R && P != g && (this[P] = S);
         }), S;
       },
       // Traverse a language definition with Depth First Search
@@ -22712,8 +22719,8 @@ var Prism$1 = function() {
         for (var E in h)
           if (h.hasOwnProperty(E)) {
             b.call(h, E, h[E], x || E);
-            var w = h[E], C = a.util.type(w);
-            C === "Object" && !v[S(w)] ? (v[S(w)] = !0, g(w, b, null, v)) : C === "Array" && !v[S(w)] && (v[S(w)] = !0, g(w, b, E, v));
+            var w = h[E], R = a.util.type(w);
+            R === "Object" && !v[S(w)] ? (v[S(w)] = !0, g(w, b, null, v)) : R === "Array" && !v[S(w)] && (v[S(w)] = !0, g(w, b, E, v));
           }
       }
     },
@@ -22829,8 +22836,8 @@ var Prism$1 = function() {
       return h;
     if (Array.isArray(h)) {
       var x = "";
-      return h.forEach(function(C) {
-        x += g(C, b);
+      return h.forEach(function(R) {
+        x += g(R, b);
       }), x;
     }
     var v = {
@@ -22861,10 +22868,10 @@ var Prism$1 = function() {
       if (!(!b.hasOwnProperty(E) || !b[E])) {
         var w = b[E];
         w = Array.isArray(w) ? w : [w];
-        for (var C = 0; C < w.length; ++C) {
-          if (S && S.cause == E + "," + C)
+        for (var R = 0; R < w.length; ++R) {
+          if (S && S.cause == E + "," + R)
             return;
-          var P = w[C], A = P.inside, R = !!P.lookbehind, I = !!P.greedy, j = P.alias;
+          var P = w[R], A = P.inside, C = !!P.lookbehind, I = !!P.greedy, j = P.alias;
           if (I && !P.pattern.global) {
             var k = P.pattern.toString().match(/[imsuy]*$/)[0];
             P.pattern = RegExp(P.pattern.source, k + "g");
@@ -22876,7 +22883,7 @@ var Prism$1 = function() {
             if (!(L instanceof i)) {
               var D = 1, W;
               if (I) {
-                if (W = l(O, B, g, R), !W || W.index >= g.length)
+                if (W = l(O, B, g, C), !W || W.index >= g.length)
                   break;
                 var q = W.index, J = W.index + W[0].length, F = B;
                 for (F += T.value.length; q >= F; )
@@ -22886,7 +22893,7 @@ var Prism$1 = function() {
                 for (var V = T; V !== h.tail && (F < J || typeof V.value == "string"); V = V.next)
                   D++, F += V.value.length;
                 D--, L = g.slice(B, F), W.index -= B;
-              } else if (W = l(O, 0, L, R), !W)
+              } else if (W = l(O, 0, L, C), !W)
                 continue;
               var q = W.index, G = W[0], ee = L.slice(0, q), z = L.slice(q + G.length), U = B + L.length;
               S && U > S.reach && (S.reach = U);
@@ -22895,7 +22902,7 @@ var Prism$1 = function() {
               var _ = new i(E, A ? a.tokenize(G, A) : G, j, G);
               if (T = d(h, te, _), z && d(h, T, z), D > 1) {
                 var Q = {
-                  cause: E + "," + C,
+                  cause: E + "," + R,
                   reach: U
                 };
                 c(g, h, b, T.prev, B, Q), S && Q.reach > S.reach && (S.reach = Q.reach);
@@ -24110,8 +24117,8 @@ prism.languages.js = prism.languages.javascript;
           if (S && E && S.type === "code-language" && E.type === "code-block" && typeof S.content == "string") {
             var w = S.content.replace(/\b#/g, "sharp").replace(/\b\+\+/g, "pp");
             w = (/[a-z][\w-]*/i.exec(w) || [""])[0].toLowerCase();
-            var C = "language-" + w;
-            E.alias ? typeof E.alias == "string" ? E.alias = [E.alias, C] : E.alias.push(C) : E.alias = [C];
+            var R = "language-" + w;
+            E.alias ? typeof E.alias == "string" ? E.alias = [E.alias, R] : E.alias.push(R) : E.alias = [R];
           }
         }
     }
@@ -24238,8 +24245,8 @@ prism.hooks.add("after-tokenize", function r(n) {
   }
   function c(v, S) {
     for (var E = 1, w = a; w < o.length; w++) {
-      var C = o[w], P = C.content;
-      if (C.type === "punctuation" && typeof P == "string") {
+      var R = o[w], P = R.content;
+      if (R.type === "punctuation" && typeof P == "string") {
         if (v.test(P))
           E++;
         else if (S.test(P) && (E--, E === 0))
@@ -24376,15 +24383,15 @@ prism.languages.sql = {
         pattern: RegExp(l),
         lookbehind: !0
       }
-    }), E = 0, w = {}, C = S.map(function(I) {
+    }), E = 0, w = {}, R = S.map(function(I) {
       if (typeof I == "string")
         return I;
       for (var j = I.content, k; b.indexOf(k = u(E++, v)) !== -1; )
         ;
       return w[k] = j, k;
-    }).join(""), P = d(C, x, v), A = Object.keys(w);
+    }).join(""), P = d(R, x, v), A = Object.keys(w);
     E = 0;
-    function R(I) {
+    function C(I) {
       for (var j = 0; j < I.length; j++) {
         if (E >= A.length)
           return;
@@ -24399,17 +24406,17 @@ prism.languages.sql = {
             var L = T.substring(0, B), D = p(w[O]), W = T.substring(B + O.length), J = [];
             if (L && J.push(L), J.push(D), W) {
               var F = [W];
-              R(F), J.push.apply(J, F);
+              C(F), J.push.apply(J, F);
             }
             typeof k == "string" ? (I.splice.apply(I, [j, 1].concat(J)), j += J.length - 1) : k.content = J;
           }
         } else {
           var V = k.content;
-          Array.isArray(V) ? R(V) : R([V]);
+          Array.isArray(V) ? C(V) : C([V]);
         }
       }
     }
-    return R(P), new r.Token(v, P, "language-" + v, b);
+    return C(P), new r.Token(v, P, "language-" + v, b);
   }
   var g = {
     javascript: !0,
@@ -24426,21 +24433,21 @@ prism.languages.sql = {
       for (var S = 0, E = v.length; S < E; S++) {
         var w = v[S];
         if (typeof w != "string") {
-          var C = w.content;
-          if (!Array.isArray(C)) {
-            typeof C != "string" && x([C]);
+          var R = w.content;
+          if (!Array.isArray(R)) {
+            typeof R != "string" && x([R]);
             continue;
           }
           if (w.type === "template-string") {
-            var P = C[1];
-            if (C.length === 3 && typeof P != "string" && P.type === "embedded-code") {
-              var A = h(P), R = P.alias, I = Array.isArray(R) ? R[0] : R, j = r.languages[I];
+            var P = R[1];
+            if (R.length === 3 && typeof P != "string" && P.type === "embedded-code") {
+              var A = h(P), C = P.alias, I = Array.isArray(C) ? C[0] : C, j = r.languages[I];
               if (!j)
                 continue;
-              C[1] = m(A, j, I);
+              R[1] = m(A, j, I);
             }
           } else
-            x(C);
+            x(R);
         }
       }
     }
@@ -25886,7 +25893,7 @@ const prismDefaultProps = {
     unstyled: S,
     radius: E,
     getPrismTheme: w,
-    variant: C
+    variant: R
   } = o, P = __objRest$2(o, [
     "className",
     "children",
@@ -25905,13 +25912,13 @@ const prismDefaultProps = {
     "radius",
     "getPrismTheme",
     "variant"
-  ]), A = v && typeof i == "string" ? i.trim() : i, R = A.split(`
+  ]), A = v && typeof i == "string" ? i.trim() : i, C = A.split(`
 `).length.toString().length, I = useMantineTheme(), j = useClipboard(), k = x || I.colorScheme, { classes: O, cx: T } = useStyles$2({
     colorScheme: k,
     native: b !== ScrollArea,
-    maxLineSize: R,
+    maxLineSize: C,
     radius: E
-  }, { name: "Prism", classNames: u, styles: d, unstyled: S, variant: C });
+  }, { name: "Prism", classNames: u, styles: d, unstyled: S, variant: R });
   return /* @__PURE__ */ React__default.createElement(Box, __spreadProps$2(__spreadValues$2({
     className: T(O.root, a),
     ref: n
@@ -26143,8 +26150,8 @@ var diffMatchPatch = { exports: {} };
       ];
     var b = this.diff_halfMatch_(l, c);
     if (b) {
-      var x = b[0], v = b[1], S = b[2], E = b[3], w = b[4], C = this.diff_main(x, S, u, d), P = this.diff_main(v, E, u, d);
-      return C.concat(
+      var x = b[0], v = b[1], S = b[2], E = b[3], w = b[4], R = this.diff_main(x, S, u, d), P = this.diff_main(v, E, u, d);
+      return R.concat(
         [new n.Diff(i, w)],
         P
       );
@@ -26183,14 +26190,14 @@ var diffMatchPatch = { exports: {} };
     for (var d = l.length, p = c.length, m = Math.ceil((d + p) / 2), g = m, h = 2 * m, b = new Array(h), x = new Array(h), v = 0; v < h; v++)
       b[v] = -1, x[v] = -1;
     b[g + 1] = 0, x[g + 1] = 0;
-    for (var S = d - p, E = S % 2 != 0, w = 0, C = 0, P = 0, A = 0, R = 0; R < m && !((/* @__PURE__ */ new Date()).getTime() > u); R++) {
-      for (var I = -R + w; I <= R - C; I += 2) {
+    for (var S = d - p, E = S % 2 != 0, w = 0, R = 0, P = 0, A = 0, C = 0; C < m && !((/* @__PURE__ */ new Date()).getTime() > u); C++) {
+      for (var I = -C + w; I <= C - R; I += 2) {
         var j = g + I, k;
-        I == -R || I != R && b[j - 1] < b[j + 1] ? k = b[j + 1] : k = b[j - 1] + 1;
+        I == -C || I != C && b[j - 1] < b[j + 1] ? k = b[j + 1] : k = b[j - 1] + 1;
         for (var O = k - I; k < d && O < p && l.charAt(k) == c.charAt(O); )
           k++, O++;
         if (b[j] = k, k > d)
-          C += 2;
+          R += 2;
         else if (O > p)
           w += 2;
         else if (E) {
@@ -26202,9 +26209,9 @@ var diffMatchPatch = { exports: {} };
           }
         }
       }
-      for (var L = -R + P; L <= R - A; L += 2) {
+      for (var L = -C + P; L <= C - A; L += 2) {
         var T = g + L, B;
-        L == -R || L != R && x[T - 1] < x[T + 1] ? B = x[T + 1] : B = x[T - 1] + 1;
+        L == -C || L != C && x[T - 1] < x[T + 1] ? B = x[T + 1] : B = x[T - 1] + 1;
         for (var D = B - L; B < d && D < p && l.charAt(d - B - 1) == c.charAt(p - D - 1); )
           B++, D++;
         if (x[T] = B, B > d)
@@ -26283,18 +26290,18 @@ var diffMatchPatch = { exports: {} };
     if (u.length < 4 || d.length * 2 < u.length)
       return null;
     var p = this;
-    function m(C, P, A) {
-      for (var R = C.substring(A, A + Math.floor(C.length / 4)), I = -1, j = "", k, O, T, B; (I = P.indexOf(R, I + 1)) != -1; ) {
+    function m(R, P, A) {
+      for (var C = R.substring(A, A + Math.floor(R.length / 4)), I = -1, j = "", k, O, T, B; (I = P.indexOf(C, I + 1)) != -1; ) {
         var L = p.diff_commonPrefix(
-          C.substring(A),
+          R.substring(A),
           P.substring(I)
         ), D = p.diff_commonSuffix(
-          C.substring(0, A),
+          R.substring(0, A),
           P.substring(0, I)
         );
-        j.length < D + L && (j = P.substring(I - D, I) + P.substring(I, I + L), k = C.substring(0, A - D), O = C.substring(A + L), T = P.substring(0, I - D), B = P.substring(I + L));
+        j.length < D + L && (j = P.substring(I - D, I) + P.substring(I, I + L), k = R.substring(0, A - D), O = R.substring(A + L), T = P.substring(0, I - D), B = P.substring(I + L));
       }
-      return j.length * 2 >= C.length ? [
+      return j.length * 2 >= R.length ? [
         k,
         O,
         T,
@@ -26342,11 +26349,11 @@ var diffMatchPatch = { exports: {} };
       m++;
     }
   }, n.prototype.diff_cleanupSemanticLossless = function(l) {
-    function c(w, C) {
-      if (!w || !C)
+    function c(w, R) {
+      if (!w || !R)
         return 6;
-      var P = w.charAt(w.length - 1), A = C.charAt(0), R = P.match(n.nonAlphaNumericRegex_), I = A.match(n.nonAlphaNumericRegex_), j = R && P.match(n.whitespaceRegex_), k = I && A.match(n.whitespaceRegex_), O = j && P.match(n.linebreakRegex_), T = k && A.match(n.linebreakRegex_), B = O && w.match(n.blanklineEndRegex_), L = T && C.match(n.blanklineStartRegex_);
-      return B || L ? 5 : O || T ? 4 : R && !j && k ? 3 : j || k ? 2 : R || I ? 1 : 0;
+      var P = w.charAt(w.length - 1), A = R.charAt(0), C = P.match(n.nonAlphaNumericRegex_), I = A.match(n.nonAlphaNumericRegex_), j = C && P.match(n.whitespaceRegex_), k = I && A.match(n.whitespaceRegex_), O = j && P.match(n.linebreakRegex_), T = k && A.match(n.linebreakRegex_), B = O && w.match(n.blanklineEndRegex_), L = T && R.match(n.blanklineStartRegex_);
+      return B || L ? 5 : O || T ? 4 : C && !j && k ? 3 : j || k ? 2 : C || I ? 1 : 0;
     }
     for (var u = 1; u < l.length - 1; ) {
       if (l[u - 1][0] == i && l[u + 1][0] == i) {
@@ -26508,15 +26515,15 @@ var diffMatchPatch = { exports: {} };
       for (x = 0, v = S; x < v; )
         m(w, u + v) <= g ? x = v : S = v, v = Math.floor((S - x) / 2 + x);
       S = v;
-      var C = Math.max(1, u - v + 1), P = Math.min(u + v, l.length) + c.length, A = Array(P + 2);
+      var R = Math.max(1, u - v + 1), P = Math.min(u + v, l.length) + c.length, A = Array(P + 2);
       A[P + 1] = (1 << w) - 1;
-      for (var R = P; R >= C; R--) {
-        var I = d[l.charAt(R - 1)];
-        if (w === 0 ? A[R] = (A[R + 1] << 1 | 1) & I : A[R] = (A[R + 1] << 1 | 1) & I | ((E[R + 1] | E[R]) << 1 | 1) | E[R + 1], A[R] & b) {
-          var j = m(w, R - 1);
+      for (var C = P; C >= R; C--) {
+        var I = d[l.charAt(C - 1)];
+        if (w === 0 ? A[C] = (A[C + 1] << 1 | 1) & I : A[C] = (A[C + 1] << 1 | 1) & I | ((E[C + 1] | E[C]) << 1 | 1) | E[C + 1], A[C] & b) {
+          var j = m(w, C - 1);
           if (j <= g)
-            if (g = j, h = R - 1, h > u)
-              C = Math.max(1, 2 * u - h);
+            if (g = j, h = C - 1, h > u)
+              R = Math.max(1, 2 * u - h);
             else
               break;
         }
@@ -26576,19 +26583,19 @@ var diffMatchPatch = { exports: {} };
     if (p.length === 0)
       return [];
     for (var m = [], g = new n.patch_obj(), h = 0, b = 0, x = 0, v = d, S = d, E = 0; E < p.length; E++) {
-      var w = p[E][0], C = p[E][1];
+      var w = p[E][0], R = p[E][1];
       switch (!h && w !== i && (g.start1 = b, g.start2 = x), w) {
         case a:
-          g.diffs[h++] = p[E], g.length2 += C.length, S = S.substring(0, x) + C + S.substring(x);
+          g.diffs[h++] = p[E], g.length2 += R.length, S = S.substring(0, x) + R + S.substring(x);
           break;
         case o:
-          g.length1 += C.length, g.diffs[h++] = p[E], S = S.substring(0, x) + S.substring(x + C.length);
+          g.length1 += R.length, g.diffs[h++] = p[E], S = S.substring(0, x) + S.substring(x + R.length);
           break;
         case i:
-          C.length <= 2 * this.Patch_Margin && h && p.length != E + 1 ? (g.diffs[h++] = p[E], g.length1 += C.length, g.length2 += C.length) : C.length >= 2 * this.Patch_Margin && h && (this.patch_addContext_(g, v), m.push(g), g = new n.patch_obj(), h = 0, v = S, b = x);
+          R.length <= 2 * this.Patch_Margin && h && p.length != E + 1 ? (g.diffs[h++] = p[E], g.length1 += R.length, g.length2 += R.length) : R.length >= 2 * this.Patch_Margin && h && (this.patch_addContext_(g, v), m.push(g), g = new n.patch_obj(), h = 0, v = S, b = x);
           break;
       }
-      w !== a && (b += C.length), w !== o && (x += C.length);
+      w !== a && (b += R.length), w !== o && (x += R.length);
     }
     return h && (this.patch_addContext_(g, v), m.push(g)), m;
   }, n.prototype.patch_deepCopy = function(l) {
@@ -26629,8 +26636,8 @@ var diffMatchPatch = { exports: {} };
             p[m] = !1;
           else {
             this.diff_cleanupSemanticLossless(S);
-            for (var E = 0, w, C = 0; C < l[m].diffs.length; C++) {
-              var P = l[m].diffs[C];
+            for (var E = 0, w, R = 0; R < l[m].diffs.length; R++) {
+              var P = l[m].diffs[R];
               P[0] !== i && (w = this.diff_xIndex(S, E)), P[0] === a ? c = c.substring(0, b + w) + P[1] + c.substring(b + w) : P[0] === o && (c = c.substring(0, b + w) + c.substring(b + this.diff_xIndex(
                 S,
                 E + P[1].length
@@ -27332,7 +27339,7 @@ function requireTemplates() {
   return templates = (p, m) => {
     const g = [], h = [];
     let b = [];
-    if (m.replace(r, (x, v, S, E, w, C) => {
+    if (m.replace(r, (x, v, S, E, w, R) => {
       if (v)
         b.push(l(v));
       else if (E) {
@@ -27343,7 +27350,7 @@ function requireTemplates() {
           throw new Error("Found extraneous } in Chalk template literal");
         h.push(d(p, g)(b.join(""))), b = [], g.pop();
       } else
-        b.push(C);
+        b.push(R);
     }), h.push(b.join("")), g.length > 0) {
       const x = `Chalk template literal is missing ${g.length} closing bracket${g.length === 1 ? "" : "s"} (\`}\`)`;
       throw new Error(x);
@@ -27898,21 +27905,21 @@ const diffFilter$2 = function r(n) {
     arrayIndexOf(S.indices1, l - a) < 0 && (b[`_${l}`] = [d[l], 0, 0], E.push(l));
   let w = !0;
   n.options && n.options.arrays && n.options.arrays.detectMove === !1 && (w = !1);
-  let C = !1;
-  n.options && n.options.arrays && n.options.arrays.includeValueOnMove && (C = !0);
+  let R = !1;
+  n.options && n.options.arrays && n.options.arrays.includeValueOnMove && (R = !0);
   const P = E.length;
   for (l = a; l < g - i; l++) {
     const A = arrayIndexOf(S.indices2, l - a);
     if (A < 0) {
-      let R = !1;
+      let C = !1;
       if (w && P > 0) {
         for (let I = 0; I < P; I++)
           if (c = E[I], matchItems(x, v, c - a, l - a, o)) {
-            b[`_${c}`].splice(1, 2, l, ARRAY_MOVE), C || (b[`_${c}`][0] = ""), u = l, h = new DiffContext(n.left[c], n.right[u]), n.push(h, u), E.splice(I, 1), R = !0;
+            b[`_${c}`].splice(1, 2, l, ARRAY_MOVE), R || (b[`_${c}`][0] = ""), u = l, h = new DiffContext(n.left[c], n.right[u]), n.push(h, u), E.splice(I, 1), C = !0;
             break;
           }
       }
-      R || (b[l] = [p[l]]);
+      C || (b[l] = [p[l]]);
     } else
       c = S.indices1[A] + a, u = S.indices2[A] + a, h = new DiffContext(n.left[c], n.right[u]), n.push(h, u);
   }
@@ -28346,28 +28353,28 @@ chalkColor("green"), chalkColor("red"), chalkColor("gray"), chalkColor("yellow")
 var require_react_is_production_min = __commonJS({
   "node_modules/.pnpm/react-is@16.13.1/node_modules/react-is/cjs/react-is.production.min.js"(r) {
     init_react_shim();
-    var n = typeof Symbol == "function" && Symbol.for, o = n ? Symbol.for("react.element") : 60103, a = n ? Symbol.for("react.portal") : 60106, i = n ? Symbol.for("react.fragment") : 60107, l = n ? Symbol.for("react.strict_mode") : 60108, c = n ? Symbol.for("react.profiler") : 60114, u = n ? Symbol.for("react.provider") : 60109, d = n ? Symbol.for("react.context") : 60110, p = n ? Symbol.for("react.async_mode") : 60111, m = n ? Symbol.for("react.concurrent_mode") : 60111, g = n ? Symbol.for("react.forward_ref") : 60112, h = n ? Symbol.for("react.suspense") : 60113, b = n ? Symbol.for("react.suspense_list") : 60120, x = n ? Symbol.for("react.memo") : 60115, v = n ? Symbol.for("react.lazy") : 60116, S = n ? Symbol.for("react.block") : 60121, E = n ? Symbol.for("react.fundamental") : 60117, w = n ? Symbol.for("react.responder") : 60118, C = n ? Symbol.for("react.scope") : 60119;
-    function P(R) {
-      if (typeof R == "object" && R !== null) {
-        var I = R.$$typeof;
+    var n = typeof Symbol == "function" && Symbol.for, o = n ? Symbol.for("react.element") : 60103, a = n ? Symbol.for("react.portal") : 60106, i = n ? Symbol.for("react.fragment") : 60107, l = n ? Symbol.for("react.strict_mode") : 60108, c = n ? Symbol.for("react.profiler") : 60114, u = n ? Symbol.for("react.provider") : 60109, d = n ? Symbol.for("react.context") : 60110, p = n ? Symbol.for("react.async_mode") : 60111, m = n ? Symbol.for("react.concurrent_mode") : 60111, g = n ? Symbol.for("react.forward_ref") : 60112, h = n ? Symbol.for("react.suspense") : 60113, b = n ? Symbol.for("react.suspense_list") : 60120, x = n ? Symbol.for("react.memo") : 60115, v = n ? Symbol.for("react.lazy") : 60116, S = n ? Symbol.for("react.block") : 60121, E = n ? Symbol.for("react.fundamental") : 60117, w = n ? Symbol.for("react.responder") : 60118, R = n ? Symbol.for("react.scope") : 60119;
+    function P(C) {
+      if (typeof C == "object" && C !== null) {
+        var I = C.$$typeof;
         switch (I) {
           case o:
-            switch (R = R.type, R) {
+            switch (C = C.type, C) {
               case p:
               case m:
               case i:
               case c:
               case l:
               case h:
-                return R;
+                return C;
               default:
-                switch (R = R && R.$$typeof, R) {
+                switch (C = C && C.$$typeof, C) {
                   case d:
                   case g:
                   case v:
                   case x:
                   case u:
-                    return R;
+                    return C;
                   default:
                     return I;
                 }
@@ -28377,44 +28384,44 @@ var require_react_is_production_min = __commonJS({
         }
       }
     }
-    function A(R) {
-      return P(R) === m;
-    }
-    r.AsyncMode = p, r.ConcurrentMode = m, r.ContextConsumer = d, r.ContextProvider = u, r.Element = o, r.ForwardRef = g, r.Fragment = i, r.Lazy = v, r.Memo = x, r.Portal = a, r.Profiler = c, r.StrictMode = l, r.Suspense = h, r.isAsyncMode = function(R) {
-      return A(R) || P(R) === p;
-    }, r.isConcurrentMode = A, r.isContextConsumer = function(R) {
-      return P(R) === d;
-    }, r.isContextProvider = function(R) {
-      return P(R) === u;
-    }, r.isElement = function(R) {
-      return typeof R == "object" && R !== null && R.$$typeof === o;
-    }, r.isForwardRef = function(R) {
-      return P(R) === g;
-    }, r.isFragment = function(R) {
-      return P(R) === i;
-    }, r.isLazy = function(R) {
-      return P(R) === v;
-    }, r.isMemo = function(R) {
-      return P(R) === x;
-    }, r.isPortal = function(R) {
-      return P(R) === a;
-    }, r.isProfiler = function(R) {
-      return P(R) === c;
-    }, r.isStrictMode = function(R) {
-      return P(R) === l;
-    }, r.isSuspense = function(R) {
-      return P(R) === h;
-    }, r.isValidElementType = function(R) {
-      return typeof R == "string" || typeof R == "function" || R === i || R === m || R === c || R === l || R === h || R === b || typeof R == "object" && R !== null && (R.$$typeof === v || R.$$typeof === x || R.$$typeof === u || R.$$typeof === d || R.$$typeof === g || R.$$typeof === E || R.$$typeof === w || R.$$typeof === C || R.$$typeof === S);
+    function A(C) {
+      return P(C) === m;
+    }
+    r.AsyncMode = p, r.ConcurrentMode = m, r.ContextConsumer = d, r.ContextProvider = u, r.Element = o, r.ForwardRef = g, r.Fragment = i, r.Lazy = v, r.Memo = x, r.Portal = a, r.Profiler = c, r.StrictMode = l, r.Suspense = h, r.isAsyncMode = function(C) {
+      return A(C) || P(C) === p;
+    }, r.isConcurrentMode = A, r.isContextConsumer = function(C) {
+      return P(C) === d;
+    }, r.isContextProvider = function(C) {
+      return P(C) === u;
+    }, r.isElement = function(C) {
+      return typeof C == "object" && C !== null && C.$$typeof === o;
+    }, r.isForwardRef = function(C) {
+      return P(C) === g;
+    }, r.isFragment = function(C) {
+      return P(C) === i;
+    }, r.isLazy = function(C) {
+      return P(C) === v;
+    }, r.isMemo = function(C) {
+      return P(C) === x;
+    }, r.isPortal = function(C) {
+      return P(C) === a;
+    }, r.isProfiler = function(C) {
+      return P(C) === c;
+    }, r.isStrictMode = function(C) {
+      return P(C) === l;
+    }, r.isSuspense = function(C) {
+      return P(C) === h;
+    }, r.isValidElementType = function(C) {
+      return typeof C == "string" || typeof C == "function" || C === i || C === m || C === c || C === l || C === h || C === b || typeof C == "object" && C !== null && (C.$$typeof === v || C.$$typeof === x || C.$$typeof === u || C.$$typeof === d || C.$$typeof === g || C.$$typeof === E || C.$$typeof === w || C.$$typeof === R || C.$$typeof === S);
     }, r.typeOf = P;
   }
 }), require_react_is_development = __commonJS({
   "node_modules/.pnpm/react-is@16.13.1/node_modules/react-is/cjs/react-is.development.js"(r) {
     init_react_shim(), process.env.NODE_ENV !== "production" && function() {
-      var n = typeof Symbol == "function" && Symbol.for, o = n ? Symbol.for("react.element") : 60103, a = n ? Symbol.for("react.portal") : 60106, i = n ? Symbol.for("react.fragment") : 60107, l = n ? Symbol.for("react.strict_mode") : 60108, c = n ? Symbol.for("react.profiler") : 60114, u = n ? Symbol.for("react.provider") : 60109, d = n ? Symbol.for("react.context") : 60110, p = n ? Symbol.for("react.async_mode") : 60111, m = n ? Symbol.for("react.concurrent_mode") : 60111, g = n ? Symbol.for("react.forward_ref") : 60112, h = n ? Symbol.for("react.suspense") : 60113, b = n ? Symbol.for("react.suspense_list") : 60120, x = n ? Symbol.for("react.memo") : 60115, v = n ? Symbol.for("react.lazy") : 60116, S = n ? Symbol.for("react.block") : 60121, E = n ? Symbol.for("react.fundamental") : 60117, w = n ? Symbol.for("react.responder") : 60118, C = n ? Symbol.for("react.scope") : 60119;
+      var n = typeof Symbol == "function" && Symbol.for, o = n ? Symbol.for("react.element") : 60103, a = n ? Symbol.for("react.portal") : 60106, i = n ? Symbol.for("react.fragment") : 60107, l = n ? Symbol.for("react.strict_mode") : 60108, c = n ? Symbol.for("react.profiler") : 60114, u = n ? Symbol.for("react.provider") : 60109, d = n ? Symbol.for("react.context") : 60110, p = n ? Symbol.for("react.async_mode") : 60111, m = n ? Symbol.for("react.concurrent_mode") : 60111, g = n ? Symbol.for("react.forward_ref") : 60112, h = n ? Symbol.for("react.suspense") : 60113, b = n ? Symbol.for("react.suspense_list") : 60120, x = n ? Symbol.for("react.memo") : 60115, v = n ? Symbol.for("react.lazy") : 60116, S = n ? Symbol.for("react.block") : 60121, E = n ? Symbol.for("react.fundamental") : 60117, w = n ? Symbol.for("react.responder") : 60118, R = n ? Symbol.for("react.scope") : 60119;
       function P(Z) {
         return typeof Z == "string" || typeof Z == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
-        Z === i || Z === m || Z === c || Z === l || Z === h || Z === b || typeof Z == "object" && Z !== null && (Z.$$typeof === v || Z.$$typeof === x || Z.$$typeof === u || Z.$$typeof === d || Z.$$typeof === g || Z.$$typeof === E || Z.$$typeof === w || Z.$$typeof === C || Z.$$typeof === S);
+        Z === i || Z === m || Z === c || Z === l || Z === h || Z === b || typeof Z == "object" && Z !== null && (Z.$$typeof === v || Z.$$typeof === x || Z.$$typeof === u || Z.$$typeof === d || Z.$$typeof === g || Z.$$typeof === E || Z.$$typeof === w || Z.$$typeof === R || Z.$$typeof === S);
       }
       function A(Z) {
         if (typeof Z == "object" && Z !== null) {
@@ -28448,7 +28455,7 @@ var require_react_is_production_min = __commonJS({
           }
         }
       }
-      var R = p, I = m, j = d, k = u, O = o, T = g, B = i, L = v, D = x, W = a, J = c, F = l, V = h, q = !1;
+      var C = p, I = m, j = d, k = u, O = o, T = g, B = i, L = v, D = 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) || A(Z) === p;
       }
@@ -28488,7 +28495,7 @@ var require_react_is_production_min = __commonJS({
       function K(Z) {
         return A(Z) === h;
       }
-      r.AsyncMode = R, r.ConcurrentMode = I, r.ContextConsumer = j, r.ContextProvider = k, r.Element = O, r.ForwardRef = T, r.Fragment = B, r.Lazy = L, r.Memo = D, 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 = P, r.typeOf = A;
+      r.AsyncMode = C, r.ConcurrentMode = I, r.ContextConsumer = j, r.ContextProvider = k, r.Element = O, r.ForwardRef = T, r.Fragment = B, r.Lazy = L, r.Memo = D, 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 = P, r.typeOf = A;
     }();
   }
 }), require_react_is = __commonJS({
@@ -28620,17 +28627,17 @@ var require_react_is_production_min = __commonJS({
           return U;
       }
       var x = "<<anonymous>>", v = {
-        array: C("array"),
-        bigint: C("bigint"),
-        bool: C("boolean"),
-        func: C("function"),
-        number: C("number"),
-        object: C("object"),
-        string: C("string"),
-        symbol: C("symbol"),
+        array: R("array"),
+        bigint: R("bigint"),
+        bool: R("boolean"),
+        func: R("function"),
+        number: R("number"),
+        object: R("object"),
+        string: R("string"),
+        symbol: R("symbol"),
         any: P(),
         arrayOf: A,
-        element: R(),
+        element: C(),
         elementType: I(),
         instanceOf: j,
         node: B(),
@@ -28670,7 +28677,7 @@ var require_react_is_production_min = __commonJS({
         var Q = _.bind(null, !1);
         return Q.isRequired = _.bind(null, !0), Q;
       }
-      function C(z) {
+      function R(z) {
         function U(te, _, Q, ne, re, $) {
           var ae = te[_], se = V(ae);
           if (se !== z) {
@@ -28705,7 +28712,7 @@ var require_react_is_production_min = __commonJS({
         }
         return w(U);
       }
-      function R() {
+      function C() {
         function z(U, te, _, Q, ne) {
           var re = U[te];
           if (!p(re)) {
@@ -30000,14 +30007,14 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     r.eighties = n(E);
     var w = require_embers();
     r.embers = n(w);
-    var C = require_flat();
-    r.flat = n(C);
+    var R = require_flat();
+    r.flat = n(R);
     var P = require_google();
     r.google = n(P);
     var A = require_grayscale();
     r.grayscale = n(A);
-    var R = require_greenscreen();
-    r.greenscreen = n(R);
+    var C = require_greenscreen();
+    r.greenscreen = n(C);
     var I = require_harmonic();
     r.harmonic = n(I);
     var j = require_hopscotch();
@@ -30243,17 +30250,17 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     }, u.get.rgb = function(m) {
       if (!m)
         return null;
-      var g = /^#([a-f0-9]{3,4})$/i, h = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i, b = /^rgba?\(\s*([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/, x = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/, v = /^(\w+)$/, S = [0, 0, 0, 1], E, w, C;
+      var g = /^#([a-f0-9]{3,4})$/i, h = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i, b = /^rgba?\(\s*([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/, x = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/, v = /^(\w+)$/, S = [0, 0, 0, 1], E, w, R;
       if (E = m.match(h)) {
-        for (C = E[2], E = E[1], w = 0; w < 3; w++) {
+        for (R = E[2], E = E[1], w = 0; w < 3; w++) {
           var P = w * 2;
           S[w] = parseInt(E.slice(P, P + 2), 16);
         }
-        C && (S[3] = parseInt(C, 16) / 255);
+        R && (S[3] = parseInt(R, 16) / 255);
       } else if (E = m.match(g)) {
-        for (E = E[1], C = E[3], w = 0; w < 3; w++)
+        for (E = E[1], R = E[3], w = 0; w < 3; w++)
           S[w] = parseInt(E[w] + E[w], 16);
-        C && (S[3] = parseInt(C + C, 16) / 255);
+        R && (S[3] = parseInt(R + R, 16) / 255);
       } else if (E = m.match(b)) {
         for (w = 0; w < 3; w++)
           S[w] = parseInt(E[w + 1], 0);
@@ -30499,16 +30506,16 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       }
     var c, u, d;
     l.rgb.hsl = function(m) {
-      var g = m[0] / 255, h = m[1] / 255, b = m[2] / 255, x = Math.min(g, h, b), v = Math.max(g, h, b), S = v - x, E, w, C;
-      return v === x ? E = 0 : g === v ? E = (h - b) / S : h === v ? E = 2 + (b - g) / S : b === v && (E = 4 + (g - h) / S), E = Math.min(E * 60, 360), E < 0 && (E += 360), C = (x + v) / 2, v === x ? w = 0 : C <= 0.5 ? w = S / (v + x) : w = S / (2 - v - x), [E, w * 100, C * 100];
+      var g = m[0] / 255, h = m[1] / 255, b = m[2] / 255, x = Math.min(g, h, b), v = Math.max(g, h, b), S = v - x, E, w, R;
+      return v === x ? E = 0 : g === v ? E = (h - b) / S : h === v ? E = 2 + (b - g) / S : b === v && (E = 4 + (g - h) / S), E = Math.min(E * 60, 360), E < 0 && (E += 360), R = (x + v) / 2, v === x ? w = 0 : R <= 0.5 ? w = S / (v + x) : w = S / (2 - v - x), [E, w * 100, R * 100];
     }, l.rgb.hsv = function(m) {
-      var g, h, b, x, v, S = m[0] / 255, E = m[1] / 255, w = m[2] / 255, C = Math.max(S, E, w), P = C - Math.min(S, E, w), A = function(R) {
-        return (C - R) / 6 / P + 1 / 2;
+      var g, h, b, x, v, S = m[0] / 255, E = m[1] / 255, w = m[2] / 255, R = Math.max(S, E, w), P = R - Math.min(S, E, w), A = function(C) {
+        return (R - C) / 6 / P + 1 / 2;
       };
-      return P === 0 ? x = v = 0 : (v = P / C, g = A(S), h = A(E), b = A(w), S === C ? x = b - h : E === C ? x = 1 / 3 + g - b : w === C && (x = 2 / 3 + h - g), x < 0 ? x += 1 : x > 1 && (x -= 1)), [
+      return P === 0 ? x = v = 0 : (v = P / R, g = A(S), h = A(E), b = A(w), S === R ? x = b - h : E === R ? x = 1 / 3 + g - b : w === R && (x = 2 / 3 + h - g), x < 0 ? x += 1 : x > 1 && (x -= 1)), [
         x * 360,
         v * 100,
-        C * 100
+        R * 100
       ];
     }, l.rgb.hwb = function(m) {
       var g = m[0], h = m[1], b = m[2], x = l.rgb.hsl(m)[0], v = 1 / 255 * Math.min(g, Math.min(h, b));
@@ -30546,8 +30553,8 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       if (h === 0)
         return w = b * 255, [w, w, w];
       b < 0.5 ? v = b * (1 + h) : v = b + h - b * h, x = 2 * b - v, E = [0, 0, 0];
-      for (var C = 0; C < 3; C++)
-        S = g + 1 / 3 * -(C - 1), S < 0 && S++, S > 1 && S--, 6 * S < 1 ? w = x + (v - x) * 6 * S : 2 * S < 1 ? w = v : 3 * S < 2 ? w = x + (v - x) * (2 / 3 - S) * 6 : w = x, E[C] = w * 255;
+      for (var R = 0; R < 3; R++)
+        S = g + 1 / 3 * -(R - 1), S < 0 && S++, S > 1 && S--, 6 * S < 1 ? w = x + (v - x) * 6 * S : 2 * S < 1 ? w = v : 3 * S < 2 ? w = x + (v - x) * (2 / 3 - S) * 6 : w = x, E[R] = w * 255;
       return E;
     }, l.hsl.hsv = function(m) {
       var g = m[0], h = m[1] / 100, b = m[2] / 100, x = h, v = Math.max(b, 0.01), S, E;
@@ -30574,30 +30581,30 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     }, l.hwb.rgb = function(m) {
       var g = m[0] / 360, h = m[1] / 100, b = m[2] / 100, x = h + b, v, S, E, w;
       x > 1 && (h /= x, b /= x), v = Math.floor(6 * g), S = 1 - b, E = 6 * g - v, v & 1 && (E = 1 - E), w = h + E * (S - h);
-      var C, P, A;
+      var R, P, A;
       switch (v) {
         default:
         case 6:
         case 0:
-          C = S, P = w, A = h;
+          R = S, P = w, A = h;
           break;
         case 1:
-          C = w, P = S, A = h;
+          R = w, P = S, A = h;
           break;
         case 2:
-          C = h, P = S, A = w;
+          R = h, P = S, A = w;
           break;
         case 3:
-          C = h, P = w, A = S;
+          R = h, P = w, A = S;
           break;
         case 4:
-          C = w, P = h, A = S;
+          R = w, P = h, A = S;
           break;
         case 5:
-          C = S, P = h, A = w;
+          R = S, P = h, A = w;
           break;
       }
-      return [C * 255, P * 255, A * 255];
+      return [R * 255, P * 255, A * 255];
     }, l.cmyk.rgb = function(m) {
       var g = m[0] / 100, h = m[1] / 100, b = m[2] / 100, x = m[3] / 100, v, S, E;
       return v = 1 - Math.min(1, g * (1 - x) + x), S = 1 - Math.min(1, h * (1 - x) + x), E = 1 - Math.min(1, b * (1 - x) + x), [v * 255, S * 255, E * 255];
@@ -30610,8 +30617,8 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     }, l.lab.xyz = function(m) {
       var g = m[0], h = m[1], b = m[2], x, v, S;
       v = (g + 16) / 116, x = h / 500 + v, S = v - b / 200;
-      var E = Math.pow(v, 3), w = Math.pow(x, 3), C = Math.pow(S, 3);
-      return v = E > 8856e-6 ? E : (v - 16 / 116) / 7.787, x = w > 8856e-6 ? w : (x - 16 / 116) / 7.787, S = C > 8856e-6 ? C : (S - 16 / 116) / 7.787, x *= 95.047, v *= 100, S *= 108.883, [x, v, S];
+      var E = Math.pow(v, 3), w = Math.pow(x, 3), R = Math.pow(S, 3);
+      return v = E > 8856e-6 ? E : (v - 16 / 116) / 7.787, x = w > 8856e-6 ? w : (x - 16 / 116) / 7.787, S = R > 8856e-6 ? R : (S - 16 / 116) / 7.787, x *= 95.047, v *= 100, S *= 108.883, [x, v, S];
     }, l.lab.lch = function(m) {
       var g = m[0], h = m[1], b = m[2], x, v, S;
       return x = Math.atan2(b, h), v = x * 360 / 2 / Math.PI, v < 0 && (v += 360), S = Math.sqrt(h * h + b * b), [g, S, v];
@@ -30830,10 +30837,10 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       else if (v instanceof d)
         this.model = v.model, this.color = v.color.slice(), this.valpha = v.valpha;
       else if (typeof v == "string") {
-        var C = o.get(v);
-        if (C === null)
+        var R = o.get(v);
+        if (R === null)
           throw new Error("Unable to parse color from string: " + v);
-        this.model = C.model, w = a[this.model].channels, this.color = C.value.slice(0, w), this.valpha = typeof C.value[w] == "number" ? C.value[w] : 1;
+        this.model = R.model, w = a[this.model].channels, this.color = R.value.slice(0, w), this.valpha = typeof R.value[w] == "number" ? R.value[w] : 1;
       } else if (v.length) {
         this.model = S || "rgb", w = a[this.model].channels;
         var P = i.call(v, 0, w);
@@ -30848,10 +30855,10 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
         this.valpha = 1;
         var A = Object.keys(v);
         "alpha" in v && (A.splice(A.indexOf("alpha"), 1), this.valpha = typeof v.alpha == "number" ? v.alpha : 0);
-        var R = A.sort().join("");
-        if (!(R in c))
+        var C = A.sort().join("");
+        if (!(C in c))
           throw new Error("Unable to parse color from object: " + JSON.stringify(v));
-        this.model = c[R];
+        this.model = c[C];
         var I = a[this.model].labels, j = [];
         for (E = 0; E < I.length; E++)
           j.push(v[I[E]]);
@@ -31007,12 +31014,12 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       mix: function(v, S) {
         if (!v || !v.rgb)
           throw new Error('Argument to "mix" was not a Color instance, but rather an instance of ' + typeof v);
-        var E = v.rgb(), w = this.rgb(), C = S === void 0 ? 0.5 : S, P = 2 * C - 1, A = E.alpha() - w.alpha(), R = ((P * A === -1 ? P : (P + A) / (1 + P * A)) + 1) / 2, I = 1 - R;
+        var E = v.rgb(), w = this.rgb(), R = S === void 0 ? 0.5 : S, P = 2 * R - 1, A = E.alpha() - w.alpha(), C = ((P * A === -1 ? P : (P + A) / (1 + P * A)) + 1) / 2, I = 1 - C;
         return d.rgb(
-          R * E.red() + I * w.red(),
-          R * E.green() + I * w.green(),
-          R * E.blue() + I * w.blue(),
-          E.alpha() * C + w.alpha() * (1 - C)
+          C * E.red() + I * w.red(),
+          C * E.green() + I * w.green(),
+          C * E.blue() + I * w.blue(),
+          E.alpha() * R + w.alpha() * (1 - R)
         );
       }
     }, Object.keys(a).forEach(function(v) {
@@ -31042,8 +31049,8 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       return v = Array.isArray(v) ? v : [v], v.forEach(function(w) {
         (u[w] || (u[w] = []))[S] = E;
       }), v = v[0], function(w) {
-        var C;
-        return arguments.length ? (E && (w = E(w)), C = this[v](), C.color[S] = w, C) : (C = this[v]().color[S], E && (C = E(C)), C);
+        var R;
+        return arguments.length ? (E && (w = E(w)), R = this[v](), R.color[S] = w, R) : (R = this[v]().color[S], E && (R = E(R)), R);
       };
     }
     function h(v) {
@@ -31074,7 +31081,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       ["partial", p],
       ["partialRight", m],
       ["rearg", h]
-    ], C = "[object Function]", P = "[object GeneratorFunction]", A = "[object Symbol]", R = /[\\^$.*+?()[\]{}|]/g, I = /^\s+|\s+$/g, j = /\{(?:\n\/\* \[wrapped with .+\] \*\/)?\n?/, k = /\{\n\/\* \[wrapped with (.+)\] \*/, O = /,? & /, T = /^[-+]0x[0-9a-f]+$/i, B = /^0b[01]+$/i, L = /^\[object .+?Constructor\]$/, D = /^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")();
+    ], R = "[object Function]", P = "[object GeneratorFunction]", A = "[object Symbol]", C = /[\\^$.*+?()[\]{}|]/g, I = /^\s+|\s+$/g, j = /\{(?:\n\/\* \[wrapped with .+\] \*\/)?\n?/, k = /\{\n\/\* \[wrapped with (.+)\] \*/, O = /,? & /, T = /^[-+]0x[0-9a-f]+$/i, B = /^0b[01]+$/i, L = /^\[object .+?Constructor\]$/, D = /^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(N, M, Y) {
       switch (Y.length) {
         case 0:
@@ -31142,7 +31149,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       var N = /[^.]+$/.exec(K && K.keys && K.keys.IE_PROTO || "");
       return N ? "Symbol(src)_1." + N : "";
     }(), le = ae.toString, fe = se.hasOwnProperty, Te = se.toString, be = RegExp(
-      "^" + le.call(fe).replace(R, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
+      "^" + le.call(fe).replace(C, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
     ), Ze = Object.create, Ne = Math.max, ge = Math.min, Ge = function() {
       var N = We(Object, "defineProperty"), M = We.name;
       return M && M.length > 2 ? N : void 0;
@@ -31181,14 +31188,14 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       return M;
     }
     function rt(N, M, Y) {
-      var oe = M & i, ce = Ce(N);
+      var oe = M & i, ce = Re(N);
       function H() {
         var ie = this && this !== q && this instanceof H ? ce : N;
         return ie.apply(oe ? Y : this, arguments);
       }
       return H;
     }
-    function Ce(N) {
+    function Re(N) {
       return function() {
         var M = arguments;
         switch (M.length) {
@@ -31214,7 +31221,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       };
     }
     function De(N, M, Y) {
-      var oe = Ce(N);
+      var oe = Re(N);
       function ce() {
         for (var H = arguments.length, ie = Array(H), ue = H, de = qe(ce); ue--; )
           ie[ue] = arguments[ue];
@@ -31238,7 +31245,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       return ce;
     }
     function Le(N, M, Y, oe, ce, H, ie, ue, de, me) {
-      var pe = M & g, xe = M & i, ye = M & l, we = M & (u | d), it = M & b, et = ye ? void 0 : Ce(N);
+      var pe = M & g, xe = M & i, ye = M & l, we = M & (u | d), it = M & b, et = ye ? void 0 : Re(N);
       function tt() {
         for (var Me = arguments.length, Ae = Array(Me), lt = Me; lt--; )
           Ae[lt] = arguments[lt];
@@ -31260,12 +31267,12 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
           );
         }
         var dt = xe ? Y : this, ct = ye ? dt[N] : N;
-        return Me = Ae.length, ue ? Ae = Xe(Ae, ue) : it && Me > 1 && Ae.reverse(), pe && de < Me && (Ae.length = de), this && this !== q && this instanceof tt && (ct = et || Ce(ct)), ct.apply(dt, Ae);
+        return Me = Ae.length, ue ? Ae = Xe(Ae, ue) : it && Me > 1 && Ae.reverse(), pe && de < Me && (Ae.length = de), this && this !== q && this instanceof tt && (ct = et || Re(ct)), ct.apply(dt, Ae);
       }
       return tt;
     }
     function nt(N, M, Y, oe) {
-      var ce = M & i, H = Ce(N);
+      var ce = M & i, H = Re(N);
       function ie() {
         for (var ue = -1, de = arguments.length, me = -1, pe = oe.length, xe = Array(pe + de), ye = this && this !== q && this instanceof ie ? H : N; ++me < pe; )
           xe[me] = oe[me];
@@ -31326,7 +31333,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
 /* [wrapped with ` + M + `] */
 `);
     }
-    function Re(N, M) {
+    function Ce(N, M) {
       return M = M ?? v, !!M && (typeof N == "number" || W.test(N)) && N > -1 && N % 1 == 0 && N < M;
     }
     function Be(N) {
@@ -31335,7 +31342,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     function Xe(N, M) {
       for (var Y = N.length, oe = ge(M.length, Y), ce = Je(N); oe--; ) {
         var H = M[oe];
-        N[oe] = Re(H, Y) ? ce[H] : void 0;
+        N[oe] = Ce(H, Y) ? ce[H] : void 0;
       }
       return N;
     }
@@ -31373,7 +31380,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     }
     function st(N) {
       var M = je(N) ? Te.call(N) : "";
-      return M == C || M == P;
+      return M == R || M == P;
     }
     function je(N) {
       var M = typeof N;
@@ -31620,10 +31627,10 @@ function useInternalAtomValue(r) {
         return;
       const S = o.get(selectedAtomAtom);
       if (S) {
-        const { l: w = [], t: C } = ((E = n.dev_get_mounted) == null ? void 0 : E.call(n, S.atom)) || {};
+        const { l: w = [], t: R } = ((E = n.dev_get_mounted) == null ? void 0 : E.call(n, S.atom)) || {};
         if (Array.from(w).every(
           isInternalAtomSubscribeFunction
-        ) && C && (C == null ? void 0 : C.size) <= 1)
+        ) && R && (R == null ? void 0 : R.size) <= 1)
           return a(void 0);
       }
     }, h = p == null ? void 0 : p(g, 2), b = n.sub(r, m);
@@ -33449,8 +33456,8 @@ function useSyncSnapshotHistory() {
         } : h[atomToPrintable(E)] = {
           status: "pending"
         } : h[atomToPrintable(E)] = w.v));
-        const C = (S = r.dev_get_mounted) == null ? void 0 : S.call(r, E);
-        C && b.set(E, C.t);
+        const R = (S = r.dev_get_mounted) == null ? void 0 : S.call(r, E);
+        R && b.set(E, R.t);
       }
       c({ values: g, dependents: b }, h);
     }, d = (g) => {
@@ -33896,7 +33903,7 @@ const TabletIcon = ({ landscape: r = !1 }) => /* @__PURE__ */ jsxRuntimeExports.
   return isNull(r) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4 rounded-xl p-4", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(MixerHorizontalIcon, { className: "mx-auto text-3xl" }),
     /* @__PURE__ */ jsxRuntimeExports.jsx("h1", { children: n("please_select_a_block_to_edit") })
-  ] }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorBoundary$1, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(FallbackError, {}), onError: i, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative flex w-full flex-col", children: [
+  ] }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorBoundary$1, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(FallbackError, {}), onError: i, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative flex max-h-full w-full flex-col", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(BlockSettings, {}),
     /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
     /* @__PURE__ */ jsxRuntimeExports.jsx(BlockStyling, {}),
@@ -33916,68 +33923,176 @@ const TabletIcon = ({ landscape: r = !1 }) => /* @__PURE__ */ jsxRuntimeExports.
     /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
     /* @__PURE__ */ jsxRuntimeExports.jsx("br", {})
   ] }) });
-}, SettingsPanel$1 = SettingsPanel, TopBar = lazy(() => import("./Topbar-qT5SdMRK.js")), menuItems = [
-  { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(Layers, { size: 20 }), label: "sidebar.outline", component: Outline$1 },
-  { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(EditIcon, { size: 16 }), label: "sidebar.edit_block", component: SettingsPanel$1 },
-  { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(LightningBoltIcon, { className: "size-5" }), label: "sidebar.ai_assistant", component: AskAI },
-  {
-    icon: /* @__PURE__ */ jsxRuntimeExports.jsx(PaintBucketIcon, { size: 20 }),
-    label: "sidebar.theme",
-    component: () => /* @__PURE__ */ jsxRuntimeExports.jsx(ThemeOptions, { showHeading: !1 })
-  }
-], useAutoSave = () => {
+}, SettingsPanel$1 = SettingsPanel;
+function LayoutCard({ description: r, title: n, selected: o, onSelect: a, children: i }) {
+  const { t: l } = useTranslation();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(Card, { className: `cursor-pointer transition-all ${o ? "ring-2 ring-secondary" : ""}`, onClick: a, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(CardContent, { className: "p-4", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold", children: n }),
+      o && /* @__PURE__ */ jsxRuntimeExports.jsx(CheckIcon, { className: "text-primary" })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mb-4 text-sm text-muted-foreground", children: r }),
+    i,
+    /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, { className: "mt-4 w-full", variant: o ? "default" : "outline", children: l(o ? "Selected" : "Select") })
+  ] }) });
+}
+const ChooseLayout = ({ open: r, close: n }) => {
+  const { t: o } = useTranslation(), [a, i] = useLayoutVariant(), l = (c) => {
+    i(c), n();
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(AlertDialog, { open: r, onOpenChange: () => r ? n() : "", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(AlertDialogContent, { className: "max-w-2xl overflow-hidden", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(AlertDialogHeader, { className: "flex flex-row items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(AlertDialogTitle, { children: o("Choose Builder Layout") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "button",
+        {
+          onClick: () => n(),
+          className: "text-gray-500 hover:text-gray-600 dark:text-gray-400 dark:hover:text-gray-300",
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(Cross2Icon, { className: "h-6 w-6" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "no-scrollbar max-h-full overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        LayoutCard,
+        {
+          title: o("Single side panel"),
+          description: o("Suitable for smaller screens. Bigger canvas size."),
+          selected: a === LAYOUT_VARIANTS.SINGLE_SIDE_PANEL,
+          onSelect: () => l(LAYOUT_VARIANTS.SINGLE_SIDE_PANEL),
+          children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col rounded border border-border", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "borde-b h-4 border-b border-border" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-32", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-1/4 bg-secondary" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-3/4 border-l border-border bg-background" })
+            ] })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        LayoutCard,
+        {
+          title: o("Dual side panel"),
+          description: o("Suitable for larger screens. Blocks settings is always visible."),
+          selected: a === LAYOUT_VARIANTS.DUAL_SIDE_PANEL,
+          onSelect: () => l(LAYOUT_VARIANTS.DUAL_SIDE_PANEL),
+          children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col rounded border border-border", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "borde-b h-4 border-b border-border" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-32", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-1/4 bg-secondary" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-2/4 border-x border-border bg-background" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-1/4 bg-secondary" })
+            ] })
+          ] })
+        }
+      )
+    ] }) })
+  ] }) });
+}, TopBar = lazy(() => import("./Topbar-dKCG36V2.js")), useAutoSave = () => {
   const { savePage: r } = useSavePage(), n = useBuilderProp("autoSaveSupport", !0), o = useBuilderProp("autoSaveInterval", 60);
   useIntervalEffect(() => {
     n && r();
   }, o * 1e3);
 }, RootLayout = () => {
-  const [r, n] = useState$1(0);
-  useChaiBuilderMsgListener(({ name: u }) => {
-    u === CHAI_BUILDER_EVENTS.SHOW_BLOCK_SETTINGS && n(1);
+  const [r, n] = useState$1(0), [o] = useLayoutVariant(), [a, i] = useState$1(!1);
+  useChaiBuilderMsgListener(({ name: g }) => {
+    g === CHAI_BUILDER_EVENTS.SHOW_BLOCK_SETTINGS && n(1);
   });
-  const o = useBuilderProp("sideBarComponents.top", []), a = (u) => {
-    u.preventDefault();
+  const l = useBuilderProp("sideBarComponents.top", []), c = (g) => {
+    g.preventDefault();
   };
   useAtom$1(selectedLibraryAtom), useKeyEventWatcher(), useExpandTree(), useAutoSave();
-  const i = (u) => {
-    n(r === u ? null : u);
-  }, { t: l } = useTranslation(), c = [...menuItems, ...o];
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-screen max-h-full w-screen bg-background text-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(TooltipProvider, { children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { onContextMenu: a, className: "flex h-screen flex-col bg-background text-foreground", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-14 w-screen shrink-0 border-b border-border", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(TopBar, {}) }) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("main", { className: "relative flex h-full flex-1 flex-row", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex w-12 flex-col items-center border-r py-2", children: c.map((u, d) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "button",
-          {
-            className: `mb-2 rounded-lg p-2 text-gray-500 transition-colors ${r === d ? "bg-primary text-white" : "hover:bg-primary hover:text-white"}`,
-            onClick: () => i(d),
-            children: u.icon
-          },
-          d
-        )) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          motion.div,
-          {
-            className: "h-full max-h-full border-r border-border",
-            initial: { width: 280 },
-            animate: { width: r !== null ? 280 : 0 },
-            transition: { duration: 0.3, ease: "easeInOut" },
-            children: r !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "no-scrollbar overflow h-full overflow-x-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col p-3", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("h2", { className: "-mt-1 flex h-10 items-center space-x-1 text-base font-bold", children: [
-                c[r].icon,
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: l(c[r].label) })
-              ] }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "Loading..." }), children: React__default.createElement(c[r].component, {}) }) })
-            ] }) })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full max-h-full flex-1 flex-col bg-slate-800/20", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(CanvasTopBar, {}),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(CanvasArea$1, {}) })
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(AddBlocksDialog, {})
+  const u = (g) => {
+    n(r === g ? null : g);
+  }, d = useMemo$1(() => {
+    const g = [
+      { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(Layers, { size: 20 }), label: "sidebar.outline", component: Outline$1 },
+      o === LAYOUT_VARIANTS.SINGLE_SIDE_PANEL ? { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(EditIcon, { size: 16 }), label: "sidebar.edit_block", component: SettingsPanel$1 } : null,
+      { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(LightningBoltIcon, { className: "size-5" }), label: "sidebar.ai_assistant", component: AskAI },
+      {
+        icon: /* @__PURE__ */ jsxRuntimeExports.jsx(PaintBucketIcon, { size: 20 }),
+        label: "sidebar.theme",
+        component: () => /* @__PURE__ */ jsxRuntimeExports.jsx(ThemeOptions, { showHeading: !1 })
+      }
+    ];
+    return compact(g);
+  }, [o]), { t: p } = useTranslation(), m = [...d, ...l];
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-screen max-h-full w-screen overflow-x-hidden bg-background text-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(TooltipProvider, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        onContextMenu: c,
+        className: "flex h-screen max-h-full flex-col bg-background text-foreground",
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-14 w-screen shrink-0 border-b border-border", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(TopBar, {}) }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("main", { className: "relative flex h-[calc(100vh-56px)] max-w-full flex-1 flex-row", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex w-12 flex-col items-center justify-between border-r py-2", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col", children: m.map((g, h) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip$1, { children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: !0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  "button",
+                  {
+                    className: `mb-2 rounded-lg p-2 text-gray-500 transition-colors ${r === h ? "bg-primary text-white" : "hover:bg-primary hover:text-white"}`,
+                    onClick: () => u(h),
+                    children: g.icon
+                  },
+                  h
+                ) }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { side: "right", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: p(g.label) }) })
+              ] })) }),
+              /* @__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.jsx(
+              motion.div,
+              {
+                className: "h-full max-h-full border-r border-border",
+                initial: { width: 280 },
+                animate: { width: r !== null ? 280 : 0 },
+                transition: { duration: 0.3, ease: "easeInOut" },
+                children: r !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "no-scrollbar overflow h-full overflow-x-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col p-3", children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("h2", { className: "-mt-1 flex h-10 items-center space-x-1 text-base font-bold", children: [
+                    m[r].icon,
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: p(m[r].label) })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "Loading..." }), children: React__default.createElement(m[r].component, {}) }) })
+                ] }) })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full max-h-full flex-1 flex-col bg-slate-800/20", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(CanvasTopBar, {}),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(CanvasArea$1, {}) })
+            ] }),
+            o !== LAYOUT_VARIANTS.SINGLE_SIDE_PANEL ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+              motion.div,
+              {
+                className: "h-full max-h-full border-l border-border",
+                initial: { width: 280 },
+                animate: { width: 280 },
+                transition: { duration: 0.3, ease: "easeInOut" },
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "no-scrollbar overflow h-full max-h-full overflow-x-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex max-h-full flex-col p-3", children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("h2", { className: "-mt-1 flex h-10 items-center space-x-1 text-base font-bold", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx(EditIcon, { size: "16" }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: p("Block Settings") })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "Loading..." }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(SettingsPanel$1, {}) }) })
+                ] }) })
+              }
+            ) : null
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(AddBlocksDialog, {}),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(ChooseLayout, { open: a, close: () => i(!1) })
   ] }) });
 }, builderStore = getDefaultStore$1(), SmallScreenMessage = () => /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "h-screen w-screen bg-gray-900 py-12 sm:py-16 lg:py-20 xl:hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mx-auto max-w-md text-center", children: [
   /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -34075,6 +34190,8 @@ export {
   useAddBlockParent as a6,
   useSelectedBreakpoints as a7,
   useSelectedStylingBlocks as a8,
+  useLayoutVariant as a9,
+  useBlocksStoreUndoableActions as aa,
   useUpdateBlocksProps as b,
   useUpdateBlocksPropsRealtime as c,
   useBuilderProp as d,