@tanstack/react-table 8.0.0-alpha.8 → 8.0.0-alpha.80

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 (113) hide show
  1. package/build/cjs/react-table/src/index.js +133 -0
  2. package/build/cjs/react-table/src/index.js.map +1 -0
  3. package/build/cjs/table-core/build/esm/index.js +3951 -0
  4. package/build/cjs/table-core/build/esm/index.js.map +1 -0
  5. package/build/esm/index.js +3253 -4059
  6. package/build/esm/index.js.map +1 -1
  7. package/build/stats-html.html +1 -1
  8. package/build/stats-react.json +24 -797
  9. package/build/types/index.d.ts +16 -8
  10. package/build/umd/index.development.js +3349 -4124
  11. package/build/umd/index.development.js.map +1 -1
  12. package/build/umd/index.production.js +11 -1
  13. package/build/umd/index.production.js.map +1 -1
  14. package/package.json +7 -9
  15. package/src/index.tsx +113 -8
  16. package/build/cjs/_virtual/_rollupPluginBabelHelpers.js +0 -112
  17. package/build/cjs/_virtual/_rollupPluginBabelHelpers.js.map +0 -1
  18. package/build/cjs/aggregationTypes.js +0 -130
  19. package/build/cjs/aggregationTypes.js.map +0 -1
  20. package/build/cjs/core.js +0 -560
  21. package/build/cjs/core.js.map +0 -1
  22. package/build/cjs/createTable.js +0 -108
  23. package/build/cjs/createTable.js.map +0 -1
  24. package/build/cjs/features/ColumnSizing.js +0 -317
  25. package/build/cjs/features/ColumnSizing.js.map +0 -1
  26. package/build/cjs/features/Expanding.js +0 -251
  27. package/build/cjs/features/Expanding.js.map +0 -1
  28. package/build/cjs/features/Filters.js +0 -445
  29. package/build/cjs/features/Filters.js.map +0 -1
  30. package/build/cjs/features/Grouping.js +0 -249
  31. package/build/cjs/features/Grouping.js.map +0 -1
  32. package/build/cjs/features/Headers.js +0 -549
  33. package/build/cjs/features/Headers.js.map +0 -1
  34. package/build/cjs/features/Ordering.js +0 -86
  35. package/build/cjs/features/Ordering.js.map +0 -1
  36. package/build/cjs/features/Pagination.js +0 -198
  37. package/build/cjs/features/Pagination.js.map +0 -1
  38. package/build/cjs/features/Pinning.js +0 -149
  39. package/build/cjs/features/Pinning.js.map +0 -1
  40. package/build/cjs/features/RowSelection.js +0 -541
  41. package/build/cjs/features/RowSelection.js.map +0 -1
  42. package/build/cjs/features/Sorting.js +0 -327
  43. package/build/cjs/features/Sorting.js.map +0 -1
  44. package/build/cjs/features/Visibility.js +0 -166
  45. package/build/cjs/features/Visibility.js.map +0 -1
  46. package/build/cjs/filterTypes.js +0 -172
  47. package/build/cjs/filterTypes.js.map +0 -1
  48. package/build/cjs/index.js +0 -32
  49. package/build/cjs/index.js.map +0 -1
  50. package/build/cjs/sortTypes.js +0 -122
  51. package/build/cjs/sortTypes.js.map +0 -1
  52. package/build/cjs/utils/columnFilterRowsFn.js +0 -131
  53. package/build/cjs/utils/columnFilterRowsFn.js.map +0 -1
  54. package/build/cjs/utils/expandRowsFn.js +0 -38
  55. package/build/cjs/utils/expandRowsFn.js.map +0 -1
  56. package/build/cjs/utils/globalFilterRowsFn.js +0 -101
  57. package/build/cjs/utils/globalFilterRowsFn.js.map +0 -1
  58. package/build/cjs/utils/groupRowsFn.js +0 -155
  59. package/build/cjs/utils/groupRowsFn.js.map +0 -1
  60. package/build/cjs/utils/paginateRowsFn.js +0 -44
  61. package/build/cjs/utils/paginateRowsFn.js.map +0 -1
  62. package/build/cjs/utils/sortRowsFn.js +0 -94
  63. package/build/cjs/utils/sortRowsFn.js.map +0 -1
  64. package/build/cjs/utils.js +0 -141
  65. package/build/cjs/utils.js.map +0 -1
  66. package/build/types/aggregationTypes.d.ts +0 -22
  67. package/build/types/core.d.ts +0 -110
  68. package/build/types/createTable.d.ts +0 -52
  69. package/build/types/features/ColumnSizing.d.ts +0 -67
  70. package/build/types/features/Expanding.d.ts +0 -53
  71. package/build/types/features/Filters.d.ts +0 -98
  72. package/build/types/features/Grouping.d.ts +0 -82
  73. package/build/types/features/Headers.d.ts +0 -41
  74. package/build/types/features/Ordering.d.ts +0 -19
  75. package/build/types/features/Pagination.d.ts +0 -44
  76. package/build/types/features/Pinning.d.ts +0 -39
  77. package/build/types/features/RowSelection.d.ts +0 -66
  78. package/build/types/features/Sorting.d.ts +0 -78
  79. package/build/types/features/Visibility.d.ts +0 -47
  80. package/build/types/filterTypes.d.ts +0 -50
  81. package/build/types/sortTypes.d.ts +0 -18
  82. package/build/types/types.d.ts +0 -127
  83. package/build/types/utils/columnFilterRowsFn.d.ts +0 -2
  84. package/build/types/utils/expandRowsFn.d.ts +0 -2
  85. package/build/types/utils/globalFilterRowsFn.d.ts +0 -2
  86. package/build/types/utils/groupRowsFn.d.ts +0 -2
  87. package/build/types/utils/paginateRowsFn.d.ts +0 -2
  88. package/build/types/utils/sortRowsFn.d.ts +0 -2
  89. package/build/types/utils.d.ts +0 -24
  90. package/src/aggregationTypes.ts +0 -115
  91. package/src/core.tsx +0 -1096
  92. package/src/createTable.tsx +0 -244
  93. package/src/features/ColumnSizing.ts +0 -453
  94. package/src/features/Expanding.ts +0 -406
  95. package/src/features/Filters.ts +0 -762
  96. package/src/features/Grouping.ts +0 -466
  97. package/src/features/Headers.ts +0 -912
  98. package/src/features/Ordering.ts +0 -133
  99. package/src/features/Pagination.ts +0 -325
  100. package/src/features/Pinning.ts +0 -198
  101. package/src/features/RowSelection.ts +0 -831
  102. package/src/features/Sorting.ts +0 -547
  103. package/src/features/Visibility.ts +0 -279
  104. package/src/filterTypes.ts +0 -251
  105. package/src/sortTypes.ts +0 -159
  106. package/src/types.ts +0 -331
  107. package/src/utils/columnFilterRowsFn.ts +0 -155
  108. package/src/utils/expandRowsFn.ts +0 -50
  109. package/src/utils/globalFilterRowsFn.ts +0 -122
  110. package/src/utils/groupRowsFn.ts +0 -194
  111. package/src/utils/paginateRowsFn.ts +0 -34
  112. package/src/utils/sortRowsFn.ts +0 -115
  113. package/src/utils.tsx +0 -195
@@ -1,912 +0,0 @@
1
- import {
2
- Cell,
3
- Column,
4
- CoreHeader,
5
- FooterGroupProps,
6
- FooterProps,
7
- Getter,
8
- Header,
9
- HeaderGroup,
10
- HeaderGroupProps,
11
- HeaderProps,
12
- PropGetterValue,
13
- ReactTable,
14
- Row,
15
- } from '../types'
16
- import { propGetter, memo, flexRender } from '../utils'
17
-
18
- import * as ColumnSizing from './ColumnSizing'
19
- import * as Sorting from './Sorting'
20
-
21
- export type HeadersRow<
22
- TData,
23
- TValue,
24
- TFilterFns,
25
- TSortingFns,
26
- TAggregationFns
27
- > = {
28
- _getAllVisibleCells: () => Cell<
29
- TData,
30
- TValue,
31
- TFilterFns,
32
- TSortingFns,
33
- TAggregationFns
34
- >[]
35
- getVisibleCells: () => Cell<
36
- TData,
37
- TValue,
38
- TFilterFns,
39
- TSortingFns,
40
- TAggregationFns
41
- >[]
42
- getLeftVisibleCells: () => Cell<
43
- TData,
44
- TValue,
45
- TFilterFns,
46
- TSortingFns,
47
- TAggregationFns
48
- >[]
49
- getCenterVisibleCells: () => Cell<
50
- TData,
51
- TValue,
52
- TFilterFns,
53
- TSortingFns,
54
- TAggregationFns
55
- >[]
56
- getRightVisibleCells: () => Cell<
57
- TData,
58
- TValue,
59
- TFilterFns,
60
- TSortingFns,
61
- TAggregationFns
62
- >[]
63
- }
64
-
65
- export type HeadersInstance<
66
- TData,
67
- TValue,
68
- TFilterFns,
69
- TSortingFns,
70
- TAggregationFns
71
- > = {
72
- createHeader: (
73
- column: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>,
74
- options: {
75
- id?: string
76
- isPlaceholder?: boolean
77
- placeholderId?: string
78
- depth: number
79
- }
80
- ) => Header<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
81
- getHeaderGroups: () => HeaderGroup<
82
- TData,
83
- TValue,
84
- TFilterFns,
85
- TSortingFns,
86
- TAggregationFns
87
- >[]
88
- getLeftHeaderGroups: () => HeaderGroup<
89
- TData,
90
- TValue,
91
- TFilterFns,
92
- TSortingFns,
93
- TAggregationFns
94
- >[]
95
- getCenterHeaderGroups: () => HeaderGroup<
96
- TData,
97
- TValue,
98
- TFilterFns,
99
- TSortingFns,
100
- TAggregationFns
101
- >[]
102
- getRightHeaderGroups: () => HeaderGroup<
103
- TData,
104
- TValue,
105
- TFilterFns,
106
- TSortingFns,
107
- TAggregationFns
108
- >[]
109
-
110
- getFooterGroups: () => HeaderGroup<
111
- TData,
112
- TValue,
113
- TFilterFns,
114
- TSortingFns,
115
- TAggregationFns
116
- >[]
117
- getCenterFooterGroups: () => HeaderGroup<
118
- TData,
119
- TValue,
120
- TFilterFns,
121
- TSortingFns,
122
- TAggregationFns
123
- >[]
124
- getLeftFooterGroups: () => HeaderGroup<
125
- TData,
126
- TValue,
127
- TFilterFns,
128
- TSortingFns,
129
- TAggregationFns
130
- >[]
131
- getRightFooterGroups: () => HeaderGroup<
132
- TData,
133
- TValue,
134
- TFilterFns,
135
- TSortingFns,
136
- TAggregationFns
137
- >[]
138
-
139
- getFlatHeaders: () => Header<
140
- TData,
141
- TValue,
142
- TFilterFns,
143
- TSortingFns,
144
- TAggregationFns
145
- >[]
146
- getLeftFlatHeaders: () => Header<
147
- TData,
148
- TValue,
149
- TFilterFns,
150
- TSortingFns,
151
- TAggregationFns
152
- >[]
153
- getCenterFlatHeaders: () => Header<
154
- TData,
155
- TValue,
156
- TFilterFns,
157
- TSortingFns,
158
- TAggregationFns
159
- >[]
160
- getRightFlatHeaders: () => Header<
161
- TData,
162
- TValue,
163
- TFilterFns,
164
- TSortingFns,
165
- TAggregationFns
166
- >[]
167
-
168
- getLeafHeaders: () => Header<
169
- TData,
170
- TValue,
171
- TFilterFns,
172
- TSortingFns,
173
- TAggregationFns
174
- >[]
175
- getLeftLeafHeaders: () => Header<
176
- TData,
177
- TValue,
178
- TFilterFns,
179
- TSortingFns,
180
- TAggregationFns
181
- >[]
182
- getCenterLeafHeaders: () => Header<
183
- TData,
184
- TValue,
185
- TFilterFns,
186
- TSortingFns,
187
- TAggregationFns
188
- >[]
189
- getRightLeafHeaders: () => Header<
190
- TData,
191
- TValue,
192
- TFilterFns,
193
- TSortingFns,
194
- TAggregationFns
195
- >[]
196
-
197
- getHeader: (
198
- id: string
199
- ) => Header<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
200
-
201
- getHeaderGroupProps: <TGetter extends Getter<HeaderGroupProps>>(
202
- id: string,
203
- userProps?: TGetter
204
- ) => undefined | PropGetterValue<HeaderGroupProps, TGetter>
205
- getFooterGroupProps: <TGetter extends Getter<FooterGroupProps>>(
206
- id: string,
207
- userProps?: TGetter
208
- ) => undefined | PropGetterValue<FooterGroupProps, TGetter>
209
- getHeaderProps: <TGetter extends Getter<HeaderProps>>(
210
- headerId: string,
211
- userProps?: TGetter
212
- ) => undefined | PropGetterValue<HeaderProps, TGetter>
213
- getFooterProps: <TGetter extends Getter<FooterProps>>(
214
- headerId: string,
215
- userProps?: TGetter
216
- ) => undefined | PropGetterValue<FooterProps, TGetter>
217
- getTotalWidth: () => number
218
- }
219
-
220
- //
221
-
222
- export function createRow<
223
- TData,
224
- TValue,
225
- TFilterFns,
226
- TSortingFns,
227
- TAggregationFns
228
- >(
229
- row: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>,
230
- instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
231
- ): HeadersRow<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> {
232
- return {
233
- _getAllVisibleCells: memo(
234
- () => [
235
- row
236
- .getAllCells()
237
- .filter(cell => cell.column.getIsVisible())
238
- .map(d => d.id)
239
- .join('_'),
240
- ],
241
- _ => {
242
- return row.getAllCells().filter(cell => cell.column.getIsVisible())
243
- },
244
- { key: 'row._getAllVisibleCells', debug: instance.options.debug }
245
- ),
246
- getVisibleCells: memo(
247
- () => [
248
- row.getLeftVisibleCells(),
249
- row.getCenterVisibleCells(),
250
- row.getRightVisibleCells(),
251
- ],
252
- (left, center, right) => [...left, ...center, ...right],
253
- { key: 'row.getVisibleCells', debug: instance.options.debug }
254
- ),
255
- getCenterVisibleCells: memo(
256
- () => [
257
- row._getAllVisibleCells(),
258
- instance.getState().columnPinning.left,
259
- instance.getState().columnPinning.right,
260
- ],
261
- (allCells, left, right) => {
262
- const leftAndRight = [...(left ?? []), ...(right ?? [])]
263
-
264
- return allCells.filter(d => !leftAndRight.includes(d.columnId))
265
- },
266
- { key: 'row.getCenterVisibleCells', debug: instance.options.debug }
267
- ),
268
- getLeftVisibleCells: memo(
269
- () => [
270
- row._getAllVisibleCells(),
271
- instance.getState().columnPinning.left,
272
- ,
273
- ],
274
- (allCells, left) => {
275
- const cells = (left ?? [])
276
- .map(columnId => allCells.find(cell => cell.columnId === columnId)!)
277
- .filter(Boolean)
278
-
279
- return cells
280
- },
281
- { key: 'row.getLeftVisibleCells', debug: instance.options.debug }
282
- ),
283
- getRightVisibleCells: memo(
284
- () => [
285
- row._getAllVisibleCells(),
286
- instance.getState().columnPinning.right,
287
- ],
288
- (allCells, right) => {
289
- const cells = (right ?? [])
290
- .map(columnId => allCells.find(cell => cell.columnId === columnId)!)
291
- .filter(Boolean)
292
-
293
- return cells
294
- },
295
- { key: 'row.getRightVisibleCells', debug: instance.options.debug }
296
- ),
297
- }
298
- }
299
-
300
- export function getInstance<
301
- TData,
302
- TValue,
303
- TFilterFns,
304
- TSortingFns,
305
- TAggregationFns
306
- >(
307
- instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
308
- ): HeadersInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> {
309
- return {
310
- createHeader: (
311
- column: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>,
312
- options: {
313
- id?: string
314
- isPlaceholder?: boolean
315
- placeholderId?: string
316
- depth: number
317
- }
318
- ) => {
319
- const id = options.id ?? column.id
320
-
321
- let header: CoreHeader<
322
- TData,
323
- TValue,
324
- TFilterFns,
325
- TSortingFns,
326
- TAggregationFns
327
- > = {
328
- id,
329
- column,
330
- isPlaceholder: options.isPlaceholder,
331
- placeholderId: options.placeholderId,
332
- depth: options.depth,
333
- subHeaders: [],
334
- colSpan: 0,
335
- rowSpan: 0,
336
- getWidth: () => {
337
- let sum = 0
338
-
339
- const recurse = (
340
- header: CoreHeader<
341
- TData,
342
- TValue,
343
- TFilterFns,
344
- TSortingFns,
345
- TAggregationFns
346
- >
347
- ) => {
348
- if (header.subHeaders.length) {
349
- header.subHeaders.forEach(recurse)
350
- } else {
351
- sum += header.column.getWidth() ?? 0
352
- }
353
- }
354
-
355
- recurse(header)
356
-
357
- return sum
358
- },
359
- getLeafHeaders: (): Header<
360
- TData,
361
- TValue,
362
- TFilterFns,
363
- TSortingFns,
364
- TAggregationFns
365
- >[] => {
366
- const leafHeaders: CoreHeader<
367
- TData,
368
- TValue,
369
- TFilterFns,
370
- TSortingFns,
371
- TAggregationFns
372
- >[] = []
373
-
374
- const recurseHeader = (
375
- h: CoreHeader<
376
- TData,
377
- TValue,
378
- TFilterFns,
379
- TSortingFns,
380
- TAggregationFns
381
- >
382
- ) => {
383
- if (h.subHeaders && h.subHeaders.length) {
384
- h.subHeaders.map(recurseHeader)
385
- }
386
- leafHeaders.push(h)
387
- }
388
-
389
- recurseHeader(header)
390
-
391
- return leafHeaders as Header<
392
- TData,
393
- TValue,
394
- TFilterFns,
395
- TSortingFns,
396
- TAggregationFns
397
- >[]
398
- },
399
- getHeaderProps: userProps =>
400
- instance.getHeaderProps(header.id, userProps)!,
401
- getFooterProps: userProps =>
402
- instance.getFooterProps(header.id, userProps)!,
403
- renderHeader: () =>
404
- flexRender(column.header, { instance, header, column }),
405
- renderFooter: () =>
406
- flexRender(column.footer, { instance, header, column }),
407
- }
408
-
409
- // Yes, we have to convert instance to uknown, because we know more than the compiler here.
410
- return header as Header<
411
- TData,
412
- TValue,
413
- TFilterFns,
414
- TSortingFns,
415
- TAggregationFns
416
- >
417
- },
418
-
419
- // Header Groups
420
-
421
- getHeaderGroups: memo(
422
- () => [
423
- instance.getAllColumns(),
424
- instance.getVisibleLeafColumns(),
425
- instance.getState().columnPinning.left,
426
- instance.getState().columnPinning.right,
427
- ],
428
- (allColumns, leafColumns, left, right) => {
429
- const leftColumns = leafColumns.filter(column =>
430
- left?.includes(column.id)
431
- )
432
- const rightColumns = leafColumns.filter(column =>
433
- right?.includes(column.id)
434
- )
435
- const centerColumns = leafColumns.filter(
436
- column => !left?.includes(column.id) && !right?.includes(column.id)
437
- )
438
- const headerGroups = buildHeaderGroups(
439
- allColumns,
440
- [...leftColumns, ...centerColumns, ...rightColumns],
441
- instance
442
- )
443
-
444
- return headerGroups
445
- },
446
- { key: 'getHeaderGroups', debug: instance.options.debug }
447
- ),
448
-
449
- getCenterHeaderGroups: memo(
450
- () => [
451
- instance.getAllColumns(),
452
- instance.getVisibleLeafColumns(),
453
- instance.getState().columnPinning.left,
454
- instance.getState().columnPinning.right,
455
- ],
456
- (allColumns, leafColumns, left, right) => {
457
- leafColumns = leafColumns.filter(
458
- column => !left?.includes(column.id) && !right?.includes(column.id)
459
- )
460
- return buildHeaderGroups(allColumns, leafColumns, instance, 'center')
461
- },
462
- { key: 'getCenterHeaderGroups', debug: instance.options.debug }
463
- ),
464
-
465
- getLeftHeaderGroups: memo(
466
- () => [
467
- instance.getAllColumns(),
468
- instance.getVisibleLeafColumns(),
469
- instance.getState().columnPinning.left,
470
- ],
471
- (allColumns, leafColumns, left) => {
472
- leafColumns = leafColumns.filter(column => left?.includes(column.id))
473
- return buildHeaderGroups(allColumns, leafColumns, instance, 'left')
474
- },
475
- { key: 'getLeftHeaderGroups', debug: instance.options.debug }
476
- ),
477
-
478
- getRightHeaderGroups: memo(
479
- () => [
480
- instance.getAllColumns(),
481
- instance.getVisibleLeafColumns(),
482
- instance.getState().columnPinning.right,
483
- ],
484
- (allColumns, leafColumns, right) => {
485
- leafColumns = leafColumns.filter(column => right?.includes(column.id))
486
- return buildHeaderGroups(allColumns, leafColumns, instance, 'right')
487
- },
488
- { key: 'getRightHeaderGroups', debug: instance.options.debug }
489
- ),
490
-
491
- // Footer Groups
492
-
493
- getFooterGroups: memo(
494
- () => [instance.getHeaderGroups()],
495
- headerGroups => {
496
- return [...headerGroups].reverse()
497
- },
498
- { key: 'getFooterGroups', debug: instance.options.debug }
499
- ),
500
-
501
- getLeftFooterGroups: memo(
502
- () => [instance.getLeftHeaderGroups()],
503
- headerGroups => {
504
- return [...headerGroups].reverse()
505
- },
506
- { key: 'getLeftFooterGroups', debug: instance.options.debug }
507
- ),
508
-
509
- getCenterFooterGroups: memo(
510
- () => [instance.getCenterHeaderGroups()],
511
- headerGroups => {
512
- return [...headerGroups].reverse()
513
- },
514
- { key: 'getCenterFooterGroups', debug: instance.options.debug }
515
- ),
516
-
517
- getRightFooterGroups: memo(
518
- () => [instance.getRightHeaderGroups()],
519
- headerGroups => {
520
- return [...headerGroups].reverse()
521
- },
522
- { key: 'getRightFooterGroups', debug: instance.options.debug }
523
- ),
524
-
525
- // Flat Headers
526
-
527
- getFlatHeaders: memo(
528
- () => [instance.getHeaderGroups()],
529
- headerGroups => {
530
- return headerGroups
531
- .map(headerGroup => {
532
- return headerGroup.headers
533
- })
534
- .flat()
535
- },
536
- { key: 'getFlatHeaders', debug: instance.options.debug }
537
- ),
538
-
539
- getLeftFlatHeaders: memo(
540
- () => [instance.getLeftHeaderGroups()],
541
- left => {
542
- return left
543
- .map(headerGroup => {
544
- return headerGroup.headers
545
- })
546
- .flat()
547
- },
548
- { key: 'getLeftFlatHeaders', debug: instance.options.debug }
549
- ),
550
-
551
- getCenterFlatHeaders: memo(
552
- () => [instance.getCenterHeaderGroups()],
553
- left => {
554
- return left
555
- .map(headerGroup => {
556
- return headerGroup.headers
557
- })
558
- .flat()
559
- },
560
- { key: 'getCenterFlatHeaders', debug: instance.options.debug }
561
- ),
562
-
563
- getRightFlatHeaders: memo(
564
- () => [instance.getRightHeaderGroups()],
565
- left => {
566
- return left
567
- .map(headerGroup => {
568
- return headerGroup.headers
569
- })
570
- .flat()
571
- },
572
- { key: 'getRightFlatHeaders', debug: instance.options.debug }
573
- ),
574
-
575
- // Leaf Headers
576
-
577
- getCenterLeafHeaders: memo(
578
- () => [instance.getCenterFlatHeaders()],
579
- flatHeaders => {
580
- return flatHeaders.filter(header => !header.subHeaders?.length)
581
- },
582
- { key: 'getCenterLeafHeaders', debug: instance.options.debug }
583
- ),
584
-
585
- getLeftLeafHeaders: memo(
586
- () => [instance.getLeftFlatHeaders()],
587
- flatHeaders => {
588
- return flatHeaders.filter(header => !header.subHeaders?.length)
589
- },
590
- { key: 'getLeftLeafHeaders', debug: instance.options.debug }
591
- ),
592
-
593
- getRightLeafHeaders: memo(
594
- () => [instance.getRightFlatHeaders()],
595
- flatHeaders => {
596
- return flatHeaders.filter(header => !header.subHeaders?.length)
597
- },
598
- { key: 'getRightLeafHeaders', debug: instance.options.debug }
599
- ),
600
-
601
- getLeafHeaders: memo(
602
- () => [
603
- instance.getLeftHeaderGroups(),
604
- instance.getCenterHeaderGroups(),
605
- instance.getRightHeaderGroups(),
606
- ],
607
- (left, center, right) => {
608
- return [
609
- ...(left[0]?.headers ?? []),
610
- ...(center[0]?.headers ?? []),
611
- ...(right[0]?.headers ?? []),
612
- ]
613
- .map(header => {
614
- return header.getLeafHeaders()
615
- })
616
- .flat()
617
- },
618
- { key: 'getLeafHeaders', debug: instance.options.debug }
619
- ),
620
-
621
- getHeader: (id: string) => {
622
- const header = [
623
- ...instance.getFlatHeaders(),
624
- ...instance.getCenterFlatHeaders(),
625
- ...instance.getLeftFlatHeaders(),
626
- ...instance.getRightFlatHeaders(),
627
- ].find(d => d.id === id)
628
-
629
- if (!header) {
630
- if (process.env.NODE_ENV !== 'production') {
631
- console.warn(`Could not find header with id: ${id}`)
632
- }
633
- throw new Error()
634
- }
635
-
636
- return header
637
- },
638
-
639
- getHeaderGroupProps: (id, userProps) => {
640
- const headerGroup = instance.getHeaderGroups().find(d => d.id === id)
641
-
642
- if (!headerGroup) {
643
- return
644
- }
645
-
646
- return propGetter(
647
- {
648
- key: headerGroup.id,
649
- role: 'row',
650
- },
651
- userProps
652
- )
653
- },
654
-
655
- getFooterGroupProps: (id, userProps) => {
656
- const headerGroup = instance.getFooterGroups().find(d => d.id === id)
657
-
658
- if (!headerGroup) {
659
- return
660
- }
661
-
662
- const initialProps = {
663
- key: headerGroup.id,
664
- role: 'row',
665
- }
666
-
667
- return propGetter(initialProps, userProps)
668
- },
669
-
670
- getHeaderProps: (id, userProps) => {
671
- const header = instance.getHeader(id)
672
-
673
- if (!header) {
674
- throw new Error()
675
- }
676
-
677
- const initialProps: HeaderProps = {
678
- key: header.id,
679
- role: 'columnheader',
680
- colSpan: header.colSpan,
681
- rowSpan: header.rowSpan,
682
- }
683
-
684
- return propGetter(initialProps, userProps)
685
- },
686
-
687
- getFooterProps: (id, userProps) => {
688
- const header = instance.getHeader(id)
689
- if (!header) {
690
- return
691
- }
692
-
693
- const initialProps: FooterProps = {
694
- key: header.id,
695
- role: 'columnfooter',
696
- colSpan: header.colSpan,
697
- rowSpan: header.rowSpan,
698
- }
699
-
700
- return propGetter(initialProps, userProps)
701
- },
702
-
703
- getTotalWidth: () => {
704
- let width = 0
705
-
706
- instance.getVisibleLeafColumns().forEach(column => {
707
- width += column.getWidth() ?? 0
708
- })
709
-
710
- return width
711
- },
712
- }
713
- }
714
-
715
- export function buildHeaderGroups<
716
- TData,
717
- TValue,
718
- TFilterFns,
719
- TSortingFns,
720
- TAggregationFns
721
- >(
722
- allColumns: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>[],
723
- columnsToGroup: Column<
724
- TData,
725
- TValue,
726
- TFilterFns,
727
- TSortingFns,
728
- TAggregationFns
729
- >[],
730
- instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>,
731
- headerFamily?: 'center' | 'left' | 'right'
732
- ) {
733
- // Find the max depth of the columns:
734
- // build the leaf column row
735
- // build each buffer row going up
736
- // placeholder for non-existent level
737
- // real column for existing level
738
-
739
- let maxDepth = 0
740
-
741
- const findMaxDepth = (
742
- columns: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>[],
743
- depth = 1
744
- ) => {
745
- maxDepth = Math.max(maxDepth, depth)
746
-
747
- columns
748
- .filter(column => column.getIsVisible())
749
- .forEach(column => {
750
- if (column.columns?.length) {
751
- findMaxDepth(column.columns, depth + 1)
752
- }
753
- }, 0)
754
- }
755
-
756
- findMaxDepth(allColumns)
757
-
758
- let headerGroups: HeaderGroup<
759
- TData,
760
- TValue,
761
- TFilterFns,
762
- TSortingFns,
763
- TAggregationFns
764
- >[] = []
765
-
766
- const createHeaderGroup = (
767
- headersToGroup: Header<
768
- TData,
769
- TValue,
770
- TFilterFns,
771
- TSortingFns,
772
- TAggregationFns
773
- >[],
774
- depth: number
775
- ) => {
776
- // The header group we are creating
777
- const headerGroup: HeaderGroup<
778
- TData,
779
- TValue,
780
- TFilterFns,
781
- TSortingFns,
782
- TAggregationFns
783
- > = {
784
- depth,
785
- id: [headerFamily, `${depth}`].filter(Boolean).join('_'),
786
- headers: [],
787
- getHeaderGroupProps: getterValue =>
788
- instance.getHeaderGroupProps(`${depth}`, getterValue)!,
789
- getFooterGroupProps: getterValue =>
790
- instance.getFooterGroupProps(`${depth}`, getterValue)!,
791
- }
792
-
793
- // The parent columns we're going to scan next
794
- const parentHeaders: Header<
795
- TData,
796
- TValue,
797
- TFilterFns,
798
- TSortingFns,
799
- TAggregationFns
800
- >[] = []
801
-
802
- // Scan each column for parents
803
- headersToGroup.forEach(headerToGroup => {
804
- // What is the latest (last) parent column?
805
-
806
- const latestParentHeader = [...parentHeaders].reverse()[0]
807
-
808
- const isLeafHeader = headerToGroup.column.depth === headerGroup.depth
809
-
810
- let column: Column<
811
- TData,
812
- TValue,
813
- TFilterFns,
814
- TSortingFns,
815
- TAggregationFns
816
- >
817
- let isPlaceholder = false
818
-
819
- if (isLeafHeader && headerToGroup.column.parent) {
820
- // The parent header is new
821
- column = headerToGroup.column.parent
822
- } else {
823
- // The parent header is repeated
824
- column = headerToGroup.column
825
- isPlaceholder = true
826
- }
827
-
828
- const header = instance.createHeader(column, {
829
- id: [headerFamily, depth, column.id, headerToGroup?.id]
830
- .filter(Boolean)
831
- .join('_'),
832
- isPlaceholder,
833
- placeholderId: isPlaceholder
834
- ? `${parentHeaders.filter(d => d.column === column).length}`
835
- : undefined,
836
- depth,
837
- })
838
-
839
- if (!latestParentHeader || latestParentHeader.column !== header.column) {
840
- header.subHeaders.push(headerToGroup)
841
- parentHeaders.push(header)
842
- } else {
843
- latestParentHeader.subHeaders.push(headerToGroup)
844
- }
845
-
846
- // if (!headerToGroup.isPlaceholder) {
847
- // headerToGroup.column.header = headerToGroup;
848
- // }
849
-
850
- headerGroup.headers.push(headerToGroup)
851
- })
852
-
853
- headerGroups.push(headerGroup)
854
-
855
- if (depth > 0) {
856
- createHeaderGroup(parentHeaders, depth - 1)
857
- }
858
- }
859
-
860
- const bottomHeaders = columnsToGroup.map(column =>
861
- instance.createHeader(column, {
862
- depth: maxDepth,
863
- })
864
- )
865
-
866
- createHeaderGroup(bottomHeaders, maxDepth - 1)
867
-
868
- headerGroups.reverse()
869
-
870
- // headerGroups = headerGroups.filter(headerGroup => {
871
- // return !headerGroup.headers.every(header => header.isPlaceholder)
872
- // })
873
-
874
- const recurseHeadersForSpans = (
875
- headers: Header<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>[]
876
- ) => {
877
- const filteredHeaders = headers.filter(header =>
878
- header.column.getIsVisible()
879
- )
880
-
881
- return filteredHeaders.map(header => {
882
- let colSpan = 0
883
- let rowSpan = 0
884
- let childRowSpans = [0]
885
-
886
- if (header.subHeaders && header.subHeaders.length) {
887
- childRowSpans = []
888
-
889
- recurseHeadersForSpans(header.subHeaders).forEach(
890
- ({ colSpan: childColSpan, rowSpan: childRowSpan }) => {
891
- colSpan += childColSpan
892
- childRowSpans.push(childRowSpan)
893
- }
894
- )
895
- } else {
896
- colSpan = 1
897
- }
898
-
899
- const minChildRowSpan = Math.min(...childRowSpans)
900
- rowSpan = rowSpan + minChildRowSpan
901
-
902
- header.colSpan = colSpan > 0 ? colSpan : undefined
903
- header.rowSpan = rowSpan > 0 ? rowSpan : undefined
904
-
905
- return { colSpan, rowSpan }
906
- })
907
- }
908
-
909
- recurseHeadersForSpans(headerGroups[0]?.headers ?? [])
910
-
911
- return headerGroups
912
- }