@atlaskit/editor-plugin-table 1.1.0 → 1.1.2

package/dist/cjs/plugins/table/ui/consts.js

@@ -4,20 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.tableToolbarSize = exports.tableToolbarSelectedColor = exports.tableToolbarDeleteColor = exports.tableToolbarColor = exports.tableTextColor = exports.tableScrollbarOffset = exports.tablePadding = exports.tableMarginFullWidthMode = exports.tableInsertColumnButtonSize = exports.tableInsertColumnButtonOffset = exports.tableFloatingControlsColor = exports.tableDeleteButtonSize = exports.tableDeleteButtonOffset = exports.tableControlsSpacing = exports.tableCellSelectedColor = exports.tableCellDeleteColor = exports.tableCellBackgroundColor = exports.tableBorderSelectedColor = exports.tableBorderRadiusSize = exports.tableBorderDeleteColor = exports.tableBorderColor = exports.stickyRowZIndex = exports.stickyRowOffsetTop = exports.stickyHeaderBorderBottomWidth = exports.resizeLineWidth = exports.resizeHandlerZIndex = exports.resizeHandlerAreaWidth = exports.lineMarkerSize = exports.lineMarkerOffsetFromColumnControls = exports.layoutButtonSize = exports.contextualMenuTriggerSize = exports.contextualMenuDropdownWidth = exports.columnResizeHandleZIndex = exports.columnControlsZIndex = exports.columnControlsSelectedZIndex = exports.columnControlsDecorationHeight = void 0;
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _styles = require("@atlaskit/editor-common/styles");
-
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-
 var _types = require("../types");
-
 var _components = require("@atlaskit/theme/components");
-
 /**
  * Basic colors added to prevent content overflow in table cells.
  */
+
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4135
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
 var tableCellBackgroundColor = (0, _components.themed)({
@@ -40,8 +35,8 @@ var tableBorderColor = (0, _components.themed)({
   dark: "var(--ds-border, ".concat(_editorSharedStyles.akEditorTableBorderDark, ")")
 });
 exports.tableBorderColor = tableBorderColor;
-var tableFloatingControlsColor = "var(--ds-background-neutral, ".concat(_colors.N20, ")"); // TODO: https://product-fabric.atlassian.net/browse/DSP-4461
-
+var tableFloatingControlsColor = "var(--ds-background-neutral, ".concat(_colors.N20, ")");
+// TODO: https://product-fabric.atlassian.net/browse/DSP-4461
 exports.tableFloatingControlsColor = tableFloatingControlsColor;
 var tableCellSelectedColor = "var(--ds-blanket-selected, rgba(179, 212, 255, 0.3))";
 exports.tableCellSelectedColor = tableCellSelectedColor;

package/dist/cjs/plugins/table/ui/messages.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _reactIntlNext = require("react-intl-next");
-
 var _default = (0, _reactIntlNext.defineMessages)({
   insertColumn: {
     id: 'fabric.editor.insertColumn',
@@ -59,5 +57,4 @@ var _default = (0, _reactIntlNext.defineMessages)({
     description: 'Title text for confirm modal when deleting an extension linked to a data consumer.'
   }
 });
-
 exports.default = _default;

package/dist/cjs/plugins/table/ui/ui-styles.js

@@ -1,103 +1,71 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.resizeHandle = exports.insertRowButtonWrapper = exports.insertColumnButtonWrapper = exports.hoveredWarningCell = exports.hoveredDeleteButton = exports.hoveredCell = exports.columnControlsLineMarker = exports.columnControlsDecoration = exports.OverflowShadow = exports.InsertMarker = exports.HeaderButtonHover = exports.HeaderButtonDanger = exports.HeaderButton = exports.DeleteButton = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = require("@emotion/react");
-
 var _styles = require("@atlaskit/editor-common/styles");
-
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _consts = require("./consts");
-
 var _types = require("../types");
-
 var _constants = require("@atlaskit/theme/constants");
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
-
 var InsertLine = function InsertLine(cssString) {
   return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    background: ", ";\n    display: none;\n    position: absolute;\n    z-index: ", ";\n    ", "\n  }\n"])), _types.TableCssClassName.CONTROLS_INSERT_LINE, _consts.tableBorderSelectedColor, _editorSharedStyles.akEditorUnitZIndex, cssString);
 };
-
 var Marker = function Marker(props) {
   return (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n  position: absolute;\n  height: ", "px;\n  width: ", "px;\n  border-radius: 50%;\n  pointer-events: none;\n"])), (0, _consts.tableBorderColor)(props), _consts.lineMarkerSize, _consts.lineMarkerSize);
 };
-
 var InsertMarker = function InsertMarker(props, cssString) {
   return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    ", ";\n    ", "\n  }\n"])), _types.TableCssClassName.CONTROLS_INSERT_MARKER, Marker(props), cssString);
 };
-
 exports.InsertMarker = InsertMarker;
-
 var Button = function Button(cssString) {
   return (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  border-radius: ", "px;\n  border-width: 0px;\n  display: inline-flex;\n  max-width: 100%;\n  text-align: center;\n  margin: 0px;\n  padding: 0px;\n  text-decoration: none;\n  transition: background 0.1s ease-out 0s,\n    box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\n  outline: none !important;\n  cursor: none;\n\n  > .", " {\n    display: inline-flex;\n    max-height: 100%;\n    max-width: 100%;\n  }\n  ", "\n"])), (0, _constants.borderRadius)(), _types.TableCssClassName.CONTROLS_BUTTON_ICON, cssString);
 };
-
 var HeaderButton = function HeaderButton(props, cssString) {
   return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    background: ", ";\n    border: 1px solid ", ";\n    display: block;\n    box-sizing: border-box;\n    padding: 0;\n\n    :focus {\n      outline: none;\n    }\n    ", "\n  }\n\n  .", "::after {\n    content: ' ';\n    background-color: transparent;\n    left: -15px;\n    top: 0;\n    position: absolute;\n    width: 15px;\n    height: 100%;\n    z-index: 1;\n  }\n\n  .active .", " {\n    color: ", ";\n    background-color: ", ";\n    border-color: ", ";\n  }\n"])), _types.TableCssClassName.CONTROLS_BUTTON, (0, _consts.tableToolbarColor)(props), (0, _consts.tableBorderColor)(props), cssString, _types.TableCssClassName.ROW_CONTROLS_BUTTON, _types.TableCssClassName.CONTROLS_BUTTON, "var(--ds-icon-inverse, ".concat(_colors.N0, ")"), "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _consts.tableBorderSelectedColor);
 };
-
 exports.HeaderButton = HeaderButton;
-
 var HeaderButtonHover = function HeaderButtonHover() {
   return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  .", ":hover {\n    color: ", ";\n    background-color: ", ";\n    border-color: ", ";\n    cursor: pointer;\n  }\n"])), _types.TableCssClassName.CONTROLS_BUTTON, "var(--ds-icon-inverse, ".concat(_colors.N0, ")"), "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _consts.tableBorderSelectedColor);
 };
-
 exports.HeaderButtonHover = HeaderButtonHover;
-
 var HeaderButtonDanger = function HeaderButtonDanger() {
   return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  .", " .", " {\n    background-color: ", ";\n    border-color: ", ";\n    position: relative;\n    z-index: ", ";\n  }\n"])), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.CONTROLS_BUTTON, "var(--ds-background-danger, ".concat(_consts.tableToolbarDeleteColor, ")"), _consts.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex);
 };
-
 exports.HeaderButtonDanger = HeaderButtonDanger;
-
 var InsertButton = function InsertButton() {
   return (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    position: absolute;\n    z-index: ", ";\n    bottom: 0;\n  }\n  .", ",\n    .", " {\n    height: ", "px;\n    width: ", "px;\n  }\n  .", " {\n    ", "\n  }\n  .", " {\n    display: none;\n  }\n  &:hover .", " {\n    display: flex;\n  }\n"])), _types.TableCssClassName.CONTROLS_INSERT_BUTTON_INNER, _editorSharedStyles.akEditorUnitZIndex + 10, _types.TableCssClassName.CONTROLS_INSERT_BUTTON_INNER, _types.TableCssClassName.CONTROLS_INSERT_BUTTON, _consts.tableInsertColumnButtonSize, _consts.tableInsertColumnButtonSize, _types.TableCssClassName.CONTROLS_INSERT_BUTTON, Button("\n      background: ".concat("var(--ds-surface-overlay, white)", ";\n      box-shadow: ", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N60A, ", 0 0 1px ").concat(_colors.N60A), ")"), ";\n      color: ", "var(--ds-icon, ".concat(_colors.N300, ")"), ";\n    ")), _types.TableCssClassName.CONTROLS_INSERT_LINE, _types.TableCssClassName.CONTROLS_INSERT_LINE);
 };
-
 var InsertButtonHover = function InsertButtonHover() {
   return (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  .", ":hover {\n    background: ", ";\n    color: ", ";\n    cursor: pointer;\n  }\n"])), _types.TableCssClassName.CONTROLS_INSERT_BUTTON, "var(--ds-background-brand-bold, ".concat(_colors.B300, ")"), "var(--ds-icon-inverse, white)");
 };
-
 var insertColumnButtonWrapper = (0, _react.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n  ", "\n"])), InsertButton(), InsertButtonHover(), InsertLine("\n    width: 2px;\n    left: 9px;\n  "));
 exports.insertColumnButtonWrapper = insertColumnButtonWrapper;
 var insertRowButtonWrapper = (0, _react.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n  ", "\n"])), InsertButton(), InsertButtonHover(), InsertLine("\n    height: 2px;\n    top: -11px;\n    left: ".concat(_consts.tableInsertColumnButtonSize - 1, "px;\n  ")));
 exports.insertRowButtonWrapper = insertRowButtonWrapper;
-
 var columnControlsLineMarker = function columnControlsLineMarker(props) {
   return (0, _react.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  .", ".", "\n    table\n    tr:first-of-type\n    td,\n  .", ".", "\n    table\n    tr:first-of-type\n    th {\n    position: relative;\n  }\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS);
 };
-
 exports.columnControlsLineMarker = columnControlsLineMarker;
 var DeleteButton = (0, _react.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n  .", ",\n    .", " {\n    height: ", "px;\n    width: ", "px;\n  }\n  .", " {\n    .", " {\n      ", "\n    }\n  }\n\n  .", ":hover {\n    background: ", ";\n    color: ", ";\n    cursor: pointer;\n  }\n"])), _types.TableCssClassName.CONTROLS_DELETE_BUTTON_WRAP, _types.TableCssClassName.CONTROLS_DELETE_BUTTON, _consts.tableDeleteButtonSize, _consts.tableDeleteButtonSize, _types.TableCssClassName.CONTROLS_DELETE_BUTTON_WRAP, _types.TableCssClassName.CONTROLS_DELETE_BUTTON, Button("\n        background: ".concat("var(--ds-background-neutral, ".concat(_colors.N20A, ")"), ";\n        color: ", "var(--ds-icon, ".concat(_colors.N300, ")"), ";\n      ")), _types.TableCssClassName.CONTROLS_DELETE_BUTTON, "var(--ds-background-danger-bold, ".concat(_colors.R300, ")"), "var(--ds-icon-inverse, white)");
 exports.DeleteButton = DeleteButton;
-
 var OverflowShadow = function OverflowShadow(props) {
   return (0, _react.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n  .", ", .", " {\n    display: block;\n    height: calc(100% - ", "px);\n    position: absolute;\n    pointer-events: none;\n    top: ", "px;\n    z-index: ", ";\n    width: 8px;\n  }\n  .", " {\n    background: linear-gradient(\n        to left,\n        transparent 0,\n        ", " 100%\n      ),\n      linear-gradient(\n        to right,\n        ", " 0px,\n        transparent 1px\n      );\n    left: 0px;\n  }\n  .", "[data-number-column='true'] > :not(.", ").", " {\n    left: ", "px;\n  }\n  .", " {\n    background: linear-gradient(\n        to right,\n        transparent 0,\n        ", " 100%\n      ),\n      linear-gradient(\n        to left,\n        ", " 0px,\n        transparent 1px\n      );\n    left: calc(100% + 2px);\n  }\n  .", " {\n    .", ", .", " {\n      height: calc(100% - ", "px);\n      top: ", "px;\n    }\n    .", " {\n      border-left: 1px solid ", ";\n    }\n  }\n"])), _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.TABLE_LEFT_SHADOW, _styles.tableMarginTop + _styles.tableMarginBottom, _styles.tableMarginTop, _editorSharedStyles.akEditorShadowZIndex, _types.TableCssClassName.TABLE_LEFT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(_colors.N40A, ")"), "var(--ds-shadow-overflow-perimeter, transparent)", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_STICKY_SHADOW, _types.TableCssClassName.TABLE_LEFT_SHADOW, _editorSharedStyles.akEditorTableNumberColumnWidth - 1, _types.TableCssClassName.TABLE_RIGHT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(_colors.N40A, ")"), "var(--ds-shadow-overflow-perimeter, transparent)", _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.TABLE_LEFT_SHADOW, _styles.tableMarginTop + _styles.tableMarginBottom, _styles.tableMarginTop, _types.TableCssClassName.TABLE_LEFT_SHADOW, (0, _consts.tableBorderColor)(props));
 };
-
 exports.OverflowShadow = OverflowShadow;
-
 var columnHeaderButton = function columnHeaderButton(props, cssString) {
   return (0, _react.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  border: 1px solid ", ";\n  display: block;\n  box-sizing: border-box;\n  padding: 0;\n\n  :focus {\n    outline: none;\n  }\n\n  ", "\n"])), (0, _consts.tableToolbarColor)(props), (0, _consts.tableBorderColor)(props), cssString);
 };
-
 var columnHeaderButtonSelected = (0, _react.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  background-color: ", ";\n  border-color: ", ";\n  z-index: ", ";\n"])), "var(--ds-text-inverse, ".concat(_colors.N0, ")"), "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _consts.tableBorderSelectedColor, _consts.columnControlsSelectedZIndex);
-
 var columnControlsDecoration = function columnControlsDecoration(props) {
   return (0, _react.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    display: none;\n    cursor: pointer;\n    position: absolute;\n    width: calc(100% + ", "px);\n    left: -1px;\n    top: -", "px;\n    height: ", "px;\n\n    &::before {\n      content: ' ';\n      background-color: ", ";\n      position: absolute;\n      height: ", "px;\n      width: ", "px;\n      border-radius: 50%;\n      pointer-events: none;\n      top: 2px;\n      right: -1px;\n    }\n\n    &::after {\n      content: ' ';\n\n      ", "\n    }\n  }\n\n  div.", ">.", "::after {\n    content: ' ';\n    background-color: ", ";\n    position: absolute;\n    height: ", "px;\n    width: ", "px;\n    border-radius: 50%;\n    pointer-events: none;\n    top: -", "px;\n    right: -1px;\n  }\n\n  .", " .", " {\n    display: block;\n  }\n\n  table\n    tr:first-of-type\n    td.", ",\n    table\n    tr:first-of-type\n    th.", " {\n    &.", ",\n      &.", ",\n      &.", " {\n      .", "::after {\n        ", ";\n      }\n\n      &.", "\n        .", "::after {\n        background-color: ", ";\n        border: 1px solid ", ";\n        border-bottom: none;\n        z-index: ", ";\n      }\n    }\n  }\n\n  .", "\n    table\n    tr:first-of-type\n    td.", ",\n    .", "\n    table\n    tr:first-of-type\n    th.", " {\n    .", "::after {\n      ", ";\n    }\n  }\n"])), _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _styles.tableCellBorderWidth * 2, _consts.columnControlsDecorationHeight + _styles.tableCellBorderWidth, _consts.columnControlsDecorationHeight, (0, _consts.tableBorderColor)(props), _consts.lineMarkerSize, _consts.lineMarkerSize, columnHeaderButton(props, "\n        border-right: ".concat(_styles.tableCellBorderWidth, "px solid ").concat((0, _consts.tableBorderColor)(props), ";\n        border-bottom: none;\n        height: ").concat(_consts.tableToolbarSize, "px;\n        width: 100%;\n        position: absolute;\n        top: ").concat(_consts.columnControlsDecorationHeight - _consts.tableToolbarSize, "px;\n        left: 0px;\n        z-index: ").concat(_consts.columnControlsZIndex, ";\n      ")), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, (0, _consts.tableBorderColor)(props), _consts.lineMarkerSize, _consts.lineMarkerSize, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_COLUMN, _types.TableCssClassName.HOVERED_TABLE, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, "var(--ds-background-danger, ".concat(_consts.tableToolbarDeleteColor, ")"), _consts.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected);
 };
-
 exports.columnControlsDecoration = columnControlsDecoration;
 var hoveredDeleteButton = (0, _react.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n  .", ".", " {\n    .", ",\n      .", ",\n      .", " {\n      border: 1px solid ", ";\n    }\n    .", "::after {\n      background: ", ";\n    }\n  }\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.HOVERED_DELETE_BUTTON, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_CELL, _consts.tableBorderDeleteColor, _types.TableCssClassName.SELECTED_CELL, _consts.tableCellDeleteColor);
 exports.hoveredDeleteButton = hoveredDeleteButton;

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

@@ -6,23 +6,18 @@ Object.defineProperty(exports, "__esModule", {
 exports.getSelectedCellInfo = getSelectedCellInfo;
 exports.getSelectedTableInfo = getSelectedTableInfo;
 exports.withEditorAnalyticsAPI = void 0;
-
 var _tableMap = require("@atlaskit/editor-tables/table-map");
-
 var _utils = require("@atlaskit/editor-tables/utils");
-
 function getSelectedTableInfo(selection) {
   var map;
   var totalRowCount = 0;
   var totalColumnCount = 0;
   var table = (0, _utils.findTable)(selection);
-
   if (table) {
     map = _tableMap.TableMap.get(table.node);
     totalRowCount = map.height;
     totalColumnCount = map.width;
   }
-
   return {
     table: table,
     map: map,
@@ -30,28 +25,23 @@ function getSelectedTableInfo(selection) {
     totalColumnCount: totalColumnCount
   };
 }
-
 function getSelectedCellInfo(selection) {
   var horizontalCells = 1;
   var verticalCells = 1;
   var totalCells = 1;
-
   var _getSelectedTableInfo = getSelectedTableInfo(selection),
-      table = _getSelectedTableInfo.table,
-      map = _getSelectedTableInfo.map,
-      totalRowCount = _getSelectedTableInfo.totalRowCount,
-      totalColumnCount = _getSelectedTableInfo.totalColumnCount;
-
+    table = _getSelectedTableInfo.table,
+    map = _getSelectedTableInfo.map,
+    totalRowCount = _getSelectedTableInfo.totalRowCount,
+    totalColumnCount = _getSelectedTableInfo.totalColumnCount;
   if (table && map) {
     var rect = (0, _utils.getSelectionRect)(selection);
-
     if (rect) {
       totalCells = map.cellsInRect(rect).length;
       horizontalCells = rect.right - rect.left;
       verticalCells = rect.bottom - rect.top;
     }
   }
-
   return {
     totalRowCount: totalRowCount,
     totalColumnCount: totalColumnCount,
@@ -60,27 +50,22 @@ function getSelectedCellInfo(selection) {
     totalCells: totalCells
   };
 }
-
 var withEditorAnalyticsAPI = function withEditorAnalyticsAPI(payload) {
   return function (editorAnalyticsAPI) {
     return function (command) {
       return function (state, dispatch, view) {
         return command(state, function (tr) {
           var dynamicPayload = payload instanceof Function ? payload(state) : payload;
-
           if (dynamicPayload) {
             editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent(dynamicPayload)(tr);
           }
-
           if (dispatch) {
             dispatch(tr);
           }
-
           return true;
         }, view);
       };
     };
   };
 };
-
 exports.withEditorAnalyticsAPI = withEditorAnalyticsAPI;

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

@@ -4,53 +4,41 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.isTableCollapsible = exports.collapseSelectedTable = void 0;
-
 var _prosemirrorModel = require("prosemirror-model");
-
 var _prosemirrorTransform = require("prosemirror-transform");
-
 var _utils = require("@atlaskit/editor-tables/utils");
-
 var bail = function bail() {
   return {
     tableIsCollapsible: false
   };
 };
+
 /**
  * Checks whether we can wrap the selected table into an expand via
  * prosemirror-transform's `findWrapping` helper
  */
-
-
 var isTableCollapsible = function isTableCollapsible(tr) {
   var selection = tr.selection;
   var schema = tr.doc.type.schema;
   var nodePos = (0, _utils.findTable)(selection);
-
   if (!nodePos) {
     return bail();
   }
-
   var expand = schema.nodes.expand;
   var node = nodePos.node,
-      pos = nodePos.pos;
+    pos = nodePos.pos;
   var $pos = tr.doc.resolve(pos);
   var range = new _prosemirrorModel.NodeRange($pos, tr.doc.resolve(pos + node.nodeSize), $pos.depth);
-
   if (!range) {
     return bail();
   }
-
   var canWrap = (0, _prosemirrorTransform.findWrapping)(range, expand);
-
   if (canWrap === null) {
     return bail();
   }
-
   return {
     tableIsCollapsible: true,
     range: range,
-
     /**
      * Do we ever want to deal with the result of `findWrapping`? Probably not,
      * but we have it anyway.
@@ -58,6 +46,7 @@ var isTableCollapsible = function isTableCollapsible(tr) {
     findWrappingRes: canWrap
   };
 };
+
 /**
  * Collapses the selected table into an expand given a transaction via
  * `Transform.wrap`.
@@ -68,17 +57,14 @@ var isTableCollapsible = function isTableCollapsible(tr) {
  * @param tr
  * @returns Transaction | undefined
  */
-
-
 exports.isTableCollapsible = isTableCollapsible;
-
 var collapseSelectedTable = function collapseSelectedTable(tr) {
   var canCollapse = isTableCollapsible(tr);
   var expand = tr.doc.type.schema.nodes.expand;
-
   if (!canCollapse.range || !canCollapse.tableIsCollapsible) {
     return undefined;
   }
+
   /**
    * TODO: add attrs: { __expanded: false } when
    * - it is working with new collab (CEMS-1204)
@@ -87,12 +73,9 @@ var collapseSelectedTable = function collapseSelectedTable(tr) {
    *   (via confluence-frontend, "this feature" referencing allowInteractiveExpand)
    *   `we can NEVER allow this feature to be enabled for the synchrony-powered editor
    */
-
-
   tr.wrap(canCollapse.range, [{
     type: expand
   }]).setMeta('scrollIntoView', true);
   return tr;
 };
-
 exports.collapseSelectedTable = collapseSelectedTable;

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

@@ -1,46 +1,33 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.isColumnDeleteButtonVisible = exports.getColumnsWidths = exports.getColumnDeleteButtonParams = exports.getColumnClassNames = exports.colWidthsForRow = void 0;
-
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
 var _tableMap = require("@atlaskit/editor-tables/table-map");
-
 var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
-
 var _prosemirrorUtils = require("prosemirror-utils");
-
 var _utils = require("@atlaskit/editor-tables/utils");
-
 var _utils2 = require("@atlaskit/editor-common/utils");
-
 var _types = require("../types");
-
 var _consts = require("../ui/consts");
-
 var getColumnsWidths = function getColumnsWidths(view) {
   var selection = view.state.selection;
   var widths = [];
   var table = (0, _utils.findTable)(selection);
-
   if (table) {
     var map = _tableMap.TableMap.get(table.node);
+    var domAtPos = view.domAtPos.bind(view);
 
-    var domAtPos = view.domAtPos.bind(view); // When there is no cell we need to fill it with undefined
-
+    // When there is no cell we need to fill it with undefined
     widths = Array.from({
       length: map.width
     });
-
     for (var i = 0; i < map.width; i++) {
       var cells = (0, _utils.getCellsInColumn)(i)(selection);
       var cell = cells[0];
-
       if (cell) {
         var cellRef = (0, _prosemirrorUtils.findDomRefAtPos)(cell.pos, domAtPos);
         var rect = cellRef.getBoundingClientRect();
@@ -49,82 +36,63 @@ var getColumnsWidths = function getColumnsWidths(view) {
       }
     }
   }
-
   return widths;
 };
-
 exports.getColumnsWidths = getColumnsWidths;
-
 var isColumnDeleteButtonVisible = function isColumnDeleteButtonVisible(selection) {
   if (!(0, _utils.isTableSelected)(selection) && selection instanceof _cellSelection.CellSelection && selection.isColSelection()) {
     return true;
   }
-
   return false;
 };
-
 exports.isColumnDeleteButtonVisible = isColumnDeleteButtonVisible;
-
 var getColumnDeleteButtonParams = function getColumnDeleteButtonParams(columnsWidths, selection) {
   var rect = (0, _utils.getSelectionRect)(selection);
-
   if (!rect) {
     return null;
   }
-
   var width = 0;
-  var offset = 0; // find the columns before the selection
-
+  var offset = 0;
+  // find the columns before the selection
   for (var i = 0; i < rect.left; i++) {
     var colWidth = columnsWidths[i];
-
     if (colWidth) {
       offset += colWidth - 1;
     }
-  } // these are the selected columns widths
-
-
+  }
+  // these are the selected columns widths
   var indexes = [];
-
   for (var _i = rect.left; _i < rect.right; _i++) {
     var _colWidth = columnsWidths[_i];
-
     if (_colWidth) {
       width += _colWidth;
       indexes.push(_i);
     }
   }
-
   var left = offset + width / 2 - _consts.tableDeleteButtonSize / 2;
   return {
     left: left,
     indexes: indexes
   };
 };
-
 exports.getColumnDeleteButtonParams = getColumnDeleteButtonParams;
-
 var getColumnClassNames = function getColumnClassNames(index, selection) {
   var hoveredColumns = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
   var isInDanger = arguments.length > 3 ? arguments[3] : undefined;
   var isResizing = arguments.length > 4 ? arguments[4] : undefined;
   var classNames = [];
-
   if ((0, _utils.isColumnSelected)(index)(selection) || hoveredColumns.indexOf(index) > -1 && !isResizing) {
     classNames.push(_types.TableCssClassName.HOVERED_CELL_ACTIVE);
-
     if (isInDanger) {
       classNames.push(_types.TableCssClassName.HOVERED_CELL_IN_DANGER);
     }
   }
-
   return classNames.join(' ');
-}; // give a row colspan and a colwidths
-// and map to a row's colwidths
-
+};
 
+// give a row colspan and a colwidths
+// and map to a row's colwidths
 exports.getColumnClassNames = getColumnClassNames;
-
 var mapTableColwidthsToRow = function mapTableColwidthsToRow(rowColSpans, tableColWidths) {
   var curColIdx = 0;
   var colWidths = [];
@@ -137,12 +105,10 @@ var mapTableColwidthsToRow = function mapTableColwidthsToRow(rowColSpans, tableC
   });
   return colWidths;
 };
-
 var getRelativeDomCellWidths = function getRelativeDomCellWidths(_ref) {
   var width = _ref.width,
-      colspan = _ref.colspan,
-      colwidth = _ref.colwidth;
-
+    colspan = _ref.colspan,
+    colwidth = _ref.colwidth;
   // For cells with colSpan 1
   // or
   // for cells in a table with unchanged column widths,
@@ -150,20 +116,22 @@ var getRelativeDomCellWidths = function getRelativeDomCellWidths(_ref) {
   // return equally partitioned total cell width in DOM for each cell.
   if (colspan === 1 || !colwidth) {
     return new Array(colspan).fill(width / colspan);
-  } // For cells that have colSpan > 1 and
+  }
+
+  // For cells that have colSpan > 1 and
   // are part of a table with resized columns
   // return the current total DOM width of the cell multiplied
   // by the percentage of the each individual cell's size.
   // The cell size percentage is calculated using individual colwidth of the cell,
   // from data-colwidth attribute on the cell,
   // divided by the total width of the cells from colwidths for merged cells.
+
   // Ex:
   // colwidth = ‘201,102’
   // Total colWidth = 303
   // returned cellWidths = [303 * (201/303), 303 * (102/303)]
-  // For merged cells we get back colwidth as `201,102`
-
 
+  // For merged cells we get back colwidth as `201,102`
   var cellColWidths = colwidth.split(',').map(function (colwidth) {
     return Number(colwidth);
   });
@@ -174,14 +142,13 @@ var getRelativeDomCellWidths = function getRelativeDomCellWidths(_ref) {
     return width * (cellColWidth / totalCalculatedCellWidth);
   });
 };
-
 var colWidthsForRow = function colWidthsForRow(colGroup, tr) {
   // get the colspans
   var rowColSpans = (0, _utils2.maphElem)(tr, function (cell) {
-    return Number(cell.getAttribute('colspan') || 1
-    /* default to span of 1 */
-    );
-  }); // Chrome has trouble aligning borders with auto tables
+    return Number(cell.getAttribute('colspan') || 1 /* default to span of 1 */);
+  });
+
+  // Chrome has trouble aligning borders with auto tables
   // and the rest of the page grid. tables with defined
   // column widths align fine.
   //
@@ -189,9 +156,7 @@ var colWidthsForRow = function colWidthsForRow(colGroup, tr) {
   //
   // prefer copying the widths via the DOM
   // or inferring from the next row if one exists
-
   var copyTarget = tr.nextElementSibling || tr;
-
   if (copyTarget) {
     // either from the first row while it's still in the table
     var cellInfos = (0, _utils2.maphElem)(copyTarget, function (cell) {
@@ -200,13 +165,13 @@ var colWidthsForRow = function colWidthsForRow(colGroup, tr) {
         colspan: Number(cell.getAttribute('colspan') || 1),
         colwidth: cell.dataset.colwidth
       };
-    }); // reverse engineer cell widths from table widths
+    });
 
+    // reverse engineer cell widths from table widths
     var domBasedCellWidths = [];
     cellInfos.map(function (cell, idx) {
       domBasedCellWidths.push.apply(domBasedCellWidths, (0, _toConsumableArray2.default)(getRelativeDomCellWidths(cell)));
     });
-
     if (cellInfos.reduce(function (acc, cell) {
       return acc + cell.width;
     }, 0) !== 0) {
@@ -215,10 +180,10 @@ var colWidthsForRow = function colWidthsForRow(colGroup, tr) {
         return "".concat(px, "px");
       }).join(' ');
     }
-  } // as a fallback, just calculate a %, and hope that
-  // it aligns perfectly in the user's browser
-
+  }
 
+  // as a fallback, just calculate a %, and hope that
+  // it aligns perfectly in the user's browser
   var visualColCount = rowColSpans.reduce(function (acc, val) {
     return acc + val;
   }, 0);
@@ -229,5 +194,4 @@ var colWidthsForRow = function colWidthsForRow(colGroup, tr) {
     return "".concat(pct, "%");
   }).join(' ');
 };
-
 exports.colWidthsForRow = colWidthsForRow;