@atlaskit/editor-core 172.1.2 → 172.2.0

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

@@ -13,7 +13,7 @@ var _reactIntlNext = require("react-intl-next");
 
 var _remove = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/remove"));
 
-var _messages = _interopRequireDefault(require("../../messages"));
+var _messages = _interopRequireDefault(require("@atlaskit/editor-common/messages"));
 
 var _commands = require("./commands");
 
@@ -27,7 +27,7 @@ var _types = require("./types");
 
 var _referentiality = require("./utils/referentiality");
 
-var _analytics = require("../analytics");
+var _analytics = require("@atlaskit/editor-common/analytics");
 
 var _utils = require("@atlaskit/editor-tables/utils");
 
@@ -39,7 +39,7 @@ var _ContextualMenu = require("./ui/FloatingContextualMenu/ContextualMenu");
 
 var _prosemirrorUtils = require("prosemirror-utils");
 
-var _dom = require("../../utils/dom");
+var _utils2 = require("@atlaskit/editor-common/utils");
 
 var _toolbar = require("../copy-button/toolbar");
 
@@ -73,30 +73,30 @@ var messages = (0, _reactIntlNext.defineMessages)({
 });
 exports.messages = messages;
 
-var getToolbarMenuConfig = function getToolbarMenuConfig(config, state, _ref) {
+var getToolbarMenuConfig = function getToolbarMenuConfig(config, state, _ref, editorAnalyticsAPI) {
   var formatMessage = _ref.formatMessage;
   var options = [{
     id: 'editor.table.headerRow',
     title: formatMessage(messages.headerRow),
-    onClick: (0, _commandsWithAnalytics.toggleHeaderRowWithAnalytics)(),
+    onClick: (0, _commandsWithAnalytics.toggleHeaderRowWithAnalytics)(editorAnalyticsAPI),
     selected: state.isHeaderRowEnabled,
     hidden: !config.allowHeaderRow
   }, {
     id: 'editor.table.headerColumn',
     title: formatMessage(messages.headerColumn),
-    onClick: (0, _commandsWithAnalytics.toggleHeaderColumnWithAnalytics)(),
+    onClick: (0, _commandsWithAnalytics.toggleHeaderColumnWithAnalytics)(editorAnalyticsAPI),
     selected: state.isHeaderColumnEnabled,
     hidden: !config.allowHeaderColumn
   }, {
     id: 'editor.table.numberedColumn',
     title: formatMessage(messages.numberedColumn),
-    onClick: (0, _commandsWithAnalytics.toggleNumberColumnWithAnalytics)(),
+    onClick: (0, _commandsWithAnalytics.toggleNumberColumnWithAnalytics)(editorAnalyticsAPI),
     selected: state.isNumberColumnEnabled,
     hidden: !config.allowNumberColumn
   }, {
     id: 'editor.table.collapseTable',
     title: formatMessage(messages.collapseTable),
-    onClick: (0, _commandsWithAnalytics.wrapTableInExpandWithAnalytics)(),
+    onClick: (0, _commandsWithAnalytics.wrapTableInExpandWithAnalytics)(editorAnalyticsAPI),
     selected: !!state.isTableCollapsed,
     disabled: !state.canCollapseTable,
     hidden: !config.allowCollapse
@@ -117,7 +117,7 @@ var getToolbarMenuConfig = function getToolbarMenuConfig(config, state, _ref) {
 
 exports.getToolbarMenuConfig = getToolbarMenuConfig;
 
-var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(editorState, initialSelectionRect, _ref2) {
+var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(editorState, initialSelectionRect, _ref2, getEditorContainerWidth, editorAnalyticsAPI) {
   var formatMessage = _ref2.formatMessage;
   var top = initialSelectionRect.top,
       bottom = initialSelectionRect.bottom,
@@ -133,7 +133,7 @@ var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(editorSta
       var index = selectionRect === null || selectionRect === void 0 ? void 0 : selectionRect.right;
 
       if (index) {
-        (0, _commandsWithAnalytics.insertColumnWithAnalytics)(_analytics.INPUT_METHOD.FLOATING_TB, index)(state, dispatch, view);
+        (0, _commandsWithAnalytics.insertColumnWithAnalytics)(getEditorContainerWidth, editorAnalyticsAPI)(_analytics.INPUT_METHOD.FLOATING_TB, index)(state, dispatch, view);
       }
 
       return true;
@@ -148,7 +148,7 @@ var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(editorSta
       var index = selectionRect === null || selectionRect === void 0 ? void 0 : selectionRect.bottom;
 
       if (index) {
-        (0, _commandsWithAnalytics.insertRowWithAnalytics)(_analytics.INPUT_METHOD.FLOATING_TB, {
+        (0, _commandsWithAnalytics.insertRowWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.FLOATING_TB, {
           index: index,
           moveCursorToInsertedRow: true
         })(state, dispatch);
@@ -167,7 +167,7 @@ var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(editorSta
       var selectionRect = getClosestSelectionRect(state);
 
       if (selectionRect) {
-        (0, _commandsWithAnalytics.deleteColumnsWithAnalytics)(_analytics.INPUT_METHOD.FLOATING_TB, selectionRect)(state, dispatch, view);
+        (0, _commandsWithAnalytics.deleteColumnsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.FLOATING_TB, selectionRect)(state, dispatch, view);
       }
 
       return true;
@@ -183,7 +183,7 @@ var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(editorSta
       var selectionRect = getClosestSelectionRect(state);
 
       if (selectionRect) {
-        (0, _commandsWithAnalytics.deleteRowsWithAnalytics)(_analytics.INPUT_METHOD.FLOATING_TB, selectionRect, false)(state, dispatch);
+        (0, _commandsWithAnalytics.deleteRowsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.FLOATING_TB, selectionRect, false)(state, dispatch);
       }
 
       return true;
@@ -193,13 +193,13 @@ var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(editorSta
   }, {
     id: 'editor.table.mergeCells',
     title: formatMessage(_ContextualMenu.messages.mergeCells),
-    onClick: (0, _commandsWithAnalytics.mergeCellsWithAnalytics)(),
+    onClick: (0, _commandsWithAnalytics.mergeCellsWithAnalytics)(editorAnalyticsAPI),
     selected: false,
     disabled: !(0, _transforms.canMergeCells)(editorState.tr)
   }, {
     id: 'editor.table.splitCell',
     title: formatMessage(_ContextualMenu.messages.splitCell),
-    onClick: (0, _commandsWithAnalytics.splitCellWithAnalytics)(),
+    onClick: (0, _commandsWithAnalytics.splitCellWithAnalytics)(editorAnalyticsAPI),
     selected: false,
     disabled: !(0, _utils.splitCell)(editorState)
   }, {
@@ -211,7 +211,7 @@ var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(editorSta
       var _getPluginState = (0, _pluginFactory.getPluginState)(state),
           targetCellPosition = _getPluginState.targetCellPosition;
 
-      (0, _commandsWithAnalytics.emptyMultipleCellsWithAnalytics)(_analytics.INPUT_METHOD.FLOATING_TB, targetCellPosition)(state, dispatch);
+      (0, _commandsWithAnalytics.emptyMultipleCellsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.FLOATING_TB, targetCellPosition)(state, dispatch);
       return true;
     },
     selected: false,
@@ -233,70 +233,72 @@ var getClosestSelectionRect = function getClosestSelectionRect(state) {
   return (0, _utils.isSelectionType)(selection, 'cell') ? (0, _utils.getSelectionRect)(selection) : (0, _utils.findCellRectClosestToPos)(selection.$from);
 };
 
-var getToolbarConfig = function getToolbarConfig(config) {
-  return function (state, intl) {
-    var tableObject = (0, _utils.findTable)(state.selection);
-    var pluginState = (0, _pluginFactory.getPluginState)(state);
+var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth, editorAnalyticsAPI) {
+  return function (config) {
+    return function (state, intl) {
+      var tableObject = (0, _utils.findTable)(state.selection);
+      var pluginState = (0, _pluginFactory.getPluginState)(state);
 
-    var resizeState = _tableResizing.pluginKey.getState(state);
+      var resizeState = _tableResizing.pluginKey.getState(state);
 
-    if (tableObject && pluginState.editorHasFocus) {
-      var nodeType = state.schema.nodes.table;
-      var menu = getToolbarMenuConfig(config, pluginState, intl);
-      var cellItems = getCellItems(config, state, intl); // Check if we need to show confirm dialog for delete button
+      if (tableObject && pluginState.editorHasFocus) {
+        var nodeType = state.schema.nodes.table;
+        var menu = getToolbarMenuConfig(config, pluginState, intl, editorAnalyticsAPI);
+        var cellItems = getCellItems(config, state, intl, getEditorContainerWidth, editorAnalyticsAPI); // Check if we need to show confirm dialog for delete button
 
-      var confirmDialog;
-      var localId = tableObject.node.attrs.localId;
+        var confirmDialog;
+        var localId = tableObject.node.attrs.localId;
 
-      if (localId && (0, _referentiality.isReferencedSource)(state, localId)) {
-        confirmDialog = {
-          okButtonLabel: intl.formatMessage(_messages2.default.confirmDeleteLinkedModalOKButton),
-          message: intl.formatMessage(_messages2.default.confirmDeleteLinkedModalMessage)
-        };
-      }
+        if (localId && (0, _referentiality.isReferencedSource)(state, localId)) {
+          confirmDialog = {
+            okButtonLabel: intl.formatMessage(_messages2.default.confirmDeleteLinkedModalOKButton),
+            message: intl.formatMessage(_messages2.default.confirmDeleteLinkedModalMessage)
+          };
+        }
 
-      var getDomRef = function getDomRef(editorView) {
-        var element;
-        var domAtPos = editorView.domAtPos.bind(editorView);
-        var parent = (0, _prosemirrorUtils.findParentDomRefOfType)(nodeType, domAtPos)(state.selection);
+        var getDomRef = function getDomRef(editorView) {
+          var element;
+          var domAtPos = editorView.domAtPos.bind(editorView);
+          var parent = (0, _prosemirrorUtils.findParentDomRefOfType)(nodeType, domAtPos)(state.selection);
 
-        if (parent) {
-          var tableRef = parent.querySelector('table') || undefined;
+          if (parent) {
+            var tableRef = parent.querySelector('table') || undefined;
 
-          if (tableRef) {
-            element = (0, _dom.closestElement)(tableRef, ".".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER)) || undefined;
+            if (tableRef) {
+              element = (0, _utils2.closestElement)(tableRef, ".".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER)) || undefined;
+            }
           }
-        }
 
-        return element;
-      };
-
-      return {
-        title: 'Table floating controls',
-        getDomRef: getDomRef,
-        nodeType: nodeType,
-        offset: [0, 3],
-        items: [menu, separator(menu.hidden)].concat((0, _toConsumableArray2.default)(cellItems), [{
-          type: 'extensions-placeholder',
-          separator: 'end'
-        }], (0, _toConsumableArray2.default)(state && (0, _toolbar.showCopyButton)(state) ? [(0, _toolbar.getCopyButtonConfig)(state, intl.formatMessage, nodeType, (0, _commands.hoverTable)(false, true), (0, _commands.clearHoverSelection)()), {
-          type: 'separator'
-        }] : []), [{
-          id: 'editor.table.delete',
-          type: 'button',
-          appearance: 'danger',
-          icon: _remove.default,
-          onClick: (0, _commandsWithAnalytics.deleteTableWithAnalytics)(),
-          disabled: !!resizeState && !!resizeState.dragging,
-          onMouseEnter: (0, _commands.hoverTable)(true),
-          onMouseLeave: (0, _commands.clearHoverSelection)(),
-          title: intl.formatMessage(_messages.default.remove),
-          confirmDialog: confirmDialog
-        }])
-      };
-    }
+          return element;
+        };
+
+        return {
+          title: 'Table floating controls',
+          getDomRef: getDomRef,
+          nodeType: nodeType,
+          offset: [0, 3],
+          items: [menu, separator(menu.hidden)].concat((0, _toConsumableArray2.default)(cellItems), [{
+            type: 'extensions-placeholder',
+            separator: 'end'
+          }], (0, _toConsumableArray2.default)(state && (0, _toolbar.showCopyButton)(state) ? [(0, _toolbar.getCopyButtonConfig)(state, intl.formatMessage, nodeType, (0, _commands.hoverTable)(false, true), (0, _commands.clearHoverSelection)()), {
+            type: 'separator'
+          }] : []), [{
+            id: 'editor.table.delete',
+            type: 'button',
+            appearance: 'danger',
+            icon: _remove.default,
+            onClick: (0, _commandsWithAnalytics.deleteTableWithAnalytics)(editorAnalyticsAPI),
+            disabled: !!resizeState && !!resizeState.dragging,
+            onMouseEnter: (0, _commands.hoverTable)(true),
+            onMouseLeave: (0, _commands.clearHoverSelection)(),
+            title: intl.formatMessage(_messages.default.remove),
+            confirmDialog: confirmDialog
+          }])
+        };
+      }
 
-    return;
+      return;
+    };
   };
 };
 
@@ -309,7 +311,7 @@ var separator = function separator(hidden) {
   };
 };
 
-var getCellItems = function getCellItems(pluginConfig, state, _ref3) {
+var getCellItems = function getCellItems(pluginConfig, state, _ref3, getEditorContainerWidth, editorAnalyticsAPI) {
   var formatMessage = _ref3.formatMessage;
 
   if (pluginConfig.allowCellOptionsInFloatingToolbar) {
@@ -318,7 +320,7 @@ var getCellItems = function getCellItems(pluginConfig, state, _ref3) {
     if (initialSelectionRect) {
       var cellOptions = getToolbarCellOptionsConfig(state, initialSelectionRect, {
         formatMessage: formatMessage
-      });
+      }, getEditorContainerWidth, editorAnalyticsAPI);
       return [cellOptions, separator(cellOptions.hidden)];
     }
   }

package/dist/cjs/plugins/table/transforms/column-width.js

@@ -145,48 +145,51 @@ var updateColumnWidths = function updateColumnWidths(resizeState, table, start)
 
 exports.updateColumnWidths = updateColumnWidths;
 
-var rescaleColumns = function rescaleColumns(table, view) {
-  return function (tr) {
-    // If the table has been not been resized we skip updating the size
-    // of columns here.
-    if (!view || !(0, _utils.hasTableBeenResized)(table.node)) {
-      return tr;
-    }
+var rescaleColumns = function rescaleColumns(getEditorContainerWidth) {
+  return function (table, view) {
+    return function (tr) {
+      // If the table has been not been resized we skip updating the size
+      // of columns here.
+      if (!view || !(0, _utils.hasTableBeenResized)(table.node)) {
+        return tr;
+      }
 
-    var state = view.state;
-    var domAtPos = view.domAtPos.bind(view);
-    var maybeTable = domAtPos(table.start).node;
-    var tableRef = maybeTable.closest('table');
+      var state = view.state;
+      var domAtPos = view.domAtPos.bind(view);
+      var maybeTable = domAtPos(table.start).node;
+      var tableRef = maybeTable.closest('table');
 
-    if (!tableRef) {
-      return tr;
-    }
+      if (!tableRef) {
+        return tr;
+      }
 
-    var layout = (0, _resizeState.normaliseTableLayout)(tableRef === null || tableRef === void 0 ? void 0 : tableRef.dataset.layout); // The is the width the table can reach before overflowing
-
-    var maxSize = (0, _misc.getTableMaxWidth)({
-      table: table.node,
-      tableStart: table.start,
-      state: state,
-      layout: layout
-    });
-    var resizeState = (0, _resizeState.getResizeState)({
-      minWidth: _styles.tableCellMinWidth,
-      table: table.node,
-      start: table.start,
-      tableRef: tableRef,
-      domAtPos: domAtPos,
-      maxSize: maxSize
-    });
-    var previousTableWidth = resizeState.tableWidth - _styles.tableNewColumnMinWidth;
-    var tableDidntPreviouslyOverflow = previousTableWidth <= maxSize; // If the new table width will result in the table going into an overflow state
-    // we resize the cells to avoid the overflow occuring
-
-    if (tableDidntPreviouslyOverflow && resizeState.overflow) {
-      resizeState = (0, _scaleTable.scaleTableTo)(resizeState, maxSize);
-    }
+      var layout = (0, _resizeState.normaliseTableLayout)(tableRef === null || tableRef === void 0 ? void 0 : tableRef.dataset.layout); // The is the width the table can reach before overflowing
+
+      var maxSize = (0, _misc.getTableMaxWidth)({
+        table: table.node,
+        tableStart: table.start,
+        state: state,
+        layout: layout,
+        getEditorContainerWidth: getEditorContainerWidth
+      });
+      var resizeState = (0, _resizeState.getResizeState)({
+        minWidth: _styles.tableCellMinWidth,
+        table: table.node,
+        start: table.start,
+        tableRef: tableRef,
+        domAtPos: domAtPos,
+        maxSize: maxSize
+      });
+      var previousTableWidth = resizeState.tableWidth - _styles.tableNewColumnMinWidth;
+      var tableDidntPreviouslyOverflow = previousTableWidth <= maxSize; // If the new table width will result in the table going into an overflow state
+      // we resize the cells to avoid the overflow occuring
+
+      if (tableDidntPreviouslyOverflow && resizeState.overflow) {
+        resizeState = (0, _scaleTable.scaleTableTo)(resizeState, maxSize);
+      }
 
-    return updateColumnWidths(resizeState, table.node, table.start)(tr);
+      return updateColumnWidths(resizeState, table.node, table.start)(tr);
+    };
   };
 };
 

package/dist/cjs/plugins/table/transforms/replace-table.js

@@ -11,11 +11,11 @@ var _prosemirrorModel = require("prosemirror-model");
 
 var _utils = require("@atlaskit/editor-tables/utils");
 
-var _analytics = require("../../analytics");
+var _analytics = require("@atlaskit/editor-common/analytics");
 
 var _utils2 = require("../utils");
 
-var replaceSelectedTable = function replaceSelectedTable(state, content, inputMethod) {
+var replaceSelectedTable = function replaceSelectedTable(state, content, inputMethod, editorAnalyticsAPI) {
   if ((0, _utils.isTableSelected)(state.selection)) {
     var table = (0, _utils.findTable)(state.selection);
 
@@ -28,7 +28,7 @@ var replaceSelectedTable = function replaceSelectedTable(state, content, inputMe
           totalRowCount = _getSelectedTableInfo.totalRowCount,
           totalColumnCount = _getSelectedTableInfo.totalColumnCount;
 
-      (0, _analytics.addAnalytics)(state, tr, {
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
         action: _analytics.TABLE_ACTION.REPLACED,
         actionSubject: _analytics.ACTION_SUBJECT.TABLE,
         attributes: {
@@ -37,7 +37,7 @@ var replaceSelectedTable = function replaceSelectedTable(state, content, inputMe
           inputMethod: inputMethod
         },
         eventType: _analytics.EVENT_TYPE.TRACK
-      });
+      })(tr);
       return tr;
     }
   }

package/dist/cjs/plugins/table/ui/FloatingContextualButton/index.js

@@ -46,9 +46,7 @@ var _types = require("../../types");
 
 var _messages = _interopRequireDefault(require("../../ui/messages"));
 
-var _types2 = require("../../../analytics/types");
-
-var _analytics = require("../../../analytics");
+var _analytics = require("@atlaskit/editor-common/analytics");
 
 var _styles = require("./styles");
 
@@ -116,7 +114,7 @@ var FloatingContextualButtonInner = /*#__PURE__*/function (_React$Component) {
             actionSubject: _analytics.ACTION_SUBJECT.CONTENT_COMPONENT,
             eventType: _analytics.EVENT_TYPE.OPERATIONAL,
             attributes: {
-              component: _types2.CONTENT_COMPONENT.FLOATING_CONTEXTUAL_BUTTON,
+              component: _analytics.CONTENT_COMPONENT.FLOATING_CONTEXTUAL_BUTTON,
               selection: editorView.state.selection.toJSON(),
               position: targetCellPosition,
               docSize: editorView.state.doc.nodeSize,

package/dist/cjs/plugins/table/ui/FloatingContextualMenu/ContextualMenu.js

@@ -41,7 +41,7 @@ var _styles = require("../../../../ui/styles");
 
 var _dom = require("../../../../utils/dom");
 
-var _analytics = require("../../../analytics");
+var _analytics = require("@atlaskit/editor-common/analytics");
 
 var _commands = require("../../commands");
 
@@ -250,7 +250,7 @@ var ContextualMenu = /*#__PURE__*/function (_Component) {
       if (allowDistributeColumns) {
         var _newResizeState$chang;
 
-        var newResizeState = (0, _resizeState.getNewResizeStateFromSelectedColumns)(selectionRect, state, editorView.domAtPos.bind(editorView));
+        var newResizeState = (0, _resizeState.getNewResizeStateFromSelectedColumns)(selectionRect, state, editorView.domAtPos.bind(editorView), _this.props.getEditorContainerWidth);
         var wouldChange = (_newResizeState$chang = newResizeState === null || newResizeState === void 0 ? void 0 : newResizeState.changed) !== null && _newResizeState$chang !== void 0 ? _newResizeState$chang : false;
         items.push({
           content: formatMessage(messages.distributeColumns),
@@ -300,7 +300,9 @@ var ContextualMenu = /*#__PURE__*/function (_Component) {
       var item = _ref.item;
       var _this$props2 = _this.props,
           editorView = _this$props2.editorView,
-          selectionRect = _this$props2.selectionRect; // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
+          selectionRect = _this$props2.selectionRect,
+          editorAnalyticsAPI = _this$props2.editorAnalyticsAPI,
+          getEditorContainerWidth = _this$props2.getEditorContainerWidth; // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
 
       var state = editorView.state,
           dispatch = editorView.dispatch;
@@ -310,38 +312,38 @@ var ContextualMenu = /*#__PURE__*/function (_Component) {
 
       switch (item.value.name) {
         case 'sort_column_desc':
-          (0, _commandsWithAnalytics.sortColumnWithAnalytics)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect.left, _steps.TableSortOrder.DESC)(state, dispatch);
+          (0, _commandsWithAnalytics.sortColumnWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect.left, _steps.TableSortOrder.DESC)(state, dispatch);
 
           _this.toggleOpen();
 
           break;
 
         case 'sort_column_asc':
-          (0, _commandsWithAnalytics.sortColumnWithAnalytics)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect.left, _steps.TableSortOrder.ASC)(state, dispatch);
+          (0, _commandsWithAnalytics.sortColumnWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect.left, _steps.TableSortOrder.ASC)(state, dispatch);
 
           _this.toggleOpen();
 
           break;
 
         case 'merge':
-          (0, _commandsWithAnalytics.mergeCellsWithAnalytics)()(state, dispatch);
+          (0, _commandsWithAnalytics.mergeCellsWithAnalytics)(editorAnalyticsAPI)(state, dispatch);
 
           _this.toggleOpen();
 
           break;
 
         case 'split':
-          (0, _commandsWithAnalytics.splitCellWithAnalytics)()(state, dispatch);
+          (0, _commandsWithAnalytics.splitCellWithAnalytics)(editorAnalyticsAPI)(state, dispatch);
 
           _this.toggleOpen();
 
           break;
 
         case 'distribute_columns':
-          var newResizeStateWithAnalytics = (0, _resizeState.getNewResizeStateFromSelectedColumns)(selectionRect, state, editorView.domAtPos.bind(editorView));
+          var newResizeStateWithAnalytics = (0, _resizeState.getNewResizeStateFromSelectedColumns)(selectionRect, state, editorView.domAtPos.bind(editorView), _this.props.getEditorContainerWidth);
 
           if (newResizeStateWithAnalytics) {
-            (0, _commandsWithAnalytics.distributeColumnsWidthsWithAnalytics)(_analytics.INPUT_METHOD.CONTEXT_MENU, newResizeStateWithAnalytics)(state, dispatch);
+            (0, _commandsWithAnalytics.distributeColumnsWidthsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.CONTEXT_MENU, newResizeStateWithAnalytics)(state, dispatch);
 
             _this.toggleOpen();
           }
@@ -349,21 +351,21 @@ var ContextualMenu = /*#__PURE__*/function (_Component) {
           break;
 
         case 'clear':
-          (0, _commandsWithAnalytics.emptyMultipleCellsWithAnalytics)(_analytics.INPUT_METHOD.CONTEXT_MENU, targetCellPosition)(state, dispatch);
+          (0, _commandsWithAnalytics.emptyMultipleCellsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.CONTEXT_MENU, targetCellPosition)(state, dispatch);
 
           _this.toggleOpen();
 
           break;
 
         case 'insert_column':
-          (0, _commandsWithAnalytics.insertColumnWithAnalytics)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect.right)(state, dispatch, editorView);
+          (0, _commandsWithAnalytics.insertColumnWithAnalytics)(getEditorContainerWidth, editorAnalyticsAPI)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect.right)(state, dispatch, editorView);
 
           _this.toggleOpen();
 
           break;
 
         case 'insert_row':
-          (0, _commandsWithAnalytics.insertRowWithAnalytics)(_analytics.INPUT_METHOD.CONTEXT_MENU, {
+          (0, _commandsWithAnalytics.insertRowWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.CONTEXT_MENU, {
             index: selectionRect.bottom,
             moveCursorToInsertedRow: true
           })(state, dispatch);
@@ -373,7 +375,7 @@ var ContextualMenu = /*#__PURE__*/function (_Component) {
           break;
 
         case 'delete_column':
-          (0, _commandsWithAnalytics.deleteColumnsWithAnalytics)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect)(state, dispatch);
+          (0, _commandsWithAnalytics.deleteColumnsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect)(state, dispatch);
 
           _this.toggleOpen();
 
@@ -383,7 +385,7 @@ var ContextualMenu = /*#__PURE__*/function (_Component) {
           var _getPluginState3 = (0, _pluginFactory.getPluginState)(state),
               isHeaderRowRequired = _getPluginState3.pluginConfig.isHeaderRowRequired;
 
-          (0, _commandsWithAnalytics.deleteRowsWithAnalytics)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect, !!isHeaderRowRequired)(state, dispatch);
+          (0, _commandsWithAnalytics.deleteRowsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.CONTEXT_MENU, selectionRect, !!isHeaderRowRequired)(state, dispatch);
 
           _this.toggleOpen();
 
@@ -464,14 +466,16 @@ var ContextualMenu = /*#__PURE__*/function (_Component) {
       }
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setColor", function (color) {
-      var editorView = _this.props.editorView; // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
+      var _this$props5 = _this.props,
+          editorView = _this$props5.editorView,
+          editorAnalyticsAPI = _this$props5.editorAnalyticsAPI; // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
 
       var _getPluginState4 = (0, _pluginFactory.getPluginState)(editorView.state),
           targetCellPosition = _getPluginState4.targetCellPosition;
 
       var state = editorView.state,
           dispatch = editorView.dispatch;
-      (0, _commandsWithAnalytics.setColorWithAnalytics)(color, targetCellPosition)(state, dispatch);
+      (0, _commandsWithAnalytics.setColorWithAnalytics)(editorAnalyticsAPI)(color, targetCellPosition)(state, dispatch);
 
       _this.toggleOpen();
     });
@@ -481,11 +485,11 @@ var ContextualMenu = /*#__PURE__*/function (_Component) {
   (0, _createClass2.default)(ContextualMenu, [{
     key: "render",
     value: function render() {
-      var _this$props5 = this.props,
-          isOpen = _this$props5.isOpen,
-          mountPoint = _this$props5.mountPoint,
-          offset = _this$props5.offset,
-          boundariesElement = _this$props5.boundariesElement;
+      var _this$props6 = this.props,
+          isOpen = _this$props6.isOpen,
+          mountPoint = _this$props6.mountPoint,
+          offset = _this$props6.offset,
+          boundariesElement = _this$props6.boundariesElement;
       var items = this.createItems();
 
       if (!items) {

package/dist/cjs/plugins/table/ui/FloatingContextualMenu/index.js

@@ -54,7 +54,9 @@ var FloatingContextualMenu = function FloatingContextualMenu(_ref) {
       scrollableElement = _ref.scrollableElement,
       editorView = _ref.editorView,
       isOpen = _ref.isOpen,
-      pluginConfig = _ref.pluginConfig;
+      pluginConfig = _ref.pluginConfig,
+      editorAnalyticsAPI = _ref.editorAnalyticsAPI,
+      getEditorContainerWidth = _ref.getEditorContainerWidth;
 
   // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
   var _getPluginState = (0, _pluginFactory.getPluginState)(editorView.state),
@@ -103,7 +105,9 @@ var FloatingContextualMenu = function FloatingContextualMenu(_ref) {
     allowMergeCells: pluginConfig.allowMergeCells,
     allowBackgroundColor: pluginConfig.allowBackgroundColor,
     selectionRect: selectionRect,
-    boundariesElement: boundariesElement
+    boundariesElement: boundariesElement,
+    editorAnalyticsAPI: editorAnalyticsAPI,
+    getEditorContainerWidth: getEditorContainerWidth
   })));
 };
 

package/dist/cjs/plugins/table/ui/FloatingDeleteButton/index.js

@@ -40,7 +40,7 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
 var _dom = require("../../../../utils/dom");
 
-var _analytics = require("../../../analytics");
+var _analytics = require("@atlaskit/editor-common/analytics");
 
 var _commands = require("../../commands");
 
@@ -52,6 +52,8 @@ var _types = require("../../types");
 
 var _utils2 = require("../../utils");
 
+var _columnControls = require("../../utils/column-controls");
+
 var _messages = _interopRequireDefault(require("../messages"));
 
 var _consts = require("../consts");
@@ -155,6 +157,7 @@ var FloatingDeleteButton = /*#__PURE__*/function (_Component) {
       return (0, _commands.clearHoverSelection)()(state, dispatch);
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleClick", function () {
+      var editorAnalyticsAPI = _this.props.editorAnalyticsAPI;
       var _this$props$editorVie3 = _this.props.editorView,
           state = _this$props$editorVie3.state,
           dispatch = _this$props$editorVie3.dispatch;
@@ -168,13 +171,13 @@ var FloatingDeleteButton = /*#__PURE__*/function (_Component) {
         switch (_this.state.selectionType) {
           case 'column':
             {
-              (0, _commandsWithAnalytics.deleteColumnsWithAnalytics)(_analytics.INPUT_METHOD.BUTTON, rect)(state, dispatch);
+              (0, _commandsWithAnalytics.deleteColumnsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.BUTTON, rect)(state, dispatch);
               return;
             }
 
           case 'row':
             {
-              (0, _commandsWithAnalytics.deleteRowsWithAnalytics)(_analytics.INPUT_METHOD.BUTTON, rect, !!isHeaderRowRequired)(state, dispatch);
+              (0, _commandsWithAnalytics.deleteRowsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.BUTTON, rect, !!isHeaderRowRequired)(state, dispatch);
               return;
             }
         }
@@ -305,7 +308,7 @@ var FloatingDeleteButton = /*#__PURE__*/function (_Component) {
           case 'column':
             {
               // Calculate the button position and indexes for columns
-              var columnsWidths = (0, _utils2.getColumnsWidths)(nextProps.editorView);
+              var columnsWidths = (0, _columnControls.getColumnsWidths)(nextProps.editorView);
               var deleteBtnParams = (0, _utils2.getColumnDeleteButtonParams)(columnsWidths, nextProps.editorView.state.selection);
 
               if (deleteBtnParams) {