import { t as uuid } from "./uuid.js";
import { a as IconSize, i as FormSize, n as AnalyticsId, r as FormOnColor } from "./constants2.js";
import { t as usePseudoClasses } from "./usePseudoClasses.js";
import { t as getColor } from "./color.js";
import { n as mergeRefs, t as isMutableRefObject } from "./refs.js";
import { t as Icon_default } from "./Icon.js";
import { t as Check_default } from "./Check.js";
import { t as useIdWithFallback } from "./useIdWithFallback.js";
import { t as getAriaDescribedBy } from "./accessibility.js";
import { t as ErrorWrapper_default } from "./ErrorWrapper.js";
import { r as renderLabelAsParent, t as getLabelText } from "./utils2.js";
import classNames from "classnames";
import { useEffect, useState } from "react";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import checkboxStyles from "./components/Checkbox/styles.module.scss";
const Checkbox = (props) => {
	const { className, checked = false, disabled, label, inputId = uuid(), onColor = FormOnColor.onwhite, name = inputId, size, errorText, error = !!errorText, errorTextId: errorTextIdProp, errorWrapperClassName, value = getLabelText(label), testId, required, onChange, ref } = props;
	const [isChecked, setIsChecked] = useState(checked);
	const errorTextId = useIdWithFallback(errorTextIdProp);
	const onWhite = onColor === FormOnColor.onwhite;
	const onGrey = onColor === FormOnColor.ongrey;
	const onBlueberry = onColor === FormOnColor.onblueberry;
	const onInvalid = error || onColor === FormOnColor.oninvalid;
	const onDark = onColor === FormOnColor.ondark;
	const large = size === FormSize.large;
	const { refObject, isFocused } = usePseudoClasses(isMutableRefObject(ref) ? ref : null);
	const mergedRefs = mergeRefs([ref, refObject]);
	const checkboxWrapperClasses = classNames(checkboxStyles["checkbox-wrapper"], { [checkboxStyles["checkbox-wrapper--large"]]: large });
	const checkboxLabelClasses = classNames(checkboxStyles["checkbox-label"], {
		[checkboxStyles["checkbox-label--disabled"]]: disabled,
		[checkboxStyles["checkbox-label--on-dark"]]: onDark,
		[checkboxStyles["checkbox-label--large"]]: large,
		[checkboxStyles["checkbox-label__large--checked"]]: large && isChecked,
		[checkboxStyles["checkbox-label__large--focus"]]: large && isFocused,
		[checkboxStyles["checkbox-label__large--on-white"]]: large && onWhite,
		[checkboxStyles["checkbox-label__large--on-grey"]]: large && onGrey,
		[checkboxStyles["checkbox-label__large--on-blueberry"]]: large && onBlueberry,
		[checkboxStyles["checkbox-label__large--on-invalid"]]: large && onInvalid,
		[checkboxStyles["checkbox-label__large--disabled"]]: large && disabled
	});
	const checkboxClasses = classNames(checkboxStyles.checkbox, className);
	const checkboxIconWrapperClasses = classNames(checkboxStyles["checkbox__icon-wrapper"], {
		[checkboxStyles["checkbox__icon-wrapper--on-white"]]: onWhite,
		[checkboxStyles["checkbox__icon-wrapper--on-grey"]]: onGrey,
		[checkboxStyles["checkbox__icon-wrapper--on-invalid"]]: onInvalid,
		[checkboxStyles["checkbox__icon-wrapper--disabled"]]: disabled,
		[checkboxStyles["checkbox__icon-wrapper__regular--checked"]]: !large && isChecked,
		[checkboxStyles["checkbox__icon-wrapper__regular--invalid"]]: !large && isChecked && onInvalid,
		[checkboxStyles["checkbox__icon-wrapper__regular--on-dark"]]: !large && isChecked && onDark,
		[checkboxStyles["checkbox__icon-wrapper__large--checked"]]: large && isChecked,
		[checkboxStyles["checkbox__icon-wrapper__large--invalid"]]: large && onInvalid,
		[checkboxStyles["checkbox__icon-wrapper--on-dark"]]: onDark,
		[checkboxStyles["checkbox__icon-wrapper--on-blueberry"]]: onBlueberry,
		[checkboxStyles["checkbox__icon-wrapper--invalid"]]: onInvalid,
		[checkboxStyles["checkbox__icon-wrapper__large--invalid"]]: large && isChecked && onInvalid,
		[checkboxStyles["checkbox__icon-wrapper__large--disabled"]]: disabled && large && isChecked,
		[checkboxStyles["checkbox__icon-wrapper__large--checked--invalid"]]: large && isChecked && onInvalid,
		[checkboxStyles["checkbox__icon-wrapper__large--checked--disabled"]]: disabled && large && isChecked
	});
	const labelTextClasses = classNames(checkboxStyles["checkbox-label__text"], {
		[checkboxStyles["checkbox-label__text__large--checked"]]: large && isChecked,
		[checkboxStyles["checkbox-label__text__large--invalid"]]: large && isChecked && onInvalid,
		[checkboxStyles["checkbox-label__text--on-dark"]]: onDark,
		[checkboxStyles["checkbox-label__text--disabled"]]: disabled
	});
	let iconColor = getColor("white");
	if (onDark || large && isChecked) iconColor = getColor("blueberry", 900);
	if (onInvalid && large && isChecked) iconColor = getColor("white");
	if (disabled) iconColor = getColor("neutral", 700);
	useEffect(() => {
		setIsChecked(checked);
	}, [checked]);
	const onChangeHandler = (e) => {
		if (onChange) onChange(e);
		setIsChecked(!isChecked);
	};
	const getLabelContent = () => {
		return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("input", {
			id: inputId,
			name,
			className: checkboxClasses,
			type: "checkbox",
			checked: isChecked,
			disabled,
			value,
			ref: mergedRefs,
			"aria-describedby": getAriaDescribedBy(props, errorTextId),
			"aria-invalid": error,
			required,
			onChange: onChangeHandler
		}), /* @__PURE__ */ jsx("span", {
			className: checkboxIconWrapperClasses,
			children: isChecked && /* @__PURE__ */ jsx(Icon_default, {
				color: iconColor,
				className: checkboxStyles["checkbox__icon"],
				svgIcon: Check_default,
				size: IconSize.XSmall
			})
		})] });
	};
	return /* @__PURE__ */ jsx(ErrorWrapper_default, {
		className: errorWrapperClassName,
		errorText,
		errorTextId,
		children: /* @__PURE__ */ jsx("div", {
			"data-testid": testId,
			"data-analyticsid": AnalyticsId.Checkbox,
			className: checkboxWrapperClasses,
			children: renderLabelAsParent({
				label,
				children: getLabelContent(),
				inputId,
				onColor,
				labelClassName: checkboxLabelClasses,
				labelTextClassName: labelTextClasses,
				sublabelWrapperClassName: checkboxStyles["checkbox-sublabel-wrapper"],
				large,
				afterLabelChildrenClassName: checkboxStyles["checkbox-afterlabelchildren-wrapper"]
			})
		})
	});
};
var Checkbox_default = Checkbox;
export { Checkbox_default as n, Checkbox as t };

//# sourceMappingURL=Checkbox.js.map