@atlaskit/editor-plugin-show-diff 15.0.1 → 15.1.2

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

@@ -12,6 +12,7 @@ import { createInlineIndicatorAnchorWidgets } from './createAnchorDecorationWidg
 import { createContributorTagWidget } from './createContributorTagWidget';
 import { getAtomicInlineNodeClassNameLegacy, resolveInlineChangedStyleLegacy } from './createInlineChangedDecoration.styles.legacy';
 import { buildDiffDecorationSpec } from './decorationKeys';
+import { REVEAL_ATTR, resolveRevealStyle } from './revealStyles';
 var displayNoneStyle = convertToInlineCss({
   display: 'none'
 });
@@ -102,6 +103,7 @@ export var getAtomicInlineChangedAttrs = function getAtomicInlineChangedAttrs(in
  */
 
 export var createInlineChangedDecoration = function createInlineChangedDecoration(_ref2) {
+  var _revealed$style;
   var attributionKey = _ref2.attributionKey,
     change = _ref2.change,
     colorScheme = _ref2.colorScheme,
@@ -126,6 +128,7 @@ export var createInlineChangedDecoration = function createInlineChangedDecoratio
     hasDeletedWidget = _ref2$hasDeletedWidge === void 0 ? false : _ref2$hasDeletedWidge,
     _ref2$isDeletedWidget = _ref2.isDeletedWidgetBelow,
     isDeletedWidgetBelow = _ref2$isDeletedWidget === void 0 ? false : _ref2$isDeletedWidget,
+    reveal = _ref2.reveal,
     tagMountContext = _ref2.tagMountContext;
   // Derived from the range so it survives a recalculation: stepping to the next/previous change
   // rebuilds decorations without touching the doc, and a fresh id would change the React key and the
@@ -145,7 +148,18 @@ export var createInlineChangedDecoration = function createInlineChangedDecoratio
     }))];
   }
   var colors = getColorScheme(colorScheme);
-  var style = resolveInlineChangedStyle({
+
+  // The reveal withholds the static highlight so the wipe has something to reveal, so it supplies
+  // the whole style rather than adding to the usual one. Extended pipeline only — the AI review
+  // surface is the only consumer, and the non-extended styles have no background to wipe.
+  var revealed = isExtendedEnabled(diffType) ? resolveRevealStyle({
+    colorScheme: colorScheme,
+    hideAddedDiffsUnderline: hideAddedDiffsUnderline,
+    isActive: isActive,
+    isInserted: isInserted,
+    reveal: reveal
+  }) : undefined;
+  var style = (_revealed$style = revealed === null || revealed === void 0 ? void 0 : revealed.style) !== null && _revealed$style !== void 0 ? _revealed$style : resolveInlineChangedStyle({
     colors: colors,
     colorScheme: colorScheme,
     diffType: diffType,
@@ -155,11 +169,11 @@ export var createInlineChangedDecoration = function createInlineChangedDecoratio
   });
   var isAtomicInlineInsertion = isAtomicInlineNode && isInserted;
   var atomicInlineAttrs = isAtomicInlineInsertion ? resolveAtomicInlineAttrs(inlineNodeName, colorScheme, colors) : undefined;
-  var decorations = [Decoration.inline(change.fromB, change.toB, _objectSpread(_objectSpread({
+  var decorations = [Decoration.inline(change.fromB, change.toB, _objectSpread(_objectSpread(_objectSpread({
     style: atomicInlineAttrs ? "".concat(style).concat(atomicInlineAttrs.styleSuffix) : style
   }, atomicInlineAttrs && {
     class: atomicInlineAttrs.className
-  }), {}, {
+  }), revealed && _defineProperty({}, REVEAL_ATTR, revealed.role)), {}, {
     'data-testid': 'show-diff-changed-decoration'
   }, showContributorTags && {
     'data-diff-id': diffId

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

@@ -111,6 +111,7 @@ export var createNodeChangedDecorationWidget = function createNodeChangedDecorat
     diffType = _ref2.diffType,
     _ref2$hideAddedDiffsU = _ref2.hideAddedDiffsUnderline,
     hideAddedDiffsUnderline = _ref2$hideAddedDiffsU === void 0 ? false : _ref2$hideAddedDiffsU,
+    reveal = _ref2.reveal,
     tagMountContext = _ref2.tagMountContext;
   var slice = doc.slice(change.fromA, change.toA);
   var shouldSkipDeletedEmptyParagraphDecoration = !isInserted && (slice === null || slice === void 0 || (_slice$content = slice.content) === null || _slice$content === void 0 ? void 0 : _slice$content.childCount) === 1 && (slice === null || slice === void 0 || (_slice$content2 = slice.content) === null || _slice$content2 === void 0 || (_slice$content2 = _slice$content2.firstChild) === null || _slice$content2 === void 0 ? void 0 : _slice$content2.type.name) === 'paragraph' && (slice === null || slice === void 0 || (_slice$content3 = slice.content) === null || _slice$content3 === void 0 || (_slice$content3 = _slice$content3.firstChild) === null || _slice$content3 === void 0 ? void 0 : _slice$content3.content.size) === 0;
@@ -292,7 +293,7 @@ export var createNodeChangedDecorationWidget = function createNodeChangedDecorat
     var nodeView = serializer.tryCreateNodeView(node);
     if (nodeView) {
       if (node.isInline) {
-        var wrapper = createContentWrapper(colorScheme, isActive, isInserted, diffType);
+        var wrapper = createContentWrapper(colorScheme, isActive, isInserted, diffType, reveal);
         wrapper.append(nodeView);
         dom.append(wrapper);
       } else {
@@ -322,11 +323,12 @@ export var createNodeChangedDecorationWidget = function createNodeChangedDecorat
             colorScheme: colorScheme,
             isActive: isActive,
             isInserted: isInserted,
-            diffType: diffType
+            diffType: diffType,
+            reveal: reveal
           });
           dom.append(injectedNode);
         } else {
-          var _wrapper2 = createContentWrapper(colorScheme, isActive, isInserted, diffType);
+          var _wrapper2 = createContentWrapper(colorScheme, isActive, isInserted, diffType, reveal);
           _wrapper2.append(fallbackNode);
           dom.append(_wrapper2);
         }

package/dist/esm/pm-plugins/decorations/extractContributorTags.js

@@ -11,9 +11,9 @@ import { isDiffDecoration, isDiffDecorationSpec } from './decorationKeys';
 
 /**
  * Diff kinds that expose an anchor a tag can be pinned to: `inline` is added/changed content,
- * `widget` is deleted content. Block diffs carry no attribution.
+ * `widget` is deleted content, `block` a whole changed block node.
  */
-var TAGGABLE_DECORATION_TYPES = new Set(['inline', 'widget']);
+var TAGGABLE_DECORATION_TYPES = new Set(['block', 'inline', 'widget']);
 
 /** The connection is an internal key, so it is dropped on the way to the tag. */
 var toTagContributor = function toTagContributor(_ref) {
@@ -30,6 +30,15 @@ var isSameChange = function isSameChange(widget, inline) {
   return widget.spec.attributionKey === inline.spec.attributionKey && widget.from >= inline.from && widget.from <= inline.to;
 };
 
+/**
+ * Whether `inner` captions the same change as the block decoration `block`, in which case only the
+ * block keeps the tag — one tag per block. Containment counts in either direction: a leaf block's
+ * highlight spans the wrapper the block sits in. Merely adjacent ranges keep a tag each.
+ */
+var isSameBlockChange = function isSameBlockChange(inner, block) {
+  return inner.spec.attributionKey === block.spec.attributionKey && (block.from <= inner.from && inner.to <= block.to || inner.from <= block.from && block.to <= inner.to);
+};
+
 /**
  * One model per diff decoration whose attribution resolves to a supplied contributor; anything
  * unattributed, untaggable or unresolved is skipped. A replacement's two decorations are collapsed
@@ -72,24 +81,44 @@ export var extractContributorTags = function extractContributorTags(decorations,
     var decoration = _ref2.decoration;
     return decoration.spec.decorationType === 'inline';
   });
+  var blockTargets = targets.filter(function (_ref3) {
+    var decoration = _ref3.decoration;
+    return decoration.spec.decorationType === 'block';
+  });
   var linkedDiffIds = new Map();
   var folded = new Set();
+  var fold = function fold(host, target) {
+    var _linkedDiffIds$get;
+    folded.add(target);
+    var hostDiffId = host.decoration.spec.diffId;
+    linkedDiffIds.set(hostDiffId, [].concat(_toConsumableArray((_linkedDiffIds$get = linkedDiffIds.get(hostDiffId)) !== null && _linkedDiffIds$get !== void 0 ? _linkedDiffIds$get : []), [target.decoration.spec.diffId]));
+  };
   var _loop = function _loop() {
-      var _linkedDiffIds$get;
       var target = _targets[_i];
-      if (target.decoration.spec.decorationType !== 'widget') {
+      var decorationType = target.decoration.spec.decorationType;
+      if (decorationType === 'block') {
         return 0; // continue
       }
-      var host = inlineTargets.find(function (_ref3) {
-        var decoration = _ref3.decoration;
-        return isSameChange(target.decoration, decoration);
+
+      // A block outranks both other kinds, so it is tried first.
+      var block = blockTargets.find(function (_ref4) {
+        var decoration = _ref4.decoration;
+        return isSameBlockChange(target.decoration, decoration);
       });
-      if (!host) {
+      if (block) {
+        fold(block, target);
+        return 0; // continue
+      }
+      if (decorationType !== 'widget') {
         return 0; // continue
       }
-      folded.add(target);
-      var hostDiffId = host.decoration.spec.diffId;
-      linkedDiffIds.set(hostDiffId, [].concat(_toConsumableArray((_linkedDiffIds$get = linkedDiffIds.get(hostDiffId)) !== null && _linkedDiffIds$get !== void 0 ? _linkedDiffIds$get : []), [target.decoration.spec.diffId]));
+      var host = inlineTargets.find(function (_ref5) {
+        var decoration = _ref5.decoration;
+        return isSameChange(target.decoration, decoration);
+      });
+      if (host) {
+        fold(host, target);
+      }
     },
     _ret;
   for (var _i = 0, _targets = targets; _i < _targets.length; _i++) {
@@ -98,9 +127,9 @@ export var extractContributorTags = function extractContributorTags(decorations,
   }
   return targets.filter(function (target) {
     return !folded.has(target);
-  }).map(function (_ref4) {
-    var contributor = _ref4.contributor,
-      spec = _ref4.decoration.spec;
+  }).map(function (_ref6) {
+    var contributor = _ref6.contributor,
+      spec = _ref6.decoration.spec;
     var connected = contributor.connectedToKey ? contributors[contributor.connectedToKey] : undefined;
     var connectedContributor = connected ? toTagContributor(connected) : undefined;
     var linked = linkedDiffIds.get(spec.diffId);

package/dist/esm/pm-plugins/decorations/revealStyles.js

@@ -0,0 +1,149 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
+import { buildDeletedInlineStyleStandard, getDeletedInlineRevealColors, getInsertedInlineRevealColors } from './colorSchemes/factory';
+import { colorSchemeRegistry } from './colorSchemes/schemes';
+import { deletedContentStyle, deletedContentStyleActive } from './colorSchemes/standard';
+/**
+ * Painting strategy for reveal highlights. Highlights are `linear-gradient`s with animated
+ * `background-size` for the wipe effect. Colours live on elements as custom properties so the
+ * attribution palette works per-contributor.
+ */
+
+/** Marks an element as taking part in the reveal, and says which side it represents. */
+export var REVEAL_ATTR = 'data-show-diff-reveal';
+/** Wipe colour, read by the animation as the gradient's colour stop. */
+export var REVEAL_BG_VAR = '--show-diff-reveal-bg';
+
+/** Underline colour, brought in on the same schedule as the highlight. */
+export var REVEAL_BORDER_VAR = '--show-diff-reveal-border';
+
+/** Only schemes with background highlights can be revealed; 'traditional' uses underline only. */
+var schemeSupportsReveal = function schemeSupportsReveal(colorScheme) {
+  return colorScheme !== 'traditional';
+};
+
+/** Convert a flat background colour into a wipeable gradient (zero width initially). */
+export var buildWipeableBackground = function buildWipeableBackground(color) {
+  return convertToInlineCss({
+    backgroundColor: 'transparent',
+    backgroundImage: "linear-gradient(".concat(color, ", ").concat(color, ")"),
+    backgroundRepeat: 'no-repeat',
+    backgroundSize: '0% 100%',
+    backgroundPosition: '0 0',
+    // Each line fragment of a wrapped highlight gets its own background box, so they wipe
+    // together rather than the gradient stretching across the whole wrapped run.
+    WebkitBoxDecorationBreak: 'clone',
+    boxDecorationBreak: 'clone'
+  });
+};
+
+/** Base padding and transparent underline placeholder (no layout shift on reveal). */
+var revealBaseStyle = convertToInlineCss({
+  padding: "1px 0 2px",
+  borderBottom: "2px solid transparent"
+});
+var buildRevealVariables = function buildRevealVariables(_ref) {
+  var background = _ref.background,
+    border = _ref.border;
+  return convertToInlineCss(_defineProperty(_defineProperty({}, REVEAL_BG_VAR, background), REVEAL_BORDER_VAR, border));
+};
+
+/** Configuration that affects both resting state and reveal endpoint. */
+
+/** Reveal colours from the refactored scheme registry (attribution palette ready). */
+var revealColorsRefactored = function revealColorsRefactored(colors, _ref2) {
+  var hideAddedDiffsUnderline = _ref2.hideAddedDiffsUnderline,
+    isActive = _ref2.isActive,
+    isInserted = _ref2.isInserted;
+  return isInserted ? getInsertedInlineRevealColors(colors, isActive, hideAddedDiffsUnderline) : getDeletedInlineRevealColors(colors);
+};
+
+/**
+ * Legacy cohort reveal colours. Values MUST match `revealColorsRefactored()` output for
+ * `standard` scheme (test: `revealStyles.ts` in test package).
+ */
+var revealColorsLegacy = function revealColorsLegacy(_ref3) {
+  var hideAddedDiffsUnderline = _ref3.hideAddedDiffsUnderline,
+    isActive = _ref3.isActive,
+    isInserted = _ref3.isInserted;
+  return isInserted ? {
+    // Mirrors `editingStyleExtended` / `editingStyleActiveExtended` and their
+    // `*NoUnderline` variants in `colorSchemes/standard.ts`.
+    background: isActive ? "var(--ds-background-accent-purple-subtler-pressed, #D8A0F7)" : "var(--ds-background-accent-purple-subtlest, #F8EEFE)",
+    border: hideAddedDiffsUnderline ? 'transparent' : "var(--ds-border-accent-purple, #AF59E1)"
+  } : {
+    // Mirrors `deletedInlineContentStyleExtended` in `colorSchemes/standard.ts`.
+    background: "var(--ds-background-accent-gray-subtlest, #F0F1F2)",
+    border: "var(--ds-border-accent-gray, #7D818A)"
+  };
+};
+var resolveRevealColors = function resolveRevealColors(colors, variant) {
+  return isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? revealColorsRefactored(colors, variant) : revealColorsLegacy(variant);
+};
+var getColorScheme = function getColorScheme(colorScheme) {
+  return colorSchemeRegistry[colorScheme !== null && colorScheme !== void 0 ? colorScheme : 'standard'];
+};
+
+/** Deleted text appearance (grey and strikethrough) without the highlight. */
+var deletedTextOnlyStyle = function deletedTextOnlyStyle(colors, isActive) {
+  return isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? buildDeletedInlineStyleStandard(colors, isActive ? 'active' : 'default') : isActive ? deletedContentStyleActive : deletedContentStyle;
+};
+
+/**
+ * Resolve reveal attribute and style for a decoration. Returned style REPLACES the decoration's
+ * highlight (not an addition) so the animation has something to wipe. Gate resolved in showDiff
+ * command for single shared answer between decorations and animation.
+ */
+export var resolveRevealStyle = function resolveRevealStyle(_ref4) {
+  var colorScheme = _ref4.colorScheme,
+    _ref4$hideAddedDiffsU = _ref4.hideAddedDiffsUnderline,
+    hideAddedDiffsUnderline = _ref4$hideAddedDiffsU === void 0 ? false : _ref4$hideAddedDiffsU,
+    _ref4$includeDeletedT = _ref4.includeDeletedTextStyle,
+    includeDeletedTextStyle = _ref4$includeDeletedT === void 0 ? true : _ref4$includeDeletedT,
+    isActive = _ref4.isActive,
+    isInserted = _ref4.isInserted,
+    reveal = _ref4.reveal;
+  if ((reveal === null || reveal === void 0 ? void 0 : reveal.mode) !== 'phased' || !schemeSupportsReveal(colorScheme)) {
+    return undefined;
+  }
+  var colors = getColorScheme(colorScheme);
+  var _resolveRevealColors = resolveRevealColors(colors, {
+      hideAddedDiffsUnderline: hideAddedDiffsUnderline,
+      isActive: isActive,
+      isInserted: isInserted
+    }),
+    background = _resolveRevealColors.background,
+    border = _resolveRevealColors.border;
+  return {
+    role: isInserted ? 'added' : 'deleted',
+    style: (isInserted || !includeDeletedTextStyle ? '' : deletedTextOnlyStyle(colors, isActive)) + revealBaseStyle + buildWipeableBackground(background) + buildRevealVariables({
+      background: background,
+      border: border
+    })
+  };
+};
+
+/** Reveal style for imperatively-built elements (deleted-content widget wrappers). */
+export var applyRevealToElement = function applyRevealToElement(_ref5) {
+  var colorScheme = _ref5.colorScheme,
+    element = _ref5.element,
+    hideAddedDiffsUnderline = _ref5.hideAddedDiffsUnderline,
+    isActive = _ref5.isActive,
+    isInserted = _ref5.isInserted,
+    reveal = _ref5.reveal;
+  var resolved = resolveRevealStyle({
+    colorScheme: colorScheme,
+    hideAddedDiffsUnderline: hideAddedDiffsUnderline,
+    isActive: isActive,
+    isInserted: isInserted,
+    reveal: reveal,
+    // The widget supplies the deleted text's own grey/strikethrough styling already.
+    includeDeletedTextStyle: false
+  });
+  if (!resolved) {
+    return '';
+  }
+  element.setAttribute(REVEAL_ATTR, resolved.role);
+  return resolved.style;
+};

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

@@ -5,6 +5,7 @@ import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-uti
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { isExtendedEnabled } from '../../isExtendedEnabled';
+import { applyRevealToElement } from '../revealStyles';
 import { getAtomicInlineChangedAttrs } from '../createInlineChangedDecoration';
 import { applyTableCellEdgeAttrs } from './tableCellEdgeAttrs';
 import { isInlineAttrChangeNodeName } from './getAttrChangeRanges';
@@ -607,9 +608,17 @@ export var injectInnerWrapper = function injectInnerWrapper(_ref13) {
     colorScheme = _ref13.colorScheme,
     isActive = _ref13.isActive,
     isInserted = _ref13.isInserted,
-    diffType = _ref13.diffType;
+    diffType = _ref13.diffType,
+    reveal = _ref13.reveal;
   var wrapper = document.createElement('span');
-  wrapper.setAttribute('style', isInserted ? getInsertedContentStyle(colorScheme, isActive) : getDeletedContentStyle(colorScheme, isActive, diffType));
+  var revealStyle = applyRevealToElement({
+    colorScheme: colorScheme,
+    element: wrapper,
+    isActive: isActive !== null && isActive !== void 0 ? isActive : false,
+    isInserted: isInserted !== null && isInserted !== void 0 ? isInserted : false,
+    reveal: reveal
+  });
+  wrapper.setAttribute('style', (isInserted ? getInsertedContentStyle(colorScheme, isActive) : getDeletedContentStyle(colorScheme, isActive, diffType, Boolean(revealStyle))) + revealStyle);
   _toConsumableArray(node.childNodes).forEach(function (child) {
     var removedChild = node.removeChild(child);
     wrapper.append(removedChild);
@@ -625,22 +634,33 @@ export var createContentWrapper = function createContentWrapper(colorScheme) {
   var isActive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var isInserted = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
   var diffType = arguments.length > 3 ? arguments[3] : undefined;
+  var reveal = arguments.length > 4 ? arguments[4] : undefined;
   var wrapper = document.createElement('span');
   var baseStyle = convertToInlineCss({
     position: 'relative',
     width: 'fit-content'
   });
+  // Empty unless the reveal is running, in which case the static highlight below is withheld so
+  // the animation can wipe it in instead.
+  var revealStyle = applyRevealToElement({
+    colorScheme: colorScheme,
+    element: wrapper,
+    isActive: isActive,
+    isInserted: isInserted,
+    reveal: reveal
+  });
+  var deletedStyle = getDeletedContentStyle(colorScheme, isActive, diffType, Boolean(revealStyle));
   if (isExtendedEnabled(diffType)) {
     if (isInserted) {
-      wrapper.setAttribute('style', "".concat(baseStyle).concat(getInsertedContentStyle(colorScheme, isActive)));
+      wrapper.setAttribute('style', "".concat(baseStyle).concat(getInsertedContentStyle(colorScheme, isActive)).concat(revealStyle));
     } else {
-      wrapper.setAttribute('style', "".concat(baseStyle).concat(getDeletedContentStyle(colorScheme, isActive, diffType)));
+      wrapper.setAttribute('style', "".concat(baseStyle).concat(deletedStyle).concat(revealStyle));
       var strikethrough = document.createElement('span');
       strikethrough.setAttribute('style', getDeletedContentStyleUnbounded(colorScheme, isActive));
       wrapper.append(strikethrough);
     }
   } else {
-    wrapper.setAttribute('style', "".concat(baseStyle).concat(getDeletedContentStyle(colorScheme, isActive, diffType)));
+    wrapper.setAttribute('style', "".concat(baseStyle).concat(deletedStyle).concat(revealStyle));
     var _strikethrough = document.createElement('span');
     _strikethrough.setAttribute('style', getDeletedContentStyleUnbounded(colorScheme, isActive));
     wrapper.append(_strikethrough);

package/dist/esm/pm-plugins/decorations/utils/wrapBlockNodeViewStyles.js

@@ -100,11 +100,12 @@ var getInsertedContentStyleNext = function getInsertedContentStyleNext(colorSche
 var getDeletedContentStyleNext = function getDeletedContentStyleNext(colorScheme) {
   var isActive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var diffType = arguments.length > 2 ? arguments[2] : undefined;
+  var omitHighlight = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
   var colors = getColorScheme(colorScheme);
   var base = buildDeletedInlineContentStyle(colors, isActive ? 'active' : 'new');
 
   // glyphTint adds a background highlight and border-bottom over the tint; strikethrough does not.
-  var needsExtendedHighlight = colors.deletedInlineTreatment === 'glyphTint' && isExtendedEnabled(diffType);
+  var needsExtendedHighlight = colors.deletedInlineTreatment === 'glyphTint' && isExtendedEnabled(diffType) && !omitHighlight;
   return needsExtendedHighlight ? base + buildDeletedInlineContentStyleExtended(colors) : base;
 };
 var resolveCellOverlayStyleNext = function resolveCellOverlayStyleNext(_ref) {
@@ -166,7 +167,8 @@ export var getInsertedContentStyle = function getInsertedContentStyle(colorSchem
 export var getDeletedContentStyle = function getDeletedContentStyle(colorScheme) {
   var isActive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var diffType = arguments.length > 2 ? arguments[2] : undefined;
-  return isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? getDeletedContentStyleNext(colorScheme, isActive, diffType) : getDeletedContentStyleLegacy(getLegacyColorScheme(colorScheme), isActive, diffType);
+  var omitHighlight = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+  return isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? getDeletedContentStyleNext(colorScheme, isActive, diffType, omitHighlight) : getDeletedContentStyleLegacy(getLegacyColorScheme(colorScheme), isActive, diffType, omitHighlight);
 };
 
 /**

package/dist/esm/pm-plugins/decorations/utils/wrapBlockNodeViewStyles.legacy.js

@@ -165,10 +165,11 @@ export var getInsertedContentStyleLegacy = function getInsertedContentStyleLegac
 export var getDeletedContentStyleLegacy = function getDeletedContentStyleLegacy(colorScheme) {
   var isActive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var diffType = arguments.length > 2 ? arguments[2] : undefined;
+  var omitHighlight = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
   if (colorScheme === 'traditional') {
     return getDeletedTraditionalInlineStyle(isActive);
   }
-  if (isExtendedEnabled(diffType)) {
+  if (isExtendedEnabled(diffType) && !omitHighlight) {
     return (isActive ? deletedContentStyleActive : deletedContentStyleNew) + deletedInlineContentStyleExtended;
   }
   return isActive ? deletedContentStyleActive : deletedContentStyleNew;

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

@@ -13,6 +13,7 @@ import { enforceCustomStepRegisters } from './enforceCustomStepRegisters';
 import { getScrollableDecorations } from './getScrollableDecorations';
 import { getDefaultDiffType, isExtendedEnabled } from './isExtendedEnabled';
 import { NodeViewSerializer } from './NodeViewSerializer';
+import { rebindReveal } from './revealAnimation';
 import { scrollToDecoration } from './scrollToDiff';
 export var showDiffPluginKey = new PluginKey('showDiffPlugin');
 /**
@@ -84,12 +85,21 @@ export var createPlugin = function createPlugin(config, getIntl, api, onEditorVi
         var meta = tr.getMeta(showDiffPluginKey);
         var newPluginState = currentPluginState;
         if (meta) {
-          if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'SHOW_DIFF') {
-            var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8, _newPluginState9, _newPluginState0;
-            // Update the plugin state with the new metadata
-            newPluginState = _objectSpread(_objectSpread(_objectSpread({}, currentPluginState), meta), {}, {
+          if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'SHOW_DIFF' || (meta === null || meta === void 0 ? void 0 : meta.action) === 'REVEAL_COMPLETE') {
+            var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8, _newPluginState9, _newPluginState0, _newPluginState1;
+            // REVEAL_COMPLETE repaints with the reveal dropped, so the decorations render their
+            // ordinary resting style. Without it the reveal stays in state indefinitely and the
+            // next unrelated repaint re-emits the hidden, zero-width highlight with no animation
+            // left to bring it in — the highlight simply vanishes.
+            newPluginState = meta.action === 'REVEAL_COMPLETE' ? _objectSpread(_objectSpread({}, currentPluginState), {}, {
+              reveal: undefined
+            }) : _objectSpread(_objectSpread(_objectSpread({}, currentPluginState), meta), {}, {
               isDisplayingChanges: true,
-              activeIndex: undefined
+              activeIndex: undefined,
+              // Explicit rather than left to the spread: an absent key in `meta` would let
+              // the previous paint's choreography leak into this one, so closing the diff
+              // would animate too.
+              reveal: meta.reveal
             });
             // Calculate and store decorations in state
             var _calculateDiffDecorat = calculateDiffDecorations(_objectSpread({
@@ -109,7 +119,10 @@ export var createPlugin = function createPlugin(config, getIntl, api, onEditorVi
                 showIndicators: (_newPluginState6 = newPluginState) === null || _newPluginState6 === void 0 ? void 0 : _newPluginState6.showIndicators,
                 smartThresholds: (_newPluginState7 = newPluginState) === null || _newPluginState7 === void 0 ? void 0 : _newPluginState7.smartThresholds,
                 deletedDiffPlacement: (_newPluginState8 = newPluginState) === null || _newPluginState8 === void 0 ? void 0 : _newPluginState8.deletedDiffPlacement,
-                inlineDeletedDiffPlacement: (_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.inlineDeletedDiffPlacement
+                inlineDeletedDiffPlacement: (_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.inlineDeletedDiffPlacement,
+                // SHOW_DIFF only. The scroll-to-next recalculation further down deliberately
+                // omits this so stepping through changes cannot replay the choreography.
+                reveal: (_newPluginState0 = newPluginState) === null || _newPluginState0 === void 0 ? void 0 : _newPluginState0.reveal
               } : {})),
               contributorTags = _calculateDiffDecorat.contributorTags,
               decorations = _calculateDiffDecorat.decorations,
@@ -117,7 +130,7 @@ export var createPlugin = function createPlugin(config, getIntl, api, onEditorVi
             // Update the decorations and their ids
             newPluginState.decorations = decorations;
             newPluginState.contributorTags = contributorTags;
-            if (isExtendedEnabled((_newPluginState0 = newPluginState) === null || _newPluginState0 === void 0 ? void 0 : _newPluginState0.diffType)) {
+            if (isExtendedEnabled((_newPluginState1 = newPluginState) === null || _newPluginState1 === void 0 ? void 0 : _newPluginState1.diffType)) {
               newPluginState.diffDescriptors = diffDescriptors;
             }
           } else if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'HIDE_DIFF') {
@@ -125,7 +138,8 @@ export var createPlugin = function createPlugin(config, getIntl, api, onEditorVi
               decorations: DecorationSet.empty,
               isDisplayingChanges: false,
               activeIndex: undefined,
-              contributorTags: []
+              contributorTags: [],
+              reveal: undefined
             }, isExtendedEnabled(currentPluginState.diffType) ? {
               isInverted: false,
               diffType: getDefaultDiffType(),
@@ -134,9 +148,9 @@ export var createPlugin = function createPlugin(config, getIntl, api, onEditorVi
               diffDescriptors: []
             } : {});
           } else if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'SCROLL_TO_NEXT' || (meta === null || meta === void 0 ? void 0 : meta.action) === 'SCROLL_TO_PREVIOUS') {
-            var _newPluginState1;
+            var _newPluginState10;
             // Update the active index in plugin state and recalculate decorations
-            var _decorations = getScrollableDecorations(currentPluginState.decorations, newState.doc, (_newPluginState1 = newPluginState) === null || _newPluginState1 === void 0 ? void 0 : _newPluginState1.diffType);
+            var _decorations = getScrollableDecorations(currentPluginState.decorations, newState.doc, (_newPluginState10 = newPluginState) === null || _newPluginState10 === void 0 ? void 0 : _newPluginState10.diffType);
             if (_decorations.length > 0) {
               var _currentPluginState$a;
               // Initialize to -1 if undefined so that the first "next" scroll takes us to index 0 (first change).
@@ -226,6 +240,10 @@ export var createPlugin = function createPlugin(config, getIntl, api, onEditorVi
           }
           var pluginState = showDiffPluginKey.getState(view.state);
 
+          // A repaint rebuilds inline decorations, destroying any animation bound to them, so
+          // an in-flight reveal has to be re-attached to the new nodes. No-op when idle.
+          rebindReveal(view, view.dom);
+
           // Scroll to the first decoration when scrollIntoView was requested.
           // Use the same filtered/position-sorted list as the active-index path
           // so "first" reliably means the topmost scrollable diff in the document.

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

@@ -64,10 +64,15 @@ var resolveAgent = function resolveAgent(attribution, profilesByAccountId) {
 
 /**
  * One contributor per distinct actor behind the attributed steps, resolved against the identities
- * the consumer supplied. Returns `undefined` if any actor cannot be named: a half-credited diff
- * reads as "nobody touched this", so the whole list is dropped and the plain diff renders instead.
+ * the consumer supplied. An actor the consumer cannot name is skipped rather than dropping the whole
+ * list: tags are per change, so its changes keep their diff colour and simply carry no tag, while
+ * the actors that *are* named stay credited. Returns `undefined` only when nothing resolves at all.
  */
 export var resolveDiffContributors = function resolveDiffContributors(stepsWithAttribution, profiles) {
+  // Profiles opt callers into contributor tags; attribution alone still supplies diff colours.
+  if (profiles === undefined) {
+    return undefined;
+  }
   var profilesByAccountId = toProfilesByAccountId(profiles);
   var contributors = [];
   /** Keyed as the plugin keys changes, so no two entries can collapse onto one another. */
@@ -100,28 +105,30 @@ export var resolveDiffContributors = function resolveDiffContributors(stepsWithA
           userId: userId
         };
         var _user = resolveUser(userId, profilesByAccountId);
-        if (!_user) {
-          return undefined;
-        }
 
         // Skipped if the invoking user's own step already credited them.
         var invokingUserActor = getAttributionKey(invokingUser);
-        if (invokingUserActor && !creditedActors.has(invokingUserActor)) {
+        if (_user && invokingUserActor && !creditedActors.has(invokingUserActor)) {
           contributors.push(_objectSpread(_objectSpread({}, _user), {}, {
             attribution: invokingUser
           }));
           creditedActors.add(invokingUserActor);
         }
+
+        // The agent is always nameable, so it is credited even when its invoker is not — but
+        // without the connection, which would point at a contributor that was never created.
         contributors.push(_objectSpread(_objectSpread({}, agent), {}, {
-          attribution: stepAttribution,
+          attribution: stepAttribution
+        }, _user ? {
           connectedTo: invokingUser
-        }));
+        } : {}));
         creditedActors.add(actor);
         continue;
       }
       var user = userId ? resolveUser(userId, profilesByAccountId) : undefined;
       if (!user) {
-        return undefined;
+        // Unnamed, and a user has no generic fallback label, so this actor's changes go untagged.
+        continue;
       }
       contributors.push(_objectSpread(_objectSpread({}, user), {}, {
         attribution: stepAttribution