@mantine-vue/core 2.3.1 → 2.4.0

package/esm/index.mjs

@@ -5107,7 +5107,7 @@ var varsResolver$70 = createVarsResolver((theme, { radius, color, gradient, vari
 		"--button-hover-color": color || variant ? colors.hoverColor : void 0
 	} };
 });
-function renderContent$5(content) {
+function renderContent$4(content) {
 	return typeof content === "function" ? content() : content;
 }
 var ButtonBase = defineComponent({
@@ -5236,7 +5236,7 @@ var ButtonBase = defineComponent({
 			component: "span",
 			...getStyles("section"),
 			mod: { position }
-		}, () => renderContent$5(content)) : null;
+		}, () => renderContent$4(content)) : null;
 		return () => {
 			const leftSection = resolveNode(props.leftSection, slots.leftSection);
 			const rightSection = resolveNode(props.rightSection, slots.rightSection);
@@ -8016,13 +8016,13 @@ var ScrollAreaViewport = withBoxProps(defineComponent({
 	}
 }));
 var ScrollArea_module_default = {
-	root: "_root_kwra0_1",
-	content: "_content_kwra0_7",
-	viewport: "_viewport_kwra0_12",
-	viewportInner: "_viewportInner_kwra0_59",
-	scrollbar: "_scrollbar_kwra0_64",
-	thumb: "_thumb_kwra0_81",
-	corner: "_corner_kwra0_144"
+	root: "_root_1sy9q_1",
+	content: "_content_1sy9q_7",
+	viewport: "_viewport_1sy9q_12",
+	viewportInner: "_viewportInner_1sy9q_71",
+	scrollbar: "_scrollbar_1sy9q_76",
+	thumb: "_thumb_1sy9q_93",
+	corner: "_corner_1sy9q_182"
 };
 //#endregion
 //#region src/components/ScrollArea/ScrollArea.ts
@@ -8098,6 +8098,10 @@ var ScrollAreaBase = defineComponent({
 			type: Object,
 			default: void 0
 		},
+		verticalScrollbarPosition: {
+			type: String,
+			default: void 0
+		},
 		classNames: {
 			type: [Object, Function],
 			default: void 0
@@ -8256,11 +8260,13 @@ var ScrollAreaBase = defineComponent({
 				},
 				"data-offset-scrollbars": toOffsetScrollbars(props.offsetScrollbars),
 				"data-scrollbars": props.scrollbars || void 0,
+				"data-vertical-scrollbar-position": props.verticalScrollbarPosition,
 				onScroll: handleScroll
 			}, () => slots.default?.()),
 			(props.scrollbars === "xy" || props.scrollbars === "x") && h(ScrollAreaScrollbar, {
 				...getStyles("scrollbar"),
 				orientation: "horizontal",
+				"data-vertical-scrollbar-position": props.verticalScrollbarPosition,
 				"data-hidden": props.type === "never" ? true : void 0,
 				"data-state": getScrollbarState("horizontal"),
 				forceMount: true
@@ -8268,12 +8274,14 @@ var ScrollAreaBase = defineComponent({
 			(props.scrollbars === "xy" || props.scrollbars === "y") && h(ScrollAreaScrollbar, {
 				...getStyles("scrollbar"),
 				orientation: "vertical",
+				"data-vertical-scrollbar-position": props.verticalScrollbarPosition,
 				"data-hidden": props.type === "never" ? true : void 0,
 				"data-state": getScrollbarState("vertical"),
 				forceMount: true
 			}, () => h(ScrollAreaThumb, getStyles("thumb"))),
 			h(ScrollAreaCorner, {
 				...getStyles("corner"),
+				"data-vertical-scrollbar-position": props.verticalScrollbarPosition,
 				"data-hidden": props.type === "never" ? true : void 0
 			})
 		]);
@@ -8594,6 +8602,7 @@ var defaultProps$35 = {
 	multiple: false,
 	loop: true,
 	disableChevronRotation: false,
+	disableCollapse: false,
 	chevronPosition: "right",
 	variant: "default",
 	chevronSize: "auto",
@@ -8605,7 +8614,7 @@ function getSafeId$2(prefix) {
 		return `${prefix}-${value}`;
 	};
 }
-function renderContent$4(content) {
+function renderContent$3(content) {
 	return typeof content === "function" ? content() : content;
 }
 var varsResolver$57 = createVarsResolver((_, { transitionDuration, chevronSize, radius }) => ({ root: {
@@ -8616,6 +8625,7 @@ var varsResolver$57 = createVarsResolver((_, { transitionDuration, chevronSize,
 var AccordionBase = defineComponent({
 	name: "Accordion",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		multiple: {
 			type: Boolean,
@@ -8649,6 +8659,10 @@ var AccordionBase = defineComponent({
 			type: Boolean,
 			default: void 0
 		},
+		disableCollapse: {
+			type: Boolean,
+			default: void 0
+		},
 		chevronPosition: {
 			type: String,
 			default: void 0
@@ -8728,6 +8742,7 @@ var AccordionBase = defineComponent({
 		const isItemActive = (itemValue) => Array.isArray(currentValue.value) ? currentValue.value.includes(itemValue) : itemValue === currentValue.value;
 		const handleItemChange = (itemValue) => {
 			const value = currentValue.value;
+			if (!Array.isArray(value) && props.disableCollapse && itemValue === value) return;
 			setCurrentValue(Array.isArray(value) ? value.includes(itemValue) ? value.filter((selectedValue) => selectedValue !== itemValue) : [...value, itemValue] : itemValue === value ? null : itemValue);
 		};
 		provideAccordionContext(reactive({
@@ -8747,7 +8762,8 @@ var AccordionBase = defineComponent({
 				return props.order;
 			},
 			get chevron() {
-				return props.chevron === null ? null : props.chevron ?? (() => h(AccordionChevron, { size: props.chevronIconSize }));
+				if (props.chevron === null) return null;
+				return props.chevron ?? slots.chevron ?? (() => h(AccordionChevron, { size: props.chevronIconSize }));
 			},
 			onChange: handleItemChange,
 			isItemActive,
@@ -8777,7 +8793,7 @@ var AccordionBase = defineComponent({
 			id: uid.value,
 			variant: props.variant,
 			"data-accordion": true
-		}, () => renderContent$4(slots.default));
+		}, () => renderContent$3(slots.default));
 	}
 });
 var Accordion = Object.assign(AccordionBase, {
@@ -8805,12 +8821,10 @@ var varsResolver$56 = createVarsResolver((theme, { controlSize, edgeGradientColo
 	"--scroller-control-size": controlSize === void 0 ? void 0 : rem(controlSize),
 	"--scroller-background-color": edgeGradientColor ? getThemeColor(edgeGradientColor, theme) : void 0
 } }));
-function renderContent$3(content) {
-	return typeof content === "function" ? content() : content;
-}
 var Scroller = withBoxProps(defineComponent({
 	name: "Scroller",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		scrollAmount: {
 			type: Number,
@@ -8915,7 +8929,7 @@ var Scroller = withBoxProps(defineComponent({
 					"data-hidden": !showStart || void 0,
 					"aria-label": "Scroll left",
 					tabindex: showStart ? 0 : -1
-				}, () => renderContent$3(props.startControlIcon) || h(AccordionChevron, getStyles("chevron"))),
+				}, () => resolveNode(props.startControlIcon, slots.startControlIcon) || h(AccordionChevron, getStyles("chevron"))),
 				h("div", {
 					...getStyles("container"),
 					ref: scroller.ref,
@@ -8931,7 +8945,7 @@ var Scroller = withBoxProps(defineComponent({
 					"data-hidden": !showEnd || void 0,
 					"aria-label": "Scroll right",
 					tabindex: showEnd ? 0 : -1
-				}, () => renderContent$3(props.endControlIcon) || h(AccordionChevron, getStyles("chevron")))
+				}, () => resolveNode(props.endControlIcon, slots.endControlIcon) || h(AccordionChevron, getStyles("chevron")))
 			]);
 		};
 	}
@@ -9910,8 +9924,9 @@ function getDigitParts({ value, decimalScale, fixedDecimalScale }) {
 	const dotIdx = str.indexOf(".");
 	const intStr = dotIdx >= 0 ? str.slice(0, dotIdx) : str;
 	const fracStr = dotIdx >= 0 ? str.slice(dotIdx + 1) : "";
+	const roundedToZero = !/[1-9]/.test(str);
 	return {
-		negative: value < 0,
+		negative: value < 0 && !roundedToZero,
 		intDigits: intStr.split(""),
 		fracDigits: fracStr ? fracStr.split("") : [],
 		hasDecimal: dotIdx >= 0
@@ -10257,11 +10272,12 @@ Object.assign(RollingNumber, {
 //#region src/components/Timeline/Timeline.context.ts
 var [provideTimelineContext, useTimelineContext] = createSafeContext("Timeline component was not found in tree");
 var Timeline_module_default = {
-	root: "_root_x5q16_1",
-	itemTitle: "_itemTitle_x5q16_17",
-	item: "_item_x5q16_17",
-	itemBullet: "_itemBullet_x5q16_84",
-	itemBody: "_itemBody_x5q16_139"
+	root: "_root_1p5xp_1",
+	itemTitle: "_itemTitle_1p5xp_19",
+	item: "_item_1p5xp_19",
+	itemBullet: "_itemBullet_1p5xp_96",
+	itemBody: "_itemBody_1p5xp_159",
+	itemOpposite: "_itemOpposite_1p5xp_199"
 };
 //#endregion
 //#region src/components/Timeline/TimelineItem/TimelineItem.ts
@@ -10298,6 +10314,14 @@ var TimelineItem = withBoxProps(defineComponent({
 			type: null,
 			default: void 0
 		},
+		opposite: {
+			type: null,
+			default: void 0
+		},
+		alternate: {
+			type: Boolean,
+			default: false
+		},
 		radius: {
 			type: [String, Number],
 			default: void 0
@@ -10348,6 +10372,7 @@ var TimelineItem = withBoxProps(defineComponent({
 			const lineActive = props.lineActive ?? props.__lineActive;
 			const bullet = resolveNode(props.bullet, slots.bullet);
 			const title = resolveNode(props.title, slots.title);
+			const opposite = resolveNode(props.opposite, slots.opposite);
 			const stylesApiProps = {
 				className: props.className ?? attrs.class,
 				props
@@ -10356,7 +10381,8 @@ var TimelineItem = withBoxProps(defineComponent({
 				...attrs,
 				mod: [{
 					lineActive,
-					active
+					active,
+					alternate: props.alternate
 				}, props.mod],
 				...ctx.getStyles("item", {
 					...stylesApiProps,
@@ -10368,14 +10394,18 @@ var TimelineItem = withBoxProps(defineComponent({
 						...attrs.style
 					}
 				})
-			}, () => [h(Box, {
-				...ctx.getStyles("itemBullet", { props }),
-				mod: {
-					withChild: hasNode(bullet),
-					align: props.__align,
-					active
-				}
-			}, () => bullet), h("div", ctx.getStyles("itemBody", { props }), [hasNode(title) ? h("div", ctx.getStyles("itemTitle", { props }), title) : null, h("div", ctx.getStyles("itemContent", { props }), slots.default?.())])]);
+			}, () => [
+				h(Box, {
+					...ctx.getStyles("itemBullet", { props }),
+					mod: {
+						withChild: hasNode(bullet),
+						align: props.__align,
+						active
+					}
+				}, () => bullet),
+				hasNode(opposite) ? h("div", ctx.getStyles("itemOpposite", { props }), opposite) : null,
+				h("div", ctx.getStyles("itemBody", { props }), [hasNode(title) ? h("div", ctx.getStyles("itemTitle", { props }), title) : null, h("div", ctx.getStyles("itemContent", { props }), slots.default?.())])
+			]);
 		};
 	}
 }));
@@ -10471,6 +10501,10 @@ var TimelineBase = defineComponent({
 		provideTimelineContext({ getStyles });
 		return () => {
 			const children = (slots.default?.() ?? []).filter(Boolean);
+			const hasOpposite = children.some((item) => {
+				const childSlots = item.children;
+				return item.props?.opposite != null || childSlots?.opposite != null;
+			});
 			const active = props.active ?? defaultProps$28.active;
 			const items = children.map((item, index) => cloneVNode(item, {
 				unstyled: props.unstyled,
@@ -10480,7 +10514,10 @@ var TimelineBase = defineComponent({
 			}, true));
 			return h(Box, {
 				...attrs,
-				mod: [{ align: props.align }, props.mod],
+				mod: [{
+					align: props.align,
+					opposite: hasOpposite
+				}, props.mod],
 				...getStyles("root", {
 					className: attrs.class,
 					style: attrs.style
@@ -16264,7 +16301,6 @@ var Tabs_module_default = {
 var VALUE_ERROR = "Tabs.Tab or Tabs.Panel component was rendered with invalid value or without value";
 var defaultProps$13 = {
 	keepMounted: true,
-	keepMountedMode: "activity",
 	orientation: "horizontal",
 	loop: true,
 	activateTabWithKeyboard: true,
@@ -16346,10 +16382,6 @@ var TabsBase = defineComponent({
 			type: Boolean,
 			default: void 0
 		},
-		keepMountedMode: {
-			type: String,
-			default: void 0
-		},
 		autoContrast: {
 			type: Boolean,
 			default: void 0
@@ -16425,9 +16457,6 @@ var TabsBase = defineComponent({
 			get keepMounted() {
 				return props.keepMounted;
 			},
-			get keepMountedMode() {
-				return props.keepMountedMode;
-			},
 			get placement() {
 				return props.placement;
 			},
@@ -16639,6 +16668,7 @@ var TextareaAutosize = defineComponent({
 var Textarea = defineComponent({
 	name: "Textarea",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		autosize: {
 			type: Boolean,
@@ -16687,7 +16717,7 @@ var Textarea = defineComponent({
 				__staticSelector: props.__staticSelector || "Textarea",
 				multiline: true,
 				"data-no-overflow": shouldAutosize && props.maxRows === void 0 ? true : void 0,
-				__bottomSection: props.bottomSection,
+				__bottomSection: resolveNode(props.bottomSection, slots.bottomSection),
 				__bottomSectionProps: props.bottomSectionProps,
 				style: [{ "--input-resize": props.resize }, attrs.style],
 				...autosizeProps
@@ -17070,7 +17100,11 @@ var PasswordInput = defineComponent({
 			const hasError = props.error !== void 0 ? Boolean(props.error) && typeof props.error !== "boolean" : Boolean(slots.error);
 			const hasDescription = props.description !== void 0 ? props.description !== null : Boolean(slots.description);
 			const describedBy = `${hasError ? errorId : ""} ${hasDescription ? descriptionId : ""}`.trim() || void 0;
-			const VisibilityToggleIcon = props.visibilityToggleIcon || PasswordToggleIcon;
+			const renderVisibilityToggleIcon = () => {
+				if (props.visibilityToggleIcon) return h(props.visibilityToggleIcon, { reveal: visible.value });
+				if (slots.visibilityToggleIcon) return slots.visibilityToggleIcon({ reveal: visible.value });
+				return h(PasswordToggleIcon, { reveal: visible.value });
+			};
 			const visibilityToggleButton = h(ActionIcon, {
 				...getStyles("visibilityToggle"),
 				...props.visibilityToggleButtonProps,
@@ -17099,7 +17133,7 @@ var PasswordInput = defineComponent({
 						toggleVisibility();
 					}
 				}
-			}, () => h(VisibilityToggleIcon, { reveal: visible.value }));
+			}, renderVisibilityToggleIcon);
 			return h(Input.Wrapper, {
 				...props.wrapperProps,
 				id,
@@ -20274,16 +20308,17 @@ var StepperBase = defineComponent({
 			const items = [];
 			steps.forEach((item, index) => {
 				const itemProps = item.props ?? {};
+				const itemSlots = item.children ?? {};
 				const state = props.active === index ? "stepProgress" : props.active > index ? "stepCompleted" : "stepInactive";
 				const selectable = typeof props.onStepClick === "function" && (typeof itemProps.allowStepSelect === "boolean" ? itemProps.allowStepSelect : state === "stepCompleted" || props.allowNextStepsSelect);
 				items.push(cloneVNode(item, {
-					icon: itemProps.icon ?? props.icon ?? (slots.icon ? (payload) => slots.icon(payload) : index + 1),
+					icon: itemSlots.icon ? itemProps.icon : itemProps.icon ?? props.icon ?? (slots.icon ? (payload) => slots.icon(payload) : index + 1),
 					step: index,
 					state,
 					onClick: () => selectable && props.onStepClick?.(index),
 					allowStepClick: selectable,
-					completedIcon: itemProps.completedIcon ?? props.completedIcon ?? (slots.completedIcon ? (payload) => slots.completedIcon(payload) : void 0),
-					progressIcon: itemProps.progressIcon ?? props.progressIcon ?? (slots.progressIcon ? (payload) => slots.progressIcon(payload) : void 0),
+					completedIcon: itemSlots.completedIcon ? itemProps.completedIcon : itemProps.completedIcon ?? props.completedIcon ?? (slots.completedIcon ? (payload) => slots.completedIcon(payload) : void 0),
+					progressIcon: itemSlots.progressIcon ? itemProps.progressIcon : itemProps.progressIcon ?? props.progressIcon ?? (slots.progressIcon ? (payload) => slots.progressIcon(payload) : void 0),
 					color: itemProps.color ?? props.color,
 					iconSize: props.iconSize,
 					iconPosition: itemProps.iconPosition ?? props.iconPosition,
@@ -20739,9 +20774,154 @@ Object.assign(TableOfContents, {
 	classes: TableOfContents_module_default,
 	varsResolver: varsResolver$14
 });
-var FloatingWindow_module_default = { root: "_root_kejg3_1" };
+//#endregion
+//#region src/components/FloatingWindow/FloatingWindow.context.ts
+var [provideFloatingWindowContext, useFloatingWindowContext] = createSafeContext("FloatingWindow.ResizeHandle must be used within FloatingWindow");
+//#endregion
+//#region src/components/FloatingWindow/FloatingWindowResizeHandle.ts
+var KEYBOARD_STEP = 10;
+function clampDimension$1(value, min, max, viewportMax) {
+	let result = value;
+	if (min != null) result = Math.max(result, min);
+	if (max != null) result = Math.min(result, max);
+	if (viewportMax != null) result = Math.min(result, viewportMax);
+	return result;
+}
+var FloatingWindowResizeHandle = withBoxProps(defineComponent({
+	name: "FloatingWindowResizeHandle",
+	inheritAttrs: false,
+	props: {
+		ariaLabel: {
+			type: String,
+			default: "Resize window"
+		},
+		tabindex: {
+			type: Number,
+			default: 0
+		},
+		onKeydown: Function
+	},
+	setup(props, { attrs, slots }) {
+		const ctx = useFloatingWindowContext();
+		let handle = null;
+		let isResizing = false;
+		let startX = 0;
+		let startY = 0;
+		let startWidth = 0;
+		let startHeight = 0;
+		const hasWidth = () => ctx.dimensions?.initialWidth != null || ctx.dimensions?.minWidth != null || ctx.dimensions?.maxWidth != null;
+		const hasHeight = () => ctx.dimensions?.initialHeight != null || ctx.dimensions?.minHeight != null || ctx.dimensions?.maxHeight != null;
+		const applySize = (width, height) => {
+			const root = ctx.rootRef.value;
+			if (!root || width === null && height === null) return;
+			const rect = root.getBoundingClientRect();
+			const offset = ctx.constrainOffset ?? 0;
+			const maxViewportWidth = ctx.constrainToViewport ? window.innerWidth - rect.left - offset : void 0;
+			const maxViewportHeight = ctx.constrainToViewport ? window.innerHeight - rect.top - offset : void 0;
+			if (width !== null) root.style.width = `${clampDimension$1(width, ctx.dimensions?.minWidth, ctx.dimensions?.maxWidth, maxViewportWidth)}px`;
+			if (height !== null) root.style.height = `${clampDimension$1(height, ctx.dimensions?.minHeight, ctx.dimensions?.maxHeight, maxViewportHeight)}px`;
+			const resized = root.getBoundingClientRect();
+			if (width !== null) handle?.setAttribute("aria-valuenow", String(Math.round(resized.width)));
+			ctx.onSizeChange?.({
+				width: resized.width,
+				height: resized.height
+			});
+		};
+		const end = () => {
+			if (!isResizing) return;
+			isResizing = false;
+			document.body.style.userSelect = "";
+			document.body.style.webkitUserSelect = "";
+			ctx.onResizeEnd?.();
+			document.removeEventListener("mousemove", move);
+			document.removeEventListener("mouseup", end);
+			document.removeEventListener("touchmove", move);
+			document.removeEventListener("touchend", end);
+			document.removeEventListener("touchcancel", end);
+		};
+		const move = (event) => {
+			if (!isResizing) return;
+			event.preventDefault();
+			const point = "touches" in event ? event.touches[0] : event;
+			applySize(hasWidth() ? startWidth + point.clientX - startX : null, hasHeight() ? startHeight + point.clientY - startY : null);
+		};
+		const start = (event) => {
+			if ("button" in event && event.button !== 0) return;
+			event.stopPropagation();
+			event.preventDefault();
+			if (!hasWidth() && !hasHeight()) return;
+			const root = ctx.rootRef.value;
+			if (!root) return;
+			const point = "touches" in event ? event.touches[0] : event;
+			const rect = root.getBoundingClientRect();
+			startX = point.clientX;
+			startY = point.clientY;
+			startWidth = rect.width;
+			startHeight = rect.height;
+			isResizing = true;
+			document.body.style.userSelect = "none";
+			document.body.style.webkitUserSelect = "none";
+			ctx.onResizeStart?.();
+			document.addEventListener("mousemove", move);
+			document.addEventListener("mouseup", end);
+			document.addEventListener("touchmove", move, { passive: false });
+			document.addEventListener("touchend", end);
+			document.addEventListener("touchcancel", end);
+		};
+		const onKeydown = (event) => {
+			props.onKeydown?.(event);
+			if (event.defaultPrevented) return;
+			const root = ctx.rootRef.value;
+			if (!root) return;
+			const rect = root.getBoundingClientRect();
+			let width = null;
+			let height = null;
+			if (event.key === "ArrowRight" && hasWidth()) width = rect.width + KEYBOARD_STEP;
+			else if (event.key === "ArrowLeft" && hasWidth()) width = rect.width - KEYBOARD_STEP;
+			else if (event.key === "ArrowDown" && hasHeight()) height = rect.height + KEYBOARD_STEP;
+			else if (event.key === "ArrowUp" && hasHeight()) height = rect.height - KEYBOARD_STEP;
+			else if (event.key === "Home") {
+				if (hasWidth()) width = ctx.dimensions?.minWidth ?? rect.width;
+				if (hasHeight()) height = ctx.dimensions?.minHeight ?? rect.height;
+			} else if (event.key === "End") {
+				if (hasWidth()) width = ctx.dimensions?.maxWidth ?? rect.width;
+				if (hasHeight()) height = ctx.dimensions?.maxHeight ?? rect.height;
+			}
+			if (width !== null || height !== null) {
+				event.preventDefault();
+				applySize(width, height);
+			}
+		};
+		onMounted(() => {
+			if (hasWidth() && ctx.dimensions?.initialWidth != null) handle?.setAttribute("aria-valuenow", String(Math.round(clampDimension$1(ctx.dimensions.initialWidth, ctx.dimensions.minWidth, ctx.dimensions.maxWidth, void 0))));
+		});
+		onBeforeUnmount(end);
+		return () => h(Box, {
+			...attrs,
+			ref: (node) => {
+				handle = node?.$el ?? node;
+			},
+			role: "separator",
+			"aria-label": attrs["aria-label"] ?? props.ariaLabel,
+			"aria-valuemin": ctx.dimensions?.minWidth,
+			"aria-valuemax": ctx.dimensions?.maxWidth,
+			tabindex: props.tabindex,
+			style: [{ touchAction: "none" }, attrs.style],
+			onMousedown: start,
+			onTouchstart: start,
+			onKeydown
+		}, () => slots.default?.());
+	}
+}));
+var FloatingWindow_module_default = { root: "_root_mstr0_1" };
 //#endregion
 //#region src/components/FloatingWindow/FloatingWindow.ts
+function clampDimension(value, min, max) {
+	let result = value;
+	if (min != null) result = Math.max(result, min);
+	if (max != null) result = Math.min(result, max);
+	return result;
+}
 var defaultProps$7 = {
 	constrainToViewport: true,
 	withinPortal: true,
@@ -20807,6 +20987,22 @@ var FloatingWindow = defineComponent({
 			type: [String, Number],
 			default: void 0
 		},
+		dimensions: {
+			type: Object,
+			default: void 0
+		},
+		onSizeChange: {
+			type: Function,
+			default: void 0
+		},
+		onResizeStart: {
+			type: Function,
+			default: void 0
+		},
+		onResizeEnd: {
+			type: Function,
+			default: void 0
+		},
 		shadow: {
 			type: String,
 			default: void 0
@@ -20843,6 +21039,7 @@ var FloatingWindow = defineComponent({
 	setup(rawProps, { attrs, slots, expose }) {
 		const props = useProps("FloatingWindow", defaultProps$7, rawProps);
 		const floating = useFloatingWindow(props);
+		const rootRef = ref(null);
 		assignRef(props.setPositionRef, floating.setPosition);
 		expose({ setPosition: floating.setPosition });
 		const getStyles = useStyles({
@@ -20856,12 +21053,37 @@ var FloatingWindow = defineComponent({
 			vars: props.vars,
 			unstyled: props.unstyled
 		});
+		provideFloatingWindowContext({
+			rootRef,
+			get dimensions() {
+				return props.dimensions;
+			},
+			get constrainToViewport() {
+				return props.constrainToViewport;
+			},
+			get constrainOffset() {
+				return props.constrainOffset;
+			},
+			get onSizeChange() {
+				return props.onSizeChange;
+			},
+			get onResizeStart() {
+				return props.onResizeStart;
+			},
+			get onResizeEnd() {
+				return props.onResizeEnd;
+			}
+		});
 		return () => h(OptionalPortal, {
 			withinPortal: props.withinPortal,
 			...props.portalProps
 		}, () => h(Paper, {
 			...attrs,
-			ref: ((value) => floating.ref(value?.$el ?? value)),
+			ref: ((value) => {
+				const node = value?.$el ?? value;
+				rootRef.value = node;
+				floating.ref(node);
+			}),
 			shadow: props.shadow,
 			radius: props.radius,
 			withBorder: props.withBorder,
@@ -20872,13 +21094,20 @@ var FloatingWindow = defineComponent({
 			}),
 			style: [
 				getStyles("root").style,
-				{ "--floating-window-z-index": String(props.zIndex) },
+				{
+					"--floating-window-z-index": String(props.zIndex),
+					"--floating-window-width": props.dimensions?.initialWidth == null ? void 0 : `${clampDimension(props.dimensions.initialWidth, props.dimensions.minWidth, props.dimensions.maxWidth)}px`,
+					"--floating-window-height": props.dimensions?.initialHeight == null ? void 0 : `${clampDimension(props.dimensions.initialHeight, props.dimensions.minHeight, props.dimensions.maxHeight)}px`
+				},
 				attrs.style
 			]
 		}, () => slots.default?.()));
 	}
 });
-Object.assign(FloatingWindow, { classes: FloatingWindow_module_default });
+Object.assign(FloatingWindow, {
+	classes: FloatingWindow_module_default,
+	ResizeHandle: FloatingWindowResizeHandle
+});
 //#endregion
 //#region src/components/Slider/Slider.context.ts
 var [provideSliderContext, useSliderContext] = createSafeContext("SliderProvider was not found in tree");
@@ -21221,15 +21450,15 @@ var Track = defineComponent({
 	}
 });
 var Slider_module_default = {
-	root: "_root_16d42_1",
-	label: "_label_16d42_39",
-	thumb: "_thumb_16d42_65",
-	trackContainer: "_trackContainer_16d42_131",
-	track: "_track_16d42_131",
-	bar: "_bar_16d42_187",
-	markWrapper: "_markWrapper_16d42_215",
-	mark: "_mark_16d42_215",
-	markLabel: "_markLabel_16d42_257"
+	root: "_root_1osrz_1",
+	label: "_label_1osrz_39",
+	thumb: "_thumb_1osrz_65",
+	trackContainer: "_trackContainer_1osrz_131",
+	track: "_track_1osrz_131",
+	bar: "_bar_1osrz_187",
+	markWrapper: "_markWrapper_1osrz_215",
+	mark: "_mark_1osrz_215",
+	markLabel: "_markLabel_1osrz_257"
 };
 //#endregion
 //#region src/components/Slider/Slider/Slider.ts
@@ -21466,7 +21695,7 @@ var Slider = withBoxProps(defineComponent({
 				max: domain.value[1]
 			});
 			const scaled = props.scale(current.value);
-			const label = slots.label ? slots.label({ value: scaled }) : typeof props.label === "function" ? props.label(scaled) : props.label;
+			const label = rawProps.label !== void 0 ? typeof props.label === "function" ? props.label(scaled) : props.label : slots.label?.({ value: scaled }) ?? (typeof props.label === "function" ? props.label(scaled) : props.label);
 			const start = typeof props.startPointValue === "number" && !props.inverted ? getPosition$1({
 				value: props.startPointValue,
 				min: domain.value[0],
@@ -21799,10 +22028,10 @@ var RangeSlider = defineComponent({
 				value: props.scale(current.value[index]),
 				position: positions[index],
 				dragging: move.active.value && activeThumb.value === index,
-				label: slots.label ? slots.label({
+				label: rawProps.label !== void 0 ? typeof props.label === "function" ? props.label(props.scale(current.value[index])) : props.label : slots.label?.({
 					value: props.scale(current.value[index]),
 					index
-				}) : typeof props.label === "function" ? props.label(props.scale(current.value[index])) : props.label,
+				}) ?? (typeof props.label === "function" ? props.label(props.scale(current.value[index])) : props.label),
 				labelAlwaysOn: props.labelAlwaysOn,
 				thumbLabel: props.thumbLabel?.[index],
 				thumbValueText: props.thumbValueText,
@@ -21813,7 +22042,7 @@ var RangeSlider = defineComponent({
 				onMousedown: () => activeThumb.value = index,
 				onFocus: () => focused.value = index,
 				onKeydown: (event) => keydown(index, event)
-			}, () => slots.thumbChildren ? slots.thumbChildren({ index }) : props.thumbChildren?.[index])) }), props.name ? [h("input", {
+			}, () => props.thumbChildren !== void 0 ? props.thumbChildren[index] : slots.thumbChildren?.({ index }))) }), props.name ? [h("input", {
 				type: "hidden",
 				name: `${props.name}_from`,
 				value: current.value[0],
@@ -24089,6 +24318,7 @@ function flattenChildren$1(children) {
 var SplitterBase = defineComponent({
 	name: "Splitter",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		orientation: {
 			type: String,
@@ -24235,7 +24465,7 @@ var SplitterBase = defineComponent({
 						...getStyles("thumb"),
 						"data-orientation": props.orientation,
 						"data-active": splitter.activeHandle === handleIndex || void 0
-					}, [props.handleIcon !== void 0 ? props.handleIcon : h(props.orientation === "vertical" ? GripHorizontalIcon : GripVerticalIcon)]) : void 0));
+					}, [props.handleIcon !== void 0 || slots.handleIcon ? resolveNode(props.handleIcon, slots.handleIcon) : h(props.orientation === "vertical" ? GripHorizontalIcon : GripVerticalIcon)]) : void 0));
 				}
 				items.push(cloneVNode(child, {
 					key: `pane-${index}`,
@@ -24495,7 +24725,10 @@ var TreeNode = defineComponent({
 	},
 	setup(props) {
 		const element = ref(null);
-		const hasChildren = () => Array.isArray(props.node.children) || !!props.node.hasChildren && !Array.isArray(props.node.children);
+		const hasChildren = () => {
+			const hasLoadedChildren = Array.isArray(props.node.children) && props.node.children.length > 0;
+			return hasLoadedChildren || !!props.node.hasChildren && !hasLoadedChildren;
+		};
 		const expanded = () => props.controller.expandedState.value[props.node.value] || false;
 		const dnd = useTreeNodeDragDrop({
 			nodeValue: props.node.value,
@@ -24511,13 +24744,20 @@ var TreeNode = defineComponent({
 			if (event.code === "ArrowRight") {
 				event.stopPropagation();
 				event.preventDefault();
-				if (expanded()) element.value?.querySelector("[role=treeitem]")?.focus();
-				else if (hasChildren()) props.controller.expand(props.node.value);
+				if (expanded()) {
+					const nextNode = element.value?.querySelector("[role=treeitem]");
+					nextNode?.setAttribute("data-focus-ring", "true");
+					nextNode?.focus();
+				} else if (hasChildren()) props.controller.expand(props.node.value);
 			} else if (event.code === "ArrowLeft") {
 				event.stopPropagation();
 				event.preventDefault();
 				if (expanded() && hasChildren()) props.controller.collapse(props.node.value);
-				else if (props.isSubtree) element.value?.parentElement?.closest("[role=treeitem]")?.focus();
+				else if (props.isSubtree) {
+					const parentNode = element.value?.parentElement?.closest("[role=treeitem]");
+					parentNode?.setAttribute("data-focus-ring", "true");
+					parentNode?.focus();
+				}
 			} else if (event.code === "ArrowDown" || event.code === "ArrowUp") {
 				const root = element.value?.closest("[data-tree-root]");
 				if (!root || !element.value) return;
@@ -24526,6 +24766,7 @@ var TreeNode = defineComponent({
 				const nodes = Array.from(root.querySelectorAll("[role=treeitem]")).filter((node) => visible(node, root));
 				const index = nodes.indexOf(element.value);
 				const next = nodes[event.code === "ArrowDown" ? index + 1 : index - 1];
+				next?.setAttribute("data-focus-ring", "true");
 				next?.focus();
 				if (event.shiftKey && next) props.controller.setSelectedState(getValuesRange(props.controller.anchorNode.value, next.dataset.value, props.flatValues));
 			} else if (event.code === "Space") {
@@ -24610,6 +24851,10 @@ var TreeNode = defineComponent({
 				"data-level": props.level,
 				tabindex: props.rootIndex === 0 ? 0 : -1,
 				onKeydown,
+				onBlur: (event) => {
+					const currentTarget = event.currentTarget;
+					if (!currentTarget.contains(event.relatedTarget)) currentTarget.removeAttribute("data-focus-ring");
+				},
 				ref: element
 			}, [
 				label,
@@ -24870,12 +25115,12 @@ function useTree(input = {}) {
 	};
 }
 var Tree_module_default = {
-	root: "_root_42z3r_7",
-	subtree: "_subtree_42z3r_13",
-	node: "_node_42z3r_18",
-	label: "_label_42z3r_26",
-	flatLine: "_flatLine_42z3r_125",
-	flatLineClosing: "_flatLineClosing_42z3r_151"
+	root: "_root_ea12t_7",
+	subtree: "_subtree_ea12t_13",
+	node: "_node_ea12t_18",
+	label: "_label_ea12t_27",
+	flatLine: "_flatLine_ea12t_126",
+	flatLineClosing: "_flatLineClosing_ea12t_152"
 };
 //#endregion
 //#region src/components/Tree/Tree.ts
@@ -24886,6 +25131,7 @@ var varsResolver$8 = createVarsResolver((_, { levelOffset }) => ({ root: { "--le
 var Tree = withBoxProps(defineComponent({
 	name: "Tree",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		component: {
 			type: [
@@ -25001,7 +25247,7 @@ var Tree = withBoxProps(defineComponent({
 		onBeforeUnmount(() => document.removeEventListener("mousedown", outside));
 		return () => {
 			const flatValues = getFlatValues(props.data);
-			const renderNode = props.renderNode || (slots.node ? (payload) => slots.node?.(payload) : void 0);
+			const renderNode = props.renderNode || (slots.renderNode ? (payload) => slots.renderNode?.(payload) : slots.node ? (payload) => slots.node?.(payload) : void 0);
 			const nodes = props.data.map((node, index) => h(TreeNode, {
 				key: node.value,
 				node,
@@ -25288,7 +25534,7 @@ function filterTreeData(data, query, filter = defaultTreeNodeFilter) {
 function flattenTo$1(acc, data, state, parent, level, ancestorIsLast) {
 	data.forEach((node, index) => {
 		const isLast = index === data.length - 1;
-		const loaded = Array.isArray(node.children);
+		const loaded = Array.isArray(node.children) && node.children.length > 0;
 		const hasChildren = loaded || !!node.hasChildren && !loaded;
 		const expanded = state[node.value] || false;
 		const linesPath = [];
@@ -25782,6 +26028,10 @@ var ModalRoot = defineComponent({
 			type: Function,
 			required: true
 		},
+		keepMounted: {
+			type: Boolean,
+			default: false
+		},
 		centered: Boolean,
 		fullScreen: Boolean,
 		radius: [String, Number],
@@ -25844,6 +26094,7 @@ var ModalRoot = defineComponent({
 			...attrs,
 			opened: props.opened,
 			onClose: props.onClose,
+			keepMounted: props.keepMounted,
 			unstyled: props.unstyled,
 			...getStyles("root"),
 			mod: {
@@ -25898,6 +26149,10 @@ var ModalBaseComponent = defineComponent({
 			type: Function,
 			required: true
 		},
+		keepMounted: {
+			type: Boolean,
+			default: false
+		},
 		title: {
 			type: null,
 			default: void 0
@@ -25920,7 +26175,8 @@ var ModalBaseComponent = defineComponent({
 			return h(ModalRoot, {
 				...attrs,
 				opened: props.opened,
-				onClose: props.onClose
+				onClose: props.onClose,
+				keepMounted: props.keepMounted
 			}, { default: () => [props.withOverlay && h(ModalOverlay, props.overlayProps), h(ModalContent, null, { default: () => [header && h(ModalHeader, null, { default: () => [hasNode(title) && h(ModalTitle, null, { default: () => title }), props.withCloseButton && h(ModalCloseButton, props.closeButtonProps)] }), h(ModalBody, null, { default: () => slots.default?.() })] })] });
 		};
 	}
@@ -26045,6 +26301,10 @@ var DrawerRoot = defineComponent({
 			type: Function,
 			required: true
 		},
+		keepMounted: {
+			type: Boolean,
+			default: false
+		},
 		position: {
 			type: String,
 			default: "left"
@@ -26104,6 +26364,7 @@ var DrawerRoot = defineComponent({
 			...attrs,
 			opened: props.opened,
 			onClose: props.onClose,
+			keepMounted: props.keepMounted,
 			unstyled: props.unstyled,
 			...getStyles("root"),
 			transitionProps: {
@@ -26162,6 +26423,10 @@ var DrawerBaseComponent = defineComponent({
 			type: Function,
 			required: true
 		},
+		keepMounted: {
+			type: Boolean,
+			default: false
+		},
 		title: {
 			type: null,
 			default: void 0
@@ -26219,6 +26484,7 @@ var DrawerBaseComponent = defineComponent({
 				...attrs,
 				opened: props.opened,
 				onClose: props.onClose,
+				keepMounted: props.keepMounted,
 				zIndex: resolvedZIndex.value,
 				...stackProps.value
 			}, { default: () => [props.withOverlay && h(DrawerOverlay, {
@@ -26420,7 +26686,7 @@ function useDelayedHover(input) {
 }
 //#endregion
 //#region src/utils/Floating/use-context-menu-handlers.ts
-function call$3(handler, event) {
+function call$4(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((item) => typeof item === "function" && item(event));
 	else if (typeof handler === "function") handler(event);
 }
@@ -26472,11 +26738,11 @@ function useContextMenuHandlers(options) {
 	});
 	return {
 		onMousedown: (event) => {
-			call$3(options.childProps.onMousedown ?? options.childProps.onMouseDown, event);
+			call$4(options.childProps.onMousedown ?? options.childProps.onMouseDown, event);
 			if (!options.disabled && event.button === 2) event.stopPropagation();
 		},
 		onContextmenu: (event) => {
-			call$3(options.childProps.onContextmenu ?? options.childProps.onContextMenu, event);
+			call$4(options.childProps.onContextmenu ?? options.childProps.onContextMenu, event);
 			if (options.disabled || event.defaultPrevented) return;
 			event.preventDefault();
 			if (gestureHandled.value) return;
@@ -26484,19 +26750,19 @@ function useContextMenuHandlers(options) {
 			if (touchActive.value) gestureHandled.value = true;
 		},
 		onTouchstart: (event) => {
-			call$3(options.childProps.onTouchstart ?? options.childProps.onTouchStart, event);
+			call$4(options.childProps.onTouchstart ?? options.childProps.onTouchStart, event);
 			longPress.onTouchstart?.(event);
 		},
 		onTouchend: (event) => {
-			call$3(options.childProps.onTouchend ?? options.childProps.onTouchEnd, event);
+			call$4(options.childProps.onTouchend ?? options.childProps.onTouchEnd, event);
 			longPress.onTouchend?.(event);
 		},
 		onTouchcancel: (event) => {
-			call$3(options.childProps.onTouchcancel ?? options.childProps.onTouchCancel, event);
+			call$4(options.childProps.onTouchcancel ?? options.childProps.onTouchCancel, event);
 			longPress.onTouchcancel?.(event);
 		},
 		onTouchmove: (event) => {
-			call$3(options.childProps.onTouchmove ?? options.childProps.onTouchMove, event);
+			call$4(options.childProps.onTouchmove ?? options.childProps.onTouchMove, event);
 			longPress.onTouchmove?.(event);
 		},
 		style: options.disabled ? options.childProps.style : {
@@ -26552,7 +26818,7 @@ function one$3(slots, name) {
 	if (children.length !== 1) throw new Error(`${name} component children should be a single element or component that accepts ref`);
 	return children[0];
 }
-function call$2(handler, event) {
+function call$3(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((fn) => fn?.(event));
 	else handler?.(event);
 }
@@ -26592,7 +26858,7 @@ var PopoverTarget = defineComponent({
 			});
 			if (!ctx.controlled) forwarded.onClick = (event) => {
 				ctx.onToggle();
-				call$2(childProps.onClick, event);
+				call$3(childProps.onClick, event);
 			};
 			return cloneVNode(child, forwarded, true);
 		};
@@ -26668,7 +26934,7 @@ var PopoverDropdown = defineComponent({
 			"data-position": ctx.placement,
 			"data-fixed": ctx.floatingStrategy === "fixed" || void 0,
 			onKeydownCapture: (event) => {
-				call$2(attrs.onKeydownCapture, event);
+				call$3(attrs.onKeydownCapture, event);
 				if (event.key === "Escape" && ctx.closeOnEscape) {
 					ctx.onClose();
 					ctx.onDismiss?.();
@@ -27504,7 +27770,7 @@ var Tooltip = Object.assign(TooltipBase, {
 var [provideHoverCardContext, useHoverCardContext] = createSafeContext("HoverCard component was not found in the tree");
 //#endregion
 //#region src/components/HoverCard/HoverCardDropdown/HoverCardDropdown.ts
-function call$1(handler, event) {
+function call$2(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((fn) => fn?.(event));
 	else handler?.(event);
 }
@@ -27516,11 +27782,11 @@ var HoverCardDropdown = defineComponent({
 		return () => h(PopoverDropdown, {
 			...attrs,
 			onMouseenter: (event) => {
-				call$1(attrs.onMouseenter ?? attrs.onMouseEnter, event);
+				call$2(attrs.onMouseenter ?? attrs.onMouseEnter, event);
 				ctx.openDropdown();
 			},
 			onMouseleave: (event) => {
-				call$1(attrs.onMouseleave ?? attrs.onMouseLeave, event);
+				call$2(attrs.onMouseleave ?? attrs.onMouseLeave, event);
 				ctx.closeDropdown();
 			}
 		}, slots);
@@ -27723,7 +27989,7 @@ var Menu_module_default = {
 };
 //#endregion
 //#region src/components/Menu/Menu.ts
-function call(handler, event) {
+function call$1(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((fn) => fn?.(event));
 	else handler?.(event);
 }
@@ -27844,6 +28110,9 @@ var MenuBase = defineComponent({
 			get hasSearch() {
 				return searchCount.value > 0;
 			},
+			get withInitialFocusPlaceholder() {
+				return props.withInitialFocusPlaceholder;
+			},
 			registerSearch: () => {
 				searchCount.value += 1;
 				return () => {
@@ -27943,7 +28212,7 @@ var MenuDropdown = defineComponent({
 			onMouseenter: ctx.trigger !== "click" ? ctx.openDropdown : void 0,
 			onMouseleave: ctx.trigger !== "click" ? ctx.closeDropdown : void 0,
 			onKeydown: (event) => {
-				call(attrs.onKeydown, event);
+				call$1(attrs.onKeydown, event);
 				if (event.defaultPrevented || ctx.hasSearch) return;
 				const root = event.currentTarget;
 				const active = document.activeElement;
@@ -27966,7 +28235,13 @@ var MenuDropdown = defineComponent({
 					menuItems(root).find((item) => item.textContent?.trim().toLowerCase().startsWith(query))?.focus();
 				}
 			}
-		}, slots);
+		}, () => [ctx.withInitialFocusPlaceholder && !ctx.hasSearch ? h("div", {
+			role: "presentation",
+			tabindex: -1,
+			"data-autofocus": true,
+			"data-mantine-stop-propagation": true,
+			style: { outline: 0 }
+		}) : null, slots.default?.()]);
 	}
 });
 var MenuItem = defineComponent({
@@ -28025,7 +28300,7 @@ var MenuItem = defineComponent({
 				}),
 				onMousedown: (event) => event.preventDefault(),
 				onClick: (event) => {
-					call(attrs.onClick, event);
+					call$1(attrs.onClick, event);
 					if (!props.disabled && !attrs["data-disabled"] && (props.closeMenuOnClick ?? ctx.closeOnItemClick)) ctx.closeDropdownImmediately();
 				}
 			}, () => [
@@ -28127,16 +28402,16 @@ var MenuSearch = defineComponent({
 					}
 				},
 				onInput: (event) => {
-					call(attrs.onInput, event);
-					call(attrs.onChange, event);
+					call$1(attrs.onInput, event);
+					call$1(attrs.onChange, event);
 					clearActive(event.currentTarget.closest("[data-menu-dropdown]"));
 				},
 				onChange: (event) => {
-					call(attrs.onChange, event);
+					call$1(attrs.onChange, event);
 					clearActive(event.currentTarget.closest("[data-menu-dropdown]"));
 				},
 				onKeydown: (event) => {
-					call(attrs.onKeydown ?? attrs.onKeyDown, event);
+					call$1(attrs.onKeydown ?? attrs.onKeyDown, event);
 					if (event.defaultPrevented) return;
 					const root = event.currentTarget.closest("[data-menu-dropdown]");
 					const items = menuItems(root);
@@ -28409,13 +28684,13 @@ var MenuSubTarget = defineComponent({
 			const childProps = child.props ?? {};
 			return cloneVNode(child, {
 				onClick: (event) => {
-					call(childProps.onClick, event);
+					call$1(childProps.onClick, event);
 					ctx.toggleDropdown();
 				},
 				onMouseenter: ctx.openDropdown,
 				onMouseleave: ctx.closeDropdown,
 				onKeydown: (event) => {
-					call(childProps.onKeydown ?? childProps.onKeyDown, event);
+					call$1(childProps.onKeydown ?? childProps.onKeyDown, event);
 					if (event.defaultPrevented) return;
 					if (event.key === "ArrowRight") {
 						event.preventDefault();
@@ -28435,7 +28710,7 @@ var MenuSubDropdown = defineComponent({
 		return () => h(MenuDropdown, {
 			...attrs,
 			onKeydown: (event) => {
-				call(attrs.onKeydown, event);
+				call$1(attrs.onKeydown, event);
 				if (event.defaultPrevented) return;
 				const currentDropdown = event.currentTarget;
 				const focused = event.target;
@@ -29917,7 +30192,8 @@ var OptionsDropdown = defineComponent({
 		return () => {
 			validateOptions(props.data);
 			const renderOption = props.renderOption ?? (slots.renderOption ? (input) => slots.renderOption(input) : void 0);
-			const nothingFound = props.nothingFoundMessage ?? (slots.nothingFound ? slots.nothingFound() : void 0);
+			const nothingFoundSlot = slots.nothingFoundMessage ?? slots.nothingFound;
+			const nothingFound = props.nothingFoundMessage ?? (nothingFoundSlot ? nothingFoundSlot() : void 0);
 			const data = typeof props.search === "string" ? (props.filter || defaultOptionsFilter)({
 				options: props.data,
 				search: props.filterOptions ? props.search : "",
@@ -30281,8 +30557,8 @@ var ComboboxPopoverBase = defineComponent({
 			}
 			if (props.searchable) handleSearchChange("");
 		};
-		const resolveRenderOption = () => props.renderOption ?? (slots.option ? (input) => slots.option(input) : void 0);
-		const resolveNothingFound = () => resolveNode(props.nothingFoundMessage, slots.nothingFound);
+		const resolveRenderOption = () => props.renderOption ?? (slots.renderOption ?? slots.option ? (input) => (slots.renderOption ?? slots.option)(input) : void 0);
+		const resolveNothingFound = () => resolveNode(props.nothingFoundMessage, slots.nothingFoundMessage ?? slots.nothingFound);
 		const renderSearchableDropdown = () => {
 			const filteredData = (props.filter || defaultOptionsFilter)({
 				options: parsedData.value,
@@ -31134,7 +31410,7 @@ var Select = defineComponent({
 				scrollAreaProps: props.scrollAreaProps
 			}, {
 				renderOption: slots.renderOption,
-				nothingFound: slots.nothingFound
+				nothingFound: slots.nothingFoundMessage ?? slots.nothingFound
 			})]), h(Combobox.HiddenInput, {
 				value: current(),
 				name: attrs.name,
@@ -31496,12 +31772,13 @@ var MultiSelect = defineComponent({
 						label: String(item)
 					};
 					const onRemove = () => remove(item);
-					return props.renderPill ? props.renderPill({
+					const renderPillInput = {
 						option,
 						value: item,
 						onRemove,
 						disabled
-					}) : h(Pill, {
+					};
+					return props.renderPill ? props.renderPill(renderPillInput) : slots.renderPill ? slots.renderPill(renderPillInput) : h(Pill, {
 						key: `${String(item)}-${index}`,
 						withRemoveButton: !readOnly && !option.disabled,
 						disabled,
@@ -31540,7 +31817,7 @@ var MultiSelect = defineComponent({
 				filter: props.filter,
 				limit: props.limit,
 				filterOptions: props.searchable,
-				hiddenWhenEmpty: props.nothingFoundMessage == null && !slots.nothingFound,
+				hiddenWhenEmpty: props.nothingFoundMessage == null && !slots.nothingFoundMessage && !slots.nothingFound,
 				nothingFoundMessage: props.nothingFoundMessage,
 				value: values,
 				withCheckIcon: props.withCheckIcon,
@@ -31552,7 +31829,7 @@ var MultiSelect = defineComponent({
 				scrollAreaProps: props.scrollAreaProps
 			}, {
 				renderOption: slots.renderOption,
-				nothingFound: slots.nothingFound
+				nothingFound: slots.nothingFoundMessage ?? slots.nothingFound
 			})]), h(Combobox.HiddenInput, {
 				value: values,
 				valuesDivider: props.hiddenInputValuesDivider,
@@ -31771,17 +32048,17 @@ var TagsInput = defineComponent({
 				rightSection: slots.rightSection,
 				default: () => h(Pill.Group, null, () => [...current.map((item, index) => {
 					const onRemove = () => removeAt(index);
-					const option = lockup.value[item] ?? {
-						value: item,
-						label: item,
-						disabled: false
-					};
-					return props.renderPill ? props.renderPill({
-						option,
+					const renderPillInput = {
+						option: lockup.value[item] ?? {
+							value: item,
+							label: item,
+							disabled: false
+						},
 						value: item,
 						onRemove,
 						disabled
-					}) : h(Pill, {
+					};
+					return props.renderPill ? props.renderPill(renderPillInput) : slots.renderPill ? slots.renderPill(renderPillInput) : h(Pill, {
 						key: `${item}-${index}`,
 						withRemoveButton: !readOnly,
 						disabled,
@@ -31832,7 +32109,7 @@ var TagsInput = defineComponent({
 				search: search(),
 				filter: props.filter,
 				limit: props.limit,
-				hiddenWhenEmpty: props.nothingFoundMessage == null && !slots.nothingFound,
+				hiddenWhenEmpty: props.nothingFoundMessage == null && !slots.nothingFoundMessage && !slots.nothingFound,
 				nothingFoundMessage: props.nothingFoundMessage,
 				withScrollArea: props.withScrollArea,
 				maxDropdownHeight: props.maxDropdownHeight,
@@ -31840,7 +32117,7 @@ var TagsInput = defineComponent({
 				scrollAreaProps: props.scrollAreaProps
 			}, {
 				renderOption: slots.renderOption,
-				nothingFound: slots.nothingFound
+				nothingFound: slots.nothingFoundMessage ?? slots.nothingFound
 			})]), h(Combobox.HiddenInput, {
 				value: current,
 				valuesDivider: props.hiddenInputValuesDivider,
@@ -31902,6 +32179,7 @@ var ColorInput_module_default = {
 var ColorInput = defineComponent({
 	name: "ColorInput",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		modelValue: String,
 		value: String,
@@ -31996,7 +32274,7 @@ var ColorInput = defineComponent({
 				class: ColorInput_module_default.eyeDropperButton,
 				"aria-label": "Pick color from screen",
 				onClick: useEyeDropper
-			}, () => props.eyeDropperIcon ?? h(EyeDropperIcon, { class: ColorInput_module_default.eyeDropperIcon })) : void 0;
+			}, () => resolveNode(props.eyeDropperIcon, slots.eyeDropperIcon) ?? h(EyeDropperIcon, { class: ColorInput_module_default.eyeDropperIcon })) : void 0;
 			return h(Popover, {
 				position: "bottom-start",
 				offset: 5,
@@ -32079,7 +32357,7 @@ function flattenTo(acc, data, expandedSet, parent, level, parentGuides) {
 	for (let i = 0; i < data.length; i++) {
 		const node = data[i];
 		const isLast = i === data.length - 1;
-		const hasLoadedChildren = Array.isArray(node.children);
+		const hasLoadedChildren = Array.isArray(node.children) && node.children.length > 0;
 		const hasAsyncChildren = !!node.hasChildren && !hasLoadedChildren;
 		const hasChildren = hasLoadedChildren || hasAsyncChildren;
 		const expanded = expandedSet.has(node.value);
@@ -32192,6 +32470,11 @@ var TreeSelectOption = defineComponent({
 			const paddingInlineStart = BASE_PADDING + (props.level - 1) * LEVEL_OFFSET + (props.withLines && props.level > 1 ? LINE_CONTENT_GAP : 0) + (!props.hasChildren ? OPTION_GAP : 0);
 			const isActive = props.selected || props.checked;
 			const ariaChecked = props.showCheckbox ? props.indeterminate && !props.checked ? "mixed" : props.checked : void 0;
+			const expand = (event) => {
+				event?.preventDefault();
+				event?.stopPropagation();
+				if (props.hasChildren) props.onToggleExpand?.(props.node.value);
+			};
 			const payload = {
 				node: props.node,
 				level: props.level,
@@ -32199,7 +32482,8 @@ var TreeSelectOption = defineComponent({
 				hasChildren: props.hasChildren,
 				selected: props.selected,
 				checked: props.checked,
-				indeterminate: props.indeterminate
+				indeterminate: props.indeterminate,
+				expand
 			};
 			const lineElements = props.withLines && props.level > 1 ? [
 				...props.lineGuides.map((show, g) => show ? h("span", {
@@ -32242,16 +32526,10 @@ var TreeSelectOption = defineComponent({
 					"aria-label": props.expanded ? props.chevronAriaLabels?.collapse ?? "Collapse" : props.chevronAriaLabels?.expand ?? "Expand",
 					onMousedown: (event) => event.preventDefault(),
 					onClick: (event) => {
-						event.preventDefault();
-						event.stopPropagation();
-						props.onToggleExpand?.(props.node.value);
+						expand(event);
 					},
 					onKeydown: (event) => {
-						if (event.key === "Enter") {
-							event.preventDefault();
-							event.stopPropagation();
-							props.onToggleExpand?.(props.node.value);
-						}
+						if (event.key === "Enter") expand(event);
 					}
 				}, h(AccordionChevron, { size: "80%" })) : null,
 				props.showCheckbox ? h(CheckboxIndicator, {
@@ -32466,7 +32744,8 @@ var TreeSelect = defineComponent({
 			const multiValues = selectedArray();
 			const hasValue = isMulti() ? multiValues.length > 0 : current() != null;
 			const canClear = props.clearable && hasValue && !disabled && !readOnly;
-			const nothingFound = props.nothingFoundMessage ?? (slots.nothingFound ? slots.nothingFound() : void 0);
+			const nothingFoundSlot = slots.nothingFoundMessage ?? slots.nothingFound;
+			const nothingFound = props.nothingFoundMessage ?? (nothingFoundSlot ? nothingFoundSlot() : void 0);
 			const renderNode = props.renderNode ?? (slots.renderNode ? (payload) => slots.renderNode(payload) : void 0);
 			const clear = (event) => {
 				event.stopPropagation();
@@ -32605,7 +32884,581 @@ Object.assign(TreeSelect, { classes: {
 	...Combobox.classes,
 	...TreeSelect_module_default
 } });
+var Cascader_module_default = {
+	columnsList: "_columnsList_1xc8g_1",
+	column: "_column_1xc8g_1",
+	columnScroll: "_columnScroll_1xc8g_21",
+	columnsOverflow: "_columnsOverflow_1xc8g_26",
+	columnOption: "_columnOption_1xc8g_78",
+	flatOption: "_flatOption_1xc8g_127",
+	columnOptionLabel: "_columnOptionLabel_1xc8g_134",
+	columnOptionIcon: "_columnOptionIcon_1xc8g_141",
+	columnOptionCheck: "_columnOptionCheck_1xc8g_160",
+	columnEmpty: "_columnEmpty_1xc8g_172"
+};
+//#endregion
+//#region src/components/Cascader/cascader-utils.ts
+function cascaderOptionHasChildren(option) {
+	return Array.isArray(option.children) && option.children.length > 0;
+}
+function getCascaderColumns(data, activePath) {
+	const columns = [data];
+	let level = data;
+	for (let index = 0; index < activePath.length; index++) {
+		const node = level.find((option) => option.value === activePath[index]);
+		if (!node) break;
+		if (cascaderOptionHasChildren(node) && index < activePath.length - 1) {
+			columns.push(node.children);
+			level = node.children;
+		} else break;
+	}
+	return columns;
+}
+function getCascaderPathOptions(data, value) {
+	if (!value?.length) return [];
+	const result = [];
+	let level = data;
+	for (const current of value) {
+		const option = level?.find((item) => item.value === current);
+		if (!option) break;
+		result.push(option);
+		level = option.children;
+	}
+	return result;
+}
+function flattenCascaderPaths(data) {
+	const result = [];
+	const walk = (nodes, parentPath, parentOptions, parentDisabled) => {
+		nodes.forEach((node) => {
+			const path = [...parentPath, node.value];
+			const options = [...parentOptions, node];
+			const disabled = parentDisabled || !!node.disabled;
+			const leaf = !cascaderOptionHasChildren(node);
+			result.push({
+				path,
+				options,
+				leaf,
+				disabled
+			});
+			if (!leaf) walk(node.children, path, options, disabled);
+		});
+	};
+	walk(data, [], [], false);
+	return result;
+}
+//#endregion
+//#region src/components/Cascader/Cascader.ts
+var optionLabelToString = (option) => typeof option.label === "string" || typeof option.label === "number" ? String(option.label) : option.value;
+var pathsEqual = (first, second) => !!first && !!second && first.length === second.length && first.every((item, index) => item === second[index]);
+var findEnabledIndex = (options, from, direction) => {
+	let index = from + direction;
+	while (index >= 0 && index < options.length) {
+		if (!options[index].disabled) return index;
+		index += direction;
+	}
+	return -1;
+};
+var call = (handler, event) => {
+	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
+	else if (typeof handler === "function") handler(event);
+};
+var Cascader = defineComponent({
+	name: "Cascader",
+	inheritAttrs: false,
+	slots: Object,
+	props: {
+		data: {
+			type: Array,
+			required: true
+		},
+		modelValue: Array,
+		value: Array,
+		defaultValue: Array,
+		onChange: Function,
+		changeOnSelect: Boolean,
+		closeOnSelect: {
+			type: Boolean,
+			default: void 0
+		},
+		allowDeselect: {
+			type: Boolean,
+			default: true
+		},
+		withCheckIcon: {
+			type: Boolean,
+			default: true
+		},
+		checkIconPosition: {
+			type: String,
+			default: "right"
+		},
+		withColumns: {
+			type: Boolean,
+			default: true
+		},
+		expandTrigger: {
+			type: String,
+			default: "click"
+		},
+		searchable: Boolean,
+		searchValue: String,
+		defaultSearchValue: String,
+		onSearchChange: Function,
+		filter: Function,
+		renderSearchOption: Function,
+		formatValue: Function,
+		renderOption: Function,
+		separator: {
+			type: null,
+			default: void 0
+		},
+		columnWidth: {
+			type: [Number, String],
+			default: 200
+		},
+		maxDisplayedLevels: {
+			type: Number,
+			default: 3
+		},
+		previousLevelsControlLabel: {
+			type: String,
+			default: "Show previous levels"
+		},
+		nextLevelsControlLabel: {
+			type: String,
+			default: "Show next levels"
+		},
+		maxDropdownHeight: {
+			type: [Number, String],
+			default: 260
+		},
+		nothingFoundMessage: {
+			type: null,
+			default: void 0
+		},
+		clearable: Boolean,
+		clearSectionMode: {
+			type: String,
+			default: "both"
+		},
+		clearButtonProps: Object,
+		onClear: Function,
+		dropdownOpened: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultDropdownOpened: Boolean,
+		onDropdownOpen: Function,
+		onDropdownClose: Function,
+		comboboxProps: Object,
+		scrollAreaProps: Object,
+		chevronColor: String,
+		hiddenInputProps: Object,
+		openOnFocus: {
+			type: Boolean,
+			default: true
+		},
+		readOnly: Boolean,
+		disabled: Boolean,
+		size: {
+			type: [String, Number],
+			default: "sm"
+		},
+		classNames: [Object, Function],
+		styles: [Object, Function],
+		unstyled: Boolean
+	},
+	emits: ["update:modelValue", "update:searchValue"],
+	setup(props, { attrs, emit, slots }) {
+		const id = useId(attrs.id);
+		const internalValue = ref(props.defaultValue ?? null);
+		const currentValue = computed(() => props.modelValue ?? props.value ?? internalValue.value);
+		const pathOptions = computed(() => getCascaderPathOptions(props.data, currentValue.value));
+		const separatorString = computed(() => typeof props.separator === "string" || typeof props.separator === "number" ? String(props.separator) : "/");
+		const separatorContent = () => resolveNode(props.separator, slots.separator) ?? "/";
+		const nothingFoundContent = () => resolveNode(props.nothingFoundMessage, slots.nothingFoundMessage ?? slots.nothingFound);
+		const displayString = computed(() => {
+			if (!currentValue.value || pathOptions.value.length === 0) return "";
+			const formatted = props.formatValue?.({
+				value: currentValue.value,
+				options: pathOptions.value
+			});
+			if (typeof formatted === "string" || typeof formatted === "number") return String(formatted);
+			return pathOptions.value.map(optionLabelToString).join(` ${separatorString.value} `);
+		});
+		const internalSearch = ref(props.defaultSearchValue ?? (props.searchable && props.defaultValue ? getCascaderPathOptions(props.data, props.defaultValue).map(optionLabelToString).join(` ${separatorString.value} `) : ""));
+		const search = computed(() => props.searchValue ?? internalSearch.value);
+		const activePath = ref(currentValue.value ? [...currentValue.value] : []);
+		const keyboardNav = ref(false);
+		const windowOffset = ref(0);
+		const canInteract = computed(() => !props.readOnly && !props.disabled);
+		const shouldCloseOnSelect = computed(() => props.closeOnSelect ?? !props.allowDeselect);
+		const setSearch = (value) => {
+			if (props.searchValue === void 0) internalSearch.value = value;
+			props.onSearchChange?.(value);
+			emit("update:searchValue", value);
+		};
+		const setValue = (value) => {
+			if (props.modelValue === void 0 && props.value === void 0) internalValue.value = value;
+			props.onChange?.(value, getCascaderPathOptions(props.data, value));
+			emit("update:modelValue", value);
+		};
+		const resetActivePath = () => {
+			activePath.value = currentValue.value ? [...currentValue.value] : [];
+		};
+		const combobox = useCombobox({
+			opened: () => props.dropdownOpened,
+			defaultOpened: props.defaultDropdownOpened,
+			onDropdownOpen: () => {
+				props.onDropdownOpen?.();
+				resetActivePath();
+			},
+			onDropdownClose: () => {
+				props.onDropdownClose?.();
+				if (props.searchable) setSearch(currentValue.value ? displayString.value : "");
+			}
+		});
+		watch(currentValue, (value) => {
+			if (props.searchable) setSearch(value ? displayString.value : "");
+		}, { deep: true });
+		watch(activePath, () => windowOffset.value = 0, { deep: true });
+		const selectPath = (path) => {
+			setValue(props.allowDeselect && pathsEqual(currentValue.value, path) ? null : path);
+		};
+		const expandOption = (level, option) => {
+			const optionPath = [...activePath.value.slice(0, level), option.value];
+			if (cascaderOptionHasChildren(option)) {
+				const first = findEnabledIndex(option.children, -1, 1);
+				activePath.value = first >= 0 ? [...optionPath, option.children[first].value] : optionPath;
+			} else activePath.value = optionPath;
+		};
+		const finishSelection = () => {
+			if (shouldCloseOnSelect.value) combobox.closeDropdown("mouse");
+		};
+		const handleOptionClick = (level, option) => {
+			if (option.disabled) return;
+			keyboardNav.value = false;
+			const path = [...activePath.value.slice(0, level), option.value];
+			if (cascaderOptionHasChildren(option)) {
+				if (props.changeOnSelect) {
+					selectPath(path);
+					finishSelection();
+				}
+				expandOption(level, option);
+			} else {
+				selectPath(path);
+				finishSelection();
+			}
+		};
+		const handleOptionMouseEnter = (level, option) => {
+			if (option.disabled) return;
+			keyboardNav.value = false;
+			if (props.expandTrigger !== "hover") return;
+			if (cascaderOptionHasChildren(option)) expandOption(level, option);
+			else activePath.value = [...activePath.value.slice(0, level), option.value];
+		};
+		const flatPaths = computed(() => flattenCascaderPaths(props.data));
+		const isSearching = computed(() => props.searchable && search.value.trim().length > 0 && search.value !== displayString.value);
+		const showFlatList = computed(() => isSearching.value || !props.withColumns);
+		const flatListItems = computed(() => {
+			const base = flatPaths.value.filter((path) => props.changeOnSelect || path.leaf);
+			if (!isSearching.value) return base;
+			return base.filter((path) => props.filter ? props.filter(search.value, path.options) : path.options.map(optionLabelToString).join(` ${separatorString.value} `).toLowerCase().includes(search.value.trim().toLowerCase()));
+		});
+		const renderSearchLabel = (options) => {
+			if (props.renderSearchOption) return props.renderSearchOption(search.value, options);
+			if (slots.renderSearchOption) return slots.renderSearchOption({
+				query: search.value,
+				options
+			});
+			return options.flatMap((option, index) => [index ? h("span", { "data-cascader-separator": true }, [
+				" ",
+				separatorContent(),
+				" "
+			]) : null, option.label ?? option.value]);
+		};
+		const renderFlatList = () => h(Combobox.Options, { "aria-label": typeof attrs.label === "string" ? attrs.label : void 0 }, () => [h(ScrollArea.Autosize, {
+			mah: props.maxDropdownHeight,
+			type: "scroll",
+			scrollbarSize: "var(--combobox-padding)",
+			offsetScrollbars: "y",
+			...props.scrollAreaProps
+		}, () => flatListItems.value.map((item, index) => {
+			const selected = pathsEqual(currentValue.value, item.path);
+			return h(Combobox.Option, {
+				value: index,
+				active: selected,
+				disabled: item.disabled
+			}, () => h("span", { class: Cascader_module_default.flatOption }, [
+				selected && props.withCheckIcon && props.checkIconPosition === "left" ? h(CheckIcon, { class: Cascader_module_default.columnOptionCheck }) : null,
+				h("span", { class: Cascader_module_default.columnOptionLabel }, [renderSearchLabel(item.options)]),
+				selected && props.withCheckIcon && props.checkIconPosition !== "left" ? h(CheckIcon, { class: Cascader_module_default.columnOptionCheck }) : null
+			]));
+		})), flatListItems.value.length === 0 && (props.nothingFoundMessage !== void 0 || slots.nothingFoundMessage || slots.nothingFound) ? h(Combobox.Empty, {}, nothingFoundContent) : null]);
+		const optionId = (level, value) => id.value ? `${id.value}-cascader-list-${level}-${value}` : void 0;
+		const renderColumns = () => {
+			const allColumns = getCascaderColumns(props.data, activePath.value);
+			const totalColumns = allColumns.length;
+			const maxLevels = props.maxDisplayedLevels > 0 ? props.maxDisplayedLevels : totalColumns;
+			const maxOffset = Math.max(0, totalColumns - maxLevels);
+			const clampedOffset = Math.min(windowOffset.value, maxOffset);
+			const windowStart = Math.max(0, maxOffset - clampedOffset);
+			const windowEnd = Math.min(totalColumns, windowStart + maxLevels);
+			const visibleColumns = allColumns.slice(windowStart, windowEnd);
+			const hiddenBefore = windowStart;
+			const hiddenAfter = totalColumns - windowEnd;
+			const focusedLevel = activePath.value.length - 1;
+			const overflowControl = (position) => h(UnstyledButton, {
+				class: Cascader_module_default.columnsOverflow,
+				"data-position": position,
+				tabindex: -1,
+				"aria-label": position === "start" ? props.previousLevelsControlLabel : props.nextLevelsControlLabel,
+				title: position === "start" ? props.previousLevelsControlLabel : props.nextLevelsControlLabel,
+				onMousedown: (event) => event.preventDefault(),
+				onClick: () => {
+					windowOffset.value = position === "start" ? Math.min(maxOffset, windowOffset.value + 1) : Math.max(0, windowOffset.value - 1);
+				}
+			}, () => h(AccordionChevron));
+			return h("div", {
+				class: Cascader_module_default.columnsList,
+				role: "presentation",
+				onMouseleave: () => {
+					if (props.expandTrigger === "hover") resetActivePath();
+				},
+				onMousemove: () => keyboardNav.value = false
+			}, [
+				hiddenBefore > 0 ? overflowControl("start") : null,
+				...visibleColumns.map((options, index) => {
+					const level = windowStart + index;
+					const isLast = index === visibleColumns.length - 1 && hiddenAfter === 0;
+					return h("div", {
+						class: Cascader_module_default.column,
+						"data-last": isLast || void 0,
+						style: {
+							width: typeof props.columnWidth === "number" ? `${props.columnWidth}px` : props.columnWidth,
+							minWidth: typeof props.columnWidth === "number" ? `${props.columnWidth}px` : props.columnWidth
+						}
+					}, [h(ScrollArea.Autosize, {
+						class: Cascader_module_default.columnScroll,
+						mah: props.maxDropdownHeight,
+						type: "scroll",
+						scrollbarSize: "var(--combobox-padding)",
+						role: "listbox",
+						...props.scrollAreaProps
+					}, () => options.length ? options.map((option) => {
+						const active = activePath.value[level] === option.value;
+						const current = active && level === focusedLevel && keyboardNav.value;
+						const inPath = active && level < focusedLevel;
+						const selected = !!currentValue.value && currentValue.value.length === level + 1 && currentValue.value[level] === option.value;
+						return h(UnstyledButton, {
+							id: optionId(level, option.value),
+							class: Cascader_module_default.columnOption,
+							role: "option",
+							tabindex: -1,
+							"aria-selected": current || void 0,
+							"aria-disabled": option.disabled || void 0,
+							"data-active": current || void 0,
+							"data-in-path": inPath || void 0,
+							"data-selected": selected || void 0,
+							"data-disabled": option.disabled || void 0,
+							onMousedown: (event) => event.preventDefault(),
+							onClick: () => handleOptionClick(level, option),
+							onMouseenter: () => handleOptionMouseEnter(level, option)
+						}, () => [
+							selected && props.withCheckIcon && props.checkIconPosition === "left" ? h(CheckIcon, { class: Cascader_module_default.columnOptionCheck }) : null,
+							h("span", { class: Cascader_module_default.columnOptionLabel }, [props.renderOption ? props.renderOption(option, level) : slots.renderOption?.({
+								option,
+								level
+							}) ?? option.label ?? option.value]),
+							selected && props.withCheckIcon && props.checkIconPosition !== "left" ? h(CheckIcon, { class: Cascader_module_default.columnOptionCheck }) : null,
+							cascaderOptionHasChildren(option) ? h("span", { class: Cascader_module_default.columnOptionIcon }, h(AccordionChevron)) : null
+						]);
+					}) : h("div", { class: Cascader_module_default.columnEmpty }, [nothingFoundContent()]))]);
+				}),
+				hiddenAfter > 0 ? overflowControl("end") : null
+			]);
+		};
+		const handleColumnsKeyDown = (event) => {
+			keyboardNav.value = true;
+			const columns = getCascaderColumns(props.data, activePath.value);
+			const focusedLevel = Math.max(0, activePath.value.length - 1);
+			const currentColumn = columns[focusedLevel] ?? columns[0] ?? [];
+			const focusedIndex = currentColumn.findIndex((item) => item.value === activePath.value[focusedLevel]);
+			const focusedOption = focusedIndex >= 0 ? currentColumn[focusedIndex] : void 0;
+			if (event.key === "ArrowDown") {
+				const next = findEnabledIndex(currentColumn, focusedIndex, 1);
+				if (next >= 0) activePath.value = [...activePath.value.slice(0, focusedLevel), currentColumn[next].value];
+				return true;
+			}
+			if (event.key === "ArrowUp") {
+				const previous = findEnabledIndex(currentColumn, focusedIndex < 0 ? currentColumn.length : focusedIndex, -1);
+				if (previous >= 0) activePath.value = [...activePath.value.slice(0, focusedLevel), currentColumn[previous].value];
+				return true;
+			}
+			if (event.key === "ArrowRight") {
+				if (focusedOption && cascaderOptionHasChildren(focusedOption)) expandOption(focusedLevel, focusedOption);
+				return true;
+			}
+			if (event.key === "ArrowLeft") {
+				if (activePath.value.length > 1) activePath.value = activePath.value.slice(0, -1);
+				return true;
+			}
+			if (event.key === "Enter" && focusedOption) {
+				const path = [...activePath.value.slice(0, focusedLevel), focusedOption.value];
+				if (cascaderOptionHasChildren(focusedOption)) {
+					if (props.changeOnSelect) {
+						selectPath(path);
+						finishSelection();
+					}
+					expandOption(focusedLevel, focusedOption);
+				} else {
+					selectPath(path);
+					finishSelection();
+				}
+				return true;
+			}
+			return false;
+		};
+		const handleKeydown = (event) => {
+			call(attrs.onKeydown, event);
+			if (event.defaultPrevented) return;
+			if (event.key === "Escape") {
+				combobox.closeDropdown("keyboard");
+				return;
+			}
+			if (showFlatList.value || !canInteract.value) return;
+			if (!combobox.dropdownOpened) {
+				if ([
+					"ArrowDown",
+					"ArrowUp",
+					"ArrowRight",
+					"Enter"
+				].includes(event.key) || !props.searchable && event.key === " ") {
+					event.preventDefault();
+					keyboardNav.value = true;
+					combobox.openDropdown("keyboard");
+					if (!currentValue.value && (event.key === "ArrowDown" || event.key === "ArrowUp")) {
+						const rootIndex = event.key === "ArrowDown" ? findEnabledIndex(props.data, -1, 1) : findEnabledIndex(props.data, props.data.length, -1);
+						if (rootIndex >= 0) activePath.value = [props.data[rootIndex].value];
+					}
+				}
+				return;
+			}
+			if (handleColumnsKeyDown(event)) event.preventDefault();
+			else if (!props.searchable && event.key === " ") event.preventDefault();
+		};
+		return () => {
+			const inputAttrs = { ...attrs };
+			delete inputAttrs.name;
+			delete inputAttrs.onKeydown;
+			delete inputAttrs.onFocus;
+			delete inputAttrs.onBlur;
+			delete inputAttrs.onClick;
+			delete inputAttrs.onInput;
+			const clearButton = h(Combobox.ClearButton, {
+				...props.clearButtonProps,
+				onMousedown: (event) => event.preventDefault(),
+				onClick: () => {
+					props.onClear?.();
+					setValue(null);
+					activePath.value = [];
+					setSearch("");
+					combobox.focusTarget();
+				}
+			});
+			const hasValue = !!currentValue.value?.length;
+			const listId = id.value ? `${id.value}-cascader-list` : void 0;
+			const focusedLevel = activePath.value.length - 1;
+			const activeDescendant = keyboardNav.value && focusedLevel >= 0 ? optionId(focusedLevel, activePath.value[focusedLevel]) : void 0;
+			return h("div", { style: { display: "contents" } }, [h(Combobox, {
+				store: combobox,
+				__staticSelector: "Cascader",
+				classNames: props.classNames,
+				styles: props.styles,
+				unstyled: props.unstyled,
+				readOnly: props.readOnly,
+				size: String(props.size),
+				width: showFlatList.value ? "target" : "max-content",
+				position: "bottom-start",
+				...props.comboboxProps,
+				onOptionSubmit: (raw) => {
+					const item = flatListItems.value[Number(raw)];
+					if (!item || item.disabled) return;
+					selectPath(item.path);
+					activePath.value = [...item.path];
+					finishSelection();
+				}
+			}, { default: () => [h(Combobox.Target, {
+				targetType: props.searchable ? "input" : "button",
+				withKeyboardNavigation: showFlatList.value
+			}, () => h(InputBase, {
+				...inputAttrs,
+				id: id.value,
+				__staticSelector: "Cascader",
+				size: props.size,
+				classNames: props.classNames,
+				styles: props.styles,
+				unstyled: props.unstyled,
+				disabled: props.disabled,
+				readonly: props.readOnly || !props.searchable,
+				pointer: !props.searchable,
+				value: props.searchable ? search.value : displayString.value,
+				"aria-controls": listId,
+				"aria-activedescendant": activeDescendant,
+				__defaultRightSection: h(Combobox.Chevron, {
+					size: String(props.size),
+					color: props.chevronColor
+				}),
+				__clearSection: clearButton,
+				__clearable: props.clearable && hasValue && !props.disabled && !props.readOnly,
+				__clearSectionMode: props.clearSectionMode,
+				rightSectionPointerEvents: attrs.rightSectionPointerEvents || "none",
+				onInput: (event) => {
+					setSearch(event.target.value);
+					if (canInteract.value) combobox.openDropdown("keyboard");
+				},
+				onFocus: (event) => {
+					if (props.openOnFocus && props.searchable && canInteract.value) combobox.openDropdown("keyboard");
+					call(attrs.onFocus, event);
+				},
+				onBlur: (event) => {
+					combobox.closeDropdown("unknown");
+					call(attrs.onBlur, event);
+				},
+				onClick: (event) => {
+					if (canInteract.value) {
+						keyboardNav.value = false;
+						if (props.searchable) combobox.openDropdown("mouse");
+						else combobox.toggleDropdown("mouse");
+					}
+					call(attrs.onClick, event);
+				},
+				onKeydown: handleKeydown
+			}, {
+				label: slots.label,
+				description: slots.description,
+				error: slots.error,
+				leftSection: slots.leftSection,
+				rightSection: slots.rightSection
+			})), h(Combobox.Dropdown, {
+				hidden: props.readOnly || props.disabled,
+				style: showFlatList.value ? void 0 : { padding: 0 }
+			}, () => showFlatList.value ? renderFlatList() : renderColumns())] }), h(Combobox.HiddenInput, {
+				name: attrs.name,
+				form: attrs.form,
+				disabled: props.disabled,
+				value: currentValue.value,
+				...props.hiddenInputProps
+			})]);
+		};
+	}
+});
+Object.assign(Cascader, { classes: {
+	...InputBase.classes,
+	...Combobox.classes,
+	...Cascader_module_default
+} });
 //#endregion
-export { Accordion, AccordionChevron, AccordionControl, AccordionItem, AccordionPanel, ActionIcon, ActionIconGroup, ActionIconGroupSection, Affix, Alert, AlphaSlider, Anchor, AngleSlider, AppShell, AppShellAside, AppShellFooter, AppShellHeader, AppShellMain, AppShellNavbar, AppShellSection, AspectRatio, Autocomplete, Avatar, AvatarGroup, AvatarGroupContextKey, BackgroundImage, Badge, Bars, Blockquote, Box, Breadcrumbs, Burger, Button, ButtonGroup, ButtonGroupSection, Card, CardSection, Center, CheckIcon, Checkbox, CheckboxCard, CheckboxGroup, CheckboxIcon, CheckboxIndicator, Chip, ChipGroup, CloseButton, CloseIcon, Code, Collapse, ColorInput, ColorPicker, ColorSlider, ColorSwatch, Combobox, ComboboxChevron, ComboboxClearButton, ComboboxDropdown, ComboboxDropdownTarget, ComboboxEmpty, ComboboxEventsTarget, ComboboxFooter, ComboboxGroup, ComboboxHeader, ComboboxHiddenInput, ComboboxOption, ComboboxOptions, ComboboxPopover, ComboboxPopoverTarget, ComboboxSearch, ComboboxTarget, Container, CopyButton, DEFAULT_COLORS, DEFAULT_THEME, DataList, DataListItem, DataListItemLabel, DataListItemValue, Dialog, DirectionContextKey, DirectionProvider, Divider, Dots, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerHeader, DrawerOverlay, DrawerRoot, DrawerStack, DrawerTitle, EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIndicator, EmptyStateTitle, FLEX_STYLE_PROPS_DATA, Fieldset, FileButton, FileInput, FlatTreeNode, Flex, FloatingIndicator, FloatingWindow, FocusTrap, FocusTrapInitialFocus, Grid, GridCol, Group, HeadlessMantineProvider, Highlight, HoverCard, HoverCardDropdown, HoverCardGroup, HoverCardTarget, HueSlider, INVALID_PRIMARY_COLOR_ERROR, INVALID_PRIMARY_SHADE_ERROR, Image, Indicator, InlineStyles, Input, InputBase, InputClearButton, InputClearSection, InputDescription, InputError, InputLabel, InputPlaceholder, InputWrapper, JsonInput, Kbd, List, ListItem, Loader, LoadingOverlay, MantineClasses, MantineContextKey, MantineCssVariables, MantineProvider, MantineThemeKey, MantineThemeProvider, Mark, Marquee, MaskInput, Menu, MenuCheckboxGroup, MenuCheckboxItem, MenuContextMenu, MenuDivider, MenuDropdown, MenuItem, MenuLabel, MenuRadioGroup, MenuRadioItem, MenuSearch, MenuSub, MenuSubDropdown, MenuSubItem, MenuSubTarget, MenuTarget, Menubar, MenubarDropdown, MenubarMenu, MenubarTarget, Modal, ModalBase, ModalBaseBody, ModalBaseCloseButton, ModalBaseContent, ModalBaseHeader, ModalBaseOverlay, ModalBaseTitle, ModalBody, ModalCloseButton, ModalContent, ModalHeader, ModalOverlay, ModalRoot, ModalTitle, MultiSelect, NativeScrollArea, NativeSelect, NativeSelectOption, NavLink, Notification, NumberFormatter, NumberInput, NumberInputChevron, OptionalPortal, OptionsDropdown, Oval, OverflowList, Overlay, Pagination, PaginationControl, PaginationDots, PaginationFirst, PaginationItems, PaginationItemsGroup, PaginationLabel, PaginationLast, PaginationNext, PaginationPrevious, PaginationRoot, Paper, PasswordInput, PasswordToggleIcon, Pill, PillGroup, PillsInput, PillsInputField, PinInput, Popover, PopoverContextMenu, PopoverDropdown, PopoverTarget, Portal, Progress, ProgressLabel, ProgressRoot, ProgressSection, Radio, RadioCard, RadioGroup, RadioIcon, RadioIndicator, RangeSlider, Rating, RingProgress, RollingNumber, STYLE_PROPS_DATA, ScrollArea, ScrollAreaAutosize, Scroller, SegmentedControl, Select, SemiCircleProgress, SimpleGrid, Skeleton, Slider, Space, Splitter, SplitterPane, Spoiler, Stack, Stepper, StepperCompleted, StepperStep, Switch, SwitchGroup, Table, TableCaption, TableDataRenderer, TableOfContents, TableScrollContainer, TableTbody, TableTd, TableTfoot, TableTh, TableThead, TableTr, Tabs, TabsList, TabsPanel, TabsTab, TagsInput, Text, TextInput, Textarea, ThemeIcon, Timeline, TimelineItem, Title, Tooltip, TooltipFloating, TooltipGroup, Transition, Tree, TreeSelect, TreeSelectOption, Typography, UnstyledButton, VisuallyHidden, alpha, buildValue, camelToKebabCase, colorsTuple, convertCssVariables, convertHsvaTo, createEventHandler, createProviderColorScheme, createSafeContext, createSafeInjectionContext, createScopedKeydownHandler, createVarsResolver, cssVariablesObjectToString, darken, deepMerge, defaultCssVariablesResolver, defaultLoaders, defaultOptionsFilter, defaultTreeNodeFilter, defaultVariantColorsResolver, em, factory, factory as polymorphicFactory, filterProps, filterTreeData, findClosestNumber, flattenTreeData, foldAccents, formatNumber, getVariables as getAppShellVariables, getAutoContrastValue, getBaseValue, getBreakpointValue, getContrastColor, getDefaultZIndex, getDigitParts, getFontSize, getGradient, getInitials, getInitialsColor, getLineHeight, getMarkColor, getMergedVariables, getOptionsLockup, getParsedComboboxData, getParsedNativeSelectData, getPositionVariables, getPrimaryContrastColor, getPrimaryShade, getRadius, getRenderSlots, getRenderSlotsFromValues, getSafeId, getShadow, getSize, getSortedBreakpoints, getSpacing, getSplittedTags, getThemeColor, getTitleSize, getTreeExpandedState, hasNode, hashStyleProps, highlighter, hsvaToHex, hsvaToHexa, hsvaToHsl, hsvaToRgba, hsvaToRgbaObject, isColorValid, isEmptyComboboxData, isLightColor, isNumberLike, isOptionsGroup, isPrimitive, isVirtualColor, keys, lighten, luminance, memoize, mergeAsyncChildren, mergeMantineTheme, movePill, moveTreeNode, noop, parseColor, parseHex, parseHexa, parseHsla, parseHue, parseRgba, parseStyleProps, parseThemeColor, polymorphicProps, provideGridContext, provideListContext, provideMantineContext, provideMantineTheme, providePillsInputContext, px, rem, renderPolymorphic, resolveColorScheme, resolveNode, rgba, round, toRgba, useAccordionContext, useAccordionItemContext, useAppShellContext, useAvatarGroupContext, useCheckboxCardContext, useCheckboxGroupContext, useChipGroupContext, useCombobox, useComboboxContext, useComboboxTargetProps, useComputedColorScheme, useDataListContext, useDirection, useDrawersStack, useEmptyStateContext, useFloatingIndicator, useForwardedRef, useGridContext, useHoverCardContext, useInputContext, useInputWrapperContext, useListContext, useMantineClassNamesPrefix, useMantineColorScheme, useMantineContext, useMantineCssVariablesResolver, useMantineDeduplicateInlineStyles, useMantineEnv, useMantineIsHeadless, useMantineStyleNonce, useMantineTheme, useMantineWithStaticClasses, useMenuContext, useMenubarContext, useMenubarMenuContext, usePaginationContext, usePillGroupContext, usePillsInputContext, usePillsReorder, useProgressContext, useProps, useRadioCardContext, useRadioGroupContext, useRandomClassName, useSafeMantineTheme, useScrollAreaContext, useSplitterContext, useStepperContext, useStyles, useSwitchGroupContext, useTabsContext, useTree, useVirtualizedCombobox, validateJson, validateMantineTheme, validateOptions, virtualColor, withBoxProps };
+export { Accordion, AccordionChevron, AccordionControl, AccordionItem, AccordionPanel, ActionIcon, ActionIconGroup, ActionIconGroupSection, Affix, Alert, AlphaSlider, Anchor, AngleSlider, AppShell, AppShellAside, AppShellFooter, AppShellHeader, AppShellMain, AppShellNavbar, AppShellSection, AspectRatio, Autocomplete, Avatar, AvatarGroup, AvatarGroupContextKey, BackgroundImage, Badge, Bars, Blockquote, Box, Breadcrumbs, Burger, Button, ButtonGroup, ButtonGroupSection, Card, CardSection, Cascader, Center, CheckIcon, Checkbox, CheckboxCard, CheckboxGroup, CheckboxIcon, CheckboxIndicator, Chip, ChipGroup, CloseButton, CloseIcon, Code, Collapse, ColorInput, ColorPicker, ColorSlider, ColorSwatch, Combobox, ComboboxChevron, ComboboxClearButton, ComboboxDropdown, ComboboxDropdownTarget, ComboboxEmpty, ComboboxEventsTarget, ComboboxFooter, ComboboxGroup, ComboboxHeader, ComboboxHiddenInput, ComboboxOption, ComboboxOptions, ComboboxPopover, ComboboxPopoverTarget, ComboboxSearch, ComboboxTarget, Container, CopyButton, DEFAULT_COLORS, DEFAULT_THEME, DataList, DataListItem, DataListItemLabel, DataListItemValue, Dialog, DirectionContextKey, DirectionProvider, Divider, Dots, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerHeader, DrawerOverlay, DrawerRoot, DrawerStack, DrawerTitle, EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIndicator, EmptyStateTitle, FLEX_STYLE_PROPS_DATA, Fieldset, FileButton, FileInput, FlatTreeNode, Flex, FloatingIndicator, FloatingWindow, FloatingWindowResizeHandle, FocusTrap, FocusTrapInitialFocus, Grid, GridCol, Group, HeadlessMantineProvider, Highlight, HoverCard, HoverCardDropdown, HoverCardGroup, HoverCardTarget, HueSlider, INVALID_PRIMARY_COLOR_ERROR, INVALID_PRIMARY_SHADE_ERROR, Image, Indicator, InlineStyles, Input, InputBase, InputClearButton, InputClearSection, InputDescription, InputError, InputLabel, InputPlaceholder, InputWrapper, JsonInput, Kbd, List, ListItem, Loader, LoadingOverlay, MantineClasses, MantineContextKey, MantineCssVariables, MantineProvider, MantineThemeKey, MantineThemeProvider, Mark, Marquee, MaskInput, Menu, MenuCheckboxGroup, MenuCheckboxItem, MenuContextMenu, MenuDivider, MenuDropdown, MenuItem, MenuLabel, MenuRadioGroup, MenuRadioItem, MenuSearch, MenuSub, MenuSubDropdown, MenuSubItem, MenuSubTarget, MenuTarget, Menubar, MenubarDropdown, MenubarMenu, MenubarTarget, Modal, ModalBase, ModalBaseBody, ModalBaseCloseButton, ModalBaseContent, ModalBaseHeader, ModalBaseOverlay, ModalBaseTitle, ModalBody, ModalCloseButton, ModalContent, ModalHeader, ModalOverlay, ModalRoot, ModalTitle, MultiSelect, NativeScrollArea, NativeSelect, NativeSelectOption, NavLink, Notification, NumberFormatter, NumberInput, NumberInputChevron, OptionalPortal, OptionsDropdown, Oval, OverflowList, Overlay, Pagination, PaginationControl, PaginationDots, PaginationFirst, PaginationItems, PaginationItemsGroup, PaginationLabel, PaginationLast, PaginationNext, PaginationPrevious, PaginationRoot, Paper, PasswordInput, PasswordToggleIcon, Pill, PillGroup, PillsInput, PillsInputField, PinInput, Popover, PopoverContextMenu, PopoverDropdown, PopoverTarget, Portal, Progress, ProgressLabel, ProgressRoot, ProgressSection, Radio, RadioCard, RadioGroup, RadioIcon, RadioIndicator, RangeSlider, Rating, RingProgress, RollingNumber, STYLE_PROPS_DATA, ScrollArea, ScrollAreaAutosize, Scroller, SegmentedControl, Select, SemiCircleProgress, SimpleGrid, Skeleton, Slider, Space, Splitter, SplitterPane, Spoiler, Stack, Stepper, StepperCompleted, StepperStep, Switch, SwitchGroup, Table, TableCaption, TableDataRenderer, TableOfContents, TableScrollContainer, TableTbody, TableTd, TableTfoot, TableTh, TableThead, TableTr, Tabs, TabsList, TabsPanel, TabsTab, TagsInput, Text, TextInput, Textarea, ThemeIcon, Timeline, TimelineItem, Title, Tooltip, TooltipFloating, TooltipGroup, Transition, Tree, TreeSelect, TreeSelectOption, Typography, UnstyledButton, VisuallyHidden, alpha, buildValue, camelToKebabCase, cascaderOptionHasChildren, colorsTuple, convertCssVariables, convertHsvaTo, createEventHandler, createProviderColorScheme, createSafeContext, createSafeInjectionContext, createScopedKeydownHandler, createVarsResolver, cssVariablesObjectToString, darken, deepMerge, defaultCssVariablesResolver, defaultLoaders, defaultOptionsFilter, defaultTreeNodeFilter, defaultVariantColorsResolver, em, factory, factory as polymorphicFactory, filterProps, filterTreeData, findClosestNumber, flattenCascaderPaths, flattenTreeData, foldAccents, formatNumber, getVariables as getAppShellVariables, getAutoContrastValue, getBaseValue, getBreakpointValue, getCascaderColumns, getCascaderPathOptions, getContrastColor, getDefaultZIndex, getDigitParts, getFontSize, getGradient, getInitials, getInitialsColor, getLineHeight, getMarkColor, getMergedVariables, getOptionsLockup, getParsedComboboxData, getParsedNativeSelectData, getPositionVariables, getPrimaryContrastColor, getPrimaryShade, getRadius, getRenderSlots, getRenderSlotsFromValues, getSafeId, getShadow, getSize, getSortedBreakpoints, getSpacing, getSplittedTags, getThemeColor, getTitleSize, getTreeExpandedState, hasNode, hashStyleProps, highlighter, hsvaToHex, hsvaToHexa, hsvaToHsl, hsvaToRgba, hsvaToRgbaObject, isColorValid, isEmptyComboboxData, isLightColor, isNumberLike, isOptionsGroup, isPrimitive, isVirtualColor, keys, lighten, luminance, memoize, mergeAsyncChildren, mergeMantineTheme, movePill, moveTreeNode, noop, parseColor, parseHex, parseHexa, parseHsla, parseHue, parseRgba, parseStyleProps, parseThemeColor, polymorphicProps, provideGridContext, provideListContext, provideMantineContext, provideMantineTheme, providePillsInputContext, px, rem, renderPolymorphic, resolveColorScheme, resolveNode, rgba, round, toRgba, useAccordionContext, useAccordionItemContext, useAppShellContext, useAvatarGroupContext, useCheckboxCardContext, useCheckboxGroupContext, useChipGroupContext, useCombobox, useComboboxContext, useComboboxTargetProps, useComputedColorScheme, useDataListContext, useDirection, useDrawersStack, useEmptyStateContext, useFloatingIndicator, useForwardedRef, useGridContext, useHoverCardContext, useInputContext, useInputWrapperContext, useListContext, useMantineClassNamesPrefix, useMantineColorScheme, useMantineContext, useMantineCssVariablesResolver, useMantineDeduplicateInlineStyles, useMantineEnv, useMantineIsHeadless, useMantineStyleNonce, useMantineTheme, useMantineWithStaticClasses, useMenuContext, useMenubarContext, useMenubarMenuContext, usePaginationContext, usePillGroupContext, usePillsInputContext, usePillsReorder, useProgressContext, useProps, useRadioCardContext, useRadioGroupContext, useRandomClassName, useSafeMantineTheme, useScrollAreaContext, useSplitterContext, useStepperContext, useStyles, useSwitchGroupContext, useTabsContext, useTree, useVirtualizedCombobox, validateJson, validateMantineTheme, validateOptions, virtualColor, withBoxProps };
 
 //# sourceMappingURL=index.mjs.map