react-aria-components 1.6.0 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/Autocomplete.main.js +23 -12
- package/dist/Autocomplete.main.js.map +1 -1
- package/dist/Autocomplete.mjs +23 -12
- package/dist/Autocomplete.module.js +23 -12
- package/dist/Autocomplete.module.js.map +1 -1
- package/dist/Checkbox.main.js +1 -1
- package/dist/Checkbox.main.js.map +1 -1
- package/dist/Checkbox.mjs +1 -1
- package/dist/Checkbox.module.js +1 -1
- package/dist/Checkbox.module.js.map +1 -1
- package/dist/Collection.main.js.map +1 -1
- package/dist/Collection.module.js.map +1 -1
- package/dist/ColorArea.main.js +4 -4
- package/dist/ColorArea.main.js.map +1 -1
- package/dist/ColorArea.mjs +2 -2
- package/dist/ColorArea.module.js +2 -2
- package/dist/ColorArea.module.js.map +1 -1
- package/dist/ColorField.main.js +8 -10
- package/dist/ColorField.main.js.map +1 -1
- package/dist/ColorField.mjs +4 -6
- package/dist/ColorField.module.js +4 -6
- package/dist/ColorField.module.js.map +1 -1
- package/dist/ColorPicker.main.js +2 -2
- package/dist/ColorPicker.main.js.map +1 -1
- package/dist/ColorPicker.mjs +1 -1
- package/dist/ColorPicker.module.js +1 -1
- package/dist/ColorPicker.module.js.map +1 -1
- package/dist/ColorSlider.main.js +5 -7
- package/dist/ColorSlider.main.js.map +1 -1
- package/dist/ColorSlider.mjs +3 -5
- package/dist/ColorSlider.module.js +3 -5
- package/dist/ColorSlider.module.js.map +1 -1
- package/dist/ColorSwatch.main.js +2 -2
- package/dist/ColorSwatch.main.js.map +1 -1
- package/dist/ColorSwatch.mjs +1 -1
- package/dist/ColorSwatch.module.js +1 -1
- package/dist/ColorSwatch.module.js.map +1 -1
- package/dist/ColorSwatchPicker.main.js +3 -3
- package/dist/ColorSwatchPicker.main.js.map +1 -1
- package/dist/ColorSwatchPicker.mjs +1 -1
- package/dist/ColorSwatchPicker.module.js +1 -1
- package/dist/ColorSwatchPicker.module.js.map +1 -1
- package/dist/ColorThumb.main.js +2 -6
- package/dist/ColorThumb.main.js.map +1 -1
- package/dist/ColorThumb.mjs +1 -5
- package/dist/ColorThumb.module.js +1 -5
- package/dist/ColorThumb.module.js.map +1 -1
- package/dist/ColorWheel.main.js +4 -4
- package/dist/ColorWheel.main.js.map +1 -1
- package/dist/ColorWheel.mjs +2 -2
- package/dist/ColorWheel.module.js +2 -2
- package/dist/ColorWheel.module.js.map +1 -1
- package/dist/ComboBox.main.js +1 -1
- package/dist/ComboBox.main.js.map +1 -1
- package/dist/ComboBox.mjs +1 -1
- package/dist/ComboBox.module.js +1 -1
- package/dist/ComboBox.module.js.map +1 -1
- package/dist/DateField.main.js +4 -3
- package/dist/DateField.main.js.map +1 -1
- package/dist/DateField.mjs +4 -3
- package/dist/DateField.module.js +4 -3
- package/dist/DateField.module.js.map +1 -1
- package/dist/DatePicker.main.js +2 -2
- package/dist/DatePicker.main.js.map +1 -1
- package/dist/DatePicker.mjs +2 -2
- package/dist/DatePicker.module.js +2 -2
- package/dist/DatePicker.module.js.map +1 -1
- package/dist/Dialog.main.js +2 -1
- package/dist/Dialog.main.js.map +1 -1
- package/dist/Dialog.mjs +2 -1
- package/dist/Dialog.module.js +2 -1
- package/dist/Dialog.module.js.map +1 -1
- package/dist/Disclosure.main.js +5 -7
- package/dist/Disclosure.main.js.map +1 -1
- package/dist/Disclosure.mjs +2 -4
- package/dist/Disclosure.module.js +2 -4
- package/dist/Disclosure.module.js.map +1 -1
- package/dist/DropZone.main.js +1 -3
- package/dist/DropZone.main.js.map +1 -1
- package/dist/DropZone.mjs +1 -3
- package/dist/DropZone.module.js +1 -3
- package/dist/DropZone.module.js.map +1 -1
- package/dist/GridList.main.js.map +1 -1
- package/dist/GridList.module.js.map +1 -1
- package/dist/Group.main.js.map +1 -1
- package/dist/Group.module.js.map +1 -1
- package/dist/ListBox.main.js +17 -16
- package/dist/ListBox.main.js.map +1 -1
- package/dist/ListBox.mjs +19 -18
- package/dist/ListBox.module.js +19 -18
- package/dist/ListBox.module.js.map +1 -1
- package/dist/Menu.main.js +39 -24
- package/dist/Menu.main.js.map +1 -1
- package/dist/Menu.mjs +40 -25
- package/dist/Menu.module.js +40 -25
- package/dist/Menu.module.js.map +1 -1
- package/dist/Meter.main.js +1 -1
- package/dist/Meter.main.js.map +1 -1
- package/dist/Meter.mjs +1 -1
- package/dist/Meter.module.js +1 -1
- package/dist/Meter.module.js.map +1 -1
- package/dist/NumberField.main.js +4 -2
- package/dist/NumberField.main.js.map +1 -1
- package/dist/NumberField.mjs +4 -2
- package/dist/NumberField.module.js +4 -2
- package/dist/NumberField.module.js.map +1 -1
- package/dist/Popover.main.js +67 -15
- package/dist/Popover.main.js.map +1 -1
- package/dist/Popover.mjs +69 -17
- package/dist/Popover.module.js +69 -17
- package/dist/Popover.module.js.map +1 -1
- package/dist/ProgressBar.main.js +1 -1
- package/dist/ProgressBar.main.js.map +1 -1
- package/dist/ProgressBar.mjs +1 -1
- package/dist/ProgressBar.module.js +1 -1
- package/dist/ProgressBar.module.js.map +1 -1
- package/dist/RadioGroup.main.js +1 -1
- package/dist/RadioGroup.main.js.map +1 -1
- package/dist/RadioGroup.mjs +1 -1
- package/dist/RadioGroup.module.js +1 -1
- package/dist/RadioGroup.module.js.map +1 -1
- package/dist/SearchField.main.js +4 -2
- package/dist/SearchField.main.js.map +1 -1
- package/dist/SearchField.mjs +5 -3
- package/dist/SearchField.module.js +5 -3
- package/dist/SearchField.module.js.map +1 -1
- package/dist/Select.main.js +3 -2
- package/dist/Select.main.js.map +1 -1
- package/dist/Select.mjs +3 -2
- package/dist/Select.module.js +3 -2
- package/dist/Select.module.js.map +1 -1
- package/dist/Slider.main.js +2 -2
- package/dist/Slider.main.js.map +1 -1
- package/dist/Slider.mjs +2 -2
- package/dist/Slider.module.js +2 -2
- package/dist/Slider.module.js.map +1 -1
- package/dist/Table.main.js +15 -6
- package/dist/Table.main.js.map +1 -1
- package/dist/Table.mjs +15 -6
- package/dist/Table.module.js +15 -6
- package/dist/Table.module.js.map +1 -1
- package/dist/TableLayout.main.js.map +1 -1
- package/dist/TableLayout.module.js.map +1 -1
- package/dist/Tabs.main.js +3 -2
- package/dist/Tabs.main.js.map +1 -1
- package/dist/Tabs.mjs +4 -3
- package/dist/Tabs.module.js +4 -3
- package/dist/Tabs.module.js.map +1 -1
- package/dist/TagGroup.main.js +1 -1
- package/dist/TagGroup.main.js.map +1 -1
- package/dist/TagGroup.mjs +1 -1
- package/dist/TagGroup.module.js +1 -1
- package/dist/TagGroup.module.js.map +1 -1
- package/dist/TextField.main.js +4 -2
- package/dist/TextField.main.js.map +1 -1
- package/dist/TextField.mjs +5 -3
- package/dist/TextField.module.js +5 -3
- package/dist/TextField.module.js.map +1 -1
- package/dist/Toast.main.js +148 -0
- package/dist/Toast.main.js.map +1 -0
- package/dist/Toast.mjs +137 -0
- package/dist/Toast.module.js +137 -0
- package/dist/Toast.module.js.map +1 -0
- package/dist/Tree.main.js +38 -34
- package/dist/Tree.main.js.map +1 -1
- package/dist/Tree.mjs +34 -30
- package/dist/Tree.module.js +34 -30
- package/dist/Tree.module.js.map +1 -1
- package/dist/Virtualizer.main.js +4 -1
- package/dist/Virtualizer.main.js.map +1 -1
- package/dist/Virtualizer.mjs +4 -1
- package/dist/Virtualizer.module.js +4 -1
- package/dist/Virtualizer.module.js.map +1 -1
- package/dist/import.mjs +9 -7
- package/dist/main.js +31 -17
- package/dist/main.js.map +1 -1
- package/dist/module.js +9 -7
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +159 -59
- package/dist/types.d.ts.map +1 -1
- package/dist/utils.main.js +9 -7
- package/dist/utils.main.js.map +1 -1
- package/dist/utils.mjs +9 -7
- package/dist/utils.module.js +9 -7
- package/dist/utils.module.js.map +1 -1
- package/i18n/index.js +1 -1
- package/i18n/index.mjs +1 -1
- package/package.json +25 -30
- package/src/Autocomplete.tsx +19 -15
- package/src/Checkbox.tsx +3 -1
- package/src/Collection.tsx +2 -2
- package/src/ColorArea.tsx +2 -3
- package/src/ColorField.tsx +8 -6
- package/src/ColorPicker.tsx +1 -2
- package/src/ColorSlider.tsx +5 -5
- package/src/ColorSwatch.tsx +2 -2
- package/src/ColorSwatchPicker.tsx +1 -1
- package/src/ColorThumb.tsx +2 -4
- package/src/ColorWheel.tsx +2 -2
- package/src/ComboBox.tsx +3 -1
- package/src/DateField.tsx +8 -3
- package/src/DatePicker.tsx +6 -2
- package/src/Dialog.tsx +6 -2
- package/src/Disclosure.tsx +2 -3
- package/src/DropZone.tsx +1 -2
- package/src/GridList.tsx +5 -0
- package/src/Group.tsx +1 -0
- package/src/ListBox.tsx +11 -9
- package/src/Menu.tsx +53 -25
- package/src/Meter.tsx +3 -1
- package/src/NumberField.tsx +11 -2
- package/src/Popover.tsx +77 -25
- package/src/ProgressBar.tsx +3 -1
- package/src/RadioGroup.tsx +3 -1
- package/src/SearchField.tsx +6 -4
- package/src/Select.tsx +5 -2
- package/src/Slider.tsx +6 -2
- package/src/Table.tsx +35 -15
- package/src/TableLayout.ts +1 -1
- package/src/Tabs.tsx +6 -3
- package/src/TagGroup.tsx +3 -1
- package/src/TextField.tsx +6 -4
- package/src/Toast.tsx +184 -0
- package/src/Tree.tsx +67 -49
- package/src/Virtualizer.tsx +18 -3
- package/src/index.ts +16 -16
- package/src/utils.tsx +8 -10
package/dist/Menu.main.js
CHANGED
|
@@ -14,8 +14,6 @@ var $2JTht$reactariautils = require("@react-aria/utils");
|
|
|
14
14
|
var $2JTht$reactstatelyselection = require("@react-stately/selection");
|
|
15
15
|
var $2JTht$reactariainteractions = require("@react-aria/interactions");
|
|
16
16
|
var $2JTht$react = require("react");
|
|
17
|
-
var $2JTht$reactstatelymenu = require("@react-stately/menu");
|
|
18
|
-
var $2JTht$reactariamenu = require("@react-aria/menu");
|
|
19
17
|
|
|
20
18
|
|
|
21
19
|
function $parcel$interopDefault(a) {
|
|
@@ -60,8 +58,6 @@ $parcel$export(module.exports, "MenuItem", () => $a8f6e7d095d1cc86$export$2ce376
|
|
|
60
58
|
|
|
61
59
|
|
|
62
60
|
|
|
63
|
-
|
|
64
|
-
|
|
65
61
|
const $a8f6e7d095d1cc86$export$c7e742effb1c51e2 = /*#__PURE__*/ (0, $2JTht$react.createContext)(null);
|
|
66
62
|
const $a8f6e7d095d1cc86$export$24aad8519b95b41b = /*#__PURE__*/ (0, $2JTht$react.createContext)(null);
|
|
67
63
|
const $a8f6e7d095d1cc86$export$795aec4671cbae19 = /*#__PURE__*/ (0, $2JTht$react.createContext)(null);
|
|
@@ -111,7 +107,8 @@ function $a8f6e7d095d1cc86$export$27d2ad3c5815583e(props) {
|
|
|
111
107
|
placement: 'bottom start',
|
|
112
108
|
style: {
|
|
113
109
|
'--trigger-width': buttonWidth
|
|
114
|
-
}
|
|
110
|
+
},
|
|
111
|
+
'aria-labelledby': menuProps['aria-labelledby']
|
|
115
112
|
}
|
|
116
113
|
]
|
|
117
114
|
]
|
|
@@ -126,16 +123,17 @@ const $a8f6e7d095d1cc86$export$ecabc99eeffab7ca = /*#__PURE__*/ (0, $2JTht$react
|
|
|
126
123
|
let { CollectionBranch: CollectionBranch } = (0, $2JTht$react.useContext)((0, $3114c2382242bdc0$exports.CollectionRendererContext));
|
|
127
124
|
let state = (0, $2JTht$react.useContext)($a8f6e7d095d1cc86$export$24aad8519b95b41b);
|
|
128
125
|
let rootMenuTriggerState = (0, $2JTht$react.useContext)($a8f6e7d095d1cc86$export$795aec4671cbae19);
|
|
129
|
-
let submenuTriggerState = (0, $2JTht$
|
|
126
|
+
let submenuTriggerState = (0, $2JTht$reactstately.useSubmenuTriggerState)({
|
|
130
127
|
triggerKey: item.key
|
|
131
128
|
}, rootMenuTriggerState);
|
|
132
129
|
let submenuRef = (0, $2JTht$react.useRef)(null);
|
|
133
130
|
let itemRef = (0, $2JTht$reactariautils.useObjectRef)(ref);
|
|
134
|
-
let { parentMenuRef: parentMenuRef } = (0, $2JTht$react.useContext)($a8f6e7d095d1cc86$var$SubmenuTriggerContext);
|
|
135
|
-
let { submenuTriggerProps: submenuTriggerProps, submenuProps: submenuProps, popoverProps: popoverProps } = (0, $2JTht$
|
|
131
|
+
let { parentMenuRef: parentMenuRef, shouldUseVirtualFocus: shouldUseVirtualFocus } = (0, $2JTht$react.useContext)($a8f6e7d095d1cc86$var$SubmenuTriggerContext);
|
|
132
|
+
let { submenuTriggerProps: submenuTriggerProps, submenuProps: submenuProps, popoverProps: popoverProps } = (0, $2JTht$reactaria.useSubmenuTrigger)({
|
|
136
133
|
parentMenuRef: parentMenuRef,
|
|
137
134
|
submenuRef: submenuRef,
|
|
138
|
-
delay: props.delay
|
|
135
|
+
delay: props.delay,
|
|
136
|
+
shouldUseVirtualFocus: shouldUseVirtualFocus
|
|
139
137
|
}, submenuTriggerState, itemRef);
|
|
140
138
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement((0, $c5ccf687772c0422$exports.Provider), {
|
|
141
139
|
values: [
|
|
@@ -162,9 +160,7 @@ const $a8f6e7d095d1cc86$export$ecabc99eeffab7ca = /*#__PURE__*/ (0, $2JTht$react
|
|
|
162
160
|
trigger: 'SubmenuTrigger',
|
|
163
161
|
triggerRef: itemRef,
|
|
164
162
|
placement: 'end top',
|
|
165
|
-
|
|
166
|
-
// @ts-ignore
|
|
167
|
-
'data-react-aria-top-layer': true,
|
|
163
|
+
'aria-labelledby': submenuProps['aria-labelledby'],
|
|
168
164
|
...popoverProps
|
|
169
165
|
}
|
|
170
166
|
]
|
|
@@ -179,22 +175,22 @@ const $a8f6e7d095d1cc86$export$d9b273488cd8ce6f = /*#__PURE__*/ (0, $2JTht$react
|
|
|
179
175
|
// Delay rendering the actual menu until we have the collection so that auto focus works properly.
|
|
180
176
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement((0, $2JTht$reactariacollections.CollectionBuilder), {
|
|
181
177
|
content: /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement((0, $2JTht$reactariacollections.Collection), props)
|
|
182
|
-
}, (collection)
|
|
178
|
+
}, (collection)=>/*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement($a8f6e7d095d1cc86$var$MenuInner, {
|
|
183
179
|
props: props,
|
|
184
180
|
collection: collection,
|
|
185
181
|
menuRef: ref
|
|
186
182
|
}));
|
|
187
183
|
});
|
|
188
184
|
function $a8f6e7d095d1cc86$var$MenuInner({ props: props, collection: collection, menuRef: ref }) {
|
|
189
|
-
let {
|
|
185
|
+
let { filter: filter, collectionProps: autocompleteMenuProps, collectionRef: collectionRef } = (0, $2JTht$react.useContext)((0, $33f48720060787fa$exports.UNSTABLE_InternalAutocompleteContext)) || {};
|
|
190
186
|
// Memoed so that useAutocomplete callback ref is properly only called once on mount and not everytime a rerender happens
|
|
191
187
|
ref = (0, $2JTht$reactariautils.useObjectRef)((0, $2JTht$react.useMemo)(()=>(0, $2JTht$reactariautils.mergeRefs)(ref, collectionRef !== undefined ? collectionRef : null), [
|
|
192
188
|
collectionRef,
|
|
193
189
|
ref
|
|
194
190
|
]));
|
|
195
|
-
let filteredCollection = (0, $2JTht$react.useMemo)(()=>
|
|
191
|
+
let filteredCollection = (0, $2JTht$react.useMemo)(()=>filter ? collection.UNSTABLE_filter(filter) : collection, [
|
|
196
192
|
collection,
|
|
197
|
-
|
|
193
|
+
filter
|
|
198
194
|
]);
|
|
199
195
|
let state = (0, $2JTht$reactstately.useTreeState)({
|
|
200
196
|
...props,
|
|
@@ -213,14 +209,24 @@ function $a8f6e7d095d1cc86$var$MenuInner({ props: props, collection: collection,
|
|
|
213
209
|
defaultClassName: 'react-aria-Menu',
|
|
214
210
|
className: props.className,
|
|
215
211
|
style: props.style,
|
|
216
|
-
values: {
|
|
212
|
+
values: {
|
|
213
|
+
isEmpty: state.collection.size === 0
|
|
214
|
+
}
|
|
217
215
|
});
|
|
216
|
+
let emptyState = null;
|
|
217
|
+
if (state.collection.size === 0 && props.renderEmptyState) emptyState = /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement("div", {
|
|
218
|
+
role: "menuitem",
|
|
219
|
+
style: {
|
|
220
|
+
display: 'contents'
|
|
221
|
+
}
|
|
222
|
+
}, props.renderEmptyState());
|
|
218
223
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement((0, $2JTht$reactaria.FocusScope), null, /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement("div", {
|
|
219
224
|
...(0, $2JTht$reactariautils.filterDOMProps)(props),
|
|
220
225
|
...menuProps,
|
|
221
226
|
...renderProps,
|
|
222
227
|
ref: ref,
|
|
223
228
|
slot: props.slot || undefined,
|
|
229
|
+
"data-empty": state.collection.size === 0 || undefined,
|
|
224
230
|
onScroll: props.onScroll
|
|
225
231
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement((0, $c5ccf687772c0422$exports.Provider), {
|
|
226
232
|
values: [
|
|
@@ -244,23 +250,32 @@ function $a8f6e7d095d1cc86$var$MenuInner({ props: props, collection: collection,
|
|
|
244
250
|
[
|
|
245
251
|
$a8f6e7d095d1cc86$var$SubmenuTriggerContext,
|
|
246
252
|
{
|
|
247
|
-
parentMenuRef: ref
|
|
253
|
+
parentMenuRef: ref,
|
|
254
|
+
shouldUseVirtualFocus: autocompleteMenuProps === null || autocompleteMenuProps === void 0 ? void 0 : autocompleteMenuProps.shouldUseVirtualFocus
|
|
248
255
|
}
|
|
249
256
|
],
|
|
250
257
|
[
|
|
251
258
|
$a8f6e7d095d1cc86$var$MenuItemContext,
|
|
252
259
|
null
|
|
253
260
|
],
|
|
261
|
+
[
|
|
262
|
+
(0, $33f48720060787fa$exports.UNSTABLE_InternalAutocompleteContext),
|
|
263
|
+
null
|
|
264
|
+
],
|
|
254
265
|
[
|
|
255
266
|
$a8f6e7d095d1cc86$var$SelectionManagerContext,
|
|
256
267
|
state.selectionManager
|
|
268
|
+
],
|
|
269
|
+
/* Ensure root MenuTriggerState is defined, in case Menu is rendered outside a MenuTrigger. */ /* We assume the context can never change between defined and undefined. */ /* eslint-disable-next-line react-hooks/rules-of-hooks */ [
|
|
270
|
+
$a8f6e7d095d1cc86$export$795aec4671cbae19,
|
|
271
|
+
triggerState !== null && triggerState !== void 0 ? triggerState : (0, $2JTht$reactstately.useMenuTriggerState)({})
|
|
257
272
|
]
|
|
258
273
|
]
|
|
259
274
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement(CollectionRoot, {
|
|
260
275
|
collection: state.collection,
|
|
261
276
|
persistedKeys: (0, $3114c2382242bdc0$exports.usePersistedKeys)(state.selectionManager.focusedKey),
|
|
262
277
|
scrollRef: ref
|
|
263
|
-
}))));
|
|
278
|
+
})), emptyState));
|
|
264
279
|
}
|
|
265
280
|
// A subclass of SelectionManager that forwards focus-related properties to the parent,
|
|
266
281
|
// but has its own local selection state.
|
|
@@ -343,8 +358,7 @@ const $a8f6e7d095d1cc86$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $2JTht$react
|
|
|
343
358
|
key: item.key,
|
|
344
359
|
selectionManager: selectionManager
|
|
345
360
|
}, state, ref);
|
|
346
|
-
let {
|
|
347
|
-
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $2JTht$reactariainteractions.useHover)({
|
|
361
|
+
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $2JTht$reactaria.useHover)({
|
|
348
362
|
isDisabled: states.isDisabled
|
|
349
363
|
});
|
|
350
364
|
let renderProps = (0, $c5ccf687772c0422$exports.useRenderProps)({
|
|
@@ -355,7 +369,7 @@ const $a8f6e7d095d1cc86$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $2JTht$react
|
|
|
355
369
|
values: {
|
|
356
370
|
...states,
|
|
357
371
|
isHovered: isHovered,
|
|
358
|
-
isFocusVisible: isFocusVisible,
|
|
372
|
+
isFocusVisible: states.isFocusVisible,
|
|
359
373
|
selectionMode: selectionManager.selectionMode,
|
|
360
374
|
selectionBehavior: selectionManager.selectionBehavior,
|
|
361
375
|
hasSubmenu: !!props['aria-haspopup'],
|
|
@@ -364,13 +378,13 @@ const $a8f6e7d095d1cc86$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $2JTht$react
|
|
|
364
378
|
});
|
|
365
379
|
let ElementType = props.href ? 'a' : 'div';
|
|
366
380
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($2JTht$react))).createElement(ElementType, {
|
|
367
|
-
...(0, $2JTht$reactaria.mergeProps)(menuItemProps,
|
|
381
|
+
...(0, $2JTht$reactaria.mergeProps)(menuItemProps, hoverProps),
|
|
368
382
|
...renderProps,
|
|
369
383
|
ref: ref,
|
|
370
384
|
"data-disabled": states.isDisabled || undefined,
|
|
371
385
|
"data-hovered": isHovered || undefined,
|
|
372
386
|
"data-focused": states.isFocused || undefined,
|
|
373
|
-
"data-focus-visible": isFocusVisible || undefined,
|
|
387
|
+
"data-focus-visible": states.isFocusVisible || undefined,
|
|
374
388
|
"data-pressed": states.isPressed || undefined,
|
|
375
389
|
"data-selected": states.isSelected || undefined,
|
|
376
390
|
"data-selection-mode": selectionManager.selectionMode === 'none' ? undefined : selectionManager.selectionMode,
|
|
@@ -382,6 +396,7 @@ const $a8f6e7d095d1cc86$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $2JTht$react
|
|
|
382
396
|
(0, $a8a589c28affdc40$exports.TextContext),
|
|
383
397
|
{
|
|
384
398
|
slots: {
|
|
399
|
+
[(0, $c5ccf687772c0422$exports.DEFAULT_SLOT)]: labelProps,
|
|
385
400
|
label: labelProps,
|
|
386
401
|
description: descriptionProps
|
|
387
402
|
}
|
package/dist/Menu.main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/react-aria-components/src/Menu.tsx"],"sourcesContent":["/*\n * Copyright 2022 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, FocusScope, mergeProps, useFocusRing, useMenu, useMenuItem, useMenuSection, useMenuTrigger} from 'react-aria';\nimport {BaseCollection, Collection, CollectionBuilder, createBranchComponent, createLeafComponent} from '@react-aria/collections';\nimport {MenuTriggerProps as BaseMenuTriggerProps, Collection as ICollection, Node, TreeState, useMenuTriggerState, useTreeState} from 'react-stately';\nimport {CollectionProps, CollectionRendererContext, ItemRenderProps, SectionContext, SectionProps, usePersistedKeys} from './Collection';\nimport {ContextValue, Provider, RenderProps, ScrollableProps, SlotProps, StyleProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {filterDOMProps, mergeRefs, useObjectRef, useResizeObserver} from '@react-aria/utils';\nimport {FocusStrategy, forwardRefType, HoverEvents, Key, LinkDOMProps, MultipleSelection} from '@react-types/shared';\nimport {HeaderContext} from './Header';\nimport {KeyboardContext} from './Keyboard';\nimport {MultipleSelectionState, SelectionManager, useMultipleSelectionState} from '@react-stately/selection';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport {PressResponder, useHover} from '@react-aria/interactions';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n ReactElement,\n ReactNode,\n RefObject,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport {RootMenuTriggerState, useSubmenuTriggerState} from '@react-stately/menu';\nimport {SeparatorContext} from './Separator';\nimport {TextContext} from './Text';\nimport {UNSTABLE_InternalAutocompleteContext} from './Autocomplete';\nimport {useSubmenuTrigger} from '@react-aria/menu';\n\nexport const MenuContext = createContext<ContextValue<MenuProps<any>, HTMLDivElement>>(null);\nexport const MenuStateContext = createContext<TreeState<any> | null>(null);\nexport const RootMenuTriggerStateContext = createContext<RootMenuTriggerState | null>(null);\nconst SelectionManagerContext = createContext<SelectionManager | null>(null);\n\nexport interface MenuTriggerProps extends BaseMenuTriggerProps {\n children: ReactNode\n}\n\nexport function MenuTrigger(props: MenuTriggerProps) {\n let state = useMenuTriggerState(props);\n let ref = useRef<HTMLButtonElement>(null);\n let {menuTriggerProps, menuProps} = useMenuTrigger({\n ...props,\n type: 'menu'\n }, state, ref);\n // Allows menu width to match button\n let [buttonWidth, setButtonWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (ref.current) {\n setButtonWidth(ref.current.offsetWidth + 'px');\n }\n }, [ref]);\n\n useResizeObserver({\n ref: ref,\n onResize: onResize\n });\n\n let scrollRef = useRef(null);\n\n return (\n <Provider\n values={[\n [MenuContext, {...menuProps, ref: scrollRef}],\n [OverlayTriggerStateContext, state],\n [RootMenuTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'MenuTrigger',\n triggerRef: ref,\n scrollRef,\n placement: 'bottom start',\n style: {'--trigger-width': buttonWidth} as React.CSSProperties\n }]\n ]}>\n <PressResponder {...menuTriggerProps} ref={ref} isPressed={state.isOpen}>\n {props.children}\n </PressResponder>\n </Provider>\n );\n}\n\nexport interface SubmenuTriggerProps {\n /**\n * The contents of the SubmenuTrigger. The first child should be an Item (the trigger) and the second child should be the Popover (for the submenu).\n */\n children: ReactElement[],\n /**\n * The delay time in milliseconds for the submenu to appear after hovering over the trigger.\n * @default 200\n */\n delay?: number\n}\n\nconst SubmenuTriggerContext = createContext<{parentMenuRef: RefObject<HTMLElement | null>} | null>(null);\n\n/**\n * A submenu trigger is used to wrap a submenu's trigger item and the submenu itself.\n *\n * @version alpha\n */\nexport const SubmenuTrigger = /*#__PURE__*/ createBranchComponent('submenutrigger', (props: SubmenuTriggerProps, ref: ForwardedRef<HTMLDivElement>, item) => {\n let {CollectionBranch} = useContext(CollectionRendererContext);\n let state = useContext(MenuStateContext)!;\n let rootMenuTriggerState = useContext(RootMenuTriggerStateContext)!;\n let submenuTriggerState = useSubmenuTriggerState({triggerKey: item.key}, rootMenuTriggerState);\n let submenuRef = useRef<HTMLDivElement>(null);\n let itemRef = useObjectRef(ref);\n let {parentMenuRef} = useContext(SubmenuTriggerContext)!;\n let {submenuTriggerProps, submenuProps, popoverProps} = useSubmenuTrigger({\n parentMenuRef,\n submenuRef,\n delay: props.delay\n }, submenuTriggerState, itemRef);\n\n return (\n <Provider\n values={[\n [MenuItemContext, {...submenuTriggerProps, onAction: undefined, ref: itemRef}],\n [MenuContext, submenuProps],\n [OverlayTriggerStateContext, submenuTriggerState],\n [PopoverContext, {\n ref: submenuRef,\n trigger: 'SubmenuTrigger',\n triggerRef: itemRef,\n placement: 'end top',\n // Prevent parent popover from hiding submenu.\n // @ts-ignore\n 'data-react-aria-top-layer': true,\n ...popoverProps\n }]\n ]}>\n <CollectionBranch collection={state.collection} parent={item} />\n {props.children[1]}\n </Provider>\n );\n}, props => props.children[0]);\n\nexport interface MenuProps<T> extends Omit<AriaMenuProps<T>, 'children'>, CollectionProps<T>, StyleProps, SlotProps, ScrollableProps<HTMLDivElement> {}\n\n/**\n * A menu displays a list of actions or options that a user can choose.\n */\nexport const Menu = /*#__PURE__*/ (forwardRef as forwardRefType)(function Menu<T extends object>(props: MenuProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, MenuContext);\n\n // Delay rendering the actual menu until we have the collection so that auto focus works properly.\n return (\n <CollectionBuilder content={<Collection {...props} />}>\n {collection => collection.size > 0 && <MenuInner props={props} collection={collection} menuRef={ref} />}\n </CollectionBuilder>\n );\n});\n\ninterface MenuInnerProps<T> {\n props: MenuProps<T>,\n collection: BaseCollection<object>,\n menuRef: RefObject<HTMLDivElement | null>\n}\n\nfunction MenuInner<T extends object>({props, collection, menuRef: ref}: MenuInnerProps<T>) {\n let {filterFn, collectionProps: autocompleteMenuProps, collectionRef} = useContext(UNSTABLE_InternalAutocompleteContext) || {};\n // Memoed so that useAutocomplete callback ref is properly only called once on mount and not everytime a rerender happens\n ref = useObjectRef(useMemo(() => mergeRefs(ref, collectionRef !== undefined ? collectionRef as RefObject<HTMLDivElement> : null), [collectionRef, ref]));\n let filteredCollection = useMemo(() => filterFn ? collection.filter(filterFn) : collection, [collection, filterFn]);\n let state = useTreeState({\n ...props,\n collection: filteredCollection as ICollection<Node<object>>,\n children: undefined\n });\n let triggerState = useContext(RootMenuTriggerStateContext);\n let {isVirtualized, CollectionRoot} = useContext(CollectionRendererContext);\n let {menuProps} = useMenu({...props, ...autocompleteMenuProps, isVirtualized, onClose: props.onClose || triggerState?.close}, state, ref);\n let renderProps = useRenderProps({\n defaultClassName: 'react-aria-Menu',\n className: props.className,\n style: props.style,\n values: {}\n });\n\n return (\n <FocusScope>\n <div\n {...filterDOMProps(props)}\n {...menuProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n onScroll={props.onScroll}>\n <Provider\n values={[\n [MenuStateContext, state],\n [SeparatorContext, {elementType: 'div'}],\n [SectionContext, {name: 'MenuSection', render: MenuSectionInner}],\n [SubmenuTriggerContext, {parentMenuRef: ref}],\n [MenuItemContext, null],\n [SelectionManagerContext, state.selectionManager]\n ]}>\n <CollectionRoot\n collection={state.collection}\n persistedKeys={usePersistedKeys(state.selectionManager.focusedKey)}\n scrollRef={ref} />\n </Provider>\n </div>\n </FocusScope>\n );\n}\n\nexport interface MenuSectionProps<T> extends SectionProps<T>, MultipleSelection {}\n\n// A subclass of SelectionManager that forwards focus-related properties to the parent,\n// but has its own local selection state.\nclass GroupSelectionManager extends SelectionManager {\n private parent: SelectionManager;\n\n constructor(parent: SelectionManager, state: MultipleSelectionState) {\n super(parent.collection, state);\n this.parent = parent;\n }\n\n get focusedKey() {\n return this.parent.focusedKey;\n }\n\n get isFocused() {\n return this.parent.isFocused;\n }\n\n setFocusedKey(key: Key | null, childFocusStrategy?: FocusStrategy): void {\n return this.parent.setFocusedKey(key, childFocusStrategy);\n }\n\n setFocused(isFocused: boolean): void {\n this.parent.setFocused(isFocused);\n }\n\n get childFocusStrategy() {\n return this.parent.childFocusStrategy;\n }\n}\n\nfunction MenuSectionInner<T extends object>(props: MenuSectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>, className = 'react-aria-MenuSection') {\n let state = useContext(MenuStateContext)!;\n let {CollectionBranch} = useContext(CollectionRendererContext);\n let [headingRef, heading] = useSlot();\n let {headingProps, groupProps} = useMenuSection({\n heading,\n 'aria-label': section.props['aria-label'] ?? undefined\n });\n let renderProps = useRenderProps({\n defaultClassName: className,\n className: section.props?.className,\n style: section.props?.style,\n values: {}\n });\n\n let parent = useContext(SelectionManagerContext)!;\n let selectionState = useMultipleSelectionState(props);\n let manager = props.selectionMode != null ? new GroupSelectionManager(parent, selectionState) : parent;\n\n return (\n <section\n {...filterDOMProps(props as any)}\n {...groupProps}\n {...renderProps}\n ref={ref}>\n <Provider\n values={[\n [HeaderContext, {...headingProps, ref: headingRef}],\n [SelectionManagerContext, manager]\n ]}>\n <CollectionBranch collection={state.collection} parent={section} />\n </Provider>\n </section>\n );\n}\n\n/**\n * A MenuSection represents a section within a Menu.\n */\nexport const MenuSection = /*#__PURE__*/ createBranchComponent('section', MenuSectionInner);\n\nexport interface MenuItemRenderProps extends ItemRenderProps {\n /**\n * Whether the item has a submenu.\n *\n * @selector [data-has-submenu]\n */\n hasSubmenu: boolean,\n /**\n * Whether the item's submenu is open.\n *\n * @selector [data-open]\n */\n isOpen: boolean\n}\n\nexport interface MenuItemProps<T = object> extends RenderProps<MenuItemRenderProps>, LinkDOMProps, HoverEvents {\n /** The unique id of the item. */\n id?: Key,\n /** The object value that this item represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** A string representation of the item's contents, used for features like typeahead. */\n textValue?: string,\n /** An accessibility label for this item. */\n 'aria-label'?: string,\n /** Whether the item is disabled. */\n isDisabled?: boolean,\n /** Handler that is called when the item is selected. */\n onAction?: () => void\n}\n\nconst MenuItemContext = createContext<ContextValue<MenuItemProps, HTMLDivElement>>(null);\n\n/**\n * A MenuItem represents an individual action in a Menu.\n */\nexport const MenuItem = /*#__PURE__*/ createLeafComponent('item', function MenuItem<T extends object>(props: MenuItemProps<T>, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<T>) {\n [props, forwardedRef] = useContextProps(props, forwardedRef, MenuItemContext);\n let id = useSlottedContext(MenuItemContext)?.id as string;\n let state = useContext(MenuStateContext)!;\n let ref = useObjectRef<any>(forwardedRef);\n let selectionManager = useContext(SelectionManagerContext)!;\n\n let {menuItemProps, labelProps, descriptionProps, keyboardShortcutProps, ...states} = useMenuItem({\n ...props,\n id,\n key: item.key,\n selectionManager\n }, state, ref);\n\n let {isFocusVisible, focusProps} = useFocusRing();\n let {hoverProps, isHovered} = useHover({\n isDisabled: states.isDisabled\n });\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-MenuItem',\n values: {\n ...states,\n isHovered,\n isFocusVisible,\n selectionMode: selectionManager.selectionMode,\n selectionBehavior: selectionManager.selectionBehavior,\n hasSubmenu: !!props['aria-haspopup'],\n isOpen: props['aria-expanded'] === 'true'\n }\n });\n\n let ElementType: React.ElementType = props.href ? 'a' : 'div';\n\n return (\n <ElementType\n {...mergeProps(menuItemProps, focusProps, hoverProps)}\n {...renderProps}\n ref={ref}\n data-disabled={states.isDisabled || undefined}\n data-hovered={isHovered || undefined}\n data-focused={states.isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-pressed={states.isPressed || undefined}\n data-selected={states.isSelected || undefined}\n data-selection-mode={selectionManager.selectionMode === 'none' ? undefined : selectionManager.selectionMode}\n data-has-submenu={!!props['aria-haspopup'] || undefined}\n data-open={props['aria-expanded'] === 'true' || undefined}>\n <Provider\n values={[\n [TextContext, {\n slots: {\n label: labelProps,\n description: descriptionProps\n }\n }],\n [KeyboardContext, keyboardShortcutProps]\n ]}>\n {renderProps.children}\n </Provider>\n </ElementType>\n );\n});\n"],"names":[],"version":3,"file":"Menu.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/react-aria-components/src/Menu.tsx"],"sourcesContent":["/*\n * Copyright 2022 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, FocusScope, mergeProps, useHover, useMenu, useMenuItem, useMenuSection, useMenuTrigger, useSubmenuTrigger} from 'react-aria';\nimport {BaseCollection, Collection, CollectionBuilder, createBranchComponent, createLeafComponent} from '@react-aria/collections';\nimport {MenuTriggerProps as BaseMenuTriggerProps, Collection as ICollection, Node, RootMenuTriggerState, TreeState, useMenuTriggerState, useSubmenuTriggerState, useTreeState} from 'react-stately';\nimport {CollectionProps, CollectionRendererContext, ItemRenderProps, SectionContext, SectionProps, usePersistedKeys} from './Collection';\nimport {ContextValue, DEFAULT_SLOT, Provider, RenderProps, ScrollableProps, SlotProps, StyleRenderProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {filterDOMProps, mergeRefs, useObjectRef, useResizeObserver} from '@react-aria/utils';\nimport {FocusStrategy, forwardRefType, HoverEvents, Key, LinkDOMProps, MultipleSelection} from '@react-types/shared';\nimport {HeaderContext} from './Header';\nimport {KeyboardContext} from './Keyboard';\nimport {MultipleSelectionState, SelectionManager, useMultipleSelectionState} from '@react-stately/selection';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport {PressResponder} from '@react-aria/interactions';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n ReactElement,\n ReactNode,\n RefObject,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport {SeparatorContext} from './Separator';\nimport {TextContext} from './Text';\nimport {UNSTABLE_InternalAutocompleteContext} from './Autocomplete';\n\nexport const MenuContext = createContext<ContextValue<MenuProps<any>, HTMLDivElement>>(null);\nexport const MenuStateContext = createContext<TreeState<any> | null>(null);\nexport const RootMenuTriggerStateContext = createContext<RootMenuTriggerState | null>(null);\nconst SelectionManagerContext = createContext<SelectionManager | null>(null);\n\nexport interface MenuTriggerProps extends BaseMenuTriggerProps {\n children: ReactNode\n}\n\nexport function MenuTrigger(props: MenuTriggerProps) {\n let state = useMenuTriggerState(props);\n let ref = useRef<HTMLButtonElement>(null);\n let {menuTriggerProps, menuProps} = useMenuTrigger({\n ...props,\n type: 'menu'\n }, state, ref);\n // Allows menu width to match button\n let [buttonWidth, setButtonWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (ref.current) {\n setButtonWidth(ref.current.offsetWidth + 'px');\n }\n }, [ref]);\n\n useResizeObserver({\n ref: ref,\n onResize: onResize\n });\n let scrollRef = useRef(null);\n\n return (\n <Provider\n values={[\n [MenuContext, {...menuProps, ref: scrollRef}],\n [OverlayTriggerStateContext, state],\n [RootMenuTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'MenuTrigger',\n triggerRef: ref,\n scrollRef,\n placement: 'bottom start',\n style: {'--trigger-width': buttonWidth} as React.CSSProperties,\n 'aria-labelledby': menuProps['aria-labelledby']\n }]\n ]}>\n <PressResponder {...menuTriggerProps} ref={ref} isPressed={state.isOpen}>\n {props.children}\n </PressResponder>\n </Provider>\n );\n}\n\nexport interface SubmenuTriggerProps {\n /**\n * The contents of the SubmenuTrigger. The first child should be an Item (the trigger) and the second child should be the Popover (for the submenu).\n */\n children: ReactElement[],\n /**\n * The delay time in milliseconds for the submenu to appear after hovering over the trigger.\n * @default 200\n */\n delay?: number\n}\n\nconst SubmenuTriggerContext = createContext<{parentMenuRef: RefObject<HTMLElement | null>, shouldUseVirtualFocus?: boolean} | null>(null);\n\n/**\n * A submenu trigger is used to wrap a submenu's trigger item and the submenu itself.\n *\n * @version alpha\n */\nexport const SubmenuTrigger = /*#__PURE__*/ createBranchComponent('submenutrigger', (props: SubmenuTriggerProps, ref: ForwardedRef<HTMLDivElement>, item) => {\n let {CollectionBranch} = useContext(CollectionRendererContext);\n let state = useContext(MenuStateContext)!;\n let rootMenuTriggerState = useContext(RootMenuTriggerStateContext)!;\n let submenuTriggerState = useSubmenuTriggerState({triggerKey: item.key}, rootMenuTriggerState);\n let submenuRef = useRef<HTMLDivElement>(null);\n let itemRef = useObjectRef(ref);\n let {parentMenuRef, shouldUseVirtualFocus} = useContext(SubmenuTriggerContext)!;\n let {submenuTriggerProps, submenuProps, popoverProps} = useSubmenuTrigger({\n parentMenuRef,\n submenuRef,\n delay: props.delay,\n shouldUseVirtualFocus\n }, submenuTriggerState, itemRef);\n\n return (\n <Provider\n values={[\n [MenuItemContext, {...submenuTriggerProps, onAction: undefined, ref: itemRef}],\n [MenuContext, submenuProps],\n [OverlayTriggerStateContext, submenuTriggerState],\n [PopoverContext, {\n ref: submenuRef,\n trigger: 'SubmenuTrigger',\n triggerRef: itemRef,\n placement: 'end top',\n 'aria-labelledby': submenuProps['aria-labelledby'],\n ...popoverProps\n }]\n ]}>\n <CollectionBranch collection={state.collection} parent={item} />\n {props.children[1]}\n </Provider>\n );\n}, props => props.children[0]);\n\nexport interface MenuRenderProps {\n /**\n * Whether the menu has no items and should display its empty state.\n * @selector [data-empty]\n */\n isEmpty: boolean\n}\n\nexport interface MenuProps<T> extends Omit<AriaMenuProps<T>, 'children'>, CollectionProps<T>, StyleRenderProps<MenuRenderProps>, SlotProps, ScrollableProps<HTMLDivElement> {\n /** Provides content to display when there are no items in the list. */\n renderEmptyState?: () => ReactNode\n}\n\n/**\n * A menu displays a list of actions or options that a user can choose.\n */\nexport const Menu = /*#__PURE__*/ (forwardRef as forwardRefType)(function Menu<T extends object>(props: MenuProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, MenuContext);\n\n // Delay rendering the actual menu until we have the collection so that auto focus works properly.\n return (\n <CollectionBuilder content={<Collection {...props} />}>\n {collection => <MenuInner props={props} collection={collection} menuRef={ref} />}\n </CollectionBuilder>\n );\n});\n\ninterface MenuInnerProps<T> {\n props: MenuProps<T>,\n collection: BaseCollection<object>,\n menuRef: RefObject<HTMLDivElement | null>\n}\n\nfunction MenuInner<T extends object>({props, collection, menuRef: ref}: MenuInnerProps<T>) {\n let {filter, collectionProps: autocompleteMenuProps, collectionRef} = useContext(UNSTABLE_InternalAutocompleteContext) || {};\n // Memoed so that useAutocomplete callback ref is properly only called once on mount and not everytime a rerender happens\n ref = useObjectRef(useMemo(() => mergeRefs(ref, collectionRef !== undefined ? collectionRef as RefObject<HTMLDivElement> : null), [collectionRef, ref]));\n let filteredCollection = useMemo(() => filter ? collection.UNSTABLE_filter(filter) : collection, [collection, filter]);\n let state = useTreeState({\n ...props,\n collection: filteredCollection as ICollection<Node<object>>,\n children: undefined\n });\n let triggerState = useContext(RootMenuTriggerStateContext);\n let {isVirtualized, CollectionRoot} = useContext(CollectionRendererContext);\n let {menuProps} = useMenu({...props, ...autocompleteMenuProps, isVirtualized, onClose: props.onClose || triggerState?.close}, state, ref);\n let renderProps = useRenderProps({\n defaultClassName: 'react-aria-Menu',\n className: props.className,\n style: props.style,\n values: {\n isEmpty: state.collection.size === 0\n }\n });\n\n let emptyState: ReactElement | null = null;\n if (state.collection.size === 0 && props.renderEmptyState) {\n emptyState = (\n <div\n role=\"menuitem\"\n style={{display: 'contents'}}>\n {props.renderEmptyState()}\n </div>\n );\n }\n\n return (\n <FocusScope>\n <div\n {...filterDOMProps(props)}\n {...menuProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-empty={state.collection.size === 0 || undefined}\n onScroll={props.onScroll}>\n <Provider\n values={[\n [MenuStateContext, state],\n [SeparatorContext, {elementType: 'div'}],\n [SectionContext, {name: 'MenuSection', render: MenuSectionInner}],\n [SubmenuTriggerContext, {parentMenuRef: ref, shouldUseVirtualFocus: autocompleteMenuProps?.shouldUseVirtualFocus}],\n [MenuItemContext, null],\n [UNSTABLE_InternalAutocompleteContext, null],\n [SelectionManagerContext, state.selectionManager],\n /* Ensure root MenuTriggerState is defined, in case Menu is rendered outside a MenuTrigger. */\n /* We assume the context can never change between defined and undefined. */\n /* eslint-disable-next-line react-hooks/rules-of-hooks */\n [RootMenuTriggerStateContext, triggerState ?? useMenuTriggerState({})]\n ]}>\n <CollectionRoot\n collection={state.collection}\n persistedKeys={usePersistedKeys(state.selectionManager.focusedKey)}\n scrollRef={ref} />\n </Provider>\n {emptyState}\n </div>\n </FocusScope>\n );\n}\n\nexport interface MenuSectionProps<T> extends SectionProps<T>, MultipleSelection {}\n\n// A subclass of SelectionManager that forwards focus-related properties to the parent,\n// but has its own local selection state.\nclass GroupSelectionManager extends SelectionManager {\n private parent: SelectionManager;\n\n constructor(parent: SelectionManager, state: MultipleSelectionState) {\n super(parent.collection, state);\n this.parent = parent;\n }\n\n get focusedKey() {\n return this.parent.focusedKey;\n }\n\n get isFocused() {\n return this.parent.isFocused;\n }\n\n setFocusedKey(key: Key | null, childFocusStrategy?: FocusStrategy): void {\n return this.parent.setFocusedKey(key, childFocusStrategy);\n }\n\n setFocused(isFocused: boolean): void {\n this.parent.setFocused(isFocused);\n }\n\n get childFocusStrategy() {\n return this.parent.childFocusStrategy;\n }\n}\n\nfunction MenuSectionInner<T extends object>(props: MenuSectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>, className = 'react-aria-MenuSection') {\n let state = useContext(MenuStateContext)!;\n let {CollectionBranch} = useContext(CollectionRendererContext);\n let [headingRef, heading] = useSlot();\n let {headingProps, groupProps} = useMenuSection({\n heading,\n 'aria-label': section.props['aria-label'] ?? undefined\n });\n let renderProps = useRenderProps({\n defaultClassName: className,\n className: section.props?.className,\n style: section.props?.style,\n values: {}\n });\n\n let parent = useContext(SelectionManagerContext)!;\n let selectionState = useMultipleSelectionState(props);\n let manager = props.selectionMode != null ? new GroupSelectionManager(parent, selectionState) : parent;\n\n return (\n <section\n {...filterDOMProps(props as any)}\n {...groupProps}\n {...renderProps}\n ref={ref}>\n <Provider\n values={[\n [HeaderContext, {...headingProps, ref: headingRef}],\n [SelectionManagerContext, manager]\n ]}>\n <CollectionBranch collection={state.collection} parent={section} />\n </Provider>\n </section>\n );\n}\n\n/**\n * A MenuSection represents a section within a Menu.\n */\nexport const MenuSection = /*#__PURE__*/ createBranchComponent('section', MenuSectionInner);\n\nexport interface MenuItemRenderProps extends ItemRenderProps {\n /**\n * Whether the item has a submenu.\n *\n * @selector [data-has-submenu]\n */\n hasSubmenu: boolean,\n /**\n * Whether the item's submenu is open.\n *\n * @selector [data-open]\n */\n isOpen: boolean\n}\n\nexport interface MenuItemProps<T = object> extends RenderProps<MenuItemRenderProps>, LinkDOMProps, HoverEvents {\n /** The unique id of the item. */\n id?: Key,\n /** The object value that this item represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** A string representation of the item's contents, used for features like typeahead. */\n textValue?: string,\n /** An accessibility label for this item. */\n 'aria-label'?: string,\n /** Whether the item is disabled. */\n isDisabled?: boolean,\n /** Handler that is called when the item is selected. */\n onAction?: () => void\n}\n\nconst MenuItemContext = createContext<ContextValue<MenuItemProps, HTMLDivElement>>(null);\n\n/**\n * A MenuItem represents an individual action in a Menu.\n */\nexport const MenuItem = /*#__PURE__*/ createLeafComponent('item', function MenuItem<T extends object>(props: MenuItemProps<T>, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<T>) {\n [props, forwardedRef] = useContextProps(props, forwardedRef, MenuItemContext);\n let id = useSlottedContext(MenuItemContext)?.id as string;\n let state = useContext(MenuStateContext)!;\n let ref = useObjectRef<any>(forwardedRef);\n let selectionManager = useContext(SelectionManagerContext)!;\n\n let {menuItemProps, labelProps, descriptionProps, keyboardShortcutProps, ...states} = useMenuItem({\n ...props,\n id,\n key: item.key,\n selectionManager\n }, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n isDisabled: states.isDisabled\n });\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-MenuItem',\n values: {\n ...states,\n isHovered,\n isFocusVisible: states.isFocusVisible,\n selectionMode: selectionManager.selectionMode,\n selectionBehavior: selectionManager.selectionBehavior,\n hasSubmenu: !!props['aria-haspopup'],\n isOpen: props['aria-expanded'] === 'true'\n }\n });\n\n let ElementType: React.ElementType = props.href ? 'a' : 'div';\n\n return (\n <ElementType\n {...mergeProps(menuItemProps, hoverProps)}\n {...renderProps}\n ref={ref}\n data-disabled={states.isDisabled || undefined}\n data-hovered={isHovered || undefined}\n data-focused={states.isFocused || undefined}\n data-focus-visible={states.isFocusVisible || undefined}\n data-pressed={states.isPressed || undefined}\n data-selected={states.isSelected || undefined}\n data-selection-mode={selectionManager.selectionMode === 'none' ? undefined : selectionManager.selectionMode}\n data-has-submenu={!!props['aria-haspopup'] || undefined}\n data-open={props['aria-expanded'] === 'true' || undefined}>\n <Provider\n values={[\n [TextContext, {\n slots: {\n [DEFAULT_SLOT]: labelProps,\n label: labelProps,\n description: descriptionProps\n }\n }],\n [KeyboardContext, keyboardShortcutProps]\n ]}>\n {renderProps.children}\n </Provider>\n </ElementType>\n );\n});\n"],"names":[],"version":3,"file":"Menu.main.js.map"}
|
package/dist/Menu.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {CollectionRendererContext as $7135fc7d473fd974$export$4feb769f8ddf26c5, SectionContext as $7135fc7d473fd974$export$d40e14dec8b060a8, usePersistedKeys as $7135fc7d473fd974$export$90e00781bc59d8f9} from "./Collection.mjs";
|
|
2
|
-
import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, useSlottedContext as $64fa3d84918910a7$export$fabf2dc03a41866e} from "./utils.mjs";
|
|
2
|
+
import {DEFAULT_SLOT as $64fa3d84918910a7$export$c62b8e45d58ddad9, Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, useSlottedContext as $64fa3d84918910a7$export$fabf2dc03a41866e} from "./utils.mjs";
|
|
3
3
|
import {HeaderContext as $72a5793c14baf454$export$e0e4026c12a8bdbb} from "./Header.mjs";
|
|
4
4
|
import {KeyboardContext as $63df2425e2108aa8$export$744d98a3b8a94e1c} from "./Keyboard.mjs";
|
|
5
5
|
import {OverlayTriggerStateContext as $de32f1b87079253c$export$d2f961adcb0afbe} from "./Dialog.mjs";
|
|
@@ -7,15 +7,13 @@ import {PopoverContext as $07b14b47974efb58$export$9b9a0cd73afb7ca4} from "./Pop
|
|
|
7
7
|
import {SeparatorContext as $431f98aba6844401$export$6615d83f6de245ce} from "./Separator.mjs";
|
|
8
8
|
import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.mjs";
|
|
9
9
|
import {UNSTABLE_InternalAutocompleteContext as $d2f53cda644affe3$export$65d2a03b8800d6e3} from "./Autocomplete.mjs";
|
|
10
|
-
import {useMenuTrigger as $kM2ZM$useMenuTrigger, useMenu as $kM2ZM$useMenu, FocusScope as $kM2ZM$FocusScope, useMenuSection as $kM2ZM$useMenuSection, useMenuItem as $kM2ZM$useMenuItem,
|
|
10
|
+
import {useMenuTrigger as $kM2ZM$useMenuTrigger, useSubmenuTrigger as $kM2ZM$useSubmenuTrigger, useMenu as $kM2ZM$useMenu, FocusScope as $kM2ZM$FocusScope, useMenuSection as $kM2ZM$useMenuSection, useMenuItem as $kM2ZM$useMenuItem, useHover as $kM2ZM$useHover, mergeProps as $kM2ZM$mergeProps} from "react-aria";
|
|
11
11
|
import {createBranchComponent as $kM2ZM$createBranchComponent, CollectionBuilder as $kM2ZM$CollectionBuilder, Collection as $kM2ZM$Collection, createLeafComponent as $kM2ZM$createLeafComponent} from "@react-aria/collections";
|
|
12
|
-
import {useMenuTriggerState as $kM2ZM$useMenuTriggerState, useTreeState as $kM2ZM$useTreeState} from "react-stately";
|
|
12
|
+
import {useMenuTriggerState as $kM2ZM$useMenuTriggerState, useSubmenuTriggerState as $kM2ZM$useSubmenuTriggerState, useTreeState as $kM2ZM$useTreeState} from "react-stately";
|
|
13
13
|
import {useResizeObserver as $kM2ZM$useResizeObserver, useObjectRef as $kM2ZM$useObjectRef, mergeRefs as $kM2ZM$mergeRefs, filterDOMProps as $kM2ZM$filterDOMProps} from "@react-aria/utils";
|
|
14
14
|
import {SelectionManager as $kM2ZM$SelectionManager, useMultipleSelectionState as $kM2ZM$useMultipleSelectionState} from "@react-stately/selection";
|
|
15
|
-
import {PressResponder as $kM2ZM$PressResponder
|
|
15
|
+
import {PressResponder as $kM2ZM$PressResponder} from "@react-aria/interactions";
|
|
16
16
|
import $kM2ZM$react, {createContext as $kM2ZM$createContext, useRef as $kM2ZM$useRef, useState as $kM2ZM$useState, useCallback as $kM2ZM$useCallback, useContext as $kM2ZM$useContext, forwardRef as $kM2ZM$forwardRef, useMemo as $kM2ZM$useMemo} from "react";
|
|
17
|
-
import {useSubmenuTriggerState as $kM2ZM$useSubmenuTriggerState} from "@react-stately/menu";
|
|
18
|
-
import {useSubmenuTrigger as $kM2ZM$useSubmenuTrigger} from "@react-aria/menu";
|
|
19
17
|
|
|
20
18
|
/*
|
|
21
19
|
* Copyright 2022 Adobe. All rights reserved.
|
|
@@ -43,8 +41,6 @@ import {useSubmenuTrigger as $kM2ZM$useSubmenuTrigger} from "@react-aria/menu";
|
|
|
43
41
|
|
|
44
42
|
|
|
45
43
|
|
|
46
|
-
|
|
47
|
-
|
|
48
44
|
const $3674c52c6b3c5bce$export$c7e742effb1c51e2 = /*#__PURE__*/ (0, $kM2ZM$createContext)(null);
|
|
49
45
|
const $3674c52c6b3c5bce$export$24aad8519b95b41b = /*#__PURE__*/ (0, $kM2ZM$createContext)(null);
|
|
50
46
|
const $3674c52c6b3c5bce$export$795aec4671cbae19 = /*#__PURE__*/ (0, $kM2ZM$createContext)(null);
|
|
@@ -94,7 +90,8 @@ function $3674c52c6b3c5bce$export$27d2ad3c5815583e(props) {
|
|
|
94
90
|
placement: 'bottom start',
|
|
95
91
|
style: {
|
|
96
92
|
'--trigger-width': buttonWidth
|
|
97
|
-
}
|
|
93
|
+
},
|
|
94
|
+
'aria-labelledby': menuProps['aria-labelledby']
|
|
98
95
|
}
|
|
99
96
|
]
|
|
100
97
|
]
|
|
@@ -114,11 +111,12 @@ const $3674c52c6b3c5bce$export$ecabc99eeffab7ca = /*#__PURE__*/ (0, $kM2ZM$creat
|
|
|
114
111
|
}, rootMenuTriggerState);
|
|
115
112
|
let submenuRef = (0, $kM2ZM$useRef)(null);
|
|
116
113
|
let itemRef = (0, $kM2ZM$useObjectRef)(ref);
|
|
117
|
-
let { parentMenuRef: parentMenuRef } = (0, $kM2ZM$useContext)($3674c52c6b3c5bce$var$SubmenuTriggerContext);
|
|
114
|
+
let { parentMenuRef: parentMenuRef, shouldUseVirtualFocus: shouldUseVirtualFocus } = (0, $kM2ZM$useContext)($3674c52c6b3c5bce$var$SubmenuTriggerContext);
|
|
118
115
|
let { submenuTriggerProps: submenuTriggerProps, submenuProps: submenuProps, popoverProps: popoverProps } = (0, $kM2ZM$useSubmenuTrigger)({
|
|
119
116
|
parentMenuRef: parentMenuRef,
|
|
120
117
|
submenuRef: submenuRef,
|
|
121
|
-
delay: props.delay
|
|
118
|
+
delay: props.delay,
|
|
119
|
+
shouldUseVirtualFocus: shouldUseVirtualFocus
|
|
122
120
|
}, submenuTriggerState, itemRef);
|
|
123
121
|
return /*#__PURE__*/ (0, $kM2ZM$react).createElement((0, $64fa3d84918910a7$export$2881499e37b75b9a), {
|
|
124
122
|
values: [
|
|
@@ -145,9 +143,7 @@ const $3674c52c6b3c5bce$export$ecabc99eeffab7ca = /*#__PURE__*/ (0, $kM2ZM$creat
|
|
|
145
143
|
trigger: 'SubmenuTrigger',
|
|
146
144
|
triggerRef: itemRef,
|
|
147
145
|
placement: 'end top',
|
|
148
|
-
|
|
149
|
-
// @ts-ignore
|
|
150
|
-
'data-react-aria-top-layer': true,
|
|
146
|
+
'aria-labelledby': submenuProps['aria-labelledby'],
|
|
151
147
|
...popoverProps
|
|
152
148
|
}
|
|
153
149
|
]
|
|
@@ -162,22 +158,22 @@ const $3674c52c6b3c5bce$export$d9b273488cd8ce6f = /*#__PURE__*/ (0, $kM2ZM$forwa
|
|
|
162
158
|
// Delay rendering the actual menu until we have the collection so that auto focus works properly.
|
|
163
159
|
return /*#__PURE__*/ (0, $kM2ZM$react).createElement((0, $kM2ZM$CollectionBuilder), {
|
|
164
160
|
content: /*#__PURE__*/ (0, $kM2ZM$react).createElement((0, $kM2ZM$Collection), props)
|
|
165
|
-
}, (collection)
|
|
161
|
+
}, (collection)=>/*#__PURE__*/ (0, $kM2ZM$react).createElement($3674c52c6b3c5bce$var$MenuInner, {
|
|
166
162
|
props: props,
|
|
167
163
|
collection: collection,
|
|
168
164
|
menuRef: ref
|
|
169
165
|
}));
|
|
170
166
|
});
|
|
171
167
|
function $3674c52c6b3c5bce$var$MenuInner({ props: props, collection: collection, menuRef: ref }) {
|
|
172
|
-
let {
|
|
168
|
+
let { filter: filter, collectionProps: autocompleteMenuProps, collectionRef: collectionRef } = (0, $kM2ZM$useContext)((0, $d2f53cda644affe3$export$65d2a03b8800d6e3)) || {};
|
|
173
169
|
// Memoed so that useAutocomplete callback ref is properly only called once on mount and not everytime a rerender happens
|
|
174
170
|
ref = (0, $kM2ZM$useObjectRef)((0, $kM2ZM$useMemo)(()=>(0, $kM2ZM$mergeRefs)(ref, collectionRef !== undefined ? collectionRef : null), [
|
|
175
171
|
collectionRef,
|
|
176
172
|
ref
|
|
177
173
|
]));
|
|
178
|
-
let filteredCollection = (0, $kM2ZM$useMemo)(()=>
|
|
174
|
+
let filteredCollection = (0, $kM2ZM$useMemo)(()=>filter ? collection.UNSTABLE_filter(filter) : collection, [
|
|
179
175
|
collection,
|
|
180
|
-
|
|
176
|
+
filter
|
|
181
177
|
]);
|
|
182
178
|
let state = (0, $kM2ZM$useTreeState)({
|
|
183
179
|
...props,
|
|
@@ -196,14 +192,24 @@ function $3674c52c6b3c5bce$var$MenuInner({ props: props, collection: collection,
|
|
|
196
192
|
defaultClassName: 'react-aria-Menu',
|
|
197
193
|
className: props.className,
|
|
198
194
|
style: props.style,
|
|
199
|
-
values: {
|
|
195
|
+
values: {
|
|
196
|
+
isEmpty: state.collection.size === 0
|
|
197
|
+
}
|
|
200
198
|
});
|
|
199
|
+
let emptyState = null;
|
|
200
|
+
if (state.collection.size === 0 && props.renderEmptyState) emptyState = /*#__PURE__*/ (0, $kM2ZM$react).createElement("div", {
|
|
201
|
+
role: "menuitem",
|
|
202
|
+
style: {
|
|
203
|
+
display: 'contents'
|
|
204
|
+
}
|
|
205
|
+
}, props.renderEmptyState());
|
|
201
206
|
return /*#__PURE__*/ (0, $kM2ZM$react).createElement((0, $kM2ZM$FocusScope), null, /*#__PURE__*/ (0, $kM2ZM$react).createElement("div", {
|
|
202
207
|
...(0, $kM2ZM$filterDOMProps)(props),
|
|
203
208
|
...menuProps,
|
|
204
209
|
...renderProps,
|
|
205
210
|
ref: ref,
|
|
206
211
|
slot: props.slot || undefined,
|
|
212
|
+
"data-empty": state.collection.size === 0 || undefined,
|
|
207
213
|
onScroll: props.onScroll
|
|
208
214
|
}, /*#__PURE__*/ (0, $kM2ZM$react).createElement((0, $64fa3d84918910a7$export$2881499e37b75b9a), {
|
|
209
215
|
values: [
|
|
@@ -227,23 +233,32 @@ function $3674c52c6b3c5bce$var$MenuInner({ props: props, collection: collection,
|
|
|
227
233
|
[
|
|
228
234
|
$3674c52c6b3c5bce$var$SubmenuTriggerContext,
|
|
229
235
|
{
|
|
230
|
-
parentMenuRef: ref
|
|
236
|
+
parentMenuRef: ref,
|
|
237
|
+
shouldUseVirtualFocus: autocompleteMenuProps === null || autocompleteMenuProps === void 0 ? void 0 : autocompleteMenuProps.shouldUseVirtualFocus
|
|
231
238
|
}
|
|
232
239
|
],
|
|
233
240
|
[
|
|
234
241
|
$3674c52c6b3c5bce$var$MenuItemContext,
|
|
235
242
|
null
|
|
236
243
|
],
|
|
244
|
+
[
|
|
245
|
+
(0, $d2f53cda644affe3$export$65d2a03b8800d6e3),
|
|
246
|
+
null
|
|
247
|
+
],
|
|
237
248
|
[
|
|
238
249
|
$3674c52c6b3c5bce$var$SelectionManagerContext,
|
|
239
250
|
state.selectionManager
|
|
251
|
+
],
|
|
252
|
+
/* Ensure root MenuTriggerState is defined, in case Menu is rendered outside a MenuTrigger. */ /* We assume the context can never change between defined and undefined. */ /* eslint-disable-next-line react-hooks/rules-of-hooks */ [
|
|
253
|
+
$3674c52c6b3c5bce$export$795aec4671cbae19,
|
|
254
|
+
triggerState !== null && triggerState !== void 0 ? triggerState : (0, $kM2ZM$useMenuTriggerState)({})
|
|
240
255
|
]
|
|
241
256
|
]
|
|
242
257
|
}, /*#__PURE__*/ (0, $kM2ZM$react).createElement(CollectionRoot, {
|
|
243
258
|
collection: state.collection,
|
|
244
259
|
persistedKeys: (0, $7135fc7d473fd974$export$90e00781bc59d8f9)(state.selectionManager.focusedKey),
|
|
245
260
|
scrollRef: ref
|
|
246
|
-
}))));
|
|
261
|
+
})), emptyState));
|
|
247
262
|
}
|
|
248
263
|
// A subclass of SelectionManager that forwards focus-related properties to the parent,
|
|
249
264
|
// but has its own local selection state.
|
|
@@ -326,7 +341,6 @@ const $3674c52c6b3c5bce$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $kM2ZM$creat
|
|
|
326
341
|
key: item.key,
|
|
327
342
|
selectionManager: selectionManager
|
|
328
343
|
}, state, ref);
|
|
329
|
-
let { isFocusVisible: isFocusVisible, focusProps: focusProps } = (0, $kM2ZM$useFocusRing)();
|
|
330
344
|
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $kM2ZM$useHover)({
|
|
331
345
|
isDisabled: states.isDisabled
|
|
332
346
|
});
|
|
@@ -338,7 +352,7 @@ const $3674c52c6b3c5bce$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $kM2ZM$creat
|
|
|
338
352
|
values: {
|
|
339
353
|
...states,
|
|
340
354
|
isHovered: isHovered,
|
|
341
|
-
isFocusVisible: isFocusVisible,
|
|
355
|
+
isFocusVisible: states.isFocusVisible,
|
|
342
356
|
selectionMode: selectionManager.selectionMode,
|
|
343
357
|
selectionBehavior: selectionManager.selectionBehavior,
|
|
344
358
|
hasSubmenu: !!props['aria-haspopup'],
|
|
@@ -347,13 +361,13 @@ const $3674c52c6b3c5bce$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $kM2ZM$creat
|
|
|
347
361
|
});
|
|
348
362
|
let ElementType = props.href ? 'a' : 'div';
|
|
349
363
|
return /*#__PURE__*/ (0, $kM2ZM$react).createElement(ElementType, {
|
|
350
|
-
...(0, $kM2ZM$mergeProps)(menuItemProps,
|
|
364
|
+
...(0, $kM2ZM$mergeProps)(menuItemProps, hoverProps),
|
|
351
365
|
...renderProps,
|
|
352
366
|
ref: ref,
|
|
353
367
|
"data-disabled": states.isDisabled || undefined,
|
|
354
368
|
"data-hovered": isHovered || undefined,
|
|
355
369
|
"data-focused": states.isFocused || undefined,
|
|
356
|
-
"data-focus-visible": isFocusVisible || undefined,
|
|
370
|
+
"data-focus-visible": states.isFocusVisible || undefined,
|
|
357
371
|
"data-pressed": states.isPressed || undefined,
|
|
358
372
|
"data-selected": states.isSelected || undefined,
|
|
359
373
|
"data-selection-mode": selectionManager.selectionMode === 'none' ? undefined : selectionManager.selectionMode,
|
|
@@ -365,6 +379,7 @@ const $3674c52c6b3c5bce$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $kM2ZM$creat
|
|
|
365
379
|
(0, $514c0188e459b4c0$export$9afb8bc826b033ea),
|
|
366
380
|
{
|
|
367
381
|
slots: {
|
|
382
|
+
[(0, $64fa3d84918910a7$export$c62b8e45d58ddad9)]: labelProps,
|
|
368
383
|
label: labelProps,
|
|
369
384
|
description: descriptionProps
|
|
370
385
|
}
|