@react-spectrum/table 3.12.10-nightly.4624 → 3.12.11-nightly.4629
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/DragPreview.main.js +5 -5
- package/dist/DragPreview.mjs +5 -5
- package/dist/DragPreview.module.js +5 -5
- package/dist/InsertionIndicator.main.js +6 -6
- package/dist/InsertionIndicator.mjs +6 -6
- package/dist/InsertionIndicator.module.js +6 -6
- package/dist/Resizer.main.js +20 -20
- package/dist/Resizer.mjs +20 -20
- package/dist/Resizer.module.js +20 -20
- package/dist/RootDropIndicator.main.js +4 -4
- package/dist/RootDropIndicator.mjs +4 -4
- package/dist/RootDropIndicator.module.js +4 -4
- package/dist/TableView.main.js +3 -3
- package/dist/TableView.mjs +3 -3
- package/dist/TableView.module.js +3 -3
- package/dist/TableViewBase.main.js +191 -191
- package/dist/TableViewBase.mjs +191 -191
- package/dist/TableViewBase.module.js +191 -191
- package/dist/TreeGridTableView.main.js +3 -3
- package/dist/TreeGridTableView.mjs +3 -3
- package/dist/TreeGridTableView.module.js +3 -3
- package/package.json +29 -29
|
@@ -128,9 +128,9 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
128
128
|
let dragHooksProvided = (0, $7lS7h$useRef)(isTableDraggable);
|
|
129
129
|
let dropHooksProvided = (0, $7lS7h$useRef)(isTableDroppable);
|
|
130
130
|
(0, $7lS7h$useEffect)(()=>{
|
|
131
|
-
if (dragHooksProvided.current !== isTableDraggable) console.warn(
|
|
132
|
-
if (dropHooksProvided.current !== isTableDroppable) console.warn(
|
|
133
|
-
if (
|
|
131
|
+
if (dragHooksProvided.current !== isTableDraggable) console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
|
|
132
|
+
if (dropHooksProvided.current !== isTableDroppable) console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
|
|
133
|
+
if ('expandedKeys' in state && (isTableDraggable || isTableDroppable)) console.warn('Drag and drop is not yet fully supported with expandable rows and may produce unexpected results.');
|
|
134
134
|
}, [
|
|
135
135
|
isTableDraggable,
|
|
136
136
|
isTableDroppable,
|
|
@@ -168,8 +168,8 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
168
168
|
let domRef = (0, $7lS7h$useDOMRef)(ref);
|
|
169
169
|
let headerRef = (0, $7lS7h$useRef)();
|
|
170
170
|
let bodyRef = (0, $7lS7h$useRef)();
|
|
171
|
-
let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))),
|
|
172
|
-
let density = props.density ||
|
|
171
|
+
let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))), '@react-spectrum/table');
|
|
172
|
+
let density = props.density || 'regular';
|
|
173
173
|
let columnLayout = (0, $7lS7h$useMemo)(()=>new (0, $7lS7h$TableColumnLayout)({
|
|
174
174
|
getDefaultWidth: getDefaultWidth,
|
|
175
175
|
getDefaultMinWidth: getDefaultMinWidth
|
|
@@ -179,10 +179,10 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
179
179
|
]);
|
|
180
180
|
let tableLayout = (0, $7lS7h$useMemo)(()=>new (0, $7lS7h$TableLayout)({
|
|
181
181
|
// If props.rowHeight is auto, then use estimated heights based on scale, otherwise use fixed heights.
|
|
182
|
-
rowHeight: props.overflowMode ===
|
|
183
|
-
estimatedRowHeight: props.overflowMode ===
|
|
184
|
-
headingHeight: props.overflowMode ===
|
|
185
|
-
estimatedHeadingHeight: props.overflowMode ===
|
|
182
|
+
rowHeight: props.overflowMode === 'wrap' ? null : $bd013581c0a4b065$var$ROW_HEIGHTS[density][scale],
|
|
183
|
+
estimatedRowHeight: props.overflowMode === 'wrap' ? $bd013581c0a4b065$var$ROW_HEIGHTS[density][scale] : null,
|
|
184
|
+
headingHeight: props.overflowMode === 'wrap' ? null : $bd013581c0a4b065$var$DEFAULT_HEADER_HEIGHT[scale],
|
|
185
|
+
estimatedHeadingHeight: props.overflowMode === 'wrap' ? $bd013581c0a4b065$var$DEFAULT_HEADER_HEIGHT[scale] : null,
|
|
186
186
|
columnLayout: columnLayout,
|
|
187
187
|
initialCollection: state.collection
|
|
188
188
|
}), // don't recompute when state.collection changes, only used for initial value
|
|
@@ -198,7 +198,7 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
198
198
|
let layout = (0, $7lS7h$useMemo)(()=>{
|
|
199
199
|
let proxy = new Proxy(tableLayout, {
|
|
200
200
|
get (target, prop, receiver) {
|
|
201
|
-
return prop ===
|
|
201
|
+
return prop === 'tableState' ? state : Reflect.get(target, prop, receiver);
|
|
202
202
|
}
|
|
203
203
|
});
|
|
204
204
|
return proxy;
|
|
@@ -230,7 +230,7 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
230
230
|
dropTargetDelegate: layout
|
|
231
231
|
}, dropState, domRef);
|
|
232
232
|
isRootDropTarget = dropState.isDropTarget({
|
|
233
|
-
type:
|
|
233
|
+
type: 'root'
|
|
234
234
|
});
|
|
235
235
|
}
|
|
236
236
|
let { gridProps: gridProps } = (0, $7lS7h$useTable)({
|
|
@@ -243,18 +243,18 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
243
243
|
let [headerRowHovered, setHeaderRowHovered] = (0, $7lS7h$useState)(false);
|
|
244
244
|
let renderWrapper = (parent, reusableView, children, renderChildren)=>{
|
|
245
245
|
let style = (0, $7lS7h$layoutInfoToStyle)(reusableView.layoutInfo, direction, parent && parent.layoutInfo);
|
|
246
|
-
if (style.overflow ===
|
|
247
|
-
if (reusableView.viewType ===
|
|
246
|
+
if (style.overflow === 'hidden') style.overflow = 'visible'; // needed to support position: sticky
|
|
247
|
+
if (reusableView.viewType === 'rowgroup') return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableRowGroup, {
|
|
248
248
|
key: reusableView.key,
|
|
249
249
|
style: style
|
|
250
250
|
}, isTableDroppable && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $4e6fc36ba71ba405$export$d30a7814cfd4033e), {
|
|
251
251
|
key: "root"
|
|
252
252
|
}), renderChildren(children));
|
|
253
|
-
if (reusableView.viewType ===
|
|
253
|
+
if (reusableView.viewType === 'header') return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableHeader, {
|
|
254
254
|
key: reusableView.key,
|
|
255
255
|
style: style
|
|
256
256
|
}, renderChildren(children));
|
|
257
|
-
if (reusableView.viewType ===
|
|
257
|
+
if (reusableView.viewType === 'row') return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableRow, {
|
|
258
258
|
key: reusableView.key,
|
|
259
259
|
item: reusableView.content,
|
|
260
260
|
style: style,
|
|
@@ -262,7 +262,7 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
262
262
|
isTableDroppable: isTableDroppable,
|
|
263
263
|
isTableDraggable: isTableDraggable
|
|
264
264
|
}, renderChildren(children));
|
|
265
|
-
if (reusableView.viewType ===
|
|
265
|
+
if (reusableView.viewType === 'headerrow') return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableHeaderRow, {
|
|
266
266
|
onHoverChange: setHeaderRowHovered,
|
|
267
267
|
key: reusableView.key,
|
|
268
268
|
style: style,
|
|
@@ -272,12 +272,12 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
272
272
|
let isRootDroptarget;
|
|
273
273
|
if (isTableDroppable) {
|
|
274
274
|
if (parent.content) isDropTarget = dropState.isDropTarget({
|
|
275
|
-
type:
|
|
276
|
-
dropPosition:
|
|
275
|
+
type: 'item',
|
|
276
|
+
dropPosition: 'on',
|
|
277
277
|
key: parent.content.key
|
|
278
278
|
});
|
|
279
279
|
isRootDroptarget = dropState.isDropTarget({
|
|
280
|
-
type:
|
|
280
|
+
type: 'root'
|
|
281
281
|
});
|
|
282
282
|
}
|
|
283
283
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VirtualizerItem), {
|
|
@@ -285,21 +285,21 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
285
285
|
layoutInfo: reusableView.layoutInfo,
|
|
286
286
|
virtualizer: reusableView.virtualizer,
|
|
287
287
|
parent: parent === null || parent === void 0 ? void 0 : parent.layoutInfo,
|
|
288
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
289
|
-
|
|
290
|
-
|
|
288
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-cellWrapper', (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), {
|
|
289
|
+
'react-spectrum-Table-cellWrapper': !reusableView.layoutInfo.estimatedSize,
|
|
290
|
+
'react-spectrum-Table-cellWrapper--dropTarget': isDropTarget || isRootDroptarget
|
|
291
291
|
}))
|
|
292
292
|
}, reusableView.rendered);
|
|
293
293
|
};
|
|
294
294
|
let renderView = (type, item)=>{
|
|
295
295
|
switch(type){
|
|
296
|
-
case
|
|
297
|
-
case
|
|
298
|
-
case
|
|
299
|
-
case
|
|
300
|
-
case
|
|
296
|
+
case 'header':
|
|
297
|
+
case 'rowgroup':
|
|
298
|
+
case 'section':
|
|
299
|
+
case 'row':
|
|
300
|
+
case 'headerrow':
|
|
301
301
|
return null;
|
|
302
|
-
case
|
|
302
|
+
case 'cell':
|
|
303
303
|
if (item.props.isSelectionCell) return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableCheckboxCell, {
|
|
304
304
|
cell: item
|
|
305
305
|
});
|
|
@@ -309,14 +309,14 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
309
309
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableCell, {
|
|
310
310
|
cell: item
|
|
311
311
|
});
|
|
312
|
-
case
|
|
312
|
+
case 'placeholder':
|
|
313
313
|
// TODO: move to react-aria?
|
|
314
314
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
315
315
|
role: "gridcell",
|
|
316
316
|
"aria-colindex": item.index + 1,
|
|
317
317
|
"aria-colspan": item.colspan > 1 ? item.colspan : null
|
|
318
318
|
});
|
|
319
|
-
case
|
|
319
|
+
case 'column':
|
|
320
320
|
if (item.props.isSelectionCell) return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableSelectAllCell, {
|
|
321
321
|
column: item
|
|
322
322
|
});
|
|
@@ -339,12 +339,12 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
339
339
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableColumnHeader, {
|
|
340
340
|
column: item
|
|
341
341
|
});
|
|
342
|
-
case
|
|
342
|
+
case 'loader':
|
|
343
343
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$CenteredWrapper, null, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$ProgressCircle), {
|
|
344
344
|
isIndeterminate: true,
|
|
345
|
-
"aria-label": state.collection.size > 0 ? stringFormatter.format(
|
|
345
|
+
"aria-label": state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')
|
|
346
346
|
}));
|
|
347
|
-
case
|
|
347
|
+
case 'empty':
|
|
348
348
|
{
|
|
349
349
|
let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
|
|
350
350
|
if (emptyState == null) return null;
|
|
@@ -390,7 +390,7 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
390
390
|
setIsResizing
|
|
391
391
|
]);
|
|
392
392
|
let focusedKey = state.selectionManager.focusedKey;
|
|
393
|
-
if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) ===
|
|
393
|
+
if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') focusedKey = dropState.target.key;
|
|
394
394
|
let mergedProps = (0, $7lS7h$mergeProps)(isTableDroppable && (droppableCollection === null || droppableCollection === void 0 ? void 0 : droppableCollection.collectionProps), gridProps, focusProps, (dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.isVirtualDragging()) && {
|
|
395
395
|
tabIndex: null
|
|
396
396
|
});
|
|
@@ -417,13 +417,13 @@ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
|
|
|
417
417
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableVirtualizer, {
|
|
418
418
|
...mergedProps,
|
|
419
419
|
...styleProps,
|
|
420
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
420
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table', `spectrum-Table--${density}`, {
|
|
421
|
+
'spectrum-Table--quiet': isQuiet,
|
|
422
|
+
'spectrum-Table--wrap': props.overflowMode === 'wrap',
|
|
423
|
+
'spectrum-Table--loadingMore': state.collection.body.props.loadingState === 'loadingMore',
|
|
424
|
+
'spectrum-Table--isVerticalScrollbarVisible': isVerticalScrollbarVisible,
|
|
425
|
+
'spectrum-Table--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible
|
|
426
|
+
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table'), styleProps.className),
|
|
427
427
|
layout: layout,
|
|
428
428
|
collection: state.collection,
|
|
429
429
|
focusedKey: focusedKey,
|
|
@@ -458,7 +458,7 @@ function $bd013581c0a4b065$var$TableVirtualizer(props) {
|
|
|
458
458
|
let { layout: layout, collection: collection, focusedKey: focusedKey, renderView: renderView, renderWrapper: renderWrapper, domRef: domRef, bodyRef: bodyRef, headerRef: headerRef, onVisibleRectChange: onVisibleRectChangeProp, isFocusVisible: isFocusVisible, isVirtualDragging: isVirtualDragging, isRootDropTarget: isRootDropTarget, ...otherProps } = props;
|
|
459
459
|
let { direction: direction } = (0, $7lS7h$useLocale)();
|
|
460
460
|
let loadingState = collection.body.props.loadingState;
|
|
461
|
-
let isLoading = loadingState ===
|
|
461
|
+
let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
|
|
462
462
|
let onLoadMore = collection.body.props.onLoadMore;
|
|
463
463
|
let transitionDuration = 220;
|
|
464
464
|
if (isLoading) transitionDuration = 160;
|
|
@@ -482,7 +482,7 @@ function $bd013581c0a4b065$var$TableVirtualizer(props) {
|
|
|
482
482
|
virtualizer.scrollToItem(key, {
|
|
483
483
|
duration: 0,
|
|
484
484
|
// Prevent scrolling to the top when clicking on column headers.
|
|
485
|
-
shouldScrollY: (item === null || item === void 0 ? void 0 : item.type) !==
|
|
485
|
+
shouldScrollY: (item === null || item === void 0 ? void 0 : item.type) !== 'column',
|
|
486
486
|
// Offset scroll position by width of selection cell
|
|
487
487
|
// (which is sticky and will overlap the cell we're scrolling to).
|
|
488
488
|
offsetX: column.props.isSelectionCell || column.props.isDragButtonCell ? layout.getColumnWidth(column.key) : 0
|
|
@@ -515,7 +515,7 @@ function $bd013581c0a4b065$var$TableVirtualizer(props) {
|
|
|
515
515
|
// only that it changes in a resize, and when that happens, we want to sync the body to the
|
|
516
516
|
// header scroll position
|
|
517
517
|
(0, $7lS7h$useEffect)(()=>{
|
|
518
|
-
if ((0, $7lS7h$getInteractionModality)() ===
|
|
518
|
+
if ((0, $7lS7h$getInteractionModality)() === 'keyboard' && headerRef.current.contains(document.activeElement)) {
|
|
519
519
|
(0, $7lS7h$scrollIntoView)(headerRef.current, document.activeElement);
|
|
520
520
|
(0, $7lS7h$scrollIntoViewport)(document.activeElement, {
|
|
521
521
|
containingElement: domRef.current
|
|
@@ -528,7 +528,7 @@ function $bd013581c0a4b065$var$TableVirtualizer(props) {
|
|
|
528
528
|
bodyRef,
|
|
529
529
|
domRef
|
|
530
530
|
]);
|
|
531
|
-
let headerHeight = ((_layout_getLayoutInfo = layout.getLayoutInfo(
|
|
531
|
+
let headerHeight = ((_layout_getLayoutInfo = layout.getLayoutInfo('header')) === null || _layout_getLayoutInfo === void 0 ? void 0 : _layout_getLayoutInfo.rect.height) || 0;
|
|
532
532
|
// Sync the scroll position from the table body to the header container.
|
|
533
533
|
let onScroll = (0, $7lS7h$useCallback)(()=>{
|
|
534
534
|
headerRef.current.scrollLeft = bodyRef.current.scrollLeft;
|
|
@@ -561,29 +561,29 @@ function $bd013581c0a4b065$var$TableVirtualizer(props) {
|
|
|
561
561
|
ref: domRef
|
|
562
562
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
563
563
|
role: "presentation",
|
|
564
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
564
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headWrapper'),
|
|
565
565
|
style: {
|
|
566
566
|
height: headerHeight,
|
|
567
|
-
overflow:
|
|
568
|
-
position:
|
|
569
|
-
willChange: state.isScrolling ?
|
|
567
|
+
overflow: 'hidden',
|
|
568
|
+
position: 'relative',
|
|
569
|
+
willChange: state.isScrolling ? 'scroll-position' : undefined,
|
|
570
570
|
transition: state.isAnimating ? `none ${state.virtualizer.transitionDuration}ms` : undefined
|
|
571
571
|
},
|
|
572
572
|
ref: headerRef
|
|
573
573
|
}, state.visibleViews[0]), /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$ScrollView), {
|
|
574
574
|
role: "presentation",
|
|
575
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
579
|
-
|
|
575
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-body', {
|
|
576
|
+
'focus-ring': isFocusVisible,
|
|
577
|
+
'spectrum-Table-body--resizerAtTableEdge': shouldHardCornerResizeCorner
|
|
578
|
+
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-body', {
|
|
579
|
+
'react-spectrum-Table-body--dropTarget': !!isRootDropTarget
|
|
580
580
|
})),
|
|
581
581
|
tabIndex: isVirtualDragging ? null : -1,
|
|
582
582
|
style: {
|
|
583
583
|
flex: 1
|
|
584
584
|
},
|
|
585
585
|
innerStyle: {
|
|
586
|
-
overflow:
|
|
586
|
+
overflow: 'visible',
|
|
587
587
|
transition: state.isAnimating ? `none ${state.virtualizer.transitionDuration}ms` : undefined
|
|
588
588
|
},
|
|
589
589
|
ref: bodyRef,
|
|
@@ -593,11 +593,11 @@ function $bd013581c0a4b065$var$TableVirtualizer(props) {
|
|
|
593
593
|
onScrollEnd: state.endScrolling,
|
|
594
594
|
onScroll: onScroll
|
|
595
595
|
}, state.visibleViews[1], /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
596
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
596
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-bodyResizeIndicator'),
|
|
597
597
|
style: {
|
|
598
|
-
[direction ===
|
|
598
|
+
[direction === 'ltr' ? 'left' : 'right']: `${resizerPosition}px`,
|
|
599
599
|
height: `${Math.max(state.virtualizer.contentSize.height, state.virtualizer.visibleRect.height)}px`,
|
|
600
|
-
display: layout.resizingColumn ?
|
|
600
|
+
display: layout.resizingColumn ? 'block' : 'none'
|
|
601
601
|
}
|
|
602
602
|
})))));
|
|
603
603
|
}
|
|
@@ -606,7 +606,7 @@ function $bd013581c0a4b065$var$TableHeader({ children: children, ...otherProps }
|
|
|
606
606
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
607
607
|
...rowGroupProps,
|
|
608
608
|
...otherProps,
|
|
609
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
609
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-head')
|
|
610
610
|
}, children);
|
|
611
611
|
}
|
|
612
612
|
function $bd013581c0a4b065$var$TableColumnHeader(props) {
|
|
@@ -639,25 +639,25 @@ function $bd013581c0a4b065$var$TableColumnHeader(props) {
|
|
|
639
639
|
pressProps
|
|
640
640
|
];
|
|
641
641
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
|
|
642
|
-
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
642
|
+
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'focus-ring')
|
|
643
643
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
644
644
|
...(0, $7lS7h$mergeProps)(...allProps),
|
|
645
645
|
ref: ref,
|
|
646
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
654
|
-
|
|
655
|
-
|
|
646
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headCell', {
|
|
647
|
+
'is-active': isPressed,
|
|
648
|
+
'is-sortable': columnProps.allowsSorting,
|
|
649
|
+
'is-sorted-desc': ((_state_sortDescriptor = state.sortDescriptor) === null || _state_sortDescriptor === void 0 ? void 0 : _state_sortDescriptor.column) === column.key && ((_state_sortDescriptor1 = state.sortDescriptor) === null || _state_sortDescriptor1 === void 0 ? void 0 : _state_sortDescriptor1.direction) === 'descending',
|
|
650
|
+
'is-sorted-asc': ((_state_sortDescriptor2 = state.sortDescriptor) === null || _state_sortDescriptor2 === void 0 ? void 0 : _state_sortDescriptor2.column) === column.key && ((_state_sortDescriptor3 = state.sortDescriptor) === null || _state_sortDescriptor3 === void 0 ? void 0 : _state_sortDescriptor3.direction) === 'ascending',
|
|
651
|
+
'is-hovered': isHovered,
|
|
652
|
+
'spectrum-Table-cell--hideHeader': columnProps.hideHeader
|
|
653
|
+
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-cell', {
|
|
654
|
+
'react-spectrum-Table-cell--alignCenter': columnProps.align === 'center' || column.colspan > 1,
|
|
655
|
+
'react-spectrum-Table-cell--alignEnd': columnProps.align === 'end'
|
|
656
656
|
}))
|
|
657
657
|
}, columnProps.allowsSorting && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiArrowDownSmall), {
|
|
658
|
-
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
658
|
+
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-sortedIcon')
|
|
659
659
|
}), columnProps.hideHeader ? /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VisuallyHidden), null, column.rendered) : /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
660
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
660
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headCellContents')
|
|
661
661
|
}, column.rendered)));
|
|
662
662
|
}
|
|
663
663
|
let $bd013581c0a4b065$var$_TableColumnHeaderButton = (props, ref)=>{
|
|
@@ -666,7 +666,7 @@ let $bd013581c0a4b065$var$_TableColumnHeaderButton = (props, ref)=>{
|
|
|
666
666
|
let domRef = (0, $7lS7h$useFocusableRef)(ref);
|
|
667
667
|
let { buttonProps: buttonProps } = (0, $7lS7h$useButton)({
|
|
668
668
|
...otherProps,
|
|
669
|
-
elementType:
|
|
669
|
+
elementType: 'div',
|
|
670
670
|
isDisabled: isEmpty
|
|
671
671
|
}, domRef);
|
|
672
672
|
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $7lS7h$useHover)({
|
|
@@ -674,15 +674,15 @@ let $bd013581c0a4b065$var$_TableColumnHeaderButton = (props, ref)=>{
|
|
|
674
674
|
isDisabled: isEmpty
|
|
675
675
|
});
|
|
676
676
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
677
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
678
|
-
|
|
677
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headCellContents', {
|
|
678
|
+
'is-hovered': isHovered
|
|
679
679
|
}),
|
|
680
680
|
...hoverProps
|
|
681
681
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
682
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
682
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headCellButton', {
|
|
683
|
+
'spectrum-Table-headCellButton--alignStart': alignment === 'start',
|
|
684
|
+
'spectrum-Table-headCellButton--alignCenter': alignment === 'center',
|
|
685
|
+
'spectrum-Table-headCellButton--alignEnd': alignment === 'end'
|
|
686
686
|
}),
|
|
687
687
|
...(0, $7lS7h$mergeProps)(buttonProps, focusProps),
|
|
688
688
|
ref: domRef
|
|
@@ -696,7 +696,7 @@ function $bd013581c0a4b065$var$ResizableTableColumnHeader(props) {
|
|
|
696
696
|
let triggerRef = (0, $7lS7h$useRef)(null);
|
|
697
697
|
let resizingRef = (0, $7lS7h$useRef)(null);
|
|
698
698
|
let { state: state, layout: layout, onResizeStart: onResizeStart, onResize: onResize, onResizeEnd: onResizeEnd, headerRowHovered: headerRowHovered, setIsInResizeMode: setIsInResizeMode, isEmpty: isEmpty, isInResizeMode: isInResizeMode, headerMenuOpen: headerMenuOpen, setHeaderMenuOpen: setHeaderMenuOpen } = $bd013581c0a4b065$export$3cb274deb6c2d854();
|
|
699
|
-
let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))),
|
|
699
|
+
let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))), '@react-spectrum/table');
|
|
700
700
|
let { pressProps: pressProps, isPressed: isPressed } = (0, $7lS7h$usePress)({
|
|
701
701
|
isDisabled: isEmpty
|
|
702
702
|
});
|
|
@@ -717,13 +717,13 @@ function $bd013581c0a4b065$var$ResizableTableColumnHeader(props) {
|
|
|
717
717
|
let { isFocusVisible: isFocusVisible, focusProps: focusProps } = (0, $7lS7h$useFocusRing)();
|
|
718
718
|
const onMenuSelect = (key)=>{
|
|
719
719
|
switch(key){
|
|
720
|
-
case
|
|
721
|
-
state.sort(column.key,
|
|
720
|
+
case 'sort-asc':
|
|
721
|
+
state.sort(column.key, 'ascending');
|
|
722
722
|
break;
|
|
723
|
-
case
|
|
724
|
-
state.sort(column.key,
|
|
723
|
+
case 'sort-desc':
|
|
724
|
+
state.sort(column.key, 'descending');
|
|
725
725
|
break;
|
|
726
|
-
case
|
|
726
|
+
case 'resize':
|
|
727
727
|
layout.startResize(column.key);
|
|
728
728
|
setIsInResizeMode(true);
|
|
729
729
|
state.setKeyboardNavigationDisabled(true);
|
|
@@ -734,16 +734,16 @@ function $bd013581c0a4b065$var$ResizableTableColumnHeader(props) {
|
|
|
734
734
|
let items = (0, $7lS7h$useMemo)(()=>{
|
|
735
735
|
let options = [
|
|
736
736
|
allowsSorting ? {
|
|
737
|
-
label: stringFormatter.format(
|
|
738
|
-
id:
|
|
737
|
+
label: stringFormatter.format('sortAscending'),
|
|
738
|
+
id: 'sort-asc'
|
|
739
739
|
} : undefined,
|
|
740
740
|
allowsSorting ? {
|
|
741
|
-
label: stringFormatter.format(
|
|
742
|
-
id:
|
|
741
|
+
label: stringFormatter.format('sortDescending'),
|
|
742
|
+
id: 'sort-desc'
|
|
743
743
|
} : undefined,
|
|
744
744
|
{
|
|
745
|
-
label: stringFormatter.format(
|
|
746
|
-
id:
|
|
745
|
+
label: stringFormatter.format('resizeColumn'),
|
|
746
|
+
id: 'resize'
|
|
747
747
|
}
|
|
748
748
|
];
|
|
749
749
|
return options;
|
|
@@ -752,31 +752,31 @@ function $bd013581c0a4b065$var$ResizableTableColumnHeader(props) {
|
|
|
752
752
|
allowsSorting
|
|
753
753
|
]);
|
|
754
754
|
let resizingColumn = layout.resizingColumn;
|
|
755
|
-
let showResizer = !isEmpty && (headerRowHovered && (0, $7lS7h$getInteractionModality)() !==
|
|
756
|
-
let alignment =
|
|
757
|
-
let menuAlign =
|
|
758
|
-
if (columnProps.align ===
|
|
759
|
-
else if (columnProps.align ===
|
|
760
|
-
alignment =
|
|
761
|
-
menuAlign =
|
|
755
|
+
let showResizer = !isEmpty && (headerRowHovered && (0, $7lS7h$getInteractionModality)() !== 'keyboard' || resizingColumn != null);
|
|
756
|
+
let alignment = 'start';
|
|
757
|
+
let menuAlign = 'start';
|
|
758
|
+
if (columnProps.align === 'center' || column.colspan > 1) alignment = 'center';
|
|
759
|
+
else if (columnProps.align === 'end') {
|
|
760
|
+
alignment = 'end';
|
|
761
|
+
menuAlign = 'end';
|
|
762
762
|
}
|
|
763
763
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
|
|
764
|
-
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
764
|
+
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'focus-ring')
|
|
765
765
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
766
766
|
...(0, $7lS7h$mergeProps)(...allProps),
|
|
767
767
|
ref: ref,
|
|
768
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
778
|
-
|
|
779
|
-
|
|
768
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headCell', {
|
|
769
|
+
'is-active': isPressed,
|
|
770
|
+
'is-resizable': columnProps.allowsResizing,
|
|
771
|
+
'is-sortable': columnProps.allowsSorting,
|
|
772
|
+
'is-sorted-desc': ((_state_sortDescriptor = state.sortDescriptor) === null || _state_sortDescriptor === void 0 ? void 0 : _state_sortDescriptor.column) === column.key && ((_state_sortDescriptor1 = state.sortDescriptor) === null || _state_sortDescriptor1 === void 0 ? void 0 : _state_sortDescriptor1.direction) === 'descending',
|
|
773
|
+
'is-sorted-asc': ((_state_sortDescriptor2 = state.sortDescriptor) === null || _state_sortDescriptor2 === void 0 ? void 0 : _state_sortDescriptor2.column) === column.key && ((_state_sortDescriptor3 = state.sortDescriptor) === null || _state_sortDescriptor3 === void 0 ? void 0 : _state_sortDescriptor3.direction) === 'ascending',
|
|
774
|
+
'is-hovered': isHovered,
|
|
775
|
+
'focus-ring': isFocusVisible,
|
|
776
|
+
'spectrum-Table-cell--hideHeader': columnProps.hideHeader
|
|
777
|
+
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-cell', {
|
|
778
|
+
'react-spectrum-Table-cell--alignCenter': alignment === 'center',
|
|
779
|
+
'react-spectrum-Table-cell--alignEnd': alignment === 'end'
|
|
780
780
|
}))
|
|
781
781
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$MenuTrigger), {
|
|
782
782
|
onOpenChange: setHeaderMenuOpen,
|
|
@@ -786,11 +786,11 @@ function $bd013581c0a4b065$var$ResizableTableColumnHeader(props) {
|
|
|
786
786
|
ref: triggerRef,
|
|
787
787
|
focusProps: focusProps
|
|
788
788
|
}, columnProps.allowsSorting && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiArrowDownSmall), {
|
|
789
|
-
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
789
|
+
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-sortedIcon')
|
|
790
790
|
}), columnProps.hideHeader ? /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VisuallyHidden), null, column.rendered) : /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
791
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
791
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headerCellText')
|
|
792
792
|
}, column.rendered), columnProps.allowsResizing && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiChevronDownMedium), {
|
|
793
|
-
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
793
|
+
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-menuChevron')
|
|
794
794
|
})), /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$Menu), {
|
|
795
795
|
onAction: onMenuSelect,
|
|
796
796
|
minWidth: "size-2000",
|
|
@@ -805,20 +805,20 @@ function $bd013581c0a4b065$var$ResizableTableColumnHeader(props) {
|
|
|
805
805
|
triggerRef: (0, $7lS7h$useUnwrapDOMRef)(triggerRef)
|
|
806
806
|
}), /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
807
807
|
"aria-hidden": true,
|
|
808
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
809
|
-
|
|
810
|
-
|
|
808
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-colResizeIndicator', {
|
|
809
|
+
'spectrum-Table-colResizeIndicator--visible': resizingColumn != null,
|
|
810
|
+
'spectrum-Table-colResizeIndicator--resizing': resizingColumn === column.key
|
|
811
811
|
})
|
|
812
812
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
813
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
814
|
-
|
|
813
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-colResizeNubbin', {
|
|
814
|
+
'spectrum-Table-colResizeNubbin--visible': isInResizeMode && resizingColumn === column.key
|
|
815
815
|
})
|
|
816
816
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $cb7d341e8868d81d$export$d9658cdf8c86807), null)))));
|
|
817
817
|
}
|
|
818
818
|
function $bd013581c0a4b065$var$TableSelectAllCell({ column: column }) {
|
|
819
819
|
let ref = (0, $7lS7h$useRef)();
|
|
820
820
|
let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
|
|
821
|
-
let isSingleSelectionMode = state.selectionManager.selectionMode ===
|
|
821
|
+
let isSingleSelectionMode = state.selectionManager.selectionMode === 'single';
|
|
822
822
|
let { columnHeaderProps: columnHeaderProps } = (0, $7lS7h$useTableColumnHeader)({
|
|
823
823
|
node: column,
|
|
824
824
|
isVirtualized: true
|
|
@@ -826,25 +826,25 @@ function $bd013581c0a4b065$var$TableSelectAllCell({ column: column }) {
|
|
|
826
826
|
let { checkboxProps: checkboxProps } = (0, $7lS7h$useTableSelectAllCheckbox)(state);
|
|
827
827
|
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $7lS7h$useHover)({});
|
|
828
828
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
|
|
829
|
-
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
829
|
+
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'focus-ring')
|
|
830
830
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
831
831
|
...(0, $7lS7h$mergeProps)(columnHeaderProps, hoverProps),
|
|
832
832
|
ref: ref,
|
|
833
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
834
|
-
|
|
833
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headCell', 'spectrum-Table-checkboxCell', {
|
|
834
|
+
'is-hovered': isHovered
|
|
835
835
|
})
|
|
836
836
|
}, /*
|
|
837
837
|
In single selection mode, the checkbox will be hidden.
|
|
838
838
|
So to avoid leaving a column header with no accessible content,
|
|
839
839
|
we use a VisuallyHidden component to include the aria-label from the checkbox,
|
|
840
840
|
which for single selection will be "Select."
|
|
841
|
-
*/ isSingleSelectionMode && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VisuallyHidden), null, checkboxProps[
|
|
841
|
+
*/ isSingleSelectionMode && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VisuallyHidden), null, checkboxProps['aria-label']), /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$Checkbox), {
|
|
842
842
|
...checkboxProps,
|
|
843
843
|
isEmphasized: true,
|
|
844
844
|
UNSAFE_style: isSingleSelectionMode ? {
|
|
845
|
-
visibility:
|
|
845
|
+
visibility: 'hidden'
|
|
846
846
|
} : undefined,
|
|
847
|
-
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
847
|
+
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-checkbox')
|
|
848
848
|
})));
|
|
849
849
|
}
|
|
850
850
|
function $bd013581c0a4b065$var$TableDragHeaderCell({ column: column }) {
|
|
@@ -854,14 +854,14 @@ function $bd013581c0a4b065$var$TableDragHeaderCell({ column: column }) {
|
|
|
854
854
|
node: column,
|
|
855
855
|
isVirtualized: true
|
|
856
856
|
}, state, ref);
|
|
857
|
-
let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))),
|
|
857
|
+
let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))), '@react-spectrum/table');
|
|
858
858
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
|
|
859
|
-
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
859
|
+
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'focus-ring')
|
|
860
860
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
861
861
|
...columnHeaderProps,
|
|
862
862
|
ref: ref,
|
|
863
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
864
|
-
}, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VisuallyHidden), null, stringFormatter.format(
|
|
863
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-headCell', (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-headCell', 'react-spectrum-Table-dragButtonHeadCell'))
|
|
864
|
+
}, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VisuallyHidden), null, stringFormatter.format('drag'))));
|
|
865
865
|
}
|
|
866
866
|
function $bd013581c0a4b065$var$TableRowGroup({ children: children, ...otherProps }) {
|
|
867
867
|
let { rowGroupProps: rowGroupProps } = (0, $7lS7h$useTableRowGroup)();
|
|
@@ -874,10 +874,10 @@ function $bd013581c0a4b065$var$DragButton() {
|
|
|
874
874
|
let { dragButtonProps: dragButtonProps, dragButtonRef: dragButtonRef, isFocusVisibleWithin: isFocusVisibleWithin } = $bd013581c0a4b065$export$cd7c5802f9e21187();
|
|
875
875
|
let { visuallyHiddenProps: visuallyHiddenProps } = (0, $7lS7h$useVisuallyHidden)();
|
|
876
876
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
|
|
877
|
-
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
877
|
+
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'focus-ring')
|
|
878
878
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
879
879
|
...dragButtonProps,
|
|
880
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
880
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-dragButton'),
|
|
881
881
|
style: !isFocusVisibleWithin ? {
|
|
882
882
|
...visuallyHiddenProps.style
|
|
883
883
|
} : {},
|
|
@@ -895,7 +895,7 @@ function $bd013581c0a4b065$var$TableRow({ item: item, children: children, hasAct
|
|
|
895
895
|
var _state_collection_rows_find, _layout_getContentSize, _layout_virtualizer;
|
|
896
896
|
let ref = (0, $7lS7h$useRef)();
|
|
897
897
|
let { state: state, layout: layout, dragAndDropHooks: dragAndDropHooks, dragState: dragState, dropState: dropState } = $bd013581c0a4b065$export$3cb274deb6c2d854();
|
|
898
|
-
let allowsInteraction = state.selectionManager.selectionMode !==
|
|
898
|
+
let allowsInteraction = state.selectionManager.selectionMode !== 'none' || hasActions;
|
|
899
899
|
let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);
|
|
900
900
|
let isDroppable = isTableDroppable && !isDisabled;
|
|
901
901
|
let isSelected = state.selectionManager.isSelected(item.key);
|
|
@@ -939,9 +939,9 @@ function $bd013581c0a4b065$var$TableRow({ item: item, children: children, hasAct
|
|
|
939
939
|
let dropIndicatorRef = (0, $7lS7h$useRef)();
|
|
940
940
|
if (isTableDroppable) {
|
|
941
941
|
let target = {
|
|
942
|
-
type:
|
|
942
|
+
type: 'item',
|
|
943
943
|
key: item.key,
|
|
944
|
-
dropPosition:
|
|
944
|
+
dropPosition: 'on'
|
|
945
945
|
};
|
|
946
946
|
isDropTarget = dropState.isDropTarget(target);
|
|
947
947
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
@@ -952,7 +952,7 @@ function $bd013581c0a4b065$var$TableRow({ item: item, children: children, hasAct
|
|
|
952
952
|
let dragButtonRef = (0, $7lS7h$react).useRef();
|
|
953
953
|
let { buttonProps: dragButtonProps } = (0, $7lS7h$useButton)({
|
|
954
954
|
...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
|
|
955
|
-
elementType:
|
|
955
|
+
elementType: 'div'
|
|
956
956
|
}, dragButtonRef);
|
|
957
957
|
let props = (0, $7lS7h$mergeProps)(rowProps, otherProps, focusWithinProps, focusProps, hoverProps, pressProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,
|
|
958
958
|
// allowing for single swipe navigation between row drop indicator
|
|
@@ -960,7 +960,7 @@ function $bd013581c0a4b065$var$TableRow({ item: item, children: children, hasAct
|
|
|
960
960
|
tabIndex: null
|
|
961
961
|
});
|
|
962
962
|
let dropProps = isDroppable ? droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps : {
|
|
963
|
-
|
|
963
|
+
'aria-hidden': droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps['aria-hidden']
|
|
964
964
|
};
|
|
965
965
|
let { visuallyHiddenProps: visuallyHiddenProps } = (0, $7lS7h$useVisuallyHidden)();
|
|
966
966
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableRowContext.Provider, {
|
|
@@ -974,8 +974,8 @@ function $bd013581c0a4b065$var$TableRow({ item: item, children: children, hasAct
|
|
|
974
974
|
key: `${item.key}-before`,
|
|
975
975
|
target: {
|
|
976
976
|
key: item.key,
|
|
977
|
-
type:
|
|
978
|
-
dropPosition:
|
|
977
|
+
type: 'item',
|
|
978
|
+
dropPosition: 'before'
|
|
979
979
|
}
|
|
980
980
|
}), isTableDroppable && !(dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.isHidden) && /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
981
981
|
role: "row",
|
|
@@ -989,28 +989,28 @@ function $bd013581c0a4b065$var$TableRow({ item: item, children: children, hasAct
|
|
|
989
989
|
}))), /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
990
990
|
...(0, $7lS7h$mergeProps)(props, dropProps),
|
|
991
991
|
ref: ref,
|
|
992
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
993
|
-
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
1005
|
-
|
|
992
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-row', {
|
|
993
|
+
'is-active': isPressed,
|
|
994
|
+
'is-selected': isSelected,
|
|
995
|
+
'spectrum-Table-row--highlightSelection': state.selectionManager.selectionBehavior === 'replace',
|
|
996
|
+
'is-next-selected': state.selectionManager.isSelected(item.nextKey),
|
|
997
|
+
'is-focused': isFocusVisibleWithin,
|
|
998
|
+
'focus-ring': isFocusVisible,
|
|
999
|
+
'is-hovered': isHovered,
|
|
1000
|
+
'is-disabled': isDisabled,
|
|
1001
|
+
'spectrum-Table-row--firstRow': isFirstRow,
|
|
1002
|
+
'spectrum-Table-row--lastRow': isLastRow,
|
|
1003
|
+
'spectrum-Table-row--isFlushBottom': isFlushWithContainerBottom
|
|
1004
|
+
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-row', {
|
|
1005
|
+
'react-spectrum-Table-row--dropTarget': isDropTarget
|
|
1006
1006
|
}))
|
|
1007
1007
|
}, children), isTableDroppable && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7ee9a922ee4e8032$export$2c0bab5914a9d088), {
|
|
1008
1008
|
rowProps: props,
|
|
1009
1009
|
key: `${item.key}-after`,
|
|
1010
1010
|
target: {
|
|
1011
1011
|
key: item.key,
|
|
1012
|
-
type:
|
|
1013
|
-
dropPosition:
|
|
1012
|
+
type: 'item',
|
|
1013
|
+
dropPosition: 'after'
|
|
1014
1014
|
}
|
|
1015
1015
|
}));
|
|
1016
1016
|
}
|
|
@@ -1040,13 +1040,13 @@ function $bd013581c0a4b065$var$TableDragCell({ cell: cell }) {
|
|
|
1040
1040
|
isVirtualized: true
|
|
1041
1041
|
}, state, ref);
|
|
1042
1042
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
|
|
1043
|
-
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1043
|
+
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'focus-ring')
|
|
1044
1044
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
1045
1045
|
...gridCellProps,
|
|
1046
1046
|
ref: ref,
|
|
1047
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1048
|
-
|
|
1049
|
-
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
1047
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-cell', {
|
|
1048
|
+
'is-disabled': isDisabled
|
|
1049
|
+
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-cell', 'react-spectrum-Table-dragButtonCell'))
|
|
1050
1050
|
}, isTableDraggable && !isDisabled && /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$DragButton, null)));
|
|
1051
1051
|
}
|
|
1052
1052
|
function $bd013581c0a4b065$var$TableCheckboxCell({ cell: cell }) {
|
|
@@ -1061,24 +1061,24 @@ function $bd013581c0a4b065$var$TableCheckboxCell({ cell: cell }) {
|
|
|
1061
1061
|
key: cell.parentKey
|
|
1062
1062
|
}, state);
|
|
1063
1063
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
|
|
1064
|
-
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1064
|
+
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'focus-ring')
|
|
1065
1065
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
1066
1066
|
...gridCellProps,
|
|
1067
1067
|
ref: ref,
|
|
1068
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1069
|
-
|
|
1070
|
-
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
1071
|
-
}, state.selectionManager.selectionMode !==
|
|
1068
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-cell', 'spectrum-Table-checkboxCell', {
|
|
1069
|
+
'is-disabled': isDisabled
|
|
1070
|
+
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-cell'))
|
|
1071
|
+
}, state.selectionManager.selectionMode !== 'none' && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$Checkbox), {
|
|
1072
1072
|
...checkboxProps,
|
|
1073
1073
|
isEmphasized: true,
|
|
1074
1074
|
isDisabled: isDisabled,
|
|
1075
|
-
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1075
|
+
UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-checkbox')
|
|
1076
1076
|
})));
|
|
1077
1077
|
}
|
|
1078
1078
|
function $bd013581c0a4b065$var$TableCell({ cell: cell }) {
|
|
1079
1079
|
let { scale: scale } = (0, $7lS7h$useProvider)();
|
|
1080
1080
|
let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
|
|
1081
|
-
let isExpandableTable =
|
|
1081
|
+
let isExpandableTable = 'expandedKeys' in state;
|
|
1082
1082
|
let ref = (0, $7lS7h$useRef)();
|
|
1083
1083
|
let columnProps = cell.column.props;
|
|
1084
1084
|
let isDisabled = state.disabledKeys.has(cell.parentKey);
|
|
@@ -1091,7 +1091,7 @@ function $bd013581c0a4b065$var$TableCell({ cell: cell }) {
|
|
|
1091
1091
|
let isRowExpandable = false;
|
|
1092
1092
|
let showExpandCollapseButton = false;
|
|
1093
1093
|
let levelOffset = 0;
|
|
1094
|
-
if (
|
|
1094
|
+
if ('expandedKeys' in state) {
|
|
1095
1095
|
var _state_keyMap_get_props_UNSTABLE_childItems, _state_keyMap_get, _state_keyMap_get_props_children, _state_keyMap_get_props, _state_keyMap_get1;
|
|
1096
1096
|
isRowExpandable = ((_state_keyMap_get = state.keyMap.get(cell.parentKey)) === null || _state_keyMap_get === void 0 ? void 0 : (_state_keyMap_get_props_UNSTABLE_childItems = _state_keyMap_get.props.UNSTABLE_childItems) === null || _state_keyMap_get_props_UNSTABLE_childItems === void 0 ? void 0 : _state_keyMap_get_props_UNSTABLE_childItems.length) > 0 || ((_state_keyMap_get1 = state.keyMap.get(cell.parentKey)) === null || _state_keyMap_get1 === void 0 ? void 0 : (_state_keyMap_get_props = _state_keyMap_get1.props) === null || _state_keyMap_get_props === void 0 ? void 0 : (_state_keyMap_get_props_children = _state_keyMap_get_props.children) === null || _state_keyMap_get_props_children === void 0 ? void 0 : _state_keyMap_get_props_children.length) > state.userColumnCount;
|
|
1097
1097
|
showExpandCollapseButton = isFirstRowHeaderCell && isRowExpandable;
|
|
@@ -1099,7 +1099,7 @@ function $bd013581c0a4b065$var$TableCell({ cell: cell }) {
|
|
|
1099
1099
|
levelOffset = (cell.level - 2) * $bd013581c0a4b065$var$LEVEL_OFFSET_WIDTH[scale] + (!showExpandCollapseButton ? $bd013581c0a4b065$var$LEVEL_OFFSET_WIDTH[scale] * 2 : 0);
|
|
1100
1100
|
}
|
|
1101
1101
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
|
|
1102
|
-
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1102
|
+
focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'focus-ring')
|
|
1103
1103
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
1104
1104
|
...otherGridCellProps,
|
|
1105
1105
|
"aria-labelledby": id,
|
|
@@ -1107,21 +1107,21 @@ function $bd013581c0a4b065$var$TableCell({ cell: cell }) {
|
|
|
1107
1107
|
style: isExpandableTable && isFirstRowHeaderCell ? {
|
|
1108
1108
|
paddingInlineStart: levelOffset
|
|
1109
1109
|
} : {},
|
|
1110
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1110
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-cell', {
|
|
1111
|
+
'spectrum-Table-cell--divider': columnProps.showDivider && cell.column.nextKey !== null,
|
|
1112
|
+
'spectrum-Table-cell--hideHeader': columnProps.hideHeader,
|
|
1113
|
+
'spectrum-Table-cell--hasExpandCollapseButton': showExpandCollapseButton,
|
|
1114
|
+
'is-disabled': isDisabled
|
|
1115
|
+
}, (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-cell', {
|
|
1116
|
+
'react-spectrum-Table-cell--alignStart': columnProps.align === 'start',
|
|
1117
|
+
'react-spectrum-Table-cell--alignCenter': columnProps.align === 'center',
|
|
1118
|
+
'react-spectrum-Table-cell--alignEnd': columnProps.align === 'end'
|
|
1119
1119
|
}))
|
|
1120
1120
|
}, showExpandCollapseButton && /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$ExpandableRowChevron, {
|
|
1121
1121
|
cell: cell
|
|
1122
1122
|
}), /*#__PURE__*/ (0, $7lS7h$react).createElement("span", {
|
|
1123
1123
|
id: id,
|
|
1124
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1124
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-cellContents')
|
|
1125
1125
|
}, cell.rendered)));
|
|
1126
1126
|
}
|
|
1127
1127
|
function $bd013581c0a4b065$var$ExpandableRowChevron({ cell: cell }) {
|
|
@@ -1129,9 +1129,9 @@ function $bd013581c0a4b065$var$ExpandableRowChevron({ cell: cell }) {
|
|
|
1129
1129
|
let { direction: direction } = (0, $7lS7h$useLocale)();
|
|
1130
1130
|
let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
|
|
1131
1131
|
let expandButtonRef = (0, $7lS7h$useRef)();
|
|
1132
|
-
let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))),
|
|
1132
|
+
let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))), '@react-spectrum/table');
|
|
1133
1133
|
let isExpanded;
|
|
1134
|
-
if (
|
|
1134
|
+
if ('expandedKeys' in state) isExpanded = state.expandedKeys === 'all' || state.expandedKeys.has(cell.parentKey);
|
|
1135
1135
|
// Will need to keep the chevron as a button for iOS VO at all times since VO doesn't focus the cell. Also keep as button if cellAction is defined by the user in the future
|
|
1136
1136
|
let { buttonProps: buttonProps } = (0, $7lS7h$useButton)({
|
|
1137
1137
|
// Desktop and mobile both toggle expansion of a native expandable row on mouse/touch up
|
|
@@ -1142,38 +1142,38 @@ function $bd013581c0a4b065$var$ExpandableRowChevron({ cell: cell }) {
|
|
|
1142
1142
|
state.selectionManager.setFocusedKey(cell.parentKey);
|
|
1143
1143
|
}
|
|
1144
1144
|
},
|
|
1145
|
-
elementType:
|
|
1146
|
-
|
|
1145
|
+
elementType: 'span',
|
|
1146
|
+
'aria-label': isExpanded ? stringFormatter.format('collapse') : stringFormatter.format('expand')
|
|
1147
1147
|
}, expandButtonRef);
|
|
1148
1148
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement("span", {
|
|
1149
1149
|
...buttonProps,
|
|
1150
1150
|
ref: expandButtonRef,
|
|
1151
1151
|
// Override tabindex so that grid keyboard nav skips over it. Needs -1 so android talkback can actually "focus" it
|
|
1152
1152
|
tabIndex: (0, $7lS7h$isAndroid)() ? -1 : undefined,
|
|
1153
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))),
|
|
1154
|
-
|
|
1153
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), 'spectrum-Table-expandButton', {
|
|
1154
|
+
'is-open': isExpanded
|
|
1155
1155
|
})
|
|
1156
|
-
}, direction ===
|
|
1156
|
+
}, direction === 'ltr' ? /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiChevronRightMedium), null) : /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiChevronLeftMedium), null));
|
|
1157
1157
|
}
|
|
1158
1158
|
function $bd013581c0a4b065$var$CenteredWrapper({ children: children }) {
|
|
1159
1159
|
let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
|
|
1160
1160
|
let rowProps;
|
|
1161
|
-
if (
|
|
1161
|
+
if ('expandedKeys' in state) {
|
|
1162
1162
|
let topLevelRowCount = [
|
|
1163
1163
|
...state.keyMap.get(state.collection.body.key).childNodes
|
|
1164
1164
|
].length;
|
|
1165
1165
|
rowProps = {
|
|
1166
|
-
|
|
1167
|
-
|
|
1168
|
-
|
|
1166
|
+
'aria-level': 1,
|
|
1167
|
+
'aria-posinset': topLevelRowCount + 1,
|
|
1168
|
+
'aria-setsize': topLevelRowCount + 1
|
|
1169
1169
|
};
|
|
1170
1170
|
} else rowProps = {
|
|
1171
|
-
|
|
1171
|
+
'aria-rowindex': state.collection.headerRows.length + state.collection.size + 1
|
|
1172
1172
|
};
|
|
1173
1173
|
return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
1174
1174
|
role: "row",
|
|
1175
1175
|
...rowProps,
|
|
1176
|
-
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))),
|
|
1176
|
+
className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), 'react-spectrum-Table-centeredWrapper')
|
|
1177
1177
|
}, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
|
|
1178
1178
|
role: "rowheader",
|
|
1179
1179
|
"aria-colspan": state.collection.columns.length
|