import { jsx } from "react/jsx-runtime";
import * as React from "react";
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
import { Circle } from "lucide-react";
import { cva } from "class-variance-authority";
import { cn } from "../../lib/utils.js";
import { useResolvedFieldMode, useFieldContext, useResolvedFieldSize, useResolvedFieldDisabled } from "../Field/field-context.js";
import { SelectionItem } from "../SelectionControl/selection-item.js";
import { EMPTY_DISPLAY, fieldWrapperStyles } from "../Field/field-wrapper.js";
const RadioGroupReadonlyContext = React.createContext(false);
function findSelectedRadioLabel(children, selectedValue) {
  let selectedLabel = null;
  React.Children.forEach(children, (child) => {
    if (!React.isValidElement(child)) return;
    const cProps = child.props;
    if (cProps.value === selectedValue && cProps.value !== void 0) {
      selectedLabel = cProps.label ?? selectedValue;
      return;
    }
    const control = cProps.control;
    if (React.isValidElement(control)) {
      const controlValue = control.props.value;
      if (controlValue === selectedValue) {
        selectedLabel = cProps.label ?? selectedValue;
      }
    }
  });
  return selectedLabel;
}
const RadioGroup = React.forwardRef(({ className, mode, variant: _chrome, value, defaultValue, ...props }, ref) => {
  const resolvedMode = useResolvedFieldMode({ mode, disabled: props.disabled });
  const fieldCtx = useFieldContext();
  const resolvedBoxSize = useResolvedFieldSize(void 0, "md");
  if (resolvedMode === "display") {
    const selectedValue = value ?? defaultValue;
    if (!selectedValue) {
      return /* @__PURE__ */ jsx("div", { role: "group", className: cn("grid", className), children: /* @__PURE__ */ jsx("span", { className: "text-fg-muted", children: EMPTY_DISPLAY }) });
    }
    const selectedLabel = findSelectedRadioLabel(props.children, selectedValue);
    return /* @__PURE__ */ jsx("div", { role: "group", className: cn("grid", className), children: /* @__PURE__ */ jsx("span", { className: "text-foreground", children: selectedLabel ?? selectedValue }) });
  }
  if (resolvedMode === "readonly" && (fieldCtx == null ? void 0 : fieldCtx.hasFieldWrapper) === true) {
    const selectedValue = value ?? defaultValue;
    const selectedLabel = selectedValue ? findSelectedRadioLabel(props.children, selectedValue) : null;
    const boxSize = resolvedBoxSize;
    return /* @__PURE__ */ jsx(
      "div",
      {
        role: "radiogroup",
        "aria-readonly": "true",
        "aria-labelledby": fieldCtx == null ? void 0 : fieldCtx.labelId,
        "aria-invalid": (fieldCtx == null ? void 0 : fieldCtx.invalid) || void 0,
        "data-readonly": "true",
        tabIndex: 0,
        className: cn(
          fieldWrapperStyles({ size: boxSize, mode: "readonly", variant: "default" }),
          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
          className
        ),
        children: selectedValue ? /* @__PURE__ */ jsx("span", { className: "text-foreground", children: selectedLabel ?? selectedValue }) : /* @__PURE__ */ jsx("span", { className: "text-fg-muted", children: EMPTY_DISPLAY })
      }
    );
  }
  return /* @__PURE__ */ jsx(RadioGroupReadonlyContext.Provider, { value: resolvedMode === "readonly", children: /* @__PURE__ */ jsx(
    RadioGroupPrimitive.Root,
    {
      className: cn("grid", className),
      value,
      defaultValue,
      ...props,
      disabled: resolvedMode === "disabled",
      ref
    }
  ) });
});
RadioGroup.displayName = "RadioGroup";
RadioGroup.fieldLayout = "block";
const radioItemVariants = cva(
  [
    "grid place-content-center shrink-0 rounded-full",
    "border border-border bg-surface",
    "transition-colors duration-150",
    "hover:border-border-hover",
    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
    "data-[state=checked]:border-primary data-[state=checked]:text-primary",
    "data-[state=checked]:hover:border-primary-hover data-[state=checked]:hover:text-primary-hover",
    "disabled:cursor-not-allowed disabled:bg-disabled disabled:border-transparent disabled:hover:border-transparent",
    "disabled:data-[state=checked]:bg-disabled disabled:data-[state=checked]:border-transparent disabled:data-[state=checked]:text-fg-disabled",
    // readOnly：鎖定互動但維持 checked/unchecked 視覺
    "data-[readonly=true]:pointer-events-none data-[readonly=true]:cursor-default",
    "data-[readonly=true]:hover:border-border"
  ],
  {
    variants: {
      size: {
        sm: "h-4 w-4",
        md: "h-4 w-4",
        lg: "h-5 w-5"
      }
    },
    defaultVariants: {
      size: "md"
    }
  }
);
const dotSize = { sm: 8, md: 8, lg: 10 };
const RadioGroupItem = React.forwardRef(
  ({
    className,
    size,
    label,
    icon,
    avatar,
    description,
    readOnly = false,
    disabled,
    id: idProp,
    ...props
  }, ref) => {
    const sizeKey = size ?? "md";
    const dotPx = dotSize[sizeKey];
    const resolvedDisabled = useResolvedFieldDisabled(disabled);
    const groupReadonly = React.useContext(RadioGroupReadonlyContext);
    const effectiveReadonly = readOnly || groupReadonly;
    const generatedId = React.useId();
    const inputId = idProp ?? generatedId;
    const rootEl = /* @__PURE__ */ jsx(
      RadioGroupPrimitive.Item,
      {
        id: inputId,
        ref,
        disabled: resolvedDisabled,
        "aria-readonly": effectiveReadonly || void 0,
        "data-readonly": effectiveReadonly || void 0,
        tabIndex: effectiveReadonly ? -1 : void 0,
        className: cn(radioItemVariants({ size }), className),
        ...props,
        children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, { className: "grid place-content-center", children: /* @__PURE__ */ jsx(
          Circle,
          {
            style: { width: dotPx, height: dotPx },
            className: "fill-current text-current"
          }
        ) })
      }
    );
    if (label == null) return rootEl;
    return /* @__PURE__ */ jsx(
      SelectionItem,
      {
        control: rootEl,
        label,
        description,
        icon,
        avatar,
        htmlFor: inputId,
        disabled: resolvedDisabled,
        size: sizeKey
      }
    );
  }
);
RadioGroupItem.displayName = "RadioGroupItem";
const radioGroupMeta = {
  component: "RadioGroup",
  family: null,
  // self-contained primitive(對齊 spec frontmatter self-contained + body L31;非 Family 4 — field-controls.spec.md 成員名單不含 RadioGroup)
  variants: {},
  sizes: {
    sm: { fieldHeight: 28, iconSize: 16, typography: "body" },
    md: { fieldHeight: 32, iconSize: 16, typography: "body" },
    lg: { fieldHeight: 36, iconSize: 20, typography: "body-lg" }
  },
  states: ["default", "hover", "active", "focus-visible", "disabled"],
  tokens: {
    bg: ["bg-disabled", "bg-surface"],
    fg: ["text-fg-disabled", "text-fg-secondary", "text-foreground", "text-primary"],
    ring: ["ring-ring"]
  },
  defaultSize: "md"
};
export {
  RadioGroup,
  RadioGroupItem,
  radioGroupMeta,
  radioItemVariants
};
//# sourceMappingURL=radio-group.js.map
