@atlaskit/editor-plugin-show-diff 12.0.3 → 12.1.0

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # @atlaskit/editor-plugin-show-diff
 
+## 12.1.0
+
+### Minor Changes
+
+- [`0a96aa66ed44f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0a96aa66ed44f) -
+  [ux] CCI-18372 Post Stream Review now renders deleted content below the added content at every
+  change level (gated behind `platform_editor_ai_smart_diff`), so reviewers read the new text first.
+
+  Deleted-content placement is split by change granularity, so consumers that want deleted content
+  after the new content everywhere must set both options (each defaults to rendering deleted content
+  first, and both require `diffType: 'smart'`):
+
+  ```ts
+  api?.showDiff?.commands?.showDiff({
+  	originalDoc,
+  	diffType: 'smart',
+  	deletedDiffPlacement: 'bottom', // node/paragraph-level changes
+  	inlineDeletedDiffPlacement: 'after', // inline/sentence-level changes
+  });
+  ```
+
+  `@atlaskit/editor-plugin-show-diff` also adds a `getDeletedWidgets` action (returning the
+  `DeletedDiffWidget` elements and positions), used by Post Stream Review to position the review
+  modal below relocated deleted content.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 12.0.3
 
 ### Patch Changes

package/dist/cjs/pm-plugins/calculateDiff/calculateDiffDecorations.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.calculateDiffDecorations = void 0;
+exports.isDeletedContentPlacedBelow = exports.calculateDiffDecorations = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
@@ -131,29 +131,52 @@ var calculateNodesForBlockDecoration = function calculateNodesForBlockDecoration
   });
   return decorations;
 };
-var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3) {
-  var state = _ref3.state,
-    pluginState = _ref3.pluginState,
-    nodeViewSerializer = _ref3.nodeViewSerializer,
-    colorScheme = _ref3.colorScheme,
-    intl = _ref3.intl,
-    activeIndexPos = _ref3.activeIndexPos,
-    api = _ref3.api,
-    _ref3$isInverted = _ref3.isInverted,
-    isInverted = _ref3$isInverted === void 0 ? false : _ref3$isInverted,
-    _ref3$diffType = _ref3.diffType,
-    diffType = _ref3$diffType === void 0 ? 'inline' : _ref3$diffType,
-    _ref3$hideDeletedDiff = _ref3.hideDeletedDiffs,
-    hideDeletedDiffs = _ref3$hideDeletedDiff === void 0 ? false : _ref3$hideDeletedDiff,
-    _ref3$hideAddedDiffsU = _ref3.hideAddedDiffsUnderline,
-    hideAddedDiffsUnderlineParam = _ref3$hideAddedDiffsU === void 0 ? false : _ref3$hideAddedDiffsU,
-    _ref3$showIndicators = _ref3.showIndicators,
-    showIndicators = _ref3$showIndicators === void 0 ? false : _ref3$showIndicators,
-    smartThresholds = _ref3.smartThresholds,
-    _ref3$deletedDiffPlac = _ref3.deletedDiffPlacement,
-    deletedDiffPlacement = _ref3$deletedDiffPlac === void 0 ? 'top' : _ref3$deletedDiffPlac,
-    _ref3$inlineDeletedDi = _ref3.inlineDeletedDiffPlacement,
-    inlineDeletedDiffPlacement = _ref3$inlineDeletedDi === void 0 ? 'before' : _ref3$inlineDeletedDi;
+/**
+ * Whether deleted content for `change` renders after the new content instead of before it.
+ *
+ * show-diff splits this across two options by change granularity, so the level decides which one
+ * applies:
+ * - node/paragraph-level: `deletedDiffPlacement` (default `'top'`). Pure deletions are promoted to
+ *   node level, so they are governed here too.
+ * - inline/sentence-level: `inlineDeletedDiffPlacement` (default `'before'`).
+ *
+ * Callers are responsible for the `smart` diffType and gate checks.
+ */
+var isDeletedContentPlacedBelow = exports.isDeletedContentPlacedBelow = function isDeletedContentPlacedBelow(_ref3) {
+  var change = _ref3.change,
+    deletedDiffPlacement = _ref3.deletedDiffPlacement,
+    inlineDeletedDiffPlacement = _ref3.inlineDeletedDiffPlacement;
+  var level = (0, _helpers.smartChangeLevel)(change);
+  if (level === 'node' || level === 'paragraph') {
+    return deletedDiffPlacement === 'bottom';
+  }
+
+  // Inline-level (undefined) and sentence-level changes.
+  return inlineDeletedDiffPlacement === 'after';
+};
+var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref4) {
+  var state = _ref4.state,
+    pluginState = _ref4.pluginState,
+    nodeViewSerializer = _ref4.nodeViewSerializer,
+    colorScheme = _ref4.colorScheme,
+    intl = _ref4.intl,
+    activeIndexPos = _ref4.activeIndexPos,
+    api = _ref4.api,
+    _ref4$isInverted = _ref4.isInverted,
+    isInverted = _ref4$isInverted === void 0 ? false : _ref4$isInverted,
+    _ref4$diffType = _ref4.diffType,
+    diffType = _ref4$diffType === void 0 ? 'inline' : _ref4$diffType,
+    _ref4$hideDeletedDiff = _ref4.hideDeletedDiffs,
+    hideDeletedDiffs = _ref4$hideDeletedDiff === void 0 ? false : _ref4$hideDeletedDiff,
+    _ref4$hideAddedDiffsU = _ref4.hideAddedDiffsUnderline,
+    hideAddedDiffsUnderlineParam = _ref4$hideAddedDiffsU === void 0 ? false : _ref4$hideAddedDiffsU,
+    _ref4$showIndicators = _ref4.showIndicators,
+    showIndicators = _ref4$showIndicators === void 0 ? false : _ref4$showIndicators,
+    smartThresholds = _ref4.smartThresholds,
+    _ref4$deletedDiffPlac = _ref4.deletedDiffPlacement,
+    deletedDiffPlacement = _ref4$deletedDiffPlac === void 0 ? 'top' : _ref4$deletedDiffPlac,
+    _ref4$inlineDeletedDi = _ref4.inlineDeletedDiffPlacement,
+    inlineDeletedDiffPlacement = _ref4$inlineDeletedDi === void 0 ? 'before' : _ref4$inlineDeletedDi;
   var originalDoc = pluginState.originalDoc,
     steps = pluginState.steps,
     isDisplayingChanges = pluginState.isDisplayingChanges;
@@ -238,6 +261,15 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
   var isInserted = !isInverted;
   var createDecorationsForChange = function createDecorationsForChange(change, showGranularWithBlock) {
     var isActive = activeIndexPos && change.fromB === activeIndexPos.from && change.toB === activeIndexPos.to;
+
+    // Hoisted because it decides BOTH where the deleted widget is anchored and — since the
+    // widget pins whichever end of the range it sits at — how the indicator anchors below are
+    // allowed to move.
+    var isDeletedWidgetBelow = diffType === 'smart' && (0, _platformFeatureFlags.fg)('platform_editor_ai_smart_diff') && isDeletedContentPlacedBelow({
+      change: change,
+      deletedDiffPlacement: deletedDiffPlacement,
+      inlineDeletedDiffPlacement: inlineDeletedDiffPlacement
+    });
     if (change.inserted.length > 0) {
       // shouldHideDeleted for block/node decorations: suppressed when isInverted + hideDeletedDiffs,
       // or when showGranularWithBlock (block reference widget is shown instead).
@@ -282,7 +314,8 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
               shouldHideDeleted: shouldHideDeleted,
               showIndicators: showIndicators,
               hideAddedDiffsUnderline: hideAddedDiffsUnderline,
-              hasDeletedWidget: willRenderDeletedWidget
+              hasDeletedWidget: willRenderDeletedWidget,
+              isDeletedWidgetBelow: isDeletedWidgetBelow
             }))));
           }
         } catch (err) {
@@ -302,7 +335,8 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
           shouldHideDeleted: shouldHideDeleted,
           showIndicators: showIndicators,
           hideAddedDiffsUnderline: hideAddedDiffsUnderline,
-          hasDeletedWidget: willRenderDeletedWidget
+          hasDeletedWidget: willRenderDeletedWidget,
+          isDeletedWidgetBelow: isDeletedWidgetBelow
         }))));
       }
       decorations.push.apply(decorations, (0, _toConsumableArray2.default)(calculateNodesForBlockDecoration(_objectSpread(_objectSpread({
@@ -335,19 +369,7 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
           isInserted: !isInserted,
           diffType: diffType,
           hideAddedDiffsUnderline: hideAddedDiffsUnderline,
-          // For `smart` changes, optionally render the deleted content after the new
-          // content (gray + strikethrough) instead of before it. Two independent
-          // controls, split by change level:
-          // - node/paragraph-level: `deletedDiffPlacement` (default `'top'`).
-          // - inline/sentence-level: `inlineDeletedDiffPlacement` (default `'before'`).
-          placeBelow: diffType === 'smart' && (0, _platformFeatureFlags.fg)('platform_editor_ai_smart_diff') && function () {
-            var level = (0, _helpers.smartChangeLevel)(change);
-            if (level === 'node' || level === 'paragraph') {
-              return deletedDiffPlacement === 'bottom';
-            }
-            // Inline-level (undefined) and sentence-level changes.
-            return inlineDeletedDiffPlacement === 'after';
-          }()
+          placeBelow: isDeletedWidgetBelow
         }), {}, {
           showIndicators: showIndicators
         }))));
@@ -361,9 +383,9 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
     // getChanges returns a flat Change[] with no per-step grouping, making this count impossible
     // to derive after the fact without re-introducing per-change metadata.
     var stepChanges = (0, _diffBySteps.getStepChanges)(originalDoc, steps);
-    stepChanges.forEach(function (_ref4) {
-      var isGranular = _ref4.isGranular,
-        stepChangeList = _ref4.changes;
+    stepChanges.forEach(function (_ref5) {
+      var isGranular = _ref5.isGranular,
+        stepChangeList = _ref5.changes;
       var granularCount = isGranular ? stepChangeList.length : 0;
 
       // Calculate the average ratio of changed content on both A (original) and B (new)
@@ -503,42 +525,42 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
 };
 var calculateDiffDecorations = exports.calculateDiffDecorations = (0, _memoizeOne.default)(calculateDiffDecorationsInner,
 // Cache results unless relevant inputs change
-function (_ref5, _ref6) {
-  var _ref0;
-  var _ref7 = (0, _slicedToArray2.default)(_ref5, 1),
-    _ref7$ = _ref7[0],
-    pluginState = _ref7$.pluginState,
-    state = _ref7$.state,
-    colorScheme = _ref7$.colorScheme,
-    intl = _ref7$.intl,
-    activeIndexPos = _ref7$.activeIndexPos,
-    isInverted = _ref7$.isInverted,
-    diffType = _ref7$.diffType,
-    hideDeletedDiffs = _ref7$.hideDeletedDiffs,
-    hideAddedDiffsUnderline = _ref7$.hideAddedDiffsUnderline,
-    showIndicators = _ref7$.showIndicators,
-    smartThresholds = _ref7$.smartThresholds,
-    deletedDiffPlacement = _ref7$.deletedDiffPlacement,
-    inlineDeletedDiffPlacement = _ref7$.inlineDeletedDiffPlacement;
+function (_ref6, _ref7) {
+  var _ref1;
   var _ref8 = (0, _slicedToArray2.default)(_ref6, 1),
     _ref8$ = _ref8[0],
-    lastPluginState = _ref8$.pluginState,
-    lastState = _ref8$.state,
-    lastColorScheme = _ref8$.colorScheme,
-    lastIntl = _ref8$.intl,
-    lastActiveIndexPos = _ref8$.activeIndexPos,
-    lastIsInverted = _ref8$.isInverted,
-    lastDiffType = _ref8$.diffType,
-    lastHideDeletedDiffs = _ref8$.hideDeletedDiffs,
-    lastHideAddedDiffsUnderline = _ref8$.hideAddedDiffsUnderline,
-    lastShowIndicators = _ref8$.showIndicators,
-    lastSmartThresholds = _ref8$.smartThresholds,
-    lastDeletedDiffPlacement = _ref8$.deletedDiffPlacement,
-    lastInlineDeletedDiffPlacement = _ref8$.inlineDeletedDiffPlacement;
+    pluginState = _ref8$.pluginState,
+    state = _ref8$.state,
+    colorScheme = _ref8$.colorScheme,
+    intl = _ref8$.intl,
+    activeIndexPos = _ref8$.activeIndexPos,
+    isInverted = _ref8$.isInverted,
+    diffType = _ref8$.diffType,
+    hideDeletedDiffs = _ref8$.hideDeletedDiffs,
+    hideAddedDiffsUnderline = _ref8$.hideAddedDiffsUnderline,
+    showIndicators = _ref8$.showIndicators,
+    smartThresholds = _ref8$.smartThresholds,
+    deletedDiffPlacement = _ref8$.deletedDiffPlacement,
+    inlineDeletedDiffPlacement = _ref8$.inlineDeletedDiffPlacement;
+  var _ref9 = (0, _slicedToArray2.default)(_ref7, 1),
+    _ref9$ = _ref9[0],
+    lastPluginState = _ref9$.pluginState,
+    lastState = _ref9$.state,
+    lastColorScheme = _ref9$.colorScheme,
+    lastIntl = _ref9$.intl,
+    lastActiveIndexPos = _ref9$.activeIndexPos,
+    lastIsInverted = _ref9$.isInverted,
+    lastDiffType = _ref9$.diffType,
+    lastHideDeletedDiffs = _ref9$.hideDeletedDiffs,
+    lastHideAddedDiffsUnderline = _ref9$.hideAddedDiffsUnderline,
+    lastShowIndicators = _ref9$.showIndicators,
+    lastSmartThresholds = _ref9$.smartThresholds,
+    lastDeletedDiffPlacement = _ref9$.deletedDiffPlacement,
+    lastInlineDeletedDiffPlacement = _ref9$.inlineDeletedDiffPlacement;
   var originalDocIsSame = lastPluginState.originalDoc && pluginState.originalDoc && pluginState.originalDoc.eq(lastPluginState.originalDoc);
   if ((0, _isExtendedEnabled.isExtendedEnabled)(diffType)) {
-    var _ref9;
-    return (_ref9 = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && (0, _isEqual.default)(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && (0, _isEqual.default)(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && hideAddedDiffsUnderline === lastHideAddedDiffsUnderline && showIndicators === lastShowIndicators && (0, _isEqual.default)(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement && inlineDeletedDiffPlacement === lastInlineDeletedDiffPlacement) !== null && _ref9 !== void 0 ? _ref9 : false;
+    var _ref0;
+    return (_ref0 = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && (0, _isEqual.default)(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && (0, _isEqual.default)(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && hideAddedDiffsUnderline === lastHideAddedDiffsUnderline && showIndicators === lastShowIndicators && (0, _isEqual.default)(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement && inlineDeletedDiffPlacement === lastInlineDeletedDiffPlacement) !== null && _ref0 !== void 0 ? _ref0 : false;
   }
-  return (_ref0 = originalDocIsSame && (0, _isEqual.default)(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && colorScheme === lastColorScheme && intl.locale === lastIntl.locale && (0, _isEqual.default)(activeIndexPos, lastActiveIndexPos) && hideDeletedDiffs === lastHideDeletedDiffs) !== null && _ref0 !== void 0 ? _ref0 : false;
+  return (_ref1 = originalDocIsSame && (0, _isEqual.default)(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && colorScheme === lastColorScheme && intl.locale === lastIntl.locale && (0, _isEqual.default)(activeIndexPos, lastActiveIndexPos) && hideDeletedDiffs === lastHideDeletedDiffs) !== null && _ref1 !== void 0 ? _ref1 : false;
 });

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

@@ -55,7 +55,9 @@ var createInlineChangedDecoration = exports.createInlineChangedDecoration = func
     hideAddedDiffsUnderline = _ref$hideAddedDiffsUn === void 0 ? false : _ref$hideAddedDiffsUn,
     inlineNodeName = _ref.inlineNodeName,
     _ref$hasDeletedWidget = _ref.hasDeletedWidget,
-    hasDeletedWidget = _ref$hasDeletedWidget === void 0 ? false : _ref$hasDeletedWidget;
+    hasDeletedWidget = _ref$hasDeletedWidget === void 0 ? false : _ref$hasDeletedWidget,
+    _ref$isDeletedWidgetB = _ref.isDeletedWidgetBelow,
+    isDeletedWidgetBelow = _ref$isDeletedWidgetB === void 0 ? false : _ref$isDeletedWidgetB;
   var diffId = crypto.randomUUID();
   if (shouldHideDeleted) {
     return [_view.Decoration.inline(change.fromB, change.toB, {
@@ -111,14 +113,23 @@ var createInlineChangedDecoration = exports.createInlineChangedDecoration = func
     // bar doesn't extend into the preceding block's margin.
     // Skip when the deleted-content widget is rendered — the anchor must
     // stay at the boundary to keep the indicator continuous.
+    //
+    // The widget only pins the end of the range it is anchored to. It sits at `change.fromB`
+    // by default, but `deletedDiffPlacement: 'bottom'` / `inlineDeletedDiffPlacement: 'after'`
+    // move it to `change.toB` so the deleted content reads after the added content. In that
+    // case the `from` anchor has no widget beside it any more and must be adjusted inward
+    // again, otherwise the over-long indicator bar that CCI-18224 fixed comes back.
     var anchorFrom = change.fromB;
     var anchorTo = change.toB;
-    if (!hasDeletedWidget) {
-      var _$from$nodeAfter, _$to$nodeBefore;
+    if (!hasDeletedWidget || isDeletedWidgetBelow) {
+      var _$from$nodeAfter;
       var $from = doc.resolve(anchorFrom);
       if (!$from.parent.inlineContent && (_$from$nodeAfter = $from.nodeAfter) !== null && _$from$nodeAfter !== void 0 && _$from$nodeAfter.isTextblock) {
         anchorFrom = anchorFrom + 1;
       }
+    }
+    if (!hasDeletedWidget) {
+      var _$to$nodeBefore;
       var $to = doc.resolve(anchorTo);
       if (!$to.parent.inlineContent && (_$to$nodeBefore = $to.nodeBefore) !== null && _$to$nodeBefore !== void 0 && _$to$nodeBefore.isTextblock) {
         anchorTo = anchorTo - 1;

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

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getDeletedWidgets = void 0;
+var _decorationKeys = require("./decorations/decorationKeys");
+var _main = require("./main");
+// prosemirror-view does not type `Decoration.type`; a widget's `type.toDOM` is the node passed to
+// `Decoration.widget()` (an element or a factory — the `WidgetConstructor` union).
+
+// The element a deleted-content widget renders, or undefined if it renders via a factory.
+var getWidgetElement = function getWidgetElement(decoration) {
+  var _type;
+  var _ref = (_type = decoration.type) !== null && _type !== void 0 ? _type : {},
+    toDOM = _ref.toDOM;
+  return toDOM instanceof HTMLElement ? toDOM : undefined;
+};
+
+/**
+ * The rendered deleted-content widgets in `editorState`, optionally restricted to `[from, to]`,
+ * ordered by position. Deleted content is rendered as widget decorations rather than document
+ * nodes, so this is how the element and the position it is anchored at are recovered.
+ *
+ * Kept internal and surfaced only through the `getDeletedWidgets` plugin action, so consumers never
+ * receive the plugin key or the decoration set (which would let them mutate plugin behaviour).
+ */
+var getDeletedWidgets = exports.getDeletedWidgets = function getDeletedWidgets(editorState, range) {
+  var _showDiffPluginKey$ge;
+  var decorations = (_showDiffPluginKey$ge = _main.showDiffPluginKey.getState(editorState)) === null || _showDiffPluginKey$ge === void 0 ? void 0 : _showDiffPluginKey$ge.decorations;
+  if (!decorations) {
+    return [];
+  }
+  return decorations.find(range === null || range === void 0 ? void 0 : range.from, range === null || range === void 0 ? void 0 : range.to, function (spec) {
+    return (0, _decorationKeys.isDiffDecorationSpec)(spec) && spec.decorationType === 'widget';
+  }).reduce(function (widgets, decoration) {
+    var element = getWidgetElement(decoration);
+    if (element) {
+      widgets.push({
+        element: element,
+        position: decoration.from
+      });
+    }
+    return widgets;
+  }, []).sort(function (a, b) {
+    return a.position - b.position;
+  });
+};

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

@@ -21,7 +21,7 @@ var _scrollToDiff = require("./scrollToDiff");
 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; }
 var showDiffPluginKey = exports.showDiffPluginKey = new _state2.PluginKey('showDiffPlugin');
-var createPlugin = exports.createPlugin = function createPlugin(config, getIntl, api) {
+var createPlugin = exports.createPlugin = function createPlugin(config, getIntl, api, onEditorView) {
   (0, _enforceCustomStepRegisters.enforceCustomStepRegisters)();
   var nodeViewSerializer = new _NodeViewSerializer.NodeViewSerializer({});
   var setNodeViewSerializer = function setNodeViewSerializer(editorView) {
@@ -162,6 +162,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
     },
     view: function view(editorView) {
       setNodeViewSerializer(editorView);
+      onEditorView === null || onEditorView === void 0 || onEditorView(editorView);
       var isFirst = true;
       var previousActiveIndex;
       var cancelPendingScrollToDecoration = null;
@@ -214,6 +215,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
           var _cancelPendingScrollT3;
           (_cancelPendingScrollT3 = cancelPendingScrollToDecoration) === null || _cancelPendingScrollT3 === void 0 || _cancelPendingScrollT3();
           cancelPendingScrollToDecoration = null;
+          onEditorView === null || onEditorView === void 0 || onEditorView(undefined);
         }
       };
     },

package/dist/cjs/showDiffPlugin.js

@@ -8,6 +8,7 @@ exports.showDiffPlugin = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
+var _getDeletedWidgets2 = require("./pm-plugins/getDeletedWidgets");
 var _getScrollableDecorations = require("./pm-plugins/getScrollableDecorations");
 var _main = require("./pm-plugins/main");
 var _IndicatorBarContentComponent = require("./ui/IndicatorBar/IndicatorBarContentComponent");
@@ -16,8 +17,19 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 var showDiffPlugin = exports.showDiffPlugin = function showDiffPlugin(_ref) {
   var api = _ref.api,
     config = _ref.config;
+  // Captured from the plugin's view lifecycle (see `createPlugin`) so read-only actions can access
+  // the current state without exposing the plugin key to consumers.
+  var editorView;
+  var setEditorView = function setEditorView(view) {
+    editorView = view;
+  };
   return {
     name: 'showDiff',
+    actions: {
+      getDeletedWidgets: function getDeletedWidgets(range) {
+        return editorView ? (0, _getDeletedWidgets2.getDeletedWidgets)(editorView.state, range) : [];
+      }
+    },
     commands: {
       showDiff: function showDiff(params) {
         return function (_ref2) {
@@ -64,7 +76,7 @@ var showDiffPlugin = exports.showDiffPlugin = function showDiffPlugin(_ref) {
         name: 'showDiffPlugin',
         plugin: function plugin(_ref6) {
           var getIntl = _ref6.getIntl;
-          return (0, _main.createPlugin)(config, getIntl, api);
+          return (0, _main.createPlugin)(config, getIntl, api, setEditorView);
         }
       }];
     },

package/dist/es2019/pm-plugins/calculateDiff/calculateDiffDecorations.js

@@ -116,6 +116,30 @@ const calculateNodesForBlockDecoration = ({
   });
   return decorations;
 };
+/**
+ * Whether deleted content for `change` renders after the new content instead of before it.
+ *
+ * show-diff splits this across two options by change granularity, so the level decides which one
+ * applies:
+ * - node/paragraph-level: `deletedDiffPlacement` (default `'top'`). Pure deletions are promoted to
+ *   node level, so they are governed here too.
+ * - inline/sentence-level: `inlineDeletedDiffPlacement` (default `'before'`).
+ *
+ * Callers are responsible for the `smart` diffType and gate checks.
+ */
+export const isDeletedContentPlacedBelow = ({
+  change,
+  deletedDiffPlacement,
+  inlineDeletedDiffPlacement
+}) => {
+  const level = smartChangeLevel(change);
+  if (level === 'node' || level === 'paragraph') {
+    return deletedDiffPlacement === 'bottom';
+  }
+
+  // Inline-level (undefined) and sentence-level changes.
+  return inlineDeletedDiffPlacement === 'after';
+};
 const calculateDiffDecorationsInner = ({
   state,
   pluginState,
@@ -212,6 +236,15 @@ const calculateDiffDecorationsInner = ({
   const isInserted = !isInverted;
   const createDecorationsForChange = (change, showGranularWithBlock) => {
     const isActive = activeIndexPos && change.fromB === activeIndexPos.from && change.toB === activeIndexPos.to;
+
+    // Hoisted because it decides BOTH where the deleted widget is anchored and — since the
+    // widget pins whichever end of the range it sits at — how the indicator anchors below are
+    // allowed to move.
+    const isDeletedWidgetBelow = diffType === 'smart' && fg('platform_editor_ai_smart_diff') && isDeletedContentPlacedBelow({
+      change,
+      deletedDiffPlacement,
+      inlineDeletedDiffPlacement
+    });
     if (change.inserted.length > 0) {
       // shouldHideDeleted for block/node decorations: suppressed when isInverted + hideDeletedDiffs,
       // or when showGranularWithBlock (block reference widget is shown instead).
@@ -250,7 +283,8 @@ const calculateDiffDecorationsInner = ({
               shouldHideDeleted,
               showIndicators,
               hideAddedDiffsUnderline,
-              hasDeletedWidget: willRenderDeletedWidget
+              hasDeletedWidget: willRenderDeletedWidget,
+              isDeletedWidgetBelow
             })
           }));
         }
@@ -266,7 +300,8 @@ const calculateDiffDecorationsInner = ({
             shouldHideDeleted,
             showIndicators,
             hideAddedDiffsUnderline,
-            hasDeletedWidget: willRenderDeletedWidget
+            hasDeletedWidget: willRenderDeletedWidget,
+            isDeletedWidgetBelow
           })
         }));
       }
@@ -300,19 +335,7 @@ const calculateDiffDecorationsInner = ({
             isInserted: !isInserted,
             diffType,
             hideAddedDiffsUnderline,
-            // For `smart` changes, optionally render the deleted content after the new
-            // content (gray + strikethrough) instead of before it. Two independent
-            // controls, split by change level:
-            // - node/paragraph-level: `deletedDiffPlacement` (default `'top'`).
-            // - inline/sentence-level: `inlineDeletedDiffPlacement` (default `'before'`).
-            placeBelow: diffType === 'smart' && fg('platform_editor_ai_smart_diff') && (() => {
-              const level = smartChangeLevel(change);
-              if (level === 'node' || level === 'paragraph') {
-                return deletedDiffPlacement === 'bottom';
-              }
-              // Inline-level (undefined) and sentence-level changes.
-              return inlineDeletedDiffPlacement === 'after';
-            })()
+            placeBelow: isDeletedWidgetBelow
           }),
           showIndicators
         }));

package/dist/es2019/pm-plugins/decorations/createInlineChangedDecoration.js

@@ -37,7 +37,8 @@ export const createInlineChangedDecoration = ({
   diffType,
   hideAddedDiffsUnderline = false,
   inlineNodeName,
-  hasDeletedWidget = false
+  hasDeletedWidget = false,
+  isDeletedWidgetBelow = false
 }) => {
   const diffId = crypto.randomUUID();
   if (shouldHideDeleted) {
@@ -94,14 +95,23 @@ export const createInlineChangedDecoration = ({
     // bar doesn't extend into the preceding block's margin.
     // Skip when the deleted-content widget is rendered — the anchor must
     // stay at the boundary to keep the indicator continuous.
+    //
+    // The widget only pins the end of the range it is anchored to. It sits at `change.fromB`
+    // by default, but `deletedDiffPlacement: 'bottom'` / `inlineDeletedDiffPlacement: 'after'`
+    // move it to `change.toB` so the deleted content reads after the added content. In that
+    // case the `from` anchor has no widget beside it any more and must be adjusted inward
+    // again, otherwise the over-long indicator bar that CCI-18224 fixed comes back.
     let anchorFrom = change.fromB;
     let anchorTo = change.toB;
-    if (!hasDeletedWidget) {
-      var _$from$nodeAfter, _$to$nodeBefore;
+    if (!hasDeletedWidget || isDeletedWidgetBelow) {
+      var _$from$nodeAfter;
       const $from = doc.resolve(anchorFrom);
       if (!$from.parent.inlineContent && (_$from$nodeAfter = $from.nodeAfter) !== null && _$from$nodeAfter !== void 0 && _$from$nodeAfter.isTextblock) {
         anchorFrom = anchorFrom + 1;
       }
+    }
+    if (!hasDeletedWidget) {
+      var _$to$nodeBefore;
       const $to = doc.resolve(anchorTo);
       if (!$to.parent.inlineContent && (_$to$nodeBefore = $to.nodeBefore) !== null && _$to$nodeBefore !== void 0 && _$to$nodeBefore.isTextblock) {
         anchorTo = anchorTo - 1;

package/dist/es2019/pm-plugins/getDeletedWidgets.js

@@ -0,0 +1,40 @@
+import { isDiffDecorationSpec } from './decorations/decorationKeys';
+import { showDiffPluginKey } from './main';
+
+// prosemirror-view does not type `Decoration.type`; a widget's `type.toDOM` is the node passed to
+// `Decoration.widget()` (an element or a factory — the `WidgetConstructor` union).
+
+// The element a deleted-content widget renders, or undefined if it renders via a factory.
+const getWidgetElement = decoration => {
+  var _type;
+  const {
+    toDOM
+  } = (_type = decoration.type) !== null && _type !== void 0 ? _type : {};
+  return toDOM instanceof HTMLElement ? toDOM : undefined;
+};
+
+/**
+ * The rendered deleted-content widgets in `editorState`, optionally restricted to `[from, to]`,
+ * ordered by position. Deleted content is rendered as widget decorations rather than document
+ * nodes, so this is how the element and the position it is anchored at are recovered.
+ *
+ * Kept internal and surfaced only through the `getDeletedWidgets` plugin action, so consumers never
+ * receive the plugin key or the decoration set (which would let them mutate plugin behaviour).
+ */
+export const getDeletedWidgets = (editorState, range) => {
+  var _showDiffPluginKey$ge;
+  const decorations = (_showDiffPluginKey$ge = showDiffPluginKey.getState(editorState)) === null || _showDiffPluginKey$ge === void 0 ? void 0 : _showDiffPluginKey$ge.decorations;
+  if (!decorations) {
+    return [];
+  }
+  return decorations.find(range === null || range === void 0 ? void 0 : range.from, range === null || range === void 0 ? void 0 : range.to, spec => isDiffDecorationSpec(spec) && spec.decorationType === 'widget').reduce((widgets, decoration) => {
+    const element = getWidgetElement(decoration);
+    if (element) {
+      widgets.push({
+        element,
+        position: decoration.from
+      });
+    }
+    return widgets;
+  }, []).sort((a, b) => a.position - b.position);
+};

package/dist/es2019/pm-plugins/main.js

@@ -11,7 +11,7 @@ import { isExtendedEnabled } from './isExtendedEnabled';
 import { NodeViewSerializer } from './NodeViewSerializer';
 import { scrollToActiveDecoration, scrollToFirstDecoration } from './scrollToDiff';
 export const showDiffPluginKey = new PluginKey('showDiffPlugin');
-export const createPlugin = (config, getIntl, api) => {
+export const createPlugin = (config, getIntl, api, onEditorView) => {
   enforceCustomStepRegisters();
   const nodeViewSerializer = new NodeViewSerializer({});
   const setNodeViewSerializer = editorView => {
@@ -171,6 +171,7 @@ export const createPlugin = (config, getIntl, api) => {
     },
     view(editorView) {
       setNodeViewSerializer(editorView);
+      onEditorView === null || onEditorView === void 0 ? void 0 : onEditorView(editorView);
       let isFirst = true;
       let previousActiveIndex;
       let cancelPendingScrollToDecoration = null;
@@ -221,6 +222,7 @@ export const createPlugin = (config, getIntl, api) => {
           var _cancelPendingScrollT3;
           (_cancelPendingScrollT3 = cancelPendingScrollToDecoration) === null || _cancelPendingScrollT3 === void 0 ? void 0 : _cancelPendingScrollT3();
           cancelPendingScrollToDecoration = null;
+          onEditorView === null || onEditorView === void 0 ? void 0 : onEditorView(undefined);
         }
       };
     },