/*! © 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_client_Pressable = require("../../client/Pressable.cjs");
const require_components_Icon = require("../../Icon.cjs");
const require_components_Text = require("../../Text.cjs");
const require_components_HStack = require("../../HStack.cjs");
let react = require("react");
react = require_runtime.__toESM(react);
let react_jsx_runtime = require("react/jsx-runtime");
let _ariakit_react = require("@ariakit/react");
//#region src/components/experimental/client/SegmentedControl.tsx
function SegmentedControl({ options, value, onChange, label, textVariant = "label2" }) {
	const activeValue = value ?? options[0]?.value;
	const handleChange = (0, react.useCallback)((newValue) => {
		onChange?.(newValue);
	}, [onChange]);
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ariakit_react.RadioProvider, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_HStack.HStack, {
		asChild: true,
		spacing: "1",
		gap: "1",
		backgroundColor: "secondary",
		borderRadius: "full",
		display: "inline-flex",
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ariakit_react.RadioGroup, {
			"aria-label": label,
			defaultValue: activeValue,
			children: options?.map(({ label, value, startIcon, endIcon, disabled }) => {
				const isActive = value === activeValue;
				const iconVariant = isActive ? "fill" : "outline";
				const buttonStyles = require_styles_styler.getStyles({
					display: "flex",
					alignItems: "center",
					backgroundColor: isActive ? "primary" : void 0,
					spacingVertical: "1",
					spacingHorizontal: "3",
					columnGap: "1.5",
					borderWidth: "thin",
					borderRadius: "full",
					borderColor: isActive ? "muted" : "transparent",
					color: isActive ? "primary" : disabled ? "tertiary" : "muted",
					className: require_styles_styler.cx("uds-ring", disabled ? "cursor-not-allowed opacity-50 pointer-events-none" : "hover:bg-primary")
				});
				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ariakit_react.Radio, {
					value,
					"aria-label": label,
					"aria-checked": isActive,
					disabled,
					render: (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_client_Pressable.Pressable, {
						...props,
						onClick: () => !disabled && handleChange(value),
						className: buttonStyles,
						children: [
							startIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
								name: startIcon,
								variant: iconVariant,
								size: "sm",
								color: "current",
								"aria-hidden": "true"
							}),
							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
								variant: textVariant,
								color: "current",
								children: label
							}),
							endIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
								name: endIcon,
								variant: iconVariant,
								size: "sm",
								color: "current",
								"aria-hidden": "true"
							})
						]
					})
				}, value);
			})
		})
	}) });
}
SegmentedControl.displayName = "SegmentedControl";
//#endregion
exports.SegmentedControl = SegmentedControl;
