npm - @fluentui/react-menu - Versions diffs - 9.25.0 → 9.25.1 - Mend

@fluentui/react-menu 9.25.0 → 9.25.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (118) hide show

package/lib/components/MenuItemLink/useMenuItemLinkStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__styles","mergeClasses","useMenuItemStyles_unstable","menuItemLinkClassNames","root","icon","checkmark","content","secondaryContent","useStyles","resetLink","w71qe1","Bkioxbp","I8pafv","dvvfom","d","useMenuItemLinkStyles_unstable","state","styles","className"],"sources":["useMenuItemLinkStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuItemLinkClassNames = {\n root: 'fui-MenuItemLink',\n icon: 'fui-MenuItemLink__icon',\n checkmark: 'fui-MenuItemLink__checkmark',\n content: 'fui-MenuItemLink__content',\n secondaryContent: 'fui-MenuItemLink__secondaryContent'\n};\n/*\n Styles for the root slot\n / const useStyles = makeStyles({\n resetLink: {\n textDecorationLine: 'none',\n textDecorationThickness: 'initial',\n textDecorationStyle: 'initial',\n textDecorationColor: 'initial'\n }\n});\n/\n Apply styling to the MenuItemLink slots based on the state\n */ export const useMenuItemLinkStyles_unstable = (state)=>{\n ~~'use no memo';\n~~ useMenuItemStyles_unstable(state);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemLinkClassNames.root, styles.resetLink, state.root.className);\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemLinkClassNames.icon, state.icon.className);\n }\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemLinkClassNames.content, state.content.className);\n }\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(menuItemLinkClassNames.secondaryContent, state.secondaryContent.className);\n }\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemLinkClassNames.checkmark, state.checkmark.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,0BAA0B,QAAQ,sCAAsC;AACjF,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE,kBAAkB;EACxBC,IAAI,EAAE,wBAAwB;EAC9BC,SAAS,EAAE,6BAA6B;EACxCC,OAAO,EAAE,2BAA2B;EACpCC,gBAAgB,EAAE;AACtB,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGT,QAAA;EAAAU,SAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAOrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,8BAA8B,GAAIC,KAAK,IAAG;~~EACvD~~,~~aAAa;;EACbf,~~0BAA0B,CAACe,KAAK,CAAC;EACjC,MAAMC,MAAM,GAAGT,SAAS,CAAC,CAAC;EAC1B;EACAQ,KAAK,CAACb,IAAI,CAACe,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACC,IAAI,EAAEc,MAAM,CAACR,SAAS,EAAEO,KAAK,CAACb,IAAI,CAACe,SAAS,CAAC;EACxG,IAAIF,KAAK,CAACZ,IAAI,EAAE;IACZ;IACAY,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACE,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAC1F;EACA,IAAIF,KAAK,CAACV,OAAO,EAAE;IACf;IACAU,KAAK,CAACV,OAAO,CAACY,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACI,OAAO,EAAEU,KAAK,CAACV,OAAO,CAACY,SAAS,CAAC;EACnG;EACA,IAAIF,KAAK,CAACT,gBAAgB,EAAE;IACxB;IACAS,KAAK,CAACT,gBAAgB,CAACW,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACK,gBAAgB,EAAES,KAAK,CAACT,gBAAgB,CAACW,SAAS,CAAC;EAC9H;EACA,IAAIF,KAAK,CAACX,SAAS,EAAE;IACjB;IACAW,KAAK,CAACX,SAAS,CAACa,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACG,SAAS,EAAEW,KAAK,CAACX,SAAS,CAACa,SAAS,CAAC;EACzG;EACA,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["__styles","mergeClasses","useMenuItemStyles_unstable","menuItemLinkClassNames","root","icon","checkmark","content","secondaryContent","useStyles","resetLink","w71qe1","Bkioxbp","I8pafv","dvvfom","d","useMenuItemLinkStyles_unstable","state","styles","className"],"sources":["useMenuItemLinkStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuItemLinkClassNames = {\n root: 'fui-MenuItemLink',\n icon: 'fui-MenuItemLink__icon',\n checkmark: 'fui-MenuItemLink__checkmark',\n content: 'fui-MenuItemLink__content',\n secondaryContent: 'fui-MenuItemLink__secondaryContent'\n};\n/*\n Styles for the root slot\n / const useStyles = makeStyles({\n resetLink: {\n textDecorationLine: 'none',\n textDecorationThickness: 'initial',\n textDecorationStyle: 'initial',\n textDecorationColor: 'initial'\n }\n});\n/\n Apply styling to the MenuItemLink slots based on the state\n */ export const useMenuItemLinkStyles_unstable = (state)=>{\n useMenuItemStyles_unstable(state);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemLinkClassNames.root, styles.resetLink, state.root.className);\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemLinkClassNames.icon, state.icon.className);\n }\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemLinkClassNames.content, state.content.className);\n }\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(menuItemLinkClassNames.secondaryContent, state.secondaryContent.className);\n }\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemLinkClassNames.checkmark, state.checkmark.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,0BAA0B,QAAQ,sCAAsC;AACjF,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE,kBAAkB;EACxBC,IAAI,EAAE,wBAAwB;EAC9BC,SAAS,EAAE,6BAA6B;EACxCC,OAAO,EAAE,2BAA2B;EACpCC,gBAAgB,EAAE;AACtB,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGT,QAAA;EAAAU,SAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAOrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,8BAA8B,GAAIC,KAAK,IAAG;EACvDf,0BAA0B,CAACe,KAAK,CAAC;EACjC,MAAMC,MAAM,GAAGT,SAAS,CAAC,CAAC;EAC1B;EACAQ,KAAK,CAACb,IAAI,CAACe,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACC,IAAI,EAAEc,MAAM,CAACR,SAAS,EAAEO,KAAK,CAACb,IAAI,CAACe,SAAS,CAAC;EACxG,IAAIF,KAAK,CAACZ,IAAI,EAAE;IACZ;IACAY,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACE,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAC1F;EACA,IAAIF,KAAK,CAACV,OAAO,EAAE;IACf;IACAU,KAAK,CAACV,OAAO,CAACY,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACI,OAAO,EAAEU,KAAK,CAACV,OAAO,CAACY,SAAS,CAAC;EACnG;EACA,IAAIF,KAAK,CAACT,gBAAgB,EAAE;IACxB;IACAS,KAAK,CAACT,gBAAgB,CAACW,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACK,gBAAgB,EAAES,KAAK,CAACT,gBAAgB,CAACW,SAAS,CAAC;EAC9H;EACA,IAAIF,KAAK,CAACX,SAAS,EAAE;IACjB;IACAW,KAAK,CAACX,SAAS,CAACa,SAAS,GAAGlB,YAAY,CAACE,sBAAsB,CAACG,SAAS,EAAEW,KAAK,CAACX,SAAS,CAACa,SAAS,CAAC;EACzG;EACA,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/MenuItemLink/useMenuItemLinkStyles.styles.raw.js CHANGED Viewed

@@ -21,7 +21,6 @@ export const menuItemLinkClassNames = {
 /**
  * Apply styling to the MenuItemLink slots based on the state
  */ export const useMenuItemLinkStyles_unstable = (state)=>{
-    'use no memo';
     useMenuItemStyles_unstable(state);
     const styles = useStyles();
     // eslint-disable-next-line react-hooks/immutability

package/lib/components/MenuItemLink/useMenuItemLinkStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/MenuItemLink/useMenuItemLinkStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { MenuItemLinkSlots, MenuItemLinkState } from './MenuItemLink.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nimport type { MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport const menuItemLinkClassNames: SlotClassNames<MenuItemLinkSlots> = {\n root: 'fui-MenuItemLink',\n icon: 'fui-MenuItemLink__icon',\n checkmark: 'fui-MenuItemLink__checkmark',\n content: 'fui-MenuItemLink__content',\n secondaryContent: 'fui-MenuItemLink__secondaryContent',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n resetLink: {\n textDecorationLine: 'none',\n textDecorationThickness: 'initial',\n textDecorationStyle: 'initial',\n textDecorationColor: 'initial',\n },\n});\n\n/\n Apply styling to the MenuItemLink slots based on the state\n */\nexport const useMenuItemLinkStyles_unstable = (state: MenuItemLinkState): MenuItemLinkState => {\n ~~'use no memo';\n\n~~ useMenuItemStyles_unstable(state as MenuItemState);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemLinkClassNames.root, styles.resetLink, state.root.className);\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemLinkClassNames.icon, state.icon.className);\n }\n\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemLinkClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemLinkClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemLinkClassNames.checkmark, state.checkmark.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useMenuItemStyles_unstable","menuItemLinkClassNames","root","icon","checkmark","content","secondaryContent","useStyles","resetLink","textDecorationLine","textDecorationThickness","textDecorationStyle","textDecorationColor","useMenuItemLinkStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,SAASC,0BAA0B,QAAQ,uCAAuC;AAGlF,OAAO,MAAMC,yBAA4D;IACvEC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;AACpB,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYT,WAAW;IAC3BU,WAAW;QACTC,oBAAoB;QACpBC,yBAAyB;QACzBC,qBAAqB;QACrBC,qBAAqB;IACvB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,iCAAiC,CAACC;~~IAC7C;IAEAd~~,2BAA2Bc;IAC3B,MAAMC,SAASR;IACf,oDAAoD;IACpDO,MAAMZ,IAAI,CAACc,SAAS,GAAGjB,aAAaE,uBAAuBC,IAAI,EAAEa,OAAOP,SAAS,EAAEM,MAAMZ,IAAI,CAACc,SAAS;IAEvG,IAAIF,MAAMX,IAAI,EAAE;QACd,oDAAoD;QACpDW,MAAMX,IAAI,CAACa,SAAS,GAAGjB,aAAaE,uBAAuBE,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IACvF;IAEA,IAAIF,MAAMT,OAAO,EAAE;QACjB,oDAAoD;QACpDS,MAAMT,OAAO,CAACW,SAAS,GAAGjB,aAAaE,uBAAuBI,OAAO,EAAES,MAAMT,OAAO,CAACW,SAAS;IAChG;IAEA,IAAIF,MAAMR,gBAAgB,EAAE;QAC1B,oDAAoD;QACpDQ,MAAMR,gBAAgB,CAACU,SAAS,GAAGjB,aACjCE,uBAAuBK,gBAAgB,EACvCQ,MAAMR,gBAAgB,CAACU,SAAS;IAEpC;IAEA,IAAIF,MAAMV,SAAS,EAAE;QACnB,oDAAoD;QACpDU,MAAMV,SAAS,CAACY,SAAS,GAAGjB,aAAaE,uBAAuBG,SAAS,EAAEU,MAAMV,SAAS,CAACY,SAAS;IACtG;IAEA,OAAOF;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/MenuItemLink/useMenuItemLinkStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { MenuItemLinkSlots, MenuItemLinkState } from './MenuItemLink.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nimport type { MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport const menuItemLinkClassNames: SlotClassNames<MenuItemLinkSlots> = {\n root: 'fui-MenuItemLink',\n icon: 'fui-MenuItemLink__icon',\n checkmark: 'fui-MenuItemLink__checkmark',\n content: 'fui-MenuItemLink__content',\n secondaryContent: 'fui-MenuItemLink__secondaryContent',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n resetLink: {\n textDecorationLine: 'none',\n textDecorationThickness: 'initial',\n textDecorationStyle: 'initial',\n textDecorationColor: 'initial',\n },\n});\n\n/\n Apply styling to the MenuItemLink slots based on the state\n */\nexport const useMenuItemLinkStyles_unstable = (state: MenuItemLinkState): MenuItemLinkState => {\n useMenuItemStyles_unstable(state as MenuItemState);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemLinkClassNames.root, styles.resetLink, state.root.className);\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemLinkClassNames.icon, state.icon.className);\n }\n\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemLinkClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemLinkClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemLinkClassNames.checkmark, state.checkmark.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useMenuItemStyles_unstable","menuItemLinkClassNames","root","icon","checkmark","content","secondaryContent","useStyles","resetLink","textDecorationLine","textDecorationThickness","textDecorationStyle","textDecorationColor","useMenuItemLinkStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,SAASC,0BAA0B,QAAQ,uCAAuC;AAGlF,OAAO,MAAMC,yBAA4D;IACvEC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;AACpB,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYT,WAAW;IAC3BU,WAAW;QACTC,oBAAoB;QACpBC,yBAAyB;QACzBC,qBAAqB;QACrBC,qBAAqB;IACvB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,iCAAiC,CAACC;IAC7Cd,2BAA2Bc;IAC3B,MAAMC,SAASR;IACf,oDAAoD;IACpDO,MAAMZ,IAAI,CAACc,SAAS,GAAGjB,aAAaE,uBAAuBC,IAAI,EAAEa,OAAOP,SAAS,EAAEM,MAAMZ,IAAI,CAACc,SAAS;IAEvG,IAAIF,MAAMX,IAAI,EAAE;QACd,oDAAoD;QACpDW,MAAMX,IAAI,CAACa,SAAS,GAAGjB,aAAaE,uBAAuBE,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IACvF;IAEA,IAAIF,MAAMT,OAAO,EAAE;QACjB,oDAAoD;QACpDS,MAAMT,OAAO,CAACW,SAAS,GAAGjB,aAAaE,uBAAuBI,OAAO,EAAES,MAAMT,OAAO,CAACW,SAAS;IAChG;IAEA,IAAIF,MAAMR,gBAAgB,EAAE;QAC1B,oDAAoD;QACpDQ,MAAMR,gBAAgB,CAACU,SAAS,GAAGjB,aACjCE,uBAAuBK,gBAAgB,EACvCQ,MAAMR,gBAAgB,CAACU,SAAS;IAEpC;IAEA,IAAIF,MAAMV,SAAS,EAAE;QACnB,oDAAoD;QACpDU,MAAMV,SAAS,CAACY,SAAS,GAAGjB,aAAaE,uBAAuBG,SAAS,EAAEU,MAAMV,SAAS,CAACY,SAAS;IACtG;IAEA,OAAOF;AACT,EAAE"}

package/lib/components/MenuItemRadio/useMenuItemRadioStyles.styles.js CHANGED Viewed

@@ -12,8 +12,6 @@ export const menuItemRadioClassNames = {
   subText: 'fui-MenuItemRadio__subText'
 };
 export const useMenuItemRadioStyles_unstable = state => {
-  'use no memo';
   // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);
   if (state.content) {

package/lib/components/MenuItemRadio/useMenuItemRadioStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemRadioClassNames","root","icon","checkmark","content","secondaryContent","subText","useMenuItemRadioStyles_unstable","state","className"],"sources":["useMenuItemRadioStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuItemRadioClassNames = {\n root: 'fui-MenuItemRadio',\n icon: 'fui-MenuItemRadio__icon',\n checkmark: 'fui-MenuItemRadio__checkmark',\n content: 'fui-MenuItemRadio__content',\n secondaryContent: 'fui-MenuItemRadio__secondaryContent',\n subText: 'fui-MenuItemRadio__subText'\n};\nexport const useMenuItemRadioStyles_unstable = (state)=>{\n ~~'use no memo';\n~~ // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);\n }\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(menuItemRadioClassNames.secondaryContent, state.secondaryContent.className);\n }\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);\n }\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);\n }\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemRadioClassNames.subText, state.subText.className);\n }\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,2BAA2B,QAAQ,wBAAwB;AACpE,SAASC,0BAA0B,QAAQ,sCAAsC;AACjF,OAAO,MAAMC,uBAAuB,GAAG;EACnCC,IAAI,EAAE,mBAAmB;EACzBC,IAAI,EAAE,yBAAyB;EAC/BC,SAAS,EAAE,8BAA8B;EACzCC,OAAO,EAAE,4BAA4B;EACrCC,gBAAgB,EAAE,qCAAqC;EACvDC,OAAO,EAAE;AACb,CAAC;AACD,OAAO,MAAMC,+BAA+B,GAAIC,KAAK,IAAG;EACpD~~,aAAa;;EACb~~;EACAA,KAAK,CAACP,IAAI,CAACQ,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACC,IAAI,EAAEO,KAAK,CAACP,IAAI,CAACQ,SAAS,CAAC;EACvF,IAAID,KAAK,CAACJ,OAAO,EAAE;IACf;IACAI,KAAK,CAACJ,OAAO,CAACK,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACI,OAAO,EAAEI,KAAK,CAACJ,OAAO,CAACK,SAAS,CAAC;EACpG;EACA,IAAID,KAAK,CAACH,gBAAgB,EAAE;IACxB;IACAG,KAAK,CAACH,gBAAgB,CAACI,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACK,gBAAgB,EAAEG,KAAK,CAACH,gBAAgB,CAACI,SAAS,CAAC;EAC/H;EACA,IAAID,KAAK,CAACN,IAAI,EAAE;IACZ;IACAM,KAAK,CAACN,IAAI,CAACO,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACE,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACO,SAAS,CAAC;EAC3F;EACA,IAAID,KAAK,CAACL,SAAS,EAAE;IACjB;IACAK,KAAK,CAACL,SAAS,CAACM,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACG,SAAS,EAAEK,KAAK,CAACL,SAAS,CAACM,SAAS,CAAC;EAC1G;EACA,IAAID,KAAK,CAACF,OAAO,EAAE;IACf;IACAE,KAAK,CAACF,OAAO,CAACG,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACM,OAAO,EAAEE,KAAK,CAACF,OAAO,CAACG,SAAS,CAAC;EACpG;EACAV,0BAA0B,CAACS,KAAK,CAAC;EACjCV,2BAA2B,CAACU,KAAK,CAAC;AACtC,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemRadioClassNames","root","icon","checkmark","content","secondaryContent","subText","useMenuItemRadioStyles_unstable","state","className"],"sources":["useMenuItemRadioStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuItemRadioClassNames = {\n root: 'fui-MenuItemRadio',\n icon: 'fui-MenuItemRadio__icon',\n checkmark: 'fui-MenuItemRadio__checkmark',\n content: 'fui-MenuItemRadio__content',\n secondaryContent: 'fui-MenuItemRadio__secondaryContent',\n subText: 'fui-MenuItemRadio__subText'\n};\nexport const useMenuItemRadioStyles_unstable = (state)=>{\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);\n }\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(menuItemRadioClassNames.secondaryContent, state.secondaryContent.className);\n }\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);\n }\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);\n }\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemRadioClassNames.subText, state.subText.className);\n }\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,2BAA2B,QAAQ,wBAAwB;AACpE,SAASC,0BAA0B,QAAQ,sCAAsC;AACjF,OAAO,MAAMC,uBAAuB,GAAG;EACnCC,IAAI,EAAE,mBAAmB;EACzBC,IAAI,EAAE,yBAAyB;EAC/BC,SAAS,EAAE,8BAA8B;EACzCC,OAAO,EAAE,4BAA4B;EACrCC,gBAAgB,EAAE,qCAAqC;EACvDC,OAAO,EAAE;AACb,CAAC;AACD,OAAO,MAAMC,+BAA+B,GAAIC,KAAK,IAAG;EACpD;EACAA,KAAK,CAACP,IAAI,CAACQ,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACC,IAAI,EAAEO,KAAK,CAACP,IAAI,CAACQ,SAAS,CAAC;EACvF,IAAID,KAAK,CAACJ,OAAO,EAAE;IACf;IACAI,KAAK,CAACJ,OAAO,CAACK,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACI,OAAO,EAAEI,KAAK,CAACJ,OAAO,CAACK,SAAS,CAAC;EACpG;EACA,IAAID,KAAK,CAACH,gBAAgB,EAAE;IACxB;IACAG,KAAK,CAACH,gBAAgB,CAACI,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACK,gBAAgB,EAAEG,KAAK,CAACH,gBAAgB,CAACI,SAAS,CAAC;EAC/H;EACA,IAAID,KAAK,CAACN,IAAI,EAAE;IACZ;IACAM,KAAK,CAACN,IAAI,CAACO,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACE,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACO,SAAS,CAAC;EAC3F;EACA,IAAID,KAAK,CAACL,SAAS,EAAE;IACjB;IACAK,KAAK,CAACL,SAAS,CAACM,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACG,SAAS,EAAEK,KAAK,CAACL,SAAS,CAACM,SAAS,CAAC;EAC1G;EACA,IAAID,KAAK,CAACF,OAAO,EAAE;IACf;IACAE,KAAK,CAACF,OAAO,CAACG,SAAS,GAAGZ,YAAY,CAACG,uBAAuB,CAACM,OAAO,EAAEE,KAAK,CAACF,OAAO,CAACG,SAAS,CAAC;EACpG;EACAV,0BAA0B,CAACS,KAAK,CAAC;EACjCV,2BAA2B,CAACU,KAAK,CAAC;AACtC,CAAC","ignoreList":[]}

package/lib/components/MenuItemRadio/useMenuItemRadioStyles.styles.raw.js CHANGED Viewed

@@ -11,7 +11,6 @@ export const menuItemRadioClassNames = {
     subText: 'fui-MenuItemRadio__subText'
 };
 export const useMenuItemRadioStyles_unstable = (state)=>{
-    'use no memo';
     // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);
     if (state.content) {

package/lib/components/MenuItemRadio/useMenuItemRadioStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/MenuItemRadio/useMenuItemRadioStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../index';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\n\nexport const menuItemRadioClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n root: 'fui-MenuItemRadio',\n icon: 'fui-MenuItemRadio__icon',\n checkmark: 'fui-MenuItemRadio__checkmark',\n content: 'fui-MenuItemRadio__content',\n secondaryContent: 'fui-MenuItemRadio__secondaryContent',\n subText: 'fui-MenuItemRadio__subText',\n};\n\nexport const useMenuItemRadioStyles_unstable = (state: MenuItemRadioState): void => {\n ~~'use no memo';\n\n~~ // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);\n\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemRadioClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);\n }\n\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemRadioClassNames.subText, state.subText.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemRadioClassNames","root","icon","checkmark","content","secondaryContent","subText","useMenuItemRadioStyles_unstable","state","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,2BAA2B,QAAQ,yBAAyB;AACrE,SAASC,0BAA0B,QAAQ,uCAAuC;AAKlF,OAAO,MAAMC,0BAAmF;IAC9FC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;IAClBC,SAAS;AACX,EAAE;AAEF,OAAO,MAAMC,kCAAkC,CAACC;IAC9C~~;IAEA~~,oDAAoD;IACpDA,MAAMP,IAAI,CAACQ,SAAS,GAAGZ,aAAaG,wBAAwBC,IAAI,EAAEO,MAAMP,IAAI,CAACQ,SAAS;IAEtF,IAAID,MAAMJ,OAAO,EAAE;QACjB,oDAAoD;QACpDI,MAAMJ,OAAO,CAACK,SAAS,GAAGZ,aAAaG,wBAAwBI,OAAO,EAAEI,MAAMJ,OAAO,CAACK,SAAS;IACjG;IAEA,IAAID,MAAMH,gBAAgB,EAAE;QAC1B,oDAAoD;QACpDG,MAAMH,gBAAgB,CAACI,SAAS,GAAGZ,aACjCG,wBAAwBK,gBAAgB,EACxCG,MAAMH,gBAAgB,CAACI,SAAS;IAEpC;IAEA,IAAID,MAAMN,IAAI,EAAE;QACd,oDAAoD;QACpDM,MAAMN,IAAI,CAACO,SAAS,GAAGZ,aAAaG,wBAAwBE,IAAI,EAAEM,MAAMN,IAAI,CAACO,SAAS;IACxF;IAEA,IAAID,MAAML,SAAS,EAAE;QACnB,oDAAoD;QACpDK,MAAML,SAAS,CAACM,SAAS,GAAGZ,aAAaG,wBAAwBG,SAAS,EAAEK,MAAML,SAAS,CAACM,SAAS;IACvG;IAEA,IAAID,MAAMF,OAAO,EAAE;QACjB,oDAAoD;QACpDE,MAAMF,OAAO,CAACG,SAAS,GAAGZ,aAAaG,wBAAwBM,OAAO,EAAEE,MAAMF,OAAO,CAACG,SAAS;IACjG;IAEAV,2BAA2BS;IAC3BV,4BAA4BU;AAC9B,EAAE"}
1	+ {"version":3,"sources":["../src/components/MenuItemRadio/useMenuItemRadioStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../index';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\n\nexport const menuItemRadioClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n root: 'fui-MenuItemRadio',\n icon: 'fui-MenuItemRadio__icon',\n checkmark: 'fui-MenuItemRadio__checkmark',\n content: 'fui-MenuItemRadio__content',\n secondaryContent: 'fui-MenuItemRadio__secondaryContent',\n subText: 'fui-MenuItemRadio__subText',\n};\n\nexport const useMenuItemRadioStyles_unstable = (state: MenuItemRadioState): void => {\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);\n\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemRadioClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);\n }\n\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemRadioClassNames.subText, state.subText.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemRadioClassNames","root","icon","checkmark","content","secondaryContent","subText","useMenuItemRadioStyles_unstable","state","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,2BAA2B,QAAQ,yBAAyB;AACrE,SAASC,0BAA0B,QAAQ,uCAAuC;AAKlF,OAAO,MAAMC,0BAAmF;IAC9FC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;IAClBC,SAAS;AACX,EAAE;AAEF,OAAO,MAAMC,kCAAkC,CAACC;IAC9C,oDAAoD;IACpDA,MAAMP,IAAI,CAACQ,SAAS,GAAGZ,aAAaG,wBAAwBC,IAAI,EAAEO,MAAMP,IAAI,CAACQ,SAAS;IAEtF,IAAID,MAAMJ,OAAO,EAAE;QACjB,oDAAoD;QACpDI,MAAMJ,OAAO,CAACK,SAAS,GAAGZ,aAAaG,wBAAwBI,OAAO,EAAEI,MAAMJ,OAAO,CAACK,SAAS;IACjG;IAEA,IAAID,MAAMH,gBAAgB,EAAE;QAC1B,oDAAoD;QACpDG,MAAMH,gBAAgB,CAACI,SAAS,GAAGZ,aACjCG,wBAAwBK,gBAAgB,EACxCG,MAAMH,gBAAgB,CAACI,SAAS;IAEpC;IAEA,IAAID,MAAMN,IAAI,EAAE;QACd,oDAAoD;QACpDM,MAAMN,IAAI,CAACO,SAAS,GAAGZ,aAAaG,wBAAwBE,IAAI,EAAEM,MAAMN,IAAI,CAACO,SAAS;IACxF;IAEA,IAAID,MAAML,SAAS,EAAE;QACnB,oDAAoD;QACpDK,MAAML,SAAS,CAACM,SAAS,GAAGZ,aAAaG,wBAAwBG,SAAS,EAAEK,MAAML,SAAS,CAACM,SAAS;IACvG;IAEA,IAAID,MAAMF,OAAO,EAAE;QACjB,oDAAoD;QACpDE,MAAMF,OAAO,CAACG,SAAS,GAAGZ,aAAaG,wBAAwBM,OAAO,EAAEE,MAAMF,OAAO,CAACG,SAAS;IACjG;IAEAV,2BAA2BS;IAC3BV,4BAA4BU;AAC9B,EAAE"}

package/lib/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.js CHANGED Viewed

@@ -58,8 +58,6 @@ const useMultilineStyles = /*#__PURE__*/__styles({
  * Apply styling to the MenuItemSwitch slots based on the state
  */
 export const useMenuItemSwitchStyles_unstable = state => {
-  'use no memo';
   const {
     checked,
     subText

package/lib/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__styles","__resetStyles","mergeClasses","shorthands","tokens","useMenuItemStyles_unstable","menuItemSwitchClassNames","root","icon","content","secondaryContent","switchIndicator","subText","circleFilledClassName","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useSwitchIndicatorBaseClassName","r","s","useSwitchIndicatorStyles","checked","G4r02d","De3pzq","sj55zd","g2u3we","h3c5rm","B9xav0g","zhjwy3","Bi91k9c","Jwef8y","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B2d53fq","iro3zm","b661bw","Bk6r4ia","B9zn80p","Bpld233","d","h","useMultilineStyles","qb2dma","useMenuItemSwitchStyles_unstable","state","multiline","switchIndicatorStyles","switchIndicatorBaseStyles","multilineStyles","className","switch","components","checkmark","submenuIndicator","undefined","hasSubmenu","submenuOpen","persistOnClick"],"sources":["useMenuItemSwitchStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, makeResetStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuItemSwitchClassNames = {\n root: 'fui-MenuItemSwitch',\n icon: 'fui-MenuItemSwitch__icon',\n content: 'fui-MenuItemSwitch__content',\n secondaryContent: 'fui-MenuItemSwitch__secondaryContent',\n switchIndicator: 'fui-MenuItemSwitch__switchIndicator',\n subText: 'fui-MenuItemSwitch__subText'\n};\nexport const circleFilledClassName = 'fui-MenuItemSwitch__switchIndicator__circleFilled';\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\nconst useSwitchIndicatorBaseClassName = makeResetStyles({\n borderRadius: tokens.borderRadiusCircular,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n lineHeight: 0,\n boxSizing: 'border-box',\n fill: 'currentColor',\n flexShrink: 0,\n fontSize: `${thumbSize}px`,\n height: `${trackHeight}px`,\n transitionDuration: tokens.durationNormal,\n transitionTimingFunction: tokens.curveEasyEase,\n transitionProperty: 'background, border, color',\n width: `${trackWidth}px`,\n marginRight: tokens.spacingHorizontalXS,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms'\n },\n color: tokens.colorNeutralStrokeAccessible,\n ':hover': {\n color: tokens.colorNeutralStrokeAccessibleHover,\n borderColor: tokens.colorNeutralStrokeAccessibleHover\n },\n ':hover:active': {\n color: tokens.colorNeutralStrokeAccessiblePressed,\n borderColor: tokens.colorNeutralStrokeAccessiblePressed\n },\n [`& .${circleFilledClassName}`]: {\n transitionDuration: tokens.durationNormal,\n transitionTimingFunction: tokens.curveEasyEase,\n transitionProperty: 'transform',\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms'\n }\n }\n});\nconst useSwitchIndicatorStyles = makeStyles({\n checked: {\n [`& .${circleFilledClassName}`]: {\n transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`\n },\n backgroundColor: tokens.colorCompoundBrandBackground,\n color: tokens.colorNeutralForegroundInverted,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n ':hover': {\n color: tokens.colorNeutralForegroundInverted,\n backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive)\n },\n ':hover:active': {\n color: tokens.colorNeutralForegroundInverted,\n backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive)\n }\n }\n});\nconst useMultilineStyles = makeStyles({\n switch: {\n alignSelf: 'center'\n }\n});\n/*\n Apply styling to the MenuItemSwitch slots based on the state\n */ export const useMenuItemSwitchStyles_unstable = (state)=>{\n ~~'use no memo';\n~~ const { checked, subText } = state;\n const multiline = !!subText;\n const switchIndicatorStyles = useSwitchIndicatorStyles();\n const switchIndicatorBaseStyles = useSwitchIndicatorBaseClassName();\n const multilineStyles = useMultilineStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemSwitchClassNames.root, state.root.className);\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemSwitchClassNames.content, state.content.className);\n }\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(menuItemSwitchClassNames.secondaryContent, state.secondaryContent.className);\n }\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemSwitchClassNames.icon, state.icon.className);\n }\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemSwitchClassNames.subText, state.subText.className);\n }\n if (state.switchIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.switchIndicator.className = mergeClasses(menuItemSwitchClassNames.switchIndicator, switchIndicatorBaseStyles, checked && switchIndicatorStyles.checked, state.switchIndicator.className, multiline && multilineStyles.switch);\n }\n useMenuItemStyles_unstable({\n ...state,\n components: {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ...state.components,\n checkmark: 'span',\n submenuIndicator: 'span'\n },\n checkmark: undefined,\n submenuIndicator: undefined,\n hasSubmenu: false,\n submenuOpen: false,\n persistOnClick: true\n });\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAAC,aAAA,EAAsCC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACtF,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,0BAA0B,QAAQ,sCAAsC;AACjF,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE,oBAAoB;EAC1BC,IAAI,EAAE,0BAA0B;EAChCC,OAAO,EAAE,6BAA6B;EACtCC,gBAAgB,EAAE,sCAAsC;EACxDC,eAAe,EAAE,qCAAqC;EACtDC,OAAO,EAAE;AACb,CAAC;AACD,OAAO,MAAMC,qBAAqB,GAAG,mDAAmD;AACxF;AACA,MAAMC,yBAAyB,GAAG,CAAC;AACnC,MAAMC,WAAW,GAAG,EAAE;AACtB,MAAMC,UAAU,GAAG,EAAE;AACrB,MAAMC,SAAS,GAAGF,WAAW,GAAGD,yBAAyB;AACzD,MAAMI,+BAA+B,gBAAGjB,aAAA;EAAAkB,CAAA;EAAAC,CAAA;AAAA,CAkCvC,CAAC;AACF,MAAMC,wBAAwB,gBAAGrB,QAAA;EAAAsB,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;AAAA,CAmBhC,CAAC;AACF,MAAMC,kBAAkB,gBAAG5C,QAAA;EAAA;IAAA6C,MAAA;EAAA;AAAA;EAAAH,CAAA;AAAA,CAI1B,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMI,gCAAgC,GAAIC,KAAK,IAAG;EACzD,~~aAAa;;EACb,~~MAAM;IAAEzB,OAAO;IAAEV;EAAQ,CAAC,GAAGmC,KAAK;EAClC,MAAMC,SAAS,GAAG,CAAC,CAACpC,OAAO;EAC3B,MAAMqC,qBAAqB,GAAG5B,wBAAwB,CAAC,CAAC;EACxD,MAAM6B,yBAAyB,GAAGhC,+BAA+B,CAAC,CAAC;EACnE,MAAMiC,eAAe,GAAGP,kBAAkB,CAAC,CAAC;EAC5C;EACAG,KAAK,CAACxC,IAAI,CAAC6C,SAAS,GAAGlD,YAAY,CAACI,wBAAwB,CAACC,IAAI,EAAEwC,KAAK,CAACxC,IAAI,CAAC6C,SAAS,CAAC;EACxF,IAAIL,KAAK,CAACtC,OAAO,EAAE;IACf;IACAsC,KAAK,CAACtC,OAAO,CAAC2C,SAAS,GAAGlD,YAAY,CAACI,wBAAwB,CAACG,OAAO,EAAEsC,KAAK,CAACtC,OAAO,CAAC2C,SAAS,CAAC;EACrG;EACA,IAAIL,KAAK,CAACrC,gBAAgB,EAAE;IACxB;IACAqC,KAAK,CAACrC,gBAAgB,CAAC0C,SAAS,GAAGlD,YAAY,CAACI,wBAAwB,CAACI,gBAAgB,EAAEqC,KAAK,CAACrC,gBAAgB,CAAC0C,SAAS,CAAC;EAChI;EACA,IAAIL,KAAK,CAACvC,IAAI,EAAE;IACZ;IACAuC,KAAK,CAACvC,IAAI,CAAC4C,SAAS,GAAGlD,YAAY,CAACI,wBAAwB,CAACE,IAAI,EAAEuC,KAAK,CAACvC,IAAI,CAAC4C,SAAS,CAAC;EAC5F;EACA,IAAIL,KAAK,CAACnC,OAAO,EAAE;IACf;IACAmC,KAAK,CAACnC,OAAO,CAACwC,SAAS,GAAGlD,YAAY,CAACI,wBAAwB,CAACM,OAAO,EAAEmC,KAAK,CAACnC,OAAO,CAACwC,SAAS,CAAC;EACrG;EACA,IAAIL,KAAK,CAACpC,eAAe,EAAE;IACvB;IACAoC,KAAK,CAACpC,eAAe,CAACyC,SAAS,GAAGlD,YAAY,CAACI,wBAAwB,CAACK,eAAe,EAAEuC,yBAAyB,EAAE5B,OAAO,IAAI2B,qBAAqB,CAAC3B,OAAO,EAAEyB,KAAK,CAACpC,eAAe,CAACyC,SAAS,EAAEJ,SAAS,IAAIG,eAAe,CAACE,MAAM,CAAC;EACvO;EACAhD,0BAA0B,CAAC;IACvB,GAAG0C,KAAK;IACRO,UAAU,EAAE;MACR;MACA,GAAGP,KAAK,CAACO,UAAU;MACnBC,SAAS,EAAE,MAAM;MACjBC,gBAAgB,EAAE;IACtB,CAAC;IACDD,SAAS,EAAEE,SAAS;IACpBD,gBAAgB,EAAEC,SAAS;IAC3BC,UAAU,EAAE,KAAK;IACjBC,WAAW,EAAE,KAAK;IAClBC,cAAc,EAAE;EACpB,CAAC,CAAC;EACF,OAAOb,KAAK;AAChB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["__styles","__resetStyles","mergeClasses","shorthands","tokens","useMenuItemStyles_unstable","menuItemSwitchClassNames","root","icon","content","secondaryContent","switchIndicator","subText","circleFilledClassName","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useSwitchIndicatorBaseClassName","r","s","useSwitchIndicatorStyles","checked","G4r02d","De3pzq","sj55zd","g2u3we","h3c5rm","B9xav0g","zhjwy3","Bi91k9c","Jwef8y","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B2d53fq","iro3zm","b661bw","Bk6r4ia","B9zn80p","Bpld233","d","h","useMultilineStyles","qb2dma","useMenuItemSwitchStyles_unstable","state","multiline","switchIndicatorStyles","switchIndicatorBaseStyles","multilineStyles","className","switch","components","checkmark","submenuIndicator","undefined","hasSubmenu","submenuOpen","persistOnClick"],"sources":["useMenuItemSwitchStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, makeResetStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuItemSwitchClassNames = {\n root: 'fui-MenuItemSwitch',\n icon: 'fui-MenuItemSwitch__icon',\n content: 'fui-MenuItemSwitch__content',\n secondaryContent: 'fui-MenuItemSwitch__secondaryContent',\n switchIndicator: 'fui-MenuItemSwitch__switchIndicator',\n subText: 'fui-MenuItemSwitch__subText'\n};\nexport const circleFilledClassName = 'fui-MenuItemSwitch__switchIndicator__circleFilled';\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\nconst useSwitchIndicatorBaseClassName = makeResetStyles({\n borderRadius: tokens.borderRadiusCircular,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n lineHeight: 0,\n boxSizing: 'border-box',\n fill: 'currentColor',\n flexShrink: 0,\n fontSize: `${thumbSize}px`,\n height: `${trackHeight}px`,\n transitionDuration: tokens.durationNormal,\n transitionTimingFunction: tokens.curveEasyEase,\n transitionProperty: 'background, border, color',\n width: `${trackWidth}px`,\n marginRight: tokens.spacingHorizontalXS,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms'\n },\n color: tokens.colorNeutralStrokeAccessible,\n ':hover': {\n color: tokens.colorNeutralStrokeAccessibleHover,\n borderColor: tokens.colorNeutralStrokeAccessibleHover\n },\n ':hover:active': {\n color: tokens.colorNeutralStrokeAccessiblePressed,\n borderColor: tokens.colorNeutralStrokeAccessiblePressed\n },\n [`& .${circleFilledClassName}`]: {\n transitionDuration: tokens.durationNormal,\n transitionTimingFunction: tokens.curveEasyEase,\n transitionProperty: 'transform',\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms'\n }\n }\n});\nconst useSwitchIndicatorStyles = makeStyles({\n checked: {\n [`& .${circleFilledClassName}`]: {\n transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`\n },\n backgroundColor: tokens.colorCompoundBrandBackground,\n color: tokens.colorNeutralForegroundInverted,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n ':hover': {\n color: tokens.colorNeutralForegroundInverted,\n backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive)\n },\n ':hover:active': {\n color: tokens.colorNeutralForegroundInverted,\n backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive)\n }\n }\n});\nconst useMultilineStyles = makeStyles({\n switch: {\n alignSelf: 'center'\n }\n});\n/*\n Apply styling to the MenuItemSwitch slots based on the state\n */ export const useMenuItemSwitchStyles_unstable = (state)=>{\n const { checked, subText } = state;\n const multiline = !!subText;\n const switchIndicatorStyles = useSwitchIndicatorStyles();\n const switchIndicatorBaseStyles = useSwitchIndicatorBaseClassName();\n const multilineStyles = useMultilineStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemSwitchClassNames.root, state.root.className);\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemSwitchClassNames.content, state.content.className);\n }\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(menuItemSwitchClassNames.secondaryContent, state.secondaryContent.className);\n }\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemSwitchClassNames.icon, state.icon.className);\n }\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemSwitchClassNames.subText, state.subText.className);\n }\n if (state.switchIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.switchIndicator.className = mergeClasses(menuItemSwitchClassNames.switchIndicator, switchIndicatorBaseStyles, checked && switchIndicatorStyles.checked, state.switchIndicator.className, multiline && multilineStyles.switch);\n }\n useMenuItemStyles_unstable({\n ...state,\n components: {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ...state.components,\n checkmark: 'span',\n submenuIndicator: 'span'\n },\n checkmark: undefined,\n submenuIndicator: undefined,\n hasSubmenu: false,\n submenuOpen: false,\n persistOnClick: true\n });\n return state;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.raw.js CHANGED Viewed

@@ -79,7 +79,6 @@ const useMultilineStyles = makeStyles({
 /**
  * Apply styling to the MenuItemSwitch slots based on the state
  */ export const useMenuItemSwitchStyles_unstable = (state)=>{
-    'use no memo';
     const { checked, subText } = state;
     const multiline = !!subText;
     const switchIndicatorStyles = useSwitchIndicatorStyles();

package/lib/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, makeResetStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { type SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSwitchSlots, MenuItemSwitchState } from './MenuItemSwitch.types';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\n\nexport const menuItemSwitchClassNames: SlotClassNames<MenuItemSwitchSlots> = {\n root: 'fui-MenuItemSwitch',\n icon: 'fui-MenuItemSwitch__icon',\n content: 'fui-MenuItemSwitch__content',\n secondaryContent: 'fui-MenuItemSwitch__secondaryContent',\n switchIndicator: 'fui-MenuItemSwitch__switchIndicator',\n subText: 'fui-MenuItemSwitch__subText',\n};\n\nexport const circleFilledClassName = 'fui-MenuItemSwitch__switchIndicator__circleFilled';\n\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\n\nconst useSwitchIndicatorBaseClassName = makeResetStyles({\n borderRadius: tokens.borderRadiusCircular,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n lineHeight: 0,\n boxSizing: 'border-box',\n fill: 'currentColor',\n flexShrink: 0,\n fontSize: `${thumbSize}px`,\n height: `${trackHeight}px`,\n transitionDuration: tokens.durationNormal,\n transitionTimingFunction: tokens.curveEasyEase,\n transitionProperty: 'background, border, color',\n width: `${trackWidth}px`,\n marginRight: tokens.spacingHorizontalXS,\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n },\n\n color: tokens.colorNeutralStrokeAccessible,\n ':hover': {\n color: tokens.colorNeutralStrokeAccessibleHover,\n borderColor: tokens.colorNeutralStrokeAccessibleHover,\n },\n\n ':hover:active': {\n color: tokens.colorNeutralStrokeAccessiblePressed,\n borderColor: tokens.colorNeutralStrokeAccessiblePressed,\n },\n [`& .${circleFilledClassName}`]: {\n transitionDuration: tokens.durationNormal,\n transitionTimingFunction: tokens.curveEasyEase,\n transitionProperty: 'transform',\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n },\n },\n});\n\nconst useSwitchIndicatorStyles = makeStyles({\n checked: {\n [`& .${circleFilledClassName}`]: {\n transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`,\n },\n\n backgroundColor: tokens.colorCompoundBrandBackground,\n color: tokens.colorNeutralForegroundInverted,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n\n ':hover': {\n color: tokens.colorNeutralForegroundInverted,\n backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n },\n\n ':hover:active': {\n color: tokens.colorNeutralForegroundInverted,\n backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n },\n },\n});\n\nconst useMultilineStyles = makeStyles({\n switch: {\n alignSelf: 'center',\n },\n});\n\n/*\n Apply styling to the MenuItemSwitch slots based on the state\n */\nexport const useMenuItemSwitchStyles_unstable = (state: MenuItemSwitchState): MenuItemSwitchState => {\n ~~'use no memo';\n\n~~ const { checked, subText } = state;\n const multiline = !!subText;\n const switchIndicatorStyles = useSwitchIndicatorStyles();\n const switchIndicatorBaseStyles = useSwitchIndicatorBaseClassName();\n const multilineStyles = useMultilineStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemSwitchClassNames.root, state.root.className);\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemSwitchClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemSwitchClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemSwitchClassNames.icon, state.icon.className);\n }\n\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemSwitchClassNames.subText, state.subText.className);\n }\n\n if (state.switchIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.switchIndicator.className = mergeClasses(\n menuItemSwitchClassNames.switchIndicator,\n switchIndicatorBaseStyles,\n checked && switchIndicatorStyles.checked,\n state.switchIndicator.className,\n multiline && multilineStyles.switch,\n );\n }\n\n useMenuItemStyles_unstable({\n ...state,\n components: {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ...state.components,\n checkmark: 'span',\n submenuIndicator: 'span',\n },\n checkmark: undefined,\n submenuIndicator: undefined,\n hasSubmenu: false,\n submenuOpen: false,\n persistOnClick: true,\n });\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","shorthands","tokens","useMenuItemStyles_unstable","menuItemSwitchClassNames","root","icon","content","secondaryContent","switchIndicator","subText","circleFilledClassName","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useSwitchIndicatorBaseClassName","borderRadius","borderRadiusCircular","border","strokeWidthThin","colorNeutralStrokeAccessible","lineHeight","boxSizing","fill","flexShrink","fontSize","height","transitionDuration","durationNormal","transitionTimingFunction","curveEasyEase","transitionProperty","width","marginRight","spacingHorizontalXS","color","colorNeutralStrokeAccessibleHover","borderColor","colorNeutralStrokeAccessiblePressed","useSwitchIndicatorStyles","checked","transform","backgroundColor","colorCompoundBrandBackground","colorNeutralForegroundInverted","colorTransparentStroke","colorCompoundBrandBackgroundHover","colorTransparentStrokeInteractive","colorCompoundBrandBackgroundPressed","useMultilineStyles","switch","alignSelf","useMenuItemSwitchStyles_unstable","state","multiline","switchIndicatorStyles","switchIndicatorBaseStyles","multilineStyles","className","components","checkmark","submenuIndicator","undefined","hasSubmenu","submenuOpen","persistOnClick"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,eAAe,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AACvF,SAASC,MAAM,QAAQ,wBAAwB;AAG/C,SAASC,0BAA0B,QAAQ,uCAAuC;AAElF,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;IACNC,MAAM;IACNC,SAAS;IACTC,kBAAkB;IAClBC,iBAAiB;IACjBC,SAAS;AACX,EAAE;AAEF,OAAO,MAAMC,wBAAwB,oDAAoD;AAEzF,+CAA+C;AAC/C,MAAMC,4BAA4B;AAClC,MAAMC,cAAc;AACpB,MAAMC,aAAa;AACnB,MAAMC,YAAYF,cAAcD;AAEhC,MAAMI,kCAAkCjB,gBAAgB;IACtDkB,cAAcf,OAAOgB,oBAAoB;IACzCC,QAAQ,GAAGjB,OAAOkB,eAAe,CAAC,OAAO,EAAElB,OAAOmB,4BAA4B,EAAE;IAChFC,YAAY;IACZC,WAAW;IACXC,MAAM;IACNC,YAAY;IACZC,UAAU,GAAGX,UAAU,EAAE,CAAC;IAC1BY,QAAQ,GAAGd,YAAY,EAAE,CAAC;IAC1Be,oBAAoB1B,OAAO2B,cAAc;IACzCC,0BAA0B5B,OAAO6B,aAAa;IAC9CC,oBAAoB;IACpBC,OAAO,GAAGnB,WAAW,EAAE,CAAC;IACxBoB,aAAahC,OAAOiC,mBAAmB;IAEvC,sDAAsD;QACpDP,oBAAoB;IACtB;IAEAQ,OAAOlC,OAAOmB,4BAA4B;IAC1C,UAAU;QACRe,OAAOlC,OAAOmC,iCAAiC;QAC/CC,aAAapC,OAAOmC,iCAAiC;IACvD;IAEA,iBAAiB;QACfD,OAAOlC,OAAOqC,mCAAmC;QACjDD,aAAapC,OAAOqC,mCAAmC;IACzD;IACA,CAAC,CAAC,GAAG,EAAE5B,uBAAuB,CAAC,EAAE;QAC/BiB,oBAAoB1B,OAAO2B,cAAc;QACzCC,0BAA0B5B,OAAO6B,aAAa;QAC9CC,oBAAoB;QAEpB,sDAAsD;YACpDJ,oBAAoB;QACtB;IACF;AACF;AAEA,MAAMY,2BAA2B1C,WAAW;IAC1C2C,SAAS;QACP,CAAC,CAAC,GAAG,EAAE9B,uBAAuB,CAAC,EAAE;YAC/B+B,WAAW,CAAC,WAAW,EAAE5B,aAAaC,YAAYH,0BAA0B,GAAG,CAAC;QAClF;QAEA+B,iBAAiBzC,OAAO0C,4BAA4B;QACpDR,OAAOlC,OAAO2C,8BAA8B;QAC5C,GAAG5C,WAAWqC,WAAW,CAACpC,OAAO4C,sBAAsB,CAAC;QAExD,UAAU;YACRV,OAAOlC,OAAO2C,8BAA8B;YAC5CF,iBAAiBzC,OAAO6C,iCAAiC;YACzD,GAAG9C,WAAWqC,WAAW,CAACpC,OAAO8C,iCAAiC,CAAC;QACrE;QAEA,iBAAiB;YACfZ,OAAOlC,OAAO2C,8BAA8B;YAC5CF,iBAAiBzC,OAAO+C,mCAAmC;YAC3D,GAAGhD,WAAWqC,WAAW,CAACpC,OAAO8C,iCAAiC,CAAC;QACrE;IACF;AACF;AAEA,MAAME,qBAAqBpD,WAAW;IACpCqD,QAAQ;QACNC,WAAW;IACb;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C~~;IAEA~~,MAAM,EAAEb,OAAO,EAAE/B,OAAO,EAAE,GAAG4C;IAC7B,MAAMC,YAAY,CAAC,CAAC7C;IACpB,MAAM8C,wBAAwBhB;IAC9B,MAAMiB,4BAA4BzC;IAClC,MAAM0C,kBAAkBR;IACxB,oDAAoD;IACpDI,MAAMjD,IAAI,CAACsD,SAAS,GAAG3D,aAAaI,yBAAyBC,IAAI,EAAEiD,MAAMjD,IAAI,CAACsD,SAAS;IACvF,IAAIL,MAAM/C,OAAO,EAAE;QACjB,oDAAoD;QACpD+C,MAAM/C,OAAO,CAACoD,SAAS,GAAG3D,aAAaI,yBAAyBG,OAAO,EAAE+C,MAAM/C,OAAO,CAACoD,SAAS;IAClG;IAEA,IAAIL,MAAM9C,gBAAgB,EAAE;QAC1B,oDAAoD;QACpD8C,MAAM9C,gBAAgB,CAACmD,SAAS,GAAG3D,aACjCI,yBAAyBI,gBAAgB,EACzC8C,MAAM9C,gBAAgB,CAACmD,SAAS;IAEpC;IAEA,IAAIL,MAAMhD,IAAI,EAAE;QACd,oDAAoD;QACpDgD,MAAMhD,IAAI,CAACqD,SAAS,GAAG3D,aAAaI,yBAAyBE,IAAI,EAAEgD,MAAMhD,IAAI,CAACqD,SAAS;IACzF;IAEA,IAAIL,MAAM5C,OAAO,EAAE;QACjB,oDAAoD;QACpD4C,MAAM5C,OAAO,CAACiD,SAAS,GAAG3D,aAAaI,yBAAyBM,OAAO,EAAE4C,MAAM5C,OAAO,CAACiD,SAAS;IAClG;IAEA,IAAIL,MAAM7C,eAAe,EAAE;QACzB,oDAAoD;QACpD6C,MAAM7C,eAAe,CAACkD,SAAS,GAAG3D,aAChCI,yBAAyBK,eAAe,EACxCgD,2BACAhB,WAAWe,sBAAsBf,OAAO,EACxCa,MAAM7C,eAAe,CAACkD,SAAS,EAC/BJ,aAAaG,gBAAgBP,MAAM;IAEvC;IAEAhD,2BAA2B;QACzB,GAAGmD,KAAK;QACRM,YAAY;YACV,4DAA4D;YAC5D,GAAGN,MAAMM,UAAU;YACnBC,WAAW;YACXC,kBAAkB;QACpB;QACAD,WAAWE;QACXD,kBAAkBC;QAClBC,YAAY;QACZC,aAAa;QACbC,gBAAgB;IAClB;IAEA,OAAOZ;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, makeResetStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { type SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSwitchSlots, MenuItemSwitchState } from './MenuItemSwitch.types';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\n\nexport const menuItemSwitchClassNames: SlotClassNames<MenuItemSwitchSlots> = {\n root: 'fui-MenuItemSwitch',\n icon: 'fui-MenuItemSwitch__icon',\n content: 'fui-MenuItemSwitch__content',\n secondaryContent: 'fui-MenuItemSwitch__secondaryContent',\n switchIndicator: 'fui-MenuItemSwitch__switchIndicator',\n subText: 'fui-MenuItemSwitch__subText',\n};\n\nexport const circleFilledClassName = 'fui-MenuItemSwitch__switchIndicator__circleFilled';\n\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\n\nconst useSwitchIndicatorBaseClassName = makeResetStyles({\n borderRadius: tokens.borderRadiusCircular,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n lineHeight: 0,\n boxSizing: 'border-box',\n fill: 'currentColor',\n flexShrink: 0,\n fontSize: `${thumbSize}px`,\n height: `${trackHeight}px`,\n transitionDuration: tokens.durationNormal,\n transitionTimingFunction: tokens.curveEasyEase,\n transitionProperty: 'background, border, color',\n width: `${trackWidth}px`,\n marginRight: tokens.spacingHorizontalXS,\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n },\n\n color: tokens.colorNeutralStrokeAccessible,\n ':hover': {\n color: tokens.colorNeutralStrokeAccessibleHover,\n borderColor: tokens.colorNeutralStrokeAccessibleHover,\n },\n\n ':hover:active': {\n color: tokens.colorNeutralStrokeAccessiblePressed,\n borderColor: tokens.colorNeutralStrokeAccessiblePressed,\n },\n [`& .${circleFilledClassName}`]: {\n transitionDuration: tokens.durationNormal,\n transitionTimingFunction: tokens.curveEasyEase,\n transitionProperty: 'transform',\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n },\n },\n});\n\nconst useSwitchIndicatorStyles = makeStyles({\n checked: {\n [`& .${circleFilledClassName}`]: {\n transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`,\n },\n\n backgroundColor: tokens.colorCompoundBrandBackground,\n color: tokens.colorNeutralForegroundInverted,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n\n ':hover': {\n color: tokens.colorNeutralForegroundInverted,\n backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n },\n\n ':hover:active': {\n color: tokens.colorNeutralForegroundInverted,\n backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n },\n },\n});\n\nconst useMultilineStyles = makeStyles({\n switch: {\n alignSelf: 'center',\n },\n});\n\n/*\n Apply styling to the MenuItemSwitch slots based on the state\n */\nexport const useMenuItemSwitchStyles_unstable = (state: MenuItemSwitchState): MenuItemSwitchState => {\n const { checked, subText } = state;\n const multiline = !!subText;\n const switchIndicatorStyles = useSwitchIndicatorStyles();\n const switchIndicatorBaseStyles = useSwitchIndicatorBaseClassName();\n const multilineStyles = useMultilineStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemSwitchClassNames.root, state.root.className);\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemSwitchClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemSwitchClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemSwitchClassNames.icon, state.icon.className);\n }\n\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemSwitchClassNames.subText, state.subText.className);\n }\n\n if (state.switchIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.switchIndicator.className = mergeClasses(\n menuItemSwitchClassNames.switchIndicator,\n switchIndicatorBaseStyles,\n checked && switchIndicatorStyles.checked,\n state.switchIndicator.className,\n multiline && multilineStyles.switch,\n );\n }\n\n useMenuItemStyles_unstable({\n ...state,\n components: {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ...state.components,\n checkmark: 'span',\n submenuIndicator: 'span',\n },\n checkmark: undefined,\n submenuIndicator: undefined,\n hasSubmenu: false,\n submenuOpen: false,\n persistOnClick: true,\n });\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","shorthands","tokens","useMenuItemStyles_unstable","menuItemSwitchClassNames","root","icon","content","secondaryContent","switchIndicator","subText","circleFilledClassName","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useSwitchIndicatorBaseClassName","borderRadius","borderRadiusCircular","border","strokeWidthThin","colorNeutralStrokeAccessible","lineHeight","boxSizing","fill","flexShrink","fontSize","height","transitionDuration","durationNormal","transitionTimingFunction","curveEasyEase","transitionProperty","width","marginRight","spacingHorizontalXS","color","colorNeutralStrokeAccessibleHover","borderColor","colorNeutralStrokeAccessiblePressed","useSwitchIndicatorStyles","checked","transform","backgroundColor","colorCompoundBrandBackground","colorNeutralForegroundInverted","colorTransparentStroke","colorCompoundBrandBackgroundHover","colorTransparentStrokeInteractive","colorCompoundBrandBackgroundPressed","useMultilineStyles","switch","alignSelf","useMenuItemSwitchStyles_unstable","state","multiline","switchIndicatorStyles","switchIndicatorBaseStyles","multilineStyles","className","components","checkmark","submenuIndicator","undefined","hasSubmenu","submenuOpen","persistOnClick"],"mappings":"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"}

package/lib/components/MenuList/useMenuListStyles.styles.js CHANGED Viewed

@@ -24,8 +24,6 @@ const useStyles = /*#__PURE__*/__styles({
  * Apply styling to the Menu slots based on the state
  */
 export const useMenuListStyles_unstable = state => {
-  'use no memo';
   const styles = useStyles();
   // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.hasMenuContext && styles.hasMenuContext, state.root.className);

package/lib/components/MenuList/useMenuListStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["mergeClasses","__styles","menuListClassNames","root","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","rmohyg","hasMenuContext","Bqenvij","d","p","useMenuListStyles_unstable","state","styles","className"],"sources":["useMenuListStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nexport const menuListClassNames = {\n root: 'fui-MenuList'\n};\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n gap: '2px'\n },\n hasMenuContext: {\n height: '100%'\n }\n});\n/*\n Apply styling to the Menu slots based on the state\n */ export const useMenuListStyles_unstable = (state)=>{\n ~~'use no memo';\n~~ const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.hasMenuContext && styles.hasMenuContext, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGH,QAAA;EAAAE,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CASjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,~~aAAa;;EACb,~~MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1B;EACAW,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGjB,YAAY,CAACE,kBAAkB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACL,cAAc,IAAIM,MAAM,CAACN,cAAc,EAAEK,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAC9I,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["mergeClasses","__styles","menuListClassNames","root","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","rmohyg","hasMenuContext","Bqenvij","d","p","useMenuListStyles_unstable","state","styles","className"],"sources":["useMenuListStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nexport const menuListClassNames = {\n root: 'fui-MenuList'\n};\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n gap: '2px'\n },\n hasMenuContext: {\n height: '100%'\n }\n});\n/*\n Apply styling to the Menu slots based on the state\n */ export const useMenuListStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.hasMenuContext && styles.hasMenuContext, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGH,QAAA;EAAAE,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CASjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1B;EACAW,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGjB,YAAY,CAACE,kBAAkB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACL,cAAc,IAAIM,MAAM,CAACN,cAAc,EAAEK,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAC9I,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/MenuList/useMenuListStyles.styles.raw.js CHANGED Viewed

@@ -16,7 +16,6 @@ const useStyles = makeStyles({
 /**
  * Apply styling to the Menu slots based on the state
  */ export const useMenuListStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.hasMenuContext && styles.hasMenuContext, state.root.className);

package/lib/components/MenuList/useMenuListStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/MenuList/useMenuListStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\nexport const menuListClassNames: SlotClassNames<MenuListSlots> = {\n root: 'fui-MenuList',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n gap: '2px',\n },\n hasMenuContext: {\n height: '100%',\n },\n});\n\n/*\n Apply styling to the Menu slots based on the state\n */\nexport const useMenuListStyles_unstable = (state: MenuListState): MenuListState => {\n ~~'use no memo';\n\n~~ const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n menuListClassNames.root,\n styles.root,\n state.hasMenuContext && styles.hasMenuContext,\n state.root.className,\n );\n return state;\n};\n"],"names":["mergeClasses","makeStyles","menuListClassNames","root","useStyles","display","flexDirection","gap","hasMenuContext","height","useMenuListStyles_unstable","state","styles","className"],"mappings":"AAAA;AAGA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAG1D,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYH,WAAW;IAC3BE,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAC,gBAAgB;QACdC,QAAQ;IACV;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC~~;IAEA~~,MAAMC,SAASR;IACf,oDAAoD;IACpDO,MAAMR,IAAI,CAACU,SAAS,GAAGb,aACrBE,mBAAmBC,IAAI,EACvBS,OAAOT,IAAI,EACXQ,MAAMH,cAAc,IAAII,OAAOJ,cAAc,EAC7CG,MAAMR,IAAI,CAACU,SAAS;IAEtB,OAAOF;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/MenuList/useMenuListStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\nexport const menuListClassNames: SlotClassNames<MenuListSlots> = {\n root: 'fui-MenuList',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n gap: '2px',\n },\n hasMenuContext: {\n height: '100%',\n },\n});\n\n/*\n Apply styling to the Menu slots based on the state\n */\nexport const useMenuListStyles_unstable = (state: MenuListState): MenuListState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n menuListClassNames.root,\n styles.root,\n state.hasMenuContext && styles.hasMenuContext,\n state.root.className,\n );\n return state;\n};\n"],"names":["mergeClasses","makeStyles","menuListClassNames","root","useStyles","display","flexDirection","gap","hasMenuContext","height","useMenuListStyles_unstable","state","styles","className"],"mappings":"AAAA;AAGA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAG1D,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYH,WAAW;IAC3BE,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAC,gBAAgB;QACdC,QAAQ;IACV;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC,MAAMC,SAASR;IACf,oDAAoD;IACpDO,MAAMR,IAAI,CAACU,SAAS,GAAGb,aACrBE,mBAAmBC,IAAI,EACvBS,OAAOT,IAAI,EACXQ,MAAMH,cAAc,IAAII,OAAOJ,cAAc,EAC7CG,MAAMR,IAAI,CAACU,SAAS;IAEtB,OAAOF;AACT,EAAE"}

package/lib/components/MenuPopover/useMenuPopover.js CHANGED Viewed

@@ -2,7 +2,7 @@
 import { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
 import { useMotionForwardedRef } from '@fluentui/react-motion';
-import { useRestoreFocusSource } from '@fluentui/react-tabster';
+import { useRestoreFocusSource, useTabsterAttributes, useMergedTabsterAttributes_unstable } from '@fluentui/react-tabster';
 import { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot, useTimeout } from '@fluentui/react-utilities';
 import * as React from 'react';
 import { useMenuContext_unstable } from '../../contexts/menuContext';
@@ -18,7 +18,7 @@ import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
  * @param props - props from this instance of MenuPopover
  * @param ref - reference to root HTMLElement of MenuPopover
  */ export const useMenuPopoverBase_unstable = (props, ref)=>{
-    'use no memo';
+    'use no memo'; // justified: compiler would optimize useMenuPopoverBase_unstable — manual opt-out to preserve runtime behavior
     const safeZone = useMenuContext_unstable((context)=>context.safeZone);
     const popoverRef = useMenuContext_unstable((context)=>context.menuPopoverRef);
     const setOpen = useMenuContext_unstable((context)=>context.setOpen);
@@ -135,12 +135,23 @@ import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
  * @param ref - reference to root HTMLElement of MenuPopover
  */ export const useMenuPopover_unstable = (props, ref)=>{
     const restoreFocusSourceAttributes = useRestoreFocusSource();
+    // Opt the menu's popover out of tabster's Escape handling. The menu closes itself on
+    // Escape; without this tabster would also act on Escape (e.g. escaping a parent
+    // groupper/modalizer) and move focus away from the trigger instead of restoring it.
+    const ignoreEscapeKeyAttribute = useTabsterAttributes({
+        focusable: {
+            ignoreKeydown: {
+                Escape: true
+            }
+        }
+    });
+    const tabsterAttributes = useMergedTabsterAttributes_unstable(restoreFocusSourceAttributes, ignoreEscapeKeyAttribute);
     const motionRef = useMotionForwardedRef();
     const baseState = useMenuPopoverBase_unstable(props, ref);
     return {
         ...baseState,
         root: {
-            ...restoreFocusSourceAttributes,
+            ...tabsterAttributes,
             ...baseState.root,
             ref: useMergedRefs(baseState.root.ref, motionRef)
         }

package/lib/components/MenuPopover/useMenuPopover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/MenuPopover/useMenuPopover.ts"],"sourcesContent":["'use client';\n\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useMotionForwardedRef } from '@fluentui/react-motion';\nimport { useRestoreFocusSource } from '@fluentui/react-tabster';\nimport { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot, useTimeout } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';\nimport type { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\n\n/*\n Base hook for MenuPopover, produces state required to render the component.\n \n Does not invoke `@fluentui/react-tabster` focus-restoration or\n * `@fluentui/react-motion` ref-forwarding APIs internally; the wrapper\n * `useMenuPopover_unstable` layers those on top.\n \n @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n /\nexport const useMenuPopoverBase_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n 'use no memo';\n\n const safeZone = useMenuContext_unstable(context => context.safeZone);\n const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n const open = useMenuContext_unstable(context => context.open);\n const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n\n const isSubmenu = useIsSubmenu();\n const shouldCloseOnArrowLeft = useMenuListContext_unstable(ctx => ctx.shouldCloseOnArrowLeft ?? true);\n\n const canDispatchCustomEventRef = React.useRef(true);\n const [setThrottleTimeout, clearThrottleTimeout] = useTimeout();\n\n const { dir } = useFluent();\n const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n // use DOM listener since react events propagate up the react tree\n // no need to do `contains` logic as menus are all positioned in different portals\n const mouseOverListenerCallbackRef = React.useCallback(\n (node: HTMLElement) => {\n if (node) {\n // Dispatches the custom menu mouse enter event with throttling\n // Needs to trigger on mouseover to support keyboard + mouse together\n // i.e. keyboard opens submenus while cursor is still on the parent\n node.addEventListener('mouseover', e => {\n if (canDispatchCustomEventRef.current) {\n canDispatchCustomEventRef.current = false;\n dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n setThrottleTimeout(() => {\n canDispatchCustomEventRef.current = true;\n }, 250);\n }\n });\n }\n },\n [popoverRef, setThrottleTimeout],\n );\n\n React.useEffect(() => {\n return () => clearThrottleTimeout();\n }, [clearThrottleTimeout]);\n\n const inline = useMenuContext_unstable(context => context.inline) ?? false;\n const mountNode = useMenuContext_unstable(context => context.mountNode);\n\n const rootProps = slot.always(\n getIntrinsicElementProps('div', {\n role: 'presentation',\n ...props,\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef) as React.Ref<HTMLDivElement>,\n }),\n { elementType: 'div' },\n );\n\n const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n if (openOnHover \|\| isSubmenu) {\n setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n }\n onMouseEnterOriginal?.(event);\n });\n\n rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n const key = event.key;\n if (key === Escape \|\| (isSubmenu && shouldCloseOnArrowLeft && key === CloseArrowKey)) {\n if (open && popoverRef.current?.contains(event.target as HTMLElement) && !event.isDefaultPrevented()) {\n setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Popover, Menu and Tooltip\n event.preventDefault();\n }\n }\n if (key === Tab) {\n setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n if (!isSubmenu) {\n triggerRef.current?.focus();\n }\n }\n onKeyDownOriginal?.(event);\n });\n\n return {\n inline,\n mountNode,\n safeZone,\n components: { root: 'div' },\n root: rootProps,\n };\n};\n\n/\n Create the state required to render MenuPopover.\n \n The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n \n @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n const restoreFocusSourceAttributes = useRestoreFocusSource();\n const motionRef = useMotionForwardedRef();\n const baseState = useMenuPopoverBase_unstable(props, ref);\n\n return {\n ...baseState,\n root: {\n ...restoreFocusSourceAttributes,\n ...baseState.root,\n ref: useMergedRefs(baseState.root.ref, motionRef) as React.Ref<HTMLDivElement>,\n },\n };\n};\n"],"names":["ArrowLeft","Tab","ArrowRight","Escape","useFluent_unstable","useFluent","useMotionForwardedRef","useRestoreFocusSource","getIntrinsicElementProps","useEventCallback","useMergedRefs","slot","useTimeout","React","useMenuContext_unstable","useMenuListContext_unstable","dispatchMenuEnterEvent","useIsSubmenu","useMenuPopoverBase_unstable","props","ref","safeZone","context","popoverRef","menuPopoverRef","setOpen","open","openOnHover","triggerRef","isSubmenu","shouldCloseOnArrowLeft","ctx","canDispatchCustomEventRef","useRef","setThrottleTimeout","clearThrottleTimeout","dir","CloseArrowKey","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","useEffect","inline","mountNode","rootProps","always","role","elementType","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","isDefaultPrevented","preventDefault","focus","components","root","useMenuPopover_unstable","restoreFocusSourceAttributes","motionRef","baseState"],"mappings":"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"}
1	+ {"version":3,"sources":["../src/components/MenuPopover/useMenuPopover.ts"],"sourcesContent":["'use client';\n\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useMotionForwardedRef } from '@fluentui/react-motion';\nimport {\n useRestoreFocusSource,\n useTabsterAttributes,\n useMergedTabsterAttributes_unstable,\n} from '@fluentui/react-tabster';\nimport { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot, useTimeout } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';\nimport type { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\n\n/*\n Base hook for MenuPopover, produces state required to render the component.\n \n Does not invoke `@fluentui/react-tabster` focus-restoration or\n * `@fluentui/react-motion` ref-forwarding APIs internally; the wrapper\n * `useMenuPopover_unstable` layers those on top.\n \n @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n /\nexport const useMenuPopoverBase_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n 'use no memo'; // justified: compiler would optimize useMenuPopoverBase_unstable — manual opt-out to preserve runtime behavior\n\n const safeZone = useMenuContext_unstable(context => context.safeZone);\n const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n const open = useMenuContext_unstable(context => context.open);\n const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n\n const isSubmenu = useIsSubmenu();\n const shouldCloseOnArrowLeft = useMenuListContext_unstable(ctx => ctx.shouldCloseOnArrowLeft ?? true);\n\n const canDispatchCustomEventRef = React.useRef(true);\n const [setThrottleTimeout, clearThrottleTimeout] = useTimeout();\n\n const { dir } = useFluent();\n const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n // use DOM listener since react events propagate up the react tree\n // no need to do `contains` logic as menus are all positioned in different portals\n const mouseOverListenerCallbackRef = React.useCallback(\n (node: HTMLElement) => {\n if (node) {\n // Dispatches the custom menu mouse enter event with throttling\n // Needs to trigger on mouseover to support keyboard + mouse together\n // i.e. keyboard opens submenus while cursor is still on the parent\n node.addEventListener('mouseover', e => {\n if (canDispatchCustomEventRef.current) {\n canDispatchCustomEventRef.current = false;\n dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n setThrottleTimeout(() => {\n canDispatchCustomEventRef.current = true;\n }, 250);\n }\n });\n }\n },\n [popoverRef, setThrottleTimeout],\n );\n\n React.useEffect(() => {\n return () => clearThrottleTimeout();\n }, [clearThrottleTimeout]);\n\n const inline = useMenuContext_unstable(context => context.inline) ?? false;\n const mountNode = useMenuContext_unstable(context => context.mountNode);\n\n const rootProps = slot.always(\n getIntrinsicElementProps('div', {\n role: 'presentation',\n ...props,\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef) as React.Ref<HTMLDivElement>,\n }),\n { elementType: 'div' },\n );\n\n const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n if (openOnHover \|\| isSubmenu) {\n setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n }\n onMouseEnterOriginal?.(event);\n });\n\n rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n const key = event.key;\n if (key === Escape \|\| (isSubmenu && shouldCloseOnArrowLeft && key === CloseArrowKey)) {\n if (open && popoverRef.current?.contains(event.target as HTMLElement) && !event.isDefaultPrevented()) {\n setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Popover, Menu and Tooltip\n event.preventDefault();\n }\n }\n if (key === Tab) {\n setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n if (!isSubmenu) {\n triggerRef.current?.focus();\n }\n }\n onKeyDownOriginal?.(event);\n });\n\n return {\n inline,\n mountNode,\n safeZone,\n components: { root: 'div' },\n root: rootProps,\n };\n};\n\n/\n Create the state required to render MenuPopover.\n \n The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n \n @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n const restoreFocusSourceAttributes = useRestoreFocusSource();\n\n // Opt the menu's popover out of tabster's Escape handling. The menu closes itself on\n // Escape; without this tabster would also act on Escape (e.g. escaping a parent\n // groupper/modalizer) and move focus away from the trigger instead of restoring it.\n const ignoreEscapeKeyAttribute = useTabsterAttributes({\n focusable: { ignoreKeydown: { Escape: true } },\n });\n\n const tabsterAttributes = useMergedTabsterAttributes_unstable(restoreFocusSourceAttributes, ignoreEscapeKeyAttribute);\n\n const motionRef = useMotionForwardedRef();\n const baseState = useMenuPopoverBase_unstable(props, ref);\n\n return {\n ...baseState,\n root: {\n ...tabsterAttributes,\n ...baseState.root,\n ref: useMergedRefs(baseState.root.ref, motionRef) as React.Ref<HTMLDivElement>,\n },\n };\n};\n"],"names":["ArrowLeft","Tab","ArrowRight","Escape","useFluent_unstable","useFluent","useMotionForwardedRef","useRestoreFocusSource","useTabsterAttributes","useMergedTabsterAttributes_unstable","getIntrinsicElementProps","useEventCallback","useMergedRefs","slot","useTimeout","React","useMenuContext_unstable","useMenuListContext_unstable","dispatchMenuEnterEvent","useIsSubmenu","useMenuPopoverBase_unstable","props","ref","safeZone","context","popoverRef","menuPopoverRef","setOpen","open","openOnHover","triggerRef","isSubmenu","shouldCloseOnArrowLeft","ctx","canDispatchCustomEventRef","useRef","setThrottleTimeout","clearThrottleTimeout","dir","CloseArrowKey","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","useEffect","inline","mountNode","rootProps","always","role","elementType","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","isDefaultPrevented","preventDefault","focus","components","root","useMenuPopover_unstable","restoreFocusSourceAttributes","ignoreEscapeKeyAttribute","focusable","ignoreKeydown","tabsterAttributes","motionRef","baseState"],"mappings":"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"}

package/lib/components/MenuPopover/useMenuPopoverStyles.styles.js CHANGED Viewed

@@ -60,8 +60,6 @@ const useStyles = /*#__PURE__*/__styles({
  * Apply styling to the Menu slots based on the state
  */
 export const useMenuPopoverStyles_unstable = state => {
-  'use no memo';
   const styles = useStyles();
   // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);

package/lib/components/MenuPopover/useMenuPopoverStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["mergeClasses","__styles","tokens","typographyStyles","menuPopoverClassNames","root","useStyles","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","De3pzq","sj55zd","B7ck84d","Bf4jedk","B2u0y6b","B68tc82","a9b677","E5pizo","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","d","p","useMenuPopoverStyles_unstable","state","styles","className"],"sources":["useMenuPopoverStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const menuPopoverClassNames = {\n root: 'fui-MenuPopover'\n};\nconst useStyles = makeStyles({\n root: {\n borderRadius: tokens.borderRadiusMedium,\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n boxSizing: 'border-box',\n minWidth: '138px',\n maxWidth: '300px',\n overflowX: 'hidden',\n width: 'max-content',\n boxShadow: `${tokens.shadow16}`,\n padding: '4px',\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1\n }\n});\n/*\n Apply styling to the Menu slots based on the state\n */ export const useMenuPopoverStyles_unstable = (state)=>{\n ~~'use no memo';\n~~ const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGL,QAAA;EAAAI,IAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAejB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,~~aAAa;;EACb,~~MAAMC,MAAM,GAAG5C,SAAS,CAAC,CAAC;EAC1B;EACA2C,KAAK,CAAC5C,IAAI,CAAC8C,SAAS,GAAGnD,YAAY,CAACI,qBAAqB,CAACC,IAAI,EAAE6C,MAAM,CAAC7C,IAAI,EAAE4C,KAAK,CAAC5C,IAAI,CAAC8C,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["mergeClasses","__styles","tokens","typographyStyles","menuPopoverClassNames","root","useStyles","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","De3pzq","sj55zd","B7ck84d","Bf4jedk","B2u0y6b","B68tc82","a9b677","E5pizo","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","d","p","useMenuPopoverStyles_unstable","state","styles","className"],"sources":["useMenuPopoverStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const menuPopoverClassNames = {\n root: 'fui-MenuPopover'\n};\nconst useStyles = makeStyles({\n root: {\n borderRadius: tokens.borderRadiusMedium,\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n boxSizing: 'border-box',\n minWidth: '138px',\n maxWidth: '300px',\n overflowX: 'hidden',\n width: 'max-content',\n boxShadow: `${tokens.shadow16}`,\n padding: '4px',\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1\n }\n});\n/*\n Apply styling to the Menu slots based on the state\n */ export const useMenuPopoverStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGL,QAAA;EAAAI,IAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAejB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,MAAMC,MAAM,GAAG5C,SAAS,CAAC,CAAC;EAC1B;EACA2C,KAAK,CAAC5C,IAAI,CAAC8C,SAAS,GAAGnD,YAAY,CAACI,qBAAqB,CAACC,IAAI,EAAE6C,MAAM,CAAC7C,IAAI,EAAE4C,KAAK,CAAC5C,IAAI,CAAC8C,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/MenuPopover/useMenuPopoverStyles.styles.raw.js CHANGED Viewed

@@ -23,7 +23,6 @@ const useStyles = makeStyles({
 /**
  * Apply styling to the Menu slots based on the state
  */ export const useMenuPopoverStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);

package/lib/components/MenuPopover/useMenuPopoverStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/MenuPopover/useMenuPopoverStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots> = {\n root: 'fui-MenuPopover',\n};\n\nconst useStyles = makeStyles({\n root: {\n borderRadius: tokens.borderRadiusMedium,\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n boxSizing: 'border-box',\n minWidth: '138px',\n maxWidth: '300px',\n overflowX: 'hidden',\n width: 'max-content',\n boxShadow: `${tokens.shadow16}`,\n padding: '4px',\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n },\n});\n\n/*\n Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n ~~'use no memo';\n\n~~ const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","makeStyles","tokens","typographyStyles","menuPopoverClassNames","root","useStyles","borderRadius","borderRadiusMedium","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxSizing","minWidth","maxWidth","overflowX","width","boxShadow","shadow16","padding","border","colorTransparentStroke","body1","useMenuPopoverStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAIjE,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYL,WAAW;IAC3BI,MAAM;QACJE,cAAcL,OAAOM,kBAAkB;QACvCC,iBAAiBP,OAAOQ,uBAAuB;QAC/CC,OAAOT,OAAOU,uBAAuB;QACrCC,WAAW;QACXC,UAAU;QACVC,UAAU;QACVC,WAAW;QACXC,OAAO;QACPC,WAAW,GAAGhB,OAAOiB,QAAQ,EAAE;QAC/BC,SAAS;QACTC,QAAQ,CAAC,UAAU,EAAEnB,OAAOoB,sBAAsB,EAAE;QACpD,GAAGnB,iBAAiBoB,KAAK;IAC3B;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C~~;IAEA~~,MAAMC,SAASpB;IACf,oDAAoD;IACpDmB,MAAMpB,IAAI,CAACsB,SAAS,GAAG3B,aAAaI,sBAAsBC,IAAI,EAAEqB,OAAOrB,IAAI,EAAEoB,MAAMpB,IAAI,CAACsB,SAAS;IACjG,OAAOF;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/MenuPopover/useMenuPopoverStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots> = {\n root: 'fui-MenuPopover',\n};\n\nconst useStyles = makeStyles({\n root: {\n borderRadius: tokens.borderRadiusMedium,\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n boxSizing: 'border-box',\n minWidth: '138px',\n maxWidth: '300px',\n overflowX: 'hidden',\n width: 'max-content',\n boxShadow: `${tokens.shadow16}`,\n padding: '4px',\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n },\n});\n\n/*\n Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","makeStyles","tokens","typographyStyles","menuPopoverClassNames","root","useStyles","borderRadius","borderRadiusMedium","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxSizing","minWidth","maxWidth","overflowX","width","boxShadow","shadow16","padding","border","colorTransparentStroke","body1","useMenuPopoverStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAIjE,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYL,WAAW;IAC3BI,MAAM;QACJE,cAAcL,OAAOM,kBAAkB;QACvCC,iBAAiBP,OAAOQ,uBAAuB;QAC/CC,OAAOT,OAAOU,uBAAuB;QACrCC,WAAW;QACXC,UAAU;QACVC,UAAU;QACVC,WAAW;QACXC,OAAO;QACPC,WAAW,GAAGhB,OAAOiB,QAAQ,EAAE;QAC/BC,SAAS;QACTC,QAAQ,CAAC,UAAU,EAAEnB,OAAOoB,sBAAsB,EAAE;QACpD,GAAGnB,iBAAiBoB,KAAK;IAC3B;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C,MAAMC,SAASpB;IACf,oDAAoD;IACpDmB,MAAMpB,IAAI,CAACsB,SAAS,GAAG3B,aAAaI,sBAAsBC,IAAI,EAAEqB,OAAOrB,IAAI,EAAEoB,MAAMpB,IAAI,CAACsB,SAAS;IACjG,OAAOF;AACT,EAAE"}

package/lib/components/MenuSplitGroup/useMenuSplitGroupContextValues.js CHANGED Viewed

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 export const useMenuSplitGroupContextValues = (state)=>{
-    'use no memo';
+    'use no memo'; // justified: compiler would optimize useMenuSplitGroupContextValues — manual opt-out to preserve runtime behavior
     return React.useMemo(()=>{
         return {
             menuSplitGroup: {

package/lib/components/MenuSplitGroup/useMenuSplitGroupContextValues.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroupContextValues.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { MenuSplitGroupContextValues, MenuSplitGroupState } from './MenuSplitGroup.types';\n\nexport const useMenuSplitGroupContextValues = (state: MenuSplitGroupState): MenuSplitGroupContextValues => {\n 'use no memo';\n\n return React.useMemo(() => {\n return {\n menuSplitGroup: {\n setMultiline: state.setMultiline,\n },\n };\n }, [state.setMultiline]);\n};\n"],"names":["React","useMenuSplitGroupContextValues","state","useMemo","menuSplitGroup","setMultiline"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,MAAMC,iCAAiC,CAACC;IAC7C;~~IAEA~~,OAAOF,MAAMG,OAAO,CAAC;QACnB,OAAO;YACLC,gBAAgB;gBACdC,cAAcH,MAAMG,YAAY;YAClC;QACF;IACF,GAAG;QAACH,MAAMG,YAAY;KAAC;AACzB,EAAE"}
1	+ {"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroupContextValues.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { MenuSplitGroupContextValues, MenuSplitGroupState } from './MenuSplitGroup.types';\n\nexport const useMenuSplitGroupContextValues = (state: MenuSplitGroupState): MenuSplitGroupContextValues => {\n 'use no memo'; // justified: compiler would optimize useMenuSplitGroupContextValues — manual opt-out to preserve runtime behavior\n\n return React.useMemo(() => {\n return {\n menuSplitGroup: {\n setMultiline: state.setMultiline,\n },\n };\n }, [state.setMultiline]);\n};\n"],"names":["React","useMenuSplitGroupContextValues","state","useMemo","menuSplitGroup","setMultiline"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,MAAMC,iCAAiC,CAACC;IAC7C,eAAe,kHAAkH;IAEjI,OAAOF,MAAMG,OAAO,CAAC;QACnB,OAAO;YACLC,gBAAgB;gBACdC,cAAcH,MAAMG,YAAY;YAClC;QACF;IACF,GAAG;QAACH,MAAMG,YAAY;KAAC;AACzB,EAAE"}

package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.js CHANGED Viewed

@@ -36,8 +36,6 @@ const useStyles = /*#__PURE__*/__styles({
  * Apply styling to the MenuSplitGroup slots based on the state
  */
 export const useMenuSplitGroupStyles_unstable = state => {
-  'use no memo';
   const styles = useStyles();
   // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);

package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__styles","mergeClasses","tokens","menuItemClassNames","menuSplitGroupMultilineAttr","menuSplitGroupClassNames","root","useStyles","Bhlrgs3","mc9l5x","rue6gn","oe75ve","Bbblmiw","Bn2ps6a","Bu15iap","B71tm0z","Gjs4sj","foni4y","Ie9k5m","f30fub","Jberyy","d","p","useMenuSplitGroupStyles_unstable","state","styles","className"],"sources":["useMenuSplitGroupStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\nexport const menuSplitGroupClassNames = {\n root: 'fui-MenuSplitGroup'\n};\n/*\n Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n / const useStyles = makeStyles({\n root: {\n [`[${menuSplitGroupMultilineAttr}]`]: {\n [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n alignSelf: 'center'\n }\n },\n display: 'flex',\n [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n flex: 1\n },\n [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n '::before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '20px',\n backgroundColor: tokens.colorNeutralStroke1\n }\n }\n }\n});\n/\n Apply styling to the MenuSplitGroup slots based on the state\n */ export const useMenuSplitGroupStyles_unstable = (state)=>{\n ~~'use no memo';\n~~ const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,kBAAkB,QAAQ,sCAAsC;AACzE,OAAO,MAAMC,2BAA2B,GAAG,gBAAgB;AAC3D,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGP,QAAA;EAAAM,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAuBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,gCAAgC,GAAIC,KAAK,IAAG;EACzD,~~aAAa;;EACb,~~MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;EAC1B;EACAiB,KAAK,CAAClB,IAAI,CAACoB,SAAS,GAAGzB,YAAY,CAACI,wBAAwB,CAACC,IAAI,EAAEmB,MAAM,CAACnB,IAAI,EAAEkB,KAAK,CAAClB,IAAI,CAACoB,SAAS,CAAC;EACrG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["__styles","mergeClasses","tokens","menuItemClassNames","menuSplitGroupMultilineAttr","menuSplitGroupClassNames","root","useStyles","Bhlrgs3","mc9l5x","rue6gn","oe75ve","Bbblmiw","Bn2ps6a","Bu15iap","B71tm0z","Gjs4sj","foni4y","Ie9k5m","f30fub","Jberyy","d","p","useMenuSplitGroupStyles_unstable","state","styles","className"],"sources":["useMenuSplitGroupStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\nexport const menuSplitGroupClassNames = {\n root: 'fui-MenuSplitGroup'\n};\n/*\n Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n / const useStyles = makeStyles({\n root: {\n [`[${menuSplitGroupMultilineAttr}]`]: {\n [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n alignSelf: 'center'\n }\n },\n display: 'flex',\n [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n flex: 1\n },\n [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n '::before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '20px',\n backgroundColor: tokens.colorNeutralStroke1\n }\n }\n }\n});\n/\n Apply styling to the MenuSplitGroup slots based on the state\n */ export const useMenuSplitGroupStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,kBAAkB,QAAQ,sCAAsC;AACzE,OAAO,MAAMC,2BAA2B,GAAG,gBAAgB;AAC3D,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGP,QAAA;EAAAM,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAuBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,gCAAgC,GAAIC,KAAK,IAAG;EACzD,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;EAC1B;EACAiB,KAAK,CAAClB,IAAI,CAACoB,SAAS,GAAGzB,YAAY,CAACI,wBAAwB,CAACC,IAAI,EAAEmB,MAAM,CAACnB,IAAI,EAAEkB,KAAK,CAAClB,IAAI,CAACoB,SAAS,CAAC;EACrG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.js CHANGED Viewed

@@ -36,7 +36,6 @@ export const menuSplitGroupClassNames = {
 /**
  * Apply styling to the MenuSplitGroup slots based on the state
  */ export const useMenuSplitGroupStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);

package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nimport type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\n\nexport const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots> = {\n root: 'fui-MenuSplitGroup',\n};\n/*\n Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n /\nconst useStyles = makeStyles({\n root: {\n [`[${menuSplitGroupMultilineAttr}]`]: {\n [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n alignSelf: 'center',\n },\n },\n display: 'flex',\n [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n flex: 1,\n },\n [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n '::before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '20px',\n backgroundColor: tokens.colorNeutralStroke1,\n },\n },\n },\n});\n\n/\n Apply styling to the MenuSplitGroup slots based on the state\n */\nexport const useMenuSplitGroupStyles_unstable = (state: MenuSplitGroupState): MenuSplitGroupState => {\n ~~'use no memo';\n\n~~ const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","menuItemClassNames","menuSplitGroupMultilineAttr","menuSplitGroupClassNames","root","useStyles","alignSelf","display","flex","borderTopLeftRadius","borderBottomLeftRadius","paddingLeft","content","width","strokeWidthThin","height","backgroundColor","colorNeutralStroke1","useMenuSplitGroupStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,kBAAkB,QAAQ,uCAAuC;AAI1E,OAAO,MAAMC,8BAA8B,iBAAiB;AAE5D,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AACF;;;CAGC,GACD,MAAMC,YAAYP,WAAW;IAC3BM,MAAM;QACJ,CAAC,CAAC,CAAC,EAAEF,4BAA4B,CAAC,CAAC,CAAC,EAAE;YACpC,CAAC,CAAC,KAAK,EAAED,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;gBAClDE,WAAW;YACb;QACF;QACAC,SAAS;QACT,CAAC,CAAC,KAAK,EAAEN,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDI,MAAM;QACR;QACA,CAAC,CAAC,KAAK,EAAEP,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDK,qBAAqB;YACrBC,wBAAwB;YACxBC,aAAa;YACb,YAAY;gBACVC,SAAS;gBACTC,OAAOb,OAAOc,eAAe;gBAC7BC,QAAQ;gBACRC,iBAAiBhB,OAAOiB,mBAAmB;YAC7C;QACF;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C~~;IAEA~~,MAAMC,SAASf;IACf,oDAAoD;IACpDc,MAAMf,IAAI,CAACiB,SAAS,GAAGtB,aAAaI,yBAAyBC,IAAI,EAAEgB,OAAOhB,IAAI,EAAEe,MAAMf,IAAI,CAACiB,SAAS;IACpG,OAAOF;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nimport type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\n\nexport const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots> = {\n root: 'fui-MenuSplitGroup',\n};\n/*\n Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n /\nconst useStyles = makeStyles({\n root: {\n [`[${menuSplitGroupMultilineAttr}]`]: {\n [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n alignSelf: 'center',\n },\n },\n display: 'flex',\n [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n flex: 1,\n },\n [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n '::before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '20px',\n backgroundColor: tokens.colorNeutralStroke1,\n },\n },\n },\n});\n\n/\n Apply styling to the MenuSplitGroup slots based on the state\n */\nexport const useMenuSplitGroupStyles_unstable = (state: MenuSplitGroupState): MenuSplitGroupState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","menuItemClassNames","menuSplitGroupMultilineAttr","menuSplitGroupClassNames","root","useStyles","alignSelf","display","flex","borderTopLeftRadius","borderBottomLeftRadius","paddingLeft","content","width","strokeWidthThin","height","backgroundColor","colorNeutralStroke1","useMenuSplitGroupStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,kBAAkB,QAAQ,uCAAuC;AAI1E,OAAO,MAAMC,8BAA8B,iBAAiB;AAE5D,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AACF;;;CAGC,GACD,MAAMC,YAAYP,WAAW;IAC3BM,MAAM;QACJ,CAAC,CAAC,CAAC,EAAEF,4BAA4B,CAAC,CAAC,CAAC,EAAE;YACpC,CAAC,CAAC,KAAK,EAAED,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;gBAClDE,WAAW;YACb;QACF;QACAC,SAAS;QACT,CAAC,CAAC,KAAK,EAAEN,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDI,MAAM;QACR;QACA,CAAC,CAAC,KAAK,EAAEP,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDK,qBAAqB;YACrBC,wBAAwB;YACxBC,aAAa;YACb,YAAY;gBACVC,SAAS;gBACTC,OAAOb,OAAOc,eAAe;gBAC7BC,QAAQ;gBACRC,iBAAiBhB,OAAOiB,mBAAmB;YAC7C;QACF;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C,MAAMC,SAASf;IACf,oDAAoD;IACpDc,MAAMf,IAAI,CAACiB,SAAS,GAAGtB,aAAaI,yBAAyBC,IAAI,EAAEgB,OAAOhB,IAAI,EAAEe,MAAMf,IAAI,CAACiB,SAAS;IACpG,OAAOF;AACT,EAAE"}

package/lib/selectable/useCheckmarkStyles.styles.js CHANGED Viewed

@@ -21,8 +21,6 @@ const useStyles = /*#__PURE__*/__styles({
  * @param state - should contain a `checkmark` slot
  */
 export const useCheckmarkStyles_unstable = state => {
-  'use no memo';
   const styles = useStyles();
   if (state.checkmark) {
     // eslint-disable-next-line react-hooks/immutability

package/lib/selectable/useCheckmarkStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["mergeClasses","__styles","useStyles","root","a9b677","Bqenvij","Bcdw1i0","Bnnss6s","rootChecked","d","useCheckmarkStyles_unstable","state","styles","checkmark","className","checked"],"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 // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(styles.root, state.checked && styles.rootChecked, state.checkmark.className);\n }\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,MAAMC,SAAS,gBAAGD,QAAA;EAAAE,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAC,WAAA;IAAAF,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAWjB,CAAC;AACF;AACA;AACA;AACA;AACA;AAAI,OAAO,MAAMC,2BAA2B,GAAIC,KAAK,IAAG;EACpD,~~aAAa;;EACb,~~MAAMC,MAAM,GAAGV,SAAS,CAAC,CAAC;EAC1B,IAAIS,KAAK,CAACE,SAAS,EAAE;IACjB;IACAF,KAAK,CAACE,SAAS,CAACC,SAAS,GAAGd,YAAY,CAACY,MAAM,CAACT,IAAI,EAAEQ,KAAK,CAACI,OAAO,IAAIH,MAAM,CAACJ,WAAW,EAAEG,KAAK,CAACE,SAAS,CAACC,SAAS,CAAC;EACzH;AACJ,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["mergeClasses","__styles","useStyles","root","a9b677","Bqenvij","Bcdw1i0","Bnnss6s","rootChecked","d","useCheckmarkStyles_unstable","state","styles","checkmark","className","checked"],"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 const styles = useStyles();\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(styles.root, state.checked && styles.rootChecked, state.checkmark.className);\n }\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,MAAMC,SAAS,gBAAGD,QAAA;EAAAE,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAC,WAAA;IAAAF,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAWjB,CAAC;AACF;AACA;AACA;AACA;AACA;AAAI,OAAO,MAAMC,2BAA2B,GAAIC,KAAK,IAAG;EACpD,MAAMC,MAAM,GAAGV,SAAS,CAAC,CAAC;EAC1B,IAAIS,KAAK,CAACE,SAAS,EAAE;IACjB;IACAF,KAAK,CAACE,SAAS,CAACC,SAAS,GAAGd,YAAY,CAACY,MAAM,CAACT,IAAI,EAAEQ,KAAK,CAACI,OAAO,IAAIH,MAAM,CAACJ,WAAW,EAAEG,KAAK,CAACE,SAAS,CAACC,SAAS,CAAC;EACzH;AACJ,CAAC","ignoreList":[]}

package/lib/selectable/useCheckmarkStyles.styles.raw.js CHANGED Viewed

@@ -17,7 +17,6 @@ const useStyles = makeStyles({
  *
  * @param state - should contain a `checkmark` slot
  */ export const useCheckmarkStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     if (state.checkmark) {
         // eslint-disable-next-line react-hooks/immutability

package/lib/selectable/useCheckmarkStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"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 // eslint-disable-next-line react-hooks/immutability\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;AAEA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAI1D,MAAMC,YAAYD,WAAW;IAC3BE,MAAM;QACJC,OAAO;QACPC,QAAQ;QACRC,YAAY;QACZC,YAAY;IACd;IACAC,aAAa;QACXF,YAAY;QACZC,YAAY;IACd;AACF;AAEA;;;;CAIC,GACD,OAAO,MAAME,8BAA8B,CACzCC;IAEA~~;IAEA~~,MAAMC,SAAST;IACf,IAAIQ,MAAME,SAAS,EAAE;QACnB,oDAAoD;QACpDF,MAAME,SAAS,CAACC,SAAS,GAAGb,aAC1BW,OAAOR,IAAI,EACXO,MAAMI,OAAO,IAAIH,OAAOH,WAAW,EACnCE,MAAME,SAAS,CAACC,SAAS;IAE7B;AACF,EAAE"}
1	+ {"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 const styles = useStyles();\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\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;AAEA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAI1D,MAAMC,YAAYD,WAAW;IAC3BE,MAAM;QACJC,OAAO;QACPC,QAAQ;QACRC,YAAY;QACZC,YAAY;IACd;IACAC,aAAa;QACXF,YAAY;QACZC,YAAY;IACd;AACF;AAEA;;;;CAIC,GACD,OAAO,MAAME,8BAA8B,CACzCC;IAEA,MAAMC,SAAST;IACf,IAAIQ,MAAME,SAAS,EAAE;QACnB,oDAAoD;QACpDF,MAAME,SAAS,CAACC,SAAS,GAAGb,aAC1BW,OAAOR,IAAI,EACXO,MAAMI,OAAO,IAAIH,OAAOH,WAAW,EACnCE,MAAME,SAAS,CAACC,SAAS;IAE7B;AACF,EAAE"}

package/lib/utils/useValidateNesting.js CHANGED Viewed

@@ -3,7 +3,6 @@ import * as React from 'react';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
 import { useMenuContext_unstable } from '../contexts/menuContext';
 export const useValidateNesting = (componentName)=>{
-    'use no memo';
     const { targetDocument } = useFluent();
     const triggerRef = useMenuContext_unstable((context)=>context.triggerRef);
     const inline = useMenuContext_unstable((context)=>context.inline);