@mantine-vue/core 2.3.1 → 3.0.0

package/esm/index.mjs

@@ -3748,6 +3748,10 @@ var AngleSlider = withBoxProps(defineComponent({
 			type: Number,
 			default: void 0
 		},
+		modelValue: {
+			type: Number,
+			default: void 0
+		},
 		value: {
 			type: Number,
 			default: void 0
@@ -3825,14 +3829,18 @@ var AngleSlider = withBoxProps(defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, emit }) {
 		const props = useProps("AngleSlider", defaultProps$52, rawProps);
 		const rootRef = ref(null);
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: 0,
-			onChange: props.onChange
+			onChange: (value) => {
+				emit("update:modelValue", value);
+				emit("change", value);
+			}
 		});
 		const update = (nextValue) => {
 			if (!rootRef.value || props.disabled) return;
@@ -5107,7 +5115,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 +5244,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 +8024,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 +8106,10 @@ var ScrollAreaBase = defineComponent({
 			type: Object,
 			default: void 0
 		},
+		verticalScrollbarPosition: {
+			type: String,
+			default: void 0
+		},
 		classNames: {
 			type: [Object, Function],
 			default: void 0
@@ -8256,11 +8268,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 +8282,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 +8610,7 @@ var defaultProps$35 = {
 	multiple: false,
 	loop: true,
 	disableChevronRotation: false,
+	disableCollapse: false,
 	chevronPosition: "right",
 	variant: "default",
 	chevronSize: "auto",
@@ -8605,7 +8622,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 +8633,7 @@ var varsResolver$57 = createVarsResolver((_, { transitionDuration, chevronSize,
 var AccordionBase = defineComponent({
 	name: "Accordion",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		multiple: {
 			type: Boolean,
@@ -8649,6 +8667,10 @@ var AccordionBase = defineComponent({
 			type: Boolean,
 			default: void 0
 		},
+		disableCollapse: {
+			type: Boolean,
+			default: void 0
+		},
 		chevronPosition: {
 			type: String,
 			default: void 0
@@ -8728,6 +8750,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 +8770,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 +8801,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 +8829,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 +8937,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 +8953,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 +9932,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 +10280,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 +10322,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 +10380,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 +10389,8 @@ var TimelineItem = withBoxProps(defineComponent({
 				...attrs,
 				mod: [{
 					lineActive,
-					active
+					active,
+					alternate: props.alternate
 				}, props.mod],
 				...ctx.getStyles("item", {
 					...stylesApiProps,
@@ -10368,14 +10402,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 +10509,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 +10522,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
@@ -11085,9 +11130,17 @@ var FileButton = defineComponent({
 	name: "FileButton",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: [
+				Object,
+				Array,
+				null
+			],
+			default: void 0
+		},
 		onChange: {
 			type: Function,
-			required: true
+			default: void 0
 		},
 		multiple: {
 			type: Boolean,
@@ -11126,7 +11179,8 @@ var FileButton = defineComponent({
 			default: void 0
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const inputRef = ref(null);
 		const reset = () => {
 			if (inputRef.value) inputRef.value.value = "";
@@ -11151,10 +11205,14 @@ var FileButton = defineComponent({
 			onChange: (event) => {
 				const files = event.currentTarget.files;
 				if (files === null) {
-					props.onChange(props.multiple ? [] : null);
+					const nextValue = props.multiple ? [] : null;
+					emit("update:modelValue", nextValue);
+					emit("change", nextValue);
 					return;
 				}
-				props.onChange(props.multiple ? Array.from(files) : files[0] || null);
+				const nextValue = props.multiple ? Array.from(files) : files[0] || null;
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
 			}
 		}), slots.default?.({
 			onClick,
@@ -11795,6 +11853,22 @@ var InputBase$1 = defineComponent({
 			],
 			default: "input"
 		},
+		modelValue: {
+			type: null,
+			default: void 0
+		},
+		value: {
+			type: null,
+			default: void 0
+		},
+		defaultValue: {
+			type: null,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
 		__staticSelector: {
 			type: String,
 			default: void 0
@@ -11964,7 +12038,21 @@ var InputBase$1 = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
+		const [value, setValue] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
+			defaultValue: props.defaultValue,
+			finalValue: void 0,
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
+		});
+		const callHandler = (handler, event) => {
+			if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
+			else if (typeof handler === "function") handler(event);
+		};
 		const wrapperCtx = useInputWrapperContext();
 		const stylesCtx = reactive({
 			offsetBottom: false,
@@ -12034,6 +12122,14 @@ var InputBase$1 = defineComponent({
 				h(Box, {
 					...attrs,
 					...ariaAttributes,
+					value: props.component === "button" || props.component === "div" ? void 0 : value.value,
+					onInput: (event) => {
+						callHandler(attrs.onInput, event);
+						if (props.component !== "select") setValue(event.currentTarget.value);
+					},
+					onChange: (event) => {
+						if (props.component === "select") setValue(event.currentTarget.value);
+					},
 					component: props.component,
 					required: props.required,
 					disabled: props.disabled,
@@ -12089,6 +12185,22 @@ var InputBase = withBoxProps(defineComponent({
 			],
 			default: "input"
 		},
+		modelValue: {
+			type: null,
+			default: void 0
+		},
+		value: {
+			type: null,
+			default: void 0
+		},
+		defaultValue: {
+			type: null,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
 		__staticSelector: {
 			type: String,
 			default: "InputBase"
@@ -12294,7 +12406,17 @@ var InputBase = withBoxProps(defineComponent({
 			default: void 0
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
+		const [value, setValue] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
+			defaultValue: props.defaultValue,
+			finalValue: void 0,
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
+		});
 		return () => h(Input.Wrapper, {
 			...props.wrapperProps,
 			id: props.id,
@@ -12322,6 +12444,8 @@ var InputBase = withBoxProps(defineComponent({
 			error: slots.error,
 			default: () => h(Input, {
 				...attrs,
+				modelValue: value.value,
+				"onUpdate:modelValue": setValue,
 				component: props.component,
 				__staticSelector: props.__staticSelector,
 				__stylesApiProps: props.__stylesApiProps ?? props,
@@ -12385,6 +12509,14 @@ var FileInput = defineComponent({
 			type: String,
 			default: "button"
 		},
+		modelValue: {
+			type: [
+				Object,
+				Array,
+				null
+			],
+			default: void 0
+		},
 		onChange: {
 			type: Function,
 			default: void 0
@@ -12506,13 +12638,17 @@ var FileInput = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const resetRef = ref(null);
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: props.multiple ? [] : null,
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const hasValue = computed(() => Array.isArray(value.value) ? value.value.length !== 0 : value.value !== null);
 		const reset = () => {
@@ -12972,6 +13108,14 @@ var NumberInput = defineComponent({
 	inheritAttrs: false,
 	slots: Object,
 	props: {
+		modelValue: {
+			type: [
+				String,
+				Number,
+				BigInt
+			],
+			default: void 0
+		},
 		value: {
 			type: [
 				String,
@@ -13161,15 +13305,19 @@ var NumberInput = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const inputRef = ref(null);
 		const isEditing = ref(false);
-		const isBigIntMode = computed(() => typeof props.value === "bigint" || typeof props.defaultValue === "bigint");
+		const isBigIntMode = computed(() => typeof props.modelValue === "bigint" || typeof props.value === "bigint" || typeof props.defaultValue === "bigint");
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: "",
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const getStyles = useStyles({
 			name: "NumberInput",
@@ -13566,6 +13714,10 @@ var PinInput = withBoxProps(defineComponent({
 			type: Boolean,
 			default: false
 		},
+		modelValue: {
+			type: String,
+			default: void 0
+		},
 		value: {
 			type: String,
 			default: void 0
@@ -13671,7 +13823,8 @@ var PinInput = withBoxProps(defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, emit }) {
 		const props = useProps("PinInput", defaultProps$21, rawProps);
 		const uuid = useId(props.id);
 		const focusedIndex = ref(-1);
@@ -13691,12 +13844,13 @@ var PinInput = withBoxProps(defineComponent({
 			varsResolver: varsResolver$38
 		});
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value !== void 0 ? createPinArray(currentLength.value, props.value) : void 0,
+			value: () => props.modelValue !== void 0 || props.value !== void 0 ? createPinArray(currentLength.value, props.modelValue ?? props.value ?? "") : void 0,
 			defaultValue: props.defaultValue?.split("").slice(0, currentLength.value),
 			finalValue: createPinArray(currentLength.value, ""),
 			onChange: (nextValue) => {
 				const stringValue = nextValue.join("").trim();
-				props.onChange?.(stringValue);
+				emit("update:modelValue", stringValue);
+				emit("change", stringValue);
 				if (stringValue.length === currentLength.value && !completed.value) {
 					completed.value = true;
 					props.onComplete?.(stringValue);
@@ -13830,7 +13984,6 @@ var PinInput = withBoxProps(defineComponent({
 				id: `${uuid.value}-${index + 1}`,
 				inputMode: props.inputMode || (props.type === "number" ? "numeric" : "text"),
 				onInput: (event) => handleInput(event, index),
-				onChange: (event) => handleInput(event, index),
 				onKeydown: (event) => handleKeyDown(event, index),
 				onFocus: (event) => {
 					event.target.select();
@@ -13996,6 +14149,10 @@ var NativeSelect = defineComponent({
 			type: String,
 			default: void 0
 		},
+		modelValue: {
+			type: String,
+			default: void 0
+		},
 		value: {
 			type: String,
 			default: void 0
@@ -14033,7 +14190,8 @@ var NativeSelect = defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, slots, emit }) {
 		const props = useProps("NativeSelect", defaultProps$20, rawProps);
 		return () => {
 			const parsedOptions = getParsedNativeSelectData(props.data).map((item, index) => h(NativeSelectOption, {
@@ -14057,9 +14215,11 @@ var NativeSelect = defineComponent({
 				id: props.id,
 				name: props.name,
 				form: props.form,
-				...props.value !== void 0 ? { value: props.value } : null,
-				...props.defaultValue !== void 0 ? { value: props.defaultValue } : null,
-				onChange: props.onChange,
+				modelValue: props.modelValue,
+				value: props.value,
+				defaultValue: props.defaultValue,
+				"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+				onChange: (value) => emit("change", value),
 				variant: props.variant,
 				radius: props.radius,
 				classNames: props.classNames,
@@ -14107,7 +14267,7 @@ var varsResolver$37 = createVarsResolver((theme, { variant, color, childrenOffse
 function renderContent(content) {
 	return typeof content === "function" ? content() : content;
 }
-function callHandler$8(handler, event) {
+function callHandler$5(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
 	else handler?.(event);
 }
@@ -14260,11 +14420,11 @@ var NavLink = withBoxProps(defineComponent({
 					expanded: opened.value
 				}, props.mod],
 				onClick: (event) => {
-					callHandler$8(attrs.onClick, event);
+					callHandler$5(attrs.onClick, event);
 					toggle(event);
 				},
 				onKeydown: (event) => {
-					callHandler$8(attrs.onKeydown ?? attrs.onKeyDown, event);
+					callHandler$5(attrs.onKeydown ?? attrs.onKeyDown, event);
 					if (event.code === "Space" && withChildren) toggle(event);
 				}
 			}, () => [
@@ -14829,6 +14989,10 @@ var Rating = withBoxProps(defineComponent({
 	inheritAttrs: false,
 	slots: Object,
 	props: {
+		modelValue: {
+			type: Number,
+			default: void 0
+		},
 		defaultValue: {
 			type: Number,
 			default: void 0
@@ -14910,7 +15074,8 @@ var Rating = withBoxProps(defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, slots, emit }) {
 		const props = useProps("Rating", defaultProps$16, rawProps);
 		const rootRef = ref(null);
 		const hovered = ref(-1);
@@ -14919,10 +15084,13 @@ var Rating = withBoxProps(defineComponent({
 		const name = useId(props.name);
 		const id = useId(props.id);
 		const [currentValue, setCurrentValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: 0,
-			onChange: (value) => props.onChange?.(value)
+			onChange: (value) => {
+				emit("update:modelValue", value);
+				emit("change", value);
+			}
 		});
 		const getStyles = useStyles({
 			name: "Rating",
@@ -15259,6 +15427,14 @@ var SegmentedControl = defineComponent({
 			type: Array,
 			required: true
 		},
+		modelValue: {
+			type: [
+				String,
+				Number,
+				Boolean
+			],
+			default: void 0
+		},
 		value: {
 			type: [
 				String,
@@ -15352,7 +15528,8 @@ var SegmentedControl = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, emit }) {
 		const theme = useMantineTheme();
 		const uuid = useId(props.name);
 		const mounted = useMounted();
@@ -15360,10 +15537,13 @@ var SegmentedControl = defineComponent({
 		const itemRefs = reactive({});
 		const normalizedData = computed(() => normalizeData(props.data));
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: normalizedData.value.find((item) => !item.disabled)?.value ?? normalizedData.value[0]?.value,
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const getStyles = useStyles({
 			name: "SegmentedControl",
@@ -16264,7 +16444,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 +16525,6 @@ var TabsBase = defineComponent({
 			type: Boolean,
 			default: void 0
 		},
-		keepMountedMode: {
-			type: String,
-			default: void 0
-		},
 		autoContrast: {
 			type: Boolean,
 			default: void 0
@@ -16425,9 +16600,6 @@ var TabsBase = defineComponent({
 			get keepMounted() {
 				return props.keepMounted;
 			},
-			get keepMountedMode() {
-				return props.keepMountedMode;
-			},
 			get placement() {
 				return props.placement;
 			},
@@ -16639,7 +16811,20 @@ var TextareaAutosize = defineComponent({
 var Textarea = defineComponent({
 	name: "Textarea",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
+		modelValue: {
+			type: String,
+			default: void 0
+		},
+		value: {
+			type: String,
+			default: void 0
+		},
+		defaultValue: {
+			type: String,
+			default: void 0
+		},
 		autosize: {
 			type: Boolean,
 			default: false
@@ -16674,7 +16859,8 @@ var Textarea = defineComponent({
 			default: void 0
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		return () => {
 			const shouldAutosize = props.autosize;
 			const autosizeProps = shouldAutosize ? {
@@ -16683,11 +16869,16 @@ var Textarea = defineComponent({
 			} : { rows: props.minRows };
 			return h(InputBase, {
 				...attrs,
+				modelValue: props.modelValue,
+				value: props.value,
+				defaultValue: props.defaultValue,
+				"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+				onChange: (value) => emit("change", value),
 				component: shouldAutosize ? TextareaAutosize : "textarea",
 				__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
@@ -16709,7 +16900,7 @@ function validateJson(value, deserialize) {
 }
 //#endregion
 //#region src/components/JsonInput/JsonInput.ts
-function callHandler$7(handler, event) {
+function callHandler$4(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
 	else handler?.(event);
 }
@@ -16717,6 +16908,10 @@ var JsonInput = defineComponent({
 	name: "JsonInput",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: String,
+			default: void 0
+		},
 		value: {
 			type: String,
 			default: void 0
@@ -16770,12 +16965,16 @@ var JsonInput = defineComponent({
 			default: void 0
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: "",
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const valid = ref(validateJson(value.value, props.deserialize));
 		return () => h(Textarea, {
@@ -16787,15 +16986,15 @@ var JsonInput = defineComponent({
 			error: valid.value ? props.error : props.validationError || true,
 			"data-monospace": true,
 			onInput: (event) => {
-				callHandler$7(attrs.onInput, event);
+				callHandler$4(attrs.onInput, event);
 				setValue(event.currentTarget.value);
 			},
 			onFocus: (event) => {
-				callHandler$7(attrs.onFocus, event);
+				callHandler$4(attrs.onFocus, event);
 				valid.value = true;
 			},
 			onBlur: (event) => {
-				callHandler$7(attrs.onBlur, event);
+				callHandler$4(attrs.onBlur, event);
 				const target = event.currentTarget;
 				const isValid = validateJson(target.value, props.deserialize);
 				if (props.formatOnBlur && !props.readOnly && isValid && target.value.trim() !== "") setValue(props.serialize(props.deserialize(target.value), null, props.indentSpaces));
@@ -16810,9 +17009,29 @@ Object.assign(JsonInput, { classes: InputBase.classes });
 var TextInput = defineComponent({
 	name: "TextInput",
 	inheritAttrs: false,
-	setup(_, { attrs, slots }) {
+	props: {
+		modelValue: {
+			type: [String, Number],
+			default: void 0
+		},
+		value: {
+			type: [String, Number],
+			default: void 0
+		},
+		defaultValue: {
+			type: [String, Number],
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		return () => h(InputBase, {
 			...attrs,
+			modelValue: props.modelValue,
+			value: props.value,
+			defaultValue: props.defaultValue,
+			"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+			onChange: (value) => emit("change", value),
 			component: "input",
 			__staticSelector: "TextInput",
 			__stylesApiProps: attrs
@@ -16904,6 +17123,22 @@ var PasswordInput = defineComponent({
 	inheritAttrs: false,
 	slots: Object,
 	props: {
+		modelValue: {
+			type: String,
+			default: void 0
+		},
+		value: {
+			type: String,
+			default: void 0
+		},
+		defaultValue: {
+			type: String,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
 		visibilityToggleIcon: {
 			type: [Object, Function],
 			default: void 0
@@ -17041,7 +17276,8 @@ var PasswordInput = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const uuid = useId(props.id);
 		const fallbackId = ref(`password-input-${Math.random().toString(36).slice(2)}`);
 		const [visible, setVisible] = useUncontrolled({
@@ -17050,6 +17286,15 @@ var PasswordInput = defineComponent({
 			finalValue: false,
 			onChange: (value) => props.onVisibilityChange?.(value)
 		});
+		const [value, setValue] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
+			defaultValue: props.defaultValue,
+			finalValue: "",
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
+		});
 		const getStyles = useStyles({
 			name: "PasswordInput",
 			props,
@@ -17070,7 +17315,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 +17348,7 @@ var PasswordInput = defineComponent({
 						toggleVisibility();
 					}
 				}
-			}, () => h(VisibilityToggleIcon, { reveal: visible.value }));
+			}, renderVisibilityToggleIcon);
 			return h(Input.Wrapper, {
 				...props.wrapperProps,
 				id,
@@ -17166,6 +17415,7 @@ var PasswordInput = defineComponent({
 					default: () => h("input", {
 						...attrs,
 						...getStyles("innerInput"),
+						value: value.value,
 						required: props.required,
 						"data-invalid": props.error || slots.error ? true : void 0,
 						"data-with-left-section": props.leftSection !== void 0 || slots.leftSection ? true : void 0,
@@ -17173,7 +17423,12 @@ var PasswordInput = defineComponent({
 						id,
 						"aria-describedby": describedBy,
 						autocomplete: attrs.autocomplete || "off",
-						type: visible.value ? "text" : "password"
+						type: visible.value ? "text" : "password",
+						onInput: (event) => {
+							const handler = attrs.onInput;
+							handler?.(event);
+							setValue(event.currentTarget.value);
+						}
 					}),
 					leftSection: slots.leftSection,
 					rightSection: slots.rightSection
@@ -17419,6 +17674,10 @@ var CheckboxGroup = defineComponent({
 	inheritAttrs: false,
 	slots: Object,
 	props: {
+		modelValue: {
+			type: Array,
+			default: void 0
+		},
 		value: {
 			type: Array,
 			default: void 0
@@ -17492,12 +17751,16 @@ var CheckboxGroup = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: [],
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const handleChange = (eventOrValue) => {
 			if (props.readOnly) return;
@@ -17560,6 +17823,10 @@ var CheckboxCard = withBoxProps(defineComponent({
 	name: "CheckboxCard",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
 		checked: {
 			type: Boolean,
 			default: void 0
@@ -17605,13 +17872,22 @@ var CheckboxCard = withBoxProps(defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: [
+		"update:modelValue",
+		"update:checked",
+		"change"
+	],
+	setup(props, { attrs, slots, emit }) {
 		const groupContext = useCheckboxGroupContext();
 		const [checked, setChecked] = useUncontrolled({
-			value: () => typeof props.checked === "boolean" ? props.checked : groupContext ? groupContext.value.includes(props.value || "") : void 0,
+			value: () => typeof props.modelValue === "boolean" ? props.modelValue : typeof props.checked === "boolean" ? props.checked : groupContext ? groupContext.value.includes(props.value || "") : void 0,
 			defaultValue: props.defaultChecked,
 			finalValue: false,
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("update:checked", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const getStyles = useStyles({
 			name: "CheckboxCard",
@@ -17802,7 +18078,7 @@ var varsResolver$25 = createVarsResolver((theme, { radius, color, size, iconColo
 		autoContrast
 	}) : void 0
 } }));
-function callHandler$6(handler, event) {
+function callHandler$3(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
 	else handler?.(event);
 }
@@ -17871,10 +18147,22 @@ var CheckboxBase = defineComponent({
 			type: Boolean,
 			default: true
 		},
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
 		checked: {
 			type: Boolean,
 			default: void 0
 		},
+		defaultChecked: {
+			type: Boolean,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
 		disabled: {
 			type: Boolean,
 			default: false
@@ -17908,9 +18196,24 @@ var CheckboxBase = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: [
+		"update:modelValue",
+		"update:checked",
+		"change"
+	],
+	setup(props, { attrs, slots, emit }) {
 		const uuid = useId(props.id);
 		const groupContext = useCheckboxGroupContext();
+		const [localChecked, setLocalChecked] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.checked,
+			defaultValue: props.defaultChecked,
+			finalValue: false,
+			onChange: (checked) => {
+				emit("update:modelValue", checked);
+				emit("update:checked", checked);
+				emit("change", checked);
+			}
+		});
 		const getStyles = useStyles({
 			name: "Checkbox",
 			props,
@@ -17940,7 +18243,7 @@ var CheckboxBase = defineComponent({
 			};
 			const Icon = props.icon || CheckboxIcon;
 			const value = String(attrs.value ?? "");
-			const checked = groupContext ? groupContext.value.includes(value) : props.checked;
+			const checked = groupContext ? groupContext.value.includes(value) : localChecked.value;
 			const disabled = groupContext?.isDisabled?.(value) || props.disabled;
 			const size = groupContext?.size ?? props.size;
 			return h(InlineInput, {
@@ -17985,13 +18288,14 @@ var CheckboxBase = defineComponent({
 				},
 				variant: props.variant,
 				onClick: (event) => {
-					callHandler$6(attrs.onClick, event);
-					if (props.readOnly && checked === void 0) event.preventDefault();
+					callHandler$3(attrs.onClick, event);
+					if (props.readOnly) event.preventDefault();
 				},
 				onChange: (event) => {
 					if (props.readOnly) return;
-					callHandler$6(attrs.onChange, event);
+					const nextChecked = event.currentTarget.checked;
 					groupContext?.onChange(event);
+					setLocalChecked(nextChecked);
 				}
 			}), slots.icon ? slots.icon(iconSlotProps) : h(Icon, {
 				indeterminate: props.indeterminate,
@@ -18020,6 +18324,10 @@ var ChipGroup = defineComponent({
 			type: Boolean,
 			default: false
 		},
+		modelValue: {
+			type: [String, Array],
+			default: void 0
+		},
 		value: {
 			type: [String, Array],
 			default: void 0
@@ -18033,12 +18341,16 @@ var ChipGroup = defineComponent({
 			default: void 0
 		}
 	},
-	setup(props, { slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { slots, emit }) {
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: props.multiple ? [] : null,
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const isChipSelected = (chipValue) => Array.isArray(value.value) ? value.value.includes(chipValue) : value.value === chipValue;
 		const handleChange = (event) => {
@@ -18086,10 +18398,6 @@ var varsResolver$24 = createVarsResolver((theme, { size, radius, variant, color,
 		"--chip-spacing": getSize(size, "chip-spacing")
 	} };
 });
-function callHandler$5(handler, event) {
-	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
-	else handler?.(event);
-}
 var ChipBase = defineComponent({
 	name: "Chip",
 	inheritAttrs: false,
@@ -18110,6 +18418,10 @@ var ChipBase = defineComponent({
 			type: String,
 			default: "checkbox"
 		},
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
 		checked: {
 			type: Boolean,
 			default: void 0
@@ -18181,15 +18493,24 @@ var ChipBase = defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs, slots }) {
+	emits: [
+		"update:modelValue",
+		"update:checked",
+		"change"
+	],
+	setup(rawProps, { attrs, slots, emit }) {
 		const props = useProps("Chip", null, rawProps);
 		const groupContext = useChipGroupContext();
 		const uuid = useId(props.id);
 		const [value, setValue] = useUncontrolled({
-			value: () => props.checked,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.checked,
 			defaultValue: props.defaultChecked,
 			finalValue: false,
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("update:checked", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const getStyles = useStyles({
 			name: "Chip",
@@ -18210,7 +18531,7 @@ var ChipBase = defineComponent({
 			const inputType = groupContext ? groupContext.multiple ? "checkbox" : "radio" : props.type;
 			const icon = props.icon ?? slots.icon;
 			const showIcon = checked && icon !== null && icon !== false;
-			const { class: _class, style: _style, onChange: attrsOnChange, value: _attrsValue, ...inputAttrs } = attrs;
+			const { class: _class, style: _style, value: _attrsValue, ...inputAttrs } = attrs;
 			const renderIcon = () => {
 				const iconProps = getStyles("checkIcon");
 				if (icon === void 0) return h(CheckIcon, iconProps);
@@ -18235,11 +18556,9 @@ var ChipBase = defineComponent({
 				disabled: props.disabled,
 				value: chipValue,
 				onChange: (event) => {
-					callHandler$5(attrsOnChange, event);
-					if (groupContext) {
-						groupContext.onChange(event);
-						props.onChange?.(event.currentTarget.checked);
-					} else setValue(event.currentTarget.checked);
+					const nextChecked = event.currentTarget.checked;
+					if (groupContext) groupContext.onChange(event);
+					setValue(nextChecked);
 				}
 			}), h(Box, {
 				component: "label",
@@ -18363,7 +18682,7 @@ var varsResolver$22 = createVarsResolver((_, { radius }, ctx) => ({ root: {
 	"--pill-height": getSize(ctx.size, "pill-height"),
 	"--pill-radius": radius === void 0 ? void 0 : getRadius(radius)
 } }));
-function callHandler$4(handler, event) {
+function callHandler$2(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
 	else handler?.(event);
 }
@@ -18472,12 +18791,12 @@ var PillBase = defineComponent({
 				onMousedown: (event) => {
 					event.preventDefault();
 					event.stopPropagation();
-					callHandler$4(removeButtonProps.onMousedown ?? removeButtonProps.onMousedown ?? removeButtonProps.onMouseDown, event);
+					callHandler$2(removeButtonProps.onMousedown ?? removeButtonProps.onMousedown ?? removeButtonProps.onMouseDown, event);
 				},
 				onClick: (event) => {
 					event.stopPropagation();
 					props.onRemove?.();
-					callHandler$4(removeButtonProps.onClick, event);
+					callHandler$2(removeButtonProps.onClick, event);
 				}
 			}) : null]);
 		};
@@ -18495,6 +18814,22 @@ var PillsInputField = withBoxProps(defineComponent({
 	name: "PillsInputField",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: String,
+			default: void 0
+		},
+		value: {
+			type: String,
+			default: void 0
+		},
+		defaultValue: {
+			type: String,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
 		type: {
 			type: String,
 			default: "visible"
@@ -18536,8 +18871,18 @@ var PillsInputField = withBoxProps(defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, emit }) {
 		const props = useProps("PillsInputField", null, rawProps);
+		const [value, setValue] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
+			defaultValue: props.defaultValue,
+			finalValue: "",
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
+		});
 		const context = usePillsInputContext();
 		const inputWrapperContext = useInputWrapperContext();
 		const getStyles = useStyles({
@@ -18559,6 +18904,7 @@ var PillsInputField = withBoxProps(defineComponent({
 					style: attrs.style
 				}),
 				component: "input",
+				value: value.value,
 				ref: (node) => {
 					const input = node?.$el ?? node ?? null;
 					if (context) context.fieldRef.value = input;
@@ -18574,6 +18920,11 @@ var PillsInputField = withBoxProps(defineComponent({
 				"aria-invalid": context?.hasError || void 0,
 				"aria-describedby": inputWrapperContext.describedBy,
 				type: "text",
+				onInput: (event) => {
+					const handler = attrs.onInput;
+					handler?.(event);
+					setValue(event.currentTarget.value);
+				},
 				onMousedown: (event) => {
 					if (!props.pointer) event.stopPropagation();
 				}
@@ -18740,6 +19091,10 @@ var RadioGroup = defineComponent({
 	inheritAttrs: false,
 	slots: Object,
 	props: {
+		modelValue: {
+			type: String,
+			default: void 0
+		},
 		value: {
 			type: String,
 			default: void 0
@@ -18801,13 +19156,17 @@ var RadioGroup = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const name = useId(props.name);
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: "",
-			onChange: (nextValue) => props.onChange?.(String(nextValue ?? ""))
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
 		});
 		const handleChange = (eventOrValue) => {
 			if (props.readOnly) return;
@@ -18853,7 +19212,7 @@ function useRadioCardContext() {
 	return inject(RadioCardContextKey, null);
 }
 var varsResolver$21 = createVarsResolver((_, { radius }) => ({ card: { "--card-radius": getRadius(radius) } }));
-function callHandler$3(handler, event) {
+function callHandler$1(handler, event) {
 	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
 	else handler?.(event);
 }
@@ -18861,10 +19220,22 @@ var RadioCard = withBoxProps(defineComponent({
 	name: "RadioCard",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
 		checked: {
 			type: Boolean,
 			default: void 0
 		},
+		defaultChecked: {
+			type: Boolean,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
 		withBorder: {
 			type: Boolean,
 			default: true
@@ -18902,8 +19273,23 @@ var RadioCard = withBoxProps(defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: [
+		"update:modelValue",
+		"update:checked",
+		"change"
+	],
+	setup(props, { attrs, slots, emit }) {
 		const groupContext = useRadioGroupContext();
+		const [localChecked, setLocalChecked] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.checked,
+			defaultValue: props.defaultChecked,
+			finalValue: false,
+			onChange: (checked) => {
+				emit("update:modelValue", checked);
+				emit("update:checked", checked);
+				emit("change", checked);
+			}
+		});
 		const getStyles = useStyles({
 			name: "RadioCard",
 			props,
@@ -18916,7 +19302,7 @@ var RadioCard = withBoxProps(defineComponent({
 			vars: props.vars,
 			varsResolver: varsResolver$21
 		});
-		const isChecked = () => typeof props.checked === "boolean" ? props.checked : groupContext?.value === props.value || false;
+		const isChecked = () => groupContext ? groupContext.value === props.value : localChecked.value;
 		provide(RadioCardContextKey, { get checked() {
 			return isChecked();
 		} });
@@ -18938,8 +19324,9 @@ var RadioCard = withBoxProps(defineComponent({
 				name,
 				"aria-checked": checked,
 				onClick: (event) => {
-					callHandler$3(attrs.onClick, event);
+					callHandler$1(attrs.onClick, event);
 					groupContext?.onChange(props.value || "");
+					setLocalChecked(true);
 				}
 			}, () => slots.default?.());
 		};
@@ -19109,10 +19496,6 @@ var varsResolver$19 = createVarsResolver((theme, { size, radius, color, iconColo
 	}) : void 0,
 	"--radio-icon-size": getSize(size, "radio-icon-size")
 } }));
-function callHandler$2(handler, event) {
-	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
-	else handler?.(event);
-}
 var RadioBase = defineComponent({
 	name: "Radio",
 	inheritAttrs: false,
@@ -19174,14 +19557,30 @@ var RadioBase = defineComponent({
 			type: Boolean,
 			default: true
 		},
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
 		checked: {
 			type: Boolean,
 			default: void 0
 		},
+		defaultChecked: {
+			type: Boolean,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
 		disabled: {
 			type: Boolean,
 			default: false
 		},
+		readOnly: {
+			type: Boolean,
+			default: false
+		},
 		variant: {
 			type: String,
 			default: "filled"
@@ -19207,9 +19606,24 @@ var RadioBase = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: [
+		"update:modelValue",
+		"update:checked",
+		"change"
+	],
+	setup(props, { attrs, slots, emit }) {
 		const uuid = useId(props.id);
 		const groupContext = useRadioGroupContext();
+		const [localChecked, setLocalChecked] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.checked,
+			defaultValue: props.defaultChecked,
+			finalValue: false,
+			onChange: (checked) => {
+				emit("update:modelValue", checked);
+				emit("update:checked", checked);
+				emit("change", checked);
+			}
+		});
 		const getStyles = useStyles({
 			name: "Radio",
 			props,
@@ -19235,7 +19649,7 @@ var RadioBase = defineComponent({
 			const iconStyles = getStyles("icon");
 			const Icon = props.icon || RadioIcon;
 			const value = String(attrs.value ?? "");
-			const checked = groupContext ? groupContext.value === value : props.checked;
+			const checked = groupContext ? groupContext.value === value : localChecked.value;
 			const disabled = groupContext?.disabled || props.disabled;
 			const size = groupContext?.size ?? props.size;
 			const name = groupContext?.name ?? attrs.name;
@@ -19271,6 +19685,7 @@ var RadioBase = defineComponent({
 				id,
 				checked,
 				disabled,
+				readonly: props.readOnly,
 				name,
 				type: "radio",
 				"aria-describedby": describedBy,
@@ -19280,8 +19695,12 @@ var RadioBase = defineComponent({
 				},
 				variant: props.variant,
 				onChange: (event) => {
-					callHandler$2(attrs.onChange, event);
+					if (props.readOnly) {
+						event.currentTarget.checked = Boolean(checked);
+						return;
+					}
 					groupContext?.onChange(event);
+					setLocalChecked(event.currentTarget.checked);
 				}
 			}), slots.icon ? slots.icon(iconStyles) : h(Icon, iconStyles)]));
 		};
@@ -19305,6 +19724,10 @@ var SwitchGroup = defineComponent({
 	inheritAttrs: false,
 	slots: Object,
 	props: {
+		modelValue: {
+			type: Array,
+			default: void 0
+		},
 		value: {
 			type: Array,
 			default: void 0
@@ -19378,16 +19801,20 @@ var SwitchGroup = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const [value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: [],
-			onChange: (nextValue) => props.onChange?.(nextValue)
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
 		});
-		const handleChange = (event) => {
+		const handleChange = (eventOrValue) => {
 			if (props.readOnly) return;
-			const itemValue = String(event.currentTarget?.value ?? "");
+			const itemValue = typeof eventOrValue === "string" ? eventOrValue : String(eventOrValue.currentTarget?.value ?? "");
 			const isCurrentlySelected = value.value.includes(itemValue);
 			if (!isCurrentlySelected && props.maxSelectedValues && value.value.length >= props.maxSelectedValues) return;
 			setValue(isCurrentlySelected ? value.value.filter((item) => item !== itemValue) : [...value.value, itemValue]);
@@ -19453,10 +19880,6 @@ var varsResolver$18 = createVarsResolver((theme, { radius, color, size }) => ({
 	"--switch-track-label-padding": getSize(size, "switch-track-label-padding"),
 	"--switch-color": color ? getThemeColor(color, theme) : void 0
 } }));
-function callHandler$1(handler, event) {
-	if (Array.isArray(handler)) handler.forEach((item) => item?.(event));
-	else handler?.(event);
-}
 var SwitchBase = defineComponent({
 	name: "Switch",
 	inheritAttrs: false,
@@ -19518,6 +19941,10 @@ var SwitchBase = defineComponent({
 			type: Boolean,
 			default: true
 		},
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
 		checked: {
 			type: Boolean,
 			default: void 0
@@ -19534,6 +19961,10 @@ var SwitchBase = defineComponent({
 			type: Boolean,
 			default: false
 		},
+		readOnly: {
+			type: Boolean,
+			default: false
+		},
 		variant: {
 			type: String,
 			default: void 0
@@ -19559,16 +19990,22 @@ var SwitchBase = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: [
+		"update:modelValue",
+		"update:checked",
+		"change"
+	],
+	setup(props, { attrs, slots, emit }) {
 		const uuid = useId(props.id);
 		const groupContext = useSwitchGroupContext();
-		const internalChecked = ref(false);
 		const [checked, setChecked] = useUncontrolled({
-			value: () => props.checked,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.checked,
 			defaultValue: props.defaultChecked,
 			finalValue: false,
 			onChange: (value) => {
-				internalChecked.value = value;
+				emit("update:modelValue", value);
+				emit("update:checked", value);
+				emit("change", value);
 			}
 		});
 		const getStyles = useStyles({
@@ -19629,15 +20066,19 @@ var SwitchBase = defineComponent({
 				...getStyles("input"),
 				disabled,
 				checked: currentChecked,
+				readonly: props.readOnly,
 				id,
 				type: "checkbox",
 				role: "switch",
 				"aria-describedby": describedBy,
 				onChange: (event) => {
-					callHandler$1(attrs.onChange, event);
-					props.onChange?.(event);
+					if (props.readOnly) {
+						event.currentTarget.checked = currentChecked;
+						return;
+					}
+					const nextChecked = event.currentTarget.checked;
 					if (groupContext) groupContext.onChange(event);
-					else setChecked(event.currentTarget.checked);
+					setChecked(nextChecked);
 				}
 			}), h(Box, {
 				component: "span",
@@ -20274,16 +20715,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 +21181,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 +21394,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 +21446,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 +21460,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 +21501,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 +21857,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
@@ -21289,6 +21925,10 @@ var Slider = withBoxProps(defineComponent({
 			type: Number,
 			default: void 0
 		},
+		modelValue: {
+			type: Number,
+			default: void 0
+		},
 		value: {
 			type: Number,
 			default: void 0
@@ -21404,16 +22044,23 @@ var Slider = withBoxProps(defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, slots, emit }) {
 		const props = useProps("Slider", defaultProps$6, rawProps);
 		const direction = useDirection();
 		const hovered = ref(false);
 		const thumb = ref(null);
 		const [current, setCurrent] = useUncontrolled({
-			value: () => props.value === void 0 ? void 0 : clamp$1(props.value, props.min, props.max),
+			value: () => {
+				const controlledValue = props.modelValue !== void 0 ? props.modelValue : props.value;
+				return controlledValue === void 0 ? void 0 : clamp$1(controlledValue, props.min, props.max);
+			},
 			defaultValue: props.defaultValue === void 0 ? void 0 : clamp$1(props.defaultValue, props.min, props.max),
 			finalValue: clamp$1(0, props.min, props.max),
-			onChange: (value) => props.onChange?.(value)
+			onChange: (value) => {
+				emit("update:modelValue", value);
+				emit("change", value);
+			}
 		});
 		const valueRef = ref(current.value);
 		watch(current, (value) => {
@@ -21466,7 +22113,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],
@@ -21551,6 +22198,10 @@ var RangeSlider = defineComponent({
 	inheritAttrs: false,
 	slots: Object,
 	props: {
+		modelValue: {
+			type: Array,
+			default: void 0
+		},
 		value: {
 			type: Array,
 			default: void 0
@@ -21697,17 +22348,21 @@ var RangeSlider = defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, slots, emit }) {
 		const props = useProps("RangeSlider", defaults$5, rawProps);
 		const direction = useDirection();
 		const activeThumb = ref(0);
 		const focused = ref(0);
 		const hovered = ref(false);
 		const [current, setCurrent] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: [props.min, props.max],
-			onChange: (value) => props.onChange?.(value)
+			onChange: (value) => {
+				emit("update:modelValue", value);
+				emit("change", value);
+			}
 		});
 		const valueRef = ref([...current.value]);
 		watch(current, (value) => valueRef.value = [...value]);
@@ -21799,10 +22454,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 +22468,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],
@@ -21874,9 +22529,17 @@ var ColorSlider = defineComponent({
 	name: "ColorSlider",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: Number,
+			default: void 0
+		},
 		value: {
 			type: Number,
-			required: true
+			default: void 0
+		},
+		defaultValue: {
+			type: Number,
+			default: void 0
 		},
 		onChange: {
 			type: Function,
@@ -21935,11 +22598,21 @@ var ColorSlider = defineComponent({
 			default: false
 		}
 	},
-	setup(props, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, emit }) {
 		const ctx = useColorPickerContext();
 		const theme = useMantineTheme();
+		const [value, setValue] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
+			defaultValue: props.defaultValue,
+			finalValue: 0,
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
+		});
 		const position = ref({
-			x: props.value / props.maxValue,
+			x: value.value / props.maxValue,
 			y: 0
 		});
 		const positionRef = ref(position.value);
@@ -21964,7 +22637,7 @@ var ColorSlider = defineComponent({
 				x,
 				y: 0
 			};
-			props.onChange?.(changeValue(x));
+			setValue(changeValue(x));
 		}, {
 			onScrubStart: props.onScrubStart,
 			onScrubEnd: () => {
@@ -21972,7 +22645,7 @@ var ColorSlider = defineComponent({
 				props.onScrubEnd?.();
 			}
 		});
-		watch(() => props.value, (value) => position.value = {
+		watch(value, (value) => position.value = {
 			x: value / props.maxValue,
 			y: 0
 		});
@@ -21983,7 +22656,7 @@ var ColorSlider = defineComponent({
 				x: position.value.x + (event.key === "ArrowRight" ? .05 : -.05),
 				y: 0
 			}).x);
-			props.onChange?.(value);
+			setValue(value);
 			props.onChangeEnd?.(value);
 		};
 		return () => h(Box, {
@@ -21994,7 +22667,7 @@ var ColorSlider = defineComponent({
 				style: attrs.style
 			}),
 			role: "slider",
-			"aria-valuenow": props.value,
+			"aria-valuenow": value.value,
 			"aria-valuemax": props.maxValue,
 			"aria-valuemin": 0,
 			tabindex: props.focusable ? 0 : -1,
@@ -22229,9 +22902,17 @@ var AlphaSlider = defineComponent({
 	name: "AlphaSlider",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: Number,
+			default: void 0
+		},
 		value: {
 			type: Number,
-			required: true
+			default: void 0
+		},
+		defaultValue: {
+			type: Number,
+			default: void 0
 		},
 		color: {
 			type: String,
@@ -22262,7 +22943,8 @@ var AlphaSlider = defineComponent({
 			default: true
 		}
 	},
-	setup(props, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, emit }) {
 		return () => h(ColorSlider, {
 			...attrs,
 			...props,
@@ -22270,7 +22952,8 @@ var AlphaSlider = defineComponent({
 			maxValue: 1,
 			round: false,
 			"data-alpha": "",
-			onChange: (value) => props.onChange?.(round(value, 2)),
+			"onUpdate:modelValue": (value) => emit("update:modelValue", round(value, 2)),
+			onChange: (value) => emit("change", round(value, 2)),
 			onChangeEnd: (value) => props.onChangeEnd?.(round(value, 2)),
 			overlays: [
 				{
@@ -22290,9 +22973,17 @@ var HueSlider = defineComponent({
 	name: "HueSlider",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: Number,
+			default: void 0
+		},
 		value: {
 			type: Number,
-			required: true
+			default: void 0
+		},
+		defaultValue: {
+			type: Number,
+			default: void 0
 		},
 		onChange: {
 			type: Function,
@@ -22319,13 +23010,16 @@ var HueSlider = defineComponent({
 			default: true
 		}
 	},
-	setup(props, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, emit }) {
 		return () => h(ColorSlider, {
 			...attrs,
 			...props,
+			"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+			onChange: (value) => emit("change", value),
 			__staticSelector: "HueSlider",
 			maxValue: 360,
-			thumbColor: `hsl(${props.value}, 100%, 50%)`,
+			thumbColor: `hsl(${props.modelValue ?? props.value ?? props.defaultValue ?? 0}, 100%, 50%)`,
 			round: true,
 			"data-hue": "",
 			overlays: [{ backgroundImage: "linear-gradient(to right,hsl(0,100%,50%),hsl(60,100%,50%),hsl(120,100%,50%),hsl(170,100%,50%),hsl(240,100%,50%),hsl(300,100%,50%),hsl(360,100%,50%))" }, { boxShadow: `rgba(0,0,0,.1) 0 0 0 ${rem(1)} inset, rgba(0,0,0,.15) 0 0 ${rem(4)} inset` }]
@@ -22523,6 +23217,10 @@ var ColorPicker = defineComponent({
 	name: "ColorPicker",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: String,
+			default: void 0
+		},
 		value: {
 			type: String,
 			default: void 0
@@ -22616,13 +23314,17 @@ var ColorPicker = defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, emit }) {
 		const props = useProps("ColorPicker", defaults$4, rawProps);
 		const [current, setCurrent, controlled] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: "#FFFFFF",
-			onChange: (value) => props.onChange?.(value)
+			onChange: (value) => {
+				emit("update:modelValue", value);
+				emit("change", value);
+			}
 		});
 		const parsed = ref(parseColor(current.value));
 		let scrubbing = false;
@@ -23386,6 +24088,22 @@ var MaskInput = defineComponent({
 			type: [String, Array],
 			required: true
 		},
+		modelValue: {
+			type: String,
+			default: void 0
+		},
+		value: {
+			type: String,
+			default: void 0
+		},
+		defaultValue: {
+			type: String,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
 		tokens: {
 			type: Object,
 			default: void 0
@@ -23435,7 +24153,8 @@ var MaskInput = defineComponent({
 			default: void 0
 		}
 	},
-	setup(props, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, slots, emit }) {
 		const input = ref(null);
 		const processed = ref("");
 		const rawValue = ref("");
@@ -23496,6 +24215,8 @@ var MaskInput = defineComponent({
 			}
 			const complete = isComplete(reprocessed, resolved.slots);
 			if (notify) {
+				emit("update:modelValue", nextDisplay);
+				emit("change", nextDisplay);
 				props.onChangeRaw?.(resolvedRaw, nextDisplay);
 				if (complete && !wasComplete.value) props.onComplete?.(nextDisplay, resolvedRaw);
 			}
@@ -23508,11 +24229,13 @@ var MaskInput = defineComponent({
 			const resolved = resolveMaskOptions(options(), "");
 			displayValue.value = props.alwaysShowMask ? buildDisplayValue("", resolved.slots, resolved.slotChar, true) : "";
 			if (input.value) input.value.value = displayValue.value;
+			emit("update:modelValue", "");
+			emit("change", "");
 			props.onChangeRaw?.("", "");
 		};
 		assignRef(props.resetRef, reset);
 		watch(() => props.resetRef, (value) => assignRef(value, reset));
-		watch(() => attrs.value, (value) => {
+		watch(() => props.modelValue !== void 0 ? props.modelValue : props.value, (value) => {
 			if (input.value && value !== void 0 && String(value) !== displayValue.value) commit(String(value), void 0, false, String(value));
 		});
 		onBeforeUnmount(() => assignRef(props.resetRef, null));
@@ -23521,7 +24244,7 @@ var MaskInput = defineComponent({
 			input.value = element instanceof HTMLInputElement ? element : null;
 			assignRef(attrs.rootRef, root?.$el ?? root ?? null);
 			if (!input.value) return;
-			const initial = attrs.value ?? attrs.defaultValue ?? input.value.value;
+			const initial = props.modelValue ?? props.value ?? props.defaultValue ?? input.value.value;
 			if (initial) commit(String(initial), void 0, false, String(initial));
 			else if (props.alwaysShowMask) {
 				const resolved = resolveMaskOptions(options(), "");
@@ -23632,6 +24355,7 @@ var MaskInput = defineComponent({
 				type: forwarded.type ?? "text",
 				__staticSelector: "MaskInput",
 				__stylesApiProps: attrs,
+				value: displayValue.value,
 				rootRef: attach,
 				onInput: handleInput,
 				onFocus: handleFocus,
@@ -24089,6 +24813,7 @@ function flattenChildren$1(children) {
 var SplitterBase = defineComponent({
 	name: "Splitter",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		orientation: {
 			type: String,
@@ -24235,7 +24960,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 +25220,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 +25239,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 +25261,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 +25346,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 +25610,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 +25626,7 @@ var varsResolver$8 = createVarsResolver((_, { levelOffset }) => ({ root: { "--le
 var Tree = withBoxProps(defineComponent({
 	name: "Tree",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		component: {
 			type: [
@@ -25001,7 +25742,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 +26029,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 +26523,10 @@ var ModalRoot = defineComponent({
 			type: Function,
 			required: true
 		},
+		keepMounted: {
+			type: Boolean,
+			default: false
+		},
 		centered: Boolean,
 		fullScreen: Boolean,
 		radius: [String, Number],
@@ -25844,6 +26589,7 @@ var ModalRoot = defineComponent({
 			...attrs,
 			opened: props.opened,
 			onClose: props.onClose,
+			keepMounted: props.keepMounted,
 			unstyled: props.unstyled,
 			...getStyles("root"),
 			mod: {
@@ -25898,6 +26644,10 @@ var ModalBaseComponent = defineComponent({
 			type: Function,
 			required: true
 		},
+		keepMounted: {
+			type: Boolean,
+			default: false
+		},
 		title: {
 			type: null,
 			default: void 0
@@ -25920,7 +26670,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 +26796,10 @@ var DrawerRoot = defineComponent({
 			type: Function,
 			required: true
 		},
+		keepMounted: {
+			type: Boolean,
+			default: false
+		},
 		position: {
 			type: String,
 			default: "left"
@@ -26104,6 +26859,7 @@ var DrawerRoot = defineComponent({
 			...attrs,
 			opened: props.opened,
 			onClose: props.onClose,
+			keepMounted: props.keepMounted,
 			unstyled: props.unstyled,
 			...getStyles("root"),
 			transitionProps: {
@@ -26162,6 +26918,10 @@ var DrawerBaseComponent = defineComponent({
 			type: Function,
 			required: true
 		},
+		keepMounted: {
+			type: Boolean,
+			default: false
+		},
 		title: {
 			type: null,
 			default: void 0
@@ -26219,6 +26979,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 +27181,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 +27233,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 +27245,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 +27313,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 +27353,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 +27429,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 +28265,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 +28277,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 +28484,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 +28605,9 @@ var MenuBase = defineComponent({
 			get hasSearch() {
 				return searchCount.value > 0;
 			},
+			get withInitialFocusPlaceholder() {
+				return props.withInitialFocusPlaceholder;
+			},
 			registerSearch: () => {
 				searchCount.value += 1;
 				return () => {
@@ -27943,7 +28707,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 +28730,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 +28795,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();
 				}
 			}, () => [
@@ -28075,19 +28845,44 @@ var MenuDivider = defineComponent({
 var MenuSearch = defineComponent({
 	name: "MenuSearch",
 	inheritAttrs: false,
-	props: { clearSearchOnClose: {
-		type: Boolean,
-		default: true
-	} },
-	setup(props, { attrs }) {
+	props: {
+		modelValue: {
+			type: String,
+			default: void 0
+		},
+		value: {
+			type: String,
+			default: void 0
+		},
+		defaultValue: {
+			type: String,
+			default: void 0
+		},
+		onChange: {
+			type: Function,
+			default: void 0
+		},
+		clearSearchOnClose: {
+			type: Boolean,
+			default: true
+		}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, emit }) {
 		const ctx = useMenuContext();
+		const [value, setValue] = useUncontrolled({
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
+			defaultValue: props.defaultValue,
+			finalValue: "",
+			onChange: (nextValue) => {
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+			}
+		});
 		const unregister = ctx.registerSearch();
 		ctx.setSearchExitClear(props.clearSearchOnClose ? () => {
 			clearActive(document.querySelector("[data-menu-dropdown]"));
-			attrs.onChange?.({
-				currentTarget: { value: "" },
-				target: { value: "" }
-			});
+			setValue("");
 		} : null);
 		onUnmounted(() => {
 			unregister();
@@ -28111,6 +28906,7 @@ var MenuSearch = defineComponent({
 			const inputStyles = attrs.styles;
 			return h(Input, {
 				...forwarded,
+				value: value.value,
 				type: "search",
 				"data-autofocus": "",
 				"data-mantine-stop-propagation": "",
@@ -28127,16 +28923,12 @@ var MenuSearch = defineComponent({
 					}
 				},
 				onInput: (event) => {
-					call(attrs.onInput, event);
-					call(attrs.onChange, event);
-					clearActive(event.currentTarget.closest("[data-menu-dropdown]"));
-				},
-				onChange: (event) => {
-					call(attrs.onChange, event);
+					call$1(attrs.onInput, event);
+					setValue(event.currentTarget.value);
 					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 +29201,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 +29227,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;
@@ -29533,6 +30325,18 @@ var ComboboxSearch = defineComponent({
 	name: "ComboboxSearch",
 	inheritAttrs: false,
 	props: {
+		modelValue: {
+			type: String,
+			default: void 0
+		},
+		value: {
+			type: String,
+			default: void 0
+		},
+		defaultValue: {
+			type: String,
+			default: void 0
+		},
 		withAriaAttributes: {
 			type: Boolean,
 			default: true
@@ -29543,7 +30347,8 @@ var ComboboxSearch = defineComponent({
 		},
 		size: String
 	},
-	setup(props, { attrs }) {
+	emits: ["update:modelValue", "change"],
+	setup(props, { attrs, emit }) {
 		const ctx = useComboboxContext();
 		const targetProps = useComboboxTargetProps({
 			targetType: "input",
@@ -29556,6 +30361,11 @@ var ComboboxSearch = defineComponent({
 		});
 		return () => h(Input, {
 			...attrs,
+			modelValue: props.modelValue,
+			value: props.value,
+			defaultValue: props.defaultValue,
+			"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+			onChange: (value) => emit("change", value),
 			...targetProps,
 			ref: (node) => {
 				const element = node?.$el?.querySelector?.("input") ?? node?.$el ?? node;
@@ -29917,7 +30727,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 : "",
@@ -30093,6 +30904,10 @@ var ComboboxPopoverBase = defineComponent({
 			type: Boolean,
 			default: void 0
 		},
+		modelValue: {
+			type: null,
+			default: void 0
+		},
 		value: {
 			type: null,
 			default: void 0
@@ -30230,7 +31045,8 @@ var ComboboxPopoverBase = defineComponent({
 			default: false
 		}
 	},
-	setup(rawProps, { attrs, slots }) {
+	emits: ["update:modelValue", "change"],
+	setup(rawProps, { attrs, slots, emit }) {
 		const props = new Proxy(rawProps, { get(target, key) {
 			const value = target[key];
 			return value === void 0 && key in defaultProps$2 ? defaultProps$2[key] : value;
@@ -30238,10 +31054,13 @@ var ComboboxPopoverBase = defineComponent({
 		const parsedData = computed(() => getParsedComboboxData(props.data));
 		const optionsLockup = computed(() => getOptionsLockup(parsedData.value));
 		const [_value, setValue] = useUncontrolled({
-			value: () => props.value,
+			value: () => props.modelValue !== void 0 ? props.modelValue : props.value,
 			defaultValue: props.defaultValue,
 			finalValue: props.multiple ? [] : null,
-			onChange: (val) => props.onChange?.(val)
+			onChange: (value) => {
+				emit("update:modelValue", value);
+				emit("change", value);
+			}
 		});
 		const [_searchValue, setSearchValue] = useUncontrolled({
 			value: () => props.searchValue,
@@ -30281,8 +31100,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,
@@ -30992,7 +31811,11 @@ var Select = defineComponent({
 			default: void 0
 		}
 	},
-	emits: ["update:modelValue", "update:searchValue"],
+	emits: [
+		"update:modelValue",
+		"update:searchValue",
+		"change"
+	],
 	setup(props, { attrs, emit, slots }) {
 		const parsed = computed(() => getParsedComboboxData(props.data));
 		const lockup = computed(() => getOptionsLockup(parsed.value));
@@ -31012,8 +31835,8 @@ var Select = defineComponent({
 		};
 		const changeValue = (value, option) => {
 			if (!controlled()) internal.value = value;
-			props.onChange?.(value, option);
 			emit("update:modelValue", value);
+			emit("change", value, option);
 		};
 		const combobox = useCombobox({
 			opened: () => props.dropdownOpened,
@@ -31134,7 +31957,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,
@@ -31201,15 +32024,18 @@ var Autocomplete = defineComponent({
 			default: true
 		}
 	},
-	emits: { "update:modelValue": (value) => typeof value === "string" },
+	emits: {
+		"update:modelValue": (value) => typeof value === "string",
+		change: (value) => typeof value === "string"
+	},
 	setup(props, { attrs, emit, slots }) {
 		const internal = ref(props.defaultValue);
 		const current = () => props.modelValue ?? props.value ?? internal.value;
 		const controlled = () => props.modelValue !== void 0 || props.value !== void 0;
 		const change = (value) => {
 			if (!controlled()) internal.value = value;
-			props.onChange?.(value);
 			emit("update:modelValue", value);
+			emit("change", value);
 			combobox.resetSelectedOption();
 		};
 		const parsed = computed(() => getParsedComboboxData(props.data));
@@ -31396,7 +32222,11 @@ var MultiSelect = defineComponent({
 		},
 		selectFirstOptionOnDropdownOpen: Boolean
 	},
-	emits: ["update:modelValue", "update:searchValue"],
+	emits: [
+		"update:modelValue",
+		"update:searchValue",
+		"change"
+	],
 	setup(props, { attrs, emit, slots }) {
 		const parsed = computed(() => getParsedComboboxData(props.data));
 		const lockup = computed(() => getOptionsLockup(parsed.value));
@@ -31414,8 +32244,8 @@ var MultiSelect = defineComponent({
 		};
 		const setValue = (value) => {
 			if (!controlled()) internal.value = value;
-			props.onChange?.(value);
 			emit("update:modelValue", value);
+			emit("change", value);
 		};
 		const combobox = useCombobox({
 			opened: () => props.dropdownOpened,
@@ -31496,12 +32326,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 +32371,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 +32383,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,
@@ -31654,7 +32485,11 @@ var TagsInput = defineComponent({
 		},
 		selectFirstOptionOnDropdownOpen: Boolean
 	},
-	emits: ["update:modelValue", "update:searchValue"],
+	emits: [
+		"update:modelValue",
+		"update:searchValue",
+		"change"
+	],
 	setup(props, { attrs, emit, slots }) {
 		const parsed = computed(() => getParsedComboboxData(props.data));
 		const lockup = computed(() => getOptionsLockup(parsed.value));
@@ -31671,8 +32506,8 @@ var TagsInput = defineComponent({
 		};
 		const setValue = (value) => {
 			if (!controlled()) internal.value = value;
-			props.onChange?.(value);
 			emit("update:modelValue", value);
+			emit("change", value);
 		};
 		const combobox = useCombobox({
 			opened: () => props.dropdownOpened,
@@ -31771,17 +32606,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 +32667,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 +32675,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 +32737,7 @@ var ColorInput_module_default = {
 var ColorInput = defineComponent({
 	name: "ColorInput",
 	inheritAttrs: false,
+	slots: Object,
 	props: {
 		modelValue: String,
 		value: String,
@@ -31945,7 +32781,7 @@ var ColorInput = defineComponent({
 			default: 7
 		}
 	},
-	emits: ["update:modelValue"],
+	emits: ["update:modelValue", "change"],
 	setup(props, { attrs, emit, slots }) {
 		const internal = ref(props.defaultValue);
 		const current = () => props.modelValue ?? props.value ?? internal.value;
@@ -31954,8 +32790,8 @@ var ColorInput = defineComponent({
 		const lastValid = ref(isColorValid(current()) ? current() : "");
 		const setValue = (value, end = false) => {
 			if (!controlled()) internal.value = value;
-			props.onChange?.(value);
 			emit("update:modelValue", value);
+			emit("change", value);
 			if (isColorValid(value)) {
 				lastValid.value = value;
 				if (end) props.onChangeEnd?.(convertHsvaTo(props.format, parseColor(value)));
@@ -31996,7 +32832,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 +32915,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 +33028,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 +33040,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 +33084,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, {
@@ -32363,15 +33199,19 @@ var TreeSelect = defineComponent({
 		},
 		chevronAriaLabels: Object
 	},
-	emits: ["update:modelValue", "update:searchValue"],
+	emits: [
+		"update:modelValue",
+		"update:searchValue",
+		"change"
+	],
 	setup(props, { attrs, emit, slots }) {
 		const isMulti = () => props.mode !== "single";
 		const internal = ref(props.defaultValue !== void 0 ? props.defaultValue : isMulti() ? [] : null);
-		const current = () => props.modelValue ?? props.value ?? internal.value;
+		const current = () => props.modelValue !== void 0 ? props.modelValue : props.value !== void 0 ? props.value : internal.value;
 		const setValue = (value) => {
 			if (props.modelValue === void 0 && props.value === void 0) internal.value = value;
-			props.onChange?.(value);
 			emit("update:modelValue", value);
+			emit("change", value);
 		};
 		const expandedInternal = ref(props.defaultExpandAll ? allValues(props.data) : props.defaultExpandedValues ?? []);
 		const expanded = () => props.expandedValues ?? expandedInternal.value;
@@ -32466,7 +33306,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 +33446,586 @@ 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",
+		"change"
+	],
+	setup(props, { attrs, emit, slots }) {
+		const id = useId(attrs.id);
+		const internalValue = ref(props.defaultValue ?? null);
+		const currentValue = computed(() => props.modelValue !== void 0 ? props.modelValue : props.value !== void 0 ? 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;
+			const selectedOptions = getCascaderPathOptions(props.data, value);
+			emit("update:modelValue", value);
+			emit("change", value, selectedOptions);
+		};
+		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