import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
var SvgIcon = React.forwardRef(function SvgIcon(props, ref) {
  var children = props.children,
      className = props.className,
      color = props.color,
      Component = props.component,
      fontSize = props.fontSize,
      nativeColor = props.nativeColor,
      titleAccess = props.titleAccess,
      viewBox = props.viewBox,
      prefixCls = props.prefixCls,
      size = props.size,
      other = _objectWithoutProperties(props, ["children", "className", "color", "component", "fontSize", "nativeColor", "titleAccess", "viewBox", "prefixCls", "size"]);

  return React.createElement(Component, _extends({
    className: classNames(prefixCls, "".concat(prefixCls, "-").concat(size), className),
    focusable: "false",
    viewBox: viewBox,
    color: nativeColor,
    "aria-hidden": titleAccess ? 'false' : 'true',
    role: titleAccess ? 'img' : 'presentation',
    ref: ref
  }, other), children, titleAccess ? React.createElement("title", null, titleAccess) : null);
});
SvgIcon.propTypes = {
  /**
   * @ignore
   */
  className: PropTypes.string,

  /**
   * The component used for the root node.
   * Either a string to use a DOM element or a component.
   */
  component: PropTypes.elementType,

  /**
   * Applies a color attribute to the SVG element.
   */
  nativeColor: PropTypes.string,

  /**
   * The shape-rendering attribute. The behavior of the different options is described on the
   * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering).
   * If you are having issues with blurry icons you should investigate this property.
   */
  shapeRendering: PropTypes.string,

  /**
   * Provides a human-readable title for the element that contains it.
   * https://www.w3.org/TR/SVG-access/#Equivalent
   */
  titleAccess: PropTypes.string,

  /**
   * Allows you to redefine what the coordinates without units mean inside an SVG element.
   * For example, if the SVG element is 500 (width) by 200 (height),
   * and you pass viewBox="0 0 50 20",
   * this means that the coordinates inside the SVG will go from the top left corner (0,0)
   * to bottom right (50,20) and each unit will be worth 10px.
   */
  viewBox: PropTypes.string
};
SvgIcon.defaultProps = {
  prefixCls: 'ne-svg-icon',
  color: 'inherit',
  component: 'svg',
  fontSize: 'default',
  size: 'medium',
  viewBox: '0 0 24 24'
};
export default SvgIcon;