@povio/ui 3.0.0-rc.2 → 3.0.0-rc.3

package/dist/components/inputs/Inputs/InputItem.d.ts

@@ -14,7 +14,7 @@ declare const componentRegistry: {
     readonly passwordInput: <TFieldValues extends import('react-hook-form').FieldValues>(props: import('../Input/PasswordInput/PasswordInput').ControlledPasswordInputProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
     readonly textArea: <TFieldValues extends import('react-hook-form').FieldValues>(props: import('../Input/TextArea/TextArea').ControlledTextAreaProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
     readonly select: typeof Select;
-    readonly querySelect: <TFieldValues extends import('react-hook-form').FieldValues, TQueryFn extends import('../Selection/shared/querySelect.utils').QueryFn, TKey extends import('react-aria').Key = import('react-aria').Key, TInitialSelectItem = import('../../..').DefaultInitialSelectItem<TKey>>(props: import('../Selection/Select/QuerySelect.js').QuerySelectProps<TFieldValues, TQueryFn, TKey, TInitialSelectItem>) => import("react/jsx-runtime").JSX.Element;
+    readonly querySelect: <TFieldValues extends import('react-hook-form').FieldValues, TQueryFn extends import('../Selection/shared/querySelect.utils').QueryFn, TKey extends import('react-aria').Key = import('react-aria').Key, TInitialSelectItem = import('../../..').DefaultInitialSelectItem<TKey>>(props: import('../Selection/Select/QuerySelect').QuerySelectProps<TFieldValues, TQueryFn, TKey, TInitialSelectItem>) => import("react/jsx-runtime").JSX.Element;
     readonly autocomplete: typeof Autocomplete;
     readonly queryAutocomplete: <TFieldValues extends import('react-hook-form').FieldValues, TSelectItem extends import('../../..').SelectItem<any>, TQueryFn extends import('../Selection/Autocomplete/queryAutocomplete.types').QueryFn>(props: import('../Selection/Autocomplete/queryAutocomplete.types').QueryAutocompleteProps<TFieldValues, TSelectItem, TQueryFn>) => import("react/jsx-runtime").JSX.Element;
     readonly segment: <TFieldValues extends import('react-hook-form').FieldValues, TKey extends import('react-aria').Key = import('react-aria').Key>(props: import('../../..').ControlledSegmentProps<TFieldValues, TKey>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/inputs/RadioGroup/RadioGroup.js

@@ -2,9 +2,9 @@ import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { UIConfig } from "../../../config/uiConfig.context.js";
 import { CheckContent } from "../shared/CheckContent.js";
 import { FormFieldLabel } from "../FormField/FormFieldLabel.js";
-import { inputBase, inputSize } from "../shared/input.cva.js";
+import { inputBaseDefinition, inputSizeDefinition } from "../shared/input.cva.js";
 import { FormField } from "../FormField/FormField.js";
-import { radioContentClassName, radioContentRow, radioContentWrapper, radioDefinition, radioIndicatorClass, radioTypography } from "./radio.cva.js";
+import { radioContentClassName, radioContentRowDefinition, radioContentWrapperDefinition, radioDefinition, radioIndicatorClass, radioTypography } from "./radio.cva.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
@@ -18,10 +18,10 @@ var RadioGroupBase = (props) => {
 	const ui = UIConfig.useConfig();
 	const radioCva = UIOverrides.useCva("radio.cva", radioDefinition);
 	const radioTypographyMap = UIOverrides.useMapper("radio.typography", radioTypography);
-	const radioContentWrapperCva = UIOverrides.useCva("radio.contentWrapperCva", radioContentWrapper);
-	const radioContentRowCva = UIOverrides.useCva("radio.contentRowCva", radioContentRow);
-	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBase);
-	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSize);
+	const radioContentWrapperCva = UIOverrides.useCva("radio.contentWrapperCva", radioContentWrapperDefinition);
+	const radioContentRowCva = UIOverrides.useCva("radio.contentRowCva", radioContentRowDefinition);
+	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
+	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	const radioContentClassNameMap = UIOverrides.useMapper("radio.contentClassName", radioContentClassName);
 	const { ref, label, tooltipText, helperText, isDirty, isRequired, rightContent, isDisabled, headerClassName, errorClassName, labelClassName, inputClassName, isHeaderHidden, error, className, options, value, defaultValue, onChange, onBlur, fireBlurOnChange: fireBlurOnChangeProp, as: asProp, size: sizeProp, variant: variantProp, hideLabel: hideLabelProp, ...rest } = props;
 	const as = asProp ?? ui.input.as;

package/dist/components/inputs/RadioGroup/radio.cva.d.ts

@@ -11,14 +11,6 @@ export declare const radioDefinition: {
 export type RadioConfig = NonNullable<typeof radioDefinition.config>;
 export interface RadioVariantProps extends UIOverrides.VariantProps<RadioConfig> {
 }
-export declare const radio: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly variant: {
-            readonly default: ["border-interactive-outlined-secondary-on-idle", "group-disabled:border-interactive-outlined-secondary-on-disabled", "group-hover:border-interactive-outlined-secondary-on-hover", "group-pressed:border-interactive-outlined-secondary-on-pressed", "group-selected:border-interactive-contained-primary-idle", "group-selected:bg-interactive-contained-primary-idle", "group-selected:group-disabled:bg-interactive-contained-primary-disabled", "group-selected:group-disabled:border-interactive-contained-primary-disabled", "group-invalid:border-interactive-outlined-error-on-idle", "group-focus-visible:outline-interactive-contained-primary-focus", "before:bg-interactive-contained-primary-on-idle", "group-hover:before:bg-interactive-contained-primary-on-hover", "group-selected:before:block"];
-        };
-    }>;
-};
 export declare const radioContentWrapperDefinition: {
     base: string[];
     config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
@@ -37,24 +29,6 @@ export declare const radioContentWrapperDefinition: {
         };
     }>;
 };
-export declare const radioContentWrapper: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly variant: {
-            readonly default: "";
-        };
-        readonly as: {
-            readonly default: "flex-col";
-            readonly floating: "flex-col";
-            readonly filter: "flex-row flex-wrap items-center gap-2";
-            readonly inline: "flex-row flex-wrap items-center gap-2";
-        };
-        readonly hasInputFrame: {
-            readonly true: "gap-2";
-            readonly false: "";
-        };
-    }>;
-};
 export type RadioContentWrapperConfig = NonNullable<typeof radioContentWrapperDefinition.config>;
 export interface RadioContentWrapperVariantProps extends UIOverrides.VariantProps<RadioContentWrapperConfig> {
 }
@@ -76,24 +50,6 @@ export declare const radioContentRowDefinition: {
         };
     }>;
 };
-export declare const radioContentRow: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly variant: {
-            readonly default: "";
-        };
-        readonly as: {
-            readonly default: "flex-col";
-            readonly floating: "flex-col";
-            readonly filter: "flex-row flex-wrap items-center gap-2";
-            readonly inline: "flex-row flex-wrap items-center gap-2";
-        };
-        readonly hasInputFrame: {
-            readonly true: "gap-2";
-            readonly false: "";
-        };
-    }>;
-};
 export type RadioContentRowConfig = NonNullable<typeof radioContentRowDefinition.config>;
 export interface RadioContentRowVariantProps extends UIOverrides.VariantProps<RadioContentRowConfig> {
 }

package/dist/components/inputs/RadioGroup/radio.cva.js

@@ -28,7 +28,7 @@ var radioDefinition = UIOverrides.defineConfig({
 		defaultVariants: { variant: "default" }
 	}
 });
-var radioContentWrapper = UIOverrides.defineConfig({
+var radioContentWrapperDefinition = UIOverrides.defineConfig({
 	base: ["relative flex"],
 	config: {
 		variants: {
@@ -51,7 +51,7 @@ var radioContentWrapper = UIOverrides.defineConfig({
 		}
 	}
 });
-var radioContentRow = UIOverrides.defineConfig({
+var radioContentRowDefinition = UIOverrides.defineConfig({
 	base: ["flex"],
 	config: {
 		variants: {
@@ -82,4 +82,4 @@ var radioTypography = compoundMapper({ default: {
 } });
 var radioContentClassName = compoundMapper({ default: "text-text-default-2" });
 //#endregion
-export { radioContentClassName, radioContentRow, radioContentWrapper, radioDefinition, radioIndicatorClass, radioTypography };
+export { radioContentClassName, radioContentRowDefinition, radioContentWrapperDefinition, radioDefinition, radioIndicatorClass, radioTypography };

package/dist/components/inputs/Selection/Autocomplete/Autocomplete.js

@@ -1,7 +1,8 @@
+import { UIOverrides } from "../../../../config/uiOverrides.context.js";
 import { UIConfig } from "../../../../config/uiConfig.context.js";
 import { InputFrame } from "../../Skeleton/InputFrame.js";
 import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
-import { selectInputTagsContentWrapperCva } from "../shared/selectInput.cva.js";
+import { selectInputTagsContentWrapperDefinition } from "../shared/selectInput.cva.js";
 import { SelectBase } from "../shared/SelectBase.js";
 import { StaticSelectTrailingContent } from "../shared/StaticSelectTrailingContent.js";
 import { getStaticSelectValue } from "../shared/staticSelect.utils.js";
@@ -13,9 +14,10 @@ import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";
 //#region src/components/inputs/Selection/Autocomplete/Autocomplete.tsx
 function AutocompleteInner(t0) {
-	const $ = c(7);
+	const $ = c(8);
 	const { renderStaticInput, isFormControlDisabled, ...props } = t0;
 	const ui = UIConfig.useConfig();
+	const selectInputTagsContentWrapperCva = UIOverrides.useCva("select.tagsContentWrapperCva", selectInputTagsContentWrapperDefinition);
 	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
 	const rootRef = useRef(null);
 	let t1;
@@ -74,10 +76,11 @@ function AutocompleteInner(t0) {
 		const t3 = clsx("w-full", props.containerClassName);
 		const t4 = clsx(props.className, props.inputClassName);
 		let t5;
-		if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		if ($[2] !== selectInputTagsContentWrapperCva) {
 			t5 = selectInputTagsContentWrapperCva({ isSearchable: true });
-			$[2] = t5;
-		} else t5 = $[2];
+			$[2] = selectInputTagsContentWrapperCva;
+			$[3] = t5;
+		} else t5 = $[3];
 		return /* @__PURE__ */ jsx(InputFrame, {
 			...props,
 			isDisabled: t2,
@@ -115,17 +118,17 @@ function AutocompleteInner(t0) {
 	const T0 = SelectBase;
 	const t2 = mergeRefs(props.ref, rootRef);
 	let t3;
-	if ($[3] !== T0 || $[4] !== props || $[5] !== t2) {
+	if ($[4] !== T0 || $[5] !== props || $[6] !== t2) {
 		t3 = /* @__PURE__ */ jsx(T0, {
 			...props,
 			ref: t2,
 			isSearchable: true
 		});
-		$[3] = T0;
-		$[4] = props;
-		$[5] = t2;
-		$[6] = t3;
-	} else t3 = $[6];
+		$[4] = T0;
+		$[5] = props;
+		$[6] = t2;
+		$[7] = t3;
+	} else t3 = $[7];
 	return t3;
 }
 function _temp(root) {

package/dist/components/inputs/Selection/Select/Select.js

@@ -1,8 +1,9 @@
+import { UIOverrides } from "../../../../config/uiOverrides.context.js";
 import { Typography } from "../../../text/Typography/Typography.js";
 import { UIConfig } from "../../../../config/uiConfig.context.js";
 import { InputFrame } from "../../Skeleton/InputFrame.js";
 import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
-import { selectInputTagsContentWrapperCva } from "../shared/selectInput.cva.js";
+import { selectInputTagsContentWrapperDefinition } from "../shared/selectInput.cva.js";
 import { SelectBase } from "../shared/SelectBase.js";
 import { StaticSelectTrailingContent } from "../shared/StaticSelectTrailingContent.js";
 import { getStaticSelectValue } from "../shared/staticSelect.utils.js";
@@ -17,6 +18,7 @@ function SelectInner(t0) {
 	const $ = c(6);
 	const { renderStaticInput, isFormControlDisabled, ...props } = t0;
 	const ui = UIConfig.useConfig();
+	const selectInputTagsContentWrapperCva = UIOverrides.useCva("select.tagsContentWrapperCva", selectInputTagsContentWrapperDefinition);
 	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
 	const rootRef = useRef(null);
 	let t1;

package/dist/components/inputs/Selection/shared/SelectDesktop.js

@@ -6,7 +6,7 @@ import "./useSelectItems.js";
 import { SelectContext } from "./select.context.js";
 import { SelectInput } from "./SelectInput.js";
 import { SelectListBox } from "./SelectListBox.js";
-import { selectPopoverCva } from "./selectDesktop.cva.js";
+import { selectPopoverDefinition } from "./selectDesktop.cva.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
@@ -63,7 +63,7 @@ var SelectDesktop = (t0) => {
 	}
 	const { label, tooltipText, helperText, isDirty, isRequired, rightContent, isHeaderHidden, headerClassName, errorClassName, placeholder, variant, isDisabled, className, hideLabel, hideDropdownIcon, isSearchable, isClearable, isLoading, as, size, collapseAfter, selectedTagsType } = props;
 	const popoverCva = UIOverrides.useCva("popover.cva", popoverDefinition);
-	const selectPopoverCva$1 = UIOverrides.useCva("select.popoverCva", selectPopoverCva);
+	const selectPopoverCva = UIOverrides.useCva("select.popoverCva", selectPopoverDefinition);
 	const t1 = isHeaderHidden || as === "inline" || as === "filter" || as === "floating";
 	let t2;
 	if ($[14] !== error || $[15] !== errorClassName || $[16] !== headerClassName || $[17] !== helperText || $[18] !== hideLabel || $[19] !== isDisabled || $[20] !== isRequired || $[21] !== label || $[22] !== rightContent || $[23] !== t1 || $[24] !== tooltipText) {
@@ -342,12 +342,12 @@ var SelectDesktop = (t0) => {
 		$[102] = t21;
 	} else t21 = $[102];
 	let t22;
-	if ($[103] !== ignoreTriggerWidth || $[104] !== isOpen || $[105] !== isSearchable || $[106] !== popoverCva || $[107] !== popoverWidth || $[108] !== props || $[109] !== selectPopoverCva$1 || $[110] !== setIsOpen || $[111] !== showPopover) {
+	if ($[103] !== ignoreTriggerWidth || $[104] !== isOpen || $[105] !== isSearchable || $[106] !== popoverCva || $[107] !== popoverWidth || $[108] !== props || $[109] !== selectPopoverCva || $[110] !== setIsOpen || $[111] !== showPopover) {
 		t22 = (!isSearchable || showPopover) && /* @__PURE__ */ jsx(Popover, {
 			triggerRef,
 			isOpen,
 			onOpenChange: setIsOpen,
-			className: selectPopoverCva$1({}),
+			className: selectPopoverCva({}),
 			style: { width: !ignoreTriggerWidth ? popoverWidth : void 0 },
 			offset: 0,
 			children: /* @__PURE__ */ jsx(SelectListBox, {
@@ -362,7 +362,7 @@ var SelectDesktop = (t0) => {
 		$[106] = popoverCva;
 		$[107] = popoverWidth;
 		$[108] = props;
-		$[109] = selectPopoverCva$1;
+		$[109] = selectPopoverCva;
 		$[110] = setIsOpen;
 		$[111] = showPopover;
 		$[112] = t22;

package/dist/components/inputs/Selection/shared/SelectInput.js

@@ -4,10 +4,10 @@ import { Typography } from "../../../text/Typography/Typography.js";
 import "../../../../config/i18n.js";
 import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
 import { InputClear } from "../../shared/InputClear.js";
-import { inputBaseDefinition, inputClearClass, inputSizeDefinition } from "../../shared/input.cva.js";
+import { inputBaseDefinition, inputClearClassDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
 import { SelectInputTags } from "./SelectInputTags.js";
 import { SelectContext } from "./select.context.js";
-import { selectInputTagsContentWrapperCva } from "./selectInput.cva.js";
+import { selectInputTagsContentWrapperDefinition } from "./selectInput.cva.js";
 import { useKeyInteractions } from "../../../../hooks/useKeyInteractions.js";
 import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -18,11 +18,12 @@ import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/Selection/shared/SelectInput.tsx
 var SelectInput = (t0) => {
-	const $0 = c(123);
+	const $0 = c(124);
 	const { ref, placeholder, variant, as, size, isDisabled, isInvalid, className, hideDropdownIcon, isSearchable, isClearable, showSelectionContent, inputClassName, fieldProps, headerProps, selectedTagsType, collapseAfter, isRequired, isDirty, onCloseComboBox, onBlur, leadingContent, trailingContent, onMouseEnter, onFocusCapture, ...props } = t0;
 	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
-	const inputClearClassCva = UIOverrides.useCva("input.clearClassCva", inputClearClass);
+	const inputClearClassCva = UIOverrides.useCva("input.clearClassCva", inputClearClassDefinition);
+	const selectInputTagsContentWrapperCva = UIOverrides.useCva("select.tagsContentWrapperCva", selectInputTagsContentWrapperDefinition);
 	const { t } = useTranslation("ui");
 	const state = use(ComboBoxStateContext);
 	let t1;
@@ -227,7 +228,7 @@ var SelectInput = (t0) => {
 		$0[43] = t35;
 	} else t35 = $0[43];
 	let t36;
-	if ($0[44] !== as || $0[45] !== collapseAfter || $0[46] !== fieldProps || $0[47] !== inputClassName || $0[48] !== isDisabled || $0[49] !== isSearchable || $0[50] !== onBlur || $0[51] !== onKeyDown || $0[52] !== onRemove || $0[53] !== placeholder || $0[54] !== selectedItems || $0[55] !== selectedTagsType || $0[56] !== showTags) {
+	if ($0[44] !== as || $0[45] !== collapseAfter || $0[46] !== fieldProps || $0[47] !== inputClassName || $0[48] !== isDisabled || $0[49] !== isSearchable || $0[50] !== onBlur || $0[51] !== onKeyDown || $0[52] !== onRemove || $0[53] !== placeholder || $0[54] !== selectInputTagsContentWrapperCva || $0[55] !== selectedItems || $0[56] !== selectedTagsType || $0[57] !== showTags) {
 		t36 = (showTags || isSearchable) && /* @__PURE__ */ jsxs("div", {
 			className: selectInputTagsContentWrapperCva({ isSearchable }),
 			children: [showTags && /* @__PURE__ */ jsx(SelectInputTags, {
@@ -255,13 +256,14 @@ var SelectInput = (t0) => {
 		$0[51] = onKeyDown;
 		$0[52] = onRemove;
 		$0[53] = placeholder;
-		$0[54] = selectedItems;
-		$0[55] = selectedTagsType;
-		$0[56] = showTags;
-		$0[57] = t36;
-	} else t36 = $0[57];
+		$0[54] = selectInputTagsContentWrapperCva;
+		$0[55] = selectedItems;
+		$0[56] = selectedTagsType;
+		$0[57] = showTags;
+		$0[58] = t36;
+	} else t36 = $0[58];
 	let t37;
-	if ($0[58] !== as || $0[59] !== fieldProps || $0[60] !== isDisabled || $0[61] !== isEmpty || $0[62] !== isMultiple || $0[63] !== isOpen || $0[64] !== isSearchable || $0[65] !== onBlur || $0[66] !== onTriggerKeyDown || $0[67] !== placeholder || $0[68] !== selectedItems[0] || $0[69] !== setIsOpen || $0[70] !== showSelectionContent || $0[71] !== showTags) {
+	if ($0[59] !== as || $0[60] !== fieldProps || $0[61] !== isDisabled || $0[62] !== isEmpty || $0[63] !== isMultiple || $0[64] !== isOpen || $0[65] !== isSearchable || $0[66] !== onBlur || $0[67] !== onTriggerKeyDown || $0[68] !== placeholder || $0[69] !== selectedItems[0] || $0[70] !== setIsOpen || $0[71] !== showSelectionContent || $0[72] !== showTags) {
 		t37 = !isSearchable && /* @__PURE__ */ jsxs(Button, {
 			isDisabled,
 			onPress: () => setIsOpen(!isOpen),
@@ -276,24 +278,24 @@ var SelectInput = (t0) => {
 				children: [isEmpty && placeholder, !isEmpty && (showSelectionContent ? selectedItems[0].content : selectedItems[0].label)]
 			})]
 		});
-		$0[58] = as;
-		$0[59] = fieldProps;
-		$0[60] = isDisabled;
-		$0[61] = isEmpty;
-		$0[62] = isMultiple;
-		$0[63] = isOpen;
-		$0[64] = isSearchable;
-		$0[65] = onBlur;
-		$0[66] = onTriggerKeyDown;
-		$0[67] = placeholder;
-		$0[68] = selectedItems[0];
-		$0[69] = setIsOpen;
-		$0[70] = showSelectionContent;
-		$0[71] = showTags;
-		$0[72] = t37;
-	} else t37 = $0[72];
+		$0[59] = as;
+		$0[60] = fieldProps;
+		$0[61] = isDisabled;
+		$0[62] = isEmpty;
+		$0[63] = isMultiple;
+		$0[64] = isOpen;
+		$0[65] = isSearchable;
+		$0[66] = onBlur;
+		$0[67] = onTriggerKeyDown;
+		$0[68] = placeholder;
+		$0[69] = selectedItems[0];
+		$0[70] = setIsOpen;
+		$0[71] = showSelectionContent;
+		$0[72] = showTags;
+		$0[73] = t37;
+	} else t37 = $0[73];
 	let t38;
-	if ($0[73] !== onClick || $0[74] !== t33 || $0[75] !== t34 || $0[76] !== t35 || $0[77] !== t36 || $0[78] !== t37) {
+	if ($0[74] !== onClick || $0[75] !== t33 || $0[76] !== t34 || $0[77] !== t35 || $0[78] !== t36 || $0[79] !== t37) {
 		t38 = /* @__PURE__ */ jsxs("div", {
 			className: t33,
 			onClick,
@@ -304,16 +306,16 @@ var SelectInput = (t0) => {
 				t37
 			]
 		});
-		$0[73] = onClick;
-		$0[74] = t33;
-		$0[75] = t34;
-		$0[76] = t35;
-		$0[77] = t36;
-		$0[78] = t37;
-		$0[79] = t38;
-	} else t38 = $0[79];
+		$0[74] = onClick;
+		$0[75] = t33;
+		$0[76] = t34;
+		$0[77] = t35;
+		$0[78] = t36;
+		$0[79] = t37;
+		$0[80] = t38;
+	} else t38 = $0[80];
 	let t39;
-	if ($0[80] !== as || $0[81] !== inputClearClassCva || $0[82] !== isClearable || $0[83] !== isDisabled || $0[84] !== onClear || $0[85] !== showClearButton) {
+	if ($0[81] !== as || $0[82] !== inputClearClassCva || $0[83] !== isClearable || $0[84] !== isDisabled || $0[85] !== onClear || $0[86] !== showClearButton) {
 		t39 = isClearable && !isDisabled && /* @__PURE__ */ jsx(InputClear, {
 			onClear: () => {
 				onClear();
@@ -321,25 +323,25 @@ var SelectInput = (t0) => {
 			className: inputClearClassCva({ as }),
 			show: showClearButton
 		});
-		$0[80] = as;
-		$0[81] = inputClearClassCva;
-		$0[82] = isClearable;
-		$0[83] = isDisabled;
-		$0[84] = onClear;
-		$0[85] = showClearButton;
-		$0[86] = t39;
-	} else t39 = $0[86];
+		$0[81] = as;
+		$0[82] = inputClearClassCva;
+		$0[83] = isClearable;
+		$0[84] = isDisabled;
+		$0[85] = onClear;
+		$0[86] = showClearButton;
+		$0[87] = t39;
+	} else t39 = $0[87];
 	let t40;
-	if ($0[87] !== trailingContent) {
+	if ($0[88] !== trailingContent) {
 		t40 = trailingContent && /* @__PURE__ */ jsx("div", {
 			className: "flex shrink-0 items-center",
 			children: trailingContent
 		});
-		$0[87] = trailingContent;
-		$0[88] = t40;
-	} else t40 = $0[88];
+		$0[88] = trailingContent;
+		$0[89] = t40;
+	} else t40 = $0[89];
 	let t41;
-	if ($0[89] !== hideDropdownIcon || $0[90] !== inputSizeCva || $0[91] !== isDisabled || $0[92] !== isOpen || $0[93] !== isSearchable || $0[94] !== setIsOpen || $0[95] !== size || $0[96] !== t) {
+	if ($0[90] !== hideDropdownIcon || $0[91] !== inputSizeCva || $0[92] !== isDisabled || $0[93] !== isOpen || $0[94] !== isSearchable || $0[95] !== setIsOpen || $0[96] !== size || $0[97] !== t) {
 		t41 = !hideDropdownIcon && /* @__PURE__ */ jsx(Button, {
 			excludeFromTabOrder: true,
 			"aria-label": t(($) => isOpen ? $.ui.closeAlt : $.ui.openAlt),
@@ -353,18 +355,18 @@ var SelectInput = (t0) => {
 				"aria-hidden": "true"
 			})
 		});
-		$0[89] = hideDropdownIcon;
-		$0[90] = inputSizeCva;
-		$0[91] = isDisabled;
-		$0[92] = isOpen;
-		$0[93] = isSearchable;
-		$0[94] = setIsOpen;
-		$0[95] = size;
-		$0[96] = t;
-		$0[97] = t41;
-	} else t41 = $0[97];
+		$0[90] = hideDropdownIcon;
+		$0[91] = inputSizeCva;
+		$0[92] = isDisabled;
+		$0[93] = isOpen;
+		$0[94] = isSearchable;
+		$0[95] = setIsOpen;
+		$0[96] = size;
+		$0[97] = t;
+		$0[98] = t41;
+	} else t41 = $0[98];
 	let t42;
-	if ($0[98] !== focusWithinProps || $0[99] !== hoverProps || $0[100] !== onFocusCapture || $0[101] !== onMouseEnter || $0[102] !== ref || $0[103] !== t16 || $0[104] !== t18 || $0[105] !== t19 || $0[106] !== t20 || $0[107] !== t21 || $0[108] !== t22 || $0[109] !== t23 || $0[110] !== t24 || $0[111] !== t25 || $0[112] !== t26 || $0[113] !== t27 || $0[114] !== t28 || $0[115] !== t29 || $0[116] !== t30 || $0[117] !== t31 || $0[118] !== t38 || $0[119] !== t39 || $0[120] !== t40 || $0[121] !== t41) {
+	if ($0[99] !== focusWithinProps || $0[100] !== hoverProps || $0[101] !== onFocusCapture || $0[102] !== onMouseEnter || $0[103] !== ref || $0[104] !== t16 || $0[105] !== t18 || $0[106] !== t19 || $0[107] !== t20 || $0[108] !== t21 || $0[109] !== t22 || $0[110] !== t23 || $0[111] !== t24 || $0[112] !== t25 || $0[113] !== t26 || $0[114] !== t27 || $0[115] !== t28 || $0[116] !== t29 || $0[117] !== t30 || $0[118] !== t31 || $0[119] !== t38 || $0[120] !== t39 || $0[121] !== t40 || $0[122] !== t41) {
 		t42 = /* @__PURE__ */ jsxs("div", {
 			ref,
 			className: t16,
@@ -395,32 +397,32 @@ var SelectInput = (t0) => {
 				t41
 			]
 		});
-		$0[98] = focusWithinProps;
-		$0[99] = hoverProps;
-		$0[100] = onFocusCapture;
-		$0[101] = onMouseEnter;
-		$0[102] = ref;
-		$0[103] = t16;
-		$0[104] = t18;
-		$0[105] = t19;
-		$0[106] = t20;
-		$0[107] = t21;
-		$0[108] = t22;
-		$0[109] = t23;
-		$0[110] = t24;
-		$0[111] = t25;
-		$0[112] = t26;
-		$0[113] = t27;
-		$0[114] = t28;
-		$0[115] = t29;
-		$0[116] = t30;
-		$0[117] = t31;
-		$0[118] = t38;
-		$0[119] = t39;
-		$0[120] = t40;
-		$0[121] = t41;
-		$0[122] = t42;
-	} else t42 = $0[122];
+		$0[99] = focusWithinProps;
+		$0[100] = hoverProps;
+		$0[101] = onFocusCapture;
+		$0[102] = onMouseEnter;
+		$0[103] = ref;
+		$0[104] = t16;
+		$0[105] = t18;
+		$0[106] = t19;
+		$0[107] = t20;
+		$0[108] = t21;
+		$0[109] = t22;
+		$0[110] = t23;
+		$0[111] = t24;
+		$0[112] = t25;
+		$0[113] = t26;
+		$0[114] = t27;
+		$0[115] = t28;
+		$0[116] = t29;
+		$0[117] = t30;
+		$0[118] = t31;
+		$0[119] = t38;
+		$0[120] = t39;
+		$0[121] = t40;
+		$0[122] = t41;
+		$0[123] = t42;
+	} else t42 = $0[123];
 	return t42;
 };
 //#endregion

package/dist/components/inputs/Selection/shared/StaticSelectTrailingContent.js

@@ -1,6 +1,6 @@
 import { ArrowDropDownIcon } from "../../../../assets/icons/ArrowDropDown.js";
 import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-import { inputSize } from "../../shared/input.cva.js";
+import { inputSizeDefinition } from "../../shared/input.cva.js";
 import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
@@ -8,7 +8,7 @@ import { clsx } from "clsx";
 var StaticSelectTrailingContent = (t0) => {
 	const $ = c(10);
 	const { trailingContent, hideDropdownIcon, isDisabled, size } = t0;
-	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSize);
+	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	if (!trailingContent && hideDropdownIcon) return null;
 	let t1;
 	if ($[0] !== trailingContent) {

package/dist/components/inputs/Selection/shared/selectDesktop.cva.d.ts

@@ -3,8 +3,4 @@ export declare const selectPopoverDefinition: {
     base: string[];
     config?: import("../../../../utils/style-merge.util").StyleMergeUtils.Config<Record<never, never>>;
 };
-export declare const selectPopoverCva: {
-    base: string[];
-    config?: import("../../../../utils/style-merge.util").StyleMergeUtils.Config<Record<never, never>>;
-};
 export type SelectPopoverCva = UIOverrides.VariantProps<NonNullable<typeof selectPopoverDefinition.config>>;

package/dist/components/inputs/Selection/shared/selectDesktop.cva.js

@@ -1,4 +1,5 @@
 import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-var selectPopoverCva = UIOverrides.defineConfig({ base: ["my-4 outline-none"] });
+//#region src/components/inputs/Selection/shared/selectDesktop.cva.ts
+var selectPopoverDefinition = UIOverrides.defineConfig({ base: ["my-4 outline-none"] });
 //#endregion
-export { selectPopoverCva };
+export { selectPopoverDefinition };

package/dist/components/inputs/Selection/shared/selectInput.cva.d.ts

@@ -1,5 +1,12 @@
-import { VariantProps } from 'class-variance-authority';
-export declare const selectInputTagsContentWrapperCva: (props?: ({
-    isSearchable?: boolean | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export type SelectInputTagsContentWrapperCva = VariantProps<typeof selectInputTagsContentWrapperCva>;
+import { UIOverrides } from '../../../../config/uiOverrides.context';
+export declare const selectInputTagsContentWrapperDefinition: {
+    base: string[];
+    config: import("../../../../utils/style-merge.util").StyleMergeUtils.Config<{
+        readonly isSearchable: {
+            readonly false: "pointer-events-none z-1";
+        };
+    }>;
+};
+export type SelectInputTagsContentWrapperConfig = NonNullable<typeof selectInputTagsContentWrapperDefinition.config>;
+export interface SelectInputTagsContentWrapperVariantProps extends UIOverrides.VariantProps<SelectInputTagsContentWrapperConfig> {
+}

package/dist/components/inputs/Selection/shared/selectInput.cva.js

@@ -1,5 +1,8 @@
-import { cva } from "class-variance-authority";
+import { UIOverrides } from "../../../../config/uiOverrides.context.js";
 //#region src/components/inputs/Selection/shared/selectInput.cva.ts
-var selectInputTagsContentWrapperCva = cva("flex flex-1 flex-wrap gap-input-gap-input-text-to-elements truncate", { variants: { isSearchable: { false: "pointer-events-none z-1" } } });
+var selectInputTagsContentWrapperDefinition = UIOverrides.defineConfig({
+	base: ["flex flex-1 flex-wrap gap-input-gap-input-text-to-elements truncate"],
+	config: { variants: { isSearchable: { false: "pointer-events-none z-1" } } }
+});
 //#endregion
-export { selectInputTagsContentWrapperCva };
+export { selectInputTagsContentWrapperDefinition };

package/dist/components/inputs/Selection/shared/staticSelect.utils.js

@@ -1,6 +1,24 @@
 import { SelectInputTags } from "./SelectInputTags.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/inputs/Selection/shared/staticSelect.utils.tsx
+var getStaticMultipleDisplayValue = ({ selectedItems, isDisabled, collapseAfter, selectedTagsType }) => {
+	if (selectedItems.length === 0) return "";
+	return /* @__PURE__ */ jsx(SelectInputTags, {
+		selectedItems,
+		isDisabled,
+		collapseAfter,
+		selectedTagsType,
+		onRemove: () => void 0
+	});
+};
+var getStaticSingleDisplayValue = ({ selectedItem, showSelectionContent }) => {
+	if (!selectedItem) return "";
+	if (showSelectionContent && selectedItem.content) return selectedItem.content;
+	return /* @__PURE__ */ jsx("div", {
+		className: "min-w-0 flex-1 truncate",
+		children: selectedItem.label
+	});
+};
 var getStaticSelectValue = ({ items, value, selectionMode, initialSelection, mapInitialToSelectItem = ((item) => ({
 	id: item.id,
 	label: item.label ?? item.name ?? ""
@@ -14,22 +32,21 @@ var getStaticSelectValue = ({ items, value, selectionMode, initialSelection, map
 	if (selectionMode === "multiple") return {
 		selectedItem,
 		selectedItems,
-		displayValue: selectedItems.length > 0 ? /* @__PURE__ */ jsx(SelectInputTags, {
+		displayValue: getStaticMultipleDisplayValue({
 			selectedItems,
 			isDisabled,
 			collapseAfter,
-			selectedTagsType,
-			onRemove: () => void 0
-		}) : "",
+			selectedTagsType
+		}),
 		isEmpty: selectedItems.length === 0
 	};
 	return {
 		selectedItem,
 		selectedItems,
-		displayValue: selectedItem != null ? showSelectionContent && selectedItem.content ? selectedItem.content : /* @__PURE__ */ jsx("div", {
-			className: "min-w-0 flex-1 truncate",
-			children: selectedItem.label
-		}) : "",
+		displayValue: getStaticSingleDisplayValue({
+			selectedItem,
+			showSelectionContent
+		}),
 		isEmpty: selectedItem == null
 	};
 };