'use strict';

var React = require('react');
var clsx = require('clsx');
var PrimitiveButton = require('../../../primitives/PrimitiveButton/src/PrimitiveButton.js');
var PrimitiveAnchor = require('../../../primitives/PrimitiveAnchor/src/PrimitiveAnchor.js');
var ProcessIndicator = require('../../../processIndicator/ProcessIndicator.js');
var AvatarLayout = require('../../../avatarLayout/AvatarLayout.js');
var AvatarView = require('../../../avatarView/AvatarView.js');
var Circle = require('../../../common/circle/Circle.js');
var Icons = require('@transferwise/icons');
var jsxRuntime = require('react/jsx-runtime');

function _interopNamespace(e) {
    if (e && e.__esModule) return e;
    var n = Object.create(null);
    if (e) {
        Object.keys(e).forEach(function (k) {
            if (k !== 'default') {
                var d = Object.getOwnPropertyDescriptor(e, k);
                Object.defineProperty(n, k, d.get ? d : {
                    enumerable: true,
                    get: function () { return e[k]; }
                });
            }
        });
    }
    n.default = e;
    return Object.freeze(n);
}

var Icons__namespace = /*#__PURE__*/_interopNamespace(Icons);

const Button = /*#__PURE__*/React.forwardRef(({
  as = 'button',
  children,
  className,
  disabled,
  loading = false,
  block = false,
  size = 'md',
  priority = 'primary',
  appearance,
  iconLeft,
  iconRight,
  iconOnly,
  avatars,
  type,
  ...props
}, ref) => {
  const isButtonIconSize = value => {
    return [16, 24, 32, 40, 48, 56, 72].includes(value);
  };
  let sizeClass;
  if (iconOnly && isButtonIconSize(size)) {
    // If iconOnly is true and size is a ButtonIconSize, return the size as a string
    sizeClass = size.toString();
  } else {
    // Otherwise, handle ButtonSize
    sizeClass = size === 'sm' ? 'small' : size === 'md' ? 'medium' : size === 'lg' ? 'large' : '';
  }
  const classNames = clsx.clsx({
    [`wds-Button`]: as === 'a',
    [`wds-Button--block`]: block,
    [`wds-Button--${sizeClass}`]: size,
    [`wds-Button--${priority}`]: priority,
    [`wds-Button--${appearance}`]: appearance,
    [`wds-Button--iconOnly`]: iconOnly
  }, className);
  const contentClassNames = clsx.clsx('wds-Button-content', {
    [`wds-Button-content--loading`]: loading
  });
  const LeftIcon = iconLeft ? Icons__namespace[iconLeft] : null;
  const RightIcon = iconRight ? Icons__namespace[iconRight] : null;
  const IconOnly = iconOnly ? Icons__namespace[iconOnly] : null;
  const content = /*#__PURE__*/jsxRuntime.jsxs("span", {
    className: contentClassNames,
    children: [loading && /*#__PURE__*/jsxRuntime.jsx(ProcessIndicator, {
      size: "xs",
      className: "wds-Button-loader",
      "data-testid": "button-loader-indicator"
    }), /*#__PURE__*/jsxRuntime.jsx("span", {
      className: "wds-Button-label",
      "aria-hidden": loading,
      children: size === 'lg' ? children : /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
        children: [size === 'md' && avatars && /*#__PURE__*/jsxRuntime.jsx("span", {
          className: "wds-Button-avatars",
          children: avatars.length === 1 ? /*#__PURE__*/jsxRuntime.jsx(AvatarView, {
            size: 24,
            children: avatars[0]?.asset
          }) : /*#__PURE__*/jsxRuntime.jsx(AvatarLayout, {
            orientation: "horizontal",
            avatars: avatars,
            size: 24
          })
        }), !avatars && LeftIcon && /*#__PURE__*/jsxRuntime.jsx(LeftIcon, {
          className: "wds-Button-icon wds-Button-icon--left"
        }), children, RightIcon && /*#__PURE__*/jsxRuntime.jsx(RightIcon, {
          className: "wds-Button-icon wds-Button-icon--right"
        })]
      })
    })]
  });
  if (iconOnly) {
    const CircleContent = /*#__PURE__*/jsxRuntime.jsx(Circle, {
      ref: ref,
      as: as === 'a' ? PrimitiveAnchor : PrimitiveButton,
      size: size || 40,
      fixedSize: true,
      ...props,
      className: classNames,
      disabled: disabled,
      "aria-label": children,
      children: IconOnly && /*#__PURE__*/jsxRuntime.jsx(IconOnly, {
        className: "wds-Button-icon"
      })
    });
    return CircleContent;
  }
  if (as === 'a') {
    return /*#__PURE__*/jsxRuntime.jsx(PrimitiveAnchor, {
      ref: ref,
      ...props,
      className: classNames,
      disabled: disabled,
      children: content
    });
  }
  return /*#__PURE__*/jsxRuntime.jsx(PrimitiveButton, {
    ref: ref,
    ...props,
    className: classNames,
    disabled: disabled,
    loading: loading,
    type: type,
    children: content
  });
});
Button.displayName = 'Button';

module.exports = Button;
//# sourceMappingURL=Button.js.map
