@ariakit/react-core
Version:
Ariakit React core
225 lines (201 loc) • 8.28 kB
JavaScript
;Object.defineProperty(exports, "__esModule", {value: true});
var _MVNPLGUNcjs = require('../__chunks/MVNPLGUN.cjs');
var _MHV777VZcjs = require('../__chunks/MHV777VZ.cjs');
require('../__chunks/L6CLLK7R.cjs');
var _5NYO4PEPcjs = require('../__chunks/5NYO4PEP.cjs');
require('../__chunks/HLFPESUH.cjs');
require('../__chunks/KPH4LMZO.cjs');
require('../__chunks/ZBFMPPGZ.cjs');
require('../__chunks/3TETLQVN.cjs');
var _LM5J3TJ3cjs = require('../__chunks/LM5J3TJ3.cjs');
require('../__chunks/IRJEM7JI.cjs');
require('../__chunks/UI5KWBYV.cjs');
require('../__chunks/L634CRNJ.cjs');
require('../__chunks/M6LCPEQR.cjs');
require('../__chunks/Y35J4OLV.cjs');
require('../__chunks/ZEICBQM2.cjs');
require('../__chunks/W32FX7DM.cjs');
require('../__chunks/22BA7ARO.cjs');
require('../__chunks/ENNAUHNH.cjs');
require('../__chunks/EIHHM2LO.cjs');
require('../__chunks/UWFFCHQU.cjs');
require('../__chunks/KNHF6C7N.cjs');
require('../__chunks/JLMLKTUB.cjs');
require('../__chunks/LCWSLOYU.cjs');
require('../__chunks/V7JASX7S.cjs');
require('../__chunks/56NPFF7P.cjs');
require('../__chunks/GASMO7Y4.cjs');
require('../__chunks/XL5ZVDYQ.cjs');
require('../__chunks/26P4PLHI.cjs');
require('../__chunks/YVOQ2BCB.cjs');
require('../__chunks/4SKDRUBR.cjs');
require('../__chunks/AQ2LO7WV.cjs');
require('../__chunks/I3ICHD5K.cjs');
require('../__chunks/T272CHVS.cjs');
require('../__chunks/ZRZUZ7E7.cjs');
require('../__chunks/W6NEGVNA.cjs');
require('../__chunks/MIBORXQW.cjs');
require('../__chunks/3YJARQUN.cjs');
require('../__chunks/ZVS6SBRR.cjs');
require('../__chunks/VF7H2WBX.cjs');
require('../__chunks/EJVJIL4S.cjs');
require('../__chunks/CWQU4R75.cjs');
require('../__chunks/PDQXLIRF.cjs');
require('../__chunks/T3QB4FR3.cjs');
var _76LCMKUIcjs = require('../__chunks/76LCMKUI.cjs');
require('../__chunks/FVVTEJ4K.cjs');
var _6TI3NXX6cjs = require('../__chunks/6TI3NXX6.cjs');
var _L5A2ID7Scjs = require('../__chunks/L5A2ID7S.cjs');
require('../__chunks/FDRJDQ5Y.cjs');
var _7EQBAZ46cjs = require('../__chunks/7EQBAZ46.cjs');
// src/menu/menu.tsx
var _events = require('@ariakit/core/utils/events');
var _focus = require('@ariakit/core/utils/focus');
var _misc = require('@ariakit/core/utils/misc');
var _react = require('react');
var TagName = "div";
var useMenu = _6TI3NXX6cjs.createHook.call(void 0, function useMenu2(_a) {
var _b = _a, {
store,
modal: modalProp = false,
portal = !!modalProp,
hideOnEscape = true,
autoFocusOnShow = true,
hideOnHoverOutside,
alwaysVisible
} = _b, props = _7EQBAZ46cjs.__objRest.call(void 0, _b, [
"store",
"modal",
"portal",
"hideOnEscape",
"autoFocusOnShow",
"hideOnHoverOutside",
"alwaysVisible"
]);
const context = _5NYO4PEPcjs.useMenuProviderContext.call(void 0, );
store = store || context;
_misc.invariant.call(void 0,
store,
process.env.NODE_ENV !== "production" && "Menu must receive a `store` prop or be wrapped in a MenuProvider component."
);
const ref = _react.useRef.call(void 0, null);
const parentMenu = store.parent;
const parentMenubar = store.menubar;
const hasParentMenu = !!parentMenu;
const parentIsMenubar = !!parentMenubar && !hasParentMenu;
props = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {}, props), {
ref: _L5A2ID7Scjs.useMergeRefs.call(void 0, ref, props.ref)
});
const _a2 = _MVNPLGUNcjs.useMenuList.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {
store,
alwaysVisible
}, props)), { "aria-labelledby": ariaLabelledBy } = _a2, menuListProps = _7EQBAZ46cjs.__objRest.call(void 0, _a2, ["aria-labelledby"]);
props = menuListProps;
const [initialFocusRef, setInitialFocusRef] = _react.useState.call(void 0, );
const autoFocusOnShowState = store.useState("autoFocusOnShow");
const initialFocus = store.useState("initialFocus");
const baseElement = store.useState("baseElement");
const items = store.useState("renderedItems");
_react.useEffect.call(void 0, () => {
let cleaning = false;
setInitialFocusRef((prevInitialFocusRef) => {
var _a3, _b2, _c;
if (cleaning) return;
if (!autoFocusOnShowState) return;
if ((_a3 = prevInitialFocusRef == null ? void 0 : prevInitialFocusRef.current) == null ? void 0 : _a3.isConnected) return prevInitialFocusRef;
const ref2 = _react.createRef.call(void 0, );
switch (initialFocus) {
// TODO: Refactor
case "first":
ref2.current = ((_b2 = items.find((item) => !item.disabled && item.element)) == null ? void 0 : _b2.element) || null;
break;
case "last":
ref2.current = ((_c = [...items].reverse().find((item) => !item.disabled && item.element)) == null ? void 0 : _c.element) || null;
break;
default:
ref2.current = baseElement;
}
return ref2;
});
return () => {
cleaning = true;
};
}, [store, autoFocusOnShowState, initialFocus, items, baseElement]);
const modal = hasParentMenu ? false : modalProp;
const mayAutoFocusOnShow = !!autoFocusOnShow;
const canAutoFocusOnShow = !!initialFocusRef || !!props.initialFocus || !!modal;
const contentElement = _76LCMKUIcjs.useStoreState.call(void 0,
store.combobox || store,
"contentElement"
);
const parentContentElement = _76LCMKUIcjs.useStoreState.call(void 0,
(parentMenu == null ? void 0 : parentMenu.combobox) || parentMenu,
"contentElement"
);
const preserveTabOrderAnchor = _react.useMemo.call(void 0, () => {
if (!parentContentElement) return;
if (!contentElement) return;
const role = contentElement.getAttribute("role");
const parentRole = parentContentElement.getAttribute("role");
const parentIsMenuOrMenubar = parentRole === "menu" || parentRole === "menubar";
if (parentIsMenuOrMenubar && role === "menu") return;
return parentContentElement;
}, [contentElement, parentContentElement]);
if (preserveTabOrderAnchor !== void 0) {
props = _7EQBAZ46cjs.__spreadValues.call(void 0, {
preserveTabOrderAnchor
}, props);
}
props = _MHV777VZcjs.useHovercard.call(void 0, _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {
store,
alwaysVisible,
initialFocus: initialFocusRef,
autoFocusOnShow: mayAutoFocusOnShow ? canAutoFocusOnShow && autoFocusOnShow : autoFocusOnShowState || !!modal
}, props), {
hideOnEscape(event) {
if (_misc.isFalsyBooleanCallback.call(void 0, hideOnEscape, event)) return false;
store == null ? void 0 : store.hideAll();
return true;
},
hideOnHoverOutside(event) {
const disclosureElement = store == null ? void 0 : store.getState().disclosureElement;
const getHideOnHoverOutside = () => {
if (typeof hideOnHoverOutside === "function") {
return hideOnHoverOutside(event);
}
if (hideOnHoverOutside != null) return hideOnHoverOutside;
if (hasParentMenu) return true;
if (!parentIsMenubar) return false;
if (!disclosureElement) return true;
if (_focus.hasFocusWithin.call(void 0, disclosureElement)) return false;
return true;
};
if (!getHideOnHoverOutside()) return false;
if (event.defaultPrevented) return true;
if (!hasParentMenu) return true;
if (!disclosureElement) return true;
_events.fireEvent.call(void 0, disclosureElement, "mouseout", event);
if (!_focus.hasFocusWithin.call(void 0, disclosureElement)) return true;
requestAnimationFrame(() => {
if (_focus.hasFocusWithin.call(void 0, disclosureElement)) return;
store == null ? void 0 : store.hide();
});
return false;
},
modal,
portal,
backdrop: hasParentMenu ? false : props.backdrop
}));
props = _7EQBAZ46cjs.__spreadValues.call(void 0, {
"aria-labelledby": ariaLabelledBy
}, props);
return props;
});
var Menu = _LM5J3TJ3cjs.createDialogComponent.call(void 0,
_6TI3NXX6cjs.forwardRef.call(void 0, function Menu2(props) {
const htmlProps = useMenu(props);
return _6TI3NXX6cjs.createElement.call(void 0, TagName, htmlProps);
}),
_5NYO4PEPcjs.useMenuProviderContext
);
exports.Menu = Menu; exports.useMenu = useMenu;