@fluentui-react-native/menu 1.0.61 → 1.0.63

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/CHANGELOG.json +37 -1
  2. package/CHANGELOG.md +19 -2
  3. package/SPEC.md +1 -1
  4. package/lib/MenuItem/MenuItemTokens.macos.js +9 -9
  5. package/lib/MenuItem/MenuItemTokens.macos.js.map +1 -1
  6. package/lib/MenuList/MenuList.d.ts.map +1 -1
  7. package/lib/MenuList/MenuList.js +14 -6
  8. package/lib/MenuList/MenuList.js.map +1 -1
  9. package/lib/MenuList/MenuList.types.d.ts +2 -0
  10. package/lib/MenuList/MenuList.types.d.ts.map +1 -1
  11. package/lib/MenuList/MenuList.types.js.map +1 -1
  12. package/lib/MenuTrigger/MenuTrigger.types.d.ts +2 -3
  13. package/lib/MenuTrigger/MenuTrigger.types.d.ts.map +1 -1
  14. package/lib/MenuTrigger/MenuTrigger.types.js.map +1 -1
  15. package/lib/MenuTrigger/getRevisedProps.d.ts.map +1 -1
  16. package/lib/MenuTrigger/getRevisedProps.js +3 -5
  17. package/lib/MenuTrigger/getRevisedProps.js.map +1 -1
  18. package/lib-commonjs/MenuItem/MenuItemTokens.macos.js +9 -9
  19. package/lib-commonjs/MenuItem/MenuItemTokens.macos.js.map +1 -1
  20. package/lib-commonjs/MenuList/MenuList.d.ts.map +1 -1
  21. package/lib-commonjs/MenuList/MenuList.js +13 -5
  22. package/lib-commonjs/MenuList/MenuList.js.map +1 -1
  23. package/lib-commonjs/MenuList/MenuList.types.d.ts +2 -0
  24. package/lib-commonjs/MenuList/MenuList.types.d.ts.map +1 -1
  25. package/lib-commonjs/MenuList/MenuList.types.js.map +1 -1
  26. package/lib-commonjs/MenuTrigger/MenuTrigger.types.d.ts +2 -3
  27. package/lib-commonjs/MenuTrigger/MenuTrigger.types.d.ts.map +1 -1
  28. package/lib-commonjs/MenuTrigger/MenuTrigger.types.js.map +1 -1
  29. package/lib-commonjs/MenuTrigger/getRevisedProps.d.ts.map +1 -1
  30. package/lib-commonjs/MenuTrigger/getRevisedProps.js +3 -5
  31. package/lib-commonjs/MenuTrigger/getRevisedProps.js.map +1 -1
  32. package/package.json +2 -1
  33. package/src/MenuItem/MenuItemTokens.macos.ts +9 -9
  34. package/src/MenuList/MenuList.tsx +28 -5
  35. package/src/MenuList/MenuList.types.ts +2 -0
  36. package/src/MenuTrigger/MenuTrigger.types.ts +2 -3
  37. package/src/MenuTrigger/getRevisedProps.ts +3 -5
package/CHANGELOG.json CHANGED
@@ -2,7 +2,43 @@
2
2
  "name": "@fluentui-react-native/menu",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 27 Oct 2022 13:18:21 GMT",
5
+ "date": "Sat, 29 Oct 2022 01:04:58 GMT",
6
+ "tag": "@fluentui-react-native/menu_v1.0.63",
7
+ "version": "1.0.63",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "sanajmi@microsoft.com",
12
+ "package": "@fluentui-react-native/menu",
13
+ "commit": "9d5251df615f035066294a17a93e50bead28d7cc",
14
+ "comment": "MenuV1: Update types to PressablePropsExtended"
15
+ }
16
+ ]
17
+ }
18
+ },
19
+ {
20
+ "date": "Sat, 29 Oct 2022 00:18:41 GMT",
21
+ "tag": "@fluentui-react-native/menu_v1.0.62",
22
+ "version": "1.0.62",
23
+ "comments": {
24
+ "patch": [
25
+ {
26
+ "author": "sanajmi@microsoft.com",
27
+ "package": "@fluentui-react-native/menu",
28
+ "commit": "afd897fce7b8442dcefcb0d92217807f4fa7e70b",
29
+ "comment": "MenuV1 (macOS): Add FocusZone"
30
+ },
31
+ {
32
+ "author": "sanajmi@microsoft.com",
33
+ "package": "@fluentui-react-native/menu",
34
+ "commit": "1bfe45236cf9e2db058b31cda686e4a6bdb548fa",
35
+ "comment": "MenuV1 (macOS): Update MenuItem tokens"
36
+ }
37
+ ]
38
+ }
39
+ },
40
+ {
41
+ "date": "Thu, 27 Oct 2022 13:19:00 GMT",
6
42
  "tag": "@fluentui-react-native/menu_v1.0.61",
7
43
  "version": "1.0.61",
8
44
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,29 @@
1
1
  # Change Log - @fluentui-react-native/menu
2
2
 
3
- This log was last generated on Thu, 27 Oct 2022 13:18:21 GMT and should not be manually modified.
3
+ This log was last generated on Sat, 29 Oct 2022 01:04:58 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## 1.0.63
8
+
9
+ Sat, 29 Oct 2022 01:04:58 GMT
10
+
11
+ ### Patches
12
+
13
+ - MenuV1: Update types to PressablePropsExtended (sanajmi@microsoft.com)
14
+
15
+ ## 1.0.62
16
+
17
+ Sat, 29 Oct 2022 00:18:41 GMT
18
+
19
+ ### Patches
20
+
21
+ - MenuV1 (macOS): Add FocusZone (sanajmi@microsoft.com)
22
+ - MenuV1 (macOS): Update MenuItem tokens (sanajmi@microsoft.com)
23
+
7
24
  ## 1.0.61
8
25
 
9
- Thu, 27 Oct 2022 13:18:21 GMT
26
+ Thu, 27 Oct 2022 13:19:00 GMT
10
27
 
11
28
  ### Patches
12
29
 
package/SPEC.md CHANGED
@@ -224,7 +224,7 @@ Creates a divider element in the `MenuList`. This divider is purely visual and d
224
224
  #### MenuItem Props
225
225
 
226
226
  ```ts
227
- export interface MenuItemProps extends Omit<IWithPressableOptions<ViewProps>, 'onPress'> {
227
+ export interface MenuItemProps extends Omit<PressablePropsExtended, 'onPress'> {
228
228
  /**
229
229
  * A RefObject to access the IButton interface. Use this to access the public methods and properties of the component.
230
230
  */
@@ -3,26 +3,26 @@ export var defaultMenuItemTokens = function (t) { return ({
3
3
  backgroundColor: t.colors.transparentBackground,
4
4
  borderRadius: 5,
5
5
  checkmarkSize: 16,
6
- submenuIndicatorPadding: globalTokens.spacing.none,
7
- submenuIndicatorSize: 16,
8
- color: t.colors.neutralForeground2,
6
+ color: t.colors.menuItemText,
9
7
  fontFamily: t.typography.families.primary,
10
8
  fontSize: globalTokens.font.size[300],
11
9
  fontWeight: globalTokens.font.weight.regular,
12
10
  gap: globalTokens.spacing.xs,
13
11
  paddingHorizontal: 5,
14
12
  paddingVertical: 3,
13
+ submenuIndicatorPadding: globalTokens.spacing.none,
14
+ submenuIndicatorSize: 16,
15
15
  focused: {
16
- backgroundColor: t.colors.brandBackground,
17
- color: t.colors.brandedContent,
16
+ backgroundColor: t.colors.menuItemBackgroundHovered,
17
+ color: t.colors.menuItemTextHovered,
18
18
  },
19
19
  pressed: {
20
- backgroundColor: t.colors.brandBackgroundPressed,
21
- color: t.colors.brandedPressedContent,
20
+ backgroundColor: t.colors.menuItemBackgroundPressed,
21
+ color: t.colors.menuItemTextHovered,
22
22
  },
23
23
  disabled: {
24
- backgroundColor: t.colors.transparentBackground,
25
- color: t.colors.neutralForegroundDisabled,
24
+ backgroundColor: t.colors.menuBackground,
25
+ color: t.colors.disabledText,
26
26
  },
27
27
  }); };
28
28
  //# sourceMappingURL=MenuItemTokens.macos.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MenuItemTokens.macos.js","sourceRoot":"","sources":["../../src/MenuItem/MenuItemTokens.macos.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAInE,MAAM,CAAC,IAAM,qBAAqB,GAAyC,UAAC,CAAQ,IAAqB,OAAA,CAAC;IACxG,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,qBAAqB;IAC/C,YAAY,EAAE,CAAC;IACf,aAAa,EAAE,EAAE;IACjB,uBAAuB,EAAE,YAAY,CAAC,OAAO,CAAC,IAAI;IAClD,oBAAoB,EAAE,EAAE;IACxB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,kBAAkB;IAClC,UAAU,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ,CAAC,OAAO;IACzC,QAAQ,EAAE,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC;IACrC,UAAU,EAAE,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,OAA0B;IAC/D,GAAG,EAAE,YAAY,CAAC,OAAO,CAAC,EAAE;IAC5B,iBAAiB,EAAE,CAAC;IACpB,eAAe,EAAE,CAAC;IAClB,OAAO,EAAE;QACP,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,eAAe;QACzC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,cAAc;KAC/B;IACD,OAAO,EAAE;QACP,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,sBAAsB;QAChD,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,qBAAqB;KACtC;IACD,QAAQ,EAAE;QACR,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,qBAAqB;QAC/C,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,yBAAyB;KAC1C;CACF,CAAC,EAzBuG,CAyBvG,CAAC"}
1
+ {"version":3,"file":"MenuItemTokens.macos.js","sourceRoot":"","sources":["../../src/MenuItem/MenuItemTokens.macos.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAInE,MAAM,CAAC,IAAM,qBAAqB,GAAyC,UAAC,CAAQ,IAAqB,OAAA,CAAC;IACxG,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,qBAAqB;IAC/C,YAAY,EAAE,CAAC;IACf,aAAa,EAAE,EAAE;IACjB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY;IAC5B,UAAU,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ,CAAC,OAAO;IACzC,QAAQ,EAAE,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC;IACrC,UAAU,EAAE,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,OAA0B;IAC/D,GAAG,EAAE,YAAY,CAAC,OAAO,CAAC,EAAE;IAC5B,iBAAiB,EAAE,CAAC;IACpB,eAAe,EAAE,CAAC;IAClB,uBAAuB,EAAE,YAAY,CAAC,OAAO,CAAC,IAAI;IAClD,oBAAoB,EAAE,EAAE;IACxB,OAAO,EAAE;QACP,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,yBAAyB;QACnD,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,mBAAmB;KACpC;IACD,OAAO,EAAE;QACP,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,yBAAyB;QACnD,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,mBAAmB;KACpC;IACD,QAAQ,EAAE;QACR,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,cAAc;QACxC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY;KAC7B;CACF,CAAC,EAzBuG,CAyBvG,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../src/MenuList/MenuList.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAgB,aAAa,EAAgB,MAAM,kBAAkB,CAAC;AA0B7E,eAAO,MAAM,QAAQ,gLAmBnB,CAAC"}
1
+ {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../src/MenuList/MenuList.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAgB,aAAa,EAAgB,MAAM,kBAAkB,CAAC;AA2B7E,eAAO,MAAM,QAAQ,gLAyCnB,CAAC"}
@@ -1,13 +1,14 @@
1
1
  import { __assign, __rest } from "tslib";
2
2
  /** @jsx withSlots */
3
3
  import React from 'react';
4
- import { View } from 'react-native';
4
+ import { Platform, View } from 'react-native';
5
5
  import { compose, mergeProps, stagedComponent, withSlots } from '@fluentui-react-native/framework';
6
6
  import { menuListName } from './MenuList.types';
7
7
  import { stylingSettings } from './MenuList.styling';
8
8
  import { MenuListProvider } from '../context/menuListContext';
9
9
  import { useMenuList } from './useMenuList';
10
10
  import { useMenuListContextValue } from './useMenuListContextValue';
11
+ import { FocusZone } from '@fluentui-react-native/focus-zone';
11
12
  var MenuStack = stagedComponent(function (props) {
12
13
  var gap = props.gap, rest = __rest(props, ["gap"]);
13
14
  return function (final, children) {
@@ -25,15 +26,22 @@ var MenuStack = stagedComponent(function (props) {
25
26
  };
26
27
  });
27
28
  MenuStack.displayName = 'MenuStack';
28
- export var MenuList = compose(__assign(__assign({ displayName: menuListName }, stylingSettings), { slots: {
29
- root: MenuStack,
30
- }, useRender: function (userProps, useSlots) {
29
+ export var MenuList = compose(__assign(__assign({ displayName: menuListName }, stylingSettings), { slots: __assign({ root: MenuStack }, (Platform.OS === 'macos' ? { focusZone: FocusZone } : null)), useRender: function (userProps, useSlots) {
31
30
  var menuList = useMenuList(userProps);
32
31
  var contextValue = useMenuListContextValue(menuList);
33
32
  var Slots = useSlots(menuList.props);
33
+ var focusZoneRef = React.useRef();
34
+ React.useEffect(function () {
35
+ var _a;
36
+ (_a = focusZoneRef === null || focusZoneRef === void 0 ? void 0 : focusZoneRef.current) === null || _a === void 0 ? void 0 : _a.focus();
37
+ }, []);
34
38
  return function (_final, children) {
35
- return (withSlots(MenuListProvider, { value: contextValue },
36
- withSlots(Slots.root, null, children)));
39
+ var content = Platform.OS === 'macos' ? (withSlots(Slots.root, null,
40
+ withSlots(Slots.focusZone, { componentRef: focusZoneRef, focusZoneDirection: 'vertical', defaultTabbableElement: focusZoneRef,
41
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
42
+ // @ts-ignore FocusZone takes ViewProps, but that isn't defined on it's type.
43
+ enableFocusRing: false, forceFocusMacOS: true }, children))) : (withSlots(Slots.root, null, children));
44
+ return withSlots(MenuListProvider, { value: contextValue }, content);
37
45
  };
38
46
  } }));
39
47
  //# sourceMappingURL=MenuList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.js","sourceRoot":"","sources":["../../src/MenuList/MenuList.tsx"],"names":[],"mappings":";AAAA,qBAAqB;AACrB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,eAAe,EAAY,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAC7G,OAAO,EAAE,YAAY,EAA+B,MAAM,kBAAkB,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAGpE,IAAM,SAAS,GAAG,eAAe,CAAC,UAAC,KAAwD;IACjF,IAAA,GAAG,GAAc,KAAK,IAAnB,EAAK,IAAI,UAAK,KAAK,EAAxB,OAAgB,CAAF,CAAW;IAC/B,OAAO,UAAC,KAAwD,EAAE,QAAyB;QACzF,IAAI,GAAG,IAAI,GAAG,GAAG,CAAC,IAAI,QAAQ,EAAE;YAC9B,6DAA6D;YAC7D,yCAAyC;YACzC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,KAAuB,EAAE,KAAa;gBAC7E,IAAI,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,EAAE;oBAC5C,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC;iBAC1F;gBACD,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;SACJ;QAED,OAAO,UAAC,IAAI,eAAK,UAAU,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG,QAAQ,CAAQ,CAAC;IAC9D,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AAEpC,MAAM,CAAC,IAAM,QAAQ,GAAG,OAAO,qBAC7B,WAAW,EAAE,YAAY,IACtB,eAAe,KAClB,KAAK,EAAE;QACL,IAAI,EAAE,SAAS;KAChB,EACD,SAAS,EAAE,UAAC,SAAwB,EAAE,QAAgC;QACpE,IAAM,QAAQ,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;QACxC,IAAM,YAAY,GAAG,uBAAuB,CAAC,QAAQ,CAAC,CAAC;QACvD,IAAM,KAAK,GAAG,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAEvC,OAAO,UAAC,MAAqB,EAAE,QAAyB;YACtD,OAAO,CACL,UAAC,gBAAgB,IAAC,KAAK,EAAE,YAAY;gBACnC,UAAC,KAAK,CAAC,IAAI,QAAE,QAAQ,CAAc,CAClB,CACpB,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC,IACD,CAAC"}
1
+ {"version":3,"file":"MenuList.js","sourceRoot":"","sources":["../../src/MenuList/MenuList.tsx"],"names":[],"mappings":"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"}
@@ -1,4 +1,5 @@
1
1
  import type { IViewProps } from '@fluentui-react-native/adapters';
2
+ import { FocusZoneProps } from '@fluentui-react-native/focus-zone';
2
3
  import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
3
4
  import { IBackgroundColorTokens, LayoutTokens } from '@fluentui-react-native/tokens';
4
5
  import React from 'react';
@@ -43,6 +44,7 @@ export interface MenuListSlotProps {
43
44
  root: React.PropsWithRef<IViewProps> & {
44
45
  gap?: number;
45
46
  };
47
+ focusZone?: FocusZoneProps;
46
48
  }
47
49
  export interface MenuListType {
48
50
  props: MenuListProps;
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.types.d.ts","sourceRoot":"","sources":["../../src/MenuList/MenuList.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,sBAAsB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACrF,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,YAAY,aAAa,CAAC;AAEvC,MAAM,WAAW,cAAe,SAAQ,YAAY,EAAE,sBAAsB;IAC1E;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAChE;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAE1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACpE;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,aAAa,EAAE,SAAS,GAAG,iBAAiB,CAAC;IACvF,KAAK,EAAE,aAAa,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,mBAAmB,EAAE,OAAO,CAAC;IAC7B,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAClF,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,GAAG;QAAE,GAAG,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACzD;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,aAAa,CAAC;IACrB,MAAM,EAAE,cAAc,CAAC;IACvB,SAAS,EAAE,iBAAiB,CAAC;CAC9B"}
1
+ {"version":3,"file":"MenuList.types.d.ts","sourceRoot":"","sources":["../../src/MenuList/MenuList.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,sBAAsB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACrF,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,YAAY,aAAa,CAAC;AAEvC,MAAM,WAAW,cAAe,SAAQ,YAAY,EAAE,sBAAsB;IAC1E;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAChE;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAE1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACpE;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,aAAa,EAAE,SAAS,GAAG,iBAAiB,CAAC;IACvF,KAAK,EAAE,aAAa,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,mBAAmB,EAAE,OAAO,CAAC;IAC7B,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAClF,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,GAAG;QAAE,GAAG,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACxD,SAAS,CAAC,EAAE,cAAc,CAAC;CAC5B;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,aAAa,CAAC;IACrB,MAAM,EAAE,cAAc,CAAC;IACvB,SAAS,EAAE,iBAAiB,CAAC;CAC9B"}
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.types.js","sourceRoot":"","sources":["../../src/MenuList/MenuList.types.ts"],"names":[],"mappings":"AAKA,MAAM,CAAC,IAAM,YAAY,GAAG,UAAU,CAAC"}
1
+ {"version":3,"file":"MenuList.types.js","sourceRoot":"","sources":["../../src/MenuList/MenuList.types.ts"],"names":[],"mappings":"AAMA,MAAM,CAAC,IAAM,YAAY,GAAG,UAAU,CAAC"}
@@ -1,8 +1,7 @@
1
1
  /// <reference types="react" />
2
- import { IViewProps } from '@fluentui-react-native/adapters';
3
- import { InteractionEvent, IWithPressableOptions } from '@fluentui-react-native/interactive-hooks';
2
+ import { InteractionEvent, PressablePropsExtended } from '@fluentui-react-native/interactive-hooks';
4
3
  export declare const menuTriggerName = "MenuTrigger";
5
- export interface MenuTriggerChildProps extends Omit<IWithPressableOptions<IViewProps>, 'onPress'> {
4
+ export interface MenuTriggerChildProps extends Omit<PressablePropsExtended, 'onPress'> {
6
5
  /**
7
6
  * A RefObject to refer to the trigger component.
8
7
  */
@@ -1 +1 @@
1
- {"version":3,"file":"MenuTrigger.types.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/MenuTrigger.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAC;AAEnG,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAE7C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,qBAAqB,CAAC,UAAU,CAAC,EAAE,SAAS,CAAC;IAC/F;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAEhD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,qBAAqB,CAAC;IAC7B,UAAU,EAAE,OAAO,CAAC;CACrB"}
1
+ {"version":3,"file":"MenuTrigger.types.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/MenuTrigger.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,0CAA0C,CAAC;AAEpG,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAE7C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,sBAAsB,EAAE,SAAS,CAAC;IACpF;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAEhD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,qBAAqB,CAAC;IAC7B,UAAU,EAAE,OAAO,CAAC;CACrB"}
@@ -1 +1 @@
1
- {"version":3,"file":"MenuTrigger.types.js","sourceRoot":"","sources":["../../src/MenuTrigger/MenuTrigger.types.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,IAAM,eAAe,GAAG,aAAa,CAAC"}
1
+ {"version":3,"file":"MenuTrigger.types.js","sourceRoot":"","sources":["../../src/MenuTrigger/MenuTrigger.types.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,eAAe,GAAG,aAAa,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"getRevisedProps.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/getRevisedProps.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE9E;;;;;GAKG;AACH,eAAO,MAAM,eAAe,8BAAiC,CAAC;AAC9D,iBAAS,qBAAqB,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,GAAG,qBAAqB,CAyCzF"}
1
+ {"version":3,"file":"getRevisedProps.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/getRevisedProps.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE9E;;;;;GAKG;AACH,eAAO,MAAM,eAAe,8BAAiC,CAAC;AAC9D,iBAAS,qBAAqB,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,GAAG,qBAAqB,CAuCzF"}
@@ -28,20 +28,18 @@ function getRevisedPropsWorker(state, props) {
28
28
  props.onClick(e);
29
29
  };
30
30
  }
31
- var onHoverIn = undefined;
32
31
  if (props.onHoverIn) {
33
- onHoverIn = function (e) {
32
+ revisedProps.onHoverIn = function (e) {
34
33
  state.props.onHoverIn(isMouseEvent(e) && e);
35
34
  props.onHoverIn(e);
36
35
  };
37
36
  }
38
- var onHoverOut = undefined;
39
37
  if (props.onHoverOut) {
40
- onHoverOut = function (e) {
38
+ revisedProps.onHoverOut = function (e) {
41
39
  state.props.onHoverOut(isMouseEvent(e) && e);
42
40
  props.onHoverOut(e);
43
41
  };
44
42
  }
45
- return __assign(__assign({}, revisedProps), { onHoverIn: onHoverIn, onHoverOut: onHoverOut });
43
+ return __assign({}, revisedProps);
46
44
  }
47
45
  //# sourceMappingURL=getRevisedProps.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"getRevisedProps.js","sourceRoot":"","sources":["../../src/MenuTrigger/getRevisedProps.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EAAoB,YAAY,EAAE,MAAM,0CAA0C,CAAC;AAG1F;;;;;GAKG;AACH,MAAM,CAAC,IAAM,eAAe,GAAG,OAAO,CAAC,qBAAqB,CAAC,CAAC;AAC9D,SAAS,qBAAqB,CAAC,KAAuB,EAAE,KAAU;IAChE,IAAM,YAAY,gBAAQ,KAAK,CAAC,KAAK,CAAE,CAAC;IACxC,IAAI,KAAK,CAAC,kBAAkB,EAAE;QAC5B,YAAY,CAAC,kBAAkB,yBAAQ,KAAK,CAAC,KAAK,CAAC,kBAAkB,GAAK,KAAK,CAAC,kBAAkB,CAAE,CAAC;KACtG;IAED,IAAI,KAAK,CAAC,oBAAoB,EAAE;QAC9B,YAAY,CAAC,oBAAoB,mCAAO,KAAK,CAAC,KAAK,CAAC,oBAAoB,SAAK,KAAK,CAAC,oBAAoB,OAAC,CAAC;KAC1G;IAED,IAAI,KAAK,CAAC,qBAAqB,EAAE;QAC/B,YAAY,CAAC,qBAAqB,GAAG,UAAC,CAA2B;YAC/D,KAAK,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;YACrC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC,CAAC;KACH;IAED,IAAI,KAAK,CAAC,OAAO,EAAE;QACjB,YAAY,CAAC,OAAO,GAAG,UAAC,CAAmB;YACzC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YACvB,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACnB,CAAC,CAAC;KACH;IAED,IAAI,SAAS,GAAG,SAAS,CAAC;IAC1B,IAAI,KAAK,CAAC,SAAS,EAAE;QACnB,SAAS,GAAG,UAAC,CAAmB;YAC9B,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YAC5C,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;QACrB,CAAC,CAAC;KACH;IAED,IAAI,UAAU,GAAG,SAAS,CAAC;IAC3B,IAAI,KAAK,CAAC,UAAU,EAAE;QACpB,UAAU,GAAG,UAAC,CAAmB;YAC/B,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YAC7C,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC,CAAC;KACH;IAED,6BAAY,YAAY,KAAE,SAAS,WAAA,EAAE,UAAU,YAAA,IAAG;AACpD,CAAC"}
1
+ {"version":3,"file":"getRevisedProps.js","sourceRoot":"","sources":["../../src/MenuTrigger/getRevisedProps.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EAAoB,YAAY,EAAE,MAAM,0CAA0C,CAAC;AAG1F;;;;;GAKG;AACH,MAAM,CAAC,IAAM,eAAe,GAAG,OAAO,CAAC,qBAAqB,CAAC,CAAC;AAC9D,SAAS,qBAAqB,CAAC,KAAuB,EAAE,KAAU;IAChE,IAAM,YAAY,gBAAQ,KAAK,CAAC,KAAK,CAAE,CAAC;IACxC,IAAI,KAAK,CAAC,kBAAkB,EAAE;QAC5B,YAAY,CAAC,kBAAkB,yBAAQ,KAAK,CAAC,KAAK,CAAC,kBAAkB,GAAK,KAAK,CAAC,kBAAkB,CAAE,CAAC;KACtG;IAED,IAAI,KAAK,CAAC,oBAAoB,EAAE;QAC9B,YAAY,CAAC,oBAAoB,mCAAO,KAAK,CAAC,KAAK,CAAC,oBAAoB,SAAK,KAAK,CAAC,oBAAoB,OAAC,CAAC;KAC1G;IAED,IAAI,KAAK,CAAC,qBAAqB,EAAE;QAC/B,YAAY,CAAC,qBAAqB,GAAG,UAAC,CAA2B;YAC/D,KAAK,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;YACrC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC,CAAC;KACH;IAED,IAAI,KAAK,CAAC,OAAO,EAAE;QACjB,YAAY,CAAC,OAAO,GAAG,UAAC,CAAmB;YACzC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YACvB,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACnB,CAAC,CAAC;KACH;IAED,IAAI,KAAK,CAAC,SAAS,EAAE;QACnB,YAAY,CAAC,SAAS,GAAG,UAAC,CAAmB;YAC3C,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YAC5C,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;QACrB,CAAC,CAAC;KACH;IAED,IAAI,KAAK,CAAC,UAAU,EAAE;QACpB,YAAY,CAAC,UAAU,GAAG,UAAC,CAAmB;YAC5C,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YAC7C,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC,CAAC;KACH;IAED,oBAAY,YAAY,EAAG;AAC7B,CAAC"}
@@ -6,26 +6,26 @@ var defaultMenuItemTokens = function (t) { return ({
6
6
  backgroundColor: t.colors.transparentBackground,
7
7
  borderRadius: 5,
8
8
  checkmarkSize: 16,
9
- submenuIndicatorPadding: theme_tokens_1.globalTokens.spacing.none,
10
- submenuIndicatorSize: 16,
11
- color: t.colors.neutralForeground2,
9
+ color: t.colors.menuItemText,
12
10
  fontFamily: t.typography.families.primary,
13
11
  fontSize: theme_tokens_1.globalTokens.font.size[300],
14
12
  fontWeight: theme_tokens_1.globalTokens.font.weight.regular,
15
13
  gap: theme_tokens_1.globalTokens.spacing.xs,
16
14
  paddingHorizontal: 5,
17
15
  paddingVertical: 3,
16
+ submenuIndicatorPadding: theme_tokens_1.globalTokens.spacing.none,
17
+ submenuIndicatorSize: 16,
18
18
  focused: {
19
- backgroundColor: t.colors.brandBackground,
20
- color: t.colors.brandedContent,
19
+ backgroundColor: t.colors.menuItemBackgroundHovered,
20
+ color: t.colors.menuItemTextHovered,
21
21
  },
22
22
  pressed: {
23
- backgroundColor: t.colors.brandBackgroundPressed,
24
- color: t.colors.brandedPressedContent,
23
+ backgroundColor: t.colors.menuItemBackgroundPressed,
24
+ color: t.colors.menuItemTextHovered,
25
25
  },
26
26
  disabled: {
27
- backgroundColor: t.colors.transparentBackground,
28
- color: t.colors.neutralForegroundDisabled,
27
+ backgroundColor: t.colors.menuBackground,
28
+ color: t.colors.disabledText,
29
29
  },
30
30
  }); };
31
31
  exports.defaultMenuItemTokens = defaultMenuItemTokens;
@@ -1 +1 @@
1
- {"version":3,"file":"MenuItemTokens.macos.js","sourceRoot":"","sources":["../../src/MenuItem/MenuItemTokens.macos.ts"],"names":[],"mappings":";;;AACA,oEAAmE;AAI5D,IAAM,qBAAqB,GAAyC,UAAC,CAAQ,IAAqB,OAAA,CAAC;IACxG,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,qBAAqB;IAC/C,YAAY,EAAE,CAAC;IACf,aAAa,EAAE,EAAE;IACjB,uBAAuB,EAAE,2BAAY,CAAC,OAAO,CAAC,IAAI;IAClD,oBAAoB,EAAE,EAAE;IACxB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,kBAAkB;IAClC,UAAU,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ,CAAC,OAAO;IACzC,QAAQ,EAAE,2BAAY,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC;IACrC,UAAU,EAAE,2BAAY,CAAC,IAAI,CAAC,MAAM,CAAC,OAA0B;IAC/D,GAAG,EAAE,2BAAY,CAAC,OAAO,CAAC,EAAE;IAC5B,iBAAiB,EAAE,CAAC;IACpB,eAAe,EAAE,CAAC;IAClB,OAAO,EAAE;QACP,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,eAAe;QACzC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,cAAc;KAC/B;IACD,OAAO,EAAE;QACP,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,sBAAsB;QAChD,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,qBAAqB;KACtC;IACD,QAAQ,EAAE;QACR,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,qBAAqB;QAC/C,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,yBAAyB;KAC1C;CACF,CAAC,EAzBuG,CAyBvG,CAAC;AAzBU,QAAA,qBAAqB,yBAyB/B"}
1
+ {"version":3,"file":"MenuItemTokens.macos.js","sourceRoot":"","sources":["../../src/MenuItem/MenuItemTokens.macos.ts"],"names":[],"mappings":";;;AACA,oEAAmE;AAI5D,IAAM,qBAAqB,GAAyC,UAAC,CAAQ,IAAqB,OAAA,CAAC;IACxG,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,qBAAqB;IAC/C,YAAY,EAAE,CAAC;IACf,aAAa,EAAE,EAAE;IACjB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY;IAC5B,UAAU,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ,CAAC,OAAO;IACzC,QAAQ,EAAE,2BAAY,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC;IACrC,UAAU,EAAE,2BAAY,CAAC,IAAI,CAAC,MAAM,CAAC,OAA0B;IAC/D,GAAG,EAAE,2BAAY,CAAC,OAAO,CAAC,EAAE;IAC5B,iBAAiB,EAAE,CAAC;IACpB,eAAe,EAAE,CAAC;IAClB,uBAAuB,EAAE,2BAAY,CAAC,OAAO,CAAC,IAAI;IAClD,oBAAoB,EAAE,EAAE;IACxB,OAAO,EAAE;QACP,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,yBAAyB;QACnD,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,mBAAmB;KACpC;IACD,OAAO,EAAE;QACP,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,yBAAyB;QACnD,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,mBAAmB;KACpC;IACD,QAAQ,EAAE;QACR,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,cAAc;QACxC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY;KAC7B;CACF,CAAC,EAzBuG,CAyBvG,CAAC;AAzBU,QAAA,qBAAqB,yBAyB/B"}
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../src/MenuList/MenuList.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAgB,aAAa,EAAgB,MAAM,kBAAkB,CAAC;AA0B7E,eAAO,MAAM,QAAQ,gLAmBnB,CAAC"}
1
+ {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../src/MenuList/MenuList.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAgB,aAAa,EAAgB,MAAM,kBAAkB,CAAC;AA2B7E,eAAO,MAAM,QAAQ,gLAyCnB,CAAC"}
@@ -11,6 +11,7 @@ var MenuList_styling_1 = require("./MenuList.styling");
11
11
  var menuListContext_1 = require("../context/menuListContext");
12
12
  var useMenuList_1 = require("./useMenuList");
13
13
  var useMenuListContextValue_1 = require("./useMenuListContextValue");
14
+ var focus_zone_1 = require("@fluentui-react-native/focus-zone");
14
15
  var MenuStack = (0, framework_1.stagedComponent)(function (props) {
15
16
  var gap = props.gap, rest = (0, tslib_1.__rest)(props, ["gap"]);
16
17
  return function (final, children) {
@@ -28,15 +29,22 @@ var MenuStack = (0, framework_1.stagedComponent)(function (props) {
28
29
  };
29
30
  });
30
31
  MenuStack.displayName = 'MenuStack';
31
- exports.MenuList = (0, framework_1.compose)((0, tslib_1.__assign)((0, tslib_1.__assign)({ displayName: MenuList_types_1.menuListName }, MenuList_styling_1.stylingSettings), { slots: {
32
- root: MenuStack,
33
- }, useRender: function (userProps, useSlots) {
32
+ exports.MenuList = (0, framework_1.compose)((0, tslib_1.__assign)((0, tslib_1.__assign)({ displayName: MenuList_types_1.menuListName }, MenuList_styling_1.stylingSettings), { slots: (0, tslib_1.__assign)({ root: MenuStack }, (react_native_1.Platform.OS === 'macos' ? { focusZone: focus_zone_1.FocusZone } : null)), useRender: function (userProps, useSlots) {
34
33
  var menuList = (0, useMenuList_1.useMenuList)(userProps);
35
34
  var contextValue = (0, useMenuListContextValue_1.useMenuListContextValue)(menuList);
36
35
  var Slots = useSlots(menuList.props);
36
+ var focusZoneRef = react_1.default.useRef();
37
+ react_1.default.useEffect(function () {
38
+ var _a;
39
+ (_a = focusZoneRef === null || focusZoneRef === void 0 ? void 0 : focusZoneRef.current) === null || _a === void 0 ? void 0 : _a.focus();
40
+ }, []);
37
41
  return function (_final, children) {
38
- return ((0, framework_1.withSlots)(menuListContext_1.MenuListProvider, { value: contextValue },
39
- (0, framework_1.withSlots)(Slots.root, null, children)));
42
+ var content = react_native_1.Platform.OS === 'macos' ? ((0, framework_1.withSlots)(Slots.root, null,
43
+ (0, framework_1.withSlots)(Slots.focusZone, { componentRef: focusZoneRef, focusZoneDirection: 'vertical', defaultTabbableElement: focusZoneRef,
44
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
45
+ // @ts-ignore FocusZone takes ViewProps, but that isn't defined on it's type.
46
+ enableFocusRing: false, forceFocusMacOS: true }, children))) : ((0, framework_1.withSlots)(Slots.root, null, children));
47
+ return (0, framework_1.withSlots)(menuListContext_1.MenuListProvider, { value: contextValue }, content);
40
48
  };
41
49
  } }));
42
50
  //# sourceMappingURL=MenuList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.js","sourceRoot":"","sources":["../../src/MenuList/MenuList.tsx"],"names":[],"mappings":";;;;AAAA,qBAAqB;AACrB,6DAA0B;AAC1B,6CAAoC;AACpC,8DAA6G;AAC7G,mDAA6E;AAC7E,uDAAqD;AACrD,8DAA8D;AAC9D,6CAA4C;AAC5C,qEAAoE;AAGpE,IAAM,SAAS,GAAG,IAAA,2BAAe,EAAC,UAAC,KAAwD;IACjF,IAAA,GAAG,GAAc,KAAK,IAAnB,EAAK,IAAI,uBAAK,KAAK,EAAxB,OAAgB,CAAF,CAAW;IAC/B,OAAO,UAAC,KAAwD,EAAE,QAAyB;QACzF,IAAI,GAAG,IAAI,GAAG,GAAG,CAAC,IAAI,QAAQ,EAAE;YAC9B,6DAA6D;YAC7D,yCAAyC;YACzC,QAAQ,GAAG,eAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,KAAuB,EAAE,KAAa;gBAC7E,IAAI,eAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,EAAE;oBAC5C,OAAO,eAAK,CAAC,YAAY,CAAC,KAAK,EAAE,IAAA,sBAAU,EAAC,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC;iBAC1F;gBACD,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;SACJ;QAED,OAAO,2BAAC,mBAAI,4BAAK,IAAA,sBAAU,EAAC,IAAI,EAAE,KAAK,CAAC,GAAG,QAAQ,CAAQ,CAAC;IAC9D,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AAEvB,QAAA,QAAQ,GAAG,IAAA,mBAAO,gDAC7B,WAAW,EAAE,6BAAY,IACtB,kCAAe,KAClB,KAAK,EAAE;QACL,IAAI,EAAE,SAAS;KAChB,EACD,SAAS,EAAE,UAAC,SAAwB,EAAE,QAAgC;QACpE,IAAM,QAAQ,GAAG,IAAA,yBAAW,EAAC,SAAS,CAAC,CAAC;QACxC,IAAM,YAAY,GAAG,IAAA,iDAAuB,EAAC,QAAQ,CAAC,CAAC;QACvD,IAAM,KAAK,GAAG,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAEvC,OAAO,UAAC,MAAqB,EAAE,QAAyB;YACtD,OAAO,CACL,2BAAC,kCAAgB,IAAC,KAAK,EAAE,YAAY;gBACnC,2BAAC,KAAK,CAAC,IAAI,QAAE,QAAQ,CAAc,CAClB,CACpB,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC,IACD,CAAC"}
1
+ {"version":3,"file":"MenuList.js","sourceRoot":"","sources":["../../src/MenuList/MenuList.tsx"],"names":[],"mappings":";;;;AAAA,qBAAqB;AACrB,6DAA0B;AAC1B,6CAA8C;AAC9C,8DAA6G;AAC7G,mDAA6E;AAC7E,uDAAqD;AACrD,8DAA8D;AAC9D,6CAA4C;AAC5C,qEAAoE;AAEpE,gEAA8D;AAE9D,IAAM,SAAS,GAAG,IAAA,2BAAe,EAAC,UAAC,KAAwD;IACjF,IAAA,GAAG,GAAc,KAAK,IAAnB,EAAK,IAAI,uBAAK,KAAK,EAAxB,OAAgB,CAAF,CAAW;IAC/B,OAAO,UAAC,KAAwD,EAAE,QAAyB;QACzF,IAAI,GAAG,IAAI,GAAG,GAAG,CAAC,IAAI,QAAQ,EAAE;YAC9B,6DAA6D;YAC7D,yCAAyC;YACzC,QAAQ,GAAG,eAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,KAAuB,EAAE,KAAa;gBAC7E,IAAI,eAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,EAAE;oBAC5C,OAAO,eAAK,CAAC,YAAY,CAAC,KAAK,EAAE,IAAA,sBAAU,EAAC,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC;iBAC1F;gBACD,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;SACJ;QAED,OAAO,2BAAC,mBAAI,4BAAK,IAAA,sBAAU,EAAC,IAAI,EAAE,KAAK,CAAC,GAAG,QAAQ,CAAQ,CAAC;IAC9D,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AAEvB,QAAA,QAAQ,GAAG,IAAA,mBAAO,gDAC7B,WAAW,EAAE,6BAAY,IACtB,kCAAe,KAClB,KAAK,0BACH,IAAI,EAAE,SAAS,IACZ,CAAC,uBAAQ,CAAC,EAAE,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,sBAAS,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,GAEhE,SAAS,EAAE,UAAC,SAAwB,EAAE,QAAgC;QACpE,IAAM,QAAQ,GAAG,IAAA,yBAAW,EAAC,SAAS,CAAC,CAAC;QACxC,IAAM,YAAY,GAAG,IAAA,iDAAuB,EAAC,QAAQ,CAAC,CAAC;QACvD,IAAM,KAAK,GAAG,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAEvC,IAAM,YAAY,GAAG,eAAK,CAAC,MAAM,EAAQ,CAAC;QAE1C,eAAK,CAAC,SAAS,CAAC;;YACd,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,0CAAE,KAAK,EAAE,CAAC;QACjC,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,OAAO,UAAC,MAAqB,EAAE,QAAyB;YACtD,IAAM,OAAO,GACX,uBAAQ,CAAC,EAAE,KAAK,OAAO,CAAC,CAAC,CAAC,CACxB,2BAAC,KAAK,CAAC,IAAI;gBACT,2BAAC,KAAK,CAAC,SAAS,IACd,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,UAAU,EAC9B,sBAAsB,EAAE,YAAY;oBACpC,6DAA6D;oBAC7D,6EAA6E;oBAC7E,eAAe,EAAE,KAAK,EACtB,eAAe,EAAE,IAAI,IAEpB,QAAQ,CACO,CACP,CACd,CAAC,CAAC,CAAC,CACF,2BAAC,KAAK,CAAC,IAAI,QAAE,QAAQ,CAAc,CACpC,CAAC;YAEJ,OAAO,2BAAC,kCAAgB,IAAC,KAAK,EAAE,YAAY,IAAG,OAAO,CAAoB,CAAC;QAC7E,CAAC,CAAC;IACJ,CAAC,IACD,CAAC"}
@@ -1,4 +1,5 @@
1
1
  import type { IViewProps } from '@fluentui-react-native/adapters';
2
+ import { FocusZoneProps } from '@fluentui-react-native/focus-zone';
2
3
  import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
3
4
  import { IBackgroundColorTokens, LayoutTokens } from '@fluentui-react-native/tokens';
4
5
  import React from 'react';
@@ -43,6 +44,7 @@ export interface MenuListSlotProps {
43
44
  root: React.PropsWithRef<IViewProps> & {
44
45
  gap?: number;
45
46
  };
47
+ focusZone?: FocusZoneProps;
46
48
  }
47
49
  export interface MenuListType {
48
50
  props: MenuListProps;
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.types.d.ts","sourceRoot":"","sources":["../../src/MenuList/MenuList.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,sBAAsB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACrF,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,YAAY,aAAa,CAAC;AAEvC,MAAM,WAAW,cAAe,SAAQ,YAAY,EAAE,sBAAsB;IAC1E;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAChE;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAE1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACpE;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,aAAa,EAAE,SAAS,GAAG,iBAAiB,CAAC;IACvF,KAAK,EAAE,aAAa,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,mBAAmB,EAAE,OAAO,CAAC;IAC7B,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAClF,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,GAAG;QAAE,GAAG,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACzD;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,aAAa,CAAC;IACrB,MAAM,EAAE,cAAc,CAAC;IACvB,SAAS,EAAE,iBAAiB,CAAC;CAC9B"}
1
+ {"version":3,"file":"MenuList.types.d.ts","sourceRoot":"","sources":["../../src/MenuList/MenuList.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,sBAAsB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACrF,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,YAAY,aAAa,CAAC;AAEvC,MAAM,WAAW,cAAe,SAAQ,YAAY,EAAE,sBAAsB;IAC1E;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAChE;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAE1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACpE;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,aAAa,EAAE,SAAS,GAAG,iBAAiB,CAAC;IACvF,KAAK,EAAE,aAAa,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,mBAAmB,EAAE,OAAO,CAAC;IAC7B,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAClF,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,GAAG;QAAE,GAAG,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACxD,SAAS,CAAC,EAAE,cAAc,CAAC;CAC5B;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,aAAa,CAAC;IACrB,MAAM,EAAE,cAAc,CAAC;IACvB,SAAS,EAAE,iBAAiB,CAAC;CAC9B"}
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.types.js","sourceRoot":"","sources":["../../src/MenuList/MenuList.types.ts"],"names":[],"mappings":";;;AAKa,QAAA,YAAY,GAAG,UAAU,CAAC"}
1
+ {"version":3,"file":"MenuList.types.js","sourceRoot":"","sources":["../../src/MenuList/MenuList.types.ts"],"names":[],"mappings":";;;AAMa,QAAA,YAAY,GAAG,UAAU,CAAC"}
@@ -1,8 +1,7 @@
1
1
  /// <reference types="react" />
2
- import { IViewProps } from '@fluentui-react-native/adapters';
3
- import { InteractionEvent, IWithPressableOptions } from '@fluentui-react-native/interactive-hooks';
2
+ import { InteractionEvent, PressablePropsExtended } from '@fluentui-react-native/interactive-hooks';
4
3
  export declare const menuTriggerName = "MenuTrigger";
5
- export interface MenuTriggerChildProps extends Omit<IWithPressableOptions<IViewProps>, 'onPress'> {
4
+ export interface MenuTriggerChildProps extends Omit<PressablePropsExtended, 'onPress'> {
6
5
  /**
7
6
  * A RefObject to refer to the trigger component.
8
7
  */
@@ -1 +1 @@
1
- {"version":3,"file":"MenuTrigger.types.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/MenuTrigger.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAC;AAEnG,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAE7C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,qBAAqB,CAAC,UAAU,CAAC,EAAE,SAAS,CAAC;IAC/F;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAEhD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,qBAAqB,CAAC;IAC7B,UAAU,EAAE,OAAO,CAAC;CACrB"}
1
+ {"version":3,"file":"MenuTrigger.types.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/MenuTrigger.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,0CAA0C,CAAC;AAEpG,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAE7C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,sBAAsB,EAAE,SAAS,CAAC;IACpF;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAEhD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,qBAAqB,CAAC;IAC7B,UAAU,EAAE,OAAO,CAAC;CACrB"}
@@ -1 +1 @@
1
- {"version":3,"file":"MenuTrigger.types.js","sourceRoot":"","sources":["../../src/MenuTrigger/MenuTrigger.types.ts"],"names":[],"mappings":";;;AAGa,QAAA,eAAe,GAAG,aAAa,CAAC"}
1
+ {"version":3,"file":"MenuTrigger.types.js","sourceRoot":"","sources":["../../src/MenuTrigger/MenuTrigger.types.ts"],"names":[],"mappings":";;;AAEa,QAAA,eAAe,GAAG,aAAa,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"getRevisedProps.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/getRevisedProps.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE9E;;;;;GAKG;AACH,eAAO,MAAM,eAAe,8BAAiC,CAAC;AAC9D,iBAAS,qBAAqB,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,GAAG,qBAAqB,CAyCzF"}
1
+ {"version":3,"file":"getRevisedProps.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/getRevisedProps.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE9E;;;;;GAKG;AACH,eAAO,MAAM,eAAe,8BAAiC,CAAC;AAC9D,iBAAS,qBAAqB,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,GAAG,qBAAqB,CAuCzF"}
@@ -31,20 +31,18 @@ function getRevisedPropsWorker(state, props) {
31
31
  props.onClick(e);
32
32
  };
33
33
  }
34
- var onHoverIn = undefined;
35
34
  if (props.onHoverIn) {
36
- onHoverIn = function (e) {
35
+ revisedProps.onHoverIn = function (e) {
37
36
  state.props.onHoverIn((0, interactive_hooks_1.isMouseEvent)(e) && e);
38
37
  props.onHoverIn(e);
39
38
  };
40
39
  }
41
- var onHoverOut = undefined;
42
40
  if (props.onHoverOut) {
43
- onHoverOut = function (e) {
41
+ revisedProps.onHoverOut = function (e) {
44
42
  state.props.onHoverOut((0, interactive_hooks_1.isMouseEvent)(e) && e);
45
43
  props.onHoverOut(e);
46
44
  };
47
45
  }
48
- return (0, tslib_1.__assign)((0, tslib_1.__assign)({}, revisedProps), { onHoverIn: onHoverIn, onHoverOut: onHoverOut });
46
+ return (0, tslib_1.__assign)({}, revisedProps);
49
47
  }
50
48
  //# sourceMappingURL=getRevisedProps.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"getRevisedProps.js","sourceRoot":"","sources":["../../src/MenuTrigger/getRevisedProps.ts"],"names":[],"mappings":";;;;AACA,8DAA2D;AAC3D,8EAA0F;AAG1F;;;;;GAKG;AACU,QAAA,eAAe,GAAG,IAAA,mBAAO,EAAC,qBAAqB,CAAC,CAAC;AAC9D,SAAS,qBAAqB,CAAC,KAAuB,EAAE,KAAU;IAChE,IAAM,YAAY,6BAAQ,KAAK,CAAC,KAAK,CAAE,CAAC;IACxC,IAAI,KAAK,CAAC,kBAAkB,EAAE;QAC5B,YAAY,CAAC,kBAAkB,mDAAQ,KAAK,CAAC,KAAK,CAAC,kBAAkB,GAAK,KAAK,CAAC,kBAAkB,CAAE,CAAC;KACtG;IAED,IAAI,KAAK,CAAC,oBAAoB,EAAE;QAC9B,YAAY,CAAC,oBAAoB,6DAAO,KAAK,CAAC,KAAK,CAAC,oBAAoB,SAAK,KAAK,CAAC,oBAAoB,OAAC,CAAC;KAC1G;IAED,IAAI,KAAK,CAAC,qBAAqB,EAAE;QAC/B,YAAY,CAAC,qBAAqB,GAAG,UAAC,CAA2B;YAC/D,KAAK,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;YACrC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC,CAAC;KACH;IAED,IAAI,KAAK,CAAC,OAAO,EAAE;QACjB,YAAY,CAAC,OAAO,GAAG,UAAC,CAAmB;YACzC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YACvB,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACnB,CAAC,CAAC;KACH;IAED,IAAI,SAAS,GAAG,SAAS,CAAC;IAC1B,IAAI,KAAK,CAAC,SAAS,EAAE;QACnB,SAAS,GAAG,UAAC,CAAmB;YAC9B,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,IAAA,gCAAY,EAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YAC5C,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;QACrB,CAAC,CAAC;KACH;IAED,IAAI,UAAU,GAAG,SAAS,CAAC;IAC3B,IAAI,KAAK,CAAC,UAAU,EAAE;QACpB,UAAU,GAAG,UAAC,CAAmB;YAC/B,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,IAAA,gCAAY,EAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YAC7C,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC,CAAC;KACH;IAED,uDAAY,YAAY,KAAE,SAAS,WAAA,EAAE,UAAU,YAAA,IAAG;AACpD,CAAC"}
1
+ {"version":3,"file":"getRevisedProps.js","sourceRoot":"","sources":["../../src/MenuTrigger/getRevisedProps.ts"],"names":[],"mappings":";;;;AACA,8DAA2D;AAC3D,8EAA0F;AAG1F;;;;;GAKG;AACU,QAAA,eAAe,GAAG,IAAA,mBAAO,EAAC,qBAAqB,CAAC,CAAC;AAC9D,SAAS,qBAAqB,CAAC,KAAuB,EAAE,KAAU;IAChE,IAAM,YAAY,6BAAQ,KAAK,CAAC,KAAK,CAAE,CAAC;IACxC,IAAI,KAAK,CAAC,kBAAkB,EAAE;QAC5B,YAAY,CAAC,kBAAkB,mDAAQ,KAAK,CAAC,KAAK,CAAC,kBAAkB,GAAK,KAAK,CAAC,kBAAkB,CAAE,CAAC;KACtG;IAED,IAAI,KAAK,CAAC,oBAAoB,EAAE;QAC9B,YAAY,CAAC,oBAAoB,6DAAO,KAAK,CAAC,KAAK,CAAC,oBAAoB,SAAK,KAAK,CAAC,oBAAoB,OAAC,CAAC;KAC1G;IAED,IAAI,KAAK,CAAC,qBAAqB,EAAE;QAC/B,YAAY,CAAC,qBAAqB,GAAG,UAAC,CAA2B;YAC/D,KAAK,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;YACrC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC,CAAC;KACH;IAED,IAAI,KAAK,CAAC,OAAO,EAAE;QACjB,YAAY,CAAC,OAAO,GAAG,UAAC,CAAmB;YACzC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YACvB,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACnB,CAAC,CAAC;KACH;IAED,IAAI,KAAK,CAAC,SAAS,EAAE;QACnB,YAAY,CAAC,SAAS,GAAG,UAAC,CAAmB;YAC3C,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,IAAA,gCAAY,EAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YAC5C,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;QACrB,CAAC,CAAC;KACH;IAED,IAAI,KAAK,CAAC,UAAU,EAAE;QACpB,YAAY,CAAC,UAAU,GAAG,UAAC,CAAmB;YAC5C,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,IAAA,gCAAY,EAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YAC7C,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC,CAAC;KACH;IAED,iCAAY,YAAY,EAAG;AAC7B,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui-react-native/menu",
3
- "version": "1.0.61",
3
+ "version": "1.0.63",
4
4
  "description": "A cross-platform Menu component using the Fluent Design System",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -24,6 +24,7 @@
24
24
  "dependencies": {
25
25
  "@fluentui-react-native/adapters": ">=0.9.3 <1.0.0",
26
26
  "@fluentui-react-native/callout": ">=0.21.28 <1.0.0",
27
+ "@fluentui-react-native/focus-zone": ">=0.10.30 <1.0.0",
27
28
  "@fluentui-react-native/framework": "0.8.15",
28
29
  "@fluentui-react-native/interactive-hooks": ">=0.19.4 <1.0.0",
29
30
  "@fluentui-react-native/text": ">=0.15.11 <1.0.0",
@@ -7,25 +7,25 @@ export const defaultMenuItemTokens: TokenSettings<MenuItemTokens, Theme> = (t: T
7
7
  backgroundColor: t.colors.transparentBackground,
8
8
  borderRadius: 5, // hardcoded for now to match ContextualMenu
9
9
  checkmarkSize: 16,
10
- submenuIndicatorPadding: globalTokens.spacing.none,
11
- submenuIndicatorSize: 16,
12
- color: t.colors.neutralForeground2,
10
+ color: t.colors.menuItemText, // matches ContextualMenu
13
11
  fontFamily: t.typography.families.primary,
14
12
  fontSize: globalTokens.font.size[300],
15
13
  fontWeight: globalTokens.font.weight.regular as FontWeightValue,
16
14
  gap: globalTokens.spacing.xs,
17
15
  paddingHorizontal: 5, // hardcoded for now to match ContextualMenu
18
16
  paddingVertical: 3, // hardcoded for now to match ContextualMenu
17
+ submenuIndicatorPadding: globalTokens.spacing.none,
18
+ submenuIndicatorSize: 16,
19
19
  focused: {
20
- backgroundColor: t.colors.brandBackground,
21
- color: t.colors.brandedContent,
20
+ backgroundColor: t.colors.menuItemBackgroundHovered,
21
+ color: t.colors.menuItemTextHovered,
22
22
  },
23
23
  pressed: {
24
- backgroundColor: t.colors.brandBackgroundPressed,
25
- color: t.colors.brandedPressedContent,
24
+ backgroundColor: t.colors.menuItemBackgroundPressed,
25
+ color: t.colors.menuItemTextHovered,
26
26
  },
27
27
  disabled: {
28
- backgroundColor: t.colors.transparentBackground,
29
- color: t.colors.neutralForegroundDisabled,
28
+ backgroundColor: t.colors.menuBackground,
29
+ color: t.colors.disabledText,
30
30
  },
31
31
  });
@@ -1,6 +1,6 @@
1
1
  /** @jsx withSlots */
2
2
  import React from 'react';
3
- import { View } from 'react-native';
3
+ import { Platform, View } from 'react-native';
4
4
  import { compose, mergeProps, stagedComponent, UseSlots, withSlots } from '@fluentui-react-native/framework';
5
5
  import { menuListName, MenuListProps, MenuListType } from './MenuList.types';
6
6
  import { stylingSettings } from './MenuList.styling';
@@ -8,6 +8,7 @@ import { MenuListProvider } from '../context/menuListContext';
8
8
  import { useMenuList } from './useMenuList';
9
9
  import { useMenuListContextValue } from './useMenuListContextValue';
10
10
  import { IViewProps } from '@fluentui-react-native/adapters';
11
+ import { FocusZone } from '@fluentui-react-native/focus-zone';
11
12
 
12
13
  const MenuStack = stagedComponent((props: React.PropsWithRef<IViewProps> & { gap?: number }) => {
13
14
  const { gap, ...rest } = props;
@@ -33,18 +34,40 @@ export const MenuList = compose<MenuListType>({
33
34
  ...stylingSettings,
34
35
  slots: {
35
36
  root: MenuStack,
37
+ ...(Platform.OS === 'macos' ? { focusZone: FocusZone } : null),
36
38
  },
37
39
  useRender: (userProps: MenuListProps, useSlots: UseSlots<MenuListType>) => {
38
40
  const menuList = useMenuList(userProps);
39
41
  const contextValue = useMenuListContextValue(menuList);
40
42
  const Slots = useSlots(menuList.props);
41
43
 
44
+ const focusZoneRef = React.useRef<View>();
45
+
46
+ React.useEffect(() => {
47
+ focusZoneRef?.current?.focus();
48
+ }, []);
49
+
42
50
  return (_final: MenuListProps, children: React.ReactNode) => {
43
- return (
44
- <MenuListProvider value={contextValue}>
51
+ const content =
52
+ Platform.OS === 'macos' ? (
53
+ <Slots.root>
54
+ <Slots.focusZone
55
+ componentRef={focusZoneRef}
56
+ focusZoneDirection={'vertical'}
57
+ defaultTabbableElement={focusZoneRef}
58
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
59
+ // @ts-ignore FocusZone takes ViewProps, but that isn't defined on it's type.
60
+ enableFocusRing={false}
61
+ forceFocusMacOS={true}
62
+ >
63
+ {children}
64
+ </Slots.focusZone>
65
+ </Slots.root>
66
+ ) : (
45
67
  <Slots.root>{children}</Slots.root>
46
- </MenuListProvider>
47
- );
68
+ );
69
+
70
+ return <MenuListProvider value={contextValue}>{content}</MenuListProvider>;
48
71
  };
49
72
  },
50
73
  });
@@ -1,4 +1,5 @@
1
1
  import type { IViewProps } from '@fluentui-react-native/adapters';
2
+ import { FocusZoneProps } from '@fluentui-react-native/focus-zone';
2
3
  import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
3
4
  import { IBackgroundColorTokens, LayoutTokens } from '@fluentui-react-native/tokens';
4
5
  import React from 'react';
@@ -49,6 +50,7 @@ export interface MenuListState extends Omit<MenuListProps, 'checked' | 'onChecke
49
50
 
50
51
  export interface MenuListSlotProps {
51
52
  root: React.PropsWithRef<IViewProps> & { gap?: number };
53
+ focusZone?: FocusZoneProps; // macOS only
52
54
  }
53
55
 
54
56
  export interface MenuListType {
@@ -1,9 +1,8 @@
1
- import { IViewProps } from '@fluentui-react-native/adapters';
2
- import { InteractionEvent, IWithPressableOptions } from '@fluentui-react-native/interactive-hooks';
1
+ import { InteractionEvent, PressablePropsExtended } from '@fluentui-react-native/interactive-hooks';
3
2
 
4
3
  export const menuTriggerName = 'MenuTrigger';
5
4
 
6
- export interface MenuTriggerChildProps extends Omit<IWithPressableOptions<IViewProps>, 'onPress'> {
5
+ export interface MenuTriggerChildProps extends Omit<PressablePropsExtended, 'onPress'> {
7
6
  /**
8
7
  * A RefObject to refer to the trigger component.
9
8
  */
@@ -34,21 +34,19 @@ function getRevisedPropsWorker(state: MenuTriggerState, props: any): MenuTrigger
34
34
  };
35
35
  }
36
36
 
37
- let onHoverIn = undefined;
38
37
  if (props.onHoverIn) {
39
- onHoverIn = (e: InteractionEvent) => {
38
+ revisedProps.onHoverIn = (e: InteractionEvent) => {
40
39
  state.props.onHoverIn(isMouseEvent(e) && e);
41
40
  props.onHoverIn(e);
42
41
  };
43
42
  }
44
43
 
45
- let onHoverOut = undefined;
46
44
  if (props.onHoverOut) {
47
- onHoverOut = (e: InteractionEvent) => {
45
+ revisedProps.onHoverOut = (e: InteractionEvent) => {
48
46
  state.props.onHoverOut(isMouseEvent(e) && e);
49
47
  props.onHoverOut(e);
50
48
  };
51
49
  }
52
50
 
53
- return { ...revisedProps, onHoverIn, onHoverOut };
51
+ return { ...revisedProps };
54
52
  }