@ariakit/react-core
Version:
Ariakit React core
150 lines (123 loc) • 5.1 kB
JavaScript
;Object.defineProperty(exports, "__esModule", {value: true});
var _6M54DBBOcjs = require('./6M54DBBO.cjs');
var _VNVMHTCYcjs = require('./VNVMHTCY.cjs');
var _N37IROBRcjs = require('./N37IROBR.cjs');
var _YTEJF6TYcjs = require('./YTEJF6TY.cjs');
var _25BPIGZHcjs = require('./25BPIGZH.cjs');
var _WULEED4Qcjs = require('./WULEED4Q.cjs');
var _OZM4QA2Vcjs = require('./OZM4QA2V.cjs');
var _7EQBAZ46cjs = require('./7EQBAZ46.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 = _WULEED4Qcjs.createHook.call(void 0,
function useMenuItem2(_a) {
var _b = _a, {
store,
hideOnClick = true,
preventScrollOnKeyDown = true,
focusOnHover,
blurOnHoverEnd
} = _b, props = _7EQBAZ46cjs.__objRest.call(void 0, _b, [
"store",
"hideOnClick",
"preventScrollOnKeyDown",
"focusOnHover",
"blurOnHoverEnd"
]);
const menuContext = _6M54DBBOcjs.useMenuScopedContext.call(void 0, true);
const menubarContext = _VNVMHTCYcjs.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 = _OZM4QA2Vcjs.useBooleanEvent.call(void 0, hideOnClick);
const hideMenu = "hideAll" in store ? store.hideAll : void 0;
const isWithinMenu = !!hideMenu;
const onClick = _OZM4QA2Vcjs.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 = _25BPIGZHcjs.useStoreState.call(void 0,
store,
(state) => "contentElement" in state ? state.contentElement : null
);
const role = _dom.getPopupItemRole.call(void 0, contentElement, "menuitem");
props = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {
role
}, props), {
onClick
});
props = _YTEJF6TYcjs.useCompositeItem.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {
store,
preventScrollOnKeyDown
}, props));
props = _N37IROBRcjs.useCompositeHover.call(void 0, _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.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 = _WULEED4Qcjs.memo.call(void 0,
_WULEED4Qcjs.forwardRef.call(void 0, function MenuItem2(props) {
const htmlProps = useMenuItem(props);
return _WULEED4Qcjs.createElement.call(void 0, TagName, htmlProps);
})
);
exports.useMenuItem = useMenuItem; exports.MenuItem = MenuItem;