@atlaskit/editor-plugin-table 16.1.5 → 16.1.7

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-plugin-table
 
+## 16.1.7
+
+### Patch Changes
+
+- [`acd81a73a9a20`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/acd81a73a9a20) -
+  [ux] EDITOR-4259 Set table ref when table is rendered
+- Updated dependencies
+
+## 16.1.6
+
+### Patch Changes
+
+- [`8c24728c97456`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8c24728c97456) -
+  EDITOR-3638 Exclude zero intersection entries when scroll is detected
+- Updated dependencies
+
 ## 16.1.5
 
 ### Patch Changes

package/dist/cjs/nodeviews/TableComponent.js

@@ -926,6 +926,12 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
             if (tableElement !== _this5.table) {
               _this5.table = tableElement;
               _this5.observeTable(_this5.table);
+
+              // // Update tableRef in plugin state when table is properly mounted
+              // // At this point, both table and wrapper are in DOM with correct parent-child relationship
+              if (_this5.table && _this5.props.view && (0, _expValEquals.expValEquals)('platform_editor_table_update_table_ref', 'isEnabled', true)) {
+                (0, _commands.setTableRef)(_this5.table)(_this5.props.view.state, _this5.props.view.dispatch);
+              }
             }
           }
         }

package/dist/cjs/nodeviews/TableRowNativeStickyWithFallback.js

@@ -285,7 +285,7 @@ var TableRowNativeStickyWithFallback = exports.default = /*#__PURE__*/function (
              */
             entries.forEach(function (entry) {
               var tableWrapper = _this3.dom.closest(".".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER));
-              if (tableWrapper && tableWrapper instanceof HTMLElement) {
+              if (tableWrapper && tableWrapper instanceof HTMLElement && (!(0, _dom2.areAllRectsZero)(entry) && (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_10', 'isEnabled', true) || !(0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_10', 'isEnabled', true))) {
                 if (entry.isIntersecting) {
                   tableWrapper.classList.add(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW);
                   _this3.dom.classList.add(_types.TableCssClassName.NATIVE_STICKY);

package/dist/cjs/pm-plugins/utils/dom.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isTableControlsButton = exports.isTableContainerOrWrapper = exports.isRowControlsButton = exports.isResizeHandleDecoration = exports.isInsertRowButton = exports.isDragRowFloatingInsertDot = exports.isDragCornerButton = exports.isDragColumnFloatingInsertDot = exports.isCornerButton = exports.isColumnControlsDecorations = exports.isCell = exports.hasResizeHandler = exports.getTree = exports.getTop = exports.getMousePositionVerticalRelativeByElement = exports.getMousePositionHorizontalRelativeByElement = exports.getColumnOrRowIndex = exports.findNearestCellIndexToPoint = void 0;
+exports.isTableControlsButton = exports.isTableContainerOrWrapper = exports.isRowControlsButton = exports.isResizeHandleDecoration = exports.isInsertRowButton = exports.isDragRowFloatingInsertDot = exports.isDragCornerButton = exports.isDragColumnFloatingInsertDot = exports.isCornerButton = exports.isColumnControlsDecorations = exports.isCell = exports.hasResizeHandler = exports.getTree = exports.getTop = exports.getMousePositionVerticalRelativeByElement = exports.getMousePositionHorizontalRelativeByElement = exports.getColumnOrRowIndex = exports.findNearestCellIndexToPoint = exports.areAllRectsZero = void 0;
 var _utils = require("@atlaskit/editor-common/utils");
 var _types = require("../../types");
 var isCell = exports.isCell = function isCell(node) {
@@ -202,4 +202,10 @@ var findNearestCellIndexToPoint = exports.findNearestCellIndexToPoint = function
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     col: cell.cellIndex
   };
+};
+var areAllRectsZero = exports.areAllRectsZero = function areAllRectsZero(entry) {
+  var rects = [entry.boundingClientRect, entry.rootBounds, entry.intersectionRect];
+  return rects.every(function (rect) {
+    return rect && rect.width === 0 && rect.height === 0 && rect.top === 0 && rect.left === 0 && rect.bottom === 0 && rect.right === 0 && rect.x === 0 && rect.y === 0;
+  });
 };

package/dist/es2019/nodeviews/TableComponent.js

@@ -13,7 +13,7 @@ import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
 import { isTableSelected } from '@atlaskit/editor-tables/utils';
 import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { autoSizeTable, clearHoverSelection } from '../pm-plugins/commands';
+import { autoSizeTable, clearHoverSelection, setTableRef } from '../pm-plugins/commands';
 import { autoScrollerFactory } from '../pm-plugins/drag-and-drop/utils/autoscrollers';
 import { pluginKey as stickyHeadersPluginKey } from '../pm-plugins/sticky-headers/plugin-key';
 import { findStickyHeaderForTable } from '../pm-plugins/sticky-headers/util';
@@ -891,6 +891,12 @@ class TableComponent extends React.Component {
           if (tableElement !== this.table) {
             this.table = tableElement;
             this.observeTable(this.table);
+
+            // // Update tableRef in plugin state when table is properly mounted
+            // // At this point, both table and wrapper are in DOM with correct parent-child relationship
+            if (this.table && this.props.view && expValEquals('platform_editor_table_update_table_ref', 'isEnabled', true)) {
+              setTableRef(this.table)(this.props.view.state, this.props.view.dispatch);
+            }
           }
         }
       }

package/dist/es2019/nodeviews/TableRowNativeStickyWithFallback.js

@@ -14,7 +14,7 @@ import { getPluginState } from '../pm-plugins/plugin-factory';
 import { pluginKey as tablePluginKey } from '../pm-plugins/plugin-key';
 import { updateStickyState } from '../pm-plugins/sticky-headers/commands';
 import { syncStickyRowToTable, updateStickyMargins as updateTableMargin } from '../pm-plugins/table-resizing/utils/dom';
-import { getTop, getTree } from '../pm-plugins/utils/dom';
+import { areAllRectsZero, getTop, getTree } from '../pm-plugins/utils/dom';
 import { supportedHeaderRow } from '../pm-plugins/utils/nodes';
 import { TableCssClassName as ClassName, TableCssClassName } from '../types';
 import { stickyHeaderBorderBottomWidth, stickyRowOffsetTop, tableControlsSpacing, tableScrollbarOffset } from '../ui/consts';
@@ -259,7 +259,7 @@ export default class TableRowNativeStickyWithFallback extends TableNodeView {
            */
           entries.forEach(entry => {
             const tableWrapper = this.dom.closest(`.${ClassName.TABLE_NODE_WRAPPER}`);
-            if (tableWrapper && tableWrapper instanceof HTMLElement) {
+            if (tableWrapper && tableWrapper instanceof HTMLElement && (!areAllRectsZero(entry) && expValEquals('platform_editor_table_sticky_header_patch_10', 'isEnabled', true) || !expValEquals('platform_editor_table_sticky_header_patch_10', 'isEnabled', true))) {
               if (entry.isIntersecting) {
                 tableWrapper.classList.add(ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW);
                 this.dom.classList.add(ClassName.NATIVE_STICKY);

package/dist/es2019/pm-plugins/utils/dom.js

@@ -173,4 +173,8 @@ export const findNearestCellIndexToPoint = (x, y) => {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     col: cell.cellIndex
   };
+};
+export const areAllRectsZero = entry => {
+  const rects = [entry.boundingClientRect, entry.rootBounds, entry.intersectionRect];
+  return rects.every(rect => rect && rect.width === 0 && rect.height === 0 && rect.top === 0 && rect.left === 0 && rect.bottom === 0 && rect.right === 0 && rect.x === 0 && rect.y === 0);
 };

package/dist/esm/nodeviews/TableComponent.js

@@ -26,7 +26,7 @@ import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
 import { isTableSelected } from '@atlaskit/editor-tables/utils';
 import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { autoSizeTable, clearHoverSelection } from '../pm-plugins/commands';
+import { autoSizeTable, clearHoverSelection, setTableRef } from '../pm-plugins/commands';
 import { autoScrollerFactory } from '../pm-plugins/drag-and-drop/utils/autoscrollers';
 import { pluginKey as stickyHeadersPluginKey } from '../pm-plugins/sticky-headers/plugin-key';
 import { findStickyHeaderForTable } from '../pm-plugins/sticky-headers/util';
@@ -920,6 +920,12 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
             if (tableElement !== _this5.table) {
               _this5.table = tableElement;
               _this5.observeTable(_this5.table);
+
+              // // Update tableRef in plugin state when table is properly mounted
+              // // At this point, both table and wrapper are in DOM with correct parent-child relationship
+              if (_this5.table && _this5.props.view && expValEquals('platform_editor_table_update_table_ref', 'isEnabled', true)) {
+                setTableRef(_this5.table)(_this5.props.view.state, _this5.props.view.dispatch);
+              }
             }
           }
         }

package/dist/esm/nodeviews/TableRowNativeStickyWithFallback.js

@@ -21,7 +21,7 @@ import { getPluginState } from '../pm-plugins/plugin-factory';
 import { pluginKey as tablePluginKey } from '../pm-plugins/plugin-key';
 import { updateStickyState } from '../pm-plugins/sticky-headers/commands';
 import { syncStickyRowToTable, updateStickyMargins as updateTableMargin } from '../pm-plugins/table-resizing/utils/dom';
-import { getTop, getTree } from '../pm-plugins/utils/dom';
+import { areAllRectsZero, getTop, getTree } from '../pm-plugins/utils/dom';
 import { supportedHeaderRow } from '../pm-plugins/utils/nodes';
 import { TableCssClassName as ClassName, TableCssClassName } from '../types';
 import { stickyHeaderBorderBottomWidth, stickyRowOffsetTop, tableControlsSpacing, tableScrollbarOffset } from '../ui/consts';
@@ -278,7 +278,7 @@ var TableRowNativeStickyWithFallback = /*#__PURE__*/function (_ref) {
              */
             entries.forEach(function (entry) {
               var tableWrapper = _this3.dom.closest(".".concat(ClassName.TABLE_NODE_WRAPPER));
-              if (tableWrapper && tableWrapper instanceof HTMLElement) {
+              if (tableWrapper && tableWrapper instanceof HTMLElement && (!areAllRectsZero(entry) && expValEquals('platform_editor_table_sticky_header_patch_10', 'isEnabled', true) || !expValEquals('platform_editor_table_sticky_header_patch_10', 'isEnabled', true))) {
                 if (entry.isIntersecting) {
                   tableWrapper.classList.add(ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW);
                   _this3.dom.classList.add(ClassName.NATIVE_STICKY);

package/dist/esm/pm-plugins/utils/dom.js

@@ -196,4 +196,10 @@ export var findNearestCellIndexToPoint = function findNearestCellIndexToPoint(x,
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     col: cell.cellIndex
   };
+};
+export var areAllRectsZero = function areAllRectsZero(entry) {
+  var rects = [entry.boundingClientRect, entry.rootBounds, entry.intersectionRect];
+  return rects.every(function (rect) {
+    return rect && rect.width === 0 && rect.height === 0 && rect.top === 0 && rect.left === 0 && rect.bottom === 0 && rect.right === 0 && rect.x === 0 && rect.y === 0;
+  });
 };

package/dist/types/pm-plugins/utils/dom.d.ts

@@ -36,3 +36,4 @@ export declare const findNearestCellIndexToPoint: (x: number, y: number) => {
     col: number;
     row: number;
 } | undefined;
+export declare const areAllRectsZero: (entry: IntersectionObserverEntry) => boolean;

package/dist/types-ts4.5/pm-plugins/utils/dom.d.ts

@@ -39,3 +39,4 @@ export declare const findNearestCellIndexToPoint: (x: number, y: number) => {
     col: number;
     row: number;
 } | undefined;
+export declare const areAllRectsZero: (entry: IntersectionObserverEntry) => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "16.1.5",
+	"version": "16.1.7",
 	"description": "Table plugin for the @atlaskit/editor",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -57,7 +57,7 @@
 		"@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.1.0",
 		"@atlaskit/primitives": "^17.0.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^16.8.0",
+		"@atlaskit/tmp-editor-statsig": "^16.10.0",
 		"@atlaskit/toggle": "^15.2.0",
 		"@atlaskit/tokens": "^9.1.0",
 		"@atlaskit/tooltip": "^20.12.0",