@mantine/core 9.2.2 → 9.3.1

package/esm/components/Menu/Menu.mjs

@@ -7,11 +7,17 @@ import { factory } from "../../core/factory/factory.mjs";
 import { useDelayedHover } from "../../utils/Floating/use-delayed-hover.mjs";
 import { Popover } from "../Popover/Popover.mjs";
 import { MenuContextProvider } from "./Menu.context.mjs";
+import { MenuCheckboxGroup } from "./MenuCheckboxGroup/MenuCheckboxGroup.mjs";
 import Menu_module_default from "./Menu.module.mjs";
+import { MenuCheckboxItem } from "./MenuCheckboxItem/MenuCheckboxItem.mjs";
+import { MenuContextMenu } from "./MenuContextMenu/MenuContextMenu.mjs";
 import { MenuDivider } from "./MenuDivider/MenuDivider.mjs";
 import { MenuDropdown } from "./MenuDropdown/MenuDropdown.mjs";
 import { MenuItem } from "./MenuItem/MenuItem.mjs";
 import { MenuLabel } from "./MenuLabel/MenuLabel.mjs";
+import { MenuRadioGroup } from "./MenuRadioGroup/MenuRadioGroup.mjs";
+import { MenuRadioItem } from "./MenuRadioItem/MenuRadioItem.mjs";
+import { MenuSearch } from "./MenuSearch/MenuSearch.mjs";
 import { MenuSub } from "./MenuSub/MenuSub.mjs";
 import { MenuTarget } from "./MenuTarget/MenuTarget.mjs";
 import { useCallback, useRef, useState } from "react";
@@ -31,11 +37,12 @@ const defaultProps = {
 	trigger: "click",
 	openDelay: 0,
 	closeDelay: 100,
-	menuItemTabIndex: -1
+	menuItemTabIndex: -1,
+	alignItemsLabels: "with-indicators"
 };
 const Menu = factory((_props) => {
 	const 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 { children, onOpen, onClose, opened, defaultOpened, trapFocus, onChange, closeOnItemClick, loop, closeOnEscape, trigger, openDelay, closeDelay, classNames, styles, unstyled, variant, vars, menuItemTabIndex, keepMounted, withInitialFocusPlaceholder, attributes, onExitTransitionEnd, alignItemsLabels, checkIcon, ...others } = props;
 	const getStyles = useStyles({
 		name: "Menu",
 		classes: Menu_module_default,
@@ -79,6 +86,21 @@ const Menu = factory((_props) => {
 			if (activeSubCloseRef.current === closeFn) activeSubCloseRef.current = null;
 		};
 	}, []);
+	const searchCountRef = useRef(0);
+	const [hasSearch, setHasSearch] = useState(false);
+	const registerSearch = useCallback(() => {
+		searchCountRef.current += 1;
+		if (searchCountRef.current === 1) setHasSearch(true);
+		return () => {
+			searchCountRef.current -= 1;
+			if (searchCountRef.current === 0) setHasSearch(false);
+		};
+	}, []);
+	const searchExitClearRef = useRef(null);
+	const handleExitTransitionEnd = () => {
+		searchExitClearRef.current?.();
+		onExitTransitionEnd?.();
+	};
 	const getItemIndex = (node) => getContextItemIndex("[data-menu-item]", "[data-menu-dropdown]", node);
 	const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi({
 		classNames,
@@ -102,7 +124,12 @@ const Menu = factory((_props) => {
 			unstyled,
 			menuItemTabIndex,
 			withInitialFocusPlaceholder,
-			registerOpenSub
+			registerOpenSub,
+			hasSearch,
+			registerSearch,
+			searchExitClearRef,
+			alignItemsLabels,
+			checkIcon
 		},
 		children: /* @__PURE__ */ jsx(Popover, {
 			returnFocus: true,
@@ -118,6 +145,7 @@ const Menu = factory((_props) => {
 			unstyled,
 			variant,
 			keepMounted,
+			onExitTransitionEnd: handleExitTransitionEnd,
 			children
 		})
 	});
@@ -129,7 +157,13 @@ Menu.Label = MenuLabel;
 Menu.Dropdown = MenuDropdown;
 Menu.Target = MenuTarget;
 Menu.Divider = MenuDivider;
+Menu.Search = MenuSearch;
 Menu.Sub = MenuSub;
+Menu.CheckboxItem = MenuCheckboxItem;
+Menu.CheckboxGroup = MenuCheckboxGroup;
+Menu.RadioItem = MenuRadioItem;
+Menu.RadioGroup = MenuRadioGroup;
+Menu.ContextMenu = MenuContextMenu;
 //#endregion
 export { Menu };
 

package/esm/components/Menu/Menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.mjs","names":["classes"],"sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n  factory,\n  Factory,\n  getContextItemIndex,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport { useDelayedHover } from '../../utils/Floating';\nimport { __PopoverProps, Popover, PopoverStylesNames } from '../Popover';\nimport { MenuContextProvider, type MenuContextValue } from './Menu.context';\nimport { MenuDivider, type MenuDividerProps } from './MenuDivider/MenuDivider';\nimport { MenuDropdown, type MenuDropdownProps } from './MenuDropdown/MenuDropdown';\nimport { MenuItem, type MenuItemProps } from './MenuItem/MenuItem';\nimport { MenuLabel, type MenuLabelProps } from './MenuLabel/MenuLabel';\nimport { MenuSub, type MenuSubProps } from './MenuSub/MenuSub';\nimport { MenuTarget, type MenuTargetProps } from './MenuTarget/MenuTarget';\nimport classes from './Menu.module.css';\nimport type { MenuSubDropdownProps } from './MenuSubDropdown/MenuSubDropdown';\nimport type { MenuSubItemProps } from './MenuSubItem/MenuSubItem';\nimport type { MenuSubTargetProps } from './MenuSubTarget/MenuSubTarget';\n\nexport type MenuStylesNames =\n  | 'item'\n  | 'itemLabel'\n  | 'itemSection'\n  | 'label'\n  | 'divider'\n  | 'chevron'\n  | PopoverStylesNames;\n\nexport type MenuFactory = Factory<{\n  props: MenuProps;\n  stylesNames: MenuStylesNames;\n  staticComponents: {\n    Item: typeof MenuItem;\n    Label: typeof MenuLabel;\n    Dropdown: typeof MenuDropdown;\n    Target: typeof MenuTarget;\n    Divider: typeof MenuDivider;\n    Sub: typeof MenuSub;\n  };\n}>;\n\nexport interface MenuProps extends __PopoverProps, StylesApiProps<MenuFactory> {\n  variant?: string;\n\n  /** Menu children */\n  children?: React.ReactNode;\n\n  /** Controlled menu opened state */\n  opened?: boolean;\n\n  /** Uncontrolled menu initial opened state */\n  defaultOpened?: boolean;\n\n  /** If set, focus is trapped within the menu dropdown when it is opened */\n  trapFocus?: boolean;\n\n  /** Called when menu opened state changes */\n  onChange?: (opened: boolean) => void;\n\n  /** Called when Menu is opened */\n  onOpen?: () => void;\n\n  /** Called when Menu is closed */\n  onClose?: () => void;\n\n  /** If set, the Menu is closed when one of the items is clicked. Can be overridden per item with `closeMenuOnClick` prop */\n  closeOnItemClick?: boolean;\n\n  /** If set, arrow key presses wrap around from last item to first and vice versa */\n  loop?: boolean;\n\n  /** If set, the dropdown is closed when the `Escape` key is pressed @default true */\n  closeOnEscape?: boolean;\n\n  /** Event trigger to open menu. Note: 'hover' is not keyboard accessible; prefer 'click-hover' for accessible hover menus */\n  trigger?: 'click' | 'hover' | 'click-hover';\n\n  /** Open delay in ms, applicable only to `trigger=\"hover\"` variant */\n  openDelay?: number;\n\n  /** Close delay in ms, applicable only to `trigger=\"hover\"` variant */\n  closeDelay?: number;\n\n  /** If set, the dropdown is closed on outside clicks */\n  closeOnClickOutside?: boolean;\n\n  /** Events that trigger outside click detection. Includes mousedown for desktop clicks, touchstart for mobile, and keydown for Escape key handling @default ['mousedown', 'touchstart', 'keydown'] */\n  clickOutsideEvents?: string[];\n\n  /** Id base to create accessibility connections */\n  id?: string;\n\n  /** Set the `tabindex` on all menu items. Use `0` to allow Tab key navigation through menu items (required for navigation menus following WAI-ARIA disclosure pattern). @default -1 */\n  menuItemTabIndex?: -1 | 0;\n\n  /** Adds a hidden focusable element at the start of the dropdown to prevent unexpected focus jumps when opening with keyboard. Set to false if you need custom focus management. @default true */\n  withInitialFocusPlaceholder?: boolean;\n\n  /** Determines whether focus should be automatically returned to control when dropdown closes @default `true` */\n  returnFocus?: boolean;\n}\n\nconst defaultProps = {\n  trapFocus: true,\n  closeOnItemClick: true,\n  withInitialFocusPlaceholder: true,\n  clickOutsideEvents: ['mousedown', 'touchstart', 'keydown'],\n  loop: true,\n  trigger: 'click',\n  openDelay: 0,\n  closeDelay: 100,\n  menuItemTabIndex: -1,\n} satisfies Partial<MenuProps>;\n\nexport const Menu = factory<MenuFactory>((_props) => {\n  const props = useProps('Menu', defaultProps, _props);\n  const {\n    children,\n    onOpen,\n    onClose,\n    opened,\n    defaultOpened,\n    trapFocus,\n    onChange,\n    closeOnItemClick,\n    loop,\n    closeOnEscape,\n    trigger,\n    openDelay,\n    closeDelay,\n    classNames,\n    styles,\n    unstyled,\n    variant,\n    vars,\n    menuItemTabIndex,\n    keepMounted,\n    withInitialFocusPlaceholder,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<MenuFactory>({\n    name: 'Menu',\n    classes,\n    props,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n  });\n\n  const [_opened, setOpened] = useUncontrolled({\n    value: opened,\n    defaultValue: defaultOpened,\n    finalValue: false,\n    onChange,\n  });\n  const [openedViaClick, setOpenedViaClick] = useState(false);\n\n  const close = () => {\n    setOpened(false);\n    setOpenedViaClick(false);\n    _opened && onClose?.();\n  };\n\n  const open = () => {\n    setOpened(true);\n    !_opened && onOpen?.();\n  };\n\n  const toggleDropdown = () => {\n    _opened ? close() : open();\n  };\n\n  const { openDropdown, closeDropdown } = useDelayedHover({ open, close, closeDelay, openDelay });\n\n  const activeSubCloseRef = useRef<(() => void) | null>(null);\n  const registerOpenSub = useCallback((closeFn: () => void) => {\n    const prev = activeSubCloseRef.current;\n    if (prev && prev !== closeFn) {\n      prev();\n    }\n    activeSubCloseRef.current = closeFn;\n    return () => {\n      if (activeSubCloseRef.current === closeFn) {\n        activeSubCloseRef.current = null;\n      }\n    };\n  }, []);\n\n  const getItemIndex = (node: HTMLButtonElement) =>\n    getContextItemIndex('[data-menu-item]', '[data-menu-dropdown]', node);\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MenuFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <MenuContextProvider\n      value={{\n        getStyles,\n        opened: _opened,\n        toggleDropdown,\n        getItemIndex,\n        openedViaClick,\n        setOpenedViaClick,\n        closeOnItemClick,\n        closeDropdown: trigger === 'click' ? close : closeDropdown,\n        openDropdown: trigger === 'click' ? open : openDropdown,\n        closeDropdownImmediately: close,\n        loop,\n        trigger,\n        unstyled,\n        menuItemTabIndex,\n        withInitialFocusPlaceholder,\n        registerOpenSub,\n      }}\n    >\n      <Popover\n        returnFocus\n        {...others}\n        opened={_opened}\n        onChange={toggleDropdown}\n        defaultOpened={defaultOpened}\n        trapFocus={keepMounted ? false : trapFocus}\n        closeOnEscape={closeOnEscape}\n        __staticSelector=\"Menu\"\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        variant={variant}\n        keepMounted={keepMounted}\n      >\n        {children}\n      </Popover>\n    </MenuContextProvider>\n  );\n});\n\nMenu.displayName = '@mantine/core/Menu';\nMenu.classes = classes;\nMenu.Item = MenuItem;\nMenu.Label = MenuLabel;\nMenu.Dropdown = MenuDropdown;\nMenu.Target = MenuTarget;\nMenu.Divider = MenuDivider;\nMenu.Sub = MenuSub;\n\nexport namespace Menu {\n  export type Props = MenuProps;\n  export type StylesNames = MenuStylesNames;\n  export type Factory = MenuFactory;\n  export type ContextValue = MenuContextValue;\n\n  export namespace Item {\n    export type Props = MenuItemProps;\n  }\n\n  export namespace Label {\n    export type Props = MenuLabelProps;\n  }\n\n  export namespace Divider {\n    export type Props = MenuDividerProps;\n  }\n\n  export namespace Dropdown {\n    export type Props = MenuDropdownProps;\n  }\n\n  export namespace Target {\n    export type Props = MenuTargetProps;\n  }\n\n  export namespace Sub {\n    export type Props = MenuSubProps;\n  }\n\n  export namespace SubDropdown {\n    export type Props = MenuSubDropdownProps;\n  }\n\n  export namespace SubItem {\n    export type Props = MenuSubItemProps;\n  }\n\n  export namespace SubTarget {\n    export type Props = MenuSubTargetProps;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA4GA,MAAM,eAAe;CACnB,WAAW;CACX,kBAAkB;CAClB,6BAA6B;CAC7B,oBAAoB;EAAC;EAAa;EAAc;CAAS;CACzD,MAAM;CACN,SAAS;CACT,WAAW;CACX,YAAY;CACZ,kBAAkB;AACpB;AAEA,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,UACA,QACA,SACA,QACA,eACA,WACA,UACA,kBACA,MACA,eACA,SACA,WACA,YACA,YACA,QACA,UACA,SACA,MACA,kBACA,aACA,6BACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,CAAC,SAAS,aAAa,gBAAgB;EAC3C,OAAO;EACP,cAAc;EACd,YAAY;EACZ;CACF,CAAC;CACD,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,KAAK;CAE1D,MAAM,cAAc;EAClB,UAAU,KAAK;EACf,kBAAkB,KAAK;EACvB,WAAW,UAAU;CACvB;CAEA,MAAM,aAAa;EACjB,UAAU,IAAI;EACd,CAAC,WAAW,SAAS;CACvB;CAEA,MAAM,uBAAuB;EAC3B,UAAU,MAAM,IAAI,KAAK;CAC3B;CAEA,MAAM,EAAE,cAAc,kBAAkB,gBAAgB;EAAE;EAAM;EAAO;EAAY;CAAU,CAAC;CAE9F,MAAM,oBAAoB,OAA4B,IAAI;CAC1D,MAAM,kBAAkB,aAAa,YAAwB;EAC3D,MAAM,OAAO,kBAAkB;EAC/B,IAAI,QAAQ,SAAS,SACnB,KAAK;EAEP,kBAAkB,UAAU;EAC5B,aAAa;GACX,IAAI,kBAAkB,YAAY,SAChC,kBAAkB,UAAU;EAEhC;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,gBAAgB,SACpB,oBAAoB,oBAAoB,wBAAwB,IAAI;CAEtE,MAAM,EAAE,oBAAoB,mBAAmB,qBAAkC;EAC/E;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,qBAAD;EACE,OAAO;GACL;GACA,QAAQ;GACR;GACA;GACA;GACA;GACA;GACA,eAAe,YAAY,UAAU,QAAQ;GAC7C,cAAc,YAAY,UAAU,OAAO;GAC3C,0BAA0B;GAC1B;GACA;GACA;GACA;GACA;GACA;EACF;YAEA,oBAAC,SAAD;GACE,aAAA;GACA,GAAI;GACJ,QAAQ;GACR,UAAU;GACK;GACf,WAAW,cAAc,QAAQ;GAClB;GACf,kBAAiB;GACjB,YAAY;GACZ,QAAQ;GACE;GACD;GACI;GAEZ;EACM,CAAA;CACU,CAAA;AAEzB,CAAC;AAED,KAAK,cAAc;AACnB,KAAK,UAAUA;AACf,KAAK,OAAO;AACZ,KAAK,QAAQ;AACb,KAAK,WAAW;AAChB,KAAK,SAAS;AACd,KAAK,UAAU;AACf,KAAK,MAAM"}
+{"version":3,"file":"Menu.mjs","names":["classes"],"sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n  factory,\n  Factory,\n  getContextItemIndex,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport { useDelayedHover } from '../../utils/Floating';\nimport { __PopoverProps, Popover, PopoverStylesNames } from '../Popover';\nimport { MenuContextProvider, type MenuContextValue } from './Menu.context';\nimport {\n  MenuCheckboxGroup,\n  type MenuCheckboxGroupProps,\n} from './MenuCheckboxGroup/MenuCheckboxGroup';\nimport { MenuCheckboxItem, type MenuCheckboxItemProps } from './MenuCheckboxItem/MenuCheckboxItem';\nimport { MenuContextMenu, type MenuContextMenuProps } from './MenuContextMenu/MenuContextMenu';\nimport { MenuDivider, type MenuDividerProps } from './MenuDivider/MenuDivider';\nimport { MenuDropdown, type MenuDropdownProps } from './MenuDropdown/MenuDropdown';\nimport { MenuItem, type MenuItemProps } from './MenuItem/MenuItem';\nimport { MenuLabel, type MenuLabelProps } from './MenuLabel/MenuLabel';\nimport { MenuRadioGroup, type MenuRadioGroupProps } from './MenuRadioGroup/MenuRadioGroup';\nimport { MenuRadioItem, type MenuRadioItemProps } from './MenuRadioItem/MenuRadioItem';\nimport { MenuSearch, type MenuSearchProps } from './MenuSearch/MenuSearch';\nimport { MenuSub, type MenuSubProps } from './MenuSub/MenuSub';\nimport { MenuTarget, type MenuTargetProps } from './MenuTarget/MenuTarget';\nimport classes from './Menu.module.css';\nimport type { MenuSubDropdownProps } from './MenuSubDropdown/MenuSubDropdown';\nimport type { MenuSubItemProps } from './MenuSubItem/MenuSubItem';\nimport type { MenuSubTargetProps } from './MenuSubTarget/MenuSubTarget';\n\nexport type MenuStylesNames =\n  | 'item'\n  | 'itemLabel'\n  | 'itemSection'\n  | 'itemIndicator'\n  | 'label'\n  | 'divider'\n  | 'chevron'\n  | 'search'\n  | PopoverStylesNames;\n\nexport type MenuFactory = Factory<{\n  props: MenuProps;\n  stylesNames: MenuStylesNames;\n  staticComponents: {\n    Item: typeof MenuItem;\n    Label: typeof MenuLabel;\n    Dropdown: typeof MenuDropdown;\n    Target: typeof MenuTarget;\n    Divider: typeof MenuDivider;\n    Search: typeof MenuSearch;\n    Sub: typeof MenuSub;\n    CheckboxItem: typeof MenuCheckboxItem;\n    CheckboxGroup: typeof MenuCheckboxGroup;\n    RadioItem: typeof MenuRadioItem;\n    RadioGroup: typeof MenuRadioGroup;\n    ContextMenu: typeof MenuContextMenu;\n  };\n}>;\n\nexport interface MenuProps extends __PopoverProps, StylesApiProps<MenuFactory> {\n  variant?: string;\n\n  /** Menu children */\n  children?: React.ReactNode;\n\n  /** Controlled menu opened state */\n  opened?: boolean;\n\n  /** Uncontrolled menu initial opened state */\n  defaultOpened?: boolean;\n\n  /** If set, focus is trapped within the menu dropdown when it is opened */\n  trapFocus?: boolean;\n\n  /** Called when menu opened state changes */\n  onChange?: (opened: boolean) => void;\n\n  /** Called when Menu is opened */\n  onOpen?: () => void;\n\n  /** Called when Menu is closed */\n  onClose?: () => void;\n\n  /** If set, the Menu is closed when one of the items is clicked. Can be overridden per item with `closeMenuOnClick` prop */\n  closeOnItemClick?: boolean;\n\n  /** If set, arrow key presses wrap around from last item to first and vice versa */\n  loop?: boolean;\n\n  /** If set, the dropdown is closed when the `Escape` key is pressed @default true */\n  closeOnEscape?: boolean;\n\n  /** Event trigger to open menu. Note: 'hover' is not keyboard accessible; prefer 'click-hover' for accessible hover menus */\n  trigger?: 'click' | 'hover' | 'click-hover';\n\n  /** Open delay in ms, applicable only to `trigger=\"hover\"` variant */\n  openDelay?: number;\n\n  /** Close delay in ms, applicable only to `trigger=\"hover\"` variant */\n  closeDelay?: number;\n\n  /** If set, the dropdown is closed on outside clicks */\n  closeOnClickOutside?: boolean;\n\n  /** Events that trigger outside click detection. Includes mousedown for desktop clicks, touchstart for mobile, and keydown for Escape key handling @default ['mousedown', 'touchstart', 'keydown'] */\n  clickOutsideEvents?: string[];\n\n  /** Id base to create accessibility connections */\n  id?: string;\n\n  /** Set the `tabindex` on all menu items. Use `0` to allow Tab key navigation through menu items (required for navigation menus following WAI-ARIA disclosure pattern). @default -1 */\n  menuItemTabIndex?: -1 | 0;\n\n  /** Adds a hidden focusable element at the start of the dropdown to prevent unexpected focus jumps when opening with keyboard. Set to false if you need custom focus management. @default true */\n  withInitialFocusPlaceholder?: boolean;\n\n  /** Determines whether focus should be automatically returned to control when dropdown closes @default `true` */\n  returnFocus?: boolean;\n\n  /** Controls how indicator slot space is reserved on menu items for label alignment. `'all'` reserves space on every `Menu.Item`, `'with-indicators'` reserves space only on `Menu.CheckboxItem` and `Menu.RadioItem`, `'none'` reserves space only on items that currently display an indicator. @default 'with-indicators' */\n  alignItemsLabels?: 'all' | 'with-indicators' | 'none';\n\n  /** Custom icon rendered as the indicator of checked `Menu.CheckboxItem` and selected `Menu.RadioItem`. Can be overridden per item with the `checkIcon` prop. */\n  checkIcon?: React.ReactNode;\n}\n\nconst defaultProps = {\n  trapFocus: true,\n  closeOnItemClick: true,\n  withInitialFocusPlaceholder: true,\n  clickOutsideEvents: ['mousedown', 'touchstart', 'keydown'],\n  loop: true,\n  trigger: 'click',\n  openDelay: 0,\n  closeDelay: 100,\n  menuItemTabIndex: -1,\n  alignItemsLabels: 'with-indicators',\n} satisfies Partial<MenuProps>;\n\nexport const Menu = factory<MenuFactory>((_props) => {\n  const props = useProps('Menu', defaultProps, _props);\n  const {\n    children,\n    onOpen,\n    onClose,\n    opened,\n    defaultOpened,\n    trapFocus,\n    onChange,\n    closeOnItemClick,\n    loop,\n    closeOnEscape,\n    trigger,\n    openDelay,\n    closeDelay,\n    classNames,\n    styles,\n    unstyled,\n    variant,\n    vars,\n    menuItemTabIndex,\n    keepMounted,\n    withInitialFocusPlaceholder,\n    attributes,\n    onExitTransitionEnd,\n    alignItemsLabels,\n    checkIcon,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<MenuFactory>({\n    name: 'Menu',\n    classes,\n    props,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n  });\n\n  const [_opened, setOpened] = useUncontrolled({\n    value: opened,\n    defaultValue: defaultOpened,\n    finalValue: false,\n    onChange,\n  });\n  const [openedViaClick, setOpenedViaClick] = useState(false);\n\n  const close = () => {\n    setOpened(false);\n    setOpenedViaClick(false);\n    _opened && onClose?.();\n  };\n\n  const open = () => {\n    setOpened(true);\n    !_opened && onOpen?.();\n  };\n\n  const toggleDropdown = () => {\n    _opened ? close() : open();\n  };\n\n  const { openDropdown, closeDropdown } = useDelayedHover({ open, close, closeDelay, openDelay });\n\n  const activeSubCloseRef = useRef<(() => void) | null>(null);\n  const registerOpenSub = useCallback((closeFn: () => void) => {\n    const prev = activeSubCloseRef.current;\n    if (prev && prev !== closeFn) {\n      prev();\n    }\n    activeSubCloseRef.current = closeFn;\n    return () => {\n      if (activeSubCloseRef.current === closeFn) {\n        activeSubCloseRef.current = null;\n      }\n    };\n  }, []);\n\n  const searchCountRef = useRef(0);\n  const [hasSearch, setHasSearch] = useState(false);\n  const registerSearch = useCallback(() => {\n    searchCountRef.current += 1;\n    if (searchCountRef.current === 1) {\n      setHasSearch(true);\n    }\n    return () => {\n      searchCountRef.current -= 1;\n      if (searchCountRef.current === 0) {\n        setHasSearch(false);\n      }\n    };\n  }, []);\n\n  const searchExitClearRef = useRef<(() => void) | null>(null);\n  const handleExitTransitionEnd = () => {\n    searchExitClearRef.current?.();\n    onExitTransitionEnd?.();\n  };\n\n  const getItemIndex = (node: HTMLButtonElement) =>\n    getContextItemIndex('[data-menu-item]', '[data-menu-dropdown]', node);\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MenuFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <MenuContextProvider\n      value={{\n        getStyles,\n        opened: _opened,\n        toggleDropdown,\n        getItemIndex,\n        openedViaClick,\n        setOpenedViaClick,\n        closeOnItemClick,\n        closeDropdown: trigger === 'click' ? close : closeDropdown,\n        openDropdown: trigger === 'click' ? open : openDropdown,\n        closeDropdownImmediately: close,\n        loop,\n        trigger,\n        unstyled,\n        menuItemTabIndex,\n        withInitialFocusPlaceholder,\n        registerOpenSub,\n        hasSearch,\n        registerSearch,\n        searchExitClearRef,\n        alignItemsLabels: alignItemsLabels!,\n        checkIcon,\n      }}\n    >\n      <Popover\n        returnFocus\n        {...others}\n        opened={_opened}\n        onChange={toggleDropdown}\n        defaultOpened={defaultOpened}\n        trapFocus={keepMounted ? false : trapFocus}\n        closeOnEscape={closeOnEscape}\n        __staticSelector=\"Menu\"\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        variant={variant}\n        keepMounted={keepMounted}\n        onExitTransitionEnd={handleExitTransitionEnd}\n      >\n        {children}\n      </Popover>\n    </MenuContextProvider>\n  );\n});\n\nMenu.displayName = '@mantine/core/Menu';\nMenu.classes = classes;\nMenu.Item = MenuItem;\nMenu.Label = MenuLabel;\nMenu.Dropdown = MenuDropdown;\nMenu.Target = MenuTarget;\nMenu.Divider = MenuDivider;\nMenu.Search = MenuSearch;\nMenu.Sub = MenuSub;\nMenu.CheckboxItem = MenuCheckboxItem;\nMenu.CheckboxGroup = MenuCheckboxGroup;\nMenu.RadioItem = MenuRadioItem;\nMenu.RadioGroup = MenuRadioGroup;\nMenu.ContextMenu = MenuContextMenu;\n\nexport namespace Menu {\n  export type Props = MenuProps;\n  export type StylesNames = MenuStylesNames;\n  export type Factory = MenuFactory;\n  export type ContextValue = MenuContextValue;\n\n  export namespace Item {\n    export type Props = MenuItemProps;\n  }\n\n  export namespace Label {\n    export type Props = MenuLabelProps;\n  }\n\n  export namespace Divider {\n    export type Props = MenuDividerProps;\n  }\n\n  export namespace Dropdown {\n    export type Props = MenuDropdownProps;\n  }\n\n  export namespace Target {\n    export type Props = MenuTargetProps;\n  }\n\n  export namespace Search {\n    export type Props = MenuSearchProps;\n  }\n\n  export namespace Sub {\n    export type Props = MenuSubProps;\n  }\n\n  export namespace CheckboxItem {\n    export type Props = MenuCheckboxItemProps;\n  }\n\n  export namespace RadioItem {\n    export type Props = MenuRadioItemProps;\n  }\n\n  export namespace RadioGroup {\n    export type Props = MenuRadioGroupProps;\n  }\n\n  export namespace CheckboxGroup {\n    export type Props = MenuCheckboxGroupProps;\n  }\n\n  export namespace ContextMenu {\n    export type Props = MenuContextMenuProps;\n  }\n\n  export namespace SubDropdown {\n    export type Props = MenuSubDropdownProps;\n  }\n\n  export namespace SubItem {\n    export type Props = MenuSubItemProps;\n  }\n\n  export namespace SubTarget {\n    export type Props = MenuSubTargetProps;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAmIA,MAAM,eAAe;CACnB,WAAW;CACX,kBAAkB;CAClB,6BAA6B;CAC7B,oBAAoB;EAAC;EAAa;EAAc;CAAS;CACzD,MAAM;CACN,SAAS;CACT,WAAW;CACX,YAAY;CACZ,kBAAkB;CAClB,kBAAkB;AACpB;AAEA,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,UACA,QACA,SACA,QACA,eACA,WACA,UACA,kBACA,MACA,eACA,SACA,WACA,YACA,YACA,QACA,UACA,SACA,MACA,kBACA,aACA,6BACA,YACA,qBACA,kBACA,WACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,CAAC,SAAS,aAAa,gBAAgB;EAC3C,OAAO;EACP,cAAc;EACd,YAAY;EACZ;CACF,CAAC;CACD,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,KAAK;CAE1D,MAAM,cAAc;EAClB,UAAU,KAAK;EACf,kBAAkB,KAAK;EACvB,WAAW,UAAU;CACvB;CAEA,MAAM,aAAa;EACjB,UAAU,IAAI;EACd,CAAC,WAAW,SAAS;CACvB;CAEA,MAAM,uBAAuB;EAC3B,UAAU,MAAM,IAAI,KAAK;CAC3B;CAEA,MAAM,EAAE,cAAc,kBAAkB,gBAAgB;EAAE;EAAM;EAAO;EAAY;CAAU,CAAC;CAE9F,MAAM,oBAAoB,OAA4B,IAAI;CAC1D,MAAM,kBAAkB,aAAa,YAAwB;EAC3D,MAAM,OAAO,kBAAkB;EAC/B,IAAI,QAAQ,SAAS,SACnB,KAAK;EAEP,kBAAkB,UAAU;EAC5B,aAAa;GACX,IAAI,kBAAkB,YAAY,SAChC,kBAAkB,UAAU;EAEhC;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,iBAAiB,OAAO,CAAC;CAC/B,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAChD,MAAM,iBAAiB,kBAAkB;EACvC,eAAe,WAAW;EAC1B,IAAI,eAAe,YAAY,GAC7B,aAAa,IAAI;EAEnB,aAAa;GACX,eAAe,WAAW;GAC1B,IAAI,eAAe,YAAY,GAC7B,aAAa,KAAK;EAEtB;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,qBAAqB,OAA4B,IAAI;CAC3D,MAAM,gCAAgC;EACpC,mBAAmB,UAAU;EAC7B,sBAAsB;CACxB;CAEA,MAAM,gBAAgB,SACpB,oBAAoB,oBAAoB,wBAAwB,IAAI;CAEtE,MAAM,EAAE,oBAAoB,mBAAmB,qBAAkC;EAC/E;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,qBAAD;EACE,OAAO;GACL;GACA,QAAQ;GACR;GACA;GACA;GACA;GACA;GACA,eAAe,YAAY,UAAU,QAAQ;GAC7C,cAAc,YAAY,UAAU,OAAO;GAC3C,0BAA0B;GAC1B;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACkB;GAClB;EACF;YAEA,oBAAC,SAAD;GACE,aAAA;GACA,GAAI;GACJ,QAAQ;GACR,UAAU;GACK;GACf,WAAW,cAAc,QAAQ;GAClB;GACf,kBAAiB;GACjB,YAAY;GACZ,QAAQ;GACE;GACD;GACI;GACb,qBAAqB;GAEpB;EACM,CAAA;CACU,CAAA;AAEzB,CAAC;AAED,KAAK,cAAc;AACnB,KAAK,UAAUA;AACf,KAAK,OAAO;AACZ,KAAK,QAAQ;AACb,KAAK,WAAW;AAChB,KAAK,SAAS;AACd,KAAK,UAAU;AACf,KAAK,SAAS;AACd,KAAK,MAAM;AACX,KAAK,eAAe;AACpB,KAAK,gBAAgB;AACrB,KAAK,YAAY;AACjB,KAAK,aAAa;AAClB,KAAK,cAAc"}

package/esm/components/Menu/Menu.module.mjs

@@ -5,7 +5,9 @@ var Menu_module_default = {
 	"label": "m_9bfac126",
 	"divider": "m_efdf90cb",
 	"item": "m_99ac2aa1",
+	"search": "m_ef8769b6",
 	"itemLabel": "m_5476e0d3",
+	"itemIndicator": "m_8395186e",
 	"itemSection": "m_8b75e504",
 	"chevron": "m_b85b0bed"
 };

package/esm/components/Menu/Menu.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.module.mjs","names":[],"sources":["../../../src/components/Menu/Menu.module.css"],"sourcesContent":[".dropdown {\n  padding: 4px;\n}\n\n.label {\n  color: var(--mantine-color-dimmed);\n  font-weight: var(--mantine-font-weight-medium);\n  font-size: var(--mantine-font-size-xs);\n  padding: calc(var(--mantine-spacing-xs) / 2) var(--mantine-spacing-sm);\n  cursor: default;\n}\n\n.divider {\n  margin-top: 4px;\n  margin-bottom: 4px;\n  border-top: 1px solid;\n\n  @mixin where-light {\n    border-color: var(--mantine-color-gray-2);\n  }\n\n  @mixin where-dark {\n    border-color: var(--mantine-color-dark-4);\n  }\n}\n\n.item {\n  font-size: var(--mantine-font-size-sm);\n  width: 100%;\n  padding: calc(var(--mantine-spacing-xs) / 1.5) var(--mantine-spacing-sm);\n  border-radius: var(--popover-radius, var(--mantine-radius-default));\n  color: var(--menu-item-color, var(--mantine-color-text));\n  display: flex;\n  align-items: center;\n  user-select: none;\n\n  &:where([data-disabled], :disabled) {\n    color: var(--mantine-color-disabled-color);\n    opacity: 0.6;\n    cursor: not-allowed;\n  }\n\n  &:where(:hover, :focus) {\n    &:where(:not(:disabled, [data-disabled])) {\n      @mixin where-light {\n        background-color: var(--menu-item-hover, var(--mantine-color-gray-1));\n      }\n\n      @mixin where-dark {\n        background-color: var(--menu-item-hover, var(--mantine-color-dark-4));\n      }\n    }\n  }\n\n  &:where([data-sub-menu-item]) {\n    padding-inline-end: 5px;\n  }\n}\n\n.itemLabel {\n  flex: 1;\n}\n\n.itemSection {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  &:where([data-position='left']) {\n    margin-inline-end: var(--mantine-spacing-xs);\n  }\n\n  &:where([data-position='right']) {\n    margin-inline-start: var(--mantine-spacing-xs);\n  }\n}\n\n.chevron {\n  transform: rotate(-90deg);\n\n  @mixin where-rtl {\n    transform: rotate(90deg);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"Menu.module.mjs","names":[],"sources":["../../../src/components/Menu/Menu.module.css"],"sourcesContent":[".dropdown {\n  padding: 4px;\n}\n\n.label {\n  color: var(--mantine-color-dimmed);\n  font-weight: var(--mantine-font-weight-medium);\n  font-size: var(--mantine-font-size-xs);\n  padding: calc(var(--mantine-spacing-xs) / 2) var(--mantine-spacing-sm);\n  cursor: default;\n}\n\n.divider {\n  margin-top: 4px;\n  margin-bottom: 4px;\n  border-top: 1px solid;\n\n  @mixin where-light {\n    border-color: var(--mantine-color-gray-2);\n  }\n\n  @mixin where-dark {\n    border-color: var(--mantine-color-dark-4);\n  }\n}\n\n.item {\n  font-size: var(--mantine-font-size-sm);\n  width: 100%;\n  padding: calc(var(--mantine-spacing-xs) / 1.5) var(--mantine-spacing-sm);\n  border-radius: var(--popover-radius, var(--mantine-radius-default));\n  color: var(--menu-item-color, var(--mantine-color-text));\n  display: flex;\n  align-items: center;\n  user-select: none;\n\n  &:where([data-disabled], :disabled) {\n    color: var(--mantine-color-disabled-color);\n    opacity: 0.6;\n    cursor: not-allowed;\n  }\n\n  &:where(:hover, :focus, [data-menu-active]) {\n    &:where(:not(:disabled, [data-disabled])) {\n      @mixin where-light {\n        background-color: var(--menu-item-hover, var(--mantine-color-gray-1));\n      }\n\n      @mixin where-dark {\n        background-color: var(--menu-item-hover, var(--mantine-color-dark-4));\n      }\n    }\n  }\n\n  &:where([data-sub-menu-item]) {\n    padding-inline-end: 5px;\n  }\n}\n\n.search {\n  --menu-search-padding: var(--popover-padding, 4px);\n\n  margin-inline: calc(var(--menu-search-padding) * -1);\n  margin-top: calc(var(--menu-search-padding) * -1);\n  width: calc(100% + var(--menu-search-padding) * 2);\n  border-top-width: 0;\n  border-inline-width: 0;\n  border-end-start-radius: 0;\n  border-end-end-radius: 0;\n  margin-bottom: var(--menu-search-padding);\n\n  &,\n  &:focus {\n    @mixin where-light {\n      border-color: var(--mantine-color-gray-2);\n    }\n\n    @mixin where-dark {\n      border-color: var(--mantine-color-dark-4);\n    }\n  }\n\n  @mixin where-light {\n    background-color: var(--mantine-color-white);\n  }\n\n  @mixin where-dark {\n    background-color: var(--mantine-color-dark-7);\n  }\n}\n\n.itemLabel {\n  flex: 1;\n}\n\n.itemIndicator {\n  width: 12px;\n  height: 12px;\n  flex-shrink: 0;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  margin-inline-end: 8px;\n}\n\n.itemSection {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  &:where([data-position='left']) {\n    margin-inline-end: var(--mantine-spacing-xs);\n  }\n\n  &:where([data-position='right']) {\n    margin-inline-start: var(--mantine-spacing-xs);\n  }\n}\n\n.chevron {\n  transform: rotate(-90deg);\n\n  @mixin where-rtl {\n    transform: rotate(90deg);\n  }\n}\n"],"mappings":""}

package/esm/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.mjs

@@ -0,0 +1,8 @@
+"use client";
+import { createContext } from "react";
+//#region packages/@mantine/core/src/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.tsx
+const MenuCheckboxGroupContext = createContext(null);
+//#endregion
+export { MenuCheckboxGroupContext };
+
+//# sourceMappingURL=MenuCheckboxGroup.context.mjs.map

package/esm/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuCheckboxGroup.context.mjs","names":[],"sources":["../../../../src/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.tsx"],"sourcesContent":["import { createContext } from 'react';\n\nexport interface MenuCheckboxGroupContextValue {\n  values: string[];\n  onChange: (value: string) => void;\n}\n\nexport const MenuCheckboxGroupContext = createContext<MenuCheckboxGroupContextValue | null>(null);\n"],"mappings":";;;AAOA,MAAa,2BAA2B,cAAoD,IAAI"}

package/esm/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.mjs

@@ -0,0 +1,30 @@
+"use client";
+import { useProps } from "../../../core/MantineProvider/use-props/use-props.mjs";
+import { MenuCheckboxGroupContext } from "./MenuCheckboxGroup.context.mjs";
+import { useCallback } from "react";
+import { useUncontrolled } from "@mantine/hooks";
+import { jsx } from "react/jsx-runtime";
+//#region packages/@mantine/core/src/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.tsx
+function MenuCheckboxGroup(_props) {
+	const { value, defaultValue, onChange, children } = useProps("MenuCheckboxGroup", null, _props);
+	const [_value, setValue] = useUncontrolled({
+		value,
+		defaultValue,
+		finalValue: [],
+		onChange
+	});
+	return /* @__PURE__ */ jsx(MenuCheckboxGroupContext, {
+		value: {
+			values: _value,
+			onChange: useCallback((next) => {
+				setValue(_value.includes(next) ? _value.filter((item) => item !== next) : [..._value, next]);
+			}, [_value, setValue])
+		},
+		children
+	});
+}
+MenuCheckboxGroup.displayName = "@mantine/core/MenuCheckboxGroup";
+//#endregion
+export { MenuCheckboxGroup };
+
+//# sourceMappingURL=MenuCheckboxGroup.mjs.map

package/esm/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuCheckboxGroup.mjs","names":[],"sources":["../../../../src/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.tsx"],"sourcesContent":["import { useCallback } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { useProps } from '../../../core';\nimport { MenuCheckboxGroupContext } from './MenuCheckboxGroup.context';\n\nexport interface MenuCheckboxGroupProps {\n  /** Controlled selected values */\n  value?: string[];\n\n  /** Uncontrolled default selected values */\n  defaultValue?: string[];\n\n  /** Called with the new array of selected values when a `Menu.CheckboxItem` is toggled */\n  onChange?: (value: string[]) => void;\n\n  /** `Menu.CheckboxItem` components and other elements */\n  children?: React.ReactNode;\n}\n\nexport function MenuCheckboxGroup(_props: MenuCheckboxGroupProps) {\n  const props = useProps('MenuCheckboxGroup', null, _props);\n  const { value, defaultValue, onChange, children } = props;\n\n  const [_value, setValue] = useUncontrolled<string[]>({\n    value,\n    defaultValue,\n    finalValue: [],\n    onChange,\n  });\n\n  const toggle = useCallback(\n    (next: string) => {\n      setValue(_value.includes(next) ? _value.filter((item) => item !== next) : [..._value, next]);\n    },\n    [_value, setValue]\n  );\n\n  return (\n    <MenuCheckboxGroupContext value={{ values: _value, onChange: toggle }}>\n      {children}\n    </MenuCheckboxGroupContext>\n  );\n}\n\nMenuCheckboxGroup.displayName = '@mantine/core/MenuCheckboxGroup';\n"],"mappings":";;;;;;;AAmBA,SAAgB,kBAAkB,QAAgC;CAEhE,MAAM,EAAE,OAAO,cAAc,UAAU,aADzB,SAAS,qBAAqB,MAAM,MACM;CAExD,MAAM,CAAC,QAAQ,YAAY,gBAA0B;EACnD;EACA;EACA,YAAY,CAAC;EACb;CACF,CAAC;CASD,OACE,oBAAC,0BAAD;EAA0B,OAAO;GAAE,QAAQ;GAAQ,UARtC,aACZ,SAAiB;IAChB,SAAS,OAAO,SAAS,IAAI,IAAI,OAAO,QAAQ,SAAS,SAAS,IAAI,IAAI,CAAC,GAAG,QAAQ,IAAI,CAAC;GAC7F,GACA,CAAC,QAAQ,QAAQ,CAIiD;EAAE;EACjE;CACuB,CAAA;AAE9B;AAEA,kBAAkB,cAAc"}

package/esm/components/Menu/MenuCheckboxItem/MenuCheckboxItem.mjs

@@ -0,0 +1,52 @@
+"use client";
+import { useProps } from "../../../core/MantineProvider/use-props/use-props.mjs";
+import { factory } from "../../../core/factory/factory.mjs";
+import { CheckIcon } from "../../Checkbox/CheckIcon.mjs";
+import { useMenuContext } from "../Menu.context.mjs";
+import { MenuCheckboxGroupContext } from "../MenuCheckboxGroup/MenuCheckboxGroup.context.mjs";
+import { MenuSelectableItem } from "../MenuSelectableItem/MenuSelectableItem.mjs";
+import Menu_module_default from "../Menu.module.mjs";
+import { use } from "react";
+import { useUncontrolled } from "@mantine/hooks";
+import { jsx } from "react/jsx-runtime";
+//#region packages/@mantine/core/src/components/Menu/MenuCheckboxItem/MenuCheckboxItem.tsx
+const MenuCheckboxItem = factory((_props) => {
+	const { classNames, className, style, styles, vars, color, closeMenuOnClick, rightSection, children, disabled, "data-disabled": dataDisabled, value, checked, defaultChecked, onChange, checkIcon, ref, ...others } = useProps("MenuCheckboxItem", null, _props);
+	const ctx = useMenuContext();
+	const groupCtx = use(MenuCheckboxGroupContext);
+	const groupChecked = groupCtx && value !== void 0 ? groupCtx.values.includes(value) : void 0;
+	const [_checked, setChecked] = useUncontrolled({
+		value: checked ?? groupChecked,
+		defaultValue: defaultChecked,
+		finalValue: false,
+		onChange
+	});
+	return /* @__PURE__ */ jsx(MenuSelectableItem, {
+		role: "menuitemcheckbox",
+		checked: _checked,
+		indicator: checkIcon ?? ctx.checkIcon ?? /* @__PURE__ */ jsx(CheckIcon, { size: 10 }),
+		onSelect: () => {
+			if (onChange) setChecked(!_checked);
+			else if (groupCtx && value !== void 0) groupCtx.onChange(value);
+			else setChecked(!_checked);
+		},
+		color,
+		closeMenuOnClick,
+		rightSection,
+		disabled,
+		dataDisabled,
+		className,
+		style,
+		styles,
+		classNames,
+		buttonRef: ref,
+		others,
+		children
+	});
+});
+MenuCheckboxItem.classes = Menu_module_default;
+MenuCheckboxItem.displayName = "@mantine/core/MenuCheckboxItem";
+//#endregion
+export { MenuCheckboxItem };
+
+//# sourceMappingURL=MenuCheckboxItem.mjs.map

package/esm/components/Menu/MenuCheckboxItem/MenuCheckboxItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuCheckboxItem.mjs","names":["classes"],"sources":["../../../../src/components/Menu/MenuCheckboxItem/MenuCheckboxItem.tsx"],"sourcesContent":["import { use } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  MantineColor,\n  useProps,\n} from '../../../core';\nimport { CheckIcon } from '../../Checkbox/CheckIcon';\nimport { MenuCheckboxGroupContext } from '../MenuCheckboxGroup/MenuCheckboxGroup.context';\nimport { useMenuContext } from '../Menu.context';\nimport { MenuSelectableItem } from '../MenuSelectableItem/MenuSelectableItem';\nimport classes from '../Menu.module.css';\n\nexport type MenuCheckboxItemStylesNames = 'item' | 'itemLabel' | 'itemSection' | 'itemIndicator';\n\nexport interface MenuCheckboxItemProps\n  extends\n    BoxProps,\n    CompoundStylesApiProps<MenuCheckboxItemFactory>,\n    ElementProps<'button', 'color' | 'onChange' | 'value'> {\n  'data-disabled'?: boolean;\n\n  /** Item label */\n  children?: React.ReactNode;\n\n  /** Key of `theme.colors` or any valid CSS color */\n  color?: MantineColor;\n\n  /** If set, closes the menu when this item is clicked. By default, checkbox items do not close the menu. */\n  closeMenuOnClick?: boolean;\n\n  /** Section displayed at the end of the label */\n  rightSection?: React.ReactNode;\n\n  /** Sets disabled attribute, applies disabled styles */\n  disabled?: boolean;\n\n  /** Value of the checkbox item. When used inside `Menu.CheckboxGroup`, determines whether the item is checked and what value is added/removed on toggle. */\n  value?: string;\n\n  /** Controlled checked state. Overrides selection derived from the parent `Menu.CheckboxGroup`. */\n  checked?: boolean;\n\n  /** Uncontrolled default checked state. Ignored when the item is used inside `Menu.CheckboxGroup`. */\n  defaultChecked?: boolean;\n\n  /** Called when checked state changes. Overrides `onChange` of the parent `Menu.CheckboxGroup`. */\n  onChange?: (checked: boolean) => void;\n\n  /** Replaces the default check icon rendered in the indicator slot when the item is checked. Overrides `checkIcon` set on `Menu`. */\n  checkIcon?: React.ReactNode;\n}\n\nexport type MenuCheckboxItemFactory = Factory<{\n  props: MenuCheckboxItemProps;\n  ref: HTMLButtonElement;\n  stylesNames: MenuCheckboxItemStylesNames;\n  compound: true;\n}>;\n\nexport const MenuCheckboxItem = factory<MenuCheckboxItemFactory>((_props) => {\n  const props = useProps('MenuCheckboxItem', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    color,\n    closeMenuOnClick,\n    rightSection,\n    children,\n    disabled,\n    'data-disabled': dataDisabled,\n    value,\n    checked,\n    defaultChecked,\n    onChange,\n    checkIcon,\n    ref,\n    ...others\n  } = props;\n\n  const ctx = useMenuContext();\n  const groupCtx = use(MenuCheckboxGroupContext);\n\n  const groupChecked =\n    groupCtx && value !== undefined ? groupCtx.values.includes(value) : undefined;\n\n  const [_checked, setChecked] = useUncontrolled({\n    value: checked ?? groupChecked,\n    defaultValue: defaultChecked,\n    finalValue: false,\n    onChange,\n  });\n\n  const resolvedCheckIcon = checkIcon ?? ctx.checkIcon ?? <CheckIcon size={10} />;\n\n  return (\n    <MenuSelectableItem\n      role=\"menuitemcheckbox\"\n      checked={_checked}\n      indicator={resolvedCheckIcon}\n      onSelect={() => {\n        if (onChange) {\n          setChecked(!_checked);\n        } else if (groupCtx && value !== undefined) {\n          groupCtx.onChange(value);\n        } else {\n          setChecked(!_checked);\n        }\n      }}\n      color={color}\n      closeMenuOnClick={closeMenuOnClick}\n      rightSection={rightSection}\n      disabled={disabled}\n      dataDisabled={dataDisabled}\n      className={className}\n      style={style}\n      styles={styles}\n      classNames={classNames}\n      buttonRef={ref}\n      others={others}\n    >\n      {children}\n    </MenuSelectableItem>\n  );\n});\n\nMenuCheckboxItem.classes = classes;\nMenuCheckboxItem.displayName = '@mantine/core/MenuCheckboxItem';\n"],"mappings":";;;;;;;;;;;;AAgEA,MAAa,mBAAmB,SAAkC,WAAW;CAE3E,MAAM,EACJ,YACA,WACA,OACA,QACA,MACA,OACA,kBACA,cACA,UACA,UACA,iBAAiB,cACjB,OACA,SACA,gBACA,UACA,WACA,KACA,GAAG,WAnBS,SAAS,oBAAoB,MAAM,MAoBzC;CAER,MAAM,MAAM,eAAe;CAC3B,MAAM,WAAW,IAAI,wBAAwB;CAE7C,MAAM,eACJ,YAAY,UAAU,KAAA,IAAY,SAAS,OAAO,SAAS,KAAK,IAAI,KAAA;CAEtE,MAAM,CAAC,UAAU,cAAc,gBAAgB;EAC7C,OAAO,WAAW;EAClB,cAAc;EACd,YAAY;EACZ;CACF,CAAC;CAID,OACE,oBAAC,oBAAD;EACE,MAAK;EACL,SAAS;EACT,WANsB,aAAa,IAAI,aAAa,oBAAC,WAAD,EAAW,MAAM,GAAK,CAAA;EAO1E,gBAAgB;GACd,IAAI,UACF,WAAW,CAAC,QAAQ;QACf,IAAI,YAAY,UAAU,KAAA,GAC/B,SAAS,SAAS,KAAK;QAEvB,WAAW,CAAC,QAAQ;EAExB;EACO;EACW;EACJ;EACJ;EACI;EACH;EACJ;EACC;EACI;EACZ,WAAW;EACH;EAEP;CACiB,CAAA;AAExB,CAAC;AAED,iBAAiB,UAAUA;AAC3B,iBAAiB,cAAc"}

package/esm/components/Menu/MenuContextMenu/MenuContextMenu.mjs

@@ -0,0 +1,28 @@
+"use client";
+import { getSingleElementChild } from "../../../core/utils/get-single-element-child/get-single-element-child.mjs";
+import { useProps } from "../../../core/MantineProvider/use-props/use-props.mjs";
+import { usePopoverContext } from "../../Popover/Popover.context.mjs";
+import { useContextMenuHandlers } from "../../../utils/Floating/use-context-menu-handlers.mjs";
+import { useMenuContext } from "../Menu.context.mjs";
+import { cloneElement } from "react";
+//#region packages/@mantine/core/src/components/Menu/MenuContextMenu/MenuContextMenu.tsx
+function MenuContextMenu(props) {
+	const { children, disabled, longPressDelay } = useProps("MenuContextMenu", null, props);
+	const child = getSingleElementChild(children);
+	if (!child) throw new Error("Menu.ContextMenu component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported");
+	const ctx = useMenuContext();
+	const popoverCtx = usePopoverContext();
+	return cloneElement(child, useContextMenuHandlers({
+		childProps: child.props,
+		disabled: disabled || popoverCtx.disabled,
+		opened: ctx.opened,
+		longPressDelay,
+		setReference: popoverCtx.reference,
+		open: () => ctx.openDropdown()
+	}));
+}
+MenuContextMenu.displayName = "@mantine/core/MenuContextMenu";
+//#endregion
+export { MenuContextMenu };
+
+//# sourceMappingURL=MenuContextMenu.mjs.map

package/esm/components/Menu/MenuContextMenu/MenuContextMenu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuContextMenu.mjs","names":[],"sources":["../../../../src/components/Menu/MenuContextMenu/MenuContextMenu.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport { getSingleElementChild, useProps } from '../../../core';\nimport { useContextMenuHandlers } from '../../../utils/Floating/use-context-menu-handlers';\nimport { usePopoverContext } from '../../Popover';\nimport { useMenuContext } from '../Menu.context';\n\nexport interface MenuContextMenuProps {\n  /** Element that opens the menu when right-clicked. Menu dropdown is positioned at the cursor. The trigger element must not call `event.preventDefault()` in its own `onContextMenu` handler, otherwise the native context menu is not suppressed. */\n  children: React.ReactNode;\n\n  /** If set, the right-click trigger is disabled and the browser's default context menu is shown */\n  disabled?: boolean;\n\n  /** Delay in ms before a touch long-press opens the dropdown on touch devices, `500` by default */\n  longPressDelay?: number;\n}\n\nexport function MenuContextMenu(props: MenuContextMenuProps) {\n  const { children, disabled, longPressDelay } = useProps('MenuContextMenu', null, props);\n\n  const child = getSingleElementChild(children);\n  if (!child) {\n    throw new Error(\n      'Menu.ContextMenu component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n    );\n  }\n\n  const ctx = useMenuContext();\n  const popoverCtx = usePopoverContext();\n\n  const handlers = useContextMenuHandlers({\n    childProps: child.props as any,\n    disabled: disabled || popoverCtx.disabled,\n    opened: ctx.opened,\n    longPressDelay,\n    setReference: popoverCtx.reference as unknown as (node: object) => void,\n    open: () => ctx.openDropdown(),\n  });\n\n  return cloneElement(child, handlers as any);\n}\n\nMenuContextMenu.displayName = '@mantine/core/MenuContextMenu';\n"],"mappings":";;;;;;;;AAiBA,SAAgB,gBAAgB,OAA6B;CAC3D,MAAM,EAAE,UAAU,UAAU,mBAAmB,SAAS,mBAAmB,MAAM,KAAK;CAEtF,MAAM,QAAQ,sBAAsB,QAAQ;CAC5C,IAAI,CAAC,OACH,MAAM,IAAI,MACR,oKACF;CAGF,MAAM,MAAM,eAAe;CAC3B,MAAM,aAAa,kBAAkB;CAWrC,OAAO,aAAa,OATH,uBAAuB;EACtC,YAAY,MAAM;EAClB,UAAU,YAAY,WAAW;EACjC,QAAQ,IAAI;EACZ;EACA,cAAc,WAAW;EACzB,YAAY,IAAI,aAAa;CAC/B,CAEkC,CAAQ;AAC5C;AAEA,gBAAgB,cAAc"}

package/esm/components/Menu/MenuDropdown/MenuDropdown.mjs

@@ -5,6 +5,7 @@ import { factory } from "../../../core/factory/factory.mjs";
 import { Popover } from "../../Popover/Popover.mjs";
 import { useMenuContext } from "../Menu.context.mjs";
 import Menu_module_default from "../Menu.module.mjs";
+import { useMenuTypeAhead } from "../use-menu-type-ahead.mjs";
 import { useRef } from "react";
 import { useMergedRef } from "@mantine/hooks";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -13,7 +14,14 @@ const MenuDropdown = factory((props) => {
 	const { classNames, className, style, styles, vars, onMouseEnter, onMouseLeave, onKeyDown, children, ref, ...others } = useProps("MenuDropdown", null, props);
 	const wrapperRef = useRef(null);
 	const ctx = useMenuContext();
+	const typeAhead = useMenuTypeAhead({
+		enabled: !ctx.hasSearch,
+		opened: ctx.opened,
+		getDropdown: () => wrapperRef.current
+	});
 	const handleKeyDown = createEventHandler(onKeyDown, (event) => {
+		typeAhead(event);
+		if (event.defaultPrevented || ctx.hasSearch) return;
 		if (event.key === "ArrowUp" || event.key === "ArrowDown") {
 			event.preventDefault();
 			wrapperRef.current?.querySelectorAll("[data-menu-item]:not(:disabled)")[0]?.focus();
@@ -38,7 +46,7 @@ const MenuDropdown = factory((props) => {
 		tabIndex: -1,
 		"data-menu-dropdown": true,
 		onKeyDown: handleKeyDown,
-		children: [ctx.withInitialFocusPlaceholder && /* @__PURE__ */ jsx("div", {
+		children: [ctx.withInitialFocusPlaceholder && !ctx.hasSearch && /* @__PURE__ */ jsx("div", {
 			tabIndex: -1,
 			"data-autofocus": true,
 			"data-mantine-stop-propagation": true,

package/esm/components/Menu/MenuDropdown/MenuDropdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MenuDropdown.mjs","names":["classes"],"sources":["../../../../src/components/Menu/MenuDropdown/MenuDropdown.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n  BoxProps,\n  CompoundStylesApiProps,\n  createEventHandler,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { Popover } from '../../Popover';\nimport { useMenuContext } from '../Menu.context';\nimport classes from '../Menu.module.css';\n\nexport type MenuDropdownStylesNames = 'dropdown';\n\nexport interface MenuDropdownProps\n  extends BoxProps, CompoundStylesApiProps<MenuDropdownFactory>, ElementProps<'div'> {}\n\nexport type MenuDropdownFactory = Factory<{\n  props: MenuDropdownProps;\n  ref: HTMLDivElement;\n  stylesNames: MenuDropdownStylesNames;\n  compound: true;\n}>;\n\nexport const MenuDropdown = factory<MenuDropdownFactory>((props) => {\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    onMouseEnter,\n    onMouseLeave,\n    onKeyDown,\n    children,\n    ref,\n    ...others\n  } = useProps('MenuDropdown', null, props);\n\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const ctx = useMenuContext();\n\n  const handleKeyDown = createEventHandler<any>(onKeyDown, (event) => {\n    if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n      event.preventDefault();\n      wrapperRef.current\n        ?.querySelectorAll<HTMLButtonElement>('[data-menu-item]:not(:disabled)')[0]\n        ?.focus();\n    }\n  });\n\n  const handleMouseEnter = createEventHandler<any>(\n    onMouseEnter,\n    () => (ctx.trigger === 'hover' || ctx.trigger === 'click-hover') && ctx.openDropdown()\n  );\n\n  const handleMouseLeave = createEventHandler<any>(\n    onMouseLeave,\n    () => (ctx.trigger === 'hover' || ctx.trigger === 'click-hover') && ctx.closeDropdown()\n  );\n\n  return (\n    <Popover.Dropdown\n      {...others}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      role=\"menu\"\n      aria-orientation=\"vertical\"\n      ref={useMergedRef(ref, wrapperRef)}\n      {...ctx.getStyles('dropdown', {\n        className,\n        style,\n        styles,\n        classNames,\n        withStaticClass: false,\n      })}\n      tabIndex={-1}\n      data-menu-dropdown\n      onKeyDown={handleKeyDown}\n    >\n      {ctx.withInitialFocusPlaceholder && (\n        <div tabIndex={-1} data-autofocus data-mantine-stop-propagation style={{ outline: 0 }} />\n      )}\n      {children}\n    </Popover.Dropdown>\n  );\n});\n\nMenuDropdown.classes = classes;\nMenuDropdown.displayName = '@mantine/core/MenuDropdown';\n"],"mappings":";;;;;;;;;;;AA2BA,MAAa,eAAe,SAA8B,UAAU;CAClE,MAAM,EACJ,YACA,WACA,OACA,QACA,MACA,cACA,cACA,WACA,UACA,KACA,GAAG,WACD,SAAS,gBAAgB,MAAM,KAAK;CAExC,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,MAAM,eAAe;CAE3B,MAAM,gBAAgB,mBAAwB,YAAY,UAAU;EAClE,IAAI,MAAM,QAAQ,aAAa,MAAM,QAAQ,aAAa;GACxD,MAAM,eAAe;GACrB,WAAW,SACP,iBAAoC,iCAAiC,EAAE,IACvE,MAAM;EACZ;CACF,CAAC;CAED,MAAM,mBAAmB,mBACvB,qBACO,IAAI,YAAY,WAAW,IAAI,YAAY,kBAAkB,IAAI,aAAa,CACvF;CAEA,MAAM,mBAAmB,mBACvB,qBACO,IAAI,YAAY,WAAW,IAAI,YAAY,kBAAkB,IAAI,cAAc,CACxF;CAEA,OACE,qBAAC,QAAQ,UAAT;EACE,GAAI;EACJ,cAAc;EACd,cAAc;EACd,MAAK;EACL,oBAAiB;EACjB,KAAK,aAAa,KAAK,UAAU;EACjC,GAAI,IAAI,UAAU,YAAY;GAC5B;GACA;GACA;GACA;GACA,iBAAiB;EACnB,CAAC;EACD,UAAU;EACV,sBAAA;EACA,WAAW;YAhBb,CAkBG,IAAI,+BACH,oBAAC,OAAD;GAAK,UAAU;GAAI,kBAAA;GAAe,iCAAA;GAA8B,OAAO,EAAE,SAAS,EAAE;EAAI,CAAA,GAEzF,QACe;;AAEtB,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,cAAc"}
+{"version":3,"file":"MenuDropdown.mjs","names":["classes"],"sources":["../../../../src/components/Menu/MenuDropdown/MenuDropdown.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n  BoxProps,\n  CompoundStylesApiProps,\n  createEventHandler,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { Popover } from '../../Popover';\nimport { useMenuContext } from '../Menu.context';\nimport { useMenuTypeAhead } from '../use-menu-type-ahead';\nimport classes from '../Menu.module.css';\n\nexport type MenuDropdownStylesNames = 'dropdown';\n\nexport interface MenuDropdownProps\n  extends BoxProps, CompoundStylesApiProps<MenuDropdownFactory>, ElementProps<'div'> {}\n\nexport type MenuDropdownFactory = Factory<{\n  props: MenuDropdownProps;\n  ref: HTMLDivElement;\n  stylesNames: MenuDropdownStylesNames;\n  compound: true;\n}>;\n\nexport const MenuDropdown = factory<MenuDropdownFactory>((props) => {\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    onMouseEnter,\n    onMouseLeave,\n    onKeyDown,\n    children,\n    ref,\n    ...others\n  } = useProps('MenuDropdown', null, props);\n\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const ctx = useMenuContext();\n\n  const typeAhead = useMenuTypeAhead({\n    enabled: !ctx.hasSearch,\n    opened: ctx.opened,\n    getDropdown: () => wrapperRef.current,\n  });\n\n  const handleKeyDown = createEventHandler<any>(onKeyDown, (event) => {\n    typeAhead(event);\n    if (event.defaultPrevented || ctx.hasSearch) {\n      return;\n    }\n    if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n      event.preventDefault();\n      wrapperRef.current\n        ?.querySelectorAll<HTMLButtonElement>('[data-menu-item]:not(:disabled)')[0]\n        ?.focus();\n    }\n  });\n\n  const handleMouseEnter = createEventHandler<any>(\n    onMouseEnter,\n    () => (ctx.trigger === 'hover' || ctx.trigger === 'click-hover') && ctx.openDropdown()\n  );\n\n  const handleMouseLeave = createEventHandler<any>(\n    onMouseLeave,\n    () => (ctx.trigger === 'hover' || ctx.trigger === 'click-hover') && ctx.closeDropdown()\n  );\n\n  return (\n    <Popover.Dropdown\n      {...others}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      role=\"menu\"\n      aria-orientation=\"vertical\"\n      ref={useMergedRef(ref, wrapperRef)}\n      {...ctx.getStyles('dropdown', {\n        className,\n        style,\n        styles,\n        classNames,\n        withStaticClass: false,\n      })}\n      tabIndex={-1}\n      data-menu-dropdown\n      onKeyDown={handleKeyDown}\n    >\n      {ctx.withInitialFocusPlaceholder && !ctx.hasSearch && (\n        <div tabIndex={-1} data-autofocus data-mantine-stop-propagation style={{ outline: 0 }} />\n      )}\n      {children}\n    </Popover.Dropdown>\n  );\n});\n\nMenuDropdown.classes = classes;\nMenuDropdown.displayName = '@mantine/core/MenuDropdown';\n"],"mappings":";;;;;;;;;;;;AA4BA,MAAa,eAAe,SAA8B,UAAU;CAClE,MAAM,EACJ,YACA,WACA,OACA,QACA,MACA,cACA,cACA,WACA,UACA,KACA,GAAG,WACD,SAAS,gBAAgB,MAAM,KAAK;CAExC,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,MAAM,eAAe;CAE3B,MAAM,YAAY,iBAAiB;EACjC,SAAS,CAAC,IAAI;EACd,QAAQ,IAAI;EACZ,mBAAmB,WAAW;CAChC,CAAC;CAED,MAAM,gBAAgB,mBAAwB,YAAY,UAAU;EAClE,UAAU,KAAK;EACf,IAAI,MAAM,oBAAoB,IAAI,WAChC;EAEF,IAAI,MAAM,QAAQ,aAAa,MAAM,QAAQ,aAAa;GACxD,MAAM,eAAe;GACrB,WAAW,SACP,iBAAoC,iCAAiC,EAAE,IACvE,MAAM;EACZ;CACF,CAAC;CAED,MAAM,mBAAmB,mBACvB,qBACO,IAAI,YAAY,WAAW,IAAI,YAAY,kBAAkB,IAAI,aAAa,CACvF;CAEA,MAAM,mBAAmB,mBACvB,qBACO,IAAI,YAAY,WAAW,IAAI,YAAY,kBAAkB,IAAI,cAAc,CACxF;CAEA,OACE,qBAAC,QAAQ,UAAT;EACE,GAAI;EACJ,cAAc;EACd,cAAc;EACd,MAAK;EACL,oBAAiB;EACjB,KAAK,aAAa,KAAK,UAAU;EACjC,GAAI,IAAI,UAAU,YAAY;GAC5B;GACA;GACA;GACA;GACA,iBAAiB;EACnB,CAAC;EACD,UAAU;EACV,sBAAA;EACA,WAAW;YAhBb,CAkBG,IAAI,+BAA+B,CAAC,IAAI,aACvC,oBAAC,OAAD;GAAK,UAAU;GAAI,kBAAA;GAAe,iCAAA;GAA8B,OAAO,EAAE,SAAS,EAAE;EAAI,CAAA,GAEzF,QACe;;AAEtB,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,cAAc"}

package/esm/components/Menu/MenuItem/MenuItem.mjs

@@ -8,8 +8,8 @@ import { polymorphicFactory } from "../../../core/factory/polymorphic-factory.mj
 import { useDirection } from "../../../core/DirectionProvider/DirectionProvider.mjs";
 import { UnstyledButton } from "../../UnstyledButton/UnstyledButton.mjs";
 import { useMenuContext } from "../Menu.context.mjs";
-import Menu_module_default from "../Menu.module.mjs";
 import { SubMenuContext } from "../MenuSub/MenuSub.context.mjs";
+import Menu_module_default from "../Menu.module.mjs";
 import { use, useRef } from "react";
 import { useMergedRef } from "@mantine/hooks";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -27,6 +27,14 @@ const MenuItem = polymorphicFactory((props) => {
 		if (typeof closeMenuOnClick === "boolean") closeMenuOnClick && ctx.closeDropdownImmediately();
 		else ctx.closeOnItemClick && ctx.closeDropdownImmediately();
 	});
+	const handleMouseMove = createEventHandler(_others.onMouseMove, () => {
+		if (!ctx.hasSearch) return;
+		const dropdown = itemRef.current?.closest("[data-menu-dropdown]");
+		if (!dropdown) return;
+		dropdown.querySelectorAll("[data-menu-active]").forEach((node) => {
+			if (node !== itemRef.current && node.closest("[data-menu-dropdown]") === dropdown) node.removeAttribute("data-menu-active");
+		});
+	});
 	const colors = color ? theme.variantColorResolver({
 		color,
 		theme,
@@ -60,6 +68,7 @@ const MenuItem = polymorphicFactory((props) => {
 		"data-disabled": disabled || dataDisabled || void 0,
 		"data-mantine-stop-propagation": true,
 		onClick: handleClick,
+		onMouseMove: handleMouseMove,
 		onKeyDown: createScopedKeydownHandler({
 			siblingSelector: "[data-menu-item]:not([data-disabled])",
 			parentSelector: "[data-menu-dropdown]",
@@ -74,6 +83,13 @@ const MenuItem = polymorphicFactory((props) => {
 			"--menu-item-hover": colors?.hover
 		},
 		children: [
+			ctx.alignItemsLabels === "all" && /* @__PURE__ */ jsx("div", {
+				...ctx.getStyles("itemIndicator", {
+					styles,
+					classNames
+				}),
+				"data-placeholder": true
+			}),
 			leftSection && /* @__PURE__ */ jsx("div", {
 				...ctx.getStyles("itemSection", {
 					styles,
@@ -87,6 +103,7 @@ const MenuItem = polymorphicFactory((props) => {
 					styles,
 					classNames
 				}),
+				"data-menu-item-label": true,
 				children
 			}),
 			rightSection && /* @__PURE__ */ jsx("div", {

package/esm/components/Menu/MenuItem/MenuItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.mjs","names":["classes"],"sources":["../../../../src/components/Menu/MenuItem/MenuItem.tsx"],"sourcesContent":["import { use, useRef } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n  BoxProps,\n  CompoundStylesApiProps,\n  createEventHandler,\n  createScopedKeydownHandler,\n  MantineColor,\n  parseThemeColor,\n  polymorphicFactory,\n  PolymorphicFactory,\n  useDirection,\n  useMantineTheme,\n  useProps,\n} from '../../../core';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { useMenuContext } from '../Menu.context';\nimport { SubMenuContext } from '../MenuSub/MenuSub.context';\nimport classes from '../Menu.module.css';\n\nexport type MenuItemStylesNames = 'item' | 'itemLabel' | 'itemSection';\n\nexport interface MenuItemProps extends BoxProps, CompoundStylesApiProps<MenuItemFactory> {\n  'data-disabled'?: boolean;\n\n  /** Item label */\n  children?: React.ReactNode;\n\n  /** Key of `theme.colors` or any valid CSS color */\n  color?: MantineColor;\n\n  /** Controls whether the menu closes when this item is clicked. When undefined, inherits from Menu's `closeOnItemClick` prop. When true or false, overrides the Menu-level setting */\n  closeMenuOnClick?: boolean;\n\n  /** Section displayed at the start of the label */\n  leftSection?: React.ReactNode;\n\n  /** Section displayed at the end of the label */\n  rightSection?: React.ReactNode;\n\n  /** Sets disabled attribute, applies disabled styles */\n  disabled?: boolean;\n}\n\nexport type MenuItemFactory = PolymorphicFactory<{\n  props: MenuItemProps;\n  defaultRef: HTMLButtonElement;\n  defaultComponent: 'button';\n  stylesNames: MenuItemStylesNames;\n  compound: true;\n}>;\n\nexport const MenuItem = polymorphicFactory<MenuItemFactory>((props) => {\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    color,\n    closeMenuOnClick,\n    leftSection,\n    rightSection,\n    children,\n    disabled,\n    'data-disabled': dataDisabled,\n    ref,\n    ...others\n  } = useProps('MenuItem', null, props);\n\n  const ctx = useMenuContext();\n  const subCtx = use(SubMenuContext);\n  const theme = useMantineTheme();\n  const { dir } = useDirection();\n  const itemRef = useRef<HTMLButtonElement>(null);\n  const _others: any = others;\n\n  const handleClick = createEventHandler(_others.onClick, () => {\n    if (dataDisabled) {\n      return;\n    }\n    if (typeof closeMenuOnClick === 'boolean') {\n      closeMenuOnClick && ctx.closeDropdownImmediately();\n    } else {\n      ctx.closeOnItemClick && ctx.closeDropdownImmediately();\n    }\n  });\n\n  const colors = color ? theme.variantColorResolver({ color, theme, variant: 'light' }) : undefined;\n  const parsedThemeColor = color ? parseThemeColor({ color, theme }) : null;\n\n  const handleKeydown = createEventHandler<any>(_others.onKeyDown, (event) => {\n    if (event.key === 'ArrowLeft' && subCtx) {\n      subCtx.close();\n      subCtx.focusParentItem();\n    }\n  });\n\n  return (\n    <UnstyledButton\n      onMouseDown={(event) => event.preventDefault()}\n      {...others}\n      unstyled={ctx.unstyled}\n      tabIndex={ctx.menuItemTabIndex}\n      {...ctx.getStyles('item', { className, style, styles, classNames })}\n      ref={useMergedRef(itemRef, ref)}\n      role=\"menuitem\"\n      disabled={disabled}\n      data-menu-item\n      data-disabled={disabled || dataDisabled || undefined}\n      data-mantine-stop-propagation\n      onClick={handleClick}\n      onKeyDown={createScopedKeydownHandler({\n        siblingSelector: '[data-menu-item]:not([data-disabled])',\n        parentSelector: '[data-menu-dropdown]',\n        activateOnFocus: false,\n        loop: ctx.loop,\n        dir,\n        orientation: 'vertical',\n        onKeyDown: handleKeydown,\n      })}\n      __vars={{\n        '--menu-item-color':\n          parsedThemeColor?.isThemeColor && parsedThemeColor?.shade === undefined\n            ? `var(--mantine-color-${parsedThemeColor.color}-6)`\n            : colors?.color,\n        '--menu-item-hover': colors?.hover,\n      }}\n    >\n      {leftSection && (\n        <div {...ctx.getStyles('itemSection', { styles, classNames })} data-position=\"left\">\n          {leftSection}\n        </div>\n      )}\n      {children && <div {...ctx.getStyles('itemLabel', { styles, classNames })}>{children}</div>}\n      {rightSection && (\n        <div {...ctx.getStyles('itemSection', { styles, classNames })} data-position=\"right\">\n          {rightSection}\n        </div>\n      )}\n    </UnstyledButton>\n  );\n});\n\nMenuItem.classes = classes;\nMenuItem.displayName = '@mantine/core/MenuItem';\n"],"mappings":";;;;;;;;;;;;;;;;AAoDA,MAAa,WAAW,oBAAqC,UAAU;CACrE,MAAM,EACJ,YACA,WACA,OACA,QACA,MACA,OACA,kBACA,aACA,cACA,UACA,UACA,iBAAiB,cACjB,KACA,GAAG,WACD,SAAS,YAAY,MAAM,KAAK;CAEpC,MAAM,MAAM,eAAe;CAC3B,MAAM,SAAS,IAAI,cAAc;CACjC,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,EAAE,QAAQ,aAAa;CAC7B,MAAM,UAAU,OAA0B,IAAI;CAC9C,MAAM,UAAe;CAErB,MAAM,cAAc,mBAAmB,QAAQ,eAAe;EAC5D,IAAI,cACF;EAEF,IAAI,OAAO,qBAAqB,WAC9B,oBAAoB,IAAI,yBAAyB;OAEjD,IAAI,oBAAoB,IAAI,yBAAyB;CAEzD,CAAC;CAED,MAAM,SAAS,QAAQ,MAAM,qBAAqB;EAAE;EAAO;EAAO,SAAS;CAAQ,CAAC,IAAI,KAAA;CACxF,MAAM,mBAAmB,QAAQ,gBAAgB;EAAE;EAAO;CAAM,CAAC,IAAI;CAErE,MAAM,gBAAgB,mBAAwB,QAAQ,YAAY,UAAU;EAC1E,IAAI,MAAM,QAAQ,eAAe,QAAQ;GACvC,OAAO,MAAM;GACb,OAAO,gBAAgB;EACzB;CACF,CAAC;CAED,OACE,qBAAC,gBAAD;EACE,cAAc,UAAU,MAAM,eAAe;EAC7C,GAAI;EACJ,UAAU,IAAI;EACd,UAAU,IAAI;EACd,GAAI,IAAI,UAAU,QAAQ;GAAE;GAAW;GAAO;GAAQ;EAAW,CAAC;EAClE,KAAK,aAAa,SAAS,GAAG;EAC9B,MAAK;EACK;EACV,kBAAA;EACA,iBAAe,YAAY,gBAAgB,KAAA;EAC3C,iCAAA;EACA,SAAS;EACT,WAAW,2BAA2B;GACpC,iBAAiB;GACjB,gBAAgB;GAChB,iBAAiB;GACjB,MAAM,IAAI;GACV;GACA,aAAa;GACb,WAAW;EACb,CAAC;EACD,QAAQ;GACN,qBACE,kBAAkB,gBAAgB,kBAAkB,UAAU,KAAA,IAC1D,uBAAuB,iBAAiB,MAAM,OAC9C,QAAQ;GACd,qBAAqB,QAAQ;EAC/B;YA5BF;GA8BG,eACC,oBAAC,OAAD;IAAK,GAAI,IAAI,UAAU,eAAe;KAAE;KAAQ;IAAW,CAAC;IAAG,iBAAc;cAC1E;GACE,CAAA;GAEN,YAAY,oBAAC,OAAD;IAAK,GAAI,IAAI,UAAU,aAAa;KAAE;KAAQ;IAAW,CAAC;IAAI;GAAc,CAAA;GACxF,gBACC,oBAAC,OAAD;IAAK,GAAI,IAAI,UAAU,eAAe;KAAE;KAAQ;IAAW,CAAC;IAAG,iBAAc;cAC1E;GACE,CAAA;EAEO;;AAEpB,CAAC;AAED,SAAS,UAAUA;AACnB,SAAS,cAAc"}
+{"version":3,"file":"MenuItem.mjs","names":["classes"],"sources":["../../../../src/components/Menu/MenuItem/MenuItem.tsx"],"sourcesContent":["import { use, useRef } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n  BoxProps,\n  CompoundStylesApiProps,\n  createEventHandler,\n  createScopedKeydownHandler,\n  MantineColor,\n  parseThemeColor,\n  polymorphicFactory,\n  PolymorphicFactory,\n  useDirection,\n  useMantineTheme,\n  useProps,\n} from '../../../core';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { useMenuContext } from '../Menu.context';\nimport { SubMenuContext } from '../MenuSub/MenuSub.context';\nimport classes from '../Menu.module.css';\n\nexport type MenuItemStylesNames = 'item' | 'itemLabel' | 'itemSection' | 'itemIndicator';\n\nexport interface MenuItemProps extends BoxProps, CompoundStylesApiProps<MenuItemFactory> {\n  'data-disabled'?: boolean;\n\n  /** Item label */\n  children?: React.ReactNode;\n\n  /** Key of `theme.colors` or any valid CSS color */\n  color?: MantineColor;\n\n  /** Controls whether the menu closes when this item is clicked. When undefined, inherits from Menu's `closeOnItemClick` prop. When true or false, overrides the Menu-level setting */\n  closeMenuOnClick?: boolean;\n\n  /** Section displayed at the start of the label */\n  leftSection?: React.ReactNode;\n\n  /** Section displayed at the end of the label */\n  rightSection?: React.ReactNode;\n\n  /** Sets disabled attribute, applies disabled styles */\n  disabled?: boolean;\n}\n\nexport type MenuItemFactory = PolymorphicFactory<{\n  props: MenuItemProps;\n  defaultRef: HTMLButtonElement;\n  defaultComponent: 'button';\n  stylesNames: MenuItemStylesNames;\n  compound: true;\n}>;\n\nexport const MenuItem = polymorphicFactory<MenuItemFactory>((props) => {\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    color,\n    closeMenuOnClick,\n    leftSection,\n    rightSection,\n    children,\n    disabled,\n    'data-disabled': dataDisabled,\n    ref,\n    ...others\n  } = useProps('MenuItem', null, props);\n\n  const ctx = useMenuContext();\n  const subCtx = use(SubMenuContext);\n  const theme = useMantineTheme();\n  const { dir } = useDirection();\n  const itemRef = useRef<HTMLButtonElement>(null);\n  const _others: any = others;\n\n  const handleClick = createEventHandler(_others.onClick, () => {\n    if (dataDisabled) {\n      return;\n    }\n    if (typeof closeMenuOnClick === 'boolean') {\n      closeMenuOnClick && ctx.closeDropdownImmediately();\n    } else {\n      ctx.closeOnItemClick && ctx.closeDropdownImmediately();\n    }\n  });\n\n  const handleMouseMove = createEventHandler<any>(_others.onMouseMove, () => {\n    if (!ctx.hasSearch) {\n      return;\n    }\n    const dropdown = itemRef.current?.closest('[data-menu-dropdown]');\n    if (!dropdown) {\n      return;\n    }\n    dropdown.querySelectorAll<HTMLElement>('[data-menu-active]').forEach((node) => {\n      if (node !== itemRef.current && node.closest('[data-menu-dropdown]') === dropdown) {\n        node.removeAttribute('data-menu-active');\n      }\n    });\n  });\n\n  const colors = color ? theme.variantColorResolver({ color, theme, variant: 'light' }) : undefined;\n  const parsedThemeColor = color ? parseThemeColor({ color, theme }) : null;\n\n  const handleKeydown = createEventHandler<any>(_others.onKeyDown, (event) => {\n    if (event.key === 'ArrowLeft' && subCtx) {\n      subCtx.close();\n      subCtx.focusParentItem();\n    }\n  });\n\n  return (\n    <UnstyledButton\n      onMouseDown={(event) => event.preventDefault()}\n      {...others}\n      unstyled={ctx.unstyled}\n      tabIndex={ctx.menuItemTabIndex}\n      {...ctx.getStyles('item', { className, style, styles, classNames })}\n      ref={useMergedRef(itemRef, ref)}\n      role=\"menuitem\"\n      disabled={disabled}\n      data-menu-item\n      data-disabled={disabled || dataDisabled || undefined}\n      data-mantine-stop-propagation\n      onClick={handleClick}\n      onMouseMove={handleMouseMove}\n      onKeyDown={createScopedKeydownHandler({\n        siblingSelector: '[data-menu-item]:not([data-disabled])',\n        parentSelector: '[data-menu-dropdown]',\n        activateOnFocus: false,\n        loop: ctx.loop,\n        dir,\n        orientation: 'vertical',\n        onKeyDown: handleKeydown,\n      })}\n      __vars={{\n        '--menu-item-color':\n          parsedThemeColor?.isThemeColor && parsedThemeColor?.shade === undefined\n            ? `var(--mantine-color-${parsedThemeColor.color}-6)`\n            : colors?.color,\n        '--menu-item-hover': colors?.hover,\n      }}\n    >\n      {ctx.alignItemsLabels === 'all' && (\n        <div {...ctx.getStyles('itemIndicator', { styles, classNames })} data-placeholder />\n      )}\n      {leftSection && (\n        <div {...ctx.getStyles('itemSection', { styles, classNames })} data-position=\"left\">\n          {leftSection}\n        </div>\n      )}\n      {children && (\n        <div {...ctx.getStyles('itemLabel', { styles, classNames })} data-menu-item-label>\n          {children}\n        </div>\n      )}\n      {rightSection && (\n        <div {...ctx.getStyles('itemSection', { styles, classNames })} data-position=\"right\">\n          {rightSection}\n        </div>\n      )}\n    </UnstyledButton>\n  );\n});\n\nMenuItem.classes = classes;\nMenuItem.displayName = '@mantine/core/MenuItem';\n"],"mappings":";;;;;;;;;;;;;;;;AAoDA,MAAa,WAAW,oBAAqC,UAAU;CACrE,MAAM,EACJ,YACA,WACA,OACA,QACA,MACA,OACA,kBACA,aACA,cACA,UACA,UACA,iBAAiB,cACjB,KACA,GAAG,WACD,SAAS,YAAY,MAAM,KAAK;CAEpC,MAAM,MAAM,eAAe;CAC3B,MAAM,SAAS,IAAI,cAAc;CACjC,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,EAAE,QAAQ,aAAa;CAC7B,MAAM,UAAU,OAA0B,IAAI;CAC9C,MAAM,UAAe;CAErB,MAAM,cAAc,mBAAmB,QAAQ,eAAe;EAC5D,IAAI,cACF;EAEF,IAAI,OAAO,qBAAqB,WAC9B,oBAAoB,IAAI,yBAAyB;OAEjD,IAAI,oBAAoB,IAAI,yBAAyB;CAEzD,CAAC;CAED,MAAM,kBAAkB,mBAAwB,QAAQ,mBAAmB;EACzE,IAAI,CAAC,IAAI,WACP;EAEF,MAAM,WAAW,QAAQ,SAAS,QAAQ,sBAAsB;EAChE,IAAI,CAAC,UACH;EAEF,SAAS,iBAA8B,oBAAoB,EAAE,SAAS,SAAS;GAC7E,IAAI,SAAS,QAAQ,WAAW,KAAK,QAAQ,sBAAsB,MAAM,UACvE,KAAK,gBAAgB,kBAAkB;EAE3C,CAAC;CACH,CAAC;CAED,MAAM,SAAS,QAAQ,MAAM,qBAAqB;EAAE;EAAO;EAAO,SAAS;CAAQ,CAAC,IAAI,KAAA;CACxF,MAAM,mBAAmB,QAAQ,gBAAgB;EAAE;EAAO;CAAM,CAAC,IAAI;CAErE,MAAM,gBAAgB,mBAAwB,QAAQ,YAAY,UAAU;EAC1E,IAAI,MAAM,QAAQ,eAAe,QAAQ;GACvC,OAAO,MAAM;GACb,OAAO,gBAAgB;EACzB;CACF,CAAC;CAED,OACE,qBAAC,gBAAD;EACE,cAAc,UAAU,MAAM,eAAe;EAC7C,GAAI;EACJ,UAAU,IAAI;EACd,UAAU,IAAI;EACd,GAAI,IAAI,UAAU,QAAQ;GAAE;GAAW;GAAO;GAAQ;EAAW,CAAC;EAClE,KAAK,aAAa,SAAS,GAAG;EAC9B,MAAK;EACK;EACV,kBAAA;EACA,iBAAe,YAAY,gBAAgB,KAAA;EAC3C,iCAAA;EACA,SAAS;EACT,aAAa;EACb,WAAW,2BAA2B;GACpC,iBAAiB;GACjB,gBAAgB;GAChB,iBAAiB;GACjB,MAAM,IAAI;GACV;GACA,aAAa;GACb,WAAW;EACb,CAAC;EACD,QAAQ;GACN,qBACE,kBAAkB,gBAAgB,kBAAkB,UAAU,KAAA,IAC1D,uBAAuB,iBAAiB,MAAM,OAC9C,QAAQ;GACd,qBAAqB,QAAQ;EAC/B;YA7BF;GA+BG,IAAI,qBAAqB,SACxB,oBAAC,OAAD;IAAK,GAAI,IAAI,UAAU,iBAAiB;KAAE;KAAQ;IAAW,CAAC;IAAG,oBAAA;GAAkB,CAAA;GAEpF,eACC,oBAAC,OAAD;IAAK,GAAI,IAAI,UAAU,eAAe;KAAE;KAAQ;IAAW,CAAC;IAAG,iBAAc;cAC1E;GACE,CAAA;GAEN,YACC,oBAAC,OAAD;IAAK,GAAI,IAAI,UAAU,aAAa;KAAE;KAAQ;IAAW,CAAC;IAAG,wBAAA;IAC1D;GACE,CAAA;GAEN,gBACC,oBAAC,OAAD;IAAK,GAAI,IAAI,UAAU,eAAe;KAAE;KAAQ;IAAW,CAAC;IAAG,iBAAc;cAC1E;GACE,CAAA;EAEO;;AAEpB,CAAC;AAED,SAAS,UAAUA;AACnB,SAAS,cAAc"}

package/esm/components/Menu/MenuRadioGroup/MenuRadioGroup.context.mjs

@@ -0,0 +1,8 @@
+"use client";
+import { createContext } from "react";
+//#region packages/@mantine/core/src/components/Menu/MenuRadioGroup/MenuRadioGroup.context.tsx
+const MenuRadioGroupContext = createContext(null);
+//#endregion
+export { MenuRadioGroupContext };
+
+//# sourceMappingURL=MenuRadioGroup.context.mjs.map

package/esm/components/Menu/MenuRadioGroup/MenuRadioGroup.context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuRadioGroup.context.mjs","names":[],"sources":["../../../../src/components/Menu/MenuRadioGroup/MenuRadioGroup.context.tsx"],"sourcesContent":["import { createContext } from 'react';\n\nexport interface MenuRadioGroupContextValue {\n  value: string | null;\n  onChange: (value: string) => void;\n}\n\nexport const MenuRadioGroupContext = createContext<MenuRadioGroupContextValue | null>(null);\n"],"mappings":";;;AAOA,MAAa,wBAAwB,cAAiD,IAAI"}

package/esm/components/Menu/MenuRadioGroup/MenuRadioGroup.mjs

@@ -0,0 +1,27 @@
+"use client";
+import { useProps } from "../../../core/MantineProvider/use-props/use-props.mjs";
+import { MenuRadioGroupContext } from "./MenuRadioGroup.context.mjs";
+import { useUncontrolled } from "@mantine/hooks";
+import { jsx } from "react/jsx-runtime";
+//#region packages/@mantine/core/src/components/Menu/MenuRadioGroup/MenuRadioGroup.tsx
+function MenuRadioGroup(_props) {
+	const { value, defaultValue, onChange, children } = useProps("MenuRadioGroup", null, _props);
+	const [_value, setValue] = useUncontrolled({
+		value,
+		defaultValue,
+		finalValue: null,
+		onChange
+	});
+	return /* @__PURE__ */ jsx(MenuRadioGroupContext, {
+		value: {
+			value: _value,
+			onChange: (next) => setValue(next)
+		},
+		children
+	});
+}
+MenuRadioGroup.displayName = "@mantine/core/MenuRadioGroup";
+//#endregion
+export { MenuRadioGroup };
+
+//# sourceMappingURL=MenuRadioGroup.mjs.map

package/esm/components/Menu/MenuRadioGroup/MenuRadioGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuRadioGroup.mjs","names":[],"sources":["../../../../src/components/Menu/MenuRadioGroup/MenuRadioGroup.tsx"],"sourcesContent":["import { useUncontrolled } from '@mantine/hooks';\nimport { useProps } from '../../../core';\nimport { MenuRadioGroupContext } from './MenuRadioGroup.context';\n\nexport interface MenuRadioGroupProps {\n  /** Controlled selected value */\n  value?: string | null;\n\n  /** Uncontrolled default selected value */\n  defaultValue?: string | null;\n\n  /** Called with the new value when a `Menu.RadioItem` is selected */\n  onChange?: (value: string) => void;\n\n  /** `Menu.RadioItem` components and other elements */\n  children?: React.ReactNode;\n}\n\nexport function MenuRadioGroup(_props: MenuRadioGroupProps) {\n  const props = useProps('MenuRadioGroup', null, _props);\n  const { value, defaultValue, onChange, children } = props;\n\n  const [_value, setValue] = useUncontrolled<string | null>({\n    value,\n    defaultValue,\n    finalValue: null,\n    onChange: onChange as (value: string | null) => void,\n  });\n\n  return (\n    <MenuRadioGroupContext value={{ value: _value, onChange: (next) => setValue(next) }}>\n      {children}\n    </MenuRadioGroupContext>\n  );\n}\n\nMenuRadioGroup.displayName = '@mantine/core/MenuRadioGroup';\n"],"mappings":";;;;;;AAkBA,SAAgB,eAAe,QAA6B;CAE1D,MAAM,EAAE,OAAO,cAAc,UAAU,aADzB,SAAS,kBAAkB,MAAM,MACS;CAExD,MAAM,CAAC,QAAQ,YAAY,gBAA+B;EACxD;EACA;EACA,YAAY;EACF;CACZ,CAAC;CAED,OACE,oBAAC,uBAAD;EAAuB,OAAO;GAAE,OAAO;GAAQ,WAAW,SAAS,SAAS,IAAI;EAAE;EAC/E;CACoB,CAAA;AAE3B;AAEA,eAAe,cAAc"}

package/esm/components/Menu/MenuRadioItem/MenuRadioItem.mjs

@@ -0,0 +1,46 @@
+"use client";
+import { useProps } from "../../../core/MantineProvider/use-props/use-props.mjs";
+import { factory } from "../../../core/factory/factory.mjs";
+import { useMenuContext } from "../Menu.context.mjs";
+import { MenuSelectableItem } from "../MenuSelectableItem/MenuSelectableItem.mjs";
+import Menu_module_default from "../Menu.module.mjs";
+import { MenuRadioGroupContext } from "../MenuRadioGroup/MenuRadioGroup.context.mjs";
+import { RadioIcon } from "../../Radio/RadioIcon.mjs";
+import { use } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region packages/@mantine/core/src/components/Menu/MenuRadioItem/MenuRadioItem.tsx
+const MenuRadioItem = factory((_props) => {
+	const { classNames, className, style, styles, vars, color, closeMenuOnClick, rightSection, children, disabled, "data-disabled": dataDisabled, value, checked, onChange, checkIcon, ref, ...others } = useProps("MenuRadioItem", null, _props);
+	const ctx = useMenuContext();
+	const groupCtx = use(MenuRadioGroupContext);
+	const _checked = checked ?? (groupCtx ? groupCtx.value === value : false);
+	return /* @__PURE__ */ jsx(MenuSelectableItem, {
+		role: "menuitemradio",
+		checked: _checked,
+		indicator: checkIcon ?? ctx.checkIcon ?? /* @__PURE__ */ jsx(RadioIcon, { size: 5 }),
+		onSelect: () => {
+			if (!_checked) {
+				if (onChange) onChange(value);
+				else if (groupCtx) groupCtx.onChange(value);
+			}
+		},
+		color,
+		closeMenuOnClick,
+		rightSection,
+		disabled,
+		dataDisabled,
+		className,
+		style,
+		styles,
+		classNames,
+		buttonRef: ref,
+		others,
+		children
+	});
+});
+MenuRadioItem.classes = Menu_module_default;
+MenuRadioItem.displayName = "@mantine/core/MenuRadioItem";
+//#endregion
+export { MenuRadioItem };
+
+//# sourceMappingURL=MenuRadioItem.mjs.map

package/esm/components/Menu/MenuRadioItem/MenuRadioItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuRadioItem.mjs","names":["classes"],"sources":["../../../../src/components/Menu/MenuRadioItem/MenuRadioItem.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  MantineColor,\n  useProps,\n} from '../../../core';\nimport { RadioIcon } from '../../Radio/RadioIcon';\nimport { useMenuContext } from '../Menu.context';\nimport { MenuRadioGroupContext } from '../MenuRadioGroup/MenuRadioGroup.context';\nimport { MenuSelectableItem } from '../MenuSelectableItem/MenuSelectableItem';\nimport classes from '../Menu.module.css';\n\nexport type MenuRadioItemStylesNames = 'item' | 'itemLabel' | 'itemSection' | 'itemIndicator';\n\nexport interface MenuRadioItemProps\n  extends\n    BoxProps,\n    CompoundStylesApiProps<MenuRadioItemFactory>,\n    ElementProps<'button', 'color' | 'onChange' | 'value'> {\n  'data-disabled'?: boolean;\n\n  /** Item label */\n  children?: React.ReactNode;\n\n  /** Key of `theme.colors` or any valid CSS color */\n  color?: MantineColor;\n\n  /** If set, closes the menu when this item is clicked. By default, radio items do not close the menu. */\n  closeMenuOnClick?: boolean;\n\n  /** Section displayed at the end of the label */\n  rightSection?: React.ReactNode;\n\n  /** Sets disabled attribute, applies disabled styles */\n  disabled?: boolean;\n\n  /** Value of the radio item. Used by the parent `Menu.RadioGroup` to determine which item is selected. */\n  value: string;\n\n  /** Overrides selected state determined by the parent `Menu.RadioGroup`. */\n  checked?: boolean;\n\n  /** Called with the item value when item is selected. Overrides `onChange` of the parent `Menu.RadioGroup`. */\n  onChange?: (value: string) => void;\n\n  /** Replaces the default radio indicator rendered when the item is selected. Overrides `checkIcon` set on `Menu`. */\n  checkIcon?: React.ReactNode;\n}\n\nexport type MenuRadioItemFactory = Factory<{\n  props: MenuRadioItemProps;\n  ref: HTMLButtonElement;\n  stylesNames: MenuRadioItemStylesNames;\n  compound: true;\n}>;\n\nexport const MenuRadioItem = factory<MenuRadioItemFactory>((_props) => {\n  const props = useProps('MenuRadioItem', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    color,\n    closeMenuOnClick,\n    rightSection,\n    children,\n    disabled,\n    'data-disabled': dataDisabled,\n    value,\n    checked,\n    onChange,\n    checkIcon,\n    ref,\n    ...others\n  } = props;\n\n  const ctx = useMenuContext();\n  const groupCtx = use(MenuRadioGroupContext);\n\n  const _checked = checked ?? (groupCtx ? groupCtx.value === value : false);\n  const resolvedCheckIcon = checkIcon ?? ctx.checkIcon ?? <RadioIcon size={5} />;\n\n  return (\n    <MenuSelectableItem\n      role=\"menuitemradio\"\n      checked={_checked}\n      indicator={resolvedCheckIcon}\n      onSelect={() => {\n        if (!_checked) {\n          if (onChange) {\n            onChange(value);\n          } else if (groupCtx) {\n            groupCtx.onChange(value);\n          }\n        }\n      }}\n      color={color}\n      closeMenuOnClick={closeMenuOnClick}\n      rightSection={rightSection}\n      disabled={disabled}\n      dataDisabled={dataDisabled}\n      className={className}\n      style={style}\n      styles={styles}\n      classNames={classNames}\n      buttonRef={ref}\n      others={others}\n    >\n      {children}\n    </MenuSelectableItem>\n  );\n});\n\nMenuRadioItem.classes = classes;\nMenuRadioItem.displayName = '@mantine/core/MenuRadioItem';\n"],"mappings":";;;;;;;;;;;AA4DA,MAAa,gBAAgB,SAA+B,WAAW;CAErE,MAAM,EACJ,YACA,WACA,OACA,QACA,MACA,OACA,kBACA,cACA,UACA,UACA,iBAAiB,cACjB,OACA,SACA,UACA,WACA,KACA,GAAG,WAlBS,SAAS,iBAAiB,MAAM,MAmBtC;CAER,MAAM,MAAM,eAAe;CAC3B,MAAM,WAAW,IAAI,qBAAqB;CAE1C,MAAM,WAAW,YAAY,WAAW,SAAS,UAAU,QAAQ;CAGnE,OACE,oBAAC,oBAAD;EACE,MAAK;EACL,SAAS;EACT,WANsB,aAAa,IAAI,aAAa,oBAAC,WAAD,EAAW,MAAM,EAAI,CAAA;EAOzE,gBAAgB;GACd,IAAI,CAAC;QACC,UACF,SAAS,KAAK;SACT,IAAI,UACT,SAAS,SAAS,KAAK;GAAA;EAG7B;EACO;EACW;EACJ;EACJ;EACI;EACH;EACJ;EACC;EACI;EACZ,WAAW;EACH;EAEP;CACiB,CAAA;AAExB,CAAC;AAED,cAAc,UAAUA;AACxB,cAAc,cAAc"}