@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.
- package/dist/import.mjs +6 -8
- package/dist/main.js +12 -14
- package/dist/main.js.map +1 -1
- package/dist/module.js +6 -8
- package/dist/module.js.map +1 -1
- package/dist/types/src/index.d.ts +8 -0
- package/package.json +14 -46
- package/src/index.ts +9 -9
- package/dist/ActionMenu.main.js +0 -67
- package/dist/ActionMenu.main.js.map +0 -1
- package/dist/ActionMenu.mjs +0 -62
- package/dist/ActionMenu.module.js +0 -62
- package/dist/ActionMenu.module.js.map +0 -1
- package/dist/ContextualHelpTrigger.main.js +0 -192
- package/dist/ContextualHelpTrigger.main.js.map +0 -1
- package/dist/ContextualHelpTrigger.mjs +0 -187
- package/dist/ContextualHelpTrigger.module.js +0 -187
- package/dist/ContextualHelpTrigger.module.js.map +0 -1
- package/dist/Menu.main.js +0 -235
- package/dist/Menu.main.js.map +0 -1
- package/dist/Menu.mjs +0 -229
- package/dist/Menu.module.js +0 -229
- package/dist/Menu.module.js.map +0 -1
- package/dist/MenuItem.main.js +0 -149
- package/dist/MenuItem.main.js.map +0 -1
- package/dist/MenuItem.mjs +0 -144
- package/dist/MenuItem.module.js +0 -144
- package/dist/MenuItem.module.js.map +0 -1
- package/dist/MenuSection.main.js +0 -81
- package/dist/MenuSection.main.js.map +0 -1
- package/dist/MenuSection.mjs +0 -76
- package/dist/MenuSection.module.js +0 -76
- package/dist/MenuSection.module.js.map +0 -1
- package/dist/MenuTrigger.main.js +0 -128
- package/dist/MenuTrigger.main.js.map +0 -1
- package/dist/MenuTrigger.mjs +0 -123
- package/dist/MenuTrigger.module.js +0 -123
- package/dist/MenuTrigger.module.js.map +0 -1
- package/dist/SubmenuTrigger.main.js +0 -154
- package/dist/SubmenuTrigger.main.js.map +0 -1
- package/dist/SubmenuTrigger.mjs +0 -149
- package/dist/SubmenuTrigger.module.js +0 -149
- package/dist/SubmenuTrigger.module.js.map +0 -1
- package/dist/ar-AE.main.js +0 -8
- package/dist/ar-AE.main.js.map +0 -1
- package/dist/ar-AE.mjs +0 -10
- package/dist/ar-AE.module.js +0 -10
- package/dist/ar-AE.module.js.map +0 -1
- package/dist/bg-BG.main.js +0 -8
- package/dist/bg-BG.main.js.map +0 -1
- package/dist/bg-BG.mjs +0 -10
- package/dist/bg-BG.module.js +0 -10
- package/dist/bg-BG.module.js.map +0 -1
- package/dist/context.main.js +0 -43
- package/dist/context.main.js.map +0 -1
- package/dist/context.mjs +0 -29
- package/dist/context.module.js +0 -29
- package/dist/context.module.js.map +0 -1
- package/dist/contextualhelp_vars_css.main.js +0 -23
- package/dist/contextualhelp_vars_css.main.js.map +0 -1
- package/dist/contextualhelp_vars_css.mjs +0 -25
- package/dist/contextualhelp_vars_css.module.js +0 -25
- package/dist/contextualhelp_vars_css.module.js.map +0 -1
- package/dist/cs-CZ.main.js +0 -8
- package/dist/cs-CZ.main.js.map +0 -1
- package/dist/cs-CZ.mjs +0 -10
- package/dist/cs-CZ.module.js +0 -10
- package/dist/cs-CZ.module.js.map +0 -1
- package/dist/da-DK.main.js +0 -8
- package/dist/da-DK.main.js.map +0 -1
- package/dist/da-DK.mjs +0 -10
- package/dist/da-DK.module.js +0 -10
- package/dist/da-DK.module.js.map +0 -1
- package/dist/de-DE.main.js +0 -8
- package/dist/de-DE.main.js.map +0 -1
- package/dist/de-DE.mjs +0 -10
- package/dist/de-DE.module.js +0 -10
- package/dist/de-DE.module.js.map +0 -1
- package/dist/el-GR.main.js +0 -8
- package/dist/el-GR.main.js.map +0 -1
- package/dist/el-GR.mjs +0 -10
- package/dist/el-GR.module.js +0 -10
- package/dist/el-GR.module.js.map +0 -1
- package/dist/en-US.main.js +0 -8
- package/dist/en-US.main.js.map +0 -1
- package/dist/en-US.mjs +0 -10
- package/dist/en-US.module.js +0 -10
- package/dist/en-US.module.js.map +0 -1
- package/dist/es-ES.main.js +0 -8
- package/dist/es-ES.main.js.map +0 -1
- package/dist/es-ES.mjs +0 -10
- package/dist/es-ES.module.js +0 -10
- package/dist/es-ES.module.js.map +0 -1
- package/dist/et-EE.main.js +0 -8
- package/dist/et-EE.main.js.map +0 -1
- package/dist/et-EE.mjs +0 -10
- package/dist/et-EE.module.js +0 -10
- package/dist/et-EE.module.js.map +0 -1
- package/dist/fi-FI.main.js +0 -8
- package/dist/fi-FI.main.js.map +0 -1
- package/dist/fi-FI.mjs +0 -10
- package/dist/fi-FI.module.js +0 -10
- package/dist/fi-FI.module.js.map +0 -1
- package/dist/fr-FR.main.js +0 -8
- package/dist/fr-FR.main.js.map +0 -1
- package/dist/fr-FR.mjs +0 -10
- package/dist/fr-FR.module.js +0 -10
- package/dist/fr-FR.module.js.map +0 -1
- package/dist/he-IL.main.js +0 -8
- package/dist/he-IL.main.js.map +0 -1
- package/dist/he-IL.mjs +0 -10
- package/dist/he-IL.module.js +0 -10
- package/dist/he-IL.module.js.map +0 -1
- package/dist/hr-HR.main.js +0 -8
- package/dist/hr-HR.main.js.map +0 -1
- package/dist/hr-HR.mjs +0 -10
- package/dist/hr-HR.module.js +0 -10
- package/dist/hr-HR.module.js.map +0 -1
- package/dist/hu-HU.main.js +0 -8
- package/dist/hu-HU.main.js.map +0 -1
- package/dist/hu-HU.mjs +0 -10
- package/dist/hu-HU.module.js +0 -10
- package/dist/hu-HU.module.js.map +0 -1
- package/dist/intlStrings.main.js +0 -108
- package/dist/intlStrings.main.js.map +0 -1
- package/dist/intlStrings.mjs +0 -110
- package/dist/intlStrings.module.js +0 -110
- package/dist/intlStrings.module.js.map +0 -1
- package/dist/it-IT.main.js +0 -8
- package/dist/it-IT.main.js.map +0 -1
- package/dist/it-IT.mjs +0 -10
- package/dist/it-IT.module.js +0 -10
- package/dist/it-IT.module.js.map +0 -1
- package/dist/ja-JP.main.js +0 -8
- package/dist/ja-JP.main.js.map +0 -1
- package/dist/ja-JP.mjs +0 -10
- package/dist/ja-JP.module.js +0 -10
- package/dist/ja-JP.module.js.map +0 -1
- package/dist/ko-KR.main.js +0 -8
- package/dist/ko-KR.main.js.map +0 -1
- package/dist/ko-KR.mjs +0 -10
- package/dist/ko-KR.module.js +0 -10
- package/dist/ko-KR.module.js.map +0 -1
- package/dist/lt-LT.main.js +0 -8
- package/dist/lt-LT.main.js.map +0 -1
- package/dist/lt-LT.mjs +0 -10
- package/dist/lt-LT.module.js +0 -10
- package/dist/lt-LT.module.js.map +0 -1
- package/dist/lv-LV.main.js +0 -8
- package/dist/lv-LV.main.js.map +0 -1
- package/dist/lv-LV.mjs +0 -10
- package/dist/lv-LV.module.js +0 -10
- package/dist/lv-LV.module.js.map +0 -1
- package/dist/menu.2ec1fdaf.css +0 -570
- package/dist/menu.2ec1fdaf.css.map +0 -1
- package/dist/menu.5b49954a.css +0 -30
- package/dist/menu.5b49954a.css.map +0 -1
- package/dist/menu_vars_css.main.js +0 -177
- package/dist/menu_vars_css.main.js.map +0 -1
- package/dist/menu_vars_css.mjs +0 -179
- package/dist/menu_vars_css.module.js +0 -179
- package/dist/menu_vars_css.module.js.map +0 -1
- package/dist/nb-NO.main.js +0 -8
- package/dist/nb-NO.main.js.map +0 -1
- package/dist/nb-NO.mjs +0 -10
- package/dist/nb-NO.module.js +0 -10
- package/dist/nb-NO.module.js.map +0 -1
- package/dist/nl-NL.main.js +0 -8
- package/dist/nl-NL.main.js.map +0 -1
- package/dist/nl-NL.mjs +0 -10
- package/dist/nl-NL.module.js +0 -10
- package/dist/nl-NL.module.js.map +0 -1
- package/dist/pl-PL.main.js +0 -8
- package/dist/pl-PL.main.js.map +0 -1
- package/dist/pl-PL.mjs +0 -10
- package/dist/pl-PL.module.js +0 -10
- package/dist/pl-PL.module.js.map +0 -1
- package/dist/pt-BR.main.js +0 -8
- package/dist/pt-BR.main.js.map +0 -1
- package/dist/pt-BR.mjs +0 -10
- package/dist/pt-BR.module.js +0 -10
- package/dist/pt-BR.module.js.map +0 -1
- package/dist/pt-PT.main.js +0 -8
- package/dist/pt-PT.main.js.map +0 -1
- package/dist/pt-PT.mjs +0 -10
- package/dist/pt-PT.module.js +0 -10
- package/dist/pt-PT.module.js.map +0 -1
- package/dist/ro-RO.main.js +0 -8
- package/dist/ro-RO.main.js.map +0 -1
- package/dist/ro-RO.mjs +0 -10
- package/dist/ro-RO.module.js +0 -10
- package/dist/ro-RO.module.js.map +0 -1
- package/dist/ru-RU.main.js +0 -8
- package/dist/ru-RU.main.js.map +0 -1
- package/dist/ru-RU.mjs +0 -10
- package/dist/ru-RU.module.js +0 -10
- package/dist/ru-RU.module.js.map +0 -1
- package/dist/sk-SK.main.js +0 -8
- package/dist/sk-SK.main.js.map +0 -1
- package/dist/sk-SK.mjs +0 -10
- package/dist/sk-SK.module.js +0 -10
- package/dist/sk-SK.module.js.map +0 -1
- package/dist/sl-SI.main.js +0 -8
- package/dist/sl-SI.main.js.map +0 -1
- package/dist/sl-SI.mjs +0 -10
- package/dist/sl-SI.module.js +0 -10
- package/dist/sl-SI.module.js.map +0 -1
- package/dist/sr-SP.main.js +0 -8
- package/dist/sr-SP.main.js.map +0 -1
- package/dist/sr-SP.mjs +0 -10
- package/dist/sr-SP.module.js +0 -10
- package/dist/sr-SP.module.js.map +0 -1
- package/dist/sv-SE.main.js +0 -8
- package/dist/sv-SE.main.js.map +0 -1
- package/dist/sv-SE.mjs +0 -10
- package/dist/sv-SE.module.js +0 -10
- package/dist/sv-SE.module.js.map +0 -1
- package/dist/tr-TR.main.js +0 -8
- package/dist/tr-TR.main.js.map +0 -1
- package/dist/tr-TR.mjs +0 -10
- package/dist/tr-TR.module.js +0 -10
- package/dist/tr-TR.module.js.map +0 -1
- package/dist/types.d.ts +0 -43
- package/dist/types.d.ts.map +0 -1
- package/dist/uk-UA.main.js +0 -8
- package/dist/uk-UA.main.js.map +0 -1
- package/dist/uk-UA.mjs +0 -10
- package/dist/uk-UA.module.js +0 -10
- package/dist/uk-UA.module.js.map +0 -1
- package/dist/zh-CN.main.js +0 -8
- package/dist/zh-CN.main.js.map +0 -1
- package/dist/zh-CN.mjs +0 -10
- package/dist/zh-CN.module.js +0 -10
- package/dist/zh-CN.module.js.map +0 -1
- package/dist/zh-TW.main.js +0 -8
- package/dist/zh-TW.main.js.map +0 -1
- package/dist/zh-TW.mjs +0 -10
- package/dist/zh-TW.module.js +0 -10
- package/dist/zh-TW.module.js.map +0 -1
- package/src/ActionMenu.tsx +0 -58
- package/src/ContextualHelpTrigger.tsx +0 -194
- package/src/Menu.tsx +0 -228
- package/src/MenuItem.tsx +0 -159
- package/src/MenuSection.tsx +0 -100
- package/src/MenuTrigger.tsx +0 -125
- package/src/SubmenuTrigger.tsx +0 -154
- package/src/context.ts +0 -63
- package/src/overlays.css +0 -32
- package/src/useCloseOnScroll.ts +0 -65
package/dist/MenuTrigger.mjs
DELETED
|
@@ -1,123 +0,0 @@
|
|
|
1
|
-
import {MenuContext as $d94604d52c3e3feb$export$c7e742effb1c51e2} from "./context.mjs";
|
|
2
|
-
import "./menu.2ec1fdaf.css";
|
|
3
|
-
import $5R0iF$menu_vars_cssmodulejs from "./menu_vars_css.mjs";
|
|
4
|
-
import {useDOMRef as $5R0iF$useDOMRef, useIsMobileDevice as $5R0iF$useIsMobileDevice, classNames as $5R0iF$classNames, unwrapDOMRef as $5R0iF$unwrapDOMRef, SlotProvider as $5R0iF$SlotProvider} from "@react-spectrum/utils";
|
|
5
|
-
import {Tray as $5R0iF$Tray, Popover as $5R0iF$Popover} from "@react-spectrum/overlays";
|
|
6
|
-
import {useInteractOutside as $5R0iF$useInteractOutside, PressResponder as $5R0iF$PressResponder} from "@react-aria/interactions";
|
|
7
|
-
import $5R0iF$react, {forwardRef as $5R0iF$forwardRef, useRef as $5R0iF$useRef, Fragment as $5R0iF$Fragment} from "react";
|
|
8
|
-
import {useMenuTrigger as $5R0iF$useMenuTrigger} from "@react-aria/menu";
|
|
9
|
-
import {useMenuTriggerState as $5R0iF$useMenuTriggerState} from "@react-stately/menu";
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
function $parcel$interopDefault(a) {
|
|
13
|
-
return a && a.__esModule ? a.default : a;
|
|
14
|
-
}
|
|
15
|
-
/*
|
|
16
|
-
* Copyright 2020 Adobe. All rights reserved.
|
|
17
|
-
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
18
|
-
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
19
|
-
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
20
|
-
*
|
|
21
|
-
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
22
|
-
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
23
|
-
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
24
|
-
* governing permissions and limitations under the License.
|
|
25
|
-
*/
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
const $aa0b855f135b86e3$export$27d2ad3c5815583e = /*#__PURE__*/ (0, $5R0iF$forwardRef)(function MenuTrigger(props, ref) {
|
|
34
|
-
let triggerRef = (0, $5R0iF$useRef)(null);
|
|
35
|
-
let domRef = (0, $5R0iF$useDOMRef)(ref);
|
|
36
|
-
let menuTriggerRef = domRef || triggerRef;
|
|
37
|
-
let menuRef = (0, $5R0iF$useRef)(null);
|
|
38
|
-
let { children: children, align: align = 'start', shouldFlip: shouldFlip = true, direction: direction = 'bottom', closeOnSelect: closeOnSelect, trigger: trigger = 'press' } = props;
|
|
39
|
-
let [menuTrigger, menu] = (0, $5R0iF$react).Children.toArray(children);
|
|
40
|
-
let state = (0, $5R0iF$useMenuTriggerState)(props);
|
|
41
|
-
let { menuTriggerProps: menuTriggerProps, menuProps: menuProps } = (0, $5R0iF$useMenuTrigger)({
|
|
42
|
-
trigger: trigger
|
|
43
|
-
}, state, menuTriggerRef);
|
|
44
|
-
let initialPlacement;
|
|
45
|
-
switch(direction){
|
|
46
|
-
case 'left':
|
|
47
|
-
case 'right':
|
|
48
|
-
case 'start':
|
|
49
|
-
case 'end':
|
|
50
|
-
initialPlacement = `${direction} ${align === 'end' ? 'bottom' : 'top'}`;
|
|
51
|
-
break;
|
|
52
|
-
case 'bottom':
|
|
53
|
-
case 'top':
|
|
54
|
-
default:
|
|
55
|
-
initialPlacement = `${direction} ${align}`;
|
|
56
|
-
}
|
|
57
|
-
let isMobile = (0, $5R0iF$useIsMobileDevice)();
|
|
58
|
-
let menuContext = {
|
|
59
|
-
...menuProps,
|
|
60
|
-
ref: menuRef,
|
|
61
|
-
onClose: state.close,
|
|
62
|
-
closeOnSelect: closeOnSelect,
|
|
63
|
-
autoFocus: state.focusStrategy || true,
|
|
64
|
-
UNSAFE_style: isMobile ? {
|
|
65
|
-
width: '100%',
|
|
66
|
-
maxHeight: 'inherit'
|
|
67
|
-
} : undefined,
|
|
68
|
-
UNSAFE_className: (0, $5R0iF$classNames)((0, ($parcel$interopDefault($5R0iF$menu_vars_cssmodulejs))), {
|
|
69
|
-
'spectrum-Menu-popover': !isMobile
|
|
70
|
-
}),
|
|
71
|
-
state: state
|
|
72
|
-
};
|
|
73
|
-
// Close when clicking outside the root menu when a submenu is open.
|
|
74
|
-
let rootOverlayRef = (0, $5R0iF$useRef)(null);
|
|
75
|
-
let rootOverlayDomRef = (0, $5R0iF$unwrapDOMRef)(rootOverlayRef);
|
|
76
|
-
(0, $5R0iF$useInteractOutside)({
|
|
77
|
-
ref: rootOverlayDomRef,
|
|
78
|
-
onInteractOutside: ()=>{
|
|
79
|
-
state === null || state === void 0 ? void 0 : state.close();
|
|
80
|
-
},
|
|
81
|
-
isDisabled: !state.isOpen || state.expandedKeysStack.length === 0
|
|
82
|
-
});
|
|
83
|
-
// On small screen devices, the menu is rendered in a tray, otherwise a popover.
|
|
84
|
-
let overlay;
|
|
85
|
-
if (isMobile) overlay = /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$Tray), {
|
|
86
|
-
state: state,
|
|
87
|
-
isFixedHeight: true,
|
|
88
|
-
ref: rootOverlayRef
|
|
89
|
-
}, menu);
|
|
90
|
-
else overlay = /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$Popover), {
|
|
91
|
-
ref: rootOverlayRef,
|
|
92
|
-
UNSAFE_style: {
|
|
93
|
-
clipPath: 'unset',
|
|
94
|
-
overflow: 'visible',
|
|
95
|
-
filter: 'unset',
|
|
96
|
-
borderWidth: '0px'
|
|
97
|
-
},
|
|
98
|
-
state: state,
|
|
99
|
-
triggerRef: menuTriggerRef,
|
|
100
|
-
scrollRef: menuRef,
|
|
101
|
-
placement: initialPlacement,
|
|
102
|
-
hideArrow: true,
|
|
103
|
-
shouldFlip: shouldFlip,
|
|
104
|
-
shouldContainFocus: true
|
|
105
|
-
}, menu);
|
|
106
|
-
return /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$Fragment), null, /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$SlotProvider), {
|
|
107
|
-
slots: {
|
|
108
|
-
actionButton: {
|
|
109
|
-
holdAffordance: trigger === 'longPress'
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
}, /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$PressResponder), {
|
|
113
|
-
...menuTriggerProps,
|
|
114
|
-
ref: menuTriggerRef,
|
|
115
|
-
isPressed: state.isOpen
|
|
116
|
-
}, menuTrigger)), /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $d94604d52c3e3feb$export$c7e742effb1c51e2).Provider, {
|
|
117
|
-
value: menuContext
|
|
118
|
-
}, overlay));
|
|
119
|
-
});
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
export {$aa0b855f135b86e3$export$27d2ad3c5815583e as MenuTrigger};
|
|
123
|
-
//# sourceMappingURL=MenuTrigger.module.js.map
|
|
@@ -1,123 +0,0 @@
|
|
|
1
|
-
import {MenuContext as $d94604d52c3e3feb$export$c7e742effb1c51e2} from "./context.module.js";
|
|
2
|
-
import "./menu.2ec1fdaf.css";
|
|
3
|
-
import $5R0iF$menu_vars_cssmodulejs from "./menu_vars_css.module.js";
|
|
4
|
-
import {useDOMRef as $5R0iF$useDOMRef, useIsMobileDevice as $5R0iF$useIsMobileDevice, classNames as $5R0iF$classNames, unwrapDOMRef as $5R0iF$unwrapDOMRef, SlotProvider as $5R0iF$SlotProvider} from "@react-spectrum/utils";
|
|
5
|
-
import {Tray as $5R0iF$Tray, Popover as $5R0iF$Popover} from "@react-spectrum/overlays";
|
|
6
|
-
import {useInteractOutside as $5R0iF$useInteractOutside, PressResponder as $5R0iF$PressResponder} from "@react-aria/interactions";
|
|
7
|
-
import $5R0iF$react, {forwardRef as $5R0iF$forwardRef, useRef as $5R0iF$useRef, Fragment as $5R0iF$Fragment} from "react";
|
|
8
|
-
import {useMenuTrigger as $5R0iF$useMenuTrigger} from "@react-aria/menu";
|
|
9
|
-
import {useMenuTriggerState as $5R0iF$useMenuTriggerState} from "@react-stately/menu";
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
function $parcel$interopDefault(a) {
|
|
13
|
-
return a && a.__esModule ? a.default : a;
|
|
14
|
-
}
|
|
15
|
-
/*
|
|
16
|
-
* Copyright 2020 Adobe. All rights reserved.
|
|
17
|
-
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
18
|
-
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
19
|
-
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
20
|
-
*
|
|
21
|
-
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
22
|
-
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
23
|
-
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
24
|
-
* governing permissions and limitations under the License.
|
|
25
|
-
*/
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
const $aa0b855f135b86e3$export$27d2ad3c5815583e = /*#__PURE__*/ (0, $5R0iF$forwardRef)(function MenuTrigger(props, ref) {
|
|
34
|
-
let triggerRef = (0, $5R0iF$useRef)(null);
|
|
35
|
-
let domRef = (0, $5R0iF$useDOMRef)(ref);
|
|
36
|
-
let menuTriggerRef = domRef || triggerRef;
|
|
37
|
-
let menuRef = (0, $5R0iF$useRef)(null);
|
|
38
|
-
let { children: children, align: align = 'start', shouldFlip: shouldFlip = true, direction: direction = 'bottom', closeOnSelect: closeOnSelect, trigger: trigger = 'press' } = props;
|
|
39
|
-
let [menuTrigger, menu] = (0, $5R0iF$react).Children.toArray(children);
|
|
40
|
-
let state = (0, $5R0iF$useMenuTriggerState)(props);
|
|
41
|
-
let { menuTriggerProps: menuTriggerProps, menuProps: menuProps } = (0, $5R0iF$useMenuTrigger)({
|
|
42
|
-
trigger: trigger
|
|
43
|
-
}, state, menuTriggerRef);
|
|
44
|
-
let initialPlacement;
|
|
45
|
-
switch(direction){
|
|
46
|
-
case 'left':
|
|
47
|
-
case 'right':
|
|
48
|
-
case 'start':
|
|
49
|
-
case 'end':
|
|
50
|
-
initialPlacement = `${direction} ${align === 'end' ? 'bottom' : 'top'}`;
|
|
51
|
-
break;
|
|
52
|
-
case 'bottom':
|
|
53
|
-
case 'top':
|
|
54
|
-
default:
|
|
55
|
-
initialPlacement = `${direction} ${align}`;
|
|
56
|
-
}
|
|
57
|
-
let isMobile = (0, $5R0iF$useIsMobileDevice)();
|
|
58
|
-
let menuContext = {
|
|
59
|
-
...menuProps,
|
|
60
|
-
ref: menuRef,
|
|
61
|
-
onClose: state.close,
|
|
62
|
-
closeOnSelect: closeOnSelect,
|
|
63
|
-
autoFocus: state.focusStrategy || true,
|
|
64
|
-
UNSAFE_style: isMobile ? {
|
|
65
|
-
width: '100%',
|
|
66
|
-
maxHeight: 'inherit'
|
|
67
|
-
} : undefined,
|
|
68
|
-
UNSAFE_className: (0, $5R0iF$classNames)((0, ($parcel$interopDefault($5R0iF$menu_vars_cssmodulejs))), {
|
|
69
|
-
'spectrum-Menu-popover': !isMobile
|
|
70
|
-
}),
|
|
71
|
-
state: state
|
|
72
|
-
};
|
|
73
|
-
// Close when clicking outside the root menu when a submenu is open.
|
|
74
|
-
let rootOverlayRef = (0, $5R0iF$useRef)(null);
|
|
75
|
-
let rootOverlayDomRef = (0, $5R0iF$unwrapDOMRef)(rootOverlayRef);
|
|
76
|
-
(0, $5R0iF$useInteractOutside)({
|
|
77
|
-
ref: rootOverlayDomRef,
|
|
78
|
-
onInteractOutside: ()=>{
|
|
79
|
-
state === null || state === void 0 ? void 0 : state.close();
|
|
80
|
-
},
|
|
81
|
-
isDisabled: !state.isOpen || state.expandedKeysStack.length === 0
|
|
82
|
-
});
|
|
83
|
-
// On small screen devices, the menu is rendered in a tray, otherwise a popover.
|
|
84
|
-
let overlay;
|
|
85
|
-
if (isMobile) overlay = /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$Tray), {
|
|
86
|
-
state: state,
|
|
87
|
-
isFixedHeight: true,
|
|
88
|
-
ref: rootOverlayRef
|
|
89
|
-
}, menu);
|
|
90
|
-
else overlay = /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$Popover), {
|
|
91
|
-
ref: rootOverlayRef,
|
|
92
|
-
UNSAFE_style: {
|
|
93
|
-
clipPath: 'unset',
|
|
94
|
-
overflow: 'visible',
|
|
95
|
-
filter: 'unset',
|
|
96
|
-
borderWidth: '0px'
|
|
97
|
-
},
|
|
98
|
-
state: state,
|
|
99
|
-
triggerRef: menuTriggerRef,
|
|
100
|
-
scrollRef: menuRef,
|
|
101
|
-
placement: initialPlacement,
|
|
102
|
-
hideArrow: true,
|
|
103
|
-
shouldFlip: shouldFlip,
|
|
104
|
-
shouldContainFocus: true
|
|
105
|
-
}, menu);
|
|
106
|
-
return /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$Fragment), null, /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$SlotProvider), {
|
|
107
|
-
slots: {
|
|
108
|
-
actionButton: {
|
|
109
|
-
holdAffordance: trigger === 'longPress'
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
}, /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $5R0iF$PressResponder), {
|
|
113
|
-
...menuTriggerProps,
|
|
114
|
-
ref: menuTriggerRef,
|
|
115
|
-
isPressed: state.isOpen
|
|
116
|
-
}, menuTrigger)), /*#__PURE__*/ (0, $5R0iF$react).createElement((0, $d94604d52c3e3feb$export$c7e742effb1c51e2).Provider, {
|
|
117
|
-
value: menuContext
|
|
118
|
-
}, overlay));
|
|
119
|
-
});
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
export {$aa0b855f135b86e3$export$27d2ad3c5815583e as MenuTrigger};
|
|
123
|
-
//# sourceMappingURL=MenuTrigger.module.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AAkBM,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAA+B,EAAE,GAAwB;IAClH,IAAI,aAAa,CAAA,GAAA,aAAK,EAAe;IACrC,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,iBAAiB,UAAU;IAC/B,IAAI,UAAU,CAAA,GAAA,aAAK,EAAkB;IACrC,IAAI,YACF,QAAQ,SACR,QAAQ,qBACR,aAAa,iBACb,YAAY,yBACZ,aAAa,WACb,UAAU,SACX,GAAG;IAEJ,IAAI,CAAC,aAAa,KAAK,GAAG,CAAA,GAAA,YAAI,EAAE,QAAQ,CAAC,OAAO,CAAC;IACjD,IAAI,QAAQ,CAAA,GAAA,0BAAkB,EAAE;IAEhC,IAAI,oBAAC,gBAAgB,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;iBAAC;IAAO,GAAG,OAAO;IAErE,IAAI;IACJ,OAAQ;QACN,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;YACH,mBAAmB,GAAG,UAAU,CAAC,EAAE,UAAU,QAAQ,WAAW,OAAO;YACvE;QACF,KAAK;QACL,KAAK;QACL;YACE,mBAAmB,GAAG,UAAU,CAAC,EAAE,OAAO;IAC9C;IAEA,IAAI,WAAW,CAAA,GAAA,wBAAgB;IAC/B,IAAI,cAAc;QAChB,GAAG,SAAS;QACZ,KAAK;QACL,SAAS,MAAM,KAAK;uBACpB;QACA,WAAW,MAAM,aAAa,IAAI;QAClC,cAAc,WAAW;YACvB,OAAO;YACP,WAAW;QACb,IAAI;QACJ,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;YAAC,yBAAyB,CAAC;QAAQ;eACxE;IACF;IAEA,oEAAoE;IACpE,IAAI,iBAAiB,CAAA,GAAA,aAAK,EAAE;IAC5B,IAAI,oBAAoB,CAAA,GAAA,mBAAW,EAAE;IACrC,CAAA,GAAA,yBAAiB,EAAE;QACjB,KAAK;QACL,mBAAmB;YACjB,kBAAA,4BAAA,MAAO,KAAK;QACd;QACA,YAAY,CAAC,MAAM,MAAM,IAAI,MAAM,iBAAiB,CAAC,MAAM,KAAK;IAClE;IAEA,gFAAgF;IAChF,IAAI;IACJ,IAAI,UACF,wBACE,gCAAC,CAAA,GAAA,WAAG;QAAE,OAAO;QAAO,eAAA;QAAc,KAAK;OACpC;SAIL,wBACE,gCAAC,CAAA,GAAA,cAAM;QACL,KAAK;QACL,cAAc;YAAC,UAAU;YAAS,UAAU;YAAW,QAAQ;YAAS,aAAa;QAAK;QAC1F,OAAO;QACP,YAAY;QACZ,WAAW;QACX,WAAW;QACX,WAAA;QACA,YAAY;QACZ,oBAAA;OACC;IAKP,qBACE,gCAAC,CAAA,GAAA,eAAO,uBACN,gCAAC,CAAA,GAAA,mBAAW;QAAE,OAAO;YAAC,cAAc;gBAAC,gBAAgB,YAAY;YAAW;QAAC;qBAC3E,gCAAC,CAAA,GAAA,qBAAa;QAAG,GAAG,gBAAgB;QAAE,KAAK;QAAgB,WAAW,MAAM,MAAM;OAC/E,6BAGL,gCAAC,CAAA,GAAA,yCAAU,EAAE,QAAQ;QAAC,OAAO;OAC1B;AAIT","sources":["packages/@react-spectrum/menu/src/MenuTrigger.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 {classNames, SlotProvider, unwrapDOMRef, useDOMRef, useIsMobileDevice} from '@react-spectrum/utils';\nimport {DOMRef} from '@react-types/shared';\nimport {MenuContext} from './context';\nimport {Placement} from '@react-types/overlays';\nimport {Popover, Tray} from '@react-spectrum/overlays';\nimport {PressResponder, useInteractOutside} from '@react-aria/interactions';\nimport React, {forwardRef, Fragment, useRef} from 'react';\nimport {SpectrumMenuTriggerProps} from '@react-types/menu';\nimport styles from '@adobe/spectrum-css-temp/components/menu/vars.css';\nimport {useMenuTrigger} from '@react-aria/menu';\nimport {useMenuTriggerState} from '@react-stately/menu';\n\n/**\n * The MenuTrigger serves as a wrapper around a Menu and its associated trigger,\n * linking the Menu's open state with the trigger's press state.\n */\nexport const MenuTrigger = forwardRef(function MenuTrigger(props: SpectrumMenuTriggerProps, ref: DOMRef<HTMLElement>) {\n let triggerRef = useRef<HTMLElement>(null);\n let domRef = useDOMRef(ref);\n let menuTriggerRef = domRef || triggerRef;\n let menuRef = useRef<HTMLDivElement>(null);\n let {\n children,\n align = 'start',\n shouldFlip = true,\n direction = 'bottom',\n closeOnSelect,\n trigger = 'press'\n } = props;\n\n let [menuTrigger, menu] = React.Children.toArray(children);\n let state = useMenuTriggerState(props);\n\n let {menuTriggerProps, menuProps} = useMenuTrigger({trigger}, state, menuTriggerRef);\n\n let initialPlacement: Placement;\n switch (direction) {\n case 'left':\n case 'right':\n case 'start':\n case 'end':\n initialPlacement = `${direction} ${align === 'end' ? 'bottom' : 'top'}` as Placement;\n break;\n case 'bottom':\n case 'top':\n default:\n initialPlacement = `${direction} ${align}` as Placement;\n }\n\n let isMobile = useIsMobileDevice();\n let menuContext = {\n ...menuProps,\n ref: menuRef,\n onClose: state.close,\n closeOnSelect,\n autoFocus: state.focusStrategy || true,\n UNSAFE_style: isMobile ? {\n width: '100%',\n maxHeight: 'inherit'\n } : undefined,\n UNSAFE_className: classNames(styles, {'spectrum-Menu-popover': !isMobile}),\n state\n };\n\n // Close when clicking outside the root menu when a submenu is open.\n let rootOverlayRef = useRef(null);\n let rootOverlayDomRef = unwrapDOMRef(rootOverlayRef);\n useInteractOutside({\n ref: rootOverlayDomRef,\n onInteractOutside: () => {\n state?.close();\n },\n isDisabled: !state.isOpen || state.expandedKeysStack.length === 0\n });\n\n // On small screen devices, the menu is rendered in a tray, otherwise a popover.\n let overlay;\n if (isMobile) {\n overlay = (\n <Tray state={state} isFixedHeight ref={rootOverlayRef}>\n {menu}\n </Tray>\n );\n } else {\n overlay = (\n <Popover\n ref={rootOverlayRef}\n UNSAFE_style={{clipPath: 'unset', overflow: 'visible', filter: 'unset', borderWidth: '0px'}}\n state={state}\n triggerRef={menuTriggerRef}\n scrollRef={menuRef}\n placement={initialPlacement}\n hideArrow\n shouldFlip={shouldFlip}\n shouldContainFocus>\n {menu}\n </Popover>\n );\n }\n\n return (\n <Fragment>\n <SlotProvider slots={{actionButton: {holdAffordance: trigger === 'longPress'}}}>\n <PressResponder {...menuTriggerProps} ref={menuTriggerRef} isPressed={state.isOpen}>\n {menuTrigger}\n </PressResponder>\n </SlotProvider>\n <MenuContext.Provider value={menuContext}>\n {overlay}\n </MenuContext.Provider>\n </Fragment>\n );\n});\n"],"names":[],"version":3,"file":"MenuTrigger.module.js.map"}
|
|
@@ -1,154 +0,0 @@
|
|
|
1
|
-
var $cac834c4bc0a51d3$exports = require("./context.main.js");
|
|
2
|
-
require("./menu.2ec1fdaf.css");
|
|
3
|
-
var $3deee0fd2b46e64f$exports = require("./menu_vars_css.main.js");
|
|
4
|
-
var $esjnM$reactspectrumutils = require("@react-spectrum/utils");
|
|
5
|
-
var $esjnM$reactariautils = require("@react-aria/utils");
|
|
6
|
-
var $esjnM$reactspectrumoverlays = require("@react-spectrum/overlays");
|
|
7
|
-
var $esjnM$react = require("react");
|
|
8
|
-
var $esjnM$reactdom = require("react-dom");
|
|
9
|
-
var $esjnM$reactariai18n = require("@react-aria/i18n");
|
|
10
|
-
var $esjnM$reactariamenu = require("@react-aria/menu");
|
|
11
|
-
var $esjnM$reactstatelymenu = require("@react-stately/menu");
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
function $parcel$interopDefault(a) {
|
|
15
|
-
return a && a.__esModule ? a.default : a;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
function $parcel$export(e, n, v, s) {
|
|
19
|
-
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
$parcel$export(module.exports, "SubmenuTrigger", () => $86ed235c4695ff3f$export$ecabc99eeffab7ca);
|
|
23
|
-
/*
|
|
24
|
-
* Copyright 2020 Adobe. All rights reserved.
|
|
25
|
-
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
26
|
-
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
27
|
-
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
28
|
-
*
|
|
29
|
-
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
30
|
-
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
31
|
-
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
32
|
-
* governing permissions and limitations under the License.
|
|
33
|
-
*/
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
function $86ed235c4695ff3f$var$SubmenuTrigger(props) {
|
|
44
|
-
let triggerRef = (0, $esjnM$react.useRef)(null);
|
|
45
|
-
let { children: children, targetKey: targetKey } = props;
|
|
46
|
-
let [menuTrigger, menu] = (0, ($parcel$interopDefault($esjnM$react))).Children.toArray(children);
|
|
47
|
-
let { popoverContainer: popoverContainer, trayContainerRef: trayContainerRef, menu: parentMenuRef, submenu: menuRef, rootMenuTriggerState: rootMenuTriggerState } = (0, $cac834c4bc0a51d3$exports.useMenuStateContext)();
|
|
48
|
-
let submenuTriggerState = (0, $esjnM$reactstatelymenu.useSubmenuTriggerState)({
|
|
49
|
-
triggerKey: targetKey
|
|
50
|
-
}, rootMenuTriggerState);
|
|
51
|
-
let { submenuTriggerProps: submenuTriggerProps, submenuProps: submenuProps, popoverProps: popoverProps } = (0, $esjnM$reactariamenu.useSubmenuTrigger)({
|
|
52
|
-
parentMenuRef: parentMenuRef,
|
|
53
|
-
submenuRef: menuRef
|
|
54
|
-
}, submenuTriggerState, triggerRef);
|
|
55
|
-
let isMobile = (0, $esjnM$reactspectrumutils.useIsMobileDevice)();
|
|
56
|
-
let onBackButtonPress = ()=>{
|
|
57
|
-
submenuTriggerState.close();
|
|
58
|
-
if (parentMenuRef.current && !(0, $esjnM$reactariautils.isFocusWithin)(parentMenuRef.current)) parentMenuRef.current.focus();
|
|
59
|
-
};
|
|
60
|
-
let { direction: direction } = (0, $esjnM$reactariai18n.useLocale)();
|
|
61
|
-
let mobileSubmenuKeyDown = (e)=>{
|
|
62
|
-
switch(e.key){
|
|
63
|
-
case 'ArrowLeft':
|
|
64
|
-
var _triggerRef_current;
|
|
65
|
-
if (direction === 'ltr') (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();
|
|
66
|
-
break;
|
|
67
|
-
case 'ArrowRight':
|
|
68
|
-
var _triggerRef_current1;
|
|
69
|
-
if (direction === 'rtl') (_triggerRef_current1 = triggerRef.current) === null || _triggerRef_current1 === void 0 ? void 0 : _triggerRef_current1.focus();
|
|
70
|
-
break;
|
|
71
|
-
}
|
|
72
|
-
};
|
|
73
|
-
let overlay;
|
|
74
|
-
if (isMobile) {
|
|
75
|
-
var _submenuProps;
|
|
76
|
-
delete submenuTriggerProps.onBlur;
|
|
77
|
-
delete submenuTriggerProps.onHoverChange;
|
|
78
|
-
var _autoFocus;
|
|
79
|
-
(_autoFocus = (_submenuProps = submenuProps).autoFocus) !== null && _autoFocus !== void 0 ? _autoFocus : _submenuProps.autoFocus = true;
|
|
80
|
-
if (trayContainerRef.current && submenuTriggerState.isOpen) overlay = /*#__PURE__*/ (0, ($parcel$interopDefault($esjnM$reactdom))).createPortal(menu, trayContainerRef.current);
|
|
81
|
-
} else {
|
|
82
|
-
let onDismissButtonPress = ()=>{
|
|
83
|
-
var _parentMenuRef_current;
|
|
84
|
-
submenuTriggerState.close();
|
|
85
|
-
(_parentMenuRef_current = parentMenuRef.current) === null || _parentMenuRef_current === void 0 ? void 0 : _parentMenuRef_current.focus();
|
|
86
|
-
};
|
|
87
|
-
overlay = /*#__PURE__*/ (0, ($parcel$interopDefault($esjnM$react))).createElement((0, $esjnM$reactspectrumoverlays.Popover), {
|
|
88
|
-
...popoverProps,
|
|
89
|
-
onDismissButtonPress: onDismissButtonPress,
|
|
90
|
-
UNSAFE_className: (0, $esjnM$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Submenu-popover'),
|
|
91
|
-
container: popoverContainer,
|
|
92
|
-
containerPadding: 0,
|
|
93
|
-
enableBothDismissButtons: true,
|
|
94
|
-
UNSAFE_style: {
|
|
95
|
-
clipPath: 'unset',
|
|
96
|
-
overflow: 'visible',
|
|
97
|
-
borderWidth: '0px'
|
|
98
|
-
},
|
|
99
|
-
state: submenuTriggerState,
|
|
100
|
-
triggerRef: triggerRef,
|
|
101
|
-
scrollRef: menuRef,
|
|
102
|
-
placement: "end top",
|
|
103
|
-
hideArrow: true
|
|
104
|
-
}, menu);
|
|
105
|
-
}
|
|
106
|
-
let menuContext = {
|
|
107
|
-
...(0, $esjnM$reactariautils.mergeProps)(submenuProps, {
|
|
108
|
-
ref: menuRef,
|
|
109
|
-
UNSAFE_style: isMobile ? {
|
|
110
|
-
width: '100%',
|
|
111
|
-
maxHeight: 'inherit'
|
|
112
|
-
} : undefined,
|
|
113
|
-
UNSAFE_className: (0, $esjnM$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), {
|
|
114
|
-
'spectrum-Menu-popover': !isMobile
|
|
115
|
-
}),
|
|
116
|
-
...isMobile && {
|
|
117
|
-
onBackButtonPress: onBackButtonPress,
|
|
118
|
-
onKeyDown: mobileSubmenuKeyDown
|
|
119
|
-
}
|
|
120
|
-
})
|
|
121
|
-
};
|
|
122
|
-
return /*#__PURE__*/ (0, ($parcel$interopDefault($esjnM$react))).createElement((0, ($parcel$interopDefault($esjnM$react))).Fragment, null, /*#__PURE__*/ (0, ($parcel$interopDefault($esjnM$react))).createElement((0, $cac834c4bc0a51d3$exports.SubmenuTriggerContext).Provider, {
|
|
123
|
-
value: {
|
|
124
|
-
triggerRef: triggerRef,
|
|
125
|
-
...submenuTriggerProps
|
|
126
|
-
}
|
|
127
|
-
}, menuTrigger), /*#__PURE__*/ (0, ($parcel$interopDefault($esjnM$react))).createElement((0, $cac834c4bc0a51d3$exports.MenuContext).Provider, {
|
|
128
|
-
value: menuContext
|
|
129
|
-
}, overlay));
|
|
130
|
-
}
|
|
131
|
-
$86ed235c4695ff3f$var$SubmenuTrigger.getCollectionNode = function*(props) {
|
|
132
|
-
let childArray = [];
|
|
133
|
-
(0, ($parcel$interopDefault($esjnM$react))).Children.forEach(props.children, (child)=>{
|
|
134
|
-
if (/*#__PURE__*/ (0, ($parcel$interopDefault($esjnM$react))).isValidElement(child)) childArray.push(child);
|
|
135
|
-
});
|
|
136
|
-
let [trigger] = childArray;
|
|
137
|
-
let [, content] = props.children;
|
|
138
|
-
yield {
|
|
139
|
-
element: /*#__PURE__*/ (0, ($parcel$interopDefault($esjnM$react))).cloneElement(trigger, {
|
|
140
|
-
...trigger.props,
|
|
141
|
-
hasChildItems: true,
|
|
142
|
-
isTrigger: true
|
|
143
|
-
}),
|
|
144
|
-
wrapper: (element)=>/*#__PURE__*/ (0, ($parcel$interopDefault($esjnM$react))).createElement($86ed235c4695ff3f$var$SubmenuTrigger, {
|
|
145
|
-
key: element.key,
|
|
146
|
-
targetKey: element.key,
|
|
147
|
-
...props
|
|
148
|
-
}, element, content)
|
|
149
|
-
};
|
|
150
|
-
};
|
|
151
|
-
let $86ed235c4695ff3f$export$ecabc99eeffab7ca = $86ed235c4695ff3f$var$SubmenuTrigger;
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
//# sourceMappingURL=SubmenuTrigger.main.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/menu/src/SubmenuTrigger.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 {classNames, useIsMobileDevice} from '@react-spectrum/utils';\nimport {isFocusWithin, mergeProps} from '@react-aria/utils';\nimport {Key} from '@react-types/shared';\nimport {MenuContext, SubmenuTriggerContext, useMenuStateContext} from './context';\nimport {Popover} from '@react-spectrum/overlays';\nimport React, {type JSX, ReactElement, useRef} from 'react';\nimport ReactDOM from 'react-dom';\nimport styles from '@adobe/spectrum-css-temp/components/menu/vars.css';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSubmenuTrigger} from '@react-aria/menu';\nimport {useSubmenuTriggerState} from '@react-stately/menu';\n\ninterface SubmenuTriggerProps {\n /**\n * The contents of the SubmenuTrigger - an Item and a Menu.\n */\n children: ReactElement<any>[],\n targetKey: Key\n}\n\nexport interface SpectrumSubmenuTriggerProps extends Omit<SubmenuTriggerProps, 'targetKey'> {}\n\nfunction SubmenuTrigger(props: SubmenuTriggerProps) {\n let triggerRef = useRef<HTMLDivElement>(null);\n let {\n children,\n targetKey\n } = props;\n\n let [menuTrigger, menu] = React.Children.toArray(children);\n let {popoverContainer, trayContainerRef, menu: parentMenuRef, submenu: menuRef, rootMenuTriggerState} = useMenuStateContext()!;\n let submenuTriggerState = useSubmenuTriggerState({triggerKey: targetKey}, rootMenuTriggerState!);\n let {submenuTriggerProps, submenuProps, popoverProps} = useSubmenuTrigger({\n parentMenuRef,\n submenuRef: menuRef\n }, submenuTriggerState, triggerRef);\n let isMobile = useIsMobileDevice();\n let onBackButtonPress = () => {\n submenuTriggerState.close();\n if (parentMenuRef.current && !isFocusWithin(parentMenuRef.current)) {\n parentMenuRef.current.focus();\n }\n };\n\n let {direction} = useLocale();\n let mobileSubmenuKeyDown = (e: KeyboardEvent) => {\n switch (e.key) {\n case 'ArrowLeft':\n if (direction === 'ltr') {\n triggerRef.current?.focus();\n }\n break;\n case 'ArrowRight':\n if (direction === 'rtl') {\n triggerRef.current?.focus();\n }\n break;\n }\n };\n\n let overlay;\n\n if (isMobile) {\n delete submenuTriggerProps.onBlur;\n delete submenuTriggerProps.onHoverChange;\n submenuProps.autoFocus ??= true;\n if (trayContainerRef.current && submenuTriggerState.isOpen) {\n overlay = ReactDOM.createPortal(menu, trayContainerRef.current);\n }\n } else {\n let onDismissButtonPress = () => {\n submenuTriggerState.close();\n parentMenuRef.current?.focus();\n };\n\n overlay = (\n <Popover\n {...popoverProps}\n onDismissButtonPress={onDismissButtonPress}\n UNSAFE_className={classNames(styles, 'spectrum-Submenu-popover')}\n container={popoverContainer!}\n containerPadding={0}\n enableBothDismissButtons\n UNSAFE_style={{clipPath: 'unset', overflow: 'visible', borderWidth: '0px'}}\n state={submenuTriggerState}\n triggerRef={triggerRef}\n scrollRef={menuRef}\n placement=\"end top\"\n hideArrow>\n {menu}\n </Popover>\n );\n }\n\n let menuContext = {\n ...mergeProps(submenuProps, {\n ref: menuRef,\n UNSAFE_style: isMobile ? {\n width: '100%',\n maxHeight: 'inherit'\n } : undefined,\n UNSAFE_className: classNames(styles, {'spectrum-Menu-popover': !isMobile}),\n ...(isMobile && {\n onBackButtonPress,\n onKeyDown: mobileSubmenuKeyDown\n })\n })\n };\n\n return (\n <>\n <SubmenuTriggerContext.Provider value={{triggerRef, ...submenuTriggerProps}}>{menuTrigger}</SubmenuTriggerContext.Provider>\n <MenuContext.Provider value={menuContext}>\n {overlay}\n </MenuContext.Provider>\n </>\n );\n}\n\nSubmenuTrigger.getCollectionNode = function* (props: SpectrumSubmenuTriggerProps) {\n let childArray: ReactElement[] = [];\n React.Children.forEach(props.children, child => {\n if (React.isValidElement(child)) {\n childArray.push(child);\n }\n });\n let [trigger] = childArray;\n let [, content] = props.children as [ReactElement, ReactElement];\n\n yield {\n element: React.cloneElement(trigger, {...trigger.props as any, hasChildItems: true, isTrigger: true}),\n wrapper: (element) => (\n <SubmenuTrigger key={element.key} targetKey={element.key} {...props}>\n {element}\n {content}\n </SubmenuTrigger>\n )\n };\n};\n\nlet _SubmenuTrigger = SubmenuTrigger as unknown as (props: SpectrumSubmenuTriggerProps) => JSX.Element;\nexport {_SubmenuTrigger as SubmenuTrigger};\n"],"names":[],"version":3,"file":"SubmenuTrigger.main.js.map"}
|
package/dist/SubmenuTrigger.mjs
DELETED
|
@@ -1,149 +0,0 @@
|
|
|
1
|
-
import {MenuContext as $d94604d52c3e3feb$export$c7e742effb1c51e2, SubmenuTriggerContext as $d94604d52c3e3feb$export$8d97fe02339fc0e3, useMenuStateContext as $d94604d52c3e3feb$export$efa3856fc0e85e7f} from "./context.mjs";
|
|
2
|
-
import "./menu.2ec1fdaf.css";
|
|
3
|
-
import $byZ4r$menu_vars_cssmodulejs from "./menu_vars_css.mjs";
|
|
4
|
-
import {useIsMobileDevice as $byZ4r$useIsMobileDevice, classNames as $byZ4r$classNames} from "@react-spectrum/utils";
|
|
5
|
-
import {isFocusWithin as $byZ4r$isFocusWithin, mergeProps as $byZ4r$mergeProps} from "@react-aria/utils";
|
|
6
|
-
import {Popover as $byZ4r$Popover} from "@react-spectrum/overlays";
|
|
7
|
-
import $byZ4r$react, {useRef as $byZ4r$useRef} from "react";
|
|
8
|
-
import $byZ4r$reactdom from "react-dom";
|
|
9
|
-
import {useLocale as $byZ4r$useLocale} from "@react-aria/i18n";
|
|
10
|
-
import {useSubmenuTrigger as $byZ4r$useSubmenuTrigger} from "@react-aria/menu";
|
|
11
|
-
import {useSubmenuTriggerState as $byZ4r$useSubmenuTriggerState} from "@react-stately/menu";
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
function $parcel$interopDefault(a) {
|
|
15
|
-
return a && a.__esModule ? a.default : a;
|
|
16
|
-
}
|
|
17
|
-
/*
|
|
18
|
-
* Copyright 2020 Adobe. All rights reserved.
|
|
19
|
-
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
20
|
-
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
21
|
-
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
22
|
-
*
|
|
23
|
-
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
24
|
-
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
25
|
-
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
26
|
-
* governing permissions and limitations under the License.
|
|
27
|
-
*/
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
function $3f13e15cf95c3893$var$SubmenuTrigger(props) {
|
|
38
|
-
let triggerRef = (0, $byZ4r$useRef)(null);
|
|
39
|
-
let { children: children, targetKey: targetKey } = props;
|
|
40
|
-
let [menuTrigger, menu] = (0, $byZ4r$react).Children.toArray(children);
|
|
41
|
-
let { popoverContainer: popoverContainer, trayContainerRef: trayContainerRef, menu: parentMenuRef, submenu: menuRef, rootMenuTriggerState: rootMenuTriggerState } = (0, $d94604d52c3e3feb$export$efa3856fc0e85e7f)();
|
|
42
|
-
let submenuTriggerState = (0, $byZ4r$useSubmenuTriggerState)({
|
|
43
|
-
triggerKey: targetKey
|
|
44
|
-
}, rootMenuTriggerState);
|
|
45
|
-
let { submenuTriggerProps: submenuTriggerProps, submenuProps: submenuProps, popoverProps: popoverProps } = (0, $byZ4r$useSubmenuTrigger)({
|
|
46
|
-
parentMenuRef: parentMenuRef,
|
|
47
|
-
submenuRef: menuRef
|
|
48
|
-
}, submenuTriggerState, triggerRef);
|
|
49
|
-
let isMobile = (0, $byZ4r$useIsMobileDevice)();
|
|
50
|
-
let onBackButtonPress = ()=>{
|
|
51
|
-
submenuTriggerState.close();
|
|
52
|
-
if (parentMenuRef.current && !(0, $byZ4r$isFocusWithin)(parentMenuRef.current)) parentMenuRef.current.focus();
|
|
53
|
-
};
|
|
54
|
-
let { direction: direction } = (0, $byZ4r$useLocale)();
|
|
55
|
-
let mobileSubmenuKeyDown = (e)=>{
|
|
56
|
-
switch(e.key){
|
|
57
|
-
case 'ArrowLeft':
|
|
58
|
-
var _triggerRef_current;
|
|
59
|
-
if (direction === 'ltr') (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();
|
|
60
|
-
break;
|
|
61
|
-
case 'ArrowRight':
|
|
62
|
-
var _triggerRef_current1;
|
|
63
|
-
if (direction === 'rtl') (_triggerRef_current1 = triggerRef.current) === null || _triggerRef_current1 === void 0 ? void 0 : _triggerRef_current1.focus();
|
|
64
|
-
break;
|
|
65
|
-
}
|
|
66
|
-
};
|
|
67
|
-
let overlay;
|
|
68
|
-
if (isMobile) {
|
|
69
|
-
var _submenuProps;
|
|
70
|
-
delete submenuTriggerProps.onBlur;
|
|
71
|
-
delete submenuTriggerProps.onHoverChange;
|
|
72
|
-
var _autoFocus;
|
|
73
|
-
(_autoFocus = (_submenuProps = submenuProps).autoFocus) !== null && _autoFocus !== void 0 ? _autoFocus : _submenuProps.autoFocus = true;
|
|
74
|
-
if (trayContainerRef.current && submenuTriggerState.isOpen) overlay = /*#__PURE__*/ (0, $byZ4r$reactdom).createPortal(menu, trayContainerRef.current);
|
|
75
|
-
} else {
|
|
76
|
-
let onDismissButtonPress = ()=>{
|
|
77
|
-
var _parentMenuRef_current;
|
|
78
|
-
submenuTriggerState.close();
|
|
79
|
-
(_parentMenuRef_current = parentMenuRef.current) === null || _parentMenuRef_current === void 0 ? void 0 : _parentMenuRef_current.focus();
|
|
80
|
-
};
|
|
81
|
-
overlay = /*#__PURE__*/ (0, $byZ4r$react).createElement((0, $byZ4r$Popover), {
|
|
82
|
-
...popoverProps,
|
|
83
|
-
onDismissButtonPress: onDismissButtonPress,
|
|
84
|
-
UNSAFE_className: (0, $byZ4r$classNames)((0, ($parcel$interopDefault($byZ4r$menu_vars_cssmodulejs))), 'spectrum-Submenu-popover'),
|
|
85
|
-
container: popoverContainer,
|
|
86
|
-
containerPadding: 0,
|
|
87
|
-
enableBothDismissButtons: true,
|
|
88
|
-
UNSAFE_style: {
|
|
89
|
-
clipPath: 'unset',
|
|
90
|
-
overflow: 'visible',
|
|
91
|
-
borderWidth: '0px'
|
|
92
|
-
},
|
|
93
|
-
state: submenuTriggerState,
|
|
94
|
-
triggerRef: triggerRef,
|
|
95
|
-
scrollRef: menuRef,
|
|
96
|
-
placement: "end top",
|
|
97
|
-
hideArrow: true
|
|
98
|
-
}, menu);
|
|
99
|
-
}
|
|
100
|
-
let menuContext = {
|
|
101
|
-
...(0, $byZ4r$mergeProps)(submenuProps, {
|
|
102
|
-
ref: menuRef,
|
|
103
|
-
UNSAFE_style: isMobile ? {
|
|
104
|
-
width: '100%',
|
|
105
|
-
maxHeight: 'inherit'
|
|
106
|
-
} : undefined,
|
|
107
|
-
UNSAFE_className: (0, $byZ4r$classNames)((0, ($parcel$interopDefault($byZ4r$menu_vars_cssmodulejs))), {
|
|
108
|
-
'spectrum-Menu-popover': !isMobile
|
|
109
|
-
}),
|
|
110
|
-
...isMobile && {
|
|
111
|
-
onBackButtonPress: onBackButtonPress,
|
|
112
|
-
onKeyDown: mobileSubmenuKeyDown
|
|
113
|
-
}
|
|
114
|
-
})
|
|
115
|
-
};
|
|
116
|
-
return /*#__PURE__*/ (0, $byZ4r$react).createElement((0, $byZ4r$react).Fragment, null, /*#__PURE__*/ (0, $byZ4r$react).createElement((0, $d94604d52c3e3feb$export$8d97fe02339fc0e3).Provider, {
|
|
117
|
-
value: {
|
|
118
|
-
triggerRef: triggerRef,
|
|
119
|
-
...submenuTriggerProps
|
|
120
|
-
}
|
|
121
|
-
}, menuTrigger), /*#__PURE__*/ (0, $byZ4r$react).createElement((0, $d94604d52c3e3feb$export$c7e742effb1c51e2).Provider, {
|
|
122
|
-
value: menuContext
|
|
123
|
-
}, overlay));
|
|
124
|
-
}
|
|
125
|
-
$3f13e15cf95c3893$var$SubmenuTrigger.getCollectionNode = function*(props) {
|
|
126
|
-
let childArray = [];
|
|
127
|
-
(0, $byZ4r$react).Children.forEach(props.children, (child)=>{
|
|
128
|
-
if (/*#__PURE__*/ (0, $byZ4r$react).isValidElement(child)) childArray.push(child);
|
|
129
|
-
});
|
|
130
|
-
let [trigger] = childArray;
|
|
131
|
-
let [, content] = props.children;
|
|
132
|
-
yield {
|
|
133
|
-
element: /*#__PURE__*/ (0, $byZ4r$react).cloneElement(trigger, {
|
|
134
|
-
...trigger.props,
|
|
135
|
-
hasChildItems: true,
|
|
136
|
-
isTrigger: true
|
|
137
|
-
}),
|
|
138
|
-
wrapper: (element)=>/*#__PURE__*/ (0, $byZ4r$react).createElement($3f13e15cf95c3893$var$SubmenuTrigger, {
|
|
139
|
-
key: element.key,
|
|
140
|
-
targetKey: element.key,
|
|
141
|
-
...props
|
|
142
|
-
}, element, content)
|
|
143
|
-
};
|
|
144
|
-
};
|
|
145
|
-
let $3f13e15cf95c3893$export$ecabc99eeffab7ca = $3f13e15cf95c3893$var$SubmenuTrigger;
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
export {$3f13e15cf95c3893$export$ecabc99eeffab7ca as SubmenuTrigger};
|
|
149
|
-
//# sourceMappingURL=SubmenuTrigger.module.js.map
|