@atlaskit/editor-plugin-table 7.9.0 → 7.10.0

package/dist/types-ts4.5/ui/TableFloatingControls/CornerControls/DragCornerControls.d.ts

@@ -13,16 +13,6 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                 insertTableWithSize: (rowsCount: number, colsCount: number, inputMethod?: import("@atlaskit/editor-common/analytics").INPUT_METHOD.PICKER | undefined) => import("@atlaskit/editor-common/types").EditorCommand;
             };
             dependencies: [
-                import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
-                    dependencies: [
-                    ];
-                    actions: {
-                        ariaNotify: (message: string) => void;
-                    };
-                    sharedState: {
-                        message: string;
-                    };
-                }, undefined>>,
                 import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
                     pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
                     sharedState: {
@@ -80,6 +70,14 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                     };
                     sharedState: import("@atlaskit/editor-common/selection").SelectionSharedState;
                 }, import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined>,
+                import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
+                    dependencies: [
+                    ];
+                    actions: {
+                        ariaNotify: (message: string, ariaLiveElementAttributes?: import("@atlaskit/editor-plugin-accessibility-utils").AriaLiveElementAttributes | undefined) => void;
+                    };
+                    sharedState: import("@atlaskit/editor-plugin-accessibility-utils").AccessibilityUtilsPluginState;
+                }, undefined>>,
                 import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"media", {
                     pluginConfiguration: any;
                     dependencies: any;
@@ -140,16 +138,6 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                 } | undefined>>
             ];
         }, import("../../../plugin").TablePluginOptions | undefined>,
-        import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
-            dependencies: [
-            ];
-            actions: {
-                ariaNotify: (message: string) => void;
-            };
-            sharedState: {
-                message: string;
-            };
-        }, undefined>>,
         import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
             pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
             sharedState: {
@@ -207,6 +195,14 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
             };
             sharedState: import("@atlaskit/editor-common/selection").SelectionSharedState;
         }, import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined>,
+        import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
+            dependencies: [
+            ];
+            actions: {
+                ariaNotify: (message: string, ariaLiveElementAttributes?: import("@atlaskit/editor-plugin-accessibility-utils").AriaLiveElementAttributes | undefined) => void;
+            };
+            sharedState: import("@atlaskit/editor-plugin-accessibility-utils").AccessibilityUtilsPluginState;
+        }, undefined>>,
         import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"media", {
             pluginConfiguration: any;
             dependencies: any;
@@ -279,16 +275,6 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                     insertTableWithSize: (rowsCount: number, colsCount: number, inputMethod?: import("@atlaskit/editor-common/analytics").INPUT_METHOD.PICKER | undefined) => import("@atlaskit/editor-common/types").EditorCommand;
                 };
                 dependencies: [
-                    import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
-                        dependencies: [
-                        ];
-                        actions: {
-                            ariaNotify: (message: string) => void;
-                        };
-                        sharedState: {
-                            message: string;
-                        };
-                    }, undefined>>,
                     import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
                         pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
                         sharedState: {
@@ -346,6 +332,14 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                         };
                         sharedState: import("@atlaskit/editor-common/selection").SelectionSharedState;
                     }, import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined>,
+                    import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
+                        dependencies: [
+                        ];
+                        actions: {
+                            ariaNotify: (message: string, ariaLiveElementAttributes?: import("@atlaskit/editor-plugin-accessibility-utils").AriaLiveElementAttributes | undefined) => void;
+                        };
+                        sharedState: import("@atlaskit/editor-plugin-accessibility-utils").AccessibilityUtilsPluginState;
+                    }, undefined>>,
                     import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"media", {
                         pluginConfiguration: any;
                         dependencies: any;
@@ -406,16 +400,6 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                     } | undefined>>
                 ];
             }, import("../../../plugin").TablePluginOptions | undefined>,
-            import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
-                dependencies: [
-                ];
-                actions: {
-                    ariaNotify: (message: string) => void;
-                };
-                sharedState: {
-                    message: string;
-                };
-            }, undefined>>,
             import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
                 pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
                 sharedState: {
@@ -473,6 +457,14 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                 };
                 sharedState: import("@atlaskit/editor-common/selection").SelectionSharedState;
             }, import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined>,
+            import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
+                dependencies: [
+                ];
+                actions: {
+                    ariaNotify: (message: string, ariaLiveElementAttributes?: import("@atlaskit/editor-plugin-accessibility-utils").AriaLiveElementAttributes | undefined) => void;
+                };
+                sharedState: import("@atlaskit/editor-plugin-accessibility-utils").AccessibilityUtilsPluginState;
+            }, undefined>>,
             import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"media", {
                 pluginConfiguration: any;
                 dependencies: any;

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

@@ -41,16 +41,6 @@ export declare const TableFloatingControls: ({ editorView, tableRef, tableNode,
                 insertTableWithSize: (rowsCount: number, colsCount: number, inputMethod?: import("@atlaskit/editor-common/analytics").INPUT_METHOD.PICKER | undefined) => import("@atlaskit/editor-common/types").EditorCommand;
             };
             dependencies: [
-                import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
-                    dependencies: [
-                    ];
-                    actions: {
-                        ariaNotify: (message: string) => void;
-                    };
-                    sharedState: {
-                        message: string;
-                    };
-                }, undefined>>,
                 import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
                     pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
                     sharedState: {
@@ -108,6 +98,14 @@ export declare const TableFloatingControls: ({ editorView, tableRef, tableNode,
                     };
                     sharedState: import("@atlaskit/editor-common/selection").SelectionSharedState;
                 }, import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined>,
+                import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
+                    dependencies: [
+                    ];
+                    actions: {
+                        ariaNotify: (message: string, ariaLiveElementAttributes?: import("@atlaskit/editor-plugin-accessibility-utils").AriaLiveElementAttributes | undefined) => void;
+                    };
+                    sharedState: import("@atlaskit/editor-plugin-accessibility-utils").AccessibilityUtilsPluginState;
+                }, undefined>>,
                 import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"media", {
                     pluginConfiguration: any;
                     dependencies: any;
@@ -168,16 +166,6 @@ export declare const TableFloatingControls: ({ editorView, tableRef, tableNode,
                 } | undefined>>
             ];
         }, import("../../plugin").TablePluginOptions | undefined>,
-        import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
-            dependencies: [
-            ];
-            actions: {
-                ariaNotify: (message: string) => void;
-            };
-            sharedState: {
-                message: string;
-            };
-        }, undefined>>,
         import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
             pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
             sharedState: {
@@ -235,6 +223,14 @@ export declare const TableFloatingControls: ({ editorView, tableRef, tableNode,
             };
             sharedState: import("@atlaskit/editor-common/selection").SelectionSharedState;
         }, import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined>,
+        import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"accessibilityUtils", {
+            dependencies: [
+            ];
+            actions: {
+                ariaNotify: (message: string, ariaLiveElementAttributes?: import("@atlaskit/editor-plugin-accessibility-utils").AriaLiveElementAttributes | undefined) => void;
+            };
+            sharedState: import("@atlaskit/editor-plugin-accessibility-utils").AccessibilityUtilsPluginState;
+        }, undefined>>,
         import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"media", {
             pluginConfiguration: any;
             dependencies: any;

package/dist/types-ts4.5/utils/index.d.ts

@@ -1,13 +1,13 @@
 export { getSelectedColumnIndexes, getSelectedRowIndexes, normalizeSelection, isSelectionUpdated, } from './selection';
 export { findControlsHoverDecoration, createControlsHoverDecoration, createColumnControlsDecoration, createColumnSelectedDecoration, createCellHoverDecoration, updateDecorations, createResizeHandleDecoration, createColumnInsertLine, createColumnLineResize, createRowInsertLine, } from './decoration';
-export { isIsolating, containsHeaderColumn, containsHeaderRow, checkIfHeaderColumnEnabled, checkIfHeaderRowEnabled, checkIfNumberColumnEnabled, getTableWidth, tablesHaveDifferentColumnWidths, tablesHaveDifferentNoOfColumns, isTableNested, anyChildCellMergedAcrossRow, supportedHeaderRow, } from './nodes';
+export { isIsolating, containsHeaderColumn, containsHeaderRow, checkIfHeaderColumnEnabled, checkIfHeaderRowEnabled, checkIfNumberColumnEnabled, getTableWidth, tablesHaveDifferentColumnWidths, tablesHaveDifferentNoOfColumns, tablesHaveDifferentNoOfRows, isTableNested, anyChildCellMergedAcrossRow, supportedHeaderRow, } from './nodes';
 export { unwrapContentFromTable, removeTableFromFirstChild, removeTableFromLastChild, transformSliceToRemoveOpenTable, transformSliceToCorrectEmptyTableCells, transformSliceToFixHardBreakProblemOnCopyFromCell, } from './paste';
 export { isCell, isCornerButton, isInsertRowButton, isColumnControlsDecorations, isTableControlsButton, isTableContainerOrWrapper, isRowControlsButton, isDragRowControlsButton, isDragColumnFloatingInsertDot, isDragRowFloatingInsertDot, isDragCornerButton, getColumnOrRowIndex, getMousePositionHorizontalRelativeByElement, getMousePositionVerticalRelativeByElement, isResizeHandleDecoration, hasResizeHandler, findNearestCellIndexToPoint, } from './dom';
 export { convertHTMLCellIndexToColumnIndex, getColumnsWidths, isColumnDeleteButtonVisible, getColumnDeleteButtonParams, getColumnClassNames, getColumnIndexMappedToColumnIndexInFirstRow, } from './column-controls';
 export { getRowHeights, isRowDeleteButtonVisible, getRowDeleteButtonParams, getRowsParams, getRowClassNames, copyPreviousRow, } from './row-controls';
 export type { RowParams } from './row-controls';
 export { getSelectedTableInfo, getSelectedCellInfo } from './analytics';
-export { getMergedCellsPositions } from './table';
+export { getMergedCellsPositions, getAssistiveMessage } from './table';
 export { updatePluginStateDecorations } from './update-plugin-state-decorations';
 export { hasMergedCellsInColumn, hasMergedCellsInRow, hasMergedCellsInBetween, hasMergedCellsInSelection, findDuplicatePosition, checkEdgeHasMergedCells, } from './merged-cells';
 export { createTableWithWidth } from './create';

package/dist/types-ts4.5/utils/nodes.d.ts

@@ -9,6 +9,7 @@ export declare const checkIfNumberColumnEnabled: (selection: Selection) => boole
 export declare const getTableWidth: (node: PmNode) => number;
 export declare const tablesHaveDifferentColumnWidths: (currentTable: PmNode, previousTable: PmNode) => boolean;
 export declare const tablesHaveDifferentNoOfColumns: (currentTable: PmNode, previousTable: PmNode) => boolean;
+export declare const tablesHaveDifferentNoOfRows: (currentTable: PmNode, previousTable: PmNode) => boolean;
 export declare const isTableNested: (state: EditorState, tablePos?: number) => boolean;
 export declare const anyChildCellMergedAcrossRow: (node: PmNode) => boolean;
 /**

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

@@ -1,4 +1,7 @@
+import type { IntlShape } from 'react-intl-next';
+import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { Rect } from '@atlaskit/editor-tables/table-map';
 export declare const getMergedCellsPositions: (tr: Transaction) => number[];
 export declare const colsToRect: (cols: Array<number>, noOfRows: number) => Rect;
+export declare const getAssistiveMessage: (prevTableNode: PmNode, currentTableNode: PmNode, intl: IntlShape) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "7.9.0",
+  "version": "7.10.0",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/src/commands/column-resize.ts

@@ -6,6 +6,7 @@ import type {
   Command,
   GetEditorContainerWidth,
 } from '@atlaskit/editor-common/types';
+import type { AriaLiveElementAttributes } from '@atlaskit/editor-plugin-accessibility-utils';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import { TableMap } from '@atlaskit/editor-tables';
 import type { CellAttributes, Direction } from '@atlaskit/editor-tables/types';
@@ -129,7 +130,10 @@ export const initiateKeyboardColumnResizing =
     ariaNotify,
     getIntl,
   }: {
-    ariaNotify?: (message: string) => void;
+    ariaNotify?: (
+      message: string,
+      ariaLiveElementAttributes?: AriaLiveElementAttributes,
+    ) => void;
     getIntl?: () => IntlShape;
   }): Command =>
   (state, dispatch, view) => {
@@ -144,7 +148,9 @@ export const initiateKeyboardColumnResizing =
     const cell = findCellClosestToPos(selection.$from);
 
     if (ariaNotify && getIntl) {
-      ariaNotify(getIntl().formatMessage(messages.startedColumnResize));
+      ariaNotify(getIntl().formatMessage(messages.startedColumnResize), {
+        priority: 'important',
+      });
     }
 
     if (selectionRect && cell && view) {
@@ -164,7 +170,10 @@ export const activateNextResizeArea =
     getIntl,
   }: {
     direction: Direction;
-    ariaNotify?: (message: string) => void;
+    ariaNotify?: (
+      message: string,
+      ariaLiveElementAttributes?: AriaLiveElementAttributes,
+    ) => void;
     getIntl?: () => IntlShape;
   }): Command =>
   (state, dispatch, view) => {
@@ -210,6 +219,7 @@ export const activateNextResizeArea =
           getIntl().formatMessage(messages.focusedOtherResize, {
             direction: 'right',
           }),
+          { priority: 'important' },
         );
       }
 
@@ -218,6 +228,7 @@ export const activateNextResizeArea =
           getIntl().formatMessage(messages.focusedOtherResize, {
             direction: 'left',
           }),
+          { priority: 'important' },
         );
       }
     }
@@ -275,7 +286,10 @@ export const changeColumnWidthByStep =
     stepSize: number;
     getEditorContainerWidth: GetEditorContainerWidth;
     isTableScalingEnabled: boolean;
-    ariaNotify?: (message: string) => void;
+    ariaNotify?: (
+      message: string,
+      ariaLiveElementAttributes?: AriaLiveElementAttributes,
+    ) => void;
     getIntl?: () => IntlShape;
     originalTr?: Transaction;
   }): Command =>
@@ -381,10 +395,14 @@ export const changeColumnWidthByStep =
 
       if (newResizeState.cols.length === colIndex + 1) {
         if (newResizeState.overflow === true) {
-          ariaNotify(getIntl().formatMessage(messages.columnResizeLast));
+          ariaNotify(getIntl().formatMessage(messages.columnResizeLast), {
+            priority: 'important',
+          });
         }
         if (newResizeState.overflow === false) {
-          ariaNotify(getIntl().formatMessage(messages.columnResizeOverflow));
+          ariaNotify(getIntl().formatMessage(messages.columnResizeOverflow), {
+            priority: 'important',
+          });
         }
       }
     }
@@ -398,7 +416,10 @@ export const stopKeyboardColumnResizing =
     getIntl,
     originalTr,
   }: {
-    ariaNotify?: (message: string) => void;
+    ariaNotify?: (
+      message: string,
+      ariaLiveElementAttributes?: AriaLiveElementAttributes,
+    ) => void;
     getIntl?: () => IntlShape;
     originalTr?: Transaction;
   }): Command =>
@@ -439,7 +460,9 @@ export const stopKeyboardColumnResizing =
       () => customTr.setMeta('scrollIntoView', false),
     )(state, fakeDispatch);
     if (ariaNotify && getIntl) {
-      ariaNotify(getIntl().formatMessage(messages.columnResizeStop));
+      ariaNotify(getIntl().formatMessage(messages.columnResizeStop), {
+        priority: 'important',
+      });
     }
 
     if (dispatch) {

package/src/nodeviews/TableComponent.tsx

@@ -4,6 +4,8 @@ import React from 'react';
 import classnames from 'classnames';
 import memoizeOne from 'memoize-one';
 import rafSchedule from 'raf-schd';
+import type { IntlShape } from 'react-intl-next';
+import { injectIntl } from 'react-intl-next';
 
 import type { TableColumnOrdering } from '@atlaskit/custom-steps';
 import {
@@ -61,9 +63,11 @@ import TableFloatingColumnControls from '../ui/TableFloatingColumnControls';
 import TableFloatingControls from '../ui/TableFloatingControls';
 import {
   containsHeaderRow,
+  getAssistiveMessage,
   isTableNested,
   tablesHaveDifferentColumnWidths,
   tablesHaveDifferentNoOfColumns,
+  tablesHaveDifferentNoOfRows,
 } from '../utils';
 
 import { ExternalDropTargets } from './ExternalDropTargets';
@@ -106,6 +110,7 @@ export interface ComponentProps {
   getEditorFeatureFlags: GetEditorFeatureFlags;
   dispatchAnalyticsEvent: DispatchAnalyticsEvent;
   pluginInjectionApi?: PluginInjectionAPI;
+  intl: IntlShape;
 
   // marking props as option to ensure backward compatibility when platform.editor.table.use-shared-state-hook disabled
   isInDanger?: boolean;
@@ -442,6 +447,21 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
     }
 
     const currentTable = getNode();
+    const previousTable = this.node;
+    const isNoOfColumnsChanged = tablesHaveDifferentNoOfColumns(
+      currentTable,
+      previousTable,
+    );
+    const isNoOfRowsChanged = tablesHaveDifferentNoOfRows(
+      currentTable,
+      previousTable,
+    );
+    if (isNoOfColumnsChanged || isNoOfRowsChanged) {
+      this.props.pluginInjectionApi?.accessibilityUtils?.actions.ariaNotify(
+        getAssistiveMessage(previousTable, currentTable, this.props.intl),
+        { priority: 'important' },
+      );
+    }
     if (currentTable.attrs.__autoSize) {
       // Wait for next tick to handle auto sizing, gives the browser time to do layout calc etc.
       this.handleAutoSizeDebounced();
@@ -451,11 +471,6 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
     else if (allowColumnResizing && this.table && !isMediaFullscreen) {
       // If col widths (e.g. via collab) or number of columns (e.g. delete a column) have changed,
       // re-draw colgroup.
-      const previousTable = this.node;
-      const isNoOfColumnsChanged = tablesHaveDifferentNoOfColumns(
-        currentTable,
-        previousTable,
-      );
       if (
         tablesHaveDifferentColumnWidths(currentTable, previousTable) ||
         isNoOfColumnsChanged
@@ -1044,4 +1059,4 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
   private handleWindowResizeDebounced = rafSchedule(this.handleWindowResize);
 }
 
-export default TableComponent;
+export default injectIntl(TableComponent);

package/src/plugin.tsx

@@ -131,12 +131,12 @@ export type TablePlugin = NextEditorPlugin<
       ) => EditorCommand;
     };
     dependencies: [
-      OptionalPlugin<AccessibilityUtilsPlugin>,
       AnalyticsPlugin,
       ContentInsertionPlugin,
       WidthPlugin,
       GuidelinePlugin,
       SelectionPlugin,
+      OptionalPlugin<AccessibilityUtilsPlugin>,
       OptionalPlugin<MediaPlugin>,
       OptionalPlugin<EditorViewModePlugin>,
     ];

package/src/utils/index.ts

@@ -26,6 +26,7 @@ export {
   getTableWidth,
   tablesHaveDifferentColumnWidths,
   tablesHaveDifferentNoOfColumns,
+  tablesHaveDifferentNoOfRows,
   isTableNested,
   anyChildCellMergedAcrossRow,
   supportedHeaderRow,
@@ -75,7 +76,7 @@ export {
 } from './row-controls';
 export type { RowParams } from './row-controls';
 export { getSelectedTableInfo, getSelectedCellInfo } from './analytics';
-export { getMergedCellsPositions } from './table';
+export { getMergedCellsPositions, getAssistiveMessage } from './table';
 export { updatePluginStateDecorations } from './update-plugin-state-decorations';
 export {
   hasMergedCellsInColumn,

package/src/utils/nodes.ts

@@ -94,6 +94,16 @@ export const tablesHaveDifferentNoOfColumns = (
   return prevMap.width !== currentMap.width;
 };
 
+export const tablesHaveDifferentNoOfRows = (
+  currentTable: PmNode,
+  previousTable: PmNode,
+): boolean => {
+  const prevMap = TableMap.get(previousTable);
+  const currentMap = TableMap.get(currentTable);
+
+  return prevMap.height !== currentMap.height;
+};
+
 function filterNearSelection<T, U>(
   selection: Selection,
   findNode: (selection: Selection) => { pos: number; node: PmNode } | undefined,

package/src/utils/table.ts

@@ -1,3 +1,7 @@
+import type { IntlShape } from 'react-intl-next';
+
+import { tableMessages as messages } from '@atlaskit/editor-common/messages';
+import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { Rect } from '@atlaskit/editor-tables/table-map';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
@@ -30,3 +34,35 @@ export const colsToRect = (cols: Array<number>, noOfRows: number): Rect => ({
   top: 0,
   bottom: noOfRows,
 });
+
+export const getAssistiveMessage = (
+  prevTableNode: PmNode,
+  currentTableNode: PmNode,
+  intl: IntlShape,
+) => {
+  const { formatMessage } = intl;
+  const prevTableMap = TableMap.get(prevTableNode);
+  const currentTableMap = TableMap.get(currentTableNode);
+
+  if (currentTableMap.width !== prevTableMap.width) {
+    const diff = Math.abs(currentTableMap.width - prevTableMap.width);
+    if (currentTableMap.width > prevTableMap.width) {
+      return formatMessage(messages.columnsAreInserted, { count: diff });
+    }
+    if (currentTableMap.width < prevTableMap.width) {
+      return formatMessage(messages.columnsAreRemoved, { count: diff });
+    }
+  }
+
+  if (currentTableMap.height !== prevTableMap.height) {
+    const diff = Math.abs(currentTableMap.height - prevTableMap.height);
+    if (currentTableMap.height > prevTableMap.height) {
+      return formatMessage(messages.rowsAreInserted, { count: diff });
+    }
+    if (currentTableMap.height < prevTableMap.height) {
+      return formatMessage(messages.rowsAreRemoved, { count: diff });
+    }
+  }
+
+  return '';
+};