@atlaskit/editor-plugin-table 2.8.5 → 2.9.0

package/src/plugins/table/pm-plugins/keymap.ts

@@ -1,13 +1,23 @@
+import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import {
   ACTION,
   ACTION_SUBJECT,
   ACTION_SUBJECT_ID,
-  EditorAnalyticsAPI,
   EVENT_TYPE,
   INPUT_METHOD,
 } from '@atlaskit/editor-common/analytics';
-import * as keymaps from '@atlaskit/editor-common/keymaps';
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import {
+  addColumnAfter,
+  addColumnBefore,
+  addRowAfter,
+  addRowBefore,
+  backspace,
+  bindKeymapWithCommand,
+  nextCell,
+  previousCell,
+  toggleTable,
+} from '@atlaskit/editor-common/keymaps';
+import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
@@ -23,7 +33,10 @@ import {
   deleteTableIfSelectedWithAnalytics,
   emptyMultipleCellsWithAnalytics,
 } from '../commands-with-analytics';
-import { addColumnAfter, addColumnBefore } from '../commands/insert';
+import {
+  addColumnAfter as addColumnAfterCommand,
+  addColumnBefore as addColumnBeforeCommand,
+} from '../commands/insert';
 import { withEditorAnalyticsAPI } from '../utils/analytics';
 
 const createTableWithAnalytics = (
@@ -43,23 +56,23 @@ export function keymapPlugin(
 ): SafePlugin {
   const list = {};
 
-  keymaps.bindKeymapWithCommand(
-    keymaps.nextCell.common!,
+  bindKeymapWithCommand(
+    nextCell.common!,
     goToNextCell(editorAnalyticsAPI)(1),
     list,
   );
-  keymaps.bindKeymapWithCommand(
-    keymaps.previousCell.common!,
+  bindKeymapWithCommand(
+    previousCell.common!,
     goToNextCell(editorAnalyticsAPI)(-1),
     list,
   );
-  keymaps.bindKeymapWithCommand(
-    keymaps.toggleTable.common!,
+  bindKeymapWithCommand(
+    toggleTable.common!,
     createTableWithAnalytics(editorAnalyticsAPI),
     list,
   );
-  keymaps.bindKeymapWithCommand(
-    keymaps.backspace.common!,
+  bindKeymapWithCommand(
+    backspace.common!,
     chainCommands(
       deleteTableIfSelectedWithAnalytics(editorAnalyticsAPI)(
         INPUT_METHOD.KEYBOARD,
@@ -70,34 +83,30 @@ export function keymapPlugin(
     ),
     list,
   );
-  keymaps.bindKeymapWithCommand(
-    keymaps.backspace.common!,
-    moveCursorBackward,
-    list,
-  );
+  bindKeymapWithCommand(backspace.common!, moveCursorBackward, list);
 
   // Add row/column shortcuts
-  keymaps.bindKeymapWithCommand(
-    keymaps.addRowBefore.common!,
+  bindKeymapWithCommand(
+    addRowBefore.common!,
     addRowAroundSelection(editorAnalyticsAPI)('TOP'),
     list,
   );
 
-  keymaps.bindKeymapWithCommand(
-    keymaps.addRowAfter.common!,
+  bindKeymapWithCommand(
+    addRowAfter.common!,
     addRowAroundSelection(editorAnalyticsAPI)('BOTTOM'),
     list,
   );
 
-  keymaps.bindKeymapWithCommand(
-    keymaps.addColumnBefore.common!,
-    triggerUnlessTableHeader(addColumnBefore(getEditorContainerWidth)),
+  bindKeymapWithCommand(
+    addColumnBefore.common!,
+    triggerUnlessTableHeader(addColumnBeforeCommand(getEditorContainerWidth)),
     list,
   );
 
-  keymaps.bindKeymapWithCommand(
-    keymaps.addColumnAfter.common!,
-    addColumnAfter(getEditorContainerWidth),
+  bindKeymapWithCommand(
+    addColumnAfter.common!,
+    addColumnAfterCommand(getEditorContainerWidth),
     list,
   );
 

package/src/plugins/table/pm-plugins/table-resizing/event-handlers.ts

@@ -1,4 +1,4 @@
-import { CellAttributes, TableLayout } from '@atlaskit/adf-schema';
+import type { CellAttributes, TableLayout } from '@atlaskit/adf-schema';
 import {
   ACTION_SUBJECT,
   EVENT_TYPE,
@@ -11,10 +11,11 @@ import type {
   GetEditorContainerWidth,
   GetEditorFeatureFlags,
 } from '@atlaskit/editor-common/types';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { getSelectionRect } from '@atlaskit/editor-tables/utils';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
 import { updateColumnWidths } from '../../transforms';
 import { getSelectedColumnIndexes, updateResizeHandles } from '../../utils';
@@ -65,13 +66,21 @@ export const handleMouseDown = (
   const containerWidth = getEditorContainerWidth();
   const parentWidth = getParentNodeWidth(start, state, containerWidth);
 
-  let maxSize =
-    parentWidth ||
-    getLayoutSize(
-      dom.getAttribute('data-layout') as TableLayout,
-      containerWidth.width,
-      {},
-    );
+  let maxSize = getBooleanFF('platform.editor.custom-table-width')
+    ? parentWidth ||
+      // its safe to reference table width from node as this will not have changed
+      originalTable.attrs.width ||
+      getLayoutSize(
+        dom.getAttribute('data-layout') as TableLayout,
+        containerWidth.width,
+        {},
+      )
+    : parentWidth ||
+      getLayoutSize(
+        dom.getAttribute('data-layout') as TableLayout,
+        containerWidth.width,
+        {},
+      );
 
   if (originalTable.attrs.isNumberColumnEnabled) {
     maxSize -= akEditorTableNumberColumnWidth;

package/src/plugins/table/pm-plugins/table-resizing/utils/colgroup.ts

@@ -1,18 +1,26 @@
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { getFragmentBackingArray } from '@atlaskit/editor-common/utils';
-import {
-  DOMSerializer,
-  Node as PmNode,
-} from '@atlaskit/editor-prosemirror/model';
+import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
+import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
 type Col = Array<string | { [name: string]: string }>;
 
-export const generateColgroup = (table: PmNode): Col[] => {
+/**
+ * This ensures the combined width of the columns (and tbody) of table is always smaller or equal
+ * than the table and table wrapper elements. This is necessary as there is no longer
+ * padding on the .pm-table-wrapper, so all elements need to be the same width to avoid
+ * overflow.
+ */
+export const getColWidthFix = (colwidth: number, tableColumnCount: number) =>
+  colwidth - 1 / tableColumnCount;
+
+export const generateColgroup = (table: PmNode) => {
   const cols: Col[] = [];
 
   if (getBooleanFF('platform.editor.custom-table-width')) {
+    const map = TableMap.get(table);
     table.content.firstChild!.content.forEach((cell) => {
       const colspan = cell.attrs.colspan || 1;
       if (Array.isArray(cell.attrs.colwidth)) {
@@ -22,9 +30,10 @@ export const generateColgroup = (table: PmNode): Col[] => {
           cols.push([
             'col',
             {
-              style: `width: ${
-                width ? Math.max(width, tableCellMinWidth) : tableCellMinWidth
-              }px;`,
+              style: `width: ${getColWidthFix(
+                width ? Math.max(width, tableCellMinWidth) : tableCellMinWidth,
+                map.width,
+              )}px;`,
             },
           ]);
         });

package/src/plugins/table/pm-plugins/table-resizing/utils/misc.ts

@@ -1,4 +1,4 @@
-import { CellAttributes, TableLayout } from '@atlaskit/adf-schema';
+import type { CellAttributes, TableLayout } from '@atlaskit/adf-schema';
 import {
   getParentNodeWidth,
   layoutToWidth,
@@ -10,13 +10,13 @@ import {
   mapBreakpointToLayoutMaxWidth,
 } from '@atlaskit/editor-common/ui';
 import { containsClassName } from '@atlaskit/editor-common/utils';
-import {
+import type {
   NodeSpec,
   Node as PMNode,
   ResolvedPos,
 } from '@atlaskit/editor-prosemirror/model';
-import { EditorState } from '@atlaskit/editor-prosemirror/state';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { EditorState } from '@atlaskit/editor-prosemirror/state';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import {
   akEditorFullWidthLayoutWidth,
   akEditorGutterPadding,
@@ -24,7 +24,7 @@ import {
 } from '@atlaskit/editor-shared-styles';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
-import { TableOptions } from '../../../nodeviews/types';
+import type { TableOptions } from '../../../nodeviews/types';
 
 // Translates named layouts in number values.
 export function getLayoutSize(
@@ -120,15 +120,11 @@ export const getTableMaxWidth = ({
   const containerWidth = getEditorContainerWidth();
   const parentWidth = getParentNodeWidth(tableStart, state, containerWidth);
 
-  let maxWidth;
-  if (getBooleanFF('platform.editor.custom-table-width')) {
-    maxWidth =
-      parentWidth ||
+  let maxWidth = getBooleanFF('platform.editor.custom-table-width')
+    ? parentWidth ||
       table.attrs.width ||
-      getLayoutSize(layout, containerWidth.width, {});
-  } else {
-    maxWidth = parentWidth || getLayoutSize(layout, containerWidth.width, {});
-  }
+      getLayoutSize(layout, containerWidth.width, {})
+    : parentWidth || getLayoutSize(layout, containerWidth.width, {});
 
   if (table.attrs.isNumberColumnEnabled) {
     maxWidth -= akEditorTableNumberColumnWidth;

package/src/plugins/table/pm-plugins/table-resizing/utils/resize-state.ts

@@ -1,25 +1,27 @@
-import { TableLayout } from '@atlaskit/adf-schema';
+import type { TableLayout } from '@atlaskit/adf-schema';
 import {
   tableCellMinWidth,
   tableNewColumnMinWidth,
 } from '@atlaskit/editor-common/styles';
 import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
 import { calcTableColumnWidths } from '@atlaskit/editor-common/utils';
-import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import { EditorState } from '@atlaskit/editor-prosemirror/state';
-import { Rect } from '@atlaskit/editor-tables/table-map';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorState } from '@atlaskit/editor-prosemirror/state';
+import type { Rect } from '@atlaskit/editor-tables/table-map';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
 import { getSelectedTableInfo } from '../../../utils';
 
-import { hasTableBeenResized, insertColgroupFromNode } from './colgroup';
 import {
-  ColumnState,
-  getCellsRefsInColumn,
-  getColumnStateFromDOM,
-} from './column-state';
+  getColWidthFix,
+  hasTableBeenResized,
+  insertColgroupFromNode,
+} from './colgroup';
+import type { ColumnState } from './column-state';
+import { getCellsRefsInColumn, getColumnStateFromDOM } from './column-state';
 import { syncStickyRowToTable } from './dom';
 import { getTableMaxWidth } from './misc';
-import { ResizeState, ResizeStateWithAnalytics } from './types';
+import type { ResizeState, ResizeStateWithAnalytics } from './types';
 
 export const getResizeState = ({
   minWidth,
@@ -83,13 +85,28 @@ export const updateColgroup = (
   tableRef: HTMLElement,
 ): void => {
   const cols = tableRef.querySelectorAll('col');
-  state.cols
-    .filter((column) => column && !!column.width) // if width is 0, we dont want to apply that.
-    .forEach((column, i) => {
-      if (cols[i]) {
-        cols[i].style.width = `${column.width}px`;
-      }
-    });
+
+  if (getBooleanFF('platform.editor.custom-table-width')) {
+    const columnsCount = cols.length;
+    state.cols
+      .filter((column) => column && !!column.width) // if width is 0, we dont want to apply that.
+      .forEach((column, i) => {
+        if (cols[i]) {
+          cols[i].style.width = `${getColWidthFix(
+            column.width,
+            columnsCount,
+          )}px`;
+        }
+      });
+  } else {
+    state.cols
+      .filter((column) => column && !!column.width) // if width is 0, we dont want to apply that.
+      .forEach((column, i) => {
+        if (cols[i]) {
+          cols[i].style.width = `${column.width}px`;
+        }
+      });
+  }
 
   // colgroup has updated, reflect new widths in sticky header
   syncStickyRowToTable(tableRef);

package/src/plugins/table/types.ts

@@ -1,19 +1,19 @@
-import { IntlShape } from 'react-intl-next';
+import type { IntlShape } from 'react-intl-next';
 
+import type { TableLayout } from '@atlaskit/adf-schema';
 import {
   tableCellSelector,
   tableHeaderSelector,
-  TableLayout,
   tablePrefixSelector,
 } from '@atlaskit/adf-schema';
-import { TableColumnOrdering } from '@atlaskit/adf-schema/steps';
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import type { TableColumnOrdering } from '@atlaskit/adf-schema/steps';
+import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { TableSharedCssClassName } from '@atlaskit/editor-common/styles';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
-import { Transaction } from '@atlaskit/editor-prosemirror/state';
-import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
-import { Rect } from '@atlaskit/editor-tables/table-map';
+import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
+import type { Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import type { Rect } from '@atlaskit/editor-tables/table-map';
 
 import type tablePlugin from './index';
 

package/src/plugins/table/ui/FloatingInsertButton/InsertButton.tsx

@@ -1,8 +1,14 @@
-import React, { SyntheticEvent } from 'react';
+import type { SyntheticEvent } from 'react';
+import React from 'react';
 
-import { injectIntl, WrappedComponentProps } from 'react-intl-next';
+import type { WrappedComponentProps } from 'react-intl-next';
+import { injectIntl } from 'react-intl-next';
 
-import * as keymaps from '@atlaskit/editor-common/keymaps';
+import {
+  addColumnAfter,
+  addRowAfter,
+  ToolTipContent,
+} from '@atlaskit/editor-common/keymaps';
 import { tableMarginTop } from '@atlaskit/editor-common/styles';
 import { closestElement } from '@atlaskit/editor-common/utils';
 import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
@@ -77,9 +83,9 @@ const InsertButton = ({
   const content = (
     <Tooltip
       content={
-        <keymaps.ToolTipContent
+        <ToolTipContent
           description={formatMessage(tooltipMessageByType(type))}
-          keymap={type === 'row' ? keymaps.addRowAfter : keymaps.addColumnAfter}
+          keymap={type === 'row' ? addRowAfter : addColumnAfter}
         />
       }
       position="top"

package/src/plugins/table/ui/common-styles.ts

@@ -18,6 +18,7 @@ import {
   SelectionStyle,
 } from '@atlaskit/editor-shared-styles';
 import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { B300, N0, N20A, N300, N40A, R500 } from '@atlaskit/theme/colors';
 import { fontSize } from '@atlaskit/theme/constants';
 import { ThemeProps } from '@atlaskit/theme/types';
@@ -155,6 +156,32 @@ const breakoutWidthStyling = () => {
   `;
 };
 
+const tableWrapperStyles = () => {
+  if (getBooleanFF('platform.editor.custom-table-width')) {
+    return css`
+      .${ClassName.TABLE_NODE_WRAPPER} {
+        padding-bottom: 0px;
+        /* fixes gap cursor height */
+        overflow: auto;
+        overflow-y: hidden;
+        position: relative;
+      }
+    `;
+  } else {
+    return css`
+      .${ClassName.TABLE_NODE_WRAPPER} {
+        padding-right: ${insertColumnButtonOffset}px;
+        margin-right: -${insertColumnButtonOffset}px;
+        padding-bottom: 0px;
+        /* fixes gap cursor height */
+        overflow: auto;
+        overflow-y: hidden;
+        position: relative;
+      }
+    `;
+  }
+};
+
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4139
 export const tableStyles = (
   props: ThemeProps & { featureFlags?: FeatureFlags },
@@ -733,15 +760,7 @@ export const tableStyles = (
     .${ClassName.ROW_CONTROLS_WRAPPER} {
       left: -${tableToolbarSize}px;
     }
-    .${ClassName.TABLE_NODE_WRAPPER} {
-      padding-right: ${insertColumnButtonOffset}px;
-      margin-right: -${insertColumnButtonOffset}px;
-      padding-bottom: 0px;
-      /* fixes gap cursor height */
-      overflow: auto;
-      overflow-y: hidden;
-      position: relative;
-    }
+    ${tableWrapperStyles()}
   }
 
   .ProseMirror.${ClassName.IS_RESIZING} {

package/src/plugins/table/ui/consts.ts

@@ -130,6 +130,7 @@ export const contextualMenuDropdownWidth = 180;
 export const stickyRowZIndex = resizeHandlerZIndex + 2;
 export const stickyRowOffsetTop = 8;
 export const stickyHeaderBorderBottomWidth = 1;
+export const tableOverflowShadowWidth = 8;
 
 export const TABLE_SNAP_GAP = 9;
 export const TABLE_HIGHLIGHT_GAP = 10;

package/src/plugins/table/ui/ui-styles.ts

@@ -10,9 +10,10 @@ import {
   akEditorTableNumberColumnWidth,
   akEditorUnitZIndex,
 } from '@atlaskit/editor-shared-styles';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { B300, N0, N300, N40A, N60A, Y200, Y50 } from '@atlaskit/theme/colors';
 import { borderRadius } from '@atlaskit/theme/constants';
-import { ThemeProps } from '@atlaskit/theme/types';
+import type { ThemeProps } from '@atlaskit/theme/types';
 import { token } from '@atlaskit/tokens';
 
 import { TableCssClassName as ClassName } from '../types';
@@ -36,6 +37,7 @@ import {
   tableDeleteButtonSize,
   tableHeaderCellBackgroundColor,
   tableInsertColumnButtonSize,
+  tableOverflowShadowWidth,
   tableToolbarDeleteColor,
   tableToolbarSelectedColor,
   tableToolbarSize,
@@ -244,7 +246,7 @@ export const OverflowShadow = (props: ThemeProps) => css`
     pointer-events: none;
     top: ${tableMarginTop}px;
     z-index: ${akEditorShadowZIndex};
-    width: 8px;
+    width: ${tableOverflowShadowWidth}px;
   }
   .${ClassName.TABLE_LEFT_SHADOW} {
     background: linear-gradient(
@@ -273,9 +275,10 @@ export const OverflowShadow = (props: ThemeProps) => css`
         ${token('elevation.shadow.overflow.perimeter', 'transparent')} 0px,
         transparent 1px
       );
-    left: calc(100% + 2px);
+    left: ${getBooleanFF('platform.editor.custom-table-width')
+      ? `calc(100% - ${tableOverflowShadowWidth}px)`
+      : 'calc(100% + 2px)'};
   }
-
   .${ClassName.WITH_CONTROLS} {
     .${ClassName.TABLE_RIGHT_SHADOW}, .${ClassName.TABLE_LEFT_SHADOW} {
       height: calc(100% - ${tableMarginTopWithControl}px);
@@ -308,6 +311,29 @@ const columnHeaderButtonSelected = (props: ThemeProps) => css`
   z-index: ${columnControlsSelectedZIndex};
 `;
 
+const getFloatingDotOverrides = (props: ThemeProps) => {
+  return getBooleanFF('platform.editor.custom-table-width')
+    ? css`
+        tr
+          th:last-child
+          .${ClassName.COLUMN_CONTROLS_DECORATIONS}::before,
+          tr
+          td:last-child
+          .${ClassName.COLUMN_CONTROLS_DECORATIONS}::before {
+          content: '';
+          background-color: ${tableBorderColor(props)};
+          position: absolute;
+          height: ${lineMarkerSize}px;
+          width: ${lineMarkerSize}px;
+          border-radius: 50%;
+          pointer-events: none;
+          top: ${token('space.025', '2px')};
+          right: 0px;
+        }
+      `
+    : '';
+};
+
 export const columnControlsDecoration = (props: ThemeProps) => css`
   .${ClassName.COLUMN_CONTROLS_DECORATIONS} {
     display: none;
@@ -317,6 +343,7 @@ export const columnControlsDecoration = (props: ThemeProps) => css`
     left: -1px;
     top: -${columnControlsDecorationHeight + tableCellBorderWidth}px;
     height: ${columnControlsDecorationHeight}px;
+    // floating dot for adding column button
     &::before {
       content: ' ';
       background-color: ${tableBorderColor(props)};
@@ -350,6 +377,9 @@ export const columnControlsDecoration = (props: ThemeProps) => css`
     }
   }
 
+  // floating dot for adding column button - overriding style on last column to avoid scroll
+  ${getFloatingDotOverrides(props)}
+
   div.${ClassName.WITH_CONTROLS}>.${ClassName.ROW_CONTROLS_WRAPPER}::after {
     content: ' ';
     background-color: ${tableBorderColor(props)};
@@ -439,6 +469,29 @@ export const hoveredWarningCell = css`
   }
 `;
 
+// move the resize handle zone completely inside the table cell to avoid overflow
+const getLastColumnResizerOverrides = () => {
+  return getBooleanFF('platform.editor.custom-table-width')
+    ? css`
+        tr
+          th:last-child
+          .${ClassName.RESIZE_HANDLE_DECORATION},
+          tr
+          td:last-child
+          .${ClassName.RESIZE_HANDLE_DECORATION} {
+          background-color: transparent;
+          position: absolute;
+          width: ${resizeHandlerAreaWidth}px;
+          height: 100%;
+          top: 0;
+          right: 0;
+          cursor: col-resize;
+          z-index: ${resizeHandlerZIndex};
+        }
+      `
+    : '';
+};
+
 export const resizeHandle = (props: ThemeProps) => css`
   .${ClassName.TABLE_CONTAINER} {
     .${ClassName.RESIZE_HANDLE_DECORATION} {
@@ -452,6 +505,8 @@ export const resizeHandle = (props: ThemeProps) => css`
       z-index: ${resizeHandlerZIndex};
     }
 
+    ${getLastColumnResizerOverrides()}
+
     td.${ClassName.WITH_RESIZE_LINE}::before {
       content: ' ';
       position: absolute;

package/src/plugins/table/utils/decoration.ts

@@ -1,14 +1,15 @@
-import { CellAttributes } from '@atlaskit/adf-schema';
+import type { CellAttributes } from '@atlaskit/adf-schema';
 import { nonNullable } from '@atlaskit/editor-common/utils';
-import { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
+import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
 // @ts-ignore -- ReadonlyTransaction is a local declaration and will cause a TS2305 error in CCFE typecheck
-import {
+import type {
   ReadonlyTransaction,
   Selection,
   Transaction,
 } from '@atlaskit/editor-prosemirror/state';
-import { ContentNodeWithPos } from '@atlaskit/editor-prosemirror/utils';
-import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import type { ContentNodeWithPos } from '@atlaskit/editor-prosemirror/utils';
+import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { Rect, TableMap } from '@atlaskit/editor-tables/table-map';
 import {
   findTable,
@@ -16,12 +17,8 @@ import {
   getSelectionRect,
 } from '@atlaskit/editor-tables/utils';
 
-import {
-  Cell,
-  CellColumnPositioning,
-  TableCssClassName as ClassName,
-  TableDecorations,
-} from '../types';
+import type { Cell, CellColumnPositioning } from '../types';
+import { TableCssClassName as ClassName, TableDecorations } from '../types';
 
 const filterDecorationByKey = (
   key: TableDecorations,

package/tmp/api-report-tmp.d.ts

@@ -12,7 +12,7 @@ import type { EditorSelectionAPI } from '@atlaskit/editor-common/selection';
 import type { GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
 import type { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
 import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
-import { TableLayout } from '@atlaskit/adf-schema';
+import type { TableLayout } from '@atlaskit/adf-schema';
 import type { widthPlugin } from '@atlaskit/editor-plugin-width';
 
 // @public (undocumented)