"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.DropdownMenu = DropdownMenu;
exports.default = void 0;
var _compat = require("preact/compat");
var _DropdownMenuOption = require("./DropdownMenuOption");
var _DropdownMenuSection = require("./DropdownMenuSection");
var _reactAria = require("../react-aria");
var _usePressEscapeHandler = _interopRequireDefault(require("../utilities/usePressEscapeHandler"));
var _classnames = _interopRequireDefault(require("classnames"));
var _jsxRuntime = require("preact/compat/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
// from react-stately
// from react-aria

function DropdownMenu(_ref) {
  let {
    children,
    componentClass,
    heading,
    labelId,
    menuId,
    rootId,
    size,
    state,
    ...props
  } = _ref;
  const fallbackListBoxRef = (0, _compat.useRef)(null);
  const listBoxRef = props.listBoxRef ?? fallbackListBoxRef;
  const {
    listBoxProps
  } = (0, _reactAria.useListBox)(props, state, listBoxRef);
  const headingId = `${rootId}__heading`;
  const containerClass = (0, _classnames.default)(`${componentClass}__menu-container`, size && `ds-c-field--${size}`);
  const containerRef = (0, _compat.useRef)();
  (0, _usePressEscapeHandler.default)(containerRef, () => {
    state.setOpen(false);
    props.triggerRef.current?.focus?.();
  });

  // Workaround for react/react-aria #1513
  (0, _compat.useEffect)(() => {
    const listener = event => {
      event.preventDefault();
    };
    containerRef.current?.addEventListener('touchend', listener, {
      passive: false
    });
    return () => {
      containerRef.current?.removeEventListener('touchend', listener);
    };
  }, []);
  function handleTabKey(event) {
    const TAB_KEY = 9;
    if (event.keyCode === TAB_KEY || event.key === 'Tab') {
      if (!state.selectionManager.selectedKeys.has(state.selectionManager.focusedKey)) {
        state.selectionManager.setSelectedKeys([state.selectionManager.focusedKey]);
      }
    }
  }
  const sharedProps = {
    state,
    rootId,
    componentClass
  };

  // These must be mutually exclusive, because when we force the menu to render open when
  // react-aria's state doesn't consider it open (state.isOpen), it seems to actually
  // render unexpected items. Currently we don't have a reason to render both at the same
  // time, so this is fine.
  const contents = children ?? [...state.collection].map(item => item.type === 'section' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_DropdownMenuSection.DropdownMenuSection, {
    section: item,
    ...sharedProps
  }, item.key) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_DropdownMenuOption.DropdownMenuOption, {
    item: item,
    ...sharedProps
  }, item.key));
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: containerClass,
    ref: containerRef,
    onKeyDown: handleTabKey,
    children: [heading && /*#__PURE__*/(0, _jsxRuntime.jsx)("h5", {
      className: "ds-c-autocomplete__label",
      id: headingId,
      children: heading
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("ul", {
      ...listBoxProps,
      id: menuId,
      "aria-labelledby": (0, _classnames.default)(labelId, heading && headingId),
      className: `${componentClass}__menu`,
      ref: listBoxRef,
      children: contents
    })]
  });
}
var _default = exports.default = DropdownMenu;