bootstrap-vue-next/dist/useFormInput-C-iXRxog.js

Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development

import { d as formGroupKey } from "./keys-BgLwJbLV.js";
import { S as useToNumber } from "./dist-DKc2ivHS.js";
import { m as useFocus } from "./dist-9-XTMhb-.js";
import { t as useId$1 } from "./useId-Fh-Arhb7.js";
import { t as useAriaInvalid } from "./useAriaInvalid-CRUhkD2V.js";
import { t as useDebounceFn } from "./debounce-Xj7wsAmR.js";
import { t as useStateClass } from "./useStateClass-BF7kf2zK.js";
import { computed, inject, nextTick, onActivated, onMounted, ref, watch } from "vue";
//#region src/utils/normalizeInput.ts
var normalizeInput = (v, modelModifiers) => {
	if (v === null) return;
	let update = v;
	if (modelModifiers.number && typeof update === "string" && update !== "") {
		const parsed = Number.parseFloat(update);
		update = Number.isNaN(parsed) ? update : parsed;
	}
	return update;
};
//#endregion
//#region src/composables/useFormInput.ts
var useFormInput = (props, input, modelValue, modelModifiers) => {
	const computedId = useId$1(() => props.id, "input");
	const debounceNumber = useToNumber(() => props.debounce ?? 0, { nanToZero: true });
	const debounceMaxWaitNumber = useToNumber(() => props.debounceMaxWait ?? NaN);
	const formGroupData = inject(formGroupKey, null)?.();
	formGroupData?.track(computedId);
	const computedState = computed(() => props.state !== void 0 ? props.state : formGroupData?.state.value ?? null);
	const isDisabled = computed(() => props.disabled || (formGroupData?.disabled.value ?? false));
	const computedAriaInvalid = useAriaInvalid(() => props.ariaInvalid, computedState);
	const stateClass = useStateClass(computedState);
	const pendingValue = ref(null);
	const internalUpdateModelValue = useDebounceFn((value) => {
		modelValue.value = value;
		pendingValue.value = null;
	}, () => modelModifiers.lazy === true ? 0 : debounceNumber.value, { maxWait: () => modelModifiers.lazy === true ? NaN : debounceMaxWaitNumber.value });
	const updateModelValue = (value, force = false, immediate = false) => {
		if (modelModifiers.lazy === true && force === false) return;
		if (immediate) {
			pendingValue.value = null;
			modelValue.value = value;
		} else {
			pendingValue.value = value;
			internalUpdateModelValue(value);
		}
	};
	watch(modelValue, () => {
		internalUpdateModelValue.cancel();
		pendingValue.value = null;
	});
	const computedValue = computed(() => pendingValue.value ?? modelValue.value ?? void 0);
	const { focused } = useFocus(input, { initialValue: props.autofocus });
	const _formatValue = (value, evt, force = false) => {
		if (props.formatter !== void 0 && (!props.lazyFormatter || force)) return props.formatter(value, evt);
		return value;
	};
	onMounted(() => {
		if (input.value) input.value.value = modelValue.value?.toString() ?? "";
	});
	onActivated(() => {
		nextTick(() => {
			if (props.autofocus) focused.value = true;
		});
	});
	const syncDisplayedValue = (nextValue) => {
		if (input.value && input.value.value !== nextValue) input.value.value = nextValue;
	};
	const onInput = (evt) => {
		const { value } = evt.target;
		const formattedValue = _formatValue(value, evt);
		if (evt.defaultPrevented) {
			evt.preventDefault();
			return;
		}
		updateModelValue(formattedValue);
		if (formattedValue !== value) syncDisplayedValue(formattedValue);
	};
	const onChange = (evt) => {
		const { value } = evt.target;
		const formattedValue = _formatValue(value, evt);
		if (evt.defaultPrevented) {
			evt.preventDefault();
			return;
		}
		const nextModel = formattedValue;
		if (modelValue.value !== nextModel) updateModelValue(formattedValue, true);
	};
	const onBlur = (evt) => {
		if (!modelModifiers.lazy && !props.lazyFormatter && !modelModifiers.trim && debounceNumber.value <= 0) return;
		const { value } = evt.target;
		const formattedValue = _formatValue(value, evt, true);
		const nextModel = modelModifiers.trim ? formattedValue.trim() : formattedValue;
		internalUpdateModelValue.cancel();
		pendingValue.value = null;
		if (modelValue.value !== nextModel) updateModelValue(nextModel, true, true);
		if (nextModel !== value) syncDisplayedValue(nextModel);
	};
	const focus = () => {
		if (!isDisabled.value) focused.value = true;
	};
	const blur = () => {
		if (!isDisabled.value) focused.value = false;
	};
	return {
		input,
		computedId,
		computedAriaInvalid,
		computedValue,
		onInput,
		onChange,
		onBlur,
		focus,
		blur,
		stateClass,
		isDisabled
	};
};
//#endregion
export { normalizeInput as n, useFormInput as t };

//# sourceMappingURL=useFormInput-C-iXRxog.js.map