@atlaskit/editor-common 96.1.1 → 96.2.0

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-common
 
+## 96.2.0
+
+### Minor Changes
+
+- [#168049](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/168049)
+  [`f0b76d1c73ba0`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f0b76d1c73ba0) -
+  [ux] Utilizing the new extension plugin's \_\_rendererExtensionOptions option to be able to render
+  renderer view of bodied extensions on toggle in editor
+
 ## 96.1.1
 
 ### Patch Changes

package/dist/cjs/extensibility/ExtensionComponent.js

@@ -49,6 +49,13 @@ var isEmptyBodiedMacro = function isEmptyBodiedMacro(node) {
   var isEmptyWithNoContent = !firstGrandChildNode && node.childCount === 1;
   return isEmptyWithPlacholder || isEmptyWithNoContent;
 };
+var getBodiedExtensionContent = function getBodiedExtensionContent(node) {
+  var bodiedExtensionContent = [];
+  node.content.forEach(function (childNode) {
+    bodiedExtensionContent.push((0, _utils.nodeToJSON)(childNode));
+  });
+  return !!bodiedExtensionContent.length ? bodiedExtensionContent : node.attrs.text;
+};
 var ExtensionComponentOld = exports.ExtensionComponentOld = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(ExtensionComponentOld, _Component);
   var _super = _createSuper(ExtensionComponentOld);
@@ -134,7 +141,8 @@ var ExtensionComponentOld = exports.ExtensionComponentOld = /*#__PURE__*/functio
       var _pmNode$marks;
       var _this$props = _this.props,
         extensionHandlers = _this$props.extensionHandlers,
-        editorView = _this$props.editorView;
+        editorView = _this$props.editorView,
+        rendererExtensionHandlers = _this$props.rendererExtensionHandlers;
       var showBodiedExtensionRendererView = _this.state.showBodiedExtensionRendererView; // State will only be true if the gate is on and meets requirements
       var _pmNode$attrs = pmNode.attrs,
         extensionType = _pmNode$attrs.extensionType,
@@ -148,22 +156,23 @@ var ExtensionComponentOld = exports.ExtensionComponentOld = /*#__PURE__*/functio
       var fragmentLocalId = pmNode === null || pmNode === void 0 || (_pmNode$marks = pmNode.marks) === null || _pmNode$marks === void 0 || (_pmNode$marks = _pmNode$marks.find(function (m) {
         return m.type.name === 'fragment';
       })) === null || _pmNode$marks === void 0 || (_pmNode$marks = _pmNode$marks.attrs) === null || _pmNode$marks === void 0 ? void 0 : _pmNode$marks.localId;
-      var nodeContent = [];
-      if (isBodiedExtension) {
-        var _pmNode$content;
-        pmNode === null || pmNode === void 0 || (_pmNode$content = pmNode.content) === null || _pmNode$content === void 0 || _pmNode$content.forEach(function (childNode) {
-          nodeContent.push(childNode);
-        });
-      }
+      var content = isBodiedExtension ? getBodiedExtensionContent(pmNode) : text;
       var node = {
         type: pmNode.type.name,
         extensionType: extensionType,
         extensionKey: extensionKey,
         parameters: parameters,
-        content: isBodiedExtension ? nodeContent.length ? nodeContent : text : text,
+        content: content,
         localId: pmNode.attrs.localId,
         fragmentLocalId: fragmentLocalId
       };
+      if (isBodiedExtension) {
+        var rendererExtensionHandler = rendererExtensionHandlers === null || rendererExtensionHandlers === void 0 ? void 0 : rendererExtensionHandlers[extensionType];
+        if (!rendererExtensionHandler) {
+          return null;
+        }
+        return (0, _utils.getExtensionRenderer)(rendererExtensionHandler)(node, (0, _utils.toJSON)(editorView.state.doc));
+      }
       var result;
       if (extensionHandlers && extensionHandlers[extensionType]) {
         var render = (0, _utils.getExtensionRenderer)(extensionHandlers[extensionType]);
@@ -431,7 +440,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
       var _this2$props = _this2.props,
         extensionHandlers = _this2$props.extensionHandlers,
         editorView = _this2$props.editorView,
-        showBodiedExtensionRendererView = _this2$props.showBodiedExtensionRendererView;
+        showBodiedExtensionRendererView = _this2$props.showBodiedExtensionRendererView,
+        rendererExtensionHandlers = _this2$props.rendererExtensionHandlers;
       var _pmNode$attrs2 = pmNode.attrs,
         extensionType = _pmNode$attrs2.extensionType,
         extensionKey = _pmNode$attrs2.extensionKey,
@@ -444,22 +454,23 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
       var fragmentLocalId = pmNode === null || pmNode === void 0 || (_pmNode$marks2 = pmNode.marks) === null || _pmNode$marks2 === void 0 || (_pmNode$marks2 = _pmNode$marks2.find(function (m) {
         return m.type.name === 'fragment';
       })) === null || _pmNode$marks2 === void 0 || (_pmNode$marks2 = _pmNode$marks2.attrs) === null || _pmNode$marks2 === void 0 ? void 0 : _pmNode$marks2.localId;
-      var nodeContent = [];
-      if (isBodiedExtension) {
-        var _pmNode$content2;
-        pmNode === null || pmNode === void 0 || (_pmNode$content2 = pmNode.content) === null || _pmNode$content2 === void 0 || _pmNode$content2.forEach(function (childNode) {
-          nodeContent.push(childNode);
-        });
-      }
+      var content = isBodiedExtension ? getBodiedExtensionContent(pmNode) : text;
       var node = {
         type: pmNode.type.name,
         extensionType: extensionType,
         extensionKey: extensionKey,
         parameters: parameters,
-        content: isBodiedExtension ? nodeContent.length ? nodeContent : text : text,
+        content: content,
         localId: pmNode.attrs.localId,
         fragmentLocalId: fragmentLocalId
       };
+      if (isBodiedExtension) {
+        var rendererExtensionHandler = rendererExtensionHandlers === null || rendererExtensionHandlers === void 0 ? void 0 : rendererExtensionHandlers[extensionType];
+        if (!rendererExtensionHandler) {
+          return null;
+        }
+        return (0, _utils.getExtensionRenderer)(rendererExtensionHandler)(node, (0, _utils.toJSON)(editorView.state.doc));
+      }
       var result;
       if (extensionHandlers && extensionHandlers[extensionType]) {
         var render = (0, _utils.getExtensionRenderer)(extensionHandlers[extensionType]);

package/dist/cjs/monitoring/error.js

@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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 = "96.1.1";
+var packageVersion = "96.2.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/ui/DropList/index.js

@@ -24,7 +24,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * @jsx jsx
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "96.1.1";
+var packageVersion = "96.2.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/es2019/extensibility/ExtensionComponent.js

@@ -6,7 +6,7 @@ import memoizeOne from 'memoize-one';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '../extensions';
-import { getExtensionRenderer, nodeToJSON } from '../utils';
+import { getExtensionRenderer, nodeToJSON, toJSON } from '../utils';
 import Extension from './Extension/Extension';
 import InlineExtension from './Extension/InlineExtension';
 import MultiBodiedExtension from './MultiBodiedExtension';
@@ -28,6 +28,13 @@ const isEmptyBodiedMacro = node => {
   const isEmptyWithNoContent = !firstGrandChildNode && node.childCount === 1;
   return isEmptyWithPlacholder || isEmptyWithNoContent;
 };
+const getBodiedExtensionContent = node => {
+  const bodiedExtensionContent = [];
+  node.content.forEach(childNode => {
+    bodiedExtensionContent.push(nodeToJSON(childNode));
+  });
+  return !!bodiedExtensionContent.length ? bodiedExtensionContent : node.attrs.text;
+};
 export class ExtensionComponentOld extends Component {
   constructor(...args) {
     super(...args);
@@ -94,7 +101,8 @@ export class ExtensionComponentOld extends Component {
       var _pmNode$marks, _pmNode$marks$find, _pmNode$marks$find$at;
       const {
         extensionHandlers,
-        editorView
+        editorView,
+        rendererExtensionHandlers
       } = this.props;
       const {
         showBodiedExtensionRendererView
@@ -110,22 +118,23 @@ export class ExtensionComponentOld extends Component {
         return;
       }
       const fragmentLocalId = pmNode === null || pmNode === void 0 ? void 0 : (_pmNode$marks = pmNode.marks) === null || _pmNode$marks === void 0 ? void 0 : (_pmNode$marks$find = _pmNode$marks.find(m => m.type.name === 'fragment')) === null || _pmNode$marks$find === void 0 ? void 0 : (_pmNode$marks$find$at = _pmNode$marks$find.attrs) === null || _pmNode$marks$find$at === void 0 ? void 0 : _pmNode$marks$find$at.localId;
-      const nodeContent = [];
-      if (isBodiedExtension) {
-        var _pmNode$content;
-        pmNode === null || pmNode === void 0 ? void 0 : (_pmNode$content = pmNode.content) === null || _pmNode$content === void 0 ? void 0 : _pmNode$content.forEach(childNode => {
-          nodeContent.push(childNode);
-        });
-      }
+      const content = isBodiedExtension ? getBodiedExtensionContent(pmNode) : text;
       const node = {
         type: pmNode.type.name,
         extensionType,
         extensionKey,
         parameters,
-        content: isBodiedExtension ? nodeContent.length ? nodeContent : text : text,
+        content,
         localId: pmNode.attrs.localId,
         fragmentLocalId
       };
+      if (isBodiedExtension) {
+        const rendererExtensionHandler = rendererExtensionHandlers === null || rendererExtensionHandlers === void 0 ? void 0 : rendererExtensionHandlers[extensionType];
+        if (!rendererExtensionHandler) {
+          return null;
+        }
+        return getExtensionRenderer(rendererExtensionHandler)(node, toJSON(editorView.state.doc));
+      }
       let result;
       if (extensionHandlers && extensionHandlers[extensionType]) {
         const render = getExtensionRenderer(extensionHandlers[extensionType]);
@@ -361,7 +370,8 @@ class ExtensionComponentInner extends Component {
       const {
         extensionHandlers,
         editorView,
-        showBodiedExtensionRendererView
+        showBodiedExtensionRendererView,
+        rendererExtensionHandlers
       } = this.props;
       const {
         extensionType,
@@ -374,22 +384,23 @@ class ExtensionComponentInner extends Component {
         return;
       }
       const fragmentLocalId = pmNode === null || pmNode === void 0 ? void 0 : (_pmNode$marks2 = pmNode.marks) === null || _pmNode$marks2 === void 0 ? void 0 : (_pmNode$marks2$find = _pmNode$marks2.find(m => m.type.name === 'fragment')) === null || _pmNode$marks2$find === void 0 ? void 0 : (_pmNode$marks2$find$a = _pmNode$marks2$find.attrs) === null || _pmNode$marks2$find$a === void 0 ? void 0 : _pmNode$marks2$find$a.localId;
-      const nodeContent = [];
-      if (isBodiedExtension) {
-        var _pmNode$content2;
-        pmNode === null || pmNode === void 0 ? void 0 : (_pmNode$content2 = pmNode.content) === null || _pmNode$content2 === void 0 ? void 0 : _pmNode$content2.forEach(childNode => {
-          nodeContent.push(childNode);
-        });
-      }
+      const content = isBodiedExtension ? getBodiedExtensionContent(pmNode) : text;
       const node = {
         type: pmNode.type.name,
         extensionType,
         extensionKey,
         parameters,
-        content: isBodiedExtension ? nodeContent.length ? nodeContent : text : text,
+        content,
         localId: pmNode.attrs.localId,
         fragmentLocalId
       };
+      if (isBodiedExtension) {
+        const rendererExtensionHandler = rendererExtensionHandlers === null || rendererExtensionHandlers === void 0 ? void 0 : rendererExtensionHandlers[extensionType];
+        if (!rendererExtensionHandler) {
+          return null;
+        }
+        return getExtensionRenderer(rendererExtensionHandler)(node, toJSON(editorView.state.doc));
+      }
       let result;
       if (extensionHandlers && extensionHandlers[extensionType]) {
         const render = getExtensionRenderer(extensionHandlers[extensionType]);

package/dist/es2019/monitoring/error.js

@@ -1,7 +1,7 @@
 import { isFedRamp } from './environment';
 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 = "96.1.1";
+const packageVersion = "96.2.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

@@ -13,7 +13,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "96.1.1";
+const packageVersion = "96.2.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/esm/extensibility/ExtensionComponent.js

@@ -19,7 +19,7 @@ import memoizeOne from 'memoize-one';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '../extensions';
-import { getExtensionRenderer, nodeToJSON } from '../utils';
+import { getExtensionRenderer, nodeToJSON, toJSON } from '../utils';
 import Extension from './Extension/Extension';
 import InlineExtension from './Extension/InlineExtension';
 import MultiBodiedExtension from './MultiBodiedExtension';
@@ -41,6 +41,13 @@ var isEmptyBodiedMacro = function isEmptyBodiedMacro(node) {
   var isEmptyWithNoContent = !firstGrandChildNode && node.childCount === 1;
   return isEmptyWithPlacholder || isEmptyWithNoContent;
 };
+var getBodiedExtensionContent = function getBodiedExtensionContent(node) {
+  var bodiedExtensionContent = [];
+  node.content.forEach(function (childNode) {
+    bodiedExtensionContent.push(nodeToJSON(childNode));
+  });
+  return !!bodiedExtensionContent.length ? bodiedExtensionContent : node.attrs.text;
+};
 export var ExtensionComponentOld = /*#__PURE__*/function (_Component) {
   _inherits(ExtensionComponentOld, _Component);
   var _super = _createSuper(ExtensionComponentOld);
@@ -126,7 +133,8 @@ export var ExtensionComponentOld = /*#__PURE__*/function (_Component) {
       var _pmNode$marks;
       var _this$props = _this.props,
         extensionHandlers = _this$props.extensionHandlers,
-        editorView = _this$props.editorView;
+        editorView = _this$props.editorView,
+        rendererExtensionHandlers = _this$props.rendererExtensionHandlers;
       var showBodiedExtensionRendererView = _this.state.showBodiedExtensionRendererView; // State will only be true if the gate is on and meets requirements
       var _pmNode$attrs = pmNode.attrs,
         extensionType = _pmNode$attrs.extensionType,
@@ -140,22 +148,23 @@ export var ExtensionComponentOld = /*#__PURE__*/function (_Component) {
       var fragmentLocalId = pmNode === null || pmNode === void 0 || (_pmNode$marks = pmNode.marks) === null || _pmNode$marks === void 0 || (_pmNode$marks = _pmNode$marks.find(function (m) {
         return m.type.name === 'fragment';
       })) === null || _pmNode$marks === void 0 || (_pmNode$marks = _pmNode$marks.attrs) === null || _pmNode$marks === void 0 ? void 0 : _pmNode$marks.localId;
-      var nodeContent = [];
-      if (isBodiedExtension) {
-        var _pmNode$content;
-        pmNode === null || pmNode === void 0 || (_pmNode$content = pmNode.content) === null || _pmNode$content === void 0 || _pmNode$content.forEach(function (childNode) {
-          nodeContent.push(childNode);
-        });
-      }
+      var content = isBodiedExtension ? getBodiedExtensionContent(pmNode) : text;
       var node = {
         type: pmNode.type.name,
         extensionType: extensionType,
         extensionKey: extensionKey,
         parameters: parameters,
-        content: isBodiedExtension ? nodeContent.length ? nodeContent : text : text,
+        content: content,
         localId: pmNode.attrs.localId,
         fragmentLocalId: fragmentLocalId
       };
+      if (isBodiedExtension) {
+        var rendererExtensionHandler = rendererExtensionHandlers === null || rendererExtensionHandlers === void 0 ? void 0 : rendererExtensionHandlers[extensionType];
+        if (!rendererExtensionHandler) {
+          return null;
+        }
+        return getExtensionRenderer(rendererExtensionHandler)(node, toJSON(editorView.state.doc));
+      }
       var result;
       if (extensionHandlers && extensionHandlers[extensionType]) {
         var render = getExtensionRenderer(extensionHandlers[extensionType]);
@@ -423,7 +432,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
       var _this2$props = _this2.props,
         extensionHandlers = _this2$props.extensionHandlers,
         editorView = _this2$props.editorView,
-        showBodiedExtensionRendererView = _this2$props.showBodiedExtensionRendererView;
+        showBodiedExtensionRendererView = _this2$props.showBodiedExtensionRendererView,
+        rendererExtensionHandlers = _this2$props.rendererExtensionHandlers;
       var _pmNode$attrs2 = pmNode.attrs,
         extensionType = _pmNode$attrs2.extensionType,
         extensionKey = _pmNode$attrs2.extensionKey,
@@ -436,22 +446,23 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
       var fragmentLocalId = pmNode === null || pmNode === void 0 || (_pmNode$marks2 = pmNode.marks) === null || _pmNode$marks2 === void 0 || (_pmNode$marks2 = _pmNode$marks2.find(function (m) {
         return m.type.name === 'fragment';
       })) === null || _pmNode$marks2 === void 0 || (_pmNode$marks2 = _pmNode$marks2.attrs) === null || _pmNode$marks2 === void 0 ? void 0 : _pmNode$marks2.localId;
-      var nodeContent = [];
-      if (isBodiedExtension) {
-        var _pmNode$content2;
-        pmNode === null || pmNode === void 0 || (_pmNode$content2 = pmNode.content) === null || _pmNode$content2 === void 0 || _pmNode$content2.forEach(function (childNode) {
-          nodeContent.push(childNode);
-        });
-      }
+      var content = isBodiedExtension ? getBodiedExtensionContent(pmNode) : text;
       var node = {
         type: pmNode.type.name,
         extensionType: extensionType,
         extensionKey: extensionKey,
         parameters: parameters,
-        content: isBodiedExtension ? nodeContent.length ? nodeContent : text : text,
+        content: content,
         localId: pmNode.attrs.localId,
         fragmentLocalId: fragmentLocalId
       };
+      if (isBodiedExtension) {
+        var rendererExtensionHandler = rendererExtensionHandlers === null || rendererExtensionHandlers === void 0 ? void 0 : rendererExtensionHandlers[extensionType];
+        if (!rendererExtensionHandler) {
+          return null;
+        }
+        return getExtensionRenderer(rendererExtensionHandler)(node, toJSON(editorView.state.doc));
+      }
       var result;
       if (extensionHandlers && extensionHandlers[extensionType]) {
         var render = getExtensionRenderer(extensionHandlers[extensionType]);

package/dist/esm/monitoring/error.js

@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { isFedRamp } from './environment';
 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 = "96.1.1";
+var packageVersion = "96.2.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/ui/DropList/index.js

@@ -21,7 +21,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "96.1.1";
+var packageVersion = "96.2.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "96.1.1",
+	"version": "96.2.0",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"