@fluentui/react-menu 9.19.5 → 9.20.0

package/lib-commonjs/contexts/menuGroupContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/menuGroupContext.ts"],"sourcesContent":["import * as React from 'react';\n\nconst MenuGroupContext = React.createContext<MenuGroupContextValue | undefined>(\n  undefined,\n) as React.Context<MenuGroupContextValue>;\n\nconst menuGroupContextDefaultValue: MenuGroupContextValue = {\n  headerId: '',\n};\n\n/**\n * Context used to guarantee correct aria-relationship between header\n * and group information\n */\nexport type MenuGroupContextValue = {\n  /**\n   * Element id applied to the `MenuGroupHeader` component\n   */\n  headerId: string;\n};\n\nexport const MenuGroupContextProvider = MenuGroupContext.Provider;\nexport const useMenuGroupContext_unstable = () => React.useContext(MenuGroupContext) ?? menuGroupContextDefaultValue;\n"],"names":["React","MenuGroupContext","createContext","undefined","menuGroupContextDefaultValue","headerId","MenuGroupContextProvider","Provider","useMenuGroupContext_unstable","useContext"],"mappings":";;;;;;;;;;;4BAqBaM;;;gCACAE;;;;;iEAtBU,QAAQ;AAE/B,MAAMP,iCAAmBD,OAAME,aAAa,CAC1CC;AAGF,MAAMC,+BAAsD;IAC1DC,UAAU;AACZ;AAaO,MAAMC,2BAA2BL,iBAAiBM,QAAQ,CAAC;AAC3D,MAAMC,+BAA+B;QAAMR;WAAAA,CAAAA,oBAAAA,OAAMS,UAAU,CAACR,iBAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAAsCI;EAA6B"}
+{"version":3,"sources":["../src/contexts/menuGroupContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nconst MenuGroupContext = React.createContext<MenuGroupContextValue | undefined>(\n  undefined,\n) as React.Context<MenuGroupContextValue>;\n\nconst menuGroupContextDefaultValue: MenuGroupContextValue = {\n  headerId: '',\n};\n\n/**\n * Context used to guarantee correct aria-relationship between header\n * and group information\n */\nexport type MenuGroupContextValue = {\n  /**\n   * Element id applied to the `MenuGroupHeader` component\n   */\n  headerId: string;\n};\n\nexport const MenuGroupContextProvider = MenuGroupContext.Provider;\nexport const useMenuGroupContext_unstable = (): MenuGroupContextValue =>\n  React.useContext(MenuGroupContext) ?? menuGroupContextDefaultValue;\n"],"names":["React","MenuGroupContext","createContext","undefined","menuGroupContextDefaultValue","headerId","MenuGroupContextProvider","Provider","useMenuGroupContext_unstable","useContext"],"mappings":"AAAA;;;;;;;;;;;;4BAuBaM;;;gCACAE;;;;;iEAtBU,QAAQ;AAE/B,MAAMP,iCAAmBD,OAAME,aAAa,CAC1CC;AAGF,MAAMC,+BAAsD;IAC1DC,UAAU;AACZ;AAaO,MAAMC,2BAA2BL,iBAAiBM,QAAQ,CAAC;AAC3D,MAAMC,+BAA+B;QAC1CR;WAAAA,CAAAA,oBAAAA,OAAMS,UAAU,CAACR,iBAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAAsCI;EAA6B"}

package/lib-commonjs/contexts/menuListContext.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/contexts/menuListContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/menuListContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { ContextSelector, Context } from '@fluentui/react-context-selector';\nimport type { SelectableHandler } from '../selectable/index';\nimport type { MenuCheckedValueChangeData, MenuCheckedValueChangeEvent, MenuListProps } from '../components/index';\n\nexport const MenuListContext: Context<MenuListContextValue> = createContext<MenuListContextValue | undefined>(\n  undefined,\n) as Context<MenuListContextValue>;\n\nconst menuListContextDefaultValue: MenuListContextValue = {\n  checkedValues: {},\n  setFocusByFirstCharacter: () => null,\n  toggleCheckbox: () => null,\n  selectRadio: () => null,\n  hasIcons: false,\n  hasCheckmarks: false,\n};\n\n/**\n * Context shared between MenuList and its children components\n */\nexport type MenuListContextValue = Pick<MenuListProps, 'checkedValues' | 'hasIcons' | 'hasCheckmarks'> & {\n  setFocusByFirstCharacter?: (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => void;\n  toggleCheckbox?: SelectableHandler;\n  selectRadio?: SelectableHandler;\n  /**\n   * Callback when checked items change for value with a name\n   *\n   * @param event - React's original SyntheticEvent\n   * @param data - A data object with relevant information\n   *\n   * @deprecated this property is not used internally anymore,\n   * the signature remains just to avoid breaking changes\n   */\n  onCheckedValueChange?: (e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => void;\n};\n\nexport const MenuListProvider = MenuListContext.Provider;\n\nexport const useMenuListContext_unstable = <T,>(selector: ContextSelector<MenuListContextValue, T>) =>\n  useContextSelector(MenuListContext, (ctx = menuListContextDefaultValue) => selector(ctx));\n"],"names":["React","createContext","useContextSelector","MenuListContext","undefined","menuListContextDefaultValue","checkedValues","setFocusByFirstCharacter","toggleCheckbox","selectRadio","hasIcons","hasCheckmarks","MenuListProvider","Provider","useMenuListContext_unstable","selector","ctx"],"mappings":";;;;;;;;;;;IAMaG,eAAAA;;;oBAgCAS;;;+BAEAE;;;;;iEAxCU,QAAQ;sCACmB,mCAAmC;AAK9E,4BAAuDb,mCAAAA,EAC5DG,WACiC;AAEnC,MAAMC,8BAAoD;IACxDC,eAAe,CAAC;IAChBC,0BAA0B,IAAM;IAChCC,gBAAgB,IAAM;IACtBC,aAAa,IAAM;IACnBC,UAAU;IACVC,eAAe;AACjB;AAqBO,MAAMC,mBAAmBT,gBAAgBU,QAAQ,CAAC;AAElD,MAAMC,8BAA8B,CAAKC,eAC9Cb,wCAAAA,EAAmBC,iBAAiB,CAACa,MAAMX,2BAA2B,GAAKU,SAASC,MAAM"}
+{"version":3,"sources":["../src/contexts/menuListContext.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { ContextSelector, Context } from '@fluentui/react-context-selector';\nimport type { SelectableHandler } from '../selectable/index';\nimport type { MenuCheckedValueChangeData, MenuCheckedValueChangeEvent, MenuListProps } from '../components/index';\n\nexport const MenuListContext: Context<MenuListContextValue> = createContext<MenuListContextValue | undefined>(\n  undefined,\n) as Context<MenuListContextValue>;\n\nconst menuListContextDefaultValue: MenuListContextValue = {\n  checkedValues: {},\n  setFocusByFirstCharacter: () => null,\n  toggleCheckbox: () => null,\n  selectRadio: () => null,\n  hasIcons: false,\n  hasCheckmarks: false,\n};\n\n/**\n * Context shared between MenuList and its children components\n */\nexport type MenuListContextValue = Pick<MenuListProps, 'checkedValues' | 'hasIcons' | 'hasCheckmarks'> & {\n  setFocusByFirstCharacter?: (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => void;\n  toggleCheckbox?: SelectableHandler;\n  selectRadio?: SelectableHandler;\n  /**\n   * Callback when checked items change for value with a name\n   *\n   * @param event - React's original SyntheticEvent\n   * @param data - A data object with relevant information\n   *\n   * @deprecated this property is not used internally anymore,\n   * the signature remains just to avoid breaking changes\n   */\n  onCheckedValueChange?: (e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => void;\n};\n\nexport const MenuListProvider = MenuListContext.Provider;\n\nexport const useMenuListContext_unstable = <T,>(selector: ContextSelector<MenuListContextValue, T>): T =>\n  useContextSelector(MenuListContext, (ctx = menuListContextDefaultValue) => selector(ctx));\n"],"names":["React","createContext","useContextSelector","MenuListContext","undefined","menuListContextDefaultValue","checkedValues","setFocusByFirstCharacter","toggleCheckbox","selectRadio","hasIcons","hasCheckmarks","MenuListProvider","Provider","useMenuListContext_unstable","selector","ctx"],"mappings":"AAAA;;;;;;;;;;;;mBAQaG;;;oBAgCAS;;;+BAEAE;;;;;iEAxCU,QAAQ;sCACmB,mCAAmC;AAK9E,MAAMX,sBAAiDF,mCAAAA,EAC5DG,WACiC;AAEnC,MAAMC,8BAAoD;IACxDC,eAAe,CAAC;IAChBC,0BAA0B,IAAM;IAChCC,gBAAgB,IAAM;IACtBC,aAAa,IAAM;IACnBC,UAAU;IACVC,eAAe;AACjB;AAqBO,MAAMC,mBAAmBT,gBAAgBU,QAAQ,CAAC;AAElD,MAAMC,8BAA8B,CAAKC,eAC9Cb,wCAAAA,EAAmBC,iBAAiB,CAACa,MAAMX,2BAA2B,GAAKU,SAASC,MAAM"}

package/lib-commonjs/contexts/menuSplitGroupContext.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/contexts/menuSplitGroupContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/menuSplitGroupContext.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type MenuSplitGroupContextValue = {\n  setMultiline: (multiline: boolean) => void;\n};\n\n/**\n * Context used communicate with a child menu item that it is a trigger for a submenu\n */\nconst MenuSplitGroupContext = React.createContext<MenuSplitGroupContextValue | undefined>(\n  undefined,\n) as React.Context<MenuSplitGroupContextValue>;\n\nexport const menuSplitGroupContextDefaultValue = {\n  setMultiline: () => null,\n};\n\nexport const MenuSplitGroupContextProvider = MenuSplitGroupContext.Provider;\nexport const useMenuSplitGroupContext_unstable = () =>\n  React.useContext(MenuSplitGroupContext) ?? menuSplitGroupContextDefaultValue;\n\nexport const useIsInMenuSplitGroup = () => {\n  const context = useMenuSplitGroupContext_unstable();\n  return context !== menuSplitGroupContextDefaultValue;\n};\n"],"names":["React","MenuSplitGroupContext","createContext","undefined","menuSplitGroupContextDefaultValue","setMultiline","MenuSplitGroupContextProvider","Provider","useMenuSplitGroupContext_unstable","useContext","useIsInMenuSplitGroup","context"],"mappings":";;;;;;;;;;;IAiBaM,6BAAAA;;;qCAJAF;;;yBAQAM;;;IAHAF,iCAAAA;;;;;iEAlBU,QAAQ;AAM/B;;CAEC,GACD,MAAMP,sCAAwBD,OAAME,aAAa,CAC/CC;AAGK,MAAMC,oCAAoC;IAC/CC,cAAc,IAAM;AACtB,EAAE;AAEK,sCAAsCJ,sBAAsBM,QAAQ,CAAC;AACrE,0CAA0C;QAC/CP;WAAAA,CAAAA,oBAAAA,OAAMS,UAAU,CAACR,sBAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAA2CI;EAAkC;AAExE,MAAMM,wBAAwB;IACnC,MAAMC,UAAUH;IAChB,OAAOG,YAAYP;AACrB,EAAE"}
+{"version":3,"sources":["../src/contexts/menuSplitGroupContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nexport type MenuSplitGroupContextValue = {\n  setMultiline: (multiline: boolean) => void;\n};\n\n/**\n * Context used communicate with a child menu item that it is a trigger for a submenu\n */\nconst MenuSplitGroupContext = React.createContext<MenuSplitGroupContextValue | undefined>(\n  undefined,\n) as React.Context<MenuSplitGroupContextValue>;\n\nexport const menuSplitGroupContextDefaultValue = {\n  setMultiline: (): null => null,\n};\n\nexport const MenuSplitGroupContextProvider = MenuSplitGroupContext.Provider;\nexport const useMenuSplitGroupContext_unstable = (): MenuSplitGroupContextValue =>\n  React.useContext(MenuSplitGroupContext) ?? menuSplitGroupContextDefaultValue;\n\nexport const useIsInMenuSplitGroup = (): boolean => {\n  const context = useMenuSplitGroupContext_unstable();\n  return context !== menuSplitGroupContextDefaultValue;\n};\n"],"names":["React","MenuSplitGroupContext","createContext","undefined","menuSplitGroupContextDefaultValue","setMultiline","MenuSplitGroupContextProvider","Provider","useMenuSplitGroupContext_unstable","useContext","useIsInMenuSplitGroup","context"],"mappings":"AAAA;;;;;;;;;;;;iCAmBaM;;;qCAJAF;;;yBAQAM;;;IAHAF,iCAAAA;;;;;iEAlBU,QAAQ;AAM/B;;CAEC,GACD,MAAMP,sCAAwBD,OAAME,aAAa,CAC/CC;AAGK,MAAMC,oCAAoC;IAC/CC,cAAc,IAAY;AAC5B,EAAE;AAEK,MAAMC,gCAAgCL,sBAAsBM,QAAQ,CAAC;AACrE,0CAA0C;QAC/CP;WAAAA,CAAAA,oBAAAA,OAAMS,UAAU,CAACR,sBAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAA2CI;EAAkC;AAExE,MAAMM,wBAAwB;IACnC,MAAMC,UAAUH;IAChB,OAAOG,YAAYP;AACrB,EAAE"}

package/lib-commonjs/contexts/menuTriggerContext.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/contexts/menuTriggerContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/menuTriggerContext.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Context used communicate with a child menu item that it is a trigger for a submenu\n */\nconst MenuTriggerContext = React.createContext<boolean | undefined>(undefined) as React.Context<boolean>;\n\nconst menuTriggerContextDefaultValue = false;\n\nexport const MenuTriggerContextProvider = MenuTriggerContext.Provider;\nexport const useMenuTriggerContext_unstable = () =>\n  React.useContext(MenuTriggerContext) ?? menuTriggerContextDefaultValue;\n"],"names":["React","MenuTriggerContext","createContext","undefined","menuTriggerContextDefaultValue","MenuTriggerContextProvider","Provider","useMenuTriggerContext_unstable","useContext"],"mappings":";;;;;;;;;;;IASaK,0BAAAA;;;kCACAE;;;;;iEAVU,QAAQ;AAE/B;;CAEC,GACD,MAAMN,mCAAqBD,OAAME,aAAa,CAAsBC;AAEpE,MAAMC,iCAAiC;AAEhC,mCAAmCH,mBAAmBK,QAAQ,CAAC;AAC/D,MAAMC,iCAAiC;QAC5CP;WAAAA,CAAAA,oBAAAA,OAAMQ,UAAU,CAACP,mBAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAAwCI;EAA+B"}
+{"version":3,"sources":["../src/contexts/menuTriggerContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\n/**\n * Context used communicate with a child menu item that it is a trigger for a submenu\n */\nconst MenuTriggerContext = React.createContext<boolean | undefined>(undefined) as React.Context<boolean>;\n\nconst menuTriggerContextDefaultValue = false;\n\nexport const MenuTriggerContextProvider = MenuTriggerContext.Provider;\nexport const useMenuTriggerContext_unstable = (): boolean =>\n  React.useContext(MenuTriggerContext) ?? menuTriggerContextDefaultValue;\n"],"names":["React","MenuTriggerContext","createContext","undefined","menuTriggerContextDefaultValue","MenuTriggerContextProvider","Provider","useMenuTriggerContext_unstable","useContext"],"mappings":"AAAA;;;;;;;;;;;;8BAWaK;eAAAA;;kCACAE;;;;;iEAVU,QAAQ;AAE/B;;CAEC,GACD,MAAMN,mCAAqBD,OAAME,aAAa,CAAsBC;AAEpE,MAAMC,iCAAiC;AAEhC,mCAAmCH,mBAAmBK,QAAQ,CAAC;AAC/D,MAAMC,iCAAiC;QAC5CP;WAAAA,CAAAA,oBAAAA,OAAMQ,UAAU,CAACP,mBAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAAwCI;EAA+B"}

package/lib-commonjs/selectable/useCheckmarkStyles.styles.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/selectable/useCheckmarkStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useCheckmarkStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nconst useStyles = makeStyles({\n    root: {\n        width: '16px',\n        height: '16px',\n        visibility: 'hidden',\n        flexShrink: 0\n    },\n    rootChecked: {\n        visibility: 'visible',\n        flexShrink: 0\n    }\n});\n/**\n * Applies styles to a checkmark slot for selectable menu items\n *\n * @param state - should contain a `checkmark` slot\n */ export const useCheckmarkStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    if (state.checkmark) {\n        state.checkmark.className = mergeClasses(styles.root, state.checked && styles.rootChecked, state.checkmark.className);\n    }\n};\n"],"names":["mergeClasses","__styles","useStyles","root","a9b677","Bqenvij","Bcdw1i0","Bnnss6s","rootChecked","d","useCheckmarkStyles_unstable","state","styles","checkmark","className","checked"],"mappings":";;;;;;;eAiBiBU,2BAA2B;;;uBAjBH,gBAAgB;AACzD,MAAMR,SAAS,GAAA,WAAA,OAAGD,eAAA,EAAA;IAAAE,IAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,WAAA,EAAA;QAAAF,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAWjB,CAAC;AAKS,qCAAqCE,KAAK,IAAG;IACpD,aAAa;IACb,MAAMC,MAAM,GAAGV,SAAS,CAAC,CAAC;IAC1B,IAAIS,KAAK,CAACE,SAAS,EAAE;QACjBF,KAAK,CAACE,SAAS,CAACC,SAAS,OAAGd,mBAAY,EAACY,MAAM,CAACT,IAAI,EAAEQ,KAAK,CAACI,OAAO,IAAIH,MAAM,CAACJ,WAAW,EAAEG,KAAK,CAACE,SAAS,CAACC,SAAS,CAAC;IACzH;AACJ,CAAC"}
+{"version":3,"sources":["useCheckmarkStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nconst useStyles = makeStyles({\n    root: {\n        width: '16px',\n        height: '16px',\n        visibility: 'hidden',\n        flexShrink: 0\n    },\n    rootChecked: {\n        visibility: 'visible',\n        flexShrink: 0\n    }\n});\n/**\n * Applies styles to a checkmark slot for selectable menu items\n *\n * @param state - should contain a `checkmark` slot\n */ export const useCheckmarkStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    if (state.checkmark) {\n        state.checkmark.className = mergeClasses(styles.root, state.checked && styles.rootChecked, state.checkmark.className);\n    }\n};\n"],"names":["mergeClasses","__styles","useStyles","root","a9b677","Bqenvij","Bcdw1i0","Bnnss6s","rootChecked","d","useCheckmarkStyles_unstable","state","styles","checkmark","className","checked"],"mappings":"AAAA,YAAY;;;;;+BAkBKU,2BAA2B;;;;;;uBAjBH,gBAAgB;AACzD,MAAMR,SAAS,GAAA,WAAA,OAAGD,eAAA,EAAA;IAAAE,IAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,WAAA,EAAA;QAAAF,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAWjB,CAAC;AAKS,qCAAqCE,KAAK,IAAG;IACpD,aAAa;IACb,MAAMC,MAAM,GAAGV,SAAS,CAAC,CAAC;IAC1B,IAAIS,KAAK,CAACE,SAAS,EAAE;QACjBF,KAAK,CAACE,SAAS,CAACC,SAAS,OAAGd,mBAAY,EAACY,MAAM,CAACT,IAAI,EAAEQ,KAAK,CAACI,OAAO,IAAIH,MAAM,CAACJ,WAAW,EAAEG,KAAK,CAACE,SAAS,CAACC,SAAS,CAAC;IACzH;AACJ,CAAC"}

package/lib-commonjs/selectable/useCheckmarkStyles.styles.raw.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/selectable/useCheckmarkStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/selectable/useCheckmarkStyles.styles.ts"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuItemSelectableState } from './types';\nimport type { MenuItemState } from '../components/MenuItem/MenuItem.types';\n\nconst useStyles = makeStyles({\n  root: {\n    width: '16px',\n    height: '16px',\n    visibility: 'hidden',\n    flexShrink: 0,\n  },\n  rootChecked: {\n    visibility: 'visible',\n    flexShrink: 0,\n  },\n});\n\n/**\n * Applies styles to a checkmark slot for selectable menu items\n *\n * @param state - should contain a `checkmark` slot\n */\nexport const useCheckmarkStyles_unstable = (state: MenuItemSelectableState & Pick<MenuItemState, 'checkmark'>) => {\n  'use no memo';\n\n  const styles = useStyles();\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(\n      styles.root,\n      state.checked && styles.rootChecked,\n      state.checkmark.className,\n    );\n  }\n};\n"],"names":["mergeClasses","makeStyles","useStyles","root","width","height","visibility","flexShrink","rootChecked","useCheckmarkStyles_unstable","state","styles","checkmark","className","checked"],"mappings":";;;;+BAsBaS;;;;;;uBAtB4B,iBAAiB;AAI1D,MAAMP,gBAAYD,iBAAAA,EAAW;IAC3BE,MAAM;QACJC,OAAO;QACPC,QAAQ;QACRC,YAAY;QACZC,YAAY;IACd;IACAC,aAAa;QACXF,YAAY;QACZC,YAAY;IACd;AACF;AAOO,oCAAoC,CAACG;IAC1C;IAEA,MAAMC,SAAST;IACf,IAAIQ,MAAME,SAAS,EAAE;QACnBF,MAAME,SAAS,CAACC,SAAS,OAAGb,mBAAAA,EAC1BW,OAAOR,IAAI,EACXO,MAAMI,OAAO,IAAIH,OAAOH,WAAW,EACnCE,MAAME,SAAS,CAACC,SAAS;IAE7B;AACF,EAAE"}
+{"version":3,"sources":["../src/selectable/useCheckmarkStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuItemSelectableState } from './types';\nimport type { MenuItemState } from '../components/MenuItem/MenuItem.types';\n\nconst useStyles = makeStyles({\n  root: {\n    width: '16px',\n    height: '16px',\n    visibility: 'hidden',\n    flexShrink: 0,\n  },\n  rootChecked: {\n    visibility: 'visible',\n    flexShrink: 0,\n  },\n});\n\n/**\n * Applies styles to a checkmark slot for selectable menu items\n *\n * @param state - should contain a `checkmark` slot\n */\nexport const useCheckmarkStyles_unstable = (\n  state: MenuItemSelectableState & Pick<MenuItemState, 'checkmark'>,\n): void => {\n  'use no memo';\n\n  const styles = useStyles();\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(\n      styles.root,\n      state.checked && styles.rootChecked,\n      state.checkmark.className,\n    );\n  }\n};\n"],"names":["mergeClasses","makeStyles","useStyles","root","width","height","visibility","flexShrink","rootChecked","useCheckmarkStyles_unstable","state","styles","checkmark","className","checked"],"mappings":"AAAA;;;;;+BAwBaS;;;;;;uBAtB4B,iBAAiB;AAI1D,MAAMP,gBAAYD,iBAAAA,EAAW;IAC3BE,MAAM;QACJC,OAAO;QACPC,QAAQ;QACRC,YAAY;QACZC,YAAY;IACd;IACAC,aAAa;QACXF,YAAY;QACZC,YAAY;IACd;AACF;AAOO,oCAAoC,CACzCG;IAEA;IAEA,MAAMC,SAAST;IACf,IAAIQ,MAAME,SAAS,EAAE;QACnBF,MAAME,SAAS,CAACC,SAAS,OAAGb,mBAAAA,EAC1BW,OAAOR,IAAI,EACXO,MAAMI,OAAO,IAAIH,OAAOH,WAAW,EACnCE,MAAME,SAAS,CAACC,SAAS;IAE7B;AACF,EAAE"}

package/lib-commonjs/utils/index.js

@@ -26,8 +26,12 @@ _export(exports, {
     },
     useOnMenuSafeZoneTimeout: function() {
         return _useOnMenuSafeZoneTimeout.useOnMenuSafeZoneTimeout;
+    },
+    useValidateNesting: function() {
+        return _useValidateNesting.useValidateNesting;
     }
 });
 const _useOnMenuEnter = require("./useOnMenuEnter");
 const _useIsSubmenu = require("./useIsSubmenu");
+const _useValidateNesting = require("./useValidateNesting");
 const _useOnMenuSafeZoneTimeout = require("./useOnMenuSafeZoneTimeout");

package/lib-commonjs/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/index.ts"],"sourcesContent":["export { MENU_ENTER_EVENT, dispatchMenuEnterEvent, useOnMenuMouseEnter } from './useOnMenuEnter';\nexport { useIsSubmenu } from './useIsSubmenu';\nexport { MENU_SAFEZONE_TIMEOUT_EVENT, useOnMenuSafeZoneTimeout } from './useOnMenuSafeZoneTimeout';\n"],"names":["MENU_ENTER_EVENT","dispatchMenuEnterEvent","useOnMenuMouseEnter","useIsSubmenu","MENU_SAFEZONE_TIMEOUT_EVENT","useOnMenuSafeZoneTimeout"],"mappings":";;;;;;;;;;;;eAASA,gCAAgB;;;eAEhBI,qDAA2B;;;eAFTH,sCAAsB;;;eACxCE,0BAAY;;;eAD8BD,mCAAmB;;;eAEhCG,kDAAwB;;;gCAFgB,mBAAmB;8BACpE,iBAAiB;0CACwB,6BAA6B"}
+{"version":3,"sources":["../src/utils/index.ts"],"sourcesContent":["export { MENU_ENTER_EVENT, dispatchMenuEnterEvent, useOnMenuMouseEnter } from './useOnMenuEnter';\nexport { useIsSubmenu } from './useIsSubmenu';\nexport { useValidateNesting } from './useValidateNesting';\nexport { MENU_SAFEZONE_TIMEOUT_EVENT, useOnMenuSafeZoneTimeout } from './useOnMenuSafeZoneTimeout';\n"],"names":["MENU_ENTER_EVENT","dispatchMenuEnterEvent","useOnMenuMouseEnter","useIsSubmenu","useValidateNesting","MENU_SAFEZONE_TIMEOUT_EVENT","useOnMenuSafeZoneTimeout"],"mappings":";;;;;;;;;;;;eAASA,gCAAgB;;;eAGhBK,qDAA2B;;;eAHTJ,sCAAsB;;;eACxCE,0BAAY;;;eAD8BD,mCAAmB;;;eAGhCI,kDAAwB;;;eADrDF,sCAAkB;;;gCAFmD,mBAAmB;8BACpE,iBAAiB;oCACX,uBAAuB;0CACY,6BAA6B"}

package/lib-commonjs/utils/useIsSubmenu.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/utils/useIsSubmenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/useIsSubmenu.ts"],"sourcesContent":["import { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useMenuContext_unstable } from '../contexts/menuContext';\nimport { MenuListContext } from '../contexts/menuListContext';\n\n/**\n * A component can be a part of a submenu whether its menu context `isSubmenu` flag is true\n * or whether it is a part of a `MenuList`\n *\n * A simple hook to check box contexts easily\n *\n * @returns whether the component is part of a submenu\n */\nexport function useIsSubmenu() {\n  const menuContextValue = useMenuContext_unstable(context => context.isSubmenu);\n  const hasMenuListContext = useHasParentContext(MenuListContext);\n\n  return menuContextValue || hasMenuListContext;\n}\n"],"names":["useHasParentContext","useMenuContext_unstable","MenuListContext","useIsSubmenu","menuContextValue","context","isSubmenu","hasMenuListContext"],"mappings":";;;;;;;;;;sCAAoC,mCAAmC;6BAC/B,0BAA0B;iCAClC,8BAA8B;AAUvD,SAASG;IACd,MAAMC,uBAAmBH,oCAAAA,EAAwBI,CAAAA,UAAWA,QAAQC,SAAS;IAC7E,MAAMC,yBAAqBP,yCAAAA,EAAoBE,gCAAAA;IAE/C,OAAOE,oBAAoBG;AAC7B"}
+{"version":3,"sources":["../src/utils/useIsSubmenu.ts"],"sourcesContent":["'use client';\n\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useMenuContext_unstable } from '../contexts/menuContext';\nimport { MenuListContext } from '../contexts/menuListContext';\n\n/**\n * A component can be a part of a submenu whether its menu context `isSubmenu` flag is true\n * or whether it is a part of a `MenuList`\n *\n * A simple hook to check box contexts easily\n *\n * @returns whether the component is part of a submenu\n */\nexport function useIsSubmenu(): boolean {\n  const menuContextValue = useMenuContext_unstable(context => context.isSubmenu);\n  const hasMenuListContext = useHasParentContext(MenuListContext);\n\n  return menuContextValue || hasMenuListContext;\n}\n"],"names":["useHasParentContext","useMenuContext_unstable","MenuListContext","useIsSubmenu","menuContextValue","context","isSubmenu","hasMenuListContext"],"mappings":"AAAA;;;;;;;;;;;sCAEoC,mCAAmC;6BAC/B,0BAA0B;iCAClC,8BAA8B;AAUvD,SAASG;IACd,MAAMC,uBAAmBH,oCAAAA,EAAwBI,CAAAA,UAAWA,QAAQC,SAAS;IAC7E,MAAMC,yBAAqBP,yCAAAA,EAAoBE,gCAAAA;IAE/C,OAAOE,oBAAoBG;AAC7B"}

package/lib-commonjs/utils/useOnMenuEnter.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/utils/useOnMenuEnter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/useOnMenuEnter.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, elementContains } from '@fluentui/react-utilities';\nimport type { UseOnClickOrScrollOutsideOptions } from '@fluentui/react-utilities';\n\n/**\n * Name of the custom event\n */\nexport const MENU_ENTER_EVENT = 'fuimenuenter';\n\n/**\n * This hook works similarly to @see useOnClickOutside\n *\n * Problem: Trying to behave the same as system menus:\n * When the mouse leaves a stack of nested menus the stack should not dismiss.\n * However if the mouse leaves a stack of menus and enters a parent menu all its children menu should dismiss.\n *\n * We don't use the native mouseenter event because it would trigger too many times in the document\n * Instead, dispatch custom DOM event from the menu so that it can bubble\n * Each nested menu can use the listener to check if the event is from a child or parent menu\n */\nexport const useOnMenuMouseEnter = (options: UseOnClickOrScrollOutsideOptions) => {\n  const { refs, callback, element, disabled } = options;\n\n  // Keep mouse event here because this is essentially a custom 'mouseenter' event\n  const listener = useEventCallback((ev: MouseEvent) => {\n    const popoverRef = refs[0];\n    const someMenuPopover = ev.target as HTMLElement;\n\n    // someMenu is a child -> will always be contained because of vParents\n    // someMenu is a parent -> will always not be contained because no vParent\n    // someMenu is the current popover -> it will contain itself\n    const isOutsidePopover = !elementContains(popoverRef.current ?? null, someMenuPopover);\n\n    if (isOutsidePopover && !disabled) {\n      callback(ev);\n    }\n  });\n\n  React.useEffect(() => {\n    // eslint-disable-next-line eqeqeq\n    if (element == null) {\n      return;\n    }\n\n    /**\n     * Because `addEventListener` type override falls back to 2nd definition (evt name is unknown string literal)\n     * evt is being typed as a base class of MouseEvent -> `Event`.\n     * This type is used to override `listener` calls to make TS happy\n     */\n\n    type ListenerOverride = (evt: Event) => void;\n\n    if (!disabled) {\n      element.addEventListener(MENU_ENTER_EVENT, listener as ListenerOverride);\n    }\n\n    return () => {\n      element.removeEventListener(MENU_ENTER_EVENT, listener as ListenerOverride);\n    };\n  }, [listener, element, disabled]);\n};\n\n/**\n * Dispatches the custom MouseEvent enter event. Similar to calling `el.click()`\n * @param el - element for the event target\n * @param nativeEvent - the native mouse event this is mapped to\n */\nexport const dispatchMenuEnterEvent = (el: HTMLElement, nativeEvent: MouseEvent) => {\n  el.dispatchEvent(new CustomEvent(MENU_ENTER_EVENT, { bubbles: true, detail: { nativeEvent } }));\n};\n"],"names":["React","useEventCallback","elementContains","MENU_ENTER_EVENT","useOnMenuMouseEnter","options","refs","callback","element","disabled","listener","ev","popoverRef","someMenuPopover","target","isOutsidePopover","current","useEffect","addEventListener","removeEventListener","dispatchMenuEnterEvent","el","nativeEvent","dispatchEvent","CustomEvent","bubbles","detail"],"mappings":";;;;;;;;;;;IAOaG,gBAAAA;;;0BA4DAiB;;;uBA/CAhB;;;;;iEApBU,QAAQ;gCACmB,4BAA4B;AAMvE,yBAAyB,eAAe;AAaxC,MAAMA,sBAAsB,CAACC;IAClC,MAAM,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGJ;IAE9C,gFAAgF;IAChF,MAAMK,eAAWT,gCAAAA,EAAiB,CAACU;QACjC,MAAMC,aAAaN,IAAI,CAAC,EAAE;QAC1B,MAAMO,kBAAkBF,GAAGG,MAAM;YAKSF;QAH1C,sEAAsE;QACtE,0EAA0E;QAC1E,4DAA4D;QAC5D,MAAMG,mBAAmB,CAACb,mCAAAA,EAAgBU,CAAAA,sBAAAA,WAAWI,OAAAA,AAAO,MAAA,QAAlBJ,wBAAAA,KAAAA,IAAAA,sBAAsB,MAAMC;QAEtE,IAAIE,oBAAoB,CAACN,UAAU;YACjCF,SAASI;QACX;IACF;IAEAX,OAAMiB,SAAS,CAAC;QACd,kCAAkC;QAClC,IAAIT,WAAW,MAAM;YACnB;QACF;QAUA,IAAI,CAACC,UAAU;YACbD,QAAQU,gBAAgB,CAACf,kBAAkBO;QAC7C;QAEA,OAAO;YACLF,QAAQW,mBAAmB,CAAChB,kBAAkBO;QAChD;IACF,GAAG;QAACA;QAAUF;QAASC;KAAS;AAClC,EAAE;AAOK,MAAMW,yBAAyB,CAACC,IAAiBC;IACtDD,GAAGE,aAAa,CAAC,IAAIC,YAAYrB,kBAAkB;QAAEsB,SAAS;QAAMC,QAAQ;YAAEJ;QAAY;IAAE;AAC9F,EAAE"}
+{"version":3,"sources":["../src/utils/useOnMenuEnter.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useEventCallback, elementContains } from '@fluentui/react-utilities';\nimport type { UseOnClickOrScrollOutsideOptions } from '@fluentui/react-utilities';\n\n/**\n * Name of the custom event\n */\nexport const MENU_ENTER_EVENT = 'fuimenuenter';\n\n/**\n * This hook works similarly to @see useOnClickOutside\n *\n * Problem: Trying to behave the same as system menus:\n * When the mouse leaves a stack of nested menus the stack should not dismiss.\n * However if the mouse leaves a stack of menus and enters a parent menu all its children menu should dismiss.\n *\n * We don't use the native mouseenter event because it would trigger too many times in the document\n * Instead, dispatch custom DOM event from the menu so that it can bubble\n * Each nested menu can use the listener to check if the event is from a child or parent menu\n */\nexport const useOnMenuMouseEnter = (options: UseOnClickOrScrollOutsideOptions): void => {\n  const { refs, callback, element, disabled } = options;\n\n  // Keep mouse event here because this is essentially a custom 'mouseenter' event\n  const listener = useEventCallback((ev: MouseEvent) => {\n    const popoverRef = refs[0];\n    const someMenuPopover = ev.target as HTMLElement;\n\n    // someMenu is a child -> will always be contained because of vParents\n    // someMenu is a parent -> will always not be contained because no vParent\n    // someMenu is the current popover -> it will contain itself\n    const isOutsidePopover = !elementContains(popoverRef.current ?? null, someMenuPopover);\n\n    if (isOutsidePopover && !disabled) {\n      callback(ev);\n    }\n  });\n\n  React.useEffect(() => {\n    // eslint-disable-next-line eqeqeq\n    if (element == null) {\n      return;\n    }\n\n    /**\n     * Because `addEventListener` type override falls back to 2nd definition (evt name is unknown string literal)\n     * evt is being typed as a base class of MouseEvent -> `Event`.\n     * This type is used to override `listener` calls to make TS happy\n     */\n\n    type ListenerOverride = (evt: Event) => void;\n\n    if (!disabled) {\n      element.addEventListener(MENU_ENTER_EVENT, listener as ListenerOverride);\n    }\n\n    return () => {\n      element.removeEventListener(MENU_ENTER_EVENT, listener as ListenerOverride);\n    };\n  }, [listener, element, disabled]);\n};\n\n/**\n * Dispatches the custom MouseEvent enter event. Similar to calling `el.click()`\n * @param el - element for the event target\n * @param nativeEvent - the native mouse event this is mapped to\n */\nexport const dispatchMenuEnterEvent = (el: HTMLElement, nativeEvent: MouseEvent): void => {\n  el.dispatchEvent(new CustomEvent(MENU_ENTER_EVENT, { bubbles: true, detail: { nativeEvent } }));\n};\n"],"names":["React","useEventCallback","elementContains","MENU_ENTER_EVENT","useOnMenuMouseEnter","options","refs","callback","element","disabled","listener","ev","popoverRef","someMenuPopover","target","isOutsidePopover","current","useEffect","addEventListener","removeEventListener","dispatchMenuEnterEvent","el","nativeEvent","dispatchEvent","CustomEvent","bubbles","detail"],"mappings":"AAAA;;;;;;;;;;;;IASaG,gBAAAA;;;IA4DAiB,sBAAAA;;;uBA/CAhB;;;;;iEApBU,QAAQ;gCACmB,4BAA4B;AAMvE,yBAAyB,eAAe;AAaxC,MAAMA,sBAAsB,CAACC;IAClC,MAAM,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGJ;IAE9C,gFAAgF;IAChF,MAAMK,eAAWT,gCAAAA,EAAiB,CAACU;QACjC,MAAMC,aAAaN,IAAI,CAAC,EAAE;QAC1B,MAAMO,kBAAkBF,GAAGG,MAAM;YAKSF;QAH1C,sEAAsE;QACtE,0EAA0E;QAC1E,4DAA4D;QAC5D,MAAMG,mBAAmB,KAACb,+BAAAA,EAAgBU,CAAAA,sBAAAA,WAAWI,OAAAA,AAAO,MAAA,QAAlBJ,wBAAAA,KAAAA,IAAAA,sBAAsB,MAAMC;QAEtE,IAAIE,oBAAoB,CAACN,UAAU;YACjCF,SAASI;QACX;IACF;IAEAX,OAAMiB,SAAS,CAAC;QACd,kCAAkC;QAClC,IAAIT,WAAW,MAAM;YACnB;QACF;QAUA,IAAI,CAACC,UAAU;YACbD,QAAQU,gBAAgB,CAACf,kBAAkBO;QAC7C;QAEA,OAAO;YACLF,QAAQW,mBAAmB,CAAChB,kBAAkBO;QAChD;IACF,GAAG;QAACA;QAAUF;QAASC;KAAS;AAClC,EAAE;AAOK,+BAA+B,CAACY,IAAiBC;IACtDD,GAAGE,aAAa,CAAC,IAAIC,YAAYrB,kBAAkB;QAAEsB,SAAS;QAAMC,QAAQ;YAAEJ;QAAY;IAAE;AAC9F,EAAE"}

package/lib-commonjs/utils/useOnMenuSafeZoneTimeout.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/utils/useOnMenuSafeZoneTimeout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/useOnMenuSafeZoneTimeout.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Name of the custom event\n */\nexport const MENU_SAFEZONE_TIMEOUT_EVENT = 'fuimenusafezonetimeout';\n\n/**\n * This hook listeners on a menu trigger for a custom event for an indication that a safe zone was closed over the\n * matching item.\n */\nexport const useOnMenuSafeZoneTimeout = (listener: () => void) => {\n  const elementRef = React.useRef<HTMLElement | null>(null);\n\n  return React.useCallback(\n    (element: HTMLElement | null) => {\n      elementRef.current?.removeEventListener(MENU_SAFEZONE_TIMEOUT_EVENT, listener);\n      element?.addEventListener(MENU_SAFEZONE_TIMEOUT_EVENT, listener);\n\n      elementRef.current = element;\n    },\n    [listener],\n  );\n};\n"],"names":["React","MENU_SAFEZONE_TIMEOUT_EVENT","useOnMenuSafeZoneTimeout","listener","elementRef","useRef","useCallback","element","current","removeEventListener","addEventListener"],"mappings":";;;;;;;;;;;IAKaC,2BAAAA;;;4BAMAC;;;;;iEAXU,QAAQ;AAKxB,oCAAoC,yBAAyB;AAM7D,MAAMA,2BAA2B,CAACC;IACvC,MAAMC,aAAaJ,OAAMK,MAAM,CAAqB;IAEpD,OAAOL,OAAMM,WAAW,CACtB,CAACC;YACCH;SAAAA,sBAAAA,WAAWI,OAAAA,AAAO,MAAA,QAAlBJ,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAoBK,mBAAmB,CAACR,6BAA6BE;QACrEI,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASG,gBAAgB,CAACT,6BAA6BE;QAEvDC,WAAWI,OAAO,GAAGD;IACvB,GACA;QAACJ;KAAS;AAEd,EAAE"}
+{"version":3,"sources":["../src/utils/useOnMenuSafeZoneTimeout.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\n/**\n * Name of the custom event\n */\nexport const MENU_SAFEZONE_TIMEOUT_EVENT = 'fuimenusafezonetimeout';\n\n/**\n * This hook listeners on a menu trigger for a custom event for an indication that a safe zone was closed over the\n * matching item.\n */\nexport const useOnMenuSafeZoneTimeout = (listener: () => void): ((element: HTMLElement | null) => void) => {\n  const elementRef = React.useRef<HTMLElement | null>(null);\n\n  return React.useCallback(\n    (element: HTMLElement | null) => {\n      elementRef.current?.removeEventListener(MENU_SAFEZONE_TIMEOUT_EVENT, listener);\n      element?.addEventListener(MENU_SAFEZONE_TIMEOUT_EVENT, listener);\n\n      elementRef.current = element;\n    },\n    [listener],\n  );\n};\n"],"names":["React","MENU_SAFEZONE_TIMEOUT_EVENT","useOnMenuSafeZoneTimeout","listener","elementRef","useRef","useCallback","element","current","removeEventListener","addEventListener"],"mappings":"AAAA;;;;;;;;;;;;IAOaC,2BAAAA;;;4BAMAC;;;;;iEAXU,QAAQ;AAKxB,oCAAoC,yBAAyB;AAM7D,MAAMA,2BAA2B,CAACC;IACvC,MAAMC,aAAaJ,OAAMK,MAAM,CAAqB;IAEpD,OAAOL,OAAMM,WAAW,CACtB,CAACC;YACCH;SAAAA,sBAAAA,WAAWI,OAAAA,AAAO,MAAA,QAAlBJ,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAoBK,mBAAmB,CAACR,6BAA6BE;QACrEI,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASG,gBAAgB,CAACT,6BAA6BE;QAEvDC,WAAWI,OAAO,GAAGD;IACvB,GACA;QAACJ;KAAS;AAEd,EAAE"}

package/lib-commonjs/utils/useValidateNesting.js

@@ -0,0 +1,91 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useValidateNesting", {
+    enumerable: true,
+    get: function() {
+        return useValidateNesting;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _menuContext = require("../contexts/menuContext");
+const useValidateNesting = (componentName)=>{
+    'use no memo';
+    const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
+    const triggerRef = (0, _menuContext.useMenuContext_unstable)((context)=>context.triggerRef);
+    const inline = (0, _menuContext.useMenuContext_unstable)((context)=>context.inline);
+    const ref = _react.useRef(null);
+    if (process.env.NODE_ENV !== 'production') {
+        // This check should run only in development mode
+        // It's okay to disable the ESLint rule because we ar checking env variable statically (not at runtime)
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        _react.useEffect(()=>{
+            let ancestor = ref.current;
+            let ancestorComponentName = '';
+            do {
+                var _ancestor_parentElement;
+                ancestor = (_ancestor_parentElement = ancestor === null || ancestor === void 0 ? void 0 : ancestor.parentElement) !== null && _ancestor_parentElement !== void 0 ? _ancestor_parentElement : null;
+                if (ancestor === null || ancestor === void 0 ? void 0 : ancestor.classList.contains('fui-MenuList')) {
+                    break;
+                } else if (ancestor === null || ancestor === void 0 ? void 0 : ancestor.classList.contains('fui-MenuGrid')) {
+                    ancestorComponentName = 'MenuGrid';
+                } else if (ancestor === null || ancestor === void 0 ? void 0 : ancestor.classList.contains('fui-MenuGridItem')) {
+                    ancestorComponentName = 'MenuGridItem';
+                } else if (ancestor === null || ancestor === void 0 ? void 0 : ancestor.classList.contains('fui-MenuGridRow')) {
+                    ancestorComponentName = 'MenuGridRow';
+                } else if (ancestor === null || ancestor === void 0 ? void 0 : ancestor.classList.contains('fui-MenuGridCell')) {
+                    ancestorComponentName = 'MenuGridCell';
+                }
+                if ([
+                    'MenuItem',
+                    'MenuItemCheckbox',
+                    'MenuItemRadio'
+                ].includes(componentName)) {
+                    if ([
+                        'MenuGrid',
+                        'MenuGridItem',
+                        'MenuGridRow',
+                        'MenuGridCell'
+                    ].includes(ancestorComponentName)) {
+                        throw new Error(`${componentName} is incorrectly nested within ${ancestorComponentName}. You probably want to wrap it in a MenuList instead.`);
+                    }
+                } else if (componentName === 'MenuList') {
+                    if (ancestorComponentName === 'MenuGridCell') {
+                        if (inline && getCellOfTrigger(triggerRef.current, targetDocument) === ancestor) {
+                            break;
+                        }
+                        throw new Error(`MenuList is incorrectly nested within MenuGridCell.`);
+                    } else if ([
+                        'MenuGrid',
+                        'MenuGridItem',
+                        'MenuGridRow'
+                    ].includes(ancestorComponentName)) {
+                        throw new Error(`MenuList is incorrectly nested within ${ancestorComponentName}.`);
+                    }
+                }
+            }while (ancestor && ancestor !== (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.body))
+        }, [
+            componentName,
+            ref,
+            triggerRef,
+            inline,
+            targetDocument
+        ]);
+    }
+    return ref;
+};
+const getCellOfTrigger = (trigger, targetDocument)=>{
+    let ancestor = trigger === null || trigger === void 0 ? void 0 : trigger.parentElement;
+    while(ancestor && ancestor !== (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.body)){
+        if (ancestor === null || ancestor === void 0 ? void 0 : ancestor.classList.contains('fui-MenuGridCell')) {
+            return ancestor;
+        }
+        var _ancestor_parentElement;
+        ancestor = (_ancestor_parentElement = ancestor === null || ancestor === void 0 ? void 0 : ancestor.parentElement) !== null && _ancestor_parentElement !== void 0 ? _ancestor_parentElement : null;
+    }
+    return null;
+};

package/lib-commonjs/utils/useValidateNesting.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/useValidateNesting.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\nimport type { MenuContextValue } from '../contexts/menuContext';\nimport { useMenuContext_unstable } from '../contexts/menuContext';\n\ntype NestingComponentName = 'MenuList' | 'MenuItem' | 'MenuItemCheckbox' | 'MenuItemRadio';\n\nexport const useValidateNesting = (componentName: NestingComponentName): React.RefObject<HTMLElement | null> => {\n  'use no memo';\n\n  const { targetDocument } = useFluent();\n  const triggerRef = useMenuContext_unstable((context: MenuContextValue) => context.triggerRef);\n  const inline = useMenuContext_unstable((context: MenuContextValue) => context.inline);\n  const ref = React.useRef<HTMLElement | null>(null);\n\n  if (process.env.NODE_ENV !== 'production') {\n    // This check should run only in development mode\n    // It's okay to disable the ESLint rule because we ar checking env variable statically (not at runtime)\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    React.useEffect(() => {\n      let ancestor = ref.current;\n      let ancestorComponentName = '';\n      do {\n        ancestor = ancestor?.parentElement ?? null;\n        if (ancestor?.classList.contains('fui-MenuList')) {\n          break;\n        } else if (ancestor?.classList.contains('fui-MenuGrid')) {\n          ancestorComponentName = 'MenuGrid';\n        } else if (ancestor?.classList.contains('fui-MenuGridItem')) {\n          ancestorComponentName = 'MenuGridItem';\n        } else if (ancestor?.classList.contains('fui-MenuGridRow')) {\n          ancestorComponentName = 'MenuGridRow';\n        } else if (ancestor?.classList.contains('fui-MenuGridCell')) {\n          ancestorComponentName = 'MenuGridCell';\n        }\n        if (['MenuItem', 'MenuItemCheckbox', 'MenuItemRadio'].includes(componentName)) {\n          if (['MenuGrid', 'MenuGridItem', 'MenuGridRow', 'MenuGridCell'].includes(ancestorComponentName)) {\n            throw new Error(\n              `${componentName} is incorrectly nested within ${ancestorComponentName}. You probably want to wrap it in a MenuList instead.`,\n            );\n          }\n        } else if (componentName === 'MenuList') {\n          if (ancestorComponentName === 'MenuGridCell') {\n            if (inline && getCellOfTrigger(triggerRef.current, targetDocument) === ancestor) {\n              break;\n            }\n            throw new Error(`MenuList is incorrectly nested within MenuGridCell.`);\n          } else if (['MenuGrid', 'MenuGridItem', 'MenuGridRow'].includes(ancestorComponentName)) {\n            throw new Error(`MenuList is incorrectly nested within ${ancestorComponentName}.`);\n          }\n        }\n      } while (ancestor && ancestor !== targetDocument?.body);\n    }, [componentName, ref, triggerRef, inline, targetDocument]);\n  }\n  return ref;\n};\n\nconst getCellOfTrigger = (trigger: HTMLElement | null, targetDocument?: Document): HTMLElement | null => {\n  let ancestor = trigger?.parentElement;\n  while (ancestor && ancestor !== targetDocument?.body) {\n    if (ancestor?.classList.contains('fui-MenuGridCell')) {\n      return ancestor;\n    }\n    ancestor = ancestor?.parentElement ?? null;\n  }\n  return null;\n};\n"],"names":["React","useFluent_unstable","useFluent","useMenuContext_unstable","useValidateNesting","componentName","targetDocument","triggerRef","context","inline","ref","useRef","process","env","NODE_ENV","useEffect","ancestor","current","ancestorComponentName","parentElement","classList","contains","includes","Error","getCellOfTrigger","body","trigger"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-menu",
-  "version": "9.19.5",
+  "version": "9.20.0",
   "description": "Fluent UI menu component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -21,24 +21,24 @@
   },
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.8",
-    "@fluentui/react-aria": "^9.16.4",
-    "@fluentui/react-context-selector": "^9.2.6",
+    "@fluentui/react-aria": "^9.17.1",
+    "@fluentui/react-context-selector": "^9.2.8",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-portal": "^9.8.1",
-    "@fluentui/react-positioning": "^9.20.4",
-    "@fluentui/react-shared-contexts": "^9.25.0",
-    "@fluentui/react-tabster": "^9.26.4",
+    "@fluentui/react-portal": "^9.8.3",
+    "@fluentui/react-positioning": "^9.20.6",
+    "@fluentui/react-shared-contexts": "^9.25.2",
+    "@fluentui/react-tabster": "^9.26.6",
     "@fluentui/react-theme": "^9.2.0",
-    "@fluentui/react-utilities": "^9.24.0",
-    "@fluentui/react-jsx-runtime": "^9.1.6",
+    "@fluentui/react-utilities": "^9.25.0",
+    "@fluentui/react-jsx-runtime": "^9.2.1",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1"
   },
   "peerDependencies": {
-    "@types/react": ">=16.14.0 <19.0.0",
-    "@types/react-dom": ">=16.9.0 <19.0.0",
-    "react": ">=16.14.0 <19.0.0",
-    "react-dom": ">=16.14.0 <19.0.0"
+    "@types/react": ">=16.14.0 <20.0.0",
+    "@types/react-dom": ">=16.9.0 <20.0.0",
+    "react": ">=16.14.0 <20.0.0",
+    "react-dom": ">=16.14.0 <20.0.0"
   },
   "beachball": {
     "disallowedChangeTypes": [