base-ui-vue 0.2.0 → 0.4.0

package/dist/index2.cjs

@@ -5,9 +5,11 @@ const require_checkbox_group_CheckboxGroup = require('./checkbox-group/CheckboxG
 const require_button_ToolbarButton = require('./button/ToolbarButton.cjs');
 const require_control_SliderControl = require('./control/SliderControl.cjs');
 const require_composite_composite = require('./composite/composite.cjs');
+const require_decrement_NumberFieldDecrement = require('./decrement/NumberFieldDecrement.cjs');
 const require_fallback_AvatarFallback = require('./fallback/AvatarFallback.cjs');
 const require_csp_provider_CSPContext = require('./csp-provider/CSPContext.cjs');
 const require_control_FieldControl = require('./control/FieldControl.cjs');
+const require_content_ScrollAreaContent = require('./content/ScrollAreaContent.cjs');
 const require_composite_constants = require('./composite/constants.cjs');
 let vue = require("vue");
 let _floating_ui_utils_dom = require("@floating-ui/utils/dom");
@@ -822,7 +824,7 @@ var CompositeList_default = CompositeList_vue_vue_type_script_setup_true_lang_de
 
 //#endregion
 //#region src/accordion/root/stateAttributesMapping.ts
-const rootStateAttributesMapping = { value: () => null };
+const rootStateAttributesMapping$1 = { value: () => null };
 
 //#endregion
 //#region src/accordion/root/AccordionRoot.vue?vue&type=script&setup=true&lang.ts
@@ -958,7 +960,7 @@ var AccordionRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				dir: direction.value,
 				role: "region"
 			})),
-			stateAttributesMapping: rootStateAttributesMapping,
+			stateAttributesMapping: rootStateAttributesMapping$1,
 			defaultTagName: "div"
 		});
 		return (_ctx, _cache) => {
@@ -2148,7 +2150,7 @@ function isOnlyValueMissing(state) {
 function useFieldValidation(params) {
 	const { formRef, clearErrors } = require_checkbox_group_CheckboxGroup.useFormContext();
 	const { controlId, getDescriptionProps, setValidityData, validate, validityData, validationDebounceTime, invalid, markedDirtyRef, state, name, shouldValidateOnChange } = params;
-	const timeout = require_fallback_AvatarFallback.useTimeout();
+	const timeout = require_decrement_NumberFieldDecrement.useTimeout();
 	const inputRef = (0, vue.shallowRef)(null);
 	function setInputRef(element) {
 		inputRef.value = element;
@@ -2610,31 +2612,3586 @@ var FieldsetLegend_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 });
 
 //#endregion
-//#region src/fieldset/legend/FieldsetLegend.vue
-var FieldsetLegend_default = FieldsetLegend_vue_vue_type_script_setup_true_lang_default;
+//#region src/fieldset/legend/FieldsetLegend.vue
+var FieldsetLegend_default = FieldsetLegend_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/fieldset/root/FieldsetRoot.vue?vue&type=script&setup=true&lang.ts
+/**
+* Groups a shared legend with related controls.
+* Renders a \`<fieldset>\` element.
+*
+* Documentation: [Base UI Vue Fieldset](https://baseui-vue.com/components/fieldset)
+*/
+var FieldsetRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "FieldsetRoot",
+	inheritAttrs: false,
+	__name: "FieldsetRoot",
+	props: {
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "fieldset"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const legendId = (0, vue.ref)(void 0);
+		function setLegendId(id) {
+			legendId.value = id;
+		}
+		const disabled = (0, vue.computed)(() => props.disabled ?? false);
+		const state = (0, vue.computed)(() => ({ disabled: disabled.value }));
+		(0, vue.provide)(fieldsetRootContextKey, {
+			legendId,
+			setLegendId,
+			disabled
+		});
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => ({
+				...attrs,
+				"aria-labelledby": legendId.value
+			})),
+			defaultTagName: "fieldset"
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/fieldset/root/FieldsetRoot.vue
+var FieldsetRoot_default = FieldsetRoot_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/input/Input.vue?vue&type=script&setup=true&lang.ts
+/**
+* A native input element that automatically works with
+* [Field](https://baseui-vue.com/docs/components/field).
+* Renders an `<input>` element.
+*
+* Documentation: [Base UI Vue Input](https://baseui-vue.com/docs/components/input)
+*/
+var Input_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "BaseUIInput",
+	inheritAttrs: false,
+	__name: "Input",
+	props: {
+		id: {
+			type: String,
+			required: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
+		value: {
+			type: String,
+			required: false
+		},
+		defaultValue: {
+			type: String,
+			required: false
+		},
+		autofocus: {
+			type: Boolean,
+			required: false
+		},
+		type: {
+			type: String,
+			required: false
+		},
+		required: {
+			type: Boolean,
+			required: false
+		},
+		pattern: {
+			type: String,
+			required: false
+		},
+		minlength: {
+			type: Number,
+			required: false
+		},
+		maxlength: {
+			type: Number,
+			required: false
+		},
+		min: {
+			type: [String, Number],
+			required: false
+		},
+		max: {
+			type: [String, Number],
+			required: false
+		},
+		step: {
+			type: [String, Number],
+			required: false
+		},
+		placeholder: {
+			type: String,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	emits: ["valueChange"],
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)(require_control_FieldControl.FieldControl_default, (0, vue.mergeProps)({
+				...props,
+				...(0, vue.unref)(attrs)
+			}, { onValueChange: _cache[0] || (_cache[0] = (v, e) => _ctx.$emit("valueChange", v, e)) }), (0, vue.createSlots)({ _: 2 }, [_ctx.$slots.default ? {
+				name: "default",
+				fn: (0, vue.withCtx)((slotProps) => [(0, vue.renderSlot)(_ctx.$slots, "default", (0, vue.normalizeProps)((0, vue.guardReactiveProps)(slotProps)))]),
+				key: "0"
+			} : void 0]), 1040);
+		};
+	}
+});
+
+//#endregion
+//#region src/input/Input.vue
+var Input_default = Input_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/input/InputDataAttributes.ts
+let InputDataAttributes = /* @__PURE__ */ function(InputDataAttributes) {
+	/**
+	* Present when the input is disabled.
+	*/
+	InputDataAttributes["disabled"] = "data-disabled";
+	/**
+	* Present when the input is in a valid state (when wrapped in FieldRoot).
+	*/
+	InputDataAttributes["valid"] = "data-valid";
+	/**
+	* Present when the input is in an invalid state (when wrapped in FieldRoot).
+	*/
+	InputDataAttributes["invalid"] = "data-invalid";
+	/**
+	* Present when the input has been touched (when wrapped in FieldRoot).
+	*/
+	InputDataAttributes["touched"] = "data-touched";
+	/**
+	* Present when the input's value has changed (when wrapped in FieldRoot).
+	*/
+	InputDataAttributes["dirty"] = "data-dirty";
+	/**
+	* Present when the input is filled (when wrapped in FieldRoot).
+	*/
+	InputDataAttributes["filled"] = "data-filled";
+	/**
+	* Present when the input is focused (when wrapped in FieldRoot).
+	*/
+	InputDataAttributes["focused"] = "data-focused";
+	return InputDataAttributes;
+}({});
+
+//#endregion
+//#region src/utils/valueToPercent.ts
+function valueToPercent(value, min, max) {
+	if (max === min) return 0;
+	return (value - min) * 100 / (max - min);
+}
+
+//#endregion
+//#region src/meter/root/MeterRootContext.ts
+const meterRootContextKey = Symbol("MeterRootContext");
+function useMeterRootContext(optional = false) {
+	const context = (0, vue.inject)(meterRootContextKey, void 0);
+	if (!context && !optional) throw new Error("Base UI Vue: MeterRootContext is missing. Meter parts must be placed within <MeterRoot>.");
+	return context;
+}
+
+//#endregion
+//#region src/meter/indicator/MeterIndicator.vue?vue&type=script&setup=true&lang.ts
+/**
+* Visualizes the position of the value along the range.
+* Renders a `<div>` element.
+*
+* Documentation: [Base UI Vue Meter](https://baseui-vue.com/docs/components/meter)
+*/
+var MeterIndicator_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "MeterIndicator",
+	inheritAttrs: false,
+	__name: "MeterIndicator",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const rootContext = useMeterRootContext();
+		const percentageWidth = (0, vue.computed)(() => valueToPercent(rootContext.value.value, rootContext.min.value, rootContext.max.value));
+		const state = (0, vue.computed)(() => ({}));
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps({ style: {
+				insetInlineStart: 0,
+				height: "inherit",
+				width: `${percentageWidth.value}%`
+			} }, attrs)),
+			defaultTagName: "div"
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/meter/indicator/MeterIndicator.vue
+var MeterIndicator_default = MeterIndicator_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/meter/label/MeterLabel.vue?vue&type=script&setup=true&lang.ts
+/**
+* An accessible label for the meter.
+* Renders a `<span>` element.
+*
+* Documentation: [Base UI Vue Meter](https://baseui-vue.com/docs/components/meter)
+*/
+var MeterLabel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "MeterLabel",
+	inheritAttrs: false,
+	__name: "MeterLabel",
+	props: {
+		id: {
+			type: String,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "span"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const { setLabelId } = useMeterRootContext();
+		const id = useRegisteredLabelId(() => props.id, setLabelId);
+		const state = (0, vue.computed)(() => ({}));
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => ({
+				...attrs,
+				id: id.value,
+				role: "presentation"
+			})),
+			defaultTagName: "span"
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/meter/label/MeterLabel.vue
+var MeterLabel_default = MeterLabel_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/meter/root/MeterRoot.vue?vue&type=script&setup=true&lang.ts
+/**
+* Groups all parts of the meter and provides the value for screen readers.
+* Renders a `<div>` element.
+*
+* Documentation: [Base UI Vue Meter](https://baseui-vue.com/docs/components/meter)
+*/
+var MeterRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "MeterRoot",
+	inheritAttrs: false,
+	__name: "MeterRoot",
+	props: {
+		ariaValuetext: {
+			type: String,
+			required: false
+		},
+		format: {
+			type: null,
+			required: false
+		},
+		getAriaValueText: {
+			type: Function,
+			required: false
+		},
+		locale: {
+			type: null,
+			required: false
+		},
+		max: {
+			type: Number,
+			required: false,
+			default: 100
+		},
+		min: {
+			type: Number,
+			required: false,
+			default: 0
+		},
+		value: {
+			type: Number,
+			required: true
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const labelId = (0, vue.ref)(void 0);
+		const formattedValue = (0, vue.computed)(() => require_decrement_NumberFieldDecrement.formatNumberValue(props.value, props.locale, props.format));
+		const ariaValueText = (0, vue.computed)(() => {
+			if (props.ariaValuetext !== void 0) return props.ariaValuetext;
+			if (props.getAriaValueText) return props.getAriaValueText(formattedValue.value, props.value);
+			if (props.format) return formattedValue.value;
+			return `${props.value}%`;
+		});
+		(0, vue.provide)(meterRootContextKey, {
+			formattedValue,
+			max: (0, vue.computed)(() => props.max),
+			min: (0, vue.computed)(() => props.min),
+			value: (0, vue.computed)(() => props.value),
+			setLabelId(id) {
+				labelId.value = id;
+			}
+		});
+		const state = (0, vue.computed)(() => ({}));
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => ({
+				"role": "meter",
+				"aria-labelledby": labelId.value,
+				"aria-valuemax": props.max,
+				"aria-valuemin": props.min,
+				"aria-valuenow": props.value,
+				"aria-valuetext": ariaValueText.value,
+				...attrs
+			})),
+			defaultTagName: "div"
+		});
+		const visuallyHiddenStyle = require_checkbox_index.visuallyHidden;
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [
+					(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value }),
+					(0, vue.createCommentVNode)(" Force NVDA to read the label https://github.com/mui/base-ui/issues/4184 "),
+					(0, vue.createElementVNode)("span", {
+						role: "presentation",
+						style: (0, vue.normalizeStyle)((0, vue.unref)(visuallyHiddenStyle))
+					}, "x", 4)
+				]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/meter/root/MeterRoot.vue
+var MeterRoot_default = MeterRoot_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/meter/track/MeterTrack.vue?vue&type=script&setup=true&lang.ts
+/**
+* Contains the meter indicator and represents the entire range of the meter.
+* Renders a `<div>` element.
+*
+* Documentation: [Base UI Vue Meter](https://baseui-vue.com/docs/components/meter)
+*/
+var MeterTrack_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "MeterTrack",
+	inheritAttrs: false,
+	__name: "MeterTrack",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const state = (0, vue.computed)(() => ({}));
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => ({ ...attrs })),
+			defaultTagName: "div"
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/meter/track/MeterTrack.vue
+var MeterTrack_default = MeterTrack_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/meter/value/MeterValue.vue?vue&type=script&setup=true&lang.ts
+/**
+* A text element displaying the current value.
+* Renders a `<span>` element.
+*
+* Documentation: [Base UI Vue Meter](https://baseui-vue.com/docs/components/meter)
+*/
+var MeterValue_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "MeterValue",
+	inheritAttrs: false,
+	__name: "MeterValue",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "span"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const { value, formattedValue } = useMeterRootContext();
+		const state = (0, vue.computed)(() => ({}));
+		const defaultDisplay = (0, vue.computed)(() => {
+			if (formattedValue.value) return formattedValue.value;
+			return value.value != null ? String(value.value) : "";
+		});
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => ({
+				"aria-hidden": true,
+				...attrs
+			})),
+			defaultTagName: "span"
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: state.value,
+				formattedValue: (0, vue.unref)(formattedValue),
+				value: (0, vue.unref)(value)
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", {
+					formattedValue: (0, vue.unref)(formattedValue),
+					value: (0, vue.unref)(value)
+				}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(defaultDisplay.value), 1)])]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/meter/value/MeterValue.vue
+var MeterValue_default = MeterValue_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/utils/useValueChanged.ts
+/**
+* Runs `onChange` whenever the watched value changes, passing the previous value.
+*
+* Mirrors the React `useValueChanged` helper: the callback fires after the DOM has
+* been updated (`flush: 'post'`), which makes it safe to read or move focus inside it.
+*/
+function useValueChanged(source, onChange) {
+	(0, vue.watch)(source, (_newValue, previousValue) => {
+		onChange(previousValue);
+	}, { flush: "post" });
+}
+
+//#endregion
+//#region src/number-field/utils/validate.ts
+const STEP_EPSILON_FACTOR = 1e-10;
+const DEFAULT_DIGITS = 3;
+function hasNumberFormatRoundingOptions(format) {
+	return format?.maximumFractionDigits != null || format?.minimumFractionDigits != null || format?.maximumSignificantDigits != null || format?.minimumSignificantDigits != null || format?.roundingIncrement != null || format?.roundingMode != null || format?.roundingPriority != null;
+}
+function removeFloatingPointErrors(value, format) {
+	if (!Number.isFinite(value)) return value;
+	if (!hasNumberFormatRoundingOptions(format)) return Number(value.toFixed(DEFAULT_DIGITS));
+	const formatter = require_decrement_NumberFieldDecrement.getFormatter("en-US", {
+		...format,
+		signDisplay: "auto",
+		currencySign: "standard",
+		notation: format.notation === "compact" ? "standard" : format.notation,
+		useGrouping: false
+	});
+	const roundedText = formatter.format(value);
+	const roundedValue = require_decrement_NumberFieldDecrement.parseNumber(roundedText, "en-US", format);
+	if (roundedValue === null) return value;
+	return formatter.format(roundedValue) === roundedText ? roundedValue : value;
+}
+function snapToStep(value, base, step, mode = "directional") {
+	const stepSize = Math.abs(step);
+	const direction = Math.sign(step);
+	const tolerance = stepSize * STEP_EPSILON_FACTOR * direction;
+	const rawSteps = value - base + tolerance;
+	if (mode === "nearest") return base + Math.round(rawSteps / step) * step;
+	return base + (direction > 0 ? Math.floor(rawSteps / stepSize) : Math.ceil(rawSteps / stepSize)) * stepSize;
+}
+function toValidatedNumber(value, { step, minWithDefault, maxWithDefault, minWithZeroDefault, format, snapOnStep, small, clamp: shouldClamp }) {
+	if (value === null) return value;
+	let nextValue = value;
+	if (step != null && snapOnStep && step !== 0) {
+		const base = small || minWithDefault === Number.MIN_SAFE_INTEGER ? minWithZeroDefault : minWithDefault;
+		nextValue = snapToStep(nextValue, base, step, small ? "nearest" : "directional");
+	}
+	if (shouldClamp) nextValue = require_control_SliderControl.clamp(nextValue, minWithDefault, maxWithDefault);
+	const roundedValue = removeFloatingPointErrors(nextValue, format);
+	return shouldClamp ? require_control_SliderControl.clamp(roundedValue, minWithDefault, maxWithDefault) : roundedValue;
+}
+
+//#endregion
+//#region src/number-field/input/NumberFieldInput.vue?vue&type=script&setup=true&lang.ts
+var NumberFieldInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "NumberFieldInput",
+	inheritAttrs: false,
+	__name: "NumberFieldInput",
+	props: {
+		as: {
+			type: null,
+			required: false
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrsObject = (0, vue.useAttrs)();
+		const NAVIGATE_KEYS = new Set([
+			"Backspace",
+			"Delete",
+			"ArrowLeft",
+			"ArrowRight",
+			"Tab",
+			"Enter",
+			"Escape"
+		]);
+		const { allowInputSyncRef, disabled, formatOptionsRef, getAllowedNonNumericKeys, getStepAmount, id, incrementValue, inputMode, inputValue, max, min, name, readOnly, required, setValue, state, setInputValue, locale, inputRef, value, onValueCommitted, lastChangedValueRef, hasPendingCommitRef, valueRef } = require_decrement_NumberFieldDecrement.useNumberFieldRootContext();
+		const { clearErrors } = require_checkbox_group_CheckboxGroup.useFormContext();
+		const { validationMode, setTouched, setFocused, invalid, shouldValidateOnChange, validation } = require_checkbox_group_CheckboxGroup.useFieldRootContext();
+		const { labelId } = require_checkbox_group_CheckboxGroup.useLabelableContext();
+		let hasTouchedInput = false;
+		let blockRevalidation = false;
+		function setInputRef(el) {
+			inputRef.value = el;
+		}
+		useValueChanged(value, () => {
+			clearErrors(name.value);
+			if (blockRevalidation && !shouldValidateOnChange()) {
+				blockRevalidation = false;
+				return;
+			}
+			validation.commit(value.value, true);
+		});
+		function onFocus(event) {
+			if (event.defaultPrevented || readOnly.value || disabled.value) return;
+			setFocused(true);
+			if (hasTouchedInput) return;
+			hasTouchedInput = true;
+			const target = event.currentTarget;
+			const length = target.value.length;
+			target.setSelectionRange(length, length);
+		}
+		function onBlur(event) {
+			if (event.defaultPrevented || readOnly.value || disabled.value) return;
+			setTouched(true);
+			setFocused(false);
+			const hadManualInput = !allowInputSyncRef.value;
+			const hadPendingProgrammaticChange = hasPendingCommitRef.value;
+			allowInputSyncRef.value = true;
+			if (inputValue.value.trim() === "") {
+				setValue(null, require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputClear, event));
+				if (validationMode.value === "onBlur") validation.commit(null);
+				onValueCommitted(null, require_checkbox_index.createGenericEventDetails(require_checkbox_index.REASONS.inputClear, event));
+				return;
+			}
+			const formatOptions = formatOptionsRef.value;
+			const parsedValue = require_decrement_NumberFieldDecrement.parseNumber(inputValue.value, locale.value, formatOptions);
+			if (parsedValue === null) return;
+			const hasRoundingOptions = hasNumberFormatRoundingOptions(formatOptions);
+			const committed = hasRoundingOptions ? removeFloatingPointErrors(parsedValue, formatOptions) : parsedValue;
+			const nextEventDetails = require_checkbox_index.createGenericEventDetails(require_checkbox_index.REASONS.inputBlur, event);
+			const shouldUpdateValue = value.value !== committed;
+			const shouldCommit = hadManualInput || shouldUpdateValue || hadPendingProgrammaticChange;
+			let committedValue = committed;
+			if (shouldUpdateValue) {
+				const changeDetails = require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputBlur, event);
+				blockRevalidation = true;
+				setValue(committed, changeDetails);
+				if (changeDetails.isCanceled) {
+					blockRevalidation = false;
+					return;
+				}
+				committedValue = lastChangedValueRef.value ?? committed;
+			}
+			if (validationMode.value === "onBlur") validation.commit(committedValue);
+			if (shouldCommit) onValueCommitted(committedValue, nextEventDetails);
+			const canonicalText = require_decrement_NumberFieldDecrement.formatNumber(committedValue, locale.value, formatOptions);
+			if (!(!hasRoundingOptions && parsedValue === value.value && inputValue.value === require_decrement_NumberFieldDecrement.formatNumberMaxPrecision(parsedValue, locale.value, formatOptions)) && inputValue.value !== canonicalText) setInputValue(canonicalText);
+		}
+		function onInput(event) {
+			if (event.defaultPrevented) return;
+			allowInputSyncRef.value = false;
+			const targetValue = event.currentTarget.value;
+			if (targetValue.trim() === "") {
+				setInputValue(targetValue);
+				setValue(null, require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputClear, event));
+				return;
+			}
+			const allowedNonNumericKeys = getAllowedNonNumericKeys();
+			if (!Array.from(targetValue).every((ch) => {
+				const isAsciiDigit = ch >= "0" && ch <= "9";
+				const isArabicNumeral = require_decrement_NumberFieldDecrement.ARABIC_DETECT_RE.test(ch);
+				const isHanNumeral = require_decrement_NumberFieldDecrement.HAN_DETECT_RE.test(ch);
+				const isPersianNumeral = require_decrement_NumberFieldDecrement.PERSIAN_DETECT_RE.test(ch);
+				const isFullwidthNumeral = require_decrement_NumberFieldDecrement.FULLWIDTH_DETECT_RE.test(ch);
+				const isMinus = require_decrement_NumberFieldDecrement.ANY_MINUS_DETECT_RE.test(ch);
+				return isAsciiDigit || isArabicNumeral || isHanNumeral || isPersianNumeral || isFullwidthNumeral || isMinus || allowedNonNumericKeys.has(ch);
+			})) return;
+			const parsedValue = require_decrement_NumberFieldDecrement.parseNumber(targetValue, locale.value, formatOptionsRef.value);
+			setInputValue(targetValue);
+			if (parsedValue !== null) setValue(parsedValue, require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputChange, event));
+		}
+		function onKeydown(event) {
+			if (event.defaultPrevented || readOnly.value || disabled.value) return;
+			allowInputSyncRef.value = true;
+			const allowedNonNumericKeys = getAllowedNonNumericKeys();
+			let isAllowedNonNumericKey = allowedNonNumericKeys.has(event.key);
+			const { decimal, currency, percentSign } = require_decrement_NumberFieldDecrement.getNumberLocaleDetails(locale.value, formatOptionsRef.value);
+			const target = event.currentTarget;
+			const selectionStart = target.selectionStart;
+			const selectionEnd = target.selectionEnd;
+			const isAllSelected = selectionStart === 0 && selectionEnd === inputValue.value.length;
+			const selectionContainsIndex = (index) => selectionStart != null && selectionEnd != null && index >= selectionStart && index < selectionEnd;
+			if (require_decrement_NumberFieldDecrement.ANY_MINUS_DETECT_RE.test(event.key) && Array.from(allowedNonNumericKeys).some((k) => require_decrement_NumberFieldDecrement.ANY_MINUS_DETECT_RE.test(k || ""))) {
+				const existingIndex = inputValue.value.search(require_decrement_NumberFieldDecrement.ANY_MINUS_RE);
+				const isReplacingExisting = existingIndex != null && existingIndex !== -1 && selectionContainsIndex(existingIndex);
+				isAllowedNonNumericKey = !(require_decrement_NumberFieldDecrement.ANY_MINUS_DETECT_RE.test(inputValue.value) || require_decrement_NumberFieldDecrement.ANY_PLUS_DETECT_RE.test(inputValue.value)) || isAllSelected || isReplacingExisting;
+			}
+			if (require_decrement_NumberFieldDecrement.ANY_PLUS_DETECT_RE.test(event.key) && Array.from(allowedNonNumericKeys).some((k) => require_decrement_NumberFieldDecrement.ANY_PLUS_DETECT_RE.test(k || ""))) {
+				const existingIndex = inputValue.value.search(require_decrement_NumberFieldDecrement.ANY_PLUS_RE);
+				const isReplacingExisting = existingIndex != null && existingIndex !== -1 && selectionContainsIndex(existingIndex);
+				isAllowedNonNumericKey = !(require_decrement_NumberFieldDecrement.ANY_MINUS_DETECT_RE.test(inputValue.value) || require_decrement_NumberFieldDecrement.ANY_PLUS_DETECT_RE.test(inputValue.value)) || isAllSelected || isReplacingExisting;
+			}
+			[
+				decimal,
+				currency,
+				percentSign
+			].forEach((symbol) => {
+				if (event.key === symbol && symbol) {
+					const isSymbolHighlighted = selectionContainsIndex(inputValue.value.indexOf(symbol));
+					isAllowedNonNumericKey = !inputValue.value.includes(symbol) || isAllSelected || isSymbolHighlighted;
+				}
+			});
+			const isAsciiDigit = event.key >= "0" && event.key <= "9";
+			const isArabicNumeral = require_decrement_NumberFieldDecrement.ARABIC_DETECT_RE.test(event.key);
+			const isHanNumeral = require_decrement_NumberFieldDecrement.HAN_DETECT_RE.test(event.key);
+			const isPersianNumeral = require_decrement_NumberFieldDecrement.PERSIAN_DETECT_RE.test(event.key);
+			const isFullwidthNumeral = require_decrement_NumberFieldDecrement.FULLWIDTH_DETECT_RE.test(event.key);
+			const isNavigateKey = NAVIGATE_KEYS.has(event.key);
+			const isStepKey = event.key === "ArrowUp" || event.key === "ArrowDown";
+			if (event.which === 229 || event.altKey && !isStepKey || event.ctrlKey || event.metaKey || isAllowedNonNumericKey || isAsciiDigit || isArabicNumeral || isFullwidthNumeral || isHanNumeral || isPersianNumeral || isNavigateKey) return;
+			const parsedValue = require_decrement_NumberFieldDecrement.parseNumber(inputValue.value, locale.value, formatOptionsRef.value);
+			const amount = getStepAmount(event) ?? require_decrement_NumberFieldDecrement.DEFAULT_STEP;
+			stopEvent(event);
+			const commitDetails = require_checkbox_index.createGenericEventDetails(require_checkbox_index.REASONS.keyboard, event);
+			if (event.key === "ArrowUp") {
+				incrementValue(amount, {
+					direction: 1,
+					currentValue: parsedValue,
+					event,
+					reason: require_checkbox_index.REASONS.keyboard
+				});
+				onValueCommitted(lastChangedValueRef.value ?? valueRef.value, commitDetails);
+			} else if (event.key === "ArrowDown") {
+				incrementValue(amount, {
+					direction: -1,
+					currentValue: parsedValue,
+					event,
+					reason: require_checkbox_index.REASONS.keyboard
+				});
+				onValueCommitted(lastChangedValueRef.value ?? valueRef.value, commitDetails);
+			} else if (event.key === "Home" && min.value != null) {
+				setValue(min.value, require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.keyboard, event));
+				onValueCommitted(lastChangedValueRef.value ?? valueRef.value, commitDetails);
+			} else if (event.key === "End" && max.value != null) {
+				setValue(max.value, require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.keyboard, event));
+				onValueCommitted(lastChangedValueRef.value ?? valueRef.value, commitDetails);
+			}
+		}
+		function onPaste(event) {
+			if (event.defaultPrevented || readOnly.value || disabled.value) return;
+			let pastedData = "";
+			try {
+				pastedData = event.clipboardData?.getData("text/plain") ?? "";
+			} catch {
+				if (process.env.NODE_ENV !== "production") warn("<NumberFieldInput> could not read clipboard text during paste handling.");
+				return;
+			}
+			event.preventDefault();
+			const parsedValue = require_decrement_NumberFieldDecrement.parseNumber(pastedData, locale.value, formatOptionsRef.value);
+			if (parsedValue !== null) {
+				allowInputSyncRef.value = false;
+				setValue(parsedValue, require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputPaste, event));
+				setInputValue(pastedData);
+			}
+		}
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps(attrsObject, validation.getValidationProps(), {
+				"id": id.value,
+				"required": required.value,
+				"disabled": disabled.value,
+				"readonly": readOnly.value,
+				"inputmode": inputMode.value,
+				"value": inputValue.value,
+				"type": "text",
+				"autocomplete": "off",
+				"autocorrect": "off",
+				"spellcheck": "false",
+				"aria-roledescription": "Number field",
+				"aria-invalid": !disabled.value && invalid.value ? true : void 0,
+				"aria-labelledby": labelId.value,
+				"onFocus": onFocus,
+				"onBlur": onBlur,
+				"onInput": onInput,
+				"onKeydown": onKeydown,
+				"onPaste": onPaste
+			})),
+			stateAttributesMapping: require_decrement_NumberFieldDecrement.stateAttributesMapping,
+			defaultTagName: "input",
+			ref: setInputRef
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				ref: (0, vue.unref)(renderRef),
+				props: (0, vue.unref)(mergedProps),
+				state: (0, vue.unref)(state)
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+				key: 1,
+				ref: (0, vue.unref)(renderRef)
+			}, (0, vue.unref)(mergedProps)), null, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/number-field/input/NumberFieldInput.vue
+var NumberFieldInput_default = NumberFieldInput_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/utils/detectBrowser.ts
+const ua = typeof navigator !== "undefined" ? navigator.userAgent : "";
+const platform = typeof navigator !== "undefined" ? navigator.platform : "";
+const maxTouchPoints = typeof navigator !== "undefined" ? navigator.maxTouchPoints : 0;
+const isWebKit = typeof CSS !== "undefined" && typeof CSS.supports === "function" ? CSS.supports("-webkit-backdrop-filter:none") && !/chrome|android/i.test(ua) : /\b(?:iphone|ipad|ipod)\b/i.test(ua);
+const isFirefox = /firefox/i.test(ua);
+const isIOS = /\b(?:iphone|ipad|ipod)\b/i.test(ua) || platform === "MacIntel" && maxTouchPoints > 1;
+
+//#endregion
+//#region src/number-field/root/NumberFieldRoot.vue?vue&type=script&setup=true&lang.ts
+var NumberFieldRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "NumberFieldRoot",
+	inheritAttrs: false,
+	__name: "NumberFieldRoot",
+	props: {
+		id: {
+			type: String,
+			required: false
+		},
+		min: {
+			type: Number,
+			required: false
+		},
+		max: {
+			type: Number,
+			required: false
+		},
+		allowOutOfRange: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		smallStep: {
+			type: Number,
+			required: false,
+			default: .1
+		},
+		step: {
+			type: [Number, String],
+			required: false,
+			default: 1
+		},
+		largeStep: {
+			type: Number,
+			required: false,
+			default: 10
+		},
+		required: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		readOnly: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		form: {
+			type: String,
+			required: false
+		},
+		value: {
+			type: [Number, null],
+			required: false
+		},
+		defaultValue: {
+			type: Number,
+			required: false
+		},
+		allowWheelScrub: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		snapOnStep: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		format: {
+			type: null,
+			required: false
+		},
+		locale: {
+			type: null,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	emits: ["valueChange", "valueCommitted"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const attrsObject = (0, vue.useAttrs)();
+		const { setDirty, validityData, disabled: fieldDisabled, setFilled, invalid, name: fieldName, state: fieldState, validation } = require_checkbox_group_CheckboxGroup.useFieldRootContext();
+		const { clearErrors } = require_checkbox_group_CheckboxGroup.useFormContext();
+		const disabled = (0, vue.computed)(() => fieldDisabled.value || props.disabled);
+		const readOnly = (0, vue.computed)(() => props.readOnly);
+		const required = (0, vue.computed)(() => props.required);
+		const nameProp = (0, vue.computed)(() => props.name);
+		const name = (0, vue.computed)(() => fieldName.value ?? props.name);
+		const step = (0, vue.computed)(() => props.step === "any" ? 1 : props.step);
+		const smallStep = (0, vue.computed)(() => props.smallStep);
+		const largeStep = (0, vue.computed)(() => props.largeStep);
+		const locale = (0, vue.computed)(() => props.locale);
+		const format = (0, vue.computed)(() => props.format);
+		const min = (0, vue.computed)(() => props.min);
+		const max = (0, vue.computed)(() => props.max);
+		const minWithDefault = (0, vue.computed)(() => props.min ?? Number.MIN_SAFE_INTEGER);
+		const maxWithDefault = (0, vue.computed)(() => props.max ?? Number.MAX_SAFE_INTEGER);
+		const minWithZeroDefault = (0, vue.computed)(() => props.min ?? 0);
+		const formatStyle = (0, vue.computed)(() => props.format?.style);
+		const isScrubbingRef = (0, vue.ref)(false);
+		function setIsScrubbing(value) {
+			isScrubbingRef.value = value;
+		}
+		const inputRef = (0, vue.ref)(null);
+		const validationInputRef = (0, vue.ref)(null);
+		const id = require_control_FieldControl.useLabelableId({ id: (0, vue.computed)(() => props.id) });
+		const { value: valueUnwrapped, setValue: setValueUnwrapped } = require_checkbox_group_CheckboxGroup.useControllableState({
+			controlled: () => props.value,
+			default: () => props.defaultValue ?? null,
+			name: "NumberField",
+			state: "value"
+		});
+		const value = (0, vue.computed)(() => valueUnwrapped.value ?? null);
+		const valueRef = (0, vue.ref)(value.value);
+		(0, vue.watch)(value, (next) => {
+			valueRef.value = next;
+		}, { flush: "post" });
+		const formatOptionsRef = format;
+		const hasPendingCommitRef = (0, vue.ref)(false);
+		const allowInputSyncRef = (0, vue.ref)(true);
+		const lastChangedValueRef = (0, vue.ref)(null);
+		function onValueCommitted(nextValue, eventDetails) {
+			hasPendingCommitRef.value = false;
+			emit("valueCommitted", nextValue, eventDetails);
+		}
+		function getControlledInputValue(nextValue) {
+			return hasNumberFormatRoundingOptions(format.value) ? require_decrement_NumberFieldDecrement.formatNumber(nextValue, locale.value, format.value) : require_decrement_NumberFieldDecrement.formatNumberMaxPrecision(nextValue, locale.value, format.value);
+		}
+		const inputValue = (0, vue.ref)(props.value !== void 0 ? getControlledInputValue(value.value) : require_decrement_NumberFieldDecrement.formatNumber(value.value, locale.value, format.value));
+		function setInputValue(next) {
+			inputValue.value = next;
+		}
+		const inputMode = (0, vue.ref)("numeric");
+		(0, vue.watchEffect)(() => {
+			setFilled(value.value !== null);
+		});
+		(0, vue.watchEffect)(() => {
+			validation.setInputRef(validationInputRef.value);
+		});
+		require_checkbox_group_CheckboxGroup.useField({
+			enabled: (0, vue.computed)(() => !disabled.value),
+			id,
+			name,
+			commit: (v) => validation.commit(v),
+			value,
+			getValue: () => value.value,
+			controlRef: inputRef
+		});
+		function getAllowedNonNumericKeys() {
+			const { decimal, group, currency, literal } = require_decrement_NumberFieldDecrement.getNumberLocaleDetails(locale.value, format.value);
+			const keys = /* @__PURE__ */ new Set();
+			require_decrement_NumberFieldDecrement.BASE_NON_NUMERIC_SYMBOLS.forEach((symbol) => keys.add(symbol));
+			if (decimal) keys.add(decimal);
+			if (group) {
+				keys.add(group);
+				if (require_decrement_NumberFieldDecrement.SPACE_SEPARATOR_RE.test(group)) keys.add(" ");
+			}
+			const allowPercentSymbols = formatStyle.value === "percent" || formatStyle.value === "unit" && format.value?.unit === "percent";
+			const allowPermilleSymbols = formatStyle.value === "percent" || formatStyle.value === "unit" && format.value?.unit === "permille";
+			if (allowPercentSymbols) require_decrement_NumberFieldDecrement.PERCENTAGES.forEach((key) => keys.add(key));
+			if (allowPermilleSymbols) require_decrement_NumberFieldDecrement.PERMILLE.forEach((key) => keys.add(key));
+			if (formatStyle.value === "currency" && currency) keys.add(currency);
+			if (literal) {
+				Array.from(literal).forEach((char) => keys.add(char));
+				if (require_decrement_NumberFieldDecrement.SPACE_SEPARATOR_RE.test(literal)) keys.add(" ");
+			}
+			require_decrement_NumberFieldDecrement.PLUS_SIGNS_WITH_ASCII.forEach((key) => keys.add(key));
+			if (minWithDefault.value < 0) require_decrement_NumberFieldDecrement.MINUS_SIGNS_WITH_ASCII.forEach((key) => keys.add(key));
+			return keys;
+		}
+		function getStepAmount(event) {
+			if (event?.altKey) return smallStep.value;
+			if (event?.shiftKey) return largeStep.value;
+			return step.value;
+		}
+		function setValue(unvalidatedValue, details) {
+			const eventWithOptionalKeyState = details.event;
+			const dir = details.direction;
+			const reason = details.reason;
+			const shouldClampValue = !props.allowOutOfRange || !(reason === require_checkbox_index.REASONS.inputChange || reason === require_checkbox_index.REASONS.inputBlur || reason === require_checkbox_index.REASONS.inputPaste || reason === require_checkbox_index.REASONS.inputClear || reason === require_checkbox_index.REASONS.none);
+			const validatedValue = toValidatedNumber(unvalidatedValue, {
+				step: dir ? getStepAmount(eventWithOptionalKeyState) * dir : void 0,
+				format: formatOptionsRef.value,
+				minWithDefault: minWithDefault.value,
+				maxWithDefault: maxWithDefault.value,
+				minWithZeroDefault: minWithZeroDefault.value,
+				snapOnStep: props.snapOnStep,
+				small: eventWithOptionalKeyState?.altKey ?? false,
+				clamp: shouldClampValue
+			});
+			const isInputReason = details.reason === require_checkbox_index.REASONS.inputChange || details.reason === require_checkbox_index.REASONS.inputClear || details.reason === require_checkbox_index.REASONS.inputBlur || details.reason === require_checkbox_index.REASONS.inputPaste || details.reason === require_checkbox_index.REASONS.none;
+			const shouldFireChange = validatedValue !== value.value || isInputReason && (unvalidatedValue !== value.value || allowInputSyncRef.value === false);
+			if (shouldFireChange) {
+				emit("valueChange", validatedValue, details);
+				if (details.isCanceled) return shouldFireChange;
+				setValueUnwrapped(validatedValue);
+				setDirty(validatedValue !== validityData.value.initialValue);
+				hasPendingCommitRef.value = true;
+			}
+			lastChangedValueRef.value = validatedValue;
+			if (allowInputSyncRef.value) setInputValue(props.value !== void 0 ? getControlledInputValue(value.value) : require_decrement_NumberFieldDecrement.formatNumber(validatedValue, locale.value, format.value));
+			return shouldFireChange;
+		}
+		function incrementValue(amount, { direction, currentValue, event, reason }) {
+			const prevValue = currentValue == null ? valueRef.value : currentValue;
+			return setValue(typeof prevValue === "number" ? prevValue + amount * direction : Math.max(0, props.min ?? 0), require_checkbox_index.createChangeEventDetails(reason, event, void 0, { direction }));
+		}
+		(0, vue.watch)([
+			value,
+			locale,
+			format
+		], () => {
+			if (!allowInputSyncRef.value) return;
+			const nextInputValue = props.value !== void 0 ? getControlledInputValue(value.value) : require_decrement_NumberFieldDecrement.formatNumber(value.value, locale.value, format.value);
+			if (nextInputValue !== inputValue.value) setInputValue(nextInputValue);
+		}, { flush: "post" });
+		(0, vue.watchEffect)(() => {
+			if (!isIOS) return;
+			let computedInputMode = "text";
+			if (minWithDefault.value >= 0) computedInputMode = "decimal";
+			inputMode.value = computedInputMode;
+		});
+		(0, vue.watchEffect)((onCleanup) => {
+			const element = inputRef.value;
+			if (disabled.value || readOnly.value || !props.allowWheelScrub || !element) return;
+			function handleWheel(event) {
+				if (event.ctrlKey || require_control_SliderControl.activeElement(require_control_SliderControl.ownerDocument(inputRef.value)) !== inputRef.value) return;
+				event.preventDefault();
+				allowInputSyncRef.value = true;
+				incrementValue(getStepAmount(event) ?? require_decrement_NumberFieldDecrement.DEFAULT_STEP, {
+					direction: event.deltaY > 0 ? -1 : 1,
+					event,
+					reason: "wheel"
+				});
+			}
+			element.addEventListener("wheel", handleWheel, { passive: false });
+			onCleanup(() => {
+				element.removeEventListener("wheel", handleWheel);
+			});
+		});
+		const state = (0, vue.computed)(() => ({
+			...fieldState.value,
+			disabled: disabled.value,
+			readOnly: readOnly.value,
+			required: required.value,
+			value: value.value,
+			inputValue: inputValue.value,
+			scrubbing: isScrubbingRef.value
+		}));
+		(0, vue.provide)(require_decrement_NumberFieldDecrement.numberFieldRootContextKey, {
+			inputRef,
+			inputValue,
+			value,
+			minWithDefault,
+			maxWithDefault,
+			disabled,
+			readOnly,
+			id,
+			setValue,
+			incrementValue,
+			getStepAmount,
+			allowInputSyncRef,
+			formatOptionsRef,
+			valueRef,
+			lastChangedValueRef,
+			hasPendingCommitRef,
+			name,
+			nameProp,
+			required,
+			invalid,
+			inputMode,
+			getAllowedNonNumericKeys,
+			min,
+			max,
+			setInputValue,
+			locale,
+			isScrubbing: isScrubbingRef,
+			setIsScrubbing,
+			state,
+			onValueCommitted
+		});
+		const { tag: rootTag, mergedProps: rootMergedProps, renderless: rootRenderless, ref: rootRenderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: attrsObject,
+			stateAttributesMapping: require_decrement_NumberFieldDecrement.stateAttributesMapping,
+			defaultTagName: "div",
+			ref: (0, vue.ref)(null)
+		});
+		const hiddenInputProps = (0, vue.computed)(() => ({
+			...validation.getValidationProps(),
+			"type": "number",
+			"form": props.form,
+			"name": name.value,
+			"value": value.value ?? "",
+			"min": props.min,
+			"max": props.max,
+			"step": props.step,
+			"disabled": disabled.value,
+			"required": required.value,
+			"aria-hidden": true,
+			"tabindex": -1,
+			"style": name.value ? require_checkbox_index.visuallyHiddenInput : require_checkbox_index.visuallyHidden
+		}));
+		function handleHiddenFocus() {
+			inputRef.value?.focus();
+		}
+		function handleHiddenInput(event) {
+			const target = event.currentTarget;
+			if (event.defaultPrevented || disabled.value || readOnly.value) return;
+			const nextValue = target.valueAsNumber;
+			const parsedValue = Number.isNaN(nextValue) ? null : nextValue;
+			const details = require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.none, event);
+			setDirty(parsedValue !== validityData.value.initialValue);
+			setValue(parsedValue, details);
+			clearErrors(name.value);
+			validation.commit(parsedValue, true);
+		}
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [!(0, vue.unref)(rootRenderless) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(rootTag)), (0, vue.mergeProps)({
+				key: 0,
+				ref: (0, vue.unref)(rootRenderRef)
+			}, (0, vue.unref)(rootMergedProps)), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value })]),
+				_: 3
+			}, 16)) : (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 1,
+				ref: (0, vue.unref)(rootRenderRef),
+				props: (0, vue.unref)(rootMergedProps),
+				state: state.value
+			}), (0, vue.createElementVNode)("input", (0, vue.mergeProps)({
+				ref_key: "validationInputRef",
+				ref: validationInputRef
+			}, hiddenInputProps.value, {
+				suppresshydrationwarning: "",
+				onInput: handleHiddenInput,
+				onFocus: handleHiddenFocus
+			}), null, 16)], 64);
+		};
+	}
+});
+
+//#endregion
+//#region src/number-field/root/NumberFieldRoot.vue
+var NumberFieldRoot_default = NumberFieldRoot_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/number-field/scrub-area/NumberFieldScrubAreaContext.ts
+const numberFieldScrubAreaContextKey = Symbol("NumberFieldScrubAreaContext");
+function useNumberFieldScrubAreaContext() {
+	const context = (0, vue.inject)(numberFieldScrubAreaContextKey, void 0);
+	if (context === void 0) throw new Error("Base UI Vue: NumberFieldScrubAreaContext is missing. NumberFieldScrubArea parts must be placed within <NumberFieldScrubArea>.");
+	return context;
+}
+
+//#endregion
+//#region src/number-field/scrub-area-cursor/NumberFieldScrubAreaCursor.vue?vue&type=script&setup=true&lang.ts
+var NumberFieldScrubAreaCursor_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "NumberFieldScrubAreaCursor",
+	inheritAttrs: false,
+	__name: "NumberFieldScrubAreaCursor",
+	props: {
+		as: {
+			type: null,
+			required: false
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrsObject = (0, vue.useAttrs)();
+		const { state } = require_decrement_NumberFieldDecrement.useNumberFieldRootContext();
+		const { isScrubbing, isTouchInput, isPointerLockDenied, scrubAreaCursorRef } = useNumberFieldScrubAreaContext();
+		const shouldRender = (0, vue.computed)(() => isScrubbing.value && !isWebKit && !isTouchInput.value && !isPointerLockDenied.value);
+		function setCursorRef(el) {
+			scrubAreaCursorRef.value = el;
+		}
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps({
+				role: "presentation",
+				style: {
+					position: "fixed",
+					top: 0,
+					left: 0,
+					pointerEvents: "none"
+				}
+			}, attrsObject)),
+			stateAttributesMapping: require_decrement_NumberFieldDecrement.stateAttributesMapping,
+			defaultTagName: "span",
+			ref: setCursorRef
+		});
+		return (_ctx, _cache) => {
+			return shouldRender.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(vue.Teleport, {
+				key: 0,
+				to: "body"
+			}, [(0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				ref: (0, vue.unref)(renderRef),
+				props: (0, vue.unref)(mergedProps),
+				state: (0, vue.unref)(state)
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+				key: 1,
+				ref: (0, vue.unref)(renderRef)
+			}, (0, vue.unref)(mergedProps)), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: (0, vue.unref)(state) })]),
+				_: 3
+			}, 16))])) : (0, vue.createCommentVNode)("v-if", true);
+		};
+	}
+});
+
+//#endregion
+//#region src/number-field/scrub-area-cursor/NumberFieldScrubAreaCursor.vue
+var NumberFieldScrubAreaCursor_default = NumberFieldScrubAreaCursor_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/number-field/utils/getViewportRect.ts
+function getViewportRect(teleportDistance, scrubAreaEl) {
+	const win = (0, _floating_ui_utils_dom.getWindow)(scrubAreaEl);
+	const rect = scrubAreaEl.getBoundingClientRect();
+	if (rect && teleportDistance != null) return {
+		x: rect.left - teleportDistance / 2,
+		y: rect.top - teleportDistance / 2,
+		width: rect.right + teleportDistance / 2,
+		height: rect.bottom + teleportDistance / 2
+	};
+	const vV = win.visualViewport;
+	if (vV) return {
+		x: vV.offsetLeft,
+		y: vV.offsetTop,
+		width: vV.offsetLeft + vV.width,
+		height: vV.offsetTop + vV.height
+	};
+	return {
+		x: 0,
+		y: 0,
+		width: win.document.documentElement.clientWidth,
+		height: win.document.documentElement.clientHeight
+	};
+}
+
+//#endregion
+//#region src/number-field/utils/subscribeToVisualViewportResize.ts
+function subscribeToVisualViewportResize(element, visualScaleRef) {
+	const vV = (0, _floating_ui_utils_dom.getWindow)(element).visualViewport;
+	if (!vV) return () => {};
+	function handleVisualResize() {
+		if (vV) visualScaleRef.value = vV.scale;
+	}
+	handleVisualResize();
+	vV.addEventListener("resize", handleVisualResize);
+	return () => {
+		vV.removeEventListener("resize", handleVisualResize);
+	};
+}
+
+//#endregion
+//#region src/number-field/scrub-area/NumberFieldScrubArea.vue?vue&type=script&setup=true&lang.ts
+var NumberFieldScrubArea_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "NumberFieldScrubArea",
+	inheritAttrs: false,
+	__name: "NumberFieldScrubArea",
+	props: {
+		direction: {
+			type: String,
+			required: false,
+			default: "horizontal"
+		},
+		pixelSensitivity: {
+			type: Number,
+			required: false,
+			default: 2
+		},
+		teleportDistance: {
+			type: Number,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "span"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrsObject = (0, vue.useAttrs)();
+		const { state, setIsScrubbing: setRootScrubbing, disabled, readOnly, inputRef, incrementValue, allowInputSyncRef, getStepAmount, onValueCommitted, lastChangedValueRef, valueRef } = require_decrement_NumberFieldDecrement.useNumberFieldRootContext();
+		const direction = (0, vue.computed)(() => props.direction);
+		const pixelSensitivity = (0, vue.computed)(() => props.pixelSensitivity);
+		const teleportDistance = (0, vue.computed)(() => props.teleportDistance);
+		const scrubAreaRef = (0, vue.ref)(null);
+		const scrubAreaCursorRef = (0, vue.ref)(null);
+		let isScrubbingInternal = false;
+		let didMove = false;
+		let pointerDownTarget = null;
+		let virtualCursorCoords = {
+			x: 0,
+			y: 0
+		};
+		const visualScaleRef = (0, vue.ref)(1);
+		const exitPointerLockTimeout = require_decrement_NumberFieldDecrement.useTimeout();
+		const isTouchInput = (0, vue.ref)(false);
+		const isPointerLockDenied = (0, vue.ref)(false);
+		const isScrubbing = (0, vue.ref)(false);
+		(0, vue.watch)(isScrubbing, (scrubbing, _prev, onCleanup) => {
+			if (!scrubbing || !scrubAreaCursorRef.value) return;
+			onCleanup(subscribeToVisualViewportResize(scrubAreaCursorRef.value, visualScaleRef));
+		}, { flush: "post" });
+		function updateCursorTransform(x, y) {
+			if (scrubAreaCursorRef.value) scrubAreaCursorRef.value.style.transform = `translate3d(${x}px,${y}px,0) scale(${1 / visualScaleRef.value})`;
+		}
+		function onScrub({ movementX, movementY }) {
+			const virtualCursor = scrubAreaCursorRef.value;
+			const scrubAreaEl = scrubAreaRef.value;
+			if (!virtualCursor || !scrubAreaEl) return;
+			const rect = getViewportRect(teleportDistance.value, scrubAreaEl);
+			const coords = virtualCursorCoords;
+			const newCoords = {
+				x: Math.round(coords.x + movementX),
+				y: Math.round(coords.y + movementY)
+			};
+			const cursorWidth = virtualCursor.offsetWidth;
+			const cursorHeight = virtualCursor.offsetHeight;
+			if (newCoords.x + cursorWidth / 2 < rect.x) newCoords.x = rect.width - cursorWidth / 2;
+			else if (newCoords.x + cursorWidth / 2 > rect.width) newCoords.x = rect.x - cursorWidth / 2;
+			if (newCoords.y + cursorHeight / 2 < rect.y) newCoords.y = rect.height - cursorHeight / 2;
+			else if (newCoords.y + cursorHeight / 2 > rect.height) newCoords.y = rect.y - cursorHeight / 2;
+			virtualCursorCoords = newCoords;
+			updateCursorTransform(newCoords.x, newCoords.y);
+		}
+		function onScrubbingChange(scrubbingValue, { clientX, clientY }) {
+			isScrubbing.value = scrubbingValue;
+			setRootScrubbing(scrubbingValue);
+			const virtualCursor = scrubAreaCursorRef.value;
+			if (!virtualCursor || !scrubbingValue) return;
+			const initialCoords = {
+				x: clientX - virtualCursor.offsetWidth / 2,
+				y: clientY - virtualCursor.offsetHeight / 2
+			};
+			virtualCursorCoords = initialCoords;
+			updateCursorTransform(initialCoords.x, initialCoords.y);
+		}
+		(0, vue.watch)([
+			isScrubbing,
+			disabled,
+			readOnly
+		], (_value, _prev, onCleanup) => {
+			if (!inputRef.value || disabled.value || readOnly.value || !isScrubbing.value) return;
+			let cumulativeDelta = 0;
+			function handleScrubPointerUp(event) {
+				function handler() {
+					try {
+						require_control_SliderControl.ownerDocument(scrubAreaRef.value)?.exitPointerLock();
+					} catch {} finally {
+						isScrubbingInternal = false;
+						onScrubbingChange(false, event);
+						onValueCommitted(lastChangedValueRef.value ?? valueRef.value, require_checkbox_index.createGenericEventDetails(require_checkbox_index.REASONS.scrub, event));
+						const target = pointerDownTarget;
+						const input = inputRef.value;
+						if (!didMove && target != null && input) target.dispatchEvent(new ((0, _floating_ui_utils_dom.getWindow)(input)).MouseEvent("click", {
+							bubbles: true,
+							cancelable: true
+						}));
+						didMove = false;
+						pointerDownTarget = null;
+					}
+				}
+				if (isFirefox) exitPointerLockTimeout.start(20, handler);
+				else handler();
+			}
+			function handleScrubPointerMove(event) {
+				if (!isScrubbingInternal) return;
+				event.preventDefault();
+				onScrub(event);
+				const { movementX, movementY } = event;
+				cumulativeDelta += direction.value === "vertical" ? movementY : movementX;
+				if (Math.abs(cumulativeDelta) >= pixelSensitivity.value) {
+					cumulativeDelta = 0;
+					didMove = true;
+					const rawAmount = (direction.value === "vertical" ? -movementY : movementX) * (getStepAmount(event) ?? require_decrement_NumberFieldDecrement.DEFAULT_STEP);
+					if (rawAmount !== 0) {
+						allowInputSyncRef.value = true;
+						incrementValue(Math.abs(rawAmount), {
+							direction: rawAmount >= 0 ? 1 : -1,
+							event,
+							reason: require_checkbox_index.REASONS.scrub
+						});
+					}
+				}
+			}
+			const win = (0, _floating_ui_utils_dom.getWindow)(inputRef.value);
+			win.addEventListener("pointerup", handleScrubPointerUp, true);
+			win.addEventListener("pointermove", handleScrubPointerMove, true);
+			onCleanup(() => {
+				exitPointerLockTimeout.clear();
+				win.removeEventListener("pointerup", handleScrubPointerUp, true);
+				win.removeEventListener("pointermove", handleScrubPointerMove, true);
+			});
+		}, { flush: "post" });
+		(0, vue.onMounted)(() => {
+			const element = scrubAreaRef.value;
+			if (!element || disabled.value || readOnly.value) return;
+			function handleTouchStart(event) {
+				if (event.touches.length === 1) event.preventDefault();
+			}
+			element.addEventListener("touchstart", handleTouchStart, { passive: false });
+		});
+		async function onPointerdown(event) {
+			const isMainButton = !event.button || event.button === 0;
+			if (event.defaultPrevented || readOnly.value || !isMainButton || disabled.value) return;
+			const isTouch = event.pointerType === "touch";
+			isTouchInput.value = isTouch;
+			if (event.pointerType === "mouse") {
+				event.preventDefault();
+				inputRef.value?.focus();
+			}
+			isScrubbingInternal = true;
+			didMove = false;
+			pointerDownTarget = require_control_SliderControl.getTarget(event);
+			onScrubbingChange(true, event);
+			if (!isTouch && !isWebKit) try {
+				await require_control_SliderControl.ownerDocument(scrubAreaRef.value)?.body.requestPointerLock();
+				isPointerLockDenied.value = false;
+			} catch {
+				isPointerLockDenied.value = true;
+			} finally {
+				if (isScrubbingInternal) onScrubbingChange(true, event);
+			}
+		}
+		const defaultProps = (0, vue.computed)(() => ({
+			role: "presentation",
+			style: {
+				touchAction: "none",
+				WebkitUserSelect: "none",
+				userSelect: "none"
+			},
+			onPointerdown
+		}));
+		const scrubAreaProps = (0, vue.computed)(() => require_button_Button.mergeProps(defaultProps.value, attrsObject));
+		(0, vue.provide)(numberFieldScrubAreaContextKey, {
+			isScrubbing,
+			isTouchInput,
+			isPointerLockDenied,
+			scrubAreaCursorRef,
+			scrubAreaRef,
+			direction,
+			pixelSensitivity,
+			teleportDistance
+		});
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: scrubAreaProps,
+			stateAttributesMapping: require_decrement_NumberFieldDecrement.stateAttributesMapping,
+			defaultTagName: "span",
+			ref: scrubAreaRef
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				ref: (0, vue.unref)(renderRef),
+				props: (0, vue.unref)(mergedProps),
+				state: (0, vue.unref)(state)
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+				key: 1,
+				ref: (0, vue.unref)(renderRef)
+			}, (0, vue.unref)(mergedProps)), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: (0, vue.unref)(state) })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/number-field/scrub-area/NumberFieldScrubArea.vue
+var NumberFieldScrubArea_default = NumberFieldScrubArea_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/otp-field/root/OtpFieldRootContext.ts
+const otpFieldRootContextKey = Symbol("OtpFieldRootContext");
+function useOtpFieldRootContext() {
+	const context = (0, vue.inject)(otpFieldRootContextKey, void 0);
+	if (context === void 0) throw new Error("Base UI Vue: OtpFieldRootContext is missing. OtpField parts must be placed within <OtpFieldRoot>.");
+	return context;
+}
+function getOtpFieldInputState(state, value, index) {
+	return {
+		...state,
+		value,
+		index,
+		filled: value !== ""
+	};
+}
+
+//#endregion
+//#region src/otp-field/utils/otp.ts
+const OTP_VALIDATION_CONFIG = {
+	numeric: {
+		slotPattern: "\\d{1}",
+		getRootPattern: (length) => `\\d{${length}}`,
+		regexp: /\D/g,
+		inputMode: "numeric"
+	},
+	alpha: {
+		slotPattern: "[a-z]{1}",
+		getRootPattern: (length) => `[a-z]{${length}}`,
+		regexp: /[^a-z]/gi,
+		inputMode: "text"
+	},
+	alphanumeric: {
+		slotPattern: "[a-z0-9]{1}",
+		getRootPattern: (length) => `[a-z0-9]{${length}}`,
+		regexp: /[^a-z0-9]/gi,
+		inputMode: "text"
+	}
+};
+function getOTPValidationConfig(validationType) {
+	if (validationType === "none") return null;
+	return OTP_VALIDATION_CONFIG[validationType];
+}
+function stripOTPWhitespace(value) {
+	return (value ?? "").replace(/\s/g, "");
+}
+function applyOTPValidation(value, validation) {
+	return validation ? value.replace(validation.regexp, "") : value;
+}
+/**
+* Normalizes user-entered OTP text by stripping whitespace, applying validation and custom
+* normalization, and clamping the final value to the configured slot count.
+*/
+function normalizeOTPValueWithDetails(value, length, validationType, normalizeValue) {
+	const strippedValue = stripOTPWhitespace(value);
+	const validation = getOTPValidationConfig(validationType);
+	let normalizedValue = applyOTPValidation(strippedValue, validation);
+	let didRejectCharacters = strippedValue.length > normalizedValue.length;
+	if (normalizeValue) {
+		const customNormalizedValue = normalizeValue(normalizedValue);
+		didRejectCharacters ||= normalizedValue.length > customNormalizedValue.length;
+		normalizedValue = applyOTPValidation(customNormalizedValue, validation);
+		didRejectCharacters ||= customNormalizedValue.length > normalizedValue.length;
+	}
+	const maxLength = length < 0 ? 0 : length;
+	const normalizedCharacters = Array.from(normalizedValue);
+	return [normalizedCharacters.slice(0, maxLength).join(""), didRejectCharacters || normalizedCharacters.length > maxLength];
+}
+function normalizeOTPValue(value, length, validationType, normalizeValue) {
+	return normalizeOTPValueWithDetails(value, length, validationType, normalizeValue)[0];
+}
+function getOTPCharacters(value) {
+	return Array.from(value ?? "");
+}
+function getOTPValueLength(value) {
+	return getOTPCharacters(value).length;
+}
+function getOTPCharacter(value, index) {
+	return getOTPCharacters(value)[index] ?? "";
+}
+/**
+* Replaces characters starting at the provided slot index, then re-normalizes the final OTP value
+* so paste and multi-character edits stay contiguous and length-bounded.
+*/
+function replaceOTPValue(currentValue, index, nextValue, length, validationType, normalizeValue) {
+	const normalizedValue = normalizeOTPValue(nextValue, length, validationType, normalizeValue);
+	const characters = getOTPCharacters(currentValue);
+	const replacementLength = getOTPValueLength(normalizedValue);
+	return normalizeOTPValue(`${characters.slice(0, index).join("")}${normalizedValue}${characters.slice(index + replacementLength).join("")}`, length, validationType, normalizeValue);
+}
+function removeOTPCharacter(currentValue, index) {
+	const characters = getOTPCharacters(currentValue);
+	if (index < 0 || index >= characters.length) return currentValue;
+	characters.splice(index, 1);
+	return characters.join("");
+}
+
+//#endregion
+//#region src/otp-field/utils/stateAttributesMapping.ts
+const rootStateAttributesMapping = {
+	value: () => null,
+	length: () => null,
+	...require_checkbox_group_CheckboxGroup.fieldValidityMapping
+};
+const inputStateAttributesMapping = {
+	value: () => null,
+	index: () => null,
+	...require_checkbox_group_CheckboxGroup.fieldValidityMapping
+};
+
+//#endregion
+//#region src/otp-field/input/OtpFieldInput.vue?vue&type=script&setup=true&lang.ts
+var OtpFieldInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "OtpFieldInput",
+	inheritAttrs: false,
+	__name: "OtpFieldInput",
+	props: {
+		as: {
+			type: null,
+			required: false
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const attrsObject = attrs;
+		const { activeIndex, autoComplete, disabled, form, focusInput, queueFocusInput, getInputId, handleInputBlur, handleInputFocus, inputMode, inputAriaLabelledBy, invalid, length, mask, pattern, reportValueInvalid, readOnly, required, normalizeValue, setValue, state, validationType, value } = useOtpFieldRootContext();
+		const { ref: listItemRef, index } = require_button_ToolbarButton.useCompositeListItem({ indexGuessBehavior: () => require_button_ToolbarButton.IndexGuessBehavior.GuessFromOrder });
+		const inputRef = (0, vue.ref)(null);
+		const direction = require_control_SliderControl.useDirection();
+		const slotValue = (0, vue.computed)(() => getOTPCharacter(value.value, index.value));
+		const inputState = (0, vue.computed)(() => getOtpFieldInputState(state.value, slotValue.value, index.value));
+		const externalAriaLabel = (0, vue.computed)(() => attrs["aria-label"]);
+		const externalAriaLabelledBy = (0, vue.computed)(() => attrs["aria-labelledby"]);
+		const inheritedLabel = (0, vue.computed)(() => externalAriaLabelledBy.value ?? inputAriaLabelledBy.value);
+		const ariaLabel = (0, vue.computed)(() => index.value === 0 ? void 0 : externalAriaLabel.value);
+		function setInputRef(el) {
+			listItemRef(el);
+			inputRef.value = el;
+		}
+		function onMousedown(event) {
+			if (event.defaultPrevented || disabled.value) return;
+			event.preventDefault();
+			focusInput(index.value);
+		}
+		function onFocus(event) {
+			if (event.defaultPrevented || disabled.value) return;
+			handleInputFocus(index.value, event);
+		}
+		function onBlur(event) {
+			if (event.defaultPrevented) return;
+			handleInputBlur(event);
+		}
+		function onInput(event) {
+			const target = event.target;
+			if (event.defaultPrevented || disabled.value || readOnly.value) return;
+			const rawValue = target.value;
+			const [nextDigits, didRejectCharacters] = normalizeOTPValueWithDetails(rawValue, length.value, validationType.value, normalizeValue.value);
+			if (didRejectCharacters) reportValueInvalid(rawValue, require_checkbox_index.createGenericEventDetails(require_checkbox_index.REASONS.inputChange, event));
+			if (nextDigits === "") {
+				if (rawValue === "") setValue(removeOTPCharacter(value.value, index.value), require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputClear, event));
+				target.value = slotValue.value;
+				if (slotValue.value !== "") target.select();
+				return;
+			}
+			const committedValue = setValue(replaceOTPValue(value.value, index.value, nextDigits, length.value, validationType.value, normalizeValue.value), require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputChange, event));
+			if (committedValue != null) queueFocusInput(Math.min(index.value + getOTPValueLength(nextDigits), length.value - 1), committedValue);
+		}
+		function onKeydown(event) {
+			if (event.defaultPrevented || disabled.value) return;
+			const firstIndex = 0;
+			const lastIndex = Math.max(length.value - 1, firstIndex);
+			const endTargetIndex = Math.min(getOTPValueLength(value.value), lastIndex);
+			const hasBoundaryModifier = (event.ctrlKey || event.metaKey) && !event.altKey;
+			const isRtl = direction.value === "rtl";
+			const previousKey = isRtl ? "ArrowRight" : "ArrowLeft";
+			const nextKey = isRtl ? "ArrowLeft" : "ArrowRight";
+			if (event.key === previousKey) {
+				stopEvent(event);
+				focusInput(hasBoundaryModifier ? firstIndex : Math.max(firstIndex, index.value - 1));
+				return;
+			}
+			if (event.key === nextKey) {
+				stopEvent(event);
+				focusInput(hasBoundaryModifier ? endTargetIndex : Math.min(lastIndex, index.value + 1));
+				return;
+			}
+			if (event.key === "Home" || event.key === "ArrowUp") {
+				stopEvent(event);
+				focusInput(firstIndex);
+				return;
+			}
+			if (event.key === "End" || event.key === "ArrowDown") {
+				stopEvent(event);
+				focusInput(endTargetIndex);
+				return;
+			}
+			if (readOnly.value) return;
+			function setKeyboardValue(nextValue, targetIndex) {
+				const committedValue = setValue(nextValue, require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.keyboard, event));
+				if (committedValue != null) queueFocusInput(targetIndex, committedValue);
+			}
+			if (event.key === "Backspace" && hasBoundaryModifier) {
+				stopEvent(event);
+				setKeyboardValue("", firstIndex);
+				return;
+			}
+			if (event.key === "Delete") {
+				stopEvent(event);
+				setKeyboardValue(removeOTPCharacter(value.value, index.value), index.value);
+				return;
+			}
+			const target = event.currentTarget;
+			const inputValue = target.value;
+			const fullSelection = target.selectionStart === 0 && target.selectionEnd === inputValue.length;
+			if (getOTPValueLength(event.key) === 1 && fullSelection && slotValue.value === event.key) {
+				stopEvent(event);
+				if (index.value < length.value - 1) focusInput(index.value + 1);
+				return;
+			}
+			if (event.key === "Backspace") {
+				stopEvent(event);
+				const targetIndex = Math.max(firstIndex, index.value - 1);
+				const deleteIndex = slotValue.value === "" ? targetIndex : index.value;
+				setKeyboardValue(removeOTPCharacter(value.value, deleteIndex), targetIndex);
+			}
+		}
+		function onPaste(event) {
+			if (event.defaultPrevented || disabled.value || readOnly.value) return;
+			let rawValue = "";
+			try {
+				rawValue = event.clipboardData?.getData("text/plain") ?? "";
+			} catch {
+				return;
+			}
+			event.preventDefault();
+			const [nextDigits, didRejectCharacters] = normalizeOTPValueWithDetails(rawValue, length.value, validationType.value, normalizeValue.value);
+			if (didRejectCharacters) reportValueInvalid(rawValue, require_checkbox_index.createGenericEventDetails(require_checkbox_index.REASONS.inputPaste, event));
+			if (nextDigits === "") return;
+			const committedValue = setValue(replaceOTPValue(value.value, index.value, nextDigits, length.value, validationType.value, normalizeValue.value), require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputPaste, event));
+			if (committedValue != null) queueFocusInput(Math.min(index.value + getOTPValueLength(nextDigits), length.value - 1), committedValue);
+		}
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state: inputState,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps(attrsObject, {
+				"id": getInputId(index.value),
+				"value": slotValue.value,
+				"type": attrsObject.type ?? (mask.value ? "password" : "text"),
+				"inputmode": inputMode.value,
+				"autocomplete": index.value === 0 ? autoComplete.value : "off",
+				"autocorrect": "off",
+				"spellcheck": "false",
+				"enterkeyhint": index.value === length.value - 1 ? "done" : "next",
+				"maxlength": index.value === 0 ? length.value : void 0,
+				"tabindex": activeIndex.value === index.value ? 0 : -1,
+				"disabled": disabled.value,
+				"form": form.value,
+				"pattern": pattern.value,
+				"readonly": readOnly.value,
+				"required": required.value,
+				"aria-labelledby": ariaLabel.value == null ? inheritedLabel.value : void 0,
+				"aria-invalid": !disabled.value && invalid.value ? true : void 0,
+				"aria-label": ariaLabel.value,
+				"onMousedown": onMousedown,
+				"onFocus": onFocus,
+				"onBlur": onBlur,
+				"onInput": onInput,
+				"onKeydown": onKeydown,
+				"onPaste": onPaste
+			})),
+			stateAttributesMapping: inputStateAttributesMapping,
+			defaultTagName: "input",
+			ref: setInputRef
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				ref: (0, vue.unref)(renderRef),
+				props: (0, vue.unref)(mergedProps),
+				state: inputState.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+				key: 1,
+				ref: (0, vue.unref)(renderRef)
+			}, (0, vue.unref)(mergedProps)), null, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/otp-field/input/OtpFieldInput.vue
+var OtpFieldInput_default = OtpFieldInput_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/otp-field/root/OtpFieldRoot.vue?vue&type=script&setup=true&lang.ts
+var OtpFieldRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "OtpFieldRoot",
+	inheritAttrs: false,
+	__name: "OtpFieldRoot",
+	props: {
+		id: {
+			type: String,
+			required: false
+		},
+		autoComplete: {
+			type: String,
+			required: false,
+			default: "one-time-code"
+		},
+		form: {
+			type: String,
+			required: false
+		},
+		length: {
+			type: Number,
+			required: true
+		},
+		autoSubmit: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		mask: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		inputMode: {
+			type: String,
+			required: false
+		},
+		validationType: {
+			type: String,
+			required: false,
+			default: "numeric"
+		},
+		normalizeValue: {
+			type: Function,
+			required: false
+		},
+		required: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		readOnly: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		value: {
+			type: String,
+			required: false
+		},
+		defaultValue: {
+			type: String,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	emits: [
+		"valueChange",
+		"valueInvalid",
+		"valueComplete"
+	],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const attrs = (0, vue.useAttrs)();
+		const attrsObject = attrs;
+		const { setDirty, validityData, disabled: fieldDisabled, setFilled, invalid, name: fieldName, state: fieldState, validation, validationMode, setFocused, setTouched } = require_checkbox_group_CheckboxGroup.useFieldRootContext();
+		const { clearErrors } = require_checkbox_group_CheckboxGroup.useFormContext();
+		const { getDescriptionProps, labelId } = require_checkbox_group_CheckboxGroup.useLabelableContext();
+		const length = (0, vue.computed)(() => props.length);
+		const validationType = (0, vue.computed)(() => props.validationType);
+		const normalizeValueProp = (0, vue.computed)(() => props.normalizeValue);
+		const disabled = (0, vue.computed)(() => fieldDisabled.value || props.disabled);
+		const readOnly = (0, vue.computed)(() => props.readOnly);
+		const required = (0, vue.computed)(() => props.required);
+		const mask = (0, vue.computed)(() => props.mask);
+		const autoComplete = (0, vue.computed)(() => props.autoComplete);
+		const formProp = (0, vue.computed)(() => props.form);
+		const name = (0, vue.computed)(() => fieldName.value ?? props.name);
+		const { value: valueUnwrapped, setValue: setValueUnwrapped } = require_checkbox_group_CheckboxGroup.useControllableState({
+			controlled: () => props.value,
+			default: () => props.defaultValue ?? "",
+			name: "OtpField",
+			state: "value"
+		});
+		const value = (0, vue.computed)(() => normalizeOTPValue(valueUnwrapped.value, length.value, validationType.value, normalizeValueProp.value));
+		const valueLength = (0, vue.computed)(() => getOTPValueLength(value.value));
+		const filled = (0, vue.computed)(() => value.value !== "");
+		const rootRef = (0, vue.ref)(null);
+		const inputRefsHolder = { elementsRef: (0, vue.ref)([]) };
+		const inputRefs = inputRefsHolder.elementsRef;
+		const validationInputRef = (0, vue.ref)(null);
+		const firstInputRef = { get value() {
+			return inputRefs.value[0] ?? null;
+		} };
+		let pendingFocus = null;
+		let pendingCompleteValue = null;
+		const inputCount = (0, vue.ref)(0);
+		const focusedIndex = (0, vue.ref)(Math.min(valueLength.value, length.value - 1));
+		const focused = (0, vue.ref)(false);
+		const id = require_control_FieldControl.useLabelableId({ id: (0, vue.computed)(() => props.id) });
+		const ariaLabelledByAttr = (0, vue.computed)(() => attrs["aria-labelledby"]);
+		const ariaLabelledBy = require_checkbox_index.useAriaLabelledBy({
+			ariaLabelledBy: ariaLabelledByAttr,
+			labelId,
+			labelSourceRef: firstInputRef,
+			enableFallback: true,
+			labelSourceId: () => id.value ?? void 0
+		});
+		const inputAriaLabelledBy = (0, vue.computed)(() => ariaLabelledByAttr.value == null ? ariaLabelledBy.value : void 0);
+		const ariaDescribedBy = (0, vue.computed)(() => mergeAriaIds(attrs["aria-describedby"], getDescriptionProps()["aria-describedby"]));
+		const validationConfig = (0, vue.computed)(() => getOTPValidationConfig(validationType.value));
+		const pattern = (0, vue.computed)(() => validationConfig.value?.slotPattern);
+		const hiddenInputPattern = (0, vue.computed)(() => validationConfig.value?.getRootPattern(length.value));
+		const inputMode = (0, vue.computed)(() => props.inputMode ?? validationConfig.value?.inputMode);
+		const hasValidLength = (0, vue.computed)(() => Number.isInteger(length.value) && length.value > 0);
+		const activeIndex = (0, vue.computed)(() => focused.value ? Math.min(focusedIndex.value, Math.max(length.value - 1, 0)) : Math.min(valueLength.value, length.value - 1));
+		(0, vue.watchEffect)(() => {
+			setFilled(filled.value);
+		});
+		(0, vue.watchEffect)(() => {
+			validation.setInputRef(validationInputRef.value);
+		});
+		require_checkbox_group_CheckboxGroup.useField({
+			enabled: (0, vue.computed)(() => !disabled.value),
+			id,
+			name,
+			commit: (v) => validation.commit(v),
+			value,
+			getValue: () => value.value,
+			controlRef: firstInputRef
+		});
+		function focusInput(index) {
+			const targetIndex = Math.min(Math.max(index, 0), Math.max(inputRefs.value.length - 1, 0));
+			const target = inputRefs.value[targetIndex];
+			target?.focus();
+			target?.select();
+		}
+		function queueFocusInput(index, nextValue) {
+			pendingFocus = {
+				index,
+				value: nextValue
+			};
+		}
+		function requestSubmit() {
+			let formElement = validationInputRef.value?.form ?? inputRefs.value[0]?.form ?? null;
+			if (formProp.value) {
+				const associatedElement = require_control_SliderControl.ownerDocument(rootRef.value)?.getElementById(formProp.value);
+				if (associatedElement?.tagName === "FORM") formElement = associatedElement;
+			}
+			if (formElement && typeof formElement.requestSubmit === "function") formElement.requestSubmit();
+		}
+		function completeValue(completedValue, eventDetails) {
+			emit("valueComplete", completedValue, eventDetails);
+			if (props.autoSubmit) requestSubmit();
+		}
+		function getCompleteEventDetails(details) {
+			if (details.reason === require_checkbox_index.REASONS.inputChange || details.reason === require_checkbox_index.REASONS.inputPaste) return require_checkbox_index.createGenericEventDetails(details.reason, details.event);
+			return null;
+		}
+		function setValue(nextValue, details) {
+			const currentValue = value.value;
+			const normalizedValue = normalizeOTPValue(nextValue, length.value, validationType.value, normalizeValueProp.value);
+			const normalizedValueLength = getOTPValueLength(normalizedValue);
+			const completeEventDetails = normalizedValueLength === length.value && (getOTPValueLength(currentValue) !== length.value || details.reason === require_checkbox_index.REASONS.inputPaste) ? getCompleteEventDetails(details) : null;
+			if (normalizedValue === currentValue) {
+				if (completeEventDetails != null) completeValue(normalizedValue, completeEventDetails);
+				return null;
+			}
+			emit("valueChange", normalizedValue, details);
+			if (details.isCanceled) return null;
+			setValueUnwrapped(normalizedValue);
+			if (completeEventDetails != null) pendingCompleteValue = {
+				value: normalizedValue,
+				eventDetails: completeEventDetails
+			};
+			else if (normalizedValueLength !== length.value) pendingCompleteValue = null;
+			return normalizedValue;
+		}
+		function reportValueInvalid(invalidValue, details) {
+			emit("valueInvalid", invalidValue, details);
+		}
+		function handleInputFocus(index, event) {
+			if (index > valueLength.value) {
+				focusInput(Math.min(valueLength.value, length.value - 1));
+				return;
+			}
+			focusedIndex.value = index;
+			focused.value = true;
+			setFocused(true);
+			event.currentTarget.select();
+		}
+		function handleInputBlur(event) {
+			if (require_control_SliderControl.contains(rootRef.value, event.relatedTarget)) return;
+			setTouched(true);
+			focused.value = false;
+			setFocused(false);
+			if (validationMode.value === "onBlur") validation.commit(value.value);
+		}
+		function getInputId(index) {
+			if (id.value == null) return;
+			return index === 0 ? id.value : `${id.value}-${index + 1}`;
+		}
+		useValueChanged(value, () => {
+			clearErrors(name.value);
+			setDirty(value.value !== validityData.value.initialValue);
+			validation.commit(value.value, true);
+			if (pendingCompleteValue != null) {
+				const pending = pendingCompleteValue;
+				pendingCompleteValue = null;
+				if (pending.value === value.value) completeValue(value.value, pending.eventDetails);
+			}
+			if (pendingFocus != null) {
+				const pending = pendingFocus;
+				pendingFocus = null;
+				if (pending.value === value.value) focusInput(pending.index);
+			}
+		});
+		const state = (0, vue.computed)(() => ({
+			...fieldState.value,
+			complete: valueLength.value === length.value,
+			disabled: disabled.value,
+			filled: filled.value,
+			focused: focused.value,
+			length: length.value,
+			readOnly: readOnly.value,
+			required: required.value,
+			value: value.value
+		}));
+		(0, vue.provide)(otpFieldRootContextKey, {
+			activeIndex,
+			autoComplete,
+			disabled,
+			form: formProp,
+			focusInput,
+			queueFocusInput,
+			getInputId,
+			handleInputBlur,
+			handleInputFocus,
+			inputMode,
+			inputAriaLabelledBy,
+			invalid,
+			length,
+			mask,
+			pattern,
+			reportValueInvalid,
+			readOnly,
+			required,
+			normalizeValue: normalizeValueProp,
+			setValue,
+			state,
+			validationType,
+			value
+		});
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps(attrsObject, {
+				"role": "group",
+				"aria-describedby": ariaDescribedBy.value,
+				"aria-labelledby": ariaLabelledBy.value
+			})),
+			stateAttributesMapping: rootStateAttributesMapping,
+			defaultTagName: "div",
+			ref: rootRef
+		});
+		const hiddenInputProps = (0, vue.computed)(() => ({
+			...validation.getValidationProps(),
+			"type": "text",
+			"id": id.value && name.value == null ? `${id.value}-hidden-input` : void 0,
+			"form": formProp.value,
+			"name": name.value,
+			"value": value.value,
+			"autocomplete": autoComplete.value,
+			"inputmode": inputMode.value,
+			"minlength": length.value,
+			"maxlength": length.value,
+			"pattern": hiddenInputPattern.value,
+			"disabled": disabled.value,
+			"readonly": readOnly.value,
+			"required": required.value,
+			"aria-hidden": true,
+			"tabindex": -1,
+			"style": name.value ? require_checkbox_index.visuallyHiddenInput : require_checkbox_index.visuallyHidden
+		}));
+		function handleHiddenFocus() {
+			focusInput(0);
+		}
+		function handleHiddenInput(event) {
+			const target = event.target;
+			if (event.defaultPrevented || disabled.value || readOnly.value) return;
+			const rawValue = target.value;
+			const [normalizedValue, didRejectCharacters] = normalizeOTPValueWithDetails(rawValue, length.value, validationType.value, normalizeValueProp.value);
+			if (didRejectCharacters) reportValueInvalid(rawValue, require_checkbox_index.createGenericEventDetails(require_checkbox_index.REASONS.inputChange, event));
+			const committedValue = setValue(normalizedValue, require_checkbox_index.createChangeEventDetails(require_checkbox_index.REASONS.inputChange, event));
+			if (committedValue != null && committedValue !== "") queueFocusInput(getOTPValueLength(committedValue) - 1, committedValue);
+		}
+		function mergeAriaIds(...values) {
+			const ids = values.flatMap((v) => v?.split(/\s+/).filter(Boolean) ?? []);
+			return ids.length > 0 ? Array.from(new Set(ids)).join(" ") : void 0;
+		}
+		if (process.env.NODE_ENV !== "production") (0, vue.watchEffect)(() => {
+			const len = length.value;
+			if (!Number.isInteger(len) || len <= 0) {
+				warn(`<OtpFieldRoot> \`length\` must be a positive integer. Received \`length={${String(len)}}\`.`);
+				return;
+			}
+			if (inputCount.value !== 0 && inputCount.value !== len) warn(`<OtpFieldRoot> \`length\` must match the number of rendered <OtpFieldInput /> parts. Received \`length={${len}}\` but rendered ${inputCount.value} input${inputCount.value === 1 ? "" : "s"}.`);
+		});
+		function handleMapChange(map) {
+			inputCount.value = map.size;
+		}
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)(CompositeList_default, {
+				"elements-ref": inputRefsHolder.elementsRef,
+				"on-map-change": handleMapChange
+			}, {
+				default: (0, vue.withCtx)(() => [(0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+					key: 0,
+					ref: (0, vue.unref)(renderRef),
+					props: (0, vue.unref)(mergedProps),
+					state: state.value
+				}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+					key: 1,
+					ref: (0, vue.unref)(renderRef)
+				}, (0, vue.unref)(mergedProps)), {
+					default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value })]),
+					_: 3
+				}, 16)), hasValidLength.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("input", (0, vue.mergeProps)({
+					key: 2,
+					ref_key: "validationInputRef",
+					ref: validationInputRef
+				}, hiddenInputProps.value, {
+					onInput: handleHiddenInput,
+					onFocus: handleHiddenFocus
+				}), null, 16)) : (0, vue.createCommentVNode)("v-if", true)]),
+				_: 3
+			}, 8, ["elements-ref"]);
+		};
+	}
+});
+
+//#endregion
+//#region src/otp-field/root/OtpFieldRoot.vue
+var OtpFieldRoot_default = OtpFieldRoot_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/progress/root/ProgressRootContext.ts
+const progressRootContextKey = Symbol("ProgressRootContext");
+function useProgressRootContext(optional = false) {
+	const context = (0, vue.inject)(progressRootContextKey, void 0);
+	if (!context && !optional) throw new Error("Base UI Vue: ProgressRootContext is missing. Progress parts must be placed within <ProgressRoot>.");
+	return context;
+}
+
+//#endregion
+//#region src/progress/root/ProgressRootDataAttributes.ts
+let ProgressRootDataAttributes = /* @__PURE__ */ function(ProgressRootDataAttributes) {
+	/**
+	* Present when the progress has completed.
+	*/
+	ProgressRootDataAttributes["complete"] = "data-complete";
+	/**
+	* Present when the progress is in indeterminate state.
+	*/
+	ProgressRootDataAttributes["indeterminate"] = "data-indeterminate";
+	/**
+	* Present while the progress is progressing.
+	*/
+	ProgressRootDataAttributes["progressing"] = "data-progressing";
+	return ProgressRootDataAttributes;
+}({});
+
+//#endregion
+//#region src/progress/root/stateAttributesMapping.ts
+const progressStateAttributesMapping = { status(value) {
+	if (value === "progressing") return { [ProgressRootDataAttributes.progressing]: "" };
+	if (value === "complete") return { [ProgressRootDataAttributes.complete]: "" };
+	if (value === "indeterminate") return { [ProgressRootDataAttributes.indeterminate]: "" };
+	return null;
+} };
+
+//#endregion
+//#region src/progress/indicator/ProgressIndicator.vue?vue&type=script&setup=true&lang.ts
+/**
+* Visualizes the completion status of the task.
+* Renders a `<div>` element.
+*
+* Documentation: [Base UI Vue Progress](https://baseui-vue.com/docs/components/progress)
+*/
+var ProgressIndicator_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ProgressIndicator",
+	inheritAttrs: false,
+	__name: "ProgressIndicator",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const { value, min, max, state } = useProgressRootContext();
+		const percentage = (0, vue.computed)(() => {
+			const v = value.value;
+			if (v == null || !Number.isFinite(v)) return null;
+			return valueToPercent(v, min.value, max.value);
+		});
+		const indicatorStyles = (0, vue.computed)(() => {
+			if (percentage.value == null) return {};
+			return {
+				insetInlineStart: 0,
+				height: "inherit",
+				width: `${percentage.value}%`
+			};
+		});
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps({ style: indicatorStyles.value }, attrs)),
+			defaultTagName: "div",
+			stateAttributesMapping: progressStateAttributesMapping
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: (0, vue.unref)(state)
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: (0, vue.unref)(state) })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/progress/indicator/ProgressIndicator.vue
+var ProgressIndicator_default = ProgressIndicator_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/progress/label/ProgressLabel.vue?vue&type=script&setup=true&lang.ts
+/**
+* An accessible label for the progress bar.
+* Renders a `<span>` element.
+*
+* Documentation: [Base UI Vue Progress](https://baseui-vue.com/docs/components/progress)
+*/
+var ProgressLabel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ProgressLabel",
+	inheritAttrs: false,
+	__name: "ProgressLabel",
+	props: {
+		id: {
+			type: String,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "span"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const { setLabelId, state } = useProgressRootContext();
+		const id = useRegisteredLabelId(() => props.id, setLabelId);
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => ({
+				...attrs,
+				id: id.value,
+				role: "presentation"
+			})),
+			defaultTagName: "span",
+			stateAttributesMapping: progressStateAttributesMapping
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: (0, vue.unref)(state)
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: (0, vue.unref)(state) })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/progress/label/ProgressLabel.vue
+var ProgressLabel_default = ProgressLabel_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/progress/root/ProgressRoot.vue?vue&type=script&setup=true&lang.ts
+/**
+* Groups all parts of the progress bar and provides the task completion
+* status to screen readers.
+* Renders a `<div>` element.
+*
+* Documentation: [Base UI Vue Progress](https://baseui-vue.com/docs/components/progress)
+*/
+var ProgressRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ProgressRoot",
+	inheritAttrs: false,
+	__name: "ProgressRoot",
+	props: {
+		ariaValuetext: {
+			type: String,
+			required: false
+		},
+		format: {
+			type: null,
+			required: false
+		},
+		getAriaValueText: {
+			type: Function,
+			required: false
+		},
+		locale: {
+			type: null,
+			required: false
+		},
+		max: {
+			type: Number,
+			required: false,
+			default: 100
+		},
+		min: {
+			type: Number,
+			required: false,
+			default: 0
+		},
+		value: {
+			type: [Number, null],
+			required: true
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		function getDefaultAriaValueText(formattedValue, value) {
+			if (value == null) return "indeterminate progress";
+			return formattedValue || `${value}%`;
+		}
+		const attrs = (0, vue.useAttrs)();
+		const labelId = (0, vue.ref)(void 0);
+		const status = (0, vue.computed)(() => {
+			if (props.value == null || !Number.isFinite(props.value)) return "indeterminate";
+			return props.value === props.max ? "complete" : "progressing";
+		});
+		const formattedValue = (0, vue.computed)(() => require_decrement_NumberFieldDecrement.formatNumberValue(props.value, props.locale, props.format));
+		const ariaValueText = (0, vue.computed)(() => {
+			if (props.ariaValuetext !== void 0) return props.ariaValuetext;
+			const formatted = props.value == null ? null : formattedValue.value;
+			if (props.getAriaValueText) return props.getAriaValueText(formatted, props.value);
+			return getDefaultAriaValueText(formatted, props.value);
+		});
+		const state = (0, vue.computed)(() => ({ status: status.value }));
+		(0, vue.provide)(progressRootContextKey, {
+			formattedValue,
+			max: (0, vue.computed)(() => props.max),
+			min: (0, vue.computed)(() => props.min),
+			value: (0, vue.computed)(() => props.value),
+			status,
+			state,
+			setLabelId(id) {
+				labelId.value = id;
+			}
+		});
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => ({
+				"role": "progressbar",
+				"aria-labelledby": labelId.value,
+				"aria-valuemax": props.max,
+				"aria-valuemin": props.min,
+				"aria-valuenow": props.value ?? void 0,
+				"aria-valuetext": ariaValueText.value,
+				...attrs
+			})),
+			defaultTagName: "div",
+			stateAttributesMapping: progressStateAttributesMapping
+		});
+		const visuallyHiddenStyle = require_checkbox_index.visuallyHidden;
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [
+					(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value }),
+					(0, vue.createCommentVNode)(" Force NVDA to read the label https://github.com/mui/base-ui/issues/4184 "),
+					(0, vue.createElementVNode)("span", {
+						role: "presentation",
+						style: (0, vue.normalizeStyle)((0, vue.unref)(visuallyHiddenStyle))
+					}, "x", 4)
+				]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/progress/root/ProgressRoot.vue
+var ProgressRoot_default = ProgressRoot_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/progress/track/ProgressTrack.vue?vue&type=script&setup=true&lang.ts
+/**
+* Contains the progress bar indicator.
+* Renders a `<div>` element.
+*
+* Documentation: [Base UI Vue Progress](https://baseui-vue.com/docs/components/progress)
+*/
+var ProgressTrack_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ProgressTrack",
+	inheritAttrs: false,
+	__name: "ProgressTrack",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const { state } = useProgressRootContext();
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: attrs,
+			defaultTagName: "div",
+			stateAttributesMapping: progressStateAttributesMapping
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: (0, vue.unref)(state)
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: (0, vue.unref)(state) })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/progress/track/ProgressTrack.vue
+var ProgressTrack_default = ProgressTrack_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/progress/value/ProgressValue.vue?vue&type=script&setup=true&lang.ts
+/**
+* A text label displaying the current value.
+* Renders a `<span>` element.
+*
+* Documentation: [Base UI Vue Progress](https://baseui-vue.com/docs/components/progress)
+*/
+var ProgressValue_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ProgressValue",
+	inheritAttrs: false,
+	__name: "ProgressValue",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "span"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const { value, formattedValue, state } = useProgressRootContext();
+		const slotFormattedValue = (0, vue.computed)(() => value.value == null ? "indeterminate" : formattedValue.value);
+		const defaultDisplay = (0, vue.computed)(() => value.value == null ? "" : formattedValue.value);
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => ({
+				"aria-hidden": true,
+				...attrs
+			})),
+			defaultTagName: "span",
+			stateAttributesMapping: progressStateAttributesMapping
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				props: (0, vue.unref)(mergedProps),
+				state: (0, vue.unref)(state),
+				formattedValue: slotFormattedValue.value,
+				value: (0, vue.unref)(value)
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", {
+					formattedValue: slotFormattedValue.value,
+					value: (0, vue.unref)(value)
+				}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(defaultDisplay.value), 1)])]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/progress/value/ProgressValue.vue
+var ProgressValue_default = ProgressValue_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/utils/styles.ts
+const DISABLE_SCROLLBAR_CLASS_NAME = "base-ui-disable-scrollbar";
+const STYLE_ELEMENT_ID = `style-${DISABLE_SCROLLBAR_CLASS_NAME}`;
+const styleDisableScrollbar = {
+	className: DISABLE_SCROLLBAR_CLASS_NAME,
+	inject(nonce, disableStyleElements) {
+		if (disableStyleElements) return;
+		if (typeof document === "undefined") return;
+		if (document.getElementById(STYLE_ELEMENT_ID)) return;
+		const style = document.createElement("style");
+		style.id = STYLE_ELEMENT_ID;
+		if (nonce) style.nonce = nonce;
+		style.textContent = `.${DISABLE_SCROLLBAR_CLASS_NAME}{scrollbar-width:none}.${DISABLE_SCROLLBAR_CLASS_NAME}::-webkit-scrollbar{display:none}`;
+		document.head.appendChild(style);
+	}
+};
+
+//#endregion
+//#region src/scroll-area/constants.ts
+const SCROLL_TIMEOUT = 500;
+const MIN_THUMB_SIZE = 16;
+
+//#endregion
+//#region src/scroll-area/scrollbar/ScrollAreaScrollbarDataAttributes.ts
+let ScrollAreaScrollbarDataAttributes = /* @__PURE__ */ function(ScrollAreaScrollbarDataAttributes) {
+	ScrollAreaScrollbarDataAttributes["orientation"] = "data-orientation";
+	ScrollAreaScrollbarDataAttributes["hovering"] = "data-hovering";
+	ScrollAreaScrollbarDataAttributes["scrolling"] = "data-scrolling";
+	ScrollAreaScrollbarDataAttributes["hasOverflowX"] = "data-has-overflow-x";
+	ScrollAreaScrollbarDataAttributes["hasOverflowY"] = "data-has-overflow-y";
+	ScrollAreaScrollbarDataAttributes["overflowXStart"] = "data-overflow-x-start";
+	ScrollAreaScrollbarDataAttributes["overflowXEnd"] = "data-overflow-x-end";
+	ScrollAreaScrollbarDataAttributes["overflowYStart"] = "data-overflow-y-start";
+	ScrollAreaScrollbarDataAttributes["overflowYEnd"] = "data-overflow-y-end";
+	return ScrollAreaScrollbarDataAttributes;
+}({});
+
+//#endregion
+//#region src/scroll-area/utils/getOffset.ts
+function getOffset(element, prop, axis) {
+	if (!element) return 0;
+	const styles = getComputedStyle(element);
+	const propAxis = axis === "x" ? "Inline" : "Block";
+	const start = getStyleNumber(styles, `${prop}${propAxis}Start`);
+	const end = getStyleNumber(styles, `${prop}${propAxis}End`);
+	if (axis === "x" && prop === "margin" && styles.direction === "rtl" && isSafari()) return start * 2;
+	return start + end;
+}
+function getStyleNumber(styles, prop) {
+	return Number.parseFloat(styles[prop]) || 0;
+}
+function isSafari() {
+	if (typeof navigator === "undefined") return false;
+	return /AppleWebKit/.test(navigator.userAgent) && !/Chrome|Chromium|Edg\//.test(navigator.userAgent);
+}
+
+//#endregion
+//#region src/scroll-area/root/ScrollAreaRootCssVars.ts
+let ScrollAreaRootCssVars = /* @__PURE__ */ function(ScrollAreaRootCssVars) {
+	ScrollAreaRootCssVars["scrollAreaCornerHeight"] = "--scroll-area-corner-height";
+	ScrollAreaRootCssVars["scrollAreaCornerWidth"] = "--scroll-area-corner-width";
+	return ScrollAreaRootCssVars;
+}({});
+
+//#endregion
+//#region src/scroll-area/root/ScrollAreaRoot.vue?vue&type=script&setup=true&lang.ts
+var ScrollAreaRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ScrollAreaRoot",
+	inheritAttrs: false,
+	__name: "ScrollAreaRoot",
+	props: {
+		overflowEdgeThreshold: {
+			type: [Number, Object],
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const DEFAULT_SIZE = {
+			width: 0,
+			height: 0
+		};
+		const DEFAULT_OVERFLOW_EDGES = {
+			xStart: false,
+			xEnd: false,
+			yStart: false,
+			yEnd: false
+		};
+		const DEFAULT_HIDDEN_STATE = {
+			x: true,
+			y: true,
+			corner: true
+		};
+		const DEFAULT_COORDS = {
+			x: 0,
+			y: 0
+		};
+		const attrs = (0, vue.useAttrs)();
+		const overflowEdgeThreshold = (0, vue.computed)(() => normalizeOverflowEdgeThreshold(props.overflowEdgeThreshold));
+		const rootId = require_checkbox_group_CheckboxGroup.useBaseUiId();
+		const { nonce, disableStyleElements } = require_csp_provider_CSPContext.useCSPContext();
+		const hovering = (0, vue.ref)(false);
+		const scrollingX = (0, vue.ref)(false);
+		const scrollingY = (0, vue.ref)(false);
+		const touchModality = (0, vue.ref)(false);
+		const hasMeasuredScrollbar = (0, vue.ref)(false);
+		const cornerSize = (0, vue.ref)({ ...DEFAULT_SIZE });
+		const thumbSize = (0, vue.ref)({ ...DEFAULT_SIZE });
+		const overflowEdges = (0, vue.ref)({ ...DEFAULT_OVERFLOW_EDGES });
+		const hiddenState = (0, vue.ref)({ ...DEFAULT_HIDDEN_STATE });
+		const rootRef = (0, vue.shallowRef)(null);
+		const viewportRef = (0, vue.shallowRef)(null);
+		const scrollbarYRef = (0, vue.shallowRef)(null);
+		const scrollbarXRef = (0, vue.shallowRef)(null);
+		const thumbYRef = (0, vue.shallowRef)(null);
+		const thumbXRef = (0, vue.shallowRef)(null);
+		const cornerRef = (0, vue.shallowRef)(null);
+		let scrollYTimeoutId;
+		let scrollXTimeoutId;
+		const thumbDragging = { current: false };
+		const startY = { current: 0 };
+		const startX = { current: 0 };
+		const startScrollTop = { current: 0 };
+		const startScrollLeft = { current: 0 };
+		const currentOrientation = { current: "vertical" };
+		const scrollPosition = { current: { ...DEFAULT_COORDS } };
+		function handleScroll(pos) {
+			const offsetX = pos.x - scrollPosition.current.x;
+			const offsetY = pos.y - scrollPosition.current.y;
+			scrollPosition.current = pos;
+			if (offsetY !== 0) {
+				scrollingY.value = true;
+				clearTimeout(scrollYTimeoutId);
+				scrollYTimeoutId = setTimeout(() => {
+					scrollingY.value = false;
+				}, SCROLL_TIMEOUT);
+			}
+			if (offsetX !== 0) {
+				scrollingX.value = true;
+				clearTimeout(scrollXTimeoutId);
+				scrollXTimeoutId = setTimeout(() => {
+					scrollingX.value = false;
+				}, SCROLL_TIMEOUT);
+			}
+		}
+		function handlePointerDown(event) {
+			if (event.button !== 0) return;
+			thumbDragging.current = true;
+			startY.current = event.clientY;
+			startX.current = event.clientX;
+			currentOrientation.current = event.currentTarget.getAttribute(ScrollAreaScrollbarDataAttributes.orientation);
+			if (viewportRef.value) {
+				startScrollTop.current = viewportRef.value.scrollTop;
+				startScrollLeft.current = viewportRef.value.scrollLeft;
+			}
+			if (thumbYRef.value && currentOrientation.current === "vertical") thumbYRef.value.setPointerCapture(event.pointerId);
+			if (thumbXRef.value && currentOrientation.current === "horizontal") thumbXRef.value.setPointerCapture(event.pointerId);
+		}
+		function handlePointerMove(event) {
+			if (!thumbDragging.current) return;
+			const deltaY = event.clientY - startY.current;
+			const deltaX = event.clientX - startX.current;
+			if (viewportRef.value) {
+				const scrollableContentHeight = viewportRef.value.scrollHeight;
+				const viewportHeight = viewportRef.value.clientHeight;
+				const scrollableContentWidth = viewportRef.value.scrollWidth;
+				const viewportWidth = viewportRef.value.clientWidth;
+				if (thumbYRef.value && scrollbarYRef.value && currentOrientation.current === "vertical") {
+					const scrollbarYOffset = getOffset(scrollbarYRef.value, "padding", "y");
+					const thumbYOffset = getOffset(thumbYRef.value, "margin", "y");
+					const thumbHeight = thumbYRef.value.offsetHeight;
+					const scrollRatioY = deltaY / (scrollbarYRef.value.offsetHeight - thumbHeight - scrollbarYOffset - thumbYOffset);
+					viewportRef.value.scrollTop = startScrollTop.current + scrollRatioY * (scrollableContentHeight - viewportHeight);
+					event.preventDefault();
+					scrollingY.value = true;
+					clearTimeout(scrollYTimeoutId);
+					scrollYTimeoutId = setTimeout(() => {
+						scrollingY.value = false;
+					}, SCROLL_TIMEOUT);
+				}
+				if (thumbXRef.value && scrollbarXRef.value && currentOrientation.current === "horizontal") {
+					const scrollbarXOffset = getOffset(scrollbarXRef.value, "padding", "x");
+					const thumbXOffset = getOffset(thumbXRef.value, "margin", "x");
+					const thumbWidth = thumbXRef.value.offsetWidth;
+					const scrollRatioX = deltaX / (scrollbarXRef.value.offsetWidth - thumbWidth - scrollbarXOffset - thumbXOffset);
+					viewportRef.value.scrollLeft = startScrollLeft.current + scrollRatioX * (scrollableContentWidth - viewportWidth);
+					event.preventDefault();
+					scrollingX.value = true;
+					clearTimeout(scrollXTimeoutId);
+					scrollXTimeoutId = setTimeout(() => {
+						scrollingX.value = false;
+					}, SCROLL_TIMEOUT);
+				}
+			}
+		}
+		function handlePointerUp(event) {
+			thumbDragging.current = false;
+			if (thumbYRef.value && currentOrientation.current === "vertical") thumbYRef.value.releasePointerCapture(event.pointerId);
+			if (thumbXRef.value && currentOrientation.current === "horizontal") thumbXRef.value.releasePointerCapture(event.pointerId);
+		}
+		function handleTouchModalityChange(event) {
+			touchModality.value = event.pointerType === "touch";
+		}
+		function handlePointerEnterOrMove(event) {
+			handleTouchModalityChange(event);
+			if (event.pointerType !== "touch") hovering.value = require_control_SliderControl.contains(rootRef.value, event.target);
+		}
+		const state = (0, vue.computed)(() => ({
+			scrolling: scrollingX.value || scrollingY.value,
+			hasOverflowX: !hiddenState.value.x,
+			hasOverflowY: !hiddenState.value.y,
+			overflowXStart: overflowEdges.value.xStart,
+			overflowXEnd: overflowEdges.value.xEnd,
+			overflowYStart: overflowEdges.value.yStart,
+			overflowYEnd: overflowEdges.value.yEnd,
+			cornerHidden: hiddenState.value.corner
+		}));
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps(attrs, {
+				role: "presentation",
+				onPointerenter: handlePointerEnterOrMove,
+				onPointermove: handlePointerEnterOrMove,
+				onPointerdown: handleTouchModalityChange,
+				onPointerleave: () => {
+					hovering.value = false;
+				},
+				style: {
+					position: "relative",
+					[ScrollAreaRootCssVars.scrollAreaCornerHeight]: `${cornerSize.value.height}px`,
+					[ScrollAreaRootCssVars.scrollAreaCornerWidth]: `${cornerSize.value.width}px`
+				}
+			})),
+			stateAttributesMapping: require_content_ScrollAreaContent.scrollAreaStateAttributesMapping,
+			defaultTagName: "div",
+			ref: rootRef
+		});
+		(0, vue.onMounted)(() => {
+			styleDisableScrollbar.inject(nonce.value, disableStyleElements.value);
+		});
+		(0, vue.provide)(require_content_ScrollAreaContent.scrollAreaRootContextKey, {
+			cornerSize,
+			setCornerSize: (size) => {
+				cornerSize.value = size;
+			},
+			thumbSize,
+			setThumbSize: (size) => {
+				thumbSize.value = size;
+			},
+			hasMeasuredScrollbar,
+			setHasMeasuredScrollbar: (value) => {
+				hasMeasuredScrollbar.value = value;
+			},
+			touchModality,
+			hovering,
+			setHovering: (value) => {
+				hovering.value = value;
+			},
+			scrollingX,
+			setScrollingX: (value) => {
+				scrollingX.value = value;
+			},
+			scrollingY,
+			setScrollingY: (value) => {
+				scrollingY.value = value;
+			},
+			viewportRef,
+			rootRef,
+			scrollbarYRef,
+			scrollbarXRef,
+			thumbYRef,
+			thumbXRef,
+			cornerRef,
+			handlePointerDown,
+			handlePointerMove,
+			handlePointerUp,
+			handleScroll,
+			rootId,
+			hiddenState,
+			setHiddenState: (s) => {
+				hiddenState.value = s;
+			},
+			overflowEdges,
+			setOverflowEdges: (e) => {
+				overflowEdges.value = e;
+			},
+			viewportState: state,
+			overflowEdgeThreshold
+		});
+		function normalizeOverflowEdgeThreshold(threshold) {
+			if (typeof threshold === "number") {
+				const value = Math.max(0, threshold);
+				return {
+					xStart: value,
+					xEnd: value,
+					yStart: value,
+					yEnd: value
+				};
+			}
+			return {
+				xStart: Math.max(0, threshold?.xStart || 0),
+				xEnd: Math.max(0, threshold?.xEnd || 0),
+				yStart: Math.max(0, threshold?.yStart || 0),
+				yEnd: Math.max(0, threshold?.yEnd || 0)
+			};
+		}
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				ref: (0, vue.unref)(renderRef),
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+				key: 1,
+				ref: (0, vue.unref)(renderRef)
+			}, (0, vue.unref)(mergedProps)), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/scroll-area/root/ScrollAreaRoot.vue
+var ScrollAreaRoot_default = ScrollAreaRoot_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/scroll-area/scrollbar/ScrollAreaScrollbarContext.ts
+const scrollAreaScrollbarContextKey = Symbol("ScrollAreaScrollbarContext");
+function useScrollAreaScrollbarContext() {
+	const context = (0, vue.inject)(scrollAreaScrollbarContextKey);
+	if (context === void 0) throw new Error("Base UI: ScrollAreaScrollbarContext is missing. ScrollArea.Thumb must be placed within <ScrollAreaScrollbar>.");
+	return context;
+}
+
+//#endregion
+//#region src/scroll-area/scrollbar/ScrollAreaScrollbarCssVars.ts
+let ScrollAreaScrollbarCssVars = /* @__PURE__ */ function(ScrollAreaScrollbarCssVars) {
+	ScrollAreaScrollbarCssVars["scrollAreaThumbHeight"] = "--scroll-area-thumb-height";
+	ScrollAreaScrollbarCssVars["scrollAreaThumbWidth"] = "--scroll-area-thumb-width";
+	return ScrollAreaScrollbarCssVars;
+}({});
+
+//#endregion
+//#region src/scroll-area/scrollbar/ScrollAreaScrollbar.vue?vue&type=script&setup=true&lang.ts
+var ScrollAreaScrollbar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ScrollAreaScrollbar",
+	inheritAttrs: false,
+	__name: "ScrollAreaScrollbar",
+	props: {
+		orientation: {
+			type: String,
+			required: false,
+			default: "vertical"
+		},
+		keepMounted: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const { hovering, scrollingX, scrollingY, hiddenState, overflowEdges, scrollbarYRef, scrollbarXRef, viewportRef, thumbYRef, thumbXRef, handlePointerDown, handlePointerUp, rootId, thumbSize, hasMeasuredScrollbar } = require_content_ScrollAreaContent.useScrollAreaRootContext();
+		const direction = require_control_SliderControl.useDirection();
+		let wheelCleanup;
+		const scrollbarElementRef = (0, vue.shallowRef)(null);
+		(0, vue.watch)([scrollbarElementRef, () => props.orientation], ([element, orientation], [previousElement, previousOrientation]) => {
+			if (previousElement) {
+				const previousRef = previousOrientation === "vertical" ? scrollbarYRef : scrollbarXRef;
+				if (previousRef.value === previousElement) previousRef.value = null;
+			}
+			if (!element) return;
+			const nextRef = orientation === "vertical" ? scrollbarYRef : scrollbarXRef;
+			nextRef.value = element;
+		});
+		(0, vue.watch)([
+			scrollbarElementRef,
+			viewportRef,
+			() => props.orientation
+		], () => {
+			wheelCleanup?.();
+			wheelCleanup = setupWheelHandler();
+		}, { flush: "post" });
+		(0, vue.onBeforeUnmount)(() => {
+			wheelCleanup?.();
+		});
+		function setupWheelHandler() {
+			const viewportEl = viewportRef.value;
+			const scrollbarEl = scrollbarElementRef.value;
+			if (!scrollbarEl) return void 0;
+			function handleWheel(event) {
+				if (!viewportEl || !scrollbarEl || event.ctrlKey) return;
+				if (props.orientation === "vertical") {
+					if (viewportEl.scrollTop === 0 && event.deltaY < 0) return;
+					if (viewportEl.scrollTop === viewportEl.scrollHeight - viewportEl.clientHeight && event.deltaY > 0) return;
+					event.preventDefault();
+					viewportEl.scrollTop += event.deltaY;
+				} else {
+					if (viewportEl.scrollLeft === 0 && event.deltaX < 0) return;
+					if (viewportEl.scrollLeft === viewportEl.scrollWidth - viewportEl.clientWidth && event.deltaX > 0) return;
+					event.preventDefault();
+					viewportEl.scrollLeft += event.deltaX;
+				}
+			}
+			scrollbarEl.addEventListener("wheel", handleWheel, { passive: false });
+			return () => scrollbarEl.removeEventListener("wheel", handleWheel);
+		}
+		function setScrollbarElement(element) {
+			scrollbarElementRef.value = element;
+		}
+		const state = (0, vue.computed)(() => ({
+			hovering: hovering.value,
+			scrolling: props.orientation === "horizontal" ? scrollingX.value : scrollingY.value,
+			orientation: props.orientation,
+			hasOverflowX: !hiddenState.value.x,
+			hasOverflowY: !hiddenState.value.y,
+			overflowXStart: overflowEdges.value.xStart,
+			overflowXEnd: overflowEdges.value.xEnd,
+			overflowYStart: overflowEdges.value.yStart,
+			overflowYEnd: overflowEdges.value.yEnd,
+			cornerHidden: hiddenState.value.corner
+		}));
+		const hideTrackUntilMeasured = (0, vue.computed)(() => !hasMeasuredScrollbar.value && !props.keepMounted);
+		function onPointerDown(event) {
+			if (event.button !== 0) return;
+			const target = require_control_SliderControl.getTarget(event);
+			const thumb = props.orientation === "vertical" ? thumbYRef.value : thumbXRef.value;
+			if (thumb && require_control_SliderControl.contains(thumb, target)) return;
+			if (!viewportRef.value) return;
+			if (thumbYRef.value && scrollbarYRef.value && props.orientation === "vertical") {
+				const thumbYOffset = getOffset(thumbYRef.value, "margin", "y");
+				const scrollbarYOffset = getOffset(scrollbarYRef.value, "padding", "y");
+				const thumbHeight = thumbYRef.value.offsetHeight;
+				const trackRectY = scrollbarYRef.value.getBoundingClientRect();
+				const clickY = event.clientY - trackRectY.top - thumbHeight / 2 - scrollbarYOffset + thumbYOffset / 2;
+				const scrollableContentHeight = viewportRef.value.scrollHeight;
+				const viewportHeight = viewportRef.value.clientHeight;
+				const scrollRatioY = clickY / (scrollbarYRef.value.offsetHeight - thumbHeight - scrollbarYOffset - thumbYOffset);
+				viewportRef.value.scrollTop = scrollRatioY * (scrollableContentHeight - viewportHeight);
+			}
+			if (thumbXRef.value && scrollbarXRef.value && props.orientation === "horizontal") {
+				const thumbXOffset = getOffset(thumbXRef.value, "margin", "x");
+				const scrollbarXOffset = getOffset(scrollbarXRef.value, "padding", "x");
+				const thumbWidth = thumbXRef.value.offsetWidth;
+				const trackRectX = scrollbarXRef.value.getBoundingClientRect();
+				const clickX = event.clientX - trackRectX.left - thumbWidth / 2 - scrollbarXOffset + thumbXOffset / 2;
+				const scrollableContentWidth = viewportRef.value.scrollWidth;
+				const viewportWidth = viewportRef.value.clientWidth;
+				const scrollRatioX = clickX / (scrollbarXRef.value.offsetWidth - thumbWidth - scrollbarXOffset - thumbXOffset);
+				let newScrollLeft;
+				if (direction.value === "rtl") {
+					newScrollLeft = (1 - scrollRatioX) * (scrollableContentWidth - viewportWidth);
+					if (viewportRef.value.scrollLeft <= 0) newScrollLeft = -newScrollLeft;
+				} else newScrollLeft = scrollRatioX * (scrollableContentWidth - viewportWidth);
+				viewportRef.value.scrollLeft = newScrollLeft;
+			}
+			handlePointerDown(event);
+		}
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps(attrs, {
+				...rootId ? { "data-id": `${rootId}-scrollbar` } : {},
+				onPointerdown: onPointerDown,
+				onPointerup: handlePointerUp,
+				style: {
+					position: "absolute",
+					touchAction: "none",
+					WebkitUserSelect: "none",
+					userSelect: "none",
+					visibility: hideTrackUntilMeasured.value ? "hidden" : void 0,
+					...props.orientation === "vertical" && {
+						top: 0,
+						bottom: `var(${ScrollAreaRootCssVars.scrollAreaCornerHeight})`,
+						insetInlineEnd: 0,
+						[ScrollAreaScrollbarCssVars.scrollAreaThumbHeight]: `${thumbSize.value.height}px`
+					},
+					...props.orientation === "horizontal" && {
+						insetInlineStart: 0,
+						insetInlineEnd: `var(${ScrollAreaRootCssVars.scrollAreaCornerWidth})`,
+						bottom: 0,
+						[ScrollAreaScrollbarCssVars.scrollAreaThumbWidth]: `${thumbSize.value.width}px`
+					}
+				}
+			})),
+			stateAttributesMapping: require_content_ScrollAreaContent.scrollAreaStateAttributesMapping,
+			defaultTagName: "div",
+			ref: setScrollbarElement
+		});
+		const isHidden = (0, vue.computed)(() => props.orientation === "vertical" ? hiddenState.value.y : hiddenState.value.x);
+		const shouldRender = (0, vue.computed)(() => props.keepMounted || !isHidden.value);
+		(0, vue.provide)(scrollAreaScrollbarContextKey, { orientation: (0, vue.computed)(() => props.orientation) });
+		return (_ctx, _cache) => {
+			return shouldRender.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				ref: (0, vue.unref)(renderRef),
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+				key: 1,
+				ref: (0, vue.unref)(renderRef)
+			}, (0, vue.unref)(mergedProps)), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16))], 64)) : (0, vue.createCommentVNode)("v-if", true);
+		};
+	}
+});
+
+//#endregion
+//#region src/scroll-area/scrollbar/ScrollAreaScrollbar.vue
+var ScrollAreaScrollbar_default = ScrollAreaScrollbar_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/scroll-area/thumb/ScrollAreaThumb.vue?vue&type=script&setup=true&lang.ts
+var ScrollAreaThumb_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ScrollAreaThumb",
+	inheritAttrs: false,
+	__name: "ScrollAreaThumb",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = (0, vue.useAttrs)();
+		const { thumbYRef, thumbXRef, handlePointerDown, handlePointerMove, handlePointerUp, setScrollingX, setScrollingY, hasMeasuredScrollbar } = require_content_ScrollAreaContent.useScrollAreaRootContext();
+		const { orientation } = useScrollAreaScrollbarContext();
+		const thumbElementRef = (0, vue.shallowRef)(null);
+		(0, vue.watch)([thumbElementRef, orientation], ([element, currentOrientation], [previousElement, previousOrientation]) => {
+			if (previousElement) {
+				const previousRef = previousOrientation === "vertical" ? thumbYRef : thumbXRef;
+				if (previousRef.value === previousElement) previousRef.value = null;
+			}
+			if (!element) return;
+			const nextRef = currentOrientation === "vertical" ? thumbYRef : thumbXRef;
+			nextRef.value = element;
+		});
+		const state = (0, vue.computed)(() => ({ orientation: orientation.value }));
+		function onPointerUp(event) {
+			if (orientation.value === "vertical") setScrollingY(false);
+			if (orientation.value === "horizontal") setScrollingX(false);
+			handlePointerUp(event);
+		}
+		function setThumbElement(element) {
+			thumbElementRef.value = element;
+		}
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps(attrs, {
+				onPointerdown: handlePointerDown,
+				onPointermove: handlePointerMove,
+				onPointerup: onPointerUp,
+				style: {
+					visibility: hasMeasuredScrollbar.value ? void 0 : "hidden",
+					...orientation.value === "vertical" && { height: `var(${ScrollAreaScrollbarCssVars.scrollAreaThumbHeight})` },
+					...orientation.value === "horizontal" && { width: `var(${ScrollAreaScrollbarCssVars.scrollAreaThumbWidth})` }
+				}
+			})),
+			defaultTagName: "div",
+			ref: setThumbElement
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				ref: (0, vue.unref)(renderRef),
+				props: (0, vue.unref)(mergedProps),
+				state: state.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+				key: 1,
+				ref: (0, vue.unref)(renderRef)
+			}, (0, vue.unref)(mergedProps)), null, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/scroll-area/thumb/ScrollAreaThumb.vue
+var ScrollAreaThumb_default = ScrollAreaThumb_vue_vue_type_script_setup_true_lang_default;
 
 //#endregion
-//#region src/fieldset/root/FieldsetRoot.vue?vue&type=script&setup=true&lang.ts
-/**
-* Groups a shared legend with related controls.
-* Renders a \`<fieldset>\` element.
-*
-* Documentation: [Base UI Vue Fieldset](https://baseui-vue.com/components/fieldset)
-*/
-var FieldsetRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
-	name: "FieldsetRoot",
+//#region src/scroll-area/thumb/ScrollAreaThumbDataAttributes.ts
+let ScrollAreaThumbDataAttributes = /* @__PURE__ */ function(ScrollAreaThumbDataAttributes) {
+	ScrollAreaThumbDataAttributes["orientation"] = "data-orientation";
+	return ScrollAreaThumbDataAttributes;
+}({});
+
+//#endregion
+//#region src/utils/scrollEdges.ts
+const SCROLL_EDGE_TOLERANCE_PX = 1;
+function normalizeScrollOffset(value, max) {
+	if (max <= 0) return 0;
+	const clamped = require_control_SliderControl.clamp(value, 0, max);
+	const startDistance = clamped;
+	const endDistance = max - clamped;
+	const withinStartTolerance = startDistance <= SCROLL_EDGE_TOLERANCE_PX;
+	const withinEndTolerance = endDistance <= SCROLL_EDGE_TOLERANCE_PX;
+	if (withinStartTolerance && withinEndTolerance) return startDistance <= endDistance ? 0 : max;
+	if (withinStartTolerance) return 0;
+	if (withinEndTolerance) return max;
+	return clamped;
+}
+
+//#endregion
+//#region src/scroll-area/viewport/ScrollAreaViewportCssVars.ts
+let ScrollAreaViewportCssVars = /* @__PURE__ */ function(ScrollAreaViewportCssVars) {
+	ScrollAreaViewportCssVars["scrollAreaOverflowXStart"] = "--scroll-area-overflow-x-start";
+	ScrollAreaViewportCssVars["scrollAreaOverflowXEnd"] = "--scroll-area-overflow-x-end";
+	ScrollAreaViewportCssVars["scrollAreaOverflowYStart"] = "--scroll-area-overflow-y-start";
+	ScrollAreaViewportCssVars["scrollAreaOverflowYEnd"] = "--scroll-area-overflow-y-end";
+	return ScrollAreaViewportCssVars;
+}({});
+
+//#endregion
+//#region src/scroll-area/viewport/ScrollAreaViewport.vue?vue&type=script&setup=true&lang.ts
+var ScrollAreaViewport_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "ScrollAreaViewport",
 	inheritAttrs: false,
-	__name: "FieldsetRoot",
+	__name: "ScrollAreaViewport",
 	props: {
-		disabled: {
-			type: Boolean,
-			required: false,
-			default: false
-		},
 		as: {
 			type: null,
 			required: false,
-			default: "fieldset"
+			default: "div"
 		},
 		class: {
 			type: Function,
@@ -2657,33 +6214,247 @@ var FieldsetRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 	setup(__props) {
 		const props = __props;
 		const attrs = (0, vue.useAttrs)();
-		const legendId = (0, vue.ref)(void 0);
-		function setLegendId(id) {
-			legendId.value = id;
+		const { viewportRef, scrollbarYRef, scrollbarXRef, thumbYRef, thumbXRef, cornerRef, cornerSize, setCornerSize, setThumbSize, rootId, setHiddenState, hiddenState, setHasMeasuredScrollbar, handleScroll, setHovering, setOverflowEdges, overflowEdges, overflowEdgeThreshold, scrollingX, scrollingY } = require_content_ScrollAreaContent.useScrollAreaRootContext();
+		const direction = require_control_SliderControl.useDirection();
+		let programmaticScroll = true;
+		const lastMeasuredViewportMetrics = [
+			NaN,
+			NaN,
+			NaN,
+			NaN
+		];
+		let scrollEndTimeoutId;
+		let waitForAnimationsTimeoutId;
+		let resizeObserver;
+		let scrollAreaOverflowVarsRegistered = false;
+		function removeCSSVariableInheritance() {
+			if (scrollAreaOverflowVarsRegistered) return;
+			if (typeof navigator !== "undefined" && /AppleWebKit/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent)) return;
+			if (typeof CSS !== "undefined" && "registerProperty" in CSS) {
+				const vars = [
+					ScrollAreaViewportCssVars.scrollAreaOverflowXStart,
+					ScrollAreaViewportCssVars.scrollAreaOverflowXEnd,
+					ScrollAreaViewportCssVars.scrollAreaOverflowYStart,
+					ScrollAreaViewportCssVars.scrollAreaOverflowYEnd
+				];
+				for (const name of vars) try {
+					CSS.registerProperty({
+						name,
+						syntax: "<length>",
+						inherits: false,
+						initialValue: "0px"
+					});
+				} catch {}
+			}
+			scrollAreaOverflowVarsRegistered = true;
 		}
-		const disabled = (0, vue.computed)(() => props.disabled ?? false);
-		const state = (0, vue.computed)(() => ({ disabled: disabled.value }));
-		(0, vue.provide)(fieldsetRootContextKey, {
-			legendId,
-			setLegendId,
-			disabled
-		});
-		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+		function computeThumbPosition() {
+			const viewportEl = viewportRef.value;
+			const scrollbarYEl = scrollbarYRef.value;
+			const scrollbarXEl = scrollbarXRef.value;
+			const thumbYEl = thumbYRef.value;
+			const thumbXEl = thumbXRef.value;
+			const cornerEl = cornerRef.value;
+			if (!viewportEl) return;
+			const scrollableContentHeight = viewportEl.scrollHeight;
+			const scrollableContentWidth = viewportEl.scrollWidth;
+			const viewportHeight = viewportEl.clientHeight;
+			const viewportWidth = viewportEl.clientWidth;
+			const scrollTop = viewportEl.scrollTop;
+			const scrollLeft = viewportEl.scrollLeft;
+			const isFirstMeasurement = Number.isNaN(lastMeasuredViewportMetrics[0]);
+			lastMeasuredViewportMetrics[0] = viewportHeight;
+			lastMeasuredViewportMetrics[1] = scrollableContentHeight;
+			lastMeasuredViewportMetrics[2] = viewportWidth;
+			lastMeasuredViewportMetrics[3] = scrollableContentWidth;
+			if (isFirstMeasurement) setHasMeasuredScrollbar(true);
+			if (scrollableContentHeight === 0 || scrollableContentWidth === 0) return;
+			const nextHiddenState = getHiddenState(viewportEl);
+			const scrollbarYHidden = nextHiddenState.y;
+			const scrollbarXHidden = nextHiddenState.x;
+			const ratioX = viewportWidth / scrollableContentWidth;
+			const ratioY = viewportHeight / scrollableContentHeight;
+			const maxScrollLeft = Math.max(0, scrollableContentWidth - viewportWidth);
+			const maxScrollTop = Math.max(0, scrollableContentHeight - viewportHeight);
+			let scrollLeftFromStart = 0;
+			let scrollLeftFromEnd = 0;
+			if (!scrollbarXHidden) {
+				let rawScrollLeftFromStart = 0;
+				if (direction.value === "rtl") rawScrollLeftFromStart = scrollLeft < 0 ? -scrollLeft : maxScrollLeft - scrollLeft;
+				else rawScrollLeftFromStart = scrollLeft;
+				rawScrollLeftFromStart = require_control_SliderControl.clamp(rawScrollLeftFromStart, 0, maxScrollLeft);
+				scrollLeftFromStart = normalizeScrollOffset(rawScrollLeftFromStart, maxScrollLeft);
+				scrollLeftFromEnd = maxScrollLeft - scrollLeftFromStart;
+			}
+			const rawScrollTopFromStart = !scrollbarYHidden ? require_control_SliderControl.clamp(scrollTop, 0, maxScrollTop) : 0;
+			const scrollTopFromStart = !scrollbarYHidden ? normalizeScrollOffset(rawScrollTopFromStart, maxScrollTop) : 0;
+			const scrollTopFromEnd = !scrollbarYHidden ? maxScrollTop - scrollTopFromStart : 0;
+			const nextWidth = scrollbarXHidden ? 0 : viewportWidth;
+			const nextHeight = scrollbarYHidden ? 0 : viewportHeight;
+			let nextCornerWidth = 0;
+			let nextCornerHeight = 0;
+			if (!scrollbarXHidden && !scrollbarYHidden) {
+				nextCornerWidth = scrollbarYEl?.offsetWidth || 0;
+				nextCornerHeight = scrollbarXEl?.offsetHeight || 0;
+			}
+			const cornerNotYetSized = cornerSize.value.width === 0 && cornerSize.value.height === 0;
+			const cornerWidthOffset = cornerNotYetSized ? nextCornerWidth : 0;
+			const cornerHeightOffset = cornerNotYetSized ? nextCornerHeight : 0;
+			const scrollbarXOffset = getOffset(scrollbarXEl, "padding", "x");
+			const scrollbarYOffset = getOffset(scrollbarYEl, "padding", "y");
+			const thumbXOffset = getOffset(thumbXEl, "margin", "x");
+			const thumbYOffset = getOffset(thumbYEl, "margin", "y");
+			const idealNextWidth = nextWidth - scrollbarXOffset - thumbXOffset;
+			const idealNextHeight = nextHeight - scrollbarYOffset - thumbYOffset;
+			const maxNextWidth = scrollbarXEl ? Math.min(scrollbarXEl.offsetWidth - cornerWidthOffset, idealNextWidth) : idealNextWidth;
+			const maxNextHeight = scrollbarYEl ? Math.min(scrollbarYEl.offsetHeight - cornerHeightOffset, idealNextHeight) : idealNextHeight;
+			const clampedNextWidth = Math.max(MIN_THUMB_SIZE, maxNextWidth * ratioX);
+			const clampedNextHeight = Math.max(MIN_THUMB_SIZE, maxNextHeight * ratioY);
+			setThumbSize({
+				width: clampedNextWidth,
+				height: clampedNextHeight
+			});
+			if (scrollbarYEl && thumbYEl) {
+				const maxThumbOffsetY = scrollbarYEl.offsetHeight - clampedNextHeight - scrollbarYOffset - thumbYOffset;
+				const scrollRangeY = scrollableContentHeight - viewportHeight;
+				const scrollRatioY = scrollRangeY === 0 ? 0 : scrollTop / scrollRangeY;
+				const thumbOffsetY = Math.min(maxThumbOffsetY, Math.max(0, scrollRatioY * maxThumbOffsetY));
+				thumbYEl.style.transform = `translate3d(0,${thumbOffsetY}px,0)`;
+			}
+			if (scrollbarXEl && thumbXEl) {
+				const maxThumbOffsetX = scrollbarXEl.offsetWidth - clampedNextWidth - scrollbarXOffset - thumbXOffset;
+				const scrollRangeX = scrollableContentWidth - viewportWidth;
+				const scrollRatioX = scrollRangeX === 0 ? 0 : scrollLeftFromStart / scrollRangeX;
+				const thumbOffsetX = direction.value === "rtl" ? -require_control_SliderControl.clamp(scrollRatioX * maxThumbOffsetX, 0, maxThumbOffsetX) : require_control_SliderControl.clamp(scrollRatioX * maxThumbOffsetX, 0, maxThumbOffsetX);
+				thumbXEl.style.transform = `translate3d(${thumbOffsetX}px,0,0)`;
+			}
+			const overflowMetricsPx = [
+				[ScrollAreaViewportCssVars.scrollAreaOverflowXStart, scrollLeftFromStart],
+				[ScrollAreaViewportCssVars.scrollAreaOverflowXEnd, scrollLeftFromEnd],
+				[ScrollAreaViewportCssVars.scrollAreaOverflowYStart, scrollTopFromStart],
+				[ScrollAreaViewportCssVars.scrollAreaOverflowYEnd, scrollTopFromEnd]
+			];
+			for (const [cssVar, value] of overflowMetricsPx) viewportEl.style.setProperty(cssVar, `${value}px`);
+			if (cornerEl) if (scrollbarXHidden || scrollbarYHidden) setCornerSize({
+				width: 0,
+				height: 0
+			});
+			else setCornerSize({
+				width: nextCornerWidth,
+				height: nextCornerHeight
+			});
+			setHiddenState(mergeHiddenState(hiddenState.value, nextHiddenState));
+			const threshold = overflowEdgeThreshold.value;
+			const nextOverflowEdges = {
+				xStart: !scrollbarXHidden && scrollLeftFromStart > threshold.xStart,
+				xEnd: !scrollbarXHidden && scrollLeftFromEnd > threshold.xEnd,
+				yStart: !scrollbarYHidden && scrollTopFromStart > threshold.yStart,
+				yEnd: !scrollbarYHidden && scrollTopFromEnd > threshold.yEnd
+			};
+			const prev = overflowEdges.value;
+			if (prev.xStart !== nextOverflowEdges.xStart || prev.xEnd !== nextOverflowEdges.xEnd || prev.yStart !== nextOverflowEdges.yStart || prev.yEnd !== nextOverflowEdges.yEnd) setOverflowEdges(nextOverflowEdges);
+		}
+		function handleUserInteraction() {
+			programmaticScroll = false;
+		}
+		function onScroll() {
+			if (!viewportRef.value) return;
+			computeThumbPosition();
+			if (!programmaticScroll) handleScroll({
+				x: viewportRef.value.scrollLeft,
+				y: viewportRef.value.scrollTop
+			});
+			clearTimeout(scrollEndTimeoutId);
+			scrollEndTimeoutId = setTimeout(() => {
+				programmaticScroll = true;
+			}, 100);
+		}
+		const viewportState = (0, vue.computed)(() => ({
+			scrolling: scrollingX.value || scrollingY.value,
+			hasOverflowX: !hiddenState.value.x,
+			hasOverflowY: !hiddenState.value.y,
+			overflowXStart: overflowEdges.value.xStart,
+			overflowXEnd: overflowEdges.value.xEnd,
+			overflowYStart: overflowEdges.value.yStart,
+			overflowYEnd: overflowEdges.value.yEnd,
+			cornerHidden: hiddenState.value.corner
+		}));
+		const { tag, mergedProps, renderless, ref: renderRef } = require_button_Button.useRenderElement({
 			componentProps: props,
-			state,
-			props: (0, vue.computed)(() => ({
-				...attrs,
-				"aria-labelledby": legendId.value
+			state: viewportState,
+			props: (0, vue.computed)(() => require_button_Button.mergeProps(attrs, {
+				role: "presentation",
+				...rootId ? { "data-id": `${rootId}-viewport` } : {},
+				tabindex: hiddenState.value.x && hiddenState.value.y ? -1 : 0,
+				class: styleDisableScrollbar.className,
+				style: { overflow: "scroll" },
+				onScroll,
+				onWheel: handleUserInteraction,
+				onTouchmove: handleUserInteraction,
+				onPointermove: handleUserInteraction,
+				onPointerenter: handleUserInteraction,
+				onKeydown: handleUserInteraction
 			})),
-			defaultTagName: "fieldset"
+			stateAttributesMapping: require_content_ScrollAreaContent.scrollAreaStateAttributesMapping,
+			defaultTagName: "div",
+			ref: viewportRef
 		});
+		(0, vue.onMounted)(() => {
+			removeCSSVariableInheritance();
+			if (viewportRef.value?.matches(":hover")) setHovering(true);
+			queueMicrotask(computeThumbPosition);
+			const viewport = viewportRef.value;
+			if (typeof ResizeObserver !== "undefined" && viewport) {
+				let hasInitialized = false;
+				resizeObserver = new ResizeObserver(() => {
+					if (!hasInitialized) {
+						hasInitialized = true;
+						if (lastMeasuredViewportMetrics[0] === viewport.clientHeight && lastMeasuredViewportMetrics[1] === viewport.scrollHeight && lastMeasuredViewportMetrics[2] === viewport.clientWidth && lastMeasuredViewportMetrics[3] === viewport.scrollWidth) return;
+					}
+					computeThumbPosition();
+				});
+				resizeObserver.observe(viewport);
+				waitForAnimationsTimeoutId = setTimeout(() => {
+					const animations = viewport.getAnimations({ subtree: true });
+					if (animations.length === 0) return;
+					Promise.allSettled(animations.map((a) => a.finished)).then(computeThumbPosition);
+				}, 0);
+			}
+		});
+		(0, vue.watch)([hiddenState, direction], () => {
+			queueMicrotask(computeThumbPosition);
+		});
+		(0, vue.watch)(overflowEdgeThreshold, computeThumbPosition);
+		(0, vue.onBeforeUnmount)(() => {
+			resizeObserver?.disconnect();
+			clearTimeout(scrollEndTimeoutId);
+			clearTimeout(waitForAnimationsTimeoutId);
+		});
+		(0, vue.provide)(require_content_ScrollAreaContent.scrollAreaViewportContextKey, { computeThumbPosition });
+		function getHiddenState(viewport) {
+			const y = viewport.clientHeight >= viewport.scrollHeight;
+			const x = viewport.clientWidth >= viewport.scrollWidth;
+			return {
+				y,
+				x,
+				corner: y || x
+			};
+		}
+		function mergeHiddenState(prevState, nextState) {
+			if (prevState.y === nextState.y && prevState.x === nextState.x && prevState.corner === nextState.corner) return prevState;
+			return nextState;
+		}
 		return (_ctx, _cache) => {
 			return (0, vue.unref)(renderless) ? (0, vue.renderSlot)(_ctx.$slots, "default", {
 				key: 0,
+				ref: (0, vue.unref)(renderRef),
 				props: (0, vue.unref)(mergedProps),
-				state: state.value
-			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(mergedProps))), {
-				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", { state: state.value })]),
+				state: viewportState.value
+			}) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tag)), (0, vue.mergeProps)({
+				key: 1,
+				ref: (0, vue.unref)(renderRef)
+			}, (0, vue.unref)(mergedProps)), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
 				_: 3
 			}, 16));
 		};
@@ -2691,8 +6462,21 @@ var FieldsetRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 });
 
 //#endregion
-//#region src/fieldset/root/FieldsetRoot.vue
-var FieldsetRoot_default = FieldsetRoot_vue_vue_type_script_setup_true_lang_default;
+//#region src/scroll-area/viewport/ScrollAreaViewport.vue
+var ScrollAreaViewport_default = ScrollAreaViewport_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/scroll-area/viewport/ScrollAreaViewportDataAttributes.ts
+let ScrollAreaViewportDataAttributes = /* @__PURE__ */ function(ScrollAreaViewportDataAttributes) {
+	ScrollAreaViewportDataAttributes["scrolling"] = "data-scrolling";
+	ScrollAreaViewportDataAttributes["hasOverflowX"] = "data-has-overflow-x";
+	ScrollAreaViewportDataAttributes["hasOverflowY"] = "data-has-overflow-y";
+	ScrollAreaViewportDataAttributes["overflowXStart"] = "data-overflow-x-start";
+	ScrollAreaViewportDataAttributes["overflowXEnd"] = "data-overflow-x-end";
+	ScrollAreaViewportDataAttributes["overflowYStart"] = "data-overflow-y-start";
+	ScrollAreaViewportDataAttributes["overflowYEnd"] = "data-overflow-y-end";
+	return ScrollAreaViewportDataAttributes;
+}({});
 
 //#endregion
 //#region src/separator/Separator.vue?vue&type=script&setup=true&lang.ts
@@ -2781,13 +6565,6 @@ let SeparatorDataAttributes = /* @__PURE__ */ function(SeparatorDataAttributes)
 	return SeparatorDataAttributes;
 }({});
 
-//#endregion
-//#region src/utils/valueToPercent.ts
-function valueToPercent(value, min, max) {
-	if (max === min) return 0;
-	return (value - min) * 100 / (max - min);
-}
-
 //#endregion
 //#region src/slider/indicator/SliderIndicator.vue?vue&type=script&setup=true&lang.ts
 /**
@@ -3438,12 +7215,6 @@ let SliderRootDataAttributes = /* @__PURE__ */ function(SliderRootDataAttributes
 	return SliderRootDataAttributes;
 }({});
 
-//#endregion
-//#region src/utils/formatNumber.ts
-function formatNumber(value, locale, options) {
-	return new Intl.NumberFormat(locale, options).format(value);
-}
-
 //#endregion
 //#region src/slider/thumb/prehydrationScript.min.ts
 const script = "(function prehydration() {\n  const firstThumb = document.currentScript?.parentElement\n  if (!firstThumb) {\n    return\n  }\n\n  const control = firstThumb.closest('[data-base-ui-slider-control]')\n  if (!control) {\n    return\n  }\n\n  const indicator = control.querySelector('[data-base-ui-slider-indicator]')\n  const controlRect = control.getBoundingClientRect()\n  const vertical = control.getAttribute('data-orientation') === 'vertical'\n  const side = vertical ? 'height' : 'width'\n  const inputElems = control.querySelectorAll('input[type=\"range\"]')\n  const range = inputElems.length > 1\n  const lastIndex = inputElems.length - 1\n\n  let startPosition = null\n  let relativeSize = null\n\n  for (let i = 0; i < inputElems.length; i += 1) {\n    const input = inputElems[i]\n\n    const value = Number.parseFloat(input.getAttribute('value') ?? '')\n\n    if (Number.isNaN(value)) {\n      return\n    }\n\n    const thumb = input.parentElement\n    if (!thumb) {\n      return\n    }\n\n    const max = Number.parseFloat(input.getAttribute('max') ?? '100')\n    const min = Number.parseFloat(input.getAttribute('min') ?? '0')\n\n    const thumbRect = thumb?.getBoundingClientRect()\n\n    const controlSize = controlRect[side] - thumbRect[side]\n    const thumbValuePercent = max === min ? 0 : ((value - min) * 100) / (max - min)\n    const thumbOffsetFromControlEdge\n      = thumbRect[side] / 2 + (controlSize * thumbValuePercent) / 100\n    const percent = (thumbOffsetFromControlEdge / controlRect[side]) * 100\n\n    if (Number.isFinite(percent)) {\n      thumb.style.setProperty(`--position`, `${percent}%`)\n      thumb.style.removeProperty('visibility')\n\n      if (indicator) {\n        if (i === 0) {\n          startPosition = percent\n          indicator.style.setProperty('--start-position', `${percent}%`)\n          if (!range) {\n            indicator.style.removeProperty('visibility')\n          }\n        }\n        else if (i === lastIndex) {\n          relativeSize = percent - (startPosition ?? 0)\n          indicator.style.setProperty('--end-position', `${percent}%`)\n          indicator.style.setProperty('--relative-size', `${relativeSize}%`)\n          indicator.style.removeProperty('visibility')\n        }\n      }\n    }\n  }\n})()";
@@ -3573,10 +7344,10 @@ var SliderThumb_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0
 		function getDefaultAriaValueText(values, index, format, locale) {
 			if (index < 0) return;
 			if (values.length === 2) {
-				if (index === 0) return `${formatNumber(values[index], locale, format)} start range`;
-				return `${formatNumber(values[index], locale, format)} end range`;
+				if (index === 0) return `${require_decrement_NumberFieldDecrement.formatNumber(values[index], locale, format)} start range`;
+				return `${require_decrement_NumberFieldDecrement.formatNumber(values[index], locale, format)} end range`;
 			}
-			return format ? formatNumber(values[index], locale, format) : void 0;
+			return format ? require_decrement_NumberFieldDecrement.formatNumber(values[index], locale, format) : void 0;
 		}
 		function getNewValue(thumbValue, step, direction, min, max) {
 			return direction === 1 ? Math.min(thumbValue + step, max) : Math.max(thumbValue - step, min);
@@ -3779,7 +7550,7 @@ var SliderThumb_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0
 			"aria-describedby": props.ariaDescribedby ?? inputValidationProps.value["aria-describedby"],
 			"aria-orientation": rootContext.orientation.value,
 			"aria-valuenow": thumbValue.value,
-			"aria-valuetext": typeof props.getAriaValueText === "function" ? props.getAriaValueText(formatNumber(thumbValue.value, rootContext.locale.value, rootContext.formatOptionsRef.value), thumbValue.value, index.value) : getDefaultAriaValueText(rootContext.values.value, index.value, rootContext.formatOptionsRef.value, rootContext.locale.value),
+			"aria-valuetext": typeof props.getAriaValueText === "function" ? props.getAriaValueText(require_decrement_NumberFieldDecrement.formatNumber(thumbValue.value, rootContext.locale.value, rootContext.formatOptionsRef.value), thumbValue.value, index.value) : getDefaultAriaValueText(rootContext.values.value, index.value, rootContext.formatOptionsRef.value, rootContext.locale.value),
 			"disabled": disabled.value,
 			"form": rootContext.form.value,
 			"id": inputId.value,
@@ -3992,7 +7763,7 @@ var SliderValue_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0
 			for (const thumbMetadata of rootContext.thumbMap.value.values()) if (thumbMetadata?.inputId) htmlFor += `${thumbMetadata.inputId} `;
 			return htmlFor.trim() === "" ? void 0 : htmlFor.trim();
 		});
-		const formattedValues = (0, vue.computed)(() => rootContext.values.value.map((value) => formatNumber(value, rootContext.locale.value, rootContext.formatOptionsRef.value)));
+		const formattedValues = (0, vue.computed)(() => rootContext.values.value.map((value) => require_decrement_NumberFieldDecrement.formatNumber(value, rootContext.locale.value, rootContext.formatOptionsRef.value)));
 		const defaultDisplayValue = (0, vue.computed)(() => rootContext.values.value.map((value, index) => formattedValues.value[index] || String(value)).join(" – "));
 		const valueProps = (0, vue.computed)(() => require_button_Button.mergeProps(attrs, {
 			"aria-live": props.ariaLive,
@@ -5793,6 +9564,180 @@ Object.defineProperty(exports, 'FieldsetRoot_default', {
     return FieldsetRoot_default;
   }
 });
+Object.defineProperty(exports, 'InputDataAttributes', {
+  enumerable: true,
+  get: function () {
+    return InputDataAttributes;
+  }
+});
+Object.defineProperty(exports, 'Input_default', {
+  enumerable: true,
+  get: function () {
+    return Input_default;
+  }
+});
+Object.defineProperty(exports, 'MeterIndicator_default', {
+  enumerable: true,
+  get: function () {
+    return MeterIndicator_default;
+  }
+});
+Object.defineProperty(exports, 'MeterLabel_default', {
+  enumerable: true,
+  get: function () {
+    return MeterLabel_default;
+  }
+});
+Object.defineProperty(exports, 'MeterRoot_default', {
+  enumerable: true,
+  get: function () {
+    return MeterRoot_default;
+  }
+});
+Object.defineProperty(exports, 'MeterTrack_default', {
+  enumerable: true,
+  get: function () {
+    return MeterTrack_default;
+  }
+});
+Object.defineProperty(exports, 'MeterValue_default', {
+  enumerable: true,
+  get: function () {
+    return MeterValue_default;
+  }
+});
+Object.defineProperty(exports, 'NumberFieldInput_default', {
+  enumerable: true,
+  get: function () {
+    return NumberFieldInput_default;
+  }
+});
+Object.defineProperty(exports, 'NumberFieldRoot_default', {
+  enumerable: true,
+  get: function () {
+    return NumberFieldRoot_default;
+  }
+});
+Object.defineProperty(exports, 'NumberFieldScrubAreaCursor_default', {
+  enumerable: true,
+  get: function () {
+    return NumberFieldScrubAreaCursor_default;
+  }
+});
+Object.defineProperty(exports, 'NumberFieldScrubArea_default', {
+  enumerable: true,
+  get: function () {
+    return NumberFieldScrubArea_default;
+  }
+});
+Object.defineProperty(exports, 'OtpFieldInput_default', {
+  enumerable: true,
+  get: function () {
+    return OtpFieldInput_default;
+  }
+});
+Object.defineProperty(exports, 'OtpFieldRoot_default', {
+  enumerable: true,
+  get: function () {
+    return OtpFieldRoot_default;
+  }
+});
+Object.defineProperty(exports, 'ProgressIndicator_default', {
+  enumerable: true,
+  get: function () {
+    return ProgressIndicator_default;
+  }
+});
+Object.defineProperty(exports, 'ProgressLabel_default', {
+  enumerable: true,
+  get: function () {
+    return ProgressLabel_default;
+  }
+});
+Object.defineProperty(exports, 'ProgressRootDataAttributes', {
+  enumerable: true,
+  get: function () {
+    return ProgressRootDataAttributes;
+  }
+});
+Object.defineProperty(exports, 'ProgressRoot_default', {
+  enumerable: true,
+  get: function () {
+    return ProgressRoot_default;
+  }
+});
+Object.defineProperty(exports, 'ProgressTrack_default', {
+  enumerable: true,
+  get: function () {
+    return ProgressTrack_default;
+  }
+});
+Object.defineProperty(exports, 'ProgressValue_default', {
+  enumerable: true,
+  get: function () {
+    return ProgressValue_default;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaRootCssVars', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaRootCssVars;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaRoot_default', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaRoot_default;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaScrollbarCssVars', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaScrollbarCssVars;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaScrollbarDataAttributes', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaScrollbarDataAttributes;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaScrollbar_default', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaScrollbar_default;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaThumbDataAttributes', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaThumbDataAttributes;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaThumb_default', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaThumb_default;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaViewportCssVars', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaViewportCssVars;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaViewportDataAttributes', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaViewportDataAttributes;
+  }
+});
+Object.defineProperty(exports, 'ScrollAreaViewport_default', {
+  enumerable: true,
+  get: function () {
+    return ScrollAreaViewport_default;
+  }
+});
 Object.defineProperty(exports, 'SeparatorDataAttributes', {
   enumerable: true,
   get: function () {
@@ -5985,12 +9930,48 @@ Object.defineProperty(exports, 'fieldsetRootContextKey', {
     return fieldsetRootContextKey;
   }
 });
+Object.defineProperty(exports, 'getOtpFieldInputState', {
+  enumerable: true,
+  get: function () {
+    return getOtpFieldInputState;
+  }
+});
+Object.defineProperty(exports, 'meterRootContextKey', {
+  enumerable: true,
+  get: function () {
+    return meterRootContextKey;
+  }
+});
 Object.defineProperty(exports, 'name', {
   enumerable: true,
   get: function () {
     return name;
   }
 });
+Object.defineProperty(exports, 'numberFieldScrubAreaContextKey', {
+  enumerable: true,
+  get: function () {
+    return numberFieldScrubAreaContextKey;
+  }
+});
+Object.defineProperty(exports, 'otpFieldRootContextKey', {
+  enumerable: true,
+  get: function () {
+    return otpFieldRootContextKey;
+  }
+});
+Object.defineProperty(exports, 'progressRootContextKey', {
+  enumerable: true,
+  get: function () {
+    return progressRootContextKey;
+  }
+});
+Object.defineProperty(exports, 'progressStateAttributesMapping', {
+  enumerable: true,
+  get: function () {
+    return progressStateAttributesMapping;
+  }
+});
 Object.defineProperty(exports, 'switchRootContextKey', {
   enumerable: true,
   get: function () {
@@ -6021,6 +10002,30 @@ Object.defineProperty(exports, 'useFieldsetRootContext', {
     return useFieldsetRootContext;
   }
 });
+Object.defineProperty(exports, 'useMeterRootContext', {
+  enumerable: true,
+  get: function () {
+    return useMeterRootContext;
+  }
+});
+Object.defineProperty(exports, 'useNumberFieldScrubAreaContext', {
+  enumerable: true,
+  get: function () {
+    return useNumberFieldScrubAreaContext;
+  }
+});
+Object.defineProperty(exports, 'useOtpFieldRootContext', {
+  enumerable: true,
+  get: function () {
+    return useOtpFieldRootContext;
+  }
+});
+Object.defineProperty(exports, 'useProgressRootContext', {
+  enumerable: true,
+  get: function () {
+    return useProgressRootContext;
+  }
+});
 Object.defineProperty(exports, 'useRender', {
   enumerable: true,
   get: function () {