@povio/ui 5.0.0-rc.9 → 6.0.0-rc.1

package/dist/{staticSelect.utils-uHa8f_c6.js → Select-Br_3eecr.js}

@@ -1,247 +1,69 @@
-import { t as UIConfig } from "./uiConfig.context-BS3r_kTS.js";
+import { t as createLucideIcon } from "./createLucideIcon-LcezOE4z.js";
+import { t as UIConfig } from "./uiConfig.context-CT9EVqC5.js";
 import { t as ChevronDown } from "./chevron-down-B4Pr8bD3.js";
-import { t as CheckboxCheckmark } from "./CheckboxCheckmark-CpC3wlMs.js";
-import { i as Search, n as selectListBoxItemDefinition, r as selectInputTagsContentWrapperDefinition, t as selectPopoverDefinition } from "./selectDesktop.cva-CHAMxhfO.js";
+import { t as CheckboxCheckmark } from "./CheckboxCheckmark-BzT6MwH5.js";
 import { t as X } from "./x-B6vfz8Ps.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { t as UIOverrides } from "./uiOverrides.context-BTCH9y5a.js";
 import { t as IconSlot } from "./IconSlot-DSK7qNxc.js";
-import { c as $7230ffa83bc0c2cf$export$ef03459518577ad4, i as $7230ffa83bc0c2cf$export$9d4c57ee4c6ffdd8, l as $7230ffa83bc0c2cf$export$fabf2dc03a41866e, n as $7230ffa83bc0c2cf$export$29f1550f4b0d4415, r as $7230ffa83bc0c2cf$export$4d86445c2cf5e3, s as $7230ffa83bc0c2cf$export$df3a06d6289f983e, t as $7230ffa83bc0c2cf$export$2881499e37b75b9a } from "./utils-Czcqspm7.js";
-import { c as $542a13ca2fa5b484$export$5b6b19405a83ff9d, g as $4b38b5b75ecc6208$export$698f465ec27e93df, l as $542a13ca2fa5b484$export$9b9a0cd73afb7ca4, m as $263ab7fc0f95ccdb$export$4feb769f8ddf26c5, p as $263ab7fc0f95ccdb$export$2dbbd341daed716d, r as $f2ff30fde7b014be$export$d2f961adcb0afbe, t as $f2ff30fde7b014be$export$2e1e1122cf0cba88 } from "./Dialog-CKLkS00H.js";
-import { t as $43a3b93638fe5db9$export$75b6ee27786ba447 } from "./Label-B2-B-uFY.js";
-import { n as $7705c033048f6da7$export$353f5b6fc5456de1, t as $7705c033048f6da7$export$24d547caef80ccd1 } from "./Button-D6KlWSFL.js";
-import { t as $efe09c6d1c304b50$export$9afb8bc826b033ea } from "./Text-D2MPZ3sY.js";
-import { n as $1f3c3b1a70cec653$export$ff05c3ac10437e03, t as $cdaed739b1139372$export$c24727297075ec6a } from "./Form-DlQcyN1f.js";
-import { n as $41fb335299a4a39e$export$f5b8910cec6cf069, t as $41fb335299a4a39e$export$37fb8590cf2c088c } from "./Input-BsbLZDtC.js";
-import { i as $928221da08ecbc62$export$a11e76429ed99b4, n as $928221da08ecbc62$export$7c5906fe4f1f2af2, r as $928221da08ecbc62$export$7ff8f37d2d81a48d, t as $928221da08ecbc62$export$41f133550aa26f48 } from "./ListBox-CL8Ar4Q_.js";
+import { l as $542a13ca2fa5b484$export$5b6b19405a83ff9d, m as $263ab7fc0f95ccdb$export$4feb769f8ddf26c5, p as $263ab7fc0f95ccdb$export$2dbbd341daed716d, t as $f2ff30fde7b014be$export$2e1e1122cf0cba88 } from "./Dialog-lFYX-7Ax.js";
+import { n as $7705c033048f6da7$export$353f5b6fc5456de1 } from "./Button-C1YB5dOw.js";
+import { n as $dbdc5e6e7ce01b4b$export$c02625b26074192c, t as $dbdc5e6e7ce01b4b$export$72b9695b8216309a } from "./ComboBox-DFlz6HJ8.js";
+import { n as $41fb335299a4a39e$export$f5b8910cec6cf069 } from "./Input-BG0Xjw5X.js";
+import { i as $928221da08ecbc62$export$a11e76429ed99b4, t as $928221da08ecbc62$export$41f133550aa26f48 } from "./ListBox-CoUk0kkt.js";
 import { i as $a3be900807531178$re_export$useFilter, n as $a3be900807531178$re_export$ListLayout, r as $a3be900807531178$re_export$Rect } from "./exports-BNrTn8Tj.js";
 import "./popoverAnimation-DEZSvKP8.js";
 import { t as Spinner } from "./Spinner-BeVTUzzx.js";
+import { t as Button } from "./Button-DER_6cxv.js";
 import { BottomSheet } from "./components/bottom-sheet.js";
-import { t as useBreakpoint } from "./useBreakpoint-DQoMN-BG.js";
-import { TextButton } from "./components/text-button.js";
-import { r as $a8ea2faf2ebe4d2f$re_export$mergeRefs } from "./import-BE0r63d8.js";
-import { r as FormFieldLabel, t as FormField } from "./FormField-B99dLt8o.js";
-import { t as Tag } from "./Tag-DPg5sL1Z.js";
-import "./i18n-CX2EjhJI.js";
-import { a as inputSizeDefinition, t as inputBaseDefinition } from "./input.cva-DJA8ovm_.js";
-import { n as InputClear, t as TooltipWrapper } from "./TooltipWrapper-3jyN0Wss.js";
-import { t as useIntersectionObserver } from "./useIntersectionObserver-DYfHnGGU.js";
+import { t as useBreakpoint } from "./useBreakpoint-BzYqQEBO.js";
+import { r as $a8ea2faf2ebe4d2f$re_export$mergeRefs } from "./import-D_3dPATF.js";
+import { n as FormFieldLabel, t as FormField } from "./FormField-D7KKJ6kG.js";
+import { a as inputSizeDefinition, t as inputBaseDefinition } from "./input.cva-w7ZEVQAM.js";
+import "./i18n-BjNKHh_D.js";
+import { n as useStaticInputHandoff, t as getStaticInputFocusTarget } from "./useStaticInputHandoff-DyYxfwv6.js";
+import { n as InputClear, t as TooltipWrapper } from "./TooltipWrapper-D7HUZLsP.js";
 import { t as popoverDefinition } from "./popover.cva-Bhud1wnp.js";
-import { Input } from "./components/input.js";
+import { InputFrame } from "./components/input-frame.js";
+import { Tag } from "./components/tag.js";
+import { n as selectInputTagsContentWrapperDefinition, t as selectPopoverDefinition } from "./selectDesktop.cva-RzxvSBkd.js";
+import { t as selectListBoxItemDefinition } from "./selectItem.cva-BWfEkNs_.js";
+import { t as useIntersectionObserver } from "./useIntersectionObserver-DYfHnGGU.js";
+import { t as Input } from "./Input-CG4Irgae.js";
 import $ahdqC$react, { Fragment, createContext, use, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { c } from "react/compiler-runtime";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import "react-aria/mergeProps";
-import { CollectionBuilder } from "react-aria/CollectionBuilder";
-import { filterDOMProps } from "react-aria/filterDOMProps";
-import "react-aria/useFocusRing";
-import "react-aria/useHover";
-import { createHideableComponent } from "react-aria/private/collections/Hidden";
-import { useResizeObserver } from "react-aria/private/utils/useResizeObserver";
-import { useComboBox } from "react-aria/useComboBox";
-import { useComboBoxState } from "react-stately/useComboBoxState";
-import { useFilter } from "react-aria/useFilter";
-import "react-aria/useListFormatter";
 import { useVirtualizerState } from "react-stately/useVirtualizerState";
 import { useScrollView } from "react-aria/private/virtualizer/ScrollView";
 import { VirtualizerItem } from "react-aria/private/virtualizer/VirtualizerItem";
 import { usePreventScroll } from "react-aria";
 import { useLabel } from "@react-aria/label";
-import { useFocusVisible, useFocusWithin, useHover as useHover$1 } from "@react-aria/interactions";
 import { useTranslation } from "react-i18next";
-//#region ../../node_modules/.bun/react-aria-components@1.21.1+67f6792bdf102c28/node_modules/react-aria-components/dist/private/Group.mjs
-const $3a442827418ebe87$export$f9c6924e160136d1 = /*#__PURE__*/ createContext({});
-//#endregion
-//#region ../../node_modules/.bun/react-aria-components@1.21.1+67f6792bdf102c28/node_modules/react-aria-components/dist/private/ComboBox.mjs
-const $dbdc5e6e7ce01b4b$export$d414ccceff7063c3 = /*#__PURE__*/ createContext(null);
-const $dbdc5e6e7ce01b4b$export$c02625b26074192c = /*#__PURE__*/ createContext(null);
-const $dbdc5e6e7ce01b4b$export$72b9695b8216309a = /*#__PURE__*/ createHideableComponent(function ComboBox(props, ref) {
-	[props, ref] = $7230ffa83bc0c2cf$export$29f1550f4b0d4415(props, ref, $dbdc5e6e7ce01b4b$export$d414ccceff7063c3);
-	let { children, isDisabled = false, isInvalid = false, isRequired = false, isReadOnly = false } = props;
-	let content = useMemo(() => /*#__PURE__*/ $ahdqC$react.createElement($928221da08ecbc62$export$7ff8f37d2d81a48d.Provider, { value: { items: props.items ?? props.defaultItems } }, typeof children === "function" ? children({
-		isOpen: false,
-		isDisabled,
-		isInvalid,
-		isRequired,
-		defaultChildren: null,
-		isReadOnly
-	}) : children), [
-		children,
-		isDisabled,
-		isInvalid,
-		isRequired,
-		isReadOnly,
-		props.items,
-		props.defaultItems
-	]);
-	return /*#__PURE__*/ $ahdqC$react.createElement(CollectionBuilder, { content }, (collection) => /*#__PURE__*/ $ahdqC$react.createElement($dbdc5e6e7ce01b4b$var$ComboBoxInner, {
-		props,
-		collection,
-		comboBoxRef: ref
-	}));
-});
-const $dbdc5e6e7ce01b4b$var$CLEAR_CONTEXTS = [
-	$43a3b93638fe5db9$export$75b6ee27786ba447,
-	$7705c033048f6da7$export$24d547caef80ccd1,
-	$41fb335299a4a39e$export$37fb8590cf2c088c,
-	$4b38b5b75ecc6208$export$698f465ec27e93df,
-	$3a442827418ebe87$export$f9c6924e160136d1,
-	$efe09c6d1c304b50$export$9afb8bc826b033ea
-];
-function $dbdc5e6e7ce01b4b$var$ComboBoxInner({ props, collection, comboBoxRef: ref }) {
-	let { name, formValue = "key", allowsCustomValue } = props;
-	if (allowsCustomValue) formValue = "text";
-	let { validationBehavior: formValidationBehavior } = $7230ffa83bc0c2cf$export$fabf2dc03a41866e($cdaed739b1139372$export$c24727297075ec6a) || {};
-	let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? "native";
-	let { contains } = useFilter({ sensitivity: "base" });
-	let state = useComboBoxState({
-		...props,
-		defaultFilter: props.defaultFilter || contains,
-		items: props.items,
-		children: void 0,
-		collection,
-		validationBehavior
-	});
-	let buttonRef = useRef(null);
-	let inputRef = useRef(null);
-	let groupRef = useRef(null);
-	let listBoxRef = useRef(null);
-	let popoverRef = useRef(null);
-	let [labelRef, label] = $7230ffa83bc0c2cf$export$9d4c57ee4c6ffdd8(!props["aria-label"] && !props["aria-labelledby"]);
-	let [labelElementType, setLabelElementType] = useState("label");
-	let { buttonProps, inputProps, listBoxProps, labelProps, descriptionProps, errorMessageProps, valueProps, ...validation } = useComboBox({
-		...$7230ffa83bc0c2cf$export$ef03459518577ad4(props),
-		label,
-		inputRef,
-		buttonRef,
-		listBoxRef,
-		popoverRef,
-		name: formValue === "text" ? name : void 0,
-		validationBehavior,
-		labelElementType
-	}, state);
-	let [menuWidth, setMenuWidth] = useState(null);
-	let onResize = useCallback(() => {
-		if (inputRef.current && !groupRef.current) {
-			let buttonRect = buttonRef.current?.getBoundingClientRect();
-			let inputRect = inputRef.current.getBoundingClientRect();
-			let minX = buttonRect ? Math.min(buttonRect.left, inputRect.left) : inputRect.left;
-			let maxX = buttonRect ? Math.max(buttonRect.right, inputRect.right) : inputRect.right;
-			setMenuWidth(maxX - minX + "px");
-		}
-	}, [
-		buttonRef,
-		inputRef,
-		setMenuWidth
-	]);
-	useResizeObserver({
-		ref: inputRef,
-		onResize
-	});
-	let triggerRef = useMemo(() => ({ get current() {
-		return groupRef.current || inputRef.current;
-	} }), [groupRef, inputRef]);
-	let renderPropsState = useMemo(() => ({
-		isOpen: state.isOpen,
-		isDisabled: props.isDisabled || false,
-		isInvalid: validation.isInvalid || false,
-		isRequired: props.isRequired || false,
-		isReadOnly: props.isReadOnly || false
-	}), [
-		state.isOpen,
-		props.isDisabled,
-		validation.isInvalid,
-		props.isRequired,
-		props.isReadOnly
-	]);
-	let renderProps = $7230ffa83bc0c2cf$export$4d86445c2cf5e3({
-		...props,
-		values: renderPropsState,
-		defaultClassName: "react-aria-ComboBox"
-	});
-	let DOMProps = filterDOMProps(props, { global: true });
-	delete DOMProps.id;
-	let inputs = [];
-	if (name && formValue === "key") {
-		let values = Array.isArray(state.value) ? state.value : [state.value];
-		if (values.length === 0) values = [null];
-		inputs = values.map((value, i) => /*#__PURE__*/ $ahdqC$react.createElement("input", {
-			key: i,
-			type: "hidden",
-			name,
-			form: props.form,
-			value: value ?? ""
-		}));
-	}
-	return /*#__PURE__*/ $ahdqC$react.createElement($7230ffa83bc0c2cf$export$2881499e37b75b9a, { values: [
-		[$dbdc5e6e7ce01b4b$export$c02625b26074192c, state],
-		[$43a3b93638fe5db9$export$75b6ee27786ba447, {
-			...labelProps,
-			elementType: labelElementType,
-			ref: labelRef
-		}],
-		[$7705c033048f6da7$export$24d547caef80ccd1, {
-			...buttonProps,
-			ref: buttonRef,
-			isPressed: state.isOpen
-		}],
-		[$41fb335299a4a39e$export$37fb8590cf2c088c, {
-			...inputProps,
-			ref: inputRef
-		}],
-		[$4b38b5b75ecc6208$export$698f465ec27e93df, {
-			...inputProps,
-			ref: useCallback((el) => {
-				inputRef.current = el;
-				if (el) setLabelElementType(el.tagName.toLowerCase() === "input" ? "label" : "span");
-			}, []),
-			value: state.inputValue,
-			onChange: (v) => state.setInputValue(v)
-		}],
-		[$f2ff30fde7b014be$export$d2f961adcb0afbe, state],
-		[$542a13ca2fa5b484$export$9b9a0cd73afb7ca4, {
-			ref: popoverRef,
-			triggerRef,
-			scrollRef: listBoxRef,
-			placement: "bottom start",
-			isNonModal: true,
-			trigger: "ComboBox",
-			style: { "--trigger-width": menuWidth },
-			clearContexts: $dbdc5e6e7ce01b4b$var$CLEAR_CONTEXTS
-		}],
-		[$928221da08ecbc62$export$7ff8f37d2d81a48d, {
-			...listBoxProps,
-			ref: listBoxRef
-		}],
-		[$928221da08ecbc62$export$7c5906fe4f1f2af2, state],
-		[$efe09c6d1c304b50$export$9afb8bc826b033ea, { slots: {
-			description: descriptionProps,
-			errorMessage: errorMessageProps
-		} }],
-		[$3a442827418ebe87$export$f9c6924e160136d1, {
-			ref: groupRef,
-			isInvalid: validation.isInvalid,
-			isDisabled: props.isDisabled || false
-		}],
-		[$1f3c3b1a70cec653$export$ff05c3ac10437e03, validation],
-		[$dbdc5e6e7ce01b4b$export$5c804022b41722df, valueProps]
-	] }, /*#__PURE__*/ $ahdqC$react.createElement($7230ffa83bc0c2cf$export$df3a06d6289f983e.div, {
-		...DOMProps,
-		...renderProps,
-		ref,
-		slot: props.slot || void 0,
-		"data-focused": state.isFocused || void 0,
-		"data-open": state.isOpen || void 0,
-		"data-disabled": props.isDisabled || void 0,
-		"data-readonly": props.isReadOnly || void 0,
-		"data-invalid": validation.isInvalid || void 0,
-		"data-required": props.isRequired || void 0
-	}, renderProps.children, inputs));
-}
-const $dbdc5e6e7ce01b4b$export$5c804022b41722df = /*#__PURE__*/ createContext(null);
+import { useFocusVisible, useFocusWithin, useHover } from "@react-aria/interactions";
+//#region ../../node_modules/.bun/lucide-react@1.43.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/search.mjs
+/**
+* @license lucide-react v1.43.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+const __iconData = {
+	name: "search",
+	size: 24,
+	node: [["path", {
+		d: "m21 21-4.34-4.34",
+		key: "14j7rj"
+	}], ["circle", {
+		cx: "11",
+		cy: "11",
+		r: "8",
+		key: "4ej97u"
+	}]]
+};
+__iconData.node;
+const Search = createLucideIcon(__iconData);
 //#endregion
-//#region ../../node_modules/.bun/react-aria-components@1.21.1+67f6792bdf102c28/node_modules/react-aria-components/dist/private/Virtualizer.mjs
+//#region ../../node_modules/.bun/react-aria-components@1.22.1+67f6792bdf102c28/node_modules/react-aria-components/dist/private/Virtualizer.mjs
 const $143fb904d86051ce$var$VirtualizerContext = /*#__PURE__*/ createContext(null);
 const $143fb904d86051ce$var$VirtualizerOptionsContext = /*#__PURE__*/ createContext(null);
 function $143fb904d86051ce$export$89be5a243e59c4b2(props) {
@@ -586,7 +408,9 @@ let SelectContext;
 			else updateValue(value);
 		}, [controlledValue]);
 		useEffect(() => {
-			if (!isMultiple && controlledValue !== null && controlledValue !== void 0 && fieldState.value !== null && fieldState.value !== void 0 && fieldState.inputValue === "" && getItem(fieldState.value)?.label) syncFieldState(fieldState.value);
+			updateValue(fieldState.value);
+			if (isMultiple) return;
+			if (controlledValue !== null && controlledValue !== void 0 && fieldState.value !== null && fieldState.value !== void 0 && fieldState.inputValue === "" && getItem(fieldState.value)?.label) syncFieldState(fieldState.value);
 		}, [allListItems]);
 		const handleInputChange = useCallback((inputValue) => {
 			const newFieldState = {
@@ -782,7 +606,7 @@ const SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvali
 	const selectInputTagsContentWrapperCva = UIOverrides.useCva("select.tagsContentWrapperCva", selectInputTagsContentWrapperDefinition);
 	const { t } = useTranslation("ui");
 	const state = use($dbdc5e6e7ce01b4b$export$c02625b26074192c);
-	const { hoverProps, isHovered } = useHover$1({ isDisabled });
+	const { hoverProps, isHovered } = useHover({ isDisabled });
 	const [isFocused, setIsFocused] = useState(false);
 	const { focusWithinProps } = useFocusWithin({ onFocusWithinChange: setIsFocused });
 	const { isFocusVisible } = useFocusVisible();
@@ -921,7 +745,7 @@ const SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvali
 							ref: inputRef,
 							placeholder: as === "floating" ? void 0 : placeholder,
 							onBlur,
-							className: clsx("w-full flex-1 bg-transparent outline-none placeholder:text-surface-default-popover-foreground", "disabled:text-inherit disabled:placeholder:text-surface-default-popover-foreground", inputClassName),
+							className: clsx("min-w-0 w-full flex-1 bg-transparent outline-none placeholder:text-content-muted", "disabled:text-inherit disabled:placeholder:text-content-muted", inputClassName),
 							onKeyDown,
 							onKeyDownCapture: onInputKeyDownCapture,
 							...fieldProps
@@ -936,7 +760,7 @@ const SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvali
 						onKeyDown: onTriggerKeyDown,
 						...fieldProps,
 						children: [(as === "floating" && isEmpty || isMultiple && !isEmpty) && /* @__PURE__ */ jsx(Fragment$1, { children: "\xA0" }), (isEmpty || !isMultiple) && (as !== "floating" || !isEmpty) && /* @__PURE__ */ jsxs("span", {
-							className: clsx("truncate empty:before:inline-block empty:before:content-['']", isEmpty && "text-surface-default-popover-foreground"),
+							className: clsx("block truncate empty:before:inline-block empty:before:content-['']", isEmpty && "text-content-muted"),
 							children: [isEmpty && placeholder, !isEmpty && (showSelectionContent ? selectedItems[0].content : selectedItems[0].label)]
 						})]
 					})
@@ -956,7 +780,7 @@ const SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvali
 			!hideDropdownIcon && /* @__PURE__ */ jsx($7705c033048f6da7$export$353f5b6fc5456de1, {
 				excludeFromTabOrder: true,
 				"aria-label": t(($) => isOpen ? $.ui.closeAlt : $.ui.openAlt),
-				className: clsx("self-stretch pl-1.5 outline-none", inputSizeCva({ size })),
+				className: clsx("flex shrink-0 items-center justify-center self-stretch py-0! pl-1.5 outline-none disabled:text-inherit", inputSizeCva({ size })),
 				isDisabled,
 				onPress: () => {
 					if (!isSearchable) setIsOpen(!isOpen);
@@ -1065,7 +889,7 @@ const SelectListBoxLoadingItem = ({ id, label, onLoadMore }) => {
 		className: selectListItemCva({}),
 		children: /* @__PURE__ */ jsx("div", {
 			ref,
-			className: "flex flex-1 justify-center text-interactive-primary-background",
+			className: "flex flex-1 justify-center text-interactive-subtle-primary-foreground",
 			children: /* @__PURE__ */ jsx(Spinner, {})
 		})
 	});
@@ -1404,7 +1228,7 @@ const FormFieldHeaderClose = ({ onClose }) => {
 		className: "shrink-0 focus-visible:outline-interactive-ring",
 		children: /* @__PURE__ */ jsx(IconSlot, {
 			icon: X,
-			className: "text-surface-default-foreground"
+			className: "text-content-secondary"
 		})
 	});
 };
@@ -1415,15 +1239,19 @@ const SelectListBoxSelectionBar = ({ className }) => {
 	const { onClear, onSelectAll } = SelectContext.useSelect();
 	return /* @__PURE__ */ jsxs("div", {
 		className: clsx("flex items-center justify-between border-border-default-subtle border-b px-4 py-3", className),
-		children: [/* @__PURE__ */ jsx(TextButton, {
+		children: [/* @__PURE__ */ jsx(Button, {
 			type: "button",
 			color: "primary",
 			onPress: onSelectAll,
+			variant: "text",
+			width: "hug",
 			children: t(($) => $.ui.select.selectAll)
-		}), /* @__PURE__ */ jsx(TextButton, {
+		}), /* @__PURE__ */ jsx(Button, {
 			type: "button",
 			color: "secondary",
 			onPress: onClear,
+			variant: "text",
+			width: "hug",
 			children: t(($) => $.ui.select.clearSelection)
 		})]
 	});
@@ -1573,7 +1401,7 @@ const SelectBase = (dProps) => {
 };
 //#endregion
 //#region src/components/inputs/Selection/shared/StaticSelectTrailingContent.tsx
-const StaticSelectTrailingContent = ({ trailingContent, hideDropdownIcon, size }) => {
+const StaticSelectTrailingContent = ({ trailingContent, hideDropdownIcon, size, isDisabled }) => {
 	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	if (!trailingContent && hideDropdownIcon) return null;
 	return /* @__PURE__ */ jsxs(Fragment$1, { children: [trailingContent && /* @__PURE__ */ jsx("div", {
@@ -1582,7 +1410,8 @@ const StaticSelectTrailingContent = ({ trailingContent, hideDropdownIcon, size }
 	}), !hideDropdownIcon ? /* @__PURE__ */ jsx("button", {
 		type: "button",
 		tabIndex: -1,
-		className: clsx("self-stretch border-0! pl-1.5 outline-none", inputSizeCva({ size })),
+		className: clsx("flex shrink-0 items-center justify-center self-stretch border-0! py-0! pl-1.5 outline-none disabled:text-inherit", inputSizeCva({ size })),
+		disabled: isDisabled,
 		"aria-hidden": "true",
 		children: /* @__PURE__ */ jsx(IconSlot, {
 			icon: ChevronDown,
@@ -1643,4 +1472,134 @@ const getStaticSelectValue = ({ items, value, selectionMode, initialSelection, m
 	};
 };
 //#endregion
-export { getKeyInteractionAction as a, createKeyInteractionsHandler as i, StaticSelectTrailingContent as n, useKeyInteractions as o, SelectBase as r, useDebounceCallback as s, getStaticSelectValue as t };
+//#region src/components/inputs/Selection/Select/Select.tsx
+function SelectInner({ renderStaticInput, isFormControlDisabled, list, ...inputProps }) {
+	const props = {
+		...inputProps,
+		items: list?.items ?? inputProps.items ?? [],
+		...list && {
+			isLoading: list.isLoading,
+			hasLoadMore: list.hasMore,
+			onLoadMore: () => list.loadMore(),
+			isClientSearchDisabled: true,
+			onSearchChange: (search) => {
+				list.setFilterText(search);
+				inputProps.onSearchChange?.(search);
+			}
+		}
+	};
+	const ui = UIConfig.useConfig();
+	const selectInputTagsContentWrapperCva = UIOverrides.useCva("select.tagsContentWrapperCva", selectInputTagsContentWrapperDefinition);
+	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.select.renderStaticInput ?? ui.renderStaticInput));
+	const rootRef = useRef(null);
+	const { renderRealInput, replayStaticInputChange, replayStaticInputPress } = useStaticInputHandoff({
+		inputRef: rootRef,
+		renderInput,
+		setRenderInput,
+		getFocusTarget: (root, _staticTarget, fromEnd) => fromEnd ? getStaticInputFocusTarget(root, true) : root.querySelector("[data-type='select-trigger'], input, button, [tabindex]")
+	});
+	const currentValue = props.value;
+	if (!renderInput && props.selectionMode !== "multiple" && !!props.showSelectionContent && currentValue != null) setRenderInput(true);
+	if (!renderInput && !!props.customTrigger) setRenderInput(true);
+	if (!renderInput) {
+		const as = props.as ?? ui.input.as;
+		const size = props.size ?? ui.input.size;
+		let isDisabled = !!props.isDisabled;
+		if (isFormControlDisabled) isDisabled = true;
+		const mode = props.selectionMode ?? ui.select.selectionMode;
+		const isMultiple = mode === "multiple";
+		const { selectedItem, displayValue, isEmpty } = getStaticSelectValue({
+			items: props.items,
+			value: currentValue,
+			selectionMode: mode,
+			initialSelection: props.initialSelection,
+			mapInitialToSelectItem: props.mapInitialToSelectItem,
+			showSelectionContent: props.showSelectionContent,
+			isDisabled,
+			collapseAfter: props.collapseAfter ?? ui.select.collapseAfter,
+			selectedTagsType: props.selectedTagsType ?? ui.select.selectedTagsType
+		});
+		const isSearchable = props.isSearchable ?? ui.select.isSearchable;
+		const trailingContent = /* @__PURE__ */ jsx(StaticSelectTrailingContent, {
+			trailingContent: props.trailingContent,
+			hideDropdownIcon: props.hideDropdownIcon,
+			isDisabled,
+			size
+		});
+		const placeholder = as === "floating" ? null : props.placeholder;
+		const inputValue = !isMultiple && selectedItem ? selectedItem.label : "";
+		const shouldRenderPlaceholderAfterValue = isMultiple && props.placeholder && !isEmpty;
+		const dataAttributes = {
+			dataIsEmpty: isEmpty,
+			dataIsFilled: !isEmpty,
+			dataIsDirty: props.isDirty,
+			dataIsRequired: props.isRequired,
+			dataIsDisabled: isDisabled,
+			dataDisabled: isDisabled,
+			dataInvalid: !!props.error,
+			dataHasSelection: !isEmpty,
+			dataHasSearch: false
+		};
+		const buttonContent = as === "floating" && isEmpty || isMultiple && !isEmpty ? /* @__PURE__ */ jsx(Fragment$1, { children: "\xA0" }) : isEmpty ? /* @__PURE__ */ jsx("span", {
+			className: "block truncate text-content-muted empty:before:inline-block empty:before:content-['']",
+			children: placeholder
+		}) : /* @__PURE__ */ jsx("span", {
+			className: "block truncate",
+			children: displayValue
+		});
+		return /* @__PURE__ */ jsx(InputFrame, {
+			...props,
+			isDisabled,
+			isLoading: false,
+			className: clsx("group w-full", props.containerClassName),
+			inputClassName: clsx(props.className, props.inputClassName),
+			contentWrapperClassName: selectInputTagsContentWrapperCva({ isSearchable }),
+			contentGroup: "select",
+			labelPlacement: "content-row",
+			dataAttributes,
+			wrapTrailingContent: false,
+			onStaticInteract: renderRealInput,
+			onStaticPress: replayStaticInputPress,
+			leadingContent: props.leadingContent && /* @__PURE__ */ jsx("div", {
+				className: "ml-input-side-default flex shrink-0 items-center",
+				children: props.leadingContent
+			}),
+			onClear: () => props.onChange?.(isMultiple ? [] : null),
+			showClear: !isEmpty,
+			trailingContent,
+			children: (dataAttributeProps) => /* @__PURE__ */ jsxs(Fragment$1, { children: [isMultiple && !isEmpty && displayValue, isSearchable ? /* @__PURE__ */ jsx("input", {
+				disabled: isDisabled,
+				tabIndex: -1,
+				role: "combobox",
+				"aria-autocomplete": "list",
+				"aria-controls": `${dataAttributeProps.id}-listbox`,
+				"aria-expanded": false,
+				value: inputValue,
+				placeholder: shouldRenderPlaceholderAfterValue ? props.placeholder : placeholder ?? void 0,
+				className: clsx("min-w-0 w-full flex-1 bg-transparent outline-none placeholder:text-content-muted disabled:text-inherit", props.inputClassName),
+				onChange: (event) => replayStaticInputChange(event.target.value),
+				...dataAttributeProps,
+				"data-rac": true
+			}) : /* @__PURE__ */ jsx("button", {
+				type: "button",
+				disabled: isDisabled,
+				tabIndex: -1,
+				"data-type": "select-trigger",
+				className: clsx("w-full truncate bg-transparent text-start outline-none disabled:text-inherit", isMultiple && !isEmpty && "absolute inset-0 z-0"),
+				onClick: replayStaticInputPress,
+				...dataAttributeProps,
+				"data-rac": true,
+				children: buttonContent
+			})] })
+		});
+	}
+	return /* @__PURE__ */ jsx(SelectBase, {
+		...props,
+		ref: $a8ea2faf2ebe4d2f$re_export$mergeRefs(props.ref, rootRef)
+	});
+}
+function Select(props) {
+	return /* @__PURE__ */ jsx(SelectInner, { ...props });
+}
+//#endregion
+export { useKeyInteractions as a, getKeyInteractionAction as i, SelectInner as n, useDebounceCallback as o, createKeyInteractionsHandler as r, Select as t };

package/dist/{SelectBase-Omiq2D3M.d.ts → Select-DHYddedn.d.ts}

@@ -1,8 +1,8 @@
-import { t as BottomSheetProps } from "./BottomSheet-DbQuzfAB.js";
-import { n as FieldValues } from "./form.binding-DVJ5F0JE.js";
-import { t as ControlProps } from "./form.types-CecYaerF.js";
-import { n as FormFieldProps } from "./FormField-Byiehm9y.js";
-import { n as InputVariantProps } from "./input.cva-BsHgYa-L.js";
+import { t as BottomSheetProps } from "./BottomSheet-BQXSdxoX.js";
+import { n as FormFieldProps } from "./FormField-BIRMlgu4.js";
+import { n as InputVariantProps } from "./input.cva-L7jKDv6q.js";
+import { s as OmitDiscriminatedUnion } from "./common-UBFya8WY.js";
+import { t as AsyncList } from "./useAsyncList-Cu-Y8If2.js";
 import { FocusEventHandler, MouseEventHandler, ReactElement, ReactNode, Ref } from "react";
 import { Key } from "react-aria-components";
 import { AriaButtonProps } from "react-aria";
@@ -67,11 +67,6 @@ interface MultiSelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultI
   showSelectionContent?: never;
 }
 type GroupedSelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = MultiSelectProps<TKey, TInitialSelectItem> | SingleSelectProps<TKey, TInitialSelectItem>;
-type GroupedSelectControlProps<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = ({
-  selectionMode: MultiSelectProps["selectionMode"];
-} & ControlProps<MultiSelectProps<TKey, TInitialSelectItem>, TFieldValues>) | ({
-  selectionMode?: SingleSelectProps["selectionMode"];
-} & ControlProps<SingleSelectProps<TKey, TInitialSelectItem>, TFieldValues>);
 interface SelectNewItemProps {
   showNewItemOption?: boolean;
   newItemMinLength?: number;
@@ -93,4 +88,30 @@ interface SelectVirtualizationProps {
   };
 }
 //#endregion
-export { SelectAsyncProps as a, SingleSelectProps as c, MultiSelectProps as i, GroupedSelectControlProps as n, SelectBaseProps as o, GroupedSelectProps as r, SelectItem as s, DefaultInitialSelectItem as t };
+//#region src/components/inputs/Selection/Select/Select.d.ts
+type SelectList<TKey extends Key = Key> = Pick<AsyncList<SelectItem<TKey>>, "items" | "isLoading" | "hasMore" | "loadMore" | "setFilterText">;
+type SelectDataProps<TKey extends Key = Key> = {
+  items: SelectItem<TKey>[];
+  list?: never;
+} | {
+  items?: never;
+  list: SelectList<TKey>;
+  isLoading?: never;
+  hasLoadMore?: never;
+  onLoadMore?: never;
+  isClientSearchDisabled?: never;
+  ignoreInputValueFiltering?: never;
+};
+type SelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = OmitDiscriminatedUnion<SelectBaseProps<TKey, TInitialSelectItem>, "items"> & SelectDataProps<TKey> & {
+  field?: never;
+  renderStaticInput?: boolean;
+};
+type SelectInnerProps<TKey extends Key, TInitialSelectItem> = OmitDiscriminatedUnion<SelectProps<TKey, TInitialSelectItem>, "field"> & {
+  isFormControlDisabled?: boolean;
+};
+declare function SelectInner<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>({ renderStaticInput, isFormControlDisabled, list, ...inputProps }: SelectInnerProps<TKey, TInitialSelectItem>): import("react").JSX.Element;
+declare function Select<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: SelectProps<TKey, TInitialSelectItem> & {
+  field?: never;
+}): import("react").JSX.Element;
+//#endregion
+export { SelectProps as a, MultiSelectProps as c, SelectItem as d, SingleSelectProps as f, SelectList as i, SelectAsyncProps as l, SelectDataProps as n, DefaultInitialSelectItem as o, SelectInner as r, GroupedSelectProps as s, Select as t, SelectBaseProps as u };

package/dist/Select.bound-CJ-tCsmX.d.ts

@@ -0,0 +1,17 @@
+import { s as OmitDiscriminatedUnion } from "./common-UBFya8WY.js";
+import { a as SelectProps$1, c as MultiSelectProps, f as SingleSelectProps, n as SelectDataProps, o as DefaultInitialSelectItem, s as GroupedSelectProps } from "./Select-DHYddedn.js";
+import { n as FieldValues, t as FormControlProps } from "./form.types-C8P4sznq.js";
+import { ReactElement } from "react";
+import { Key } from "react-aria-components";
+//#region src/components/inputs/Selection/Select/Select.bound.d.ts
+type GroupedSelectControlProps<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = ({
+  selectionMode: "multiple";
+} & FormControlProps<MultiSelectProps<TKey, TInitialSelectItem>, TFieldValues>) | ({
+  selectionMode?: "single";
+} & FormControlProps<SingleSelectProps<TKey, TInitialSelectItem>, TFieldValues>);
+type ControlledSelectProps<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = OmitDiscriminatedUnion<SelectProps$1<TKey, TInitialSelectItem>, keyof GroupedSelectProps | "field" | "onBlur" | "defaultValue" | "items" | "list"> & SelectDataProps<TKey> & GroupedSelectControlProps<TFieldValues, TKey extends string ? string : TKey extends number ? number : TKey, TInitialSelectItem>;
+declare function SelectComponent<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: ControlledSelectProps<TFieldValues, TKey, TInitialSelectItem>): ReactElement;
+declare const Select: typeof SelectComponent;
+type SelectProps<TFieldValues extends FieldValues = FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = ControlledSelectProps<TFieldValues, TKey, TInitialSelectItem>;
+//#endregion
+export { Select as n, SelectProps as r, ControlledSelectProps as t };

package/dist/Select.bound-CgLKMzLn.js

@@ -0,0 +1,34 @@
+import { n as SelectInner } from "./Select-Br_3eecr.js";
+import { r as $a8ea2faf2ebe4d2f$re_export$mergeRefs } from "./import-D_3dPATF.js";
+import { t as FieldController } from "./form.binding-B-2id68q.js";
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/inputs/Selection/Select/Select.bound.tsx
+function SelectComponent({ renderStaticInput, ...props }) {
+	const { field, ref, ...innerProps } = props;
+	const controlWithOptions = field.form;
+	return /* @__PURE__ */ jsx(FieldController, {
+		control: field.form,
+		name: field.name,
+		onValueChange: field.onValueChange,
+		onBlur: field.onBlur,
+		render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(SelectInner, {
+			...innerProps,
+			ref: $a8ea2faf2ebe4d2f$re_export$mergeRefs(ref, field.ref),
+			value: field.value ?? (props.selectionMode === "multiple" ? [] : null),
+			onChange: (value) => {
+				field.onChange(value);
+				field.onValueCommit();
+			},
+			onBlur: field.onBlur,
+			isDirty,
+			isDisabled: field.disabled || props.isDisabled,
+			isFormControlDisabled: !!controlWithOptions._options?.disabled,
+			error: props.error ?? error?.message,
+			renderStaticInput
+		})
+	});
+}
+const Select = memo(SelectComponent);
+//#endregion
+export { Select as t };

package/dist/{SelectionIndicator-JblvLKCu.js → SelectionIndicator-B7C5Y0JM.js}

@@ -1,5 +1,5 @@
 import { createContext } from "react";
-//#region ../../node_modules/.bun/react-aria-components@1.21.1+67f6792bdf102c28/node_modules/react-aria-components/dist/private/SelectionIndicator.mjs
+//#region ../../node_modules/.bun/react-aria-components@1.22.1+67f6792bdf102c28/node_modules/react-aria-components/dist/private/SelectionIndicator.mjs
 const $91fe5e721c7f36c1$export$c9549807523555e0 = /*#__PURE__*/ createContext({ isSelected: false });
 //#endregion
 export { $91fe5e721c7f36c1$export$c9549807523555e0 as t };