Merge pull request #3083 from KorovinQuantori/main

Table bugfixes
udecode · Mar 28, 2024 · 78cefe2 · 78cefe2
2 parents 6725247 + ddcd093
commit 78cefe2
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 12 deletions.
diff --git a/.changeset/chatty-flowers-move.md b/.changeset/chatty-flowers-move.md
@@ -0,0 +1,5 @@
+---
+"@udecode/plate-table": patch
+---
+
+Hotfix: reset cell entries list when table is overflown
diff --git a/.changeset/orange-actors-deliver.md b/.changeset/orange-actors-deliver.md
@@ -0,0 +1,5 @@
+---
+"@udecode/plate-table": patch
+---
+
+Use getRowSpan\getColSpan instead of pointing at `rowspan` and `colspan` fields directly
diff --git a/packages/table/src/components/TableCellElement/useTableCellElementState.ts b/packages/table/src/components/TableCellElement/useTableCellElementState.ts
@@ -152,8 +152,8 @@ export const useTableCellElement = ({
 
   return {
     props: {
-      colSpan: element.colSpan,
-      rowSpan: element.rowSpan,
+      colSpan: getColSpan(element),
+      rowSpan: getRowSpan(element),
     },
   };
 };
diff --git a/packages/table/src/merge/computeCellIndices.ts b/packages/table/src/merge/computeCellIndices.ts
@@ -8,6 +8,7 @@ import {
   TTableElement,
   TTableRowElement,
 } from '../types';
+import { getColSpan } from '../queries';
 
 export function computeCellIndices<V extends Value>(
   editor: PlateEditor<V>,
@@ -32,7 +33,7 @@ export function computeCellIndices<V extends Value>(
         rowIndex = r;
         break;
       }
-      cIndex += cell.colSpan || 1; // consider 0 and undefined as 1
+      cIndex += getColSpan(cell);
     }
   }
 
@@ -52,7 +53,7 @@ export function computeCellIndices<V extends Value>(
           _rowSpan > 1 &&
           rowIndex - _rowIndex < _rowSpan
         ) {
-          colIndex += prevCell.colSpan || 1;
+          colIndex += getColSpan(prevCell);
         }
       }
     });

diff --git a/packages/table/src/merge/isTableRectangular.ts b/packages/table/src/merge/isTableRectangular.ts
@@ -1,3 +1,4 @@
+import { getColSpan } from '../queries';
 import { getRowSpan } from '../queries/getRowSpan';
 import { TTableCellElement, TTableElement, TTableRowElement } from '../types';
 
@@ -20,7 +21,7 @@ export const isTableRectangular = (table?: TTableElement) => {
         if (!arr[rI + i]) {
           arr[rI + i] = 0;
         }
-        arr[rI + i] += cellElem?.colSpan || 1;
+        arr[rI + i] += getColSpan(cellElem);
       });
     });
   });

diff --git a/packages/table/src/withSetFragmentDataTable.ts b/packages/table/src/withSetFragmentDataTable.ts
@@ -11,7 +11,7 @@ import {
 import { Path } from 'slate';
 
 import { ELEMENT_TH } from './createTablePlugin';
-import { getTableGridAbove } from './queries/index';
+import { getColSpan, getRowSpan, getTableGridAbove } from './queries/index';
 import { TTableCellElement } from './types';
 
 export const withSetFragmentDataTable = <
@@ -106,12 +106,10 @@ export const withSetFragmentDataTable = <
 
           const cellElement = document.createElement('td');
 
-          if (cell.colSpan !== undefined) {
-            cellElement.colSpan = cell.colSpan;
-          }
-          if (cell.rowSpan !== undefined) {
-            cellElement.rowSpan = cell.rowSpan;
-          }
+          const colSpan = getColSpan(cell);
+          cellElement.colSpan = colSpan;
+          const rowSpan = getRowSpan(cell);
+          cellElement.rowSpan = rowSpan;
 
           cellElement.innerHTML = data.getData('text/html');
           rowElement.append(cellElement);