@povio/ui 2.3.1 → 2.3.2-rc.1

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

@@ -13,8 +13,8 @@ import { useRef } from "react";
 import { DialogTrigger } from "react-aria-components";
 import { useLabel } from "react-aria";
 //#region src/components/inputs/Selection/shared/SelectMobile.tsx
-var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containerClassName, customTrigger, onBlur, ...props }) => {
-	const { label, tooltipText, helperText, isRequired, rightContent, isHeaderHidden, headerClassName, errorClassName, placeholder, variant, isDisabled, className, hideLabel, hideDropdownIcon, hideSearchIcon, isSearchable, isClearable, as, size, collapseAfter, selectedTagsType } = props;
+var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containerClassName, leadingContent, trailingContent, customTrigger, onBlur, onMouseEnter, onFocusCapture, ...props }) => {
+	const { label, tooltipText, helperText, isDirty, isRequired, rightContent, isHeaderHidden, headerClassName, errorClassName, placeholder, variant, isDisabled, className, hideLabel, hideDropdownIcon, hideSearchIcon, isSearchable, isClearable, as, size, collapseAfter, selectedTagsType } = props;
 	const formFieldProps = {
 		error,
 		label,
@@ -56,7 +56,9 @@ var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containe
 		...formFieldProps,
 		as,
 		labelProps,
-		className: clsx("w-full", containerClassName),
+		className: clsx("group w-full", containerClassName),
+		onMouseEnter,
+		onFocusCapture,
 		children: /* @__PURE__ */ jsxs(DialogTrigger, {
 			...dialogTriggerProps,
 			children: [customTrigger ? /* @__PURE__ */ jsx("div", {
@@ -79,8 +81,12 @@ var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containe
 				onBlur: void 0,
 				fieldProps,
 				headerProps,
+				leadingContent,
+				trailingContent,
 				collapseAfter,
-				selectedTagsType
+				selectedTagsType,
+				isRequired,
+				isDirty
 			}), /* @__PURE__ */ jsx(BottomSheet, {
 				isOpen,
 				onOpenChange: handleOpenChange,
@@ -103,7 +109,8 @@ var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containe
 						inputClassName,
 						className: "mb-list-height-title-bottom px-list-side-title",
 						leadingIcon: !hideSearchIcon ? /* @__PURE__ */ jsx(SearchIcon, { className: "size-6" }) : void 0,
-						size: "default"
+						size: "default",
+						isClearable
 					}), /* @__PURE__ */ jsx(SelectListBox, {
 						...props,
 						autoFocus: !isSearchable,

package/dist/components/inputs/Selection/shared/StaticSelectTrailingContent.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { InputVariantProps } from '../../shared/input.cva';
+interface StaticSelectTrailingContentProps extends Pick<InputVariantProps, "size"> {
+    trailingContent?: ReactNode;
+    hideDropdownIcon?: boolean;
+    isDisabled?: boolean;
+}
+export declare const StaticSelectTrailingContent: ({ trailingContent, hideDropdownIcon, isDisabled, size, }: StaticSelectTrailingContentProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

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

@@ -0,0 +1,47 @@
+import { ArrowDropDownIcon } from "../../../../assets/icons/ArrowDropDown.js";
+import { UIStyle } from "../../../../config/uiStyle.context.js";
+import { inputSize } from "../../shared/input.cva.js";
+import { c } from "react/compiler-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+//#region src/components/inputs/Selection/shared/StaticSelectTrailingContent.tsx
+var StaticSelectTrailingContent = (t0) => {
+	const $ = c(10);
+	const { trailingContent, hideDropdownIcon, isDisabled, size } = t0;
+	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
+	if (!trailingContent && hideDropdownIcon) return null;
+	let t1;
+	if ($[0] !== trailingContent) {
+		t1 = trailingContent && /* @__PURE__ */ jsx("div", {
+			className: "flex shrink-0 items-center",
+			children: trailingContent
+		});
+		$[0] = trailingContent;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== hideDropdownIcon || $[3] !== inputSizeCva || $[4] !== isDisabled || $[5] !== size) {
+		t2 = !hideDropdownIcon ? /* @__PURE__ */ jsx("button", {
+			type: "button",
+			tabIndex: -1,
+			className: clsx("self-stretch border-0! pl-1-5 outline-none", inputSizeCva({ size })),
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ jsx(ArrowDropDownIcon, { className: clsx("size-6 shrink-0", isDisabled ? "text-interactive-text-secondary-disabled" : "text-interactive-text-secondary-idle") })
+		}) : void 0;
+		$[2] = hideDropdownIcon;
+		$[3] = inputSizeCva;
+		$[4] = isDisabled;
+		$[5] = size;
+		$[6] = t2;
+	} else t2 = $[6];
+	let t3;
+	if ($[7] !== t1 || $[8] !== t2) {
+		t3 = /* @__PURE__ */ jsxs(Fragment, { children: [t1, t2] });
+		$[7] = t1;
+		$[8] = t2;
+		$[9] = t3;
+	} else t3 = $[9];
+	return t3;
+};
+//#endregion
+export { StaticSelectTrailingContent };

package/dist/components/inputs/Selection/shared/querySelect.utils.d.ts

@@ -0,0 +1,7 @@
+import { UseInfiniteQueryResult, UseQueryResult } from '@tanstack/react-query';
+import { Key } from 'react-aria-components';
+import { SelectItem } from './select.types';
+export type QueryFn<TData = any> = (...args: any[]) => UseQueryResult<TData> | UseInfiniteQueryResult<TData>;
+export type QueryDataType<TQueryFn extends QueryFn> = Exclude<ReturnType<TQueryFn>["data"], undefined>;
+export declare const isInitialSelectionLabelMissing: <TInitialSelectItem>(initialSelection: TInitialSelectItem | TInitialSelectItem[] | null | undefined, mapInitialToSelectItem?: (item: TInitialSelectItem) => SelectItem) => boolean;
+export declare const getQueryItems: <TQueryFn extends QueryFn, TKey extends Key = Key>(data: QueryDataType<TQueryFn> | undefined, queryMap?: (data: QueryDataType<TQueryFn>) => SelectItem<TKey>[]) => SelectItem<TKey>[];

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

@@ -0,0 +1,24 @@
+//#region src/components/inputs/Selection/shared/querySelect.utils.ts
+var getDefaultInitialSelectionLabel = (initialSelection) => {
+	if (typeof initialSelection !== "object" || initialSelection === null) return "";
+	if ("label" in initialSelection && typeof initialSelection.label === "string") return initialSelection.label;
+	if ("name" in initialSelection && typeof initialSelection.name === "string") return initialSelection.name;
+	return "";
+};
+var isInitialSelectionLabelMissing = (initialSelection, mapInitialToSelectItem) => {
+	return (Array.isArray(initialSelection) ? initialSelection : initialSelection != null ? [initialSelection] : []).some((item) => {
+		return (mapInitialToSelectItem?.(item).label ?? getDefaultInitialSelectionLabel(item)) === "";
+	});
+};
+var getQueryItems = (data, queryMap) => {
+	if (!data) return [];
+	if (queryMap) return queryMap(data);
+	if (Array.isArray(data)) return data;
+	if (typeof data === "object" && data !== null) {
+		if ("items" in data && Array.isArray(data.items)) return data.items;
+		if ("pages" in data && Array.isArray(data.pages)) return data.pages.flatMap((page) => page && typeof page === "object" && "items" in page && Array.isArray(page.items) ? page.items : []);
+	}
+	return [];
+};
+//#endregion
+export { getQueryItems, isInitialSelectionLabelMissing };

package/dist/components/inputs/Selection/shared/select.context.d.ts

@@ -17,14 +17,15 @@ export declare namespace SelectContext {
         onClear: () => void;
         onSelectAll: () => void;
         onRemove: (val: Key) => void;
+        onBlur: () => void;
         listItems: ExtendedSelectItem[];
         selectableListItems: SelectItem[];
         selectedItems: SelectItem[];
         selectedIds: Key[];
         isMultiple: boolean;
     } & Pick<SelectBaseProps, "onInputChange" | "isLoading" | "hasLoadMore">;
-    export type ProviderProps = GroupedSelectProps & Pick<SelectBaseProps, "items" | "onInputChange" | "onSearchChange" | "showSelectAllOption" | "showNewItemOption" | "newItemMinLength" | "onNewItemOption" | "isLoading" | "hasLoadMore" | "mapInitialToSelectItem" | "isSearchable" | "isClientSearchDisabled">;
-    export const Provider: ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, children, mapInitialToSelectItem, ...props }: PropsWithChildren<ProviderProps>) => import("react/jsx-runtime").JSX.Element;
+    export type ProviderProps = GroupedSelectProps & Pick<SelectBaseProps, "items" | "onInputChange" | "onSearchChange" | "showSelectAllOption" | "showNewItemOption" | "newItemMinLength" | "onNewItemOption" | "isLoading" | "hasLoadMore" | "mapInitialToSelectItem" | "isSearchable" | "isClientSearchDisabled" | "ignoreInputValueFiltering" | "fireBlurOnChange" | "onBlur">;
+    export const Provider: ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, ignoreInputValueFiltering, fireBlurOnChange, onBlur: fieldOnBlur, children, mapInitialToSelectItem, ...props }: PropsWithChildren<ProviderProps>) => import("react/jsx-runtime").JSX.Element;
     export const useSelect: () => Type;
     export {};
 }

package/dist/components/inputs/Selection/shared/select.context.js

@@ -1,5 +1,5 @@
-import { useSelectItems } from "./useSelectItems.js";
 import { useDebounceCallback } from "../../../../hooks/useDebounceCallback.js";
+import { useSelectItems } from "./useSelectItems.js";
 import { jsx } from "react/jsx-runtime";
 import { createContext, use, useCallback, useEffect, useMemo, useRef, useState } from "react";
 //#region src/components/inputs/Selection/shared/select.context.tsx
@@ -10,7 +10,7 @@ var SelectContext;
 		id: item.id,
 		label: item.label ?? item.name ?? ""
 	});
-	_SelectContext.Provider = ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, children, mapInitialToSelectItem = defaultMapInitialToSelectItem, ...props }) => {
+	_SelectContext.Provider = ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, ignoreInputValueFiltering, fireBlurOnChange, onBlur: fieldOnBlur, children, mapInitialToSelectItem = defaultMapInitialToSelectItem, ...props }) => {
 		const isMultiple = props.selectionMode === "multiple";
 		const initialSelectedItems = useMemo(() => {
 			if (!props.initialSelection) return null;
@@ -42,24 +42,31 @@ var SelectContext;
 			newItemMinLength,
 			isLoading,
 			hasLoadMore,
-			isClientSearchDisabled
+			isClientSearchDisabled: ignoreInputValueFiltering ?? isClientSearchDisabled
 		});
-		const selectedItems = useMemo(() => allItems.filter(({ id }) => Array.isArray(fieldState.value) ? fieldState.value.includes(id) : id === fieldState.value), [allItems, fieldState.value]);
-		const selectedIds = useMemo(() => selectedItems.map(({ id }) => id), [selectedItems]);
-		const getItem = useCallback((value) => allItems.find((item) => item && item.id === value) ?? null, [allItems]);
-		const updateValue = useCallback((value) => {
-			if (Array.isArray(value)) valueRef.current = value.map((id) => getItem(id)).filter((item) => item !== null);
-			else valueRef.current = getItem(value);
-		}, [getItem]);
-		const getValueIds = () => Array.isArray(valueRef.current) ? valueRef.current.map(({ id }) => id) : valueRef.current?.id ?? null;
+		const selectedItems = useMemo(() => {
+			const getItem = (id) => allItems.find((item) => item.id === id) ?? null;
+			if (Array.isArray(fieldState.value)) return fieldState.value.map((id_0) => getItem(id_0)).filter((item_0) => item_0 !== null);
+			const selectedItem = fieldState.value != null ? getItem(fieldState.value) : null;
+			return selectedItem ? [selectedItem] : [];
+		}, [allItems, fieldState.value]);
+		const selectedIds = useMemo(() => selectedItems.map(({ id: id_1 }) => id_1), [selectedItems]);
+		const getItem_0 = useCallback((value) => allItems.find((item_1) => item_1 && item_1.id === value) ?? null, [allItems]);
+		const updateValue = useCallback((value_0) => {
+			if (Array.isArray(value_0)) valueRef.current = value_0.map((id_2) => getItem_0(id_2)).filter((item_2) => item_2 !== null);
+			else valueRef.current = getItem_0(value_0);
+		}, [getItem_0]);
+		const getValueIds = () => Array.isArray(valueRef.current) ? valueRef.current.map(({ id: id_3 }) => id_3) : valueRef.current?.id ?? null;
 		const emitStateChanges = useCallback((changes, skipSelectionChange) => {
-			if (JSON.stringify(changes.value) !== JSON.stringify(getValueIds())) {
+			const valueChanged = JSON.stringify(changes.value) !== JSON.stringify(getValueIds());
+			if (valueChanged) {
 				updateValue(changes.value);
 				if (!skipSelectionChange) if (isMultiple) props.onChange?.(changes.value);
 				else props.onChange?.(changes.value);
 			}
 			if (changes.inputValue !== fieldState.inputValue) onInputChange?.(changes.inputValue);
 			if (changes.searchValue !== fieldState.searchValue) onSearchChangeDebounced?.(changes.searchValue);
+			return valueChanged;
 		}, [
 			fieldState,
 			isMultiple,
@@ -68,10 +75,13 @@ var SelectContext;
 			onSearchChangeDebounced,
 			updateValue
 		]);
-		const syncFieldState = (value) => {
+		const triggerBlurOnChange = useCallback(() => {
+			if (fireBlurOnChange) fieldOnBlur?.({});
+		}, [fireBlurOnChange, fieldOnBlur]);
+		const syncFieldState = (value_1) => {
 			const newFieldState = {
-				value,
-				inputValue: isMultiple || Array.isArray(value) ? fieldState.inputValue : getItem(value)?.label ?? "",
+				value: value_1,
+				inputValue: isMultiple || Array.isArray(value_1) ? fieldState.inputValue : getItem_0(value_1)?.label ?? "",
 				searchValue: ""
 			};
 			setFieldState(newFieldState);
@@ -79,21 +89,21 @@ var SelectContext;
 			if (!isMultiple) setShowAll(true);
 		};
 		useEffect(() => {
-			const value = props.value ?? null;
-			if (JSON.stringify(value) !== JSON.stringify(fieldState.value)) syncFieldState(value);
-			else updateValue(value);
+			const value_2 = props.value ?? null;
+			if (JSON.stringify(value_2) !== JSON.stringify(fieldState.value)) syncFieldState(value_2);
+			else updateValue(value_2);
 		}, [props.value]);
 		useEffect(() => {
-			if (!isMultiple && fieldState.value && fieldState.inputValue === "" && getItem(fieldState.value)?.label) syncFieldState(fieldState.value);
+			if (!isMultiple && props.value !== null && props.value !== void 0 && fieldState.value !== null && fieldState.value !== void 0 && fieldState.inputValue === "" && getItem_0(fieldState.value)?.label) syncFieldState(fieldState.value);
 		}, [allListItems]);
 		const handleInputChange = useCallback((inputValue) => {
-			const newFieldState = {
+			const newFieldState_0 = {
 				value: isMultiple || inputValue !== "" ? fieldState.value : null,
 				inputValue,
 				searchValue: inputValue
 			};
-			setFieldState(newFieldState);
-			emitStateChanges(newFieldState);
+			setFieldState(newFieldState_0);
+			emitStateChanges(newFieldState_0);
 			setShowAll(false);
 			if (!isOpen && inputValue !== "" && props.isSearchable) setIsOpen(true);
 		}, [
@@ -101,16 +111,16 @@ var SelectContext;
 			fieldState.value,
 			isMultiple
 		]);
-		const onChange = useCallback((value) => {
-			if (value === "new-item-id") onNewItemOption?.(fieldState.inputValue);
+		const onChange = useCallback((value_3) => {
+			if (value_3 === "new-item-id") onNewItemOption?.(fieldState.inputValue);
 			else {
-				const newFieldState = {
-					value,
-					inputValue: isMultiple || Array.isArray(value) ? "" : getItem(value)?.label ?? "",
+				const newFieldState_1 = {
+					value: value_3,
+					inputValue: isMultiple || Array.isArray(value_3) ? "" : getItem_0(value_3)?.label ?? "",
 					searchValue: ""
 				};
-				setFieldState(newFieldState);
-				emitStateChanges(newFieldState);
+				setFieldState(newFieldState_1);
+				if (emitStateChanges(newFieldState_1)) triggerBlurOnChange();
 			}
 			if (!isMultiple) {
 				setIsOpen(false);
@@ -120,8 +130,9 @@ var SelectContext;
 			emitStateChanges,
 			onNewItemOption,
 			fieldState.inputValue,
-			getItem,
-			isMultiple
+			getItem_0,
+			isMultiple,
+			triggerBlurOnChange
 		]);
 		const onClear = useCallback(() => {
 			if (!valueRef.current || Array.isArray(valueRef.current) && valueRef.current.length === 0) {
@@ -135,16 +146,34 @@ var SelectContext;
 			else onChange(null);
 		}, [isMultiple, onChange]);
 		const onSelectAll = useCallback(() => {
-			onChange(selectableListItems.map(({ id }) => id));
+			onChange(selectableListItems.map(({ id: id_4 }) => id_4));
 		}, [selectableListItems, onChange]);
-		const onRemove = useCallback((value) => {
-			if (isMultiple && Array.isArray(fieldState.value)) onChange(fieldState.value.filter((id) => id !== value));
+		const onRemove = useCallback((value_4) => {
+			if (isMultiple && Array.isArray(fieldState.value)) onChange(fieldState.value.filter((id_5) => id_5 !== value_4));
 		}, [
 			isMultiple,
 			fieldState.value,
 			onChange
 		]);
-		const value = useMemo(() => ({
+		const onBlur = useCallback(() => {
+			if (props.isSearchable && isMultiple && fieldState.searchValue !== "") {
+				const newFieldState_2 = {
+					...fieldState,
+					inputValue: "",
+					searchValue: ""
+				};
+				setFieldState(newFieldState_2);
+				emitStateChanges(newFieldState_2);
+				setShowAll(true);
+			}
+			fieldOnBlur?.({});
+		}, [
+			props.isSearchable,
+			isMultiple,
+			fieldState,
+			fieldOnBlur
+		]);
+		const value_5 = useMemo(() => ({
 			fieldState,
 			isOpen,
 			setIsOpen,
@@ -154,6 +183,7 @@ var SelectContext;
 			onClear,
 			onSelectAll,
 			onRemove,
+			onBlur,
 			listItems,
 			selectableListItems,
 			selectedItems,
@@ -171,6 +201,7 @@ var SelectContext;
 			onClear,
 			onSelectAll,
 			onRemove,
+			onBlur,
 			listItems,
 			selectableListItems,
 			selectedIds,
@@ -180,7 +211,7 @@ var SelectContext;
 			hasLoadMore
 		]);
 		return /* @__PURE__ */ jsx(Context.Provider, {
-			value,
+			value: value_5,
 			children
 		});
 	};

package/dist/components/inputs/Selection/shared/select.types.d.ts

@@ -1,11 +1,11 @@
-import { ReactElement } from 'react';
+import { ReactElement, ReactNode } from 'react';
 import { Key } from 'react-aria-components';
 import { FieldValues } from 'react-hook-form';
 import { ControlProps } from '../../shared/form.types';
 export interface SelectItem<TKey extends Key = Key> {
     id: TKey;
     label: string;
-    content?: string | ReactElement;
+    content?: string | ReactNode;
     isDisabled?: boolean;
 }
 export interface ExtendedSelectItem<TKey extends Key = Key> extends SelectItem<TKey> {
@@ -54,6 +54,7 @@ export interface SelectAsyncProps {
     onLoadMore?: () => void;
 }
 export interface SelectVirtualizationProps {
+    totalItems?: number;
     virtualizerOptions?: {
         rowHeight?: number;
         estimatedRowHeight?: number;

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

@@ -0,0 +1,3 @@
+import { VariantProps } from 'class-variance-authority';
+export declare const selectPopoverCva: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export type SelectPopoverCva = VariantProps<typeof selectPopoverCva>;

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

@@ -0,0 +1,5 @@
+import { cva } from "class-variance-authority";
+//#region src/components/inputs/Selection/shared/selectDesktop.cva.ts
+var selectPopoverCva = cva("my-4 outline-none");
+//#endregion
+export { selectPopoverCva };

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

@@ -0,0 +1,5 @@
+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>;

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

@@ -0,0 +1,5 @@
+import { cva } from "class-variance-authority";
+//#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" } } });
+//#endregion
+export { selectInputTagsContentWrapperCva };

package/dist/components/inputs/Selection/shared/staticSelect.utils.d.ts

@@ -0,0 +1,23 @@
+import { ReactNode } from 'react';
+import { Key } from 'react-aria-components';
+import { SelectBaseProps } from './SelectBase';
+import { DefaultInitialSelectItem, SelectItem } from './select.types';
+interface GetStaticSelectValueOptions<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> {
+    items: SelectItem<TKey>[];
+    value: TKey | TKey[] | null | undefined;
+    selectionMode: SelectBaseProps<TKey>["selectionMode"];
+    initialSelection?: TInitialSelectItem | TInitialSelectItem[] | null;
+    mapInitialToSelectItem?: (item: TInitialSelectItem) => SelectItem<TKey>;
+    showSelectionContent?: boolean;
+    isDisabled?: boolean;
+    collapseAfter?: SelectBaseProps<TKey>["collapseAfter"];
+    selectedTagsType?: SelectBaseProps<TKey>["selectedTagsType"];
+}
+interface StaticSelectValueResult<TKey extends Key = Key> {
+    selectedItem: SelectItem<TKey> | null;
+    selectedItems: SelectItem<TKey>[];
+    displayValue: ReactNode;
+    isEmpty: boolean;
+}
+export declare const getStaticSelectValue: <TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>({ items, value, selectionMode, initialSelection, mapInitialToSelectItem, showSelectionContent, isDisabled, collapseAfter, selectedTagsType, }: GetStaticSelectValueOptions<TKey, TInitialSelectItem>) => StaticSelectValueResult<TKey>;
+export {};

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

@@ -0,0 +1,37 @@
+import { SelectInputTags } from "./SelectInputTags.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/inputs/Selection/shared/staticSelect.utils.tsx
+var getStaticSelectValue = ({ items, value, selectionMode, initialSelection, mapInitialToSelectItem = ((item) => ({
+	id: item.id,
+	label: item.label ?? item.name ?? ""
+})), showSelectionContent, isDisabled, collapseAfter, selectedTagsType }) => {
+	const initialSelectedItems = initialSelection ? (Array.isArray(initialSelection) ? initialSelection : [initialSelection]).map((item) => mapInitialToSelectItem(item)) : [];
+	const allItemsMap = /* @__PURE__ */ new Map();
+	[...initialSelectedItems, ...items].forEach((item) => allItemsMap.set(item.id, item));
+	const getItem = (id) => allItemsMap.get(id) ?? null;
+	const selectedItems = Array.isArray(value) ? value.map((id) => getItem(id)).filter((item) => item != null) : [];
+	const selectedItem = !Array.isArray(value) && value != null ? getItem(value) : null;
+	if (selectionMode === "multiple") return {
+		selectedItem,
+		selectedItems,
+		displayValue: selectedItems.length > 0 ? /* @__PURE__ */ jsx(SelectInputTags, {
+			selectedItems,
+			isDisabled,
+			collapseAfter,
+			selectedTagsType,
+			onRemove: () => void 0
+		}) : "",
+		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
+		}) : "",
+		isEmpty: selectedItem == null
+	};
+};
+//#endregion
+export { getStaticSelectValue };

package/dist/components/inputs/Selection/shared/staticSelect.utils.spec.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -1,4 +1,4 @@
-import { useMemo } from "react";
+import { c } from "react/compiler-runtime";
 import { useFilter } from "react-aria-components";
 //#region src/components/inputs/Selection/shared/useSelectItems.tsx
 var SelectAllItemId = "all-item-id";
@@ -24,61 +24,121 @@ var ReservedItemIds = [
 	NewItemId,
 	LoadingItemId
 ];
-function useSelectItems({ initialSelectedItems, selectedItems, cachedItems, inputValue, showAll, isMultiple, showSelectAllOption, showNewItemOption, newItemMinLength = 3, isLoading, hasLoadMore, isClientSearchDisabled }) {
-	const { contains } = useFilter({ sensitivity: "base" });
-	const allListItems = useMemo(() => {
-		const showSelectAllItem = isMultiple && showSelectAllOption && inputValue.length === 0 && !hasLoadMore;
-		const showNewItem = showNewItemOption && inputValue.length >= newItemMinLength && !cachedItems.find((item) => contains(item.label, inputValue));
-		const showLoadingItem = isLoading || hasLoadMore;
-		return [
-			...showSelectAllItem ? [SelectAllItem(inputValue)] : [],
+function useSelectItems(t0) {
+	const $ = c(37);
+	const { initialSelectedItems, selectedItems, cachedItems, inputValue, showAll, isMultiple, showSelectAllOption, showNewItemOption, newItemMinLength: t1, isLoading, hasLoadMore, isClientSearchDisabled } = t0;
+	const newItemMinLength = t1 === void 0 ? 3 : t1;
+	let t2;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = { sensitivity: "base" };
+		$[0] = t2;
+	} else t2 = $[0];
+	const { contains } = useFilter(t2);
+	const showSelectAllItem = isMultiple && showSelectAllOption && inputValue.length === 0 && !hasLoadMore;
+	let t3;
+	if ($[1] !== cachedItems || $[2] !== contains || $[3] !== inputValue || $[4] !== newItemMinLength || $[5] !== showNewItemOption) {
+		t3 = showNewItemOption && inputValue.length >= newItemMinLength && !cachedItems.find((item) => contains(item.label, inputValue));
+		$[1] = cachedItems;
+		$[2] = contains;
+		$[3] = inputValue;
+		$[4] = newItemMinLength;
+		$[5] = showNewItemOption;
+		$[6] = t3;
+	} else t3 = $[6];
+	const showNewItem = t3;
+	const showLoadingItem = isLoading || hasLoadMore;
+	let t4;
+	if ($[7] !== inputValue || $[8] !== showSelectAllItem) {
+		t4 = showSelectAllItem ? [SelectAllItem(inputValue)] : [];
+		$[7] = inputValue;
+		$[8] = showSelectAllItem;
+		$[9] = t4;
+	} else t4 = $[9];
+	let t5;
+	if ($[10] !== inputValue || $[11] !== showNewItem) {
+		t5 = showNewItem ? [NewItem(inputValue)] : [];
+		$[10] = inputValue;
+		$[11] = showNewItem;
+		$[12] = t5;
+	} else t5 = $[12];
+	let t6;
+	if ($[13] !== inputValue || $[14] !== showLoadingItem) {
+		t6 = showLoadingItem ? [LoadingItem(inputValue)] : [];
+		$[13] = inputValue;
+		$[14] = showLoadingItem;
+		$[15] = t6;
+	} else t6 = $[15];
+	let t7;
+	if ($[16] !== cachedItems || $[17] !== t4 || $[18] !== t5 || $[19] !== t6) {
+		t7 = [
+			...t4,
 			...cachedItems,
-			...showNewItem ? [NewItem(inputValue)] : [],
-			...showLoadingItem ? [LoadingItem(inputValue)] : []
+			...t5,
+			...t6
 		];
-	}, [
-		isMultiple,
-		showNewItemOption,
-		inputValue,
-		newItemMinLength,
-		cachedItems,
-		contains,
-		isLoading,
-		hasLoadMore,
-		showSelectAllOption
-	]);
-	const allItems = useMemo(() => {
+		$[16] = cachedItems;
+		$[17] = t4;
+		$[18] = t5;
+		$[19] = t6;
+		$[20] = t7;
+	} else t7 = $[20];
+	const allListItems = t7;
+	let t8;
+	if ($[21] !== allListItems || $[22] !== initialSelectedItems || $[23] !== selectedItems) {
 		const items = [
 			...Array.isArray(initialSelectedItems) ? initialSelectedItems : [initialSelectedItems],
 			...Array.isArray(selectedItems) ? selectedItems : [selectedItems],
 			...allListItems
-		].filter((item) => !!item);
+		].filter(_temp);
 		const allItemsMap = /* @__PURE__ */ new Map();
-		items.forEach((item) => allItemsMap.set(item.id, item));
-		return Array.from(allItemsMap.values());
-	}, [
-		allListItems,
-		initialSelectedItems,
-		selectedItems
-	]);
-	const filteredListItems = useMemo(() => allListItems.filter((item) => contains(item.label, inputValue)), [
-		allListItems,
-		contains,
-		inputValue
-	]);
-	const listItems = useMemo(() => showAll || isClientSearchDisabled ? allListItems : filteredListItems, [
-		showAll,
-		isClientSearchDisabled,
-		allListItems,
-		filteredListItems
-	]);
-	return {
-		allItems,
-		allListItems,
-		filteredListItems,
-		listItems,
-		selectableListItems: useMemo(() => listItems.filter((item) => !item.isDisabled && !ReservedItemIds.includes(String(item.id))), [listItems])
-	};
+		items.forEach((item_1) => allItemsMap.set(item_1.id, item_1));
+		t8 = Array.from(allItemsMap.values());
+		$[21] = allListItems;
+		$[22] = initialSelectedItems;
+		$[23] = selectedItems;
+		$[24] = t8;
+	} else t8 = $[24];
+	const allItems = t8;
+	let t9;
+	if ($[25] !== allListItems || $[26] !== contains || $[27] !== inputValue) {
+		t9 = allListItems.filter((item_2) => contains(item_2.label, inputValue));
+		$[25] = allListItems;
+		$[26] = contains;
+		$[27] = inputValue;
+		$[28] = t9;
+	} else t9 = $[28];
+	const filteredListItems = t9;
+	const listItems = showAll || isClientSearchDisabled ? allListItems : filteredListItems;
+	let t10;
+	if ($[29] !== listItems) {
+		t10 = listItems.filter(_temp2);
+		$[29] = listItems;
+		$[30] = t10;
+	} else t10 = $[30];
+	const selectableListItems = t10;
+	let t11;
+	if ($[31] !== allItems || $[32] !== allListItems || $[33] !== filteredListItems || $[34] !== listItems || $[35] !== selectableListItems) {
+		t11 = {
+			allItems,
+			allListItems,
+			filteredListItems,
+			listItems,
+			selectableListItems
+		};
+		$[31] = allItems;
+		$[32] = allListItems;
+		$[33] = filteredListItems;
+		$[34] = listItems;
+		$[35] = selectableListItems;
+		$[36] = t11;
+	} else t11 = $[36];
+	return t11;
+}
+function _temp2(item_3) {
+	return !item_3.isDisabled && !ReservedItemIds.includes(String(item_3.id));
+}
+function _temp(item_0) {
+	return !!item_0;
 }
 //#endregion
 export { NewItemId, SelectAllItemId, useSelectItems };