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

package/dist/menu/MenuItemSeparator.js

@@ -10,6 +10,7 @@ import { useMenuConfiguration } from "./MenuConfigurationProvider.js";
  * will also automatically render itself vertically instead of horizontally if
  * the menu is rendering horizontally.
  *
+ * @see {@link https://next.react-md.dev/components/menu | Menu Demos}
  * @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;

package/dist/menu/MenuItemSeparator.js.map

@@ -1 +1 @@
-{"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"}
+{"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 * @see {@link https://next.react-md.dev/components/menu | Menu Demos}\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;;;;;;;;;CASC,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/MenuWidget.d.ts

@@ -2,18 +2,6 @@ import { type HTMLAttributes } from "react";
 import { type GetDefaultFocusedIndex } from "../movement/types.js";
 import { type NonNullMutableRef } from "../types.js";
 import { type MenuListConvenienceProps } from "./Menu.js";
-/**
- * @since 6.0.0
- */
-export interface MenuClassNameOptions {
-    className?: string;
-    horizontal?: boolean;
-    elevated?: boolean;
-}
-/**
- * @since 6.0.0
- */
-export declare function menu(options?: MenuClassNameOptions): string;
 /**
  * @internal
  */

package/dist/menu/MenuWidget.js

@@ -1,25 +1,14 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { cnb } from "cnbuilder";
 import { forwardRef, useRef, useState } from "react";
 import { List } from "../list/List.js";
 import { useKeyboardMovementProvider } from "../movement/useKeyboardMovementProvider.js";
-import { bem } from "../utils/bem.js";
 import { MenuWidgetKeyboardProvider } from "./MenuWidgetKeyboardProvider.js";
+import { menu } from "./styles.js";
 import { MenuBarProvider, useMenuBarContext, useMenuBarProvider } from "./useMenuBarProvider.js";
-const styles = bem("rmd-menu");
 const noop = ()=>{
 // do nothing
 };
-/**
- * @since 6.0.0
- */ export function menu(options = {}) {
-    const { className, horizontal, elevated } = options;
-    return cnb(styles({
-        horizontal,
-        elevated
-    }), className);
-}
 /**
  * **Client Component**
  *

package/dist/menu/MenuWidget.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/MenuWidget.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { type HTMLAttributes, forwardRef, useRef, useState } from \"react\";\n\nimport { List } from \"../list/List.js\";\nimport { type GetDefaultFocusedIndex } from \"../movement/types.js\";\nimport { useKeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport { type NonNullMutableRef } from \"../types.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { type MenuListConvenienceProps } from \"./Menu.js\";\nimport { MenuWidgetKeyboardProvider } from \"./MenuWidgetKeyboardProvider.js\";\nimport {\n  MenuBarProvider,\n  useMenuBarContext,\n  useMenuBarProvider,\n} from \"./useMenuBarProvider.js\";\n\nconst styles = bem(\"rmd-menu\");\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface MenuClassNameOptions {\n  className?: string;\n  horizontal?: boolean;\n  elevated?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function menu(options: MenuClassNameOptions = {}): string {\n  const { className, horizontal, elevated } = options;\n\n  return cnb(styles({ horizontal, elevated }), className);\n}\n\n/**\n * @internal\n */\nexport interface MenuWidgetProps\n  extends HTMLAttributes<HTMLDivElement>,\n    MenuListConvenienceProps {\n  isSheet: boolean;\n  horizontal: boolean;\n  disableElevation?: boolean;\n  cancelUnmountFocus: NonNullMutableRef<boolean>;\n  getDefaultFocusedIndex?: GetDefaultFocusedIndex;\n}\n\n/**\n * **Client Component**\n *\n * This component was added to support the listbox role and the `useId()` hook.\n * If the `temporary` prop is set, the `MenuItem`'s ids will not be the same the\n * next time the menu opens, so the aria-activedescendant will point to a\n * non-existing id\n *\n * @internal\n */\nexport const MenuWidget = forwardRef<HTMLDivElement, MenuWidgetProps>(\n  function MenuWidget(props, ref) {\n    const {\n      id,\n      role = \"menu\",\n      className,\n      listStyle,\n      listClassName,\n      listProps,\n      children,\n      onClick,\n      onBlur = noop,\n      onFocus = noop,\n      onKeyDown = noop,\n      tabIndex = -1,\n      isSheet,\n      horizontal,\n      disableElevation,\n      cancelUnmountFocus,\n      getDefaultFocusedIndex,\n      ...remaining\n    } = props;\n    const isListbox = role === \"listbox\";\n    const { menubar } = useMenuBarContext();\n\n    // Since there is the possibility of other tab focusable elements within the\n    // sheet and the menu items are programmatically focused, the menu's\n    // tabIndex needs to be set to `-1` while one of the child menu items are\n    // focused. This allows Shift+Tab correctly focuses the previous focusable\n    // element within the sheet. Since `onFocus` and `onBlur` will be bubbled up\n    // to the menu widget each time a new MenuItem is focused, only disable the\n    // focused state if the blur event is fired without another focus event\n    // within an animation frame.\n    const [sheetMenuFocused, setSheetMenuFocused] = useState(false);\n    const sheetBlurredFame = useRef(0);\n    const menuBarContext = useMenuBarProvider({\n      root: false,\n      menubar,\n      hoverTimeout: menubar ? 0 : undefined,\n      defaultActiveId: id,\n    });\n    const { movementProps, movementContext } = useKeyboardMovementProvider({\n      onClick,\n      onFocus(event) {\n        onFocus(event);\n\n        if (!isSheet) {\n          return;\n        }\n\n        window.cancelAnimationFrame(sheetBlurredFame.current);\n        setSheetMenuFocused(true);\n      },\n      onKeyDown,\n      horizontal,\n      loopable: true,\n      searchable: true,\n      programmatic: true,\n      includeDisabled: true,\n      getDefaultFocusedIndex,\n    });\n\n    return (\n      <MenuWidgetKeyboardProvider disabled={isListbox} value={movementContext}>\n        <MenuBarProvider value={menuBarContext}>\n          <div\n            aria-orientation={horizontal ? \"horizontal\" : undefined}\n            {...remaining}\n            {...(isListbox ? { onClick, onFocus, onKeyDown } : movementProps)}\n            id={id}\n            ref={ref}\n            role={role}\n            className={menu({\n              className,\n              elevated: !disableElevation && !isSheet,\n              horizontal,\n            })}\n            tabIndex={isSheet && !sheetMenuFocused ? 0 : tabIndex}\n            onBlur={(event) => {\n              onBlur(event);\n              if (!isSheet) {\n                return;\n              }\n\n              sheetBlurredFame.current = window.requestAnimationFrame(() => {\n                setSheetMenuFocused(false);\n              });\n            }}\n          >\n            <List\n              {...listProps}\n              style={listStyle ?? listProps?.style}\n              className={listClassName || listProps?.className}\n              horizontal={horizontal}\n              onClick={(event) => {\n                listProps?.onClick?.(event);\n\n                // this makes it so you can click on the menu/list without\n                // closing the menu\n                if (event.target === event.currentTarget) {\n                  event.stopPropagation();\n                }\n\n                // This might be a test only workaround since clicking links move focus\n                // somewhere else\n                if (event.target instanceof HTMLElement) {\n                  cancelUnmountFocus.current = event.currentTarget.contains(\n                    event.target.closest(\"a\")\n                  );\n                }\n              }}\n            >\n              {children}\n            </List>\n          </div>\n        </MenuBarProvider>\n      </MenuWidgetKeyboardProvider>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","useRef","useState","List","useKeyboardMovementProvider","bem","MenuWidgetKeyboardProvider","MenuBarProvider","useMenuBarContext","useMenuBarProvider","styles","noop","menu","options","className","horizontal","elevated","MenuWidget","props","ref","id","role","listStyle","listClassName","listProps","children","onClick","onBlur","onFocus","onKeyDown","tabIndex","isSheet","disableElevation","cancelUnmountFocus","getDefaultFocusedIndex","remaining","isListbox","menubar","sheetMenuFocused","setSheetMenuFocused","sheetBlurredFame","menuBarContext","root","hoverTimeout","undefined","defaultActiveId","movementProps","movementContext","event","window","cancelAnimationFrame","current","loopable","searchable","programmatic","includeDisabled","disabled","value","div","aria-orientation","requestAnimationFrame","style","target","currentTarget","stopPropagation","HTMLElement","contains","closest"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAA8BC,UAAU,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAQ;AAE1E,SAASC,IAAI,QAAQ,kBAAkB;AAEvC,SAASC,2BAA2B,QAAQ,6CAA6C;AAEzF,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,SAASC,0BAA0B,QAAQ,kCAAkC;AAC7E,SACEC,eAAe,EACfC,iBAAiB,EACjBC,kBAAkB,QACb,0BAA0B;AAEjC,MAAMC,SAASL,IAAI;AACnB,MAAMM,OAAO;AACX,aAAa;AACf;AAWA;;CAEC,GACD,OAAO,SAASC,KAAKC,UAAgC,CAAC,CAAC;IACrD,MAAM,EAAEC,SAAS,EAAEC,UAAU,EAAEC,QAAQ,EAAE,GAAGH;IAE5C,OAAOd,IAAIW,OAAO;QAAEK;QAAYC;IAAS,IAAIF;AAC/C;AAeA;;;;;;;;;CASC,GACD,OAAO,MAAMG,2BAAajB,WACxB,SAASiB,WAAWC,KAAK,EAAEC,GAAG;IAC5B,MAAM,EACJC,EAAE,EACFC,OAAO,MAAM,EACbP,SAAS,EACTQ,SAAS,EACTC,aAAa,EACbC,SAAS,EACTC,QAAQ,EACRC,OAAO,EACPC,SAAShB,IAAI,EACbiB,UAAUjB,IAAI,EACdkB,YAAYlB,IAAI,EAChBmB,WAAW,CAAC,CAAC,EACbC,OAAO,EACPhB,UAAU,EACViB,gBAAgB,EAChBC,kBAAkB,EAClBC,sBAAsB,EACtB,GAAGC,WACJ,GAAGjB;IACJ,MAAMkB,YAAYf,SAAS;IAC3B,MAAM,EAAEgB,OAAO,EAAE,GAAG7B;IAEpB,4EAA4E;IAC5E,oEAAoE;IACpE,yEAAyE;IACzE,0EAA0E;IAC1E,4EAA4E;IAC5E,2EAA2E;IAC3E,uEAAuE;IACvE,6BAA6B;IAC7B,MAAM,CAAC8B,kBAAkBC,oBAAoB,GAAGrC,SAAS;IACzD,MAAMsC,mBAAmBvC,OAAO;IAChC,MAAMwC,iBAAiBhC,mBAAmB;QACxCiC,MAAM;QACNL;QACAM,cAAcN,UAAU,IAAIO;QAC5BC,iBAAiBzB;IACnB;IACA,MAAM,EAAE0B,aAAa,EAAEC,eAAe,EAAE,GAAG3C,4BAA4B;QACrEsB;QACAE,SAAQoB,KAAK;YACXpB,QAAQoB;YAER,IAAI,CAACjB,SAAS;gBACZ;YACF;YAEAkB,OAAOC,oBAAoB,CAACV,iBAAiBW,OAAO;YACpDZ,oBAAoB;QACtB;QACAV;QACAd;QACAqC,UAAU;QACVC,YAAY;QACZC,cAAc;QACdC,iBAAiB;QACjBrB;IACF;IAEA,qBACE,KAAC5B;QAA2BkD,UAAUpB;QAAWqB,OAAOV;kBACtD,cAAA,KAACxC;YAAgBkD,OAAOhB;sBACtB,cAAA,KAACiB;gBACCC,oBAAkB5C,aAAa,eAAe6B;gBAC7C,GAAGT,SAAS;gBACZ,GAAIC,YAAY;oBAAEV;oBAASE;oBAASC;gBAAU,IAAIiB,aAAa;gBAChE1B,IAAIA;gBACJD,KAAKA;gBACLE,MAAMA;gBACNP,WAAWF,KAAK;oBACdE;oBACAE,UAAU,CAACgB,oBAAoB,CAACD;oBAChChB;gBACF;gBACAe,UAAUC,WAAW,CAACO,mBAAmB,IAAIR;gBAC7CH,QAAQ,CAACqB;oBACPrB,OAAOqB;oBACP,IAAI,CAACjB,SAAS;wBACZ;oBACF;oBAEAS,iBAAiBW,OAAO,GAAGF,OAAOW,qBAAqB,CAAC;wBACtDrB,oBAAoB;oBACtB;gBACF;0BAEA,cAAA,KAACpC;oBACE,GAAGqB,SAAS;oBACbqC,OAAOvC,aAAaE,WAAWqC;oBAC/B/C,WAAWS,iBAAiBC,WAAWV;oBACvCC,YAAYA;oBACZW,SAAS,CAACsB;wBACRxB,WAAWE,UAAUsB;wBAErB,0DAA0D;wBAC1D,mBAAmB;wBACnB,IAAIA,MAAMc,MAAM,KAAKd,MAAMe,aAAa,EAAE;4BACxCf,MAAMgB,eAAe;wBACvB;wBAEA,uEAAuE;wBACvE,iBAAiB;wBACjB,IAAIhB,MAAMc,MAAM,YAAYG,aAAa;4BACvChC,mBAAmBkB,OAAO,GAAGH,MAAMe,aAAa,CAACG,QAAQ,CACvDlB,MAAMc,MAAM,CAACK,OAAO,CAAC;wBAEzB;oBACF;8BAEC1C;;;;;AAMb,GACA"}
+{"version":3,"sources":["../../src/menu/MenuWidget.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef, useRef, useState } from \"react\";\n\nimport { List } from \"../list/List.js\";\nimport { type GetDefaultFocusedIndex } from \"../movement/types.js\";\nimport { useKeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport { type NonNullMutableRef } from \"../types.js\";\nimport { type MenuListConvenienceProps } from \"./Menu.js\";\nimport { MenuWidgetKeyboardProvider } from \"./MenuWidgetKeyboardProvider.js\";\nimport { menu } from \"./styles.js\";\nimport {\n  MenuBarProvider,\n  useMenuBarContext,\n  useMenuBarProvider,\n} from \"./useMenuBarProvider.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @internal\n */\nexport interface MenuWidgetProps\n  extends HTMLAttributes<HTMLDivElement>,\n    MenuListConvenienceProps {\n  isSheet: boolean;\n  horizontal: boolean;\n  disableElevation?: boolean;\n  cancelUnmountFocus: NonNullMutableRef<boolean>;\n  getDefaultFocusedIndex?: GetDefaultFocusedIndex;\n}\n\n/**\n * **Client Component**\n *\n * This component was added to support the listbox role and the `useId()` hook.\n * If the `temporary` prop is set, the `MenuItem`'s ids will not be the same the\n * next time the menu opens, so the aria-activedescendant will point to a\n * non-existing id\n *\n * @internal\n */\nexport const MenuWidget = forwardRef<HTMLDivElement, MenuWidgetProps>(\n  function MenuWidget(props, ref) {\n    const {\n      id,\n      role = \"menu\",\n      className,\n      listStyle,\n      listClassName,\n      listProps,\n      children,\n      onClick,\n      onBlur = noop,\n      onFocus = noop,\n      onKeyDown = noop,\n      tabIndex = -1,\n      isSheet,\n      horizontal,\n      disableElevation,\n      cancelUnmountFocus,\n      getDefaultFocusedIndex,\n      ...remaining\n    } = props;\n    const isListbox = role === \"listbox\";\n    const { menubar } = useMenuBarContext();\n\n    // Since there is the possibility of other tab focusable elements within the\n    // sheet and the menu items are programmatically focused, the menu's\n    // tabIndex needs to be set to `-1` while one of the child menu items are\n    // focused. This allows Shift+Tab correctly focuses the previous focusable\n    // element within the sheet. Since `onFocus` and `onBlur` will be bubbled up\n    // to the menu widget each time a new MenuItem is focused, only disable the\n    // focused state if the blur event is fired without another focus event\n    // within an animation frame.\n    const [sheetMenuFocused, setSheetMenuFocused] = useState(false);\n    const sheetBlurredFame = useRef(0);\n    const menuBarContext = useMenuBarProvider({\n      root: false,\n      menubar,\n      hoverTimeout: menubar ? 0 : undefined,\n      defaultActiveId: id,\n    });\n    const { movementProps, movementContext } = useKeyboardMovementProvider({\n      onClick,\n      onFocus(event) {\n        onFocus(event);\n\n        if (!isSheet) {\n          return;\n        }\n\n        window.cancelAnimationFrame(sheetBlurredFame.current);\n        setSheetMenuFocused(true);\n      },\n      onKeyDown,\n      horizontal,\n      loopable: true,\n      searchable: true,\n      programmatic: true,\n      includeDisabled: true,\n      getDefaultFocusedIndex,\n    });\n\n    return (\n      <MenuWidgetKeyboardProvider disabled={isListbox} value={movementContext}>\n        <MenuBarProvider value={menuBarContext}>\n          <div\n            aria-orientation={horizontal ? \"horizontal\" : undefined}\n            {...remaining}\n            {...(isListbox ? { onClick, onFocus, onKeyDown } : movementProps)}\n            id={id}\n            ref={ref}\n            role={role}\n            className={menu({\n              className,\n              elevated: !disableElevation && !isSheet,\n              horizontal,\n            })}\n            tabIndex={isSheet && !sheetMenuFocused ? 0 : tabIndex}\n            onBlur={(event) => {\n              onBlur(event);\n              if (!isSheet) {\n                return;\n              }\n\n              sheetBlurredFame.current = window.requestAnimationFrame(() => {\n                setSheetMenuFocused(false);\n              });\n            }}\n          >\n            <List\n              {...listProps}\n              style={listStyle ?? listProps?.style}\n              className={listClassName || listProps?.className}\n              horizontal={horizontal}\n              onClick={(event) => {\n                listProps?.onClick?.(event);\n\n                // this makes it so you can click on the menu/list without\n                // closing the menu\n                if (event.target === event.currentTarget) {\n                  event.stopPropagation();\n                }\n\n                // This might be a test only workaround since clicking links move focus\n                // somewhere else\n                if (event.target instanceof HTMLElement) {\n                  cancelUnmountFocus.current = event.currentTarget.contains(\n                    event.target.closest(\"a\")\n                  );\n                }\n              }}\n            >\n              {children}\n            </List>\n          </div>\n        </MenuBarProvider>\n      </MenuWidgetKeyboardProvider>\n    );\n  }\n);\n"],"names":["forwardRef","useRef","useState","List","useKeyboardMovementProvider","MenuWidgetKeyboardProvider","menu","MenuBarProvider","useMenuBarContext","useMenuBarProvider","noop","MenuWidget","props","ref","id","role","className","listStyle","listClassName","listProps","children","onClick","onBlur","onFocus","onKeyDown","tabIndex","isSheet","horizontal","disableElevation","cancelUnmountFocus","getDefaultFocusedIndex","remaining","isListbox","menubar","sheetMenuFocused","setSheetMenuFocused","sheetBlurredFame","menuBarContext","root","hoverTimeout","undefined","defaultActiveId","movementProps","movementContext","event","window","cancelAnimationFrame","current","loopable","searchable","programmatic","includeDisabled","disabled","value","div","aria-orientation","elevated","requestAnimationFrame","style","target","currentTarget","stopPropagation","HTMLElement","contains","closest"],"mappings":"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"}

package/dist/menu/_menu.scss

@@ -1,3 +1,7 @@
+////
+/// @group menu
+////
+
 @use "sass:map";
 @use "../utils";
 @use "../box-shadows";
@@ -5,22 +9,55 @@
 @use "../interaction/interaction";
 @use "../icon/icon";
 
+/// Set to `true` to disable all the styles
+/// @type Boolean
 $disable-everything: false !default;
+
+/// Set to `true` if the `MenuItem` component won't be used for some reason.
+/// @type Boolean
 $disable-menu-item: false !default;
+
+/// Set to `true` to if the `MenuItemGroup` component will not be used.
+/// @type Boolean
 $disable-menu-item-group: false !default;
+
+/// Set to `true` to disable the dark mode elevation colors for the `Menu`.
+/// @type Boolean
 $disable-elevation-colors: theme.$disable-dark-elevation !default;
 
+/// This should be a number between 0-24 representing the box-shadow elevation
+/// of the `Menu`.
+/// @type Number
 $elevation: 8 !default;
+
+/// The default background color to apply to a `Menu`.
+/// @type Color
 $background-color: theme.theme-get-var(surface-color) !default;
+
+/// The default text color to apply to a `Menu`.
+/// @type Color
 $color: theme.theme-get-var(text-primary-color) !default;
 
+/// The default `z-index` for a `Menu.
+/// @type Number
 $z-index: utils.$temporary-element-z-index !default;
+
+/// The min width for a `Menu`.
+/// @type Number
 $min-width: 7rem !default;
 
+/// The `gap` to apply to elements within the `MenuItem`.
+/// @type Number
 $spacing: 1rem !default;
 
+/// The available configurable css variables and mostly used internally for the
+/// `get-var`, `set-var`, and `use-var` utils.
+/// @type List
 $variables: (background-color, color, min-width, spacing);
 
+/// @param {String} name - The supported variable name
+/// @param {any} fallback [null] - An optional fallback value
+/// @returns {String} a `var()` statement
 @function get-var($name, $fallback: null) {
   $var: utils.get-var-name($variables, $name, "menu");
   @if $fallback {
@@ -30,16 +67,27 @@ $variables: (background-color, color, min-width, spacing);
   @return var(#{$var});
 }
 
+/// @param {String} name - The supported variable name
+/// @param {any} value - The value to set the variable to. Supports `null` which
+/// will just be a no-op.
 @mixin set-var($name, $value) {
   @if $value {
     #{utils.get-var-name($variables, $name, "menu")}: #{$value};
   }
 }
 
+/// @param {String} property - The css property to apply the variable to
+/// @param {String} name [$property] - The supported variable name
+/// @param {any} fallback [null] - An optional fallback value if the variable
+/// has not been set
 @mixin use-var($property, $name: $property, $fallback: null) {
   #{$property}: get-var($name, $fallback);
 }
 
+/// Generates the `Menu` component styles.
+///
+/// NOTE: This should only be used if not using the `styles` mixin.
+/// @see {mixin} styles
 @mixin menu-styles {
   .rmd-menu {
     outline: none;
@@ -62,6 +110,10 @@ $variables: (background-color, color, min-width, spacing);
   }
 }
 
+/// Generates the `MenuItem` component styles.
+///
+/// NOTE: This should only be used if not using the `styles` mixin.
+/// @see {mixin} styles
 @mixin menu-item-styles {
   .rmd-menu-item {
     @include icon.set-var(spacing, get-var(spacing));
@@ -84,12 +136,17 @@ $variables: (background-color, color, min-width, spacing);
   }
 }
 
+/// Generates the `MenuItemGroup` component styles.
+///
+/// NOTE: This should only be used if not using the `styles` mixin.
+/// @see {mixin} styles
 @mixin menu-item-group-styles {
   .rmd-menu-item-group {
     padding: 0;
   }
 }
 
+/// Conditionally applies the css variables based on feature flags
 @mixin variables {
   @if not $disable-everything {
     @include set-var(background-color, $background-color);
@@ -99,6 +156,10 @@ $variables: (background-color, color, min-width, spacing);
   }
 }
 
+/// Generates all the styles based on feature flags.
+///
+/// @param {Boolean} disable-layer [false] - Set this to `true` to disable the
+/// layer behavior
 @mixin styles($disable-layer: false) {
   @if not $disable-everything {
     @include utils.optional-layer(menu, $disable-layer) {

package/dist/menu/styles.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @since 6.0.0
+ */
+export interface MenuClassNameOptions {
+    className?: string;
+    horizontal?: boolean;
+    elevated?: boolean;
+}
+/**
+ * @since 6.0.0
+ */
+export declare function menu(options?: MenuClassNameOptions): string;

package/dist/menu/styles.js

@@ -0,0 +1,14 @@
+import { cnb } from "cnbuilder";
+import { bem } from "../utils/bem.js";
+const styles = bem("rmd-menu");
+/**
+ * @since 6.0.0
+ */ export function menu(options = {}) {
+    const { className, horizontal, elevated } = options;
+    return cnb(styles({
+        horizontal,
+        elevated
+    }), className);
+}
+
+//# sourceMappingURL=styles.js.map

package/dist/menu/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/menu/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-menu\");\n\n/**\n * @since 6.0.0\n */\nexport interface MenuClassNameOptions {\n  className?: string;\n  horizontal?: boolean;\n  elevated?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function menu(options: MenuClassNameOptions = {}): string {\n  const { className, horizontal, elevated } = options;\n\n  return cnb(styles({ horizontal, elevated }), className);\n}\n"],"names":["cnb","bem","styles","menu","options","className","horizontal","elevated"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAEhC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAWnB;;CAEC,GACD,OAAO,SAASE,KAAKC,UAAgC,CAAC,CAAC;IACrD,MAAM,EAAEC,SAAS,EAAEC,UAAU,EAAEC,QAAQ,EAAE,GAAGH;IAE5C,OAAOJ,IAAIE,OAAO;QAAEI;QAAYC;IAAS,IAAIF;AAC/C"}

package/dist/menu/useContextMenu.d.ts

@@ -48,7 +48,9 @@ export interface ContextMenuImplementation extends UseStateObject<"visible", boo
  * @example Simple Example
  * ```tsx
  * import type { ReactElement } from "react";
- * import [ Menu, MenuItem, useContextMenu ] from "@react-md/core":
+ * import { Menu } from "@react-md/core/menu/Menu":
+ * import { MenuItem } from "@react-md/core/menu/MenuItem":
+ * import { useContextMenu } from "@react-md/core/menu/useContextMenu":
  *
  * function Example(): ReactElement {
  *   const { menuProps, onContextMenu } = useContextMenu();
@@ -67,6 +69,7 @@ export interface ContextMenuImplementation extends UseStateObject<"visible", boo
  * }
  * ```
  *
+ * @see {@link https://next.react-md.dev/components/menu#context-menu | Menu Demos}
  * @since 5.0.0
  * @since 6.0.0 No longer supports overriding most of the `Menu` props. The
  * props must be passed to the `Menu` component manually.

package/dist/menu/useContextMenu.js

@@ -10,7 +10,9 @@ const noop = ()=>{
  * @example Simple Example
  * ```tsx
  * import type { ReactElement } from "react";
- * import [ Menu, MenuItem, useContextMenu ] from "@react-md/core":
+ * import { Menu } from "@react-md/core/menu/Menu":
+ * import { MenuItem } from "@react-md/core/menu/MenuItem":
+ * import { useContextMenu } from "@react-md/core/menu/useContextMenu":
  *
  * function Example(): ReactElement {
  *   const { menuProps, onContextMenu } = useContextMenu();
@@ -29,6 +31,7 @@ const noop = ()=>{
  * }
  * ```
  *
+ * @see {@link https://next.react-md.dev/components/menu#context-menu | Menu Demos}
  * @since 5.0.0
  * @since 6.0.0 No longer supports overriding most of the `Menu` props. The
  * props must be passed to the `Menu` component manually.

package/dist/menu/useContextMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/menu/useContextMenu.ts"],"sourcesContent":["\"use client\";\n\nimport type { MouseEvent, RefObject } from \"react\";\nimport { useCallback, useRef, useState } from \"react\";\n\nimport { BELOW_INNER_LEFT_ANCHOR } from \"../positioning/constants.js\";\nimport type { InitialCoords, PositionAnchor } from \"../positioning/types.js\";\nimport type { UseStateObject } from \"../types.js\";\n\n/** @since 6.0.0 */\nexport interface ContextMenuProps extends InitialCoords {\n  \"aria-label\": string;\n  anchor: PositionAnchor;\n  fixedTo: RefObject<HTMLElement>;\n  visible: boolean;\n  preventScroll: boolean;\n  onRequestClose: () => void;\n}\n\n/**\n * @since 5.0.0\n * @since 6.0.0  Dropped most options since they are no longer required for the\n * context menu to work. Apply any `Menu` props directly to the `Menu` component\n * instead.\n */\nexport interface ContextMenuHookOptions {\n  /**\n   * @defaultValue `BELOW_INNER_LEFT_ANCHOR`\n   * @see {@link BELOW_INNER_LEFT_ANCHOR}\n   */\n  anchor?: PositionAnchor;\n\n  /**\n   * @defaultValue `\"Context Menu\"`\n   */\n  menuLabel?: string;\n\n  /**\n   * @defaultValue `true`\n   */\n  preventScroll?: boolean;\n  onContextMenu?: <E extends HTMLElement>(event: MouseEvent<E>) => void;\n}\n\n/**\n * @since 5.0.0\n * @since 6.0.0 Renamed from `ContextMenuHookReturnValue` to\n * `ContextMenuImplementation` and dropped the `menuRef` and `menuNodeRef`\n * fields.\n */\nexport interface ContextMenuImplementation\n  extends UseStateObject<\"visible\", boolean> {\n  menuProps: ContextMenuProps;\n  onContextMenu: <E extends HTMLElement>(event: MouseEvent<E>) => void;\n}\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * This hook controls the visibility and positioning for a context menu.\n *\n * @example Simple Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import [ Menu, MenuItem, useContextMenu ] from \"@react-md/core\":\n *\n * function Example(): ReactElement {\n *   const { menuProps, onContextMenu } = useContextMenu();\n *\n *   return (\n *     <>\n *       <textarea onContextMenu={onContextMenu} />\n *       <Menu {...menuProps}>\n *         <MenuItem>Cut</MenuItem>\n *         <MenuItem>Copy</MenuItem>\n *         <MenuItem>Paste</MenuItem>\n *         <MenuItem>Undo</MenuItem>\n *       </Menu>\n *     </>\n *   );\n * }\n * ```\n *\n * @since 5.0.0\n * @since 6.0.0 No longer supports overriding most of the `Menu` props. The\n * props must be passed to the `Menu` component manually.\n */\nexport function useContextMenu(\n  options: ContextMenuHookOptions = {}\n): ContextMenuImplementation {\n  const {\n    anchor = BELOW_INNER_LEFT_ANCHOR,\n    menuLabel = \"Context Menu\",\n    onContextMenu = noop,\n    preventScroll = true,\n  } = options;\n  const [coords, setCoords] = useState<InitialCoords>({});\n  const [visible, setVisible] = useState(false);\n  const fixedTo = useRef<HTMLElement>(null);\n  const onRequestClose = useCallback(() => {\n    setVisible(false);\n  }, []);\n\n  return {\n    visible,\n    setVisible,\n    menuProps: {\n      \"aria-label\": menuLabel,\n      anchor,\n      ...coords,\n      fixedTo,\n      visible,\n      onRequestClose,\n      preventScroll,\n    },\n    onContextMenu(event) {\n      onContextMenu(event);\n      if (event.isPropagationStopped()) {\n        return;\n      }\n\n      event.preventDefault();\n      event.stopPropagation();\n      setCoords({\n        initialX: event.clientX,\n        initialY: event.clientY,\n      });\n      setVisible(true);\n    },\n  };\n}\n"],"names":["useCallback","useRef","useState","BELOW_INNER_LEFT_ANCHOR","noop","useContextMenu","options","anchor","menuLabel","onContextMenu","preventScroll","coords","setCoords","visible","setVisible","fixedTo","onRequestClose","menuProps","event","isPropagationStopped","preventDefault","stopPropagation","initialX","clientX","initialY","clientY"],"mappings":"AAAA;AAGA,SAASA,WAAW,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAQ;AAEtD,SAASC,uBAAuB,QAAQ,8BAA8B;AAmDtE,MAAMC,OAAO;AACX,aAAa;AACf;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BC,GACD,OAAO,SAASC,eACdC,UAAkC,CAAC,CAAC;IAEpC,MAAM,EACJC,SAASJ,uBAAuB,EAChCK,YAAY,cAAc,EAC1BC,gBAAgBL,IAAI,EACpBM,gBAAgB,IAAI,EACrB,GAAGJ;IACJ,MAAM,CAACK,QAAQC,UAAU,GAAGV,SAAwB,CAAC;IACrD,MAAM,CAACW,SAASC,WAAW,GAAGZ,SAAS;IACvC,MAAMa,UAAUd,OAAoB;IACpC,MAAMe,iBAAiBhB,YAAY;QACjCc,WAAW;IACb,GAAG,EAAE;IAEL,OAAO;QACLD;QACAC;QACAG,WAAW;YACT,cAAcT;YACdD;YACA,GAAGI,MAAM;YACTI;YACAF;YACAG;YACAN;QACF;QACAD,eAAcS,KAAK;YACjBT,cAAcS;YACd,IAAIA,MAAMC,oBAAoB,IAAI;gBAChC;YACF;YAEAD,MAAME,cAAc;YACpBF,MAAMG,eAAe;YACrBT,UAAU;gBACRU,UAAUJ,MAAMK,OAAO;gBACvBC,UAAUN,MAAMO,OAAO;YACzB;YACAX,WAAW;QACb;IACF;AACF"}
+{"version":3,"sources":["../../src/menu/useContextMenu.ts"],"sourcesContent":["\"use client\";\n\nimport type { MouseEvent, RefObject } from \"react\";\nimport { useCallback, useRef, useState } from \"react\";\n\nimport { BELOW_INNER_LEFT_ANCHOR } from \"../positioning/constants.js\";\nimport type { InitialCoords, PositionAnchor } from \"../positioning/types.js\";\nimport type { UseStateObject } from \"../types.js\";\n\n/** @since 6.0.0 */\nexport interface ContextMenuProps extends InitialCoords {\n  \"aria-label\": string;\n  anchor: PositionAnchor;\n  fixedTo: RefObject<HTMLElement>;\n  visible: boolean;\n  preventScroll: boolean;\n  onRequestClose: () => void;\n}\n\n/**\n * @since 5.0.0\n * @since 6.0.0  Dropped most options since they are no longer required for the\n * context menu to work. Apply any `Menu` props directly to the `Menu` component\n * instead.\n */\nexport interface ContextMenuHookOptions {\n  /**\n   * @defaultValue `BELOW_INNER_LEFT_ANCHOR`\n   * @see {@link BELOW_INNER_LEFT_ANCHOR}\n   */\n  anchor?: PositionAnchor;\n\n  /**\n   * @defaultValue `\"Context Menu\"`\n   */\n  menuLabel?: string;\n\n  /**\n   * @defaultValue `true`\n   */\n  preventScroll?: boolean;\n  onContextMenu?: <E extends HTMLElement>(event: MouseEvent<E>) => void;\n}\n\n/**\n * @since 5.0.0\n * @since 6.0.0 Renamed from `ContextMenuHookReturnValue` to\n * `ContextMenuImplementation` and dropped the `menuRef` and `menuNodeRef`\n * fields.\n */\nexport interface ContextMenuImplementation\n  extends UseStateObject<\"visible\", boolean> {\n  menuProps: ContextMenuProps;\n  onContextMenu: <E extends HTMLElement>(event: MouseEvent<E>) => void;\n}\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * This hook controls the visibility and positioning for a context menu.\n *\n * @example Simple Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { Menu } from \"@react-md/core/menu/Menu\":\n * import { MenuItem } from \"@react-md/core/menu/MenuItem\":\n * import { useContextMenu } from \"@react-md/core/menu/useContextMenu\":\n *\n * function Example(): ReactElement {\n *   const { menuProps, onContextMenu } = useContextMenu();\n *\n *   return (\n *     <>\n *       <textarea onContextMenu={onContextMenu} />\n *       <Menu {...menuProps}>\n *         <MenuItem>Cut</MenuItem>\n *         <MenuItem>Copy</MenuItem>\n *         <MenuItem>Paste</MenuItem>\n *         <MenuItem>Undo</MenuItem>\n *       </Menu>\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/menu#context-menu | Menu Demos}\n * @since 5.0.0\n * @since 6.0.0 No longer supports overriding most of the `Menu` props. The\n * props must be passed to the `Menu` component manually.\n */\nexport function useContextMenu(\n  options: ContextMenuHookOptions = {}\n): ContextMenuImplementation {\n  const {\n    anchor = BELOW_INNER_LEFT_ANCHOR,\n    menuLabel = \"Context Menu\",\n    onContextMenu = noop,\n    preventScroll = true,\n  } = options;\n  const [coords, setCoords] = useState<InitialCoords>({});\n  const [visible, setVisible] = useState(false);\n  const fixedTo = useRef<HTMLElement>(null);\n  const onRequestClose = useCallback(() => {\n    setVisible(false);\n  }, []);\n\n  return {\n    visible,\n    setVisible,\n    menuProps: {\n      \"aria-label\": menuLabel,\n      anchor,\n      ...coords,\n      fixedTo,\n      visible,\n      onRequestClose,\n      preventScroll,\n    },\n    onContextMenu(event) {\n      onContextMenu(event);\n      if (event.isPropagationStopped()) {\n        return;\n      }\n\n      event.preventDefault();\n      event.stopPropagation();\n      setCoords({\n        initialX: event.clientX,\n        initialY: event.clientY,\n      });\n      setVisible(true);\n    },\n  };\n}\n"],"names":["useCallback","useRef","useState","BELOW_INNER_LEFT_ANCHOR","noop","useContextMenu","options","anchor","menuLabel","onContextMenu","preventScroll","coords","setCoords","visible","setVisible","fixedTo","onRequestClose","menuProps","event","isPropagationStopped","preventDefault","stopPropagation","initialX","clientX","initialY","clientY"],"mappings":"AAAA;AAGA,SAASA,WAAW,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAQ;AAEtD,SAASC,uBAAuB,QAAQ,8BAA8B;AAmDtE,MAAMC,OAAO;AACX,aAAa;AACf;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BC,GACD,OAAO,SAASC,eACdC,UAAkC,CAAC,CAAC;IAEpC,MAAM,EACJC,SAASJ,uBAAuB,EAChCK,YAAY,cAAc,EAC1BC,gBAAgBL,IAAI,EACpBM,gBAAgB,IAAI,EACrB,GAAGJ;IACJ,MAAM,CAACK,QAAQC,UAAU,GAAGV,SAAwB,CAAC;IACrD,MAAM,CAACW,SAASC,WAAW,GAAGZ,SAAS;IACvC,MAAMa,UAAUd,OAAoB;IACpC,MAAMe,iBAAiBhB,YAAY;QACjCc,WAAW;IACb,GAAG,EAAE;IAEL,OAAO;QACLD;QACAC;QACAG,WAAW;YACT,cAAcT;YACdD;YACA,GAAGI,MAAM;YACTI;YACAF;YACAG;YACAN;QACF;QACAD,eAAcS,KAAK;YACjBT,cAAcS;YACd,IAAIA,MAAMC,oBAAoB,IAAI;gBAChC;YACF;YAEAD,MAAME,cAAc;YACpBF,MAAMG,eAAe;YACrBT,UAAU;gBACRU,UAAUJ,MAAMK,OAAO;gBACvBC,UAAUN,MAAMO,OAAO;YACzB;YACAX,WAAW;QACb;IACF;AACF"}

package/dist/movement/useKeyboardMovementProvider.d.ts

@@ -14,7 +14,7 @@ export declare function useKeyboardMovementContext(): Readonly<KeyboardMovementC
  * import {
  *   KeyboardMovementProvider,
  *   useKeyboardMovementProvider,
- * } from "@react-md/core";
+ * } from "@react-md/core/movement/useKeyboardMovementProvider";
  * import type { ReactElement, ReactNode } from "react";
  *
  * function Example({ children }: { children: ReactNode }): ReactElement {
@@ -38,7 +38,7 @@ export declare function useKeyboardMovementContext(): Readonly<KeyboardMovementC
  *   KeyboardMovementProvider,
  *   useKeyboardMovementContext,
  *   useKeyboardMovementProvider,
- * } from "@react-md/core";
+ * } from "@react-md/core/movement/useKeyboardMovementProvider";
  * import type { ReactElement, ReactNode } from "react";
  * import { useId } from "react";
  *
@@ -84,7 +84,7 @@ export declare function useKeyboardMovementContext(): Readonly<KeyboardMovementC
  *   KeyboardMovementProvider,
  *   useKeyboardMovementContext,
  *   useKeyboardMovementProvider,
- * } from "@react-md/core";
+ * } from "@react-md/core/movement/useKeyboardMovementProvider";
  * import type { ReactElement, ReactNode } from "react";
  * import { useId } from "react";
  *

package/dist/movement/useKeyboardMovementProvider.js

@@ -42,7 +42,7 @@ const returnNegative1 = ()=>-1;
  * import {
  *   KeyboardMovementProvider,
  *   useKeyboardMovementProvider,
- * } from "@react-md/core";
+ * } from "@react-md/core/movement/useKeyboardMovementProvider";
  * import type { ReactElement, ReactNode } from "react";
  *
  * function Example({ children }: { children: ReactNode }): ReactElement {
@@ -66,7 +66,7 @@ const returnNegative1 = ()=>-1;
  *   KeyboardMovementProvider,
  *   useKeyboardMovementContext,
  *   useKeyboardMovementProvider,
- * } from "@react-md/core";
+ * } from "@react-md/core/movement/useKeyboardMovementProvider";
  * import type { ReactElement, ReactNode } from "react";
  * import { useId } from "react";
  *
@@ -112,7 +112,7 @@ const returnNegative1 = ()=>-1;
  *   KeyboardMovementProvider,
  *   useKeyboardMovementContext,
  *   useKeyboardMovementProvider,
- * } from "@react-md/core";
+ * } from "@react-md/core/movement/useKeyboardMovementProvider";
  * import type { ReactElement, ReactNode } from "react";
  * import { useId } from "react";
  *

package/dist/movement/useKeyboardMovementProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/movement/useKeyboardMovementProvider.ts"],"sourcesContent":["\"use client\";\n\nimport {\n  createContext,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { getFocusableElements as defaultGetFocusableElements } from \"../focus/utils.js\";\nimport { useUserInteractionMode } from \"../interaction/UserInteractionModeProvider.js\";\nimport { useDir } from \"../typography/WritingDirectionProvider.js\";\nimport { useIsomorphicLayoutEffect } from \"../useIsomorphicLayoutEffect.js\";\nimport {\n  DEFAULT_KEYBOARD_MOVEMENT,\n  DEFAULT_LTR_KEYBOARD_MOVEMENT,\n  DEFAULT_RTL_KEYBOARD_MOVEMENT,\n} from \"./constants.js\";\nimport { findMatchIndex } from \"./findMatchIndex.js\";\nimport type {\n  KeyboardMovementConfig,\n  KeyboardMovementConfiguration,\n  KeyboardMovementContext,\n  KeyboardMovementProviderImplementation,\n  KeyboardMovementProviderOptions,\n} from \"./types.js\";\nimport {\n  getFirstFocusableIndex,\n  getLastFocusableIndex,\n  getNextFocusableIndex,\n  getSearchText,\n  getVirtualFocusDefaultIndex,\n  isElementDisabled,\n  isNotFocusable,\n  isSearchableEvent,\n  recalculateFocusIndex,\n} from \"./utils.js\";\n\n/**\n * @since 5.0.0\n * @internal\n */\nconst context = createContext<KeyboardMovementContext>({\n  config: { current: DEFAULT_KEYBOARD_MOVEMENT },\n  loopable: false,\n  searchable: false,\n  horizontal: false,\n  includeDisabled: false,\n  tabIndexBehavior: undefined,\n  activeDescendantId: \"\",\n});\ncontext.displayName = \"KeyboardMovement\";\nexport const { Provider: KeyboardMovementProvider } = context;\n\n/**\n * @since 5.0.0\n * @internal\n */\nexport function useKeyboardMovementContext(): Readonly<KeyboardMovementContext> {\n  return useContext(context);\n}\n\nconst noop = (): void => {\n  // do nothing\n};\n\nconst returnNegative1 = (): number => -1;\n\n/**\n * Implements the custom keyboard movement behavior throughout react-md. Using\n * the \"Find References\" will be the best way to see example usage.\n *\n * @example Default Keyboard Movement for any Focusable Element\n * ```tsx\n * import {\n *   KeyboardMovementProvider,\n *   useKeyboardMovementProvider,\n * } from \"@react-md/core\";\n * import type { ReactElement, ReactNode } from \"react\";\n *\n * function Example({ children }: { children: ReactNode }): ReactElement {\n *   const { movementContext, movementProps } = useKeyboardMovementProvider();\n *\n *   // any focusable element child can be focused with the arrow , home, and\n *   // end keys\n *   return (\n *     <KeyboardMovementProvider value={movementContext}>\n *       <div {...movementProps}>\n *         {children}\n *       </div>\n *     </KeyboardMovementProvider>\n *   );\n * }\n * ```\n *\n * @example Active Descendant Movement\n * ```tsx\n * import {\n *   KeyboardMovementProvider,\n *   useKeyboardMovementContext,\n *   useKeyboardMovementProvider,\n * } from \"@react-md/core\";\n * import type { ReactElement, ReactNode } from \"react\";\n * import { useId } from \"react\";\n *\n * function Child(): ReactElement {\n *   const id = useId()\n *   const { activeDescendantId } = useKeyboardMovementContext();\n *\n *   return (\n *     <div\n *       {...props}\n *       id={id}\n *       className={cnb(id === activeDescendantId && \"focused-class-name\")}\n *     >\n *       Some Content\n *     </div>\n *   );\n * }\n *\n * function Example({ children }: { children: ReactNode }): ReactElement {\n *   const { movementContext, movementProps } = useKeyboardMovementProvider({\n *     loopable: true,\n *     searchable: true,\n *     tabIndexBehavior: \"virtual\",\n *   });\n *\n *   // any focusable element child can be focused with the arrow , home, and\n *   // end keys\n *   return (\n *     <KeyboardMovementProvider value={movementContext}>\n *       <div {...movementProps}>\n *         <Child />\n *         <Child />\n *         <Child />\n *       </div>\n *     </KeyboardMovementProvider>\n *   );\n * }\n * ```\n *\n * @example Roving Tab Index\n * ```tsx\n * import {\n *   KeyboardMovementProvider,\n *   useKeyboardMovementContext,\n *   useKeyboardMovementProvider,\n * } from \"@react-md/core\";\n * import type { ReactElement, ReactNode } from \"react\";\n * import { useId } from \"react\";\n *\n * function Child(): ReactElement {\n *   const id = useId()\n *   const { activeDescendantId } = useKeyboardMovementContext();\n *\n *   return (\n *     <div\n *       {...props}\n *       id={id}\n *       tabIndex={id === activeDescendantId ? 0 : -1}\n *     >\n *       Some Content\n *     </div>\n *   );\n * }\n *\n * function Example({ children }: { children: ReactNode }): ReactElement {\n *   const { movementContext, movementProps } = useKeyboardMovementProvider({\n *     loopable: true,\n *     searchable: true,\n *     tabIndexBehavior: \"roving\",\n *   });\n *\n *   // any focusable element child can be focused with the arrow , home, and\n *   // end keys\n *   return (\n *     <KeyboardMovementProvider value={movementContext}>\n *       <div {...movementProps}>\n *         <Child />\n *         <Child />\n *         <Child />\n *       </div>\n *     </KeyboardMovementProvider>\n *   );\n * }\n * ```\n * @since 6.0.0\n * @internal\n */\nexport function useKeyboardMovementProvider<E extends HTMLElement>(\n  options: KeyboardMovementProviderOptions<E> = {}\n): KeyboardMovementProviderImplementation<E> {\n  const {\n    onClick = noop,\n    onFocus = noop,\n    onKeyDown = noop,\n    loopable = false,\n    disabled,\n    searchable = false,\n    horizontal = false,\n    includeDisabled = false,\n    tabIndexBehavior,\n    extendKeyDown = noop,\n    onFocusChange = noop,\n    programmatic = includeDisabled,\n    incrementKeys: propIncrementKeys,\n    decrementKeys: propDecrementKeys,\n    jumpToFirstKeys: propJumpToFirstKeys,\n    jumpToLastKeys: propJumpToLastKeys,\n    getFocusableElements = defaultGetFocusableElements,\n    getDefaultFocusedIndex = returnNegative1,\n    isNegativeOneAllowed = false,\n  } = options;\n\n  const isRTL = useDir().dir === \"rtl\";\n  let defaults: Readonly<Required<KeyboardMovementConfiguration>>;\n  if (horizontal) {\n    defaults = isRTL\n      ? DEFAULT_RTL_KEYBOARD_MOVEMENT\n      : DEFAULT_LTR_KEYBOARD_MOVEMENT;\n  } else {\n    defaults = DEFAULT_KEYBOARD_MOVEMENT;\n  }\n\n  const incrementKeys = propIncrementKeys || defaults.incrementKeys;\n  const decrementKeys = propDecrementKeys || defaults.decrementKeys;\n  const jumpToFirstKeys = propJumpToFirstKeys || defaults.jumpToFirstKeys;\n  const jumpToLastKeys = propJumpToLastKeys || defaults.jumpToLastKeys;\n\n  const configuration: KeyboardMovementConfig = {\n    incrementKeys,\n    decrementKeys,\n    jumpToFirstKeys,\n    jumpToLastKeys,\n  };\n  const config = useRef(configuration);\n  useIsomorphicLayoutEffect(() => {\n    config.current = configuration;\n  });\n\n  const [activeDescendantId, setActiveDescendantId] = useState(\"\");\n  const movementContext = useMemo<KeyboardMovementContext>(\n    () => ({\n      config,\n      loopable,\n      searchable,\n      horizontal,\n      includeDisabled,\n      tabIndexBehavior,\n      activeDescendantId,\n    }),\n    [\n      activeDescendantId,\n      horizontal,\n      includeDisabled,\n      loopable,\n      searchable,\n      tabIndexBehavior,\n    ]\n  );\n  const currentFocusIndex = useRef(-1);\n  const mode = useUserInteractionMode();\n  const refocus = useRef(false);\n\n  if (process.env.NODE_ENV !== \"production\") {\n    // this fixes issues during hot reloading and using the `useId()` hook\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    useEffect(() => {\n      return () => {\n        setActiveDescendantId(\"\");\n      };\n    }, []);\n  }\n\n  let tabIndex: number | undefined;\n  if (tabIndexBehavior) {\n    tabIndex =\n      disabled || (tabIndexBehavior === \"roving\" && activeDescendantId)\n        ? -1\n        : 0;\n  }\n\n  return {\n    movementProps: {\n      \"aria-activedescendant\":\n        tabIndexBehavior === \"virtual\" ? activeDescendantId : undefined,\n      tabIndex,\n\n      // Note: This used to be on the `onFocus` event, but this causes issues in\n      // Chromium browsers for drag and drop behavior\n      onClick(event) {\n        onClick(event);\n        if (disabled) {\n          return;\n        }\n\n        // This makes it so you can click an element with a mouse and then\n        // keyboard navigate from that element instead of the last keyboard focus\n        // element\n        const { currentTarget, target } = event;\n        if (target === currentTarget || !(target instanceof HTMLElement)) {\n          return;\n        }\n\n        const focusables = getFocusableElements(currentTarget, programmatic);\n        const focusedIndex = focusables.findIndex(\n          (element) => element === target || element.contains(target)\n        );\n        if (focusedIndex === -1 || !focusables.length) {\n          return;\n        }\n\n        currentFocusIndex.current = focusedIndex;\n        const focused = focusables[focusedIndex];\n        if (tabIndexBehavior) {\n          setActiveDescendantId(focused.id);\n        }\n\n        // need to force focus back to the container element when using\n        // aria activedescendant\n        if (tabIndexBehavior === \"virtual\") {\n          refocus.current = true;\n          currentTarget.focus();\n        }\n\n        onFocusChange({\n          index: focusedIndex,\n          element: focused,\n        });\n      },\n      onFocus(event) {\n        onFocus(event);\n        if (event.isPropagationStopped() || refocus.current) {\n          refocus.current = false;\n          return;\n        }\n\n        if (\n          (mode !== \"keyboard\" && tabIndexBehavior !== \"virtual\") ||\n          event.target !== event.currentTarget\n        ) {\n          return;\n        }\n\n        const focusables = getFocusableElements(\n          event.currentTarget,\n          programmatic\n        );\n        if (!focusables.length) {\n          return;\n        }\n\n        let defaultFocusIndex = getDefaultFocusedIndex({\n          focusables,\n          includeDisabled,\n        });\n\n        // This allows my custom `getDefaultFocusedIndex` implementations to\n        // have a nice fallback without having to re-implement the \"focus\n        // first\" behavior\n        if (!isNegativeOneAllowed && defaultFocusIndex === -1) {\n          if (tabIndexBehavior === \"virtual\") {\n            // virtual keyboard navigation **must** always focus at least one element\n            defaultFocusIndex = getVirtualFocusDefaultIndex({\n              focusables,\n              includeDisabled,\n              activeDescendantId,\n            });\n          } else {\n            defaultFocusIndex = getFirstFocusableIndex({\n              focusables,\n              includeDisabled,\n            });\n          }\n        }\n\n        if (defaultFocusIndex === -1) {\n          return;\n        }\n\n        currentFocusIndex.current = defaultFocusIndex;\n        const focused = focusables[defaultFocusIndex];\n        if (tabIndexBehavior) {\n          setActiveDescendantId(focused.id);\n        }\n\n        if (tabIndexBehavior !== \"virtual\") {\n          focused.focus();\n        } else {\n          focused.scrollIntoView({ block: \"nearest\" });\n        }\n\n        onFocusChange({\n          index: defaultFocusIndex,\n          element: focused,\n        });\n      },\n      onKeyDown(event) {\n        onKeyDown(event);\n        if (disabled) {\n          return;\n        }\n\n        const { currentTarget } = event;\n\n        const setFocusIndex = (\n          index: number,\n          focusables: readonly HTMLElement[]\n        ): void => {\n          event.preventDefault();\n          event.stopPropagation();\n          if (currentFocusIndex.current === index || index === -1) {\n            return;\n          }\n\n          currentFocusIndex.current = index;\n          const focused = focusables[index];\n          if (tabIndexBehavior) {\n            focused.scrollIntoView({\n              block: \"nearest\",\n              inline: \"nearest\",\n            });\n            setActiveDescendantId(focused.id);\n          }\n\n          if (tabIndexBehavior !== \"virtual\") {\n            focused.focus();\n          }\n\n          onFocusChange({\n            index,\n            element: focused,\n          });\n        };\n\n        extendKeyDown({\n          event,\n          setFocusIndex,\n          currentFocusIndex,\n          setActiveDescendantId,\n          ...movementContext,\n        });\n\n        if (event.isPropagationStopped()) {\n          return;\n        }\n\n        // TODO: Figure this part out. This is currently required for the tree\n        // movement when the asterisk key is pressed. There might be other cases\n        // as well.\n        if (!isNegativeOneAllowed && currentFocusIndex.current === -1) {\n          currentFocusIndex.current = recalculateFocusIndex({\n            focusables: getFocusableElements(currentTarget, programmatic),\n            includeDisabled,\n            tabIndexBehavior,\n            activeDescendantId,\n          });\n        }\n\n        const { key, shiftKey } = event;\n        if (\n          tabIndexBehavior === \"virtual\" &&\n          activeDescendantId &&\n          (key === \" \" || key === \"Enter\")\n        ) {\n          if (key === \" \") {\n            event.preventDefault();\n          }\n\n          const focusables = getFocusableElements(currentTarget, programmatic);\n          const activeElement = focusables[currentFocusIndex.current];\n          if (!activeElement || isElementDisabled(activeElement)) {\n            return;\n          }\n\n          activeElement.click();\n          return;\n        }\n\n        const {\n          incrementKeys,\n          decrementKeys,\n          jumpToFirstKeys,\n          jumpToLastKeys,\n        } = config.current;\n\n        if (searchable && isSearchableEvent(event)) {\n          const focusables = getFocusableElements(currentTarget, programmatic);\n          const index = findMatchIndex({\n            value: key,\n            values: focusables.map((element) =>\n              getSearchText(element, !isNotFocusable(element, includeDisabled))\n            ),\n            startIndex: shiftKey ? -1 : currentFocusIndex.current,\n          });\n          setFocusIndex(index, focusables);\n          return;\n        }\n\n        const jumpToFirst = jumpToFirstKeys.includes(key);\n        const jumpToLast = !jumpToFirst && jumpToLastKeys.includes(key);\n        const increment =\n          !jumpToFirst && !jumpToLast && incrementKeys.includes(key);\n        const decrement =\n          !jumpToFirst &&\n          !jumpToLast &&\n          !increment &&\n          decrementKeys.includes(key);\n\n        if (!jumpToFirst && !jumpToLast && !increment && !decrement) {\n          return;\n        }\n        const focusables = getFocusableElements(currentTarget, programmatic);\n\n        let index: number;\n        if (jumpToFirst) {\n          index = getFirstFocusableIndex({\n            focusables,\n            includeDisabled,\n          });\n        } else if (jumpToLast) {\n          index = getLastFocusableIndex({\n            focusables,\n            includeDisabled,\n          });\n        } else {\n          index = getNextFocusableIndex({\n            loopable,\n            increment,\n            focusables,\n            includeDisabled,\n            currentFocusIndex: currentFocusIndex.current,\n          });\n        }\n\n        setFocusIndex(index, focusables);\n      },\n    },\n    movementContext,\n    currentFocusIndex,\n    activeDescendantId,\n    setActiveDescendantId,\n  };\n}\n"],"names":["createContext","useContext","useEffect","useMemo","useRef","useState","getFocusableElements","defaultGetFocusableElements","useUserInteractionMode","useDir","useIsomorphicLayoutEffect","DEFAULT_KEYBOARD_MOVEMENT","DEFAULT_LTR_KEYBOARD_MOVEMENT","DEFAULT_RTL_KEYBOARD_MOVEMENT","findMatchIndex","getFirstFocusableIndex","getLastFocusableIndex","getNextFocusableIndex","getSearchText","getVirtualFocusDefaultIndex","isElementDisabled","isNotFocusable","isSearchableEvent","recalculateFocusIndex","context","config","current","loopable","searchable","horizontal","includeDisabled","tabIndexBehavior","undefined","activeDescendantId","displayName","Provider","KeyboardMovementProvider","useKeyboardMovementContext","noop","returnNegative1","useKeyboardMovementProvider","options","onClick","onFocus","onKeyDown","disabled","extendKeyDown","onFocusChange","programmatic","incrementKeys","propIncrementKeys","decrementKeys","propDecrementKeys","jumpToFirstKeys","propJumpToFirstKeys","jumpToLastKeys","propJumpToLastKeys","getDefaultFocusedIndex","isNegativeOneAllowed","isRTL","dir","defaults","configuration","setActiveDescendantId","movementContext","currentFocusIndex","mode","refocus","process","env","NODE_ENV","tabIndex","movementProps","event","currentTarget","target","HTMLElement","focusables","focusedIndex","findIndex","element","contains","length","focused","id","focus","index","isPropagationStopped","defaultFocusIndex","scrollIntoView","block","setFocusIndex","preventDefault","stopPropagation","inline","key","shiftKey","activeElement","click","value","values","map","startIndex","jumpToFirst","includes","jumpToLast","increment","decrement"],"mappings":"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"}
+{"version":3,"sources":["../../src/movement/useKeyboardMovementProvider.ts"],"sourcesContent":["\"use client\";\n\nimport {\n  createContext,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { getFocusableElements as defaultGetFocusableElements } from \"../focus/utils.js\";\nimport { useUserInteractionMode } from \"../interaction/UserInteractionModeProvider.js\";\nimport { useDir } from \"../typography/WritingDirectionProvider.js\";\nimport { useIsomorphicLayoutEffect } from \"../useIsomorphicLayoutEffect.js\";\nimport {\n  DEFAULT_KEYBOARD_MOVEMENT,\n  DEFAULT_LTR_KEYBOARD_MOVEMENT,\n  DEFAULT_RTL_KEYBOARD_MOVEMENT,\n} from \"./constants.js\";\nimport { findMatchIndex } from \"./findMatchIndex.js\";\nimport type {\n  KeyboardMovementConfig,\n  KeyboardMovementConfiguration,\n  KeyboardMovementContext,\n  KeyboardMovementProviderImplementation,\n  KeyboardMovementProviderOptions,\n} from \"./types.js\";\nimport {\n  getFirstFocusableIndex,\n  getLastFocusableIndex,\n  getNextFocusableIndex,\n  getSearchText,\n  getVirtualFocusDefaultIndex,\n  isElementDisabled,\n  isNotFocusable,\n  isSearchableEvent,\n  recalculateFocusIndex,\n} from \"./utils.js\";\n\n/**\n * @since 5.0.0\n * @internal\n */\nconst context = createContext<KeyboardMovementContext>({\n  config: { current: DEFAULT_KEYBOARD_MOVEMENT },\n  loopable: false,\n  searchable: false,\n  horizontal: false,\n  includeDisabled: false,\n  tabIndexBehavior: undefined,\n  activeDescendantId: \"\",\n});\ncontext.displayName = \"KeyboardMovement\";\nexport const { Provider: KeyboardMovementProvider } = context;\n\n/**\n * @since 5.0.0\n * @internal\n */\nexport function useKeyboardMovementContext(): Readonly<KeyboardMovementContext> {\n  return useContext(context);\n}\n\nconst noop = (): void => {\n  // do nothing\n};\n\nconst returnNegative1 = (): number => -1;\n\n/**\n * Implements the custom keyboard movement behavior throughout react-md. Using\n * the \"Find References\" will be the best way to see example usage.\n *\n * @example Default Keyboard Movement for any Focusable Element\n * ```tsx\n * import {\n *   KeyboardMovementProvider,\n *   useKeyboardMovementProvider,\n * } from \"@react-md/core/movement/useKeyboardMovementProvider\";\n * import type { ReactElement, ReactNode } from \"react\";\n *\n * function Example({ children }: { children: ReactNode }): ReactElement {\n *   const { movementContext, movementProps } = useKeyboardMovementProvider();\n *\n *   // any focusable element child can be focused with the arrow , home, and\n *   // end keys\n *   return (\n *     <KeyboardMovementProvider value={movementContext}>\n *       <div {...movementProps}>\n *         {children}\n *       </div>\n *     </KeyboardMovementProvider>\n *   );\n * }\n * ```\n *\n * @example Active Descendant Movement\n * ```tsx\n * import {\n *   KeyboardMovementProvider,\n *   useKeyboardMovementContext,\n *   useKeyboardMovementProvider,\n * } from \"@react-md/core/movement/useKeyboardMovementProvider\";\n * import type { ReactElement, ReactNode } from \"react\";\n * import { useId } from \"react\";\n *\n * function Child(): ReactElement {\n *   const id = useId()\n *   const { activeDescendantId } = useKeyboardMovementContext();\n *\n *   return (\n *     <div\n *       {...props}\n *       id={id}\n *       className={cnb(id === activeDescendantId && \"focused-class-name\")}\n *     >\n *       Some Content\n *     </div>\n *   );\n * }\n *\n * function Example({ children }: { children: ReactNode }): ReactElement {\n *   const { movementContext, movementProps } = useKeyboardMovementProvider({\n *     loopable: true,\n *     searchable: true,\n *     tabIndexBehavior: \"virtual\",\n *   });\n *\n *   // any focusable element child can be focused with the arrow , home, and\n *   // end keys\n *   return (\n *     <KeyboardMovementProvider value={movementContext}>\n *       <div {...movementProps}>\n *         <Child />\n *         <Child />\n *         <Child />\n *       </div>\n *     </KeyboardMovementProvider>\n *   );\n * }\n * ```\n *\n * @example Roving Tab Index\n * ```tsx\n * import {\n *   KeyboardMovementProvider,\n *   useKeyboardMovementContext,\n *   useKeyboardMovementProvider,\n * } from \"@react-md/core/movement/useKeyboardMovementProvider\";\n * import type { ReactElement, ReactNode } from \"react\";\n * import { useId } from \"react\";\n *\n * function Child(): ReactElement {\n *   const id = useId()\n *   const { activeDescendantId } = useKeyboardMovementContext();\n *\n *   return (\n *     <div\n *       {...props}\n *       id={id}\n *       tabIndex={id === activeDescendantId ? 0 : -1}\n *     >\n *       Some Content\n *     </div>\n *   );\n * }\n *\n * function Example({ children }: { children: ReactNode }): ReactElement {\n *   const { movementContext, movementProps } = useKeyboardMovementProvider({\n *     loopable: true,\n *     searchable: true,\n *     tabIndexBehavior: \"roving\",\n *   });\n *\n *   // any focusable element child can be focused with the arrow , home, and\n *   // end keys\n *   return (\n *     <KeyboardMovementProvider value={movementContext}>\n *       <div {...movementProps}>\n *         <Child />\n *         <Child />\n *         <Child />\n *       </div>\n *     </KeyboardMovementProvider>\n *   );\n * }\n * ```\n * @since 6.0.0\n * @internal\n */\nexport function useKeyboardMovementProvider<E extends HTMLElement>(\n  options: KeyboardMovementProviderOptions<E> = {}\n): KeyboardMovementProviderImplementation<E> {\n  const {\n    onClick = noop,\n    onFocus = noop,\n    onKeyDown = noop,\n    loopable = false,\n    disabled,\n    searchable = false,\n    horizontal = false,\n    includeDisabled = false,\n    tabIndexBehavior,\n    extendKeyDown = noop,\n    onFocusChange = noop,\n    programmatic = includeDisabled,\n    incrementKeys: propIncrementKeys,\n    decrementKeys: propDecrementKeys,\n    jumpToFirstKeys: propJumpToFirstKeys,\n    jumpToLastKeys: propJumpToLastKeys,\n    getFocusableElements = defaultGetFocusableElements,\n    getDefaultFocusedIndex = returnNegative1,\n    isNegativeOneAllowed = false,\n  } = options;\n\n  const isRTL = useDir().dir === \"rtl\";\n  let defaults: Readonly<Required<KeyboardMovementConfiguration>>;\n  if (horizontal) {\n    defaults = isRTL\n      ? DEFAULT_RTL_KEYBOARD_MOVEMENT\n      : DEFAULT_LTR_KEYBOARD_MOVEMENT;\n  } else {\n    defaults = DEFAULT_KEYBOARD_MOVEMENT;\n  }\n\n  const incrementKeys = propIncrementKeys || defaults.incrementKeys;\n  const decrementKeys = propDecrementKeys || defaults.decrementKeys;\n  const jumpToFirstKeys = propJumpToFirstKeys || defaults.jumpToFirstKeys;\n  const jumpToLastKeys = propJumpToLastKeys || defaults.jumpToLastKeys;\n\n  const configuration: KeyboardMovementConfig = {\n    incrementKeys,\n    decrementKeys,\n    jumpToFirstKeys,\n    jumpToLastKeys,\n  };\n  const config = useRef(configuration);\n  useIsomorphicLayoutEffect(() => {\n    config.current = configuration;\n  });\n\n  const [activeDescendantId, setActiveDescendantId] = useState(\"\");\n  const movementContext = useMemo<KeyboardMovementContext>(\n    () => ({\n      config,\n      loopable,\n      searchable,\n      horizontal,\n      includeDisabled,\n      tabIndexBehavior,\n      activeDescendantId,\n    }),\n    [\n      activeDescendantId,\n      horizontal,\n      includeDisabled,\n      loopable,\n      searchable,\n      tabIndexBehavior,\n    ]\n  );\n  const currentFocusIndex = useRef(-1);\n  const mode = useUserInteractionMode();\n  const refocus = useRef(false);\n\n  if (process.env.NODE_ENV !== \"production\") {\n    // this fixes issues during hot reloading and using the `useId()` hook\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    useEffect(() => {\n      return () => {\n        setActiveDescendantId(\"\");\n      };\n    }, []);\n  }\n\n  let tabIndex: number | undefined;\n  if (tabIndexBehavior) {\n    tabIndex =\n      disabled || (tabIndexBehavior === \"roving\" && activeDescendantId)\n        ? -1\n        : 0;\n  }\n\n  return {\n    movementProps: {\n      \"aria-activedescendant\":\n        tabIndexBehavior === \"virtual\" ? activeDescendantId : undefined,\n      tabIndex,\n\n      // Note: This used to be on the `onFocus` event, but this causes issues in\n      // Chromium browsers for drag and drop behavior\n      onClick(event) {\n        onClick(event);\n        if (disabled) {\n          return;\n        }\n\n        // This makes it so you can click an element with a mouse and then\n        // keyboard navigate from that element instead of the last keyboard focus\n        // element\n        const { currentTarget, target } = event;\n        if (target === currentTarget || !(target instanceof HTMLElement)) {\n          return;\n        }\n\n        const focusables = getFocusableElements(currentTarget, programmatic);\n        const focusedIndex = focusables.findIndex(\n          (element) => element === target || element.contains(target)\n        );\n        if (focusedIndex === -1 || !focusables.length) {\n          return;\n        }\n\n        currentFocusIndex.current = focusedIndex;\n        const focused = focusables[focusedIndex];\n        if (tabIndexBehavior) {\n          setActiveDescendantId(focused.id);\n        }\n\n        // need to force focus back to the container element when using\n        // aria activedescendant\n        if (tabIndexBehavior === \"virtual\") {\n          refocus.current = true;\n          currentTarget.focus();\n        }\n\n        onFocusChange({\n          index: focusedIndex,\n          element: focused,\n        });\n      },\n      onFocus(event) {\n        onFocus(event);\n        if (event.isPropagationStopped() || refocus.current) {\n          refocus.current = false;\n          return;\n        }\n\n        if (\n          (mode !== \"keyboard\" && tabIndexBehavior !== \"virtual\") ||\n          event.target !== event.currentTarget\n        ) {\n          return;\n        }\n\n        const focusables = getFocusableElements(\n          event.currentTarget,\n          programmatic\n        );\n        if (!focusables.length) {\n          return;\n        }\n\n        let defaultFocusIndex = getDefaultFocusedIndex({\n          focusables,\n          includeDisabled,\n        });\n\n        // This allows my custom `getDefaultFocusedIndex` implementations to\n        // have a nice fallback without having to re-implement the \"focus\n        // first\" behavior\n        if (!isNegativeOneAllowed && defaultFocusIndex === -1) {\n          if (tabIndexBehavior === \"virtual\") {\n            // virtual keyboard navigation **must** always focus at least one element\n            defaultFocusIndex = getVirtualFocusDefaultIndex({\n              focusables,\n              includeDisabled,\n              activeDescendantId,\n            });\n          } else {\n            defaultFocusIndex = getFirstFocusableIndex({\n              focusables,\n              includeDisabled,\n            });\n          }\n        }\n\n        if (defaultFocusIndex === -1) {\n          return;\n        }\n\n        currentFocusIndex.current = defaultFocusIndex;\n        const focused = focusables[defaultFocusIndex];\n        if (tabIndexBehavior) {\n          setActiveDescendantId(focused.id);\n        }\n\n        if (tabIndexBehavior !== \"virtual\") {\n          focused.focus();\n        } else {\n          focused.scrollIntoView({ block: \"nearest\" });\n        }\n\n        onFocusChange({\n          index: defaultFocusIndex,\n          element: focused,\n        });\n      },\n      onKeyDown(event) {\n        onKeyDown(event);\n        if (disabled) {\n          return;\n        }\n\n        const { currentTarget } = event;\n\n        const setFocusIndex = (\n          index: number,\n          focusables: readonly HTMLElement[]\n        ): void => {\n          event.preventDefault();\n          event.stopPropagation();\n          if (currentFocusIndex.current === index || index === -1) {\n            return;\n          }\n\n          currentFocusIndex.current = index;\n          const focused = focusables[index];\n          if (tabIndexBehavior) {\n            focused.scrollIntoView({\n              block: \"nearest\",\n              inline: \"nearest\",\n            });\n            setActiveDescendantId(focused.id);\n          }\n\n          if (tabIndexBehavior !== \"virtual\") {\n            focused.focus();\n          }\n\n          onFocusChange({\n            index,\n            element: focused,\n          });\n        };\n\n        extendKeyDown({\n          event,\n          setFocusIndex,\n          currentFocusIndex,\n          setActiveDescendantId,\n          ...movementContext,\n        });\n\n        if (event.isPropagationStopped()) {\n          return;\n        }\n\n        // TODO: Figure this part out. This is currently required for the tree\n        // movement when the asterisk key is pressed. There might be other cases\n        // as well.\n        if (!isNegativeOneAllowed && currentFocusIndex.current === -1) {\n          currentFocusIndex.current = recalculateFocusIndex({\n            focusables: getFocusableElements(currentTarget, programmatic),\n            includeDisabled,\n            tabIndexBehavior,\n            activeDescendantId,\n          });\n        }\n\n        const { key, shiftKey } = event;\n        if (\n          tabIndexBehavior === \"virtual\" &&\n          activeDescendantId &&\n          (key === \" \" || key === \"Enter\")\n        ) {\n          if (key === \" \") {\n            event.preventDefault();\n          }\n\n          const focusables = getFocusableElements(currentTarget, programmatic);\n          const activeElement = focusables[currentFocusIndex.current];\n          if (!activeElement || isElementDisabled(activeElement)) {\n            return;\n          }\n\n          activeElement.click();\n          return;\n        }\n\n        const {\n          incrementKeys,\n          decrementKeys,\n          jumpToFirstKeys,\n          jumpToLastKeys,\n        } = config.current;\n\n        if (searchable && isSearchableEvent(event)) {\n          const focusables = getFocusableElements(currentTarget, programmatic);\n          const index = findMatchIndex({\n            value: key,\n            values: focusables.map((element) =>\n              getSearchText(element, !isNotFocusable(element, includeDisabled))\n            ),\n            startIndex: shiftKey ? -1 : currentFocusIndex.current,\n          });\n          setFocusIndex(index, focusables);\n          return;\n        }\n\n        const jumpToFirst = jumpToFirstKeys.includes(key);\n        const jumpToLast = !jumpToFirst && jumpToLastKeys.includes(key);\n        const increment =\n          !jumpToFirst && !jumpToLast && incrementKeys.includes(key);\n        const decrement =\n          !jumpToFirst &&\n          !jumpToLast &&\n          !increment &&\n          decrementKeys.includes(key);\n\n        if (!jumpToFirst && !jumpToLast && !increment && !decrement) {\n          return;\n        }\n        const focusables = getFocusableElements(currentTarget, programmatic);\n\n        let index: number;\n        if (jumpToFirst) {\n          index = getFirstFocusableIndex({\n            focusables,\n            includeDisabled,\n          });\n        } else if (jumpToLast) {\n          index = getLastFocusableIndex({\n            focusables,\n            includeDisabled,\n          });\n        } else {\n          index = getNextFocusableIndex({\n            loopable,\n            increment,\n            focusables,\n            includeDisabled,\n            currentFocusIndex: currentFocusIndex.current,\n          });\n        }\n\n        setFocusIndex(index, focusables);\n      },\n    },\n    movementContext,\n    currentFocusIndex,\n    activeDescendantId,\n    setActiveDescendantId,\n  };\n}\n"],"names":["createContext","useContext","useEffect","useMemo","useRef","useState","getFocusableElements","defaultGetFocusableElements","useUserInteractionMode","useDir","useIsomorphicLayoutEffect","DEFAULT_KEYBOARD_MOVEMENT","DEFAULT_LTR_KEYBOARD_MOVEMENT","DEFAULT_RTL_KEYBOARD_MOVEMENT","findMatchIndex","getFirstFocusableIndex","getLastFocusableIndex","getNextFocusableIndex","getSearchText","getVirtualFocusDefaultIndex","isElementDisabled","isNotFocusable","isSearchableEvent","recalculateFocusIndex","context","config","current","loopable","searchable","horizontal","includeDisabled","tabIndexBehavior","undefined","activeDescendantId","displayName","Provider","KeyboardMovementProvider","useKeyboardMovementContext","noop","returnNegative1","useKeyboardMovementProvider","options","onClick","onFocus","onKeyDown","disabled","extendKeyDown","onFocusChange","programmatic","incrementKeys","propIncrementKeys","decrementKeys","propDecrementKeys","jumpToFirstKeys","propJumpToFirstKeys","jumpToLastKeys","propJumpToLastKeys","getDefaultFocusedIndex","isNegativeOneAllowed","isRTL","dir","defaults","configuration","setActiveDescendantId","movementContext","currentFocusIndex","mode","refocus","process","env","NODE_ENV","tabIndex","movementProps","event","currentTarget","target","HTMLElement","focusables","focusedIndex","findIndex","element","contains","length","focused","id","focus","index","isPropagationStopped","defaultFocusIndex","scrollIntoView","block","setFocusIndex","preventDefault","stopPropagation","inline","key","shiftKey","activeElement","click","value","values","map","startIndex","jumpToFirst","includes","jumpToLast","increment","decrement"],"mappings":"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"}

package/dist/navigation/CollapsibleNavGroup.d.ts

@@ -26,6 +26,7 @@ export interface CollapsibleNavGroupProps extends NavGroupProps, NavItemButtonRo
 /**
  * **Client Component**
  *
+ * @see {@link https://next.react-md.dev/components/navigation | Navigation Demos}
  * @since 6.0.0
  */
 export declare const CollapsibleNavGroup: import("react").ForwardRefExoticComponent<CollapsibleNavGroupProps & import("react").RefAttributes<HTMLUListElement>>;

package/dist/navigation/CollapsibleNavGroup.js

@@ -11,6 +11,7 @@ const noop = ()=>{
 /**
  * **Client Component**
  *
+ * @see {@link https://next.react-md.dev/components/navigation | Navigation Demos}
  * @since 6.0.0
  */ export const CollapsibleNavGroup = /*#__PURE__*/ forwardRef(function CollapsibleNavGroup(props, ref) {
     const { liProps, buttonProps, buttonChildren, icon, iconRotatorProps, disableIconRotator, className, children, collapsed, toggleCollapsed, collapseOptions, ...remaining } = props;

package/dist/navigation/CollapsibleNavGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/navigation/CollapsibleNavGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport { type LiHTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { type ButtonProps } from \"../button/Button.js\";\nimport {\n  type CollapseTransitionHookOptions,\n  useCollapseTransition,\n} from \"../transition/useCollapseTransition.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { NavGroup, type NavGroupProps } from \"./NavGroup.js\";\nimport { NavItem } from \"./NavItem.js\";\nimport {\n  NavItemButton,\n  type NavItemButtonRotatorProps,\n} from \"./NavItemButton.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface CollapsibleNavGroupProps\n  extends NavGroupProps,\n    NavItemButtonRotatorProps {\n  liProps?: PropsWithRef<LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>;\n  buttonProps?: PropsWithRef<ButtonProps, HTMLButtonElement>;\n  collapseOptions?: Omit<\n    CollapseTransitionHookOptions<HTMLUListElement>,\n    \"nodeRef\" | \"className\" | \"transitionIn\"\n  >;\n\n  /**\n   * The children to render in the {@link NavItemButton} that toggles the\n   * collapsed state\n   */\n  buttonChildren: ReactNode;\n\n  /**\n   * The content that should be rendered in the non-collapsed {@link NavGroup}.\n   */\n  children: ReactNode;\n\n  collapsed: boolean;\n  toggleCollapsed: () => void;\n}\n\n/**\n * **Client Component**\n *\n * @since 6.0.0\n */\nexport const CollapsibleNavGroup = forwardRef<\n  HTMLUListElement,\n  CollapsibleNavGroupProps\n>(function CollapsibleNavGroup(props, ref) {\n  const {\n    liProps,\n    buttonProps,\n    buttonChildren,\n    icon,\n    iconRotatorProps,\n    disableIconRotator,\n    className,\n    children,\n    collapsed,\n    toggleCollapsed,\n    collapseOptions,\n    ...remaining\n  } = props;\n\n  const { rendered, elementProps } = useCollapseTransition({\n    ...collapseOptions,\n    nodeRef: ref,\n    className,\n    transitionIn: !collapsed,\n  });\n  const onButtonClick = buttonProps?.onClick ?? noop;\n\n  return (\n    <NavItem {...liProps}>\n      <NavItemButton\n        {...buttonProps}\n        onClick={(event) => {\n          onButtonClick(event);\n          toggleCollapsed();\n        }}\n        collapsed={collapsed}\n        icon={icon}\n        iconRotatorProps={iconRotatorProps}\n        disableIconRotator={disableIconRotator}\n      >\n        {buttonChildren}\n      </NavItemButton>\n      {rendered && (\n        <NavGroup {...remaining} {...elementProps}>\n          {children}\n        </NavGroup>\n      )}\n    </NavItem>\n  );\n});\n"],"names":["forwardRef","useCollapseTransition","NavGroup","NavItem","NavItemButton","noop","CollapsibleNavGroup","props","ref","liProps","buttonProps","buttonChildren","icon","iconRotatorProps","disableIconRotator","className","children","collapsed","toggleCollapsed","collapseOptions","remaining","rendered","elementProps","nodeRef","transitionIn","onButtonClick","onClick","event"],"mappings":"AAAA;;AAEA,SAAgDA,UAAU,QAAQ,QAAQ;AAG1E,SAEEC,qBAAqB,QAChB,yCAAyC;AAEhD,SAASC,QAAQ,QAA4B,gBAAgB;AAC7D,SAASC,OAAO,QAAQ,eAAe;AACvC,SACEC,aAAa,QAER,qBAAqB;AAE5B,MAAMC,OAAO;AACX,aAAa;AACf;AA8BA;;;;CAIC,GACD,OAAO,MAAMC,oCAAsBN,WAGjC,SAASM,oBAAoBC,KAAK,EAAEC,GAAG;IACvC,MAAM,EACJC,OAAO,EACPC,WAAW,EACXC,cAAc,EACdC,IAAI,EACJC,gBAAgB,EAChBC,kBAAkB,EAClBC,SAAS,EACTC,QAAQ,EACRC,SAAS,EACTC,eAAe,EACfC,eAAe,EACf,GAAGC,WACJ,GAAGb;IAEJ,MAAM,EAAEc,QAAQ,EAAEC,YAAY,EAAE,GAAGrB,sBAAsB;QACvD,GAAGkB,eAAe;QAClBI,SAASf;QACTO;QACAS,cAAc,CAACP;IACjB;IACA,MAAMQ,gBAAgBf,aAAagB,WAAWrB;IAE9C,qBACE,MAACF;QAAS,GAAGM,OAAO;;0BAClB,KAACL;gBACE,GAAGM,WAAW;gBACfgB,SAAS,CAACC;oBACRF,cAAcE;oBACdT;gBACF;gBACAD,WAAWA;gBACXL,MAAMA;gBACNC,kBAAkBA;gBAClBC,oBAAoBA;0BAEnBH;;YAEFU,0BACC,KAACnB;gBAAU,GAAGkB,SAAS;gBAAG,GAAGE,YAAY;0BACtCN;;;;AAKX,GAAG"}
+{"version":3,"sources":["../../src/navigation/CollapsibleNavGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport { type LiHTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { type ButtonProps } from \"../button/Button.js\";\nimport {\n  type CollapseTransitionHookOptions,\n  useCollapseTransition,\n} from \"../transition/useCollapseTransition.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { NavGroup, type NavGroupProps } from \"./NavGroup.js\";\nimport { NavItem } from \"./NavItem.js\";\nimport {\n  NavItemButton,\n  type NavItemButtonRotatorProps,\n} from \"./NavItemButton.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface CollapsibleNavGroupProps\n  extends NavGroupProps,\n    NavItemButtonRotatorProps {\n  liProps?: PropsWithRef<LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>;\n  buttonProps?: PropsWithRef<ButtonProps, HTMLButtonElement>;\n  collapseOptions?: Omit<\n    CollapseTransitionHookOptions<HTMLUListElement>,\n    \"nodeRef\" | \"className\" | \"transitionIn\"\n  >;\n\n  /**\n   * The children to render in the {@link NavItemButton} that toggles the\n   * collapsed state\n   */\n  buttonChildren: ReactNode;\n\n  /**\n   * The content that should be rendered in the non-collapsed {@link NavGroup}.\n   */\n  children: ReactNode;\n\n  collapsed: boolean;\n  toggleCollapsed: () => void;\n}\n\n/**\n * **Client Component**\n *\n * @see {@link https://next.react-md.dev/components/navigation | Navigation Demos}\n * @since 6.0.0\n */\nexport const CollapsibleNavGroup = forwardRef<\n  HTMLUListElement,\n  CollapsibleNavGroupProps\n>(function CollapsibleNavGroup(props, ref) {\n  const {\n    liProps,\n    buttonProps,\n    buttonChildren,\n    icon,\n    iconRotatorProps,\n    disableIconRotator,\n    className,\n    children,\n    collapsed,\n    toggleCollapsed,\n    collapseOptions,\n    ...remaining\n  } = props;\n\n  const { rendered, elementProps } = useCollapseTransition({\n    ...collapseOptions,\n    nodeRef: ref,\n    className,\n    transitionIn: !collapsed,\n  });\n  const onButtonClick = buttonProps?.onClick ?? noop;\n\n  return (\n    <NavItem {...liProps}>\n      <NavItemButton\n        {...buttonProps}\n        onClick={(event) => {\n          onButtonClick(event);\n          toggleCollapsed();\n        }}\n        collapsed={collapsed}\n        icon={icon}\n        iconRotatorProps={iconRotatorProps}\n        disableIconRotator={disableIconRotator}\n      >\n        {buttonChildren}\n      </NavItemButton>\n      {rendered && (\n        <NavGroup {...remaining} {...elementProps}>\n          {children}\n        </NavGroup>\n      )}\n    </NavItem>\n  );\n});\n"],"names":["forwardRef","useCollapseTransition","NavGroup","NavItem","NavItemButton","noop","CollapsibleNavGroup","props","ref","liProps","buttonProps","buttonChildren","icon","iconRotatorProps","disableIconRotator","className","children","collapsed","toggleCollapsed","collapseOptions","remaining","rendered","elementProps","nodeRef","transitionIn","onButtonClick","onClick","event"],"mappings":"AAAA;;AAEA,SAAgDA,UAAU,QAAQ,QAAQ;AAG1E,SAEEC,qBAAqB,QAChB,yCAAyC;AAEhD,SAASC,QAAQ,QAA4B,gBAAgB;AAC7D,SAASC,OAAO,QAAQ,eAAe;AACvC,SACEC,aAAa,QAER,qBAAqB;AAE5B,MAAMC,OAAO;AACX,aAAa;AACf;AA8BA;;;;;CAKC,GACD,OAAO,MAAMC,oCAAsBN,WAGjC,SAASM,oBAAoBC,KAAK,EAAEC,GAAG;IACvC,MAAM,EACJC,OAAO,EACPC,WAAW,EACXC,cAAc,EACdC,IAAI,EACJC,gBAAgB,EAChBC,kBAAkB,EAClBC,SAAS,EACTC,QAAQ,EACRC,SAAS,EACTC,eAAe,EACfC,eAAe,EACf,GAAGC,WACJ,GAAGb;IAEJ,MAAM,EAAEc,QAAQ,EAAEC,YAAY,EAAE,GAAGrB,sBAAsB;QACvD,GAAGkB,eAAe;QAClBI,SAASf;QACTO;QACAS,cAAc,CAACP;IACjB;IACA,MAAMQ,gBAAgBf,aAAagB,WAAWrB;IAE9C,qBACE,MAACF;QAAS,GAAGM,OAAO;;0BAClB,KAACL;gBACE,GAAGM,WAAW;gBACfgB,SAAS,CAACC;oBACRF,cAAcE;oBACdT;gBACF;gBACAD,WAAWA;gBACXL,MAAMA;gBACNC,kBAAkBA;gBAClBC,oBAAoBA;0BAEnBH;;YAEFU,0BACC,KAACnB;gBAAU,GAAGkB,SAAS;gBAAG,GAAGE,YAAY;0BACtCN;;;;AAKX,GAAG"}

package/dist/navigation/DefaultNavigationRenderer.d.ts

@@ -16,6 +16,7 @@ export type DefaultNavigationRendererProps<Item extends NavigationItem = Navigat
  * - `!!items` - `<CollapsibleNavGroup />`
  * - `<NavItemLink {...item} as={linkComponent} active={pathname === href} />`
  *
+ * @see {@link https://next.react-md.dev/components/navigation | Navigation Demos}
  * @since 6.0.0
  */
 export declare function DefaultNavigationRenderer<Item extends NavigationItem, Data extends NavigationRenderData>(props: DefaultNavigationRendererProps<Item, Data>): ReactElement;

package/dist/navigation/DefaultNavigationRenderer.js

@@ -15,6 +15,7 @@ import { getHrefFromParents, getNavigationGroupId } from "./utils.js";
  * - `!!items` - `<CollapsibleNavGroup />`
  * - `<NavItemLink {...item} as={linkComponent} active={pathname === href} />`
  *
+ * @see {@link https://next.react-md.dev/components/navigation | Navigation Demos}
  * @since 6.0.0
  */ export function DefaultNavigationRenderer(props) {
     const { item, data, children, parents } = props;

package/dist/navigation/DefaultNavigationRenderer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/navigation/DefaultNavigationRenderer.tsx"],"sourcesContent":["import { type ReactElement } from \"react\";\n\nimport { Divider } from \"../divider/Divider.js\";\nimport { type RenderRecursiveItemsProps } from \"../utils/RenderRecursively.js\";\nimport { CollapsibleNavGroup } from \"./CollapsibleNavGroup.js\";\nimport { NavItemLink } from \"./NavItemLink.js\";\nimport { NavSubheader } from \"./NavSubheader.js\";\nimport { type NavigationItem, type NavigationRenderData } from \"./types.js\";\nimport { getHrefFromParents, getNavigationGroupId } from \"./utils.js\";\n\n/**\n * @since 6.0.0\n */\nexport type DefaultNavigationRendererProps<\n  Item extends NavigationItem = NavigationItem,\n  Data extends NavigationRenderData = NavigationRenderData,\n> = RenderRecursiveItemsProps<Item, Data>;\n\n/**\n * **Client Component**\n *\n * The default behavior is attempt to render in order:\n * - `const { type, items, ...props } = item`\n * - `type === \"divider\"` - `<Divider {...props} />`\n * - `type === \"subheader\"` - `<NavSubheader {...props} />`\n * - `type === \"group\"` - `<><NavSubheader {...props} />{children}</>`\n * - `!!items` - `<CollapsibleNavGroup />`\n * - `<NavItemLink {...item} as={linkComponent} active={pathname === href} />`\n *\n * @since 6.0.0\n */\nexport function DefaultNavigationRenderer<\n  Item extends NavigationItem,\n  Data extends NavigationRenderData,\n>(props: DefaultNavigationRendererProps<Item, Data>): ReactElement {\n  const { item, data, children, parents } = props;\n  switch (item.type) {\n    case \"divider\": {\n      const { type: _type, items: _items, ...divider } = item;\n      return <Divider {...divider} />;\n    }\n    case \"subheader\": {\n      const { type: _type, items: _items, ...subheader } = item;\n      return <NavSubheader {...subheader} />;\n    }\n  }\n\n  if (item.items) {\n    const nextParents = [item, ...parents];\n    const id = getNavigationGroupId(item, nextParents);\n    return (\n      <CollapsibleNavGroup\n        depth={nextParents.length}\n        collapsed={!data?.expandedItems.has(id)}\n        buttonChildren={item.children}\n        toggleCollapsed={() => {\n          data?.toggleExpandedItem(id);\n        }}\n      >\n        {children}\n      </CollapsibleNavGroup>\n    );\n  }\n\n  const href = `${getHrefFromParents(parents)}${item.href}`;\n  return (\n    <NavItemLink\n      {...item}\n      as={data?.linkComponent}\n      active={(\"active\" in item && !!item.active) || data?.pathname === href}\n      href={href}\n    />\n  );\n}\n"],"names":["Divider","CollapsibleNavGroup","NavItemLink","NavSubheader","getHrefFromParents","getNavigationGroupId","DefaultNavigationRenderer","props","item","data","children","parents","type","_type","items","_items","divider","subheader","nextParents","id","depth","length","collapsed","expandedItems","has","buttonChildren","toggleCollapsed","toggleExpandedItem","href","as","linkComponent","active","pathname"],"mappings":";AAEA,SAASA,OAAO,QAAQ,wBAAwB;AAEhD,SAASC,mBAAmB,QAAQ,2BAA2B;AAC/D,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,YAAY,QAAQ,oBAAoB;AAEjD,SAASC,kBAAkB,EAAEC,oBAAoB,QAAQ,aAAa;AAUtE;;;;;;;;;;;;CAYC,GACD,OAAO,SAASC,0BAGdC,KAAiD;IACjD,MAAM,EAAEC,IAAI,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,OAAO,EAAE,GAAGJ;IAC1C,OAAQC,KAAKI,IAAI;QACf,KAAK;YAAW;gBACd,MAAM,EAAEA,MAAMC,KAAK,EAAEC,OAAOC,MAAM,EAAE,GAAGC,SAAS,GAAGR;gBACnD,qBAAO,KAACR;oBAAS,GAAGgB,OAAO;;YAC7B;QACA,KAAK;YAAa;gBAChB,MAAM,EAAEJ,MAAMC,KAAK,EAAEC,OAAOC,MAAM,EAAE,GAAGE,WAAW,GAAGT;gBACrD,qBAAO,KAACL;oBAAc,GAAGc,SAAS;;YACpC;IACF;IAEA,IAAIT,KAAKM,KAAK,EAAE;QACd,MAAMI,cAAc;YAACV;eAASG;SAAQ;QACtC,MAAMQ,KAAKd,qBAAqBG,MAAMU;QACtC,qBACE,KAACjB;YACCmB,OAAOF,YAAYG,MAAM;YACzBC,WAAW,CAACb,MAAMc,cAAcC,IAAIL;YACpCM,gBAAgBjB,KAAKE,QAAQ;YAC7BgB,iBAAiB;gBACfjB,MAAMkB,mBAAmBR;YAC3B;sBAECT;;IAGP;IAEA,MAAMkB,OAAO,GAAGxB,mBAAmBO,WAAWH,KAAKoB,IAAI,EAAE;IACzD,qBACE,KAAC1B;QACE,GAAGM,IAAI;QACRqB,IAAIpB,MAAMqB;QACVC,QAAQ,AAAC,YAAYvB,QAAQ,CAAC,CAACA,KAAKuB,MAAM,IAAKtB,MAAMuB,aAAaJ;QAClEA,MAAMA;;AAGZ"}
+{"version":3,"sources":["../../src/navigation/DefaultNavigationRenderer.tsx"],"sourcesContent":["import { type ReactElement } from \"react\";\n\nimport { Divider } from \"../divider/Divider.js\";\nimport { type RenderRecursiveItemsProps } from \"../utils/RenderRecursively.js\";\nimport { CollapsibleNavGroup } from \"./CollapsibleNavGroup.js\";\nimport { NavItemLink } from \"./NavItemLink.js\";\nimport { NavSubheader } from \"./NavSubheader.js\";\nimport { type NavigationItem, type NavigationRenderData } from \"./types.js\";\nimport { getHrefFromParents, getNavigationGroupId } from \"./utils.js\";\n\n/**\n * @since 6.0.0\n */\nexport type DefaultNavigationRendererProps<\n  Item extends NavigationItem = NavigationItem,\n  Data extends NavigationRenderData = NavigationRenderData,\n> = RenderRecursiveItemsProps<Item, Data>;\n\n/**\n * **Client Component**\n *\n * The default behavior is attempt to render in order:\n * - `const { type, items, ...props } = item`\n * - `type === \"divider\"` - `<Divider {...props} />`\n * - `type === \"subheader\"` - `<NavSubheader {...props} />`\n * - `type === \"group\"` - `<><NavSubheader {...props} />{children}</>`\n * - `!!items` - `<CollapsibleNavGroup />`\n * - `<NavItemLink {...item} as={linkComponent} active={pathname === href} />`\n *\n * @see {@link https://next.react-md.dev/components/navigation | Navigation Demos}\n * @since 6.0.0\n */\nexport function DefaultNavigationRenderer<\n  Item extends NavigationItem,\n  Data extends NavigationRenderData,\n>(props: DefaultNavigationRendererProps<Item, Data>): ReactElement {\n  const { item, data, children, parents } = props;\n  switch (item.type) {\n    case \"divider\": {\n      const { type: _type, items: _items, ...divider } = item;\n      return <Divider {...divider} />;\n    }\n    case \"subheader\": {\n      const { type: _type, items: _items, ...subheader } = item;\n      return <NavSubheader {...subheader} />;\n    }\n  }\n\n  if (item.items) {\n    const nextParents = [item, ...parents];\n    const id = getNavigationGroupId(item, nextParents);\n    return (\n      <CollapsibleNavGroup\n        depth={nextParents.length}\n        collapsed={!data?.expandedItems.has(id)}\n        buttonChildren={item.children}\n        toggleCollapsed={() => {\n          data?.toggleExpandedItem(id);\n        }}\n      >\n        {children}\n      </CollapsibleNavGroup>\n    );\n  }\n\n  const href = `${getHrefFromParents(parents)}${item.href}`;\n  return (\n    <NavItemLink\n      {...item}\n      as={data?.linkComponent}\n      active={(\"active\" in item && !!item.active) || data?.pathname === href}\n      href={href}\n    />\n  );\n}\n"],"names":["Divider","CollapsibleNavGroup","NavItemLink","NavSubheader","getHrefFromParents","getNavigationGroupId","DefaultNavigationRenderer","props","item","data","children","parents","type","_type","items","_items","divider","subheader","nextParents","id","depth","length","collapsed","expandedItems","has","buttonChildren","toggleCollapsed","toggleExpandedItem","href","as","linkComponent","active","pathname"],"mappings":";AAEA,SAASA,OAAO,QAAQ,wBAAwB;AAEhD,SAASC,mBAAmB,QAAQ,2BAA2B;AAC/D,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,YAAY,QAAQ,oBAAoB;AAEjD,SAASC,kBAAkB,EAAEC,oBAAoB,QAAQ,aAAa;AAUtE;;;;;;;;;;;;;CAaC,GACD,OAAO,SAASC,0BAGdC,KAAiD;IACjD,MAAM,EAAEC,IAAI,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,OAAO,EAAE,GAAGJ;IAC1C,OAAQC,KAAKI,IAAI;QACf,KAAK;YAAW;gBACd,MAAM,EAAEA,MAAMC,KAAK,EAAEC,OAAOC,MAAM,EAAE,GAAGC,SAAS,GAAGR;gBACnD,qBAAO,KAACR;oBAAS,GAAGgB,OAAO;;YAC7B;QACA,KAAK;YAAa;gBAChB,MAAM,EAAEJ,MAAMC,KAAK,EAAEC,OAAOC,MAAM,EAAE,GAAGE,WAAW,GAAGT;gBACrD,qBAAO,KAACL;oBAAc,GAAGc,SAAS;;YACpC;IACF;IAEA,IAAIT,KAAKM,KAAK,EAAE;QACd,MAAMI,cAAc;YAACV;eAASG;SAAQ;QACtC,MAAMQ,KAAKd,qBAAqBG,MAAMU;QACtC,qBACE,KAACjB;YACCmB,OAAOF,YAAYG,MAAM;YACzBC,WAAW,CAACb,MAAMc,cAAcC,IAAIL;YACpCM,gBAAgBjB,KAAKE,QAAQ;YAC7BgB,iBAAiB;gBACfjB,MAAMkB,mBAAmBR;YAC3B;sBAECT;;IAGP;IAEA,MAAMkB,OAAO,GAAGxB,mBAAmBO,WAAWH,KAAKoB,IAAI,EAAE;IACzD,qBACE,KAAC1B;QACE,GAAGM,IAAI;QACRqB,IAAIpB,MAAMqB;QACVC,QAAQ,AAAC,YAAYvB,QAAQ,CAAC,CAACA,KAAKuB,MAAM,IAAKtB,MAAMuB,aAAaJ;QAClEA,MAAMA;;AAGZ"}