@ariakit/react-core
Version:
Ariakit React core
225 lines (201 loc) • 8.28 kB
JavaScript
;Object.defineProperty(exports, "__esModule", {value: true});
var _7754RGGYcjs = require('../__chunks/7754RGGY.cjs');
var _S45EGDDBcjs = require('../__chunks/S45EGDDB.cjs');
require('../__chunks/L6CLLK7R.cjs');
var _6M54DBBOcjs = require('../__chunks/6M54DBBO.cjs');
require('../__chunks/VNVMHTCY.cjs');
require('../__chunks/6F6SPO63.cjs');
require('../__chunks/QYV7ZYAG.cjs');
require('../__chunks/LNC7ZL3H.cjs');
var _5XOEJL7Acjs = require('../__chunks/5XOEJL7A.cjs');
require('../__chunks/Y7XCL7GY.cjs');
require('../__chunks/UI5KWBYV.cjs');
require('../__chunks/L634CRNJ.cjs');
require('../__chunks/RDDLXR5T.cjs');
require('../__chunks/EQD56WGF.cjs');
require('../__chunks/LMAY3X4U.cjs');
require('../__chunks/W32FX7DM.cjs');
require('../__chunks/HIRVBNBX.cjs');
require('../__chunks/ENNAUHNH.cjs');
require('../__chunks/FW2GMPNK.cjs');
require('../__chunks/XYFLKFU6.cjs');
require('../__chunks/VC5V2CPO.cjs');
require('../__chunks/JLMLKTUB.cjs');
require('../__chunks/LCWSLOYU.cjs');
require('../__chunks/V7JASX7S.cjs');
require('../__chunks/56NPFF7P.cjs');
require('../__chunks/GASMO7Y4.cjs');
require('../__chunks/6IDGXS7Y.cjs');
require('../__chunks/26P4PLHI.cjs');
require('../__chunks/YVOQ2BCB.cjs');
require('../__chunks/4SKDRUBR.cjs');
require('../__chunks/AQ2LO7WV.cjs');
require('../__chunks/VIIJ4PIK.cjs');
require('../__chunks/FMHXK2IU.cjs');
require('../__chunks/6PUNKVPO.cjs');
require('../__chunks/SIL3OXTP.cjs');
require('../__chunks/MIBORXQW.cjs');
require('../__chunks/FCZ3IGUB.cjs');
require('../__chunks/ZVJRPAXY.cjs');
require('../__chunks/YDPERDKF.cjs');
require('../__chunks/KVXNVDJK.cjs');
require('../__chunks/D6FV6EYS.cjs');
require('../__chunks/YUGKYIYY.cjs');
require('../__chunks/T3QB4FR3.cjs');
var _25BPIGZHcjs = require('../__chunks/25BPIGZH.cjs');
require('../__chunks/6HKL3JR2.cjs');
var _WULEED4Qcjs = require('../__chunks/WULEED4Q.cjs');
var _OZM4QA2Vcjs = require('../__chunks/OZM4QA2V.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 = _WULEED4Qcjs.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 = _6M54DBBOcjs.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: _OZM4QA2Vcjs.useMergeRefs.call(void 0, ref, props.ref)
});
const _a2 = _7754RGGYcjs.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 = _25BPIGZHcjs.useStoreState.call(void 0,
store.combobox || store,
"contentElement"
);
const parentContentElement = _25BPIGZHcjs.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 = _S45EGDDBcjs.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 = _5XOEJL7Acjs.createDialogComponent.call(void 0,
_WULEED4Qcjs.forwardRef.call(void 0, function Menu2(props) {
const htmlProps = useMenu(props);
return _WULEED4Qcjs.createElement.call(void 0, TagName, htmlProps);
}),
_6M54DBBOcjs.useMenuProviderContext
);
exports.Menu = Menu; exports.useMenu = useMenu;