import { clsx } from 'clsx';
import { forwardRef } from 'react';
import { useIntl } from 'react-intl';
import '../common/theme.mjs';
import '../common/direction.mjs';
import { Priority, ControlType } from '../common/propsValues/control.mjs';
import '../common/propsValues/breakpoint.mjs';
import { Size } from '../common/propsValues/size.mjs';
import '../common/propsValues/typography.mjs';
import '../common/propsValues/width.mjs';
import '../common/propsValues/type.mjs';
import '../common/propsValues/dateMode.mjs';
import '../common/propsValues/monthFormat.mjs';
import '../common/propsValues/position.mjs';
import '../common/propsValues/layouts.mjs';
import '../common/propsValues/status.mjs';
import '../common/propsValues/sentiment.mjs';
import '../common/propsValues/profileType.mjs';
import '../common/propsValues/variant.mjs';
import '../common/propsValues/scroll.mjs';
import '../common/propsValues/markdownNodeType.mjs';
import '../common/fileType.mjs';
import '@transferwise/icons';
import '../common/closeButton/CloseButton.messages.mjs';
import { jsxs, jsx } from 'react/jsx-runtime';
import ProcessIndicator from '../processIndicator/ProcessIndicator.mjs';
import messages from '../i18n/commonMessages/Button.messages.mjs';
import { typeClassMap, priorityClassMap } from './classMap.mjs';
import { logDeprecationNotices, establishNewPriority, establishNewType } from './legacyUtils/legacyUtils.mjs';

const LegacyButton = /*#__PURE__*/forwardRef(({
  as: component = 'button',
  block = false,
  children,
  className,
  disabled,
  loading = false,
  priority = Priority.PRIMARY,
  size = Size.MEDIUM,
  type = ControlType.ACCENT,
  onClick,
  ...rest
}, ref) => {
  const intl = useIntl();
  logDeprecationNotices({
    size,
    type
  });
  const newType = establishNewType(type);
  const newPriority = establishNewPriority(priority, type);
  const classes = clsx(`btn btn-${size}`, `np-btn np-btn-${size}`, {
    'btn-loading': loading,
    'btn-block np-btn-block': block,
    disabled
  },
  // @ts-expect-error fix when refactor `typeClassMap` to TypeScript
  typeClassMap[newType],
  // @ts-expect-error fix when refactor `typeClassMap` to TypeScript
  priorityClassMap[newPriority], className);
  function processIndicatorSize() {
    return ['sm', 'xs'].includes(size) ? 'xxs' : 'xs';
  }
  const Element = component ?? 'button';
  let props;
  if (Element === 'button') {
    const {
      htmlType = 'button',
      ...restProps
    } = rest;
    props = {
      ...restProps,
      disabled,
      'aria-disabled': loading,
      type: htmlType
    };
  } else {
    props = {
      ...rest,
      'aria-disabled': loading
    };
  }
  /**
   * Ensures that the button cannot be activated in loading or disabled mode,
   * when `aria-disabled` might be used over the `disabled` HTML attribute
   */
  const handleClick = handler => event => {
    if (disabled || loading) {
      event.preventDefault();
    } else if (typeof handler === 'function') {
      handler(event);
    }
  };
  return /*#__PURE__*/jsxs(Element, {
    ref: ref,
    className: classes,
    onClick: handleClick(onClick),
    ...props,
    "aria-live": loading ? 'polite' : 'off',
    "aria-busy": loading,
    "aria-label": loading ? intl.formatMessage(messages.loadingAriaLabel) : rest['aria-label'],
    children: [children, loading && /*#__PURE__*/jsx(ProcessIndicator, {
      size: processIndicatorSize(),
      className: "btn-loader",
      "data-testid": "ButtonProgressIndicator"
    })]
  });
});

export { LegacyButton as default };
//# sourceMappingURL=LegacyButton.mjs.map
