@atlaskit/editor-plugin-show-diff 5.0.5 → 5.0.6

package/dist/es2019/pm-plugins/{deletedBlocksHandler.js → decorations/utils/wrapBlockNodeView.js}

@@ -1,9 +1,9 @@
 import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
 import { trackChangesMessages } from '@atlaskit/editor-common/messages';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { deletedStyleQuoteNode, deletedStyleQuoteNodeWithLozenge, deletedBlockOutline, deletedBlockOutlineRounded } from './colorSchemes/standard';
-import { deletedTraditionalStyleQuoteNode, deletedTraditionalBlockOutline, deletedTraditionalBlockOutlineRounded } from './colorSchemes/traditional';
-import { getDeletedContentStyle } from './decorations';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { deletedStyleQuoteNode, deletedStyleQuoteNodeWithLozenge, deletedBlockOutline, deletedBlockOutlineRounded, deletedContentStyle, deletedContentStyleActive, deletedContentStyleNew, deletedContentStyleNewActive } from '../colorSchemes/standard';
+import { deletedTraditionalStyleQuoteNode, deletedTraditionalBlockOutline, deletedTraditionalBlockOutlineRounded, deletedTraditionalContentStyle } from '../colorSchemes/traditional';
 const lozengeStyle = convertToInlineCss({
   display: 'inline-flex',
   boxSizing: 'border-box',
@@ -20,7 +20,16 @@ const lozengeStyle = convertToInlineCss({
   whiteSpace: 'nowrap',
   color: "var(--ds-text-warning-inverse, #292A2E)"
 });
-export const getDeletedStyleNode = (nodeName, colorScheme) => {
+const getDeletedContentStyle = (colorScheme, isActive = false) => {
+  if (colorScheme === 'traditional') {
+    return deletedTraditionalContentStyle;
+  }
+  if (isActive) {
+    return expValEquals('platform_editor_enghealth_a11y_jan_fixes', 'isEnabled', true) ? deletedContentStyleNewActive : deletedContentStyleActive;
+  }
+  return expValEquals('platform_editor_enghealth_a11y_jan_fixes', 'isEnabled', true) ? deletedContentStyleNew : deletedContentStyle;
+};
+const getDeletedStyleNode = (nodeName, colorScheme) => {
   const isTraditional = colorScheme === 'traditional';
   switch (nodeName) {
     case 'blockquote':
@@ -66,7 +75,7 @@ const shouldAddShowDiffDeletedNodeClass = nodeName => {
  * Checks if a node should apply deleted styles directly without wrapper
  * to preserve natural block-level margins
  */
-const shouldApplyDeletedStylesDirectly = nodeName => {
+const shouldApplyStylesDirectly = nodeName => {
   return nodeName === 'heading' || nodeName === 'blockquote' && !fg('platform_editor_ai_aifc_patch_ga_blockers');
 };
 
@@ -119,9 +128,13 @@ const createBlockNodeWrapper = () => {
 };
 
 /**
- * Applies deleted styles directly to an HTML element by merging with existing styles
+ * Applies styles directly to an HTML element by merging with existing styles
  */
-const applyDeletedStylesToElement = (element, targetNode, colorScheme) => {
+const applyStylesToElement = ({
+  element,
+  targetNode,
+  colorScheme
+}) => {
   const currentStyle = element.getAttribute('style') || '';
   const deletedContentStyle = getDeletedContentStyle(colorScheme);
   const nodeSpecificStyle = getDeletedStyleNode(targetNode.type.name, colorScheme) || '';
@@ -131,7 +144,11 @@ const applyDeletedStylesToElement = (element, targetNode, colorScheme) => {
 /**
  * Creates a content wrapper with deleted styles for a block node
  */
-const createBlockNodeContentWrapper = (nodeView, targetNode, colorScheme) => {
+const createBlockNodeContentWrapper = ({
+  nodeView,
+  targetNode,
+  colorScheme
+}) => {
   const contentWrapper = document.createElement('div');
   const nodeStyle = getDeletedStyleNode(targetNode.type.name, colorScheme);
   contentWrapper.setAttribute('style', `${getDeletedContentStyle(colorScheme)}${nodeStyle || ''}`);
@@ -145,7 +162,13 @@ const createBlockNodeContentWrapper = (nodeView, targetNode, colorScheme) => {
  * to wait for the rich-media-item to appear before attaching the lozenge.
  * @returns true if embedCard was handled
  */
-const handleEmbedCardWithLozenge = (dom, nodeView, targetNode, lozenge, colorScheme) => {
+const handleEmbedCardWithLozenge = ({
+  dom,
+  nodeView,
+  targetNode,
+  lozenge,
+  colorScheme
+}) => {
   if (targetNode.type.name !== 'embedCard' || !(nodeView instanceof HTMLElement)) {
     return false;
   }
@@ -177,7 +200,13 @@ const handleEmbedCardWithLozenge = (dom, nodeView, targetNode, lozenge, colorSch
  * Handles special mediaSingle node rendering with lozenge on child media element
  * @returns true if mediaSingle was handled, false otherwise
  */
-export const handleMediaSingleWithLozenge = (dom, nodeView, targetNode, lozenge, colorScheme) => {
+const handleMediaSingleWithLozenge = ({
+  dom,
+  nodeView,
+  targetNode,
+  lozenge,
+  colorScheme
+}) => {
   if (targetNode.type.name !== 'mediaSingle' || !(nodeView instanceof HTMLElement)) {
     return false;
   }
@@ -206,19 +235,41 @@ export const handleMediaSingleWithLozenge = (dom, nodeView, targetNode, lozenge,
 /**
  * Appends a block node with wrapper, lozenge, and appropriate styling
  */
-const appendBlockNodeWithWrapper = (dom, nodeView, targetNode, colorScheme, intl) => {
+const wrapBlockNode = ({
+  dom,
+  nodeView,
+  targetNode,
+  colorScheme,
+  intl
+}) => {
   const blockWrapper = createBlockNodeWrapper();
   if (shouldShowRemovedLozenge(targetNode.type.name)) {
     const lozenge = createRemovedLozenge(intl);
-    if (handleEmbedCardWithLozenge(dom, nodeView, targetNode, lozenge, colorScheme) && fg('platform_editor_ai_aifc_patch_ga_blockers')) {
+    if (handleEmbedCardWithLozenge({
+      dom,
+      nodeView,
+      targetNode,
+      lozenge,
+      colorScheme
+    }) && fg('platform_editor_ai_aifc_patch_ga_blockers')) {
       return;
     }
-    if (handleMediaSingleWithLozenge(dom, nodeView, targetNode, lozenge, colorScheme)) {
+    if (handleMediaSingleWithLozenge({
+      dom,
+      nodeView,
+      targetNode,
+      lozenge,
+      colorScheme
+    })) {
       return;
     }
     blockWrapper.append(lozenge);
   }
-  const contentWrapper = createBlockNodeContentWrapper(nodeView, targetNode, colorScheme);
+  const contentWrapper = createBlockNodeContentWrapper({
+    nodeView,
+    targetNode,
+    colorScheme
+  });
   blockWrapper.append(contentWrapper);
   if (nodeView instanceof HTMLElement && shouldAddShowDiffDeletedNodeClass(targetNode.type.name)) {
     const showDiffDeletedNodeClass = colorScheme === 'traditional' && fg('platform_editor_ai_aifc_patch_ga_blockers') ? 'show-diff-deleted-node-traditional' : 'show-diff-deleted-node';
@@ -232,13 +283,29 @@ const appendBlockNodeWithWrapper = (dom, nodeView, targetNode, colorScheme, intl
  * For heading nodes, applies styles directly to preserve natural margins.
  * For other block nodes, uses wrapper approach with optional lozenge.
  */
-export const handleBlockNodeView = (dom, nodeView, targetNode, colorScheme, intl) => {
-  if (shouldApplyDeletedStylesDirectly(targetNode.type.name) && nodeView instanceof HTMLElement) {
+export const wrapBlockNodeView = ({
+  dom,
+  nodeView,
+  targetNode,
+  colorScheme,
+  intl
+}) => {
+  if (shouldApplyStylesDirectly(targetNode.type.name) && nodeView instanceof HTMLElement) {
     // Apply deleted styles directly to preserve natural block-level margins
-    applyDeletedStylesToElement(nodeView, targetNode, colorScheme);
+    applyStylesToElement({
+      element: nodeView,
+      targetNode,
+      colorScheme
+    });
     dom.append(nodeView);
   } else {
     // Use wrapper approach for other block nodes
-    appendBlockNodeWithWrapper(dom, nodeView, targetNode, colorScheme, intl);
+    wrapBlockNode({
+      dom,
+      nodeView,
+      targetNode,
+      colorScheme,
+      intl
+    });
   }
 };

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

@@ -12,9 +12,11 @@ import memoizeOne from 'memoize-one';
 import { ChangeSet, simplifyChanges } from 'prosemirror-changeset';
 import { areNodesEqualIgnoreAttrs } from '@atlaskit/editor-common/utils/document';
 import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
-import { getAttrChangeRanges, stepIsValidAttrChange } from './attributeDecorations';
-import { createInlineChangedDecoration, createDeletedContentDecoration, createBlockChangedDecoration } from './decorations';
-import { getMarkChangeRanges } from './markDecorations';
+import { createBlockChangedDecoration } from './decorations/createBlockChangedDecoration';
+import { createInlineChangedDecoration } from './decorations/createInlineChangedDecoration';
+import { createNodeChangedDecorationWidget } from './decorations/createNodeChangedDecorationWidget';
+import { getAttrChangeRanges, stepIsValidAttrChange } from './decorations/utils/getAttrChangeRanges';
+import { getMarkChangeRanges } from './decorations/utils/getMarkChangeRanges';
 import { simplifySteps } from './simplifyChanges';
 var calculateNodesForBlockDecoration = function calculateNodesForBlockDecoration(_ref) {
   var doc = _ref.doc,
@@ -136,7 +138,7 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref2
     }
     if (change.deleted.length > 0) {
       var _isActive = activeIndexPos && change.fromB >= activeIndexPos.from && change.toB <= activeIndexPos.to;
-      var decoration = createDeletedContentDecoration({
+      var decoration = createNodeChangedDecorationWidget({
         change: change,
         doc: originalDoc,
         nodeViewSerializer: nodeViewSerializer,

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

@@ -0,0 +1,69 @@
+import { Decoration } from '@atlaskit/editor-prosemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { standardDecorationMarkerVariable, editingStyleQuoteNode, editingStyleRuleNode, editingStyleCardBlockNode, editingStyleNode } from './colorSchemes/standard';
+import { traditionalDecorationMarkerVariable, traditionalStyleQuoteNode, traditionalStyleRuleNode, traditionalStyleCardBlockNode, traditionalStyleNode } from './colorSchemes/traditional';
+var getNodeClass = function getNodeClass(name) {
+  switch (name) {
+    case 'extension':
+      return 'show-diff-changed-decoration-node';
+    default:
+      return undefined;
+  }
+};
+var getBlockNodeStyle = function getBlockNodeStyle(nodeName, colorScheme) {
+  var isTraditional = colorScheme === 'traditional';
+  if (['mediaSingle', 'mediaGroup', 'table',
+  // Handle table separately to avoid border issues
+  'tableRow', 'tableCell', 'tableHeader', 'paragraph',
+  // Paragraph and heading nodes do not need special styling
+  'heading', 'hardBreak', 'decisionList', 'taskList', 'taskItem', 'bulletList', 'orderedList', 'layoutSection'].includes(nodeName)) {
+    // Layout nodes do not need special styling
+    return undefined;
+  }
+  if (['extension', 'embedCard', 'listItem'].includes(nodeName)) {
+    return isTraditional ? traditionalDecorationMarkerVariable : standardDecorationMarkerVariable;
+  }
+  if (nodeName === 'blockquote') {
+    return isTraditional ? traditionalStyleQuoteNode : editingStyleQuoteNode;
+  }
+  if (nodeName === 'rule') {
+    return isTraditional ? traditionalStyleRuleNode : editingStyleRuleNode;
+  }
+  if (nodeName === 'blockCard') {
+    return isTraditional ? traditionalStyleCardBlockNode : editingStyleCardBlockNode;
+  }
+  return isTraditional ? traditionalStyleNode : editingStyleNode;
+};
+
+/**
+ * Inline decoration used for insertions as the content already exists in the document
+ *
+ * @param change Changeset "change" containing information about the change content + range
+ * @returns Prosemirror inline decoration
+ */
+export var createBlockChangedDecoration = function createBlockChangedDecoration(_ref) {
+  var change = _ref.change,
+    colorScheme = _ref.colorScheme;
+  if (fg('platform_editor_show_diff_scroll_navigation')) {
+    var style = getBlockNodeStyle(change.name, colorScheme);
+    var className = getNodeClass(change.name);
+    if (style || className) {
+      return Decoration.node(change.from, change.to, {
+        style: style,
+        'data-testid': 'show-diff-changed-decoration-node',
+        class: className
+      }, {
+        key: 'diff-block'
+      });
+    }
+    return undefined;
+  } else {
+    return Decoration.node(change.from, change.to, {
+      style: getBlockNodeStyle(change.name, colorScheme),
+      'data-testid': 'show-diff-changed-decoration-node',
+      class: getNodeClass(change.name)
+    }, {
+      key: 'diff-block'
+    });
+  }
+};

package/dist/esm/pm-plugins/{deletedRowsHandler.js → decorations/createChangedRowDecorationWidgets.js}

@@ -8,12 +8,12 @@ import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { deletedRowStyle } from './colorSchemes/standard';
 import { deletedTraditionalRowStyle } from './colorSchemes/traditional';
-import { findSafeInsertPos } from './findSafeInsertPos';
+import { findSafeInsertPos } from './utils/findSafeInsertPos';
 /**
  * Extracts information about deleted table rows from a change
  */
-var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc) {
-  var deletedRows = [];
+var extractChangedRows = function extractChangedRows(change, originalDoc, newDoc) {
+  var changedRows = [];
 
   // Find the table in the original document
   var $fromPos = originalDoc.resolve(change.fromA);
@@ -21,7 +21,7 @@ var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc
     return node.type.name === 'table';
   });
   if (!tableOld) {
-    return deletedRows;
+    return changedRows;
   }
   var oldTableMap = TableMap.get(tableOld.node);
 
@@ -31,18 +31,18 @@ var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc
     return node.type.name === 'table';
   });
   if (!tableNew) {
-    return deletedRows;
+    return changedRows;
   }
   var newTableMap = TableMap.get(tableNew.node);
 
-  // If no rows were deleted, return empty
+  // If no rows were changed, return empty
   if (oldTableMap.height <= newTableMap.height ||
   // For now ignore if there are column deletions as well
   oldTableMap.width !== newTableMap.width) {
-    return deletedRows;
+    return changedRows;
   }
 
-  // Find which rows were deleted by analyzing the change range
+  // Find which rows were changed by analyzing the change range
   var changeStartInTable = change.fromA - tableOld.pos - 1;
   var changeEndInTable = change.toA - tableOld.pos - 1;
   var currentOffset = 0;
@@ -57,7 +57,7 @@ var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc
       var startOfRow = newTableMap.mapByRow.slice().reverse().find(function (row) {
         return row[0] + tableNew.pos < change.fromB && change.fromB < row[row.length - 1] + tableNew.pos;
       });
-      deletedRows.push({
+      changedRows.push({
         rowIndex: rowIndex,
         rowNode: rowNode,
         fromA: tableOld.pos + 1 + rowStart,
@@ -72,9 +72,9 @@ var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc
   });
 
   // Filter changes that never truly got deleted
-  return deletedRows.filter(function (deletedRow) {
+  return changedRows.filter(function (changedRow) {
     return !tableNew.node.children.some(function (newRow) {
-      return areNodesEqualIgnoreAttrs(newRow, deletedRow.rowNode);
+      return areNodesEqualIgnoreAttrs(newRow, changedRow.rowNode);
     });
   });
 };
@@ -108,7 +108,7 @@ var isEmptyRow = function isEmptyRow(rowNode) {
 /**
  * Creates a DOM representation of a deleted table row
  */
-var createDeletedRowDOM = function createDeletedRowDOM(rowNode, nodeViewSerializer, colorScheme) {
+var createChangedRowDOM = function createChangedRowDOM(rowNode, nodeViewSerializer, colorScheme) {
   var tr = document.createElement('tr');
   tr.setAttribute('style', colorScheme === 'traditional' ? deletedTraditionalRowStyle : deletedRowStyle);
   tr.setAttribute('data-testid', 'show-diff-deleted-row');
@@ -132,19 +132,19 @@ var createDeletedRowDOM = function createDeletedRowDOM(rowNode, nodeViewSerializ
 };
 
 /**
- * Expands a diff to include whole deleted rows when table rows are affected
+ * Expands a diff to include whole changed rows when table rows are affected
  */
-var expandDiffForDeletedRows = function expandDiffForDeletedRows(changes, originalDoc, newDoc) {
-  var deletedRowInfo = [];
+var expandDiffForChangedRows = function expandDiffForChangedRows(changes, originalDoc, newDoc) {
+  var rowInfo = [];
   var _iterator = _createForOfIteratorHelper(changes),
     _step;
   try {
     for (_iterator.s(); !(_step = _iterator.n()).done;) {
       var change = _step.value;
       // Check if this change affects table content
-      var deletedRows = extractDeletedRows(change, originalDoc, newDoc);
-      if (deletedRows.length > 0) {
-        deletedRowInfo.push.apply(deletedRowInfo, _toConsumableArray(deletedRows));
+      var changedRows = extractChangedRows(change, originalDoc, newDoc);
+      if (changedRows.length > 0) {
+        rowInfo.push.apply(rowInfo, _toConsumableArray(changedRows));
       }
     }
   } catch (err) {
@@ -152,50 +152,29 @@ var expandDiffForDeletedRows = function expandDiffForDeletedRows(changes, origin
   } finally {
     _iterator.f();
   }
-  return deletedRowInfo;
+  return rowInfo;
 };
 
 /**
- * Creates decorations for deleted table rows
+ * Main function to handle deleted rows - computes diff and creates decorations
  */
-export var createDeletedRowsDecorations = function createDeletedRowsDecorations(_ref) {
-  var deletedRows = _ref.deletedRows,
+export var createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(_ref) {
+  var changes = _ref.changes,
     originalDoc = _ref.originalDoc,
     newDoc = _ref.newDoc,
     nodeViewSerializer = _ref.nodeViewSerializer,
     colorScheme = _ref.colorScheme;
-  return deletedRows.map(function (deletedRow) {
-    var rowDOM = createDeletedRowDOM(deletedRow.rowNode, nodeViewSerializer, colorScheme);
+  // First, expand the changes to include complete deleted rows
+  var changedRows = expandDiffForChangedRows(changes.filter(function (change) {
+    return change.deleted.length > 0;
+  }), originalDoc, newDoc);
+  return changedRows.map(function (changedRow) {
+    var rowDOM = createChangedRowDOM(changedRow.rowNode, nodeViewSerializer, colorScheme);
 
     // Find safe insertion position for the deleted row
-    var safeInsertPos = findSafeInsertPos(newDoc, deletedRow.fromB - 1,
+    var safeInsertPos = findSafeInsertPos(newDoc, changedRow.fromB - 1,
     // -1 to find the first safe position from the table
-    originalDoc.slice(deletedRow.fromA, deletedRow.toA));
+    originalDoc.slice(changedRow.fromA, changedRow.toA));
     return Decoration.widget(safeInsertPos, rowDOM, {});
   });
-};
-
-/**
- * Main function to handle deleted rows - computes diff and creates decorations
- */
-export var handleDeletedRows = function handleDeletedRows(_ref2) {
-  var changes = _ref2.changes,
-    originalDoc = _ref2.originalDoc,
-    newDoc = _ref2.newDoc,
-    nodeViewSerializer = _ref2.nodeViewSerializer,
-    colorScheme = _ref2.colorScheme;
-  // First, expand the changes to include complete deleted rows
-  var deletedRows = expandDiffForDeletedRows(changes.filter(function (change) {
-    return change.deleted.length > 0;
-  }), originalDoc, newDoc);
-  var allDecorations = createDeletedRowsDecorations({
-    deletedRows: deletedRows,
-    originalDoc: originalDoc,
-    newDoc: newDoc,
-    nodeViewSerializer: nodeViewSerializer,
-    colorScheme: colorScheme
-  });
-  return {
-    decorations: allDecorations
-  };
 };

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

@@ -0,0 +1,28 @@
+import { Decoration } from '@atlaskit/editor-prosemirror/view';
+import { editingStyle, editingStyleActive } from './colorSchemes/standard';
+import { traditionalInsertStyle, traditionalInsertStyleActive } from './colorSchemes/traditional';
+
+/**
+ * Inline decoration used for insertions as the content already exists in the document
+ *
+ * @param change Changeset "change" containing information about the change content + range
+ * @returns Prosemirror inline decoration
+ */
+export var createInlineChangedDecoration = function createInlineChangedDecoration(_ref) {
+  var change = _ref.change,
+    colorScheme = _ref.colorScheme,
+    _ref$isActive = _ref.isActive,
+    isActive = _ref$isActive === void 0 ? false : _ref$isActive;
+  var style;
+  if (colorScheme === 'traditional') {
+    style = isActive ? traditionalInsertStyleActive : traditionalInsertStyle;
+  } else {
+    style = isActive ? editingStyleActive : editingStyle;
+  }
+  return Decoration.inline(change.fromB, change.toB, {
+    style: style,
+    'data-testid': 'show-diff-changed-decoration'
+  }, {
+    key: 'diff-inline'
+  });
+};

package/dist/esm/pm-plugins/{decorations.js → decorations/createNodeChangedDecorationWidget.js}

@@ -2,39 +2,15 @@ import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
 import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { deletedContentStyle, deletedContentStyleActive, deletedContentStyleNew, deletedContentStyleNewActive, editingStyle, editingStyleActive, deletedContentStyleUnbounded, standardDecorationMarkerVariable, editingStyleQuoteNode, editingStyleRuleNode, editingStyleCardBlockNode, editingStyleNode } from './colorSchemes/standard';
-import { deletedTraditionalContentStyle, deletedTraditionalContentStyleUnbounded, traditionalInsertStyle, traditionalInsertStyleActive, traditionalDecorationMarkerVariable, traditionalStyleQuoteNode, traditionalStyleRuleNode, traditionalStyleCardBlockNode, traditionalStyleNode } from './colorSchemes/traditional';
-import { handleBlockNodeView } from './deletedBlocksHandler';
-import { handleDeletedRows } from './deletedRowsHandler';
-import { findSafeInsertPos } from './findSafeInsertPos';
-/**
- * Inline decoration used for insertions as the content already exists in the document
- *
- * @param change Changeset "change" containing information about the change content + range
- * @returns Prosemirror inline decoration
- */
-export var createInlineChangedDecoration = function createInlineChangedDecoration(_ref) {
-  var change = _ref.change,
-    colorScheme = _ref.colorScheme,
-    _ref$isActive = _ref.isActive,
-    isActive = _ref$isActive === void 0 ? false : _ref$isActive;
-  var style;
-  if (colorScheme === 'traditional') {
-    style = isActive ? traditionalInsertStyleActive : traditionalInsertStyle;
-  } else {
-    style = isActive ? editingStyleActive : editingStyle;
-  }
-  return Decoration.inline(change.fromB, change.toB, {
-    style: style,
-    'data-testid': 'show-diff-changed-decoration'
-  }, {
-    key: 'diff-inline'
-  });
-};
-export var getDeletedContentStyleUnbounded = function getDeletedContentStyleUnbounded(colorScheme) {
+import { deletedContentStyle, deletedContentStyleActive, deletedContentStyleNew, deletedContentStyleNewActive, deletedContentStyleUnbounded } from './colorSchemes/standard';
+import { deletedTraditionalContentStyle, deletedTraditionalContentStyleUnbounded } from './colorSchemes/traditional';
+import { createChangedRowDecorationWidgets } from './createChangedRowDecorationWidgets';
+import { findSafeInsertPos } from './utils/findSafeInsertPos';
+import { wrapBlockNodeView } from './utils/wrapBlockNodeView';
+var getDeletedContentStyleUnbounded = function getDeletedContentStyleUnbounded(colorScheme) {
   return colorScheme === 'traditional' ? deletedTraditionalContentStyleUnbounded : deletedContentStyleUnbounded;
 };
-export var getDeletedContentStyle = function getDeletedContentStyle(colorScheme) {
+var getDeletedContentStyle = function getDeletedContentStyle(colorScheme) {
   var isActive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   if (colorScheme === 'traditional') {
     return deletedTraditionalContentStyle;
@@ -44,38 +20,6 @@ export var getDeletedContentStyle = function getDeletedContentStyle(colorScheme)
   }
   return expValEquals('platform_editor_enghealth_a11y_jan_fixes', 'isEnabled', true) ? deletedContentStyleNew : deletedContentStyle;
 };
-var getNodeClass = function getNodeClass(name) {
-  switch (name) {
-    case 'extension':
-      return 'show-diff-changed-decoration-node';
-    default:
-      return undefined;
-  }
-};
-var getBlockNodeStyle = function getBlockNodeStyle(nodeName, colorScheme) {
-  var isTraditional = colorScheme === 'traditional';
-  if (['mediaSingle', 'mediaGroup', 'table',
-  // Handle table separately to avoid border issues
-  'tableRow', 'tableCell', 'tableHeader', 'paragraph',
-  // Paragraph and heading nodes do not need special styling
-  'heading', 'hardBreak', 'decisionList', 'taskList', 'taskItem', 'bulletList', 'orderedList', 'layoutSection'].includes(nodeName)) {
-    // Layout nodes do not need special styling
-    return undefined;
-  }
-  if (['extension', 'embedCard', 'listItem'].includes(nodeName)) {
-    return isTraditional ? traditionalDecorationMarkerVariable : standardDecorationMarkerVariable;
-  }
-  if (nodeName === 'blockquote') {
-    return isTraditional ? traditionalStyleQuoteNode : editingStyleQuoteNode;
-  }
-  if (nodeName === 'rule') {
-    return isTraditional ? traditionalStyleRuleNode : editingStyleRuleNode;
-  }
-  if (nodeName === 'blockCard') {
-    return isTraditional ? traditionalStyleCardBlockNode : editingStyleCardBlockNode;
-  }
-  return isTraditional ? traditionalStyleNode : editingStyleNode;
-};
 
 /**
  * Wraps content with deleted styling without opacity (for use when content is a direct child of dom)
@@ -85,39 +29,6 @@ var createDeletedStyleWrapperWithoutOpacity = function createDeletedStyleWrapper
   wrapper.setAttribute('style', getDeletedContentStyle(colorScheme, isActive));
   return wrapper;
 };
-
-/**
- * Inline decoration used for insertions as the content already exists in the document
- *
- * @param change Changeset "change" containing information about the change content + range
- * @returns Prosemirror inline decoration
- */
-export var createBlockChangedDecoration = function createBlockChangedDecoration(_ref2) {
-  var change = _ref2.change,
-    colorScheme = _ref2.colorScheme;
-  if (fg('platform_editor_show_diff_scroll_navigation')) {
-    var style = getBlockNodeStyle(change.name, colorScheme);
-    var className = getNodeClass(change.name);
-    if (style || className) {
-      return Decoration.node(change.from, change.to, {
-        style: style,
-        'data-testid': 'show-diff-changed-decoration-node',
-        class: className
-      }, {
-        key: 'diff-block'
-      });
-    }
-    return undefined;
-  } else {
-    return Decoration.node(change.from, change.to, {
-      style: getBlockNodeStyle(change.name, colorScheme),
-      'data-testid': 'show-diff-changed-decoration-node',
-      class: getNodeClass(change.name)
-    }, {
-      key: 'diff-block'
-    });
-  }
-};
 var createContentWrapper = function createContentWrapper(colorScheme) {
   var isActive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var wrapper = document.createElement('span');
@@ -131,15 +42,15 @@ var createContentWrapper = function createContentWrapper(colorScheme) {
   wrapper.append(strikethrough);
   return wrapper;
 };
-export var createDeletedContentDecoration = function createDeletedContentDecoration(_ref3) {
-  var change = _ref3.change,
-    doc = _ref3.doc,
-    nodeViewSerializer = _ref3.nodeViewSerializer,
-    colorScheme = _ref3.colorScheme,
-    newDoc = _ref3.newDoc,
-    intl = _ref3.intl,
-    _ref3$isActive = _ref3.isActive,
-    isActive = _ref3$isActive === void 0 ? false : _ref3$isActive;
+export var createNodeChangedDecorationWidget = function createNodeChangedDecorationWidget(_ref) {
+  var change = _ref.change,
+    doc = _ref.doc,
+    nodeViewSerializer = _ref.nodeViewSerializer,
+    colorScheme = _ref.colorScheme,
+    newDoc = _ref.newDoc,
+    intl = _ref.intl,
+    _ref$isActive = _ref.isActive,
+    isActive = _ref$isActive === void 0 ? false : _ref$isActive;
   var slice = doc.slice(change.fromA, change.toA);
   if (slice.content.content.length === 0) {
     return;
@@ -161,15 +72,13 @@ export var createDeletedContentDecoration = function createDeletedContentDecorat
     if (!fg('platform_editor_ai_aifc_patch_ga')) {
       return;
     }
-    var _handleDeletedRows = handleDeletedRows({
-        changes: [change],
-        originalDoc: doc,
-        newDoc: newDoc,
-        nodeViewSerializer: nodeViewSerializer,
-        colorScheme: colorScheme
-      }),
-      decorations = _handleDeletedRows.decorations;
-    return decorations;
+    return createChangedRowDecorationWidgets({
+      changes: [change],
+      originalDoc: doc,
+      newDoc: newDoc,
+      nodeViewSerializer: nodeViewSerializer,
+      colorScheme: colorScheme
+    });
   }
   var serializer = nodeViewSerializer;
 
@@ -247,7 +156,13 @@ export var createDeletedContentDecoration = function createDeletedContentDecorat
         dom.append(wrapper);
       } else {
         // Handle all block nodes with unified function
-        handleBlockNodeView(dom, nodeView, node, colorScheme, intl);
+        wrapBlockNodeView({
+          dom: dom,
+          nodeView: nodeView,
+          targetNode: node,
+          colorScheme: colorScheme,
+          intl: intl
+        });
       }
     } else if (nodeViewSerializer.getFilteredNodeViewBlocklist(['paragraph', 'tableRow']).has(node.type.name)) {
       // Skip the case where the node is a paragraph or table row that way it can still be rendered and delete the entire table

package/dist/esm/pm-plugins/{attributeDecorations.js → decorations/utils/getAttrChangeRanges.js}

@@ -44,7 +44,7 @@ export var stepIsValidAttrChange = function stepIsValidAttrChange(step, beforeDo
       }
     }
     return false;
-  } catch (e) {
+  } catch (_unused) {
     return false;
   }
 };