"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { forwardRef, useContext, createContext, useId } from "react";
import { ExperimentalBaseCheckable, ExperimentalBaseCheckableBox, ExperimentalBaseCheckableLabel } from "./BaseCheckable.js";
import { classNames } from "../utils/classNames.js";
const ExperimentalRadioRoot = forwardRef(
  ({
    size,
    children: label,
    "aria-label": ariaLabel,
    "aria-labelledby": ariaLabelledBy,
    onChange,
    id,
    name: passedName,
    className,
    ...props
  }, ref) => {
    const groupContext = useContext(ExperimentalRadioGroupContext);
    const name = passedName ?? (groupContext == null ? void 0 : groupContext.name);
    return /* @__PURE__ */ jsx(
      ExperimentalBaseCheckable,
      {
        size,
        checkableId: id,
        label,
        "aria-label": ariaLabel,
        "aria-labelledby": ariaLabelledBy,
        className: classNames(["gds-radio", className]),
        children: ({ checkableProps }) => /* @__PURE__ */ jsxs(ExperimentalBaseCheckableBox, { className: "rounded-full", children: [
          /* @__PURE__ */ jsx(
            "input",
            {
              ref,
              type: "radio",
              name,
              onChange: (event) => onChange == null ? void 0 : onChange(event.target.checked),
              className: "nested/checkable",
              ...checkableProps,
              ...props
            }
          ),
          /* @__PURE__ */ jsx(
            "span",
            {
              className: `
                size-1.5 rounded-full bg-white opacity-0 transition
                group-has-nested-checked/checkable:opacity-100
                group-has-nested-disabled/checkable:bg-white/32
              `
            }
          )
        ] })
      }
    );
  }
);
ExperimentalRadioRoot.displayName = "ExperimentalRadio";
const ExperimentalRadioGroupContext = createContext(null);
const ExperimentalRadioGroup = forwardRef(
  ({ as: Element = "div", name: passedName, className, children, ...props }, ref) => {
    const autoName = `gds-radio-${useId()}`;
    const name = passedName ?? autoName;
    return /* @__PURE__ */ jsx(ExperimentalRadioGroupContext.Provider, { value: { name }, children: /* @__PURE__ */ jsx(Element, { ref, className: classNames(["gds-radio-group", className]), ...props, children }) });
  }
);
ExperimentalRadioGroup.displayName = "ExperimentalRadio.Group";
const ExperimentalRadioArea = forwardRef(
  ({ className, ...props }, ref) => {
    return /* @__PURE__ */ jsx(ExperimentalBaseCheckableLabel, { ref, className: classNames(["gds-radio-area", className]), ...props });
  }
);
ExperimentalRadioArea.displayName = "ExperimentalRadio.Area";
export {
  ExperimentalRadioArea,
  ExperimentalRadioGroup,
  ExperimentalRadioRoot
};
