import { clsx } from 'clsx';
import Button from '../button/src/Button.mjs';
import '../common/theme.mjs';
import '../common/direction.mjs';
import '../common/propsValues/control.mjs';
import '../common/propsValues/breakpoint.mjs';
import '../common/propsValues/size.mjs';
import { Typography } from '../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 'react';
import 'react-intl';
import '../common/closeButton/CloseButton.messages.mjs';
import { jsx, jsxs } from 'react/jsx-runtime';
import Link from '../link/Link.mjs';
import Title from '../title/Title.mjs';

const HeaderAction = ({
  action
}) => {
  const props = {
    'aria-label': action['aria-label']
  };
  if ('href' in action) {
    return /*#__PURE__*/jsx(Link, {
      href: action.href,
      target: action.target,
      onClick: action.onClick,
      ...props,
      children: action.text
    });
  }
  return /*#__PURE__*/jsx(Button, {
    className: "np-header__button",
    priority: "tertiary",
    size: "sm",
    onClick: action.onClick,
    ...props,
    children: action.text
  });
};
/**
 *
 * Neptune Web: https://transferwise.github.io/neptune-web/components/content/Header
 *
 */
const Header = ({
  action,
  as = 'h5',
  title,
  className
}) => {
  if (!action) {
    return /*#__PURE__*/jsx(Title, {
      as: as,
      type: Typography.TITLE_GROUP,
      className: clsx('np-header', 'np-header__title', className),
      children: title
    });
  }
  if (as === 'legend') {
    // eslint-disable-next-line no-console
    console.warn('Legends should be the first child in a fieldset, and this is not possible when including an action');
  }
  return /*#__PURE__*/jsxs("div", {
    className: clsx('np-header', className),
    children: [/*#__PURE__*/jsx(Title, {
      as: as,
      type: Typography.TITLE_GROUP,
      className: "np-header__title",
      children: title
    }), /*#__PURE__*/jsx(HeaderAction, {
      action: action
    })]
  });
};

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