base-ui-vue 0.1.0

package/dist/control/FieldControl.js

@@ -0,0 +1,511 @@
+import { EMPTY_OBJECT, NOOP, mergeProps as mergeProps$1, useRenderElement } from "../button/Button.js";
+import { computed, createBlock, createCommentVNode, defineComponent, inject, mergeProps, openBlock, ref, renderSlot, resolveDynamicComponent, shallowReadonly, shallowRef, unref, useAttrs, useId, watchEffect } from "vue";
+
+//#region src/utils/useId.ts
+let globalId = 0;
+/**
+* Generates a unique ID string, optionally prefixed.
+* Uses Vue 3.5+ `useId()` when available, otherwise falls back to an
+* incrementing counter (client-side only, not SSR-safe).
+*
+* @param idOverride - If provided, returned as-is.
+* @param prefix - Optional prefix prepended to the generated id.
+*/
+function useId$1(idOverride, prefix) {
+	if (idOverride != null) return idOverride;
+	if (typeof useId === "function") {
+		const reactId = useId();
+		return prefix ? `${prefix}-${reactId}` : reactId;
+	}
+	globalId += 1;
+	const id = String(globalId);
+	return prefix ? `${prefix}-${id}` : id;
+}
+
+//#endregion
+//#region src/utils/useBaseUiId.ts
+/**
+* Wraps `useId` and prefixes generated IDs with `base-ui-`.
+* @param idOverride - If provided, returned as-is.
+*/
+function useBaseUiId(idOverride) {
+	return useId$1(idOverride, "base-ui");
+}
+
+//#endregion
+//#region src/labelable-provider/LabelableContext.ts
+const defaultContext$1 = {
+	controlId: shallowReadonly(shallowRef(void 0)),
+	setControlId: NOOP,
+	labelId: shallowReadonly(shallowRef(void 0)),
+	setLabelId: NOOP,
+	messageIds: shallowReadonly(shallowRef([])),
+	setMessageIds: NOOP,
+	getDescriptionProps: () => ({})
+};
+const labelableContextKey = Symbol("LabelableContext");
+function useLabelableContext() {
+	return inject(labelableContextKey, defaultContext$1);
+}
+
+//#endregion
+//#region src/labelable-provider/useAriaLabelledBy.ts
+function useAriaLabelledBy(params) {
+	const { ariaLabelledBy, labelId, labelSourceRef, enableFallback = true, labelSourceId } = params;
+	const fallbackAriaLabelledBy = ref(void 0);
+	const generatedLabelId = useBaseUiId(labelSourceId ? `${labelSourceId}-label` : void 0);
+	const resolvedAriaLabelledBy = computed(() => {
+		const explicit = ariaLabelledBy?.value;
+		const fromContext = labelId?.value;
+		return explicit ?? fromContext ?? fallbackAriaLabelledBy.value;
+	});
+	watchEffect(() => {
+		if (ariaLabelledBy?.value || labelId?.value || !enableFallback) {
+			fallbackAriaLabelledBy.value = void 0;
+			return;
+		}
+		const next = getAriaLabelledBy(labelSourceRef.value, generatedLabelId);
+		if (fallbackAriaLabelledBy.value !== next) fallbackAriaLabelledBy.value = next;
+	});
+	return resolvedAriaLabelledBy;
+}
+function getAriaLabelledBy(labelSource, generatedLabelId) {
+	const label = findAssociatedLabel(labelSource);
+	if (!label) return;
+	if (!label.id && generatedLabelId) label.id = generatedLabelId;
+	return label.id || void 0;
+}
+function findAssociatedLabel(labelSource) {
+	if (!labelSource) return;
+	const parent = labelSource.parentElement;
+	if (parent && parent.tagName === "LABEL") return parent;
+	const controlId = labelSource.id;
+	if (controlId) {
+		const nextSibling = labelSource.nextElementSibling;
+		if (nextSibling && nextSibling.htmlFor === controlId) return nextSibling;
+	}
+	const labels = labelSource.labels;
+	return labels && labels[0] ? labels[0] : void 0;
+}
+
+//#endregion
+//#region src/labelable-provider/useLabelableId.ts
+function useLabelableId(params = {}) {
+	const { id } = params;
+	const { controlId, setControlId } = useLabelableContext();
+	const defaultId = useBaseUiId(id);
+	const resolvedId = id ?? defaultId;
+	watchEffect((onCleanup) => {
+		if (!resolvedId) {
+			setControlId(void 0);
+			return;
+		}
+		setControlId(resolvedId);
+		onCleanup(() => {
+			setControlId(void 0);
+		});
+	});
+	return computed(() => controlId.value ?? defaultId);
+}
+
+//#endregion
+//#region src/field/root/FieldRootDataAttributes.ts
+let FieldRootDataAttributes = /* @__PURE__ */ function(FieldRootDataAttributes) {
+	/**
+	* Present when the field is disabled.
+	*/
+	FieldRootDataAttributes["disabled"] = "data-disabled";
+	/**
+	* Present when the field has been touched.
+	*/
+	FieldRootDataAttributes["touched"] = "data-touched";
+	/**
+	* Present when the field's value has changed.
+	*/
+	FieldRootDataAttributes["dirty"] = "data-dirty";
+	/**
+	* Present when the field is in valid state.
+	*/
+	FieldRootDataAttributes["valid"] = "data-valid";
+	/**
+	* Present when the field is in invalid state.
+	*/
+	FieldRootDataAttributes["invalid"] = "data-invalid";
+	/**
+	* Present when the field is filled.
+	*/
+	FieldRootDataAttributes["filled"] = "data-filled";
+	/**
+	* Present when the field control is focused.
+	*/
+	FieldRootDataAttributes["focused"] = "data-focused";
+	return FieldRootDataAttributes;
+}({});
+
+//#endregion
+//#region src/field/utils/constants.ts
+const DEFAULT_VALIDITY_STATE = {
+	badInput: false,
+	customError: false,
+	patternMismatch: false,
+	rangeOverflow: false,
+	rangeUnderflow: false,
+	stepMismatch: false,
+	tooLong: false,
+	tooShort: false,
+	typeMismatch: false,
+	valid: null,
+	valueMissing: false
+};
+const DEFAULT_FIELD_STATE_ATTRIBUTES = {
+	valid: null,
+	touched: false,
+	dirty: false,
+	filled: false,
+	focused: false
+};
+const DEFAULT_FIELD_ROOT_STATE = {
+	disabled: false,
+	...DEFAULT_FIELD_STATE_ATTRIBUTES
+};
+const fieldValidityMapping = { valid(value) {
+	if (value === null) return null;
+	if (value) return { [FieldRootDataAttributes.valid]: "" };
+	return { [FieldRootDataAttributes.invalid]: "" };
+} };
+
+//#endregion
+//#region src/field/root/FieldRootContext.ts
+function createDefaultContext() {
+	const defaultValidation = {
+		getValidationProps: () => ({}),
+		getInputValidationProps: () => ({}),
+		inputRef: shallowReadonly(shallowRef(null)),
+		setInputRef: () => {},
+		commit: async () => {}
+	};
+	return {
+		invalid: ref(void 0),
+		name: ref(void 0),
+		validityData: ref({
+			state: { ...DEFAULT_VALIDITY_STATE },
+			errors: [],
+			error: "",
+			value: "",
+			initialValue: null
+		}),
+		setValidityData: NOOP,
+		disabled: ref(false),
+		touched: ref(false),
+		setTouched: NOOP,
+		dirty: ref(false),
+		setDirty: NOOP,
+		filled: ref(false),
+		setFilled: NOOP,
+		focused: ref(false),
+		setFocused: NOOP,
+		validate: () => null,
+		validationMode: ref("onSubmit"),
+		validationDebounceTime: ref(0),
+		shouldValidateOnChange: () => false,
+		state: ref({ ...DEFAULT_FIELD_ROOT_STATE }),
+		markedDirtyRef: ref(false),
+		validation: defaultValidation
+	};
+}
+const fieldRootContextKey = Symbol("FieldRootContext");
+let _defaultContext = null;
+function useFieldRootContext(optional = true) {
+	const context = inject(fieldRootContextKey, void 0);
+	if (!context && !optional) throw new Error("Base UI Vue: FieldRootContext is missing. Field parts must be placed within <FieldRoot>.");
+	if (!context) {
+		if (!_defaultContext) _defaultContext = createDefaultContext();
+		return _defaultContext;
+	}
+	return context;
+}
+
+//#endregion
+//#region src/form/FormContext.ts
+const formContextKey = Symbol("FormContext");
+const defaultContext = {
+	errors: { value: EMPTY_OBJECT },
+	clearErrors: NOOP,
+	formRef: { value: { fields: /* @__PURE__ */ new Map() } },
+	validationMode: { value: "onSubmit" },
+	submitAttempted: { value: false }
+};
+function useFormContext() {
+	return inject(formContextKey, defaultContext);
+}
+
+//#endregion
+//#region src/field/utils/getCombinedFieldValidityData.ts
+/**
+* Combines the field's client-side, stateful validity data with the external
+* invalid state to determine the field's true validity.
+*/
+function getCombinedFieldValidityData(validityData, invalid) {
+	return {
+		...validityData,
+		state: {
+			...validityData.state,
+			valid: !invalid && validityData.state.valid
+		}
+	};
+}
+
+//#endregion
+//#region src/field/useField.ts
+function useField(params) {
+	const { enabled, value, id, name, controlRef, commit } = params;
+	const { formRef } = useFormContext();
+	const { invalid, markedDirtyRef, validityData, setValidityData } = useFieldRootContext();
+	const getValue = params.getValue ?? (() => value.value);
+	watchEffect(() => {
+		if (enabled && !enabled.value) return;
+		let initialValue = value.value;
+		if (initialValue === void 0) initialValue = getValue();
+		if (validityData.value.initialValue === null && initialValue !== null) setValidityData({
+			...validityData.value,
+			initialValue
+		});
+	});
+	watchEffect((onCleanup) => {
+		if (enabled && !enabled.value) return;
+		const currentId = id.value;
+		if (!currentId) return;
+		const fields = formRef.value.fields;
+		fields.set(currentId, {
+			getValue,
+			name: name?.value,
+			controlRef,
+			validityData: getCombinedFieldValidityData(validityData.value, invalid.value),
+			validate() {
+				let nextValue = value.value;
+				if (nextValue === void 0) nextValue = getValue();
+				markedDirtyRef.value = true;
+				commit(nextValue);
+			}
+		});
+		onCleanup(() => {
+			fields.delete(currentId);
+		});
+	});
+}
+
+//#endregion
+//#region src/field/control/FieldControl.vue?vue&type=script&setup=true&lang.ts
+var FieldControl_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	name: "FieldControl",
+	inheritAttrs: false,
+	__name: "FieldControl",
+	props: {
+		id: {
+			type: String,
+			required: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		value: {
+			type: String,
+			required: false
+		},
+		defaultValue: {
+			type: String,
+			required: false
+		},
+		autofocus: {
+			type: Boolean,
+			required: false,
+			default: 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,
+			default: "input"
+		},
+		class: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		style: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			required: false,
+			skipCheck: true
+		}
+	},
+	emits: ["valueChange"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const attrs = useAttrs();
+		const attrsObject = attrs;
+		const { state: fieldState, name: fieldName, disabled: fieldDisabled, setTouched, setDirty, markedDirtyRef, validityData, setFocused, setFilled, validationMode, validation } = useFieldRootContext();
+		const disabled = computed(() => fieldDisabled.value || props.disabled);
+		const name = computed(() => fieldName.value ?? props.name);
+		const state = computed(() => ({
+			...fieldState.value,
+			disabled: disabled.value
+		}));
+		const controlId = useLabelableId({ id: props.id });
+		const isControlled = computed(() => props.value !== void 0);
+		const internalValue = shallowRef(props.defaultValue ?? "");
+		const currentValue = computed(() => {
+			if (isControlled.value) return props.value;
+			return internalValue.value;
+		});
+		const inputElementRef = ref(null);
+		const { labelId } = useLabelableContext();
+		const ariaLabelledBy = useAriaLabelledBy({
+			ariaLabelledBy: computed(() => attrs["aria-labelledby"]),
+			labelId,
+			labelSourceRef: inputElementRef,
+			enableFallback: true,
+			labelSourceId: controlId.value ?? void 0
+		});
+		watchEffect(() => {
+			validation.setInputRef(inputElementRef.value);
+		});
+		useField({
+			id: controlId,
+			name,
+			commit: (v) => validation.commit(v),
+			value: currentValue,
+			getValue: () => inputElementRef.value?.value ?? internalValue.value,
+			controlRef: inputElementRef
+		});
+		watchEffect(() => {
+			const el = inputElementRef.value;
+			if (!el) return;
+			if (el.value || isControlled.value && props.value !== "") setFilled(true);
+			else if (isControlled.value && props.value === "") setFilled(false);
+		});
+		function handleInput(event) {
+			const target = event.target;
+			internalValue.value = target.value;
+			emit("valueChange", target.value, event);
+			setDirty(target.value !== validityData.value.initialValue);
+			setFilled(target.value !== "");
+		}
+		function handleInputCombined(event) {
+			handleInput(event);
+			validation.getInputValidationProps().onInput?.(event);
+		}
+		function handleFocus() {
+			setFocused(true);
+		}
+		function handleBlur(event) {
+			const target = event.target;
+			setTouched(true);
+			setFocused(false);
+			if (validationMode.value === "onBlur") validation.commit(target.value);
+		}
+		function handleKeydown(event) {
+			const target = event.target;
+			if (target.tagName === "INPUT" && event.key === "Enter") {
+				setTouched(true);
+				markedDirtyRef.value = true;
+				validation.commit(target.value);
+			}
+		}
+		const { tag, mergedProps, renderless, ref: renderRef } = useRenderElement({
+			componentProps: props,
+			state,
+			props: computed(() => mergeProps$1(attrsObject, validation.getInputValidationProps(), {
+				"id": controlId.value,
+				"disabled": disabled.value,
+				"name": name.value,
+				"aria-labelledby": ariaLabelledBy.value,
+				"autofocus": props.autofocus || void 0,
+				"type": props.type,
+				"required": props.required,
+				"pattern": props.pattern,
+				"minlength": props.minlength,
+				"maxlength": props.maxlength,
+				"min": props.min,
+				"max": props.max,
+				"step": props.step,
+				"placeholder": props.placeholder,
+				"value": isControlled.value ? props.value : internalValue.value,
+				"onInput": handleInputCombined,
+				"onFocus": handleFocus,
+				"onBlur": handleBlur,
+				"onKeydown": handleKeydown
+			})),
+			stateAttributesMapping: fieldValidityMapping,
+			defaultTagName: "input",
+			ref: inputElementRef
+		});
+		return (_ctx, _cache) => {
+			return unref(renderless) ? renderSlot(_ctx.$slots, "default", {
+				key: 0,
+				ref: unref(renderRef),
+				props: unref(mergedProps),
+				state: state.value
+			}) : (openBlock(), createBlock(resolveDynamicComponent(unref(tag)), mergeProps({
+				key: 1,
+				ref: unref(renderRef)
+			}, unref(mergedProps)), null, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/field/control/FieldControl.vue
+var FieldControl_default = FieldControl_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+export { DEFAULT_VALIDITY_STATE, FieldControl_default, fieldRootContextKey, fieldValidityMapping, formContextKey, getCombinedFieldValidityData, labelableContextKey, useBaseUiId, useFieldRootContext, useFormContext, useLabelableContext };
+//# sourceMappingURL=FieldControl.js.map

package/dist/control/FieldControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldControl.js","names":["useId","vueUseId","useId","defaultContext"],"sources":["../../src/utils/useId.ts","../../src/utils/useBaseUiId.ts","../../src/labelable-provider/LabelableContext.ts","../../src/labelable-provider/useAriaLabelledBy.ts","../../src/labelable-provider/useLabelableId.ts","../../src/field/root/FieldRootDataAttributes.ts","../../src/field/utils/constants.ts","../../src/field/root/FieldRootContext.ts","../../src/form/FormContext.ts","../../src/field/utils/getCombinedFieldValidityData.ts","../../src/field/useField.ts","../../src/field/control/FieldControl.vue","../../src/field/control/FieldControl.vue"],"sourcesContent":[],"mappings":"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"}

package/dist/control/FieldControlDataAttributes.cjs

@@ -0,0 +1,42 @@
+
+//#region src/field/control/FieldControlDataAttributes.ts
+let FieldControlDataAttributes = /* @__PURE__ */ function(FieldControlDataAttributes) {
+	/**
+	* Present when the field is disabled.
+	*/
+	FieldControlDataAttributes["disabled"] = "data-disabled";
+	/**
+	* Present when the field is in valid state.
+	*/
+	FieldControlDataAttributes["valid"] = "data-valid";
+	/**
+	* Present when the field is in invalid state.
+	*/
+	FieldControlDataAttributes["invalid"] = "data-invalid";
+	/**
+	* Present when the field has been touched.
+	*/
+	FieldControlDataAttributes["touched"] = "data-touched";
+	/**
+	* Present when the field's value has changed.
+	*/
+	FieldControlDataAttributes["dirty"] = "data-dirty";
+	/**
+	* Present when the field is filled.
+	*/
+	FieldControlDataAttributes["filled"] = "data-filled";
+	/**
+	* Present when the field control is focused.
+	*/
+	FieldControlDataAttributes["focused"] = "data-focused";
+	return FieldControlDataAttributes;
+}({});
+
+//#endregion
+Object.defineProperty(exports, 'FieldControlDataAttributes', {
+  enumerable: true,
+  get: function () {
+    return FieldControlDataAttributes;
+  }
+});
+//# sourceMappingURL=FieldControlDataAttributes.cjs.map

package/dist/control/FieldControlDataAttributes.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldControlDataAttributes.cjs","names":[],"sources":["../../src/field/control/FieldControlDataAttributes.ts"],"sourcesContent":[],"mappings":";;AAAA,IAAY,kFAAL;;;;AAIL;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA"}

package/dist/control/FieldControlDataAttributes.js

@@ -0,0 +1,36 @@
+//#region src/field/control/FieldControlDataAttributes.ts
+let FieldControlDataAttributes = /* @__PURE__ */ function(FieldControlDataAttributes) {
+	/**
+	* Present when the field is disabled.
+	*/
+	FieldControlDataAttributes["disabled"] = "data-disabled";
+	/**
+	* Present when the field is in valid state.
+	*/
+	FieldControlDataAttributes["valid"] = "data-valid";
+	/**
+	* Present when the field is in invalid state.
+	*/
+	FieldControlDataAttributes["invalid"] = "data-invalid";
+	/**
+	* Present when the field has been touched.
+	*/
+	FieldControlDataAttributes["touched"] = "data-touched";
+	/**
+	* Present when the field's value has changed.
+	*/
+	FieldControlDataAttributes["dirty"] = "data-dirty";
+	/**
+	* Present when the field is filled.
+	*/
+	FieldControlDataAttributes["filled"] = "data-filled";
+	/**
+	* Present when the field control is focused.
+	*/
+	FieldControlDataAttributes["focused"] = "data-focused";
+	return FieldControlDataAttributes;
+}({});
+
+//#endregion
+export { FieldControlDataAttributes };
+//# sourceMappingURL=FieldControlDataAttributes.js.map

package/dist/control/FieldControlDataAttributes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldControlDataAttributes.js","names":[],"sources":["../../src/field/control/FieldControlDataAttributes.ts"],"sourcesContent":[],"mappings":";AAAA,IAAY,kFAAL;;;;AAIL;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA"}

package/dist/description/FieldDescription.cjs

@@ -0,0 +1,86 @@
+const require_button_Button = require('../button/Button.cjs');
+const require_control_FieldControl = require('../control/FieldControl.cjs');
+let vue = require("vue");
+
+//#region src/field/description/FieldDescription.vue?vue&type=script&setup=true&lang.ts
+var FieldDescription_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "FieldDescription",
+	inheritAttrs: false,
+	__name: "FieldDescription",
+	props: {
+		id: {
+			type: String,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "p"
+		},
+		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 generatedId = require_control_FieldControl.useBaseUiId(void 0);
+		const id = (0, vue.computed)(() => props.id ?? generatedId);
+		const fieldRootContext = require_control_FieldControl.useFieldRootContext(false);
+		const { setMessageIds } = require_control_FieldControl.useLabelableContext();
+		(0, vue.watchEffect)((onCleanup) => {
+			const currentId = id.value;
+			if (currentId) {
+				setMessageIds((ids) => ids.concat(currentId));
+				onCleanup(() => setMessageIds((ids) => ids.filter((item) => item !== currentId)));
+			}
+		});
+		const { tag, mergedProps, renderless } = require_button_Button.useRenderElement({
+			componentProps: props,
+			state: fieldRootContext.state,
+			props: (0, vue.computed)(() => ({
+				...attrs,
+				id: id.value
+			})),
+			stateAttributesMapping: require_control_FieldControl.fieldValidityMapping,
+			defaultTagName: "p"
+		});
+		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)(fieldRootContext).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)(fieldRootContext).state })]),
+				_: 3
+			}, 16));
+		};
+	}
+});
+
+//#endregion
+//#region src/field/description/FieldDescription.vue
+var FieldDescription_default = FieldDescription_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+Object.defineProperty(exports, 'FieldDescription_default', {
+  enumerable: true,
+  get: function () {
+    return FieldDescription_default;
+  }
+});
+//# sourceMappingURL=FieldDescription.cjs.map