@pdg/react-table 1.0.43 → 1.0.45

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.
@@ -95,4 +95,5 @@ export interface TableCommands<T = TableItem> {
95
95
  setItemsPaging(items: TableProps<T>['items'], paging: TableProps<T>['paging']): void;
96
96
  resetSort(): void;
97
97
  getCheckedItems(columnId: string): T[];
98
+ scrollToTop(): void;
98
99
  }
package/dist/index.esm.js CHANGED
@@ -8922,6 +8922,7 @@ var Table = React__default.forwardRef(function (_a, ref) {
8922
8922
  var localBodyDataRef = useRef({});
8923
8923
  var updateHeadCheckTimer = useRef();
8924
8924
  var fireOnCheckChangeTimer = useRef({});
8925
+ var simpleBarRef = useRef(null);
8925
8926
  // sortable --------------------------------------------------------------------------------------------------------
8926
8927
  var sensors = useSensors(useSensor(MouseSensor, {
8927
8928
  // Require the mouse to move by 10 pixels before activating
@@ -9063,6 +9064,10 @@ var Table = React__default.forwardRef(function (_a, ref) {
9063
9064
  }, 100);
9064
9065
  }
9065
9066
  }, [getCheckedItems, onCheckChange]);
9067
+ var simpleBarScrollToTop = useCallback(function () {
9068
+ var _a, _b;
9069
+ (_b = (_a = simpleBarRef.current) === null || _a === void 0 ? void 0 : _a.getScrollElement()) === null || _b === void 0 ? void 0 : _b.scrollTo({ top: 0 });
9070
+ }, []);
9066
9071
  // Effect ----------------------------------------------------------------------------------------------------------
9067
9072
  useEffect(function () {
9068
9073
  return function () {
@@ -9161,6 +9166,7 @@ var Table = React__default.forwardRef(function (_a, ref) {
9161
9166
  setSortableItems(makeSortableItems(lastItems_1));
9162
9167
  },
9163
9168
  getCheckedItems: getCheckedItems,
9169
+ scrollToTop: simpleBarScrollToTop,
9164
9170
  };
9165
9171
  if (typeof ref === 'function') {
9166
9172
  ref(commands);
@@ -9169,7 +9175,18 @@ var Table = React__default.forwardRef(function (_a, ref) {
9169
9175
  ref.current = commands;
9170
9176
  }
9171
9177
  }
9172
- }, [ref, columns, items, paging, makeSortableItems, setColumns, setItems, setPaging, getCheckedItems]);
9178
+ }, [
9179
+ ref,
9180
+ columns,
9181
+ items,
9182
+ paging,
9183
+ makeSortableItems,
9184
+ setColumns,
9185
+ setItems,
9186
+ setPaging,
9187
+ getCheckedItems,
9188
+ simpleBarScrollToTop,
9189
+ ]);
9173
9190
  // Event Handler ---------------------------------------------------------------------------------------------------
9174
9191
  var handleDragEnd = useCallback(function (event) {
9175
9192
  var active = event.active, over = event.over;
@@ -9216,6 +9233,10 @@ var Table = React__default.forwardRef(function (_a, ref) {
9216
9233
  var handleBodyCheckChange = useCallback(function (item, column) {
9217
9234
  updateHeadCheck(column);
9218
9235
  }, [updateHeadCheck]);
9236
+ var handlePageChange = useCallback(function (page) {
9237
+ simpleBarScrollToTop();
9238
+ onPageChange && onPageChange(page);
9239
+ }, [onPageChange, simpleBarScrollToTop]);
9219
9240
  // TableContext Function ---------------------------------------------------------------------------------------------
9220
9241
  var TableContextSetMenuOpen = useCallback(function (newMenuOpen, newOpenMenuId) {
9221
9242
  if (newMenuOpen) {
@@ -9327,7 +9348,7 @@ var Table = React__default.forwardRef(function (_a, ref) {
9327
9348
  // Render ----------------------------------------------------------------------------------------------------------
9328
9349
  return finalColumns ? (React__default.createElement(TableContextProvider, { value: tableContextValue },
9329
9350
  React__default.createElement(Paper, { ref: fullHeight ? containerHeightDetector : undefined, className: classNames('Table', className, !!stickyHeader && 'sticky-header', !!fullHeight && 'full-height', !!showOddColor && 'odd-color', !!showEvenColor && 'even-color', !!sortable && 'sortable'), variant: 'outlined', style: style, sx: sx },
9330
- React__default.createElement(SimpleBar, { style: simpleBarStyle },
9351
+ React__default.createElement(SimpleBar, { ref: simpleBarRef, style: simpleBarStyle },
9331
9352
  React__default.createElement(DndContext, { sensors: sensors, collisionDetection: closestCenter, onDragEnd: handleDragEnd },
9332
9353
  React__default.createElement(Table$1, { stickyHeader: stickyHeader, sx: tableSx, style: tableStyle },
9333
9354
  React__default.createElement(TableHead, null,
@@ -9340,7 +9361,7 @@ var Table = React__default.forwardRef(function (_a, ref) {
9340
9361
  !isNoData && footer && (React__default.createElement(TableFooter, null,
9341
9362
  React__default.createElement(TableRow, null, finalColumns.map(function (column, idx) { return (React__default.createElement(TableFooterCell, { key: idx, column: column, defaultAlign: defaultAlign })); }))))))),
9342
9363
  paging && paging.total > 0 && (React__default.createElement(Stack, { ref: fullHeight ? pagingHeightResizeDetector : undefined, alignItems: pagingAlign, style: pagingStyle },
9343
- React__default.createElement(TablePagination, { className: pagination === null || pagination === void 0 ? void 0 : pagination.className, style: pagination === null || pagination === void 0 ? void 0 : pagination.style, sx: pagination === null || pagination === void 0 ? void 0 : pagination.sx, paging: paging, align: pagingAlign, onChange: onPageChange })))))) : null;
9364
+ React__default.createElement(TablePagination, { className: pagination === null || pagination === void 0 ? void 0 : pagination.className, style: pagination === null || pagination === void 0 ? void 0 : pagination.style, sx: pagination === null || pagination === void 0 ? void 0 : pagination.sx, paging: paging, align: pagingAlign, onChange: handlePageChange })))))) : null;
9344
9365
  });
9345
9366
  Table.displayName = 'Table';
9346
9367
  Table.defaultProps = TableDefaultProps;var SearchTableDefaultProps = {};var SearchTable = React__default.forwardRef(function (_a, ref) {
@@ -9499,12 +9520,15 @@ Table.defaultProps = TableDefaultProps;var SearchTableDefaultProps = {};var Sear
9499
9520
  if (ref) {
9500
9521
  var commands = {
9501
9522
  reload: function (page) {
9502
- var _a, _b, _c;
9523
+ var _a, _b, _c, _d;
9524
+ if (page != null) {
9525
+ (_a = tableRef.current) === null || _a === void 0 ? void 0 : _a.scrollToTop();
9526
+ }
9503
9527
  var finalData;
9504
9528
  if (lastGetDataDataRef.current) {
9505
9529
  finalData = __assign$1({}, lastGetDataDataRef.current);
9506
9530
  if (page != null) {
9507
- (_a = searchRef.current) === null || _a === void 0 ? void 0 : _a.setValue('page', page);
9531
+ (_b = searchRef.current) === null || _b === void 0 ? void 0 : _b.setValue('page', page);
9508
9532
  finalData.page = page;
9509
9533
  }
9510
9534
  }
@@ -9513,9 +9537,9 @@ Table.defaultProps = TableDefaultProps;var SearchTableDefaultProps = {};var Sear
9513
9537
  hashToSearchValue();
9514
9538
  }
9515
9539
  if (page != null) {
9516
- (_b = searchRef.current) === null || _b === void 0 ? void 0 : _b.setValue('page', page);
9540
+ (_c = searchRef.current) === null || _c === void 0 ? void 0 : _c.setValue('page', page);
9517
9541
  }
9518
- finalData = ((_c = searchRef.current) === null || _c === void 0 ? void 0 : _c.getAllFormValue()) || {};
9542
+ finalData = ((_d = searchRef.current) === null || _d === void 0 ? void 0 : _d.getAllFormValue()) || {};
9519
9543
  }
9520
9544
  getData(finalData);
9521
9545
  },
@@ -9610,7 +9634,8 @@ Table.defaultProps = TableDefaultProps;var SearchTableDefaultProps = {};var Sear
9610
9634
  }
9611
9635
  }, [searchRef, hash, hashChange, getData]);
9612
9636
  var handleSearchSubmit = useCallback(function (data) {
9613
- var _a;
9637
+ var _a, _b;
9638
+ (_a = tableRef.current) === null || _a === void 0 ? void 0 : _a.scrollToTop();
9614
9639
  if (isFirstSearchSubmit) {
9615
9640
  setIsFirstSearchSubmit(false);
9616
9641
  if (!hash) {
@@ -9618,7 +9643,7 @@ Table.defaultProps = TableDefaultProps;var SearchTableDefaultProps = {};var Sear
9618
9643
  }
9619
9644
  }
9620
9645
  else {
9621
- (_a = searchRef.current) === null || _a === void 0 ? void 0 : _a.setValue('page', 1);
9646
+ (_b = searchRef.current) === null || _b === void 0 ? void 0 : _b.setValue('page', 1);
9622
9647
  var finalData = __assign$1(__assign$1({}, data), { page: 1 });
9623
9648
  if (hash) {
9624
9649
  hashChange(finalData);