@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
59 lines (58 loc) • 2.05 kB
JavaScript
"use client";
const require_Menu = require("../../Menu/Menu.cjs");
const require_Menubar_context = require("../Menubar.context.cjs");
let react = require("react");
let _mantine_hooks = require("@mantine/hooks");
let react_jsx_runtime = require("react/jsx-runtime");
//#region packages/@mantine/core/src/components/Menubar/MenubarMenu/MenubarMenu.tsx
const DEFAULT_TRANSITION_DURATION = 150;
function MenubarMenu({ children, transitionProps, ...others }) {
const ctx = require_Menubar_context.useMenubarContext();
const id = (0, _mantine_hooks.useId)();
const [index, setIndex] = (0, react.useState)(-1);
(0, _mantine_hooks.useIsomorphicEffect)(() => {
const next = ctx.getMenuIndex(id);
setIndex((current) => current === next ? current : next);
});
const opened = ctx.openIndex !== null && index !== -1 && ctx.openIndex === index;
const handleChange = (value) => {
if (value) {
ctx.openMenu(index, "click");
ctx.setActiveIndex(index);
} else ctx.closeMenu();
};
const baseDuration = transitionProps?.duration ?? DEFAULT_TRANSITION_DURATION;
const baseExitDuration = transitionProps?.exitDuration ?? baseDuration;
const animateEnter = ctx.getPreviousOpenIndex() === null;
const animateExit = ctx.openIndex === null;
const resolvedTransitionProps = {
...transitionProps,
duration: animateEnter ? baseDuration : 0,
exitDuration: animateExit ? baseExitDuration : 0
};
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Menubar_context.MenubarMenuContextProvider, {
value: {
id,
index,
opened
},
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Menu.Menu, {
position: ctx.position,
loop: ctx.loop,
unstyled: ctx.unstyled,
menuItemTabIndex: -1,
trapFocus: false,
...others,
transitionProps: resolvedTransitionProps,
opened,
onChange: handleChange,
trigger: "click",
returnFocus: false,
children
})
});
}
MenubarMenu.displayName = "@mantine/core/MenubarMenu";
//#endregion
exports.MenubarMenu = MenubarMenu;
//# sourceMappingURL=MenubarMenu.cjs.map