@atlaskit/editor-tables 2.2.3 → 2.2.5

package/dist/es2019/utils/copy-paste.js

@@ -9,58 +9,74 @@
 // cell selection is different, here the cells in the selection are
 // clipped to the selection's rectangle, optionally repeating the
 // pasted cells when they are smaller than the selection.
+
 import { Fragment, Slice } from 'prosemirror-model';
 import { Transform } from 'prosemirror-transform';
 import { CellSelection } from '../cell-selection';
 import { TableMap } from '../table-map';
 import { removeColSpan } from './colspan';
-import { tableNodeTypes } from './table-node-types'; // Utilities to help with copying and pasting table cells
+import { selectedRect } from './selection-rect';
+import { tableNodeTypes } from './table-node-types';
+import { isHeaderEnabledByType } from './toggle-header';
+
+// Utilities to help with copying and pasting table cells
+
+/**
+ * Replace any header cells with table cells.
+ *
+ * @param schema
+ * @param cells
+ * @returns Fragment with header cells converted to table cells
+ */
+function stripHeaderType(schema, cells) {
+  const newCells = [];
+  cells.forEach(cell => {
+    var _cellNodeType$createA;
+    // Convert to cell type if not already
+    const cellNodeType = tableNodeTypes(schema).cell;
+    const tableCell = cell.type === cellNodeType ? cell : (_cellNodeType$createA = cellNodeType.createAndFill(cell.attrs, cell.content, cell.marks)) !== null && _cellNodeType$createA !== void 0 ? _cellNodeType$createA : cell;
+    newCells.push(tableCell);
+  });
+  return Fragment.from(newCells);
+}
+
 // : (Slice) → ?{width: number, height: number, rows: [Fragment]}
 // Get a rectangular area of cells from a slice, or null if the outer
 // nodes of the slice aren't table cells or rows.
-
 export function pastedCells(slice) {
   if (!slice.size) {
     return null;
   }
-
   let {
     content,
     openStart,
     openEnd
   } = slice;
-
   if (!content.firstChild) {
     throw new Error('pastedCells: no firstChild defined for content');
   }
-
   while (content.childCount === 1 && (openStart > 0 && openEnd > 0 || content.firstChild.type.spec.tableRole === 'table')) {
     openStart--;
     openEnd--;
     content = content.firstChild.content;
-
     if (!content.firstChild) {
       throw new Error('pastedCells: no firstChild defined for content');
     }
   }
-
   const first = content.firstChild;
   const role = first.type.spec.tableRole;
   const {
     schema
   } = first.type;
   const rows = [];
-
   if (role === 'row') {
     for (let i = 0; i < content.childCount; i++) {
       let cells = content.child(i).content;
       const left = i ? 0 : Math.max(0, openStart - 1);
       const right = i < content.childCount - 1 ? 0 : Math.max(0, openEnd - 1);
-
       if (left || right) {
         cells = fitSlice(tableNodeTypes(schema).row, new Slice(cells, left, right)).content;
       }
-
       rows.push(cells);
     }
   } else if (role === 'cell' || role === 'header_cell') {
@@ -68,75 +84,64 @@ export function pastedCells(slice) {
   } else {
     return null;
   }
+  const rowsWithoutHeaders = rows.map(row => stripHeaderType(schema, row));
+  return ensureRectangular(schema, rowsWithoutHeaders);
+}
 
-  return ensureRectangular(schema, rows);
-} // : (Schema, [Fragment]) → {width: number, height: number, rows: [Fragment]}
+// : (Schema, [Fragment]) → {width: number, height: number, rows: [Fragment]}
 // Compute the width and height of a set of cells, and make sure each
 // row has the same number of cells.
-
 function ensureRectangular(schema, rowsFragment) {
   const rows = rowsFragment;
   const widths = [];
-
   for (let i = 0; i < rows.length; i++) {
     const row = rows[i];
-
     for (let j = row.childCount - 1; j >= 0; j--) {
       const {
         rowspan,
         colspan
       } = row.child(j).attrs;
-
       for (let r = i; r < i + rowspan; r++) {
         widths[r] = (widths[r] || 0) + colspan;
       }
     }
   }
-
   let width = 0;
-
   for (let r = 0; r < widths.length; r++) {
     width = Math.max(width, widths[r]);
   }
-
   for (let r = 0; r < widths.length; r++) {
     if (r >= rows.length) {
       rows.push(Fragment.empty);
     }
-
     if (widths[r] < width) {
       const empty = tableNodeTypes(schema).cell.createAndFill();
       const cells = [];
-
       for (let i = widths[r]; i < width; i++) {
         cells.push(empty);
       }
-
       rows[r] = rows[r].append(Fragment.from(cells));
     }
   }
-
   return {
     height: rows.length,
     width,
     rows
   };
 }
-
 export function fitSlice(nodeType, slice) {
   const node = nodeType.createAndFill();
-
   if (!node) {
     throw new Error(`fitSlice: unable to create node`);
   }
-
   const tr = new Transform(node).replace(0, node.content.size, slice);
   return tr.doc;
-} // : ({width: number, height: number, rows: [Fragment]}, number, number) → {width: number, height: number, rows: [Fragment]}
+}
+
+// : ({width: number, height: number, rows: [Fragment]}, number, number) → {width: number, height: number, rows: [Fragment]}
 // Clip or extend (repeat) the given set of cells to cover the given
 // width and height. Will clip rowspan/colspan cells at the edges when
 // they stick out.
-
 export function clipCells({
   width: currentWidth,
   height: currentHeight,
@@ -145,71 +150,57 @@ export function clipCells({
   let rows = currentRows;
   let width = currentWidth;
   let height = currentHeight;
-
   if (width !== newWidth) {
     const added = [];
     const newRows = [];
-
     for (let row = 0; row < rows.length; row++) {
       const frag = rows[row];
       const cells = [];
-
       for (let col = added[row] || 0, i = 0; col < newWidth; i++) {
         let cell = frag.child(i % frag.childCount);
-
         if (col + cell.attrs.colspan > newWidth) {
           cell = cell.type.create(removeColSpan(cell.attrs, cell.attrs.colspan, col + cell.attrs.colspan - newWidth), cell.content);
         }
-
         cells.push(cell);
         col += cell.attrs.colspan;
-
         for (let j = 1; j < cell.attrs.rowspan; j++) {
           added[row + j] = (added[row + j] || 0) + cell.attrs.colspan;
         }
       }
-
       newRows.push(Fragment.from(cells));
     }
-
     rows = newRows;
     width = newWidth;
   }
-
   if (height !== newHeight) {
     const newRows = [];
-
     for (let row = 0, i = 0; row < newHeight; row++, i++) {
       const cells = [];
       const source = rows[i % height];
-
       for (let j = 0; j < source.childCount; j++) {
         let cell = source.child(j);
-
         if (row + cell.attrs.rowspan > newHeight) {
-          cell = cell.type.create({ ...cell.attrs,
+          cell = cell.type.create({
+            ...cell.attrs,
             rowspan: Math.max(1, newHeight - cell.attrs.rowspan)
           }, cell.content);
         }
-
         cells.push(cell);
       }
-
       newRows.push(Fragment.from(cells));
     }
-
     rows = newRows;
     height = newHeight;
   }
-
   return {
     width,
     height,
     rows
   };
-} // Make sure a table has at least the given width and height. Return
-// true if something was changed.
+}
 
+// Make sure a table has at least the given width and height. Return
+// true if something was changed.
 function growTable(tr, map, table, start, width, height, mapFrom) {
   const {
     schema
@@ -217,160 +208,162 @@ function growTable(tr, map, table, start, width, height, mapFrom) {
   const types = tableNodeTypes(schema);
   let empty;
   let emptyHead;
-
   if (width > map.width) {
     for (let row = 0, rowEnd = 0; row < map.height; row++) {
       const rowNode = table.child(row);
       rowEnd += rowNode.nodeSize;
       const cells = [];
       let add;
-
       if (rowNode.lastChild == null || rowNode.lastChild.type === types.cell) {
         add = empty || (empty = types.cell.createAndFill());
       } else {
         add = emptyHead || (emptyHead = types.header_cell.createAndFill());
       }
-
       for (let i = map.width; i < width; i++) {
         cells.push(add);
       }
-
       tr.insert(tr.mapping.slice(mapFrom).map(rowEnd - 1 + start), cells);
     }
   }
-
   if (height > map.height) {
     const cells = [];
-
     for (let i = 0, k = (map.height - 1) * map.width; i < Math.max(map.width, width); i++) {
       let header;
-
       if (i >= map.width) {
         header = false;
       } else {
         const mappedPos = map.map[k + i];
         const node = table.nodeAt(mappedPos);
-
         if (!node) {
           throw new Error(`growTable: no node found at pos ${mappedPos}`);
         }
-
         header = node.type === types.header_cell;
       }
-
       cells.push(header ? emptyHead || (emptyHead = types.header_cell.createAndFill()) : empty || (empty = types.cell.createAndFill()));
     }
-
     const emptyRow = types.row.create(null, Fragment.from(cells));
     const rows = [];
-
     for (let i = map.height; i < height; i++) {
       rows.push(emptyRow);
     }
-
     tr.insert(tr.mapping.slice(mapFrom).map(start + table.nodeSize - 2), rows);
   }
-
   return !!(empty || emptyHead);
-} // Make sure the given line (left, top) to (right, top) doesn't cross
+}
+
+// Make sure the given line (left, top) to (right, top) doesn't cross
 // any rowspan cells by splitting cells that cross it. Return true if
 // something changed.
-
-
 function isolateHorizontal(tr, map, table, start, left, right, top, mapFrom) {
   if (top === 0 || top === map.height) {
     return false;
   }
-
   let found = false;
-
   for (let col = left; col < right; col++) {
     const index = top * map.width + col;
     const pos = map.map[index];
-
     if (map.map[index - map.width] === pos) {
       found = true;
       const cell = table.nodeAt(pos);
-
       if (!cell) {
         throw new Error(`isolateHorizontal: no cell found at pos ${pos}`);
       }
-
       const {
         top: cellTop,
         left: cellLeft
       } = map.findCell(pos);
-      tr.setNodeMarkup(tr.mapping.slice(mapFrom).map(pos + start), undefined, { ...cell.attrs,
+      tr.setNodeMarkup(tr.mapping.slice(mapFrom).map(pos + start), undefined, {
+        ...cell.attrs,
         rowspan: top - cellTop
       });
-      const newCell = cell.type.createAndFill({ ...cell.attrs,
+      const newCell = cell.type.createAndFill({
+        ...cell.attrs,
         rowspan: cellTop + cell.attrs.rowspan - top
       });
-
       if (!newCell) {
         throw new Error('isolateHorizontal: failed to create cell');
       }
-
       tr.insert(tr.mapping.slice(mapFrom).map(map.positionAt(top, cellLeft, table)), newCell);
       col += cell.attrs.colspan - 1;
     }
   }
-
   return found;
-} // Make sure the given line (left, top) to (left, bottom) doesn't
+}
+
+// Make sure the given line (left, top) to (left, bottom) doesn't
 // cross any colspan cells by splitting cells that cross it. Return
 // true if something changed.
-
-
 function isolateVertical(tr, map, table, start, top, bottom, left, mapFrom) {
   if (left === 0 || left === map.width) {
     return false;
   }
-
   let found = false;
-
   for (let row = top; row < bottom; row++) {
     const index = row * map.width + left;
     const pos = map.map[index];
-
     if (map.map[index - 1] === pos) {
       found = true;
       const cell = table.nodeAt(pos);
-
       if (!cell) {
         throw new Error(`isolateVertical: could not find cell at pos ${pos}`);
       }
-
       const cellLeft = map.colCount(pos);
       const updatePos = tr.mapping.slice(mapFrom).map(pos + start);
       tr.setNodeMarkup(updatePos, undefined, removeColSpan(cell.attrs, left - cellLeft, cell.attrs.colspan - (left - cellLeft)));
       const newCell = cell.type.createAndFill(removeColSpan(cell.attrs, 0, left - cellLeft));
-
       if (!newCell) {
         throw new Error('isolateVertical: failed to create cell');
       }
-
       tr.insert(updatePos + cell.nodeSize, newCell);
       row += cell.attrs.rowspan - 1;
     }
   }
-
   return found;
-} // Insert the given set of cells (as returned by `pastedCells`) into a
-// table, at the position pointed at by rect.
+}
+function applyHeaderCells(tr, tableMap, state, tableStart, table, headerRowEnabled, headerColumnEnabled) {
+  const {
+    schema
+  } = state;
+  const setMarkup = (tr, row, col, headerEnabled) => {
+    const cellPos = tableStart + tableMap.positionAt(row, col, table);
+    const cell = tr.doc.nodeAt(cellPos);
+    const newType = headerEnabled ? schema.nodes.tableHeader : schema.nodes.tableCell;
+    const isCellTypeChanged = newType !== (cell === null || cell === void 0 ? void 0 : cell.type);
+    const isCellTypeValid = [schema.nodes.tableCell, schema.nodes.tableHeader].includes(cell === null || cell === void 0 ? void 0 : cell.type);
+    if (isCellTypeChanged && isCellTypeValid) {
+      tr.setNodeMarkup(cellPos, newType, cell === null || cell === void 0 ? void 0 : cell.attrs, cell === null || cell === void 0 ? void 0 : cell.marks);
+    }
+  };
+
+  // For row === 0 && col === 0 it is enabled if either are enabled
+  setMarkup(tr, 0, 0, headerColumnEnabled || headerRowEnabled);
 
+  // Header Column
+  for (let col = 1; col < tableMap.width; col++) {
+    setMarkup(tr, 0, col, headerRowEnabled);
+  }
+  // Header Row
+  for (let row = 1; row < tableMap.height; row++) {
+    setMarkup(tr, row, 0, headerColumnEnabled);
+  }
+}
 
+// Insert the given set of cells (as returned by `pastedCells`) into a
+// table, at the position pointed at by rect.
 export function insertCells(state, dispatch, tableStart, rect, cells) {
   let table = state.doc;
+  const newRect = selectedRect(state);
+  const types = tableNodeTypes(state.schema);
 
+  // Get if the header row and column are enabled on the original table
+  const headerRowEnabled = isHeaderEnabledByType('row', newRect, types);
+  const headerColumnEnabled = isHeaderEnabledByType('column', newRect, types);
   if (tableStart) {
     table = state.doc.nodeAt(tableStart - 1);
-
     if (!table) {
       throw new Error(`insertCells: could not find table at pos ${tableStart - 1}`);
     }
   }
-
   let map = TableMap.get(table);
   const {
     top,
@@ -382,44 +375,37 @@ export function insertCells(state, dispatch, tableStart, rect, cells) {
     tr
   } = state;
   let mapFrom = 0;
-
   function recomp() {
     table = tableStart ? tr.doc.nodeAt(tableStart - 1) : tr.doc;
     map = TableMap.get(table);
     mapFrom = tr.mapping.maps.length;
-  } // Prepare the table to be large enough and not have any cells
+  }
+  // Prepare the table to be large enough and not have any cells
   // crossing the boundaries of the rectangle that we want to
   // insert into. If anything about it changes, recompute the table
   // map so that subsequent operations can see the current shape.
-
-
   if (growTable(tr, map, table, tableStart, right, bottom, mapFrom)) {
     recomp();
   }
-
   if (isolateHorizontal(tr, map, table, tableStart, left, right, top, mapFrom)) {
     recomp();
   }
-
   if (isolateHorizontal(tr, map, table, tableStart, left, right, bottom, mapFrom)) {
     recomp();
   }
-
   if (isolateVertical(tr, map, table, tableStart, top, bottom, left, mapFrom)) {
     recomp();
   }
-
   if (isolateVertical(tr, map, table, tableStart, top, bottom, right, mapFrom)) {
     recomp();
   }
-
   for (let row = top; row < bottom; row++) {
     const from = map.positionAt(row, left, table);
     const to = map.positionAt(row, right, table);
     tr.replace(tr.mapping.slice(mapFrom).map(from + tableStart), tr.mapping.slice(mapFrom).map(to + tableStart), new Slice(cells.rows[row - top], 0, 0));
   }
-
   recomp();
+  applyHeaderCells(tr, map, state, tableStart, table, headerRowEnabled, headerColumnEnabled);
   tr.setSelection(new CellSelection(tr.doc.resolve(tableStart + map.positionAt(top, left, table)), tr.doc.resolve(tableStart + map.positionAt(bottom - 1, right - 1, table))));
   dispatch(tr);
 }

package/dist/es2019/utils/create-table.js

@@ -1,17 +1,15 @@
 import { tableNodeTypes } from './table-node-types';
 import { uuid } from './uuid';
-
 const createCell = (cellType, cellContent) => {
   if (cellContent) {
     return cellType.createChecked(null, cellContent);
   }
-
   return cellType.createAndFill();
-}; // Returns a table node of a given size.
+};
+
+// Returns a table node of a given size.
 // `withHeaderRow` defines whether the first row of the table will be a header row.
 // `cellContent` defines the content of each cell.
-
-
 export const createTable = ({
   schema,
   rowsCount = 3,
@@ -27,29 +25,22 @@ export const createTable = ({
   } = tableNodeTypes(schema);
   const cells = [];
   const headerCells = [];
-
   for (let i = 0; i < colsCount; i++) {
     const cell = createCell(tableCell, cellContent);
-
     if (cell) {
       cells.push(cell);
     }
-
     if (withHeaderRow) {
       const headerCell = createCell(tableHeader, cellContent);
-
       if (headerCell) {
         headerCells.push(headerCell);
       }
     }
   }
-
   const rows = [];
-
   for (let i = 0; i < rowsCount; i++) {
     rows.push(tableRow.createChecked(null, withHeaderRow && i === 0 ? headerCells : cells));
   }
-
   return table.createChecked({
     localId: uuid.generate()
   }, rows);

package/dist/es2019/utils/draw-cell-selection.js

@@ -4,7 +4,6 @@ export function drawCellSelection(state) {
   if (!(state.selection instanceof CellSelection)) {
     return null;
   }
-
   const cells = [];
   state.selection.forEachCell((node, pos) => {
     cells.push(Decoration.node(pos, pos + node.nodeSize, {

package/dist/es2019/utils/empty-cells.js

@@ -1,15 +1,14 @@
 import { cloneTr } from './clone-tr';
-import { tableNodeTypes } from './table-node-types'; // Returns a new transaction that clears the content of a given `cell`.
+import { tableNodeTypes } from './table-node-types';
 
+// Returns a new transaction that clears the content of a given `cell`.
 export const emptyCell = (cell, schema) => tr => {
   if (cell) {
     const node = tableNodeTypes(schema).cell.createAndFill();
-
     if (node && !cell.node.content.eq(node.content)) {
       tr.replaceWith(cell.pos + 1, cell.pos + cell.node.nodeSize, node.content);
       return cloneTr(tr);
     }
   }
-
   return tr;
 };

package/dist/es2019/utils/find.js

@@ -1,26 +1,26 @@
 import { findParentNode, findParentNodeClosestToPos } from 'prosemirror-utils';
-import { TableMap } from '../table-map'; // Iterates over parent nodes, returning the closest table node.
+import { TableMap } from '../table-map';
 
-export const findTable = selection => findParentNode(node => node.type.spec.tableRole && node.type.spec.tableRole === 'table')(selection); // Iterates over parent nodes, returning a table node closest to a given `$pos`.
+// Iterates over parent nodes, returning the closest table node.
+export const findTable = selection => findParentNode(node => node.type.spec.tableRole && node.type.spec.tableRole === 'table')(selection);
 
+// Iterates over parent nodes, returning a table node closest to a given `$pos`.
 export const findTableClosestToPos = $pos => {
   const predicate = node => node.type.spec.tableRole && node.type.spec.tableRole === 'table';
-
   return findParentNodeClosestToPos($pos, predicate);
-}; // Iterates over parent nodes, returning a table cell or a table header node closest to a given `$pos`.
+};
 
+// Iterates over parent nodes, returning a table cell or a table header node closest to a given `$pos`.
 export const findCellClosestToPos = $pos => {
   const predicate = node => node.type.spec.tableRole && /cell/i.test(node.type.spec.tableRole);
-
   return findParentNodeClosestToPos($pos, predicate);
-}; // Returns the rectangle spanning a cell closest to a given `$pos`.
+};
 
+// Returns the rectangle spanning a cell closest to a given `$pos`.
 export const findCellRectClosestToPos = $pos => {
   const cell = findCellClosestToPos($pos);
-
   if (cell) {
     const table = findTableClosestToPos($pos);
-
     if (table) {
       const map = TableMap.get(table.node);
       const cellPos = cell.pos - table.start;