"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { forwardRef } from "react";
import { ExperimentalBaseCheckable, ExperimentalBaseCheckableBox, ExperimentalBaseCheckableLabel } from "./BaseCheckable.js";
import { Check } from "../icons/Check.js";
import { classNames } from "../utils/classNames.js";
const ExperimentalCheckboxRoot = forwardRef(
  ({
    size,
    children: label,
    "aria-label": ariaLabel,
    "aria-labelledby": ariaLabelledBy,
    onChange,
    id,
    className,
    ...props
  }, ref) => {
    return /* @__PURE__ */ jsx(
      ExperimentalBaseCheckable,
      {
        size,
        checkableId: id,
        label,
        "aria-label": ariaLabel,
        "aria-labelledby": ariaLabelledBy,
        className: classNames(["gds-checkbox", className]),
        children: ({ checkableProps }) => /* @__PURE__ */ jsxs(ExperimentalBaseCheckableBox, { className: "rounded-4", children: [
          /* @__PURE__ */ jsx(
            "input",
            {
              ref,
              type: "checkbox",
              onChange: (event) => onChange == null ? void 0 : onChange(event.target.checked),
              className: "nested/checkable",
              ...checkableProps,
              ...props
            }
          ),
          /* @__PURE__ */ jsx(
            Check,
            {
              alt: "",
              size: 3,
              color: "white",
              className: `
                opacity-0 transition
                group-has-nested-checked/checkable:opacity-100
                group-has-nested-disabled/checkable:text-white/32
              `
            }
          )
        ] })
      }
    );
  }
);
ExperimentalCheckboxRoot.displayName = "ExperimentalCheckbox";
const ExperimentalCheckboxArea = forwardRef(
  ({ className, ...props }, ref) => {
    return /* @__PURE__ */ jsx(ExperimentalBaseCheckableLabel, { ref, className: classNames(["gds-checkbox-area", className]), ...props });
  }
);
ExperimentalCheckboxArea.displayName = "ExperimentalCheckbox.Area";
export {
  ExperimentalCheckboxArea,
  ExperimentalCheckboxRoot
};
