@atlaskit/editor-plugin-table 5.4.12 → 5.4.14

package/src/plugins/table/utils/column-controls.ts

@@ -217,3 +217,84 @@ export const colWidthsForRow = (tr: HTMLTableRowElement) => {
 
   return pctWidths.map((pct) => `${pct}%`).join(' ');
 };
+
+export const convertHTMLCellIndexToColumnIndex = (
+  htmlColIndex: number,
+  htmlRowIndex: number,
+  tableMap: TableMap,
+): number => {
+  // Same numbers (positions) in tableMap.map array mean that there are merged cells.
+  // Cells can be merged across columns. So we need to check if the cell on the left and current cell have the same value.
+  // Cells can be merged acroll rows. So we need to check if the cell above has the same value as current cell.
+  // When cell has the same value as the cell above it or the cell to the left of it, html cellIndex won't count it a separete column.
+  const width = tableMap.width;
+  const map = tableMap.map;
+  let htmlColCount = 0;
+
+  if (htmlRowIndex === 0) {
+    for (let colIndex = 0; colIndex < width; colIndex++) {
+      if (colIndex === 0 || map[colIndex] !== map[colIndex - 1]) {
+        htmlColCount++;
+      }
+
+      if (htmlColCount - 1 === htmlColIndex) {
+        return colIndex;
+      }
+    }
+  } else {
+    for (let colIndex = 0; colIndex < width; colIndex++) {
+      const currentCellMapIndex = htmlRowIndex * width + colIndex;
+      const cellAboveMapIndex = (htmlRowIndex - 1) * width + colIndex;
+      if (colIndex > 0) {
+        if (
+          map[currentCellMapIndex] !== map[currentCellMapIndex - 1] &&
+          map[currentCellMapIndex] !== map[cellAboveMapIndex]
+        ) {
+          htmlColCount++;
+        }
+      } else {
+        if (map[currentCellMapIndex] !== map[cellAboveMapIndex]) {
+          htmlColCount++;
+        }
+      }
+
+      if (htmlColCount - 1 === htmlColIndex) {
+        return colIndex;
+      }
+    }
+  }
+
+  return 0;
+};
+
+// When first row has merged cells, our converted column index needs to be mapped.
+export const getColumnIndexMappedToColumnIndexInFirstRow = (
+  convertedColIndex: number,
+  htmlRowIndex: number,
+  tableMap: TableMap,
+): number => {
+  const width = tableMap.width;
+  const map = tableMap.map;
+  const mapColIndexToFistRowColIndex = [];
+  let htmlColCounFirstRow = 0;
+  let colSpan = 0;
+
+  if (htmlRowIndex === 0) {
+    return convertedColIndex;
+  }
+
+  for (let colIndex = 0; colIndex < width; colIndex++) {
+    if (colIndex === 0 || map[colIndex] !== map[colIndex - 1]) {
+      if (colSpan > 0) {
+        htmlColCounFirstRow += colSpan;
+        colSpan = 0;
+      }
+      htmlColCounFirstRow++;
+    } else if (map[colIndex] === map[colIndex - 1]) {
+      colSpan++;
+    }
+    mapColIndexToFistRowColIndex[colIndex] = htmlColCounFirstRow - 1;
+  }
+
+  return mapColIndexToFistRowColIndex[convertedColIndex];
+};

package/src/plugins/table/utils/index.ts

@@ -59,10 +59,12 @@ export {
   hasResizeHandler,
 } from './dom';
 export {
+  convertHTMLCellIndexToColumnIndex,
   getColumnsWidths,
   isColumnDeleteButtonVisible,
   getColumnDeleteButtonParams,
   getColumnClassNames,
+  getColumnIndexMappedToColumnIndexInFirstRow,
 } from './column-controls';
 export {
   getRowHeights,

package/src/__tests__/integration/block-node-selection.ts

@@ -1,165 +0,0 @@
-export {};
-it.todo('TODO: ED-15801 - Fix smart link async rendering integration test');
-// import { runBlockNodeSelectionTestSuite } from '@atlaskit/editor-test-helpers/integration/selection';
-//
-// runBlockNodeSelectionTestSuite({
-//   nodeName: 'table',
-//   editorOptions: {
-//     allowTables: {
-//       advanced: true,
-//     },
-//   },
-//   selector: 'table',
-//   adfNode: {
-//     type: 'table',
-//     attrs: {
-//       isNumberColumnEnabled: false,
-//       layout: 'default',
-//       localId: '15804638-b946-4591-b64c-beffe5122733',
-//     },
-//     content: [
-//       {
-//         type: 'tableRow',
-//         content: [
-//           {
-//             type: 'tableHeader',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//           {
-//             type: 'tableHeader',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//           {
-//             type: 'tableHeader',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//         ],
-//       },
-//       {
-//         type: 'tableRow',
-//         content: [
-//           {
-//             type: 'tableCell',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//           {
-//             type: 'tableCell',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//           {
-//             type: 'tableCell',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//         ],
-//       },
-//       {
-//         type: 'tableRow',
-//         content: [
-//           {
-//             type: 'tableCell',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//           {
-//             type: 'tableCell',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//           {
-//             type: 'tableCell',
-//             attrs: {},
-//             content: [
-//               {
-//                 type: 'paragraph',
-//                 content: [],
-//               },
-//             ],
-//           },
-//         ],
-//       },
-//     ],
-//   },
-//   skipTests: {
-//     'Extend selection right two characters to select [block-node] from line above with shift + arrow right': [
-//       'chrome',
-//       'safari',
-//       'firefox',
-//     ],
-//     'Extend selection left two characters to select [block-node] from line below with shift + arrow left': [
-//       'chrome',
-//       'safari',
-//       'firefox',
-//     ],
-//     'Extend a selection from end of the document to the start when [block-node] is the first node': [
-//       'chrome',
-//       'safari',
-//       'firefox',
-//     ],
-//     'Click and drag from the end to start of the document to select [block-node] when [block-node] is the first node': [
-//       'chrome',
-//       'safari',
-//       'firefox',
-//     ],
-//     'Extend a selection to the end of the document from start when [block-node] is the last node': [
-//       'chrome',
-//       'safari',
-//       'firefox',
-//     ],
-//     'Click and drag from start of the document to select [block-node] when [block-node] is the last node': [
-//       'chrome',
-//       'safari',
-//       'firefox',
-//     ],
-//     "Extend selection down by one line multiple times to select [block-node]'s in sequence with shift + arrow down": [
-//       'chrome',
-//       'safari',
-//       'firefox',
-//     ],
-//   },
-// });