@react-spectrum/table 3.12.9-nightly.4555 → 3.12.9-nightly.4560

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.
Files changed (107) hide show
  1. package/dist/DragPreview.main.js +54 -0
  2. package/dist/DragPreview.main.js.map +1 -0
  3. package/dist/DragPreview.mjs +49 -0
  4. package/dist/DragPreview.module.js +49 -0
  5. package/dist/DragPreview.module.js.map +1 -0
  6. package/dist/InsertionIndicator.main.js +63 -0
  7. package/dist/InsertionIndicator.main.js.map +1 -0
  8. package/dist/InsertionIndicator.mjs +58 -0
  9. package/dist/InsertionIndicator.module.js +58 -0
  10. package/dist/InsertionIndicator.module.js.map +1 -0
  11. package/dist/Nubbin.main.js +62 -0
  12. package/dist/Nubbin.main.js.map +1 -0
  13. package/dist/Nubbin.mjs +53 -0
  14. package/dist/Nubbin.module.js +53 -0
  15. package/dist/Nubbin.module.js.map +1 -0
  16. package/dist/Resizer.main.js +143 -0
  17. package/dist/Resizer.main.js.map +1 -0
  18. package/dist/Resizer.mjs +138 -0
  19. package/dist/Resizer.module.js +138 -0
  20. package/dist/Resizer.module.js.map +1 -0
  21. package/dist/RootDropIndicator.main.js +57 -0
  22. package/dist/RootDropIndicator.main.js.map +1 -0
  23. package/dist/RootDropIndicator.mjs +48 -0
  24. package/dist/RootDropIndicator.module.js +48 -0
  25. package/dist/RootDropIndicator.module.js.map +1 -0
  26. package/dist/TableView.main.js +50 -0
  27. package/dist/TableView.main.js.map +1 -0
  28. package/dist/TableView.mjs +41 -0
  29. package/dist/TableView.module.js +41 -0
  30. package/dist/TableView.module.js.map +1 -0
  31. package/dist/TableViewBase.main.js +1193 -0
  32. package/dist/TableViewBase.main.js.map +1 -0
  33. package/dist/TableViewBase.mjs +1186 -0
  34. package/dist/TableViewBase.module.js +1186 -0
  35. package/dist/TableViewBase.module.js.map +1 -0
  36. package/dist/TableViewWrapper.main.js +46 -0
  37. package/dist/TableViewWrapper.main.js.map +1 -0
  38. package/dist/TableViewWrapper.mjs +37 -0
  39. package/dist/TableViewWrapper.module.js +37 -0
  40. package/dist/TableViewWrapper.module.js.map +1 -0
  41. package/dist/TreeGridTableView.main.js +50 -0
  42. package/dist/TreeGridTableView.main.js.map +1 -0
  43. package/dist/TreeGridTableView.mjs +41 -0
  44. package/dist/TreeGridTableView.module.js +41 -0
  45. package/dist/TreeGridTableView.module.js.map +1 -0
  46. package/dist/ar-AE.mjs +1 -1
  47. package/dist/bg-BG.mjs +1 -1
  48. package/dist/cs-CZ.mjs +1 -1
  49. package/dist/da-DK.mjs +1 -1
  50. package/dist/de-DE.mjs +1 -1
  51. package/dist/el-GR.mjs +1 -1
  52. package/dist/en-US.mjs +1 -1
  53. package/dist/es-ES.mjs +1 -1
  54. package/dist/et-EE.mjs +1 -1
  55. package/dist/fi-FI.mjs +1 -1
  56. package/dist/fr-FR.mjs +1 -1
  57. package/dist/he-IL.mjs +1 -1
  58. package/dist/hr-HR.mjs +1 -1
  59. package/dist/hu-HU.mjs +1 -1
  60. package/dist/import.mjs +2 -1930
  61. package/dist/intlStrings.main.js +108 -0
  62. package/dist/intlStrings.main.js.map +1 -0
  63. package/dist/intlStrings.mjs +110 -0
  64. package/dist/intlStrings.module.js +110 -0
  65. package/dist/intlStrings.module.js.map +1 -0
  66. package/dist/it-IT.mjs +1 -1
  67. package/dist/ja-JP.mjs +1 -1
  68. package/dist/ko-KR.mjs +1 -1
  69. package/dist/lt-LT.mjs +1 -1
  70. package/dist/lv-LV.mjs +1 -1
  71. package/dist/main.js +2 -1926
  72. package/dist/main.js.map +1 -1
  73. package/dist/module.js +2 -1930
  74. package/dist/module.js.map +1 -1
  75. package/dist/nb-NO.mjs +1 -1
  76. package/dist/nl-NL.mjs +1 -1
  77. package/dist/pl-PL.mjs +1 -1
  78. package/dist/pt-BR.mjs +1 -1
  79. package/dist/pt-PT.mjs +1 -1
  80. package/dist/ro-RO.mjs +1 -1
  81. package/dist/ru-RU.mjs +1 -1
  82. package/dist/sk-SK.mjs +1 -1
  83. package/dist/sl-SI.mjs +1 -1
  84. package/dist/sr-SP.mjs +1 -1
  85. package/dist/sv-SE.mjs +1 -1
  86. package/dist/table.b13eee90.css +220 -0
  87. package/dist/table.b13eee90.css.map +1 -0
  88. package/dist/table_css.main.js +74 -0
  89. package/dist/table_css.main.js.map +1 -0
  90. package/dist/table_css.mjs +76 -0
  91. package/dist/table_css.module.js +76 -0
  92. package/dist/table_css.module.js.map +1 -0
  93. package/dist/table_vars_css.main.js +197 -0
  94. package/dist/table_vars_css.main.js.map +1 -0
  95. package/dist/table_vars_css.mjs +199 -0
  96. package/dist/table_vars_css.module.js +199 -0
  97. package/dist/table_vars_css.module.js.map +1 -0
  98. package/dist/tr-TR.mjs +1 -1
  99. package/dist/uk-UA.mjs +1 -1
  100. package/dist/{main.css → vars.42570ef3.css} +1 -221
  101. package/dist/vars.42570ef3.css.map +1 -0
  102. package/dist/zh-CN.mjs +1 -1
  103. package/dist/zh-TW.mjs +1 -1
  104. package/package.json +28 -28
  105. package/dist/main.css.map +0 -1
  106. package/dist/module.css +0 -1208
  107. package/dist/module.css.map +0 -1
@@ -0,0 +1,1186 @@
1
+ import {InsertionIndicator as $7ee9a922ee4e8032$export$2c0bab5914a9d088} from "./InsertionIndicator.mjs";
2
+ import $7lS7h$intlStringsmodulejs from "./intlStrings.mjs";
3
+ import {Nubbin as $cb7d341e8868d81d$export$d9658cdf8c86807} from "./Nubbin.mjs";
4
+ import {Resizer as $fc695d2eafc2b351$export$48a76196cafe3b93} from "./Resizer.mjs";
5
+ import {RootDropIndicator as $4e6fc36ba71ba405$export$d30a7814cfd4033e} from "./RootDropIndicator.mjs";
6
+ import {DragPreview as $daa6ead3d9d3506a$export$905ab40ac2179daa} from "./DragPreview.mjs";
7
+ import "./vars.42570ef3.css";
8
+ import $7lS7h$table_vars_cssmodulejs from "./table_vars_css.mjs";
9
+ import "./table.b13eee90.css";
10
+ import $7lS7h$table_cssmodulejs from "./table_css.mjs";
11
+ import $7lS7h$spectrumiconsuiArrowDownSmall from "@spectrum-icons/ui/ArrowDownSmall";
12
+ import {mergeProps as $7lS7h$mergeProps, scrollIntoView as $7lS7h$scrollIntoView, scrollIntoViewport as $7lS7h$scrollIntoViewport, chain as $7lS7h$chain, isAndroid as $7lS7h$isAndroid} from "@react-aria/utils";
13
+ import {Checkbox as $7lS7h$Checkbox} from "@react-spectrum/checkbox";
14
+ import $7lS7h$spectrumiconsuiChevronDownMedium from "@spectrum-icons/ui/ChevronDownMedium";
15
+ import $7lS7h$spectrumiconsuiChevronLeftMedium from "@spectrum-icons/ui/ChevronLeftMedium";
16
+ import $7lS7h$spectrumiconsuiChevronRightMedium from "@spectrum-icons/ui/ChevronRightMedium";
17
+ import {useStyleProps as $7lS7h$useStyleProps, useDOMRef as $7lS7h$useDOMRef, classNames as $7lS7h$classNames, useFocusableRef as $7lS7h$useFocusableRef, useUnwrapDOMRef as $7lS7h$useUnwrapDOMRef} from "@react-spectrum/utils";
18
+ import {useFocusRing as $7lS7h$useFocusRing, FocusScope as $7lS7h$FocusScope, FocusRing as $7lS7h$FocusRing} from "@react-aria/focus";
19
+ import {getInteractionModality as $7lS7h$getInteractionModality, usePress as $7lS7h$usePress, useHover as $7lS7h$useHover, isFocusVisible as $7lS7h$isFocusVisible} from "@react-aria/interactions";
20
+ import {MenuTrigger as $7lS7h$MenuTrigger, Menu as $7lS7h$Menu, Item as $7lS7h$Item} from "@react-spectrum/menu";
21
+ import {layoutInfoToStyle as $7lS7h$layoutInfoToStyle, VirtualizerItem as $7lS7h$VirtualizerItem, setScrollLeft as $7lS7h$setScrollLeft, useVirtualizer as $7lS7h$useVirtualizer, ScrollView as $7lS7h$ScrollView} from "@react-aria/virtualizer";
22
+ import $7lS7h$spectrumiconsuiListGripper from "@spectrum-icons/ui/ListGripper";
23
+ import {ProgressCircle as $7lS7h$ProgressCircle} from "@react-spectrum/progress";
24
+ import $7lS7h$react, {useContext as $7lS7h$useContext, useRef as $7lS7h$useRef, useEffect as $7lS7h$useEffect, useCallback as $7lS7h$useCallback, useState as $7lS7h$useState, useMemo as $7lS7h$useMemo} from "react";
25
+ import {useVirtualizerState as $7lS7h$useVirtualizerState} from "@react-stately/virtualizer";
26
+ import {TableColumnLayout as $7lS7h$TableColumnLayout} from "@react-stately/table";
27
+ import {TableLayout as $7lS7h$TableLayout} from "@react-stately/layout";
28
+ import {TooltipTrigger as $7lS7h$TooltipTrigger, Tooltip as $7lS7h$Tooltip} from "@react-spectrum/tooltip";
29
+ import {useButton as $7lS7h$useButton} from "@react-aria/button";
30
+ import {useLocale as $7lS7h$useLocale, useLocalizedStringFormatter as $7lS7h$useLocalizedStringFormatter} from "@react-aria/i18n";
31
+ import {useProviderProps as $7lS7h$useProviderProps, useProvider as $7lS7h$useProvider} from "@react-spectrum/provider";
32
+ import {useTable as $7lS7h$useTable, useTableRowGroup as $7lS7h$useTableRowGroup, useTableColumnHeader as $7lS7h$useTableColumnHeader, useTableSelectAllCheckbox as $7lS7h$useTableSelectAllCheckbox, useTableRow as $7lS7h$useTableRow, useTableHeaderRow as $7lS7h$useTableHeaderRow, useTableCell as $7lS7h$useTableCell, useTableSelectionCheckbox as $7lS7h$useTableSelectionCheckbox} from "@react-aria/table";
33
+ import {VisuallyHidden as $7lS7h$VisuallyHidden, useVisuallyHidden as $7lS7h$useVisuallyHidden} from "@react-aria/visually-hidden";
34
+
35
+
36
+ function $parcel$interopDefault(a) {
37
+ return a && a.__esModule ? a.default : a;
38
+ }
39
+ /*
40
+ * Copyright 2023 Adobe. All rights reserved.
41
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
42
+ * you may not use this file except in compliance with the License. You may obtain a copy
43
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
44
+ *
45
+ * Unless required by applicable law or agreed to in writing, software distributed under
46
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
47
+ * OF ANY KIND, either express or implied. See the License for the specific language
48
+ * governing permissions and limitations under the License.
49
+ */
50
+
51
+
52
+
53
+
54
+
55
+
56
+
57
+
58
+
59
+
60
+
61
+
62
+
63
+
64
+
65
+
66
+
67
+
68
+
69
+
70
+
71
+
72
+
73
+
74
+
75
+
76
+
77
+
78
+
79
+
80
+ const $bd013581c0a4b065$var$DEFAULT_HEADER_HEIGHT = {
81
+ medium: 34,
82
+ large: 40
83
+ };
84
+ const $bd013581c0a4b065$var$DEFAULT_HIDE_HEADER_CELL_WIDTH = {
85
+ medium: 38,
86
+ large: 46
87
+ };
88
+ const $bd013581c0a4b065$var$ROW_HEIGHTS = {
89
+ compact: {
90
+ medium: 32,
91
+ large: 40
92
+ },
93
+ regular: {
94
+ medium: 40,
95
+ large: 50
96
+ },
97
+ spacious: {
98
+ medium: 48,
99
+ large: 60
100
+ }
101
+ };
102
+ const $bd013581c0a4b065$var$SELECTION_CELL_DEFAULT_WIDTH = {
103
+ medium: 38,
104
+ large: 48
105
+ };
106
+ const $bd013581c0a4b065$var$DRAG_BUTTON_CELL_DEFAULT_WIDTH = {
107
+ medium: 16,
108
+ large: 20
109
+ };
110
+ const $bd013581c0a4b065$var$LEVEL_OFFSET_WIDTH = {
111
+ medium: 16,
112
+ large: 20
113
+ };
114
+ const $bd013581c0a4b065$export$93e4b0b2cc49b648 = /*#__PURE__*/ (0, $7lS7h$react).createContext(null);
115
+ function $bd013581c0a4b065$export$3cb274deb6c2d854() {
116
+ return (0, $7lS7h$useContext)($bd013581c0a4b065$export$93e4b0b2cc49b648);
117
+ }
118
+ const $bd013581c0a4b065$export$d288a7dd40372bc = /*#__PURE__*/ (0, $7lS7h$react).createContext(null);
119
+ function $bd013581c0a4b065$export$3f8f74b6bfd2c5df() {
120
+ return (0, $7lS7h$useContext)($bd013581c0a4b065$export$d288a7dd40372bc);
121
+ }
122
+ function $bd013581c0a4b065$var$TableViewBase(props, ref) {
123
+ var _dropState_target;
124
+ props = (0, $7lS7h$useProviderProps)(props);
125
+ let { isQuiet: isQuiet, onAction: onAction, onResizeStart: propsOnResizeStart, onResizeEnd: propsOnResizeEnd, dragAndDropHooks: dragAndDropHooks, state: state } = props;
126
+ let isTableDraggable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDraggableCollectionState);
127
+ let isTableDroppable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDroppableCollectionState);
128
+ let dragHooksProvided = (0, $7lS7h$useRef)(isTableDraggable);
129
+ let dropHooksProvided = (0, $7lS7h$useRef)(isTableDroppable);
130
+ (0, $7lS7h$useEffect)(()=>{
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
+ }, [
135
+ isTableDraggable,
136
+ isTableDroppable,
137
+ state
138
+ ]);
139
+ let { styleProps: styleProps } = (0, $7lS7h$useStyleProps)(props);
140
+ let { direction: direction } = (0, $7lS7h$useLocale)();
141
+ let { scale: scale } = (0, $7lS7h$useProvider)();
142
+ const getDefaultWidth = (0, $7lS7h$useCallback)(({ props: { hideHeader: hideHeader, isSelectionCell: isSelectionCell, showDivider: showDivider, isDragButtonCell: isDragButtonCell } })=>{
143
+ if (hideHeader) {
144
+ let width = $bd013581c0a4b065$var$DEFAULT_HIDE_HEADER_CELL_WIDTH[scale];
145
+ return showDivider ? width + 1 : width;
146
+ } else if (isSelectionCell) return $bd013581c0a4b065$var$SELECTION_CELL_DEFAULT_WIDTH[scale];
147
+ else if (isDragButtonCell) return $bd013581c0a4b065$var$DRAG_BUTTON_CELL_DEFAULT_WIDTH[scale];
148
+ }, [
149
+ scale
150
+ ]);
151
+ const getDefaultMinWidth = (0, $7lS7h$useCallback)(({ props: { hideHeader: hideHeader, isSelectionCell: isSelectionCell, showDivider: showDivider, isDragButtonCell: isDragButtonCell } })=>{
152
+ if (hideHeader) {
153
+ let width = $bd013581c0a4b065$var$DEFAULT_HIDE_HEADER_CELL_WIDTH[scale];
154
+ return showDivider ? width + 1 : width;
155
+ } else if (isSelectionCell) return $bd013581c0a4b065$var$SELECTION_CELL_DEFAULT_WIDTH[scale];
156
+ else if (isDragButtonCell) return $bd013581c0a4b065$var$DRAG_BUTTON_CELL_DEFAULT_WIDTH[scale];
157
+ return 75;
158
+ }, [
159
+ scale
160
+ ]);
161
+ // Starts when the user selects resize from the menu, ends when resizing ends
162
+ // used to control the visibility of the resizer Nubbin
163
+ let [isInResizeMode, setIsInResizeMode] = (0, $7lS7h$useState)(false);
164
+ // Starts when the resizer is actually moved
165
+ // entering resizing/exiting resizing doesn't trigger a render
166
+ // with table layout, so we need to track it here
167
+ let [, setIsResizing] = (0, $7lS7h$useState)(false);
168
+ let domRef = (0, $7lS7h$useDOMRef)(ref);
169
+ let headerRef = (0, $7lS7h$useRef)();
170
+ let bodyRef = (0, $7lS7h$useRef)();
171
+ let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))), "@react-spectrum/table");
172
+ let density = props.density || "regular";
173
+ let columnLayout = (0, $7lS7h$useMemo)(()=>new (0, $7lS7h$TableColumnLayout)({
174
+ getDefaultWidth: getDefaultWidth,
175
+ getDefaultMinWidth: getDefaultMinWidth
176
+ }), [
177
+ getDefaultWidth,
178
+ getDefaultMinWidth
179
+ ]);
180
+ let tableLayout = (0, $7lS7h$useMemo)(()=>new (0, $7lS7h$TableLayout)({
181
+ // If props.rowHeight is auto, then use estimated heights based on scale, otherwise use fixed heights.
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
+ columnLayout: columnLayout,
187
+ initialCollection: state.collection
188
+ }), // don't recompute when state.collection changes, only used for initial value
189
+ // eslint-disable-next-line react-hooks/exhaustive-deps
190
+ [
191
+ props.overflowMode,
192
+ scale,
193
+ density,
194
+ columnLayout
195
+ ]);
196
+ // Use a proxy so that a new object is created for each render so that alternate instances aren't affected by mutation.
197
+ // This can be thought of as equivalent to `{…tableLayout, tableState: state}`, but works with classes as well.
198
+ let layout = (0, $7lS7h$useMemo)(()=>{
199
+ let proxy = new Proxy(tableLayout, {
200
+ get (target, prop, receiver) {
201
+ return prop === "tableState" ? state : Reflect.get(target, prop, receiver);
202
+ }
203
+ });
204
+ return proxy;
205
+ }, [
206
+ state,
207
+ tableLayout
208
+ ]);
209
+ let dragState;
210
+ let preview = (0, $7lS7h$useRef)(null);
211
+ if (isTableDraggable) {
212
+ dragState = dragAndDropHooks.useDraggableCollectionState({
213
+ collection: state.collection,
214
+ selectionManager: state.selectionManager,
215
+ preview: preview
216
+ });
217
+ dragAndDropHooks.useDraggableCollection({}, dragState, domRef);
218
+ }
219
+ let DragPreview = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.DragPreview;
220
+ let dropState;
221
+ let droppableCollection;
222
+ let isRootDropTarget;
223
+ if (isTableDroppable) {
224
+ dropState = dragAndDropHooks.useDroppableCollectionState({
225
+ collection: state.collection,
226
+ selectionManager: state.selectionManager
227
+ });
228
+ droppableCollection = dragAndDropHooks.useDroppableCollection({
229
+ keyboardDelegate: layout,
230
+ dropTargetDelegate: layout
231
+ }, dropState, domRef);
232
+ isRootDropTarget = dropState.isDropTarget({
233
+ type: "root"
234
+ });
235
+ }
236
+ let { gridProps: gridProps } = (0, $7lS7h$useTable)({
237
+ ...props,
238
+ isVirtualized: true,
239
+ layout: layout,
240
+ onRowAction: onAction
241
+ }, state, domRef);
242
+ let [headerMenuOpen, setHeaderMenuOpen] = (0, $7lS7h$useState)(false);
243
+ let [headerRowHovered, setHeaderRowHovered] = (0, $7lS7h$useState)(false);
244
+ let renderWrapper = (parent, reusableView, children, renderChildren)=>{
245
+ let style = (0, $7lS7h$layoutInfoToStyle)(reusableView.layoutInfo, direction, parent && parent.layoutInfo);
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
+ key: reusableView.key,
249
+ style: style
250
+ }, isTableDroppable && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $4e6fc36ba71ba405$export$d30a7814cfd4033e), {
251
+ key: "root"
252
+ }), renderChildren(children));
253
+ if (reusableView.viewType === "header") return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableHeader, {
254
+ key: reusableView.key,
255
+ style: style
256
+ }, renderChildren(children));
257
+ if (reusableView.viewType === "row") return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableRow, {
258
+ key: reusableView.key,
259
+ item: reusableView.content,
260
+ style: style,
261
+ hasActions: onAction,
262
+ isTableDroppable: isTableDroppable,
263
+ isTableDraggable: isTableDraggable
264
+ }, renderChildren(children));
265
+ if (reusableView.viewType === "headerrow") return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableHeaderRow, {
266
+ onHoverChange: setHeaderRowHovered,
267
+ key: reusableView.key,
268
+ style: style,
269
+ item: reusableView.content
270
+ }, renderChildren(children));
271
+ let isDropTarget;
272
+ let isRootDroptarget;
273
+ if (isTableDroppable) {
274
+ if (parent.content) isDropTarget = dropState.isDropTarget({
275
+ type: "item",
276
+ dropPosition: "on",
277
+ key: parent.content.key
278
+ });
279
+ isRootDroptarget = dropState.isDropTarget({
280
+ type: "root"
281
+ });
282
+ }
283
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VirtualizerItem), {
284
+ key: reusableView.key,
285
+ layoutInfo: reusableView.layoutInfo,
286
+ virtualizer: reusableView.virtualizer,
287
+ parent: parent === null || parent === void 0 ? void 0 : parent.layoutInfo,
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
+ }))
292
+ }, reusableView.rendered);
293
+ };
294
+ let renderView = (type, item)=>{
295
+ switch(type){
296
+ case "header":
297
+ case "rowgroup":
298
+ case "section":
299
+ case "row":
300
+ case "headerrow":
301
+ return null;
302
+ case "cell":
303
+ if (item.props.isSelectionCell) return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableCheckboxCell, {
304
+ cell: item
305
+ });
306
+ if (item.props.isDragButtonCell) return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableDragCell, {
307
+ cell: item
308
+ });
309
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableCell, {
310
+ cell: item
311
+ });
312
+ case "placeholder":
313
+ // TODO: move to react-aria?
314
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
315
+ role: "gridcell",
316
+ "aria-colindex": item.index + 1,
317
+ "aria-colspan": item.colspan > 1 ? item.colspan : null
318
+ });
319
+ case "column":
320
+ if (item.props.isSelectionCell) return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableSelectAllCell, {
321
+ column: item
322
+ });
323
+ if (item.props.isDragButtonCell) return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableDragHeaderCell, {
324
+ column: item
325
+ });
326
+ // TODO: consider this case, what if we have hidden headers and a empty table
327
+ if (item.props.hideHeader) return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$TooltipTrigger), {
328
+ placement: "top",
329
+ trigger: "focus"
330
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableColumnHeader, {
331
+ column: item
332
+ }), /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$Tooltip), {
333
+ placement: "top"
334
+ }, item.rendered));
335
+ if (item.props.allowsResizing && !item.hasChildNodes) return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$ResizableTableColumnHeader, {
336
+ tableRef: domRef,
337
+ column: item
338
+ });
339
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableColumnHeader, {
340
+ column: item
341
+ });
342
+ case "loader":
343
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$CenteredWrapper, null, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$ProgressCircle), {
344
+ isIndeterminate: true,
345
+ "aria-label": state.collection.size > 0 ? stringFormatter.format("loadingMore") : stringFormatter.format("loading")
346
+ }));
347
+ case "empty":
348
+ {
349
+ let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
350
+ if (emptyState == null) return null;
351
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$CenteredWrapper, null, emptyState);
352
+ }
353
+ }
354
+ };
355
+ let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = (0, $7lS7h$useState)(false);
356
+ let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = (0, $7lS7h$useState)(false);
357
+ let viewport = (0, $7lS7h$useRef)({
358
+ x: 0,
359
+ y: 0,
360
+ width: 0,
361
+ height: 0
362
+ });
363
+ let onVisibleRectChange = (0, $7lS7h$useCallback)((e)=>{
364
+ if (viewport.current.width === e.width && viewport.current.height === e.height) return;
365
+ viewport.current = e;
366
+ if (bodyRef.current) {
367
+ setVerticalScollbarVisible(bodyRef.current.clientWidth + 2 < bodyRef.current.offsetWidth);
368
+ setHorizontalScollbarVisible(bodyRef.current.clientHeight + 2 < bodyRef.current.offsetHeight);
369
+ }
370
+ }, []);
371
+ let { isFocusVisible: isFocusVisible, focusProps: focusProps } = (0, $7lS7h$useFocusRing)();
372
+ let isEmpty = state.collection.size === 0;
373
+ let onFocusedResizer = ()=>{
374
+ bodyRef.current.scrollLeft = headerRef.current.scrollLeft;
375
+ };
376
+ let onResizeStart = (0, $7lS7h$useCallback)((widths)=>{
377
+ setIsResizing(true);
378
+ propsOnResizeStart === null || propsOnResizeStart === void 0 ? void 0 : propsOnResizeStart(widths);
379
+ }, [
380
+ setIsResizing,
381
+ propsOnResizeStart
382
+ ]);
383
+ let onResizeEnd = (0, $7lS7h$useCallback)((widths)=>{
384
+ setIsInResizeMode(false);
385
+ setIsResizing(false);
386
+ propsOnResizeEnd === null || propsOnResizeEnd === void 0 ? void 0 : propsOnResizeEnd(widths);
387
+ }, [
388
+ propsOnResizeEnd,
389
+ setIsInResizeMode,
390
+ setIsResizing
391
+ ]);
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) === "item") focusedKey = dropState.target.key;
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
+ tabIndex: null
396
+ });
397
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$export$93e4b0b2cc49b648.Provider, {
398
+ value: {
399
+ state: state,
400
+ dragState: dragState,
401
+ dropState: dropState,
402
+ dragAndDropHooks: dragAndDropHooks,
403
+ isTableDraggable: isTableDraggable,
404
+ isTableDroppable: isTableDroppable,
405
+ layout: layout,
406
+ onResizeStart: onResizeStart,
407
+ onResize: props.onResize,
408
+ onResizeEnd: onResizeEnd,
409
+ headerRowHovered: headerRowHovered,
410
+ isInResizeMode: isInResizeMode,
411
+ setIsInResizeMode: setIsInResizeMode,
412
+ isEmpty: isEmpty,
413
+ onFocusedResizer: onFocusedResizer,
414
+ headerMenuOpen: headerMenuOpen,
415
+ setHeaderMenuOpen: setHeaderMenuOpen
416
+ }
417
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableVirtualizer, {
418
+ ...mergedProps,
419
+ ...styleProps,
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
+ layout: layout,
428
+ collection: state.collection,
429
+ focusedKey: focusedKey,
430
+ renderView: renderView,
431
+ renderWrapper: renderWrapper,
432
+ onVisibleRectChange: onVisibleRectChange,
433
+ domRef: domRef,
434
+ headerRef: headerRef,
435
+ bodyRef: bodyRef,
436
+ isFocusVisible: isFocusVisible,
437
+ isVirtualDragging: dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.isVirtualDragging(),
438
+ isRootDropTarget: isRootDropTarget
439
+ }), DragPreview && isTableDraggable && /*#__PURE__*/ (0, $7lS7h$react).createElement(DragPreview, {
440
+ ref: preview
441
+ }, ()=>{
442
+ if (dragAndDropHooks.renderPreview) return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);
443
+ let itemCount = dragState.draggingKeys.size;
444
+ let maxWidth = bodyRef.current.getBoundingClientRect().width;
445
+ let height = $bd013581c0a4b065$var$ROW_HEIGHTS[density][scale];
446
+ let itemText = state.collection.getTextValue(dragState.draggedKey);
447
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $daa6ead3d9d3506a$export$905ab40ac2179daa), {
448
+ itemText: itemText,
449
+ itemCount: itemCount,
450
+ height: height,
451
+ maxWidth: maxWidth
452
+ });
453
+ }));
454
+ }
455
+ // This is a custom Virtualizer that also has a header that syncs its scroll position with the body.
456
+ function $bd013581c0a4b065$var$TableVirtualizer(props) {
457
+ var _layout_getLayoutInfo;
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
+ let { direction: direction } = (0, $7lS7h$useLocale)();
460
+ let loadingState = collection.body.props.loadingState;
461
+ let isLoading = loadingState === "loading" || loadingState === "loadingMore";
462
+ let onLoadMore = collection.body.props.onLoadMore;
463
+ let transitionDuration = 220;
464
+ if (isLoading) transitionDuration = 160;
465
+ if (layout.resizingColumn != null) // while resizing, prop changes should not cause animations
466
+ transitionDuration = 0;
467
+ let state = (0, $7lS7h$useVirtualizerState)({
468
+ layout: layout,
469
+ collection: collection,
470
+ renderView: renderView,
471
+ renderWrapper: renderWrapper,
472
+ onVisibleRectChange (rect) {
473
+ bodyRef.current.scrollTop = rect.y;
474
+ (0, $7lS7h$setScrollLeft)(bodyRef.current, direction, rect.x);
475
+ },
476
+ transitionDuration: transitionDuration
477
+ });
478
+ let scrollToItem = (0, $7lS7h$useCallback)((key)=>{
479
+ let item = collection.getItem(key);
480
+ let column = collection.columns[0];
481
+ let virtualizer = state.virtualizer;
482
+ virtualizer.scrollToItem(key, {
483
+ duration: 0,
484
+ // Prevent scrolling to the top when clicking on column headers.
485
+ shouldScrollY: (item === null || item === void 0 ? void 0 : item.type) !== "column",
486
+ // Offset scroll position by width of selection cell
487
+ // (which is sticky and will overlap the cell we're scrolling to).
488
+ offsetX: column.props.isSelectionCell || column.props.isDragButtonCell ? layout.getColumnWidth(column.key) : 0
489
+ });
490
+ // Sync the scroll positions of the column headers and the body so scrollIntoViewport can
491
+ // properly decide if the column is outside the viewport or not
492
+ headerRef.current.scrollLeft = bodyRef.current.scrollLeft;
493
+ }, [
494
+ collection,
495
+ bodyRef,
496
+ headerRef,
497
+ layout,
498
+ state.virtualizer
499
+ ]);
500
+ let memoedVirtualizerProps = (0, $7lS7h$useMemo)(()=>({
501
+ tabIndex: otherProps.tabIndex,
502
+ focusedKey: focusedKey,
503
+ scrollToItem: scrollToItem,
504
+ isLoading: isLoading,
505
+ onLoadMore: onLoadMore
506
+ }), [
507
+ otherProps.tabIndex,
508
+ focusedKey,
509
+ scrollToItem,
510
+ isLoading,
511
+ onLoadMore
512
+ ]);
513
+ let { virtualizerProps: virtualizerProps, scrollViewProps: { onVisibleRectChange: onVisibleRectChange } } = (0, $7lS7h$useVirtualizer)(memoedVirtualizerProps, state, domRef);
514
+ // this effect runs whenever the contentSize changes, it doesn't matter what the content size is
515
+ // only that it changes in a resize, and when that happens, we want to sync the body to the
516
+ // header scroll position
517
+ (0, $7lS7h$useEffect)(()=>{
518
+ if ((0, $7lS7h$getInteractionModality)() === "keyboard" && headerRef.current.contains(document.activeElement)) {
519
+ (0, $7lS7h$scrollIntoView)(headerRef.current, document.activeElement);
520
+ (0, $7lS7h$scrollIntoViewport)(document.activeElement, {
521
+ containingElement: domRef.current
522
+ });
523
+ bodyRef.current.scrollLeft = headerRef.current.scrollLeft;
524
+ }
525
+ }, [
526
+ state.contentSize,
527
+ headerRef,
528
+ bodyRef,
529
+ domRef
530
+ ]);
531
+ let headerHeight = ((_layout_getLayoutInfo = layout.getLayoutInfo("header")) === null || _layout_getLayoutInfo === void 0 ? void 0 : _layout_getLayoutInfo.rect.height) || 0;
532
+ // Sync the scroll position from the table body to the header container.
533
+ let onScroll = (0, $7lS7h$useCallback)(()=>{
534
+ headerRef.current.scrollLeft = bodyRef.current.scrollLeft;
535
+ }, [
536
+ bodyRef,
537
+ headerRef
538
+ ]);
539
+ let resizerPosition = layout.getResizerPosition() - 2;
540
+ let resizerAtEdge = resizerPosition > Math.max(state.virtualizer.contentSize.width, state.virtualizer.visibleRect.width) - 3;
541
+ // this should be fine, every movement of the resizer causes a rerender
542
+ // scrolling can cause it to lag for a moment, but it's always updated
543
+ let resizerInVisibleRegion = resizerPosition < state.virtualizer.visibleRect.maxX;
544
+ let shouldHardCornerResizeCorner = resizerAtEdge && resizerInVisibleRegion;
545
+ // minimize re-render caused on Resizers by memoing this
546
+ let resizingColumnWidth = layout.getColumnWidth(layout.resizingColumn);
547
+ let resizingColumn = (0, $7lS7h$useMemo)(()=>({
548
+ width: resizingColumnWidth,
549
+ key: layout.resizingColumn
550
+ }), [
551
+ resizingColumnWidth,
552
+ layout.resizingColumn
553
+ ]);
554
+ let mergedProps = (0, $7lS7h$mergeProps)(otherProps, virtualizerProps, isVirtualDragging && {
555
+ tabIndex: null
556
+ });
557
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$export$d288a7dd40372bc.Provider, {
558
+ value: resizingColumn
559
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusScope), null, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
560
+ ...mergedProps,
561
+ ref: domRef
562
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
563
+ role: "presentation",
564
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-headWrapper"),
565
+ style: {
566
+ height: headerHeight,
567
+ overflow: "hidden",
568
+ position: "relative",
569
+ willChange: state.isScrolling ? "scroll-position" : undefined,
570
+ transition: state.isAnimating ? `none ${state.virtualizer.transitionDuration}ms` : undefined
571
+ },
572
+ ref: headerRef
573
+ }, state.visibleViews[0]), /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$ScrollView), {
574
+ role: "presentation",
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
+ })),
581
+ tabIndex: isVirtualDragging ? null : -1,
582
+ style: {
583
+ flex: 1
584
+ },
585
+ innerStyle: {
586
+ overflow: "visible",
587
+ transition: state.isAnimating ? `none ${state.virtualizer.transitionDuration}ms` : undefined
588
+ },
589
+ ref: bodyRef,
590
+ contentSize: state.contentSize,
591
+ onVisibleRectChange: (0, $7lS7h$chain)(onVisibleRectChange, onVisibleRectChangeProp),
592
+ onScrollStart: state.startScrolling,
593
+ onScrollEnd: state.endScrolling,
594
+ onScroll: onScroll
595
+ }, state.visibleViews[1], /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
596
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-bodyResizeIndicator"),
597
+ style: {
598
+ [direction === "ltr" ? "left" : "right"]: `${resizerPosition}px`,
599
+ height: `${Math.max(state.virtualizer.contentSize.height, state.virtualizer.visibleRect.height)}px`,
600
+ display: layout.resizingColumn ? "block" : "none"
601
+ }
602
+ })))));
603
+ }
604
+ function $bd013581c0a4b065$var$TableHeader({ children: children, ...otherProps }) {
605
+ let { rowGroupProps: rowGroupProps } = (0, $7lS7h$useTableRowGroup)();
606
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
607
+ ...rowGroupProps,
608
+ ...otherProps,
609
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-head")
610
+ }, children);
611
+ }
612
+ function $bd013581c0a4b065$var$TableColumnHeader(props) {
613
+ var _state_sortDescriptor, _state_sortDescriptor1, _state_sortDescriptor2, _state_sortDescriptor3;
614
+ let { column: column } = props;
615
+ let ref = (0, $7lS7h$useRef)(null);
616
+ let { state: state, isEmpty: isEmpty } = $bd013581c0a4b065$export$3cb274deb6c2d854();
617
+ let { pressProps: pressProps, isPressed: isPressed } = (0, $7lS7h$usePress)({
618
+ isDisabled: isEmpty
619
+ });
620
+ let columnProps = column.props;
621
+ (0, $7lS7h$useEffect)(()=>{
622
+ if (column.hasChildNodes && columnProps.allowsResizing) console.warn(`Column key: ${column.key}. Columns with child columns don't allow resizing.`);
623
+ }, [
624
+ column.hasChildNodes,
625
+ column.key,
626
+ columnProps.allowsResizing
627
+ ]);
628
+ let { columnHeaderProps: columnHeaderProps } = (0, $7lS7h$useTableColumnHeader)({
629
+ node: column,
630
+ isVirtualized: true
631
+ }, state, ref);
632
+ let { hoverProps: hoverProps, isHovered: isHovered } = (0, $7lS7h$useHover)({
633
+ ...props,
634
+ isDisabled: isEmpty
635
+ });
636
+ const allProps = [
637
+ columnHeaderProps,
638
+ hoverProps,
639
+ pressProps
640
+ ];
641
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
642
+ focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "focus-ring")
643
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
644
+ ...(0, $7lS7h$mergeProps)(...allProps),
645
+ ref: ref,
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
+ }))
657
+ }, columnProps.allowsSorting && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiArrowDownSmall), {
658
+ UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-sortedIcon")
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))), "spectrum-Table-headCellContents")
661
+ }, column.rendered)));
662
+ }
663
+ let $bd013581c0a4b065$var$_TableColumnHeaderButton = (props, ref)=>{
664
+ let { focusProps: focusProps, alignment: alignment, ...otherProps } = props;
665
+ let { isEmpty: isEmpty } = $bd013581c0a4b065$export$3cb274deb6c2d854();
666
+ let domRef = (0, $7lS7h$useFocusableRef)(ref);
667
+ let { buttonProps: buttonProps } = (0, $7lS7h$useButton)({
668
+ ...otherProps,
669
+ elementType: "div",
670
+ isDisabled: isEmpty
671
+ }, domRef);
672
+ let { hoverProps: hoverProps, isHovered: isHovered } = (0, $7lS7h$useHover)({
673
+ ...otherProps,
674
+ isDisabled: isEmpty
675
+ });
676
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
677
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-headCellContents", {
678
+ "is-hovered": isHovered
679
+ }),
680
+ ...hoverProps
681
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
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
+ }),
687
+ ...(0, $7lS7h$mergeProps)(buttonProps, focusProps),
688
+ ref: domRef
689
+ }, props.children));
690
+ };
691
+ let $bd013581c0a4b065$var$TableColumnHeaderButton = /*#__PURE__*/ (0, $7lS7h$react).forwardRef($bd013581c0a4b065$var$_TableColumnHeaderButton);
692
+ function $bd013581c0a4b065$var$ResizableTableColumnHeader(props) {
693
+ var _column_props, _state_sortDescriptor, _state_sortDescriptor1, _state_sortDescriptor2, _state_sortDescriptor3;
694
+ let { column: column } = props;
695
+ let ref = (0, $7lS7h$useRef)(null);
696
+ let triggerRef = (0, $7lS7h$useRef)(null);
697
+ let resizingRef = (0, $7lS7h$useRef)(null);
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))), "@react-spectrum/table");
700
+ let { pressProps: pressProps, isPressed: isPressed } = (0, $7lS7h$usePress)({
701
+ isDisabled: isEmpty
702
+ });
703
+ let { columnHeaderProps: columnHeaderProps } = (0, $7lS7h$useTableColumnHeader)({
704
+ node: column,
705
+ isVirtualized: true
706
+ }, state, ref);
707
+ let { hoverProps: hoverProps, isHovered: isHovered } = (0, $7lS7h$useHover)({
708
+ ...props,
709
+ isDisabled: isEmpty || headerMenuOpen
710
+ });
711
+ const allProps = [
712
+ columnHeaderProps,
713
+ pressProps,
714
+ hoverProps
715
+ ];
716
+ let columnProps = column.props;
717
+ let { isFocusVisible: isFocusVisible, focusProps: focusProps } = (0, $7lS7h$useFocusRing)();
718
+ const onMenuSelect = (key)=>{
719
+ switch(key){
720
+ case "sort-asc":
721
+ state.sort(column.key, "ascending");
722
+ break;
723
+ case "sort-desc":
724
+ state.sort(column.key, "descending");
725
+ break;
726
+ case "resize":
727
+ layout.startResize(column.key);
728
+ setIsInResizeMode(true);
729
+ state.setKeyboardNavigationDisabled(true);
730
+ break;
731
+ }
732
+ };
733
+ let allowsSorting = (_column_props = column.props) === null || _column_props === void 0 ? void 0 : _column_props.allowsSorting;
734
+ let items = (0, $7lS7h$useMemo)(()=>{
735
+ let options = [
736
+ allowsSorting ? {
737
+ label: stringFormatter.format("sortAscending"),
738
+ id: "sort-asc"
739
+ } : undefined,
740
+ allowsSorting ? {
741
+ label: stringFormatter.format("sortDescending"),
742
+ id: "sort-desc"
743
+ } : undefined,
744
+ {
745
+ label: stringFormatter.format("resizeColumn"),
746
+ id: "resize"
747
+ }
748
+ ];
749
+ return options;
750
+ // eslint-disable-next-line react-hooks/exhaustive-deps
751
+ }, [
752
+ allowsSorting
753
+ ]);
754
+ let resizingColumn = layout.resizingColumn;
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
+ }
763
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
764
+ focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "focus-ring")
765
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
766
+ ...(0, $7lS7h$mergeProps)(...allProps),
767
+ ref: ref,
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
+ }))
781
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$MenuTrigger), {
782
+ onOpenChange: setHeaderMenuOpen,
783
+ align: menuAlign
784
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableColumnHeaderButton, {
785
+ alignment: alignment,
786
+ ref: triggerRef,
787
+ focusProps: focusProps
788
+ }, columnProps.allowsSorting && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiArrowDownSmall), {
789
+ UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-sortedIcon")
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))), "spectrum-Table-headerCellText")
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))), "spectrum-Table-menuChevron")
794
+ })), /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$Menu), {
795
+ onAction: onMenuSelect,
796
+ minWidth: "size-2000",
797
+ items: items
798
+ }, (item)=>/*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$Item), null, item.label))), /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $fc695d2eafc2b351$export$48a76196cafe3b93), {
799
+ ref: resizingRef,
800
+ column: column,
801
+ showResizer: showResizer,
802
+ onResizeStart: onResizeStart,
803
+ onResize: onResize,
804
+ onResizeEnd: onResizeEnd,
805
+ triggerRef: (0, $7lS7h$useUnwrapDOMRef)(triggerRef)
806
+ }), /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
807
+ "aria-hidden": true,
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
+ })
812
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
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
+ })
816
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $cb7d341e8868d81d$export$d9658cdf8c86807), null)))));
817
+ }
818
+ function $bd013581c0a4b065$var$TableSelectAllCell({ column: column }) {
819
+ let ref = (0, $7lS7h$useRef)();
820
+ let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
821
+ let isSingleSelectionMode = state.selectionManager.selectionMode === "single";
822
+ let { columnHeaderProps: columnHeaderProps } = (0, $7lS7h$useTableColumnHeader)({
823
+ node: column,
824
+ isVirtualized: true
825
+ }, state, ref);
826
+ let { checkboxProps: checkboxProps } = (0, $7lS7h$useTableSelectAllCheckbox)(state);
827
+ let { hoverProps: hoverProps, isHovered: isHovered } = (0, $7lS7h$useHover)({});
828
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
829
+ focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "focus-ring")
830
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
831
+ ...(0, $7lS7h$mergeProps)(columnHeaderProps, hoverProps),
832
+ ref: ref,
833
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-headCell", "spectrum-Table-checkboxCell", {
834
+ "is-hovered": isHovered
835
+ })
836
+ }, /*
837
+ In single selection mode, the checkbox will be hidden.
838
+ So to avoid leaving a column header with no accessible content,
839
+ we use a VisuallyHidden component to include the aria-label from the checkbox,
840
+ which for single selection will be "Select."
841
+ */ isSingleSelectionMode && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$VisuallyHidden), null, checkboxProps["aria-label"]), /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$Checkbox), {
842
+ ...checkboxProps,
843
+ isEmphasized: true,
844
+ UNSAFE_style: isSingleSelectionMode ? {
845
+ visibility: "hidden"
846
+ } : undefined,
847
+ UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-checkbox")
848
+ })));
849
+ }
850
+ function $bd013581c0a4b065$var$TableDragHeaderCell({ column: column }) {
851
+ let ref = (0, $7lS7h$useRef)();
852
+ let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
853
+ let { columnHeaderProps: columnHeaderProps } = (0, $7lS7h$useTableColumnHeader)({
854
+ node: column,
855
+ isVirtualized: true
856
+ }, state, ref);
857
+ let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))), "@react-spectrum/table");
858
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
859
+ focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "focus-ring")
860
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
861
+ ...columnHeaderProps,
862
+ ref: ref,
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
+ }
866
+ function $bd013581c0a4b065$var$TableRowGroup({ children: children, ...otherProps }) {
867
+ let { rowGroupProps: rowGroupProps } = (0, $7lS7h$useTableRowGroup)();
868
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
869
+ ...rowGroupProps,
870
+ ...otherProps
871
+ }, children);
872
+ }
873
+ function $bd013581c0a4b065$var$DragButton() {
874
+ let { dragButtonProps: dragButtonProps, dragButtonRef: dragButtonRef, isFocusVisibleWithin: isFocusVisibleWithin } = $bd013581c0a4b065$export$cd7c5802f9e21187();
875
+ let { visuallyHiddenProps: visuallyHiddenProps } = (0, $7lS7h$useVisuallyHidden)();
876
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
877
+ focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), "focus-ring")
878
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
879
+ ...dragButtonProps,
880
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), "react-spectrum-Table-dragButton"),
881
+ style: !isFocusVisibleWithin ? {
882
+ ...visuallyHiddenProps.style
883
+ } : {},
884
+ ref: dragButtonRef,
885
+ draggable: "true"
886
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiListGripper), {
887
+ UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))))
888
+ })));
889
+ }
890
+ const $bd013581c0a4b065$var$TableRowContext = /*#__PURE__*/ (0, $7lS7h$react).createContext(null);
891
+ function $bd013581c0a4b065$export$cd7c5802f9e21187() {
892
+ return (0, $7lS7h$useContext)($bd013581c0a4b065$var$TableRowContext);
893
+ }
894
+ function $bd013581c0a4b065$var$TableRow({ item: item, children: children, hasActions: hasActions, isTableDraggable: isTableDraggable, isTableDroppable: isTableDroppable, ...otherProps }) {
895
+ var _state_collection_rows_find, _layout_getContentSize, _layout_virtualizer;
896
+ let ref = (0, $7lS7h$useRef)();
897
+ let { state: state, layout: layout, dragAndDropHooks: dragAndDropHooks, dragState: dragState, dropState: dropState } = $bd013581c0a4b065$export$3cb274deb6c2d854();
898
+ let allowsInteraction = state.selectionManager.selectionMode !== "none" || hasActions;
899
+ let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);
900
+ let isDroppable = isTableDroppable && !isDisabled;
901
+ let isSelected = state.selectionManager.isSelected(item.key);
902
+ let { rowProps: rowProps } = (0, $7lS7h$useTableRow)({
903
+ node: item,
904
+ isVirtualized: true,
905
+ shouldSelectOnPressUp: isTableDraggable
906
+ }, state, ref);
907
+ let { pressProps: pressProps, isPressed: isPressed } = (0, $7lS7h$usePress)({
908
+ isDisabled: isDisabled
909
+ });
910
+ // The row should show the focus background style when any cell inside it is focused.
911
+ // If the row itself is focused, then it should have a blue focus indicator on the left.
912
+ let { isFocusVisible: isFocusVisibleWithin, focusProps: focusWithinProps } = (0, $7lS7h$useFocusRing)({
913
+ within: true
914
+ });
915
+ let { isFocusVisible: isFocusVisible, focusProps: focusProps } = (0, $7lS7h$useFocusRing)();
916
+ let { hoverProps: hoverProps, isHovered: isHovered } = (0, $7lS7h$useHover)({
917
+ isDisabled: isDisabled
918
+ });
919
+ let isFirstRow = ((_state_collection_rows_find = state.collection.rows.find((row)=>row.level === 1)) === null || _state_collection_rows_find === void 0 ? void 0 : _state_collection_rows_find.key) === item.key;
920
+ let isLastRow = item.nextKey == null;
921
+ // Figure out if the TableView content is equal or greater in height to the container. If so, we'll need to round the bottom
922
+ // border corners of the last row when selected.
923
+ let isFlushWithContainerBottom = false;
924
+ if (isLastRow) {
925
+ if (((_layout_getContentSize = layout.getContentSize()) === null || _layout_getContentSize === void 0 ? void 0 : _layout_getContentSize.height) >= ((_layout_virtualizer = layout.virtualizer) === null || _layout_virtualizer === void 0 ? void 0 : _layout_virtualizer.getVisibleRect().height)) isFlushWithContainerBottom = true;
926
+ }
927
+ let draggableItem;
928
+ if (isTableDraggable) {
929
+ // eslint-disable-next-line react-hooks/rules-of-hooks
930
+ draggableItem = dragAndDropHooks.useDraggableItem({
931
+ key: item.key,
932
+ hasDragButton: true
933
+ }, dragState);
934
+ if (isDisabled) draggableItem = null;
935
+ }
936
+ let droppableItem;
937
+ let isDropTarget;
938
+ let dropIndicator;
939
+ let dropIndicatorRef = (0, $7lS7h$useRef)();
940
+ if (isTableDroppable) {
941
+ let target = {
942
+ type: "item",
943
+ key: item.key,
944
+ dropPosition: "on"
945
+ };
946
+ isDropTarget = dropState.isDropTarget(target);
947
+ // eslint-disable-next-line react-hooks/rules-of-hooks
948
+ dropIndicator = dragAndDropHooks.useDropIndicator({
949
+ target: target
950
+ }, dropState, dropIndicatorRef);
951
+ }
952
+ let dragButtonRef = (0, $7lS7h$react).useRef();
953
+ let { buttonProps: dragButtonProps } = (0, $7lS7h$useButton)({
954
+ ...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
955
+ elementType: "div"
956
+ }, dragButtonRef);
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
+ // allowing for single swipe navigation between row drop indicator
959
+ (dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.isVirtualDragging()) && {
960
+ tabIndex: null
961
+ });
962
+ let dropProps = isDroppable ? droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps : {
963
+ "aria-hidden": droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps["aria-hidden"]
964
+ };
965
+ let { visuallyHiddenProps: visuallyHiddenProps } = (0, $7lS7h$useVisuallyHidden)();
966
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$TableRowContext.Provider, {
967
+ value: {
968
+ dragButtonProps: dragButtonProps,
969
+ dragButtonRef: dragButtonRef,
970
+ isFocusVisibleWithin: isFocusVisibleWithin
971
+ }
972
+ }, isTableDroppable && isFirstRow && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7ee9a922ee4e8032$export$2c0bab5914a9d088), {
973
+ rowProps: props,
974
+ key: `${item.key}-before`,
975
+ target: {
976
+ key: item.key,
977
+ type: "item",
978
+ dropPosition: "before"
979
+ }
980
+ }), isTableDroppable && !(dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.isHidden) && /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
981
+ role: "row",
982
+ ...visuallyHiddenProps
983
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
984
+ role: "gridcell"
985
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
986
+ role: "button",
987
+ ...dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.dropIndicatorProps,
988
+ ref: dropIndicatorRef
989
+ }))), /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
990
+ ...(0, $7lS7h$mergeProps)(props, dropProps),
991
+ ref: ref,
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
+ }))
1007
+ }, children), isTableDroppable && /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7ee9a922ee4e8032$export$2c0bab5914a9d088), {
1008
+ rowProps: props,
1009
+ key: `${item.key}-after`,
1010
+ target: {
1011
+ key: item.key,
1012
+ type: "item",
1013
+ dropPosition: "after"
1014
+ }
1015
+ }));
1016
+ }
1017
+ function $bd013581c0a4b065$var$TableHeaderRow({ item: item, children: children, style: style, ...props }) {
1018
+ let { state: state, headerMenuOpen: headerMenuOpen } = $bd013581c0a4b065$export$3cb274deb6c2d854();
1019
+ let ref = (0, $7lS7h$useRef)();
1020
+ let { rowProps: rowProps } = (0, $7lS7h$useTableHeaderRow)({
1021
+ node: item,
1022
+ isVirtualized: true
1023
+ }, state, ref);
1024
+ let { hoverProps: hoverProps } = (0, $7lS7h$useHover)({
1025
+ ...props,
1026
+ isDisabled: headerMenuOpen
1027
+ });
1028
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
1029
+ ...(0, $7lS7h$mergeProps)(rowProps, hoverProps),
1030
+ ref: ref,
1031
+ style: style
1032
+ }, children);
1033
+ }
1034
+ function $bd013581c0a4b065$var$TableDragCell({ cell: cell }) {
1035
+ let ref = (0, $7lS7h$useRef)();
1036
+ let { state: state, isTableDraggable: isTableDraggable } = $bd013581c0a4b065$export$3cb274deb6c2d854();
1037
+ let isDisabled = state.disabledKeys.has(cell.parentKey);
1038
+ let { gridCellProps: gridCellProps } = (0, $7lS7h$useTableCell)({
1039
+ node: cell,
1040
+ isVirtualized: true
1041
+ }, state, ref);
1042
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
1043
+ focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "focus-ring")
1044
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
1045
+ ...gridCellProps,
1046
+ ref: ref,
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
+ }, isTableDraggable && !isDisabled && /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$DragButton, null)));
1051
+ }
1052
+ function $bd013581c0a4b065$var$TableCheckboxCell({ cell: cell }) {
1053
+ let ref = (0, $7lS7h$useRef)();
1054
+ let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
1055
+ let isDisabled = state.disabledKeys.has(cell.parentKey);
1056
+ let { gridCellProps: gridCellProps } = (0, $7lS7h$useTableCell)({
1057
+ node: cell,
1058
+ isVirtualized: true
1059
+ }, state, ref);
1060
+ let { checkboxProps: checkboxProps } = (0, $7lS7h$useTableSelectionCheckbox)({
1061
+ key: cell.parentKey
1062
+ }, state);
1063
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
1064
+ focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "focus-ring")
1065
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
1066
+ ...gridCellProps,
1067
+ ref: ref,
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
+ ...checkboxProps,
1073
+ isEmphasized: true,
1074
+ isDisabled: isDisabled,
1075
+ UNSAFE_className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-checkbox")
1076
+ })));
1077
+ }
1078
+ function $bd013581c0a4b065$var$TableCell({ cell: cell }) {
1079
+ let { scale: scale } = (0, $7lS7h$useProvider)();
1080
+ let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
1081
+ let isExpandableTable = "expandedKeys" in state;
1082
+ let ref = (0, $7lS7h$useRef)();
1083
+ let columnProps = cell.column.props;
1084
+ let isDisabled = state.disabledKeys.has(cell.parentKey);
1085
+ let { gridCellProps: gridCellProps } = (0, $7lS7h$useTableCell)({
1086
+ node: cell,
1087
+ isVirtualized: true
1088
+ }, state, ref);
1089
+ let { id: id, ...otherGridCellProps } = gridCellProps;
1090
+ let isFirstRowHeaderCell = state.collection.rowHeaderColumnKeys.keys().next().value === cell.column.key;
1091
+ let isRowExpandable = false;
1092
+ let showExpandCollapseButton = false;
1093
+ let levelOffset = 0;
1094
+ if ("expandedKeys" in state) {
1095
+ var _state_keyMap_get_props_UNSTABLE_childItems, _state_keyMap_get, _state_keyMap_get_props_children, _state_keyMap_get_props, _state_keyMap_get1;
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
+ showExpandCollapseButton = isFirstRowHeaderCell && isRowExpandable;
1098
+ // Offset based on level, and add additional offset if there is no expand/collapse button on a row
1099
+ levelOffset = (cell.level - 2) * $bd013581c0a4b065$var$LEVEL_OFFSET_WIDTH[scale] + (!showExpandCollapseButton ? $bd013581c0a4b065$var$LEVEL_OFFSET_WIDTH[scale] * 2 : 0);
1100
+ }
1101
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$FocusRing), {
1102
+ focusRingClass: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "focus-ring")
1103
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
1104
+ ...otherGridCellProps,
1105
+ "aria-labelledby": id,
1106
+ ref: ref,
1107
+ style: isExpandableTable && isFirstRowHeaderCell ? {
1108
+ paddingInlineStart: levelOffset
1109
+ } : {},
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
+ }))
1120
+ }, showExpandCollapseButton && /*#__PURE__*/ (0, $7lS7h$react).createElement($bd013581c0a4b065$var$ExpandableRowChevron, {
1121
+ cell: cell
1122
+ }), /*#__PURE__*/ (0, $7lS7h$react).createElement("span", {
1123
+ id: id,
1124
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-cellContents")
1125
+ }, cell.rendered)));
1126
+ }
1127
+ function $bd013581c0a4b065$var$ExpandableRowChevron({ cell: cell }) {
1128
+ // TODO: move some/all of the chevron button setup into a separate hook?
1129
+ let { direction: direction } = (0, $7lS7h$useLocale)();
1130
+ let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
1131
+ let expandButtonRef = (0, $7lS7h$useRef)();
1132
+ let stringFormatter = (0, $7lS7h$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7lS7h$intlStringsmodulejs))), "@react-spectrum/table");
1133
+ let isExpanded;
1134
+ if ("expandedKeys" in state) isExpanded = state.expandedKeys === "all" || state.expandedKeys.has(cell.parentKey);
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
+ let { buttonProps: buttonProps } = (0, $7lS7h$useButton)({
1137
+ // Desktop and mobile both toggle expansion of a native expandable row on mouse/touch up
1138
+ onPress: ()=>{
1139
+ state.toggleKey(cell.parentKey);
1140
+ if (!(0, $7lS7h$isFocusVisible)()) {
1141
+ state.selectionManager.setFocused(true);
1142
+ state.selectionManager.setFocusedKey(cell.parentKey);
1143
+ }
1144
+ },
1145
+ elementType: "span",
1146
+ "aria-label": isExpanded ? stringFormatter.format("collapse") : stringFormatter.format("expand")
1147
+ }, expandButtonRef);
1148
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement("span", {
1149
+ ...buttonProps,
1150
+ ref: expandButtonRef,
1151
+ // Override tabindex so that grid keyboard nav skips over it. Needs -1 so android talkback can actually "focus" it
1152
+ tabIndex: (0, $7lS7h$isAndroid)() ? -1 : undefined,
1153
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_vars_cssmodulejs))), "spectrum-Table-expandButton", {
1154
+ "is-open": isExpanded
1155
+ })
1156
+ }, direction === "ltr" ? /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiChevronRightMedium), null) : /*#__PURE__*/ (0, $7lS7h$react).createElement((0, $7lS7h$spectrumiconsuiChevronLeftMedium), null));
1157
+ }
1158
+ function $bd013581c0a4b065$var$CenteredWrapper({ children: children }) {
1159
+ let { state: state } = $bd013581c0a4b065$export$3cb274deb6c2d854();
1160
+ let rowProps;
1161
+ if ("expandedKeys" in state) {
1162
+ let topLevelRowCount = [
1163
+ ...state.keyMap.get(state.collection.body.key).childNodes
1164
+ ].length;
1165
+ rowProps = {
1166
+ "aria-level": 1,
1167
+ "aria-posinset": topLevelRowCount + 1,
1168
+ "aria-setsize": topLevelRowCount + 1
1169
+ };
1170
+ } else rowProps = {
1171
+ "aria-rowindex": state.collection.headerRows.length + state.collection.size + 1
1172
+ };
1173
+ return /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
1174
+ role: "row",
1175
+ ...rowProps,
1176
+ className: (0, $7lS7h$classNames)((0, ($parcel$interopDefault($7lS7h$table_cssmodulejs))), "react-spectrum-Table-centeredWrapper")
1177
+ }, /*#__PURE__*/ (0, $7lS7h$react).createElement("div", {
1178
+ role: "rowheader",
1179
+ "aria-colspan": state.collection.columns.length
1180
+ }, children));
1181
+ }
1182
+ const $bd013581c0a4b065$export$517e02184d273d69 = /*#__PURE__*/ (0, $7lS7h$react).forwardRef($bd013581c0a4b065$var$TableViewBase);
1183
+
1184
+
1185
+ export {$bd013581c0a4b065$export$93e4b0b2cc49b648 as TableContext, $bd013581c0a4b065$export$3cb274deb6c2d854 as useTableContext, $bd013581c0a4b065$export$d288a7dd40372bc as VirtualizerContext, $bd013581c0a4b065$export$3f8f74b6bfd2c5df as useVirtualizerContext, $bd013581c0a4b065$export$cd7c5802f9e21187 as useTableRowContext, $bd013581c0a4b065$export$517e02184d273d69 as TableViewBase};
1186
+ //# sourceMappingURL=TableViewBase.mjs.map