@ackplus/react-tanstack-data-table 1.0.34 → 1.0.35

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 (5) hide show
  1. package/package.json +1 -1
  2. package/src/lib/components/table/data-table.js +22 -8
  3. package/src/lib/components/toolbar/column-pinning-control.js +1 -1
  4. package/src/lib/components/toolbar/column-reset-control.js +0 -1
  5. package/src/lib/utils/styling-helpers.js +2 -2
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ackplus/react-tanstack-data-table",
3
3
  "type": "commonjs",
4
- "version": "1.0.34",
4
+ "version": "1.0.35",
5
5
  "description": "A powerful React data table component built with MUI and TanStack Table",
6
6
  "keywords": [
7
7
  "react",
package/src/lib/components/table/data-table.js CHANGED
@@ -540,7 +540,9 @@ exports.DataTable = (0, react_1.forwardRef)(function DataTable({ initialState, c
540
540
  table.toggleAllColumnsVisible(false);
541
541
  },
542
542
  resetColumnVisibility: () => {
543
- table.resetColumnVisibility();
543
+ const initialVisibility = initialStateConfig.columnVisibility || {};
544
+ table.setColumnVisibility(initialVisibility);
545
+ handleColumnVisibilityChange(initialVisibility);
544
546
  },
545
547
  },
546
548
  columnOrdering: {
@@ -568,6 +570,7 @@ exports.DataTable = (0, react_1.forwardRef)(function DataTable({ initialState, c
568
570
  return `column_${index}`;
569
571
  });
570
572
  table.setColumnOrder(initialOrder);
573
+ handleColumnOrderChange(initialOrder);
571
574
  },
572
575
  },
573
576
  columnPinning: {
@@ -582,7 +585,7 @@ exports.DataTable = (0, react_1.forwardRef)(function DataTable({ initialState, c
582
585
  const currentPinning = table.getState().columnPinning;
583
586
  const newPinning = Object.assign({}, currentPinning);
584
587
  newPinning.left = (newPinning.left || []).filter(id => id !== columnId);
585
- newPinning.right = [...(newPinning.right || []).filter(id => id !== columnId), columnId];
588
+ newPinning.right = [columnId, ...(newPinning.right || []).filter(id => id !== columnId)];
586
589
  table.setColumnPinning(newPinning);
587
590
  },
588
591
  unpinColumn: (columnId) => {
@@ -597,7 +600,9 @@ exports.DataTable = (0, react_1.forwardRef)(function DataTable({ initialState, c
597
600
  table.setColumnPinning(pinning);
598
601
  },
599
602
  resetColumnPinning: () => {
600
- table.setColumnPinning(initialStateConfig.columnPinning || { left: [], right: [] });
603
+ const initialPinning = initialStateConfig.columnPinning || { left: [], right: [] };
604
+ table.setColumnPinning(initialPinning);
605
+ handleColumnPinningChange(initialPinning);
601
606
  },
602
607
  },
603
608
  columnResizing: {
@@ -610,10 +615,14 @@ exports.DataTable = (0, react_1.forwardRef)(function DataTable({ initialState, c
610
615
  (_a = table.getColumn(columnId)) === null || _a === void 0 ? void 0 : _a.resetSize();
611
616
  },
612
617
  autoSizeAllColumns: () => {
613
- table.resetColumnSizing();
618
+ const initialSizing = initialStateConfig.columnSizing || {};
619
+ table.setColumnSizing(initialSizing);
620
+ handleColumnSizingChange(initialSizing);
614
621
  },
615
622
  resetColumnSizing: () => {
616
- table.resetColumnSizing();
623
+ const initialSizing = initialStateConfig.columnSizing || {};
624
+ table.setColumnSizing(initialSizing);
625
+ handleColumnSizingChange(initialSizing);
617
626
  },
618
627
  },
619
628
  filtering: {
@@ -700,10 +709,13 @@ exports.DataTable = (0, react_1.forwardRef)(function DataTable({ initialState, c
700
709
  }
701
710
  },
702
711
  clearSorting: () => {
703
- table.resetSorting();
712
+ table.setSorting([]);
713
+ handleSortingChange([]);
704
714
  },
705
715
  resetSorting: () => {
706
- table.setSorting(initialStateConfig.sorting || []);
716
+ const initialSorting = initialStateConfig.sorting || [];
717
+ table.setSorting(initialSorting);
718
+ handleSortingChange(initialSorting);
707
719
  },
708
720
  },
709
721
  pagination: {
@@ -747,7 +759,9 @@ exports.DataTable = (0, react_1.forwardRef)(function DataTable({ initialState, c
747
759
  }
748
760
  },
749
761
  resetPagination: () => {
750
- table.setPagination(initialStateConfig.pagination || { pageIndex: 0, pageSize: 10 });
762
+ const initialPagination = initialStateConfig.pagination || { pageIndex: 0, pageSize: 10 };
763
+ table.setPagination(initialPagination);
764
+ handlePaginationChange(initialPagination);
751
765
  },
752
766
  },
753
767
  selection: {
package/src/lib/components/toolbar/column-pinning-control.js CHANGED
@@ -37,7 +37,7 @@ function ColumnPinningControl(props = {}) {
37
37
  newPinning.left = [...(newPinning.left || []), columnId];
38
38
  }
39
39
  else if (position === 'right') {
40
- newPinning.right = [...(newPinning.right || []), columnId];
40
+ newPinning.right = [columnId, ...(newPinning.right || [])];
41
41
  }
42
42
  table === null || table === void 0 ? void 0 : table.setColumnPinning(newPinning);
43
43
  };
package/src/lib/components/toolbar/column-reset-control.js CHANGED
@@ -13,7 +13,6 @@ function ColumnResetControl(props = {}) {
13
13
  const handleResetLayout = () => {
14
14
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
15
15
  const actions = props.resetActions || ['columnOrder', 'columnPinning', 'columnSizing'];
16
- console.log('actions', actions);
17
16
  if (!(apiRef === null || apiRef === void 0 ? void 0 : apiRef.current))
18
17
  return;
19
18
  if (actions.includes('columnOrder')) {
package/src/lib/utils/styling-helpers.js CHANGED
@@ -30,9 +30,9 @@ function getPinnedColumnStyle(options) {
30
30
  right: isPinned === 'right' ? pinnedRightPosition : undefined,
31
31
  zIndex,
32
32
  } : {})), { boxShadow: isPinned === 'left' && isLastLeftPinnedColumn
33
- ? 'inset -1px 0 0 var(--palette-TableCell-border), 6px 0 6px -4px rgba(0,0,0,.18)'
33
+ ? 'inset -1px 0 0 var(--palette-TableCell-border), 2px 0 2px -4px rgba(0,0,0,.18)'
34
34
  : isPinned === 'right' && isFirstRightPinnedColumn
35
- ? 'inset 1px 0 0 var(--palette-TableCell-border), -6px 0 6px -4px rgba(0,0,0,.18)'
35
+ ? 'inset 1px 0 0 var(--palette-TableCell-border), -1px 0 2px -4px rgba(0,0,0,.18)'
36
36
  : undefined }), (isPinned ? {
37
37
  backgroundColor: (theme) => theme.palette.background.paper,
38
38
  backgroundImage: (theme) => `linear-gradient(var(--row-bg, ${theme.palette.background.paper}), var(--row-bg, ${theme.palette.background.paper}))`,