"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _utils = require("../utils");
var _classnames = _interopRequireDefault(require("classnames"));
var _constants = require("../../constants");
var _MenuItem = _interopRequireDefault(require("./MenuItem"));
var _MenuSelectableItem = _interopRequireDefault(require("./MenuSelectableItem"));
var _react = require("react");
var _jsxRuntime = require("react/jsx-runtime");
// Copyright 1999-2023. Plesk International GmbH. All rights reserved.

const hasIconItem = children => {
  let result = false;
  _react.Children.forEach(children, child => {
    if ( /*#__PURE__*/(0, _react.isValidElement)(child) && (child.type === _MenuSelectableItem.default || child.props.icon)) {
      result = true;
    }
  });
  return result;
};
/**
 * `Menu` component displays grouped controls for navigating the UI, performing actions on objects, or showing
 * options for [Lists](#!/List) (for example, sorting and filtering settings). `Menu` is most typically used in a
 * [Dropdown](#!/Dropdown).
 *
 * `Menu` consists of several [Menu Items](#!/MenuItem) (or [Selectable Menu
 * Items](#!/MenuSelectableItem)) which can be grouped by [Menu Headers](#!/MenuHeader)
 * or separated by [Menu Dividers](#!/MenuDivider).
 * @since 0.0.55
 */
const Menu = /*#__PURE__*/(0, _react.forwardRef)(function Menu(_ref, ref) {
  let {
    className,
    children,
    onItemClick,
    onKeyDown,
    onFocus,
    autoFocus,
    overlay = false,
    baseClassName = `${_constants.CLS_PREFIX}menu`,
    ...props
  } = _ref;
  const rootRef = (0, _react.useRef)(null);
  const {
    focusNext,
    focusPrev,
    focusFirst,
    focusLast
  } = (0, _react.useMemo)(() => (0, _utils.createFocusManager)(rootRef, node => (node.getAttribute('role') === 'menuitem' || node.getAttribute('role') === 'menuitemcheckbox') && node.getAttribute('aria-disabled') !== 'true'), []);
  const handleKeyDown = e => {
    switch (e.key) {
      case 'ArrowUp':
        e.preventDefault();
        focusPrev();
        break;
      case 'ArrowDown':
        e.preventDefault();
        focusNext();
        break;
      case 'Home':
      case 'PageUp':
        e.preventDefault();
        focusFirst();
        break;
      case 'End':
      case 'PageDown':
        e.preventDefault();
        focusLast();
        break;
    }
    (0, _utils.safeInvoke)(onKeyDown, e);
  };
  const handleFocus = e => {
    if (e.target === rootRef.current && autoFocus) {
      focusFirst();
    }
    (0, _utils.safeInvoke)(onFocus, e);
  };
  let hasTabIndex = false;
  const items = _react.Children.map(children, (child, index) => {
    if (! /*#__PURE__*/(0, _react.isValidElement)(child)) {
      return child;
    }
    const props = {
      tabIndex: -1
    };
    if (onItemClick) {
      props.onClick = (0, _utils.wrapFunction)(child.props.onClick, onItemClick.bind(null, child, index));
    }
    if (!hasTabIndex && (child.type === _MenuItem.default || child.type === _MenuSelectableItem.default) && !child.props.disabled) {
      props.tabIndex = 0;
      hasTabIndex = true;
    } else {
      props.tabIndex = -1;
    }
    return /*#__PURE__*/(0, _react.cloneElement)(child, props);
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
    className: (0, _classnames.default)(baseClassName, className, {
      [`${baseClassName}--icons`]: hasIconItem(children),
      [`${baseClassName}--overlay`]: overlay
    }),
    role: "menu",
    ...props,
    ref: el => {
      rootRef.current = el;
      if (ref && typeof ref !== 'function') {
        ref.current = el;
      }
    },
    onKeyDown: handleKeyDown,
    onFocus: handleFocus,
    tabIndex: -1,
    children: items
  });
});
Menu.displayName = 'Menu';
var _default = exports.default = Menu;