@atlaskit/editor-plugin-show-diff 8.4.5 → 8.4.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/dist/cjs/pm-plugins/areDocsEqualByBlockStructureAndText.js +6 -10
- package/dist/cjs/pm-plugins/calculateDiff/calculateDiffDecorations.js +13 -20
- package/dist/cjs/pm-plugins/decorations/createBlockChangedDecoration.js +13 -27
- package/dist/cjs/pm-plugins/decorations/createNodeChangedDecorationWidget.js +12 -34
- package/dist/cjs/pm-plugins/decorations/utils/getAttrChangeRanges.js +30 -32
- package/dist/cjs/pm-plugins/decorations/utils/wrapBlockNodeView.js +5 -9
- package/dist/cjs/pm-plugins/main.js +13 -18
- package/dist/cjs/showDiffPlugin.js +1 -3
- package/dist/es2019/pm-plugins/areDocsEqualByBlockStructureAndText.js +6 -10
- package/dist/es2019/pm-plugins/calculateDiff/calculateDiffDecorations.js +13 -20
- package/dist/es2019/pm-plugins/decorations/createBlockChangedDecoration.js +15 -27
- package/dist/es2019/pm-plugins/decorations/createNodeChangedDecorationWidget.js +10 -32
- package/dist/es2019/pm-plugins/decorations/utils/getAttrChangeRanges.js +24 -26
- package/dist/es2019/pm-plugins/decorations/utils/wrapBlockNodeView.js +6 -10
- package/dist/es2019/pm-plugins/main.js +13 -18
- package/dist/es2019/showDiffPlugin.js +1 -3
- package/dist/esm/pm-plugins/areDocsEqualByBlockStructureAndText.js +6 -10
- package/dist/esm/pm-plugins/calculateDiff/calculateDiffDecorations.js +13 -20
- package/dist/esm/pm-plugins/decorations/createBlockChangedDecoration.js +14 -27
- package/dist/esm/pm-plugins/decorations/createNodeChangedDecorationWidget.js +12 -34
- package/dist/esm/pm-plugins/decorations/utils/getAttrChangeRanges.js +30 -32
- package/dist/esm/pm-plugins/decorations/utils/wrapBlockNodeView.js +6 -10
- package/dist/esm/pm-plugins/main.js +13 -18
- package/dist/esm/showDiffPlugin.js +1 -3
- package/package.json +4 -11
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-show-diff
|
|
2
2
|
|
|
3
|
+
## 8.4.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`5e34be0ba10b6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5e34be0ba10b6) -
|
|
8
|
+
Cleanup show diff experiments
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
3
11
|
## 8.4.5
|
|
4
12
|
|
|
5
13
|
### Patch Changes
|
|
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.areDocsEqualByBlockStructureAndText = areDocsEqualByBlockStructureAndText;
|
|
7
7
|
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
8
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
9
8
|
/**
|
|
10
9
|
* Returns a copy of the document with all marks removed from all text.
|
|
11
10
|
* This normalises mark fragmentation — e.g. annotation marks reordering can split
|
|
@@ -47,13 +46,10 @@ function areDocsEqualByBlockStructureAndText(doc1, doc2) {
|
|
|
47
46
|
if (doc1.textContent !== doc2.textContent) {
|
|
48
47
|
return false;
|
|
49
48
|
}
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
return doc1.nodeSize === doc2.nodeSize && isBlockStructureEqual(stripped1, stripped2);
|
|
57
|
-
}
|
|
58
|
-
return doc1.nodeSize === doc2.nodeSize && isBlockStructureEqual(doc1, doc2);
|
|
49
|
+
// Strip marks before comparing so that mark-driven text fragmentation
|
|
50
|
+
// (e.g. annotation mark reordering producing different childCounts) does not
|
|
51
|
+
// cause false inequalities.
|
|
52
|
+
var stripped1 = stripMarks(doc1);
|
|
53
|
+
var stripped2 = stripMarks(doc2);
|
|
54
|
+
return doc1.nodeSize === doc2.nodeSize && isBlockStructureEqual(stripped1, stripped2);
|
|
59
55
|
}
|
|
@@ -13,7 +13,6 @@ var _memoizeOne = _interopRequireDefault(require("memoize-one"));
|
|
|
13
13
|
var _prosemirrorChangeset = require("prosemirror-changeset");
|
|
14
14
|
var _document = require("@atlaskit/editor-common/utils/document");
|
|
15
15
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
16
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
17
16
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
18
17
|
var _areDocsEqualByBlockStructureAndText = require("../areDocsEqualByBlockStructureAndText");
|
|
19
18
|
var _createBlockChangedDecoration = require("../decorations/createBlockChangedDecoration");
|
|
@@ -131,25 +130,19 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
|
|
|
131
130
|
_iterator.f();
|
|
132
131
|
}
|
|
133
132
|
if (!(0, _document.areNodesEqualIgnoreAttrs)(steppedDoc, tr.doc)) {
|
|
134
|
-
var
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
recoveredViaContentEquality: recoveredViaContentEquality
|
|
145
|
-
}
|
|
146
|
-
});
|
|
147
|
-
}
|
|
148
|
-
if ((0, _platformFeatureFlags.fg)('platform_editor_show_diff_equality_fallback')) {
|
|
149
|
-
if (!recoveredViaContentEquality) {
|
|
150
|
-
return _view.DecorationSet.empty;
|
|
133
|
+
var _api$analytics;
|
|
134
|
+
var recoveredViaContentEquality = (0, _areDocsEqualByBlockStructureAndText.areDocsEqualByBlockStructureAndText)(steppedDoc, tr.doc);
|
|
135
|
+
api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.fireAnalyticsEvent({
|
|
136
|
+
eventType: 'track',
|
|
137
|
+
action: 'nodesNotEqual',
|
|
138
|
+
actionSubject: 'showDiff',
|
|
139
|
+
attributes: {
|
|
140
|
+
docSizeEqual: steppedDoc.nodeSize === tr.doc.nodeSize,
|
|
141
|
+
colorScheme: colorScheme,
|
|
142
|
+
recoveredViaContentEquality: recoveredViaContentEquality
|
|
151
143
|
}
|
|
152
|
-
}
|
|
144
|
+
});
|
|
145
|
+
if (!recoveredViaContentEquality) {
|
|
153
146
|
return _view.DecorationSet.empty;
|
|
154
147
|
}
|
|
155
148
|
}
|
|
@@ -221,7 +214,7 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
|
|
|
221
214
|
}));
|
|
222
215
|
});
|
|
223
216
|
(0, _getAttrChangeRanges.getAttrChangeRanges)(tr.doc, attrSteps).forEach(function (change) {
|
|
224
|
-
if (
|
|
217
|
+
if (change.isInline) {
|
|
225
218
|
// Inline nodes (e.g. date) need an inline decoration rather than a block decoration
|
|
226
219
|
var isActive = activeIndexPos && change.fromB === activeIndexPos.from && change.toB === activeIndexPos.to;
|
|
227
220
|
decorations.push((0, _createInlineChangedDecoration.createInlineChangedDecoration)({
|
|
@@ -1,14 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
6
|
exports.createBlockChangedDecoration = void 0;
|
|
8
|
-
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
9
7
|
var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
|
|
10
8
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
11
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
12
9
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
13
10
|
var _standard = require("./colorSchemes/standard");
|
|
14
11
|
var _traditional = require("./colorSchemes/traditional");
|
|
@@ -35,7 +32,7 @@ var getBlockNodeStyle = function getBlockNodeStyle(_ref) {
|
|
|
35
32
|
// Handle table separately to avoid border issues
|
|
36
33
|
'tableRow', 'paragraph',
|
|
37
34
|
// Paragraph and heading nodes do not need special styling
|
|
38
|
-
'heading', 'hardBreak', 'decisionList', 'taskList'
|
|
35
|
+
'heading', 'hardBreak', 'decisionList', 'taskList', 'bulletList', 'orderedList', 'layoutSection'].includes(nodeName)) {
|
|
39
36
|
// Layout nodes do not need special styling
|
|
40
37
|
return undefined;
|
|
41
38
|
}
|
|
@@ -52,51 +49,51 @@ var getBlockNodeStyle = function getBlockNodeStyle(_ref) {
|
|
|
52
49
|
if (['extension', 'embedCard', 'listItem'].includes(nodeName)) {
|
|
53
50
|
if ((0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
|
|
54
51
|
if (isInserted) {
|
|
55
|
-
return isTraditional && isActive ? _traditional.traditionalDecorationMarkerVariableActive : isTraditional ?
|
|
52
|
+
return isTraditional && isActive ? _traditional.traditionalDecorationMarkerVariableActive : isTraditional ? _traditional.traditionalDecorationMarkerVariableNew : _standard.standardDecorationMarkerVariable;
|
|
56
53
|
} else {
|
|
57
|
-
return isTraditional && isActive ? _traditional.traditionalDeletedDecorationMarkerVariableActive : isTraditional ?
|
|
54
|
+
return isTraditional && isActive ? _traditional.traditionalDeletedDecorationMarkerVariableActive : isTraditional ? _traditional.traditionalDeletedDecorationMarkerVariableNew : _standard.deletedContentStyleNew;
|
|
58
55
|
}
|
|
59
56
|
}
|
|
60
|
-
return isTraditional && isActive ? _traditional.traditionalDecorationMarkerVariableActive : isTraditional ?
|
|
57
|
+
return isTraditional && isActive ? _traditional.traditionalDecorationMarkerVariableActive : isTraditional ? _traditional.traditionalDecorationMarkerVariableNew : _standard.standardDecorationMarkerVariable;
|
|
61
58
|
}
|
|
62
59
|
if (nodeName === 'blockquote') {
|
|
63
60
|
if ((0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
|
|
64
61
|
if (isInserted) {
|
|
65
|
-
return isTraditional ? isActive ? _traditional.traditionalStyleQuoteNodeActive :
|
|
62
|
+
return isTraditional ? isActive ? _traditional.traditionalStyleQuoteNodeActive : _traditional.traditionalStyleQuoteNodeNew : _standard.editingStyleQuoteNode;
|
|
66
63
|
} else {
|
|
67
64
|
return isTraditional ? _traditional.deletedTraditionalStyleQuoteNode : _standard.deletedStyleQuoteNode;
|
|
68
65
|
}
|
|
69
66
|
}
|
|
70
|
-
return isTraditional ? isActive ? _traditional.traditionalStyleQuoteNodeActive :
|
|
67
|
+
return isTraditional ? isActive ? _traditional.traditionalStyleQuoteNodeActive : _traditional.traditionalStyleQuoteNodeNew : _standard.editingStyleQuoteNode;
|
|
71
68
|
}
|
|
72
69
|
if (nodeName === 'rule') {
|
|
73
70
|
if ((0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
|
|
74
71
|
if (isInserted) {
|
|
75
|
-
return isTraditional ? isActive ? _traditional.traditionalStyleRuleNodeActive :
|
|
72
|
+
return isTraditional ? isActive ? _traditional.traditionalStyleRuleNodeActive : _traditional.traditionalStyleRuleNodeNew : _standard.editingStyleRuleNode;
|
|
76
73
|
} else {
|
|
77
74
|
return isTraditional ? (0, _traditional.getDeletedTraditionalInlineStyle)(false) : _standard.deletedContentStyleNew;
|
|
78
75
|
}
|
|
79
76
|
}
|
|
80
|
-
return isTraditional ? isActive ? _traditional.traditionalStyleRuleNodeActive :
|
|
77
|
+
return isTraditional ? isActive ? _traditional.traditionalStyleRuleNodeActive : _traditional.traditionalStyleRuleNodeNew : _standard.editingStyleRuleNode;
|
|
81
78
|
}
|
|
82
79
|
if (nodeName === 'blockCard') {
|
|
83
80
|
if ((0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
|
|
84
81
|
if (isInserted) {
|
|
85
|
-
return isTraditional ? isActive ? _traditional.traditionalStyleCardBlockNodeActive :
|
|
82
|
+
return isTraditional ? isActive ? _traditional.traditionalStyleCardBlockNodeActive : _traditional.traditionalStyleCardBlockNodeNew : _standard.editingStyleCardBlockNode;
|
|
86
83
|
} else {
|
|
87
84
|
return isTraditional ? (0, _traditional.getDeletedTraditionalInlineStyle)(false) : _standard.deletedContentStyleNew;
|
|
88
85
|
}
|
|
89
86
|
}
|
|
90
|
-
return isTraditional ? isActive ? _traditional.traditionalStyleCardBlockNodeActive :
|
|
87
|
+
return isTraditional ? isActive ? _traditional.traditionalStyleCardBlockNodeActive : _traditional.traditionalStyleCardBlockNodeNew : _standard.editingStyleCardBlockNode;
|
|
91
88
|
}
|
|
92
89
|
if ((0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
|
|
93
90
|
if (isInserted) {
|
|
94
|
-
return isTraditional ? isActive ? _traditional.traditionalStyleNodeActive :
|
|
91
|
+
return isTraditional ? isActive ? _traditional.traditionalStyleNodeActive : _traditional.traditionalStyleNodeNew : _standard.editingStyleNode;
|
|
95
92
|
} else {
|
|
96
93
|
return isTraditional ? (0, _traditional.getDeletedTraditionalInlineStyle)(false) : _standard.deletedContentStyleNew;
|
|
97
94
|
}
|
|
98
95
|
}
|
|
99
|
-
return isTraditional ? isActive ? _traditional.traditionalStyleNodeActive :
|
|
96
|
+
return isTraditional ? isActive ? _traditional.traditionalStyleNodeActive : _traditional.traditionalStyleNodeNew : _standard.editingStyleNode;
|
|
100
97
|
};
|
|
101
98
|
|
|
102
99
|
/**
|
|
@@ -151,18 +148,7 @@ var createBlockChangedDecoration = exports.createBlockChangedDecoration = functi
|
|
|
151
148
|
});
|
|
152
149
|
}
|
|
153
150
|
var className = getNodeClass(change.name);
|
|
154
|
-
if (
|
|
155
|
-
if (style || className) {
|
|
156
|
-
decorations.push(_view.Decoration.node(change.from, change.to, {
|
|
157
|
-
style: style,
|
|
158
|
-
'data-testid': 'show-diff-changed-decoration-node',
|
|
159
|
-
class: className
|
|
160
|
-
}, {
|
|
161
|
-
key: 'diff-block',
|
|
162
|
-
nodeName: change.name
|
|
163
|
-
}));
|
|
164
|
-
}
|
|
165
|
-
} else {
|
|
151
|
+
if (style || className) {
|
|
166
152
|
decorations.push(_view.Decoration.node(change.from, change.to, {
|
|
167
153
|
style: style,
|
|
168
154
|
'data-testid': 'show-diff-changed-decoration-node',
|
|
@@ -9,7 +9,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
|
|
|
9
9
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
10
10
|
var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
|
|
11
11
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
12
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
13
12
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
14
13
|
var _standard = require("./colorSchemes/standard");
|
|
15
14
|
var _traditional = require("./colorSchemes/traditional");
|
|
@@ -56,21 +55,6 @@ var getDeletedContentStyle = function getDeletedContentStyle(colorScheme) {
|
|
|
56
55
|
return (0, _expValEquals.expValEquals)('platform_editor_enghealth_a11y_jan_fixes', 'isEnabled', true) ? _standard.deletedContentStyleNew : _standard.deletedContentStyle;
|
|
57
56
|
};
|
|
58
57
|
|
|
59
|
-
/**
|
|
60
|
-
* Wraps content with deleted styling without opacity (for use when content is a direct child of dom)
|
|
61
|
-
*/
|
|
62
|
-
var createDeletedStyleWrapperWithoutOpacity = function createDeletedStyleWrapperWithoutOpacity(colorScheme, isActive) {
|
|
63
|
-
var wrapper = document.createElement('span');
|
|
64
|
-
if ((0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true)) {
|
|
65
|
-
wrapper.setAttribute('style',
|
|
66
|
-
// Merge into existing styles when cleaning up
|
|
67
|
-
getDeletedContentStyle(colorScheme, isActive) + _standard.deletedInlineContentBackground);
|
|
68
|
-
} else {
|
|
69
|
-
wrapper.setAttribute('style', getDeletedContentStyle(colorScheme, isActive));
|
|
70
|
-
}
|
|
71
|
-
return wrapper;
|
|
72
|
-
};
|
|
73
|
-
|
|
74
58
|
/**
|
|
75
59
|
* CSS backgrounds don't work when applied to a wrapper around a paragraph, so
|
|
76
60
|
* the wrapper needs to be injected inside the node around the child content
|
|
@@ -131,7 +115,7 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
|
|
|
131
115
|
_ref2$isInserted = _ref2.isInserted,
|
|
132
116
|
isInserted = _ref2$isInserted === void 0 ? false : _ref2$isInserted;
|
|
133
117
|
var slice = doc.slice(change.fromA, change.toA);
|
|
134
|
-
var shouldSkipDeletedEmptyParagraphDecoration = !isInserted && (slice === null || slice === void 0 || (_slice$content = slice.content) === null || _slice$content === void 0 ? void 0 : _slice$content.childCount) === 1 && (slice === null || slice === void 0 || (_slice$content2 = slice.content) === null || _slice$content2 === void 0 || (_slice$content2 = _slice$content2.firstChild) === null || _slice$content2 === void 0 ? void 0 : _slice$content2.type.name) === 'paragraph' && (slice === null || slice === void 0 || (_slice$content3 = slice.content) === null || _slice$content3 === void 0 || (_slice$content3 = _slice$content3.firstChild) === null || _slice$content3 === void 0 ? void 0 : _slice$content3.content.size) === 0
|
|
118
|
+
var shouldSkipDeletedEmptyParagraphDecoration = !isInserted && (slice === null || slice === void 0 || (_slice$content = slice.content) === null || _slice$content === void 0 ? void 0 : _slice$content.childCount) === 1 && (slice === null || slice === void 0 || (_slice$content2 = slice.content) === null || _slice$content2 === void 0 || (_slice$content2 = _slice$content2.firstChild) === null || _slice$content2 === void 0 ? void 0 : _slice$content2.type.name) === 'paragraph' && (slice === null || slice === void 0 || (_slice$content3 = slice.content) === null || _slice$content3 === void 0 || (_slice$content3 = _slice$content3.firstChild) === null || _slice$content3 === void 0 ? void 0 : _slice$content3.content.size) === 0;
|
|
135
119
|
// Widget decoration used for deletions as the content is not in the document
|
|
136
120
|
// and we want to display the deleted content with a style.
|
|
137
121
|
var safeInsertPos = (0, _findSafeInsertPos.findSafeInsertPos)(newDoc, change.fromB, slice);
|
|
@@ -254,24 +238,18 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
|
|
|
254
238
|
} else {
|
|
255
239
|
var fallbackNode = fallbackSerialization();
|
|
256
240
|
if (fallbackNode) {
|
|
257
|
-
if (
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
dom.append(injectedNode);
|
|
266
|
-
} else {
|
|
267
|
-
var _wrapper2 = createContentWrapper(colorScheme, isActive, isInserted);
|
|
268
|
-
_wrapper2.append(fallbackNode);
|
|
269
|
-
dom.append(_wrapper2);
|
|
270
|
-
}
|
|
241
|
+
if (fallbackNode instanceof HTMLElement) {
|
|
242
|
+
var injectedNode = injectInnerWrapper({
|
|
243
|
+
node: fallbackNode,
|
|
244
|
+
colorScheme: colorScheme,
|
|
245
|
+
isActive: isActive,
|
|
246
|
+
isInserted: isInserted
|
|
247
|
+
});
|
|
248
|
+
dom.append(injectedNode);
|
|
271
249
|
} else {
|
|
272
|
-
var
|
|
273
|
-
|
|
274
|
-
dom.append(
|
|
250
|
+
var _wrapper2 = createContentWrapper(colorScheme, isActive, isInserted);
|
|
251
|
+
_wrapper2.append(fallbackNode);
|
|
252
|
+
dom.append(_wrapper2);
|
|
275
253
|
}
|
|
276
254
|
}
|
|
277
255
|
}
|
|
@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.stepIsValidAttrChange = exports.getAttrChangeRanges = void 0;
|
|
7
7
|
var _steps = require("@atlaskit/adf-schema/steps");
|
|
8
8
|
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
9
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
10
9
|
var filterUndefined = function filterUndefined(x) {
|
|
11
10
|
return !!x;
|
|
12
11
|
};
|
|
@@ -42,39 +41,38 @@ var getAttrChangeRanges = exports.getAttrChangeRanges = function getAttrChangeRa
|
|
|
42
41
|
var stepAttrs = getStepAttrs(step);
|
|
43
42
|
var $pos = doc.resolve(step.pos);
|
|
44
43
|
var nodeAtPos = doc.nodeAt(step.pos);
|
|
45
|
-
if ((0, _expValEquals.expValEquals)('platform_editor_show_diff_improvements', 'isEnabled', true)) {
|
|
46
|
-
// date node: timestamp attribute change — highlight the date node itself (inline)
|
|
47
|
-
if (stepAttrs.some(function (v) {
|
|
48
|
-
return dateAttrs.includes(v);
|
|
49
|
-
}) && (nodeAtPos === null || nodeAtPos === void 0 ? void 0 : nodeAtPos.type.name) === 'date') {
|
|
50
|
-
return {
|
|
51
|
-
fromB: step.pos,
|
|
52
|
-
toB: step.pos + nodeAtPos.nodeSize,
|
|
53
|
-
isInline: true
|
|
54
|
-
};
|
|
55
|
-
}
|
|
56
44
|
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
}
|
|
45
|
+
// date node: timestamp attribute change — highlight the date node itself (inline)
|
|
46
|
+
if (stepAttrs.some(function (v) {
|
|
47
|
+
return dateAttrs.includes(v);
|
|
48
|
+
}) && (nodeAtPos === null || nodeAtPos === void 0 ? void 0 : nodeAtPos.type.name) === 'date') {
|
|
49
|
+
return {
|
|
50
|
+
fromB: step.pos,
|
|
51
|
+
toB: step.pos + nodeAtPos.nodeSize,
|
|
52
|
+
isInline: true
|
|
53
|
+
};
|
|
54
|
+
}
|
|
66
55
|
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
56
|
+
// taskItem node: state attribute change — highlight the taskItem node
|
|
57
|
+
if (stepAttrs.some(function (v) {
|
|
58
|
+
return taskItemAttrs.includes(v);
|
|
59
|
+
}) && (nodeAtPos === null || nodeAtPos === void 0 ? void 0 : nodeAtPos.type.name) === 'taskItem') {
|
|
60
|
+
return {
|
|
61
|
+
fromB: step.pos,
|
|
62
|
+
toB: step.pos + nodeAtPos.nodeSize
|
|
63
|
+
};
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
// extension nodes: any attribute change except localId — highlight the node
|
|
67
|
+
if (nodeAtPos && extensionNodeNames.includes(nodeAtPos.type.name) && stepAttrs.some(function (v) {
|
|
68
|
+
return !extensionExcludedAttrs.includes(v);
|
|
69
|
+
})) {
|
|
70
|
+
var isInline = nodeAtPos.type.name === 'inlineExtension';
|
|
71
|
+
return {
|
|
72
|
+
fromB: step.pos,
|
|
73
|
+
toB: step.pos + nodeAtPos.nodeSize,
|
|
74
|
+
isInline: isInline
|
|
75
|
+
};
|
|
78
76
|
}
|
|
79
77
|
|
|
80
78
|
// media node: id/collection/url attribute change — highlight the mediaSingle parent
|
|
@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.wrapBlockNodeView = void 0;
|
|
7
7
|
var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
|
|
8
8
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
9
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
10
9
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
11
10
|
var _standard = require("../colorSchemes/standard");
|
|
12
11
|
var _traditional = require("../colorSchemes/traditional");
|
|
@@ -87,10 +86,7 @@ var getChangedNodeStyle = function getChangedNodeStyle(nodeName, colorScheme) {
|
|
|
87
86
|
return undefined;
|
|
88
87
|
}
|
|
89
88
|
if (isTraditional) {
|
|
90
|
-
|
|
91
|
-
return isActive ? _traditional.traditionalStyleNodeActive : _traditional.traditionalStyleNodeNew;
|
|
92
|
-
}
|
|
93
|
-
return isActive ? _traditional.traditionalStyleNodeActive : _traditional.traditionalStyleNode;
|
|
89
|
+
return isActive ? _traditional.traditionalStyleNodeActive : _traditional.traditionalStyleNodeNew;
|
|
94
90
|
}
|
|
95
91
|
return _standard.editingStyleNode;
|
|
96
92
|
}
|
|
@@ -103,13 +99,13 @@ var getChangedNodeStyle = function getChangedNodeStyle(nodeName, colorScheme) {
|
|
|
103
99
|
case 'expand':
|
|
104
100
|
case 'decisionList':
|
|
105
101
|
if (isTraditional) {
|
|
106
|
-
return isActive ? _traditional.deletedTraditionalBlockOutlineActive :
|
|
102
|
+
return isActive ? _traditional.deletedTraditionalBlockOutlineActive : _traditional.deletedTraditionalBlockOutlineNew;
|
|
107
103
|
}
|
|
108
104
|
return isActive ? _standard.deletedBlockOutlineActive : _standard.deletedBlockOutline;
|
|
109
105
|
case 'panel':
|
|
110
106
|
case 'codeBlock':
|
|
111
107
|
if (isTraditional) {
|
|
112
|
-
return isActive ? _traditional.deletedTraditionalBlockOutlineRoundedActive :
|
|
108
|
+
return isActive ? _traditional.deletedTraditionalBlockOutlineRoundedActive : _traditional.deletedTraditionalBlockOutlineRoundedNew;
|
|
113
109
|
}
|
|
114
110
|
return isActive ? _standard.deletedBlockOutlineRoundedActive : _standard.deletedBlockOutlineRounded;
|
|
115
111
|
default:
|
|
@@ -152,7 +148,7 @@ var maybeAddDeletedOutlineNewClass = function maybeAddDeletedOutlineNewClass(_re
|
|
|
152
148
|
if (name !== 'mediaSingle' && name !== 'embedCard') {
|
|
153
149
|
return;
|
|
154
150
|
}
|
|
155
|
-
if (colorScheme === 'traditional' && !isActive
|
|
151
|
+
if (colorScheme === 'traditional' && !isActive) {
|
|
156
152
|
nodeView.classList.add('show-diff-deleted-outline-new');
|
|
157
153
|
}
|
|
158
154
|
};
|
|
@@ -176,7 +172,7 @@ var applyCellOverlayStyles = function applyCellOverlayStyles(_ref2) {
|
|
|
176
172
|
isInserted = _ref2.isInserted;
|
|
177
173
|
element.querySelectorAll('td, th').forEach(function (cell) {
|
|
178
174
|
var overlay = document.createElement('span');
|
|
179
|
-
var overlayStyle = colorScheme === 'traditional' ? isInserted ?
|
|
175
|
+
var overlayStyle = colorScheme === 'traditional' ? isInserted ? _traditional.traditionalAddedCellOverlayStyleNew : _traditional.deletedTraditionalCellOverlayStyle : isInserted ? _standard.addedCellOverlayStyle : _standard.deletedCellOverlayStyle;
|
|
180
176
|
overlay.setAttribute('style', overlayStyle);
|
|
181
177
|
cell.appendChild(overlay);
|
|
182
178
|
});
|
|
@@ -11,7 +11,6 @@ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
|
|
|
11
11
|
var _state2 = require("@atlaskit/editor-prosemirror/state");
|
|
12
12
|
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
13
13
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
14
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
15
14
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
16
15
|
var _calculateDiffDecorations = require("./calculateDiff/calculateDiffDecorations");
|
|
17
16
|
var _enforceCustomStepRegisters = require("./enforceCustomStepRegisters");
|
|
@@ -22,9 +21,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
|
|
|
22
21
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
23
22
|
var showDiffPluginKey = exports.showDiffPluginKey = new _state2.PluginKey('showDiffPlugin');
|
|
24
23
|
var createPlugin = exports.createPlugin = function createPlugin(config, getIntl, api) {
|
|
25
|
-
|
|
26
|
-
(0, _enforceCustomStepRegisters.enforceCustomStepRegisters)();
|
|
27
|
-
}
|
|
24
|
+
(0, _enforceCustomStepRegisters.enforceCustomStepRegisters)();
|
|
28
25
|
var nodeViewSerializer = new _NodeViewSerializer.NodeViewSerializer({});
|
|
29
26
|
var setNodeViewSerializer = function setNodeViewSerializer(editorView) {
|
|
30
27
|
nodeViewSerializer.init({
|
|
@@ -65,7 +62,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
|
|
|
65
62
|
nodeViewSerializer: nodeViewSerializer,
|
|
66
63
|
colorScheme: config === null || config === void 0 ? void 0 : config.colorScheme,
|
|
67
64
|
intl: getIntl(),
|
|
68
|
-
activeIndexPos:
|
|
65
|
+
activeIndexPos: newPluginState.activeIndexPos,
|
|
69
66
|
api: api
|
|
70
67
|
}, (0, _expValEquals.expValEquals)('platform_editor_diff_plugin_extended', 'isEnabled', true) ? {
|
|
71
68
|
isInverted: (_newPluginState = newPluginState) === null || _newPluginState === void 0 ? void 0 : _newPluginState.isInverted,
|
|
@@ -84,7 +81,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
|
|
|
84
81
|
diffType: 'inline',
|
|
85
82
|
hideDeletedDiffs: false
|
|
86
83
|
} : {});
|
|
87
|
-
} else if ((
|
|
84
|
+
} 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') {
|
|
88
85
|
// Update the active index in plugin state and recalculate decorations
|
|
89
86
|
var _decorations = (0, _getScrollableDecorations.getScrollableDecorations)(currentPluginState.decorations, newState.doc);
|
|
90
87
|
if (_decorations.length > 0) {
|
|
@@ -170,19 +167,17 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
|
|
|
170
167
|
}
|
|
171
168
|
|
|
172
169
|
// Check for any potential scroll side-effects
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
api === null || api === void 0 || api.core.actions.execute(api.expand.commands.toggleExpandRange(activeDecoration.from, activeDecoration.to, true));
|
|
183
|
-
}
|
|
184
|
-
cancelPendingScrollToDecoration = (0, _scrollToDiff.scrollToActiveDecoration)(view, scrollableDecorations, pluginState.activeIndex);
|
|
170
|
+
var activeIndexChanged = (pluginState === null || pluginState === void 0 ? void 0 : pluginState.activeIndex) !== undefined && pluginState.activeIndex !== previousActiveIndex;
|
|
171
|
+
previousActiveIndex = pluginState === null || pluginState === void 0 ? void 0 : pluginState.activeIndex;
|
|
172
|
+
if ((pluginState === null || pluginState === void 0 ? void 0 : pluginState.activeIndex) !== undefined && activeIndexChanged) {
|
|
173
|
+
var _cancelPendingScrollT2, _api$expand;
|
|
174
|
+
(_cancelPendingScrollT2 = cancelPendingScrollToDecoration) === null || _cancelPendingScrollT2 === void 0 || _cancelPendingScrollT2();
|
|
175
|
+
var scrollableDecorations = (0, _getScrollableDecorations.getScrollableDecorations)(pluginState.decorations, view.state.doc);
|
|
176
|
+
var activeDecoration = scrollableDecorations[pluginState.activeIndex];
|
|
177
|
+
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) {
|
|
178
|
+
api === null || api === void 0 || api.core.actions.execute(api.expand.commands.toggleExpandRange(activeDecoration.from, activeDecoration.to, true));
|
|
185
179
|
}
|
|
180
|
+
cancelPendingScrollToDecoration = (0, _scrollToDiff.scrollToActiveDecoration)(view, scrollableDecorations, pluginState.activeIndex);
|
|
186
181
|
}
|
|
187
182
|
},
|
|
188
183
|
destroy: function destroy() {
|
|
@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.showDiffPlugin = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
10
9
|
var _getScrollableDecorations = require("./pm-plugins/getScrollableDecorations");
|
|
11
10
|
var _main = require("./pm-plugins/main");
|
|
12
11
|
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; }
|
|
@@ -55,7 +54,6 @@ var showDiffPlugin = exports.showDiffPlugin = function showDiffPlugin(_ref) {
|
|
|
55
54
|
}];
|
|
56
55
|
},
|
|
57
56
|
getSharedState: function getSharedState(editorState) {
|
|
58
|
-
var _pluginState$decorati;
|
|
59
57
|
if (!editorState) {
|
|
60
58
|
return {
|
|
61
59
|
isDisplayingChanges: false,
|
|
@@ -63,7 +61,7 @@ var showDiffPlugin = exports.showDiffPlugin = function showDiffPlugin(_ref) {
|
|
|
63
61
|
};
|
|
64
62
|
}
|
|
65
63
|
var pluginState = _main.showDiffPluginKey.getState(editorState);
|
|
66
|
-
var decorationCount = (0,
|
|
64
|
+
var decorationCount = (0, _getScrollableDecorations.getScrollableDecorations)(pluginState === null || pluginState === void 0 ? void 0 : pluginState.decorations, editorState.doc);
|
|
67
65
|
return {
|
|
68
66
|
isDisplayingChanges: decorationCount.length > 0,
|
|
69
67
|
activeIndex: pluginState === null || pluginState === void 0 ? void 0 : pluginState.activeIndex,
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { Transform } from '@atlaskit/editor-prosemirror/transform';
|
|
2
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
3
2
|
|
|
4
3
|
/**
|
|
5
4
|
* Returns a copy of the document with all marks removed from all text.
|
|
@@ -42,13 +41,10 @@ export function areDocsEqualByBlockStructureAndText(doc1, doc2) {
|
|
|
42
41
|
if (doc1.textContent !== doc2.textContent) {
|
|
43
42
|
return false;
|
|
44
43
|
}
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
return doc1.nodeSize === doc2.nodeSize && isBlockStructureEqual(stripped1, stripped2);
|
|
52
|
-
}
|
|
53
|
-
return doc1.nodeSize === doc2.nodeSize && isBlockStructureEqual(doc1, doc2);
|
|
44
|
+
// Strip marks before comparing so that mark-driven text fragmentation
|
|
45
|
+
// (e.g. annotation mark reordering producing different childCounts) does not
|
|
46
|
+
// cause false inequalities.
|
|
47
|
+
const stripped1 = stripMarks(doc1);
|
|
48
|
+
const stripped2 = stripMarks(doc2);
|
|
49
|
+
return doc1.nodeSize === doc2.nodeSize && isBlockStructureEqual(stripped1, stripped2);
|
|
54
50
|
}
|
|
@@ -4,7 +4,6 @@ import memoizeOne from 'memoize-one';
|
|
|
4
4
|
import { ChangeSet, simplifyChanges } from 'prosemirror-changeset';
|
|
5
5
|
import { areNodesEqualIgnoreAttrs } from '@atlaskit/editor-common/utils/document';
|
|
6
6
|
import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
7
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
9
8
|
import { areDocsEqualByBlockStructureAndText } from '../areDocsEqualByBlockStructureAndText';
|
|
10
9
|
import { createBlockChangedDecoration } from '../decorations/createBlockChangedDecoration';
|
|
@@ -110,25 +109,19 @@ const calculateDiffDecorationsInner = ({
|
|
|
110
109
|
// Rather than using .eq() we use a custom function that only checks for structural
|
|
111
110
|
// changes and ignores differences in attributes which don't affect decoration positions
|
|
112
111
|
if (!areNodesEqualIgnoreAttrs(steppedDoc, tr.doc)) {
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
recoveredViaContentEquality
|
|
124
|
-
}
|
|
125
|
-
});
|
|
126
|
-
}
|
|
127
|
-
if (fg('platform_editor_show_diff_equality_fallback')) {
|
|
128
|
-
if (!recoveredViaContentEquality) {
|
|
129
|
-
return DecorationSet.empty;
|
|
112
|
+
var _api$analytics;
|
|
113
|
+
const recoveredViaContentEquality = areDocsEqualByBlockStructureAndText(steppedDoc, tr.doc);
|
|
114
|
+
api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent({
|
|
115
|
+
eventType: 'track',
|
|
116
|
+
action: 'nodesNotEqual',
|
|
117
|
+
actionSubject: 'showDiff',
|
|
118
|
+
attributes: {
|
|
119
|
+
docSizeEqual: steppedDoc.nodeSize === tr.doc.nodeSize,
|
|
120
|
+
colorScheme,
|
|
121
|
+
recoveredViaContentEquality
|
|
130
122
|
}
|
|
131
|
-
}
|
|
123
|
+
});
|
|
124
|
+
if (!recoveredViaContentEquality) {
|
|
132
125
|
return DecorationSet.empty;
|
|
133
126
|
}
|
|
134
127
|
}
|
|
@@ -202,7 +195,7 @@ const calculateDiffDecorationsInner = ({
|
|
|
202
195
|
}));
|
|
203
196
|
});
|
|
204
197
|
getAttrChangeRanges(tr.doc, attrSteps).forEach(change => {
|
|
205
|
-
if (
|
|
198
|
+
if (change.isInline) {
|
|
206
199
|
// Inline nodes (e.g. date) need an inline decoration rather than a block decoration
|
|
207
200
|
const isActive = activeIndexPos && change.fromB === activeIndexPos.from && change.toB === activeIndexPos.to;
|
|
208
201
|
decorations.push(createInlineChangedDecoration({
|