@atlaskit/editor-plugin-show-diff 16.0.1 → 16.0.2

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

@@ -15,22 +15,7 @@ var _factory = require("../../pm-plugins/decorations/colorSchemes/factory");
 var _schemes = require("../../pm-plugins/decorations/colorSchemes/schemes");
 var _buildContributorTagDom = require("./buildContributorTagDom");
 var _contributorAvatarRenderer = require("./contributorAvatarRenderer");
-var _messages = require("./messages");
-var getContributorName = function getContributorName(contributor, formatMessage) {
-  var _contributor$name, _contributor$agentKin;
-  var name = (_contributor$name = contributor.name) === null || _contributor$name === void 0 ? void 0 : _contributor$name.trim();
-  if (name) {
-    return name;
-  }
-
-  // `agentKind` defaults to `'external'` per the plugin type contract; an unidentified external
-  // agent falls back to a generic label rather than rendering a nameless tag.
-  if (contributor.kind === 'agent' && ((_contributor$agentKin = contributor.agentKind) !== null && _contributor$agentKin !== void 0 ? _contributor$agentKin : 'external') === 'external') {
-    return formatMessage(_messages.contributorTagMessages.externalAgentName);
-  }
-  return '';
-};
-
+var _contributorLabel = require("./contributorLabel");
 /**
  * Resolves the tag's accent from the same scheme value the highlight was drawn from, so the colour
  * the two carry can never drift — only the tone does, which is `getAccentTokens`'s to pick.
@@ -113,8 +98,8 @@ var fadeTagOut = function fadeTagOut(tag, release) {
 /** The contributors a tag draws, keyed so a republished model can be recognised as the same pair. */
 var identityOf = function identityOf(model) {
   return [model === null || model === void 0 ? void 0 : model.contributor, model === null || model === void 0 ? void 0 : model.connectedContributor].map(function (contributor) {
-    var _contributor$agentKin2, _contributor$avatarUr;
-    return contributor ? "".concat(contributor.kind, ":").concat((_contributor$agentKin2 = contributor.agentKind) !== null && _contributor$agentKin2 !== void 0 ? _contributor$agentKin2 : '', ":").concat(contributor.name, ":").concat((_contributor$avatarUr = contributor.avatarUrl) !== null && _contributor$avatarUr !== void 0 ? _contributor$avatarUr : '') : '';
+    var _contributor$agentKin, _contributor$avatarUr;
+    return contributor ? "".concat(contributor.kind, ":").concat((_contributor$agentKin = contributor.agentKind) !== null && _contributor$agentKin !== void 0 ? _contributor$agentKin : '', ":").concat(contributor.name, ":").concat((_contributor$avatarUr = contributor.avatarUrl) !== null && _contributor$avatarUr !== void 0 ? _contributor$avatarUr : '') : '';
   }).join('|');
 };
 
@@ -355,24 +340,12 @@ var ContributorTagController = exports.ContributorTagController = /*#__PURE__*/f
       if (!this.dom) {
         return;
       }
-      var _this$options$getIntl = this.options.getIntl(),
-        formatMessage = _this$options$getIntl.formatMessage;
-      var isPrimaryAgent = model.contributor.kind === 'agent';
-      var primaryName = getContributorName(model.contributor, formatMessage);
-      var secondaryName = model.connectedContributor ? getContributorName(model.connectedContributor, formatMessage) : '';
-      var agentName = isPrimaryAgent ? primaryName : secondaryName;
-      var userName = isPrimaryAgent ? secondaryName : primaryName;
-
-      // A connected pair only ever shows the agent; the pair is spelled out in the label, because the
-      // tag is capped at `MAX_TAG_WIDTH` and two names rarely fit inside it.
-      this.dom.name.textContent = model.connectedContributor ? agentName || primaryName : primaryName;
-      this.fullLabel = model.connectedContributor ? formatMessage(_messages.contributorTagMessages.changedByConnected, {
-        agentName: agentName,
-        userName: userName
-      }) : formatMessage(_messages.contributorTagMessages.changedBy, {
-        name: primaryName
-      });
-      this.dom.srLabel.textContent = this.fullLabel;
+      var _formatContributorLab = (0, _contributorLabel.formatContributorLabel)(model, this.options.getIntl().formatMessage),
+        fullLabel = _formatContributorLab.fullLabel,
+        visibleName = _formatContributorLab.visibleName;
+      this.dom.name.textContent = visibleName;
+      this.fullLabel = fullLabel;
+      this.dom.srLabel.textContent = fullLabel;
     }
   }, {
     key: "accentOf",
@@ -427,7 +400,7 @@ var ContributorTagController = exports.ContributorTagController = /*#__PURE__*/f
   }, {
     key: "syncTooltip",
     value: function syncTooltip() {
-      var _this$tooltip2;
+      var _this$tooltip2, _this$dom$tag$querySe;
       var content = this.dom ? this.fullLabel : undefined;
       if (content === this.tooltipContent) {
         return;
@@ -444,9 +417,11 @@ var ContributorTagController = exports.ContributorTagController = /*#__PURE__*/f
       // renaming. Those styles are scoped under `.ProseMirror`, and the tag renders inside it.
       'ak-editor-vanilla-tooltip-default');
       // `VanillaTooltip` sets `aria-describedby` on its trigger, which would announce the label a
-      // second time — the visually hidden child already announces it, after the change as design
-      // requires.
+      // second time — the hidden child already announces it, and names the tag with it.
       this.dom.tag.removeAttribute('aria-describedby');
+      // The popover is a child of the trigger, so its text would be a third copy of the same
+      // sentence. It stays visible for sighted users, who need the part of the name the tag clipped.
+      (_this$dom$tag$querySe = this.dom.tag.querySelector(':scope > [role="tooltip"]')) === null || _this$dom$tag$querySe === void 0 || _this$dom$tag$querySe.setAttribute('aria-hidden', 'true');
     }
 
     /**

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

@@ -11,6 +11,11 @@ var contributorTagMessages = exports.contributorTagMessages = (0, _reactIntl.def
     defaultMessage: 'Changed by {name}',
     description: 'Screen-reader label and tooltip for the tag pinned to a highlighted change in the version-history diff, naming the single person or agent that made the change. The name placeholder is the contributor display name.'
   },
+  changedByAgent: {
+    id: 'editor-plugin-show-diff.ContributorTag.changedByAgent',
+    defaultMessage: 'Changed by {name}, an AI agent',
+    description: 'Screen-reader label and tooltip for the tag pinned to a highlighted change in the version-history diff, when a named AI agent made the change rather than a person. The name placeholder is the agent display name.'
+  },
   changedByConnected: {
     id: 'editor-plugin-show-diff.ContributorTag.changedByConnected',
     defaultMessage: 'Changed by {agentName} with {userName}',

package/dist/cjs/ui/DiffNavigation/announceActiveDiff.js

@@ -0,0 +1,54 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getActiveDiffAnnouncement = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _decorationKeys = require("../../pm-plugins/decorations/decorationKeys");
+var _contributorLabel = require("../ContributorTag/contributorLabel");
+var _messages = require("./messages");
+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; }
+/**
+ * The tag that captions the given decoration, if any. `linkedDiffIds` is checked as well as
+ * `diffId`, because a replacement's two decorations share one tag and navigation can land on either.
+ */
+var findTagFor = function findTagFor(decoration, contributorTags) {
+  if (!(contributorTags !== null && contributorTags !== void 0 && contributorTags.length) || !(0, _decorationKeys.isDiffDecoration)(decoration)) {
+    return undefined;
+  }
+  var diffId = decoration.spec.diffId;
+  return contributorTags.find(function (tag) {
+    var _tag$linkedDiffIds;
+    return tag.diffId === diffId || ((_tag$linkedDiffIds = tag.linkedDiffIds) === null || _tag$linkedDiffIds === void 0 ? void 0 : _tag$linkedDiffIds.includes(diffId));
+  });
+};
+
+/**
+ * What a screen reader should say once the reader has stepped onto a change: where they are in the
+ * diff, and — when the plugin can credit the change — who made it. Stepping otherwise only scrolls,
+ * which is silent.
+ *
+ * Returns `undefined` for an index that resolves no change, so the caller says nothing at all
+ * rather than "Change 4 of 3".
+ */
+var getActiveDiffAnnouncement = exports.getActiveDiffAnnouncement = function getActiveDiffAnnouncement(_ref) {
+  var activeIndex = _ref.activeIndex,
+    contributorTags = _ref.contributorTags,
+    decorations = _ref.decorations,
+    intl = _ref.intl;
+  var activeDecoration = decorations[activeIndex];
+  if (!activeDecoration) {
+    return undefined;
+  }
+  var position = {
+    index: activeIndex + 1,
+    total: decorations.length
+  };
+  var tag = findTagFor(activeDecoration, contributorTags);
+  return tag ? intl.formatMessage(_messages.diffNavigationMessages.activeChangeWithContributor, _objectSpread(_objectSpread({}, position), {}, {
+    contributor: (0, _contributorLabel.formatContributorLabel)(tag, intl.formatMessage).fullLabel
+  })) : intl.formatMessage(_messages.diffNavigationMessages.activeChange, position);
+};

package/dist/cjs/ui/DiffNavigation/messages.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.diffNavigationMessages = void 0;
+var _reactIntl = require("react-intl");
+var diffNavigationMessages = exports.diffNavigationMessages = (0, _reactIntl.defineMessages)({
+  activeChange: {
+    id: 'editor-plugin-show-diff.DiffNavigation.activeChange',
+    defaultMessage: 'Change {index} of {total}',
+    description: 'Announced to screen readers when the reader steps to the next or previous change in the version-history diff. The index placeholder is the position of the change stepped to, counting from 1; total is how many changes the diff has.'
+  },
+  activeChangeWithContributor: {
+    id: 'editor-plugin-show-diff.DiffNavigation.activeChangeWithContributor',
+    defaultMessage: 'Change {index} of {total}. {contributor}',
+    description: 'Announced to screen readers when the reader steps to the next or previous change in the version-history diff and that change is credited to someone. The index and total placeholders are as in activeChange. The contributor placeholder is an already-translated sentence (changedBy, changedByAgent or changedByConnected), so it must be kept whole and only repositioned.'
+  }
+});

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

@@ -316,11 +316,12 @@ const calculateDiffDecorationsInner = ({
   }
   const pendingAttrSteps = [];
   const stepMaps = [];
-  for (const step of simplifiedSteps) {
+  for (const [stepIndex, step] of simplifiedSteps.entries()) {
     const result = step.apply(steppedDoc);
     if (result.failed === null && result.doc) {
       if (stepIsValidAttrChange(step, steppedDoc, result.doc)) {
         pendingAttrSteps.push({
+          attributionKey: getAttributionKey(simplifiedStepAttributions[stepIndex]),
           afterNode: result.doc.nodeAt(step.pos),
           beforeNode: steppedDoc.nodeAt(step.pos),
           mapIndex: stepMaps.length,
@@ -335,6 +336,7 @@ const calculateDiffDecorationsInner = ({
   // The fallback deliberately preserves the legacy raw-position lookups for rollout safety.
   const attrStepContexts = fg('platform_editor_reduce_diff_attr_sensitivity') ? pendingAttrSteps.flatMap(({
     afterNode,
+    attributionKey,
     beforeNode,
     mapIndex,
     step
@@ -345,6 +347,7 @@ const calculateDiffDecorationsInner = ({
     }
     const originalPosition = new Mapping(stepMaps.slice(0, mapIndex)).invert().mapResult(step.pos);
     return [{
+      attributionKey,
       afterNode,
       beforeNode,
       finalPos: finalPosition.pos,
@@ -354,8 +357,10 @@ const calculateDiffDecorationsInner = ({
       step
     }];
   }) : pendingAttrSteps.map(({
+    attributionKey,
     step
   }) => ({
+    attributionKey,
     afterNode: tr.doc.nodeAt(step.pos),
     beforeNode: originalDoc.nodeAt(step.pos),
     finalPos: step.pos,
@@ -608,31 +613,48 @@ const calculateDiffDecorationsInner = ({
   // smart path. Only add the legacy step-range decoration when no equivalent changeset range was
   // produced; otherwise the same content receives two inline decorations (and two navigation
   // changes), usually one attribution colour and one default purple decoration.
-  getMarkChangeRanges(steps).filter(({
+  getMarkChangeRanges(simplifiedSteps, simplifiedStepAttributions, fg('confluence_ncs_step_diffing_version_history') ? stepMaps : undefined).filter(({
     fromB,
     toB
   }) => !fg('confluence_ncs_step_diffing_version_history') || !changes.some(change => change.fromB === fromB && change.toB === toB)).forEach(change => {
+    var _attributionColors$ge, _attributionColors;
+    const changeColorScheme = change.attributionKey ? (_attributionColors$ge = (_attributionColors = attributionColors) === null || _attributionColors === void 0 ? void 0 : _attributionColors.get(change.attributionKey)) !== null && _attributionColors$ge !== void 0 ? _attributionColors$ge : colorScheme : colorScheme;
+    const attributionKey = showContributorTags ? change.attributionKey : undefined;
     const isActive = isRangeActive(activeIndexPos, change.fromB, change.toB);
     decorations.push(...createInlineChangedDecoration({
+      attributionKey,
       change,
-      colorScheme,
+      colorScheme: changeColorScheme,
+      doc: tr.doc,
       diffType,
       isActive,
       isInserted: true,
-      reveal
+      reveal,
+      showContributorTags,
+      tagMountContext
     }));
   });
-  getAttrChangeRanges(tr.doc, attrStepContexts, originalDoc).forEach(change => {
+  getAttrChangeRanges(tr.doc, attrStepContexts, originalDoc).filter(({
+    fromB,
+    toB
+  }) => !fg('confluence_ncs_step_diffing_version_history') || !changes.some(change => change.fromB === fromB && change.toB === toB)).forEach(change => {
+    var _attributionColors$ge2, _attributionColors2;
+    const changeColorScheme = change.attributionKey ? (_attributionColors$ge2 = (_attributionColors2 = attributionColors) === null || _attributionColors2 === void 0 ? void 0 : _attributionColors2.get(change.attributionKey)) !== null && _attributionColors$ge2 !== void 0 ? _attributionColors$ge2 : colorScheme : colorScheme;
+    const attributionKey = showContributorTags ? change.attributionKey : undefined;
     if (change.isInline) {
       // Inline nodes (e.g. date, emoji, mention, status) need an inline decoration rather than a block decoration
       const isActive = isRangeActive(activeIndexPos, change.fromB, change.toB);
       decorations.push(...createInlineChangedDecoration({
+        attributionKey,
         change,
-        colorScheme,
+        colorScheme: changeColorScheme,
+        doc: tr.doc,
         isActive,
         isInserted: true,
         isAtomicInlineNode: true,
         inlineNodeName: change.inlineNodeName,
+        showContributorTags,
+        tagMountContext,
         // Suppress the border-bottom underline for atomic inline nodeviews —
         // it doesn't render on custom nodeview DOM elements and is unnecessary noise.
         hideAddedDiffsUnderline: true,
@@ -650,12 +672,15 @@ const calculateDiffDecorationsInner = ({
             deleted: []
           },
           doc: originalDoc,
+          attributionKey,
           nodeViewSerializer,
-          colorScheme,
+          colorScheme: changeColorScheme,
           newDoc: tr.doc,
           intl,
           activeIndexPos,
-          isInserted: false
+          isInserted: false,
+          showContributorTags,
+          tagMountContext
         }));
       }
     } else {
@@ -663,11 +688,14 @@ const calculateDiffDecorationsInner = ({
         doc: tr.doc,
         from: change.fromB,
         to: change.toB,
-        colorScheme,
+        attributionKey,
+        colorScheme: changeColorScheme,
         isInserted: true,
         activeIndexPos,
         intl,
-        showIndicators
+        showContributorTags,
+        showIndicators,
+        tagMountContext
       }));
       // If the original node position is known (e.g. a panel type change), also render
       // the old block node as a "deleted" widget so the reviewer sees the before/after.
@@ -684,7 +712,8 @@ const calculateDiffDecorationsInner = ({
           },
           doc: originalDoc,
           nodeViewSerializer,
-          colorScheme,
+          attributionKey,
+          colorScheme: changeColorScheme,
           newDoc: tr.doc,
           intl,
           activeIndexPos,
@@ -694,7 +723,9 @@ const calculateDiffDecorationsInner = ({
             hideAddedDiffsUnderline,
             placeBelow
           }),
-          showIndicators
+          showIndicators,
+          showContributorTags,
+          tagMountContext
         }));
       }
     }

package/dist/es2019/pm-plugins/decorations/utils/getAttrChangeRanges.js

@@ -49,6 +49,7 @@ export const getAttrChangeRanges = (doc, attrStepContexts, originalDoc) => {
   return attrStepContexts.map(attrStepContext => {
     const {
       afterNode,
+      attributionKey,
       beforeNode,
       finalPos,
       originalPos,
@@ -74,6 +75,9 @@ export const getAttrChangeRanges = (doc, attrStepContexts, originalDoc) => {
         const watchedAttrs = inlineNodeAttrMap[nodeName];
         if (attrsToCheck.some(v => watchedAttrs.includes(v))) {
           return {
+            ...(attributionKey ? {
+              attributionKey
+            } : {}),
             fromB: finalPos,
             toB: finalPos + nodeAtPos.nodeSize,
             isInline: true,
@@ -90,6 +94,9 @@ export const getAttrChangeRanges = (doc, attrStepContexts, originalDoc) => {
     // taskItem node: state attribute change — highlight the taskItem node
     if (attrsToCheck.some(v => taskItemAttrs.includes(v)) && (nodeAtPos === null || nodeAtPos === void 0 ? void 0 : nodeAtPos.type.name) === 'taskItem') {
       return {
+        ...(attributionKey ? {
+          attributionKey
+        } : {}),
         fromB: finalPos,
         toB: finalPos + nodeAtPos.nodeSize
       };
@@ -101,6 +108,9 @@ export const getAttrChangeRanges = (doc, attrStepContexts, originalDoc) => {
     // panel as a "deleted" widget for a before/after comparison.
     if (attrsToCheck.some(v => panelAttrs.includes(v)) && nodeAtPos && getBaseNodeTypeName(nodeAtPos.type) === 'panel') {
       return {
+        ...(attributionKey ? {
+          attributionKey
+        } : {}),
         fromB: finalPos,
         toB: finalPos + nodeAtPos.nodeSize,
         ...(originalPos !== undefined && originalNodeAtPos && {
@@ -118,6 +128,9 @@ export const getAttrChangeRanges = (doc, attrStepContexts, originalDoc) => {
       }
       const isInline = nodeAtPos.type.name === 'inlineExtension';
       return {
+        ...(attributionKey ? {
+          attributionKey
+        } : {}),
         fromB: finalPos,
         toB: finalPos + nodeAtPos.nodeSize,
         isInline
@@ -128,6 +141,9 @@ export const getAttrChangeRanges = (doc, attrStepContexts, originalDoc) => {
     if (attrsToCheck.some(v => mediaAttrs.includes(v)) && $pos.parent.type === doc.type.schema.nodes.mediaSingle) {
       const startPos = $pos.pos + $pos.parentOffset;
       return {
+        ...(attributionKey ? {
+          attributionKey
+        } : {}),
         fromB: startPos,
         toB: startPos + $pos.parent.nodeSize - 1
       };

package/dist/es2019/pm-plugins/decorations/utils/getMarkChangeRanges.js

@@ -1,4 +1,6 @@
 import { AddMarkStep, RemoveMarkStep } from '@atlaskit/editor-prosemirror/transform';
+import { getAttributionKey } from '../colorSchemes/attributions';
+import { mapStepRangeToFinal } from './mapStepRangeToFinal';
 const extractMarkStep = step => {
   if (step instanceof AddMarkStep) {
     return {
@@ -18,10 +20,10 @@ const extractMarkStep = step => {
   }
   return undefined;
 };
-export const getMarkChangeRanges = steps => {
+export const getMarkChangeRanges = (steps, stepAttributions = [], stepMaps = []) => {
   const resultRanges = [];
   let lastOp;
-  for (const step of steps) {
+  for (const [stepIndex, step] of steps.entries()) {
     const op = extractMarkStep(step);
     if (!op) {
       continue;
@@ -31,9 +33,15 @@ export const getMarkChangeRanges = steps => {
     if (lastOp && lastOp.from === op.from && lastOp.to === op.to && lastOp.markName === op.markName && lastOp.type !== op.type) {
       resultRanges.pop();
     } else {
+      const finalRange = mapStepRangeToFinal(op.from, op.to, stepIndex, stepMaps);
+      if (!finalRange) {
+        lastOp = op;
+        continue;
+      }
       resultRanges.push({
-        fromB: op.from,
-        toB: op.to
+        attributionKey: getAttributionKey(stepAttributions[stepIndex]),
+        fromB: finalRange.fromB,
+        toB: finalRange.toB
       });
     }
     lastOp = op;

package/dist/es2019/pm-plugins/decorations/utils/mapStepRangeToFinal.js

@@ -0,0 +1,28 @@
+import { Mapping } from '@atlaskit/editor-prosemirror/transform';
+// ProseMirror's assoc value chooses which side of an insertion a mapped boundary stays on.
+const FROM_ASSOC = -1;
+const TO_ASSOC = 1;
+
+/** Maps a step's range into final-document coordinates when the rollout path supplies step maps. */
+export const mapStepRangeToFinal = (from, to, stepIndex, stepMaps) => {
+  if (!stepMaps) {
+    return {
+      fromB: from,
+      toB: to
+    };
+  }
+
+  // The range is already in the document immediately after this step, so skip its own map and
+  // apply only the maps from subsequent steps.
+  const firstSubsequentStepIndex = stepIndex + 1;
+  const finalRange = new Mapping(stepMaps.slice(firstSubsequentStepIndex));
+  const fromB = finalRange.mapResult(from, FROM_ASSOC);
+  const toB = finalRange.mapResult(to, TO_ASSOC);
+  if (fromB.deleted && toB.deleted) {
+    return undefined;
+  }
+  return {
+    fromB: fromB.pos,
+    toB: toB.pos
+  };
+};

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

@@ -4,6 +4,7 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { Step as ProseMirrorStep } from '@atlaskit/editor-prosemirror/transform-override';
 import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { getActiveDiffAnnouncement } from '../ui/DiffNavigation/announceActiveDiff';
 import { calculateDiffDecorations } from './calculateDiff/calculateDiffDecorations';
 import { isDiffDecoration, isDiffDecorationSpec } from './decorations/decorationKeys';
 import { enforceCustomStepRegisters } from './enforceCustomStepRegisters';
@@ -285,6 +286,23 @@ export const createPlugin = (config, getIntl, api, onEditorView) => {
               api === null || api === void 0 ? void 0 : api.core.actions.execute(toggleExpandRange(activeDecoration.from, activeDecoration.to, true));
             }
             cancelPendingScrollToDecoration = scrollToDecoration(view, scrollableDecorations, pluginState.activeIndex);
+
+            // Stepping only scrolls — no focus moves and no content changes — so without this a
+            // screen-reader user gets silence. Announced through the live region rather than by
+            // focusing the change, since the "next change" control has to stay focused to be
+            // pressed again. After the scroll above, so the announcement never precedes it.
+            if (isExtendedEnabled(pluginState === null || pluginState === void 0 ? void 0 : pluginState.diffType)) {
+              const announcement = getActiveDiffAnnouncement({
+                activeIndex: pluginState.activeIndex,
+                contributorTags: pluginState.contributorTags,
+                decorations: scrollableDecorations,
+                intl: getIntl()
+              });
+              if (announcement) {
+                var _api$accessibilityUti;
+                api === null || api === void 0 ? void 0 : (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify(announcement);
+              }
+            }
           }
         },
         destroy() {

package/dist/es2019/ui/ContributorTag/buildContributorTagDom.js

@@ -124,6 +124,17 @@ const srLabelStyle = convertToInlineCss({
   userSelect: 'none',
   whiteSpace: 'nowrap'
 });
+
+/**
+ * Ids for the hidden label that the tag's `aria-labelledby` points at. Namespaced and random because
+ * the tag renders inside the document and shares the host page's id space — the same reason
+ * `VanillaTooltip` does it this way. The counter is a fallback for non-secure contexts, where
+ * `crypto.randomUUID` is unavailable.
+ */
+const generateLabelId = (() => {
+  let count = 0;
+  return () => typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function' ? `${CONTRIBUTOR_TAG_CLASS}-label-${crypto.randomUUID()}` : `${CONTRIBUTOR_TAG_CLASS}-label-${count += 1}`;
+})();
 const createSpan = (doc, style, attributes = {}) => {
   const span = doc.createElement('span');
   span.setAttribute('style', style);
@@ -139,21 +150,30 @@ const createSpan = (doc, style, attributes = {}) => {
  * would need a cast per reference below.
  */
 export const buildContributorTagDom = doc => {
+  const labelId = generateLabelId();
   const root = createSpan(doc, constraintStyle);
   const tag = createSpan(doc, tagStyle, {
     class: CONTRIBUTOR_TAG_CLASS,
     'data-testid': CONTRIBUTOR_TAG_TESTID,
-    // Deliberately no `aria-label`: it would be announced ahead of the element's contents, but
-    // design requires the contributor *after* the change — hence the visually hidden label.
+    // Named by the hidden label rather than `aria-label`, which would be a second copy of the same
+    // sentence. `role="note"` takes its name from the author, not its contents, so without this
+    // the tag is a focus stop with no accessible name.
+    'aria-labelledby': labelId,
     role: 'note',
-    // Focusable so keyboard and screen-reader users can reach the tag and its tooltip.
+    // Focusable so keyboard and screen-reader users can reach the tag and its tooltip. Its focus
+    // ring is drawn inward — see `contributorTagStyles` in editor-core.
     tabindex: '0'
   });
   const avatars = createSpan(doc, avatarsStyle);
+  // `aria-hidden`: the hidden label restates this name in a full sentence, so leaving it in the
+  // tree announced the contributor twice ("Priya Changed by Priya").
   const name = createSpan(doc, nameStyle, {
+    'aria-hidden': 'true',
     'data-testid': CONTRIBUTOR_TAG_NAME_TESTID
   });
-  const srLabel = createSpan(doc, srLabelStyle);
+  const srLabel = createSpan(doc, srLabelStyle, {
+    id: labelId
+  });
   tag.append(avatars, name, srLabel);
   root.appendChild(tag);
   return {

package/dist/es2019/ui/ContributorTag/contributorLabel.js

@@ -0,0 +1,49 @@
+import { contributorTagMessages } from './messages';
+const getContributorName = (contributor, formatMessage) => {
+  var _contributor$name, _contributor$agentKin;
+  const name = (_contributor$name = contributor.name) === null || _contributor$name === void 0 ? void 0 : _contributor$name.trim();
+  if (name) {
+    return name;
+  }
+
+  // `agentKind` defaults to `'external'` per the plugin type contract; an unidentified external
+  // agent falls back to a generic label rather than rendering a nameless tag.
+  if (contributor.kind === 'agent' && ((_contributor$agentKin = contributor.agentKind) !== null && _contributor$agentKin !== void 0 ? _contributor$agentKin : 'external') === 'external') {
+    return formatMessage(contributorTagMessages.externalAgentName);
+  }
+  return '';
+};
+
+/**
+ * Whether the label has to spell out that the contributor is an agent. A sighted user reads that off
+ * the `aria-hidden` avatar, so the label is the only other carrier.
+ *
+ * Excluded: a connected pair, which says it via `changedByConnected`, and an unnamed external agent,
+ * whose name `getContributorName` has already resolved to "External agent".
+ */
+const isUnaccompaniedNamedAgent = model => {
+  var _model$contributor$na;
+  return !model.connectedContributor && model.contributor.kind === 'agent' && Boolean((_model$contributor$na = model.contributor.name) === null || _model$contributor$na === void 0 ? void 0 : _model$contributor$na.trim());
+};
+/**
+ * The two strings a tag's model resolves to. Shared with `getActiveDiffAnnouncement`, so stepping
+ * onto a change says the same sentence as the tag pinned to it rather than a copy free to drift.
+ */
+export const formatContributorLabel = (model, formatMessage) => {
+  const isPrimaryAgent = model.contributor.kind === 'agent';
+  const primaryName = getContributorName(model.contributor, formatMessage);
+  const secondaryName = model.connectedContributor ? getContributorName(model.connectedContributor, formatMessage) : '';
+  const agentName = isPrimaryAgent ? primaryName : secondaryName;
+  const userName = isPrimaryAgent ? secondaryName : primaryName;
+  return {
+    fullLabel: model.connectedContributor ? formatMessage(contributorTagMessages.changedByConnected, {
+      agentName,
+      userName
+    }) : formatMessage(isUnaccompaniedNamedAgent(model) ? contributorTagMessages.changedByAgent : contributorTagMessages.changedBy, {
+      name: primaryName
+    }),
+    // A connected pair only ever shows the agent; the pair is spelled out in `fullLabel`, because
+    // the tag is capped at `MAX_TAG_WIDTH` and two names rarely fit inside it.
+    visibleName: model.connectedContributor ? agentName || primaryName : primaryName
+  };
+};