@react-spectrum/menu 3.22.11 → 3.23.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 (249) hide show
  1. package/dist/import.mjs +6 -8
  2. package/dist/main.js +12 -14
  3. package/dist/main.js.map +1 -1
  4. package/dist/module.js +6 -8
  5. package/dist/module.js.map +1 -1
  6. package/dist/types/src/index.d.ts +8 -0
  7. package/package.json +14 -46
  8. package/src/index.ts +9 -9
  9. package/dist/ActionMenu.main.js +0 -67
  10. package/dist/ActionMenu.main.js.map +0 -1
  11. package/dist/ActionMenu.mjs +0 -62
  12. package/dist/ActionMenu.module.js +0 -62
  13. package/dist/ActionMenu.module.js.map +0 -1
  14. package/dist/ContextualHelpTrigger.main.js +0 -192
  15. package/dist/ContextualHelpTrigger.main.js.map +0 -1
  16. package/dist/ContextualHelpTrigger.mjs +0 -187
  17. package/dist/ContextualHelpTrigger.module.js +0 -187
  18. package/dist/ContextualHelpTrigger.module.js.map +0 -1
  19. package/dist/Menu.main.js +0 -235
  20. package/dist/Menu.main.js.map +0 -1
  21. package/dist/Menu.mjs +0 -229
  22. package/dist/Menu.module.js +0 -229
  23. package/dist/Menu.module.js.map +0 -1
  24. package/dist/MenuItem.main.js +0 -149
  25. package/dist/MenuItem.main.js.map +0 -1
  26. package/dist/MenuItem.mjs +0 -144
  27. package/dist/MenuItem.module.js +0 -144
  28. package/dist/MenuItem.module.js.map +0 -1
  29. package/dist/MenuSection.main.js +0 -81
  30. package/dist/MenuSection.main.js.map +0 -1
  31. package/dist/MenuSection.mjs +0 -76
  32. package/dist/MenuSection.module.js +0 -76
  33. package/dist/MenuSection.module.js.map +0 -1
  34. package/dist/MenuTrigger.main.js +0 -128
  35. package/dist/MenuTrigger.main.js.map +0 -1
  36. package/dist/MenuTrigger.mjs +0 -123
  37. package/dist/MenuTrigger.module.js +0 -123
  38. package/dist/MenuTrigger.module.js.map +0 -1
  39. package/dist/SubmenuTrigger.main.js +0 -154
  40. package/dist/SubmenuTrigger.main.js.map +0 -1
  41. package/dist/SubmenuTrigger.mjs +0 -149
  42. package/dist/SubmenuTrigger.module.js +0 -149
  43. package/dist/SubmenuTrigger.module.js.map +0 -1
  44. package/dist/ar-AE.main.js +0 -8
  45. package/dist/ar-AE.main.js.map +0 -1
  46. package/dist/ar-AE.mjs +0 -10
  47. package/dist/ar-AE.module.js +0 -10
  48. package/dist/ar-AE.module.js.map +0 -1
  49. package/dist/bg-BG.main.js +0 -8
  50. package/dist/bg-BG.main.js.map +0 -1
  51. package/dist/bg-BG.mjs +0 -10
  52. package/dist/bg-BG.module.js +0 -10
  53. package/dist/bg-BG.module.js.map +0 -1
  54. package/dist/context.main.js +0 -43
  55. package/dist/context.main.js.map +0 -1
  56. package/dist/context.mjs +0 -29
  57. package/dist/context.module.js +0 -29
  58. package/dist/context.module.js.map +0 -1
  59. package/dist/contextualhelp_vars_css.main.js +0 -23
  60. package/dist/contextualhelp_vars_css.main.js.map +0 -1
  61. package/dist/contextualhelp_vars_css.mjs +0 -25
  62. package/dist/contextualhelp_vars_css.module.js +0 -25
  63. package/dist/contextualhelp_vars_css.module.js.map +0 -1
  64. package/dist/cs-CZ.main.js +0 -8
  65. package/dist/cs-CZ.main.js.map +0 -1
  66. package/dist/cs-CZ.mjs +0 -10
  67. package/dist/cs-CZ.module.js +0 -10
  68. package/dist/cs-CZ.module.js.map +0 -1
  69. package/dist/da-DK.main.js +0 -8
  70. package/dist/da-DK.main.js.map +0 -1
  71. package/dist/da-DK.mjs +0 -10
  72. package/dist/da-DK.module.js +0 -10
  73. package/dist/da-DK.module.js.map +0 -1
  74. package/dist/de-DE.main.js +0 -8
  75. package/dist/de-DE.main.js.map +0 -1
  76. package/dist/de-DE.mjs +0 -10
  77. package/dist/de-DE.module.js +0 -10
  78. package/dist/de-DE.module.js.map +0 -1
  79. package/dist/el-GR.main.js +0 -8
  80. package/dist/el-GR.main.js.map +0 -1
  81. package/dist/el-GR.mjs +0 -10
  82. package/dist/el-GR.module.js +0 -10
  83. package/dist/el-GR.module.js.map +0 -1
  84. package/dist/en-US.main.js +0 -8
  85. package/dist/en-US.main.js.map +0 -1
  86. package/dist/en-US.mjs +0 -10
  87. package/dist/en-US.module.js +0 -10
  88. package/dist/en-US.module.js.map +0 -1
  89. package/dist/es-ES.main.js +0 -8
  90. package/dist/es-ES.main.js.map +0 -1
  91. package/dist/es-ES.mjs +0 -10
  92. package/dist/es-ES.module.js +0 -10
  93. package/dist/es-ES.module.js.map +0 -1
  94. package/dist/et-EE.main.js +0 -8
  95. package/dist/et-EE.main.js.map +0 -1
  96. package/dist/et-EE.mjs +0 -10
  97. package/dist/et-EE.module.js +0 -10
  98. package/dist/et-EE.module.js.map +0 -1
  99. package/dist/fi-FI.main.js +0 -8
  100. package/dist/fi-FI.main.js.map +0 -1
  101. package/dist/fi-FI.mjs +0 -10
  102. package/dist/fi-FI.module.js +0 -10
  103. package/dist/fi-FI.module.js.map +0 -1
  104. package/dist/fr-FR.main.js +0 -8
  105. package/dist/fr-FR.main.js.map +0 -1
  106. package/dist/fr-FR.mjs +0 -10
  107. package/dist/fr-FR.module.js +0 -10
  108. package/dist/fr-FR.module.js.map +0 -1
  109. package/dist/he-IL.main.js +0 -8
  110. package/dist/he-IL.main.js.map +0 -1
  111. package/dist/he-IL.mjs +0 -10
  112. package/dist/he-IL.module.js +0 -10
  113. package/dist/he-IL.module.js.map +0 -1
  114. package/dist/hr-HR.main.js +0 -8
  115. package/dist/hr-HR.main.js.map +0 -1
  116. package/dist/hr-HR.mjs +0 -10
  117. package/dist/hr-HR.module.js +0 -10
  118. package/dist/hr-HR.module.js.map +0 -1
  119. package/dist/hu-HU.main.js +0 -8
  120. package/dist/hu-HU.main.js.map +0 -1
  121. package/dist/hu-HU.mjs +0 -10
  122. package/dist/hu-HU.module.js +0 -10
  123. package/dist/hu-HU.module.js.map +0 -1
  124. package/dist/intlStrings.main.js +0 -108
  125. package/dist/intlStrings.main.js.map +0 -1
  126. package/dist/intlStrings.mjs +0 -110
  127. package/dist/intlStrings.module.js +0 -110
  128. package/dist/intlStrings.module.js.map +0 -1
  129. package/dist/it-IT.main.js +0 -8
  130. package/dist/it-IT.main.js.map +0 -1
  131. package/dist/it-IT.mjs +0 -10
  132. package/dist/it-IT.module.js +0 -10
  133. package/dist/it-IT.module.js.map +0 -1
  134. package/dist/ja-JP.main.js +0 -8
  135. package/dist/ja-JP.main.js.map +0 -1
  136. package/dist/ja-JP.mjs +0 -10
  137. package/dist/ja-JP.module.js +0 -10
  138. package/dist/ja-JP.module.js.map +0 -1
  139. package/dist/ko-KR.main.js +0 -8
  140. package/dist/ko-KR.main.js.map +0 -1
  141. package/dist/ko-KR.mjs +0 -10
  142. package/dist/ko-KR.module.js +0 -10
  143. package/dist/ko-KR.module.js.map +0 -1
  144. package/dist/lt-LT.main.js +0 -8
  145. package/dist/lt-LT.main.js.map +0 -1
  146. package/dist/lt-LT.mjs +0 -10
  147. package/dist/lt-LT.module.js +0 -10
  148. package/dist/lt-LT.module.js.map +0 -1
  149. package/dist/lv-LV.main.js +0 -8
  150. package/dist/lv-LV.main.js.map +0 -1
  151. package/dist/lv-LV.mjs +0 -10
  152. package/dist/lv-LV.module.js +0 -10
  153. package/dist/lv-LV.module.js.map +0 -1
  154. package/dist/menu.2ec1fdaf.css +0 -570
  155. package/dist/menu.2ec1fdaf.css.map +0 -1
  156. package/dist/menu.5b49954a.css +0 -30
  157. package/dist/menu.5b49954a.css.map +0 -1
  158. package/dist/menu_vars_css.main.js +0 -177
  159. package/dist/menu_vars_css.main.js.map +0 -1
  160. package/dist/menu_vars_css.mjs +0 -179
  161. package/dist/menu_vars_css.module.js +0 -179
  162. package/dist/menu_vars_css.module.js.map +0 -1
  163. package/dist/nb-NO.main.js +0 -8
  164. package/dist/nb-NO.main.js.map +0 -1
  165. package/dist/nb-NO.mjs +0 -10
  166. package/dist/nb-NO.module.js +0 -10
  167. package/dist/nb-NO.module.js.map +0 -1
  168. package/dist/nl-NL.main.js +0 -8
  169. package/dist/nl-NL.main.js.map +0 -1
  170. package/dist/nl-NL.mjs +0 -10
  171. package/dist/nl-NL.module.js +0 -10
  172. package/dist/nl-NL.module.js.map +0 -1
  173. package/dist/pl-PL.main.js +0 -8
  174. package/dist/pl-PL.main.js.map +0 -1
  175. package/dist/pl-PL.mjs +0 -10
  176. package/dist/pl-PL.module.js +0 -10
  177. package/dist/pl-PL.module.js.map +0 -1
  178. package/dist/pt-BR.main.js +0 -8
  179. package/dist/pt-BR.main.js.map +0 -1
  180. package/dist/pt-BR.mjs +0 -10
  181. package/dist/pt-BR.module.js +0 -10
  182. package/dist/pt-BR.module.js.map +0 -1
  183. package/dist/pt-PT.main.js +0 -8
  184. package/dist/pt-PT.main.js.map +0 -1
  185. package/dist/pt-PT.mjs +0 -10
  186. package/dist/pt-PT.module.js +0 -10
  187. package/dist/pt-PT.module.js.map +0 -1
  188. package/dist/ro-RO.main.js +0 -8
  189. package/dist/ro-RO.main.js.map +0 -1
  190. package/dist/ro-RO.mjs +0 -10
  191. package/dist/ro-RO.module.js +0 -10
  192. package/dist/ro-RO.module.js.map +0 -1
  193. package/dist/ru-RU.main.js +0 -8
  194. package/dist/ru-RU.main.js.map +0 -1
  195. package/dist/ru-RU.mjs +0 -10
  196. package/dist/ru-RU.module.js +0 -10
  197. package/dist/ru-RU.module.js.map +0 -1
  198. package/dist/sk-SK.main.js +0 -8
  199. package/dist/sk-SK.main.js.map +0 -1
  200. package/dist/sk-SK.mjs +0 -10
  201. package/dist/sk-SK.module.js +0 -10
  202. package/dist/sk-SK.module.js.map +0 -1
  203. package/dist/sl-SI.main.js +0 -8
  204. package/dist/sl-SI.main.js.map +0 -1
  205. package/dist/sl-SI.mjs +0 -10
  206. package/dist/sl-SI.module.js +0 -10
  207. package/dist/sl-SI.module.js.map +0 -1
  208. package/dist/sr-SP.main.js +0 -8
  209. package/dist/sr-SP.main.js.map +0 -1
  210. package/dist/sr-SP.mjs +0 -10
  211. package/dist/sr-SP.module.js +0 -10
  212. package/dist/sr-SP.module.js.map +0 -1
  213. package/dist/sv-SE.main.js +0 -8
  214. package/dist/sv-SE.main.js.map +0 -1
  215. package/dist/sv-SE.mjs +0 -10
  216. package/dist/sv-SE.module.js +0 -10
  217. package/dist/sv-SE.module.js.map +0 -1
  218. package/dist/tr-TR.main.js +0 -8
  219. package/dist/tr-TR.main.js.map +0 -1
  220. package/dist/tr-TR.mjs +0 -10
  221. package/dist/tr-TR.module.js +0 -10
  222. package/dist/tr-TR.module.js.map +0 -1
  223. package/dist/types.d.ts +0 -43
  224. package/dist/types.d.ts.map +0 -1
  225. package/dist/uk-UA.main.js +0 -8
  226. package/dist/uk-UA.main.js.map +0 -1
  227. package/dist/uk-UA.mjs +0 -10
  228. package/dist/uk-UA.module.js +0 -10
  229. package/dist/uk-UA.module.js.map +0 -1
  230. package/dist/zh-CN.main.js +0 -8
  231. package/dist/zh-CN.main.js.map +0 -1
  232. package/dist/zh-CN.mjs +0 -10
  233. package/dist/zh-CN.module.js +0 -10
  234. package/dist/zh-CN.module.js.map +0 -1
  235. package/dist/zh-TW.main.js +0 -8
  236. package/dist/zh-TW.main.js.map +0 -1
  237. package/dist/zh-TW.mjs +0 -10
  238. package/dist/zh-TW.module.js +0 -10
  239. package/dist/zh-TW.module.js.map +0 -1
  240. package/src/ActionMenu.tsx +0 -58
  241. package/src/ContextualHelpTrigger.tsx +0 -194
  242. package/src/Menu.tsx +0 -228
  243. package/src/MenuItem.tsx +0 -159
  244. package/src/MenuSection.tsx +0 -100
  245. package/src/MenuTrigger.tsx +0 -125
  246. package/src/SubmenuTrigger.tsx +0 -154
  247. package/src/context.ts +0 -63
  248. package/src/overlays.css +0 -32
  249. package/src/useCloseOnScroll.ts +0 -65
@@ -1,229 +0,0 @@
1
- import $4oXwn$intlStringsmodulejs from "./intlStrings.module.js";
2
- import {MenuContext as $d94604d52c3e3feb$export$c7e742effb1c51e2, MenuStateContext as $d94604d52c3e3feb$export$24aad8519b95b41b, useMenuStateContext as $d94604d52c3e3feb$export$efa3856fc0e85e7f} from "./context.module.js";
3
- import {MenuItem as $48fb8f5e1202c980$export$2ce376c2cc3355c8} from "./MenuItem.module.js";
4
- import {MenuSection as $b966e606890cc5ca$export$4b1545b4f2016d26} from "./MenuSection.module.js";
5
- import "./menu.2ec1fdaf.css";
6
- import $4oXwn$menu_vars_cssmodulejs from "./menu_vars_css.module.js";
7
- import {ActionButton as $4oXwn$ActionButton} from "@react-spectrum/button";
8
- import $4oXwn$spectrumiconsuiArrowDownSmall from "@spectrum-icons/ui/ArrowDownSmall";
9
- import {useDOMRef as $4oXwn$useDOMRef, useStyleProps as $4oXwn$useStyleProps, classNames as $4oXwn$classNames, useIsMobileDevice as $4oXwn$useIsMobileDevice} from "@react-spectrum/utils";
10
- import {FocusScope as $4oXwn$FocusScope} from "@react-aria/focus";
11
- import {mergeProps as $4oXwn$mergeProps, useSyncRef as $4oXwn$useSyncRef, useLayoutEffect as $4oXwn$useLayoutEffect, useSlotId as $4oXwn$useSlotId} from "@react-aria/utils";
12
- import $4oXwn$react, {useContext as $4oXwn$useContext, useState as $4oXwn$useState, useRef as $4oXwn$useRef, useEffect as $4oXwn$useEffect} from "react";
13
- import {useTreeState as $4oXwn$useTreeState} from "@react-stately/tree";
14
- import {useLocalizedStringFormatter as $4oXwn$useLocalizedStringFormatter, useLocale as $4oXwn$useLocale} from "@react-aria/i18n";
15
- import {useMenu as $4oXwn$useMenu} from "@react-aria/menu";
16
-
17
-
18
- function $parcel$interopDefault(a) {
19
- return a && a.__esModule ? a.default : a;
20
- }
21
- /*
22
- * Copyright 2020 Adobe. All rights reserved.
23
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
24
- * you may not use this file except in compliance with the License. You may obtain a copy
25
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
26
- *
27
- * Unless required by applicable law or agreed to in writing, software distributed under
28
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
29
- * OF ANY KIND, either express or implied. See the License for the specific language
30
- * governing permissions and limitations under the License.
31
- */
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
- const $49b26f4b606348f6$export$d9b273488cd8ce6f = /*#__PURE__*/ (0, $4oXwn$react).forwardRef(function Menu(props, ref) {
46
- let isSubmenu = true;
47
- let contextProps = (0, $4oXwn$useContext)((0, $d94604d52c3e3feb$export$c7e742effb1c51e2));
48
- let parentMenuContext = (0, $d94604d52c3e3feb$export$efa3856fc0e85e7f)();
49
- let { rootMenuTriggerState: rootMenuTriggerState, state: parentMenuTreeState } = parentMenuContext || {
50
- rootMenuTriggerState: contextProps.state
51
- };
52
- if (!parentMenuContext) isSubmenu = false;
53
- let completeProps = {
54
- ...(0, $4oXwn$mergeProps)(contextProps, props)
55
- };
56
- let domRef = (0, $4oXwn$useDOMRef)(ref);
57
- let [popoverContainer, setPopoverContainer] = (0, $4oXwn$useState)(null);
58
- let trayContainerRef = (0, $4oXwn$useRef)(null);
59
- let state = (0, $4oXwn$useTreeState)(completeProps);
60
- let submenuRef = (0, $4oXwn$useRef)(null);
61
- let { menuProps: menuProps } = (0, $4oXwn$useMenu)(completeProps, state, domRef);
62
- let { styleProps: styleProps } = (0, $4oXwn$useStyleProps)(completeProps);
63
- (0, $4oXwn$useSyncRef)(contextProps, domRef);
64
- let [leftOffset, setLeftOffset] = (0, $4oXwn$useState)({
65
- left: 0
66
- });
67
- let prevPopoverContainer = (0, $4oXwn$useRef)(null);
68
- (0, $4oXwn$useLayoutEffect)(()=>{
69
- if (popoverContainer && prevPopoverContainer.current !== popoverContainer && leftOffset.left === 0) {
70
- prevPopoverContainer.current = popoverContainer;
71
- let { left: left } = popoverContainer.getBoundingClientRect();
72
- setLeftOffset({
73
- left: -1 * left
74
- });
75
- }
76
- }, [
77
- leftOffset,
78
- popoverContainer
79
- ]);
80
- var _contextProps_submenuLevel;
81
- let menuLevel = (_contextProps_submenuLevel = contextProps.submenuLevel) !== null && _contextProps_submenuLevel !== void 0 ? _contextProps_submenuLevel : -1;
82
- let nextMenuLevelKey = rootMenuTriggerState === null || rootMenuTriggerState === void 0 ? void 0 : rootMenuTriggerState.expandedKeysStack[menuLevel + 1];
83
- let hasOpenSubmenu = false;
84
- if (nextMenuLevelKey != null) {
85
- let nextMenuLevel = state.collection.getItem(nextMenuLevelKey);
86
- hasOpenSubmenu = nextMenuLevel != null;
87
- }
88
- return /*#__PURE__*/ (0, $4oXwn$react).createElement((0, $d94604d52c3e3feb$export$24aad8519b95b41b).Provider, {
89
- value: {
90
- popoverContainer: popoverContainer,
91
- trayContainerRef: trayContainerRef,
92
- menu: domRef,
93
- submenu: submenuRef,
94
- rootMenuTriggerState: rootMenuTriggerState,
95
- state: state
96
- }
97
- }, /*#__PURE__*/ (0, $4oXwn$react).createElement("div", {
98
- style: {
99
- height: hasOpenSubmenu ? '100%' : undefined
100
- },
101
- ref: trayContainerRef
102
- }), /*#__PURE__*/ (0, $4oXwn$react).createElement((0, $4oXwn$FocusScope), null, /*#__PURE__*/ (0, $4oXwn$react).createElement($49b26f4b606348f6$export$3dfe97b5c32d8d8c, {
103
- onBackButtonPress: contextProps.onBackButtonPress,
104
- hasOpenSubmenu: hasOpenSubmenu,
105
- isSubmenu: isSubmenu,
106
- parentMenuTreeState: parentMenuTreeState,
107
- rootMenuTriggerState: rootMenuTriggerState,
108
- menuRef: domRef
109
- }, /*#__PURE__*/ (0, $4oXwn$react).createElement("div", {
110
- ...menuProps,
111
- style: (0, $4oXwn$mergeProps)(styleProps.style, menuProps.style),
112
- ref: domRef,
113
- className: (0, $4oXwn$classNames)((0, ($parcel$interopDefault($4oXwn$menu_vars_cssmodulejs))), 'spectrum-Menu', styleProps.className)
114
- }, [
115
- ...state.collection
116
- ].map((item)=>{
117
- if (item.type === 'section') return /*#__PURE__*/ (0, $4oXwn$react).createElement((0, $b966e606890cc5ca$export$4b1545b4f2016d26), {
118
- key: item.key,
119
- item: item,
120
- state: state
121
- });
122
- let menuItem = /*#__PURE__*/ (0, $4oXwn$react).createElement((0, $48fb8f5e1202c980$export$2ce376c2cc3355c8), {
123
- key: item.key,
124
- item: item,
125
- state: state
126
- });
127
- if (item.wrapper) menuItem = item.wrapper(menuItem);
128
- return menuItem;
129
- }))), (rootMenuTriggerState === null || rootMenuTriggerState === void 0 ? void 0 : rootMenuTriggerState.isOpen) && /*#__PURE__*/ (0, $4oXwn$react).createElement("div", {
130
- ref: setPopoverContainer,
131
- style: {
132
- width: '100vw',
133
- position: 'absolute',
134
- top: -5,
135
- ...leftOffset
136
- }
137
- })));
138
- });
139
- function $49b26f4b606348f6$export$3dfe97b5c32d8d8c(props) {
140
- var _parentMenuTreeState_collection_getItem;
141
- let { children: children, isSubmenu: isSubmenu, hasOpenSubmenu: hasOpenSubmenu, parentMenuTreeState: parentMenuTreeState, rootMenuTriggerState: rootMenuTriggerState, onBackButtonPress: onBackButtonPress, wrapperKeyDown: wrapperKeyDown, menuRef: menuRef } = props;
142
- let stringFormatter = (0, $4oXwn$useLocalizedStringFormatter)((0, ($parcel$interopDefault($4oXwn$intlStringsmodulejs))), '@react-spectrum/menu');
143
- let lastKey = rootMenuTriggerState === null || rootMenuTriggerState === void 0 ? void 0 : rootMenuTriggerState.expandedKeysStack.slice(-1)[0];
144
- let backButtonText = '';
145
- var _parentMenuTreeState_collection_getItem_textValue;
146
- if (lastKey != null) backButtonText = (_parentMenuTreeState_collection_getItem_textValue = parentMenuTreeState === null || parentMenuTreeState === void 0 ? void 0 : (_parentMenuTreeState_collection_getItem = parentMenuTreeState.collection.getItem(lastKey)) === null || _parentMenuTreeState_collection_getItem === void 0 ? void 0 : _parentMenuTreeState_collection_getItem.textValue) !== null && _parentMenuTreeState_collection_getItem_textValue !== void 0 ? _parentMenuTreeState_collection_getItem_textValue : '';
147
- let backButtonLabel = stringFormatter.format('backButton', {
148
- prevMenuButton: backButtonText !== null && backButtonText !== void 0 ? backButtonText : ''
149
- });
150
- let headingId = (0, $4oXwn$useSlotId)();
151
- let isMobile = (0, $4oXwn$useIsMobileDevice)();
152
- let { direction: direction } = (0, $4oXwn$useLocale)();
153
- let [traySubmenuAnimation, setTraySubmenuAnimation] = (0, $4oXwn$useState)('');
154
- (0, $4oXwn$useLayoutEffect)(()=>{
155
- if (!hasOpenSubmenu) setTraySubmenuAnimation('spectrum-TraySubmenu-enter');
156
- }, [
157
- hasOpenSubmenu,
158
- isMobile
159
- ]);
160
- let timeoutRef = (0, $4oXwn$useRef)(null);
161
- let handleBackButtonPress = ()=>{
162
- setTraySubmenuAnimation('spectrum-TraySubmenu-exit');
163
- timeoutRef.current = setTimeout(()=>{
164
- onBackButtonPress === null || onBackButtonPress === void 0 ? void 0 : onBackButtonPress();
165
- }, 220); // Matches transition duration
166
- };
167
- (0, $4oXwn$useEffect)(()=>{
168
- return ()=>{
169
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
170
- };
171
- }, []);
172
- // When opening submenu in tray, focus the first item in the submenu after animation completes
173
- // This fixes an issue with iOS VO where the closed submenu was getting focus
174
- let focusTimeoutRef = (0, $4oXwn$useRef)(null);
175
- (0, $4oXwn$useEffect)(()=>{
176
- if (isMobile && isSubmenu && !hasOpenSubmenu && traySubmenuAnimation === 'spectrum-TraySubmenu-enter') focusTimeoutRef.current = setTimeout(()=>{
177
- var _menuRef_current;
178
- let firstItem = menuRef === null || menuRef === void 0 ? void 0 : (_menuRef_current = menuRef.current) === null || _menuRef_current === void 0 ? void 0 : _menuRef_current.querySelector('[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]');
179
- firstItem === null || firstItem === void 0 ? void 0 : firstItem.focus();
180
- }, 220);
181
- return ()=>{
182
- if (focusTimeoutRef.current) clearTimeout(focusTimeoutRef.current);
183
- };
184
- }, [
185
- hasOpenSubmenu,
186
- isMobile,
187
- isSubmenu,
188
- menuRef,
189
- traySubmenuAnimation
190
- ]);
191
- return /*#__PURE__*/ (0, $4oXwn$react).createElement((0, $4oXwn$react).Fragment, null, /*#__PURE__*/ (0, $4oXwn$react).createElement("div", {
192
- role: headingId ? 'dialog' : undefined,
193
- "aria-labelledby": headingId,
194
- "aria-hidden": isMobile && hasOpenSubmenu,
195
- "data-testid": "menu-wrapper",
196
- className: (0, $4oXwn$classNames)((0, ($parcel$interopDefault($4oXwn$menu_vars_cssmodulejs))), 'spectrum-Menu-wrapper', {
197
- 'spectrum-Menu-wrapper--isMobile': isMobile,
198
- 'is-expanded': hasOpenSubmenu,
199
- [traySubmenuAnimation]: isMobile
200
- })
201
- }, /*#__PURE__*/ (0, $4oXwn$react).createElement("div", {
202
- role: "presentation",
203
- className: (0, $4oXwn$classNames)((0, ($parcel$interopDefault($4oXwn$menu_vars_cssmodulejs))), 'spectrum-Submenu-wrapper', {
204
- 'spectrum-Submenu-wrapper--isMobile': isMobile
205
- }),
206
- onKeyDown: wrapperKeyDown
207
- }, isMobile && isSubmenu && !hasOpenSubmenu && /*#__PURE__*/ (0, $4oXwn$react).createElement("div", {
208
- className: (0, $4oXwn$classNames)((0, ($parcel$interopDefault($4oXwn$menu_vars_cssmodulejs))), 'spectrum-Submenu-headingWrapper')
209
- }, /*#__PURE__*/ (0, $4oXwn$react).createElement((0, $4oXwn$ActionButton), {
210
- "aria-label": backButtonLabel,
211
- isQuiet: true,
212
- onPress: handleBackButtonPress
213
- }, direction === 'rtl' ? /*#__PURE__*/ (0, $4oXwn$react).createElement((0, $4oXwn$spectrumiconsuiArrowDownSmall), {
214
- UNSAFE_style: {
215
- rotate: '270deg'
216
- }
217
- }) : /*#__PURE__*/ (0, $4oXwn$react).createElement((0, $4oXwn$spectrumiconsuiArrowDownSmall), {
218
- UNSAFE_style: {
219
- rotate: '90deg'
220
- }
221
- })), /*#__PURE__*/ (0, $4oXwn$react).createElement("h1", {
222
- id: headingId,
223
- className: (0, $4oXwn$classNames)((0, ($parcel$interopDefault($4oXwn$menu_vars_cssmodulejs))), 'spectrum-Submenu-heading')
224
- }, backButtonText)), children)));
225
- }
226
-
227
-
228
- export {$49b26f4b606348f6$export$d9b273488cd8ce6f as Menu, $49b26f4b606348f6$export$3dfe97b5c32d8d8c as TrayHeaderWrapper};
229
- //# sourceMappingURL=Menu.module.js.map
@@ -1 +0,0 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/menu/src/Menu.tsx"],"sourcesContent":["/*\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\nimport {ActionButton} from '@react-spectrum/button';\nimport ArrowDownSmall from '@spectrum-icons/ui/ArrowDownSmall';\nimport {classNames, useDOMRef, useIsMobileDevice, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef} from '@react-types/shared';\nimport {FocusScope} from '@react-aria/focus';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {MenuContext, MenuStateContext, useMenuStateContext} from './context';\nimport {MenuItem} from './MenuItem';\nimport {MenuSection} from './MenuSection';\nimport {mergeProps, useLayoutEffect, useSlotId, useSyncRef} from '@react-aria/utils';\nimport React, {KeyboardEventHandler, ReactElement, ReactNode, RefObject, useContext, useEffect, useRef, useState} from 'react';\nimport {RootMenuTriggerState} from '@react-stately/menu';\nimport {SpectrumMenuProps} from '@react-types/menu';\nimport styles from '@adobe/spectrum-css-temp/components/menu/vars.css';\nimport {TreeState, useTreeState} from '@react-stately/tree';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMenu} from '@react-aria/menu';\n\n/**\n * Menus display a list of actions or options that a user can choose.\n */\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\n// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref\nexport const Menu = React.forwardRef(function Menu<T extends object>(props: SpectrumMenuProps<T>, ref: DOMRef<HTMLDivElement>) {\n let isSubmenu = true;\n let contextProps = useContext(MenuContext);\n let parentMenuContext = useMenuStateContext();\n let {rootMenuTriggerState, state: parentMenuTreeState} = parentMenuContext || {rootMenuTriggerState: contextProps.state};\n if (!parentMenuContext) {\n isSubmenu = false;\n }\n let completeProps = {\n ...mergeProps(contextProps, props)\n };\n let domRef = useDOMRef(ref);\n let [popoverContainer, setPopoverContainer] = useState<HTMLElement | null>(null);\n let trayContainerRef = useRef<HTMLDivElement | null>(null);\n let state = useTreeState(completeProps);\n let submenuRef = useRef<HTMLDivElement>(null);\n let {menuProps} = useMenu(completeProps, state, domRef);\n let {styleProps} = useStyleProps(completeProps);\n useSyncRef(contextProps, domRef);\n let [leftOffset, setLeftOffset] = useState({left: 0});\n let prevPopoverContainer = useRef<HTMLElement | null>(null);\n\n useLayoutEffect(() => {\n if (popoverContainer && prevPopoverContainer.current !== popoverContainer && leftOffset.left === 0) {\n prevPopoverContainer.current = popoverContainer;\n let {left} = popoverContainer.getBoundingClientRect();\n setLeftOffset({left: -1 * left});\n }\n }, [leftOffset, popoverContainer]);\n\n let menuLevel = contextProps.submenuLevel ?? -1;\n let nextMenuLevelKey = rootMenuTriggerState?.expandedKeysStack[menuLevel + 1];\n let hasOpenSubmenu = false;\n if (nextMenuLevelKey != null) {\n let nextMenuLevel = state.collection.getItem(nextMenuLevelKey);\n hasOpenSubmenu = nextMenuLevel != null;\n }\n\n return (\n <MenuStateContext.Provider value={{popoverContainer, trayContainerRef, menu: domRef, submenu: submenuRef, rootMenuTriggerState, state}}>\n <div style={{height: hasOpenSubmenu ? '100%' : undefined}} ref={trayContainerRef} />\n <FocusScope>\n <TrayHeaderWrapper\n onBackButtonPress={contextProps.onBackButtonPress}\n hasOpenSubmenu={hasOpenSubmenu}\n isSubmenu={isSubmenu}\n parentMenuTreeState={parentMenuTreeState}\n rootMenuTriggerState={rootMenuTriggerState}\n menuRef={domRef}>\n <div\n {...menuProps}\n style={mergeProps(styleProps.style, menuProps.style)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-Menu',\n styleProps.className\n )\n }>\n {[...state.collection].map(item => {\n if (item.type === 'section') {\n return (\n <MenuSection\n key={item.key}\n item={item}\n state={state} />\n );\n }\n\n let menuItem = (\n <MenuItem\n key={item.key}\n item={item}\n state={state} />\n );\n\n if (item.wrapper) {\n menuItem = item.wrapper(menuItem);\n }\n\n return menuItem;\n })}\n </div>\n </TrayHeaderWrapper>\n {rootMenuTriggerState?.isOpen && <div ref={setPopoverContainer} style={{width: '100vw', position: 'absolute', top: -5, ...leftOffset}} /> }\n </FocusScope>\n </MenuStateContext.Provider>\n );\n}) as <T>(props: SpectrumMenuProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nexport function TrayHeaderWrapper(props: {\n children: ReactNode,\n isSubmenu?: boolean,\n hasOpenSubmenu?: boolean,\n parentMenuTreeState?: TreeState<any>,\n rootMenuTriggerState?: RootMenuTriggerState,\n onBackButtonPress?: (() => void),\n wrapperKeyDown?: KeyboardEventHandler<HTMLDivElement> | undefined,\n menuRef?: RefObject<HTMLDivElement | null>\n}): ReactNode {\n let {children, isSubmenu, hasOpenSubmenu, parentMenuTreeState, rootMenuTriggerState, onBackButtonPress, wrapperKeyDown, menuRef} = props;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/menu');\n let lastKey = rootMenuTriggerState?.expandedKeysStack.slice(-1)[0];\n let backButtonText = '';\n if (lastKey != null) {\n backButtonText = parentMenuTreeState?.collection.getItem(lastKey)?.textValue ?? '';\n }\n let backButtonLabel = stringFormatter.format('backButton', {\n prevMenuButton: backButtonText ?? ''\n });\n let headingId = useSlotId();\n let isMobile = useIsMobileDevice();\n let {direction} = useLocale();\n\n let [traySubmenuAnimation, setTraySubmenuAnimation] = useState('');\n useLayoutEffect(() => {\n if (!hasOpenSubmenu) {\n setTraySubmenuAnimation('spectrum-TraySubmenu-enter');\n }\n }, [hasOpenSubmenu, isMobile]);\n\n let timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n let handleBackButtonPress = () => {\n setTraySubmenuAnimation('spectrum-TraySubmenu-exit');\n timeoutRef.current = setTimeout(() => {\n onBackButtonPress?.();\n }, 220); // Matches transition duration\n };\n\n useEffect(() => {\n return () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n };\n }, []);\n\n // When opening submenu in tray, focus the first item in the submenu after animation completes\n // This fixes an issue with iOS VO where the closed submenu was getting focus\n let focusTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n useEffect(() => {\n if (isMobile && isSubmenu && !hasOpenSubmenu && traySubmenuAnimation === 'spectrum-TraySubmenu-enter') {\n focusTimeoutRef.current = setTimeout(() => {\n let firstItem = menuRef?.current?.querySelector('[role=\"menuitem\"], [role=\"menuitemcheckbox\"], [role=\"menuitemradio\"]') as HTMLElement;\n firstItem?.focus();\n }, 220);\n }\n return () => {\n if (focusTimeoutRef.current) {\n clearTimeout(focusTimeoutRef.current);\n }\n };\n }, [hasOpenSubmenu, isMobile, isSubmenu, menuRef, traySubmenuAnimation]);\n\n return (\n <>\n <div\n role={headingId ? 'dialog' : undefined}\n aria-labelledby={headingId}\n aria-hidden={isMobile && hasOpenSubmenu}\n data-testid=\"menu-wrapper\"\n className={\n classNames(\n styles,\n 'spectrum-Menu-wrapper',\n {\n 'spectrum-Menu-wrapper--isMobile': isMobile,\n 'is-expanded': hasOpenSubmenu,\n [traySubmenuAnimation]: isMobile\n }\n )\n }>\n <div role=\"presentation\" className={classNames(styles, 'spectrum-Submenu-wrapper', {'spectrum-Submenu-wrapper--isMobile': isMobile})} onKeyDown={wrapperKeyDown}>\n {isMobile && isSubmenu && !hasOpenSubmenu && (\n <div className={classNames(styles, 'spectrum-Submenu-headingWrapper')}>\n <ActionButton\n aria-label={backButtonLabel}\n isQuiet\n onPress={handleBackButtonPress}>\n {/* We don't have a ArrowLeftSmall so make due with ArrowDownSmall and transforms */}\n {direction === 'rtl' ? <ArrowDownSmall UNSAFE_style={{rotate: '270deg'}} /> : <ArrowDownSmall UNSAFE_style={{rotate: '90deg'}} />}\n </ActionButton>\n <h1 id={headingId} className={classNames(styles, 'spectrum-Submenu-heading')}>{backButtonText}</h1>\n </div>\n )}\n {children}\n </div>\n </div>\n </>\n );\n}\n"],"names":[],"version":3,"file":"Menu.module.js.map"}
@@ -1,149 +0,0 @@
1
- var $2f9ceea24fba5443$exports = require("./intlStrings.main.js");
2
- require("./menu.2ec1fdaf.css");
3
- var $3deee0fd2b46e64f$exports = require("./menu_vars_css.main.js");
4
- var $cac834c4bc0a51d3$exports = require("./context.main.js");
5
- var $8PAEC$spectrumiconsuiCheckmarkMedium = require("@spectrum-icons/ui/CheckmarkMedium");
6
- var $8PAEC$spectrumiconsworkflowChevronLeft = require("@spectrum-icons/workflow/ChevronLeft");
7
- var $8PAEC$spectrumiconsworkflowChevronRight = require("@spectrum-icons/workflow/ChevronRight");
8
- var $8PAEC$reactspectrumutils = require("@react-spectrum/utils");
9
- var $8PAEC$reactariafocus = require("@react-aria/focus");
10
- var $8PAEC$reactspectrumlayout = require("@react-spectrum/layout");
11
- var $8PAEC$spectrumiconsworkflowInfoOutline = require("@spectrum-icons/workflow/InfoOutline");
12
- var $8PAEC$reactariautils = require("@react-aria/utils");
13
- var $8PAEC$react = require("react");
14
- var $8PAEC$reactspectrumtext = require("@react-spectrum/text");
15
- var $8PAEC$reactariai18n = require("@react-aria/i18n");
16
- var $8PAEC$reactariamenu = require("@react-aria/menu");
17
-
18
-
19
- function $parcel$interopDefault(a) {
20
- return a && a.__esModule ? a.default : a;
21
- }
22
-
23
- function $parcel$export(e, n, v, s) {
24
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
25
- }
26
-
27
- $parcel$export(module.exports, "MenuItem", () => $1d718563708db5b5$export$2ce376c2cc3355c8);
28
- /*
29
- * Copyright 2020 Adobe. All rights reserved.
30
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
31
- * you may not use this file except in compliance with the License. You may obtain a copy
32
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
33
- *
34
- * Unless required by applicable law or agreed to in writing, software distributed under
35
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
36
- * OF ANY KIND, either express or implied. See the License for the specific language
37
- * governing permissions and limitations under the License.
38
- */
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
-
53
- function $1d718563708db5b5$export$2ce376c2cc3355c8(props) {
54
- let { item: item, state: state, isVirtualized: isVirtualized } = props;
55
- let { closeOnSelect: closeOnSelect } = (0, $cac834c4bc0a51d3$exports.useMenuContext)();
56
- let { rendered: rendered, key: key } = item;
57
- let stringFormatter = (0, $8PAEC$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($2f9ceea24fba5443$exports))), '@react-spectrum/menu');
58
- let { direction: direction } = (0, $8PAEC$reactariai18n.useLocale)();
59
- let submenuTriggerContext = (0, $cac834c4bc0a51d3$exports.useSubmenuTriggerContext)();
60
- let { triggerRef: triggerRef, ...submenuTriggerProps } = submenuTriggerContext || {};
61
- let isSubmenuTrigger = !!submenuTriggerContext;
62
- let isUnavailable;
63
- let ElementType = item.props.href ? 'a' : 'div';
64
- if (isSubmenuTrigger) isUnavailable = submenuTriggerContext.isUnavailable;
65
- let isDisabled = state.disabledKeys.has(key);
66
- let isContextualHelpTrigger = isSubmenuTrigger && isUnavailable !== undefined;
67
- let isSelectable = (isContextualHelpTrigger ? !isUnavailable : !isSubmenuTrigger) && state.selectionManager.selectionMode !== 'none';
68
- let isSelected = isSelectable && state.selectionManager.isSelected(key);
69
- let itemref = (0, $8PAEC$react.useRef)(null);
70
- let ref = (0, $8PAEC$reactariautils.useObjectRef)((0, $8PAEC$react.useMemo)(()=>(0, $8PAEC$reactariautils.mergeRefs)(itemref, triggerRef), [
71
- itemref,
72
- triggerRef
73
- ]));
74
- let { menuItemProps: menuItemProps, labelProps: labelProps, descriptionProps: descriptionProps, keyboardShortcutProps: keyboardShortcutProps } = (0, $8PAEC$reactariamenu.useMenuItem)({
75
- isSelected: isSelected,
76
- isDisabled: isDisabled,
77
- 'aria-label': item['aria-label'],
78
- key: key,
79
- closeOnSelect: closeOnSelect,
80
- isVirtualized: isVirtualized,
81
- ...submenuTriggerProps
82
- }, state, ref);
83
- let endId = (0, $8PAEC$reactariautils.useSlotId)();
84
- let endProps = {};
85
- if (endId) {
86
- endProps.id = endId;
87
- menuItemProps['aria-describedby'] = [
88
- menuItemProps['aria-describedby'],
89
- endId
90
- ].filter(Boolean).join(' ');
91
- }
92
- let contents = typeof rendered === 'string' ? /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, $8PAEC$reactspectrumtext.Text), null, rendered) : rendered;
93
- return /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, $8PAEC$reactariafocus.FocusRing), {
94
- focusRingClass: (0, $8PAEC$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'focus-ring')
95
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement(ElementType, {
96
- ...menuItemProps,
97
- ref: ref,
98
- className: (0, $8PAEC$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu-item', {
99
- 'is-disabled': isDisabled,
100
- 'is-selected': isSelected,
101
- 'is-selectable': isSelectable,
102
- 'is-open': submenuTriggerProps.isOpen
103
- })
104
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, $8PAEC$reactspectrumlayout.Grid), {
105
- UNSAFE_className: (0, $8PAEC$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu-itemGrid')
106
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, $8PAEC$reactspectrumutils.ClearSlots), null, /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, $8PAEC$reactspectrumutils.SlotProvider), {
107
- slots: {
108
- text: {
109
- UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-itemLabel'],
110
- ...labelProps
111
- },
112
- end: {
113
- UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-end'],
114
- ...endProps
115
- },
116
- icon: {
117
- UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-icon'],
118
- size: 'S'
119
- },
120
- description: {
121
- UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-description'],
122
- ...descriptionProps
123
- },
124
- keyboard: {
125
- UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-keyboard'],
126
- ...keyboardShortcutProps
127
- },
128
- chevron: {
129
- UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-chevron'],
130
- size: 'S'
131
- }
132
- }
133
- }, contents, isSelected && /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, ($parcel$interopDefault($8PAEC$spectrumiconsuiCheckmarkMedium))), {
134
- slot: "checkmark",
135
- UNSAFE_className: (0, $8PAEC$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu-checkmark')
136
- }), isUnavailable && /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, ($parcel$interopDefault($8PAEC$spectrumiconsworkflowInfoOutline))), {
137
- slot: "end",
138
- size: "XS",
139
- alignSelf: "center",
140
- "aria-label": stringFormatter.format('unavailable')
141
- }), isUnavailable == null && isSubmenuTrigger && (direction === 'rtl' ? /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, ($parcel$interopDefault($8PAEC$spectrumiconsworkflowChevronLeft))), {
142
- slot: "chevron"
143
- }) : /*#__PURE__*/ (0, ($parcel$interopDefault($8PAEC$react))).createElement((0, ($parcel$interopDefault($8PAEC$spectrumiconsworkflowChevronRight))), {
144
- slot: "chevron"
145
- })))))));
146
- }
147
-
148
-
149
- //# sourceMappingURL=MenuItem.main.js.map
@@ -1 +0,0 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/menu/src/MenuItem.tsx"],"sourcesContent":["/*\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\nimport CheckmarkMedium from '@spectrum-icons/ui/CheckmarkMedium';\nimport ChevronLeft from '@spectrum-icons/workflow/ChevronLeft';\nimport ChevronRight from '@spectrum-icons/workflow/ChevronRight';\nimport {classNames, ClearSlots, SlotProvider} from '@react-spectrum/utils';\nimport {DOMAttributes, Node} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport InfoOutline from '@spectrum-icons/workflow/InfoOutline';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeRefs, useObjectRef, useSlotId} from '@react-aria/utils';\nimport React, {JSX, useMemo, useRef} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/menu/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {TreeState} from '@react-stately/tree';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMenuContext, useSubmenuTriggerContext} from './context';\nimport {useMenuItem} from '@react-aria/menu';\n\ninterface MenuItemProps<T> {\n item: Node<T>,\n state: TreeState<T>,\n isVirtualized?: boolean\n}\n\n/** @private */\nexport function MenuItem<T>(props: MenuItemProps<T>): JSX.Element {\n let {\n item,\n state,\n isVirtualized\n } = props;\n let {\n closeOnSelect\n } = useMenuContext();\n let {\n rendered,\n key\n } = item;\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/menu');\n let {direction} = useLocale();\n\n let submenuTriggerContext = useSubmenuTriggerContext();\n let {triggerRef, ...submenuTriggerProps} = submenuTriggerContext || {};\n let isSubmenuTrigger = !!submenuTriggerContext;\n let isUnavailable;\n let ElementType: React.ElementType = item.props.href ? 'a' : 'div';\n\n if (isSubmenuTrigger) {\n isUnavailable = submenuTriggerContext!.isUnavailable;\n }\n\n let isDisabled = state.disabledKeys.has(key);\n let isContextualHelpTrigger = isSubmenuTrigger && isUnavailable !== undefined;\n let isSelectable = (\n (isContextualHelpTrigger ? !isUnavailable : !isSubmenuTrigger) &&\n state.selectionManager.selectionMode !== 'none'\n );\n let isSelected = isSelectable && state.selectionManager.isSelected(key);\n let itemref = useRef<any>(null);\n let ref = useObjectRef(useMemo(() => mergeRefs(itemref, triggerRef), [itemref, triggerRef]));\n let {\n menuItemProps,\n labelProps,\n descriptionProps,\n keyboardShortcutProps\n } = useMenuItem(\n {\n isSelected,\n isDisabled,\n 'aria-label': item['aria-label'],\n key,\n closeOnSelect,\n isVirtualized,\n ...submenuTriggerProps\n },\n state,\n ref\n );\n let endId = useSlotId();\n let endProps: DOMAttributes = {};\n if (endId) {\n endProps.id = endId;\n menuItemProps['aria-describedby'] = [menuItemProps['aria-describedby'], endId].filter(Boolean).join(' ');\n }\n\n let contents = typeof rendered === 'string'\n ? <Text>{rendered}</Text>\n : rendered;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <ElementType\n {...menuItemProps}\n ref={ref}\n className={classNames(\n styles,\n 'spectrum-Menu-item',\n {\n 'is-disabled': isDisabled,\n 'is-selected': isSelected,\n 'is-selectable': isSelectable,\n 'is-open': submenuTriggerProps.isOpen\n }\n )}>\n <Grid\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-Menu-itemGrid'\n )\n }>\n <ClearSlots>\n <SlotProvider\n slots={{\n text: {UNSAFE_className: styles['spectrum-Menu-itemLabel'], ...labelProps},\n end: {UNSAFE_className: styles['spectrum-Menu-end'], ...endProps},\n icon: {UNSAFE_className: styles['spectrum-Menu-icon'], size: 'S'},\n description: {UNSAFE_className: styles['spectrum-Menu-description'], ...descriptionProps},\n keyboard: {UNSAFE_className: styles['spectrum-Menu-keyboard'], ...keyboardShortcutProps},\n chevron: {UNSAFE_className: styles['spectrum-Menu-chevron'], size: 'S'}\n }}>\n {contents}\n {isSelected &&\n <CheckmarkMedium\n slot=\"checkmark\"\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-Menu-checkmark'\n )\n } />\n }\n {\n isUnavailable && <InfoOutline slot=\"end\" size=\"XS\" alignSelf=\"center\" aria-label={stringFormatter.format('unavailable')} />\n }\n {\n isUnavailable == null && isSubmenuTrigger && (direction === 'rtl' ? <ChevronLeft slot=\"chevron\" /> : <ChevronRight slot=\"chevron\" />)\n }\n </SlotProvider>\n </ClearSlots>\n </Grid>\n </ElementType>\n </FocusRing>\n );\n}\n"],"names":[],"version":3,"file":"MenuItem.main.js.map"}
package/dist/MenuItem.mjs DELETED
@@ -1,144 +0,0 @@
1
- import $bVyMs$intlStringsmodulejs from "./intlStrings.mjs";
2
- import "./menu.2ec1fdaf.css";
3
- import $bVyMs$menu_vars_cssmodulejs from "./menu_vars_css.mjs";
4
- import {useMenuContext as $d94604d52c3e3feb$export$21c7ab35b39f78ec, useSubmenuTriggerContext as $d94604d52c3e3feb$export$dc2161044aa0b36d} from "./context.mjs";
5
- import $bVyMs$spectrumiconsuiCheckmarkMedium from "@spectrum-icons/ui/CheckmarkMedium";
6
- import $bVyMs$spectrumiconsworkflowChevronLeft from "@spectrum-icons/workflow/ChevronLeft";
7
- import $bVyMs$spectrumiconsworkflowChevronRight from "@spectrum-icons/workflow/ChevronRight";
8
- import {classNames as $bVyMs$classNames, ClearSlots as $bVyMs$ClearSlots, SlotProvider as $bVyMs$SlotProvider} from "@react-spectrum/utils";
9
- import {FocusRing as $bVyMs$FocusRing} from "@react-aria/focus";
10
- import {Grid as $bVyMs$Grid} from "@react-spectrum/layout";
11
- import $bVyMs$spectrumiconsworkflowInfoOutline from "@spectrum-icons/workflow/InfoOutline";
12
- import {useObjectRef as $bVyMs$useObjectRef, mergeRefs as $bVyMs$mergeRefs, useSlotId as $bVyMs$useSlotId} from "@react-aria/utils";
13
- import $bVyMs$react, {useRef as $bVyMs$useRef, useMemo as $bVyMs$useMemo} from "react";
14
- import {Text as $bVyMs$Text} from "@react-spectrum/text";
15
- import {useLocalizedStringFormatter as $bVyMs$useLocalizedStringFormatter, useLocale as $bVyMs$useLocale} from "@react-aria/i18n";
16
- import {useMenuItem as $bVyMs$useMenuItem} from "@react-aria/menu";
17
-
18
-
19
- function $parcel$interopDefault(a) {
20
- return a && a.__esModule ? a.default : a;
21
- }
22
- /*
23
- * Copyright 2020 Adobe. All rights reserved.
24
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
25
- * you may not use this file except in compliance with the License. You may obtain a copy
26
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
27
- *
28
- * Unless required by applicable law or agreed to in writing, software distributed under
29
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
30
- * OF ANY KIND, either express or implied. See the License for the specific language
31
- * governing permissions and limitations under the License.
32
- */
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
- function $48fb8f5e1202c980$export$2ce376c2cc3355c8(props) {
48
- let { item: item, state: state, isVirtualized: isVirtualized } = props;
49
- let { closeOnSelect: closeOnSelect } = (0, $d94604d52c3e3feb$export$21c7ab35b39f78ec)();
50
- let { rendered: rendered, key: key } = item;
51
- let stringFormatter = (0, $bVyMs$useLocalizedStringFormatter)((0, ($parcel$interopDefault($bVyMs$intlStringsmodulejs))), '@react-spectrum/menu');
52
- let { direction: direction } = (0, $bVyMs$useLocale)();
53
- let submenuTriggerContext = (0, $d94604d52c3e3feb$export$dc2161044aa0b36d)();
54
- let { triggerRef: triggerRef, ...submenuTriggerProps } = submenuTriggerContext || {};
55
- let isSubmenuTrigger = !!submenuTriggerContext;
56
- let isUnavailable;
57
- let ElementType = item.props.href ? 'a' : 'div';
58
- if (isSubmenuTrigger) isUnavailable = submenuTriggerContext.isUnavailable;
59
- let isDisabled = state.disabledKeys.has(key);
60
- let isContextualHelpTrigger = isSubmenuTrigger && isUnavailable !== undefined;
61
- let isSelectable = (isContextualHelpTrigger ? !isUnavailable : !isSubmenuTrigger) && state.selectionManager.selectionMode !== 'none';
62
- let isSelected = isSelectable && state.selectionManager.isSelected(key);
63
- let itemref = (0, $bVyMs$useRef)(null);
64
- let ref = (0, $bVyMs$useObjectRef)((0, $bVyMs$useMemo)(()=>(0, $bVyMs$mergeRefs)(itemref, triggerRef), [
65
- itemref,
66
- triggerRef
67
- ]));
68
- let { menuItemProps: menuItemProps, labelProps: labelProps, descriptionProps: descriptionProps, keyboardShortcutProps: keyboardShortcutProps } = (0, $bVyMs$useMenuItem)({
69
- isSelected: isSelected,
70
- isDisabled: isDisabled,
71
- 'aria-label': item['aria-label'],
72
- key: key,
73
- closeOnSelect: closeOnSelect,
74
- isVirtualized: isVirtualized,
75
- ...submenuTriggerProps
76
- }, state, ref);
77
- let endId = (0, $bVyMs$useSlotId)();
78
- let endProps = {};
79
- if (endId) {
80
- endProps.id = endId;
81
- menuItemProps['aria-describedby'] = [
82
- menuItemProps['aria-describedby'],
83
- endId
84
- ].filter(Boolean).join(' ');
85
- }
86
- let contents = typeof rendered === 'string' ? /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$Text), null, rendered) : rendered;
87
- return /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$FocusRing), {
88
- focusRingClass: (0, $bVyMs$classNames)((0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs))), 'focus-ring')
89
- }, /*#__PURE__*/ (0, $bVyMs$react).createElement(ElementType, {
90
- ...menuItemProps,
91
- ref: ref,
92
- className: (0, $bVyMs$classNames)((0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs))), 'spectrum-Menu-item', {
93
- 'is-disabled': isDisabled,
94
- 'is-selected': isSelected,
95
- 'is-selectable': isSelectable,
96
- 'is-open': submenuTriggerProps.isOpen
97
- })
98
- }, /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$Grid), {
99
- UNSAFE_className: (0, $bVyMs$classNames)((0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs))), 'spectrum-Menu-itemGrid')
100
- }, /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$ClearSlots), null, /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$SlotProvider), {
101
- slots: {
102
- text: {
103
- UNSAFE_className: (0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs)))['spectrum-Menu-itemLabel'],
104
- ...labelProps
105
- },
106
- end: {
107
- UNSAFE_className: (0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs)))['spectrum-Menu-end'],
108
- ...endProps
109
- },
110
- icon: {
111
- UNSAFE_className: (0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs)))['spectrum-Menu-icon'],
112
- size: 'S'
113
- },
114
- description: {
115
- UNSAFE_className: (0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs)))['spectrum-Menu-description'],
116
- ...descriptionProps
117
- },
118
- keyboard: {
119
- UNSAFE_className: (0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs)))['spectrum-Menu-keyboard'],
120
- ...keyboardShortcutProps
121
- },
122
- chevron: {
123
- UNSAFE_className: (0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs)))['spectrum-Menu-chevron'],
124
- size: 'S'
125
- }
126
- }
127
- }, contents, isSelected && /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$spectrumiconsuiCheckmarkMedium), {
128
- slot: "checkmark",
129
- UNSAFE_className: (0, $bVyMs$classNames)((0, ($parcel$interopDefault($bVyMs$menu_vars_cssmodulejs))), 'spectrum-Menu-checkmark')
130
- }), isUnavailable && /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$spectrumiconsworkflowInfoOutline), {
131
- slot: "end",
132
- size: "XS",
133
- alignSelf: "center",
134
- "aria-label": stringFormatter.format('unavailable')
135
- }), isUnavailable == null && isSubmenuTrigger && (direction === 'rtl' ? /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$spectrumiconsworkflowChevronLeft), {
136
- slot: "chevron"
137
- }) : /*#__PURE__*/ (0, $bVyMs$react).createElement((0, $bVyMs$spectrumiconsworkflowChevronRight), {
138
- slot: "chevron"
139
- })))))));
140
- }
141
-
142
-
143
- export {$48fb8f5e1202c980$export$2ce376c2cc3355c8 as MenuItem};
144
- //# sourceMappingURL=MenuItem.module.js.map