@atlaskit/editor-plugin-table 0.0.0 → 0.0.1

package/dist/cjs/plugins/table/commands/selection.js

@@ -0,0 +1,419 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.arrowRightFromTable = exports.arrowLeftFromTable = exports.TableSelectionDirection = void 0;
+
+var _prosemirrorState = require("prosemirror-state");
+
+var _tableMap = require("@atlaskit/editor-tables/table-map");
+
+var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
+
+var _utils = require("@atlaskit/editor-tables/utils");
+
+var _selection = require("@atlaskit/editor-common/selection");
+
+var TableSelectionDirection;
+exports.TableSelectionDirection = TableSelectionDirection;
+
+(function (TableSelectionDirection) {
+  TableSelectionDirection["TopToBottom"] = "TopToBottom";
+  TableSelectionDirection["BottomToTop"] = "BottomToTop";
+})(TableSelectionDirection || (exports.TableSelectionDirection = TableSelectionDirection = {}));
+
+var arrowLeftFromTable = function arrowLeftFromTable(editorSelectionAPI) {
+  return function () {
+    return function (state, dispatch) {
+      var selection = state.selection;
+
+      if (selection instanceof _cellSelection.CellSelection) {
+        return arrowLeftFromCellSelection(editorSelectionAPI)(selection)(state, dispatch);
+      } else if (selection instanceof _selection.GapCursorSelection) {
+        return arrowLeftFromGapCursor(editorSelectionAPI)(selection)(state, dispatch);
+      } else if (selection instanceof _prosemirrorState.TextSelection) {
+        return arrowLeftFromText(editorSelectionAPI)(selection)(state, dispatch);
+      }
+
+      return false;
+    };
+  };
+};
+
+exports.arrowLeftFromTable = arrowLeftFromTable;
+
+var arrowRightFromTable = function arrowRightFromTable(editorSelectionAPI) {
+  return function () {
+    return function (state, dispatch) {
+      var selection = state.selection;
+
+      if (selection instanceof _cellSelection.CellSelection) {
+        return arrowRightFromCellSelection(editorSelectionAPI)(selection)(state, dispatch);
+      } else if (selection instanceof _selection.GapCursorSelection) {
+        return arrowRightFromGapCursor(editorSelectionAPI)(selection)(state, dispatch);
+      } else if (selection instanceof _prosemirrorState.TextSelection) {
+        return arrowRightFromText(editorSelectionAPI)(selection)(state, dispatch);
+      }
+
+      return false;
+    };
+  };
+};
+
+exports.arrowRightFromTable = arrowRightFromTable;
+
+var arrowLeftFromCellSelection = function arrowLeftFromCellSelection(editorSelectionAPI) {
+  return function (selection) {
+    return function (state, dispatch) {
+      if ((0, _utils.isTableSelected)(state.selection) && editorSelectionAPI) {
+        var _editorSelectionAPI$g = editorSelectionAPI.getSelectionPluginState(state),
+            selectionRelativeToNode = _editorSelectionAPI$g.selectionRelativeToNode;
+
+        if (selectionRelativeToNode === _selection.RelativeSelectionPos.Start) {
+          // we have full table cell selection and want to set gap cursor selection before table
+          return setGapCursorBeforeTable(editorSelectionAPI)()(state, dispatch);
+        } else if (selectionRelativeToNode === _selection.RelativeSelectionPos.End) {
+          // we have full table cell selection and want to set selection at end of last cell
+          return setSelectionAtEndOfLastCell(editorSelectionAPI)(selection)(state, dispatch);
+        } else if (selectionRelativeToNode === undefined) {
+          // we have full table cell selection and want to set selection at start of first cell
+          return setSelectionAtStartOfFirstCell(editorSelectionAPI)(selection, _selection.RelativeSelectionPos.Before)(state, dispatch);
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var arrowRightFromCellSelection = function arrowRightFromCellSelection(editorSelectionAPI) {
+  return function (selection) {
+    return function (state, dispatch) {
+      if ((0, _utils.isTableSelected)(state.selection) && editorSelectionAPI) {
+        var _editorSelectionAPI$g2 = editorSelectionAPI.getSelectionPluginState(state),
+            selectionRelativeToNode = _editorSelectionAPI$g2.selectionRelativeToNode;
+
+        if (selectionRelativeToNode === _selection.RelativeSelectionPos.Start) {
+          // we have full table cell selection and want to set selection at start of first cell
+          return setSelectionAtStartOfFirstCell(editorSelectionAPI)(selection)(state, dispatch);
+        } else if (selectionRelativeToNode === _selection.RelativeSelectionPos.End || selectionRelativeToNode === undefined) {
+          // we have full table cell selection and want to set gap cursor selection after table
+          return setGapCursorAfterTable(editorSelectionAPI)()(state, dispatch);
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var arrowLeftFromGapCursor = function arrowLeftFromGapCursor(editorSelectionAPI) {
+  return function (selection) {
+    return function (state, dispatch) {
+      var doc = state.doc;
+      var $from = selection.$from,
+          from = selection.from,
+          side = selection.side;
+
+      if (side === _selection.Side.RIGHT) {
+        if ($from.nodeBefore && $from.nodeBefore.type.name === 'table') {
+          // we have a gap cursor after a table node and want to set a full table cell selection
+          return selectFullTable(editorSelectionAPI)({
+            node: $from.nodeBefore,
+            startPos: doc.resolve(from - 1).start($from.depth + 1),
+            dir: TableSelectionDirection.TopToBottom
+          })(state, dispatch);
+        }
+      } else if (side === _selection.Side.LEFT) {
+        var table = (0, _utils.findTable)(selection);
+
+        if (table && isSelectionAtStartOfTable($from, selection) && editorSelectionAPI) {
+          var _editorSelectionAPI$g3 = editorSelectionAPI.getSelectionPluginState(state),
+              selectionRelativeToNode = _editorSelectionAPI$g3.selectionRelativeToNode;
+
+          if (selectionRelativeToNode === _selection.RelativeSelectionPos.Before) {
+            // we have a gap cursor at start of first table cell and want to set a gap cursor selection before table
+            return setGapCursorBeforeTable(editorSelectionAPI)()(state, dispatch);
+          } else {
+            // we have a gap cursor at start of first table cell and want to set a full table cell selection
+            return selectFullTable(editorSelectionAPI)({
+              node: table.node,
+              startPos: table.start,
+              dir: TableSelectionDirection.BottomToTop
+            })(state, dispatch);
+          }
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var arrowRightFromGapCursor = function arrowRightFromGapCursor(editorSelectionAPI) {
+  return function (selection) {
+    return function (state, dispatch) {
+      var $from = selection.$from,
+          from = selection.from,
+          $to = selection.$to,
+          side = selection.side;
+
+      if (side === _selection.Side.LEFT) {
+        if ($from.nodeAfter && $from.nodeAfter.type.name === 'table') {
+          // we have a gap cursor before a table node and want to set a full table cell selection
+          return selectFullTable(editorSelectionAPI)({
+            node: $from.nodeAfter,
+            startPos: from + 1,
+            dir: TableSelectionDirection.BottomToTop
+          })(state, dispatch);
+        }
+      } else if (side === _selection.Side.RIGHT) {
+        var table = (0, _utils.findTable)(selection);
+
+        if (table && isSelectionAtEndOfTable($to, selection)) {
+          // we have a gap cursor at end of last table cell and want to set a full table cell selection
+          return selectFullTable(editorSelectionAPI)({
+            node: table.node,
+            startPos: table.start,
+            dir: TableSelectionDirection.TopToBottom
+          })(state, dispatch);
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var arrowLeftFromText = function arrowLeftFromText(editorSelectionAPI) {
+  return function (selection) {
+    return function (state, dispatch) {
+      var table = (0, _utils.findTable)(selection);
+
+      if (table) {
+        var $from = selection.$from;
+
+        if (isSelectionAtStartOfTable($from, selection) && $from.parent.type.name === 'paragraph' && $from.depth === table.depth + 3 && // + 3 for: row, cell & paragraph nodes
+        editorSelectionAPI) {
+          var _editorSelectionAPI$g4 = editorSelectionAPI.getSelectionPluginState(state),
+              selectionRelativeToNode = _editorSelectionAPI$g4.selectionRelativeToNode;
+
+          if (selectionRelativeToNode === _selection.RelativeSelectionPos.Before) {
+            // we have a text selection at start of first table cell, directly inside a top level paragraph,
+            // and want to set gap cursor selection before table
+            return setGapCursorBeforeTable(editorSelectionAPI)()(state, dispatch);
+          } else {
+            // we have a text selection at start of first table cell, directly inside a top level paragraph,
+            // and want to set a full table cell selection
+            return selectFullTable(editorSelectionAPI)({
+              node: table.node,
+              startPos: table.start,
+              dir: TableSelectionDirection.BottomToTop
+            })(state, dispatch);
+          }
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var arrowRightFromText = function arrowRightFromText(editorSelectionAPI) {
+  return function (selection) {
+    return function (state, dispatch) {
+      var table = (0, _utils.findTable)(selection);
+
+      if (table) {
+        var $to = selection.$to;
+
+        if (isSelectionAtEndOfTable($to, selection) && $to.parent.type.name === 'paragraph' && $to.depth === table.depth + 3 // + 3 for: row, cell & paragraph nodes
+        ) {
+          // we have a text selection at end of last table cell, directly inside a top level paragraph,
+          // and want to set a full table cell selection
+          return selectFullTable(editorSelectionAPI)({
+            node: table.node,
+            startPos: table.start,
+            dir: TableSelectionDirection.TopToBottom
+          })(state, dispatch);
+        }
+      }
+
+      return false;
+    };
+  };
+};
+/**
+ * Sets a cell selection over all the cells in the table node
+ * We use this instead of selectTable from prosemirror-utils so we can control which
+ * cell is the anchor and which is the head, and also so we can set the relative selection
+ * pos in the selection plugin
+ */
+
+
+var selectFullTable = function selectFullTable(editorSelectionAPI) {
+  return function (_ref) {
+    var node = _ref.node,
+        startPos = _ref.startPos,
+        dir = _ref.dir;
+    return function (state, dispatch) {
+      var doc = state.doc;
+
+      var _TableMap$get = _tableMap.TableMap.get(node),
+          map = _TableMap$get.map;
+
+      var $firstCell = doc.resolve(startPos + map[0]);
+      var $lastCell = doc.resolve(startPos + map[map.length - 1]);
+      var fullTableSelection;
+      var selectionRelativeToNode;
+
+      if (dir === TableSelectionDirection.TopToBottom) {
+        fullTableSelection = new _cellSelection.CellSelection($firstCell, $lastCell);
+        selectionRelativeToNode = _selection.RelativeSelectionPos.End;
+      } else {
+        fullTableSelection = new _cellSelection.CellSelection($lastCell, $firstCell);
+        selectionRelativeToNode = _selection.RelativeSelectionPos.Start;
+      }
+
+      if (editorSelectionAPI) {
+        var tr = editorSelectionAPI.setSelectionRelativeToNode({
+          selectionRelativeToNode: selectionRelativeToNode,
+          selection: fullTableSelection
+        })(state);
+
+        if (dispatch) {
+          dispatch(tr);
+          return true;
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var setSelectionAtStartOfFirstCell = function setSelectionAtStartOfFirstCell(editorSelectionAPI) {
+  return function (selection, selectionRelativeToNode) {
+    return function (state, dispatch) {
+      var $anchorCell = selection.$anchorCell,
+          $headCell = selection.$headCell;
+      var $firstCell = $anchorCell.pos < $headCell.pos ? $anchorCell : $headCell;
+      var $firstPosInsideCell = state.doc.resolve($firstCell.pos + 1); // check if first pos should have a gap cursor, otherwise find closest text selection
+
+      var selectionAtStartOfCell = _selection.GapCursorSelection.valid($firstPosInsideCell) ? new _selection.GapCursorSelection($firstPosInsideCell, _selection.Side.LEFT) : _prosemirrorState.Selection.findFrom($firstPosInsideCell, 1);
+
+      if (editorSelectionAPI) {
+        var tr = editorSelectionAPI.setSelectionRelativeToNode({
+          selectionRelativeToNode: selectionRelativeToNode,
+          selection: selectionAtStartOfCell
+        })(state);
+
+        if (dispatch) {
+          dispatch(tr);
+          return true;
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var setSelectionAtEndOfLastCell = function setSelectionAtEndOfLastCell(editorSelectionAPI) {
+  return function (selection, selectionRelativeToNode) {
+    return function (state, dispatch) {
+      var $anchorCell = selection.$anchorCell,
+          $headCell = selection.$headCell;
+      var $lastCell = $anchorCell.pos > $headCell.pos ? $anchorCell : $headCell;
+      var lastPosInsideCell = $lastCell.pos + ($lastCell.nodeAfter ? $lastCell.nodeAfter.content.size : 0) + 1;
+      var $lastPosInsideCell = state.doc.resolve(lastPosInsideCell); // check if last pos should have a gap cursor, otherwise find closest text selection
+
+      var selectionAtEndOfCell = _selection.GapCursorSelection.valid($lastPosInsideCell) ? new _selection.GapCursorSelection($lastPosInsideCell, _selection.Side.RIGHT) : _prosemirrorState.Selection.findFrom($lastPosInsideCell, -1);
+
+      if (editorSelectionAPI) {
+        var tr = editorSelectionAPI.setSelectionRelativeToNode({
+          selectionRelativeToNode: selectionRelativeToNode,
+          selection: selectionAtEndOfCell
+        })(state);
+
+        if (dispatch) {
+          dispatch(tr);
+          return true;
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var setGapCursorBeforeTable = function setGapCursorBeforeTable(editorSelectionAPI) {
+  return function () {
+    return function (state, dispatch) {
+      var table = (0, _utils.findTable)(state.selection);
+
+      if (table) {
+        var $beforeTablePos = state.doc.resolve(table.pos);
+
+        if (_selection.GapCursorSelection.valid($beforeTablePos)) {
+          var selectionBeforeTable = new _selection.GapCursorSelection($beforeTablePos, _selection.Side.LEFT);
+
+          if (editorSelectionAPI) {
+            var tr = editorSelectionAPI.setSelectionRelativeToNode({
+              selectionRelativeToNode: undefined,
+              selection: selectionBeforeTable
+            })(state);
+
+            if (dispatch) {
+              dispatch(tr);
+              return true;
+            }
+          }
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var setGapCursorAfterTable = function setGapCursorAfterTable(editorSelectionAPI) {
+  return function () {
+    return function (state, dispatch) {
+      var table = (0, _utils.findTable)(state.selection);
+
+      if (table) {
+        var $afterTablePos = state.doc.resolve(table.pos + table.node.nodeSize);
+
+        if (_selection.GapCursorSelection.valid($afterTablePos)) {
+          var selectionAfterTable = new _selection.GapCursorSelection($afterTablePos, _selection.Side.RIGHT);
+
+          if (editorSelectionAPI) {
+            var tr = editorSelectionAPI.setSelectionRelativeToNode({
+              selectionRelativeToNode: undefined,
+              selection: selectionAfterTable
+            })(state);
+
+            if (dispatch) {
+              dispatch(tr);
+              return true;
+            }
+          }
+
+          return false;
+        }
+      }
+
+      return false;
+    };
+  };
+};
+
+var isSelectionAtStartOfTable = function isSelectionAtStartOfTable($pos, selection) {
+  return (0, _selection.isSelectionAtStartOfNode)($pos, (0, _utils.findTable)(selection));
+};
+
+var isSelectionAtEndOfTable = function isSelectionAtEndOfTable($pos, selection) {
+  return (0, _selection.isSelectionAtEndOfNode)($pos, (0, _utils.findTable)(selection));
+};

package/dist/cjs/plugins/table/commands/sort.js

@@ -0,0 +1,94 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.sortByColumn = void 0;
+
+var _prosemirrorState = require("prosemirror-state");
+
+var _tableMap = require("@atlaskit/editor-tables/table-map");
+
+var _utils = require("@atlaskit/editor-tables/utils");
+
+var _utils2 = require("@atlaskit/editor-common/utils");
+
+var _pluginFactory = require("../pm-plugins/plugin-factory");
+
+var _steps = require("@atlaskit/adf-schema/steps");
+
+function createGetInlineCardTextFromStore(state) {
+  return function (attrs) {
+    var _ref = attrs,
+        data = _ref.data;
+
+    if (data && (data.name || data.title)) {
+      return data.name || data.title;
+    }
+
+    var _ref2 = attrs,
+        cardUrl = _ref2.url;
+    return cardUrl;
+  };
+}
+
+var sortByColumn = function sortByColumn(columnIndex) {
+  var order = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _steps.TableSortOrder.DESC;
+  return (0, _pluginFactory.createCommand)(function (state) {
+    return {
+      type: 'SORT_TABLE',
+      data: {
+        ordering: {
+          columnIndex: columnIndex,
+          order: order
+        }
+      }
+    };
+  }, function (tr, state) {
+    var table = (0, _utils.findTable)(tr.selection);
+
+    if (!table || !table.node) {
+      return tr;
+    }
+
+    var selectionRect = (0, _utils.isSelectionType)(tr.selection, 'cell') ? (0, _utils.getSelectionRect)(tr.selection) : (0, _utils.findCellRectClosestToPos)(tr.selection.$from);
+
+    if (!selectionRect) {
+      return tr;
+    }
+
+    var tablePluginState = (0, _pluginFactory.getPluginState)(state);
+    var tableArray = (0, _utils.convertTableNodeToArrayOfRows)(table.node);
+    var headerRow;
+
+    if (tablePluginState.isHeaderRowEnabled) {
+      headerRow = tableArray.shift();
+    }
+
+    var compareNodesInOrder = (0, _utils2.createCompareNodes)({
+      getInlineCardTextFromStore: createGetInlineCardTextFromStore(state)
+    }, order);
+    var sortedTable = tableArray.sort(function (rowA, rowB) {
+      return compareNodesInOrder(rowA[columnIndex], rowB[columnIndex]);
+    });
+
+    if (headerRow) {
+      sortedTable.unshift(headerRow);
+    }
+
+    var newTableNode = (0, _utils.convertArrayOfRowsToTableNode)(table.node, sortedTable);
+    tr.replaceWith(table.pos, table.pos + table.node.nodeSize, newTableNode);
+
+    var pos = _tableMap.TableMap.get(table.node).positionAt(selectionRect.top, columnIndex, table.node);
+
+    var prev = tablePluginState.ordering;
+    var next = {
+      columnIndex: columnIndex,
+      order: order
+    };
+    tr.step(new _steps.TableSortStep(table.pos, prev, next));
+    return tr.setSelection(_prosemirrorState.Selection.near(tr.doc.resolve(table.start + pos)));
+  });
+};
+
+exports.sortByColumn = sortByColumn;

package/dist/cjs/plugins/table/commands/split-cell.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.splitCell = void 0;
+
+var _utils = require("@atlaskit/editor-tables/utils");
+
+var _pluginFactory = require("../pm-plugins/plugin-factory");
+
+/**
+ * We need to split cell keeping the right type of cell given current table configuration.
+ * We are using editor-tables splitCellWithType that allows you to choose what cell type should be.
+ */
+var splitCell = function splitCell(state, dispatch) {
+  var tableState = (0, _pluginFactory.getPluginState)(state);
+  var _state$schema$nodes = state.schema.nodes,
+      tableHeader = _state$schema$nodes.tableHeader,
+      tableCell = _state$schema$nodes.tableCell;
+
+  if (dispatch) {
+    return (0, _utils.splitCellWithType)(function (_ref) {
+      var row = _ref.row,
+          col = _ref.col;
+
+      if (row === 0 && tableState.isHeaderRowEnabled || col === 0 && tableState.isHeaderColumnEnabled) {
+        return tableHeader;
+      }
+
+      return tableCell;
+    })(state, dispatch);
+  }
+
+  return true;
+};
+
+exports.splitCell = splitCell;

package/dist/cjs/plugins/table/commands/toggle.js

@@ -0,0 +1,124 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.toggleTableLayout = exports.toggleNumberColumn = exports.toggleHeaderRow = exports.toggleHeaderColumn = exports.toggleContextualMenu = exports.getNextLayout = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _utils = require("@atlaskit/editor-tables/utils");
+
+var _pluginFactory = require("../pm-plugins/plugin-factory");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+//#endregion
+// #region Utils
+
+/**
+ * Table layout toggle logic
+ * default -> wide -> full-width -> default
+ */
+var getNextLayout = function getNextLayout(currentLayout) {
+  switch (currentLayout) {
+    case 'default':
+      return 'wide';
+
+    case 'wide':
+      return 'full-width';
+
+    case 'full-width':
+      return 'default';
+
+    default:
+      return 'default';
+  }
+}; // #endregion
+// #region Actions
+
+
+exports.getNextLayout = getNextLayout;
+
+var toggleHeaderRow = function toggleHeaderRow(state, dispatch) {
+  return (0, _utils.toggleHeader)('row')(state, function (tr) {
+    return (0, _pluginFactory.createCommand)({
+      type: 'TOGGLE_HEADER_ROW'
+    }, function () {
+      return tr.setMeta('scrollIntoView', false);
+    })(state, dispatch);
+  });
+};
+
+exports.toggleHeaderRow = toggleHeaderRow;
+
+var toggleHeaderColumn = function toggleHeaderColumn(state, dispatch) {
+  return (0, _utils.toggleHeader)('column')(state, function (tr) {
+    return (0, _pluginFactory.createCommand)({
+      type: 'TOGGLE_HEADER_COLUMN'
+    }, function () {
+      return tr.setMeta('scrollIntoView', false);
+    })(state, dispatch);
+  });
+};
+
+exports.toggleHeaderColumn = toggleHeaderColumn;
+
+var toggleNumberColumn = function toggleNumberColumn(state, dispatch) {
+  var tr = state.tr;
+
+  var _ref = (0, _utils.findTable)(state.selection),
+      node = _ref.node,
+      pos = _ref.pos;
+
+  tr.setNodeMarkup(pos, state.schema.nodes.table, _objectSpread(_objectSpread({}, node.attrs), {}, {
+    isNumberColumnEnabled: !node.attrs.isNumberColumnEnabled
+  }));
+  tr.setMeta('scrollIntoView', false);
+
+  if (dispatch) {
+    dispatch(tr);
+  }
+
+  return true;
+};
+
+exports.toggleNumberColumn = toggleNumberColumn;
+
+var toggleTableLayout = function toggleTableLayout(state, dispatch) {
+  var table = (0, _utils.findTable)(state.selection);
+
+  if (!table) {
+    return false;
+  }
+
+  var layout = getNextLayout(table.node.attrs.layout);
+  return (0, _pluginFactory.createCommand)({
+    type: 'SET_TABLE_LAYOUT',
+    data: {
+      layout: layout
+    }
+  }, function (tr) {
+    tr.setNodeMarkup(table.pos, state.schema.nodes.table, _objectSpread(_objectSpread({}, table.node.attrs), {}, {
+      layout: layout
+    }));
+    return tr.setMeta('scrollIntoView', false);
+  })(state, dispatch);
+};
+
+exports.toggleTableLayout = toggleTableLayout;
+
+var toggleContextualMenu = function toggleContextualMenu() {
+  return (0, _pluginFactory.createCommand)({
+    type: 'TOGGLE_CONTEXTUAL_MENU'
+  }, function (tr) {
+    return tr.setMeta('addToHistory', false);
+  });
+}; // #endregion
+
+
+exports.toggleContextualMenu = toggleContextualMenu;