@react-aria/menu 3.3.1-nightly.3040 → 3.3.1-nightly.3064
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/main.js +207 -288
- package/dist/main.js.map +1 -1
- package/dist/module.js +194 -260
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +12 -12
package/dist/main.js
CHANGED
|
@@ -1,316 +1,235 @@
|
|
|
1
|
-
var
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
var {
|
|
12
|
-
useSelectableList,
|
|
13
|
-
useSelectableItem
|
|
14
|
-
} = require("@react-aria/selection");
|
|
15
|
-
|
|
16
|
-
var _babelRuntimeHelpersObjectWithoutPropertiesLoose = $parcel$interopDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
17
|
-
|
|
18
|
-
var {
|
|
19
|
-
useOverlayTrigger
|
|
20
|
-
} = require("@react-aria/overlays");
|
|
21
|
-
|
|
22
|
-
var {
|
|
23
|
-
useId,
|
|
24
|
-
filterDOMProps,
|
|
25
|
-
mergeProps,
|
|
26
|
-
useSlotId
|
|
27
|
-
} = require("@react-aria/utils");
|
|
28
|
-
|
|
29
|
-
var _babelRuntimeHelpersExtends = $parcel$interopDefault(require("@babel/runtime/helpers/extends"));
|
|
30
|
-
|
|
31
|
-
function $parcel$interopDefault(a) {
|
|
32
|
-
return a && a.__esModule ? a.default : a;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
/**
|
|
36
|
-
* Provides the behavior and accessibility implementation for a menu trigger.
|
|
37
|
-
* @param props - Props for the menu trigger.
|
|
38
|
-
* @param state - State for the menu trigger.
|
|
39
|
-
*/
|
|
40
|
-
function useMenuTrigger(props, state, ref) {
|
|
41
|
-
let {
|
|
42
|
-
type = 'menu',
|
|
43
|
-
isDisabled
|
|
44
|
-
} = props;
|
|
45
|
-
let menuTriggerId = useId();
|
|
46
|
-
let {
|
|
47
|
-
triggerProps,
|
|
48
|
-
overlayProps
|
|
49
|
-
} = useOverlayTrigger({
|
|
50
|
-
type
|
|
51
|
-
}, state, ref);
|
|
52
|
-
|
|
53
|
-
let onKeyDown = e => {
|
|
54
|
-
if (isDisabled) {
|
|
1
|
+
var $atA3c$reactariautils = require("@react-aria/utils");
|
|
2
|
+
var $atA3c$reactariaoverlays = require("@react-aria/overlays");
|
|
3
|
+
var $atA3c$reactariaselection = require("@react-aria/selection");
|
|
4
|
+
var $atA3c$reactstatelycollections = require("@react-stately/collections");
|
|
5
|
+
var $atA3c$reactariainteractions = require("@react-aria/interactions");
|
|
6
|
+
|
|
7
|
+
function $parcel$exportWildcard(dest, source) {
|
|
8
|
+
Object.keys(source).forEach(function(key) {
|
|
9
|
+
if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
|
|
55
10
|
return;
|
|
56
11
|
}
|
|
57
12
|
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
case ' ':
|
|
63
|
-
// Stop propagation, unless it would already be handled by useKeyboard.
|
|
64
|
-
if (!('continuePropagation' in e)) {
|
|
65
|
-
e.stopPropagation();
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
e.preventDefault();
|
|
69
|
-
state.toggle('first');
|
|
70
|
-
break;
|
|
71
|
-
|
|
72
|
-
case 'ArrowUp':
|
|
73
|
-
if (!('continuePropagation' in e)) {
|
|
74
|
-
e.stopPropagation();
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
e.preventDefault();
|
|
78
|
-
state.toggle('last');
|
|
79
|
-
break;
|
|
13
|
+
Object.defineProperty(dest, key, {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: function get() {
|
|
16
|
+
return source[key];
|
|
80
17
|
}
|
|
81
|
-
}
|
|
82
|
-
};
|
|
83
|
-
|
|
84
|
-
return {
|
|
85
|
-
menuTriggerProps: _babelRuntimeHelpersExtends({}, triggerProps, {
|
|
86
|
-
id: menuTriggerId,
|
|
18
|
+
});
|
|
19
|
+
});
|
|
87
20
|
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
21
|
+
return dest;
|
|
22
|
+
}
|
|
23
|
+
function $parcel$export(e, n, v, s) {
|
|
24
|
+
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
25
|
+
}
|
|
26
|
+
var $8fb8a322d465c713$exports = {};
|
|
27
|
+
|
|
28
|
+
$parcel$export($8fb8a322d465c713$exports, "useMenuTrigger", () => $8fb8a322d465c713$export$dc9c12ed27dd1b49);
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
function $8fb8a322d465c713$export$dc9c12ed27dd1b49(props, state, ref) {
|
|
32
|
+
let { type: type = 'menu' , isDisabled: isDisabled } = props;
|
|
33
|
+
let menuTriggerId = $atA3c$reactariautils.useId();
|
|
34
|
+
let { triggerProps: triggerProps , overlayProps: overlayProps } = $atA3c$reactariaoverlays.useOverlayTrigger({
|
|
35
|
+
type: type
|
|
36
|
+
}, state, ref);
|
|
37
|
+
let onKeyDown = (e)=>{
|
|
38
|
+
if (isDisabled) return;
|
|
39
|
+
if (ref && ref.current) switch(e.key){
|
|
40
|
+
case 'ArrowDown':
|
|
41
|
+
case 'Enter':
|
|
42
|
+
case ' ':
|
|
43
|
+
// Stop propagation, unless it would already be handled by useKeyboard.
|
|
44
|
+
if (!('continuePropagation' in e)) e.stopPropagation();
|
|
45
|
+
e.preventDefault();
|
|
46
|
+
state.toggle('first');
|
|
47
|
+
break;
|
|
48
|
+
case 'ArrowUp':
|
|
49
|
+
if (!('continuePropagation' in e)) e.stopPropagation();
|
|
50
|
+
e.preventDefault();
|
|
51
|
+
state.toggle('last');
|
|
52
|
+
break;
|
|
94
53
|
}
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
54
|
+
};
|
|
55
|
+
return {
|
|
56
|
+
menuTriggerProps: {
|
|
57
|
+
...triggerProps,
|
|
58
|
+
id: menuTriggerId,
|
|
59
|
+
onPressStart (e) {
|
|
60
|
+
// For consistency with native, open the menu on mouse/key down, but touch up.
|
|
61
|
+
if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) // If opened with a screen reader, auto focus the first item.
|
|
62
|
+
// Otherwise, the menu itself will be focused.
|
|
63
|
+
state.toggle(e.pointerType === 'virtual' ? 'first' : null);
|
|
64
|
+
},
|
|
65
|
+
onPress (e) {
|
|
66
|
+
if (e.pointerType === 'touch' && !isDisabled) state.toggle();
|
|
67
|
+
},
|
|
68
|
+
onKeyDown: onKeyDown
|
|
69
|
+
},
|
|
70
|
+
menuProps: {
|
|
71
|
+
...overlayProps,
|
|
72
|
+
'aria-labelledby': menuTriggerId
|
|
100
73
|
}
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
onKeyDown
|
|
104
|
-
}),
|
|
105
|
-
menuProps: _babelRuntimeHelpersExtends({}, overlayProps, {
|
|
106
|
-
'aria-labelledby': menuTriggerId
|
|
107
|
-
})
|
|
108
|
-
};
|
|
74
|
+
};
|
|
109
75
|
}
|
|
110
76
|
|
|
111
|
-
exports.useMenuTrigger = useMenuTrigger;
|
|
112
|
-
|
|
113
|
-
/**
|
|
114
|
-
* Provides the behavior and accessibility implementation for a menu component.
|
|
115
|
-
* A menu displays a list of actions or options that a user can choose.
|
|
116
|
-
* @param props - Props for the menu.
|
|
117
|
-
* @param state - State for the menu, as returned by `useListState`.
|
|
118
|
-
*/
|
|
119
|
-
function useMenu(props, state, ref) {
|
|
120
|
-
let {
|
|
121
|
-
shouldFocusWrap = true
|
|
122
|
-
} = props,
|
|
123
|
-
otherProps = _babelRuntimeHelpersObjectWithoutPropertiesLoose(props, ["shouldFocusWrap"]);
|
|
124
|
-
|
|
125
|
-
if (!props['aria-label'] && !props['aria-labelledby']) {
|
|
126
|
-
console.warn('An aria-label or aria-labelledby prop is required for accessibility.');
|
|
127
|
-
}
|
|
128
77
|
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
78
|
+
var $d6f07b39f4b1d905$exports = {};
|
|
79
|
+
|
|
80
|
+
$parcel$export($d6f07b39f4b1d905$exports, "useMenu", () => $d6f07b39f4b1d905$export$38eaa17faae8f579);
|
|
81
|
+
|
|
82
|
+
|
|
83
|
+
function $d6f07b39f4b1d905$export$38eaa17faae8f579(props, state, ref) {
|
|
84
|
+
let { shouldFocusWrap: shouldFocusWrap = true , ...otherProps } = props;
|
|
85
|
+
if (!props['aria-label'] && !props['aria-labelledby']) console.warn('An aria-label or aria-labelledby prop is required for accessibility.');
|
|
86
|
+
let domProps = $atA3c$reactariautils.filterDOMProps(props, {
|
|
87
|
+
labelable: true
|
|
88
|
+
});
|
|
89
|
+
let { listProps: listProps } = $atA3c$reactariaselection.useSelectableList({
|
|
90
|
+
...otherProps,
|
|
91
|
+
ref: ref,
|
|
92
|
+
selectionManager: state.selectionManager,
|
|
93
|
+
collection: state.collection,
|
|
94
|
+
disabledKeys: state.disabledKeys,
|
|
95
|
+
shouldFocusWrap: shouldFocusWrap
|
|
96
|
+
});
|
|
97
|
+
return {
|
|
98
|
+
menuProps: $atA3c$reactariautils.mergeProps(domProps, {
|
|
99
|
+
role: 'menu',
|
|
100
|
+
...listProps
|
|
101
|
+
})
|
|
102
|
+
};
|
|
146
103
|
}
|
|
147
104
|
|
|
148
|
-
exports.useMenu = useMenu;
|
|
149
105
|
|
|
150
|
-
|
|
151
|
-
* Provides the behavior and accessibility implementation for an item in a menu.
|
|
152
|
-
* See `useMenu` for more details about menus.
|
|
153
|
-
* @param props - Props for the item.
|
|
154
|
-
* @param state - State for the menu, as returned by `useTreeState`.
|
|
155
|
-
*/
|
|
156
|
-
function useMenuItem(props, state, ref) {
|
|
157
|
-
let {
|
|
158
|
-
isSelected,
|
|
159
|
-
isDisabled,
|
|
160
|
-
key,
|
|
161
|
-
onClose,
|
|
162
|
-
closeOnSelect,
|
|
163
|
-
isVirtualized,
|
|
164
|
-
onAction
|
|
165
|
-
} = props;
|
|
166
|
-
let role = 'menuitem';
|
|
106
|
+
var $dcac5248bec96ef5$exports = {};
|
|
167
107
|
|
|
168
|
-
|
|
169
|
-
role = 'menuitemradio';
|
|
170
|
-
} else if (state.selectionManager.selectionMode === 'multiple') {
|
|
171
|
-
role = 'menuitemcheckbox';
|
|
172
|
-
}
|
|
108
|
+
$parcel$export($dcac5248bec96ef5$exports, "useMenuItem", () => $dcac5248bec96ef5$export$9d32628fc2aea7da);
|
|
173
109
|
|
|
174
|
-
let labelId = useSlotId();
|
|
175
|
-
let descriptionId = useSlotId();
|
|
176
|
-
let keyboardId = useSlotId();
|
|
177
|
-
let ariaProps = {
|
|
178
|
-
'aria-disabled': isDisabled,
|
|
179
|
-
role,
|
|
180
|
-
'aria-label': props['aria-label'],
|
|
181
|
-
'aria-labelledby': labelId,
|
|
182
|
-
'aria-describedby': [descriptionId, keyboardId].filter(Boolean).join(' ') || undefined
|
|
183
|
-
};
|
|
184
110
|
|
|
185
|
-
if (state.selectionManager.selectionMode !== 'none') {
|
|
186
|
-
ariaProps['aria-checked'] = isSelected;
|
|
187
|
-
}
|
|
188
111
|
|
|
189
|
-
if (isVirtualized) {
|
|
190
|
-
ariaProps['aria-posinset'] = state.collection.getItem(key).index;
|
|
191
|
-
ariaProps['aria-setsize'] = getItemCount(state.collection);
|
|
192
|
-
}
|
|
193
112
|
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
if (
|
|
198
|
-
|
|
113
|
+
function $dcac5248bec96ef5$export$9d32628fc2aea7da(props, state, ref) {
|
|
114
|
+
let { isSelected: isSelected , isDisabled: isDisabled , key: key , onClose: onClose , closeOnSelect: closeOnSelect , isVirtualized: isVirtualized , onAction: onAction } = props;
|
|
115
|
+
let role = 'menuitem';
|
|
116
|
+
if (state.selectionManager.selectionMode === 'single') role = 'menuitemradio';
|
|
117
|
+
else if (state.selectionManager.selectionMode === 'multiple') role = 'menuitemcheckbox';
|
|
118
|
+
let labelId = $atA3c$reactariautils.useSlotId();
|
|
119
|
+
let descriptionId = $atA3c$reactariautils.useSlotId();
|
|
120
|
+
let keyboardId = $atA3c$reactariautils.useSlotId();
|
|
121
|
+
let ariaProps = {
|
|
122
|
+
'aria-disabled': isDisabled,
|
|
123
|
+
role: role,
|
|
124
|
+
'aria-label': props['aria-label'],
|
|
125
|
+
'aria-labelledby': labelId,
|
|
126
|
+
'aria-describedby': [
|
|
127
|
+
descriptionId,
|
|
128
|
+
keyboardId
|
|
129
|
+
].filter(Boolean).join(' ') || undefined
|
|
130
|
+
};
|
|
131
|
+
if (state.selectionManager.selectionMode !== 'none') ariaProps['aria-checked'] = isSelected;
|
|
132
|
+
if (isVirtualized) {
|
|
133
|
+
ariaProps['aria-posinset'] = state.collection.getItem(key).index;
|
|
134
|
+
ariaProps['aria-setsize'] = $atA3c$reactstatelycollections.getItemCount(state.collection);
|
|
199
135
|
}
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
if (
|
|
204
|
-
|
|
136
|
+
let onKeyDown = (e)=>{
|
|
137
|
+
// Ignore repeating events, which may have started on the menu trigger before moving
|
|
138
|
+
// focus to the menu item. We want to wait for a second complete key press sequence.
|
|
139
|
+
if (e.repeat) return;
|
|
140
|
+
switch(e.key){
|
|
141
|
+
case ' ':
|
|
142
|
+
if (!isDisabled && state.selectionManager.selectionMode === 'none' && closeOnSelect !== false && onClose) onClose();
|
|
143
|
+
break;
|
|
144
|
+
case 'Enter':
|
|
145
|
+
// The Enter key should always close on select, except if overridden.
|
|
146
|
+
if (!isDisabled && closeOnSelect !== false && onClose) onClose();
|
|
147
|
+
break;
|
|
205
148
|
}
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
if (
|
|
212
|
-
|
|
149
|
+
};
|
|
150
|
+
let onPressStart = (e)=>{
|
|
151
|
+
if (e.pointerType === 'keyboard' && onAction) onAction(key);
|
|
152
|
+
};
|
|
153
|
+
let onPressUp = (e)=>{
|
|
154
|
+
if (e.pointerType !== 'keyboard') {
|
|
155
|
+
if (onAction) onAction(key);
|
|
156
|
+
// Pressing a menu item should close by default in single selection mode but not multiple
|
|
157
|
+
// selection mode, except if overridden by the closeOnSelect prop.
|
|
158
|
+
if (onClose && (closeOnSelect ?? state.selectionManager.selectionMode !== 'multiple')) onClose();
|
|
213
159
|
}
|
|
160
|
+
};
|
|
161
|
+
let { itemProps: itemProps } = $atA3c$reactariaselection.useSelectableItem({
|
|
162
|
+
selectionManager: state.selectionManager,
|
|
163
|
+
key: key,
|
|
164
|
+
ref: ref,
|
|
165
|
+
shouldSelectOnPressUp: true
|
|
166
|
+
});
|
|
167
|
+
let { pressProps: pressProps } = $atA3c$reactariainteractions.usePress({
|
|
168
|
+
onPressStart: onPressStart,
|
|
169
|
+
onPressUp: onPressUp,
|
|
170
|
+
isDisabled: isDisabled
|
|
171
|
+
});
|
|
172
|
+
let { hoverProps: hoverProps } = $atA3c$reactariainteractions.useHover({
|
|
173
|
+
isDisabled: isDisabled,
|
|
174
|
+
onHoverStart () {
|
|
175
|
+
if (!$atA3c$reactariainteractions.isFocusVisible()) {
|
|
176
|
+
state.selectionManager.setFocused(true);
|
|
177
|
+
state.selectionManager.setFocusedKey(key);
|
|
178
|
+
}
|
|
179
|
+
}
|
|
180
|
+
});
|
|
181
|
+
return {
|
|
182
|
+
menuItemProps: {
|
|
183
|
+
...ariaProps,
|
|
184
|
+
...$atA3c$reactariautils.mergeProps(itemProps, pressProps, hoverProps, {
|
|
185
|
+
onKeyDown: onKeyDown
|
|
186
|
+
})
|
|
187
|
+
},
|
|
188
|
+
labelProps: {
|
|
189
|
+
id: labelId
|
|
190
|
+
},
|
|
191
|
+
descriptionProps: {
|
|
192
|
+
id: descriptionId
|
|
193
|
+
},
|
|
194
|
+
keyboardShortcutProps: {
|
|
195
|
+
id: keyboardId
|
|
196
|
+
}
|
|
197
|
+
};
|
|
198
|
+
}
|
|
214
199
|
|
|
215
|
-
break;
|
|
216
|
-
}
|
|
217
|
-
};
|
|
218
|
-
|
|
219
|
-
let onPressStart = e => {
|
|
220
|
-
if (e.pointerType === 'keyboard' && onAction) {
|
|
221
|
-
onAction(key);
|
|
222
|
-
}
|
|
223
|
-
};
|
|
224
|
-
|
|
225
|
-
let onPressUp = e => {
|
|
226
|
-
if (e.pointerType !== 'keyboard') {
|
|
227
|
-
if (onAction) {
|
|
228
|
-
onAction(key);
|
|
229
|
-
} // Pressing a menu item should close by default in single selection mode but not multiple
|
|
230
|
-
// selection mode, except if overridden by the closeOnSelect prop.
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
if (onClose && (closeOnSelect != null ? closeOnSelect : state.selectionManager.selectionMode !== 'multiple')) {
|
|
234
|
-
onClose();
|
|
235
|
-
}
|
|
236
|
-
}
|
|
237
|
-
};
|
|
238
|
-
|
|
239
|
-
let {
|
|
240
|
-
itemProps
|
|
241
|
-
} = useSelectableItem({
|
|
242
|
-
selectionManager: state.selectionManager,
|
|
243
|
-
key,
|
|
244
|
-
ref,
|
|
245
|
-
shouldSelectOnPressUp: true
|
|
246
|
-
});
|
|
247
|
-
let {
|
|
248
|
-
pressProps
|
|
249
|
-
} = usePress({
|
|
250
|
-
onPressStart,
|
|
251
|
-
onPressUp,
|
|
252
|
-
isDisabled
|
|
253
|
-
});
|
|
254
|
-
let {
|
|
255
|
-
hoverProps
|
|
256
|
-
} = useHover({
|
|
257
|
-
isDisabled,
|
|
258
|
-
|
|
259
|
-
onHoverStart() {
|
|
260
|
-
if (!isFocusVisible()) {
|
|
261
|
-
state.selectionManager.setFocused(true);
|
|
262
|
-
state.selectionManager.setFocusedKey(key);
|
|
263
|
-
}
|
|
264
|
-
}
|
|
265
200
|
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
201
|
+
var $5274ec7bf537d8ab$exports = {};
|
|
202
|
+
|
|
203
|
+
$parcel$export($5274ec7bf537d8ab$exports, "useMenuSection", () => $5274ec7bf537d8ab$export$73f7a44322579622);
|
|
204
|
+
|
|
205
|
+
function $5274ec7bf537d8ab$export$73f7a44322579622(props) {
|
|
206
|
+
let { heading: heading , 'aria-label': ariaLabel } = props;
|
|
207
|
+
let headingId = $atA3c$reactariautils.useId();
|
|
208
|
+
return {
|
|
209
|
+
itemProps: {
|
|
210
|
+
role: 'presentation'
|
|
211
|
+
},
|
|
212
|
+
headingProps: heading ? {
|
|
213
|
+
// Techincally, menus cannot contain headings according to ARIA.
|
|
214
|
+
// We hide the heading from assistive technology, and only use it
|
|
215
|
+
// as a label for the nested group.
|
|
216
|
+
id: headingId,
|
|
217
|
+
'aria-hidden': true
|
|
218
|
+
} : {
|
|
219
|
+
},
|
|
220
|
+
groupProps: {
|
|
221
|
+
role: 'group',
|
|
222
|
+
'aria-label': ariaLabel,
|
|
223
|
+
'aria-labelledby': heading ? headingId : undefined
|
|
224
|
+
}
|
|
225
|
+
};
|
|
281
226
|
}
|
|
282
227
|
|
|
283
|
-
exports.useMenuItem = useMenuItem;
|
|
284
228
|
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
function useMenuSection(props) {
|
|
291
|
-
let {
|
|
292
|
-
heading,
|
|
293
|
-
'aria-label': ariaLabel
|
|
294
|
-
} = props;
|
|
295
|
-
let headingId = useId();
|
|
296
|
-
return {
|
|
297
|
-
itemProps: {
|
|
298
|
-
role: 'presentation'
|
|
299
|
-
},
|
|
300
|
-
headingProps: heading ? {
|
|
301
|
-
// Techincally, menus cannot contain headings according to ARIA.
|
|
302
|
-
// We hide the heading from assistive technology, and only use it
|
|
303
|
-
// as a label for the nested group.
|
|
304
|
-
id: headingId,
|
|
305
|
-
'aria-hidden': true
|
|
306
|
-
} : {},
|
|
307
|
-
groupProps: {
|
|
308
|
-
role: 'group',
|
|
309
|
-
'aria-label': ariaLabel,
|
|
310
|
-
'aria-labelledby': heading ? headingId : undefined
|
|
311
|
-
}
|
|
312
|
-
};
|
|
313
|
-
}
|
|
229
|
+
$parcel$exportWildcard(module.exports, $8fb8a322d465c713$exports);
|
|
230
|
+
$parcel$exportWildcard(module.exports, $d6f07b39f4b1d905$exports);
|
|
231
|
+
$parcel$exportWildcard(module.exports, $dcac5248bec96ef5$exports);
|
|
232
|
+
$parcel$exportWildcard(module.exports, $5274ec7bf537d8ab$exports);
|
|
233
|
+
|
|
314
234
|
|
|
315
|
-
exports.useMenuSection = useMenuSection;
|
|
316
235
|
//# sourceMappingURL=main.js.map
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["./node_modules/@parcel/scope-hoisting/lib/helpers.js","./packages/@react-aria/menu/src/useMenuTrigger.ts","./packages/@react-aria/menu/src/useMenu.ts","./packages/@react-aria/menu/src/useMenuItem.ts","./packages/@react-aria/menu/src/useMenuSection.ts"],"sourcesContent":["function $parcel$interopDefault(a) {\n return a && a.__esModule ? a.default : a;\n}\n\nfunction $parcel$defineInteropFlag(a) {\n Object.defineProperty(a, '__esModule', {value: true});\n}\n\nfunction $parcel$exportWildcard(dest, source) {\n Object.keys(source).forEach(function(key) {\n if (key === 'default' || key === '__esModule') {\n return;\n }\n\n Object.defineProperty(dest, key, {\n enumerable: true,\n get: function get() {\n return source[key];\n },\n });\n });\n\n return dest;\n}\n\nfunction $parcel$missingModule(name) {\n var err = new Error(\"Cannot find module '\" + name + \"'\");\n err.code = 'MODULE_NOT_FOUND';\n throw err;\n}\n\nvar $parcel$global =\n typeof globalThis !== 'undefined'\n ? globalThis\n : typeof self !== 'undefined'\n ? self\n : typeof window !== 'undefined'\n ? window\n : typeof global !== 'undefined'\n ? global\n : {};\n","/*\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 {AriaButtonProps} from '@react-types/button';\nimport {HTMLAttributes, RefObject} from 'react';\nimport {MenuTriggerState} from '@react-stately/menu';\nimport {useId} from '@react-aria/utils';\nimport {useOverlayTrigger} from '@react-aria/overlays';\n\ninterface MenuTriggerAriaProps {\n /** The type of menu that the menu trigger opens. */\n type?: 'menu' | 'listbox',\n /** Whether menu trigger is disabled. */\n isDisabled?: boolean\n}\n\ninterface MenuTriggerAria {\n /** Props for the menu trigger element. */\n menuTriggerProps: AriaButtonProps,\n\n /** Props for the menu. */\n menuProps: HTMLAttributes<HTMLElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a menu trigger.\n * @param props - Props for the menu trigger.\n * @param state - State for the menu trigger.\n */\nexport function useMenuTrigger(props: MenuTriggerAriaProps, state: MenuTriggerState, ref: RefObject<HTMLElement>): MenuTriggerAria {\n let {\n type = 'menu' as MenuTriggerAriaProps['type'],\n isDisabled\n } = props;\n\n let menuTriggerId = useId();\n let {triggerProps, overlayProps} = useOverlayTrigger({type}, state, ref);\n\n let onKeyDown = (e) => {\n if (isDisabled) {\n return;\n }\n\n if (ref && ref.current) {\n switch (e.key) {\n case 'ArrowDown':\n case 'Enter':\n case ' ':\n // Stop propagation, unless it would already be handled by useKeyboard.\n if (!('continuePropagation' in e)) {\n e.stopPropagation();\n }\n e.preventDefault();\n state.toggle('first');\n break;\n case 'ArrowUp':\n if (!('continuePropagation' in e)) {\n e.stopPropagation();\n }\n e.preventDefault();\n state.toggle('last');\n break;\n }\n }\n };\n\n return {\n menuTriggerProps: {\n ...triggerProps,\n id: menuTriggerId,\n onPressStart(e) {\n // For consistency with native, open the menu on mouse/key down, but touch up.\n if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {\n // If opened with a screen reader, auto focus the first item.\n // Otherwise, the menu itself will be focused.\n state.toggle(e.pointerType === 'virtual' ? 'first' : null);\n }\n },\n onPress(e) {\n if (e.pointerType === 'touch' && !isDisabled) {\n state.toggle();\n }\n },\n onKeyDown\n },\n menuProps: {\n ...overlayProps,\n 'aria-labelledby': menuTriggerId\n }\n };\n}\n","/*\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 {AriaMenuProps} from '@react-types/menu';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {HTMLAttributes, RefObject} from 'react';\nimport {KeyboardDelegate} from '@react-types/shared';\nimport {TreeState} from '@react-stately/tree';\nimport {useSelectableList} from '@react-aria/selection';\n\ninterface MenuAria {\n /** Props for the menu element. */\n menuProps: HTMLAttributes<HTMLElement>\n}\n\ninterface AriaMenuOptions<T> extends AriaMenuProps<T> {\n /** Whether the menu uses virtual scrolling. */\n isVirtualized?: boolean,\n\n /**\n * An optional keyboard delegate implementation for type to select,\n * to override the default.\n */\n keyboardDelegate?: KeyboardDelegate\n}\n\n/**\n * Provides the behavior and accessibility implementation for a menu component.\n * A menu displays a list of actions or options that a user can choose.\n * @param props - Props for the menu.\n * @param state - State for the menu, as returned by `useListState`.\n */\nexport function useMenu<T>(props: AriaMenuOptions<T>, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuAria {\n let {\n shouldFocusWrap = true,\n ...otherProps\n } = props;\n\n if (!props['aria-label'] && !props['aria-labelledby']) {\n console.warn('An aria-label or aria-labelledby prop is required for accessibility.');\n }\n\n let domProps = filterDOMProps(props, {labelable: true});\n let {listProps} = useSelectableList({\n ...otherProps,\n ref,\n selectionManager: state.selectionManager,\n collection: state.collection,\n disabledKeys: state.disabledKeys,\n shouldFocusWrap\n });\n\n return {\n menuProps: mergeProps(domProps, {\n role: 'menu',\n ...listProps\n })\n };\n}\n","/*\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 {getItemCount} from '@react-stately/collections';\nimport {HTMLAttributes, Key, RefObject} from 'react';\nimport {isFocusVisible, useHover, usePress} from '@react-aria/interactions';\nimport {mergeProps, useSlotId} from '@react-aria/utils';\nimport {PressEvent} from '@react-types/shared';\nimport {TreeState} from '@react-stately/tree';\nimport {useSelectableItem} from '@react-aria/selection';\n\ninterface MenuItemAria {\n /** Props for the menu item element. */\n menuItemProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the main text element inside the menu item. */\n labelProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the description text element inside the menu item, if any. */\n descriptionProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the keyboard shortcut text element inside the item, if any. */\n keyboardShortcutProps: HTMLAttributes<HTMLElement>\n}\n\ninterface AriaMenuItemProps {\n /** Whether the menu item is disabled. */\n isDisabled?: boolean,\n\n /** Whether the menu item is selected. */\n isSelected?: boolean,\n\n /** A screen reader only label for the menu item. */\n 'aria-label'?: string,\n\n /** The unique key for the menu item. */\n key?: Key,\n\n /** Handler that is called when the menu should close after selecting an item. */\n onClose?: () => void,\n\n /**\n * Whether the menu should close when the menu item is selected.\n * @default true\n */\n closeOnSelect?: boolean,\n\n /** Whether the menu item is contained in a virtual scrolling menu. */\n isVirtualized?: boolean,\n\n /** Handler that is called when the user activates the item. */\n onAction?: (key: Key) => void\n}\n\n/**\n * Provides the behavior and accessibility implementation for an item in a menu.\n * See `useMenu` for more details about menus.\n * @param props - Props for the item.\n * @param state - State for the menu, as returned by `useTreeState`.\n */\nexport function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuItemAria {\n let {\n isSelected,\n isDisabled,\n key,\n onClose,\n closeOnSelect,\n isVirtualized,\n onAction\n } = props;\n\n let role = 'menuitem';\n if (state.selectionManager.selectionMode === 'single') {\n role = 'menuitemradio';\n } else if (state.selectionManager.selectionMode === 'multiple') {\n role = 'menuitemcheckbox';\n }\n\n let labelId = useSlotId();\n let descriptionId = useSlotId();\n let keyboardId = useSlotId();\n\n let ariaProps = {\n 'aria-disabled': isDisabled,\n role,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': labelId,\n 'aria-describedby': [descriptionId, keyboardId].filter(Boolean).join(' ') || undefined\n };\n\n if (state.selectionManager.selectionMode !== 'none') {\n ariaProps['aria-checked'] = isSelected;\n }\n\n if (isVirtualized) {\n ariaProps['aria-posinset'] = state.collection.getItem(key).index;\n ariaProps['aria-setsize'] = getItemCount(state.collection);\n }\n\n let onKeyDown = (e: KeyboardEvent) => {\n // Ignore repeating events, which may have started on the menu trigger before moving\n // focus to the menu item. We want to wait for a second complete key press sequence.\n if (e.repeat) {\n return;\n }\n\n switch (e.key) {\n case ' ':\n if (!isDisabled && state.selectionManager.selectionMode === 'none' && closeOnSelect !== false && onClose) {\n onClose();\n }\n break;\n case 'Enter':\n // The Enter key should always close on select, except if overridden.\n if (!isDisabled && closeOnSelect !== false && onClose) {\n onClose();\n }\n break;\n }\n };\n\n let onPressStart = (e: PressEvent) => {\n if (e.pointerType === 'keyboard' && onAction) {\n onAction(key);\n }\n };\n\n let onPressUp = (e: PressEvent) => {\n if (e.pointerType !== 'keyboard') {\n if (onAction) {\n onAction(key);\n }\n\n // Pressing a menu item should close by default in single selection mode but not multiple\n // selection mode, except if overridden by the closeOnSelect prop.\n if (onClose && (closeOnSelect ?? state.selectionManager.selectionMode !== 'multiple')) {\n onClose();\n }\n }\n };\n\n let {itemProps} = useSelectableItem({\n selectionManager: state.selectionManager,\n key,\n ref,\n shouldSelectOnPressUp: true\n });\n\n let {pressProps} = usePress({onPressStart, onPressUp, isDisabled});\n let {hoverProps} = useHover({\n isDisabled,\n onHoverStart() {\n if (!isFocusVisible()) {\n state.selectionManager.setFocused(true);\n state.selectionManager.setFocusedKey(key);\n }\n }\n });\n\n return {\n menuItemProps: {\n ...ariaProps,\n ...mergeProps(itemProps, pressProps, hoverProps, {onKeyDown})\n },\n labelProps: {\n id: labelId\n },\n descriptionProps: {\n id: descriptionId\n },\n keyboardShortcutProps: {\n id: keyboardId\n }\n };\n}\n","/*\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 {HTMLAttributes, ReactNode} from 'react';\nimport {useId} from '@react-aria/utils';\n\ninterface AriaMenuSectionProps {\n /** The heading for the section. */\n heading?: ReactNode,\n /** An accessibility label for the section. Required if `heading` is not present. */\n 'aria-label'?: string\n}\n\ninterface MenuSectionAria {\n /** Props for the wrapper list item. */\n itemProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the heading element, if any. */\n headingProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the group element. */\n groupProps: HTMLAttributes<HTMLElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a section in a menu.\n * See `useMenu` for more details about menus.\n * @param props - Props for the section.\n */\nexport function useMenuSection(props: AriaMenuSectionProps): MenuSectionAria {\n let {heading, 'aria-label': ariaLabel} = props;\n let headingId = useId();\n\n return {\n itemProps: {\n role: 'presentation'\n },\n headingProps: heading ? {\n // Techincally, menus cannot contain headings according to ARIA.\n // We hide the heading from assistive technology, and only use it\n // as a label for the nested group.\n id: headingId,\n 'aria-hidden': true\n } : {},\n groupProps: {\n role: 'group',\n 'aria-label': ariaLabel,\n 'aria-labelledby': heading ? headingId : undefined\n }\n };\n}\n"],"names":["$parcel$interopDefault","a","__esModule","default","useMenuTrigger","props","state","ref","type","isDisabled","menuTriggerId","useId","triggerProps","overlayProps","useOverlayTrigger","onKeyDown","e","current","key","stopPropagation","preventDefault","toggle","menuTriggerProps","id","onPressStart","pointerType","onPress","menuProps","useMenu","shouldFocusWrap","otherProps","console","warn","domProps","filterDOMProps","labelable","listProps","useSelectableList","selectionManager","collection","disabledKeys","mergeProps","role","useMenuItem","isSelected","onClose","closeOnSelect","isVirtualized","onAction","selectionMode","labelId","useSlotId","descriptionId","keyboardId","ariaProps","filter","Boolean","join","undefined","getItem","index","getItemCount","repeat","onPressUp","itemProps","useSelectableItem","shouldSelectOnPressUp","pressProps","usePress","hoverProps","useHover","onHoverStart","isFocusVisible","setFocused","setFocusedKey","menuItemProps","labelProps","descriptionProps","keyboardShortcutProps","useMenuSection","heading","ariaLabel","headingId","headingProps","groupProps"],"version":3,"file":"main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/menu/src/index.ts","packages/@react-aria/menu/src/useMenuTrigger.ts","packages/@react-aria/menu/src/useMenu.ts","packages/@react-aria/menu/src/useMenuItem.ts","packages/@react-aria/menu/src/useMenuSection.ts"],"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\nexport * from './useMenuTrigger';\nexport * from './useMenu';\nexport * from './useMenuItem';\nexport * from './useMenuSection';\n","/*\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 {AriaButtonProps} from '@react-types/button';\nimport {HTMLAttributes, RefObject} from 'react';\nimport {MenuTriggerState} from '@react-stately/menu';\nimport {useId} from '@react-aria/utils';\nimport {useOverlayTrigger} from '@react-aria/overlays';\n\ninterface MenuTriggerAriaProps {\n /** The type of menu that the menu trigger opens. */\n type?: 'menu' | 'listbox',\n /** Whether menu trigger is disabled. */\n isDisabled?: boolean\n}\n\ninterface MenuTriggerAria {\n /** Props for the menu trigger element. */\n menuTriggerProps: AriaButtonProps,\n\n /** Props for the menu. */\n menuProps: HTMLAttributes<HTMLElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a menu trigger.\n * @param props - Props for the menu trigger.\n * @param state - State for the menu trigger.\n */\nexport function useMenuTrigger(props: MenuTriggerAriaProps, state: MenuTriggerState, ref: RefObject<HTMLElement>): MenuTriggerAria {\n let {\n type = 'menu' as MenuTriggerAriaProps['type'],\n isDisabled\n } = props;\n\n let menuTriggerId = useId();\n let {triggerProps, overlayProps} = useOverlayTrigger({type}, state, ref);\n\n let onKeyDown = (e) => {\n if (isDisabled) {\n return;\n }\n\n if (ref && ref.current) {\n switch (e.key) {\n case 'ArrowDown':\n case 'Enter':\n case ' ':\n // Stop propagation, unless it would already be handled by useKeyboard.\n if (!('continuePropagation' in e)) {\n e.stopPropagation();\n }\n e.preventDefault();\n state.toggle('first');\n break;\n case 'ArrowUp':\n if (!('continuePropagation' in e)) {\n e.stopPropagation();\n }\n e.preventDefault();\n state.toggle('last');\n break;\n }\n }\n };\n\n return {\n menuTriggerProps: {\n ...triggerProps,\n id: menuTriggerId,\n onPressStart(e) {\n // For consistency with native, open the menu on mouse/key down, but touch up.\n if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {\n // If opened with a screen reader, auto focus the first item.\n // Otherwise, the menu itself will be focused.\n state.toggle(e.pointerType === 'virtual' ? 'first' : null);\n }\n },\n onPress(e) {\n if (e.pointerType === 'touch' && !isDisabled) {\n state.toggle();\n }\n },\n onKeyDown\n },\n menuProps: {\n ...overlayProps,\n 'aria-labelledby': menuTriggerId\n }\n };\n}\n","/*\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 {AriaMenuProps} from '@react-types/menu';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {HTMLAttributes, RefObject} from 'react';\nimport {KeyboardDelegate} from '@react-types/shared';\nimport {TreeState} from '@react-stately/tree';\nimport {useSelectableList} from '@react-aria/selection';\n\ninterface MenuAria {\n /** Props for the menu element. */\n menuProps: HTMLAttributes<HTMLElement>\n}\n\ninterface AriaMenuOptions<T> extends AriaMenuProps<T> {\n /** Whether the menu uses virtual scrolling. */\n isVirtualized?: boolean,\n\n /**\n * An optional keyboard delegate implementation for type to select,\n * to override the default.\n */\n keyboardDelegate?: KeyboardDelegate\n}\n\n/**\n * Provides the behavior and accessibility implementation for a menu component.\n * A menu displays a list of actions or options that a user can choose.\n * @param props - Props for the menu.\n * @param state - State for the menu, as returned by `useListState`.\n */\nexport function useMenu<T>(props: AriaMenuOptions<T>, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuAria {\n let {\n shouldFocusWrap = true,\n ...otherProps\n } = props;\n\n if (!props['aria-label'] && !props['aria-labelledby']) {\n console.warn('An aria-label or aria-labelledby prop is required for accessibility.');\n }\n\n let domProps = filterDOMProps(props, {labelable: true});\n let {listProps} = useSelectableList({\n ...otherProps,\n ref,\n selectionManager: state.selectionManager,\n collection: state.collection,\n disabledKeys: state.disabledKeys,\n shouldFocusWrap\n });\n\n return {\n menuProps: mergeProps(domProps, {\n role: 'menu',\n ...listProps\n })\n };\n}\n","/*\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 {getItemCount} from '@react-stately/collections';\nimport {HTMLAttributes, Key, RefObject} from 'react';\nimport {isFocusVisible, useHover, usePress} from '@react-aria/interactions';\nimport {mergeProps, useSlotId} from '@react-aria/utils';\nimport {PressEvent} from '@react-types/shared';\nimport {TreeState} from '@react-stately/tree';\nimport {useSelectableItem} from '@react-aria/selection';\n\ninterface MenuItemAria {\n /** Props for the menu item element. */\n menuItemProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the main text element inside the menu item. */\n labelProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the description text element inside the menu item, if any. */\n descriptionProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the keyboard shortcut text element inside the item, if any. */\n keyboardShortcutProps: HTMLAttributes<HTMLElement>\n}\n\ninterface AriaMenuItemProps {\n /** Whether the menu item is disabled. */\n isDisabled?: boolean,\n\n /** Whether the menu item is selected. */\n isSelected?: boolean,\n\n /** A screen reader only label for the menu item. */\n 'aria-label'?: string,\n\n /** The unique key for the menu item. */\n key?: Key,\n\n /** Handler that is called when the menu should close after selecting an item. */\n onClose?: () => void,\n\n /**\n * Whether the menu should close when the menu item is selected.\n * @default true\n */\n closeOnSelect?: boolean,\n\n /** Whether the menu item is contained in a virtual scrolling menu. */\n isVirtualized?: boolean,\n\n /** Handler that is called when the user activates the item. */\n onAction?: (key: Key) => void\n}\n\n/**\n * Provides the behavior and accessibility implementation for an item in a menu.\n * See `useMenu` for more details about menus.\n * @param props - Props for the item.\n * @param state - State for the menu, as returned by `useTreeState`.\n */\nexport function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuItemAria {\n let {\n isSelected,\n isDisabled,\n key,\n onClose,\n closeOnSelect,\n isVirtualized,\n onAction\n } = props;\n\n let role = 'menuitem';\n if (state.selectionManager.selectionMode === 'single') {\n role = 'menuitemradio';\n } else if (state.selectionManager.selectionMode === 'multiple') {\n role = 'menuitemcheckbox';\n }\n\n let labelId = useSlotId();\n let descriptionId = useSlotId();\n let keyboardId = useSlotId();\n\n let ariaProps = {\n 'aria-disabled': isDisabled,\n role,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': labelId,\n 'aria-describedby': [descriptionId, keyboardId].filter(Boolean).join(' ') || undefined\n };\n\n if (state.selectionManager.selectionMode !== 'none') {\n ariaProps['aria-checked'] = isSelected;\n }\n\n if (isVirtualized) {\n ariaProps['aria-posinset'] = state.collection.getItem(key).index;\n ariaProps['aria-setsize'] = getItemCount(state.collection);\n }\n\n let onKeyDown = (e: KeyboardEvent) => {\n // Ignore repeating events, which may have started on the menu trigger before moving\n // focus to the menu item. We want to wait for a second complete key press sequence.\n if (e.repeat) {\n return;\n }\n\n switch (e.key) {\n case ' ':\n if (!isDisabled && state.selectionManager.selectionMode === 'none' && closeOnSelect !== false && onClose) {\n onClose();\n }\n break;\n case 'Enter':\n // The Enter key should always close on select, except if overridden.\n if (!isDisabled && closeOnSelect !== false && onClose) {\n onClose();\n }\n break;\n }\n };\n\n let onPressStart = (e: PressEvent) => {\n if (e.pointerType === 'keyboard' && onAction) {\n onAction(key);\n }\n };\n\n let onPressUp = (e: PressEvent) => {\n if (e.pointerType !== 'keyboard') {\n if (onAction) {\n onAction(key);\n }\n\n // Pressing a menu item should close by default in single selection mode but not multiple\n // selection mode, except if overridden by the closeOnSelect prop.\n if (onClose && (closeOnSelect ?? state.selectionManager.selectionMode !== 'multiple')) {\n onClose();\n }\n }\n };\n\n let {itemProps} = useSelectableItem({\n selectionManager: state.selectionManager,\n key,\n ref,\n shouldSelectOnPressUp: true\n });\n\n let {pressProps} = usePress({onPressStart, onPressUp, isDisabled});\n let {hoverProps} = useHover({\n isDisabled,\n onHoverStart() {\n if (!isFocusVisible()) {\n state.selectionManager.setFocused(true);\n state.selectionManager.setFocusedKey(key);\n }\n }\n });\n\n return {\n menuItemProps: {\n ...ariaProps,\n ...mergeProps(itemProps, pressProps, hoverProps, {onKeyDown})\n },\n labelProps: {\n id: labelId\n },\n descriptionProps: {\n id: descriptionId\n },\n keyboardShortcutProps: {\n id: keyboardId\n }\n };\n}\n","/*\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 {HTMLAttributes, ReactNode} from 'react';\nimport {useId} from '@react-aria/utils';\n\ninterface AriaMenuSectionProps {\n /** The heading for the section. */\n heading?: ReactNode,\n /** An accessibility label for the section. Required if `heading` is not present. */\n 'aria-label'?: string\n}\n\ninterface MenuSectionAria {\n /** Props for the wrapper list item. */\n itemProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the heading element, if any. */\n headingProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the group element. */\n groupProps: HTMLAttributes<HTMLElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a section in a menu.\n * See `useMenu` for more details about menus.\n * @param props - Props for the section.\n */\nexport function useMenuSection(props: AriaMenuSectionProps): MenuSectionAria {\n let {heading, 'aria-label': ariaLabel} = props;\n let headingId = useId();\n\n return {\n itemProps: {\n role: 'presentation'\n },\n headingProps: heading ? {\n // Techincally, menus cannot contain headings according to ARIA.\n // We hide the heading from assistive technology, and only use it\n // as a label for the nested group.\n id: headingId,\n 'aria-hidden': true\n } : {},\n groupProps: {\n role: 'group',\n 'aria-label': ariaLabel,\n 'aria-labelledby': heading ? headingId : undefined\n }\n };\n}\n"],"names":[],"version":3,"file":"main.js.map"}
|
package/dist/module.js
CHANGED
|
@@ -1,282 +1,216 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import { useSelectableList, useSelectableItem } from "@react-aria/selection";
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
type = 'menu',
|
|
17
|
-
|
|
18
|
-
} =
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
// Stop propagation, unless it would already be handled by useKeyboard.
|
|
38
|
-
if (!('continuePropagation' in e)) {
|
|
39
|
-
e.stopPropagation();
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
e.preventDefault();
|
|
43
|
-
state.toggle('first');
|
|
44
|
-
break;
|
|
45
|
-
|
|
46
|
-
case 'ArrowUp':
|
|
47
|
-
if (!('continuePropagation' in e)) {
|
|
48
|
-
e.stopPropagation();
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
e.preventDefault();
|
|
52
|
-
state.toggle('last');
|
|
53
|
-
break;
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
};
|
|
57
|
-
|
|
58
|
-
return {
|
|
59
|
-
menuTriggerProps: _babelRuntimeHelpersEsmExtends({}, triggerProps, {
|
|
60
|
-
id: menuTriggerId,
|
|
61
|
-
|
|
62
|
-
onPressStart(e) {
|
|
63
|
-
// For consistency with native, open the menu on mouse/key down, but touch up.
|
|
64
|
-
if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {
|
|
65
|
-
// If opened with a screen reader, auto focus the first item.
|
|
66
|
-
// Otherwise, the menu itself will be focused.
|
|
67
|
-
state.toggle(e.pointerType === 'virtual' ? 'first' : null);
|
|
1
|
+
import {useId as $iLc8L$useId, filterDOMProps as $iLc8L$filterDOMProps, mergeProps as $iLc8L$mergeProps, useSlotId as $iLc8L$useSlotId} from "@react-aria/utils";
|
|
2
|
+
import {useOverlayTrigger as $iLc8L$useOverlayTrigger} from "@react-aria/overlays";
|
|
3
|
+
import {useSelectableList as $iLc8L$useSelectableList, useSelectableItem as $iLc8L$useSelectableItem} from "@react-aria/selection";
|
|
4
|
+
import {getItemCount as $iLc8L$getItemCount} from "@react-stately/collections";
|
|
5
|
+
import {usePress as $iLc8L$usePress, useHover as $iLc8L$useHover, isFocusVisible as $iLc8L$isFocusVisible} from "@react-aria/interactions";
|
|
6
|
+
|
|
7
|
+
function $parcel$export(e, n, v, s) {
|
|
8
|
+
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
9
|
+
}
|
|
10
|
+
var $67e957d00676eeca$exports = {};
|
|
11
|
+
|
|
12
|
+
$parcel$export($67e957d00676eeca$exports, "useMenuTrigger", () => $67e957d00676eeca$export$dc9c12ed27dd1b49);
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
function $67e957d00676eeca$export$dc9c12ed27dd1b49(props, state, ref) {
|
|
16
|
+
let { type: type = 'menu' , isDisabled: isDisabled } = props;
|
|
17
|
+
let menuTriggerId = $iLc8L$useId();
|
|
18
|
+
let { triggerProps: triggerProps , overlayProps: overlayProps } = $iLc8L$useOverlayTrigger({
|
|
19
|
+
type: type
|
|
20
|
+
}, state, ref);
|
|
21
|
+
let onKeyDown = (e)=>{
|
|
22
|
+
if (isDisabled) return;
|
|
23
|
+
if (ref && ref.current) switch(e.key){
|
|
24
|
+
case 'ArrowDown':
|
|
25
|
+
case 'Enter':
|
|
26
|
+
case ' ':
|
|
27
|
+
// Stop propagation, unless it would already be handled by useKeyboard.
|
|
28
|
+
if (!('continuePropagation' in e)) e.stopPropagation();
|
|
29
|
+
e.preventDefault();
|
|
30
|
+
state.toggle('first');
|
|
31
|
+
break;
|
|
32
|
+
case 'ArrowUp':
|
|
33
|
+
if (!('continuePropagation' in e)) e.stopPropagation();
|
|
34
|
+
e.preventDefault();
|
|
35
|
+
state.toggle('last');
|
|
36
|
+
break;
|
|
68
37
|
}
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
38
|
+
};
|
|
39
|
+
return {
|
|
40
|
+
menuTriggerProps: {
|
|
41
|
+
...triggerProps,
|
|
42
|
+
id: menuTriggerId,
|
|
43
|
+
onPressStart (e) {
|
|
44
|
+
// For consistency with native, open the menu on mouse/key down, but touch up.
|
|
45
|
+
if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) // If opened with a screen reader, auto focus the first item.
|
|
46
|
+
// Otherwise, the menu itself will be focused.
|
|
47
|
+
state.toggle(e.pointerType === 'virtual' ? 'first' : null);
|
|
48
|
+
},
|
|
49
|
+
onPress (e) {
|
|
50
|
+
if (e.pointerType === 'touch' && !isDisabled) state.toggle();
|
|
51
|
+
},
|
|
52
|
+
onKeyDown: onKeyDown
|
|
53
|
+
},
|
|
54
|
+
menuProps: {
|
|
55
|
+
...overlayProps,
|
|
56
|
+
'aria-labelledby': menuTriggerId
|
|
74
57
|
}
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
onKeyDown
|
|
78
|
-
}),
|
|
79
|
-
menuProps: _babelRuntimeHelpersEsmExtends({}, overlayProps, {
|
|
80
|
-
'aria-labelledby': menuTriggerId
|
|
81
|
-
})
|
|
82
|
-
};
|
|
58
|
+
};
|
|
83
59
|
}
|
|
84
60
|
|
|
85
|
-
/**
|
|
86
|
-
* Provides the behavior and accessibility implementation for a menu component.
|
|
87
|
-
* A menu displays a list of actions or options that a user can choose.
|
|
88
|
-
* @param props - Props for the menu.
|
|
89
|
-
* @param state - State for the menu, as returned by `useListState`.
|
|
90
|
-
*/
|
|
91
|
-
export function useMenu(props, state, ref) {
|
|
92
|
-
let {
|
|
93
|
-
shouldFocusWrap = true
|
|
94
|
-
} = props,
|
|
95
|
-
otherProps = _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose(props, ["shouldFocusWrap"]);
|
|
96
61
|
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
62
|
+
var $f8473e84867a4480$exports = {};
|
|
63
|
+
|
|
64
|
+
$parcel$export($f8473e84867a4480$exports, "useMenu", () => $f8473e84867a4480$export$38eaa17faae8f579);
|
|
65
|
+
|
|
66
|
+
|
|
67
|
+
function $f8473e84867a4480$export$38eaa17faae8f579(props, state, ref) {
|
|
68
|
+
let { shouldFocusWrap: shouldFocusWrap = true , ...otherProps } = props;
|
|
69
|
+
if (!props['aria-label'] && !props['aria-labelledby']) console.warn('An aria-label or aria-labelledby prop is required for accessibility.');
|
|
70
|
+
let domProps = $iLc8L$filterDOMProps(props, {
|
|
71
|
+
labelable: true
|
|
72
|
+
});
|
|
73
|
+
let { listProps: listProps } = $iLc8L$useSelectableList({
|
|
74
|
+
...otherProps,
|
|
75
|
+
ref: ref,
|
|
76
|
+
selectionManager: state.selectionManager,
|
|
77
|
+
collection: state.collection,
|
|
78
|
+
disabledKeys: state.disabledKeys,
|
|
79
|
+
shouldFocusWrap: shouldFocusWrap
|
|
80
|
+
});
|
|
81
|
+
return {
|
|
82
|
+
menuProps: $iLc8L$mergeProps(domProps, {
|
|
83
|
+
role: 'menu',
|
|
84
|
+
...listProps
|
|
85
|
+
})
|
|
86
|
+
};
|
|
118
87
|
}
|
|
119
88
|
|
|
120
|
-
/**
|
|
121
|
-
* Provides the behavior and accessibility implementation for an item in a menu.
|
|
122
|
-
* See `useMenu` for more details about menus.
|
|
123
|
-
* @param props - Props for the item.
|
|
124
|
-
* @param state - State for the menu, as returned by `useTreeState`.
|
|
125
|
-
*/
|
|
126
|
-
export function useMenuItem(props, state, ref) {
|
|
127
|
-
let {
|
|
128
|
-
isSelected,
|
|
129
|
-
isDisabled,
|
|
130
|
-
key,
|
|
131
|
-
onClose,
|
|
132
|
-
closeOnSelect,
|
|
133
|
-
isVirtualized,
|
|
134
|
-
onAction
|
|
135
|
-
} = props;
|
|
136
|
-
let role = 'menuitem';
|
|
137
89
|
|
|
138
|
-
|
|
139
|
-
role = 'menuitemradio';
|
|
140
|
-
} else if (state.selectionManager.selectionMode === 'multiple') {
|
|
141
|
-
role = 'menuitemcheckbox';
|
|
142
|
-
}
|
|
90
|
+
var $42974637716cfffc$exports = {};
|
|
143
91
|
|
|
144
|
-
|
|
145
|
-
let descriptionId = useSlotId();
|
|
146
|
-
let keyboardId = useSlotId();
|
|
147
|
-
let ariaProps = {
|
|
148
|
-
'aria-disabled': isDisabled,
|
|
149
|
-
role,
|
|
150
|
-
'aria-label': props['aria-label'],
|
|
151
|
-
'aria-labelledby': labelId,
|
|
152
|
-
'aria-describedby': [descriptionId, keyboardId].filter(Boolean).join(' ') || undefined
|
|
153
|
-
};
|
|
92
|
+
$parcel$export($42974637716cfffc$exports, "useMenuItem", () => $42974637716cfffc$export$9d32628fc2aea7da);
|
|
154
93
|
|
|
155
|
-
if (state.selectionManager.selectionMode !== 'none') {
|
|
156
|
-
ariaProps['aria-checked'] = isSelected;
|
|
157
|
-
}
|
|
158
94
|
|
|
159
|
-
if (isVirtualized) {
|
|
160
|
-
ariaProps['aria-posinset'] = state.collection.getItem(key).index;
|
|
161
|
-
ariaProps['aria-setsize'] = getItemCount(state.collection);
|
|
162
|
-
}
|
|
163
95
|
|
|
164
|
-
let onKeyDown = e => {
|
|
165
|
-
// Ignore repeating events, which may have started on the menu trigger before moving
|
|
166
|
-
// focus to the menu item. We want to wait for a second complete key press sequence.
|
|
167
|
-
if (e.repeat) {
|
|
168
|
-
return;
|
|
169
|
-
}
|
|
170
96
|
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
97
|
+
function $42974637716cfffc$export$9d32628fc2aea7da(props, state, ref) {
|
|
98
|
+
let { isSelected: isSelected , isDisabled: isDisabled , key: key , onClose: onClose , closeOnSelect: closeOnSelect , isVirtualized: isVirtualized , onAction: onAction } = props;
|
|
99
|
+
let role = 'menuitem';
|
|
100
|
+
if (state.selectionManager.selectionMode === 'single') role = 'menuitemradio';
|
|
101
|
+
else if (state.selectionManager.selectionMode === 'multiple') role = 'menuitemcheckbox';
|
|
102
|
+
let labelId = $iLc8L$useSlotId();
|
|
103
|
+
let descriptionId = $iLc8L$useSlotId();
|
|
104
|
+
let keyboardId = $iLc8L$useSlotId();
|
|
105
|
+
let ariaProps = {
|
|
106
|
+
'aria-disabled': isDisabled,
|
|
107
|
+
role: role,
|
|
108
|
+
'aria-label': props['aria-label'],
|
|
109
|
+
'aria-labelledby': labelId,
|
|
110
|
+
'aria-describedby': [
|
|
111
|
+
descriptionId,
|
|
112
|
+
keyboardId
|
|
113
|
+
].filter(Boolean).join(' ') || undefined
|
|
114
|
+
};
|
|
115
|
+
if (state.selectionManager.selectionMode !== 'none') ariaProps['aria-checked'] = isSelected;
|
|
116
|
+
if (isVirtualized) {
|
|
117
|
+
ariaProps['aria-posinset'] = state.collection.getItem(key).index;
|
|
118
|
+
ariaProps['aria-setsize'] = $iLc8L$getItemCount(state.collection);
|
|
119
|
+
}
|
|
120
|
+
let onKeyDown = (e)=>{
|
|
121
|
+
// Ignore repeating events, which may have started on the menu trigger before moving
|
|
122
|
+
// focus to the menu item. We want to wait for a second complete key press sequence.
|
|
123
|
+
if (e.repeat) return;
|
|
124
|
+
switch(e.key){
|
|
125
|
+
case ' ':
|
|
126
|
+
if (!isDisabled && state.selectionManager.selectionMode === 'none' && closeOnSelect !== false && onClose) onClose();
|
|
127
|
+
break;
|
|
128
|
+
case 'Enter':
|
|
129
|
+
// The Enter key should always close on select, except if overridden.
|
|
130
|
+
if (!isDisabled && closeOnSelect !== false && onClose) onClose();
|
|
131
|
+
break;
|
|
175
132
|
}
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
if (
|
|
182
|
-
|
|
133
|
+
};
|
|
134
|
+
let onPressStart = (e)=>{
|
|
135
|
+
if (e.pointerType === 'keyboard' && onAction) onAction(key);
|
|
136
|
+
};
|
|
137
|
+
let onPressUp = (e)=>{
|
|
138
|
+
if (e.pointerType !== 'keyboard') {
|
|
139
|
+
if (onAction) onAction(key);
|
|
140
|
+
// Pressing a menu item should close by default in single selection mode but not multiple
|
|
141
|
+
// selection mode, except if overridden by the closeOnSelect prop.
|
|
142
|
+
if (onClose && (closeOnSelect ?? state.selectionManager.selectionMode !== 'multiple')) onClose();
|
|
183
143
|
}
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
144
|
+
};
|
|
145
|
+
let { itemProps: itemProps } = $iLc8L$useSelectableItem({
|
|
146
|
+
selectionManager: state.selectionManager,
|
|
147
|
+
key: key,
|
|
148
|
+
ref: ref,
|
|
149
|
+
shouldSelectOnPressUp: true
|
|
150
|
+
});
|
|
151
|
+
let { pressProps: pressProps } = $iLc8L$usePress({
|
|
152
|
+
onPressStart: onPressStart,
|
|
153
|
+
onPressUp: onPressUp,
|
|
154
|
+
isDisabled: isDisabled
|
|
155
|
+
});
|
|
156
|
+
let { hoverProps: hoverProps } = $iLc8L$useHover({
|
|
157
|
+
isDisabled: isDisabled,
|
|
158
|
+
onHoverStart () {
|
|
159
|
+
if (!$iLc8L$isFocusVisible()) {
|
|
160
|
+
state.selectionManager.setFocused(true);
|
|
161
|
+
state.selectionManager.setFocusedKey(key);
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
});
|
|
165
|
+
return {
|
|
166
|
+
menuItemProps: {
|
|
167
|
+
...ariaProps,
|
|
168
|
+
...$iLc8L$mergeProps(itemProps, pressProps, hoverProps, {
|
|
169
|
+
onKeyDown: onKeyDown
|
|
170
|
+
})
|
|
171
|
+
},
|
|
172
|
+
labelProps: {
|
|
173
|
+
id: labelId
|
|
174
|
+
},
|
|
175
|
+
descriptionProps: {
|
|
176
|
+
id: descriptionId
|
|
177
|
+
},
|
|
178
|
+
keyboardShortcutProps: {
|
|
179
|
+
id: keyboardId
|
|
180
|
+
}
|
|
181
|
+
};
|
|
182
|
+
}
|
|
201
183
|
|
|
202
184
|
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
185
|
+
var $2256bedceb8433c1$exports = {};
|
|
186
|
+
|
|
187
|
+
$parcel$export($2256bedceb8433c1$exports, "useMenuSection", () => $2256bedceb8433c1$export$73f7a44322579622);
|
|
188
|
+
|
|
189
|
+
function $2256bedceb8433c1$export$73f7a44322579622(props) {
|
|
190
|
+
let { heading: heading , 'aria-label': ariaLabel } = props;
|
|
191
|
+
let headingId = $iLc8L$useId();
|
|
192
|
+
return {
|
|
193
|
+
itemProps: {
|
|
194
|
+
role: 'presentation'
|
|
195
|
+
},
|
|
196
|
+
headingProps: heading ? {
|
|
197
|
+
// Techincally, menus cannot contain headings according to ARIA.
|
|
198
|
+
// We hide the heading from assistive technology, and only use it
|
|
199
|
+
// as a label for the nested group.
|
|
200
|
+
id: headingId,
|
|
201
|
+
'aria-hidden': true
|
|
202
|
+
} : {
|
|
203
|
+
},
|
|
204
|
+
groupProps: {
|
|
205
|
+
role: 'group',
|
|
206
|
+
'aria-label': ariaLabel,
|
|
207
|
+
'aria-labelledby': heading ? headingId : undefined
|
|
208
|
+
}
|
|
209
|
+
};
|
|
210
|
+
}
|
|
208
211
|
|
|
209
|
-
let {
|
|
210
|
-
itemProps
|
|
211
|
-
} = useSelectableItem({
|
|
212
|
-
selectionManager: state.selectionManager,
|
|
213
|
-
key,
|
|
214
|
-
ref,
|
|
215
|
-
shouldSelectOnPressUp: true
|
|
216
|
-
});
|
|
217
|
-
let {
|
|
218
|
-
pressProps
|
|
219
|
-
} = usePress({
|
|
220
|
-
onPressStart,
|
|
221
|
-
onPressUp,
|
|
222
|
-
isDisabled
|
|
223
|
-
});
|
|
224
|
-
let {
|
|
225
|
-
hoverProps
|
|
226
|
-
} = useHover({
|
|
227
|
-
isDisabled,
|
|
228
212
|
|
|
229
|
-
onHoverStart() {
|
|
230
|
-
if (!isFocusVisible()) {
|
|
231
|
-
state.selectionManager.setFocused(true);
|
|
232
|
-
state.selectionManager.setFocusedKey(key);
|
|
233
|
-
}
|
|
234
|
-
}
|
|
235
213
|
|
|
236
|
-
});
|
|
237
|
-
return {
|
|
238
|
-
menuItemProps: _babelRuntimeHelpersEsmExtends({}, ariaProps, mergeProps(itemProps, pressProps, hoverProps, {
|
|
239
|
-
onKeyDown
|
|
240
|
-
})),
|
|
241
|
-
labelProps: {
|
|
242
|
-
id: labelId
|
|
243
|
-
},
|
|
244
|
-
descriptionProps: {
|
|
245
|
-
id: descriptionId
|
|
246
|
-
},
|
|
247
|
-
keyboardShortcutProps: {
|
|
248
|
-
id: keyboardId
|
|
249
|
-
}
|
|
250
|
-
};
|
|
251
|
-
}
|
|
252
214
|
|
|
253
|
-
|
|
254
|
-
* Provides the behavior and accessibility implementation for a section in a menu.
|
|
255
|
-
* See `useMenu` for more details about menus.
|
|
256
|
-
* @param props - Props for the section.
|
|
257
|
-
*/
|
|
258
|
-
export function useMenuSection(props) {
|
|
259
|
-
let {
|
|
260
|
-
heading,
|
|
261
|
-
'aria-label': ariaLabel
|
|
262
|
-
} = props;
|
|
263
|
-
let headingId = useId();
|
|
264
|
-
return {
|
|
265
|
-
itemProps: {
|
|
266
|
-
role: 'presentation'
|
|
267
|
-
},
|
|
268
|
-
headingProps: heading ? {
|
|
269
|
-
// Techincally, menus cannot contain headings according to ARIA.
|
|
270
|
-
// We hide the heading from assistive technology, and only use it
|
|
271
|
-
// as a label for the nested group.
|
|
272
|
-
id: headingId,
|
|
273
|
-
'aria-hidden': true
|
|
274
|
-
} : {},
|
|
275
|
-
groupProps: {
|
|
276
|
-
role: 'group',
|
|
277
|
-
'aria-label': ariaLabel,
|
|
278
|
-
'aria-labelledby': heading ? headingId : undefined
|
|
279
|
-
}
|
|
280
|
-
};
|
|
281
|
-
}
|
|
215
|
+
export {$67e957d00676eeca$export$dc9c12ed27dd1b49 as useMenuTrigger, $f8473e84867a4480$export$38eaa17faae8f579 as useMenu, $42974637716cfffc$export$9d32628fc2aea7da as useMenuItem, $2256bedceb8433c1$export$73f7a44322579622 as useMenuSection};
|
|
282
216
|
//# sourceMappingURL=module.js.map
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;AAiCA;;;;;OAKO,SAASA,cAAT,CAAwBC,KAAxB,EAAqDC,KAArD,EAA8EC,GAA9E,EAA4H;AACjI,MAAI;AACFC,IAAAA,IAAI,GAAG,MADL;AAEFC,IAAAA;AAFE,MAGAJ,KAHJ;AAKA,MAAIK,aAAa,GAAGC,KAAK,EAAzB;AACA,MAAI;AAACC,IAAAA,YAAD;AAAeC,IAAAA;AAAf,MAA+BC,iBAAiB,CAAC;AAACN,IAAAA;AAAD,GAAD,EAASF,KAAT,EAAgBC,GAAhB,CAApD;;AAEA,MAAIQ,SAAS,GAAIC,CAAD,IAAO;AACrB,QAAIP,UAAJ,EAAgB;AACd;AACD;;AAED,QAAIF,GAAG,IAAIA,GAAG,CAACU,OAAf,EAAwB;AACtB,cAAQD,CAAC,CAACE,GAAV;AACE,aAAK,WAAL;AACA,aAAK,OAAL;AACA,aAAK,GAAL;AACE;AACA,cAAI,EAAE,yBAAyBF,CAA3B,CAAJ,EAAmC;AACjCA,YAAAA,CAAC,CAACG,eAAF;AACD;;AACDH,UAAAA,CAAC,CAACI,cAAF;AACAd,UAAAA,KAAK,CAACe,MAAN,CAAa,OAAb;AACA;;AACF,aAAK,SAAL;AACE,cAAI,EAAE,yBAAyBL,CAA3B,CAAJ,EAAmC;AACjCA,YAAAA,CAAC,CAACG,eAAF;AACD;;AACDH,UAAAA,CAAC,CAACI,cAAF;AACAd,UAAAA,KAAK,CAACe,MAAN,CAAa,MAAb;AACA;AAjBJ;AAmBD;AACF,GA1BD;;AA4BA,SAAO;AACLC,IAAAA,gBAAgB,qCACXV,YADW;AAEdW,MAAAA,EAAE,EAAEb,aAFU;;AAGdc,MAAAA,YAAY,CAACR,CAAD,EAAI;AACd;AACA,YAAIA,CAAC,CAACS,WAAF,KAAkB,OAAlB,IAA6BT,CAAC,CAACS,WAAF,KAAkB,UAA/C,IAA6D,CAAChB,UAAlE,EAA8E;AAC5E;AACA;AACAH,UAAAA,KAAK,CAACe,MAAN,CAAaL,CAAC,CAACS,WAAF,KAAkB,SAAlB,GAA8B,OAA9B,GAAwC,IAArD;AACD;AACF,OAVa;;AAWdC,MAAAA,OAAO,CAACV,CAAD,EAAI;AACT,YAAIA,CAAC,CAACS,WAAF,KAAkB,OAAlB,IAA6B,CAAChB,UAAlC,EAA8C;AAC5CH,UAAAA,KAAK,CAACe,MAAN;AACD;AACF,OAfa;;AAgBdN,MAAAA;AAhBc,MADX;AAmBLY,IAAAA,SAAS,qCACJd,YADI;AAEP,yBAAmBH;AAFZ;AAnBJ,GAAP;AAwBD;;AChED;;;;;;OAMO,SAASkB,OAAT,CAAoBvB,KAApB,EAA+CC,KAA/C,EAAoEC,GAApE,EAA2G;AAChH,MAAI;AACFsB,IAAAA,eAAe,GAAG;AADhB,MAGAxB,KAHJ;AAAA,MAEKyB,UAFL,uDAGIzB,KAHJ;;AAKA,MAAI,CAACA,KAAK,CAAC,YAAD,CAAN,IAAwB,CAACA,KAAK,CAAC,iBAAD,CAAlC,EAAuD;AACrD0B,IAAAA,OAAO,CAACC,IAAR,CAAa,sEAAb;AACD;;AAED,MAAIC,QAAQ,GAAGC,cAAc,CAAC7B,KAAD,EAAQ;AAAC8B,IAAAA,SAAS,EAAE;AAAZ,GAAR,CAA7B;AACA,MAAI;AAACC,IAAAA;AAAD,MAAcC,iBAAiB,oCAC9BP,UAD8B;AAEjCvB,IAAAA,GAFiC;AAGjC+B,IAAAA,gBAAgB,EAAEhC,KAAK,CAACgC,gBAHS;AAIjCC,IAAAA,UAAU,EAAEjC,KAAK,CAACiC,UAJe;AAKjCC,IAAAA,YAAY,EAAElC,KAAK,CAACkC,YALa;AAMjCX,IAAAA;AANiC,KAAnC;AASA,SAAO;AACLF,IAAAA,SAAS,EAAEc,UAAU,CAACR,QAAD;AACnBS,MAAAA,IAAI,EAAE;AADa,OAEhBN,SAFgB;AADhB,GAAP;AAMD;;ACJD;;;;;;OAMO,SAASO,WAAT,CAAwBtC,KAAxB,EAAkDC,KAAlD,EAAuEC,GAAvE,EAAkH;AACvH,MAAI;AACFqC,IAAAA,UADE;AAEFnC,IAAAA,UAFE;AAGFS,IAAAA,GAHE;AAIF2B,IAAAA,OAJE;AAKFC,IAAAA,aALE;AAMFC,IAAAA,aANE;AAOFC,IAAAA;AAPE,MAQA3C,KARJ;AAUA,MAAIqC,IAAI,GAAG,UAAX;;AACA,MAAIpC,KAAK,CAACgC,gBAAN,CAAuBW,aAAvB,KAAyC,QAA7C,EAAuD;AACrDP,IAAAA,IAAI,GAAG,eAAP;AACD,GAFD,MAEO,IAAIpC,KAAK,CAACgC,gBAAN,CAAuBW,aAAvB,KAAyC,UAA7C,EAAyD;AAC9DP,IAAAA,IAAI,GAAG,kBAAP;AACD;;AAED,MAAIQ,OAAO,GAAGC,SAAS,EAAvB;AACA,MAAIC,aAAa,GAAGD,SAAS,EAA7B;AACA,MAAIE,UAAU,GAAGF,SAAS,EAA1B;AAEA,MAAIG,SAAS,GAAG;AACd,qBAAiB7C,UADH;AAEdiC,IAAAA,IAFc;AAGd,kBAAcrC,KAAK,CAAC,YAAD,CAHL;AAId,uBAAmB6C,OAJL;AAKd,wBAAoB,CAACE,aAAD,EAAgBC,UAAhB,EAA4BE,MAA5B,CAAmCC,OAAnC,EAA4CC,IAA5C,CAAiD,GAAjD,KAAyDC;AAL/D,GAAhB;;AAQA,MAAIpD,KAAK,CAACgC,gBAAN,CAAuBW,aAAvB,KAAyC,MAA7C,EAAqD;AACnDK,IAAAA,SAAS,CAAC,cAAD,CAAT,GAA4BV,UAA5B;AACD;;AAED,MAAIG,aAAJ,EAAmB;AACjBO,IAAAA,SAAS,CAAC,eAAD,CAAT,GAA6BhD,KAAK,CAACiC,UAAN,CAAiBoB,OAAjB,CAAyBzC,GAAzB,EAA8B0C,KAA3D;AACAN,IAAAA,SAAS,CAAC,cAAD,CAAT,GAA4BO,YAAY,CAACvD,KAAK,CAACiC,UAAP,CAAxC;AACD;;AAED,MAAIxB,SAAS,GAAIC,CAAD,IAAsB;AACpC;AACA;AACA,QAAIA,CAAC,CAAC8C,MAAN,EAAc;AACZ;AACD;;AAED,YAAQ9C,CAAC,CAACE,GAAV;AACE,WAAK,GAAL;AACE,YAAI,CAACT,UAAD,IAAeH,KAAK,CAACgC,gBAAN,CAAuBW,aAAvB,KAAyC,MAAxD,IAAkEH,aAAa,KAAK,KAApF,IAA6FD,OAAjG,EAA0G;AACxGA,UAAAA,OAAO;AACR;;AACD;;AACF,WAAK,OAAL;AACE;AACA,YAAI,CAACpC,UAAD,IAAeqC,aAAa,KAAK,KAAjC,IAA0CD,OAA9C,EAAuD;AACrDA,UAAAA,OAAO;AACR;;AACD;AAXJ;AAaD,GApBD;;AAsBA,MAAIrB,YAAY,GAAIR,CAAD,IAAmB;AACpC,QAAIA,CAAC,CAACS,WAAF,KAAkB,UAAlB,IAAgCuB,QAApC,EAA8C;AAC5CA,MAAAA,QAAQ,CAAC9B,GAAD,CAAR;AACD;AACF,GAJD;;AAMA,MAAI6C,SAAS,GAAI/C,CAAD,IAAmB;AACjC,QAAIA,CAAC,CAACS,WAAF,KAAkB,UAAtB,EAAkC;AAChC,UAAIuB,QAAJ,EAAc;AACZA,QAAAA,QAAQ,CAAC9B,GAAD,CAAR;AACD,OAH+B,CAKhC;AACA;;;AACA,UAAI2B,OAAO,KAAKC,aAAL,WAAKA,aAAL,GAAsBxC,KAAK,CAACgC,gBAAN,CAAuBW,aAAvB,KAAyC,UAA/D,CAAX,EAAuF;AACrFJ,QAAAA,OAAO;AACR;AACF;AACF,GAZD;;AAcA,MAAI;AAACmB,IAAAA;AAAD,MAAcC,iBAAiB,CAAC;AAClC3B,IAAAA,gBAAgB,EAAEhC,KAAK,CAACgC,gBADU;AAElCpB,IAAAA,GAFkC;AAGlCX,IAAAA,GAHkC;AAIlC2D,IAAAA,qBAAqB,EAAE;AAJW,GAAD,CAAnC;AAOA,MAAI;AAACC,IAAAA;AAAD,MAAeC,QAAQ,CAAC;AAAC5C,IAAAA,YAAD;AAAeuC,IAAAA,SAAf;AAA0BtD,IAAAA;AAA1B,GAAD,CAA3B;AACA,MAAI;AAAC4D,IAAAA;AAAD,MAAeC,QAAQ,CAAC;AAC1B7D,IAAAA,UAD0B;;AAE1B8D,IAAAA,YAAY,GAAG;AACb,UAAI,CAACC,cAAc,EAAnB,EAAuB;AACrBlE,QAAAA,KAAK,CAACgC,gBAAN,CAAuBmC,UAAvB,CAAkC,IAAlC;AACAnE,QAAAA,KAAK,CAACgC,gBAAN,CAAuBoC,aAAvB,CAAqCxD,GAArC;AACD;AACF;;AAPyB,GAAD,CAA3B;AAUA,SAAO;AACLyD,IAAAA,aAAa,qCACRrB,SADQ,EAERb,UAAU,CAACuB,SAAD,EAAYG,UAAZ,EAAwBE,UAAxB,EAAoC;AAACtD,MAAAA;AAAD,KAApC,CAFF,CADR;AAKL6D,IAAAA,UAAU,EAAE;AACVrD,MAAAA,EAAE,EAAE2B;AADM,KALP;AAQL2B,IAAAA,gBAAgB,EAAE;AAChBtD,MAAAA,EAAE,EAAE6B;AADY,KARb;AAWL0B,IAAAA,qBAAqB,EAAE;AACrBvD,MAAAA,EAAE,EAAE8B;AADiB;AAXlB,GAAP;AAeD;;ACtJD;;;;;OAKO,SAAS0B,cAAT,CAAwB1E,KAAxB,EAAsE;AAC3E,MAAI;AAAC2E,IAAAA,OAAD;AAAU,kBAAcC;AAAxB,MAAqC5E,KAAzC;AACA,MAAI6E,SAAS,GAAGvE,KAAK,EAArB;AAEA,SAAO;AACLqD,IAAAA,SAAS,EAAE;AACTtB,MAAAA,IAAI,EAAE;AADG,KADN;AAILyC,IAAAA,YAAY,EAAEH,OAAO,GAAG;AACtB;AACA;AACA;AACAzD,MAAAA,EAAE,EAAE2D,SAJkB;AAKtB,qBAAe;AALO,KAAH,GAMjB,EAVC;AAWLE,IAAAA,UAAU,EAAE;AACV1C,MAAAA,IAAI,EAAE,OADI;AAEV,oBAAcuC,SAFJ;AAGV,yBAAmBD,OAAO,GAAGE,SAAH,GAAexB;AAH/B;AAXP,GAAP;AAiBD","sources":["./packages/@react-aria/menu/src/useMenuTrigger.ts","./packages/@react-aria/menu/src/useMenu.ts","./packages/@react-aria/menu/src/useMenuItem.ts","./packages/@react-aria/menu/src/useMenuSection.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {HTMLAttributes, RefObject} from 'react';\nimport {MenuTriggerState} from '@react-stately/menu';\nimport {useId} from '@react-aria/utils';\nimport {useOverlayTrigger} from '@react-aria/overlays';\n\ninterface MenuTriggerAriaProps {\n /** The type of menu that the menu trigger opens. */\n type?: 'menu' | 'listbox',\n /** Whether menu trigger is disabled. */\n isDisabled?: boolean\n}\n\ninterface MenuTriggerAria {\n /** Props for the menu trigger element. */\n menuTriggerProps: AriaButtonProps,\n\n /** Props for the menu. */\n menuProps: HTMLAttributes<HTMLElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a menu trigger.\n * @param props - Props for the menu trigger.\n * @param state - State for the menu trigger.\n */\nexport function useMenuTrigger(props: MenuTriggerAriaProps, state: MenuTriggerState, ref: RefObject<HTMLElement>): MenuTriggerAria {\n let {\n type = 'menu' as MenuTriggerAriaProps['type'],\n isDisabled\n } = props;\n\n let menuTriggerId = useId();\n let {triggerProps, overlayProps} = useOverlayTrigger({type}, state, ref);\n\n let onKeyDown = (e) => {\n if (isDisabled) {\n return;\n }\n\n if (ref && ref.current) {\n switch (e.key) {\n case 'ArrowDown':\n case 'Enter':\n case ' ':\n // Stop propagation, unless it would already be handled by useKeyboard.\n if (!('continuePropagation' in e)) {\n e.stopPropagation();\n }\n e.preventDefault();\n state.toggle('first');\n break;\n case 'ArrowUp':\n if (!('continuePropagation' in e)) {\n e.stopPropagation();\n }\n e.preventDefault();\n state.toggle('last');\n break;\n }\n }\n };\n\n return {\n menuTriggerProps: {\n ...triggerProps,\n id: menuTriggerId,\n onPressStart(e) {\n // For consistency with native, open the menu on mouse/key down, but touch up.\n if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {\n // If opened with a screen reader, auto focus the first item.\n // Otherwise, the menu itself will be focused.\n state.toggle(e.pointerType === 'virtual' ? 'first' : null);\n }\n },\n onPress(e) {\n if (e.pointerType === 'touch' && !isDisabled) {\n state.toggle();\n }\n },\n onKeyDown\n },\n menuProps: {\n ...overlayProps,\n 'aria-labelledby': menuTriggerId\n }\n };\n}\n","/*\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 {AriaMenuProps} from '@react-types/menu';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {HTMLAttributes, RefObject} from 'react';\nimport {KeyboardDelegate} from '@react-types/shared';\nimport {TreeState} from '@react-stately/tree';\nimport {useSelectableList} from '@react-aria/selection';\n\ninterface MenuAria {\n /** Props for the menu element. */\n menuProps: HTMLAttributes<HTMLElement>\n}\n\ninterface AriaMenuOptions<T> extends AriaMenuProps<T> {\n /** Whether the menu uses virtual scrolling. */\n isVirtualized?: boolean,\n\n /**\n * An optional keyboard delegate implementation for type to select,\n * to override the default.\n */\n keyboardDelegate?: KeyboardDelegate\n}\n\n/**\n * Provides the behavior and accessibility implementation for a menu component.\n * A menu displays a list of actions or options that a user can choose.\n * @param props - Props for the menu.\n * @param state - State for the menu, as returned by `useListState`.\n */\nexport function useMenu<T>(props: AriaMenuOptions<T>, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuAria {\n let {\n shouldFocusWrap = true,\n ...otherProps\n } = props;\n\n if (!props['aria-label'] && !props['aria-labelledby']) {\n console.warn('An aria-label or aria-labelledby prop is required for accessibility.');\n }\n\n let domProps = filterDOMProps(props, {labelable: true});\n let {listProps} = useSelectableList({\n ...otherProps,\n ref,\n selectionManager: state.selectionManager,\n collection: state.collection,\n disabledKeys: state.disabledKeys,\n shouldFocusWrap\n });\n\n return {\n menuProps: mergeProps(domProps, {\n role: 'menu',\n ...listProps\n })\n };\n}\n","/*\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 {getItemCount} from '@react-stately/collections';\nimport {HTMLAttributes, Key, RefObject} from 'react';\nimport {isFocusVisible, useHover, usePress} from '@react-aria/interactions';\nimport {mergeProps, useSlotId} from '@react-aria/utils';\nimport {PressEvent} from '@react-types/shared';\nimport {TreeState} from '@react-stately/tree';\nimport {useSelectableItem} from '@react-aria/selection';\n\ninterface MenuItemAria {\n /** Props for the menu item element. */\n menuItemProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the main text element inside the menu item. */\n labelProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the description text element inside the menu item, if any. */\n descriptionProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the keyboard shortcut text element inside the item, if any. */\n keyboardShortcutProps: HTMLAttributes<HTMLElement>\n}\n\ninterface AriaMenuItemProps {\n /** Whether the menu item is disabled. */\n isDisabled?: boolean,\n\n /** Whether the menu item is selected. */\n isSelected?: boolean,\n\n /** A screen reader only label for the menu item. */\n 'aria-label'?: string,\n\n /** The unique key for the menu item. */\n key?: Key,\n\n /** Handler that is called when the menu should close after selecting an item. */\n onClose?: () => void,\n\n /**\n * Whether the menu should close when the menu item is selected.\n * @default true\n */\n closeOnSelect?: boolean,\n\n /** Whether the menu item is contained in a virtual scrolling menu. */\n isVirtualized?: boolean,\n\n /** Handler that is called when the user activates the item. */\n onAction?: (key: Key) => void\n}\n\n/**\n * Provides the behavior and accessibility implementation for an item in a menu.\n * See `useMenu` for more details about menus.\n * @param props - Props for the item.\n * @param state - State for the menu, as returned by `useTreeState`.\n */\nexport function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuItemAria {\n let {\n isSelected,\n isDisabled,\n key,\n onClose,\n closeOnSelect,\n isVirtualized,\n onAction\n } = props;\n\n let role = 'menuitem';\n if (state.selectionManager.selectionMode === 'single') {\n role = 'menuitemradio';\n } else if (state.selectionManager.selectionMode === 'multiple') {\n role = 'menuitemcheckbox';\n }\n\n let labelId = useSlotId();\n let descriptionId = useSlotId();\n let keyboardId = useSlotId();\n\n let ariaProps = {\n 'aria-disabled': isDisabled,\n role,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': labelId,\n 'aria-describedby': [descriptionId, keyboardId].filter(Boolean).join(' ') || undefined\n };\n\n if (state.selectionManager.selectionMode !== 'none') {\n ariaProps['aria-checked'] = isSelected;\n }\n\n if (isVirtualized) {\n ariaProps['aria-posinset'] = state.collection.getItem(key).index;\n ariaProps['aria-setsize'] = getItemCount(state.collection);\n }\n\n let onKeyDown = (e: KeyboardEvent) => {\n // Ignore repeating events, which may have started on the menu trigger before moving\n // focus to the menu item. We want to wait for a second complete key press sequence.\n if (e.repeat) {\n return;\n }\n\n switch (e.key) {\n case ' ':\n if (!isDisabled && state.selectionManager.selectionMode === 'none' && closeOnSelect !== false && onClose) {\n onClose();\n }\n break;\n case 'Enter':\n // The Enter key should always close on select, except if overridden.\n if (!isDisabled && closeOnSelect !== false && onClose) {\n onClose();\n }\n break;\n }\n };\n\n let onPressStart = (e: PressEvent) => {\n if (e.pointerType === 'keyboard' && onAction) {\n onAction(key);\n }\n };\n\n let onPressUp = (e: PressEvent) => {\n if (e.pointerType !== 'keyboard') {\n if (onAction) {\n onAction(key);\n }\n\n // Pressing a menu item should close by default in single selection mode but not multiple\n // selection mode, except if overridden by the closeOnSelect prop.\n if (onClose && (closeOnSelect ?? state.selectionManager.selectionMode !== 'multiple')) {\n onClose();\n }\n }\n };\n\n let {itemProps} = useSelectableItem({\n selectionManager: state.selectionManager,\n key,\n ref,\n shouldSelectOnPressUp: true\n });\n\n let {pressProps} = usePress({onPressStart, onPressUp, isDisabled});\n let {hoverProps} = useHover({\n isDisabled,\n onHoverStart() {\n if (!isFocusVisible()) {\n state.selectionManager.setFocused(true);\n state.selectionManager.setFocusedKey(key);\n }\n }\n });\n\n return {\n menuItemProps: {\n ...ariaProps,\n ...mergeProps(itemProps, pressProps, hoverProps, {onKeyDown})\n },\n labelProps: {\n id: labelId\n },\n descriptionProps: {\n id: descriptionId\n },\n keyboardShortcutProps: {\n id: keyboardId\n }\n };\n}\n","/*\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 {HTMLAttributes, ReactNode} from 'react';\nimport {useId} from '@react-aria/utils';\n\ninterface AriaMenuSectionProps {\n /** The heading for the section. */\n heading?: ReactNode,\n /** An accessibility label for the section. Required if `heading` is not present. */\n 'aria-label'?: string\n}\n\ninterface MenuSectionAria {\n /** Props for the wrapper list item. */\n itemProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the heading element, if any. */\n headingProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the group element. */\n groupProps: HTMLAttributes<HTMLElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a section in a menu.\n * See `useMenu` for more details about menus.\n * @param props - Props for the section.\n */\nexport function useMenuSection(props: AriaMenuSectionProps): MenuSectionAria {\n let {heading, 'aria-label': ariaLabel} = props;\n let headingId = useId();\n\n return {\n itemProps: {\n role: 'presentation'\n },\n headingProps: heading ? {\n // Techincally, menus cannot contain headings according to ARIA.\n // We hide the heading from assistive technology, and only use it\n // as a label for the nested group.\n id: headingId,\n 'aria-hidden': true\n } : {},\n groupProps: {\n role: 'group',\n 'aria-label': ariaLabel,\n 'aria-labelledby': heading ? headingId : undefined\n }\n };\n}\n"],"names":["useMenuTrigger","props","state","ref","type","isDisabled","menuTriggerId","useId","triggerProps","overlayProps","useOverlayTrigger","onKeyDown","e","current","key","stopPropagation","preventDefault","toggle","menuTriggerProps","id","onPressStart","pointerType","onPress","menuProps","useMenu","shouldFocusWrap","otherProps","console","warn","domProps","filterDOMProps","labelable","listProps","useSelectableList","selectionManager","collection","disabledKeys","mergeProps","role","useMenuItem","isSelected","onClose","closeOnSelect","isVirtualized","onAction","selectionMode","labelId","useSlotId","descriptionId","keyboardId","ariaProps","filter","Boolean","join","undefined","getItem","index","getItemCount","repeat","onPressUp","itemProps","useSelectableItem","shouldSelectOnPressUp","pressProps","usePress","hoverProps","useHover","onHoverStart","isFocusVisible","setFocused","setFocusedKey","menuItemProps","labelProps","descriptionProps","keyboardShortcutProps","useMenuSection","heading","ariaLabel","headingId","headingProps","groupProps"],"version":3,"file":"module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/menu/src/index.ts","packages/@react-aria/menu/src/useMenuTrigger.ts","packages/@react-aria/menu/src/useMenu.ts","packages/@react-aria/menu/src/useMenuItem.ts","packages/@react-aria/menu/src/useMenuSection.ts"],"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\nexport * from './useMenuTrigger';\nexport * from './useMenu';\nexport * from './useMenuItem';\nexport * from './useMenuSection';\n","/*\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 {AriaButtonProps} from '@react-types/button';\nimport {HTMLAttributes, RefObject} from 'react';\nimport {MenuTriggerState} from '@react-stately/menu';\nimport {useId} from '@react-aria/utils';\nimport {useOverlayTrigger} from '@react-aria/overlays';\n\ninterface MenuTriggerAriaProps {\n /** The type of menu that the menu trigger opens. */\n type?: 'menu' | 'listbox',\n /** Whether menu trigger is disabled. */\n isDisabled?: boolean\n}\n\ninterface MenuTriggerAria {\n /** Props for the menu trigger element. */\n menuTriggerProps: AriaButtonProps,\n\n /** Props for the menu. */\n menuProps: HTMLAttributes<HTMLElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a menu trigger.\n * @param props - Props for the menu trigger.\n * @param state - State for the menu trigger.\n */\nexport function useMenuTrigger(props: MenuTriggerAriaProps, state: MenuTriggerState, ref: RefObject<HTMLElement>): MenuTriggerAria {\n let {\n type = 'menu' as MenuTriggerAriaProps['type'],\n isDisabled\n } = props;\n\n let menuTriggerId = useId();\n let {triggerProps, overlayProps} = useOverlayTrigger({type}, state, ref);\n\n let onKeyDown = (e) => {\n if (isDisabled) {\n return;\n }\n\n if (ref && ref.current) {\n switch (e.key) {\n case 'ArrowDown':\n case 'Enter':\n case ' ':\n // Stop propagation, unless it would already be handled by useKeyboard.\n if (!('continuePropagation' in e)) {\n e.stopPropagation();\n }\n e.preventDefault();\n state.toggle('first');\n break;\n case 'ArrowUp':\n if (!('continuePropagation' in e)) {\n e.stopPropagation();\n }\n e.preventDefault();\n state.toggle('last');\n break;\n }\n }\n };\n\n return {\n menuTriggerProps: {\n ...triggerProps,\n id: menuTriggerId,\n onPressStart(e) {\n // For consistency with native, open the menu on mouse/key down, but touch up.\n if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {\n // If opened with a screen reader, auto focus the first item.\n // Otherwise, the menu itself will be focused.\n state.toggle(e.pointerType === 'virtual' ? 'first' : null);\n }\n },\n onPress(e) {\n if (e.pointerType === 'touch' && !isDisabled) {\n state.toggle();\n }\n },\n onKeyDown\n },\n menuProps: {\n ...overlayProps,\n 'aria-labelledby': menuTriggerId\n }\n };\n}\n","/*\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 {AriaMenuProps} from '@react-types/menu';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {HTMLAttributes, RefObject} from 'react';\nimport {KeyboardDelegate} from '@react-types/shared';\nimport {TreeState} from '@react-stately/tree';\nimport {useSelectableList} from '@react-aria/selection';\n\ninterface MenuAria {\n /** Props for the menu element. */\n menuProps: HTMLAttributes<HTMLElement>\n}\n\ninterface AriaMenuOptions<T> extends AriaMenuProps<T> {\n /** Whether the menu uses virtual scrolling. */\n isVirtualized?: boolean,\n\n /**\n * An optional keyboard delegate implementation for type to select,\n * to override the default.\n */\n keyboardDelegate?: KeyboardDelegate\n}\n\n/**\n * Provides the behavior and accessibility implementation for a menu component.\n * A menu displays a list of actions or options that a user can choose.\n * @param props - Props for the menu.\n * @param state - State for the menu, as returned by `useListState`.\n */\nexport function useMenu<T>(props: AriaMenuOptions<T>, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuAria {\n let {\n shouldFocusWrap = true,\n ...otherProps\n } = props;\n\n if (!props['aria-label'] && !props['aria-labelledby']) {\n console.warn('An aria-label or aria-labelledby prop is required for accessibility.');\n }\n\n let domProps = filterDOMProps(props, {labelable: true});\n let {listProps} = useSelectableList({\n ...otherProps,\n ref,\n selectionManager: state.selectionManager,\n collection: state.collection,\n disabledKeys: state.disabledKeys,\n shouldFocusWrap\n });\n\n return {\n menuProps: mergeProps(domProps, {\n role: 'menu',\n ...listProps\n })\n };\n}\n","/*\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 {getItemCount} from '@react-stately/collections';\nimport {HTMLAttributes, Key, RefObject} from 'react';\nimport {isFocusVisible, useHover, usePress} from '@react-aria/interactions';\nimport {mergeProps, useSlotId} from '@react-aria/utils';\nimport {PressEvent} from '@react-types/shared';\nimport {TreeState} from '@react-stately/tree';\nimport {useSelectableItem} from '@react-aria/selection';\n\ninterface MenuItemAria {\n /** Props for the menu item element. */\n menuItemProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the main text element inside the menu item. */\n labelProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the description text element inside the menu item, if any. */\n descriptionProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the keyboard shortcut text element inside the item, if any. */\n keyboardShortcutProps: HTMLAttributes<HTMLElement>\n}\n\ninterface AriaMenuItemProps {\n /** Whether the menu item is disabled. */\n isDisabled?: boolean,\n\n /** Whether the menu item is selected. */\n isSelected?: boolean,\n\n /** A screen reader only label for the menu item. */\n 'aria-label'?: string,\n\n /** The unique key for the menu item. */\n key?: Key,\n\n /** Handler that is called when the menu should close after selecting an item. */\n onClose?: () => void,\n\n /**\n * Whether the menu should close when the menu item is selected.\n * @default true\n */\n closeOnSelect?: boolean,\n\n /** Whether the menu item is contained in a virtual scrolling menu. */\n isVirtualized?: boolean,\n\n /** Handler that is called when the user activates the item. */\n onAction?: (key: Key) => void\n}\n\n/**\n * Provides the behavior and accessibility implementation for an item in a menu.\n * See `useMenu` for more details about menus.\n * @param props - Props for the item.\n * @param state - State for the menu, as returned by `useTreeState`.\n */\nexport function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, ref: RefObject<HTMLElement>): MenuItemAria {\n let {\n isSelected,\n isDisabled,\n key,\n onClose,\n closeOnSelect,\n isVirtualized,\n onAction\n } = props;\n\n let role = 'menuitem';\n if (state.selectionManager.selectionMode === 'single') {\n role = 'menuitemradio';\n } else if (state.selectionManager.selectionMode === 'multiple') {\n role = 'menuitemcheckbox';\n }\n\n let labelId = useSlotId();\n let descriptionId = useSlotId();\n let keyboardId = useSlotId();\n\n let ariaProps = {\n 'aria-disabled': isDisabled,\n role,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': labelId,\n 'aria-describedby': [descriptionId, keyboardId].filter(Boolean).join(' ') || undefined\n };\n\n if (state.selectionManager.selectionMode !== 'none') {\n ariaProps['aria-checked'] = isSelected;\n }\n\n if (isVirtualized) {\n ariaProps['aria-posinset'] = state.collection.getItem(key).index;\n ariaProps['aria-setsize'] = getItemCount(state.collection);\n }\n\n let onKeyDown = (e: KeyboardEvent) => {\n // Ignore repeating events, which may have started on the menu trigger before moving\n // focus to the menu item. We want to wait for a second complete key press sequence.\n if (e.repeat) {\n return;\n }\n\n switch (e.key) {\n case ' ':\n if (!isDisabled && state.selectionManager.selectionMode === 'none' && closeOnSelect !== false && onClose) {\n onClose();\n }\n break;\n case 'Enter':\n // The Enter key should always close on select, except if overridden.\n if (!isDisabled && closeOnSelect !== false && onClose) {\n onClose();\n }\n break;\n }\n };\n\n let onPressStart = (e: PressEvent) => {\n if (e.pointerType === 'keyboard' && onAction) {\n onAction(key);\n }\n };\n\n let onPressUp = (e: PressEvent) => {\n if (e.pointerType !== 'keyboard') {\n if (onAction) {\n onAction(key);\n }\n\n // Pressing a menu item should close by default in single selection mode but not multiple\n // selection mode, except if overridden by the closeOnSelect prop.\n if (onClose && (closeOnSelect ?? state.selectionManager.selectionMode !== 'multiple')) {\n onClose();\n }\n }\n };\n\n let {itemProps} = useSelectableItem({\n selectionManager: state.selectionManager,\n key,\n ref,\n shouldSelectOnPressUp: true\n });\n\n let {pressProps} = usePress({onPressStart, onPressUp, isDisabled});\n let {hoverProps} = useHover({\n isDisabled,\n onHoverStart() {\n if (!isFocusVisible()) {\n state.selectionManager.setFocused(true);\n state.selectionManager.setFocusedKey(key);\n }\n }\n });\n\n return {\n menuItemProps: {\n ...ariaProps,\n ...mergeProps(itemProps, pressProps, hoverProps, {onKeyDown})\n },\n labelProps: {\n id: labelId\n },\n descriptionProps: {\n id: descriptionId\n },\n keyboardShortcutProps: {\n id: keyboardId\n }\n };\n}\n","/*\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 {HTMLAttributes, ReactNode} from 'react';\nimport {useId} from '@react-aria/utils';\n\ninterface AriaMenuSectionProps {\n /** The heading for the section. */\n heading?: ReactNode,\n /** An accessibility label for the section. Required if `heading` is not present. */\n 'aria-label'?: string\n}\n\ninterface MenuSectionAria {\n /** Props for the wrapper list item. */\n itemProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the heading element, if any. */\n headingProps: HTMLAttributes<HTMLElement>,\n\n /** Props for the group element. */\n groupProps: HTMLAttributes<HTMLElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a section in a menu.\n * See `useMenu` for more details about menus.\n * @param props - Props for the section.\n */\nexport function useMenuSection(props: AriaMenuSectionProps): MenuSectionAria {\n let {heading, 'aria-label': ariaLabel} = props;\n let headingId = useId();\n\n return {\n itemProps: {\n role: 'presentation'\n },\n headingProps: heading ? {\n // Techincally, menus cannot contain headings according to ARIA.\n // We hide the heading from assistive technology, and only use it\n // as a label for the nested group.\n id: headingId,\n 'aria-hidden': true\n } : {},\n groupProps: {\n role: 'group',\n 'aria-label': ariaLabel,\n 'aria-labelledby': heading ? headingId : undefined\n }\n };\n}\n"],"names":[],"version":3,"file":"module.js.map"}
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":";;;;;;AAkBA;IACE,oDAAoD;IACpD,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED;IACE,0CAA0C;IAC1C,gBAAgB,EAAE,eAAe,CAAC;IAElC,0BAA0B;IAC1B,SAAS,EAAE,eAAe,WAAW,CAAC,CAAA;CACvC;AAED;;;;GAIG;AACH,+BAA+B,KAAK,EAAE,oBAAoB,EAAE,KAAK,EAAE,gBAAgB,EAAE,GAAG,EAAE,UAAU,WAAW,CAAC,GAAG,eAAe,CA6DjI;AChFD;IACE,kCAAkC;IAClC,SAAS,EAAE,eAAe,WAAW,CAAC,CAAA;CACvC;AAED,0BAA0B,CAAC,CAAE,SAAQ,cAAc,CAAC,CAAC;IACnD,+CAA+C;IAC/C,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;CACpC;AAED;;;;;GAKG;AACH,wBAAwB,CAAC,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,WAAW,CAAC,GAAG,QAAQ,CA0BhH;AC/CD;IACE,uCAAuC;IACvC,aAAa,EAAE,eAAe,WAAW,CAAC,CAAC;IAE3C,4DAA4D;IAC5D,UAAU,EAAE,eAAe,WAAW,CAAC,CAAC;IAExC,2EAA2E;IAC3E,gBAAgB,EAAE,eAAe,WAAW,CAAC,CAAC;IAE9C,4EAA4E;IAC5E,qBAAqB,EAAE,eAAe,WAAW,CAAC,CAAA;CACnD;AAED;IACE,yCAAyC;IACzC,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,yCAAyC;IACzC,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,oDAAoD;IACpD,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,wCAAwC;IACxC,GAAG,CAAC,EAAE,GAAG,CAAC;IAEV,iFAAiF;IACjF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,sEAAsE;IACtE,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAA;CAC9B;AAED;;;;;GAKG;AACH,4BAA4B,CAAC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,WAAW,CAAC,GAAG,YAAY,CAkHvH;ACxKD;IACE,mCAAmC;IACnC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oFAAoF;IACpF,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED;IACE,uCAAuC;IACvC,SAAS,EAAE,eAAe,WAAW,CAAC,CAAC;IAEvC,6CAA6C;IAC7C,YAAY,EAAE,eAAe,WAAW,CAAC,CAAC;IAE1C,mCAAmC;IACnC,UAAU,EAAE,eAAe,WAAW,CAAC,CAAA;CACxC;AAED;;;;GAIG;AACH,+BAA+B,KAAK,EAAE,oBAAoB,GAAG,eAAe,CAqB3E","sources":["packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuTrigger.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenu.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuItem.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/useMenuSection.ts","packages/@react-aria/menu/src/packages/@react-aria/menu/src/index.ts","packages/@react-aria/menu/src/index.ts"],"sourcesContent":[null,null,null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport * from './useMenuTrigger';\nexport * from './useMenu';\nexport * from './useMenuItem';\nexport * from './useMenuSection';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-aria/menu",
|
|
3
|
-
"version": "3.3.1-nightly.
|
|
3
|
+
"version": "3.3.1-nightly.3064+5115b76b6",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -18,16 +18,16 @@
|
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"@babel/runtime": "^7.6.2",
|
|
21
|
-
"@react-aria/interactions": "3.0.0-nightly.
|
|
22
|
-
"@react-aria/overlays": "3.0.0-nightly.
|
|
23
|
-
"@react-aria/selection": "3.0.0-nightly.
|
|
24
|
-
"@react-aria/utils": "3.0.0-nightly.
|
|
25
|
-
"@react-stately/collections": "3.0.0-nightly.
|
|
26
|
-
"@react-stately/menu": "3.2.4-nightly.
|
|
27
|
-
"@react-stately/tree": "3.0.0-nightly.
|
|
28
|
-
"@react-types/button": "3.4.2-nightly.
|
|
29
|
-
"@react-types/menu": "3.4.2-nightly.
|
|
30
|
-
"@react-types/shared": "3.0.0-nightly.
|
|
21
|
+
"@react-aria/interactions": "3.0.0-nightly.1373+5115b76b6",
|
|
22
|
+
"@react-aria/overlays": "3.0.0-nightly.1373+5115b76b6",
|
|
23
|
+
"@react-aria/selection": "3.0.0-nightly.1373+5115b76b6",
|
|
24
|
+
"@react-aria/utils": "3.0.0-nightly.1373+5115b76b6",
|
|
25
|
+
"@react-stately/collections": "3.0.0-nightly.1373+5115b76b6",
|
|
26
|
+
"@react-stately/menu": "3.2.4-nightly.3064+5115b76b6",
|
|
27
|
+
"@react-stately/tree": "3.0.0-nightly.1373+5115b76b6",
|
|
28
|
+
"@react-types/button": "3.4.2-nightly.3064+5115b76b6",
|
|
29
|
+
"@react-types/menu": "3.4.2-nightly.3064+5115b76b6",
|
|
30
|
+
"@react-types/shared": "3.0.0-nightly.1373+5115b76b6"
|
|
31
31
|
},
|
|
32
32
|
"peerDependencies": {
|
|
33
33
|
"react": "^16.8.0 || ^17.0.0-rc.1",
|
|
@@ -36,5 +36,5 @@
|
|
|
36
36
|
"publishConfig": {
|
|
37
37
|
"access": "public"
|
|
38
38
|
},
|
|
39
|
-
"gitHead": "
|
|
39
|
+
"gitHead": "5115b76b63cba6843d5e7de2ef5ec3a41a1bff3c"
|
|
40
40
|
}
|