"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { forwardRef, useContext, createContext, useId } from "react";
import { ExperimentalBaseCheckable, ExperimentalBaseCheckableBox, ExperimentalBaseCheckableLabel } from "./BaseCheckable.js";
import { splitProps } from "../utils/splitProps.js";
import { classNames } from "../utils/classNames.js";
const ExperimentalRadioRoot = forwardRef(
  ({
    size,
    children: label,
    "aria-label": ariaLabel,
    "aria-labelledby": ariaLabelledBy,
    name: passedName,
    value,
    checked: controlledChecked,
    defaultChecked,
    onChange,
    disabled = false,
    className,
    ...props
  }, forwardedRef) => {
    const { rootProps, nestedProps } = splitProps(props);
    const groupContext = useContext(ExperimentalRadioGroupContext);
    const name = passedName ?? (groupContext == null ? void 0 : groupContext.name);
    return /* @__PURE__ */ jsx(
      ExperimentalBaseCheckable,
      {
        size,
        label,
        "aria-label": ariaLabel,
        "aria-labelledby": ariaLabelledBy,
        "data-name": name,
        "data-value": value,
        checked: controlledChecked ?? defaultChecked,
        disabled,
        className: classNames(["gds-radio", className]),
        ...rootProps,
        children: ({ checkableProps }) => /* @__PURE__ */ jsxs(ExperimentalBaseCheckableBox, { className: "rounded-full", children: [
          /* @__PURE__ */ jsx(
            "input",
            {
              ref: forwardedRef,
              type: "radio",
              name,
              value,
              checked: controlledChecked,
              defaultChecked,
              onChange: (event) => onChange == null ? void 0 : onChange(event.target.checked),
              disabled,
              className: "nested/checkable",
              ...checkableProps,
              ...nestedProps
            }
          ),
          /* @__PURE__ */ jsx(
            "span",
            {
              className: `
                rounded-full bg-white transition
                @state-unchecked/checkable:opacity-0
                @state-disabled/checkable:bg-space-700
                @prop-size-small/checkable:size-1
                @prop-size-medium/checkable:size-1.5
                @prop-size-large/checkable:size-2
              `
            }
          )
        ] })
      }
    );
  }
);
ExperimentalRadioRoot.displayName = "ExperimentalRadio";
const ExperimentalRadioGroupContext = createContext(null);
const ExperimentalRadioGroup = forwardRef(
  ({ name: passedName, className, children, ...props }, forwardedRef) => {
    const uniqueId = useId();
    const name = passedName ?? `gds-radio-${uniqueId}`;
    return /* @__PURE__ */ jsx(ExperimentalRadioGroupContext.Provider, { value: { name }, children: /* @__PURE__ */ jsx("div", { ref: forwardedRef, "data-name": name, className, ...props, children }) });
  }
);
ExperimentalRadioGroup.displayName = "ExperimentalRadio.Group";
const ExperimentalRadioArea = forwardRef(
  ({ className, ...props }, forwardedRef) => {
    return /* @__PURE__ */ jsx(
      ExperimentalBaseCheckableLabel,
      {
        ref: forwardedRef,
        className: classNames(["gds-radio-area", className]),
        ...props
      }
    );
  }
);
ExperimentalRadioArea.displayName = "ExperimentalRadio.Area";
export {
  ExperimentalRadioArea,
  ExperimentalRadioGroup,
  ExperimentalRadioRoot
};
