@atlaskit/editor-plugin-show-diff 24.0.0 → 24.0.1

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-show-diff
 
+## 24.0.1
+
+### Patch Changes
+
+- [`37fc21aa0e358`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/37fc21aa0e358) -
+  Show contributor tags for layout changes in version history when
+  `confluence_ncs_step_diffing_version_history` is enabled
+- Updated dependencies
+
 ## 24.0.0
 
 ### Patch Changes

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

@@ -9,6 +9,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _view = require("@atlaskit/editor-prosemirror/view");
 var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _contributorTagController = require("../../ui/ContributorTag/contributorTagController");
+var _baseNodeName = require("../utils/baseNodeName");
 var _charsByOffset = require("../utils/charsByOffset");
 var _createAnchorDecorationWidgets = require("./createAnchorDecorationWidgets");
 var _decorationKeys = require("./decorationKeys");
@@ -219,6 +220,16 @@ var resolveHoistedCodeBlockAnchor = exports.resolveHoistedCodeBlockAnchor = func
   };
 };
 
+/** Find the position before a layout for a tag anchored to one of its columns. */
+var resolveLayoutSectionStart = function resolveLayoutSectionStart(doc, pos) {
+  var _doc$nodeAt$type$name, _doc$nodeAt;
+  if ((0, _baseNodeName.resolveBaseNodeName)((_doc$nodeAt$type$name = (_doc$nodeAt = doc.nodeAt(pos)) === null || _doc$nodeAt === void 0 ? void 0 : _doc$nodeAt.type.name) !== null && _doc$nodeAt$type$name !== void 0 ? _doc$nodeAt$type$name : '') !== 'layoutColumn') {
+    return undefined;
+  }
+  var $pos = doc.resolve(pos);
+  return (0, _baseNodeName.resolveBaseNodeName)($pos.parent.type.name) === 'layoutSection' ? $pos.before($pos.depth) : undefined;
+};
+
 /**
  * The contributor tag widget for one diff range, placed on the first visible character the range
  * highlights — or, with `anchorAtRangeStart`, at `from` itself. A host inside a code block is
@@ -231,7 +242,7 @@ var resolveHoistedCodeBlockAnchor = exports.resolveHoistedCodeBlockAnchor = func
  * element ProseMirror drew it into — see `mountContributorTag`.
  */
 var createContributorTagWidget = exports.createContributorTagWidget = function createContributorTagWidget(_ref4) {
-  var _hoisted$codeBlockSta, _ref5, _hoisted$anchorName;
+  var _ref5, _hoisted$anchorName, _hoisted$codeBlockSta;
   var _ref4$anchorAtRangeSt = _ref4.anchorAtRangeStart,
     anchorAtRangeStart = _ref4$anchorAtRangeSt === void 0 ? false : _ref4$anchorAtRangeSt,
     anchorName = _ref4.anchorName,
@@ -251,8 +262,6 @@ var createContributorTagWidget = exports.createContributorTagWidget = function c
   // A change inside a code block is hoisted out of it, anchored to its own marker; anything else
   // keeps its own anchor.
   var hoisted = resolveHoistedCodeBlockAnchor(doc, anchorPos, diffId);
-  // Keep the host out of the table row's grid (EDITOR-8442).
-  var hostPos = (0, _createAnchorDecorationWidgets.clampAnchorPosIntoCell)(doc, (_hoisted$codeBlockSta = hoisted === null || hoisted === void 0 ? void 0 : hoisted.codeBlockStart) !== null && _hoisted$codeBlockSta !== void 0 ? _hoisted$codeBlockSta : anchorPos, 1);
 
   // Inline diffs pass no anchorName. Give them their own point anchor instead of the
   // `position: relative` fallback, which drifts left once the range wraps a line (EDITOR-9286).
@@ -262,6 +271,10 @@ var createContributorTagWidget = exports.createContributorTagWidget = function c
   });
   var effectiveAnchorName = (_ref5 = (_hoisted$anchorName = hoisted === null || hoisted === void 0 ? void 0 : hoisted.anchorName) !== null && _hoisted$anchorName !== void 0 ? _hoisted$anchorName : anchorName) !== null && _ref5 !== void 0 ? _ref5 : ownAnchorName;
   var tagAnchorName = effectiveAnchorName && supportsAnchorPositioning() ? effectiveAnchorName : undefined;
+  var layoutSectionStart = tagAnchorName ? resolveLayoutSectionStart(doc, anchorPos) : undefined;
+  // Keep the host out of the table row's grid (EDITOR-8442). Layout-column tags are hoisted before
+  // their layout so the advanced layout widget-flattening rule cannot put them behind nearby text.
+  var hostPos = layoutSectionStart !== null && layoutSectionStart !== void 0 ? layoutSectionStart : (0, _createAnchorDecorationWidgets.clampAnchorPosIntoCell)(doc, (_hoisted$codeBlockSta = hoisted === null || hoisted === void 0 ? void 0 : hoisted.codeBlockStart) !== null && _hoisted$codeBlockSta !== void 0 ? _hoisted$codeBlockSta : anchorPos, 1);
   var decorations = [];
   if (hoisted) {
     decorations.push(hoisted.marker);

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

@@ -8,6 +8,7 @@ exports.createNodeChangedDecorationWidget = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _view = require("@atlaskit/editor-prosemirror/view");
 var _fg = require("@atlaskit/platform-feature-flags/fg");
+var _baseNodeName = require("../utils/baseNodeName");
 var _emptyTextBlocks = require("../utils/emptyTextBlocks");
 var _isEmptyParagraphSlice = require("../utils/isEmptyParagraphSlice");
 var _createAnchorDecorationWidgets = require("./createAnchorDecorationWidgets");
@@ -124,7 +125,7 @@ var createTableCellContentWidgets = function createTableCellContentWidgets(_ref)
  * that is not in the current document.
  */
 var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidget = function createNodeChangedDecorationWidget(_ref2) {
-  var _$safeInsertPos$nodeB, _slice$content$firstC, _newDoc$firstChild, _slice$content$firstC2;
+  var _$safeInsertPos$nodeB, _slice$content$firstC, _newDoc$firstChild, _hoistedCodeBlockAnch, _slice$content$firstC2;
   var attributionKey = _ref2.attributionKey,
     change = _ref2.change,
     doc = _ref2.doc,
@@ -280,6 +281,7 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
   // Match the rendering predicate above: an empty paragraph has no widget to tag, while whitespace
   // text in a rendered widget remains eligible.
   var canTagWidget = showContributorTags && !shouldSkipDeletedEmptyParagraphDecoration;
+  var contributorTagAnchorName;
   var decorations = [];
   var replacementNode = newDoc.nodeAt(change.fromB);
   var firstReplacedNode = slice.content.firstChild;
@@ -380,6 +382,14 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
     var $sourcePos = (0, _fg.fg)('platform_editor_ai_show_diff_patch_2') ? getSourcePos(doc, $changeFromA, slice.openStart, index) : null;
     var nodeView = serializer.tryCreateNodeView(node, 0, $sourcePos !== null && $sourcePos !== void 0 ? $sourcePos : undefined, isInserted, colorScheme);
     if (nodeView) {
+      if (canTagWidget && contributorTagAnchorName === undefined && (0, _baseNodeName.resolveBaseNodeName)(node.type.name) === 'layoutColumn' && nodeView instanceof HTMLElement && (0, _fg.fg)('confluence_ncs_step_diffing_version_history')) {
+        // The deleted column is rendered inside this widget; anchor to its box.
+        contributorTagAnchorName = (0, _decorationKeys.buildAnchorDecorationKey)({
+          diffId: diffId,
+          anchorType: _decorationKeys.AnchorTypeKey.tag
+        });
+        nodeView.style.setProperty('anchor-name', "--".concat(contributorTagAnchorName));
+      }
       if (node.isInline) {
         var wrapper = (0, _wrapBlockNodeView.createContentWrapper)(colorScheme, isActive, isInserted, reveal);
         wrapper.append(nodeView);
@@ -427,7 +437,7 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
   if (hoistedCodeBlockAnchor) {
     decorations.push(hoistedCodeBlockAnchor.marker);
   }
-  var contributorTagAnchorName = hoistedCodeBlockAnchor === null || hoistedCodeBlockAnchor === void 0 ? void 0 : hoistedCodeBlockAnchor.anchorName;
+  contributorTagAnchorName = (_hoistedCodeBlockAnch = hoistedCodeBlockAnchor === null || hoistedCodeBlockAnchor === void 0 ? void 0 : hoistedCodeBlockAnchor.anchorName) !== null && _hoistedCodeBlockAnch !== void 0 ? _hoistedCodeBlockAnch : contributorTagAnchorName;
   if (!isInserted && deletedColumns !== null && deletedColumns !== void 0 && deletedColumns.length) {
     var table = dom.querySelector('table');
     var firstRow = table === null || table === void 0 ? void 0 : table.rows[0];

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

@@ -6,10 +6,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.extractContributorTags = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _toArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toArray"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _fg = require("@atlaskit/platform-feature-flags/fg");
+var _baseNodeName = require("../utils/baseNodeName");
 var _decorationKeys = require("./decorationKeys");
 var _excluded = ["connectedToKey"];
 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; }
@@ -75,12 +75,27 @@ var byLeadingPosition = function byLeadingPosition(a, b) {
   return a.decoration.from - b.decoration.from || ((_a$decoration$spec$si = a.decoration.spec.side) !== null && _a$decoration$spec$si !== void 0 ? _a$decoration$spec$si : 0) - ((_b$decoration$spec$si = b.decoration.spec.side) !== null && _b$decoration$spec$si !== void 0 ? _b$decoration$spec$si : 0) || a.decoration.to - a.decoration.from - (b.decoration.to - b.decoration.from);
 };
 
-/** The targets a navigation range wholly covers, leader first. */
-var containedBy = function containedBy(targets, _ref2) {
-  var from = _ref2.from,
-    to = _ref2.to;
-  return targets.filter(function (_ref3) {
+/** Select the first layout column only when the inline layout range starts immediately before it. */
+var navigationLeader = function navigationLeader(members) {
+  var ordered = (0, _toConsumableArray2.default)(members).sort(byLeadingPosition);
+  var layoutColumn = (0, _fg.fg)('confluence_ncs_step_diffing_version_history') ? ordered.find(function (_ref2) {
+    var _decoration$spec$node;
+    var decoration = _ref2.decoration;
+    return decoration.spec.decorationType === 'block' && (0, _baseNodeName.resolveBaseNodeName)((_decoration$spec$node = decoration.spec.nodeName) !== null && _decoration$spec$node !== void 0 ? _decoration$spec$node : '') === 'layoutColumn';
+  }) : undefined;
+  var startsWholeLayout = layoutColumn !== undefined && members.some(function (_ref3) {
     var decoration = _ref3.decoration;
+    return decoration.spec.decorationType === 'inline' && decoration.from === layoutColumn.decoration.from - 1;
+  });
+  return startsWholeLayout ? layoutColumn : ordered[0];
+};
+
+/** The targets a navigation range wholly covers, leader first. */
+var containedBy = function containedBy(targets, _ref4) {
+  var from = _ref4.from,
+    to = _ref4.to;
+  return targets.filter(function (_ref5) {
+    var decoration = _ref5.decoration;
     return from <= decoration.from && decoration.to <= to;
   }).sort(byLeadingPosition);
 };
@@ -154,16 +169,16 @@ var extractContributorTags = exports.extractContributorTags = function extractCo
   } finally {
     _iterator.f();
   }
-  var inlineTargets = targets.filter(function (_ref4) {
-    var decoration = _ref4.decoration;
+  var inlineTargets = targets.filter(function (_ref6) {
+    var decoration = _ref6.decoration;
     return decoration.spec.decorationType === 'inline';
   });
-  var blockTargets = targets.filter(function (_ref5) {
-    var decoration = _ref5.decoration;
+  var blockTargets = targets.filter(function (_ref7) {
+    var decoration = _ref7.decoration;
     return decoration.spec.decorationType === 'block';
   });
-  var widgetTargets = targets.filter(function (_ref6) {
-    var decoration = _ref6.decoration;
+  var widgetTargets = targets.filter(function (_ref8) {
+    var decoration = _ref8.decoration;
     return decoration.spec.decorationType === 'widget';
   });
   var linkedDiffIds = new Map();
@@ -191,8 +206,8 @@ var extractContributorTags = exports.extractContributorTags = function extractCo
       }
 
       // A block outranks both other kinds, so it is tried first.
-      var block = blockTargets.find(function (_ref7) {
-        var decoration = _ref7.decoration;
+      var block = blockTargets.find(function (_ref9) {
+        var decoration = _ref9.decoration;
         return isSameBlockChange(target.decoration, decoration);
       });
       if (block) {
@@ -201,8 +216,8 @@ var extractContributorTags = exports.extractContributorTags = function extractCo
       }
       if (decorationType === 'inline') {
         // The deleted half renders in front of this one, so that half captions the change.
-        var leadingWidget = widgetTargets.find(function (_ref8) {
-          var decoration = _ref8.decoration;
+        var leadingWidget = widgetTargets.find(function (_ref0) {
+          var decoration = _ref0.decoration;
           return leadsReplacement(decoration) && isSameChange(decoration, target.decoration);
         });
         if (leadingWidget) {
@@ -215,8 +230,8 @@ var extractContributorTags = exports.extractContributorTags = function extractCo
       if (leadsReplacement(target.decoration)) {
         return 0; // continue
       }
-      var host = inlineTargets.find(function (_ref9) {
-        var decoration = _ref9.decoration;
+      var host = inlineTargets.find(function (_ref1) {
+        var decoration = _ref1.decoration;
         return isSameChange(target.decoration, decoration);
       });
       if (host) {
@@ -320,10 +335,10 @@ var extractContributorTags = exports.extractContributorTags = function extractCo
     try {
       var _loop2 = function _loop2() {
         var members = _step6.value;
-        var _sort = (0, _toConsumableArray2.default)(members).sort(byLeadingPosition),
-          _sort2 = (0, _toArray2.default)(_sort),
-          leader = _sort2[0],
-          trailing = _arrayLikeToArray(_sort2).slice(1);
+        var leader = navigationLeader(members);
+        var trailing = members.filter(function (target) {
+          return target !== leader;
+        });
         trailing.forEach(function (target) {
           return fold(leader, target);
         });

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

@@ -12,6 +12,7 @@ var _nodeTypeUtils = require("@atlaskit/editor-common/utils/node-type-utils");
 var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
 var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
+var _baseNodeName = require("../../utils/baseNodeName");
 var _createInlineChangedDecoration = require("../createInlineChangedDecoration");
 var _revealStyles = require("../revealStyles");
 var _getAttrChangeRanges = require("./getAttrChangeRanges");
@@ -353,6 +354,15 @@ var createBlockNodeContentWrapper = function createBlockNodeContentWrapper(_ref9
   // should not also get the inline content style (borderBottom underline) on their container.
   var shouldSkipContentStyle = isInserted && nodeStyle !== undefined;
   var contentStyle = shouldSkipContentStyle ? '' : (0, _wrapBlockNodeViewStyles.getChangedContentStyle)(colorScheme, isActive, isInserted, hideAddedDiffsUnderline);
+  var isEmptyDeletedLayoutColumn = !isInserted && (0, _baseNodeName.resolveBaseNodeName)(targetNode.type.name) === 'layoutColumn' && targetNode.textContent.length === 0 && (0, _fg.fg)('confluence_ncs_step_diffing_version_history');
+  if (isEmptyDeletedLayoutColumn && nodeView instanceof HTMLElement) {
+    var _nodeView$querySelect;
+    // Give an empty deleted column height so its diff box doesn't collapse
+    var placeholderTarget = (_nodeView$querySelect = nodeView.querySelector('[data-layout-content]')) !== null && _nodeView$querySelect !== void 0 ? _nodeView$querySelect : nodeView;
+    appendStyleToElement(placeholderTarget, (0, _lazyNodeView.convertToInlineCss)({
+      minHeight: "var(--ds-space-300, 24px)"
+    }));
+  }
 
   // A `breakout` node renders wider than the editor column while the wrapper divs
   // stay at column width, so paint the outline on the node element that spans that width.

package/dist/cjs/pm-plugins/utils/taggableBlockNodes.js

@@ -15,7 +15,7 @@ var _baseNodeName = require("./baseNodeName");
  *
  * Base names only — match with the predicates below, never against `type.name` directly.
  */
-var TAGGABLE_BLOCK_NODES = new Set(['blockCard', 'blockquote', 'bodiedExtension', 'codeBlock', 'decisionList', 'embedCard', 'expand', 'extension', 'media', 'multiBodiedExtension', 'panel', 'rule', 'taskList']);
+var TAGGABLE_BLOCK_NODES = new Set(['blockCard', 'blockquote', 'bodiedExtension', 'codeBlock', 'decisionList', 'embedCard', 'expand', 'extension', 'layoutColumn', 'media', 'multiBodiedExtension', 'panel', 'rule', 'taskList']);
 
 /**
  * Whether this node hosts a contributor tag of its own. Navigation grouping does not consult this:

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

@@ -1,6 +1,7 @@
 import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { ContributorTagController } from '../../ui/ContributorTag/contributorTagController';
+import { resolveBaseNodeName } from '../utils/baseNodeName';
 import { buildCharsByOffset, isWhitespaceChar } from '../utils/charsByOffset';
 import { clampAnchorPosIntoCell, createAnchorNameSpan } from './createAnchorDecorationWidgets';
 import { AnchorTypeKey, buildAnchorDecorationKey, buildAnchorDecorationSpec, buildContributorTagDecorationSpec } from './decorationKeys';
@@ -207,6 +208,16 @@ export const resolveHoistedCodeBlockAnchor = (doc, pos, diffId) => {
   };
 };
 
+/** Find the position before a layout for a tag anchored to one of its columns. */
+const resolveLayoutSectionStart = (doc, pos) => {
+  var _doc$nodeAt$type$name, _doc$nodeAt;
+  if (resolveBaseNodeName((_doc$nodeAt$type$name = (_doc$nodeAt = doc.nodeAt(pos)) === null || _doc$nodeAt === void 0 ? void 0 : _doc$nodeAt.type.name) !== null && _doc$nodeAt$type$name !== void 0 ? _doc$nodeAt$type$name : '') !== 'layoutColumn') {
+    return undefined;
+  }
+  const $pos = doc.resolve(pos);
+  return resolveBaseNodeName($pos.parent.type.name) === 'layoutSection' ? $pos.before($pos.depth) : undefined;
+};
+
 /**
  * The contributor tag widget for one diff range, placed on the first visible character the range
  * highlights — or, with `anchorAtRangeStart`, at `from` itself. A host inside a code block is
@@ -227,7 +238,7 @@ export const createContributorTagWidget = ({
   diffId,
   mountContext
 }) => {
-  var _hoisted$codeBlockSta, _ref2, _hoisted$anchorName;
+  var _ref2, _hoisted$anchorName, _hoisted$codeBlockSta;
   if (!isContributorTagWidgetEnabled()) {
     return undefined;
   }
@@ -239,8 +250,6 @@ export const createContributorTagWidget = ({
   // A change inside a code block is hoisted out of it, anchored to its own marker; anything else
   // keeps its own anchor.
   const hoisted = resolveHoistedCodeBlockAnchor(doc, anchorPos, diffId);
-  // Keep the host out of the table row's grid (EDITOR-8442).
-  const hostPos = clampAnchorPosIntoCell(doc, (_hoisted$codeBlockSta = hoisted === null || hoisted === void 0 ? void 0 : hoisted.codeBlockStart) !== null && _hoisted$codeBlockSta !== void 0 ? _hoisted$codeBlockSta : anchorPos, 1);
 
   // Inline diffs pass no anchorName. Give them their own point anchor instead of the
   // `position: relative` fallback, which drifts left once the range wraps a line (EDITOR-9286).
@@ -250,6 +259,10 @@ export const createContributorTagWidget = ({
   });
   const effectiveAnchorName = (_ref2 = (_hoisted$anchorName = hoisted === null || hoisted === void 0 ? void 0 : hoisted.anchorName) !== null && _hoisted$anchorName !== void 0 ? _hoisted$anchorName : anchorName) !== null && _ref2 !== void 0 ? _ref2 : ownAnchorName;
   const tagAnchorName = effectiveAnchorName && supportsAnchorPositioning() ? effectiveAnchorName : undefined;
+  const layoutSectionStart = tagAnchorName ? resolveLayoutSectionStart(doc, anchorPos) : undefined;
+  // Keep the host out of the table row's grid (EDITOR-8442). Layout-column tags are hoisted before
+  // their layout so the advanced layout widget-flattening rule cannot put them behind nearby text.
+  const hostPos = layoutSectionStart !== null && layoutSectionStart !== void 0 ? layoutSectionStart : clampAnchorPosIntoCell(doc, (_hoisted$codeBlockSta = hoisted === null || hoisted === void 0 ? void 0 : hoisted.codeBlockStart) !== null && _hoisted$codeBlockSta !== void 0 ? _hoisted$codeBlockSta : anchorPos, 1);
   const decorations = [];
   if (hoisted) {
     decorations.push(hoisted.marker);

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

@@ -1,5 +1,6 @@
 import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
+import { resolveBaseNodeName } from '../utils/baseNodeName';
 import { countEmptyTextBlockOnlySlice } from '../utils/emptyTextBlocks';
 import { isEmptyParagraphSlice } from '../utils/isEmptyParagraphSlice';
 import { clampAnchorPosIntoCell, createAnchorNameSpan, createLeftAnchorWidget } from './createAnchorDecorationWidgets';
@@ -138,7 +139,7 @@ export const createNodeChangedDecorationWidget = ({
   tagMountContext,
   deletedColumns
 }) => {
-  var _$safeInsertPos$nodeB, _slice$content$firstC, _newDoc$firstChild, _slice$content$firstC2;
+  var _$safeInsertPos$nodeB, _slice$content$firstC, _newDoc$firstChild, _hoistedCodeBlockAnch, _slice$content$firstC2;
   const slice = doc.slice(change.fromA, change.toA);
   const shouldSkipDeletedEmptyParagraphDecoration = !isInserted && isEmptyParagraphSlice(slice);
   // How many blank lines the deletion took, when it took nothing else. Blank means an empty
@@ -272,6 +273,7 @@ export const createNodeChangedDecorationWidget = ({
   // Match the rendering predicate above: an empty paragraph has no widget to tag, while whitespace
   // text in a rendered widget remains eligible.
   const canTagWidget = showContributorTags && !shouldSkipDeletedEmptyParagraphDecoration;
+  let contributorTagAnchorName;
   const decorations = [];
   const replacementNode = newDoc.nodeAt(change.fromB);
   const firstReplacedNode = slice.content.firstChild;
@@ -366,6 +368,14 @@ export const createNodeChangedDecorationWidget = ({
     const $sourcePos = fg('platform_editor_ai_show_diff_patch_2') ? getSourcePos(doc, $changeFromA, slice.openStart, index) : null;
     const nodeView = serializer.tryCreateNodeView(node, 0, $sourcePos !== null && $sourcePos !== void 0 ? $sourcePos : undefined, isInserted, colorScheme);
     if (nodeView) {
+      if (canTagWidget && contributorTagAnchorName === undefined && resolveBaseNodeName(node.type.name) === 'layoutColumn' && nodeView instanceof HTMLElement && fg('confluence_ncs_step_diffing_version_history')) {
+        // The deleted column is rendered inside this widget; anchor to its box.
+        contributorTagAnchorName = buildAnchorDecorationKey({
+          diffId,
+          anchorType: AnchorTypeKey.tag
+        });
+        nodeView.style.setProperty('anchor-name', `--${contributorTagAnchorName}`);
+      }
       if (node.isInline) {
         const wrapper = createContentWrapper(colorScheme, isActive, isInserted, reveal);
         wrapper.append(nodeView);
@@ -413,7 +423,7 @@ export const createNodeChangedDecorationWidget = ({
   if (hoistedCodeBlockAnchor) {
     decorations.push(hoistedCodeBlockAnchor.marker);
   }
-  let contributorTagAnchorName = hoistedCodeBlockAnchor === null || hoistedCodeBlockAnchor === void 0 ? void 0 : hoistedCodeBlockAnchor.anchorName;
+  contributorTagAnchorName = (_hoistedCodeBlockAnch = hoistedCodeBlockAnchor === null || hoistedCodeBlockAnchor === void 0 ? void 0 : hoistedCodeBlockAnchor.anchorName) !== null && _hoistedCodeBlockAnch !== void 0 ? _hoistedCodeBlockAnch : contributorTagAnchorName;
   if (!isInserted && deletedColumns !== null && deletedColumns !== void 0 && deletedColumns.length) {
     const table = dom.querySelector('table');
     const firstRow = table === null || table === void 0 ? void 0 : table.rows[0];

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

@@ -1,4 +1,5 @@
 import { fg } from '@atlaskit/platform-feature-flags/fg';
+import { resolveBaseNodeName } from '../utils/baseNodeName';
 import { isDiffDecoration, isDiffDecorationSpec } from './decorationKeys';
 
 /**
@@ -50,6 +51,21 @@ const byLeadingPosition = (a, b) => {
   return a.decoration.from - b.decoration.from || ((_a$decoration$spec$si = a.decoration.spec.side) !== null && _a$decoration$spec$si !== void 0 ? _a$decoration$spec$si : 0) - ((_b$decoration$spec$si = b.decoration.spec.side) !== null && _b$decoration$spec$si !== void 0 ? _b$decoration$spec$si : 0) || a.decoration.to - a.decoration.from - (b.decoration.to - b.decoration.from);
 };
 
+/** Select the first layout column only when the inline layout range starts immediately before it. */
+const navigationLeader = members => {
+  const ordered = [...members].sort(byLeadingPosition);
+  const layoutColumn = fg('confluence_ncs_step_diffing_version_history') ? ordered.find(({
+    decoration
+  }) => {
+    var _decoration$spec$node;
+    return decoration.spec.decorationType === 'block' && resolveBaseNodeName((_decoration$spec$node = decoration.spec.nodeName) !== null && _decoration$spec$node !== void 0 ? _decoration$spec$node : '') === 'layoutColumn';
+  }) : undefined;
+  const startsWholeLayout = layoutColumn !== undefined && members.some(({
+    decoration
+  }) => decoration.spec.decorationType === 'inline' && decoration.from === layoutColumn.decoration.from - 1);
+  return startsWholeLayout ? layoutColumn : ordered[0];
+};
+
 /** The targets a navigation range wholly covers, leader first. */
 const containedBy = (targets, {
   from,
@@ -224,7 +240,8 @@ export const extractContributorTags = (decorations, contributors, activeIndexPos
       byStopAndContributor.set(key, [...((_byStopAndContributor = byStopAndContributor.get(key)) !== null && _byStopAndContributor !== void 0 ? _byStopAndContributor : []), target]);
     }
     for (const members of byStopAndContributor.values()) {
-      const [leader, ...trailing] = [...members].sort(byLeadingPosition);
+      const leader = navigationLeader(members);
+      const trailing = members.filter(target => target !== leader);
       trailing.forEach(target => fold(leader, target));
     }
   }

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

@@ -4,6 +4,7 @@ import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-uti
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { resolveBaseNodeName } from '../../utils/baseNodeName';
 import { getAtomicInlineChangedAttrs } from '../createInlineChangedDecoration';
 import { applyRevealToElement } from '../revealStyles';
 import { isInlineAttrChangeNodeName } from './getAttrChangeRanges';
@@ -341,6 +342,15 @@ const createBlockNodeContentWrapper = ({
   // should not also get the inline content style (borderBottom underline) on their container.
   const shouldSkipContentStyle = isInserted && nodeStyle !== undefined;
   const contentStyle = shouldSkipContentStyle ? '' : getChangedContentStyle(colorScheme, isActive, isInserted, hideAddedDiffsUnderline);
+  const isEmptyDeletedLayoutColumn = !isInserted && resolveBaseNodeName(targetNode.type.name) === 'layoutColumn' && targetNode.textContent.length === 0 && fg('confluence_ncs_step_diffing_version_history');
+  if (isEmptyDeletedLayoutColumn && nodeView instanceof HTMLElement) {
+    var _nodeView$querySelect;
+    // Give an empty deleted column height so its diff box doesn't collapse
+    const placeholderTarget = (_nodeView$querySelect = nodeView.querySelector('[data-layout-content]')) !== null && _nodeView$querySelect !== void 0 ? _nodeView$querySelect : nodeView;
+    appendStyleToElement(placeholderTarget, convertToInlineCss({
+      minHeight: "var(--ds-space-300, 24px)"
+    }));
+  }
 
   // A `breakout` node renders wider than the editor column while the wrapper divs
   // stay at column width, so paint the outline on the node element that spans that width.

package/dist/es2019/pm-plugins/utils/taggableBlockNodes.js

@@ -10,7 +10,7 @@ import { resolveBaseNodeName } from './baseNodeName';
  *
  * Base names only — match with the predicates below, never against `type.name` directly.
  */
-const TAGGABLE_BLOCK_NODES = new Set(['blockCard', 'blockquote', 'bodiedExtension', 'codeBlock', 'decisionList', 'embedCard', 'expand', 'extension', 'media', 'multiBodiedExtension', 'panel', 'rule', 'taskList']);
+const TAGGABLE_BLOCK_NODES = new Set(['blockCard', 'blockquote', 'bodiedExtension', 'codeBlock', 'decisionList', 'embedCard', 'expand', 'extension', 'layoutColumn', 'media', 'multiBodiedExtension', 'panel', 'rule', 'taskList']);
 
 /**
  * Whether this node hosts a contributor tag of its own. Navigation grouping does not consult this:

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

@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { ContributorTagController } from '../../ui/ContributorTag/contributorTagController';
+import { resolveBaseNodeName } from '../utils/baseNodeName';
 import { buildCharsByOffset, isWhitespaceChar } from '../utils/charsByOffset';
 import { clampAnchorPosIntoCell, createAnchorNameSpan } from './createAnchorDecorationWidgets';
 import { AnchorTypeKey, buildAnchorDecorationKey, buildAnchorDecorationSpec, buildContributorTagDecorationSpec } from './decorationKeys';
@@ -213,6 +214,16 @@ export var resolveHoistedCodeBlockAnchor = function resolveHoistedCodeBlockAncho
   };
 };
 
+/** Find the position before a layout for a tag anchored to one of its columns. */
+var resolveLayoutSectionStart = function resolveLayoutSectionStart(doc, pos) {
+  var _doc$nodeAt$type$name, _doc$nodeAt;
+  if (resolveBaseNodeName((_doc$nodeAt$type$name = (_doc$nodeAt = doc.nodeAt(pos)) === null || _doc$nodeAt === void 0 ? void 0 : _doc$nodeAt.type.name) !== null && _doc$nodeAt$type$name !== void 0 ? _doc$nodeAt$type$name : '') !== 'layoutColumn') {
+    return undefined;
+  }
+  var $pos = doc.resolve(pos);
+  return resolveBaseNodeName($pos.parent.type.name) === 'layoutSection' ? $pos.before($pos.depth) : undefined;
+};
+
 /**
  * The contributor tag widget for one diff range, placed on the first visible character the range
  * highlights — or, with `anchorAtRangeStart`, at `from` itself. A host inside a code block is
@@ -225,7 +236,7 @@ export var resolveHoistedCodeBlockAnchor = function resolveHoistedCodeBlockAncho
  * element ProseMirror drew it into — see `mountContributorTag`.
  */
 export var createContributorTagWidget = function createContributorTagWidget(_ref4) {
-  var _hoisted$codeBlockSta, _ref5, _hoisted$anchorName;
+  var _ref5, _hoisted$anchorName, _hoisted$codeBlockSta;
   var _ref4$anchorAtRangeSt = _ref4.anchorAtRangeStart,
     anchorAtRangeStart = _ref4$anchorAtRangeSt === void 0 ? false : _ref4$anchorAtRangeSt,
     anchorName = _ref4.anchorName,
@@ -245,8 +256,6 @@ export var createContributorTagWidget = function createContributorTagWidget(_ref
   // A change inside a code block is hoisted out of it, anchored to its own marker; anything else
   // keeps its own anchor.
   var hoisted = resolveHoistedCodeBlockAnchor(doc, anchorPos, diffId);
-  // Keep the host out of the table row's grid (EDITOR-8442).
-  var hostPos = clampAnchorPosIntoCell(doc, (_hoisted$codeBlockSta = hoisted === null || hoisted === void 0 ? void 0 : hoisted.codeBlockStart) !== null && _hoisted$codeBlockSta !== void 0 ? _hoisted$codeBlockSta : anchorPos, 1);
 
   // Inline diffs pass no anchorName. Give them their own point anchor instead of the
   // `position: relative` fallback, which drifts left once the range wraps a line (EDITOR-9286).
@@ -256,6 +265,10 @@ export var createContributorTagWidget = function createContributorTagWidget(_ref
   });
   var effectiveAnchorName = (_ref5 = (_hoisted$anchorName = hoisted === null || hoisted === void 0 ? void 0 : hoisted.anchorName) !== null && _hoisted$anchorName !== void 0 ? _hoisted$anchorName : anchorName) !== null && _ref5 !== void 0 ? _ref5 : ownAnchorName;
   var tagAnchorName = effectiveAnchorName && supportsAnchorPositioning() ? effectiveAnchorName : undefined;
+  var layoutSectionStart = tagAnchorName ? resolveLayoutSectionStart(doc, anchorPos) : undefined;
+  // Keep the host out of the table row's grid (EDITOR-8442). Layout-column tags are hoisted before
+  // their layout so the advanced layout widget-flattening rule cannot put them behind nearby text.
+  var hostPos = layoutSectionStart !== null && layoutSectionStart !== void 0 ? layoutSectionStart : clampAnchorPosIntoCell(doc, (_hoisted$codeBlockSta = hoisted === null || hoisted === void 0 ? void 0 : hoisted.codeBlockStart) !== null && _hoisted$codeBlockSta !== void 0 ? _hoisted$codeBlockSta : anchorPos, 1);
   var decorations = [];
   if (hoisted) {
     decorations.push(hoisted.marker);

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

@@ -3,6 +3,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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) { _defineProperty(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; }
 import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
+import { resolveBaseNodeName } from '../utils/baseNodeName';
 import { countEmptyTextBlockOnlySlice } from '../utils/emptyTextBlocks';
 import { isEmptyParagraphSlice } from '../utils/isEmptyParagraphSlice';
 import { clampAnchorPosIntoCell, createAnchorNameSpan, createLeftAnchorWidget } from './createAnchorDecorationWidgets';
@@ -118,7 +119,7 @@ var createTableCellContentWidgets = function createTableCellContentWidgets(_ref)
  * that is not in the current document.
  */
 export var createNodeChangedDecorationWidget = function createNodeChangedDecorationWidget(_ref2) {
-  var _$safeInsertPos$nodeB, _slice$content$firstC, _newDoc$firstChild, _slice$content$firstC2;
+  var _$safeInsertPos$nodeB, _slice$content$firstC, _newDoc$firstChild, _hoistedCodeBlockAnch, _slice$content$firstC2;
   var attributionKey = _ref2.attributionKey,
     change = _ref2.change,
     doc = _ref2.doc,
@@ -274,6 +275,7 @@ export var createNodeChangedDecorationWidget = function createNodeChangedDecorat
   // Match the rendering predicate above: an empty paragraph has no widget to tag, while whitespace
   // text in a rendered widget remains eligible.
   var canTagWidget = showContributorTags && !shouldSkipDeletedEmptyParagraphDecoration;
+  var contributorTagAnchorName;
   var decorations = [];
   var replacementNode = newDoc.nodeAt(change.fromB);
   var firstReplacedNode = slice.content.firstChild;
@@ -374,6 +376,14 @@ export var createNodeChangedDecorationWidget = function createNodeChangedDecorat
     var $sourcePos = fg('platform_editor_ai_show_diff_patch_2') ? getSourcePos(doc, $changeFromA, slice.openStart, index) : null;
     var nodeView = serializer.tryCreateNodeView(node, 0, $sourcePos !== null && $sourcePos !== void 0 ? $sourcePos : undefined, isInserted, colorScheme);
     if (nodeView) {
+      if (canTagWidget && contributorTagAnchorName === undefined && resolveBaseNodeName(node.type.name) === 'layoutColumn' && nodeView instanceof HTMLElement && fg('confluence_ncs_step_diffing_version_history')) {
+        // The deleted column is rendered inside this widget; anchor to its box.
+        contributorTagAnchorName = buildAnchorDecorationKey({
+          diffId: diffId,
+          anchorType: AnchorTypeKey.tag
+        });
+        nodeView.style.setProperty('anchor-name', "--".concat(contributorTagAnchorName));
+      }
       if (node.isInline) {
         var wrapper = createContentWrapper(colorScheme, isActive, isInserted, reveal);
         wrapper.append(nodeView);
@@ -421,7 +431,7 @@ export var createNodeChangedDecorationWidget = function createNodeChangedDecorat
   if (hoistedCodeBlockAnchor) {
     decorations.push(hoistedCodeBlockAnchor.marker);
   }
-  var contributorTagAnchorName = hoistedCodeBlockAnchor === null || hoistedCodeBlockAnchor === void 0 ? void 0 : hoistedCodeBlockAnchor.anchorName;
+  contributorTagAnchorName = (_hoistedCodeBlockAnch = hoistedCodeBlockAnchor === null || hoistedCodeBlockAnchor === void 0 ? void 0 : hoistedCodeBlockAnchor.anchorName) !== null && _hoistedCodeBlockAnch !== void 0 ? _hoistedCodeBlockAnch : contributorTagAnchorName;
   if (!isInserted && deletedColumns !== null && deletedColumns !== void 0 && deletedColumns.length) {
     var table = dom.querySelector('table');
     var firstRow = table === null || table === void 0 ? void 0 : table.rows[0];

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

@@ -1,5 +1,4 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _toArray from "@babel/runtime/helpers/toArray";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["connectedToKey"];
@@ -9,6 +8,7 @@ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 import { fg } from '@atlaskit/platform-feature-flags/fg';
+import { resolveBaseNodeName } from '../utils/baseNodeName';
 import { isDiffDecoration, isDiffDecorationSpec } from './decorationKeys';
 
 /**
@@ -69,12 +69,27 @@ var byLeadingPosition = function byLeadingPosition(a, b) {
   return a.decoration.from - b.decoration.from || ((_a$decoration$spec$si = a.decoration.spec.side) !== null && _a$decoration$spec$si !== void 0 ? _a$decoration$spec$si : 0) - ((_b$decoration$spec$si = b.decoration.spec.side) !== null && _b$decoration$spec$si !== void 0 ? _b$decoration$spec$si : 0) || a.decoration.to - a.decoration.from - (b.decoration.to - b.decoration.from);
 };
 
-/** The targets a navigation range wholly covers, leader first. */
-var containedBy = function containedBy(targets, _ref2) {
-  var from = _ref2.from,
-    to = _ref2.to;
-  return targets.filter(function (_ref3) {
+/** Select the first layout column only when the inline layout range starts immediately before it. */
+var navigationLeader = function navigationLeader(members) {
+  var ordered = _toConsumableArray(members).sort(byLeadingPosition);
+  var layoutColumn = fg('confluence_ncs_step_diffing_version_history') ? ordered.find(function (_ref2) {
+    var _decoration$spec$node;
+    var decoration = _ref2.decoration;
+    return decoration.spec.decorationType === 'block' && resolveBaseNodeName((_decoration$spec$node = decoration.spec.nodeName) !== null && _decoration$spec$node !== void 0 ? _decoration$spec$node : '') === 'layoutColumn';
+  }) : undefined;
+  var startsWholeLayout = layoutColumn !== undefined && members.some(function (_ref3) {
     var decoration = _ref3.decoration;
+    return decoration.spec.decorationType === 'inline' && decoration.from === layoutColumn.decoration.from - 1;
+  });
+  return startsWholeLayout ? layoutColumn : ordered[0];
+};
+
+/** The targets a navigation range wholly covers, leader first. */
+var containedBy = function containedBy(targets, _ref4) {
+  var from = _ref4.from,
+    to = _ref4.to;
+  return targets.filter(function (_ref5) {
+    var decoration = _ref5.decoration;
     return from <= decoration.from && decoration.to <= to;
   }).sort(byLeadingPosition);
 };
@@ -148,16 +163,16 @@ export var extractContributorTags = function extractContributorTags(decorations,
   } finally {
     _iterator.f();
   }
-  var inlineTargets = targets.filter(function (_ref4) {
-    var decoration = _ref4.decoration;
+  var inlineTargets = targets.filter(function (_ref6) {
+    var decoration = _ref6.decoration;
     return decoration.spec.decorationType === 'inline';
   });
-  var blockTargets = targets.filter(function (_ref5) {
-    var decoration = _ref5.decoration;
+  var blockTargets = targets.filter(function (_ref7) {
+    var decoration = _ref7.decoration;
     return decoration.spec.decorationType === 'block';
   });
-  var widgetTargets = targets.filter(function (_ref6) {
-    var decoration = _ref6.decoration;
+  var widgetTargets = targets.filter(function (_ref8) {
+    var decoration = _ref8.decoration;
     return decoration.spec.decorationType === 'widget';
   });
   var linkedDiffIds = new Map();
@@ -185,8 +200,8 @@ export var extractContributorTags = function extractContributorTags(decorations,
       }
 
       // A block outranks both other kinds, so it is tried first.
-      var block = blockTargets.find(function (_ref7) {
-        var decoration = _ref7.decoration;
+      var block = blockTargets.find(function (_ref9) {
+        var decoration = _ref9.decoration;
         return isSameBlockChange(target.decoration, decoration);
       });
       if (block) {
@@ -195,8 +210,8 @@ export var extractContributorTags = function extractContributorTags(decorations,
       }
       if (decorationType === 'inline') {
         // The deleted half renders in front of this one, so that half captions the change.
-        var leadingWidget = widgetTargets.find(function (_ref8) {
-          var decoration = _ref8.decoration;
+        var leadingWidget = widgetTargets.find(function (_ref0) {
+          var decoration = _ref0.decoration;
           return leadsReplacement(decoration) && isSameChange(decoration, target.decoration);
         });
         if (leadingWidget) {
@@ -209,8 +224,8 @@ export var extractContributorTags = function extractContributorTags(decorations,
       if (leadsReplacement(target.decoration)) {
         return 0; // continue
       }
-      var host = inlineTargets.find(function (_ref9) {
-        var decoration = _ref9.decoration;
+      var host = inlineTargets.find(function (_ref1) {
+        var decoration = _ref1.decoration;
         return isSameChange(target.decoration, decoration);
       });
       if (host) {
@@ -314,10 +329,10 @@ export var extractContributorTags = function extractContributorTags(decorations,
     try {
       var _loop2 = function _loop2() {
         var members = _step6.value;
-        var _sort = _toConsumableArray(members).sort(byLeadingPosition),
-          _sort2 = _toArray(_sort),
-          leader = _sort2[0],
-          trailing = _arrayLikeToArray(_sort2).slice(1);
+        var leader = navigationLeader(members);
+        var trailing = members.filter(function (target) {
+          return target !== leader;
+        });
         trailing.forEach(function (target) {
           return fold(leader, target);
         });

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 { fg } from '@atlaskit/platform-feature-flags/fg';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { resolveBaseNodeName } from '../../utils/baseNodeName';
 import { getAtomicInlineChangedAttrs } from '../createInlineChangedDecoration';
 import { applyRevealToElement } from '../revealStyles';
 import { isInlineAttrChangeNodeName } from './getAttrChangeRanges';
@@ -346,6 +347,15 @@ var createBlockNodeContentWrapper = function createBlockNodeContentWrapper(_ref9
   // should not also get the inline content style (borderBottom underline) on their container.
   var shouldSkipContentStyle = isInserted && nodeStyle !== undefined;
   var contentStyle = shouldSkipContentStyle ? '' : getChangedContentStyle(colorScheme, isActive, isInserted, hideAddedDiffsUnderline);
+  var isEmptyDeletedLayoutColumn = !isInserted && resolveBaseNodeName(targetNode.type.name) === 'layoutColumn' && targetNode.textContent.length === 0 && fg('confluence_ncs_step_diffing_version_history');
+  if (isEmptyDeletedLayoutColumn && nodeView instanceof HTMLElement) {
+    var _nodeView$querySelect;
+    // Give an empty deleted column height so its diff box doesn't collapse
+    var placeholderTarget = (_nodeView$querySelect = nodeView.querySelector('[data-layout-content]')) !== null && _nodeView$querySelect !== void 0 ? _nodeView$querySelect : nodeView;
+    appendStyleToElement(placeholderTarget, convertToInlineCss({
+      minHeight: "var(--ds-space-300, 24px)"
+    }));
+  }
 
   // A `breakout` node renders wider than the editor column while the wrapper divs
   // stay at column width, so paint the outline on the node element that spans that width.

package/dist/esm/pm-plugins/utils/taggableBlockNodes.js

@@ -10,7 +10,7 @@ import { resolveBaseNodeName } from './baseNodeName';
  *
  * Base names only — match with the predicates below, never against `type.name` directly.
  */
-var TAGGABLE_BLOCK_NODES = new Set(['blockCard', 'blockquote', 'bodiedExtension', 'codeBlock', 'decisionList', 'embedCard', 'expand', 'extension', 'media', 'multiBodiedExtension', 'panel', 'rule', 'taskList']);
+var TAGGABLE_BLOCK_NODES = new Set(['blockCard', 'blockquote', 'bodiedExtension', 'codeBlock', 'decisionList', 'embedCard', 'expand', 'extension', 'layoutColumn', 'media', 'multiBodiedExtension', 'panel', 'rule', 'taskList']);
 
 /**
  * Whether this node hosts a contributor tag of its own. Navigation grouping does not consult this:

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-show-diff",
-	"version": "24.0.0",
+	"version": "24.0.1",
 	"description": "ShowDiff plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -39,7 +39,7 @@
 		"@atlaskit/platform-feature-experiments": "^0.3.0",
 		"@atlaskit/platform-feature-flags": "^2.2.0",
 		"@atlaskit/primitives": "^22.5.0",
-		"@atlaskit/tmp-editor-statsig": "^227.0.0",
+		"@atlaskit/tmp-editor-statsig": "^228.0.0",
 		"@atlaskit/tokens": "^20.4.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^1.0.2",
@@ -71,7 +71,7 @@
 		"react-intl": "^7.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^130.0.0",
+		"@atlaskit/editor-common": "^130.1.0",
 		"react": "^18.2.0 || ^19.2.0",
 		"react-dom": "^18.2.0 || ^19.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"