@fluentui-react-native/menu 1.4.9 → 1.4.11

package/src/MenuItem/MenuItem.styling.ts

@@ -1,9 +1,10 @@
 import type { Theme, UseStylingOptions } from '@fluentui-react-native/framework';
 import { buildProps } from '@fluentui-react-native/framework';
 import { borderStyles, fontStyles, layoutStyles } from '@fluentui-react-native/tokens';
-import { defaultMenuItemTokens } from './MenuItemTokens';
+
 import type { MenuItemProps, MenuItemTokens, MenuItemSlotProps } from './MenuItem.types';
 import { menuItemName } from './MenuItem.types';
+import { defaultMenuItemTokens } from './MenuItemTokens';
 
 export const menuItemStates: (keyof MenuItemTokens)[] = ['hovered', 'focused', 'pressed', 'disabled'];
 

package/src/MenuItem/MenuItem.tsx

@@ -1,14 +1,16 @@
 /** @jsx withSlots */
+import React from 'react';
 import { I18nManager, Pressable, View } from 'react-native';
-import { SvgXml } from 'react-native-svg';
+
 import type { UseSlots } from '@fluentui-react-native/framework';
 import { compose, memoize, mergeProps, withSlots } from '@fluentui-react-native/framework';
 import { TextV1 as Text } from '@fluentui-react-native/text';
+import { SvgXml } from 'react-native-svg';
+
+import { stylingSettings } from './MenuItem.styling';
 import type { MenuItemProps, MenuItemType } from './MenuItem.types';
 import { menuItemName } from './MenuItem.types';
 import { useMenuItem } from './useMenuItem';
-import { stylingSettings } from './MenuItem.styling';
-import React from 'react';
 
 export const MenuItem = compose<MenuItemType>({
   displayName: menuItemName,

package/src/MenuItem/MenuItem.types.ts

@@ -1,10 +1,11 @@
 import type * as React from 'react';
 import type { ColorValue } from 'react-native';
-import type { XmlProps } from 'react-native-svg';
+
 import type { IViewProps } from '@fluentui-react-native/adapters';
-import type { TextProps } from '@fluentui-react-native/text';
 import type { IFocusable, InteractionEvent, PressablePropsExtended, PressableState } from '@fluentui-react-native/interactive-hooks';
+import type { TextProps } from '@fluentui-react-native/text';
 import type { FontTokens, IBorderTokens, IColorTokens, LayoutTokens } from '@fluentui-react-native/tokens';
+import type { XmlProps } from 'react-native-svg';
 
 export const menuItemName = 'MenuItem';
 

package/src/MenuItem/MenuItemTokens.macos.ts

@@ -1,6 +1,7 @@
 import type { FontWeightValue, Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuItemTokens } from './MenuItem.types';
 
 export const defaultMenuItemTokens: TokenSettings<MenuItemTokens, Theme> = (t: Theme): MenuItemTokens => ({

package/src/MenuItem/MenuItemTokens.ts

@@ -1,6 +1,7 @@
 import type { FontWeightValue, Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuItemTokens } from './MenuItem.types';
 
 export const defaultMenuItemTokens: TokenSettings<MenuItemTokens, Theme> = (t: Theme): MenuItemTokens => ({

package/src/MenuItem/MenuItemTokens.win32.ts

@@ -1,6 +1,7 @@
 import type { FontWeightValue, Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuItemTokens } from './MenuItem.types';
 
 export const defaultMenuItemTokens: TokenSettings<MenuItemTokens, Theme> = (t: Theme): MenuItemTokens => ({

package/src/MenuItem/useMenuItem.ts

@@ -1,10 +1,12 @@
 import * as React from 'react';
 import type { AccessibilityState } from 'react-native';
 import { I18nManager, Platform } from 'react-native';
-import type { MenuItemProps, MenuItemInfo } from './MenuItem.types';
+
 import { memoize } from '@fluentui-react-native/framework';
 import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import { isKeyPressEvent, usePressableState, useKeyDownProps, useViewCommandFocus } from '@fluentui-react-native/interactive-hooks';
+
+import type { MenuItemProps, MenuItemInfo } from './MenuItem.types';
 import { useMenuContext } from '../context/menuContext';
 import { useMenuListContext } from '../context/menuListContext';
 import { useMenuTriggerContext } from '../context/menuTriggerContext';

package/src/MenuItemCheckbox/MenuItemCheckbox.styling.ts

@@ -1,9 +1,10 @@
 import type { Theme, UseStylingOptions } from '@fluentui-react-native/framework';
 import { buildProps } from '@fluentui-react-native/framework';
 import { borderStyles, fontStyles, layoutStyles } from '@fluentui-react-native/tokens';
-import { defaultMenuItemCheckboxTokens } from './MenuItemCheckboxTokens';
+
 import type { MenuItemCheckboxProps, MenuItemCheckboxTokens, MenuItemCheckboxSlotProps } from './MenuItemCheckbox.types';
 import { menuItemCheckboxName } from './MenuItemCheckbox.types';
+import { defaultMenuItemCheckboxTokens } from './MenuItemCheckboxTokens';
 
 export const menuItemCheckboxStates: (keyof MenuItemCheckboxTokens)[] = ['hovered', 'focused', 'pressed', 'disabled', 'checked'];
 

package/src/MenuItemCheckbox/MenuItemCheckbox.tsx

@@ -1,9 +1,13 @@
 /** @jsx withSlots */
+import React from 'react';
 import { Pressable } from 'react-native';
-import { SvgXml } from 'react-native-svg';
+
 import type { Slots, UseSlots } from '@fluentui-react-native/framework';
 import { compose, mergeProps, withSlots } from '@fluentui-react-native/framework';
 import { TextV1 as Text } from '@fluentui-react-native/text';
+import { SvgXml } from 'react-native-svg';
+
+import { stylingSettings } from './MenuItemCheckbox.styling';
 import type {
   MenuItemCheckboxProps,
   MenuItemCheckboxSlotProps,
@@ -12,9 +16,7 @@ import type {
 } from './MenuItemCheckbox.types';
 import { menuItemCheckboxName } from './MenuItemCheckbox.types';
 import { useMenuItemCheckbox } from './useMenuItemCheckbox';
-import { stylingSettings } from './MenuItemCheckbox.styling';
 import { getAccessibilityLabel, getTooltip } from '../MenuItem/MenuItem';
-import React from 'react';
 
 export const MenuItemCheckbox = compose<MenuItemCheckboxType>({
   displayName: menuItemCheckboxName,

package/src/MenuItemCheckbox/MenuItemCheckbox.types.ts

@@ -1,8 +1,10 @@
 import type * as React from 'react';
 import type { ColorValue } from 'react-native';
-import type { XmlProps } from 'react-native-svg';
-import type { TextProps } from '@fluentui-react-native/text';
+
 import type { PressablePropsExtended, PressableState } from '@fluentui-react-native/interactive-hooks';
+import type { TextProps } from '@fluentui-react-native/text';
+import type { XmlProps } from 'react-native-svg';
+
 import type { MenuItemProps, MenuItemTokens } from '../MenuItem/MenuItem.types';
 
 export const menuItemCheckboxName = 'MenuItemCheckbox';

package/src/MenuItemCheckbox/MenuItemCheckboxTokens.macos.ts

@@ -1,6 +1,7 @@
 import type { FontWeightValue, Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuItemCheckboxTokens } from './MenuItemCheckbox.types';
 
 export const defaultMenuItemCheckboxTokens: TokenSettings<MenuItemCheckboxTokens, Theme> = (t: Theme): MenuItemCheckboxTokens => ({

package/src/MenuItemCheckbox/MenuItemCheckboxTokens.ts

@@ -1,6 +1,7 @@
 import type { FontWeightValue, Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuItemCheckboxTokens } from './MenuItemCheckbox.types';
 
 export const defaultMenuItemCheckboxTokens: TokenSettings<MenuItemCheckboxTokens, Theme> = (t: Theme): MenuItemCheckboxTokens => ({

package/src/MenuItemCheckbox/MenuItemCheckboxTokens.win32.ts

@@ -1,6 +1,7 @@
 import type { FontWeightValue, Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuItemCheckboxTokens } from './MenuItemCheckbox.types';
 
 export const defaultMenuItemCheckboxTokens: TokenSettings<MenuItemCheckboxTokens, Theme> = (t: Theme): MenuItemCheckboxTokens => ({

package/src/MenuItemCheckbox/useMenuItemCheckbox.ts

@@ -1,13 +1,15 @@
 import * as React from 'react';
 import type { AccessibilityActionEvent, AccessibilityState } from 'react-native';
 import { I18nManager, Platform } from 'react-native';
-import type { MenuItemCheckboxProps, MenuItemCheckboxInfo } from './MenuItemCheckbox.types';
+
 import { memoize } from '@fluentui-react-native/framework';
 import type { InteractionEvent, KeyPressEvent } from '@fluentui-react-native/interactive-hooks';
 import { usePressableState, useKeyDownProps, useOnPressWithFocus, useViewCommandFocus } from '@fluentui-react-native/interactive-hooks';
+
+import type { MenuItemCheckboxProps, MenuItemCheckboxInfo } from './MenuItemCheckbox.types';
+import { useMenuContext } from '../context/menuContext';
 import { useMenuListContext } from '../context/menuListContext';
 import { submenuTriggerKeys, triggerKeys, useHoverFocusEffect } from '../MenuItem/useMenuItem';
-import { useMenuContext } from '../context/menuContext';
 
 const defaultAccessibilityActions = [{ name: 'Toggle' }];
 

package/src/MenuItemRadio/MenuItemRadio.tsx

@@ -1,4 +1,5 @@
 import type { UseSlots } from '@fluentui-react-native/framework';
+
 import { useMenuItemRadio } from './useMenuItemRadio';
 import { MenuItemCheckbox, menuItemFinalRender } from '../MenuItemCheckbox/MenuItemCheckbox';
 import type { MenuItemCheckboxProps, MenuItemCheckboxType } from '../MenuItemCheckbox/MenuItemCheckbox.types';

package/src/MenuItemRadio/useMenuItemRadio.ts

@@ -1,9 +1,11 @@
 import * as React from 'react';
+
 import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
+
+import { useMenuContext } from '../context/menuContext';
 import { useMenuListContext } from '../context/menuListContext';
 import type { MenuItemCheckboxProps, MenuItemCheckboxInfo } from '../MenuItemCheckbox/MenuItemCheckbox.types';
 import { useMenuCheckboxInteraction } from '../MenuItemCheckbox/useMenuItemCheckbox';
-import { useMenuContext } from '../context/menuContext';
 
 export const useMenuItemRadio = (props: MenuItemCheckboxProps): MenuItemCheckboxInfo => {
   const { disabled, name, persistOnClick } = props;

package/src/MenuList/MenuList.styling.ts

@@ -1,9 +1,10 @@
 import type { Theme, UseStylingOptions } from '@fluentui-react-native/framework';
 import { buildProps } from '@fluentui-react-native/framework';
 import { layoutStyles } from '@fluentui-react-native/tokens';
-import { defaultMenuListTokens } from './MenuListTokens';
+
 import type { MenuListProps, MenuListTokens, MenuListSlotProps } from './MenuList.types';
 import { menuListName } from './MenuList.types';
+import { defaultMenuListTokens } from './MenuListTokens';
 
 export const menuListStates: (keyof MenuListTokens)[] = ['hasMaxHeight'];
 

package/src/MenuList/MenuList.tsx

@@ -1,17 +1,19 @@
 /** @jsx withSlots */
 import React from 'react';
 import { Platform, ScrollView, View } from 'react-native';
+
+import type { IViewProps } from '@fluentui-react-native/adapters';
+import { FocusZone } from '@fluentui-react-native/focus-zone';
 import type { UseSlots } from '@fluentui-react-native/framework';
 import { compose, mergeProps, stagedComponent, withSlots } from '@fluentui-react-native/framework';
+
+import { stylingSettings } from './MenuList.styling';
 import type { MenuListProps, MenuListState, MenuListType } from './MenuList.types';
 import { menuListName } from './MenuList.types';
-import { stylingSettings } from './MenuList.styling';
-import { MenuListProvider } from '../context/menuListContext';
 import { useMenuList } from './useMenuList';
 import { useMenuListContextValue } from './useMenuListContextValue';
-import type { IViewProps } from '@fluentui-react-native/adapters';
-import { FocusZone } from '@fluentui-react-native/focus-zone';
 import { useMenuContext } from '../context';
+import { MenuListProvider } from '../context/menuListContext';
 
 const MenuStack = stagedComponent((props: React.PropsWithRef<IViewProps> & { gap?: number }) => {
   const { gap, ...rest } = props;

package/src/MenuList/MenuList.types.ts

@@ -1,9 +1,10 @@
+import type React from 'react';
+import type { ScrollViewProps } from 'react-native';
+
 import type { IViewProps } from '@fluentui-react-native/adapters';
 import type { FocusZoneProps } from '@fluentui-react-native/focus-zone';
 import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import type { IBackgroundColorTokens, LayoutTokens } from '@fluentui-react-native/tokens';
-import type React from 'react';
-import type { ScrollViewProps } from 'react-native';
 
 export const menuListName = 'MenuList';
 

package/src/MenuList/MenuListTokens.macos.ts

@@ -1,6 +1,7 @@
 import type { Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuListTokens } from './MenuList.types';
 
 export const defaultMenuListTokens: TokenSettings<MenuListTokens, Theme> = (t: Theme): MenuListTokens => ({

package/src/MenuList/MenuListTokens.ts

@@ -1,6 +1,7 @@
 import type { Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuListTokens } from './MenuList.types';
 
 export const defaultMenuListTokens: TokenSettings<MenuListTokens, Theme> = (t: Theme): MenuListTokens => ({

package/src/MenuList/MenuListTokens.win32.ts

@@ -1,6 +1,7 @@
 import type { Theme } from '@fluentui-react-native/framework';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
+
 import type { MenuListTokens } from './MenuList.types';
 
 export const defaultMenuListTokens: TokenSettings<MenuListTokens, Theme> = (t: Theme): MenuListTokens => ({

package/src/MenuList/useMenuList.ts

@@ -1,7 +1,9 @@
-import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import React from 'react';
-import { useMenuContext } from '../context/menuContext';
+
+import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
+
 import type { MenuListProps, MenuListState } from './MenuList.types';
+import { useMenuContext } from '../context/menuContext';
 
 // Track the radio items so we know what to clear selection from when selectRadio is called
 // Purposefully left out of the hook because

package/src/MenuList/useMenuListContextValue.ts

@@ -1,5 +1,5 @@
-import type { MenuListContextValue } from '../context/menuListContext';
 import type { MenuListState } from './MenuList.types';
+import type { MenuListContextValue } from '../context/menuListContext';
 
 export const useMenuListContextValue = (state: MenuListState): MenuListContextValue => {
   return { hasCheckmarks: state.props.hasCheckmarks, hasTooltips: state.props.hasTooltips, ...state };

package/src/MenuPopover/MenuPopover.tsx

@@ -1,12 +1,14 @@
 import React from 'react';
+import { Platform, View } from 'react-native';
+
+import { Callout } from '@fluentui-react-native/callout';
 import type { UseTokens } from '@fluentui-react-native/framework';
 import { compressible, mergeProps, patchTokens, useFluentTheme } from '@fluentui-react-native/framework';
-import { Callout } from '@fluentui-react-native/callout';
+
 import type { MenuPopoverProps, MenuPopoverTokens } from './MenuPopover.types';
 import { menuPopoverName } from './MenuPopover.types';
-import { useMenuPopover } from './useMenuPopover';
 import { useMenuPopoverTokens } from './MenuPopoverTokens';
-import { Platform, View } from 'react-native';
+import { useMenuPopover } from './useMenuPopover';
 import { useMenuContext } from '../context';
 
 export const MenuPopover = compressible<MenuPopoverProps, MenuPopoverTokens>(

package/src/MenuPopover/MenuPopoverTokens.ts

@@ -1,5 +1,6 @@
 import type { Theme } from '@fluentui-react-native/framework';
 import { buildUseTokens } from '@fluentui-react-native/framework';
+
 import type { MenuPopoverTokens } from './MenuPopover.types';
 import { menuPopoverName } from './MenuPopover.types';
 

package/src/MenuPopover/useMenuPopover.ts

@@ -1,8 +1,10 @@
 import React from 'react';
 import { I18nManager, Platform } from 'react-native';
+
 import type { DirectionalHint, DismissBehaviors } from '@fluentui-react-native/callout';
-import { useMenuContext } from '../context/menuContext';
+
 import type { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';
+import { useMenuContext } from '../context/menuContext';
 
 const controlledDismissBehaviors = ['preventDismissOnKeyDown', 'preventDismissOnClickOutside'] as DismissBehaviors[];
 

package/src/MenuTrigger/MenuTrigger.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import type { MenuTriggerProps } from './MenuTrigger.types';
 import { menuTriggerName } from './MenuTrigger.types';
 import { useMenuTrigger } from './useMenuTrigger';

package/src/MenuTrigger/MenuTrigger.types.ts

@@ -1,4 +1,5 @@
 import type * as React from 'react';
+
 import type { InteractionEvent, PressablePropsExtended } from '@fluentui-react-native/interactive-hooks';
 
 export const menuTriggerName = 'MenuTrigger';

package/src/MenuTrigger/useMenuTrigger.ts

@@ -1,11 +1,13 @@
-import { useMenuContext } from '../context/menuContext';
-import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
-import type { MenuTriggerChildProps, MenuTriggerState } from './MenuTrigger.types';
+import React from 'react';
 import type { AccessibilityActionEvent, AccessibilityActionName } from 'react-native';
 import { Platform } from 'react-native';
-import React from 'react';
-import { hoverDelayDefault } from '../consts';
+
+import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
+
+import type { MenuTriggerChildProps, MenuTriggerState } from './MenuTrigger.types';
 import { useMergedRefs } from './useMergeRefs';
+import { hoverDelayDefault } from '../consts';
+import { useMenuContext } from '../context/menuContext';
 
 const baseAccessibilityActions =
   Platform.OS === ('win32' as any) ? [{ name: 'Expand' as AccessibilityActionName }, { name: 'Collapse' as AccessibilityActionName }] : [];

package/src/__tests__/Menu.test.tsx

@@ -1,16 +1,18 @@
 import * as React from 'react';
 import type { AccessibilityActionName } from 'react-native';
+
+import { ButtonV1 as Button } from '@fluentui-react-native/button';
+import { checkReRender } from '@fluentui-react-native/test-tools';
 import * as renderer from 'react-test-renderer';
+
 import { Menu } from '../Menu/Menu';
-import { checkReRender } from '@fluentui-react-native/test-tools';
-import MenuTrigger from '../MenuTrigger/MenuTrigger';
-import { ButtonV1 as Button } from '@fluentui-react-native/button';
-import MenuPopover from '../MenuPopover/MenuPopover';
-import { MenuList } from '../MenuList/MenuList';
+import { MenuDivider } from '../MenuDivider/MenuDivider';
 import { MenuItem } from '../MenuItem/MenuItem';
 import { MenuItemCheckbox } from '../MenuItemCheckbox/MenuItemCheckbox';
-import { MenuDivider } from '../MenuDivider/MenuDivider';
 import { MenuItemRadio } from '../MenuItemRadio/MenuItemRadio';
+import { MenuList } from '../MenuList/MenuList';
+import MenuPopover from '../MenuPopover/MenuPopover';
+import MenuTrigger from '../MenuTrigger/MenuTrigger';
 
 describe('Menu component tests', () => {
   it('Menu default', () => {

package/src/context/menuContext.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import type { MenuState } from '../Menu/Menu.types';
 
 /**

package/src/context/menuListContext.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import type { MenuListState } from '../MenuList/MenuList.types';
 
 /**