@atlaskit/editor-plugin-table 22.2.4 → 22.2.7

package/dist/es2019/nodeviews/TableContainer.js

@@ -10,7 +10,7 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
 import { getPluginState } from '../pm-plugins/plugin-factory';
-import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR } from '../pm-plugins/table-resizing/utils/consts';
+import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR, RESIZE_HANDLE_SPACING } from '../pm-plugins/table-resizing/utils/consts';
 import { getTableResizerContainerMaxWidthInCSS, getTableResizerContainerForFullPageWidthInCSS } from '../pm-plugins/table-resizing/utils/misc';
 import { ALIGN_CENTER, ALIGN_START } from '../pm-plugins/utils/alignment';
 import { TableCssClassName as ClassName } from '../types';
@@ -213,7 +213,6 @@ export const ResizableTableContainer = /*#__PURE__*/React.memo(({
     maxResizerWidth
   } = useMemo(() => {
     let responsiveContainerWidth = 0;
-    const resizeHandleSpacing = 12;
     const padding = getPadding(containerWidth);
     // When Full width or Max width editor enabled, a Mac OS user can change "ak-editor-content-area" width by
     // updating Settings -> Appearance -> Show scroll bars from "When scrolling" to "Always". It causes
@@ -231,30 +230,39 @@ export const ResizableTableContainer = /*#__PURE__*/React.memo(({
       if (isTableScalingEnabled && Number.isFinite(lineLength) && lineLength !== undefined) {
         responsiveContainerWidth = lineLength;
       } else {
-        responsiveContainerWidth = containerWidth - padding * 2 - resizeHandleSpacing;
+        responsiveContainerWidth = containerWidth - padding * 2 - RESIZE_HANDLE_SPACING;
       }
     } else if (isCommentEditor) {
       responsiveContainerWidth = containerWidth - TABLE_OFFSET_IN_COMMENT_EDITOR;
+    } else if (isChromelessEditor && expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true)) {
+      // there's no padding included in chromeless appearance, so we need to reduce table
+      // width to ensure all controls are visible.
+      // use lineLength as the value is updated by scrollbar visibility changes
+      responsiveContainerWidth = Number.isFinite(lineLength) && lineLength !== undefined ? lineLength : containerWidth - RESIZE_HANDLE_SPACING;
     } else {
       // 76 is currently an accepted padding value considering the spacing for resizer handle
       // containerWidth = width of a DIV with test id="ak-editor-fp-content-area". It is a parent of
       // a DIV with className="ak-editor-content-area". This DIV has padding left and padding right.
       // padding left = padding right = akEditorGutterPadding = 32
-      responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
+      responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - RESIZE_HANDLE_SPACING;
     }
 
     // Fix for HOT-119925: Ensure table width is properly constrained and responsive
     // For wide tables, ensure they don't exceed container width and can be scrolled
-    const calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+    const calculatedWidth =
+    // remove isCommentEditor check if platform_editor_table_resize_chromeless is cleaned up
+    !node.attrs.width && (expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) && !isFullPageAppearance || isCommentEditor) ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
 
     // Ensure minimum width for usability while respecting container constraints
     const width = Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300));
-    const maxResizerWidth = isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH);
+
+    // remove isCommentEditor check if platform_editor_table_resize_chromeless is cleaned up
+    const maxResizerWidth = expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) && !isFullPageAppearance || isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH);
     return {
       width,
       maxResizerWidth
     };
-  }, [containerWidth, isCommentEditor, isFullWidthModeEnabled, isMaxWidthModeEnabled, isTableScalingEnabled, lineLength, node.attrs.width, tableWidth]);
+  }, [containerWidth, isCommentEditor, isChromelessEditor, isFullWidthModeEnabled, isMaxWidthModeEnabled, isFullPageAppearance, isTableScalingEnabled, lineLength, node.attrs.width, tableWidth]);
   useEffect(() => {
     if (!isResizing) {
       tableWidthRef.current = width;
@@ -302,7 +310,8 @@ export const ResizableTableContainer = /*#__PURE__*/React.memo(({
     pluginInjectionApi,
     onResizeStart,
     onResizeStop,
-    isCommentEditor
+    isCommentEditor,
+    isChromelessEditor
   };
   const isLivePageViewMode = mode === 'view';
   return /*#__PURE__*/React.createElement(AlignmentTableContainerWrapper, {

package/dist/es2019/nodeviews/TableResizer.js

@@ -20,7 +20,7 @@ import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plu
 import { updateWidthToWidest } from '../pm-plugins/commands/misc';
 import { META_KEYS } from '../pm-plugins/table-analytics';
 import { getColgroupChildrenLength } from '../pm-plugins/table-resizing/utils/colgroup';
-import { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_FULL_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR } from '../pm-plugins/table-resizing/utils/consts';
+import { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_FULL_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR, RESIZE_HANDLE_SPACING } from '../pm-plugins/table-resizing/utils/consts';
 import { previewScaleTable, scaleTable } from '../pm-plugins/table-resizing/utils/scale-table';
 import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
 import { ALIGN_CENTER, ALIGN_START, normaliseAlignment, shouldChangeAlignmentToCenterResized } from '../pm-plugins/utils/alignment';
@@ -43,12 +43,12 @@ const getResizerHandleHeight = tableRef => {
   var _tableRef$clientHeigh;
   const tableHeight = (_tableRef$clientHeigh = tableRef === null || tableRef === void 0 ? void 0 : tableRef.clientHeight) !== null && _tableRef$clientHeigh !== void 0 ? _tableRef$clientHeigh : 0;
   /*
-     - One row table height (minimum possible table height) ~ 45px
-     - Two row table height ~ 90px
-     - Three row table height ~ 134px
-      In the if below we need to use:
-     - > 46 because the height of the table can be a float number like 45.44.
-     - < 96 is the height of large resize handle.
+  - One row table height (minimum possible table height) ~ 45px
+  - Two row table height ~ 90px
+  - Three row table height ~ 134px
+  	In the if below we need to use:
+  - > 46 because the height of the table can be a float number like 45.44.
+  - < 96 is the height of large resize handle.
    */
   if (tableHeight >= 96) {
     return 'large';
@@ -70,6 +70,15 @@ const getPadding = containerWidth => {
     exposure: true
   }) ? akEditorGutterPaddingReduced : akEditorGutterPaddingDynamic();
 };
+const getTableMaxWidth = (containerWidth, lineLength, isCommentEditor, isChromelessEditor) => {
+  if (isCommentEditor) {
+    return Math.floor(containerWidth - TABLE_OFFSET_IN_COMMENT_EDITOR);
+  } else if (isChromelessEditor) {
+    return Number.isFinite(lineLength) && lineLength !== undefined ? lineLength : Math.floor(containerWidth - RESIZE_HANDLE_SPACING);
+  } else {
+    return expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH;
+  }
+};
 
 /**
  * When guidelines are outside the viewport, filter them out, do not show
@@ -129,6 +138,7 @@ export const TableResizer = ({
   pluginInjectionApi,
   isFullWidthModeEnabled,
   isCommentEditor,
+  isChromelessEditor,
   disabled
 }) => {
   var _editorView$state, _pluginInjectionApi$a2, _pluginInjectionApi$u2;
@@ -148,6 +158,7 @@ export const TableResizer = ({
   const {
     formatMessage
   } = useIntl();
+  const isFullPageAppearance = !isCommentEditor && !isChromelessEditor;
   const currentSelection = (_editorView$state = editorView.state) === null || _editorView$state === void 0 ? void 0 : _editorView$state.selection;
   const tableFromSelection = useMemo(() => {
     return findTable(currentSelection);
@@ -285,7 +296,9 @@ export const TableResizer = ({
       return;
     }
     const editorContainerWidth = isFullWidthModeEnabled ? lineLength + 2 * getPadding(containerWidth) : containerWidth;
-    const closestSnap = !isCommentEditor && findClosestSnap(newWidth, isTableScalingEnabled ? defaultTablePreserveSnappingWidths(PRESERVE_TABLE_SNAPPING_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig) : defaultSnappingWidths, isTableScalingEnabled ? defaultGuidelinesForPreserveTable(PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig) : defaultGuidelines, TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE);
+    const closestSnap =
+    // remove isCommentEditor check if platform_editor_table_resize_chromeless is cleaned up
+    (expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) && isFullPageAppearance || !isCommentEditor) && findClosestSnap(newWidth, isTableScalingEnabled ? defaultTablePreserveSnappingWidths(PRESERVE_TABLE_SNAPPING_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig) : defaultSnappingWidths, isTableScalingEnabled ? defaultGuidelinesForPreserveTable(PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig) : defaultGuidelines, TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE);
     closestSnap && updateActiveGuidelines(closestSnap);
 
     // When snapping to the full width guideline, resize the table to be 1800px
@@ -296,15 +309,15 @@ export const TableResizer = ({
     const currentTableNodeLocalId = (_node$attrs$localId = node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) !== null && _node$attrs$localId !== void 0 ? _node$attrs$localId : '';
     const fullWidthGuideline = defaultGuidelinesForPreserveTable(PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig).filter(guideline => guideline.isFullWidth)[0];
     const isFullWidthGuidelineActive = expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) ? closestSnap && fullWidthGuideline && closestSnap.keys.includes(fullWidthGuideline.key) : closestSnap && closestSnap.keys.includes(fullWidthGuideline.key);
-    const tableMaxWidth = isCommentEditor ? Math.floor(containerWidth - TABLE_OFFSET_IN_COMMENT_EDITOR) : expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH;
-    const shouldUpdateWidthToWidest = isCommentEditor ? tableMaxWidth <= newWidth : !!isTableScalingEnabled && isFullWidthGuidelineActive;
-    const previewParentWidth = isCommentEditor && shouldUpdateWidthToWidest ? tableMaxWidth : newWidth;
+    const tableMaxWidth = expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) ? getTableMaxWidth(containerWidth, lineLength, isCommentEditor, isChromelessEditor) : isCommentEditor ? Math.floor(containerWidth - TABLE_OFFSET_IN_COMMENT_EDITOR) : expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH;
+    const shouldUpdateWidthToWidest = expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) && !isFullPageAppearance || isCommentEditor ? tableMaxWidth <= newWidth : !!isTableScalingEnabled && isFullWidthGuidelineActive;
+    const previewParentWidth = (expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) && !isFullPageAppearance || isCommentEditor) && shouldUpdateWidthToWidest ? tableMaxWidth : newWidth;
     previewScaleTable(tableRef, {
       node,
       prevNode: node,
       start: pos + 1,
       parentWidth: previewParentWidth
-    }, editorView.domAtPos.bind(editorView), isTableScalingEnabled, allowFixedColumnWidthOption, isCommentEditor);
+    }, editorView.domAtPos.bind(editorView), isTableScalingEnabled, allowFixedColumnWidthOption, expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) ? !isFullPageAppearance : isCommentEditor);
     chainCommands((state, dispatch) => {
       return switchToCenterAlignment(pos, node, newWidth, state, dispatch);
     }, updateWidthToWidest({
@@ -312,7 +325,7 @@ export const TableResizer = ({
     }))(state, dispatch);
     updateWidth(shouldUpdateWidthToWidest ? tableMaxWidth : newWidth);
     return newWidth;
-  }, [countFrames, isCommentEditor, isTableScalingEnabled, allowFixedColumnWidthOption, isFullWidthModeEnabled, excludeGuidelineConfig, tableRef, node, editorView, updateActiveGuidelines, containerWidth, lineLength, updateWidth, getPos, switchToCenterAlignment]);
+  }, [countFrames, isCommentEditor, isChromelessEditor, isFullPageAppearance, isTableScalingEnabled, allowFixedColumnWidthOption, isFullWidthModeEnabled, excludeGuidelineConfig, tableRef, node, editorView, updateActiveGuidelines, containerWidth, lineLength, updateWidth, getPos, switchToCenterAlignment]);
   const scheduleResize = useMemo(() => rafSchd(handleResize), [handleResize]);
   const handleResizeStop = useCallback((originalState, delta) => {
     var _node$attrs$localId2, _node$attrs2, _pluginInjectionApi$u3;
@@ -325,7 +338,7 @@ export const TableResizer = ({
     } = editorView;
     const pos = getPos();
     const currentTableNodeLocalId = (_node$attrs$localId2 = node === null || node === void 0 ? void 0 : (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.localId) !== null && _node$attrs$localId2 !== void 0 ? _node$attrs$localId2 : '';
-    const tableMaxWidth = isCommentEditor ? undefined // Table's full-width in comment appearance inherit the width of the Editor/Renderer
+    const tableMaxWidth = expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) && !isFullPageAppearance || isCommentEditor ? undefined // Table's full-width in comment appearance inherit the width of the Editor/Renderer
     : expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH;
     newWidth = widthToWidest && currentTableNodeLocalId && widthToWidest[currentTableNodeLocalId] ? tableMaxWidth : newWidth;
     let tr = state.tr.setMeta(tableWidthPluginKey, {
@@ -367,8 +380,9 @@ export const TableResizer = ({
         // We use originalNewWidth in comment editor, because in comment editor
         // newWidth can be underined when table is resized to 'full-width'
         // scaleTable function needs number value to work correctly.
-        parentWidth: isCommentEditor ? originalNewWidth : newWidth
-      }, editorView.domAtPos.bind(editorView), pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent || false, isCommentEditor)(tr);
+        // remove isCommentEditor check when platform_editor_table_resize_chromeless is removed
+        parentWidth: expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) && !isFullPageAppearance || isCommentEditor ? originalNewWidth : newWidth
+      }, editorView.domAtPos.bind(editorView), pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent || false, expValEquals('platform_editor_table_resize_chromeless', 'isEnabled', true) ? !isFullPageAppearance : isCommentEditor)(tr);
 
       // Ignored via go/ees005
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
@@ -404,7 +418,7 @@ export const TableResizer = ({
       (_insm$session2 = insm.session) === null || _insm$session2 === void 0 ? void 0 : _insm$session2.endFeature('tableResize');
     }
     return newWidth;
-  }, [editorView, getPos, node, isCommentEditor, widthToWidest, endMeasure, displayGapCursor, displayGuideline, updateWidth, scheduleResize, onResizeStop, pluginInjectionApi, attachAnalyticsEvent, tableRef, isTableScalingEnabled, shouldUseIncreasedScalingPercent, formatMessage]);
+  }, [editorView, getPos, node, isCommentEditor, widthToWidest, endMeasure, displayGapCursor, displayGuideline, updateWidth, scheduleResize, onResizeStop, pluginInjectionApi, attachAnalyticsEvent, tableRef, isTableScalingEnabled, shouldUseIncreasedScalingPercent, formatMessage, isFullPageAppearance]);
   const handleTableSizeChangeOnKeypress = useCallback(step => {
     const newWidth = width + step;
     if (newWidth < resizerMinWidth) {

package/dist/es2019/pm-plugins/analytics/commands.js

@@ -1,7 +1,10 @@
 import { AnalyticPluginTypes } from './actions';
 import { createCommand, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
+// eslint-disable-next-line import/order
 import { getMovedPayload } from './utils/moved-event';
+// eslint-disable-next-line import/order
+
 export const updateRowOrColumnMoved = (nextState, nextAction) => createCommand(state => {
   const {
     rowOrColumnMoved

package/dist/es2019/pm-plugins/commands/hover.js

@@ -5,7 +5,10 @@ import { TableDecorations } from '../../types';
 import { createCommand, getPluginState } from '../plugin-factory';
 import { createCellHoverDecoration, createColumnLineResize, createControlsHoverDecoration } from '../utils/decoration';
 import { getMergedCellsPositions } from '../utils/table';
+// eslint-disable-next-line import/order
 import { updatePluginStateDecorations } from '../utils/update-plugin-state-decorations';
+// eslint-disable-next-line import/order
+
 const makeArray = n => Array.from(Array(n).keys());
 export const hoverMergedCells = () => createCommand(state => {
   const mergedCellsPositions = getMergedCellsPositions(state.tr);

package/dist/es2019/pm-plugins/commands/referentiality.js

@@ -1,5 +1,8 @@
 import { removeConnectedNodes } from '@atlaskit/editor-common/utils';
+// eslint-disable-next-line import/order
 import { createCommand } from '../plugin-factory';
+// eslint-disable-next-line import/order
+
 export const removeDescendantNodes = sourceNode => createCommand({
   type: 'UPDATE_STATE',
   data: {

package/dist/es2019/pm-plugins/drag-and-drop/commands.js

@@ -6,6 +6,10 @@ import { DragAndDropActionType } from './actions';
 import { DropTargetType } from './consts';
 import { createCommand, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
+// eslint-disable-next-line import/order
+
+// eslint-disable-next-line import/order
+
 // TODO: ED-26961 - This command is a placeholder example. Please replace this if required.
 const getDecorations = state => {
   var _pluginKey$getState;

package/dist/es2019/pm-plugins/drag-and-drop/plugin.js

@@ -20,6 +20,8 @@ import { DropTargetType } from './consts';
 import { createPluginState, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
 import { getDraggableDataFromEvent } from './utils/monitor';
+// eslint-disable-next-line import/order
+
 const destroyFn = (editorView, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor, api) => {
   const editorPageScrollContainer = document.querySelector('.fabric-editor-popup-scroll-parent');
   const rowAutoScrollers = editorPageScrollContainer ? [monitorForElements({

package/dist/es2019/pm-plugins/drag-and-drop/utils/autoscrollers.js

@@ -1,6 +1,9 @@
 import { autoScrollForElements } from '@atlaskit/pragmatic-drag-and-drop-auto-scroll/element';
 import { unsafeOverflowAutoScrollForElements } from '@atlaskit/pragmatic-drag-and-drop-auto-scroll/unsafe-overflow/element';
+// eslint-disable-next-line import/order
 import { dropTargetExtendedWidth } from '../../../ui/consts';
+// eslint-disable-next-line import/order
+
 export const autoScrollerFactory = ({
   tableWrapper,
   getNode

package/dist/es2019/pm-plugins/sticky-headers/commands.js

@@ -1,3 +1,5 @@
+// eslint-disable-next-line import/order
+
 import { createCommand } from './plugin-state';
 export const updateStickyState = rowState => createCommand({
   name: 'UPDATE',

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

@@ -1,7 +1,12 @@
 // @ts-ignore -- ReadonlyTransaction is a local declaration and will cause a TS2305 error in CCFE typecheck
 import { pluginFactory } from '@atlaskit/editor-common/utils';
 import { pluginKey } from './plugin-key';
+// eslint-disable-next-line import/order
 import reducer from './reducer';
+// eslint-disable-next-line import/order
+
+// eslint-disable-next-line import/order
+
 function mapping(tr, pluginState) {
   if (pluginState && pluginState.resizeHandlePos !== null) {
     return {

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

@@ -87,7 +87,7 @@ export const generateColgroupFromNode = (table, isCommentEditor, isChromelessEdi
   });
   return cols;
 };
-export const generateColgroup = (table, tableRef, shouldUseIncreasedScalingPercent, isCommentEditor) => {
+export const generateColgroup = (table, tableRef, shouldUseIncreasedScalingPercent, isCommentOrChromelessEditor) => {
   const cols = [];
   const map = TableMap.get(table);
 
@@ -102,7 +102,7 @@ export const generateColgroup = (table, tableRef, shouldUseIncreasedScalingPerce
         var _table$attrs;
         // if we have tableRef here, isTableScalingEnabled is true
         let scalePercent = 1;
-        if (isCommentEditor && !((_table$attrs = table.attrs) !== null && _table$attrs !== void 0 && _table$attrs.width)) {
+        if (isCommentOrChromelessEditor && !((_table$attrs = table.attrs) !== null && _table$attrs !== void 0 && _table$attrs.width)) {
           scalePercent = getScalingPercentForTableWithoutWidth(table, tableRef);
         } else {
           scalePercent = getTableScalingPercent(table, tableRef, shouldUseIncreasedScalingPercent);
@@ -136,14 +136,14 @@ export const generateColgroup = (table, tableRef, shouldUseIncreasedScalingPerce
   });
   return cols;
 };
-export const insertColgroupFromNode = (tableRef, table, isTableScalingEnabled = false, shouldRemove = true, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => {
+export const insertColgroupFromNode = (tableRef, table, isTableScalingEnabled = false, shouldRemove = true, shouldUseIncreasedScalingPercent = false, isCommentOrChromelessEditor = false) => {
   // Ignored via go/ees005
   // eslint-disable-next-line @atlaskit/editor/no-as-casting
   let colgroup = tableRef === null || tableRef === void 0 ? void 0 : tableRef.querySelector('colgroup');
   if (colgroup && shouldRemove) {
     tableRef === null || tableRef === void 0 ? void 0 : tableRef.removeChild(colgroup);
   }
-  colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef !== null && tableRef !== void 0 ? tableRef : undefined : undefined, shouldUseIncreasedScalingPercent, isCommentEditor);
+  colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef !== null && tableRef !== void 0 ? tableRef : undefined : undefined, shouldUseIncreasedScalingPercent, isCommentOrChromelessEditor);
   if (shouldRemove) {
     tableRef === null || tableRef === void 0 ? void 0 : tableRef.insertBefore(colgroup, tableRef === null || tableRef === void 0 ? void 0 : tableRef.firstChild);
   }
@@ -171,8 +171,8 @@ export const isMinCellWidthTable = table => {
   });
   return isTableMinCellWidth;
 };
-function renderColgroupFromNode(table, maybeTableRef, shouldUseIncreasedScalingPercent, isCommentEditor) {
-  const rendered = DOMSerializer.renderSpec(document, ['colgroup', {}, ...generateColgroup(table, maybeTableRef, shouldUseIncreasedScalingPercent, isCommentEditor)]);
+function renderColgroupFromNode(table, maybeTableRef, shouldUseIncreasedScalingPercent, isCommentOrChromelessEditor) {
+  const rendered = DOMSerializer.renderSpec(document, ['colgroup', {}, ...generateColgroup(table, maybeTableRef, shouldUseIncreasedScalingPercent, isCommentOrChromelessEditor)]);
 
   // Ignored via go/ees005
   // eslint-disable-next-line @atlaskit/editor/no-as-casting

package/dist/es2019/pm-plugins/table-resizing/utils/consts.js

@@ -8,4 +8,5 @@ export const MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION = 0.4;
 export const TABLE_EDITOR_MARGIN = 76;
 const COMMENT_AK_EDITOR_CONTENT_AREA_PADDING = 20;
 const COMMENT_PM_TABLE_RESIZING_PLUGIN_MARGIN = 12;
-export const TABLE_OFFSET_IN_COMMENT_EDITOR = 2 * (COMMENT_AK_EDITOR_CONTENT_AREA_PADDING + COMMENT_PM_TABLE_RESIZING_PLUGIN_MARGIN);
+export const TABLE_OFFSET_IN_COMMENT_EDITOR = 2 * (COMMENT_AK_EDITOR_CONTENT_AREA_PADDING + COMMENT_PM_TABLE_RESIZING_PLUGIN_MARGIN);
+export const RESIZE_HANDLE_SPACING = 12;

package/dist/es2019/pm-plugins/table-resizing/utils/scale-table.js

@@ -101,7 +101,7 @@ export function scaleTableTo(state, maxSize) {
   }
   return adjustColumnsWidths(newState, maxSize);
 }
-export const previewScaleTable = (tableRef, options, domAtPos, isTableScalingEnabled = false, allowFixedColumnWidthOption = false, isCommentEditor = false) => {
+export const previewScaleTable = (tableRef, options, domAtPos, isTableScalingEnabled = false, allowFixedColumnWidthOption = false, isCommentOrChromelessEditor = false) => {
   const {
     node,
     start,
@@ -126,7 +126,7 @@ export const previewScaleTable = (tableRef, options, domAtPos, isTableScalingEna
     syncStickyRowToTable(tableRef);
     return;
   }
-  const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled || isTableScalingEnabled && isCommentEditor;
+  const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled || isTableScalingEnabled && isCommentOrChromelessEditor;
   const resizeState = parentWidth ? scaleWithParent(tableRef, parentWidth, node, start, domAtPos, false,
   // Here isTableScalingEnabled = false
   shouldUseIncreasedScalingPercent) : scale(tableRef, options, domAtPos, false, shouldUseIncreasedScalingPercent);
@@ -136,7 +136,7 @@ export const previewScaleTable = (tableRef, options, domAtPos, isTableScalingEna
 };
 
 // Scale the table to meet new requirements (col, layout change etc)
-export const scaleTable = (tableRef, options, domAtPos, api, isTableScalingEnabledOnCurrentTable = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => tr => {
+export const scaleTable = (tableRef, options, domAtPos, api, isTableScalingEnabledOnCurrentTable = false, shouldUseIncreasedScalingPercent = false, isCommentOrChromelessEditor = false) => tr => {
   if (!tableRef) {
     return tr;
   }
@@ -152,7 +152,7 @@ export const scaleTable = (tableRef, options, domAtPos, api, isTableScalingEnabl
     // To force reflow of columns upon delete.
     if (!isTableScalingEnabledOnCurrentTable) {
       const isTableScalingEnabled = false;
-      insertColgroupFromNode(tableRef, node, isTableScalingEnabled, undefined, shouldUseIncreasedScalingPercent, isCommentEditor);
+      insertColgroupFromNode(tableRef, node, isTableScalingEnabled, undefined, shouldUseIncreasedScalingPercent, isCommentOrChromelessEditor);
     }
     tr.setMeta('scrollIntoView', false);
     return tr;

package/dist/es2019/pm-plugins/utils/drag-menu.js

@@ -171,7 +171,7 @@ export const getDragMenuConfig = (direction, getEditorContainerWidth, hasMergedC
       label: ''
     })
   }] : [];
-  const sortConfigs = [...sortOptions.map(({
+  const sortConfigs = sortOptions.map(({
     label,
     order,
     icon
@@ -184,7 +184,7 @@ export const getDragMenuConfig = (direction, getEditorContainerWidth, hasMergedC
       sortColumnWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, index !== null && index !== void 0 ? index : 0, order)(state, dispatch);
       return true;
     }
-  }))];
+  }));
   const restConfigs = [...addOptions.map(({
     label,
     offset,

package/dist/es2019/ui/ColumnResizeWidget/index.js

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/extends";
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+/* eslint-disable @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
 import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl';
 import { startColumnResizing, ToolTipContent } from '@atlaskit/editor-common/keymaps';

package/dist/es2019/ui/DragHandle/index.js

@@ -246,4 +246,6 @@ const DragHandleComponent = ({
     height: previewHeight
   }), previewContainer));
 };
+
+// eslint-disable-next-line @typescript-eslint/ban-types
 export const DragHandle = injectIntl(DragHandleComponent);

package/dist/es2019/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.js

@@ -2,7 +2,7 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+/* eslint-disable @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
 import { jsx } from '@emotion/react';
 import { ButtonGroup } from '@atlaskit/button';
 import { FloatingToolbarButton as Button, FloatingToolbarSeparator } from '@atlaskit/editor-common/ui';

package/dist/es2019/ui/FloatingContextualMenu/ContextualMenu.js

@@ -5,7 +5,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
  * @jsx jsx
  */
 import React, { Component } from 'react';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+/* eslint-disable @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
 import { jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl';
 import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
@@ -875,7 +875,10 @@ export class ContextualMenu extends Component {
     })));
   }
 }
+
+// eslint-disable-next-line @typescript-eslint/ban-types
 _defineProperty(ContextualMenu, "defaultProps", {
   boundariesElement: typeof document !== 'undefined' ? document.body : undefined
 });
-export default injectIntl(ContextualMenu);
+const _default_1 = injectIntl(ContextualMenu);
+export default _default_1;

package/dist/es2019/ui/FloatingDeleteButton/DeleteButton.js

@@ -38,4 +38,7 @@ const DeleteButton = ({
   fill: "currentColor",
   fillRule: "evenodd"
 }))));
-export default injectIntl(DeleteButton);
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+const _default_1 = injectIntl(DeleteButton);
+export default _default_1;

package/dist/es2019/ui/FloatingDragMenu/DragMenu.js

@@ -585,4 +585,7 @@ const DragMenu = /*#__PURE__*/React.memo(({
     scrollableElement: scrollableElement
   }));
 });
-export default injectIntl(DragMenu);
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+const _default_1 = injectIntl(DragMenu);
+export default _default_1;

package/dist/es2019/ui/FloatingInsertButton/InsertButton.js

@@ -126,6 +126,8 @@ const InsertButtonForDragAndDrop = ({
     }, content))
   );
 };
+
+// eslint-disable-next-line @typescript-eslint/ban-types
 export const DragAndDropInsertButton = injectIntl(InsertButtonForDragAndDrop);
 const InsertButton = ({
   onMouseDown,
@@ -180,4 +182,7 @@ const InsertButton = ({
     }, content))
   );
 };
-export default injectIntl(InsertButton);
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+const _default_1 = injectIntl(InsertButton);
+export default _default_1;

package/dist/es2019/ui/FloatingInsertButton/index.js

@@ -217,5 +217,8 @@ export class FloatingInsertButton extends React.Component {
     }
   }
 }
+
+// eslint-disable-next-line @typescript-eslint/ban-types
 _defineProperty(FloatingInsertButton, "displayName", 'FloatingInsertButton');
-export default injectIntl(FloatingInsertButton);
+const _default_1 = injectIntl(FloatingInsertButton);
+export default _default_1;

package/dist/es2019/ui/SizeSelector/index.js

@@ -4,7 +4,7 @@
  */
 import { useCallback } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+/* eslint-disable @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
 import { jsx } from '@emotion/react';
 import { TableSelectorPopup } from '@atlaskit/editor-common/ui';
 import { pluginKey } from '../../pm-plugins/table-size-selector';

package/dist/es2019/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js

@@ -105,4 +105,6 @@ class CornerControlComponent extends Component {
     })));
   }
 }
+
+// eslint-disable-next-line @typescript-eslint/ban-types
 export const CornerControls = injectIntl(CornerControlComponent);

package/dist/es2019/ui/TableFloatingControls/CornerControls/DragCornerControls.js

@@ -118,5 +118,9 @@ const DragCornerControlsComponentWithSelection = ({
     className: ClassName.DRAG_CORNER_BUTTON_INNER
   }));
 };
+
+// eslint-disable-next-line @typescript-eslint/ban-types
 export const DragCornerControlsWithSelection = injectIntl(DragCornerControlsComponentWithSelection);
+
+// eslint-disable-next-line @typescript-eslint/ban-types
 export const DragCornerControls = injectIntl(DragCornerControlsComponent);

package/dist/es2019/ui/TableFloatingControls/RowControls/ClassicControls.js

@@ -96,4 +96,6 @@ class RowControlsComponent extends Component {
     );
   }
 }
+
+// eslint-disable-next-line @typescript-eslint/ban-types
 export const RowControls = injectIntl(RowControlsComponent);

package/dist/es2019/ui/TableFloatingControls/index.js

@@ -4,8 +4,8 @@
  */
 import { Fragment, useCallback } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
+/* eslint-disable @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
+import { jsx, css } from '@emotion/react';
 import { getBrowserInfo } from '@atlaskit/editor-common/browser';
 import { findTable } from '@atlaskit/editor-tables/utils';
 import { fg } from '@atlaskit/platform-feature-flags';

package/dist/es2019/ui/global-styles.js

@@ -2,8 +2,8 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { Global, jsx } from '@emotion/react';
+/* eslint-disable @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
+import { jsx, Global } from '@emotion/react';
 import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { tableStyles } from './common-styles';
 export const GlobalStylesWrapper = ({

package/dist/esm/nodeviews/TableComponent.js

@@ -1022,6 +1022,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       }));
     }
   }]);
-}(React.Component);
+}(React.Component); // eslint-disable-next-line @typescript-eslint/ban-types
 _defineProperty(TableComponent, "displayName", 'TableComponent');
-export default injectIntl(TableComponent);
+var _default_1 = injectIntl(TableComponent);
+export default _default_1;