function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React from "react";
import Text from "../../atoms/text/text";
import Pressable from "../../atoms/pressable/pressable";
import { useMolecularComponentConfig } from "../../../hooks/useMolecularComponentConfig";
import Stack from "../../atoms/stack/stack";
import { boxStyleFunctions } from "../../../theme/src/style-functions";
import { useRadioGroup } from "./radio-group";
import { useCheckedState } from "../../../hooks/state/useCheckedState";
import { useInvalidState } from "../../../hooks/state/useInvalidState";
import Center from "../../atoms/center/center";
import Box from "../../atoms/box/box";
/** The Radio component is used when only one choice may be selected in a series of options. **/
const Radio = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(({
  children,
  onPress = () => {},
  ...rest
}, radioRef) => {
  const {
    size,
    variant,
    isDisabled,
    colorScheme,
    radioGroupValue,
    setRadioGroupValue
  } = useRadioGroup();

  // Overwrite props from radio group
  rest.size = rest.size ?? size;
  rest.variant = rest.variant ?? variant;
  rest.isDisabled = rest.isDisabled ?? isDisabled;
  rest.colorScheme = rest.colorScheme ?? colorScheme;
  const isRadioInGroup = setRadioGroupValue !== undefined;
  const isRadioChecked = isRadioInGroup ? radioGroupValue === rest.value && rest.value !== undefined : rest.isChecked;
  const molecularProps = useMolecularComponentConfig("Radio", rest, {
    size: rest.size,
    variant: rest.variant
  }, rest.colorScheme, boxStyleFunctions, "container", "container", "container");
  const {
    atoms
  } = molecularProps;

  // Use state for dynamic style
  const {
    propsWithCheckedStyles: propsWithCheckedStylesForOuterBox
  } = useCheckedState(atoms.outerBox, boxStyleFunctions, "molecule", true, isRadioChecked);
  atoms.outerBox = propsWithCheckedStylesForOuterBox;
  const {
    propsWithInvalidStyles
  } = useInvalidState(atoms.outerBox, boxStyleFunctions, "molecule", true, rest.isInvalid);
  atoms.outerBox = propsWithInvalidStyles;
  const {
    propsWithCheckedStyles: propsWithCheckedStylesForInnerBox
  } = useCheckedState(atoms.innerBox, boxStyleFunctions, "molecule", true, isRadioChecked);
  atoms.innerBox = propsWithCheckedStylesForInnerBox;

  // OTHER METHODS
  const radioPressHandler = () => {
    if (isRadioInGroup) {
      setRadioGroupValue(rest.value);
      if (onPress) onPress();
    }
    if (onPress) onPress();
  };

  // RENDER METHODS
  return /*#__PURE__*/React.createElement(Pressable, _extends({}, atoms.container, {
    ref: radioRef,
    onPress: radioPressHandler,
    accessible: true,
    accessibilityRole: "radio",
    isDisabled: rest.isDisabled,
    accessibilityLabel: rest.accessibilityLabel ? rest.accessibilityLabel : children,
    accessibilityState: {
      disabled: rest.isDisabled,
      checked: isRadioChecked
    },
    accessibilityHint: rest.accessibilityHint
  }), /*#__PURE__*/React.createElement(Stack, {
    spacing: rest.spacing || atoms.container.spacing,
    direction: "horizontal"
  }, /*#__PURE__*/React.createElement(Center, atoms.outerBox, /*#__PURE__*/React.createElement(Box, atoms.innerBox)), !!children && /*#__PURE__*/React.createElement(Text, atoms.text, children)));
}));
Radio.displayName = "Radio";
export default Radio;
//# sourceMappingURL=radio.js.map