import _noop from "lodash/fp/noop";
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
import React, { useCallback, useState, useMemo } from 'react';
import classnames from 'classnames';
import Link from '../link';
import FaIcon, { DEFAULT_ICON_COLOR } from '../icon';
import { ICONS } from '../../util/button-icons';
import ToolTip from '../tooltip';
import propTypes from './types';
import style from './style.css';
const getButtonContent = (icon, content, hovered, hoverBackgroundColor, hoverColor) => {
  const {
    type,
    faIcon,
    position
  } = icon || {
    type: '',
    position: ''
  };
  const Icon = type && ICONS[type];
  if (!Icon && !faIcon) {
    return /*#__PURE__*/React.createElement("div", {
      className: style.buttonContent
    }, /*#__PURE__*/React.createElement("span", {
      className: style.label
    }, content));
  }
  const iconComponent = faIcon ? /*#__PURE__*/React.createElement(FaIcon, {
    iconName: faIcon.name,
    iconColor: hovered && hoverColor ? hoverColor : faIcon.color ?? DEFAULT_ICON_COLOR,
    // eslint-disable-next-line no-nested-ternary
    backgroundColor: !faIcon?.backgroundColor ? null : hovered && hoverBackgroundColor ? hoverBackgroundColor : faIcon.backgroundColor,
    size: {
      faSize: faIcon.size,
      wrapperSize: faIcon.size
    },
    customStyle: faIcon.customStyle
  }) : /*#__PURE__*/React.createElement(Icon, {
    className: style.icon,
    theme: "coorpmanager"
  });
  return /*#__PURE__*/React.createElement("div", {
    className: style.buttonContent
  }, position === 'left' ? iconComponent : null, content ? /*#__PURE__*/React.createElement("span", {
    className: style.label
  }, content) : null, position === 'right' ? iconComponent : null);
};
const ButtonLink = props => {
  const {
    type,
    usage = 'button',
    label,
    content,
    hoverBackgroundColor,
    hoverColor,
    disabled = false,
    icon,
    'data-name': dataName,
    'data-testid': dataTestId = 'button-link',
    'aria-label': ariaLabel,
    tooltipText,
    tooltipPlacement = 'left',
    link,
    onClick = _noop,
    onKeyDown = _noop,
    className,
    customStyle,
    useTitle = true
  } = props;
  const styleButton = classnames(link && style.link, className, style.button, !label && style.iconButton, type === 'primary' && style.primary, type === 'secondary' && style.secondary, type === 'tertiary' && style.tertiary, type === 'text' && style.text, type === 'dangerous' && style.dangerous, disabled && style.disabled);
  const [hovered, setHovered] = useState(false);
  const handleOnClick = useCallback(event => onClick(event), [onClick]);
  const handleOnKeyDown = useCallback(event => onKeyDown(event), [onKeyDown]);
  const handleMouseOver = useCallback(() => {
    setHovered(true);
  }, [setHovered]);
  const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);
  const TooltipContent = useCallback(() => /*#__PURE__*/React.createElement("span", {
    className: style.tooltipContentWrapper
  }, tooltipText || ariaLabel), [tooltipText, ariaLabel]);
  const renderToolTip = () => {
    const closeToolTipInformationTextAriaLabel = tooltipText || ariaLabel;
    if (!closeToolTipInformationTextAriaLabel) return null;
    return /*#__PURE__*/React.createElement(ToolTip, {
      fontSize: 12,
      anchorId: "button-icon",
      toolTipIsVisible: hovered,
      placement: tooltipPlacement,
      TooltipContent: TooltipContent,
      closeToolTipInformationTextAriaLabel: closeToolTipInformationTextAriaLabel
    });
  };
  const _customStyle = useMemo(() => {
    return {
      ...customStyle,
      ...((hoverBackgroundColor || hoverColor) && hovered ? {
        backgroundColor: hoverBackgroundColor,
        color: hoverColor
      } : null)
    };
  }, [hoverBackgroundColor, hoverColor, hovered, customStyle]);
  if (link) {
    return /*#__PURE__*/React.createElement(Link, _extends({}, link, useTitle && {
      title: ariaLabel || label
    }, {
      className: styleButton,
      style: customStyle,
      "data-name": dataName,
      "data-testid": dataTestId,
      "aria-label": ariaLabel || label,
      hoverColor: hoverColor,
      hoverBackgroundColor: hoverBackgroundColor,
      onMouseEnter: handleMouseOver,
      onMouseLeave: handleMouseLeave
    }), getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor), renderToolTip());
  }
  return /*#__PURE__*/React.createElement("button", _extends({}, useTitle && {
    title: ariaLabel || label
  }, ariaLabel && !label ? {
    'data-for': 'button-icon',
    'data-tip': hovered
  } : {}, {
    // eslint-disable-next-line react/button-has-type
    type: usage,
    "aria-label": ariaLabel || label,
    "data-name": dataName,
    "data-testid": dataTestId,
    style: _customStyle,
    className: styleButton,
    onClick: handleOnClick,
    onKeyDown: handleOnKeyDown,
    onMouseOver: handleMouseOver,
    onMouseLeave: handleMouseLeave,
    tabIndex: 0,
    disabled: disabled
  }), getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor), renderToolTip());
};
ButtonLink.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
export default ButtonLink;
//# sourceMappingURL=index.js.map