@redis-ui/table 2.4.0 → 2.18.0

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 (154) hide show
  1. package/dist/Table/Table.cjs +85 -136
  2. package/dist/Table/Table.context.cjs +16 -1
  3. package/dist/Table/Table.context.d.ts +22 -4
  4. package/dist/Table/Table.context.js +16 -1
  5. package/dist/Table/Table.d.ts +83 -3
  6. package/dist/Table/Table.js +86 -137
  7. package/dist/Table/Table.style.cjs +33 -17
  8. package/dist/Table/Table.style.d.ts +5 -2
  9. package/dist/Table/Table.style.js +34 -18
  10. package/dist/Table/Table.types.d.ts +21 -22
  11. package/dist/Table/components/Compose/Compose.cjs +42 -0
  12. package/dist/Table/components/Compose/Compose.d.ts +13 -0
  13. package/dist/Table/components/Compose/Compose.js +42 -0
  14. package/dist/Table/components/EmptyState/EmptyState.cjs +31 -0
  15. package/dist/Table/components/EmptyState/EmptyState.d.ts +6 -0
  16. package/dist/Table/components/EmptyState/EmptyState.js +31 -0
  17. package/dist/Table/components/ExpandRowButton/ExpandRowButton.cjs +1 -0
  18. package/dist/Table/components/ExpandRowButton/ExpandRowButton.js +1 -0
  19. package/dist/Table/components/HiddenCaption/HiddenCaption.cjs +13 -0
  20. package/dist/Table/components/HiddenCaption/HiddenCaption.d.ts +3 -0
  21. package/dist/Table/components/HiddenCaption/HiddenCaption.js +13 -0
  22. package/dist/Table/components/PluggableTable/PluggableTable.cjs +19 -0
  23. package/dist/Table/components/PluggableTable/PluggableTable.d.ts +10 -0
  24. package/dist/Table/components/PluggableTable/PluggableTable.js +19 -0
  25. package/dist/Table/components/PluggableTable/compositionComponents.cjs +21 -0
  26. package/dist/Table/components/PluggableTable/compositionComponents.d.ts +67 -0
  27. package/dist/Table/components/PluggableTable/compositionComponents.js +21 -0
  28. package/dist/Table/components/RowSelection/HeaderMultiRowSelectionButton.cjs +29 -0
  29. package/dist/Table/components/RowSelection/HeaderMultiRowSelectionButton.d.ts +7 -0
  30. package/dist/Table/components/RowSelection/HeaderMultiRowSelectionButton.js +29 -0
  31. package/dist/Table/components/RowSelection/HeaderMultiRowSelectionButton.test.d.ts +1 -0
  32. package/dist/Table/components/RowSelection/RowSelectionButton.cjs +15 -0
  33. package/dist/Table/components/RowSelection/RowSelectionButton.d.ts +6 -0
  34. package/dist/Table/components/RowSelection/RowSelectionButton.js +15 -0
  35. package/dist/Table/components/RowSelection/RowSelectionButton.test.d.ts +1 -0
  36. package/dist/Table/components/TableBody/TableBody.cjs +33 -0
  37. package/dist/Table/components/TableBody/TableBody.d.ts +23 -0
  38. package/dist/Table/components/TableBody/TableBody.js +33 -0
  39. package/dist/Table/components/TableBody/components/Compose/Compose.cjs +10 -0
  40. package/dist/Table/components/TableBody/components/Compose/Compose.d.ts +3 -0
  41. package/dist/Table/components/TableBody/components/Compose/Compose.js +10 -0
  42. package/dist/Table/components/TableBodyCell/TableBodyCell.cjs +22 -0
  43. package/dist/Table/components/TableBodyCell/TableBodyCell.d.ts +12 -0
  44. package/dist/Table/components/TableBodyCell/TableBodyCell.js +22 -0
  45. package/dist/Table/components/TableBodyCell/components/Compose/Compose.cjs +5 -0
  46. package/dist/Table/components/TableBodyCell/components/Compose/Compose.d.ts +3 -0
  47. package/dist/Table/components/TableBodyCell/components/Compose/Compose.js +5 -0
  48. package/dist/Table/components/TableBodyRow/TableBodyRow.cjs +38 -0
  49. package/dist/Table/components/TableBodyRow/TableBodyRow.d.ts +20 -0
  50. package/dist/Table/components/TableBodyRow/TableBodyRow.js +38 -0
  51. package/dist/Table/components/TableBodyRow/TableBodyRowExpandable.cjs +33 -0
  52. package/dist/Table/components/TableBodyRow/TableBodyRowExpandable.d.ts +2 -0
  53. package/dist/Table/components/TableBodyRow/TableBodyRowExpandable.js +33 -0
  54. package/dist/Table/components/TableBodyRow/components/Compose/Compose.cjs +17 -0
  55. package/dist/Table/components/TableBodyRow/components/Compose/Compose.d.ts +4 -0
  56. package/dist/Table/components/TableBodyRow/components/Compose/Compose.js +17 -0
  57. package/dist/Table/components/TableExpandedRow/TableAnimatedExpandedRow.cjs +3 -4
  58. package/dist/Table/components/TableExpandedRow/TableAnimatedExpandedRow.d.ts +1 -1
  59. package/dist/Table/components/TableExpandedRow/TableAnimatedExpandedRow.js +3 -4
  60. package/dist/Table/components/TableExpandedRow/TableAnimatedExpandedRow.style.cjs +1 -1
  61. package/dist/Table/components/TableExpandedRow/TableAnimatedExpandedRow.style.js +1 -1
  62. package/dist/Table/components/TableExpandedRow/TableExpandedRow.cjs +9 -4
  63. package/dist/Table/components/TableExpandedRow/TableExpandedRow.d.ts +1 -1
  64. package/dist/Table/components/TableExpandedRow/TableExpandedRow.js +9 -4
  65. package/dist/Table/components/TableExpandedRow/TableExpandedRow.style.cjs +2 -2
  66. package/dist/Table/components/TableExpandedRow/TableExpandedRow.style.js +2 -2
  67. package/dist/Table/components/TableExpandedRow/TableExpandedRow.types.d.ts +3 -5
  68. package/dist/Table/components/TableHeader/TableHeader.cjs +28 -0
  69. package/dist/Table/components/TableHeader/TableHeader.d.ts +21 -0
  70. package/dist/Table/components/TableHeader/TableHeader.js +28 -0
  71. package/dist/Table/components/TableHeader/components/Compose/Compose.cjs +5 -0
  72. package/dist/Table/components/TableHeader/components/Compose/Compose.d.ts +3 -0
  73. package/dist/Table/components/TableHeader/components/Compose/Compose.js +5 -0
  74. package/dist/Table/components/TableHeaderCell/SRSortingNotification.cjs +19 -0
  75. package/dist/Table/components/TableHeaderCell/SRSortingNotification.d.ts +1 -0
  76. package/dist/Table/components/TableHeaderCell/SRSortingNotification.js +19 -0
  77. package/dist/Table/components/TableHeaderCell/TableHeaderCell.cjs +23 -0
  78. package/dist/Table/components/TableHeaderCell/TableHeaderCell.context.cjs +15 -0
  79. package/dist/Table/components/TableHeaderCell/TableHeaderCell.context.d.ts +8 -0
  80. package/dist/Table/components/TableHeaderCell/TableHeaderCell.context.js +15 -0
  81. package/dist/Table/components/TableHeaderCell/TableHeaderCell.d.ts +16 -0
  82. package/dist/Table/components/TableHeaderCell/TableHeaderCell.js +23 -0
  83. package/dist/Table/components/TableHeaderCell/TableHeaderCell.test.d.ts +1 -0
  84. package/dist/Table/components/TableHeaderCell/TableHeaderCell.types.d.ts +13 -0
  85. package/dist/Table/components/TableHeaderCell/TableHeaderCell.utils.cjs +79 -0
  86. package/dist/Table/components/TableHeaderCell/TableHeaderCell.utils.d.ts +10 -0
  87. package/dist/Table/components/TableHeaderCell/TableHeaderCell.utils.js +79 -0
  88. package/dist/Table/components/TableHeaderCell/components/Compose/Compose.cjs +40 -0
  89. package/dist/Table/components/TableHeaderCell/components/Compose/Compose.d.ts +9 -0
  90. package/dist/Table/components/TableHeaderCell/components/Compose/Compose.js +40 -0
  91. package/dist/Table/components/TableHeaderCell/components/Heading/Heading.cjs +34 -0
  92. package/dist/Table/components/TableHeaderCell/components/Heading/Heading.d.ts +5 -0
  93. package/dist/Table/components/TableHeaderCell/components/Heading/Heading.js +34 -0
  94. package/dist/Table/components/TableHeaderCell/components/SortableHeading/SortableHeading.cjs +16 -0
  95. package/dist/Table/components/TableHeaderCell/components/SortableHeading/SortableHeading.d.ts +8 -0
  96. package/dist/Table/components/TableHeaderCell/components/SortableHeading/SortableHeading.js +16 -0
  97. package/dist/Table/components/TableHeaderCell/components/SortableHeading/components/Compose/Compose.cjs +23 -0
  98. package/dist/Table/components/TableHeaderCell/components/SortableHeading/components/Compose/Compose.d.ts +5 -0
  99. package/dist/Table/components/TableHeaderCell/components/SortableHeading/components/Compose/Compose.js +23 -0
  100. package/dist/Table/components/TableHeaderCell/components/SortableHeading/components/SortIndicator/SortIndicator.cjs +6 -0
  101. package/dist/Table/components/TableHeaderCell/components/SortableHeading/components/SortIndicator/SortIndicator.d.ts +2 -0
  102. package/dist/Table/components/TableHeaderCell/components/SortableHeading/components/SortIndicator/SortIndicator.js +6 -0
  103. package/dist/Table/components/TableHeaderRow/TableHeaderRow.cjs +27 -0
  104. package/dist/Table/components/TableHeaderRow/TableHeaderRow.d.ts +12 -0
  105. package/dist/Table/components/TableHeaderRow/TableHeaderRow.js +27 -0
  106. package/dist/Table/components/TableHeaderRow/components/Compose/Compose.cjs +5 -0
  107. package/dist/Table/components/TableHeaderRow/components/Compose/Compose.d.ts +3 -0
  108. package/dist/Table/components/TableHeaderRow/components/Compose/Compose.js +5 -0
  109. package/dist/Table/components/TablePagination/TablePagination.cjs +63 -78
  110. package/dist/Table/components/TablePagination/TablePagination.d.ts +23 -3
  111. package/dist/Table/components/TablePagination/TablePagination.js +64 -79
  112. package/dist/Table/components/TablePagination/TablePagination.style.cjs +78 -53
  113. package/dist/Table/components/TablePagination/TablePagination.style.d.ts +17 -49
  114. package/dist/Table/components/TablePagination/TablePagination.style.js +80 -55
  115. package/dist/Table/components/TablePagination/components/Compose/Compose.cjs +41 -0
  116. package/dist/Table/components/TablePagination/components/Compose/Compose.d.ts +3 -0
  117. package/dist/Table/components/TablePagination/components/Compose/Compose.js +41 -0
  118. package/dist/Table/components/TableRoot/TableRoot.cjs +5 -0
  119. package/dist/Table/components/TableRoot/TableRoot.d.ts +1 -0
  120. package/dist/Table/components/TableRoot/TableRoot.js +5 -0
  121. package/dist/Table/index.d.ts +3 -6
  122. package/dist/Table/plugins/ClickableRowPlugin.cjs +48 -0
  123. package/dist/Table/plugins/ClickableRowPlugin.d.ts +25 -0
  124. package/dist/Table/plugins/ClickableRowPlugin.js +48 -0
  125. package/dist/Table/plugins/ExpandableRowPlugin.cjs +38 -0
  126. package/dist/Table/plugins/ExpandableRowPlugin.d.ts +22 -0
  127. package/dist/Table/plugins/ExpandableRowPlugin.js +38 -0
  128. package/dist/Table/plugins/PaginationPlugin.cjs +45 -0
  129. package/dist/Table/plugins/PaginationPlugin.d.ts +16 -0
  130. package/dist/Table/plugins/PaginationPlugin.js +45 -0
  131. package/dist/Table/plugins/RowSelectionPlugin.cjs +28 -0
  132. package/dist/Table/plugins/RowSelectionPlugin.d.ts +12 -0
  133. package/dist/Table/plugins/RowSelectionPlugin.js +28 -0
  134. package/dist/Table/plugins/SortingPlugin.cjs +44 -0
  135. package/dist/Table/plugins/SortingPlugin.d.ts +18 -0
  136. package/dist/Table/plugins/SortingPlugin.js +44 -0
  137. package/dist/Table/tanStackExtendedTypes.d.ts +11 -0
  138. package/dist/Table/utils/plugin.utils.cjs +49 -0
  139. package/dist/Table/utils/plugin.utils.d.ts +17 -0
  140. package/dist/Table/utils/plugin.utils.js +49 -0
  141. package/dist/Table/utils/plugin.utils.test.d.ts +1 -0
  142. package/dist/index.cjs +60 -0
  143. package/dist/index.js +61 -1
  144. package/dist/node_modules/@radix-ui/react-primitive/dist/index.cjs +55 -0
  145. package/dist/node_modules/@radix-ui/react-primitive/dist/index.js +37 -0
  146. package/dist/node_modules/@radix-ui/react-slot/dist/index.cjs +100 -0
  147. package/dist/node_modules/@radix-ui/react-slot/dist/index.js +82 -0
  148. package/dist/node_modules/@radix-ui/react-visually-hidden/dist/index.cjs +51 -0
  149. package/dist/node_modules/@radix-ui/react-visually-hidden/dist/index.js +33 -0
  150. package/dist/node_modules/@tanstack/react-table/build/lib/index.cjs +7 -0
  151. package/dist/node_modules/@tanstack/react-table/build/lib/index.js +8 -1
  152. package/dist/node_modules/@tanstack/table-core/build/lib/index.cjs +361 -4
  153. package/dist/node_modules/@tanstack/table-core/build/lib/index.js +361 -4
  154. package/package.json +7 -5
@@ -1,173 +1,122 @@
1
1
  "use strict";
2
2
  Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
3
3
  const jsxRuntime = require("../node_modules/react/jsx-runtime.cjs");
4
- const React = require("react");
5
- const index$1 = require("../node_modules/@tanstack/react-table/build/lib/index.cjs");
6
- const redisUiIcons = require("@redislabsdev/redis-ui-icons");
7
- const index = require("../node_modules/@radix-ui/react-use-controllable-state/dist/index.cjs");
8
- const TablePagination = require("./components/TablePagination/TablePagination.cjs");
9
4
  const ExpandRowButton = require("./components/ExpandRowButton/ExpandRowButton.cjs");
10
5
  const TableExpandedRow = require("./components/TableExpandedRow/TableExpandedRow.cjs");
11
6
  const TableAnimatedExpandedRow = require("./components/TableExpandedRow/TableAnimatedExpandedRow.cjs");
7
+ const RowSelectionButton = require("./components/RowSelection/RowSelectionButton.cjs");
8
+ const HeaderMultiRowSelectionButton = require("./components/RowSelection/HeaderMultiRowSelectionButton.cjs");
9
+ const RowSelectionPlugin = require("./plugins/RowSelectionPlugin.cjs");
10
+ const ExpandableRowPlugin = require("./plugins/ExpandableRowPlugin.cjs");
11
+ const PaginationPlugin = require("./plugins/PaginationPlugin.cjs");
12
+ const SortingPlugin = require("./plugins/SortingPlugin.cjs");
13
+ const ClickableRowPlugin = require("./plugins/ClickableRowPlugin.cjs");
12
14
  const Table_context = require("./Table.context.cjs");
13
- const Table_style = require("./Table.style.cjs");
14
- const index$2 = require("../node_modules/@tanstack/table-core/build/lib/index.cjs");
15
- const getTrue = () => true;
16
- const DEFAULT_PAGINATION = {
17
- pageIndex: 0,
18
- pageSize: 10
19
- };
15
+ const PluggableTable = require("./components/PluggableTable/PluggableTable.cjs");
16
+ const compositionComponents = require("./components/PluggableTable/compositionComponents.cjs");
20
17
  const Table = Object.assign(({
21
18
  columns,
19
+ caption,
22
20
  onRowClick,
23
21
  data,
24
- defaultSorting,
22
+ getRowId,
25
23
  emptyState,
26
24
  maxHeight,
27
25
  stripedRows = false,
26
+ // sorting
27
+ enableSorting,
28
+ defaultSorting,
28
29
  onSortingChange,
29
30
  sorting,
30
- manualSorting = false,
31
+ manualSorting,
32
+ // row expansion
31
33
  getIsRowExpandable,
32
34
  renderExpandedRow,
33
35
  expandRowOnClick,
34
- expandedRowComponent: ExpandedRow = TableExpandedRow.TableExpandedRow,
36
+ expandedRowComponent,
37
+ // pagination
35
38
  pagination,
36
39
  defaultPagination,
37
40
  onPaginationChange,
38
41
  manualPagination,
39
42
  totalRowCount,
40
43
  pageSizes,
41
- paginationEnabled = (pagination || defaultPagination || onPaginationChange || pageSizes) !== void 0 || manualPagination !== void 0
44
+ paginationEnabled,
45
+ // row selection
46
+ rowSelection,
47
+ defaultRowSelection,
48
+ onRowSelectionChange,
49
+ rowSelectionMode,
50
+ getRowCanSelect
42
51
  }) => {
43
- const [sortingState, setSortingState] = index.useControllableState({
44
- prop: sorting,
45
- defaultProp: defaultSorting,
46
- onChange: onSortingChange
52
+ const clickableRowPluginData = ClickableRowPlugin.useClickableRowPlugin({
53
+ onRowClick: onRowClick && ((row) => onRowClick(row.original)),
54
+ shouldClickOnEnter: true
47
55
  });
48
- const [paginationState, setPaginationState] = index.useControllableState({
49
- prop: pagination,
50
- defaultProp: defaultPagination ?? DEFAULT_PAGINATION,
51
- onChange: onPaginationChange
56
+ const sortingPluginData = SortingPlugin.useSortingPlugin({
57
+ enableSorting,
58
+ defaultSorting,
59
+ onSortingChange,
60
+ sorting,
61
+ manualSorting
52
62
  });
53
- const isExpandable = !!renderExpandedRow;
54
- const paginationSettings = {
55
- getPaginationRowModel: index$2.getPaginationRowModel(),
56
- onPaginationChange: setPaginationState,
63
+ const paginationPluginData = PaginationPlugin.usePaginationPlugin({
64
+ pagination,
65
+ defaultPagination,
66
+ onPaginationChange,
57
67
  manualPagination,
58
- rowCount: totalRowCount,
59
- autoResetPageIndex: false
60
- };
61
- const table = index$1.useReactTable({
62
- data,
63
- columns,
64
- getCoreRowModel: index$2.getCoreRowModel(),
65
- getSortedRowModel: index$2.getSortedRowModel(),
66
- state: {
67
- sorting: sortingState,
68
- ...paginationEnabled && {
69
- pagination: paginationState
70
- }
71
- },
72
- manualSorting,
73
- onSortingChange: setSortingState,
74
- getExpandedRowModel: isExpandable ? index$2.getExpandedRowModel() : void 0,
75
- getRowCanExpand: isExpandable ? getIsRowExpandable && ((row) => getIsRowExpandable(row.original)) || getTrue : void 0,
76
- ...paginationEnabled && paginationSettings
68
+ totalRowCount,
69
+ pageSizes,
70
+ paginationEnabled
77
71
  });
78
- const {
79
- pageIndex
80
- } = table.getState().pagination;
81
- const maxPageIndex = Math.max(table.getPageCount(), 1) - 1;
82
- React.useEffect(() => {
83
- if (paginationEnabled) table.setPageIndex(Math.min(pageIndex, maxPageIndex));
84
- }, [maxPageIndex, pageIndex, table, paginationEnabled]);
85
- const {
86
- rows
87
- } = table.getRowModel();
88
- return jsxRuntime.jsxRuntimeExports.jsx(Table_context.TableContext.Provider, {
89
- value: {
90
- table
72
+ const expandableRowPluginData = ExpandableRowPlugin.useExpandableRowPlugin({
73
+ expandRowOnClick,
74
+ getRowCanExpand: getIsRowExpandable && ((row) => getIsRowExpandable(row.original)),
75
+ renderExpandedRow,
76
+ expandedRowComponent
77
+ });
78
+ const rowSelectionPluginData = RowSelectionPlugin.useRowSelectionPlugin({
79
+ rowSelection,
80
+ defaultRowSelection,
81
+ onRowSelectionChange,
82
+ rowSelectionMode,
83
+ getRowCanSelect
84
+ });
85
+ return jsxRuntime.jsxRuntimeExports.jsx(Table.PluggableTable, {
86
+ ...{
87
+ data,
88
+ columns,
89
+ maxHeight,
90
+ stripedRows,
91
+ caption,
92
+ emptyStateRender: emptyState
93
+ },
94
+ tableOptions: {
95
+ getRowId
91
96
  },
92
- children: jsxRuntime.jsxRuntimeExports.jsxs(Table_style.TableContainer, {
93
- children: [jsxRuntime.jsxRuntimeExports.jsxs(Table_style.Table, {
94
- children: [jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableHead, {
95
- children: table.getHeaderGroups().map((headerGroup) => jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableHeaderRow, {
96
- children: headerGroup.headers.map((header) => jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableTh, {
97
- onClick: header.column.getToggleSortingHandler(),
98
- style: {
99
- width: header.column.getSize()
100
- },
101
- children: jsxRuntime.jsxRuntimeExports.jsxs(Table_style.HeaderCellInnerWrapper, {
102
- size: "XS",
103
- children: [header.isPlaceholder ? null : index$1.flexRender(header.column.columnDef.header, header.getContext()), {
104
- asc: jsxRuntime.jsxRuntimeExports.jsx(redisUiIcons.ArrowUpIcon, {
105
- size: "S",
106
- color: "neutral700"
107
- }),
108
- desc: jsxRuntime.jsxRuntimeExports.jsx(redisUiIcons.ArrowDownIcon, {
109
- size: "S",
110
- color: "neutral700"
111
- })
112
- }[header.column.getIsSorted()] ?? null]
113
- })
114
- }, header.id))
115
- }, headerGroup.id))
116
- }), jsxRuntime.jsxRuntimeExports.jsxs(Table_style.TableBody, {
117
- maxHeight,
118
- children: [!rows.length ? jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableBodyRow, {
119
- "$stripedRows": false,
120
- children: jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableBodyCell, {
121
- colSpan: columns.length,
122
- children: emptyState ? emptyState() : "No data to display"
123
- })
124
- }) : null, rows.map((row) => {
125
- const isRowExpandable = isExpandable && row.getCanExpand();
126
- const isRowExpanded = isRowExpandable && row.getIsExpanded();
127
- const handleClick = () => {
128
- isRowExpandable && expandRowOnClick && row.toggleExpanded();
129
- onRowClick == null ? void 0 : onRowClick(row.original);
130
- };
131
- return jsxRuntime.jsxRuntimeExports.jsxs(React.Fragment, {
132
- children: [jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableBodyRow, {
133
- tabIndex: 0,
134
- "data-row-type": "regular",
135
- ...isRowExpandable ? {
136
- "aria-expanded": isRowExpanded
137
- } : null,
138
- "$stripedRows": stripedRows,
139
- "$hasOnClick": !!onRowClick || isRowExpandable,
140
- onClick: handleClick,
141
- onKeyDown: (event) => {
142
- if (event.key === "Enter" && event.target === event.currentTarget) {
143
- handleClick();
144
- }
145
- },
146
- children: row.getVisibleCells().map((cell) => jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableBodyCell, {
147
- style: {
148
- width: cell.column.getSize()
149
- },
150
- children: index$1.flexRender(cell.column.columnDef.cell, cell.getContext())
151
- }, cell.id))
152
- }), isRowExpandable && // 2nd row is a custom 1 cell row for expanded part
153
- jsxRuntime.jsxRuntimeExports.jsx(ExpandedRow, {
154
- "data-row-type": "expanded",
155
- "data-expanded": isRowExpanded,
156
- expanded: isRowExpanded,
157
- row,
158
- renderExpandedRow
159
- })]
160
- }, row.id);
161
- })]
162
- })]
163
- }), jsxRuntime.jsxRuntimeExports.jsx(TablePagination.default, {
164
- pageSizes
165
- })]
166
- })
97
+ pluginsData: [clickableRowPluginData, sortingPluginData, paginationPluginData, expandableRowPluginData, rowSelectionPluginData]
167
98
  });
168
99
  }, {
169
100
  ExpandRowButton: ExpandRowButton.ExpandRowButton,
170
101
  ExpandedRow: TableExpandedRow.TableExpandedRow,
171
- AnimatedExpandedRow: TableAnimatedExpandedRow.TableAnimatedExpandedRow
102
+ AnimatedExpandedRow: TableAnimatedExpandedRow.TableAnimatedExpandedRow,
103
+ RowSelectionButton: RowSelectionButton.RowSelectionButton,
104
+ HeaderMultiRowSelectionButton: HeaderMultiRowSelectionButton.HeaderMultiRowSelectionButton,
105
+ // plugins
106
+ useClickableRowPlugin: ClickableRowPlugin.useClickableRowPlugin,
107
+ useSortingPlugin: SortingPlugin.useSortingPlugin,
108
+ usePaginationPlugin: PaginationPlugin.usePaginationPlugin,
109
+ useExpandableRowPlugin: ExpandableRowPlugin.useExpandableRowPlugin,
110
+ useRowSelectionPlugin: RowSelectionPlugin.useRowSelectionPlugin,
111
+ // contexts
112
+ useTableContext: Table_context.useTableContext,
113
+ useComposeContext: Table_context.useComposeContext,
114
+ useClickableRowContext: ClickableRowPlugin.useClickableRowContext,
115
+ useExpandableRowContext: ExpandableRowPlugin.useExpandableRowContext,
116
+ usePaginationContext: PaginationPlugin.usePaginationContext,
117
+ useSortingContext: SortingPlugin.useSortingContext,
118
+ // composition components
119
+ PluggableTable: PluggableTable.PluggableTable,
120
+ ...compositionComponents.compositionComponents
172
121
  });
173
122
  exports.default = Table;
@@ -2,6 +2,7 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const React = require("react");
4
4
  const TableContext = React.createContext(null);
5
+ const TableContextProvider = TableContext.Provider;
5
6
  const useTableContext = () => {
6
7
  const tableContext = React.useContext(TableContext);
7
8
  if (!tableContext) {
@@ -9,5 +10,19 @@ const useTableContext = () => {
9
10
  }
10
11
  return tableContext;
11
12
  };
12
- exports.TableContext = TableContext;
13
+ const usePluginContext = (pluginScope) => {
14
+ var _a;
15
+ return (_a = useTableContext().plugins) == null ? void 0 : _a[pluginScope];
16
+ };
17
+ const useComposeContext = (defaults) => {
18
+ const context = useTableContext();
19
+ const entries = Object.keys(defaults).map((key) => {
20
+ var _a;
21
+ return [key, ((_a = context.components) == null ? void 0 : _a[key]) || defaults[key]];
22
+ });
23
+ return Object.fromEntries(entries);
24
+ };
25
+ exports.TableContextProvider = TableContextProvider;
26
+ exports.useComposeContext = useComposeContext;
27
+ exports.usePluginContext = usePluginContext;
13
28
  exports.useTableContext = useTableContext;
@@ -1,7 +1,25 @@
1
- /// <reference types="react" />
1
+ import { ComponentProps, ComponentType } from 'react';
2
2
  import { Table } from '@tanstack/react-table';
3
- export type TableContextProps<T extends object> = {
3
+ import type { TableHeaderRow } from './components/TableHeaderRow/TableHeaderRow';
4
+ import type { TableHeaderCell } from './components/TableHeaderCell/TableHeaderCell';
5
+ import type { TableBodyRow } from './components/TableBodyRow/TableBodyRow';
6
+ import type { TableBodyCell } from './components/TableBodyCell/TableBodyCell';
7
+ export type CompositionContextProps<T extends object> = {
8
+ TableHeaderRow: ComponentType<ComponentProps<typeof TableHeaderRow<T>>>;
9
+ TableHeaderCell: ComponentType<ComponentProps<typeof TableHeaderCell<T>>>;
10
+ TableBodyRow: ComponentType<ComponentProps<typeof TableBodyRow<T>>>;
11
+ TableBodyCell: ComponentType<ComponentProps<typeof TableBodyCell<T>>>;
12
+ };
13
+ export type TableMainContextProps = {
14
+ stripedRows?: boolean;
15
+ maxHeight?: string;
16
+ };
17
+ export type TableContextProps<T extends object> = TableMainContextProps & {
4
18
  table: Table<T>;
19
+ plugins?: Record<string, unknown>;
20
+ components?: Partial<CompositionContextProps<T>>;
5
21
  };
6
- export declare const TableContext: import("react").Context<TableContextProps<any> | null>;
7
- export declare const useTableContext: () => TableContextProps<any>;
22
+ export declare const TableContextProvider: import("react").Provider<TableContextProps<any> | null>;
23
+ export declare const useTableContext: <T extends object = object>() => TableContextProps<T>;
24
+ export declare const usePluginContext: <T>(pluginScope: string) => T | undefined;
25
+ export declare const useComposeContext: <T extends object, C extends CompositionContextProps<T> = CompositionContextProps<T>>(defaults: Partial<C>) => C;
@@ -1,5 +1,6 @@
1
1
  import { createContext, useContext } from "react";
2
2
  const TableContext = createContext(null);
3
+ const TableContextProvider = TableContext.Provider;
3
4
  const useTableContext = () => {
4
5
  const tableContext = useContext(TableContext);
5
6
  if (!tableContext) {
@@ -7,7 +8,21 @@ const useTableContext = () => {
7
8
  }
8
9
  return tableContext;
9
10
  };
11
+ const usePluginContext = (pluginScope) => {
12
+ var _a;
13
+ return (_a = useTableContext().plugins) == null ? void 0 : _a[pluginScope];
14
+ };
15
+ const useComposeContext = (defaults) => {
16
+ const context = useTableContext();
17
+ const entries = Object.keys(defaults).map((key) => {
18
+ var _a;
19
+ return [key, ((_a = context.components) == null ? void 0 : _a[key]) || defaults[key]];
20
+ });
21
+ return Object.fromEntries(entries);
22
+ };
10
23
  export {
11
- TableContext,
24
+ TableContextProvider,
25
+ useComposeContext,
26
+ usePluginContext,
12
27
  useTableContext
13
28
  };
@@ -1,7 +1,87 @@
1
+ /// <reference types="react" />
2
+ import './tanStackExtendedTypes';
3
+ import type { Row } from '@tanstack/react-table';
1
4
  import { TableProps } from './Table.types';
2
- declare const Table: (<T extends object>({ columns, onRowClick, data, defaultSorting, emptyState, maxHeight, stripedRows, onSortingChange, sorting, manualSorting, getIsRowExpandable, renderExpandedRow, expandRowOnClick, expandedRowComponent: ExpandedRow, pagination, defaultPagination, onPaginationChange, manualPagination, totalRowCount, pageSizes, paginationEnabled }: TableProps<T>) => import("react/jsx-runtime").JSX.Element) & {
5
+ declare const Table: (<T extends object>({ columns, caption, onRowClick, data, getRowId, emptyState, maxHeight, stripedRows, enableSorting, defaultSorting, onSortingChange, sorting, manualSorting, getIsRowExpandable, renderExpandedRow, expandRowOnClick, expandedRowComponent, pagination, defaultPagination, onPaginationChange, manualPagination, totalRowCount, pageSizes, paginationEnabled, rowSelection, defaultRowSelection, onRowSelectionChange, rowSelectionMode, getRowCanSelect }: TableProps<T>) => import("react/jsx-runtime").JSX.Element) & {
6
+ Compose: <T_1 extends object>({ data, columns, pluginsData, tableOptions, components, maxHeight, stripedRows, ...restProps }: import("./components/Compose/Compose").TableComposeProps<T_1>) => import("react/jsx-runtime").JSX.Element;
7
+ Root: import("styled-components").StyledComponent<"table", any, {}, never>;
8
+ SRCaption: ({ caption }: {
9
+ caption?: string | undefined;
10
+ }) => import("react/jsx-runtime").JSX.Element | null;
11
+ Header: (<T_2 extends object>(props: import("./components/TableHeader/TableHeader").RestTableHeaderProps) => import("react/jsx-runtime").JSX.Element) & {
12
+ Compose: import("styled-components").StyledComponent<"thead", any, {}, never>;
13
+ Row: (<T_3 extends object>(props: import("./components/TableHeaderRow/TableHeaderRow").OwnTableHeaderRowProps<T_3> & import("./components/TableHeaderRow/TableHeaderRow").RestTableHeaderRowProps & import("react").RefAttributes<HTMLTableRowElement>) => import("react").ReactElement<any, any> | null) & {
14
+ Compose: import("styled-components").StyledComponent<"tr", any, {}, never>;
15
+ };
16
+ Cell: (<T_4 extends object>(props: import("./components/TableHeaderCell/TableHeaderCell").OwnTableHeaderCellProps<T_4> & import("./components/TableHeaderCell/TableHeaderCell").RestTableHeaderCellProps & import("react").RefAttributes<HTMLTableCellElement>) => import("react").ReactElement<any, any> | null) & {
17
+ Compose: <T_5 extends object>(props: import("./components/TableHeaderCell/components/Compose/Compose").OwnTableHeaderCellComposeProps<T_5> & import("@redislabsdev/redis-ui-components").ComposeChildrenProps & Omit<import("react").HTMLAttributes<HTMLTableCellElement>, "content" | "children"> & import("react").RefAttributes<HTMLTableCellElement>) => import("react").ReactElement<any, any> | null;
18
+ SortableHeading: (({ children, ...restProps }: import("@redislabsdev/redis-ui-components").ComposeElementProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element) & {
19
+ Compose: ((props: import("@redislabsdev/redis-ui-components").ComposeElementProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element) & {
20
+ SortIndicator: () => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
21
+ };
22
+ SortIndicator: () => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
23
+ };
24
+ Heading: (props: import("./components/TableHeaderCell/components/Heading/Heading").RestTableHeaderCellHeadingProps) => import("react/jsx-runtime").JSX.Element;
25
+ };
26
+ };
27
+ EmptyState: ({ emptyStateRender, ...restProps }: import("./components/EmptyState/EmptyState").EmptyStateProps) => import("react/jsx-runtime").JSX.Element | null;
28
+ Body: (<T_6 extends object>(props: import("./components/TableBody/TableBody").RestTableBodyProps) => import("react/jsx-runtime").JSX.Element | null) & {
29
+ Compose: (props: import("./components/TableBody/components/Compose/Compose").TableBodyComposeProps) => import("react/jsx-runtime").JSX.Element;
30
+ Row: (<T_7 extends object>(props: import("./components/TableBodyRow/TableBodyRow").OwnTableBodyRowProps<T_7> & import("./components/TableBodyRow/TableBodyRow").RestTableBodyRowProps & import("react").RefAttributes<HTMLTableRowElement>) => import("react").ReactElement<any, any> | null) & {
31
+ Compose: (props: import("@redislabsdev/redis-ui-components").ComposeChildrenProps & Omit<import("react").HTMLAttributes<HTMLTableRowElement>, "content" | "children"> & import("react").RefAttributes<HTMLTableRowElement>) => import("react").ReactElement<any, any> | null;
32
+ useHandleClickableRow: <T_8 extends object>({ row, onClick, onKeyDown }: {
33
+ row: Row<T_8>;
34
+ onClick?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
35
+ onKeyDown?: import("react").KeyboardEventHandler<HTMLTableRowElement> | undefined;
36
+ }) => {
37
+ onClick: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
38
+ onKeyDown: ((event: import("react").KeyboardEvent<HTMLTableRowElement>) => void) | undefined;
39
+ };
40
+ };
41
+ ExpandableRow: <T_9 extends object>(props: import("./components/TableBodyRow/TableBodyRow").OwnTableBodyRowProps<T_9> & import("./components/TableBodyRow/TableBodyRow").RestTableBodyRowProps & import("react").RefAttributes<HTMLTableRowElement>) => import("react").ReactElement<any, any> | null;
42
+ Cell: (<T_10 extends object>(props: import("./components/TableBodyCell/TableBodyCell").OwnTableBodyCellProps<T_10> & import("./components/TableBodyCell/TableBodyCell").RestTableBodyCellProps & import("react").RefAttributes<HTMLTableCellElement>) => import("react").ReactElement<any, any> | null) & {
43
+ Compose: import("styled-components").StyledComponent<"td", any, {}, never>;
44
+ };
45
+ };
46
+ Pagination: (() => import("react/jsx-runtime").JSX.Element | null) & {
47
+ Compose: ({ children }: import("@redislabsdev/redis-ui-components").ComposeChildrenProps) => import("react/jsx-runtime").JSX.Element | null;
48
+ Bar: import("styled-components").StyledComponent<"nav", any, {
49
+ 'aria-label': string;
50
+ } & {
51
+ 'aria-label': string;
52
+ }, "aria-label">;
53
+ Split: import("styled-components").StyledComponent<"div", any, {}, never>;
54
+ InfoLabel: import("styled-components").StyledComponent<({ renderer, ...restProps }: import("@redislabsdev/redis-ui-components").PaginationInfoLabelProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
55
+ PageSelect: import("styled-components").StyledComponent<{
56
+ ({ ...restProps }: import("@redislabsdev/redis-ui-components").PaginationPageSelectProps): import("react/jsx-runtime").JSX.Element;
57
+ Label: ({ children, ...restProps }: import("@redislabsdev/redis-ui-components").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element;
58
+ }, any, {}, never>;
59
+ PageSizeSelect: import("styled-components").StyledComponent<{
60
+ ({ pageSizes, ...restProps }: import("@redislabsdev/redis-ui-components").PaginationPageSizeSelectProps): import("react/jsx-runtime").JSX.Element | null;
61
+ Label: ({ children, ...restProps }: import("@redislabsdev/redis-ui-components").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element | null;
62
+ }, any, {}, never>;
63
+ NavigationButton: import("styled-components").StyledComponent<({ navType, ...restProps }: import("@redislabsdev/redis-ui-components").PaginationNavigationButtonProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
64
+ PageSizeGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
65
+ PageNavGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
66
+ PageSelectGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
67
+ };
68
+ SRSortingNotification: typeof import("./components/TableHeaderCell/SRSortingNotification").SRSortingNotification;
3
69
  ExpandRowButton: ({ row, expandedIcon, collapsedIcon, ...restProps }: import("./components/ExpandRowButton/ExpandRowButton").ExpandRowButtonProps) => import("react/jsx-runtime").JSX.Element | null;
4
- ExpandedRow: <T_1 extends object>({ row, renderExpandedRow, keepInDom, expanded, rowRef, ...restProps }: import("./components/TableExpandedRow").TableExpandedRowProps<T_1>) => import("react/jsx-runtime").JSX.Element | null;
5
- AnimatedExpandedRow: <T_2 extends object>({ expanded, rowRef, ...restProps }: import("./components/TableExpandedRow").TableExpandedRowProps<T_2>) => import("react/jsx-runtime").JSX.Element;
70
+ ExpandedRow: <T_11 extends object>({ row, keepInDom, rowRef, ...restProps }: import("./components/TableExpandedRow").TableExpandedRowProps<T_11>) => import("react/jsx-runtime").JSX.Element | null;
71
+ AnimatedExpandedRow: <T_12 extends object>({ rowRef, ...restProps }: import("./components/TableExpandedRow").TableExpandedRowProps<T_12>) => import("react/jsx-runtime").JSX.Element;
72
+ RowSelectionButton: <T_13 extends object>({ row, ...restProps }: import("./components/RowSelection/RowSelectionButton").RowSelectionButtonProps<T_13>) => import("react/jsx-runtime").JSX.Element;
73
+ HeaderMultiRowSelectionButton: <T_14 extends object>({ table, managePage, ...restProps }: import("./components/RowSelection/HeaderMultiRowSelectionButton").HeaderMultiRowSelectionButtonProps<T_14>) => import("react/jsx-runtime").JSX.Element;
74
+ useClickableRowPlugin: <T_15 extends object>({ getCanRowClick, onRowClick, shouldClickOnEnter }: Partial<import("./plugins/ClickableRowPlugin").TableClickableRowContext<T_15>>) => import(".").TablePluginData<T_15>;
75
+ useSortingPlugin: <T_16 extends object>({ defaultSorting, onSortingChange, sorting, manualSorting, enableSorting }: import("./plugins/SortingPlugin").TableSortingParams) => import(".").TablePluginData<T_16>;
76
+ usePaginationPlugin: <T_17 extends object>({ pagination, defaultPagination, onPaginationChange, manualPagination, totalRowCount, pageSizes, paginationEnabled }: import("./plugins/PaginationPlugin").TablePaginationParams) => import(".").TablePluginData<T_17>;
77
+ useExpandableRowPlugin: <T_18 extends object>({ getRowCanExpand, renderExpandedRow, expandRowOnClick, expandedRowComponent }: import("./plugins/ExpandableRowPlugin").TableExpandableRowParams<T_18>) => import(".").TablePluginData<T_18>;
78
+ useRowSelectionPlugin: <T_19 extends object>({ rowSelection, defaultRowSelection, onRowSelectionChange, rowSelectionMode, getRowCanSelect }: import("./plugins/RowSelectionPlugin").TableRowSelectionParams<T_19>) => import(".").TablePluginData<T_19>;
79
+ useTableContext: <T_20 extends object = object>() => import("./Table.context").TableContextProps<T_20>;
80
+ useComposeContext: <T_21 extends object, C extends import("./Table.context").CompositionContextProps<T_21> = import("./Table.context").CompositionContextProps<T_21>>(defaults: Partial<C>) => C;
81
+ useClickableRowContext: <T_22 extends object>() => import("./plugins/ClickableRowPlugin").TableClickableRowContext<T_22> | undefined;
82
+ useExpandableRowContext: <T_23 extends object>() => import("./plugins/ExpandableRowPlugin").TableExpandableRowContext<T_23> | undefined;
83
+ usePaginationContext: () => import("./plugins/PaginationPlugin").TablePaginationContext | undefined;
84
+ useSortingContext: () => import("./plugins/SortingPlugin").TableSortingContext | undefined;
85
+ PluggableTable: <T_24 extends object>({ caption, emptyStateRender, ...restProps }: import("./components/PluggableTable/PluggableTable").PluggableTableProps<T_24>) => import("react/jsx-runtime").JSX.Element;
6
86
  };
7
87
  export default Table;