@atlaskit/editor-common 74.7.9 → 74.9.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/editor-common
 
+## 74.9.0
+
+### Minor Changes
+
+- [`4bf22e4eb1c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4bf22e4eb1c) - The editor dropdown menu items are now forced to be `position: static` when a feature flag is on to work around menu items being position relative now. This is a short term fix to keep the table cell color nested menu working.
+
+### Patch Changes
+
+- [`73b5128036b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/73b5128036b) - [ED-17082] Mark package as a singleton one
+- Updated dependencies
+
+## 74.8.0
+
+### Minor Changes
+
+- [`5e01082b600`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5e01082b600) - Extracting SelectionBasedNodeView to editor-common.
+
 ## 74.7.9
 
 ### Patch Changes

package/dist/cjs/monitoring/error.js

@@ -16,7 +16,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "74.7.9";
+var packageVersion = "74.9.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/cjs/react-node-view/index.js

@@ -35,6 +35,7 @@ var ReactNodeView = /*#__PURE__*/function () {
     var viewShouldUpdate = arguments.length > 8 ? arguments[8] : undefined;
     var hasIntlContext = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
     (0, _classCallCheck2.default)(this, ReactNodeView);
+    (0, _defineProperty2.default)(this, "decorations", []);
     (0, _defineProperty2.default)(this, "handleRef", function (node) {
       return _this._handleRef(node);
     });
@@ -162,13 +163,14 @@ var ReactNodeView = /*#__PURE__*/function () {
     }
   }, {
     key: "update",
-    value: function update(node, _decorations, _innerDecorations) {
+    value: function update(node, decorations, _innerDecorations) {
       var _this4 = this;
       var validUpdate = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : function () {
         return true;
       };
       // @see https://github.com/ProseMirror/prosemirror/issues/648
       var isValidUpdate = this.node.type === node.type && validUpdate(this.node, node);
+      this.decorations = decorations;
       if (!isValidUpdate) {
         return false;
       }
@@ -178,7 +180,7 @@ var ReactNodeView = /*#__PURE__*/function () {
 
       // View should not process a re-render if this is false.
       // We dont want to destroy the view, so we return true.
-      if (!this.viewShouldUpdate(node)) {
+      if (!this.viewShouldUpdate(node, decorations)) {
         this.node = node;
         return true;
       }
@@ -190,7 +192,7 @@ var ReactNodeView = /*#__PURE__*/function () {
     }
   }, {
     key: "viewShouldUpdate",
-    value: function viewShouldUpdate(nextNode) {
+    value: function viewShouldUpdate(nextNode, decorations) {
       if (this._viewShouldUpdate) {
         return this._viewShouldUpdate(nextNode);
       }

package/dist/cjs/selection-based-node-view/SelectionBasedNodeView.js

@@ -0,0 +1,124 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SelectionBasedNodeView = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _reactNodeView = _interopRequireDefault(require("../react-node-view"));
+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; } }
+/**
+ * A ReactNodeView that handles React components sensitive
+ * to selection changes.
+ *
+ * If the selection changes, it will attempt to re-render the
+ * React component. Otherwise it does nothing.
+ *
+ * You can subclass `viewShouldUpdate` to include other
+ * props that your component might want to consider before
+ * entering the React lifecycle. These are usually props you
+ * compare in `shouldComponentUpdate`.
+ *
+ * An example:
+ *
+ * ```
+ * viewShouldUpdate(nextNode) {
+ *   if (nextNode.attrs !== this.node.attrs) {
+ *     return true;
+ *   }
+ *
+ *   return super.viewShouldUpdate(nextNode);
+ * }```
+ */
+var SelectionBasedNodeView = /*#__PURE__*/function (_ReactNodeView) {
+  (0, _inherits2.default)(SelectionBasedNodeView, _ReactNodeView);
+  var _super = _createSuper(SelectionBasedNodeView);
+  function SelectionBasedNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, reactComponent) {
+    var _this;
+    var hasContext = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
+    var viewShouldUpdate = arguments.length > 8 ? arguments[8] : undefined;
+    var hasIntlContext = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
+    (0, _classCallCheck2.default)(this, SelectionBasedNodeView);
+    _this = _super.call(this, node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, reactComponent, hasContext, viewShouldUpdate, hasIntlContext);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isSelectedNode", false);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isNodeInsideSelection", function (from, to, pos, posEnd) {
+      var _this$getPositionsWit = _this.getPositionsWithDefault(pos, posEnd);
+      pos = _this$getPositionsWit.pos;
+      posEnd = _this$getPositionsWit.posEnd;
+      if (typeof pos !== 'number' || typeof posEnd !== 'number') {
+        return false;
+      }
+      return from <= pos && to >= posEnd;
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isSelectionInsideNode", function (from, to, pos, posEnd) {
+      var _this$getPositionsWit2 = _this.getPositionsWithDefault(pos, posEnd);
+      pos = _this$getPositionsWit2.pos;
+      posEnd = _this$getPositionsWit2.posEnd;
+      if (typeof pos !== 'number' || typeof posEnd !== 'number') {
+        return false;
+      }
+      return pos < from && to < posEnd;
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "insideSelection", function () {
+      var _this$view$state$sele = _this.view.state.selection,
+        from = _this$view$state$sele.from,
+        to = _this$view$state$sele.to;
+      return _this.isSelectedNode || _this.isSelectionInsideNode(from, to);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "nodeInsideSelection", function () {
+      var selection = _this.view.state.selection;
+      var from = selection.from,
+        to = selection.to;
+      return _this.isSelectedNode || _this.isNodeInsideSelection(from, to);
+    });
+    _this.updatePos();
+    return _this;
+  }
+
+  /**
+   * Update current node's start and end positions.
+   *
+   * Prefer `this.pos` rather than getPos(), because calling getPos is
+   * expensive, unless you know you're definitely going to render.
+   */
+  (0, _createClass2.default)(SelectionBasedNodeView, [{
+    key: "updatePos",
+    value: function updatePos() {
+      if (typeof this.getPos === 'boolean') {
+        return;
+      }
+      this.pos = this.getPos();
+      this.posEnd = this.pos + this.node.nodeSize;
+    }
+  }, {
+    key: "getPositionsWithDefault",
+    value: function getPositionsWithDefault(pos, posEnd) {
+      return {
+        pos: typeof pos !== 'number' ? this.pos : pos,
+        posEnd: typeof posEnd !== 'number' ? this.posEnd : posEnd
+      };
+    }
+  }, {
+    key: "selectNode",
+    value: function selectNode() {
+      this.isSelectedNode = true;
+      this.update(this.node, this.decorations);
+    }
+  }, {
+    key: "deselectNode",
+    value: function deselectNode() {
+      this.isSelectedNode = false;
+      this.update(this.node, this.decorations);
+    }
+  }]);
+  return SelectionBasedNodeView;
+}(_reactNodeView.default);
+exports.SelectionBasedNodeView = SelectionBasedNodeView;

package/dist/cjs/selection-based-node-view/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "SelectionBasedNodeView", {
+  enumerable: true,
+  get: function get() {
+    return _SelectionBasedNodeView.SelectionBasedNodeView;
+  }
+});
+var _SelectionBasedNodeView = require("./SelectionBasedNodeView");

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

@@ -24,7 +24,7 @@ var _templateObject, _templateObject2, _templateObject3;
 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; } } /** @jsx jsx */
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "74.7.9";
+var packageVersion = "74.9.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

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

@@ -111,7 +111,6 @@ var PortalProviderAPI = /*#__PURE__*/function (_EventDispatcher) {
       } catch (error) {
         if (this.onAnalyticsEvent) {
           this.onAnalyticsEvent({
-            // @ts-expect-error
             payload: {
               action: _analytics.ACTION.FAILED_TO_UNMOUNT,
               actionSubject: _analytics.ACTION_SUBJECT.EDITOR,

package/dist/cjs/ui-menu/DropdownMenu/index.js

@@ -21,6 +21,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _menu = require("@atlaskit/menu");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
 var _components = require("@atlaskit/theme/components");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
@@ -239,7 +240,17 @@ var DropdownMenuItemCustomComponent = /*#__PURE__*/_react.default.forwardRef(fun
     rest = (0, _objectWithoutProperties2.default)(props, _excluded);
   return (0, _react2.jsx)("span", (0, _extends2.default)({
     ref: ref
-  }, rest), children);
+  }, rest, {
+    style: {
+      // This forces the item container back to be `position: static`, the default value.
+      // This ensures the custom nested menu for table color picker still works as now
+      // menu items from @atlaskit/menu all have `position: relative` set for the selected borders.
+      // The current implementation unfortunately is very brittle. Design System Team will
+      // be prioritizing official support for accessible nested menus that we want you to move
+      // to in the future.
+      position: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.menu-selected-state-change_0see9') ? 'static' : undefined
+    }
+  }), children);
 });
 function DropdownMenuItem(_ref) {
   var _item$key2;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.7.9",
+	"version": "74.9.0",
 	"sideEffects": false
 }

package/dist/es2019/monitoring/error.js

@@ -1,6 +1,6 @@
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "74.7.9";
+const packageVersion = "74.9.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/es2019/react-node-view/index.js

@@ -9,6 +9,7 @@ import { analyticsEventKey } from '../utils/analytics';
 export { getInlineNodeViewProducer, inlineNodeViewClassname } from './getInlineNodeViewProducer';
 export default class ReactNodeView {
   constructor(_node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, reactComponent, hasAnalyticsContext = false, viewShouldUpdate, hasIntlContext = false) {
+    _defineProperty(this, "decorations", []);
     _defineProperty(this, "handleRef", node => this._handleRef(node));
     _defineProperty(this, "dispatchAnalyticsEvent", payload => {
       if (this.eventDispatcher) {
@@ -118,9 +119,10 @@ export default class ReactNodeView {
       forwardRef: forwardRef
     }, props)) : null;
   }
-  update(node, _decorations, _innerDecorations, validUpdate = () => true) {
+  update(node, decorations, _innerDecorations, validUpdate = () => true) {
     // @see https://github.com/ProseMirror/prosemirror/issues/648
     const isValidUpdate = this.node.type === node.type && validUpdate(this.node, node);
+    this.decorations = decorations;
     if (!isValidUpdate) {
       return false;
     }
@@ -130,7 +132,7 @@ export default class ReactNodeView {
 
     // View should not process a re-render if this is false.
     // We dont want to destroy the view, so we return true.
-    if (!this.viewShouldUpdate(node)) {
+    if (!this.viewShouldUpdate(node, decorations)) {
       this.node = node;
       return true;
     }
@@ -138,7 +140,7 @@ export default class ReactNodeView {
     this.renderReactComponent(() => this.render(this.reactComponentProps, this.handleRef));
     return true;
   }
-  viewShouldUpdate(nextNode) {
+  viewShouldUpdate(nextNode, decorations) {
     if (this._viewShouldUpdate) {
       return this._viewShouldUpdate(nextNode);
     }

package/dist/es2019/selection-based-node-view/SelectionBasedNodeView.js

@@ -0,0 +1,100 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import ReactNodeView from '../react-node-view';
+/**
+ * A ReactNodeView that handles React components sensitive
+ * to selection changes.
+ *
+ * If the selection changes, it will attempt to re-render the
+ * React component. Otherwise it does nothing.
+ *
+ * You can subclass `viewShouldUpdate` to include other
+ * props that your component might want to consider before
+ * entering the React lifecycle. These are usually props you
+ * compare in `shouldComponentUpdate`.
+ *
+ * An example:
+ *
+ * ```
+ * viewShouldUpdate(nextNode) {
+ *   if (nextNode.attrs !== this.node.attrs) {
+ *     return true;
+ *   }
+ *
+ *   return super.viewShouldUpdate(nextNode);
+ * }```
+ */
+
+export class SelectionBasedNodeView extends ReactNodeView {
+  constructor(node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, reactComponent, hasContext = false, viewShouldUpdate, hasIntlContext = false) {
+    super(node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, reactComponent, hasContext, viewShouldUpdate, hasIntlContext);
+    _defineProperty(this, "isSelectedNode", false);
+    _defineProperty(this, "isNodeInsideSelection", (from, to, pos, posEnd) => {
+      ({
+        pos,
+        posEnd
+      } = this.getPositionsWithDefault(pos, posEnd));
+      if (typeof pos !== 'number' || typeof posEnd !== 'number') {
+        return false;
+      }
+      return from <= pos && to >= posEnd;
+    });
+    _defineProperty(this, "isSelectionInsideNode", (from, to, pos, posEnd) => {
+      ({
+        pos,
+        posEnd
+      } = this.getPositionsWithDefault(pos, posEnd));
+      if (typeof pos !== 'number' || typeof posEnd !== 'number') {
+        return false;
+      }
+      return pos < from && to < posEnd;
+    });
+    _defineProperty(this, "insideSelection", () => {
+      const {
+        selection: {
+          from,
+          to
+        }
+      } = this.view.state;
+      return this.isSelectedNode || this.isSelectionInsideNode(from, to);
+    });
+    _defineProperty(this, "nodeInsideSelection", () => {
+      const {
+        selection
+      } = this.view.state;
+      const {
+        from,
+        to
+      } = selection;
+      return this.isSelectedNode || this.isNodeInsideSelection(from, to);
+    });
+    this.updatePos();
+  }
+
+  /**
+   * Update current node's start and end positions.
+   *
+   * Prefer `this.pos` rather than getPos(), because calling getPos is
+   * expensive, unless you know you're definitely going to render.
+   */
+  updatePos() {
+    if (typeof this.getPos === 'boolean') {
+      return;
+    }
+    this.pos = this.getPos();
+    this.posEnd = this.pos + this.node.nodeSize;
+  }
+  getPositionsWithDefault(pos, posEnd) {
+    return {
+      pos: typeof pos !== 'number' ? this.pos : pos,
+      posEnd: typeof posEnd !== 'number' ? this.posEnd : posEnd
+    };
+  }
+  selectNode() {
+    this.isSelectedNode = true;
+    this.update(this.node, this.decorations);
+  }
+  deselectNode() {
+    this.isSelectedNode = false;
+    this.update(this.node, this.decorations);
+  }
+}

package/dist/es2019/selection-based-node-view/index.js

@@ -0,0 +1 @@
+export { SelectionBasedNodeView } from './SelectionBasedNodeView';

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

@@ -8,7 +8,7 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "74.7.9";
+const packageVersion = "74.9.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

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

@@ -82,13 +82,12 @@ export class PortalProviderAPI extends EventDispatcher {
     } catch (error) {
       if (this.onAnalyticsEvent) {
         this.onAnalyticsEvent({
-          // @ts-expect-error
           payload: {
             action: ACTION.FAILED_TO_UNMOUNT,
             actionSubject: ACTION_SUBJECT.EDITOR,
             actionSubjectId: ACTION_SUBJECT_ID.REACT_NODE_VIEW,
             attributes: {
-              error,
+              error: error,
               domNodes: {
                 container: container ? container.className : undefined,
                 child: container.firstElementChild ? container.firstElementChild.className : undefined

package/dist/es2019/ui-menu/DropdownMenu/index.js

@@ -5,6 +5,7 @@ import React, { PureComponent } from 'react';
 import { css, jsx } from '@emotion/react';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { CustomItem, MenuGroup } from '@atlaskit/menu';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { B100, DN600, DN80, N70, N900 } from '@atlaskit/theme/colors';
 import { themed } from '@atlaskit/theme/components';
 import Tooltip from '@atlaskit/tooltip';
@@ -241,7 +242,17 @@ const DropdownMenuItemCustomComponent = /*#__PURE__*/React.forwardRef((props, re
   } = props;
   return jsx("span", _extends({
     ref: ref
-  }, rest), children);
+  }, rest, {
+    style: {
+      // This forces the item container back to be `position: static`, the default value.
+      // This ensures the custom nested menu for table color picker still works as now
+      // menu items from @atlaskit/menu all have `position: relative` set for the selected borders.
+      // The current implementation unfortunately is very brittle. Design System Team will
+      // be prioritizing official support for accessible nested menus that we want you to move
+      // to in the future.
+      position: getBooleanFF('platform.design-system-team.menu-selected-state-change_0see9') ? 'static' : undefined
+    }
+  }), children);
 });
 function DropdownMenuItem({
   item,

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.7.9",
+	"version": "74.9.0",
 	"sideEffects": false
 }

package/dist/esm/monitoring/error.js

@@ -6,7 +6,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; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "74.7.9";
+var packageVersion = "74.9.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/esm/react-node-view/index.js

@@ -16,6 +16,7 @@ var ReactNodeView = /*#__PURE__*/function () {
     var viewShouldUpdate = arguments.length > 8 ? arguments[8] : undefined;
     var hasIntlContext = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
     _classCallCheck(this, ReactNodeView);
+    _defineProperty(this, "decorations", []);
     _defineProperty(this, "handleRef", function (node) {
       return _this._handleRef(node);
     });
@@ -143,13 +144,14 @@ var ReactNodeView = /*#__PURE__*/function () {
     }
   }, {
     key: "update",
-    value: function update(node, _decorations, _innerDecorations) {
+    value: function update(node, decorations, _innerDecorations) {
       var _this4 = this;
       var validUpdate = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : function () {
         return true;
       };
       // @see https://github.com/ProseMirror/prosemirror/issues/648
       var isValidUpdate = this.node.type === node.type && validUpdate(this.node, node);
+      this.decorations = decorations;
       if (!isValidUpdate) {
         return false;
       }
@@ -159,7 +161,7 @@ var ReactNodeView = /*#__PURE__*/function () {
 
       // View should not process a re-render if this is false.
       // We dont want to destroy the view, so we return true.
-      if (!this.viewShouldUpdate(node)) {
+      if (!this.viewShouldUpdate(node, decorations)) {
         this.node = node;
         return true;
       }
@@ -171,7 +173,7 @@ var ReactNodeView = /*#__PURE__*/function () {
     }
   }, {
     key: "viewShouldUpdate",
-    value: function viewShouldUpdate(nextNode) {
+    value: function viewShouldUpdate(nextNode, decorations) {
       if (this._viewShouldUpdate) {
         return this._viewShouldUpdate(nextNode);
       }

package/dist/esm/selection-based-node-view/SelectionBasedNodeView.js

@@ -0,0 +1,117 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+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() { 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; } }
+import ReactNodeView from '../react-node-view';
+/**
+ * A ReactNodeView that handles React components sensitive
+ * to selection changes.
+ *
+ * If the selection changes, it will attempt to re-render the
+ * React component. Otherwise it does nothing.
+ *
+ * You can subclass `viewShouldUpdate` to include other
+ * props that your component might want to consider before
+ * entering the React lifecycle. These are usually props you
+ * compare in `shouldComponentUpdate`.
+ *
+ * An example:
+ *
+ * ```
+ * viewShouldUpdate(nextNode) {
+ *   if (nextNode.attrs !== this.node.attrs) {
+ *     return true;
+ *   }
+ *
+ *   return super.viewShouldUpdate(nextNode);
+ * }```
+ */
+
+export var SelectionBasedNodeView = /*#__PURE__*/function (_ReactNodeView) {
+  _inherits(SelectionBasedNodeView, _ReactNodeView);
+  var _super = _createSuper(SelectionBasedNodeView);
+  function SelectionBasedNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, reactComponent) {
+    var _this;
+    var hasContext = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
+    var viewShouldUpdate = arguments.length > 8 ? arguments[8] : undefined;
+    var hasIntlContext = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
+    _classCallCheck(this, SelectionBasedNodeView);
+    _this = _super.call(this, node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, reactComponent, hasContext, viewShouldUpdate, hasIntlContext);
+    _defineProperty(_assertThisInitialized(_this), "isSelectedNode", false);
+    _defineProperty(_assertThisInitialized(_this), "isNodeInsideSelection", function (from, to, pos, posEnd) {
+      var _this$getPositionsWit = _this.getPositionsWithDefault(pos, posEnd);
+      pos = _this$getPositionsWit.pos;
+      posEnd = _this$getPositionsWit.posEnd;
+      if (typeof pos !== 'number' || typeof posEnd !== 'number') {
+        return false;
+      }
+      return from <= pos && to >= posEnd;
+    });
+    _defineProperty(_assertThisInitialized(_this), "isSelectionInsideNode", function (from, to, pos, posEnd) {
+      var _this$getPositionsWit2 = _this.getPositionsWithDefault(pos, posEnd);
+      pos = _this$getPositionsWit2.pos;
+      posEnd = _this$getPositionsWit2.posEnd;
+      if (typeof pos !== 'number' || typeof posEnd !== 'number') {
+        return false;
+      }
+      return pos < from && to < posEnd;
+    });
+    _defineProperty(_assertThisInitialized(_this), "insideSelection", function () {
+      var _this$view$state$sele = _this.view.state.selection,
+        from = _this$view$state$sele.from,
+        to = _this$view$state$sele.to;
+      return _this.isSelectedNode || _this.isSelectionInsideNode(from, to);
+    });
+    _defineProperty(_assertThisInitialized(_this), "nodeInsideSelection", function () {
+      var selection = _this.view.state.selection;
+      var from = selection.from,
+        to = selection.to;
+      return _this.isSelectedNode || _this.isNodeInsideSelection(from, to);
+    });
+    _this.updatePos();
+    return _this;
+  }
+
+  /**
+   * Update current node's start and end positions.
+   *
+   * Prefer `this.pos` rather than getPos(), because calling getPos is
+   * expensive, unless you know you're definitely going to render.
+   */
+  _createClass(SelectionBasedNodeView, [{
+    key: "updatePos",
+    value: function updatePos() {
+      if (typeof this.getPos === 'boolean') {
+        return;
+      }
+      this.pos = this.getPos();
+      this.posEnd = this.pos + this.node.nodeSize;
+    }
+  }, {
+    key: "getPositionsWithDefault",
+    value: function getPositionsWithDefault(pos, posEnd) {
+      return {
+        pos: typeof pos !== 'number' ? this.pos : pos,
+        posEnd: typeof posEnd !== 'number' ? this.posEnd : posEnd
+      };
+    }
+  }, {
+    key: "selectNode",
+    value: function selectNode() {
+      this.isSelectedNode = true;
+      this.update(this.node, this.decorations);
+    }
+  }, {
+    key: "deselectNode",
+    value: function deselectNode() {
+      this.isSelectedNode = false;
+      this.update(this.node, this.decorations);
+    }
+  }]);
+  return SelectionBasedNodeView;
+}(ReactNodeView);

package/dist/esm/selection-based-node-view/index.js

@@ -0,0 +1 @@
+export { SelectionBasedNodeView } from './SelectionBasedNodeView';

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

@@ -18,7 +18,7 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "74.7.9";
+var packageVersion = "74.9.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

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

@@ -104,7 +104,6 @@ export var PortalProviderAPI = /*#__PURE__*/function (_EventDispatcher) {
       } catch (error) {
         if (this.onAnalyticsEvent) {
           this.onAnalyticsEvent({
-            // @ts-expect-error
             payload: {
               action: ACTION.FAILED_TO_UNMOUNT,
               actionSubject: ACTION_SUBJECT.EDITOR,

package/dist/esm/ui-menu/DropdownMenu/index.js

@@ -20,6 +20,7 @@ import React, { PureComponent } from 'react';
 import { css, jsx } from '@emotion/react';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { CustomItem, MenuGroup } from '@atlaskit/menu';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { B100, DN600, DN80, N70, N900 } from '@atlaskit/theme/colors';
 import { themed } from '@atlaskit/theme/components';
 import Tooltip from '@atlaskit/tooltip';
@@ -229,7 +230,17 @@ var DropdownMenuItemCustomComponent = /*#__PURE__*/React.forwardRef(function (pr
     rest = _objectWithoutProperties(props, _excluded);
   return jsx("span", _extends({
     ref: ref
-  }, rest), children);
+  }, rest, {
+    style: {
+      // This forces the item container back to be `position: static`, the default value.
+      // This ensures the custom nested menu for table color picker still works as now
+      // menu items from @atlaskit/menu all have `position: relative` set for the selected borders.
+      // The current implementation unfortunately is very brittle. Design System Team will
+      // be prioritizing official support for accessible nested menus that we want you to move
+      // to in the future.
+      position: getBooleanFF('platform.design-system-team.menu-selected-state-change_0see9') ? 'static' : undefined
+    }
+  }), children);
 });
 function DropdownMenuItem(_ref) {
   var _item$key2;

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.7.9",
+	"version": "74.9.0",
 	"sideEffects": false
 }

package/dist/types/react-node-view/index.d.ts

@@ -4,7 +4,7 @@ import { Decoration, EditorView, NodeView } from 'prosemirror-view';
 import { EventDispatcher } from '../event-dispatcher';
 import type { PortalProviderAPI } from '../ui/PortalProvider';
 import { ForwardRef, getPosHandler, ReactComponentProps, shouldUpdate } from './types';
-export type { getPosHandler, ReactComponentProps };
+export type { getPosHandler, ReactComponentProps, shouldUpdate };
 export type { InlineNodeViewComponentProps } from './getInlineNodeViewProducer';
 export { getInlineNodeViewProducer, inlineNodeViewClassname, } from './getInlineNodeViewProducer';
 export default class ReactNodeView<P = ReactComponentProps> implements NodeView {
@@ -16,6 +16,7 @@ export default class ReactNodeView<P = ReactComponentProps> implements NodeView
     private _viewShouldUpdate?;
     protected eventDispatcher?: EventDispatcher;
     private hasIntlContext;
+    protected decorations: Decoration[];
     reactComponentProps: P;
     view: EditorView;
     getPos: getPosHandler;
@@ -41,8 +42,8 @@ export default class ReactNodeView<P = ReactComponentProps> implements NodeView
     handleRef: (node: HTMLElement | null) => void;
     private _handleRef;
     render(props: P, forwardRef?: ForwardRef): React.ReactElement<any> | null;
-    update(node: PMNode, _decorations: Array<Decoration>, _innerDecorations?: Array<Decoration>, validUpdate?: (currentNode: PMNode, newNode: PMNode) => boolean): boolean;
-    viewShouldUpdate(nextNode: PMNode): boolean;
+    update(node: PMNode, decorations: Array<Decoration>, _innerDecorations?: Array<Decoration>, validUpdate?: (currentNode: PMNode, newNode: PMNode) => boolean): boolean;
+    viewShouldUpdate(nextNode: PMNode, decorations?: Array<Decoration>): boolean;
     /**
      * Copies the attributes from a ProseMirror Node to a DOM node.
      * @param node The Prosemirror Node from which to source the attributes

package/dist/types/selection-based-node-view/SelectionBasedNodeView.d.ts

@@ -0,0 +1,49 @@
+import React from 'react';
+import { Node as PMNode } from 'prosemirror-model';
+import { EditorView } from 'prosemirror-view';
+import { EventDispatcher } from '../event-dispatcher';
+import ReactNodeView, { getPosHandler, ReactComponentProps, shouldUpdate } from '../react-node-view';
+import { PortalProviderAPI } from '../ui/PortalProvider';
+/**
+ * A ReactNodeView that handles React components sensitive
+ * to selection changes.
+ *
+ * If the selection changes, it will attempt to re-render the
+ * React component. Otherwise it does nothing.
+ *
+ * You can subclass `viewShouldUpdate` to include other
+ * props that your component might want to consider before
+ * entering the React lifecycle. These are usually props you
+ * compare in `shouldComponentUpdate`.
+ *
+ * An example:
+ *
+ * ```
+ * viewShouldUpdate(nextNode) {
+ *   if (nextNode.attrs !== this.node.attrs) {
+ *     return true;
+ *   }
+ *
+ *   return super.viewShouldUpdate(nextNode);
+ * }```
+ */
+export declare class SelectionBasedNodeView<P = ReactComponentProps> extends ReactNodeView<P> {
+    protected isSelectedNode: boolean;
+    pos: number | undefined;
+    posEnd: number | undefined;
+    constructor(node: PMNode, view: EditorView, getPos: getPosHandler, portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, reactComponentProps: P, reactComponent?: React.ComponentType<any>, hasContext?: boolean, viewShouldUpdate?: shouldUpdate, hasIntlContext?: boolean);
+    /**
+     * Update current node's start and end positions.
+     *
+     * Prefer `this.pos` rather than getPos(), because calling getPos is
+     * expensive, unless you know you're definitely going to render.
+     */
+    private updatePos;
+    private getPositionsWithDefault;
+    private isNodeInsideSelection;
+    private isSelectionInsideNode;
+    insideSelection: () => boolean;
+    nodeInsideSelection: () => boolean;
+    selectNode(): void;
+    deselectNode(): void;
+}

package/dist/types/selection-based-node-view/index.d.ts

@@ -0,0 +1 @@
+export { SelectionBasedNodeView } from './SelectionBasedNodeView';

package/dist/types-ts4.5/react-node-view/index.d.ts

@@ -4,7 +4,7 @@ import { Decoration, EditorView, NodeView } from 'prosemirror-view';
 import { EventDispatcher } from '../event-dispatcher';
 import type { PortalProviderAPI } from '../ui/PortalProvider';
 import { ForwardRef, getPosHandler, ReactComponentProps, shouldUpdate } from './types';
-export type { getPosHandler, ReactComponentProps };
+export type { getPosHandler, ReactComponentProps, shouldUpdate };
 export type { InlineNodeViewComponentProps } from './getInlineNodeViewProducer';
 export { getInlineNodeViewProducer, inlineNodeViewClassname, } from './getInlineNodeViewProducer';
 export default class ReactNodeView<P = ReactComponentProps> implements NodeView {
@@ -16,6 +16,7 @@ export default class ReactNodeView<P = ReactComponentProps> implements NodeView
     private _viewShouldUpdate?;
     protected eventDispatcher?: EventDispatcher;
     private hasIntlContext;
+    protected decorations: Decoration[];
     reactComponentProps: P;
     view: EditorView;
     getPos: getPosHandler;
@@ -41,8 +42,8 @@ export default class ReactNodeView<P = ReactComponentProps> implements NodeView
     handleRef: (node: HTMLElement | null) => void;
     private _handleRef;
     render(props: P, forwardRef?: ForwardRef): React.ReactElement<any> | null;
-    update(node: PMNode, _decorations: Array<Decoration>, _innerDecorations?: Array<Decoration>, validUpdate?: (currentNode: PMNode, newNode: PMNode) => boolean): boolean;
-    viewShouldUpdate(nextNode: PMNode): boolean;
+    update(node: PMNode, decorations: Array<Decoration>, _innerDecorations?: Array<Decoration>, validUpdate?: (currentNode: PMNode, newNode: PMNode) => boolean): boolean;
+    viewShouldUpdate(nextNode: PMNode, decorations?: Array<Decoration>): boolean;
     /**
      * Copies the attributes from a ProseMirror Node to a DOM node.
      * @param node The Prosemirror Node from which to source the attributes

package/dist/types-ts4.5/selection-based-node-view/SelectionBasedNodeView.d.ts

@@ -0,0 +1,49 @@
+import React from 'react';
+import { Node as PMNode } from 'prosemirror-model';
+import { EditorView } from 'prosemirror-view';
+import { EventDispatcher } from '../event-dispatcher';
+import ReactNodeView, { getPosHandler, ReactComponentProps, shouldUpdate } from '../react-node-view';
+import { PortalProviderAPI } from '../ui/PortalProvider';
+/**
+ * A ReactNodeView that handles React components sensitive
+ * to selection changes.
+ *
+ * If the selection changes, it will attempt to re-render the
+ * React component. Otherwise it does nothing.
+ *
+ * You can subclass `viewShouldUpdate` to include other
+ * props that your component might want to consider before
+ * entering the React lifecycle. These are usually props you
+ * compare in `shouldComponentUpdate`.
+ *
+ * An example:
+ *
+ * ```
+ * viewShouldUpdate(nextNode) {
+ *   if (nextNode.attrs !== this.node.attrs) {
+ *     return true;
+ *   }
+ *
+ *   return super.viewShouldUpdate(nextNode);
+ * }```
+ */
+export declare class SelectionBasedNodeView<P = ReactComponentProps> extends ReactNodeView<P> {
+    protected isSelectedNode: boolean;
+    pos: number | undefined;
+    posEnd: number | undefined;
+    constructor(node: PMNode, view: EditorView, getPos: getPosHandler, portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, reactComponentProps: P, reactComponent?: React.ComponentType<any>, hasContext?: boolean, viewShouldUpdate?: shouldUpdate, hasIntlContext?: boolean);
+    /**
+     * Update current node's start and end positions.
+     *
+     * Prefer `this.pos` rather than getPos(), because calling getPos is
+     * expensive, unless you know you're definitely going to render.
+     */
+    private updatePos;
+    private getPositionsWithDefault;
+    private isNodeInsideSelection;
+    private isSelectionInsideNode;
+    insideSelection: () => boolean;
+    nodeInsideSelection: () => boolean;
+    selectNode(): void;
+    deselectNode(): void;
+}

package/dist/types-ts4.5/selection-based-node-view/index.d.ts

@@ -0,0 +1 @@
+export { SelectionBasedNodeView } from './SelectionBasedNodeView';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-common",
-  "version": "74.7.9",
+  "version": "74.9.0",
   "description": "A package that contains common classes and components for editor and renderer",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -25,6 +25,7 @@
   "atlassian": {
     "team": "Editor",
     "inPublicMirror": true,
+    "singleton": true,
     "releaseModel": "continuous"
   },
   "af:exports": {
@@ -67,7 +68,8 @@
     "./monitoring": "./src/monitoring/index.ts",
     "./paste": "./src/paste/index.ts",
     "./resizer": "./src/resizer/index.ts",
-    "./editor-analytics": "./src/editor-analytics/index.ts"
+    "./editor-analytics": "./src/editor-analytics/index.ts",
+    "./selection-based-node-view": "./src/selection-based-node-view/index.ts"
   },
   "dependencies": {
     "@atlaskit/activity-provider": "^2.4.0",
@@ -80,23 +82,23 @@
     "@atlaskit/button": "^16.8.0",
     "@atlaskit/code": "^14.6.0",
     "@atlaskit/codemod-utils": "^4.2.0",
-    "@atlaskit/collab-provider": "^9.2.0",
-    "@atlaskit/editor-palette": "1.5.0",
+    "@atlaskit/collab-provider": "^9.3.0",
+    "@atlaskit/editor-palette": "1.5.1",
     "@atlaskit/editor-shared-styles": "^2.4.0",
     "@atlaskit/emoji": "^67.4.0",
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/in-product-testing": "^0.2.0",
     "@atlaskit/media-card": "^76.0.0",
     "@atlaskit/media-client": "^23.1.0",
-    "@atlaskit/media-picker": "^66.0.0",
+    "@atlaskit/media-picker": "^66.1.0",
     "@atlaskit/mention": "^22.1.0",
     "@atlaskit/menu": "^1.7.0",
     "@atlaskit/platform-feature-flags": "^0.2.0",
-    "@atlaskit/profilecard": "^19.4.0",
+    "@atlaskit/profilecard": "^19.5.0",
     "@atlaskit/smart-user-picker": "^6.1.0",
     "@atlaskit/task-decision": "^17.6.0",
     "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.8.0",
+    "@atlaskit/tokens": "^1.9.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@atlaskit/ufo": "^0.2.0",
     "@atlaskit/width-detector": "^4.1.0",
@@ -134,10 +136,10 @@
     "react-intl-next": "npm:react-intl@^5.18.1"
   },
   "devDependencies": {
-    "@atlaskit/editor-core": "^185.2.0",
+    "@atlaskit/editor-core": "^185.3.0",
     "@atlaskit/editor-json-transformer": "^8.9.0",
-    "@atlaskit/editor-plugin-analytics": "^0.0.2",
-    "@atlaskit/editor-plugin-content-insertion": "^0.0.2",
+    "@atlaskit/editor-plugin-analytics": "^0.0.3",
+    "@atlaskit/editor-plugin-content-insertion": "^0.0.3",
     "@atlaskit/editor-plugin-decorations": "^0.1.0",
     "@atlaskit/editor-plugin-feature-flags": "^0.1.0",
     "@atlaskit/editor-plugin-grid": "^0.1.0",
@@ -183,6 +185,9 @@
   "platform-feature-flags": {
     "platform.editor.sentry-error-monitoring_6bksu": {
       "type": "boolean"
+    },
+    "platform.design-system-team.menu-selected-state-change_0see9": {
+      "type": "boolean"
     }
   }
 }

package/selection-based-node-view/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "@atlaskit/editor-common/selection-based-node-view",
+  "main": "../dist/cjs/selection-based-node-view/index.js",
+  "module": "../dist/esm/selection-based-node-view/index.js",
+  "module:es2019": "../dist/es2019/selection-based-node-view/index.js",
+  "sideEffects": false,
+  "types": "../dist/types/selection-based-node-view/index.d.ts",
+  "typesVersions": {
+    ">=4.5 <4.9": {
+      "*": [
+        "../dist/types-ts4.5/selection-based-node-view/index.d.ts"
+      ]
+    }
+  }
+}