material-react-table 2.0.5 → 2.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -777,7 +777,8 @@ const MRT_TableBodyCell = (_a) => {
777
777
  hoveredRow,
778
778
  rowIndex,
779
779
  ]);
780
- const isEditable = parseFromValuesOrFunc(enableEditing, row) &&
780
+ const isEditable = !cell.getIsPlaceholder() &&
781
+ parseFromValuesOrFunc(enableEditing, row) &&
781
782
  parseFromValuesOrFunc(columnDef.enableEditing, row) !== false;
782
783
  const isEditing = isEditable &&
783
784
  !['custom', 'modal'].includes(editDisplayMode) &&
@@ -816,7 +817,8 @@ const MRT_TableBodyCell = (_a) => {
816
817
  measureElement === null || measureElement === void 0 ? void 0 : measureElement(node);
817
818
  }
818
819
  } }, tableCellProps, { onDoubleClick: handleDoubleClick, onDragEnter: handleDragEnter, sx: (theme) => (Object.assign(Object.assign({ '&:hover': {
819
- outline: ['cell', 'table'].includes(editDisplayMode !== null && editDisplayMode !== void 0 ? editDisplayMode : '') && isEditable
820
+ outline: (editDisplayMode === 'cell' && isEditable) ||
821
+ (editDisplayMode === 'table' && (isCreating || isEditing))
820
822
  ? `1px solid ${theme.palette.grey[500]}`
821
823
  : undefined,
822
824
  outlineOffset: '-1px',
@@ -1992,14 +1994,14 @@ const MRT_TableHeadCellResizeHandle = (_a) => {
1992
1994
  },
1993
1995
  cursor: 'col-resize',
1994
1996
  mr: density === 'compact'
1995
- ? '-12px'
1997
+ ? '-8px'
1996
1998
  : density === 'comfortable'
1997
- ? '-20px'
1998
- : '-28px',
1999
+ ? '-16px'
2000
+ : '-24px',
1999
2001
  position: 'absolute',
2000
2002
  px: '4px',
2001
2003
  right: column.columnDef.columnDefType === 'display' ? '4px' : '0',
2002
- }), children: jsxRuntime.jsx(Divider__default["default"], { className: "Mui-TableHeadCell-ResizeHandle-Divider", flexItem: true, orientation: "vertical", sx: (theme) => (Object.assign({ borderRadius: '2px', borderWidth: '2px', height: '24px', touchAction: 'none', transition: column.getIsResizing()
2004
+ }), children: jsxRuntime.jsx(Divider__default["default"], { className: "Mui-TableHeadCell-ResizeHandle-Divider", flexItem: true, orientation: "vertical", sx: (theme) => (Object.assign({ borderRadius: '2px', borderWidth: '2px', height: '24px', touchAction: 'none', transform: 'translateX(4px)', transition: column.getIsResizing()
2003
2005
  ? undefined
2004
2006
  : 'all 150ms ease-in-out', userSelect: 'none', zIndex: 4 }, parseFromValuesOrFunc(rest === null || rest === void 0 ? void 0 : rest.sx, theme))) }) }));
2005
2007
  };
@@ -2176,7 +2178,9 @@ const MRT_TableHeadCell = (_a) => {
2176
2178
  whiteSpace: ((_h = (_g = columnDef.header) === null || _g === void 0 ? void 0 : _g.length) !== null && _h !== void 0 ? _h : 0) < 20
2177
2179
  ? 'nowrap'
2178
2180
  : 'normal',
2179
- }, title: columnDefType === 'data' ? columnDef.header : undefined, children: headerElement }), column.getCanFilter() && (jsxRuntime.jsx(MRT_TableHeadCellFilterLabel, { header: header, table: table })), column.getCanSort() && (jsxRuntime.jsx(MRT_TableHeadCellSortLabel, { header: header, table: table }))] }), columnDefType !== 'group' && (jsxRuntime.jsxs(Box__default["default"], { className: "Mui-TableHeadCell-Content-Actions", sx: { whiteSpace: 'nowrap' }, children: [showDragHandle && (jsxRuntime.jsx(MRT_TableHeadCellGrabHandle, { column: column, table: table, tableHeadCellRef: {
2181
+ }, title: columnDefType === 'data' ? columnDef.header : undefined, children: headerElement }), column.getCanFilter() && (jsxRuntime.jsx(MRT_TableHeadCellFilterLabel, { header: header, table: table })), column.getCanSort() && (jsxRuntime.jsx(MRT_TableHeadCellSortLabel, { header: header, table: table }))] }), columnDefType !== 'group' && (jsxRuntime.jsxs(Box__default["default"], { className: "Mui-TableHeadCell-Content-Actions", sx: {
2182
+ whiteSpace: 'nowrap',
2183
+ }, children: [showDragHandle && (jsxRuntime.jsx(MRT_TableHeadCellGrabHandle, { column: column, table: table, tableHeadCellRef: {
2180
2184
  current: tableHeadCellRefs.current[column.id],
2181
2185
  } })), showColumnActions && (jsxRuntime.jsx(MRT_TableHeadCellColumnActionsButton, { header: header, table: table }))] })), column.getCanResize() && (jsxRuntime.jsx(MRT_TableHeadCellResizeHandle, { header: header, table: table }))] })), columnFilterDisplayMode === 'subheader' && column.getCanFilter() && (jsxRuntime.jsx(MRT_TableHeadCellFilterContainer, { header: header, table: table }))] })));
2182
2186
  };
@@ -2225,7 +2229,7 @@ const MRT_TablePagination = (_a) => {
2225
2229
  const showFirstLastPageButtons = numberOfPages > 2;
2226
2230
  const firstRowIndex = pageIndex * pageSize;
2227
2231
  const lastRowIndex = Math.min(pageIndex * pageSize + pageSize, totalRowCount);
2228
- const _b = paginationProps !== null && paginationProps !== void 0 ? paginationProps : {}, { SelectProps, rowsPerPageOptions = defaultRowsPerPage, showFirstButton = showFirstLastPageButtons, showLastButton = showFirstLastPageButtons, showRowsPerPage = true } = _b, _rest = __rest(_b, ["SelectProps", "rowsPerPageOptions", "showFirstButton", "showLastButton", "showRowsPerPage"]);
2232
+ const _b = paginationProps !== null && paginationProps !== void 0 ? paginationProps : {}, { SelectProps, disabled = false, rowsPerPageOptions = defaultRowsPerPage, showFirstButton = showFirstLastPageButtons, showLastButton = showFirstLastPageButtons, showRowsPerPage = true } = _b, _rest = __rest(_b, ["SelectProps", "disabled", "rowsPerPageOptions", "showFirstButton", "showLastButton", "showRowsPerPage"]);
2229
2233
  return (jsxRuntime.jsxs(Box__default["default"], { className: "MuiTablePagination-root", sx: {
2230
2234
  alignItems: 'center',
2231
2235
  display: 'flex',
@@ -2242,17 +2246,17 @@ const MRT_TablePagination = (_a) => {
2242
2246
  px: '8px',
2243
2247
  py: '12px',
2244
2248
  zIndex: 2,
2245
- }, children: [showRowsPerPage && (jsxRuntime.jsxs(Box__default["default"], { sx: { alignItems: 'center', display: 'flex', gap: '8px' }, children: [jsxRuntime.jsx(InputLabel__default["default"], { htmlFor: "mrt-rows-per-page", sx: { mb: 0 }, children: localization.rowsPerPage }), jsxRuntime.jsx(Select__default["default"], Object.assign({ disableUnderline: true, id: "mrt-rows-per-page", inputProps: { 'aria-label': localization.rowsPerPage }, label: localization.rowsPerPage, onChange: (event) => setPageSize(+event.target.value), sx: { mb: 0 }, value: pageSize, variant: "standard" }, SelectProps, { children: rowsPerPageOptions.map((option) => {
2249
+ }, children: [showRowsPerPage && (jsxRuntime.jsxs(Box__default["default"], { sx: { alignItems: 'center', display: 'flex', gap: '8px' }, children: [jsxRuntime.jsx(InputLabel__default["default"], { htmlFor: "mrt-rows-per-page", sx: { mb: 0 }, children: localization.rowsPerPage }), jsxRuntime.jsx(Select__default["default"], Object.assign({ disableUnderline: true, disabled: disabled, id: "mrt-rows-per-page", inputProps: { 'aria-label': localization.rowsPerPage }, label: localization.rowsPerPage, onChange: (event) => setPageSize(+event.target.value), sx: { mb: 0 }, value: pageSize, variant: "standard" }, SelectProps, { children: rowsPerPageOptions.map((option) => {
2246
2250
  var _a;
2247
2251
  const value = typeof option !== 'number' ? option.value : option;
2248
2252
  const label = typeof option !== 'number' ? option.label : `${option}`;
2249
2253
  return ((_a = SelectProps === null || SelectProps === void 0 ? void 0 : SelectProps.children) !== null && _a !== void 0 ? _a : ((SelectProps === null || SelectProps === void 0 ? void 0 : SelectProps.native) ? (jsxRuntime.jsx("option", { value: value, children: label }, value)) : (jsxRuntime.jsx(MenuItem__default["default"], { sx: { m: 0 }, value: value, children: label }, value))));
2250
- }) }))] })), paginationDisplayMode === 'pages' ? (jsxRuntime.jsx(Pagination__default["default"], Object.assign({ count: numberOfPages, onChange: (_e, newPageIndex) => setPageIndex(newPageIndex - 1), page: pageIndex + 1, renderItem: (item) => (jsxRuntime.jsx(PaginationItem__default["default"], Object.assign({ slots: {
2254
+ }) }))] })), paginationDisplayMode === 'pages' ? (jsxRuntime.jsx(Pagination__default["default"], Object.assign({ count: numberOfPages, disabled: disabled, onChange: (_e, newPageIndex) => setPageIndex(newPageIndex - 1), page: pageIndex + 1, renderItem: (item) => (jsxRuntime.jsx(PaginationItem__default["default"], Object.assign({ slots: {
2251
2255
  first: FirstPageIcon,
2252
2256
  last: LastPageIcon,
2253
2257
  next: ChevronRightIcon,
2254
2258
  previous: ChevronLeftIcon,
2255
- } }, item))), showFirstButton: showFirstButton, showLastButton: showLastButton }, _rest))) : paginationDisplayMode === 'default' ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography__default["default"], { align: "center", component: "span", sx: { m: '0 4px', minWidth: '8ch' }, variant: "body2", children: `${lastRowIndex === 0 ? 0 : (firstRowIndex + 1).toLocaleString()}-${lastRowIndex.toLocaleString()} ${localization.of} ${totalRowCount.toLocaleString()}` }), jsxRuntime.jsxs(Box__default["default"], { gap: "xs", children: [showFirstButton && (jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToFirstPage, disabled: pageIndex <= 0, onClick: () => setPageIndex(0), size: "small", children: jsxRuntime.jsx(FirstPageIcon, {}) })), jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToPreviousPage, disabled: pageIndex <= 0, onClick: () => setPageIndex(pageIndex - 1), size: "small", children: jsxRuntime.jsx(ChevronLeftIcon, {}) }), jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToNextPage, disabled: lastRowIndex >= totalRowCount, onClick: () => setPageIndex(pageIndex + 1), size: "small", children: jsxRuntime.jsx(ChevronRightIcon, {}) }), showLastButton && (jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToLastPage, disabled: lastRowIndex >= totalRowCount, onClick: () => setPageIndex(numberOfPages - 1), size: "small", children: jsxRuntime.jsx(LastPageIcon, {}) }))] })] })) : null] }));
2259
+ } }, item))), showFirstButton: showFirstButton, showLastButton: showLastButton }, _rest))) : paginationDisplayMode === 'default' ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography__default["default"], { align: "center", component: "span", sx: { m: '0 4px', minWidth: '8ch' }, variant: "body2", children: `${lastRowIndex === 0 ? 0 : (firstRowIndex + 1).toLocaleString()}-${lastRowIndex.toLocaleString()} ${localization.of} ${totalRowCount.toLocaleString()}` }), jsxRuntime.jsxs(Box__default["default"], { gap: "xs", children: [showFirstButton && (jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToFirstPage, disabled: pageIndex <= 0 || disabled, onClick: () => setPageIndex(0), size: "small", children: jsxRuntime.jsx(FirstPageIcon, {}) })), jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToPreviousPage, disabled: pageIndex <= 0 || disabled, onClick: () => setPageIndex(pageIndex - 1), size: "small", children: jsxRuntime.jsx(ChevronLeftIcon, {}) }), jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToNextPage, disabled: lastRowIndex >= totalRowCount || disabled, onClick: () => setPageIndex(pageIndex + 1), size: "small", children: jsxRuntime.jsx(ChevronRightIcon, {}) }), showLastButton && (jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToLastPage, disabled: lastRowIndex >= totalRowCount || disabled, onClick: () => setPageIndex(numberOfPages - 1), size: "small", children: jsxRuntime.jsx(LastPageIcon, {}) }))] })] })) : null] }));
2256
2260
  };
2257
2261
 
2258
2262
  const MRT_GlobalFilterTextField = (_a) => {
@@ -3068,228 +3072,582 @@ const MRT_ToggleRowActionMenuButton = (_a) => {
3068
3072
  ['modal', 'row'].includes(editDisplayMode) ? (jsxRuntime.jsx(Tooltip__default["default"], { placement: "right", title: localization.edit, children: jsxRuntime.jsx(IconButton__default["default"], Object.assign({ "aria-label": localization.edit, onClick: handleStartEditMode, sx: commonIconButtonStyles }, rest, { children: jsxRuntime.jsx(EditIcon, {}) })) })) : renderRowActionMenuItems ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Tooltip__default["default"], { enterDelay: 1000, enterNextDelay: 1000, title: localization.rowActions, children: jsxRuntime.jsx(IconButton__default["default"], Object.assign({ "aria-label": localization.rowActions, onClick: handleOpenRowActionMenu, size: "small", sx: commonIconButtonStyles }, rest, { children: jsxRuntime.jsx(MoreHorizIcon, {}) })) }), jsxRuntime.jsx(MRT_RowActionMenu, { anchorEl: anchorEl, handleEdit: handleStartEditMode, row: row, setAnchorEl: setAnchorEl, table: table })] })) : null }));
3069
3073
  };
3070
3074
 
3071
- const MRT_AggregationFns = Object.assign({}, reactTable.aggregationFns);
3072
-
3073
- const fuzzy = (row, columnId, filterValue, addMeta) => {
3074
- const itemRank = matchSorterUtils.rankItem(row.getValue(columnId), filterValue, {
3075
- threshold: matchSorterUtils.rankings.MATCHES,
3076
- });
3077
- addMeta(itemRank);
3078
- return itemRank.passed;
3075
+ const useMRT_DisplayColumns = (params) => {
3076
+ var _a, _b, _c, _d;
3077
+ const { columnOrder, creatingRow, grouping, tableOptions } = params;
3078
+ const order = (_b = (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnOrder) !== null && _b !== void 0 ? _b : columnOrder;
3079
+ return react.useMemo(() => [
3080
+ makeRowPinColumn,
3081
+ makeRowDragColumn,
3082
+ makeRowActionsColumn,
3083
+ makeRowExpandColumn,
3084
+ makeRowSelectColumn,
3085
+ makeRowNumbersColumn,
3086
+ makeSpacerColumn,
3087
+ ]
3088
+ .map((makeCol) => makeCol(params, order))
3089
+ .filter(Boolean), [
3090
+ columnOrder,
3091
+ creatingRow,
3092
+ grouping,
3093
+ tableOptions.displayColumnDefOptions,
3094
+ tableOptions.editDisplayMode,
3095
+ tableOptions.enableColumnDragging,
3096
+ tableOptions.enableColumnFilterModes,
3097
+ tableOptions.enableColumnOrdering,
3098
+ tableOptions.enableEditing,
3099
+ tableOptions.enableExpandAll,
3100
+ tableOptions.enableExpanding,
3101
+ tableOptions.enableGrouping,
3102
+ tableOptions.enableRowActions,
3103
+ tableOptions.enableRowDragging,
3104
+ tableOptions.enableRowNumbers,
3105
+ tableOptions.enableRowOrdering,
3106
+ tableOptions.enableRowSelection,
3107
+ tableOptions.enableSelectAll,
3108
+ tableOptions.localization,
3109
+ tableOptions.positionActionsColumn,
3110
+ tableOptions.renderDetailPanel,
3111
+ tableOptions.renderRowActionMenuItems,
3112
+ tableOptions.renderRowActions,
3113
+ (_c = tableOptions.state) === null || _c === void 0 ? void 0 : _c.columnOrder,
3114
+ (_d = tableOptions.state) === null || _d === void 0 ? void 0 : _d.grouping,
3115
+ ]);
3079
3116
  };
3080
- fuzzy.autoRemove = (val) => !val;
3081
- const contains = (row, id, filterValue) => row
3082
- .getValue(id)
3083
- .toString()
3084
- .toLowerCase()
3085
- .trim()
3086
- .includes(filterValue.toString().toLowerCase().trim());
3087
- contains.autoRemove = (val) => !val;
3088
- const startsWith = (row, id, filterValue) => row
3089
- .getValue(id)
3090
- .toString()
3091
- .toLowerCase()
3092
- .trim()
3093
- .startsWith(filterValue.toString().toLowerCase().trim());
3094
- startsWith.autoRemove = (val) => !val;
3095
- const endsWith = (row, id, filterValue) => row
3096
- .getValue(id)
3097
- .toString()
3098
- .toLowerCase()
3099
- .trim()
3100
- .endsWith(filterValue.toString().toLowerCase().trim());
3101
- endsWith.autoRemove = (val) => !val;
3102
- const equals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() ===
3103
- (filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
3104
- equals.autoRemove = (val) => !val;
3105
- const notEquals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() !==
3106
- filterValue.toString().toLowerCase().trim();
3107
- notEquals.autoRemove = (val) => !val;
3108
- const greaterThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id))
3109
- ? +row.getValue(id) > +filterValue
3110
- : row.getValue(id).toString().toLowerCase().trim() >
3111
- (filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
3112
- greaterThan.autoRemove = (val) => !val;
3113
- const greaterThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || greaterThan(row, id, filterValue);
3114
- greaterThanOrEqualTo.autoRemove = (val) => !val;
3115
- const lessThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id))
3116
- ? +row.getValue(id) < +filterValue
3117
- : row.getValue(id).toString().toLowerCase().trim() <
3118
- (filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
3119
- lessThan.autoRemove = (val) => !val;
3120
- const lessThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || lessThan(row, id, filterValue);
3121
- lessThanOrEqualTo.autoRemove = (val) => !val;
3122
- const between = (row, id, filterValues) => (['', undefined].includes(filterValues[0]) ||
3123
- greaterThan(row, id, filterValues[0])) &&
3124
- ((!isNaN(+filterValues[0]) &&
3125
- !isNaN(+filterValues[1]) &&
3126
- +filterValues[0] > +filterValues[1]) ||
3127
- ['', undefined].includes(filterValues[1]) ||
3128
- lessThan(row, id, filterValues[1]));
3129
- between.autoRemove = (val) => !val;
3130
- const betweenInclusive = (row, id, filterValues) => (['', undefined].includes(filterValues[0]) ||
3131
- greaterThanOrEqualTo(row, id, filterValues[0])) &&
3132
- ((!isNaN(+filterValues[0]) &&
3133
- !isNaN(+filterValues[1]) &&
3134
- +filterValues[0] > +filterValues[1]) ||
3135
- ['', undefined].includes(filterValues[1]) ||
3136
- lessThanOrEqualTo(row, id, filterValues[1]));
3137
- betweenInclusive.autoRemove = (val) => !val;
3138
- const empty = (row, id, _filterValue) => !row.getValue(id).toString().trim();
3139
- empty.autoRemove = (val) => !val;
3140
- const notEmpty = (row, id, _filterValue) => !!row.getValue(id).toString().trim();
3141
- notEmpty.autoRemove = (val) => !val;
3142
- const MRT_FilterFns = Object.assign(Object.assign({}, reactTable.filterFns), { between,
3143
- betweenInclusive,
3144
- contains,
3145
- empty,
3146
- endsWith,
3147
- equals,
3148
- fuzzy,
3149
- greaterThan,
3150
- greaterThanOrEqualTo,
3151
- lessThan,
3152
- lessThanOrEqualTo,
3153
- notEmpty,
3154
- notEquals,
3155
- startsWith });
3117
+ function defaultDisplayColumnProps({ defaultDisplayColumn, displayColumnDefOptions, localization, }, id, header, size = 60) {
3118
+ return Object.assign(Object.assign(Object.assign(Object.assign({}, defaultDisplayColumn), { header: header ? localization[header] : '', size }), displayColumnDefOptions === null || displayColumnDefOptions === void 0 ? void 0 : displayColumnDefOptions[id]), { id });
3119
+ }
3120
+ function makeRowPinColumn({ tableOptions }, order) {
3121
+ const id = 'mrt-row-pin';
3122
+ if (order.includes(id)) {
3123
+ return Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_TableBodyRowPinButton, { row: row, table: table })) }, defaultDisplayColumnProps(tableOptions, id, 'pin'));
3124
+ }
3125
+ return null;
3126
+ }
3127
+ function makeRowDragColumn({ tableOptions }, order) {
3128
+ const id = 'mrt-row-drag';
3129
+ if (order.includes(id)) {
3130
+ return Object.assign({ Cell: ({ row, rowRef, table }) => (jsxRuntime.jsx(MRT_TableBodyRowGrabHandle, { row: row, rowRef: rowRef, table: table })) }, defaultDisplayColumnProps(tableOptions, id, 'move'));
3131
+ }
3132
+ return null;
3133
+ }
3134
+ function makeRowActionsColumn({ creatingRow, tableOptions }, order) {
3135
+ const id = 'mrt-row-actions';
3136
+ if (order.includes(id) ||
3137
+ (creatingRow && tableOptions.createDisplayMode === 'row')) {
3138
+ return Object.assign({ Cell: ({ cell, row, table }) => (jsxRuntime.jsx(MRT_ToggleRowActionMenuButton, { cell: cell, row: row, table: table })) }, defaultDisplayColumnProps(tableOptions, id, 'actions'));
3139
+ }
3140
+ return null;
3141
+ }
3142
+ function makeRowExpandColumn({ grouping, tableOptions }, order) {
3143
+ var _a, _b;
3144
+ const id = 'mrt-row-expand';
3145
+ if (order.includes(id) &&
3146
+ showExpandColumn(tableOptions, (_b = (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.grouping) !== null && _b !== void 0 ? _b : grouping)) {
3147
+ return Object.assign({ Cell: ({ row, table }) => jsxRuntime.jsx(MRT_ExpandButton, { row: row, table: table }), Header: tableOptions.enableExpandAll
3148
+ ? ({ table }) => jsxRuntime.jsx(MRT_ExpandAllButton, { table: table })
3149
+ : undefined }, defaultDisplayColumnProps(tableOptions, id, 'expand'));
3150
+ }
3151
+ return null;
3152
+ }
3153
+ function makeRowSelectColumn({ tableOptions }, order) {
3154
+ const id = 'mrt-row-select';
3155
+ if (order.includes(id)) {
3156
+ return Object.assign({ Cell: ({ row, table }) => jsxRuntime.jsx(MRT_SelectCheckbox, { row: row, table: table }), Header: tableOptions.enableSelectAll && tableOptions.enableMultiRowSelection
3157
+ ? ({ table }) => jsxRuntime.jsx(MRT_SelectCheckbox, { selectAll: true, table: table })
3158
+ : undefined }, defaultDisplayColumnProps(tableOptions, id, 'select'));
3159
+ }
3160
+ return null;
3161
+ }
3162
+ function makeRowNumbersColumn({ tableOptions }, order) {
3163
+ const id = 'mrt-row-numbers';
3164
+ if (order.includes(id) || tableOptions.enableRowNumbers)
3165
+ return Object.assign({ Cell: ({ row }) => row.index + 1, Header: () => tableOptions.localization.rowNumber }, defaultDisplayColumnProps(tableOptions, id, 'rowNumbers'));
3166
+ return null;
3167
+ }
3168
+ const blankColProps = {
3169
+ children: null,
3170
+ sx: {
3171
+ flex: '1 0 auto',
3172
+ minWidth: 0,
3173
+ p: 0,
3174
+ width: 0,
3175
+ },
3176
+ };
3177
+ function makeSpacerColumn({ tableOptions }, order) {
3178
+ const id = 'mrt-row-spacer';
3179
+ if (order.includes(id)) {
3180
+ return Object.assign(Object.assign({}, defaultDisplayColumnProps(tableOptions, id, undefined, 0)), { muiTableBodyCellProps: blankColProps, muiTableFooterCellProps: blankColProps, muiTableHeadCellProps: blankColProps });
3181
+ }
3182
+ return null;
3183
+ }
3156
3184
 
3157
- const MRT_Default_Icons = {
3158
- ArrowDownwardIcon: ArrowDownwardIcon__default["default"],
3159
- ArrowRightIcon: ArrowRightIcon__default["default"],
3160
- CancelIcon: CancelIcon__default["default"],
3161
- ChevronLeftIcon: ChevronLeftIcon__default["default"],
3162
- ChevronRightIcon: ChevronRightIcon__default["default"],
3163
- ClearAllIcon: ClearAllIcon__default["default"],
3164
- CloseIcon: CloseIcon__default["default"],
3165
- DensityLargeIcon: DensityLargeIcon__default["default"],
3166
- DensityMediumIcon: DensityMediumIcon__default["default"],
3167
- DensitySmallIcon: DensitySmallIcon__default["default"],
3168
- DragHandleIcon: DragHandleIcon__default["default"],
3169
- DynamicFeedIcon: DynamicFeedIcon__default["default"],
3170
- EditIcon: EditIcon__default["default"],
3171
- ExpandMoreIcon: ExpandMoreIcon__default["default"],
3172
- FilterAltIcon: FilterAltIcon__default["default"],
3173
- FilterListIcon: FilterListIcon__default["default"],
3174
- FilterListOffIcon: FilterListOffIcon__default["default"],
3175
- FirstPageIcon: FirstPageIcon__default["default"],
3176
- FullscreenExitIcon: FullscreenExitIcon__default["default"],
3177
- FullscreenIcon: FullscreenIcon__default["default"],
3178
- KeyboardDoubleArrowDownIcon: KeyboardDoubleArrowDownIcon__default["default"],
3179
- LastPageIcon: LastPageIcon__default["default"],
3180
- MoreHorizIcon: MoreHorizIcon__default["default"],
3181
- MoreVertIcon: MoreVertIcon__default["default"],
3182
- PushPinIcon: PushPinIcon__default["default"],
3183
- RestartAltIcon: RestartAltIcon__default["default"],
3184
- SaveIcon: SaveIcon__default["default"],
3185
- SearchIcon: SearchIcon__default["default"],
3186
- SearchOffIcon: SearchOffIcon__default["default"],
3187
- SortIcon: SortIcon__default["default"],
3188
- SyncAltIcon: SyncAltIcon__default["default"],
3189
- ViewColumnIcon: ViewColumnIcon__default["default"],
3190
- VisibilityOffIcon: VisibilityOffIcon__default["default"],
3185
+ const useMRT_Effects = (table) => {
3186
+ const { getIsSomeRowsPinned, getState, options: { enablePagination, enableRowPinning, rowCount }, } = table;
3187
+ const { density, globalFilter, isFullScreen, isLoading, pagination, showSkeletons, sorting, } = getState();
3188
+ const rerender = react.useReducer(() => ({}), {})[1];
3189
+ const isMounted = react.useRef(false);
3190
+ const initialBodyHeight = react.useRef();
3191
+ const previousTop = react.useRef();
3192
+ react.useEffect(() => {
3193
+ if (typeof window !== 'undefined') {
3194
+ initialBodyHeight.current = document.body.style.height;
3195
+ }
3196
+ }, []);
3197
+ react.useEffect(() => {
3198
+ if (isMounted && typeof window !== 'undefined') {
3199
+ if (isFullScreen) {
3200
+ previousTop.current = document.body.getBoundingClientRect().top; //save scroll position
3201
+ document.body.style.height = '100vh'; //hide page scrollbars when table is in full screen mode
3202
+ }
3203
+ else {
3204
+ document.body.style.height = initialBodyHeight.current;
3205
+ if (!previousTop.current)
3206
+ return;
3207
+ //restore scroll position
3208
+ window.scrollTo({
3209
+ behavior: 'instant',
3210
+ top: -1 * previousTop.current,
3211
+ });
3212
+ }
3213
+ }
3214
+ isMounted.current = true;
3215
+ }, [isFullScreen]);
3216
+ //if page index is out of bounds, set it to the last page
3217
+ react.useEffect(() => {
3218
+ if (!enablePagination || isLoading || showSkeletons)
3219
+ return;
3220
+ const { pageIndex, pageSize } = pagination;
3221
+ const totalRowCount = rowCount !== null && rowCount !== void 0 ? rowCount : table.getPrePaginationRowModel().rows.length;
3222
+ const firstVisibleRowIndex = pageIndex * pageSize;
3223
+ if (firstVisibleRowIndex > totalRowCount) {
3224
+ table.setPageIndex(Math.floor(totalRowCount / pageSize));
3225
+ }
3226
+ }, [rowCount, table.getPrePaginationRowModel().rows.length]);
3227
+ //turn off sort when global filter is looking for ranked results
3228
+ const appliedSort = react.useRef(sorting);
3229
+ react.useEffect(() => {
3230
+ if (sorting.length) {
3231
+ appliedSort.current = sorting;
3232
+ }
3233
+ }, [sorting]);
3234
+ react.useEffect(() => {
3235
+ if (!getCanRankRows(table))
3236
+ return;
3237
+ if (globalFilter) {
3238
+ table.setSorting([]);
3239
+ }
3240
+ else {
3241
+ table.setSorting(() => appliedSort.current || []);
3242
+ }
3243
+ }, [globalFilter]);
3244
+ react.useEffect(() => {
3245
+ if (enableRowPinning && getIsSomeRowsPinned()) {
3246
+ setTimeout(() => {
3247
+ rerender();
3248
+ }, 150);
3249
+ }
3250
+ }, [density]);
3191
3251
  };
3192
3252
 
3193
- const MRT_Localization_EN = {
3194
- actions: 'Actions',
3195
- and: 'and',
3196
- cancel: 'Cancel',
3197
- changeFilterMode: 'Change filter mode',
3198
- changeSearchMode: 'Change search mode',
3199
- clearFilter: 'Clear filter',
3200
- clearSearch: 'Clear search',
3201
- clearSort: 'Clear sort',
3202
- clickToCopy: 'Click to copy',
3203
- collapse: 'Collapse',
3204
- collapseAll: 'Collapse all',
3205
- columnActions: 'Column Actions',
3206
- copiedToClipboard: 'Copied to clipboard',
3207
- dropToGroupBy: 'Drop to group by {column}',
3208
- edit: 'Edit',
3209
- expand: 'Expand',
3210
- expandAll: 'Expand all',
3211
- filterArrIncludes: 'Includes',
3212
- filterArrIncludesAll: 'Includes all',
3213
- filterArrIncludesSome: 'Includes',
3214
- filterBetween: 'Between',
3215
- filterBetweenInclusive: 'Between Inclusive',
3216
- filterByColumn: 'Filter by {column}',
3217
- filterContains: 'Contains',
3218
- filterEmpty: 'Empty',
3219
- filterEndsWith: 'Ends With',
3220
- filterEquals: 'Equals',
3221
- filterEqualsString: 'Equals',
3222
- filterFuzzy: 'Fuzzy',
3223
- filterGreaterThan: 'Greater Than',
3224
- filterGreaterThanOrEqualTo: 'Greater Than Or Equal To',
3225
- filterInNumberRange: 'Between',
3226
- filterIncludesString: 'Contains',
3227
- filterIncludesStringSensitive: 'Contains',
3228
- filterLessThan: 'Less Than',
3229
- filterLessThanOrEqualTo: 'Less Than Or Equal To',
3230
- filterMode: 'Filter Mode: {filterType}',
3231
- filterNotEmpty: 'Not Empty',
3232
- filterNotEquals: 'Not Equals',
3233
- filterStartsWith: 'Starts With',
3234
- filterWeakEquals: 'Equals',
3235
- filteringByColumn: 'Filtering by {column} - {filterType} {filterValue}',
3236
- goToFirstPage: 'Go to first page',
3237
- goToLastPage: 'Go to last page',
3238
- goToNextPage: 'Go to next page',
3239
- goToPreviousPage: 'Go to previous page',
3240
- grab: 'Grab',
3241
- groupByColumn: 'Group by {column}',
3242
- groupedBy: 'Grouped by ',
3243
- hideAll: 'Hide all',
3244
- hideColumn: 'Hide {column} column',
3245
- max: 'Max',
3246
- min: 'Min',
3247
- move: 'Move',
3248
- noRecordsToDisplay: 'No records to display',
3249
- noResultsFound: 'No results found',
3250
- of: 'of',
3251
- or: 'or',
3252
- pin: 'Pin',
3253
- pinToLeft: 'Pin to left',
3254
- pinToRight: 'Pin to right',
3255
- resetColumnSize: 'Reset column size',
3256
- resetOrder: 'Reset order',
3257
- rowActions: 'Row Actions',
3258
- rowNumber: '#',
3259
- rowNumbers: 'Row Numbers',
3260
- rowsPerPage: 'Rows per page',
3261
- save: 'Save',
3262
- search: 'Search',
3263
- selectedCountOfRowCountRowsSelected: '{selectedCount} of {rowCount} row(s) selected',
3264
- select: 'Select',
3265
- showAll: 'Show all',
3266
- showAllColumns: 'Show all columns',
3267
- showHideColumns: 'Show/Hide columns',
3268
- showHideFilters: 'Show/Hide filters',
3269
- showHideSearch: 'Show/Hide search',
3270
- sortByColumnAsc: 'Sort by {column} ascending',
3271
- sortByColumnDesc: 'Sort by {column} descending',
3272
- sortedByColumnAsc: 'Sorted by {column} ascending',
3273
- sortedByColumnDesc: 'Sorted by {column} descending',
3274
- thenBy: ', then by ',
3275
- toggleDensity: 'Toggle density',
3276
- toggleFullScreen: 'Toggle full screen',
3277
- toggleSelectAll: 'Toggle select all',
3278
- toggleSelectRow: 'Toggle select row',
3279
- toggleVisibility: 'Toggle visibility',
3280
- ungroupByColumn: 'Ungroup by {column}',
3281
- unpin: 'Unpin',
3282
- unpinAll: 'Unpin all',
3253
+ const useMRT_TableInstance = (tableOptions) => {
3254
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10;
3255
+ const bottomToolbarRef = react.useRef(null);
3256
+ const editInputRefs = react.useRef({});
3257
+ const filterInputRefs = react.useRef({});
3258
+ const searchInputRef = react.useRef(null);
3259
+ const tableContainerRef = react.useRef(null);
3260
+ const tableHeadCellRefs = react.useRef({});
3261
+ const tablePaperRef = react.useRef(null);
3262
+ const topToolbarRef = react.useRef(null);
3263
+ const tableHeadRef = react.useRef(null);
3264
+ const tableFooterRef = react.useRef(null);
3265
+ const initialState = react.useMemo(() => {
3266
+ var _a, _b, _c;
3267
+ const initState = (_a = tableOptions.initialState) !== null && _a !== void 0 ? _a : {};
3268
+ initState.columnOrder =
3269
+ (_b = initState.columnOrder) !== null && _b !== void 0 ? _b : getDefaultColumnOrderIds(tableOptions);
3270
+ initState.globalFilterFn = (_c = tableOptions.globalFilterFn) !== null && _c !== void 0 ? _c : 'fuzzy';
3271
+ return initState;
3272
+ }, []);
3273
+ const [creatingRow, _setCreatingRow] = react.useState((_a = initialState.creatingRow) !== null && _a !== void 0 ? _a : null);
3274
+ const [columnFilterFns, setColumnFilterFns] = react.useState(() => Object.assign({}, ...getAllLeafColumnDefs(tableOptions.columns).map((col) => {
3275
+ var _a, _b, _c, _d;
3276
+ return ({
3277
+ [getColumnId(col)]: col.filterFn instanceof Function
3278
+ ? (_a = col.filterFn.name) !== null && _a !== void 0 ? _a : 'custom'
3279
+ : (_d = (_b = col.filterFn) !== null && _b !== void 0 ? _b : (_c = initialState === null || initialState === void 0 ? void 0 : initialState.columnFilterFns) === null || _c === void 0 ? void 0 : _c[getColumnId(col)]) !== null && _d !== void 0 ? _d : getDefaultColumnFilterFn(col),
3280
+ });
3281
+ })));
3282
+ const [columnOrder, setColumnOrder] = react.useState((_b = initialState.columnOrder) !== null && _b !== void 0 ? _b : []);
3283
+ const [density, setDensity] = react.useState((_c = initialState === null || initialState === void 0 ? void 0 : initialState.density) !== null && _c !== void 0 ? _c : 'comfortable');
3284
+ const [draggingColumn, setDraggingColumn] = react.useState((_d = initialState.draggingColumn) !== null && _d !== void 0 ? _d : null);
3285
+ const [draggingRow, setDraggingRow] = react.useState((_e = initialState.draggingRow) !== null && _e !== void 0 ? _e : null);
3286
+ const [editingCell, setEditingCell] = react.useState((_f = initialState.editingCell) !== null && _f !== void 0 ? _f : null);
3287
+ const [editingRow, setEditingRow] = react.useState((_g = initialState.editingRow) !== null && _g !== void 0 ? _g : null);
3288
+ const [globalFilterFn, setGlobalFilterFn] = react.useState((_h = initialState.globalFilterFn) !== null && _h !== void 0 ? _h : 'fuzzy');
3289
+ const [grouping, setGrouping] = react.useState((_j = initialState.grouping) !== null && _j !== void 0 ? _j : []);
3290
+ const [hoveredColumn, setHoveredColumn] = react.useState((_k = initialState.hoveredColumn) !== null && _k !== void 0 ? _k : null);
3291
+ const [hoveredRow, setHoveredRow] = react.useState((_l = initialState.hoveredRow) !== null && _l !== void 0 ? _l : null);
3292
+ const [isFullScreen, setIsFullScreen] = react.useState((_m = initialState === null || initialState === void 0 ? void 0 : initialState.isFullScreen) !== null && _m !== void 0 ? _m : false);
3293
+ const [showAlertBanner, setShowAlertBanner] = react.useState((_p = (_o = tableOptions.initialState) === null || _o === void 0 ? void 0 : _o.showAlertBanner) !== null && _p !== void 0 ? _p : false);
3294
+ const [showColumnFilters, setShowColumnFilters] = react.useState((_q = initialState === null || initialState === void 0 ? void 0 : initialState.showColumnFilters) !== null && _q !== void 0 ? _q : false);
3295
+ const [showGlobalFilter, setShowGlobalFilter] = react.useState((_r = initialState === null || initialState === void 0 ? void 0 : initialState.showGlobalFilter) !== null && _r !== void 0 ? _r : false);
3296
+ const [showToolbarDropZone, setShowToolbarDropZone] = react.useState((_s = initialState === null || initialState === void 0 ? void 0 : initialState.showToolbarDropZone) !== null && _s !== void 0 ? _s : false);
3297
+ const displayColumns = useMRT_DisplayColumns({
3298
+ columnOrder,
3299
+ creatingRow,
3300
+ grouping,
3301
+ tableOptions,
3302
+ });
3303
+ const columnDefs = react.useMemo(() => {
3304
+ var _a, _b, _c;
3305
+ return prepareColumns({
3306
+ aggregationFns: tableOptions.aggregationFns,
3307
+ columnDefs: [...displayColumns, ...tableOptions.columns],
3308
+ columnFilterFns: (_b = (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnFilterFns) !== null && _b !== void 0 ? _b : columnFilterFns,
3309
+ defaultDisplayColumn: (_c = tableOptions.defaultDisplayColumn) !== null && _c !== void 0 ? _c : {},
3310
+ filterFns: tableOptions.filterFns,
3311
+ sortingFns: tableOptions.sortingFns,
3312
+ });
3313
+ }, [
3314
+ columnFilterFns,
3315
+ displayColumns,
3316
+ tableOptions.columns,
3317
+ (_t = tableOptions.state) === null || _t === void 0 ? void 0 : _t.columnFilterFns,
3318
+ ]);
3319
+ const data = react.useMemo(() => {
3320
+ var _a, _b, _c, _d, _e;
3321
+ return (((_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.isLoading) || ((_b = tableOptions.state) === null || _b === void 0 ? void 0 : _b.showSkeletons)) &&
3322
+ !tableOptions.data.length
3323
+ ? [
3324
+ ...Array(((_d = (_c = tableOptions.state) === null || _c === void 0 ? void 0 : _c.pagination) === null || _d === void 0 ? void 0 : _d.pageSize) ||
3325
+ ((_e = initialState === null || initialState === void 0 ? void 0 : initialState.pagination) === null || _e === void 0 ? void 0 : _e.pageSize) ||
3326
+ 10).fill(null),
3327
+ ].map(() => Object.assign({}, ...getAllLeafColumnDefs(tableOptions.columns).map((col) => ({
3328
+ [getColumnId(col)]: null,
3329
+ }))))
3330
+ : tableOptions.data;
3331
+ }, [
3332
+ tableOptions.data,
3333
+ (_u = tableOptions.state) === null || _u === void 0 ? void 0 : _u.isLoading,
3334
+ (_v = tableOptions.state) === null || _v === void 0 ? void 0 : _v.showSkeletons,
3335
+ ]);
3336
+ //@ts-ignore
3337
+ const table = reactTable.useReactTable(Object.assign(Object.assign({ getCoreRowModel: reactTable.getCoreRowModel(), getExpandedRowModel: tableOptions.enableExpanding || tableOptions.enableGrouping
3338
+ ? reactTable.getExpandedRowModel()
3339
+ : undefined, getFacetedMinMaxValues: tableOptions.enableFacetedValues
3340
+ ? reactTable.getFacetedMinMaxValues()
3341
+ : undefined, getFacetedRowModel: tableOptions.enableFacetedValues
3342
+ ? reactTable.getFacetedRowModel()
3343
+ : undefined, getFacetedUniqueValues: tableOptions.enableFacetedValues
3344
+ ? reactTable.getFacetedUniqueValues()
3345
+ : undefined, getFilteredRowModel: tableOptions.enableColumnFilters ||
3346
+ tableOptions.enableGlobalFilter ||
3347
+ tableOptions.enableFilters
3348
+ ? reactTable.getFilteredRowModel()
3349
+ : undefined, getGroupedRowModel: tableOptions.enableGrouping
3350
+ ? reactTable.getGroupedRowModel()
3351
+ : undefined, getPaginationRowModel: tableOptions.enablePagination
3352
+ ? reactTable.getPaginationRowModel()
3353
+ : undefined, getSortedRowModel: tableOptions.enableSorting
3354
+ ? reactTable.getSortedRowModel()
3355
+ : undefined, getSubRows: (row) => row === null || row === void 0 ? void 0 : row.subRows, onColumnOrderChange: setColumnOrder, onGroupingChange: setGrouping }, tableOptions), {
3356
+ //@ts-ignore
3357
+ columns: columnDefs, data, globalFilterFn: (_w = tableOptions.filterFns) === null || _w === void 0 ? void 0 : _w[globalFilterFn !== null && globalFilterFn !== void 0 ? globalFilterFn : 'fuzzy'], initialState, state: Object.assign({ columnFilterFns,
3358
+ columnOrder,
3359
+ creatingRow,
3360
+ density,
3361
+ draggingColumn,
3362
+ draggingRow,
3363
+ editingCell,
3364
+ editingRow,
3365
+ globalFilterFn,
3366
+ grouping,
3367
+ hoveredColumn,
3368
+ hoveredRow,
3369
+ isFullScreen,
3370
+ showAlertBanner,
3371
+ showColumnFilters,
3372
+ showGlobalFilter,
3373
+ showToolbarDropZone }, tableOptions.state) }));
3374
+ // @ts-ignore
3375
+ table.refs = {
3376
+ // @ts-ignore
3377
+ bottomToolbarRef,
3378
+ editInputRefs,
3379
+ filterInputRefs,
3380
+ // @ts-ignore
3381
+ searchInputRef,
3382
+ // @ts-ignore
3383
+ tableContainerRef,
3384
+ // @ts-ignore
3385
+ tableFooterRef,
3386
+ tableHeadCellRefs,
3387
+ // @ts-ignore
3388
+ tableHeadRef,
3389
+ // @ts-ignore
3390
+ tablePaperRef,
3391
+ // @ts-ignore
3392
+ topToolbarRef,
3393
+ };
3394
+ const setCreatingRow = (row) => {
3395
+ var _a, _b;
3396
+ let _row = row;
3397
+ if (row === true) {
3398
+ _row = createRow(table);
3399
+ }
3400
+ (_b = (_a = tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.onCreatingRowChange) === null || _a === void 0 ? void 0 : _a.call(tableOptions, _row)) !== null && _b !== void 0 ? _b : _setCreatingRow(_row);
3401
+ };
3402
+ table.setCreatingRow = setCreatingRow;
3403
+ table.setColumnFilterFns =
3404
+ (_x = tableOptions.onColumnFilterFnsChange) !== null && _x !== void 0 ? _x : setColumnFilterFns;
3405
+ table.setDensity = (_y = tableOptions.onDensityChange) !== null && _y !== void 0 ? _y : setDensity;
3406
+ table.setDraggingColumn =
3407
+ (_z = tableOptions.onDraggingColumnChange) !== null && _z !== void 0 ? _z : setDraggingColumn;
3408
+ table.setDraggingRow = (_0 = tableOptions.onDraggingRowChange) !== null && _0 !== void 0 ? _0 : setDraggingRow;
3409
+ table.setEditingCell = (_1 = tableOptions.onEditingCellChange) !== null && _1 !== void 0 ? _1 : setEditingCell;
3410
+ table.setEditingRow = (_2 = tableOptions.onEditingRowChange) !== null && _2 !== void 0 ? _2 : setEditingRow;
3411
+ table.setGlobalFilterFn =
3412
+ (_3 = tableOptions.onGlobalFilterFnChange) !== null && _3 !== void 0 ? _3 : setGlobalFilterFn;
3413
+ table.setHoveredColumn =
3414
+ (_4 = tableOptions.onHoveredColumnChange) !== null && _4 !== void 0 ? _4 : setHoveredColumn;
3415
+ table.setHoveredRow = (_5 = tableOptions.onHoveredRowChange) !== null && _5 !== void 0 ? _5 : setHoveredRow;
3416
+ table.setIsFullScreen = (_6 = tableOptions.onIsFullScreenChange) !== null && _6 !== void 0 ? _6 : setIsFullScreen;
3417
+ table.setShowAlertBanner =
3418
+ (_7 = tableOptions.onShowAlertBannerChange) !== null && _7 !== void 0 ? _7 : setShowAlertBanner;
3419
+ table.setShowColumnFilters =
3420
+ (_8 = tableOptions.onShowColumnFiltersChange) !== null && _8 !== void 0 ? _8 : setShowColumnFilters;
3421
+ table.setShowGlobalFilter =
3422
+ (_9 = tableOptions.onShowGlobalFilterChange) !== null && _9 !== void 0 ? _9 : setShowGlobalFilter;
3423
+ table.setShowToolbarDropZone =
3424
+ (_10 = tableOptions.onShowToolbarDropZoneChange) !== null && _10 !== void 0 ? _10 : setShowToolbarDropZone;
3425
+ useMRT_Effects(table);
3426
+ return table;
3283
3427
  };
3284
3428
 
3285
- const MRT_DefaultColumn = {
3286
- filterVariant: 'text',
3287
- maxSize: 1000,
3288
- minSize: 40,
3289
- size: 180,
3429
+ const MRT_AggregationFns = Object.assign({}, reactTable.aggregationFns);
3430
+
3431
+ const fuzzy = (row, columnId, filterValue, addMeta) => {
3432
+ const itemRank = matchSorterUtils.rankItem(row.getValue(columnId), filterValue, {
3433
+ threshold: matchSorterUtils.rankings.MATCHES,
3434
+ });
3435
+ addMeta(itemRank);
3436
+ return itemRank.passed;
3290
3437
  };
3291
- const MRT_DefaultDisplayColumn = {
3292
- columnDefType: 'display',
3438
+ fuzzy.autoRemove = (val) => !val;
3439
+ const contains = (row, id, filterValue) => row
3440
+ .getValue(id)
3441
+ .toString()
3442
+ .toLowerCase()
3443
+ .trim()
3444
+ .includes(filterValue.toString().toLowerCase().trim());
3445
+ contains.autoRemove = (val) => !val;
3446
+ const startsWith = (row, id, filterValue) => row
3447
+ .getValue(id)
3448
+ .toString()
3449
+ .toLowerCase()
3450
+ .trim()
3451
+ .startsWith(filterValue.toString().toLowerCase().trim());
3452
+ startsWith.autoRemove = (val) => !val;
3453
+ const endsWith = (row, id, filterValue) => row
3454
+ .getValue(id)
3455
+ .toString()
3456
+ .toLowerCase()
3457
+ .trim()
3458
+ .endsWith(filterValue.toString().toLowerCase().trim());
3459
+ endsWith.autoRemove = (val) => !val;
3460
+ const equals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() ===
3461
+ (filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
3462
+ equals.autoRemove = (val) => !val;
3463
+ const notEquals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() !==
3464
+ filterValue.toString().toLowerCase().trim();
3465
+ notEquals.autoRemove = (val) => !val;
3466
+ const greaterThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id))
3467
+ ? +row.getValue(id) > +filterValue
3468
+ : row.getValue(id).toString().toLowerCase().trim() >
3469
+ (filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
3470
+ greaterThan.autoRemove = (val) => !val;
3471
+ const greaterThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || greaterThan(row, id, filterValue);
3472
+ greaterThanOrEqualTo.autoRemove = (val) => !val;
3473
+ const lessThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id))
3474
+ ? +row.getValue(id) < +filterValue
3475
+ : row.getValue(id).toString().toLowerCase().trim() <
3476
+ (filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
3477
+ lessThan.autoRemove = (val) => !val;
3478
+ const lessThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || lessThan(row, id, filterValue);
3479
+ lessThanOrEqualTo.autoRemove = (val) => !val;
3480
+ const between = (row, id, filterValues) => (['', undefined].includes(filterValues[0]) ||
3481
+ greaterThan(row, id, filterValues[0])) &&
3482
+ ((!isNaN(+filterValues[0]) &&
3483
+ !isNaN(+filterValues[1]) &&
3484
+ +filterValues[0] > +filterValues[1]) ||
3485
+ ['', undefined].includes(filterValues[1]) ||
3486
+ lessThan(row, id, filterValues[1]));
3487
+ between.autoRemove = (val) => !val;
3488
+ const betweenInclusive = (row, id, filterValues) => (['', undefined].includes(filterValues[0]) ||
3489
+ greaterThanOrEqualTo(row, id, filterValues[0])) &&
3490
+ ((!isNaN(+filterValues[0]) &&
3491
+ !isNaN(+filterValues[1]) &&
3492
+ +filterValues[0] > +filterValues[1]) ||
3493
+ ['', undefined].includes(filterValues[1]) ||
3494
+ lessThanOrEqualTo(row, id, filterValues[1]));
3495
+ betweenInclusive.autoRemove = (val) => !val;
3496
+ const empty = (row, id, _filterValue) => !row.getValue(id).toString().trim();
3497
+ empty.autoRemove = (val) => !val;
3498
+ const notEmpty = (row, id, _filterValue) => !!row.getValue(id).toString().trim();
3499
+ notEmpty.autoRemove = (val) => !val;
3500
+ const MRT_FilterFns = Object.assign(Object.assign({}, reactTable.filterFns), { between,
3501
+ betweenInclusive,
3502
+ contains,
3503
+ empty,
3504
+ endsWith,
3505
+ equals,
3506
+ fuzzy,
3507
+ greaterThan,
3508
+ greaterThanOrEqualTo,
3509
+ lessThan,
3510
+ lessThanOrEqualTo,
3511
+ notEmpty,
3512
+ notEquals,
3513
+ startsWith });
3514
+
3515
+ const MRT_Default_Icons = {
3516
+ ArrowDownwardIcon: ArrowDownwardIcon__default["default"],
3517
+ ArrowRightIcon: ArrowRightIcon__default["default"],
3518
+ CancelIcon: CancelIcon__default["default"],
3519
+ ChevronLeftIcon: ChevronLeftIcon__default["default"],
3520
+ ChevronRightIcon: ChevronRightIcon__default["default"],
3521
+ ClearAllIcon: ClearAllIcon__default["default"],
3522
+ CloseIcon: CloseIcon__default["default"],
3523
+ DensityLargeIcon: DensityLargeIcon__default["default"],
3524
+ DensityMediumIcon: DensityMediumIcon__default["default"],
3525
+ DensitySmallIcon: DensitySmallIcon__default["default"],
3526
+ DragHandleIcon: DragHandleIcon__default["default"],
3527
+ DynamicFeedIcon: DynamicFeedIcon__default["default"],
3528
+ EditIcon: EditIcon__default["default"],
3529
+ ExpandMoreIcon: ExpandMoreIcon__default["default"],
3530
+ FilterAltIcon: FilterAltIcon__default["default"],
3531
+ FilterListIcon: FilterListIcon__default["default"],
3532
+ FilterListOffIcon: FilterListOffIcon__default["default"],
3533
+ FirstPageIcon: FirstPageIcon__default["default"],
3534
+ FullscreenExitIcon: FullscreenExitIcon__default["default"],
3535
+ FullscreenIcon: FullscreenIcon__default["default"],
3536
+ KeyboardDoubleArrowDownIcon: KeyboardDoubleArrowDownIcon__default["default"],
3537
+ LastPageIcon: LastPageIcon__default["default"],
3538
+ MoreHorizIcon: MoreHorizIcon__default["default"],
3539
+ MoreVertIcon: MoreVertIcon__default["default"],
3540
+ PushPinIcon: PushPinIcon__default["default"],
3541
+ RestartAltIcon: RestartAltIcon__default["default"],
3542
+ SaveIcon: SaveIcon__default["default"],
3543
+ SearchIcon: SearchIcon__default["default"],
3544
+ SearchOffIcon: SearchOffIcon__default["default"],
3545
+ SortIcon: SortIcon__default["default"],
3546
+ SyncAltIcon: SyncAltIcon__default["default"],
3547
+ ViewColumnIcon: ViewColumnIcon__default["default"],
3548
+ VisibilityOffIcon: VisibilityOffIcon__default["default"],
3549
+ };
3550
+
3551
+ const MRT_Localization_EN = {
3552
+ actions: 'Actions',
3553
+ and: 'and',
3554
+ cancel: 'Cancel',
3555
+ changeFilterMode: 'Change filter mode',
3556
+ changeSearchMode: 'Change search mode',
3557
+ clearFilter: 'Clear filter',
3558
+ clearSearch: 'Clear search',
3559
+ clearSort: 'Clear sort',
3560
+ clickToCopy: 'Click to copy',
3561
+ collapse: 'Collapse',
3562
+ collapseAll: 'Collapse all',
3563
+ columnActions: 'Column Actions',
3564
+ copiedToClipboard: 'Copied to clipboard',
3565
+ dropToGroupBy: 'Drop to group by {column}',
3566
+ edit: 'Edit',
3567
+ expand: 'Expand',
3568
+ expandAll: 'Expand all',
3569
+ filterArrIncludes: 'Includes',
3570
+ filterArrIncludesAll: 'Includes all',
3571
+ filterArrIncludesSome: 'Includes',
3572
+ filterBetween: 'Between',
3573
+ filterBetweenInclusive: 'Between Inclusive',
3574
+ filterByColumn: 'Filter by {column}',
3575
+ filterContains: 'Contains',
3576
+ filterEmpty: 'Empty',
3577
+ filterEndsWith: 'Ends With',
3578
+ filterEquals: 'Equals',
3579
+ filterEqualsString: 'Equals',
3580
+ filterFuzzy: 'Fuzzy',
3581
+ filterGreaterThan: 'Greater Than',
3582
+ filterGreaterThanOrEqualTo: 'Greater Than Or Equal To',
3583
+ filterInNumberRange: 'Between',
3584
+ filterIncludesString: 'Contains',
3585
+ filterIncludesStringSensitive: 'Contains',
3586
+ filterLessThan: 'Less Than',
3587
+ filterLessThanOrEqualTo: 'Less Than Or Equal To',
3588
+ filterMode: 'Filter Mode: {filterType}',
3589
+ filterNotEmpty: 'Not Empty',
3590
+ filterNotEquals: 'Not Equals',
3591
+ filterStartsWith: 'Starts With',
3592
+ filterWeakEquals: 'Equals',
3593
+ filteringByColumn: 'Filtering by {column} - {filterType} {filterValue}',
3594
+ goToFirstPage: 'Go to first page',
3595
+ goToLastPage: 'Go to last page',
3596
+ goToNextPage: 'Go to next page',
3597
+ goToPreviousPage: 'Go to previous page',
3598
+ grab: 'Grab',
3599
+ groupByColumn: 'Group by {column}',
3600
+ groupedBy: 'Grouped by ',
3601
+ hideAll: 'Hide all',
3602
+ hideColumn: 'Hide {column} column',
3603
+ max: 'Max',
3604
+ min: 'Min',
3605
+ move: 'Move',
3606
+ noRecordsToDisplay: 'No records to display',
3607
+ noResultsFound: 'No results found',
3608
+ of: 'of',
3609
+ or: 'or',
3610
+ pin: 'Pin',
3611
+ pinToLeft: 'Pin to left',
3612
+ pinToRight: 'Pin to right',
3613
+ resetColumnSize: 'Reset column size',
3614
+ resetOrder: 'Reset order',
3615
+ rowActions: 'Row Actions',
3616
+ rowNumber: '#',
3617
+ rowNumbers: 'Row Numbers',
3618
+ rowsPerPage: 'Rows per page',
3619
+ save: 'Save',
3620
+ search: 'Search',
3621
+ selectedCountOfRowCountRowsSelected: '{selectedCount} of {rowCount} row(s) selected',
3622
+ select: 'Select',
3623
+ showAll: 'Show all',
3624
+ showAllColumns: 'Show all columns',
3625
+ showHideColumns: 'Show/Hide columns',
3626
+ showHideFilters: 'Show/Hide filters',
3627
+ showHideSearch: 'Show/Hide search',
3628
+ sortByColumnAsc: 'Sort by {column} ascending',
3629
+ sortByColumnDesc: 'Sort by {column} descending',
3630
+ sortedByColumnAsc: 'Sorted by {column} ascending',
3631
+ sortedByColumnDesc: 'Sorted by {column} descending',
3632
+ thenBy: ', then by ',
3633
+ toggleDensity: 'Toggle density',
3634
+ toggleFullScreen: 'Toggle full screen',
3635
+ toggleSelectAll: 'Toggle select all',
3636
+ toggleSelectRow: 'Toggle select row',
3637
+ toggleVisibility: 'Toggle visibility',
3638
+ ungroupByColumn: 'Ungroup by {column}',
3639
+ unpin: 'Unpin',
3640
+ unpinAll: 'Unpin all',
3641
+ };
3642
+
3643
+ const MRT_DefaultColumn = {
3644
+ filterVariant: 'text',
3645
+ maxSize: 1000,
3646
+ minSize: 40,
3647
+ size: 180,
3648
+ };
3649
+ const MRT_DefaultDisplayColumn = {
3650
+ columnDefType: 'display',
3293
3651
  enableClickToCopy: false,
3294
3652
  enableColumnActions: false,
3295
3653
  enableColumnDragging: false,
@@ -3377,307 +3735,6 @@ const useMRT_TableOptions = (_a) => {
3377
3735
  selectAllMode, sortingFns: _sortingFns }, rest);
3378
3736
  };
3379
3737
 
3380
- const blankColProps = {
3381
- children: null,
3382
- sx: {
3383
- flex: '1 0 auto',
3384
- minWidth: 0,
3385
- p: 0,
3386
- width: 0,
3387
- },
3388
- };
3389
- const useMRT_DisplayColumns = ({ columnOrder, creatingRow, grouping, tableOptions, }) => {
3390
- var _a, _b;
3391
- return react.useMemo(() => {
3392
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
3393
- return [
3394
- ((_b = (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnOrder) !== null && _b !== void 0 ? _b : columnOrder).includes('mrt-row-pin') && Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_TableBodyRowPinButton, { row: row, table: table })), header: tableOptions.localization.pin, size: 60 }, (_c = tableOptions.displayColumnDefOptions) === null || _c === void 0 ? void 0 : _c['mrt-row-pin']), { columnDefType: 'display', id: 'mrt-row-pin' }),
3395
- ((_e = (_d = tableOptions.state) === null || _d === void 0 ? void 0 : _d.columnOrder) !== null && _e !== void 0 ? _e : columnOrder).includes('mrt-row-drag') && Object.assign(Object.assign({ Cell: ({ row, rowRef, table }) => (jsxRuntime.jsx(MRT_TableBodyRowGrabHandle, { row: row, rowRef: rowRef, table: table })), header: tableOptions.localization.move, size: 60 }, (_f = tableOptions.displayColumnDefOptions) === null || _f === void 0 ? void 0 : _f['mrt-row-drag']), { columnDefType: 'display', id: 'mrt-row-drag' }),
3396
- (((_h = (_g = tableOptions.state) === null || _g === void 0 ? void 0 : _g.columnOrder) !== null && _h !== void 0 ? _h : columnOrder).includes('mrt-row-actions') ||
3397
- (creatingRow && tableOptions.createDisplayMode === 'row')) && Object.assign(Object.assign({ Cell: ({ cell, row, table }) => (jsxRuntime.jsx(MRT_ToggleRowActionMenuButton, { cell: cell, row: row, table: table })), header: tableOptions.localization.actions, size: 70 }, (_j = tableOptions.displayColumnDefOptions) === null || _j === void 0 ? void 0 : _j['mrt-row-actions']), { columnDefType: 'display', id: 'mrt-row-actions' }),
3398
- ((_l = (_k = tableOptions.state) === null || _k === void 0 ? void 0 : _k.columnOrder) !== null && _l !== void 0 ? _l : columnOrder).includes('mrt-row-expand') &&
3399
- showExpandColumn(tableOptions, (_o = (_m = tableOptions.state) === null || _m === void 0 ? void 0 : _m.grouping) !== null && _o !== void 0 ? _o : grouping) && Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_ExpandButton, { row: row, table: table })), Header: tableOptions.enableExpandAll
3400
- ? ({ table }) => jsxRuntime.jsx(MRT_ExpandAllButton, { table: table })
3401
- : null, header: tableOptions.localization.expand, size: 60 }, (_p = tableOptions.displayColumnDefOptions) === null || _p === void 0 ? void 0 : _p['mrt-row-expand']), { columnDefType: 'display', id: 'mrt-row-expand' }),
3402
- ((_r = (_q = tableOptions.state) === null || _q === void 0 ? void 0 : _q.columnOrder) !== null && _r !== void 0 ? _r : columnOrder).includes('mrt-row-select') && Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_SelectCheckbox, { row: row, table: table })), Header: tableOptions.enableSelectAll &&
3403
- tableOptions.enableMultiRowSelection
3404
- ? ({ table }) => jsxRuntime.jsx(MRT_SelectCheckbox, { selectAll: true, table: table })
3405
- : null, header: tableOptions.localization.select, size: 60 }, (_s = tableOptions.displayColumnDefOptions) === null || _s === void 0 ? void 0 : _s['mrt-row-select']), { columnDefType: 'display', id: 'mrt-row-select' }),
3406
- ((_u = (_t = tableOptions.state) === null || _t === void 0 ? void 0 : _t.columnOrder) !== null && _u !== void 0 ? _u : columnOrder).includes('mrt-row-numbers') && Object.assign(Object.assign({ Cell: ({ row }) => row.index + 1, Header: () => tableOptions.localization.rowNumber, header: tableOptions.localization.rowNumbers, size: 60 }, (_v = tableOptions.displayColumnDefOptions) === null || _v === void 0 ? void 0 : _v['mrt-row-numbers']), { columnDefType: 'display', id: 'mrt-row-numbers' }),
3407
- ((_x = (_w = tableOptions.state) === null || _w === void 0 ? void 0 : _w.columnOrder) !== null && _x !== void 0 ? _x : columnOrder).includes('mrt-row-spacer') && Object.assign(Object.assign(Object.assign({}, (_y = tableOptions.displayColumnDefOptions) === null || _y === void 0 ? void 0 : _y['mrt-row-spacer']), MRT_DefaultDisplayColumn), { columnDefType: 'display', header: '', id: 'mrt-row-spacer', muiTableBodyCellProps: blankColProps, muiTableFooterCellProps: blankColProps, muiTableHeadCellProps: blankColProps }),
3408
- ].filter(Boolean);
3409
- }, [
3410
- columnOrder,
3411
- grouping,
3412
- tableOptions.displayColumnDefOptions,
3413
- tableOptions.editDisplayMode,
3414
- tableOptions.enableColumnDragging,
3415
- tableOptions.enableColumnFilterModes,
3416
- tableOptions.enableColumnOrdering,
3417
- tableOptions.enableEditing,
3418
- tableOptions.enableExpandAll,
3419
- tableOptions.enableExpanding,
3420
- tableOptions.enableGrouping,
3421
- tableOptions.enableRowActions,
3422
- tableOptions.enableRowDragging,
3423
- tableOptions.enableRowNumbers,
3424
- tableOptions.enableRowOrdering,
3425
- tableOptions.enableRowSelection,
3426
- tableOptions.enableSelectAll,
3427
- tableOptions.localization,
3428
- tableOptions.positionActionsColumn,
3429
- tableOptions.renderDetailPanel,
3430
- tableOptions.renderRowActionMenuItems,
3431
- tableOptions.renderRowActions,
3432
- (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnOrder,
3433
- (_b = tableOptions.state) === null || _b === void 0 ? void 0 : _b.grouping,
3434
- ]);
3435
- };
3436
-
3437
- const useMRT_Effects = (table) => {
3438
- const { getIsSomeRowsPinned, getState, options: { enablePagination, enableRowPinning, rowCount }, } = table;
3439
- const { density, globalFilter, isFullScreen, isLoading, pagination, showSkeletons, sorting, } = getState();
3440
- const rerender = react.useReducer(() => ({}), {})[1];
3441
- const isMounted = react.useRef(false);
3442
- const initialBodyHeight = react.useRef();
3443
- const previousTop = react.useRef();
3444
- react.useEffect(() => {
3445
- if (typeof window !== 'undefined') {
3446
- initialBodyHeight.current = document.body.style.height;
3447
- }
3448
- }, []);
3449
- react.useEffect(() => {
3450
- if (isMounted && typeof window !== 'undefined') {
3451
- if (isFullScreen) {
3452
- previousTop.current = document.body.getBoundingClientRect().top; //save scroll position
3453
- document.body.style.height = '100vh'; //hide page scrollbars when table is in full screen mode
3454
- }
3455
- else {
3456
- document.body.style.height = initialBodyHeight.current;
3457
- if (!previousTop.current)
3458
- return;
3459
- //restore scroll position
3460
- window.scrollTo({
3461
- behavior: 'instant',
3462
- top: -1 * previousTop.current,
3463
- });
3464
- }
3465
- }
3466
- isMounted.current = true;
3467
- }, [isFullScreen]);
3468
- //if page index is out of bounds, set it to the last page
3469
- react.useEffect(() => {
3470
- if (!enablePagination || isLoading || showSkeletons)
3471
- return;
3472
- const { pageIndex, pageSize } = pagination;
3473
- const totalRowCount = rowCount !== null && rowCount !== void 0 ? rowCount : table.getPrePaginationRowModel().rows.length;
3474
- const firstVisibleRowIndex = pageIndex * pageSize;
3475
- if (firstVisibleRowIndex > totalRowCount) {
3476
- table.setPageIndex(Math.floor(totalRowCount / pageSize));
3477
- }
3478
- }, [rowCount, table.getPrePaginationRowModel().rows.length]);
3479
- //turn off sort when global filter is looking for ranked results
3480
- const appliedSort = react.useRef(sorting);
3481
- react.useEffect(() => {
3482
- if (sorting.length) {
3483
- appliedSort.current = sorting;
3484
- }
3485
- }, [sorting]);
3486
- react.useEffect(() => {
3487
- if (!getCanRankRows(table))
3488
- return;
3489
- if (globalFilter) {
3490
- table.setSorting([]);
3491
- }
3492
- else {
3493
- table.setSorting(() => appliedSort.current || []);
3494
- }
3495
- }, [globalFilter]);
3496
- react.useEffect(() => {
3497
- if (enableRowPinning && getIsSomeRowsPinned()) {
3498
- setTimeout(() => {
3499
- rerender();
3500
- }, 150);
3501
- }
3502
- }, [density]);
3503
- };
3504
-
3505
- const useMRT_TableInstance = (tableOptions) => {
3506
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10;
3507
- const bottomToolbarRef = react.useRef(null);
3508
- const editInputRefs = react.useRef({});
3509
- const filterInputRefs = react.useRef({});
3510
- const searchInputRef = react.useRef(null);
3511
- const tableContainerRef = react.useRef(null);
3512
- const tableHeadCellRefs = react.useRef({});
3513
- const tablePaperRef = react.useRef(null);
3514
- const topToolbarRef = react.useRef(null);
3515
- const tableHeadRef = react.useRef(null);
3516
- const tableFooterRef = react.useRef(null);
3517
- const initialState = react.useMemo(() => {
3518
- var _a, _b, _c;
3519
- const initState = (_a = tableOptions.initialState) !== null && _a !== void 0 ? _a : {};
3520
- initState.columnOrder =
3521
- (_b = initState.columnOrder) !== null && _b !== void 0 ? _b : getDefaultColumnOrderIds(tableOptions);
3522
- initState.globalFilterFn = (_c = tableOptions.globalFilterFn) !== null && _c !== void 0 ? _c : 'fuzzy';
3523
- return initState;
3524
- }, []);
3525
- const [creatingRow, _setCreatingRow] = react.useState((_a = initialState.creatingRow) !== null && _a !== void 0 ? _a : null);
3526
- const [columnFilterFns, setColumnFilterFns] = react.useState(() => Object.assign({}, ...getAllLeafColumnDefs(tableOptions.columns).map((col) => {
3527
- var _a, _b, _c, _d;
3528
- return ({
3529
- [getColumnId(col)]: col.filterFn instanceof Function
3530
- ? (_a = col.filterFn.name) !== null && _a !== void 0 ? _a : 'custom'
3531
- : (_d = (_b = col.filterFn) !== null && _b !== void 0 ? _b : (_c = initialState === null || initialState === void 0 ? void 0 : initialState.columnFilterFns) === null || _c === void 0 ? void 0 : _c[getColumnId(col)]) !== null && _d !== void 0 ? _d : getDefaultColumnFilterFn(col),
3532
- });
3533
- })));
3534
- const [columnOrder, setColumnOrder] = react.useState((_b = initialState.columnOrder) !== null && _b !== void 0 ? _b : []);
3535
- const [density, setDensity] = react.useState((_c = initialState === null || initialState === void 0 ? void 0 : initialState.density) !== null && _c !== void 0 ? _c : 'comfortable');
3536
- const [draggingColumn, setDraggingColumn] = react.useState((_d = initialState.draggingColumn) !== null && _d !== void 0 ? _d : null);
3537
- const [draggingRow, setDraggingRow] = react.useState((_e = initialState.draggingRow) !== null && _e !== void 0 ? _e : null);
3538
- const [editingCell, setEditingCell] = react.useState((_f = initialState.editingCell) !== null && _f !== void 0 ? _f : null);
3539
- const [editingRow, setEditingRow] = react.useState((_g = initialState.editingRow) !== null && _g !== void 0 ? _g : null);
3540
- const [globalFilterFn, setGlobalFilterFn] = react.useState((_h = initialState.globalFilterFn) !== null && _h !== void 0 ? _h : 'fuzzy');
3541
- const [grouping, setGrouping] = react.useState((_j = initialState.grouping) !== null && _j !== void 0 ? _j : []);
3542
- const [hoveredColumn, setHoveredColumn] = react.useState((_k = initialState.hoveredColumn) !== null && _k !== void 0 ? _k : null);
3543
- const [hoveredRow, setHoveredRow] = react.useState((_l = initialState.hoveredRow) !== null && _l !== void 0 ? _l : null);
3544
- const [isFullScreen, setIsFullScreen] = react.useState((_m = initialState === null || initialState === void 0 ? void 0 : initialState.isFullScreen) !== null && _m !== void 0 ? _m : false);
3545
- const [showAlertBanner, setShowAlertBanner] = react.useState((_p = (_o = tableOptions.initialState) === null || _o === void 0 ? void 0 : _o.showAlertBanner) !== null && _p !== void 0 ? _p : false);
3546
- const [showColumnFilters, setShowColumnFilters] = react.useState((_q = initialState === null || initialState === void 0 ? void 0 : initialState.showColumnFilters) !== null && _q !== void 0 ? _q : false);
3547
- const [showGlobalFilter, setShowGlobalFilter] = react.useState((_r = initialState === null || initialState === void 0 ? void 0 : initialState.showGlobalFilter) !== null && _r !== void 0 ? _r : false);
3548
- const [showToolbarDropZone, setShowToolbarDropZone] = react.useState((_s = initialState === null || initialState === void 0 ? void 0 : initialState.showToolbarDropZone) !== null && _s !== void 0 ? _s : false);
3549
- const displayColumns = useMRT_DisplayColumns({
3550
- columnOrder,
3551
- creatingRow,
3552
- grouping,
3553
- tableOptions,
3554
- });
3555
- const columnDefs = react.useMemo(() => {
3556
- var _a, _b, _c;
3557
- return prepareColumns({
3558
- aggregationFns: tableOptions.aggregationFns,
3559
- columnDefs: [...displayColumns, ...tableOptions.columns],
3560
- columnFilterFns: (_b = (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnFilterFns) !== null && _b !== void 0 ? _b : columnFilterFns,
3561
- defaultDisplayColumn: (_c = tableOptions.defaultDisplayColumn) !== null && _c !== void 0 ? _c : {},
3562
- filterFns: tableOptions.filterFns,
3563
- sortingFns: tableOptions.sortingFns,
3564
- });
3565
- }, [
3566
- columnFilterFns,
3567
- displayColumns,
3568
- tableOptions.columns,
3569
- (_t = tableOptions.state) === null || _t === void 0 ? void 0 : _t.columnFilterFns,
3570
- ]);
3571
- const data = react.useMemo(() => {
3572
- var _a, _b, _c, _d, _e;
3573
- return (((_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.isLoading) || ((_b = tableOptions.state) === null || _b === void 0 ? void 0 : _b.showSkeletons)) &&
3574
- !tableOptions.data.length
3575
- ? [
3576
- ...Array(((_d = (_c = tableOptions.state) === null || _c === void 0 ? void 0 : _c.pagination) === null || _d === void 0 ? void 0 : _d.pageSize) ||
3577
- ((_e = initialState === null || initialState === void 0 ? void 0 : initialState.pagination) === null || _e === void 0 ? void 0 : _e.pageSize) ||
3578
- 10).fill(null),
3579
- ].map(() => Object.assign({}, ...getAllLeafColumnDefs(tableOptions.columns).map((col) => ({
3580
- [getColumnId(col)]: null,
3581
- }))))
3582
- : tableOptions.data;
3583
- }, [
3584
- tableOptions.data,
3585
- (_u = tableOptions.state) === null || _u === void 0 ? void 0 : _u.isLoading,
3586
- (_v = tableOptions.state) === null || _v === void 0 ? void 0 : _v.showSkeletons,
3587
- ]);
3588
- //@ts-ignore
3589
- const table = reactTable.useReactTable(Object.assign(Object.assign({ getCoreRowModel: reactTable.getCoreRowModel(), getExpandedRowModel: tableOptions.enableExpanding || tableOptions.enableGrouping
3590
- ? reactTable.getExpandedRowModel()
3591
- : undefined, getFacetedMinMaxValues: tableOptions.enableFacetedValues
3592
- ? reactTable.getFacetedMinMaxValues()
3593
- : undefined, getFacetedRowModel: tableOptions.enableFacetedValues
3594
- ? reactTable.getFacetedRowModel()
3595
- : undefined, getFacetedUniqueValues: tableOptions.enableFacetedValues
3596
- ? reactTable.getFacetedUniqueValues()
3597
- : undefined, getFilteredRowModel: tableOptions.enableColumnFilters ||
3598
- tableOptions.enableGlobalFilter ||
3599
- tableOptions.enableFilters
3600
- ? reactTable.getFilteredRowModel()
3601
- : undefined, getGroupedRowModel: tableOptions.enableGrouping
3602
- ? reactTable.getGroupedRowModel()
3603
- : undefined, getPaginationRowModel: tableOptions.enablePagination
3604
- ? reactTable.getPaginationRowModel()
3605
- : undefined, getSortedRowModel: tableOptions.enableSorting
3606
- ? reactTable.getSortedRowModel()
3607
- : undefined, getSubRows: (row) => row === null || row === void 0 ? void 0 : row.subRows, onColumnOrderChange: setColumnOrder, onGroupingChange: setGrouping }, tableOptions), {
3608
- //@ts-ignore
3609
- columns: columnDefs, data, globalFilterFn: (_w = tableOptions.filterFns) === null || _w === void 0 ? void 0 : _w[globalFilterFn !== null && globalFilterFn !== void 0 ? globalFilterFn : 'fuzzy'], initialState, state: Object.assign({ columnFilterFns,
3610
- columnOrder,
3611
- creatingRow,
3612
- density,
3613
- draggingColumn,
3614
- draggingRow,
3615
- editingCell,
3616
- editingRow,
3617
- globalFilterFn,
3618
- grouping,
3619
- hoveredColumn,
3620
- hoveredRow,
3621
- isFullScreen,
3622
- showAlertBanner,
3623
- showColumnFilters,
3624
- showGlobalFilter,
3625
- showToolbarDropZone }, tableOptions.state) }));
3626
- // @ts-ignore
3627
- table.refs = {
3628
- // @ts-ignore
3629
- bottomToolbarRef,
3630
- editInputRefs,
3631
- filterInputRefs,
3632
- // @ts-ignore
3633
- searchInputRef,
3634
- // @ts-ignore
3635
- tableContainerRef,
3636
- // @ts-ignore
3637
- tableFooterRef,
3638
- tableHeadCellRefs,
3639
- // @ts-ignore
3640
- tableHeadRef,
3641
- // @ts-ignore
3642
- tablePaperRef,
3643
- // @ts-ignore
3644
- topToolbarRef,
3645
- };
3646
- const setCreatingRow = (row) => {
3647
- var _a, _b;
3648
- let _row = row;
3649
- if (row === true) {
3650
- _row = createRow(table);
3651
- }
3652
- (_b = (_a = tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.onCreatingRowChange) === null || _a === void 0 ? void 0 : _a.call(tableOptions, _row)) !== null && _b !== void 0 ? _b : _setCreatingRow(_row);
3653
- };
3654
- table.setCreatingRow = setCreatingRow;
3655
- table.setColumnFilterFns =
3656
- (_x = tableOptions.onColumnFilterFnsChange) !== null && _x !== void 0 ? _x : setColumnFilterFns;
3657
- table.setDensity = (_y = tableOptions.onDensityChange) !== null && _y !== void 0 ? _y : setDensity;
3658
- table.setDraggingColumn =
3659
- (_z = tableOptions.onDraggingColumnChange) !== null && _z !== void 0 ? _z : setDraggingColumn;
3660
- table.setDraggingRow = (_0 = tableOptions.onDraggingRowChange) !== null && _0 !== void 0 ? _0 : setDraggingRow;
3661
- table.setEditingCell = (_1 = tableOptions.onEditingCellChange) !== null && _1 !== void 0 ? _1 : setEditingCell;
3662
- table.setEditingRow = (_2 = tableOptions.onEditingRowChange) !== null && _2 !== void 0 ? _2 : setEditingRow;
3663
- table.setGlobalFilterFn =
3664
- (_3 = tableOptions.onGlobalFilterFnChange) !== null && _3 !== void 0 ? _3 : setGlobalFilterFn;
3665
- table.setHoveredColumn =
3666
- (_4 = tableOptions.onHoveredColumnChange) !== null && _4 !== void 0 ? _4 : setHoveredColumn;
3667
- table.setHoveredRow = (_5 = tableOptions.onHoveredRowChange) !== null && _5 !== void 0 ? _5 : setHoveredRow;
3668
- table.setIsFullScreen = (_6 = tableOptions.onIsFullScreenChange) !== null && _6 !== void 0 ? _6 : setIsFullScreen;
3669
- table.setShowAlertBanner =
3670
- (_7 = tableOptions.onShowAlertBannerChange) !== null && _7 !== void 0 ? _7 : setShowAlertBanner;
3671
- table.setShowColumnFilters =
3672
- (_8 = tableOptions.onShowColumnFiltersChange) !== null && _8 !== void 0 ? _8 : setShowColumnFilters;
3673
- table.setShowGlobalFilter =
3674
- (_9 = tableOptions.onShowGlobalFilterChange) !== null && _9 !== void 0 ? _9 : setShowGlobalFilter;
3675
- table.setShowToolbarDropZone =
3676
- (_10 = tableOptions.onShowToolbarDropZoneChange) !== null && _10 !== void 0 ? _10 : setShowToolbarDropZone;
3677
- useMRT_Effects(table);
3678
- return table;
3679
- };
3680
-
3681
3738
  const useMaterialReactTable = (tableOptions) => useMRT_TableInstance(useMRT_TableOptions(tableOptions));
3682
3739
 
3683
3740
  const isTableInstanceProp = (props) => props.table !== undefined;