@fluentui/react-menu 9.7.4 → 9.7.5

package/lib/components/MenuGroup/renderMenuGroup.js

@@ -12,8 +12,6 @@ export const renderMenuGroup_unstable = (state, contextValues) => {
   } = getSlots(state);
   return /*#__PURE__*/React.createElement(MenuGroupContextProvider, {
     value: contextValues.menuGroup
-  }, /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  }));
+  }, /*#__PURE__*/React.createElement(slots.root, slotProps.root));
 };
 //# sourceMappingURL=renderMenuGroup.js.map

package/lib/components/MenuGroup/renderMenuGroup.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getSlots","MenuGroupContextProvider","renderMenuGroup_unstable","state","contextValues","slots","slotProps","createElement","value","menuGroup","root"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/renderMenuGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { MenuGroupContextValues, MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\nimport { MenuGroupContextProvider } from '../../contexts/menuGroupContext';\n\n/**\n * Redefine the render function to add slots. Reuse the menugroup structure but add\n * slots to children.\n */\nexport const renderMenuGroup_unstable = (state: MenuGroupState, contextValues: MenuGroupContextValues) => {\n  const { slots, slotProps } = getSlots<MenuGroupSlots>(state);\n\n  return (\n    <MenuGroupContextProvider value={contextValues.menuGroup}>\n      <slots.root {...slotProps.root} />\n    </MenuGroupContextProvider>\n  );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAEpD,SAASC,wBAAwB,QAAQ,iCAAiC;AAE1E;;;;AAIA,OAAO,MAAMC,wBAAwB,GAAGA,CAACC,KAAqB,EAAEC,aAAqC,KAAI;EACvG,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGN,QAAQ,CAAiBG,KAAK,CAAC;EAE5D,oBACEJ,KAAA,CAAAQ,aAAA,CAACN,wBAAwB;IAACO,KAAK,EAAEJ,aAAa,CAACK;EAAS,gBACtDV,KAAA,CAAAQ,aAAA,CAACF,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,CACT;AAE/B,CAAC"}
+{"version":3,"names":["React","getSlots","MenuGroupContextProvider","renderMenuGroup_unstable","state","contextValues","slots","slotProps","createElement","value","menuGroup","root"],"sources":["../../../src/components/MenuGroup/renderMenuGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { MenuGroupContextValues, MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\nimport { MenuGroupContextProvider } from '../../contexts/menuGroupContext';\n\n/**\n * Redefine the render function to add slots. Reuse the menugroup structure but add\n * slots to children.\n */\nexport const renderMenuGroup_unstable = (state: MenuGroupState, contextValues: MenuGroupContextValues) => {\n  const { slots, slotProps } = getSlots<MenuGroupSlots>(state);\n\n  return (\n    <MenuGroupContextProvider value={contextValues.menuGroup}>\n      <slots.root {...slotProps.root} />\n    </MenuGroupContextProvider>\n  );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAEzB,SAASC,wBAAwB,QAAQ;AAEzC;;;;AAIA,OAAO,MAAMC,wBAAA,GAA2BA,CAACC,KAAA,EAAuBC,aAAA,KAA0C;EACxG,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,QAAA,CAAyBG,KAAA;EAEtD,oBACEJ,KAAA,CAAAQ,aAAA,CAACN,wBAAA;IAAyBO,KAAA,EAAOJ,aAAA,CAAcK;kBAC7CV,KAAA,CAAAQ,aAAA,CAACF,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI;AAGpC"}

package/lib/components/MenuGroup/useMenuGroup.js

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { getNativeElementProps, useId } from '@fluentui/react-utilities';
 /**
  * Given user props, returns state and render function for a MenuGroup.

package/lib/components/MenuGroup/useMenuGroup.js.map

@@ -1 +1 @@
-{"version":3,"names":["getNativeElementProps","useId","useMenuGroup_unstable","props","ref","headerId","components","root","role"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/useMenuGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId } from '@fluentui/react-utilities';\nimport { MenuGroupProps, MenuGroupState } from './MenuGroup.types';\n\n/**\n * Given user props, returns state and render function for a MenuGroup.\n */\nexport function useMenuGroup_unstable(props: MenuGroupProps, ref: React.Ref<HTMLElement>): MenuGroupState {\n  const headerId = useId('menu-group');\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      'aria-labelledby': headerId,\n      role: 'group',\n      ...props,\n    }),\n    headerId,\n  };\n}\n"],"mappings":"AACA,SAASA,qBAAqB,EAAEC,KAAK,QAAQ,2BAA2B;AAGxE;;;AAGA,OAAM,SAAUC,qBAAqBA,CAACC,KAAqB,EAAEC,GAA2B;EACtF,MAAMC,QAAQ,GAAGJ,KAAK,CAAC,YAAY,CAAC;EAEpC,OAAO;IACLK,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IACDA,IAAI,EAAEP,qBAAqB,CAAC,KAAK,EAAE;MACjCI,GAAG;MACH,iBAAiB,EAAEC,QAAQ;MAC3BG,IAAI,EAAE,OAAO;MACb,GAAGL;KACJ,CAAC;IACFE;GACD;AACH"}
+{"version":3,"names":["React","getNativeElementProps","useId","useMenuGroup_unstable","props","ref","headerId","components","root","role"],"sources":["../../../src/components/MenuGroup/useMenuGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId } from '@fluentui/react-utilities';\nimport { MenuGroupProps, MenuGroupState } from './MenuGroup.types';\n\n/**\n * Given user props, returns state and render function for a MenuGroup.\n */\nexport function useMenuGroup_unstable(props: MenuGroupProps, ref: React.Ref<HTMLElement>): MenuGroupState {\n  const headerId = useId('menu-group');\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      'aria-labelledby': headerId,\n      role: 'group',\n      ...props,\n    }),\n    headerId,\n  };\n}\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,KAAK,QAAQ;AAG7C;;;AAGA,OAAO,SAASC,sBAAsBC,KAAqB,EAAEC,GAA2B,EAAkB;EACxG,MAAMC,QAAA,GAAWJ,KAAA,CAAM;EAEvB,OAAO;IACLK,UAAA,EAAY;MACVC,IAAA,EAAM;IACR;IACAA,IAAA,EAAMP,qBAAA,CAAsB,OAAO;MACjCI,GAAA;MACA,mBAAmBC,QAAA;MACnBG,IAAA,EAAM;MACN,GAAGL;IACL;IACAE;EACF;AACF"}

package/lib/components/MenuGroup/useMenuGroupContextValues.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMenuGroupContextValues_unstable","state","headerId","menuGroup","useMemo"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/useMenuGroupContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { MenuGroupContextValues, MenuGroupState } from './MenuGroup.types';\n\nexport function useMenuGroupContextValues_unstable(state: MenuGroupState): MenuGroupContextValues {\n  const { headerId } = state;\n  const menuGroup = React.useMemo(() => ({ headerId }), [headerId]);\n\n  return { menuGroup };\n}\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,OAAM,SAAUC,kCAAkCA,CAACC,KAAqB;EACtE,MAAM;IAAEC;EAAQ,CAAE,GAAGD,KAAK;EAC1B,MAAME,SAAS,GAAGJ,KAAK,CAACK,OAAO,CAAC,OAAO;IAAEF;EAAQ,CAAE,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEjE,OAAO;IAAEC;EAAS,CAAE;AACtB"}
+{"version":3,"names":["React","useMenuGroupContextValues_unstable","state","headerId","menuGroup","useMemo"],"sources":["../../../src/components/MenuGroup/useMenuGroupContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { MenuGroupContextValues, MenuGroupState } from './MenuGroup.types';\n\nexport function useMenuGroupContextValues_unstable(state: MenuGroupState): MenuGroupContextValues {\n  const { headerId } = state;\n  const menuGroup = React.useMemo(() => ({ headerId }), [headerId]);\n\n  return { menuGroup };\n}\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAGvB,OAAO,SAASC,mCAAmCC,KAAqB,EAA0B;EAChG,MAAM;IAAEC;EAAQ,CAAE,GAAGD,KAAA;EACrB,MAAME,SAAA,GAAYJ,KAAA,CAAMK,OAAO,CAAC,OAAO;IAAEF;EAAS,IAAI,CAACA,QAAA,CAAS;EAEhE,OAAO;IAAEC;EAAU;AACrB"}

package/lib/components/MenuGroup/useMenuGroupStyles.js.map

@@ -1 +1 @@
-{"version":3,"names":["mergeClasses","menuGroupClassNames","root","useMenuGroupStyles_unstable","state","className"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/useMenuGroupStyles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport type { MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\n\nexport const menuGroupClassNames: SlotClassNames<MenuGroupSlots> = {\n  root: 'fui-MenuGroup',\n};\n\nexport const useMenuGroupStyles_unstable = (state: MenuGroupState): MenuGroupState => {\n  state.root.className = mergeClasses(menuGroupClassNames.root, state.root.className);\n\n  return state;\n};\n"],"mappings":"AACA,SAASA,YAAY,QAAQ,gBAAgB;AAG7C,OAAO,MAAMC,mBAAmB,GAAmC;EACjEC,IAAI,EAAE;CACP;AAED,OAAO,MAAMC,2BAA2B,GAAIC,KAAqB,IAAoB;EACnFA,KAAK,CAACF,IAAI,CAACG,SAAS,GAAGL,YAAY,CAACC,mBAAmB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;EAEnF,OAAOD,KAAK;AACd,CAAC"}
+{"version":3,"names":["mergeClasses","menuGroupClassNames","root","useMenuGroupStyles_unstable","state","className"],"sources":["../../../src/components/MenuGroup/useMenuGroupStyles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport type { MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\n\nexport const menuGroupClassNames: SlotClassNames<MenuGroupSlots> = {\n  root: 'fui-MenuGroup',\n};\n\nexport const useMenuGroupStyles_unstable = (state: MenuGroupState): MenuGroupState => {\n  state.root.className = mergeClasses(menuGroupClassNames.root, state.root.className);\n\n  return state;\n};\n"],"mappings":"AACA,SAASA,YAAY,QAAQ;AAG7B,OAAO,MAAMC,mBAAA,GAAsD;EACjEC,IAAA,EAAM;AACR;AAEA,OAAO,MAAMC,2BAAA,GAA+BC,KAAA,IAA0C;EACpFA,KAAA,CAAMF,IAAI,CAACG,SAAS,GAAGL,YAAA,CAAaC,mBAAA,CAAoBC,IAAI,EAAEE,KAAA,CAAMF,IAAI,CAACG,SAAS;EAElF,OAAOD,KAAA;AACT"}

package/lib/components/MenuGroupHeader/MenuGroupHeader.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMenuGroupHeader_unstable","useMenuGroupHeaderStyles_unstable","renderMenuGroupHeader_unstable","useCustomStyleHooks_unstable","MenuGroupHeader","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroupHeader/MenuGroupHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuGroupHeader_unstable } from './useMenuGroupHeader';\nimport { useMenuGroupHeaderStyles_unstable } from './useMenuGroupHeaderStyles';\nimport { renderMenuGroupHeader_unstable } from './renderMenuGroupHeader';\nimport type { MenuGroupHeaderProps } from './MenuGroupHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuGroupHeader, using the `useMenuGroupHeader_unstable` hook.\n */\nexport const MenuGroupHeader: ForwardRefComponent<MenuGroupHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useMenuGroupHeader_unstable(props, ref);\n\n  useMenuGroupHeaderStyles_unstable(state);\n\n  const { useMenuGroupHeaderStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuGroupHeader_unstable(state);\n});\n\nMenuGroupHeader.displayName = 'MenuGroupHeader';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,2BAA2B,QAAQ,sBAAsB;AAClE,SAASC,iCAAiC,QAAQ,4BAA4B;AAC9E,SAASC,8BAA8B,QAAQ,yBAAyB;AAGxE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,eAAe,gBAA8CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxG,MAAMC,KAAK,GAAGR,2BAA2B,CAACM,KAAK,EAAEC,GAAG,CAAC;EAErDN,iCAAiC,CAACO,KAAK,CAAC;EAExC,MAAM;IAAEP,iCAAiC,EAAEQ;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EAC7FM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAON,8BAA8B,CAACM,KAAK,CAAC;AAC9C,CAAC,CAAC;AAEFJ,eAAe,CAACM,WAAW,GAAG,iBAAiB"}
+{"version":3,"names":["React","useMenuGroupHeader_unstable","useMenuGroupHeaderStyles_unstable","renderMenuGroupHeader_unstable","useCustomStyleHooks_unstable","MenuGroupHeader","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/MenuGroupHeader/MenuGroupHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuGroupHeader_unstable } from './useMenuGroupHeader';\nimport { useMenuGroupHeaderStyles_unstable } from './useMenuGroupHeaderStyles';\nimport { renderMenuGroupHeader_unstable } from './renderMenuGroupHeader';\nimport type { MenuGroupHeaderProps } from './MenuGroupHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuGroupHeader, using the `useMenuGroupHeader_unstable` hook.\n */\nexport const MenuGroupHeader: ForwardRefComponent<MenuGroupHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useMenuGroupHeader_unstable(props, ref);\n\n  useMenuGroupHeaderStyles_unstable(state);\n\n  const { useMenuGroupHeaderStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuGroupHeader_unstable(state);\n});\n\nMenuGroupHeader.displayName = 'MenuGroupHeader';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,iCAAiC,QAAQ;AAClD,SAASC,8BAA8B,QAAQ;AAG/C,SAASC,4BAA4B,QAAQ;AAE7C;;;AAGA,OAAO,MAAMC,eAAA,gBAA6DL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACzG,MAAMC,KAAA,GAAQR,2BAAA,CAA4BM,KAAA,EAAOC,GAAA;EAEjDN,iCAAA,CAAkCO,KAAA;EAElC,MAAM;IAAEP,iCAAA,EAAmCQ;EAAe,CAAE,GAAGN,4BAAA;EAC/DM,eAAA,CAAgBD,KAAA;EAEhB,OAAON,8BAAA,CAA+BM,KAAA;AACxC;AAEAJ,eAAA,CAAgBM,WAAW,GAAG"}

package/lib/components/MenuGroupHeader/MenuGroupHeader.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuGroupHeader.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroupHeader/MenuGroupHeader.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type MenuGroupHeaderSlots = {\n  root: Slot<'div'>;\n};\n\nexport type MenuGroupHeaderProps = ComponentProps<MenuGroupHeaderSlots>;\n\nexport type MenuGroupHeaderState = ComponentState<MenuGroupHeaderSlots>;\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/MenuGroupHeader/MenuGroupHeader.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type MenuGroupHeaderSlots = {\n  root: Slot<'div'>;\n};\n\nexport type MenuGroupHeaderProps = ComponentProps<MenuGroupHeaderSlots>;\n\nexport type MenuGroupHeaderState = ComponentState<MenuGroupHeaderSlots>;\n"],"mappings":"AAAA"}

package/lib/components/MenuGroupHeader/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroupHeader/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,mBAAmB,CAAC;AAClC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './MenuGroupHeader.types';\nexport * from './MenuGroupHeader';\nexport * from './renderMenuGroupHeader';\nexport * from './useMenuGroupHeader';\nexport * from './useMenuGroupHeaderStyles';\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/MenuGroupHeader/index.ts"],"sourcesContent":["export * from './MenuGroupHeader.types';\nexport * from './MenuGroupHeader';\nexport * from './renderMenuGroupHeader';\nexport * from './useMenuGroupHeader';\nexport * from './useMenuGroupHeaderStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js

@@ -9,8 +9,6 @@ export const renderMenuGroupHeader_unstable = state => {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  });
+  return /*#__PURE__*/React.createElement(slots.root, slotProps.root);
 };
 //# sourceMappingURL=renderMenuGroupHeader.js.map

package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getSlots","renderMenuGroupHeader_unstable","state","slots","slotProps","createElement","root"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroupHeader/renderMenuGroupHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader.types';\n\n/**\n * Redefine the render function to add slots. Reuse the menugroupheader structure but add\n * slots to children.\n */\nexport const renderMenuGroupHeader_unstable = (state: MenuGroupHeaderState) => {\n  const { slots, slotProps } = getSlots<MenuGroupHeaderSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;;AAIA,OAAO,MAAMC,8BAA8B,GAAIC,KAA2B,IAAI;EAC5E,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAuBE,KAAK,CAAC;EAElE,oBAAOH,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,EAAI;AAC3C,CAAC"}
+{"version":3,"names":["React","getSlots","renderMenuGroupHeader_unstable","state","slots","slotProps","createElement","root"],"sources":["../../../src/components/MenuGroupHeader/renderMenuGroupHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader.types';\n\n/**\n * Redefine the render function to add slots. Reuse the menugroupheader structure but add\n * slots to children.\n */\nexport const renderMenuGroupHeader_unstable = (state: MenuGroupHeaderState) => {\n  const { slots, slotProps } = getSlots<MenuGroupHeaderSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;;AAIA,OAAO,MAAMC,8BAAA,GAAkCC,KAAA,IAAgC;EAC7E,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAA+BE,KAAA;EAE5D,oBAAOH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI;AACvC"}

package/lib/components/MenuGroupHeader/useMenuGroupHeader.js

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { useMenuGroupContext_unstable } from '../../contexts/menuGroupContext';
 import { getNativeElementProps } from '@fluentui/react-utilities';
 /**

package/lib/components/MenuGroupHeader/useMenuGroupHeader.js.map

@@ -1 +1 @@
-{"version":3,"names":["useMenuGroupContext_unstable","getNativeElementProps","useMenuGroupHeader_unstable","props","ref","headerId","id","components","root"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroupHeader/useMenuGroupHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport { useMenuGroupContext_unstable } from '../../contexts/menuGroupContext';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport { MenuGroupHeaderProps, MenuGroupHeaderState } from './MenuGroupHeader.types';\n\n/**\n * Given user props, returns state and render function for a MenuGroupHeader.\n */\nexport function useMenuGroupHeader_unstable(\n  props: MenuGroupHeaderProps,\n  ref: React.Ref<HTMLElement>,\n): MenuGroupHeaderState {\n  const { headerId: id } = useMenuGroupContext_unstable();\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      id,\n      ...props,\n    }),\n  };\n}\n"],"mappings":"AACA,SAASA,4BAA4B,QAAQ,iCAAiC;AAC9E,SAASC,qBAAqB,QAAQ,2BAA2B;AAGjE;;;AAGA,OAAM,SAAUC,2BAA2BA,CACzCC,KAA2B,EAC3BC,GAA2B;EAE3B,MAAM;IAAEC,QAAQ,EAAEC;EAAE,CAAE,GAAGN,4BAA4B,EAAE;EAEvD,OAAO;IACLO,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IACDA,IAAI,EAAEP,qBAAqB,CAAC,KAAK,EAAE;MACjCG,GAAG;MACHE,EAAE;MACF,GAAGH;KACJ;GACF;AACH"}
+{"version":3,"names":["React","useMenuGroupContext_unstable","getNativeElementProps","useMenuGroupHeader_unstable","props","ref","headerId","id","components","root"],"sources":["../../../src/components/MenuGroupHeader/useMenuGroupHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport { useMenuGroupContext_unstable } from '../../contexts/menuGroupContext';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport { MenuGroupHeaderProps, MenuGroupHeaderState } from './MenuGroupHeader.types';\n\n/**\n * Given user props, returns state and render function for a MenuGroupHeader.\n */\nexport function useMenuGroupHeader_unstable(\n  props: MenuGroupHeaderProps,\n  ref: React.Ref<HTMLElement>,\n): MenuGroupHeaderState {\n  const { headerId: id } = useMenuGroupContext_unstable();\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      id,\n      ...props,\n    }),\n  };\n}\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,qBAAqB,QAAQ;AAGtC;;;AAGA,OAAO,SAASC,4BACdC,KAA2B,EAC3BC,GAA2B,EACL;EACtB,MAAM;IAAEC,QAAA,EAAUC;EAAE,CAAE,GAAGN,4BAAA;EAEzB,OAAO;IACLO,UAAA,EAAY;MACVC,IAAA,EAAM;IACR;IACAA,IAAA,EAAMP,qBAAA,CAAsB,OAAO;MACjCG,GAAA;MACAE,EAAA;MACA,GAAGH;IACL;EACF;AACF"}

package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map

@@ -1 +1 @@
-{"version":3,"names":["mergeClasses","__styles","tokens","menuGroupHeaderClassNames","root","useStyles","Be2twd7","sj55zd","uwmqm3","z189sj","Bhrd7zp","Bqenvij","mc9l5x","Bt984gj","d","useMenuGroupHeaderStyles_unstable","state","styles","className"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroupHeader/useMenuGroupHeaderStyles.ts"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuGroupHeaderClassNames: SlotClassNames<MenuGroupHeaderSlots> = {\n  root: 'fui-MenuGroupHeader',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    fontSize: tokens.fontSizeBase200,\n    color: tokens.colorNeutralForeground3,\n    paddingLeft: '12px',\n    paddingRight: '12px',\n    fontWeight: tokens.fontWeightSemibold,\n    height: '32px',\n    display: 'flex',\n    alignItems: 'center',\n  },\n});\n\nexport const useMenuGroupHeaderStyles_unstable = (state: MenuGroupHeaderState) => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuGroupHeaderClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"],"mappings":"AAAA,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAI9C,OAAO,MAAMC,yBAAyB,GAAyC;EAC7EC,IAAI,EAAE;CACP;AAED,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAWhB;AAEF,OAAO,MAAMC,iCAAiC,GAAIC,KAA2B,IAAI;EAC/E,MAAMC,MAAM,GAAGZ,SAAS,EAAE;EAC1BW,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGlB,YAAY,CAACG,yBAAyB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAEtG,OAAOF,KAAK;AACd,CAAC"}
+{"version":3,"names":["mergeClasses","__styles","tokens","menuGroupHeaderClassNames","root","useStyles","Be2twd7","sj55zd","uwmqm3","z189sj","Bhrd7zp","Bqenvij","mc9l5x","Bt984gj","d","useMenuGroupHeaderStyles_unstable","state","styles","className"],"sources":["../../../src/components/MenuGroupHeader/useMenuGroupHeaderStyles.ts"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuGroupHeaderClassNames: SlotClassNames<MenuGroupHeaderSlots> = {\n  root: 'fui-MenuGroupHeader',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    fontSize: tokens.fontSizeBase200,\n    color: tokens.colorNeutralForeground3,\n    paddingLeft: '12px',\n    paddingRight: '12px',\n    fontWeight: tokens.fontWeightSemibold,\n    height: '32px',\n    display: 'flex',\n    alignItems: 'center',\n  },\n});\n\nexport const useMenuGroupHeaderStyles_unstable = (state: MenuGroupHeaderState) => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuGroupHeaderClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"],"mappings":"AAAA,SAASA,YAAY,EAAAC,QAAA,QAAoB;AACzC,SAASC,MAAM,QAAQ;AAIvB,OAAO,MAAMC,yBAAA,GAAkE;EAC7EC,IAAA,EAAM;AACR;AAEA,MAAMC,SAAA,gBAAYJ,QAAA;EAAAG,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAWlB;AAEA,OAAO,MAAMC,iCAAA,GAAqCC,KAAA,IAAgC;EAChF,MAAMC,MAAA,GAASZ,SAAA;EACfW,KAAA,CAAMZ,IAAI,CAACc,SAAS,GAAGlB,YAAA,CAAaG,yBAAA,CAA0BC,IAAI,EAAEa,MAAA,CAAOb,IAAI,EAAEY,KAAA,CAAMZ,IAAI,CAACc,SAAS;EAErG,OAAOF,KAAA;AACT"}

package/lib/components/MenuItem/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMenuItem_unstable","renderMenuItem_unstable","useMenuItemStyles_unstable","useCustomStyleHooks_unstable","MenuItem","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItem/MenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuItem_unstable } from './useMenuItem';\nimport { renderMenuItem_unstable } from './renderMenuItem';\nimport { useMenuItemStyles_unstable } from './useMenuItemStyles';\nimport type { MenuItemProps } from './MenuItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuItem, using the `useMenuItem_unstable` and `useMenuItemStyles_unstable` hook.\n */\nexport const MenuItem: ForwardRefComponent<MenuItemProps> = React.forwardRef((props, ref) => {\n  const state = useMenuItem_unstable(props, ref);\n\n  useMenuItemStyles_unstable(state);\n\n  const { useMenuItemStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuItem_unstable(state);\n});\n\nMenuItem.displayName = 'MenuItem';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,oBAAoB,QAAQ,eAAe;AACpD,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,0BAA0B,QAAQ,qBAAqB;AAGhE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,QAAQ,gBAAuCL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC1F,MAAMC,KAAK,GAAGR,oBAAoB,CAACM,KAAK,EAAEC,GAAG,CAAC;EAE9CL,0BAA0B,CAACM,KAAK,CAAC;EAEjC,MAAM;IAAEN,0BAA0B,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EACtFM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOP,uBAAuB,CAACO,KAAK,CAAC;AACvC,CAAC,CAAC;AAEFJ,QAAQ,CAACM,WAAW,GAAG,UAAU"}
+{"version":3,"names":["React","useMenuItem_unstable","renderMenuItem_unstable","useMenuItemStyles_unstable","useCustomStyleHooks_unstable","MenuItem","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/MenuItem/MenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuItem_unstable } from './useMenuItem';\nimport { renderMenuItem_unstable } from './renderMenuItem';\nimport { useMenuItemStyles_unstable } from './useMenuItemStyles';\nimport type { MenuItemProps } from './MenuItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuItem, using the `useMenuItem_unstable` and `useMenuItemStyles_unstable` hook.\n */\nexport const MenuItem: ForwardRefComponent<MenuItemProps> = React.forwardRef((props, ref) => {\n  const state = useMenuItem_unstable(props, ref);\n\n  useMenuItemStyles_unstable(state);\n\n  const { useMenuItemStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuItem_unstable(state);\n});\n\nMenuItem.displayName = 'MenuItem';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,oBAAoB,QAAQ;AACrC,SAASC,uBAAuB,QAAQ;AACxC,SAASC,0BAA0B,QAAQ;AAG3C,SAASC,4BAA4B,QAAQ;AAE7C;;;AAGA,OAAO,MAAMC,QAAA,gBAA+CL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EAC3F,MAAMC,KAAA,GAAQR,oBAAA,CAAqBM,KAAA,EAAOC,GAAA;EAE1CL,0BAAA,CAA2BM,KAAA;EAE3B,MAAM;IAAEN,0BAAA,EAA4BO;EAAe,CAAE,GAAGN,4BAAA;EACxDM,eAAA,CAAgBD,KAAA;EAEhB,OAAOP,uBAAA,CAAwBO,KAAA;AACjC;AAEAJ,QAAA,CAASM,WAAW,GAAG"}

package/lib/components/MenuItem/MenuItem.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuItem/MenuItem.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type MenuItemSlots = {\n  root: Slot<'div'>;\n\n  /**\n   * Icon slot rendered before children content\n   */\n  icon?: Slot<'span'>;\n\n  /**\n   * A helper slot for alignment when a menu item is used with selectable menuitems\n   * Avoid using this slot as a replacement for MenuItemCheckbox and MenuItemRadio components\n   */\n  checkmark?: Slot<'span'>;\n\n  /**\n   * Icon slot that shows the indicator for a submenu\n   */\n  submenuIndicator?: Slot<'span'>;\n\n  /**\n   * Component children are placed in this slot\n   * Avoid using the `children` property in this slot in favour of Component children whenever possible\n   */\n  content?: Slot<'span'>;\n\n  /**\n   * Secondary content rendered opposite the primary content (e.g Shortcut text)\n   */\n  secondaryContent?: Slot<'span'>;\n};\n\nexport type MenuItemProps = ComponentProps<Partial<MenuItemSlots>> & {\n  /**\n   * If the menu item is a trigger for a submenu\n   *\n   * @default false\n   */\n  hasSubmenu?: boolean;\n\n  /**\n   * Clicking on the menu item will not dismiss an open menu\n   *\n   * @default false\n   */\n  persistOnClick?: boolean;\n\n  disabled?: boolean;\n  /**\n   * @deprecated this property does nothing.\n   * disabled focusable is by default by simply using `disabled` property\n   */\n  disabledFocusable?: boolean;\n};\n\nexport type MenuItemState = ComponentState<MenuItemSlots> &\n  Required<Pick<MenuItemProps, 'disabled' | 'hasSubmenu' | 'persistOnClick'>>;\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/MenuItem/MenuItem.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type MenuItemSlots = {\n  root: Slot<'div'>;\n\n  /**\n   * Icon slot rendered before children content\n   */\n  icon?: Slot<'span'>;\n\n  /**\n   * A helper slot for alignment when a menu item is used with selectable menuitems\n   * Avoid using this slot as a replacement for MenuItemCheckbox and MenuItemRadio components\n   */\n  checkmark?: Slot<'span'>;\n\n  /**\n   * Icon slot that shows the indicator for a submenu\n   */\n  submenuIndicator?: Slot<'span'>;\n\n  /**\n   * Component children are placed in this slot\n   * Avoid using the `children` property in this slot in favour of Component children whenever possible\n   */\n  content?: Slot<'span'>;\n\n  /**\n   * Secondary content rendered opposite the primary content (e.g Shortcut text)\n   */\n  secondaryContent?: Slot<'span'>;\n};\n\nexport type MenuItemProps = ComponentProps<Partial<MenuItemSlots>> & {\n  /**\n   * If the menu item is a trigger for a submenu\n   *\n   * @default false\n   */\n  hasSubmenu?: boolean;\n\n  /**\n   * Clicking on the menu item will not dismiss an open menu\n   *\n   * @default false\n   */\n  persistOnClick?: boolean;\n\n  disabled?: boolean;\n  /**\n   * @deprecated this property does nothing.\n   * disabled focusable is by default by simply using `disabled` property\n   */\n  disabledFocusable?: boolean;\n};\n\nexport type MenuItemState = ComponentState<MenuItemSlots> &\n  Required<Pick<MenuItemProps, 'disabled' | 'hasSubmenu' | 'persistOnClick'>>;\n"],"mappings":"AAAA"}

package/lib/components/MenuItem/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuItem/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC","sourcesContent":["export * from './MenuItem';\nexport * from './MenuItem.types';\nexport * from './renderMenuItem';\nexport * from './useMenuItem';\nexport * from './useMenuItemStyles';\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/MenuItem/index.ts"],"sourcesContent":["export * from './MenuItem';\nexport * from './MenuItem.types';\nexport * from './renderMenuItem';\nexport * from './useMenuItem';\nexport * from './useMenuItemStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/MenuItem/renderMenuItem.js

@@ -8,18 +8,6 @@ export const renderMenuItem_unstable = state => {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  }, slots.checkmark && /*#__PURE__*/React.createElement(slots.checkmark, {
-    ...slotProps.checkmark
-  }), slots.icon && /*#__PURE__*/React.createElement(slots.icon, {
-    ...slotProps.icon
-  }), slots.content && /*#__PURE__*/React.createElement(slots.content, {
-    ...slotProps.content
-  }), slots.secondaryContent && /*#__PURE__*/React.createElement(slots.secondaryContent, {
-    ...slotProps.secondaryContent
-  }), slots.submenuIndicator && /*#__PURE__*/React.createElement(slots.submenuIndicator, {
-    ...slotProps.submenuIndicator
-  }));
+  return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.checkmark && /*#__PURE__*/React.createElement(slots.checkmark, slotProps.checkmark), slots.icon && /*#__PURE__*/React.createElement(slots.icon, slotProps.icon), slots.content && /*#__PURE__*/React.createElement(slots.content, slotProps.content), slots.secondaryContent && /*#__PURE__*/React.createElement(slots.secondaryContent, slotProps.secondaryContent), slots.submenuIndicator && /*#__PURE__*/React.createElement(slots.submenuIndicator, slotProps.submenuIndicator));
 };
 //# sourceMappingURL=renderMenuItem.js.map

package/lib/components/MenuItem/renderMenuItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getSlots","renderMenuItem_unstable","state","slots","slotProps","createElement","root","checkmark","icon","content","secondaryContent","submenuIndicator"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItem/renderMenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuItemSlots, MenuItemState } from './MenuItem.types';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderMenuItem_unstable = (state: MenuItemState) => {\n  const { slots, slotProps } = getSlots<MenuItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.checkmark && <slots.checkmark {...slotProps.checkmark} />}\n      {slots.icon && <slots.icon {...slotProps.icon} />}\n      {slots.content && <slots.content {...slotProps.content} />}\n      {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n      {slots.submenuIndicator && <slots.submenuIndicator {...slotProps.submenuIndicator} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,uBAAuB,GAAIC,KAAoB,IAAI;EAC9D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAgBE,KAAK,CAAC;EAE3D,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,GAC3BH,KAAK,CAACI,SAAS,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACI,SAAS;IAAA,GAAKH,SAAS,CAACG;EAAS,EAAI,EAC/DJ,KAAK,CAACK,IAAI,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,EAChDL,KAAK,CAACM,OAAO,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACM,OAAO;IAAA,GAAKL,SAAS,CAACK;EAAO,EAAI,EACzDN,KAAK,CAACO,gBAAgB,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACO,gBAAgB;IAAA,GAAKN,SAAS,CAACM;EAAgB,EAAI,EACpFP,KAAK,CAACQ,gBAAgB,iBAAIZ,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACQ,gBAAgB;IAAA,GAAKP,SAAS,CAACO;EAAgB,EAAI,CAC1E;AAEjB,CAAC"}
+{"version":3,"names":["React","getSlots","renderMenuItem_unstable","state","slots","slotProps","createElement","root","checkmark","icon","content","secondaryContent","submenuIndicator"],"sources":["../../../src/components/MenuItem/renderMenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuItemSlots, MenuItemState } from './MenuItem.types';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderMenuItem_unstable = (state: MenuItemState) => {\n  const { slots, slotProps } = getSlots<MenuItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.checkmark && <slots.checkmark {...slotProps.checkmark} />}\n      {slots.icon && <slots.icon {...slotProps.icon} />}\n      {slots.content && <slots.content {...slotProps.content} />}\n      {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n      {slots.submenuIndicator && <slots.submenuIndicator {...slotProps.submenuIndicator} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,uBAAA,GAA2BC,KAAA,IAAyB;EAC/D,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAAwBE,KAAA;EAErD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,EAC3BH,KAAA,CAAMI,SAAS,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMI,SAAS,EAAKH,SAAA,CAAUG,SAAS,GAC3DJ,KAAA,CAAMK,IAAI,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI,GAC5CL,KAAA,CAAMM,OAAO,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMM,OAAO,EAAKL,SAAA,CAAUK,OAAO,GACrDN,KAAA,CAAMO,gBAAgB,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMO,gBAAgB,EAAKN,SAAA,CAAUM,gBAAgB,GAChFP,KAAA,CAAMQ,gBAAgB,iBAAIZ,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMQ,gBAAgB,EAAKP,SAAA,CAAUO,gBAAgB;AAGvF"}

package/lib/components/MenuItem/useCharacterSearch.js

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { useMenuListContext_unstable } from '../../contexts/menuListContext';
 export const useCharacterSearch = (state, ref) => {
   const setFocusByFirstCharacter = useMenuListContext_unstable(context => context.setFocusByFirstCharacter);
@@ -5,9 +6,9 @@ export const useCharacterSearch = (state, ref) => {
     onKeyDown: originalOnKeyDown
   } = state.root;
   state.root.onKeyDown = e => {
-    var _a;
+    var _e_key;
     originalOnKeyDown === null || originalOnKeyDown === void 0 ? void 0 : originalOnKeyDown(e);
-    if (((_a = e.key) === null || _a === void 0 ? void 0 : _a.length) > 1) {
+    if (((_e_key = e.key) === null || _e_key === void 0 ? void 0 : _e_key.length) > 1) {
       return;
     }
     if (ref.current) {

package/lib/components/MenuItem/useCharacterSearch.js.map

@@ -1 +1 @@
-{"version":3,"names":["useMenuListContext_unstable","useCharacterSearch","state","ref","setFocusByFirstCharacter","context","onKeyDown","originalOnKeyDown","root","e","_a","key","length","current"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItem/useCharacterSearch.ts"],"sourcesContent":["import * as React from 'react';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport type { MenuItemState } from '../../components/index';\nimport type { ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\nexport const useCharacterSearch = (state: MenuItemState, ref: React.RefObject<HTMLElement>) => {\n  const setFocusByFirstCharacter = useMenuListContext_unstable(context => context.setFocusByFirstCharacter);\n\n  const { onKeyDown: originalOnKeyDown } = state.root;\n\n  state.root.onKeyDown = (e: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n    originalOnKeyDown?.(e);\n\n    if (e.key?.length > 1) {\n      return;\n    }\n\n    if (ref.current) {\n      setFocusByFirstCharacter?.(e, ref.current);\n    }\n  };\n\n  return state;\n};\n"],"mappings":"AACA,SAASA,2BAA2B,QAAQ,gCAAgC;AAI5E,OAAO,MAAMC,kBAAkB,GAAGA,CAACC,KAAoB,EAAEC,GAAiC,KAAI;EAC5F,MAAMC,wBAAwB,GAAGJ,2BAA2B,CAACK,OAAO,IAAIA,OAAO,CAACD,wBAAwB,CAAC;EAEzG,MAAM;IAAEE,SAAS,EAAEC;EAAiB,CAAE,GAAGL,KAAK,CAACM,IAAI;EAEnDN,KAAK,CAACM,IAAI,CAACF,SAAS,GAAIG,CAAqD,IAAI;;IAC/EF,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAGE,CAAC,CAAC;IAEtB,IAAI,EAAAC,EAAA,GAAAD,CAAC,CAACE,GAAG,cAAAD,EAAA,uBAAAA,EAAA,CAAEE,MAAM,IAAG,CAAC,EAAE;MACrB;;IAGF,IAAIT,GAAG,CAACU,OAAO,EAAE;MACfT,wBAAwB,aAAxBA,wBAAwB,uBAAxBA,wBAAwB,CAAGK,CAAC,EAAEN,GAAG,CAACU,OAAO,CAAC;;EAE9C,CAAC;EAED,OAAOX,KAAK;AACd,CAAC"}
+{"version":3,"names":["React","useMenuListContext_unstable","useCharacterSearch","state","ref","setFocusByFirstCharacter","context","onKeyDown","originalOnKeyDown","root","e","_e_key","key","length","current"],"sources":["../../../src/components/MenuItem/useCharacterSearch.ts"],"sourcesContent":["import * as React from 'react';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport type { MenuItemState } from '../../components/index';\nimport type { ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\nexport const useCharacterSearch = (state: MenuItemState, ref: React.RefObject<HTMLElement>) => {\n  const setFocusByFirstCharacter = useMenuListContext_unstable(context => context.setFocusByFirstCharacter);\n\n  const { onKeyDown: originalOnKeyDown } = state.root;\n\n  state.root.onKeyDown = (e: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n    originalOnKeyDown?.(e);\n\n    if (e.key?.length > 1) {\n      return;\n    }\n\n    if (ref.current) {\n      setFocusByFirstCharacter?.(e, ref.current);\n    }\n  };\n\n  return state;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,2BAA2B,QAAQ;AAI5C,OAAO,MAAMC,kBAAA,GAAqBA,CAACC,KAAA,EAAsBC,GAAA,KAAsC;EAC7F,MAAMC,wBAAA,GAA2BJ,2BAAA,CAA4BK,OAAA,IAAWA,OAAA,CAAQD,wBAAwB;EAExG,MAAM;IAAEE,SAAA,EAAWC;EAAiB,CAAE,GAAGL,KAAA,CAAMM,IAAI;EAEnDN,KAAA,CAAMM,IAAI,CAACF,SAAS,GAAIG,CAAA,IAA0D;QAG5EC,MAAA;IAFJH,iBAAA,aAAAA,iBAAA,uBAAAA,iBAAA,CAAoBE,CAAA;IAEpB,IAAI,EAAAC,MAAA,GAAAD,CAAA,CAAEE,GAAG,cAALD,MAAA,uBAAAA,MAAA,CAAOE,MAAM,IAAG,GAAG;MACrB;IACF;IAEA,IAAIT,GAAA,CAAIU,OAAO,EAAE;MACfT,wBAAA,aAAAA,wBAAA,uBAAAA,wBAAA,CAA2BK,CAAA,EAAGN,GAAA,CAAIU,OAAO;IAC3C;EACF;EAEA,OAAOX,KAAA;AACT"}

package/lib/components/MenuItem/useMenuItem.js

@@ -49,19 +49,19 @@ export const useMenuItem_unstable = (props, ref) => {
       disabledFocusable: disabled,
       ref: useMergedRefs(ref, innerRef),
       onKeyDown: useEventCallback(event => {
-        var _a;
-        (_a = props.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(props, event);
+        var _props_onKeyDown;
+        (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, event);
         if (!event.isDefaultPrevented() && (event.key === Space || event.key === Enter)) {
           dismissedWithKeyboardRef.current = true;
         }
       }),
       onMouseEnter: useEventCallback(event => {
-        var _a, _b;
-        (_a = innerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        (_b = props.onMouseEnter) === null || _b === void 0 ? void 0 : _b.call(props, event);
+        var _innerRef_current, _props_onMouseEnter;
+        (_innerRef_current = innerRef.current) === null || _innerRef_current === void 0 ? void 0 : _innerRef_current.focus();
+        (_props_onMouseEnter = props.onMouseEnter) === null || _props_onMouseEnter === void 0 ? void 0 : _props_onMouseEnter.call(props, event);
       }),
       onClick: useEventCallback(event => {
-        var _a;
+        var _props_onClick;
         if (!hasSubmenu && !persistOnClick) {
           setOpen(event, {
             open: false,
@@ -72,7 +72,7 @@ export const useMenuItem_unstable = (props, ref) => {
           });
           dismissedWithKeyboardRef.current = false;
         }
-        (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, event);
+        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);
       })
     })),
     icon: resolveShorthand(props.icon, {

package/lib/components/MenuItem/useMenuItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEventCallback","resolveShorthand","useMergedRefs","getNativeElementProps","useFluent_unstable","useFluent","useCharacterSearch","useMenuTriggerContext_unstable","ChevronRightFilled","ChevronRightRegular","ChevronLeftFilled","ChevronLeftRegular","bundleIcon","useMenuListContext_unstable","useMenuContext_unstable","useARIAButtonProps","Enter","Space","ChevronRightIcon","ChevronLeftIcon","useMenuItem_unstable","props","ref","isSubmenuTrigger","persistOnClickContext","context","persistOnItemClick","as","disabled","hasSubmenu","persistOnClick","hasIcons","hasCheckmarks","setOpen","dir","innerRef","useRef","dismissedWithKeyboardRef","state","components","root","icon","checkmark","submenuIndicator","content","secondaryContent","role","disabledFocusable","onKeyDown","event","_a","call","isDefaultPrevented","key","current","onMouseEnter","focus","_b","onClick","open","keyboard","bubble","type","required","defaultProps","children","createElement"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItem/useMenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, resolveShorthand, useMergedRefs, getNativeElementProps } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useCharacterSearch } from './useCharacterSearch';\nimport { useMenuTriggerContext_unstable } from '../../contexts/menuTriggerContext';\nimport {\n  ChevronRightFilled,\n  ChevronRightRegular,\n  ChevronLeftFilled,\n  ChevronLeftRegular,\n  bundleIcon,\n} from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\nimport { ARIAButtonElement, ARIAButtonElementIntersection, useARIAButtonProps } from '@fluentui/react-aria';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\n\nconst ChevronRightIcon = bundleIcon(ChevronRightFilled, ChevronRightRegular);\nconst ChevronLeftIcon = bundleIcon(ChevronLeftFilled, ChevronLeftRegular);\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuItem_unstable = (props: MenuItemProps, ref: React.Ref<ARIAButtonElement<'div'>>): MenuItemState => {\n  const isSubmenuTrigger = useMenuTriggerContext_unstable();\n  const persistOnClickContext = useMenuContext_unstable(context => context.persistOnItemClick);\n  const { as = 'div', disabled = false, hasSubmenu = isSubmenuTrigger, persistOnClick = persistOnClickContext } = props;\n  const hasIcons = useMenuListContext_unstable(context => context.hasIcons);\n  const hasCheckmarks = useMenuListContext_unstable(context => context.hasCheckmarks);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n\n  const { dir } = useFluent();\n  const innerRef = React.useRef<ARIAButtonElementIntersection<'div'>>(null);\n  const dismissedWithKeyboardRef = React.useRef(false);\n\n  const state: MenuItemState = {\n    hasSubmenu,\n    disabled,\n    persistOnClick,\n    components: {\n      root: 'div',\n      icon: 'span',\n      checkmark: 'span',\n      submenuIndicator: 'span',\n      content: 'span',\n      secondaryContent: 'span',\n    },\n    root: getNativeElementProps(\n      as,\n      useARIAButtonProps(as, {\n        role: 'menuitem',\n        ...props,\n        disabled: false,\n        disabledFocusable: disabled,\n        ref: useMergedRefs(ref, innerRef) as React.Ref<ARIAButtonElementIntersection<'div'>>,\n        onKeyDown: useEventCallback(event => {\n          props.onKeyDown?.(event);\n          if (!event.isDefaultPrevented() && (event.key === Space || event.key === Enter)) {\n            dismissedWithKeyboardRef.current = true;\n          }\n        }),\n        onMouseEnter: useEventCallback(event => {\n          innerRef.current?.focus();\n\n          props.onMouseEnter?.(event);\n        }),\n        onClick: useEventCallback(event => {\n          if (!hasSubmenu && !persistOnClick) {\n            setOpen(event, {\n              open: false,\n              keyboard: dismissedWithKeyboardRef.current,\n              bubble: true,\n              type: 'menuItemClick',\n              event,\n            });\n            dismissedWithKeyboardRef.current = false;\n          }\n\n          props.onClick?.(event);\n        }),\n      }),\n    ),\n    icon: resolveShorthand(props.icon, { required: hasIcons }),\n    checkmark: resolveShorthand(props.checkmark, { required: hasCheckmarks }),\n    submenuIndicator: resolveShorthand(props.submenuIndicator, {\n      required: hasSubmenu,\n      defaultProps: {\n        children: dir === 'ltr' ? <ChevronRightIcon /> : <ChevronLeftIcon />,\n      },\n    }),\n    content: resolveShorthand(props.content, {\n      required: !!props.children,\n      defaultProps: { children: props.children },\n    }),\n    secondaryContent: resolveShorthand(props.secondaryContent),\n  };\n  useCharacterSearch(state, innerRef);\n  return state;\n};\n"],"mappings":"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"}
+{"version":3,"names":["React","useEventCallback","resolveShorthand","useMergedRefs","getNativeElementProps","useFluent_unstable","useFluent","useCharacterSearch","useMenuTriggerContext_unstable","ChevronRightFilled","ChevronRightRegular","ChevronLeftFilled","ChevronLeftRegular","bundleIcon","useMenuListContext_unstable","useMenuContext_unstable","useARIAButtonProps","Enter","Space","ChevronRightIcon","ChevronLeftIcon","useMenuItem_unstable","props","ref","isSubmenuTrigger","persistOnClickContext","context","persistOnItemClick","as","disabled","hasSubmenu","persistOnClick","hasIcons","hasCheckmarks","setOpen","dir","innerRef","useRef","dismissedWithKeyboardRef","state","components","root","icon","checkmark","submenuIndicator","content","secondaryContent","role","disabledFocusable","onKeyDown","event","_props_onKeyDown","call","isDefaultPrevented","key","current","onMouseEnter","_innerRef_current","_props_onMouseEnter","focus","onClick","_props_onClick","open","keyboard","bubble","type","required","defaultProps","children","createElement"],"sources":["../../../src/components/MenuItem/useMenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, resolveShorthand, useMergedRefs, getNativeElementProps } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useCharacterSearch } from './useCharacterSearch';\nimport { useMenuTriggerContext_unstable } from '../../contexts/menuTriggerContext';\nimport {\n  ChevronRightFilled,\n  ChevronRightRegular,\n  ChevronLeftFilled,\n  ChevronLeftRegular,\n  bundleIcon,\n} from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\nimport { ARIAButtonElement, ARIAButtonElementIntersection, useARIAButtonProps } from '@fluentui/react-aria';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\n\nconst ChevronRightIcon = bundleIcon(ChevronRightFilled, ChevronRightRegular);\nconst ChevronLeftIcon = bundleIcon(ChevronLeftFilled, ChevronLeftRegular);\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuItem_unstable = (props: MenuItemProps, ref: React.Ref<ARIAButtonElement<'div'>>): MenuItemState => {\n  const isSubmenuTrigger = useMenuTriggerContext_unstable();\n  const persistOnClickContext = useMenuContext_unstable(context => context.persistOnItemClick);\n  const { as = 'div', disabled = false, hasSubmenu = isSubmenuTrigger, persistOnClick = persistOnClickContext } = props;\n  const hasIcons = useMenuListContext_unstable(context => context.hasIcons);\n  const hasCheckmarks = useMenuListContext_unstable(context => context.hasCheckmarks);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n\n  const { dir } = useFluent();\n  const innerRef = React.useRef<ARIAButtonElementIntersection<'div'>>(null);\n  const dismissedWithKeyboardRef = React.useRef(false);\n\n  const state: MenuItemState = {\n    hasSubmenu,\n    disabled,\n    persistOnClick,\n    components: {\n      root: 'div',\n      icon: 'span',\n      checkmark: 'span',\n      submenuIndicator: 'span',\n      content: 'span',\n      secondaryContent: 'span',\n    },\n    root: getNativeElementProps(\n      as,\n      useARIAButtonProps(as, {\n        role: 'menuitem',\n        ...props,\n        disabled: false,\n        disabledFocusable: disabled,\n        ref: useMergedRefs(ref, innerRef) as React.Ref<ARIAButtonElementIntersection<'div'>>,\n        onKeyDown: useEventCallback(event => {\n          props.onKeyDown?.(event);\n          if (!event.isDefaultPrevented() && (event.key === Space || event.key === Enter)) {\n            dismissedWithKeyboardRef.current = true;\n          }\n        }),\n        onMouseEnter: useEventCallback(event => {\n          innerRef.current?.focus();\n\n          props.onMouseEnter?.(event);\n        }),\n        onClick: useEventCallback(event => {\n          if (!hasSubmenu && !persistOnClick) {\n            setOpen(event, {\n              open: false,\n              keyboard: dismissedWithKeyboardRef.current,\n              bubble: true,\n              type: 'menuItemClick',\n              event,\n            });\n            dismissedWithKeyboardRef.current = false;\n          }\n\n          props.onClick?.(event);\n        }),\n      }),\n    ),\n    icon: resolveShorthand(props.icon, { required: hasIcons }),\n    checkmark: resolveShorthand(props.checkmark, { required: hasCheckmarks }),\n    submenuIndicator: resolveShorthand(props.submenuIndicator, {\n      required: hasSubmenu,\n      defaultProps: {\n        children: dir === 'ltr' ? <ChevronRightIcon /> : <ChevronLeftIcon />,\n      },\n    }),\n    content: resolveShorthand(props.content, {\n      required: !!props.children,\n      defaultProps: { children: props.children },\n    }),\n    secondaryContent: resolveShorthand(props.secondaryContent),\n  };\n  useCharacterSearch(state, innerRef);\n  return state;\n};\n"],"mappings":"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"}

package/lib/components/MenuItem/useMenuItemStyles.js

@@ -105,13 +105,26 @@ const useStyles = /*#__PURE__*/__styles({
     Bk3fhr4: "f19vpps7",
     Bmfj8id: "fv5swzo",
     Bg7n49j: "f1q1x1ba",
-    t0hwav: "ft33916"
+    t0hwav: "ft33916",
+    Bbusuzp: "f1dcs8yz",
+    ze5xyy: "f1kc2mi9",
+    Bctn1xl: "fk56vqo",
+    Bh6z0a4: "f1ikwg0d"
   }
 }, {
   f: [".ftqa4ok:focus{outline-style:none;}", ".fc1cou1:focus{color:var(--colorNeutralForeground3Hover);}", ".ft33916:focus{color:var(--colorNeutralForegroundDisabled);}"],
   i: [".f2hkw1w:focus-visible{outline-style:none;}"],
   d: [".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".fdiulkx[data-fui-focus-visible]::after{top:-2px;}", ".f1yalx80[data-fui-focus-visible]::after{bottom:-2px;}", ".fq22d5a[data-fui-focus-visible]::after{left:-2px;}", ".f1jw7pan[data-fui-focus-visible]::after{right:-2px;}", ".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);}", ".f10pi13n{position:relative;}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f81rol6{padding-right:10px;}", ".frdkuqy{padding-left:10px;}", ".f1d2rq10{height:32px;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1k6fduh{cursor:pointer;}", ".f1q8lukm{-webkit-column-gap:4px;column-gap:4px;}", ".f1ma2n7n{row-gap:4px;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f161knb0{padding-left:2px;}", ".f12huiiw{padding-right:2px;}", ".f3rmtva{background-color:transparent;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f64fuq3{width:20px;}", ".fjamq6b{height:20px;}", ".fe5j1ua{font-size:20px;}", ".fez10in{line-height:0;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}"],
-  h: [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".ft1hn21:hover .fui-Icon-filled{display:inline;}", ".fuxngvv:hover .fui-Icon-regular{display:none;}", ".fp258yr:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".f1jp5ecu:hover{color:var(--colorNeutralForeground3Hover);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}", ".f19vpps7:hover .fui-Icon-filled{display:none;}", ".fv5swzo:hover .fui-Icon-regular{display:inline;}", ".f1q1x1ba:hover .fui-MenuItem__icon{color:var(--colorNeutralForegroundDisabled);}"]
+  h: [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".ft1hn21:hover .fui-Icon-filled{display:inline;}", ".fuxngvv:hover .fui-Icon-regular{display:none;}", ".fp258yr:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".f1jp5ecu:hover{color:var(--colorNeutralForeground3Hover);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}", ".f19vpps7:hover .fui-Icon-filled{display:none;}", ".fv5swzo:hover .fui-Icon-regular{display:inline;}", ".f1q1x1ba:hover .fui-MenuItem__icon{color:var(--colorNeutralForegroundDisabled);}"],
+  m: [["@media (forced-colors: active){.f1dcs8yz{color:GrayText;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.f1kc2mi9:hover{color:GrayText;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.fk56vqo:hover .fui-MenuItem__icon{color:GrayText;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.f1ikwg0d:focus{color:GrayText;}}", {
+    m: "(forced-colors: active)"
+  }]]
 });
 /** Applies style classnames to slots */
 export const useMenuItemStyles_unstable = state => {

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

@@ -1 +1 @@
-{"version":3,"names":["mergeClasses","__styles","shorthands","iconFilledClassName","iconRegularClassName","createFocusOutlineStyle","tokens","useCheckmarkStyles_unstable","menuItemClassNames","root","icon","checkmark","submenuIndicator","content","secondaryContent","useStyles","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bjwuhne","Ghsupd","Bule8hv","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","qhf8xq","sj55zd","De3pzq","z189sj","uwmqm3","Bqenvij","mc9l5x","Bt984gj","Be2twd7","Bceei9c","i8kkvl","Belr9w4","Jwef8y","Bi91k9c","Bk3fhr4","Bmfj8id","Bg7n49j","famaaq","Bh6795r","t0hwav","a9b677","Bg96gwp","Brf1p80","disabled","f","i","d","h","useMenuItemStyles_unstable","state","styles","className"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItem/useMenuItemStyles.ts"],"sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport type { MenuItemCheckboxState } from '../MenuItemCheckbox/index';\nimport type { MenuItemSlots, MenuItemState } from './MenuItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuItemClassNames: SlotClassNames<MenuItemSlots> = {\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};\n\nconst useStyles = makeStyles({\n  focusIndicator: createFocusOutlineStyle(),\n  // TODO: this should be extracted to another package\n  root: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    position: 'relative',\n    color: tokens.colorNeutralForeground2,\n    backgroundColor: tokens.colorNeutralBackground1,\n    paddingRight: '10px',\n    paddingLeft: '10px',\n    height: '32px',\n    display: 'flex',\n    alignItems: 'center',\n    fontSize: tokens.fontSizeBase300,\n    cursor: 'pointer',\n    ...shorthands.gap('4px'),\n\n    ':hover': {\n      backgroundColor: tokens.colorNeutralBackground1Hover,\n      color: tokens.colorNeutralForeground2Hover,\n\n      [`& .${iconFilledClassName}`]: {\n        display: 'inline',\n      },\n      [`& .${iconRegularClassName}`]: {\n        display: 'none',\n      },\n      [`& .${menuItemClassNames.icon}`]: {\n        color: tokens.colorNeutralForeground2BrandSelected,\n      },\n    },\n\n    userSelect: 'none',\n  },\n  content: {\n    paddingLeft: '2px',\n    paddingRight: '2px',\n    backgroundColor: 'transparent',\n    flexGrow: 1,\n  },\n  secondaryContent: {\n    paddingLeft: '2px',\n    paddingRight: '2px',\n    color: tokens.colorNeutralForeground3,\n    ':hover': {\n      color: tokens.colorNeutralForeground3Hover,\n    },\n    ':focus': {\n      color: tokens.colorNeutralForeground3Hover,\n    },\n  },\n  icon: {\n    width: '20px',\n    height: '20px',\n    fontSize: '20px',\n    lineHeight: 0,\n    alignItems: 'center',\n    display: 'inline-flex',\n    justifyContent: 'center',\n  },\n  submenuIndicator: {\n    width: '20px',\n    height: '20px',\n    fontSize: '20px',\n    lineHeight: 0,\n    alignItems: 'center',\n    display: 'inline-flex',\n    justifyContent: 'center',\n  },\n  disabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':hover': {\n      color: tokens.colorNeutralForegroundDisabled,\n      [`& .${iconFilledClassName}`]: {\n        display: 'none',\n      },\n      [`& .${iconRegularClassName}`]: {\n        display: 'inline',\n      },\n      [`& .${menuItemClassNames.icon}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n      },\n    },\n\n    ':focus': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = (state: MenuItemState) => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    menuItemClassNames.root,\n    styles.root,\n    styles.focusIndicator,\n    state.disabled && styles.disabled,\n    state.root.className,\n  );\n\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemClassNames.content, styles.content, state.content.className);\n  }\n\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, state.checkmark.className);\n  }\n\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(\n      menuItemClassNames.secondaryContent,\n      !state.disabled && styles.secondaryContent,\n      state.secondaryContent.className,\n    );\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemClassNames.icon, styles.icon, state.icon.className);\n  }\n\n  if (state.submenuIndicator) {\n    state.submenuIndicator.className = mergeClasses(\n      menuItemClassNames.submenuIndicator,\n      styles.submenuIndicator,\n      state.submenuIndicator.className,\n    );\n  }\n  useCheckmarkStyles_unstable(state as MenuItemCheckboxState);\n};\n"],"mappings":"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"}
+{"version":3,"names":["mergeClasses","__styles","shorthands","iconFilledClassName","iconRegularClassName","createFocusOutlineStyle","tokens","useCheckmarkStyles_unstable","menuItemClassNames","root","icon","checkmark","submenuIndicator","content","secondaryContent","useStyles","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bjwuhne","Ghsupd","Bule8hv","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","qhf8xq","sj55zd","De3pzq","z189sj","uwmqm3","Bqenvij","mc9l5x","Bt984gj","Be2twd7","Bceei9c","i8kkvl","Belr9w4","Jwef8y","Bi91k9c","Bk3fhr4","Bmfj8id","Bg7n49j","famaaq","Bh6795r","t0hwav","a9b677","Bg96gwp","Brf1p80","disabled","Bbusuzp","ze5xyy","Bctn1xl","Bh6z0a4","f","i","d","h","m","useMenuItemStyles_unstable","state","styles","className"],"sources":["../../../src/components/MenuItem/useMenuItemStyles.ts"],"sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport type { MenuItemCheckboxState } from '../MenuItemCheckbox/index';\nimport type { MenuItemSlots, MenuItemState } from './MenuItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuItemClassNames: SlotClassNames<MenuItemSlots> = {\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};\n\nconst useStyles = makeStyles({\n  focusIndicator: createFocusOutlineStyle(),\n  // TODO: this should be extracted to another package\n  root: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    position: 'relative',\n    color: tokens.colorNeutralForeground2,\n    backgroundColor: tokens.colorNeutralBackground1,\n    paddingRight: '10px',\n    paddingLeft: '10px',\n    height: '32px',\n    display: 'flex',\n    alignItems: 'center',\n    fontSize: tokens.fontSizeBase300,\n    cursor: 'pointer',\n    ...shorthands.gap('4px'),\n\n    ':hover': {\n      backgroundColor: tokens.colorNeutralBackground1Hover,\n      color: tokens.colorNeutralForeground2Hover,\n\n      [`& .${iconFilledClassName}`]: {\n        display: 'inline',\n      },\n      [`& .${iconRegularClassName}`]: {\n        display: 'none',\n      },\n      [`& .${menuItemClassNames.icon}`]: {\n        color: tokens.colorNeutralForeground2BrandSelected,\n      },\n    },\n\n    userSelect: 'none',\n  },\n  content: {\n    paddingLeft: '2px',\n    paddingRight: '2px',\n    backgroundColor: 'transparent',\n    flexGrow: 1,\n  },\n  secondaryContent: {\n    paddingLeft: '2px',\n    paddingRight: '2px',\n    color: tokens.colorNeutralForeground3,\n    ':hover': {\n      color: tokens.colorNeutralForeground3Hover,\n    },\n    ':focus': {\n      color: tokens.colorNeutralForeground3Hover,\n    },\n  },\n  icon: {\n    width: '20px',\n    height: '20px',\n    fontSize: '20px',\n    lineHeight: 0,\n    alignItems: 'center',\n    display: 'inline-flex',\n    justifyContent: 'center',\n  },\n  submenuIndicator: {\n    width: '20px',\n    height: '20px',\n    fontSize: '20px',\n    lineHeight: 0,\n    alignItems: 'center',\n    display: 'inline-flex',\n    justifyContent: 'center',\n  },\n  disabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':hover': {\n      color: tokens.colorNeutralForegroundDisabled,\n      [`& .${iconFilledClassName}`]: {\n        display: 'none',\n      },\n      [`& .${iconRegularClassName}`]: {\n        display: 'inline',\n      },\n      [`& .${menuItemClassNames.icon}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n      },\n    },\n\n    ':focus': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n\n    '@media (forced-colors: active)': {\n      color: 'GrayText',\n      ':hover': {\n        color: 'GrayText',\n        [`& .${menuItemClassNames.icon}`]: {\n          color: 'GrayText',\n        },\n      },\n      ':focus': {\n        color: 'GrayText',\n      },\n    },\n  },\n});\n\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = (state: MenuItemState) => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    menuItemClassNames.root,\n    styles.root,\n    styles.focusIndicator,\n    state.disabled && styles.disabled,\n    state.root.className,\n  );\n\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemClassNames.content, styles.content, state.content.className);\n  }\n\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, state.checkmark.className);\n  }\n\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(\n      menuItemClassNames.secondaryContent,\n      !state.disabled && styles.secondaryContent,\n      state.secondaryContent.className,\n    );\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemClassNames.icon, styles.icon, state.icon.className);\n  }\n\n  if (state.submenuIndicator) {\n    state.submenuIndicator.className = mergeClasses(\n      menuItemClassNames.submenuIndicator,\n      styles.submenuIndicator,\n      state.submenuIndicator.className,\n    );\n  }\n  useCheckmarkStyles_unstable(state as MenuItemCheckboxState);\n};\n"],"mappings":"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"}

package/lib/components/MenuItemCheckbox/MenuItemCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMenuItemCheckbox_unstable","renderMenuItemCheckbox_unstable","useMenuItemCheckboxStyles_unstable","useCustomStyleHooks_unstable","MenuItemCheckbox","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/MenuItemCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuItemCheckbox_unstable } from './useMenuItemCheckbox';\nimport { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';\nimport { useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles';\nimport type { MenuItemCheckboxProps } from './MenuItemCheckbox.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuItemCheckbox, using the `useMenuItemCheckbox_unstable` hook.\n */\nexport const MenuItemCheckbox: ForwardRefComponent<MenuItemCheckboxProps> = React.forwardRef((props, ref) => {\n  const state = useMenuItemCheckbox_unstable(props, ref);\n\n  useMenuItemCheckboxStyles_unstable(state);\n\n  const { useMenuItemCheckboxStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuItemCheckbox_unstable(state);\n});\n\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,4BAA4B,QAAQ,uBAAuB;AACpE,SAASC,+BAA+B,QAAQ,0BAA0B;AAC1E,SAASC,kCAAkC,QAAQ,6BAA6B;AAGhF,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,gBAAgB,gBAA+CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC1G,MAAMC,KAAK,GAAGR,4BAA4B,CAACM,KAAK,EAAEC,GAAG,CAAC;EAEtDL,kCAAkC,CAACM,KAAK,CAAC;EAEzC,MAAM;IAAEN,kCAAkC,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EAC9FM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOP,+BAA+B,CAACO,KAAK,CAAC;AAC/C,CAAC,CAAC;AAEFJ,gBAAgB,CAACM,WAAW,GAAG,kBAAkB"}
+{"version":3,"names":["React","useMenuItemCheckbox_unstable","renderMenuItemCheckbox_unstable","useMenuItemCheckboxStyles_unstable","useCustomStyleHooks_unstable","MenuItemCheckbox","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/MenuItemCheckbox/MenuItemCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuItemCheckbox_unstable } from './useMenuItemCheckbox';\nimport { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';\nimport { useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles';\nimport type { MenuItemCheckboxProps } from './MenuItemCheckbox.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuItemCheckbox, using the `useMenuItemCheckbox_unstable` hook.\n */\nexport const MenuItemCheckbox: ForwardRefComponent<MenuItemCheckboxProps> = React.forwardRef((props, ref) => {\n  const state = useMenuItemCheckbox_unstable(props, ref);\n\n  useMenuItemCheckboxStyles_unstable(state);\n\n  const { useMenuItemCheckboxStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuItemCheckbox_unstable(state);\n});\n\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,+BAA+B,QAAQ;AAChD,SAASC,kCAAkC,QAAQ;AAGnD,SAASC,4BAA4B,QAAQ;AAE7C;;;AAGA,OAAO,MAAMC,gBAAA,gBAA+DL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EAC3G,MAAMC,KAAA,GAAQR,4BAAA,CAA6BM,KAAA,EAAOC,GAAA;EAElDL,kCAAA,CAAmCM,KAAA;EAEnC,MAAM;IAAEN,kCAAA,EAAoCO;EAAe,CAAE,GAAGN,4BAAA;EAChEM,eAAA,CAAgBD,KAAA;EAEhB,OAAOP,+BAAA,CAAgCO,KAAA;AACzC;AAEAJ,gBAAA,CAAiBM,WAAW,GAAG"}

package/lib/components/MenuItemCheckbox/MenuItemCheckbox.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItemCheckbox.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuItemCheckbox/MenuItemCheckbox.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { MenuItemSelectableProps, MenuItemSelectableState } from '../../selectable/index';\nimport type { MenuItemProps, MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemCheckboxProps = MenuItemProps & MenuItemSelectableProps;\n\nexport type MenuItemCheckboxState = MenuItemState & MenuItemSelectableState;\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/MenuItemCheckbox/MenuItemCheckbox.types.ts"],"sourcesContent":["import type { MenuItemSelectableProps, MenuItemSelectableState } from '../../selectable/index';\nimport type { MenuItemProps, MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemCheckboxProps = MenuItemProps & MenuItemSelectableProps;\n\nexport type MenuItemCheckboxState = MenuItemState & MenuItemSelectableState;\n"],"mappings":"AAAA"}

package/lib/components/MenuItemCheckbox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuItemCheckbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC","sourcesContent":["export * from './MenuItemCheckbox.types';\nexport * from './MenuItemCheckbox';\nexport * from './renderMenuItemCheckbox';\nexport * from './useMenuItemCheckbox';\nexport * from './useMenuItemCheckboxStyles';\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/MenuItemCheckbox/index.ts"],"sourcesContent":["export * from './MenuItemCheckbox.types';\nexport * from './MenuItemCheckbox';\nexport * from './renderMenuItemCheckbox';\nexport * from './useMenuItemCheckbox';\nexport * from './useMenuItemCheckboxStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js

@@ -6,16 +6,6 @@ export const renderMenuItemCheckbox_unstable = state => {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  }, slots.checkmark && /*#__PURE__*/React.createElement(slots.checkmark, {
-    ...slotProps.checkmark
-  }), slots.icon && /*#__PURE__*/React.createElement(slots.icon, {
-    ...slotProps.icon
-  }), slots.content && /*#__PURE__*/React.createElement(slots.content, {
-    ...slotProps.content
-  }), slots.secondaryContent && /*#__PURE__*/React.createElement(slots.secondaryContent, {
-    ...slotProps.secondaryContent
-  }));
+  return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.checkmark && /*#__PURE__*/React.createElement(slots.checkmark, slotProps.checkmark), slots.icon && /*#__PURE__*/React.createElement(slots.icon, slotProps.icon), slots.content && /*#__PURE__*/React.createElement(slots.content, slotProps.content), slots.secondaryContent && /*#__PURE__*/React.createElement(slots.secondaryContent, slotProps.secondaryContent));
 };
 //# sourceMappingURL=renderMenuItemCheckbox.js.map

package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getSlots","renderMenuItemCheckbox_unstable","state","slots","slotProps","createElement","root","checkmark","icon","content","secondaryContent"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/renderMenuItemCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { MenuItemSlots } from '../MenuItem/MenuItem.types';\n\n/** Function that renders the final JSX of the component  */\nexport const renderMenuItemCheckbox_unstable = (state: MenuItemCheckboxState) => {\n  const { slots, slotProps } = getSlots<MenuItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.checkmark && <slots.checkmark {...slotProps.checkmark} />}\n      {slots.icon && <slots.icon {...slotProps.icon} />}\n      {slots.content && <slots.content {...slotProps.content} />}\n      {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAIpD;AACA,OAAO,MAAMC,+BAA+B,GAAIC,KAA4B,IAAI;EAC9E,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAgBE,KAAK,CAAC;EAE3D,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,GAC3BH,KAAK,CAACI,SAAS,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACI,SAAS;IAAA,GAAKH,SAAS,CAACG;EAAS,EAAI,EAC/DJ,KAAK,CAACK,IAAI,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,EAChDL,KAAK,CAACM,OAAO,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACM,OAAO;IAAA,GAAKL,SAAS,CAACK;EAAO,EAAI,EACzDN,KAAK,CAACO,gBAAgB,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACO,gBAAgB;IAAA,GAAKN,SAAS,CAACM;EAAgB,EAAI,CAC1E;AAEjB,CAAC"}
+{"version":3,"names":["React","getSlots","renderMenuItemCheckbox_unstable","state","slots","slotProps","createElement","root","checkmark","icon","content","secondaryContent"],"sources":["../../../src/components/MenuItemCheckbox/renderMenuItemCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { MenuItemSlots } from '../MenuItem/MenuItem.types';\n\n/** Function that renders the final JSX of the component  */\nexport const renderMenuItemCheckbox_unstable = (state: MenuItemCheckboxState) => {\n  const { slots, slotProps } = getSlots<MenuItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.checkmark && <slots.checkmark {...slotProps.checkmark} />}\n      {slots.icon && <slots.icon {...slotProps.icon} />}\n      {slots.content && <slots.content {...slotProps.content} />}\n      {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAIzB;AACA,OAAO,MAAMC,+BAAA,GAAmCC,KAAA,IAAiC;EAC/E,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAAwBE,KAAA;EAErD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,EAC3BH,KAAA,CAAMI,SAAS,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMI,SAAS,EAAKH,SAAA,CAAUG,SAAS,GAC3DJ,KAAA,CAAMK,IAAI,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI,GAC5CL,KAAA,CAAMM,OAAO,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMM,OAAO,EAAKL,SAAA,CAAUK,OAAO,GACrDN,KAAA,CAAMO,gBAAgB,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMO,gBAAgB,EAAKN,SAAA,CAAUM,gBAAgB;AAGvF"}

package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js

@@ -11,8 +11,8 @@ export const useMenuItemCheckbox_unstable = (props, ref) => {
     value
   } = props;
   const checked = useMenuListContext_unstable(context => {
-    var _a;
-    const checkedItems = ((_a = context.checkedValues) === null || _a === void 0 ? void 0 : _a[name]) || [];
+    var _context_checkedValues;
+    const checkedItems = ((_context_checkedValues = context.checkedValues) === null || _context_checkedValues === void 0 ? void 0 : _context_checkedValues[name]) || [];
     return checkedItems.indexOf(value) !== -1;
   });
   const state = {
@@ -28,9 +28,9 @@ export const useMenuItemCheckbox_unstable = (props, ref) => {
         required: true
       }),
       onClick: e => {
-        var _a;
+        var _props_onClick;
         toggleCheckbox === null || toggleCheckbox === void 0 ? void 0 : toggleCheckbox(e, name, value, checked);
-        (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);
       }
     }, ref),
     name,

package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","resolveShorthand","Checkmark16Filled","useMenuListContext_unstable","useMenuItem_unstable","useMenuItemCheckbox_unstable","props","ref","toggleCheckbox","context","name","value","checked","checkedItems","_a","checkedValues","indexOf","state","role","persistOnClick","checkmark","defaultProps","children","createElement","required","onClick","e","call"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/useMenuItemCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { Checkmark16Filled } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuItem_unstable } from '../MenuItem/useMenuItem';\nimport type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\n/** Returns the props and state required to render the component */\nexport const useMenuItemCheckbox_unstable = (\n  props: MenuItemCheckboxProps,\n  ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemCheckboxState => {\n  const toggleCheckbox = useMenuListContext_unstable(context => context.toggleCheckbox);\n  const { name, value } = props;\n\n  const checked = useMenuListContext_unstable(context => {\n    const checkedItems = context.checkedValues?.[name] || [];\n    return checkedItems.indexOf(value) !== -1;\n  });\n\n  const state: MenuItemCheckboxState = {\n    ...useMenuItem_unstable(\n      {\n        role: 'menuitemcheckbox',\n        persistOnClick: true,\n        ...props,\n        'aria-checked': checked,\n        checkmark: resolveShorthand(props.checkmark, {\n          defaultProps: { children: <Checkmark16Filled /> },\n          required: true,\n        }),\n        onClick: (e: React.MouseEvent<ARIAButtonElementIntersection<'div'>>) => {\n          toggleCheckbox?.(e, name, value, checked);\n          props.onClick?.(e);\n        },\n      },\n      ref,\n    ),\n    name,\n    value,\n    checked,\n  };\n\n  return state;\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,2BAA2B;AAC5D,SAASC,iBAAiB,QAAQ,uBAAuB;AACzD,SAASC,2BAA2B,QAAQ,gCAAgC;AAC5E,SAASC,oBAAoB,QAAQ,yBAAyB;AAI9D;AACA,OAAO,MAAMC,4BAA4B,GAAGA,CAC1CC,KAA4B,EAC5BC,GAAwC,KACf;EACzB,MAAMC,cAAc,GAAGL,2BAA2B,CAACM,OAAO,IAAIA,OAAO,CAACD,cAAc,CAAC;EACrF,MAAM;IAAEE,IAAI;IAAEC;EAAK,CAAE,GAAGL,KAAK;EAE7B,MAAMM,OAAO,GAAGT,2BAA2B,CAACM,OAAO,IAAG;;IACpD,MAAMI,YAAY,GAAG,EAAAC,EAAA,GAAAL,OAAO,CAACM,aAAa,cAAAD,EAAA,uBAAAA,EAAA,CAAGJ,IAAI,CAAC,KAAI,EAAE;IACxD,OAAOG,YAAY,CAACG,OAAO,CAACL,KAAK,CAAC,KAAK,CAAC,CAAC;EAC3C,CAAC,CAAC;EAEF,MAAMM,KAAK,GAA0B;IACnC,GAAGb,oBAAoB,CACrB;MACEc,IAAI,EAAE,kBAAkB;MACxBC,cAAc,EAAE,IAAI;MACpB,GAAGb,KAAK;MACR,cAAc,EAAEM,OAAO;MACvBQ,SAAS,EAAEnB,gBAAgB,CAACK,KAAK,CAACc,SAAS,EAAE;QAC3CC,YAAY,EAAE;UAAEC,QAAQ,eAAEtB,KAAA,CAAAuB,aAAA,CAACrB,iBAAiB;QAAG,CAAE;QACjDsB,QAAQ,EAAE;OACX,CAAC;MACFC,OAAO,EAAGC,CAAyD,IAAI;;QACrElB,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAGkB,CAAC,EAAEhB,IAAI,EAAEC,KAAK,EAAEC,OAAO,CAAC;QACzC,CAAAE,EAAA,GAAAR,KAAK,CAACmB,OAAO,cAAAX,EAAA,uBAAAA,EAAA,CAAAa,IAAA,CAAbrB,KAAK,EAAWoB,CAAC,CAAC;MACpB;KACD,EACDnB,GAAG,CACJ;IACDG,IAAI;IACJC,KAAK;IACLC;GACD;EAED,OAAOK,KAAK;AACd,CAAC"}
+{"version":3,"names":["React","resolveShorthand","Checkmark16Filled","useMenuListContext_unstable","useMenuItem_unstable","useMenuItemCheckbox_unstable","props","ref","toggleCheckbox","context","name","value","checked","_context_checkedValues","checkedItems","checkedValues","indexOf","state","role","persistOnClick","checkmark","defaultProps","children","createElement","required","onClick","e","_props_onClick","call"],"sources":["../../../src/components/MenuItemCheckbox/useMenuItemCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { Checkmark16Filled } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuItem_unstable } from '../MenuItem/useMenuItem';\nimport type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\n/** Returns the props and state required to render the component */\nexport const useMenuItemCheckbox_unstable = (\n  props: MenuItemCheckboxProps,\n  ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemCheckboxState => {\n  const toggleCheckbox = useMenuListContext_unstable(context => context.toggleCheckbox);\n  const { name, value } = props;\n\n  const checked = useMenuListContext_unstable(context => {\n    const checkedItems = context.checkedValues?.[name] || [];\n    return checkedItems.indexOf(value) !== -1;\n  });\n\n  const state: MenuItemCheckboxState = {\n    ...useMenuItem_unstable(\n      {\n        role: 'menuitemcheckbox',\n        persistOnClick: true,\n        ...props,\n        'aria-checked': checked,\n        checkmark: resolveShorthand(props.checkmark, {\n          defaultProps: { children: <Checkmark16Filled /> },\n          required: true,\n        }),\n        onClick: (e: React.MouseEvent<ARIAButtonElementIntersection<'div'>>) => {\n          toggleCheckbox?.(e, name, value, checked);\n          props.onClick?.(e);\n        },\n      },\n      ref,\n    ),\n    name,\n    value,\n    checked,\n  };\n\n  return state;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,gBAAgB,QAAQ;AACjC,SAASC,iBAAiB,QAAQ;AAClC,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,oBAAoB,QAAQ;AAIrC;AACA,OAAO,MAAMC,4BAAA,GAA+BA,CAC1CC,KAAA,EACAC,GAAA,KAC0B;EAC1B,MAAMC,cAAA,GAAiBL,2BAAA,CAA4BM,OAAA,IAAWA,OAAA,CAAQD,cAAc;EACpF,MAAM;IAAEE,IAAA;IAAMC;EAAK,CAAE,GAAGL,KAAA;EAExB,MAAMM,OAAA,GAAUT,2BAAA,CAA4BM,OAAA,IAAW;QAChCI,sBAAA;IAArB,MAAMC,YAAA,GAAe,EAAAD,sBAAA,GAAAJ,OAAA,CAAQM,aAAa,cAArBF,sBAAA,uBAAAA,sBAAuB,CAACH,IAAA,CAAK,KAAI,EAAE;IACxD,OAAOI,YAAA,CAAaE,OAAO,CAACL,KAAA,MAAW,CAAC;EAC1C;EAEA,MAAMM,KAAA,GAA+B;IACnC,GAAGb,oBAAA,CACD;MACEc,IAAA,EAAM;MACNC,cAAA,EAAgB,IAAI;MACpB,GAAGb,KAAK;MACR,gBAAgBM,OAAA;MAChBQ,SAAA,EAAWnB,gBAAA,CAAiBK,KAAA,CAAMc,SAAS,EAAE;QAC3CC,YAAA,EAAc;UAAEC,QAAA,eAAUtB,KAAA,CAAAuB,aAAA,CAACrB,iBAAA;QAAqB;QAChDsB,QAAA,EAAU;MACZ;MACAC,OAAA,EAAUC,CAAA,IAA8D;YAEtEC,cAAA;QADAnB,cAAA,aAAAA,cAAA,uBAAAA,cAAA,CAAiBkB,CAAA,EAAGhB,IAAA,EAAMC,KAAA,EAAOC,OAAA;QACjC,CAAAe,cAAA,GAAArB,KAAA,CAAMmB,OAAO,cAAbE,cAAA,uBAAAA,cAAA,CAAAC,IAAA,CAAAtB,KAAA,EAAgBoB,CAAA;MAClB;IACF,GACAnB,GAAA,CACD;IACDG,IAAA;IACAC,KAAA;IACAC;EACF;EAEA,OAAOK,KAAA;AACT"}