import {
  ErrorMessage
} from "./chunk-MZJT3USG.js";
import {
  Stack
} from "./chunk-XH3OJQMW.js";
import {
  Label
} from "./chunk-ZN7OWLZY.js";
import {
  useValidationClasses
} from "./chunk-DYOFXXZD.js";
import {
  spaceDelimitedList
} from "./chunk-DTWRSP5P.js";

// src/components/Radio/RadioGroup.tsx
import classNames from "classnames/dedupe";
import {
  Children,
  cloneElement,
  isValidElement,
  useCallback,
  useEffect,
  useId,
  useRef,
  useState
} from "react";
import { jsx, jsxs } from "react/jsx-runtime";
var getDefaultVal = (children, defaultValue) => {
  if (Array.isArray(children) && defaultValue) {
    const option = children?.find((item) => item.props.value === defaultValue);
    if (!option) return "";
    return option.props.value;
  }
  return "";
};
var RadioGroup = ({ ref, ...props }) => {
  const {
    label,
    isDisabled = false,
    isRequired,
    isInvalid,
    orientation = "vertical",
    className,
    errorMessage,
    children,
    defaultValue,
    value,
    isReadOnly,
    name,
    onChange,
    autoStack = false,
    ...rest
  } = props;
  const defaultSelected = getDefaultVal(children, value || defaultValue);
  const [selected, setSelected] = useState(defaultSelected);
  const overflowsRef = useRef({});
  const [hasOverflow, setHasOverflow] = useState(false);
  useEffect(() => {
    if (value !== void 0) {
      setSelected(value);
    }
  }, [value]);
  const handleOverflow = useCallback(
    (radioValue, overflow) => {
      overflowsRef.current = {
        ...overflowsRef.current,
        [radioValue]: overflow
      };
      const anyOverflow = Object.values(overflowsRef.current).some(
        (o) => o.vertical || o.horizontal
      );
      if (anyOverflow !== hasOverflow) {
        setHasOverflow(anyOverflow);
      }
    },
    [hasOverflow]
  );
  const effectiveOrientation = autoStack && orientation === "horizontal" && hasOverflow ? "vertical" : orientation;
  const validationClasses = useValidationClasses({ isInvalid });
  const radioClasses = {
    "--is-disabled": isDisabled,
    "--is-required": typeof isRequired === "boolean" && isRequired,
    "--is-optional": typeof isRequired === "boolean" && !isRequired,
    [`--is-${effectiveOrientation}`]: true,
    [className || ""]: true
  };
  const radioGroupClasses = classNames(
    "mobius",
    "mobius-radio-group",
    radioClasses,
    validationClasses
  );
  const radioWrapperClasses = classNames("mobius-radio__wrapper", {
    [`--is-${effectiveOrientation}`]: true
  });
  const labelClasses = classNames(radioClasses, validationClasses);
  const errorMessageId = useId();
  const defaultNameAttrId = useId();
  const nameAttribute = name || defaultNameAttrId;
  const shouldErrorMessageShow = errorMessage ? errorMessageId : void 0;
  const describedBy = spaceDelimitedList([
    shouldErrorMessageShow,
    props["aria-describedby"]
  ]);
  const labelId = useId();
  return /* @__PURE__ */ jsx(
    "div",
    {
      ...rest,
      "aria-describedby": describedBy,
      "aria-disabled": isDisabled,
      "aria-errormessage": shouldErrorMessageShow,
      "aria-invalid": isInvalid,
      "aria-label": props["aria-label"],
      "aria-labelledby": props["aria-labelledby"] || labelId,
      "aria-orientation": effectiveOrientation,
      "aria-readonly": isReadOnly,
      "aria-required": isRequired,
      ref,
      className: radioGroupClasses,
      role: "radiogroup",
      children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
        label && /* @__PURE__ */ jsx(Label, { htmlFor: name, id: labelId, className: labelClasses, children: label }),
        /* @__PURE__ */ jsx("div", { className: radioWrapperClasses, children: Children.map(children, (child) => {
          if (isValidElement(child)) {
            const childValue = child.props.value;
            return cloneElement(
              child,
              {
                orientation: effectiveOrientation,
                groupDisabled: isDisabled,
                name: nameAttribute,
                selected: selected || defaultSelected,
                // in case state does not update
                setSelected,
                isRequired,
                "aria-describedby": describedBy,
                onChange,
                onOverflow: childValue ? (overflow) => handleOverflow(childValue, overflow) : void 0
              }
            );
          }
          return child;
        }) }),
        /* @__PURE__ */ jsx(ErrorMessage, { id: errorMessageId, errorMessage })
      ] })
    }
  );
};
RadioGroup.displayName = "RadioGroup";

export {
  RadioGroup
};
//# sourceMappingURL=chunk-2HUMNED2.js.map
