@react-aria/virtualizer 3.6.1-nightly.3598 → 3.6.1-nightly.3600
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/main.js +171 -101
- package/dist/main.js.map +1 -1
- package/dist/module.mjs +171 -101
- package/dist/module.mjs.map +1 -1
- package/package.json +9 -9
package/dist/main.js
CHANGED
|
@@ -22,31 +22,72 @@ $parcel$export(module.exports, "ScrollView", () => $00ca8c0b29e3e07c$export$5665
|
|
|
22
22
|
$parcel$export(module.exports, "getRTLOffsetType", () => $efdd61e59e023a1d$export$faf7630257ad4304);
|
|
23
23
|
$parcel$export(module.exports, "getScrollLeft", () => $efdd61e59e023a1d$export$1389d168952b34b5);
|
|
24
24
|
$parcel$export(module.exports, "setScrollLeft", () => $efdd61e59e023a1d$export$ed5fd5ffe5ab0ac);
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
25
|
+
/*
|
|
26
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
27
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
28
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
29
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
30
|
+
*
|
|
31
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
32
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
33
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
34
|
+
* governing permissions and limitations under the License.
|
|
35
|
+
*/ /*
|
|
36
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
37
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
38
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
39
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
40
|
+
*
|
|
41
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
42
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
43
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
44
|
+
* governing permissions and limitations under the License.
|
|
45
|
+
*/
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
/*
|
|
50
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
51
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
52
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
53
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
54
|
+
*
|
|
55
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
56
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
57
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
58
|
+
* governing permissions and limitations under the License.
|
|
59
|
+
*/ // @ts-ignore
|
|
60
|
+
|
|
61
|
+
/*
|
|
62
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
63
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
64
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
65
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
66
|
+
*
|
|
67
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
68
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
69
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
70
|
+
* governing permissions and limitations under the License.
|
|
71
|
+
*/ let $efdd61e59e023a1d$var$cachedRTLResult = null;
|
|
31
72
|
function $efdd61e59e023a1d$export$faf7630257ad4304(recalculate = false) {
|
|
32
73
|
if ($efdd61e59e023a1d$var$cachedRTLResult === null || recalculate) {
|
|
33
|
-
const outerDiv = document.createElement(
|
|
74
|
+
const outerDiv = document.createElement("div");
|
|
34
75
|
const outerStyle = outerDiv.style;
|
|
35
|
-
outerStyle.width =
|
|
36
|
-
outerStyle.height =
|
|
37
|
-
outerStyle.overflow =
|
|
38
|
-
outerStyle.direction =
|
|
39
|
-
const innerDiv = document.createElement(
|
|
76
|
+
outerStyle.width = "50px";
|
|
77
|
+
outerStyle.height = "50px";
|
|
78
|
+
outerStyle.overflow = "scroll";
|
|
79
|
+
outerStyle.direction = "rtl";
|
|
80
|
+
const innerDiv = document.createElement("div");
|
|
40
81
|
const innerStyle = innerDiv.style;
|
|
41
|
-
innerStyle.width =
|
|
42
|
-
innerStyle.height =
|
|
82
|
+
innerStyle.width = "100px";
|
|
83
|
+
innerStyle.height = "100px";
|
|
43
84
|
outerDiv.appendChild(innerDiv);
|
|
44
85
|
document.body.appendChild(outerDiv);
|
|
45
|
-
if (outerDiv.scrollLeft > 0) $efdd61e59e023a1d$var$cachedRTLResult =
|
|
86
|
+
if (outerDiv.scrollLeft > 0) $efdd61e59e023a1d$var$cachedRTLResult = "positive-descending";
|
|
46
87
|
else {
|
|
47
88
|
outerDiv.scrollLeft = 1;
|
|
48
|
-
if (outerDiv.scrollLeft === 0) $efdd61e59e023a1d$var$cachedRTLResult =
|
|
49
|
-
else $efdd61e59e023a1d$var$cachedRTLResult =
|
|
89
|
+
if (outerDiv.scrollLeft === 0) $efdd61e59e023a1d$var$cachedRTLResult = "negative";
|
|
90
|
+
else $efdd61e59e023a1d$var$cachedRTLResult = "positive-ascending";
|
|
50
91
|
}
|
|
51
92
|
document.body.removeChild(outerDiv);
|
|
52
93
|
return $efdd61e59e023a1d$var$cachedRTLResult;
|
|
@@ -57,13 +98,13 @@ function $efdd61e59e023a1d$export$1389d168952b34b5(node, direction) {
|
|
|
57
98
|
let { scrollLeft: scrollLeft } = node;
|
|
58
99
|
// scrollLeft in rtl locales differs across browsers, so normalize.
|
|
59
100
|
// See comment by getRTLOffsetType below for details.
|
|
60
|
-
if (direction ===
|
|
101
|
+
if (direction === "rtl") {
|
|
61
102
|
let { scrollWidth: scrollWidth , clientWidth: clientWidth } = node;
|
|
62
103
|
switch($efdd61e59e023a1d$export$faf7630257ad4304()){
|
|
63
|
-
case
|
|
104
|
+
case "negative":
|
|
64
105
|
scrollLeft = -scrollLeft;
|
|
65
106
|
break;
|
|
66
|
-
case
|
|
107
|
+
case "positive-descending":
|
|
67
108
|
scrollLeft = scrollWidth - clientWidth - scrollLeft;
|
|
68
109
|
break;
|
|
69
110
|
}
|
|
@@ -71,11 +112,11 @@ function $efdd61e59e023a1d$export$1389d168952b34b5(node, direction) {
|
|
|
71
112
|
return scrollLeft;
|
|
72
113
|
}
|
|
73
114
|
function $efdd61e59e023a1d$export$ed5fd5ffe5ab0ac(node, direction, scrollLeft) {
|
|
74
|
-
if (direction ===
|
|
75
|
-
case
|
|
115
|
+
if (direction === "rtl") switch($efdd61e59e023a1d$export$faf7630257ad4304()){
|
|
116
|
+
case "negative":
|
|
76
117
|
scrollLeft = -scrollLeft;
|
|
77
118
|
break;
|
|
78
|
-
case
|
|
119
|
+
case "positive-ascending":
|
|
79
120
|
break;
|
|
80
121
|
default:
|
|
81
122
|
{
|
|
@@ -94,10 +135,10 @@ function $efdd61e59e023a1d$export$ed5fd5ffe5ab0ac(node, direction, scrollLeft) {
|
|
|
94
135
|
|
|
95
136
|
|
|
96
137
|
function $00ca8c0b29e3e07c$var$ScrollView(props, ref) {
|
|
97
|
-
let { contentSize: contentSize , onVisibleRectChange: onVisibleRectChange , children: children , innerStyle: innerStyle , sizeToFit: sizeToFit , onScrollStart: onScrollStart , onScrollEnd: onScrollEnd , scrollDirection: scrollDirection =
|
|
98
|
-
let defaultRef = $kYtlh$react.useRef();
|
|
138
|
+
let { contentSize: contentSize , onVisibleRectChange: onVisibleRectChange , children: children , innerStyle: innerStyle , sizeToFit: sizeToFit , onScrollStart: onScrollStart , onScrollEnd: onScrollEnd , scrollDirection: scrollDirection = "both" , ...otherProps } = props;
|
|
139
|
+
let defaultRef = (0, $kYtlh$react.useRef)();
|
|
99
140
|
ref = ref || defaultRef;
|
|
100
|
-
let state = $kYtlh$react.useRef({
|
|
141
|
+
let state = (0, $kYtlh$react.useRef)({
|
|
101
142
|
scrollTop: 0,
|
|
102
143
|
scrollLeft: 0,
|
|
103
144
|
scrollEndTime: 0,
|
|
@@ -106,18 +147,18 @@ function $00ca8c0b29e3e07c$var$ScrollView(props, ref) {
|
|
|
106
147
|
height: 0,
|
|
107
148
|
isScrolling: false
|
|
108
149
|
}).current;
|
|
109
|
-
let { direction: direction } = $kYtlh$reactariai18n.useLocale();
|
|
110
|
-
let [isScrolling, setScrolling] = $kYtlh$react.useState(false);
|
|
111
|
-
let onScroll = $kYtlh$react.useCallback((e)=>{
|
|
150
|
+
let { direction: direction } = (0, $kYtlh$reactariai18n.useLocale)();
|
|
151
|
+
let [isScrolling, setScrolling] = (0, $kYtlh$react.useState)(false);
|
|
152
|
+
let onScroll = (0, $kYtlh$react.useCallback)((e)=>{
|
|
112
153
|
if (e.target !== e.currentTarget) return;
|
|
113
154
|
if (props.onScroll) props.onScroll(e);
|
|
114
|
-
$kYtlh$reactdom.flushSync(()=>{
|
|
155
|
+
(0, $kYtlh$reactdom.flushSync)(()=>{
|
|
115
156
|
let scrollTop = e.currentTarget.scrollTop;
|
|
116
|
-
let scrollLeft = $efdd61e59e023a1d$export$1389d168952b34b5(e.currentTarget, direction);
|
|
157
|
+
let scrollLeft = (0, $efdd61e59e023a1d$export$1389d168952b34b5)(e.currentTarget, direction);
|
|
117
158
|
// Prevent rubber band scrolling from shaking when scrolling out of bounds
|
|
118
159
|
state.scrollTop = Math.max(0, Math.min(scrollTop, contentSize.height - state.height));
|
|
119
160
|
state.scrollLeft = Math.max(0, Math.min(scrollLeft, contentSize.width - state.width));
|
|
120
|
-
onVisibleRectChange(new $kYtlh$reactstatelyvirtualizer.Rect(state.scrollLeft, state.scrollTop, state.width, state.height));
|
|
161
|
+
onVisibleRectChange(new (0, $kYtlh$reactstatelyvirtualizer.Rect)(state.scrollLeft, state.scrollTop, state.width, state.height));
|
|
121
162
|
if (!state.isScrolling) {
|
|
122
163
|
state.isScrolling = true;
|
|
123
164
|
setScrolling(true);
|
|
@@ -148,25 +189,25 @@ function $00ca8c0b29e3e07c$var$ScrollView(props, ref) {
|
|
|
148
189
|
onScrollEnd
|
|
149
190
|
]);
|
|
150
191
|
// eslint-disable-next-line arrow-body-style
|
|
151
|
-
$kYtlh$react.useEffect(()=>{
|
|
192
|
+
(0, $kYtlh$react.useEffect)(()=>{
|
|
152
193
|
return ()=>{
|
|
153
194
|
clearTimeout(state.scrollTimeout);
|
|
154
195
|
};
|
|
155
196
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
156
197
|
}, []);
|
|
157
|
-
let updateSize = $kYtlh$react.useCallback(()=>{
|
|
198
|
+
let updateSize = (0, $kYtlh$react.useCallback)(()=>{
|
|
158
199
|
let dom = ref.current;
|
|
159
200
|
if (!dom) return;
|
|
160
201
|
let w = dom.clientWidth;
|
|
161
202
|
let h = dom.clientHeight;
|
|
162
203
|
if (sizeToFit && contentSize.width > 0 && contentSize.height > 0) {
|
|
163
|
-
if (sizeToFit ===
|
|
164
|
-
else if (sizeToFit ===
|
|
204
|
+
if (sizeToFit === "width") w = Math.min(w, contentSize.width);
|
|
205
|
+
else if (sizeToFit === "height") h = Math.min(h, contentSize.height);
|
|
165
206
|
}
|
|
166
207
|
if (state.width !== w || state.height !== h) {
|
|
167
208
|
state.width = w;
|
|
168
209
|
state.height = h;
|
|
169
|
-
onVisibleRectChange(new $kYtlh$reactstatelyvirtualizer.Rect(state.scrollLeft, state.scrollTop, w, h));
|
|
210
|
+
onVisibleRectChange(new (0, $kYtlh$reactstatelyvirtualizer.Rect)(state.scrollLeft, state.scrollTop, w, h));
|
|
170
211
|
}
|
|
171
212
|
}, [
|
|
172
213
|
onVisibleRectChange,
|
|
@@ -175,12 +216,12 @@ function $00ca8c0b29e3e07c$var$ScrollView(props, ref) {
|
|
|
175
216
|
sizeToFit,
|
|
176
217
|
contentSize
|
|
177
218
|
]);
|
|
178
|
-
$kYtlh$reactariautils.useLayoutEffect(()=>{
|
|
219
|
+
(0, $kYtlh$reactariautils.useLayoutEffect)(()=>{
|
|
179
220
|
updateSize();
|
|
180
221
|
}, [
|
|
181
222
|
updateSize
|
|
182
223
|
]);
|
|
183
|
-
$kYtlh$reactariautils.useResizeObserver({
|
|
224
|
+
(0, $kYtlh$reactariautils.useResizeObserver)({
|
|
184
225
|
ref: ref,
|
|
185
226
|
onResize: updateSize
|
|
186
227
|
});
|
|
@@ -189,40 +230,50 @@ function $00ca8c0b29e3e07c$var$ScrollView(props, ref) {
|
|
|
189
230
|
padding: 0,
|
|
190
231
|
...otherProps.style
|
|
191
232
|
};
|
|
192
|
-
if (scrollDirection ===
|
|
193
|
-
style.overflowX =
|
|
194
|
-
style.overflowY =
|
|
195
|
-
} else if (scrollDirection ===
|
|
196
|
-
style.overflowY =
|
|
197
|
-
style.overflowX =
|
|
198
|
-
} else style.overflow =
|
|
199
|
-
return
|
|
233
|
+
if (scrollDirection === "horizontal") {
|
|
234
|
+
style.overflowX = "auto";
|
|
235
|
+
style.overflowY = "hidden";
|
|
236
|
+
} else if (scrollDirection === "vertical") {
|
|
237
|
+
style.overflowY = "auto";
|
|
238
|
+
style.overflowX = "hidden";
|
|
239
|
+
} else style.overflow = "auto";
|
|
240
|
+
return /*#__PURE__*/ (0, ($parcel$interopDefault($kYtlh$react))).createElement("div", {
|
|
200
241
|
...otherProps,
|
|
201
242
|
style: style,
|
|
202
243
|
ref: ref,
|
|
203
244
|
onScroll: onScroll
|
|
204
|
-
}, /*#__PURE__*/ ($parcel$interopDefault($kYtlh$react)).createElement("div", {
|
|
245
|
+
}, /*#__PURE__*/ (0, ($parcel$interopDefault($kYtlh$react))).createElement("div", {
|
|
205
246
|
role: "presentation",
|
|
206
247
|
style: {
|
|
207
248
|
width: contentSize.width,
|
|
208
249
|
height: contentSize.height,
|
|
209
|
-
pointerEvents: isScrolling ?
|
|
210
|
-
position:
|
|
250
|
+
pointerEvents: isScrolling ? "none" : "auto",
|
|
251
|
+
position: "relative",
|
|
211
252
|
...innerStyle
|
|
212
253
|
}
|
|
213
|
-
}, children))
|
|
254
|
+
}, children));
|
|
214
255
|
}
|
|
215
|
-
const $00ca8c0b29e3e07c$export$5665e3d6be6adea = /*#__PURE__*/ ($parcel$interopDefault($kYtlh$react)).forwardRef($00ca8c0b29e3e07c$var$ScrollView);
|
|
216
|
-
|
|
256
|
+
const $00ca8c0b29e3e07c$export$5665e3d6be6adea = /*#__PURE__*/ (0, ($parcel$interopDefault($kYtlh$react))).forwardRef($00ca8c0b29e3e07c$var$ScrollView);
|
|
217
257
|
|
|
218
258
|
|
|
259
|
+
/*
|
|
260
|
+
* Copyright 2022 Adobe. All rights reserved.
|
|
261
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
262
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
263
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
264
|
+
*
|
|
265
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
266
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
267
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
268
|
+
* governing permissions and limitations under the License.
|
|
269
|
+
*/
|
|
219
270
|
|
|
220
271
|
function $d9e30fd7b96073c4$export$eac1895992b9f3d6({ isEmpty: isEmpty , hasRenderedAnything: hasRenderedAnything }, ref) {
|
|
221
|
-
let [hasTabbableChild, setHasTabbableChild] = $kYtlh$react.useState(false);
|
|
222
|
-
$kYtlh$react.useEffect(()=>{
|
|
272
|
+
let [hasTabbableChild, setHasTabbableChild] = (0, $kYtlh$react.useState)(false);
|
|
273
|
+
(0, $kYtlh$react.useEffect)(()=>{
|
|
223
274
|
if ((ref === null || ref === void 0 ? void 0 : ref.current) && isEmpty && hasRenderedAnything) {
|
|
224
275
|
// Detect if there are any tabbable elements and update the tabIndex accordingly.
|
|
225
|
-
let walker = $kYtlh$reactariafocus.getFocusableTreeWalker(ref.current, {
|
|
276
|
+
let walker = (0, $kYtlh$reactariafocus.getFocusableTreeWalker)(ref.current, {
|
|
226
277
|
tabbable: true
|
|
227
278
|
});
|
|
228
279
|
setHasTabbableChild(!!walker.nextNode());
|
|
@@ -236,14 +287,34 @@ function $d9e30fd7b96073c4$export$eac1895992b9f3d6({ isEmpty: isEmpty , hasRende
|
|
|
236
287
|
}
|
|
237
288
|
|
|
238
289
|
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
290
|
+
/*
|
|
291
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
292
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
293
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
294
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
295
|
+
*
|
|
296
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
297
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
298
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
299
|
+
* governing permissions and limitations under the License.
|
|
300
|
+
*/
|
|
301
|
+
|
|
302
|
+
/*
|
|
303
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
304
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
305
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
306
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
307
|
+
*
|
|
308
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
309
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
310
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
311
|
+
* governing permissions and limitations under the License.
|
|
312
|
+
*/
|
|
242
313
|
|
|
243
314
|
|
|
244
315
|
function $7d70e069fceb2deb$export$1da781778207e0a2(options) {
|
|
245
316
|
let { reusableView: { layoutInfo: layoutInfo , virtualizer: virtualizer } , ref: ref } = options;
|
|
246
|
-
let updateSize = $kYtlh$react.useCallback(()=>{
|
|
317
|
+
let updateSize = (0, $kYtlh$react.useCallback)(()=>{
|
|
247
318
|
let size = $7d70e069fceb2deb$var$getSize(ref.current);
|
|
248
319
|
virtualizer.updateItemSize(layoutInfo.key, size);
|
|
249
320
|
}, [
|
|
@@ -251,7 +322,7 @@ function $7d70e069fceb2deb$export$1da781778207e0a2(options) {
|
|
|
251
322
|
layoutInfo.key,
|
|
252
323
|
ref
|
|
253
324
|
]);
|
|
254
|
-
$kYtlh$reactariautils.useLayoutEffect(()=>{
|
|
325
|
+
(0, $kYtlh$reactariautils.useLayoutEffect)(()=>{
|
|
255
326
|
if (layoutInfo.estimatedSize) updateSize();
|
|
256
327
|
});
|
|
257
328
|
return {
|
|
@@ -261,8 +332,8 @@ function $7d70e069fceb2deb$export$1da781778207e0a2(options) {
|
|
|
261
332
|
function $7d70e069fceb2deb$var$getSize(node) {
|
|
262
333
|
// Reset height before measuring so we get the intrinsic size
|
|
263
334
|
let height = node.style.height;
|
|
264
|
-
node.style.height =
|
|
265
|
-
let size = new $kYtlh$reactstatelyvirtualizer.Size(node.scrollWidth, node.scrollHeight);
|
|
335
|
+
node.style.height = "";
|
|
336
|
+
let size = new (0, $kYtlh$reactstatelyvirtualizer.Size)(node.scrollWidth, node.scrollHeight);
|
|
266
337
|
node.style.height = height;
|
|
267
338
|
return size;
|
|
268
339
|
}
|
|
@@ -270,22 +341,22 @@ function $7d70e069fceb2deb$var$getSize(node) {
|
|
|
270
341
|
|
|
271
342
|
function $d6a26279cc31826b$export$6796df8ba7398521(props) {
|
|
272
343
|
let { className: className , reusableView: reusableView , parent: parent } = props;
|
|
273
|
-
let { direction: direction } = $kYtlh$reactariai18n.useLocale();
|
|
274
|
-
let ref = $kYtlh$react.useRef();
|
|
275
|
-
$7d70e069fceb2deb$export$1da781778207e0a2({
|
|
344
|
+
let { direction: direction } = (0, $kYtlh$reactariai18n.useLocale)();
|
|
345
|
+
let ref = (0, $kYtlh$react.useRef)();
|
|
346
|
+
(0, $7d70e069fceb2deb$export$1da781778207e0a2)({
|
|
276
347
|
reusableView: reusableView,
|
|
277
348
|
ref: ref
|
|
278
349
|
});
|
|
279
|
-
return
|
|
350
|
+
return /*#__PURE__*/ (0, ($parcel$interopDefault($kYtlh$react))).createElement("div", {
|
|
280
351
|
role: "presentation",
|
|
281
352
|
ref: ref,
|
|
282
353
|
className: className,
|
|
283
354
|
style: $d6a26279cc31826b$export$1481e64fbe01b8b3(reusableView.layoutInfo, direction, parent && parent.layoutInfo)
|
|
284
|
-
}, reusableView.rendered)
|
|
355
|
+
}, reusableView.rendered);
|
|
285
356
|
}
|
|
286
357
|
let $d6a26279cc31826b$var$cache = new WeakMap();
|
|
287
358
|
function $d6a26279cc31826b$export$1481e64fbe01b8b3(layoutInfo, dir, parent) {
|
|
288
|
-
let xProperty = dir ===
|
|
359
|
+
let xProperty = dir === "rtl" ? "right" : "left";
|
|
289
360
|
let cached = $d6a26279cc31826b$var$cache.get(layoutInfo);
|
|
290
361
|
if (cached && cached[xProperty] != null) {
|
|
291
362
|
if (!parent) return cached;
|
|
@@ -295,20 +366,20 @@ function $d6a26279cc31826b$export$1481e64fbe01b8b3(layoutInfo, dir, parent) {
|
|
|
295
366
|
if (cached.top === top && cached[xProperty] === x) return cached;
|
|
296
367
|
}
|
|
297
368
|
let style = {
|
|
298
|
-
position: layoutInfo.isSticky ?
|
|
299
|
-
overflow: layoutInfo.allowOverflow ?
|
|
369
|
+
position: layoutInfo.isSticky ? "sticky" : "absolute",
|
|
370
|
+
overflow: layoutInfo.allowOverflow ? "visible" : "hidden",
|
|
300
371
|
top: layoutInfo.rect.y - (parent ? parent.rect.y : 0),
|
|
301
372
|
[xProperty]: layoutInfo.rect.x - (parent ? parent.rect.x : 0),
|
|
302
|
-
transition:
|
|
303
|
-
WebkitTransition:
|
|
304
|
-
WebkitTransitionDuration:
|
|
305
|
-
transitionDuration:
|
|
373
|
+
transition: "all",
|
|
374
|
+
WebkitTransition: "all",
|
|
375
|
+
WebkitTransitionDuration: "inherit",
|
|
376
|
+
transitionDuration: "inherit",
|
|
306
377
|
width: layoutInfo.rect.width,
|
|
307
378
|
height: layoutInfo.rect.height,
|
|
308
379
|
opacity: layoutInfo.opacity,
|
|
309
380
|
zIndex: layoutInfo.zIndex,
|
|
310
381
|
transform: layoutInfo.transform,
|
|
311
|
-
contain:
|
|
382
|
+
contain: "size layout style"
|
|
312
383
|
};
|
|
313
384
|
$d6a26279cc31826b$var$cache.set(layoutInfo, style);
|
|
314
385
|
return style;
|
|
@@ -320,9 +391,9 @@ function $e1fb6f3669e1c329$var$Virtualizer(props, ref) {
|
|
|
320
391
|
focusedKey , shouldUseVirtualFocus: // eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
321
392
|
shouldUseVirtualFocus , scrollToItem: // eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
322
393
|
scrollToItem , ...otherProps } = props;
|
|
323
|
-
let fallbackRef = $kYtlh$react.useRef();
|
|
394
|
+
let fallbackRef = (0, $kYtlh$react.useRef)();
|
|
324
395
|
ref = ref || fallbackRef;
|
|
325
|
-
let state = $kYtlh$reactstatelyvirtualizer.useVirtualizerState({
|
|
396
|
+
let state = (0, $kYtlh$reactstatelyvirtualizer.useVirtualizerState)({
|
|
326
397
|
transitionDuration: transitionDuration,
|
|
327
398
|
layout: layout,
|
|
328
399
|
collection: collection,
|
|
@@ -335,7 +406,7 @@ function $e1fb6f3669e1c329$var$Virtualizer(props, ref) {
|
|
|
335
406
|
});
|
|
336
407
|
let { virtualizerProps: virtualizerProps } = $e1fb6f3669e1c329$export$dd6d526d88b5a137(props, state, ref);
|
|
337
408
|
// Handle scrolling, and call onLoadMore when nearing the bottom.
|
|
338
|
-
let onVisibleRectChange = $kYtlh$react.useCallback((rect)=>{
|
|
409
|
+
let onVisibleRectChange = (0, $kYtlh$react.useCallback)((rect)=>{
|
|
339
410
|
state.setVisibleRect(rect);
|
|
340
411
|
if (!isLoading && onLoadMore) {
|
|
341
412
|
let scrollOffset = state.virtualizer.contentSize.height - rect.height * 2;
|
|
@@ -346,7 +417,7 @@ function $e1fb6f3669e1c329$var$Virtualizer(props, ref) {
|
|
|
346
417
|
onLoadMore,
|
|
347
418
|
state
|
|
348
419
|
]);
|
|
349
|
-
$kYtlh$reactariautils.useLayoutEffect(()=>{
|
|
420
|
+
(0, $kYtlh$reactariautils.useLayoutEffect)(()=>{
|
|
350
421
|
if (!isLoading && onLoadMore && !state.isAnimating) {
|
|
351
422
|
if (state.contentSize.height > 0 && state.contentSize.height <= state.virtualizer.visibleRect.height) onLoadMore();
|
|
352
423
|
}
|
|
@@ -357,8 +428,8 @@ function $e1fb6f3669e1c329$var$Virtualizer(props, ref) {
|
|
|
357
428
|
onLoadMore,
|
|
358
429
|
isLoading
|
|
359
430
|
]);
|
|
360
|
-
return
|
|
361
|
-
|
|
431
|
+
return /*#__PURE__*/ (0, ($parcel$interopDefault($kYtlh$react))).createElement((0, $00ca8c0b29e3e07c$export$5665e3d6be6adea), {
|
|
432
|
+
...(0, $kYtlh$reactariautils.mergeProps)(otherProps, virtualizerProps),
|
|
362
433
|
ref: ref,
|
|
363
434
|
innerStyle: state.isAnimating ? {
|
|
364
435
|
transition: `none ${state.virtualizer.transitionDuration}ms`
|
|
@@ -369,7 +440,7 @@ function $e1fb6f3669e1c329$var$Virtualizer(props, ref) {
|
|
|
369
440
|
onScrollEnd: state.endScrolling,
|
|
370
441
|
sizeToFit: sizeToFit,
|
|
371
442
|
scrollDirection: scrollDirection
|
|
372
|
-
}, state.visibleViews)
|
|
443
|
+
}, state.visibleViews);
|
|
373
444
|
}
|
|
374
445
|
function $e1fb6f3669e1c329$export$dd6d526d88b5a137(props, state, ref) {
|
|
375
446
|
let { focusedKey: focusedKey , scrollToItem: scrollToItem , shouldUseVirtualFocus: shouldUseVirtualFocus } = props;
|
|
@@ -377,14 +448,14 @@ function $e1fb6f3669e1c329$export$dd6d526d88b5a137(props, state, ref) {
|
|
|
377
448
|
// Scroll to the focusedKey when it changes. Actually focusing the focusedKey
|
|
378
449
|
// is up to the implementation using Virtualizer since we don't have refs
|
|
379
450
|
// to all of the item DOM nodes.
|
|
380
|
-
let lastFocusedKey = $kYtlh$react.useRef(null);
|
|
381
|
-
let isFocusWithin = $kYtlh$react.useRef(false);
|
|
382
|
-
$kYtlh$react.useEffect(()=>{
|
|
451
|
+
let lastFocusedKey = (0, $kYtlh$react.useRef)(null);
|
|
452
|
+
let isFocusWithin = (0, $kYtlh$react.useRef)(false);
|
|
453
|
+
(0, $kYtlh$react.useEffect)(()=>{
|
|
383
454
|
if (virtualizer.visibleRect.height === 0) return;
|
|
384
455
|
// Only scroll the focusedKey into view if the modality is not pointer to avoid jumps in position when clicking/pressing tall items.
|
|
385
456
|
// Exception made if focus isn't within the virtualizer (e.g. opening a picker via click should scroll the selected item into view)
|
|
386
|
-
let modality = $kYtlh$reactariainteractions.getInteractionModality();
|
|
387
|
-
if (focusedKey !== lastFocusedKey.current && (modality !==
|
|
457
|
+
let modality = (0, $kYtlh$reactariainteractions.getInteractionModality)();
|
|
458
|
+
if (focusedKey !== lastFocusedKey.current && (modality !== "pointer" || !isFocusWithin.current)) {
|
|
388
459
|
if (scrollToItem) scrollToItem(focusedKey);
|
|
389
460
|
else virtualizer.scrollToItem(focusedKey, {
|
|
390
461
|
duration: 0
|
|
@@ -399,19 +470,18 @@ function $e1fb6f3669e1c329$export$dd6d526d88b5a137(props, state, ref) {
|
|
|
399
470
|
scrollToItem
|
|
400
471
|
]);
|
|
401
472
|
// Persist the focusedKey and prevent it from being removed from the DOM when scrolled out of view.
|
|
402
|
-
virtualizer.persistedKeys = $kYtlh$react.useMemo(()=>focusedKey ? new Set([
|
|
473
|
+
virtualizer.persistedKeys = (0, $kYtlh$react.useMemo)(()=>focusedKey ? new Set([
|
|
403
474
|
focusedKey
|
|
404
|
-
]) : new Set()
|
|
405
|
-
, [
|
|
475
|
+
]) : new Set(), [
|
|
406
476
|
focusedKey
|
|
407
477
|
]);
|
|
408
|
-
let onFocus = $kYtlh$react.useCallback((e)=>{
|
|
478
|
+
let onFocus = (0, $kYtlh$react.useCallback)((e)=>{
|
|
409
479
|
// If the focused item is scrolled out of view and is not in the DOM, the collection
|
|
410
480
|
// will have tabIndex={0}. When tabbing in from outside, scroll the focused item into view.
|
|
411
481
|
// Ignore focus events that bubble through portals (e.g. focus that happens on a menu popover child of the virtualizer)
|
|
412
482
|
// Don't scroll focused key into view if modality is pointer to prevent sudden jump in position (e.g. CardView).
|
|
413
|
-
let modality = $kYtlh$reactariainteractions.getInteractionModality();
|
|
414
|
-
if (!isFocusWithin.current && ref.current.contains(e.target) && modality !==
|
|
483
|
+
let modality = (0, $kYtlh$reactariainteractions.getInteractionModality)();
|
|
484
|
+
if (!isFocusWithin.current && ref.current.contains(e.target) && modality !== "pointer") {
|
|
415
485
|
if (scrollToItem) scrollToItem(focusedKey);
|
|
416
486
|
else virtualizer.scrollToItem(focusedKey, {
|
|
417
487
|
duration: 0
|
|
@@ -424,7 +494,7 @@ function $e1fb6f3669e1c329$export$dd6d526d88b5a137(props, state, ref) {
|
|
|
424
494
|
focusedKey,
|
|
425
495
|
scrollToItem
|
|
426
496
|
]);
|
|
427
|
-
let onBlur = $kYtlh$react.useCallback((e)=>{
|
|
497
|
+
let onBlur = (0, $kYtlh$react.useCallback)((e)=>{
|
|
428
498
|
isFocusWithin.current = ref.current.contains(e.relatedTarget);
|
|
429
499
|
}, [
|
|
430
500
|
ref
|
|
@@ -432,10 +502,10 @@ function $e1fb6f3669e1c329$export$dd6d526d88b5a137(props, state, ref) {
|
|
|
432
502
|
// When the focused item is scrolled out of view and is removed from the DOM,
|
|
433
503
|
// move focus to the collection view as a whole if focus was within before.
|
|
434
504
|
let focusedView = virtualizer.getView(focusedKey);
|
|
435
|
-
$kYtlh$react.useEffect(()=>{
|
|
436
|
-
if (focusedKey && !focusedView && isFocusWithin.current && document.activeElement !== ref.current) $kYtlh$reactariautils.focusWithoutScrolling(ref.current);
|
|
505
|
+
(0, $kYtlh$react.useEffect)(()=>{
|
|
506
|
+
if (focusedKey && !focusedView && isFocusWithin.current && document.activeElement !== ref.current) (0, $kYtlh$reactariautils.focusWithoutScrolling)(ref.current);
|
|
437
507
|
});
|
|
438
|
-
let hasTabbableChild = $d9e30fd7b96073c4$export$eac1895992b9f3d6({
|
|
508
|
+
let hasTabbableChild = (0, $d9e30fd7b96073c4$export$eac1895992b9f3d6)({
|
|
439
509
|
isEmpty: virtualizer.collection.size === 0,
|
|
440
510
|
hasRenderedAnything: virtualizer.contentSize.height > 0 || virtualizer.contentSize.width > 0
|
|
441
511
|
}, ref);
|
|
@@ -458,13 +528,13 @@ function $e1fb6f3669e1c329$export$dd6d526d88b5a137(props, state, ref) {
|
|
|
458
528
|
}
|
|
459
529
|
// forwardRef doesn't support generic parameters, so cast the result to the correct type
|
|
460
530
|
// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref
|
|
461
|
-
const $e1fb6f3669e1c329$export$89be5a243e59c4b2 = /*#__PURE__*/ ($parcel$interopDefault($kYtlh$react)).forwardRef($e1fb6f3669e1c329$var$Virtualizer);
|
|
531
|
+
const $e1fb6f3669e1c329$export$89be5a243e59c4b2 = /*#__PURE__*/ (0, ($parcel$interopDefault($kYtlh$react))).forwardRef($e1fb6f3669e1c329$var$Virtualizer);
|
|
462
532
|
function $e1fb6f3669e1c329$var$defaultRenderWrapper(parent, reusableView) {
|
|
463
|
-
return
|
|
533
|
+
return /*#__PURE__*/ (0, ($parcel$interopDefault($kYtlh$react))).createElement((0, $d6a26279cc31826b$export$6796df8ba7398521), {
|
|
464
534
|
key: reusableView.key,
|
|
465
535
|
reusableView: reusableView,
|
|
466
536
|
parent: parent
|
|
467
|
-
})
|
|
537
|
+
});
|
|
468
538
|
}
|
|
469
539
|
|
|
470
540
|
|