@fluentui/react-menu 0.0.0-nightly-20250930-0405.1 → 0.0.0-nightly-20251002-0406.1

package/lib/components/MenuList/useMenuList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuList/useMenuList.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  useMergedRefs,\n  useEventCallback,\n  useControllableState,\n  getIntrinsicElementProps,\n  slot,\n} from '@fluentui/react-utilities';\nimport {\n  useArrowNavigationGroup,\n  useFocusFinders,\n  TabsterMoveFocusEventName,\n  type TabsterMoveFocusEvent,\n} from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MenuContext } from '../../contexts/menuContext';\nimport type { MenuListProps, MenuListState } from './MenuList.types';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuList_unstable = (props: MenuListProps, ref: React.Ref<HTMLElement>): MenuListState => {\n  const { findAllFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent();\n  const menuContext = useMenuContextSelectors();\n  const hasMenuContext = useHasParentContext(MenuContext);\n  const focusAttributes = useArrowNavigationGroup({ circular: true });\n\n  if (usingPropsAndMenuContext(props, menuContext, hasMenuContext)) {\n    // TODO throw warnings in development safely\n    // eslint-disable-next-line no-console\n    console.warn('You are using both MenuList and Menu props, we recommend you to use Menu props when available');\n  }\n\n  const innerRef = React.useRef<HTMLElement>(null);\n  const validateNestingRef = useValidateNesting('MenuList');\n\n  React.useEffect(() => {\n    const element = innerRef.current;\n\n    if (hasMenuContext && targetDocument && element) {\n      const onTabsterMoveFocus = (e: TabsterMoveFocusEvent) => {\n        const nextElement = e.detail.next;\n\n        if (nextElement && element.contains(targetDocument.activeElement) && !element.contains(nextElement)) {\n          // Preventing Tabster from handling Tab press, useMenuPopover will handle it.\n          e.preventDefault();\n        }\n      };\n\n      targetDocument.addEventListener(TabsterMoveFocusEventName, onTabsterMoveFocus);\n\n      return () => {\n        targetDocument.removeEventListener(TabsterMoveFocusEventName, onTabsterMoveFocus);\n      };\n    }\n  }, [innerRef, targetDocument, hasMenuContext]);\n\n  const setFocusByFirstCharacter = React.useCallback(\n    (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => {\n      // TODO use some kind of children registration to reduce dependency on DOM roles\n      const acceptedRoles = ['menuitem', 'menuitemcheckbox', 'menuitemradio'];\n      if (!innerRef.current) {\n        return;\n      }\n\n      const menuItems = findAllFocusable(\n        innerRef.current,\n        (el: HTMLElement) => el.hasAttribute('role') && acceptedRoles.indexOf(el.getAttribute('role')!) !== -1,\n      );\n\n      let startIndex = menuItems.indexOf(itemEl) + 1;\n      if (startIndex === menuItems.length) {\n        startIndex = 0;\n      }\n\n      const firstChars = menuItems.map(menuItem => menuItem.textContent?.charAt(0).toLowerCase());\n      const char = e.key.toLowerCase();\n\n      const getIndexFirstChars = (start: number, firstChar: string) => {\n        for (let i = start; i < firstChars.length; i++) {\n          if (char === firstChars[i]) {\n            return i;\n          }\n        }\n        return -1;\n      };\n\n      // Check remaining slots in the menu\n      let index = getIndexFirstChars(startIndex, char);\n\n      // If not found in remaining slots, check from beginning\n      if (index === -1) {\n        index = getIndexFirstChars(0, char);\n      }\n\n      // If match was found...\n      if (index > -1) {\n        menuItems[index].focus();\n      }\n    },\n    [findAllFocusable],\n  );\n\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues ?? (hasMenuContext ? menuContext.checkedValues : undefined),\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n\n  const handleCheckedValueChange =\n    props.onCheckedValueChange ?? (hasMenuContext ? menuContext.onCheckedValueChange : undefined);\n\n  const toggleCheckbox = useEventCallback(\n    (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked: boolean) => {\n      const checkedItems = checkedValues?.[name] || [];\n      const newCheckedItems = [...checkedItems];\n      if (checked) {\n        newCheckedItems.splice(newCheckedItems.indexOf(value), 1);\n      } else {\n        newCheckedItems.push(value);\n      }\n\n      handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n      setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n    },\n  );\n\n  const selectRadio = useEventCallback((e: React.MouseEvent | React.KeyboardEvent, name: string, value: string) => {\n    const newCheckedItems = [value];\n    setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n    handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n  });\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: useMergedRefs(ref, innerRef, validateNestingRef) as React.Ref<HTMLDivElement>,\n        role: 'menu',\n        'aria-labelledby': menuContext.triggerId,\n        ...focusAttributes,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    hasIcons: menuContext.hasIcons || false,\n    hasCheckmarks: menuContext.hasCheckmarks || false,\n    checkedValues,\n    hasMenuContext,\n    setFocusByFirstCharacter,\n    selectRadio,\n    toggleCheckbox,\n  };\n};\n\n/**\n * Adds some sugar to fetching multiple context selector values\n */\nconst useMenuContextSelectors = () => {\n  const checkedValues = useMenuContext_unstable(context => context.checkedValues);\n  const onCheckedValueChange = useMenuContext_unstable(context => context.onCheckedValueChange);\n  const triggerId = useMenuContext_unstable(context => context.triggerId);\n  const hasIcons = useMenuContext_unstable(context => context.hasIcons);\n  const hasCheckmarks = useMenuContext_unstable(context => context.hasCheckmarks);\n\n  return {\n    checkedValues,\n    onCheckedValueChange,\n    triggerId,\n    hasIcons,\n    hasCheckmarks,\n  };\n};\n\n/**\n * Helper function to detect if props and MenuContext values are both used\n */\nconst usingPropsAndMenuContext = (\n  props: MenuListProps,\n  contextValue: ReturnType<typeof useMenuContextSelectors>,\n  hasMenuContext: boolean,\n) => {\n  let isUsingPropsAndContext = false;\n  for (const val in contextValue) {\n    if (props[val as keyof Omit<typeof contextValue, 'hasMenuContext' | 'onCheckedValueChange' | 'triggerId'>]) {\n      isUsingPropsAndContext = true;\n    }\n  }\n\n  return hasMenuContext && isUsingPropsAndContext;\n};\n"],"names":["React","useMergedRefs","useEventCallback","useControllableState","getIntrinsicElementProps","slot","useArrowNavigationGroup","useFocusFinders","TabsterMoveFocusEventName","useFluent_unstable","useFluent","useHasParentContext","useMenuContext_unstable","MenuContext","useValidateNesting","useMenuList_unstable","props","ref","findAllFocusable","targetDocument","menuContext","useMenuContextSelectors","hasMenuContext","focusAttributes","circular","usingPropsAndMenuContext","console","warn","innerRef","useRef","validateNestingRef","useEffect","element","current","onTabsterMoveFocus","e","nextElement","detail","next","contains","activeElement","preventDefault","addEventListener","removeEventListener","setFocusByFirstCharacter","useCallback","itemEl","acceptedRoles","menuItems","el","hasAttribute","indexOf","getAttribute","startIndex","length","firstChars","map","menuItem","textContent","charAt","toLowerCase","char","key","getIndexFirstChars","start","firstChar","i","index","focus","checkedValues","setCheckedValues","state","undefined","defaultState","defaultCheckedValues","initialState","handleCheckedValueChange","onCheckedValueChange","toggleCheckbox","name","value","checked","checkedItems","newCheckedItems","splice","push","s","selectRadio","components","root","always","role","triggerId","elementType","hasIcons","hasCheckmarks","context","contextValue","isUsingPropsAndContext","val"],"mappings":"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"}
+{"version":3,"sources":["../src/components/MenuList/useMenuList.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  useMergedRefs,\n  useEventCallback,\n  useControllableState,\n  getIntrinsicElementProps,\n  slot,\n} from '@fluentui/react-utilities';\nimport {\n  useArrowNavigationGroup,\n  useFocusFinders,\n  TabsterMoveFocusEventName,\n  type TabsterMoveFocusEvent,\n} from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MenuContext } from '../../contexts/menuContext';\nimport type { MenuListProps, MenuListState } from './MenuList.types';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuList_unstable = (props: MenuListProps, ref: React.Ref<HTMLElement>): MenuListState => {\n  const { findAllFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent();\n  const menuContext = useMenuContextSelectors();\n  const hasMenuContext = useHasParentContext(MenuContext);\n  const focusAttributes = useArrowNavigationGroup({ circular: true });\n\n  if (usingPropsAndMenuContext(props, menuContext, hasMenuContext)) {\n    // TODO throw warnings in development safely\n    // eslint-disable-next-line no-console\n    console.warn('You are using both MenuList and Menu props, we recommend you to use Menu props when available');\n  }\n\n  const innerRef = React.useRef<HTMLElement>(null);\n  const validateNestingRef = useValidateNesting('MenuList');\n\n  React.useEffect(() => {\n    const element = innerRef.current;\n\n    if (hasMenuContext && targetDocument && element) {\n      const onTabsterMoveFocus = (e: TabsterMoveFocusEvent) => {\n        const nextElement = e.detail.next;\n\n        if (nextElement && element.contains(targetDocument.activeElement) && !element.contains(nextElement)) {\n          // Preventing Tabster from handling Tab press, useMenuPopover will handle it.\n          e.preventDefault();\n        }\n      };\n\n      targetDocument.addEventListener(TabsterMoveFocusEventName, onTabsterMoveFocus);\n\n      return () => {\n        targetDocument.removeEventListener(TabsterMoveFocusEventName, onTabsterMoveFocus);\n      };\n    }\n  }, [innerRef, targetDocument, hasMenuContext]);\n\n  const setFocusByFirstCharacter = React.useCallback(\n    (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => {\n      // TODO use some kind of children registration to reduce dependency on DOM roles\n      const acceptedRoles = ['menuitem', 'menuitemcheckbox', 'menuitemradio'];\n      if (!innerRef.current) {\n        return;\n      }\n\n      const menuItems = findAllFocusable(\n        innerRef.current,\n        (el: HTMLElement) => el.hasAttribute('role') && acceptedRoles.indexOf(el.getAttribute('role')!) !== -1,\n      );\n\n      let startIndex = menuItems.indexOf(itemEl) + 1;\n      if (startIndex === menuItems.length) {\n        startIndex = 0;\n      }\n\n      const firstChars = menuItems.map(menuItem => menuItem.textContent?.charAt(0).toLowerCase());\n      const char = e.key.toLowerCase();\n\n      const getIndexFirstChars = (start: number, firstChar: string) => {\n        for (let i = start; i < firstChars.length; i++) {\n          if (char === firstChars[i]) {\n            return i;\n          }\n        }\n        return -1;\n      };\n\n      // Check remaining slots in the menu\n      let index = getIndexFirstChars(startIndex, char);\n\n      // If not found in remaining slots, check from beginning\n      if (index === -1) {\n        index = getIndexFirstChars(0, char);\n      }\n\n      // If match was found...\n      if (index > -1) {\n        menuItems[index].focus();\n      }\n    },\n    [findAllFocusable],\n  );\n\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues ?? (hasMenuContext ? menuContext.checkedValues : undefined),\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n\n  const handleCheckedValueChange =\n    props.onCheckedValueChange ?? (hasMenuContext ? menuContext.onCheckedValueChange : undefined);\n\n  const toggleCheckbox = useEventCallback(\n    (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked: boolean) => {\n      const checkedItems = checkedValues?.[name] || [];\n      const newCheckedItems = [...checkedItems];\n      if (checked) {\n        newCheckedItems.splice(newCheckedItems.indexOf(value), 1);\n      } else {\n        newCheckedItems.push(value);\n      }\n\n      handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n      setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n    },\n  );\n\n  const selectRadio = useEventCallback((e: React.MouseEvent | React.KeyboardEvent, name: string, value: string) => {\n    const newCheckedItems = [value];\n    setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n    handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n  });\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: useMergedRefs(ref, innerRef, validateNestingRef) as React.Ref<HTMLDivElement>,\n        role: 'menu',\n        'aria-labelledby': menuContext.triggerId,\n        ...focusAttributes,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    hasIcons: menuContext.hasIcons || false,\n    hasCheckmarks: menuContext.hasCheckmarks || false,\n    checkedValues,\n    hasMenuContext,\n    setFocusByFirstCharacter,\n    selectRadio,\n    toggleCheckbox,\n  };\n};\n\n/**\n * Adds some sugar to fetching multiple context selector values\n */\nconst useMenuContextSelectors = () => {\n  const checkedValues = useMenuContext_unstable(context => context.checkedValues);\n  const onCheckedValueChange = useMenuContext_unstable(context => context.onCheckedValueChange);\n  const triggerId = useMenuContext_unstable(context => context.triggerId);\n  const hasIcons = useMenuContext_unstable(context => context.hasIcons);\n  const hasCheckmarks = useMenuContext_unstable(context => context.hasCheckmarks);\n\n  return {\n    checkedValues,\n    onCheckedValueChange,\n    triggerId,\n    hasIcons,\n    hasCheckmarks,\n  };\n};\n\n/**\n * Helper function to detect if props and MenuContext values are both used\n */\nconst usingPropsAndMenuContext = (\n  props: MenuListProps,\n  contextValue: ReturnType<typeof useMenuContextSelectors>,\n  hasMenuContext: boolean,\n) => {\n  let isUsingPropsAndContext = false;\n  for (const val in contextValue) {\n    if (props[val as keyof Omit<typeof contextValue, 'hasMenuContext' | 'onCheckedValueChange' | 'triggerId'>]) {\n      isUsingPropsAndContext = true;\n    }\n  }\n\n  return hasMenuContext && isUsingPropsAndContext;\n};\n"],"names":["React","useMergedRefs","useEventCallback","useControllableState","getIntrinsicElementProps","slot","useArrowNavigationGroup","useFocusFinders","TabsterMoveFocusEventName","useFluent_unstable","useFluent","useHasParentContext","useMenuContext_unstable","MenuContext","useValidateNesting","useMenuList_unstable","props","ref","findAllFocusable","targetDocument","menuContext","useMenuContextSelectors","hasMenuContext","focusAttributes","circular","usingPropsAndMenuContext","console","warn","innerRef","useRef","validateNestingRef","useEffect","element","current","onTabsterMoveFocus","e","nextElement","detail","next","contains","activeElement","preventDefault","addEventListener","removeEventListener","setFocusByFirstCharacter","useCallback","itemEl","acceptedRoles","menuItems","el","hasAttribute","indexOf","getAttribute","startIndex","length","firstChars","map","menuItem","textContent","charAt","toLowerCase","char","key","getIndexFirstChars","start","firstChar","i","index","focus","checkedValues","setCheckedValues","state","undefined","defaultState","defaultCheckedValues","initialState","handleCheckedValueChange","onCheckedValueChange","toggleCheckbox","name","value","checked","checkedItems","newCheckedItems","splice","push","s","selectRadio","components","root","always","role","triggerId","elementType","hasIcons","hasCheckmarks","context","contextValue","isUsingPropsAndContext","val"],"mappings":"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"}

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

@@ -1,3 +1,5 @@
+'use client';
+
 import { mergeClasses, __styles } from '@griffel/react';
 export const menuListClassNames = {
   root: 'fui-MenuList'

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

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

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

@@ -1,3 +1,4 @@
+'use client';
 import { mergeClasses, makeStyles } from '@griffel/react';
 export const menuListClassNames = {
     root: 'fui-MenuList'

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

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

package/lib/components/MenuPopover/MenuPopover.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { useMenuPopover_unstable } from './useMenuPopover';
 import { useMenuPopoverStyles_unstable } from './useMenuPopoverStyles.styles';

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuPopover/MenuPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuPopover_unstable } from './useMenuPopover';\nimport { useMenuPopoverStyles_unstable } from './useMenuPopoverStyles.styles';\nimport { renderMenuPopover_unstable } from './renderMenuPopover';\nimport type { MenuPopoverProps } from './MenuPopover.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus\n */\nexport const MenuPopover: ForwardRefComponent<MenuPopoverProps> = React.forwardRef((props, ref) => {\n  const state = useMenuPopover_unstable(props, ref);\n\n  useMenuPopoverStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useMenuPopoverStyles_unstable')(state);\n\n  return renderMenuPopover_unstable(state);\n});\n\nMenuPopover.displayName = 'MenuPopover';\n"],"names":["React","useMenuPopover_unstable","useMenuPopoverStyles_unstable","renderMenuPopover_unstable","useCustomStyleHook_unstable","MenuPopover","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,6BAA6B,QAAQ,gCAAgC;AAC9E,SAASC,0BAA0B,QAAQ,sBAAsB;AAGjE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,4BAAqDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAE7CN,8BAA8BO;IAE9BL,4BAA4B,iCAAiCK;IAE7D,OAAON,2BAA2BM;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/MenuPopover/MenuPopover.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuPopover_unstable } from './useMenuPopover';\nimport { useMenuPopoverStyles_unstable } from './useMenuPopoverStyles.styles';\nimport { renderMenuPopover_unstable } from './renderMenuPopover';\nimport type { MenuPopoverProps } from './MenuPopover.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus\n */\nexport const MenuPopover: ForwardRefComponent<MenuPopoverProps> = React.forwardRef((props, ref) => {\n  const state = useMenuPopover_unstable(props, ref);\n\n  useMenuPopoverStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useMenuPopoverStyles_unstable')(state);\n\n  return renderMenuPopover_unstable(state);\n});\n\nMenuPopover.displayName = 'MenuPopover';\n"],"names":["React","useMenuPopover_unstable","useMenuPopoverStyles_unstable","renderMenuPopover_unstable","useCustomStyleHook_unstable","MenuPopover","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,6BAA6B,QAAQ,gCAAgC;AAC9E,SAASC,0BAA0B,QAAQ,sBAAsB;AAGjE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,4BAAqDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAE7CN,8BAA8BO;IAE9BL,4BAA4B,iCAAiCK;IAE7D,OAAON,2BAA2BM;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}

package/lib/components/MenuPopover/useMenuPopover.js

@@ -1,3 +1,4 @@
+'use client';
 import { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
 import { useRestoreFocusSource } from '@fluentui/react-tabster';

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

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

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

@@ -1,3 +1,5 @@
+'use client';
+
 import { mergeClasses, __styles } from '@griffel/react';
 import { tokens, typographyStyles } from '@fluentui/react-theme';
 import { createSlideStyles } from '@fluentui/react-positioning';

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

@@ -1 +1 @@
-{"version":3,"names":["mergeClasses","__styles","tokens","typographyStyles","createSlideStyles","menuPopoverClassNames","root","useStyles","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","De3pzq","sj55zd","B7ck84d","Bf4jedk","B2u0y6b","B68tc82","a9b677","E5pizo","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","B93otf3","vin17d","Ezkn3b","nyiy2g","swvrvq","Bkovbt3","hgjdhn","fsy9dk","B3ogreh","jv49x5","Bk7o48c","Bv12yb3","z0t1cu","Bks05zx","Bvtglag","d","p","k","m","t","useMenuPopoverStyles_unstable","state","styles","className"],"sources":["useMenuPopoverStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { createSlideStyles } from '@fluentui/react-positioning';\nexport const menuPopoverClassNames = {\n    root: 'fui-MenuPopover'\n};\nconst useStyles = makeStyles({\n    root: {\n        borderRadius: tokens.borderRadiusMedium,\n        backgroundColor: tokens.colorNeutralBackground1,\n        color: tokens.colorNeutralForeground1,\n        boxSizing: 'border-box',\n        minWidth: '138px',\n        maxWidth: '300px',\n        overflowX: 'hidden',\n        width: 'max-content',\n        boxShadow: `${tokens.shadow16}`,\n        padding: '4px',\n        border: `1px solid ${tokens.colorTransparentStroke}`,\n        ...typographyStyles.body1,\n        ...createSlideStyles(10)\n    }\n});\n/**\n * Apply styling to the Menu slots based on the state\n */ export const useMenuPopoverStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,SAASC,iBAAiB,QAAQ,6BAA6B;AAC/D,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGN,QAAA;EAAAK,IAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;AAAA,CAgBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,aAAa;;EACb,MAAMC,MAAM,GAAG9D,SAAS,CAAC,CAAC;EAC1B6D,KAAK,CAAC9D,IAAI,CAACgE,SAAS,GAAGtE,YAAY,CAACK,qBAAqB,CAACC,IAAI,EAAE+D,MAAM,CAAC/D,IAAI,EAAE8D,KAAK,CAAC9D,IAAI,CAACgE,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["mergeClasses","__styles","tokens","typographyStyles","createSlideStyles","menuPopoverClassNames","root","useStyles","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","De3pzq","sj55zd","B7ck84d","Bf4jedk","B2u0y6b","B68tc82","a9b677","E5pizo","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","B93otf3","vin17d","Ezkn3b","nyiy2g","swvrvq","Bkovbt3","hgjdhn","fsy9dk","B3ogreh","jv49x5","Bk7o48c","Bv12yb3","z0t1cu","Bks05zx","Bvtglag","d","p","k","m","t","useMenuPopoverStyles_unstable","state","styles","className"],"sources":["useMenuPopoverStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { createSlideStyles } from '@fluentui/react-positioning';\nexport const menuPopoverClassNames = {\n    root: 'fui-MenuPopover'\n};\nconst useStyles = makeStyles({\n    root: {\n        borderRadius: tokens.borderRadiusMedium,\n        backgroundColor: tokens.colorNeutralBackground1,\n        color: tokens.colorNeutralForeground1,\n        boxSizing: 'border-box',\n        minWidth: '138px',\n        maxWidth: '300px',\n        overflowX: 'hidden',\n        width: 'max-content',\n        boxShadow: `${tokens.shadow16}`,\n        padding: '4px',\n        border: `1px solid ${tokens.colorTransparentStroke}`,\n        ...typographyStyles.body1,\n        ...createSlideStyles(10)\n    }\n});\n/**\n * Apply styling to the Menu slots based on the state\n */ export const useMenuPopoverStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,SAASC,iBAAiB,QAAQ,6BAA6B;AAC/D,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGN,QAAA;EAAAK,IAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;AAAA,CAgBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,aAAa;;EACb,MAAMC,MAAM,GAAG9D,SAAS,CAAC,CAAC;EAC1B6D,KAAK,CAAC9D,IAAI,CAACgE,SAAS,GAAGtE,YAAY,CAACK,qBAAqB,CAACC,IAAI,EAAE+D,MAAM,CAAC/D,IAAI,EAAE8D,KAAK,CAAC9D,IAAI,CAACgE,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

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

@@ -1,3 +1,4 @@
+'use client';
 import { mergeClasses, makeStyles } from '@griffel/react';
 import { tokens, typographyStyles } from '@fluentui/react-theme';
 import { createSlideStyles } from '@fluentui/react-positioning';

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

@@ -1 +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":["mergeClasses","makeStyles","tokens","typographyStyles","createSlideStyles","menuPopoverClassNames","root","useStyles","borderRadius","borderRadiusMedium","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxSizing","minWidth","maxWidth","overflowX","width","boxShadow","shadow16","padding","border","colorTransparentStroke","body1","useMenuPopoverStyles_unstable","state","styles","className"],"mappings":"AAAA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAGjE,SAASC,iBAAiB,QAAQ,8BAA8B;AAEhE,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYN,WAAW;IAC3BK,MAAM;QACJE,cAAcN,OAAOO,kBAAkB;QACvCC,iBAAiBR,OAAOS,uBAAuB;QAC/CC,OAAOV,OAAOW,uBAAuB;QACrCC,WAAW;QACXC,UAAU;QACVC,UAAU;QACVC,WAAW;QACXC,OAAO;QACPC,WAAW,GAAGjB,OAAOkB,QAAQ,EAAE;QAC/BC,SAAS;QACTC,QAAQ,CAAC,UAAU,EAAEpB,OAAOqB,sBAAsB,EAAE;QACpD,GAAGpB,iBAAiBqB,KAAK;QACzB,GAAGpB,kBAAkB,GAAG;IAC1B;AACF;AAEA;;CAEC,GACD,OAAO,MAAMqB,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,SAASpB;IACfmB,MAAMpB,IAAI,CAACsB,SAAS,GAAG5B,aAAaK,sBAAsBC,IAAI,EAAEqB,OAAOrB,IAAI,EAAEoB,MAAMpB,IAAI,CAACsB,SAAS;IACjG,OAAOF;AACT,EAAE"}
+{"version":3,"sources":["../src/components/MenuPopover/useMenuPopoverStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\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":["mergeClasses","makeStyles","tokens","typographyStyles","createSlideStyles","menuPopoverClassNames","root","useStyles","borderRadius","borderRadiusMedium","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxSizing","minWidth","maxWidth","overflowX","width","boxShadow","shadow16","padding","border","colorTransparentStroke","body1","useMenuPopoverStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAGjE,SAASC,iBAAiB,QAAQ,8BAA8B;AAEhE,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYN,WAAW;IAC3BK,MAAM;QACJE,cAAcN,OAAOO,kBAAkB;QACvCC,iBAAiBR,OAAOS,uBAAuB;QAC/CC,OAAOV,OAAOW,uBAAuB;QACrCC,WAAW;QACXC,UAAU;QACVC,UAAU;QACVC,WAAW;QACXC,OAAO;QACPC,WAAW,GAAGjB,OAAOkB,QAAQ,EAAE;QAC/BC,SAAS;QACTC,QAAQ,CAAC,UAAU,EAAEpB,OAAOqB,sBAAsB,EAAE;QACpD,GAAGpB,iBAAiBqB,KAAK;QACzB,GAAGpB,kBAAkB,GAAG;IAC1B;AACF;AAEA;;CAEC,GACD,OAAO,MAAMqB,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,SAASpB;IACfmB,MAAMpB,IAAI,CAACsB,SAAS,GAAG5B,aAAaK,sBAAsBC,IAAI,EAAEqB,OAAOrB,IAAI,EAAEoB,MAAMpB,IAAI,CAACsB,SAAS;IACjG,OAAOF;AACT,EAAE"}

package/lib/components/MenuSplitGroup/MenuSplitGroup.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { useMenuSplitGroup_unstable } from './useMenuSplitGroup';
 import { renderMenuSplitGroup_unstable } from './renderMenuSplitGroup';

package/lib/components/MenuSplitGroup/MenuSplitGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuSplitGroup/MenuSplitGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuSplitGroup_unstable } from './useMenuSplitGroup';\nimport { renderMenuSplitGroup_unstable } from './renderMenuSplitGroup';\nimport { useMenuSplitGroupStyles_unstable } from './useMenuSplitGroupStyles.styles';\nimport type { MenuSplitGroupProps } from './MenuSplitGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useMenuSplitGroupContextValues } from './useMenuSplitGroupContextValues';\n\n/**\n * Layout wrapper that provides extra keyboard navigation behavior for two `MenuItem` components.\n */\nexport const MenuSplitGroup: ForwardRefComponent<MenuSplitGroupProps> = React.forwardRef((props, ref) => {\n  const state = useMenuSplitGroup_unstable(props, ref);\n\n  useMenuSplitGroupStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useMenuSplitGroupStyles_unstable')(state);\n\n  return renderMenuSplitGroup_unstable(state, useMenuSplitGroupContextValues(state));\n});\n\nMenuSplitGroup.displayName = 'MenuSplitGroup';\n"],"names":["React","useMenuSplitGroup_unstable","renderMenuSplitGroup_unstable","useMenuSplitGroupStyles_unstable","useCustomStyleHook_unstable","useMenuSplitGroupContextValues","MenuSplitGroup","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AAGpF,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,8BAA8B,QAAQ,mCAAmC;AAElF;;CAEC,GACD,OAAO,MAAMC,+BAA2DN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQT,2BAA2BO,OAAOC;IAEhDN,iCAAiCO;IAEjCN,4BAA4B,oCAAoCM;IAEhE,OAAOR,8BAA8BQ,OAAOL,+BAA+BK;AAC7E,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/MenuSplitGroup/MenuSplitGroup.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuSplitGroup_unstable } from './useMenuSplitGroup';\nimport { renderMenuSplitGroup_unstable } from './renderMenuSplitGroup';\nimport { useMenuSplitGroupStyles_unstable } from './useMenuSplitGroupStyles.styles';\nimport type { MenuSplitGroupProps } from './MenuSplitGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useMenuSplitGroupContextValues } from './useMenuSplitGroupContextValues';\n\n/**\n * Layout wrapper that provides extra keyboard navigation behavior for two `MenuItem` components.\n */\nexport const MenuSplitGroup: ForwardRefComponent<MenuSplitGroupProps> = React.forwardRef((props, ref) => {\n  const state = useMenuSplitGroup_unstable(props, ref);\n\n  useMenuSplitGroupStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useMenuSplitGroupStyles_unstable')(state);\n\n  return renderMenuSplitGroup_unstable(state, useMenuSplitGroupContextValues(state));\n});\n\nMenuSplitGroup.displayName = 'MenuSplitGroup';\n"],"names":["React","useMenuSplitGroup_unstable","renderMenuSplitGroup_unstable","useMenuSplitGroupStyles_unstable","useCustomStyleHook_unstable","useMenuSplitGroupContextValues","MenuSplitGroup","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AAGpF,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,8BAA8B,QAAQ,mCAAmC;AAElF;;CAEC,GACD,OAAO,MAAMC,+BAA2DN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQT,2BAA2BO,OAAOC;IAEhDN,iCAAiCO;IAEjCN,4BAA4B,oCAAoCM;IAEhE,OAAOR,8BAA8BQ,OAAOL,+BAA+BK;AAC7E,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}

package/lib/components/MenuSplitGroup/useMenuSplitGroup.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { getIntrinsicElementProps, getRTLSafeKey, useMergedRefs, slot } from '@fluentui/react-utilities';
 import { useFocusFinders } from '@fluentui/react-tabster';

package/lib/components/MenuSplitGroup/useMenuSplitGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, getRTLSafeKey, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { MenuSplitGroupProps, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport { ArrowRight, ArrowLeft } from '@fluentui/keyboard-keys';\nimport { menuSplitGroupMultilineAttr } from './useMenuSplitGroupStyles.styles';\n\n/**\n * Create the state required to render MenuSplitGroup.\n *\n * The returned state can be modified with hooks such as useMenuSplitGroupStyles_unstable,\n * before being passed to renderMenuSplitGroup_unstable.\n *\n * @param props - props from this instance of MenuSplitGroup\n * @param ref - reference to root HTMLElement of MenuSplitGroup\n */\nexport const useMenuSplitGroup_unstable = (\n  props: MenuSplitGroupProps,\n  ref: React.Ref<HTMLElement>,\n): MenuSplitGroupState => {\n  const innerRef = React.useRef<HTMLDivElement>(undefined);\n  const { dir, targetDocument } = useFluent();\n\n  const nextArrowKey = getRTLSafeKey(ArrowRight, dir);\n  const prevArrowKey = getRTLSafeKey(ArrowLeft, dir);\n\n  const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n  const { multilineRef, setMultiline } = useHandleMultilineMenuItem();\n\n  const onKeyDown = React.useCallback(\n    (e: React.KeyboardEvent<HTMLElement>) => {\n      const activeElement = targetDocument?.activeElement;\n      if (!activeElement) {\n        return;\n      }\n\n      if (!innerRef.current?.contains(activeElement)) {\n        return;\n      }\n\n      if (e.key === nextArrowKey) {\n        const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n        next?.focus();\n      }\n\n      if (e.key === prevArrowKey) {\n        const prev = findPrevFocusable(activeElement as HTMLElement, { container: innerRef.current });\n        prev?.focus();\n      }\n    },\n    [findNextFocusable, findPrevFocusable, targetDocument, nextArrowKey, prevArrowKey],\n  );\n\n  return {\n    components: {\n      root: 'div',\n    },\n    setMultiline,\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        role: 'group',\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: useMergedRefs(ref, innerRef, multilineRef) as React.Ref<HTMLDivElement>,\n        onKeyDown,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n\n/**\n * Creates a callback that lets a multiline menu item child set an attribute on this component\n * Children can mount before parents so we need to store the value and apply it when the parent is mounted\n */\nconst useHandleMultilineMenuItem = () => {\n  const [handle] = React.useState(() => {\n    let isMultiline = false;\n    let multilineNode: HTMLElement | null = null;\n\n    function applyAttr() {\n      multilineNode?.toggleAttribute(menuSplitGroupMultilineAttr, isMultiline);\n    }\n\n    return {\n      multilineRef: (node: HTMLDivElement | null) => {\n        if (node) {\n          multilineNode = node;\n          applyAttr();\n        } else {\n          multilineNode = null;\n        }\n      },\n      setMultiline: (value: boolean) => {\n        isMultiline = value;\n        applyAttr();\n      },\n    };\n  });\n\n  return handle;\n};\n"],"names":["React","getIntrinsicElementProps","getRTLSafeKey","useMergedRefs","slot","useFocusFinders","useFluent_unstable","useFluent","ArrowRight","ArrowLeft","menuSplitGroupMultilineAttr","useMenuSplitGroup_unstable","props","ref","innerRef","useRef","undefined","dir","targetDocument","nextArrowKey","prevArrowKey","findNextFocusable","findPrevFocusable","multilineRef","setMultiline","useHandleMultilineMenuItem","onKeyDown","useCallback","e","activeElement","current","contains","key","next","container","focus","prev","components","root","always","role","elementType","handle","useState","isMultiline","multilineNode","applyAttr","toggleAttribute","node","value"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,aAAa,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AACzG,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,SAASC,UAAU,EAAEC,SAAS,QAAQ,0BAA0B;AAChE,SAASC,2BAA2B,QAAQ,mCAAmC;AAE/E;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAMC,WAAWd,MAAMe,MAAM,CAAiBC;IAC9C,MAAM,EAAEC,GAAG,EAAEC,cAAc,EAAE,GAAGX;IAEhC,MAAMY,eAAejB,cAAcM,YAAYS;IAC/C,MAAMG,eAAelB,cAAcO,WAAWQ;IAE9C,MAAM,EAAEI,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGjB;IACjD,MAAM,EAAEkB,YAAY,EAAEC,YAAY,EAAE,GAAGC;IAEvC,MAAMC,YAAY1B,MAAM2B,WAAW,CACjC,CAACC;YAMMd;QALL,MAAMe,gBAAgBX,2BAAAA,qCAAAA,eAAgBW,aAAa;QACnD,IAAI,CAACA,eAAe;YAClB;QACF;QAEA,IAAI,GAACf,oBAAAA,SAASgB,OAAO,cAAhBhB,wCAAAA,kBAAkBiB,QAAQ,CAACF,iBAAgB;YAC9C;QACF;QAEA,IAAID,EAAEI,GAAG,KAAKb,cAAc;YAC1B,MAAMc,OAAOZ,kBAAkBQ,eAA8B;gBAAEK,WAAWpB,SAASgB,OAAO;YAAC;YAC3FG,iBAAAA,2BAAAA,KAAME,KAAK;QACb;QAEA,IAAIP,EAAEI,GAAG,KAAKZ,cAAc;YAC1B,MAAMgB,OAAOd,kBAAkBO,eAA8B;gBAAEK,WAAWpB,SAASgB,OAAO;YAAC;YAC3FM,iBAAAA,2BAAAA,KAAMD,KAAK;QACb;IACF,GACA;QAACd;QAAmBC;QAAmBJ;QAAgBC;QAAcC;KAAa;IAGpF,OAAO;QACLiB,YAAY;YACVC,MAAM;QACR;QACAd;QACAc,MAAMlC,KAAKmC,MAAM,CACftC,yBAAyB,OAAO;YAC9BuC,MAAM;YACN,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5F3B,KAAKV,cAAcU,KAAKC,UAAUS;YAClCG;YACA,GAAGd,KAAK;QACV,IACA;YAAE6B,aAAa;QAAM;IAEzB;AACF,EAAE;AAEF;;;CAGC,GACD,MAAMhB,6BAA6B;IACjC,MAAM,CAACiB,OAAO,GAAG1C,MAAM2C,QAAQ,CAAC;QAC9B,IAAIC,cAAc;QAClB,IAAIC,gBAAoC;QAExC,SAASC;YACPD,0BAAAA,oCAAAA,cAAeE,eAAe,CAACrC,6BAA6BkC;QAC9D;QAEA,OAAO;YACLrB,cAAc,CAACyB;gBACb,IAAIA,MAAM;oBACRH,gBAAgBG;oBAChBF;gBACF,OAAO;oBACLD,gBAAgB;gBAClB;YACF;YACArB,cAAc,CAACyB;gBACbL,cAAcK;gBACdH;YACF;QACF;IACF;IAEA,OAAOJ;AACT"}
+{"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroup.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, getRTLSafeKey, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { MenuSplitGroupProps, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport { ArrowRight, ArrowLeft } from '@fluentui/keyboard-keys';\nimport { menuSplitGroupMultilineAttr } from './useMenuSplitGroupStyles.styles';\n\n/**\n * Create the state required to render MenuSplitGroup.\n *\n * The returned state can be modified with hooks such as useMenuSplitGroupStyles_unstable,\n * before being passed to renderMenuSplitGroup_unstable.\n *\n * @param props - props from this instance of MenuSplitGroup\n * @param ref - reference to root HTMLElement of MenuSplitGroup\n */\nexport const useMenuSplitGroup_unstable = (\n  props: MenuSplitGroupProps,\n  ref: React.Ref<HTMLElement>,\n): MenuSplitGroupState => {\n  const innerRef = React.useRef<HTMLDivElement>(undefined);\n  const { dir, targetDocument } = useFluent();\n\n  const nextArrowKey = getRTLSafeKey(ArrowRight, dir);\n  const prevArrowKey = getRTLSafeKey(ArrowLeft, dir);\n\n  const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n  const { multilineRef, setMultiline } = useHandleMultilineMenuItem();\n\n  const onKeyDown = React.useCallback(\n    (e: React.KeyboardEvent<HTMLElement>) => {\n      const activeElement = targetDocument?.activeElement;\n      if (!activeElement) {\n        return;\n      }\n\n      if (!innerRef.current?.contains(activeElement)) {\n        return;\n      }\n\n      if (e.key === nextArrowKey) {\n        const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n        next?.focus();\n      }\n\n      if (e.key === prevArrowKey) {\n        const prev = findPrevFocusable(activeElement as HTMLElement, { container: innerRef.current });\n        prev?.focus();\n      }\n    },\n    [findNextFocusable, findPrevFocusable, targetDocument, nextArrowKey, prevArrowKey],\n  );\n\n  return {\n    components: {\n      root: 'div',\n    },\n    setMultiline,\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        role: 'group',\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: useMergedRefs(ref, innerRef, multilineRef) as React.Ref<HTMLDivElement>,\n        onKeyDown,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n\n/**\n * Creates a callback that lets a multiline menu item child set an attribute on this component\n * Children can mount before parents so we need to store the value and apply it when the parent is mounted\n */\nconst useHandleMultilineMenuItem = () => {\n  const [handle] = React.useState(() => {\n    let isMultiline = false;\n    let multilineNode: HTMLElement | null = null;\n\n    function applyAttr() {\n      multilineNode?.toggleAttribute(menuSplitGroupMultilineAttr, isMultiline);\n    }\n\n    return {\n      multilineRef: (node: HTMLDivElement | null) => {\n        if (node) {\n          multilineNode = node;\n          applyAttr();\n        } else {\n          multilineNode = null;\n        }\n      },\n      setMultiline: (value: boolean) => {\n        isMultiline = value;\n        applyAttr();\n      },\n    };\n  });\n\n  return handle;\n};\n"],"names":["React","getIntrinsicElementProps","getRTLSafeKey","useMergedRefs","slot","useFocusFinders","useFluent_unstable","useFluent","ArrowRight","ArrowLeft","menuSplitGroupMultilineAttr","useMenuSplitGroup_unstable","props","ref","innerRef","useRef","undefined","dir","targetDocument","nextArrowKey","prevArrowKey","findNextFocusable","findPrevFocusable","multilineRef","setMultiline","useHandleMultilineMenuItem","onKeyDown","useCallback","e","activeElement","current","contains","key","next","container","focus","prev","components","root","always","role","elementType","handle","useState","isMultiline","multilineNode","applyAttr","toggleAttribute","node","value"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,aAAa,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AACzG,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,SAASC,UAAU,EAAEC,SAAS,QAAQ,0BAA0B;AAChE,SAASC,2BAA2B,QAAQ,mCAAmC;AAE/E;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAMC,WAAWd,MAAMe,MAAM,CAAiBC;IAC9C,MAAM,EAAEC,GAAG,EAAEC,cAAc,EAAE,GAAGX;IAEhC,MAAMY,eAAejB,cAAcM,YAAYS;IAC/C,MAAMG,eAAelB,cAAcO,WAAWQ;IAE9C,MAAM,EAAEI,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGjB;IACjD,MAAM,EAAEkB,YAAY,EAAEC,YAAY,EAAE,GAAGC;IAEvC,MAAMC,YAAY1B,MAAM2B,WAAW,CACjC,CAACC;YAMMd;QALL,MAAMe,gBAAgBX,2BAAAA,qCAAAA,eAAgBW,aAAa;QACnD,IAAI,CAACA,eAAe;YAClB;QACF;QAEA,IAAI,GAACf,oBAAAA,SAASgB,OAAO,cAAhBhB,wCAAAA,kBAAkBiB,QAAQ,CAACF,iBAAgB;YAC9C;QACF;QAEA,IAAID,EAAEI,GAAG,KAAKb,cAAc;YAC1B,MAAMc,OAAOZ,kBAAkBQ,eAA8B;gBAAEK,WAAWpB,SAASgB,OAAO;YAAC;YAC3FG,iBAAAA,2BAAAA,KAAME,KAAK;QACb;QAEA,IAAIP,EAAEI,GAAG,KAAKZ,cAAc;YAC1B,MAAMgB,OAAOd,kBAAkBO,eAA8B;gBAAEK,WAAWpB,SAASgB,OAAO;YAAC;YAC3FM,iBAAAA,2BAAAA,KAAMD,KAAK;QACb;IACF,GACA;QAACd;QAAmBC;QAAmBJ;QAAgBC;QAAcC;KAAa;IAGpF,OAAO;QACLiB,YAAY;YACVC,MAAM;QACR;QACAd;QACAc,MAAMlC,KAAKmC,MAAM,CACftC,yBAAyB,OAAO;YAC9BuC,MAAM;YACN,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5F3B,KAAKV,cAAcU,KAAKC,UAAUS;YAClCG;YACA,GAAGd,KAAK;QACV,IACA;YAAE6B,aAAa;QAAM;IAEzB;AACF,EAAE;AAEF;;;CAGC,GACD,MAAMhB,6BAA6B;IACjC,MAAM,CAACiB,OAAO,GAAG1C,MAAM2C,QAAQ,CAAC;QAC9B,IAAIC,cAAc;QAClB,IAAIC,gBAAoC;QAExC,SAASC;YACPD,0BAAAA,oCAAAA,cAAeE,eAAe,CAACrC,6BAA6BkC;QAC9D;QAEA,OAAO;YACLrB,cAAc,CAACyB;gBACb,IAAIA,MAAM;oBACRH,gBAAgBG;oBAChBF;gBACF,OAAO;oBACLD,gBAAgB;gBAClB;YACF;YACArB,cAAc,CAACyB;gBACbL,cAAcK;gBACdH;YACF;QACF;IACF;IAEA,OAAOJ;AACT"}

package/lib/components/MenuSplitGroup/useMenuSplitGroupContextValues.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 export const useMenuSplitGroupContextValues = (state)=>{
     'use no memo';

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

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

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

@@ -1,3 +1,5 @@
+'use client';
+
 import { __styles, mergeClasses } from '@griffel/react';
 import { tokens } from '@fluentui/react-theme';
 import { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';

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

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

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

@@ -1,3 +1,4 @@
+'use client';
 import { makeStyles, mergeClasses } from '@griffel/react';
 import { tokens } from '@fluentui/react-theme';
 import { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';

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

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

package/lib/components/MenuTrigger/MenuTrigger.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { useMenuTrigger_unstable } from './useMenuTrigger';
 import { renderMenuTrigger_unstable } from './renderMenuTrigger';

package/lib/components/MenuTrigger/MenuTrigger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuTrigger/MenuTrigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuTrigger_unstable } from './useMenuTrigger';\nimport { renderMenuTrigger_unstable } from './renderMenuTrigger';\nimport type { MenuTriggerProps } from './MenuTrigger.types';\nimport type { FluentTriggerComponent } from '@fluentui/react-utilities';\n\n/**\n * Wraps a trigger element as an only child\n * and adds the necessary event handling to open a popup menu\n */\nexport const MenuTrigger: React.FC<MenuTriggerProps> = props => {\n  const state = useMenuTrigger_unstable(props);\n\n  return renderMenuTrigger_unstable(state);\n};\n\nMenuTrigger.displayName = 'MenuTrigger';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\n(MenuTrigger as FluentTriggerComponent).isFluentTriggerComponent = true;\n"],"names":["React","useMenuTrigger_unstable","renderMenuTrigger_unstable","MenuTrigger","props","state","displayName","isFluentTriggerComponent"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AAIjE;;;CAGC,GACD,OAAO,MAAMC,cAA0CC,CAAAA;IACrD,MAAMC,QAAQJ,wBAAwBG;IAEtC,OAAOF,2BAA2BG;AACpC,EAAE;AAEFF,YAAYG,WAAW,GAAG;AAC1B,6FAA6F;AAC5FH,YAAuCI,wBAAwB,GAAG"}
+{"version":3,"sources":["../src/components/MenuTrigger/MenuTrigger.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuTrigger_unstable } from './useMenuTrigger';\nimport { renderMenuTrigger_unstable } from './renderMenuTrigger';\nimport type { MenuTriggerProps } from './MenuTrigger.types';\nimport type { FluentTriggerComponent } from '@fluentui/react-utilities';\n\n/**\n * Wraps a trigger element as an only child\n * and adds the necessary event handling to open a popup menu\n */\nexport const MenuTrigger: React.FC<MenuTriggerProps> = props => {\n  const state = useMenuTrigger_unstable(props);\n\n  return renderMenuTrigger_unstable(state);\n};\n\nMenuTrigger.displayName = 'MenuTrigger';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\n(MenuTrigger as FluentTriggerComponent).isFluentTriggerComponent = true;\n"],"names":["React","useMenuTrigger_unstable","renderMenuTrigger_unstable","MenuTrigger","props","state","displayName","isFluentTriggerComponent"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AAIjE;;;CAGC,GACD,OAAO,MAAMC,cAA0CC,CAAAA;IACrD,MAAMC,QAAQJ,wBAAwBG;IAEtC,OAAOF,2BAA2BG;AACpC,EAAE;AAEFF,YAAYG,WAAW,GAAG;AAC1B,6FAA6F;AAC5FH,YAAuCI,wBAAwB,GAAG"}

package/lib/components/MenuTrigger/useMenuTrigger.js

@@ -1,3 +1,4 @@
+'use client';
 import { useARIAButtonProps } from '@fluentui/react-aria';
 import { ArrowRight, ArrowLeft, Escape, ArrowDown } from '@fluentui/keyboard-keys';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';

package/lib/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  getReactElementRef,\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) || event.isDefaultPrevented()) {\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, getReactElementRef(child), 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":["useARIAButtonProps","ArrowRight","ArrowLeft","Escape","ArrowDown","useFluent_unstable","useFluent","useFocusFinders","applyTriggerPropsToChildren","getTriggerChild","getReactElementRef","isHTMLElement","mergeCallbacks","useEventCallback","useMergedRefs","React","useMenuContext_unstable","useIsSubmenu","useOnMenuSafeZoneTimeout","noop","useMenuTrigger_unstable","props","children","disableButtonEnhancement","triggerRef","context","menuPopoverRef","setOpen","open","triggerId","openOnHover","openOnContext","isSubmenu","findFirstFocusable","focusFirst","useCallback","firstFocusable","current","focus","openedWithKeyboardRef","useRef","openedViaSafeZoneRef","hasMouseMovedRef","dir","OpenArrowKey","child","safeZoneHandlerRef","onContextMenu","event","isTargetDisabled","isDefaultPrevented","preventDefault","keyboard","type","onClick","onKeyDown","key","onMouseOver","ignoreHoverDelay","onMouseMove","onMouseLeave","contextMenuProps","id","ref","onMouseEnter","triggerChildProps","undefined","ariaButtonTriggerChildProps","isDisabled","el","hasAttribute","getAttribute","target","currentTarget"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,uBAAuB;AAC1D,SAASC,UAAU,EAAEC,SAAS,EAAEC,MAAM,EAAEC,SAAS,QAAQ,0BAA0B;AACnF,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SACEC,2BAA2B,EAC3BC,eAAe,EACfC,kBAAkB,EAClBC,aAAa,EACbC,cAAc,EACdC,gBAAgB,EAChBC,aAAa,QACR,4BAA4B;AACnC,YAAYC,WAAW,QAAQ;AAG/B,SAASC,uBAAuB,QAAQ,6BAA6B;AACrE,SAASC,YAAY,EAAEC,wBAAwB,QAAQ,cAAc;AAErE,SAASC;AACP,eAAe;AACjB;AAEA;;;;;CAKC,GACD,OAAO,MAAMC,0BAA0B,CAACC;IACtC,MAAM,EAAEC,QAAQ,EAAEC,2BAA2B,KAAK,EAAE,GAAGF;IAEvD,MAAMG,aAAaR,wBAAwBS,CAAAA,UAAWA,QAAQD,UAAU;IACxE,MAAME,iBAAiBV,wBAAwBS,CAAAA,UAAWA,QAAQC,cAAc;IAChF,MAAMC,UAAUX,wBAAwBS,CAAAA,UAAWA,QAAQE,OAAO;IAClE,MAAMC,OAAOZ,wBAAwBS,CAAAA,UAAWA,QAAQG,IAAI;IAC5D,MAAMC,YAAYb,wBAAwBS,CAAAA,UAAWA,QAAQI,SAAS;IACtE,MAAMC,cAAcd,wBAAwBS,CAAAA,UAAWA,QAAQK,WAAW;IAC1E,MAAMC,gBAAgBf,wBAAwBS,CAAAA,UAAWA,QAAQM,aAAa;IAE9E,MAAMC,YAAYf;IAElB,MAAM,EAAEgB,kBAAkB,EAAE,GAAG1B;IAC/B,MAAM2B,aAAanB,MAAMoB,WAAW,CAAC;QACnC,MAAMC,iBAAiBH,mBAAmBP,eAAeW,OAAO;QAChED,2BAAAA,qCAAAA,eAAgBE,KAAK;IACvB,GAAG;QAACL;QAAoBP;KAAe;IAEvC,MAAMa,wBAAwBxB,MAAMyB,MAAM,CAAC;IAC3C,MAAMC,uBAAuB1B,MAAMyB,MAAM,CAAC;IAC1C,MAAME,mBAAmB3B,MAAMyB,MAAM,CAAC;IAEtC,MAAM,EAAEG,GAAG,EAAE,GAAGrC;IAChB,MAAMsC,eAAeD,QAAQ,QAAQ1C,aAAaC;IAElD,MAAM2C,QAAQpC,gBAAgBa;IAE9B,YAAY;IACZ,EAAE;IACF,qHAAqH;IACrH,mDAAmD;IACnD,MAAMwB,qBAAqB5B,yBACzBL,iBAAiB;QACf,IAAImB,WAAW;YACbS,qBAAqBJ,OAAO,GAAG;QACjC;IACF;IAGF,MAAMU,gBAAgB,CAACC;QACrB,IAAIC,iBAAiBD,UAAUA,MAAME,kBAAkB,IAAI;YACzD;QACF;QAEA,IAAInB,eAAe;YACjBiB,MAAMG,cAAc;YACpBxB,QAAQqB,OAAO;gBAAEpB,MAAM;gBAAMwB,UAAU;gBAAOC,MAAM;gBAA0BL;YAAM;QACtF;IACF;IAEA,MAAMM,UAAU,CAACN;QACf,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QAEA,IAAI,CAACjB,eAAe;YAClBJ,QAAQqB,OAAO;gBAAEpB,MAAM,CAACA;gBAAMwB,UAAUb,sBAAsBF,OAAO;gBAAEgB,MAAM;gBAAoBL;YAAM;YACvGT,sBAAsBF,OAAO,GAAG;QAClC;IACF;IAEA,MAAMkB,YAAY,CAACP;QACjB,IAAIC,iBAAiBD,UAAUA,MAAME,kBAAkB,IAAI;YACzD;QACF;QAEA,MAAMM,MAAMR,MAAMQ,GAAG;QAErB,IAAI,CAACzB,iBAAkB,CAAA,AAACC,aAAawB,QAAQZ,gBAAkB,CAACZ,aAAawB,QAAQpD,SAAS,GAAI;YAChGuB,QAAQqB,OAAO;gBAAEpB,MAAM;gBAAMwB,UAAU;gBAAMC,MAAM;gBAAsBL;YAAM;QACjF;QAEA,IAAIQ,QAAQrD,UAAU,CAAC6B,WAAW;YAChCL,QAAQqB,OAAO;gBAAEpB,MAAM;gBAAOwB,UAAU;gBAAMC,MAAM;gBAAsBL;YAAM;QAClF;QAEA,0DAA0D;QAC1D,IAAIpB,QAAQ4B,QAAQZ,gBAAgBZ,WAAW;YAC7CE;QACF;IACF;IAEA,MAAMuB,cAAc,CAACT;QACnB,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QAEA,IAAIlB,aAAa;YACf,IAAIY,iBAAiBL,OAAO,EAAE;gBAC5BV,QAAQqB,OAAO;oBAAEpB,MAAM;oBAAMwB,UAAU;oBAAOC,MAAM;oBAAyBL;gBAAM;YACrF,OAAO,IAAIP,qBAAqBJ,OAAO,EAAE;gBACvCV,QAAQqB,OAAO;oBAAEpB,MAAM;oBAAMwB,UAAU;oBAAOM,kBAAkB;oBAAML,MAAM;oBAAyBL;gBAAM;gBAC3GP,qBAAqBJ,OAAO,GAAG;YACjC;QACF;IACF;IAEA,kGAAkG;IAClG,8EAA8E;IAC9E,uGAAuG;IACvG,MAAMsB,cAAc,CAACX;QACnB,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QACA,IAAIlB,eAAe,CAACY,iBAAiBL,OAAO,EAAE;YAC5CV,QAAQqB,OAAO;gBAAEpB,MAAM;gBAAMwB,UAAU;gBAAOC,MAAM;gBAAwBL;YAAM;YAClFN,iBAAiBL,OAAO,GAAG;QAC7B;IACF;IAEA,MAAMuB,eAAe,CAACZ;QACpB,IAAIC,iBAAiBD,QAAQ;YAC3B;QACF;QACA,IAAIlB,aAAa;YACfH,QAAQqB,OAAO;gBAAEpB,MAAM;gBAAOwB,UAAU;gBAAOC,MAAM;gBAAyBL;YAAM;QACtF;IACF;QAMiCH;IAJjC,MAAMgB,mBAAmB;QACvBC,IAAIjC;WACDgB,kBAAAA,4BAAAA,MAAOxB,KAAK,AAAf;QACA0C,KAAKjD,cAAcU,YAAYd,mBAAmBmC,QAAQC;QAC1DkB,cAAcnD,iBAAiBgC,CAAAA,4BAAAA,kBAAAA,4BAAAA,MAAOxB,KAAK,CAAC2C,YAAY,cAAzBnB,uCAAAA,4BAA6B1B;QAC5DyC,cAAc/C,iBAAiBD,eAAeiC,kBAAAA,4BAAAA,MAAOxB,KAAK,CAACuC,YAAY,EAAEA;QACzEb,eAAelC,iBAAiBD,eAAeiC,kBAAAA,4BAAAA,MAAOxB,KAAK,CAAC0B,aAAa,EAAEA;QAC3EY,aAAa9C,iBAAiBD,eAAeiC,kBAAAA,4BAAAA,MAAOxB,KAAK,CAACsC,WAAW,EAAEA;QACvEF,aAAa5C,iBAAiBD,eAAeiC,kBAAAA,4BAAAA,MAAOxB,KAAK,CAACoC,WAAW,EAAEA;IACzE;IAEA,MAAMQ,oBAAoB;QACxB,iBAAiB;QACjB,iBAAiB,CAACrC,QAAQ,CAACI,YAAYkC,YAAYtC;QACnD,GAAGiC,gBAAgB;QACnBP,SAASzC,iBAAiBD,eAAeiC,kBAAAA,4BAAAA,MAAOxB,KAAK,CAACiC,OAAO,EAAEA;QAC/DC,WAAW1C,iBAAiBD,eAAeiC,kBAAAA,4BAAAA,MAAOxB,KAAK,CAACkC,SAAS,EAAEA;IACrE;IAEA,MAAMY,8BAA8BnE,mBAClC6C,CAAAA,kBAAAA,4BAAAA,MAAOQ,IAAI,MAAK,YAAYR,CAAAA,kBAAAA,4BAAAA,MAAOQ,IAAI,MAAK,MAAMR,MAAMQ,IAAI,GAAG,OAC/DY;IAGF,OAAO;QACLjC;QACAV,UAAUd,4BACRc,UACAS,gBAAgB8B,mBAAmBtC,2BAA2B0C,oBAAoBE;IAEtF;AACF,EAAE;AAEF,MAAMlB,mBAAmB,CAACD;IACxB,MAAMoB,aAAa,CAACC,KAClBA,GAAGC,YAAY,CAAC,eAAgBD,GAAGC,YAAY,CAAC,oBAAoBD,GAAGE,YAAY,CAAC,qBAAqB;IAC3G,IAAI5D,cAAcqC,MAAMwB,MAAM,KAAKJ,WAAWpB,MAAMwB,MAAM,GAAG;QAC3D,OAAO;IACT;IAEA,OAAO7D,cAAcqC,MAAMyB,aAAa,KAAKL,WAAWpB,MAAMyB,aAAa;AAC7E"}
+{"version":3,"sources":["../src/components/MenuTrigger/useMenuTrigger.ts"],"sourcesContent":["'use client';\n\nimport { 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  getReactElementRef,\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) || event.isDefaultPrevented()) {\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, getReactElementRef(child), 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":["useARIAButtonProps","ArrowRight","ArrowLeft","Escape","ArrowDown","useFluent_unstable","useFluent","useFocusFinders","applyTriggerPropsToChildren","getTriggerChild","getReactElementRef","isHTMLElement","mergeCallbacks","useEventCallback","useMergedRefs","React","useMenuContext_unstable","useIsSubmenu","useOnMenuSafeZoneTimeout","noop","useMenuTrigger_unstable","props","children","disableButtonEnhancement","triggerRef","context","menuPopoverRef","setOpen","open","triggerId","openOnHover","openOnContext","isSubmenu","findFirstFocusable","focusFirst","useCallback","firstFocusable","current","focus","openedWithKeyboardRef","useRef","openedViaSafeZoneRef","hasMouseMovedRef","dir","OpenArrowKey","child","safeZoneHandlerRef","onContextMenu","event","isTargetDisabled","isDefaultPrevented","preventDefault","keyboard","type","onClick","onKeyDown","key","onMouseOver","ignoreHoverDelay","onMouseMove","onMouseLeave","contextMenuProps","id","ref","onMouseEnter","triggerChildProps","undefined","ariaButtonTriggerChildProps","isDisabled","el","hasAttribute","getAttribute","target","currentTarget"],"mappings":"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"}

package/lib/contexts/menuContext.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { createContext, useContextSelector } from '@fluentui/react-context-selector';
 export const MenuContext = createContext(undefined);

package/lib/contexts/menuContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/menuContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { ContextSelector, Context } from '@fluentui/react-context-selector';\nimport type { MenuState } from '../components/Menu/index';\n\nexport const MenuContext: Context<MenuContextValue> = createContext<MenuContextValue | undefined>(\n  undefined,\n) as Context<MenuContextValue>;\n\nconst menuContextDefaultValue: MenuContextValue = {\n  open: false,\n  setOpen: () => false,\n  checkedValues: {},\n  onCheckedValueChange: () => null,\n  isSubmenu: false,\n  triggerRef: { current: null } as unknown as React.MutableRefObject<HTMLElement | null>,\n  menuPopoverRef: { current: null } as unknown as React.MutableRefObject<HTMLElement | null>,\n  mountNode: null,\n  triggerId: '',\n  openOnContext: false,\n  openOnHover: false,\n  hasIcons: false,\n  hasCheckmarks: false,\n  inline: false,\n  persistOnItemClick: false,\n};\n\n/**\n * Context shared between Menu and its children components\n *\n * Extends and drills down MenuList props to simplify API\n */\nexport type MenuContextValue = Pick<\n  MenuState,\n  | 'openOnHover'\n  | 'openOnContext'\n  | 'triggerRef'\n  | 'menuPopoverRef'\n  | 'setOpen'\n  | 'isSubmenu'\n  | 'mountNode'\n  | 'triggerId'\n  | 'hasIcons'\n  | 'hasCheckmarks'\n  | 'persistOnItemClick'\n  | 'inline'\n  | 'checkedValues'\n  | 'onCheckedValueChange'\n  | 'safeZone'\n> & {\n  open: boolean;\n  triggerId: string;\n  /**\n   * Default values to be checked on mount\n   * @deprecated this property is not used internally anymore,\n   * the signature remains just to avoid breaking changes\n   */\n  defaultCheckedValues?: Record<string, string[]>;\n};\n\nexport const MenuProvider = MenuContext.Provider;\n\nexport const useMenuContext_unstable = <T>(selector: ContextSelector<MenuContextValue, T>): T =>\n  useContextSelector(MenuContext, (ctx = menuContextDefaultValue) => selector(ctx));\n"],"names":["React","createContext","useContextSelector","MenuContext","undefined","menuContextDefaultValue","open","setOpen","checkedValues","onCheckedValueChange","isSubmenu","triggerRef","current","menuPopoverRef","mountNode","triggerId","openOnContext","openOnHover","hasIcons","hasCheckmarks","inline","persistOnItemClick","MenuProvider","Provider","useMenuContext_unstable","selector","ctx"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,mCAAmC;AAIrF,OAAO,MAAMC,cAAyCF,cACpDG,WAC6B;AAE/B,MAAMC,0BAA4C;IAChDC,MAAM;IACNC,SAAS,IAAM;IACfC,eAAe,CAAC;IAChBC,sBAAsB,IAAM;IAC5BC,WAAW;IACXC,YAAY;QAAEC,SAAS;IAAK;IAC5BC,gBAAgB;QAAED,SAAS;IAAK;IAChCE,WAAW;IACXC,WAAW;IACXC,eAAe;IACfC,aAAa;IACbC,UAAU;IACVC,eAAe;IACfC,QAAQ;IACRC,oBAAoB;AACtB;AAmCA,OAAO,MAAMC,eAAenB,YAAYoB,QAAQ,CAAC;AAEjD,OAAO,MAAMC,0BAA0B,CAAIC,WACzCvB,mBAAmBC,aAAa,CAACuB,MAAMrB,uBAAuB,GAAKoB,SAASC,MAAM"}
+{"version":3,"sources":["../src/contexts/menuContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { ContextSelector, Context } from '@fluentui/react-context-selector';\nimport type { MenuState } from '../components/Menu/index';\n\nexport const MenuContext: Context<MenuContextValue> = createContext<MenuContextValue | undefined>(\n  undefined,\n) as Context<MenuContextValue>;\n\nconst menuContextDefaultValue: MenuContextValue = {\n  open: false,\n  setOpen: () => false,\n  checkedValues: {},\n  onCheckedValueChange: () => null,\n  isSubmenu: false,\n  triggerRef: { current: null } as unknown as React.MutableRefObject<HTMLElement | null>,\n  menuPopoverRef: { current: null } as unknown as React.MutableRefObject<HTMLElement | null>,\n  mountNode: null,\n  triggerId: '',\n  openOnContext: false,\n  openOnHover: false,\n  hasIcons: false,\n  hasCheckmarks: false,\n  inline: false,\n  persistOnItemClick: false,\n};\n\n/**\n * Context shared between Menu and its children components\n *\n * Extends and drills down MenuList props to simplify API\n */\nexport type MenuContextValue = Pick<\n  MenuState,\n  | 'openOnHover'\n  | 'openOnContext'\n  | 'triggerRef'\n  | 'menuPopoverRef'\n  | 'setOpen'\n  | 'isSubmenu'\n  | 'mountNode'\n  | 'triggerId'\n  | 'hasIcons'\n  | 'hasCheckmarks'\n  | 'persistOnItemClick'\n  | 'inline'\n  | 'checkedValues'\n  | 'onCheckedValueChange'\n  | 'safeZone'\n> & {\n  open: boolean;\n  triggerId: string;\n  /**\n   * Default values to be checked on mount\n   * @deprecated this property is not used internally anymore,\n   * the signature remains just to avoid breaking changes\n   */\n  defaultCheckedValues?: Record<string, string[]>;\n};\n\nexport const MenuProvider = MenuContext.Provider;\n\nexport const useMenuContext_unstable = <T>(selector: ContextSelector<MenuContextValue, T>): T =>\n  useContextSelector(MenuContext, (ctx = menuContextDefaultValue) => selector(ctx));\n"],"names":["React","createContext","useContextSelector","MenuContext","undefined","menuContextDefaultValue","open","setOpen","checkedValues","onCheckedValueChange","isSubmenu","triggerRef","current","menuPopoverRef","mountNode","triggerId","openOnContext","openOnHover","hasIcons","hasCheckmarks","inline","persistOnItemClick","MenuProvider","Provider","useMenuContext_unstable","selector","ctx"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,mCAAmC;AAIrF,OAAO,MAAMC,cAAyCF,cACpDG,WAC6B;AAE/B,MAAMC,0BAA4C;IAChDC,MAAM;IACNC,SAAS,IAAM;IACfC,eAAe,CAAC;IAChBC,sBAAsB,IAAM;IAC5BC,WAAW;IACXC,YAAY;QAAEC,SAAS;IAAK;IAC5BC,gBAAgB;QAAED,SAAS;IAAK;IAChCE,WAAW;IACXC,WAAW;IACXC,eAAe;IACfC,aAAa;IACbC,UAAU;IACVC,eAAe;IACfC,QAAQ;IACRC,oBAAoB;AACtB;AAmCA,OAAO,MAAMC,eAAenB,YAAYoB,QAAQ,CAAC;AAEjD,OAAO,MAAMC,0BAA0B,CAAIC,WACzCvB,mBAAmBC,aAAa,CAACuB,MAAMrB,uBAAuB,GAAKoB,SAASC,MAAM"}

package/lib/contexts/menuGroupContext.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 const MenuGroupContext = React.createContext(undefined);
 const menuGroupContextDefaultValue = {

package/lib/contexts/menuGroupContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/menuGroupContext.ts"],"sourcesContent":["import * as React from 'react';\n\nconst MenuGroupContext = React.createContext<MenuGroupContextValue | undefined>(\n  undefined,\n) as React.Context<MenuGroupContextValue>;\n\nconst menuGroupContextDefaultValue: MenuGroupContextValue = {\n  headerId: '',\n};\n\n/**\n * Context used to guarantee correct aria-relationship between header\n * and group information\n */\nexport type MenuGroupContextValue = {\n  /**\n   * Element id applied to the `MenuGroupHeader` component\n   */\n  headerId: string;\n};\n\nexport const MenuGroupContextProvider = MenuGroupContext.Provider;\nexport const useMenuGroupContext_unstable = (): MenuGroupContextValue =>\n  React.useContext(MenuGroupContext) ?? menuGroupContextDefaultValue;\n"],"names":["React","MenuGroupContext","createContext","undefined","menuGroupContextDefaultValue","headerId","MenuGroupContextProvider","Provider","useMenuGroupContext_unstable","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,MAAMC,mBAAmBD,MAAME,aAAa,CAC1CC;AAGF,MAAMC,+BAAsD;IAC1DC,UAAU;AACZ;AAaA,OAAO,MAAMC,2BAA2BL,iBAAiBM,QAAQ,CAAC;AAClE,OAAO,MAAMC,+BAA+B;QAC1CR;WAAAA,CAAAA,oBAAAA,MAAMS,UAAU,CAACR,+BAAjBD,+BAAAA,oBAAsCI;EAA6B"}
+{"version":3,"sources":["../src/contexts/menuGroupContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nconst MenuGroupContext = React.createContext<MenuGroupContextValue | undefined>(\n  undefined,\n) as React.Context<MenuGroupContextValue>;\n\nconst menuGroupContextDefaultValue: MenuGroupContextValue = {\n  headerId: '',\n};\n\n/**\n * Context used to guarantee correct aria-relationship between header\n * and group information\n */\nexport type MenuGroupContextValue = {\n  /**\n   * Element id applied to the `MenuGroupHeader` component\n   */\n  headerId: string;\n};\n\nexport const MenuGroupContextProvider = MenuGroupContext.Provider;\nexport const useMenuGroupContext_unstable = (): MenuGroupContextValue =>\n  React.useContext(MenuGroupContext) ?? menuGroupContextDefaultValue;\n"],"names":["React","MenuGroupContext","createContext","undefined","menuGroupContextDefaultValue","headerId","MenuGroupContextProvider","Provider","useMenuGroupContext_unstable","useContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,MAAMC,mBAAmBD,MAAME,aAAa,CAC1CC;AAGF,MAAMC,+BAAsD;IAC1DC,UAAU;AACZ;AAaA,OAAO,MAAMC,2BAA2BL,iBAAiBM,QAAQ,CAAC;AAClE,OAAO,MAAMC,+BAA+B;QAC1CR;WAAAA,CAAAA,oBAAAA,MAAMS,UAAU,CAACR,+BAAjBD,+BAAAA,oBAAsCI;EAA6B"}

package/lib/contexts/menuListContext.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { createContext, useContextSelector } from '@fluentui/react-context-selector';
 export const MenuListContext = createContext(undefined);

package/lib/contexts/menuListContext.js.map

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

package/lib/contexts/menuSplitGroupContext.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 /**
  * Context used communicate with a child menu item that it is a trigger for a submenu

package/lib/contexts/menuSplitGroupContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/menuSplitGroupContext.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type MenuSplitGroupContextValue = {\n  setMultiline: (multiline: boolean) => void;\n};\n\n/**\n * Context used communicate with a child menu item that it is a trigger for a submenu\n */\nconst MenuSplitGroupContext = React.createContext<MenuSplitGroupContextValue | undefined>(\n  undefined,\n) as React.Context<MenuSplitGroupContextValue>;\n\nexport const menuSplitGroupContextDefaultValue = {\n  setMultiline: (): null => null,\n};\n\nexport const MenuSplitGroupContextProvider = MenuSplitGroupContext.Provider;\nexport const useMenuSplitGroupContext_unstable = (): MenuSplitGroupContextValue =>\n  React.useContext(MenuSplitGroupContext) ?? menuSplitGroupContextDefaultValue;\n\nexport const useIsInMenuSplitGroup = (): boolean => {\n  const context = useMenuSplitGroupContext_unstable();\n  return context !== menuSplitGroupContextDefaultValue;\n};\n"],"names":["React","MenuSplitGroupContext","createContext","undefined","menuSplitGroupContextDefaultValue","setMultiline","MenuSplitGroupContextProvider","Provider","useMenuSplitGroupContext_unstable","useContext","useIsInMenuSplitGroup","context"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAM/B;;CAEC,GACD,MAAMC,wBAAwBD,MAAME,aAAa,CAC/CC;AAGF,OAAO,MAAMC,oCAAoC;IAC/CC,cAAc,IAAY;AAC5B,EAAE;AAEF,OAAO,MAAMC,gCAAgCL,sBAAsBM,QAAQ,CAAC;AAC5E,OAAO,MAAMC,oCAAoC;QAC/CR;WAAAA,CAAAA,oBAAAA,MAAMS,UAAU,CAACR,oCAAjBD,+BAAAA,oBAA2CI;EAAkC;AAE/E,OAAO,MAAMM,wBAAwB;IACnC,MAAMC,UAAUH;IAChB,OAAOG,YAAYP;AACrB,EAAE"}
+{"version":3,"sources":["../src/contexts/menuSplitGroupContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nexport type MenuSplitGroupContextValue = {\n  setMultiline: (multiline: boolean) => void;\n};\n\n/**\n * Context used communicate with a child menu item that it is a trigger for a submenu\n */\nconst MenuSplitGroupContext = React.createContext<MenuSplitGroupContextValue | undefined>(\n  undefined,\n) as React.Context<MenuSplitGroupContextValue>;\n\nexport const menuSplitGroupContextDefaultValue = {\n  setMultiline: (): null => null,\n};\n\nexport const MenuSplitGroupContextProvider = MenuSplitGroupContext.Provider;\nexport const useMenuSplitGroupContext_unstable = (): MenuSplitGroupContextValue =>\n  React.useContext(MenuSplitGroupContext) ?? menuSplitGroupContextDefaultValue;\n\nexport const useIsInMenuSplitGroup = (): boolean => {\n  const context = useMenuSplitGroupContext_unstable();\n  return context !== menuSplitGroupContextDefaultValue;\n};\n"],"names":["React","MenuSplitGroupContext","createContext","undefined","menuSplitGroupContextDefaultValue","setMultiline","MenuSplitGroupContextProvider","Provider","useMenuSplitGroupContext_unstable","useContext","useIsInMenuSplitGroup","context"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAM/B;;CAEC,GACD,MAAMC,wBAAwBD,MAAME,aAAa,CAC/CC;AAGF,OAAO,MAAMC,oCAAoC;IAC/CC,cAAc,IAAY;AAC5B,EAAE;AAEF,OAAO,MAAMC,gCAAgCL,sBAAsBM,QAAQ,CAAC;AAC5E,OAAO,MAAMC,oCAAoC;QAC/CR;WAAAA,CAAAA,oBAAAA,MAAMS,UAAU,CAACR,oCAAjBD,+BAAAA,oBAA2CI;EAAkC;AAE/E,OAAO,MAAMM,wBAAwB;IACnC,MAAMC,UAAUH;IAChB,OAAOG,YAAYP;AACrB,EAAE"}

package/lib/contexts/menuTriggerContext.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 /**
  * Context used communicate with a child menu item that it is a trigger for a submenu

package/lib/contexts/menuTriggerContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/menuTriggerContext.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Context used communicate with a child menu item that it is a trigger for a submenu\n */\nconst MenuTriggerContext = React.createContext<boolean | undefined>(undefined) as React.Context<boolean>;\n\nconst menuTriggerContextDefaultValue = false;\n\nexport const MenuTriggerContextProvider = MenuTriggerContext.Provider;\nexport const useMenuTriggerContext_unstable = (): boolean =>\n  React.useContext(MenuTriggerContext) ?? menuTriggerContextDefaultValue;\n"],"names":["React","MenuTriggerContext","createContext","undefined","menuTriggerContextDefaultValue","MenuTriggerContextProvider","Provider","useMenuTriggerContext_unstable","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B;;CAEC,GACD,MAAMC,qBAAqBD,MAAME,aAAa,CAAsBC;AAEpE,MAAMC,iCAAiC;AAEvC,OAAO,MAAMC,6BAA6BJ,mBAAmBK,QAAQ,CAAC;AACtE,OAAO,MAAMC,iCAAiC;QAC5CP;WAAAA,CAAAA,oBAAAA,MAAMQ,UAAU,CAACP,iCAAjBD,+BAAAA,oBAAwCI;EAA+B"}
+{"version":3,"sources":["../src/contexts/menuTriggerContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\n/**\n * Context used communicate with a child menu item that it is a trigger for a submenu\n */\nconst MenuTriggerContext = React.createContext<boolean | undefined>(undefined) as React.Context<boolean>;\n\nconst menuTriggerContextDefaultValue = false;\n\nexport const MenuTriggerContextProvider = MenuTriggerContext.Provider;\nexport const useMenuTriggerContext_unstable = (): boolean =>\n  React.useContext(MenuTriggerContext) ?? menuTriggerContextDefaultValue;\n"],"names":["React","MenuTriggerContext","createContext","undefined","menuTriggerContextDefaultValue","MenuTriggerContextProvider","Provider","useMenuTriggerContext_unstable","useContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B;;CAEC,GACD,MAAMC,qBAAqBD,MAAME,aAAa,CAAsBC;AAEpE,MAAMC,iCAAiC;AAEvC,OAAO,MAAMC,6BAA6BJ,mBAAmBK,QAAQ,CAAC;AACtE,OAAO,MAAMC,iCAAiC;QAC5CP;WAAAA,CAAAA,oBAAAA,MAAMQ,UAAU,CAACP,iCAAjBD,+BAAAA,oBAAwCI;EAA+B"}

package/lib/selectable/useCheckmarkStyles.styles.js

@@ -1,3 +1,5 @@
+'use client';
+
 import { mergeClasses, __styles } from '@griffel/react';
 const useStyles = /*#__PURE__*/__styles({
   root: {

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

@@ -1 +1 @@
-{"version":3,"names":["mergeClasses","__styles","useStyles","root","a9b677","Bqenvij","Bcdw1i0","Bnnss6s","rootChecked","d","useCheckmarkStyles_unstable","state","styles","checkmark","className","checked"],"sources":["useCheckmarkStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nconst useStyles = makeStyles({\n    root: {\n        width: '16px',\n        height: '16px',\n        visibility: 'hidden',\n        flexShrink: 0\n    },\n    rootChecked: {\n        visibility: 'visible',\n        flexShrink: 0\n    }\n});\n/**\n * Applies styles to a checkmark slot for selectable menu items\n *\n * @param state - should contain a `checkmark` slot\n */ export const useCheckmarkStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    if (state.checkmark) {\n        state.checkmark.className = mergeClasses(styles.root, state.checked && styles.rootChecked, state.checkmark.className);\n    }\n};\n"],"mappings":"AAAA,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,MAAMC,SAAS,gBAAGD,QAAA;EAAAE,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAC,WAAA;IAAAF,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAWjB,CAAC;AACF;AACA;AACA;AACA;AACA;AAAI,OAAO,MAAMC,2BAA2B,GAAIC,KAAK,IAAG;EACpD,aAAa;;EACb,MAAMC,MAAM,GAAGV,SAAS,CAAC,CAAC;EAC1B,IAAIS,KAAK,CAACE,SAAS,EAAE;IACjBF,KAAK,CAACE,SAAS,CAACC,SAAS,GAAGd,YAAY,CAACY,MAAM,CAACT,IAAI,EAAEQ,KAAK,CAACI,OAAO,IAAIH,MAAM,CAACJ,WAAW,EAAEG,KAAK,CAACE,SAAS,CAACC,SAAS,CAAC;EACzH;AACJ,CAAC","ignoreList":[]}
+{"version":3,"names":["mergeClasses","__styles","useStyles","root","a9b677","Bqenvij","Bcdw1i0","Bnnss6s","rootChecked","d","useCheckmarkStyles_unstable","state","styles","checkmark","className","checked"],"sources":["useCheckmarkStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nconst useStyles = makeStyles({\n    root: {\n        width: '16px',\n        height: '16px',\n        visibility: 'hidden',\n        flexShrink: 0\n    },\n    rootChecked: {\n        visibility: 'visible',\n        flexShrink: 0\n    }\n});\n/**\n * Applies styles to a checkmark slot for selectable menu items\n *\n * @param state - should contain a `checkmark` slot\n */ export const useCheckmarkStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    if (state.checkmark) {\n        state.checkmark.className = mergeClasses(styles.root, state.checked && styles.rootChecked, state.checkmark.className);\n    }\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,MAAMC,SAAS,gBAAGD,QAAA;EAAAE,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAC,WAAA;IAAAF,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAWjB,CAAC;AACF;AACA;AACA;AACA;AACA;AAAI,OAAO,MAAMC,2BAA2B,GAAIC,KAAK,IAAG;EACpD,aAAa;;EACb,MAAMC,MAAM,GAAGV,SAAS,CAAC,CAAC;EAC1B,IAAIS,KAAK,CAACE,SAAS,EAAE;IACjBF,KAAK,CAACE,SAAS,CAACC,SAAS,GAAGd,YAAY,CAACY,MAAM,CAACT,IAAI,EAAEQ,KAAK,CAACI,OAAO,IAAIH,MAAM,CAACJ,WAAW,EAAEG,KAAK,CAACE,SAAS,CAACC,SAAS,CAAC;EACzH;AACJ,CAAC","ignoreList":[]}

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

@@ -1,3 +1,4 @@
+'use client';
 import { mergeClasses, makeStyles } from '@griffel/react';
 const useStyles = makeStyles({
     root: {