import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
var _excluded = ["color", "size", "style", "aria-hidden", "viewBoxSize", "align", "children"];
import React from 'react';
import { forwardRefAndName } from "../../../lib/forwardRefAndName";
import { styles } from "../BaseIcon.styles";
export var BaseIcon = forwardRefAndName('BaseIcon', function (_ref, ref) {
  var color = _ref.color,
    size = _ref.size,
    style = _ref.style,
    _ref$ariaHidden = _ref['aria-hidden'],
    ariaHidden = _ref$ariaHidden === void 0 ? true : _ref$ariaHidden,
    _ref$viewBoxSize = _ref.viewBoxSize,
    viewBoxSize = _ref$viewBoxSize === void 0 ? 16 : _ref$viewBoxSize,
    _ref$align = _ref.align,
    align = _ref$align === void 0 ? 'center' : _ref$align,
    children = _ref.children,
    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
  var icon = /*#__PURE__*/
  React.createElement("svg", _extends({
    ref: ref,
    width: size || viewBoxSize,
    height: size || viewBoxSize,
    style: _extends({
      fill: color != null ? color : 'currentColor',
      marginBottom: align === 'none' || align === 'center' ? 0 : '-0.1875em',
      flexShrink: 0
    }, style),
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 " + viewBoxSize + " " + viewBoxSize,
    "aria-hidden": ariaHidden
  }, rest), children);
  if (align === 'center') {
    return /*#__PURE__*/React.createElement("span", {
      className: styles.centeredIcon()
    }, icon);
  }
  return icon;
});