/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
"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_IconSlot = require("../../IconSlot.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 motion_react = require("motion/react");
//#region src/components/client/Chip/ChipBase.tsx
const SIZE_DEFAULT = "md";
const VARIANT_DEFAULT = "primary";
const MAX_WIDTH_DEFAULT = 200;
const ChipBase = (0, react.forwardRef)(function ChipBase({ size = SIZE_DEFAULT, minWidth, maxWidth = MAX_WIDTH_DEFAULT, startIcon, endIcon, as: As = "div", reduceMotion: forceReduceMotion, disabled = false, className, slotProps, children, ...rest }, ref) {
	const cssAnimationDuration = (0, motion_react.useReducedMotion)() || forceReduceMotion ? "duration-0" : "duration-120";
	const { className: textClassName, ...textProps } = slotProps?.text ?? {};
	const { className: startIconClassName, ...startIconProps } = slotProps?.startIcon ?? {};
	const { className: endIconClassName, ...endIconProps } = slotProps?.endIcon ?? {};
	/**
	* Styles
	*/
	const classNames = (0, react.useMemo)(() => ({
		root: require_styles_styler.getStyles({
			chipSizeRoot: size,
			className: require_styles_styler.cx({
				"pointer-events-none": disabled,
				"cursor-default": disabled,
				"opacity-50": disabled
			}, "inline-flex", "items-center", cssAnimationDuration, "transition-[background-color,outline-color,box-shadow]", className)
		}),
		text: require_styles_styler.cx("truncate", "whitespace-nowrap", "text-center", "flex-1", textClassName),
		icon: require_styles_styler.getStyles({ chipSizeIcon: size })
	}), [
		className,
		cssAnimationDuration,
		disabled,
		size,
		textClassName
	]);
	const inlineStyles = (0, react.useMemo)(() => ({ root: {
		maxWidth: `${maxWidth}px`,
		...minWidth ? { minWidth: `${minWidth}px` } : {}
	} }), [maxWidth, minWidth]);
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_HStack.HStack, {
		asChild: true,
		ref,
		className: classNames.root,
		style: inlineStyles.root,
		...rest,
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(As, {
			disabled,
			children: [
				startIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
					icon: startIcon,
					iconProps: {
						variant: "fill",
						className: require_styles_styler.cx(classNames.icon, startIconClassName),
						...startIconProps
					}
				}),
				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
					as: "span",
					color: "current",
					variant: "inherit",
					className: classNames.text,
					...textProps,
					children
				}),
				endIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
					icon: endIcon,
					iconProps: {
						variant: "fill",
						className: require_styles_styler.cx(classNames.icon, endIconClassName),
						...endIconProps
					}
				})
			]
		})
	});
});
ChipBase.displayName = "ChipBase";
//#endregion
exports.ChipBase = ChipBase;
exports.VARIANT_DEFAULT = VARIANT_DEFAULT;
