@react-spectrum/listbox 3.12.9-nightly.4624 → 3.12.9
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/ListBoxBase.main.js +20 -20
- package/dist/ListBoxBase.mjs +20 -20
- package/dist/ListBoxBase.module.js +20 -20
- package/dist/ListBoxOption.main.js +18 -18
- package/dist/ListBoxOption.mjs +18 -18
- package/dist/ListBoxOption.module.js +18 -18
- package/dist/ListBoxSection.main.js +4 -4
- package/dist/ListBoxSection.mjs +4 -4
- package/dist/ListBoxSection.module.js +4 -4
- package/package.json +20 -20
package/dist/ListBoxBase.main.js
CHANGED
|
@@ -54,15 +54,15 @@ $parcel$export(module.exports, "ListBoxBase", () => $60eb4b34c53310cb$export$1af
|
|
|
54
54
|
function $60eb4b34c53310cb$export$25768ea656ae32a7(state, isLoading) {
|
|
55
55
|
let { scale: scale } = (0, $7w19U$reactspectrumprovider.useProvider)();
|
|
56
56
|
let collator = (0, $7w19U$reactariai18n.useCollator)({
|
|
57
|
-
usage:
|
|
58
|
-
sensitivity:
|
|
57
|
+
usage: 'search',
|
|
58
|
+
sensitivity: 'base'
|
|
59
59
|
});
|
|
60
60
|
let layout = (0, $7w19U$react.useMemo)(()=>new (0, $7w19U$reactstatelylayout.ListLayout)({
|
|
61
|
-
estimatedRowHeight: scale ===
|
|
62
|
-
estimatedHeadingHeight: scale ===
|
|
63
|
-
padding: scale ===
|
|
61
|
+
estimatedRowHeight: scale === 'large' ? 48 : 32,
|
|
62
|
+
estimatedHeadingHeight: scale === 'large' ? 33 : 26,
|
|
63
|
+
padding: scale === 'large' ? 5 : 4,
|
|
64
64
|
loaderHeight: 40,
|
|
65
|
-
placeholderHeight: scale ===
|
|
65
|
+
placeholderHeight: scale === 'large' ? 48 : 32,
|
|
66
66
|
collator: collator
|
|
67
67
|
}), [
|
|
68
68
|
collator,
|
|
@@ -91,15 +91,15 @@ function $60eb4b34c53310cb$export$25768ea656ae32a7(state, isLoading) {
|
|
|
91
91
|
isVirtualized: true
|
|
92
92
|
}, state, ref);
|
|
93
93
|
let { styleProps: styleProps } = (0, $7w19U$reactspectrumutils.useStyleProps)(props);
|
|
94
|
-
let stringFormatter = (0, $7w19U$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($3d9fe9b46e2d649a$exports))),
|
|
94
|
+
let stringFormatter = (0, $7w19U$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($3d9fe9b46e2d649a$exports))), '@react-spectrum/listbox');
|
|
95
95
|
let renderWrapper = (parent, reusableView, children, renderChildren)=>{
|
|
96
|
-
if (reusableView.viewType ===
|
|
96
|
+
if (reusableView.viewType === 'section') return /*#__PURE__*/ (0, ($parcel$interopDefault($7w19U$react))).createElement((0, $0f5fd8483f48ef09$exports.ListBoxSection), {
|
|
97
97
|
key: reusableView.key,
|
|
98
98
|
item: reusableView.content,
|
|
99
99
|
layoutInfo: reusableView.layoutInfo,
|
|
100
100
|
virtualizer: reusableView.virtualizer,
|
|
101
|
-
headerLayoutInfo: children.find((c)=>c.viewType ===
|
|
102
|
-
}, renderChildren(children.filter((c)=>c.viewType ===
|
|
101
|
+
headerLayoutInfo: children.find((c)=>c.viewType === 'header').layoutInfo
|
|
102
|
+
}, renderChildren(children.filter((c)=>c.viewType === 'item')));
|
|
103
103
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($7w19U$react))).createElement((0, $7w19U$reactariavirtualizer.VirtualizerItem), {
|
|
104
104
|
key: reusableView.key,
|
|
105
105
|
layoutInfo: reusableView.layoutInfo,
|
|
@@ -117,7 +117,7 @@ function $60eb4b34c53310cb$export$25768ea656ae32a7(state, isLoading) {
|
|
|
117
117
|
autoFocus: !!props.autoFocus,
|
|
118
118
|
sizeToFit: "height",
|
|
119
119
|
scrollDirection: "vertical",
|
|
120
|
-
className: (0, $7w19U$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
120
|
+
className: (0, $7w19U$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu', styleProps.className),
|
|
121
121
|
layout: layout,
|
|
122
122
|
collection: state.collection,
|
|
123
123
|
renderWrapper: renderWrapper,
|
|
@@ -127,29 +127,29 @@ function $60eb4b34c53310cb$export$25768ea656ae32a7(state, isLoading) {
|
|
|
127
127
|
shouldUseVirtualFocus: shouldUseVirtualFocus,
|
|
128
128
|
onScroll: onScroll
|
|
129
129
|
}, (type, item)=>{
|
|
130
|
-
if (type ===
|
|
130
|
+
if (type === 'item') return /*#__PURE__*/ (0, ($parcel$interopDefault($7w19U$react))).createElement((0, $2205d250ee1cb1ac$exports.ListBoxOption), {
|
|
131
131
|
item: item,
|
|
132
132
|
shouldSelectOnPressUp: shouldSelectOnPressUp,
|
|
133
133
|
shouldFocusOnHover: focusOnPointerEnter,
|
|
134
134
|
shouldUseVirtualFocus: shouldUseVirtualFocus
|
|
135
135
|
});
|
|
136
|
-
else if (type ===
|
|
136
|
+
else if (type === 'loader') return(// aria-selected isn't needed here since this option is not selectable.
|
|
137
137
|
// eslint-disable-next-line jsx-a11y/role-has-required-aria-props
|
|
138
138
|
/*#__PURE__*/ (0, ($parcel$interopDefault($7w19U$react))).createElement("div", {
|
|
139
139
|
role: "option",
|
|
140
140
|
style: {
|
|
141
|
-
display:
|
|
142
|
-
alignItems:
|
|
143
|
-
justifyContent:
|
|
144
|
-
height:
|
|
141
|
+
display: 'flex',
|
|
142
|
+
alignItems: 'center',
|
|
143
|
+
justifyContent: 'center',
|
|
144
|
+
height: '100%'
|
|
145
145
|
}
|
|
146
146
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($7w19U$react))).createElement((0, $7w19U$reactspectrumprogress.ProgressCircle), {
|
|
147
147
|
isIndeterminate: true,
|
|
148
148
|
size: "S",
|
|
149
|
-
"aria-label": state.collection.size > 0 ? stringFormatter.format(
|
|
150
|
-
UNSAFE_className: (0, $7w19U$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
149
|
+
"aria-label": state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading'),
|
|
150
|
+
UNSAFE_className: (0, $7w19U$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Dropdown-progressCircle')
|
|
151
151
|
})));
|
|
152
|
-
else if (type ===
|
|
152
|
+
else if (type === 'placeholder') {
|
|
153
153
|
let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
|
|
154
154
|
if (emptyState == null) return null;
|
|
155
155
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($7w19U$react))).createElement("div", {
|
package/dist/ListBoxBase.mjs
CHANGED
|
@@ -47,15 +47,15 @@ function $parcel$interopDefault(a) {
|
|
|
47
47
|
function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
|
|
48
48
|
let { scale: scale } = (0, $gF3QK$useProvider)();
|
|
49
49
|
let collator = (0, $gF3QK$useCollator)({
|
|
50
|
-
usage:
|
|
51
|
-
sensitivity:
|
|
50
|
+
usage: 'search',
|
|
51
|
+
sensitivity: 'base'
|
|
52
52
|
});
|
|
53
53
|
let layout = (0, $gF3QK$useMemo)(()=>new (0, $gF3QK$ListLayout)({
|
|
54
|
-
estimatedRowHeight: scale ===
|
|
55
|
-
estimatedHeadingHeight: scale ===
|
|
56
|
-
padding: scale ===
|
|
54
|
+
estimatedRowHeight: scale === 'large' ? 48 : 32,
|
|
55
|
+
estimatedHeadingHeight: scale === 'large' ? 33 : 26,
|
|
56
|
+
padding: scale === 'large' ? 5 : 4,
|
|
57
57
|
loaderHeight: 40,
|
|
58
|
-
placeholderHeight: scale ===
|
|
58
|
+
placeholderHeight: scale === 'large' ? 48 : 32,
|
|
59
59
|
collator: collator
|
|
60
60
|
}), [
|
|
61
61
|
collator,
|
|
@@ -84,15 +84,15 @@ function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
|
|
|
84
84
|
isVirtualized: true
|
|
85
85
|
}, state, ref);
|
|
86
86
|
let { styleProps: styleProps } = (0, $gF3QK$useStyleProps)(props);
|
|
87
|
-
let stringFormatter = (0, $gF3QK$useLocalizedStringFormatter)((0, ($parcel$interopDefault($gF3QK$intlStringsmodulejs))),
|
|
87
|
+
let stringFormatter = (0, $gF3QK$useLocalizedStringFormatter)((0, ($parcel$interopDefault($gF3QK$intlStringsmodulejs))), '@react-spectrum/listbox');
|
|
88
88
|
let renderWrapper = (parent, reusableView, children, renderChildren)=>{
|
|
89
|
-
if (reusableView.viewType ===
|
|
89
|
+
if (reusableView.viewType === 'section') return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $92d678ed88836094$export$dca12b0bb56e4fc), {
|
|
90
90
|
key: reusableView.key,
|
|
91
91
|
item: reusableView.content,
|
|
92
92
|
layoutInfo: reusableView.layoutInfo,
|
|
93
93
|
virtualizer: reusableView.virtualizer,
|
|
94
|
-
headerLayoutInfo: children.find((c)=>c.viewType ===
|
|
95
|
-
}, renderChildren(children.filter((c)=>c.viewType ===
|
|
94
|
+
headerLayoutInfo: children.find((c)=>c.viewType === 'header').layoutInfo
|
|
95
|
+
}, renderChildren(children.filter((c)=>c.viewType === 'item')));
|
|
96
96
|
return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $gF3QK$VirtualizerItem), {
|
|
97
97
|
key: reusableView.key,
|
|
98
98
|
layoutInfo: reusableView.layoutInfo,
|
|
@@ -110,7 +110,7 @@ function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
|
|
|
110
110
|
autoFocus: !!props.autoFocus,
|
|
111
111
|
sizeToFit: "height",
|
|
112
112
|
scrollDirection: "vertical",
|
|
113
|
-
className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))),
|
|
113
|
+
className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))), 'spectrum-Menu', styleProps.className),
|
|
114
114
|
layout: layout,
|
|
115
115
|
collection: state.collection,
|
|
116
116
|
renderWrapper: renderWrapper,
|
|
@@ -120,29 +120,29 @@ function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
|
|
|
120
120
|
shouldUseVirtualFocus: shouldUseVirtualFocus,
|
|
121
121
|
onScroll: onScroll
|
|
122
122
|
}, (type, item)=>{
|
|
123
|
-
if (type ===
|
|
123
|
+
if (type === 'item') return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $86983ea1fa3f7312$export$feb3b6b552c14a12), {
|
|
124
124
|
item: item,
|
|
125
125
|
shouldSelectOnPressUp: shouldSelectOnPressUp,
|
|
126
126
|
shouldFocusOnHover: focusOnPointerEnter,
|
|
127
127
|
shouldUseVirtualFocus: shouldUseVirtualFocus
|
|
128
128
|
});
|
|
129
|
-
else if (type ===
|
|
129
|
+
else if (type === 'loader') return(// aria-selected isn't needed here since this option is not selectable.
|
|
130
130
|
// eslint-disable-next-line jsx-a11y/role-has-required-aria-props
|
|
131
131
|
/*#__PURE__*/ (0, $gF3QK$react).createElement("div", {
|
|
132
132
|
role: "option",
|
|
133
133
|
style: {
|
|
134
|
-
display:
|
|
135
|
-
alignItems:
|
|
136
|
-
justifyContent:
|
|
137
|
-
height:
|
|
134
|
+
display: 'flex',
|
|
135
|
+
alignItems: 'center',
|
|
136
|
+
justifyContent: 'center',
|
|
137
|
+
height: '100%'
|
|
138
138
|
}
|
|
139
139
|
}, /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $gF3QK$ProgressCircle), {
|
|
140
140
|
isIndeterminate: true,
|
|
141
141
|
size: "S",
|
|
142
|
-
"aria-label": state.collection.size > 0 ? stringFormatter.format(
|
|
143
|
-
UNSAFE_className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))),
|
|
142
|
+
"aria-label": state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading'),
|
|
143
|
+
UNSAFE_className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))), 'spectrum-Dropdown-progressCircle')
|
|
144
144
|
})));
|
|
145
|
-
else if (type ===
|
|
145
|
+
else if (type === 'placeholder') {
|
|
146
146
|
let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
|
|
147
147
|
if (emptyState == null) return null;
|
|
148
148
|
return /*#__PURE__*/ (0, $gF3QK$react).createElement("div", {
|
|
@@ -47,15 +47,15 @@ function $parcel$interopDefault(a) {
|
|
|
47
47
|
function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
|
|
48
48
|
let { scale: scale } = (0, $gF3QK$useProvider)();
|
|
49
49
|
let collator = (0, $gF3QK$useCollator)({
|
|
50
|
-
usage:
|
|
51
|
-
sensitivity:
|
|
50
|
+
usage: 'search',
|
|
51
|
+
sensitivity: 'base'
|
|
52
52
|
});
|
|
53
53
|
let layout = (0, $gF3QK$useMemo)(()=>new (0, $gF3QK$ListLayout)({
|
|
54
|
-
estimatedRowHeight: scale ===
|
|
55
|
-
estimatedHeadingHeight: scale ===
|
|
56
|
-
padding: scale ===
|
|
54
|
+
estimatedRowHeight: scale === 'large' ? 48 : 32,
|
|
55
|
+
estimatedHeadingHeight: scale === 'large' ? 33 : 26,
|
|
56
|
+
padding: scale === 'large' ? 5 : 4,
|
|
57
57
|
loaderHeight: 40,
|
|
58
|
-
placeholderHeight: scale ===
|
|
58
|
+
placeholderHeight: scale === 'large' ? 48 : 32,
|
|
59
59
|
collator: collator
|
|
60
60
|
}), [
|
|
61
61
|
collator,
|
|
@@ -84,15 +84,15 @@ function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
|
|
|
84
84
|
isVirtualized: true
|
|
85
85
|
}, state, ref);
|
|
86
86
|
let { styleProps: styleProps } = (0, $gF3QK$useStyleProps)(props);
|
|
87
|
-
let stringFormatter = (0, $gF3QK$useLocalizedStringFormatter)((0, ($parcel$interopDefault($gF3QK$intlStringsmodulejs))),
|
|
87
|
+
let stringFormatter = (0, $gF3QK$useLocalizedStringFormatter)((0, ($parcel$interopDefault($gF3QK$intlStringsmodulejs))), '@react-spectrum/listbox');
|
|
88
88
|
let renderWrapper = (parent, reusableView, children, renderChildren)=>{
|
|
89
|
-
if (reusableView.viewType ===
|
|
89
|
+
if (reusableView.viewType === 'section') return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $92d678ed88836094$export$dca12b0bb56e4fc), {
|
|
90
90
|
key: reusableView.key,
|
|
91
91
|
item: reusableView.content,
|
|
92
92
|
layoutInfo: reusableView.layoutInfo,
|
|
93
93
|
virtualizer: reusableView.virtualizer,
|
|
94
|
-
headerLayoutInfo: children.find((c)=>c.viewType ===
|
|
95
|
-
}, renderChildren(children.filter((c)=>c.viewType ===
|
|
94
|
+
headerLayoutInfo: children.find((c)=>c.viewType === 'header').layoutInfo
|
|
95
|
+
}, renderChildren(children.filter((c)=>c.viewType === 'item')));
|
|
96
96
|
return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $gF3QK$VirtualizerItem), {
|
|
97
97
|
key: reusableView.key,
|
|
98
98
|
layoutInfo: reusableView.layoutInfo,
|
|
@@ -110,7 +110,7 @@ function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
|
|
|
110
110
|
autoFocus: !!props.autoFocus,
|
|
111
111
|
sizeToFit: "height",
|
|
112
112
|
scrollDirection: "vertical",
|
|
113
|
-
className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))),
|
|
113
|
+
className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))), 'spectrum-Menu', styleProps.className),
|
|
114
114
|
layout: layout,
|
|
115
115
|
collection: state.collection,
|
|
116
116
|
renderWrapper: renderWrapper,
|
|
@@ -120,29 +120,29 @@ function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
|
|
|
120
120
|
shouldUseVirtualFocus: shouldUseVirtualFocus,
|
|
121
121
|
onScroll: onScroll
|
|
122
122
|
}, (type, item)=>{
|
|
123
|
-
if (type ===
|
|
123
|
+
if (type === 'item') return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $86983ea1fa3f7312$export$feb3b6b552c14a12), {
|
|
124
124
|
item: item,
|
|
125
125
|
shouldSelectOnPressUp: shouldSelectOnPressUp,
|
|
126
126
|
shouldFocusOnHover: focusOnPointerEnter,
|
|
127
127
|
shouldUseVirtualFocus: shouldUseVirtualFocus
|
|
128
128
|
});
|
|
129
|
-
else if (type ===
|
|
129
|
+
else if (type === 'loader') return(// aria-selected isn't needed here since this option is not selectable.
|
|
130
130
|
// eslint-disable-next-line jsx-a11y/role-has-required-aria-props
|
|
131
131
|
/*#__PURE__*/ (0, $gF3QK$react).createElement("div", {
|
|
132
132
|
role: "option",
|
|
133
133
|
style: {
|
|
134
|
-
display:
|
|
135
|
-
alignItems:
|
|
136
|
-
justifyContent:
|
|
137
|
-
height:
|
|
134
|
+
display: 'flex',
|
|
135
|
+
alignItems: 'center',
|
|
136
|
+
justifyContent: 'center',
|
|
137
|
+
height: '100%'
|
|
138
138
|
}
|
|
139
139
|
}, /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $gF3QK$ProgressCircle), {
|
|
140
140
|
isIndeterminate: true,
|
|
141
141
|
size: "S",
|
|
142
|
-
"aria-label": state.collection.size > 0 ? stringFormatter.format(
|
|
143
|
-
UNSAFE_className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))),
|
|
142
|
+
"aria-label": state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading'),
|
|
143
|
+
UNSAFE_className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))), 'spectrum-Dropdown-progressCircle')
|
|
144
144
|
})));
|
|
145
|
-
else if (type ===
|
|
145
|
+
else if (type === 'placeholder') {
|
|
146
146
|
let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
|
|
147
147
|
if (emptyState == null) return null;
|
|
148
148
|
return /*#__PURE__*/ (0, $gF3QK$react).createElement("div", {
|
|
@@ -45,11 +45,11 @@ $parcel$export(module.exports, "ListBoxOption", () => $2205d250ee1cb1ac$export$f
|
|
|
45
45
|
function $2205d250ee1cb1ac$export$feb3b6b552c14a12(props) {
|
|
46
46
|
let { item: item, shouldSelectOnPressUp: shouldSelectOnPressUp, shouldFocusOnHover: shouldFocusOnHover, shouldUseVirtualFocus: shouldUseVirtualFocus } = props;
|
|
47
47
|
let { rendered: rendered, key: key } = item;
|
|
48
|
-
let ElementType = item.props.href ?
|
|
48
|
+
let ElementType = item.props.href ? 'a' : 'div';
|
|
49
49
|
let state = (0, $8xmxv$react.useContext)((0, $611e93c7b7c0413c$exports.ListBoxContext));
|
|
50
50
|
let ref = (0, $8xmxv$react.useRef)();
|
|
51
51
|
let { optionProps: optionProps, labelProps: labelProps, descriptionProps: descriptionProps, isSelected: isSelected, isDisabled: isDisabled, isFocused: isFocused } = (0, $8xmxv$reactarialistbox.useOption)({
|
|
52
|
-
|
|
52
|
+
'aria-label': item['aria-label'],
|
|
53
53
|
key: key,
|
|
54
54
|
shouldSelectOnPressUp: shouldSelectOnPressUp,
|
|
55
55
|
shouldFocusOnHover: shouldFocusOnHover,
|
|
@@ -60,47 +60,47 @@ function $2205d250ee1cb1ac$export$feb3b6b552c14a12(props) {
|
|
|
60
60
|
...props,
|
|
61
61
|
isDisabled: isDisabled
|
|
62
62
|
});
|
|
63
|
-
let contents = typeof rendered ===
|
|
63
|
+
let contents = typeof rendered === 'string' ? /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactspectrumtext.Text), null, rendered) : rendered;
|
|
64
64
|
let isKeyboardModality = (0, $8xmxv$reactariainteractions.isFocusVisible)();
|
|
65
65
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactariafocus.FocusRing), {
|
|
66
|
-
focusRingClass: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
66
|
+
focusRingClass: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'focus-ring')
|
|
67
67
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement(ElementType, {
|
|
68
68
|
...(0, $8xmxv$reactariautils.mergeProps)(optionProps, shouldFocusOnHover ? {} : hoverProps),
|
|
69
69
|
ref: ref,
|
|
70
|
-
className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
70
|
+
className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu-item', {
|
|
71
71
|
// If using virtual focus, apply focused styles to the item when the user is interacting with keyboard modality
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
72
|
+
'is-focused': shouldUseVirtualFocus && isFocused && isKeyboardModality,
|
|
73
|
+
'is-disabled': isDisabled,
|
|
74
|
+
'is-selected': isSelected,
|
|
75
|
+
'is-selectable': state.selectionManager.selectionMode !== 'none',
|
|
76
76
|
// When shouldFocusOnHover is false, apply hover styles both when hovered with the mouse.
|
|
77
77
|
// Otherwise, apply hover styles when focused using non-keyboard modality.
|
|
78
|
-
|
|
78
|
+
'is-hovered': isHovered && !shouldFocusOnHover || isFocused && !isKeyboardModality
|
|
79
79
|
})
|
|
80
80
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactspectrumlayout.Grid), {
|
|
81
|
-
UNSAFE_className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
81
|
+
UNSAFE_className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu-itemGrid')
|
|
82
82
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactspectrumutils.ClearSlots), null, /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactspectrumutils.SlotProvider), {
|
|
83
83
|
slots: {
|
|
84
84
|
text: {
|
|
85
|
-
UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))[
|
|
85
|
+
UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-itemLabel'],
|
|
86
86
|
...labelProps
|
|
87
87
|
},
|
|
88
88
|
icon: {
|
|
89
|
-
size:
|
|
90
|
-
UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))[
|
|
89
|
+
size: 'S',
|
|
90
|
+
UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-icon']
|
|
91
91
|
},
|
|
92
92
|
avatar: {
|
|
93
|
-
size:
|
|
94
|
-
UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))[
|
|
93
|
+
size: 'avatar-size-100',
|
|
94
|
+
UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-avatar']
|
|
95
95
|
},
|
|
96
96
|
description: {
|
|
97
|
-
UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))[
|
|
97
|
+
UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))['spectrum-Menu-description'],
|
|
98
98
|
...descriptionProps
|
|
99
99
|
}
|
|
100
100
|
}
|
|
101
101
|
}, contents, isSelected && /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, ($parcel$interopDefault($8xmxv$spectrumiconsuiCheckmarkMedium))), {
|
|
102
102
|
slot: "checkmark",
|
|
103
|
-
UNSAFE_className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
103
|
+
UNSAFE_className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu-checkmark')
|
|
104
104
|
}))))));
|
|
105
105
|
}
|
|
106
106
|
|
package/dist/ListBoxOption.mjs
CHANGED
|
@@ -39,11 +39,11 @@ function $parcel$interopDefault(a) {
|
|
|
39
39
|
function $86983ea1fa3f7312$export$feb3b6b552c14a12(props) {
|
|
40
40
|
let { item: item, shouldSelectOnPressUp: shouldSelectOnPressUp, shouldFocusOnHover: shouldFocusOnHover, shouldUseVirtualFocus: shouldUseVirtualFocus } = props;
|
|
41
41
|
let { rendered: rendered, key: key } = item;
|
|
42
|
-
let ElementType = item.props.href ?
|
|
42
|
+
let ElementType = item.props.href ? 'a' : 'div';
|
|
43
43
|
let state = (0, $6TrMC$useContext)((0, $0c6f792811e33483$export$7ff8f37d2d81a48d));
|
|
44
44
|
let ref = (0, $6TrMC$useRef)();
|
|
45
45
|
let { optionProps: optionProps, labelProps: labelProps, descriptionProps: descriptionProps, isSelected: isSelected, isDisabled: isDisabled, isFocused: isFocused } = (0, $6TrMC$useOption)({
|
|
46
|
-
|
|
46
|
+
'aria-label': item['aria-label'],
|
|
47
47
|
key: key,
|
|
48
48
|
shouldSelectOnPressUp: shouldSelectOnPressUp,
|
|
49
49
|
shouldFocusOnHover: shouldFocusOnHover,
|
|
@@ -54,47 +54,47 @@ function $86983ea1fa3f7312$export$feb3b6b552c14a12(props) {
|
|
|
54
54
|
...props,
|
|
55
55
|
isDisabled: isDisabled
|
|
56
56
|
});
|
|
57
|
-
let contents = typeof rendered ===
|
|
57
|
+
let contents = typeof rendered === 'string' ? /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$Text), null, rendered) : rendered;
|
|
58
58
|
let isKeyboardModality = (0, $6TrMC$isFocusVisible)();
|
|
59
59
|
return /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$FocusRing), {
|
|
60
|
-
focusRingClass: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))),
|
|
60
|
+
focusRingClass: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), 'focus-ring')
|
|
61
61
|
}, /*#__PURE__*/ (0, $6TrMC$react).createElement(ElementType, {
|
|
62
62
|
...(0, $6TrMC$mergeProps)(optionProps, shouldFocusOnHover ? {} : hoverProps),
|
|
63
63
|
ref: ref,
|
|
64
|
-
className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))),
|
|
64
|
+
className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), 'spectrum-Menu-item', {
|
|
65
65
|
// If using virtual focus, apply focused styles to the item when the user is interacting with keyboard modality
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
66
|
+
'is-focused': shouldUseVirtualFocus && isFocused && isKeyboardModality,
|
|
67
|
+
'is-disabled': isDisabled,
|
|
68
|
+
'is-selected': isSelected,
|
|
69
|
+
'is-selectable': state.selectionManager.selectionMode !== 'none',
|
|
70
70
|
// When shouldFocusOnHover is false, apply hover styles both when hovered with the mouse.
|
|
71
71
|
// Otherwise, apply hover styles when focused using non-keyboard modality.
|
|
72
|
-
|
|
72
|
+
'is-hovered': isHovered && !shouldFocusOnHover || isFocused && !isKeyboardModality
|
|
73
73
|
})
|
|
74
74
|
}, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$Grid), {
|
|
75
|
-
UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))),
|
|
75
|
+
UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), 'spectrum-Menu-itemGrid')
|
|
76
76
|
}, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$ClearSlots), null, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$SlotProvider), {
|
|
77
77
|
slots: {
|
|
78
78
|
text: {
|
|
79
|
-
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))[
|
|
79
|
+
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))['spectrum-Menu-itemLabel'],
|
|
80
80
|
...labelProps
|
|
81
81
|
},
|
|
82
82
|
icon: {
|
|
83
|
-
size:
|
|
84
|
-
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))[
|
|
83
|
+
size: 'S',
|
|
84
|
+
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))['spectrum-Menu-icon']
|
|
85
85
|
},
|
|
86
86
|
avatar: {
|
|
87
|
-
size:
|
|
88
|
-
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))[
|
|
87
|
+
size: 'avatar-size-100',
|
|
88
|
+
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))['spectrum-Menu-avatar']
|
|
89
89
|
},
|
|
90
90
|
description: {
|
|
91
|
-
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))[
|
|
91
|
+
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))['spectrum-Menu-description'],
|
|
92
92
|
...descriptionProps
|
|
93
93
|
}
|
|
94
94
|
}
|
|
95
95
|
}, contents, isSelected && /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$spectrumiconsuiCheckmarkMedium), {
|
|
96
96
|
slot: "checkmark",
|
|
97
|
-
UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))),
|
|
97
|
+
UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), 'spectrum-Menu-checkmark')
|
|
98
98
|
}))))));
|
|
99
99
|
}
|
|
100
100
|
|
|
@@ -39,11 +39,11 @@ function $parcel$interopDefault(a) {
|
|
|
39
39
|
function $86983ea1fa3f7312$export$feb3b6b552c14a12(props) {
|
|
40
40
|
let { item: item, shouldSelectOnPressUp: shouldSelectOnPressUp, shouldFocusOnHover: shouldFocusOnHover, shouldUseVirtualFocus: shouldUseVirtualFocus } = props;
|
|
41
41
|
let { rendered: rendered, key: key } = item;
|
|
42
|
-
let ElementType = item.props.href ?
|
|
42
|
+
let ElementType = item.props.href ? 'a' : 'div';
|
|
43
43
|
let state = (0, $6TrMC$useContext)((0, $0c6f792811e33483$export$7ff8f37d2d81a48d));
|
|
44
44
|
let ref = (0, $6TrMC$useRef)();
|
|
45
45
|
let { optionProps: optionProps, labelProps: labelProps, descriptionProps: descriptionProps, isSelected: isSelected, isDisabled: isDisabled, isFocused: isFocused } = (0, $6TrMC$useOption)({
|
|
46
|
-
|
|
46
|
+
'aria-label': item['aria-label'],
|
|
47
47
|
key: key,
|
|
48
48
|
shouldSelectOnPressUp: shouldSelectOnPressUp,
|
|
49
49
|
shouldFocusOnHover: shouldFocusOnHover,
|
|
@@ -54,47 +54,47 @@ function $86983ea1fa3f7312$export$feb3b6b552c14a12(props) {
|
|
|
54
54
|
...props,
|
|
55
55
|
isDisabled: isDisabled
|
|
56
56
|
});
|
|
57
|
-
let contents = typeof rendered ===
|
|
57
|
+
let contents = typeof rendered === 'string' ? /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$Text), null, rendered) : rendered;
|
|
58
58
|
let isKeyboardModality = (0, $6TrMC$isFocusVisible)();
|
|
59
59
|
return /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$FocusRing), {
|
|
60
|
-
focusRingClass: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))),
|
|
60
|
+
focusRingClass: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), 'focus-ring')
|
|
61
61
|
}, /*#__PURE__*/ (0, $6TrMC$react).createElement(ElementType, {
|
|
62
62
|
...(0, $6TrMC$mergeProps)(optionProps, shouldFocusOnHover ? {} : hoverProps),
|
|
63
63
|
ref: ref,
|
|
64
|
-
className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))),
|
|
64
|
+
className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), 'spectrum-Menu-item', {
|
|
65
65
|
// If using virtual focus, apply focused styles to the item when the user is interacting with keyboard modality
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
66
|
+
'is-focused': shouldUseVirtualFocus && isFocused && isKeyboardModality,
|
|
67
|
+
'is-disabled': isDisabled,
|
|
68
|
+
'is-selected': isSelected,
|
|
69
|
+
'is-selectable': state.selectionManager.selectionMode !== 'none',
|
|
70
70
|
// When shouldFocusOnHover is false, apply hover styles both when hovered with the mouse.
|
|
71
71
|
// Otherwise, apply hover styles when focused using non-keyboard modality.
|
|
72
|
-
|
|
72
|
+
'is-hovered': isHovered && !shouldFocusOnHover || isFocused && !isKeyboardModality
|
|
73
73
|
})
|
|
74
74
|
}, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$Grid), {
|
|
75
|
-
UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))),
|
|
75
|
+
UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), 'spectrum-Menu-itemGrid')
|
|
76
76
|
}, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$ClearSlots), null, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$SlotProvider), {
|
|
77
77
|
slots: {
|
|
78
78
|
text: {
|
|
79
|
-
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))[
|
|
79
|
+
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))['spectrum-Menu-itemLabel'],
|
|
80
80
|
...labelProps
|
|
81
81
|
},
|
|
82
82
|
icon: {
|
|
83
|
-
size:
|
|
84
|
-
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))[
|
|
83
|
+
size: 'S',
|
|
84
|
+
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))['spectrum-Menu-icon']
|
|
85
85
|
},
|
|
86
86
|
avatar: {
|
|
87
|
-
size:
|
|
88
|
-
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))[
|
|
87
|
+
size: 'avatar-size-100',
|
|
88
|
+
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))['spectrum-Menu-avatar']
|
|
89
89
|
},
|
|
90
90
|
description: {
|
|
91
|
-
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))[
|
|
91
|
+
UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))['spectrum-Menu-description'],
|
|
92
92
|
...descriptionProps
|
|
93
93
|
}
|
|
94
94
|
}
|
|
95
95
|
}, contents, isSelected && /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$spectrumiconsuiCheckmarkMedium), {
|
|
96
96
|
slot: "checkmark",
|
|
97
|
-
UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))),
|
|
97
|
+
UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), 'spectrum-Menu-checkmark')
|
|
98
98
|
}))))));
|
|
99
99
|
}
|
|
100
100
|
|
|
@@ -38,7 +38,7 @@ function $0f5fd8483f48ef09$export$dca12b0bb56e4fc(props) {
|
|
|
38
38
|
let { children: children, layoutInfo: layoutInfo, headerLayoutInfo: headerLayoutInfo, virtualizer: virtualizer, item: item } = props;
|
|
39
39
|
let { headingProps: headingProps, groupProps: groupProps } = (0, $cCu2p$reactarialistbox.useListBoxSection)({
|
|
40
40
|
heading: item.rendered,
|
|
41
|
-
|
|
41
|
+
'aria-label': item['aria-label']
|
|
42
42
|
});
|
|
43
43
|
let headerRef = (0, $cCu2p$react.useRef)();
|
|
44
44
|
(0, $cCu2p$reactariavirtualizer.useVirtualizerItem)({
|
|
@@ -54,14 +54,14 @@ function $0f5fd8483f48ef09$export$dca12b0bb56e4fc(props) {
|
|
|
54
54
|
style: (0, $cCu2p$reactariavirtualizer.layoutInfoToStyle)(headerLayoutInfo, direction)
|
|
55
55
|
}, item.key !== state.collection.getFirstKey() && /*#__PURE__*/ (0, ($parcel$interopDefault($cCu2p$react))).createElement("div", {
|
|
56
56
|
role: "presentation",
|
|
57
|
-
className: (0, $cCu2p$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
57
|
+
className: (0, $cCu2p$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu-divider')
|
|
58
58
|
}), item.rendered && /*#__PURE__*/ (0, ($parcel$interopDefault($cCu2p$react))).createElement("div", {
|
|
59
59
|
...headingProps,
|
|
60
|
-
className: (0, $cCu2p$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
60
|
+
className: (0, $cCu2p$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu-sectionHeading')
|
|
61
61
|
}, item.rendered)), /*#__PURE__*/ (0, ($parcel$interopDefault($cCu2p$react))).createElement("div", {
|
|
62
62
|
...groupProps,
|
|
63
63
|
style: (0, $cCu2p$reactariavirtualizer.layoutInfoToStyle)(layoutInfo, direction),
|
|
64
|
-
className: (0, $cCu2p$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))),
|
|
64
|
+
className: (0, $cCu2p$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), 'spectrum-Menu')
|
|
65
65
|
}, children));
|
|
66
66
|
}
|
|
67
67
|
|
package/dist/ListBoxSection.mjs
CHANGED
|
@@ -32,7 +32,7 @@ function $92d678ed88836094$export$dca12b0bb56e4fc(props) {
|
|
|
32
32
|
let { children: children, layoutInfo: layoutInfo, headerLayoutInfo: headerLayoutInfo, virtualizer: virtualizer, item: item } = props;
|
|
33
33
|
let { headingProps: headingProps, groupProps: groupProps } = (0, $dzUX8$useListBoxSection)({
|
|
34
34
|
heading: item.rendered,
|
|
35
|
-
|
|
35
|
+
'aria-label': item['aria-label']
|
|
36
36
|
});
|
|
37
37
|
let headerRef = (0, $dzUX8$useRef)();
|
|
38
38
|
(0, $dzUX8$useVirtualizerItem)({
|
|
@@ -48,14 +48,14 @@ function $92d678ed88836094$export$dca12b0bb56e4fc(props) {
|
|
|
48
48
|
style: (0, $dzUX8$layoutInfoToStyle)(headerLayoutInfo, direction)
|
|
49
49
|
}, item.key !== state.collection.getFirstKey() && /*#__PURE__*/ (0, $dzUX8$react).createElement("div", {
|
|
50
50
|
role: "presentation",
|
|
51
|
-
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))),
|
|
51
|
+
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))), 'spectrum-Menu-divider')
|
|
52
52
|
}), item.rendered && /*#__PURE__*/ (0, $dzUX8$react).createElement("div", {
|
|
53
53
|
...headingProps,
|
|
54
|
-
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))),
|
|
54
|
+
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))), 'spectrum-Menu-sectionHeading')
|
|
55
55
|
}, item.rendered)), /*#__PURE__*/ (0, $dzUX8$react).createElement("div", {
|
|
56
56
|
...groupProps,
|
|
57
57
|
style: (0, $dzUX8$layoutInfoToStyle)(layoutInfo, direction),
|
|
58
|
-
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))),
|
|
58
|
+
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))), 'spectrum-Menu')
|
|
59
59
|
}, children));
|
|
60
60
|
}
|
|
61
61
|
|
|
@@ -32,7 +32,7 @@ function $92d678ed88836094$export$dca12b0bb56e4fc(props) {
|
|
|
32
32
|
let { children: children, layoutInfo: layoutInfo, headerLayoutInfo: headerLayoutInfo, virtualizer: virtualizer, item: item } = props;
|
|
33
33
|
let { headingProps: headingProps, groupProps: groupProps } = (0, $dzUX8$useListBoxSection)({
|
|
34
34
|
heading: item.rendered,
|
|
35
|
-
|
|
35
|
+
'aria-label': item['aria-label']
|
|
36
36
|
});
|
|
37
37
|
let headerRef = (0, $dzUX8$useRef)();
|
|
38
38
|
(0, $dzUX8$useVirtualizerItem)({
|
|
@@ -48,14 +48,14 @@ function $92d678ed88836094$export$dca12b0bb56e4fc(props) {
|
|
|
48
48
|
style: (0, $dzUX8$layoutInfoToStyle)(headerLayoutInfo, direction)
|
|
49
49
|
}, item.key !== state.collection.getFirstKey() && /*#__PURE__*/ (0, $dzUX8$react).createElement("div", {
|
|
50
50
|
role: "presentation",
|
|
51
|
-
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))),
|
|
51
|
+
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))), 'spectrum-Menu-divider')
|
|
52
52
|
}), item.rendered && /*#__PURE__*/ (0, $dzUX8$react).createElement("div", {
|
|
53
53
|
...headingProps,
|
|
54
|
-
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))),
|
|
54
|
+
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))), 'spectrum-Menu-sectionHeading')
|
|
55
55
|
}, item.rendered)), /*#__PURE__*/ (0, $dzUX8$react).createElement("div", {
|
|
56
56
|
...groupProps,
|
|
57
57
|
style: (0, $dzUX8$layoutInfoToStyle)(layoutInfo, direction),
|
|
58
|
-
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))),
|
|
58
|
+
className: (0, $dzUX8$classNames)((0, ($parcel$interopDefault($dzUX8$menu_vars_cssmodulejs))), 'spectrum-Menu')
|
|
59
59
|
}, children));
|
|
60
60
|
}
|
|
61
61
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-spectrum/listbox",
|
|
3
|
-
"version": "3.12.9
|
|
3
|
+
"version": "3.12.9",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -36,27 +36,27 @@
|
|
|
36
36
|
"url": "https://github.com/adobe/react-spectrum"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@react-aria/focus": "3.
|
|
40
|
-
"@react-aria/i18n": "3.
|
|
41
|
-
"@react-aria/interactions": "3.
|
|
42
|
-
"@react-aria/listbox": "3.12.1
|
|
43
|
-
"@react-aria/utils": "3.
|
|
44
|
-
"@react-aria/virtualizer": "3.10.1
|
|
45
|
-
"@react-spectrum/layout": "3.6.5
|
|
46
|
-
"@react-spectrum/progress": "3.
|
|
47
|
-
"@react-spectrum/text": "3.5.5
|
|
48
|
-
"@react-spectrum/utils": "3.
|
|
49
|
-
"@react-stately/collections": "3.
|
|
50
|
-
"@react-stately/layout": "3.13.9
|
|
51
|
-
"@react-stately/list": "3.10.5
|
|
52
|
-
"@react-stately/virtualizer": "3.7.1
|
|
53
|
-
"@react-types/listbox": "3.4.9
|
|
54
|
-
"@react-types/shared": "3.
|
|
55
|
-
"@spectrum-icons/ui": "3.
|
|
39
|
+
"@react-aria/focus": "^3.17.1",
|
|
40
|
+
"@react-aria/i18n": "^3.11.1",
|
|
41
|
+
"@react-aria/interactions": "^3.21.3",
|
|
42
|
+
"@react-aria/listbox": "^3.12.1",
|
|
43
|
+
"@react-aria/utils": "^3.24.1",
|
|
44
|
+
"@react-aria/virtualizer": "^3.10.1",
|
|
45
|
+
"@react-spectrum/layout": "^3.6.5",
|
|
46
|
+
"@react-spectrum/progress": "^3.7.7",
|
|
47
|
+
"@react-spectrum/text": "^3.5.5",
|
|
48
|
+
"@react-spectrum/utils": "^3.11.7",
|
|
49
|
+
"@react-stately/collections": "^3.10.7",
|
|
50
|
+
"@react-stately/layout": "^3.13.9",
|
|
51
|
+
"@react-stately/list": "^3.10.5",
|
|
52
|
+
"@react-stately/virtualizer": "^3.7.1",
|
|
53
|
+
"@react-types/listbox": "^3.4.9",
|
|
54
|
+
"@react-types/shared": "^3.23.1",
|
|
55
|
+
"@spectrum-icons/ui": "^3.6.7",
|
|
56
56
|
"@swc/helpers": "^0.5.0"
|
|
57
57
|
},
|
|
58
58
|
"devDependencies": {
|
|
59
|
-
"@adobe/spectrum-css-temp": "3.0.0-
|
|
59
|
+
"@adobe/spectrum-css-temp": "3.0.0-alpha.1"
|
|
60
60
|
},
|
|
61
61
|
"peerDependencies": {
|
|
62
62
|
"@react-spectrum/provider": "^3.2.0",
|
|
@@ -66,5 +66,5 @@
|
|
|
66
66
|
"publishConfig": {
|
|
67
67
|
"access": "public"
|
|
68
68
|
},
|
|
69
|
-
"gitHead": "
|
|
69
|
+
"gitHead": "b77d7d594dff4dcfb5359bffbcfd18142b146433"
|
|
70
70
|
}
|