@ntragas/pouncejstest/dist/esm/components/Radio/Radio.js

A collection of UI components from Panther labs

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import React from 'react';
import Box from '../Box';
import useRadioStyles from './useRadioStyles';

/**
 *  A Radio is a typical `radio` input. Under the hood it renders a typical `radio` element, so you
 *  can pass it as many native attrs as you wish.
 */
var Radio = /*#__PURE__*/React.forwardRef(function Radio(_ref, ref) {
  var checked = _ref.checked,
      label = _ref.label,
      disabled = _ref.disabled,
      invalid = _ref.invalid,
      hidden = _ref.hidden,
      readOnly = _ref.readOnly,
      rest = _objectWithoutPropertiesLoose(_ref, ["checked", "label", "disabled", "invalid", "hidden", "readOnly"]);

  var radioStyles = useRadioStyles({
    invalid,
    checked
  });
  return /*#__PURE__*/React.createElement(Box, {
    as: "label",
    display: "inline-flex",
    alignItems: "center",
    cursor: "pointer",
    fontSize: "medium",
    fontWeight: "medium",
    verticalAlign: "top",
    "aria-disabled": disabled,
    "aria-hidden": hidden,
    hidden: hidden
  }, /*#__PURE__*/React.createElement(Box, _extends({
    position: "relative",
    borderRadius: "circle",
    p: 2
  }, radioStyles), /*#__PURE__*/React.createElement(Box, _extends({
    ref: ref,
    as: "input",
    position: "absolute",
    cursor: "pointer",
    opacity: 0,
    type: "radio",
    readOnly: readOnly,
    "aria-readonly": readOnly,
    "aria-checked": checked,
    "aria-invalid": invalid,
    checked: checked,
    disabled: disabled
  }, rest))), label && /*#__PURE__*/React.createElement(Box, {
    as: "span",
    userSelect: "none"
  }, label));
});
export default /*#__PURE__*/React.memo(Radio);