likec4 1.17.0 → 1.17.1

package/dist/__app__/src/chunks/{mantine-CdYQpHSU.js → mantine-BzD51ZKm.js}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import React__default, { useState, Fragment, createContext, useContext, useRef, useEffect, useMemo, useCallback, useLayoutEffect, useId as useId$2, forwardRef, cloneElement, Children, createElement } from "react";
+import React__default, { useState, Fragment, createContext, useContext, useRef, useEffect, useMemo, useCallback, useLayoutEffect, useId as useId$2, forwardRef, cloneElement, Children, createElement, useSyncExternalStore } from "react";
 import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
 import * as ReactDOM from "react-dom";
 import ReactDOM__default, { createPortal } from "react-dom";
@@ -399,7 +399,7 @@ function RemoveScrollSideCar(props) {
     }
   }, [props.inert, props.lockRef.current, props.shards]);
   var shouldCancelEvent = React.useCallback(function(event, parent) {
-    if ("touches" in event && event.touches.length === 2)
+    if ("touches" in event && event.touches.length === 2 || event.type === "wheel" && event.ctrlKey)
       return !lastProps.current.allowPinchZoom;
     var touch = getTouchXY(event), touchStart = touchStartRef.current, deltaX = "deltaX" in event ? event.deltaX : touchStart[0] - touch[0], deltaY = "deltaY" in event ? event.deltaY : touchStart[1] - touch[1], currentAxis, target = event.target, moveDirection = Math.abs(deltaX) > Math.abs(deltaY) ? "h" : "v";
     if ("touches" in event && moveDirection === "h" && target.type === "range")
@@ -812,24 +812,6 @@ function useFocusReturn({ opened, shouldReturnFocus = !0 }) {
     };
   }, [opened, shouldReturnFocus]), returnFocus;
 }
-function createAriaHider(containerNode, selector = "body > :not(script)") {
-  const id = randomId(), rootNodes = Array.from(
-    document.querySelectorAll(selector)
-  ).map((node) => {
-    if (node?.shadowRoot?.contains(containerNode) || node.contains(containerNode))
-      return;
-    const ariaHidden = node.getAttribute("aria-hidden"), prevAriaHidden = node.getAttribute("data-hidden"), prevFocusId = node.getAttribute("data-focus-id");
-    return node.setAttribute("data-focus-id", id), ariaHidden === null || ariaHidden === "false" ? node.setAttribute("aria-hidden", "true") : !prevAriaHidden && !prevFocusId && node.setAttribute("data-hidden", ariaHidden), {
-      node,
-      ariaHidden: prevAriaHidden || null
-    };
-  });
-  return () => {
-    rootNodes.forEach((item) => {
-      !item || id !== item.node.getAttribute("data-focus-id") || (item.ariaHidden === null ? item.node.removeAttribute("aria-hidden") : item.node.setAttribute("aria-hidden", item.ariaHidden), item.node.removeAttribute("data-focus-id"), item.node.removeAttribute("data-hidden"));
-    });
-  };
-}
 const TABBABLE_NODES = /input|select|textarea|button|object/, FOCUS_SELECTOR = "a, input, select, textarea, button, object, [tabindex]";
 function hidden(element) {
   return element.style.display === "none";
@@ -878,7 +860,7 @@ function scopeTab(node, event) {
   target && target.focus();
 }
 function useFocusTrap(active = !0) {
-  const ref = useRef(), restoreAria = useRef(null), focusNode = (node) => {
+  const ref = useRef(), focusNode = (node) => {
     let focusElement = node.querySelector("[data-autofocus]");
     if (!focusElement) {
       const children = Array.from(node.querySelectorAll(FOCUS_SELECTOR));
@@ -887,15 +869,9 @@ function useFocusTrap(active = !0) {
     focusElement && focusElement.focus({ preventScroll: !0 });
   }, setRef = useCallback(
     (node) => {
-      if (active) {
-        if (node === null) {
-          restoreAria.current && (restoreAria.current(), restoreAria.current = null);
-          return;
-        }
-        restoreAria.current = createAriaHider(node), ref.current !== node && (node ? (setTimeout(() => {
-          node.getRootNode() && focusNode(node);
-        }), ref.current = node) : ref.current = null);
-      }
+      active && node !== null && ref.current !== node && (node ? (setTimeout(() => {
+        node.getRootNode() && focusNode(node);
+      }), ref.current = node) : ref.current = null);
     },
     [active]
   );
@@ -906,9 +882,7 @@ function useFocusTrap(active = !0) {
     const handleKeyDown = (event) => {
       event.key === "Tab" && ref.current && scopeTab(ref.current, event);
     };
-    return document.addEventListener("keydown", handleKeyDown), () => {
-      document.removeEventListener("keydown", handleKeyDown), restoreAria.current && restoreAria.current();
-    };
+    return document.addEventListener("keydown", handleKeyDown), () => document.removeEventListener("keydown", handleKeyDown);
   }, [active]), setRef;
 }
 const __useId = React__default.useId || (() => {
@@ -1135,11 +1109,12 @@ function parseHotkey(hotkey) {
     ctrl: keys2.includes("ctrl"),
     meta: keys2.includes("meta"),
     mod: keys2.includes("mod"),
-    shift: keys2.includes("shift")
+    shift: keys2.includes("shift"),
+    plus: keys2.includes("[plus]")
   }, reservedKeys = ["alt", "ctrl", "meta", "shift", "mod"], freeKey = keys2.find((key) => !reservedKeys.includes(key));
   return {
     ...modifiers,
-    key: freeKey
+    key: freeKey === "[plus]" ? "+" : freeKey
   };
 }
 function isExactHotkey(hotkey, event) {
@@ -1271,6 +1246,15 @@ function memoize(func) {
     return cache.set(key, result), result;
   };
 }
+function findClosestNumber(value, numbers) {
+  return numbers.length === 0 ? value : numbers.reduce(
+    (prev, curr) => Math.abs(curr - value) < Math.abs(prev - value) ? curr : prev
+  );
+}
+function getRefProp(element) {
+  const version = React__default.version;
+  return typeof React__default.version != "string" || version.startsWith("18.") ? element?.ref : element?.props?.ref;
+}
 function r(e) {
   var t, f, n = "";
   if (typeof e == "string" || typeof e == "number") n += e;
@@ -2826,7 +2810,7 @@ const STYlE_PROPS_DATA = {
   bgr: { type: "identity", property: "backgroundRepeat" },
   bga: { type: "identity", property: "backgroundAttachment" },
   pos: { type: "identity", property: "position" },
-  top: { type: "identity", property: "top" },
+  top: { type: "size", property: "top" },
   left: { type: "size", property: "left" },
   bottom: { type: "size", property: "bottom" },
   right: { type: "size", property: "right" },
@@ -3115,11 +3099,11 @@ const Corner = forwardRef((props, ref) => {
 }), ScrollAreaCorner = forwardRef((props, ref) => {
   const ctx = useScrollAreaContext(), hasBothScrollbarsVisible = !!(ctx.scrollbarX && ctx.scrollbarY);
   return ctx.type !== "scroll" && hasBothScrollbarsVisible ? /* @__PURE__ */ jsx(Corner, { ...props, ref }) : null;
-}), defaultProps$1u = {
+}), defaultProps$1I = {
   scrollHideDelay: 1e3,
   type: "hover"
 }, ScrollAreaRoot = forwardRef((_props, ref) => {
-  const props = useProps("ScrollAreaRoot", defaultProps$1u, _props), { type, scrollHideDelay, scrollbars, ...others } = props, [scrollArea, setScrollArea] = useState(null), [viewport, setViewport] = useState(null), [content, setContent] = useState(null), [scrollbarX, setScrollbarX] = useState(null), [scrollbarY, setScrollbarY] = useState(null), [cornerWidth, setCornerWidth] = useState(0), [cornerHeight, setCornerHeight] = useState(0), [scrollbarXEnabled, setScrollbarXEnabled] = useState(!1), [scrollbarYEnabled, setScrollbarYEnabled] = useState(!1), rootRef = useMergedRef(ref, (node) => setScrollArea(node));
+  const props = useProps("ScrollAreaRoot", defaultProps$1I, _props), { type, scrollHideDelay, scrollbars, ...others } = props, [scrollArea, setScrollArea] = useState(null), [viewport, setViewport] = useState(null), [content, setContent] = useState(null), [scrollbarX, setScrollbarX] = useState(null), [scrollbarY, setScrollbarY] = useState(null), [cornerWidth, setCornerWidth] = useState(0), [cornerHeight, setCornerHeight] = useState(0), [scrollbarXEnabled, setScrollbarXEnabled] = useState(!1), [scrollbarYEnabled, setScrollbarYEnabled] = useState(!1), rootRef = useMergedRef(ref, (node) => setScrollArea(node));
   return /* @__PURE__ */ jsx(
     ScrollAreaProvider,
     {
@@ -3544,17 +3528,17 @@ const ScrollAreaViewport = forwardRef(
   }
 );
 ScrollAreaViewport.displayName = "@mantine/core/ScrollAreaViewport";
-var __default__$H = { root: "m_d57069b5", viewport: "m_c0783ff9", viewportInner: "m_f8f631dd", scrollbar: "m_c44ba933", thumb: "m_d8b5e363", corner: "m_21657268" };
-const classes$H = __default__$H, defaultProps$1t = {
+var __default__$J = { root: "m_d57069b5", viewport: "m_c0783ff9", viewportInner: "m_f8f631dd", scrollbar: "m_c44ba933", thumb: "m_d8b5e363", corner: "m_21657268" };
+const classes$J = __default__$J, defaultProps$1H = {
   scrollHideDelay: 1e3,
   type: "hover",
   scrollbars: "xy"
-}, varsResolver$I = (_, { scrollbarSize }) => ({
+}, varsResolver$J = (_, { scrollbarSize }) => ({
   root: {
     "--scrollarea-scrollbar-size": rem(scrollbarSize)
   }
 }), ScrollArea = factory((_props, ref) => {
-  const props = useProps("ScrollArea", defaultProps$1t, _props), {
+  const props = useProps("ScrollArea", defaultProps$1H, _props), {
     classNames,
     className,
     style,
@@ -3576,14 +3560,14 @@ const classes$H = __default__$H, defaultProps$1t = {
   } = props, [scrollbarHovered, setScrollbarHovered] = useState(!1), getStyles2 = useStyles({
     name: "ScrollArea",
     props,
-    classes: classes$H,
+    classes: classes$J,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$I
+    varsResolver: varsResolver$J
   });
   return /* @__PURE__ */ jsxs(
     ScrollAreaRoot,
@@ -3669,7 +3653,7 @@ const ScrollAreaAutosize = factory((props, ref) => {
     onBottomReached,
     onTopReached,
     ...others
-  } = useProps("ScrollAreaAutosize", defaultProps$1t, props);
+  } = useProps("ScrollAreaAutosize", defaultProps$1H, props);
   return /* @__PURE__ */ jsx(Box, { ...others, ref, style: [{ display: "flex", overflow: "auto" }, style], children: /* @__PURE__ */ jsx(Box, { style: { display: "flex", flexDirection: "column", flex: 1 }, children: /* @__PURE__ */ jsx(
     ScrollArea,
     {
@@ -3693,16 +3677,16 @@ const ScrollAreaAutosize = factory((props, ref) => {
     }
   ) }) });
 });
-ScrollArea.classes = classes$H;
+ScrollArea.classes = classes$J;
 ScrollAreaAutosize.displayName = "@mantine/core/ScrollAreaAutosize";
-ScrollAreaAutosize.classes = classes$H;
+ScrollAreaAutosize.classes = classes$J;
 ScrollArea.Autosize = ScrollAreaAutosize;
-var __default__$G = { root: "m_87cf2631" };
-const classes$G = __default__$G, defaultProps$1s = {
+var __default__$I = { root: "m_87cf2631" };
+const classes$I = __default__$I, defaultProps$1G = {
   __staticSelector: "UnstyledButton"
 }, UnstyledButton = polymorphicFactory(
   (_props, ref) => {
-    const props = useProps("UnstyledButton", defaultProps$1s, _props), {
+    const props = useProps("UnstyledButton", defaultProps$1G, _props), {
       className,
       component = "button",
       __staticSelector,
@@ -3714,7 +3698,7 @@ const classes$G = __default__$G, defaultProps$1s = {
     } = props, getStyles2 = useStyles({
       name: __staticSelector,
       props,
-      classes: classes$G,
+      classes: classes$I,
       className,
       style,
       classNames,
@@ -3733,13 +3717,13 @@ const classes$G = __default__$G, defaultProps$1s = {
     );
   }
 );
-UnstyledButton.classes = classes$G;
+UnstyledButton.classes = classes$I;
 UnstyledButton.displayName = "@mantine/core/UnstyledButton";
-var __default__$F = { root: "m_515a97f8" };
-const classes$F = __default__$F, defaultProps$1r = {}, VisuallyHidden = factory((_props, ref) => {
-  const props = useProps("VisuallyHidden", defaultProps$1r, _props), { classNames, className, style, styles, unstyled, vars, ...others } = props, getStyles2 = useStyles({
+var __default__$H = { root: "m_515a97f8" };
+const classes$H = __default__$H, defaultProps$1F = {}, VisuallyHidden = factory((_props, ref) => {
+  const props = useProps("VisuallyHidden", defaultProps$1F, _props), { classNames, className, style, styles, unstyled, vars, ...others } = props, getStyles2 = useStyles({
     name: "VisuallyHidden",
-    classes: classes$F,
+    classes: classes$H,
     props,
     className,
     style,
@@ -3749,16 +3733,16 @@ const classes$F = __default__$F, defaultProps$1r = {}, VisuallyHidden = factory(
   });
   return /* @__PURE__ */ jsx(Box, { component: "span", ref, ...getStyles2("root"), ...others });
 });
-VisuallyHidden.classes = classes$F;
+VisuallyHidden.classes = classes$H;
 VisuallyHidden.displayName = "@mantine/core/VisuallyHidden";
-var __default__$E = { root: "m_1b7284a3" };
-const classes$E = __default__$E, defaultProps$1q = {}, varsResolver$H = (_, { radius, shadow }) => ({
+var __default__$G = { root: "m_1b7284a3" };
+const classes$G = __default__$G, defaultProps$1E = {}, varsResolver$I = (_, { radius, shadow }) => ({
   root: {
     "--paper-radius": radius === void 0 ? void 0 : getRadius(radius),
     "--paper-shadow": getShadow(shadow)
   }
 }), Paper = polymorphicFactory((_props, ref) => {
-  const props = useProps("Paper", defaultProps$1q, _props), {
+  const props = useProps("Paper", defaultProps$1E, _props), {
     classNames,
     className,
     style,
@@ -3774,14 +3758,14 @@ const classes$E = __default__$E, defaultProps$1q = {}, varsResolver$H = (_, { ra
   } = props, getStyles2 = useStyles({
     name: "Paper",
     props,
-    classes: classes$E,
+    classes: classes$G,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$H
+    varsResolver: varsResolver$I
   });
   return /* @__PURE__ */ jsx(
     Box,
@@ -3794,8 +3778,11 @@ const classes$E = __default__$E, defaultProps$1q = {}, varsResolver$H = (_, { ra
     }
   );
 });
-Paper.classes = classes$E;
+Paper.classes = classes$G;
 Paper.displayName = "@mantine/core/Paper";
+function hasWindow() {
+  return typeof window < "u";
+}
 function getNodeName(node) {
   return isNode(node) ? (node.nodeName || "").toLowerCase() : "#document";
 }
@@ -3808,16 +3795,16 @@ function getDocumentElement(node) {
   return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
 }
 function isNode(value) {
-  return value instanceof Node || value instanceof getWindow(value).Node;
+  return hasWindow() ? value instanceof Node || value instanceof getWindow(value).Node : !1;
 }
 function isElement(value) {
-  return value instanceof Element || value instanceof getWindow(value).Element;
+  return hasWindow() ? value instanceof Element || value instanceof getWindow(value).Element : !1;
 }
 function isHTMLElement(value) {
-  return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
+  return hasWindow() ? value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement : !1;
 }
 function isShadowRoot(value) {
-  return typeof ShadowRoot > "u" ? !1 : value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
+  return !hasWindow() || typeof ShadowRoot > "u" ? !1 : value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
 }
 function isOverflowElement(element) {
   const {
@@ -3840,17 +3827,17 @@ function isTopLayer(element) {
     }
   });
 }
-function isContainingBlock(element) {
-  const webkit = isWebKit(), css = getComputedStyle$1(element);
+function isContainingBlock(elementOrCss) {
+  const webkit = isWebKit(), css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
   return css.transform !== "none" || css.perspective !== "none" || (css.containerType ? css.containerType !== "normal" : !1) || !webkit && (css.backdropFilter ? css.backdropFilter !== "none" : !1) || !webkit && (css.filter ? css.filter !== "none" : !1) || ["transform", "perspective", "filter"].some((value) => (css.willChange || "").includes(value)) || ["paint", "layout", "strict", "content"].some((value) => (css.contain || "").includes(value));
 }
 function getContainingBlock(element) {
   let currentNode = getParentNode(element);
   for (; isHTMLElement(currentNode) && !isLastTraversableNode(currentNode); ) {
-    if (isTopLayer(currentNode))
-      return null;
     if (isContainingBlock(currentNode))
       return currentNode;
+    if (isTopLayer(currentNode))
+      return null;
     currentNode = getParentNode(currentNode);
   }
   return null;
@@ -3893,7 +3880,14 @@ function getOverflowAncestors(node, list, traverseIframes) {
   var _node$ownerDocument2;
   list === void 0 && (list = []), traverseIframes === void 0 && (traverseIframes = !0);
   const scrollableAncestor = getNearestOverflowAncestor(node), isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body), win = getWindow(scrollableAncestor);
-  return isBody ? list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], win.frameElement && traverseIframes ? getOverflowAncestors(win.frameElement) : []) : list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
+  if (isBody) {
+    const frameElement = getFrameElement(win);
+    return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
+  }
+  return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
+}
+function getFrameElement(win) {
+  return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
 }
 function activeElement(doc) {
   let activeElement2 = doc.activeElement;
@@ -5046,7 +5040,7 @@ function useFloating$1(options) {
     node !== referenceRef.current && (referenceRef.current = node, _setReference(node));
   }, []), setFloating = React.useCallback((node) => {
     node !== floatingRef.current && (floatingRef.current = node, _setFloating(node));
-  }, []), referenceEl = externalReference || _reference, floatingEl = externalFloating || _floating, referenceRef = React.useRef(null), floatingRef = React.useRef(null), dataRef = React.useRef(data), hasWhileElementsMounted = whileElementsMounted != null, whileElementsMountedRef = useLatestRef$1(whileElementsMounted), platformRef = useLatestRef$1(platform2), update = React.useCallback(() => {
+  }, []), referenceEl = externalReference || _reference, floatingEl = externalFloating || _floating, referenceRef = React.useRef(null), floatingRef = React.useRef(null), dataRef = React.useRef(data), hasWhileElementsMounted = whileElementsMounted != null, whileElementsMountedRef = useLatestRef$1(whileElementsMounted), platformRef = useLatestRef$1(platform2), openRef = useLatestRef$1(open), update = React.useCallback(() => {
     if (!referenceRef.current || !floatingRef.current)
       return;
     const config = {
@@ -5057,13 +5051,17 @@ function useFloating$1(options) {
     platformRef.current && (config.platform = platformRef.current), computePosition(referenceRef.current, floatingRef.current, config).then((data2) => {
       const fullData = {
         ...data2,
-        isPositioned: !0
+        // The floating element's position may be recomputed while it's closed
+        // but still mounted (such as when transitioning out). To ensure
+        // `isPositioned` will be `false` initially on the next open, avoid
+        // setting it to `true` when `open === false` (must be specified).
+        isPositioned: openRef.current !== !1
       };
       isMountedRef.current && !deepEqual(dataRef.current, fullData) && (dataRef.current = fullData, ReactDOM.flushSync(() => {
         setData(fullData);
       }));
     });
-  }, [latestMiddleware, placement, strategy, platformRef]);
+  }, [latestMiddleware, placement, strategy, platformRef, openRef]);
   index$1(() => {
     open === !1 && dataRef.current.isPositioned && (dataRef.current.isPositioned = !1, setData((data2) => ({
       ...data2,
@@ -5238,7 +5236,7 @@ function useHover(context, props) {
     restMs = 0,
     move = !0
   } = props, tree = useFloatingTree(), parentId = useFloatingParentNodeId(), handleCloseRef = useLatestRef(handleClose), delayRef = useLatestRef(delay), openRef = useLatestRef(open), pointerTypeRef = React.useRef(), timeoutRef = React.useRef(-1), handlerRef = React.useRef(), restTimeoutRef = React.useRef(-1), blockMouseMoveRef = React.useRef(!0), performedPointerEventsMutationRef = React.useRef(!1), unbindMouseMoveRef = React.useRef(() => {
-  }), isHoverOpen = React.useCallback(() => {
+  }), restTimeoutPendingRef = React.useRef(!1), isHoverOpen = React.useCallback(() => {
     var _dataRef$current$open;
     const type = (_dataRef$current$open = dataRef.current.openEvent) == null ? void 0 : _dataRef$current$open.type;
     return type?.includes("mouse") && type !== "mousedown";
@@ -5249,7 +5247,7 @@ function useHover(context, props) {
       let {
         open: open2
       } = _ref;
-      open2 || (clearTimeout(timeoutRef.current), clearTimeout(restTimeoutRef.current), blockMouseMoveRef.current = !0);
+      open2 || (clearTimeout(timeoutRef.current), clearTimeout(restTimeoutRef.current), blockMouseMoveRef.current = !0, restTimeoutPendingRef.current = !1);
     }
     return events.on("openchange", onOpenChange2), () => {
       events.off("openchange", onOpenChange2);
@@ -5275,32 +5273,29 @@ function useHover(context, props) {
       const body = getDocument(elements.floating).body;
       body.style.pointerEvents = "", body.removeAttribute(safePolygonIdentifier), performedPointerEventsMutationRef.current = !1;
     }
-  });
+  }), isClickLikeOpenEvent = useEffectEvent(() => dataRef.current.openEvent ? ["click", "mousedown"].includes(dataRef.current.openEvent.type) : !1);
   React.useEffect(() => {
     if (!enabled) return;
-    function isClickLikeOpenEvent() {
-      return dataRef.current.openEvent ? ["click", "mousedown"].includes(dataRef.current.openEvent.type) : !1;
-    }
     function onMouseEnter(event) {
       if (clearTimeout(timeoutRef.current), blockMouseMoveRef.current = !1, mouseOnly && !isMouseLikePointerType(pointerTypeRef.current) || restMs > 0 && !getDelay(delayRef.current, "open"))
         return;
       const openDelay = getDelay(delayRef.current, "open", pointerTypeRef.current);
       openDelay ? timeoutRef.current = window.setTimeout(() => {
         openRef.current || onOpenChange(!0, event, "hover");
-      }, openDelay) : onOpenChange(!0, event, "hover");
+      }, openDelay) : open || onOpenChange(!0, event, "hover");
     }
     function onMouseLeave(event) {
       if (isClickLikeOpenEvent()) return;
       unbindMouseMoveRef.current();
       const doc = getDocument(elements.floating);
-      if (clearTimeout(restTimeoutRef.current), handleCloseRef.current && dataRef.current.floatingContext) {
+      if (clearTimeout(restTimeoutRef.current), restTimeoutPendingRef.current = !1, handleCloseRef.current && dataRef.current.floatingContext) {
         open || clearTimeout(timeoutRef.current), handlerRef.current = handleCloseRef.current({
           ...dataRef.current.floatingContext,
           tree,
           x: event.clientX,
           y: event.clientY,
           onClose() {
-            clearPointerEvents(), cleanupMouseMoveHandler(), closeWithDelay(event, !0, "safe-polygon");
+            clearPointerEvents(), cleanupMouseMoveHandler(), isClickLikeOpenEvent() || closeWithDelay(event, !0, "safe-polygon");
           }
         });
         const handler = handlerRef.current;
@@ -5318,7 +5313,7 @@ function useHover(context, props) {
         x: event.clientX,
         y: event.clientY,
         onClose() {
-          clearPointerEvents(), cleanupMouseMoveHandler(), closeWithDelay(event);
+          clearPointerEvents(), cleanupMouseMoveHandler(), isClickLikeOpenEvent() || closeWithDelay(event);
         }
       })(event));
     }
@@ -5332,22 +5327,23 @@ function useHover(context, props) {
         open && ref.removeEventListener("mouseleave", onScrollMouseLeave), (_elements$floating2 = elements.floating) == null || _elements$floating2.removeEventListener("mouseleave", onScrollMouseLeave), move && ref.removeEventListener("mousemove", onMouseEnter), ref.removeEventListener("mouseenter", onMouseEnter), ref.removeEventListener("mouseleave", onMouseLeave);
       };
     }
-  }, [elements, enabled, context, mouseOnly, restMs, move, closeWithDelay, cleanupMouseMoveHandler, clearPointerEvents, onOpenChange, open, openRef, tree, delayRef, handleCloseRef, dataRef]), index(() => {
+  }, [elements, enabled, context, mouseOnly, restMs, move, closeWithDelay, cleanupMouseMoveHandler, clearPointerEvents, onOpenChange, open, openRef, tree, delayRef, handleCloseRef, dataRef, isClickLikeOpenEvent]), index(() => {
     var _handleCloseRef$curre;
     if (enabled && open && (_handleCloseRef$curre = handleCloseRef.current) != null && _handleCloseRef$curre.__options.blockPointerEvents && isHoverOpen()) {
-      const body = getDocument(elements.floating).body;
-      body.setAttribute(safePolygonIdentifier, ""), body.style.pointerEvents = "none", performedPointerEventsMutationRef.current = !0;
+      performedPointerEventsMutationRef.current = !0;
       const floatingEl = elements.floating;
       if (isElement(elements.domReference) && floatingEl) {
         var _tree$nodesRef$curren;
+        const body = getDocument(elements.floating).body;
+        body.setAttribute(safePolygonIdentifier, "");
         const ref = elements.domReference, parentFloating = tree == null || (_tree$nodesRef$curren = tree.nodesRef.current.find((node) => node.id === parentId)) == null || (_tree$nodesRef$curren = _tree$nodesRef$curren.context) == null ? void 0 : _tree$nodesRef$curren.elements.floating;
-        return parentFloating && (parentFloating.style.pointerEvents = ""), ref.style.pointerEvents = "auto", floatingEl.style.pointerEvents = "auto", () => {
-          ref.style.pointerEvents = "", floatingEl.style.pointerEvents = "";
+        return parentFloating && (parentFloating.style.pointerEvents = ""), body.style.pointerEvents = "none", ref.style.pointerEvents = "auto", floatingEl.style.pointerEvents = "auto", () => {
+          body.style.pointerEvents = "", ref.style.pointerEvents = "", floatingEl.style.pointerEvents = "";
         };
       }
     }
   }, [enabled, open, parentId, elements, tree, handleCloseRef, isHoverOpen]), index(() => {
-    open || (pointerTypeRef.current = void 0, cleanupMouseMoveHandler(), clearPointerEvents());
+    open || (pointerTypeRef.current = void 0, restTimeoutPendingRef.current = !1, cleanupMouseMoveHandler(), clearPointerEvents());
   }, [open, cleanupMouseMoveHandler, clearPointerEvents]), React.useEffect(() => () => {
     cleanupMouseMoveHandler(), clearTimeout(timeoutRef.current), clearTimeout(restTimeoutRef.current), clearPointerEvents();
   }, [enabled, elements.domReference, cleanupMouseMoveHandler, clearPointerEvents]);
@@ -5365,7 +5361,7 @@ function useHover(context, props) {
         function handleMouseMove() {
           !blockMouseMoveRef.current && !openRef.current && onOpenChange(!0, nativeEvent, "hover");
         }
-        mouseOnly && !isMouseLikePointerType(pointerTypeRef.current) || open || restMs === 0 || (clearTimeout(restTimeoutRef.current), pointerTypeRef.current === "touch" ? handleMouseMove() : restTimeoutRef.current = window.setTimeout(handleMouseMove, restMs));
+        mouseOnly && !isMouseLikePointerType(pointerTypeRef.current) || open || restMs === 0 || restTimeoutPendingRef.current && event.movementX ** 2 + event.movementY ** 2 < 2 || (clearTimeout(restTimeoutRef.current), pointerTypeRef.current === "touch" ? handleMouseMove() : (restTimeoutPendingRef.current = !0, restTimeoutRef.current = window.setTimeout(handleMouseMove, restMs)));
       }
     };
   }, [mouseOnly, onOpenChange, open, openRef, restMs]), floating = React.useMemo(() => ({
@@ -5373,9 +5369,9 @@ function useHover(context, props) {
       clearTimeout(timeoutRef.current);
     },
     onMouseLeave(event) {
-      closeWithDelay(event.nativeEvent, !1);
+      isClickLikeOpenEvent() || closeWithDelay(event.nativeEvent, !1);
     }
-  }), [closeWithDelay]);
+  }), [closeWithDelay, isClickLikeOpenEvent]);
   return React.useMemo(() => enabled ? {
     reference,
     floating
@@ -5431,7 +5427,8 @@ function useDelayGroup(context, options) {
     onOpenChange,
     floatingId
   } = context, {
-    id: optionId
+    id: optionId,
+    enabled = !0
   } = options, id = optionId ?? floatingId, groupContext = useDelayGroupContext(), {
     currentId,
     setCurrentId,
@@ -5440,20 +5437,20 @@ function useDelayGroup(context, options) {
     timeoutMs
   } = groupContext;
   return index(() => {
-    currentId && (setState({
+    enabled && currentId && (setState({
       delay: {
         open: 1,
         close: getDelay(initialDelay, "close")
       }
     }), currentId !== id && onOpenChange(!1));
-  }, [id, onOpenChange, setState, currentId, initialDelay]), index(() => {
+  }, [enabled, id, onOpenChange, setState, currentId, initialDelay]), index(() => {
     function unset() {
       onOpenChange(!1), setState({
         delay: initialDelay,
         currentId: null
       });
     }
-    if (currentId && !open && currentId === id) {
+    if (enabled && currentId && !open && currentId === id) {
       if (timeoutMs) {
         const timeout = window.setTimeout(unset, timeoutMs);
         return () => {
@@ -5462,9 +5459,9 @@ function useDelayGroup(context, options) {
       }
       unset();
     }
-  }, [open, setState, currentId, id, onOpenChange, initialDelay, timeoutMs]), index(() => {
-    setCurrentId === NOOP || !open || setCurrentId(id);
-  }, [open, setCurrentId, id]), groupContext;
+  }, [enabled, open, setState, currentId, id, onOpenChange, initialDelay, timeoutMs]), index(() => {
+    enabled && (setCurrentId === NOOP || !open || setCurrentId(id));
+  }, [enabled, open, setCurrentId, id]), groupContext;
 }
 function getChildren(nodes, id) {
   let allChildren = nodes.filter((node) => {
@@ -5481,7 +5478,7 @@ function getChildren(nodes, id) {
     }), allChildren = allChildren.concat(currentChildren);
   return allChildren;
 }
-const bubbleHandlerKeys = {
+const FOCUSABLE_ATTRIBUTE = "data-floating-ui-focusable", bubbleHandlerKeys = {
   pointerdown: "onPointerDown",
   mousedown: "onMouseDown",
   click: "onClick"
@@ -5519,9 +5516,9 @@ function useDismiss(context, props) {
   } = normalizeProp(bubbles), {
     escapeKey: escapeKeyCapture,
     outsidePress: outsidePressCapture
-  } = normalizeProp(capture), closeOnEscapeKeyDown = useEffectEvent((event) => {
+  } = normalizeProp(capture), isComposingRef = React.useRef(!1), closeOnEscapeKeyDown = useEffectEvent((event) => {
     var _dataRef$current$floa;
-    if (!open || !enabled || !escapeKey || event.key !== "Escape")
+    if (!open || !enabled || !escapeKey || event.key !== "Escape" || isComposingRef.current)
       return;
     const nodeId = (_dataRef$current$floa = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa.nodeId, children = tree ? getChildren(tree.nodesRef.current, nodeId) : [];
     if (!escapeKeyBubbles && (event.stopPropagation(), children.length > 0)) {
@@ -5600,11 +5597,25 @@ function useDismiss(context, props) {
     if (!open || !enabled)
       return;
     dataRef.current.__escapeKeyBubbles = escapeKeyBubbles, dataRef.current.__outsidePressBubbles = outsidePressBubbles;
+    let compositionTimeout = -1;
     function onScroll(event) {
       onOpenChange(!1, event, "ancestor-scroll");
     }
+    function handleCompositionStart() {
+      window.clearTimeout(compositionTimeout), isComposingRef.current = !0;
+    }
+    function handleCompositionEnd() {
+      compositionTimeout = window.setTimeout(
+        () => {
+          isComposingRef.current = !1;
+        },
+        // 0ms or 1ms don't work in Safari. 5ms appears to consistently work.
+        // Only apply to WebKit for the test to remain 0ms.
+        isWebKit() ? 5 : 0
+      );
+    }
     const doc = getDocument(elements.floating);
-    escapeKey && doc.addEventListener("keydown", escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture), outsidePress && doc.addEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
+    escapeKey && (doc.addEventListener("keydown", escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture), doc.addEventListener("compositionstart", handleCompositionStart), doc.addEventListener("compositionend", handleCompositionEnd)), outsidePress && doc.addEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
     let ancestors = [];
     return ancestorScroll && (isElement(elements.domReference) && (ancestors = getOverflowAncestors(elements.domReference)), isElement(elements.floating) && (ancestors = ancestors.concat(getOverflowAncestors(elements.floating))), !isElement(elements.reference) && elements.reference && elements.reference.contextElement && (ancestors = ancestors.concat(getOverflowAncestors(elements.reference.contextElement)))), ancestors = ancestors.filter((ancestor) => {
       var _doc$defaultView;
@@ -5614,9 +5625,9 @@ function useDismiss(context, props) {
         passive: !0
       });
     }), () => {
-      escapeKey && doc.removeEventListener("keydown", escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture), outsidePress && doc.removeEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture), ancestors.forEach((ancestor) => {
+      escapeKey && (doc.removeEventListener("keydown", escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture), doc.removeEventListener("compositionstart", handleCompositionStart), doc.removeEventListener("compositionend", handleCompositionEnd)), outsidePress && doc.removeEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture), ancestors.forEach((ancestor) => {
         ancestor.removeEventListener("scroll", onScroll);
-      });
+      }), window.clearTimeout(compositionTimeout);
     };
   }, [dataRef, elements, escapeKey, outsidePress, outsidePressEvent, open, onOpenChange, ancestorScroll, enabled, escapeKeyBubbles, outsidePressBubbles, closeOnEscapeKeyDown, escapeKeyCapture, closeOnEscapeKeyDownCapture, closeOnPressOutside, outsidePressCapture, closeOnPressOutsideCapture]), React.useEffect(() => {
     insideReactTreeRef.current = !1;
@@ -5683,7 +5694,7 @@ function useFloating(options) {
       floating: null,
       ...options.elements
     }
-  }), rootContext = options.rootContext || internalRootContext, computedElements = rootContext.elements, [_domReference, setDomReference] = React.useState(null), [positionReference, _setPositionReference] = React.useState(null), domReference = computedElements?.reference || _domReference, domReferenceRef = React.useRef(null), tree = useFloatingTree();
+  }), rootContext = options.rootContext || internalRootContext, computedElements = rootContext.elements, [_domReference, setDomReference] = React.useState(null), [positionReference, _setPositionReference] = React.useState(null), domReference = computedElements?.domReference || _domReference, domReferenceRef = React.useRef(null), tree = useFloatingTree();
   index(() => {
     domReference && (domReferenceRef.current = domReference);
   }, [domReference]);
@@ -5818,7 +5829,8 @@ function mergeProps(userProps, propsList, elementKey) {
   }
   return {
     ...elementKey === "floating" && {
-      tabIndex: -1
+      tabIndex: -1,
+      [FOCUSABLE_ATTRIBUTE]: ""
     },
     ...domUserProps,
     ...propsList.map((value) => {
@@ -6060,8 +6072,8 @@ function createPortalNode(props) {
   const node = document.createElement("div");
   return node.setAttribute("data-portal", "true"), typeof props.className == "string" && node.classList.add(...props.className.split(" ").filter(Boolean)), typeof props.style == "object" && Object.assign(node.style, props.style), typeof props.id == "string" && node.setAttribute("id", props.id), node;
 }
-const defaultProps$1p = {}, Portal = forwardRef((props, ref) => {
-  const { children, target, ...others } = useProps("Portal", defaultProps$1p, props), [mounted, setMounted] = useState(!1), nodeRef = useRef(null);
+const defaultProps$1D = {}, Portal = forwardRef((props, ref) => {
+  const { children, target, ...others } = useProps("Portal", defaultProps$1D, props), [mounted, setMounted] = useState(!1), nodeRef = useRef(null);
   return useIsomorphicEffect(() => (setMounted(!0), nodeRef.current = target ? typeof target == "string" ? document.querySelector(target) : target : createPortalNode(others), assignRef(ref, nodeRef.current), !target && nodeRef.current && document.body.appendChild(nodeRef.current), () => {
     !target && nodeRef.current && document.body.removeChild(nodeRef.current);
   }), [target]), !mounted || !nodeRef.current ? null : createPortal(/* @__PURE__ */ jsx(Fragment$1, { children }), nodeRef.current);
@@ -6304,9 +6316,9 @@ function Transition({
   ) });
 }
 Transition.displayName = "@mantine/core/Transition";
-var __default__$D = { dropdown: "m_38a85659", arrow: "m_a31dc6c1" };
-const classes$D = __default__$D, defaultProps$1o = {}, PopoverDropdown = factory((_props, ref) => {
-  const props = useProps("PopoverDropdown", defaultProps$1o, _props), {
+var __default__$F = { dropdown: "m_38a85659", arrow: "m_a31dc6c1" };
+const classes$F = __default__$F, defaultProps$1C = {}, PopoverDropdown = factory((_props, ref) => {
+  const props = useProps("PopoverDropdown", defaultProps$1C, _props), {
     className,
     style,
     vars,
@@ -6360,6 +6372,8 @@ const classes$D = __default__$D, defaultProps$1o = {}, PopoverDropdown = factory
                 left: ctx.x ?? 0,
                 width: ctx.width === "target" ? void 0 : rem(ctx.width)
               },
+              ctx.resolvedStyles.dropdown,
+              styles?.dropdown,
               style
             ]
           }),
@@ -6390,22 +6404,22 @@ const classes$D = __default__$D, defaultProps$1o = {}, PopoverDropdown = factory
     }
   ) });
 });
-PopoverDropdown.classes = classes$D;
+PopoverDropdown.classes = classes$F;
 PopoverDropdown.displayName = "@mantine/core/PopoverDropdown";
-const defaultProps$1n = {
+const defaultProps$1B = {
   refProp: "ref",
   popupType: "dialog"
 }, PopoverTarget = factory((props, ref) => {
   const { children, refProp, popupType, ...others } = useProps(
     "PopoverTarget",
-    defaultProps$1n,
+    defaultProps$1B,
     props
   );
   if (!isElement$1(children))
     throw new Error(
       "Popover.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported"
     );
-  const forwardedProps = others, ctx = usePopoverContext(), targetRef = useMergedRef(ctx.reference, children.ref, ref), accessibleProps = ctx.withRoles ? {
+  const forwardedProps = others, ctx = usePopoverContext(), targetRef = useMergedRef(ctx.reference, getRefProp(children), ref), accessibleProps = ctx.withRoles ? {
     "aria-haspopup": popupType,
     "aria-expanded": ctx.opened,
     "aria-controls": ctx.getDropdownId(),
@@ -6484,7 +6498,7 @@ function usePopover(options) {
     defaultValue: options.defaultOpened,
     finalValue: !1,
     onChange: options.onChange
-  }), onClose = () => {
+  }), previouslyOpened = useRef(_opened), onClose = () => {
     _opened && setOpened(!1);
   }, onToggle = () => setOpened(!_opened), floating = useFloating({
     strategy: options.strategy,
@@ -6499,7 +6513,7 @@ function usePopover(options) {
   }), useDidUpdate(() => {
     options.onPositionChange?.(floating.placement);
   }, [floating.placement]), useDidUpdate(() => {
-    _opened ? options.onOpen?.() : options.onClose?.();
+    _opened !== previouslyOpened.current && (_opened ? options.onOpen?.() : options.onClose?.()), previouslyOpened.current = _opened;
   }, [_opened, options.onClose, options.onOpen]), {
     floating,
     controlled: typeof options.opened == "boolean",
@@ -6508,7 +6522,7 @@ function usePopover(options) {
     onToggle
   };
 }
-const defaultProps$1m = {
+const defaultProps$1A = {
   position: "bottom",
   offset: 8,
   positionDependencies: [],
@@ -6528,14 +6542,14 @@ const defaultProps$1m = {
   zIndex: getDefaultZIndex("popover"),
   __staticSelector: "Popover",
   width: "max-content"
-}, varsResolver$G = (_, { radius, shadow }) => ({
+}, varsResolver$H = (_, { radius, shadow }) => ({
   dropdown: {
     "--popover-radius": radius === void 0 ? void 0 : getRadius(radius),
     "--popover-shadow": getShadow(shadow)
   }
 });
 function Popover(_props) {
-  const props = useProps("Popover", defaultProps$1m, _props), {
+  const props = useProps("Popover", defaultProps$1A, _props), {
     children,
     position,
     offset: offset2,
@@ -6579,14 +6593,14 @@ function Popover(_props) {
   } = props, getStyles2 = useStyles({
     name: __staticSelector,
     props,
-    classes: classes$D,
+    classes: classes$F,
     classNames,
     styles,
     unstyled,
     rootSelector: "dropdown",
     vars,
-    varsResolver: varsResolver$G
-  }), arrowRef = useRef(null), [targetNode, setTargetNode] = useState(null), [dropdownNode, setDropdownNode] = useState(null), { dir } = useDirection(), uid = useId$1(id), popover = usePopover({
+    varsResolver: varsResolver$H
+  }), { resolvedStyles } = useResolvedStylesApi({ classNames, styles, props }), arrowRef = useRef(null), [targetNode, setTargetNode] = useState(null), [dropdownNode, setDropdownNode] = useState(null), { dir } = useDirection(), uid = useId$1(id), popover = usePopover({
     middlewares,
     width,
     position: getFloatingPosition(dir, position),
@@ -6660,6 +6674,7 @@ function Popover(_props) {
         variant,
         keepMounted,
         getStyles: getStyles2,
+        resolvedStyles,
         floatingStrategy
       },
       children
@@ -6670,35 +6685,35 @@ Popover.Target = PopoverTarget;
 Popover.Dropdown = PopoverDropdown;
 Popover.displayName = "@mantine/core/Popover";
 Popover.extend = (input) => input;
-var __default__$C = { root: "m_5ae2e3c", barsLoader: "m_7a2bd4cd", bar: "m_870bb79", "bars-loader-animation": "m_5d2b3b9d", dotsLoader: "m_4e3f22d7", dot: "m_870c4af", "loader-dots-animation": "m_aac34a1", ovalLoader: "m_b34414df", "oval-loader-animation": "m_f8e89c4b" };
-const classes$C = __default__$C, Bars = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsxs(Box, { component: "span", className: clsx(classes$C.barsLoader, className), ...others, ref, children: [
-  /* @__PURE__ */ jsx("span", { className: classes$C.bar }),
-  /* @__PURE__ */ jsx("span", { className: classes$C.bar }),
-  /* @__PURE__ */ jsx("span", { className: classes$C.bar })
+var __default__$E = { root: "m_5ae2e3c", barsLoader: "m_7a2bd4cd", bar: "m_870bb79", "bars-loader-animation": "m_5d2b3b9d", dotsLoader: "m_4e3f22d7", dot: "m_870c4af", "loader-dots-animation": "m_aac34a1", ovalLoader: "m_b34414df", "oval-loader-animation": "m_f8e89c4b" };
+const classes$E = __default__$E, Bars = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsxs(Box, { component: "span", className: clsx(classes$E.barsLoader, className), ...others, ref, children: [
+  /* @__PURE__ */ jsx("span", { className: classes$E.bar }),
+  /* @__PURE__ */ jsx("span", { className: classes$E.bar }),
+  /* @__PURE__ */ jsx("span", { className: classes$E.bar })
 ] }));
 Bars.displayName = "@mantine/core/Bars";
-const Dots = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsxs(Box, { component: "span", className: clsx(classes$C.dotsLoader, className), ...others, ref, children: [
-  /* @__PURE__ */ jsx("span", { className: classes$C.dot }),
-  /* @__PURE__ */ jsx("span", { className: classes$C.dot }),
-  /* @__PURE__ */ jsx("span", { className: classes$C.dot })
+const Dots = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsxs(Box, { component: "span", className: clsx(classes$E.dotsLoader, className), ...others, ref, children: [
+  /* @__PURE__ */ jsx("span", { className: classes$E.dot }),
+  /* @__PURE__ */ jsx("span", { className: classes$E.dot }),
+  /* @__PURE__ */ jsx("span", { className: classes$E.dot })
 ] }));
 Dots.displayName = "@mantine/core/Dots";
-const Oval = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsx(Box, { component: "span", className: clsx(classes$C.ovalLoader, className), ...others, ref }));
+const Oval = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsx(Box, { component: "span", className: clsx(classes$E.ovalLoader, className), ...others, ref }));
 Oval.displayName = "@mantine/core/Oval";
 const defaultLoaders = {
   bars: Bars,
   oval: Oval,
   dots: Dots
-}, defaultProps$1l = {
+}, defaultProps$1z = {
   loaders: defaultLoaders,
   type: "oval"
-}, varsResolver$F = (theme, { size: size2, color }) => ({
+}, varsResolver$G = (theme, { size: size2, color }) => ({
   root: {
     "--loader-size": getSize(size2, "loader-size"),
     "--loader-color": color ? getThemeColor(color, theme) : void 0
   }
 }), Loader = factory((_props, ref) => {
-  const props = useProps("Loader", defaultProps$1l, _props), {
+  const props = useProps("Loader", defaultProps$1z, _props), {
     size: size2,
     color,
     type,
@@ -6715,14 +6730,14 @@ const defaultLoaders = {
   } = props, getStyles2 = useStyles({
     name: "Loader",
     props,
-    classes: classes$C,
+    classes: classes$E,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$F
+    varsResolver: varsResolver$G
   });
   return children ? /* @__PURE__ */ jsx(Box, { ...getStyles2("root"), ref, ...others, children }) : /* @__PURE__ */ jsx(
     Box,
@@ -6737,15 +6752,15 @@ const defaultLoaders = {
   );
 });
 Loader.defaultLoaders = defaultLoaders;
-Loader.classes = classes$C;
+Loader.classes = classes$E;
 Loader.displayName = "@mantine/core/Loader";
-var __default__$B = { root: "m_8d3f4000", icon: "m_8d3afb97", loader: "m_302b9fb1", group: "m_1a0f1b21" };
-const classes$B = __default__$B, defaultProps$1k = {
+var __default__$D = { root: "m_8d3f4000", icon: "m_8d3afb97", loader: "m_302b9fb1", group: "m_1a0f1b21" };
+const classes$D = __default__$D, defaultProps$1y = {
   orientation: "horizontal"
-}, varsResolver$E = (_, { borderWidth }) => ({
+}, varsResolver$F = (_, { borderWidth }) => ({
   group: { "--ai-border-width": rem(borderWidth) }
 }), ActionIconGroup = factory((_props, ref) => {
-  const props = useProps("ActionIconGroup", defaultProps$1k, _props), {
+  const props = useProps("ActionIconGroup", defaultProps$1y, _props), {
     className,
     style,
     classNames,
@@ -6757,17 +6772,17 @@ const classes$B = __default__$B, defaultProps$1k = {
     variant,
     mod,
     ...others
-  } = useProps("ActionIconGroup", defaultProps$1k, _props), getStyles2 = useStyles({
+  } = useProps("ActionIconGroup", defaultProps$1y, _props), getStyles2 = useStyles({
     name: "ActionIconGroup",
     props,
-    classes: classes$B,
+    classes: classes$D,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$E,
+    varsResolver: varsResolver$F,
     rootSelector: "group"
   });
   return /* @__PURE__ */ jsx(
@@ -6782,9 +6797,9 @@ const classes$B = __default__$B, defaultProps$1k = {
     }
   );
 });
-ActionIconGroup.classes = classes$B;
+ActionIconGroup.classes = classes$D;
 ActionIconGroup.displayName = "@mantine/core/ActionIconGroup";
-const defaultProps$1j = {}, varsResolver$D = (theme, { size: size2, radius, variant, gradient, color, autoContrast }) => {
+const defaultProps$1x = {}, varsResolver$E = (theme, { size: size2, radius, variant, gradient, color, autoContrast }) => {
   const colors = theme.variantColorResolver({
     color: color || theme.primaryColor,
     theme,
@@ -6804,7 +6819,7 @@ const defaultProps$1j = {}, varsResolver$D = (theme, { size: size2, radius, vari
     }
   };
 }, ActionIcon = polymorphicFactory((_props, ref) => {
-  const props = useProps("ActionIcon", defaultProps$1j, _props), {
+  const props = useProps("ActionIcon", defaultProps$1x, _props), {
     className,
     unstyled,
     variant,
@@ -6830,12 +6845,12 @@ const defaultProps$1j = {}, varsResolver$D = (theme, { size: size2, radius, vari
     props,
     className,
     style,
-    classes: classes$B,
+    classes: classes$D,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$D
+    varsResolver: varsResolver$E
   });
   return /* @__PURE__ */ jsxs(
     UnstyledButton,
@@ -6855,7 +6870,7 @@ const defaultProps$1j = {}, varsResolver$D = (theme, { size: size2, radius, vari
     }
   );
 });
-ActionIcon.classes = classes$B;
+ActionIcon.classes = classes$D;
 ActionIcon.displayName = "@mantine/core/ActionIcon";
 ActionIcon.Group = ActionIconGroup;
 const CloseIcon = forwardRef(
@@ -6881,17 +6896,17 @@ const CloseIcon = forwardRef(
   )
 );
 CloseIcon.displayName = "@mantine/core/CloseIcon";
-var __default__$A = { root: "m_86a44da5", "root--subtle": "m_220c80f2" };
-const classes$A = __default__$A, defaultProps$1i = {
+var __default__$C = { root: "m_86a44da5", "root--subtle": "m_220c80f2" };
+const classes$C = __default__$C, defaultProps$1w = {
   variant: "subtle"
-}, varsResolver$C = (_, { size: size2, radius, iconSize }) => ({
+}, varsResolver$D = (_, { size: size2, radius, iconSize }) => ({
   root: {
     "--cb-size": getSize(size2, "cb-size"),
     "--cb-radius": radius === void 0 ? void 0 : getRadius(radius),
     "--cb-icon-size": rem(iconSize)
   }
 }), CloseButton = polymorphicFactory((_props, ref) => {
-  const props = useProps("CloseButton", defaultProps$1i, _props), {
+  const props = useProps("CloseButton", defaultProps$1w, _props), {
     iconSize,
     children,
     vars,
@@ -6912,12 +6927,12 @@ const classes$A = __default__$A, defaultProps$1i = {
     props,
     className,
     style,
-    classes: classes$A,
+    classes: classes$C,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$C
+    varsResolver: varsResolver$D
   });
   return /* @__PURE__ */ jsxs(
     UnstyledButton,
@@ -6936,19 +6951,19 @@ const classes$A = __default__$A, defaultProps$1i = {
     }
   );
 });
-CloseButton.classes = classes$A;
+CloseButton.classes = classes$C;
 CloseButton.displayName = "@mantine/core/CloseButton";
 function filterFalsyChildren(children) {
   return Children.toArray(children).filter(Boolean);
 }
-var __default__$z = { root: "m_4081bf90" };
-const classes$z = __default__$z, defaultProps$1h = {
+var __default__$B = { root: "m_4081bf90" };
+const classes$B = __default__$B, defaultProps$1v = {
   preventGrowOverflow: !0,
   gap: "md",
   align: "center",
   justify: "flex-start",
   wrap: "wrap"
-}, varsResolver$B = (_, { grow, preventGrowOverflow, gap, align, justify, wrap }, { childWidth }) => ({
+}, varsResolver$C = (_, { grow, preventGrowOverflow, gap, align, justify, wrap }, { childWidth }) => ({
   root: {
     "--group-child-width": grow && preventGrowOverflow ? childWidth : void 0,
     "--group-gap": getSpacing(gap),
@@ -6957,7 +6972,7 @@ const classes$z = __default__$z, defaultProps$1h = {
     "--group-wrap": wrap
   }
 }), Group = factory((_props, ref) => {
-  const props = useProps("Group", defaultProps$1h, _props), {
+  const props = useProps("Group", defaultProps$1v, _props), {
     classNames,
     className,
     style,
@@ -6981,12 +6996,12 @@ const classes$z = __default__$z, defaultProps$1h = {
     stylesCtx,
     className,
     style,
-    classes: classes$z,
+    classes: classes$B,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$B
+    varsResolver: varsResolver$C
   });
   return /* @__PURE__ */ jsx(
     Box,
@@ -7001,12 +7016,12 @@ const classes$z = __default__$z, defaultProps$1h = {
     }
   );
 });
-Group.classes = classes$z;
+Group.classes = classes$B;
 Group.displayName = "@mantine/core/Group";
-var __default__$y = { root: "m_9814e45f" };
-const classes$y = __default__$y, defaultProps$1g = {
+var __default__$A = { root: "m_9814e45f" };
+const classes$A = __default__$A, defaultProps$1u = {
   zIndex: getDefaultZIndex("modal")
-}, varsResolver$A = (_, { gradient, color, backgroundOpacity, blur, radius, zIndex }) => ({
+}, varsResolver$B = (_, { gradient, color, backgroundOpacity, blur, radius, zIndex }) => ({
   root: {
     "--overlay-bg": gradient || (color !== void 0 || backgroundOpacity !== void 0) && rgba(color || "#000", backgroundOpacity ?? 0.6) || void 0,
     "--overlay-filter": blur ? `blur(${rem(blur)})` : void 0,
@@ -7014,7 +7029,7 @@ const classes$y = __default__$y, defaultProps$1g = {
     "--overlay-z-index": zIndex?.toString()
   }
 }), Overlay = polymorphicFactory((_props, ref) => {
-  const props = useProps("Overlay", defaultProps$1g, _props), {
+  const props = useProps("Overlay", defaultProps$1u, _props), {
     classNames,
     className,
     style,
@@ -7035,18 +7050,18 @@ const classes$y = __default__$y, defaultProps$1g = {
   } = props, getStyles2 = useStyles({
     name: "Overlay",
     props,
-    classes: classes$y,
+    classes: classes$A,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$A
+    varsResolver: varsResolver$B
   });
   return /* @__PURE__ */ jsx(Box, { ref, ...getStyles2("root"), mod: [{ center, fixed }, mod], ...others, children });
 });
-Overlay.classes = classes$y;
+Overlay.classes = classes$A;
 Overlay.displayName = "@mantine/core/Overlay";
 const [ModalBaseProvider, useModalBaseContext] = createSafeContext(
   "ModalBase component was not found in tree"
@@ -7154,8 +7169,8 @@ function useModalBodyId() {
   const ctx = useModalBaseContext();
   return useEffect(() => (ctx.setBodyMounted(!0), () => ctx.setBodyMounted(!1)), []), ctx.getBodyId();
 }
-var __default__$x = { title: "m_615af6c9", header: "m_b5489c3c", inner: "m_60c222c7", content: "m_fd1ab0aa", close: "m_606cb269", body: "m_5df29311" };
-const classes$x = __default__$x, ModalBaseBody = forwardRef(
+var __default__$z = { title: "m_615af6c9", header: "m_b5489c3c", inner: "m_60c222c7", content: "m_fd1ab0aa", close: "m_606cb269", body: "m_5df29311" };
+const classes$z = __default__$z, ModalBaseBody = forwardRef(
   ({ className, ...others }, ref) => {
     const bodyId = useModalBodyId(), ctx = useModalBaseContext();
     return /* @__PURE__ */ jsx(
@@ -7164,7 +7179,7 @@ const classes$x = __default__$x, ModalBaseBody = forwardRef(
         ref,
         ...others,
         id: bodyId,
-        className: clsx({ [classes$x.body]: !ctx.unstyled }, className)
+        className: clsx({ [classes$z.body]: !ctx.unstyled }, className)
       }
     );
   }
@@ -7181,7 +7196,7 @@ const ModalBaseCloseButton = forwardRef(
         onClick: (event) => {
           ctx.onClose(), onClick?.(event);
         },
-        className: clsx({ [classes$x.close]: !ctx.unstyled }, className),
+        className: clsx({ [classes$z.close]: !ctx.unstyled }, className),
         unstyled: ctx.unstyled
       }
     );
@@ -7202,7 +7217,7 @@ const ModalBaseContent = forwardRef(
           "div",
           {
             ...innerProps,
-            className: clsx({ [classes$x.inner]: !ctx.unstyled }, innerProps.className),
+            className: clsx({ [classes$z.inner]: !ctx.unstyled }, innerProps.className),
             children: /* @__PURE__ */ jsx(FocusTrap, { active: ctx.opened && ctx.trapFocus, innerRef: ref, children: /* @__PURE__ */ jsx(
               Paper,
               {
@@ -7214,7 +7229,7 @@ const ModalBaseContent = forwardRef(
                 "aria-describedby": ctx.bodyMounted ? ctx.getBodyId() : void 0,
                 "aria-labelledby": ctx.titleMounted ? ctx.getTitleId() : void 0,
                 style: [style, transitionStyles],
-                className: clsx({ [classes$x.content]: !ctx.unstyled }, className),
+                className: clsx({ [classes$z.content]: !ctx.unstyled }, className),
                 unstyled: ctx.unstyled,
                 children: others.children
               }
@@ -7234,7 +7249,7 @@ const ModalBaseHeader = forwardRef(
       {
         component: "header",
         ref,
-        className: clsx({ [classes$x.header]: !ctx.unstyled }, className),
+        className: clsx({ [classes$z.header]: !ctx.unstyled }, className),
         ...others
       }
     );
@@ -7251,22 +7266,30 @@ function useModalTransition(transitionOverride) {
   return { ...DEFAULT_TRANSITION, ...ctx.transitionProps, ...transitionOverride };
 }
 const ModalBaseOverlay = forwardRef(
-  ({ onClick, transitionProps, style, ...others }, ref) => {
+  ({ onClick, transitionProps, style, visible: visible2, ...others }, ref) => {
     const ctx = useModalBaseContext(), transition = useModalTransition(transitionProps);
-    return /* @__PURE__ */ jsx(Transition, { mounted: ctx.opened, ...transition, transition: "fade", children: (transitionStyles) => /* @__PURE__ */ jsx(
-      Overlay,
+    return /* @__PURE__ */ jsx(
+      Transition,
       {
-        ref,
-        fixed: !0,
-        style: [style, transitionStyles],
-        zIndex: ctx.zIndex,
-        unstyled: ctx.unstyled,
-        onClick: (event) => {
-          onClick?.(event), ctx.closeOnClickOutside && ctx.onClose();
-        },
-        ...others
+        mounted: visible2 !== void 0 ? visible2 : ctx.opened,
+        ...transition,
+        transition: "fade",
+        children: (transitionStyles) => /* @__PURE__ */ jsx(
+          Overlay,
+          {
+            ref,
+            fixed: !0,
+            style: [style, transitionStyles],
+            zIndex: ctx.zIndex,
+            unstyled: ctx.unstyled,
+            onClick: (event) => {
+              onClick?.(event), ctx.closeOnClickOutside && ctx.onClose();
+            },
+            ...others
+          }
+        )
       }
-    ) });
+    );
   }
 );
 ModalBaseOverlay.displayName = "@mantine/core/ModalBaseOverlay";
@@ -7282,7 +7305,7 @@ const ModalBaseTitle = forwardRef(
       {
         component: "h2",
         ref,
-        className: clsx({ [classes$x.title]: !ctx.unstyled }, className),
+        className: clsx({ [classes$z.title]: !ctx.unstyled }, className),
         ...others,
         id
       }
@@ -7301,13 +7324,13 @@ const [InputWrapperProvider, useInputWrapperContext] = createOptionalContext({
   inputId: void 0,
   labelId: void 0
 });
-var __default__$w = { wrapper: "m_6c018570", input: "m_8fb7ebe7", section: "m_82577fc2", placeholder: "m_88bacfd0", root: "m_46b77525", label: "m_8fdc1311", required: "m_78a94662", error: "m_8f816625", description: "m_fe47ce59" };
-const classes$w = __default__$w, defaultProps$1f = {}, varsResolver$z = (_, { size: size2 }) => ({
+var __default__$y = { wrapper: "m_6c018570", input: "m_8fb7ebe7", section: "m_82577fc2", placeholder: "m_88bacfd0", root: "m_46b77525", label: "m_8fdc1311", required: "m_78a94662", error: "m_8f816625", description: "m_fe47ce59" };
+const classes$y = __default__$y, defaultProps$1t = {}, varsResolver$A = (_, { size: size2 }) => ({
   description: {
     "--input-description-size": size2 === void 0 ? void 0 : `calc(${getFontSize(size2)} - ${rem(2)})`
   }
 }), InputDescription = factory((_props, ref) => {
-  const props = useProps("InputDescription", defaultProps$1f, _props), {
+  const props = useProps("InputDescription", defaultProps$1t, _props), {
     classNames,
     className,
     style,
@@ -7319,10 +7342,10 @@ const classes$w = __default__$w, defaultProps$1f = {}, varsResolver$z = (_, { si
     __inheritStyles = !0,
     variant,
     ...others
-  } = useProps("InputDescription", defaultProps$1f, props), ctx = useInputWrapperContext(), _getStyles = useStyles({
+  } = useProps("InputDescription", defaultProps$1t, props), ctx = useInputWrapperContext(), _getStyles = useStyles({
     name: ["InputWrapper", __staticSelector],
     props,
-    classes: classes$w,
+    classes: classes$y,
     className,
     style,
     classNames,
@@ -7330,7 +7353,7 @@ const classes$w = __default__$w, defaultProps$1f = {}, varsResolver$z = (_, { si
     unstyled,
     rootSelector: "description",
     vars,
-    varsResolver: varsResolver$z
+    varsResolver: varsResolver$A
   }), getStyles2 = __inheritStyles && ctx?.getStyles || _getStyles;
   return /* @__PURE__ */ jsx(
     Box,
@@ -7344,14 +7367,14 @@ const classes$w = __default__$w, defaultProps$1f = {}, varsResolver$z = (_, { si
     }
   );
 });
-InputDescription.classes = classes$w;
+InputDescription.classes = classes$y;
 InputDescription.displayName = "@mantine/core/InputDescription";
-const defaultProps$1e = {}, varsResolver$y = (_, { size: size2 }) => ({
+const defaultProps$1s = {}, varsResolver$z = (_, { size: size2 }) => ({
   error: {
     "--input-error-size": size2 === void 0 ? void 0 : `calc(${getFontSize(size2)} - ${rem(2)})`
   }
 }), InputError = factory((_props, ref) => {
-  const props = useProps("InputError", defaultProps$1e, _props), {
+  const props = useProps("InputError", defaultProps$1s, _props), {
     classNames,
     className,
     style,
@@ -7366,7 +7389,7 @@ const defaultProps$1e = {}, varsResolver$y = (_, { size: size2 }) => ({
   } = props, _getStyles = useStyles({
     name: ["InputWrapper", __staticSelector],
     props,
-    classes: classes$w,
+    classes: classes$y,
     className,
     style,
     classNames,
@@ -7374,7 +7397,7 @@ const defaultProps$1e = {}, varsResolver$y = (_, { size: size2 }) => ({
     unstyled,
     rootSelector: "error",
     vars,
-    varsResolver: varsResolver$y
+    varsResolver: varsResolver$z
   }), ctx = useInputWrapperContext(), getStyles2 = __inheritStyles && ctx?.getStyles || _getStyles;
   return /* @__PURE__ */ jsx(
     Box,
@@ -7388,17 +7411,17 @@ const defaultProps$1e = {}, varsResolver$y = (_, { size: size2 }) => ({
     }
   );
 });
-InputError.classes = classes$w;
+InputError.classes = classes$y;
 InputError.displayName = "@mantine/core/InputError";
-const defaultProps$1d = {
+const defaultProps$1r = {
   labelElement: "label"
-}, varsResolver$x = (_, { size: size2 }) => ({
+}, varsResolver$y = (_, { size: size2 }) => ({
   label: {
     "--input-label-size": getFontSize(size2),
     "--input-asterisk-color": void 0
   }
 }), InputLabel = factory((_props, ref) => {
-  const props = useProps("InputLabel", defaultProps$1d, _props), {
+  const props = useProps("InputLabel", defaultProps$1r, _props), {
     classNames,
     className,
     style,
@@ -7415,10 +7438,10 @@ const defaultProps$1d = {
     variant,
     mod,
     ...others
-  } = useProps("InputLabel", defaultProps$1d, props), _getStyles = useStyles({
+  } = useProps("InputLabel", defaultProps$1r, props), _getStyles = useStyles({
     name: ["InputWrapper", __staticSelector],
     props,
-    classes: classes$w,
+    classes: classes$y,
     className,
     style,
     classNames,
@@ -7426,7 +7449,7 @@ const defaultProps$1d = {
     unstyled,
     rootSelector: "label",
     vars,
-    varsResolver: varsResolver$x
+    varsResolver: varsResolver$y
   }), ctx = useInputWrapperContext(), getStyles2 = ctx?.getStyles || _getStyles;
   return /* @__PURE__ */ jsxs(
     Box,
@@ -7449,10 +7472,10 @@ const defaultProps$1d = {
     }
   );
 });
-InputLabel.classes = classes$w;
+InputLabel.classes = classes$y;
 InputLabel.displayName = "@mantine/core/InputLabel";
-const defaultProps$1c = {}, InputPlaceholder = factory((_props, ref) => {
-  const props = useProps("InputPlaceholder", defaultProps$1c, _props), {
+const defaultProps$1q = {}, InputPlaceholder = factory((_props, ref) => {
+  const props = useProps("InputPlaceholder", defaultProps$1q, _props), {
     classNames,
     className,
     style,
@@ -7464,10 +7487,10 @@ const defaultProps$1c = {}, InputPlaceholder = factory((_props, ref) => {
     error,
     mod,
     ...others
-  } = useProps("InputPlaceholder", defaultProps$1c, props), getStyles2 = useStyles({
+  } = useProps("InputPlaceholder", defaultProps$1q, props), getStyles2 = useStyles({
     name: ["InputPlaceholder", __staticSelector],
     props,
-    classes: classes$w,
+    classes: classes$y,
     className,
     style,
     classNames,
@@ -7487,17 +7510,17 @@ const defaultProps$1c = {}, InputPlaceholder = factory((_props, ref) => {
     }
   );
 });
-InputPlaceholder.classes = classes$w;
+InputPlaceholder.classes = classes$y;
 InputPlaceholder.displayName = "@mantine/core/InputPlaceholder";
 function getInputOffsets(inputWrapperOrder, { hasDescription, hasError }) {
   const inputIndex = inputWrapperOrder.findIndex((part) => part === "input"), aboveInput = inputWrapperOrder.slice(0, inputIndex), belowInput = inputWrapperOrder.slice(inputIndex + 1), offsetTop = hasDescription && aboveInput.includes("description") || hasError && aboveInput.includes("error");
   return { offsetBottom: hasDescription && belowInput.includes("description") || hasError && belowInput.includes("error"), offsetTop };
 }
-const defaultProps$1b = {
+const defaultProps$1p = {
   labelElement: "label",
   inputContainer: (children) => children,
   inputWrapperOrder: ["label", "description", "input", "error"]
-}, varsResolver$w = (_, { size: size2 }) => ({
+}, varsResolver$x = (_, { size: size2 }) => ({
   label: {
     "--input-label-size": getFontSize(size2),
     "--input-asterisk-color": void 0
@@ -7509,7 +7532,7 @@ const defaultProps$1b = {
     "--input-description-size": size2 === void 0 ? void 0 : `calc(${getFontSize(size2)} - ${rem(2)})`
   }
 }), InputWrapper = factory((_props, ref) => {
-  const props = useProps("InputWrapper", defaultProps$1b, _props), {
+  const props = useProps("InputWrapper", defaultProps$1p, _props), {
     classNames,
     className,
     style,
@@ -7538,14 +7561,14 @@ const defaultProps$1b = {
   } = props, getStyles2 = useStyles({
     name: ["InputWrapper", __staticSelector],
     props: __stylesApiProps || props,
-    classes: classes$w,
+    classes: classes$y,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$w
+    varsResolver: varsResolver$x
   }), sharedProps = {
     size: size2,
     variant,
@@ -7621,15 +7644,15 @@ const defaultProps$1b = {
     }
   );
 });
-InputWrapper.classes = classes$w;
+InputWrapper.classes = classes$y;
 InputWrapper.displayName = "@mantine/core/InputWrapper";
-const defaultProps$1a = {
+const defaultProps$1o = {
   variant: "default",
   leftSectionPointerEvents: "none",
   rightSectionPointerEvents: "none",
   withAria: !0,
   withErrorStyles: !0
-}, varsResolver$v = (_, props, ctx) => ({
+}, varsResolver$w = (_, props, ctx) => ({
   wrapper: {
     "--input-margin-top": ctx.offsetTop ? "calc(var(--mantine-spacing-xs) / 2)" : void 0,
     "--input-margin-bottom": ctx.offsetBottom ? "calc(var(--mantine-spacing-xs) / 2)" : void 0,
@@ -7643,7 +7666,7 @@ const defaultProps$1a = {
     "--input-right-section-pointer-events": props.rightSectionPointerEvents
   }
 }), Input = polymorphicFactory((_props, ref) => {
-  const props = useProps("Input", defaultProps$1a, _props), {
+  const props = useProps("Input", defaultProps$1o, _props), {
     classNames,
     className,
     style,
@@ -7678,7 +7701,7 @@ const defaultProps$1a = {
   } = props, { styleProps, rest } = extractStyleProps(others), ctx = useInputWrapperContext(), stylesCtx = { offsetBottom: ctx?.offsetBottom, offsetTop: ctx?.offsetTop }, getStyles2 = useStyles({
     name: ["Input", __staticSelector],
     props: __stylesApiProps || props,
-    classes: classes$w,
+    classes: classes$y,
     className,
     style,
     classNames,
@@ -7687,7 +7710,7 @@ const defaultProps$1a = {
     stylesCtx,
     rootSelector: "wrapper",
     vars,
-    varsResolver: varsResolver$v
+    varsResolver: varsResolver$w
   }), ariaAttributes = withAria ? {
     required,
     disabled,
@@ -7757,7 +7780,7 @@ const defaultProps$1a = {
     }
   );
 });
-Input.classes = classes$w;
+Input.classes = classes$y;
 Input.Wrapper = InputWrapper;
 Input.Label = InputLabel;
 Input.Error = InputError;
@@ -7834,11 +7857,11 @@ function useInputProps(component, defaultProps2, _props) {
     }
   };
 }
-const defaultProps$19 = {
+const defaultProps$1n = {
   __staticSelector: "InputBase",
   withAria: !0
 }, InputBase = polymorphicFactory((props, ref) => {
-  const { inputProps, wrapperProps, ...others } = useInputProps("InputBase", defaultProps$19, props);
+  const { inputProps, wrapperProps, ...others } = useInputProps("InputBase", defaultProps$1n, props);
   return /* @__PURE__ */ jsx(Input.Wrapper, { ...wrapperProps, children: /* @__PURE__ */ jsx(Input, { ...inputProps, ...others, ref }) });
 });
 InputBase.classes = { ...Input.classes, ...Input.Wrapper.classes };
@@ -7852,9 +7875,9 @@ const FLEX_STYLE_PROPS_DATA = {
   wrap: { type: "identity", property: "flexWrap" },
   direction: { type: "identity", property: "flexDirection" }
 };
-var __default__$v = { root: "m_8bffd616" };
-const classes$v = __default__$v, defaultProps$18 = {}, Flex = polymorphicFactory((_props, ref) => {
-  const props = useProps("Flex", defaultProps$18, _props), {
+var __default__$x = { root: "m_8bffd616" };
+const classes$x = __default__$x, defaultProps$1m = {}, Flex = polymorphicFactory((_props, ref) => {
+  const props = useProps("Flex", defaultProps$1m, _props), {
     classNames,
     className,
     style,
@@ -7871,7 +7894,7 @@ const classes$v = __default__$v, defaultProps$18 = {}, Flex = polymorphicFactory
     ...others
   } = props, getStyles2 = useStyles({
     name: "Flex",
-    classes: classes$v,
+    classes: classes$x,
     props,
     className,
     style,
@@ -7906,7 +7929,7 @@ const classes$v = __default__$v, defaultProps$18 = {}, Flex = polymorphicFactory
     )
   ] });
 });
-Flex.classes = classes$v;
+Flex.classes = classes$x;
 Flex.displayName = "@mantine/core/Flex";
 function isParent(parentElement, childElement) {
   if (!childElement || !parentElement)
@@ -7972,13 +7995,13 @@ function useFloatingIndicator({
     () => document.documentElement
   ), { initialized, hidden: hidden2 };
 }
-var __default__$u = { root: "m_96b553a6" };
-const classes$u = __default__$u, defaultProps$17 = {}, varsResolver$u = (_theme, { transitionDuration }) => ({
+var __default__$w = { root: "m_96b553a6" };
+const classes$w = __default__$w, defaultProps$1l = {}, varsResolver$v = (_theme, { transitionDuration }) => ({
   root: {
     "--transition-duration": typeof transitionDuration == "number" ? `${transitionDuration}ms` : transitionDuration
   }
 }), FloatingIndicator = factory((_props, ref) => {
-  const props = useProps("FloatingIndicator", defaultProps$17, _props), {
+  const props = useProps("FloatingIndicator", defaultProps$1l, _props), {
     classNames,
     className,
     style,
@@ -7993,7 +8016,7 @@ const classes$u = __default__$u, defaultProps$17 = {}, varsResolver$u = (_theme,
     ...others
   } = props, getStyles2 = useStyles({
     name: "FloatingIndicator",
-    classes: classes$u,
+    classes: classes$w,
     props,
     className,
     style,
@@ -8001,7 +8024,7 @@ const classes$u = __default__$u, defaultProps$17 = {}, varsResolver$u = (_theme,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$u
+    varsResolver: varsResolver$v
   }), innerRef = useRef(null), { initialized, hidden: hidden2 } = useFloatingIndicator({
     target,
     parent,
@@ -8011,9 +8034,9 @@ const classes$u = __default__$u, defaultProps$17 = {}, varsResolver$u = (_theme,
   return !target || !parent ? null : /* @__PURE__ */ jsx(Box, { ref: mergedRef, mod: [{ initialized, hidden: hidden2 }, mod], ...getStyles2("root"), ...others });
 });
 FloatingIndicator.displayName = "@mantine/core/FloatingIndicator";
-FloatingIndicator.classes = classes$u;
-var __default__$t = { root: "m_66836ed3", wrapper: "m_a5d60502", body: "m_667c2793", title: "m_6a03f287", label: "m_698f4f23", icon: "m_667f2a6a", message: "m_7fa78076", closeButton: "m_87f54839" };
-const classes$t = __default__$t, defaultProps$16 = {}, varsResolver$t = (theme, { radius, color, variant, autoContrast }) => {
+FloatingIndicator.classes = classes$w;
+var __default__$v = { root: "m_66836ed3", wrapper: "m_a5d60502", body: "m_667c2793", title: "m_6a03f287", label: "m_698f4f23", icon: "m_667f2a6a", message: "m_7fa78076", closeButton: "m_87f54839" };
+const classes$v = __default__$v, defaultProps$1k = {}, varsResolver$u = (theme, { radius, color, variant, autoContrast }) => {
   const colors = theme.variantColorResolver({
     color: color || theme.primaryColor,
     theme,
@@ -8029,7 +8052,7 @@ const classes$t = __default__$t, defaultProps$16 = {}, varsResolver$t = (theme,
     }
   };
 }, Alert = factory((_props, ref) => {
-  const props = useProps("Alert", defaultProps$16, _props), {
+  const props = useProps("Alert", defaultProps$1k, _props), {
     classNames,
     className,
     style,
@@ -8050,7 +8073,7 @@ const classes$t = __default__$t, defaultProps$16 = {}, varsResolver$t = (theme,
     ...others
   } = props, getStyles2 = useStyles({
     name: "Alert",
-    classes: classes$t,
+    classes: classes$v,
     props,
     className,
     style,
@@ -8058,7 +8081,7 @@ const classes$t = __default__$t, defaultProps$16 = {}, varsResolver$t = (theme,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$t
+    varsResolver: varsResolver$u
   }), rootId = useId$1(id), titleId = title && `${rootId}-title` || void 0, bodyId = `${rootId}-body`;
   return /* @__PURE__ */ jsx(
     Box,
@@ -8093,19 +8116,19 @@ const classes$t = __default__$t, defaultProps$16 = {}, varsResolver$t = (theme,
     }
   );
 });
-Alert.classes = classes$t;
+Alert.classes = classes$v;
 Alert.displayName = "@mantine/core/Alert";
-var __default__$s = { root: "m_b6d8b162" };
-const classes$s = __default__$s;
+var __default__$u = { root: "m_b6d8b162" };
+const classes$u = __default__$u;
 function getTextTruncate(truncate) {
   if (truncate === "start")
     return "start";
   if (truncate === "end" || truncate)
     return "end";
 }
-const defaultProps$15 = {
+const defaultProps$1j = {
   inherit: !1
-}, varsResolver$s = (theme, { variant, lineClamp, gradient, size: size2, color }) => ({
+}, varsResolver$t = (theme, { variant, lineClamp, gradient, size: size2, color }) => ({
   root: {
     "--text-fz": getFontSize(size2),
     "--text-lh": getLineHeight(size2),
@@ -8114,7 +8137,7 @@ const defaultProps$15 = {
     "--text-color": color ? getThemeColor(color, theme) : void 0
   }
 }), Text = polymorphicFactory((_props, ref) => {
-  const props = useProps("Text", defaultProps$15, _props), {
+  const props = useProps("Text", defaultProps$1j, _props), {
     lineClamp,
     truncate,
     inline: inline2,
@@ -8135,14 +8158,14 @@ const defaultProps$15 = {
   } = props, getStyles2 = useStyles({
     name: ["Text", __staticSelector],
     props,
-    classes: classes$s,
+    classes: classes$u,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$s
+    varsResolver: varsResolver$t
   });
   return /* @__PURE__ */ jsx(
     Box,
@@ -8165,15 +8188,15 @@ const defaultProps$15 = {
     }
   );
 });
-Text.classes = classes$s;
+Text.classes = classes$u;
 Text.displayName = "@mantine/core/Text";
-var __default__$r = { root: "m_849cf0da" };
-const classes$r = __default__$r, defaultProps$14 = {
+var __default__$t = { root: "m_849cf0da" };
+const classes$t = __default__$t, defaultProps$1i = {
   underline: "hover"
 }, Anchor = polymorphicFactory((props, ref) => {
   const { underline, className, unstyled, mod, ...others } = useProps(
     "Anchor",
-    defaultProps$14,
+    defaultProps$1i,
     props
   );
   return /* @__PURE__ */ jsx(
@@ -8181,7 +8204,7 @@ const classes$r = __default__$r, defaultProps$14 = {
     {
       component: "a",
       ref,
-      className: clsx({ [classes$r.root]: !unstyled }, className),
+      className: clsx({ [classes$t.root]: !unstyled }, className),
       ...others,
       mod: [{ underline }, mod],
       __staticSelector: "Anchor",
@@ -8189,7 +8212,7 @@ const classes$r = __default__$r, defaultProps$14 = {
     }
   );
 });
-Anchor.classes = classes$r;
+Anchor.classes = classes$t;
 Anchor.displayName = "@mantine/core/Anchor";
 function parseItem(item) {
   return typeof item == "string" ? { value: item, label: item } : "value" in item && !("label" in item) ? { value: item.value, label: item.value, disabled: item.disabled } : typeof item == "number" ? { value: item.toString(), label: item.toString() } : "group" in item ? {
@@ -8203,17 +8226,17 @@ function getParsedComboboxData(data) {
 function getOptionsLockup(options) {
   return options.reduce((acc, item) => "group" in item ? { ...acc, ...getOptionsLockup(item.items) } : (acc[item.value] = item, acc), {});
 }
-var __default__$q = { dropdown: "m_88b62a41", search: "m_985517d8", options: "m_b2821a6e", option: "m_92253aa5", empty: "m_2530cd1d", header: "m_858f94bd", footer: "m_82b967cb", group: "m_254f3e4f", groupLabel: "m_2bb2e9e5", chevron: "m_2943220b", optionsDropdownOption: "m_390b5f4", optionsDropdownCheckIcon: "m_8ee53fc2" };
-const classes$q = __default__$q, defaultProps$13 = {
+var __default__$s = { dropdown: "m_88b62a41", search: "m_985517d8", options: "m_b2821a6e", option: "m_92253aa5", empty: "m_2530cd1d", header: "m_858f94bd", footer: "m_82b967cb", group: "m_254f3e4f", groupLabel: "m_2bb2e9e5", chevron: "m_2943220b", optionsDropdownOption: "m_390b5f4", optionsDropdownCheckIcon: "m_8ee53fc2" };
+const classes$s = __default__$s, defaultProps$1h = {
   error: null
-}, varsResolver$r = (_, { size: size2 }) => ({
+}, varsResolver$s = (_, { size: size2 }) => ({
   chevron: {
     "--combobox-chevron-size": getSize(size2, "combobox-chevron-size")
   }
 }), ComboboxChevron = factory((_props, ref) => {
-  const props = useProps("ComboboxChevron", defaultProps$13, _props), { size: size2, error, style, className, classNames, styles, unstyled, vars, mod, ...others } = props, getStyles2 = useStyles({
+  const props = useProps("ComboboxChevron", defaultProps$1h, _props), { size: size2, error, style, className, classNames, styles, unstyled, vars, mod, ...others } = props, getStyles2 = useStyles({
     name: "ComboboxChevron",
-    classes: classes$q,
+    classes: classes$s,
     props,
     style,
     className,
@@ -8221,7 +8244,7 @@ const classes$q = __default__$q, defaultProps$13 = {
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$r,
+    varsResolver: varsResolver$s,
     rootSelector: "chevron"
   });
   return /* @__PURE__ */ jsx(
@@ -8248,7 +8271,7 @@ const classes$q = __default__$q, defaultProps$13 = {
     }
   );
 });
-ComboboxChevron.classes = classes$q;
+ComboboxChevron.classes = classes$s;
 ComboboxChevron.displayName = "@mantine/core/ComboboxChevron";
 const [ComboboxProvider, useComboboxContext] = createSafeContext(
   "Combobox component was not found in tree"
@@ -8272,10 +8295,10 @@ const [ComboboxProvider, useComboboxContext] = createSafeContext(
   )
 );
 ComboboxClearButton.displayName = "@mantine/core/ComboboxClearButton";
-const defaultProps$12 = {}, ComboboxDropdown = factory((props, ref) => {
+const defaultProps$1g = {}, ComboboxDropdown = factory((props, ref) => {
   const { classNames, styles, className, style, hidden: hidden2, ...others } = useProps(
     "ComboboxDropdown",
-    defaultProps$12,
+    defaultProps$1g,
     props
   ), ctx = useComboboxContext();
   return /* @__PURE__ */ jsx(
@@ -8289,12 +8312,12 @@ const defaultProps$12 = {}, ComboboxDropdown = factory((props, ref) => {
     }
   );
 });
-ComboboxDropdown.classes = classes$q;
+ComboboxDropdown.classes = classes$s;
 ComboboxDropdown.displayName = "@mantine/core/ComboboxDropdown";
-const defaultProps$11 = {
+const defaultProps$1f = {
   refProp: "ref"
 }, ComboboxDropdownTarget = factory((props, ref) => {
-  const { children, refProp } = useProps("ComboboxDropdownTarget", defaultProps$11, props);
+  const { children, refProp } = useProps("ComboboxDropdownTarget", defaultProps$1f, props);
   if (useComboboxContext(), !isElement$1(children))
     throw new Error(
       "Combobox.DropdownTarget component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported"
@@ -8302,10 +8325,10 @@ const defaultProps$11 = {
   return /* @__PURE__ */ jsx(Popover.Target, { ref, refProp, children });
 });
 ComboboxDropdownTarget.displayName = "@mantine/core/ComboboxDropdownTarget";
-const defaultProps$10 = {}, ComboboxEmpty = factory((props, ref) => {
+const defaultProps$1e = {}, ComboboxEmpty = factory((props, ref) => {
   const { classNames, className, style, styles, vars, ...others } = useProps(
     "ComboboxEmpty",
-    defaultProps$10,
+    defaultProps$1e,
     props
   ), ctx = useComboboxContext();
   return /* @__PURE__ */ jsx(
@@ -8317,7 +8340,7 @@ const defaultProps$10 = {}, ComboboxEmpty = factory((props, ref) => {
     }
   );
 });
-ComboboxEmpty.classes = classes$q;
+ComboboxEmpty.classes = classes$s;
 ComboboxEmpty.displayName = "@mantine/core/ComboboxEmpty";
 function useComboboxTargetProps({
   onKeyDown,
@@ -8331,7 +8354,7 @@ function useComboboxTargetProps({
     if (onKeyDown?.(event), !ctx.readOnly && withKeyboardNavigation) {
       if (event.nativeEvent.isComposing)
         return;
-      if (event.nativeEvent.code === "ArrowDown" && (event.preventDefault(), ctx.store.dropdownOpened ? setSelectedOptionId(ctx.store.selectNextOption()) : (ctx.store.openDropdown("keyboard"), setSelectedOptionId(ctx.store.selectActiveOption()))), event.nativeEvent.code === "ArrowUp" && (event.preventDefault(), ctx.store.dropdownOpened ? setSelectedOptionId(ctx.store.selectPreviousOption()) : (ctx.store.openDropdown("keyboard"), setSelectedOptionId(ctx.store.selectActiveOption()))), event.nativeEvent.code === "Enter" || event.nativeEvent.code === "NumpadEnter") {
+      if (event.nativeEvent.code === "ArrowDown" && (event.preventDefault(), ctx.store.dropdownOpened ? setSelectedOptionId(ctx.store.selectNextOption()) : (ctx.store.openDropdown("keyboard"), setSelectedOptionId(ctx.store.selectActiveOption()), ctx.store.updateSelectedOptionIndex("selected", { scrollIntoView: !0 }))), event.nativeEvent.code === "ArrowUp" && (event.preventDefault(), ctx.store.dropdownOpened ? setSelectedOptionId(ctx.store.selectPreviousOption()) : (ctx.store.openDropdown("keyboard"), setSelectedOptionId(ctx.store.selectActiveOption()), ctx.store.updateSelectedOptionIndex("selected", { scrollIntoView: !0 }))), event.nativeEvent.code === "Enter" || event.nativeEvent.code === "NumpadEnter") {
         if (event.nativeEvent.keyCode === 229)
           return;
         const selectedOptionIndex = ctx.store.getSelectedOptionIndex();
@@ -8344,7 +8367,7 @@ function useComboboxTargetProps({
     ...withAriaAttributes ? {
       "aria-haspopup": "listbox",
       "aria-expanded": withExpandedAttribute && !!(ctx.store.listId && ctx.store.dropdownOpened) || void 0,
-      "aria-controls": ctx.store.listId,
+      "aria-controls": ctx.store.dropdownOpened ? ctx.store.listId : void 0,
       "aria-activedescendant": ctx.store.dropdownOpened && selectedOptionId || void 0,
       autoComplete,
       "data-expanded": ctx.store.dropdownOpened || void 0,
@@ -8353,7 +8376,7 @@ function useComboboxTargetProps({
     onKeyDown: handleKeyDown
   };
 }
-const defaultProps$$ = {
+const defaultProps$1d = {
   refProp: "ref",
   targetType: "input",
   withKeyboardNavigation: !0,
@@ -8370,7 +8393,7 @@ const defaultProps$$ = {
     targetType,
     autoComplete,
     ...others
-  } = useProps("ComboboxEventsTarget", defaultProps$$, props);
+  } = useProps("ComboboxEventsTarget", defaultProps$1d, props);
   if (!isElement$1(children))
     throw new Error(
       "Combobox.EventsTarget component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported"
@@ -8386,14 +8409,14 @@ const defaultProps$$ = {
   return cloneElement(children, {
     ...targetProps,
     ...others,
-    [refProp]: useMergedRef(ref, ctx.store.targetRef, children?.ref)
+    [refProp]: useMergedRef(ref, ctx.store.targetRef, getRefProp(children))
   });
 });
 ComboboxEventsTarget.displayName = "@mantine/core/ComboboxEventsTarget";
-const defaultProps$_ = {}, ComboboxFooter = factory((props, ref) => {
+const defaultProps$1c = {}, ComboboxFooter = factory((props, ref) => {
   const { classNames, className, style, styles, vars, ...others } = useProps(
     "ComboboxFooter",
-    defaultProps$_,
+    defaultProps$1c,
     props
   ), ctx = useComboboxContext();
   return /* @__PURE__ */ jsx(
@@ -8408,12 +8431,12 @@ const defaultProps$_ = {}, ComboboxFooter = factory((props, ref) => {
     }
   );
 });
-ComboboxFooter.classes = classes$q;
+ComboboxFooter.classes = classes$s;
 ComboboxFooter.displayName = "@mantine/core/ComboboxFooter";
-const defaultProps$Z = {}, ComboboxGroup = factory((props, ref) => {
+const defaultProps$1b = {}, ComboboxGroup = factory((props, ref) => {
   const { classNames, className, style, styles, vars, children, label, ...others } = useProps(
     "ComboboxGroup",
-    defaultProps$Z,
+    defaultProps$1b,
     props
   ), ctx = useComboboxContext();
   return /* @__PURE__ */ jsxs(
@@ -8429,12 +8452,12 @@ const defaultProps$Z = {}, ComboboxGroup = factory((props, ref) => {
     }
   );
 });
-ComboboxGroup.classes = classes$q;
+ComboboxGroup.classes = classes$s;
 ComboboxGroup.displayName = "@mantine/core/ComboboxGroup";
-const defaultProps$Y = {}, ComboboxHeader = factory((props, ref) => {
+const defaultProps$1a = {}, ComboboxHeader = factory((props, ref) => {
   const { classNames, className, style, styles, vars, ...others } = useProps(
     "ComboboxHeader",
-    defaultProps$Y,
+    defaultProps$1a,
     props
   ), ctx = useComboboxContext();
   return /* @__PURE__ */ jsx(
@@ -8449,7 +8472,7 @@ const defaultProps$Y = {}, ComboboxHeader = factory((props, ref) => {
     }
   );
 });
-ComboboxHeader.classes = classes$q;
+ComboboxHeader.classes = classes$s;
 ComboboxHeader.displayName = "@mantine/core/ComboboxHeader";
 function ComboboxHiddenInput({
   value,
@@ -8466,8 +8489,8 @@ function ComboboxHiddenInput({
   );
 }
 ComboboxHiddenInput.displayName = "@mantine/core/ComboboxHiddenInput";
-const defaultProps$X = {}, ComboboxOption = factory((_props, ref) => {
-  const props = useProps("ComboboxOption", defaultProps$X, _props), {
+const defaultProps$19 = {}, ComboboxOption = factory((_props, ref) => {
+  const props = useProps("ComboboxOption", defaultProps$19, _props), {
     classNames,
     className,
     style,
@@ -8508,10 +8531,10 @@ const defaultProps$X = {}, ComboboxOption = factory((_props, ref) => {
     }
   );
 });
-ComboboxOption.classes = classes$q;
+ComboboxOption.classes = classes$s;
 ComboboxOption.displayName = "@mantine/core/ComboboxOption";
-const defaultProps$W = {}, ComboboxOptions = factory((_props, ref) => {
-  const props = useProps("ComboboxOptions", defaultProps$W, _props), { classNames, className, style, styles, id, onMouseDown, labelledBy, ...others } = props, ctx = useComboboxContext(), _id = useId$1(id);
+const defaultProps$18 = {}, ComboboxOptions = factory((_props, ref) => {
+  const props = useProps("ComboboxOptions", defaultProps$18, _props), { classNames, className, style, styles, id, onMouseDown, labelledBy, ...others } = props, ctx = useComboboxContext(), _id = useId$1(id);
   return useEffect(() => {
     ctx.store.setListId(_id);
   }, [_id]), /* @__PURE__ */ jsx(
@@ -8529,13 +8552,13 @@ const defaultProps$W = {}, ComboboxOptions = factory((_props, ref) => {
     }
   );
 });
-ComboboxOptions.classes = classes$q;
+ComboboxOptions.classes = classes$s;
 ComboboxOptions.displayName = "@mantine/core/ComboboxOptions";
-const defaultProps$V = {
+const defaultProps$17 = {
   withAriaAttributes: !0,
   withKeyboardNavigation: !0
 }, ComboboxSearch = factory((_props, ref) => {
-  const props = useProps("ComboboxSearch", defaultProps$V, _props), {
+  const props = useProps("ComboboxSearch", defaultProps$17, _props), {
     classNames,
     styles,
     unstyled,
@@ -8566,9 +8589,9 @@ const defaultProps$V = {
     }
   );
 });
-ComboboxSearch.classes = classes$q;
+ComboboxSearch.classes = classes$s;
 ComboboxSearch.displayName = "@mantine/core/ComboboxSearch";
-const defaultProps$U = {
+const defaultProps$16 = {
   refProp: "ref",
   targetType: "input",
   withKeyboardNavigation: !0,
@@ -8585,7 +8608,7 @@ const defaultProps$U = {
     targetType,
     autoComplete,
     ...others
-  } = useProps("ComboboxTarget", defaultProps$U, props);
+  } = useProps("ComboboxTarget", defaultProps$16, props);
   if (!isElement$1(children))
     throw new Error(
       "Combobox.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported"
@@ -8727,7 +8750,7 @@ function useCombobox({
     document.querySelectorAll(
       `#${listId.current} [data-combobox-option]`
     )?.[selectedOptionIndex.current]?.click();
-  }, []), setListId = useCallback((id) => {
+  }, []), setListId2 = useCallback((id) => {
     listId.current = id;
   }, []), focusSearchInput = useCallback(() => {
     focusSearchTimeout.current = window.setTimeout(() => searchRef.current.focus(), 0);
@@ -8754,7 +8777,7 @@ function useCombobox({
     resetSelectedOption,
     updateSelectedOptionIndex,
     listId: listId.current,
-    setListId,
+    setListId: setListId2,
     clickSelectedOption,
     searchRef,
     focusSearchInput,
@@ -8762,13 +8785,13 @@ function useCombobox({
     focusTarget
   };
 }
-const defaultProps$T = {
+const defaultProps$15 = {
   keepMounted: !0,
   withinPortal: !0,
   resetSelectionOnOptionHover: !1,
   width: "target",
   transitionProps: { transition: "fade", duration: 0 }
-}, varsResolver$q = (_, { size: size2, dropdownPadding }) => ({
+}, varsResolver$r = (_, { size: size2, dropdownPadding }) => ({
   options: {
     "--combobox-option-fz": getFontSize(size2),
     "--combobox-option-padding": getSize(size2, "combobox-option-padding")
@@ -8780,7 +8803,7 @@ const defaultProps$T = {
   }
 });
 function Combobox(_props) {
-  const props = useProps("Combobox", defaultProps$T, _props), {
+  const props = useProps("Combobox", defaultProps$15, _props), {
     classNames,
     styles,
     unstyled,
@@ -8797,13 +8820,13 @@ function Combobox(_props) {
     ...others
   } = props, uncontrolledStore = useCombobox(), store = controlledStore || uncontrolledStore, getStyles2 = useStyles({
     name: __staticSelector || "Combobox",
-    classes: classes$q,
+    classes: classes$s,
     props,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$q
+    varsResolver: varsResolver$r
   }), onDropdownClose = () => {
     onClose?.(), store.closeDropdown();
   };
@@ -8834,7 +8857,7 @@ function Combobox(_props) {
 }
 const extendCombobox = (c) => c;
 Combobox.extend = extendCombobox;
-Combobox.classes = classes$q;
+Combobox.classes = classes$s;
 Combobox.displayName = "@mantine/core/Combobox";
 Combobox.Target = ComboboxTarget;
 Combobox.Dropdown = ComboboxDropdown;
@@ -8936,7 +8959,7 @@ function Option({
   renderOption
 }) {
   if (!isOptionsGroup(data)) {
-    const checked = isValueChecked(value, data.value), check = withCheckIcon && checked && /* @__PURE__ */ jsx(CheckIcon, { className: classes$q.optionsDropdownCheckIcon }), defaultContent = /* @__PURE__ */ jsxs(Fragment$1, { children: [
+    const checked = isValueChecked(value, data.value), check = withCheckIcon && checked && /* @__PURE__ */ jsx(CheckIcon, { className: classes$s.optionsDropdownCheckIcon }), defaultContent = /* @__PURE__ */ jsxs(Fragment$1, { children: [
       checkIconPosition === "left" && check,
       /* @__PURE__ */ jsx("span", { children: data.label }),
       checkIconPosition === "right" && check
@@ -8946,7 +8969,7 @@ function Option({
       {
         value: data.value,
         disabled: data.disabled,
-        className: clsx({ [classes$q.optionsDropdownOption]: !unstyled }),
+        className: clsx({ [classes$s.optionsDropdownOption]: !unstyled }),
         "data-reverse": checkIconPosition === "right" || void 0,
         "data-checked": checked || void 0,
         "aria-selected": checked,
@@ -9021,8 +9044,8 @@ function OptionsDropdown({
     isEmpty && nothingFoundMessage && /* @__PURE__ */ jsx(Combobox.Empty, { children: nothingFoundMessage })
   ] }) });
 }
-var __default__$p = { root: "m_347db0ec", "root--dot": "m_fbd81e3d", label: "m_5add502a", section: "m_91fdda9b" };
-const classes$p = __default__$p, defaultProps$S = {}, varsResolver$p = (theme, { radius, color, gradient, variant, size: size2, autoContrast }) => {
+var __default__$r = { root: "m_347db0ec", "root--dot": "m_fbd81e3d", label: "m_5add502a", section: "m_91fdda9b" };
+const classes$r = __default__$r, defaultProps$14 = {}, varsResolver$q = (theme, { radius, color, gradient, variant, size: size2, autoContrast }) => {
   const colors = theme.variantColorResolver({
     color: color || theme.primaryColor,
     theme,
@@ -9043,7 +9066,7 @@ const classes$p = __default__$p, defaultProps$S = {}, varsResolver$p = (theme, {
     }
   };
 }, Badge = polymorphicFactory((_props, ref) => {
-  const props = useProps("Badge", defaultProps$S, _props), {
+  const props = useProps("Badge", defaultProps$14, _props), {
     classNames,
     className,
     style,
@@ -9065,14 +9088,14 @@ const classes$p = __default__$p, defaultProps$S = {}, varsResolver$p = (theme, {
   } = props, getStyles2 = useStyles({
     name: "Badge",
     props,
-    classes: classes$p,
+    classes: classes$r,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$p
+    varsResolver: varsResolver$q
   });
   return /* @__PURE__ */ jsxs(
     Box,
@@ -9098,10 +9121,10 @@ const classes$p = __default__$p, defaultProps$S = {}, varsResolver$p = (theme, {
     }
   );
 });
-Badge.classes = classes$p;
+Badge.classes = classes$r;
 Badge.displayName = "@mantine/core/Badge";
-var __default__$o = { root: "m_fea6bf1a", burger: "m_d4fb9cad" };
-const classes$o = __default__$o, defaultProps$R = {}, varsResolver$o = (theme, { color, size: size2, lineSize, transitionDuration, transitionTimingFunction }) => ({
+var __default__$q = { root: "m_fea6bf1a", burger: "m_d4fb9cad" };
+const classes$q = __default__$q, defaultProps$13 = {}, varsResolver$p = (theme, { color, size: size2, lineSize, transitionDuration, transitionTimingFunction }) => ({
   root: {
     "--burger-color": color ? getThemeColor(color, theme) : void 0,
     "--burger-size": getSize(size2, "burger-size"),
@@ -9110,7 +9133,7 @@ const classes$o = __default__$o, defaultProps$R = {}, varsResolver$o = (theme, {
     "--burger-transition-timing-function": transitionTimingFunction
   }
 }), Burger = factory((_props, ref) => {
-  const props = useProps("Burger", defaultProps$R, _props), {
+  const props = useProps("Burger", defaultProps$13, _props), {
     classNames,
     className,
     style,
@@ -9125,7 +9148,7 @@ const classes$o = __default__$o, defaultProps$R = {}, varsResolver$o = (theme, {
     ...others
   } = props, getStyles2 = useStyles({
     name: "Burger",
-    classes: classes$o,
+    classes: classes$q,
     props,
     className,
     style,
@@ -9133,22 +9156,22 @@ const classes$o = __default__$o, defaultProps$R = {}, varsResolver$o = (theme, {
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$o
+    varsResolver: varsResolver$p
   });
   return /* @__PURE__ */ jsxs(UnstyledButton, { ...getStyles2("root"), ref, ...others, children: [
     /* @__PURE__ */ jsx(Box, { mod: ["reduce-motion", { opened }], ...getStyles2("burger") }),
     children
   ] });
 });
-Burger.classes = classes$o;
+Burger.classes = classes$q;
 Burger.displayName = "@mantine/core/Burger";
-var __default__$n = { root: "m_77c9d27d", inner: "m_80f1301b", label: "m_811560b9", section: "m_a74036a", loader: "m_a25b86ee", group: "m_80d6d844" };
-const classes$n = __default__$n, defaultProps$Q = {
+var __default__$p = { root: "m_77c9d27d", inner: "m_80f1301b", label: "m_811560b9", section: "m_a74036a", loader: "m_a25b86ee", group: "m_80d6d844" };
+const classes$p = __default__$p, defaultProps$12 = {
   orientation: "horizontal"
-}, varsResolver$n = (_, { borderWidth }) => ({
+}, varsResolver$o = (_, { borderWidth }) => ({
   group: { "--button-border-width": rem(borderWidth) }
 }), ButtonGroup = factory((_props, ref) => {
-  const props = useProps("ButtonGroup", defaultProps$Q, _props), {
+  const props = useProps("ButtonGroup", defaultProps$12, _props), {
     className,
     style,
     classNames,
@@ -9160,17 +9183,17 @@ const classes$n = __default__$n, defaultProps$Q = {
     variant,
     mod,
     ...others
-  } = useProps("ButtonGroup", defaultProps$Q, _props), getStyles2 = useStyles({
+  } = useProps("ButtonGroup", defaultProps$12, _props), getStyles2 = useStyles({
     name: "ButtonGroup",
     props,
-    classes: classes$n,
+    classes: classes$p,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$n,
+    varsResolver: varsResolver$o,
     rootSelector: "group"
   });
   return /* @__PURE__ */ jsx(
@@ -9185,14 +9208,14 @@ const classes$n = __default__$n, defaultProps$Q = {
     }
   );
 });
-ButtonGroup.classes = classes$n;
+ButtonGroup.classes = classes$p;
 ButtonGroup.displayName = "@mantine/core/ButtonGroup";
 const loaderTransition = {
   in: { opacity: 1, transform: `translate(-50%, calc(-50% + ${rem(1)}))` },
   out: { opacity: 0, transform: "translate(-50%, -200%)" },
   common: { transformOrigin: "center" },
   transitionProperty: "transform, opacity"
-}, defaultProps$P = {}, varsResolver$m = (theme, { radius, color, gradient, variant, size: size2, justify, autoContrast }) => {
+}, defaultProps$11 = {}, varsResolver$n = (theme, { radius, color, gradient, variant, size: size2, justify, autoContrast }) => {
   const colors = theme.variantColorResolver({
     color: color || theme.primaryColor,
     theme,
@@ -9215,7 +9238,7 @@ const loaderTransition = {
     }
   };
 }, Button = polymorphicFactory((_props, ref) => {
-  const props = useProps("Button", defaultProps$P, _props), {
+  const props = useProps("Button", defaultProps$11, _props), {
     style,
     vars,
     className,
@@ -9240,14 +9263,14 @@ const loaderTransition = {
   } = props, getStyles2 = useStyles({
     name: "Button",
     props,
-    classes: classes$n,
+    classes: classes$p,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$m
+    varsResolver: varsResolver$n
   }), hasLeftSection = !!leftSection, hasRightSection = !!rightSection;
   return /* @__PURE__ */ jsxs(
     UnstyledButton,
@@ -9286,15 +9309,15 @@ const loaderTransition = {
     }
   );
 });
-Button.classes = classes$n;
+Button.classes = classes$p;
 Button.displayName = "@mantine/core/Button";
 Button.Group = ButtonGroup;
 const [CardProvider, useCardContext] = createSafeContext(
   "Card component was not found in tree"
 );
-var __default__$m = { root: "m_e615b15f", section: "m_599a2148" };
-const classes$m = __default__$m, defaultProps$O = {}, CardSection = polymorphicFactory((_props, ref) => {
-  const props = useProps("CardSection", defaultProps$O, _props), { classNames, className, style, styles, vars, withBorder, inheritPadding, mod, ...others } = props, ctx = useCardContext();
+var __default__$o = { root: "m_e615b15f", section: "m_599a2148" };
+const classes$o = __default__$o, defaultProps$10 = {}, CardSection = polymorphicFactory((_props, ref) => {
+  const props = useProps("CardSection", defaultProps$10, _props), { classNames, className, style, styles, vars, withBorder, inheritPadding, mod, ...others } = props, ctx = useCardContext();
   return /* @__PURE__ */ jsx(
     Box,
     {
@@ -9305,39 +9328,39 @@ const classes$m = __default__$m, defaultProps$O = {}, CardSection = polymorphicF
     }
   );
 });
-CardSection.classes = classes$m;
+CardSection.classes = classes$o;
 CardSection.displayName = "@mantine/core/CardSection";
-const defaultProps$N = {}, varsResolver$l = (_, { padding }) => ({
+const defaultProps$$ = {}, varsResolver$m = (_, { padding }) => ({
   root: {
     "--card-padding": getSpacing(padding)
   }
 }), Card = polymorphicFactory((_props, ref) => {
-  const props = useProps("Card", defaultProps$N, _props), { classNames, className, style, styles, unstyled, vars, children, padding, ...others } = props, getStyles2 = useStyles({
+  const props = useProps("Card", defaultProps$$, _props), { classNames, className, style, styles, unstyled, vars, children, padding, ...others } = props, getStyles2 = useStyles({
     name: "Card",
     props,
-    classes: classes$m,
+    classes: classes$o,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$l
+    varsResolver: varsResolver$m
   }), _children = Children.toArray(children), content = _children.map((child, index2) => typeof child == "object" && child && "type" in child && child.type === CardSection ? cloneElement(child, {
     "data-first-section": index2 === 0 || void 0,
     "data-last-section": index2 === _children.length - 1 || void 0
   }) : child);
   return /* @__PURE__ */ jsx(CardProvider, { value: { getStyles: getStyles2 }, children: /* @__PURE__ */ jsx(Paper, { ref, unstyled, ...getStyles2("root"), ...others, children: content }) });
 });
-Card.classes = classes$m;
+Card.classes = classes$o;
 Card.displayName = "@mantine/core/Card";
 Card.Section = CardSection;
-var __default__$l = { root: "m_4451eb3a" };
-const classes$l = __default__$l, defaultProps$M = {}, Center = polymorphicFactory((_props, ref) => {
-  const props = useProps("Center", defaultProps$M, _props), { classNames, className, style, styles, unstyled, vars, inline: inline2, mod, ...others } = props, getStyles2 = useStyles({
+var __default__$n = { root: "m_4451eb3a" };
+const classes$n = __default__$n, defaultProps$_ = {}, Center = polymorphicFactory((_props, ref) => {
+  const props = useProps("Center", defaultProps$_, _props), { classNames, className, style, styles, unstyled, vars, inline: inline2, mod, ...others } = props, getStyles2 = useStyles({
     name: "Center",
     props,
-    classes: classes$l,
+    classes: classes$n,
     className,
     style,
     classNames,
@@ -9347,15 +9370,15 @@ const classes$l = __default__$l, defaultProps$M = {}, Center = polymorphicFactor
   });
   return /* @__PURE__ */ jsx(Box, { ref, mod: [{ inline: inline2 }, mod], ...getStyles2("root"), ...others });
 });
-Center.classes = classes$l;
+Center.classes = classes$n;
 Center.displayName = "@mantine/core/Center";
-var __default__$k = { root: "m_b183c0a2" };
-const classes$k = __default__$k, defaultProps$L = {}, varsResolver$k = (theme, { color }) => ({
+var __default__$m = { root: "m_b183c0a2" };
+const classes$m = __default__$m, defaultProps$Z = {}, varsResolver$l = (theme, { color }) => ({
   root: {
     "--code-bg": color ? getThemeColor(color, theme) : void 0
   }
 }), Code = factory((_props, ref) => {
-  const props = useProps("Code", defaultProps$L, _props), {
+  const props = useProps("Code", defaultProps$Z, _props), {
     classNames,
     className,
     style,
@@ -9370,14 +9393,14 @@ const classes$k = __default__$k, defaultProps$L = {}, varsResolver$k = (theme, {
   } = props, getStyles2 = useStyles({
     name: "Code",
     props,
-    classes: classes$k,
+    classes: classes$m,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$k
+    varsResolver: varsResolver$l
   });
   return /* @__PURE__ */ jsx(
     Box,
@@ -9392,18 +9415,18 @@ const classes$k = __default__$k, defaultProps$L = {}, varsResolver$k = (theme, {
     }
   );
 });
-Code.classes = classes$k;
+Code.classes = classes$m;
 Code.displayName = "@mantine/core/Code";
-var __default__$j = { root: "m_de3d2490", colorOverlay: "m_862f3d1b", shadowOverlay: "m_98ae7f22", alphaOverlay: "m_95709ac0", childrenOverlay: "m_93e74e3" };
-const classes$j = __default__$j, defaultProps$K = {
+var __default__$l = { root: "m_de3d2490", colorOverlay: "m_862f3d1b", shadowOverlay: "m_98ae7f22", alphaOverlay: "m_95709ac0", childrenOverlay: "m_93e74e3" };
+const classes$l = __default__$l, defaultProps$Y = {
   withShadow: !0
-}, varsResolver$j = (_, { radius, size: size2 }) => ({
+}, varsResolver$k = (_, { radius, size: size2 }) => ({
   root: {
     "--cs-radius": radius === void 0 ? void 0 : getRadius(radius),
     "--cs-size": rem(size2)
   }
 }), ColorSwatch = polymorphicFactory((_props, ref) => {
-  const props = useProps("ColorSwatch", defaultProps$K, _props), {
+  const props = useProps("ColorSwatch", defaultProps$Y, _props), {
     classNames,
     className,
     style,
@@ -9417,17 +9440,17 @@ const classes$j = __default__$j, defaultProps$K = {
     children,
     variant,
     ...others
-  } = useProps("ColorSwatch", defaultProps$K, props), getStyles2 = useStyles({
+  } = useProps("ColorSwatch", defaultProps$Y, props), getStyles2 = useStyles({
     name: "ColorSwatch",
     props,
-    classes: classes$j,
+    classes: classes$l,
     className,
     style,
     classNames,
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$j
+    varsResolver: varsResolver$k
   });
   return /* @__PURE__ */ jsxs(
     Box,
@@ -9446,17 +9469,17 @@ const classes$j = __default__$j, defaultProps$K = {
     }
   );
 });
-ColorSwatch.classes = classes$j;
+ColorSwatch.classes = classes$l;
 ColorSwatch.displayName = "@mantine/core/ColorSwatch";
-var __default__$i = { root: "m_7485cace" };
-const classes$i = __default__$i, defaultProps$J = {}, varsResolver$i = (_, { size: size2, fluid }) => ({
+var __default__$k = { root: "m_7485cace" };
+const classes$k = __default__$k, defaultProps$X = {}, varsResolver$j = (_, { size: size2, fluid }) => ({
   root: {
     "--container-size": fluid ? void 0 : getSize(size2, "container-size")
   }
 }), Container = factory((_props, ref) => {
-  const props = useProps("Container", defaultProps$J, _props), { classNames, className, style, styles, unstyled, vars, fluid, mod, ...others } = props, getStyles2 = useStyles({
+  const props = useProps("Container", defaultProps$X, _props), { classNames, className, style, styles, unstyled, vars, fluid, mod, ...others } = props, getStyles2 = useStyles({
     name: "Container",
-    classes: classes$i,
+    classes: classes$k,
     props,
     className,
     style,
@@ -9464,31 +9487,31 @@ const classes$i = __default__$i, defaultProps$J = {}, varsResolver$i = (_, { siz
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$i
+    varsResolver: varsResolver$j
   });
   return /* @__PURE__ */ jsx(Box, { ref, mod: [{ fluid }, mod], ...getStyles2("root"), ...others });
 });
-Container.classes = classes$i;
+Container.classes = classes$k;
 Container.displayName = "@mantine/core/Container";
-const defaultProps$I = {
+const defaultProps$W = {
   timeout: 1e3
 };
 function CopyButton(props) {
-  const { children, timeout, value, ...others } = useProps("CopyButton", defaultProps$I, props), clipboard = useClipboard({ timeout });
+  const { children, timeout, value, ...others } = useProps("CopyButton", defaultProps$W, props), clipboard = useClipboard({ timeout });
   return /* @__PURE__ */ jsx(Fragment$1, { children: children({ copy: () => clipboard.copy(value), copied: clipboard.copied, ...others }) });
 }
 CopyButton.displayName = "@mantine/core/CopyButton";
-var __default__$h = { root: "m_3eebeb36", label: "m_9e365f20" };
-const classes$h = __default__$h, defaultProps$H = {
+var __default__$j = { root: "m_3eebeb36", label: "m_9e365f20" };
+const classes$j = __default__$j, defaultProps$V = {
   orientation: "horizontal"
-}, varsResolver$h = (theme, { color, variant, size: size2 }) => ({
+}, varsResolver$i = (theme, { color, variant, size: size2 }) => ({
   root: {
     "--divider-color": color ? getThemeColor(color, theme) : void 0,
     "--divider-border-style": variant,
     "--divider-size": getSize(size2, "divider-size")
   }
 }), Divider = factory((_props, ref) => {
-  const props = useProps("Divider", defaultProps$H, _props), {
+  const props = useProps("Divider", defaultProps$V, _props), {
     classNames,
     className,
     style,
@@ -9503,7 +9526,7 @@ const classes$h = __default__$h, defaultProps$H = {
     ...others
   } = props, getStyles2 = useStyles({
     name: "Divider",
-    classes: classes$h,
+    classes: classes$j,
     props,
     className,
     style,
@@ -9511,7 +9534,7 @@ const classes$h = __default__$h, defaultProps$H = {
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$h
+    varsResolver: varsResolver$i
   });
   return /* @__PURE__ */ jsx(
     Box,
@@ -9525,14 +9548,14 @@ const classes$h = __default__$h, defaultProps$H = {
     }
   );
 });
-Divider.classes = classes$h;
+Divider.classes = classes$j;
 Divider.displayName = "@mantine/core/Divider";
 const [DrawerProvider, useDrawerContext] = createSafeContext(
   "Drawer component was not found in tree"
 );
-var __default__$g = { root: "m_f11b401e", header: "m_5a7c2c9", content: "m_b8a05bbd", inner: "m_31cd769a" };
-const classes$g = __default__$g, defaultProps$G = {}, DrawerBody = factory((_props, ref) => {
-  const props = useProps("DrawerBody", defaultProps$G, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
+var __default__$i = { root: "m_f11b401e", header: "m_5a7c2c9", content: "m_b8a05bbd", inner: "m_31cd769a" };
+const classes$i = __default__$i, defaultProps$U = {}, DrawerBody = factory((_props, ref) => {
+  const props = useProps("DrawerBody", defaultProps$U, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
   return /* @__PURE__ */ jsx(
     ModalBaseBody,
     {
@@ -9542,10 +9565,10 @@ const classes$g = __default__$g, defaultProps$G = {}, DrawerBody = factory((_pro
     }
   );
 });
-DrawerBody.classes = classes$g;
+DrawerBody.classes = classes$i;
 DrawerBody.displayName = "@mantine/core/DrawerBody";
-const defaultProps$F = {}, DrawerCloseButton = factory((_props, ref) => {
-  const props = useProps("DrawerCloseButton", defaultProps$F, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
+const defaultProps$T = {}, DrawerCloseButton = factory((_props, ref) => {
+  const props = useProps("DrawerCloseButton", defaultProps$T, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
   return /* @__PURE__ */ jsx(
     ModalBaseCloseButton,
     {
@@ -9555,10 +9578,10 @@ const defaultProps$F = {}, DrawerCloseButton = factory((_props, ref) => {
     }
   );
 });
-DrawerCloseButton.classes = classes$g;
+DrawerCloseButton.classes = classes$i;
 DrawerCloseButton.displayName = "@mantine/core/DrawerCloseButton";
-const defaultProps$E = {}, DrawerContent = factory((_props, ref) => {
-  const props = useProps("DrawerContent", defaultProps$E, _props), { classNames, className, style, styles, vars, children, radius, ...others } = props, ctx = useDrawerContext(), Scroll = ctx.scrollAreaComponent || NativeScrollArea;
+const defaultProps$S = {}, DrawerContent = factory((_props, ref) => {
+  const props = useProps("DrawerContent", defaultProps$S, _props), { classNames, className, style, styles, vars, children, radius, __hidden, ...others } = props, ctx = useDrawerContext(), Scroll = ctx.scrollAreaComponent || NativeScrollArea;
   return /* @__PURE__ */ jsx(
     ModalBaseContent,
     {
@@ -9567,14 +9590,15 @@ const defaultProps$E = {}, DrawerContent = factory((_props, ref) => {
       ref,
       ...others,
       radius: radius || ctx.radius || 0,
+      "data-hidden": __hidden || void 0,
       children: /* @__PURE__ */ jsx(Scroll, { style: { height: "calc(100vh - var(--drawer-offset) * 2)" }, children })
     }
   );
 });
-DrawerContent.classes = classes$g;
+DrawerContent.classes = classes$i;
 DrawerContent.displayName = "@mantine/core/DrawerContent";
-const defaultProps$D = {}, DrawerHeader = factory((_props, ref) => {
-  const props = useProps("DrawerHeader", defaultProps$D, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
+const defaultProps$R = {}, DrawerHeader = factory((_props, ref) => {
+  const props = useProps("DrawerHeader", defaultProps$R, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
   return /* @__PURE__ */ jsx(
     ModalBaseHeader,
     {
@@ -9584,10 +9608,10 @@ const defaultProps$D = {}, DrawerHeader = factory((_props, ref) => {
     }
   );
 });
-DrawerHeader.classes = classes$g;
+DrawerHeader.classes = classes$i;
 DrawerHeader.displayName = "@mantine/core/DrawerHeader";
-const defaultProps$C = {}, DrawerOverlay = factory((_props, ref) => {
-  const props = useProps("DrawerOverlay", defaultProps$C, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
+const defaultProps$Q = {}, DrawerOverlay = factory((_props, ref) => {
+  const props = useProps("DrawerOverlay", defaultProps$Q, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
   return /* @__PURE__ */ jsx(
     ModalBaseOverlay,
     {
@@ -9597,7 +9621,7 @@ const defaultProps$C = {}, DrawerOverlay = factory((_props, ref) => {
     }
   );
 });
-DrawerOverlay.classes = classes$g;
+DrawerOverlay.classes = classes$i;
 DrawerOverlay.displayName = "@mantine/core/DrawerOverlay";
 function getDrawerAlign(position) {
   switch (position) {
@@ -9623,7 +9647,7 @@ const transitions = {
   bottom: "slide-up",
   right: "slide-right",
   left: "slide-left"
-}, defaultProps$B = {
+}, defaultProps$P = {
   closeOnClickOutside: !0,
   withinPortal: !0,
   lockScroll: !0,
@@ -9633,7 +9657,7 @@ const transitions = {
   keepMounted: !1,
   zIndex: getDefaultZIndex("modal"),
   position: "left"
-}, varsResolver$g = (_, { position, size: size2, offset: offset2 }) => ({
+}, varsResolver$h = (_, { position, size: size2, offset: offset2 }) => ({
   root: {
     "--drawer-size": getSize(size2, "drawer-size"),
     "--drawer-flex": getDrawerFlex(position),
@@ -9643,7 +9667,7 @@ const transitions = {
     "--drawer-offset": rem(offset2)
   }
 }), DrawerRoot = factory((_props, ref) => {
-  const props = useProps("DrawerRoot", defaultProps$B, _props), {
+  const props = useProps("DrawerRoot", defaultProps$P, _props), {
     classNames,
     className,
     style,
@@ -9657,7 +9681,7 @@ const transitions = {
     ...others
   } = props, { dir } = useDirection(), getStyles2 = useStyles({
     name: "Drawer",
-    classes: classes$g,
+    classes: classes$i,
     props,
     className,
     style,
@@ -9665,7 +9689,7 @@ const transitions = {
     styles,
     unstyled,
     vars,
-    varsResolver: varsResolver$g
+    varsResolver: varsResolver$h
   }), drawerTransition = (dir === "rtl" ? rtlTransitions : transitions)[position];
   return /* @__PURE__ */ jsx(DrawerProvider, { value: { scrollAreaComponent, getStyles: getStyles2, radius }, children: /* @__PURE__ */ jsx(
     ModalBase,
@@ -9678,10 +9702,33 @@ const transitions = {
     }
   ) });
 });
-DrawerRoot.classes = classes$g;
+DrawerRoot.classes = classes$i;
 DrawerRoot.displayName = "@mantine/core/DrawerRoot";
-const defaultProps$A = {}, DrawerTitle = factory((_props, ref) => {
-  const props = useProps("DrawerTitle", defaultProps$A, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
+const [DrawerStackProvider, useDrawerStackContext] = createOptionalContext();
+function DrawerStack({ children }) {
+  const [stack, setStack] = useState([]), [maxZIndex, setMaxZIndex] = useState(getDefaultZIndex("modal"));
+  return /* @__PURE__ */ jsx(
+    DrawerStackProvider,
+    {
+      value: {
+        stack,
+        addModal: (id, zIndex) => {
+          setStack((current) => [.../* @__PURE__ */ new Set([...current, id])]), setMaxZIndex(
+            (current) => typeof zIndex == "number" && typeof current == "number" ? Math.max(current, zIndex) : current
+          );
+        },
+        removeModal: (id) => setStack((current) => current.filter((currentId) => currentId !== id)),
+        getZIndex: (id) => `calc(${maxZIndex} + ${stack.indexOf(id)} + 1)`,
+        currentId: stack[stack.length - 1],
+        maxZIndex
+      },
+      children
+    }
+  );
+}
+DrawerStack.displayName = "@mantine/core/DrawerStack";
+const defaultProps$O = {}, DrawerTitle = factory((_props, ref) => {
+  const props = useProps("DrawerTitle", defaultProps$O, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useDrawerContext();
   return /* @__PURE__ */ jsx(
     ModalBaseTitle,
     {
@@ -9691,9 +9738,9 @@ const defaultProps$A = {}, DrawerTitle = factory((_props, ref) => {
     }
   );
 });
-DrawerTitle.classes = classes$g;
+DrawerTitle.classes = classes$i;
 DrawerTitle.displayName = "@mantine/core/DrawerTitle";
-const defaultProps$z = {
+const defaultProps$N = {
   closeOnClickOutside: !0,
   withinPortal: !0,
   lockScroll: !0,
@@ -9712,20 +9759,46 @@ const defaultProps$z = {
     withCloseButton,
     closeButtonProps,
     children,
+    opened,
+    stackId,
+    zIndex,
     ...others
-  } = useProps("Drawer", defaultProps$z, _props), hasHeader = !!title || withCloseButton;
-  return /* @__PURE__ */ jsxs(DrawerRoot, { ref, ...others, children: [
-    withOverlay && /* @__PURE__ */ jsx(DrawerOverlay, { ...overlayProps }),
-    /* @__PURE__ */ jsxs(DrawerContent, { children: [
-      hasHeader && /* @__PURE__ */ jsxs(DrawerHeader, { children: [
-        title && /* @__PURE__ */ jsx(DrawerTitle, { children: title }),
-        withCloseButton && /* @__PURE__ */ jsx(DrawerCloseButton, { ...closeButtonProps })
-      ] }),
-      /* @__PURE__ */ jsx(DrawerBody, { children })
-    ] })
-  ] });
+  } = useProps("Drawer", defaultProps$N, _props), ctx = useDrawerStackContext(), hasHeader = !!title || withCloseButton, stackProps = ctx && stackId ? {
+    closeOnEscape: ctx.currentId === stackId,
+    trapFocus: ctx.currentId === stackId,
+    zIndex: ctx.getZIndex(stackId)
+  } : {}, overlayVisible = withOverlay === !1 ? !1 : stackId && ctx ? ctx.currentId === stackId : opened;
+  return useEffect(() => {
+    ctx && stackId && (opened ? ctx.addModal(stackId, zIndex || getDefaultZIndex("modal")) : ctx.removeModal(stackId));
+  }, [opened, stackId, zIndex]), /* @__PURE__ */ jsxs(
+    DrawerRoot,
+    {
+      ref,
+      opened,
+      zIndex: ctx && stackId ? ctx.getZIndex(stackId) : zIndex,
+      ...others,
+      ...stackProps,
+      children: [
+        withOverlay && /* @__PURE__ */ jsx(
+          DrawerOverlay,
+          {
+            visible: overlayVisible,
+            transitionProps: ctx && stackId ? { duration: 0 } : void 0,
+            ...overlayProps
+          }
+        ),
+        /* @__PURE__ */ jsxs(DrawerContent, { __hidden: ctx && stackId && opened ? stackId !== ctx.currentId : !1, children: [
+          hasHeader && /* @__PURE__ */ jsxs(DrawerHeader, { children: [
+            title && /* @__PURE__ */ jsx(DrawerTitle, { children: title }),
+            withCloseButton && /* @__PURE__ */ jsx(DrawerCloseButton, { ...closeButtonProps })
+          ] }),
+          /* @__PURE__ */ jsx(DrawerBody, { children })
+        ] })
+      ]
+    }
+  );
 });
-Drawer.classes = classes$g;
+Drawer.classes = classes$i;
 Drawer.displayName = "@mantine/core/Drawer";
 Drawer.Root = DrawerRoot;
 Drawer.Overlay = DrawerOverlay;
@@ -9734,6 +9807,7 @@ Drawer.Body = DrawerBody;
 Drawer.Header = DrawerHeader;
 Drawer.Title = DrawerTitle;
 Drawer.CloseButton = DrawerCloseButton;
+Drawer.Stack = DrawerStack;
 function useDelayedHover({ open, close, openDelay, closeDelay }) {
   const openTimeout = useRef(-1), closeTimeout = useRef(-1), clearTimeouts = () => {
     window.clearTimeout(openTimeout.current), window.clearTimeout(closeTimeout.current);
@@ -9744,24 +9818,87 @@ function useDelayedHover({ open, close, openDelay, closeDelay }) {
   };
   return useEffect(() => clearTimeouts, []), { openDropdown, closeDropdown };
 }
+function getMarkColor({ color, theme, defaultShade }) {
+  const parsed = parseThemeColor({ color, theme });
+  return parsed.isThemeColor ? parsed.shade === void 0 ? `var(--mantine-color-${parsed.color}-${defaultShade})` : `var(${parsed.variable})` : color;
+}
+var __default__$h = { root: "m_bcb3f3c2" };
+const classes$h = __default__$h, defaultProps$M = {
+  color: "yellow"
+}, varsResolver$g = (theme, { color }) => ({
+  root: {
+    "--mark-bg-dark": getMarkColor({ color, theme, defaultShade: 5 }),
+    "--mark-bg-light": getMarkColor({ color, theme, defaultShade: 2 })
+  }
+}), Mark = factory((_props, ref) => {
+  const props = useProps("Mark", defaultProps$M, _props), { classNames, className, style, styles, unstyled, vars, color, variant, ...others } = props, getStyles2 = useStyles({
+    name: "Mark",
+    props,
+    className,
+    style,
+    classes: classes$h,
+    classNames,
+    styles,
+    unstyled,
+    vars,
+    varsResolver: varsResolver$g
+  });
+  return /* @__PURE__ */ jsx(Box, { component: "mark", ref, variant, ...getStyles2("root"), ...others });
+});
+Mark.classes = classes$h;
+Mark.displayName = "@mantine/core/Mark";
+function escapeRegex(value) {
+  return value.replace(/[-[\]{}()*+?.,\\^$|#]/g, "\\$&");
+}
+function highlighter(value, _highlight) {
+  if (_highlight == null)
+    return [{ chunk: value, highlighted: !1 }];
+  const highlight = Array.isArray(_highlight) ? _highlight.map(escapeRegex) : escapeRegex(_highlight);
+  if (!(Array.isArray(highlight) ? highlight.filter((part) => part.trim().length > 0).length > 0 : highlight.trim() !== ""))
+    return [{ chunk: value, highlighted: !1 }];
+  const matcher = typeof highlight == "string" ? highlight.trim() : highlight.filter((part) => part.trim().length !== 0).map((part) => part.trim()).sort((a, b) => b.length - a.length).join("|"), re = new RegExp(`(${matcher})`, "gi");
+  return value.split(re).map((part) => ({ chunk: part, highlighted: re.test(part) })).filter(({ chunk }) => chunk);
+}
+const defaultProps$L = {}, Highlight = polymorphicFactory((props, ref) => {
+  const { unstyled, children, highlight, highlightStyles, color, ...others } = useProps(
+    "Highlight",
+    defaultProps$L,
+    props
+  ), highlightChunks = highlighter(children, highlight);
+  return /* @__PURE__ */ jsx(Text, { unstyled, ref, ...others, __staticSelector: "Highlight", children: highlightChunks.map(
+    ({ chunk, highlighted }, i) => highlighted ? /* @__PURE__ */ jsx(
+      Mark,
+      {
+        unstyled,
+        color,
+        style: highlightStyles,
+        "data-highlight": chunk,
+        children: chunk
+      },
+      i
+    ) : /* @__PURE__ */ jsx("span", { children: chunk }, i)
+  ) });
+});
+Highlight.classes = Text.classes;
+Highlight.displayName = "@mantine/core/Highlight";
 const [HoverCardContextProvider, useHoverCardContext] = createSafeContext(
   "HoverCard component was not found in the tree"
-), defaultProps$y = {};
+), defaultProps$K = {};
 function HoverCardDropdown(props) {
   const { children, onMouseEnter, onMouseLeave, ...others } = useProps(
     "HoverCardDropdown",
-    defaultProps$y,
+    defaultProps$K,
     props
   ), ctx = useHoverCardContext(), handleMouseEnter = createEventHandler(onMouseEnter, ctx.openDropdown), handleMouseLeave = createEventHandler(onMouseLeave, ctx.closeDropdown);
   return /* @__PURE__ */ jsx(Popover.Dropdown, { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, ...others, children });
 }
 HoverCardDropdown.displayName = "@mantine/core/HoverCardDropdown";
-const defaultProps$x = {
+const defaultProps$J = {
   refProp: "ref"
 }, HoverCardTarget = forwardRef((props, ref) => {
   const { children, refProp, eventPropsWrapperName, ...others } = useProps(
     "HoverCardTarget",
-    defaultProps$x,
+    defaultProps$J,
     props
   );
   if (!isElement$1(children))
@@ -9775,7 +9912,7 @@ const defaultProps$x = {
   ) });
 });
 HoverCardTarget.displayName = "@mantine/core/HoverCardTarget";
-const defaultProps$w = {
+const defaultProps$I = {
   openDelay: 0,
   closeDelay: 150,
   initiallyOpened: !1
@@ -9783,7 +9920,7 @@ const defaultProps$w = {
 function HoverCard(props) {
   const { children, onOpen, onClose, openDelay, closeDelay, initiallyOpened, ...others } = useProps(
     "HoverCard",
-    defaultProps$w,
+    defaultProps$I,
     props
   ), [opened, { open, close }] = useDisclosure(initiallyOpened, { onClose, onOpen }), { openDropdown, closeDropdown } = useDelayedHover({ open, close, openDelay, closeDelay });
   return /* @__PURE__ */ jsx(HoverCardContextProvider, { value: { openDropdown, closeDropdown }, children: /* @__PURE__ */ jsx(Popover, { ...others, opened, __staticSelector: "HoverCard", children }) });
@@ -9792,14 +9929,14 @@ HoverCard.displayName = "@mantine/core/HoverCard";
 HoverCard.Target = HoverCardTarget;
 HoverCard.Dropdown = HoverCardDropdown;
 HoverCard.extend = (input) => input;
-var __default__$f = { root: "m_9e117634" };
-const classes$f = __default__$f, defaultProps$v = {}, varsResolver$f = (_, { radius, fit }) => ({
+var __default__$g = { root: "m_9e117634" };
+const classes$g = __default__$g, defaultProps$H = {}, varsResolver$f = (_, { radius, fit }) => ({
   root: {
     "--image-radius": radius === void 0 ? void 0 : getRadius(radius),
     "--image-object-fit": fit
   }
 }), Image = polymorphicFactory((_props, ref) => {
-  const props = useProps("Image", defaultProps$v, _props), {
+  const props = useProps("Image", defaultProps$H, _props), {
     classNames,
     className,
     style,
@@ -9817,7 +9954,7 @@ const classes$f = __default__$f, defaultProps$v = {}, varsResolver$f = (_, { rad
   useEffect(() => setError(!src), [src]);
   const getStyles2 = useStyles({
     name: "Image",
-    classes: classes$f,
+    classes: classes$g,
     props,
     className,
     style,
@@ -9853,10 +9990,10 @@ const classes$f = __default__$f, defaultProps$v = {}, varsResolver$f = (_, { rad
     }
   );
 });
-Image.classes = classes$f;
+Image.classes = classes$g;
 Image.displayName = "@mantine/core/Image";
-var __default__$e = { root: "m_6e45937b", loader: "m_e8eb006c", overlay: "m_df587f17" };
-const classes$e = __default__$e, defaultProps$u = {
+var __default__$f = { root: "m_6e45937b", loader: "m_e8eb006c", overlay: "m_df587f17" };
+const classes$f = __default__$f, defaultProps$G = {
   transitionProps: { transition: "fade", duration: 0 },
   overlayProps: { backgroundOpacity: 0.75 },
   zIndex: getDefaultZIndex("overlay")
@@ -9865,7 +10002,7 @@ const classes$e = __default__$e, defaultProps$u = {
     "--lo-z-index": zIndex?.toString()
   }
 }), LoadingOverlay = factory((_props, ref) => {
-  const props = useProps("LoadingOverlay", defaultProps$u, _props), {
+  const props = useProps("LoadingOverlay", defaultProps$G, _props), {
     classNames,
     className,
     style,
@@ -9880,7 +10017,7 @@ const classes$e = __default__$e, defaultProps$u = {
     ...others
   } = props, theme = useMantineTheme(), getStyles2 = useStyles({
     name: "LoadingOverlay",
-    classes: classes$e,
+    classes: classes$f,
     props,
     className,
     style,
@@ -9889,7 +10026,7 @@ const classes$e = __default__$e, defaultProps$u = {
     unstyled,
     vars,
     varsResolver: varsResolver$e
-  }), _overlayProps = { ...defaultProps$u.overlayProps, ...overlayProps };
+  }), _overlayProps = { ...defaultProps$G.overlayProps, ...overlayProps };
   return /* @__PURE__ */ jsx(Transition, { transition: "fade", ...transitionProps, mounted: !!visible2, children: (transitionStyles) => /* @__PURE__ */ jsxs(Box, { ...getStyles2("root", { style: transitionStyles }), ref, ...others, children: [
     /* @__PURE__ */ jsx(Loader, { ...getStyles2("loader"), unstyled, ...loaderProps }),
     /* @__PURE__ */ jsx(
@@ -9914,16 +10051,16 @@ const classes$e = __default__$e, defaultProps$u = {
     )
   ] }) });
 });
-LoadingOverlay.classes = classes$e;
+LoadingOverlay.classes = classes$f;
 LoadingOverlay.displayName = "@mantine/core/LoadingOverlay";
 const [MenuContextProvider, useMenuContext] = createSafeContext(
   "Menu component was not found in the tree"
 );
-var __default__$d = { dropdown: "m_dc9b7c9f", label: "m_9bfac126", divider: "m_efdf90cb", item: "m_99ac2aa1", itemLabel: "m_5476e0d3", itemSection: "m_8b75e504" };
-const classes$d = __default__$d, defaultProps$t = {}, MenuDivider = factory((props, ref) => {
+var __default__$e = { dropdown: "m_dc9b7c9f", label: "m_9bfac126", divider: "m_efdf90cb", item: "m_99ac2aa1", itemLabel: "m_5476e0d3", itemSection: "m_8b75e504" };
+const classes$e = __default__$e, defaultProps$F = {}, MenuDivider = factory((props, ref) => {
   const { classNames, className, style, styles, vars, ...others } = useProps(
     "MenuDivider",
-    defaultProps$t,
+    defaultProps$F,
     props
   ), ctx = useMenuContext();
   return /* @__PURE__ */ jsx(
@@ -9935,9 +10072,9 @@ const classes$d = __default__$d, defaultProps$t = {}, MenuDivider = factory((pro
     }
   );
 });
-MenuDivider.classes = classes$d;
+MenuDivider.classes = classes$e;
 MenuDivider.displayName = "@mantine/core/MenuDivider";
-const defaultProps$s = {}, MenuDropdown = factory((props, ref) => {
+const defaultProps$E = {}, MenuDropdown = factory((props, ref) => {
   const {
     classNames,
     className,
@@ -9949,7 +10086,7 @@ const defaultProps$s = {}, MenuDropdown = factory((props, ref) => {
     onKeyDown,
     children,
     ...others
-  } = useProps("MenuDropdown", defaultProps$s, props), wrapperRef = useRef(null), ctx = useMenuContext(), handleKeyDown = createEventHandler(onKeyDown, (event) => {
+  } = useProps("MenuDropdown", defaultProps$E, props), wrapperRef = useRef(null), ctx = useMenuContext(), handleKeyDown = createEventHandler(onKeyDown, (event) => {
     (event.key === "ArrowUp" || event.key === "ArrowDown") && (event.preventDefault(), wrapperRef.current?.querySelectorAll("[data-menu-item]:not(:disabled)")[0]?.focus());
   }), handleMouseEnter = createEventHandler(
     onMouseEnter,
@@ -9984,9 +10121,9 @@ const defaultProps$s = {}, MenuDropdown = factory((props, ref) => {
     }
   );
 });
-MenuDropdown.classes = classes$d;
+MenuDropdown.classes = classes$e;
 MenuDropdown.displayName = "@mantine/core/MenuDropdown";
-const defaultProps$r = {}, MenuItem = polymorphicFactory((props, ref) => {
+const defaultProps$D = {}, MenuItem = polymorphicFactory((props, ref) => {
   const {
     classNames,
     className,
@@ -10000,7 +10137,7 @@ const defaultProps$r = {}, MenuItem = polymorphicFactory((props, ref) => {
     children,
     disabled,
     ...others
-  } = useProps("MenuItem", defaultProps$r, props), ctx = useMenuContext(), theme = useMantineTheme(), { dir } = useDirection(), itemRef = useRef(), itemIndex = ctx.getItemIndex(itemRef.current), _others = others, handleMouseLeave = createEventHandler(_others.onMouseLeave, () => ctx.setHovered(-1)), handleMouseEnter = createEventHandler(
+  } = useProps("MenuItem", defaultProps$D, props), ctx = useMenuContext(), theme = useMantineTheme(), { dir } = useDirection(), itemRef = useRef(), itemIndex = ctx.getItemIndex(itemRef.current), _others = others, handleMouseLeave = createEventHandler(_others.onMouseLeave, () => ctx.setHovered(-1)), handleMouseEnter = createEventHandler(
     _others.onMouseEnter,
     () => ctx.setHovered(ctx.getItemIndex(itemRef.current))
   ), handleClick = createEventHandler(_others.onClick, () => {
@@ -10048,12 +10185,12 @@ const defaultProps$r = {}, MenuItem = polymorphicFactory((props, ref) => {
     }
   );
 });
-MenuItem.classes = classes$d;
+MenuItem.classes = classes$e;
 MenuItem.displayName = "@mantine/core/MenuItem";
-const defaultProps$q = {}, MenuLabel = factory((props, ref) => {
+const defaultProps$C = {}, MenuLabel = factory((props, ref) => {
   const { classNames, className, style, styles, vars, ...others } = useProps(
     "MenuLabel",
-    defaultProps$q,
+    defaultProps$C,
     props
   ), ctx = useMenuContext();
   return /* @__PURE__ */ jsx(
@@ -10065,12 +10202,12 @@ const defaultProps$q = {}, MenuLabel = factory((props, ref) => {
     }
   );
 });
-MenuLabel.classes = classes$d;
+MenuLabel.classes = classes$e;
 MenuLabel.displayName = "@mantine/core/MenuLabel";
-const defaultProps$p = {
+const defaultProps$B = {
   refProp: "ref"
 }, MenuTarget = forwardRef((props, ref) => {
-  const { children, refProp, ...others } = useProps("MenuTarget", defaultProps$p, props);
+  const { children, refProp, ...others } = useProps("MenuTarget", defaultProps$B, props);
   if (!isElement$1(children))
     throw new Error(
       "Menu.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported"
@@ -10091,7 +10228,7 @@ const defaultProps$p = {
   }) });
 });
 MenuTarget.displayName = "@mantine/core/MenuTarget";
-const defaultProps$o = {
+const defaultProps$A = {
   trapFocus: !0,
   closeOnItemClick: !0,
   clickOutsideEvents: ["mousedown", "touchstart", "keydown"],
@@ -10102,7 +10239,7 @@ const defaultProps$o = {
   menuItemTabIndex: -1
 };
 function Menu(_props) {
-  const props = useProps("Menu", defaultProps$o, _props), {
+  const props = useProps("Menu", defaultProps$A, _props), {
     children,
     onOpen,
     onClose,
@@ -10126,7 +10263,7 @@ function Menu(_props) {
     ...others
   } = props, getStyles2 = useStyles({
     name: "Menu",
-    classes: classes$d,
+    classes: classes$e,
     props,
     classNames,
     styles,
@@ -10192,7 +10329,7 @@ function Menu(_props) {
   );
 }
 Menu.extend = (input) => input;
-Menu.classes = classes$d;
+Menu.classes = classes$e;
 Menu.displayName = "@mantine/core/Menu";
 Menu.Item = MenuItem;
 Menu.Label = MenuLabel;
@@ -10202,9 +10339,9 @@ Menu.Divider = MenuDivider;
 const [ModalProvider, useModalContext] = createSafeContext(
   "Modal component was not found in tree"
 );
-var __default__$c = { root: "m_9df02822", content: "m_54c44539", inner: "m_1f958f16", header: "m_d0e2b9cd" };
-const classes$c = __default__$c, defaultProps$n = {}, ModalBody = factory((_props, ref) => {
-  const props = useProps("ModalBody", defaultProps$n, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useModalContext();
+var __default__$d = { root: "m_9df02822", content: "m_54c44539", inner: "m_1f958f16", header: "m_d0e2b9cd" };
+const classes$d = __default__$d, defaultProps$z = {}, ModalBody = factory((_props, ref) => {
+  const props = useProps("ModalBody", defaultProps$z, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useModalContext();
   return /* @__PURE__ */ jsx(
     ModalBaseBody,
     {
@@ -10214,10 +10351,23 @@ const classes$c = __default__$c, defaultProps$n = {}, ModalBody = factory((_prop
     }
   );
 });
-ModalBody.classes = classes$c;
+ModalBody.classes = classes$d;
 ModalBody.displayName = "@mantine/core/ModalBody";
-const defaultProps$m = {}, ModalContent = factory((_props, ref) => {
-  const props = useProps("ModalContent", defaultProps$m, _props), { classNames, className, style, styles, vars, children, ...others } = props, ctx = useModalContext(), Scroll = ctx.scrollAreaComponent || NativeScrollArea;
+const defaultProps$y = {}, ModalCloseButton = factory((_props, ref) => {
+  const props = useProps("ModalCloseButton", defaultProps$y, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useModalContext();
+  return /* @__PURE__ */ jsx(
+    ModalBaseCloseButton,
+    {
+      ref,
+      ...ctx.getStyles("close", { classNames, style, styles, className }),
+      ...others
+    }
+  );
+});
+ModalCloseButton.classes = classes$d;
+ModalCloseButton.displayName = "@mantine/core/ModalCloseButton";
+const defaultProps$x = {}, ModalContent = factory((_props, ref) => {
+  const props = useProps("ModalContent", defaultProps$x, _props), { classNames, className, style, styles, vars, children, __hidden, ...others } = props, ctx = useModalContext(), Scroll = ctx.scrollAreaComponent || NativeScrollArea;
   return /* @__PURE__ */ jsx(
     ModalBaseContent,
     {
@@ -10225,6 +10375,7 @@ const defaultProps$m = {}, ModalContent = factory((_props, ref) => {
       innerProps: ctx.getStyles("inner", { className, style, styles, classNames }),
       "data-full-screen": ctx.fullScreen || void 0,
       "data-modal-content": !0,
+      "data-hidden": __hidden || void 0,
       ref,
       ...others,
       children: /* @__PURE__ */ jsx(
@@ -10239,10 +10390,23 @@ const defaultProps$m = {}, ModalContent = factory((_props, ref) => {
     }
   );
 });
-ModalContent.classes = classes$c;
+ModalContent.classes = classes$d;
 ModalContent.displayName = "@mantine/core/ModalContent";
-const defaultProps$l = {}, ModalOverlay = factory((_props, ref) => {
-  const props = useProps("ModalOverlay", defaultProps$l, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useModalContext();
+const defaultProps$w = {}, ModalHeader = factory((_props, ref) => {
+  const props = useProps("ModalHeader", defaultProps$w, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useModalContext();
+  return /* @__PURE__ */ jsx(
+    ModalBaseHeader,
+    {
+      ref,
+      ...ctx.getStyles("header", { classNames, style, styles, className }),
+      ...others
+    }
+  );
+});
+ModalHeader.classes = classes$d;
+ModalHeader.displayName = "@mantine/core/ModalHeader";
+const defaultProps$v = {}, ModalOverlay = factory((_props, ref) => {
+  const props = useProps("ModalOverlay", defaultProps$v, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useModalContext();
   return /* @__PURE__ */ jsx(
     ModalBaseOverlay,
     {
@@ -10252,9 +10416,9 @@ const defaultProps$l = {}, ModalOverlay = factory((_props, ref) => {
     }
   );
 });
-ModalOverlay.classes = classes$c;
+ModalOverlay.classes = classes$d;
 ModalOverlay.displayName = "@mantine/core/ModalOverlay";
-const defaultProps$k = {
+const defaultProps$u = {
   __staticSelector: "Modal",
   closeOnClickOutside: !0,
   withinPortal: !0,
@@ -10274,7 +10438,7 @@ const defaultProps$k = {
     "--modal-x-offset": rem(xOffset)
   }
 }), ModalRoot = factory((_props, ref) => {
-  const props = useProps("ModalRoot", defaultProps$k, _props), {
+  const props = useProps("ModalRoot", defaultProps$u, _props), {
     classNames,
     className,
     style,
@@ -10291,7 +10455,7 @@ const defaultProps$k = {
     ...others
   } = props, getStyles2 = useStyles({
     name: __staticSelector,
-    classes: classes$c,
+    classes: classes$d,
     props,
     className,
     style,
@@ -10313,34 +10477,148 @@ const defaultProps$k = {
     }
   ) });
 });
-ModalRoot.classes = classes$c;
+ModalRoot.classes = classes$d;
 ModalRoot.displayName = "@mantine/core/ModalRoot";
-const [PillsInputProvider, usePillsInputContext] = createOptionalContext(), [PillGroupProvider, usePillGroupContext] = createOptionalContext();
-var __default__$b = { root: "m_7cda1cd6", "root--default": "m_44da308b", "root--contrast": "m_e3a01f8", label: "m_1e0e6180", remove: "m_ae386778", group: "m_1dcfd90b" };
-const classes$b = __default__$b, defaultProps$j = {}, varsResolver$c = (_, { gap }, { size: size2 }) => ({
-  group: {
-    "--pg-gap": gap !== void 0 ? getSize(gap) : getSize(size2, "pg-gap")
-  }
-}), PillGroup = factory((_props, ref) => {
-  const props = useProps("PillGroup", defaultProps$j, _props), { classNames, className, style, styles, unstyled, vars, size: size2, disabled, ...others } = props, _size = usePillsInputContext()?.size || size2 || void 0, getStyles2 = useStyles({
-    name: "PillGroup",
-    classes: classes$b,
-    props,
-    className,
-    style,
-    classNames,
-    styles,
-    unstyled,
-    vars,
-    varsResolver: varsResolver$c,
-    stylesCtx: { size: _size },
-    rootSelector: "group"
-  });
-  return /* @__PURE__ */ jsx(PillGroupProvider, { value: { size: _size, disabled }, children: /* @__PURE__ */ jsx(Box, { ref, size: _size, ...getStyles2("group"), ...others }) });
-});
-PillGroup.classes = classes$b;
+const [ModalStackProvider, useModalStackContext] = createOptionalContext();
+function ModalStack({ children }) {
+  const [stack, setStack] = useState([]), [maxZIndex, setMaxZIndex] = useState(getDefaultZIndex("modal"));
+  return /* @__PURE__ */ jsx(
+    ModalStackProvider,
+    {
+      value: {
+        stack,
+        addModal: (id, zIndex) => {
+          setStack((current) => [.../* @__PURE__ */ new Set([...current, id])]), setMaxZIndex(
+            (current) => typeof zIndex == "number" && typeof current == "number" ? Math.max(current, zIndex) : current
+          );
+        },
+        removeModal: (id) => setStack((current) => current.filter((currentId) => currentId !== id)),
+        getZIndex: (id) => `calc(${maxZIndex} + ${stack.indexOf(id)} + 1)`,
+        currentId: stack[stack.length - 1],
+        maxZIndex
+      },
+      children
+    }
+  );
+}
+ModalStack.displayName = "@mantine/core/ModalStack";
+const defaultProps$t = {}, ModalTitle = factory((_props, ref) => {
+  const props = useProps("ModalTitle", defaultProps$t, _props), { classNames, className, style, styles, vars, ...others } = props, ctx = useModalContext();
+  return /* @__PURE__ */ jsx(
+    ModalBaseTitle,
+    {
+      ref,
+      ...ctx.getStyles("title", { classNames, style, styles, className }),
+      ...others
+    }
+  );
+});
+ModalTitle.classes = classes$d;
+ModalTitle.displayName = "@mantine/core/ModalTitle";
+const defaultProps$s = {
+  closeOnClickOutside: !0,
+  withinPortal: !0,
+  lockScroll: !0,
+  trapFocus: !0,
+  returnFocus: !0,
+  closeOnEscape: !0,
+  keepMounted: !1,
+  zIndex: getDefaultZIndex("modal"),
+  transitionProps: { duration: 200, transition: "fade-down" },
+  withOverlay: !0,
+  withCloseButton: !0
+}, Modal = factory((_props, ref) => {
+  const {
+    title,
+    withOverlay,
+    overlayProps,
+    withCloseButton,
+    closeButtonProps,
+    children,
+    radius,
+    opened,
+    stackId,
+    zIndex,
+    ...others
+  } = useProps("Modal", defaultProps$s, _props), ctx = useModalStackContext(), hasHeader = !!title || withCloseButton, stackProps = ctx && stackId ? {
+    closeOnEscape: ctx.currentId === stackId,
+    trapFocus: ctx.currentId === stackId,
+    zIndex: ctx.getZIndex(stackId)
+  } : {}, overlayVisible = withOverlay === !1 ? !1 : stackId && ctx ? ctx.currentId === stackId : opened;
+  return useEffect(() => {
+    ctx && stackId && (opened ? ctx.addModal(stackId, zIndex || getDefaultZIndex("modal")) : ctx.removeModal(stackId));
+  }, [opened, stackId, zIndex]), /* @__PURE__ */ jsxs(
+    ModalRoot,
+    {
+      ref,
+      radius,
+      opened,
+      zIndex: ctx && stackId ? ctx.getZIndex(stackId) : zIndex,
+      ...others,
+      ...stackProps,
+      children: [
+        withOverlay && /* @__PURE__ */ jsx(
+          ModalOverlay,
+          {
+            visible: overlayVisible,
+            transitionProps: ctx && stackId ? { duration: 0 } : void 0,
+            ...overlayProps
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          ModalContent,
+          {
+            radius,
+            __hidden: ctx && stackId && opened ? stackId !== ctx.currentId : !1,
+            children: [
+              hasHeader && /* @__PURE__ */ jsxs(ModalHeader, { children: [
+                title && /* @__PURE__ */ jsx(ModalTitle, { children: title }),
+                withCloseButton && /* @__PURE__ */ jsx(ModalCloseButton, { ...closeButtonProps })
+              ] }),
+              /* @__PURE__ */ jsx(ModalBody, { children })
+            ]
+          }
+        )
+      ]
+    }
+  );
+});
+Modal.classes = classes$d;
+Modal.displayName = "@mantine/core/Modal";
+Modal.Root = ModalRoot;
+Modal.Overlay = ModalOverlay;
+Modal.Content = ModalContent;
+Modal.Body = ModalBody;
+Modal.Header = ModalHeader;
+Modal.Title = ModalTitle;
+Modal.CloseButton = ModalCloseButton;
+Modal.Stack = ModalStack;
+const [PillsInputProvider, usePillsInputContext] = createOptionalContext(), [PillGroupProvider, usePillGroupContext] = createOptionalContext();
+var __default__$c = { root: "m_7cda1cd6", "root--default": "m_44da308b", "root--contrast": "m_e3a01f8", label: "m_1e0e6180", remove: "m_ae386778", group: "m_1dcfd90b" };
+const classes$c = __default__$c, defaultProps$r = {}, varsResolver$c = (_, { gap }, { size: size2 }) => ({
+  group: {
+    "--pg-gap": gap !== void 0 ? getSize(gap) : getSize(size2, "pg-gap")
+  }
+}), PillGroup = factory((_props, ref) => {
+  const props = useProps("PillGroup", defaultProps$r, _props), { classNames, className, style, styles, unstyled, vars, size: size2, disabled, ...others } = props, _size = usePillsInputContext()?.size || size2 || void 0, getStyles2 = useStyles({
+    name: "PillGroup",
+    classes: classes$c,
+    props,
+    className,
+    style,
+    classNames,
+    styles,
+    unstyled,
+    vars,
+    varsResolver: varsResolver$c,
+    stylesCtx: { size: _size },
+    rootSelector: "group"
+  });
+  return /* @__PURE__ */ jsx(PillGroupProvider, { value: { size: _size, disabled }, children: /* @__PURE__ */ jsx(Box, { ref, size: _size, ...getStyles2("group"), ...others }) });
+});
+PillGroup.classes = classes$c;
 PillGroup.displayName = "@mantine/core/PillGroup";
-const defaultProps$i = {
+const defaultProps$q = {
   variant: "default"
 }, varsResolver$b = (_, { radius }, { size: size2 }) => ({
   root: {
@@ -10349,7 +10627,7 @@ const defaultProps$i = {
     "--pill-radius": radius === void 0 ? void 0 : getRadius(radius)
   }
 }), Pill = factory((_props, ref) => {
-  const props = useProps("Pill", defaultProps$i, _props), {
+  const props = useProps("Pill", defaultProps$q, _props), {
     classNames,
     className,
     style,
@@ -10368,7 +10646,7 @@ const defaultProps$i = {
     ...others
   } = props, ctx = usePillGroupContext(), pillsInputCtx = usePillsInputContext(), _size = size2 || ctx?.size || void 0, _variant = pillsInputCtx?.variant === "filled" ? "contrast" : variant || "default", getStyles2 = useStyles({
     name: "Pill",
-    classes: classes$b,
+    classes: classes$c,
     props,
     className,
     style,
@@ -10419,11 +10697,11 @@ const defaultProps$i = {
     }
   );
 });
-Pill.classes = classes$b;
+Pill.classes = classes$c;
 Pill.displayName = "@mantine/core/Pill";
 Pill.Group = PillGroup;
-var __default__$a = { root: "m_a513464", icon: "m_a4ceffb", loader: "m_b0920b15", body: "m_a49ed24", title: "m_3feedf16", description: "m_3d733a3a", closeButton: "m_919a4d88" };
-const classes$a = __default__$a, defaultProps$h = {
+var __default__$b = { root: "m_a513464", icon: "m_a4ceffb", loader: "m_b0920b15", body: "m_a49ed24", title: "m_3feedf16", description: "m_3d733a3a", closeButton: "m_919a4d88" };
+const classes$b = __default__$b, defaultProps$p = {
   withCloseButton: !0
 }, varsResolver$a = (theme, { radius, color }) => ({
   root: {
@@ -10431,7 +10709,7 @@ const classes$a = __default__$a, defaultProps$h = {
     "--notification-color": color ? getThemeColor(color, theme) : void 0
   }
 }), Notification = factory((_props, ref) => {
-  const props = useProps("Notification", defaultProps$h, _props), {
+  const props = useProps("Notification", defaultProps$p, _props), {
     className,
     color,
     radius,
@@ -10453,7 +10731,7 @@ const classes$a = __default__$a, defaultProps$h = {
     ...others
   } = props, getStyles2 = useStyles({
     name: "Notification",
-    classes: classes$a,
+    classes: classes$b,
     props,
     className,
     style,
@@ -10494,7 +10772,7 @@ const classes$a = __default__$a, defaultProps$h = {
     }
   );
 });
-Notification.classes = classes$a;
+Notification.classes = classes$b;
 Notification.displayName = "@mantine/core/Notification";
 const defaultTransition = {
   duration: 100,
@@ -10551,8 +10829,8 @@ function useFloatingTooltip({
     }
   }, [elements.reference, refs.floating.current, update, handleMouseMove, opened]), { handleMouseMove, x, y, opened, setOpened, boundaryRef, floating: refs.setFloating };
 }
-var __default__$9 = { tooltip: "m_1b3c8819", arrow: "m_f898399f" };
-const classes$9 = __default__$9, defaultProps$g = {
+var __default__$a = { tooltip: "m_1b3c8819", arrow: "m_f898399f" };
+const classes$a = __default__$a, defaultProps$o = {
   refProp: "ref",
   withinPortal: !0,
   offset: 10,
@@ -10566,7 +10844,7 @@ const classes$9 = __default__$9, defaultProps$g = {
     "--tooltip-color": color ? "var(--mantine-color-white)" : void 0
   }
 }), TooltipFloating = factory((_props, ref) => {
-  const props = useProps("TooltipFloating", defaultProps$g, _props), {
+  const props = useProps("TooltipFloating", defaultProps$o, _props), {
     children,
     refProp,
     withinPortal,
@@ -10591,7 +10869,7 @@ const classes$9 = __default__$9, defaultProps$g = {
   } = props, theme = useMantineTheme(), getStyles2 = useStyles({
     name: "TooltipFloating",
     props,
-    classes: classes$9,
+    classes: classes$a,
     className,
     style,
     classNames,
@@ -10609,7 +10887,7 @@ const classes$9 = __default__$9, defaultProps$g = {
     throw new Error(
       "[@mantine/core] Tooltip.Floating component children should be an element or a component that accepts ref, fragments, strings, numbers and other primitive values are not supported"
     );
-  const targetRef = useMergedRef(boundaryRef, children.ref, ref), onMouseEnter = (event) => {
+  const targetRef = useMergedRef(boundaryRef, getRefProp(children), ref), onMouseEnter = (event) => {
     children.props.onMouseEnter?.(event), handleMouseMove(event), setOpened(!0);
   }, onMouseLeave = (event) => {
     children.props.onMouseLeave?.(event), setOpened(!1);
@@ -10642,14 +10920,14 @@ const classes$9 = __default__$9, defaultProps$g = {
     })
   ] });
 });
-TooltipFloating.classes = classes$9;
+TooltipFloating.classes = classes$a;
 TooltipFloating.displayName = "@mantine/core/TooltipFloating";
-const TooltipGroupContext = createContext(!1), TooltipGroupProvider = TooltipGroupContext.Provider, useTooltipGroupContext = () => useContext(TooltipGroupContext), defaultProps$f = {
+const TooltipGroupContext = createContext(!1), TooltipGroupProvider = TooltipGroupContext.Provider, useTooltipGroupContext = () => useContext(TooltipGroupContext), defaultProps$n = {
   openDelay: 0,
   closeDelay: 0
 };
 function TooltipGroup(props) {
-  const { openDelay, closeDelay, children } = useProps("TooltipGroup", defaultProps$f, props);
+  const { openDelay, closeDelay, children } = useProps("TooltipGroup", defaultProps$n, props);
   return /* @__PURE__ */ jsx(TooltipGroupProvider, { value: !0, children: /* @__PURE__ */ jsx(FloatingDelayGroup, { delay: { open: openDelay, close: closeDelay }, children }) });
 }
 TooltipGroup.displayName = "@mantine/core/TooltipGroup";
@@ -10680,7 +10958,9 @@ function useTooltip(settings) {
       arrow({ element: settings.arrowRef, padding: settings.arrowOffset }),
       ...settings.inline ? [inline()] : []
     ]
-  }), { getReferenceProps, getFloatingProps } = useInteractions([
+  });
+  useDelayGroup(context, { id: uid });
+  const { getReferenceProps, getFloatingProps } = useInteractions([
     useHover(context, {
       enabled: settings.events?.hover,
       delay: withinGroup ? groupDelay : { open: settings.openDelay, close: settings.closeDelay },
@@ -10689,8 +10969,7 @@ function useTooltip(settings) {
     useFocus(context, { enabled: settings.events?.focus, visibleOnly: !0 }),
     useRole(context, { role: "tooltip" }),
     // Cannot be used with controlled tooltip, page jumps
-    useDismiss(context, { enabled: typeof settings.opened > "u" }),
-    useDelayGroup(context, { id: uid })
+    useDismiss(context, { enabled: typeof settings.opened > "u" })
   ]);
   useFloatingAutoUpdate({
     opened,
@@ -10715,7 +10994,7 @@ function useTooltip(settings) {
     placement
   };
 }
-const defaultProps$e = {
+const defaultProps$m = {
   position: "top",
   refProp: "ref",
   withinPortal: !0,
@@ -10737,7 +11016,7 @@ const defaultProps$e = {
     "--tooltip-color": color ? "var(--mantine-color-white)" : void 0
   }
 }), Tooltip = factory((_props, ref) => {
-  const props = useProps("Tooltip", defaultProps$e, _props), {
+  const props = useProps("Tooltip", defaultProps$m, _props), {
     children,
     position,
     refProp,
@@ -10778,7 +11057,7 @@ const defaultProps$e = {
     mod,
     floatingStrategy,
     ...others
-  } = useProps("Tooltip", defaultProps$e, props), { dir } = useDirection(), arrowRef = useRef(null), tooltip = useTooltip({
+  } = useProps("Tooltip", defaultProps$m, props), { dir } = useDirection(), arrowRef = useRef(null), tooltip = useTooltip({
     position: getFloatingPosition(dir, position),
     closeDelay,
     openDelay,
@@ -10795,7 +11074,7 @@ const defaultProps$e = {
   }), getStyles2 = useStyles({
     name: "Tooltip",
     props,
-    classes: classes$9,
+    classes: classes$a,
     className,
     style,
     classNames,
@@ -10809,7 +11088,7 @@ const defaultProps$e = {
     throw new Error(
       "[@mantine/core] Tooltip component children should be an element or a component that accepts ref, fragments, strings, numbers and other primitive values are not supported"
     );
-  const targetRef = useMergedRef(tooltip.reference, children.ref, ref), transition = getTransitionProps(transitionProps, { duration: 100, transition: "fade" });
+  const targetRef = useMergedRef(tooltip.reference, getRefProp(children), ref), transition = getTransitionProps(transitionProps, { duration: 100, transition: "fade" });
   return /* @__PURE__ */ jsxs(Fragment$1, { children: [
     /* @__PURE__ */ jsx(OptionalPortal, { ...portalProps, withinPortal, children: /* @__PURE__ */ jsx(
       Transition,
@@ -10874,12 +11153,12 @@ const defaultProps$e = {
     )
   ] });
 });
-Tooltip.classes = classes$9;
+Tooltip.classes = classes$a;
 Tooltip.displayName = "@mantine/core/Tooltip";
 Tooltip.Floating = TooltipFloating;
 Tooltip.Group = TooltipGroup;
-var __default__$8 = { root: "m_cf365364", indicator: "m_9e182ccd", label: "m_1738fcb2", input: "m_1714d588", control: "m_69686b9b", innerLabel: "m_78882f40" };
-const classes$8 = __default__$8, defaultProps$d = {
+var __default__$9 = { root: "m_cf365364", indicator: "m_9e182ccd", label: "m_1738fcb2", input: "m_1714d588", control: "m_69686b9b", innerLabel: "m_78882f40" };
+const classes$9 = __default__$9, defaultProps$l = {
   withItemsBorders: !0
 }, varsResolver$7 = (theme, { radius, color, transitionDuration, size: size2, transitionTimingFunction }) => ({
   root: {
@@ -10892,7 +11171,7 @@ const classes$8 = __default__$8, defaultProps$d = {
     "--sc-font-size": getFontSize(size2)
   }
 }), SegmentedControl = factory((_props, ref) => {
-  const props = useProps("SegmentedControl", defaultProps$d, _props), {
+  const props = useProps("SegmentedControl", defaultProps$l, _props), {
     classNames,
     className,
     style,
@@ -10921,7 +11200,7 @@ const classes$8 = __default__$8, defaultProps$d = {
   } = props, getStyles2 = useStyles({
     name: "SegmentedControl",
     props,
-    classes: classes$8,
+    classes: classes$9,
     className,
     style,
     classNames,
@@ -11015,15 +11294,15 @@ const classes$8 = __default__$8, defaultProps$d = {
     }
   );
 });
-SegmentedControl.classes = classes$8;
+SegmentedControl.classes = classes$9;
 SegmentedControl.displayName = "@mantine/core/SegmentedControl";
-const defaultProps$c = {
+const defaultProps$k = {
   searchable: !1,
   withCheckIcon: !0,
   allowDeselect: !0,
   checkIconPosition: "left"
 }, Select = factory((_props, ref) => {
-  const props = useProps("Select", defaultProps$c, _props), {
+  const props = useProps("Select", defaultProps$k, _props), {
     classNames,
     styles,
     unstyled,
@@ -11260,13 +11539,13 @@ function SimpleGridContainerVariables({
   }));
   return /* @__PURE__ */ jsx(InlineStyles, { styles: baseStyles, container: media, selector });
 }
-var __default__$7 = { container: "m_925c2d2c", root: "m_2415a157" };
-const classes$7 = __default__$7, defaultProps$b = {
+var __default__$8 = { container: "m_925c2d2c", root: "m_2415a157" };
+const classes$8 = __default__$8, defaultProps$j = {
   cols: 1,
   spacing: "md",
   type: "media"
 }, SimpleGrid = factory((_props, ref) => {
-  const props = useProps("SimpleGrid", defaultProps$b, _props), {
+  const props = useProps("SimpleGrid", defaultProps$j, _props), {
     classNames,
     className,
     style,
@@ -11280,7 +11559,7 @@ const classes$7 = __default__$7, defaultProps$b = {
     ...others
   } = props, getStyles2 = useStyles({
     name: "SimpleGrid",
-    classes: classes$7,
+    classes: classes$8,
     props,
     className,
     style,
@@ -11297,7 +11576,7 @@ const classes$7 = __default__$7, defaultProps$b = {
     /* @__PURE__ */ jsx(Box, { ref, ...getStyles2("root", { className: responsiveClassName }), ...others })
   ] });
 });
-SimpleGrid.classes = classes$7;
+SimpleGrid.classes = classes$8;
 SimpleGrid.displayName = "@mantine/core/SimpleGrid";
 const [SliderProvider, useSliderContext] = createSafeContext(
   "SliderProvider was not found in tree"
@@ -11458,8 +11737,8 @@ function getPrecision(step) {
   const split = step.toString().split(".");
   return split.length > 1 ? split[1].length : 0;
 }
-var __default__$6 = { root: "m_dd36362e", label: "m_c9357328", thumb: "m_c9a9a60a", trackContainer: "m_a8645c2", track: "m_c9ade57f", bar: "m_38aeed47", markWrapper: "m_b7b0423a", mark: "m_dd33bc19", markLabel: "m_68c77a5b" };
-const classes$6 = __default__$6, defaultProps$a = {
+var __default__$7 = { root: "m_dd36362e", label: "m_c9357328", thumb: "m_c9a9a60a", trackContainer: "m_a8645c2", track: "m_c9ade57f", bar: "m_38aeed47", markWrapper: "m_b7b0423a", mark: "m_dd33bc19", markLabel: "m_68c77a5b" };
+const classes$7 = __default__$7, defaultProps$i = {
   radius: "xl",
   min: 0,
   max: 100,
@@ -11480,7 +11759,7 @@ const classes$6 = __default__$6, defaultProps$a = {
     "--slider-thumb-size": thumbSize !== void 0 ? rem(thumbSize) : "calc(var(--slider-size) * 2)"
   }
 }), Slider = factory((_props, ref) => {
-  const props = useProps("Slider", defaultProps$a, _props), {
+  const props = useProps("Slider", defaultProps$i, _props), {
     classNames,
     styles,
     value,
@@ -11508,11 +11787,12 @@ const classes$6 = __default__$6, defaultProps$a = {
     style,
     vars,
     hiddenInputProps,
+    restrictToMarks,
     ...others
   } = props, getStyles2 = useStyles({
     name: "Slider",
     props,
-    classes: classes$6,
+    classes: classes$7,
     classNames,
     className,
     styles,
@@ -11535,13 +11815,25 @@ const classes$6 = __default__$6, defaultProps$a = {
           step,
           precision
         });
-        setValue(nextValue), valueRef.current = nextValue;
+        setValue(
+          restrictToMarks && marks?.length ? findClosestNumber(
+            nextValue,
+            marks.map((mark) => mark.value)
+          ) : nextValue
+        ), valueRef.current = nextValue;
       }
     },
-    [disabled, min2, max2, step, precision, setValue]
+    [disabled, min2, max2, step, precision, setValue, marks, restrictToMarks]
   ), { ref: container, active } = useMove(
     handleChange,
-    { onScrubEnd: () => onChangeEnd?.(valueRef.current) },
+    {
+      onScrubEnd: () => onChangeEnd?.(
+        restrictToMarks && marks?.length ? findClosestNumber(
+          valueRef.current,
+          marks.map((mark) => mark.value)
+        ) : valueRef.current
+      )
+    },
     dir
   ), handleTrackKeydownCapture = (event) => {
     if (!disabled)
@@ -11644,15 +11936,15 @@ const classes$6 = __default__$6, defaultProps$a = {
     }
   ) });
 });
-Slider.classes = classes$6;
+Slider.classes = classes$7;
 Slider.displayName = "@mantine/core/Slider";
-const defaultProps$9 = {}, Space = factory((props, ref) => {
-  const { w, h, miw, mih, ...others } = useProps("Space", defaultProps$9, props);
+const defaultProps$h = {}, Space = factory((props, ref) => {
+  const { w, h, miw, mih, ...others } = useProps("Space", defaultProps$h, props);
   return /* @__PURE__ */ jsx(Box, { ref, ...others, w, miw: miw ?? w, h, mih: mih ?? h });
 });
 Space.displayName = "@mantine/core/Space";
-var __default__$5 = { root: "m_559cce2d", content: "m_b912df4e", control: "m_b9131032" };
-const classes$5 = __default__$5, defaultProps$8 = {
+var __default__$6 = { root: "m_559cce2d", content: "m_b912df4e", control: "m_b9131032" };
+const classes$6 = __default__$6, defaultProps$g = {
   maxHeight: 100,
   initialState: !1
 }, varsResolver$5 = (_, { transitionDuration }) => ({
@@ -11660,7 +11952,7 @@ const classes$5 = __default__$5, defaultProps$8 = {
     "--spoiler-transition-duration": transitionDuration !== void 0 ? `${transitionDuration}ms` : void 0
   }
 }), Spoiler = factory((_props, ref) => {
-  const props = useProps("Spoiler", defaultProps$8, _props), {
+  const props = useProps("Spoiler", defaultProps$g, _props), {
     classNames,
     className,
     style,
@@ -11680,7 +11972,7 @@ const classes$5 = __default__$5, defaultProps$8 = {
     ...others
   } = props, getStyles2 = useStyles({
     name: "Spoiler",
-    classes: classes$5,
+    classes: classes$6,
     props,
     className,
     style,
@@ -11733,10 +12025,10 @@ const classes$5 = __default__$5, defaultProps$8 = {
     }
   );
 });
-Spoiler.classes = classes$5;
+Spoiler.classes = classes$6;
 Spoiler.displayName = "@mantine/core/Spoiler";
-var __default__$4 = { root: "m_6d731127" };
-const classes$4 = __default__$4, defaultProps$7 = {
+var __default__$5 = { root: "m_6d731127" };
+const classes$5 = __default__$5, defaultProps$f = {
   gap: "md",
   align: "stretch",
   justify: "flex-start"
@@ -11747,7 +12039,7 @@ const classes$4 = __default__$4, defaultProps$7 = {
     "--stack-justify": justify
   }
 }), Stack = factory((_props, ref) => {
-  const props = useProps("Stack", defaultProps$7, _props), {
+  const props = useProps("Stack", defaultProps$f, _props), {
     classNames,
     className,
     style,
@@ -11762,7 +12054,7 @@ const classes$4 = __default__$4, defaultProps$7 = {
   } = props, getStyles2 = useStyles({
     name: "Stack",
     props,
-    classes: classes$4,
+    classes: classes$5,
     className,
     style,
     classNames,
@@ -11773,14 +12065,14 @@ const classes$4 = __default__$4, defaultProps$7 = {
   });
   return /* @__PURE__ */ jsx(Box, { ref, ...getStyles2("root"), variant, ...others });
 });
-Stack.classes = classes$4;
+Stack.classes = classes$5;
 Stack.displayName = "@mantine/core/Stack";
 const [TabsProvider, useTabsContext] = createSafeContext(
   "Tabs component was not found in the tree"
 );
-var __default__$3 = { root: "m_89d60db1", "list--default": "m_576c9d4", list: "m_89d33d6d", panel: "m_b0c91715", tab: "m_4ec4dce6", tabSection: "m_fc420b1f", "tab--default": "m_539e827b", "list--outline": "m_6772fbd5", "tab--outline": "m_b59ab47c", "tab--pills": "m_c3381914" };
-const classes$3 = __default__$3, defaultProps$6 = {}, TabsList = factory((_props, ref) => {
-  const props = useProps("TabsList", defaultProps$6, _props), { children, className, grow, justify, classNames, styles, style, mod, ...others } = props, ctx = useTabsContext();
+var __default__$4 = { root: "m_89d60db1", "list--default": "m_576c9d4", list: "m_89d33d6d", panel: "m_b0c91715", tab: "m_4ec4dce6", tabSection: "m_fc420b1f", "tab--default": "m_539e827b", "list--outline": "m_6772fbd5", "tab--outline": "m_b59ab47c", "tab--pills": "m_c3381914" };
+const classes$4 = __default__$4, defaultProps$e = {}, TabsList = factory((_props, ref) => {
+  const props = useProps("TabsList", defaultProps$e, _props), { children, className, grow, justify, classNames, styles, style, mod, ...others } = props, ctx = useTabsContext();
   return /* @__PURE__ */ jsx(
     Box,
     {
@@ -11811,10 +12103,10 @@ const classes$3 = __default__$3, defaultProps$6 = {}, TabsList = factory((_props
     }
   );
 });
-TabsList.classes = classes$3;
+TabsList.classes = classes$4;
 TabsList.displayName = "@mantine/core/TabsList";
-const defaultProps$5 = {}, TabsPanel = factory((_props, ref) => {
-  const props = useProps("TabsPanel", defaultProps$5, _props), { children, className, value, classNames, styles, style, mod, keepMounted, ...others } = props, ctx = useTabsContext(), active = ctx.value === value, content = ctx.keepMounted || keepMounted || active ? children : null;
+const defaultProps$d = {}, TabsPanel = factory((_props, ref) => {
+  const props = useProps("TabsPanel", defaultProps$d, _props), { children, className, value, classNames, styles, style, mod, keepMounted, ...others } = props, ctx = useTabsContext(), active = ctx.value === value, content = ctx.keepMounted || keepMounted || active ? children : null;
   return /* @__PURE__ */ jsx(
     Box,
     {
@@ -11835,10 +12127,10 @@ const defaultProps$5 = {}, TabsPanel = factory((_props, ref) => {
     }
   );
 });
-TabsPanel.classes = classes$3;
+TabsPanel.classes = classes$4;
 TabsPanel.displayName = "@mantine/core/TabsPanel";
-const defaultProps$4 = {}, TabsTab = factory((_props, ref) => {
-  const props = useProps("TabsTab", defaultProps$4, _props), {
+const defaultProps$c = {}, TabsTab = factory((_props, ref) => {
+  const props = useProps("TabsTab", defaultProps$c, _props), {
     className,
     children,
     rightSection,
@@ -11853,6 +12145,7 @@ const defaultProps$4 = {}, TabsTab = factory((_props, ref) => {
     styles,
     vars,
     mod,
+    tabIndex,
     ...others
   } = props, theme = useMantineTheme(), { dir } = useDirection(), ctx = useTabsContext(), active = value === ctx.value, activateTab = (event) => {
     ctx.onChange(ctx.allowTabDeactivation && value === ctx.value ? null : value), onClick?.(event);
@@ -11879,7 +12172,7 @@ const defaultProps$4 = {}, TabsTab = factory((_props, ref) => {
       role: "tab",
       id: ctx.getTabId(value),
       "aria-selected": active,
-      tabIndex: active || ctx.value === null ? 0 : -1,
+      tabIndex: tabIndex || active || ctx.value === null ? 0 : -1,
       "aria-controls": ctx.getPanelId(value),
       onClick: activateTab,
       __vars: { "--tabs-color": color ? getThemeColor(color, theme) : void 0 },
@@ -11900,9 +12193,9 @@ const defaultProps$4 = {}, TabsTab = factory((_props, ref) => {
     }
   );
 });
-TabsTab.classes = classes$3;
+TabsTab.classes = classes$4;
 TabsTab.displayName = "@mantine/core/TabsTab";
-const VALUE_ERROR = "Tabs.Tab or Tabs.Panel component was rendered with invalid value or without value", defaultProps$3 = {
+const VALUE_ERROR = "Tabs.Tab or Tabs.Panel component was rendered with invalid value or without value", defaultProps$b = {
   keepMounted: !0,
   orientation: "horizontal",
   loop: !0,
@@ -11919,7 +12212,7 @@ const VALUE_ERROR = "Tabs.Tab or Tabs.Panel component was rendered with invalid
     "--tabs-text-color": getAutoContrastValue(autoContrast, theme) ? getContrastColor({ color, theme, autoContrast }) : void 0
   }
 }), Tabs = factory((_props, ref) => {
-  const props = useProps("Tabs", defaultProps$3, _props), {
+  const props = useProps("Tabs", defaultProps$b, _props), {
     defaultValue,
     value,
     onChange,
@@ -11952,7 +12245,7 @@ const VALUE_ERROR = "Tabs.Tab or Tabs.Panel component was rendered with invalid
   }), getStyles2 = useStyles({
     name: "Tabs",
     props,
-    classes: classes$3,
+    classes: classes$4,
     className,
     style,
     classNames,
@@ -12005,13 +12298,13 @@ const VALUE_ERROR = "Tabs.Tab or Tabs.Panel component was rendered with invalid
     }
   );
 });
-Tabs.classes = classes$3;
+Tabs.classes = classes$4;
 Tabs.displayName = "@mantine/core/Tabs";
 Tabs.Tab = TabsTab;
 Tabs.Panel = TabsPanel;
 Tabs.List = TabsList;
-var __default__$2 = { root: "m_7341320d" };
-const classes$2 = __default__$2, defaultProps$2 = {}, varsResolver$2 = (theme, { size: size2, radius, variant, gradient, color, autoContrast }) => {
+var __default__$3 = { root: "m_7341320d" };
+const classes$3 = __default__$3, defaultProps$a = {}, varsResolver$2 = (theme, { size: size2, radius, variant, gradient, color, autoContrast }) => {
   const colors = theme.variantColorResolver({
     color: color || theme.primaryColor,
     theme,
@@ -12029,9 +12322,9 @@ const classes$2 = __default__$2, defaultProps$2 = {}, varsResolver$2 = (theme, {
     }
   };
 }, ThemeIcon = factory((_props, ref) => {
-  const props = useProps("ThemeIcon", defaultProps$2, _props), { classNames, className, style, styles, unstyled, vars, autoContrast, ...others } = props, getStyles2 = useStyles({
+  const props = useProps("ThemeIcon", defaultProps$a, _props), { classNames, className, style, styles, unstyled, vars, autoContrast, ...others } = props, getStyles2 = useStyles({
     name: "ThemeIcon",
-    classes: classes$2,
+    classes: classes$3,
     props,
     className,
     style,
@@ -12043,7 +12336,7 @@ const classes$2 = __default__$2, defaultProps$2 = {}, varsResolver$2 = (theme, {
   });
   return /* @__PURE__ */ jsx(Box, { ref, ...getStyles2("root"), ...others });
 });
-ThemeIcon.classes = classes$2;
+ThemeIcon.classes = classes$3;
 ThemeIcon.displayName = "@mantine/core/ThemeIcon";
 const headings = ["h1", "h2", "h3", "h4", "h5", "h6"], sizes = ["xs", "sm", "md", "lg", "xl"];
 function getTitleSize(order, size2) {
@@ -12062,8 +12355,8 @@ function getTitleSize(order, size2) {
     lineHeight: `var(--mantine-h${order}-line-height)`
   };
 }
-var __default__$1 = { root: "m_8a5d1357" };
-const classes$1 = __default__$1, defaultProps$1 = {
+var __default__$2 = { root: "m_8a5d1357" };
+const classes$2 = __default__$2, defaultProps$9 = {
   order: 1
 }, varsResolver$1 = (_, { order, size: size2, lineClamp, textWrap }) => {
   const sizeVariables = getTitleSize(order, size2);
@@ -12077,7 +12370,7 @@ const classes$1 = __default__$1, defaultProps$1 = {
     }
   };
 }, Title = factory((_props, ref) => {
-  const props = useProps("Title", defaultProps$1, _props), {
+  const props = useProps("Title", defaultProps$9, _props), {
     classNames,
     className,
     style,
@@ -12094,7 +12387,7 @@ const classes$1 = __default__$1, defaultProps$1 = {
   } = props, getStyles2 = useStyles({
     name: "Title",
     props,
-    classes: classes$1,
+    classes: classes$2,
     className,
     style,
     classNames,
@@ -12116,7 +12409,7 @@ const classes$1 = __default__$1, defaultProps$1 = {
     }
   ) : null;
 });
-Title.classes = classes$1;
+Title.classes = classes$2;
 Title.displayName = "@mantine/core/Title";
 function getValuesRange(anchor, value, flatValues) {
   if (!anchor || !value)
@@ -12265,6 +12558,9 @@ function getChildrenNodesValues(value, data, acc = []) {
     Array.isArray(child.children) && child.children.length > 0 ? getChildrenNodesValues(child.value, data, acc) : acc.push(child.value);
   }), acc) : acc;
 }
+function getAllChildrenNodes(data) {
+  return data.reduce((acc, node) => (Array.isArray(node.children) && node.children.length > 0 ? acc.push(...getAllChildrenNodes(node.children)) : acc.push(node.value), acc), []);
+}
 function isNodeChecked(value, data, checkedState) {
   return checkedState.length === 0 ? !1 : checkedState.includes(value) ? !0 : getAllCheckedNodes(data, checkedState).result.some((node) => node.value === value && node.checked);
 }
@@ -12273,33 +12569,47 @@ function isNodeIndeterminate(value, data, checkedState) {
   return checkedState.length === 0 ? !1 : getAllCheckedNodes(data, checkedState).result.some((node) => node.value === value && node.indeterminate);
 }
 const memoizedIsNodeIndeterminate = memoize(isNodeIndeterminate);
-function getInitialExpandedState(initialState, data, value, acc = {}) {
+function getInitialTreeExpandedState(initialState, data, value, acc = {}) {
   return data.forEach((node) => {
-    acc[node.value] = node.value in initialState ? initialState[node.value] : node.value === value, Array.isArray(node.children) && getInitialExpandedState(initialState, node.children, value, acc);
+    acc[node.value] = node.value in initialState ? initialState[node.value] : node.value === value, Array.isArray(node.children) && getInitialTreeExpandedState(initialState, node.children, value, acc);
   }), acc;
 }
 function getInitialCheckedState(initialState, data) {
   const acc = [];
-  return initialState.forEach((node) => acc.push(...getChildrenNodesValues(node, data))), acc;
+  return initialState.forEach((node) => acc.push(...getChildrenNodesValues(node, data))), Array.from(new Set(acc));
 }
 function useTree({
   initialSelectedState = [],
   initialCheckedState = [],
   initialExpandedState = {},
-  multiple = !1
+  multiple = !1,
+  onNodeCollapse,
+  onNodeExpand
 } = {}) {
   const [data, setData] = useState([]), [expandedState, setExpandedState] = useState(initialExpandedState), [selectedState, setSelectedState] = useState(initialSelectedState), [checkedState, setCheckedState] = useState(initialCheckedState), [anchorNode, setAnchorNode] = useState(null), [hoveredNode, setHoveredNode] = useState(null), initialize = useCallback(
     (_data) => {
-      setExpandedState((current) => getInitialExpandedState(current, _data, selectedState)), setCheckedState((current) => getInitialCheckedState(current, _data)), setData(_data);
+      setExpandedState((current) => getInitialTreeExpandedState(current, _data, selectedState)), setCheckedState((current) => getInitialCheckedState(current, _data)), setData(_data);
     },
     [selectedState, checkedState]
-  ), toggleExpanded = useCallback((value) => {
-    setExpandedState((current) => ({ ...current, [value]: !current[value] }));
-  }, []), collapse = useCallback((value) => {
-    setExpandedState((current) => ({ ...current, [value]: !1 }));
-  }, []), expand = useCallback((value) => {
-    setExpandedState((current) => ({ ...current, [value]: !0 }));
-  }, []), expandAllNodes = useCallback(() => {
+  ), toggleExpanded = useCallback(
+    (value) => {
+      setExpandedState((current) => {
+        const nextState = { ...current, [value]: !current[value] };
+        return nextState[value] ? onNodeExpand?.(value) : onNodeCollapse?.(value), nextState;
+      });
+    },
+    [onNodeCollapse, onNodeExpand]
+  ), collapse = useCallback(
+    (value) => {
+      setExpandedState((current) => (current[value] !== !1 && onNodeCollapse?.(value), { ...current, [value]: !1 }));
+    },
+    [onNodeCollapse]
+  ), expand = useCallback(
+    (value) => {
+      setExpandedState((current) => (current[value] !== !0 && onNodeExpand?.(value), { ...current, [value]: !0 }));
+    },
+    [onNodeExpand]
+  ), expandAllNodes = useCallback(() => {
     setExpandedState((current) => {
       const next = { ...current };
       return Object.keys(next).forEach((key) => {
@@ -12336,7 +12646,11 @@ function useTree({
       setCheckedState((current) => current.filter((item) => !checkedNodes.includes(item)));
     },
     [data]
-  );
+  ), checkAllNodes = useCallback(() => {
+    setCheckedState(() => getAllChildrenNodes(data));
+  }, [data]), uncheckAllNodes = useCallback(() => {
+    setCheckedState([]);
+  }, []);
   return {
     multiple,
     expandedState,
@@ -12352,6 +12666,9 @@ function useTree({
     setExpandedState,
     checkNode,
     uncheckNode,
+    checkAllNodes,
+    uncheckAllNodes,
+    setCheckedState,
     toggleSelected,
     select,
     deselect,
@@ -12364,12 +12681,12 @@ function useTree({
     isNodeIndeterminate: (value) => memoizedIsNodeIndeterminate(value, data, checkedState)
   };
 }
-var __default__ = { root: "m_f698e191", subtree: "m_75f3ecf", node: "m_f6970eb1", label: "m_dc283425" };
-const classes = __default__;
+var __default__$1 = { root: "m_f698e191", subtree: "m_75f3ecf", node: "m_f6970eb1", label: "m_dc283425" };
+const classes$1 = __default__$1;
 function getFlatValues(data) {
   return data.reduce((acc, item) => (acc.push(item.value), item.children && acc.push(...getFlatValues(item.children)), acc), []);
 }
-const defaultProps = {
+const defaultProps$8 = {
   expandOnClick: !0,
   allowRangeSelection: !0,
   expandOnSpace: !0
@@ -12378,7 +12695,7 @@ const defaultProps = {
     "--level-offset": getSpacing(levelOffset)
   }
 }), Tree = factory((_props, ref) => {
-  const props = useProps("Tree", defaultProps, _props), {
+  const props = useProps("Tree", defaultProps$8, _props), {
     classNames,
     className,
     style,
@@ -12397,7 +12714,7 @@ const defaultProps = {
     ...others
   } = props, defaultController = useTree(), controller = tree || defaultController, getStyles2 = useStyles({
     name: "Tree",
-    classes,
+    classes: classes$1,
     props,
     className,
     style,
@@ -12443,7 +12760,7 @@ const defaultProps = {
   );
 });
 Tree.displayName = "@mantine/core/Tree";
-Tree.classes = classes;
+Tree.classes = classes$1;
 function getSizesVariables(theme, themeKey, name) {
   return Object.keys(theme[themeKey]).reduce((acc, size2) => (acc[size2] = `var(--mantine-${name}-${size2})`, acc), {});
 }
@@ -12539,79 +12856,606 @@ function themeToVars(theme) {
     largerThan: (breakpoint) => `(min-width: ${getBreakpointValue(breakpoint, mergedTheme)})`
   };
 }
+function createStore(initialState) {
+  let state = initialState, initialized = !1;
+  const listeners = /* @__PURE__ */ new Set();
+  return {
+    getState() {
+      return state;
+    },
+    updateState(value) {
+      state = typeof value == "function" ? value(state) : value;
+    },
+    setState(value) {
+      this.updateState(value), listeners.forEach((listener) => listener(state));
+    },
+    initialize(value) {
+      initialized || (state = value, initialized = !0);
+    },
+    subscribe(callback) {
+      return listeners.add(callback), () => listeners.delete(callback);
+    }
+  };
+}
+function useStore(store) {
+  return useSyncExternalStore(
+    store.subscribe,
+    () => store.getState(),
+    () => store.getState()
+  );
+}
+const createSpotlightStore = () => createStore({
+  opened: !1,
+  empty: !1,
+  selected: -1,
+  listId: "",
+  query: "",
+  registeredActions: /* @__PURE__ */ new Set()
+}), useSpotlight = (store) => useStore(store);
+function updateSpotlightStateAction(update, store) {
+  const state = store.getState();
+  store.setState({ ...state, ...update(store.getState()) });
+}
+function openSpotlightAction(store) {
+  updateSpotlightStateAction(() => ({ opened: !0, selected: -1 }), store);
+}
+function closeSpotlightAction(store) {
+  updateSpotlightStateAction(() => ({ opened: !1 }), store);
+}
+function toggleSpotlightAction(store) {
+  updateSpotlightStateAction(
+    (state) => ({ opened: !state.opened, selected: state.opened ? state.selected : -1 }),
+    store
+  );
+}
+function setSelectedAction(index2, store) {
+  store.updateState((state) => ({ ...state, selected: index2 }));
+}
+function setListId(id, store) {
+  store.updateState((state) => ({ ...state, listId: id }));
+}
+function findElementByQuerySelector(selector, root = document) {
+  const element = root.querySelector(selector);
+  if (element)
+    return element;
+  const children = root instanceof ShadowRoot ? root.host.children : root.children;
+  for (let i = 0; i < children.length; i += 1) {
+    const child = children[i];
+    if (child.shadowRoot) {
+      const shadowElement = findElementByQuerySelector(selector, child.shadowRoot);
+      if (shadowElement)
+        return shadowElement;
+    }
+    const nestedElement = findElementByQuerySelector(selector, child);
+    if (nestedElement)
+      return nestedElement;
+  }
+  return null;
+}
+function selectAction(index2, store) {
+  const state = store.getState(), actionsList = state.listId ? findElementByQuerySelector(`#${state.listId}`) : null, selected = actionsList?.querySelector("[data-selected]"), actions = actionsList?.querySelectorAll("[data-action]") ?? [], nextIndex = index2 === -1 ? actions.length - 1 : index2 === actions.length ? 0 : index2, selectedIndex = clamp$2(nextIndex, 0, actions.length - 1);
+  return selected?.removeAttribute("data-selected"), actions[selectedIndex]?.scrollIntoView({ block: "nearest" }), actions[selectedIndex]?.setAttribute("data-selected", "true"), setSelectedAction(selectedIndex, store), selectedIndex;
+}
+function selectNextAction(store) {
+  return selectAction(store.getState().selected + 1, store);
+}
+function selectPreviousAction(store) {
+  return selectAction(store.getState().selected - 1, store);
+}
+function triggerSelectedAction(store) {
+  const state = store.getState();
+  findElementByQuerySelector(
+    `#${state.listId} [data-selected]`
+  )?.click();
+}
+function registerAction(id, store) {
+  const state = store.getState();
+  return state.registeredActions.add(id), () => {
+    state.registeredActions.delete(id);
+  };
+}
+function setQuery(query, store) {
+  updateSpotlightStateAction(() => ({ query }), store), Promise.resolve().then(() => {
+    selectAction(0, store), updateSpotlightStateAction(
+      (state) => ({
+        empty: state.query.trim().length > 0 && state.registeredActions.size === 0 || !1
+      }),
+      store
+    );
+  });
+}
+function clearSpotlightState({ clearQuery }, store) {
+  store.updateState((state) => ({
+    ...state,
+    selected: -1,
+    query: clearQuery ? "" : state.query,
+    empty: clearQuery ? !1 : state.empty
+  }));
+}
+const spotlightActions = {
+  open: openSpotlightAction,
+  close: closeSpotlightAction,
+  toggle: toggleSpotlightAction,
+  updateState: updateSpotlightStateAction,
+  setSelectedAction,
+  setListId,
+  selectAction,
+  selectNextAction,
+  selectPreviousAction,
+  triggerSelectedAction,
+  registerAction,
+  setQuery,
+  clearSpotlightState
+};
+function createSpotlight() {
+  const store = createSpotlightStore();
+  return [store, {
+    open: () => openSpotlightAction(store),
+    close: () => closeSpotlightAction(store),
+    toggle: () => toggleSpotlightAction(store)
+  }];
+}
+const [spotlightStore, spotlight] = createSpotlight(), { open: openSpotlight, close: closeSpotlight, toggle: toggleSpotlight } = spotlight;
+function isActionsGroup(item) {
+  const _item = item;
+  return _item.group !== void 0 && Array.isArray(_item.actions);
+}
+function getKeywords(keywords) {
+  return Array.isArray(keywords) ? keywords.map((keyword) => keyword.trim()).join(",").toLowerCase().trim() : typeof keywords == "string" ? keywords.toLowerCase().trim() : "";
+}
+function getFlatActions(data) {
+  return data.reduce((acc, item) => "actions" in item ? [...acc, ...item.actions.map((action) => ({ ...action, group: item.group }))] : [...acc, item], []);
+}
+function flatActionsToGroups(data) {
+  const groups = {}, result = [];
+  return data.forEach((action) => {
+    action.group ? (groups[action.group] || (groups[action.group] = { pushed: !1, data: { group: action.group, actions: [] } }), groups[action.group].data.actions.push(action), groups[action.group].pushed || (groups[action.group].pushed = !0, result.push(groups[action.group].data))) : result.push(action);
+  }), result;
+}
+const defaultSpotlightFilter = (_query, data) => {
+  const query = _query.trim().toLowerCase(), priorityMatrix = [[], []];
+  return getFlatActions(data).forEach((item) => {
+    item.label?.toLowerCase().includes(query) ? priorityMatrix[0].push(item) : (item.description?.toLowerCase().includes(query) || getKeywords(item.keywords).includes(query)) && priorityMatrix[1].push(item);
+  }), flatActionsToGroups(priorityMatrix.flat());
+};
+function limitActions(actions, limit) {
+  if (!Array.isArray(actions))
+    return [];
+  let count2 = 0;
+  return actions.reduce((acc, item) => {
+    if (count2 >= limit)
+      return acc;
+    if (isActionsGroup(item)) {
+      const groupActions = limitActions(item.actions, limit - count2);
+      acc.push({
+        group: item.group,
+        actions: groupActions
+      }), count2 += groupActions.length;
+    } else
+      acc.push(item), count2 += 1;
+    return acc;
+  }, []);
+}
+const [SpotlightProvider, useSpotlightContext] = createSafeContext(
+  "Spotlight component was not found in tree"
+);
+var __default__ = { root: "m_d2b315db", content: "m_3cd250e0", body: "m_d2abce9b", search: "m_f366a061", actionsList: "m_6e463822", action: "m_d49bb8ef", actionBody: "m_3d475731", actionSection: "m_832642f6", actionLabel: "m_6c2a1345", actionDescription: "m_a6d9d78d", empty: "m_82f78f74", footer: "m_ddcaf054", actionsGroup: "m_5a3e5f7b" };
+const classes = __default__, defaultProps$7 = {
+  dimmedSections: !0,
+  highlightQuery: !1
+}, SpotlightAction = factory((_props, ref) => {
+  const props = useProps("SpotlightAction", defaultProps$7, _props), {
+    className,
+    style,
+    classNames,
+    styles,
+    id,
+    description,
+    label,
+    leftSection,
+    rightSection,
+    children,
+    dimmedSections,
+    highlightQuery,
+    highlightColor,
+    closeSpotlightOnTrigger,
+    onClick,
+    onMouseDown,
+    keywords,
+    vars,
+    ...others
+  } = props, ctx = useSpotlightContext(), stylesApi = { classNames, styles }, labelNode = highlightQuery && typeof label == "string" ? /* @__PURE__ */ jsx(
+    Highlight,
+    {
+      component: "span",
+      highlight: ctx.query,
+      color: highlightColor,
+      ...ctx.getStyles("actionLabel", stylesApi),
+      children: label
+    }
+  ) : /* @__PURE__ */ jsx("span", { ...ctx.getStyles("actionLabel", stylesApi), children: label });
+  return /* @__PURE__ */ jsx(
+    UnstyledButton,
+    {
+      ref,
+      "data-action": !0,
+      ...ctx.getStyles("action", { className, style, ...stylesApi }),
+      ...others,
+      onMouseDown: (event) => {
+        event.preventDefault(), onMouseDown?.(event);
+      },
+      onClick: (event) => {
+        onClick?.(event), (closeSpotlightOnTrigger ?? ctx.closeOnActionTrigger) && spotlightActions.close(ctx.store);
+      },
+      tabIndex: -1,
+      children: children || /* @__PURE__ */ jsxs(Fragment$1, { children: [
+        leftSection && /* @__PURE__ */ jsx(
+          Box,
+          {
+            component: "span",
+            mod: { position: "left", dimmed: dimmedSections },
+            ...ctx.getStyles("actionSection", stylesApi),
+            children: leftSection
+          }
+        ),
+        /* @__PURE__ */ jsxs("span", { ...ctx.getStyles("actionBody", stylesApi), children: [
+          labelNode,
+          /* @__PURE__ */ jsx("span", { ...ctx.getStyles("actionDescription", stylesApi), children: description })
+        ] }),
+        rightSection && /* @__PURE__ */ jsx(
+          Box,
+          {
+            component: "span",
+            mod: { position: "right", dimmed: dimmedSections },
+            ...ctx.getStyles("actionSection", stylesApi),
+            children: rightSection
+          }
+        )
+      ] })
+    }
+  );
+});
+SpotlightAction.classes = classes;
+SpotlightAction.displayName = "@mantine/spotlight/SpotlightAction";
+const defaultProps$6 = {}, SpotlightActionsGroup = factory((props, ref) => {
+  const { className, style, styles, classNames, label, children, ...others } = useProps(
+    "SpotlightActionsGroup",
+    defaultProps$6,
+    props
+  ), ctx = useSpotlightContext();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ...ctx.getStyles("actionsGroup", { className, style, classNames, styles }),
+      ref,
+      ...others,
+      __vars: { "--spotlight-label": `'${label}'` },
+      children
+    }
+  );
+});
+SpotlightActionsGroup.classes = classes;
+SpotlightActionsGroup.displayName = "@mantine/core/SpotlightActionsGroup";
+const defaultProps$5 = {}, SpotlightActionsList = factory((props, ref) => {
+  const { className, style, id, children, vars, classNames, styles, ...others } = useProps(
+    "SpotlightActionsList",
+    defaultProps$5,
+    props
+  ), ctx = useSpotlightContext(), generatedId = `mantine-${useId$2().replace(/:/g, "")}`, listId = id || generatedId;
+  return useEffect(() => (spotlightActions.setListId(listId, ctx.store), () => spotlightActions.setListId("", ctx.store)), []), /* @__PURE__ */ jsx(
+    ScrollArea.Autosize,
+    {
+      ...ctx.getStyles("actionsList", { className, style, classNames, styles }),
+      ref,
+      type: "scroll",
+      scrollbarSize: "var(--spotlight-actions-list-padding)",
+      offsetScrollbars: "y",
+      id: listId,
+      ...others,
+      children
+    }
+  );
+});
+SpotlightActionsList.classes = classes;
+SpotlightActionsList.displayName = "@mantine/spotlight/SpotlightActionsList";
+const defaultProps$4 = {}, SpotlightEmpty = factory((props, ref) => {
+  const { className, style, classNames, styles, ...others } = useProps(
+    "SpotlightEmpty",
+    defaultProps$4,
+    props
+  ), ctx = useSpotlightContext();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ref,
+      ...ctx.getStyles("empty", { classNames, styles, className, style }),
+      ...others
+    }
+  );
+});
+SpotlightEmpty.classes = classes;
+SpotlightEmpty.displayName = "@mantine/spotlight/SpotlightEmpty";
+const defaultProps$3 = {}, SpotlightFooter = factory((props, ref) => {
+  const { className, style, classNames, styles, ...others } = useProps(
+    "SpotlightFooter",
+    defaultProps$3,
+    props
+  ), ctx = useSpotlightContext();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ref,
+      ...ctx.getStyles("footer", { className, classNames, style, styles }),
+      ...others
+    }
+  );
+});
+SpotlightFooter.classes = classes;
+SpotlightFooter.displayName = "@mantine/spotlight/SpotlightFooter";
+function getHotkeys(hotkeys, store) {
+  if (!hotkeys)
+    return [];
+  const open = () => spotlightActions.open(store);
+  return Array.isArray(hotkeys) ? hotkeys.map((hotkey) => [hotkey, open]) : [[hotkeys, open]];
+}
+const defaultProps$2 = {
+  size: 600,
+  yOffset: 80,
+  zIndex: getDefaultZIndex("max"),
+  overlayProps: { backgroundOpacity: 0.35, blur: 7 },
+  transitionProps: { duration: 200, transition: "pop" },
+  store: spotlightStore,
+  clearQueryOnClose: !0,
+  closeOnActionTrigger: !0,
+  shortcut: "mod + K",
+  maxHeight: 400,
+  scrollable: !1
+}, SpotlightRoot = factory((_props, ref) => {
+  const props = useProps("SpotlightRoot", defaultProps$2, _props), {
+    classNames,
+    className,
+    style,
+    styles,
+    unstyled,
+    vars,
+    store,
+    children,
+    query,
+    onQueryChange,
+    transitionProps,
+    clearQueryOnClose,
+    shortcut,
+    tagsToIgnore,
+    triggerOnContentEditable,
+    disabled,
+    onSpotlightOpen,
+    onSpotlightClose,
+    forceOpened,
+    closeOnActionTrigger,
+    maxHeight,
+    scrollable,
+    ...others
+  } = props, theme = useMantineTheme(), { opened, query: storeQuery } = useSpotlight(store), _query = query || storeQuery, setQuery2 = (q) => {
+    onQueryChange?.(q), spotlightActions.setQuery(q, store);
+  }, getStyles2 = useStyles({
+    name: "Spotlight",
+    classes,
+    props,
+    className,
+    style,
+    classNames,
+    styles,
+    unstyled
+  });
+  return useHotkeys(getHotkeys(shortcut, store), tagsToIgnore, triggerOnContentEditable), useDidUpdate(() => {
+    opened ? onSpotlightOpen?.() : onSpotlightClose?.();
+  }, [opened]), disabled ? null : /* @__PURE__ */ jsx(
+    SpotlightProvider,
+    {
+      value: {
+        getStyles: getStyles2,
+        query: _query,
+        setQuery: setQuery2,
+        store,
+        closeOnActionTrigger
+      },
+      children: /* @__PURE__ */ jsx(
+        Modal,
+        {
+          ref,
+          ...others,
+          withCloseButton: !1,
+          opened: opened || !!forceOpened,
+          padding: 0,
+          onClose: () => spotlightActions.close(store),
+          className,
+          style,
+          classNames: resolveClassNames({
+            theme,
+            classNames: [classes, classNames],
+            props,
+            stylesCtx: void 0
+          }),
+          styles: resolveStyles({ theme, styles, props, stylesCtx: void 0 }),
+          transitionProps: {
+            ...transitionProps,
+            onExited: () => {
+              clearQueryOnClose && setQuery2(""), spotlightActions.clearSpotlightState({ clearQuery: clearQueryOnClose }, store), transitionProps?.onExited?.();
+            }
+          },
+          __vars: { "--spotlight-max-height": scrollable ? rem(maxHeight) : void 0 },
+          __staticSelector: "Spotlight",
+          "data-scrollable": scrollable || void 0,
+          children
+        }
+      )
+    }
+  );
+});
+SpotlightRoot.classes = classes;
+SpotlightRoot.displayName = "@mantine/spotlight/SpotlightRoot";
+const defaultProps$1 = {
+  size: "lg"
+}, SpotlightSearch = factory((props, ref) => {
+  const { classNames, styles, onKeyDown, onChange, vars, value, ...others } = useProps(
+    "SpotlightSearch",
+    defaultProps$1,
+    props
+  ), ctx = useSpotlightContext(), inputStyles = ctx.getStyles("search"), [isComposing, setIsComposing] = useState(!1), handleKeyDown = (event) => {
+    onKeyDown?.(event), !isComposing && (event.nativeEvent.code === "ArrowDown" && (event.preventDefault(), spotlightActions.selectNextAction(ctx.store)), event.nativeEvent.code === "ArrowUp" && (event.preventDefault(), spotlightActions.selectPreviousAction(ctx.store)), (event.nativeEvent.code === "Enter" || event.nativeEvent.code === "NumpadEnter") && (event.preventDefault(), spotlightActions.triggerSelectedAction(ctx.store)));
+  };
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      ref,
+      classNames: [{ input: inputStyles.className }, classNames],
+      styles: [{ input: inputStyles.style }, styles],
+      ...others,
+      value: value ?? ctx.query,
+      onChange: (event) => {
+        ctx.setQuery(event.currentTarget.value), onChange?.(event);
+      },
+      onKeyDown: handleKeyDown,
+      onCompositionStart: () => setIsComposing(!0),
+      onCompositionEnd: () => setIsComposing(!1)
+    }
+  );
+});
+SpotlightSearch.classes = classes;
+SpotlightSearch.displayName = "@mantine/spotlight/SpotlightSearch";
+const defaultProps = {
+  size: 600,
+  yOffset: 80,
+  limit: 1 / 0,
+  zIndex: getDefaultZIndex("max"),
+  overlayProps: { backgroundOpacity: 0.35, blur: 7 },
+  transitionProps: { duration: 200, transition: "pop" },
+  store: spotlightStore,
+  filter: defaultSpotlightFilter,
+  clearQueryOnClose: !0,
+  closeOnActionTrigger: !0,
+  shortcut: "mod + K",
+  highlightQuery: !1
+}, Spotlight = factory((_props, ref) => {
+  const props = useProps("Spotlight", defaultProps, _props), {
+    searchProps,
+    filter,
+    query,
+    onQueryChange,
+    actions,
+    nothingFound,
+    highlightQuery,
+    limit,
+    ...others
+  } = props, [_query, setQuery2] = useUncontrolled({
+    value: query,
+    defaultValue: "",
+    finalValue: "",
+    onChange: onQueryChange
+  }), filteredActions = limitActions(filter(_query, actions), limit).map((item) => {
+    if (isActionsGroup(item)) {
+      const items = item.actions.map(({ id, ...actionData }) => /* @__PURE__ */ jsx(SpotlightAction, { highlightQuery, ...actionData }, id));
+      return /* @__PURE__ */ jsx(SpotlightActionsGroup, { label: item.group, children: items }, item.group);
+    }
+    return /* @__PURE__ */ jsx(SpotlightAction, { highlightQuery, ...item }, item.id);
+  });
+  return /* @__PURE__ */ jsxs(SpotlightRoot, { ...others, query: _query, onQueryChange: setQuery2, ref, children: [
+    /* @__PURE__ */ jsx(SpotlightSearch, { ...searchProps }),
+    /* @__PURE__ */ jsxs(SpotlightActionsList, { children: [
+      filteredActions,
+      filteredActions.length === 0 && nothingFound && /* @__PURE__ */ jsx(SpotlightEmpty, { children: nothingFound })
+    ] })
+  ] });
+});
+Spotlight.classes = classes;
+Spotlight.displayName = "@mantine/spotlight/Spotlight";
+Spotlight.Search = SpotlightSearch;
+Spotlight.ActionsList = SpotlightActionsList;
+Spotlight.Action = SpotlightAction;
+Spotlight.Empty = SpotlightEmpty;
+Spotlight.ActionsGroup = SpotlightActionsGroup;
+Spotlight.Footer = SpotlightFooter;
+Spotlight.Root = SpotlightRoot;
+Spotlight.open = spotlight.open;
+Spotlight.close = spotlight.close;
+Spotlight.toggle = spotlight.toggle;
 export {
-  useHotkeys as $,
+  useLocalStorage as $,
   ActionIcon as A,
   Box as B,
   Card as C,
-  Divider as D,
-  FocusTrapInitialFocus as E,
-  FocusTrap as F,
+  Pill as D,
+  Divider as E,
+  useViewportSize as F,
   Group as G,
-  CloseButton as H,
+  Highlight as H,
   Image as I,
-  Badge as J,
-  Flex as K,
-  ActionIconGroup as L,
-  Tabs as M,
-  TabsList as N,
-  TabsTab as O,
+  FocusTrap as J,
+  FocusTrapInitialFocus as K,
+  CloseButton as L,
+  Badge as M,
+  Flex as N,
+  ActionIconGroup as O,
   Paper as P,
-  TabsPanel as Q,
+  Tabs as Q,
   RemoveScroll as R,
-  ScrollAreaAutosize as S,
+  Spotlight as S,
   ThemeIcon as T,
-  ScrollArea as U,
-  UnstyledButton as V,
-  CopyButton as W,
-  Code as X,
-  useLocalStorage as Y,
-  useStateHistory as Z,
-  Space as _,
+  TabsList as U,
+  TabsTab as V,
+  TabsPanel as W,
+  ScrollArea as X,
+  UnstyledButton as Y,
+  CopyButton as Z,
+  Code as _,
   Text as a,
-  MantineContext as a0,
-  Menu as a1,
-  MenuTarget as a2,
-  MenuDropdown as a3,
-  MenuLabel as a4,
-  MenuDivider as a5,
-  TooltipGroup as a6,
-  MenuItem as a7,
-  keys as a8,
-  ColorSwatch as a9,
-  useMantineTheme as aA,
-  useMediaQuery as aB,
-  useDisclosure as aC,
-  LoadingOverlay as aD,
-  useCallbackRef as aE,
-  Burger as aF,
-  Loader as aG,
-  CheckIcon as aa,
-  rem as ab,
-  Slider as ac,
-  useDebouncedValue as ad,
-  Spoiler as ae,
-  ButtonGroup as af,
-  useHover$1 as ag,
-  FloatingIndicator as ah,
-  useUncontrolled as ai,
-  clampUseMovePosition as aj,
-  useMove as ak,
-  HoverCard as al,
-  HoverCardTarget as am,
-  Overlay as an,
-  HoverCardDropdown as ao,
-  Notification as ap,
-  createTheme as aq,
-  MantineProvider as ar,
-  useInViewport as as,
-  SimpleGrid as at,
-  Drawer as au,
-  Select as av,
-  ModalRoot as aw,
-  ModalOverlay as ax,
-  ModalContent as ay,
-  ModalBody as az,
+  useStateHistory as a0,
+  Space as a1,
+  useHotkeys as a2,
+  MantineContext as a3,
+  Menu as a4,
+  MenuTarget as a5,
+  MenuDropdown as a6,
+  MenuLabel as a7,
+  MenuDivider as a8,
+  TooltipGroup as a9,
+  ModalRoot as aA,
+  ModalOverlay as aB,
+  ModalContent as aC,
+  ModalBody as aD,
+  useMantineTheme as aE,
+  useMediaQuery as aF,
+  useDisclosure as aG,
+  LoadingOverlay as aH,
+  useCallbackRef as aI,
+  Burger as aJ,
+  Loader as aK,
+  MenuItem as aa,
+  keys as ab,
+  ColorSwatch as ac,
+  CheckIcon as ad,
+  rem as ae,
+  Slider as af,
+  useDebouncedValue as ag,
+  Spoiler as ah,
+  ButtonGroup as ai,
+  useHover$1 as aj,
+  FloatingIndicator as ak,
+  useUncontrolled as al,
+  clampUseMovePosition as am,
+  useMove as an,
+  openSpotlight as ao,
+  HoverCard as ap,
+  HoverCardTarget as aq,
+  Overlay as ar,
+  HoverCardDropdown as as,
+  Notification as at,
+  createTheme as au,
+  MantineProvider as av,
+  useInViewport as aw,
+  SimpleGrid as ax,
+  Drawer as ay,
+  Select as az,
   CardSection as b,
   clsx as c,
   Center as d,
@@ -12621,20 +13465,20 @@ export {
   useReducedMotion as h,
   useMergedRef as i,
   useMantineStyleNonce as j,
-  useComputedColorScheme as k,
-  Popover as l,
-  PopoverTarget as m,
-  PopoverDropdown as n,
-  Stack as o,
-  useTree as p,
-  Tree as q,
-  Tooltip as r,
-  useId$1 as s,
+  SpotlightActionsGroup as k,
+  useComputedColorScheme as l,
+  Popover as m,
+  PopoverTarget as n,
+  PopoverDropdown as o,
+  ScrollAreaAutosize as p,
+  Stack as q,
+  useTree as r,
+  Tree as s,
   themeToVars as t,
   useMantineColorScheme as u,
-  SegmentedControl as v,
-  Alert as w,
-  Anchor as x,
-  Pill as y,
-  useViewportSize as z
+  Tooltip as v,
+  useId$1 as w,
+  SegmentedControl as x,
+  Alert as y,
+  Anchor as z
 };