@evg-b/evg-ui/dist/Radio/Radio.js

EVG-UI library inspired by Material Design.

import _extends from '@babel/runtime/helpers/extends';
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import React from 'react';
import PropTypes from 'prop-types';
import '@babel/runtime/helpers/slicedToArray';
import withStyles from '../styles/withStyles.js';
import '@babel/runtime/helpers/construct';
import '@babel/runtime/helpers/toConsumableArray';
import '@babel/runtime/helpers/defineProperty';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import classNames from 'classnames';
import SwitchBase from '../SwitchBase/SwitchBase.js';
import RadioButtonCircle from '../internal/icons/Radio/RadioButtonCircle.js';
import RadioButtonUnchecked from '../internal/icons/Radio/RadioButtonUnchecked.js';

var styles = {
  base: {
    position: 'relative'
  },
  iconChecked: {
    position: 'absolute',
    transform: 'scale(0)',
    transition: 'transform 100ms cubic-bezier(0.4, 0, 0.2, 1)'
  },
  checked: {
    '&:checked + $iconChecked': {
      transform: 'scale(1)'
    }
  }
};
/**
 * Радиокнопки позволяют пользователю выбрать один вариант из набора. 
 * Используйте для исключительного выбора, если вы считаете, что пользователю нужно видеть все доступные варианты.
*/

var Radio = /*#__PURE__*/React.forwardRef(function Radio(props, ref) {
  var classes = props.classes,
      className = props.className;
      props.children;
      var name = props.name,
      color = props.color,
      size = props.size,
      otherProps = _objectWithoutProperties(props, ["classes", "className", "children", "name", "color", "size"]);

  var RadioIcon = /*#__PURE__*/React.createElement(RadioButtonUnchecked, {
    size: size
  });
  var RadioCheckedIcon = /*#__PURE__*/React.createElement(RadioButtonCircle, {
    size: size,
    color: color,
    className: classNames(classes.iconChecked)
  });
  return /*#__PURE__*/React.createElement(SwitchBase, _extends({
    type: "radio",
    ref: ref,
    name: name,
    color: color,
    className: className,
    classes: {
      checked: classes.checked
    },
    icon: RadioIcon,
    iconChecked: RadioCheckedIcon
  }, otherProps));
});
Radio.propTypes = {
  /**
   * Объект содержит jss стили компонента.
  */
  classes: PropTypes.object,

  /**
   * Чтобы указать CSS классы, используйте этот атрибут.
  */
  className: PropTypes.string,

  /**
   * Это свойство не реализуется.
  */
  children: PropTypes.any,

  /**
   * Название компонента.
  */
  name: PropTypes.string,

  /**
   * Размер компонента.
  */
  size: PropTypes.oneOf(['small', 'medium', 'large', 'extra']),

  /**
   * Название цвета в разных форматах.
  */
  color: PropTypes.string
};
Radio.defaultProps = {
  name: 'radio',
  color: 'default',
  size: 'medium'
};
Radio.displayName = 'RadioEVG';
var Radio$1 = withStyles(styles)(Radio);

export default Radio$1;