@atlaskit/editor-plugin-table 0.0.0 → 0.0.1

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

@@ -0,0 +1,116 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.normalizeSelection = exports.isSelectionUpdated = exports.getSelectedRowIndexes = exports.getSelectedColumnIndexes = void 0;
+
+var _tableMap = require("@atlaskit/editor-tables/table-map");
+
+var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
+
+var _utils = require("@atlaskit/editor-tables/utils");
+
+var isSelectionUpdated = function isSelectionUpdated(oldSelection, newSelection) {
+  return !!(!newSelection && oldSelection) || (0, _utils.isSelectionType)(oldSelection, 'cell') !== (0, _utils.isSelectionType)(newSelection, 'cell') || (0, _utils.isSelectionType)(oldSelection, 'cell') && (0, _utils.isSelectionType)(newSelection, 'cell') && oldSelection.ranges !== newSelection.ranges;
+};
+
+exports.isSelectionUpdated = isSelectionUpdated;
+
+var isRectangularCellSelection = function isRectangularCellSelection(selection, rect) {
+  var table = (0, _utils.findTable)(selection);
+
+  if (!table) {
+    return true;
+  }
+
+  var _TableMap$get = _tableMap.TableMap.get(table.node),
+      width = _TableMap$get.width,
+      height = _TableMap$get.height,
+      map = _TableMap$get.map;
+
+  var indexTop = rect.top * width + rect.left;
+  var indexLeft = indexTop;
+  var indexBottom = (rect.bottom - 1) * width + rect.left;
+  var indexRight = indexTop + (rect.right - rect.left - 1);
+
+  for (var i = rect.top; i < rect.bottom; i++) {
+    if (rect.left > 0 && map[indexLeft] === map[indexLeft - 1] || rect.right < width && map[indexRight] === map[indexRight + 1]) {
+      return false;
+    }
+
+    indexLeft += width;
+    indexRight += width;
+  }
+
+  for (var _i = rect.left; _i < rect.right; _i++) {
+    if (rect.top > 0 && map[indexTop] === map[indexTop - width] || rect.bottom < height && map[indexBottom] === map[indexBottom + width]) {
+      return false;
+    }
+
+    indexTop++;
+    indexBottom++;
+  }
+
+  return true;
+};
+
+var normalizeSelection = function normalizeSelection(tr) {
+  var selection = tr.selection;
+  var rect = (0, _utils.getSelectionRect)(selection);
+
+  if (!rect || !(selection instanceof _cellSelection.CellSelection) || isRectangularCellSelection(selection, rect)) {
+    return tr;
+  }
+
+  if (selection.isColSelection()) {
+    var _getSelectionRangeInC, _getSelectionRangeInC2;
+
+    var $anchor = (_getSelectionRangeInC = (0, _utils.getSelectionRangeInColumn)(rect.left)(tr)) === null || _getSelectionRangeInC === void 0 ? void 0 : _getSelectionRangeInC.$anchor;
+    var $head = (_getSelectionRangeInC2 = (0, _utils.getSelectionRangeInColumn)(rect.right - 1)(tr)) === null || _getSelectionRangeInC2 === void 0 ? void 0 : _getSelectionRangeInC2.$head;
+
+    if ($anchor && $head) {
+      return tr.setSelection(new _cellSelection.CellSelection($anchor, $head));
+    }
+  }
+
+  if (selection.isRowSelection()) {
+    var _getSelectionRangeInR, _getSelectionRangeInR2;
+
+    var _$anchor = (_getSelectionRangeInR = (0, _utils.getSelectionRangeInRow)(rect.top)(tr)) === null || _getSelectionRangeInR === void 0 ? void 0 : _getSelectionRangeInR.$anchor;
+
+    var _$head = (_getSelectionRangeInR2 = (0, _utils.getSelectionRangeInRow)(rect.bottom - 1)(tr)) === null || _getSelectionRangeInR2 === void 0 ? void 0 : _getSelectionRangeInR2.$head;
+
+    if (_$anchor && _$head) {
+      return tr.setSelection(new _cellSelection.CellSelection(_$anchor, _$head));
+    }
+  }
+
+  return tr;
+};
+
+exports.normalizeSelection = normalizeSelection;
+
+var getSelectedColumnIndexes = function getSelectedColumnIndexes(selectionRect) {
+  var columnIndexes = [];
+
+  for (var i = selectionRect.left; i < selectionRect.right; i++) {
+    columnIndexes.push(i);
+  }
+
+  return columnIndexes;
+};
+
+exports.getSelectedColumnIndexes = getSelectedColumnIndexes;
+
+var getSelectedRowIndexes = function getSelectedRowIndexes(selectionRect) {
+  var rowIndexes = [];
+
+  for (var i = selectionRect.top; i < selectionRect.bottom; i++) {
+    rowIndexes.push(i);
+  }
+
+  return rowIndexes;
+};
+
+exports.getSelectedRowIndexes = getSelectedRowIndexes;

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

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getMergedCellsPositions = exports.colsToRect = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _tableMap = require("@atlaskit/editor-tables/table-map");
+
+var _utils = require("@atlaskit/editor-tables/utils");
+
+var getMergedCellsPositions = function getMergedCellsPositions(tr) {
+  var table = (0, _utils.findTable)(tr.selection);
+
+  if (!table) {
+    return [];
+  }
+
+  var map = _tableMap.TableMap.get(table.node);
+
+  var cellPositions = new Set();
+  var mergedCells = [];
+  map.map.forEach(function (value) {
+    if (cellPositions.has(value)) {
+      mergedCells.push(value);
+    } else {
+      cellPositions.add(value);
+    }
+  });
+  return mergedCells;
+};
+
+exports.getMergedCellsPositions = getMergedCellsPositions;
+
+var colsToRect = function colsToRect(cols, noOfRows) {
+  return {
+    left: Math.min.apply(Math, (0, _toConsumableArray2.default)(cols)),
+    right: Math.max.apply(Math, (0, _toConsumableArray2.default)(cols)) + 1,
+    top: 0,
+    bottom: noOfRows
+  };
+};
+
+exports.colsToRect = colsToRect;

package/dist/cjs/plugins/table/utils/update-plugin-state-decorations.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updatePluginStateDecorations = void 0;
+
+var _plugin = require("../pm-plugins/decorations/plugin");
+
+var _decoration = require("./decoration");
+
+var updatePluginStateDecorations = function updatePluginStateDecorations(state, decorations, key) {
+  return (0, _decoration.updateDecorations)(state.doc, (0, _plugin.getDecorations)(state), decorations, key);
+};
+
+exports.updatePluginStateDecorations = updatePluginStateDecorations;

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

@@ -1,54 +1,13 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 
-var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
-
-var _pluginKey = require("./plugin-key");
-
-var _prosemirrorModel = require("prosemirror-model");
-
-var _prosemirrorView = require("prosemirror-view");
-
-function createPlugin() {
-  return new _safePlugin.SafePlugin({
-    key: _pluginKey.pluginKey,
-    state: {
-      init: function init() {
-        var z = {
-          Mark: _prosemirrorModel.Mark,
-          EditorView: _prosemirrorView.EditorView
-        }; // eslint-disable-next-line no-console
-
-        console.log('delete to use prosemirror-model/view', z); // eslint-disable-next-line no-console
-
-        console.log('next table plugin loaded');
-        return {
-          scaffold: true
-        };
-      },
-      apply: function apply() {}
-    }
-  });
-} // const tablesPlugin = (options?: TablePluginOptions): any => ({
-
-
-var tablesPlugin = function tablesPlugin() {
-  return {
-    name: 'nextTable',
-    pmPlugins: function pmPlugins() {
-      return [{
-        name: 'next-table-scaffold',
-        plugin: function plugin() {
-          return createPlugin();
-        }
-      }];
-    }
-  };
-};
+var _table = _interopRequireDefault(require("./table"));
 
-var _default = tablesPlugin;
+var _default = _table.default;
 exports.default = _default;

package/dist/cjs/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "0.0.0"
+	"version": "0.0.1"
 }

package/dist/es2019/plugins/table/commands/clear.js

@@ -0,0 +1,48 @@
+// #region Imports
+import { Selection } from 'prosemirror-state';
+import { findCellClosestToPos, emptyCell, isSelectionType } from '@atlaskit/editor-tables/utils';
+// #endregion
+// #region Commands
+export const clearMultipleCells = targetCellPosition => (state, dispatch) => {
+  let cursorPos;
+  let {
+    tr
+  } = state;
+
+  if (isSelectionType(tr.selection, 'cell')) {
+    const selection = tr.selection;
+    selection.forEachCell((_node, pos) => {
+      const $pos = tr.doc.resolve(tr.mapping.map(pos + 1));
+      tr = emptyCell(findCellClosestToPos($pos), state.schema)(tr);
+    });
+    cursorPos = selection.$headCell.pos;
+  } else if (targetCellPosition) {
+    const cell = findCellClosestToPos(tr.doc.resolve(targetCellPosition + 1));
+    tr = emptyCell(cell, state.schema)(tr);
+    cursorPos = cell.pos;
+  }
+
+  if (tr.docChanged && cursorPos) {
+    const $pos = tr.doc.resolve(tr.mapping.map(cursorPos));
+    const textSelection = Selection.findFrom($pos, 1, true);
+
+    if (textSelection) {
+      tr.setSelection(textSelection);
+    }
+
+    if (dispatch) {
+      dispatch(tr);
+    }
+
+    return true;
+  }
+
+  return false;
+};
+export const clearSelection = (state, dispatch) => {
+  if (dispatch) {
+    dispatch(state.tr.setSelection(Selection.near(state.selection.$from)).setMeta('addToHistory', false));
+  }
+
+  return true;
+}; // #endregion

package/dist/es2019/plugins/table/commands/collapse.js

@@ -0,0 +1,14 @@
+import { collapseSelectedTable } from '../utils/collapse';
+export const wrapTableInExpand = (state, dispatch) => {
+  const collapseTr = collapseSelectedTable(state.tr);
+
+  if (!collapseTr) {
+    return false;
+  }
+
+  if (dispatch) {
+    dispatch(collapseTr);
+  }
+
+  return true;
+};

package/dist/es2019/plugins/table/commands/go-to-next-cell.js

@@ -0,0 +1,47 @@
+// #region Constants
+import { findTable, goToNextCell as baseGotoNextCell } from '@atlaskit/editor-tables/utils';
+import { TableMap } from '@atlaskit/editor-tables/table-map';
+import { findParentNodeOfType } from 'prosemirror-utils';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { insertRowWithAnalytics } from '../commands-with-analytics';
+const TAB_FORWARD_DIRECTION = 1;
+const TAB_BACKWARD_DIRECTION = -1;
+export const goToNextCell = editorAnalyticsAPI => direction => (state, dispatch) => {
+  const table = findTable(state.selection);
+
+  if (!table) {
+    return false;
+  }
+
+  const map = TableMap.get(table.node);
+  const {
+    tableCell,
+    tableHeader
+  } = state.schema.nodes;
+  const cell = findParentNodeOfType([tableCell, tableHeader])(state.selection);
+  const firstCellPos = map.positionAt(0, 0, table.node) + table.start;
+  const lastCellPos = map.positionAt(map.height - 1, map.width - 1, table.node) + table.start; // when tabbing backwards at first cell (top left), insert row at the start of table
+
+  if (firstCellPos === cell.pos && direction === TAB_BACKWARD_DIRECTION) {
+    insertRowWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD, {
+      index: 0,
+      moveCursorToInsertedRow: true
+    })(state, dispatch);
+    return true;
+  } // when tabbing forwards at last cell (bottom right), insert row at the end of table
+
+
+  if (lastCellPos === cell.pos && direction === TAB_FORWARD_DIRECTION) {
+    insertRowWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD, {
+      index: map.height,
+      moveCursorToInsertedRow: true
+    })(state, dispatch);
+    return true;
+  }
+
+  if (dispatch) {
+    return baseGotoNextCell(direction)(state, dispatch);
+  }
+
+  return true;
+};

package/dist/es2019/plugins/table/commands/hover.js

@@ -0,0 +1,117 @@
+// #region Imports
+import { TableMap } from '@atlaskit/editor-tables/table-map';
+import { findTable, getCellsInColumn, getCellsInRow } from '@atlaskit/editor-tables/utils';
+import { createCommand } from '../pm-plugins/plugin-factory';
+import { TableDecorations } from '../types';
+import { createCellHoverDecoration, createColumnLineResize, createControlsHoverDecoration, getMergedCellsPositions, updatePluginStateDecorations } from '../utils'; // #endregion
+// #region Utils
+
+const makeArray = n => Array.from(Array(n).keys()); // #endregion
+// #region Commands
+
+
+export const hoverMergedCells = () => createCommand(state => {
+  const mergedCellsPositions = getMergedCellsPositions(state.tr);
+
+  if (!mergedCellsPositions.length) {
+    return false;
+  }
+
+  const table = findTable(state.tr.selection);
+
+  if (!table) {
+    return false;
+  }
+
+  const mergedCells = mergedCellsPositions.map(pos => ({
+    pos: pos + table.start,
+    start: pos + table.start + 1,
+    node: table.node.nodeAt(pos)
+  }));
+  const decorations = createCellHoverDecoration(mergedCells, 'warning');
+  return {
+    type: 'HOVER_CELLS',
+    data: {
+      decorationSet: updatePluginStateDecorations(state, decorations, TableDecorations.CELL_CONTROLS_HOVER)
+    }
+  };
+}, tr => tr.setMeta('addToHistory', false));
+export const hoverColumns = (hoveredColumns, isInDanger) => createCommand(state => {
+  const cells = getCellsInColumn(hoveredColumns)(state.selection);
+
+  if (!cells) {
+    return false;
+  }
+
+  const decorations = createControlsHoverDecoration(cells, 'column', isInDanger);
+  return {
+    type: 'HOVER_COLUMNS',
+    data: {
+      decorationSet: updatePluginStateDecorations(state, decorations, TableDecorations.COLUMN_CONTROLS_HOVER),
+      hoveredColumns,
+      isInDanger
+    }
+  };
+}, tr => tr.setMeta('addToHistory', false));
+export const hoverRows = (hoveredRows, isInDanger) => createCommand(state => {
+  const cells = getCellsInRow(hoveredRows)(state.selection);
+
+  if (!cells) {
+    return false;
+  }
+
+  const decorations = createControlsHoverDecoration(cells, 'row', isInDanger);
+  return {
+    type: 'HOVER_ROWS',
+    data: {
+      decorationSet: updatePluginStateDecorations(state, decorations, TableDecorations.ROW_CONTROLS_HOVER),
+      hoveredRows,
+      isInDanger
+    }
+  };
+}, tr => tr.setMeta('addToHistory', false));
+export const hoverTable = (isInDanger, isSelected) => createCommand(state => {
+  const table = findTable(state.selection);
+
+  if (!table) {
+    return false;
+  }
+
+  const map = TableMap.get(table.node);
+  const hoveredColumns = makeArray(map.width);
+  const hoveredRows = makeArray(map.height);
+  const cells = getCellsInRow(hoveredRows)(state.selection);
+
+  if (!cells) {
+    return false;
+  }
+
+  const decorations = createControlsHoverDecoration(cells, 'table', isInDanger, isSelected);
+  return {
+    type: 'HOVER_TABLE',
+    data: {
+      decorationSet: updatePluginStateDecorations(state, decorations, TableDecorations.TABLE_CONTROLS_HOVER),
+      hoveredColumns,
+      hoveredRows,
+      isInDanger
+    }
+  };
+}, tr => tr.setMeta('addToHistory', false));
+export const clearHoverSelection = () => createCommand(state => ({
+  type: 'CLEAR_HOVER_SELECTION',
+  data: {
+    decorationSet: updatePluginStateDecorations(state, [], TableDecorations.ALL_CONTROLS_HOVER)
+  }
+}));
+export const showResizeHandleLine = cellColumnPositioning => createCommand(state => ({
+  type: 'SHOW_RESIZE_HANDLE_LINE',
+  data: {
+    decorationSet: updatePluginStateDecorations(state, createColumnLineResize(state.selection, cellColumnPositioning), TableDecorations.COLUMN_RESIZING_HANDLE_LINE)
+  }
+}));
+export const hideResizeHandleLine = () => createCommand(state => ({
+  type: 'HIDE_RESIZE_HANDLE_LINE',
+  data: {
+    decorationSet: updatePluginStateDecorations(state, [], TableDecorations.COLUMN_RESIZING_HANDLE_LINE)
+  }
+})); // #endregion

package/dist/es2019/plugins/table/commands/index.js

@@ -0,0 +1,7 @@
+export { hoverColumns, hoverRows, hoverTable, hoverMergedCells, clearHoverSelection, showResizeHandleLine, hideResizeHandleLine } from './hover';
+export { insertColumn, insertRow, createTable } from './insert';
+export { getNextLayout, toggleContextualMenu, toggleHeaderColumn, toggleHeaderRow, toggleNumberColumn, toggleTableLayout } from './toggle';
+export { clearMultipleCells } from './clear';
+export { autoSizeTable, convertFirstRowToHeader, deleteTable, hideInsertColumnOrRowButton, moveCursorBackward, selectColumn, selectRow, setCellAttr, setEditorFocus, setMultipleCellAttrs, setTableRef, showInsertColumnButton, showInsertRowButton, transformSliceToAddTableHeaders, triggerUnlessTableHeader, addBoldInEmptyHeaderCells, addResizeHandleDecorations } from './misc';
+export { sortByColumn } from './sort';
+export { goToNextCell } from './go-to-next-cell';

package/dist/es2019/plugins/table/commands/insert.js

@@ -0,0 +1,141 @@
+// #region Imports
+import { Selection } from 'prosemirror-state';
+import { TableMap } from '@atlaskit/editor-tables/table-map';
+import { addColumnAt as addColumnAtPMUtils, addRowAt, createTable as createTableNode, findTable, selectedRect } from '@atlaskit/editor-tables/utils';
+import { safeInsert } from 'prosemirror-utils';
+import { AddColumnStep } from '@atlaskit/adf-schema/steps';
+import { checkIfHeaderRowEnabled, copyPreviousRow } from '../utils';
+import { getAllowAddColumnCustomStep } from '../utils/get-allow-add-column-custom-step';
+import { rescaleColumns } from '../transforms/column-width';
+
+// #endregion
+function addColumnAtCustomStep(column) {
+  return tr => {
+    const table = findTable(tr.selection);
+
+    if (table) {
+      return tr.step(AddColumnStep.create(tr.doc, table.pos, column));
+    }
+
+    return tr;
+  };
+}
+
+export function addColumnAt(getEditorContainerWidth) {
+  return (column, allowAddColumnCustomStep = false, view) => {
+    return tr => {
+      let updatedTr = tr;
+
+      if (allowAddColumnCustomStep) {
+        updatedTr = addColumnAtCustomStep(column)(updatedTr);
+      } else {
+        updatedTr = addColumnAtPMUtils(column)(updatedTr);
+      }
+
+      const table = findTable(updatedTr.selection);
+
+      if (table) {
+        // [ED-8288] Update colwidths manually to avoid multiple dispatch in TableComponent
+        updatedTr = rescaleColumns(getEditorContainerWidth)(table, view)(updatedTr);
+      }
+
+      return updatedTr;
+    };
+  };
+} // :: (EditorState, dispatch: ?(tr: Transaction)) → bool
+// Command to add a column before the column with the selection.
+
+export const addColumnBefore = getEditorContainerWidth => (state, dispatch, view) => {
+  const table = findTable(state.selection);
+
+  if (!table) {
+    return false;
+  }
+
+  if (dispatch) {
+    let rect = selectedRect(state);
+    dispatch(addColumnAt(getEditorContainerWidth)(rect.left, getAllowAddColumnCustomStep(state), view)(state.tr));
+  }
+
+  return true;
+}; // :: (EditorState, dispatch: ?(tr: Transaction)) → bool
+// Command to add a column after the column with the selection.
+
+export const addColumnAfter = getEditorContainerWidth => (state, dispatch, view) => {
+  const table = findTable(state.selection);
+
+  if (!table) {
+    return false;
+  }
+
+  if (dispatch) {
+    let rect = selectedRect(state);
+    dispatch(addColumnAt(getEditorContainerWidth)(rect.right, getAllowAddColumnCustomStep(state), view)(state.tr));
+  }
+
+  return true;
+}; // #region Commands
+
+export const insertColumn = getEditorContainerWidth => column => (state, dispatch, view) => {
+  let tr = addColumnAt(getEditorContainerWidth)(column, getAllowAddColumnCustomStep(state), view)(state.tr);
+  const table = findTable(tr.selection);
+
+  if (!table) {
+    return false;
+  } // move the cursor to the newly created column
+
+
+  const pos = TableMap.get(table.node).positionAt(0, column, table.node);
+
+  if (dispatch) {
+    dispatch(tr.setSelection(Selection.near(tr.doc.resolve(table.start + pos))));
+  }
+
+  return true;
+};
+export const insertRow = (row, moveCursorToTheNewRow) => (state, dispatch) => {
+  // Don't clone the header row
+  const headerRowEnabled = checkIfHeaderRowEnabled(state.selection);
+  const clonePreviousRow = headerRowEnabled && row > 1 || !headerRowEnabled && row > 0; // When the table have header row
+  // we should not add row on the position zero
+
+  if (row === 0 && headerRowEnabled) {
+    return false;
+  }
+
+  const tr = clonePreviousRow ? copyPreviousRow(state.schema)(row)(state.tr) : addRowAt(row)(state.tr);
+  const table = findTable(tr.selection);
+
+  if (!table) {
+    return false;
+  }
+
+  if (dispatch) {
+    const {
+      selection
+    } = state;
+
+    if (moveCursorToTheNewRow) {
+      // move the cursor to the newly created row
+      const pos = TableMap.get(table.node).positionAt(row, 0, table.node);
+      tr.setSelection(Selection.near(tr.doc.resolve(table.start + pos)));
+    } else {
+      tr.setSelection(selection.map(tr.doc, tr.mapping));
+    }
+
+    dispatch(tr);
+  }
+
+  return true;
+};
+export const createTable = () => (state, dispatch) => {
+  const table = createTableNode({
+    schema: state.schema
+  });
+
+  if (dispatch) {
+    dispatch(safeInsert(table)(state.tr).scrollIntoView());
+  }
+
+  return true;
+}; // #endregion