@react-md/core 6.5.2 → 7.0.0

package/dist/menu/MenuBar.d.ts

@@ -1,5 +1,7 @@
+import { type ReactElement, type Ref } from "react";
 import { type ListProps } from "../list/List.js";
 export interface MenuBarProps extends Omit<ListProps, "role"> {
+    ref?: Ref<HTMLUListElement>;
     /**
      * @defaultValue `true`
      */
@@ -59,4 +61,4 @@ export interface MenuBarProps extends Omit<ListProps, "role"> {
  * @since 5.0.0
  * @since 6.0.0 Combined with the previous `MenuBarWidget`
  */
-export declare const MenuBar: import("react").ForwardRefExoticComponent<MenuBarProps & import("react").RefAttributes<HTMLUListElement>>;
+export declare function MenuBar(props: MenuBarProps): ReactElement;

package/dist/menu/MenuBar.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { List } from "../list/List.js";
 import { KeyboardMovementProvider, useKeyboardMovementProvider } from "../movement/useKeyboardMovementProvider.js";
 import { MenuBarProvider, useMenuBarProvider } from "./useMenuBarProvider.js";
@@ -40,8 +39,8 @@ import { MenuBarProvider, useMenuBarProvider } from "./useMenuBarProvider.js";
  * @see {@link https://react-md.dev/components/menu | Menu Demos}
  * @since 5.0.0
  * @since 6.0.0 Combined with the previous `MenuBarWidget`
- */ export const MenuBar = /*#__PURE__*/ forwardRef(function MenuBar(props, ref) {
-    const { onClick, onFocus, onKeyDown, horizontal = true, hoverTimeout, children, ...remaining } = props;
+ */ export function MenuBar(props) {
+    const { ref, onClick, onFocus, onKeyDown, horizontal = true, hoverTimeout, children, ...remaining } = props;
     const menuBarContext = useMenuBarProvider({
         root: true,
         menubar: true,
@@ -77,6 +76,6 @@ import { MenuBarProvider, useMenuBarProvider } from "./useMenuBarProvider.js";
             })
         })
     });
-});
+}
 
 //# sourceMappingURL=MenuBar.js.map

package/dist/menu/MenuBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { List, type ListProps } from \"../list/List.js\";\nimport {\n  KeyboardMovementProvider,\n  useKeyboardMovementProvider,\n} from \"../movement/useKeyboardMovementProvider.js\";\nimport { MenuBarProvider, useMenuBarProvider } from \"./useMenuBarProvider.js\";\n\nexport interface MenuBarProps extends Omit<ListProps, \"role\"> {\n  /**\n   * @defaultValue `true`\n   */\n  horizontal?: boolean;\n\n  /**\n   * Set this to a number greater than 0 to allow opening dropdown menus within\n   * the menubar after hovering for the duration in milliseconds. Once a menu\n   * becomes visible within the menubar, all subsequent menus will become\n   * visible immediately on hover as well until the hover mode is ended.\n   *\n   * For example:\n   *\n   * - `0` - the dropdown menus become visible immediately on hover\n   * - `1000` - the first dropdown menu becomes visible after hovering for 1\n   *   second\n   * - `undefined` - the hover mode can only be activate after a click with\n   *   mouse, touch, or keyboard\n   *\n   * @defaultValue `undefined`\n   */\n  hoverTimeout?: number;\n}\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { DropdownMenu } from \"@react-md/core/menu/DropdownMenu\";\n * import { MenuBar } from \"@react-md/core/menu/MenuBar\";\n * import { MenuItem } from \"@react-md/core/menu/MenuItem\";\n * import type { ReactElement } from \"react\";\n *\n * export function SimpleExample(): ReactElement {\n *   return (\n *     <MenuBar>\n *       <DropdownMenu buttonChildren=\"Item 1\">\n *         <MenuItem>Menu Item 1</MenuItem>\n *         <MenuItem>Menu Item 2</MenuItem>\n *         <MenuItem>Menu Item 3</MenuItem>\n *       </DropdownMenu>\n *       <DropdownMenu buttonChildren=\"Item 2\">\n *         <MenuItem>Menu Item 1</MenuItem>\n *         <MenuItem>Menu Item 2</MenuItem>\n *         <MenuItem>Menu Item 3</MenuItem>\n *       </DropdownMenu>\n *       <DropdownMenu buttonChildren=\"Item 3\">\n *         <MenuItem>Menu Item 1</MenuItem>\n *         <MenuItem>Menu Item 2</MenuItem>\n *         <MenuItem>Menu Item 4</MenuItem>\n *       </DropdownMenu>\n *     </MenuBar>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/menu | Menu Demos}\n * @since 5.0.0\n * @since 6.0.0 Combined with the previous `MenuBarWidget`\n */\nexport const MenuBar = forwardRef<HTMLUListElement, MenuBarProps>(\n  function MenuBar(props, ref) {\n    const {\n      onClick,\n      onFocus,\n      onKeyDown,\n      horizontal = true,\n      hoverTimeout,\n      children,\n      ...remaining\n    } = props;\n    const menuBarContext = useMenuBarProvider({\n      root: true,\n      menubar: true,\n      hoverTimeout,\n    });\n    const { activeId, enableHoverMode } = menuBarContext;\n    const { movementProps, movementContext } = useKeyboardMovementProvider({\n      ref,\n      onClick,\n      onFocus,\n      onKeyDown,\n      loopable: true,\n      searchable: true,\n      horizontal,\n      includeDisabled: true,\n      tabIndexBehavior: \"roving\",\n      onFocusChange(event) {\n        if (activeId) {\n          enableHoverMode(event.element.id);\n        }\n      },\n    });\n\n    return (\n      <KeyboardMovementProvider value={movementContext}>\n        <MenuBarProvider value={menuBarContext}>\n          <List\n            {...remaining}\n            {...movementProps}\n            role=\"menubar\"\n            horizontal={horizontal}\n          >\n            {children}\n          </List>\n        </MenuBarProvider>\n      </KeyboardMovementProvider>\n    );\n  }\n);\n"],"names":["forwardRef","List","KeyboardMovementProvider","useKeyboardMovementProvider","MenuBarProvider","useMenuBarProvider","MenuBar","props","ref","onClick","onFocus","onKeyDown","horizontal","hoverTimeout","children","remaining","menuBarContext","root","menubar","activeId","enableHoverMode","movementProps","movementContext","loopable","searchable","includeDisabled","tabIndexBehavior","onFocusChange","event","element","id","value","role"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,IAAI,QAAwB,kBAAkB;AACvD,SACEC,wBAAwB,EACxBC,2BAA2B,QACtB,6CAA6C;AACpD,SAASC,eAAe,EAAEC,kBAAkB,QAAQ,0BAA0B;AA2B9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCC,GACD,OAAO,MAAMC,wBAAUN,WACrB,SAASM,QAAQC,KAAK,EAAEC,GAAG;IACzB,MAAM,EACJC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,aAAa,IAAI,EACjBC,YAAY,EACZC,QAAQ,EACR,GAAGC,WACJ,GAAGR;IACJ,MAAMS,iBAAiBX,mBAAmB;QACxCY,MAAM;QACNC,SAAS;QACTL;IACF;IACA,MAAM,EAAEM,QAAQ,EAAEC,eAAe,EAAE,GAAGJ;IACtC,MAAM,EAAEK,aAAa,EAAEC,eAAe,EAAE,GAAGnB,4BAA4B;QACrEK;QACAC;QACAC;QACAC;QACAY,UAAU;QACVC,YAAY;QACZZ;QACAa,iBAAiB;QACjBC,kBAAkB;QAClBC,eAAcC,KAAK;YACjB,IAAIT,UAAU;gBACZC,gBAAgBQ,MAAMC,OAAO,CAACC,EAAE;YAClC;QACF;IACF;IAEA,qBACE,KAAC5B;QAAyB6B,OAAOT;kBAC/B,cAAA,KAAClB;YAAgB2B,OAAOf;sBACtB,cAAA,KAACf;gBACE,GAAGc,SAAS;gBACZ,GAAGM,aAAa;gBACjBW,MAAK;gBACLpB,YAAYA;0BAEXE;;;;AAKX,GACA"}
+{"version":3,"sources":["../../src/menu/MenuBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactElement, type Ref } from \"react\";\n\nimport { List, type ListProps } from \"../list/List.js\";\nimport {\n  KeyboardMovementProvider,\n  useKeyboardMovementProvider,\n} from \"../movement/useKeyboardMovementProvider.js\";\nimport { MenuBarProvider, useMenuBarProvider } from \"./useMenuBarProvider.js\";\n\nexport interface MenuBarProps extends Omit<ListProps, \"role\"> {\n  ref?: Ref<HTMLUListElement>;\n\n  /**\n   * @defaultValue `true`\n   */\n  horizontal?: boolean;\n\n  /**\n   * Set this to a number greater than 0 to allow opening dropdown menus within\n   * the menubar after hovering for the duration in milliseconds. Once a menu\n   * becomes visible within the menubar, all subsequent menus will become\n   * visible immediately on hover as well until the hover mode is ended.\n   *\n   * For example:\n   *\n   * - `0` - the dropdown menus become visible immediately on hover\n   * - `1000` - the first dropdown menu becomes visible after hovering for 1\n   *   second\n   * - `undefined` - the hover mode can only be activate after a click with\n   *   mouse, touch, or keyboard\n   *\n   * @defaultValue `undefined`\n   */\n  hoverTimeout?: number;\n}\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { DropdownMenu } from \"@react-md/core/menu/DropdownMenu\";\n * import { MenuBar } from \"@react-md/core/menu/MenuBar\";\n * import { MenuItem } from \"@react-md/core/menu/MenuItem\";\n * import type { ReactElement } from \"react\";\n *\n * export function SimpleExample(): ReactElement {\n *   return (\n *     <MenuBar>\n *       <DropdownMenu buttonChildren=\"Item 1\">\n *         <MenuItem>Menu Item 1</MenuItem>\n *         <MenuItem>Menu Item 2</MenuItem>\n *         <MenuItem>Menu Item 3</MenuItem>\n *       </DropdownMenu>\n *       <DropdownMenu buttonChildren=\"Item 2\">\n *         <MenuItem>Menu Item 1</MenuItem>\n *         <MenuItem>Menu Item 2</MenuItem>\n *         <MenuItem>Menu Item 3</MenuItem>\n *       </DropdownMenu>\n *       <DropdownMenu buttonChildren=\"Item 3\">\n *         <MenuItem>Menu Item 1</MenuItem>\n *         <MenuItem>Menu Item 2</MenuItem>\n *         <MenuItem>Menu Item 4</MenuItem>\n *       </DropdownMenu>\n *     </MenuBar>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/menu | Menu Demos}\n * @since 5.0.0\n * @since 6.0.0 Combined with the previous `MenuBarWidget`\n */\nexport function MenuBar(props: MenuBarProps): ReactElement {\n  const {\n    ref,\n    onClick,\n    onFocus,\n    onKeyDown,\n    horizontal = true,\n    hoverTimeout,\n    children,\n    ...remaining\n  } = props;\n  const menuBarContext = useMenuBarProvider({\n    root: true,\n    menubar: true,\n    hoverTimeout,\n  });\n  const { activeId, enableHoverMode } = menuBarContext;\n  const { movementProps, movementContext } = useKeyboardMovementProvider({\n    ref,\n    onClick,\n    onFocus,\n    onKeyDown,\n    loopable: true,\n    searchable: true,\n    horizontal,\n    includeDisabled: true,\n    tabIndexBehavior: \"roving\",\n    onFocusChange(event) {\n      if (activeId) {\n        enableHoverMode(event.element.id);\n      }\n    },\n  });\n\n  return (\n    <KeyboardMovementProvider value={movementContext}>\n      <MenuBarProvider value={menuBarContext}>\n        <List\n          {...remaining}\n          {...movementProps}\n          role=\"menubar\"\n          horizontal={horizontal}\n        >\n          {children}\n        </List>\n      </MenuBarProvider>\n    </KeyboardMovementProvider>\n  );\n}\n"],"names":["List","KeyboardMovementProvider","useKeyboardMovementProvider","MenuBarProvider","useMenuBarProvider","MenuBar","props","ref","onClick","onFocus","onKeyDown","horizontal","hoverTimeout","children","remaining","menuBarContext","root","menubar","activeId","enableHoverMode","movementProps","movementContext","loopable","searchable","includeDisabled","tabIndexBehavior","onFocusChange","event","element","id","value","role"],"mappings":"AAAA;;AAIA,SAASA,IAAI,QAAwB,kBAAkB;AACvD,SACEC,wBAAwB,EACxBC,2BAA2B,QACtB,6CAA6C;AACpD,SAASC,eAAe,EAAEC,kBAAkB,QAAQ,0BAA0B;AA6B9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCC,GACD,OAAO,SAASC,QAAQC,KAAmB;IACzC,MAAM,EACJC,GAAG,EACHC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,aAAa,IAAI,EACjBC,YAAY,EACZC,QAAQ,EACR,GAAGC,WACJ,GAAGR;IACJ,MAAMS,iBAAiBX,mBAAmB;QACxCY,MAAM;QACNC,SAAS;QACTL;IACF;IACA,MAAM,EAAEM,QAAQ,EAAEC,eAAe,EAAE,GAAGJ;IACtC,MAAM,EAAEK,aAAa,EAAEC,eAAe,EAAE,GAAGnB,4BAA4B;QACrEK;QACAC;QACAC;QACAC;QACAY,UAAU;QACVC,YAAY;QACZZ;QACAa,iBAAiB;QACjBC,kBAAkB;QAClBC,eAAcC,KAAK;YACjB,IAAIT,UAAU;gBACZC,gBAAgBQ,MAAMC,OAAO,CAACC,EAAE;YAClC;QACF;IACF;IAEA,qBACE,KAAC5B;QAAyB6B,OAAOT;kBAC/B,cAAA,KAAClB;YAAgB2B,OAAOf;sBACtB,cAAA,KAACf;gBACE,GAAGc,SAAS;gBACZ,GAAGM,aAAa;gBACjBW,MAAK;gBACLpB,YAAYA;0BAEXE;;;;AAKX"}

package/dist/menu/MenuButton.d.ts

@@ -1,3 +1,4 @@
+import { type ReactElement } from "react";
 import { type ButtonProps } from "../button/Button.js";
 import { type IconRotatorProps } from "../icon/IconRotator.js";
 import { type TextIconSpacingProps } from "../icon/TextIconSpacing.js";
@@ -39,4 +40,4 @@ export interface MenuButtonProps extends ButtonProps, BaseMenuButtonProps {
  * @since 5.0.0
  * @since 6.0.0 See {@link BaseMenuButtonProps} for breaking changes.
  */
-export declare const MenuButton: import("react").ForwardRefExoticComponent<MenuButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare function MenuButton(props: MenuButtonProps): ReactElement;

package/dist/menu/MenuButton.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { Button } from "../button/Button.js";
 import { IconRotator } from "../icon/IconRotator.js";
 import { getIcon } from "../icon/config.js";
@@ -20,8 +19,8 @@ const noop = ()=>{
  * @see {@link https://react-md.dev/components/menu | Menu Demos}
  * @since 5.0.0
  * @since 6.0.0 See {@link BaseMenuButtonProps} for breaking changes.
- */ export const MenuButton = /*#__PURE__*/ forwardRef(function MenuButton(props, ref) {
-    const { id: propId, onClick = noop, onKeyDown = noop, icon: propIcon, iconAfter = true, iconRotatorProps, floating, buttonType = floating ? "icon" : "text", disableDropdownIcon = buttonType === "icon", children, ...remaining } = props;
+ */ export function MenuButton(props) {
+    const { ref, id: propId, onClick = noop, onKeyDown = noop, icon: propIcon, iconAfter = true, iconRotatorProps, floating, buttonType = floating ? "icon" : "text", disableDropdownIcon = buttonType === "icon", children, ...remaining } = props;
     const id = useEnsuredId(propId, "menubutton");
     const { visible, setVisible, defaultFocusIndex } = useMenuVisibility();
     const { renderAsSheet } = useMenuConfiguration();
@@ -72,6 +71,6 @@ const noop = ()=>{
             iconAfter && icon
         ]
     });
-});
+}
 
 //# sourceMappingURL=MenuButton.js.map

package/dist/menu/MenuButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { IconRotator, type IconRotatorProps } from \"../icon/IconRotator.js\";\nimport { type TextIconSpacingProps } from \"../icon/TextIconSpacing.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { useAppSize } from \"../media-queries/AppSizeProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\nimport { useMenuVisibility } from \"./MenuVisibilityProvider.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/** @since 5.0.0 */\nexport type MenuButtonTextIconSpacingProps = Pick<\n  TextIconSpacingProps,\n  \"icon\" | \"iconAfter\"\n>;\n\n/** @since 5.0.0 */\nexport type MenuButtonIconRotatorProps = Omit<\n  IconRotatorProps,\n  \"children\" | \"rotated\"\n>;\n\n/**\n * @since 5.0.0\n * @since 6.0.0 No longer extends the {@link ButtonProps}, no longer\n * requires an `id`, and no longer supports `textIconSpacingProps`.\n */\nexport interface BaseMenuButtonProps extends MenuButtonTextIconSpacingProps {\n  /**\n   * Any additional props to pass to the {@link IconRotator} component that\n   * surrounds the {@link buttonChildren}\n   */\n  iconRotatorProps?: Readonly<MenuButtonIconRotatorProps>;\n\n  /**\n   * Boolean if the dropdown icon should be included with the button children.\n   *\n   * @defaultValue `buttonType === \"icon\"`\n   */\n  disableDropdownIcon?: boolean;\n}\n\n/**\n * @since 5.0.0\n * @since 6.0.0 See {@link BaseMenuButtonProps} for breaking changes.\n */\nexport interface MenuButtonProps extends ButtonProps, BaseMenuButtonProps {}\n\n/**\n * **Client Component**\n *\n * An internal component that handles rendering a button for the `DropdownMenu`\n * while implementing the correct accessibility and keyboard movement.\n *\n * @see {@link https://react-md.dev/components/menu | Menu Demos}\n * @since 5.0.0\n * @since 6.0.0 See {@link BaseMenuButtonProps} for breaking changes.\n */\nexport const MenuButton = forwardRef<HTMLButtonElement, MenuButtonProps>(\n  function MenuButton(props, ref) {\n    const {\n      id: propId,\n      onClick = noop,\n      onKeyDown = noop,\n      icon: propIcon,\n      iconAfter = true,\n      iconRotatorProps,\n      floating,\n      buttonType = floating ? \"icon\" : \"text\",\n      disableDropdownIcon = buttonType === \"icon\",\n      children,\n      ...remaining\n    } = props;\n    const id = useEnsuredId(propId, \"menubutton\");\n    const { visible, setVisible, defaultFocusIndex } = useMenuVisibility();\n    const { renderAsSheet } = useMenuConfiguration();\n    const { isPhone } = useAppSize();\n    const isSheet =\n      renderAsSheet === true || (renderAsSheet === \"phone\" && isPhone);\n\n    const dropdownIcon = getIcon(\"dropdown\", propIcon);\n    let icon = propIcon;\n    if (!disableDropdownIcon) {\n      icon = (\n        <IconRotator {...iconRotatorProps} rotated={visible}>\n          {dropdownIcon}\n        </IconRotator>\n      );\n    }\n\n    return (\n      <Button\n        {...remaining}\n        aria-haspopup={isSheet ? \"dialog\" : \"menu\"}\n        aria-expanded={visible || undefined}\n        id={id}\n        ref={ref}\n        floating={floating}\n        buttonType={buttonType}\n        onClick={(event) => {\n          onClick(event);\n\n          defaultFocusIndex.current = 0;\n          setVisible((prevVisible) => !prevVisible);\n        }}\n        onKeyDown={(event) => {\n          onKeyDown(event);\n\n          switch (event.key) {\n            case \"ArrowDown\":\n              event.preventDefault();\n              event.stopPropagation();\n              defaultFocusIndex.current = 0;\n              setVisible(true);\n              break;\n            case \"ArrowUp\":\n              event.preventDefault();\n              event.stopPropagation();\n              defaultFocusIndex.current = -1;\n              setVisible(true);\n              break;\n          }\n        }}\n      >\n        {!iconAfter && icon}\n        {children}\n        {iconAfter && icon}\n      </Button>\n    );\n  }\n);\n"],"names":["forwardRef","Button","IconRotator","getIcon","useAppSize","useEnsuredId","useMenuConfiguration","useMenuVisibility","noop","MenuButton","props","ref","id","propId","onClick","onKeyDown","icon","propIcon","iconAfter","iconRotatorProps","floating","buttonType","disableDropdownIcon","children","remaining","visible","setVisible","defaultFocusIndex","renderAsSheet","isPhone","isSheet","dropdownIcon","rotated","aria-haspopup","aria-expanded","undefined","event","current","prevVisible","key","preventDefault","stopPropagation"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,MAAM,QAA0B,sBAAsB;AAC/D,SAASC,WAAW,QAA+B,yBAAyB;AAE5E,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,UAAU,QAAQ,sCAAsC;AACjE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,oBAAoB,QAAQ,iCAAiC;AACtE,SAASC,iBAAiB,QAAQ,8BAA8B;AAEhE,MAAMC,OAAO;AACX,aAAa;AACf;AAwCA;;;;;;;;;CASC,GACD,OAAO,MAAMC,2BAAaT,WACxB,SAASS,WAAWC,KAAK,EAAEC,GAAG;IAC5B,MAAM,EACJC,IAAIC,MAAM,EACVC,UAAUN,IAAI,EACdO,YAAYP,IAAI,EAChBQ,MAAMC,QAAQ,EACdC,YAAY,IAAI,EAChBC,gBAAgB,EAChBC,QAAQ,EACRC,aAAaD,WAAW,SAAS,MAAM,EACvCE,sBAAsBD,eAAe,MAAM,EAC3CE,QAAQ,EACR,GAAGC,WACJ,GAAGd;IACJ,MAAME,KAAKP,aAAaQ,QAAQ;IAChC,MAAM,EAAEY,OAAO,EAAEC,UAAU,EAAEC,iBAAiB,EAAE,GAAGpB;IACnD,MAAM,EAAEqB,aAAa,EAAE,GAAGtB;IAC1B,MAAM,EAAEuB,OAAO,EAAE,GAAGzB;IACpB,MAAM0B,UACJF,kBAAkB,QAASA,kBAAkB,WAAWC;IAE1D,MAAME,eAAe5B,QAAQ,YAAYc;IACzC,IAAID,OAAOC;IACX,IAAI,CAACK,qBAAqB;QACxBN,qBACE,KAACd;YAAa,GAAGiB,gBAAgB;YAAEa,SAASP;sBACzCM;;IAGP;IAEA,qBACE,MAAC9B;QACE,GAAGuB,SAAS;QACbS,iBAAeH,UAAU,WAAW;QACpCI,iBAAeT,WAAWU;QAC1BvB,IAAIA;QACJD,KAAKA;QACLS,UAAUA;QACVC,YAAYA;QACZP,SAAS,CAACsB;YACRtB,QAAQsB;YAERT,kBAAkBU,OAAO,GAAG;YAC5BX,WAAW,CAACY,cAAgB,CAACA;QAC/B;QACAvB,WAAW,CAACqB;YACVrB,UAAUqB;YAEV,OAAQA,MAAMG,GAAG;gBACf,KAAK;oBACHH,MAAMI,cAAc;oBACpBJ,MAAMK,eAAe;oBACrBd,kBAAkBU,OAAO,GAAG;oBAC5BX,WAAW;oBACX;gBACF,KAAK;oBACHU,MAAMI,cAAc;oBACpBJ,MAAMK,eAAe;oBACrBd,kBAAkBU,OAAO,GAAG,CAAC;oBAC7BX,WAAW;oBACX;YACJ;QACF;;YAEC,CAACR,aAAaF;YACdO;YACAL,aAAaF;;;AAGpB,GACA"}
+{"version":3,"sources":["../../src/menu/MenuButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactElement } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { IconRotator, type IconRotatorProps } from \"../icon/IconRotator.js\";\nimport { type TextIconSpacingProps } from \"../icon/TextIconSpacing.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { useAppSize } from \"../media-queries/AppSizeProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\nimport { useMenuVisibility } from \"./MenuVisibilityProvider.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/** @since 5.0.0 */\nexport type MenuButtonTextIconSpacingProps = Pick<\n  TextIconSpacingProps,\n  \"icon\" | \"iconAfter\"\n>;\n\n/** @since 5.0.0 */\nexport type MenuButtonIconRotatorProps = Omit<\n  IconRotatorProps,\n  \"children\" | \"rotated\"\n>;\n\n/**\n * @since 5.0.0\n * @since 6.0.0 No longer extends the {@link ButtonProps}, no longer\n * requires an `id`, and no longer supports `textIconSpacingProps`.\n */\nexport interface BaseMenuButtonProps extends MenuButtonTextIconSpacingProps {\n  /**\n   * Any additional props to pass to the {@link IconRotator} component that\n   * surrounds the {@link buttonChildren}\n   */\n  iconRotatorProps?: Readonly<MenuButtonIconRotatorProps>;\n\n  /**\n   * Boolean if the dropdown icon should be included with the button children.\n   *\n   * @defaultValue `buttonType === \"icon\"`\n   */\n  disableDropdownIcon?: boolean;\n}\n\n/**\n * @since 5.0.0\n * @since 6.0.0 See {@link BaseMenuButtonProps} for breaking changes.\n */\nexport interface MenuButtonProps extends ButtonProps, BaseMenuButtonProps {}\n\n/**\n * **Client Component**\n *\n * An internal component that handles rendering a button for the `DropdownMenu`\n * while implementing the correct accessibility and keyboard movement.\n *\n * @see {@link https://react-md.dev/components/menu | Menu Demos}\n * @since 5.0.0\n * @since 6.0.0 See {@link BaseMenuButtonProps} for breaking changes.\n */\nexport function MenuButton(props: MenuButtonProps): ReactElement {\n  const {\n    ref,\n    id: propId,\n    onClick = noop,\n    onKeyDown = noop,\n    icon: propIcon,\n    iconAfter = true,\n    iconRotatorProps,\n    floating,\n    buttonType = floating ? \"icon\" : \"text\",\n    disableDropdownIcon = buttonType === \"icon\",\n    children,\n    ...remaining\n  } = props;\n  const id = useEnsuredId(propId, \"menubutton\");\n  const { visible, setVisible, defaultFocusIndex } = useMenuVisibility();\n  const { renderAsSheet } = useMenuConfiguration();\n  const { isPhone } = useAppSize();\n  const isSheet =\n    renderAsSheet === true || (renderAsSheet === \"phone\" && isPhone);\n\n  const dropdownIcon = getIcon(\"dropdown\", propIcon);\n  let icon = propIcon;\n  if (!disableDropdownIcon) {\n    icon = (\n      <IconRotator {...iconRotatorProps} rotated={visible}>\n        {dropdownIcon}\n      </IconRotator>\n    );\n  }\n\n  return (\n    <Button\n      {...remaining}\n      aria-haspopup={isSheet ? \"dialog\" : \"menu\"}\n      aria-expanded={visible || undefined}\n      id={id}\n      ref={ref}\n      floating={floating}\n      buttonType={buttonType}\n      onClick={(event) => {\n        onClick(event);\n\n        defaultFocusIndex.current = 0;\n        setVisible((prevVisible) => !prevVisible);\n      }}\n      onKeyDown={(event) => {\n        onKeyDown(event);\n\n        switch (event.key) {\n          case \"ArrowDown\":\n            event.preventDefault();\n            event.stopPropagation();\n            defaultFocusIndex.current = 0;\n            setVisible(true);\n            break;\n          case \"ArrowUp\":\n            event.preventDefault();\n            event.stopPropagation();\n            defaultFocusIndex.current = -1;\n            setVisible(true);\n            break;\n        }\n      }}\n    >\n      {!iconAfter && icon}\n      {children}\n      {iconAfter && icon}\n    </Button>\n  );\n}\n"],"names":["Button","IconRotator","getIcon","useAppSize","useEnsuredId","useMenuConfiguration","useMenuVisibility","noop","MenuButton","props","ref","id","propId","onClick","onKeyDown","icon","propIcon","iconAfter","iconRotatorProps","floating","buttonType","disableDropdownIcon","children","remaining","visible","setVisible","defaultFocusIndex","renderAsSheet","isPhone","isSheet","dropdownIcon","rotated","aria-haspopup","aria-expanded","undefined","event","current","prevVisible","key","preventDefault","stopPropagation"],"mappings":"AAAA;;AAIA,SAASA,MAAM,QAA0B,sBAAsB;AAC/D,SAASC,WAAW,QAA+B,yBAAyB;AAE5E,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,UAAU,QAAQ,sCAAsC;AACjE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,oBAAoB,QAAQ,iCAAiC;AACtE,SAASC,iBAAiB,QAAQ,8BAA8B;AAEhE,MAAMC,OAAO;AACX,aAAa;AACf;AAwCA;;;;;;;;;CASC,GACD,OAAO,SAASC,WAAWC,KAAsB;IAC/C,MAAM,EACJC,GAAG,EACHC,IAAIC,MAAM,EACVC,UAAUN,IAAI,EACdO,YAAYP,IAAI,EAChBQ,MAAMC,QAAQ,EACdC,YAAY,IAAI,EAChBC,gBAAgB,EAChBC,QAAQ,EACRC,aAAaD,WAAW,SAAS,MAAM,EACvCE,sBAAsBD,eAAe,MAAM,EAC3CE,QAAQ,EACR,GAAGC,WACJ,GAAGd;IACJ,MAAME,KAAKP,aAAaQ,QAAQ;IAChC,MAAM,EAAEY,OAAO,EAAEC,UAAU,EAAEC,iBAAiB,EAAE,GAAGpB;IACnD,MAAM,EAAEqB,aAAa,EAAE,GAAGtB;IAC1B,MAAM,EAAEuB,OAAO,EAAE,GAAGzB;IACpB,MAAM0B,UACJF,kBAAkB,QAASA,kBAAkB,WAAWC;IAE1D,MAAME,eAAe5B,QAAQ,YAAYc;IACzC,IAAID,OAAOC;IACX,IAAI,CAACK,qBAAqB;QACxBN,qBACE,KAACd;YAAa,GAAGiB,gBAAgB;YAAEa,SAASP;sBACzCM;;IAGP;IAEA,qBACE,MAAC9B;QACE,GAAGuB,SAAS;QACbS,iBAAeH,UAAU,WAAW;QACpCI,iBAAeT,WAAWU;QAC1BvB,IAAIA;QACJD,KAAKA;QACLS,UAAUA;QACVC,YAAYA;QACZP,SAAS,CAACsB;YACRtB,QAAQsB;YAERT,kBAAkBU,OAAO,GAAG;YAC5BX,WAAW,CAACY,cAAgB,CAACA;QAC/B;QACAvB,WAAW,CAACqB;YACVrB,UAAUqB;YAEV,OAAQA,MAAMG,GAAG;gBACf,KAAK;oBACHH,MAAMI,cAAc;oBACpBJ,MAAMK,eAAe;oBACrBd,kBAAkBU,OAAO,GAAG;oBAC5BX,WAAW;oBACX;gBACF,KAAK;oBACHU,MAAMI,cAAc;oBACpBJ,MAAMK,eAAe;oBACrBd,kBAAkBU,OAAO,GAAG,CAAC;oBAC7BX,WAAW;oBACX;YACJ;QACF;;YAEC,CAACR,aAAaF;YACdO;YACAL,aAAaF;;;AAGpB"}

package/dist/menu/MenuItem.d.ts

@@ -1,8 +1,10 @@
+import { type ReactElement, type Ref } from "react";
 import { type ListItemProps } from "../list/ListItem.js";
 /**
  * @since 5.0.0
  */
 export interface MenuItemProps extends Omit<ListItemProps, "role"> {
+    ref?: Ref<HTMLLIElement>;
     /**
      * @defaultValue `"menuitem"`
      */
@@ -22,4 +24,4 @@ export interface MenuItemProps extends Omit<ListItemProps, "role"> {
  * @see {@link https://react-md.dev/components/menu | Menu Demos}
  * @since 5.0.0
  */
-export declare const MenuItem: import("react").ForwardRefExoticComponent<MenuItemProps & import("react").RefAttributes<HTMLLIElement>>;
+export declare function MenuItem(props: MenuItemProps): ReactElement;

package/dist/menu/MenuItem.js

@@ -1,7 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cnb } from "cnbuilder";
-import { forwardRef } from "react";
 import { ListItem } from "../list/ListItem.js";
 import { useKeyboardMovementContext } from "../movement/useKeyboardMovementProvider.js";
 import { useEnsuredId } from "../useEnsuredId.js";
@@ -14,8 +13,8 @@ import { useEnsuredId } from "../useEnsuredId.js";
  *
  * @see {@link https://react-md.dev/components/menu | Menu Demos}
  * @since 5.0.0
- */ export const MenuItem = /*#__PURE__*/ forwardRef(function MenuItem(props, ref) {
-    const { id: propId, role = "menuitem", tabIndex: propTabIndex, children, className, ...remaining } = props;
+ */ export function MenuItem(props) {
+    const { ref, id: propId, role = "menuitem", tabIndex: propTabIndex, children, className, ...remaining } = props;
     const id = useEnsuredId(propId, "menuitem");
     const { tabIndexBehavior, activeDescendantId } = useKeyboardMovementContext();
     const focused = id === activeDescendantId;
@@ -32,6 +31,6 @@ import { useEnsuredId } from "../useEnsuredId.js";
         className: cnb("rmd-menu-item", tabIndexBehavior === "virtual" && focused && "rmd-menu-item--focused", className),
         children: children
     });
-});
+}
 
 //# sourceMappingURL=MenuItem.js.map

package/dist/menu/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItem.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\n\nimport { ListItem, type ListItemProps } from \"../list/ListItem.js\";\nimport { useKeyboardMovementContext } from \"../movement/useKeyboardMovementProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\n\n/**\n * @since 5.0.0\n */\nexport interface MenuItemProps extends Omit<ListItemProps, \"role\"> {\n  /**\n   * @defaultValue `\"menuitem\"`\n   */\n  role?: string;\n\n  /**\n   * @defaultValue `-1`\n   */\n  tabIndex?: number;\n}\n\n/**\n * **Client Component**\n *\n * This component is used as an \"action\" within a `Menu`/`DropdownMenu` that\n * implements some keyboard focus behavior. This component should generally have\n * an `onClick` event handler.\n *\n * @see {@link https://react-md.dev/components/menu | Menu Demos}\n * @since 5.0.0\n */\nexport const MenuItem = forwardRef<HTMLLIElement, MenuItemProps>(\n  function MenuItem(props, ref) {\n    const {\n      id: propId,\n      role = \"menuitem\",\n      tabIndex: propTabIndex,\n      children,\n      className,\n      ...remaining\n    } = props;\n\n    const id = useEnsuredId(propId, \"menuitem\");\n    const { tabIndexBehavior, activeDescendantId } =\n      useKeyboardMovementContext();\n    const focused = id === activeDescendantId;\n    let tabIndex = propTabIndex ?? -1;\n    if (tabIndexBehavior === \"roving\" && focused) {\n      tabIndex = 0;\n    }\n\n    return (\n      <ListItem\n        {...remaining}\n        id={id}\n        ref={ref}\n        role={role}\n        tabIndex={tabIndex}\n        className={cnb(\n          \"rmd-menu-item\",\n          tabIndexBehavior === \"virtual\" && focused && \"rmd-menu-item--focused\",\n          className\n        )}\n      >\n        {children}\n      </ListItem>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","ListItem","useKeyboardMovementContext","useEnsuredId","MenuItem","props","ref","id","propId","role","tabIndex","propTabIndex","children","className","remaining","tabIndexBehavior","activeDescendantId","focused"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SAASC,QAAQ,QAA4B,sBAAsB;AACnE,SAASC,0BAA0B,QAAQ,6CAA6C;AACxF,SAASC,YAAY,QAAQ,qBAAqB;AAiBlD;;;;;;;;;CASC,GACD,OAAO,MAAMC,yBAAWJ,WACtB,SAASI,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,IAAIC,MAAM,EACVC,OAAO,UAAU,EACjBC,UAAUC,YAAY,EACtBC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGT;IAEJ,MAAME,KAAKJ,aAAaK,QAAQ;IAChC,MAAM,EAAEO,gBAAgB,EAAEC,kBAAkB,EAAE,GAC5Cd;IACF,MAAMe,UAAUV,OAAOS;IACvB,IAAIN,WAAWC,gBAAgB,CAAC;IAChC,IAAII,qBAAqB,YAAYE,SAAS;QAC5CP,WAAW;IACb;IAEA,qBACE,KAACT;QACE,GAAGa,SAAS;QACbP,IAAIA;QACJD,KAAKA;QACLG,MAAMA;QACNC,UAAUA;QACVG,WAAWd,IACT,iBACAgB,qBAAqB,aAAaE,WAAW,0BAC7CJ;kBAGDD;;AAGP,GACA"}
+{"version":3,"sources":["../../src/menu/MenuItem.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { type ReactElement, type Ref } from \"react\";\n\nimport { ListItem, type ListItemProps } from \"../list/ListItem.js\";\nimport { useKeyboardMovementContext } from \"../movement/useKeyboardMovementProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\n\n/**\n * @since 5.0.0\n */\nexport interface MenuItemProps extends Omit<ListItemProps, \"role\"> {\n  ref?: Ref<HTMLLIElement>;\n\n  /**\n   * @defaultValue `\"menuitem\"`\n   */\n  role?: string;\n\n  /**\n   * @defaultValue `-1`\n   */\n  tabIndex?: number;\n}\n\n/**\n * **Client Component**\n *\n * This component is used as an \"action\" within a `Menu`/`DropdownMenu` that\n * implements some keyboard focus behavior. This component should generally have\n * an `onClick` event handler.\n *\n * @see {@link https://react-md.dev/components/menu | Menu Demos}\n * @since 5.0.0\n */\nexport function MenuItem(props: MenuItemProps): ReactElement {\n  const {\n    ref,\n    id: propId,\n    role = \"menuitem\",\n    tabIndex: propTabIndex,\n    children,\n    className,\n    ...remaining\n  } = props;\n\n  const id = useEnsuredId(propId, \"menuitem\");\n  const { tabIndexBehavior, activeDescendantId } = useKeyboardMovementContext();\n  const focused = id === activeDescendantId;\n  let tabIndex = propTabIndex ?? -1;\n  if (tabIndexBehavior === \"roving\" && focused) {\n    tabIndex = 0;\n  }\n\n  return (\n    <ListItem\n      {...remaining}\n      id={id}\n      ref={ref}\n      role={role}\n      tabIndex={tabIndex}\n      className={cnb(\n        \"rmd-menu-item\",\n        tabIndexBehavior === \"virtual\" && focused && \"rmd-menu-item--focused\",\n        className\n      )}\n    >\n      {children}\n    </ListItem>\n  );\n}\n"],"names":["cnb","ListItem","useKeyboardMovementContext","useEnsuredId","MenuItem","props","ref","id","propId","role","tabIndex","propTabIndex","children","className","remaining","tabIndexBehavior","activeDescendantId","focused"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAGhC,SAASC,QAAQ,QAA4B,sBAAsB;AACnE,SAASC,0BAA0B,QAAQ,6CAA6C;AACxF,SAASC,YAAY,QAAQ,qBAAqB;AAmBlD;;;;;;;;;CASC,GACD,OAAO,SAASC,SAASC,KAAoB;IAC3C,MAAM,EACJC,GAAG,EACHC,IAAIC,MAAM,EACVC,OAAO,UAAU,EACjBC,UAAUC,YAAY,EACtBC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGT;IAEJ,MAAME,KAAKJ,aAAaK,QAAQ;IAChC,MAAM,EAAEO,gBAAgB,EAAEC,kBAAkB,EAAE,GAAGd;IACjD,MAAMe,UAAUV,OAAOS;IACvB,IAAIN,WAAWC,gBAAgB,CAAC;IAChC,IAAII,qBAAqB,YAAYE,SAAS;QAC5CP,WAAW;IACb;IAEA,qBACE,KAACT;QACE,GAAGa,SAAS;QACbP,IAAIA;QACJD,KAAKA;QACLG,MAAMA;QACNC,UAAUA;QACVG,WAAWb,IACT,iBACAe,qBAAqB,aAAaE,WAAW,0BAC7CJ;kBAGDD;;AAGP"}

package/dist/menu/MenuItemButton.d.ts

@@ -1,3 +1,4 @@
+import { type ReactElement } from "react";
 import { type BaseMenuButtonProps } from "./MenuButton.js";
 import { type MenuItemProps } from "./MenuItem.js";
 /**
@@ -15,4 +16,4 @@ export interface MenuItemButtonProps extends BaseMenuButtonProps, MenuItemProps
  * @internal
  * @since 5.0.0
  */
-export declare const MenuItemButton: import("react").ForwardRefExoticComponent<MenuItemButtonProps & import("react").RefAttributes<HTMLLIElement>>;
+export declare function MenuItemButton(props: MenuItemButtonProps): ReactElement;

package/dist/menu/MenuItemButton.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useEffect } from "react";
+import { useEffect } from "react";
 import { useHoverMode } from "../hoverMode/useHoverMode.js";
 import { IconRotator } from "../icon/IconRotator.js";
 import { getIcon } from "../icon/config.js";
@@ -22,8 +22,8 @@ const noop = ()=>{
  *
  * @internal
  * @since 5.0.0
- */ export const MenuItemButton = /*#__PURE__*/ forwardRef(function MenuItemButton(props, ref) {
-    const { id: propId, children, height: propHeight, onClick = noop, onKeyDown = noop, onMouseEnter = noop, onMouseLeave = noop, rightAddon: propRightAddon, iconRotatorProps, disableDropdownIcon = propRightAddon !== undefined, ...remaining } = props;
+ */ export function MenuItemButton(props) {
+    const { ref, id: propId, children, height: propHeight, onClick = noop, onKeyDown = noop, onMouseEnter = noop, onMouseLeave = noop, rightAddon: propRightAddon, iconRotatorProps, disableDropdownIcon = propRightAddon !== undefined, ...remaining } = props;
     const { disabled } = props;
     const id = useEnsuredId(propId, "menuitem");
     const mode = useUserInteractionMode();
@@ -124,6 +124,6 @@ const noop = ()=>{
         },
         children: children
     });
-});
+}
 
 //# sourceMappingURL=MenuItemButton.js.map

package/dist/menu/MenuItemButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItemButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef, useEffect } from \"react\";\n\nimport { useHoverMode } from \"../hoverMode/useHoverMode.js\";\nimport { IconRotator } from \"../icon/IconRotator.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { useUserInteractionMode } from \"../interaction/UserInteractionModeProvider.js\";\nimport { useAppSize } from \"../media-queries/AppSizeProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { type BaseMenuButtonProps } from \"./MenuButton.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\nimport { MenuItem, type MenuItemProps } from \"./MenuItem.js\";\nimport { useMenuVisibility } from \"./MenuVisibilityProvider.js\";\nimport { useMenuBarContext } from \"./useMenuBarProvider.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @internal\n * @since 5.0.0\n */\nexport interface MenuItemButtonProps\n  extends BaseMenuButtonProps, MenuItemProps {}\n\n/**\n * **Client Component**\n *\n * This is just an internal component that handles rendering a submenu as a\n * menuitem for a `DropdownMenu` with a conditional dropdown icon.\n *\n * @internal\n * @since 5.0.0\n */\nexport const MenuItemButton = forwardRef<HTMLLIElement, MenuItemButtonProps>(\n  function MenuItemButton(props, ref) {\n    const {\n      id: propId,\n      children,\n      height: propHeight,\n      onClick = noop,\n      onKeyDown = noop,\n      onMouseEnter = noop,\n      onMouseLeave = noop,\n      rightAddon: propRightAddon,\n      iconRotatorProps,\n      disableDropdownIcon = propRightAddon !== undefined,\n      ...remaining\n    } = props;\n    const { disabled } = props;\n\n    const id = useEnsuredId(propId, \"menuitem\");\n    const mode = useUserInteractionMode();\n    const { renderAsSheet } = useMenuConfiguration();\n    const { isPhone } = useAppSize();\n    const isSheet =\n      renderAsSheet === true || (renderAsSheet === \"phone\" && isPhone);\n    const {\n      root,\n      menubar,\n      activeId,\n      enableHoverMode,\n      disableHoverMode,\n      startDisableTimer,\n      clearDisableTimer,\n      leaveTimeoutRef,\n      hoverTimeoutRef,\n    } = useMenuBarContext();\n    const { visible, setVisible, defaultFocusIndex } = useMenuVisibility();\n    const { startShowFlow, clearVisibilityTimeout } = useHoverMode({\n      setVisible,\n      enableHoverMode,\n      disableHoverMode,\n      startDisableTimer,\n      leaveTimeoutRef,\n      hoverTimeoutRef,\n      clearDisableTimer,\n    });\n    const { horizontal } = useMenuConfiguration();\n\n    useEffect(() => {\n      setVisible(id === activeId);\n    }, [activeId, defaultFocusIndex, id, menubar, setVisible]);\n\n    let height = propHeight;\n    let rightAddon = propRightAddon;\n    const dropdownIcon = getIcon(root ? \"dropdown\" : \"forward\");\n    if (!disableDropdownIcon) {\n      if (!height && !props.leftAddon) {\n        height = \"normal\";\n      }\n\n      rightAddon = (\n        <IconRotator {...iconRotatorProps} rotated={visible}>\n          {dropdownIcon}\n        </IconRotator>\n      );\n    }\n\n    const updateVisibility = (nextVisible: boolean, focusIndex = 0): void => {\n      defaultFocusIndex.current = focusIndex;\n      setVisible(nextVisible);\n      if (!menubar) {\n        return;\n      }\n\n      if (nextVisible) {\n        enableHoverMode(id);\n      } else {\n        disableHoverMode();\n      }\n    };\n\n    return (\n      <MenuItem\n        {...remaining}\n        aria-haspopup={isSheet ? \"dialog\" : \"menu\"}\n        aria-expanded={visible || undefined}\n        id={id}\n        ref={ref}\n        rightAddon={rightAddon}\n        onClick={(event) => {\n          onClick(event);\n\n          event.stopPropagation();\n          updateVisibility(!visible);\n        }}\n        onKeyDown={(event) => {\n          onKeyDown(event);\n\n          switch (event.key) {\n            case \"ArrowDown\":\n              if (horizontal || root) {\n                event.preventDefault();\n                event.stopPropagation();\n                updateVisibility(true);\n              }\n              break;\n            case \"ArrowRight\":\n              if (!horizontal && !root) {\n                event.preventDefault();\n                event.stopPropagation();\n                updateVisibility(true);\n              }\n              break;\n          }\n        }}\n        onMouseEnter={(event) => {\n          onMouseEnter(event);\n          if (mode === \"touch\" || disabled || !menubar) {\n            return;\n          }\n\n          defaultFocusIndex.current = 0;\n          startShowFlow(id);\n        }}\n        onMouseLeave={(event) => {\n          onMouseLeave(event);\n          if (mode === \"touch\" || disabled || !menubar) {\n            return;\n          }\n\n          clearVisibilityTimeout();\n        }}\n      >\n        {children}\n      </MenuItem>\n    );\n  }\n);\n"],"names":["forwardRef","useEffect","useHoverMode","IconRotator","getIcon","useUserInteractionMode","useAppSize","useEnsuredId","useMenuConfiguration","MenuItem","useMenuVisibility","useMenuBarContext","noop","MenuItemButton","props","ref","id","propId","children","height","propHeight","onClick","onKeyDown","onMouseEnter","onMouseLeave","rightAddon","propRightAddon","iconRotatorProps","disableDropdownIcon","undefined","remaining","disabled","mode","renderAsSheet","isPhone","isSheet","root","menubar","activeId","enableHoverMode","disableHoverMode","startDisableTimer","clearDisableTimer","leaveTimeoutRef","hoverTimeoutRef","visible","setVisible","defaultFocusIndex","startShowFlow","clearVisibilityTimeout","horizontal","dropdownIcon","leftAddon","rotated","updateVisibility","nextVisible","focusIndex","current","aria-haspopup","aria-expanded","event","stopPropagation","key","preventDefault"],"mappings":"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"}
+{"version":3,"sources":["../../src/menu/MenuItemButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactElement, useEffect } from \"react\";\n\nimport { useHoverMode } from \"../hoverMode/useHoverMode.js\";\nimport { IconRotator } from \"../icon/IconRotator.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { useUserInteractionMode } from \"../interaction/UserInteractionModeProvider.js\";\nimport { useAppSize } from \"../media-queries/AppSizeProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { type BaseMenuButtonProps } from \"./MenuButton.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\nimport { MenuItem, type MenuItemProps } from \"./MenuItem.js\";\nimport { useMenuVisibility } from \"./MenuVisibilityProvider.js\";\nimport { useMenuBarContext } from \"./useMenuBarProvider.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @internal\n * @since 5.0.0\n */\nexport interface MenuItemButtonProps\n  extends BaseMenuButtonProps, MenuItemProps {}\n\n/**\n * **Client Component**\n *\n * This is just an internal component that handles rendering a submenu as a\n * menuitem for a `DropdownMenu` with a conditional dropdown icon.\n *\n * @internal\n * @since 5.0.0\n */\nexport function MenuItemButton(props: MenuItemButtonProps): ReactElement {\n  const {\n    ref,\n    id: propId,\n    children,\n    height: propHeight,\n    onClick = noop,\n    onKeyDown = noop,\n    onMouseEnter = noop,\n    onMouseLeave = noop,\n    rightAddon: propRightAddon,\n    iconRotatorProps,\n    disableDropdownIcon = propRightAddon !== undefined,\n    ...remaining\n  } = props;\n  const { disabled } = props;\n\n  const id = useEnsuredId(propId, \"menuitem\");\n  const mode = useUserInteractionMode();\n  const { renderAsSheet } = useMenuConfiguration();\n  const { isPhone } = useAppSize();\n  const isSheet =\n    renderAsSheet === true || (renderAsSheet === \"phone\" && isPhone);\n  const {\n    root,\n    menubar,\n    activeId,\n    enableHoverMode,\n    disableHoverMode,\n    startDisableTimer,\n    clearDisableTimer,\n    leaveTimeoutRef,\n    hoverTimeoutRef,\n  } = useMenuBarContext();\n  const { visible, setVisible, defaultFocusIndex } = useMenuVisibility();\n  const { startShowFlow, clearVisibilityTimeout } = useHoverMode({\n    setVisible,\n    enableHoverMode,\n    disableHoverMode,\n    startDisableTimer,\n    leaveTimeoutRef,\n    hoverTimeoutRef,\n    clearDisableTimer,\n  });\n  const { horizontal } = useMenuConfiguration();\n\n  useEffect(() => {\n    setVisible(id === activeId);\n  }, [activeId, defaultFocusIndex, id, menubar, setVisible]);\n\n  let height = propHeight;\n  let rightAddon = propRightAddon;\n  const dropdownIcon = getIcon(root ? \"dropdown\" : \"forward\");\n  if (!disableDropdownIcon) {\n    if (!height && !props.leftAddon) {\n      height = \"normal\";\n    }\n\n    rightAddon = (\n      <IconRotator {...iconRotatorProps} rotated={visible}>\n        {dropdownIcon}\n      </IconRotator>\n    );\n  }\n\n  const updateVisibility = (nextVisible: boolean, focusIndex = 0): void => {\n    defaultFocusIndex.current = focusIndex;\n    setVisible(nextVisible);\n    if (!menubar) {\n      return;\n    }\n\n    if (nextVisible) {\n      enableHoverMode(id);\n    } else {\n      disableHoverMode();\n    }\n  };\n\n  return (\n    <MenuItem\n      {...remaining}\n      aria-haspopup={isSheet ? \"dialog\" : \"menu\"}\n      aria-expanded={visible || undefined}\n      id={id}\n      ref={ref}\n      rightAddon={rightAddon}\n      onClick={(event) => {\n        onClick(event);\n\n        event.stopPropagation();\n        updateVisibility(!visible);\n      }}\n      onKeyDown={(event) => {\n        onKeyDown(event);\n\n        switch (event.key) {\n          case \"ArrowDown\":\n            if (horizontal || root) {\n              event.preventDefault();\n              event.stopPropagation();\n              updateVisibility(true);\n            }\n            break;\n          case \"ArrowRight\":\n            if (!horizontal && !root) {\n              event.preventDefault();\n              event.stopPropagation();\n              updateVisibility(true);\n            }\n            break;\n        }\n      }}\n      onMouseEnter={(event) => {\n        onMouseEnter(event);\n        if (mode === \"touch\" || disabled || !menubar) {\n          return;\n        }\n\n        defaultFocusIndex.current = 0;\n        startShowFlow(id);\n      }}\n      onMouseLeave={(event) => {\n        onMouseLeave(event);\n        if (mode === \"touch\" || disabled || !menubar) {\n          return;\n        }\n\n        clearVisibilityTimeout();\n      }}\n    >\n      {children}\n    </MenuItem>\n  );\n}\n"],"names":["useEffect","useHoverMode","IconRotator","getIcon","useUserInteractionMode","useAppSize","useEnsuredId","useMenuConfiguration","MenuItem","useMenuVisibility","useMenuBarContext","noop","MenuItemButton","props","ref","id","propId","children","height","propHeight","onClick","onKeyDown","onMouseEnter","onMouseLeave","rightAddon","propRightAddon","iconRotatorProps","disableDropdownIcon","undefined","remaining","disabled","mode","renderAsSheet","isPhone","isSheet","root","menubar","activeId","enableHoverMode","disableHoverMode","startDisableTimer","clearDisableTimer","leaveTimeoutRef","hoverTimeoutRef","visible","setVisible","defaultFocusIndex","startShowFlow","clearVisibilityTimeout","horizontal","dropdownIcon","leftAddon","rotated","updateVisibility","nextVisible","focusIndex","current","aria-haspopup","aria-expanded","event","stopPropagation","key","preventDefault"],"mappings":"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"}

package/dist/menu/MenuItemCheckbox.d.ts

@@ -1,3 +1,4 @@
+import { type ReactElement } from "react";
 import { type MenuItemCheckboxProps } from "./MenuItemInputToggle.js";
 /**
  * **Client Component**
@@ -31,4 +32,4 @@ import { type MenuItemCheckboxProps } from "./MenuItemInputToggle.js";
  * @see {@link https://react-md.dev/components/menu#menuitemcheckbox-example | DropdownMenu Demos}
  * @since 2.8.0
  */
-export declare const MenuItemCheckbox: import("react").ForwardRefExoticComponent<MenuItemCheckboxProps & import("react").RefAttributes<HTMLLIElement>>;
+export declare function MenuItemCheckbox(props: MenuItemCheckboxProps): ReactElement;

package/dist/menu/MenuItemCheckbox.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { MenuItemInputToggle } from "./MenuItemInputToggle.js";
 /**
  * **Client Component**
@@ -33,12 +32,13 @@ import { MenuItemInputToggle } from "./MenuItemInputToggle.js";
  *
  * @see {@link https://react-md.dev/components/menu#menuitemcheckbox-example | DropdownMenu Demos}
  * @since 2.8.0
- */ export const MenuItemCheckbox = /*#__PURE__*/ forwardRef(function MenuItemCheckbox(props, ref) {
+ */ export function MenuItemCheckbox(props) {
+    const { ref, ...remaining } = props;
     return /*#__PURE__*/ _jsx(MenuItemInputToggle, {
-        ...props,
+        ...remaining,
         ref: ref,
         type: "checkbox"
     });
-});
+}
 
 //# sourceMappingURL=MenuItemCheckbox.js.map

package/dist/menu/MenuItemCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItemCheckbox.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef } from \"react\";\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type ICON_CONFIG } from \"../icon/config.js\";\nimport {\n  type MenuItemCheckboxProps,\n  MenuItemInputToggle,\n} from \"./MenuItemInputToggle.js\";\n\n/**\n * **Client Component**\n *\n * This is a simple wrapper for the {@link MenuItemInputToggle} component to\n * render it as a checkbox and pulling the checkbox icon from the\n * {@link ICON_CONFIG}.\n *\n * @example Simple Example\n * ```tsx\n * import { DropdownMenu } from \"@react-md/core/menu/DropdownMenu\";\n * import { MenuItemCheckbox } from \"@react-md/core/menu/MenuItemCheckbox\";\n * import { ReactElement, useState } from \"react\";\n *\n * function Example(): ReactElement {\n *   const [checked, setChecked] = useState(false);\n *\n *   return (\n *     <DropdownMenu buttonChildren=\"Button\">\n *       <MenuItemCheckbox\n *         checked={checked}\n *         onCheckedChange={(nextChecked) => setChecked(nextChecked)}\n *       >\n *         Checkbox\n *      </MenuItemCheckbox>\n *     </DropdownMenu>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/menu#menuitemcheckbox-example | DropdownMenu Demos}\n * @since 2.8.0\n */\nexport const MenuItemCheckbox = forwardRef<\n  HTMLLIElement,\n  MenuItemCheckboxProps\n>(function MenuItemCheckbox(props, ref) {\n  return <MenuItemInputToggle {...props} ref={ref} type=\"checkbox\" />;\n});\n"],"names":["forwardRef","MenuItemInputToggle","MenuItemCheckbox","props","ref","type"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,QAAQ;AAInC,SAEEC,mBAAmB,QACd,2BAA2B;AAElC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BC,GACD,OAAO,MAAMC,iCAAmBF,WAG9B,SAASE,iBAAiBC,KAAK,EAAEC,GAAG;IACpC,qBAAO,KAACH;QAAqB,GAAGE,KAAK;QAAEC,KAAKA;QAAKC,MAAK;;AACxD,GAAG"}
+{"version":3,"sources":["../../src/menu/MenuItemCheckbox.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactElement } from \"react\";\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type ICON_CONFIG } from \"../icon/config.js\";\nimport {\n  type MenuItemCheckboxProps,\n  MenuItemInputToggle,\n} from \"./MenuItemInputToggle.js\";\n\n/**\n * **Client Component**\n *\n * This is a simple wrapper for the {@link MenuItemInputToggle} component to\n * render it as a checkbox and pulling the checkbox icon from the\n * {@link ICON_CONFIG}.\n *\n * @example Simple Example\n * ```tsx\n * import { DropdownMenu } from \"@react-md/core/menu/DropdownMenu\";\n * import { MenuItemCheckbox } from \"@react-md/core/menu/MenuItemCheckbox\";\n * import { ReactElement, useState } from \"react\";\n *\n * function Example(): ReactElement {\n *   const [checked, setChecked] = useState(false);\n *\n *   return (\n *     <DropdownMenu buttonChildren=\"Button\">\n *       <MenuItemCheckbox\n *         checked={checked}\n *         onCheckedChange={(nextChecked) => setChecked(nextChecked)}\n *       >\n *         Checkbox\n *      </MenuItemCheckbox>\n *     </DropdownMenu>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/menu#menuitemcheckbox-example | DropdownMenu Demos}\n * @since 2.8.0\n */\nexport function MenuItemCheckbox(props: MenuItemCheckboxProps): ReactElement {\n  const { ref, ...remaining } = props;\n\n  return <MenuItemInputToggle {...remaining} ref={ref} type=\"checkbox\" />;\n}\n"],"names":["MenuItemInputToggle","MenuItemCheckbox","props","ref","remaining","type"],"mappings":"AAAA;;AAMA,SAEEA,mBAAmB,QACd,2BAA2B;AAElC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BC,GACD,OAAO,SAASC,iBAAiBC,KAA4B;IAC3D,MAAM,EAAEC,GAAG,EAAE,GAAGC,WAAW,GAAGF;IAE9B,qBAAO,KAACF;QAAqB,GAAGI,SAAS;QAAED,KAAKA;QAAKE,MAAK;;AAC5D"}

package/dist/menu/MenuItemCircularProgress.d.ts

@@ -1,10 +1,11 @@
-import { type HTMLAttributes, type ReactNode } from "react";
+import { type HTMLAttributes, type ReactElement, type ReactNode, type Ref } from "react";
 import { type ListItemChildrenProps, type ListItemHeight } from "../list/types.js";
 import { type CircularProgressProps } from "../progress/CircularProgress.js";
 /**
  * @since 6.0.0
  */
 export interface MenuItemCircularProgressProps extends CircularProgressProps {
+    ref?: Ref<HTMLLIElement>;
     /** @defaultValue `"Loading"` */
     "aria-label"?: string;
     /** @defaultValue `"none"` */
@@ -54,4 +55,4 @@ export interface MenuItemCircularProgressProps extends CircularProgressProps {
  *
  * @since 6.0.0
  */
-export declare const MenuItemCircularProgress: import("react").ForwardRefExoticComponent<MenuItemCircularProgressProps & import("react").RefAttributes<HTMLLIElement>>;
+export declare function MenuItemCircularProgress(props: MenuItemCircularProgressProps): ReactElement;

package/dist/menu/MenuItemCircularProgress.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cnb } from "cnbuilder";
-import { forwardRef } from "react";
 import { ListItemChildren } from "../list/ListItemChildren.js";
 import { listItem } from "../list/listItemStyles.js";
 import { CircularProgress } from "../progress/CircularProgress.js";
@@ -40,8 +39,8 @@ import { CircularProgress } from "../progress/CircularProgress.js";
  * ```
  *
  * @since 6.0.0
- */ export const MenuItemCircularProgress = /*#__PURE__*/ forwardRef(function MenuItemCircularProgress(props, ref) {
-    const { "aria-label": propAriaLabel, "aria-labelledby": ariaLabelledBy, role = "none", className, height, leftAddon, rightAddon, liProps, listItemChildrenProps, ...remaining } = props;
+ */ export function MenuItemCircularProgress(props) {
+    const { ref, "aria-label": propAriaLabel, "aria-labelledby": ariaLabelledBy, role = "none", className, height, leftAddon, rightAddon, liProps, listItemChildrenProps, ...remaining } = props;
     let ariaLabel = propAriaLabel;
     if (!ariaLabel && !ariaLabelledBy) {
         ariaLabel = "Loading";
@@ -66,6 +65,6 @@ import { CircularProgress } from "../progress/CircularProgress.js";
             })
         })
     });
-});
+}
 
 //# sourceMappingURL=MenuItemCircularProgress.js.map

package/dist/menu/MenuItemCircularProgress.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItemCircularProgress.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { ListItemChildren } from \"../list/ListItemChildren.js\";\nimport { listItem } from \"../list/listItemStyles.js\";\nimport {\n  type ListItemChildrenProps,\n  type ListItemHeight,\n} from \"../list/types.js\";\nimport {\n  CircularProgress,\n  type CircularProgressProps,\n} from \"../progress/CircularProgress.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface MenuItemCircularProgressProps extends CircularProgressProps {\n  /** @defaultValue `\"Loading\"` */\n  \"aria-label\"?: string;\n\n  /** @defaultValue `\"none\"` */\n  role?: string;\n\n  /** @defaultValue `true` */\n  dense?: boolean;\n\n  liProps?: HTMLAttributes<HTMLLIElement>;\n  height?: ListItemHeight;\n  leftAddon?: ReactNode;\n  rightAddon?: ReactNode;\n  listItemChildrenProps?: ListItemChildrenProps;\n}\n\n/**\n * @example Simple Example\n * ```tsx\n * \"use client\";\n * import { DropdownMenu } from \"@react-md/core/menu/DropdownMenu\";\n * import { MenuItem } from \"@react-md/core/menu/MenuItem\";\n * import { MenuItemCircularProgress } from \"@react-md/core/menu/MenuItemCircularProgress\";\n * import { useAsyncFunction } from \"@react-md/core/useAsyncFunction\";\n *\n * function Example() {\n *   const { handleAsync, pending } = useAsyncFunction();\n *   const [visible, setVisible] = useState(false);\n *\n *   return (\n *     <DropdownMenu buttonChildren=\"Options\" visible={visible} setVisible={setVisible}>\n *       {pending && <MenuItemCircularProgress />}\n *       <MenuItem\n *         onClick={handleAsync(async (event) => {\n *           // prevent menu from closing until action completes\n *           event.stopPropagation()\n *\n *           // do something async\n *           await ...\n *\n *           // close menu once completed\n *           setVisible(false)\n *         })}\n *       >\n *         Some Action\n *       </MenuItem>\n *     </DropdownMenu>\n *   )\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport const MenuItemCircularProgress = forwardRef<\n  HTMLLIElement,\n  MenuItemCircularProgressProps\n>(function MenuItemCircularProgress(props, ref) {\n  const {\n    \"aria-label\": propAriaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    role = \"none\",\n    className,\n    height,\n    leftAddon,\n    rightAddon,\n    liProps,\n    listItemChildrenProps,\n    ...remaining\n  } = props;\n  let ariaLabel = propAriaLabel;\n  if (!ariaLabel && !ariaLabelledBy) {\n    ariaLabel = \"Loading\";\n  }\n\n  return (\n    <li\n      {...liProps}\n      ref={ref}\n      role={role}\n      className={cnb(listItem({ height, className }), liProps?.className)}\n    >\n      <ListItemChildren\n        {...listItemChildrenProps}\n        leftAddon={leftAddon}\n        rightAddon={rightAddon}\n      >\n        <CircularProgress\n          aria-label={ariaLabel as string}\n          aria-labelledby={ariaLabelledBy}\n          dense\n          {...remaining}\n        />\n      </ListItemChildren>\n    </li>\n  );\n});\n"],"names":["cnb","forwardRef","ListItemChildren","listItem","CircularProgress","MenuItemCircularProgress","props","ref","propAriaLabel","ariaLabelledBy","role","className","height","leftAddon","rightAddon","liProps","listItemChildrenProps","remaining","ariaLabel","li","aria-label","aria-labelledby","dense"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAA8CC,UAAU,QAAQ,QAAQ;AAExE,SAASC,gBAAgB,QAAQ,8BAA8B;AAC/D,SAASC,QAAQ,QAAQ,4BAA4B;AAKrD,SACEC,gBAAgB,QAEX,kCAAkC;AAsBzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCC,GACD,OAAO,MAAMC,yCAA2BJ,WAGtC,SAASI,yBAAyBC,KAAK,EAAEC,GAAG;IAC5C,MAAM,EACJ,cAAcC,aAAa,EAC3B,mBAAmBC,cAAc,EACjCC,OAAO,MAAM,EACbC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,UAAU,EACVC,OAAO,EACPC,qBAAqB,EACrB,GAAGC,WACJ,GAAGX;IACJ,IAAIY,YAAYV;IAChB,IAAI,CAACU,aAAa,CAACT,gBAAgB;QACjCS,YAAY;IACd;IAEA,qBACE,KAACC;QACE,GAAGJ,OAAO;QACXR,KAAKA;QACLG,MAAMA;QACNC,WAAWX,IAAIG,SAAS;YAAES;YAAQD;QAAU,IAAII,SAASJ;kBAEzD,cAAA,KAACT;YACE,GAAGc,qBAAqB;YACzBH,WAAWA;YACXC,YAAYA;sBAEZ,cAAA,KAACV;gBACCgB,cAAYF;gBACZG,mBAAiBZ;gBACjBa,KAAK;gBACJ,GAAGL,SAAS;;;;AAKvB,GAAG"}
+{"version":3,"sources":["../../src/menu/MenuItemCircularProgress.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport {\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n} from \"react\";\n\nimport { ListItemChildren } from \"../list/ListItemChildren.js\";\nimport { listItem } from \"../list/listItemStyles.js\";\nimport {\n  type ListItemChildrenProps,\n  type ListItemHeight,\n} from \"../list/types.js\";\nimport {\n  CircularProgress,\n  type CircularProgressProps,\n} from \"../progress/CircularProgress.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface MenuItemCircularProgressProps extends CircularProgressProps {\n  ref?: Ref<HTMLLIElement>;\n\n  /** @defaultValue `\"Loading\"` */\n  \"aria-label\"?: string;\n\n  /** @defaultValue `\"none\"` */\n  role?: string;\n\n  /** @defaultValue `true` */\n  dense?: boolean;\n\n  liProps?: HTMLAttributes<HTMLLIElement>;\n  height?: ListItemHeight;\n  leftAddon?: ReactNode;\n  rightAddon?: ReactNode;\n  listItemChildrenProps?: ListItemChildrenProps;\n}\n\n/**\n * @example Simple Example\n * ```tsx\n * \"use client\";\n * import { DropdownMenu } from \"@react-md/core/menu/DropdownMenu\";\n * import { MenuItem } from \"@react-md/core/menu/MenuItem\";\n * import { MenuItemCircularProgress } from \"@react-md/core/menu/MenuItemCircularProgress\";\n * import { useAsyncFunction } from \"@react-md/core/useAsyncFunction\";\n *\n * function Example() {\n *   const { handleAsync, pending } = useAsyncFunction();\n *   const [visible, setVisible] = useState(false);\n *\n *   return (\n *     <DropdownMenu buttonChildren=\"Options\" visible={visible} setVisible={setVisible}>\n *       {pending && <MenuItemCircularProgress />}\n *       <MenuItem\n *         onClick={handleAsync(async (event) => {\n *           // prevent menu from closing until action completes\n *           event.stopPropagation()\n *\n *           // do something async\n *           await ...\n *\n *           // close menu once completed\n *           setVisible(false)\n *         })}\n *       >\n *         Some Action\n *       </MenuItem>\n *     </DropdownMenu>\n *   )\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport function MenuItemCircularProgress(\n  props: MenuItemCircularProgressProps\n): ReactElement {\n  const {\n    ref,\n    \"aria-label\": propAriaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    role = \"none\",\n    className,\n    height,\n    leftAddon,\n    rightAddon,\n    liProps,\n    listItemChildrenProps,\n    ...remaining\n  } = props;\n  let ariaLabel = propAriaLabel;\n  if (!ariaLabel && !ariaLabelledBy) {\n    ariaLabel = \"Loading\";\n  }\n\n  return (\n    <li\n      {...liProps}\n      ref={ref}\n      role={role}\n      className={cnb(listItem({ height, className }), liProps?.className)}\n    >\n      <ListItemChildren\n        {...listItemChildrenProps}\n        leftAddon={leftAddon}\n        rightAddon={rightAddon}\n      >\n        <CircularProgress\n          aria-label={ariaLabel as string}\n          aria-labelledby={ariaLabelledBy}\n          dense\n          {...remaining}\n        />\n      </ListItemChildren>\n    </li>\n  );\n}\n"],"names":["cnb","ListItemChildren","listItem","CircularProgress","MenuItemCircularProgress","props","ref","propAriaLabel","ariaLabelledBy","role","className","height","leftAddon","rightAddon","liProps","listItemChildrenProps","remaining","ariaLabel","li","aria-label","aria-labelledby","dense"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAQhC,SAASC,gBAAgB,QAAQ,8BAA8B;AAC/D,SAASC,QAAQ,QAAQ,4BAA4B;AAKrD,SACEC,gBAAgB,QAEX,kCAAkC;AAwBzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCC,GACD,OAAO,SAASC,yBACdC,KAAoC;IAEpC,MAAM,EACJC,GAAG,EACH,cAAcC,aAAa,EAC3B,mBAAmBC,cAAc,EACjCC,OAAO,MAAM,EACbC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,UAAU,EACVC,OAAO,EACPC,qBAAqB,EACrB,GAAGC,WACJ,GAAGX;IACJ,IAAIY,YAAYV;IAChB,IAAI,CAACU,aAAa,CAACT,gBAAgB;QACjCS,YAAY;IACd;IAEA,qBACE,KAACC;QACE,GAAGJ,OAAO;QACXR,KAAKA;QACLG,MAAMA;QACNC,WAAWV,IAAIE,SAAS;YAAES;YAAQD;QAAU,IAAII,SAASJ;kBAEzD,cAAA,KAACT;YACE,GAAGc,qBAAqB;YACzBH,WAAWA;YACXC,YAAYA;sBAEZ,cAAA,KAACV;gBACCgB,cAAYF;gBACZG,mBAAiBZ;gBACjBa,KAAK;gBACJ,GAAGL,SAAS;;;;AAKvB"}

package/dist/menu/MenuItemFileInput.d.ts

@@ -1,4 +1,4 @@
-import { type ChangeEventHandler, type InputHTMLAttributes } from "react";
+import { type ChangeEventHandler, type InputHTMLAttributes, type ReactElement } from "react";
 import { type MenuItemProps } from "./MenuItem.js";
 /**
  * @since 6.0.0 Removed most of the shared `FileInputProps` from this
@@ -41,4 +41,4 @@ export interface MenuItemFileInputProps extends Omit<MenuItemProps, "onChange">,
  * menu item. This allows the menu to be closed immediately when this menu item
  * is clicked.
  */
-export declare const MenuItemFileInput: import("react").ForwardRefExoticComponent<MenuItemFileInputProps & import("react").RefAttributes<HTMLLIElement>>;
+export declare function MenuItemFileInput(props: MenuItemFileInputProps): ReactElement;

package/dist/menu/MenuItemFileInput.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { getIcon } from "../icon/config.js";
 import { useEnsuredId } from "../useEnsuredId.js";
 import { MenuItem } from "./MenuItem.js";
@@ -17,8 +16,8 @@ const noop = ()=>{
  * @since 6.0.0 No longer creates an invisible file input element within the
  * menu item. This allows the menu to be closed immediately when this menu item
  * is clicked.
- */ export const MenuItemFileInput = /*#__PURE__*/ forwardRef(function MenuItemFileInput(props, ref) {
-    const { id: propId, onClick = noop, onChange, accept, capture, multiple, children, leftAddon: propLeftAddon, preventMenuHideOnClick = false, ...remaining } = props;
+ */ export function MenuItemFileInput(props) {
+    const { ref, id: propId, onClick = noop, onChange, accept, capture, multiple, children, leftAddon: propLeftAddon, preventMenuHideOnClick = false, ...remaining } = props;
     const id = useEnsuredId(propId, "menu-item");
     const leftAddon = getIcon("upload", propLeftAddon);
     return /*#__PURE__*/ _jsx(MenuItem, {
@@ -54,6 +53,6 @@ const noop = ()=>{
         },
         children: children
     });
-});
+}
 
 //# sourceMappingURL=MenuItemFileInput.js.map

package/dist/menu/MenuItemFileInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItemFileInput.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type ChangeEventHandler,\n  type InputHTMLAttributes,\n  forwardRef,\n} from \"react\";\n\nimport { getIcon } from \"../icon/config.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { MenuItem, type MenuItemProps } from \"./MenuItem.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0 Removed most of the shared `FileInputProps` from this\n * implementation.\n */\nexport interface MenuItemFileInputProps\n  extends\n    Omit<MenuItemProps, \"onChange\">,\n    Pick<\n      InputHTMLAttributes<HTMLInputElement>,\n      \"accept\" | \"capture\" | \"multiple\"\n    > {\n  /**\n   * A change event handler that should do something with the selected files.\n   * Usually the `onChange` returned by `useFileUpload` or:\n   *\n   * ```ts\n   * onChange={(event) => {\n   *   const { files } = event.currentTarget;\n   *   // do something with files\n   * }}\n   * ```\n   *\n   * This is actually a native `Event` and not a `SyntheticEvent` because the\n   * file input is created through `document.createElement` instead of `React`.\n   * You can still access the files through `event.currentTarget.files` like\n   * normal.\n   */\n  onChange: ChangeEventHandler<HTMLInputElement>;\n\n  /**\n   * Set this to `true` if the `Menu` should not close when the file input's\n   * menu item is clicked.\n   *\n   * @defaultValue `false`\n   */\n  preventMenuHideOnClick?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * A wrapper for the `<input type=\"file\">` element that works within menus.\n *\n * @see {@link https://react-md.dev/components/menu#menuitemfileinput-example | DropdownMenu Demos}\n * @since 5.0.0\n * @since 6.0.0 No longer creates an invisible file input element within the\n * menu item. This allows the menu to be closed immediately when this menu item\n * is clicked.\n */\nexport const MenuItemFileInput = forwardRef<\n  HTMLLIElement,\n  MenuItemFileInputProps\n>(function MenuItemFileInput(props, ref) {\n  const {\n    id: propId,\n    onClick = noop,\n    onChange,\n    accept,\n    capture,\n    multiple,\n    children,\n    leftAddon: propLeftAddon,\n    preventMenuHideOnClick = false,\n    ...remaining\n  } = props;\n\n  const id = useEnsuredId(propId, \"menu-item\");\n  const leftAddon = getIcon(\"upload\", propLeftAddon);\n\n  return (\n    <MenuItem\n      {...remaining}\n      id={id}\n      ref={ref}\n      leftAddon={leftAddon}\n      onClick={(event) => {\n        onClick(event);\n\n        if (preventMenuHideOnClick) {\n          event.stopPropagation();\n        }\n\n        // Since the menu closes when the menu item is clicked causing the\n        // elements to be removed from the DOM, a normal `<input type=\"file\" />`\n        // can't be used. Instead, create a temporary file input element and\n        // click it to trigger the file upload behavior.\n        let input: HTMLInputElement | null = document.createElement(\"input\");\n        input.type = \"file\";\n        if (accept) {\n          input.accept = accept;\n        }\n        if (multiple) {\n          input.multiple = multiple;\n        }\n        if (capture) {\n          input.capture = capture === true ? \"\" : capture;\n        }\n\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-expect-error\n        input.addEventListener(\"change\", onChange);\n        input.click();\n        input = null;\n      }}\n    >\n      {children}\n    </MenuItem>\n  );\n});\n"],"names":["forwardRef","getIcon","useEnsuredId","MenuItem","noop","MenuItemFileInput","props","ref","id","propId","onClick","onChange","accept","capture","multiple","children","leftAddon","propLeftAddon","preventMenuHideOnClick","remaining","event","stopPropagation","input","document","createElement","type","addEventListener","click"],"mappings":"AAAA;;AAEA,SAGEA,UAAU,QACL,QAAQ;AAEf,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,QAAQ,QAA4B,gBAAgB;AAE7D,MAAMC,OAAO;AACX,aAAa;AACf;AAwCA;;;;;;;;;;CAUC,GACD,OAAO,MAAMC,kCAAoBL,WAG/B,SAASK,kBAAkBC,KAAK,EAAEC,GAAG;IACrC,MAAM,EACJC,IAAIC,MAAM,EACVC,UAAUN,IAAI,EACdO,QAAQ,EACRC,MAAM,EACNC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,WAAWC,aAAa,EACxBC,yBAAyB,KAAK,EAC9B,GAAGC,WACJ,GAAGb;IAEJ,MAAME,KAAKN,aAAaO,QAAQ;IAChC,MAAMO,YAAYf,QAAQ,UAAUgB;IAEpC,qBACE,KAACd;QACE,GAAGgB,SAAS;QACbX,IAAIA;QACJD,KAAKA;QACLS,WAAWA;QACXN,SAAS,CAACU;YACRV,QAAQU;YAER,IAAIF,wBAAwB;gBAC1BE,MAAMC,eAAe;YACvB;YAEA,kEAAkE;YAClE,wEAAwE;YACxE,oEAAoE;YACpE,gDAAgD;YAChD,IAAIC,QAAiCC,SAASC,aAAa,CAAC;YAC5DF,MAAMG,IAAI,GAAG;YACb,IAAIb,QAAQ;gBACVU,MAAMV,MAAM,GAAGA;YACjB;YACA,IAAIE,UAAU;gBACZQ,MAAMR,QAAQ,GAAGA;YACnB;YACA,IAAID,SAAS;gBACXS,MAAMT,OAAO,GAAGA,YAAY,OAAO,KAAKA;YAC1C;YAEA,6DAA6D;YAC7D,mBAAmB;YACnBS,MAAMI,gBAAgB,CAAC,UAAUf;YACjCW,MAAMK,KAAK;YACXL,QAAQ;QACV;kBAECP;;AAGP,GAAG"}
+{"version":3,"sources":["../../src/menu/MenuItemFileInput.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type ChangeEventHandler,\n  type InputHTMLAttributes,\n  type ReactElement,\n} from \"react\";\n\nimport { getIcon } from \"../icon/config.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { MenuItem, type MenuItemProps } from \"./MenuItem.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0 Removed most of the shared `FileInputProps` from this\n * implementation.\n */\nexport interface MenuItemFileInputProps\n  extends\n    Omit<MenuItemProps, \"onChange\">,\n    Pick<\n      InputHTMLAttributes<HTMLInputElement>,\n      \"accept\" | \"capture\" | \"multiple\"\n    > {\n  /**\n   * A change event handler that should do something with the selected files.\n   * Usually the `onChange` returned by `useFileUpload` or:\n   *\n   * ```ts\n   * onChange={(event) => {\n   *   const { files } = event.currentTarget;\n   *   // do something with files\n   * }}\n   * ```\n   *\n   * This is actually a native `Event` and not a `SyntheticEvent` because the\n   * file input is created through `document.createElement` instead of `React`.\n   * You can still access the files through `event.currentTarget.files` like\n   * normal.\n   */\n  onChange: ChangeEventHandler<HTMLInputElement>;\n\n  /**\n   * Set this to `true` if the `Menu` should not close when the file input's\n   * menu item is clicked.\n   *\n   * @defaultValue `false`\n   */\n  preventMenuHideOnClick?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * A wrapper for the `<input type=\"file\">` element that works within menus.\n *\n * @see {@link https://react-md.dev/components/menu#menuitemfileinput-example | DropdownMenu Demos}\n * @since 5.0.0\n * @since 6.0.0 No longer creates an invisible file input element within the\n * menu item. This allows the menu to be closed immediately when this menu item\n * is clicked.\n */\nexport function MenuItemFileInput(props: MenuItemFileInputProps): ReactElement {\n  const {\n    ref,\n    id: propId,\n    onClick = noop,\n    onChange,\n    accept,\n    capture,\n    multiple,\n    children,\n    leftAddon: propLeftAddon,\n    preventMenuHideOnClick = false,\n    ...remaining\n  } = props;\n\n  const id = useEnsuredId(propId, \"menu-item\");\n  const leftAddon = getIcon(\"upload\", propLeftAddon);\n\n  return (\n    <MenuItem\n      {...remaining}\n      id={id}\n      ref={ref}\n      leftAddon={leftAddon}\n      onClick={(event) => {\n        onClick(event);\n\n        if (preventMenuHideOnClick) {\n          event.stopPropagation();\n        }\n\n        // Since the menu closes when the menu item is clicked causing the\n        // elements to be removed from the DOM, a normal `<input type=\"file\" />`\n        // can't be used. Instead, create a temporary file input element and\n        // click it to trigger the file upload behavior.\n        let input: HTMLInputElement | null = document.createElement(\"input\");\n        input.type = \"file\";\n        if (accept) {\n          input.accept = accept;\n        }\n        if (multiple) {\n          input.multiple = multiple;\n        }\n        if (capture) {\n          input.capture = capture === true ? \"\" : capture;\n        }\n\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-expect-error\n        input.addEventListener(\"change\", onChange);\n        input.click();\n        input = null;\n      }}\n    >\n      {children}\n    </MenuItem>\n  );\n}\n"],"names":["getIcon","useEnsuredId","MenuItem","noop","MenuItemFileInput","props","ref","id","propId","onClick","onChange","accept","capture","multiple","children","leftAddon","propLeftAddon","preventMenuHideOnClick","remaining","event","stopPropagation","input","document","createElement","type","addEventListener","click"],"mappings":"AAAA;;AAQA,SAASA,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,QAAQ,QAA4B,gBAAgB;AAE7D,MAAMC,OAAO;AACX,aAAa;AACf;AAwCA;;;;;;;;;;CAUC,GACD,OAAO,SAASC,kBAAkBC,KAA6B;IAC7D,MAAM,EACJC,GAAG,EACHC,IAAIC,MAAM,EACVC,UAAUN,IAAI,EACdO,QAAQ,EACRC,MAAM,EACNC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,WAAWC,aAAa,EACxBC,yBAAyB,KAAK,EAC9B,GAAGC,WACJ,GAAGb;IAEJ,MAAME,KAAKN,aAAaO,QAAQ;IAChC,MAAMO,YAAYf,QAAQ,UAAUgB;IAEpC,qBACE,KAACd;QACE,GAAGgB,SAAS;QACbX,IAAIA;QACJD,KAAKA;QACLS,WAAWA;QACXN,SAAS,CAACU;YACRV,QAAQU;YAER,IAAIF,wBAAwB;gBAC1BE,MAAMC,eAAe;YACvB;YAEA,kEAAkE;YAClE,wEAAwE;YACxE,oEAAoE;YACpE,gDAAgD;YAChD,IAAIC,QAAiCC,SAASC,aAAa,CAAC;YAC5DF,MAAMG,IAAI,GAAG;YACb,IAAIb,QAAQ;gBACVU,MAAMV,MAAM,GAAGA;YACjB;YACA,IAAIE,UAAU;gBACZQ,MAAMR,QAAQ,GAAGA;YACnB;YACA,IAAID,SAAS;gBACXS,MAAMT,OAAO,GAAGA,YAAY,OAAO,KAAKA;YAC1C;YAEA,6DAA6D;YAC7D,mBAAmB;YACnBS,MAAMI,gBAAgB,CAAC,UAAUf;YACjCW,MAAMK,KAAK;YACXL,QAAQ;QACV;kBAECP;;AAGP"}

package/dist/menu/MenuItemGroup.d.ts

@@ -1,5 +1,5 @@
-import { type ReactNode } from "react";
-import { type ListElement, type ListProps } from "../list/List.js";
+import { type ReactElement, type ReactNode } from "react";
+import { type ListProps } from "../list/List.js";
 import { type LabelRequiredForA11y } from "../types.js";
 /** @since 5.0.0 */
 export type MenuItemGroupProps = LabelRequiredForA11y<Omit<ListProps, "role">> & {
@@ -70,4 +70,4 @@ export type MenuItemGroupProps = LabelRequiredForA11y<Omit<ListProps, "role">> &
  * @see {@link https://react-md.dev/components/menu | Menu Demos}
  * @since 5.0.0
  */
-export declare const MenuItemGroup: import("react").ForwardRefExoticComponent<MenuItemGroupProps & import("react").RefAttributes<ListElement>>;
+export declare function MenuItemGroup(props: MenuItemGroupProps): ReactElement;

package/dist/menu/MenuItemGroup.js

@@ -1,7 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cnb } from "cnbuilder";
-import { forwardRef } from "react";
 import { List } from "../list/List.js";
 import { useMenuConfiguration } from "./MenuConfigurationProvider.js";
 /**
@@ -68,16 +67,17 @@ import { useMenuConfiguration } from "./MenuConfigurationProvider.js";
  *
  * @see {@link https://react-md.dev/components/menu | Menu Demos}
  * @since 5.0.0
- */ export const MenuItemGroup = /*#__PURE__*/ forwardRef(function MenuItemGroup({ children, className, ...props }, ref) {
+ */ export function MenuItemGroup(props) {
+    const { ref, children, className, ...remaining } = props;
     const { horizontal } = useMenuConfiguration(props);
     return /*#__PURE__*/ _jsx(List, {
-        ...props,
+        ...remaining,
         ref: ref,
         role: "group",
         className: cnb("rmd-menu-item-group", className),
         horizontal: horizontal,
         children: children
     });
-});
+}
 
 //# sourceMappingURL=MenuItemGroup.js.map

package/dist/menu/MenuItemGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItemGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { type ReactNode, forwardRef } from \"react\";\n\nimport { List, type ListElement, type ListProps } from \"../list/List.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\n\n/** @since 5.0.0 */\nexport type MenuItemGroupProps = LabelRequiredForA11y<\n  Omit<ListProps, \"role\">\n> & {\n  children: ReactNode;\n};\n\n/**\n * **Client Component**\n *\n * If a menu or menubar contains more than one group of menuitemradio elements,\n * or if the menu contains one group and other, unrelated menu items, authors\n * SHOULD nest each set of related menuitemradio elements in an element using\n * the group role, and authors SHOULD delimit the group from other menu items\n * with an element using the separator role.\n *\n * @see {@link https://www.w3.org/TR/wai-aria-1.1/#menuitemradio}\n *\n * @example Simple Example\n * ```tsx\n * import { ReactElement, useState } from \"react\";\n * import { DropdownMenu } from \"@react-md/core/menu/DropdownMenu\";\n * import { MenuItemGroup } from \"@react-md/core/menu/MenuItemGroup\";\n * import { MenuItemRadio } from \"@react-md/core/menu/MenuItemRadio\";\n * import { MenuItemSeparator } from \"@react-md/core/menu/MenuItemSeparator\";\n * import { MenuItemSwitch } from \"@react-md/core/menu/MenuItemSwitch\";\n *\n * function Example(): ReactElement {\n *   const [value, setValue] = useState(\"value1\");\n *   const [checked, setChecked] = useState(false);\n *\n *   return (\n *     <DropdownMenu id=\"dropdown-menu-id\" buttonChildren=\"Button\">\n *       <MenuItemSwitch\n *         id=\"switch-id\"\n *         checked={checked}\n *         onCheckedChange={nextChecked => setChecked(nextChecked)}\n *       >\n *         Light mode\n *       </MenuItemSwitch>\n *       <MenuItemSeparator />\n *       <MenuItemGroup aria-label=\"My Group Label\">\n *         <MenuItemRadio\n *           id=\"radio-1\"\n *           checked={value === \"value1\"}\n *           onCheckedChange={() => setValue(\"value1\")}\n *         >\n *           Radio 1\n *         </MenuItemRadio>\n *         <MenuItemRadio\n *           id=\"radio-2\"\n *           checked={value === \"value2\"}\n *           onCheckedChange={() => setValue(\"value2\")}\n *         >\n *           Radio 2\n *         </MenuItemRadio>\n *         <MenuItemRadio\n *           id=\"radio-3\"\n *           checked={value === \"value3\"}\n *           onCheckedChange={() => setValue(\"value3\")}\n *         >\n *           Radio 3\n *         </MenuItemRadio>\n *       </MenuItemGroup>\n *     </DropdownMenu>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/menu | Menu Demos}\n * @since 5.0.0\n */\nexport const MenuItemGroup = forwardRef<ListElement, MenuItemGroupProps>(\n  function MenuItemGroup({ children, className, ...props }, ref) {\n    const { horizontal } = useMenuConfiguration(props);\n    return (\n      <List\n        {...props}\n        ref={ref}\n        role=\"group\"\n        className={cnb(\"rmd-menu-item-group\", className)}\n        horizontal={horizontal}\n      >\n        {children}\n      </List>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","List","useMenuConfiguration","MenuItemGroup","children","className","props","ref","horizontal","role"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAAyBC,UAAU,QAAQ,QAAQ;AAEnD,SAASC,IAAI,QAA0C,kBAAkB;AAEzE,SAASC,oBAAoB,QAAQ,iCAAiC;AAStE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgEC,GACD,OAAO,MAAMC,8BAAgBH,WAC3B,SAASG,cAAc,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,OAAO,EAAEC,GAAG;IAC3D,MAAM,EAAEC,UAAU,EAAE,GAAGN,qBAAqBI;IAC5C,qBACE,KAACL;QACE,GAAGK,KAAK;QACTC,KAAKA;QACLE,MAAK;QACLJ,WAAWN,IAAI,uBAAuBM;QACtCG,YAAYA;kBAEXJ;;AAGP,GACA"}
+{"version":3,"sources":["../../src/menu/MenuItemGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { type ReactElement, type ReactNode } from \"react\";\n\nimport { List, type ListProps } from \"../list/List.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\n\n/** @since 5.0.0 */\nexport type MenuItemGroupProps = LabelRequiredForA11y<\n  Omit<ListProps, \"role\">\n> & {\n  children: ReactNode;\n};\n\n/**\n * **Client Component**\n *\n * If a menu or menubar contains more than one group of menuitemradio elements,\n * or if the menu contains one group and other, unrelated menu items, authors\n * SHOULD nest each set of related menuitemradio elements in an element using\n * the group role, and authors SHOULD delimit the group from other menu items\n * with an element using the separator role.\n *\n * @see {@link https://www.w3.org/TR/wai-aria-1.1/#menuitemradio}\n *\n * @example Simple Example\n * ```tsx\n * import { ReactElement, useState } from \"react\";\n * import { DropdownMenu } from \"@react-md/core/menu/DropdownMenu\";\n * import { MenuItemGroup } from \"@react-md/core/menu/MenuItemGroup\";\n * import { MenuItemRadio } from \"@react-md/core/menu/MenuItemRadio\";\n * import { MenuItemSeparator } from \"@react-md/core/menu/MenuItemSeparator\";\n * import { MenuItemSwitch } from \"@react-md/core/menu/MenuItemSwitch\";\n *\n * function Example(): ReactElement {\n *   const [value, setValue] = useState(\"value1\");\n *   const [checked, setChecked] = useState(false);\n *\n *   return (\n *     <DropdownMenu id=\"dropdown-menu-id\" buttonChildren=\"Button\">\n *       <MenuItemSwitch\n *         id=\"switch-id\"\n *         checked={checked}\n *         onCheckedChange={nextChecked => setChecked(nextChecked)}\n *       >\n *         Light mode\n *       </MenuItemSwitch>\n *       <MenuItemSeparator />\n *       <MenuItemGroup aria-label=\"My Group Label\">\n *         <MenuItemRadio\n *           id=\"radio-1\"\n *           checked={value === \"value1\"}\n *           onCheckedChange={() => setValue(\"value1\")}\n *         >\n *           Radio 1\n *         </MenuItemRadio>\n *         <MenuItemRadio\n *           id=\"radio-2\"\n *           checked={value === \"value2\"}\n *           onCheckedChange={() => setValue(\"value2\")}\n *         >\n *           Radio 2\n *         </MenuItemRadio>\n *         <MenuItemRadio\n *           id=\"radio-3\"\n *           checked={value === \"value3\"}\n *           onCheckedChange={() => setValue(\"value3\")}\n *         >\n *           Radio 3\n *         </MenuItemRadio>\n *       </MenuItemGroup>\n *     </DropdownMenu>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/menu | Menu Demos}\n * @since 5.0.0\n */\nexport function MenuItemGroup(props: MenuItemGroupProps): ReactElement {\n  const { ref, children, className, ...remaining } = props;\n  const { horizontal } = useMenuConfiguration(props);\n\n  return (\n    <List\n      {...remaining}\n      ref={ref}\n      role=\"group\"\n      className={cnb(\"rmd-menu-item-group\", className)}\n      horizontal={horizontal}\n    >\n      {children}\n    </List>\n  );\n}\n"],"names":["cnb","List","useMenuConfiguration","MenuItemGroup","props","ref","children","className","remaining","horizontal","role"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAGhC,SAASC,IAAI,QAAwB,kBAAkB;AAEvD,SAASC,oBAAoB,QAAQ,iCAAiC;AAStE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgEC,GACD,OAAO,SAASC,cAAcC,KAAyB;IACrD,MAAM,EAAEC,GAAG,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGJ;IACnD,MAAM,EAAEK,UAAU,EAAE,GAAGP,qBAAqBE;IAE5C,qBACE,KAACH;QACE,GAAGO,SAAS;QACbH,KAAKA;QACLK,MAAK;QACLH,WAAWP,IAAI,uBAAuBO;QACtCE,YAAYA;kBAEXH;;AAGP"}

package/dist/menu/MenuItemInputToggle.d.ts

@@ -1,4 +1,4 @@
-import { type CSSProperties, type HTMLAttributes, type MouseEvent, type ReactNode } from "react";
+import { type CSSProperties, type HTMLAttributes, type MouseEvent, type ReactElement, type ReactNode, type Ref } from "react";
 import { type ConfigurableInputToggleIconProps, type IndeterminateCheckboxProps } from "../form/InputToggle.js";
 import { type InputToggleSize } from "../form/inputToggleStyles.js";
 import { type ListItemAddonPosition, type ListItemAddonType, type ListItemChildrenTextProps, type ListItemHeight } from "../list/types.js";
@@ -9,6 +9,7 @@ import { type PropsWithRef } from "../types.js";
 export type MenuItemInputToggleCheckedCallback = (checked: boolean, event: MouseEvent<HTMLLIElement>) => void;
 /** @since 2.8.0 */
 export interface BaseMenuItemInputToggleProps extends HTMLAttributes<HTMLLIElement>, ConfigurableInputToggleIconProps, ListItemChildrenTextProps {
+    ref?: Ref<HTMLLIElement>;
     checked: boolean;
     onCheckedChange: MenuItemInputToggleCheckedCallback;
     /**
@@ -87,4 +88,4 @@ export type MenuItemInputToggleProps = (MenuItemCheckboxProps & {
  * @see {@link MenuItemSwitch} for switch examples
  * @since 2.8.0
  */
-export declare const MenuItemInputToggle: import("react").ForwardRefExoticComponent<MenuItemInputToggleProps & import("react").RefAttributes<HTMLLIElement>>;
+export declare function MenuItemInputToggle(props: MenuItemInputToggleProps): ReactElement;