@react-aria/menu 3.11.3-nightly.4321 → 3.12.0

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 (184) hide show
  1. package/dist/ar-AE.main.js +6 -0
  2. package/dist/ar-AE.main.js.map +1 -0
  3. package/dist/ar-AE.mjs +8 -0
  4. package/dist/ar-AE.module.js +8 -0
  5. package/dist/ar-AE.module.js.map +1 -0
  6. package/dist/bg-BG.main.js +6 -0
  7. package/dist/bg-BG.main.js.map +1 -0
  8. package/dist/bg-BG.mjs +8 -0
  9. package/dist/bg-BG.module.js +8 -0
  10. package/dist/bg-BG.module.js.map +1 -0
  11. package/dist/cs-CZ.main.js +6 -0
  12. package/dist/cs-CZ.main.js.map +1 -0
  13. package/dist/cs-CZ.mjs +8 -0
  14. package/dist/cs-CZ.module.js +8 -0
  15. package/dist/cs-CZ.module.js.map +1 -0
  16. package/dist/da-DK.main.js +6 -0
  17. package/dist/da-DK.main.js.map +1 -0
  18. package/dist/da-DK.mjs +8 -0
  19. package/dist/da-DK.module.js +8 -0
  20. package/dist/da-DK.module.js.map +1 -0
  21. package/dist/de-DE.main.js +6 -0
  22. package/dist/de-DE.main.js.map +1 -0
  23. package/dist/de-DE.mjs +8 -0
  24. package/dist/de-DE.module.js +8 -0
  25. package/dist/de-DE.module.js.map +1 -0
  26. package/dist/el-GR.main.js +6 -0
  27. package/dist/el-GR.main.js.map +1 -0
  28. package/dist/el-GR.mjs +8 -0
  29. package/dist/el-GR.module.js +8 -0
  30. package/dist/el-GR.module.js.map +1 -0
  31. package/dist/en-US.main.js +6 -0
  32. package/dist/en-US.main.js.map +1 -0
  33. package/dist/en-US.mjs +8 -0
  34. package/dist/en-US.module.js +8 -0
  35. package/dist/en-US.module.js.map +1 -0
  36. package/dist/es-ES.main.js +6 -0
  37. package/dist/es-ES.main.js.map +1 -0
  38. package/dist/es-ES.mjs +8 -0
  39. package/dist/es-ES.module.js +8 -0
  40. package/dist/es-ES.module.js.map +1 -0
  41. package/dist/et-EE.main.js +6 -0
  42. package/dist/et-EE.main.js.map +1 -0
  43. package/dist/et-EE.mjs +8 -0
  44. package/dist/et-EE.module.js +8 -0
  45. package/dist/et-EE.module.js.map +1 -0
  46. package/dist/fi-FI.main.js +6 -0
  47. package/dist/fi-FI.main.js.map +1 -0
  48. package/dist/fi-FI.mjs +8 -0
  49. package/dist/fi-FI.module.js +8 -0
  50. package/dist/fi-FI.module.js.map +1 -0
  51. package/dist/fr-FR.main.js +6 -0
  52. package/dist/fr-FR.main.js.map +1 -0
  53. package/dist/fr-FR.mjs +8 -0
  54. package/dist/fr-FR.module.js +8 -0
  55. package/dist/fr-FR.module.js.map +1 -0
  56. package/dist/he-IL.main.js +6 -0
  57. package/dist/he-IL.main.js.map +1 -0
  58. package/dist/he-IL.mjs +8 -0
  59. package/dist/he-IL.module.js +8 -0
  60. package/dist/he-IL.module.js.map +1 -0
  61. package/dist/hr-HR.main.js +6 -0
  62. package/dist/hr-HR.main.js.map +1 -0
  63. package/dist/hr-HR.mjs +8 -0
  64. package/dist/hr-HR.module.js +8 -0
  65. package/dist/hr-HR.module.js.map +1 -0
  66. package/dist/hu-HU.main.js +6 -0
  67. package/dist/hu-HU.main.js.map +1 -0
  68. package/dist/hu-HU.mjs +8 -0
  69. package/dist/hu-HU.module.js +8 -0
  70. package/dist/hu-HU.module.js.map +1 -0
  71. package/dist/import.mjs +356 -243
  72. package/dist/it-IT.main.js +6 -0
  73. package/dist/it-IT.main.js.map +1 -0
  74. package/dist/it-IT.mjs +8 -0
  75. package/dist/it-IT.module.js +8 -0
  76. package/dist/it-IT.module.js.map +1 -0
  77. package/dist/ja-JP.main.js +6 -0
  78. package/dist/ja-JP.main.js.map +1 -0
  79. package/dist/ja-JP.mjs +8 -0
  80. package/dist/ja-JP.module.js +8 -0
  81. package/dist/ja-JP.module.js.map +1 -0
  82. package/dist/ko-KR.main.js +6 -0
  83. package/dist/ko-KR.main.js.map +1 -0
  84. package/dist/ko-KR.mjs +8 -0
  85. package/dist/ko-KR.module.js +8 -0
  86. package/dist/ko-KR.module.js.map +1 -0
  87. package/dist/lt-LT.main.js +6 -0
  88. package/dist/lt-LT.main.js.map +1 -0
  89. package/dist/lt-LT.mjs +8 -0
  90. package/dist/lt-LT.module.js +8 -0
  91. package/dist/lt-LT.module.js.map +1 -0
  92. package/dist/lv-LV.main.js +6 -0
  93. package/dist/lv-LV.main.js.map +1 -0
  94. package/dist/lv-LV.mjs +8 -0
  95. package/dist/lv-LV.module.js +8 -0
  96. package/dist/lv-LV.module.js.map +1 -0
  97. package/dist/main.js +353 -239
  98. package/dist/main.js.map +1 -1
  99. package/dist/module.js +356 -243
  100. package/dist/module.js.map +1 -1
  101. package/dist/nb-NO.main.js +6 -0
  102. package/dist/nb-NO.main.js.map +1 -0
  103. package/dist/nb-NO.mjs +8 -0
  104. package/dist/nb-NO.module.js +8 -0
  105. package/dist/nb-NO.module.js.map +1 -0
  106. package/dist/nl-NL.main.js +6 -0
  107. package/dist/nl-NL.main.js.map +1 -0
  108. package/dist/nl-NL.mjs +8 -0
  109. package/dist/nl-NL.module.js +8 -0
  110. package/dist/nl-NL.module.js.map +1 -0
  111. package/dist/pl-PL.main.js +6 -0
  112. package/dist/pl-PL.main.js.map +1 -0
  113. package/dist/pl-PL.mjs +8 -0
  114. package/dist/pl-PL.module.js +8 -0
  115. package/dist/pl-PL.module.js.map +1 -0
  116. package/dist/pt-BR.main.js +6 -0
  117. package/dist/pt-BR.main.js.map +1 -0
  118. package/dist/pt-BR.mjs +8 -0
  119. package/dist/pt-BR.module.js +8 -0
  120. package/dist/pt-BR.module.js.map +1 -0
  121. package/dist/pt-PT.main.js +6 -0
  122. package/dist/pt-PT.main.js.map +1 -0
  123. package/dist/pt-PT.mjs +8 -0
  124. package/dist/pt-PT.module.js +8 -0
  125. package/dist/pt-PT.module.js.map +1 -0
  126. package/dist/ro-RO.main.js +6 -0
  127. package/dist/ro-RO.main.js.map +1 -0
  128. package/dist/ro-RO.mjs +8 -0
  129. package/dist/ro-RO.module.js +8 -0
  130. package/dist/ro-RO.module.js.map +1 -0
  131. package/dist/ru-RU.main.js +6 -0
  132. package/dist/ru-RU.main.js.map +1 -0
  133. package/dist/ru-RU.mjs +8 -0
  134. package/dist/ru-RU.module.js +8 -0
  135. package/dist/ru-RU.module.js.map +1 -0
  136. package/dist/sk-SK.main.js +6 -0
  137. package/dist/sk-SK.main.js.map +1 -0
  138. package/dist/sk-SK.mjs +8 -0
  139. package/dist/sk-SK.module.js +8 -0
  140. package/dist/sk-SK.module.js.map +1 -0
  141. package/dist/sl-SI.main.js +6 -0
  142. package/dist/sl-SI.main.js.map +1 -0
  143. package/dist/sl-SI.mjs +8 -0
  144. package/dist/sl-SI.module.js +8 -0
  145. package/dist/sl-SI.module.js.map +1 -0
  146. package/dist/sr-SP.main.js +6 -0
  147. package/dist/sr-SP.main.js.map +1 -0
  148. package/dist/sr-SP.mjs +8 -0
  149. package/dist/sr-SP.module.js +8 -0
  150. package/dist/sr-SP.module.js.map +1 -0
  151. package/dist/sv-SE.main.js +6 -0
  152. package/dist/sv-SE.main.js.map +1 -0
  153. package/dist/sv-SE.mjs +8 -0
  154. package/dist/sv-SE.module.js +8 -0
  155. package/dist/sv-SE.module.js.map +1 -0
  156. package/dist/tr-TR.main.js +6 -0
  157. package/dist/tr-TR.main.js.map +1 -0
  158. package/dist/tr-TR.mjs +8 -0
  159. package/dist/tr-TR.module.js +8 -0
  160. package/dist/tr-TR.module.js.map +1 -0
  161. package/dist/types.d.ts +45 -4
  162. package/dist/types.d.ts.map +1 -1
  163. package/dist/uk-UA.main.js +6 -0
  164. package/dist/uk-UA.main.js.map +1 -0
  165. package/dist/uk-UA.mjs +8 -0
  166. package/dist/uk-UA.module.js +8 -0
  167. package/dist/uk-UA.module.js.map +1 -0
  168. package/dist/zh-CN.main.js +6 -0
  169. package/dist/zh-CN.main.js.map +1 -0
  170. package/dist/zh-CN.mjs +8 -0
  171. package/dist/zh-CN.module.js +8 -0
  172. package/dist/zh-CN.module.js.map +1 -0
  173. package/dist/zh-TW.main.js +6 -0
  174. package/dist/zh-TW.main.js.map +1 -0
  175. package/dist/zh-TW.mjs +8 -0
  176. package/dist/zh-TW.module.js +8 -0
  177. package/dist/zh-TW.module.js.map +1 -0
  178. package/package.json +14 -14
  179. package/src/index.ts +2 -0
  180. package/src/useMenu.ts +5 -5
  181. package/src/useMenuItem.ts +61 -82
  182. package/src/useMenuTrigger.ts +2 -1
  183. package/src/useSafelyMouseToSubmenu.ts +158 -0
  184. package/src/useSubmenuTrigger.ts +235 -0
package/dist/sv-SE.mjs ADDED
@@ -0,0 +1,8 @@
1
+ var $9e9fef000aa4c013$exports = {};
2
+ $9e9fef000aa4c013$exports = {
3
+ "longPressMessage": `H\xe5ll nedtryckt eller tryck p\xe5 Alt + pil ned\xe5t f\xf6r att \xf6ppna menyn`
4
+ };
5
+
6
+
7
+ export {$9e9fef000aa4c013$exports as default};
8
+ //# sourceMappingURL=sv-SE.module.js.map
@@ -0,0 +1,8 @@
1
+ var $9e9fef000aa4c013$exports = {};
2
+ $9e9fef000aa4c013$exports = {
3
+ "longPressMessage": `H\xe5ll nedtryckt eller tryck p\xe5 Alt + pil ned\xe5t f\xf6r att \xf6ppna menyn`
4
+ };
5
+
6
+
7
+ export {$9e9fef000aa4c013$exports as default};
8
+ //# sourceMappingURL=sv-SE.module.js.map
@@ -0,0 +1 @@
1
+ {"mappings":";AAAA,4BAAiB;IAAG,oBAAoB,CAAC,gFAAiE,CAAC;AAC3G","sources":["packages/@react-aria/menu/intl/sv-SE.json"],"sourcesContent":["{\n \"longPressMessage\": \"Håll nedtryckt eller tryck på Alt + pil nedåt för att öppna menyn\"\n}\n"],"names":[],"version":3,"file":"sv-SE.module.js.map"}
@@ -0,0 +1,6 @@
1
+ module.exports = {
2
+ "longPressMessage": `Men\xfcy\xfc a\xe7mak i\xe7in uzun bas\u{131}n veya Alt + A\u{15F}a\u{11F}\u{131} Ok tu\u{15F}una bas\u{131}n`
3
+ };
4
+
5
+
6
+ //# sourceMappingURL=tr-TR.main.js.map
@@ -0,0 +1 @@
1
+ {"mappings":"AAAA,iBAAiB;IAAG,oBAAoB,CAAC,6GAA6D,CAAC;AACvG","sources":["packages/@react-aria/menu/intl/tr-TR.json"],"sourcesContent":["{\n \"longPressMessage\": \"Menüyü açmak için uzun basın veya Alt + Aşağı Ok tuşuna basın\"\n}\n"],"names":[],"version":3,"file":"tr-TR.main.js.map"}
package/dist/tr-TR.mjs ADDED
@@ -0,0 +1,8 @@
1
+ var $c016c8183bbe3d68$exports = {};
2
+ $c016c8183bbe3d68$exports = {
3
+ "longPressMessage": `Men\xfcy\xfc a\xe7mak i\xe7in uzun bas\u{131}n veya Alt + A\u{15F}a\u{11F}\u{131} Ok tu\u{15F}una bas\u{131}n`
4
+ };
5
+
6
+
7
+ export {$c016c8183bbe3d68$exports as default};
8
+ //# sourceMappingURL=tr-TR.module.js.map
@@ -0,0 +1,8 @@
1
+ var $c016c8183bbe3d68$exports = {};
2
+ $c016c8183bbe3d68$exports = {
3
+ "longPressMessage": `Men\xfcy\xfc a\xe7mak i\xe7in uzun bas\u{131}n veya Alt + A\u{15F}a\u{11F}\u{131} Ok tu\u{15F}una bas\u{131}n`
4
+ };
5
+
6
+
7
+ export {$c016c8183bbe3d68$exports as default};
8
+ //# sourceMappingURL=tr-TR.module.js.map
@@ -0,0 +1 @@
1
+ {"mappings":";AAAA,4BAAiB;IAAG,oBAAoB,CAAC,6GAA6D,CAAC;AACvG","sources":["packages/@react-aria/menu/intl/tr-TR.json"],"sourcesContent":["{\n \"longPressMessage\": \"Menüyü açmak için uzun basın veya Alt + Aşağı Ok tuşuna basın\"\n}\n"],"names":[],"version":3,"file":"tr-TR.module.js.map"}
package/dist/types.d.ts CHANGED
@@ -1,14 +1,15 @@
1
1
  import { AriaMenuProps, MenuTriggerType } from "@react-types/menu";
2
- import { DOMAttributes, KeyboardDelegate, FocusableElement, Key } from "@react-types/shared";
2
+ import { DOMAttributes, KeyboardDelegate, KeyboardEvents, DOMProps, FocusableElement, FocusEvents, HoverEvents, Key, PressEvents, Node } from "@react-types/shared";
3
3
  import { RefObject, ReactNode } from "react";
4
4
  import { TreeState } from "@react-stately/tree";
5
5
  import { AriaButtonProps } from "@react-types/button";
6
- import { MenuTriggerState } from "@react-stately/menu";
6
+ import { MenuTriggerState, SubmenuTriggerState } from "@react-stately/menu";
7
+ import { AriaPopoverProps, OverlayProps } from "@react-aria/overlays";
7
8
  export interface MenuAria {
8
9
  /** Props for the menu element. */
9
10
  menuProps: DOMAttributes;
10
11
  }
11
- export interface AriaMenuOptions<T> extends Omit<AriaMenuProps<T>, 'children'> {
12
+ export interface AriaMenuOptions<T> extends Omit<AriaMenuProps<T>, 'children'>, KeyboardEvents {
12
13
  /** Whether the menu uses virtual scrolling. */
13
14
  isVirtualized?: boolean;
14
15
  /**
@@ -42,6 +43,7 @@ export interface MenuTriggerAria<T> {
42
43
  * Provides the behavior and accessibility implementation for a menu trigger.
43
44
  * @param props - Props for the menu trigger.
44
45
  * @param state - State for the menu trigger.
46
+ * @param ref - Ref to the HTML element trigger for the menu.
45
47
  */
46
48
  export function useMenuTrigger<T>(props: AriaMenuTriggerProps, state: MenuTriggerState, ref: RefObject<Element>): MenuTriggerAria<T>;
47
49
  export interface MenuItemAria {
@@ -62,7 +64,7 @@ export interface MenuItemAria {
62
64
  /** Whether the item is disabled. */
63
65
  isDisabled: boolean;
64
66
  }
65
- export interface AriaMenuItemProps {
67
+ export interface AriaMenuItemProps extends DOMProps, PressEvents, HoverEvents, KeyboardEvents, FocusEvents {
66
68
  /**
67
69
  * Whether the menu item is disabled.
68
70
  * @deprecated - pass disabledKeys to useTreeState instead.
@@ -96,6 +98,10 @@ export interface AriaMenuItemProps {
96
98
  onAction?: (key: Key) => void;
97
99
  /** What kind of popup the item opens. */
98
100
  'aria-haspopup'?: 'menu' | 'dialog';
101
+ /** Indicates whether the menu item's popup element is expanded or collapsed. */
102
+ 'aria-expanded'?: boolean | 'true' | 'false';
103
+ /** Identifies the menu item's popup element whose contents or presence is controlled by the menu item. */
104
+ 'aria-controls'?: string;
99
105
  }
100
106
  /**
101
107
  * Provides the behavior and accessibility implementation for an item in a menu.
@@ -124,6 +130,41 @@ export interface MenuSectionAria {
124
130
  * @param props - Props for the section.
125
131
  */
126
132
  export function useMenuSection(props: AriaMenuSectionProps): MenuSectionAria;
133
+ export interface AriaSubmenuTriggerProps {
134
+ /** An object representing the submenu trigger menu item. Contains all the relevant information that makes up the menu item. */
135
+ node: Node<unknown>;
136
+ /** Whether the submenu trigger is disabled. */
137
+ isDisabled?: boolean;
138
+ /** The type of the contents that the submenu trigger opens. */
139
+ type?: 'dialog' | 'menu';
140
+ /** Ref of the menu that contains the submenu trigger. */
141
+ parentMenuRef: RefObject<HTMLElement>;
142
+ /** Ref of the submenu opened by the submenu trigger. */
143
+ submenuRef: RefObject<HTMLElement>;
144
+ }
145
+ interface SubmenuTriggerProps extends AriaMenuItemProps {
146
+ /** Whether the submenu trigger is in an expanded state. */
147
+ isOpen: boolean;
148
+ }
149
+ interface SubmenuProps<T> extends AriaMenuOptions<T> {
150
+ /** The level of the submenu. */
151
+ submenuLevel: number;
152
+ }
153
+ export interface SubmenuTriggerAria<T> {
154
+ /** Props for the submenu trigger menu item. */
155
+ submenuTriggerProps: SubmenuTriggerProps;
156
+ /** Props for the submenu controlled by the submenu trigger menu item. */
157
+ submenuProps: SubmenuProps<T>;
158
+ /** Props for the submenu's popover container. */
159
+ popoverProps: Pick<AriaPopoverProps, 'isNonModal' | 'shouldCloseOnInteractOutside'> & Pick<OverlayProps, 'disableFocusManagement'>;
160
+ }
161
+ /**
162
+ * Provides the behavior and accessibility implementation for a submenu trigger and its associated submenu.
163
+ * @param props - Props for the submenu trigger and refs attach to its submenu and parent menu.
164
+ * @param state - State for the submenu trigger.
165
+ * @param ref - Ref to the submenu trigger element.
166
+ */
167
+ export function UNSTABLE_useSubmenuTrigger<T>(props: AriaSubmenuTriggerProps, state: SubmenuTriggerState, ref: RefObject<FocusableElement>): SubmenuTriggerAria<T>;
127
168
  export type { AriaMenuProps } from '@react-types/menu';
128
169
 
129
170
  //# sourceMappingURL=types.d.ts.map
@@ -1 +1 @@
1
- {"mappings":";;;;;;AAmBA;IACE,kCAAkC;IAClC,SAAS,EAAE,aAAa,CAAA;CACzB;AAED,iCAAiC,CAAC,CAAE,SAAQ,IAAI,CAAC,cAAc,CAAC,CAAC,EAAE,UAAU,CAAC;IAC5E,+CAA+C;IAC/C,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;CACpC;AASD;;;;;GAKG;AACH,wBAAwB,CAAC,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,WAAW,CAAC,GAAG,QAAQ,CAwChH;AChED;IACE,oDAAoD;IACpD,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,OAAO,CAAC,EAAE,eAAe,CAAA;CAC1B;AAED,iCAAiC,CAAC;IAChC,0CAA0C;IAC1C,gBAAgB,EAAE,eAAe,CAAC;IAElC,0BAA0B;IAC1B,SAAS,EAAE,gBAAgB,CAAC,CAAC,CAAA;CAC9B;AAED;;;;GAIG;AACH,+BAA+B,CAAC,EAAE,KAAK,EAAE,oBAAoB,EAAE,KAAK,EAAE,gBAAgB,EAAE,GAAG,EAAE,UAAU,OAAO,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAgGnI;ACvHD;IACE,uCAAuC;IACvC,aAAa,EAAE,aAAa,CAAC;IAE7B,4DAA4D;IAC5D,UAAU,EAAE,aAAa,CAAC;IAE1B,2EAA2E;IAC3E,gBAAgB,EAAE,aAAa,CAAC;IAEhC,4EAA4E;IAC5E,qBAAqB,EAAE,aAAa,CAAC;IAErC,6CAA6C;IAC7C,SAAS,EAAE,OAAO,CAAC;IACnB,8CAA8C;IAC9C,UAAU,EAAE,OAAO,CAAC;IACpB,wDAAwD;IACxD,SAAS,EAAE,OAAO,CAAC;IACnB,oCAAoC;IACpC,UAAU,EAAE,OAAO,CAAA;CACpB;AAED;IACE;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,oDAAoD;IACpD,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,wCAAwC;IACxC,GAAG,CAAC,EAAE,GAAG,CAAC;IAEV;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,sEAAsE;IACtE,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAE9B,yCAAyC;IACzC,eAAe,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAA;CACpC;AAED;;;;;GAKG;AACH,4BAA4B,CAAC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,gBAAgB,CAAC,GAAG,YAAY,CAkN5H;AClSD;IACE,mCAAmC;IACnC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oFAAoF;IACpF,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED;IACE,uCAAuC;IACvC,SAAS,EAAE,aAAa,CAAC;IAEzB,6CAA6C;IAC7C,YAAY,EAAE,aAAa,CAAC;IAE5B,mCAAmC;IACnC,UAAU,EAAE,aAAa,CAAA;CAC1B;AAED;;;;GAIG;AACH,+BAA+B,KAAK,EAAE,oBAAoB,GAAG,eAAe,CAqB3E;AC3CD,YAAY,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC","sources":["packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenu.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuTrigger.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuItem.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuSection.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/index.ts","packages/@react-aria/menu/src/index.ts"],"sourcesContent":[null,null,null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport {useMenuTrigger} from './useMenuTrigger';\nexport {useMenu} from './useMenu';\nexport {useMenuItem} from './useMenuItem';\nexport {useMenuSection} from './useMenuSection';\n\nexport type {AriaMenuProps} from '@react-types/menu';\nexport type {AriaMenuTriggerProps, MenuTriggerAria} from './useMenuTrigger';\nexport type {AriaMenuOptions, MenuAria} from './useMenu';\nexport type {AriaMenuItemProps, MenuItemAria} from './useMenuItem';\nexport type {AriaMenuSectionProps, MenuSectionAria} from './useMenuSection';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
1
+ {"mappings":"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","sources":["packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenu.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuTrigger.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuItem.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuSection.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useSafelyMouseToSubmenu.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useSubmenuTrigger.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/index.ts","packages/@react-aria/menu/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport {useMenuTrigger} from './useMenuTrigger';\nexport {useMenu} from './useMenu';\nexport {useMenuItem} from './useMenuItem';\nexport {useMenuSection} from './useMenuSection';\nexport {UNSTABLE_useSubmenuTrigger} from './useSubmenuTrigger';\n\nexport type {AriaMenuProps} from '@react-types/menu';\nexport type {AriaMenuTriggerProps, MenuTriggerAria} from './useMenuTrigger';\nexport type {AriaMenuOptions, MenuAria} from './useMenu';\nexport type {AriaMenuItemProps, MenuItemAria} from './useMenuItem';\nexport type {AriaMenuSectionProps, MenuSectionAria} from './useMenuSection';\nexport type {AriaSubmenuTriggerProps, SubmenuTriggerAria} from './useSubmenuTrigger';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
@@ -0,0 +1,6 @@
1
+ module.exports = {
2
+ "longPressMessage": `\u{414}\u{43E}\u{432}\u{433}\u{43E} \u{430}\u{431}\u{43E} \u{437}\u{432}\u{438}\u{447}\u{430}\u{439}\u{43D}\u{43E} \u{43D}\u{430}\u{442}\u{438}\u{441}\u{43D}\u{456}\u{442}\u{44C} \u{43A}\u{43E}\u{43C}\u{431}\u{456}\u{43D}\u{430}\u{446}\u{456}\u{44E} \u{43A}\u{43B}\u{430}\u{432}\u{456}\u{448} Alt \u{456} \u{441}\u{442}\u{440}\u{456}\u{43B}\u{43A}\u{430} \u{432}\u{43D}\u{438}\u{437}, \u{449}\u{43E}\u{431} \u{432}\u{456}\u{434}\u{43A}\u{440}\u{438}\u{442}\u{438} \u{43C}\u{435}\u{43D}\u{44E}`
3
+ };
4
+
5
+
6
+ //# sourceMappingURL=uk-UA.main.js.map
@@ -0,0 +1 @@
1
+ {"mappings":"AAAA,iBAAiB;IAAG,oBAAoB,CAAC,4eAAoF,CAAC;AAC9H","sources":["packages/@react-aria/menu/intl/uk-UA.json"],"sourcesContent":["{\n \"longPressMessage\": \"Довго або звичайно натисніть комбінацію клавіш Alt і стрілка вниз, щоб відкрити меню\"\n}\n"],"names":[],"version":3,"file":"uk-UA.main.js.map"}
package/dist/uk-UA.mjs ADDED
@@ -0,0 +1,8 @@
1
+ var $ca4f6c8462244e62$exports = {};
2
+ $ca4f6c8462244e62$exports = {
3
+ "longPressMessage": `\u{414}\u{43E}\u{432}\u{433}\u{43E} \u{430}\u{431}\u{43E} \u{437}\u{432}\u{438}\u{447}\u{430}\u{439}\u{43D}\u{43E} \u{43D}\u{430}\u{442}\u{438}\u{441}\u{43D}\u{456}\u{442}\u{44C} \u{43A}\u{43E}\u{43C}\u{431}\u{456}\u{43D}\u{430}\u{446}\u{456}\u{44E} \u{43A}\u{43B}\u{430}\u{432}\u{456}\u{448} Alt \u{456} \u{441}\u{442}\u{440}\u{456}\u{43B}\u{43A}\u{430} \u{432}\u{43D}\u{438}\u{437}, \u{449}\u{43E}\u{431} \u{432}\u{456}\u{434}\u{43A}\u{440}\u{438}\u{442}\u{438} \u{43C}\u{435}\u{43D}\u{44E}`
4
+ };
5
+
6
+
7
+ export {$ca4f6c8462244e62$exports as default};
8
+ //# sourceMappingURL=uk-UA.module.js.map
@@ -0,0 +1,8 @@
1
+ var $ca4f6c8462244e62$exports = {};
2
+ $ca4f6c8462244e62$exports = {
3
+ "longPressMessage": `\u{414}\u{43E}\u{432}\u{433}\u{43E} \u{430}\u{431}\u{43E} \u{437}\u{432}\u{438}\u{447}\u{430}\u{439}\u{43D}\u{43E} \u{43D}\u{430}\u{442}\u{438}\u{441}\u{43D}\u{456}\u{442}\u{44C} \u{43A}\u{43E}\u{43C}\u{431}\u{456}\u{43D}\u{430}\u{446}\u{456}\u{44E} \u{43A}\u{43B}\u{430}\u{432}\u{456}\u{448} Alt \u{456} \u{441}\u{442}\u{440}\u{456}\u{43B}\u{43A}\u{430} \u{432}\u{43D}\u{438}\u{437}, \u{449}\u{43E}\u{431} \u{432}\u{456}\u{434}\u{43A}\u{440}\u{438}\u{442}\u{438} \u{43C}\u{435}\u{43D}\u{44E}`
4
+ };
5
+
6
+
7
+ export {$ca4f6c8462244e62$exports as default};
8
+ //# sourceMappingURL=uk-UA.module.js.map
@@ -0,0 +1 @@
1
+ {"mappings":";AAAA,4BAAiB;IAAG,oBAAoB,CAAC,4eAAoF,CAAC;AAC9H","sources":["packages/@react-aria/menu/intl/uk-UA.json"],"sourcesContent":["{\n \"longPressMessage\": \"Довго або звичайно натисніть комбінацію клавіш Alt і стрілка вниз, щоб відкрити меню\"\n}\n"],"names":[],"version":3,"file":"uk-UA.module.js.map"}
@@ -0,0 +1,6 @@
1
+ module.exports = {
2
+ "longPressMessage": `\u{957F}\u{6309}\u{6216}\u{6309} Alt + \u{5411}\u{4E0B}\u{65B9}\u{5411}\u{952E}\u{4EE5}\u{6253}\u{5F00}\u{83DC}\u{5355}`
3
+ };
4
+
5
+
6
+ //# sourceMappingURL=zh-CN.main.js.map
@@ -0,0 +1 @@
1
+ {"mappings":"AAAA,iBAAiB;IAAG,oBAAoB,CAAC,uHAAqB,CAAC;AAC/D","sources":["packages/@react-aria/menu/intl/zh-CN.json"],"sourcesContent":["{\n \"longPressMessage\": \"长按或按 Alt + 向下方向键以打开菜单\"\n}\n"],"names":[],"version":3,"file":"zh-CN.main.js.map"}
package/dist/zh-CN.mjs ADDED
@@ -0,0 +1,8 @@
1
+ var $2d9960c02ccac927$exports = {};
2
+ $2d9960c02ccac927$exports = {
3
+ "longPressMessage": `\u{957F}\u{6309}\u{6216}\u{6309} Alt + \u{5411}\u{4E0B}\u{65B9}\u{5411}\u{952E}\u{4EE5}\u{6253}\u{5F00}\u{83DC}\u{5355}`
4
+ };
5
+
6
+
7
+ export {$2d9960c02ccac927$exports as default};
8
+ //# sourceMappingURL=zh-CN.module.js.map
@@ -0,0 +1,8 @@
1
+ var $2d9960c02ccac927$exports = {};
2
+ $2d9960c02ccac927$exports = {
3
+ "longPressMessage": `\u{957F}\u{6309}\u{6216}\u{6309} Alt + \u{5411}\u{4E0B}\u{65B9}\u{5411}\u{952E}\u{4EE5}\u{6253}\u{5F00}\u{83DC}\u{5355}`
4
+ };
5
+
6
+
7
+ export {$2d9960c02ccac927$exports as default};
8
+ //# sourceMappingURL=zh-CN.module.js.map
@@ -0,0 +1 @@
1
+ {"mappings":";AAAA,4BAAiB;IAAG,oBAAoB,CAAC,uHAAqB,CAAC;AAC/D","sources":["packages/@react-aria/menu/intl/zh-CN.json"],"sourcesContent":["{\n \"longPressMessage\": \"长按或按 Alt + 向下方向键以打开菜单\"\n}\n"],"names":[],"version":3,"file":"zh-CN.module.js.map"}
@@ -0,0 +1,6 @@
1
+ module.exports = {
2
+ "longPressMessage": `\u{9577}\u{6309}\u{6216}\u{6309} Alt+\u{5411}\u{4E0B}\u{9375}\u{4EE5}\u{958B}\u{555F}\u{529F}\u{80FD}\u{8868}`
3
+ };
4
+
5
+
6
+ //# sourceMappingURL=zh-TW.main.js.map
@@ -0,0 +1 @@
1
+ {"mappings":"AAAA,iBAAiB;IAAG,oBAAoB,CAAC,6GAAkB,CAAC;AAC5D","sources":["packages/@react-aria/menu/intl/zh-TW.json"],"sourcesContent":["{\n \"longPressMessage\": \"長按或按 Alt+向下鍵以開啟功能表\"\n}\n"],"names":[],"version":3,"file":"zh-TW.main.js.map"}
package/dist/zh-TW.mjs ADDED
@@ -0,0 +1,8 @@
1
+ var $f1b682a4c8c5631c$exports = {};
2
+ $f1b682a4c8c5631c$exports = {
3
+ "longPressMessage": `\u{9577}\u{6309}\u{6216}\u{6309} Alt+\u{5411}\u{4E0B}\u{9375}\u{4EE5}\u{958B}\u{555F}\u{529F}\u{80FD}\u{8868}`
4
+ };
5
+
6
+
7
+ export {$f1b682a4c8c5631c$exports as default};
8
+ //# sourceMappingURL=zh-TW.module.js.map
@@ -0,0 +1,8 @@
1
+ var $f1b682a4c8c5631c$exports = {};
2
+ $f1b682a4c8c5631c$exports = {
3
+ "longPressMessage": `\u{9577}\u{6309}\u{6216}\u{6309} Alt+\u{5411}\u{4E0B}\u{9375}\u{4EE5}\u{958B}\u{555F}\u{529F}\u{80FD}\u{8868}`
4
+ };
5
+
6
+
7
+ export {$f1b682a4c8c5631c$exports as default};
8
+ //# sourceMappingURL=zh-TW.module.js.map
@@ -0,0 +1 @@
1
+ {"mappings":";AAAA,4BAAiB;IAAG,oBAAoB,CAAC,6GAAkB,CAAC;AAC5D","sources":["packages/@react-aria/menu/intl/zh-TW.json"],"sourcesContent":["{\n \"longPressMessage\": \"長按或按 Alt+向下鍵以開啟功能表\"\n}\n"],"names":[],"version":3,"file":"zh-TW.module.js.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-aria/menu",
3
- "version": "3.11.3-nightly.4321+5e487532e",
3
+ "version": "3.12.0",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
@@ -22,18 +22,18 @@
22
22
  "url": "https://github.com/adobe/react-spectrum"
23
23
  },
24
24
  "dependencies": {
25
- "@react-aria/focus": "3.0.0-nightly.2610+5e487532e",
26
- "@react-aria/i18n": "3.0.0-nightly.2610+5e487532e",
27
- "@react-aria/interactions": "3.0.0-nightly.2610+5e487532e",
28
- "@react-aria/overlays": "3.0.0-nightly.2610+5e487532e",
29
- "@react-aria/selection": "3.0.0-nightly.2610+5e487532e",
30
- "@react-aria/utils": "3.0.0-nightly.2610+5e487532e",
31
- "@react-stately/collections": "3.0.0-nightly.2610+5e487532e",
32
- "@react-stately/menu": "3.5.8-nightly.4321+5e487532e",
33
- "@react-stately/tree": "3.0.0-nightly.2610+5e487532e",
34
- "@react-types/button": "3.9.2-nightly.4321+5e487532e",
35
- "@react-types/menu": "3.9.7-nightly.4321+5e487532e",
36
- "@react-types/shared": "3.0.0-nightly.2610+5e487532e",
25
+ "@react-aria/focus": "^3.16.0",
26
+ "@react-aria/i18n": "^3.10.0",
27
+ "@react-aria/interactions": "^3.20.1",
28
+ "@react-aria/overlays": "^3.20.0",
29
+ "@react-aria/selection": "^3.17.3",
30
+ "@react-aria/utils": "^3.23.0",
31
+ "@react-stately/collections": "^3.10.4",
32
+ "@react-stately/menu": "^3.6.0",
33
+ "@react-stately/tree": "^3.7.5",
34
+ "@react-types/button": "^3.9.1",
35
+ "@react-types/menu": "^3.9.6",
36
+ "@react-types/shared": "^3.22.0",
37
37
  "@swc/helpers": "^0.5.0"
38
38
  },
39
39
  "peerDependencies": {
@@ -43,5 +43,5 @@
43
43
  "publishConfig": {
44
44
  "access": "public"
45
45
  },
46
- "gitHead": "5e487532e3ca4714513fb6ab64f7a78d9d1ca281"
46
+ "gitHead": "86b38c87868ce7f262e0df905e5ac4eb2653791d"
47
47
  }
package/src/index.ts CHANGED
@@ -14,9 +14,11 @@ export {useMenuTrigger} from './useMenuTrigger';
14
14
  export {useMenu} from './useMenu';
15
15
  export {useMenuItem} from './useMenuItem';
16
16
  export {useMenuSection} from './useMenuSection';
17
+ export {UNSTABLE_useSubmenuTrigger} from './useSubmenuTrigger';
17
18
 
18
19
  export type {AriaMenuProps} from '@react-types/menu';
19
20
  export type {AriaMenuTriggerProps, MenuTriggerAria} from './useMenuTrigger';
20
21
  export type {AriaMenuOptions, MenuAria} from './useMenu';
21
22
  export type {AriaMenuItemProps, MenuItemAria} from './useMenuItem';
22
23
  export type {AriaMenuSectionProps, MenuSectionAria} from './useMenuSection';
24
+ export type {AriaSubmenuTriggerProps, SubmenuTriggerAria} from './useSubmenuTrigger';
package/src/useMenu.ts CHANGED
@@ -11,7 +11,7 @@
11
11
  */
12
12
 
13
13
  import {AriaMenuProps} from '@react-types/menu';
14
- import {DOMAttributes, Key, KeyboardDelegate} from '@react-types/shared';
14
+ import {DOMAttributes, Key, KeyboardDelegate, KeyboardEvents} from '@react-types/shared';
15
15
  import {filterDOMProps, mergeProps} from '@react-aria/utils';
16
16
  import {RefObject} from 'react';
17
17
  import {TreeState} from '@react-stately/tree';
@@ -22,7 +22,7 @@ export interface MenuAria {
22
22
  menuProps: DOMAttributes
23
23
  }
24
24
 
25
- export interface AriaMenuOptions<T> extends Omit<AriaMenuProps<T>, 'children'> {
25
+ export interface AriaMenuOptions<T> extends Omit<AriaMenuProps<T>, 'children'>, KeyboardEvents {
26
26
  /** Whether the menu uses virtual scrolling. */
27
27
  isVirtualized?: boolean,
28
28
 
@@ -49,6 +49,8 @@ export const menuData = new WeakMap<TreeState<unknown>, MenuData>();
49
49
  export function useMenu<T>(props: AriaMenuOptions<T>, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuAria {
50
50
  let {
51
51
  shouldFocusWrap = true,
52
+ onKeyDown,
53
+ onKeyUp,
52
54
  ...otherProps
53
55
  } = props;
54
56
 
@@ -73,10 +75,8 @@ export function useMenu<T>(props: AriaMenuOptions<T>, state: TreeState<T>, ref:
73
75
  });
74
76
 
75
77
  return {
76
- menuProps: mergeProps(domProps, {
78
+ menuProps: mergeProps(domProps, {onKeyDown, onKeyUp}, {
77
79
  role: 'menu',
78
- // this forces AT to move their cursors into any open sub dialogs, the sub dialogs contain hidden close buttons in order to come back to this level of the menu
79
- 'aria-hidden': state.expandedKeys.size > 0 ? true : undefined,
80
80
  ...listProps,
81
81
  onKeyDown: (e) => {
82
82
  // don't clear the menu selected keys if the user is presses escape since escape closes the menu
@@ -10,15 +10,13 @@
10
10
  * governing permissions and limitations under the License.
11
11
  */
12
12
 
13
- import {DOMAttributes, FocusableElement, Key, PressEvent} from '@react-types/shared';
14
- import {filterDOMProps, mergeProps, useEffectEvent, useLayoutEffect, useRouter, useSlotId} from '@react-aria/utils';
15
- import {focusSafely} from '@react-aria/focus';
13
+ import {DOMAttributes, DOMProps, FocusableElement, FocusEvents, HoverEvents, Key, KeyboardEvents, PressEvent, PressEvents} from '@react-types/shared';
14
+ import {filterDOMProps, mergeProps, useRouter, useSlotId} from '@react-aria/utils';
16
15
  import {getItemCount} from '@react-stately/collections';
17
- import {isFocusVisible, useHover, useKeyboard, usePress} from '@react-aria/interactions';
16
+ import {isFocusVisible, useFocus, useHover, useKeyboard, usePress} from '@react-aria/interactions';
18
17
  import {menuData} from './useMenu';
19
- import {RefObject, useCallback, useRef} from 'react';
18
+ import {RefObject} from 'react';
20
19
  import {TreeState} from '@react-stately/tree';
21
- import {useLocale} from '@react-aria/i18n';
22
20
  import {useSelectableItem} from '@react-aria/selection';
23
21
 
24
22
  export interface MenuItemAria {
@@ -44,7 +42,7 @@ export interface MenuItemAria {
44
42
  isDisabled: boolean
45
43
  }
46
44
 
47
- export interface AriaMenuItemProps {
45
+ export interface AriaMenuItemProps extends DOMProps, PressEvents, HoverEvents, KeyboardEvents, FocusEvents {
48
46
  /**
49
47
  * Whether the menu item is disabled.
50
48
  * @deprecated - pass disabledKeys to useTreeState instead.
@@ -85,7 +83,13 @@ export interface AriaMenuItemProps {
85
83
  onAction?: (key: Key) => void,
86
84
 
87
85
  /** What kind of popup the item opens. */
88
- 'aria-haspopup'?: 'menu' | 'dialog'
86
+ 'aria-haspopup'?: 'menu' | 'dialog',
87
+
88
+ /** Indicates whether the menu item's popup element is expanded or collapsed. */
89
+ 'aria-expanded'?: boolean | 'true' | 'false',
90
+
91
+ /** Identifies the menu item's popup element whose contents or presence is controlled by the menu item. */
92
+ 'aria-controls'?: string
89
93
  }
90
94
 
91
95
  /**
@@ -99,41 +103,28 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
99
103
  key,
100
104
  closeOnSelect,
101
105
  isVirtualized,
102
- 'aria-haspopup': hasPopup
106
+ 'aria-haspopup': hasPopup,
107
+ onPressStart: pressStartProp,
108
+ onPressUp: pressUpProp,
109
+ onPress,
110
+ onPressChange,
111
+ onPressEnd,
112
+ onHoverStart: hoverStartProp,
113
+ onHoverChange,
114
+ onHoverEnd,
115
+ onKeyDown,
116
+ onKeyUp,
117
+ onFocus,
118
+ onFocusChange,
119
+ onBlur
103
120
  } = props;
104
- let {direction} = useLocale();
105
121
 
106
122
  let isTrigger = !!hasPopup;
107
- let isOpen = state.expandedKeys.has(key);
108
-
109
123
  let isDisabled = props.isDisabled ?? state.disabledKeys.has(key);
110
124
  let isSelected = props.isSelected ?? state.selectionManager.isSelected(key);
111
-
112
- let openTimeout = useRef<ReturnType<typeof setTimeout> | undefined>();
113
- let cancelOpenTimeout = useCallback(() => {
114
- if (openTimeout.current) {
115
- clearTimeout(openTimeout.current);
116
- openTimeout.current = undefined;
117
- }
118
- }, [openTimeout]);
119
-
120
- let onSubmenuOpen = useEffectEvent(() => {
121
- cancelOpenTimeout();
122
- state.setExpandedKeys(new Set([key]));
123
- });
124
-
125
- useLayoutEffect(() => {
126
- return () => cancelOpenTimeout();
127
- }, [cancelOpenTimeout]);
128
-
129
125
  let data = menuData.get(state);
130
126
  let onClose = props.onClose || data.onClose;
131
- let onActionMenuDialogTrigger = useCallback(() => {
132
- onSubmenuOpen();
133
- // will need to disable this lint rule when using useEffectEvent https://react.dev/learn/separating-events-from-effects#logic-inside-effects-is-reactive
134
- // eslint-disable-next-line react-hooks/exhaustive-deps
135
- }, []);
136
- let onAction = isTrigger ? onActionMenuDialogTrigger : props.onAction || data.onAction;
127
+ let onAction = isTrigger ? () => {} : props.onAction || data.onAction;
137
128
  let router = useRouter();
138
129
  let performAction = (e: PressEvent) => {
139
130
  if (onAction) {
@@ -146,10 +137,12 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
146
137
  };
147
138
 
148
139
  let role = 'menuitem';
149
- if (state.selectionManager.selectionMode === 'single') {
150
- role = 'menuitemradio';
151
- } else if (state.selectionManager.selectionMode === 'multiple') {
152
- role = 'menuitemcheckbox';
140
+ if (!isTrigger) {
141
+ if (state.selectionManager.selectionMode === 'single') {
142
+ role = 'menuitemradio';
143
+ } else if (state.selectionManager.selectionMode === 'multiple') {
144
+ role = 'menuitemcheckbox';
145
+ }
153
146
  }
154
147
 
155
148
  let labelId = useSlotId();
@@ -161,10 +154,13 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
161
154
  role,
162
155
  'aria-label': props['aria-label'],
163
156
  'aria-labelledby': labelId,
164
- 'aria-describedby': [descriptionId, keyboardId].filter(Boolean).join(' ') || undefined
157
+ 'aria-describedby': [descriptionId, keyboardId].filter(Boolean).join(' ') || undefined,
158
+ 'aria-controls': props['aria-controls'],
159
+ 'aria-haspopup': hasPopup,
160
+ 'aria-expanded': props['aria-expanded']
165
161
  };
166
162
 
167
- if (state.selectionManager.selectionMode !== 'none') {
163
+ if (state.selectionManager.selectionMode !== 'none' && !isTrigger) {
168
164
  ariaProps['aria-checked'] = isSelected;
169
165
  }
170
166
 
@@ -174,15 +170,12 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
174
170
  ariaProps['aria-setsize'] = getItemCount(state.collection);
175
171
  }
176
172
 
177
- if (hasPopup != null) {
178
- ariaProps['aria-haspopup'] = hasPopup;
179
- ariaProps['aria-expanded'] = isOpen ? 'true' : 'false';
180
- }
181
-
182
173
  let onPressStart = (e: PressEvent) => {
183
174
  if (e.pointerType === 'keyboard') {
184
175
  performAction(e);
185
176
  }
177
+
178
+ pressStartProp?.(e);
186
179
  };
187
180
 
188
181
  let onPressUp = (e: PressEvent) => {
@@ -195,6 +188,8 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
195
188
  onClose();
196
189
  }
197
190
  }
191
+
192
+ pressUpProp?.(e);
198
193
  };
199
194
 
200
195
  let {itemProps, isFocused} = useSelectableItem({
@@ -212,33 +207,23 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
212
207
 
213
208
  let {pressProps, isPressed} = usePress({
214
209
  onPressStart,
210
+ onPress,
215
211
  onPressUp,
216
- isDisabled: isDisabled || (isTrigger && state.expandedKeys.has(key))
212
+ onPressChange,
213
+ onPressEnd,
214
+ isDisabled
217
215
  });
218
216
  let {hoverProps} = useHover({
219
217
  isDisabled,
220
- onHoverStart() {
221
- if (!isFocusVisible() && !(isTrigger && state.expandedKeys.has(key))) {
218
+ onHoverStart(e) {
219
+ if (!isFocusVisible()) {
222
220
  state.selectionManager.setFocused(true);
223
221
  state.selectionManager.setFocusedKey(key);
224
- // focus immediately so that a focus scope opened on hover has the correct restore node
225
- let isFocused = key === state.selectionManager.focusedKey;
226
- if (isFocused && state.selectionManager.isFocused && document.activeElement !== ref.current) {
227
- focusSafely(ref.current);
228
- }
229
222
  }
223
+ hoverStartProp?.(e);
230
224
  },
231
- onHoverChange: isHovered => {
232
- if (isHovered && isTrigger && !state.expandedKeys.has(key)) {
233
- if (!openTimeout.current) {
234
- openTimeout.current = setTimeout(() => {
235
- onSubmenuOpen();
236
- }, 200);
237
- }
238
- } else if (!isHovered) {
239
- cancelOpenTimeout();
240
- }
241
- }
225
+ onHoverChange,
226
+ onHoverEnd
242
227
  });
243
228
 
244
229
  let {keyboardProps} = useKeyboard({
@@ -262,33 +247,27 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
262
247
  onClose();
263
248
  }
264
249
  break;
265
- case 'ArrowRight':
266
- if (isTrigger && direction === 'ltr') {
267
- onSubmenuOpen();
268
- } else {
269
- e.continuePropagation();
270
- }
271
- break;
272
- case 'ArrowLeft':
273
- if (isTrigger && direction === 'rtl') {
274
- onSubmenuOpen();
275
- } else {
250
+ default:
251
+ if (!isTrigger) {
276
252
  e.continuePropagation();
277
253
  }
278
- break;
279
- default:
280
- e.continuePropagation();
254
+
255
+ onKeyDown?.(e);
281
256
  break;
282
257
  }
283
- }
258
+ },
259
+ onKeyUp
284
260
  });
285
261
 
262
+ let {focusProps} = useFocus({onBlur, onFocus, onFocusChange});
286
263
  let domProps = filterDOMProps(item.props, {isLink: !!item?.props?.href});
287
264
  delete domProps.id;
265
+
288
266
  return {
289
267
  menuItemProps: {
290
268
  ...ariaProps,
291
- ...mergeProps(domProps, itemProps, pressProps, hoverProps, keyboardProps)
269
+ ...mergeProps(domProps, isTrigger ? {onFocus: itemProps.onFocus} : itemProps, pressProps, hoverProps, keyboardProps, focusProps),
270
+ tabIndex: itemProps.tabIndex != null ? -1 : undefined
292
271
  },
293
272
  labelProps: {
294
273
  id: labelId
@@ -43,6 +43,7 @@ export interface MenuTriggerAria<T> {
43
43
  * Provides the behavior and accessibility implementation for a menu trigger.
44
44
  * @param props - Props for the menu trigger.
45
45
  * @param state - State for the menu trigger.
46
+ * @param ref - Ref to the HTML element trigger for the menu.
46
47
  */
47
48
  export function useMenuTrigger<T>(props: AriaMenuTriggerProps, state: MenuTriggerState, ref: RefObject<Element>): MenuTriggerAria<T> {
48
49
  let {
@@ -95,7 +96,7 @@ export function useMenuTrigger<T>(props: AriaMenuTriggerProps, state: MenuTrigge
95
96
  }
96
97
  };
97
98
 
98
- let stringFormatter = useLocalizedStringFormatter(intlMessages);
99
+ let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/menu');
99
100
  let {longPressProps} = useLongPress({
100
101
  isDisabled: isDisabled || trigger !== 'longPress',
101
102
  accessibilityDescription: stringFormatter.format('longPressMessage'),