@atlaskit/editor-plugin-table 1.1.0 → 1.1.2

package/dist/esm/plugins/table/nodeviews/table.js

@@ -8,11 +8,8 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 import React from 'react';
 import { DOMSerializer } from 'prosemirror-model';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
@@ -24,7 +21,6 @@ import { pluginKey as tableResizingPluginKey } from '../pm-plugins/table-resizin
 import { generateColgroup } from '../pm-plugins/table-resizing/utils';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import TableComponent from './TableComponent';
-
 var tableAttributes = function tableAttributes(node) {
   return {
     'data-number-column': node.attrs.isNumberColumnEnabled,
@@ -33,61 +29,45 @@ var tableAttributes = function tableAttributes(node) {
     'data-table-local-id': node.attrs.localId || ''
   };
 };
-
 var toDOM = function toDOM(node, props) {
   var colgroup = '';
-
   if (props.allowColumnResizing) {
     colgroup = ['colgroup', {}].concat(_toConsumableArray(generateColgroup(node)));
   }
-
   return ['table', tableAttributes(node), colgroup, ['tbody', 0]];
 };
-
 var TableView = /*#__PURE__*/function (_ReactNodeView) {
   _inherits(TableView, _ReactNodeView);
-
   var _super = _createSuper(TableView);
-
   function TableView(props) {
     var _this;
-
     _classCallCheck(this, TableView);
-
     _this = _super.call(this, props.node, props.view, props.getPos, props.portalProviderAPI, props.eventDispatcher, props, undefined, undefined, undefined, props.hasIntlContext);
-
     _defineProperty(_assertThisInitialized(_this), "getNode", function () {
       return _this.node;
     });
-
     _defineProperty(_assertThisInitialized(_this), "hasHoveredRows", false);
-
     _this.getPos = props.getPos;
     _this.tableRenderOptimization = props.tableRenderOptimization;
     _this.eventDispatcher = props.eventDispatcher;
     return _this;
   }
-
   _createClass(TableView, [{
     key: "getContentDOM",
     value: function getContentDOM() {
       var rendered = DOMSerializer.renderSpec(document, toDOM(this.node, this.reactComponentProps));
-
       if (rendered.dom) {
         this.table = rendered.dom;
       }
-
       return rendered;
     }
   }, {
     key: "setDomAttrs",
     value: function setDomAttrs(node) {
       var _this2 = this;
-
       if (!this.table) {
         return;
       }
-
       var attrs = tableAttributes(node);
       Object.keys(attrs).forEach(function (attr) {
         _this2.table.setAttribute(attr, attrs[attr]);
@@ -97,7 +77,6 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
     key: "render",
     value: function render(props, forwardRef) {
       var _this3 = this;
-
       // TODO: ED-15663
       // Please, do not copy or use this kind of code below
       // @ts-ignore
@@ -106,10 +85,11 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
         getState: function getState(state) {
           return state['widthPlugin$'];
         }
-      }; // TODO: ED-15663
+      };
+
+      // TODO: ED-15663
       // Please, do not copy or use this kind of code below
       // @ts-ignore
-
       var fakeMediaPluginKey = {
         key: 'mediaPlugin$',
         getState: function getState(state) {
@@ -126,8 +106,8 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
         editorView: props.view,
         render: function render(pluginStates) {
           var tableResizingPluginState = pluginStates.tableResizingPluginState,
-              pluginState = pluginStates.pluginState,
-              mediaState = pluginStates.mediaState;
+            pluginState = pluginStates.pluginState,
+            mediaState = pluginStates.mediaState;
           var tableActive = props.getPos() === pluginState.tablePos;
           var containerWidth = props.getEditorContainerWidth();
           return /*#__PURE__*/React.createElement(TableComponent, {
@@ -156,85 +136,65 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
     value: function viewShouldUpdate(nextNode) {
       if (this.tableRenderOptimization) {
         var _getPluginState = getPluginState(this.view.state),
-            hoveredRows = _getPluginState.hoveredRows;
-
+          hoveredRows = _getPluginState.hoveredRows;
         var hoveredRowsChanged = !!(hoveredRows !== null && hoveredRows !== void 0 && hoveredRows.length) !== this.hasHoveredRows;
-
         if (nextNode.attrs.isNumberColumnEnabled && hoveredRowsChanged) {
           this.hasHoveredRows = !!(hoveredRows !== null && hoveredRows !== void 0 && hoveredRows.length);
           return true;
         }
-
         var _node = this.getNode();
-
         if (_typeof(_node.attrs) !== _typeof(nextNode.attrs)) {
           return true;
         }
-
         var attrKeys = Object.keys(_node.attrs);
         var nextAttrKeys = Object.keys(nextNode.attrs);
-
         if (attrKeys.length !== nextAttrKeys.length) {
           return true;
         }
-
         var tableMap = TableMap.get(_node);
         var nextTableMap = TableMap.get(nextNode);
-
         if (tableMap.width !== nextTableMap.width) {
           return true;
         }
-
         return attrKeys.some(function (key) {
           return _node.attrs[key] !== nextNode.attrs[key];
         });
       }
-
       return _get(_getPrototypeOf(TableView.prototype), "viewShouldUpdate", this).call(this, nextNode);
     }
   }, {
     key: "ignoreMutation",
     value: function ignoreMutation(mutation) {
       var type = mutation.type,
-          _mutation$target = mutation.target,
-          nodeName = _mutation$target.nodeName,
-          firstChild = _mutation$target.firstChild;
-
+        _mutation$target = mutation.target,
+        nodeName = _mutation$target.nodeName,
+        firstChild = _mutation$target.firstChild;
       if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
         return false;
       }
-
       return true;
     }
   }, {
     key: "destroy",
     value: function destroy() {
       var _this$eventDispatcher;
-
       if (this.resizeObserver) {
         this.resizeObserver.disconnect();
       }
-
       (_this$eventDispatcher = this.eventDispatcher) === null || _this$eventDispatcher === void 0 ? void 0 : _this$eventDispatcher.emit('TABLE_DELETED', this.node);
-
       _get(_getPrototypeOf(TableView.prototype), "destroy", this).call(this);
     }
   }]);
-
   return TableView;
 }(ReactNodeView);
-
 export { TableView as default };
 export var createTableView = function createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, options, getEditorContainerWidth, getEditorFeatureFlags) {
   var _getPluginState2 = getPluginState(view.state),
-      pluginConfig = _getPluginState2.pluginConfig;
-
+    pluginConfig = _getPluginState2.pluginConfig;
   var _getPluginConfig = getPluginConfig(pluginConfig),
-      allowColumnResizing = _getPluginConfig.allowColumnResizing;
-
+    allowColumnResizing = _getPluginConfig.allowColumnResizing;
   var _getEditorFeatureFlag = getEditorFeatureFlags(),
-      tableRenderOptimization = _getEditorFeatureFlag.tableRenderOptimization;
-
+    tableRenderOptimization = _getEditorFeatureFlag.tableRenderOptimization;
   var hasIntlContext = true;
   return new TableView({
     node: node,

package/dist/esm/plugins/table/nodeviews/tableCell.js

@@ -6,25 +6,19 @@ import { DOMSerializer } from 'prosemirror-model';
 import { getCellDomAttrs, getCellAttrs } from '@atlaskit/adf-schema';
 var DEFAULT_COL_SPAN = 1;
 var DEFAULT_ROW_SPAN = 1;
-
 var TableCellNodeView = /*#__PURE__*/function () {
   function TableCellNodeView(node, view, getPos, getEditorFeatureFlags, observer) {
     _classCallCheck(this, TableCellNodeView);
-
     this.view = view;
     this.node = node;
-
     var _DOMSerializer$render = DOMSerializer.renderSpec(document, node.type.spec.toDOM(node)),
-        dom = _DOMSerializer$render.dom,
-        contentDOM = _DOMSerializer$render.contentDOM;
-
+      dom = _DOMSerializer$render.dom,
+      contentDOM = _DOMSerializer$render.contentDOM;
     this.getPos = getPos;
     this.dom = dom;
     this.contentDOM = contentDOM;
-
     var _getEditorFeatureFlag = getEditorFeatureFlags(),
-        mouseMoveOptimization = _getEditorFeatureFlag.mouseMoveOptimization;
-
+      mouseMoveOptimization = _getEditorFeatureFlag.mouseMoveOptimization;
     if (mouseMoveOptimization && observer) {
       this.contentDOM.id = uuid();
       this.mouseMoveOptimization = mouseMoveOptimization;
@@ -32,71 +26,61 @@ var TableCellNodeView = /*#__PURE__*/function () {
       observer.observe(this.contentDOM);
     }
   }
-
   _createClass(TableCellNodeView, [{
     key: "updateNodeView",
     value: function updateNodeView(node) {
       var _this = this;
-
       if (this.node.type !== node.type) {
         return false;
       }
-
       var attrs = getCellDomAttrs(this.node);
       var nextAttrs = getCellDomAttrs(node);
-
       var _getCellAttrs = getCellAttrs(this.dom),
-          colspan = _getCellAttrs.colspan,
-          rowspan = _getCellAttrs.rowspan; // need to rerender when colspan/rowspan in dom are different from the node attrs
-      // this can happen when undoing merge cells
-
+        colspan = _getCellAttrs.colspan,
+        rowspan = _getCellAttrs.rowspan;
 
+      // need to rerender when colspan/rowspan in dom are different from the node attrs
+      // this can happen when undoing merge cells
       if (colspan !== (node.attrs.colspan || DEFAULT_COL_SPAN) || rowspan !== (node.attrs.rowspan || DEFAULT_ROW_SPAN)) {
         return false;
-      } // added + changed attributes
-
+      }
 
+      // added + changed attributes
       var addedAttrs = Object.entries(nextAttrs).filter(function (_ref) {
         var _ref2 = _slicedToArray(_ref, 2),
-            key = _ref2[0],
-            value = _ref2[1];
-
+          key = _ref2[0],
+          value = _ref2[1];
         return attrs[key] !== value;
       });
       var removedAttrs = Object.keys(attrs).filter(function (key) {
         return !nextAttrs.hasOwnProperty(key);
       });
-
       if (addedAttrs.length || removedAttrs.length) {
         addedAttrs.forEach(function (_ref3) {
           var _ref4 = _slicedToArray(_ref3, 2),
-              key = _ref4[0],
-              value = _ref4[1];
-
+            key = _ref4[0],
+            value = _ref4[1];
           return _this.dom.setAttribute(key, value || '');
         });
         removedAttrs.forEach(function (key) {
           return _this.dom.removeAttribute(key);
         });
         return true;
-      } // Return true to not re-render this node view
-
+      }
 
+      // Return true to not re-render this node view
       if (this.node.sameMarkup(node)) {
         return true;
       }
-
       return false;
     }
   }, {
     key: "update",
     value: function update(node) {
       var didUpdate = this.updateNodeView(node);
-
       if (didUpdate) {
         this.node = node;
       }
-
       return didUpdate;
     }
   }, {
@@ -107,8 +91,6 @@ var TableCellNodeView = /*#__PURE__*/function () {
       }
     }
   }]);
-
   return TableCellNodeView;
 }();
-
 export { TableCellNodeView as default };

package/dist/esm/plugins/table/nodeviews/update-overflow-shadows.js

@@ -8,42 +8,35 @@ export var updateShadowListForStickyStyles = function updateShadowListForStickyS
     }
   });
 };
+
 /**
  * Update overflow shadows for a given wrapper & table.
  * if `overflowShadowOptimization` is enabled, this will exit early.
  */
-
 export var updateOverflowShadows = function updateOverflowShadows(getEditorFeatureFlags) {
   return function (editorState, wrapper, table, rightShadows, leftShadows) {
     var _getEditorFeatureFlag;
-
     if (((_getEditorFeatureFlag = getEditorFeatureFlags()) === null || _getEditorFeatureFlag === void 0 ? void 0 : _getEditorFeatureFlag.tableOverflowShadowsOptimization) === true) {
       return false;
-    } // Right shadow
-
-
+    }
+    // Right shadow
     if (table && wrapper) {
       var stickyRow = wrapper.querySelector('tr.sticky');
       var stickyCell = stickyRow && stickyRow.firstElementChild;
-
       if (rightShadows) {
         var diff = table.offsetWidth - wrapper.offsetWidth;
-
         for (var i = 0; i < rightShadows.length; i++) {
           var rightShadow = rightShadows[i];
           rightShadow.style.display = diff > 0 && diff > wrapper.scrollLeft ? 'block' : 'none';
-
           if (rightShadow.classList.contains(ClassName.TABLE_STICKY_SHADOW) && stickyCell) {
             rightShadow.style.height = "".concat(stickyCell.clientHeight + 1, "px");
           }
         }
       }
-
       if (leftShadows) {
         for (var _i = 0; _i < leftShadows.length; _i++) {
           var leftShadow = leftShadows[_i];
           leftShadow.style.display = wrapper.scrollLeft > 0 ? 'block' : 'none';
-
           if (leftShadow.classList.contains(ClassName.TABLE_STICKY_SHADOW) && stickyCell) {
             leftShadow.style.height = "".concat(stickyCell.clientHeight + 1, "px");
           }

package/dist/esm/plugins/table/pm-plugins/decorations/plugin.js

@@ -16,7 +16,6 @@ export var handleDocOrSelectionChanged = function handleDocOrSelectionChanged(tr
     });
   } else if (tr.selectionSet) {
     var isTransactionFromMouseClick = !tr.docChanged && tr.selectionSet && tr.getMeta('pointer');
-
     if (isTransactionFromMouseClick || oldState.selection instanceof CellSelection) {
       return maybeUpdateColumnControlsSelectedDecoration({
         decorationSet: decorationSet,
@@ -24,7 +23,6 @@ export var handleDocOrSelectionChanged = function handleDocOrSelectionChanged(tr
       });
     }
   }
-
   return decorationSet;
 };
 export var createPlugin = function createPlugin() {
@@ -36,16 +34,13 @@ export var createPlugin = function createPlugin() {
       apply: function apply(tr, decorationSet, oldState) {
         var pluginState = decorationSet;
         var meta = tr.getMeta(tablePluginKey);
-
         if (meta && meta.data && meta.data.decorationSet) {
           pluginState = meta.data.decorationSet;
         }
-
         if (tr.docChanged || tr.selectionSet) {
           pluginState = pluginState.map(tr.mapping, tr.doc);
           return handleDocOrSelectionChanged(tr, pluginState, oldState);
         }
-
         return pluginState;
       }
     },

package/dist/esm/plugins/table/pm-plugins/decorations/utils/column-controls.js

@@ -3,58 +3,47 @@ import { findTable } from '@atlaskit/editor-tables/utils';
 import { TableDecorations } from '../../../types';
 import { createColumnControlsDecoration, createColumnSelectedDecoration, findColumnControlSelectedDecoration, findControlsHoverDecoration, updateDecorations } from '../../../utils/decoration';
 import { composeDecorations } from './compose-decorations';
-
 var isColumnSelected = function isColumnSelected(tr) {
   return tr.selection instanceof CellSelection && tr.selection.isColSelection();
-}; // @see: https://product-fabric.atlassian.net/browse/ED-3796
-
+};
 
+// @see: https://product-fabric.atlassian.net/browse/ED-3796
 var removeControlsHoverDecoration = function removeControlsHoverDecoration(_ref) {
   var decorationSet = _ref.decorationSet;
   return decorationSet.remove(findControlsHoverDecoration(decorationSet));
 };
-
 var maybeUpdateColumnSelectedDecoration = function maybeUpdateColumnSelectedDecoration(_ref2) {
   var decorationSet = _ref2.decorationSet,
-      tr = _ref2.tr;
-
+    tr = _ref2.tr;
   if (!isColumnSelected(tr)) {
     return decorationSet;
   }
-
   return updateDecorations(tr.doc, decorationSet, createColumnSelectedDecoration(tr), TableDecorations.COLUMN_SELECTED);
 };
-
 var maybeUpdateColumnControlsDecoration = function maybeUpdateColumnControlsDecoration(_ref3) {
   var decorationSet = _ref3.decorationSet,
-      tr = _ref3.tr;
+    tr = _ref3.tr;
   var table = findTable(tr.selection);
-
   if (!table) {
     return decorationSet;
   }
-
   return updateDecorations(tr.doc, decorationSet, createColumnControlsDecoration(tr.selection), TableDecorations.COLUMN_CONTROLS_DECORATIONS);
-}; // @see: https://product-fabric.atlassian.net/browse/ED-7304
-
+};
 
+// @see: https://product-fabric.atlassian.net/browse/ED-7304
 var removeColumnControlsSelectedDecoration = function removeColumnControlsSelectedDecoration(_ref4) {
   var decorationSet = _ref4.decorationSet;
   return decorationSet.remove(findColumnControlSelectedDecoration(decorationSet));
 };
-
 var hasColumnSelectedDecorations = function hasColumnSelectedDecorations(decorationSet) {
   return !!findColumnControlSelectedDecoration(decorationSet).length;
 };
-
 export var maybeUpdateColumnControlsSelectedDecoration = function maybeUpdateColumnControlsSelectedDecoration(_ref5) {
   var decorationSet = _ref5.decorationSet,
-      tr = _ref5.tr;
-
+    tr = _ref5.tr;
   if (!hasColumnSelectedDecorations(decorationSet)) {
     return decorationSet;
   }
-
   return removeColumnControlsSelectedDecoration({
     decorationSet: decorationSet,
     tr: tr
@@ -62,7 +51,7 @@ export var maybeUpdateColumnControlsSelectedDecoration = function maybeUpdateCol
 };
 export var buildColumnControlsDecorations = function buildColumnControlsDecorations(_ref6) {
   var decorationSet = _ref6.decorationSet,
-      tr = _ref6.tr;
+    tr = _ref6.tr;
   return composeDecorations([removeColumnControlsSelectedDecoration, removeControlsHoverDecoration, maybeUpdateColumnSelectedDecoration, maybeUpdateColumnControlsDecoration])({
     decorationSet: decorationSet,
     tr: tr

package/dist/esm/plugins/table/pm-plugins/decorations/utils/column-resizing.js

@@ -3,35 +3,30 @@ import { TableDecorations } from '../../../types';
 import { createResizeHandleDecoration, updateDecorations } from '../../../utils/decoration';
 import { composeDecorations } from './compose-decorations';
 var emptyDecorations = [[], []];
-
 var updateColumnResizeHandle = function updateColumnResizeHandle(columnResizesDecorations) {
   return function (_ref) {
     var decorationSet = _ref.decorationSet,
-        tr = _ref.tr;
+      tr = _ref.tr;
     return updateDecorations(tr.doc, decorationSet, columnResizesDecorations, TableDecorations.COLUMN_RESIZING_HANDLE);
   };
 };
-
 var updateLastCellElement = function updateLastCellElement(lastCellElementsDecorations) {
   return function (_ref2) {
     var decorationSet = _ref2.decorationSet,
-        tr = _ref2.tr;
+      tr = _ref2.tr;
     return updateDecorations(tr.doc, decorationSet, lastCellElementsDecorations, TableDecorations.LAST_CELL_ELEMENT);
   };
 };
-
 export var buildColumnResizingDecorations = function buildColumnResizingDecorations(rowEndIndex, columnEndIndex) {
   return function (_ref3) {
     var tr = _ref3.tr,
-        decorationSet = _ref3.decorationSet;
-
+      decorationSet = _ref3.decorationSet;
     var _ref4 = columnEndIndex < 0 ? emptyDecorations : createResizeHandleDecoration(tr, rowEndIndex, {
-      right: columnEndIndex
-    }),
-        _ref5 = _slicedToArray(_ref4, 2),
-        columnResizesDecorations = _ref5[0],
-        lastCellElementsDecorations = _ref5[1];
-
+        right: columnEndIndex
+      }),
+      _ref5 = _slicedToArray(_ref4, 2),
+      columnResizesDecorations = _ref5[0],
+      lastCellElementsDecorations = _ref5[1];
     return composeDecorations([updateColumnResizeHandle(columnResizesDecorations), updateLastCellElement(lastCellElementsDecorations)])({
       decorationSet: decorationSet,
       tr: tr

package/dist/esm/plugins/table/pm-plugins/decorations/utils/compose-decorations.js

@@ -1,7 +1,7 @@
 export var composeDecorations = function composeDecorations(transformers) {
   return function (_ref) {
     var decorationSet = _ref.decorationSet,
-        tr = _ref.tr;
+      tr = _ref.tr;
     return transformers.reduce(function (decorationSet, transform) {
       return transform({
         decorationSet: decorationSet,

package/dist/esm/plugins/table/pm-plugins/keymap.js

@@ -6,7 +6,6 @@ import { triggerUnlessTableHeader, createTable, goToNextCell, moveCursorBackward
 import { addRowAroundSelection, emptyMultipleCellsWithAnalytics, deleteTableIfSelectedWithAnalytics } from '../commands-with-analytics';
 import { addColumnAfter, addColumnBefore } from '../commands/insert';
 import { withEditorAnalyticsAPI } from '../utils/analytics';
-
 var createTableWithAnalytics = function createTableWithAnalytics(editorAnalyticsAPI) {
   return withEditorAnalyticsAPI({
     action: ACTION.INSERTED,
@@ -18,15 +17,15 @@ var createTableWithAnalytics = function createTableWithAnalytics(editorAnalytics
     eventType: EVENT_TYPE.TRACK
   })(editorAnalyticsAPI)(createTable());
 };
-
 export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI) {
   var list = {};
   keymaps.bindKeymapWithCommand(keymaps.nextCell.common, goToNextCell(editorAnalyticsAPI)(1), list);
   keymaps.bindKeymapWithCommand(keymaps.previousCell.common, goToNextCell(editorAnalyticsAPI)(-1), list);
   keymaps.bindKeymapWithCommand(keymaps.toggleTable.common, createTableWithAnalytics(editorAnalyticsAPI), list);
   keymaps.bindKeymapWithCommand(keymaps.backspace.common, chainCommands(deleteTableIfSelectedWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD), emptyMultipleCellsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD)), list);
-  keymaps.bindKeymapWithCommand(keymaps.backspace.common, moveCursorBackward, list); // Add row/column shortcuts
+  keymaps.bindKeymapWithCommand(keymaps.backspace.common, moveCursorBackward, list);
 
+  // Add row/column shortcuts
   keymaps.bindKeymapWithCommand(keymaps.addRowBefore.common, addRowAroundSelection(editorAnalyticsAPI)('TOP'), list);
   keymaps.bindKeymapWithCommand(keymaps.addRowAfter.common, addRowAroundSelection(editorAnalyticsAPI)('BOTTOM'), list);
   keymaps.bindKeymapWithCommand(keymaps.addColumnBefore.common, triggerUnlessTableHeader(addColumnBefore(getEditorContainerWidth)), list);