@atlaskit/editor-plugin-show-diff 10.1.23 → 10.2.0

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

@@ -11,10 +11,10 @@ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _state2 = require("@atlaskit/editor-prosemirror/state");
 var _transform = require("@atlaskit/editor-prosemirror/transform");
 var _view = require("@atlaskit/editor-prosemirror/view");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _calculateDiffDecorations = require("./calculateDiff/calculateDiffDecorations");
 var _enforceCustomStepRegisters = require("./enforceCustomStepRegisters");
 var _getScrollableDecorations = require("./getScrollableDecorations");
+var _isExtendedEnabled = require("./isExtendedEnabled");
 var _NodeViewSerializer = require("./NodeViewSerializer");
 var _scrollToDiff = require("./scrollToDiff");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -38,7 +38,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
           originalDoc: undefined,
           decorations: _view.DecorationSet.empty,
           isDisplayingChanges: false
-        }, (0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true) ? {
+        }, (0, _isExtendedEnabled.isExtendedEnabled)() ? {
           isInverted: false,
           diffType: 'inline',
           hideDeletedDiffs: false,
@@ -51,7 +51,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
         var newPluginState = currentPluginState;
         if (meta) {
           if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'SHOW_DIFF') {
-            var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4;
+            var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8;
             // Update the plugin state with the new metadata
             newPluginState = _objectSpread(_objectSpread(_objectSpread({}, currentPluginState), meta), {}, {
               isDisplayingChanges: true,
@@ -66,17 +66,19 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
                 intl: getIntl(),
                 activeIndexPos: newPluginState.activeIndexPos,
                 api: api
-              }, (0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true) ? {
-                isInverted: (_newPluginState = newPluginState) === null || _newPluginState === void 0 ? void 0 : _newPluginState.isInverted,
-                diffType: (_newPluginState2 = newPluginState) === null || _newPluginState2 === void 0 ? void 0 : _newPluginState2.diffType,
-                hideDeletedDiffs: (_newPluginState3 = newPluginState) === null || _newPluginState3 === void 0 ? void 0 : _newPluginState3.hideDeletedDiffs,
-                showIndicators: (_newPluginState4 = newPluginState) === null || _newPluginState4 === void 0 ? void 0 : _newPluginState4.showIndicators
+              }, (0, _isExtendedEnabled.isExtendedEnabled)((_newPluginState = newPluginState) === null || _newPluginState === void 0 ? void 0 : _newPluginState.diffType) ? {
+                isInverted: (_newPluginState2 = newPluginState) === null || _newPluginState2 === void 0 ? void 0 : _newPluginState2.isInverted,
+                diffType: (_newPluginState3 = newPluginState) === null || _newPluginState3 === void 0 ? void 0 : _newPluginState3.diffType,
+                hideDeletedDiffs: (_newPluginState4 = newPluginState) === null || _newPluginState4 === void 0 ? void 0 : _newPluginState4.hideDeletedDiffs,
+                showIndicators: (_newPluginState5 = newPluginState) === null || _newPluginState5 === void 0 ? void 0 : _newPluginState5.showIndicators,
+                smartThresholds: (_newPluginState6 = newPluginState) === null || _newPluginState6 === void 0 ? void 0 : _newPluginState6.smartThresholds,
+                deletedDiffPlacement: (_newPluginState7 = newPluginState) === null || _newPluginState7 === void 0 ? void 0 : _newPluginState7.deletedDiffPlacement
               } : {})),
               decorations = _calculateDiffDecorat.decorations,
               diffDescriptors = _calculateDiffDecorat.diffDescriptors;
             // Update the decorations and their ids
             newPluginState.decorations = decorations;
-            if ((0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
+            if ((0, _isExtendedEnabled.isExtendedEnabled)((_newPluginState8 = newPluginState) === null || _newPluginState8 === void 0 ? void 0 : _newPluginState8.diffType)) {
               newPluginState.diffDescriptors = diffDescriptors;
             }
           } else if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'HIDE_DIFF') {
@@ -84,15 +86,16 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
               decorations: _view.DecorationSet.empty,
               isDisplayingChanges: false,
               activeIndex: undefined
-            }, (0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true) ? {
+            }, (0, _isExtendedEnabled.isExtendedEnabled)(currentPluginState.diffType) ? {
               isInverted: false,
               diffType: 'inline',
               hideDeletedDiffs: false,
               diffDescriptors: []
             } : {});
           } else if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'SCROLL_TO_NEXT' || (meta === null || meta === void 0 ? void 0 : meta.action) === 'SCROLL_TO_PREVIOUS') {
+            var _newPluginState9;
             // Update the active index in plugin state and recalculate decorations
-            var _decorations = (0, _getScrollableDecorations.getScrollableDecorations)(currentPluginState.decorations, newState.doc);
+            var _decorations = (0, _getScrollableDecorations.getScrollableDecorations)(currentPluginState.decorations, newState.doc, (_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.diffType);
             if (_decorations.length > 0) {
               var _currentPluginState$a;
               // Initialize to -1 if undefined so that the first "next" scroll takes us to index 0 (first change).
@@ -126,16 +129,18 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
                   intl: getIntl(),
                   activeIndexPos: newPluginState.activeIndexPos,
                   api: api
-                }, (0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true) ? {
+                }, (0, _isExtendedEnabled.isExtendedEnabled)(newPluginState.diffType) ? {
                   isInverted: newPluginState.isInverted,
                   diffType: newPluginState.diffType,
                   hideDeletedDiffs: newPluginState.hideDeletedDiffs,
-                  showIndicators: newPluginState.showIndicators
+                  showIndicators: newPluginState.showIndicators,
+                  smartThresholds: newPluginState.smartThresholds,
+                  deletedDiffPlacement: newPluginState.deletedDiffPlacement
                 } : {})),
                 updatedDecorations = _calculateDiffDecorat2.decorations,
                 updatedDiffDescriptors = _calculateDiffDecorat2.diffDescriptors;
               newPluginState.decorations = updatedDecorations;
-              if ((0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
+              if ((0, _isExtendedEnabled.isExtendedEnabled)(newPluginState.diffType)) {
                 newPluginState.diffDescriptors = updatedDiffDescriptors;
               }
             }
@@ -169,7 +174,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
           var pluginState = showDiffPluginKey.getState(view.state);
 
           // Scroll to the first decoration when scrollIntoView was requested
-          if (pluginState !== null && pluginState !== void 0 && pluginState.scrollIntoView && (0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
+          if (pluginState !== null && pluginState !== void 0 && pluginState.scrollIntoView && (0, _isExtendedEnabled.isExtendedEnabled)(pluginState === null || pluginState === void 0 ? void 0 : pluginState.diffType)) {
             var _cancelPendingScrollT;
             (_cancelPendingScrollT = cancelPendingScrollToDecoration) === null || _cancelPendingScrollT === void 0 || _cancelPendingScrollT();
             cancelPendingScrollToDecoration = (0, _scrollToDiff.scrollToFirstDecoration)(view, pluginState.decorations);
@@ -186,7 +191,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
           if ((pluginState === null || pluginState === void 0 ? void 0 : pluginState.activeIndex) !== undefined && activeIndexChanged) {
             var _cancelPendingScrollT2, _api$expand;
             (_cancelPendingScrollT2 = cancelPendingScrollToDecoration) === null || _cancelPendingScrollT2 === void 0 || _cancelPendingScrollT2();
-            var scrollableDecorations = (0, _getScrollableDecorations.getScrollableDecorations)(pluginState.decorations, view.state.doc);
+            var scrollableDecorations = (0, _getScrollableDecorations.getScrollableDecorations)(pluginState.decorations, view.state.doc, pluginState === null || pluginState === void 0 ? void 0 : pluginState.diffType);
             var activeDecoration = scrollableDecorations[pluginState.activeIndex];
             if (activeDecoration && api !== null && api !== void 0 && (_api$expand = api.expand) !== null && _api$expand !== void 0 && (_api$expand = _api$expand.commands) !== null && _api$expand !== void 0 && _api$expand.toggleExpandRange) {
               api === null || api === void 0 || api.core.actions.execute(api.expand.commands.toggleExpandRange(activeDecoration.from, activeDecoration.to, true));

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

@@ -4,6 +4,7 @@ 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 { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { areDocsEqualByBlockStructureAndText } from '../areDocsEqualByBlockStructureAndText';
 import { createDocMarginAnchorWidget } from '../decorations/createAnchorDecorationWidgets';
@@ -14,19 +15,37 @@ import { createNodeChangedDecorationWidget } from '../decorations/createNodeChan
 import { extractDiffDescriptors } from '../decorations/decorationKeys';
 import { getAttrChangeRanges, stepIsValidAttrChange } from '../decorations/utils/getAttrChangeRanges';
 import { getMarkChangeRanges } from '../decorations/utils/getMarkChangeRanges';
+import { isExtendedEnabled } from '../isExtendedEnabled';
 import { diffBySteps, getStepChanges } from './diffBySteps';
 import { groupChangesByBlock } from './groupChangesByBlock';
 import { optimizeChanges } from './optimizeChanges';
 import { simplifySteps } from './simplifySteps';
+import { classifySmartChanges } from './smart/classifySmartChanges';
+import { smartChangeLevel } from './smart/helpers';
 const getChanges = ({
   changeset,
   originalDoc,
   steppedDoc,
   diffType,
   tr,
-  steps
+  steps,
+  intl,
+  smartThresholds
 }) => {
-  if (expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
+  if (isExtendedEnabled(diffType)) {
+    // The `smart` diff type is gated behind `platform_editor_ai_smart_diff`. When the gate is
+    // off, `smart` falls through to the default (`inline`) path below so behaviour degrades
+    // gracefully (see docs/smart-diff-design.md §3).
+    if (diffType === 'smart' && fg('platform_editor_ai_smart_diff')) {
+      const changes = simplifyChanges(changeset.changes, tr.doc);
+      return classifySmartChanges({
+        changes,
+        originalDoc,
+        newDoc: tr.doc,
+        locale: intl.locale,
+        thresholds: smartThresholds
+      });
+    }
     if (diffType === 'step') {
       return diffBySteps(originalDoc, steps);
     }
@@ -39,6 +58,29 @@ const getChanges = ({
   const changes = simplifyChanges(changeset.changes, tr.doc);
   return optimizeChanges(changes);
 };
+
+/**
+ * Collect the inline-content ranges of every leaf text-bearing block (paragraph, heading, …)
+ * whose content overlaps `[from, to)`. Used to clip a node-level `smart` insertion highlight to
+ * the actual added text, so the inserted background/underline never spans structural gaps
+ * (list markers, empty item slots, cell/column boundaries) which would render as phantom rows.
+ */
+const leafTextblockRanges = (doc, from, to) => {
+  const ranges = [];
+  doc.nodesBetween(from, to, (node, pos) => {
+    if (node.isTextblock && node.content.size > 0) {
+      const contentFrom = Math.max(pos + 1, from);
+      const contentTo = Math.min(pos + 1 + node.content.size, to);
+      if (contentTo > contentFrom) {
+        ranges.push([contentFrom, contentTo]);
+      }
+      // Textblocks have no block children to descend into.
+      return false;
+    }
+    return true;
+  });
+  return ranges;
+};
 const calculateNodesForBlockDecoration = ({
   doc,
   from,
@@ -47,12 +89,13 @@ const calculateNodesForBlockDecoration = ({
   isInserted = true,
   activeIndexPos,
   shouldHideDeleted = false,
-  showIndicators = false
+  showIndicators = false,
+  diffType
 }) => {
   const decorations = [];
   // Iterate over the document nodes within the range
   doc.nodesBetween(from, to, (node, pos) => {
-    if (node.isBlock && (!expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true) || pos + node.nodeSize <= to)) {
+    if (node.isBlock && (!isExtendedEnabled(diffType) || pos + node.nodeSize <= to)) {
       const nodeEnd = pos + node.nodeSize;
       const isActive = activeIndexPos && pos === activeIndexPos.from && nodeEnd === activeIndexPos.to;
       decorations.push(...createBlockChangedDecoration({
@@ -66,7 +109,8 @@ const calculateNodesForBlockDecoration = ({
         isActive,
         shouldHideDeleted,
         showIndicators,
-        doc
+        doc,
+        diffType
       }));
     }
   });
@@ -83,7 +127,9 @@ const calculateDiffDecorationsInner = ({
   isInverted = false,
   diffType = 'inline',
   hideDeletedDiffs = false,
-  showIndicators = false
+  showIndicators = false,
+  smartThresholds,
+  deletedDiffPlacement = 'top'
 }) => {
   const {
     originalDoc,
@@ -143,14 +189,16 @@ const calculateDiffDecorationsInner = ({
     steppedDoc,
     diffType,
     tr,
-    steps
+    steps,
+    intl,
+    smartThresholds
   });
   const decorations = [];
 
   /**
    * If showIndicators is on, we create an anchor widget here to mark the doc margin.
    */
-  if (showIndicators && expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
+  if (showIndicators && isExtendedEnabled(diffType)) {
     decorations.push(createDocMarginAnchorWidget());
   }
 
@@ -162,34 +210,68 @@ const calculateDiffDecorationsInner = ({
       // shouldHideDeleted for block/node decorations: suppressed when isInverted + hideDeletedDiffs,
       // or when showGranularWithBlock (block reference widget is shown instead).
       // isInverted gates both — on an inverted diff the inserted side is visually the deleted side.
-      const shouldHideDeleted = expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true) ? isInverted && (hideDeletedDiffs || showGranularWithBlock) && change.deleted.length > 0 : false;
-      decorations.push(...createInlineChangedDecoration({
-        change,
-        doc: tr.doc,
-        colorScheme,
-        isActive,
-        ...(expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true) && {
-          isInserted,
-          shouldHideDeleted,
-          showIndicators
-        })
-      }));
+      const shouldHideDeleted = isExtendedEnabled(diffType) ? isInverted && (hideDeletedDiffs || showGranularWithBlock) && change.deleted.length > 0 : false;
+
+      // For `smart` NODE-level promotions the change range spans a whole container
+      // (e.g. an entire list/table/layout, using outer node bounds). Applying a SINGLE
+      // inline decoration across that whole range would paint the inserted style across
+      // block boundaries and structural gaps (list markers, empty item slots), producing
+      // phantom "empty" rows above the real content. But skipping the inline highlight
+      // entirely leaves added text-bearing blocks (paragraphs/headings inside the added
+      // container) without the inserted background+underline, because block decorations
+      // return no style for paragraph/heading. So for node-level smart changes we instead
+      // emit ONE inline decoration per leaf text-bearing block within the range — the text
+      // gets highlighted, and structural gaps never do.
+      const isSmartNodeLevel = diffType === 'smart' && fg('platform_editor_ai_smart_diff') && smartChangeLevel(change) === 'node';
+      if (isSmartNodeLevel) {
+        for (const [from, to] of leafTextblockRanges(tr.doc, change.fromB, change.toB)) {
+          decorations.push(...createInlineChangedDecoration({
+            change: {
+              fromB: from,
+              toB: to
+            },
+            doc: tr.doc,
+            colorScheme,
+            isActive,
+            diffType,
+            ...(isExtendedEnabled(diffType) && {
+              isInserted,
+              shouldHideDeleted,
+              showIndicators
+            })
+          }));
+        }
+      } else {
+        decorations.push(...createInlineChangedDecoration({
+          change,
+          doc: tr.doc,
+          colorScheme,
+          isActive,
+          diffType,
+          ...(isExtendedEnabled(diffType) && {
+            isInserted,
+            shouldHideDeleted,
+            showIndicators
+          })
+        }));
+      }
       decorations.push(...calculateNodesForBlockDecoration({
         doc: tr.doc,
         from: change.fromB,
         to: change.toB,
         colorScheme,
-        ...(expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true) && {
+        ...(isExtendedEnabled(diffType) && {
           isInserted,
           shouldHideDeleted,
           showIndicators
         }),
         activeIndexPos,
-        intl
+        intl,
+        diffType
       }));
     }
     if (change.deleted.length > 0) {
-      const shouldHideDeleted = expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true) ? !isInverted && (hideDeletedDiffs || showGranularWithBlock) && change.inserted.length > 0 : false;
+      const shouldHideDeleted = isExtendedEnabled(diffType) ? !isInverted && (hideDeletedDiffs || showGranularWithBlock) && change.inserted.length > 0 : false;
       if (!shouldHideDeleted) {
         decorations.push(...createNodeChangedDecorationWidget({
           change,
@@ -199,9 +281,13 @@ const calculateDiffDecorationsInner = ({
           newDoc: tr.doc,
           intl,
           activeIndexPos,
-          ...(expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true) && {
+          ...(isExtendedEnabled(diffType) && {
             isInserted: !isInserted,
-            diffType
+            diffType,
+            // For `smart` node- and paragraph-level changes, optionally render the
+            // deleted content below the new content (gray + strikethrough) instead
+            // of above it. Controlled by `deletedDiffPlacement` (default `'top'`).
+            placeBelow: deletedDiffPlacement === 'bottom' && diffType === 'smart' && fg('platform_editor_ai_smart_diff') && (smartChangeLevel(change) === 'node' || smartChangeLevel(change) === 'paragraph')
           }),
           showIndicators
         }));
@@ -336,7 +422,9 @@ export const calculateDiffDecorations = memoizeOne(calculateDiffDecorationsInner
   isInverted,
   diffType,
   hideDeletedDiffs,
-  showIndicators
+  showIndicators,
+  smartThresholds,
+  deletedDiffPlacement
 }], [{
   pluginState: lastPluginState,
   state: lastState,
@@ -346,13 +434,15 @@ export const calculateDiffDecorations = memoizeOne(calculateDiffDecorationsInner
   isInverted: lastIsInverted,
   diffType: lastDiffType,
   hideDeletedDiffs: lastHideDeletedDiffs,
-  showIndicators: lastShowIndicators
+  showIndicators: lastShowIndicators,
+  smartThresholds: lastSmartThresholds,
+  deletedDiffPlacement: lastDeletedDiffPlacement
 }]) => {
   var _ref2;
   const originalDocIsSame = lastPluginState.originalDoc && pluginState.originalDoc && pluginState.originalDoc.eq(lastPluginState.originalDoc);
-  if (expValEquals('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
+  if (isExtendedEnabled(diffType)) {
     var _ref;
-    return (_ref = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && isEqual(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && showIndicators === lastShowIndicators) !== null && _ref !== void 0 ? _ref : false;
+    return (_ref = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && isEqual(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && showIndicators === lastShowIndicators && isEqual(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement) !== null && _ref !== void 0 ? _ref : false;
   }
   return (_ref2 = originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isEqual(activeIndexPos, lastActiveIndexPos) && hideDeletedDiffs === lastHideDeletedDiffs) !== null && _ref2 !== void 0 ? _ref2 : false;
 });

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

@@ -1,8 +1,9 @@
 /**
- * Finds the position range of the top-level block (direct child of doc) that contains `pos`.
- * Returns null if `pos` is at the doc boundary or outside the doc content.
+ * Finds the position range (outer bounds) of the top-level block (direct child of doc) that
+ * contains the range [from, to]. Shared with the `smart` diff type so its block grouping is
+ * identical to the `block` diff type by construction.
  */
-function getTopLevelBlockAt(doc, from, to) {
+export function getTopLevelBlockAt(doc, from, to) {
   return {
     from: doc.resolve(from).before(1),
     to: doc.resolve(to).after(1)