'use strict';

var Icons = require('@transferwise/icons');
var clsx = require('clsx');
var React = require('react');
var reactIntl = require('react-intl');
require('../common/theme.js');
require('../common/direction.js');
require('../common/propsValues/control.js');
require('../common/propsValues/breakpoint.js');
var size = require('../common/propsValues/size.js');
require('../common/propsValues/typography.js');
require('../common/propsValues/width.js');
require('../common/propsValues/type.js');
require('../common/propsValues/dateMode.js');
require('../common/propsValues/monthFormat.js');
var position = require('../common/propsValues/position.js');
require('../common/propsValues/layouts.js');
require('../common/propsValues/status.js');
require('../common/propsValues/sentiment.js');
require('../common/propsValues/profileType.js');
require('../common/propsValues/variant.js');
require('../common/propsValues/scroll.js');
require('../common/propsValues/markdownNodeType.js');
require('../common/fileType.js');
require('../common/closeButton/CloseButton.messages.js');
var jsxRuntime = require('react/jsx-runtime');
var Modal = require('../modal/Modal.js');
var Popover = require('../popover/Popover.js');
var Info_messages = require('./Info.messages.js');
var infoPresentations = require('./infoPresentations.js');

const Info = ({
  className = undefined,
  content = undefined,
  onClick = undefined,
  presentation = infoPresentations.InfoPresentation.POPOVER,
  size: size$1 = size.Size.SMALL,
  title = undefined,
  'aria-label': ariaLabel,
  preferredPlacement = position.Position.BOTTOM
}) => {
  const intl = reactIntl.useIntl();
  const [open, setOpen] = React.useState(false);
  ariaLabel ??= intl.formatMessage(Info_messages.ariaLabel);
  const isModal = presentation === infoPresentations.InfoPresentation.MODAL;
  const isSmall = size$1 === size.Size.SMALL;
  const buttonProps = {
    'aria-label': ariaLabel,
    className: 'btn-unstyled',
    children: /*#__PURE__*/jsxRuntime.jsx(Icons.QuestionMarkCircle, {
      size: isSmall ? 16 : 24
    })
  };
  return /*#__PURE__*/jsxRuntime.jsx("span", {
    className: clsx.clsx(className, 'np-info', {
      'np-info__small': isSmall,
      'np-info__large': !isSmall
    }),
    children: isModal ? /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
      children: [/*#__PURE__*/jsxRuntime.jsx("button", {
        type: "button",
        onClick: () => {
          setOpen(!open);
          if (onClick) {
            onClick();
          }
        },
        ...buttonProps
      }), /*#__PURE__*/jsxRuntime.jsx(Modal, {
        body: content,
        open: open,
        title: title,
        onClose: () => setOpen(false)
      })]
    }) : /*#__PURE__*/jsxRuntime.jsx(Popover, {
      content: content,
      preferredPlacement: preferredPlacement,
      title: title,
      children: /*#__PURE__*/jsxRuntime.jsx("button", {
        type: "button",
        ...buttonProps,
        onClick: () => {
          if (onClick) {
            onClick();
          }
        }
      })
    })
  });
};

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