@fluentui/react-menu 9.17.6 → 9.19.0

package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.styles.raw.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    menuItemRadioClassNames: function() {
+        return menuItemRadioClassNames;
+    },
+    useMenuItemRadioStyles_unstable: function() {
+        return useMenuItemRadioStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _index = require("../../selectable/index");
+const _useMenuItemStylesstyles = require("../MenuItem/useMenuItemStyles.styles");
+const menuItemRadioClassNames = {
+    root: 'fui-MenuItemRadio',
+    icon: 'fui-MenuItemRadio__icon',
+    checkmark: 'fui-MenuItemRadio__checkmark',
+    content: 'fui-MenuItemRadio__content',
+    secondaryContent: 'fui-MenuItemRadio__secondaryContent',
+    subText: 'fui-MenuItemRadio__subText'
+};
+const useMenuItemRadioStyles_unstable = (state)=>{
+    'use no memo';
+    state.root.className = (0, _react.mergeClasses)(menuItemRadioClassNames.root, state.root.className);
+    if (state.content) {
+        state.content.className = (0, _react.mergeClasses)(menuItemRadioClassNames.content, state.content.className);
+    }
+    if (state.secondaryContent) {
+        state.secondaryContent.className = (0, _react.mergeClasses)(menuItemRadioClassNames.secondaryContent, state.secondaryContent.className);
+    }
+    if (state.icon) {
+        state.icon.className = (0, _react.mergeClasses)(menuItemRadioClassNames.icon, state.icon.className);
+    }
+    if (state.checkmark) {
+        state.checkmark.className = (0, _react.mergeClasses)(menuItemRadioClassNames.checkmark, state.checkmark.className);
+    }
+    if (state.subText) {
+        state.subText.className = (0, _react.mergeClasses)(menuItemRadioClassNames.subText, state.subText.className);
+    }
+    (0, _useMenuItemStylesstyles.useMenuItemStyles_unstable)(state);
+    (0, _index.useCheckmarkStyles_unstable)(state);
+};

package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MenuItemRadio/useMenuItemRadioStyles.styles.ts"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../index';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\n\nexport const menuItemRadioClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n  root: 'fui-MenuItemRadio',\n  icon: 'fui-MenuItemRadio__icon',\n  checkmark: 'fui-MenuItemRadio__checkmark',\n  content: 'fui-MenuItemRadio__content',\n  secondaryContent: 'fui-MenuItemRadio__secondaryContent',\n  subText: 'fui-MenuItemRadio__subText',\n};\n\nexport const useMenuItemRadioStyles_unstable = (state: MenuItemRadioState) => {\n  'use no memo';\n\n  state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);\n\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);\n  }\n\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(\n      menuItemRadioClassNames.secondaryContent,\n      state.secondaryContent.className,\n    );\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);\n  }\n\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);\n  }\n\n  if (state.subText) {\n    state.subText.className = mergeClasses(menuItemRadioClassNames.subText, state.subText.className);\n  }\n\n  useMenuItemStyles_unstable(state);\n  useCheckmarkStyles_unstable(state);\n};\n"],"names":["menuItemRadioClassNames","useMenuItemRadioStyles_unstable","root","icon","checkmark","content","secondaryContent","subText","state","className","mergeClasses","useMenuItemStyles_unstable","useCheckmarkStyles_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAOaA,uBAAAA;eAAAA;;IASAC,+BAAAA;eAAAA;;;uBAhBgB;uBACe;yCACD;AAKpC,MAAMD,0BAAmF;IAC9FE,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;IAClBC,SAAS;AACX;AAEO,MAAMN,kCAAkC,CAACO;IAC9C;IAEAA,MAAMN,IAAI,CAACO,SAAS,GAAGC,IAAAA,mBAAAA,EAAaV,wBAAwBE,IAAI,EAAEM,MAAMN,IAAI,CAACO,SAAS;IAEtF,IAAID,MAAMH,OAAO,EAAE;QACjBG,MAAMH,OAAO,CAACI,SAAS,GAAGC,IAAAA,mBAAAA,EAAaV,wBAAwBK,OAAO,EAAEG,MAAMH,OAAO,CAACI,SAAS;IACjG;IAEA,IAAID,MAAMF,gBAAgB,EAAE;QAC1BE,MAAMF,gBAAgB,CAACG,SAAS,GAAGC,IAAAA,mBAAAA,EACjCV,wBAAwBM,gBAAgB,EACxCE,MAAMF,gBAAgB,CAACG,SAAS;IAEpC;IAEA,IAAID,MAAML,IAAI,EAAE;QACdK,MAAML,IAAI,CAACM,SAAS,GAAGC,IAAAA,mBAAAA,EAAaV,wBAAwBG,IAAI,EAAEK,MAAML,IAAI,CAACM,SAAS;IACxF;IAEA,IAAID,MAAMJ,SAAS,EAAE;QACnBI,MAAMJ,SAAS,CAACK,SAAS,GAAGC,IAAAA,mBAAAA,EAAaV,wBAAwBI,SAAS,EAAEI,MAAMJ,SAAS,CAACK,SAAS;IACvG;IAEA,IAAID,MAAMD,OAAO,EAAE;QACjBC,MAAMD,OAAO,CAACE,SAAS,GAAGC,IAAAA,mBAAAA,EAAaV,wBAAwBO,OAAO,EAAEC,MAAMD,OAAO,CAACE,SAAS;IACjG;IAEAE,IAAAA,mDAAAA,EAA2BH;IAC3BI,IAAAA,kCAAAA,EAA4BJ;AAC9B"}

package/lib-commonjs/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.raw.js

@@ -0,0 +1,136 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    circleFilledClassName: function() {
+        return circleFilledClassName;
+    },
+    menuItemSwitchClassNames: function() {
+        return menuItemSwitchClassNames;
+    },
+    useMenuItemSwitchStyles_unstable: function() {
+        return useMenuItemSwitchStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const _useMenuItemStylesstyles = require("../MenuItem/useMenuItemStyles.styles");
+const menuItemSwitchClassNames = {
+    root: 'fui-MenuItemSwitch',
+    icon: 'fui-MenuItemSwitch__icon',
+    content: 'fui-MenuItemSwitch__content',
+    secondaryContent: 'fui-MenuItemSwitch__secondaryContent',
+    switchIndicator: 'fui-MenuItemSwitch__switchIndicator',
+    subText: 'fui-MenuItemSwitch__subText'
+};
+const circleFilledClassName = 'fui-MenuItemSwitch__switchIndicator__circleFilled';
+// Thumb and track sizes used by the component.
+const spaceBetweenThumbAndTrack = 2;
+const trackHeight = 20;
+const trackWidth = 40;
+const thumbSize = trackHeight - spaceBetweenThumbAndTrack;
+const useSwitchIndicatorBaseClassName = (0, _react.makeResetStyles)({
+    borderRadius: _reacttheme.tokens.borderRadiusCircular,
+    border: `${_reacttheme.tokens.strokeWidthThin} solid ${_reacttheme.tokens.colorNeutralStrokeAccessible}`,
+    lineHeight: 0,
+    boxSizing: 'border-box',
+    fill: 'currentColor',
+    flexShrink: 0,
+    fontSize: `${thumbSize}px`,
+    height: `${trackHeight}px`,
+    transitionDuration: _reacttheme.tokens.durationNormal,
+    transitionTimingFunction: _reacttheme.tokens.curveEasyEase,
+    transitionProperty: 'background, border, color',
+    width: `${trackWidth}px`,
+    marginRight: _reacttheme.tokens.spacingHorizontalXS,
+    '@media screen and (prefers-reduced-motion: reduce)': {
+        transitionDuration: '0.01ms'
+    },
+    color: _reacttheme.tokens.colorNeutralStrokeAccessible,
+    ':hover': {
+        color: _reacttheme.tokens.colorNeutralStrokeAccessibleHover,
+        borderColor: _reacttheme.tokens.colorNeutralStrokeAccessibleHover
+    },
+    ':hover:active': {
+        color: _reacttheme.tokens.colorNeutralStrokeAccessiblePressed,
+        borderColor: _reacttheme.tokens.colorNeutralStrokeAccessiblePressed
+    },
+    [`& .${circleFilledClassName}`]: {
+        transitionDuration: _reacttheme.tokens.durationNormal,
+        transitionTimingFunction: _reacttheme.tokens.curveEasyEase,
+        transitionProperty: 'transform',
+        '@media screen and (prefers-reduced-motion: reduce)': {
+            transitionDuration: '0.01ms'
+        }
+    }
+});
+const useSwitchIndicatorStyles = (0, _react.makeStyles)({
+    checked: {
+        [`& .${circleFilledClassName}`]: {
+            transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`
+        },
+        backgroundColor: _reacttheme.tokens.colorCompoundBrandBackground,
+        color: _reacttheme.tokens.colorNeutralForegroundInverted,
+        ..._react.shorthands.borderColor(_reacttheme.tokens.colorTransparentStroke),
+        ':hover': {
+            color: _reacttheme.tokens.colorNeutralForegroundInverted,
+            backgroundColor: _reacttheme.tokens.colorCompoundBrandBackgroundHover,
+            ..._react.shorthands.borderColor(_reacttheme.tokens.colorTransparentStrokeInteractive)
+        },
+        ':hover:active': {
+            color: _reacttheme.tokens.colorNeutralForegroundInverted,
+            backgroundColor: _reacttheme.tokens.colorCompoundBrandBackgroundPressed,
+            ..._react.shorthands.borderColor(_reacttheme.tokens.colorTransparentStrokeInteractive)
+        }
+    }
+});
+const useMultilineStyles = (0, _react.makeStyles)({
+    switch: {
+        alignSelf: 'center'
+    }
+});
+const useMenuItemSwitchStyles_unstable = (state)=>{
+    'use no memo';
+    const { checked, subText } = state;
+    const multiline = !!subText;
+    const switchIndicatorStyles = useSwitchIndicatorStyles();
+    const switchIndicatorBaseStyles = useSwitchIndicatorBaseClassName();
+    const multilineStyles = useMultilineStyles();
+    state.root.className = (0, _react.mergeClasses)(menuItemSwitchClassNames.root, state.root.className);
+    if (state.content) {
+        state.content.className = (0, _react.mergeClasses)(menuItemSwitchClassNames.content, state.content.className);
+    }
+    if (state.secondaryContent) {
+        state.secondaryContent.className = (0, _react.mergeClasses)(menuItemSwitchClassNames.secondaryContent, state.secondaryContent.className);
+    }
+    if (state.icon) {
+        state.icon.className = (0, _react.mergeClasses)(menuItemSwitchClassNames.icon, state.icon.className);
+    }
+    if (state.subText) {
+        state.subText.className = (0, _react.mergeClasses)(menuItemSwitchClassNames.subText, state.subText.className);
+    }
+    if (state.switchIndicator) {
+        state.switchIndicator.className = (0, _react.mergeClasses)(menuItemSwitchClassNames.switchIndicator, switchIndicatorBaseStyles, checked && switchIndicatorStyles.checked, state.switchIndicator.className, multiline && multilineStyles.switch);
+    }
+    (0, _useMenuItemStylesstyles.useMenuItemStyles_unstable)({
+        ...state,
+        components: {
+            // eslint-disable-next-line @typescript-eslint/no-deprecated
+            ...state.components,
+            checkmark: 'span',
+            submenuIndicator: 'span'
+        },
+        checkmark: undefined,
+        submenuIndicator: undefined,
+        hasSubmenu: false,
+        persistOnClick: true
+    });
+    return state;
+};

package/lib-commonjs/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.ts"],"sourcesContent":["import { makeStyles, makeResetStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { type SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSwitchSlots, MenuItemSwitchState } from './MenuItemSwitch.types';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\n\nexport const menuItemSwitchClassNames: SlotClassNames<MenuItemSwitchSlots> = {\n  root: 'fui-MenuItemSwitch',\n  icon: 'fui-MenuItemSwitch__icon',\n  content: 'fui-MenuItemSwitch__content',\n  secondaryContent: 'fui-MenuItemSwitch__secondaryContent',\n  switchIndicator: 'fui-MenuItemSwitch__switchIndicator',\n  subText: 'fui-MenuItemSwitch__subText',\n};\n\nexport const circleFilledClassName = 'fui-MenuItemSwitch__switchIndicator__circleFilled';\n\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\n\nconst useSwitchIndicatorBaseClassName = makeResetStyles({\n  borderRadius: tokens.borderRadiusCircular,\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n  lineHeight: 0,\n  boxSizing: 'border-box',\n  fill: 'currentColor',\n  flexShrink: 0,\n  fontSize: `${thumbSize}px`,\n  height: `${trackHeight}px`,\n  transitionDuration: tokens.durationNormal,\n  transitionTimingFunction: tokens.curveEasyEase,\n  transitionProperty: 'background, border, color',\n  width: `${trackWidth}px`,\n  marginRight: tokens.spacingHorizontalXS,\n\n  '@media screen and (prefers-reduced-motion: reduce)': {\n    transitionDuration: '0.01ms',\n  },\n\n  color: tokens.colorNeutralStrokeAccessible,\n  ':hover': {\n    color: tokens.colorNeutralStrokeAccessibleHover,\n    borderColor: tokens.colorNeutralStrokeAccessibleHover,\n  },\n\n  ':hover:active': {\n    color: tokens.colorNeutralStrokeAccessiblePressed,\n    borderColor: tokens.colorNeutralStrokeAccessiblePressed,\n  },\n  [`& .${circleFilledClassName}`]: {\n    transitionDuration: tokens.durationNormal,\n    transitionTimingFunction: tokens.curveEasyEase,\n    transitionProperty: 'transform',\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n    },\n  },\n});\n\nconst useSwitchIndicatorStyles = makeStyles({\n  checked: {\n    [`& .${circleFilledClassName}`]: {\n      transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`,\n    },\n\n    backgroundColor: tokens.colorCompoundBrandBackground,\n    color: tokens.colorNeutralForegroundInverted,\n    ...shorthands.borderColor(tokens.colorTransparentStroke),\n\n    ':hover': {\n      color: tokens.colorNeutralForegroundInverted,\n      backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n      ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n    },\n\n    ':hover:active': {\n      color: tokens.colorNeutralForegroundInverted,\n      backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n      ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n    },\n  },\n});\n\nconst useMultilineStyles = makeStyles({\n  switch: {\n    alignSelf: 'center',\n  },\n});\n\n/**\n * Apply styling to the MenuItemSwitch slots based on the state\n */\nexport const useMenuItemSwitchStyles_unstable = (state: MenuItemSwitchState): MenuItemSwitchState => {\n  'use no memo';\n\n  const { checked, subText } = state;\n  const multiline = !!subText;\n  const switchIndicatorStyles = useSwitchIndicatorStyles();\n  const switchIndicatorBaseStyles = useSwitchIndicatorBaseClassName();\n  const multilineStyles = useMultilineStyles();\n  state.root.className = mergeClasses(menuItemSwitchClassNames.root, state.root.className);\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemSwitchClassNames.content, state.content.className);\n  }\n\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(\n      menuItemSwitchClassNames.secondaryContent,\n      state.secondaryContent.className,\n    );\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemSwitchClassNames.icon, state.icon.className);\n  }\n\n  if (state.subText) {\n    state.subText.className = mergeClasses(menuItemSwitchClassNames.subText, state.subText.className);\n  }\n\n  if (state.switchIndicator) {\n    state.switchIndicator.className = mergeClasses(\n      menuItemSwitchClassNames.switchIndicator,\n      switchIndicatorBaseStyles,\n      checked && switchIndicatorStyles.checked,\n      state.switchIndicator.className,\n      multiline && multilineStyles.switch,\n    );\n  }\n\n  useMenuItemStyles_unstable({\n    ...state,\n    components: {\n      // eslint-disable-next-line @typescript-eslint/no-deprecated\n      ...state.components,\n      checkmark: 'span',\n      submenuIndicator: 'span',\n    },\n    checkmark: undefined,\n    submenuIndicator: undefined,\n    hasSubmenu: false,\n    persistOnClick: true,\n  });\n\n  return state;\n};\n"],"names":["circleFilledClassName","menuItemSwitchClassNames","useMenuItemSwitchStyles_unstable","root","icon","content","secondaryContent","switchIndicator","subText","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useSwitchIndicatorBaseClassName","makeResetStyles","borderRadius","tokens","borderRadiusCircular","border","strokeWidthThin","colorNeutralStrokeAccessible","lineHeight","boxSizing","fill","flexShrink","fontSize","height","transitionDuration","durationNormal","transitionTimingFunction","curveEasyEase","transitionProperty","width","marginRight","spacingHorizontalXS","color","colorNeutralStrokeAccessibleHover","borderColor","colorNeutralStrokeAccessiblePressed","useSwitchIndicatorStyles","makeStyles","checked","transform","backgroundColor","colorCompoundBrandBackground","colorNeutralForegroundInverted","shorthands","colorTransparentStroke","colorCompoundBrandBackgroundHover","colorTransparentStrokeInteractive","colorCompoundBrandBackgroundPressed","useMultilineStyles","switch","alignSelf","state","multiline","switchIndicatorStyles","switchIndicatorBaseStyles","multilineStyles","className","mergeClasses","useMenuItemStyles_unstable","components","checkmark","submenuIndicator","undefined","hasSubmenu","persistOnClick"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

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

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    menuListClassNames: function() {
+        return menuListClassNames;
+    },
+    useMenuListStyles_unstable: function() {
+        return useMenuListStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const menuListClassNames = {
+    root: 'fui-MenuList'
+};
+const useStyles = (0, _react.makeStyles)({
+    root: {
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '2px'
+    },
+    hasMenuContext: {
+        height: '100%'
+    }
+});
+const useMenuListStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _react.mergeClasses)(menuListClassNames.root, styles.root, state.hasMenuContext && styles.hasMenuContext, state.root.className);
+    return state;
+};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MenuList/useMenuListStyles.styles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\nexport const menuListClassNames: SlotClassNames<MenuListSlots> = {\n  root: 'fui-MenuList',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '2px',\n  },\n  hasMenuContext: {\n    height: '100%',\n  },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuListStyles_unstable = (state: MenuListState): MenuListState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    menuListClassNames.root,\n    styles.root,\n    state.hasMenuContext && styles.hasMenuContext,\n    state.root.className,\n  );\n  return state;\n};\n"],"names":["menuListClassNames","useMenuListStyles_unstable","root","useStyles","makeStyles","display","flexDirection","gap","hasMenuContext","height","state","styles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,kBAAAA;eAAAA;;IAkBAC,0BAAAA;eAAAA;;;uBArB4B;AAGlC,MAAMD,qBAAoD;IAC/DE,MAAM;AACR;AAEA,MAAMC,YAAYC,IAAAA,iBAAAA,EAAW;IAC3BF,MAAM;QACJG,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAC,gBAAgB;QACdC,QAAQ;IACV;AACF;AAKO,MAAMR,6BAA6B,CAACS;IACzC;IAEA,MAAMC,SAASR;IACfO,MAAMR,IAAI,CAACU,SAAS,GAAGC,IAAAA,mBAAAA,EACrBb,mBAAmBE,IAAI,EACvBS,OAAOT,IAAI,EACXQ,MAAMF,cAAc,IAAIG,OAAOH,cAAc,EAC7CE,MAAMR,IAAI,CAACU,SAAS;IAEtB,OAAOF;AACT"}

package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.styles.raw.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    menuPopoverClassNames: function() {
+        return menuPopoverClassNames;
+    },
+    useMenuPopoverStyles_unstable: function() {
+        return useMenuPopoverStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const _reactpositioning = require("@fluentui/react-positioning");
+const menuPopoverClassNames = {
+    root: 'fui-MenuPopover'
+};
+const useStyles = (0, _react.makeStyles)({
+    root: {
+        borderRadius: _reacttheme.tokens.borderRadiusMedium,
+        backgroundColor: _reacttheme.tokens.colorNeutralBackground1,
+        color: _reacttheme.tokens.colorNeutralForeground1,
+        boxSizing: 'border-box',
+        minWidth: '138px',
+        maxWidth: '300px',
+        overflowX: 'hidden',
+        width: 'max-content',
+        boxShadow: `${_reacttheme.tokens.shadow16}`,
+        padding: '4px',
+        border: `1px solid ${_reacttheme.tokens.colorTransparentStroke}`,
+        ..._reacttheme.typographyStyles.body1,
+        ...(0, _reactpositioning.createSlideStyles)(10)
+    }
+});
+const useMenuPopoverStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _react.mergeClasses)(menuPopoverClassNames.root, styles.root, state.root.className);
+    return state;
+};

package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MenuPopover/useMenuPopoverStyles.styles.ts"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { createSlideStyles } from '@fluentui/react-positioning';\n\nexport const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots> = {\n  root: 'fui-MenuPopover',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    borderRadius: tokens.borderRadiusMedium,\n    backgroundColor: tokens.colorNeutralBackground1,\n    color: tokens.colorNeutralForeground1,\n    boxSizing: 'border-box',\n    minWidth: '138px',\n    maxWidth: '300px',\n    overflowX: 'hidden',\n    width: 'max-content',\n    boxShadow: `${tokens.shadow16}`,\n    padding: '4px',\n    border: `1px solid ${tokens.colorTransparentStroke}`,\n    ...typographyStyles.body1,\n    ...createSlideStyles(10),\n  },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"],"names":["menuPopoverClassNames","useMenuPopoverStyles_unstable","root","useStyles","makeStyles","borderRadius","tokens","borderRadiusMedium","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxSizing","minWidth","maxWidth","overflowX","width","boxShadow","shadow16","padding","border","colorTransparentStroke","typographyStyles","body1","createSlideStyles","state","styles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAMaA,qBAAAA;eAAAA;;IAyBAC,6BAAAA;eAAAA;;;uBA/B4B;4BACA;kCAGP;AAE3B,MAAMD,wBAA0D;IACrEE,MAAM;AACR;AAEA,MAAMC,YAAYC,IAAAA,iBAAAA,EAAW;IAC3BF,MAAM;QACJG,cAAcC,kBAAAA,CAAOC,kBAAkB;QACvCC,iBAAiBF,kBAAAA,CAAOG,uBAAuB;QAC/CC,OAAOJ,kBAAAA,CAAOK,uBAAuB;QACrCC,WAAW;QACXC,UAAU;QACVC,UAAU;QACVC,WAAW;QACXC,OAAO;QACPC,WAAW,CAAC,EAAEX,kBAAAA,CAAOY,QAAQ,CAAC,CAAC;QAC/BC,SAAS;QACTC,QAAQ,CAAC,UAAU,EAAEd,kBAAAA,CAAOe,sBAAsB,CAAC,CAAC;QACpD,GAAGC,4BAAAA,CAAiBC,KAAK;QACzB,GAAGC,IAAAA,mCAAAA,EAAkB,GAAG;IAC1B;AACF;AAKO,MAAMvB,gCAAgC,CAACwB;IAC5C;IAEA,MAAMC,SAASvB;IACfsB,MAAMvB,IAAI,CAACyB,SAAS,GAAGC,IAAAA,mBAAAA,EAAa5B,sBAAsBE,IAAI,EAAEwB,OAAOxB,IAAI,EAAEuB,MAAMvB,IAAI,CAACyB,SAAS;IACjG,OAAOF;AACT"}

package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    menuSplitGroupClassNames: function() {
+        return menuSplitGroupClassNames;
+    },
+    menuSplitGroupMultilineAttr: function() {
+        return menuSplitGroupMultilineAttr;
+    },
+    useMenuSplitGroupStyles_unstable: function() {
+        return useMenuSplitGroupStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const _useMenuItemStylesstyles = require("../MenuItem/useMenuItemStyles.styles");
+const menuSplitGroupMultilineAttr = 'data-multiline';
+const menuSplitGroupClassNames = {
+    root: 'fui-MenuSplitGroup'
+};
+/**
+ * Styles for the root slot
+ * TODO - remove the use of nested combinators to style child menu items
+ */ const useStyles = (0, _react.makeStyles)({
+    root: {
+        [`[${menuSplitGroupMultilineAttr}]`]: {
+            [`& > .${_useMenuItemStylesstyles.menuItemClassNames.root}:nth-of-type(2)`]: {
+                alignSelf: 'center'
+            }
+        },
+        display: 'flex',
+        [`& > .${_useMenuItemStylesstyles.menuItemClassNames.root}:nth-of-type(1)`]: {
+            flex: 1
+        },
+        [`& > .${_useMenuItemStylesstyles.menuItemClassNames.root}:nth-of-type(2)`]: {
+            borderTopLeftRadius: 0,
+            borderBottomLeftRadius: 0,
+            paddingLeft: 0,
+            '::before': {
+                content: '""',
+                width: _reacttheme.tokens.strokeWidthThin,
+                height: '20px',
+                backgroundColor: _reacttheme.tokens.colorNeutralStroke1
+            }
+        }
+    }
+});
+const useMenuSplitGroupStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _react.mergeClasses)(menuSplitGroupClassNames.root, styles.root, state.root.className);
+    return state;
+};

package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nimport type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\n\nexport const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots> = {\n  root: 'fui-MenuSplitGroup',\n};\n/**\n * Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n */\nconst useStyles = makeStyles({\n  root: {\n    [`[${menuSplitGroupMultilineAttr}]`]: {\n      [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n        alignSelf: 'center',\n      },\n    },\n    display: 'flex',\n    [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n      flex: 1,\n    },\n    [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n      borderTopLeftRadius: 0,\n      borderBottomLeftRadius: 0,\n      paddingLeft: 0,\n      '::before': {\n        content: '\"\"',\n        width: tokens.strokeWidthThin,\n        height: '20px',\n        backgroundColor: tokens.colorNeutralStroke1,\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the MenuSplitGroup slots based on the state\n */\nexport const useMenuSplitGroupStyles_unstable = (state: MenuSplitGroupState): MenuSplitGroupState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"],"names":["menuSplitGroupClassNames","menuSplitGroupMultilineAttr","useMenuSplitGroupStyles_unstable","root","useStyles","makeStyles","menuItemClassNames","alignSelf","display","flex","borderTopLeftRadius","borderBottomLeftRadius","paddingLeft","content","width","tokens","strokeWidthThin","height","backgroundColor","colorNeutralStroke1","state","styles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAQaA,wBAAAA;eAAAA;;IAFAC,2BAAAA;eAAAA;;IAqCAC,gCAAAA;eAAAA;;;uBA3C4B;4BAClB;yCACY;AAI5B,MAAMD,8BAA8B;AAEpC,MAAMD,2BAAgE;IAC3EG,MAAM;AACR;AACA;;;CAGC,GACD,MAAMC,YAAYC,IAAAA,iBAAAA,EAAW;IAC3BF,MAAM;QACJ,CAAC,CAAC,CAAC,EAAEF,4BAA4B,CAAC,CAAC,CAAC,EAAE;YACpC,CAAC,CAAC,KAAK,EAAEK,2CAAAA,CAAmBH,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;gBAClDI,WAAW;YACb;QACF;QACAC,SAAS;QACT,CAAC,CAAC,KAAK,EAAEF,2CAAAA,CAAmBH,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDM,MAAM;QACR;QACA,CAAC,CAAC,KAAK,EAAEH,2CAAAA,CAAmBH,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDO,qBAAqB;YACrBC,wBAAwB;YACxBC,aAAa;YACb,YAAY;gBACVC,SAAS;gBACTC,OAAOC,kBAAAA,CAAOC,eAAe;gBAC7BC,QAAQ;gBACRC,iBAAiBH,kBAAAA,CAAOI,mBAAmB;YAC7C;QACF;IACF;AACF;AAKO,MAAMjB,mCAAmC,CAACkB;IAC/C;IAEA,MAAMC,SAASjB;IACfgB,MAAMjB,IAAI,CAACmB,SAAS,GAAGC,IAAAA,mBAAAA,EAAavB,yBAAyBG,IAAI,EAAEkB,OAAOlB,IAAI,EAAEiB,MAAMjB,IAAI,CAACmB,SAAS;IACpG,OAAOF;AACT"}

package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js

@@ -39,7 +39,8 @@ const useMenuTrigger_unstable = (props)=>{
         menuPopoverRef
     ]);
     const openedWithKeyboardRef = _react.useRef(false);
-    const hasMouseMoved = _react.useRef(false);
+    const openedViaSafeZoneRef = _react.useRef(false);
+    const hasMouseMovedRef = _react.useRef(false);
     const { dir } = (0, _reactsharedcontexts.useFluent_unstable)();
     const OpenArrowKey = dir === 'ltr' ? _keyboardkeys.ArrowRight : _keyboardkeys.ArrowLeft;
     const child = (0, _reactutilities.getTriggerChild)(children);
@@ -49,7 +50,7 @@ const useMenuTrigger_unstable = (props)=>{
     // but the cursor is already over the menu trigger.
     const safeZoneHandlerRef = (0, _utils.useOnMenuSafeZoneTimeout)((0, _reactutilities.useEventCallback)(()=>{
         if (isSubmenu) {
-            hasMouseMoved.current = true;
+            openedViaSafeZoneRef.current = true;
         }
     }));
     const onContextMenu = (event)=>{
@@ -110,13 +111,24 @@ const useMenuTrigger_unstable = (props)=>{
         if (isTargetDisabled(event)) {
             return;
         }
-        if (openOnHover && hasMouseMoved.current) {
-            setOpen(event, {
-                open: true,
-                keyboard: false,
-                type: 'menuTriggerMouseEnter',
-                event
-            });
+        if (openOnHover) {
+            if (hasMouseMovedRef.current) {
+                setOpen(event, {
+                    open: true,
+                    keyboard: false,
+                    type: 'menuTriggerMouseEnter',
+                    event
+                });
+            } else if (openedViaSafeZoneRef.current) {
+                setOpen(event, {
+                    open: true,
+                    keyboard: false,
+                    ignoreHoverDelay: true,
+                    type: 'menuTriggerMouseEnter',
+                    event
+                });
+                openedViaSafeZoneRef.current = false;
+            }
         }
     };
     // Opening a menu when a mouse hasn't moved and just entering the trigger is a bad a11y experience
@@ -126,14 +138,14 @@ const useMenuTrigger_unstable = (props)=>{
         if (isTargetDisabled(event)) {
             return;
         }
-        if (openOnHover && !hasMouseMoved.current) {
+        if (openOnHover && !hasMouseMovedRef.current) {
             setOpen(event, {
                 open: true,
                 keyboard: false,
                 type: 'menuTriggerMouseMove',
                 event
             });
-            hasMouseMoved.current = true;
+            hasMouseMovedRef.current = true;
         }
     };
     const onMouseLeave = (event)=>{

package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuTrigger/useMenuTrigger.ts"],"sourcesContent":["import { useARIAButtonProps } from '@fluentui/react-aria';\nimport { ArrowRight, ArrowLeft, Escape, ArrowDown } from '@fluentui/keyboard-keys';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport {\n  applyTriggerPropsToChildren,\n  getTriggerChild,\n  isHTMLElement,\n  mergeCallbacks,\n  useEventCallback,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { MenuTriggerProps, MenuTriggerState } from './MenuTrigger.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useIsSubmenu, useOnMenuSafeZoneTimeout } from '../../utils';\n\nfunction noop() {\n  // does nothing\n}\n\n/**\n * Create the state required to render MenuTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup menu\n *\n * @param props - props from this instance of MenuTrigger\n */\nexport const useMenuTrigger_unstable = (props: MenuTriggerProps): MenuTriggerState => {\n  const { children, disableButtonEnhancement = false } = props;\n\n  const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n  const menuPopoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const triggerId = useMenuContext_unstable(context => context.triggerId);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const openOnContext = useMenuContext_unstable(context => context.openOnContext);\n\n  const isSubmenu = useIsSubmenu();\n\n  const { findFirstFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, menuPopoverRef]);\n\n  const openedWithKeyboardRef = React.useRef(false);\n  const hasMouseMoved = React.useRef(false);\n\n  const { dir } = useFluent();\n  const OpenArrowKey = dir === 'ltr' ? ArrowRight : ArrowLeft;\n\n  const child = getTriggerChild(children);\n\n  // Heads up!\n  //\n  // Handles an edge case where mouse movement over the menu trigger didn't happen as safe zone blocked pointer events,\n  // but the cursor is already over the menu trigger.\n  const safeZoneHandlerRef = useOnMenuSafeZoneTimeout(\n    useEventCallback(() => {\n      if (isSubmenu) {\n        hasMouseMoved.current = true;\n      }\n    }),\n  );\n\n  const onContextMenu = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event) || event.isDefaultPrevented()) {\n      return;\n    }\n\n    if (openOnContext) {\n      event.preventDefault();\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerContextMenu', event });\n    }\n  };\n\n  const onClick = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    if (!openOnContext) {\n      setOpen(event, { open: !open, keyboard: openedWithKeyboardRef.current, type: 'menuTriggerClick', event });\n      openedWithKeyboardRef.current = false;\n    }\n  };\n\n  const onKeyDown = (event: React.KeyboardEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    const key = event.key;\n\n    if (!openOnContext && ((isSubmenu && key === OpenArrowKey) || (!isSubmenu && key === ArrowDown))) {\n      setOpen(event, { open: true, keyboard: true, type: 'menuTriggerKeyDown', event });\n    }\n\n    if (key === Escape && !isSubmenu) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuTriggerKeyDown', event });\n    }\n\n    // if menu is already open, can't rely on effects to focus\n    if (open && key === OpenArrowKey && isSubmenu) {\n      focusFirst();\n    }\n  };\n\n  const onMouseOver = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover && hasMouseMoved.current) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerMouseEnter', event });\n    }\n  };\n\n  // Opening a menu when a mouse hasn't moved and just entering the trigger is a bad a11y experience\n  // First time open the mouse using mousemove and then continue with mouseenter\n  // Only use once to determine that the user is using the mouse since it is an expensive event to handle\n  const onMouseMove = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover && !hasMouseMoved.current) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerMouseMove', event });\n      hasMouseMoved.current = true;\n    }\n  };\n\n  const onMouseLeave = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover) {\n      setOpen(event, { open: false, keyboard: false, type: 'menuTriggerMouseLeave', event });\n    }\n  };\n\n  const contextMenuProps = {\n    id: triggerId,\n    ...child?.props,\n    ref: useMergedRefs(triggerRef, child?.ref, safeZoneHandlerRef),\n    onMouseEnter: useEventCallback(child?.props.onMouseEnter ?? noop),\n    onMouseLeave: useEventCallback(mergeCallbacks(child?.props.onMouseLeave, onMouseLeave)),\n    onContextMenu: useEventCallback(mergeCallbacks(child?.props.onContextMenu, onContextMenu)),\n    onMouseMove: useEventCallback(mergeCallbacks(child?.props.onMouseMove, onMouseMove)),\n    onMouseOver: useEventCallback(mergeCallbacks(child?.props.onMouseOver, onMouseOver)),\n  };\n\n  const triggerChildProps = {\n    'aria-haspopup': 'menu',\n    'aria-expanded': !open && !isSubmenu ? undefined : open,\n    ...contextMenuProps,\n    onClick: useEventCallback(mergeCallbacks(child?.props.onClick, onClick)),\n    onKeyDown: useEventCallback(mergeCallbacks(child?.props.onKeyDown, onKeyDown)),\n  } as const;\n\n  const ariaButtonTriggerChildProps = useARIAButtonProps(\n    child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n    triggerChildProps,\n  );\n\n  return {\n    isSubmenu,\n    children: applyTriggerPropsToChildren(\n      children,\n      openOnContext ? contextMenuProps : disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n    ),\n  };\n};\n\nconst isTargetDisabled = (event: React.SyntheticEvent | Event) => {\n  const isDisabled = (el: HTMLElement) =>\n    el.hasAttribute('disabled') || (el.hasAttribute('aria-disabled') && el.getAttribute('aria-disabled') === 'true');\n  if (isHTMLElement(event.target) && isDisabled(event.target)) {\n    return true;\n  }\n\n  return isHTMLElement(event.currentTarget) && isDisabled(event.currentTarget);\n};\n"],"names":["useMenuTrigger_unstable","noop","props","children","disableButtonEnhancement","triggerRef","useMenuContext_unstable","context","menuPopoverRef","setOpen","open","triggerId","openOnHover","openOnContext","isSubmenu","useIsSubmenu","findFirstFocusable","useFocusFinders","focusFirst","React","useCallback","firstFocusable","current","focus","openedWithKeyboardRef","useRef","hasMouseMoved","dir","useFluent","OpenArrowKey","ArrowRight","ArrowLeft","child","getTriggerChild","safeZoneHandlerRef","useOnMenuSafeZoneTimeout","useEventCallback","onContextMenu","event","isTargetDisabled","isDefaultPrevented","preventDefault","keyboard","type","onClick","onKeyDown","key","ArrowDown","Escape","onMouseOver","onMouseMove","onMouseLeave","contextMenuProps","id","ref","useMergedRefs","onMouseEnter","mergeCallbacks","triggerChildProps","undefined","ariaButtonTriggerChildProps","useARIAButtonProps","applyTriggerPropsToChildren","isDisabled","el","hasAttribute","getAttribute","isHTMLElement","target","currentTarget"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BA4BaA;;;eAAAA;;;;2BA5BsB;8BACsB;qCACT;8BAChB;gCAQzB;iEACgB;6BAGiB;uBACe;AAEvD,SAASC;AACP,eAAe;AACjB;AAQO,MAAMD,0BAA0B,CAACE;IACtC,MAAM,EAAEC,QAAQ,EAAEC,2BAA2B,KAAK,EAAE,GAAGF;IAEvD,MAAMG,aAAaC,IAAAA,oCAAAA,EAAwBC,CAAAA,UAAWA,QAAQF,UAAU;IACxE,MAAMG,iBAAiBF,IAAAA,oCAAAA,EAAwBC,CAAAA,UAAWA,QAAQC,cAAc;IAChF,MAAMC,UAAUH,IAAAA,oCAAAA,EAAwBC,CAAAA,UAAWA,QAAQE,OAAO;IAClE,MAAMC,OAAOJ,IAAAA,oCAAAA,EAAwBC,CAAAA,UAAWA,QAAQG,IAAI;IAC5D,MAAMC,YAAYL,IAAAA,oCAAAA,EAAwBC,CAAAA,UAAWA,QAAQI,SAAS;IACtE,MAAMC,cAAcN,IAAAA,oCAAAA,EAAwBC,CAAAA,UAAWA,QAAQK,WAAW;IAC1E,MAAMC,gBAAgBP,IAAAA,oCAAAA,EAAwBC,CAAAA,UAAWA,QAAQM,aAAa;IAE9E,MAAMC,YAAYC,IAAAA,mBAAAA;IAElB,MAAM,EAAEC,kBAAkB,EAAE,GAAGC,IAAAA,6BAAAA;IAC/B,MAAMC,aAAaC,OAAMC,WAAW,CAAC;QACnC,MAAMC,iBAAiBL,mBAAmBR,eAAec,OAAO;QAChED,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBE,KAAK;IACvB,GAAG;QAACP;QAAoBR;KAAe;IAEvC,MAAMgB,wBAAwBL,OAAMM,MAAM,CAAC;IAC3C,MAAMC,gBAAgBP,OAAMM,MAAM,CAAC;IAEnC,MAAM,EAAEE,GAAG,EAAE,GAAGC,IAAAA,uCAAAA;IAChB,MAAMC,eAAeF,QAAQ,QAAQG,wBAAAA,GAAaC,uBAAAA;IAElD,MAAMC,QAAQC,IAAAA,+BAAAA,EAAgB9B;IAE9B,YAAY;IACZ,EAAE;IACF,qHAAqH;IACrH,mDAAmD;IACnD,MAAM+B,qBAAqBC,IAAAA,+BAAAA,EACzBC,IAAAA,gCAAAA,EAAiB;QACf,IAAItB,WAAW;YACbY,cAAcJ,OAAO,GAAG;QAC1B;IACF;IAGF,MAAMe,gBAAgB,CAACC;QACrB,IAAIC,iBAAiBD,UAAUA,MAAME,kBAAkB,IAAI;YACzD;QACF;QAEA,IAAI3B,eAAe;YACjByB,MAAMG,cAAc;YACpBhC,QAAQ6B,OAAO;gBAAE5B,MAAM;gBAAMgC,UAAU;gBAAOC,MAAM;gBAA0BL;YAAM;QACtF;IACF;IAEA,MAAMM,UAAU,CAACN;QACf,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QAEA,IAAI,CAACzB,eAAe;YAClBJ,QAAQ6B,OAAO;gBAAE5B,MAAM,CAACA;gBAAMgC,UAAUlB,sBAAsBF,OAAO;gBAAEqB,MAAM;gBAAoBL;YAAM;YACvGd,sBAAsBF,OAAO,GAAG;QAClC;IACF;IAEA,MAAMuB,YAAY,CAACP;QACjB,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QAEA,MAAMQ,MAAMR,MAAMQ,GAAG;QAErB,IAAI,CAACjC,iBAAkBC,CAAAA,aAAcgC,QAAQjB,gBAAkB,CAACf,aAAagC,QAAQC,uBAAS,AAATA,GAAa;YAChGtC,QAAQ6B,OAAO;gBAAE5B,MAAM;gBAAMgC,UAAU;gBAAMC,MAAM;gBAAsBL;YAAM;QACjF;QAEA,IAAIQ,QAAQE,oBAAAA,IAAU,CAAClC,WAAW;YAChCL,QAAQ6B,OAAO;gBAAE5B,MAAM;gBAAOgC,UAAU;gBAAMC,MAAM;gBAAsBL;YAAM;QAClF;QAEA,0DAA0D;QAC1D,IAAI5B,QAAQoC,QAAQjB,gBAAgBf,WAAW;YAC7CI;QACF;IACF;IAEA,MAAM+B,cAAc,CAACX;QACnB,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QACA,IAAI1B,eAAec,cAAcJ,OAAO,EAAE;YACxCb,QAAQ6B,OAAO;gBAAE5B,MAAM;gBAAMgC,UAAU;gBAAOC,MAAM;gBAAyBL;YAAM;QACrF;IACF;IAEA,kGAAkG;IAClG,8EAA8E;IAC9E,uGAAuG;IACvG,MAAMY,cAAc,CAACZ;QACnB,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QACA,IAAI1B,eAAe,CAACc,cAAcJ,OAAO,EAAE;YACzCb,QAAQ6B,OAAO;gBAAE5B,MAAM;gBAAMgC,UAAU;gBAAOC,MAAM;gBAAwBL;YAAM;YAClFZ,cAAcJ,OAAO,GAAG;QAC1B;IACF;IAEA,MAAM6B,eAAe,CAACb;QACpB,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QACA,IAAI1B,aAAa;YACfH,QAAQ6B,OAAO;gBAAE5B,MAAM;gBAAOgC,UAAU;gBAAOC,MAAM;gBAAyBL;YAAM;QACtF;IACF;QAMiCN;IAJjC,MAAMoB,mBAAmB;QACvBC,IAAI1C;WACDqB,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAO9B,KAAK;QACfoD,KAAKC,IAAAA,6BAAAA,EAAclD,YAAY2B,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAOsB,GAAG,EAAEpB;QAC3CsB,cAAcpB,IAAAA,gCAAAA,EAAiBJ,CAAAA,4BAAAA,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAO9B,KAAK,CAACsD,YAAY,AAAZA,MAAY,QAAzBxB,8BAAAA,KAAAA,IAAAA,4BAA6B/B;QAC5DkD,cAAcf,IAAAA,gCAAAA,EAAiBqB,IAAAA,8BAAAA,EAAezB,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAO9B,KAAK,CAACiD,YAAY,EAAEA;QACzEd,eAAeD,IAAAA,gCAAAA,EAAiBqB,IAAAA,8BAAAA,EAAezB,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAO9B,KAAK,CAACmC,aAAa,EAAEA;QAC3Ea,aAAad,IAAAA,gCAAAA,EAAiBqB,IAAAA,8BAAAA,EAAezB,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAO9B,KAAK,CAACgD,WAAW,EAAEA;QACvED,aAAab,IAAAA,gCAAAA,EAAiBqB,IAAAA,8BAAAA,EAAezB,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAO9B,KAAK,CAAC+C,WAAW,EAAEA;IACzE;IAEA,MAAMS,oBAAoB;QACxB,iBAAiB;QACjB,iBAAiB,CAAChD,QAAQ,CAACI,YAAY6C,YAAYjD;QACnD,GAAG0C,gBAAgB;QACnBR,SAASR,IAAAA,gCAAAA,EAAiBqB,IAAAA,8BAAAA,EAAezB,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAO9B,KAAK,CAAC0C,OAAO,EAAEA;QAC/DC,WAAWT,IAAAA,gCAAAA,EAAiBqB,IAAAA,8BAAAA,EAAezB,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAO9B,KAAK,CAAC2C,SAAS,EAAEA;IACrE;IAEA,MAAMe,8BAA8BC,IAAAA,6BAAAA,EAClC7B,CAAAA,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAOW,IAAI,AAAJA,MAAS,YAAYX,CAAAA,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAOW,IAAI,AAAJA,MAAS,MAAMX,MAAMW,IAAI,GAAG,OAC/De;IAGF,OAAO;QACL5C;QACAX,UAAU2D,IAAAA,2CAAAA,EACR3D,UACAU,gBAAgBuC,mBAAmBhD,2BAA2BsD,oBAAoBE;IAEtF;AACF;AAEA,MAAMrB,mBAAmB,CAACD;IACxB,MAAMyB,aAAa,CAACC,KAClBA,GAAGC,YAAY,CAAC,eAAgBD,GAAGC,YAAY,CAAC,oBAAoBD,GAAGE,YAAY,CAAC,qBAAqB;IAC3G,IAAIC,IAAAA,6BAAAA,EAAc7B,MAAM8B,MAAM,KAAKL,WAAWzB,MAAM8B,MAAM,GAAG;QAC3D,OAAO;IACT;IAEA,OAAOD,IAAAA,6BAAAA,EAAc7B,MAAM+B,aAAa,KAAKN,WAAWzB,MAAM+B,aAAa;AAC7E"}
+{"version":3,"sources":["../src/components/MenuTrigger/useMenuTrigger.ts"],"sourcesContent":["import { useARIAButtonProps } from '@fluentui/react-aria';\nimport { ArrowRight, ArrowLeft, Escape, ArrowDown } from '@fluentui/keyboard-keys';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport {\n  applyTriggerPropsToChildren,\n  getTriggerChild,\n  isHTMLElement,\n  mergeCallbacks,\n  useEventCallback,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { MenuTriggerProps, MenuTriggerState } from './MenuTrigger.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useIsSubmenu, useOnMenuSafeZoneTimeout } from '../../utils';\n\nfunction noop() {\n  // does nothing\n}\n\n/**\n * Create the state required to render MenuTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup menu\n *\n * @param props - props from this instance of MenuTrigger\n */\nexport const useMenuTrigger_unstable = (props: MenuTriggerProps): MenuTriggerState => {\n  const { children, disableButtonEnhancement = false } = props;\n\n  const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n  const menuPopoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const triggerId = useMenuContext_unstable(context => context.triggerId);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const openOnContext = useMenuContext_unstable(context => context.openOnContext);\n\n  const isSubmenu = useIsSubmenu();\n\n  const { findFirstFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, menuPopoverRef]);\n\n  const openedWithKeyboardRef = React.useRef(false);\n  const openedViaSafeZoneRef = React.useRef(false);\n  const hasMouseMovedRef = React.useRef(false);\n\n  const { dir } = useFluent();\n  const OpenArrowKey = dir === 'ltr' ? ArrowRight : ArrowLeft;\n\n  const child = getTriggerChild(children);\n\n  // Heads up!\n  //\n  // Handles an edge case where mouse movement over the menu trigger didn't happen as safe zone blocked pointer events,\n  // but the cursor is already over the menu trigger.\n  const safeZoneHandlerRef = useOnMenuSafeZoneTimeout(\n    useEventCallback(() => {\n      if (isSubmenu) {\n        openedViaSafeZoneRef.current = true;\n      }\n    }),\n  );\n\n  const onContextMenu = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event) || event.isDefaultPrevented()) {\n      return;\n    }\n\n    if (openOnContext) {\n      event.preventDefault();\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerContextMenu', event });\n    }\n  };\n\n  const onClick = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    if (!openOnContext) {\n      setOpen(event, { open: !open, keyboard: openedWithKeyboardRef.current, type: 'menuTriggerClick', event });\n      openedWithKeyboardRef.current = false;\n    }\n  };\n\n  const onKeyDown = (event: React.KeyboardEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    const key = event.key;\n\n    if (!openOnContext && ((isSubmenu && key === OpenArrowKey) || (!isSubmenu && key === ArrowDown))) {\n      setOpen(event, { open: true, keyboard: true, type: 'menuTriggerKeyDown', event });\n    }\n\n    if (key === Escape && !isSubmenu) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuTriggerKeyDown', event });\n    }\n\n    // if menu is already open, can't rely on effects to focus\n    if (open && key === OpenArrowKey && isSubmenu) {\n      focusFirst();\n    }\n  };\n\n  const onMouseOver = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    if (openOnHover) {\n      if (hasMouseMovedRef.current) {\n        setOpen(event, { open: true, keyboard: false, type: 'menuTriggerMouseEnter', event });\n      } else if (openedViaSafeZoneRef.current) {\n        setOpen(event, { open: true, keyboard: false, ignoreHoverDelay: true, type: 'menuTriggerMouseEnter', event });\n        openedViaSafeZoneRef.current = false;\n      }\n    }\n  };\n\n  // Opening a menu when a mouse hasn't moved and just entering the trigger is a bad a11y experience\n  // First time open the mouse using mousemove and then continue with mouseenter\n  // Only use once to determine that the user is using the mouse since it is an expensive event to handle\n  const onMouseMove = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover && !hasMouseMovedRef.current) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerMouseMove', event });\n      hasMouseMovedRef.current = true;\n    }\n  };\n\n  const onMouseLeave = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover) {\n      setOpen(event, { open: false, keyboard: false, type: 'menuTriggerMouseLeave', event });\n    }\n  };\n\n  const contextMenuProps = {\n    id: triggerId,\n    ...child?.props,\n    ref: useMergedRefs(triggerRef, child?.ref, safeZoneHandlerRef),\n    onMouseEnter: useEventCallback(child?.props.onMouseEnter ?? noop),\n    onMouseLeave: useEventCallback(mergeCallbacks(child?.props.onMouseLeave, onMouseLeave)),\n    onContextMenu: useEventCallback(mergeCallbacks(child?.props.onContextMenu, onContextMenu)),\n    onMouseMove: useEventCallback(mergeCallbacks(child?.props.onMouseMove, onMouseMove)),\n    onMouseOver: useEventCallback(mergeCallbacks(child?.props.onMouseOver, onMouseOver)),\n  };\n\n  const triggerChildProps = {\n    'aria-haspopup': 'menu',\n    'aria-expanded': !open && !isSubmenu ? undefined : open,\n    ...contextMenuProps,\n    onClick: useEventCallback(mergeCallbacks(child?.props.onClick, onClick)),\n    onKeyDown: useEventCallback(mergeCallbacks(child?.props.onKeyDown, onKeyDown)),\n  } as const;\n\n  const ariaButtonTriggerChildProps = useARIAButtonProps(\n    child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n    triggerChildProps,\n  );\n\n  return {\n    isSubmenu,\n    children: applyTriggerPropsToChildren(\n      children,\n      openOnContext ? contextMenuProps : disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n    ),\n  };\n};\n\nconst isTargetDisabled = (event: React.SyntheticEvent | Event) => {\n  const isDisabled = (el: HTMLElement) =>\n    el.hasAttribute('disabled') || (el.hasAttribute('aria-disabled') && el.getAttribute('aria-disabled') === 'true');\n  if (isHTMLElement(event.target) && isDisabled(event.target)) {\n    return true;\n  }\n\n  return isHTMLElement(event.currentTarget) && isDisabled(event.currentTarget);\n};\n"],"names":["useMenuTrigger_unstable","noop","props","children","disableButtonEnhancement","triggerRef","useMenuContext_unstable","context","menuPopoverRef","setOpen","open","triggerId","openOnHover","openOnContext","isSubmenu","useIsSubmenu","findFirstFocusable","useFocusFinders","focusFirst","React","useCallback","firstFocusable","current","focus","openedWithKeyboardRef","useRef","openedViaSafeZoneRef","hasMouseMovedRef","dir","useFluent","OpenArrowKey","ArrowRight","ArrowLeft","child","getTriggerChild","safeZoneHandlerRef","useOnMenuSafeZoneTimeout","useEventCallback","onContextMenu","event","isTargetDisabled","isDefaultPrevented","preventDefault","keyboard","type","onClick","onKeyDown","key","ArrowDown","Escape","onMouseOver","ignoreHoverDelay","onMouseMove","onMouseLeave","contextMenuProps","id","ref","useMergedRefs","onMouseEnter","mergeCallbacks","triggerChildProps","undefined","ariaButtonTriggerChildProps","useARIAButtonProps","applyTriggerPropsToChildren","isDisabled","el","hasAttribute","getAttribute","isHTMLElement","target","currentTarget"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

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

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useCheckmarkStyles_unstable", {
+    enumerable: true,
+    get: function() {
+        return useCheckmarkStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const useStyles = (0, _react.makeStyles)({
+    root: {
+        width: '16px',
+        height: '16px',
+        visibility: 'hidden',
+        flexShrink: 0
+    },
+    rootChecked: {
+        visibility: 'visible',
+        flexShrink: 0
+    }
+});
+const useCheckmarkStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    if (state.checkmark) {
+        state.checkmark.className = (0, _react.mergeClasses)(styles.root, state.checked && styles.rootChecked, state.checkmark.className);
+    }
+};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/selectable/useCheckmarkStyles.styles.ts"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuItemSelectableState } from './types';\nimport type { MenuItemState } from '../components/MenuItem/MenuItem.types';\n\nconst useStyles = makeStyles({\n  root: {\n    width: '16px',\n    height: '16px',\n    visibility: 'hidden',\n    flexShrink: 0,\n  },\n  rootChecked: {\n    visibility: 'visible',\n    flexShrink: 0,\n  },\n});\n\n/**\n * Applies styles to a checkmark slot for selectable menu items\n *\n * @param state - should contain a `checkmark` slot\n */\nexport const useCheckmarkStyles_unstable = (state: MenuItemSelectableState & Pick<MenuItemState, 'checkmark'>) => {\n  'use no memo';\n\n  const styles = useStyles();\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(\n      styles.root,\n      state.checked && styles.rootChecked,\n      state.checkmark.className,\n    );\n  }\n};\n"],"names":["useCheckmarkStyles_unstable","useStyles","makeStyles","root","width","height","visibility","flexShrink","rootChecked","state","styles","checkmark","className","mergeClasses","checked"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAsBaA;;;eAAAA;;;uBAtB4B;AAIzC,MAAMC,YAAYC,IAAAA,iBAAAA,EAAW;IAC3BC,MAAM;QACJC,OAAO;QACPC,QAAQ;QACRC,YAAY;QACZC,YAAY;IACd;IACAC,aAAa;QACXF,YAAY;QACZC,YAAY;IACd;AACF;AAOO,MAAMP,8BAA8B,CAACS;IAC1C;IAEA,MAAMC,SAAST;IACf,IAAIQ,MAAME,SAAS,EAAE;QACnBF,MAAME,SAAS,CAACC,SAAS,GAAGC,IAAAA,mBAAAA,EAC1BH,OAAOP,IAAI,EACXM,MAAMK,OAAO,IAAIJ,OAAOF,WAAW,EACnCC,MAAME,SAAS,CAACC,SAAS;IAE7B;AACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-menu",
-  "version": "9.17.6",
+  "version": "9.19.0",
   "description": "Fluent UI menu component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -21,13 +21,13 @@
   },
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.8",
-    "@fluentui/react-aria": "^9.15.3",
+    "@fluentui/react-aria": "^9.15.4",
     "@fluentui/react-context-selector": "^9.2.2",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-portal": "^9.6.4",
-    "@fluentui/react-positioning": "^9.18.5",
+    "@fluentui/react-portal": "^9.7.0",
+    "@fluentui/react-positioning": "^9.20.0",
     "@fluentui/react-shared-contexts": "^9.24.0",
-    "@fluentui/react-tabster": "^9.25.3",
+    "@fluentui/react-tabster": "^9.26.0",
     "@fluentui/react-theme": "^9.1.24",
     "@fluentui/react-utilities": "^9.22.0",
     "@fluentui/react-jsx-runtime": "^9.1.2",