@vuecs/forms 4.0.0

package/dist/index.mjs

@@ -0,0 +1,1764 @@
+import { installDefaultsManager, installThemeManager, useComponentDefaults, useComponentTheme, useId } from "@vuecs/core";
+import { CheckboxGroupRoot, CheckboxIndicator, CheckboxRoot, NumberFieldDecrement, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, PinInputInput, PinInputRoot, RadioGroupIndicator, RadioGroupItem, RadioGroupRoot, SelectContent, SelectGroup, SelectIcon, SelectItem, SelectItemIndicator, SelectItemText, SelectLabel, SelectPortal, SelectRoot, SelectTrigger, SelectValue, SelectViewport, SliderRange, SliderRoot, SliderThumb, SliderTrack, SwitchRoot, SwitchThumb, TagsInputInput, TagsInputItem, TagsInputItemDelete, TagsInputItemText, TagsInputRoot } from "reka-ui";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, h, mergeProps, normalizeClass, openBlock, ref, renderList, renderSlot, resolveComponent, toDisplayString, toRef, toValue, vModelText, vShow, watch, withCtx, withDirectives } from "vue";
+import { onClickOutside, useDebounceFn, useInfiniteScroll } from "@vueuse/core";
+//#region src/components/form-checkbox/FormCheckbox.vue?vue&type=script&lang.ts
+const formCheckboxThemeDefaults = { classes: {
+	root: "vc-form-checkbox",
+	indicator: "vc-form-checkbox-indicator",
+	label: "vc-form-checkbox-label",
+	group: "vc-form-checkbox-wrapper"
+} };
+const behavioralDefaults$4 = { labelContent: "Input" };
+//#endregion
+//#region src/components/form-checkbox/FormCheckbox.vue
+var FormCheckbox_default = defineComponent({
+	name: "VCFormCheckbox",
+	inheritAttrs: false,
+	props: {
+		/** Controlled checked state. `null` is accepted as the documented "unset" value. */
+		modelValue: {
+			type: [
+				Boolean,
+				String,
+				null
+			],
+			default: void 0
+		},
+		/** Form-submission value when the checkbox is checked. */
+		value: {
+			type: [
+				String,
+				Number,
+				Boolean,
+				Object
+			],
+			default: "on"
+		},
+		/** When `true`, prevents the user from interacting with the checkbox. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the underlying form field as required. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Form-field name for HTML form submission. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** Element id; falls back to an SSR-safe generated id. */
+		id: {
+			type: String,
+			default: void 0
+		},
+		/** Vuecs convention: render the label by default. Internal control flow, not forwarded to Reka. */
+		label: {
+			type: Boolean,
+			default: true
+		},
+		/** Default label text (resolved through DefaultsManager). */
+		labelContent: {
+			type: String,
+			default: void 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	slots: Object,
+	setup(props, { attrs, emit, slots }) {
+		const theme = useComponentTheme("formCheckbox", props, formCheckboxThemeDefaults);
+		const defaults = useComponentDefaults("formCheckbox", props, behavioralDefaults$4);
+		const fallbackId = useId(void 0, "vc-form-checkbox");
+		return () => {
+			const resolved = theme.value;
+			const resolvedDefaults = defaults.value;
+			const id = props.id ?? fallbackId;
+			const checkbox = h(CheckboxRoot, mergeProps(attrs, {
+				id,
+				value: props.value,
+				name: props.name,
+				modelValue: props.modelValue,
+				disabled: props.disabled,
+				required: props.required,
+				"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+				class: resolved.root || void 0
+			}), { default: () => h(CheckboxIndicator, { class: resolved.indicator || void 0 }, { default: () => slots.indicator?.({ class: resolved.indicator }) ?? "" }) });
+			if (!props.label) return checkbox;
+			const labelNode = slots.label ? slots.label({
+				class: resolved.label,
+				id
+			}) : h("label", {
+				class: resolved.label || void 0,
+				for: id
+			}, [resolvedDefaults.labelContent]);
+			return h("div", { class: resolved.group || void 0 }, [checkbox, labelNode]);
+		};
+	}
+});
+//#endregion
+//#region src/components/form-checkbox-group/FormCheckboxGroup.vue?vue&type=script&lang.ts
+const formCheckboxGroupThemeDefaults = { classes: { root: "vc-form-checkbox-group" } };
+//#endregion
+//#region src/components/form-checkbox-group/FormCheckboxGroup.vue
+var FormCheckboxGroup_default = defineComponent({
+	name: "VCFormCheckboxGroup",
+	inheritAttrs: false,
+	props: {
+		/** Controlled array of selected values. */
+		modelValue: {
+			type: Array,
+			default: void 0
+		},
+		/** Disables every checkbox in the group. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the group as required for native form validation. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Form-field name for HTML form submission. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** Vuecs convention: vertical-stacked layout (Reka leaves this unset; the column layout is what `vc-form-checkbox-group` styles for). */
+		orientation: {
+			type: String,
+			default: "vertical"
+		},
+		/** Vuecs convention: arrow-key navigation wraps (Reka has no default). */
+		loop: {
+			type: Boolean,
+			default: true
+		},
+		/** When `false`, disables roving focus on group items. */
+		rovingFocus: {
+			type: Boolean,
+			default: true
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(props, { attrs, emit, slots }) {
+		const theme = useComponentTheme("formCheckboxGroup", props, formCheckboxGroupThemeDefaults);
+		return () => h(CheckboxGroupRoot, mergeProps(attrs, {
+			name: props.name,
+			orientation: props.orientation,
+			loop: props.loop,
+			modelValue: props.modelValue,
+			disabled: props.disabled,
+			required: props.required,
+			rovingFocus: props.rovingFocus,
+			"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+			class: theme.value.root || void 0
+		}), { default: () => slots.default?.() });
+	}
+});
+//#endregion
+//#region src/components/constants.ts
+let ValidationSeverity = /* @__PURE__ */ function(ValidationSeverity) {
+	ValidationSeverity["ERROR"] = "error";
+	ValidationSeverity["WARNING"] = "warning";
+	return ValidationSeverity;
+}({});
+//#endregion
+//#region src/components/validation-group/ValidationGroup.vue?vue&type=script&lang.ts
+const validationGroupThemeDefaults = { classes: { item: "form-group-hint group-required" } };
+//#endregion
+//#region src/components/validation-group/ValidationGroup.vue
+var ValidationGroup_default = defineComponent({
+	name: "VCValidationGroup",
+	props: {
+		/** Severity used to colour the rendered messages (`error` / `warning`). */
+		severity: {
+			type: String,
+			default: "error"
+		},
+		/** Validation messages — keyed object or ordered array of `{ key, value }`. */
+		messages: {
+			type: [Object, Array],
+			default: () => ({})
+		},
+		/** HTML tag used for each rendered message. */
+		itemTag: {
+			type: String,
+			default: "div"
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	slots: Object,
+	setup(props, { slots }) {
+		const theme = useComponentTheme("validationGroup", props, validationGroupThemeDefaults);
+		return () => {
+			const resolved = theme.value;
+			let errors;
+			if (Array.isArray(props.messages)) errors = props.messages;
+			else {
+				errors = [];
+				const keys = Object.keys(props.messages);
+				for (const key of keys) errors.push({
+					key,
+					value: props.messages[key]
+				});
+			}
+			if (slots.default) return slots.default({
+				data: errors,
+				severity: props.severity,
+				itemClass: resolved.item,
+				itemTag: props.itemTag
+			});
+			const children = [];
+			for (const error of errors) if (slots.item) children.push(slots.item({
+				key: error.key,
+				value: error.value,
+				class: resolved.item,
+				tag: props.itemTag,
+				severity: props.severity
+			}));
+			else children.push(h(props.itemTag, { class: resolved.item || void 0 }, [error.value]));
+			return children;
+		};
+	}
+});
+//#endregion
+//#region src/components/form-group/FormGroup.vue?vue&type=script&lang.ts
+const formGroupThemeDefaults = { classes: {
+	root: "",
+	label: "",
+	hint: "",
+	validationError: "",
+	validationWarning: ""
+} };
+const behavioralDefaults$3 = { validation: true };
+//#endregion
+//#region src/components/form-group/FormGroup.vue
+var FormGroup_default = defineComponent({
+	name: "VCFormGroup",
+	inheritAttrs: false,
+	props: {
+		/** When `true`/`false`, force-render or hide the label. When `undefined`, label visibility follows slot/content presence. */
+		label: {
+			type: Boolean,
+			default: void 0
+		},
+		/** HTML tag used for the label element. */
+		labelTag: {
+			type: String,
+			default: "label"
+		},
+		/** Default text rendered when no `label` slot is provided. */
+		labelContent: {
+			type: String,
+			default: void 0
+		},
+		/** When `true`/`false`, force-render or hide the hint. When `undefined`, hint visibility follows slot/content presence. */
+		hint: {
+			type: Boolean,
+			default: void 0
+		},
+		/** HTML tag used for the hint element. */
+		hintTag: {
+			type: String,
+			default: "div"
+		},
+		/** Default text rendered when no `hint` slot is provided. */
+		hintContent: {
+			type: String,
+			default: void 0
+		},
+		/** When `true`, render the validation messages section. Falls back to the global `formGroup.validation` default. */
+		validation: {
+			type: Boolean,
+			default: void 0
+		},
+		/** Severity used to colour the validation messages (`error` / `warning`). */
+		validationSeverity: {
+			type: String,
+			default: void 0
+		},
+		/** Validation messages — keyed object or ordered array of `{ key, value }`. */
+		validationMessages: {
+			type: [Object, Array],
+			default: void 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	slots: Object,
+	setup(props, { attrs, slots }) {
+		const theme = useComponentTheme("formGroup", props, formGroupThemeDefaults);
+		const defaults = useComponentDefaults("formGroup", props, behavioralDefaults$3);
+		return () => {
+			const resolved = theme.value;
+			const resolvedDefaults = defaults.value;
+			const children = [];
+			if (typeof props.label === "boolean" ? props.label : !!props.labelContent || !!slots.label) {
+				if (slots.label) children.push(h(props.labelTag, { class: resolved.label || void 0 }, slots.label({})));
+				else if (props.labelContent) children.push(h(props.labelTag, { class: resolved.label || void 0 }, [props.labelContent]));
+			}
+			if (slots.default) children.push(slots.default({}));
+			if (resolvedDefaults.validation) children.push(h(ValidationGroup_default, {
+				severity: props.validationSeverity,
+				messages: props.validationMessages || {}
+			}, {
+				...slots.validationGroup ? { default: slots.validationGroup } : {},
+				...slots.validationItem ? { item: slots.validationItem } : {}
+			}));
+			if (typeof props.hint === "boolean" ? props.hint : !!props.hintContent || !!slots.hint) {
+				if (slots.hint) children.push(h(props.hintTag, { class: resolved.hint || void 0 }, slots.hint({})));
+				else if (props.hintContent) children.push(h(props.hintTag, { class: resolved.hint || void 0 }, [props.hintContent]));
+			}
+			let validationClass;
+			if (resolvedDefaults.validation && props.validationMessages) {
+				if (Array.isArray(props.validationMessages) ? props.validationMessages.length > 0 : Object.keys(props.validationMessages).length > 0) validationClass = props.validationSeverity === "warning" ? resolved.validationWarning : resolved.validationError;
+			}
+			return h("div", mergeProps(attrs, { class: [resolved.root || void 0, validationClass || void 0] }), children);
+		};
+	}
+});
+//#endregion
+//#region src/components/form-input/FormInput.vue?vue&type=script&lang.ts
+const formInputThemeDefaults = { classes: {
+	root: "vc-form-input",
+	group: "vc-form-input-group",
+	groupAppend: "vc-form-input-group-append",
+	groupPrepend: "vc-form-input-group-prepend"
+} };
+//#endregion
+//#region src/components/form-input/FormInput.vue
+var FormInput_default = defineComponent({
+	name: "VCFormInput",
+	inheritAttrs: false,
+	props: {
+		/** Controlled string value (v-model). */
+		modelValue: {
+			type: String,
+			default: ""
+		},
+		/** Native `<input type>` attribute. */
+		type: {
+			type: String,
+			default: "text"
+		},
+		/** Force-render the input-group wrapper even without prepend/append content. */
+		group: {
+			type: Boolean,
+			default: false
+		},
+		/** When `true`, render a prepended group element using `groupPrependContent` (or the `groupPrepend` slot). */
+		groupPrepend: {
+			type: Boolean,
+			default: false
+		},
+		/** Default text/HTML rendered inside the prepend slot. */
+		groupPrependContent: {
+			type: String,
+			default: void 0
+		},
+		/** When `true`, render an appended group element using `groupAppendContent` (or the `groupAppend` slot). */
+		groupAppend: {
+			type: Boolean,
+			default: false
+		},
+		/** Default text/HTML rendered inside the append slot. */
+		groupAppendContent: {
+			type: String,
+			default: void 0
+		},
+		/** Debounce window (ms) for `update:modelValue` emissions. `0` disables debouncing. */
+		debounce: {
+			type: Number,
+			default: 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	slots: Object,
+	setup(props, { attrs, emit, slots }) {
+		const theme = useComponentTheme("formInput", props, formInputThemeDefaults);
+		const localValue = ref(props.modelValue);
+		watch(() => props.modelValue, (value) => {
+			localValue.value = value;
+		});
+		const emitUpdate = (value) => emit("update:modelValue", value);
+		const emitUpdateDebounced = useDebounceFn(emitUpdate, () => props.debounce);
+		const onInput = ($event) => {
+			const target = $event.target;
+			if (target.composing) return;
+			const { value } = target;
+			localValue.value = value;
+			if (props.debounce > 0) emitUpdateDebounced(value);
+			else emitUpdate(value);
+		};
+		return () => {
+			const resolved = theme.value;
+			const children = [];
+			if (slots.groupPrepend) children.push(slots.groupPrepend({
+				class: resolved.groupPrepend,
+				tag: "div"
+			}));
+			else if (props.groupPrepend) children.push(h("div", { class: resolved.groupPrepend || void 0 }, [props.groupPrependContent]));
+			children.push(h("input", mergeProps({
+				type: props.type,
+				class: resolved.root || void 0,
+				onInput,
+				value: localValue.value
+			}, attrs)));
+			if (slots.groupAppend) children.push(slots.groupAppend({
+				class: resolved.groupAppend,
+				tag: "div"
+			}));
+			else if (props.groupAppend) children.push(h("div", { class: resolved.groupAppend || void 0 }, [props.groupAppendContent]));
+			if (children.length > 1 || props.group) return h("div", { class: resolved.group || void 0 }, children);
+			return children[0];
+		};
+	}
+});
+//#endregion
+//#region src/components/form-number/FormNumber.vue?vue&type=script&lang.ts
+const formNumberThemeDefaults = { classes: {
+	root: "vc-form-number",
+	input: "vc-form-number-input",
+	decrement: "vc-form-number-decrement",
+	increment: "vc-form-number-increment"
+} };
+//#endregion
+//#region src/components/form-number/FormNumber.vue
+var FormNumber_default = defineComponent({
+	name: "VCFormNumber",
+	inheritAttrs: false,
+	props: {
+		/** Controlled numeric value. `null` is the documented "unset" value. */
+		modelValue: {
+			type: [Number, null],
+			default: void 0
+		},
+		/** Smallest allowed value. */
+		min: {
+			type: Number,
+			default: void 0
+		},
+		/** Largest allowed value. */
+		max: {
+			type: Number,
+			default: void 0
+		},
+		/** Increment / decrement step. */
+		step: {
+			type: Number,
+			default: 1
+		},
+		/** When `true`, snap typed values to the nearest step. */
+		stepSnapping: {
+			type: Boolean,
+			default: true
+		},
+		/** Vuecs convention: do NOT focus the input on programmatic value change (Reka defaults to `true`; this avoids surprising focus jumps). */
+		focusOnChange: {
+			type: Boolean,
+			default: false
+		},
+		/** `Intl.NumberFormat` options for display + parsing. */
+		formatOptions: {
+			type: Object,
+			default: void 0
+		},
+		/** BCP-47 locale used for formatting and currency. */
+		locale: {
+			type: String,
+			default: void 0
+		},
+		/** When `true`, prevents the user from interacting with the field. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the underlying form field as required. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Form-field name for HTML form submission. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** Element id for the root number field. */
+		id: {
+			type: String,
+			default: void 0
+		},
+		/** Vuecs internal: show ± stepper buttons. Drives the in-template render branch; not forwarded to Reka. */
+		steppers: {
+			type: Boolean,
+			default: true
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(props, { attrs, emit }) {
+		const theme = useComponentTheme("formNumber", props, formNumberThemeDefaults);
+		return () => h(NumberFieldRoot, mergeProps(attrs, {
+			focusOnChange: props.focusOnChange,
+			name: props.name,
+			id: props.id,
+			modelValue: props.modelValue,
+			min: props.min,
+			max: props.max,
+			step: props.step,
+			stepSnapping: props.stepSnapping,
+			formatOptions: props.formatOptions,
+			locale: props.locale,
+			disabled: props.disabled,
+			required: props.required,
+			"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+			class: theme.value.root || void 0
+		}), { default: () => {
+			const children = [];
+			if (props.steppers) children.push(h(NumberFieldDecrement, { class: theme.value.decrement || void 0 }, { default: () => "−" }));
+			children.push(h(NumberFieldInput, { class: theme.value.input || void 0 }));
+			if (props.steppers) children.push(h(NumberFieldIncrement, { class: theme.value.increment || void 0 }, { default: () => "+" }));
+			return children;
+		} });
+	}
+});
+//#endregion
+//#region src/components/form-pin/FormPin.vue?vue&type=script&lang.ts
+const formPinThemeDefaults = { classes: {
+	root: "vc-form-pin",
+	input: "vc-form-pin-input"
+} };
+//#endregion
+//#region src/components/form-pin/FormPin.vue
+var FormPin_default = defineComponent({
+	name: "VCFormPin",
+	inheritAttrs: false,
+	props: {
+		/** Controlled value (per-cell array). `null` is accepted as the documented "unset" value. */
+		modelValue: {
+			type: [Array, null],
+			default: void 0
+		},
+		/** Vuecs internal: number of input cells rendered. Drives the cell-render loop in setup; not forwarded to Reka. */
+		length: {
+			type: Number,
+			default: 6
+		},
+		/** Input type for each cell. Drives `inputmode` and modelValue array element type. */
+		type: {
+			type: String,
+			default: "text"
+		},
+		/** Per-cell placeholder character. */
+		placeholder: {
+			type: String,
+			default: ""
+		},
+		/** When `true`, render values as `<input type="password">` (dots). */
+		mask: {
+			type: Boolean,
+			default: false
+		},
+		/** Enable mobile OTP autofill (sets `autocomplete="one-time-code"`). */
+		otp: {
+			type: Boolean,
+			default: false
+		},
+		/** When `true`, prevents the user from interacting with the pin input. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the underlying form field as required. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Form-field name for HTML form submission. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** Element id for the root pin input. */
+		id: {
+			type: String,
+			default: void 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue", "complete"],
+	setup(props, { attrs, emit }) {
+		const theme = useComponentTheme("formPin", props, formPinThemeDefaults);
+		return () => h(PinInputRoot, mergeProps(attrs, {
+			name: props.name,
+			id: props.id,
+			modelValue: props.modelValue,
+			type: props.type,
+			placeholder: props.placeholder,
+			mask: props.mask,
+			otp: props.otp,
+			disabled: props.disabled,
+			required: props.required,
+			"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+			onComplete: (value) => emit("complete", value),
+			class: theme.value.root || void 0
+		}), { default: () => {
+			const cells = [];
+			for (let i = 0; i < props.length; i += 1) cells.push(h(PinInputInput, {
+				key: i,
+				index: i,
+				class: theme.value.input || void 0
+			}));
+			return cells;
+		} });
+	}
+});
+//#endregion
+//#region src/components/form-radio/FormRadio.vue?vue&type=script&lang.ts
+const formRadioThemeDefaults = { classes: {
+	root: "vc-form-radio",
+	indicator: "vc-form-radio-indicator",
+	label: "vc-form-radio-label",
+	group: "vc-form-radio-wrapper"
+} };
+const behavioralDefaults$2 = { labelContent: "Option" };
+//#endregion
+//#region src/components/form-radio/FormRadio.vue
+var FormRadio_default = defineComponent({
+	name: "VCFormRadio",
+	inheritAttrs: false,
+	props: {
+		/** Form-submission value identifying this radio option. */
+		value: {
+			type: [
+				String,
+				Number,
+				Boolean,
+				Object,
+				null
+			],
+			required: true
+		},
+		/** When `true`, prevents the user from interacting with the radio. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the underlying form field as required. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Element id; falls back to an SSR-safe generated id. */
+		id: {
+			type: String,
+			default: void 0
+		},
+		/** Vuecs convention: render the label by default. Internal control flow, not forwarded to Reka. */
+		label: {
+			type: Boolean,
+			default: true
+		},
+		/** Default label text (resolved through DefaultsManager). */
+		labelContent: {
+			type: String,
+			default: void 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	slots: Object,
+	setup(props, { attrs, slots }) {
+		const theme = useComponentTheme("formRadio", props, formRadioThemeDefaults);
+		const defaults = useComponentDefaults("formRadio", props, behavioralDefaults$2);
+		const fallbackId = useId(void 0, "vc-form-radio");
+		return () => {
+			const resolved = theme.value;
+			const resolvedDefaults = defaults.value;
+			const id = props.id ?? fallbackId;
+			const radio = h(RadioGroupItem, mergeProps(attrs, {
+				id,
+				value: props.value,
+				disabled: props.disabled,
+				required: props.required,
+				class: resolved.root || void 0
+			}), { default: () => h(RadioGroupIndicator, { class: resolved.indicator || void 0 }, { default: () => slots.indicator?.({ class: resolved.indicator }) ?? "" }) });
+			if (!props.label) return radio;
+			const labelNode = slots.label ? slots.label({
+				class: resolved.label,
+				id
+			}) : h("label", {
+				class: resolved.label || void 0,
+				for: id
+			}, [resolvedDefaults.labelContent]);
+			return h("div", { class: resolved.group || void 0 }, [radio, labelNode]);
+		};
+	}
+});
+//#endregion
+//#region src/components/form-radio-group/FormRadioGroup.vue?vue&type=script&lang.ts
+const formRadioGroupThemeDefaults = { classes: { root: "vc-form-radio-group" } };
+//#endregion
+//#region src/components/form-radio-group/FormRadioGroup.vue
+var FormRadioGroup_default = defineComponent({
+	name: "VCFormRadioGroup",
+	inheritAttrs: false,
+	props: {
+		/** Controlled selected value. */
+		modelValue: {
+			type: [
+				String,
+				Number,
+				Boolean,
+				Object,
+				null
+			],
+			default: void 0
+		},
+		/** Optional declarative shorthand — when set, renders one `<VCFormRadio>` per option. Mutually exclusive with the default slot. */
+		options: {
+			type: Array,
+			default: void 0
+		},
+		/** Disables every radio in the group. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the group as required for native form validation. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Form-field name for HTML form submission. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** Vuecs convention: vertical-stacked layout (Reka leaves this unset; vuecs styles the column variant in `vc-form-radio-group`). */
+		orientation: {
+			type: String,
+			default: "vertical"
+		},
+		/** When `true`, arrow-key navigation wraps from last to first item. */
+		loop: {
+			type: Boolean,
+			default: true
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(props, { attrs, emit, slots }) {
+		const theme = useComponentTheme("formRadioGroup", props, formRadioGroupThemeDefaults);
+		return () => h(RadioGroupRoot, mergeProps(attrs, {
+			name: props.name,
+			orientation: props.orientation,
+			modelValue: props.modelValue,
+			disabled: props.disabled,
+			required: props.required,
+			loop: props.loop,
+			"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+			class: theme.value.root || void 0
+		}), { default: () => {
+			if (props.options) return props.options.map((option) => h(FormRadio_default, {
+				key: String(option.value),
+				value: option.value,
+				disabled: option.disabled,
+				labelContent: option.label
+			}));
+			return slots.default?.();
+		} });
+	}
+});
+//#endregion
+//#region src/types/option.ts
+/** Type guard for narrowing in render code. */
+const isFormOptionGroup = (item) => Array.isArray(item.options);
+//#endregion
+//#region src/components/form-select/FormSelect.vue?vue&type=script&lang.ts
+const formSelectThemeDefaults = { classes: {
+	trigger: "vc-form-select-trigger",
+	value: "vc-form-select-value",
+	icon: "vc-form-select-icon",
+	content: "vc-form-select-content",
+	viewport: "vc-form-select-viewport",
+	item: "vc-form-select-item",
+	itemIndicator: "vc-form-select-item-indicator",
+	group: "vc-form-select-group",
+	groupLabel: "vc-form-select-group-label",
+	separator: "vc-form-select-separator"
+} };
+const behavioralDefaults$1 = { placeholder: "" };
+const renderItem = (option, classes, groupDisabled = false) => h(SelectItem, {
+	key: String(option.value),
+	value: option.value,
+	disabled: groupDisabled || option.disabled,
+	class: classes.item
+}, { default: () => [h(SelectItemText, null, () => [option.label]), h(SelectItemIndicator, { class: classes.itemIndicator }, () => "✓")] });
+const renderGroup = (group, classes) => h(SelectGroup, {
+	key: group.label,
+	class: classes.group
+}, { default: () => [h(SelectLabel, { class: classes.groupLabel }, () => [group.label]), ...group.options.map((option) => renderItem(option, classes, !!group.disabled))] });
+//#endregion
+//#region src/components/form-select/FormSelect.vue
+var FormSelect_default = defineComponent({
+	name: "VCFormSelect",
+	inheritAttrs: false,
+	props: {
+		/** Controlled selected value. */
+		modelValue: {
+			type: [
+				String,
+				Number,
+				Boolean,
+				Object,
+				null
+			],
+			default: void 0
+		},
+		/** Options rendered inside the dropdown (flat list or grouped). */
+		options: {
+			type: Array,
+			required: true
+		},
+		/** Placeholder text rendered inside the trigger when no option is selected. Falls back to the global `formSelect.placeholder` default. */
+		placeholder: {
+			type: String,
+			default: void 0
+		},
+		/** When `true`, blocks user interaction with the trigger. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** `name` attribute submitted with the owning form. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** When `true`, the field must be set before the owning form can submit. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(props, { attrs, emit }) {
+		const theme = useComponentTheme("formSelect", props, formSelectThemeDefaults);
+		const defaults = useComponentDefaults("formSelect", props, behavioralDefaults$1);
+		return () => {
+			const resolved = theme.value;
+			const { placeholder } = defaults.value;
+			const items = [];
+			for (const item of props.options) if (isFormOptionGroup(item)) items.push(renderGroup(item, resolved));
+			else items.push(renderItem(item, resolved));
+			return h(SelectRoot, {
+				name: props.name,
+				modelValue: props.modelValue,
+				disabled: props.disabled,
+				required: props.required,
+				"onUpdate:modelValue"(value) {
+					emit("update:modelValue", value);
+				}
+			}, { default: () => [h(SelectTrigger, mergeProps({ class: resolved.trigger || void 0 }, attrs), () => [h(SelectValue, {
+				class: resolved.value || void 0,
+				placeholder
+			}), h(SelectIcon, { class: resolved.icon || void 0 }, () => "▾")]), h(SelectPortal, null, () => [h(SelectContent, {
+				class: resolved.content || void 0,
+				position: "popper"
+			}, () => [h(SelectViewport, { class: resolved.viewport || void 0 }, () => items)])])] });
+		};
+	}
+});
+var FormSelectSearchEntry_vue_vue_type_script_lang_default = defineComponent({
+	props: {
+		/** The option this row represents. */
+		entry: {
+			type: Object,
+			required: true
+		},
+		/** The currently-selected options — used to compute `active` state. */
+		selected: { type: Array }
+	},
+	setup(props) {
+		return { active: computed(() => props.selected && props.selected.findIndex((el) => el.value === props.entry.value) !== -1) };
+	}
+});
+//#endregion
+//#region \0plugin-vue:export-helper
+var _plugin_vue_export_helper_default = (sfc, props) => {
+	const target = sfc.__vccOpts || sfc;
+	for (const [key, val] of props) target[key] = val;
+	return target;
+};
+//#endregion
+//#region src/components/form-select-search/FormSelectSearchEntry.vue
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+	return renderSlot(_ctx.$slots, "default", {
+		entry: _ctx.entry,
+		active: _ctx.active
+	}, () => [createTextVNode(toDisplayString(_ctx.entry.label), 1)]);
+}
+var FormSelectSearchEntry_default = /* @__PURE__ */ _plugin_vue_export_helper_default(FormSelectSearchEntry_vue_vue_type_script_lang_default, [["render", _sfc_render$1]]);
+//#endregion
+//#region src/components/form-select-search/FormSelectSearch.vue?vue&type=script&lang.ts
+const formSelectSearchThemeDefaults = { classes: {
+	root: "vc-form-select-search",
+	input: "vc-form-select-search-input",
+	content: "vc-form-select-search-content",
+	item: "vc-form-select-search-item",
+	itemActive: "active",
+	itemCurrent: "current",
+	itemDescription: "vc-form-select-search-item-description",
+	selected: "vc-form-select-search-selected",
+	selectedItem: "vc-form-select-search-selected-item",
+	selectedItemRemove: "vc-form-select-search-selected-item-remove"
+} };
+var FormSelectSearch_vue_vue_type_script_lang_default = defineComponent({
+	components: { FormSelectSearchEntry: FormSelectSearchEntry_default },
+	props: {
+		/** Controlled selected value(s) — single value or array for multi-select. */
+		modelValue: {
+			type: [
+				String,
+				Number,
+				Boolean,
+				Object,
+				Array,
+				null
+			],
+			default: void 0
+		},
+		/** Options shown in the dropdown. */
+		options: {
+			type: Array,
+			default: () => []
+		},
+		/** Placeholder shown in the search input when empty. */
+		placeholder: {
+			type: String,
+			required: false,
+			default: "..."
+		},
+		/** When `true`, blocks user interaction with the input and chips. */
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		/** Initial page size for the virtualised dropdown list. */
+		maxItems: {
+			type: Number,
+			required: false,
+			default: 10
+		},
+		/** Number of items to append per infinite-scroll step. */
+		scrollDistance: {
+			type: Number,
+			required: false,
+			default: 10
+		},
+		/**
+		* Whether to close the dropdown after a pick. When unset:
+		* - single-select closes (matches the native `<select>` mental model)
+		* - multi-select stays open (so the user can pick several without re-opening)
+		*
+		* Set explicitly (`true` / `false`) to override the mode-default.
+		*/
+		closeOnSelect: {
+			type: Boolean,
+			default: void 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(props, { emit }) {
+		const theme = useComponentTheme("formSelectSearch", props, formSelectSearchThemeDefaults);
+		const listElement = ref(null);
+		const inputElement = ref(null);
+		const q = ref("");
+		const currentIndex = ref(-1);
+		const selected = ref([]);
+		const modelValue = toRef(props, "modelValue");
+		const findOption = (value) => props.options.find((option) => option.value === value);
+		const reset = () => {
+			if (Array.isArray(props.modelValue)) {
+				selected.value = props.modelValue.map((value) => findOption(value)).filter((option) => option !== void 0);
+				return;
+			}
+			if (typeof props.modelValue === "undefined" || props.modelValue === null) {
+				selected.value = [];
+				q.value = "";
+				return;
+			}
+			const found = findOption(props.modelValue);
+			if (found) {
+				selected.value = [found];
+				q.value = found.label;
+			} else {
+				selected.value = [];
+				q.value = "";
+			}
+		};
+		reset();
+		watch(modelValue, () => {
+			reset();
+		}, { deep: true });
+		const isMulti = computed(() => Array.isArray(modelValue.value));
+		const items = computed(() => {
+			if (!q.value || q.value.length < 1) return props.options;
+			const escaped = q.value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+			const pattern = new RegExp(escaped, "ig");
+			return props.options.filter((option) => option.label.match(pattern));
+		});
+		const pageSize = computed(() => Math.max(1, props.maxItems));
+		const pageStep = computed(() => Math.max(1, props.scrollDistance));
+		const itemsDisplayed = ref([]);
+		const setItemsDisplayed = () => {
+			itemsDisplayed.value = items.value.slice(0, pageSize.value);
+		};
+		const showMoreItemsDisplayed = () => {
+			const startIndex = itemsDisplayed.value.length;
+			const endIndex = Math.min(startIndex + pageStep.value, items.value.length);
+			if (startIndex >= endIndex) return;
+			itemsDisplayed.value.push(...items.value.slice(startIndex, endIndex));
+		};
+		setItemsDisplayed();
+		watch(items, () => {
+			currentIndex.value = -1;
+			setItemsDisplayed();
+		});
+		useInfiniteScroll(listElement, () => {
+			showMoreItemsDisplayed();
+		}, { canLoadMore() {
+			return itemsDisplayed.value.length < items.value.length;
+		} });
+		const isDisplayed = ref(false);
+		const shouldCloseOnSelect = () => typeof props.closeOnSelect === "boolean" ? props.closeOnSelect : !isMulti.value;
+		const toggle = (option) => {
+			if (props.disabled) return;
+			if (isMulti.value) {
+				const index = selected.value.findIndex((el) => el.value === option.value);
+				if (index === -1) selected.value.push(option);
+				else selected.value.splice(index, 1);
+				const values = selected.value.map((el) => el.value);
+				emit("update:modelValue", values);
+				emit("change", values);
+				if (shouldCloseOnSelect()) isDisplayed.value = false;
+				return;
+			}
+			let isBlank = false;
+			const [selectedValue] = selected.value;
+			if (selectedValue) if (selectedValue.value === option.value) {
+				q.value = "";
+				selected.value.length = 0;
+				isBlank = true;
+			} else {
+				q.value = option.label;
+				selected.value = [option];
+			}
+			else {
+				q.value = option.label;
+				selected.value = [option];
+			}
+			if (shouldCloseOnSelect()) isDisplayed.value = false;
+			if (isBlank) {
+				emit("update:modelValue", null);
+				emit("change", null);
+				return;
+			}
+			emit("update:modelValue", option.value);
+			emit("change", option.value);
+		};
+		const display = () => {
+			if (props.disabled) return;
+			isDisplayed.value = true;
+		};
+		const hide = () => {
+			if (!isMulti.value && selected.value.length === 1) q.value = selected.value[0].label;
+			isDisplayed.value = false;
+		};
+		onClickOutside(listElement, () => {
+			hide();
+		}, { ignore: [inputElement] });
+		const onFocus = () => {
+			q.value = "";
+			display();
+		};
+		const onKeyUp = (ev) => {
+			if (ev.key === "ArrowUp" || ev.key === "ArrowDown") {
+				display();
+				if (ev.key === "ArrowUp") {
+					if (currentIndex.value > 0) currentIndex.value--;
+					return;
+				}
+				if (currentIndex.value < itemsDisplayed.value.length - 1) currentIndex.value++;
+			}
+			if (ev.key !== "Enter") display();
+		};
+		const onKeyDown = (ev) => {
+			if (ev.key === "Enter") {
+				if (!isDisplayed.value) return;
+				if (itemsDisplayed.value.length === 1) {
+					toggle(itemsDisplayed.value[0]);
+					return;
+				}
+				if (currentIndex.value >= 0 && itemsDisplayed.value[currentIndex.value]) {
+					toggle(itemsDisplayed.value[currentIndex.value]);
+					return;
+				}
+				if (selected.value.length === 0) {
+					if (itemsDisplayed.value[0]) toggle(itemsDisplayed.value[0]);
+					return;
+				}
+				hide();
+				return;
+			}
+			if (ev.key === "Tab") hide();
+		};
+		return {
+			theme,
+			listElement,
+			inputElement,
+			isMulti,
+			toggle,
+			currentIndex,
+			q,
+			items: itemsDisplayed,
+			selected,
+			display,
+			onFocus,
+			onKeyUp,
+			onKeyDown,
+			isDisplayed
+		};
+	}
+});
+//#endregion
+//#region src/components/form-select-search/FormSelectSearch.vue
+const _hoisted_1 = ["disabled", "placeholder"];
+const _hoisted_2 = ["onMousedown"];
+const _hoisted_3 = ["disabled", "onClick"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+	const _component_FormSelectSearchEntry = resolveComponent("FormSelectSearchEntry");
+	return openBlock(), createElementBlock("div", { class: normalizeClass(_ctx.theme.root) }, [
+		withDirectives(createElementVNode("input", {
+			ref: "inputElement",
+			"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.q = $event),
+			class: normalizeClass(_ctx.theme.input),
+			disabled: _ctx.disabled,
+			placeholder: _ctx.placeholder,
+			onFocus: _cache[1] || (_cache[1] = (...args) => _ctx.onFocus && _ctx.onFocus(...args)),
+			onKeyup: _cache[2] || (_cache[2] = (...args) => _ctx.onKeyUp && _ctx.onKeyUp(...args)),
+			onKeydown: _cache[3] || (_cache[3] = (...args) => _ctx.onKeyDown && _ctx.onKeyDown(...args))
+		}, null, 42, _hoisted_1), [[vModelText, _ctx.q]]),
+		withDirectives(createElementVNode("div", {
+			ref: "listElement",
+			class: normalizeClass(_ctx.theme.content)
+		}, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.items, (option, index) => {
+			return openBlock(), createBlock(_component_FormSelectSearchEntry, {
+				key: String(option.value),
+				entry: option,
+				selected: _ctx.selected
+			}, {
+				default: withCtx(({ entry, active }) => [createElementVNode("div", {
+					class: normalizeClass([_ctx.theme.item, {
+						[_ctx.theme.itemActive]: active,
+						[_ctx.theme.itemCurrent]: index === _ctx.currentIndex
+					}]),
+					onMousedown: ($event) => _ctx.toggle(entry)
+				}, [createTextVNode(toDisplayString(entry.label) + " ", 1), entry.description ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					class: normalizeClass(_ctx.theme.itemDescription)
+				}, toDisplayString(entry.description), 3)) : createCommentVNode("v-if", true)], 42, _hoisted_2)]),
+				_: 2
+			}, 1032, ["entry", "selected"]);
+		}), 128))], 2), [[vShow, _ctx.isDisplayed]]),
+		_ctx.isMulti ? (openBlock(), createElementBlock("div", {
+			key: 0,
+			class: normalizeClass(_ctx.theme.selected)
+		}, [renderSlot(_ctx.$slots, "selected", {
+			items: _ctx.selected,
+			toggle: _ctx.toggle
+		}, () => [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.selected, (item) => {
+			return openBlock(), createElementBlock("button", {
+				key: String(item.value),
+				type: "button",
+				class: normalizeClass(_ctx.theme.selectedItem),
+				disabled: _ctx.disabled,
+				onClick: ($event) => _ctx.toggle(item)
+			}, [createTextVNode(toDisplayString(item.label) + " ", 1), createElementVNode("span", {
+				class: normalizeClass(_ctx.theme.selectedItemRemove),
+				"aria-hidden": "true"
+			}, "×", 2)], 10, _hoisted_3);
+		}), 128))])], 2)) : createCommentVNode("v-if", true)
+	], 2);
+}
+var FormSelectSearch_default = /* @__PURE__ */ _plugin_vue_export_helper_default(FormSelectSearch_vue_vue_type_script_lang_default, [["render", _sfc_render]]);
+//#endregion
+//#region src/components/form-slider/FormSlider.vue?vue&type=script&lang.ts
+const formSliderThemeDefaults = { classes: {
+	root: "vc-form-slider",
+	track: "vc-form-slider-track",
+	range: "vc-form-slider-range",
+	thumb: "vc-form-slider-thumb"
+} };
+//#endregion
+//#region src/components/form-slider/FormSlider.vue
+var FormSlider_default = defineComponent({
+	name: "VCFormSlider",
+	inheritAttrs: false,
+	props: {
+		/** Controlled value — number for single-thumb, array for range / multi-thumb. `null` is the documented "unset" value. */
+		modelValue: {
+			type: [
+				Number,
+				Array,
+				null
+			],
+			default: void 0
+		},
+		/** Minimum value for the range. */
+		min: {
+			type: Number,
+			default: 0
+		},
+		/** Maximum value for the range. */
+		max: {
+			type: Number,
+			default: 100
+		},
+		/** Stepping interval between values. */
+		step: {
+			type: Number,
+			default: 1
+		},
+		/** Slider axis. */
+		orientation: {
+			type: String,
+			default: "horizontal"
+		},
+		/** When `true`, the slider is visually inverted. */
+		inverted: {
+			type: Boolean,
+			default: false
+		},
+		/** When `true`, prevents the user from interacting with the slider. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the underlying form field as required. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Form-field name for HTML form submission. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** Minimum permitted steps between adjacent thumbs (multi-thumb mode). */
+		minStepsBetweenThumbs: {
+			type: Number,
+			default: 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue", "valueCommit"],
+	setup(props, { attrs, emit }) {
+		const theme = useComponentTheme("formSlider", props, formSliderThemeDefaults);
+		const isScalar = computed(() => typeof props.modelValue === "number");
+		const internalValue = computed(() => {
+			if (props.modelValue === void 0 || props.modelValue === null) return [props.min];
+			return Array.isArray(props.modelValue) ? props.modelValue : [props.modelValue];
+		});
+		const handleUpdate = (next) => {
+			if (isScalar.value) emit("update:modelValue", next[0]);
+			else emit("update:modelValue", next);
+		};
+		const handleCommit = (next) => {
+			if (isScalar.value) emit("valueCommit", next[0]);
+			else emit("valueCommit", next);
+		};
+		return () => h(SliderRoot, mergeProps(attrs, {
+			modelValue: internalValue.value,
+			name: props.name,
+			min: props.min,
+			max: props.max,
+			step: props.step,
+			orientation: props.orientation,
+			inverted: props.inverted,
+			disabled: props.disabled,
+			required: props.required,
+			minStepsBetweenThumbs: props.minStepsBetweenThumbs,
+			"onUpdate:modelValue": handleUpdate,
+			onValueCommit: handleCommit,
+			class: theme.value.root || void 0
+		}), { default: () => [h(SliderTrack, { class: theme.value.track || void 0 }, { default: () => h(SliderRange, { class: theme.value.range || void 0 }) }), ...internalValue.value.map((_, index) => h(SliderThumb, {
+			key: index,
+			class: theme.value.thumb || void 0
+		}))] });
+	}
+});
+//#endregion
+//#region src/components/form-switch/FormSwitch.vue?vue&type=script&lang.ts
+const formSwitchThemeDefaults = { classes: {
+	root: "vc-form-switch",
+	thumb: "vc-form-switch-thumb",
+	label: "vc-form-switch-label",
+	group: "vc-form-switch-wrapper"
+} };
+const behavioralDefaults = { labelContent: "Toggle" };
+//#endregion
+//#region src/components/form-switch/FormSwitch.vue
+var FormSwitch_default = defineComponent({
+	name: "VCFormSwitch",
+	inheritAttrs: false,
+	props: {
+		/** Controlled checked state. `null` is accepted as the documented "unset" value. */
+		modelValue: {
+			type: [Boolean, null],
+			default: void 0
+		},
+		/** When `true`, prevents the user from interacting with the switch. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the underlying form field as required. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Form-field name for HTML form submission. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** Form-submission value when the switch is on. */
+		value: {
+			type: String,
+			default: "on"
+		},
+		/** Element id; falls back to an SSR-safe generated id. */
+		id: {
+			type: String,
+			default: void 0
+		},
+		/** Vuecs convention: render the label by default. Internal control flow, not forwarded to Reka. */
+		label: {
+			type: Boolean,
+			default: true
+		},
+		/** Default label text (resolved through DefaultsManager). */
+		labelContent: {
+			type: String,
+			default: void 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	slots: Object,
+	setup(props, { attrs, emit, slots }) {
+		const theme = useComponentTheme("formSwitch", props, formSwitchThemeDefaults);
+		const defaults = useComponentDefaults("formSwitch", props, behavioralDefaults);
+		const fallbackId = useId(void 0, "vc-form-switch");
+		return () => {
+			const resolved = theme.value;
+			const resolvedDefaults = defaults.value;
+			const id = props.id ?? fallbackId;
+			const switchEl = h(SwitchRoot, mergeProps(attrs, {
+				id,
+				value: props.value,
+				name: props.name,
+				modelValue: props.modelValue,
+				disabled: props.disabled,
+				required: props.required,
+				"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+				class: resolved.root || void 0
+			}), { default: () => h(SwitchThumb, { class: resolved.thumb || void 0 }, { default: () => slots.thumb?.({ class: resolved.thumb }) ?? "" }) });
+			if (!props.label) return switchEl;
+			const labelNode = slots.label ? slots.label({
+				class: resolved.label,
+				id
+			}) : h("label", {
+				class: resolved.label || void 0,
+				for: id
+			}, [resolvedDefaults.labelContent]);
+			return h("div", { class: resolved.group || void 0 }, [switchEl, labelNode]);
+		};
+	}
+});
+//#endregion
+//#region src/components/form-tags/FormTags.vue?vue&type=script&lang.ts
+const formTagsThemeDefaults = { classes: {
+	root: "vc-form-tags",
+	item: "vc-form-tags-item",
+	itemText: "vc-form-tags-item-text",
+	itemDelete: "vc-form-tags-item-delete",
+	input: "vc-form-tags-input"
+} };
+//#endregion
+//#region src/components/form-tags/FormTags.vue
+var FormTags_default = defineComponent({
+	name: "VCFormTags",
+	inheritAttrs: false,
+	props: {
+		/** Controlled list of tag values. `null` is the documented "unset" value. */
+		modelValue: {
+			type: [Array, null],
+			default: void 0
+		},
+		/** Placeholder shown in the empty input field. */
+		placeholder: {
+			type: String,
+			default: void 0
+		},
+		/** When `true`, prevents the user from interacting with the input. */
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		/** Marks the underlying form field as required. */
+		required: {
+			type: Boolean,
+			default: false
+		},
+		/** Maximum number of tags (0 = unlimited). */
+		max: {
+			type: Number,
+			default: 0
+		},
+		/** When `true`, paste events split on the delimiter and commit the parts. */
+		addOnPaste: {
+			type: Boolean,
+			default: false
+		},
+		/** When `true`, pressing Tab commits the pending tag. */
+		addOnTab: {
+			type: Boolean,
+			default: false
+		},
+		/** Vuecs convention: commit a pending tag when the input loses focus (Reka has no default; vuecs opts in so blur-to-commit "just works"). */
+		addOnBlur: {
+			type: Boolean,
+			default: true
+		},
+		/** When `true`, allow duplicate tag values. */
+		duplicate: {
+			type: Boolean,
+			default: false
+		},
+		/** Character or regular expression that triggers a new tag (and splits pasted text). */
+		delimiter: {
+			type: [String, RegExp],
+			default: ","
+		},
+		/** Form-field name for HTML form submission. */
+		name: {
+			type: String,
+			default: void 0
+		},
+		/** Element id for the root tags input. */
+		id: {
+			type: String,
+			default: void 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue", "invalid"],
+	setup(props, { attrs, emit }) {
+		const theme = useComponentTheme("formTags", props, formTagsThemeDefaults);
+		return () => h(TagsInputRoot, mergeProps(attrs, {
+			placeholder: props.placeholder,
+			addOnBlur: props.addOnBlur,
+			name: props.name,
+			id: props.id,
+			modelValue: props.modelValue,
+			disabled: props.disabled,
+			required: props.required,
+			max: props.max,
+			addOnPaste: props.addOnPaste,
+			addOnTab: props.addOnTab,
+			duplicate: props.duplicate,
+			delimiter: props.delimiter,
+			"onUpdate:modelValue": (value) => emit("update:modelValue", value),
+			onInvalid: (value) => emit("invalid", value),
+			class: theme.value.root || void 0
+		}), { default: ({ modelValue }) => [...(modelValue ?? []).map((tag) => h(TagsInputItem, {
+			key: String(tag),
+			value: tag,
+			class: theme.value.item || void 0
+		}, { default: () => [h(TagsInputItemText, { class: theme.value.itemText || void 0 }), h(TagsInputItemDelete, { class: theme.value.itemDelete || void 0 }, { default: () => "×" })] })), h(TagsInputInput, {
+			placeholder: props.placeholder,
+			class: theme.value.input || void 0
+		})] });
+	}
+});
+//#endregion
+//#region src/components/form-textarea/FormTextarea.vue?vue&type=script&lang.ts
+const formTextareaThemeDefaults = { classes: { root: "" } };
+//#endregion
+//#region src/components/form-textarea/FormTextarea.vue
+var FormTextarea_default = defineComponent({
+	name: "VCFormTextarea",
+	props: {
+		/** Controlled string value (v-model). */
+		modelValue: {
+			type: String,
+			default: ""
+		},
+		/** Debounce window (ms) for `update:modelValue` emissions. `0` disables debouncing. */
+		debounce: {
+			type: Number,
+			default: 0
+		},
+		/** Theme-class overrides for this component instance. */
+		themeClass: {
+			type: Object,
+			default: void 0
+		},
+		/** Theme variant values for this component instance. */
+		themeVariant: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(props, { attrs, emit }) {
+		const theme = useComponentTheme("formTextarea", props, formTextareaThemeDefaults);
+		const localValue = ref(props.modelValue);
+		watch(() => props.modelValue, (value) => {
+			localValue.value = value;
+		});
+		const emitUpdate = (value) => emit("update:modelValue", value);
+		const emitUpdateDebounced = useDebounceFn(emitUpdate, () => props.debounce);
+		const onInput = ($event) => {
+			const target = $event.target;
+			if (target.composing) return;
+			const { value } = target;
+			localValue.value = value;
+			if (props.debounce > 0) emitUpdateDebounced(value);
+			else emitUpdate(value);
+		};
+		return () => h("textarea", mergeProps({
+			placeholder: "...",
+			class: theme.value.root || void 0,
+			onInput,
+			value: localValue.value
+		}, attrs));
+	}
+});
+//#endregion
+//#region src/composables/use-submit-button.ts
+const hardcodedDefaults = {
+	createText: "Create",
+	updateText: "Update",
+	createIcon: "",
+	updateIcon: "",
+	createColor: "success",
+	updateColor: "primary"
+};
+/**
+* @experimental
+*
+* Reactive `v-bind` source for `<VCButton>` that swaps label / icon /
+* color between create and update modes based on `isEditing`. All four
+* customization knobs (`createText`, `updateText`, `createIcon`,
+* `updateIcon`, `createColor`, `updateColor`) resolve through the
+* `DefaultsManager` under the `submitButton` key, so consumers can wire
+* i18n labels and per-app color/icon choices once at `app.use()` time.
+*
+* The API surface (option names, return shape, defaults key) may change
+* in a future minor release while this stays experimental — pin a
+* version if you depend on the exact shape.
+*
+* @example
+* ```ts
+* const submit = useSubmitButton({ isEditing: () => isEditing.value, loading });
+* ```
+*
+* ```vue
+* <VCButton v-bind="submit" />
+* ```
+*/
+function useSubmitButton(options = {}) {
+	const defaults = useComponentDefaults("submitButton", {}, hardcodedDefaults);
+	return computed(() => {
+		const editing = toValue(options.isEditing) ?? false;
+		const resolved = defaults.value;
+		const label = editing ? resolved.updateText : resolved.createText;
+		const iconClass = editing ? resolved.updateIcon : resolved.createIcon;
+		const color = editing ? resolved.updateColor : resolved.createColor;
+		return {
+			type: "submit",
+			label,
+			iconLeft: iconClass || void 0,
+			color,
+			loading: toValue(options.loading) ?? false,
+			disabled: toValue(options.disabled) ?? false
+		};
+	});
+}
+//#endregion
+//#region src/index.ts
+function install(instance, options = {}) {
+	installThemeManager(instance, options);
+	installDefaultsManager(instance, options);
+	Object.entries({
+		VCFormCheckbox: FormCheckbox_default,
+		VCFormCheckboxGroup: FormCheckboxGroup_default,
+		VCFormGroup: FormGroup_default,
+		VCFormInput: FormInput_default,
+		VCFormNumber: FormNumber_default,
+		VCFormPin: FormPin_default,
+		VCFormRadio: FormRadio_default,
+		VCFormRadioGroup: FormRadioGroup_default,
+		VCFormSelect: FormSelect_default,
+		VCFormSelectSearch: FormSelectSearch_default,
+		VCFormSlider: FormSlider_default,
+		VCFormSwitch: FormSwitch_default,
+		VCFormTags: FormTags_default,
+		VCFormTextarea: FormTextarea_default
+	}).forEach(([componentName, component]) => {
+		instance.component(componentName, component);
+	});
+}
+var src_default = { install };
+//#endregion
+export { FormCheckbox_default as VCFormCheckbox, FormCheckboxGroup_default as VCFormCheckboxGroup, FormGroup_default as VCFormGroup, FormInput_default as VCFormInput, FormNumber_default as VCFormNumber, FormPin_default as VCFormPin, FormRadio_default as VCFormRadio, FormRadioGroup_default as VCFormRadioGroup, FormSelect_default as VCFormSelect, FormSelectSearch_default as VCFormSelectSearch, FormSlider_default as VCFormSlider, FormSwitch_default as VCFormSwitch, FormTags_default as VCFormTags, FormTextarea_default as VCFormTextarea, ValidationGroup_default as VCValidationGroup, ValidationSeverity, src_default as default, formCheckboxGroupThemeDefaults, formCheckboxThemeDefaults, formGroupThemeDefaults, formInputThemeDefaults, formNumberThemeDefaults, formPinThemeDefaults, formRadioGroupThemeDefaults, formRadioThemeDefaults, formSelectSearchThemeDefaults, formSelectThemeDefaults, formSliderThemeDefaults, formSwitchThemeDefaults, formTagsThemeDefaults, formTextareaThemeDefaults, install, isFormOptionGroup, useSubmitButton, validationGroupThemeDefaults };
+
+//# sourceMappingURL=index.mjs.map