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

package/dist/components/inputs/DateTime/shared/datePickerInput.cva.js

@@ -1,5 +1,6 @@
 import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-var datePickerInputContentRow = UIOverrides.defineConfig({
+//#region src/components/inputs/DateTime/shared/datePickerInput.cva.ts
+var datePickerInputContentRowDefinition = UIOverrides.defineConfig({
 	base: ["flex items-center gap-input-gap-input-text-to-elements"],
 	config: {
 		variants: { size: {
@@ -12,4 +13,4 @@ var datePickerInputContentRow = UIOverrides.defineConfig({
 	}
 });
 //#endregion
-export { datePickerInputContentRow };
+export { datePickerInputContentRowDefinition };

package/dist/components/inputs/FormField/FormFieldHeader.js

@@ -3,7 +3,7 @@ import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { Typography } from "../../text/Typography/Typography.js";
 import { Tooltip as Tooltip$1 } from "../../overlays/Tooltip/Tooltip.js";
 import { FormFieldLabel } from "./FormFieldLabel.js";
-import { formFieldHeader } from "./formFieldHeader.cva.js";
+import { formFieldHeaderDefinition } from "./formFieldHeader.cva.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
@@ -12,7 +12,7 @@ import { Focusable } from "react-aria-components";
 var FormFieldHeader = (t0) => {
 	const $ = c(24);
 	const { label, tooltipText, helperText, isRequired, rightContent, isHeaderHidden, isDisabled, className, labelProps } = t0;
-	const formFieldHeaderCva = UIOverrides.useCva("formField.headerCva", formFieldHeader);
+	const formFieldHeaderCva = UIOverrides.useCva("formField.headerCva", formFieldHeaderDefinition);
 	const t1 = !isHeaderHidden;
 	let t2;
 	if ($[0] !== className || $[1] !== formFieldHeaderCva || $[2] !== t1) {

package/dist/components/inputs/FormField/formFieldHeader.cva.d.ts

@@ -8,15 +8,6 @@ export declare const formFieldHeaderDefinition: {
         };
     }>;
 };
-export declare const formFieldHeader: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly visible: {
-            readonly true: "mb-1";
-            readonly false: "sr-only";
-        };
-    }>;
-};
 export type FormFieldHeaderConfig = NonNullable<typeof formFieldHeaderDefinition.config>;
 export interface FormFieldHeaderVariantProps extends UIOverrides.VariantProps<FormFieldHeaderConfig> {
 }

package/dist/components/inputs/FormField/formFieldHeader.cva.js

@@ -1,5 +1,6 @@
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
-var formFieldHeader = UIOverrides.defineConfig({
+//#region src/components/inputs/FormField/formFieldHeader.cva.ts
+var formFieldHeaderDefinition = UIOverrides.defineConfig({
 	base: [""],
 	config: {
 		variants: { visible: {
@@ -10,4 +11,4 @@ var formFieldHeader = UIOverrides.defineConfig({
 	}
 });
 //#endregion
-export { formFieldHeader };
+export { formFieldHeaderDefinition };

package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js

@@ -2,7 +2,7 @@ import { UIOverrides } from "../../../../config/uiOverrides.context.js";
 import { UIConfig } from "../../../../config/uiConfig.context.js";
 import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
 import { InputClear } from "../../shared/InputClear.js";
-import { inputBase, inputSize } from "../../shared/input.cva.js";
+import { inputBaseDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
 import { InputFrame } from "../../Skeleton/InputFrame.js";
 import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
 import { getStaticNumberDisplayValue } from "../shared/numberStatic.utils.js";
@@ -29,8 +29,8 @@ var normalizeRangeValue = (value, minValue, maxValue) => {
 var NumberRangeInputBase = (props) => {
 	const $ = c(114);
 	const ui = UIConfig.useConfig();
-	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBase);
-	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSize);
+	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
+	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	let asProp;
 	let autoFocusOnMount;
 	let className;
@@ -362,7 +362,7 @@ var NumberRangeInputBase = (props) => {
 var NumberRangeInputInner = (t0) => {
 	const $ = c(5);
 	const { renderStaticInput, isFormControlDisabled, ...props } = t0;
-	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSize);
+	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	const ui = UIConfig.useConfig();
 	const { locale } = useLocale();
 	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));

package/dist/components/inputs/Input/TextArea/TextArea.cva.d.ts

@@ -3,10 +3,6 @@ export declare const textAreaWrapperDefinition: {
     base: string[];
     config?: import("../../../../utils/style-merge.util").StyleMergeUtils.Config<Record<never, never>>;
 };
-export declare const textAreaWrapper: {
-    base: string[];
-    config?: import("../../../../utils/style-merge.util").StyleMergeUtils.Config<Record<never, never>>;
-};
 export type TextAreaWrapperConfig = NonNullable<typeof textAreaWrapperDefinition.config>;
 export interface TextAreaWrapperVariantProps extends UIOverrides.VariantProps<TextAreaWrapperConfig> {
 }

package/dist/components/inputs/Input/TextArea/TextArea.cva.js

@@ -1,4 +1,5 @@
 import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-var textAreaWrapper = UIOverrides.defineConfig({ base: ["group/text-area relative h-full"] });
+//#region src/components/inputs/Input/TextArea/TextArea.cva.ts
+var textAreaWrapperDefinition = UIOverrides.defineConfig({ base: ["group/text-area relative h-full"] });
 //#endregion
-export { textAreaWrapper };
+export { textAreaWrapperDefinition };

package/dist/components/inputs/Input/TextArea/TextArea.js

@@ -5,7 +5,7 @@ import { InputClear } from "../../shared/InputClear.js";
 import { inputSideDefinition, inputSizeDefinition, useInputCva } from "../../shared/input.cva.js";
 import { FormField } from "../../FormField/FormField.js";
 import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
-import { textAreaWrapper } from "./TextArea.cva.js";
+import { textAreaWrapperDefinition } from "./TextArea.cva.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
@@ -21,7 +21,7 @@ var TextAreaBase = (props) => {
 	const inputCva = useInputCva();
 	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	const inputSideCva = UIOverrides.useCva("input.sideCva", inputSideDefinition);
-	const textAreaWrapperCva = UIOverrides.useCva("textArea.wrapperCva", textAreaWrapper);
+	const textAreaWrapperCva = UIOverrides.useCva("textArea.wrapperCva", textAreaWrapperDefinition);
 	const { ref, className, inputClassName, error, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, value, onChange, onBlur, as: asProp, hideLabel: hideLabelProp, variant: variantProp, isClearable: isClearableProp, ...rest } = props;
 	const as = asProp ?? ui.input.as;
 	const hideLabel = hideLabelProp ?? ui.input.hideLabel;

package/dist/components/inputs/Input/shared/InputContent.js

@@ -4,7 +4,7 @@ import { Loader } from "../../../status/Loader/Loader.js";
 import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
 import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
 import { InputClear } from "../../shared/InputClear.js";
-import { inputContentWrapper, inputSizeDefinition } from "../../shared/input.cva.js";
+import { inputContentWrapperDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
@@ -15,7 +15,7 @@ var InputContent = (t0) => {
 	const { leadingIcon: LeadingIcon, trailingIcon: TrailingIcon, unit, isLoading, isDisabled, action, isClearable, value, onChange, onBlur, children, headerProps, as, size } = t0;
 	const typographyCva = UIOverrides.useCva("typography.cva", typographyDefinition);
 	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
-	const inputContentWrapperCva = UIOverrides.useCva("input.contentWrapperCva", inputContentWrapper);
+	const inputContentWrapperCva = UIOverrides.useCva("input.contentWrapperCva", inputContentWrapperDefinition);
 	let t1;
 	if ($[0] !== LeadingIcon) {
 		t1 = LeadingIcon && isValidElement(LeadingIcon);

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/Autocomplete/QueryAutocomplete.js

@@ -1,6 +1,6 @@
 import { UIConfig } from "../../../../config/uiConfig.context.js";
 import { Autocomplete } from "./Autocomplete.js";
-import { getQueryItems, shouldEnableQueryForSelection } from "../shared/querySelect.utils.js";
+import { getQueryItems, getSelectionIdsToResolve } from "../shared/querySelect.utils.js";
 import { useQueryAutocomplete } from "../../../../hooks/useQueryAutocomplete.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
@@ -13,25 +13,28 @@ var QueryAutocompleteContent = ({ query, queryParams, queryOptions, queryMap, le
 	const ui = UIConfig.useConfig();
 	const [search, setSearch] = useState("");
 	const { onChange, ...restProps } = props;
+	const value = "value" in props ? props.value : void 0;
+	const selectedIdsToResolve = getSelectionIdsToResolve({
+		initialSelection: props.initialSelection,
+		value,
+		mapInitialToSelectItem: props.mapInitialToSelectItem
+	});
 	const { items, totalItems, isLoading, handleEnableQuery, hasNextPage, fetchNextPage } = useQueryAutocomplete({
 		query,
 		queryParams,
 		queryOptions,
 		mapItems: (data) => getQueryItems(data, queryMap),
 		search,
-		initialQueryState: shouldEnableQueryForSelection({
-			initialSelection: props.initialSelection,
-			value: "value" in props ? props.value : void 0,
-			mapInitialToSelectItem: props.mapInitialToSelectItem
-		}) ? false : props.isInitialQueryDisabled ?? ui.queryAutocomplete?.isInitialQueryDisabled
+		initialQueryState: selectedIdsToResolve.count > 0 ? false : props.isInitialQueryDisabled ?? ui.queryAutocomplete?.isInitialQueryDisabled,
+		selectedIdsToResolve: selectedIdsToResolve.items
 	});
-	const handleChange = (value) => {
-		onChange?.(value);
+	const handleChange = (value_0) => {
+		onChange?.(value_0);
 		props.onBlur?.({ target: { value: null } });
 	};
 	const { isInitialQueryDisabled: _, ...autocompleteProps } = restProps;
-	const onSearchChange = (value_0) => {
-		setSearch(value_0);
+	const onSearchChange = (value_1) => {
+		setSearch(value_1);
 		handleEnableQuery();
 	};
 	return /* @__PURE__ */ jsx(Autocomplete, {

package/dist/components/inputs/Selection/Autocomplete/queryAutocomplete.types.d.ts

@@ -33,4 +33,5 @@ export interface UseQueryAutocompleteOptions<TQueryFn extends QueryFn, TKey exte
     mapItems: (data: QueryDataType<TQueryFn>) => SelectItem<TKey>[];
     initialQueryState?: boolean;
     search?: string;
+    selectedIdsToResolve?: TKey[];
 }

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

@@ -1,6 +1,6 @@
 import { UIConfig } from "../../../../config/uiConfig.context.js";
 import { Select } from "./Select.js";
-import { getQueryItems, shouldEnableQueryForSelection } from "../shared/querySelect.utils.js";
+import { getQueryItems, getSelectionIdsToResolve } from "../shared/querySelect.utils.js";
 import { useQueryAutocomplete } from "../../../../hooks/useQueryAutocomplete.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
@@ -9,11 +9,18 @@ import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";
 //#region src/components/inputs/Selection/Select/QuerySelect.tsx
 var QuerySelectContent = (t0) => {
-	const $ = c(28);
+	const $ = c(29);
 	const { query, queryParams, queryOptions, queryMap, ...props } = t0;
 	const ui = UIConfig.useConfig();
 	const [search, setSearch] = useState("");
 	const isSearchable = props.isSearchable ?? ui.select.isSearchable;
+	const value = "value" in props ? props.value : void 0;
+	const selectedIdsToResolve = getSelectionIdsToResolve({
+		initialSelection: props.initialSelection,
+		value,
+		mapInitialToSelectItem: props.mapInitialToSelectItem
+	});
+	const shouldEnableInitialQuery = selectedIdsToResolve.count > 0;
 	let t1;
 	if ($[0] !== queryMap) {
 		t1 = (data) => getQueryItems(data, queryMap);
@@ -21,68 +28,66 @@ var QuerySelectContent = (t0) => {
 		$[1] = t1;
 	} else t1 = $[1];
 	const t2 = isSearchable ? search : void 0;
-	const t3 = shouldEnableQueryForSelection({
-		initialSelection: props.initialSelection,
-		value: "value" in props ? props.value : void 0,
-		mapInitialToSelectItem: props.mapInitialToSelectItem
-	}) ? false : props.isInitialQueryDisabled ?? ui.querySelect?.isInitialQueryDisabled;
+	const t3 = shouldEnableInitialQuery ? false : props.isInitialQueryDisabled ?? ui.querySelect?.isInitialQueryDisabled;
 	let t4;
-	if ($[2] !== query || $[3] !== queryOptions || $[4] !== queryParams || $[5] !== t1 || $[6] !== t2 || $[7] !== t3) {
+	if ($[2] !== query || $[3] !== queryOptions || $[4] !== queryParams || $[5] !== selectedIdsToResolve.items || $[6] !== t1 || $[7] !== t2 || $[8] !== t3) {
 		t4 = {
 			query,
 			queryParams,
 			queryOptions,
 			mapItems: t1,
 			search: t2,
-			initialQueryState: t3
+			initialQueryState: t3,
+			selectedIdsToResolve: selectedIdsToResolve.items
 		};
 		$[2] = query;
 		$[3] = queryOptions;
 		$[4] = queryParams;
-		$[5] = t1;
-		$[6] = t2;
-		$[7] = t3;
-		$[8] = t4;
-	} else t4 = $[8];
+		$[5] = selectedIdsToResolve.items;
+		$[6] = t1;
+		$[7] = t2;
+		$[8] = t3;
+		$[9] = t4;
+	} else t4 = $[9];
 	const { items, totalItems, isLoading, handleEnableQuery, hasNextPage, fetchNextPage } = useQueryAutocomplete(t4);
 	let onSearchChange;
 	let selectProps;
-	if ($[9] !== props) {
+	if ($[10] !== props) {
 		const { isInitialQueryDisabled: _, onSearchChange: t5, ...t6 } = props;
 		onSearchChange = t5;
 		selectProps = t6;
-		$[9] = props;
-		$[10] = onSearchChange;
-		$[11] = selectProps;
+		$[10] = props;
+		$[11] = onSearchChange;
+		$[12] = selectProps;
 	} else {
-		onSearchChange = $[10];
-		selectProps = $[11];
+		onSearchChange = $[11];
+		selectProps = $[12];
 	}
 	let t5;
-	if ($[12] !== handleEnableQuery || $[13] !== onSearchChange || $[14] !== setSearch) {
-		t5 = (value) => {
-			setSearch(value);
+	if ($[13] !== handleEnableQuery || $[14] !== onSearchChange || $[15] !== setSearch) {
+		t5 = (value_0) => {
+			setSearch(value_0);
 			handleEnableQuery();
-			onSearchChange?.(value);
+			onSearchChange?.(value_0);
 		};
-		$[12] = handleEnableQuery;
-		$[13] = onSearchChange;
-		$[14] = setSearch;
-		$[15] = t5;
-	} else t5 = $[15];
+		$[13] = handleEnableQuery;
+		$[14] = onSearchChange;
+		$[15] = setSearch;
+		$[16] = t5;
+	} else t5 = $[16];
 	const handleSearchChange = t5;
 	let t6;
-	if ($[16] !== handleSearchChange || $[17] !== isSearchable) {
+	if ($[17] !== handleSearchChange || $[18] !== isSearchable) {
 		t6 = isSearchable && {
 			isClientSearchDisabled: true,
 			onSearchChange: handleSearchChange
 		};
-		$[16] = handleSearchChange;
-		$[17] = isSearchable;
-		$[18] = t6;
-	} else t6 = $[18];
+		$[17] = handleSearchChange;
+		$[18] = isSearchable;
+		$[19] = t6;
+	} else t6 = $[19];
 	let t7;
-	if ($[19] !== fetchNextPage || $[20] !== handleEnableQuery || $[21] !== hasNextPage || $[22] !== isLoading || $[23] !== items || $[24] !== selectProps || $[25] !== t6 || $[26] !== totalItems) {
+	if ($[20] !== fetchNextPage || $[21] !== handleEnableQuery || $[22] !== hasNextPage || $[23] !== isLoading || $[24] !== items || $[25] !== selectProps || $[26] !== t6 || $[27] !== totalItems) {
 		t7 = /* @__PURE__ */ jsx(Select, {
 			...selectProps,
 			items,
@@ -94,16 +99,16 @@ var QuerySelectContent = (t0) => {
 			onFocusCapture: handleEnableQuery,
 			...t6
 		});
-		$[19] = fetchNextPage;
-		$[20] = handleEnableQuery;
-		$[21] = hasNextPage;
-		$[22] = isLoading;
-		$[23] = items;
-		$[24] = selectProps;
-		$[25] = t6;
-		$[26] = totalItems;
-		$[27] = t7;
-	} else t7 = $[27];
+		$[20] = fetchNextPage;
+		$[21] = handleEnableQuery;
+		$[22] = hasNextPage;
+		$[23] = isLoading;
+		$[24] = items;
+		$[25] = selectProps;
+		$[26] = t6;
+		$[27] = totalItems;
+		$[28] = t7;
+	} else t7 = $[28];
 	return t7;
 };
 var QuerySelect = (props) => {

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;