import { a as IconSize, n as AnalyticsId, r as FormOnColor, t as AVERAGE_CHARACTER_WIDTH_PX } from "./constants2.js";
import { t as getColor } from "./color.js";
import { t as Icon_default } from "./Icon.js";
import { t as useIdWithFallback } from "./useIdWithFallback.js";
import { t as getAriaDescribedBy } from "./accessibility.js";
import { t as ErrorWrapper_default } from "./ErrorWrapper.js";
import { n as renderLabel } from "./utils2.js";
import { t as ChevronDown_default } from "./ChevronDown.js";
import classNames from "classnames";
import { jsx, jsxs } from "react/jsx-runtime";
import selectStyles from "./components/Select/styles.module.scss";
var getSelectMaxWidth = (characters) => {
	return `calc(${characters * 12}px + 2rem)`;
};
var getIconColor = (invalid, disabled) => {
	return disabled ? getColor("neutral", 500) : getColor(invalid ? "cherry" : "blueberry", 600);
};
const Select = (props) => {
	const { className, children, concept = "normal", disabled, error, errorText, errorTextId: errorTextIdProp, selectId: selectIdProp, errorWrapperClassName, label, name = props.selectId, onColor = FormOnColor.onwhite, testId, width, required, value, defaultValue, autoComplete = "off", wrapperClassName, ref, ...rest } = props;
	const selectId = useIdWithFallback(selectIdProp);
	const errorTextId = useIdWithFallback(errorTextIdProp);
	const onBlueberry = onColor === "onblueberry";
	const invalid = onColor === "oninvalid" || !!errorText || !!error;
	const iconColor = getIconColor(invalid, !!disabled);
	const maxWidth = width ? getSelectMaxWidth(width) : void 0;
	const selectInnerWrapperClasses = classNames(selectStyles["select-inner-wrapper"], {
		[selectStyles["select-inner-wrapper--transparent"]]: concept === "transparent",
		[selectStyles["select-inner-wrapper--on-blueberry"]]: onBlueberry,
		[selectStyles["select-inner-wrapper--invalid"]]: invalid,
		[selectStyles["select-inner-wrapper--disabled"]]: disabled
	}, className);
	const selectClasses = classNames(selectStyles.select, {
		[selectStyles["select--on-blueberry"]]: onBlueberry,
		[selectStyles["select--invalid"]]: invalid
	});
	const selectWrapperClasses = classNames(selectStyles["select-wrapper"], wrapperClassName);
	return /* @__PURE__ */ jsx(ErrorWrapper_default, {
		className: errorWrapperClassName,
		errorText,
		errorTextId,
		children: /* @__PURE__ */ jsxs("div", {
			"data-testid": testId,
			"data-analyticsid": AnalyticsId.Select,
			className: selectWrapperClasses,
			style: { maxWidth },
			children: [renderLabel({
				label,
				inputId: selectId,
				onColor
			}), /* @__PURE__ */ jsxs("div", {
				className: selectInnerWrapperClasses,
				"data-testid": testId + "-inner-wrapper",
				children: [/* @__PURE__ */ jsx(Icon_default, {
					className: selectStyles["select-arrow"],
					svgIcon: ChevronDown_default,
					color: iconColor,
					size: IconSize.XSmall,
					testId: testId + "-icon"
				}), /* @__PURE__ */ jsx("select", {
					...rest,
					"aria-invalid": !!invalid,
					id: selectId,
					name,
					className: selectClasses,
					disabled,
					ref,
					required,
					"aria-describedby": getAriaDescribedBy(props, errorTextId),
					"aria-required": !!required,
					value,
					defaultValue,
					autoComplete: autoComplete ? autoComplete : void 0,
					children
				})]
			})]
		})
	});
};
var Select_default$1 = Select;
export { Select as n, Select_default$1 as t };

//# sourceMappingURL=Select.js.map