@cube-dev/ui-kit 0.0.0-canary-bada6bd → 0.0.0-canary-09a7efe

package/dist/components/fields/TagInput/TagInput.js

@@ -0,0 +1,1856 @@
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-09a7efe | Cube Dev Team */
+import { extractStyles } from "../../../utils/styles.js";
+import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
+import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
+import { useEvent } from "../../../_internal/hooks/use-event.js";
+import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
+import { _CollectionItem } from "../../CollectionItem.js";
+import { useI18n } from "../../../i18n/useI18n.js";
+import { useFormatter } from "../../../i18n/useFormatter.js";
+import { DirectionIcon } from "../../../icons/DirectionIcon.js";
+import { generateRandomId } from "../../../utils/random.js";
+import { CloseIcon } from "../../../icons/CloseIcon.js";
+import { castNullableArrayValue } from "../../../utils/react/nullableValue.js";
+import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
+import { wrapWithField } from "../../form/wrapper.js";
+import { getListBoxOptionId } from "../ListBox/optionId.js";
+import { TextInputBase } from "../TextInput/TextInputBase.js";
+import { ListBoxPopover } from "../ListBoxPopover/ListBoxPopover.js";
+import { useCompositeFocus } from "../ListBoxPopover/useCompositeFocus.js";
+import { collectVisibleKeys, filterCollectionNodes, getEdgeVisibleKey, getNextVisibleKey, markKeyboardFocus } from "../ListBoxPopover/listNavigation.js";
+import { TagList } from "./TagList.js";
+import { c } from "react-compiler-runtime";
+import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
+import { cloneElement, forwardRef, isValidElement, useEffect, useLayoutEffect, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { VisuallyHidden, useFilter, useId as useId$1, useTextField } from "react-aria";
+import { Section, useListState } from "react-stately";
+import { useControlledState } from "@react-stately/utils";
+
+//#region src/components/fields/TagInput/TagInput.tsx
+const TagInputElement = tasty({
+	qa: "TagInputContainer",
+	styles: {
+		display: "flex",
+		flow: "column",
+		gap: "1x"
+	}
+});
+const TAG_SIZES = {
+	small: "xsmall",
+	medium: "xsmall",
+	large: "small"
+};
+const DEFAULT_DELIMITERS = [","];
+const LINE_BREAK = /\r\n|\r|\n/;
+function escapeRegExp(text) {
+	return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function delimiterPattern(delimiters) {
+	const separators = delimiters.filter(Boolean).map(escapeRegExp);
+	return separators.length ? new RegExp(separators.join("|")) : null;
+}
+/** Splits `text` on the delimiters and line breaks into trimmed, non-empty parts. */
+function splitTagText(text, delimiters) {
+	const separators = delimiters.filter(Boolean).map(escapeRegExp);
+	const pattern = new RegExp([LINE_BREAK.source, ...separators].join("|"), "g");
+	return text.split(pattern).map((part) => part.trim()).filter(Boolean);
+}
+/** A chip's own label, when `tagProps` gives it one as plain text. */
+function textLabel(node) {
+	return typeof node === "string" && node !== "" ? node : void 0;
+}
+function isComposingKey(e) {
+	return e.nativeEvent.isComposing || e.keyCode === 229;
+}
+function TagInput(props, ref) {
+	const $ = c(484);
+	let t0;
+	if ($[0] !== props) {
+		t0 = castNullableArrayValue(props);
+		$[0] = props;
+		$[1] = t0;
+	} else t0 = $[1];
+	props = t0;
+	let t1;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = {
+			defaultValidationTrigger: "onChange",
+			valuePropsMapper: _temp
+		};
+		$[2] = t1;
+	} else t1 = $[2];
+	props = useFieldProps(props, t1);
+	const { t } = useI18n();
+	const { formatList } = useFormatter();
+	let allowsCustomValue;
+	let autoComplete;
+	let autoFocus;
+	let className;
+	let containerPadding;
+	let defaultInputValue;
+	let defaultValue;
+	let delimiters;
+	let direction;
+	let disabledKeys;
+	let errorMessage;
+	let filter;
+	let headingStyles;
+	let hideTrigger;
+	let icon;
+	let id;
+	let inputRefProp;
+	let inputStyles;
+	let inputValueProp;
+	let isClearable;
+	let isDisabled;
+	let isInvalid;
+	let isLoading;
+	let isReadOnly;
+	let isRequired;
+	let isValid;
+	let items;
+	let label;
+	let listBoxRefProp;
+	let listBoxStyles;
+	let maxTags;
+	let message;
+	let mods;
+	let normalizeTag;
+	let onBlur;
+	let onChange_0;
+	let onClear;
+	let onFocus;
+	let onInputChange;
+	let onKeyDown;
+	let onOpenChange;
+	let optionStyles;
+	let otherProps;
+	let overlayOffset;
+	let overlayStyles;
+	let placeholder;
+	let popoverRefProp;
+	let popoverTrigger;
+	let prefix;
+	let qa;
+	let qaVal;
+	let renderChildren;
+	let sectionStyles;
+	let shouldCommitOnBlur;
+	let shouldFlip;
+	let size;
+	let style;
+	let suffix;
+	let suffixPosition;
+	let t2;
+	let tagListStyles;
+	let tagProps;
+	let tagStyles;
+	let triggerStyles;
+	let userLabelProps;
+	let validateTag;
+	let valueProp;
+	let wrapperRefProp;
+	let wrapperStyles;
+	if ($[3] !== props) {
+		const { qa: t3, id: t4, label: t5, value: t6, defaultValue: t7, onChange: t8, inputValue: t9, defaultInputValue: t10, onInputChange: t11, placeholder: t12, autoFocus: t13, autoComplete: t14, onFocus: t15, onBlur: t16, onKeyDown: t17, delimiters: t18, validateTag: t19, normalizeTag: t20, maxTags: t21, shouldCommitOnBlur: t22, isClearable: t23, onClear: t24, items: t25, children: t26, allowsCustomValue: t27, filter: t28, disabledKeys: t29, popoverTrigger: t30, onOpenChange: t31, hideTrigger: t32, direction: t33, shouldFlip: t34, overlayOffset: t35, containerPadding: t36, tagProps: t37, icon: t38, prefix: t39, suffix: t40, suffixPosition: t41, size: t42, isDisabled: t43, isReadOnly: t44, isRequired: t45, isLoading: t46, isInvalid: t47, isValid: t48, message: t49, errorMessage: t50, inputRef: t51, wrapperRef: t52, popoverRef: t53, listBoxRef: t54, wrapperStyles: t55, inputStyles: t56, tagListStyles: t57, tagStyles: t58, triggerStyles: t59, overlayStyles: t60, listBoxStyles: t61, optionStyles: t62, sectionStyles: t63, headingStyles: t64, labelProps: t65, mods: t66, className: t67, style: t68, qaVal: t69, name, form, ...t70 } = props;
+		qa = t3;
+		id = t4;
+		label = t5;
+		valueProp = t6;
+		defaultValue = t7;
+		onChange_0 = t8;
+		inputValueProp = t9;
+		defaultInputValue = t10;
+		onInputChange = t11;
+		placeholder = t12;
+		autoFocus = t13;
+		onFocus = t15;
+		onBlur = t16;
+		onKeyDown = t17;
+		validateTag = t19;
+		normalizeTag = t20;
+		maxTags = t21;
+		isClearable = t23;
+		onClear = t24;
+		items = t25;
+		renderChildren = t26;
+		allowsCustomValue = t27;
+		filter = t28;
+		disabledKeys = t29;
+		onOpenChange = t31;
+		hideTrigger = t32;
+		tagProps = t37;
+		icon = t38;
+		prefix = t39;
+		suffix = t40;
+		suffixPosition = t41;
+		isDisabled = t43;
+		isReadOnly = t44;
+		isRequired = t45;
+		isLoading = t46;
+		isInvalid = t47;
+		isValid = t48;
+		message = t49;
+		errorMessage = t50;
+		inputRefProp = t51;
+		wrapperRefProp = t52;
+		popoverRefProp = t53;
+		listBoxRefProp = t54;
+		wrapperStyles = t55;
+		inputStyles = t56;
+		tagListStyles = t57;
+		tagStyles = t58;
+		triggerStyles = t59;
+		overlayStyles = t60;
+		listBoxStyles = t61;
+		optionStyles = t62;
+		sectionStyles = t63;
+		headingStyles = t64;
+		userLabelProps = t65;
+		mods = t66;
+		className = t67;
+		style = t68;
+		qaVal = t69;
+		otherProps = t70;
+		autoComplete = t14 === void 0 ? "off" : t14;
+		delimiters = t18 === void 0 ? DEFAULT_DELIMITERS : t18;
+		shouldCommitOnBlur = t22 === void 0 ? true : t22;
+		popoverTrigger = t30 === void 0 ? "input" : t30;
+		direction = t33 === void 0 ? "bottom" : t33;
+		shouldFlip = t34 === void 0 ? true : t34;
+		overlayOffset = t35 === void 0 ? 8 : t35;
+		containerPadding = t36 === void 0 ? 8 : t36;
+		size = t42 === void 0 ? "medium" : t42;
+		t2 = extractStyles(otherProps, CONTAINER_STYLES);
+		$[3] = props;
+		$[4] = allowsCustomValue;
+		$[5] = autoComplete;
+		$[6] = autoFocus;
+		$[7] = className;
+		$[8] = containerPadding;
+		$[9] = defaultInputValue;
+		$[10] = defaultValue;
+		$[11] = delimiters;
+		$[12] = direction;
+		$[13] = disabledKeys;
+		$[14] = errorMessage;
+		$[15] = filter;
+		$[16] = headingStyles;
+		$[17] = hideTrigger;
+		$[18] = icon;
+		$[19] = id;
+		$[20] = inputRefProp;
+		$[21] = inputStyles;
+		$[22] = inputValueProp;
+		$[23] = isClearable;
+		$[24] = isDisabled;
+		$[25] = isInvalid;
+		$[26] = isLoading;
+		$[27] = isReadOnly;
+		$[28] = isRequired;
+		$[29] = isValid;
+		$[30] = items;
+		$[31] = label;
+		$[32] = listBoxRefProp;
+		$[33] = listBoxStyles;
+		$[34] = maxTags;
+		$[35] = message;
+		$[36] = mods;
+		$[37] = normalizeTag;
+		$[38] = onBlur;
+		$[39] = onChange_0;
+		$[40] = onClear;
+		$[41] = onFocus;
+		$[42] = onInputChange;
+		$[43] = onKeyDown;
+		$[44] = onOpenChange;
+		$[45] = optionStyles;
+		$[46] = otherProps;
+		$[47] = overlayOffset;
+		$[48] = overlayStyles;
+		$[49] = placeholder;
+		$[50] = popoverRefProp;
+		$[51] = popoverTrigger;
+		$[52] = prefix;
+		$[53] = qa;
+		$[54] = qaVal;
+		$[55] = renderChildren;
+		$[56] = sectionStyles;
+		$[57] = shouldCommitOnBlur;
+		$[58] = shouldFlip;
+		$[59] = size;
+		$[60] = style;
+		$[61] = suffix;
+		$[62] = suffixPosition;
+		$[63] = t2;
+		$[64] = tagListStyles;
+		$[65] = tagProps;
+		$[66] = tagStyles;
+		$[67] = triggerStyles;
+		$[68] = userLabelProps;
+		$[69] = validateTag;
+		$[70] = valueProp;
+		$[71] = wrapperRefProp;
+		$[72] = wrapperStyles;
+	} else {
+		allowsCustomValue = $[4];
+		autoComplete = $[5];
+		autoFocus = $[6];
+		className = $[7];
+		containerPadding = $[8];
+		defaultInputValue = $[9];
+		defaultValue = $[10];
+		delimiters = $[11];
+		direction = $[12];
+		disabledKeys = $[13];
+		errorMessage = $[14];
+		filter = $[15];
+		headingStyles = $[16];
+		hideTrigger = $[17];
+		icon = $[18];
+		id = $[19];
+		inputRefProp = $[20];
+		inputStyles = $[21];
+		inputValueProp = $[22];
+		isClearable = $[23];
+		isDisabled = $[24];
+		isInvalid = $[25];
+		isLoading = $[26];
+		isReadOnly = $[27];
+		isRequired = $[28];
+		isValid = $[29];
+		items = $[30];
+		label = $[31];
+		listBoxRefProp = $[32];
+		listBoxStyles = $[33];
+		maxTags = $[34];
+		message = $[35];
+		mods = $[36];
+		normalizeTag = $[37];
+		onBlur = $[38];
+		onChange_0 = $[39];
+		onClear = $[40];
+		onFocus = $[41];
+		onInputChange = $[42];
+		onKeyDown = $[43];
+		onOpenChange = $[44];
+		optionStyles = $[45];
+		otherProps = $[46];
+		overlayOffset = $[47];
+		overlayStyles = $[48];
+		placeholder = $[49];
+		popoverRefProp = $[50];
+		popoverTrigger = $[51];
+		prefix = $[52];
+		qa = $[53];
+		qaVal = $[54];
+		renderChildren = $[55];
+		sectionStyles = $[56];
+		shouldCommitOnBlur = $[57];
+		shouldFlip = $[58];
+		size = $[59];
+		style = $[60];
+		suffix = $[61];
+		suffixPosition = $[62];
+		t2 = $[63];
+		tagListStyles = $[64];
+		tagProps = $[65];
+		tagStyles = $[66];
+		triggerStyles = $[67];
+		userLabelProps = $[68];
+		validateTag = $[69];
+		valueProp = $[70];
+		wrapperRefProp = $[71];
+		wrapperStyles = $[72];
+	}
+	const styles = t2;
+	const rootRef = useCombinedRefs(ref);
+	const inputRef = useCombinedRefs(inputRefProp);
+	const wrapperRef = useCombinedRefs(wrapperRefProp);
+	const popoverRef = useCombinedRefs(popoverRefProp);
+	const listBoxRef = useCombinedRefs(listBoxRefProp);
+	const tagListRef = useRef(null);
+	const listStateRef = useRef(null);
+	let t3;
+	if ($[73] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = generateRandomId();
+		$[73] = t3;
+	} else t3 = $[73];
+	const listBoxId = `TagInputListBox-${t3}`;
+	const tagListId = useId$1();
+	const summaryId = useId$1();
+	const hintId = useId$1();
+	const triggerId = useId$1();
+	const clearId = useId$1();
+	let t4;
+	if ($[74] !== defaultValue) {
+		t4 = defaultValue ?? [];
+		$[74] = defaultValue;
+		$[75] = t4;
+	} else t4 = $[75];
+	const [values, setValues] = useControlledState(valueProp, t4, onChange_0);
+	let t5;
+	if ($[76] !== values) {
+		t5 = new Set((values ?? []).map(String));
+		$[76] = values;
+		$[77] = t5;
+	} else t5 = $[77];
+	let t6;
+	if ($[78] !== t5) {
+		t6 = [...t5];
+		$[78] = t5;
+		$[79] = t6;
+	} else t6 = $[79];
+	const uniqueValues = t6;
+	const [draft, setDraftState] = useControlledState(inputValueProp, defaultInputValue ?? "", onInputChange);
+	const [tagError, setTagErrorState] = useState(null);
+	const tagErrorIdRef = useRef(0);
+	let t7;
+	if ($[80] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = (text) => {
+			if (text == null) {
+				setTagErrorState(null);
+				return;
+			}
+			tagErrorIdRef.current = tagErrorIdRef.current + 1;
+			setTagErrorState({
+				id: tagErrorIdRef.current,
+				text
+			});
+		};
+		$[80] = t7;
+	} else t7 = $[80];
+	const setTagError = useEvent(t7);
+	let t8;
+	if ($[81] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = {
+			id: 0,
+			text: ""
+		};
+		$[81] = t8;
+	} else t8 = $[81];
+	const [announcement, setAnnouncement] = useState(t8);
+	let children;
+	if ($[82] !== items || $[83] !== renderChildren) {
+		children = renderChildren;
+		if (items && typeof renderChildren === "function") children = Array.from(items).map((item, index) => {
+			const rendered = renderChildren(item);
+			if (isValidElement(rendered) && rendered.key == null) return cloneElement(rendered, { key: item?.key ?? item?.id ?? index });
+			return rendered;
+		});
+		$[82] = items;
+		$[83] = renderChildren;
+		$[84] = children;
+	} else children = $[84];
+	const hasOptions = children != null && children !== false;
+	const t9 = children;
+	let t10;
+	if ($[85] !== t9) {
+		t10 = {
+			children: t9,
+			selectionMode: "none"
+		};
+		$[85] = t9;
+		$[86] = t10;
+	} else t10 = $[86];
+	const collection = useListState(t10).collection;
+	let t11;
+	if ($[87] === Symbol.for("react.memo_cache_sentinel")) {
+		t11 = { sensitivity: "base" };
+		$[87] = t11;
+	} else t11 = $[87];
+	const { contains } = useFilter(t11);
+	let t12;
+	if ($[88] === Symbol.for("react.memo_cache_sentinel")) {
+		t12 = new Intl.Collator(void 0, { sensitivity: "base" });
+		$[88] = t12;
+	} else t12 = $[88];
+	const collator = t12;
+	let t13;
+	if ($[89] === Symbol.for("react.memo_cache_sentinel")) {
+		t13 = new Intl.Collator(void 0, { numeric: true });
+		$[89] = t13;
+	} else t13 = $[89];
+	const sorter = t13;
+	let t14;
+	if ($[90] === Symbol.for("react.memo_cache_sentinel")) {
+		t14 = {
+			isEqual: (a, b) => collator.compare(a, b) === 0,
+			compare: (a_0, b_0) => sorter.compare(a_0, b_0)
+		};
+		$[90] = t14;
+	} else t14 = $[90];
+	const { isEqual: isSameText, compare: compareText } = t14;
+	let t15;
+	if ($[91] !== contains || $[92] !== filter) {
+		t15 = filter === false ? _temp2 : filter || contains;
+		$[91] = contains;
+		$[92] = filter;
+		$[93] = t15;
+	} else t15 = $[93];
+	const textFilterFn = t15;
+	const [isFilterActive, setIsFilterActive] = useState(false);
+	let t16;
+	if ($[94] !== draft) {
+		t16 = draft.trim();
+		$[94] = draft;
+		$[95] = t16;
+	} else t16 = $[95];
+	const term = t16;
+	const [knownLabels, setKnownLabels] = useState(_temp3);
+	let t17;
+	if ($[96] !== collection || $[97] !== knownLabels) {
+		t17 = (key) => collection.getItem(key)?.textValue || knownLabels.get(key) || key;
+		$[96] = collection;
+		$[97] = knownLabels;
+		$[98] = t17;
+	} else t17 = $[98];
+	const getOptionLabel = t17;
+	let t18;
+	if ($[99] !== getOptionLabel || $[100] !== tagProps) {
+		t18 = (key_0) => textLabel(tagProps?.(key_0)?.children) ?? getOptionLabel(key_0);
+		$[99] = getOptionLabel;
+		$[100] = tagProps;
+		$[101] = t18;
+	} else t18 = $[101];
+	const getTagLabel = t18;
+	let t19;
+	if ($[102] !== tagProps) {
+		t19 = (key_1) => !!tagProps?.(key_1)?.isDisabled;
+		$[102] = tagProps;
+		$[103] = t19;
+	} else t19 = $[103];
+	const isTagLocked = t19;
+	let t20;
+	if ($[104] !== disabledKeys) {
+		t20 = new Set([...disabledKeys ?? []].map(String));
+		$[104] = disabledKeys;
+		$[105] = t20;
+	} else t20 = $[105];
+	const disabledKeySet = t20;
+	let t21;
+	if ($[106] !== collection || $[107] !== knownLabels) {
+		t21 = (keys) => {
+			let next = null;
+			for (const key_2 of keys) {
+				const label_0 = collection.getItem(key_2)?.textValue;
+				if (label_0 && knownLabels.get(key_2) !== label_0) {
+					if (!next) next = new Map(knownLabels);
+					next.set(key_2, label_0);
+				}
+			}
+			if (next) setKnownLabels(next);
+		};
+		$[106] = collection;
+		$[107] = knownLabels;
+		$[108] = t21;
+	} else t21 = $[108];
+	const rememberLabels = useEvent(t21);
+	let t22;
+	if ($[109] !== collection || $[110] !== hasOptions) {
+		t22 = (text_0) => {
+			if (!hasOptions) return null;
+			for (const node of collection) {
+				const nodes = node.type === "section" ? [...node.childNodes] : [node];
+				for (const child of nodes) {
+					if (child.type !== "item") continue;
+					if (String(child.key) === text_0 || isSameText(child.textValue || "", text_0)) return String(child.key);
+				}
+			}
+			return null;
+		};
+		$[109] = collection;
+		$[110] = hasOptions;
+		$[111] = t22;
+	} else t22 = $[111];
+	const findOptionKey = t22;
+	let t23;
+	if ($[112] !== isFilterActive || $[113] !== term || $[114] !== textFilterFn) {
+		t23 = (nodes_0) => {
+			if (!isFilterActive || !term) return nodes_0;
+			return filterCollectionNodes(nodes_0, term, textFilterFn);
+		};
+		$[112] = isFilterActive;
+		$[113] = term;
+		$[114] = textFilterFn;
+		$[115] = t23;
+	} else t23 = $[115];
+	const optionFilterFn = t23;
+	let t24;
+	bb0: {
+		if (!hasOptions) {
+			let t25;
+			if ($[116] === Symbol.for("react.memo_cache_sentinel")) {
+				t25 = [];
+				$[116] = t25;
+			} else t25 = $[116];
+			t24 = t25;
+			break bb0;
+		}
+		let keys_0;
+		if ($[117] !== collection || $[118] !== disabledKeys || $[119] !== optionFilterFn) {
+			keys_0 = [];
+			collectVisibleKeys(optionFilterFn(collection), keys_0, disabledKeys ? new Set(disabledKeys) : void 0);
+			$[117] = collection;
+			$[118] = disabledKeys;
+			$[119] = optionFilterFn;
+			$[120] = keys_0;
+		} else keys_0 = $[120];
+		t24 = keys_0;
+	}
+	const visibleOptionKeys = t24;
+	let t25;
+	if ($[121] === Symbol.for("react.memo_cache_sentinel")) {
+		t25 = [];
+		$[121] = t25;
+	} else t25 = $[121];
+	const [unpickedCustomValues, setUnpickedCustomValues] = useState(t25);
+	let t26;
+	bb1: {
+		if (!hasOptions || !allowsCustomValue) {
+			let t27;
+			if ($[122] === Symbol.for("react.memo_cache_sentinel")) {
+				t27 = [];
+				$[122] = t27;
+			} else t27 = $[122];
+			t26 = t27;
+			break bb1;
+		}
+		let t27;
+		if ($[123] !== collection || $[124] !== knownLabels || $[125] !== uniqueValues || $[126] !== unpickedCustomValues) {
+			t27 = [...new Set([...uniqueValues, ...unpickedCustomValues].filter((value_0) => collection.getItem(value_0) == null && !knownLabels.has(value_0)))].sort(compareText);
+			$[123] = collection;
+			$[124] = knownLabels;
+			$[125] = uniqueValues;
+			$[126] = unpickedCustomValues;
+			$[127] = t27;
+		} else t27 = $[127];
+		t26 = t27;
+	}
+	const customValueKeys = t26;
+	let t27;
+	bb2: {
+		if (!isFilterActive || !term) {
+			t27 = customValueKeys;
+			break bb2;
+		}
+		const matches = typeof filter === "function" ? filter : contains;
+		let t28;
+		if ($[128] !== customValueKeys || $[129] !== matches || $[130] !== term) {
+			let t29;
+			if ($[132] !== matches || $[133] !== term) {
+				t29 = (key_3) => matches(key_3, term);
+				$[132] = matches;
+				$[133] = term;
+				$[134] = t29;
+			} else t29 = $[134];
+			t28 = customValueKeys.filter(t29);
+			$[128] = customValueKeys;
+			$[129] = matches;
+			$[130] = term;
+			$[131] = t28;
+		} else t28 = $[131];
+		t27 = t28;
+	}
+	const visibleCustomKeys = t27;
+	let t28;
+	if ($[135] !== allowsCustomValue || $[136] !== customValueKeys || $[137] !== findOptionKey || $[138] !== hasOptions || $[139] !== term || $[140] !== uniqueValues) {
+		t28 = hasOptions && allowsCustomValue && term && findOptionKey(term) == null && !uniqueValues.includes(term) && !customValueKeys.includes(term) ? term : null;
+		$[135] = allowsCustomValue;
+		$[136] = customValueKeys;
+		$[137] = findOptionKey;
+		$[138] = hasOptions;
+		$[139] = term;
+		$[140] = uniqueValues;
+		$[141] = t28;
+	} else t28 = $[141];
+	const customTerm = t28;
+	let t29;
+	bb3: {
+		if (!customTerm && !visibleCustomKeys.length) {
+			t29 = children;
+			break bb3;
+		}
+		let customOptions;
+		if ($[142] !== customTerm || $[143] !== visibleCustomKeys) {
+			customOptions = visibleCustomKeys.map(_temp4);
+			if (customTerm) {
+				let t30;
+				if ($[145] !== customTerm) {
+					t30 = /* @__PURE__ */ jsx(_CollectionItem, {
+						textValue: customTerm,
+						children: customTerm
+					}, customTerm);
+					$[145] = customTerm;
+					$[146] = t30;
+				} else t30 = $[146];
+				customOptions.push(t30);
+			}
+			$[142] = customTerm;
+			$[143] = visibleCustomKeys;
+			$[144] = customOptions;
+		} else customOptions = $[144];
+		if (!visibleOptionKeys.length) {
+			t29 = customOptions;
+			break bb3;
+		}
+		let t30;
+		if ($[147] !== t) {
+			t30 = t("tagInput.customValues", "Custom values");
+			$[147] = t;
+			$[148] = t30;
+		} else t30 = $[148];
+		let t31;
+		if ($[149] !== customOptions || $[150] !== t30) {
+			t31 = /* @__PURE__ */ jsx(Section, {
+				"aria-label": t30,
+				children: customOptions
+			}, "__custom_values__");
+			$[149] = customOptions;
+			$[150] = t30;
+			$[151] = t31;
+		} else t31 = $[151];
+		const customSection = t31;
+		if ([...collection].some(_temp5)) {
+			let t32;
+			if ($[152] !== children) {
+				t32 = Array.isArray(children) ? children : [children];
+				$[152] = children;
+				$[153] = t32;
+			} else t32 = $[153];
+			let t33;
+			if ($[154] !== customSection || $[155] !== t32) {
+				t33 = [...t32, customSection];
+				$[154] = customSection;
+				$[155] = t32;
+				$[156] = t33;
+			} else t33 = $[156];
+			t29 = t33;
+			break bb3;
+		}
+		let t32;
+		if ($[157] !== t) {
+			t32 = t("tagInput.options", "Options");
+			$[157] = t;
+			$[158] = t32;
+		} else t32 = $[158];
+		const t33 = children;
+		let t34;
+		if ($[159] !== t32 || $[160] !== t33) {
+			t34 = /* @__PURE__ */ jsx(Section, {
+				"aria-label": t32,
+				children: t33
+			}, "__options__");
+			$[159] = t32;
+			$[160] = t33;
+			$[161] = t34;
+		} else t34 = $[161];
+		let t35;
+		if ($[162] !== customSection || $[163] !== t34) {
+			t35 = [t34, customSection];
+			$[162] = customSection;
+			$[163] = t34;
+			$[164] = t35;
+		} else t35 = $[164];
+		t29 = t35;
+	}
+	const popoverChildren = t29;
+	const hasResults = visibleOptionKeys.length > 0 || visibleCustomKeys.length > 0 || customTerm != null;
+	let t30;
+	if ($[165] !== visibleCustomKeys || $[166] !== visibleOptionKeys) {
+		t30 = [...visibleOptionKeys, ...visibleCustomKeys];
+		$[165] = visibleCustomKeys;
+		$[166] = visibleOptionKeys;
+		$[167] = t30;
+	} else t30 = $[167];
+	const visibleOptionsSignature = t30.join("\0");
+	const [isPopoverOpen, setIsPopoverOpen] = useState(false);
+	const isInteractive = !isDisabled && !isReadOnly;
+	const shouldShowPopover = hasOptions && isInteractive && isPopoverOpen && hasResults;
+	const notifiedOpenRef = useRef(false);
+	let t31;
+	let t32;
+	if ($[168] !== onOpenChange || $[169] !== shouldShowPopover) {
+		t31 = () => {
+			if (notifiedOpenRef.current === shouldShowPopover) return;
+			notifiedOpenRef.current = shouldShowPopover;
+			onOpenChange?.(shouldShowPopover);
+		};
+		t32 = [shouldShowPopover, onOpenChange];
+		$[168] = onOpenChange;
+		$[169] = shouldShowPopover;
+		$[170] = t31;
+		$[171] = t32;
+	} else {
+		t31 = $[170];
+		t32 = $[171];
+	}
+	useEffect(t31, t32);
+	const [activeOption, setActiveOption] = useState(null);
+	const activeOptionKey = activeOption?.key ?? null;
+	let t33;
+	if ($[172] === Symbol.for("react.memo_cache_sentinel")) {
+		t33 = (key_5, source, forTerm) => {
+			const listState = listStateRef.current;
+			if (!listState || key_5 == null) return;
+			markKeyboardFocus(listState);
+			listState.selectionManager.setFocusedKey(key_5);
+			setActiveOption({
+				key: key_5,
+				term: forTerm,
+				source
+			});
+		};
+		$[172] = t33;
+	} else t33 = $[172];
+	const moveVirtualFocus = useEvent(t33);
+	const [popoverMinWidth, setPopoverMinWidth] = useState();
+	let exactOptionKey = term ? findOptionKey(term) : null;
+	if (exactOptionKey == null && term && customValueKeys.includes(term)) exactOptionKey = term;
+	let visibleTargetKeys;
+	if ($[173] !== customTerm || $[174] !== visibleCustomKeys || $[175] !== visibleOptionKeys) {
+		visibleTargetKeys = [...visibleOptionKeys, ...visibleCustomKeys];
+		if (customTerm) visibleTargetKeys.push(customTerm);
+		$[173] = customTerm;
+		$[174] = visibleCustomKeys;
+		$[175] = visibleOptionKeys;
+		$[176] = visibleTargetKeys;
+	} else visibleTargetKeys = $[176];
+	let preferredOptionKey;
+	if ($[177] !== exactOptionKey || $[178] !== term || $[179] !== uniqueValues || $[180] !== visibleTargetKeys) {
+		preferredOptionKey = null;
+		if (exactOptionKey != null && visibleTargetKeys.includes(exactOptionKey)) preferredOptionKey = exactOptionKey;
+		else if (term) preferredOptionKey = visibleTargetKeys.find((key_6) => !uniqueValues.includes(String(key_6))) ?? null;
+		if (preferredOptionKey == null) preferredOptionKey = visibleTargetKeys[0] ?? null;
+		$[177] = exactOptionKey;
+		$[178] = term;
+		$[179] = uniqueValues;
+		$[180] = visibleTargetKeys;
+		$[181] = preferredOptionKey;
+	} else preferredOptionKey = $[181];
+	const focusTermRef = useRef(null);
+	let t34;
+	if ($[182] !== customTerm || $[183] !== moveVirtualFocus || $[184] !== preferredOptionKey || $[185] !== shouldShowPopover || $[186] !== term || $[187] !== visibleOptionsSignature || $[188] !== wrapperRef) {
+		t34 = () => {
+			if (!shouldShowPopover) {
+				focusTermRef.current = null;
+				return;
+			}
+			setPopoverMinWidth(wrapperRef.current?.offsetWidth);
+			const visibleKeys = visibleOptionsSignature ? visibleOptionsSignature.split("\0") : [];
+			if (customTerm) visibleKeys.push(customTerm);
+			const isNewTerm = !!term && focusTermRef.current !== term;
+			focusTermRef.current = term;
+			let attempts = 0;
+			let isCancelled = false;
+			const tick = () => {
+				if (isCancelled) return;
+				const listState_0 = listStateRef.current;
+				if (!listState_0) {
+					attempts = attempts + 1;
+					if (attempts < 8) requestAnimationFrame(tick);
+					return;
+				}
+				const focused = listState_0.selectionManager.focusedKey;
+				if (focused != null && visibleKeys.includes(focused) && !isNewTerm) setActiveOption((prev) => prev?.key === focused ? {
+					...prev,
+					term
+				} : {
+					key: focused,
+					term,
+					source: "auto"
+				});
+				else moveVirtualFocus(preferredOptionKey, "auto", term);
+			};
+			requestAnimationFrame(() => requestAnimationFrame(tick));
+			return () => {
+				isCancelled = true;
+			};
+		};
+		$[182] = customTerm;
+		$[183] = moveVirtualFocus;
+		$[184] = preferredOptionKey;
+		$[185] = shouldShowPopover;
+		$[186] = term;
+		$[187] = visibleOptionsSignature;
+		$[188] = wrapperRef;
+		$[189] = t34;
+	} else t34 = $[189];
+	let t35;
+	if ($[190] !== customTerm || $[191] !== moveVirtualFocus || $[192] !== preferredOptionKey || $[193] !== shouldShowPopover || $[194] !== term || $[195] !== visibleOptionsSignature || $[196] !== wrapperRef) {
+		t35 = [
+			shouldShowPopover,
+			visibleOptionsSignature,
+			customTerm,
+			term,
+			preferredOptionKey,
+			moveVirtualFocus,
+			wrapperRef
+		];
+		$[190] = customTerm;
+		$[191] = moveVirtualFocus;
+		$[192] = preferredOptionKey;
+		$[193] = shouldShowPopover;
+		$[194] = term;
+		$[195] = visibleOptionsSignature;
+		$[196] = wrapperRef;
+		$[197] = t35;
+	} else t35 = $[197];
+	useLayoutEffect(t34, t35);
+	let t36;
+	if ($[198] !== setDraftState) {
+		t36 = (next_0) => {
+			setDraftState(next_0);
+			setIsFilterActive(!!next_0.trim());
+		};
+		$[198] = setDraftState;
+		$[199] = t36;
+	} else t36 = $[199];
+	const setDraft = useEvent(t36);
+	let t37;
+	if ($[200] === Symbol.for("react.memo_cache_sentinel")) {
+		t37 = (text_1) => {
+			setAnnouncement((prev_0) => ({
+				id: prev_0.id + 1,
+				text: text_1
+			}));
+		};
+		$[200] = t37;
+	} else t37 = $[200];
+	const announce = useEvent(t37);
+	let t38;
+	if ($[201] !== maxTags || $[202] !== t) {
+		t38 = (rejection) => {
+			if (rejection.message) return rejection.message;
+			switch (rejection.reason) {
+				case "duplicate": return t("tagInput.duplicateValue", "\"{{value}}\" is already added", { value: rejection.text });
+				case "unknown": return t("tagInput.unknownValue", "\"{{value}}\" is not in the list", { value: rejection.text });
+				case "unavailable": return t("tagInput.unavailableValue", "\"{{value}}\" is not available", { value: rejection.text });
+				case "limit": return t("tagInput.limitReached", "You can add up to {{count}}", { count: maxTags });
+				default: return t("tagInput.invalidValue", "\"{{value}}\" is not a valid value", { value: rejection.text });
+			}
+		};
+		$[201] = maxTags;
+		$[202] = t;
+		$[203] = t38;
+	} else t38 = $[203];
+	const rejectionMessage = useEvent(t38);
+	const joiner = delimiters[0] ? `${delimiters[0]} ` : " ";
+	const hasFieldMessage = !!label || !!props.forceField;
+	let t39;
+	if ($[204] !== allowsCustomValue || $[205] !== announce || $[206] !== disabledKeySet || $[207] !== findOptionKey || $[208] !== formatList || $[209] !== getTagLabel || $[210] !== hasFieldMessage || $[211] !== hasOptions || $[212] !== joiner || $[213] !== maxTags || $[214] !== normalizeTag || $[215] !== rejectionMessage || $[216] !== rememberLabels || $[217] !== setTagError || $[218] !== setValues || $[219] !== t || $[220] !== uniqueValues || $[221] !== validateTag) {
+		t39 = (parts) => {
+			if (!parts.length) return "";
+			const present = new Set(uniqueValues);
+			const accepted = [];
+			const rejected = [];
+			for (const part of parts) {
+				let optionKey = findOptionKey(part);
+				let typed = part;
+				if (optionKey == null && normalizeTag) {
+					typed = normalizeTag(part).trim();
+					if (!typed) continue;
+					optionKey = findOptionKey(typed);
+				}
+				const nextValue = optionKey ?? typed;
+				if (optionKey != null && disabledKeySet.has(optionKey)) {
+					rejected.push({
+						text: part,
+						reason: "unavailable"
+					});
+					continue;
+				}
+				if (optionKey == null && hasOptions && !allowsCustomValue) {
+					rejected.push({
+						text: part,
+						reason: "unknown"
+					});
+					continue;
+				}
+				if (present.has(nextValue)) {
+					rejected.push({
+						text: part,
+						reason: "duplicate"
+					});
+					continue;
+				}
+				if (maxTags != null && present.size >= maxTags) {
+					rejected.push({
+						text: part,
+						reason: "limit"
+					});
+					continue;
+				}
+				if (optionKey == null && validateTag) {
+					const result = validateTag(nextValue);
+					if (result === false || typeof result === "string") {
+						rejected.push({
+							text: part,
+							reason: "invalid",
+							message: typeof result === "string" ? result : void 0
+						});
+						continue;
+					}
+				}
+				present.add(nextValue);
+				accepted.push(nextValue);
+			}
+			const error = rejected.length ? rejectionMessage(rejected[0]) : null;
+			const messages = [];
+			if (accepted.length) {
+				rememberLabels(accepted);
+				setValues([...uniqueValues, ...accepted]);
+				messages.push(t("tagInput.added", "Added {{value}}", { value: formatList(accepted.map(getTagLabel)) }));
+			}
+			if (error && !hasFieldMessage) messages.push(error);
+			if (messages.length) announce(messages.join(" "));
+			setTagError(error);
+			return rejected.map(_temp6).join(joiner);
+		};
+		$[204] = allowsCustomValue;
+		$[205] = announce;
+		$[206] = disabledKeySet;
+		$[207] = findOptionKey;
+		$[208] = formatList;
+		$[209] = getTagLabel;
+		$[210] = hasFieldMessage;
+		$[211] = hasOptions;
+		$[212] = joiner;
+		$[213] = maxTags;
+		$[214] = normalizeTag;
+		$[215] = rejectionMessage;
+		$[216] = rememberLabels;
+		$[217] = setTagError;
+		$[218] = setValues;
+		$[219] = t;
+		$[220] = uniqueValues;
+		$[221] = validateTag;
+		$[222] = t39;
+	} else t39 = $[222];
+	const commitParts = useEvent(t39);
+	let t40;
+	if ($[223] !== commitParts || $[224] !== delimiters || $[225] !== draft || $[226] !== setDraft) {
+		t40 = () => {
+			setDraft(commitParts(splitTagText(draft, delimiters)));
+		};
+		$[223] = commitParts;
+		$[224] = delimiters;
+		$[225] = draft;
+		$[226] = setDraft;
+		$[227] = t40;
+	} else t40 = $[227];
+	const commitDraft = useEvent(t40);
+	let t41;
+	if ($[228] === Symbol.for("react.memo_cache_sentinel")) {
+		t41 = () => {
+			const rows = tagListRef.current?.querySelectorAll("[role=\"row\"]:not([aria-disabled=\"true\"])");
+			rows?.[rows.length - 1]?.focus();
+		};
+		$[228] = t41;
+	} else t41 = $[228];
+	const focusLastTag = useEvent(t41);
+	let t42;
+	if ($[229] !== announce || $[230] !== formatList || $[231] !== getTagLabel || $[232] !== inputRef || $[233] !== isTagLocked || $[234] !== setTagError || $[235] !== setValues || $[236] !== t || $[237] !== uniqueValues) {
+		t42 = (requested) => {
+			const keys_2 = requested.filter((key_7) => !isTagLocked(key_7));
+			if (!keys_2.length) return;
+			const removed = new Set(keys_2);
+			const next_1 = uniqueValues.filter((value_1) => !removed.has(value_1));
+			if (!next_1.some((value_2) => !isTagLocked(value_2))) inputRef.current?.focus();
+			setValues(next_1);
+			setTagError(null);
+			announce(t("tagInput.removed", "Removed {{value}}", { value: formatList(keys_2.map(getTagLabel)) }));
+		};
+		$[229] = announce;
+		$[230] = formatList;
+		$[231] = getTagLabel;
+		$[232] = inputRef;
+		$[233] = isTagLocked;
+		$[234] = setTagError;
+		$[235] = setValues;
+		$[236] = t;
+		$[237] = uniqueValues;
+		$[238] = t42;
+	} else t42 = $[238];
+	const removeValues = useEvent(t42);
+	let t43;
+	if ($[239] !== commitParts || $[240] !== customValueKeys || $[241] !== isTagLocked || $[242] !== removeValues || $[243] !== setDraft || $[244] !== setTagError || $[245] !== uniqueValues) {
+		t43 = (key_8) => {
+			if (isTagLocked(key_8)) return;
+			setTagError(null);
+			if (uniqueValues.includes(key_8)) {
+				removeValues([key_8]);
+				setDraft("");
+				if (customValueKeys.includes(key_8)) setUnpickedCustomValues((prev_1) => prev_1.includes(key_8) ? prev_1 : [...prev_1, key_8]);
+			} else if (!commitParts([key_8])) setDraft("");
+		};
+		$[239] = commitParts;
+		$[240] = customValueKeys;
+		$[241] = isTagLocked;
+		$[242] = removeValues;
+		$[243] = setDraft;
+		$[244] = setTagError;
+		$[245] = uniqueValues;
+		$[246] = t43;
+	} else t43 = $[246];
+	const toggleOption = useEvent(t43);
+	let t44;
+	if ($[247] !== collection || $[248] !== inputRef || $[249] !== toggleOption || $[250] !== uniqueValues || $[251] !== visibleCustomKeys) {
+		t44 = (selection) => {
+			if (!Array.isArray(selection)) return;
+			const next_2 = new Set(selection.map(String));
+			const changed = [...[...next_2].filter((key_9) => !uniqueValues.includes(key_9)), ...uniqueValues.filter((value_3) => !next_2.has(value_3) && (collection.getItem(value_3) != null || visibleCustomKeys.includes(value_3)))];
+			changed.forEach(toggleOption);
+			const clicked = changed[changed.length - 1];
+			if (clicked != null) {
+				listStateRef.current?.selectionManager.setFocusedKey(clicked);
+				setActiveOption({
+					key: clicked,
+					term: "",
+					source: "user"
+				});
+			}
+			setTimeout(() => inputRef.current?.focus(), 0);
+		};
+		$[247] = collection;
+		$[248] = inputRef;
+		$[249] = toggleOption;
+		$[250] = uniqueValues;
+		$[251] = visibleCustomKeys;
+		$[252] = t44;
+	} else t44 = $[252];
+	const handlePopoverSelection = useEvent(t44);
+	const isTabbingRef = useRef(false);
+	let t45;
+	if ($[253] !== activeOption || $[254] !== commitDraft || $[255] !== commitParts || $[256] !== delimiters || $[257] !== draft || $[258] !== focusLastTag || $[259] !== getTagLabel || $[260] !== hasOptions || $[261] !== hasResults || $[262] !== isInteractive || $[263] !== isTagLocked || $[264] !== joiner || $[265] !== moveVirtualFocus || $[266] !== onKeyDown || $[267] !== preferredOptionKey || $[268] !== rejectionMessage || $[269] !== setDraft || $[270] !== setTagError || $[271] !== shouldShowPopover || $[272] !== term || $[273] !== toggleOption || $[274] !== uniqueValues) {
+		t45 = (e) => {
+			onKeyDown?.(e);
+			isTabbingRef.current = e.key === "Tab" && !e.defaultPrevented;
+			if (e.defaultPrevented || !isInteractive) return;
+			const listState_1 = listStateRef.current;
+			if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+				if (!hasOptions) return;
+				e.preventDefault();
+				if (!shouldShowPopover) {
+					if (!hasResults) setIsFilterActive(false);
+					setIsPopoverOpen(true);
+					return;
+				}
+				if (listState_1) moveVirtualFocus(getNextVisibleKey(listState_1, e.key === "ArrowDown" ? 1 : -1), "user", term);
+				return;
+			}
+			if ((e.key === "Home" || e.key === "End") && shouldShowPopover) {
+				e.preventDefault();
+				if (listState_1) moveVirtualFocus(getEdgeVisibleKey(listState_1, e.key === "Home" ? "first" : "last"), "user", term);
+				return;
+			}
+			if (e.key === "Backspace" && !draft && uniqueValues.some((value_4) => !isTagLocked(value_4))) {
+				if (isComposingKey(e)) return;
+				e.preventDefault();
+				if (e.repeat) return;
+				setIsPopoverOpen(false);
+				focusLastTag();
+				return;
+			}
+			if (e.key === "Enter") {
+				if (isComposingKey(e)) return;
+				const isCurrent = activeOption != null && activeOption.term === term;
+				const targetKey = shouldShowPopover ? isCurrent ? activeOption.key : preferredOptionKey : null;
+				if (targetKey != null) {
+					e.preventDefault();
+					const key_10 = String(targetKey);
+					if (term && uniqueValues.includes(key_10) && !(isCurrent && activeOption.source === "user")) {
+						setTagError(rejectionMessage({
+							text: getTagLabel(key_10),
+							reason: "duplicate"
+						}));
+						return;
+					}
+					toggleOption(key_10);
+					return;
+				}
+				e.preventDefault();
+				if (term) commitDraft();
+				return;
+			}
+			if (delimiters.includes(e.key)) {
+				if (isComposingKey(e)) return;
+				e.preventDefault();
+				const el = e.currentTarget;
+				const start = el.selectionStart ?? draft.length;
+				const end = el.selectionEnd ?? start;
+				setDraft([commitParts(splitTagText(draft.slice(0, start), delimiters)), draft.slice(end).trimStart()].filter(Boolean).join(joiner));
+				return;
+			}
+			if (e.key === "Escape") {
+				if (shouldShowPopover) {
+					e.preventDefault();
+					e.stopPropagation();
+					setIsPopoverOpen(false);
+				} else if (draft) {
+					e.preventDefault();
+					e.stopPropagation();
+					setDraft("");
+					setTagError(null);
+					setIsPopoverOpen(false);
+				}
+			}
+		};
+		$[253] = activeOption;
+		$[254] = commitDraft;
+		$[255] = commitParts;
+		$[256] = delimiters;
+		$[257] = draft;
+		$[258] = focusLastTag;
+		$[259] = getTagLabel;
+		$[260] = hasOptions;
+		$[261] = hasResults;
+		$[262] = isInteractive;
+		$[263] = isTagLocked;
+		$[264] = joiner;
+		$[265] = moveVirtualFocus;
+		$[266] = onKeyDown;
+		$[267] = preferredOptionKey;
+		$[268] = rejectionMessage;
+		$[269] = setDraft;
+		$[270] = setTagError;
+		$[271] = shouldShowPopover;
+		$[272] = term;
+		$[273] = toggleOption;
+		$[274] = uniqueValues;
+		$[275] = t45;
+	} else t45 = $[275];
+	const handleKeyDown = useEvent(t45);
+	let t46;
+	if ($[276] !== commitParts || $[277] !== delimiters || $[278] !== hasOptions || $[279] !== joiner || $[280] !== popoverTrigger || $[281] !== rememberLabels || $[282] !== setDraft || $[283] !== setTagError || $[284] !== uniqueValues) {
+		t46 = (next_3) => {
+			setTagError(null);
+			rememberLabels(uniqueValues);
+			const pattern = delimiterPattern(delimiters);
+			const parts_0 = pattern ? next_3.split(pattern) : [next_3];
+			let nextDraft = next_3;
+			if (parts_0.length > 1) {
+				const rest = (parts_0.pop() ?? "").trimStart();
+				nextDraft = [commitParts(parts_0.map(_temp7).filter(Boolean)), rest].filter(Boolean).join(joiner);
+			}
+			setDraft(nextDraft);
+			if (hasOptions && popoverTrigger !== "manual" && nextDraft.trim()) setIsPopoverOpen(true);
+		};
+		$[276] = commitParts;
+		$[277] = delimiters;
+		$[278] = hasOptions;
+		$[279] = joiner;
+		$[280] = popoverTrigger;
+		$[281] = rememberLabels;
+		$[282] = setDraft;
+		$[283] = setTagError;
+		$[284] = uniqueValues;
+		$[285] = t46;
+	} else t46 = $[285];
+	const handleInputChange = useEvent(t46);
+	let t47;
+	if ($[286] !== commitParts || $[287] !== delimiters || $[288] !== draft || $[289] !== isInteractive || $[290] !== setDraft || $[291] !== setTagError) {
+		t47 = (e_0) => {
+			if (!isInteractive) return;
+			const pasted = e_0.clipboardData.getData("text");
+			if (!pasted || splitTagText(pasted, delimiters).length < 2) return;
+			e_0.preventDefault();
+			const el_0 = e_0.currentTarget;
+			const start_0 = el_0.selectionStart ?? draft.length;
+			const end_0 = el_0.selectionEnd ?? draft.length;
+			setTagError(null);
+			setDraft(commitParts(splitTagText(`${draft.slice(0, start_0)}\n${pasted}\n${draft.slice(end_0)}`, delimiters)));
+		};
+		$[286] = commitParts;
+		$[287] = delimiters;
+		$[288] = draft;
+		$[289] = isInteractive;
+		$[290] = setDraft;
+		$[291] = setTagError;
+		$[292] = t47;
+	} else t47 = $[292];
+	const handlePaste = useEvent(t47);
+	let t48;
+	if ($[293] !== allowsCustomValue || $[294] !== commitDraft || $[295] !== findOptionKey || $[296] !== hasOptions || $[297] !== isInteractive || $[298] !== setDraft || $[299] !== setTagError || $[300] !== shouldCommitOnBlur || $[301] !== term) {
+		t48 = () => {
+			if (!term || !shouldCommitOnBlur || !isInteractive) return;
+			if (hasOptions && !allowsCustomValue && findOptionKey(term) == null) {
+				setDraft("");
+				setTagError(null);
+			} else commitDraft();
+		};
+		$[293] = allowsCustomValue;
+		$[294] = commitDraft;
+		$[295] = findOptionKey;
+		$[296] = hasOptions;
+		$[297] = isInteractive;
+		$[298] = setDraft;
+		$[299] = setTagError;
+		$[300] = shouldCommitOnBlur;
+		$[301] = term;
+		$[302] = t48;
+	} else t48 = $[302];
+	const settleDraft = useEvent(t48);
+	let t49;
+	if ($[303] !== onBlur || $[304] !== settleDraft) {
+		t49 = () => {
+			setIsPopoverOpen(false);
+			setUnpickedCustomValues([]);
+			settleDraft();
+			onBlur?.();
+		};
+		$[303] = onBlur;
+		$[304] = settleDraft;
+		$[305] = t49;
+	} else t49 = $[305];
+	const handleCompositeBlur = useEvent(t49);
+	const t50 = rootRef;
+	const t51 = popoverRef;
+	let t52;
+	if ($[306] !== handleCompositeBlur || $[307] !== isDisabled || $[308] !== onFocus || $[309] !== t50 || $[310] !== t51) {
+		t52 = {
+			wrapperRef: t50,
+			popoverRef: t51,
+			onFocus,
+			onBlur: handleCompositeBlur,
+			isDisabled
+		};
+		$[306] = handleCompositeBlur;
+		$[307] = isDisabled;
+		$[308] = onFocus;
+		$[309] = t50;
+		$[310] = t51;
+		$[311] = t52;
+	} else t52 = $[311];
+	const { compositeFocusProps } = useCompositeFocus(t52);
+	let t53;
+	if ($[312] !== rootRef || $[313] !== settleDraft) {
+		t53 = (e_1) => {
+			const isTabbing = isTabbingRef.current;
+			const next_4 = e_1.relatedTarget;
+			isTabbingRef.current = false;
+			if (!isTabbing || !next_4 || !rootRef.current?.contains(next_4)) return;
+			setIsPopoverOpen(false);
+			settleDraft();
+		};
+		$[312] = rootRef;
+		$[313] = settleDraft;
+		$[314] = t53;
+	} else t53 = $[314];
+	const handleInputBlur = useEvent(t53);
+	let t54;
+	if ($[315] !== hasOptions || $[316] !== isInteractive || $[317] !== popoverTrigger) {
+		t54 = () => {
+			if (hasOptions && popoverTrigger === "focus" && isInteractive) setIsPopoverOpen(true);
+		};
+		$[315] = hasOptions;
+		$[316] = isInteractive;
+		$[317] = popoverTrigger;
+		$[318] = t54;
+	} else t54 = $[318];
+	const handleInputFocus = useEvent(t54);
+	let t55;
+	if ($[319] !== collection || $[320] !== getOptionLabel || $[321] !== knownLabels || $[322] !== t || $[323] !== tagProps || $[324] !== uniqueValues || $[325] !== validateTag) {
+		t55 = uniqueValues.map((value_5) => {
+			const ownProps = tagProps?.(value_5);
+			const result_0 = !(collection.getItem(value_5) != null || knownLabels.has(value_5)) && validateTag ? validateTag(value_5) : true;
+			const label_1 = textLabel(ownProps?.children) ?? getOptionLabel(value_5);
+			return {
+				key: value_5,
+				label: label_1,
+				invalidMessage: typeof result_0 === "string" ? result_0 : result_0 === false ? t("tagInput.invalidValue", "\"{{value}}\" is not a valid value", { value: label_1 }) : void 0,
+				tagProps: ownProps,
+				isDisabled: !!ownProps?.isDisabled
+			};
+		});
+		$[319] = collection;
+		$[320] = getOptionLabel;
+		$[321] = knownLabels;
+		$[322] = t;
+		$[323] = tagProps;
+		$[324] = uniqueValues;
+		$[325] = validateTag;
+		$[326] = t55;
+	} else t55 = $[326];
+	const tags = t55;
+	const effectiveIsInvalid = tagError ? true : isInvalid;
+	const hasRemovableTags = tags.some(_temp8);
+	const hasBackspaceHint = isInteractive && hasRemovableTags;
+	let t56;
+	if ($[327] !== tags) {
+		t56 = tags.filter(_temp9).map(_temp0);
+		$[327] = tags;
+		$[328] = t56;
+	} else t56 = $[328];
+	const locked = t56;
+	let t57;
+	if ($[329] !== disabledKeySet || $[330] !== disabledKeys || $[331] !== locked) {
+		t57 = locked.length ? [...disabledKeySet, ...locked] : disabledKeys;
+		$[329] = disabledKeySet;
+		$[330] = disabledKeys;
+		$[331] = locked;
+		$[332] = t57;
+	} else t57 = $[332];
+	const optionDisabledKeys = t57;
+	let t58;
+	if ($[333] !== autoFocus || $[334] !== draft || $[335] !== effectiveIsInvalid || $[336] !== handleInputChange || $[337] !== id || $[338] !== isDisabled || $[339] !== isReadOnly || $[340] !== isRequired || $[341] !== label || $[342] !== otherProps || $[343] !== placeholder) {
+		t58 = {
+			...otherProps,
+			id,
+			label,
+			value: draft,
+			placeholder,
+			isDisabled,
+			isReadOnly,
+			isRequired,
+			isInvalid: effectiveIsInvalid,
+			autoFocus,
+			onChange: handleInputChange
+		};
+		$[333] = autoFocus;
+		$[334] = draft;
+		$[335] = effectiveIsInvalid;
+		$[336] = handleInputChange;
+		$[337] = id;
+		$[338] = isDisabled;
+		$[339] = isReadOnly;
+		$[340] = isRequired;
+		$[341] = label;
+		$[342] = otherProps;
+		$[343] = placeholder;
+		$[344] = t58;
+	} else t58 = $[344];
+	const { labelProps, inputProps } = useTextField(t58, inputRef);
+	const labelId = label ? labelProps.id : void 0;
+	let describedBy;
+	if ($[345] !== hasBackspaceHint || $[346] !== hintId || $[347] !== inputProps || $[348] !== summaryId || $[349] !== tags.length) {
+		describedBy = [];
+		if (inputProps["aria-describedby"]) describedBy.push(inputProps["aria-describedby"]);
+		if (tags.length) describedBy.push(summaryId);
+		if (hasBackspaceHint) describedBy.push(hintId);
+		$[345] = hasBackspaceHint;
+		$[346] = hintId;
+		$[347] = inputProps;
+		$[348] = summaryId;
+		$[349] = tags.length;
+		$[350] = describedBy;
+	} else describedBy = $[350];
+	let t59;
+	if ($[351] !== activeOptionKey || $[352] !== autoComplete || $[353] !== describedBy || $[354] !== handleInputBlur || $[355] !== handleInputFocus || $[356] !== handleKeyDown || $[357] !== handlePaste || $[358] !== hasOptions || $[359] !== inputProps || $[360] !== shouldShowPopover) {
+		t59 = mergeProps$1(inputProps, {
+			onKeyDown: handleKeyDown,
+			onPaste: handlePaste,
+			onBlur: handleInputBlur,
+			onFocus: handleInputFocus,
+			autoComplete,
+			"data-input-type": "taginput",
+			"aria-describedby": describedBy.join(" ") || void 0
+		}, hasOptions ? {
+			role: "combobox",
+			"aria-autocomplete": "list",
+			"aria-haspopup": "listbox",
+			"aria-expanded": shouldShowPopover,
+			"aria-controls": shouldShowPopover ? listBoxId : void 0,
+			"aria-activedescendant": shouldShowPopover && activeOptionKey != null ? getListBoxOptionId(listBoxId, activeOptionKey) : void 0
+		} : null);
+		$[351] = activeOptionKey;
+		$[352] = autoComplete;
+		$[353] = describedBy;
+		$[354] = handleInputBlur;
+		$[355] = handleInputFocus;
+		$[356] = handleKeyDown;
+		$[357] = handlePaste;
+		$[358] = hasOptions;
+		$[359] = inputProps;
+		$[360] = shouldShowPopover;
+		$[361] = t59;
+	} else t59 = $[361];
+	const tagInputProps = t59;
+	let t60;
+	if ($[362] !== hasResults || $[363] !== inputRef || $[364] !== shouldShowPopover) {
+		t60 = () => {
+			const willOpen = !shouldShowPopover;
+			if (willOpen && !hasResults) setIsFilterActive(false);
+			setIsPopoverOpen(willOpen);
+			inputRef.current?.focus();
+		};
+		$[362] = hasResults;
+		$[363] = inputRef;
+		$[364] = shouldShowPopover;
+		$[365] = t60;
+	} else t60 = $[365];
+	const handleTriggerPress = useEvent(t60);
+	let t61;
+	if ($[366] !== handleTriggerPress || $[367] !== hasOptions || $[368] !== hideTrigger || $[369] !== isInteractive || $[370] !== labelId || $[371] !== shouldShowPopover || $[372] !== size || $[373] !== t || $[374] !== triggerId || $[375] !== triggerStyles) {
+		t61 = hasOptions && !hideTrigger ? /* @__PURE__ */ jsx(ItemAction, {
+			"data-popover-trigger": true,
+			id: triggerId,
+			qa: "TagInputTrigger",
+			icon: /* @__PURE__ */ jsx(DirectionIcon, { to: shouldShowPopover ? "up" : "down" }),
+			size,
+			isDisabled: !isInteractive,
+			styles: triggerStyles,
+			mods: { pressed: shouldShowPopover },
+			tabIndex: -1,
+			"aria-expanded": shouldShowPopover,
+			"aria-haspopup": "listbox",
+			"aria-label": t("tagInput.showOptions", "Show options"),
+			"aria-labelledby": labelId ? `${triggerId} ${labelId}` : void 0,
+			onPress: handleTriggerPress
+		}) : null;
+		$[366] = handleTriggerPress;
+		$[367] = hasOptions;
+		$[368] = hideTrigger;
+		$[369] = isInteractive;
+		$[370] = labelId;
+		$[371] = shouldShowPopover;
+		$[372] = size;
+		$[373] = t;
+		$[374] = triggerId;
+		$[375] = triggerStyles;
+		$[376] = t61;
+	} else t61 = $[376];
+	const trigger = t61;
+	let t62;
+	if ($[377] !== inputRef || $[378] !== onClear || $[379] !== setDraft || $[380] !== setTagError) {
+		t62 = () => {
+			inputRef.current?.focus();
+			setDraft("");
+			setTagError(null);
+			setIsPopoverOpen(false);
+			onClear?.();
+		};
+		$[377] = inputRef;
+		$[378] = onClear;
+		$[379] = setDraft;
+		$[380] = setTagError;
+		$[381] = t62;
+	} else t62 = $[381];
+	const clearText = useEvent(t62);
+	const canClear = !!isClearable && isInteractive && draft !== "";
+	let t63;
+	if ($[382] !== canClear || $[383] !== clearId || $[384] !== clearText || $[385] !== labelId || $[386] !== size || $[387] !== t) {
+		t63 = canClear ? /* @__PURE__ */ jsx(ItemAction, {
+			id: clearId,
+			qa: "TagInputClearButton",
+			icon: /* @__PURE__ */ jsx(CloseIcon, {}),
+			size,
+			tabIndex: -1,
+			"aria-label": t("tagInput.clearText", "Clear text"),
+			"aria-labelledby": labelId ? `${clearId} ${labelId}` : void 0,
+			onPress: clearText
+		}) : null;
+		$[382] = canClear;
+		$[383] = clearId;
+		$[384] = clearText;
+		$[385] = labelId;
+		$[386] = size;
+		$[387] = t;
+		$[388] = t63;
+	} else t63 = $[388];
+	const clearButton = t63;
+	const hasActions = clearButton != null || trigger != null;
+	const t64 = qa || "TagInput";
+	let t65;
+	if ($[389] !== clearButton || $[390] !== hasActions || $[391] !== trigger) {
+		t65 = hasActions ? /* @__PURE__ */ jsxs(Fragment$1, { children: [clearButton, trigger] }) : null;
+		$[389] = clearButton;
+		$[390] = hasActions;
+		$[391] = trigger;
+		$[392] = t65;
+	} else t65 = $[392];
+	let t66;
+	if ($[393] !== autoFocus || $[394] !== effectiveIsInvalid || $[395] !== icon || $[396] !== inputRef || $[397] !== inputStyles || $[398] !== isDisabled || $[399] !== isLoading || $[400] !== isValid || $[401] !== mods || $[402] !== prefix || $[403] !== size || $[404] !== suffix || $[405] !== suffixPosition || $[406] !== t64 || $[407] !== t65 || $[408] !== tagInputProps || $[409] !== wrapperRef || $[410] !== wrapperStyles) {
+		t66 = /* @__PURE__ */ jsx(TextInputBase, {
+			qa: t64,
+			inputRef,
+			wrapperRef,
+			inputProps: tagInputProps,
+			mods,
+			icon,
+			prefix,
+			suffix,
+			suffixPosition,
+			actions: t65,
+			size,
+			autoFocus,
+			isDisabled,
+			isLoading,
+			isInvalid: effectiveIsInvalid,
+			isValid,
+			styles: wrapperStyles,
+			inputStyles
+		});
+		$[393] = autoFocus;
+		$[394] = effectiveIsInvalid;
+		$[395] = icon;
+		$[396] = inputRef;
+		$[397] = inputStyles;
+		$[398] = isDisabled;
+		$[399] = isLoading;
+		$[400] = isValid;
+		$[401] = mods;
+		$[402] = prefix;
+		$[403] = size;
+		$[404] = suffix;
+		$[405] = suffixPosition;
+		$[406] = t64;
+		$[407] = t65;
+		$[408] = tagInputProps;
+		$[409] = wrapperRef;
+		$[410] = wrapperStyles;
+		$[411] = t66;
+	} else t66 = $[411];
+	let t67;
+	if ($[412] !== inputRef || $[413] !== isDisabled || $[414] !== isReadOnly || $[415] !== labelId || $[416] !== removeValues || $[417] !== size || $[418] !== t || $[419] !== tagListId || $[420] !== tagListStyles || $[421] !== tagStyles || $[422] !== tags) {
+		t67 = tags.length ? /* @__PURE__ */ jsx(TagList, {
+			id: tagListId,
+			listRef: tagListRef,
+			inputRef,
+			"aria-label": t("tagInput.selectedValues", "Selected values"),
+			"aria-labelledby": labelId,
+			tags,
+			size: TAG_SIZES[size] ?? "xsmall",
+			isDisabled,
+			isReadOnly,
+			styles: tagListStyles,
+			tagStyles,
+			onRemove: removeValues
+		}) : null;
+		$[412] = inputRef;
+		$[413] = isDisabled;
+		$[414] = isReadOnly;
+		$[415] = labelId;
+		$[416] = removeValues;
+		$[417] = size;
+		$[418] = t;
+		$[419] = tagListId;
+		$[420] = tagListStyles;
+		$[421] = tagStyles;
+		$[422] = tags;
+		$[423] = t67;
+	} else t67 = $[423];
+	let t68;
+	if ($[424] !== formatList || $[425] !== t || $[426] !== tags) {
+		t68 = tags.length ? t("tagInput.summary", "Selected: {{values}}.", { values: formatList(tags.map(_temp1)) }) : null;
+		$[424] = formatList;
+		$[425] = t;
+		$[426] = tags;
+		$[427] = t68;
+	} else t68 = $[427];
+	let t69;
+	if ($[428] !== summaryId || $[429] !== t68) {
+		t69 = /* @__PURE__ */ jsx("span", {
+			hidden: true,
+			id: summaryId,
+			children: t68
+		});
+		$[428] = summaryId;
+		$[429] = t68;
+		$[430] = t69;
+	} else t69 = $[430];
+	let t70;
+	if ($[431] !== hasBackspaceHint || $[432] !== t) {
+		t70 = hasBackspaceHint ? t("tagInput.backspaceHint", "Press Backspace to go to the selected values.") : null;
+		$[431] = hasBackspaceHint;
+		$[432] = t;
+		$[433] = t70;
+	} else t70 = $[433];
+	let t71;
+	if ($[434] !== hintId || $[435] !== t70) {
+		t71 = /* @__PURE__ */ jsx("span", {
+			hidden: true,
+			id: hintId,
+			children: t70
+		});
+		$[434] = hintId;
+		$[435] = t70;
+		$[436] = t71;
+	} else t71 = $[436];
+	let t72;
+	if ($[437] !== announcement.id || $[438] !== announcement.text) {
+		t72 = /* @__PURE__ */ jsx(VisuallyHidden, {
+			role: "status",
+			"aria-live": "polite",
+			"aria-atomic": "true",
+			children: /* @__PURE__ */ jsx("span", { children: announcement.text }, announcement.id)
+		});
+		$[437] = announcement.id;
+		$[438] = announcement.text;
+		$[439] = t72;
+	} else t72 = $[439];
+	let t73;
+	if ($[440] !== compositeFocusProps || $[441] !== containerPadding || $[442] !== direction || $[443] !== handlePopoverSelection || $[444] !== hasOptions || $[445] !== headingStyles || $[446] !== isDisabled || $[447] !== isFilterActive || $[448] !== label || $[449] !== listBoxRef || $[450] !== listBoxStyles || $[451] !== optionDisabledKeys || $[452] !== optionFilterFn || $[453] !== optionStyles || $[454] !== overlayOffset || $[455] !== overlayStyles || $[456] !== popoverChildren || $[457] !== popoverMinWidth || $[458] !== popoverRef || $[459] !== props || $[460] !== sectionStyles || $[461] !== shouldFlip || $[462] !== shouldShowPopover || $[463] !== size || $[464] !== term || $[465] !== uniqueValues || $[466] !== wrapperRef) {
+		t73 = hasOptions ? /* @__PURE__ */ jsx(ListBoxPopover, {
+			isOpen: shouldShowPopover,
+			triggerRef: wrapperRef,
+			popoverRef,
+			listBoxRef,
+			direction,
+			shouldFlip,
+			overlayOffset,
+			containerPadding,
+			comboBoxWidth: popoverMinWidth,
+			listBoxId,
+			overlayStyles,
+			listBoxStyles,
+			optionStyles,
+			optionHighlight: isFilterActive ? term : void 0,
+			sectionStyles,
+			headingStyles,
+			selectionMode: "multiple",
+			selectedKeys: uniqueValues,
+			isCheckable: true,
+			shouldCloseOnTriggerInteraction: false,
+			isDisabled,
+			disabledKeys: optionDisabledKeys,
+			listStateRef,
+			label,
+			ariaLabel: props["aria-label"],
+			compositeFocusProps,
+			filter: optionFilterFn,
+			size,
+			onSelectionChange: handlePopoverSelection,
+			onClose: () => setIsPopoverOpen(false),
+			children: popoverChildren
+		}) : null;
+		$[440] = compositeFocusProps;
+		$[441] = containerPadding;
+		$[442] = direction;
+		$[443] = handlePopoverSelection;
+		$[444] = hasOptions;
+		$[445] = headingStyles;
+		$[446] = isDisabled;
+		$[447] = isFilterActive;
+		$[448] = label;
+		$[449] = listBoxRef;
+		$[450] = listBoxStyles;
+		$[451] = optionDisabledKeys;
+		$[452] = optionFilterFn;
+		$[453] = optionStyles;
+		$[454] = overlayOffset;
+		$[455] = overlayStyles;
+		$[456] = popoverChildren;
+		$[457] = popoverMinWidth;
+		$[458] = popoverRef;
+		$[459] = props;
+		$[460] = sectionStyles;
+		$[461] = shouldFlip;
+		$[462] = shouldShowPopover;
+		$[463] = size;
+		$[464] = term;
+		$[465] = uniqueValues;
+		$[466] = wrapperRef;
+		$[467] = t73;
+	} else t73 = $[467];
+	let t74;
+	if ($[468] !== className || $[469] !== compositeFocusProps || $[470] !== qaVal || $[471] !== rootRef || $[472] !== style || $[473] !== styles || $[474] !== t66 || $[475] !== t67 || $[476] !== t69 || $[477] !== t71 || $[478] !== t72 || $[479] !== t73) {
+		t74 = /* @__PURE__ */ jsxs(TagInputElement, {
+			ref: rootRef,
+			className,
+			style,
+			qaVal,
+			styles,
+			...compositeFocusProps,
+			children: [
+				t66,
+				t67,
+				t69,
+				t71,
+				t72,
+				t73
+			]
+		});
+		$[468] = className;
+		$[469] = compositeFocusProps;
+		$[470] = qaVal;
+		$[471] = rootRef;
+		$[472] = style;
+		$[473] = styles;
+		$[474] = t66;
+		$[475] = t67;
+		$[476] = t69;
+		$[477] = t71;
+		$[478] = t72;
+		$[479] = t73;
+		$[480] = t74;
+	} else t74 = $[480];
+	const tagInputField = t74;
+	const { children: _children, ...fieldProps } = props;
+	const fieldRef = useCombinedRefs();
+	let t75;
+	if ($[481] !== message || $[482] !== tagError) {
+		t75 = tagError ? /* @__PURE__ */ jsx("span", { children: tagError.text }, tagError.id) : message;
+		$[481] = message;
+		$[482] = tagError;
+		$[483] = t75;
+	} else t75 = $[483];
+	return wrapWithField(tagInputField, fieldRef, {
+		...fieldProps,
+		labelProps: mergeProps$1(labelProps, userLabelProps),
+		isInvalid: effectiveIsInvalid,
+		message: t75,
+		errorMessage: tagError ? void 0 : errorMessage
+	});
+}
+/**
+* A field for a list of values, shown as removable chips below a single-line
+* input. Values are typed (Enter or a separator commits them) or picked from
+* suggested options.
+*/
+function _temp1(tag_2) {
+	return tag_2.label;
+}
+function _temp0(tag_1) {
+	return tag_1.key;
+}
+function _temp9(tag_0) {
+	return tag_0.isDisabled;
+}
+function _temp8(tag) {
+	return !tag.isDisabled;
+}
+function _temp7(part_0) {
+	return part_0.trim();
+}
+function _temp6(rejection_0) {
+	return rejection_0.text;
+}
+function _temp5(node_0) {
+	return node_0.type === "section";
+}
+function _temp4(key_4) {
+	return /* @__PURE__ */ jsx(_CollectionItem, {
+		textValue: key_4,
+		children: key_4
+	}, key_4);
+}
+function _temp3() {
+	return /* @__PURE__ */ new Map();
+}
+function _temp2() {
+	return true;
+}
+function _temp(t0) {
+	const { value, onChange } = t0;
+	return {
+		value: value ?? [],
+		onChange
+	};
+}
+const _TagInput = forwardRef(TagInput);
+Object.assign(_TagInput, {
+	Item: _CollectionItem,
+	Section,
+	displayName: "TagInput"
+});
+Object.defineProperty(_TagInput, "cubeInputType", {
+	value: "CheckboxGroup",
+	enumerable: false,
+	configurable: false
+});
+
+//#endregion
+export { _TagInput };
+//# sourceMappingURL=TagInput.js.map