import { t as AsChildSlot_default } from "./AsChildSlot.js";
import classNames from "classnames";
import React, { useId } from "react";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import styles from "./components/Dropdown/SingleSelect/styles.module.scss";
const SingleSelectContext = React.createContext(null);
const useSingleSelect = () => React.useContext(SingleSelectContext);
const SingleSelectItem = (props) => {
	const { text, value, testId, asChild = false, children, disabled, defaultSelected, ref, ...rest } = props;
	const generatedId = useId();
	const inputId = props.inputId ?? generatedId;
	const group = useSingleSelect();
	const optionValue = typeof value === "string" && value.length > 0 ? value : inputId;
	const isSelected = group ? group.value === optionValue : false;
	const isDisabled = !!disabled || !!group?.disabled;
	const asChildSlotRef = React.useRef(null);
	React.useEffect(() => {
		if (defaultSelected && group && typeof group.value === "undefined") group.onValueChange?.(optionValue);
	}, [
		defaultSelected,
		group,
		optionValue
	]);
	const contentClasses = classNames(styles["single-select-item__content"], { [styles["single-select-item__content--disabled"]]: isDisabled });
	const dotClasses = classNames(styles["single-select-item__dot"], {
		[styles["single-select-item__dot--disabled"]]: isDisabled,
		[styles["single-select-item__dot--checked"]]: isSelected
	});
	const childElement = React.Children.toArray(children).filter(React.isValidElement)[0] ?? null;
	const selectThis = (e) => {
		if (isDisabled) return;
		if (group && group.value !== optionValue) group.onValueChange?.(optionValue, e);
	};
	const content = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
		className: dotClasses,
		"aria-hidden": true
	}), /* @__PURE__ */ jsx("span", { children: text })] });
	const Component = asChild ? AsChildSlot_default : "button";
	const childWithInjectedContent = childElement ? React.cloneElement(childElement, void 0, content) : null;
	const componentProps = asChild ? {
		ref: asChildSlotRef,
		elementRef: ref,
		className: contentClasses,
		disabled: isDisabled,
		onSelect: (e) => selectThis(e),
		ariaCurrent: isSelected ? "true" : void 0,
		children: childWithInjectedContent
	} : {
		...rest,
		type: "button",
		className: contentClasses,
		disabled: isDisabled,
		onClick: (e) => {
			e.preventDefault();
			selectThis(e);
		},
		onKeyDown: (e) => {
			if (e.key === "Enter") {
				e.preventDefault();
				selectThis(e);
			}
		},
		ref,
		"aria-disabled": isDisabled || void 0,
		"aria-current": isSelected ? "true" : void 0,
		children: content
	};
	return /* @__PURE__ */ jsx("div", {
		"data-testid": testId,
		className: styles["single-select-item"],
		children: /* @__PURE__ */ jsx(Component, { ...componentProps })
	});
};
SingleSelectItem.displayName = "Dropdown.SingleSelectItem";
var SingleSelectItem_default = SingleSelectItem;
export { useSingleSelect as i, SingleSelectItem_default as n, SingleSelectContext as r, SingleSelectItem as t };

//# sourceMappingURL=SingleSelectItem.js.map