@atlaskit/editor-plugin-table 0.0.0 → 0.0.2

package/dist/esm/plugins/table/pm-plugins/table-local-id.js

@@ -0,0 +1,205 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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) { _defineProperty(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; }
+
+/**
+ * A plugin for ensuring tables always have unique local IDs, and to
+ * preserve/not regenerate them when they are being cut and paste around the
+ * document.
+ *
+ * More broadly, this plugin should be generalised so it can solve this ‘unique
+ * id’ problem across the codebase for any node, but for now this will live on
+ * its own solving only for tables.
+ *
+ * TODO: https://product-fabric.atlassian.net/browse/ED-12714
+ *
+ */
+// import { Dispatch } from '../../../event-dispatcher';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from 'prosemirror-state';
+import rafSchedule from 'raf-schd';
+import { uuid } from '@atlaskit/adf-schema'; // import { stepAddsOneOf } from '../../../utils/step';
+
+import { stepAddsOneOf } from '@atlaskit/editor-common/utils';
+var pluginKey = new PluginKey('tableLocalIdPlugin');
+
+var getPluginState = function getPluginState(state) {
+  return state && pluginKey.getState(state);
+};
+/**
+ * Traverses a transaction's steps to see if we're inserting any tables
+ */
+
+
+var checkIsAddingTable = function checkIsAddingTable(transaction, nodeType) {
+  return transaction.steps.some(function (step) {
+    return stepAddsOneOf(step, new Set([nodeType]));
+  });
+};
+/**
+ * Ensures uniqueness of `localId`s on tables being created or edited
+ */
+
+
+var createPlugin = function createPlugin(dispatch) {
+  return new SafePlugin({
+    key: pluginKey,
+    state: {
+      init: function init() {
+        return {
+          parsedForLocalIds: false
+        };
+      },
+      apply: function apply(tr, pluginState) {
+        var meta = tr.getMeta(pluginKey);
+
+        if (meta) {
+          var keys = Object.keys(meta);
+          var changed = keys.some(function (key) {
+            return pluginState[key] !== meta[key];
+          });
+
+          if (changed) {
+            var newState = _objectSpread(_objectSpread({}, pluginState), meta);
+
+            dispatch(pluginKey, newState);
+            return newState;
+          }
+        }
+
+        return pluginState;
+      }
+    },
+    view: function view() {
+      return {
+        /**
+         * Utilise the update cycle for _one_ scan through an initial doc
+         * to ensure existing tables without IDs get them when this plugin is
+         * enabled.
+         *
+         * This entire block can be skipped if we simply remove the `checkIsAddingTable`
+         * check in appendTransaction, but that comes with 2 cons:
+         *
+         * 1. require a transaction before we actually add the local IDs
+         * 2. ever slightly more unncessary checks
+         *
+         * Finally, this never happens in practice when utilising this in
+         * confluence, as the collab/synchrony initialisation process will
+         * trigger a transaction which adds tables, and thus this plugin will
+         * add/dedupe the necessary IDs. But general usage of the editor
+         * without collab should still solve for IDs.
+         */
+        update: function update(editorView) {
+          var state = editorView.state;
+          var pluginState = getPluginState(state);
+
+          if (!pluginState) {
+            return;
+          }
+
+          var parsed = pluginState.parsedForLocalIds;
+
+          if (parsed) {
+            return;
+          }
+
+          var table = state.schema.nodes.table;
+          rafSchedule(function () {
+            var tr = state.tr;
+            var tableIdWasAdded = false;
+            editorView.state.doc.descendants(function (node, pos) {
+              var isTable = node.type === table;
+              var localId = node.attrs.localId;
+
+              if (isTable && !localId) {
+                tableIdWasAdded = true;
+                tr.setNodeMarkup(pos, undefined, _objectSpread(_objectSpread({}, node.attrs), {}, {
+                  localId: uuid.generate()
+                }));
+                return false;
+              }
+              /**
+               * Otherwise continue traversing, we can encounter tables nested in
+               * expands/bodiedExtensions
+               */
+
+
+              return true;
+            });
+
+            if (tableIdWasAdded) {
+              tr.setMeta('addToHistory', false);
+              editorView.dispatch(tr);
+            }
+          })();
+          editorView.dispatch(state.tr.setMeta(pluginKey, {
+            parsedForLocalIds: true
+          }));
+        }
+      };
+    },
+    appendTransaction: function appendTransaction(transactions, _oldState, newState) {
+      var modified = false;
+      var tr = newState.tr;
+      var table = newState.schema.nodes.table;
+      var idsObserved = new Set();
+      transactions.forEach(function (transaction) {
+        if (!transaction.docChanged) {
+          return;
+        } // Don't interfere with cut as it clashes with fixTables & we don't need
+        // to handle any extra cut cases in this plugin
+
+
+        var uiEvent = transaction.getMeta('uiEvent');
+
+        if (uiEvent === 'cut') {
+          return;
+        }
+        /** Check if we're actually inserting a table, otherwise we can ignore this tr */
+
+
+        var isAddingTable = checkIsAddingTable(transaction, table);
+
+        if (!isAddingTable) {
+          return;
+        } // Can't simply look at changed nodes, as we could be adding a table
+
+
+        newState.doc.descendants(function (node, pos) {
+          var isTable = node.type === table;
+          var localId = node.attrs.localId; // Dealing with a table - make sure it's a unique ID
+
+          if (isTable) {
+            if (localId && !idsObserved.has(localId)) {
+              idsObserved.add(localId); // Also add a localId if it happens to not have one,
+            } else if (!localId || idsObserved.has(localId)) {
+              modified = true;
+              tr.setNodeMarkup(pos, undefined, _objectSpread(_objectSpread({}, node.attrs), {}, {
+                localId: uuid.generate()
+              }));
+            }
+
+            return false;
+          }
+          /**
+           * Otherwise continue traversing, we can encounter tables nested in
+           * expands/bodiedExtensions
+           */
+
+
+          return true;
+        });
+      });
+
+      if (modified) {
+        return tr;
+      }
+
+      return;
+    }
+  });
+};
+
+export { createPlugin };

package/dist/esm/plugins/table/pm-plugins/table-resizing/commands.js

@@ -0,0 +1,127 @@
+import { isTableSelected } from '@atlaskit/editor-tables/utils';
+import { updateColumnWidths } from '../../transforms';
+import { createCommand, getPluginState } from './plugin-factory';
+import { evenAllColumnsWidths, hasTableBeenResized, isClickNear, insertColgroupFromNode as recreateResizeColsByNode, scale, scaleWithParent } from './utils';
+// Scale the table to meet new requirements (col, layout change etc)
+export var scaleTable = function scaleTable(tableRef, options, domAtPos) {
+  return function (state, dispatch) {
+    if (!tableRef) {
+      return false;
+    }
+
+    var node = options.node,
+        start = options.start,
+        parentWidth = options.parentWidth; // If a table has not been resized yet, columns should be auto.
+
+    if (hasTableBeenResized(node) === false) {
+      // If its not a re-sized table, we still want to re-create cols
+      // To force reflow of columns upon delete.
+      recreateResizeColsByNode(tableRef, node);
+      return false;
+    }
+
+    var resizeState;
+
+    if (parentWidth) {
+      resizeState = scaleWithParent(tableRef, parentWidth, node, start, domAtPos);
+    } else {
+      resizeState = scale(tableRef, options, domAtPos);
+    }
+
+    if (resizeState) {
+      var _tr = state.tr;
+      _tr = updateColumnWidths(resizeState, node, start)(_tr);
+
+      if (_tr.docChanged && dispatch) {
+        _tr.setMeta('scrollIntoView', false); // TODO: ED-8995
+        // We need to do this check to reduce the number of race conditions when working with tables.
+        // This metadata is been used in the sendTransaction function in the Collab plugin
+
+
+        _tr.setMeta('scaleTable', true);
+
+        dispatch(_tr);
+        return true;
+      }
+    }
+
+    return false;
+  };
+};
+export var evenColumns = function evenColumns(_ref) {
+  var resizeState = _ref.resizeState,
+      table = _ref.table,
+      start = _ref.start,
+      event = _ref.event;
+  return function (state, dispatch) {
+    if (!isTableSelected(state.selection)) {
+      return false;
+    } // double click detection logic
+    // Note: ProseMirror's handleDoubleClick doesn't quite work with DOM mousedown event handler
+
+
+    var _getPluginState = getPluginState(state),
+        lastClick = _getPluginState.lastClick;
+
+    var now = Date.now();
+
+    if (lastClick && now - lastClick.time < 500 && isClickNear(event, lastClick)) {
+      var newState = evenAllColumnsWidths(resizeState);
+      setLastClick(null, function (tr) {
+        return updateColumnWidths(newState, table, start)(tr);
+      })(state, dispatch);
+      return true;
+    }
+
+    setLastClick({
+      x: event.clientX,
+      y: event.clientY,
+      time: now
+    })(state, dispatch);
+    return false;
+  };
+};
+export var distributeColumnsWidths = function distributeColumnsWidths(newResizeState, table) {
+  return function (state, dispatch) {
+    if (dispatch) {
+      var _tr2 = updateColumnWidths(newResizeState, table.node, table.start)(state.tr);
+
+      stopResizing(_tr2)(state, dispatch);
+    }
+
+    return true;
+  };
+};
+export var setResizeHandlePos = function setResizeHandlePos(resizeHandlePos) {
+  return createCommand({
+    type: 'SET_RESIZE_HANDLE_POSITION',
+    data: {
+      resizeHandlePos: resizeHandlePos
+    }
+  });
+};
+export var stopResizing = function stopResizing(tr) {
+  return createCommand({
+    type: 'STOP_RESIZING'
+  }, function (originalTr) {
+    return (tr || originalTr).setMeta('scrollIntoView', false);
+  });
+};
+export var setDragging = function setDragging(dragging, tr) {
+  return createCommand({
+    type: 'SET_DRAGGING',
+    data: {
+      dragging: dragging
+    }
+  }, function (originalTr) {
+    return tr || originalTr;
+  });
+};
+export var setLastClick = function setLastClick(lastClick, transform) {
+  return createCommand({
+    type: 'SET_LAST_CLICK',
+    data: {
+      lastClick: lastClick
+    }
+  }, transform);
+};

package/dist/esm/plugins/table/pm-plugins/table-resizing/event-handlers.js

@@ -0,0 +1,159 @@
+import { TableMap } from '@atlaskit/editor-tables/table-map';
+import { getSelectionRect } from '@atlaskit/editor-tables/utils';
+import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
+import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
+import { getParentNodeWidth } from '@atlaskit/editor-common/node-width';
+import { updateColumnWidths } from '../../transforms';
+import { getSelectedColumnIndexes, updateResizeHandles } from '../../utils';
+import { evenColumns, setDragging, stopResizing } from './commands';
+import { getPluginState } from './plugin-factory';
+import { currentColWidth, getLayoutSize, getResizeState, pointsAtCell, resizeColumn, updateControls } from './utils';
+import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
+export var handleMouseDown = function handleMouseDown(view, event, localResizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, editorAnalyticsAPI) {
+  var state = view.state,
+      dispatch = view.dispatch;
+  var editorDisabled = !view.editable;
+  var domAtPos = view.domAtPos.bind(view);
+
+  if (editorDisabled || localResizeHandlePos === null || !pointsAtCell(state.doc.resolve(localResizeHandlePos))) {
+    return false;
+  }
+
+  event.preventDefault();
+  var mouseDownTime = event.timeStamp;
+  var cell = state.doc.nodeAt(localResizeHandlePos);
+  var $cell = state.doc.resolve(localResizeHandlePos);
+  var originalTable = $cell.node(-1);
+  var start = $cell.start(-1);
+  var dom = domAtPos(start).node;
+
+  if (dom && dom.nodeName !== 'TABLE') {
+    dom = dom.closest('table');
+  }
+
+  var containerWidth = getEditorContainerWidth();
+  var parentWidth = getParentNodeWidth(start, state, containerWidth);
+  var maxSize = parentWidth || getLayoutSize(dom.getAttribute('data-layout'), containerWidth.width, {});
+
+  if (originalTable.attrs.isNumberColumnEnabled) {
+    maxSize -= akEditorTableNumberColumnWidth;
+  }
+
+  var resizeState = getResizeState({
+    minWidth: tableCellMinWidth,
+    maxSize: maxSize,
+    table: originalTable,
+    tableRef: dom,
+    start: start,
+    domAtPos: domAtPos
+  });
+
+  if (evenColumns({
+    resizeState: resizeState,
+    table: originalTable,
+    start: start,
+    event: event
+  })(state, dispatch)) {
+    finish(event);
+    return true;
+  }
+
+  var width = currentColWidth(view, localResizeHandlePos, cell.attrs);
+  setDragging({
+    startX: event.clientX,
+    startWidth: width
+  })(state, dispatch);
+
+  function finish(event) {
+    window.removeEventListener('mouseup', finish);
+    window.removeEventListener('mousemove', move);
+    var clientX = event.clientX;
+    var state = view.state,
+        dispatch = view.dispatch;
+
+    var _getPluginState = getPluginState(state),
+        dragging = _getPluginState.dragging,
+        resizeHandlePos = _getPluginState.resizeHandlePos;
+
+    if (resizeHandlePos === null) {
+      return stopResizing()(state, dispatch);
+    }
+
+    if (!pointsAtCell(state.doc.resolve(resizeHandlePos))) {
+      return;
+    } // resizeHandlePos could be remapped via a collab change.
+    // Fetch a fresh reference of the table.
+
+
+    var $cell = state.doc.resolve(resizeHandlePos);
+    var start = $cell.start(-1);
+    var table = $cell.node(-1); // If we let go in the same place we started, dont need to do anything.
+
+    if (dragging && clientX === dragging.startX) {
+      return stopResizing()(state, dispatch);
+    }
+
+    var tr = state.tr;
+
+    if (dragging) {
+      var startX = dragging.startX; // If the table has changed (via collab for example) don't apply column widths
+      // For example, if a table col is deleted we won't be able to reliably remap the new widths
+      // There may be a more elegant solution to this, to avoid a jarring experience.
+
+      if (table.eq(originalTable)) {
+        var map = TableMap.get(table);
+        var colIndex = map.colCount($cell.pos - start) + ($cell.nodeAfter ? $cell.nodeAfter.attrs.colspan : 1) - 1;
+        var selectionRect = getSelectionRect(state.selection);
+        var selectedColumns = selectionRect ? getSelectedColumnIndexes(selectionRect) : []; // only selected (or selected - 1) columns should be distributed
+
+        var resizingSelectedColumns = selectedColumns.indexOf(colIndex) > -1 || selectedColumns.indexOf(colIndex + 1) > -1;
+        var newResizeState = resizeColumn(resizeState, colIndex, clientX - startX, dom, resizingSelectedColumns ? selectedColumns : undefined);
+        tr = updateColumnWidths(newResizeState, table, start)(tr);
+
+        if (colIndex === map.width - 1) {
+          var mouseUpTime = event.timeStamp;
+          editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
+            action: TABLE_ACTION.ATTEMPTED_TABLE_WIDTH_CHANGE,
+            actionSubject: ACTION_SUBJECT.TABLE,
+            actionSubjectId: null,
+            attributes: {
+              type: 'table-border',
+              position: 'right',
+              duration: mouseUpTime - mouseDownTime,
+              delta: Math.abs(clientX - dragging.startX)
+            },
+            eventType: EVENT_TYPE.UI
+          })(tr);
+        }
+      }
+
+      return stopResizing(tr)(state, dispatch);
+    }
+  }
+
+  function move(event) {
+    var clientX = event.clientX,
+        which = event.which;
+    var state = view.state;
+
+    var _getPluginState2 = getPluginState(state),
+        dragging = _getPluginState2.dragging,
+        resizeHandlePos = _getPluginState2.resizeHandlePos;
+
+    if (!which || !dragging || resizeHandlePos === null || !pointsAtCell(state.doc.resolve(resizeHandlePos))) {
+      return finish(event);
+    }
+
+    var $cell = state.doc.resolve(resizeHandlePos);
+    var table = $cell.node(-1);
+    var map = TableMap.get(table);
+    var colIndex = map.colCount($cell.pos - $cell.start(-1)) + $cell.nodeAfter.attrs.colspan - 1;
+    resizeColumn(resizeState, colIndex, clientX - dragging.startX, dom);
+    updateControls(getEditorFeatureFlags)(state);
+    updateResizeHandles(dom);
+  }
+
+  window.addEventListener('mouseup', finish);
+  window.addEventListener('mousemove', move);
+  return true;
+};

package/dist/esm/plugins/table/pm-plugins/table-resizing/index.js

@@ -0,0 +1,3 @@
+export { createPlugin } from './plugin';
+export { scaleTable } from './commands';
+export { pluginKey } from './plugin-key';

package/dist/esm/plugins/table/pm-plugins/table-resizing/plugin-factory.js

@@ -0,0 +1,26 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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) { _defineProperty(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; }
+
+import { pluginFactory } from '@atlaskit/editor-common/utils';
+import { pluginKey } from './plugin-key';
+import reducer from './reducer';
+
+function mapping(tr, pluginState) {
+  if (pluginState && pluginState.resizeHandlePos !== null) {
+    return _objectSpread(_objectSpread({}, pluginState), {}, {
+      resizeHandlePos: tr.mapping.map(pluginState.resizeHandlePos)
+    });
+  }
+
+  return pluginState;
+}
+
+var factory = pluginFactory(pluginKey, reducer, {
+  mapping: mapping
+});
+export var createCommand = factory.createCommand;
+export var createPluginState = factory.createPluginState;
+export var getPluginState = factory.getPluginState;

package/dist/esm/plugins/table/pm-plugins/table-resizing/plugin-key.js

@@ -0,0 +1,2 @@
+import { PluginKey } from 'prosemirror-state';
+export var pluginKey = new PluginKey('tableFlexiColumnResizing');

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

@@ -0,0 +1,52 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import classnames from 'classnames';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { TableCssClassName as ClassName } from '../../types';
+import { setResizeHandlePos } from './commands';
+import { handleMouseDown } from './event-handlers';
+import { createPluginState, getPluginState } from './plugin-factory';
+import { pluginKey } from './plugin-key';
+import { getResizeCellPos } from './utils';
+export function createPlugin(dispatch, _ref, getEditorContainerWidth, getEditorFeatureFlags, editorAnalyticsAPI) {
+  var _ref$lastColumnResiza = _ref.lastColumnResizable,
+      lastColumnResizable = _ref$lastColumnResiza === void 0 ? true : _ref$lastColumnResiza;
+  return new SafePlugin({
+    key: pluginKey,
+    state: createPluginState(dispatch, {
+      lastColumnResizable: lastColumnResizable,
+      resizeHandlePos: null,
+      dragging: null,
+      lastClick: null
+    }),
+    props: {
+      attributes: function attributes(state) {
+        var _classnames;
+
+        var pluginState = getPluginState(state);
+        return {
+          class: classnames(ClassName.RESIZING_PLUGIN, (_classnames = {}, _defineProperty(_classnames, ClassName.RESIZE_CURSOR, pluginState.resizeHandlePos !== null), _defineProperty(_classnames, ClassName.IS_RESIZING, !!pluginState.dragging), _classnames))
+        };
+      },
+      handleDOMEvents: {
+        mousedown: function mousedown(view, event) {
+          var state = view.state;
+          var resizeHandlePos = // we're setting `resizeHandlePos` via command in unit tests
+          getPluginState(state).resizeHandlePos || getResizeCellPos(view, event, lastColumnResizable);
+
+          var _getPluginState = getPluginState(state),
+              dragging = _getPluginState.dragging;
+
+          if (resizeHandlePos !== null && !dragging) {
+            if (handleMouseDown(view, event, resizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, editorAnalyticsAPI)) {
+              var _state = view.state,
+                  _dispatch = view.dispatch;
+              return setResizeHandlePos(resizeHandlePos)(_state, _dispatch);
+            }
+          }
+
+          return false;
+        }
+      }
+    }
+  });
+}

package/dist/esm/plugins/table/pm-plugins/table-resizing/reducer.js

@@ -0,0 +1,35 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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) { _defineProperty(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; }
+
+export default (function (pluginState, action) {
+  switch (action.type) {
+    case 'STOP_RESIZING':
+      return _objectSpread(_objectSpread({}, pluginState), {}, {
+        resizeHandlePos: null,
+        dragging: null
+      });
+
+    case 'SET_RESIZE_HANDLE_POSITION':
+      return _objectSpread(_objectSpread({}, pluginState), {}, {
+        resizeHandlePos: action.data.resizeHandlePos
+      });
+
+    case 'SET_DRAGGING':
+      return _objectSpread(_objectSpread({}, pluginState), {}, {
+        dragging: action.data.dragging
+      });
+
+    case 'SET_LAST_CLICK':
+      var lastClick = action.data.lastClick;
+      return _objectSpread(_objectSpread({}, pluginState), {}, {
+        lastClick: lastClick,
+        resizeHandlePos: lastClick ? pluginState.resizeHandlePos : null
+      });
+
+    default:
+      return pluginState;
+  }
+});

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

@@ -0,0 +1,50 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import { DOMSerializer } from 'prosemirror-model';
+import { getFragmentBackingArray } from '@atlaskit/editor-common/utils';
+export var generateColgroup = function generateColgroup(table) {
+  var cols = [];
+  table.content.firstChild.content.forEach(function (cell) {
+    var colspan = cell.attrs.colspan || 1;
+
+    if (Array.isArray(cell.attrs.colwidth)) {
+      // We slice here to guard against our colwidth array having more entries
+      // Than the we actually span. We'll patch the document at a later point.
+      cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
+        cols.push(['col', width ? {
+          style: "width: ".concat(width, "px;")
+        } : {}]);
+      });
+    } else {
+      // When we have merged cells on the first row (firstChild),
+      // We want to ensure we're creating the appropriate amount of
+      // cols the table still has.
+      cols.push.apply(cols, _toConsumableArray(Array.from({
+        length: colspan
+      }, function (_) {
+        return ['col', {}];
+      })));
+    }
+  });
+  return cols;
+};
+export var insertColgroupFromNode = function insertColgroupFromNode(tableRef, table) {
+  var colgroup = tableRef.querySelector('colgroup');
+
+  if (colgroup) {
+    tableRef.removeChild(colgroup);
+  }
+
+  colgroup = renderColgroupFromNode(table);
+  tableRef.insertBefore(colgroup, tableRef.firstChild);
+  return colgroup.children;
+};
+export var hasTableBeenResized = function hasTableBeenResized(table) {
+  return !!getFragmentBackingArray(table.content.firstChild.content).find(function (cell) {
+    return cell.attrs.colwidth;
+  });
+};
+
+function renderColgroupFromNode(table) {
+  var rendered = DOMSerializer.renderSpec(document, ['colgroup', {}].concat(_toConsumableArray(generateColgroup(table))));
+  return rendered.dom;
+}