/*! ratio-ui · design system for knowledge sharing · https://github.com/losol/ratio-ui · (c) 2026 Losol AS · MPL-2.0 */
"use client";
import { cn } from "../../utils/cn.js";
import { Check, ChevronDown } from "../../icons/index.js";
import "react";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { Button, Label, ListBox, ListBoxItem, Popover, Select, SelectValue } from "react-aria-components";
//#region src/forms/Select/Select.tsx
/** Per-size trigger / icon / option metrics. */
var SIZE = {
	sm: {
		trigger: "px-2 py-1 text-xs rounded-md",
		icon: "h-3.5 w-3.5",
		item: "px-2 py-1 text-xs rounded"
	},
	md: {
		trigger: "px-2.5 py-1.5 text-sm rounded-lg",
		icon: "h-4 w-4",
		item: "px-2 py-1.5 text-sm rounded-md"
	},
	lg: {
		trigger: "px-3 py-2 text-base rounded-lg",
		icon: "h-5 w-5",
		item: "px-2.5 py-2 text-base rounded-md"
	}
};
var styles = {
	wrapper: "flex flex-col gap-1 w-full",
	label: "text-sm font-medium text-(--text) cursor-default",
	trigger: "w-full flex items-center justify-between gap-2 bg-card border text-(--text) transition-colors hover:border-(--primary) focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--focus-ring) disabled:opacity-70 disabled:cursor-not-allowed",
	value: "flex-1 truncate text-left text-(--text)",
	placeholder: "text-(--text-muted) italic",
	popover: "w-[--trigger-width] mt-1 rounded-lg bg-card border border-border-1 shadow-lg overflow-hidden",
	listBox: "max-h-60 overflow-auto p-1",
	itemBase: "flex items-center justify-between gap-2 cursor-pointer select-none text-(--text) outline-none transition-colors"
};
/**
* Select — an accessible dropdown built on React Aria's `Select`, with a
* token-driven, `sm | md | lg` skin. Single selection, controlled or
* uncontrolled, mirroring RAC's selection API.
*
* @example
* <Select
*   label="Discipline"
*   options={[
*     { value: 'logic', label: 'Logic' },
*     { value: 'ethics', label: 'Ethics' },
*   ]}
*   defaultSelectedKey="logic"
*   onSelectionChange={(value) => setField(value)}
* />
*/
var Select$1 = ({ options, label, placeholder = "Select…", size = "md", selectedKey, defaultSelectedKey, onSelectionChange, isDisabled, isRequired, isInvalid, name, onBlur, onFocus, onFocusChange, value, defaultValue, disabled, required, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, testId }) => {
	const controlledKey = selectedKey !== void 0 ? selectedKey : value;
	const selectionProps = controlledKey !== void 0 ? { selectedKey: controlledKey } : { defaultSelectedKey: defaultSelectedKey ?? defaultValue };
	return /* @__PURE__ */ jsxs(Select, {
		className: className || styles.wrapper,
		...selectionProps,
		onSelectionChange: (key) => onSelectionChange?.(key == null ? null : String(key)),
		onBlur,
		onFocus,
		onFocusChange,
		isDisabled: isDisabled ?? disabled,
		isRequired: isRequired ?? required,
		isInvalid,
		name,
		"aria-label": ariaLabel,
		"aria-labelledby": ariaLabelledBy,
		children: [
			label && /* @__PURE__ */ jsx(Label, {
				className: styles.label,
				children: label
			}),
			/* @__PURE__ */ jsxs(Button, {
				"data-testid": testId,
				className: cn(styles.trigger, SIZE[size].trigger, isInvalid ? "border-(--error-solid) hover:border-(--error-solid)" : "border-border-1"),
				children: [/* @__PURE__ */ jsx(SelectValue, {
					className: styles.value,
					children: ({ selectedText }) => /* @__PURE__ */ jsx("span", {
						className: selectedText ? "" : styles.placeholder,
						children: selectedText || placeholder
					})
				}), /* @__PURE__ */ jsx(ChevronDown, {
					className: cn(SIZE[size].icon, "shrink-0 text-(--text-subtle)"),
					"aria-hidden": "true"
				})]
			}),
			/* @__PURE__ */ jsx(Popover, {
				className: styles.popover,
				children: /* @__PURE__ */ jsx(ListBox, {
					className: styles.listBox,
					children: options.map((option) => /* @__PURE__ */ jsx(ListBoxItem, {
						id: option.value,
						textValue: option.label,
						isDisabled: option.disabled,
						className: ({ isFocused, isDisabled: itemDisabled }) => cn(styles.itemBase, SIZE[size].item, !itemDisabled && "hover:bg-card-hover", isFocused && "bg-card-hover", itemDisabled && "text-(--text-muted) cursor-not-allowed"),
						children: ({ isSelected }) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
							className: cn("truncate", isSelected && "font-medium"),
							children: option.label
						}), isSelected && /* @__PURE__ */ jsx(Check, {
							className: cn(SIZE[size].icon, "shrink-0 text-(--primary)"),
							"aria-hidden": "true"
						})] })
					}, option.value))
				})
			})
		]
	});
};
//#endregion
export { Select$1 as Select };

//# sourceMappingURL=Select.js.map