UNPKG

@ariakit/react-core

Version:

Ariakit React core

140 lines (117 loc) 4.66 kB
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); var _JIJ3G2UAcjs = require('./JIJ3G2UA.cjs'); var _ZTE44JRLcjs = require('./ZTE44JRL.cjs'); var _OM7OYSJCcjs = require('./OM7OYSJC.cjs'); var _DYMTSYDCcjs = require('./DYMTSYDC.cjs'); var _EMYYI4CZcjs = require('./EMYYI4CZ.cjs'); var _WBFXWJUHcjs = require('./WBFXWJUH.cjs'); var _MZ2HG624cjs = require('./MZ2HG624.cjs'); // src/menu/menu-item.tsx var _dom = require('@ariakit/core/utils/dom'); var _events = require('@ariakit/core/utils/events'); var _focus = require('@ariakit/core/utils/focus'); var _misc = require('@ariakit/core/utils/misc'); var TagName = "div"; function menuHasFocus(baseElement, items, currentTarget) { var _a; if (!baseElement) return false; if (_focus.hasFocusWithin.call(void 0, baseElement)) return true; const expandedItem = items == null ? void 0 : items.find((item) => { var _a2; if (item.element === currentTarget) return false; return ((_a2 = item.element) == null ? void 0 : _a2.getAttribute("aria-expanded")) === "true"; }); const expandedMenuId = (_a = expandedItem == null ? void 0 : expandedItem.element) == null ? void 0 : _a.getAttribute("aria-controls"); if (!expandedMenuId) return false; const doc = _dom.getDocument.call(void 0, baseElement); const expandedMenu = doc.getElementById(expandedMenuId); if (!expandedMenu) return false; if (_focus.hasFocusWithin.call(void 0, expandedMenu)) return true; return !!expandedMenu.querySelector("[role=menuitem][aria-expanded=true]"); } var useMenuItem = _WBFXWJUHcjs.createHook.call(void 0, function useMenuItem2({ store, hideOnClick = true, preventScrollOnKeyDown = true, focusOnHover, blurOnHoverEnd, ...props }) { const menuContext = _JIJ3G2UAcjs.useMenuScopedContext.call(void 0, true); const menubarContext = _ZTE44JRLcjs.useMenubarScopedContext.call(void 0, ); store = store || menuContext || menubarContext; _misc.invariant.call(void 0, store, process.env.NODE_ENV !== "production" && "MenuItem must be wrapped in a MenuList, Menu or Menubar component" ); const onClickProp = props.onClick; const hideOnClickProp = _MZ2HG624cjs.useBooleanEvent.call(void 0, hideOnClick); const hideMenu = "hideAll" in store ? store.hideAll : void 0; const isWithinMenu = !!hideMenu; const onClick = _MZ2HG624cjs.useEvent.call(void 0, (event) => { onClickProp == null ? void 0 : onClickProp(event); if (event.defaultPrevented) return; if (_events.isDownloading.call(void 0, event)) return; if (_events.isOpeningInNewTab.call(void 0, event)) return; if (!hideMenu) return; const popupType = event.currentTarget.getAttribute("aria-haspopup"); if (popupType === "menu") return; if (!hideOnClickProp(event)) return; hideMenu(); }); const contentElement = _EMYYI4CZcjs.useStoreState.call(void 0, store, (state) => "contentElement" in state ? state.contentElement : null ); const role = _dom.getPopupItemRole.call(void 0, contentElement, "menuitem"); props = { role, ...props, onClick }; props = _DYMTSYDCcjs.useCompositeItem.call(void 0, { store, preventScrollOnKeyDown, ...props }); props = _OM7OYSJCcjs.useCompositeHover.call(void 0, { store, ...props, focusOnHover(event) { const getFocusOnHover = () => { if (typeof focusOnHover === "function") return focusOnHover(event); if (focusOnHover != null) return focusOnHover; return true; }; if (!store) return false; if (!getFocusOnHover()) return false; const { baseElement, items } = store.getState(); if (isWithinMenu) { if (event.currentTarget.hasAttribute("aria-expanded")) { event.currentTarget.focus(); } return true; } if (menuHasFocus(baseElement, items, event.currentTarget)) { event.currentTarget.focus(); return true; } return false; }, blurOnHoverEnd(event) { if (typeof blurOnHoverEnd === "function") return blurOnHoverEnd(event); if (blurOnHoverEnd != null) return blurOnHoverEnd; return isWithinMenu; } }); return props; } ); var MenuItem = _WBFXWJUHcjs.memo.call(void 0, _WBFXWJUHcjs.forwardRef.call(void 0, function MenuItem2(props) { const htmlProps = useMenuItem(props); return _WBFXWJUHcjs.createElement.call(void 0, TagName, htmlProps); }) ); exports.useMenuItem = useMenuItem; exports.MenuItem = MenuItem;