@atlaskit/editor-common 74.7.8 → 74.8.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-common
 
+## 74.8.0
+
+### Minor Changes
+
+- [`5e01082b600`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5e01082b600) - Extracting SelectionBasedNodeView to editor-common.
+
+## 74.7.9
+
+### Patch Changes
+
+- [`87366c84531`](https://bitbucket.org/atlassian/atlassian-frontend/commits/87366c84531) - Extract context panel plugin to new package @atlaskit/editor-plugin-context-panel
+
 ## 74.7.8
 
 ### 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.8";
+var packageVersion = "74.8.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.8";
+var packageVersion = "74.8.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/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.7.8",
+	"version": "74.8.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.8";
+const packageVersion = "74.8.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.8";
+const packageVersion = "74.8.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/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.7.8",
+	"version": "74.8.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.8";
+var packageVersion = "74.8.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.8";
+var packageVersion = "74.8.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/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.7.8",
+	"version": "74.8.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/types/index.d.ts

@@ -28,7 +28,7 @@ export type { EditorReactContext } from './editor-react-context';
 export type { PMPluginFactoryParams, PMPluginFactory, PMPlugin, } from './plugin-factory';
 export type { NodeConfig, MarkConfig, NodeViewConfig, } from './prosemirror-config';
 export type { PluginsOptions, EditorPlugin, getPosHandler, getPosHandlerNode, } from './editor-plugin';
-export type { NextEditorPlugin, AllEditorPresetPluginTypes, PluginDependenciesAPI, ExtractPluginNameFromAllBuilderPlugins, SafePresetCheck, DefaultEditorPlugin, OptionalPlugin, PluginInjectionAPI, CreatePluginDependenciesAPI, NextEditorPluginMetadata, ExtractInjectionAPI, ExtractPluginActions, PluginInjectionAPIWithDependency, } from './next-editor-plugin';
+export type { NextEditorPlugin, AllEditorPresetPluginTypes, PluginDependenciesAPI, ExtractPluginNameFromAllBuilderPlugins, SafePresetCheck, DefaultEditorPlugin, OptionalPlugin, PluginInjectionAPI, CreatePluginDependenciesAPI, NextEditorPluginMetadata, ExtractInjectionAPI, ExtractPluginActions, PluginInjectionAPIWithDependency, PluginInjectionAPIWithDependencies, } from './next-editor-plugin';
 export type IconProps = {
     label?: string;
 };

package/dist/types/types/next-editor-plugin.d.ts

@@ -37,6 +37,9 @@ export type PluginInjectionAPIWithDependency<Plugin> = Plugin extends NextEditor
         NextEditorPlugin<Name, Metadata>
     ]>;
 } : never;
+export type PluginInjectionAPIWithDependencies<Plugins> = Plugins extends NextEditorPlugin<infer Name, infer Metadata>[] ? {
+    dependencies: CreatePluginDependenciesAPI<Plugins>;
+} : never;
 type NextEditorPluginFunctionDefinition<Name extends string, Metadata extends NextEditorPluginMetadata, Configuration> = (config: Configuration, api?: PluginInjectionAPI<Name, Metadata>) => DefaultEditorPlugin<Name, Metadata>;
 type NextEditorPluginFunctionOptionalConfigDefinition<Name extends string, Metadata extends NextEditorPluginMetadata, Configuration = undefined> = (config?: Configuration, api?: PluginInjectionAPI<Name, Metadata>) => DefaultEditorPlugin<Name, Metadata>;
 type OptionalPrivateProperty = {

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/dist/types-ts4.5/types/index.d.ts

@@ -28,7 +28,7 @@ export type { EditorReactContext } from './editor-react-context';
 export type { PMPluginFactoryParams, PMPluginFactory, PMPlugin, } from './plugin-factory';
 export type { NodeConfig, MarkConfig, NodeViewConfig, } from './prosemirror-config';
 export type { PluginsOptions, EditorPlugin, getPosHandler, getPosHandlerNode, } from './editor-plugin';
-export type { NextEditorPlugin, AllEditorPresetPluginTypes, PluginDependenciesAPI, ExtractPluginNameFromAllBuilderPlugins, SafePresetCheck, DefaultEditorPlugin, OptionalPlugin, PluginInjectionAPI, CreatePluginDependenciesAPI, NextEditorPluginMetadata, ExtractInjectionAPI, ExtractPluginActions, PluginInjectionAPIWithDependency, } from './next-editor-plugin';
+export type { NextEditorPlugin, AllEditorPresetPluginTypes, PluginDependenciesAPI, ExtractPluginNameFromAllBuilderPlugins, SafePresetCheck, DefaultEditorPlugin, OptionalPlugin, PluginInjectionAPI, CreatePluginDependenciesAPI, NextEditorPluginMetadata, ExtractInjectionAPI, ExtractPluginActions, PluginInjectionAPIWithDependency, PluginInjectionAPIWithDependencies, } from './next-editor-plugin';
 export type IconProps = {
     label?: string;
 };

package/dist/types-ts4.5/types/next-editor-plugin.d.ts

@@ -37,6 +37,9 @@ export type PluginInjectionAPIWithDependency<Plugin> = Plugin extends NextEditor
         NextEditorPlugin<Name, Metadata>
     ]>;
 } : never;
+export type PluginInjectionAPIWithDependencies<Plugins> = Plugins extends NextEditorPlugin<infer Name, infer Metadata>[] ? {
+    dependencies: CreatePluginDependenciesAPI<Plugins>;
+} : never;
 type NextEditorPluginFunctionDefinition<Name extends string, Metadata extends NextEditorPluginMetadata, Configuration> = (config: Configuration, api?: PluginInjectionAPI<Name, Metadata>) => DefaultEditorPlugin<Name, Metadata>;
 type NextEditorPluginFunctionOptionalConfigDefinition<Name extends string, Metadata extends NextEditorPluginMetadata, Configuration = undefined> = (config?: Configuration, api?: PluginInjectionAPI<Name, Metadata>) => DefaultEditorPlugin<Name, Metadata>;
 type OptionalPrivateProperty = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-common",
-  "version": "74.7.8",
+  "version": "74.8.0",
   "description": "A package that contains common classes and components for editor and renderer",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -67,7 +67,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",
@@ -77,7 +78,7 @@
     "@atlaskit/analytics-namespaced-context": "^6.7.0",
     "@atlaskit/analytics-next": "^9.1.0",
     "@atlaskit/analytics-next-stable-react-context": "1.0.1",
-    "@atlaskit/button": "^16.7.0",
+    "@atlaskit/button": "^16.8.0",
     "@atlaskit/code": "^14.6.0",
     "@atlaskit/codemod-utils": "^4.2.0",
     "@atlaskit/collab-provider": "^9.2.0",
@@ -143,7 +144,7 @@
     "@atlaskit/editor-plugin-grid": "^0.1.0",
     "@atlaskit/editor-plugin-table": "^1.6.0",
     "@atlaskit/editor-plugin-width": "^0.1.0",
-    "@atlaskit/editor-test-helpers": "^18.6.0",
+    "@atlaskit/editor-test-helpers": "^18.7.0",
     "@atlaskit/media-core": "^34.1.0",
     "@atlaskit/media-test-helpers": "^33.0.0",
     "@atlaskit/smart-card": "^26.5.0",

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"
+      ]
+    }
+  }
+}