import { useState } from 'react';
import { AddIcon, RemoveIcon } from '../Icons';
import classNames from 'classnames';
import useId from '../utilities/useId';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
export const AccordionItem = _ref => {
  let {
    buttonClassName,
    children,
    contentClassName,
    defaultOpen,
    heading,
    headingLevel,
    id,
    // TODO: Explore deprecating `isControlledOpen` in favor of `isOpen`
    isControlledOpen,
    onChange,
    closeIconComponent,
    openIconComponent
  } = _ref;
  const contentClasses = classNames('ds-c-accordion__content', contentClassName);
  const buttonClasses = classNames('ds-c-accordion__button', buttonClassName);
  const HeadingTag = `h${headingLevel}`;
  const isControlled = !!onChange;
  const contentId = useId('accordion-item--', id);
  const buttonId = `${contentId}__button`;
  const [isOpen, setIsOpen] = useState(isControlled ? isControlledOpen : defaultOpen);

  // Set the state for opening and closing an accordion item
  const handleClick = () => {
    if (isControlled) {
      onChange();
    } else {
      setIsOpen(!isOpen);
    }
  };
  const isItemOpen = isControlled ? isControlledOpen : isOpen;
  const CloseIconComponent = closeIconComponent;
  const OpenIconComponent = openIconComponent;
  const closeIcon = /*#__PURE__*/_jsx(CloseIconComponent, {
    className: "ds-c-accordion__button-icon",
    id: `${contentId}__icon`
  });
  const openIcon = /*#__PURE__*/_jsx(OpenIconComponent, {
    className: "ds-c-accordion__button-icon",
    id: `${contentId}__icon`
  });
  if (heading) {
    return /*#__PURE__*/_jsxs(_Fragment, {
      children: [/*#__PURE__*/_jsx(HeadingTag, {
        className: "ds-c-accordion__heading",
        children: /*#__PURE__*/_jsxs("button", {
          className: buttonClasses,
          "aria-expanded": isItemOpen,
          "aria-controls": contentId,
          id: buttonId,
          onClick: handleClick,
          type: "button",
          children: [heading, isItemOpen ? closeIcon : openIcon]
        })
      }), /*#__PURE__*/_jsx("div", {
        className: contentClasses,
        id: contentId,
        hidden: isControlled ? !isControlledOpen : !isOpen,
        children: children
      })]
    });
  }
};
AccordionItem.defaultProps = {
  defaultOpen: false,
  headingLevel: '2',
  closeIconComponent: RemoveIcon,
  openIconComponent: AddIcon
};
export default AccordionItem;