@cube-dev/ui-kit 0.0.0-canary-266381a → 0.0.0-canary-367446a

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-266381a | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-367446a | 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";
@@ -12,7 +12,7 @@ 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 { rendersFieldChrome, wrapWithField } from "../../form/wrapper.js";
 import { getListBoxOptionId } from "../ListBox/optionId.js";
 import { collectVisibleKeys, filterCollectionNodes, getEdgeVisibleKey, getNextVisibleKey } from "../ListBoxPopover/listNavigation.js";
 import { TextInputBase } from "../TextInput/TextInputBase.js";
@@ -302,7 +302,7 @@ function TagInputClearButton(t0) {
 	return t4;
 }
 function TagInput(props, ref) {
-	const $ = c(300);
+	const $ = c(302);
 	let t0;
 	if ($[0] !== props) {
 		t0 = castNullableArrayValue(props);
@@ -905,7 +905,13 @@ function TagInput(props, ref) {
 	} else t23 = $[125];
 	const joinDelimiter = t23;
 	const joiner = joinDelimiter ? `${joinDelimiter} ` : " ";
-	const hasFieldMessage = !!label || !!props.forceField;
+	let t24;
+	if ($[126] !== props) {
+		t24 = rendersFieldChrome(props);
+		$[126] = props;
+		$[127] = t24;
+	} else t24 = $[127];
+	const hasFieldMessage = t24;
 	const commitParts = useEvent((parts, source_0) => {
 		if (!parts.length) return "";
 		const rules = {
@@ -947,29 +953,29 @@ function TagInput(props, ref) {
 		setTagError(error);
 		return kept.map(_temp6).join(joiner);
 	});
-	let t24;
-	if ($[126] !== commitParts || $[127] !== delimiters || $[128] !== draft || $[129] !== setDraft) {
-		t24 = () => {
+	let t25;
+	if ($[128] !== commitParts || $[129] !== delimiters || $[130] !== draft || $[131] !== setDraft) {
+		t25 = () => {
 			const rest = commitParts(splitTagText(draft, delimiters));
 			setDraft(rest);
 			return rest;
 		};
-		$[126] = commitParts;
-		$[127] = delimiters;
-		$[128] = draft;
-		$[129] = setDraft;
-		$[130] = t24;
-	} else t24 = $[130];
-	const commitDraft = useEvent(t24);
-	let t25;
-	if ($[131] === Symbol.for("react.memo_cache_sentinel")) {
-		t25 = () => {
+		$[128] = commitParts;
+		$[129] = delimiters;
+		$[130] = draft;
+		$[131] = setDraft;
+		$[132] = t25;
+	} else t25 = $[132];
+	const commitDraft = useEvent(t25);
+	let t26;
+	if ($[133] === Symbol.for("react.memo_cache_sentinel")) {
+		t26 = () => {
 			const rows = tagListRef.current?.querySelectorAll("[role=\"row\"]:not([aria-disabled=\"true\"])");
 			rows?.[rows.length - 1]?.focus();
 		};
-		$[131] = t25;
-	} else t25 = $[131];
-	const focusLastTag = useEvent(t25);
+		$[133] = t26;
+	} else t26 = $[133];
+	const focusLastTag = useEvent(t26);
 	const removeValues = useEvent((requested) => {
 		const keys_0 = requested.filter((key_4) => !isTagLocked(key_4));
 		if (!keys_0.length) return;
@@ -1007,9 +1013,9 @@ function TagInput(props, ref) {
 		setTimeout(() => inputRef.current?.focus(), 0);
 	});
 	const isTabbingRef = useRef(false);
-	let t26;
-	if ($[132] !== hasOptions || $[133] !== hasResults || $[134] !== moveVirtualFocus || $[135] !== setIsFilterActive || $[136] !== setIsPopoverOpen || $[137] !== shouldShowPopover || $[138] !== term) {
-		t26 = (e) => {
+	let t27;
+	if ($[134] !== hasOptions || $[135] !== hasResults || $[136] !== moveVirtualFocus || $[137] !== setIsFilterActive || $[138] !== setIsPopoverOpen || $[139] !== shouldShowPopover || $[140] !== term) {
+		t27 = (e) => {
 			if (!hasOptions) return;
 			e.preventDefault();
 			if (!shouldShowPopover) {
@@ -1020,42 +1026,42 @@ function TagInput(props, ref) {
 			const listState = listStateRef.current;
 			if (listState) moveVirtualFocus(getNextVisibleKey(listState, e.key === "ArrowDown" ? 1 : -1), "user", term);
 		};
-		$[132] = hasOptions;
-		$[133] = hasResults;
-		$[134] = moveVirtualFocus;
-		$[135] = setIsFilterActive;
-		$[136] = setIsPopoverOpen;
-		$[137] = shouldShowPopover;
-		$[138] = term;
-		$[139] = t26;
-	} else t26 = $[139];
-	const handleArrowKey = useEvent(t26);
-	let t27;
-	if ($[140] !== moveVirtualFocus || $[141] !== term) {
-		t27 = (e_0) => {
+		$[134] = hasOptions;
+		$[135] = hasResults;
+		$[136] = moveVirtualFocus;
+		$[137] = setIsFilterActive;
+		$[138] = setIsPopoverOpen;
+		$[139] = shouldShowPopover;
+		$[140] = term;
+		$[141] = t27;
+	} else t27 = $[141];
+	const handleArrowKey = useEvent(t27);
+	let t28;
+	if ($[142] !== moveVirtualFocus || $[143] !== term) {
+		t28 = (e_0) => {
 			e_0.preventDefault();
 			const listState_0 = listStateRef.current;
 			if (listState_0) moveVirtualFocus(getEdgeVisibleKey(listState_0, e_0.key === "Home" ? "first" : "last"), "user", term);
 		};
-		$[140] = moveVirtualFocus;
-		$[141] = term;
-		$[142] = t27;
-	} else t27 = $[142];
-	const handleEdgeKey = useEvent(t27);
-	let t28;
-	if ($[143] !== focusLastTag || $[144] !== setIsPopoverOpen) {
-		t28 = (e_1) => {
+		$[142] = moveVirtualFocus;
+		$[143] = term;
+		$[144] = t28;
+	} else t28 = $[144];
+	const handleEdgeKey = useEvent(t28);
+	let t29;
+	if ($[145] !== focusLastTag || $[146] !== setIsPopoverOpen) {
+		t29 = (e_1) => {
 			if (isComposingKey(e_1)) return;
 			e_1.preventDefault();
 			if (e_1.repeat) return;
 			setIsPopoverOpen(false);
 			focusLastTag();
 		};
-		$[143] = focusLastTag;
-		$[144] = setIsPopoverOpen;
-		$[145] = t28;
-	} else t28 = $[145];
-	const handleBackspaceKey = useEvent(t28);
+		$[145] = focusLastTag;
+		$[146] = setIsPopoverOpen;
+		$[147] = t29;
+	} else t29 = $[147];
+	const handleBackspaceKey = useEvent(t29);
 	const handleEnterKey = useEvent((e_2) => {
 		if (isComposingKey(e_2)) return;
 		const isCurrent = activeOption != null && activeOption.term === term;
@@ -1077,9 +1083,9 @@ function TagInput(props, ref) {
 		e_2.preventDefault();
 		if (term) commitDraft();
 	});
-	let t29;
-	if ($[146] !== commitParts || $[147] !== delimiters || $[148] !== draft || $[149] !== joiner || $[150] !== setDraft) {
-		t29 = (e_3) => {
+	let t30;
+	if ($[148] !== commitParts || $[149] !== delimiters || $[150] !== draft || $[151] !== joiner || $[152] !== setDraft) {
+		t30 = (e_3) => {
 			if (isComposingKey(e_3)) return;
 			e_3.preventDefault();
 			const el = e_3.currentTarget;
@@ -1087,17 +1093,17 @@ function TagInput(props, ref) {
 			const end = el.selectionEnd ?? start;
 			setDraft([commitParts(splitTagText(draft.slice(0, start), delimiters)), draft.slice(end).trimStart()].filter(Boolean).join(joiner));
 		};
-		$[146] = commitParts;
-		$[147] = delimiters;
-		$[148] = draft;
-		$[149] = joiner;
-		$[150] = setDraft;
-		$[151] = t29;
-	} else t29 = $[151];
-	const handleDelimiterKey = useEvent(t29);
-	let t30;
-	if ($[152] !== draft || $[153] !== setDraft || $[154] !== setIsPopoverOpen || $[155] !== setTagError || $[156] !== shouldShowPopover || $[157] !== tagError) {
-		t30 = (e_4) => {
+		$[148] = commitParts;
+		$[149] = delimiters;
+		$[150] = draft;
+		$[151] = joiner;
+		$[152] = setDraft;
+		$[153] = t30;
+	} else t30 = $[153];
+	const handleDelimiterKey = useEvent(t30);
+	let t31;
+	if ($[154] !== draft || $[155] !== setDraft || $[156] !== setIsPopoverOpen || $[157] !== setTagError || $[158] !== shouldShowPopover || $[159] !== tagError) {
+		t31 = (e_4) => {
 			if (shouldShowPopover) {
 				e_4.preventDefault();
 				e_4.stopPropagation();
@@ -1111,15 +1117,15 @@ function TagInput(props, ref) {
 				setIsPopoverOpen(false);
 			}
 		};
-		$[152] = draft;
-		$[153] = setDraft;
-		$[154] = setIsPopoverOpen;
-		$[155] = setTagError;
-		$[156] = shouldShowPopover;
-		$[157] = tagError;
-		$[158] = t30;
-	} else t30 = $[158];
-	const handleEscapeKey = useEvent(t30);
+		$[154] = draft;
+		$[155] = setDraft;
+		$[156] = setIsPopoverOpen;
+		$[157] = setTagError;
+		$[158] = shouldShowPopover;
+		$[159] = tagError;
+		$[160] = t31;
+	} else t31 = $[160];
+	const handleEscapeKey = useEvent(t31);
 	const handleKeyDown = useEvent((e_5) => {
 		onKeyDown?.(e_5);
 		isTabbingRef.current = e_5.key === "Tab" && !e_5.defaultPrevented;
@@ -1144,9 +1150,9 @@ function TagInput(props, ref) {
 		setDraft(nextDraft);
 		if (hasOptions && popoverTrigger !== "manual" && nextDraft.trim()) setIsPopoverOpen(true);
 	});
-	let t31;
-	if ($[159] !== commitParts || $[160] !== delimiters || $[161] !== draft || $[162] !== isInteractive || $[163] !== setDraft || $[164] !== setTagError) {
-		t31 = (e_6) => {
+	let t32;
+	if ($[161] !== commitParts || $[162] !== delimiters || $[163] !== draft || $[164] !== isInteractive || $[165] !== setDraft || $[166] !== setTagError) {
+		t32 = (e_6) => {
 			if (!isInteractive) return;
 			const pasted = e_6.clipboardData.getData("text");
 			if (!pasted || splitTagText(pasted, delimiters).length < 2) return;
@@ -1157,18 +1163,18 @@ function TagInput(props, ref) {
 			setTagError(null);
 			setDraft(commitParts(splitTagText(`${draft.slice(0, start_0)}\n${pasted}\n${draft.slice(end_0)}`, delimiters)));
 		};
-		$[159] = commitParts;
-		$[160] = delimiters;
-		$[161] = draft;
-		$[162] = isInteractive;
-		$[163] = setDraft;
-		$[164] = setTagError;
-		$[165] = t31;
-	} else t31 = $[165];
-	const handlePaste = useEvent(t31);
-	let t32;
-	if ($[166] !== allowsCustomValue || $[167] !== commitDraft || $[168] !== draft || $[169] !== hasOptions || $[170] !== isInteractive || $[171] !== setDraft || $[172] !== setTagError || $[173] !== shouldCommitOnBlur || $[174] !== term || $[175] !== termOptionKey) {
-		t32 = () => {
+		$[161] = commitParts;
+		$[162] = delimiters;
+		$[163] = draft;
+		$[164] = isInteractive;
+		$[165] = setDraft;
+		$[166] = setTagError;
+		$[167] = t32;
+	} else t32 = $[167];
+	const handlePaste = useEvent(t32);
+	let t33;
+	if ($[168] !== allowsCustomValue || $[169] !== commitDraft || $[170] !== draft || $[171] !== hasOptions || $[172] !== isInteractive || $[173] !== setDraft || $[174] !== setTagError || $[175] !== shouldCommitOnBlur || $[176] !== term || $[177] !== termOptionKey) {
+		t33 = () => {
 			if (!term) return "";
 			if (!shouldCommitOnBlur || !isInteractive) return draft;
 			if (hasOptions && !allowsCustomValue && termOptionKey == null) {
@@ -1178,34 +1184,34 @@ function TagInput(props, ref) {
 			}
 			return commitDraft();
 		};
-		$[166] = allowsCustomValue;
-		$[167] = commitDraft;
-		$[168] = draft;
-		$[169] = hasOptions;
-		$[170] = isInteractive;
-		$[171] = setDraft;
-		$[172] = setTagError;
-		$[173] = shouldCommitOnBlur;
-		$[174] = term;
-		$[175] = termOptionKey;
-		$[176] = t32;
-	} else t32 = $[176];
-	const settleDraft = useEvent(t32);
-	let t33;
-	if ($[177] !== cancelPendingClear || $[178] !== onFocus) {
-		t33 = () => {
+		$[168] = allowsCustomValue;
+		$[169] = commitDraft;
+		$[170] = draft;
+		$[171] = hasOptions;
+		$[172] = isInteractive;
+		$[173] = setDraft;
+		$[174] = setTagError;
+		$[175] = shouldCommitOnBlur;
+		$[176] = term;
+		$[177] = termOptionKey;
+		$[178] = t33;
+	} else t33 = $[178];
+	const settleDraft = useEvent(t33);
+	let t34;
+	if ($[179] !== cancelPendingClear || $[180] !== onFocus) {
+		t34 = () => {
 			cancelPendingClear();
 			onFocus?.();
 		};
-		$[177] = cancelPendingClear;
-		$[178] = onFocus;
-		$[179] = t33;
-	} else t33 = $[179];
-	const handleCompositeFocus = useEvent(t33);
-	let t34;
-	if ($[180] !== clearTagErrorAfterPress || $[181] !== onBlur || $[182] !== setIsPopoverOpen || $[183] !== setTagError || $[184] !== setUnpickedCustomValues || $[185] !== settleDraft || $[186] !== tagError) {
-		t34 = (t35) => {
-			const { isPressing } = t35;
+		$[179] = cancelPendingClear;
+		$[180] = onFocus;
+		$[181] = t34;
+	} else t34 = $[181];
+	const handleCompositeFocus = useEvent(t34);
+	let t35;
+	if ($[182] !== clearTagErrorAfterPress || $[183] !== onBlur || $[184] !== setIsPopoverOpen || $[185] !== setTagError || $[186] !== setUnpickedCustomValues || $[187] !== settleDraft || $[188] !== tagError) {
+		t35 = (t36) => {
+			const { isPressing } = t36;
 			setIsPopoverOpen(false);
 			setUnpickedCustomValues([]);
 			const wasShowingMessage = tagError != null;
@@ -1213,38 +1219,38 @@ function TagInput(props, ref) {
 			else setTagError(null);
 			onBlur?.();
 		};
-		$[180] = clearTagErrorAfterPress;
-		$[181] = onBlur;
-		$[182] = setIsPopoverOpen;
-		$[183] = setTagError;
-		$[184] = setUnpickedCustomValues;
-		$[185] = settleDraft;
-		$[186] = tagError;
-		$[187] = t34;
-	} else t34 = $[187];
-	const handleCompositeBlur = useEvent(t34);
-	const t35 = rootRef;
-	const t36 = popoverRef;
-	let t37;
-	if ($[188] !== handleCompositeBlur || $[189] !== handleCompositeFocus || $[190] !== isDisabled || $[191] !== t35 || $[192] !== t36) {
-		t37 = {
-			wrapperRef: t35,
-			popoverRef: t36,
+		$[182] = clearTagErrorAfterPress;
+		$[183] = onBlur;
+		$[184] = setIsPopoverOpen;
+		$[185] = setTagError;
+		$[186] = setUnpickedCustomValues;
+		$[187] = settleDraft;
+		$[188] = tagError;
+		$[189] = t35;
+	} else t35 = $[189];
+	const handleCompositeBlur = useEvent(t35);
+	const t36 = rootRef;
+	const t37 = popoverRef;
+	let t38;
+	if ($[190] !== handleCompositeBlur || $[191] !== handleCompositeFocus || $[192] !== isDisabled || $[193] !== t36 || $[194] !== t37) {
+		t38 = {
+			wrapperRef: t36,
+			popoverRef: t37,
 			onFocus: handleCompositeFocus,
 			onBlur: handleCompositeBlur,
 			isDisabled
 		};
-		$[188] = handleCompositeBlur;
-		$[189] = handleCompositeFocus;
-		$[190] = isDisabled;
-		$[191] = t35;
-		$[192] = t36;
-		$[193] = t37;
-	} else t37 = $[193];
-	const { compositeFocusProps } = useCompositeFocus(t37);
-	let t38;
-	if ($[194] !== rootRef || $[195] !== setIsPopoverOpen || $[196] !== settleDraft) {
-		t38 = (e_7) => {
+		$[190] = handleCompositeBlur;
+		$[191] = handleCompositeFocus;
+		$[192] = isDisabled;
+		$[193] = t36;
+		$[194] = t37;
+		$[195] = t38;
+	} else t38 = $[195];
+	const { compositeFocusProps } = useCompositeFocus(t38);
+	let t39;
+	if ($[196] !== rootRef || $[197] !== setIsPopoverOpen || $[198] !== settleDraft) {
+		t39 = (e_7) => {
 			const isTabbing = isTabbingRef.current;
 			const next_4 = e_7.relatedTarget;
 			isTabbingRef.current = false;
@@ -1252,24 +1258,24 @@ function TagInput(props, ref) {
 			setIsPopoverOpen(false);
 			settleDraft();
 		};
-		$[194] = rootRef;
-		$[195] = setIsPopoverOpen;
-		$[196] = settleDraft;
-		$[197] = t38;
-	} else t38 = $[197];
-	const handleInputBlur = useEvent(t38);
-	let t39;
-	if ($[198] !== hasOptions || $[199] !== isInteractive || $[200] !== popoverTrigger || $[201] !== setIsPopoverOpen) {
-		t39 = () => {
+		$[196] = rootRef;
+		$[197] = setIsPopoverOpen;
+		$[198] = settleDraft;
+		$[199] = t39;
+	} else t39 = $[199];
+	const handleInputBlur = useEvent(t39);
+	let t40;
+	if ($[200] !== hasOptions || $[201] !== isInteractive || $[202] !== popoverTrigger || $[203] !== setIsPopoverOpen) {
+		t40 = () => {
 			if (hasOptions && popoverTrigger === "focus" && isInteractive) setIsPopoverOpen(true);
 		};
-		$[198] = hasOptions;
-		$[199] = isInteractive;
-		$[200] = popoverTrigger;
-		$[201] = setIsPopoverOpen;
-		$[202] = t39;
-	} else t39 = $[202];
-	const handleInputFocus = useEvent(t39);
+		$[200] = hasOptions;
+		$[201] = isInteractive;
+		$[202] = popoverTrigger;
+		$[203] = setIsPopoverOpen;
+		$[204] = t40;
+	} else t40 = $[204];
+	const handleInputFocus = useEvent(t40);
 	const tags = uniqueValues.map((value_5) => {
 		const ownProps = tagProps?.(value_5);
 		const result = !(getOption(value_5) != null || knownLabels.has(value_5)) && validateTag ? validateTag(value_5) : true;
@@ -1287,9 +1293,9 @@ function TagInput(props, ref) {
 	const hasBackspaceHint = isInteractive && hasRemovableTags;
 	const lockedKeys = tags.filter(_temp9).map(_temp0);
 	const optionDisabledKeys = lockedKeys.length ? [...disabledKeySet, ...lockedKeys] : disabledKeys;
-	let t40;
-	if ($[203] !== autoFocus || $[204] !== draft || $[205] !== effectiveIsInvalid || $[206] !== handleInputChange || $[207] !== id || $[208] !== isDisabled || $[209] !== isReadOnly || $[210] !== isRequired || $[211] !== label || $[212] !== otherProps || $[213] !== placeholder) {
-		t40 = {
+	let t41;
+	if ($[205] !== autoFocus || $[206] !== draft || $[207] !== effectiveIsInvalid || $[208] !== handleInputChange || $[209] !== id || $[210] !== isDisabled || $[211] !== isReadOnly || $[212] !== isRequired || $[213] !== label || $[214] !== otherProps || $[215] !== placeholder) {
+		t41 = {
 			...otherProps,
 			id,
 			label,
@@ -1302,31 +1308,31 @@ function TagInput(props, ref) {
 			autoFocus,
 			onChange: handleInputChange
 		};
-		$[203] = autoFocus;
-		$[204] = draft;
-		$[205] = effectiveIsInvalid;
-		$[206] = handleInputChange;
-		$[207] = id;
-		$[208] = isDisabled;
-		$[209] = isReadOnly;
-		$[210] = isRequired;
-		$[211] = label;
-		$[212] = otherProps;
-		$[213] = placeholder;
-		$[214] = t40;
-	} else t40 = $[214];
-	const { labelProps, inputProps } = useTextField(t40, inputRef);
+		$[205] = autoFocus;
+		$[206] = draft;
+		$[207] = effectiveIsInvalid;
+		$[208] = handleInputChange;
+		$[209] = id;
+		$[210] = isDisabled;
+		$[211] = isReadOnly;
+		$[212] = isRequired;
+		$[213] = label;
+		$[214] = otherProps;
+		$[215] = placeholder;
+		$[216] = t41;
+	} else t41 = $[216];
+	const { labelProps, inputProps } = useTextField(t41, inputRef);
 	const ariaLabel = props["aria-label"];
 	const ariaLabelledby = props["aria-labelledby"];
 	const labelId = label ? labelProps.id : void 0;
-	let t41;
-	if ($[215] !== ariaLabelledby || $[216] !== labelId) {
-		t41 = [labelId, ariaLabelledby].filter(Boolean).join(" ") || void 0;
-		$[215] = ariaLabelledby;
-		$[216] = labelId;
-		$[217] = t41;
-	} else t41 = $[217];
-	const fieldLabelledby = t41;
+	let t42;
+	if ($[217] !== ariaLabelledby || $[218] !== labelId) {
+		t42 = [labelId, ariaLabelledby].filter(Boolean).join(" ") || void 0;
+		$[217] = ariaLabelledby;
+		$[218] = labelId;
+		$[219] = t42;
+	} else t42 = $[219];
+	const fieldLabelledby = t42;
 	const describedBy = [];
 	if (inputProps["aria-describedby"]) describedBy.push(inputProps["aria-describedby"]);
 	if (tags.length) describedBy.push(summaryId);
@@ -1340,25 +1346,25 @@ function TagInput(props, ref) {
 		"data-input-type": "taginput",
 		"aria-describedby": describedBy.join(" ") || void 0
 	}, hasOptions ? getComboboxProps(listBoxId, shouldShowPopover, activeOptionKey) : void 0);
-	let t42;
-	if ($[218] !== hasResults || $[219] !== inputRef || $[220] !== setIsFilterActive || $[221] !== setIsPopoverOpen || $[222] !== shouldShowPopover) {
-		t42 = () => {
+	let t43;
+	if ($[220] !== hasResults || $[221] !== inputRef || $[222] !== setIsFilterActive || $[223] !== setIsPopoverOpen || $[224] !== shouldShowPopover) {
+		t43 = () => {
 			const willOpen = !shouldShowPopover;
 			if (willOpen && !hasResults) setIsFilterActive(false);
 			setIsPopoverOpen(willOpen);
 			inputRef.current?.focus();
 		};
-		$[218] = hasResults;
-		$[219] = inputRef;
-		$[220] = setIsFilterActive;
-		$[221] = setIsPopoverOpen;
-		$[222] = shouldShowPopover;
-		$[223] = t42;
-	} else t42 = $[223];
-	const handleTriggerPress = useEvent(t42);
-	let t43;
-	if ($[224] !== ariaLabel || $[225] !== fieldLabelledby || $[226] !== handleTriggerPress || $[227] !== hasOptions || $[228] !== hideTrigger || $[229] !== isInteractive || $[230] !== shouldShowPopover || $[231] !== size || $[232] !== triggerId || $[233] !== triggerStyles) {
-		t43 = hasOptions && !hideTrigger ? /* @__PURE__ */ jsx(TagInputTrigger, {
+		$[220] = hasResults;
+		$[221] = inputRef;
+		$[222] = setIsFilterActive;
+		$[223] = setIsPopoverOpen;
+		$[224] = shouldShowPopover;
+		$[225] = t43;
+	} else t43 = $[225];
+	const handleTriggerPress = useEvent(t43);
+	let t44;
+	if ($[226] !== ariaLabel || $[227] !== fieldLabelledby || $[228] !== handleTriggerPress || $[229] !== hasOptions || $[230] !== hideTrigger || $[231] !== isInteractive || $[232] !== shouldShowPopover || $[233] !== size || $[234] !== triggerId || $[235] !== triggerStyles) {
+		t44 = hasOptions && !hideTrigger ? /* @__PURE__ */ jsx(TagInputTrigger, {
 			id: triggerId,
 			size,
 			ariaLabel,
@@ -1368,70 +1374,70 @@ function TagInput(props, ref) {
 			styles: triggerStyles,
 			onPress: handleTriggerPress
 		}) : null;
-		$[224] = ariaLabel;
-		$[225] = fieldLabelledby;
-		$[226] = handleTriggerPress;
-		$[227] = hasOptions;
-		$[228] = hideTrigger;
-		$[229] = isInteractive;
-		$[230] = shouldShowPopover;
-		$[231] = size;
-		$[232] = triggerId;
-		$[233] = triggerStyles;
-		$[234] = t43;
-	} else t43 = $[234];
-	const trigger = t43;
-	let t44;
-	if ($[235] !== inputRef || $[236] !== onClear || $[237] !== setDraft || $[238] !== setIsPopoverOpen || $[239] !== setTagError) {
-		t44 = () => {
+		$[226] = ariaLabel;
+		$[227] = fieldLabelledby;
+		$[228] = handleTriggerPress;
+		$[229] = hasOptions;
+		$[230] = hideTrigger;
+		$[231] = isInteractive;
+		$[232] = shouldShowPopover;
+		$[233] = size;
+		$[234] = triggerId;
+		$[235] = triggerStyles;
+		$[236] = t44;
+	} else t44 = $[236];
+	const trigger = t44;
+	let t45;
+	if ($[237] !== inputRef || $[238] !== onClear || $[239] !== setDraft || $[240] !== setIsPopoverOpen || $[241] !== setTagError) {
+		t45 = () => {
 			inputRef.current?.focus();
 			setDraft("");
 			setTagError(null);
 			setIsPopoverOpen(false);
 			onClear?.();
 		};
-		$[235] = inputRef;
-		$[236] = onClear;
-		$[237] = setDraft;
-		$[238] = setIsPopoverOpen;
-		$[239] = setTagError;
-		$[240] = t44;
-	} else t44 = $[240];
-	const clearText = useEvent(t44);
+		$[237] = inputRef;
+		$[238] = onClear;
+		$[239] = setDraft;
+		$[240] = setIsPopoverOpen;
+		$[241] = setTagError;
+		$[242] = t45;
+	} else t45 = $[242];
+	const clearText = useEvent(t45);
 	const canClear = !!isClearable && isInteractive && draft !== "";
-	let t45;
-	if ($[241] !== ariaLabel || $[242] !== canClear || $[243] !== clearId || $[244] !== clearText || $[245] !== fieldLabelledby || $[246] !== size) {
-		t45 = canClear ? /* @__PURE__ */ jsx(TagInputClearButton, {
+	let t46;
+	if ($[243] !== ariaLabel || $[244] !== canClear || $[245] !== clearId || $[246] !== clearText || $[247] !== fieldLabelledby || $[248] !== size) {
+		t46 = canClear ? /* @__PURE__ */ jsx(TagInputClearButton, {
 			id: clearId,
 			size,
 			ariaLabel,
 			fieldLabelledby,
 			onPress: clearText
 		}) : null;
-		$[241] = ariaLabel;
-		$[242] = canClear;
-		$[243] = clearId;
-		$[244] = clearText;
-		$[245] = fieldLabelledby;
-		$[246] = size;
-		$[247] = t45;
-	} else t45 = $[247];
-	const clearButton = t45;
+		$[243] = ariaLabel;
+		$[244] = canClear;
+		$[245] = clearId;
+		$[246] = clearText;
+		$[247] = fieldLabelledby;
+		$[248] = size;
+		$[249] = t46;
+	} else t46 = $[249];
+	const clearButton = t46;
 	const hasActions = clearButton != null || trigger != null;
 	const T0 = TagInputElement;
-	const t46 = qa || "TagInput";
-	let t47;
-	if ($[248] !== clearButton || $[249] !== hasActions || $[250] !== trigger) {
-		t47 = hasActions ? /* @__PURE__ */ jsxs(Fragment$1, { children: [clearButton, trigger] }) : null;
-		$[248] = clearButton;
-		$[249] = hasActions;
-		$[250] = trigger;
-		$[251] = t47;
-	} else t47 = $[251];
+	const t47 = qa || "TagInput";
 	let t48;
-	if ($[252] !== autoFocus || $[253] !== effectiveIsInvalid || $[254] !== icon || $[255] !== inputRef || $[256] !== inputStyles || $[257] !== isDisabled || $[258] !== isLoading || $[259] !== isValid || $[260] !== mods || $[261] !== prefix || $[262] !== size || $[263] !== suffix || $[264] !== suffixPosition || $[265] !== t46 || $[266] !== t47 || $[267] !== tagInputProps || $[268] !== wrapperRef || $[269] !== wrapperStyles) {
-		t48 = /* @__PURE__ */ jsx(TextInputBase, {
-			qa: t46,
+	if ($[250] !== clearButton || $[251] !== hasActions || $[252] !== trigger) {
+		t48 = hasActions ? /* @__PURE__ */ jsxs(Fragment$1, { children: [clearButton, trigger] }) : null;
+		$[250] = clearButton;
+		$[251] = hasActions;
+		$[252] = trigger;
+		$[253] = t48;
+	} else t48 = $[253];
+	let t49;
+	if ($[254] !== autoFocus || $[255] !== effectiveIsInvalid || $[256] !== icon || $[257] !== inputRef || $[258] !== inputStyles || $[259] !== isDisabled || $[260] !== isLoading || $[261] !== isValid || $[262] !== mods || $[263] !== prefix || $[264] !== size || $[265] !== suffix || $[266] !== suffixPosition || $[267] !== t47 || $[268] !== t48 || $[269] !== tagInputProps || $[270] !== wrapperRef || $[271] !== wrapperStyles) {
+		t49 = /* @__PURE__ */ jsx(TextInputBase, {
+			qa: t47,
 			inputRef,
 			wrapperRef,
 			inputProps: tagInputProps,
@@ -1440,7 +1446,7 @@ function TagInput(props, ref) {
 			prefix,
 			suffix,
 			suffixPosition,
-			actions: t47,
+			actions: t48,
 			size,
 			autoFocus,
 			isDisabled,
@@ -1450,27 +1456,27 @@ function TagInput(props, ref) {
 			styles: wrapperStyles,
 			inputStyles
 		});
-		$[252] = autoFocus;
-		$[253] = effectiveIsInvalid;
-		$[254] = icon;
-		$[255] = inputRef;
-		$[256] = inputStyles;
-		$[257] = isDisabled;
-		$[258] = isLoading;
-		$[259] = isValid;
-		$[260] = mods;
-		$[261] = prefix;
-		$[262] = size;
-		$[263] = suffix;
-		$[264] = suffixPosition;
-		$[265] = t46;
-		$[266] = t47;
-		$[267] = tagInputProps;
-		$[268] = wrapperRef;
-		$[269] = wrapperStyles;
-		$[270] = t48;
-	} else t48 = $[270];
-	const t49 = tags.length ? /* @__PURE__ */ jsx(TagList, {
+		$[254] = autoFocus;
+		$[255] = effectiveIsInvalid;
+		$[256] = icon;
+		$[257] = inputRef;
+		$[258] = inputStyles;
+		$[259] = isDisabled;
+		$[260] = isLoading;
+		$[261] = isValid;
+		$[262] = mods;
+		$[263] = prefix;
+		$[264] = size;
+		$[265] = suffix;
+		$[266] = suffixPosition;
+		$[267] = t47;
+		$[268] = t48;
+		$[269] = tagInputProps;
+		$[270] = wrapperRef;
+		$[271] = wrapperStyles;
+		$[272] = t49;
+	} else t49 = $[272];
+	const t50 = tags.length ? /* @__PURE__ */ jsx(TagList, {
 		id: tagListId,
 		listRef: tagListRef,
 		inputRef,
@@ -1484,50 +1490,50 @@ function TagInput(props, ref) {
 		tagStyles,
 		onRemove: removeValues
 	}) : null;
-	const t50 = true;
-	const t51 = tags.length ? t("tagInput.summary", "Selected: {{values}}.", { values: formatList(tags.map(_temp1)) }) : null;
-	let t52;
-	if ($[271] !== summaryId || $[272] !== t51) {
-		t52 = /* @__PURE__ */ jsx("span", {
-			hidden: t50,
+	const t51 = true;
+	const t52 = tags.length ? t("tagInput.summary", "Selected: {{values}}.", { values: formatList(tags.map(_temp1)) }) : null;
+	let t53;
+	if ($[273] !== summaryId || $[274] !== t52) {
+		t53 = /* @__PURE__ */ jsx("span", {
+			hidden: t51,
 			id: summaryId,
-			children: t51
+			children: t52
 		});
-		$[271] = summaryId;
-		$[272] = t51;
-		$[273] = t52;
-	} else t52 = $[273];
-	let t53;
-	if ($[274] !== hasBackspaceHint || $[275] !== t) {
-		t53 = hasBackspaceHint ? t("tagInput.backspaceHint", "Press Backspace to go to the selected values.") : null;
-		$[274] = hasBackspaceHint;
-		$[275] = t;
-		$[276] = t53;
-	} else t53 = $[276];
+		$[273] = summaryId;
+		$[274] = t52;
+		$[275] = t53;
+	} else t53 = $[275];
 	let t54;
-	if ($[277] !== hintId || $[278] !== t53) {
-		t54 = /* @__PURE__ */ jsx("span", {
+	if ($[276] !== hasBackspaceHint || $[277] !== t) {
+		t54 = hasBackspaceHint ? t("tagInput.backspaceHint", "Press Backspace to go to the selected values.") : null;
+		$[276] = hasBackspaceHint;
+		$[277] = t;
+		$[278] = t54;
+	} else t54 = $[278];
+	let t55;
+	if ($[279] !== hintId || $[280] !== t54) {
+		t55 = /* @__PURE__ */ jsx("span", {
 			hidden: true,
 			id: hintId,
-			children: t53
+			children: t54
 		});
-		$[277] = hintId;
-		$[278] = t53;
-		$[279] = t54;
-	} else t54 = $[279];
-	let t55;
-	if ($[280] !== announcement.id || $[281] !== announcement.text) {
-		t55 = /* @__PURE__ */ jsx(VisuallyHidden, {
+		$[279] = hintId;
+		$[280] = t54;
+		$[281] = t55;
+	} else t55 = $[281];
+	let t56;
+	if ($[282] !== announcement.id || $[283] !== announcement.text) {
+		t56 = /* @__PURE__ */ jsx(VisuallyHidden, {
 			role: "status",
 			"aria-live": "polite",
 			"aria-atomic": "true",
 			children: /* @__PURE__ */ jsx("span", { children: announcement.text }, announcement.id)
 		});
-		$[280] = announcement.id;
-		$[281] = announcement.text;
-		$[282] = t55;
-	} else t55 = $[282];
-	const t56 = hasOptions ? /* @__PURE__ */ jsx(ListBoxPopover, {
+		$[282] = announcement.id;
+		$[283] = announcement.text;
+		$[284] = t56;
+	} else t56 = $[284];
+	const t57 = hasOptions ? /* @__PURE__ */ jsx(ListBoxPopover, {
 		isOpen: shouldShowPopover,
 		triggerRef: wrapperRef,
 		popoverRef,
@@ -1562,9 +1568,9 @@ function TagInput(props, ref) {
 		onClose: () => setIsPopoverOpen(false),
 		children: popoverChildren
 	}) : null;
-	let t57;
-	if ($[283] !== T0 || $[284] !== className || $[285] !== compositeFocusProps || $[286] !== qaVal || $[287] !== rootRef || $[288] !== style || $[289] !== styles || $[290] !== t48 || $[291] !== t49 || $[292] !== t52 || $[293] !== t54 || $[294] !== t55 || $[295] !== t56) {
-		t57 = /* @__PURE__ */ jsxs(T0, {
+	let t58;
+	if ($[285] !== T0 || $[286] !== className || $[287] !== compositeFocusProps || $[288] !== qaVal || $[289] !== rootRef || $[290] !== style || $[291] !== styles || $[292] !== t49 || $[293] !== t50 || $[294] !== t53 || $[295] !== t55 || $[296] !== t56 || $[297] !== t57) {
+		t58 = /* @__PURE__ */ jsxs(T0, {
 			ref: rootRef,
 			className,
 			style,
@@ -1572,44 +1578,44 @@ function TagInput(props, ref) {
 			styles,
 			...compositeFocusProps,
 			children: [
-				t48,
 				t49,
-				t52,
-				t54,
+				t50,
+				t53,
 				t55,
-				t56
+				t56,
+				t57
 			]
 		});
-		$[283] = T0;
-		$[284] = className;
-		$[285] = compositeFocusProps;
-		$[286] = qaVal;
-		$[287] = rootRef;
-		$[288] = style;
-		$[289] = styles;
-		$[290] = t48;
-		$[291] = t49;
-		$[292] = t52;
-		$[293] = t54;
-		$[294] = t55;
-		$[295] = t56;
-		$[296] = t57;
-	} else t57 = $[296];
-	const tagInputField = t57;
+		$[285] = T0;
+		$[286] = className;
+		$[287] = compositeFocusProps;
+		$[288] = qaVal;
+		$[289] = rootRef;
+		$[290] = style;
+		$[291] = styles;
+		$[292] = t49;
+		$[293] = t50;
+		$[294] = t53;
+		$[295] = t55;
+		$[296] = t56;
+		$[297] = t57;
+		$[298] = t58;
+	} else t58 = $[298];
+	const tagInputField = t58;
 	const { children: _children, ...fieldProps } = props;
 	const fieldRef = useCombinedRefs();
-	let t58;
-	if ($[297] !== message || $[298] !== tagError) {
-		t58 = tagError ? /* @__PURE__ */ jsx("span", { children: tagError.text }, tagError.id) : message;
-		$[297] = message;
-		$[298] = tagError;
-		$[299] = t58;
-	} else t58 = $[299];
+	let t59;
+	if ($[299] !== message || $[300] !== tagError) {
+		t59 = tagError ? /* @__PURE__ */ jsx("span", { children: tagError.text }, tagError.id) : message;
+		$[299] = message;
+		$[300] = tagError;
+		$[301] = t59;
+	} else t59 = $[301];
 	return wrapWithField(tagInputField, fieldRef, {
 		...fieldProps,
 		labelProps: mergeProps$1(labelProps, userLabelProps),
 		isInvalid: effectiveIsInvalid,
-		message: t58,
+		message: t59,
 		errorMessage: tagError ? void 0 : errorMessage
 	});
 }