@atlaskit/editor-plugin-table 1.1.0 → 1.1.2

package/dist/cjs/plugins/table/utils/decoration.js

@@ -1,42 +1,29 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.updateDecorations = exports.findControlsHoverDecoration = exports.findColumnControlSelectedDecoration = exports.createResizeHandleDecoration = exports.createControlsHoverDecoration = exports.createColumnSelectedDecoration = exports.createColumnLineResize = exports.createColumnControlsDecoration = exports.createCellHoverDecoration = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _tableMap = require("@atlaskit/editor-tables/table-map");
-
 var _utils = require("@atlaskit/editor-tables/utils");
-
 var _prosemirrorView = require("prosemirror-view");
-
 var _utils2 = require("@atlaskit/editor-common/utils");
-
 var _types = require("../types");
-
 var filterDecorationByKey = function filterDecorationByKey(key, decorationSet) {
   return decorationSet.find(undefined, undefined, function (spec) {
     return spec.key.indexOf(key) > -1;
   });
 };
-
 var findColumnControlSelectedDecoration = function findColumnControlSelectedDecoration(decorationSet) {
   return filterDecorationByKey(_types.TableDecorations.COLUMN_SELECTED, decorationSet);
 };
-
 exports.findColumnControlSelectedDecoration = findColumnControlSelectedDecoration;
-
 var findControlsHoverDecoration = function findControlsHoverDecoration(decorationSet) {
   return filterDecorationByKey(_types.TableDecorations.ALL_CONTROLS_HOVER, decorationSet);
 };
-
 exports.findControlsHoverDecoration = findControlsHoverDecoration;
-
 var createCellHoverDecoration = function createCellHoverDecoration(cells, type) {
   return cells.map(function (cell) {
     return _prosemirrorView.Decoration.node(cell.pos, cell.pos + cell.node.nodeSize, {
@@ -46,44 +33,36 @@ var createCellHoverDecoration = function createCellHoverDecoration(cells, type)
     });
   });
 };
-
 exports.createCellHoverDecoration = createCellHoverDecoration;
-
 var createControlsHoverDecoration = function createControlsHoverDecoration(cells, type, tr, danger, selected) {
   var table = (0, _utils.findTable)(tr.selection);
-
   if (!table) {
     return [];
   }
-
   var map = _tableMap.TableMap.get(table.node);
-
   var _cells$reduce = cells.reduce(function (_ref, cell) {
-    var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
+      var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
         min = _ref2[0],
         max = _ref2[1];
-
-    if (min === null || cell.pos < min) {
-      min = cell.pos;
-    }
-
-    if (max === null || cell.pos > max) {
-      max = cell.pos;
-    }
-
-    return [min, max];
-  }, [null, null]),
-      _cells$reduce2 = (0, _slicedToArray2.default)(_cells$reduce, 2),
-      min = _cells$reduce2[0],
-      max = _cells$reduce2[1];
-
+      if (min === null || cell.pos < min) {
+        min = cell.pos;
+      }
+      if (max === null || cell.pos > max) {
+        max = cell.pos;
+      }
+      return [min, max];
+    }, [null, null]),
+    _cells$reduce2 = (0, _slicedToArray2.default)(_cells$reduce, 2),
+    min = _cells$reduce2[0],
+    max = _cells$reduce2[1];
   if (min === null || max === null) {
     return [];
   }
-
   var updatedCells = cells.map(function (x) {
     return x.pos;
-  }); // ED-15246 fixed trello card table overflow issue
+  });
+
+  // ED-15246 fixed trello card table overflow issue
   // If columns / rows have been merged the hovered selection is different to the actual selection
   // So If the table cells are in danger we want to create a "rectangle" selection
   // to match the "clicked" selection
@@ -92,68 +71,59 @@ var createControlsHoverDecoration = function createControlsHoverDecoration(cells
     // Find the bounding rectangle of all the given cells, also considering
     // merged cells.
     var _cells$reduce3 = cells.reduce(function (acc, cell) {
-      var _map$findCell = map.findCell(cell.pos - table.start),
+        var _map$findCell = map.findCell(cell.pos - table.start),
           left = _map$findCell.left,
           right = _map$findCell.right,
           bottom = _map$findCell.bottom,
-          top = _map$findCell.top; // Finding the bounding rect requires finding the min left and top positions,
-      // and the max right and bottom positions of the cells
-
-
-      return {
-        recLeft: Math.min(acc.recLeft, left),
-        recTop: Math.min(acc.recTop, top),
-        recRight: Math.max(acc.recRight, right),
-        recBottom: Math.max(acc.recBottom, bottom)
-      };
-    }, // +-Infinity as initialisation vars which will always be overwritten
-    // by smaller/larger values respectively
-    {
-      recLeft: Infinity,
-      recTop: Infinity,
-      recRight: -Infinity,
-      recBottom: -Infinity
-    }),
-        recLeft = _cells$reduce3.recLeft,
-        recTop = _cells$reduce3.recTop,
-        recRight = _cells$reduce3.recRight,
-        recBottom = _cells$reduce3.recBottom;
-
+          top = _map$findCell.top;
+        // Finding the bounding rect requires finding the min left and top positions,
+        // and the max right and bottom positions of the cells
+        return {
+          recLeft: Math.min(acc.recLeft, left),
+          recTop: Math.min(acc.recTop, top),
+          recRight: Math.max(acc.recRight, right),
+          recBottom: Math.max(acc.recBottom, bottom)
+        };
+      },
+      // +-Infinity as initialisation vars which will always be overwritten
+      // by smaller/larger values respectively
+      {
+        recLeft: Infinity,
+        recTop: Infinity,
+        recRight: -Infinity,
+        recBottom: -Infinity
+      }),
+      recLeft = _cells$reduce3.recLeft,
+      recTop = _cells$reduce3.recTop,
+      recRight = _cells$reduce3.recRight,
+      recBottom = _cells$reduce3.recBottom;
     var rect = new _tableMap.Rect(recLeft, recTop, recRight, recBottom);
     updatedCells = map.cellsInRect(rect).map(function (x) {
       return x + table.start;
     });
   }
-
   return updatedCells.map(function (pos) {
     var cell = tr.doc.nodeAt(pos);
     var classes = [_types.TableCssClassName.HOVERED_CELL];
-
     if (danger) {
       classes.push(_types.TableCssClassName.HOVERED_CELL_IN_DANGER);
     }
-
     if (selected) {
       classes.push(_types.TableCssClassName.SELECTED_CELL);
     }
-
     classes.push(type === 'column' ? _types.TableCssClassName.HOVERED_COLUMN : type === 'row' ? _types.TableCssClassName.HOVERED_ROW : _types.TableCssClassName.HOVERED_TABLE);
     var key;
-
     switch (type) {
       case 'row':
         key = _types.TableDecorations.ROW_CONTROLS_HOVER;
         break;
-
       case 'column':
         key = _types.TableDecorations.COLUMN_CONTROLS_HOVER;
         break;
-
       default:
         key = _types.TableDecorations.TABLE_CONTROLS_HOVER;
         break;
     }
-
     return _prosemirrorView.Decoration.node(pos, pos + cell.nodeSize, {
       class: classes.join(' ')
     }, {
@@ -161,21 +131,16 @@ var createControlsHoverDecoration = function createControlsHoverDecoration(cells
     });
   });
 };
-
 exports.createControlsHoverDecoration = createControlsHoverDecoration;
-
 var createColumnSelectedDecoration = function createColumnSelectedDecoration(tr) {
   var selection = tr.selection,
-      doc = tr.doc;
+    doc = tr.doc;
   var table = (0, _utils.findTable)(selection);
   var rect = (0, _utils.getSelectionRect)(selection);
-
   if (!table || !rect) {
     return [];
   }
-
   var map = _tableMap.TableMap.get(table.node);
-
   var cellPositions = map.cellsInRect(rect);
   return cellPositions.map(function (pos, index) {
     var cell = doc.nodeAt(pos + table.start);
@@ -186,19 +151,18 @@ var createColumnSelectedDecoration = function createColumnSelectedDecoration(tr)
     });
   });
 };
-
 exports.createColumnSelectedDecoration = createColumnSelectedDecoration;
-
 var createColumnControlsDecoration = function createColumnControlsDecoration(selection) {
   var cells = (0, _utils.getCellsInRow)(0)(selection) || [];
   var index = 0;
   return cells.map(function (cell) {
-    var colspan = cell.node.attrs.colspan || 1; // It's important these values are scoped locally as the widget callback could be executed anytime in the future
+    var colspan = cell.node.attrs.colspan || 1;
+    // It's important these values are scoped locally as the widget callback could be executed anytime in the future
     // and we want to avoid value leak
-
     var startIndex = index;
-    var endIndex = startIndex + colspan; // The next cell start index will commence from the current cell end index.
+    var endIndex = startIndex + colspan;
 
+    // The next cell start index will commence from the current cell end index.
     index = endIndex;
     return _prosemirrorView.Decoration.widget(cell.pos + 1, function () {
       var element = document.createElement('div');
@@ -213,20 +177,17 @@ var createColumnControlsDecoration = function createColumnControlsDecoration(sel
     });
   });
 };
-
 exports.createColumnControlsDecoration = createColumnControlsDecoration;
-
 var updateDecorations = function updateDecorations(node, decorationSet, decorations, key) {
   var filteredDecorations = filterDecorationByKey(key, decorationSet);
   var decorationSetFiltered = decorationSet.remove(filteredDecorations);
   return decorationSetFiltered.add(node, decorations);
 };
-
 exports.updateDecorations = updateDecorations;
-
 var makeArray = function makeArray(n) {
   return Array.from(Array(n).keys());
 };
+
 /*
  * This function will create two specific decorations for each cell in a column index target,
  * for example given that table:
@@ -306,22 +267,16 @@ var makeArray = function makeArray(n) {
  *   we will add a new class on the last item for each cell,
  *   hence the second media will receive this class `ClassName.LAST_ITEM_IN_CELL`
  */
-
-
 var createResizeHandleDecoration = function createResizeHandleDecoration(tr, rowIndexTarget, columnEndIndexTarget) {
   var emptyResult = [[], []];
   var table = (0, _utils.findTable)(tr.selection);
-
   if (!table || !table.node) {
     return emptyResult;
   }
-
   var map = _tableMap.TableMap.get(table.node);
-
   if (!map.width) {
     return emptyResult;
   }
-
   var createResizerHandleDecoration = function createResizerHandleDecoration(cellColumnPositioning, columnIndex, rowIndex, cellPos, cellNode) {
     var position = cellPos + cellNode.nodeSize - 1;
     return _prosemirrorView.Decoration.widget(position, function () {
@@ -334,7 +289,6 @@ var createResizeHandleDecoration = function createResizeHandleDecoration(tr, row
       key: "".concat(_types.TableDecorations.COLUMN_RESIZING_HANDLE, "_").concat(rowIndex, "_").concat(columnIndex)
     });
   };
-
   var createLastCellElementDecoration = function createLastCellElementDecoration(cellColumnPositioning, cellPos, cellNode) {
     var lastItemPositions;
     cellNode.forEach(function (childNode, offset, index) {
@@ -346,51 +300,39 @@ var createResizeHandleDecoration = function createResizeHandleDecoration(tr, row
         };
       }
     });
-
     if (!lastItemPositions) {
       return null;
     }
-
     return _prosemirrorView.Decoration.node(lastItemPositions.from, lastItemPositions.to, {
       class: _types.TableCssClassName.LAST_ITEM_IN_CELL
     }, {
       key: "".concat(_types.TableDecorations.LAST_CELL_ELEMENT, "_").concat(cellColumnPositioning.left, "_").concat(cellColumnPositioning.right)
     });
   };
-
   var resizeHandleCellDecorations = [];
   var lastCellElementsDecorations = [];
-
   for (var rowIndex = 0; rowIndex < map.height; rowIndex++) {
     var seen = {};
-
     if (rowIndex !== rowIndexTarget) {
       continue;
     }
-
     for (var columnIndex = 0; columnIndex < map.width; columnIndex++) {
       var cellPosition = map.map[map.width * rowIndex + columnIndex];
-
       if (seen[cellPosition]) {
         continue;
       }
-
       seen[cellPosition] = true;
       var cellPos = table.start + cellPosition;
       var cell = tr.doc.nodeAt(cellPos);
-
       if (!cell) {
         continue;
       }
-
       var colspan = cell.attrs.colspan || 1;
       var startIndex = columnIndex;
       var endIndex = colspan + startIndex;
-
       if (endIndex !== columnEndIndexTarget.right) {
         continue;
       }
-
       var resizerHandleDec = createResizerHandleDecoration({
         left: startIndex,
         right: endIndex
@@ -403,9 +345,9 @@ var createResizeHandleDecoration = function createResizeHandleDecoration(tr, row
       lastCellElementsDecorations.push(lastCellDec);
     }
   }
-
   return [resizeHandleCellDecorations, lastCellElementsDecorations.filter(_utils2.nonNullable)];
 };
+
 /*
  * This function will create a decoration for each cell using the right position on the CellColumnPositioning
  * for example given that table:
@@ -448,27 +390,18 @@ var createResizeHandleDecoration = function createResizeHandleDecoration(tr, row
  * this function will return two decorations applying a new class `ClassName.WITH_RESIZE_LINE`
  * only on the cells: `C1` and `D1`.
  */
-
-
 exports.createResizeHandleDecoration = createResizeHandleDecoration;
-
 var createColumnLineResize = function createColumnLineResize(selection, cellColumnPositioning) {
   var table = (0, _utils.findTable)(selection);
-
   if (!table || cellColumnPositioning.right === null) {
     return [];
   }
-
   var columnIndex = cellColumnPositioning.right;
-
   var map = _tableMap.TableMap.get(table.node);
-
   var isLastColumn = columnIndex === map.width;
-
   if (isLastColumn) {
     columnIndex -= 1;
   }
-
   var decorationClassName = isLastColumn ? _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN : _types.TableCssClassName.WITH_RESIZE_LINE;
   var cellPositions = makeArray(map.height).map(function (rowIndex) {
     return map.map[map.width * rowIndex + columnIndex];
@@ -480,6 +413,7 @@ var createColumnLineResize = function createColumnLineResize(selection, cellColu
     var nextPosition = map.map[map.width * rowIndex + columnIndex - 1];
     return cellPosition !== nextPosition; // Removed it if next position is merged
   });
+
   var cells = cellPositions.map(function (pos) {
     return {
       pos: pos + table.start,
@@ -490,7 +424,6 @@ var createColumnLineResize = function createColumnLineResize(selection, cellColu
     if (!cell || !cell.node) {
       return;
     }
-
     return _prosemirrorView.Decoration.node(cell.pos, cell.pos + cell.node.nodeSize, {
       class: decorationClassName
     }, {
@@ -498,5 +431,4 @@ var createColumnLineResize = function createColumnLineResize(selection, cellColu
     });
   }).filter(_utils2.nonNullable);
 };
-
 exports.createColumnLineResize = createColumnLineResize;

package/dist/cjs/plugins/table/utils/dom.js

@@ -4,66 +4,46 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.updateResizeHandles = exports.isTableControlsButton = exports.isTableContainerOrWrapper = exports.isRowControlsButton = exports.isResizeHandleDecoration = exports.isInsertRowButton = exports.isCornerButton = exports.isColumnControlsDecorations = exports.isCell = exports.hasResizeHandler = exports.getMousePositionVerticalRelativeByElement = exports.getMousePositionHorizontalRelativeByElement = exports.getColumnOrRowIndex = void 0;
-
 var _utils = require("@atlaskit/editor-common/utils");
-
 var _types = require("../types");
-
 var _consts = require("../ui/consts");
-
 var SELECTOR_TABLE_LEAFS = ".".concat(_types.TableCssClassName.TABLE_CELL, ", .").concat(_types.TableCssClassName.TABLE_HEADER_CELL);
-
 var isCell = function isCell(node) {
   return Boolean(node && (['TH', 'TD'].indexOf(node.tagName) > -1 || !!(0, _utils.closestElement)(node, ".".concat(_types.TableCssClassName.TABLE_HEADER_CELL)) || !!(0, _utils.closestElement)(node, ".".concat(_types.TableCssClassName.TABLE_CELL))));
 };
-
 exports.isCell = isCell;
-
 var isCornerButton = function isCornerButton(node) {
   return (0, _utils.containsClassName)(node, _types.TableCssClassName.CONTROLS_CORNER_BUTTON);
 };
-
 exports.isCornerButton = isCornerButton;
-
 var isInsertRowButton = function isInsertRowButton(node) {
   return (0, _utils.containsClassName)(node, _types.TableCssClassName.CONTROLS_INSERT_ROW) || (0, _utils.closestElement)(node, ".".concat(_types.TableCssClassName.CONTROLS_INSERT_ROW)) || (0, _utils.containsClassName)(node, _types.TableCssClassName.CONTROLS_BUTTON_OVERLAY) && (0, _utils.closestElement)(node, ".".concat(_types.TableCssClassName.ROW_CONTROLS));
 };
-
 exports.isInsertRowButton = isInsertRowButton;
-
 var getColumnOrRowIndex = function getColumnOrRowIndex(target) {
   return [parseInt(target.getAttribute('data-start-index') || '-1', 10), parseInt(target.getAttribute('data-end-index') || '-1', 10)];
 };
-
 exports.getColumnOrRowIndex = getColumnOrRowIndex;
-
 var isColumnControlsDecorations = function isColumnControlsDecorations(node) {
   return (0, _utils.containsClassName)(node, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS);
 };
-
 exports.isColumnControlsDecorations = isColumnControlsDecorations;
-
 var isRowControlsButton = function isRowControlsButton(node) {
   return (0, _utils.containsClassName)(node, _types.TableCssClassName.ROW_CONTROLS_BUTTON) || (0, _utils.containsClassName)(node, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON);
 };
-
 exports.isRowControlsButton = isRowControlsButton;
-
 var isResizeHandleDecoration = function isResizeHandleDecoration(node) {
   return (0, _utils.containsClassName)(node, _types.TableCssClassName.RESIZE_HANDLE_DECORATION);
 };
-
 exports.isResizeHandleDecoration = isResizeHandleDecoration;
-
 var isTableControlsButton = function isTableControlsButton(node) {
   return (0, _utils.containsClassName)(node, _types.TableCssClassName.CONTROLS_BUTTON) || (0, _utils.containsClassName)(node, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP);
 };
-
 exports.isTableControlsButton = isTableControlsButton;
-
 var isTableContainerOrWrapper = function isTableContainerOrWrapper(node) {
   return (0, _utils.containsClassName)(node, _types.TableCssClassName.TABLE_CONTAINER) || (0, _utils.containsClassName)(node, _types.TableCssClassName.TABLE_NODE_WRAPPER);
 };
+
 /*
  * This function returns which side of a given element the mouse cursor is,
  * using as a base the half of the width by default, for example:
@@ -117,20 +97,14 @@ var isTableContainerOrWrapper = function isTableContainerOrWrapper(node) {
  *
  * the same is valid to the right side.
  */
-
-
 exports.isTableContainerOrWrapper = isTableContainerOrWrapper;
-
 var getMousePositionHorizontalRelativeByElement = function getMousePositionHorizontalRelativeByElement(mouseEvent, mouseMoveOptimization, elementContentRects, gapInPixels) {
   var element = mouseEvent.target;
-
   if (element instanceof HTMLElement) {
     var width, x;
     var closestCell = element.closest(SELECTOR_TABLE_LEAFS);
-
     if (mouseMoveOptimization) {
       var _closestCell$id, _elementContentRects$, _elementContentRects$2;
-
       var id = (_closestCell$id = closestCell === null || closestCell === void 0 ? void 0 : closestCell.id) !== null && _closestCell$id !== void 0 ? _closestCell$id : '';
       width = (_elementContentRects$ = elementContentRects === null || elementContentRects === void 0 ? void 0 : (_elementContentRects$2 = elementContentRects[id]) === null || _elementContentRects$2 === void 0 ? void 0 : _elementContentRects$2.width) !== null && _elementContentRects$ !== void 0 ? _elementContentRects$ : 0;
       x = mouseEvent.offsetX;
@@ -140,11 +114,9 @@ var getMousePositionHorizontalRelativeByElement = function getMousePositionHoriz
       var left = elementRect.left;
       x = mouseEvent.clientX - left;
     }
-
     if (width <= 0) {
       return null;
     }
-
     if (!gapInPixels) {
       return x / width > 0.5 ? 'right' : 'left';
     } else {
@@ -155,68 +127,49 @@ var getMousePositionHorizontalRelativeByElement = function getMousePositionHoriz
       }
     }
   }
-
   return null;
 };
-
 exports.getMousePositionHorizontalRelativeByElement = getMousePositionHorizontalRelativeByElement;
-
 var getMousePositionVerticalRelativeByElement = function getMousePositionVerticalRelativeByElement(mouseEvent) {
   var element = mouseEvent.target;
-
   if (element instanceof HTMLElement) {
     var elementRect = element.getBoundingClientRect();
-
     if (elementRect.height <= 0) {
       return null;
     }
-
     var y = mouseEvent.clientY - elementRect.top;
     return y / elementRect.height > 0.5 ? 'bottom' : 'top';
   }
-
   return null;
 };
-
 exports.getMousePositionVerticalRelativeByElement = getMousePositionVerticalRelativeByElement;
-
 var updateResizeHandles = function updateResizeHandles(tableRef) {
   if (!tableRef) {
     return;
   }
-
-  var height = tableRef.offsetHeight + _consts.tableToolbarSize; // see ED-7600
-
+  var height = tableRef.offsetHeight + _consts.tableToolbarSize;
+  // see ED-7600
   var nodes = Array.from(tableRef.querySelectorAll(".".concat(_types.TableCssClassName.RESIZE_HANDLE)));
-
   if (!nodes || !nodes.length) {
     return;
   }
-
   nodes.forEach(function (node) {
     node.style.height = "".concat(height, "px");
   });
 };
-
 exports.updateResizeHandles = updateResizeHandles;
-
 var hasResizeHandler = function hasResizeHandler(_ref) {
   var columnEndIndexTarget = _ref.columnEndIndexTarget,
-      target = _ref.target;
+    target = _ref.target;
   var tableElement = (0, _utils.closestElement)(target, 'table');
-
   if (!tableElement) {
     return false;
   }
-
   var query = [".".concat(_types.TableCssClassName.RESIZE_HANDLE_DECORATION), "[data-end-index=\"".concat(columnEndIndexTarget, "\"]")];
   var decorationElement = tableElement.querySelectorAll(query.join(''));
-
   if (!decorationElement || decorationElement.length === 0) {
     return false;
   }
-
   return true;
 };
-
 exports.hasResizeHandler = hasResizeHandler;

package/dist/cjs/plugins/table/utils/get-allow-add-column-custom-step.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getAllowAddColumnCustomStep = getAllowAddColumnCustomStep;
-
 var _pluginFactory = require("../pm-plugins/plugin-factory");
-
 function getAllowAddColumnCustomStep(state) {
   var tablePluginState = (0, _pluginFactory.getPluginState)(state);
   return Boolean(tablePluginState) && Boolean(tablePluginState.pluginConfig.allowAddColumnWithCustomStep);

package/dist/cjs/plugins/table/utils/index.js

@@ -333,23 +333,13 @@ Object.defineProperty(exports, "updateResizeHandles", {
     return _dom.updateResizeHandles;
   }
 });
-
 var _selection = require("./selection");
-
 var _decoration = require("./decoration");
-
 var _nodes = require("./nodes");
-
 var _paste = require("./paste");
-
 var _dom = require("./dom");
-
 var _columnControls = require("./column-controls");
-
 var _rowControls = require("./row-controls");
-
 var _analytics = require("./analytics");
-
 var _table = require("./table");
-
 var _updatePluginStateDecorations = require("./update-plugin-state-decorations");