@mantine/core/cjs/components/Menu/Menu.cjs

React components library focused on usability, accessibility and developer experience

"use client";
require("../../_virtual/_rolldown/runtime.cjs");
const require_get_context_item_index = require("../../core/utils/get-context-item-index/get-context-item-index.cjs");
const require_use_props = require("../../core/MantineProvider/use-props/use-props.cjs");
const require_use_resolved_styles_api = require("../../core/styles-api/use-resolved-styles-api/use-resolved-styles-api.cjs");
const require_use_styles = require("../../core/styles-api/use-styles/use-styles.cjs");
const require_factory = require("../../core/factory/factory.cjs");
const require_use_delayed_hover = require("../../utils/Floating/use-delayed-hover.cjs");
const require_Popover = require("../Popover/Popover.cjs");
const require_Menu_context = require("./Menu.context.cjs");
const require_Menu_module = require("./Menu.module.cjs");
const require_MenuDivider = require("./MenuDivider/MenuDivider.cjs");
const require_MenuDropdown = require("./MenuDropdown/MenuDropdown.cjs");
const require_MenuItem = require("./MenuItem/MenuItem.cjs");
const require_MenuLabel = require("./MenuLabel/MenuLabel.cjs");
const require_MenuSub = require("./MenuSub/MenuSub.cjs");
const require_MenuTarget = require("./MenuTarget/MenuTarget.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/Menu/Menu.tsx
const defaultProps = {
	trapFocus: true,
	closeOnItemClick: true,
	withInitialFocusPlaceholder: true,
	clickOutsideEvents: [
		"mousedown",
		"touchstart",
		"keydown"
	],
	loop: true,
	trigger: "click",
	openDelay: 0,
	closeDelay: 100,
	menuItemTabIndex: -1
};
const Menu = require_factory.factory((_props) => {
	const props = require_use_props.useProps("Menu", defaultProps, _props);
	const { children, onOpen, onClose, opened, defaultOpened, trapFocus, onChange, closeOnItemClick, loop, closeOnEscape, trigger, openDelay, closeDelay, classNames, styles, unstyled, variant, vars, menuItemTabIndex, keepMounted, withInitialFocusPlaceholder, attributes, ...others } = props;
	const getStyles = require_use_styles.useStyles({
		name: "Menu",
		classes: require_Menu_module.default,
		props,
		classNames,
		styles,
		unstyled,
		attributes
	});
	const [_opened, setOpened] = (0, _mantine_hooks.useUncontrolled)({
		value: opened,
		defaultValue: defaultOpened,
		finalValue: false,
		onChange
	});
	const [openedViaClick, setOpenedViaClick] = (0, react.useState)(false);
	const close = () => {
		setOpened(false);
		setOpenedViaClick(false);
		_opened && onClose?.();
	};
	const open = () => {
		setOpened(true);
		!_opened && onOpen?.();
	};
	const toggleDropdown = () => {
		_opened ? close() : open();
	};
	const { openDropdown, closeDropdown } = require_use_delayed_hover.useDelayedHover({
		open,
		close,
		closeDelay,
		openDelay
	});
	const getItemIndex = (node) => require_get_context_item_index.getContextItemIndex("[data-menu-item]", "[data-menu-dropdown]", node);
	const { resolvedClassNames, resolvedStyles } = require_use_resolved_styles_api.useResolvedStylesApi({
		classNames,
		styles,
		props
	});
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Menu_context.MenuContextProvider, {
		value: {
			getStyles,
			opened: _opened,
			toggleDropdown,
			getItemIndex,
			openedViaClick,
			setOpenedViaClick,
			closeOnItemClick,
			closeDropdown: trigger === "click" ? close : closeDropdown,
			openDropdown: trigger === "click" ? open : openDropdown,
			closeDropdownImmediately: close,
			loop,
			trigger,
			unstyled,
			menuItemTabIndex,
			withInitialFocusPlaceholder
		},
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Popover.Popover, {
			returnFocus: true,
			...others,
			opened: _opened,
			onChange: toggleDropdown,
			defaultOpened,
			trapFocus: keepMounted ? false : trapFocus,
			closeOnEscape,
			__staticSelector: "Menu",
			classNames: resolvedClassNames,
			styles: resolvedStyles,
			unstyled,
			variant,
			keepMounted,
			children
		})
	});
});
Menu.displayName = "@mantine/core/Menu";
Menu.classes = require_Menu_module.default;
Menu.Item = require_MenuItem.MenuItem;
Menu.Label = require_MenuLabel.MenuLabel;
Menu.Dropdown = require_MenuDropdown.MenuDropdown;
Menu.Target = require_MenuTarget.MenuTarget;
Menu.Divider = require_MenuDivider.MenuDivider;
Menu.Sub = require_MenuSub.MenuSub;
//#endregion
exports.Menu = Menu;

//# sourceMappingURL=Menu.cjs.map