@atlaskit/editor-plugin-table 5.3.30 → 5.3.31

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/editor-plugin-table
 
+## 5.3.31
+
+### Patch Changes
+
+- [#43131](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/43131) [`31f8285fa54`](https://bitbucket.org/atlassian/atlassian-frontend/commits/31f8285fa54) - Fix hover other table in same page will also update cell position issue in selected table.
+
 ## 5.3.30
 
 ### Patch Changes

package/dist/cjs/plugins/table/event-handlers.js

@@ -332,17 +332,25 @@ var whenTableInFocus = exports.whenTableInFocus = function whenTableInFocus(even
   };
 };
 var trackCellLocation = function trackCellLocation(view, mouseEvent) {
+  var _tableElement$dataset;
   var target = mouseEvent.target;
   var maybeTableCell = (0, _utils.isElementInTableCell)(target);
   var tableRef = (0, _pluginFactory2.getPluginState)(view.state).tableRef;
+  var _getPluginState8 = (0, _pluginFactory2.getPluginState)(view.state),
+    hoveredCell = _getPluginState8.hoveredCell,
+    tableNode = _getPluginState8.tableNode;
+  var tableElement = (0, _utils.closestElement)(target, 'table');
+
+  // hover will only trigger if target localId is the same with selected localId
+  if (tableElement !== null && tableElement !== void 0 && (_tableElement$dataset = tableElement.dataset) !== null && _tableElement$dataset !== void 0 && _tableElement$dataset.tableLocalId && tableElement.dataset.tableLocalId !== (tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.localId)) {
+    return;
+  }
   if (!maybeTableCell || !tableRef) {
     return;
   }
   var colIndex = maybeTableCell.cellIndex;
   var rowElement = (0, _utils.closestElement)(target, 'tr');
   var rowIndex = rowElement && rowElement.rowIndex;
-  var _getPluginState8 = (0, _pluginFactory2.getPluginState)(view.state),
-    hoveredCell = _getPluginState8.hoveredCell;
   var colHeight = tableRef.offsetHeight;
   var colWidth = maybeTableCell.offsetWidth;
   if (hoveredCell.colIndex !== colIndex || hoveredCell.rowIndex !== rowIndex || hoveredCell.colWidth !== colWidth || hoveredCell.colHeight !== colHeight) {

package/dist/es2019/plugins/table/event-handlers.js

@@ -339,18 +339,26 @@ export const whenTableInFocus = (eventHandler, elementContentRects) => (view, mo
   return eventHandler(view, mouseEvent, elementContentRects);
 };
 const trackCellLocation = (view, mouseEvent) => {
+  var _tableElement$dataset;
   const target = mouseEvent.target;
   const maybeTableCell = isElementInTableCell(target);
   const tableRef = getPluginState(view.state).tableRef;
+  const {
+    hoveredCell,
+    tableNode
+  } = getPluginState(view.state);
+  const tableElement = closestElement(target, 'table');
+
+  // hover will only trigger if target localId is the same with selected localId
+  if (tableElement !== null && tableElement !== void 0 && (_tableElement$dataset = tableElement.dataset) !== null && _tableElement$dataset !== void 0 && _tableElement$dataset.tableLocalId && tableElement.dataset.tableLocalId !== (tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.localId)) {
+    return;
+  }
   if (!maybeTableCell || !tableRef) {
     return;
   }
   const colIndex = maybeTableCell.cellIndex;
   const rowElement = closestElement(target, 'tr');
   const rowIndex = rowElement && rowElement.rowIndex;
-  const {
-    hoveredCell
-  } = getPluginState(view.state);
   const colHeight = tableRef.offsetHeight;
   const colWidth = maybeTableCell.offsetWidth;
   if (hoveredCell.colIndex !== colIndex || hoveredCell.rowIndex !== rowIndex || hoveredCell.colWidth !== colWidth || hoveredCell.colHeight !== colHeight) {

package/dist/esm/plugins/table/event-handlers.js

@@ -323,17 +323,25 @@ export var whenTableInFocus = function whenTableInFocus(eventHandler, elementCon
   };
 };
 var trackCellLocation = function trackCellLocation(view, mouseEvent) {
+  var _tableElement$dataset;
   var target = mouseEvent.target;
   var maybeTableCell = isElementInTableCell(target);
   var tableRef = getPluginState(view.state).tableRef;
+  var _getPluginState8 = getPluginState(view.state),
+    hoveredCell = _getPluginState8.hoveredCell,
+    tableNode = _getPluginState8.tableNode;
+  var tableElement = closestElement(target, 'table');
+
+  // hover will only trigger if target localId is the same with selected localId
+  if (tableElement !== null && tableElement !== void 0 && (_tableElement$dataset = tableElement.dataset) !== null && _tableElement$dataset !== void 0 && _tableElement$dataset.tableLocalId && tableElement.dataset.tableLocalId !== (tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.localId)) {
+    return;
+  }
   if (!maybeTableCell || !tableRef) {
     return;
   }
   var colIndex = maybeTableCell.cellIndex;
   var rowElement = closestElement(target, 'tr');
   var rowIndex = rowElement && rowElement.rowIndex;
-  var _getPluginState8 = getPluginState(view.state),
-    hoveredCell = _getPluginState8.hoveredCell;
   var colHeight = tableRef.offsetHeight;
   var colWidth = maybeTableCell.offsetWidth;
   if (hoveredCell.colIndex !== colIndex || hoveredCell.rowIndex !== rowIndex || hoveredCell.colWidth !== colWidth || hoveredCell.colHeight !== colHeight) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "5.3.30",
+  "version": "5.3.31",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -29,7 +29,7 @@
   "dependencies": {
     "@atlaskit/adf-schema": "^32.0.0",
     "@atlaskit/custom-steps": "^0.0.2",
-    "@atlaskit/editor-common": "^76.20.0",
+    "@atlaskit/editor-common": "^76.21.0",
     "@atlaskit/editor-palette": "1.5.2",
     "@atlaskit/editor-plugin-analytics": "^0.3.0",
     "@atlaskit/editor-plugin-content-insertion": "^0.1.0",

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

@@ -533,6 +533,20 @@ const trackCellLocation = (view: EditorView, mouseEvent: Event) => {
     target as HTMLElement,
   ) as HTMLTableCellElement | null;
   const tableRef = getPluginState(view.state).tableRef;
+  const { hoveredCell, tableNode } = getPluginState(view.state);
+
+  const tableElement = closestElement(
+    target as HTMLElement,
+    'table',
+  ) as HTMLTableElement;
+
+  // hover will only trigger if target localId is the same with selected localId
+  if (
+    tableElement?.dataset?.tableLocalId &&
+    tableElement.dataset.tableLocalId !== tableNode?.attrs.localId
+  ) {
+    return;
+  }
 
   if (!maybeTableCell || !tableRef) {
     return;
@@ -544,7 +558,6 @@ const trackCellLocation = (view: EditorView, mouseEvent: Event) => {
     'tr',
   ) as HTMLTableRowElement;
   const rowIndex = rowElement && rowElement.rowIndex;
-  const { hoveredCell } = getPluginState(view.state);
 
   const colHeight = tableRef.offsetHeight;
   const colWidth = maybeTableCell.offsetWidth;