import React from 'react';
import { d as _objectWithoutProperties, e as _extends } from './_rollupPluginBabelHelpers-b9ad31fa.js';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { T as Tooltip } from './index-6829ab1f.js';
import { color } from '@styled-system/color';
import { variant } from '@styled-system/variant';
import Box from './ui/box.js';
import './index.esm-f8e9e79f.js';

var _excluded = ["size", "onClick", "innerRef", "tooltip", "tooltipPosition", "prefixClassName", "className", "iconColor", "disabled", "hoverEffect"];
var sizeVariant = function sizeVariant() {
  return variant({
    prop: "size",
    variants: {
      big: {
        width: "28px",
        height: "28px"
      },
      small: {
        width: "20px",
        height: "20px"
      },
      extraSmall: {
        width: "12px",
        height: "12px"
      }
    }
  });
};
var iconOpacity = function iconOpacity(disabled, hoverEffect) {
  var opacity = 0.7;
  if (disabled) opacity = 0.2;else if (!hoverEffect) opacity = 1;
  return opacity;
};
var iconStyles = function iconStyles(_ref) {
  var disabled = _ref.disabled,
    hoverEffect = _ref.hoverEffect;
  return {
    width: 24,
    height: 24,
    svg: {
      width: "100%",
      height: "100%"
    },
    pointerEvents: disabled ? "none" : "auto",
    opacity: iconOpacity(disabled, hoverEffect),
    "&:hover": {
      opacity: disabled ? 0.2 : 1
    },
    padding: 0
  };
};
var Wrapper = styled(Box)(iconStyles, sizeVariant, color);
var IconWrapper = function IconWrapper(_ref2) {
  var size = _ref2.size,
    onClick = _ref2.onClick,
    innerRef = _ref2.innerRef,
    tooltip = _ref2.tooltip,
    tooltipPosition = _ref2.tooltipPosition,
    prefixClassName = _ref2.prefixClassName,
    className = _ref2.className,
    iconColor = _ref2.iconColor,
    disabled = _ref2.disabled,
    hoverEffect = _ref2.hoverEffect,
    props = _objectWithoutProperties(_ref2, _excluded);
  return /*#__PURE__*/React.createElement(Wrapper, _extends({}, props, {
    onClick: onClick,
    ref: innerRef,
    className: className,
    size: size,
    disabled: disabled,
    hoverEffect: hoverEffect
  }), tooltip ? /*#__PURE__*/React.createElement(Tooltip, {
    tooltip: tooltip,
    position: tooltipPosition,
    prefixClassName: "".concat(prefixClassName, "-tooltip"),
    themed: true
  }, props.children) : props.children);
};
IconWrapper.propTypes = {
  size: PropTypes.string,
  onClick: PropTypes.func,
  /** Passes the ref to the outermost div  */
  innerRef: PropTypes.func,
  /** Tooltip for the Icon */
  tooltip: PropTypes.string,
  /** Tooltip Positioning (TOP/BOTTOM) */
  tooltipPosition: PropTypes.string,
  /** The classname to be attached to the icon's outer most div */
  className: PropTypes.string,
  prefixClassName: PropTypes.string,
  disabled: PropTypes.bool,
  iconColor: PropTypes.string,
  hoverEffect: PropTypes.bool
};
IconWrapper.defaultProps = {
  disabled: false,
  hoverEffect: false
};
IconWrapper.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "IconWrapper",
  "props": {
    "disabled": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "type": {
        "name": "bool"
      },
      "required": false,
      "description": ""
    },
    "hoverEffect": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "type": {
        "name": "bool"
      },
      "required": false,
      "description": ""
    },
    "size": {
      "type": {
        "name": "string"
      },
      "required": false,
      "description": ""
    },
    "onClick": {
      "type": {
        "name": "func"
      },
      "required": false,
      "description": ""
    },
    "innerRef": {
      "type": {
        "name": "func"
      },
      "required": false,
      "description": "Passes the ref to the outermost div"
    },
    "tooltip": {
      "type": {
        "name": "string"
      },
      "required": false,
      "description": "Tooltip for the Icon"
    },
    "tooltipPosition": {
      "type": {
        "name": "string"
      },
      "required": false,
      "description": "Tooltip Positioning (TOP/BOTTOM)"
    },
    "className": {
      "type": {
        "name": "string"
      },
      "required": false,
      "description": "The classname to be attached to the icon's outer most div"
    },
    "prefixClassName": {
      "type": {
        "name": "string"
      },
      "required": false,
      "description": ""
    },
    "iconColor": {
      "type": {
        "name": "string"
      },
      "required": false,
      "description": ""
    }
  }
};

export { IconWrapper as I };
