es-grid-template 1.7.43 → 1.7.44

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/es/table-component/TableContainerEdit.js +28 -16
  2. package/es/table-component/table/Grid.js +12 -10
  3. package/lib/table-component/TableContainerEdit.js +28 -16
  4. package/lib/table-component/table/Grid.js +12 -10
  5. package/package.json +1 -1
package/es/table-component/TableContainerEdit.js CHANGED
@@ -666,9 +666,11 @@ const TableContainerEdit = props => {
666
666
  }, [dataSource, editingKey, id, onBlur]);
667
667
  const columnSizingState = table.getState().columnSizing;
668
668
  React.useEffect(() => {
669
- requestAnimationFrame(() => {
670
- columnVirtualizer.measure();
671
- });
669
+
670
+ // requestAnimationFrame(() => {
671
+
672
+ // columnVirtualizer.measure()
673
+ // })
672
674
  }, [columnSizingState, columnVirtualizer]);
673
675
  React.useEffect(() => {
674
676
  if (!tableContainerRef.current) {
@@ -682,6 +684,9 @@ const TableContainerEdit = props => {
682
684
  if (columnSizingInfo.isResizingColumn === false) {
683
685
  const aa = updateColumnWidthsRecursive(propsColumns, columnSizing);
684
686
  setColumns(aa);
687
+ requestAnimationFrame(() => {
688
+ columnVirtualizer.measure();
689
+ });
685
690
  }
686
691
  }, [columnSizingInfo]);
687
692
  React.useEffect(() => {
@@ -694,11 +699,7 @@ const TableContainerEdit = props => {
694
699
  // const containerWidth = tableContainerRef.current.offsetWidth
695
700
  const containerWidth = tableContainerRef.current.offsetWidth - (tableContainerRef.current.scrollHeight > tableContainerRef.current.offsetHeight ? 15 : 0);
696
701
  const totalWidth = table.getTotalSize() - (tableContainerRef.current.scrollHeight > tableContainerRef.current.offsetHeight ? 15 : 0);
697
-
698
- // console.log('containerWidth', containerWidth)
699
- // console.log('totalWidth', totalWidth)
700
-
701
- if (totalWidth && totalWidth < containerWidth) {
702
+ if (totalWidth && totalWidth > 0 && totalWidth < containerWidth) {
702
703
  const factor = containerWidth / totalWidth;
703
704
  const visibleCols = table.getVisibleLeafColumns();
704
705
  const baseSizes = visibleCols.map(col => col.getSize() || col.columnDef.size || 150);
@@ -715,18 +716,29 @@ const TableContainerEdit = props => {
715
716
  acc[col.id] = roundedSizes[idx];
716
717
  return acc;
717
718
  }, {});
718
-
719
- // const aa = updateColumnWidthsRecursive(propsColumns, aaa)
720
-
721
- // setColumns(aa)
722
-
723
- // console.log('aaa', aaa)
724
-
719
+ const aa = updateColumnWidthsRecursive(propsColumns, aaa);
720
+ setColumns(aa);
725
721
  table.setColumnSizing(aaa);
722
+ requestAnimationFrame(() => {
723
+ columnVirtualizer.measure();
724
+ });
726
725
 
727
726
  // setColumnSizing?.(aaa)
727
+ } else {
728
+ if (columnHidden) {
729
+ const abb = table.getVisibleLeafColumns()?.[0];
730
+ if (abb && Object.keys(columnSizingInfo).length === 0) {
731
+ // setColumnSizing({ "#": abb.getSize() })
732
+ table.setColumnSizing({
733
+ "#": abb.getSize()
734
+ });
735
+ requestAnimationFrame(() => {
736
+ columnVirtualizer.measure();
737
+ });
738
+ }
739
+ }
728
740
  }
729
- }, [table.getTotalSize(), table.getState().columnSizing, dataSource.length]);
741
+ }, [table.getTotalSize(), dataSource.length, windowSize.innerWidth, columnVirtualizer]);
730
742
  // }, [table.getState().columnSizing, table.getTotalSize(), containerRef])
731
743
 
732
744
  // React.useEffect(() => {
package/es/table-component/table/Grid.js CHANGED
@@ -141,16 +141,18 @@ const Grid = props => {
141
141
 
142
142
  // debugTable: true
143
143
  });
144
- React.useEffect(() => {
145
- if (columnHidden) {
146
- const abb = table.getVisibleLeafColumns()?.[0];
147
- if (abb && Object.keys(columnSizingInfo).length === 0) {
148
- setColumnSizing({
149
- "#": abb.getSize()
150
- });
151
- }
152
- }
153
- }, [columnHidden, columnSizingInfo]);
144
+
145
+ // React.useEffect(() => {
146
+ // if (columnHidden) {
147
+ // const abb = table.getVisibleLeafColumns()?.[0]
148
+
149
+ // if (abb && Object.keys(columnSizingInfo).length === 0
150
+ // ) {
151
+ // setColumnSizing({ "#": abb.getSize() })
152
+ // }
153
+ // }
154
+
155
+ // }, [columnHidden, columnSizingInfo])
154
156
 
155
157
  // React.useEffect(() => {
156
158
  // if (columnSizingInfo.isResizingColumn === false) {
package/lib/table-component/TableContainerEdit.js CHANGED
@@ -673,9 +673,11 @@ const TableContainerEdit = props => {
673
673
  }, [dataSource, editingKey, id, onBlur]);
674
674
  const columnSizingState = table.getState().columnSizing;
675
675
  _react.default.useEffect(() => {
676
- requestAnimationFrame(() => {
677
- columnVirtualizer.measure();
678
- });
676
+
677
+ // requestAnimationFrame(() => {
678
+
679
+ // columnVirtualizer.measure()
680
+ // })
679
681
  }, [columnSizingState, columnVirtualizer]);
680
682
  _react.default.useEffect(() => {
681
683
  if (!tableContainerRef.current) {
@@ -689,6 +691,9 @@ const TableContainerEdit = props => {
689
691
  if (columnSizingInfo.isResizingColumn === false) {
690
692
  const aa = (0, _utils.updateColumnWidthsRecursive)(propsColumns, columnSizing);
691
693
  setColumns(aa);
694
+ requestAnimationFrame(() => {
695
+ columnVirtualizer.measure();
696
+ });
692
697
  }
693
698
  }, [columnSizingInfo]);
694
699
  _react.default.useEffect(() => {
@@ -701,11 +706,7 @@ const TableContainerEdit = props => {
701
706
  // const containerWidth = tableContainerRef.current.offsetWidth
702
707
  const containerWidth = tableContainerRef.current.offsetWidth - (tableContainerRef.current.scrollHeight > tableContainerRef.current.offsetHeight ? 15 : 0);
703
708
  const totalWidth = table.getTotalSize() - (tableContainerRef.current.scrollHeight > tableContainerRef.current.offsetHeight ? 15 : 0);
704
-
705
- // console.log('containerWidth', containerWidth)
706
- // console.log('totalWidth', totalWidth)
707
-
708
- if (totalWidth && totalWidth < containerWidth) {
709
+ if (totalWidth && totalWidth > 0 && totalWidth < containerWidth) {
709
710
  const factor = containerWidth / totalWidth;
710
711
  const visibleCols = table.getVisibleLeafColumns();
711
712
  const baseSizes = visibleCols.map(col => col.getSize() || col.columnDef.size || 150);
@@ -722,18 +723,29 @@ const TableContainerEdit = props => {
722
723
  acc[col.id] = roundedSizes[idx];
723
724
  return acc;
724
725
  }, {});
725
-
726
- // const aa = updateColumnWidthsRecursive(propsColumns, aaa)
727
-
728
- // setColumns(aa)
729
-
730
- // console.log('aaa', aaa)
731
-
726
+ const aa = (0, _utils.updateColumnWidthsRecursive)(propsColumns, aaa);
727
+ setColumns(aa);
732
728
  table.setColumnSizing(aaa);
729
+ requestAnimationFrame(() => {
730
+ columnVirtualizer.measure();
731
+ });
733
732
 
734
733
  // setColumnSizing?.(aaa)
734
+ } else {
735
+ if (columnHidden) {
736
+ const abb = table.getVisibleLeafColumns()?.[0];
737
+ if (abb && Object.keys(columnSizingInfo).length === 0) {
738
+ // setColumnSizing({ "#": abb.getSize() })
739
+ table.setColumnSizing({
740
+ "#": abb.getSize()
741
+ });
742
+ requestAnimationFrame(() => {
743
+ columnVirtualizer.measure();
744
+ });
745
+ }
746
+ }
735
747
  }
736
- }, [table.getTotalSize(), table.getState().columnSizing, dataSource.length]);
748
+ }, [table.getTotalSize(), dataSource.length, windowSize.innerWidth, columnVirtualizer]);
737
749
  // }, [table.getState().columnSizing, table.getTotalSize(), containerRef])
738
750
 
739
751
  // React.useEffect(() => {
package/lib/table-component/table/Grid.js CHANGED
@@ -143,16 +143,18 @@ const Grid = props => {
143
143
 
144
144
  // debugTable: true
145
145
  });
146
- _react.default.useEffect(() => {
147
- if (columnHidden) {
148
- const abb = table.getVisibleLeafColumns()?.[0];
149
- if (abb && Object.keys(columnSizingInfo).length === 0) {
150
- setColumnSizing({
151
- "#": abb.getSize()
152
- });
153
- }
154
- }
155
- }, [columnHidden, columnSizingInfo]);
146
+
147
+ // React.useEffect(() => {
148
+ // if (columnHidden) {
149
+ // const abb = table.getVisibleLeafColumns()?.[0]
150
+
151
+ // if (abb && Object.keys(columnSizingInfo).length === 0
152
+ // ) {
153
+ // setColumnSizing({ "#": abb.getSize() })
154
+ // }
155
+ // }
156
+
157
+ // }, [columnHidden, columnSizingInfo])
156
158
 
157
159
  // React.useEffect(() => {
158
160
  // if (columnSizingInfo.isResizingColumn === false) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "es-grid-template",
3
- "version": "1.7.43",
3
+ "version": "1.7.44",
4
4
  "description": "es-grid-template",
5
5
  "keywords": [
6
6
  "react",