es-grid-template 1.9.21 → 1.9.23

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 (10) hide show
  1. package/es/group-component/hook/utils.d.ts +3 -3
  2. package/es/table-component/TableContainer.js +9 -5
  3. package/es/table-component/TableContainerEdit.js +17 -14
  4. package/es/table-component/style.scss +2 -2
  5. package/es/table-component/table/Grid.js +11 -3
  6. package/lib/table-component/TableContainer.js +9 -5
  7. package/lib/table-component/TableContainerEdit.js +17 -14
  8. package/lib/table-component/style.scss +2 -2
  9. package/lib/table-component/table/Grid.js +11 -3
  10. package/package.json +1 -1
package/es/group-component/hook/utils.d.ts CHANGED
@@ -194,10 +194,10 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
194
194
  value: any;
195
195
  rowData: RecordType;
196
196
  }) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
197
- onCellStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "display" | "position"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "display" | "position">);
198
- onCellHeaderStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "display" | "position"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "display" | "position">);
197
+ onCellStyles?: Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width">);
198
+ onCellHeaderStyles?: Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width">);
199
199
  onCell?: (rowData: RecordType, index: number) => import("react").TdHTMLAttributes<HTMLTableCellElement>;
200
- onCellFooterStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "display" | "position"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "display" | "position">);
200
+ onCellFooterStyles?: Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width">);
201
201
  getValue?: (row: any, rowIndex: number) => any;
202
202
  getCellProps?: (value: any, row: any, rowIndex: number) => import("./../../grid-component/type").CellProps;
203
203
  headerCellProps?: import("./../../grid-component/type").CellProps;
package/es/table-component/TableContainer.js CHANGED
@@ -112,11 +112,15 @@ const TableContainer = props => {
112
112
  return;
113
113
  }
114
114
  if (containerRef.current && tableBody && !tableBody.contains(event.target)) {
115
- setFocusedCell(undefined);
116
- setIsSelectionChange(prev => ({
117
- ...prev,
118
- isChange: false
119
- }));
115
+ if (focusedCell) {
116
+ setFocusedCell(undefined);
117
+ }
118
+ if (isSelectionChange?.isChange) {
119
+ setIsSelectionChange(prev => ({
120
+ ...prev,
121
+ isChange: false
122
+ }));
123
+ }
120
124
  }
121
125
  };
122
126
  document.addEventListener('mousedown', handleClickOutside);
package/es/table-component/TableContainerEdit.js CHANGED
@@ -608,25 +608,28 @@ const TableContainerEdit = props => {
608
608
  if (editingKey) {
609
609
  onBlur?.(dataSource);
610
610
  }
611
- setTimeout(() => {
612
- setEditingKey('');
613
- // editingKey.current = ''
614
- });
615
- setEndCell(undefined);
616
- setStartCell(undefined);
617
- setRangeState(undefined);
618
- setFocusedCell(undefined);
611
+ if (editingKey) {
612
+ setTimeout(() => {
613
+ setEditingKey('');
614
+ });
615
+ }
616
+ if (endCell) {
617
+ setEndCell(undefined);
618
+ }
619
+ if (startCell) {
620
+ setStartCell(undefined);
621
+ }
622
+ if (rangeState) {
623
+ setRangeState(undefined);
624
+ }
625
+ if (focusedCell) {
626
+ setFocusedCell(undefined);
627
+ }
619
628
  }
620
629
  };
621
-
622
- // document.addEventListener('click', handleClickOutside)
623
630
  document.addEventListener('mousedown', handleClickOutside);
624
- // document.addEventListener('touchstart', handleClickOutside)
625
-
626
631
  return () => {
627
- // document.removeEventListener('click', handleClickOutside)
628
632
  document.removeEventListener('mousedown', handleClickOutside);
629
- // document.removeEventListener('touchstart', handleClickOutside)
630
633
  };
631
634
  }, [dataSource, editingKey, id, onBlur]);
632
635
  const columnSizingState = table.getState().columnSizing;
package/es/table-component/style.scss CHANGED
@@ -152,8 +152,8 @@ $cell-index-focus-bg-Dark: #E6EFFD !default;
152
152
  }
153
153
 
154
154
  .#{$prefix}-grid-thead {
155
- // background-color: #ffffff;
156
- background-color: inherit;
155
+ background-color: #ffffff;
156
+ // background-color: inherit;
157
157
  font-weight: 500;
158
158
 
159
159
  .#{$prefix}-grid-cell {
package/es/table-component/table/Grid.js CHANGED
@@ -125,9 +125,9 @@ const Grid = props => {
125
125
  }
126
126
  return true;
127
127
  },
128
- initialState: {
129
- rowSelection: {}
130
- },
128
+ // initialState: {
129
+ // rowSelection: {}
130
+ // },
131
131
  onRowSelectionChange: setRowSelection,
132
132
  // RowSelection
133
133
 
@@ -202,6 +202,14 @@ const Grid = props => {
202
202
  const isEqual = isObjEqual(convertToObjTrue(mergedSelectedKeys), rowSelection);
203
203
  if (!isEqual) {
204
204
  setRowSelection(convertToObjTrue(mergedSelectedKeys));
205
+ // table.setRowSelection(convertToObjTrue(mergedSelectedKeys))
206
+
207
+ if (mergedSelectedKeys.length === 0) {
208
+ setIsSelectionChange(prev => ({
209
+ ...prev,
210
+ rowsData: []
211
+ }));
212
+ }
205
213
  }
206
214
  }, [mergedSelectedKeys]);
207
215
  React.useEffect(() => {
package/lib/table-component/TableContainer.js CHANGED
@@ -119,11 +119,15 @@ const TableContainer = props => {
119
119
  return;
120
120
  }
121
121
  if (containerRef.current && tableBody && !tableBody.contains(event.target)) {
122
- setFocusedCell(undefined);
123
- setIsSelectionChange(prev => ({
124
- ...prev,
125
- isChange: false
126
- }));
122
+ if (focusedCell) {
123
+ setFocusedCell(undefined);
124
+ }
125
+ if (isSelectionChange?.isChange) {
126
+ setIsSelectionChange(prev => ({
127
+ ...prev,
128
+ isChange: false
129
+ }));
130
+ }
127
131
  }
128
132
  };
129
133
  document.addEventListener('mousedown', handleClickOutside);
package/lib/table-component/TableContainerEdit.js CHANGED
@@ -615,25 +615,28 @@ const TableContainerEdit = props => {
615
615
  if (editingKey) {
616
616
  onBlur?.(dataSource);
617
617
  }
618
- setTimeout(() => {
619
- setEditingKey('');
620
- // editingKey.current = ''
621
- });
622
- setEndCell(undefined);
623
- setStartCell(undefined);
624
- setRangeState(undefined);
625
- setFocusedCell(undefined);
618
+ if (editingKey) {
619
+ setTimeout(() => {
620
+ setEditingKey('');
621
+ });
622
+ }
623
+ if (endCell) {
624
+ setEndCell(undefined);
625
+ }
626
+ if (startCell) {
627
+ setStartCell(undefined);
628
+ }
629
+ if (rangeState) {
630
+ setRangeState(undefined);
631
+ }
632
+ if (focusedCell) {
633
+ setFocusedCell(undefined);
634
+ }
626
635
  }
627
636
  };
628
-
629
- // document.addEventListener('click', handleClickOutside)
630
637
  document.addEventListener('mousedown', handleClickOutside);
631
- // document.addEventListener('touchstart', handleClickOutside)
632
-
633
638
  return () => {
634
- // document.removeEventListener('click', handleClickOutside)
635
639
  document.removeEventListener('mousedown', handleClickOutside);
636
- // document.removeEventListener('touchstart', handleClickOutside)
637
640
  };
638
641
  }, [dataSource, editingKey, id, onBlur]);
639
642
  const columnSizingState = table.getState().columnSizing;
package/lib/table-component/style.scss CHANGED
@@ -152,8 +152,8 @@ $cell-index-focus-bg-Dark: #E6EFFD !default;
152
152
  }
153
153
 
154
154
  .#{$prefix}-grid-thead {
155
- // background-color: #ffffff;
156
- background-color: inherit;
155
+ background-color: #ffffff;
156
+ // background-color: inherit;
157
157
  font-weight: 500;
158
158
 
159
159
  .#{$prefix}-grid-cell {
package/lib/table-component/table/Grid.js CHANGED
@@ -130,9 +130,9 @@ const Grid = props => {
130
130
  }
131
131
  return true;
132
132
  },
133
- initialState: {
134
- rowSelection: {}
135
- },
133
+ // initialState: {
134
+ // rowSelection: {}
135
+ // },
136
136
  onRowSelectionChange: setRowSelection,
137
137
  // RowSelection
138
138
 
@@ -207,6 +207,14 @@ const Grid = props => {
207
207
  const isEqual = (0, _utils.isObjEqual)((0, _utils.convertToObjTrue)(mergedSelectedKeys), rowSelection);
208
208
  if (!isEqual) {
209
209
  setRowSelection((0, _utils.convertToObjTrue)(mergedSelectedKeys));
210
+ // table.setRowSelection(convertToObjTrue(mergedSelectedKeys))
211
+
212
+ if (mergedSelectedKeys.length === 0) {
213
+ setIsSelectionChange(prev => ({
214
+ ...prev,
215
+ rowsData: []
216
+ }));
217
+ }
210
218
  }
211
219
  }, [mergedSelectedKeys]);
212
220
  _react.default.useEffect(() => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "es-grid-template",
3
- "version": "1.9.21",
3
+ "version": "1.9.23",
4
4
  "description": "es-grid-template",
5
5
  "keywords": [
6
6
  "react",