@react-md/core 1.0.0-next.2 → 1.0.0-next.20

package/dist/menu/MenuConfigurationProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuConfigurationProvider.tsx"],"sourcesContent":["\"use client\";\nimport {\n  createContext,\n  useContext,\n  useMemo,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { type SheetPosition, type SheetVerticalSize } from \"../sheet/styles.js\";\n\n/** @remarks \\@since 5.0.0 */\nexport interface MenuOrientationProps {\n  /**\n   * Boolean if the menu should be rendered horizontally instead of vertically.\n   * This will also update the `aria-orientation`.\n   *\n   * @defaultValue `false`\n   */\n  horizontal?: boolean;\n}\n\n/**\n * This allows the menu to be conditionally rendered as a `Sheet` instead of a\n * menu.\n *\n * - `false` - always render as a `Menu`\n * - `true` - always render as a `Sheet`\n * - `\"phone\"` - render as a sheet only when the {@link AppSize} is considered\n *   phone (`isPhone === true`).\n *\n * @defaultValue `false`\n * @remarks \\@since 5.0.0\n */\nexport type RenderMenuAsSheet = boolean | \"phone\";\n\n/** @remarks \\@since 5.0.0 */\nexport interface MenuConfiguration extends MenuOrientationProps {\n  /** {@inheritDoc RenderMenuAsSheet} */\n  renderAsSheet?: RenderMenuAsSheet;\n\n  /**\n   * @see {@link SheetPosition}\n   * @defaultValue `\"bottom\"`\n   */\n  sheetPosition?: SheetPosition;\n\n  /**\n   * @see {@link SheetVerticalSize}\n   * @defaultValue `\"touch\"`\n   */\n  sheetVerticalSize?: SheetVerticalSize;\n\n  /**\n   * Any children to render above the sheet's menu implementation. This would\n   * normally be something like a `<DialogHeader>` or `AppBar`.\n   *\n   * @defaultValue `null`\n   */\n  sheetHeader?: ReactNode;\n\n  /**\n   * Any children to render below the sheet's menu implementation. This would\n   * normally be something like a `<DialogFooter>`.\n   *\n   * @defaultValue `null`\n   */\n  sheetFooter?: ReactNode;\n}\n\n/** @remarks \\@since 5.0.0 */\nexport type MenuConfigurationContext = Required<MenuConfiguration>;\n\n/** @remarks \\@since 5.0.0 */\nexport const DEFAULT_MENU_CONFIGURATION: Readonly<MenuConfiguration> = {\n  horizontal: false,\n  renderAsSheet: false,\n  sheetHeader: null,\n  sheetFooter: null,\n  sheetPosition: \"bottom\",\n  sheetVerticalSize: \"touch\",\n};\n\n/**\n * @internal\n * @remarks \\@since 5.0.0\n */\nconst context = createContext<MenuConfigurationContext>({\n  horizontal: false,\n  renderAsSheet: false,\n  sheetHeader: null,\n  sheetFooter: null,\n  sheetPosition: \"bottom\",\n  sheetVerticalSize: \"touch\",\n});\ncontext.displayName = \"MenuConfiguration\";\n\n/**\n * @internal\n * @remarks \\@since 5.0.0\n */\nconst { Provider } = context;\n\n/**\n * This is probably just an internal only hook that allows you to get the\n * {@link MenuConfigurationContext} with optional overrides.\n *\n * @param overrides - An object of {@link MenuConfiguration} that would override\n * the inherited context values if they are not `undefined`.\n * @returns the {@link MenuConfigurationContext} with any overrides that were\n * provided.\n * @remarks \\@since 5.0.0\n */\nexport function useMenuConfiguration(\n  overrides: MenuConfiguration = {}\n): Readonly<MenuConfigurationContext> {\n  const {\n    horizontal,\n    renderAsSheet,\n    sheetHeader,\n    sheetFooter,\n    sheetPosition,\n    sheetVerticalSize,\n  } = overrides;\n  const inherited = useContext(context);\n\n  return {\n    horizontal: horizontal ?? inherited.horizontal,\n    renderAsSheet: renderAsSheet ?? inherited.renderAsSheet,\n    sheetHeader:\n      sheetHeader === null ? null : sheetHeader ?? inherited.sheetHeader,\n    sheetFooter:\n      sheetFooter === null ? null : sheetFooter ?? inherited.sheetFooter,\n    sheetPosition: sheetPosition ?? inherited.sheetPosition,\n    sheetVerticalSize: sheetVerticalSize ?? inherited.sheetVerticalSize,\n  };\n}\n\n/** @remarks \\@since 5.0.0 */\nexport interface MenuConfigurationProviderProps extends MenuConfiguration {\n  children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * Note: This will always merge values with any parent\n * `MenuConfigurationProvider`s.\n *\n * @remarks \\@since 5.0.0\n */\nexport function MenuConfigurationProvider(\n  props: MenuConfigurationProviderProps\n): ReactElement {\n  const { children, ...configuration } = props;\n  const {\n    horizontal,\n    renderAsSheet,\n    sheetHeader,\n    sheetFooter,\n    sheetPosition,\n    sheetVerticalSize,\n  } = useMenuConfiguration(configuration);\n\n  const value = useMemo<MenuConfigurationContext>(\n    () => ({\n      horizontal,\n      renderAsSheet,\n      sheetHeader,\n      sheetFooter,\n      sheetPosition,\n      sheetVerticalSize,\n    }),\n    [\n      horizontal,\n      renderAsSheet,\n      sheetFooter,\n      sheetHeader,\n      sheetPosition,\n      sheetVerticalSize,\n    ]\n  );\n\n  return <Provider value={value}>{children}</Provider>;\n}\n"],"names":["createContext","useContext","useMemo","DEFAULT_MENU_CONFIGURATION","horizontal","renderAsSheet","sheetHeader","sheetFooter","sheetPosition","sheetVerticalSize","context","displayName","Provider","useMenuConfiguration","overrides","inherited","MenuConfigurationProvider","props","children","configuration","value"],"mappings":"AAAA;;AACA,SACEA,aAAa,EACbC,UAAU,EACVC,OAAO,QAGF,QAAQ;AAiEf,2BAA2B,GAC3B,OAAO,MAAMC,6BAA0D;IACrEC,YAAY;IACZC,eAAe;IACfC,aAAa;IACbC,aAAa;IACbC,eAAe;IACfC,mBAAmB;AACrB,EAAE;AAEF;;;CAGC,GACD,MAAMC,wBAAUV,cAAwC;IACtDI,YAAY;IACZC,eAAe;IACfC,aAAa;IACbC,aAAa;IACbC,eAAe;IACfC,mBAAmB;AACrB;AACAC,QAAQC,WAAW,GAAG;AAEtB;;;CAGC,GACD,MAAM,EAAEC,QAAQ,EAAE,GAAGF;AAErB;;;;;;;;;CASC,GACD,OAAO,SAASG,qBACdC,YAA+B,CAAC,CAAC;IAEjC,MAAM,EACJV,UAAU,EACVC,aAAa,EACbC,WAAW,EACXC,WAAW,EACXC,aAAa,EACbC,iBAAiB,EAClB,GAAGK;IACJ,MAAMC,YAAYd,WAAWS;IAE7B,OAAO;QACLN,YAAYA,cAAcW,UAAUX,UAAU;QAC9CC,eAAeA,iBAAiBU,UAAUV,aAAa;QACvDC,aACEA,gBAAgB,OAAO,OAAOA,eAAeS,UAAUT,WAAW;QACpEC,aACEA,gBAAgB,OAAO,OAAOA,eAAeQ,UAAUR,WAAW;QACpEC,eAAeA,iBAAiBO,UAAUP,aAAa;QACvDC,mBAAmBA,qBAAqBM,UAAUN,iBAAiB;IACrE;AACF;AAOA;;;;;;;CAOC,GACD,OAAO,SAASO,0BACdC,KAAqC;IAErC,MAAM,EAAEC,QAAQ,EAAE,GAAGC,eAAe,GAAGF;IACvC,MAAM,EACJb,UAAU,EACVC,aAAa,EACbC,WAAW,EACXC,WAAW,EACXC,aAAa,EACbC,iBAAiB,EAClB,GAAGI,qBAAqBM;IAEzB,MAAMC,QAAQlB,QACZ,IAAO,CAAA;YACLE;YACAC;YACAC;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QACEL;QACAC;QACAE;QACAD;QACAE;QACAC;KACD;IAGH,qBAAO,KAACG;QAASQ,OAAOA;kBAAQF;;AAClC"}
+{"version":3,"sources":["../../src/menu/MenuConfigurationProvider.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type ReactElement,\n  type ReactNode,\n  createContext,\n  useContext,\n  useMemo,\n} from \"react\";\n\nimport { type SheetPosition, type SheetVerticalSize } from \"../sheet/styles.js\";\n\n/** @since 5.0.0 */\nexport interface MenuOrientationProps {\n  /**\n   * Boolean if the menu should be rendered horizontally instead of vertically.\n   * This will also update the `aria-orientation`.\n   *\n   * @defaultValue `false`\n   */\n  horizontal?: boolean;\n}\n\n/**\n * This allows the menu to be conditionally rendered as a `Sheet` instead of a\n * menu.\n *\n * - `false` - always render as a `Menu`\n * - `true` - always render as a `Sheet`\n * - `\"phone\"` - render as a sheet only when the {@link AppSize} is considered\n *   phone (`isPhone === true`).\n *\n * @defaultValue `false`\n * @since 5.0.0\n */\nexport type RenderMenuAsSheet = boolean | \"phone\";\n\n/** @since 5.0.0 */\nexport interface MenuConfiguration extends MenuOrientationProps {\n  /** {@inheritDoc RenderMenuAsSheet} */\n  renderAsSheet?: RenderMenuAsSheet;\n\n  /**\n   * @see {@link SheetPosition}\n   * @defaultValue `\"bottom\"`\n   */\n  sheetPosition?: SheetPosition;\n\n  /**\n   * @see {@link SheetVerticalSize}\n   * @defaultValue `\"touch\"`\n   */\n  sheetVerticalSize?: SheetVerticalSize;\n\n  /**\n   * Any children to render above the sheet's menu implementation. This would\n   * normally be something like a `<DialogHeader>` or `AppBar`.\n   *\n   * @defaultValue `null`\n   */\n  sheetHeader?: ReactNode;\n\n  /**\n   * Any children to render below the sheet's menu implementation. This would\n   * normally be something like a `<DialogFooter>`.\n   *\n   * @defaultValue `null`\n   */\n  sheetFooter?: ReactNode;\n}\n\n/** @since 5.0.0 */\nexport type MenuConfigurationContext = Required<MenuConfiguration>;\n\n/** @since 5.0.0 */\nexport const DEFAULT_MENU_CONFIGURATION: Readonly<MenuConfiguration> = {\n  horizontal: false,\n  renderAsSheet: false,\n  sheetHeader: null,\n  sheetFooter: null,\n  sheetPosition: \"bottom\",\n  sheetVerticalSize: \"touch\",\n};\n\n/**\n * @internal\n * @since 5.0.0\n */\nconst context = createContext<MenuConfigurationContext>({\n  horizontal: false,\n  renderAsSheet: false,\n  sheetHeader: null,\n  sheetFooter: null,\n  sheetPosition: \"bottom\",\n  sheetVerticalSize: \"touch\",\n});\ncontext.displayName = \"MenuConfiguration\";\n\n/**\n * @internal\n * @since 5.0.0\n */\nconst { Provider } = context;\n\n/**\n * This is probably just an internal only hook that allows you to get the\n * {@link MenuConfigurationContext} with optional overrides.\n *\n * @param overrides - An object of {@link MenuConfiguration} that would override\n * the inherited context values if they are not `undefined`.\n * @returns the {@link MenuConfigurationContext} with any overrides that were\n * provided.\n * @since 5.0.0\n */\nexport function useMenuConfiguration(\n  overrides: MenuConfiguration = {}\n): Readonly<MenuConfigurationContext> {\n  const {\n    horizontal,\n    renderAsSheet,\n    sheetHeader,\n    sheetFooter,\n    sheetPosition,\n    sheetVerticalSize,\n  } = overrides;\n  const inherited = useContext(context);\n\n  return {\n    horizontal: horizontal ?? inherited.horizontal,\n    renderAsSheet: renderAsSheet ?? inherited.renderAsSheet,\n    sheetHeader:\n      sheetHeader === null ? null : (sheetHeader ?? inherited.sheetHeader),\n    sheetFooter:\n      sheetFooter === null ? null : (sheetFooter ?? inherited.sheetFooter),\n    sheetPosition: sheetPosition ?? inherited.sheetPosition,\n    sheetVerticalSize: sheetVerticalSize ?? inherited.sheetVerticalSize,\n  };\n}\n\n/** @since 5.0.0 */\nexport interface MenuConfigurationProviderProps extends MenuConfiguration {\n  children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * Note: This will always merge values with any parent\n * `MenuConfigurationProvider`s.\n *\n * @since 5.0.0\n */\nexport function MenuConfigurationProvider(\n  props: MenuConfigurationProviderProps\n): ReactElement {\n  const { children, ...configuration } = props;\n  const {\n    horizontal,\n    renderAsSheet,\n    sheetHeader,\n    sheetFooter,\n    sheetPosition,\n    sheetVerticalSize,\n  } = useMenuConfiguration(configuration);\n\n  const value = useMemo<MenuConfigurationContext>(\n    () => ({\n      horizontal,\n      renderAsSheet,\n      sheetHeader,\n      sheetFooter,\n      sheetPosition,\n      sheetVerticalSize,\n    }),\n    [\n      horizontal,\n      renderAsSheet,\n      sheetFooter,\n      sheetHeader,\n      sheetPosition,\n      sheetVerticalSize,\n    ]\n  );\n\n  return <Provider value={value}>{children}</Provider>;\n}\n"],"names":["createContext","useContext","useMemo","DEFAULT_MENU_CONFIGURATION","horizontal","renderAsSheet","sheetHeader","sheetFooter","sheetPosition","sheetVerticalSize","context","displayName","Provider","useMenuConfiguration","overrides","inherited","MenuConfigurationProvider","props","children","configuration","value"],"mappings":"AAAA;;AAEA,SAGEA,aAAa,EACbC,UAAU,EACVC,OAAO,QACF,QAAQ;AAkEf,iBAAiB,GACjB,OAAO,MAAMC,6BAA0D;IACrEC,YAAY;IACZC,eAAe;IACfC,aAAa;IACbC,aAAa;IACbC,eAAe;IACfC,mBAAmB;AACrB,EAAE;AAEF;;;CAGC,GACD,MAAMC,wBAAUV,cAAwC;IACtDI,YAAY;IACZC,eAAe;IACfC,aAAa;IACbC,aAAa;IACbC,eAAe;IACfC,mBAAmB;AACrB;AACAC,QAAQC,WAAW,GAAG;AAEtB;;;CAGC,GACD,MAAM,EAAEC,QAAQ,EAAE,GAAGF;AAErB;;;;;;;;;CASC,GACD,OAAO,SAASG,qBACdC,YAA+B,CAAC,CAAC;IAEjC,MAAM,EACJV,UAAU,EACVC,aAAa,EACbC,WAAW,EACXC,WAAW,EACXC,aAAa,EACbC,iBAAiB,EAClB,GAAGK;IACJ,MAAMC,YAAYd,WAAWS;IAE7B,OAAO;QACLN,YAAYA,cAAcW,UAAUX,UAAU;QAC9CC,eAAeA,iBAAiBU,UAAUV,aAAa;QACvDC,aACEA,gBAAgB,OAAO,OAAQA,eAAeS,UAAUT,WAAW;QACrEC,aACEA,gBAAgB,OAAO,OAAQA,eAAeQ,UAAUR,WAAW;QACrEC,eAAeA,iBAAiBO,UAAUP,aAAa;QACvDC,mBAAmBA,qBAAqBM,UAAUN,iBAAiB;IACrE;AACF;AAOA;;;;;;;CAOC,GACD,OAAO,SAASO,0BACdC,KAAqC;IAErC,MAAM,EAAEC,QAAQ,EAAE,GAAGC,eAAe,GAAGF;IACvC,MAAM,EACJb,UAAU,EACVC,aAAa,EACbC,WAAW,EACXC,WAAW,EACXC,aAAa,EACbC,iBAAiB,EAClB,GAAGI,qBAAqBM;IAEzB,MAAMC,QAAQlB,QACZ,IAAO,CAAA;YACLE;YACAC;YACAC;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QACEL;QACAC;QACAE;QACAD;QACAE;QACAC;KACD;IAGH,qBAAO,KAACG;QAASQ,OAAOA;kBAAQF;;AAClC"}

package/dist/menu/MenuItem.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
 import { type ListItemProps } from "../list/ListItem.js";
 /**
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */
 export interface MenuItemProps extends Omit<ListItemProps, "role"> {
     /**
@@ -20,6 +19,6 @@ export interface MenuItemProps extends Omit<ListItemProps, "role"> {
  * implements some keyboard focus behavior. This component should generally have
  * an `onClick` event handler.
  *
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */
 export declare const MenuItem: import("react").ForwardRefExoticComponent<MenuItemProps & import("react").RefAttributes<HTMLLIElement>>;

package/dist/menu/MenuItem.js

@@ -12,7 +12,7 @@ import { useEnsuredId } from "../useEnsuredId.js";
  * implements some keyboard focus behavior. This component should generally have
  * an `onClick` event handler.
  *
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */ export const MenuItem = /*#__PURE__*/ forwardRef(function MenuItem(props, ref) {
     const { id: propId, role = "menuitem", tabIndex: propTabIndex, children, className, ...remaining } = props;
     const id = useEnsuredId(propId, "menuitem");

package/dist/menu/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItem.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\nimport { ListItem, type ListItemProps } from \"../list/ListItem.js\";\nimport { useKeyboardMovementContext } from \"../movement/useKeyboardMovementProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\n\n/**\n * @remarks \\@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 * @remarks \\@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;;AACA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AACnC,SAASC,QAAQ,QAA4B,sBAAsB;AACnE,SAASC,0BAA0B,QAAQ,6CAA6C;AACxF,SAASC,YAAY,QAAQ,qBAAqB;AAiBlD;;;;;;;;CAQC,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 { 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 * @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;;;;;;;;CAQC,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"}

package/dist/menu/MenuItemButton.d.ts

@@ -1,9 +1,8 @@
-/// <reference types="react" />
 import { type BaseMenuButtonProps } from "./MenuButton.js";
 import { type MenuItemProps } from "./MenuItem.js";
 /**
  * @internal
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */
 export interface MenuItemButtonProps extends BaseMenuButtonProps, MenuItemProps {
 }
@@ -14,6 +13,6 @@ export interface MenuItemButtonProps extends BaseMenuButtonProps, MenuItemProps
  * menuitem for a `DropdownMenu` with a conditional dropdown icon.
  *
  * @internal
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */
 export declare const MenuItemButton: import("react").ForwardRefExoticComponent<MenuItemButtonProps & import("react").RefAttributes<HTMLLIElement>>;

package/dist/menu/MenuItemButton.js

@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useEffect } from "react";
 import { useHoverMode } from "../hoverMode/useHoverMode.js";
 import { IconRotator } from "../icon/IconRotator.js";
-import { getIcon } from "../icon/iconConfig.js";
+import { getIcon } from "../icon/config.js";
 import { useUserInteractionMode } from "../interaction/UserInteractionModeProvider.js";
 import { useAppSize } from "../media-queries/AppSizeProvider.js";
 import { useEnsuredId } from "../useEnsuredId.js";
@@ -21,9 +21,9 @@ const noop = ()=>{
  * menuitem for a `DropdownMenu` with a conditional dropdown icon.
  *
  * @internal
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */ export const MenuItemButton = /*#__PURE__*/ forwardRef(function MenuItemButton(props, ref) {
-    const { id: propId, children, onClick = noop, onKeyDown = noop, onMouseEnter = noop, onMouseLeave = noop, rightAddon: propRightAddon, iconRotatorProps, disableDropdownIcon = typeof propRightAddon !== "undefined", ...remaining } = props;
+    const { id: propId, children, height: propHeight, onClick = noop, onKeyDown = noop, onMouseEnter = noop, onMouseLeave = noop, rightAddon: propRightAddon, iconRotatorProps, disableDropdownIcon = typeof propRightAddon !== "undefined", ...remaining } = props;
     const { disabled } = props;
     const id = useEnsuredId(propId, "menuitem");
     const mode = useUserInteractionMode();
@@ -51,9 +51,13 @@ const noop = ()=>{
         menubar,
         setVisible
     ]);
-    const dropdownIcon = getIcon(root ? "dropdown" : "forward");
+    let height = propHeight;
     let rightAddon = propRightAddon;
+    const dropdownIcon = getIcon(root ? "dropdown" : "forward");
     if (!disableDropdownIcon) {
+        if (!height && !props.leftAddon) {
+            height = "normal";
+        }
         rightAddon = /*#__PURE__*/ _jsx(IconRotator, {
             ...iconRotatorProps,
             rotated: visible,

package/dist/menu/MenuItemButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItemButton.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, useEffect } from \"react\";\nimport { useHoverMode } from \"../hoverMode/useHoverMode.js\";\nimport { IconRotator } from \"../icon/IconRotator.js\";\nimport { getIcon } from \"../icon/iconConfig.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 * @remarks \\@since 5.0.0\n */\nexport interface MenuItemButtonProps\n  extends BaseMenuButtonProps,\n    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 * @remarks \\@since 5.0.0\n */\nexport const MenuItemButton = forwardRef<HTMLLIElement, MenuItemButtonProps>(\n  function MenuItemButton(props, ref) {\n    const {\n      id: propId,\n      children,\n      onClick = noop,\n      onKeyDown = noop,\n      onMouseEnter = noop,\n      onMouseLeave = noop,\n      rightAddon: propRightAddon,\n      iconRotatorProps,\n      disableDropdownIcon = typeof 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    const dropdownIcon = getIcon(root ? \"dropdown\" : \"forward\");\n    let rightAddon = propRightAddon;\n    if (!disableDropdownIcon) {\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","onClick","onKeyDown","onMouseEnter","onMouseLeave","rightAddon","propRightAddon","iconRotatorProps","disableDropdownIcon","remaining","disabled","mode","renderAsSheet","isPhone","isSheet","root","menubar","activeId","enableHoverMode","disableHoverMode","startDisableTimer","clearDisableTimer","leaveTimeoutRef","hoverTimeoutRef","visible","setVisible","defaultFocusIndex","startShowFlow","clearVisibilityTimeout","horizontal","dropdownIcon","rotated","updateVisibility","nextVisible","focusIndex","current","aria-haspopup","aria-expanded","undefined","event","stopPropagation","key","preventDefault"],"mappings":"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"}
+{"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,\n    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 = typeof 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","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","undefined","event","stopPropagation","key","preventDefault"],"mappings":"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"}

package/dist/menu/MenuItemCircularProgress.d.ts

@@ -0,0 +1,59 @@
+import { type HTMLAttributes, type ReactNode } 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 {
+    /** @defaultValue `"Loading"` */
+    "aria-label"?: string;
+    /** @defaultValue `"none"` */
+    role?: string;
+    /** @defaultValue `true` */
+    dense?: boolean;
+    liProps?: HTMLAttributes<HTMLLIElement>;
+    height?: ListItemHeight;
+    leftAddon?: ReactNode;
+    rightAddon?: ReactNode;
+    listItemChildrenProps?: ListItemChildrenProps;
+}
+/**
+ * @example Simple Example
+ * ```tsx
+ * "use client";
+ * import {
+ *   DropdownMenu,
+ *   MenuItem,
+ *   MenuItemCircularProgress,
+ *   useAsyncFunction,
+ * } from "@react-md/core";
+ *
+ * function Example() {
+ *   const { handleAsync, pending } = useAsyncFunction();
+ *   const [visible, setVisible] = useState(false);
+ *
+ *   return (
+ *     <DropdownMenu buttonChildren="Options" visible={visible} setVisible={setVisible}>
+ *       {pending && <MenuItemCircularProgress />}
+ *       <MenuItem
+ *         onClick={handleAsync(async (event) => {
+ *           // prevent menu from closing until action completes
+ *           event.stopPropagation()
+ *
+ *           // do something async
+ *           await ...
+ *
+ *           // close menu once completed
+ *           setVisible(false)
+ *         })}
+ *       >
+ *         Some Action
+ *       </MenuItem>
+ *     </DropdownMenu>
+ *   )
+ * }
+ * ```
+ *
+ * @since 6.0.0
+ */
+export declare const MenuItemCircularProgress: import("react").ForwardRefExoticComponent<MenuItemCircularProgressProps & import("react").RefAttributes<HTMLLIElement>>;

package/dist/menu/MenuItemCircularProgress.js

@@ -0,0 +1,73 @@
+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";
+/**
+ * @example Simple Example
+ * ```tsx
+ * "use client";
+ * import {
+ *   DropdownMenu,
+ *   MenuItem,
+ *   MenuItemCircularProgress,
+ *   useAsyncFunction,
+ * } from "@react-md/core";
+ *
+ * function Example() {
+ *   const { handleAsync, pending } = useAsyncFunction();
+ *   const [visible, setVisible] = useState(false);
+ *
+ *   return (
+ *     <DropdownMenu buttonChildren="Options" visible={visible} setVisible={setVisible}>
+ *       {pending && <MenuItemCircularProgress />}
+ *       <MenuItem
+ *         onClick={handleAsync(async (event) => {
+ *           // prevent menu from closing until action completes
+ *           event.stopPropagation()
+ *
+ *           // do something async
+ *           await ...
+ *
+ *           // close menu once completed
+ *           setVisible(false)
+ *         })}
+ *       >
+ *         Some Action
+ *       </MenuItem>
+ *     </DropdownMenu>
+ *   )
+ * }
+ * ```
+ *
+ * @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;
+    let ariaLabel = propAriaLabel;
+    if (!ariaLabel && !ariaLabelledBy) {
+        ariaLabel = "Loading";
+    }
+    return /*#__PURE__*/ _jsx("li", {
+        ...liProps,
+        ref: ref,
+        role: role,
+        className: cnb(listItem({
+            height,
+            className
+        }), liProps?.className),
+        children: /*#__PURE__*/ _jsx(ListItemChildren, {
+            ...listItemChildrenProps,
+            leftAddon: leftAddon,
+            rightAddon: rightAddon,
+            children: /*#__PURE__*/ _jsx(CircularProgress, {
+                "aria-label": ariaLabel,
+                "aria-labelledby": ariaLabelledBy,
+                dense: true,
+                ...remaining
+            })
+        })
+    });
+});
+
+//# sourceMappingURL=MenuItemCircularProgress.js.map

package/dist/menu/MenuItemCircularProgress.js.map

@@ -0,0 +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 {\n *   DropdownMenu,\n *   MenuItem,\n *   MenuItemCircularProgress,\n *   useAsyncFunction,\n * } from \"@react-md/core\";\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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCC,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"}

package/dist/menu/MenuItemGroup.d.ts

@@ -1,7 +1,7 @@
 import { type ReactNode } from "react";
 import { type ListElement, type ListProps } from "../list/List.js";
 import { type LabelRequiredForA11y } from "../types.js";
-/** @remarks \@since 5.0.0 */
+/** @since 5.0.0 */
 export type MenuItemGroupProps = LabelRequiredForA11y<Omit<ListProps, "role">> & {
     children: ReactNode;
 };
@@ -16,8 +16,7 @@ export type MenuItemGroupProps = LabelRequiredForA11y<Omit<ListProps, "role">> &
  *
  * @see {@link https://www.w3.org/TR/wai-aria-1.1/#menuitemradio}
  *
- * @example
- * Simple Example
+ * @example Simple Example
  * ```tsx
  * import { ReactElement, useState } from "react";
  * import {
@@ -70,6 +69,6 @@ export type MenuItemGroupProps = LabelRequiredForA11y<Omit<ListProps, "role">> &
  * }
  * ```
  *
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */
 export declare const MenuItemGroup: import("react").ForwardRefExoticComponent<MenuItemGroupProps & import("react").RefAttributes<ListElement>>;

package/dist/menu/MenuItemGroup.js

@@ -15,8 +15,7 @@ import { useMenuConfiguration } from "./MenuConfigurationProvider.js";
  *
  * @see {@link https://www.w3.org/TR/wai-aria-1.1/#menuitemradio}
  *
- * @example
- * Simple Example
+ * @example Simple Example
  * ```tsx
  * import { ReactElement, useState } from "react";
  * import {
@@ -69,7 +68,7 @@ import { useMenuConfiguration } from "./MenuConfigurationProvider.js";
  * }
  * ```
  *
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */ export const MenuItemGroup = /*#__PURE__*/ forwardRef(function MenuItemGroup({ children, className, ...props }, ref) {
     const { horizontal } = useMenuConfiguration(props);
     return /*#__PURE__*/ _jsx(List, {

package/dist/menu/MenuItemGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItemGroup.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef, type ReactNode } from \"react\";\nimport { List, type ListElement, type ListProps } from \"../list/List.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\n\n/** @remarks \\@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\n * Simple Example\n * ```tsx\n * import { ReactElement, useState } from \"react\";\n * import {\n *   DropdownMenu,\n *   MenuItemGroup,\n *   MenuItemRadio,\n *   MenuItemSeparator,\n *   MenuItemSwitch,\n * } from \"@react-md/core\";\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 * @remarks \\@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;;AACA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAwB,QAAQ;AACnD,SAASC,IAAI,QAA0C,kBAAkB;AAEzE,SAASC,oBAAoB,QAAQ,iCAAiC;AAStE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkEC,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 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 {\n *   DropdownMenu,\n *   MenuItemGroup,\n *   MenuItemRadio,\n *   MenuItemSeparator,\n *   MenuItemSwitch,\n * } from \"@react-md/core\";\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 * @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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiEC,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"}

package/dist/menu/MenuItemSeparator.d.ts

@@ -1,6 +1,6 @@
 import { type HTMLAttributes } from "react";
 import { type DividerProps } from "../divider/Divider.js";
-/** @remarks \@since 5.0.0 */
+/** @since 5.0.0 */
 export interface MenuItemSeparatorProps extends HTMLAttributes<HTMLLIElement>, Pick<DividerProps, "inset" | "vertical"> {
 }
 /**
@@ -10,6 +10,6 @@ export interface MenuItemSeparatorProps extends HTMLAttributes<HTMLLIElement>, P
  * will also automatically render itself vertically instead of horizontally if
  * the menu is rendering horizontally.
  *
- * @remarks \@since 5.0.0 Renders as an `<li>` instead of a `<div>` or `<hr />`.
+ * @since 5.0.0 Renders as an `<li>` instead of a `<div>` or `<hr />`.
  */
 export declare const MenuItemSeparator: import("react").ForwardRefExoticComponent<MenuItemSeparatorProps & import("react").RefAttributes<HTMLLIElement>>;

package/dist/menu/MenuItemSeparator.js

@@ -10,7 +10,7 @@ import { useMenuConfiguration } from "./MenuConfigurationProvider.js";
  * will also automatically render itself vertically instead of horizontally if
  * the menu is rendering horizontally.
  *
- * @remarks \@since 5.0.0 Renders as an `<li>` instead of a `<div>` or `<hr />`.
+ * @since 5.0.0 Renders as an `<li>` instead of a `<div>` or `<hr />`.
  */ export const MenuItemSeparator = /*#__PURE__*/ forwardRef(function MenuItemSeparator(props, ref) {
     const { className, inset, vertical: propVertical, children, ...remaining } = props;
     const horizontal = useMenuConfiguration().horizontal;

package/dist/menu/MenuItemSeparator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuItemSeparator.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport { type DividerProps } from \"../divider/Divider.js\";\nimport { divider } from \"../divider/styles.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\n\n/** @remarks \\@since 5.0.0 */\nexport interface MenuItemSeparatorProps\n  extends HTMLAttributes<HTMLLIElement>,\n    Pick<DividerProps, \"inset\" | \"vertical\"> {}\n\n/**\n * **Client Component**\n *\n * This component renders a `<li role=\"separator\">` with the divider styles. It\n * will also automatically render itself vertically instead of horizontally if\n * the menu is rendering horizontally.\n *\n * @remarks \\@since 5.0.0 Renders as an `<li>` instead of a `<div>` or `<hr />`.\n */\nexport const MenuItemSeparator = forwardRef<\n  HTMLLIElement,\n  MenuItemSeparatorProps\n>(function MenuItemSeparator(props, ref) {\n  const {\n    className,\n    inset,\n    vertical: propVertical,\n    children,\n    ...remaining\n  } = props;\n\n  const horizontal = useMenuConfiguration().horizontal;\n  const vertical = propVertical ?? horizontal;\n\n  return (\n    <li\n      {...remaining}\n      aria-orientation={vertical ? \"vertical\" : undefined}\n      ref={ref}\n      role=\"separator\"\n      className={divider({ inset: inset && !vertical, vertical, className })}\n    >\n      {children}\n    </li>\n  );\n});\n"],"names":["forwardRef","divider","useMenuConfiguration","MenuItemSeparator","props","ref","className","inset","vertical","propVertical","children","remaining","horizontal","li","aria-orientation","undefined","role"],"mappings":"AAAA;;AACA,SAASA,UAAU,QAA6B,QAAQ;AAExD,SAASC,OAAO,QAAQ,uBAAuB;AAC/C,SAASC,oBAAoB,QAAQ,iCAAiC;AAOtE;;;;;;;;CAQC,GACD,OAAO,MAAMC,kCAAoBH,WAG/B,SAASG,kBAAkBC,KAAK,EAAEC,GAAG;IACrC,MAAM,EACJC,SAAS,EACTC,KAAK,EACLC,UAAUC,YAAY,EACtBC,QAAQ,EACR,GAAGC,WACJ,GAAGP;IAEJ,MAAMQ,aAAaV,uBAAuBU,UAAU;IACpD,MAAMJ,WAAWC,gBAAgBG;IAEjC,qBACE,KAACC;QACE,GAAGF,SAAS;QACbG,oBAAkBN,WAAW,aAAaO;QAC1CV,KAAKA;QACLW,MAAK;QACLV,WAAWL,QAAQ;YAAEM,OAAOA,SAAS,CAACC;YAAUA;YAAUF;QAAU;kBAEnEI;;AAGP,GAAG"}
+{"version":3,"sources":["../../src/menu/MenuItemSeparator.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type DividerProps } from \"../divider/Divider.js\";\nimport { divider } from \"../divider/styles.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\n\n/** @since 5.0.0 */\nexport interface MenuItemSeparatorProps\n  extends HTMLAttributes<HTMLLIElement>,\n    Pick<DividerProps, \"inset\" | \"vertical\"> {}\n\n/**\n * **Client Component**\n *\n * This component renders a `<li role=\"separator\">` with the divider styles. It\n * will also automatically render itself vertically instead of horizontally if\n * the menu is rendering horizontally.\n *\n * @since 5.0.0 Renders as an `<li>` instead of a `<div>` or `<hr />`.\n */\nexport const MenuItemSeparator = forwardRef<\n  HTMLLIElement,\n  MenuItemSeparatorProps\n>(function MenuItemSeparator(props, ref) {\n  const {\n    className,\n    inset,\n    vertical: propVertical,\n    children,\n    ...remaining\n  } = props;\n\n  const horizontal = useMenuConfiguration().horizontal;\n  const vertical = propVertical ?? horizontal;\n\n  return (\n    <li\n      {...remaining}\n      aria-orientation={vertical ? \"vertical\" : undefined}\n      ref={ref}\n      role=\"separator\"\n      className={divider({ inset: inset && !vertical, vertical, className })}\n    >\n      {children}\n    </li>\n  );\n});\n"],"names":["forwardRef","divider","useMenuConfiguration","MenuItemSeparator","props","ref","className","inset","vertical","propVertical","children","remaining","horizontal","li","aria-orientation","undefined","role"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAGxD,SAASC,OAAO,QAAQ,uBAAuB;AAC/C,SAASC,oBAAoB,QAAQ,iCAAiC;AAOtE;;;;;;;;CAQC,GACD,OAAO,MAAMC,kCAAoBH,WAG/B,SAASG,kBAAkBC,KAAK,EAAEC,GAAG;IACrC,MAAM,EACJC,SAAS,EACTC,KAAK,EACLC,UAAUC,YAAY,EACtBC,QAAQ,EACR,GAAGC,WACJ,GAAGP;IAEJ,MAAMQ,aAAaV,uBAAuBU,UAAU;IACpD,MAAMJ,WAAWC,gBAAgBG;IAEjC,qBACE,KAACC;QACE,GAAGF,SAAS;QACbG,oBAAkBN,WAAW,aAAaO;QAC1CV,KAAKA;QACLW,MAAK;QACLV,WAAWL,QAAQ;YAAEM,OAAOA,SAAS,CAACC;YAAUA;YAAUF;QAAU;kBAEnEI;;AAGP,GAAG"}

package/dist/menu/MenuSheet.d.ts

@@ -3,11 +3,11 @@ import { type BaseSheetProps } from "../sheet/Sheet.js";
 import { type LabelRequiredForA11y, type PropsWithRef } from "../types.js";
 import { type RenderMenuAsSheet } from "./MenuConfigurationProvider.js";
 /**
- * @remarks \@since 6.0.0
+ * @since 6.0.0
  */
 export type MenuSheetConfigurableProps = Omit<BaseSheetProps, "visible" | "onRequestClose">;
 /**
- * @remarks \@since 6.0.0
+ * @since 6.0.0
  */
 export interface MenuSheetConvenienceProps {
     /**
@@ -45,9 +45,8 @@ export interface MenuSheetConvenienceProps {
 }
 /**
  * @internal
- * @remarks
- * \@since 5.0.0
- * \@since 6.0.0 Updated to use the latest menu API.
+ * @since 5.0.0
+ * @since 6.0.0 Updated to use the latest menu API.
  */
 export interface MenuSheetProps extends BaseSheetProps {
     /** {@inheritDoc MenuConfiguration.sheetHeader} */
@@ -55,7 +54,7 @@ export interface MenuSheetProps extends BaseSheetProps {
     /** {@inheritDoc MenuConfiguration.sheetFooter} */
     footer?: ReactNode;
     children: ReactNode;
-    /** @remarks \@since 6.0.0 */
+    /** @since 6.0.0 */
     enabled: RenderMenuAsSheet;
 }
 /**
@@ -65,9 +64,8 @@ export interface MenuSheetProps extends BaseSheetProps {
  * really be used externally.
  *
  * @internal
- * @remarks
- * \@since 5.0.0
- * \@since 6.0.0 Added the `enabled` prop and does not render a custom `Menu`
+ * @since 5.0.0
+ * @since 6.0.0 Added the `enabled` prop and does not render a custom `Menu`
  * implementation.
  */
 export declare function MenuSheet(props: LabelRequiredForA11y<MenuSheetProps>): ReactElement;

package/dist/menu/MenuSheet.js

@@ -11,9 +11,8 @@ const noop = ()=>{
  * really be used externally.
  *
  * @internal
- * @remarks
- * \@since 5.0.0
- * \@since 6.0.0 Added the `enabled` prop and does not render a custom `Menu`
+ * @since 5.0.0
+ * @since 6.0.0 Added the `enabled` prop and does not render a custom `Menu`
  * implementation.
  */ export function MenuSheet(props) {
     const { header, footer, children, onClick = noop, overlayProps, enabled, ...remaining } = props;

package/dist/menu/MenuSheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuSheet.tsx"],"sourcesContent":["\"use client\";\nimport { type CSSProperties, type ReactElement, type ReactNode } from \"react\";\nimport { Sheet, type BaseSheetProps } from \"../sheet/Sheet.js\";\nimport { type LabelRequiredForA11y, type PropsWithRef } from \"../types.js\";\nimport { type RenderMenuAsSheet } from \"./MenuConfigurationProvider.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type MenuSheetConfigurableProps = Omit<\n  BaseSheetProps,\n  \"visible\" | \"onRequestClose\"\n>;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface MenuSheetConvenienceProps {\n  /**\n   * This can be used to apply additional props to the `Sheet` component when\n   * the `Menu` is being rendered as a `Sheet`.\n   *\n   * Note: You can override the `style` and `className` using\n   * {@link sheetStyle} and {@link sheetClassName} instead for convenience.\n   *\n   * @example\n   * ```tsx\n   * <Menu\n   *   {...props}\n   *   sheetProps={{\n   *     style: {\n   *       // custom inline style\n   *     },\n   *     className: \"come-class-name\",\n   *     horizontalSize: \"touch\",\n   *   }}\n   * />\n   * ```\n   */\n  sheetProps?: PropsWithRef<MenuSheetConfigurableProps, HTMLDivElement>;\n\n  /**\n   * Convenience prop to apply custom style to the `Sheet` component when the\n   * `Menu` is being rendered as a `Sheet`.\n   */\n  sheetStyle?: CSSProperties;\n\n  /**\n   * Convenience prop to apply custom class name to the `Sheet` component when\n   * the `Menu` is being rendered as a `Sheet`.\n   */\n  sheetClassName?: string;\n}\n\n/**\n * @internal\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated to use the latest menu API.\n */\nexport interface MenuSheetProps extends BaseSheetProps {\n  /** {@inheritDoc MenuConfiguration.sheetHeader} */\n  header?: ReactNode;\n  /** {@inheritDoc MenuConfiguration.sheetFooter} */\n  footer?: ReactNode;\n  children: ReactNode;\n\n  /** @remarks \\@since 6.0.0 */\n  enabled: RenderMenuAsSheet;\n}\n\n/**\n * **Client Component**\n *\n * Implements a `Menu` using the `Sheet` component that probably shouldn't\n * really be used externally.\n *\n * @internal\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Added the `enabled` prop and does not render a custom `Menu`\n * implementation.\n */\nexport function MenuSheet(\n  props: LabelRequiredForA11y<MenuSheetProps>\n): ReactElement {\n  const {\n    header,\n    footer,\n    children,\n    onClick = noop,\n    overlayProps,\n    enabled,\n    ...remaining\n  } = props;\n  const { onRequestClose } = props;\n\n  if (!enabled) {\n    return <>{children}</>;\n  }\n\n  return (\n    <Sheet\n      {...remaining}\n      onClick={(event) => {\n        onClick(event);\n\n        // Prevent closing parent sheet/menus if an element in the header or\n        // footer is clicked\n        if (\n          !(event.target instanceof HTMLElement) ||\n          event.target\n            .closest('.rmd-menu,[role=\"dialog\"]')\n            ?.getAttribute(\"role\") === \"dialog\"\n        ) {\n          event.stopPropagation();\n        }\n      }}\n      overlayProps={{\n        ...overlayProps,\n        onClick: (event) => {\n          overlayProps?.onClick?.(event);\n\n          // prevent closing parent menus if the overlay element is clicked.\n          event.stopPropagation();\n          onRequestClose();\n        },\n      }}\n    >\n      {header}\n      {children}\n      {footer}\n    </Sheet>\n  );\n}\n"],"names":["Sheet","noop","MenuSheet","props","header","footer","children","onClick","overlayProps","enabled","remaining","onRequestClose","event","target","HTMLElement","closest","getAttribute","stopPropagation"],"mappings":"AAAA;;AAEA,SAASA,KAAK,QAA6B,oBAAoB;AAI/D,MAAMC,OAAO;AACX,aAAa;AACf;AAmEA;;;;;;;;;;;CAWC,GACD,OAAO,SAASC,UACdC,KAA2C;IAE3C,MAAM,EACJC,MAAM,EACNC,MAAM,EACNC,QAAQ,EACRC,UAAUN,IAAI,EACdO,YAAY,EACZC,OAAO,EACP,GAAGC,WACJ,GAAGP;IACJ,MAAM,EAAEQ,cAAc,EAAE,GAAGR;IAE3B,IAAI,CAACM,SAAS;QACZ,qBAAO;sBAAGH;;IACZ;IAEA,qBACE,MAACN;QACE,GAAGU,SAAS;QACbH,SAAS,CAACK;YACRL,QAAQK;YAER,oEAAoE;YACpE,oBAAoB;YACpB,IACE,CAAEA,CAAAA,MAAMC,MAAM,YAAYC,WAAU,KACpCF,MAAMC,MAAM,CACTE,OAAO,CAAC,8BACPC,aAAa,YAAY,UAC7B;gBACAJ,MAAMK,eAAe;YACvB;QACF;QACAT,cAAc;YACZ,GAAGA,YAAY;YACfD,SAAS,CAACK;gBACRJ,cAAcD,UAAUK;gBAExB,kEAAkE;gBAClEA,MAAMK,eAAe;gBACrBN;YACF;QACF;;YAECP;YACAE;YACAD;;;AAGP"}
+{"version":3,"sources":["../../src/menu/MenuSheet.tsx"],"sourcesContent":["\"use client\";\n\nimport { type CSSProperties, type ReactElement, type ReactNode } from \"react\";\n\nimport { type BaseSheetProps, Sheet } from \"../sheet/Sheet.js\";\nimport { type LabelRequiredForA11y, type PropsWithRef } from \"../types.js\";\nimport { type RenderMenuAsSheet } from \"./MenuConfigurationProvider.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport type MenuSheetConfigurableProps = Omit<\n  BaseSheetProps,\n  \"visible\" | \"onRequestClose\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport interface MenuSheetConvenienceProps {\n  /**\n   * This can be used to apply additional props to the `Sheet` component when\n   * the `Menu` is being rendered as a `Sheet`.\n   *\n   * Note: You can override the `style` and `className` using\n   * {@link sheetStyle} and {@link sheetClassName} instead for convenience.\n   *\n   * @example\n   * ```tsx\n   * <Menu\n   *   {...props}\n   *   sheetProps={{\n   *     style: {\n   *       // custom inline style\n   *     },\n   *     className: \"come-class-name\",\n   *     horizontalSize: \"touch\",\n   *   }}\n   * />\n   * ```\n   */\n  sheetProps?: PropsWithRef<MenuSheetConfigurableProps, HTMLDivElement>;\n\n  /**\n   * Convenience prop to apply custom style to the `Sheet` component when the\n   * `Menu` is being rendered as a `Sheet`.\n   */\n  sheetStyle?: CSSProperties;\n\n  /**\n   * Convenience prop to apply custom class name to the `Sheet` component when\n   * the `Menu` is being rendered as a `Sheet`.\n   */\n  sheetClassName?: string;\n}\n\n/**\n * @internal\n * @since 5.0.0\n * @since 6.0.0 Updated to use the latest menu API.\n */\nexport interface MenuSheetProps extends BaseSheetProps {\n  /** {@inheritDoc MenuConfiguration.sheetHeader} */\n  header?: ReactNode;\n  /** {@inheritDoc MenuConfiguration.sheetFooter} */\n  footer?: ReactNode;\n  children: ReactNode;\n\n  /** @since 6.0.0 */\n  enabled: RenderMenuAsSheet;\n}\n\n/**\n * **Client Component**\n *\n * Implements a `Menu` using the `Sheet` component that probably shouldn't\n * really be used externally.\n *\n * @internal\n * @since 5.0.0\n * @since 6.0.0 Added the `enabled` prop and does not render a custom `Menu`\n * implementation.\n */\nexport function MenuSheet(\n  props: LabelRequiredForA11y<MenuSheetProps>\n): ReactElement {\n  const {\n    header,\n    footer,\n    children,\n    onClick = noop,\n    overlayProps,\n    enabled,\n    ...remaining\n  } = props;\n  const { onRequestClose } = props;\n\n  if (!enabled) {\n    return <>{children}</>;\n  }\n\n  return (\n    <Sheet\n      {...remaining}\n      onClick={(event) => {\n        onClick(event);\n\n        // Prevent closing parent sheet/menus if an element in the header or\n        // footer is clicked\n        if (\n          !(event.target instanceof HTMLElement) ||\n          event.target\n            .closest('.rmd-menu,[role=\"dialog\"]')\n            ?.getAttribute(\"role\") === \"dialog\"\n        ) {\n          event.stopPropagation();\n        }\n      }}\n      overlayProps={{\n        ...overlayProps,\n        onClick: (event) => {\n          overlayProps?.onClick?.(event);\n\n          // prevent closing parent menus if the overlay element is clicked.\n          event.stopPropagation();\n          onRequestClose();\n        },\n      }}\n    >\n      {header}\n      {children}\n      {footer}\n    </Sheet>\n  );\n}\n"],"names":["Sheet","noop","MenuSheet","props","header","footer","children","onClick","overlayProps","enabled","remaining","onRequestClose","event","target","HTMLElement","closest","getAttribute","stopPropagation"],"mappings":"AAAA;;AAIA,SAA8BA,KAAK,QAAQ,oBAAoB;AAI/D,MAAMC,OAAO;AACX,aAAa;AACf;AAkEA;;;;;;;;;;CAUC,GACD,OAAO,SAASC,UACdC,KAA2C;IAE3C,MAAM,EACJC,MAAM,EACNC,MAAM,EACNC,QAAQ,EACRC,UAAUN,IAAI,EACdO,YAAY,EACZC,OAAO,EACP,GAAGC,WACJ,GAAGP;IACJ,MAAM,EAAEQ,cAAc,EAAE,GAAGR;IAE3B,IAAI,CAACM,SAAS;QACZ,qBAAO;sBAAGH;;IACZ;IAEA,qBACE,MAACN;QACE,GAAGU,SAAS;QACbH,SAAS,CAACK;YACRL,QAAQK;YAER,oEAAoE;YACpE,oBAAoB;YACpB,IACE,CAAEA,CAAAA,MAAMC,MAAM,YAAYC,WAAU,KACpCF,MAAMC,MAAM,CACTE,OAAO,CAAC,8BACPC,aAAa,YAAY,UAC7B;gBACAJ,MAAMK,eAAe;YACvB;QACF;QACAT,cAAc;YACZ,GAAGA,YAAY;YACfD,SAAS,CAACK;gBACRJ,cAAcD,UAAUK;gBAExB,kEAAkE;gBAClEA,MAAMK,eAAe;gBACrBN;YACF;QACF;;YAECP;YACAE;YACAD;;;AAGP"}

package/dist/menu/MenuVisibilityProvider.d.ts

@@ -1,9 +1,8 @@
 import { type ReactElement, type ReactNode } from "react";
 import { type NonNullMutableRef, type UseStateObject } from "../types.js";
 /**
- * @remarks
- * \@since 5.0.0
- * \@since 6.0.0 Added the `defaultFocusIndex` ref.
+ * @since 5.0.0
+ * @since 6.0.0 Added the `defaultFocusIndex` ref.
  */
 export interface MenuVisibilityContext extends UseStateObject<"visible", boolean> {
     defaultFocusIndex: NonNullMutableRef<number>;
@@ -12,8 +11,7 @@ export interface MenuVisibilityContext extends UseStateObject<"visible", boolean
  * This hook allows you control the visibility of a parent menu. The main
  * use-case for this hook is adding a custom sheet header/footer.
  *
- * @example
- * Simple Example
+ * @example Simple Example
  * ```tsx
  * function SheetFooter(): ReactElement {
  *   const { setVisible } = useMenuVisibility();
@@ -27,12 +25,12 @@ export interface MenuVisibilityContext extends UseStateObject<"visible", boolean
  * ```
  *
  * @returns the {@link MenuVisibilityContext}
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */
 export declare function useMenuVisibility(): Readonly<MenuVisibilityContext>;
 /**
  * @internal
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */
 export interface MenuVisibilityProviderProps extends MenuVisibilityContext {
     children: ReactNode;
@@ -41,6 +39,6 @@ export interface MenuVisibilityProviderProps extends MenuVisibilityContext {
  * **Client Component**
  *
  * @internal
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */
 export declare function MenuVisibilityProvider({ visible, setVisible, defaultFocusIndex, children, }: MenuVisibilityProviderProps): ReactElement;

package/dist/menu/MenuVisibilityProvider.js

@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext, useContext, useMemo } from "react";
 /**
  * @internal
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */ const context = /*#__PURE__*/ createContext({
     visible: false,
     setVisible () {
@@ -16,14 +16,13 @@ import { createContext, useContext, useMemo } from "react";
 context.displayName = "MenuVisibility";
 /**
  * @internal
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */ const { Provider } = context;
 /**
  * This hook allows you control the visibility of a parent menu. The main
  * use-case for this hook is adding a custom sheet header/footer.
  *
- * @example
- * Simple Example
+ * @example Simple Example
  * ```tsx
  * function SheetFooter(): ReactElement {
  *   const { setVisible } = useMenuVisibility();
@@ -37,7 +36,7 @@ context.displayName = "MenuVisibility";
  * ```
  *
  * @returns the {@link MenuVisibilityContext}
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */ export function useMenuVisibility() {
     return useContext(context);
 }
@@ -45,7 +44,7 @@ context.displayName = "MenuVisibility";
  * **Client Component**
  *
  * @internal
- * @remarks \@since 5.0.0
+ * @since 5.0.0
  */ export function MenuVisibilityProvider({ visible, setVisible, defaultFocusIndex, children }) {
     const value = useMemo(()=>({
             visible,