@atlaskit/editor-plugin-show-diff 20.0.11 → 21.0.1

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @atlaskit/editor-plugin-show-diff
 
+## 21.0.1
+
+### Patch Changes
+
+- [`df1aa098e75d3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/df1aa098e75d3) -
+  Contributor tags now always render Rovo's real avatar URL when available, instead of the hardcoded
+  Rovo glyph. The glyph was removed; the generic agent fallback is used when no URL is supplied or
+  it fails to load, matching Figma/Lovable/Replit.
+- Updated dependencies
+
+## 21.0.0
+
+### Patch Changes
+
+- [`a302d2ba96967`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a302d2ba96967) -
+  Fix contributor tag placement so it no longer overflows onto the next line when a change wraps.
+- [`6563a0ae0eb6f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6563a0ae0eb6f) -
+  [EDITOR-9212] Fix AI Suggested Edits diff rendering for a table nested inside an expand. Behind
+  `platform_editor_ai_show_diff_patch_2`, the diff preview now keeps the node's `breakout` mark, and
+  renders against its own document so node positions are resolved within the preview instead of the
+  live document — nested tables are no longer sized as top-level and pushed out of their cell, and a
+  preview can no longer write to the live document. The changed-node outline and the "Removed"
+  lozenge are both placed at the breakout width rather than the content column. Selecting a
+  suggestion that targets a collapsed expand now opens it in both the live document and the diff
+  preview, so the change is visible instead of hidden behind a title bar.
+- Updated dependencies
+
 ## 20.0.11
 
 ### Patch Changes

package/dist/cjs/pm-plugins/NodeViewSerializer.js

@@ -8,8 +8,13 @@ exports.NodeViewSerializer = void 0;
 exports.isEditorViewWithNodeViews = isEditorViewWithNodeViews;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _expand = require("@atlaskit/editor-common/expand");
 var _model = require("@atlaskit/editor-prosemirror/model");
+var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
+var _fg = require("@atlaskit/platform-feature-flags/fg");
+var _createEditorProxy = require("./createEditorProxy");
+var _markViews = require("./markViews");
 /**
  * Utilities for working with ProseMirror node views and DOM serialization within the
  * Show Diff editor plugin.
@@ -37,6 +42,16 @@ function isEditorViewWithNodeViews(view) {
   return view.nodeViews !== undefined;
 }
 
+/** Expand-family nodes whose expanded state lives in a node-keyed WeakMap. */
+var EXPAND_TYPES = new Set(['expand', 'nestedExpand']);
+
+/** Tables are the only node views that read and write positions, so only they need a preview. */
+var containsTable = function containsTable(node) {
+  var table = node.type.schema.nodes.table;
+  // `contains` only checks descendants, so the node itself is checked separately.
+  return !!table && (node.type === table || (0, _utils.contains)(node, table));
+};
+
 /**
  * Encapsulates DOM serialization and node view access/creation.
  *
@@ -82,11 +97,18 @@ var NodeViewSerializer = exports.NodeViewSerializer = /*#__PURE__*/function () {
     key: "appendChildNodes",
     value: function appendChildNodes(children, contentDOM) {
       var _this = this;
+      var basePos = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+      var editorProxy = arguments.length > 3 ? arguments[3] : undefined;
+      // A node's first child sits one position inside it, and each subsequent
+      // child is offset by the previous child's `nodeSize`. Tracking this lets nested node
+      // views resolve to their real depth instead of every one of them seeing depth 0.
+      var childPos = basePos + 1;
       children.forEach(function (child) {
-        var childNode = _this.tryCreateNodeView(child) || _this.serializeNode(child);
+        var childNode = _this.tryCreateNodeViewInner(child, childPos, editorProxy) || _this.serializeNode(child);
         if (childNode) {
           contentDOM === null || contentDOM === void 0 || contentDOM.append(childNode);
         }
+        childPos += child.nodeSize;
       });
     }
 
@@ -95,11 +117,29 @@ var NodeViewSerializer = exports.NodeViewSerializer = /*#__PURE__*/function () {
      *
      * Returns `null` when there is no `EditorView`, no constructor for the node type,
      * or the node type is blocklisted. Otherwise returns the constructed node view instance.
+     *
+     * `$sourcePos` is where the node sits in the doc it came from, so nested tables keep their depth.
      */
   }, {
     key: "tryCreateNodeView",
     value: function tryCreateNodeView(targetNode) {
+      var _preview$rootPos;
+      var basePos = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+      var $sourcePos = arguments.length > 2 ? arguments[2] : undefined;
+      if (!this.editorView) {
+        return null;
+      }
+      // The preview becomes the document every nested node view resolves its position against,
+      // so positions stay internally consistent.
+      var preview = (0, _fg.fg)('platform_editor_ai_show_diff_patch_2') && containsTable(targetNode) ? (0, _createEditorProxy.createEditorProxy)(this.editorView, targetNode, $sourcePos) : null;
+      return this.tryCreateNodeViewInner(targetNode, (_preview$rootPos = preview === null || preview === void 0 ? void 0 : preview.rootPos) !== null && _preview$rootPos !== void 0 ? _preview$rootPos : basePos, preview === null || preview === void 0 ? void 0 : preview.editorProxy);
+    }
+  }, {
+    key: "tryCreateNodeViewInner",
+    value: function tryCreateNodeViewInner(targetNode) {
       var _this$nodeViews;
+      var basePos = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+      var editorProxy = arguments.length > 2 ? arguments[2] : undefined;
       if (!this.editorView) {
         return null;
       }
@@ -145,23 +185,47 @@ var NodeViewSerializer = exports.NodeViewSerializer = /*#__PURE__*/function () {
             if (!(0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_show_diff_deleted_nodeview_content') && targetNode.type.name === 'paragraph' && targetNode.children.length === 1) {
               return this.serializeFragment(targetNode.content);
             }
-            this.appendChildNodes(targetNode.children, _contentDOM);
+            this.appendChildNodes(targetNode.children, _contentDOM, basePos, editorProxy);
           }
-          return _dom;
+          return this.withMarkViews(targetNode, _dom, editorProxy);
         }
-        var _constructor = constructor(targetNode, this.editorView, function () {
-            return 0;
+
+        // The expand node view reads `expandedState.get(node) ?? false`, never `attrs.__expanded`.
+        // Open the preview so its tables get real layout; an existing entry is the live expand's
+        // own state, so leave it alone.
+        if (EXPAND_TYPES.has(targetNode.type.name) && !_expand.expandedState.has(targetNode) && (0, _fg.fg)('platform_editor_ai_show_diff_patch_2')) {
+          _expand.expandedState.set(targetNode, true);
+        }
+
+        // `isTableNested` is `doc.resolve(pos).depth > 0`, so the old hardcoded `0` made nested
+        // tables size as top-level. Positions are resolved against the preview document, so
+        // they are only meaningful with an editor proxy.
+        var view = editorProxy !== null && editorProxy !== void 0 ? editorProxy : this.editorView;
+        var docSize = view.state.doc.content.size;
+        var resolvedPos = editorProxy ? Math.max(0, Math.min(basePos, docSize)) : 0;
+        var _constructor = constructor(targetNode, view, function () {
+            return resolvedPos;
           }, [], {}),
           dom = _constructor.dom,
           contentDOM = _constructor.contentDOM;
         // Iteratively populate children
-        this.appendChildNodes(targetNode.children, contentDOM);
-        return dom;
+        this.appendChildNodes(targetNode.children, contentDOM, basePos, editorProxy);
+        return this.withMarkViews(targetNode, dom, editorProxy);
       } catch (_unused) {
         return null;
       }
     }
 
+    /** Wraps rendered DOM in its marks, rendered against the editor proxy when there is one. */
+  }, {
+    key: "withMarkViews",
+    value: function withMarkViews(targetNode, nodeDom, editorProxy) {
+      return (0, _markViews.wrapInMarkViews)(targetNode, nodeDom, {
+        nodeViews: this.nodeViews,
+        view: editorProxy !== null && editorProxy !== void 0 ? editorProxy : this.editorView
+      });
+    }
+
     /**
      * Serializes a node to a DOM `Node` using the schema's `DOMSerializer`.
      */

package/dist/cjs/pm-plugins/createEditorProxy.js

@@ -0,0 +1,84 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createEditorProxy = createEditorProxy;
+var _selection = require("@atlaskit/editor-common/selection/gap-cursor/selection");
+/**
+ * A preview is rendered by the live view's own node views, which read `getPos()` against
+ * `view.state.doc` for both layout (`isTableNested`) and writes (`scaleTable` builds attribute
+ * steps at `getPos() + 1`). Handing them live positions makes the layout correct but points the
+ * writes at unrelated live nodes, so give them a view whose document *is* the preview instead.
+ *
+ * With `$sourcePos` (the node's position in the doc it came from) the node is swapped into a copy
+ * of its real top-level ancestor, so a table inside an expand still resolves as nested.
+ *
+ * Returns `null` when the node cannot be a top-level child (e.g. a bare `tableCell`), in which
+ * case the caller falls back to the live view and the previous stubbed positions.
+ */
+function createEditorProxy(liveView, rootNode, $sourcePos) {
+  var liveState = liveView.state;
+  var createDoc = function createDoc(topLevel) {
+    return liveState.schema.topNodeType.createChecked(null, topLevel);
+  };
+  var previewDoc;
+  var rootPos = 0;
+  try {
+    var _$sourcePos$nodeAfter;
+    if ($sourcePos && $sourcePos.depth > 0 && ((_$sourcePos$nodeAfter = $sourcePos.nodeAfter) === null || _$sourcePos$nodeAfter === void 0 ? void 0 : _$sourcePos$nodeAfter.type) === rootNode.type) {
+      var topLevel = rootNode;
+      for (var depth = $sourcePos.depth; depth > 0; depth--) {
+        var ancestor = $sourcePos.node(depth);
+        topLevel = ancestor.copy(ancestor.content.replaceChild($sourcePos.index(depth), topLevel));
+      }
+      previewDoc = createDoc(topLevel);
+      rootPos = $sourcePos.pos - $sourcePos.before(1);
+    } else {
+      previewDoc = createDoc(rootNode);
+    }
+  } catch (_unused) {
+    return null;
+  }
+
+  // A gap cursor just before the node selects nothing, so the table's node view doesn't render
+  // as selected or show its controls.
+  var previewSelection = new _selection.GapCursorSelection(previewDoc.resolve(rootPos), _selection.Side.LEFT);
+  // Proxy rather than `EditorState.create` so plugin state is shared as-is: re-initialising
+  // every plugin per preview would be costly and re-runs their side effects.
+  var stateProxy = new Proxy(liveState, {
+    get: function get(target, prop, receiver) {
+      if (prop === 'doc') {
+        return previewDoc;
+      }
+      if (prop === 'selection') {
+        return previewSelection;
+      }
+      return Reflect.get(target, prop, receiver);
+    }
+  });
+  var editorProxy = new Proxy(liveView, {
+    get: function get(target, prop, receiver) {
+      if (prop === 'state') {
+        return stateProxy;
+      }
+      if (prop === 'dispatch') {
+        // Keep the transaction inside the preview. It was built against `previewDoc`, so
+        // applying it to the live state would corrupt the real document.
+        return function (tr) {
+          try {
+            stateProxy = stateProxy.apply(tr);
+          } catch (_unused2) {
+            // A preview is throwaway; a failed self-update is not worth surfacing.
+          }
+        };
+      }
+      var value = Reflect.get(target, prop, receiver);
+      return typeof value === 'function' ? value.bind(target) : value;
+    }
+  });
+  return {
+    editorProxy: editorProxy,
+    rootPos: rootPos
+  };
+}

package/dist/cjs/pm-plugins/decorations/createContributorTagWidget.js

@@ -224,13 +224,14 @@ var resolveHoistedCodeBlockAnchor = exports.resolveHoistedCodeBlockAnchor = func
  * highlights — or, with `anchorAtRangeStart`, at `from` itself. A host inside a code block is
  * hoisted in front of it instead, anchored via `resolveHoistedCodeBlockAnchor` (EDITOR-9045).
  *
- * Returns one decoration normally, two (marker + tag) when hoisted out of a code block.
+ * Returns one decoration when a caller-supplied `anchorName` is used, two (marker + tag)
+ * otherwise — hoisted out of a code block, or anchored to its own point marker.
  *
  * The tag is mounted in `toDOM` and taken down in `destroy`, so it lives exactly as long as the host
  * element ProseMirror drew it into — see `mountContributorTag`.
  */
 var createContributorTagWidget = exports.createContributorTagWidget = function createContributorTagWidget(_ref4) {
-  var _hoisted$anchorName, _hoisted$codeBlockSta;
+  var _hoisted$codeBlockSta, _ref5, _hoisted$anchorName;
   var _ref4$anchorAtRangeSt = _ref4.anchorAtRangeStart,
     anchorAtRangeStart = _ref4$anchorAtRangeSt === void 0 ? false : _ref4$anchorAtRangeSt,
     anchorName = _ref4.anchorName,
@@ -250,15 +251,33 @@ var createContributorTagWidget = exports.createContributorTagWidget = function c
   // A change inside a code block is hoisted out of it, anchored to its own marker; anything else
   // keeps its own anchor.
   var hoisted = resolveHoistedCodeBlockAnchor(doc, anchorPos, diffId);
-  var effectiveAnchorName = (_hoisted$anchorName = hoisted === null || hoisted === void 0 ? void 0 : hoisted.anchorName) !== null && _hoisted$anchorName !== void 0 ? _hoisted$anchorName : anchorName;
+  // Keep the host out of the table row's grid (EDITOR-8442).
+  var hostPos = (0, _createAnchorDecorationWidgets.clampAnchorPosIntoCell)(doc, (_hoisted$codeBlockSta = hoisted === null || hoisted === void 0 ? void 0 : hoisted.codeBlockStart) !== null && _hoisted$codeBlockSta !== void 0 ? _hoisted$codeBlockSta : anchorPos, 1);
+
+  // Inline diffs pass no anchorName. Give them their own point anchor instead of the
+  // `position: relative` fallback, which drifts left once the range wraps a line (EDITOR-9286).
+  var ownAnchorName = (0, _decorationKeys.buildAnchorDecorationKey)({
+    diffId: diffId,
+    anchorType: _decorationKeys.AnchorTypeKey.tag
+  });
+  var effectiveAnchorName = (_ref5 = (_hoisted$anchorName = hoisted === null || hoisted === void 0 ? void 0 : hoisted.anchorName) !== null && _hoisted$anchorName !== void 0 ? _hoisted$anchorName : anchorName) !== null && _ref5 !== void 0 ? _ref5 : ownAnchorName;
   var tagAnchorName = effectiveAnchorName && supportsAnchorPositioning() ? effectiveAnchorName : undefined;
   var decorations = [];
   if (hoisted) {
     decorations.push(hoisted.marker);
+  } else if (!anchorName && tagAnchorName) {
+    decorations.push(_view.Decoration.widget(hostPos, function () {
+      return (0, _createAnchorDecorationWidgets.createAnchorNameSpan)(ownAnchorName);
+    }, _objectSpread(_objectSpread({}, (0, _decorationKeys.buildAnchorDecorationSpec)({
+      diffId: diffId,
+      anchorType: _decorationKeys.AnchorTypeKey.tag,
+      side: -1
+    })), {}, {
+      marks: [],
+      ignoreSelection: true
+    })));
   }
-  decorations.push(_view.Decoration.widget(
-  // Keep the host out of the table row's grid (EDITOR-8442).
-  (0, _createAnchorDecorationWidgets.clampAnchorPosIntoCell)(doc, (_hoisted$codeBlockSta = hoisted === null || hoisted === void 0 ? void 0 : hoisted.codeBlockStart) !== null && _hoisted$codeBlockSta !== void 0 ? _hoisted$codeBlockSta : anchorPos, 1), function () {
+  decorations.push(_view.Decoration.widget(hostPos, function () {
     var host = buildContributorTagHost(diffId, tagAnchorName);
     mount = mountContributorTag({
       anchorName: tagAnchorName,

package/dist/cjs/pm-plugins/decorations/createNodeChangedDecorationWidget.js

@@ -24,6 +24,21 @@ var _tableDiffMode = require("./utils/tableDiffMode");
 var _wrapBlockNodeView = require("./utils/wrapBlockNodeView");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+/**
+ * Where a slice's `index`th child sits in `doc`: the children belong to the ancestor `openStart`
+ * levels above the change. `null` if out of range — `posAtIndex` throws past the last child.
+ */
+var getSourcePos = function getSourcePos(doc, $changeFrom, openStart, index) {
+  var depth = $changeFrom ? $changeFrom.depth - openStart : -1;
+  if (!$changeFrom || depth < 0) {
+    return null;
+  }
+  var childIndex = $changeFrom.index(depth) + index;
+  if (childIndex >= $changeFrom.node(depth).childCount) {
+    return null;
+  }
+  return (0, _safeResolve.safeResolve)(doc, $changeFrom.posAtIndex(childIndex, depth));
+};
 var isHeadingLevel = function isHeadingLevel(level) {
   return typeof level === 'number' && level >= 1 && level <= 6;
 };
@@ -291,7 +306,7 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
    * and if it's the first or last content, we go in however many the sliced Open
    * or sliced End depth is and match only the entire node.
    */
-  slice.content.forEach(function (node) {
+  slice.content.forEach(function (node, _offset, index) {
     var isFirst = firstReplacedNode === node;
     var isLast = lastReplacedNode === node;
     var isOpenAtSliceBoundary = isFirst && slice.openStart > 0 || isLast && slice.openEnd > 0;
@@ -362,7 +377,8 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
     }
 
     // Try to create node view, fallback to serialization
-    var nodeView = serializer.tryCreateNodeView(node);
+    var $sourcePos = (0, _fg.fg)('platform_editor_ai_show_diff_patch_2') ? getSourcePos(doc, $changeFromA, slice.openStart, index) : null;
+    var nodeView = serializer.tryCreateNodeView(node, 0, $sourcePos !== null && $sourcePos !== void 0 ? $sourcePos : undefined);
     if (nodeView) {
       if (node.isInline) {
         var wrapper = (0, _wrapBlockNodeView.createContentWrapper)(colorScheme, isActive, isInserted, reveal);
@@ -465,18 +481,27 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
     });
   }
 
-  // Needed even when the indicator bar is off, because a contributor tag also anchors against the
-  // widget.
+  // Needed even with the indicator bar off, since it anchors its top/bottom to the widget.
   if (showIndicators || showContributorTags) {
     dom.style.setProperty('anchor-name', "--".concat((0, _decorationKeys.buildAnchorDecorationKey)({
       diffId: diffId
     })));
-    // The tag built below only anchors via `anchor()` if `contributorTagAnchorName` is set; without
-    // it the tag falls back to a non-anchored position (EDITOR-9045).
-    if ((0, _fg.fg)('confluence_ncs_step_diffing_version_history')) {
-      contributorTagAnchorName !== null && contributorTagAnchorName !== void 0 ? contributorTagAnchorName : contributorTagAnchorName = (0, _decorationKeys.buildAnchorDecorationKey)({
-        diffId: diffId
+    // `dom` is inline, so its box fragments across a line wrap and `anchor()` resolves to the
+    // wrong edge. The tag anchors to its own point marker instead (EDITOR-9286).
+    if ((0, _fg.fg)('confluence_ncs_step_diffing_version_history') && !contributorTagAnchorName) {
+      var tagPointAnchorName = (0, _decorationKeys.buildAnchorDecorationKey)({
+        diffId: diffId,
+        anchorType: _decorationKeys.AnchorTypeKey.tag
       });
+      contributorTagAnchorName = tagPointAnchorName;
+      decorations.push(_view.Decoration.widget(safeInsertPos, function () {
+        return (0, _createAnchorDecorationWidgets.createAnchorNameSpan)(tagPointAnchorName);
+      }, {
+        key: "contributor-tag-anchor-".concat(diffId),
+        side: -1,
+        marks: [],
+        ignoreSelection: true
+      }));
     }
   }
 
@@ -511,8 +536,7 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
         }
       })));
     } else {
-      // Hosted at the start of the deleted run rather than on `dom` itself: `dom` is inline, so once
-      // the deleted content wraps its box is the union of its line fragments.
+      // Anchored to the point marker pushed above, not to `dom` (EDITOR-9286).
       var tagHost = (0, _createContributorTagWidget.createContributorTagHost)({
         anchorName: contributorTagAnchorName,
         diffId: diffId,

package/dist/cjs/pm-plugins/decorations/utils/wrapBlockNodeView.js

@@ -321,6 +321,21 @@ var applyTextLikeBlockNodeStyles = function applyTextLikeBlockNodeStyles(_ref8)
 /**
  * Creates a content wrapper with deleted styles for a block node
  */
+/**
+ * The element that spans breakout width, for nodes carrying a `breakout` mark. The wrapper divs
+ * stay at editor-column width, so anything that should align to the node's visible edges —
+ * outlines, absolutely positioned lozenges — has to attach here instead.
+ */
+var findBreakoutElement = function findBreakoutElement(targetNode, nodeView) {
+  var _targetNode$marks;
+  var hasBreakoutMark = (_targetNode$marks = targetNode.marks) === null || _targetNode$marks === void 0 ? void 0 : _targetNode$marks.some(function (mark) {
+    return mark.type.name === 'breakout';
+  });
+  if (!hasBreakoutMark || !(nodeView instanceof HTMLElement)) {
+    return null;
+  }
+  return nodeView.matches('[data-node-type]') ? nodeView : nodeView.querySelector('[data-node-type]');
+};
 var createBlockNodeContentWrapper = function createBlockNodeContentWrapper(_ref9) {
   var nodeView = _ref9.nodeView,
     targetNode = _ref9.targetNode,
@@ -338,7 +353,16 @@ var createBlockNodeContentWrapper = function createBlockNodeContentWrapper(_ref9
   // should not also get the inline content style (borderBottom underline) on their container.
   var shouldSkipContentStyle = isInserted && nodeStyle !== undefined;
   var contentStyle = shouldSkipContentStyle ? '' : (0, _wrapBlockNodeViewStyles.getChangedContentStyle)(colorScheme, isActive, isInserted, hideAddedDiffsUnderline);
-  contentWrapper.setAttribute('style', "".concat(contentStyle).concat(nodeStyle || ''));
+
+  // A `breakout` node renders wider than the editor column while the wrapper divs
+  // stay at column width, so paint the outline on the node element that spans that width.
+  var breakoutTarget = nodeStyle ? findBreakoutElement(targetNode, nodeView) : null;
+  if ((0, _fg.fg)('platform_editor_ai_show_diff_patch_2') && breakoutTarget) {
+    appendStyleToElement(breakoutTarget, nodeStyle !== null && nodeStyle !== void 0 ? nodeStyle : '');
+    contentWrapper.setAttribute('style', contentStyle || '');
+  } else {
+    contentWrapper.setAttribute('style', "".concat(contentStyle).concat(nodeStyle || ''));
+  }
   contentWrapper.append(nodeView);
   return contentWrapper;
 };
@@ -468,7 +492,19 @@ var wrapBlockNode = function wrapBlockNode(_ref10) {
     })) {
       return;
     }
-    blockWrapper.append(lozenge);
+
+    // `lozenge` is absolutely positioned, so it lands on the nearest positioned ancestor. For a
+    // breakout node that is the column-width wrapper, leaving the pill short of the node's
+    // right edge — host it on the breakout element, which must establish a containing block.
+    var breakoutHost = (0, _fg.fg)('platform_editor_ai_show_diff_patch_2') ? findBreakoutElement(targetNode, nodeView) : null;
+    if (breakoutHost) {
+      appendStyleToElement(breakoutHost, (0, _lazyNodeView.convertToInlineCss)({
+        position: 'relative'
+      }));
+      breakoutHost.append(lozenge);
+    } else {
+      blockWrapper.append(lozenge);
+    }
   }
   var contentWrapper = createBlockNodeContentWrapper({
     nodeView: nodeView,

package/dist/cjs/pm-plugins/markViews.js

@@ -0,0 +1,65 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.wrapInMarkViews = void 0;
+var _model = require("@atlaskit/editor-prosemirror/model");
+var _fg = require("@atlaskit/platform-feature-flags/fg");
+/**
+ * `@atlaskit/editor-prosemirror/view` doesn't re-export prosemirror-view's `MarkViewConstructor`,
+ * so it's typed locally, as `EditorSSRRenderer` does.
+ */
+
+/** Where to look up a mark's renderer, and the view to render it against. */
+
+/**
+ * Renders a mark as ProseMirror does: `view.nodeViews` also holds mark views, keyed by mark name,
+ * so `breakout` resolves whether it's registered under `markViews` or `nodeViews`. Falls back to
+ * `toDOM` — they can differ: `breakout` renders `.fabric-editor-breakout-mark-dom`, which the width
+ * CSS targets.
+ */
+var renderMarkView = function renderMarkView(mark, inline, _ref) {
+  var nodeViews = _ref.nodeViews,
+    view = _ref.view;
+  try {
+    var markView = nodeViews === null || nodeViews === void 0 ? void 0 : nodeViews[mark.type.name];
+    if (markView && view) {
+      var rendered = markView(mark, view, inline);
+      return {
+        dom: rendered.dom,
+        contentDOM: rendered.contentDOM
+      };
+    }
+    var toDOM = mark.type.spec.toDOM;
+    if (!toDOM) {
+      return null;
+    }
+    return _model.DOMSerializer.renderSpec(document, toDOM(mark, inline));
+  } catch (_unused) {
+    return null;
+  }
+};
+
+/**
+ * Wraps rendered DOM in its marks, as ProseMirror does for the live document. Without this a
+ * block node loses `breakout`, whose wrapper supplies the width. Marks nest
+ * outside-in, so `marks[0]` is outermost.
+ */
+var wrapInMarkViews = exports.wrapInMarkViews = function wrapInMarkViews(targetNode, nodeDom, sources) {
+  if (targetNode.marks.length === 0 || !(0, _fg.fg)('platform_editor_ai_show_diff_patch_2')) {
+    return nodeDom;
+  }
+  var wrapped = nodeDom;
+  for (var index = targetNode.marks.length - 1; index >= 0; index--) {
+    var _mark = targetNode.marks[index];
+    var rendered = renderMarkView(_mark, targetNode.isInline, sources);
+    // No content hole means nowhere to nest the node, so skip the mark, not the node.
+    if (!(rendered !== null && rendered !== void 0 && rendered.contentDOM)) {
+      continue;
+    }
+    rendered.contentDOM.appendChild(wrapped);
+    wrapped = rendered.dom;
+  }
+  return wrapped;
+};

package/dist/cjs/pm-plugins/resolveDiffContributors.js

@@ -30,10 +30,10 @@ var SHOW_DIFF_AGENT_BRANDS = {
 
 /**
  * Brands that prefer the account's real avatar over their fixed glyph when the invoking profile
- * has one. Claude/ChatGPT/Rovo intentionally keep their fixed glyph always (see `AGENT_KIND_ICONS`
- * in `contributorAvatarRenderer.ts`).
+ * has one. Claude/ChatGPT intentionally keep their fixed glyph always (see `AGENT_KIND_ICONS` in
+ * `contributorAvatarRenderer.ts`).
  */
-var AVATAR_ELIGIBLE_BRANDS = new Set(['figma', 'lovable', 'replit']);
+var AVATAR_ELIGIBLE_BRANDS = new Set(['figma', 'lovable', 'replit', 'rovo']);
 
 /** Known external agent types emitted by Confluence's agent identification service that carry
  * no `@atlaskit/agent-color` brand — a generic labelled fallback. */

package/dist/cjs/ui/ContributorTag/contributorAvatarRenderer.js

@@ -10,25 +10,24 @@ var _default = require("@atlaskit/avatar/constants/default");
 var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
 var _contributorTagIcons = require("./contributorTagIcons");
 /**
- * Agent kinds with a custom contributor-tag icon. Figma/Lovable/Replit have no entry here — they
- * always render the real avatar `resolveDiffContributors` supplies, falling back to the generic
- * `aiAgent` glyph (see `showContributorIcon`) on load failure. The declared type stays the wider
+ * Agent kinds with a custom contributor-tag icon, used as a fallback glyph when no `avatarUrl` is
+ * available or its image fails to load (see `showContributorIcon`). Rovo/Figma/Lovable/Replit have
+ * no entry here — they fall back to the generic `aiAgent` glyph. The declared type stays the wider
  * `TagContributor['agentKind']` so indexing below (with `'identified' | 'external'` in play too)
  * stays safely partial.
  */
 var AGENT_KIND_ICONS = {
   claude: 'claude',
-  chatgpt: 'chatgpt',
-  rovo: 'rovoHex'
+  chatgpt: 'chatgpt'
 };
 
 /**
  * Brands that always render their fixed glyph, even when the contributor also carries an
- * `avatarUrl`. Figma/Lovable/Replit are excluded here and use the real avatar when
+ * `avatarUrl`. Rovo/Figma/Lovable/Replit are excluded here and use the real avatar when
  * `resolveDiffContributors` supplies one, falling back to the generic `aiAgent` glyph on load
  * failure.
  */
-var FIXED_GLYPH_AGENT_KINDS = new Set(['claude', 'chatgpt', 'rovo']);
+var FIXED_GLYPH_AGENT_KINDS = new Set(['claude', 'chatgpt']);
 
 /** The size `@atlaskit/avatar`'s `xxsmall` rendered at. */
 var AVATAR_SIZE = _avatarSizes.AVATAR_SIZES.xxsmall;
@@ -125,8 +124,8 @@ var contributorAvatarRenderer = exports.contributorAvatarRenderer = function con
   };
   if (contributor.avatarUrl) {
     var _contributor$agentKin2;
-    // Claude/ChatGPT/Rovo always use their fixed glyph, even when the profile also has an
-    // avatar URL. Other agents (e.g. Figma/Lovable/Replit) and users prefer the real avatar.
+    // Claude/ChatGPT always use their fixed glyph, even when the profile also has an avatar
+    // URL. Other agents (e.g. Rovo/Figma/Lovable/Replit) and users prefer the real avatar.
     var usesFixedGlyph = isAgent && FIXED_GLYPH_AGENT_KINDS.has((_contributor$agentKin2 = contributor.agentKind) !== null && _contributor$agentKin2 !== void 0 ? _contributor$agentKin2 : 'external');
     if (usesFixedGlyph) {
       showContributorIcon();

package/dist/cjs/ui/ContributorTag/contributorTagIcons.js

@@ -10,9 +10,6 @@ exports.getContributorTagIcon = void 0;
  * Neither `@atlaskit/icon`, `@atlaskit/icon-lab` nor `@atlaskit/logo` exposes a raw-SVG entry
  * point, so the markup is copied here rather than kept as a React island for these glyphs. Keep in
  * sync with the sources named on each constant.
- *
- * The Rovo hex is the `brand` appearance, whose `--rovo-*-color` variables resolve to `initial` in
- * both themes — the fallbacks below are the rendered colours, so no theme observer is needed.
  */
 
 /** `@atlaskit/icon/core/person`, at the 16px the avatar renders it. */
@@ -28,9 +25,6 @@ var AI_BOT_ICON_SVG = "<svg width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0
  */
 var AI_AGENT_ICON_SVG = "<svg width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 16 16\" role=\"presentation\" style=\"display:block\"><path fill=\"currentcolor\" fill-rule=\"evenodd\" d=\"M6.971.493a2 2 0 0 1 2.058 0l5 3A2 2 0 0 1 15 5.208v5.584a2 2 0 0 1-.971 1.715l-5 3a2 2 0 0 1-2.058 0l-5-3A2 2 0 0 1 1 10.792V5.208a2 2 0 0 1 .971-1.715zm1.286 1.286a.5.5 0 0 0-.514 0l-5 3a.5.5 0 0 0-.243.429v5.584a.5.5 0 0 0 .243.429l1.098.66a4.25 4.25 0 1 1 8.318 0l1.098-.66a.5.5 0 0 0 .243-.429V5.208a.5.5 0 0 0-.243-.429zM8 8.25a2.75 2.75 0 1 0 0 5.5 2.75 2.75 0 0 0 0-5.5\" clip-rule=\"evenodd\"/></svg>";
 
-/** `RovoHexIcon` from `@atlaskit/logo/rovo-hex/icon`, at the 16px `xxsmall` renders. */
-var ROVO_HEX_ICON_SVG = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" role=\"presentation\" style=\"display:block\"><path fill=\"#1868db\" fill-rule=\"evenodd\" d=\"m13.227 16.789-7.154 4.169-3.403-1.96a2.72 2.72 0 0 1-1.362-2.355V7.366c0-.973.518-1.87 1.361-2.354l6.044-3.487-.038.114a3.6 3.6 0 0 0-.172 1.088v9.278c0 1.274.68 2.45 1.786 3.085z\" clip-rule=\"evenodd\"/><path fill=\"#6a9a23\" fill-rule=\"evenodd\" d=\"m11.296 15.671-7.193 4.153 6.607 3.812a2.73 2.73 0 0 0 2.676.026l.048-.033a2.73 2.73 0 0 0 1.232-1.525 2.7 2.7 0 0 0 .127-.822v-3.594z\" clip-rule=\"evenodd\"/><path fill=\"#af59e1\" fill-rule=\"evenodd\" d=\"m21.477 5.003-4.404-2.539-5.904 4.89 2.69 1.556a3.56 3.56 0 0 1 1.785 3.086v9.277a3.6 3.6 0 0 1-.21 1.202l6.044-3.486a2.71 2.71 0 0 0 1.362-2.355V7.357c0-.97-.521-1.87-1.363-2.354\" clip-rule=\"evenodd\"/><path fill=\"#fca700\" fill-rule=\"evenodd\" d=\"M12.74 8.266 9.353 6.312V2.718c0-.283.044-.56.127-.821A2.73 2.73 0 0 1 10.71.372V.37a.4.4 0 0 0 .048-.033 2.73 2.73 0 0 1 2.676.026l6.499 3.75z\" clip-rule=\"evenodd\"/></svg>";
-
 /** Claude hexagon lockup from the brand asset: the hexagon and knot glyph both baked in. */
 var CLAUDE_ICON_SVG = "<svg width=\"16\" height=\"18\" viewBox=\"0 0 16 18\" fill=\"none\" role=\"presentation\" style=\"display:block\"><path fill=\"#D97757\" d=\"M14.5007 3.28903L9.50384 0.402344C8.5736 -0.13506 7.42701 -0.134016 6.49774 0.405082L1.49458 3.30759C0.569434 3.8443 0 4.83297 0 5.90253V11.1804C0 12.2519 0.571497 13.2421 1.49931 13.7781L6.49931 16.6666C7.42787 17.203 8.57213 17.203 9.50069 16.6666L14.5007 13.7781C15.4285 13.2421 16 12.2519 16 11.1804V5.88671C16 4.8152 15.4285 3.82504 14.5007 3.28903Z\"/><path fill=\"#FAF9F6\" d=\"M5.19791 10.055L7.0123 9.03681L7.04267 8.94806L7.0123 8.89907H6.92357L6.62 8.88034L5.58321 8.85232L4.68418 8.815L3.81317 8.76826L3.59367 8.72158L3.38818 8.4507L3.4092 8.31526L3.59367 8.1915L3.85754 8.21485L4.44133 8.25455L5.317 8.31526L5.95216 8.35262L6.89321 8.4507H7.04267L7.06368 8.38999L7.0123 8.35262L6.97261 8.31526L6.06658 7.70112L5.08582 7.05196L4.5721 6.67834L4.29422 6.48919L4.15411 6.31172L4.09339 5.92409L4.34559 5.64621L4.68418 5.66956L4.77058 5.69291L5.11384 5.95678L5.84708 6.52422L6.80448 7.22943L6.94459 7.34618L7.00063 7.30649L7.00763 7.27846L6.94459 7.17338L6.42385 6.23233L5.86809 5.27492L5.62057 4.87795L5.55519 4.63977C5.53183 4.54169 5.51549 4.45996 5.51549 4.35956L5.80271 3.96959L5.9615 3.91821L6.34446 3.96959L6.50558 4.10969L6.74377 4.65378L7.12907 5.51077L7.72686 6.676L7.90199 7.0216L7.99539 7.34152L8.0304 7.43959H8.09113V7.38354L8.14018 6.72737L8.23124 5.92175L8.31999 4.88496L8.35032 4.59307L8.49511 4.24279L8.78232 4.05365L9.00649 4.16107L9.19098 4.42494L9.16533 4.5954L9.05555 5.30762L8.84073 6.42381L8.70062 7.17105H8.78232L8.87574 7.07764L9.25401 6.57559L9.88922 5.78165L10.1694 5.4664L10.4963 5.11847L10.7065 4.95267H11.1035L11.3953 5.38701L11.2646 5.83535L10.8559 6.35375L10.5173 6.79276L10.0316 7.4466L9.72807 7.96966L9.7561 8.0117L9.82849 8.00469L10.926 7.77118L11.5191 7.66376L12.2266 7.54233L12.5466 7.69178L12.5816 7.84356L12.4555 8.15414L11.6989 8.34095L10.8116 8.51842L9.48985 8.83136L9.4735 8.84303L9.49223 8.86637L10.0877 8.92241L10.3422 8.93639H10.9657L12.1262 9.02283L12.4298 9.2236L12.612 9.46881L12.5816 9.6556L12.1146 9.89382L11.4841 9.74434L10.013 9.3941L9.50858 9.26797H9.43849V9.31004L9.85882 9.721L10.6294 10.4169L11.5938 11.3136L11.6429 11.5354L11.5191 11.7106L11.3884 11.6918L10.5407 11.0544L10.2137 10.7672L9.4735 10.1436H9.42451V10.209L9.59495 10.4589L10.4963 11.8133L10.543 12.2289L10.4776 12.3644L10.2441 12.4461L9.98726 12.3994L9.45952 11.6592L8.91544 10.8255L8.47645 10.0783L8.42271 10.1086L8.16352 12.8991L8.04207 13.0416L7.76188 13.149L7.52837 12.9715L7.40461 12.6843L7.52837 12.1168L7.67781 11.3766L7.79925 10.7881L7.90899 10.0573L7.97438 9.81443L7.96971 9.79808L7.916 9.80507L7.36491 10.5617L6.5266 11.6942L5.86342 12.4041L5.70463 12.4671L5.42909 12.3247L5.45477 12.0702L5.60889 11.8436L6.5266 10.6761L7.08002 9.95217L7.4373 9.53421L7.43497 9.47349H7.41395L4.97607 11.0567L4.54174 11.1127L4.35493 10.9376L4.37828 10.6504L4.46702 10.557L5.20024 10.0526L5.19791 10.055Z\"/></svg>";
 
@@ -41,8 +35,7 @@ var markup = {
   aiBot: AI_BOT_ICON_SVG,
   chatgpt: CHATGPT_ICON_SVG,
   claude: CLAUDE_ICON_SVG,
-  person: PERSON_ICON_SVG,
-  rovoHex: ROVO_HEX_ICON_SVG
+  person: PERSON_ICON_SVG
 };
 
 /**