@atlaskit/editor-plugin-table 0.0.0 → 0.0.2

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

@@ -0,0 +1,261 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.createTableView = void 0;
+
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _prosemirrorModel = require("prosemirror-model");
+
+var _reactNodeView = _interopRequireDefault(require("@atlaskit/editor-common/react-node-view"));
+
+var _withPluginState = require("@atlaskit/editor-common/with-plugin-state");
+
+var _createPluginConfig = require("../create-plugin-config");
+
+var _pluginFactory = require("../pm-plugins/plugin-factory");
+
+var _pluginKey = require("../pm-plugins/plugin-key");
+
+var _tableResizing = require("../pm-plugins/table-resizing");
+
+var _utils = require("../pm-plugins/table-resizing/utils");
+
+var _tableMap = require("@atlaskit/editor-tables/table-map");
+
+var _TableComponent = _interopRequireDefault(require("./TableComponent"));
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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; } }
+
+var tableAttributes = function tableAttributes(node) {
+  return {
+    'data-number-column': node.attrs.isNumberColumnEnabled,
+    'data-layout': node.attrs.layout,
+    'data-autosize': node.attrs.__autoSize,
+    'data-table-local-id': node.attrs.localId || ''
+  };
+};
+
+var toDOM = function toDOM(node, props) {
+  var colgroup = '';
+
+  if (props.allowColumnResizing) {
+    colgroup = ['colgroup', {}].concat((0, _toConsumableArray2.default)((0, _utils.generateColgroup)(node)));
+  }
+
+  return ['table', tableAttributes(node), colgroup, ['tbody', 0]];
+};
+
+var TableView = /*#__PURE__*/function (_ReactNodeView) {
+  (0, _inherits2.default)(TableView, _ReactNodeView);
+
+  var _super = _createSuper(TableView);
+
+  function TableView(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, TableView);
+    _this = _super.call(this, props.node, props.view, props.getPos, props.portalProviderAPI, props.eventDispatcher, props);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getNode", function () {
+      return _this.node;
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "hasHoveredRows", false);
+    _this.getPos = props.getPos;
+    _this.tableRenderOptimization = props.tableRenderOptimization;
+    _this.eventDispatcher = props.eventDispatcher;
+    return _this;
+  }
+
+  (0, _createClass2.default)(TableView, [{
+    key: "getContentDOM",
+    value: function getContentDOM() {
+      var rendered = _prosemirrorModel.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]);
+      });
+    }
+  }, {
+    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
+      var fakePluginKey = {
+        key: 'widthPlugin$',
+        getState: function getState(state) {
+          return state['widthPlugin$'];
+        }
+      };
+      return /*#__PURE__*/_react.default.createElement(_withPluginState.WithPluginState, {
+        plugins: {
+          pluginState: _pluginKey.pluginKey,
+          tableResizingPluginState: _tableResizing.pluginKey,
+          widthPlugin: fakePluginKey // mediaState: mediaPluginKey,
+
+        },
+        editorView: props.view,
+        render: function render(pluginStates) {
+          var tableResizingPluginState = pluginStates.tableResizingPluginState,
+              pluginState = pluginStates.pluginState; // const mediaState = {};
+
+          var mediaState = {
+            isFullscreen: false
+          };
+          var tableActive = props.getPos() === pluginState.tablePos;
+          var containerWidth = props.getEditorContainerWidth();
+          return /*#__PURE__*/_react.default.createElement(_TableComponent.default, {
+            view: props.view,
+            allowColumnResizing: props.allowColumnResizing,
+            eventDispatcher: props.eventDispatcher,
+            getPos: props.getPos,
+            isMediaFullscreen: mediaState === null || mediaState === void 0 ? void 0 : mediaState.isFullscreen,
+            options: props.options,
+            allowControls: pluginState.pluginConfig.allowControls,
+            isHeaderRowEnabled: pluginState.isHeaderRowEnabled,
+            isHeaderColumnEnabled: pluginState.isHeaderColumnEnabled,
+            tableActive: tableActive,
+            ordering: pluginState.ordering,
+            tableResizingPluginState: tableResizingPluginState,
+            getNode: _this3.getNode,
+            containerWidth: containerWidth,
+            contentDOM: forwardRef,
+            getEditorFeatureFlags: props.getEditorFeatureFlags
+          });
+        }
+      });
+    }
+  }, {
+    key: "viewShouldUpdate",
+    value: function viewShouldUpdate(nextNode) {
+      if (this.tableRenderOptimization) {
+        var _getPluginState = (0, _pluginFactory.getPluginState)(this.view.state),
+            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 ((0, _typeof2.default)(_node.attrs) !== (0, _typeof2.default)(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.TableMap.get(_node);
+
+        var nextTableMap = _tableMap.TableMap.get(nextNode);
+
+        if (tableMap.width !== nextTableMap.width) {
+          return true;
+        }
+
+        return attrKeys.some(function (key) {
+          return _node.attrs[key] !== nextNode.attrs[key];
+        });
+      }
+
+      return (0, _get2.default)((0, _getPrototypeOf2.default)(TableView.prototype), "viewShouldUpdate", this).call(this, nextNode);
+    }
+  }, {
+    key: "ignoreMutation",
+    value: function ignoreMutation() {
+      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);
+      (0, _get2.default)((0, _getPrototypeOf2.default)(TableView.prototype), "destroy", this).call(this);
+    }
+  }]);
+  return TableView;
+}(_reactNodeView.default);
+
+exports.default = TableView;
+
+var createTableView = function createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, options, getEditorContainerWidth, getEditorFeatureFlags) {
+  var _getPluginState2 = (0, _pluginFactory.getPluginState)(view.state),
+      pluginConfig = _getPluginState2.pluginConfig;
+
+  var _getPluginConfig = (0, _createPluginConfig.pluginConfig)(pluginConfig),
+      allowColumnResizing = _getPluginConfig.allowColumnResizing;
+
+  var _getEditorFeatureFlag = getEditorFeatureFlags(),
+      tableRenderOptimization = _getEditorFeatureFlag.tableRenderOptimization;
+
+  return new TableView({
+    node: node,
+    view: view,
+    allowColumnResizing: allowColumnResizing,
+    portalProviderAPI: portalProviderAPI,
+    eventDispatcher: eventDispatcher,
+    getPos: getPos,
+    options: options,
+    tableRenderOptimization: tableRenderOptimization,
+    getEditorContainerWidth: getEditorContainerWidth,
+    getEditorFeatureFlags: getEditorFeatureFlags
+  }).init();
+};
+
+exports.createTableView = createTableView;

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

@@ -0,0 +1,123 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _uuid = _interopRequireDefault(require("uuid"));
+
+var _prosemirrorModel = require("prosemirror-model");
+
+var _adfSchema = require("@atlaskit/adf-schema");
+
+var TableCellNodeView = /*#__PURE__*/function () {
+  function TableCellNodeView(node, view, getPos, getEditorFeatureFlags, observer) {
+    (0, _classCallCheck2.default)(this, TableCellNodeView);
+    this.view = view;
+    this.node = node;
+
+    var _DOMSerializer$render = _prosemirrorModel.DOMSerializer.renderSpec(document, node.type.spec.toDOM(node)),
+        dom = _DOMSerializer$render.dom,
+        contentDOM = _DOMSerializer$render.contentDOM;
+
+    this.getPos = getPos;
+    this.dom = dom;
+    this.contentDOM = contentDOM;
+
+    var _getEditorFeatureFlag = getEditorFeatureFlags(),
+        mouseMoveOptimization = _getEditorFeatureFlag.mouseMoveOptimization;
+
+    if (mouseMoveOptimization && observer) {
+      this.contentDOM.id = (0, _uuid.default)();
+      this.mouseMoveOptimization = mouseMoveOptimization;
+      this.observer = observer;
+      observer.observe(this.contentDOM);
+    }
+  }
+
+  (0, _createClass2.default)(TableCellNodeView, [{
+    key: "updateNodeView",
+    value: function updateNodeView(node) {
+      var _this = this;
+
+      if (this.node.type !== node.type) {
+        return false;
+      }
+
+      var attrs = (0, _adfSchema.getCellDomAttrs)(this.node);
+      var nextAttrs = (0, _adfSchema.getCellDomAttrs)(node);
+
+      var _getCellAttrs = (0, _adfSchema.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
+
+
+      var defaultColspan = 1,
+          defaultRowspan = 1;
+
+      if (colspan !== (node.attrs.colspan || defaultColspan) || rowspan !== (node.attrs.rowspan || defaultRowspan)) {
+        return false;
+      } // added + changed attributes
+
+
+      var addedAttrs = Object.entries(nextAttrs).filter(function (_ref) {
+        var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
+            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 = (0, _slicedToArray2.default)(_ref3, 2),
+              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
+
+
+      if (this.node.sameMarkup(node)) {
+        return true;
+      }
+
+      return false;
+    }
+  }, {
+    key: "update",
+    value: function update(node) {
+      var didUpdate = this.updateNodeView(node);
+      this.node = node;
+      return didUpdate;
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      if (this.mouseMoveOptimization && this.observer) {
+        this.observer.unobserve(this.contentDOM);
+      }
+    }
+  }]);
+  return TableCellNodeView;
+}();
+
+exports.default = TableCellNodeView;

package/dist/cjs/plugins/table/nodeviews/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

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

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updateShadowListForStickyStyles = exports.updateOverflowShadows = void 0;
+
+var _types = require("../types");
+
+var updateShadowListForStickyStyles = function updateShadowListForStickyStyles(heightStyle, shadows) {
+  Array.from(shadows).forEach(function (shadow) {
+    if (shadow.classList.contains(_types.TableCssClassName.TABLE_STICKY_SHADOW)) {
+      if (shadow instanceof HTMLElement && shadow.style.height !== heightStyle) {
+        shadow.style.height = heightStyle;
+      }
+    }
+  });
+};
+/**
+ * Update overflow shadows for a given wrapper & table.
+ * if `overflowShadowOptimization` is enabled, this will exit early.
+ */
+
+
+exports.updateShadowListForStickyStyles = updateShadowListForStickyStyles;
+
+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
+
+
+    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(_types.TableCssClassName.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(_types.TableCssClassName.TABLE_STICKY_SHADOW) && stickyCell) {
+            leftShadow.style.height = "".concat(stickyCell.clientHeight + 1, "px");
+          }
+        }
+      }
+    }
+  };
+};
+
+exports.updateOverflowShadows = updateOverflowShadows;

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

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.pluginKey = exports.handleDocOrSelectionChanged = exports.getDecorations = exports.createPlugin = void 0;
+
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+
+var _prosemirrorState = require("prosemirror-state");
+
+var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
+
+var _prosemirrorView = require("prosemirror-view");
+
+var _pluginKey = require("../plugin-key");
+
+var _utils = require("./utils");
+
+var pluginKey = new _prosemirrorState.PluginKey('tableDecorationsPlugin');
+exports.pluginKey = pluginKey;
+
+var getDecorations = function getDecorations(state) {
+  return pluginKey.getState(state);
+};
+
+exports.getDecorations = getDecorations;
+
+var handleDocOrSelectionChanged = function handleDocOrSelectionChanged(tr, decorationSet, oldState) {
+  if (tr.docChanged || tr.selection instanceof _cellSelection.CellSelection) {
+    return (0, _utils.buildColumnControlsDecorations)({
+      decorationSet: decorationSet,
+      tr: tr
+    });
+  } else if (tr.selectionSet) {
+    var isTransactionFromMouseClick = !tr.docChanged && tr.selectionSet && tr.getMeta('pointer');
+
+    if (isTransactionFromMouseClick || oldState.selection instanceof _cellSelection.CellSelection) {
+      return (0, _utils.maybeUpdateColumnControlsSelectedDecoration)({
+        decorationSet: decorationSet,
+        tr: tr
+      });
+    }
+  }
+
+  return decorationSet;
+};
+
+exports.handleDocOrSelectionChanged = handleDocOrSelectionChanged;
+
+var createPlugin = function createPlugin() {
+  return new _safePlugin.SafePlugin({
+    state: {
+      init: function init() {
+        return _prosemirrorView.DecorationSet.empty;
+      },
+      apply: function apply(tr, decorationSet, oldState) {
+        var pluginState = decorationSet;
+        var meta = tr.getMeta(_pluginKey.pluginKey);
+
+        if (meta && meta.data && meta.data.decorationSet) {
+          pluginState = meta.data.decorationSet;
+        }
+
+        if (tr.docChanged || tr.selectionSet) {
+          return handleDocOrSelectionChanged(tr, pluginState, oldState);
+        }
+
+        return pluginState;
+      }
+    },
+    key: pluginKey,
+    props: {
+      decorations: function decorations(state) {
+        return getDecorations(state);
+      }
+    }
+  });
+};
+
+exports.createPlugin = createPlugin;

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

@@ -0,0 +1,88 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.maybeUpdateColumnControlsSelectedDecoration = exports.buildColumnControlsDecorations = void 0;
+
+var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
+
+var _utils = require("@atlaskit/editor-tables/utils");
+
+var _prosemirrorView = require("prosemirror-view");
+
+var _types = require("../../../types");
+
+var _decoration = require("../../../utils/decoration");
+
+var _composeDecorations = require("./compose-decorations");
+
+var isColumnSelected = function isColumnSelected(tr) {
+  return tr.selection instanceof _cellSelection.CellSelection && tr.selection.isColSelection();
+}; // @see: https://product-fabric.atlassian.net/browse/ED-3796
+
+
+var removeControlsHoverDecoration = function removeControlsHoverDecoration(_ref) {
+  var decorationSet = _ref.decorationSet;
+  return decorationSet.remove((0, _decoration.findControlsHoverDecoration)(decorationSet));
+};
+
+var maybeUpdateColumnSelectedDecoration = function maybeUpdateColumnSelectedDecoration(_ref2) {
+  var decorationSet = _ref2.decorationSet,
+      tr = _ref2.tr;
+
+  if (!isColumnSelected(tr)) {
+    return decorationSet;
+  }
+
+  return (0, _decoration.updateDecorations)(tr.doc, decorationSet, (0, _decoration.createColumnSelectedDecoration)(tr), _types.TableDecorations.COLUMN_SELECTED);
+};
+
+var maybeUpdateColumnControlsDecoration = function maybeUpdateColumnControlsDecoration(_ref3) {
+  var decorationSet = _ref3.decorationSet,
+      tr = _ref3.tr;
+  var table = (0, _utils.findTable)(tr.selection);
+
+  if (!table) {
+    return decorationSet;
+  }
+
+  return (0, _decoration.updateDecorations)(tr.doc, decorationSet, (0, _decoration.createColumnControlsDecoration)(tr.selection), _types.TableDecorations.COLUMN_CONTROLS_DECORATIONS);
+}; // @see: https://product-fabric.atlassian.net/browse/ED-7304
+
+
+var removeColumnControlsSelectedDecoration = function removeColumnControlsSelectedDecoration(_ref4) {
+  var decorationSet = _ref4.decorationSet;
+  return decorationSet.remove((0, _decoration.findColumnControlSelectedDecoration)(decorationSet));
+};
+
+var hasColumnSelectedDecorations = function hasColumnSelectedDecorations(decorationSet) {
+  return !!(0, _decoration.findColumnControlSelectedDecoration)(decorationSet).length;
+};
+
+var maybeUpdateColumnControlsSelectedDecoration = function maybeUpdateColumnControlsSelectedDecoration(_ref5) {
+  var decorationSet = _ref5.decorationSet,
+      tr = _ref5.tr;
+
+  if (!hasColumnSelectedDecorations(decorationSet)) {
+    return decorationSet;
+  }
+
+  return removeColumnControlsSelectedDecoration({
+    decorationSet: decorationSet,
+    tr: tr
+  });
+};
+
+exports.maybeUpdateColumnControlsSelectedDecoration = maybeUpdateColumnControlsSelectedDecoration;
+
+var buildColumnControlsDecorations = function buildColumnControlsDecorations(_ref6) {
+  var decorationSet = _ref6.decorationSet,
+      tr = _ref6.tr;
+  return (0, _composeDecorations.composeDecorations)([removeColumnControlsSelectedDecoration, removeControlsHoverDecoration, maybeUpdateColumnSelectedDecoration, maybeUpdateColumnControlsDecoration])({
+    decorationSet: _prosemirrorView.DecorationSet.empty,
+    tr: tr
+  });
+};
+
+exports.buildColumnControlsDecorations = buildColumnControlsDecorations;

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

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildColumnResizingDecorations = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _types = require("../../../types");
+
+var _decoration = require("../../../utils/decoration");
+
+var _composeDecorations = require("./compose-decorations");
+
+var emptyDecorations = [[], []];
+
+var updateColumnResizeHandle = function updateColumnResizeHandle(columnResizesDecorations) {
+  return function (_ref) {
+    var decorationSet = _ref.decorationSet,
+        tr = _ref.tr;
+    return (0, _decoration.updateDecorations)(tr.doc, decorationSet, columnResizesDecorations, _types.TableDecorations.COLUMN_RESIZING_HANDLE);
+  };
+};
+
+var updateLastCellElement = function updateLastCellElement(lastCellElementsDecorations) {
+  return function (_ref2) {
+    var decorationSet = _ref2.decorationSet,
+        tr = _ref2.tr;
+    return (0, _decoration.updateDecorations)(tr.doc, decorationSet, lastCellElementsDecorations, _types.TableDecorations.LAST_CELL_ELEMENT);
+  };
+};
+
+var buildColumnResizingDecorations = function buildColumnResizingDecorations(columnEndIndex) {
+  return function (_ref3) {
+    var tr = _ref3.tr,
+        decorationSet = _ref3.decorationSet;
+
+    var _ref4 = columnEndIndex < 0 ? emptyDecorations : (0, _decoration.createResizeHandleDecoration)(tr, {
+      right: columnEndIndex
+    }),
+        _ref5 = (0, _slicedToArray2.default)(_ref4, 2),
+        columnResizesDecorations = _ref5[0],
+        lastCellElementsDecorations = _ref5[1];
+
+    return (0, _composeDecorations.composeDecorations)([updateColumnResizeHandle(columnResizesDecorations), updateLastCellElement(lastCellElementsDecorations)])({
+      decorationSet: decorationSet,
+      tr: tr
+    });
+  };
+};
+
+exports.buildColumnResizingDecorations = buildColumnResizingDecorations;