@fluentui-react-native/menu 1.15.0 → 1.15.1

package/lib/MenuItem/MenuItem.styling.js

@@ -5,74 +5,56 @@ import { menuItemName } from './MenuItem.types';
 import { defaultMenuItemTokens } from './MenuItemTokens';
 export const menuItemStates = ['hovered', 'focused', 'pressed', 'disabled'];
 export const stylingSettings = {
-  tokens: [defaultMenuItemTokens, menuItemName],
-  states: menuItemStates,
-  slotProps: {
-    root: buildProps(
-      (tokens, theme) => ({
-        style: {
-          alignItems: 'center',
-          backgroundColor: tokens.backgroundColor,
-          display: 'flex',
-          flexDirection: 'row',
-          ...layoutStyles.from(tokens, theme),
-          ...borderStyles.from(tokens, theme),
-        },
-      }),
-      ['backgroundColor', ...borderStyles.keys, ...layoutStyles.keys],
-    ),
-    checkmark: buildProps(
-      (tokens) => ({
-        style: {
-          height: tokens.checkmarkSize,
-          width: tokens.checkmarkSize,
-          marginEnd: Platform.OS === 'android' ? tokens.marginEndForCheckedAndroid : tokens.gap,
-        },
-      }),
-      ['checkmarkSize', 'gap'],
-    ),
-    content: buildProps(
-      (tokens, theme) => {
-        return {
-          color: tokens.color,
-          style: {
-            flexGrow: 1,
-            ...fontStyles.from(tokens, theme),
-          },
-        };
-      },
-      ['color', ...fontStyles.keys],
-    ),
-    iconPlaceholder: buildProps(
-      (tokens) => ({
-        style: {
-          minHeight: tokens.iconSize,
-          minWidth: tokens.iconSize,
-          alignItems: 'center',
-          justifyContent: 'center',
-          marginEnd: tokens.gap,
-        },
-      }),
-      ['checkmarkSize', 'gap'],
-    ),
-    imgIcon: buildProps(
-      (tokens) => ({
-        style: { tintColor: tokens.iconColor, height: tokens.iconSize, width: tokens.iconSize },
-      }),
-      ['gap', 'iconColor', 'iconSize'],
-    ),
-    fontOrSvgIcon: buildProps((tokens) => ({ color: tokens.iconColor, size: tokens.iconSize }), ['gap', 'iconColor', 'iconSize']),
-    submenuIndicator: buildProps(
-      (tokens) => {
-        return {
-          color: tokens.submenuIndicatorColor,
-          height: tokens.submenuIndicatorSize,
-          width: tokens.submenuIndicatorSize,
-          viewBox: `0 0 ${tokens.submenuIndicatorSize} ${tokens.submenuIndicatorSize}`,
-        };
-      },
-      ['submenuIndicatorColor', 'submenuIndicatorPadding', 'submenuIndicatorSize'],
-    ),
-  },
+    tokens: [defaultMenuItemTokens, menuItemName],
+    states: menuItemStates,
+    slotProps: {
+        root: buildProps((tokens, theme) => ({
+            style: {
+                alignItems: 'center',
+                backgroundColor: tokens.backgroundColor,
+                display: 'flex',
+                flexDirection: 'row',
+                ...layoutStyles.from(tokens, theme),
+                ...borderStyles.from(tokens, theme),
+            },
+        }), ['backgroundColor', ...borderStyles.keys, ...layoutStyles.keys]),
+        checkmark: buildProps((tokens) => ({
+            style: {
+                height: tokens.checkmarkSize,
+                width: tokens.checkmarkSize,
+                marginEnd: Platform.OS === 'android' ? tokens.marginEndForCheckedAndroid : tokens.gap,
+            },
+        }), ['checkmarkSize', 'gap']),
+        content: buildProps((tokens, theme) => {
+            return {
+                color: tokens.color,
+                style: {
+                    flexGrow: 1,
+                    ...fontStyles.from(tokens, theme),
+                },
+            };
+        }, ['color', ...fontStyles.keys]),
+        iconPlaceholder: buildProps((tokens) => ({
+            style: {
+                minHeight: tokens.iconSize,
+                minWidth: tokens.iconSize,
+                alignItems: 'center',
+                justifyContent: 'center',
+                marginEnd: tokens.gap,
+            },
+        }), ['checkmarkSize', 'gap']),
+        imgIcon: buildProps((tokens) => ({
+            style: { tintColor: tokens.iconColor, height: tokens.iconSize, width: tokens.iconSize },
+        }), ['gap', 'iconColor', 'iconSize']),
+        fontOrSvgIcon: buildProps((tokens) => ({ color: tokens.iconColor, size: tokens.iconSize }), ['gap', 'iconColor', 'iconSize']),
+        submenuIndicator: buildProps((tokens) => {
+            return {
+                color: tokens.submenuIndicatorColor,
+                height: tokens.submenuIndicatorSize,
+                width: tokens.submenuIndicatorSize,
+                viewBox: `0 0 ${tokens.submenuIndicatorSize} ${tokens.submenuIndicatorSize}`,
+            };
+        }, ['submenuIndicatorColor', 'submenuIndicatorPadding', 'submenuIndicatorSize']),
+    },
 };
-//# sourceMappingURL=MenuItem.styling.js.map
+//# sourceMappingURL=MenuItem.styling.js.map

package/lib/MenuItem/MenuItem.types.d.ts

@@ -6,98 +6,98 @@ import type { IFocusable, InteractionEvent, PressablePropsExtended, PressableSta
 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 declare const menuItemName = 'MenuItem';
+export declare const menuItemName = "MenuItem";
 export interface MenuItemTokens extends LayoutTokens, FontTokens, IBorderTokens, IColorTokens {
-  /**
-   * Height and width in pixels of the space that is reserved to align the item's text with other items which have checkmarks
-   */
-  checkmarkSize?: number;
-  /**
-   * Space between parts of the item control in pixels
-   */
-  gap?: number;
-  /**
-   * Color of the icon
-   */
-  iconColor?: ColorValue;
-  /**
-   * Size of the icon. Pixels for SVG and points for font icon.
-   */
-  iconSize?: number;
-  /**
-   * Amount of space in pixels at the end of the item control that is reserved to align the item's text with other items which have checkmarks
-   * @platform android
-   */
-  marginEndForCheckedAndroid?: number;
-  /**
-   * Color of the indicator that shows that an item has a submenu
-   */
-  submenuIndicatorColor?: ColorValue;
-  /**
-   * Amount of space in pixels around the indicator that shows that an item has a submenu
-   */
-  submenuIndicatorPadding?: number;
-  /**
-   * Height and width in pixels of the indicator that shows that an item has a submenu
-   */
-  submenuIndicatorSize?: number;
-  /**
-   * States of the item control
-   */
-  disabled?: MenuItemTokens;
-  focused?: MenuItemTokens;
-  hovered?: MenuItemTokens;
-  pressed?: MenuItemTokens;
+    /**
+     * Height and width in pixels of the space that is reserved to align the item's text with other items which have checkmarks
+     */
+    checkmarkSize?: number;
+    /**
+     * Space between parts of the item control in pixels
+     */
+    gap?: number;
+    /**
+     * Color of the icon
+     */
+    iconColor?: ColorValue;
+    /**
+     * Size of the icon. Pixels for SVG and points for font icon.
+     */
+    iconSize?: number;
+    /**
+     * Amount of space in pixels at the end of the item control that is reserved to align the item's text with other items which have checkmarks
+     * @platform android
+     */
+    marginEndForCheckedAndroid?: number;
+    /**
+     * Color of the indicator that shows that an item has a submenu
+     */
+    submenuIndicatorColor?: ColorValue;
+    /**
+     * Amount of space in pixels around the indicator that shows that an item has a submenu
+     */
+    submenuIndicatorPadding?: number;
+    /**
+     * Height and width in pixels of the indicator that shows that an item has a submenu
+     */
+    submenuIndicatorSize?: number;
+    /**
+     * States of the item control
+     */
+    disabled?: MenuItemTokens;
+    focused?: MenuItemTokens;
+    hovered?: MenuItemTokens;
+    pressed?: MenuItemTokens;
 }
 export interface MenuItemProps extends Omit<PressablePropsExtended, 'onPress'> {
-  /**
-   * A RefObject to access the IButton interface. Use this to access the public methods and properties of the component.
-   */
-  componentRef?: React.RefObject<IFocusable>;
-  icon?: IconProps | ImageProps;
-  /**
-   * A callback to call on button click event
-   */
-  onClick?: (e: InteractionEvent) => void;
-  /**
-   * Do not dismiss the menu when a menu item is clicked
-   */
-  persistOnClick?: boolean;
+    /**
+     * A RefObject to access the IButton interface. Use this to access the public methods and properties of the component.
+     */
+    componentRef?: React.RefObject<IFocusable>;
+    icon?: IconProps | ImageProps;
+    /**
+     * A callback to call on button click event
+     */
+    onClick?: (e: InteractionEvent) => void;
+    /**
+     * Do not dismiss the menu when a menu item is clicked
+     */
+    persistOnClick?: boolean;
 }
 export interface MenuItemState extends PressableState {
-  /**
-   * Whether Menu has other items that are checkbox or radio.
-   */
-  hasCheckmarks?: boolean;
-  /**
-   * Whether Menu has items with icons.
-   */
-  hasIcons?: boolean;
-  /**
-   * If the menu item is a trigger for a submenu
-   */
-  hasSubmenu?: boolean;
-  /**
-   * States that menu items all have tooltips with its text by default.
-   */
-  hasTooltips?: boolean;
+    /**
+     * Whether Menu has other items that are checkbox or radio.
+     */
+    hasCheckmarks?: boolean;
+    /**
+     * Whether Menu has items with icons.
+     */
+    hasIcons?: boolean;
+    /**
+     * If the menu item is a trigger for a submenu
+     */
+    hasSubmenu?: boolean;
+    /**
+     * States that menu items all have tooltips with its text by default.
+     */
+    hasTooltips?: boolean;
 }
 export interface MenuItemInfo {
-  props: MenuItemProps & React.ComponentPropsWithRef<any>;
-  state: MenuItemState;
+    props: MenuItemProps & React.ComponentPropsWithRef<any>;
+    state: MenuItemState;
 }
 export interface MenuItemSlotProps {
-  root: React.PropsWithRef<PressablePropsExtended>;
-  content?: TextProps;
-  checkmark?: React.PropsWithRef<IViewProps>;
-  iconPlaceholder?: React.PropsWithRef<IViewProps>;
-  imgIcon?: ImageProps;
-  fontOrSvgIcon?: IconProps;
-  submenuIndicator?: XmlProps;
+    root: React.PropsWithRef<PressablePropsExtended>;
+    content?: TextProps;
+    checkmark?: React.PropsWithRef<IViewProps>;
+    iconPlaceholder?: React.PropsWithRef<IViewProps>;
+    imgIcon?: ImageProps;
+    fontOrSvgIcon?: IconProps;
+    submenuIndicator?: XmlProps;
 }
 export interface MenuItemType {
-  props: MenuItemProps;
-  tokens: MenuItemTokens;
-  slotProps: MenuItemSlotProps;
+    props: MenuItemProps;
+    tokens: MenuItemTokens;
+    slotProps: MenuItemSlotProps;
 }
-//# sourceMappingURL=MenuItem.types.d.ts.map
+//# sourceMappingURL=MenuItem.types.d.ts.map

package/lib/MenuItem/MenuItem.types.js

@@ -1,2 +1,2 @@
 export const menuItemName = 'MenuItem';
-//# sourceMappingURL=MenuItem.types.js.map
+//# sourceMappingURL=MenuItem.types.js.map

package/lib/MenuItem/MenuItemTokens.android.d.ts

@@ -2,4 +2,4 @@ import type { Theme } from '@fluentui-react-native/framework';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
 import type { MenuItemTokens } from './MenuItem.types';
 export declare const defaultMenuItemTokens: TokenSettings<MenuItemTokens, Theme>;
-//# sourceMappingURL=MenuItemTokens.android.d.ts.map
+//# sourceMappingURL=MenuItemTokens.android.d.ts.map

package/lib/MenuItem/MenuItemTokens.android.js

@@ -1,20 +1,20 @@
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 export const defaultMenuItemTokens = (t) => ({
-  color: t.colors.neutralForeground1,
-  variant: 'body1',
-  paddingHorizontal: globalTokens.size160,
-  paddingVertical: globalTokens.size60,
-  iconColor: t.colors.neutralForeground3,
-  iconSize: globalTokens.size240,
-  marginEndForCheckedAndroid: globalTokens.size360,
-  pressed: {
-    backgroundColor: t.colors.neutralBackground1Pressed,
-  },
-  disabled: {
-    backgroundColor: t.colors.neutralBackground1,
-    color: t.colors.neutralForegroundDisabled1,
-    iconColor: t.colors.disabledText,
-  },
-  gap: globalTokens.size160,
+    color: t.colors.neutralForeground1,
+    variant: 'body1',
+    paddingHorizontal: globalTokens.size160,
+    paddingVertical: globalTokens.size60,
+    iconColor: t.colors.neutralForeground3,
+    iconSize: globalTokens.size240,
+    marginEndForCheckedAndroid: globalTokens.size360,
+    pressed: {
+        backgroundColor: t.colors.neutralBackground1Pressed,
+    },
+    disabled: {
+        backgroundColor: t.colors.neutralBackground1,
+        color: t.colors.neutralForegroundDisabled1,
+        iconColor: t.colors.disabledText,
+    },
+    gap: globalTokens.size160,
 });
-//# sourceMappingURL=MenuItemTokens.android.js.map
+//# sourceMappingURL=MenuItemTokens.android.js.map

package/lib/MenuItem/MenuItemTokens.d.ts

@@ -2,4 +2,4 @@ import type { Theme } from '@fluentui-react-native/framework';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
 import type { MenuItemTokens } from './MenuItem.types';
 export declare const defaultMenuItemTokens: TokenSettings<MenuItemTokens, Theme>;
-//# sourceMappingURL=MenuItemTokens.d.ts.map
+//# sourceMappingURL=MenuItemTokens.d.ts.map

package/lib/MenuItem/MenuItemTokens.js

@@ -1,39 +1,39 @@
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 export const defaultMenuItemTokens = (t) => ({
-  backgroundColor: t.colors.neutralBackground1,
-  borderRadius: globalTokens.corner.radius40,
-  checkmarkSize: 16,
-  color: t.colors.neutralForeground2,
-  fontFamily: t.typography.families.primary,
-  fontSize: globalTokens.font.size300,
-  fontWeight: globalTokens.font.weight.regular,
-  gap: globalTokens.size40,
-  iconColor: t.colors.neutralForeground2,
-  iconSize: 16,
-  minHeight: 32,
-  minWidth: 128,
-  maxWidth: 300,
-  padding: globalTokens.size60,
-  submenuIndicatorColor: t.colors.neutralForeground2,
-  submenuIndicatorPadding: globalTokens.sizeNone,
-  submenuIndicatorSize: 16,
-  hovered: {
-    backgroundColor: t.colors.neutralBackground1Hover,
-    color: t.colors.neutralForeground2Hover,
-    iconColor: t.colors.neutralForeground2Hover,
-    submenuIndicatorColor: t.colors.neutralForeground2Hover,
-  },
-  pressed: {
-    backgroundColor: t.colors.neutralBackground1Pressed,
-    color: t.colors.neutralForeground2Pressed,
-    iconColor: t.colors.neutralForeground2Pressed,
-    submenuIndicatorColor: t.colors.neutralForeground2Pressed,
-  },
-  disabled: {
     backgroundColor: t.colors.neutralBackground1,
-    color: t.colors.neutralForegroundDisabled,
-    iconColor: t.colors.neutralForegroundDisabled,
-    submenuIndicatorColor: t.colors.neutralForegroundDisabled,
-  },
+    borderRadius: globalTokens.corner.radius40,
+    checkmarkSize: 16,
+    color: t.colors.neutralForeground2,
+    fontFamily: t.typography.families.primary,
+    fontSize: globalTokens.font.size300,
+    fontWeight: globalTokens.font.weight.regular,
+    gap: globalTokens.size40,
+    iconColor: t.colors.neutralForeground2,
+    iconSize: 16,
+    minHeight: 32,
+    minWidth: 128,
+    maxWidth: 300,
+    padding: globalTokens.size60,
+    submenuIndicatorColor: t.colors.neutralForeground2,
+    submenuIndicatorPadding: globalTokens.sizeNone,
+    submenuIndicatorSize: 16,
+    hovered: {
+        backgroundColor: t.colors.neutralBackground1Hover,
+        color: t.colors.neutralForeground2Hover,
+        iconColor: t.colors.neutralForeground2Hover,
+        submenuIndicatorColor: t.colors.neutralForeground2Hover,
+    },
+    pressed: {
+        backgroundColor: t.colors.neutralBackground1Pressed,
+        color: t.colors.neutralForeground2Pressed,
+        iconColor: t.colors.neutralForeground2Pressed,
+        submenuIndicatorColor: t.colors.neutralForeground2Pressed,
+    },
+    disabled: {
+        backgroundColor: t.colors.neutralBackground1,
+        color: t.colors.neutralForegroundDisabled,
+        iconColor: t.colors.neutralForegroundDisabled,
+        submenuIndicatorColor: t.colors.neutralForegroundDisabled,
+    },
 });
-//# sourceMappingURL=MenuItemTokens.js.map
+//# sourceMappingURL=MenuItemTokens.js.map

package/lib/MenuItem/MenuItemTokens.macos.d.ts

@@ -2,4 +2,4 @@ import type { Theme } from '@fluentui-react-native/framework';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
 import type { MenuItemTokens } from './MenuItem.types';
 export declare const defaultMenuItemTokens: TokenSettings<MenuItemTokens, Theme>;
-//# sourceMappingURL=MenuItemTokens.macos.d.ts.map
+//# sourceMappingURL=MenuItemTokens.macos.d.ts.map

package/lib/MenuItem/MenuItemTokens.macos.js

@@ -1,37 +1,37 @@
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 export const defaultMenuItemTokens = (t) => ({
-  backgroundColor: t.colors.transparentBackground,
-  borderRadius: 5, // hardcoded for now to match NSMenu
-  checkmarkSize: 16,
-  color: t.colors.neutralForeground1,
-  fontFamily: t.typography.families.primary,
-  fontSize: 13, // aligning with NSMenu font size
-  fontWeight: globalTokens.font.weight.regular,
-  gap: globalTokens.size40,
-  iconColor: t.colors.neutralForeground1,
-  iconSize: 16,
-  paddingHorizontal: 5, // hardcoded for now to match NSMenu
-  paddingVertical: 3, // hardcoded for now to match NSMenu
-  submenuIndicatorColor: t.colors.neutralForeground1,
-  submenuIndicatorPadding: globalTokens.sizeNone,
-  submenuIndicatorSize: 16,
-  focused: {
-    backgroundColor: t.colors.menuItemBackgroundHovered,
-    color: t.colors.menuItemTextHovered,
-    iconColor: t.colors.menuItemTextHovered,
-    submenuIndicatorColor: t.colors.menuItemTextHovered,
-  },
-  pressed: {
-    backgroundColor: t.colors.menuItemBackgroundPressed,
-    color: t.colors.menuItemTextHovered,
-    iconColor: t.colors.menuItemTextHovered,
-    submenuIndicatorColor: t.colors.menuItemTextHovered,
-  },
-  disabled: {
-    backgroundColor: t.colors.menuBackground,
-    color: t.colors.disabledText,
-    iconColor: t.colors.disabledText,
-    submenuIndicatorColor: t.colors.disabledText,
-  },
+    backgroundColor: t.colors.transparentBackground,
+    borderRadius: 5, // hardcoded for now to match NSMenu
+    checkmarkSize: 16,
+    color: t.colors.neutralForeground1,
+    fontFamily: t.typography.families.primary,
+    fontSize: 13, // aligning with NSMenu font size
+    fontWeight: globalTokens.font.weight.regular,
+    gap: globalTokens.size40,
+    iconColor: t.colors.neutralForeground1,
+    iconSize: 16,
+    paddingHorizontal: 5, // hardcoded for now to match NSMenu
+    paddingVertical: 3, // hardcoded for now to match NSMenu
+    submenuIndicatorColor: t.colors.neutralForeground1,
+    submenuIndicatorPadding: globalTokens.sizeNone,
+    submenuIndicatorSize: 16,
+    focused: {
+        backgroundColor: t.colors.menuItemBackgroundHovered,
+        color: t.colors.menuItemTextHovered,
+        iconColor: t.colors.menuItemTextHovered,
+        submenuIndicatorColor: t.colors.menuItemTextHovered,
+    },
+    pressed: {
+        backgroundColor: t.colors.menuItemBackgroundPressed,
+        color: t.colors.menuItemTextHovered,
+        iconColor: t.colors.menuItemTextHovered,
+        submenuIndicatorColor: t.colors.menuItemTextHovered,
+    },
+    disabled: {
+        backgroundColor: t.colors.menuBackground,
+        color: t.colors.disabledText,
+        iconColor: t.colors.disabledText,
+        submenuIndicatorColor: t.colors.disabledText,
+    },
 });
-//# sourceMappingURL=MenuItemTokens.macos.js.map
+//# sourceMappingURL=MenuItemTokens.macos.js.map

package/lib/MenuItem/MenuItemTokens.win32.d.ts

@@ -2,4 +2,4 @@ import type { Theme } from '@fluentui-react-native/framework';
 import type { TokenSettings } from '@fluentui-react-native/use-styling';
 import type { MenuItemTokens } from './MenuItem.types';
 export declare const defaultMenuItemTokens: TokenSettings<MenuItemTokens, Theme>;
-//# sourceMappingURL=MenuItemTokens.win32.d.ts.map
+//# sourceMappingURL=MenuItemTokens.win32.d.ts.map

package/lib/MenuItem/MenuItemTokens.win32.js

@@ -1,40 +1,40 @@
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 export const defaultMenuItemTokens = (t) => ({
-  backgroundColor: t.colors.neutralBackground1,
-  borderRadius: globalTokens.corner.radiusNone,
-  checkmarkSize: 16,
-  color: t.colors.neutralForeground1,
-  fontFamily: t.typography.families.primary,
-  fontSize: globalTokens.font.size200,
-  fontWeight: globalTokens.font.weight.regular,
-  gap: globalTokens.size40,
-  iconColor: t.colors.neutralForeground1,
-  iconSize: 16,
-  minHeight: 24,
-  minWidth: 128,
-  maxWidth: 300,
-  padding: globalTokens.size40,
-  paddingHorizontal: globalTokens.size80,
-  submenuIndicatorColor: t.colors.neutralForeground1,
-  submenuIndicatorPadding: globalTokens.size20,
-  submenuIndicatorSize: 16,
-  pressed: {
-    backgroundColor: t.colors.neutralBackground1Pressed,
-    color: t.colors.neutralForeground1Pressed,
-    iconColor: t.colors.neutralForeground1Pressed,
-    submenuIndicatorColor: t.colors.neutralForeground1Pressed,
-  },
-  disabled: {
     backgroundColor: t.colors.neutralBackground1,
-    color: t.colors.neutralForegroundDisabled,
-    iconColor: t.colors.neutralForegroundDisabled,
-    submenuIndicatorColor: t.colors.neutralForegroundDisabled,
-  },
-  focused: {
-    backgroundColor: t.colors.neutralBackground1Hover,
-    color: t.colors.neutralForeground1Hover,
-    iconColor: t.colors.neutralForeground1Hover,
-    submenuIndicatorColor: t.colors.neutralForeground1Hover,
-  },
+    borderRadius: globalTokens.corner.radiusNone,
+    checkmarkSize: 16,
+    color: t.colors.neutralForeground1,
+    fontFamily: t.typography.families.primary,
+    fontSize: globalTokens.font.size200,
+    fontWeight: globalTokens.font.weight.regular,
+    gap: globalTokens.size40,
+    iconColor: t.colors.neutralForeground1,
+    iconSize: 16,
+    minHeight: 24,
+    minWidth: 128,
+    maxWidth: 300,
+    padding: globalTokens.size40,
+    paddingHorizontal: globalTokens.size80,
+    submenuIndicatorColor: t.colors.neutralForeground1,
+    submenuIndicatorPadding: globalTokens.size20,
+    submenuIndicatorSize: 16,
+    pressed: {
+        backgroundColor: t.colors.neutralBackground1Pressed,
+        color: t.colors.neutralForeground1Pressed,
+        iconColor: t.colors.neutralForeground1Pressed,
+        submenuIndicatorColor: t.colors.neutralForeground1Pressed,
+    },
+    disabled: {
+        backgroundColor: t.colors.neutralBackground1,
+        color: t.colors.neutralForegroundDisabled,
+        iconColor: t.colors.neutralForegroundDisabled,
+        submenuIndicatorColor: t.colors.neutralForegroundDisabled,
+    },
+    focused: {
+        backgroundColor: t.colors.neutralBackground1Hover,
+        color: t.colors.neutralForeground1Hover,
+        iconColor: t.colors.neutralForeground1Hover,
+        submenuIndicatorColor: t.colors.neutralForeground1Hover,
+    },
 });
-//# sourceMappingURL=MenuItemTokens.win32.js.map
+//# sourceMappingURL=MenuItemTokens.win32.js.map

package/lib/MenuItem/index.d.ts

@@ -2,4 +2,4 @@ export { MenuItem } from './MenuItem';
 export { menuItemName } from './MenuItem.types';
 export type { MenuItemProps, MenuItemState, MenuItemInfo, MenuItemTokens, MenuItemSlotProps, MenuItemType } from './MenuItem.types';
 export { useMenuItem } from './useMenuItem';
-//# sourceMappingURL=index.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/lib/MenuItem/index.js

@@ -1,4 +1,4 @@
 export { MenuItem } from './MenuItem';
 export { menuItemName } from './MenuItem.types';
 export { useMenuItem } from './useMenuItem';
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/lib/MenuItem/useMenuItem.d.ts

@@ -4,4 +4,4 @@ export declare const triggerKeys: string[];
 export declare const submenuTriggerKeys: string[];
 export declare const useMenuItem: (props: MenuItemProps) => MenuItemInfo;
 export declare const useHoverFocusEffect: (hovered: boolean, componentRef: React.MutableRefObject<any>) => void;
-//# sourceMappingURL=useMenuItem.d.ts.map
+//# sourceMappingURL=useMenuItem.d.ts.map