likec4 1.11.0 → 1.12.1

package/dist/__app__/src/chunks/{mantine-BqgMLMPH.js → mantine-CDAXKBgY.js}

@@ -531,7 +531,15 @@ function filterProps(props) {
   return Object.keys(props).reduce((acc, key) => (props[key] !== void 0 && (acc[key] = props[key]), acc), {});
 }
 function isNumberLike(value) {
-  return typeof value == "number" ? !0 : typeof value == "string" ? value.startsWith("calc(") || value.startsWith("var(") || value.includes(" ") && value.trim() !== "" ? !0 : /[0-9]/.test(value.trim().replace("-", "")[0]) : !1;
+  if (typeof value == "number")
+    return !0;
+  if (typeof value == "string") {
+    if (value.startsWith("calc(") || value.startsWith("var(") || value.includes(" ") && value.trim() !== "")
+      return !0;
+    const cssUnitsRegex = /^[+-]?[0-9]+(\.[0-9]+)?(px|em|rem|ex|ch|lh|rlh|vw|vh|vmin|vmax|vb|vi|svw|svh|lvw|lvh|dvw|dvh|cm|mm|in|pt|pc|q|%)?$/;
+    return value.trim().split(/\s+/).every((val) => cssUnitsRegex.test(val));
+  }
+  return !1;
 }
 function isElement$1(value) {
   return Array.isArray(value) || value === null ? !1 : typeof value == "object" ? value.type !== Fragment : !1;
@@ -675,13 +683,13 @@ function createEventHandler(parentEventHandler, eventHandler) {
     parentEventHandler?.(event), eventHandler?.(event);
   };
 }
-function getBreakpointValue$1(breakpoint, theme) {
-  return breakpoint in theme.breakpoints ? px(theme.breakpoints[breakpoint]) : px(breakpoint);
+function getBreakpointValue$2(breakpoint, breakpoints) {
+  return breakpoint in breakpoints ? px(breakpoints[breakpoint]) : px(breakpoint);
 }
-function getSortedBreakpoints(breakpoints, theme) {
-  const convertedBreakpoints = breakpoints.map((breakpoint) => ({
+function getSortedBreakpoints(values2, breakpoints) {
+  const convertedBreakpoints = values2.map((breakpoint) => ({
     value: breakpoint,
-    px: getBreakpointValue$1(breakpoint, theme)
+    px: getBreakpointValue$2(breakpoint, breakpoints)
   }));
   return convertedBreakpoints.sort((a, b) => a.px - b.px), convertedBreakpoints;
 }
@@ -768,6 +776,14 @@ function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
 function useColorScheme(initialValue, options) {
   return useMediaQuery("(prefers-color-scheme: dark)", initialValue === "dark", options) ? "dark" : "light";
 }
+function useDebouncedValue(value, wait, options = { leading: !1 }) {
+  const [_value, setValue] = useState(value), mountedRef = useRef(!1), timeoutRef = useRef(null), cooldownRef = useRef(!1), cancel = () => window.clearTimeout(timeoutRef.current);
+  return useEffect(() => {
+    mountedRef.current && (!cooldownRef.current && options.leading ? (cooldownRef.current = !0, setValue(value)) : (cancel(), timeoutRef.current = window.setTimeout(() => {
+      cooldownRef.current = !1, setValue(value);
+    }, wait)));
+  }, [value, options.leading, wait]), useEffect(() => (mountedRef.current = !0, cancel), []), [_value, cancel];
+}
 const useIsomorphicEffect = typeof document < "u" ? useLayoutEffect : useEffect;
 function useDidUpdate(fn, dependencies) {
   const mounted = useRef(!1);
@@ -1009,6 +1025,12 @@ function mergeRefs(...refs) {
 function useMergedRef(...refs) {
   return useCallback(mergeRefs(...refs), refs);
 }
+function clampUseMovePosition(position) {
+  return {
+    x: clamp$2(position.x, 0, 1),
+    y: clamp$2(position.y, 0, 1)
+  };
+}
 function useMove(onChange, handlers, dir = "ltr") {
   const ref = useRef(null), mounted = useRef(!1), isSliding = useRef(!1), frame = useRef(0), [active, setActive] = useState(!1);
   return useEffect(() => {
@@ -1165,8 +1187,12 @@ function usePrevious(value) {
   }, [value]), ref.current;
 }
 function useInViewport() {
-  const ref = useRef(null), [inViewport, setInViewport] = useState(!1), observer = useMemo(() => typeof IntersectionObserver > "u" ? null : new IntersectionObserver(([entry]) => setInViewport(entry.isIntersecting)), [ref]);
-  return useEffect(() => ref.current && observer ? (observer.observe(ref.current), () => observer.disconnect()) : () => null, []), { ref, inViewport };
+  const observer = useRef(null), [inViewport, setInViewport] = useState(!1);
+  return { ref: useCallback((node) => {
+    typeof IntersectionObserver < "u" && (node && !observer.current ? observer.current = new IntersectionObserver(
+      ([entry]) => setInViewport(entry.isIntersecting)
+    ) : observer.current?.disconnect(), node ? observer.current?.observe(node) : setInViewport(!1));
+  }, []), inViewport };
 }
 function useMutationObserver(callback, options, target) {
   const observer = useRef(), ref = useRef(null);
@@ -2003,9 +2029,9 @@ function getCSSColorVariables({
 function isVirtualColor(value) {
   return !!value && typeof value == "object" && "mantine-virtual-color" in value;
 }
-function assignSizeVariables(variables, sizes, name) {
-  keys(sizes).forEach(
-    (size2) => Object.assign(variables, { [`--mantine-${name}-${size2}`]: sizes[size2] })
+function assignSizeVariables(variables, sizes2, name) {
+  keys(sizes2).forEach(
+    (size2) => Object.assign(variables, { [`--mantine-${name}-${size2}`]: sizes2[size2] })
   );
 }
 const defaultCssVariablesResolver = (theme) => {
@@ -2844,7 +2870,7 @@ function getBaseValue(value) {
 function getBreakpointKeys(value) {
   return typeof value == "object" && value !== null ? keys(value).filter((key) => key !== "base") : [];
 }
-function getBreakpointValue(value, breakpoint) {
+function getBreakpointValue$1(value, breakpoint) {
   return typeof value == "object" && value !== null && breakpoint in value ? value[breakpoint] : value;
 }
 function parseStyleProps({
@@ -2870,7 +2896,7 @@ function parseStyleProps({
             acc.media[bp] = {
               ...acc.media[bp],
               [property]: resolvers[propertyData.type](
-                getBreakpointValue(styleProps[styleProp], breakpoint),
+                getBreakpointValue$1(styleProps[styleProp], breakpoint),
                 theme
               )
             };
@@ -3084,8 +3110,8 @@ function getThumbRatio(viewportSize, contentSize) {
   const ratio = viewportSize / contentSize;
   return Number.isNaN(ratio) ? 0 : ratio;
 }
-function getThumbSize(sizes) {
-  const ratio = getThumbRatio(sizes.viewport, sizes.content), scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd, thumbSize = (sizes.scrollbar.size - scrollbarPadding) * ratio;
+function getThumbSize(sizes2) {
+  const ratio = getThumbRatio(sizes2.viewport, sizes2.content), scrollbarPadding = sizes2.scrollbar.paddingStart + sizes2.scrollbar.paddingEnd, thumbSize = (sizes2.scrollbar.size - scrollbarPadding) * ratio;
   return Math.max(thumbSize, 18);
 }
 function linearScale(input, output) {
@@ -3099,12 +3125,12 @@ function linearScale(input, output) {
 function clamp$1(value, [min2, max2]) {
   return Math.min(max2, Math.max(min2, value));
 }
-function getThumbOffsetFromScroll(scrollPos, sizes, dir = "ltr") {
-  const thumbSizePx = getThumbSize(sizes), scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd, scrollbar = sizes.scrollbar.size - scrollbarPadding, maxScrollPos = sizes.content - sizes.viewport, maxThumbPos = scrollbar - thumbSizePx, scrollClampRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0], scrollWithoutMomentum = clamp$1(scrollPos, scrollClampRange);
+function getThumbOffsetFromScroll(scrollPos, sizes2, dir = "ltr") {
+  const thumbSizePx = getThumbSize(sizes2), scrollbarPadding = sizes2.scrollbar.paddingStart + sizes2.scrollbar.paddingEnd, scrollbar = sizes2.scrollbar.size - scrollbarPadding, maxScrollPos = sizes2.content - sizes2.viewport, maxThumbPos = scrollbar - thumbSizePx, scrollClampRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0], scrollWithoutMomentum = clamp$1(scrollPos, scrollClampRange);
   return linearScale([0, maxScrollPos], [0, maxThumbPos])(scrollWithoutMomentum);
 }
-function getScrollPositionFromPointer(pointerPos, pointerOffset, sizes, dir = "ltr") {
-  const thumbSizePx = getThumbSize(sizes), thumbCenter = thumbSizePx / 2, offset2 = pointerOffset || thumbCenter, thumbOffsetFromEnd = thumbSizePx - offset2, minPointerPos = sizes.scrollbar.paddingStart + offset2, maxPointerPos = sizes.scrollbar.size - sizes.scrollbar.paddingEnd - thumbOffsetFromEnd, maxScrollPos = sizes.content - sizes.viewport, scrollRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0];
+function getScrollPositionFromPointer(pointerPos, pointerOffset, sizes2, dir = "ltr") {
+  const thumbSizePx = getThumbSize(sizes2), thumbCenter = thumbSizePx / 2, offset2 = pointerOffset || thumbCenter, thumbOffsetFromEnd = thumbSizePx - offset2, minPointerPos = sizes2.scrollbar.paddingStart + offset2, maxPointerPos = sizes2.scrollbar.size - sizes2.scrollbar.paddingEnd - thumbOffsetFromEnd, maxScrollPos = sizes2.content - sizes2.viewport, scrollRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0];
   return linearScale([minPointerPos, maxPointerPos], scrollRange)(pointerPos);
 }
 function isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos) {
@@ -3122,7 +3148,7 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
   "ScrollAreaScrollbar was not found in tree"
 ), Scrollbar = forwardRef((props, forwardedRef) => {
   const {
-    sizes,
+    sizes: sizes2,
     hasThumb,
     onThumbChange,
     onThumbPointerUp,
@@ -3132,7 +3158,7 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
     onWheelScroll,
     onResize,
     ...scrollbarProps
-  } = props, context = useScrollAreaContext(), [scrollbar, setScrollbar] = useState(null), composeRefs = useMergedRef(forwardedRef, (node) => setScrollbar(node)), rectRef = useRef(null), prevWebkitUserSelectRef = useRef(""), { viewport } = context, maxScrollPos = sizes.content - sizes.viewport, handleWheelScroll = useCallbackRef(onWheelScroll), handleThumbPositionChange = useCallbackRef(onThumbPositionChange), handleResize = useDebouncedCallback(onResize, 10), handleDragScroll = (event) => {
+  } = props, context = useScrollAreaContext(), [scrollbar, setScrollbar] = useState(null), composeRefs = useMergedRef(forwardedRef, (node) => setScrollbar(node)), rectRef = useRef(null), prevWebkitUserSelectRef = useRef(""), { viewport } = context, maxScrollPos = sizes2.content - sizes2.viewport, handleWheelScroll = useCallbackRef(onWheelScroll), handleThumbPositionChange = useCallbackRef(onThumbPositionChange), handleResize = useDebouncedCallback(onResize, 10), handleDragScroll = (event) => {
     if (rectRef.current) {
       const x = event.clientX - rectRef.current.left, y = event.clientY - rectRef.current.top;
       onDragScroll({ x, y });
@@ -3144,7 +3170,7 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
       scrollbar?.contains(element) && handleWheelScroll(event, maxScrollPos);
     };
     return document.addEventListener("wheel", handleWheel, { passive: !1 }), () => document.removeEventListener("wheel", handleWheel, { passive: !1 });
-  }, [viewport, scrollbar, maxScrollPos, handleWheelScroll]), useEffect(handleThumbPositionChange, [sizes, handleThumbPositionChange]), useResizeObserver(scrollbar, handleResize), useResizeObserver(context.content, handleResize), /* @__PURE__ */ jsx(
+  }, [viewport, scrollbar, maxScrollPos, handleWheelScroll]), useEffect(handleThumbPositionChange, [sizes2, handleThumbPositionChange]), useResizeObserver(scrollbar, handleResize), useResizeObserver(context.content, handleResize), /* @__PURE__ */ jsx(
     ScrollbarProvider,
     {
       value: {
@@ -3177,7 +3203,7 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
   );
 }), ScrollAreaScrollbarX = forwardRef(
   (props, forwardedRef) => {
-    const { sizes, onSizesChange, style, ...others } = props, ctx = useScrollAreaContext(), [computedStyle, setComputedStyle] = useState(), ref = useRef(null), composeRefs = useMergedRef(forwardedRef, ref, ctx.onScrollbarXChange);
+    const { sizes: sizes2, onSizesChange, style, ...others } = props, ctx = useScrollAreaContext(), [computedStyle, setComputedStyle] = useState(), ref = useRef(null), composeRefs = useMergedRef(forwardedRef, ref, ctx.onScrollbarXChange);
     return useEffect(() => {
       ref.current && setComputedStyle(getComputedStyle(ref.current));
     }, [ref]), /* @__PURE__ */ jsx(
@@ -3186,10 +3212,10 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
         "data-orientation": "horizontal",
         ...others,
         ref: composeRefs,
-        sizes,
+        sizes: sizes2,
         style: {
           ...style,
-          "--sa-thumb-width": `${getThumbSize(sizes)}px`
+          "--sa-thumb-width": `${getThumbSize(sizes2)}px`
         },
         onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.x),
         onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.x),
@@ -3213,9 +3239,11 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
       }
     );
   }
-), ScrollAreaScrollbarY = forwardRef(
+);
+ScrollAreaScrollbarX.displayName = "@mantine/core/ScrollAreaScrollbarX";
+const ScrollAreaScrollbarY = forwardRef(
   (props, forwardedRef) => {
-    const { sizes, onSizesChange, style, ...others } = props, context = useScrollAreaContext(), [computedStyle, setComputedStyle] = useState(), ref = useRef(null), composeRefs = useMergedRef(forwardedRef, ref, context.onScrollbarYChange);
+    const { sizes: sizes2, onSizesChange, style, ...others } = props, context = useScrollAreaContext(), [computedStyle, setComputedStyle] = useState(), ref = useRef(null), composeRefs = useMergedRef(forwardedRef, ref, context.onScrollbarYChange);
     return useEffect(() => {
       ref.current && setComputedStyle(window.getComputedStyle(ref.current));
     }, []), /* @__PURE__ */ jsx(
@@ -3224,9 +3252,9 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
         ...others,
         "data-orientation": "vertical",
         ref: composeRefs,
-        sizes,
+        sizes: sizes2,
         style: {
-          "--sa-thumb-height": `${getThumbSize(sizes)}px`,
+          "--sa-thumb-height": `${getThumbSize(sizes2)}px`,
           ...style
         },
         onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.y),
@@ -3251,14 +3279,16 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
       }
     );
   }
-), ScrollAreaScrollbarVisible = forwardRef((props, forwardedRef) => {
-  const { orientation = "vertical", ...scrollbarProps } = props, { dir } = useDirection(), context = useScrollAreaContext(), thumbRef = useRef(null), pointerOffsetRef = useRef(0), [sizes, setSizes] = useState({
+);
+ScrollAreaScrollbarY.displayName = "@mantine/core/ScrollAreaScrollbarY";
+const ScrollAreaScrollbarVisible = forwardRef((props, forwardedRef) => {
+  const { orientation = "vertical", ...scrollbarProps } = props, { dir } = useDirection(), context = useScrollAreaContext(), thumbRef = useRef(null), pointerOffsetRef = useRef(0), [sizes2, setSizes] = useState({
     content: 0,
     viewport: 0,
     scrollbar: { size: 0, paddingStart: 0, paddingEnd: 0 }
-  }), thumbRatio = getThumbRatio(sizes.viewport, sizes.content), commonProps = {
+  }), thumbRatio = getThumbRatio(sizes2.viewport, sizes2.content), commonProps = {
     ...scrollbarProps,
-    sizes,
+    sizes: sizes2,
     onSizesChange: setSizes,
     hasThumb: thumbRatio > 0 && thumbRatio < 1,
     onThumbChange: (thumb) => {
@@ -3270,7 +3300,7 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
     onThumbPointerDown: (pointerPos) => {
       pointerOffsetRef.current = pointerPos;
     }
-  }, getScrollPosition = (pointerPos, direction) => getScrollPositionFromPointer(pointerPos, pointerOffsetRef.current, sizes, direction);
+  }, getScrollPosition = (pointerPos, direction) => getScrollPositionFromPointer(pointerPos, pointerOffsetRef.current, sizes2, direction);
   return orientation === "horizontal" ? /* @__PURE__ */ jsx(
     ScrollAreaScrollbarX,
     {
@@ -3278,7 +3308,7 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
       ref: forwardedRef,
       onThumbPositionChange: () => {
         if (context.viewport && thumbRef.current) {
-          const scrollPos = context.viewport.scrollLeft, offset2 = getThumbOffsetFromScroll(scrollPos, sizes, dir);
+          const scrollPos = context.viewport.scrollLeft, offset2 = getThumbOffsetFromScroll(scrollPos, sizes2, dir);
           thumbRef.current.style.transform = `translate3d(${offset2}px, 0, 0)`;
         }
       },
@@ -3296,8 +3326,8 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
       ref: forwardedRef,
       onThumbPositionChange: () => {
         if (context.viewport && thumbRef.current) {
-          const scrollPos = context.viewport.scrollTop, offset2 = getThumbOffsetFromScroll(scrollPos, sizes);
-          sizes.scrollbar.size === 0 ? thumbRef.current.style.opacity = "0" : thumbRef.current.style.opacity = "1", thumbRef.current.style.transform = `translate3d(0, ${offset2}px, 0)`;
+          const scrollPos = context.viewport.scrollTop, offset2 = getThumbOffsetFromScroll(scrollPos, sizes2);
+          sizes2.scrollbar.size === 0 ? thumbRef.current.style.opacity = "0" : thumbRef.current.style.opacity = "1", thumbRef.current.style.transform = `translate3d(0, ${offset2}px, 0)`;
         }
       },
       onWheelScroll: (scrollPos) => {
@@ -3308,7 +3338,9 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
       }
     }
   ) : null;
-}), ScrollAreaScrollbarAuto = forwardRef(
+});
+ScrollAreaScrollbarVisible.displayName = "@mantine/core/ScrollAreaScrollbarVisible";
+const ScrollAreaScrollbarAuto = forwardRef(
   (props, ref) => {
     const context = useScrollAreaContext(), { forceMount, ...scrollbarProps } = props, [visible2, setVisible] = useState(!1), isHorizontal = props.orientation === "horizontal", handleResize = useDebouncedCallback(() => {
       if (context.viewport) {
@@ -3325,7 +3357,9 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
       }
     ) : null;
   }
-), ScrollAreaScrollbarHover = forwardRef(
+);
+ScrollAreaScrollbarAuto.displayName = "@mantine/core/ScrollAreaScrollbarAuto";
+const ScrollAreaScrollbarHover = forwardRef(
   (props, ref) => {
     const { forceMount, ...scrollbarProps } = props, context = useScrollAreaContext(), [visible2, setVisible] = useState(!1);
     return useEffect(() => {
@@ -3350,7 +3384,9 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
       }
     ) : null;
   }
-), ScrollAreaScrollbarScroll = forwardRef(
+);
+ScrollAreaScrollbarHover.displayName = "@mantine/core/ScrollAreaScrollbarHover";
+const ScrollAreaScrollbarScroll = forwardRef(
   (props, red) => {
     const { forceMount, ...scrollbarProps } = props, context = useScrollAreaContext(), isHorizontal = props.orientation === "horizontal", [state, setState] = useState("hidden"), debounceScrollEnd = useDebouncedCallback(() => setState("idle"), 100);
     return useEffect(() => {
@@ -3387,6 +3423,7 @@ const [ScrollbarProvider, useScrollbarContext] = createSafeContext(
     }), [isHorizontal, onScrollbarXEnabledChange, onScrollbarYEnabledChange]), context.type === "hover" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarHover, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "scroll" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarScroll, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "auto" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarAuto, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "always" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarVisible, { ...scrollbarProps, ref: forwardedRef }) : null;
   }
 );
+ScrollAreaScrollbar.displayName = "@mantine/core/ScrollAreaScrollbar";
 function addUnlinkedScrollListener(node, handler = () => {
 }) {
   let prevPosition = { left: node.scrollLeft, top: node.scrollTop }, rAF = 0;
@@ -3428,12 +3465,16 @@ const Thumb$1 = forwardRef((props, forwardedRef) => {
       onPointerUp: composeEventHandlers(props.onPointerUp, scrollbarContext.onThumbPointerUp)
     }
   );
-}), ScrollAreaThumb = forwardRef(
+});
+Thumb$1.displayName = "@mantine/core/ScrollAreaThumb";
+const ScrollAreaThumb = forwardRef(
   (props, forwardedRef) => {
     const { forceMount, ...thumbProps } = props, scrollbarContext = useScrollbarContext();
     return forceMount || scrollbarContext.hasThumb ? /* @__PURE__ */ jsx(Thumb$1, { ref: forwardedRef, ...thumbProps }) : null;
   }
-), ScrollAreaViewport = forwardRef(
+);
+ScrollAreaThumb.displayName = "@mantine/core/ScrollAreaThumb";
+const ScrollAreaViewport = forwardRef(
   ({ children, style, ...others }, ref) => {
     const ctx = useScrollAreaContext(), rootRef = useMergedRef(ref, ctx.onViewportChange);
     return /* @__PURE__ */ jsx(
@@ -3514,7 +3555,7 @@ const classes$G = __default__$G, defaultProps$1r = {
             onScroll: (e) => {
               viewportProps?.onScroll?.(e), onScrollPositionChange?.({ x: e.currentTarget.scrollLeft, y: e.currentTarget.scrollTop });
               const { scrollTop, scrollHeight, clientHeight } = e.currentTarget;
-              scrollTop - (scrollHeight - clientHeight) === 0 && onBottomReached?.(), scrollTop === 0 && onTopReached?.();
+              scrollTop - (scrollHeight - clientHeight) >= 0 && onBottomReached?.(), scrollTop === 0 && onTopReached?.();
             },
             children
           }
@@ -3575,6 +3616,7 @@ const ScrollAreaAutosize = factory((props, ref) => {
     style,
     vars,
     onBottomReached,
+    onTopReached,
     ...others
   } = useProps("ScrollAreaAutosize", defaultProps$1r, 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(
@@ -3595,6 +3637,7 @@ const ScrollAreaAutosize = factory((props, ref) => {
       vars,
       scrollbars,
       onBottomReached,
+      onTopReached,
       children
     }
   ) }) });
@@ -6335,7 +6378,7 @@ function useFloatingAutoUpdate({
 }) {
   const [delayedUpdate, setDelayedUpdate] = useState(0);
   useEffect(() => {
-    if (floating.refs.reference.current && floating.refs.floating.current)
+    if (floating.refs.reference.current && floating.refs.floating.current && opened)
       return autoUpdate(
         floating.refs.reference.current,
         floating.refs.floating.current,
@@ -6385,7 +6428,7 @@ function getPopoverMiddlewares(options, getFloating) {
   ), middlewares;
 }
 function usePopover(options) {
-  const [_opened, setOpened] = useUncontrolled({
+  const [_opened, setOpened, isControlled] = useUncontrolled({
     value: options.opened,
     defaultValue: options.defaultOpened,
     finalValue: !1,
@@ -6400,15 +6443,15 @@ function usePopover(options) {
     middleware: getPopoverMiddlewares(options, () => floating)
   });
   return useFloatingAutoUpdate({
-    opened: options.opened,
+    opened: _opened,
     position: options.position,
     positionDependencies: options.positionDependencies || [],
     floating
   }), useDidUpdate(() => {
     options.onPositionChange?.(floating.placement);
   }, [floating.placement]), useDidUpdate(() => {
-    options.opened ? options.onOpen?.() : options.onClose?.();
-  }, [options.opened]), {
+    isControlled || (options.opened ? options.onOpen?.() : options.onClose?.());
+  }, [options.opened, isControlled]), {
     floating,
     controlled: typeof options.opened == "boolean",
     opened: _opened,
@@ -6583,11 +6626,17 @@ const classes$B = __default__$B, Bars = forwardRef(({ className, ...others }, re
   /* @__PURE__ */ jsx("span", { className: classes$B.bar }),
   /* @__PURE__ */ jsx("span", { className: classes$B.bar }),
   /* @__PURE__ */ jsx("span", { className: classes$B.bar })
-] })), Dots = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsxs(Box, { component: "span", className: clsx(classes$B.dotsLoader, className), ...others, ref, children: [
+] }));
+Bars.displayName = "@mantine/core/Bars";
+const Dots = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsxs(Box, { component: "span", className: clsx(classes$B.dotsLoader, className), ...others, ref, children: [
   /* @__PURE__ */ jsx("span", { className: classes$B.dot }),
   /* @__PURE__ */ jsx("span", { className: classes$B.dot }),
   /* @__PURE__ */ jsx("span", { className: classes$B.dot })
-] })), Oval = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsx(Box, { component: "span", className: clsx(classes$B.ovalLoader, className), ...others, ref })), defaultLoaders = {
+] }));
+Dots.displayName = "@mantine/core/Dots";
+const Oval = forwardRef(({ className, ...others }, ref) => /* @__PURE__ */ jsx(Box, { component: "span", className: clsx(classes$B.ovalLoader, className), ...others, ref }));
+Oval.displayName = "@mantine/core/Oval";
+const defaultLoaders = {
   bars: Bars,
   oval: Oval,
   dots: Dots
@@ -7051,6 +7100,7 @@ const ModalBase = forwardRef(
     ) });
   }
 );
+ModalBase.displayName = "@mantine/core/ModalBase";
 function useModalBodyId() {
   const ctx = useModalBaseContext();
   return useEffect(() => (ctx.setBodyMounted(!0), () => ctx.setBodyMounted(!1)), []), ctx.getBodyId();
@@ -7125,7 +7175,9 @@ const ModalBaseContent = forwardRef(
       }
     );
   }
-), ModalBaseHeader = forwardRef(
+);
+ModalBaseContent.displayName = "@mantine/core/ModalBaseContent";
+const ModalBaseHeader = forwardRef(
   ({ className, ...others }, ref) => {
     const ctx = useModalBaseContext();
     return /* @__PURE__ */ jsx(
@@ -9845,11 +9897,12 @@ const defaultProps$q = {}, MenuDropdown = factory((props, ref) => {
     vars,
     onMouseEnter,
     onMouseLeave,
+    onKeyDown,
     children,
     ...others
-  } = useProps("MenuDropdown", defaultProps$q, props), wrapperRef = useRef(null), ctx = useMenuContext(), handleKeyDown = (event) => {
+  } = useProps("MenuDropdown", defaultProps$q, 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(
+  }), handleMouseEnter = createEventHandler(
     onMouseEnter,
     () => (ctx.trigger === "hover" || ctx.trigger === "click-hover") && ctx.openDropdown()
   ), handleMouseLeave = createEventHandler(
@@ -9932,7 +9985,7 @@ const defaultProps$p = {}, MenuItem = polymorphicFactory((props, ref) => {
         loop: ctx.loop,
         dir,
         orientation: "vertical",
-        onKeyDown: _others.onKeydown
+        onKeyDown: _others.onKeyDown
       }),
       __vars: {
         "--menu-item-color": parsedThemeColor?.isThemeColor && parsedThemeColor?.shade === void 0 ? `var(--mantine-color-${parsedThemeColor.color}-6)` : colors?.color,
@@ -10479,7 +10532,7 @@ function useTooltip(settings) {
     }),
     useFocus(context, { enabled: settings.events?.focus, visibleOnly: !0 }),
     useRole(context, { role: "tooltip" }),
-    // cannot be used with controlled tooltip, page jumps
+    // Cannot be used with controlled tooltip, page jumps
     useDismiss(context, { enabled: typeof settings.opened > "u" }),
     useDelayGroup(context, { id: uid })
   ]);
@@ -11004,7 +11057,7 @@ function SimpleGridMediaVariables({
   }), queries = keys(theme.breakpoints).reduce(
     (acc, breakpoint) => (acc[breakpoint] || (acc[breakpoint] = {}), typeof spacing == "object" && spacing[breakpoint] !== void 0 && (acc[breakpoint]["--sg-spacing-x"] = getSpacing(spacing[breakpoint])), typeof _verticalSpacing == "object" && _verticalSpacing[breakpoint] !== void 0 && (acc[breakpoint]["--sg-spacing-y"] = getSpacing(_verticalSpacing[breakpoint])), typeof cols == "object" && cols[breakpoint] !== void 0 && (acc[breakpoint]["--sg-cols"] = cols[breakpoint]), acc),
     {}
-  ), media = getSortedBreakpoints(keys(queries), theme).filter(
+  ), media = getSortedBreakpoints(keys(queries), theme.breakpoints).filter(
     (breakpoint) => keys(queries[breakpoint.value]).length > 0
   ).map((breakpoint) => ({
     query: `(min-width: ${theme.breakpoints[breakpoint.value]})`,
@@ -11212,7 +11265,7 @@ function Track({
   ...others
 }) {
   const { getStyles: getStyles2 } = useSliderContext();
-  return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(Box, { ...getStyles2("trackContainer"), mod: { disabled }, ...containerProps, children: /* @__PURE__ */ jsxs(Box, { ...getStyles2("track"), mod: { inverted, disabled }, children: [
+  return /* @__PURE__ */ jsx(Box, { ...getStyles2("trackContainer"), mod: { disabled }, ...containerProps, children: /* @__PURE__ */ jsxs(Box, { ...getStyles2("track"), mod: { inverted, disabled }, children: [
     /* @__PURE__ */ jsx(
       Box,
       {
@@ -11226,7 +11279,7 @@ function Track({
     ),
     children,
     /* @__PURE__ */ jsx(Marks, { ...others, offset: marksOffset, disabled, inverted })
-  ] }) }) });
+  ] }) });
 }
 Track.displayName = "@mantine/core/SliderTrack";
 function getChangeValue({
@@ -11836,13 +11889,17 @@ const classes$2 = __default__$2, defaultProps$2 = {}, varsResolver$2 = (theme, {
 });
 ThemeIcon.classes = classes$2;
 ThemeIcon.displayName = "@mantine/core/ThemeIcon";
-const headings = ["h1", "h2", "h3", "h4", "h5", "h6"];
+const headings = ["h1", "h2", "h3", "h4", "h5", "h6"], sizes = ["xs", "sm", "md", "lg", "xl"];
 function getTitleSize(order, size2) {
   const titleSize = size2 !== void 0 ? size2 : `h${order}`;
   return headings.includes(titleSize) ? {
     fontSize: `var(--mantine-${titleSize}-font-size)`,
     fontWeight: `var(--mantine-${titleSize}-font-weight)`,
     lineHeight: `var(--mantine-${titleSize}-line-height)`
+  } : sizes.includes(titleSize) ? {
+    fontSize: `var(--mantine-font-size-${titleSize})`,
+    fontWeight: `var(--mantine-h${order}-font-weight)`,
+    lineHeight: `var(--mantine-h${order}-line-height)`
   } : {
     fontSize: rem(titleSize),
     fontWeight: `var(--mantine-h${order}-font-weight)`,
@@ -12231,83 +12288,187 @@ const defaultProps = {
 });
 Tree.displayName = "@mantine/core/Tree";
 Tree.classes = classes;
+function getSizesVariables(theme, themeKey, name) {
+  return Object.keys(theme[themeKey]).reduce((acc, size2) => (acc[size2] = `var(--mantine-${name}-${size2})`, acc), {});
+}
+function getBreakpointValue(value, theme) {
+  return value in theme.breakpoints ? theme.breakpoints[value] : em(value);
+}
+function themeToVars(theme) {
+  const mergedTheme = mergeMantineTheme(DEFAULT_THEME, theme), fontSizes = getSizesVariables(mergedTheme, "fontSizes", "font-size"), lineHeights = getSizesVariables(mergedTheme, "lineHeights", "line-height"), shadows = getSizesVariables(mergedTheme, "shadows", "shadow"), radius = getSizesVariables(mergedTheme, "radius", "radius"), spacing = getSizesVariables(mergedTheme, "spacing", "spacing"), headings2 = Object.keys(mergedTheme.headings.sizes).reduce(
+    (acc, heading) => (acc[heading] = {
+      fontSize: `var(--mantine-${heading}-font-size)`,
+      lineHeight: `var(--mantine-${heading}-line-height)`,
+      fontWeight: `var(--mantine-${heading}-font-weight)`
+    }, acc),
+    {}
+  ), colors = Object.keys(mergedTheme.colors).reduce(
+    (acc, color) => (acc[color] = {
+      0: `var(--mantine-color-${color}-0)`,
+      1: `var(--mantine-color-${color}-1)`,
+      2: `var(--mantine-color-${color}-2)`,
+      3: `var(--mantine-color-${color}-3)`,
+      4: `var(--mantine-color-${color}-4)`,
+      5: `var(--mantine-color-${color}-5)`,
+      6: `var(--mantine-color-${color}-6)`,
+      7: `var(--mantine-color-${color}-7)`,
+      8: `var(--mantine-color-${color}-8)`,
+      9: `var(--mantine-color-${color}-9)`,
+      filled: `var(--mantine-color-${color}-filled)`,
+      filledHover: `var(--mantine-color-${color}-filled-hover)`,
+      light: `var(--mantine-color-${color}-light)`,
+      lightHover: `var(--mantine-color-${color}-light-hover)`,
+      lightColor: `var(--mantine-color-${color}-light-color)`,
+      outline: `var(--mantine-color-${color}-outline)`,
+      outlineHover: `var(--mantine-color-${color}-outline-hover)`
+    }, acc),
+    {
+      primary: "var(--mantine-primary-color-filled)",
+      primaryColors: {
+        0: "var(--mantine-primary-color-0)",
+        1: "var(--mantine-primary-color-1)",
+        2: "var(--mantine-primary-color-2)",
+        3: "var(--mantine-primary-color-3)",
+        4: "var(--mantine-primary-color-4)",
+        5: "var(--mantine-primary-color-5)",
+        6: "var(--mantine-primary-color-6)",
+        7: "var(--mantine-primary-color-7)",
+        8: "var(--mantine-primary-color-8)",
+        9: "var(--mantine-primary-color-9)",
+        filled: "var(--mantine-primary-color-filled)",
+        filledHover: "var(--mantine-primary-color-filled-hover)",
+        light: "var(--mantine-primary-color-light)",
+        lightHover: "var(--mantine-primary-color-light-hover)",
+        lightColor: "var(--mantine-primary-color-light-color)",
+        outline: "var(--mantine-primary-color-outline)",
+        outlineHover: "var(--mantine-primary-color-outline-hover)"
+      },
+      white: "var(--mantine-color-white)",
+      black: "var(--mantine-color-black)",
+      text: "var(--mantine-color-text)",
+      body: "var(--mantine-color-body)",
+      error: "var(--mantine-color-error)",
+      placeholder: "var(--mantine-color-placeholder)",
+      anchor: "var(--mantine-color-anchor)",
+      default: "var(--mantine-color-default)",
+      defaultHover: "var(--mantine-color-default-hover)",
+      defaultColor: "var(--mantine-color-default-color)",
+      defaultBorder: "var(--mantine-color-default-border)",
+      dimmed: "var(--mantine-color-dimmed)"
+    }
+  );
+  return {
+    scale: "var(--mantine-scale)",
+    cursorType: "var(--mantine-cursor-type)",
+    webkitFontSmoothing: "var(--mantine-webkit-font-smoothing)",
+    mozFontSmoothing: "var(--mantine-moz-font-smoothing)",
+    lineHeight: "var(--mantine-line-height)",
+    fontFamily: "var(--mantine-font-family)",
+    fontFamilyMonospace: "var(--mantine-font-family-monospace)",
+    fontFamilyHeadings: "var(--mantine-font-family-headings)",
+    headingFontWeight: "var(--mantine-heading-font-weight)",
+    radiusDefault: "var(--mantine-radius-default)",
+    breakpoints: mergedTheme.breakpoints,
+    fontSizes,
+    lineHeights,
+    shadows,
+    radius,
+    headings: headings2,
+    spacing,
+    colors,
+    rtlSelector: '[dir="rtl"] &',
+    darkSelector: '[data-mantine-color-scheme="dark"] &',
+    lightSelector: '[data-mantine-color-scheme="light"] &',
+    smallerThan: (breakpoint) => `(max-width: ${getBreakpointValue(breakpoint, mergedTheme)})`,
+    largerThan: (breakpoint) => `(min-width: ${getBreakpointValue(breakpoint, mergedTheme)})`
+  };
+}
 export {
-  SegmentedControl as $,
+  Tabs as $,
   ActionIcon as A,
   Box as B,
   Card as C,
-  CopyButton as D,
-  useLocalStorage as E,
-  Spoiler as F,
+  ColorSwatch as D,
+  Divider as E,
+  Flex as F,
   Group as G,
-  HoverCard as H,
+  CheckIcon as H,
   Image as I,
-  Badge as J,
-  ButtonGroup as K,
-  Tabs as L,
+  rem as J,
+  Slider as K,
+  SegmentedControl as L,
   MantineContext as M,
-  TabsList as N,
-  TabsTab as O,
+  useDebouncedValue as N,
+  HoverCard as O,
   Paper as P,
-  TabsPanel as Q,
-  rem as R,
+  HoverCardTarget as Q,
+  HoverCardDropdown as R,
   Stack as S,
   ThemeIcon as T,
   UnstyledButton as U,
-  Divider as V,
-  Flex as W,
-  ColorSwatch as X,
-  CheckIcon as Y,
-  Select as Z,
-  Slider as _,
+  Anchor as V,
+  CopyButton as W,
+  useLocalStorage as X,
+  Spoiler as Y,
+  Badge as Z,
+  ButtonGroup as _,
   Text as a,
-  FloatingIndicator as a0,
-  Notification as a1,
-  Code as a2,
-  createTheme as a3,
-  MantineProvider as a4,
-  useInViewport as a5,
-  SimpleGrid as a6,
-  useTree as a7,
-  useComputedColorScheme as a8,
-  Tree as a9,
-  Drawer as aa,
-  ScrollArea as ab,
-  Alert as ac,
-  ModalRoot as ad,
-  ModalOverlay as ae,
-  ModalContent as af,
-  ModalBody as ag,
-  useMantineTheme as ah,
-  useMediaQuery as ai,
-  useDisclosure as aj,
-  LoadingOverlay as ak,
-  useCallbackRef as al,
-  Burger as am,
-  Loader as an,
+  TabsList as a0,
+  TabsTab as a1,
+  TabsPanel as a2,
+  FloatingIndicator as a3,
+  useUncontrolled as a4,
+  clampUseMovePosition as a5,
+  useMove as a6,
+  ActionIconGroup as a7,
+  Overlay as a8,
+  Notification as a9,
+  Code as aa,
+  createTheme as ab,
+  MantineProvider as ac,
+  useInViewport as ad,
+  SimpleGrid as ae,
+  useTree as af,
+  useComputedColorScheme as ag,
+  Tree as ah,
+  Drawer as ai,
+  ScrollArea as aj,
+  Alert as ak,
+  Select as al,
+  ModalRoot as am,
+  ModalOverlay as an,
+  ModalContent as ao,
+  ModalBody as ap,
+  useMantineTheme as aq,
+  useMediaQuery as ar,
+  useDisclosure as as,
+  LoadingOverlay as at,
+  useCallbackRef as au,
+  Burger as av,
+  Loader as aw,
   CardSection as b,
   clsx as c,
   Center as d,
   Container as e,
   Title as f,
   Button as g,
-  useHotkeys as h,
-  Tooltip as i,
-  Menu as j,
-  MenuTarget as k,
-  MenuDropdown as l,
-  MenuLabel as m,
-  MenuDivider as n,
-  TooltipGroup as o,
-  Space as p,
-  MenuItem as q,
-  Popover as r,
-  PopoverTarget as s,
-  PopoverDropdown as t,
+  useMantineStyleNonce as h,
+  useHotkeys as i,
+  Tooltip as j,
+  Menu as k,
+  MenuTarget as l,
+  MenuDropdown as m,
+  MenuLabel as n,
+  MenuDivider as o,
+  TooltipGroup as p,
+  Space as q,
+  MenuItem as r,
+  Popover as s,
+  themeToVars as t,
   useMantineColorScheme as u,
-  ScrollAreaAutosize as v,
-  CloseButton as w,
-  HoverCardTarget as x,
-  HoverCardDropdown as y,
-  Anchor as z
+  PopoverTarget as v,
+  PopoverDropdown as w,
+  ScrollAreaAutosize as x,
+  CloseButton as y,
+  keys as z
 };