@atlaskit/editor-core 159.0.0 → 161.0.0

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/editor-core
 
+## 161.0.0
+
+### Patch Changes
+
+- Updated dependencies
+
+## 160.0.0
+
+### Major Changes
+
+- [`a0b1dde9b9e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a0b1dde9b9e) - [ux] Fixed the issue where the "change table width" button was incorrectly positioned, overlapping the side panel, when the table is being rendered in sticky header mode.
+
+## 159.0.1
+
+### Patch Changes
+
+- [`e68f0f554fa`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e68f0f554fa) - remove mousedown handler for inline links and add a vr test for the logic
+- Updated dependencies
+
 ## 159.0.0
 
 ### Patch Changes

package/dist/cjs/plugins/table/ui/LayoutButton/index.js

@@ -2,6 +2,8 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -21,7 +23,7 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _classnames2 = _interopRequireDefault(require("classnames"));
 
@@ -43,6 +45,10 @@ var _types = require("../../types");
 
 var _prosemirrorUtils = require("prosemirror-utils");
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 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); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -87,6 +93,18 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
     }
 
     _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "stickyButtonRef", /*#__PURE__*/(0, _react.createRef)());
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "resizeObserver", new ResizeObserver(function (entries) {
+      entries.forEach(function (entry) {
+        var resizeButton = _this.stickyButtonRef.current;
+        var tableWrapper = _this.props.targetRef;
+
+        if (resizeButton && tableWrapper) {
+          var clientRect = tableWrapper.getBoundingClientRect();
+          resizeButton.style.left = "".concat(clientRect.right, "px");
+        }
+      });
+    }));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleClick", function () {
       var _this$props$editorVie = _this.props.editorView,
           state = _this$props$editorVie.state,
@@ -135,20 +153,22 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
     }
   }, {
     key: "renderSticky",
-    value: function renderSticky(button, targetRef) {
+    value: function renderSticky(button, targetRef, tableRef) {
       var title = this.getTitle();
 
-      if (!targetRef || !(targetRef instanceof HTMLElement)) {
+      if (!(targetRef instanceof HTMLElement) || !(tableRef instanceof HTMLElement)) {
         return null;
       }
 
       var pos = targetRef.getBoundingClientRect();
+      var tablePos = tableRef.getBoundingClientRect();
       return /*#__PURE__*/_react.default.createElement("div", {
+        ref: this.stickyButtonRef,
         "aria-label": title,
         style: {
           position: 'fixed',
           top: pos.top + 22,
-          left: pos.right + 10
+          left: tablePos.right
         }
       }, button);
     }
@@ -186,12 +206,32 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
       var button = this.toolbarButton();
       var stickyTargetRef = stickyHeader && stickyHeader.sticky && stickyHeader.pos ? this.getStickyTargetRef(stickyHeader.pos) : null;
 
-      if (stickyTargetRef) {
-        return this.renderSticky(button, stickyTargetRef);
+      if (stickyTargetRef && this.props.targetRef) {
+        return this.renderSticky(button, stickyTargetRef, this.props.targetRef);
       } else {
         return this.renderPopup(button);
       }
     }
+  }, {
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var dom = this.props.editorView.dom;
+      var scrollPanel = dom.closest('.fabric-editor-popup-scroll-parent');
+
+      if (scrollPanel instanceof HTMLElement) {
+        this.resizeObserver.observe(scrollPanel);
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      var dom = this.props.editorView.dom;
+      var scrollPanel = dom.closest('.fabric-editor-popup-scroll-parent');
+
+      if (scrollPanel instanceof HTMLElement) {
+        this.resizeObserver.unobserve(scrollPanel);
+      }
+    }
   }, {
     key: "shouldComponentUpdate",
     value: function shouldComponentUpdate(nextProps) {

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "159.0.0";
+var version = "161.0.0";
 exports.version = version;
 
 var nextMajorVersion = function nextMajorVersion() {

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "159.0.0",
+	"version": "161.0.0",
 	"sideEffects": false
 }

package/dist/es2019/plugins/table/ui/LayoutButton/index.js

@@ -1,5 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
+import React, { createRef } from 'react';
 import classnames from 'classnames';
 import { injectIntl } from 'react-intl-next';
 import { Popup } from '@atlaskit/editor-common/ui';
@@ -34,6 +34,20 @@ class LayoutButton extends React.Component {
   constructor(...args) {
     super(...args);
 
+    _defineProperty(this, "stickyButtonRef", /*#__PURE__*/createRef());
+
+    _defineProperty(this, "resizeObserver", new ResizeObserver(entries => {
+      entries.forEach(entry => {
+        const resizeButton = this.stickyButtonRef.current;
+        const tableWrapper = this.props.targetRef;
+
+        if (resizeButton && tableWrapper) {
+          const clientRect = tableWrapper.getBoundingClientRect();
+          resizeButton.style.left = `${clientRect.right}px`;
+        }
+      });
+    }));
+
     _defineProperty(this, "handleClick", () => {
       const {
         state,
@@ -83,20 +97,22 @@ class LayoutButton extends React.Component {
     return node.dataset['headerRow'] && node.classList.contains('sticky') ? node : null;
   }
 
-  renderSticky(button, targetRef) {
+  renderSticky(button, targetRef, tableRef) {
     const title = this.getTitle();
 
-    if (!targetRef || !(targetRef instanceof HTMLElement)) {
+    if (!(targetRef instanceof HTMLElement) || !(tableRef instanceof HTMLElement)) {
       return null;
     }
 
     const pos = targetRef.getBoundingClientRect();
+    const tablePos = tableRef.getBoundingClientRect();
     return /*#__PURE__*/React.createElement("div", {
+      ref: this.stickyButtonRef,
       "aria-label": title,
       style: {
         position: 'fixed',
         top: pos.top + 22,
-        left: pos.right + 10
+        left: tablePos.right
       }
     }, button);
   }
@@ -135,13 +151,31 @@ class LayoutButton extends React.Component {
     const button = this.toolbarButton();
     const stickyTargetRef = stickyHeader && stickyHeader.sticky && stickyHeader.pos ? this.getStickyTargetRef(stickyHeader.pos) : null;
 
-    if (stickyTargetRef) {
-      return this.renderSticky(button, stickyTargetRef);
+    if (stickyTargetRef && this.props.targetRef) {
+      return this.renderSticky(button, stickyTargetRef, this.props.targetRef);
     } else {
       return this.renderPopup(button);
     }
   }
 
+  componentDidMount() {
+    const dom = this.props.editorView.dom;
+    const scrollPanel = dom.closest('.fabric-editor-popup-scroll-parent');
+
+    if (scrollPanel instanceof HTMLElement) {
+      this.resizeObserver.observe(scrollPanel);
+    }
+  }
+
+  componentWillUnmount() {
+    const dom = this.props.editorView.dom;
+    const scrollPanel = dom.closest('.fabric-editor-popup-scroll-parent');
+
+    if (scrollPanel instanceof HTMLElement) {
+      this.resizeObserver.unobserve(scrollPanel);
+    }
+  }
+
   shouldComponentUpdate(nextProps) {
     const {
       targetRef,

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "159.0.0";
+export const version = "161.0.0";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "159.0.0",
+	"version": "161.0.0",
 	"sideEffects": false
 }

package/dist/esm/plugins/table/ui/LayoutButton/index.js

@@ -14,7 +14,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import React from 'react';
+import React, { createRef } from 'react';
 import classnames from 'classnames';
 import { injectIntl } from 'react-intl-next';
 import { Popup } from '@atlaskit/editor-common/ui';
@@ -63,6 +63,20 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
 
     _this = _super.call.apply(_super, [this].concat(args));
 
+    _defineProperty(_assertThisInitialized(_this), "stickyButtonRef", /*#__PURE__*/createRef());
+
+    _defineProperty(_assertThisInitialized(_this), "resizeObserver", new ResizeObserver(function (entries) {
+      entries.forEach(function (entry) {
+        var resizeButton = _this.stickyButtonRef.current;
+        var tableWrapper = _this.props.targetRef;
+
+        if (resizeButton && tableWrapper) {
+          var clientRect = tableWrapper.getBoundingClientRect();
+          resizeButton.style.left = "".concat(clientRect.right, "px");
+        }
+      });
+    }));
+
     _defineProperty(_assertThisInitialized(_this), "handleClick", function () {
       var _this$props$editorVie = _this.props.editorView,
           state = _this$props$editorVie.state,
@@ -112,20 +126,22 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
     }
   }, {
     key: "renderSticky",
-    value: function renderSticky(button, targetRef) {
+    value: function renderSticky(button, targetRef, tableRef) {
       var title = this.getTitle();
 
-      if (!targetRef || !(targetRef instanceof HTMLElement)) {
+      if (!(targetRef instanceof HTMLElement) || !(tableRef instanceof HTMLElement)) {
         return null;
       }
 
       var pos = targetRef.getBoundingClientRect();
+      var tablePos = tableRef.getBoundingClientRect();
       return /*#__PURE__*/React.createElement("div", {
+        ref: this.stickyButtonRef,
         "aria-label": title,
         style: {
           position: 'fixed',
           top: pos.top + 22,
-          left: pos.right + 10
+          left: tablePos.right
         }
       }, button);
     }
@@ -163,12 +179,32 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
       var button = this.toolbarButton();
       var stickyTargetRef = stickyHeader && stickyHeader.sticky && stickyHeader.pos ? this.getStickyTargetRef(stickyHeader.pos) : null;
 
-      if (stickyTargetRef) {
-        return this.renderSticky(button, stickyTargetRef);
+      if (stickyTargetRef && this.props.targetRef) {
+        return this.renderSticky(button, stickyTargetRef, this.props.targetRef);
       } else {
         return this.renderPopup(button);
       }
     }
+  }, {
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var dom = this.props.editorView.dom;
+      var scrollPanel = dom.closest('.fabric-editor-popup-scroll-parent');
+
+      if (scrollPanel instanceof HTMLElement) {
+        this.resizeObserver.observe(scrollPanel);
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      var dom = this.props.editorView.dom;
+      var scrollPanel = dom.closest('.fabric-editor-popup-scroll-parent');
+
+      if (scrollPanel instanceof HTMLElement) {
+        this.resizeObserver.unobserve(scrollPanel);
+      }
+    }
   }, {
     key: "shouldComponentUpdate",
     value: function shouldComponentUpdate(nextProps) {

package/dist/esm/version-wrapper.js

@@ -1,5 +1,5 @@
 export var name = "@atlaskit/editor-core";
-export var version = "159.0.0";
+export var version = "161.0.0";
 export var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "159.0.0",
+	"version": "161.0.0",
 	"sideEffects": false
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-core",
-  "version": "159.0.0",
+  "version": "161.0.0",
   "description": "A package contains Atlassian editor core functionality",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -129,7 +129,7 @@
   },
   "peerDependencies": {
     "@atlaskit/media-core": "^32.2.0",
-    "@atlaskit/smart-card": "^17.5.0",
+    "@atlaskit/smart-card": "^17.6.0",
     "react": "^16.8.0",
     "react-dom": "^16.8.0",
     "react-intl": "^2.6.0",
@@ -157,10 +157,10 @@
     "@atlaskit/page-layout": "^1.0.1",
     "@atlaskit/profilecard": "^16.3.0",
     "@atlaskit/pubsub": "^6.0.0",
-    "@atlaskit/renderer": "^90.0.0",
+    "@atlaskit/renderer": "^91.0.0",
     "@atlaskit/section-message": "^6.1.0",
     "@atlaskit/share": "*",
-    "@atlaskit/smart-card": "^17.5.0",
+    "@atlaskit/smart-card": "^17.6.0",
     "@atlaskit/synchrony-test-helpers": "^2.3.0",
     "@atlaskit/textarea": "^4.3.0",
     "@atlaskit/toggle": "^12.4.0",