'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var clsx = require('clsx');
var React = require('react');
var Body = require('../../body/Body.js');
var Chevron = require('../../chevron/Chevron.js');
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');
var typography = 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('@transferwise/icons');
require('react-intl');
require('../../common/closeButton/CloseButton.messages.js');
var jsxRuntime = require('react/jsx-runtime');
var Option = require('../../common/Option/Option.js');

const AccordionItem = ({
  'aria-label': ariaLabel,
  id,
  title,
  subtitle,
  content,
  onClick,
  open,
  icon,
  media,
  showMediaAtAllSizes,
  showMediaCircle,
  isContainerAligned,
  theme = 'light'
}) => {
  const mediaElement = icon ? /*#__PURE__*/React.cloneElement(icon, {
    size: 24
  }) : media;
  const fallbackId = React.useId();
  const accordionId = id ?? fallbackId;
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
    id: accordionId,
    className: clsx.clsx('np-accordion-item', {
      'np-accordion-item--open': open,
      'np-accordion-item--with-icon': Boolean(icon),
      'np-accordion-item--with-media': Boolean(media)
    }),
    children: [/*#__PURE__*/jsxRuntime.jsx(Option.default, {
      "aria-label": ariaLabel,
      as: "button",
      media: mediaElement,
      title: title,
      content: subtitle,
      button: /*#__PURE__*/jsxRuntime.jsx(Chevron.default, {
        orientation: open ? position.Position.TOP : position.Position.BOTTOM,
        size: size.Size.MEDIUM
      }),
      inverseMediaCircle: false,
      "aria-expanded": open,
      "aria-controls": `${accordionId}-section`,
      id: `${accordionId}-control`,
      showMediaCircle: showMediaCircle,
      showMediaAtAllSizes: showMediaAtAllSizes,
      isContainerAligned: isContainerAligned,
      onClick: onClick
    }), open && /*#__PURE__*/jsxRuntime.jsx("div", {
      id: `${accordionId}-section`,
      role: "region",
      "aria-labelledby": `${accordionId}-control`,
      children: /*#__PURE__*/jsxRuntime.jsx(Body.default, {
        as: "span",
        type: typography.Typography.BODY_LARGE,
        className: clsx.clsx('np-accordion-item__content', 'd-block', {
          'has-icon': icon
        }),
        children: content
      })
    })]
  });
};

exports.default = AccordionItem;
//# sourceMappingURL=AccordionItem.js.map
