@fluentui/react-menu 9.14.5 → 9.14.7

package/lib/components/MenuDivider/useMenuDividerStyles.styles.js

@@ -1,21 +1,27 @@
-import { shorthands, mergeClasses, __styles } from '@griffel/react';
+import { mergeClasses, __styles } from '@griffel/react';
 import { tokens } from '@fluentui/react-theme';
 export const menuDividerClassNames = {
   root: 'fui-MenuDivider'
 };
 const useStyles = /*#__PURE__*/__styles({
   root: {
-    B6of3ja: "fvjh0tl",
-    t21cq0: ["f1rnx978", "f1q7jvqi"],
-    jrapky: "fd1gkq",
-    Frg6f3: ["f1q7jvqi", "f1rnx978"],
+    jrapky: 0,
+    Frg6f3: 0,
+    t21cq0: 0,
+    B6of3ja: 0,
+    B74szlk: "f8dz51a",
     a9b677: "f14z66ap",
-    Bn0qgzm: "f1vxd6vx",
-    oivjwe: "fg706s2",
-    B9xav0g: "frpde29"
+    B9xav0g: 0,
+    oivjwe: 0,
+    Bn0qgzm: 0,
+    Bgfg5da: "f1facbz3"
   }
 }, {
-  d: [".fvjh0tl{margin-top:4px;}", ".f1rnx978{margin-right:-5px;}", ".f1q7jvqi{margin-left:-5px;}", ".fd1gkq{margin-bottom:4px;}", ".f14z66ap{width:auto;}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".fg706s2{border-bottom-style:solid;}", ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}"]
+  d: [[".f8dz51a{margin:4px -5px 4px -5px;}", {
+    p: -1
+  }], ".f14z66ap{width:auto;}", [".f1facbz3{border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke2);}", {
+    p: -1
+  }]]
 });
 export const useMenuDividerStyles_unstable = state => {
   const styles = useStyles();

package/lib/components/MenuDivider/useMenuDividerStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["shorthands","mergeClasses","__styles","tokens","menuDividerClassNames","root","useStyles","B6of3ja","t21cq0","jrapky","Frg6f3","a9b677","Bn0qgzm","oivjwe","B9xav0g","d","useMenuDividerStyles_unstable","state","styles","className"],"sources":["useMenuDividerStyles.styles.js"],"sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const menuDividerClassNames = {\n    root: 'fui-MenuDivider'\n};\nconst useStyles = makeStyles({\n    root: {\n        ...shorthands.margin('4px', '-5px', '4px', '-5px'),\n        width: 'auto',\n        ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2)\n    }\n});\nexport const useMenuDividerStyles_unstable = (state)=>{\n    const styles = useStyles();\n    state.root.className = mergeClasses(menuDividerClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAMjB,CAAC;AACF,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EAClD,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1BW,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGlB,YAAY,CAACG,qBAAqB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["mergeClasses","__styles","tokens","menuDividerClassNames","root","useStyles","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","a9b677","B9xav0g","oivjwe","Bn0qgzm","Bgfg5da","d","p","useMenuDividerStyles_unstable","state","styles","className"],"sources":["useMenuDividerStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const menuDividerClassNames = {\n    root: 'fui-MenuDivider'\n};\nconst useStyles = makeStyles({\n    root: {\n        margin: '4px -5px 4px -5px',\n        width: 'auto',\n        borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}`\n    }\n});\nexport const useMenuDividerStyles_unstable = (state)=>{\n    const styles = useStyles();\n    state.root.className = mergeClasses(menuDividerClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAMjB,CAAC;AACF,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EAClD,MAAMC,MAAM,GAAGf,SAAS,CAAC,CAAC;EAC1Bc,KAAK,CAACf,IAAI,CAACiB,SAAS,GAAGrB,YAAY,CAACG,qBAAqB,CAACC,IAAI,EAAEgB,MAAM,CAAChB,IAAI,EAAEe,KAAK,CAACf,IAAI,CAACiB,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/MenuItem/useMenuItemStyles.styles.js

@@ -11,9 +11,9 @@ export const menuItemClassNames = {
   content: 'fui-MenuItem__content',
   secondaryContent: 'fui-MenuItem__secondaryContent'
 };
-const useRootBaseStyles = /*#__PURE__*/__resetStyles("rszfvis", "ruxd6yz", {
-  r: [".rszfvis{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-right:var(--spacingVerticalSNudge);padding-left:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}", ".rszfvis:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}", ".rszfvis:hover .fui-Icon-filled{display:inline;}", ".rszfvis:hover .fui-Icon-regular{display:none;}", ".rszfvis:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".rszfvis:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}", ".rszfvis:focus{outline-style:none;}", ".rszfvis:focus-visible{outline-style:none;}", ".rszfvis[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}", ".rszfvis[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}", ".ruxd6yz{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-left:var(--spacingVerticalSNudge);padding-right:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}", ".ruxd6yz:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}", ".ruxd6yz:hover .fui-Icon-filled{display:inline;}", ".ruxd6yz:hover .fui-Icon-regular{display:none;}", ".ruxd6yz:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".ruxd6yz:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}", ".ruxd6yz:focus{outline-style:none;}", ".ruxd6yz:focus-visible{outline-style:none;}", ".ruxd6yz[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}", ".ruxd6yz[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"],
-  s: ["@media (forced-colors: active){.rszfvis:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.rszfvis:focus{outline-style:none;}.rszfvis:focus-visible{outline-style:none;}.rszfvis[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}@media (forced-colors: active){.rszfvis[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}.rszfvis[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}}", "@media (forced-colors: active){.rszfvis[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}", "@media (forced-colors: active){.ruxd6yz:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.ruxd6yz:focus{outline-style:none;}.ruxd6yz:focus-visible{outline-style:none;}.ruxd6yz[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}@media (forced-colors: active){.ruxd6yz[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}.ruxd6yz[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}}", "@media (forced-colors: active){.ruxd6yz[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"]
+const useRootBaseStyles = /*#__PURE__*/__resetStyles("r11normc", "r1lnj0i0", {
+  r: [".r11normc{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-right:var(--spacingVerticalSNudge);padding-left:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}", ".r11normc:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}", ".r11normc:hover .fui-Icon-filled{display:inline;}", ".r11normc:hover .fui-Icon-regular{display:none;}", ".r11normc:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".r11normc:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}", ".r11normc:focus{outline-style:none;}", ".r11normc:focus-visible{outline-style:none;}", ".r11normc[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}", ".r11normc[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}", ".r1lnj0i0{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-left:var(--spacingVerticalSNudge);padding-right:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}", ".r1lnj0i0:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}", ".r1lnj0i0:hover .fui-Icon-filled{display:inline;}", ".r1lnj0i0:hover .fui-Icon-regular{display:none;}", ".r1lnj0i0:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".r1lnj0i0:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}", ".r1lnj0i0:focus{outline-style:none;}", ".r1lnj0i0:focus-visible{outline-style:none;}", ".r1lnj0i0[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}", ".r1lnj0i0[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"],
+  s: ["@media (forced-colors: active){.r11normc:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.r11normc:focus{outline-style:none;}.r11normc:focus-visible{outline-style:none;}.r11normc[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}@media (forced-colors: active){.r11normc[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}.r11normc[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid Highlight;border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}}", "@media (forced-colors: active){.r11normc[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}", "@media (forced-colors: active){.r1lnj0i0:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.r1lnj0i0:focus{outline-style:none;}.r1lnj0i0:focus-visible{outline-style:none;}.r1lnj0i0[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}@media (forced-colors: active){.r1lnj0i0[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}.r1lnj0i0[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid Highlight;border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}}", "@media (forced-colors: active){.r1lnj0i0[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"]
 });
 const useContentBaseStyles = /*#__PURE__*/__resetStyles("r1ls86vo", "rpbc5dr", [".r1ls86vo{padding-left:2px;padding-right:2px;background-color:transparent;flex-grow:1;}", ".rpbc5dr{padding-right:2px;padding-left:2px;background-color:transparent;flex-grow:1;}"]);
 const useSecondaryContentBaseStyles = /*#__PURE__*/__resetStyles("r12mwwux", "r1ewgu5j", [".r12mwwux{padding-left:2px;padding-right:2px;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);}", ".r12mwwux:hover{color:var(--colorNeutralForeground3Hover);}", ".r12mwwux:focus{color:var(--colorNeutralForeground3Hover);}", ".r1ewgu5j{padding-right:2px;padding-left:2px;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);}", ".r1ewgu5j:hover{color:var(--colorNeutralForeground3Hover);}", ".r1ewgu5j:focus{color:var(--colorNeutralForeground3Hover);}"]);

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

@@ -1,4 +1,4 @@
-import { mergeClasses, __styles, shorthands } from '@griffel/react';
+import { mergeClasses, __styles } from '@griffel/react';
 export const menuListClassNames = {
   root: 'fui-MenuList'
 };
@@ -6,14 +6,17 @@ const useStyles = /*#__PURE__*/__styles({
   root: {
     mc9l5x: "f22iagw",
     Beiy3e4: "f1vx9l62",
-    i8kkvl: "f16mnhsx",
-    Belr9w4: "fbi42co"
+    i8kkvl: 0,
+    Belr9w4: 0,
+    rmohyg: "f1t6b6ee"
   },
   hasMenuContext: {
     Bqenvij: "f1l02sjl"
   }
 }, {
-  d: [".f22iagw{display:flex;}", ".f1vx9l62{flex-direction:column;}", ".f16mnhsx{column-gap:2px;}", ".fbi42co{row-gap:2px;}", ".f1l02sjl{height:100%;}"]
+  d: [".f22iagw{display:flex;}", ".f1vx9l62{flex-direction:column;}", [".f1t6b6ee{gap:2px;}", {
+    p: -1
+  }], ".f1l02sjl{height:100%;}"]
 });
 /**
  * Apply styling to the Menu slots based on the state

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

@@ -1 +1 @@
-{"version":3,"names":["mergeClasses","__styles","shorthands","menuListClassNames","root","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","hasMenuContext","Bqenvij","d","useMenuListStyles_unstable","state","styles","className"],"sources":["useMenuListStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nexport const menuListClassNames = {\n    root: 'fui-MenuList'\n};\nconst useStyles = makeStyles({\n    root: {\n        display: 'flex',\n        flexDirection: 'column',\n        ...shorthands.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    state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.hasMenuContext && styles.hasMenuContext, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAASA,YAAY,EAAAC,QAAA,EAAcC,UAAU,QAAQ,gBAAgB;AACrE,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CASjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,MAAM,GAAGV,SAAS,CAAC,CAAC;EAC1BS,KAAK,CAACV,IAAI,CAACY,SAAS,GAAGhB,YAAY,CAACG,kBAAkB,CAACC,IAAI,EAAEW,MAAM,CAACX,IAAI,EAAEU,KAAK,CAACJ,cAAc,IAAIK,MAAM,CAACL,cAAc,EAAEI,KAAK,CAACV,IAAI,CAACY,SAAS,CAAC;EAC9I,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"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":["import { 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    state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.hasMenuContext && styles.hasMenuContext, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,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;EAC1BW,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/MenuPopover/useMenuPopover.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';
-import { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';
+import { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot, useTimeout } from '@fluentui/react-utilities';
 import { useMenuContext_unstable } from '../../contexts/menuContext';
 import { dispatchMenuEnterEvent } from '../../utils/index';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
@@ -22,8 +22,8 @@ import { useRestoreFocusSource } from '@fluentui/react-tabster';
     const triggerRef = useMenuContext_unstable((context)=>context.triggerRef);
     const isSubmenu = useIsSubmenu();
     const canDispatchCustomEventRef = React.useRef(true);
-    const throttleDispatchTimerRef = React.useRef(0);
     const restoreFocusSourceAttributes = useRestoreFocusSource();
+    const [setThrottleTimeout, clearThrottleTimeout] = useTimeout();
     const { dir } = useFluent();
     const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;
     // use DOM listener since react events propagate up the react tree
@@ -37,19 +37,19 @@ import { useRestoreFocusSource } from '@fluentui/react-tabster';
                 if (canDispatchCustomEventRef.current) {
                     canDispatchCustomEventRef.current = false;
                     dispatchMenuEnterEvent(popoverRef.current, e);
-                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                    // @ts-ignore #16889 Node setTimeout type leaking
-                    throttleDispatchTimerRef.current = setTimeout(()=>canDispatchCustomEventRef.current = true, 250);
+                    setThrottleTimeout(()=>canDispatchCustomEventRef.current = true, 250);
                 }
             });
         }
     }, [
         popoverRef,
-        throttleDispatchTimerRef
+        setThrottleTimeout
     ]);
     React.useEffect(()=>{
-        ()=>clearTimeout(throttleDispatchTimerRef.current);
-    }, []);
+        ()=>clearThrottleTimeout();
+    }, [
+        clearThrottleTimeout
+    ]);
     var _useMenuContext_unstable;
     const inline = (_useMenuContext_unstable = useMenuContext_unstable((context)=>context.inline)) !== null && _useMenuContext_unstable !== void 0 ? _useMenuContext_unstable : false;
     const mountNode = useMenuContext_unstable((context)=>context.mountNode);

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

@@ -1 +1 @@
-{"version":3,"sources":["useMenuPopover.ts"],"sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport { useRestoreFocusSource } from '@fluentui/react-tabster';\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 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  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const throttleDispatchTimerRef = React.useRef(0);\n  const restoreFocusSourceAttributes = useRestoreFocusSource();\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            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore #16889 Node setTimeout type leaking\n            throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, throttleDispatchTimerRef],\n  );\n\n  React.useEffect(() => {\n    () => clearTimeout(throttleDispatchTimerRef.current);\n  }, []);\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      ...restoreFocusSourceAttributes,\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  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  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    const key = event.key;\n    if (key === Escape || (isSubmenu && 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  return { inline, mountNode, components: { root: 'div' }, root: rootProps };\n};\n"],"names":["React","ArrowLeft","Tab","ArrowRight","Escape","getIntrinsicElementProps","useEventCallback","useMergedRefs","slot","useMenuContext_unstable","dispatchMenuEnterEvent","useFluent_unstable","useFluent","useIsSubmenu","useRestoreFocusSource","useMenuPopover_unstable","props","ref","popoverRef","context","menuPopoverRef","setOpen","open","openOnHover","triggerRef","isSubmenu","canDispatchCustomEventRef","useRef","throttleDispatchTimerRef","restoreFocusSourceAttributes","dir","CloseArrowKey","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","setTimeout","useEffect","clearTimeout","inline","mountNode","rootProps","always","role","elementType","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","isDefaultPrevented","preventDefault","focus","components","root"],"mappings":"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"}
+{"version":3,"sources":["useMenuPopover.ts"],"sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot, useTimeout } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport { useRestoreFocusSource } from '@fluentui/react-tabster';\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 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  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const restoreFocusSourceAttributes = useRestoreFocusSource();\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(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, setThrottleTimeout],\n  );\n\n  React.useEffect(() => {\n    () => 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      ...restoreFocusSourceAttributes,\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  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  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    const key = event.key;\n    if (key === Escape || (isSubmenu && 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  return { inline, mountNode, components: { root: 'div' }, root: rootProps };\n};\n"],"names":["React","ArrowLeft","Tab","ArrowRight","Escape","getIntrinsicElementProps","useEventCallback","useMergedRefs","slot","useTimeout","useMenuContext_unstable","dispatchMenuEnterEvent","useFluent_unstable","useFluent","useIsSubmenu","useRestoreFocusSource","useMenuPopover_unstable","props","ref","popoverRef","context","menuPopoverRef","setOpen","open","openOnHover","triggerRef","isSubmenu","canDispatchCustomEventRef","useRef","restoreFocusSourceAttributes","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"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-import { shorthands, mergeClasses, __styles } from '@griffel/react';
+import { mergeClasses, __styles } from '@griffel/react';
 import { tokens, typographyStyles } from '@fluentui/react-theme';
 import { createSlideStyles } from '@fluentui/react-positioning';
 export const menuPopoverClassNames = {
@@ -6,10 +6,11 @@ export const menuPopoverClassNames = {
 };
 const useStyles = /*#__PURE__*/__styles({
   root: {
-    Bbmb7ep: ["f1aa9q02", "f16jpd5f"],
-    Beyfa6y: ["f16jpd5f", "f1aa9q02"],
-    B7oj6ja: ["f1jar5jt", "fyu767a"],
-    Btl43ni: ["fyu767a", "f1jar5jt"],
+    Beyfa6y: 0,
+    Bbmb7ep: 0,
+    Btl43ni: 0,
+    B7oj6ja: 0,
+    Dimara: "ft85np5",
     De3pzq: "fxugw4r",
     sj55zd: "f19n0e5",
     B7ck84d: "f1ewtqcl",
@@ -18,22 +19,28 @@ const useStyles = /*#__PURE__*/__styles({
     B68tc82: "f1p9o1ba",
     a9b677: "f1ahpp82",
     E5pizo: "f1hg901r",
-    z8tnut: "f10ra9hq",
-    z189sj: ["f8wuabp", "fycuoez"],
-    Byoj8tv: "f1y2xyjm",
-    uwmqm3: ["fycuoez", "f8wuabp"],
-    B4j52fo: "f5ogflp",
-    Bekrc4i: ["f1hqa2wf", "finvdd3"],
-    Bn0qgzm: "f1f09k3d",
-    ibv6hh: ["finvdd3", "f1hqa2wf"],
-    icvyot: "fzkkow9",
-    vrafjx: ["fcdblym", "fjik90z"],
-    oivjwe: "fg706s2",
-    wvpqe5: ["fjik90z", "fcdblym"],
-    g2u3we: "fghlq4f",
-    h3c5rm: ["f1gn591s", "fjscplz"],
-    B9xav0g: "fb073pr",
-    zhjwy3: ["fjscplz", "f1gn591s"],
+    Byoj8tv: 0,
+    uwmqm3: 0,
+    z189sj: 0,
+    z8tnut: 0,
+    B0ocmuz: "fd3pd8h",
+    Bgfg5da: 0,
+    B9xav0g: 0,
+    oivjwe: 0,
+    Bn0qgzm: 0,
+    B4g9neb: 0,
+    zhjwy3: 0,
+    wvpqe5: 0,
+    ibv6hh: 0,
+    u1mtju: 0,
+    h3c5rm: 0,
+    vrafjx: 0,
+    Bekrc4i: 0,
+    i8vvqc: 0,
+    g2u3we: 0,
+    icvyot: 0,
+    B4j52fo: 0,
+    irswps: "f9ggezi",
     Bahqtrf: "fk6fouc",
     Be2twd7: "fkhj508",
     Bhrd7zp: "figsok6",
@@ -55,7 +62,13 @@ const useStyles = /*#__PURE__*/__styles({
     Bvtglag: "fjp4h9y"
   }
 }, {
-  d: [".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1ewtqcl{box-sizing:border-box;}", ".fl8fusi{min-width:138px;}", ".f1kaai3v{max-width:300px;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1ahpp82{width:max-content;}", ".f1hg901r{box-shadow:var(--shadow16);}", ".f10ra9hq{padding-top:4px;}", ".f8wuabp{padding-right:4px;}", ".fycuoez{padding-left:4px;}", ".f1y2xyjm{padding-bottom:4px;}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f18k4bn6{animation-composition:accumulate;}", ".fo1kyvf{animation-duration:var(--durationSlower);}", ".fetxo7e{animation-timing-function:var(--curveDecelerateMid);}", ".f8x1vz1{--fui-positioning-slide-distance-x:0px;}", ".f8g0anz{--fui-positioning-slide-distance-y:10px;}", ".fezwn9i[data-popper-placement^=right]{--fui-positioning-slide-distance-x:-10px;}", ".fz5efge[data-popper-placement^=right]{--fui-positioning-slide-distance-y:0px;}", ".f1ydixl4[data-popper-placement^=bottom]{--fui-positioning-slide-distance-x:0px;}", ".f8dgqj5[data-popper-placement^=bottom]{--fui-positioning-slide-distance-y:-10px;}", ".fnyfnr8[data-popper-placement^=left]{--fui-positioning-slide-distance-x:10px;}", ".fgw77r4[data-popper-placement^=left]{--fui-positioning-slide-distance-y:0px;}", ".ftje0s4{animation-name:f5j8bii,f79suad;}"],
+  d: [[".ft85np5{border-radius:var(--borderRadiusMedium);}", {
+    p: -1
+  }], ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1ewtqcl{box-sizing:border-box;}", ".fl8fusi{min-width:138px;}", ".f1kaai3v{max-width:300px;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1ahpp82{width:max-content;}", ".f1hg901r{box-shadow:var(--shadow16);}", [".fd3pd8h{padding:4px;}", {
+    p: -1
+  }], [".f9ggezi{border:1px solid var(--colorTransparentStroke);}", {
+    p: -2
+  }], ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f18k4bn6{animation-composition:accumulate;}", ".fo1kyvf{animation-duration:var(--durationSlower);}", ".fetxo7e{animation-timing-function:var(--curveDecelerateMid);}", ".f8x1vz1{--fui-positioning-slide-distance-x:0px;}", ".f8g0anz{--fui-positioning-slide-distance-y:10px;}", ".fezwn9i[data-popper-placement^=right]{--fui-positioning-slide-distance-x:-10px;}", ".fz5efge[data-popper-placement^=right]{--fui-positioning-slide-distance-y:0px;}", ".f1ydixl4[data-popper-placement^=bottom]{--fui-positioning-slide-distance-x:0px;}", ".f8dgqj5[data-popper-placement^=bottom]{--fui-positioning-slide-distance-y:-10px;}", ".fnyfnr8[data-popper-placement^=left]{--fui-positioning-slide-distance-x:10px;}", ".fgw77r4[data-popper-placement^=left]{--fui-positioning-slide-distance-y:0px;}", ".ftje0s4{animation-name:f5j8bii,f79suad;}"],
   k: ["@keyframes f5j8bii{from{opacity:0;}to{opacity:1;}}", "@keyframes f79suad{from{transform:translate(var(--fui-positioning-slide-distance-x), var(--fui-positioning-slide-distance-y));}}"],
   m: [["@media (prefers-reduced-motion){.fi19xcv[data-popper-placement]{animation-duration:1ms;}}", {
     m: "(prefers-reduced-motion)"

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

@@ -1 +1 @@
-{"version":3,"names":["shorthands","mergeClasses","__styles","tokens","typographyStyles","createSlideStyles","menuPopoverClassNames","root","useStyles","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","De3pzq","sj55zd","B7ck84d","Bf4jedk","B2u0y6b","B68tc82","a9b677","E5pizo","z8tnut","z189sj","Byoj8tv","uwmqm3","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","icvyot","vrafjx","oivjwe","wvpqe5","g2u3we","h3c5rm","B9xav0g","zhjwy3","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","B93otf3","vin17d","Ezkn3b","nyiy2g","swvrvq","Bkovbt3","hgjdhn","fsy9dk","B3ogreh","jv49x5","Bk7o48c","Bv12yb3","z0t1cu","Bks05zx","Bvtglag","d","k","m","t","useMenuPopoverStyles_unstable","state","styles","className"],"sources":["useMenuPopoverStyles.styles.js"],"sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { createSlideStyles } from '@fluentui/react-positioning';\nexport const menuPopoverClassNames = {\n    root: 'fui-MenuPopover'\n};\nconst useStyles = makeStyles({\n    root: {\n        ...shorthands.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        ...shorthands.padding('4px'),\n        ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n        ...typographyStyles.body1,\n        ...createSlideStyles(10)\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    state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACrE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,SAASC,iBAAiB,QAAQ,6BAA6B;AAC/D,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGN,QAAA;EAAAK,IAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;AAAA,CAgBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,MAAMC,MAAM,GAAGtD,SAAS,CAAC,CAAC;EAC1BqD,KAAK,CAACtD,IAAI,CAACwD,SAAS,GAAG9D,YAAY,CAACK,qBAAqB,CAACC,IAAI,EAAEuD,MAAM,CAACvD,IAAI,EAAEsD,KAAK,CAACtD,IAAI,CAACwD,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["mergeClasses","__styles","tokens","typographyStyles","createSlideStyles","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","B93otf3","vin17d","Ezkn3b","nyiy2g","swvrvq","Bkovbt3","hgjdhn","fsy9dk","B3ogreh","jv49x5","Bk7o48c","Bv12yb3","z0t1cu","Bks05zx","Bvtglag","d","p","k","m","t","useMenuPopoverStyles_unstable","state","styles","className"],"sources":["useMenuPopoverStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { createSlideStyles } from '@fluentui/react-positioning';\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        ...createSlideStyles(10)\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    state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,SAASC,iBAAiB,QAAQ,6BAA6B;AAC/D,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGN,QAAA;EAAAK,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;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;AAAA,CAgBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,MAAMC,MAAM,GAAG9D,SAAS,CAAC,CAAC;EAC1B6D,KAAK,CAAC9D,IAAI,CAACgE,SAAS,GAAGtE,YAAY,CAACK,qBAAqB,CAACC,IAAI,EAAE+D,MAAM,CAAC/D,IAAI,EAAE8D,KAAK,CAAC9D,IAAI,CAACgE,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.styles.js

@@ -22,31 +22,32 @@ const menuDividerClassNames = {
 };
 const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     root: {
-        B6of3ja: "fvjh0tl",
-        t21cq0: [
-            "f1rnx978",
-            "f1q7jvqi"
-        ],
-        jrapky: "fd1gkq",
-        Frg6f3: [
-            "f1q7jvqi",
-            "f1rnx978"
-        ],
+        jrapky: 0,
+        Frg6f3: 0,
+        t21cq0: 0,
+        B6of3ja: 0,
+        B74szlk: "f8dz51a",
         a9b677: "f14z66ap",
-        Bn0qgzm: "f1vxd6vx",
-        oivjwe: "fg706s2",
-        B9xav0g: "frpde29"
+        B9xav0g: 0,
+        oivjwe: 0,
+        Bn0qgzm: 0,
+        Bgfg5da: "f1facbz3"
     }
 }, {
     d: [
-        ".fvjh0tl{margin-top:4px;}",
-        ".f1rnx978{margin-right:-5px;}",
-        ".f1q7jvqi{margin-left:-5px;}",
-        ".fd1gkq{margin-bottom:4px;}",
+        [
+            ".f8dz51a{margin:4px -5px 4px -5px;}",
+            {
+                p: -1
+            }
+        ],
         ".f14z66ap{width:auto;}",
-        ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}",
-        ".fg706s2{border-bottom-style:solid;}",
-        ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}"
+        [
+            ".f1facbz3{border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke2);}",
+            {
+                p: -1
+            }
+        ]
     ]
 });
 const useMenuDividerStyles_unstable = (state)=>{

package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useMenuDividerStyles.styles.js"],"sourcesContent":["import { shorthands, mergeClasses, __styles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const menuDividerClassNames = {\n  root: 'fui-MenuDivider'\n};\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    B6of3ja: \"fvjh0tl\",\n    t21cq0: [\"f1rnx978\", \"f1q7jvqi\"],\n    jrapky: \"fd1gkq\",\n    Frg6f3: [\"f1q7jvqi\", \"f1rnx978\"],\n    a9b677: \"f14z66ap\",\n    Bn0qgzm: \"f1vxd6vx\",\n    oivjwe: \"fg706s2\",\n    B9xav0g: \"frpde29\"\n  }\n}, {\n  d: [\".fvjh0tl{margin-top:4px;}\", \".f1rnx978{margin-right:-5px;}\", \".f1q7jvqi{margin-left:-5px;}\", \".fd1gkq{margin-bottom:4px;}\", \".f14z66ap{width:auto;}\", \".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}\", \".fg706s2{border-bottom-style:solid;}\", \".frpde29{border-bottom-color:var(--colorNeutralStroke2);}\"]\n});\nexport const useMenuDividerStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuDividerClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useMenuDividerStyles.styles.js.map"],"names":["menuDividerClassNames","useMenuDividerStyles_unstable","root","useStyles","__styles","B6of3ja","t21cq0","jrapky","Frg6f3","a9b677","Bn0qgzm","oivjwe","B9xav0g","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,qBAAqB;eAArBA;;IAiBAC,6BAA6B;eAA7BA;;;uBAnBsC;AAE5C,MAAMD,wBAAwB;IACnCE,MAAM;AACR;AACA,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCF,MAAM;QACJG,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAW;QAChCC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAA6B;QAAiC;QAAgC;QAA+B;QAA0B;QAA0D;QAAwC;KAA4D;AAC3T;AACO,MAAMZ,gCAAgCa,CAAAA;IAC3C,MAAMC,SAASZ;IACfW,MAAMZ,IAAI,CAACc,SAAS,GAAGC,IAAAA,mBAAY,EAACjB,sBAAsBE,IAAI,EAAEa,OAAOb,IAAI,EAAEY,MAAMZ,IAAI,CAACc,SAAS;IACjG,OAAOF;AACT,GACA,uDAAuD"}
+{"version":3,"sources":["useMenuDividerStyles.styles.js"],"sourcesContent":["import { mergeClasses, __styles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const menuDividerClassNames = {\n  root: 'fui-MenuDivider'\n};\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    jrapky: 0,\n    Frg6f3: 0,\n    t21cq0: 0,\n    B6of3ja: 0,\n    B74szlk: \"f8dz51a\",\n    a9b677: \"f14z66ap\",\n    B9xav0g: 0,\n    oivjwe: 0,\n    Bn0qgzm: 0,\n    Bgfg5da: \"f1facbz3\"\n  }\n}, {\n  d: [[\".f8dz51a{margin:4px -5px 4px -5px;}\", {\n    p: -1\n  }], \".f14z66ap{width:auto;}\", [\".f1facbz3{border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke2);}\", {\n    p: -1\n  }]]\n});\nexport const useMenuDividerStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuDividerClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useMenuDividerStyles.styles.js.map"],"names":["menuDividerClassNames","useMenuDividerStyles_unstable","root","useStyles","__styles","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","a9b677","B9xav0g","oivjwe","Bn0qgzm","Bgfg5da","d","p","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,qBAAqB;eAArBA;;IAuBAC,6BAA6B;eAA7BA;;;uBAzB0B;AAEhC,MAAMD,wBAAwB;IACnCE,MAAM;AACR;AACA,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;YAAC;YAAuC;gBAC1CC,GAAG,CAAC;YACN;SAAE;QAAE;QAA0B;YAAC;YAAqF;gBAClHA,GAAG,CAAC;YACN;SAAE;KAAC;AACL;AACO,MAAMf,gCAAgCgB,CAAAA;IAC3C,MAAMC,SAASf;IACfc,MAAMf,IAAI,CAACiB,SAAS,GAAGC,IAAAA,mBAAY,EAACpB,sBAAsBE,IAAI,EAAEgB,OAAOhB,IAAI,EAAEe,MAAMf,IAAI,CAACiB,SAAS;IACjG,OAAOF;AACT,GACA,uDAAuD"}

package/lib-commonjs/components/MenuItem/useMenuItemStyles.styles.js

@@ -26,34 +26,34 @@ const menuItemClassNames = {
     content: 'fui-MenuItem__content',
     secondaryContent: 'fui-MenuItem__secondaryContent'
 };
-const useRootBaseStyles = /*#__PURE__*/ (0, _react.__resetStyles)("rszfvis", "ruxd6yz", {
+const useRootBaseStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r11normc", "r1lnj0i0", {
     r: [
-        ".rszfvis{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-right:var(--spacingVerticalSNudge);padding-left:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}",
-        ".rszfvis:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}",
-        ".rszfvis:hover .fui-Icon-filled{display:inline;}",
-        ".rszfvis:hover .fui-Icon-regular{display:none;}",
-        ".rszfvis:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}",
-        ".rszfvis:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}",
-        ".rszfvis:focus{outline-style:none;}",
-        ".rszfvis:focus-visible{outline-style:none;}",
-        ".rszfvis[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
-        ".rszfvis[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
-        ".ruxd6yz{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-left:var(--spacingVerticalSNudge);padding-right:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}",
-        ".ruxd6yz:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}",
-        ".ruxd6yz:hover .fui-Icon-filled{display:inline;}",
-        ".ruxd6yz:hover .fui-Icon-regular{display:none;}",
-        ".ruxd6yz:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}",
-        ".ruxd6yz:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}",
-        ".ruxd6yz:focus{outline-style:none;}",
-        ".ruxd6yz:focus-visible{outline-style:none;}",
-        ".ruxd6yz[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
-        ".ruxd6yz[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
+        ".r11normc{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-right:var(--spacingVerticalSNudge);padding-left:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}",
+        ".r11normc:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}",
+        ".r11normc:hover .fui-Icon-filled{display:inline;}",
+        ".r11normc:hover .fui-Icon-regular{display:none;}",
+        ".r11normc:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}",
+        ".r11normc:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}",
+        ".r11normc:focus{outline-style:none;}",
+        ".r11normc:focus-visible{outline-style:none;}",
+        ".r11normc[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
+        ".r11normc[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
+        ".r1lnj0i0{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-left:var(--spacingVerticalSNudge);padding-right:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}",
+        ".r1lnj0i0:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}",
+        ".r1lnj0i0:hover .fui-Icon-filled{display:inline;}",
+        ".r1lnj0i0:hover .fui-Icon-regular{display:none;}",
+        ".r1lnj0i0:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}",
+        ".r1lnj0i0:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}",
+        ".r1lnj0i0:focus{outline-style:none;}",
+        ".r1lnj0i0:focus-visible{outline-style:none;}",
+        ".r1lnj0i0[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
+        ".r1lnj0i0[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
     ],
     s: [
-        "@media (forced-colors: active){.rszfvis:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.rszfvis:focus{outline-style:none;}.rszfvis:focus-visible{outline-style:none;}.rszfvis[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}@media (forced-colors: active){.rszfvis[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}.rszfvis[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}}",
-        "@media (forced-colors: active){.rszfvis[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
-        "@media (forced-colors: active){.ruxd6yz:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.ruxd6yz:focus{outline-style:none;}.ruxd6yz:focus-visible{outline-style:none;}.ruxd6yz[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}@media (forced-colors: active){.ruxd6yz[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}.ruxd6yz[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}}",
-        "@media (forced-colors: active){.ruxd6yz[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"
+        "@media (forced-colors: active){.r11normc:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.r11normc:focus{outline-style:none;}.r11normc:focus-visible{outline-style:none;}.r11normc[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}@media (forced-colors: active){.r11normc[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}.r11normc[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid Highlight;border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}}",
+        "@media (forced-colors: active){.r11normc[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
+        "@media (forced-colors: active){.r1lnj0i0:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.r1lnj0i0:focus{outline-style:none;}.r1lnj0i0:focus-visible{outline-style:none;}.r1lnj0i0[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}@media (forced-colors: active){.r1lnj0i0[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}.r1lnj0i0[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid Highlight;border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}}",
+        "@media (forced-colors: active){.r1lnj0i0[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"
     ]
 });
 const useContentBaseStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r1ls86vo", "rpbc5dr", [

package/lib-commonjs/components/MenuItem/useMenuItemStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useMenuItemStyles.styles.js"],"sourcesContent":["import { mergeClasses, __styles, __resetStyles } from '@griffel/react';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nexport const menuItemClassNames = {\n  root: 'fui-MenuItem',\n  icon: 'fui-MenuItem__icon',\n  checkmark: 'fui-MenuItem__checkmark',\n  submenuIndicator: 'fui-MenuItem__submenuIndicator',\n  content: 'fui-MenuItem__content',\n  secondaryContent: 'fui-MenuItem__secondaryContent'\n};\nconst useRootBaseStyles = /*#__PURE__*/__resetStyles(\"rszfvis\", \"ruxd6yz\", {\n  r: [\".rszfvis{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-right:var(--spacingVerticalSNudge);padding-left:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}\", \".rszfvis:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}\", \".rszfvis:hover .fui-Icon-filled{display:inline;}\", \".rszfvis:hover .fui-Icon-regular{display:none;}\", \".rszfvis:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}\", \".rszfvis:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}\", \".rszfvis:focus{outline-style:none;}\", \".rszfvis:focus-visible{outline-style:none;}\", \".rszfvis[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".rszfvis[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".ruxd6yz{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-left:var(--spacingVerticalSNudge);padding-right:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}\", \".ruxd6yz:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}\", \".ruxd6yz:hover .fui-Icon-filled{display:inline;}\", \".ruxd6yz:hover .fui-Icon-regular{display:none;}\", \".ruxd6yz:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}\", \".ruxd6yz:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}\", \".ruxd6yz:focus{outline-style:none;}\", \".ruxd6yz:focus-visible{outline-style:none;}\", \".ruxd6yz[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".ruxd6yz[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n  s: [\"@media (forced-colors: active){.rszfvis:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.rszfvis:focus{outline-style:none;}.rszfvis:focus-visible{outline-style:none;}.rszfvis[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}@media (forced-colors: active){.rszfvis[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}.rszfvis[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}}\", \"@media (forced-colors: active){.rszfvis[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media (forced-colors: active){.ruxd6yz:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.ruxd6yz:focus{outline-style:none;}.ruxd6yz:focus-visible{outline-style:none;}.ruxd6yz[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}@media (forced-colors: active){.ruxd6yz[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}.ruxd6yz[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}}\", \"@media (forced-colors: active){.ruxd6yz[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\"]\n});\nconst useContentBaseStyles = /*#__PURE__*/__resetStyles(\"r1ls86vo\", \"rpbc5dr\", [\".r1ls86vo{padding-left:2px;padding-right:2px;background-color:transparent;flex-grow:1;}\", \".rpbc5dr{padding-right:2px;padding-left:2px;background-color:transparent;flex-grow:1;}\"]);\nconst useSecondaryContentBaseStyles = /*#__PURE__*/__resetStyles(\"r12mwwux\", \"r1ewgu5j\", [\".r12mwwux{padding-left:2px;padding-right:2px;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);}\", \".r12mwwux:hover{color:var(--colorNeutralForeground3Hover);}\", \".r12mwwux:focus{color:var(--colorNeutralForeground3Hover);}\", \".r1ewgu5j{padding-right:2px;padding-left:2px;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);}\", \".r1ewgu5j:hover{color:var(--colorNeutralForeground3Hover);}\", \".r1ewgu5j:focus{color:var(--colorNeutralForeground3Hover);}\"]);\nconst useIconBaseStyles = /*#__PURE__*/__resetStyles(\"r9c34qo\", null, [\".r9c34qo{width:20px;height:20px;font-size:20px;line-height:0;align-items:center;display:inline-flex;justify-content:center;}\"]);\nconst useSubmenuIndicatorBaseStyles = /*#__PURE__*/__resetStyles(\"r9c34qo\", null, [\".r9c34qo{width:20px;height:20px;font-size:20px;line-height:0;align-items:center;display:inline-flex;justify-content:center;}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n  checkmark: {\n    B6of3ja: \"fmnzpld\"\n  },\n  splitItemMain: {\n    Bh6795r: \"fqerorx\"\n  },\n  splitItemTrigger: {\n    Btl43ni: [\"f1ozlkrg\", \"f10ostut\"],\n    Beyfa6y: [\"f1deotkl\", \"f1krrbdw\"],\n    uwmqm3: [\"f1cnd47f\", \"fhxju0i\"],\n    Ftih45: \"f1wl9k8s\",\n    Ccq8qp: \"f1yn80uh\",\n    Baz25je: \"f68mna0\",\n    cmx5o7: \"f1p5zmk\"\n  },\n  disabled: {\n    sj55zd: \"f1s2aq7o\",\n    Bi91k9c: \"fvgxktp\",\n    Jwef8y: \"f1ijtazh\",\n    eoavqd: \"fphbwmw\",\n    Bk3fhr4: \"f19vpps7\",\n    Bmfj8id: \"fv5swzo\",\n    Bg7n49j: \"f1q1x1ba\",\n    B2d53fq: \"fcvwxyo\",\n    iro3zm: \"f1to34ca\",\n    t0hwav: \"ft33916\",\n    Bbusuzp: \"f1dcs8yz\",\n    ze5xyy: \"f1kc2mi9\",\n    Bqrx1nm: \"fkavljg\",\n    Bctn1xl: \"fk56vqo\",\n    h5esng: \"ff3wi9b\",\n    Bh6z0a4: \"f1ikwg0d\",\n    Bh953qp: \"f10l1t5h\"\n  }\n}, {\n  d: [\".fmnzpld{margin-top:2px;}\", \".fqerorx{flex-grow:1;}\", \".f1ozlkrg{border-top-left-radius:0;}\", \".f10ostut{border-top-right-radius:0;}\", \".f1deotkl{border-bottom-left-radius:0;}\", \".f1krrbdw{border-bottom-right-radius:0;}\", \".f1cnd47f{padding-left:0;}\", \".fhxju0i{padding-right:0;}\", \".f1wl9k8s::before{content:\\\"\\\";}\", \".f1yn80uh::before{width:var(--strokeWidthThin);}\", \".f68mna0::before{height:24px;}\", \".f1p5zmk::before{background-color:var(--colorNeutralStroke1);}\", \".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}\"],\n  h: [\".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}\", \".f1ijtazh:hover{background-color:var(--colorNeutralBackground1);}\", \".fphbwmw:hover{cursor:not-allowed;}\", \".f19vpps7:hover .fui-Icon-filled{display:none;}\", \".fv5swzo:hover .fui-Icon-regular{display:inline;}\", \".f1q1x1ba:hover .fui-MenuItem__icon{color:var(--colorNeutralForegroundDisabled);}\", \".fcvwxyo:hover:active{color:var(--colorNeutralForegroundDisabled);}\", \".f1to34ca:hover:active{background-color:var(--colorNeutralBackground1);}\"],\n  f: [\".ft33916:focus{color:var(--colorNeutralForegroundDisabled);}\"],\n  m: [[\"@media (forced-colors: active){.f1dcs8yz{color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1kc2mi9:hover{color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fkavljg:hover{background-color:Canvas;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fk56vqo:hover .fui-MenuItem__icon{color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.ff3wi9b:hover .fui-MenuItem__icon{background-color:Canvas;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1ikwg0d:focus{color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f10l1t5h:focus{background-color:Canvas;}}\", {\n    m: \"(forced-colors: active)\"\n  }]]\n});\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = state => {\n  const styles = useStyles();\n  const rootBaseStyles = useRootBaseStyles();\n  const contentBaseStyles = useContentBaseStyles();\n  const secondaryContentBaseStyles = useSecondaryContentBaseStyles();\n  const iconBaseStyles = useIconBaseStyles();\n  const submenuIndicatorBaseStyles = useSubmenuIndicatorBaseStyles();\n  state.root.className = mergeClasses(menuItemClassNames.root, rootBaseStyles, state.disabled && styles.disabled, state.root.className);\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemClassNames.content, contentBaseStyles, state.content.className);\n  }\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, styles.checkmark, state.checkmark.className);\n  }\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(menuItemClassNames.secondaryContent, !state.disabled && secondaryContentBaseStyles, state.secondaryContent.className);\n  }\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemClassNames.icon, iconBaseStyles, state.icon.className);\n  }\n  if (state.submenuIndicator) {\n    state.submenuIndicator.className = mergeClasses(menuItemClassNames.submenuIndicator, submenuIndicatorBaseStyles, state.submenuIndicator.className);\n  }\n  useCheckmarkStyles_unstable(state);\n  return state;\n};\n//# sourceMappingURL=useMenuItemStyles.styles.js.map"],"names":["menuItemClassNames","useMenuItemStyles_unstable","root","icon","checkmark","submenuIndicator","content","secondaryContent","useRootBaseStyles","__resetStyles","r","s","useContentBaseStyles","useSecondaryContentBaseStyles","useIconBaseStyles","useSubmenuIndicatorBaseStyles","useStyles","__styles","B6of3ja","splitItemMain","Bh6795r","splitItemTrigger","Btl43ni","Beyfa6y","uwmqm3","Ftih45","Ccq8qp","Baz25je","cmx5o7","disabled","sj55zd","Bi91k9c","Jwef8y","eoavqd","Bk3fhr4","Bmfj8id","Bg7n49j","B2d53fq","iro3zm","t0hwav","Bbusuzp","ze5xyy","Bqrx1nm","Bctn1xl","h5esng","Bh6z0a4","Bh953qp","d","h","f","m","state","styles","rootBaseStyles","contentBaseStyles","secondaryContentBaseStyles","iconBaseStyles","submenuIndicatorBaseStyles","className","mergeClasses","useCheckmarkStyles_unstable"],"mappings":";;;;;;;;;;;IAKaA,kBAAkB;eAAlBA;;IAwEAC,0BAA0B;eAA1BA;;;uBA7EyC;uBAIV;AACrC,MAAMD,qBAAqB;IAChCE,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,kBAAkB;IAClBC,SAAS;IACTC,kBAAkB;AACpB;AACA,MAAMC,oBAAoB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,WAAW,WAAW;IACzEC,GAAG;QAAC;QAAkiB;QAAmH;QAAoD;QAAmD;QAA0F;QAA8H;QAAuC;QAA+C;QAAgK;QAAkvB;QAAkiB;QAAmH;QAAoD;QAAmD;QAA0F;QAA8H;QAAuC;QAA+C;QAAgK;KAAivB;IAC33HC,GAAG;QAAC;QAA0sC;QAA+L;QAA0sC;KAA8L;AACvxF;AACA,MAAMC,uBAAuB,WAAW,GAAEH,IAAAA,oBAAa,EAAC,YAAY,WAAW;IAAC;IAA2F;CAAyF;AACpQ,MAAMI,gCAAgC,WAAW,GAAEJ,IAAAA,oBAAa,EAAC,YAAY,YAAY;IAAC;IAAoO;IAA+D;IAA+D;IAAoO;IAA+D;CAA8D;AAC7xB,MAAMK,oBAAoB,WAAW,GAAEL,IAAAA,oBAAa,EAAC,WAAW,MAAM;IAAC;CAA+H;AACtM,MAAMM,gCAAgC,WAAW,GAAEN,IAAAA,oBAAa,EAAC,WAAW,MAAM;IAAC;CAA+H;AAClN,MAAMO,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCb,WAAW;QACTc,SAAS;IACX;IACAC,eAAe;QACbC,SAAS;IACX;IACAC,kBAAkB;QAChBC,SAAS;YAAC;YAAY;SAAW;QACjCC,SAAS;YAAC;YAAY;SAAW;QACjCC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,QAAQ;IACV;IACAC,UAAU;QACRC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAA6B;QAA0B;QAAwC;QAAyC;QAA2C;QAA4C;QAA8B;QAA8B;QAAoC;QAAoD;QAAkC;QAAkE;KAA0D;IACrhBC,GAAG;QAAC;QAAgE;QAAqE;QAAuC;QAAmD;QAAqD;QAAqF;QAAuE;KAA2E;IAC/fC,GAAG;QAAC;KAA+D;IACnEC,GAAG;QAAC;YAAC;YAA8D;gBACjEA,GAAG;YACL;SAAE;QAAE;YAAC;YAAoE;gBACvEA,GAAG;YACL;SAAE;QAAE;YAAC;YAA4E;gBAC/EA,GAAG;YACL;SAAE;QAAE;YAAC;YAAuF;gBAC1FA,GAAG;YACL;SAAE;QAAE;YAAC;YAAgG;gBACnGA,GAAG;YACL;SAAE;QAAE;YAAC;YAAoE;gBACvEA,GAAG;YACL;SAAE;QAAE;YAAC;YAA6E;gBAChFA,GAAG;YACL;SAAE;KAAC;AACL;AAEO,MAAMjD,6BAA6BkD,CAAAA;IACxC,MAAMC,SAASpC;IACf,MAAMqC,iBAAiB7C;IACvB,MAAM8C,oBAAoB1C;IAC1B,MAAM2C,6BAA6B1C;IACnC,MAAM2C,iBAAiB1C;IACvB,MAAM2C,6BAA6B1C;IACnCoC,MAAMjD,IAAI,CAACwD,SAAS,GAAGC,IAAAA,mBAAY,EAAC3D,mBAAmBE,IAAI,EAAEmD,gBAAgBF,MAAMtB,QAAQ,IAAIuB,OAAOvB,QAAQ,EAAEsB,MAAMjD,IAAI,CAACwD,SAAS;IACpI,IAAIP,MAAM7C,OAAO,EAAE;QACjB6C,MAAM7C,OAAO,CAACoD,SAAS,GAAGC,IAAAA,mBAAY,EAAC3D,mBAAmBM,OAAO,EAAEgD,mBAAmBH,MAAM7C,OAAO,CAACoD,SAAS;IAC/G;IACA,IAAIP,MAAM/C,SAAS,EAAE;QACnB+C,MAAM/C,SAAS,CAACsD,SAAS,GAAGC,IAAAA,mBAAY,EAAC3D,mBAAmBI,SAAS,EAAEgD,OAAOhD,SAAS,EAAE+C,MAAM/C,SAAS,CAACsD,SAAS;IACpH;IACA,IAAIP,MAAM5C,gBAAgB,EAAE;QAC1B4C,MAAM5C,gBAAgB,CAACmD,SAAS,GAAGC,IAAAA,mBAAY,EAAC3D,mBAAmBO,gBAAgB,EAAE,CAAC4C,MAAMtB,QAAQ,IAAI0B,4BAA4BJ,MAAM5C,gBAAgB,CAACmD,SAAS;IACtK;IACA,IAAIP,MAAMhD,IAAI,EAAE;QACdgD,MAAMhD,IAAI,CAACuD,SAAS,GAAGC,IAAAA,mBAAY,EAAC3D,mBAAmBG,IAAI,EAAEqD,gBAAgBL,MAAMhD,IAAI,CAACuD,SAAS;IACnG;IACA,IAAIP,MAAM9C,gBAAgB,EAAE;QAC1B8C,MAAM9C,gBAAgB,CAACqD,SAAS,GAAGC,IAAAA,mBAAY,EAAC3D,mBAAmBK,gBAAgB,EAAEoD,4BAA4BN,MAAM9C,gBAAgB,CAACqD,SAAS;IACnJ;IACAE,IAAAA,kCAA2B,EAACT;IAC5B,OAAOA;AACT,GACA,oDAAoD"}
+{"version":3,"sources":["useMenuItemStyles.styles.js"],"sourcesContent":["import { mergeClasses, __styles, __resetStyles } from '@griffel/react';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nexport const menuItemClassNames = {\n  root: 'fui-MenuItem',\n  icon: 'fui-MenuItem__icon',\n  checkmark: 'fui-MenuItem__checkmark',\n  submenuIndicator: 'fui-MenuItem__submenuIndicator',\n  content: 'fui-MenuItem__content',\n  secondaryContent: 'fui-MenuItem__secondaryContent'\n};\nconst useRootBaseStyles = /*#__PURE__*/__resetStyles(\"r11normc\", \"r1lnj0i0\", {\n  r: [\".r11normc{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-right:var(--spacingVerticalSNudge);padding-left:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}\", \".r11normc:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}\", \".r11normc:hover .fui-Icon-filled{display:inline;}\", \".r11normc:hover .fui-Icon-regular{display:none;}\", \".r11normc:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}\", \".r11normc:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}\", \".r11normc:focus{outline-style:none;}\", \".r11normc:focus-visible{outline-style:none;}\", \".r11normc[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".r11normc[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".r1lnj0i0{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-left:var(--spacingVerticalSNudge);padding-right:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}\", \".r1lnj0i0:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}\", \".r1lnj0i0:hover .fui-Icon-filled{display:inline;}\", \".r1lnj0i0:hover .fui-Icon-regular{display:none;}\", \".r1lnj0i0:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}\", \".r1lnj0i0:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}\", \".r1lnj0i0:focus{outline-style:none;}\", \".r1lnj0i0:focus-visible{outline-style:none;}\", \".r1lnj0i0[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".r1lnj0i0[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n  s: [\"@media (forced-colors: active){.r11normc:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.r11normc:focus{outline-style:none;}.r11normc:focus-visible{outline-style:none;}.r11normc[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}@media (forced-colors: active){.r11normc[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}.r11normc[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid Highlight;border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}}\", \"@media (forced-colors: active){.r11normc[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media (forced-colors: active){.r1lnj0i0:hover{background-color:Canvas;border-color:Highlight;color:Highlight;}.r1lnj0i0:focus{outline-style:none;}.r1lnj0i0:focus-visible{outline-style:none;}.r1lnj0i0[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}@media (forced-colors: active){.r1lnj0i0[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}.r1lnj0i0[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid Highlight;border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}}\", \"@media (forced-colors: active){.r1lnj0i0[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\"]\n});\nconst useContentBaseStyles = /*#__PURE__*/__resetStyles(\"r1ls86vo\", \"rpbc5dr\", [\".r1ls86vo{padding-left:2px;padding-right:2px;background-color:transparent;flex-grow:1;}\", \".rpbc5dr{padding-right:2px;padding-left:2px;background-color:transparent;flex-grow:1;}\"]);\nconst useSecondaryContentBaseStyles = /*#__PURE__*/__resetStyles(\"r12mwwux\", \"r1ewgu5j\", [\".r12mwwux{padding-left:2px;padding-right:2px;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);}\", \".r12mwwux:hover{color:var(--colorNeutralForeground3Hover);}\", \".r12mwwux:focus{color:var(--colorNeutralForeground3Hover);}\", \".r1ewgu5j{padding-right:2px;padding-left:2px;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);}\", \".r1ewgu5j:hover{color:var(--colorNeutralForeground3Hover);}\", \".r1ewgu5j:focus{color:var(--colorNeutralForeground3Hover);}\"]);\nconst useIconBaseStyles = /*#__PURE__*/__resetStyles(\"r9c34qo\", null, [\".r9c34qo{width:20px;height:20px;font-size:20px;line-height:0;align-items:center;display:inline-flex;justify-content:center;}\"]);\nconst useSubmenuIndicatorBaseStyles = /*#__PURE__*/__resetStyles(\"r9c34qo\", null, [\".r9c34qo{width:20px;height:20px;font-size:20px;line-height:0;align-items:center;display:inline-flex;justify-content:center;}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n  checkmark: {\n    B6of3ja: \"fmnzpld\"\n  },\n  splitItemMain: {\n    Bh6795r: \"fqerorx\"\n  },\n  splitItemTrigger: {\n    Btl43ni: [\"f1ozlkrg\", \"f10ostut\"],\n    Beyfa6y: [\"f1deotkl\", \"f1krrbdw\"],\n    uwmqm3: [\"f1cnd47f\", \"fhxju0i\"],\n    Ftih45: \"f1wl9k8s\",\n    Ccq8qp: \"f1yn80uh\",\n    Baz25je: \"f68mna0\",\n    cmx5o7: \"f1p5zmk\"\n  },\n  disabled: {\n    sj55zd: \"f1s2aq7o\",\n    Bi91k9c: \"fvgxktp\",\n    Jwef8y: \"f1ijtazh\",\n    eoavqd: \"fphbwmw\",\n    Bk3fhr4: \"f19vpps7\",\n    Bmfj8id: \"fv5swzo\",\n    Bg7n49j: \"f1q1x1ba\",\n    B2d53fq: \"fcvwxyo\",\n    iro3zm: \"f1to34ca\",\n    t0hwav: \"ft33916\",\n    Bbusuzp: \"f1dcs8yz\",\n    ze5xyy: \"f1kc2mi9\",\n    Bqrx1nm: \"fkavljg\",\n    Bctn1xl: \"fk56vqo\",\n    h5esng: \"ff3wi9b\",\n    Bh6z0a4: \"f1ikwg0d\",\n    Bh953qp: \"f10l1t5h\"\n  }\n}, {\n  d: [\".fmnzpld{margin-top:2px;}\", \".fqerorx{flex-grow:1;}\", \".f1ozlkrg{border-top-left-radius:0;}\", \".f10ostut{border-top-right-radius:0;}\", \".f1deotkl{border-bottom-left-radius:0;}\", \".f1krrbdw{border-bottom-right-radius:0;}\", \".f1cnd47f{padding-left:0;}\", \".fhxju0i{padding-right:0;}\", \".f1wl9k8s::before{content:\\\"\\\";}\", \".f1yn80uh::before{width:var(--strokeWidthThin);}\", \".f68mna0::before{height:24px;}\", \".f1p5zmk::before{background-color:var(--colorNeutralStroke1);}\", \".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}\"],\n  h: [\".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}\", \".f1ijtazh:hover{background-color:var(--colorNeutralBackground1);}\", \".fphbwmw:hover{cursor:not-allowed;}\", \".f19vpps7:hover .fui-Icon-filled{display:none;}\", \".fv5swzo:hover .fui-Icon-regular{display:inline;}\", \".f1q1x1ba:hover .fui-MenuItem__icon{color:var(--colorNeutralForegroundDisabled);}\", \".fcvwxyo:hover:active{color:var(--colorNeutralForegroundDisabled);}\", \".f1to34ca:hover:active{background-color:var(--colorNeutralBackground1);}\"],\n  f: [\".ft33916:focus{color:var(--colorNeutralForegroundDisabled);}\"],\n  m: [[\"@media (forced-colors: active){.f1dcs8yz{color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1kc2mi9:hover{color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fkavljg:hover{background-color:Canvas;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fk56vqo:hover .fui-MenuItem__icon{color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.ff3wi9b:hover .fui-MenuItem__icon{background-color:Canvas;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1ikwg0d:focus{color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f10l1t5h:focus{background-color:Canvas;}}\", {\n    m: \"(forced-colors: active)\"\n  }]]\n});\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = state => {\n  const styles = useStyles();\n  const rootBaseStyles = useRootBaseStyles();\n  const contentBaseStyles = useContentBaseStyles();\n  const secondaryContentBaseStyles = useSecondaryContentBaseStyles();\n  const iconBaseStyles = useIconBaseStyles();\n  const submenuIndicatorBaseStyles = useSubmenuIndicatorBaseStyles();\n  state.root.className = mergeClasses(menuItemClassNames.root, rootBaseStyles, state.disabled && styles.disabled, state.root.className);\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemClassNames.content, contentBaseStyles, state.content.className);\n  }\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, styles.checkmark, state.checkmark.className);\n  }\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(menuItemClassNames.secondaryContent, !state.disabled && secondaryContentBaseStyles, state.secondaryContent.className);\n  }\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemClassNames.icon, iconBaseStyles, state.icon.className);\n  }\n  if (state.submenuIndicator) {\n    state.submenuIndicator.className = mergeClasses(menuItemClassNames.submenuIndicator, submenuIndicatorBaseStyles, state.submenuIndicator.className);\n  }\n  useCheckmarkStyles_unstable(state);\n  return state;\n};\n//# sourceMappingURL=useMenuItemStyles.styles.js.map"],"names":["menuItemClassNames","useMenuItemStyles_unstable","root","icon","checkmark","submenuIndicator","content","secondaryContent","useRootBaseStyles","__resetStyles","r","s","useContentBaseStyles","useSecondaryContentBaseStyles","useIconBaseStyles","useSubmenuIndicatorBaseStyles","useStyles","__styles","B6of3ja","splitItemMain","Bh6795r","splitItemTrigger","Btl43ni","Beyfa6y","uwmqm3","Ftih45","Ccq8qp","Baz25je","cmx5o7","disabled","sj55zd","Bi91k9c","Jwef8y","eoavqd","Bk3fhr4","Bmfj8id","Bg7n49j","B2d53fq","iro3zm","t0hwav","Bbusuzp","ze5xyy","Bqrx1nm","Bctn1xl","h5esng","Bh6z0a4","Bh953qp","d","h","f","m","state","styles","rootBaseStyles","contentBaseStyles","secondaryContentBaseStyles","iconBaseStyles","submenuIndicatorBaseStyles","className","mergeClasses","useCheckmarkStyles_unstable"],"mappings":"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"}

package/lib-commonjs/components/MenuList/useMenuListStyles.styles.js

@@ -24,8 +24,9 @@ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     root: {
         mc9l5x: "f22iagw",
         Beiy3e4: "f1vx9l62",
-        i8kkvl: "f16mnhsx",
-        Belr9w4: "fbi42co"
+        i8kkvl: 0,
+        Belr9w4: 0,
+        rmohyg: "f1t6b6ee"
     },
     hasMenuContext: {
         Bqenvij: "f1l02sjl"
@@ -34,8 +35,12 @@ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     d: [
         ".f22iagw{display:flex;}",
         ".f1vx9l62{flex-direction:column;}",
-        ".f16mnhsx{column-gap:2px;}",
-        ".fbi42co{row-gap:2px;}",
+        [
+            ".f1t6b6ee{gap:2px;}",
+            {
+                p: -1
+            }
+        ],
         ".f1l02sjl{height:100%;}"
     ]
 });