/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
"use client";
"use client";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require_runtime = require("../../../_virtual/_rolldown/runtime.cjs");
const require_styles_styler = require("../../../styles/styler.cjs");
const require_components_Box = require("../../Box.cjs");
const require_components_VStack = require("../../VStack.cjs");
const require_components_client_SpringMotionConfig = require("../SpringMotionConfig.cjs");
const require_components_client_Select_selectContext = require("./selectContext.cjs");
const require_components_client_Select_selectFieldStyles = require("./selectFieldStyles.cjs");
const require_components_client_Select_SelectHelpText = require("./SelectHelpText.cjs");
const require_components_client_Select_SelectTrigger = require("./SelectTrigger.cjs");
let react = require("react");
let react_jsx_runtime = require("react/jsx-runtime");
let lodash_isFunction_js = require("lodash/isFunction.js");
lodash_isFunction_js = require_runtime.__toESM(lodash_isFunction_js);
let _ariakit_react = require("@ariakit/react");
//#region src/components/client/Select/Select.tsx
const SelectRoot = (0, react.forwardRef)(function SelectRoot({ children, label, helpText, helperTextIcon, placeholder, name, size = "md", disabled, required, hasError, readOnly, width = "full", reduceMotion: forceReduceMotion, startIcon, endIcon, className, style, slotProps }, ref) {
	const value = (0, _ariakit_react.useStoreState)((0, _ariakit_react.useSelectContext)(), "value");
	const hasValue = value != null && value !== "";
	const hasHelpText = Boolean(helpText || helperTextIcon);
	const uid = `uds-select-${(0, react.useId)()}`;
	const helpTextId = hasHelpText ? `${uid}-help-text` : void 0;
	const triggerWrapperRef = (0, react.useRef)(null);
	const contextValue = (0, react.useMemo)(() => ({
		size,
		disabled,
		readOnly,
		required,
		hasError,
		width,
		reduceMotion: forceReduceMotion,
		uid,
		helpTextId,
		triggerWrapperRef
	}), [
		size,
		disabled,
		readOnly,
		required,
		hasError,
		width,
		forceReduceMotion,
		uid,
		helpTextId
	]);
	const { className: rootSlotClassName, ...rootSlotProps } = slotProps?.root ?? {};
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_Select_selectContext.SelectFieldContext.Provider, {
		value: contextValue,
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_VStack.VStack, {
			width,
			className: require_styles_styler.cx(require_components_client_Select_selectFieldStyles.getSelectRootClassName({
				size,
				hasValue,
				disabled,
				className
			}), rootSlotClassName),
			style,
			...rootSlotProps,
			children: [
				label && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_Box.Box, {
					spacingBottom: "2",
					columnGap: "0.5",
					alignItems: "flex-end",
					className: require_components_client_Select_selectFieldStyles.getSelectLabelClassName(size, hasValue),
					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
						htmlFor: uid,
						...slotProps?.label,
						children: (0, lodash_isFunction_js.default)(label) ? label() : label
					}), required && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
						className: require_components_client_Select_selectFieldStyles.getSelectLabelRequiredClassName(hasValue),
						children: "*"
					})]
				}),
				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_Select_SelectTrigger.SelectTrigger, {
					ref,
					placeholder,
					name,
					startIcon,
					endIcon,
					disabled,
					slotProps: slotProps?.trigger
				}),
				hasHelpText && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_Select_SelectHelpText.SelectHelpText, {
					helpText,
					helperTextIcon,
					slotProps: {
						helperText: slotProps?.helperText,
						helperTextIcon: slotProps?.helperTextIcon
					}
				}),
				children
			]
		})
	});
});
SelectRoot.displayName = "SelectRoot";
/**
* **⚙️ A composable Select component**
*
* @componentType Client component
*
* @description
* Select lets users pick one value from a list. Compose with `SelectContent` and
* `SelectItem`, similar to `Tabs` with `TabList` and `Tab`.
*
* @example
* ```tsx
* 'use client';
* import { Select, SelectContent, SelectItem } from '@yahoo/uds';
*
* <Select label="Country" placeholder="Select a country" defaultValue="us">
*   <SelectContent>
*     <SelectItem value="us">United States</SelectItem>
*     <SelectItem value="ca">Canada</SelectItem>
*   </SelectContent>
* </Select>
* ```
*/
const Select = (0, react.forwardRef)(function Select({ children, label, helpText, helperTextIcon, placeholder, name, size, disabled, required, hasError, readOnly, width, reduceMotion, startIcon, endIcon, className, style, slotProps, defaultValue = "", value, setValue: setValueProp, onChange, open: openProp, defaultOpen, setOpen: setOpenProp, ...providerProps }, ref) {
	const setValue = setValueProp ?? onChange;
	const isOpenControlled = openProp !== void 0;
	const [uncontrolledOpen, setUncontrolledOpen] = (0, react.useState)(defaultOpen ?? false);
	const open = isOpenControlled ? openProp : uncontrolledOpen;
	const handleSetOpen = (0, react.useCallback)((nextOpen) => {
		if (readOnly && isOpenControlled) return;
		if (nextOpen && (readOnly || disabled)) return;
		if (!isOpenControlled) setUncontrolledOpen(nextOpen);
		setOpenProp?.(nextOpen);
	}, [
		disabled,
		isOpenControlled,
		readOnly,
		setOpenProp
	]);
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_SpringMotionConfig.SpringMotionConfig, {
		reducedMotion: "user",
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ariakit_react.SelectProvider, {
			...value !== void 0 ? {
				...providerProps,
				value,
				setValue,
				open,
				setOpen: handleSetOpen
			} : {
				...providerProps,
				defaultValue,
				open,
				setOpen: handleSetOpen
			},
			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SelectRoot, {
				ref,
				label,
				helpText,
				helperTextIcon,
				placeholder,
				name,
				size,
				disabled,
				required,
				hasError,
				readOnly,
				width,
				reduceMotion,
				startIcon,
				endIcon,
				className,
				style,
				slotProps,
				children
			})
		})
	});
});
Select.displayName = "Select";
//#endregion
exports.Select = Select;
