ropav 0.1.6 → 0.1.8

package/dist/tags-input.js

@@ -0,0 +1,380 @@
+import './tags-input.css';
+import { t as useStylesApi } from "./styles-api.js";
+import { n as toPresenceAttribute } from "./attributes.js";
+import { t as bem } from "./bem.js";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { t as x_default } from "./x.js";
+import { o as splitCompatibilityAttributes, t as composeEventHandlers } from "./attributes2.js";
+import { t as useControlState } from "./useControlState.js";
+import { i as isNodeWithinElement } from "./events.js";
+import { t as isInteractiveElement } from "./interactive.js";
+import { i as useHiddenSelectChoiceTransaction, r as createStringListNativeChoiceAdapter } from "./nativeChoice.js";
+import { child, computed, createComponent, createFor, createIf, createSlot, createTemplateRefSetter, defineVaporComponent, next, nextTick, on, ref, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, setText, template, toDisplayString, unref, withModifiers } from "vue";
+//#region src/components/tags-input/tagsInputModel.ts
+function normalizeTagsInputValue(value) {
+	return value.trim();
+}
+function addTagsInputValues(values, candidates, options) {
+	const nextValues = [...values];
+	const maxTags = options.maxTags === void 0 ? Number.POSITIVE_INFINITY : Math.max(0, options.maxTags);
+	for (const candidate of candidates) {
+		const value = normalizeTagsInputValue(candidate);
+		if (value === "" || nextValues.length >= maxTags) continue;
+		if (!options.allowDuplicates && nextValues.includes(value)) continue;
+		if (options.validate && !options.validate(value)) continue;
+		nextValues.push(value);
+	}
+	return nextValues;
+}
+function splitTagsInputValue(value, splitChars) {
+	const delimiters = new Set(splitChars);
+	const tags = [];
+	let remainder = "";
+	let wasSplit = false;
+	for (const character of Array.from(value)) {
+		if (!delimiters.has(character)) {
+			remainder += character;
+			continue;
+		}
+		tags.push(remainder);
+		remainder = "";
+		wasSplit = true;
+	}
+	return {
+		tags: wasSplit ? tags : [],
+		remainder: wasSplit ? remainder : value
+	};
+}
+//#endregion
+//#region src/components/tags-input/useTagsInput.ts
+function useTagsInputTransaction(props, emitUpdate, inputRef, onFormReset) {
+	const transaction = useHiddenSelectChoiceTransaction({
+		value: {
+			modelValue: () => props.modelValue,
+			defaultValue: () => [...props.defaultValue ?? []],
+			onChange: emitUpdate
+		},
+		native: {
+			adapter: createStringListNativeChoiceAdapter(),
+			className: "rp-tags-input__native",
+			focusVisible: () => inputRef.value?.focus(),
+			validationMessage: () => props.readonly ? void 0 : props.validationMessage
+		},
+		onFormReset
+	});
+	return {
+		nativeSelectRef: transaction.nativeSelectRef,
+		nativeSelectAttrs: transaction.nativeSelectAttrs,
+		requestValueUpdate: transaction.requestValueUpdate,
+		values: transaction.value
+	};
+}
+function areTagValuesEqual(left, right) {
+	return left.length === right.length && left.every((value, index) => value === right[index]);
+}
+function useTagsInput(props, emitUpdate) {
+	const rootRef = ref(null);
+	const inputRef = ref(null);
+	const searchValue = ref("");
+	function updateSearch(value) {
+		searchValue.value = value;
+		if (inputRef.value && inputRef.value.value !== value) inputRef.value.value = value;
+	}
+	const transaction = useTagsInputTransaction(props, emitUpdate, inputRef, () => updateSearch(""));
+	const values = transaction.values;
+	const control = useControlState(props);
+	const rootClass = computed(() => bem("rp-tags-input", {
+		[`size-${props.size}`]: Boolean(props.size),
+		[`radius-${props.radius}`]: Boolean(props.radius),
+		disabled: control.disabled,
+		readonly: props.readonly,
+		invalid: control.invalid
+	}));
+	const canClear = computed(() => Boolean(props.clearable && values.value.length > 0 && !control.disabled && !props.readonly));
+	function addValues(candidates) {
+		if (control.disabled || props.readonly) return false;
+		const nextValues = addTagsInputValues(values.value, candidates, {
+			allowDuplicates: props.allowDuplicates ?? false,
+			maxTags: props.maxTags,
+			validate: props.validate
+		});
+		if (areTagValuesEqual(nextValues, values.value)) return false;
+		transaction.requestValueUpdate(nextValues);
+		return true;
+	}
+	function commitSearch() {
+		if (searchValue.value.trim() === "") return false;
+		const wasAdded = addValues([searchValue.value]);
+		if (wasAdded) updateSearch("");
+		return wasAdded;
+	}
+	function removeTag(index) {
+		if (control.disabled || props.readonly || index < 0 || index >= values.value.length) return;
+		transaction.requestValueUpdate(values.value.filter((_, valueIndex) => valueIndex !== index));
+		nextTick(() => inputRef.value?.focus());
+	}
+	function clear() {
+		if (!canClear.value) return;
+		transaction.requestValueUpdate([]);
+		updateSearch("");
+		nextTick(() => inputRef.value?.focus());
+	}
+	function focusInput(event) {
+		if (control.disabled) return;
+		if (event && isInteractiveElement(event.target, ".rp-tags-input__input")) return;
+		inputRef.value?.focus();
+	}
+	function onInput(event) {
+		if (control.disabled || props.readonly || event.isComposing) return;
+		const inputValue = event.currentTarget.value;
+		const { tags, remainder } = splitTagsInputValue(inputValue, props.splitChars ?? [","]);
+		if (tags.length > 0) addValues(tags);
+		updateSearch(remainder);
+	}
+	function onInputBlur(event) {
+		if (isNodeWithinElement(event.relatedTarget, rootRef.value)) return;
+		if (props.acceptValueOnBlur) commitSearch();
+	}
+	function onInputKeydown(event) {
+		if (control.disabled || props.readonly || event.isComposing) return;
+		if (event.key === "Enter" && searchValue.value.trim() !== "") {
+			event.preventDefault();
+			commitSearch();
+			return;
+		}
+		if (event.key === "Backspace" && searchValue.value === "") {
+			const lastIndex = values.value.length - 1;
+			if (lastIndex >= 0) removeTag(lastIndex);
+		}
+	}
+	return {
+		templateRefs: {
+			root: rootRef,
+			input: inputRef,
+			native: transaction.nativeSelectRef
+		},
+		nativeSelectAttrs: transaction.nativeSelectAttrs,
+		control,
+		rootClass,
+		values,
+		searchValue,
+		canClear,
+		removeTag,
+		clear,
+		focusInput,
+		onInput,
+		onInputBlur,
+		onInputKeydown
+	};
+}
+//#endregion
+//#region src/components/tags-input/tags-input.vue?vue&type=script&setup=true&vapor=true&lang.ts
+var t0 = template(" ");
+var t1 = template("<button data-v-9fbac28f></button>");
+var t2 = template("<span data-v-9fbac28f><span data-v-9fbac28f></span>");
+var t3 = template("<button data-v-9fbac28f>");
+var t4 = template("<div data-v-9fbac28f><select data-v-9fbac28f></select><div data-v-9fbac28f><input data-v-9fbac28f></div>", 1);
+//#endregion
+//#region src/components/tags-input/tags-input.vue
+var tags_input_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
+	name: "RpTagsInput",
+	inheritAttrs: false,
+	__name: "tags-input",
+	props: {
+		id: {},
+		name: {},
+		form: {},
+		modelValue: { default: void 0 },
+		defaultValue: { default: () => [] },
+		maxTags: { default: void 0 },
+		allowDuplicates: {
+			type: Boolean,
+			default: false
+		},
+		splitChars: { default: () => [","] },
+		acceptValueOnBlur: {
+			type: Boolean,
+			default: false
+		},
+		validate: {
+			type: Function,
+			default: void 0
+		},
+		size: {},
+		radius: {},
+		placeholder: { default: "Enter tags..." },
+		clearable: {
+			type: Boolean,
+			default: false
+		},
+		clearLabel: { default: "Clear tags" },
+		removeLabel: { default: "Remove" },
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: void 0
+		},
+		invalid: {
+			type: Boolean,
+			default: void 0
+		},
+		ariaLabel: {},
+		describedby: {},
+		labelledby: {},
+		inputAttrs: {},
+		validationMessage: {},
+		classNames: {},
+		styles: {}
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { templateRefs, nativeSelectAttrs, control, rootClass, values, searchValue, canClear, removeTag, clear, focusInput, onInput, onInputBlur, onInputKeydown } = useTagsInput(props, (value) => emit("update:modelValue", value));
+		const { getPartAttrs, getRootAttrs } = useStylesApi(props, "root");
+		const rootAttrs = computed(() => getRootAttrs({
+			class: rootClass.value,
+			onMousedown: focusInput,
+			"data-disabled": toPresenceAttribute(control.disabled),
+			"data-readonly": toPresenceAttribute(props.readonly),
+			"data-invalid": toPresenceAttribute(control.invalid)
+		}));
+		const visibleInputAttrs = computed(() => {
+			const attrs = props.inputAttrs ?? {};
+			const { compatibilityClass, compatibilityStyle, forwardedAttributes } = splitCompatibilityAttributes(attrs);
+			return {
+				...forwardedAttributes,
+				...getPartAttrs("input", {
+					class: "rp-tags-input__input",
+					compatibilityClass,
+					compatibilityStyle
+				}),
+				id: control.id,
+				name: void 0,
+				form: "",
+				type: "text",
+				value: searchValue.value,
+				placeholder: values.value.length === 0 ? props.placeholder : void 0,
+				disabled: control.disabled || void 0,
+				readonly: props.readonly || void 0,
+				required: void 0,
+				autocomplete: forwardedAttributes.autocomplete ?? "off",
+				"aria-disabled": control.disabled || void 0,
+				"aria-invalid": control.invalid || void 0,
+				"aria-required": control.required || void 0,
+				"aria-label": control.ariaLabelledby ? void 0 : props.ariaLabel || void 0,
+				"aria-labelledby": control.ariaLabelledby,
+				"aria-describedby": control.ariaDescribedby,
+				"data-disabled": toPresenceAttribute(control.disabled),
+				"data-readonly": toPresenceAttribute(props.readonly),
+				"data-invalid": toPresenceAttribute(control.invalid),
+				onInput: composeEventHandlers(onInput, attrs.onInput),
+				onBlur: composeEventHandlers(onInputBlur, attrs.onBlur),
+				onKeydown: composeEventHandlers(onInputKeydown, attrs.onKeydown)
+			};
+		});
+		__expose({
+			nativeElement: templateRefs.native,
+			inputElement: templateRefs.input,
+			focus: () => templateRefs.input.value?.focus()
+		});
+		const _setTemplateRef = createTemplateRefSetter();
+		const n18 = t4();
+		const n0 = child(n18);
+		const n13 = next(n0, 1);
+		const n12 = child(n13, 1);
+		renderEffect(() => {
+			const _control = unref(control);
+			setDynamicProps(n18, [rootAttrs.value]);
+			setDynamicProps(n0, [unref(nativeSelectAttrs), {
+				name: __props.name,
+				form: _control.form,
+				disabled: _control.disabled || void 0,
+				required: _control.required && !__props.readonly || void 0,
+				multiple: "",
+				tabindex: "-1",
+				"aria-hidden": "true"
+			}]);
+			_setTemplateRef(n0, unref(templateRefs).native);
+			setDynamicProps(n13, [unref(getPartAttrs)("tags", { class: "rp-tags-input__tags" })]);
+		});
+		setInsertionState(n13, 0);
+		createFor(() => unref(values), (_for_item0, _for_key0) => {
+			const n11 = t2();
+			const n6 = child(n11);
+			renderEffect(() => {
+				const _getPartAttrs = unref(getPartAttrs);
+				setDynamicProps(n11, [_getPartAttrs("tag", { class: "rp-tags-input__tag" })]);
+				setDynamicProps(n6, [_getPartAttrs("tagLabel", { class: "rp-tags-input__tag-label" })]);
+			});
+			setInsertionState(n6, null, 0);
+			createSlot("tag", { value: () => _for_item0.value }, () => {
+				const n5 = t0();
+				renderEffect(() => setText(n5, toDisplayString(_for_item0.value)));
+				return n5;
+			}, 1);
+			setInsertionState(n11, null, 1);
+			createIf(() => !__props.readonly, () => {
+				const n10 = t1();
+				renderEffect(() => setDynamicProps(n10, [
+					{ type: "button" },
+					unref(getPartAttrs)("tagRemove", { class: "rp-tags-input__tag-remove" }),
+					{
+						"aria-label": `${__props.removeLabel} ${_for_item0.value}`,
+						disabled: unref(control).disabled || void 0,
+						tabindex: "-1"
+					}
+				]));
+				setInsertionState(n10, null, 0);
+				createComponent(unref(x_default));
+				on(n10, "mousedown", withModifiers(() => {}, ["prevent"]));
+				on(n10, "click", withModifiers(() => unref(removeTag)(_for_key0.value), ["stop"]));
+				return n10;
+			});
+			return n11;
+		}, (value, index) => `${value}-${index}`, 8);
+		renderEffect(() => {
+			setDynamicProps(n12, [visibleInputAttrs.value]);
+			_setTemplateRef(n12, unref(templateRefs).input);
+		});
+		setInsertionState(n18, null, 2);
+		createIf(() => unref(canClear), () => {
+			const n17 = t3();
+			renderEffect(() => setDynamicProps(n17, [
+				{ type: "button" },
+				unref(getPartAttrs)("clear", { class: "rp-tags-input__clear" }),
+				{
+					"aria-label": __props.clearLabel,
+					tabindex: "-1"
+				}
+			]));
+			setInsertionState(n17, null, 0);
+			createComponent(unref(x_default));
+			on(n17, "mousedown", withModifiers(() => {}, ["prevent"]));
+			on(n17, "click", withModifiers((e) => unref(clear)(e), ["stop"]));
+			return n17;
+		});
+		setTemplateRefBinding(n18, () => unref(templateRefs).root);
+		return n18;
+	}
+}), [["__scopeId", "data-v-9fbac28f"]]);
+//#endregion
+//#region src/components/tags-input/types.ts
+var tagsInputParts = [
+	"root",
+	"tags",
+	"tag",
+	"tagLabel",
+	"tagRemove",
+	"input",
+	"clear"
+];
+//#endregion
+export { tags_input_default as n, tagsInputParts as t };

package/dist/text.js

@@ -0,0 +1,17 @@
+//#region src/utils/text.ts
+var COMBINING_MARKS = /\p{M}/gu;
+var WHITESPACE = /\s+/g;
+function getNameInitials(name) {
+	if (!name) return "";
+	const parts = name.trim().split(WHITESPACE).filter(Boolean);
+	const firstPart = parts[0];
+	if (!firstPart) return "";
+	if (parts.length === 1) return Array.from(firstPart).slice(0, 2).join("").toLocaleUpperCase();
+	const lastPart = parts.at(-1) ?? firstPart;
+	return `${Array.from(firstPart)[0] ?? ""}${Array.from(lastPart)[0] ?? ""}`.toLocaleUpperCase();
+}
+function normalizeTypeaheadText(value, locales) {
+	return value.toLocaleLowerCase(locales).normalize("NFKD").replace(COMBINING_MARKS, "").replace(WHITESPACE, " ").trim();
+}
+//#endregion
+export { normalizeTypeaheadText as n, getNameInitials as t };

package/dist/textarea.css

@@ -1,5 +1,5 @@
 @layer ropav.components {
-.rp-textarea[data-v-b604b69c] {
+.rp-textarea[data-v-da9cf2c9] {
     --_rp-textarea-padding-y: 7px;
     --_rp-textarea-padding-x: calc(var(--rp-size-control-md) / 3);
     --_rp-textarea-font-size: var(--rp-font-size-md);
@@ -17,58 +17,58 @@
     cursor: text;
     transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
 }
-.rp-textarea[data-v-b604b69c]:hover:not(.rp-textarea--disabled):not(.rp-textarea--invalid):not(.rp-textarea--valid) {
+.rp-textarea[data-v-da9cf2c9]:hover:not(.rp-textarea--disabled):not(.rp-textarea--invalid):not(.rp-textarea--valid) {
     border-color: var(--rp-color-control-border-hover);
 }
-.rp-textarea[data-v-b604b69c]:focus-within:not(.rp-textarea--disabled):not(.rp-textarea--invalid):not(.rp-textarea--valid) {
+.rp-textarea[data-v-da9cf2c9]:focus-within:not(.rp-textarea--disabled):not(.rp-textarea--invalid):not(.rp-textarea--valid) {
     border-color: var(--rp-color-control-border-focus);
     box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
 }
-.rp-textarea[data-v-b604b69c] {
+.rp-textarea[data-v-da9cf2c9] {
     font-size: var(--_rp-textarea-font-size);
     border-radius: var(--_rp-textarea-radius);
 }
-.rp-textarea--size-xs[data-v-b604b69c] {
+.rp-textarea--size-xs[data-v-da9cf2c9] {
     --_rp-textarea-padding-y: 4.5px;
     --_rp-textarea-padding-x: calc(var(--rp-size-control-xs) / 3);
     --_rp-textarea-font-size: var(--rp-font-size-xs);
 }
-.rp-textarea--size-sm[data-v-b604b69c] {
+.rp-textarea--size-sm[data-v-da9cf2c9] {
     --_rp-textarea-padding-y: 5.5px;
     --_rp-textarea-padding-x: calc(var(--rp-size-control-sm) / 3);
     --_rp-textarea-font-size: var(--rp-font-size-sm);
 }
-.rp-textarea--size-md[data-v-b604b69c] {
+.rp-textarea--size-md[data-v-da9cf2c9] {
     --_rp-textarea-padding-y: 7px;
     --_rp-textarea-padding-x: calc(var(--rp-size-control-md) / 3);
     --_rp-textarea-font-size: var(--rp-font-size-md);
 }
-.rp-textarea--size-lg[data-v-b604b69c] {
+.rp-textarea--size-lg[data-v-da9cf2c9] {
     --_rp-textarea-padding-y: 9.5px;
     --_rp-textarea-padding-x: calc(var(--rp-size-control-lg) / 3);
     --_rp-textarea-font-size: var(--rp-font-size-lg);
 }
-.rp-textarea--size-xl[data-v-b604b69c] {
+.rp-textarea--size-xl[data-v-da9cf2c9] {
     --_rp-textarea-padding-y: 13px;
     --_rp-textarea-padding-x: calc(var(--rp-size-control-xl) / 3);
     --_rp-textarea-font-size: var(--rp-font-size-xl);
 }
-.rp-textarea--radius-xs[data-v-b604b69c] {
+.rp-textarea--radius-xs[data-v-da9cf2c9] {
     --_rp-textarea-radius: var(--rp-radius-xs);
 }
-.rp-textarea--radius-sm[data-v-b604b69c] {
+.rp-textarea--radius-sm[data-v-da9cf2c9] {
     --_rp-textarea-radius: var(--rp-radius-sm);
 }
-.rp-textarea--radius-md[data-v-b604b69c] {
+.rp-textarea--radius-md[data-v-da9cf2c9] {
     --_rp-textarea-radius: var(--rp-radius-md);
 }
-.rp-textarea--radius-lg[data-v-b604b69c] {
+.rp-textarea--radius-lg[data-v-da9cf2c9] {
     --_rp-textarea-radius: var(--rp-radius-lg);
 }
-.rp-textarea--radius-xl[data-v-b604b69c] {
+.rp-textarea--radius-xl[data-v-da9cf2c9] {
     --_rp-textarea-radius: var(--rp-radius-xl);
 }
-html.dark .rp-textarea[data-v-b604b69c], [data-rp-color-scheme=dark] .rp-textarea[data-v-b604b69c] {
+html.dark .rp-textarea[data-v-da9cf2c9], [data-rp-color-scheme=dark] .rp-textarea[data-v-da9cf2c9] {
     --_rp-textarea-valid-border: var(--rp-color-green-light-color);
     --_rp-textarea-valid-ring: color-mix(
         in srgb,
@@ -82,34 +82,34 @@ html.dark .rp-textarea[data-v-b604b69c], [data-rp-color-scheme=dark] .rp-textare
         transparent
     );
 }
-.rp-textarea--disabled[data-v-b604b69c] {
+.rp-textarea--disabled[data-v-da9cf2c9] {
     opacity: var(--rp-opacity-disabled);
     cursor: not-allowed;
 }
-.rp-textarea--valid[data-v-b604b69c] {
+.rp-textarea--valid[data-v-da9cf2c9] {
     border-color: var(--_rp-textarea-valid-border);
 }
-.rp-textarea--valid[data-v-b604b69c]:focus-within:not(.rp-textarea--disabled) {
+.rp-textarea--valid[data-v-da9cf2c9]:focus-within:not(.rp-textarea--disabled) {
     border-color: var(--_rp-textarea-valid-border);
     box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-textarea-valid-ring);
 }
-.rp-textarea--invalid[data-v-b604b69c] {
+.rp-textarea--invalid[data-v-da9cf2c9] {
     border-color: var(--_rp-textarea-invalid-border);
 }
-.rp-textarea--invalid[data-v-b604b69c]:focus-within:not(.rp-textarea--disabled) {
+.rp-textarea--invalid[data-v-da9cf2c9]:focus-within:not(.rp-textarea--disabled) {
     border-color: var(--_rp-textarea-invalid-border);
     box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-textarea-invalid-ring);
 }
-.rp-textarea--readonly[data-v-b604b69c] {
+.rp-textarea--readonly[data-v-da9cf2c9] {
     background-color: var(--rp-color-control-readonly-bg);
 }
-.rp-textarea--resize-vertical .rp-textarea__native[data-v-b604b69c] {
+.rp-textarea--resize-vertical .rp-textarea__native[data-v-da9cf2c9] {
     resize: vertical;
 }
-.rp-textarea--resize-both .rp-textarea__native[data-v-b604b69c] {
+.rp-textarea--resize-both .rp-textarea__native[data-v-da9cf2c9] {
     resize: both;
 }
-.rp-textarea__native[data-v-b604b69c] {
+.rp-textarea__native[data-v-da9cf2c9] {
     box-sizing: border-box;
     flex: 1;
     width: 100%;
@@ -124,10 +124,10 @@ html.dark .rp-textarea[data-v-b604b69c], [data-rp-color-scheme=dark] .rp-textare
     color: var(--rp-color-control-fg);
     line-height: var(--rp-line-height-md);
 }
-.rp-textarea__native[data-v-b604b69c]::placeholder {
+.rp-textarea__native[data-v-da9cf2c9]::placeholder {
     color: var(--rp-color-control-placeholder);
 }
-.rp-textarea__native[data-v-b604b69c]:disabled {
+.rp-textarea__native[data-v-da9cf2c9]:disabled {
     cursor: not-allowed;
 }
 }

package/dist/textarea.js

@@ -1,25 +1,18 @@
 import './textarea.css';
 import { t as useControllableValue } from "./useControllableValue.js";
-import { n as useStylesApi, t as presence } from "./styles-api.js";
+import { t as useStylesApi } from "./styles-api.js";
+import { n as toPresenceAttribute } from "./attributes.js";
 import { t as bem } from "./bem.js";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { t as clamp } from "./number.js";
 import { a as useTextFormControl } from "./useFormControl.js";
+import { o as splitCompatibilityAttributes, t as composeEventHandlers } from "./attributes2.js";
 import { t as useControlState } from "./useControlState.js";
+import { t as isInteractiveElement } from "./interactive.js";
 import { child, computed, defineVaporComponent, nextTick, onMounted, ref, renderEffect, setDynamicProps, setStaticTemplateRef, template, unref, watch } from "vue";
 //#region src/components/textarea/useTextarea.ts
 var MIN_ROWS = 1;
-var INTERACTIVE_SELECTOR = [
-	"button",
-	"a[href]",
-	"input",
-	"select",
-	`textarea:not(.rp-textarea__native)`,
-	"[contenteditable=\"true\"]",
-	"[tabindex]:not([tabindex=\"-1\"])"
-].join(",");
-function isInteractiveElement(target) {
-	return Boolean(target.closest(INTERACTIVE_SELECTOR));
-}
+var NATIVE_TEXTAREA_SELECTOR = ".rp-textarea__native";
 function normalizeRows(value, fallback) {
 	if (value === void 0 || !Number.isFinite(value)) return fallback;
 	return Math.max(MIN_ROWS, Math.floor(value));
@@ -98,8 +91,7 @@ function useTextarea(props, emitUpdate, getValue = () => props.modelValue ?? "")
 		}
 		textarea.style.height = "auto";
 		const { contentHeight, minHeight, maxHeight } = getAutosizeMeasurement(textarea, autosizeRows.value);
-		const heightLimit = maxHeight ?? Number.POSITIVE_INFINITY;
-		const nextHeight = Math.min(Math.max(contentHeight, minHeight), heightLimit);
+		const nextHeight = clamp(contentHeight, minHeight, maxHeight ?? Number.POSITIVE_INFINITY);
 		textarea.style.height = `${nextHeight}px`;
 		textarea.style.overflowY = maxHeight !== void 0 && contentHeight > maxHeight ? "auto" : "hidden";
 	}
@@ -117,8 +109,7 @@ function useTextarea(props, emitUpdate, getValue = () => props.modelValue ?? "")
 	}
 	function focusTextarea(e) {
 		if (control.disabled) return;
-		const target = e.target;
-		if (target instanceof Element && isInteractiveElement(target)) return;
+		if (isInteractiveElement(e.target, NATIVE_TEXTAREA_SELECTOR)) return;
 		textareaRef.value?.focus();
 	}
 	function focus(options) {
@@ -138,7 +129,7 @@ function useTextarea(props, emitUpdate, getValue = () => props.modelValue ?? "")
 }
 //#endregion
 //#region src/components/textarea/textarea.vue?vue&type=script&setup=true&vapor=true&lang.ts
-var t0 = template("<div data-v-b604b69c><textarea data-v-b604b69c>", 1);
+var t0 = template("<div data-v-da9cf2c9><textarea data-v-da9cf2c9>", 1);
 //#endregion
 //#region src/components/textarea/textarea.vue
 var textarea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
@@ -205,23 +196,21 @@ var textarea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 		const rootAttrs = computed(() => getRootAttrs({
 			class: rootClass.value,
 			onMousedown: focusTextarea,
-			"data-disabled": presence(control.disabled),
-			"data-readonly": presence(props.readonly),
-			"data-invalid": presence(control.invalid)
+			"data-disabled": toPresenceAttribute(control.disabled),
+			"data-readonly": toPresenceAttribute(props.readonly),
+			"data-invalid": toPresenceAttribute(control.invalid)
 		}));
 		const nativeInputAttrs = computed(() => {
-			const { class: compatibilityClass, style: compatibilityStyle, onInput: compatibilityOnInput, ...attrs } = props.inputAttrs ?? {};
+			const inputAttrs = props.inputAttrs ?? {};
+			const { compatibilityClass, compatibilityStyle, forwardedAttributes } = splitCompatibilityAttributes(inputAttrs);
 			return {
-				...attrs,
+				...forwardedAttributes,
 				...getPartAttrs("input", {
 					class: "rp-textarea__native",
 					compatibilityClass,
 					compatibilityStyle
 				}),
-				onInput(event) {
-					onInput(event);
-					compatibilityOnInput?.(event);
-				}
+				onInput: composeEventHandlers(onInput, inputAttrs.onInput)
 			};
 		});
 		__expose({
@@ -235,7 +224,7 @@ var textarea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 			const _nativeInputAttrs = nativeInputAttrs.value;
 			const _control = unref(control);
 			const _readonly = __props.readonly;
-			const _presence = unref(presence);
+			const _toPresenceAttribute = unref(toPresenceAttribute);
 			const _control_required = _control.required;
 			setDynamicProps(n1, [rootAttrs.value]);
 			setDynamicProps(n0, [_nativeInputAttrs, {
@@ -253,14 +242,14 @@ var textarea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 				"aria-describedby": _control.ariaDescribedby,
 				"aria-invalid": _control.invalid || void 0,
 				"aria-required": _control_required || void 0,
-				"data-disabled": _presence(_control.disabled),
-				"data-readonly": _presence(_readonly),
-				"data-invalid": _presence(_control.invalid)
+				"data-disabled": _toPresenceAttribute(_control.disabled),
+				"data-readonly": _toPresenceAttribute(_readonly),
+				"data-invalid": _toPresenceAttribute(_control.invalid)
 			}]);
 		});
 		return n1;
 	}
-}), [["__scopeId", "data-v-b604b69c"]]);
+}), [["__scopeId", "data-v-da9cf2c9"]]);
 //#endregion
 //#region src/components/textarea/types.ts
 var textareaParts = ["root", "input"];