@atlaskit/editor-plugin-table 7.24.6 → 7.24.8

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/editor-plugin-table
 
+## 7.24.8
+
+### Patch Changes
+
+- [#127766](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/127766)
+  [`8a9803d7d9555`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8a9803d7d9555) -
+  ED-24425: Fixed the drag handle show hover state when hover delete column on the next column/row
+
+## 7.24.7
+
+### Patch Changes
+
+- [#127699](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/127699)
+  [`7fa3a110dc3b6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/7fa3a110dc3b6) -
+  Add analytics to track usage of dark mode header cell fix.
+- Updated dependencies
+
 ## 7.24.6
 
 ### Patch Changes

package/dist/cjs/nodeviews/TableCell.js

@@ -14,6 +14,7 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _adfSchema = require("@atlaskit/adf-schema");
+var _analytics = require("@atlaskit/editor-common/analytics");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _TableNodeViewBase = _interopRequireDefault(require("./TableNodeViewBase"));
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
@@ -45,7 +46,7 @@ var cssVariablePattern = /^VAR\(--.*\)$/;
 var TableCell = exports.default = /*#__PURE__*/function (_TableNodeView) {
   (0, _inherits2.default)(TableCell, _TableNodeView);
   var _super = _createSuper(TableCell);
-  function TableCell(node, view, getPos, eventDispatcher) {
+  function TableCell(node, view, getPos, eventDispatcher, editorAnalyticsAPI) {
     var _this;
     (0, _classCallCheck2.default)(this, TableCell);
     _this = _super.call(this, node, view, getPos, eventDispatcher);
@@ -72,9 +73,17 @@ var TableCell = exports.default = /*#__PURE__*/function (_TableNodeView) {
       _this.delayHandle = delayUntilIdle(function () {
         var pos = getPos();
         if (pos) {
-          view.dispatch(view.state.tr.setNodeAttribute(pos, 'background', node.attrs.background.toLowerCase())
+          var tr = view.state.tr;
+          tr.setNodeAttribute(pos, 'background', node.attrs.background.toLowerCase())
           // Ensures dispatch does not contribute to undo history (otherwise user requires multiple undo's to revert table)
-          .setMeta('addToHistory', false));
+          .setMeta('addToHistory', false);
+          editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
+            action: _analytics.TABLE_ACTION.TABLE_CELL_BACKGROUND_FIXED,
+            actionSubject: _analytics.ACTION_SUBJECT.TABLE,
+            actionSubjectId: null,
+            eventType: _analytics.EVENT_TYPE.TRACK
+          })(tr);
+          view.dispatch(tr);
         }
       });
     }

package/dist/cjs/nodeviews/lazy-node-views.js

@@ -52,7 +52,8 @@ var lazyTableView = exports.lazyTableView = function lazyTableView(options) {
 var lazyTableCellView = exports.lazyTableCellView = function lazyTableCellView(options) {
   if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
     return function (node, view, getPos) {
-      return new _TableCell.default(node, view, getPos, options.eventDispatcher);
+      var _options$pluginInject;
+      return new _TableCell.default(node, view, getPos, options.eventDispatcher, (_options$pluginInject = options.pluginInjectionApi) === null || _options$pluginInject === void 0 || (_options$pluginInject = _options$pluginInject.analytics) === null || _options$pluginInject === void 0 ? void 0 : _options$pluginInject.actions);
     };
   }
   var loader = function loader() {
@@ -62,9 +63,11 @@ var lazyTableCellView = exports.lazyTableCellView = function lazyTableCellView(o
     }).then(function (_ref2) {
       var TableCell = _ref2.default;
       return function (node, view, getPos, decorations, getNodeViewOptions) {
+        var _pluginInjectionApi$a;
         var _getNodeViewOptions2 = getNodeViewOptions(),
-          eventDispatcher = _getNodeViewOptions2.eventDispatcher;
-        return new TableCell(node, view, getPos, eventDispatcher);
+          eventDispatcher = _getNodeViewOptions2.eventDispatcher,
+          pluginInjectionApi = _getNodeViewOptions2.pluginInjectionApi;
+        return new TableCell(node, view, getPos, eventDispatcher, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions);
       };
     });
     return result;
@@ -80,7 +83,8 @@ var lazyTableCellView = exports.lazyTableCellView = function lazyTableCellView(o
 var lazyTableHeaderView = exports.lazyTableHeaderView = function lazyTableHeaderView(options) {
   if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
     return function (node, view, getPos) {
-      return new _TableCell.default(node, view, getPos, options.eventDispatcher);
+      var _options$pluginInject2;
+      return new _TableCell.default(node, view, getPos, options.eventDispatcher, (_options$pluginInject2 = options.pluginInjectionApi) === null || _options$pluginInject2 === void 0 || (_options$pluginInject2 = _options$pluginInject2.analytics) === null || _options$pluginInject2 === void 0 ? void 0 : _options$pluginInject2.actions);
     };
   }
   var loader = function loader() {
@@ -90,9 +94,11 @@ var lazyTableHeaderView = exports.lazyTableHeaderView = function lazyTableHeader
     }).then(function (_ref3) {
       var TableCell = _ref3.default;
       return function (node, view, getPos, decorations, getNodeViewOptions) {
+        var _pluginInjectionApi$a2;
         var _getNodeViewOptions3 = getNodeViewOptions(),
-          eventDispatcher = _getNodeViewOptions3.eventDispatcher;
-        return new TableCell(node, view, getPos, eventDispatcher);
+          eventDispatcher = _getNodeViewOptions3.eventDispatcher,
+          pluginInjectionApi = _getNodeViewOptions3.pluginInjectionApi;
+        return new TableCell(node, view, getPos, eventDispatcher, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions);
       };
     });
     return result;

package/dist/cjs/pm-plugins/main.js

@@ -267,10 +267,12 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
           eventDispatcher: eventDispatcher
         }),
         tableCell: (0, _lazyNodeViews.lazyTableCellView)({
-          eventDispatcher: eventDispatcher
+          eventDispatcher: eventDispatcher,
+          pluginInjectionApi: pluginInjectionApi
         }),
         tableHeader: (0, _lazyNodeViews.lazyTableHeaderView)({
-          eventDispatcher: eventDispatcher
+          eventDispatcher: eventDispatcher,
+          pluginInjectionApi: pluginInjectionApi
         })
       },
       handleDOMEvents: {

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

@@ -60,8 +60,11 @@ var DragHandleComponent = function DragHandleComponent(_ref) {
     isDragMenuOpen = _getDnDPluginState.isDragMenuOpen;
   var isRow = direction === 'row';
   var isColumn = direction === 'column';
-  var isRowHandleHovered = isRow && hoveredRows.length > 0;
-  var isColumnHandleHovered = isColumn && hoveredColumns.length > 0;
+
+  // Added !isDragMenuOpen check so when hover 'Delete column/row' from drag menu
+  // the handle of the next column/row does not show the 'hovered' state icon
+  var isRowHandleHovered = isRow && hoveredRows.length > 0 && !isDragMenuOpen;
+  var isColumnHandleHovered = isColumn && hoveredColumns.length > 0 && !isDragMenuOpen;
   var hasMergedCells = (0, _react.useMemo)(function () {
     var table = (0, _editorTables.findTable)(selection);
     if (!table) {

package/dist/es2019/nodeviews/TableCell.js

@@ -1,5 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { getCellAttrs, getCellDomAttrs } from '@atlaskit/adf-schema';
+import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
 import { fg } from '@atlaskit/platform-feature-flags';
 import TableNodeView from './TableNodeViewBase';
 const DEFAULT_COL_SPAN = 1;
@@ -23,7 +24,7 @@ function delayUntilIdle(cb) {
 }
 const cssVariablePattern = /^VAR\(--.*\)$/;
 export default class TableCell extends TableNodeView {
-  constructor(node, view, getPos, eventDispatcher) {
+  constructor(node, view, getPos, eventDispatcher, editorAnalyticsAPI) {
     super(node, view, getPos, eventDispatcher);
 
     // CONFCLOUD-78239: Previously we had a bug which tried to invert the heading colour of a table
@@ -48,9 +49,17 @@ export default class TableCell extends TableNodeView {
       this.delayHandle = delayUntilIdle(() => {
         const pos = getPos();
         if (pos) {
-          view.dispatch(view.state.tr.setNodeAttribute(pos, 'background', node.attrs.background.toLowerCase())
+          const tr = view.state.tr;
+          tr.setNodeAttribute(pos, 'background', node.attrs.background.toLowerCase())
           // Ensures dispatch does not contribute to undo history (otherwise user requires multiple undo's to revert table)
-          .setMeta('addToHistory', false));
+          .setMeta('addToHistory', false);
+          editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
+            action: TABLE_ACTION.TABLE_CELL_BACKGROUND_FIXED,
+            actionSubject: ACTION_SUBJECT.TABLE,
+            actionSubjectId: null,
+            eventType: EVENT_TYPE.TRACK
+          })(tr);
+          view.dispatch(tr);
         }
       });
     }

package/dist/es2019/nodeviews/lazy-node-views.js

@@ -41,7 +41,8 @@ export const lazyTableView = options => {
 export const lazyTableCellView = options => {
   if (!fg('platform_editor_lazy-node-views')) {
     return (node, view, getPos) => {
-      return new TableCell(node, view, getPos, options.eventDispatcher);
+      var _options$pluginInject, _options$pluginInject2;
+      return new TableCell(node, view, getPos, options.eventDispatcher, (_options$pluginInject = options.pluginInjectionApi) === null || _options$pluginInject === void 0 ? void 0 : (_options$pluginInject2 = _options$pluginInject.analytics) === null || _options$pluginInject2 === void 0 ? void 0 : _options$pluginInject2.actions);
     };
   }
   const loader = () => {
@@ -50,10 +51,12 @@ export const lazyTableCellView = options => {
       default: TableCell
     }) => {
       return (node, view, getPos, decorations, getNodeViewOptions) => {
+        var _pluginInjectionApi$a;
         const {
-          eventDispatcher
+          eventDispatcher,
+          pluginInjectionApi
         } = getNodeViewOptions();
-        return new TableCell(node, view, getPos, eventDispatcher);
+        return new TableCell(node, view, getPos, eventDispatcher, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions);
       };
     });
     return result;
@@ -67,7 +70,8 @@ export const lazyTableCellView = options => {
 export const lazyTableHeaderView = options => {
   if (!fg('platform_editor_lazy-node-views')) {
     return (node, view, getPos) => {
-      return new TableCell(node, view, getPos, options.eventDispatcher);
+      var _options$pluginInject3, _options$pluginInject4;
+      return new TableCell(node, view, getPos, options.eventDispatcher, (_options$pluginInject3 = options.pluginInjectionApi) === null || _options$pluginInject3 === void 0 ? void 0 : (_options$pluginInject4 = _options$pluginInject3.analytics) === null || _options$pluginInject4 === void 0 ? void 0 : _options$pluginInject4.actions);
     };
   }
   const loader = () => {
@@ -76,10 +80,12 @@ export const lazyTableHeaderView = options => {
       default: TableCell
     }) => {
       return (node, view, getPos, decorations, getNodeViewOptions) => {
+        var _pluginInjectionApi$a2;
         const {
-          eventDispatcher
+          eventDispatcher,
+          pluginInjectionApi
         } = getNodeViewOptions();
-        return new TableCell(node, view, getPos, eventDispatcher);
+        return new TableCell(node, view, getPos, eventDispatcher, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions);
       };
     });
     return result;

package/dist/es2019/pm-plugins/main.js

@@ -265,10 +265,12 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
           eventDispatcher
         }),
         tableCell: lazyTableCellView({
-          eventDispatcher
+          eventDispatcher,
+          pluginInjectionApi
         }),
         tableHeader: lazyTableHeaderView({
-          eventDispatcher
+          eventDispatcher,
+          pluginInjectionApi
         })
       },
       handleDOMEvents: {

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

@@ -51,8 +51,11 @@ const DragHandleComponent = ({
   } = getDnDPluginState(state);
   const isRow = direction === 'row';
   const isColumn = direction === 'column';
-  const isRowHandleHovered = isRow && hoveredRows.length > 0;
-  const isColumnHandleHovered = isColumn && hoveredColumns.length > 0;
+
+  // Added !isDragMenuOpen check so when hover 'Delete column/row' from drag menu
+  // the handle of the next column/row does not show the 'hovered' state icon
+  const isRowHandleHovered = isRow && hoveredRows.length > 0 && !isDragMenuOpen;
+  const isColumnHandleHovered = isColumn && hoveredColumns.length > 0 && !isDragMenuOpen;
   const hasMergedCells = useMemo(() => {
     const table = findTable(selection);
     if (!table) {

package/dist/esm/nodeviews/TableCell.js

@@ -9,6 +9,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import { getCellAttrs, getCellDomAttrs } from '@atlaskit/adf-schema';
+import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
 import { fg } from '@atlaskit/platform-feature-flags';
 import TableNodeView from './TableNodeViewBase';
 var DEFAULT_COL_SPAN = 1;
@@ -38,7 +39,7 @@ var cssVariablePattern = /^VAR\(--.*\)$/;
 var TableCell = /*#__PURE__*/function (_TableNodeView) {
   _inherits(TableCell, _TableNodeView);
   var _super = _createSuper(TableCell);
-  function TableCell(node, view, getPos, eventDispatcher) {
+  function TableCell(node, view, getPos, eventDispatcher, editorAnalyticsAPI) {
     var _this;
     _classCallCheck(this, TableCell);
     _this = _super.call(this, node, view, getPos, eventDispatcher);
@@ -65,9 +66,17 @@ var TableCell = /*#__PURE__*/function (_TableNodeView) {
       _this.delayHandle = delayUntilIdle(function () {
         var pos = getPos();
         if (pos) {
-          view.dispatch(view.state.tr.setNodeAttribute(pos, 'background', node.attrs.background.toLowerCase())
+          var tr = view.state.tr;
+          tr.setNodeAttribute(pos, 'background', node.attrs.background.toLowerCase())
           // Ensures dispatch does not contribute to undo history (otherwise user requires multiple undo's to revert table)
-          .setMeta('addToHistory', false));
+          .setMeta('addToHistory', false);
+          editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
+            action: TABLE_ACTION.TABLE_CELL_BACKGROUND_FIXED,
+            actionSubject: ACTION_SUBJECT.TABLE,
+            actionSubjectId: null,
+            eventType: EVENT_TYPE.TRACK
+          })(tr);
+          view.dispatch(tr);
         }
       });
     }

package/dist/esm/nodeviews/lazy-node-views.js

@@ -41,7 +41,8 @@ export var lazyTableView = function lazyTableView(options) {
 export var lazyTableCellView = function lazyTableCellView(options) {
   if (!fg('platform_editor_lazy-node-views')) {
     return function (node, view, getPos) {
-      return new TableCell(node, view, getPos, options.eventDispatcher);
+      var _options$pluginInject;
+      return new TableCell(node, view, getPos, options.eventDispatcher, (_options$pluginInject = options.pluginInjectionApi) === null || _options$pluginInject === void 0 || (_options$pluginInject = _options$pluginInject.analytics) === null || _options$pluginInject === void 0 ? void 0 : _options$pluginInject.actions);
     };
   }
   var loader = function loader() {
@@ -49,9 +50,11 @@ export var lazyTableCellView = function lazyTableCellView(options) {
     './TableCell').then(function (_ref2) {
       var TableCell = _ref2.default;
       return function (node, view, getPos, decorations, getNodeViewOptions) {
+        var _pluginInjectionApi$a;
         var _getNodeViewOptions2 = getNodeViewOptions(),
-          eventDispatcher = _getNodeViewOptions2.eventDispatcher;
-        return new TableCell(node, view, getPos, eventDispatcher);
+          eventDispatcher = _getNodeViewOptions2.eventDispatcher,
+          pluginInjectionApi = _getNodeViewOptions2.pluginInjectionApi;
+        return new TableCell(node, view, getPos, eventDispatcher, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions);
       };
     });
     return result;
@@ -67,7 +70,8 @@ export var lazyTableCellView = function lazyTableCellView(options) {
 export var lazyTableHeaderView = function lazyTableHeaderView(options) {
   if (!fg('platform_editor_lazy-node-views')) {
     return function (node, view, getPos) {
-      return new TableCell(node, view, getPos, options.eventDispatcher);
+      var _options$pluginInject2;
+      return new TableCell(node, view, getPos, options.eventDispatcher, (_options$pluginInject2 = options.pluginInjectionApi) === null || _options$pluginInject2 === void 0 || (_options$pluginInject2 = _options$pluginInject2.analytics) === null || _options$pluginInject2 === void 0 ? void 0 : _options$pluginInject2.actions);
     };
   }
   var loader = function loader() {
@@ -75,9 +79,11 @@ export var lazyTableHeaderView = function lazyTableHeaderView(options) {
     './TableCell').then(function (_ref3) {
       var TableCell = _ref3.default;
       return function (node, view, getPos, decorations, getNodeViewOptions) {
+        var _pluginInjectionApi$a2;
         var _getNodeViewOptions3 = getNodeViewOptions(),
-          eventDispatcher = _getNodeViewOptions3.eventDispatcher;
-        return new TableCell(node, view, getPos, eventDispatcher);
+          eventDispatcher = _getNodeViewOptions3.eventDispatcher,
+          pluginInjectionApi = _getNodeViewOptions3.pluginInjectionApi;
+        return new TableCell(node, view, getPos, eventDispatcher, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions);
       };
     });
     return result;

package/dist/esm/pm-plugins/main.js

@@ -260,10 +260,12 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
           eventDispatcher: eventDispatcher
         }),
         tableCell: lazyTableCellView({
-          eventDispatcher: eventDispatcher
+          eventDispatcher: eventDispatcher,
+          pluginInjectionApi: pluginInjectionApi
         }),
         tableHeader: lazyTableHeaderView({
-          eventDispatcher: eventDispatcher
+          eventDispatcher: eventDispatcher,
+          pluginInjectionApi: pluginInjectionApi
         })
       },
       handleDOMEvents: {

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

@@ -50,8 +50,11 @@ var DragHandleComponent = function DragHandleComponent(_ref) {
     isDragMenuOpen = _getDnDPluginState.isDragMenuOpen;
   var isRow = direction === 'row';
   var isColumn = direction === 'column';
-  var isRowHandleHovered = isRow && hoveredRows.length > 0;
-  var isColumnHandleHovered = isColumn && hoveredColumns.length > 0;
+
+  // Added !isDragMenuOpen check so when hover 'Delete column/row' from drag menu
+  // the handle of the next column/row does not show the 'hovered' state icon
+  var isRowHandleHovered = isRow && hoveredRows.length > 0 && !isDragMenuOpen;
+  var isColumnHandleHovered = isColumn && hoveredColumns.length > 0 && !isDragMenuOpen;
   var hasMergedCells = useMemo(function () {
     var table = findTable(selection);
     if (!table) {

package/dist/types/nodeviews/TableCell.d.ts

@@ -1,10 +1,11 @@
+import { type EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
 import TableNodeView from './TableNodeViewBase';
 export default class TableCell extends TableNodeView<HTMLElement> implements NodeView {
     private delayHandle;
-    constructor(node: PMNode, view: EditorView, getPos: () => number | undefined, eventDispatcher: EventDispatcher);
+    constructor(node: PMNode, view: EditorView, getPos: () => number | undefined, eventDispatcher: EventDispatcher, editorAnalyticsAPI: EditorAnalyticsAPI | undefined);
     destroy: () => void;
     update(node: PMNode): boolean;
     private updateNodeView;

package/dist/types/nodeviews/lazy-node-views.d.ts

@@ -21,6 +21,7 @@ type TableViewOptions = {
 export declare const lazyTableView: (options: TableViewOptions) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;
 type TableCellViewOptions = {
     eventDispatcher: EventDispatcher;
+    pluginInjectionApi?: PluginInjectionAPI;
 };
 export declare const lazyTableCellView: (options: TableCellViewOptions) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor | ((node: PMNode, view: EditorView, getPos: () => number | undefined) => TableCell);
 export declare const lazyTableHeaderView: (options: TableCellViewOptions) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor | ((node: PMNode, view: EditorView, getPos: () => number | undefined) => TableCell);

package/dist/types-ts4.5/nodeviews/TableCell.d.ts

@@ -1,10 +1,11 @@
+import { type EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
 import TableNodeView from './TableNodeViewBase';
 export default class TableCell extends TableNodeView<HTMLElement> implements NodeView {
     private delayHandle;
-    constructor(node: PMNode, view: EditorView, getPos: () => number | undefined, eventDispatcher: EventDispatcher);
+    constructor(node: PMNode, view: EditorView, getPos: () => number | undefined, eventDispatcher: EventDispatcher, editorAnalyticsAPI: EditorAnalyticsAPI | undefined);
     destroy: () => void;
     update(node: PMNode): boolean;
     private updateNodeView;

package/dist/types-ts4.5/nodeviews/lazy-node-views.d.ts

@@ -21,6 +21,7 @@ type TableViewOptions = {
 export declare const lazyTableView: (options: TableViewOptions) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;
 type TableCellViewOptions = {
     eventDispatcher: EventDispatcher;
+    pluginInjectionApi?: PluginInjectionAPI;
 };
 export declare const lazyTableCellView: (options: TableCellViewOptions) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor | ((node: PMNode, view: EditorView, getPos: () => number | undefined) => TableCell);
 export declare const lazyTableHeaderView: (options: TableCellViewOptions) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor | ((node: PMNode, view: EditorView, getPos: () => number | undefined) => TableCell);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "7.24.6",
+	"version": "7.24.8",
 	"description": "Table plugin for the @atlaskit/editor",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -31,7 +31,7 @@
 		"@atlaskit/adf-schema": "^40.3.0",
 		"@atlaskit/button": "^19.1.0",
 		"@atlaskit/custom-steps": "^0.6.0",
-		"@atlaskit/editor-common": "^87.4.0",
+		"@atlaskit/editor-common": "^87.5.0",
 		"@atlaskit/editor-palette": "1.6.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^1.2.0",
 		"@atlaskit/editor-plugin-analytics": "^1.6.0",
@@ -44,7 +44,7 @@
 		"@atlaskit/editor-shared-styles": "^2.13.0",
 		"@atlaskit/editor-tables": "^2.8.0",
 		"@atlaskit/icon": "^22.10.0",
-		"@atlaskit/menu": "^2.9.0",
+		"@atlaskit/menu": "^2.10.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@atlaskit/pragmatic-drag-and-drop": "^1.2.0",
 		"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^1.4.0",
@@ -53,7 +53,7 @@
 		"@atlaskit/theme": "^12.11.0",
 		"@atlaskit/toggle": "^13.2.0",
 		"@atlaskit/tokens": "^1.57.0",
-		"@atlaskit/tooltip": "^18.5.0",
+		"@atlaskit/tooltip": "^18.6.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
 		"classnames": "^2.2.5",

package/src/nodeviews/TableCell.ts

@@ -1,5 +1,11 @@
 import type { CellDomAttrs } from '@atlaskit/adf-schema';
 import { getCellAttrs, getCellDomAttrs } from '@atlaskit/adf-schema';
+import {
+	ACTION_SUBJECT,
+	type EditorAnalyticsAPI,
+	EVENT_TYPE,
+	TABLE_ACTION,
+} from '@atlaskit/editor-common/analytics';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
@@ -35,6 +41,7 @@ export default class TableCell extends TableNodeView<HTMLElement> implements Nod
 		view: EditorView,
 		getPos: () => number | undefined,
 		eventDispatcher: EventDispatcher,
+		editorAnalyticsAPI: EditorAnalyticsAPI | undefined,
 	) {
 		super(node, view, getPos, eventDispatcher);
 
@@ -55,12 +62,17 @@ export default class TableCell extends TableNodeView<HTMLElement> implements Nod
 			this.delayHandle = delayUntilIdle(() => {
 				const pos = getPos();
 				if (pos) {
-					view.dispatch(
-						view.state.tr
-							.setNodeAttribute(pos, 'background', node.attrs.background.toLowerCase())
-							// Ensures dispatch does not contribute to undo history (otherwise user requires multiple undo's to revert table)
-							.setMeta('addToHistory', false),
-					);
+					const tr = view.state.tr;
+					tr.setNodeAttribute(pos, 'background', node.attrs.background.toLowerCase())
+						// Ensures dispatch does not contribute to undo history (otherwise user requires multiple undo's to revert table)
+						.setMeta('addToHistory', false);
+					editorAnalyticsAPI?.attachAnalyticsEvent({
+						action: TABLE_ACTION.TABLE_CELL_BACKGROUND_FIXED,
+						actionSubject: ACTION_SUBJECT.TABLE,
+						actionSubjectId: null,
+						eventType: EVENT_TYPE.TRACK,
+					})(tr);
+					view.dispatch(tr);
 				}
 			});
 		}

package/src/nodeviews/lazy-node-views.ts

@@ -98,11 +98,18 @@ export const lazyTableView = (options: TableViewOptions) => {
 
 type TableCellViewOptions = {
 	eventDispatcher: EventDispatcher;
+	pluginInjectionApi?: PluginInjectionAPI;
 };
 export const lazyTableCellView = (options: TableCellViewOptions) => {
 	if (!fg('platform_editor_lazy-node-views')) {
 		return (node: PMNode, view: EditorView, getPos: () => number | undefined) => {
-			return new TableCell(node, view, getPos, options.eventDispatcher);
+			return new TableCell(
+				node,
+				view,
+				getPos,
+				options.eventDispatcher,
+				options.pluginInjectionApi?.analytics?.actions,
+			);
 		};
 	}
 
@@ -118,9 +125,15 @@ export const lazyTableCellView = (options: TableCellViewOptions) => {
 				decorations: readonly Decoration[],
 				getNodeViewOptions: () => TableCellViewOptions,
 			) => {
-				const { eventDispatcher } = getNodeViewOptions();
+				const { eventDispatcher, pluginInjectionApi } = getNodeViewOptions();
 
-				return new TableCell(node, view, getPos, eventDispatcher);
+				return new TableCell(
+					node,
+					view,
+					getPos,
+					eventDispatcher,
+					pluginInjectionApi?.analytics?.actions,
+				);
 			};
 		});
 
@@ -137,7 +150,13 @@ export const lazyTableCellView = (options: TableCellViewOptions) => {
 export const lazyTableHeaderView = (options: TableCellViewOptions) => {
 	if (!fg('platform_editor_lazy-node-views')) {
 		return (node: PMNode, view: EditorView, getPos: () => number | undefined) => {
-			return new TableCell(node, view, getPos, options.eventDispatcher);
+			return new TableCell(
+				node,
+				view,
+				getPos,
+				options.eventDispatcher,
+				options.pluginInjectionApi?.analytics?.actions,
+			);
 		};
 	}
 
@@ -153,9 +172,15 @@ export const lazyTableHeaderView = (options: TableCellViewOptions) => {
 				decorations: readonly Decoration[],
 				getNodeViewOptions: () => TableCellViewOptions,
 			) => {
-				const { eventDispatcher } = getNodeViewOptions();
+				const { eventDispatcher, pluginInjectionApi } = getNodeViewOptions();
 
-				return new TableCell(node, view, getPos, eventDispatcher);
+				return new TableCell(
+					node,
+					view,
+					getPos,
+					eventDispatcher,
+					pluginInjectionApi?.analytics?.actions,
+				);
 			};
 		});
 

package/src/pm-plugins/main.ts

@@ -364,8 +364,8 @@ export const createPlugin = (
 					isChromelessEditor,
 				}),
 				tableRow: lazyTableRowView({ eventDispatcher }),
-				tableCell: lazyTableCellView({ eventDispatcher }),
-				tableHeader: lazyTableHeaderView({ eventDispatcher }),
+				tableCell: lazyTableCellView({ eventDispatcher, pluginInjectionApi }),
+				tableHeader: lazyTableHeaderView({ eventDispatcher, pluginInjectionApi }),
 			},
 			handleDOMEvents: {
 				focus: handleFocus,

package/src/ui/DragHandle/index.tsx

@@ -77,8 +77,10 @@ const DragHandleComponent = ({
 	const isRow = direction === 'row';
 	const isColumn = direction === 'column';
 
-	const isRowHandleHovered = isRow && hoveredRows.length > 0;
-	const isColumnHandleHovered = isColumn && hoveredColumns.length > 0;
+	// Added !isDragMenuOpen check so when hover 'Delete column/row' from drag menu
+	// the handle of the next column/row does not show the 'hovered' state icon
+	const isRowHandleHovered = isRow && hoveredRows.length > 0 && !isDragMenuOpen;
+	const isColumnHandleHovered = isColumn && hoveredColumns.length > 0 && !isDragMenuOpen;
 
 	const hasMergedCells = useMemo(() => {
 		const table = findTable(selection);