@atlaskit/editor-plugin-table 4.0.1 → 4.0.3

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

@@ -1,5 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25;
 import { css } from '@emotion/react';
 import { tableCellBorderWidth, tableMarginTop, tableMarginTopWithControl } from '@atlaskit/editor-common/styles';
 import { akEditorShadowZIndex, akEditorTableNumberColumnWidth, akEditorUnitZIndex } from '@atlaskit/editor-shared-styles';
@@ -51,29 +51,37 @@ export var OverflowShadow = function OverflowShadow(props) {
   return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n  .", ", .", " {\n    display: block;\n    height: calc(100% - ", "px);\n    position: absolute;\n    pointer-events: none;\n    top: ", "px;\n    z-index: ", ";\n    width: ", "px;\n  }\n  .", " {\n    background: linear-gradient(\n        to left,\n        transparent 0,\n        ", "\n          ", "%\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        ", "\n          ", "%\n      ),\n      linear-gradient(\n        to left,\n        ", " 0px,\n        transparent 1px\n      );\n    left: ", ";\n  }\n  .", " {\n    .", ", .", " {\n      height: calc(100% - ", "px);\n      top: ", "px;\n    }\n    .", " {\n      border-left: 1px solid ", ";\n    }\n  }\n"])), ClassName.TABLE_RIGHT_SHADOW, ClassName.TABLE_LEFT_SHADOW, tableMarginTop, tableMarginTop, akEditorShadowZIndex, getBooleanFF('platform.editor.table.increase-shadow-visibility_lh89r') ? tableOverflowShadowWidthWide : tableOverflowShadowWidth, ClassName.TABLE_LEFT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(N40A, ")"), getBooleanFF('platform.editor.table.increase-shadow-visibility_lh89r') ? 140 : 100, "var(--ds-shadow-overflow-perimeter, transparent)", ClassName.TABLE_CONTAINER, ClassName.TABLE_STICKY_SHADOW, ClassName.TABLE_LEFT_SHADOW, akEditorTableNumberColumnWidth - 1, ClassName.TABLE_RIGHT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(N40A, ")"), getBooleanFF('platform.editor.table.increase-shadow-visibility_lh89r') ? 140 : 100, "var(--ds-shadow-overflow-perimeter, transparent)", getBooleanFF('platform.editor.custom-table-width') ? "calc(100% - ".concat(getBooleanFF('platform.editor.table.increase-shadow-visibility_lh89r') ? tableOverflowShadowWidthWide : tableOverflowShadowWidth, "px)") : "calc(100% - ".concat(getBooleanFF('platform.editor.table.increase-shadow-visibility_lh89r') ? tableOverflowShadowWidthWide - 10 : -2, "px)"), ClassName.WITH_CONTROLS, ClassName.TABLE_RIGHT_SHADOW, ClassName.TABLE_LEFT_SHADOW, tableMarginTopWithControl, tableMarginTopWithControl, ClassName.TABLE_LEFT_SHADOW, tableBorderColor(props));
 };
 var columnHeaderButton = function columnHeaderButton(props, cssString) {
-  return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\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"])), tableHeaderCellBackgroundColor(props), tableBorderColor(props), cssString);
+  if (getBooleanFF('platform.editor.table.column-controls-styles-updated')) {
+    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n      background: ", ";\n      display: block;\n      box-sizing: border-box;\n      padding: 0;\n\n      :focus {\n        outline: none;\n      }\n\n      ", "\n    "])), tableHeaderCellBackgroundColor(props), cssString);
+  } else {
+    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\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    "])), tableHeaderCellBackgroundColor(props), tableBorderColor(props), cssString);
+  }
 };
 var columnHeaderButtonSelected = function columnHeaderButtonSelected(props) {
-  return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n  color: ", ";\n  background-color: ", ";\n  border-color: ", ";\n  z-index: ", ";\n"])), "var(--ds-text-inverse, ".concat(N0, ")"), tableToolbarSelectedColor(props), tableBorderSelectedColor(props), columnControlsSelectedZIndex);
+  return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  color: ", ";\n  background-color: ", ";\n  border-color: ", ";\n  z-index: ", ";\n"])), "var(--ds-text-inverse, ".concat(N0, ")"), tableToolbarSelectedColor(props), tableBorderSelectedColor(props), columnControlsSelectedZIndex);
 };
 var getFloatingDotOverrides = function getFloatingDotOverrides(props) {
-  return getBooleanFF('platform.editor.custom-table-width') ? css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n        tr\n          th:last-child\n          .", "::before,\n          tr\n          td:last-child\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: ", ";\n          right: 0px;\n        }\n      "])), ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.COLUMN_CONTROLS_DECORATIONS, tableBorderColor(props), lineMarkerSize, lineMarkerSize, "var(--ds-space-025, 2px)") : '';
+  return getBooleanFF('platform.editor.custom-table-width') ? css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n        tr\n          th:last-child\n          .", "::before,\n          tr\n          td:last-child\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: ", ";\n          right: 0px;\n        }\n      "])), ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.COLUMN_CONTROLS_DECORATIONS, tableBorderColor(props), lineMarkerSize, lineMarkerSize, "var(--ds-space-025, 2px)") : '';
 };
 export var columnControlsDecoration = function columnControlsDecoration(props) {
-  return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\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    // floating dot for adding column button\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  // floating dot for adding column button - overriding style on last column to avoid scroll\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"])), ClassName.COLUMN_CONTROLS_DECORATIONS, tableCellBorderWidth * 2, columnControlsDecorationHeight + tableCellBorderWidth, columnControlsDecorationHeight, tableBorderColor(props), lineMarkerSize, lineMarkerSize, columnHeaderButton(props, "\n        border-right: ".concat(tableCellBorderWidth, "px solid ").concat(tableBorderColor(props), ";\n        border-bottom: none;\n        height: ").concat(tableToolbarSize, "px;\n        width: 100%;\n        position: absolute;\n        top: ").concat(columnControlsDecorationHeight - tableToolbarSize, "px;\n        left: 0px;\n        z-index: ").concat(columnControlsZIndex, ";\n      ")), getFloatingDotOverrides(props), ClassName.WITH_CONTROLS, ClassName.ROW_CONTROLS_WRAPPER, tableBorderColor(props), lineMarkerSize, lineMarkerSize, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_CONTROLS, ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_COLUMN, ClassName.HOVERED_TABLE, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(props), ClassName.HOVERED_CELL_IN_DANGER, ClassName.COLUMN_CONTROLS_DECORATIONS, tableToolbarDeleteColor(props), tableBorderDeleteColor(props), akEditorUnitZIndex * 100, ClassName.TABLE_SELECTED, ClassName.TABLE_CELL, ClassName.TABLE_SELECTED, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(props));
+  if (getBooleanFF('platform.editor.table.column-controls-styles-updated')) {
+    return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n      .", " {\n        display: none;\n        cursor: pointer;\n        position: absolute;\n        width: 100%;\n        left: 0;\n        top: -", "px;\n        height: ", "px;\n        // floating dot for adding column button\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      // floating dot for adding column button - overriding style on last column to avoid scroll\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 tr:first-of-type th.", " {\n        &.", ", &.", " {\n          .", "::after {\n            ", ";\n          }\n\n          &.", "\n            .", "::after {\n            background-color: ", ";\n            border-color: ", ";\n            z-index: ", ";\n          }\n        }\n      }\n\n      table tr:first-of-type th.", " {\n        &.", ", &.", " {\n          .", "::after {\n            ", ";\n            border-left: ", "px solid\n              ", ";\n            left: -", "px;\n          }\n        }\n      }\n\n      table tr:first-of-type th.", " {\n        &.", " {\n          .", "::after {\n            ", ";\n          }\n\n          &.", "\n            .", "::after {\n            background-color: ", ";\n            border-color: ", ";\n            border-left: ", "px solid\n              ", ";\n            left: -", "px;\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    "])), ClassName.COLUMN_CONTROLS_DECORATIONS, columnControlsDecorationHeight + tableCellBorderWidth, columnControlsDecorationHeight, tableBorderColor(props), lineMarkerSize, lineMarkerSize, columnHeaderButton(props, "\n        border-right: ".concat(tableCellBorderWidth, "px solid ").concat(tableBorderColor(props), ";\n        border-top: ").concat(tableCellBorderWidth, "px solid ").concat(tableBorderColor(props), ";\n        border-bottom: ").concat(tableCellBorderWidth, "px solid ").concat(tableBorderColor(props), ";\n        box-sizing: content-box;\n        height: ").concat(tableToolbarSize - 1, "px;\n        width: 100%;\n        position: absolute;\n        top: ").concat(columnControlsDecorationHeight - tableToolbarSize, "px;\n        left: 0px;\n        z-index: ").concat(columnControlsZIndex, ";\n      ")), getFloatingDotOverrides(props), ClassName.WITH_CONTROLS, ClassName.ROW_CONTROLS_WRAPPER, tableBorderColor(props), lineMarkerSize, lineMarkerSize, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_CONTROLS, ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_TABLE, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(props), ClassName.HOVERED_CELL_IN_DANGER, ClassName.COLUMN_CONTROLS_DECORATIONS, tableToolbarDeleteColor(props), tableBorderDeleteColor(props), akEditorUnitZIndex * 100, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_COLUMN, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(props), tableCellBorderWidth, tableBorderSelectedColor(props), tableCellBorderWidth, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_COLUMN, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(props), ClassName.HOVERED_CELL_IN_DANGER, ClassName.COLUMN_CONTROLS_DECORATIONS, tableToolbarDeleteColor(props), tableBorderDeleteColor(props), tableCellBorderWidth, tableBorderDeleteColor(props), tableCellBorderWidth, akEditorUnitZIndex * 100, ClassName.TABLE_SELECTED, ClassName.TABLE_CELL, ClassName.TABLE_SELECTED, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(props));
+  } else {
+    return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\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        // floating dot for adding column button\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      // floating dot for adding column button - overriding style on last column to avoid scroll\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    "])), ClassName.COLUMN_CONTROLS_DECORATIONS, tableCellBorderWidth * 2, columnControlsDecorationHeight + tableCellBorderWidth, columnControlsDecorationHeight, tableBorderColor(props), lineMarkerSize, lineMarkerSize, columnHeaderButton(props, "\n        border-right: ".concat(tableCellBorderWidth, "px solid ").concat(tableBorderColor(props), ";\n        border-bottom: none;\n        height: ").concat(tableToolbarSize, "px;\n        width: 100%;\n        position: absolute;\n        top: ").concat(columnControlsDecorationHeight - tableToolbarSize, "px;\n        left: 0px;\n        z-index: ").concat(columnControlsZIndex, ";\n      ")), getFloatingDotOverrides(props), ClassName.WITH_CONTROLS, ClassName.ROW_CONTROLS_WRAPPER, tableBorderColor(props), lineMarkerSize, lineMarkerSize, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_CONTROLS, ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_COLUMN, ClassName.HOVERED_TABLE, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(props), ClassName.HOVERED_CELL_IN_DANGER, ClassName.COLUMN_CONTROLS_DECORATIONS, tableToolbarDeleteColor(props), tableBorderDeleteColor(props), akEditorUnitZIndex * 100, ClassName.TABLE_SELECTED, ClassName.TABLE_CELL, ClassName.TABLE_SELECTED, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(props));
+  }
 };
 export var hoveredDeleteButton = function hoveredDeleteButton(props) {
-  return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n  .", ".", " {\n    .", ",\n      .", ",\n      .", " {\n      border: 1px solid ", ";\n    }\n    .", "::after {\n      background: ", ";\n    }\n  }\n"])), ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.SELECTED_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_CELL, tableBorderDeleteColor(props), ClassName.SELECTED_CELL, tableCellDeleteColor(props));
+  return css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n  .", ".", " {\n    .", ",\n      .", ",\n      .", " {\n      border: 1px solid ", ";\n    }\n    .", "::after {\n      background: ", ";\n    }\n  }\n"])), ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.SELECTED_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_CELL, tableBorderDeleteColor(props), ClassName.SELECTED_CELL, tableCellDeleteColor(props));
 };
 export var hoveredCell = function hoveredCell(props) {
-  return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n  :not(.", ")\n    .", ":not(.", ") {\n    .", " {\n      position: relative;\n      border: 1px solid ", ";\n    }\n  }\n"])), ClassName.IS_RESIZING, ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.HOVERED_CELL, tableBorderSelectedColor(props));
+  return css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n  :not(.", ")\n    .", ":not(.", ") {\n    .", " {\n      position: relative;\n      border: 1px solid ", ";\n    }\n  }\n"])), ClassName.IS_RESIZING, ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.HOVERED_CELL, tableBorderSelectedColor(props));
 };
-export var hoveredWarningCell = css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n  :not(.", ")\n    .", ":not(.", ") {\n    td.", " {\n      background-color: ", " !important; // We need to override the background-color added to the cell\n      border: 1px solid ", ";\n    }\n  }\n"])), ClassName.IS_RESIZING, ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.HOVERED_CELL_WARNING, "var(--ds-background-warning, ".concat(Y50, ")"), "var(--ds-border-warning, ".concat(Y200, ")"));
+export var hoveredWarningCell = css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n  :not(.", ")\n    .", ":not(.", ") {\n    td.", " {\n      background-color: ", " !important; // We need to override the background-color added to the cell\n      border: 1px solid ", ";\n    }\n  }\n"])), ClassName.IS_RESIZING, ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.HOVERED_CELL_WARNING, "var(--ds-background-warning, ".concat(Y50, ")"), "var(--ds-border-warning, ".concat(Y200, ")"));
 
 // move the resize handle zone completely inside the table cell to avoid overflow
 var getLastColumnResizerOverrides = function getLastColumnResizerOverrides() {
-  return getBooleanFF('platform.editor.custom-table-width') ? css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n        tr\n          th:last-child\n          .", ",\n          tr\n          td:last-child\n          .", " {\n          background-color: transparent;\n          position: absolute;\n          width: ", "px;\n          height: 100%;\n          top: 0;\n          right: 0;\n          cursor: col-resize;\n          z-index: ", ";\n        }\n      "])), ClassName.RESIZE_HANDLE_DECORATION, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth / 2, resizeHandlerZIndex) : '';
+  return getBooleanFF('platform.editor.custom-table-width') ? css(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n        tr\n          th:last-child\n          .", ",\n          tr\n          td:last-child\n          .", " {\n          background-color: transparent;\n          position: absolute;\n          width: ", "px;\n          height: 100%;\n          top: 0;\n          right: 0;\n          cursor: col-resize;\n          z-index: ", ";\n        }\n      "])), ClassName.RESIZE_HANDLE_DECORATION, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth / 2, resizeHandlerZIndex) : '';
 };
 export var resizeHandle = function resizeHandle(props) {
-  return css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n  .", " {\n    .", " {\n      background-color: transparent;\n      position: absolute;\n      width: ", "px;\n      height: 100%;\n      top: 0;\n      right: -", "px;\n      cursor: col-resize;\n      z-index: ", ";\n    }\n\n    ", "\n\n    td.", "::before {\n      content: ' ';\n      position: absolute;\n      left: ", ";\n      top: -1px;\n      width: ", "px;\n      height: calc(100% + 2px);\n      background-color: ", ";\n      z-index: ", ";\n    }\n\n    th.", "::before {\n      content: ' ';\n      left: ", ";\n      position: absolute;\n      width: ", "px;\n      height: calc(100% + ", "px);\n      background-color: ", ";\n      z-index: ", ";\n      top: -", "px;\n    }\n\n    td.", "::before {\n      content: ' ';\n      position: absolute;\n      right: -1px;\n      top: -1px;\n      width: ", "px;\n      height: calc(100% + 2px);\n      background-color: ", ";\n      z-index: ", ";\n    }\n\n    th.", "::before {\n      content: ' ';\n      right: -1px;\n      position: absolute;\n      width: ", "px;\n      height: calc(100% + ", "px);\n      background-color: ", ";\n      z-index: ", ";\n      top: -", "px;\n    }\n\n    table\n      tr:first-of-type\n      th.", "\n      .", "::after,\n      table\n      tr:first-of-type\n      td.", "\n      .", "::after {\n      top: -", "px;\n      height: calc(100% + ", "px);\n    }\n  }\n"])), ClassName.TABLE_CONTAINER, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth, resizeHandlerAreaWidth / 2, resizeHandlerZIndex, getLastColumnResizerOverrides(), ClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableToolbarSize + tableCellBorderWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableToolbarSize + tableCellBorderWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, tableToolbarSize + tableCellBorderWidth, tableToolbarSize + tableCellBorderWidth);
+  return css(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n  .", " {\n    .", " {\n      background-color: transparent;\n      position: absolute;\n      width: ", "px;\n      height: 100%;\n      top: 0;\n      right: -", "px;\n      cursor: col-resize;\n      z-index: ", ";\n    }\n\n    ", "\n\n    td.", "::before {\n      content: ' ';\n      position: absolute;\n      left: ", ";\n      top: -1px;\n      width: ", "px;\n      height: calc(100% + 2px);\n      background-color: ", ";\n      z-index: ", ";\n    }\n\n    th.", "::before {\n      content: ' ';\n      left: ", ";\n      position: absolute;\n      width: ", "px;\n      height: calc(100% + ", "px);\n      background-color: ", ";\n      z-index: ", ";\n      top: -", "px;\n    }\n\n    td.", "::before {\n      content: ' ';\n      position: absolute;\n      right: -1px;\n      top: -1px;\n      width: ", "px;\n      height: calc(100% + 2px);\n      background-color: ", ";\n      z-index: ", ";\n    }\n\n    th.", "::before {\n      content: ' ';\n      right: -1px;\n      position: absolute;\n      width: ", "px;\n      height: calc(100% + ", "px);\n      background-color: ", ";\n      z-index: ", ";\n      top: -", "px;\n    }\n\n    table\n      tr:first-of-type\n      th.", "\n      .", "::after,\n      table\n      tr:first-of-type\n      td.", "\n      .", "::after {\n      top: -", "px;\n      height: calc(100% + ", "px);\n    }\n  }\n"])), ClassName.TABLE_CONTAINER, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth, resizeHandlerAreaWidth / 2, resizeHandlerZIndex, getLastColumnResizerOverrides(), ClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableToolbarSize + tableCellBorderWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableToolbarSize + tableCellBorderWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, tableToolbarSize + tableCellBorderWidth, tableToolbarSize + tableCellBorderWidth);
 };

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

@@ -53,7 +53,7 @@ export var withEditorAnalyticsAPI = function withEditorAnalyticsAPI(payload) {
         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);
+            editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(dynamicPayload)(tr);
           }
           if (dispatch) {
             dispatch(tr);

package/dist/esm/plugins/table/utils/dom.js

@@ -91,7 +91,7 @@ export var getMousePositionHorizontalRelativeByElement = function getMousePositi
     var width, x;
     var closestCell = element.closest(SELECTOR_TABLE_LEAFS);
     var id = (_closestCell$id = closestCell === null || closestCell === void 0 ? void 0 : closestCell.id) !== null && _closestCell$id !== void 0 ? _closestCell$id : '';
-    width = (_elementContentRects$ = elementContentRects === null || elementContentRects === void 0 ? void 0 : (_elementContentRects$2 = elementContentRects[id]) === null || _elementContentRects$2 === void 0 ? void 0 : _elementContentRects$2.width) !== null && _elementContentRects$ !== void 0 ? _elementContentRects$ : 0;
+    width = (_elementContentRects$ = elementContentRects === null || elementContentRects === void 0 || (_elementContentRects$2 = elementContentRects[id]) === null || _elementContentRects$2 === void 0 ? void 0 : _elementContentRects$2.width) !== null && _elementContentRects$ !== void 0 ? _elementContentRects$ : 0;
     x = mouseEvent.offsetX;
     if (width <= 0) {
       return null;

package/dist/esm/plugins/table/utils/paste.js

@@ -57,7 +57,7 @@ export var transformSliceToFixHardBreakProblemOnCopyFromCell = function transfor
   return slice;
 };
 export var transformSliceToRemoveOpenTable = function transformSliceToRemoveOpenTable(slice, schema) {
-  var _slice$content$firstC6;
+  var _slice$content$firstC2;
   // we're removing the table, tableRow and tableCell reducing the open depth by 3
   var depthDecrement = 3;
 
@@ -67,14 +67,14 @@ export var transformSliceToRemoveOpenTable = function transformSliceToRemoveOpen
   slice.openStart >= 4 && slice.openEnd >= 4 &&
   // slice is a table node
   slice.content.childCount === 1 && slice.content.firstChild.type === schema.nodes.table) {
-    var _slice$content$firstC, _slice$content$firstC2, _slice$content$firstC3, _slice$content$firstC4, _slice$content$firstC5;
+    var _slice$content$firstC;
     // prosemirror-view has a bug that it duplicates table entry when selecting multiple paragraphs in a table cell.
     // https://github.com/ProseMirror/prosemirror/issues/1270
     // The structure becomes
     // table(genuine) > tableRow(genuine) > table(duplicated) > tableRow(duplicated) > tableCell/tableHeader(genuine) > contents(genuine)
     // As we are removing wrapping table anyway, we keep duplicated table and tableRow for simplicity
     var cleaned = slice;
-    if (((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : (_slice$content$firstC2 = _slice$content$firstC.content) === null || _slice$content$firstC2 === void 0 ? void 0 : (_slice$content$firstC3 = _slice$content$firstC2.firstChild) === null || _slice$content$firstC3 === void 0 ? void 0 : (_slice$content$firstC4 = _slice$content$firstC3.content) === null || _slice$content$firstC4 === void 0 ? void 0 : (_slice$content$firstC5 = _slice$content$firstC4.firstChild) === null || _slice$content$firstC5 === void 0 ? void 0 : _slice$content$firstC5.type) === schema.nodes.table) {
+    if (((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 || (_slice$content$firstC = _slice$content$firstC.content) === null || _slice$content$firstC === void 0 || (_slice$content$firstC = _slice$content$firstC.firstChild) === null || _slice$content$firstC === void 0 || (_slice$content$firstC = _slice$content$firstC.content) === null || _slice$content$firstC === void 0 || (_slice$content$firstC = _slice$content$firstC.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) === schema.nodes.table) {
       cleaned = new Slice(slice.content.firstChild.content.firstChild.content, slice.openStart - 2, slice.openEnd - 2);
     }
     return new Slice(flatmap(cleaned.content, unwrapContentFromTable), cleaned.openStart - depthDecrement, cleaned.openEnd - depthDecrement);
@@ -85,7 +85,7 @@ export var transformSliceToRemoveOpenTable = function transformSliceToRemoveOpen
   // starts inside of a cell but ends outside of the starting table
   slice.openStart >= 4 &&
   // slice starts from a table node (and spans across more than one node)
-  slice.content.childCount > 1 && ((_slice$content$firstC6 = slice.content.firstChild) === null || _slice$content$firstC6 === void 0 ? void 0 : _slice$content$firstC6.type) === schema.nodes.table) {
+  slice.content.childCount > 1 && ((_slice$content$firstC2 = slice.content.firstChild) === null || _slice$content$firstC2 === void 0 ? void 0 : _slice$content$firstC2.type) === schema.nodes.table) {
     // repoint the slice's cutting depth so that cell content where the slice starts
     // does not get lifted out of the cell on paste
     return new Slice(slice.content, 1, slice.openEnd);

package/dist/types/plugins/table/commands/sort.d.ts

@@ -1,3 +1,3 @@
-import { TableSortOrder as SortOrder } from '@atlaskit/adf-schema/steps';
-import { Command } from '@atlaskit/editor-common/types';
+import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
+import type { Command } from '@atlaskit/editor-common/types';
 export declare const sortByColumn: (columnIndex: number, order?: SortOrder) => Command;

package/dist/types/plugins/table/commands-with-analytics.d.ts

@@ -1,10 +1,10 @@
-import { TableSortOrder as SortOrder } from '@atlaskit/adf-schema/steps';
+import type { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { Command, GetEditorContainerWidth } from '@atlaskit/editor-common/types';
-import { Rect } from '@atlaskit/editor-tables/table-map';
-import { ResizeStateWithAnalytics } from './pm-plugins/table-resizing/utils';
-import { InsertRowMethods, InsertRowOptions, RowInsertPosition } from './types';
+import type { Rect } from '@atlaskit/editor-tables/table-map';
+import type { ResizeStateWithAnalytics } from './pm-plugins/table-resizing/utils';
+import type { InsertRowMethods, InsertRowOptions, RowInsertPosition } from './types';
 export declare const emptyMultipleCellsWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.CONTEXT_MENU | INPUT_METHOD.KEYBOARD | INPUT_METHOD.FLOATING_TB, targetCellPosition?: number) => Command;
 export declare const mergeCellsWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | null | undefined) => (inputMethod: INPUT_METHOD.CONTEXT_MENU | INPUT_METHOD.FLOATING_TB) => Command;
 export declare const splitCellWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.CONTEXT_MENU | INPUT_METHOD.FLOATING_TB) => Command;

package/dist/types/plugins/table/handlers.d.ts

@@ -1,3 +1,3 @@
-import { ReadonlyTransaction, Transaction } from '@atlaskit/editor-prosemirror/state';
-import { TablePluginState } from './types';
+import type { ReadonlyTransaction, Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { TablePluginState } from './types';
 export declare const handleDocOrSelectionChanged: (tr: Transaction | ReadonlyTransaction, pluginState: TablePluginState) => TablePluginState;

package/dist/types/plugins/table/nodeviews/TableComponent.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { TableColumnOrdering } from '@atlaskit/adf-schema/steps';
+import type { TableColumnOrdering } from '@atlaskit/custom-steps';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { EditorContainerWidth, GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
 import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';

package/dist/types/plugins/table/types.d.ts

@@ -1,6 +1,6 @@
 import type { IntlShape } from 'react-intl-next';
 import type { TableLayout } from '@atlaskit/adf-schema';
-import type { TableColumnOrdering } from '@atlaskit/adf-schema/steps';
+import type { TableColumnOrdering } from '@atlaskit/custom-steps';
 import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';

package/dist/types/plugins/table/ui/TableFloatingControls/index.d.ts

@@ -1,9 +1,9 @@
 import { Component } from 'react';
-import type { TableColumnOrdering } from '@atlaskit/adf-schema/steps';
+import type { TableColumnOrdering } from '@atlaskit/custom-steps';
 import type { GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
-import { Selection } from '@atlaskit/editor-prosemirror/state';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
-import { RowStickyState } from '../../pm-plugins/sticky-headers';
+import type { Selection } from '@atlaskit/editor-prosemirror/state';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { RowStickyState } from '../../pm-plugins/sticky-headers';
 export interface Props {
     editorView: EditorView;
     getEditorFeatureFlags: GetEditorFeatureFlags;

package/dist/types-ts4.5/plugins/table/commands/sort.d.ts

@@ -1,3 +1,3 @@
-import { TableSortOrder as SortOrder } from '@atlaskit/adf-schema/steps';
-import { Command } from '@atlaskit/editor-common/types';
+import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
+import type { Command } from '@atlaskit/editor-common/types';
 export declare const sortByColumn: (columnIndex: number, order?: SortOrder) => Command;

package/dist/types-ts4.5/plugins/table/commands-with-analytics.d.ts

@@ -1,10 +1,10 @@
-import { TableSortOrder as SortOrder } from '@atlaskit/adf-schema/steps';
+import type { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { Command, GetEditorContainerWidth } from '@atlaskit/editor-common/types';
-import { Rect } from '@atlaskit/editor-tables/table-map';
-import { ResizeStateWithAnalytics } from './pm-plugins/table-resizing/utils';
-import { InsertRowMethods, InsertRowOptions, RowInsertPosition } from './types';
+import type { Rect } from '@atlaskit/editor-tables/table-map';
+import type { ResizeStateWithAnalytics } from './pm-plugins/table-resizing/utils';
+import type { InsertRowMethods, InsertRowOptions, RowInsertPosition } from './types';
 export declare const emptyMultipleCellsWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.CONTEXT_MENU | INPUT_METHOD.KEYBOARD | INPUT_METHOD.FLOATING_TB, targetCellPosition?: number) => Command;
 export declare const mergeCellsWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | null | undefined) => (inputMethod: INPUT_METHOD.CONTEXT_MENU | INPUT_METHOD.FLOATING_TB) => Command;
 export declare const splitCellWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.CONTEXT_MENU | INPUT_METHOD.FLOATING_TB) => Command;

package/dist/types-ts4.5/plugins/table/handlers.d.ts

@@ -1,3 +1,3 @@
-import { ReadonlyTransaction, Transaction } from '@atlaskit/editor-prosemirror/state';
-import { TablePluginState } from './types';
+import type { ReadonlyTransaction, Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { TablePluginState } from './types';
 export declare const handleDocOrSelectionChanged: (tr: Transaction | ReadonlyTransaction, pluginState: TablePluginState) => TablePluginState;

package/dist/types-ts4.5/plugins/table/nodeviews/TableComponent.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { TableColumnOrdering } from '@atlaskit/adf-schema/steps';
+import type { TableColumnOrdering } from '@atlaskit/custom-steps';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { EditorContainerWidth, GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
 import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';

package/dist/types-ts4.5/plugins/table/types.d.ts

@@ -1,6 +1,6 @@
 import type { IntlShape } from 'react-intl-next';
 import type { TableLayout } from '@atlaskit/adf-schema';
-import type { TableColumnOrdering } from '@atlaskit/adf-schema/steps';
+import type { TableColumnOrdering } from '@atlaskit/custom-steps';
 import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';

package/dist/types-ts4.5/plugins/table/ui/TableFloatingControls/index.d.ts

@@ -1,9 +1,9 @@
 import { Component } from 'react';
-import type { TableColumnOrdering } from '@atlaskit/adf-schema/steps';
+import type { TableColumnOrdering } from '@atlaskit/custom-steps';
 import type { GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
-import { Selection } from '@atlaskit/editor-prosemirror/state';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
-import { RowStickyState } from '../../pm-plugins/sticky-headers';
+import type { Selection } from '@atlaskit/editor-prosemirror/state';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { RowStickyState } from '../../pm-plugins/sticky-headers';
 export interface Props {
     editorView: EditorView;
     getEditorFeatureFlags: GetEditorFeatureFlags;

package/docs/0-intro.tsx

@@ -49,5 +49,5 @@ type TablePlugin = NextEditorPlugin<
 For internal Atlassian, visit the slack channel [#help-editor](https://atlassian.slack.com/archives/CFG3PSQ9E) for support or visit [go/editor-help](https://go/editor-help) to submit a bug.
 ## License
 ---
- Please see [Atlassian Frontend - License](https://developer.atlassian.com/cloud/framework/atlassian-frontend/#license) for more licensing information.
+ Please see [Atlassian Frontend - License](https://hello.atlassian.net/wiki/spaces/AF/pages/2589099144/Documentation#License) for more licensing information.
 `;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "4.0.1",
+  "version": "4.0.3",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -27,8 +27,9 @@
     "releaseModel": "continuous"
   },
   "dependencies": {
-    "@atlaskit/adf-schema": "^29.1.0",
-    "@atlaskit/editor-common": "^76.0.0",
+    "@atlaskit/adf-schema": "^32.0.0",
+    "@atlaskit/custom-steps": "^0.0.2",
+    "@atlaskit/editor-common": "^76.5.0",
     "@atlaskit/editor-palette": "1.5.1",
     "@atlaskit/editor-plugin-analytics": "^0.2.0",
     "@atlaskit/editor-plugin-content-insertion": "^0.1.0",
@@ -57,7 +58,7 @@
     "@atlaskit/analytics-next": "^9.1.0",
     "@atlaskit/editor-plugin-decorations": "^0.2.0",
     "@atlaskit/editor-plugin-feature-flags": "^1.0.0",
-    "@atlaskit/editor-plugin-grid": "^0.2.0",
+    "@atlaskit/editor-plugin-grid": "^0.3.0",
     "@atlaskit/editor-plugin-guideline": "^0.5.0",
     "@atlaskit/editor-plugin-hyperlink": "^0.5.0",
     "@atlaskit/editor-plugin-width": "^0.2.0",
@@ -105,6 +106,9 @@
     "platform.editor.table-sticky-scrollbar": {
       "type": "boolean"
     },
+    "platform.editor.table.column-controls-styles-updated": {
+      "type": "boolean"
+    },
     "platform.editor.update-table-cell-width-via-step": {
       "type": "boolean"
     },

package/src/__tests__/integration/__snapshots__/auto-size.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -215,6 +216,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "full-width",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -411,6 +413,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "wide",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/copy-button.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -215,6 +216,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/delete-columns.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -457,6 +458,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/delete-last-column-in-full-width.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "full-width",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/delete-last-column-with-empty-action.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/delete-last-row-with-empty-action.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -122,6 +123,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/delete-rows.ts.snap

@@ -31,6 +31,7 @@ Object {
             "isNumberColumnEnabled": false,
             "layout": "default",
             "localId": "abc-123",
+            "width": null,
           },
           "content": Array [
             Object {
@@ -159,6 +160,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -602,6 +604,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/deleting-empty-paragraph-under-table.ts.snap

@@ -10,6 +10,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -174,6 +175,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -338,6 +340,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/even-columns.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -379,6 +380,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/insert-cell-header-with-strong-mark.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {

package/src/__tests__/integration/__snapshots__/insert-row-inside-layout.ts.snap

@@ -27,6 +27,7 @@ Object {
                 "isNumberColumnEnabled": false,
                 "layout": "default",
                 "localId": "abc-123",
+                "width": null,
               },
               "content": Array [
                 Object {

package/src/__tests__/integration/__snapshots__/layout.ts.snap

@@ -9,6 +9,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "full-width",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -187,6 +188,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "wide",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -365,6 +367,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "default",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -519,6 +522,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "full-width",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -673,6 +677,7 @@ Object {
         "isNumberColumnEnabled": false,
         "layout": "wide",
         "localId": "abc-123",
+        "width": null,
       },
       "content": Array [
         Object {
@@ -843,6 +848,7 @@ Object {
                 "isNumberColumnEnabled": false,
                 "layout": "default",
                 "localId": "abc-123",
+                "width": null,
               },
               "content": Array [
                 Object {
@@ -1063,6 +1069,7 @@ Object {
             "isNumberColumnEnabled": false,
             "layout": "default",
             "localId": "abc-123",
+            "width": null,
           },
           "content": Array [
             Object {
@@ -1260,6 +1267,7 @@ Object {
                 "isNumberColumnEnabled": false,
                 "layout": "default",
                 "localId": "abc-123",
+                "width": null,
               },
               "content": Array [
                 Object {
@@ -1472,6 +1480,7 @@ Object {
             "isNumberColumnEnabled": false,
             "layout": "default",
             "localId": "abc-123",
+            "width": null,
           },
           "content": Array [
             Object {