@atlaskit/editor-plugin-show-diff 5.0.5 → 5.0.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 +9 -0
- package/dist/cjs/pm-plugins/calculateDiffDecorations.js +12 -10
- package/dist/cjs/pm-plugins/decorations/createBlockChangedDecoration.js +75 -0
- package/dist/cjs/pm-plugins/{deletedRowsHandler.js → decorations/createChangedRowDecorationWidgets.js} +31 -52
- package/dist/cjs/pm-plugins/decorations/createInlineChangedDecoration.js +33 -0
- package/dist/cjs/pm-plugins/{decorations.js → decorations/createNodeChangedDecorationWidget.js} +29 -114
- package/dist/cjs/pm-plugins/{attributeDecorations.js → decorations/utils/getAttrChangeRanges.js} +1 -1
- package/dist/cjs/pm-plugins/{deletedBlocksHandler.js → decorations/utils/wrapBlockNodeView.js} +83 -21
- package/dist/es2019/pm-plugins/calculateDiffDecorations.js +6 -4
- package/dist/es2019/pm-plugins/decorations/createBlockChangedDecoration.js +70 -0
- package/dist/es2019/pm-plugins/{deletedRowsHandler.js → decorations/createChangedRowDecorationWidgets.js} +28 -50
- package/dist/es2019/pm-plugins/decorations/createInlineChangedDecoration.js +28 -0
- package/dist/es2019/pm-plugins/{decorations.js → decorations/createNodeChangedDecorationWidget.js} +16 -103
- package/dist/es2019/pm-plugins/{attributeDecorations.js → decorations/utils/getAttrChangeRanges.js} +1 -1
- package/dist/es2019/pm-plugins/{deletedBlocksHandler.js → decorations/utils/wrapBlockNodeView.js} +85 -18
- package/dist/esm/pm-plugins/calculateDiffDecorations.js +6 -4
- package/dist/esm/pm-plugins/decorations/createBlockChangedDecoration.js +69 -0
- package/dist/esm/pm-plugins/{deletedRowsHandler.js → decorations/createChangedRowDecorationWidgets.js} +30 -51
- package/dist/esm/pm-plugins/decorations/createInlineChangedDecoration.js +28 -0
- package/dist/esm/pm-plugins/{decorations.js → decorations/createNodeChangedDecorationWidget.js} +30 -115
- package/dist/esm/pm-plugins/{attributeDecorations.js → decorations/utils/getAttrChangeRanges.js} +1 -1
- package/dist/esm/pm-plugins/{deletedBlocksHandler.js → decorations/utils/wrapBlockNodeView.js} +80 -18
- package/dist/types/pm-plugins/NodeViewSerializer.d.ts +1 -1
- package/dist/types/pm-plugins/calculateDiffDecorations.d.ts +2 -1
- package/dist/types/pm-plugins/decorations/createBlockChangedDecoration.d.ts +16 -0
- package/dist/types/pm-plugins/decorations/createChangedRowDecorationWidgets.d.ts +17 -0
- package/dist/types/pm-plugins/decorations/createInlineChangedDecoration.d.ts +16 -0
- package/dist/types/pm-plugins/decorations/createNodeChangedDecorationWidget.d.ts +15 -0
- package/dist/types/pm-plugins/decorations/utils/wrapBlockNodeView.d.ts +15 -0
- package/dist/types-ts4.5/pm-plugins/NodeViewSerializer.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/calculateDiffDecorations.d.ts +2 -1
- package/dist/types-ts4.5/pm-plugins/decorations/createBlockChangedDecoration.d.ts +16 -0
- package/dist/types-ts4.5/pm-plugins/decorations/createChangedRowDecorationWidgets.d.ts +17 -0
- package/dist/types-ts4.5/pm-plugins/decorations/createInlineChangedDecoration.d.ts +16 -0
- package/dist/types-ts4.5/pm-plugins/decorations/createNodeChangedDecorationWidget.d.ts +15 -0
- package/dist/types-ts4.5/pm-plugins/decorations/utils/wrapBlockNodeView.d.ts +15 -0
- package/package.json +3 -3
- package/dist/types/pm-plugins/decorations.d.ts +0 -46
- package/dist/types/pm-plugins/deletedBlocksHandler.d.ts +0 -14
- package/dist/types/pm-plugins/deletedRowsHandler.d.ts +0 -36
- package/dist/types-ts4.5/pm-plugins/decorations.d.ts +0 -46
- package/dist/types-ts4.5/pm-plugins/deletedBlocksHandler.d.ts +0 -14
- package/dist/types-ts4.5/pm-plugins/deletedRowsHandler.d.ts +0 -36
- /package/dist/cjs/pm-plugins/{colorSchemes → decorations/colorSchemes}/standard.js +0 -0
- /package/dist/cjs/pm-plugins/{colorSchemes → decorations/colorSchemes}/traditional.js +0 -0
- /package/dist/cjs/pm-plugins/{findSafeInsertPos.js → decorations/utils/findSafeInsertPos.js} +0 -0
- /package/dist/cjs/pm-plugins/{markDecorations.js → decorations/utils/getMarkChangeRanges.js} +0 -0
- /package/dist/es2019/pm-plugins/{colorSchemes → decorations/colorSchemes}/standard.js +0 -0
- /package/dist/es2019/pm-plugins/{colorSchemes → decorations/colorSchemes}/traditional.js +0 -0
- /package/dist/es2019/pm-plugins/{findSafeInsertPos.js → decorations/utils/findSafeInsertPos.js} +0 -0
- /package/dist/es2019/pm-plugins/{markDecorations.js → decorations/utils/getMarkChangeRanges.js} +0 -0
- /package/dist/esm/pm-plugins/{colorSchemes → decorations/colorSchemes}/standard.js +0 -0
- /package/dist/esm/pm-plugins/{colorSchemes → decorations/colorSchemes}/traditional.js +0 -0
- /package/dist/esm/pm-plugins/{findSafeInsertPos.js → decorations/utils/findSafeInsertPos.js} +0 -0
- /package/dist/esm/pm-plugins/{markDecorations.js → decorations/utils/getMarkChangeRanges.js} +0 -0
- /package/dist/types/pm-plugins/{colorSchemes → decorations/colorSchemes}/standard.d.ts +0 -0
- /package/dist/types/pm-plugins/{colorSchemes → decorations/colorSchemes}/traditional.d.ts +0 -0
- /package/dist/types/pm-plugins/{findSafeInsertPos.d.ts → decorations/utils/findSafeInsertPos.d.ts} +0 -0
- /package/dist/types/pm-plugins/{attributeDecorations.d.ts → decorations/utils/getAttrChangeRanges.d.ts} +0 -0
- /package/dist/types/pm-plugins/{markDecorations.d.ts → decorations/utils/getMarkChangeRanges.d.ts} +0 -0
- /package/dist/types-ts4.5/pm-plugins/{colorSchemes → decorations/colorSchemes}/standard.d.ts +0 -0
- /package/dist/types-ts4.5/pm-plugins/{colorSchemes → decorations/colorSchemes}/traditional.d.ts +0 -0
- /package/dist/types-ts4.5/pm-plugins/{findSafeInsertPos.d.ts → decorations/utils/findSafeInsertPos.d.ts} +0 -0
- /package/dist/types-ts4.5/pm-plugins/{attributeDecorations.d.ts → decorations/utils/getAttrChangeRanges.d.ts} +0 -0
- /package/dist/types-ts4.5/pm-plugins/{markDecorations.d.ts → decorations/utils/getMarkChangeRanges.d.ts} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-show-diff
|
|
2
2
|
|
|
3
|
+
## 5.0.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`2e27b70a136ed`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2e27b70a136ed) -
|
|
8
|
+
EDITOR-5632: Further refactors to block / row handling - mainly renaming + param change to object
|
|
9
|
+
param to make it more extensible for future work.
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
3
12
|
## 5.0.5
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
|
@@ -13,9 +13,11 @@ 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
|
|
17
|
-
var
|
|
18
|
-
var
|
|
16
|
+
var _createBlockChangedDecoration = require("./decorations/createBlockChangedDecoration");
|
|
17
|
+
var _createInlineChangedDecoration = require("./decorations/createInlineChangedDecoration");
|
|
18
|
+
var _createNodeChangedDecorationWidget = require("./decorations/createNodeChangedDecorationWidget");
|
|
19
|
+
var _getAttrChangeRanges = require("./decorations/utils/getAttrChangeRanges");
|
|
20
|
+
var _getMarkChangeRanges = require("./decorations/utils/getMarkChangeRanges");
|
|
19
21
|
var _simplifyChanges = require("./simplifyChanges");
|
|
20
22
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
|
|
21
23
|
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; } }
|
|
@@ -31,7 +33,7 @@ var calculateNodesForBlockDecoration = function calculateNodesForBlockDecoration
|
|
|
31
33
|
// Iterate over the document nodes within the range
|
|
32
34
|
doc.nodesBetween(from, to, function (node, pos) {
|
|
33
35
|
if (node.isBlock) {
|
|
34
|
-
var decoration = (0,
|
|
36
|
+
var decoration = (0, _createBlockChangedDecoration.createBlockChangedDecoration)({
|
|
35
37
|
change: {
|
|
36
38
|
from: pos,
|
|
37
39
|
to: pos + node.nodeSize,
|
|
@@ -103,7 +105,7 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref2
|
|
|
103
105
|
var step = _step.value;
|
|
104
106
|
var result = step.apply(steppedDoc);
|
|
105
107
|
if (result.failed === null && result.doc) {
|
|
106
|
-
if ((0,
|
|
108
|
+
if ((0, _getAttrChangeRanges.stepIsValidAttrChange)(step, steppedDoc, result.doc)) {
|
|
107
109
|
attrSteps.push(step);
|
|
108
110
|
}
|
|
109
111
|
stepMaps.push(step.getMap());
|
|
@@ -128,7 +130,7 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref2
|
|
|
128
130
|
optimizedChanges.forEach(function (change) {
|
|
129
131
|
var isActive = activeIndexPos && change.fromB >= activeIndexPos.from && change.toB <= activeIndexPos.to;
|
|
130
132
|
if (change.inserted.length > 0) {
|
|
131
|
-
decorations.push((0,
|
|
133
|
+
decorations.push((0, _createInlineChangedDecoration.createInlineChangedDecoration)({
|
|
132
134
|
change: change,
|
|
133
135
|
colorScheme: colorScheme,
|
|
134
136
|
isActive: isActive
|
|
@@ -142,7 +144,7 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref2
|
|
|
142
144
|
}
|
|
143
145
|
if (change.deleted.length > 0) {
|
|
144
146
|
var _isActive = activeIndexPos && change.fromB >= activeIndexPos.from && change.toB <= activeIndexPos.to;
|
|
145
|
-
var decoration = (0,
|
|
147
|
+
var decoration = (0, _createNodeChangedDecorationWidget.createNodeChangedDecorationWidget)({
|
|
146
148
|
change: change,
|
|
147
149
|
doc: originalDoc,
|
|
148
150
|
nodeViewSerializer: nodeViewSerializer,
|
|
@@ -156,15 +158,15 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref2
|
|
|
156
158
|
}
|
|
157
159
|
}
|
|
158
160
|
});
|
|
159
|
-
(0,
|
|
161
|
+
(0, _getMarkChangeRanges.getMarkChangeRanges)(steps).forEach(function (change) {
|
|
160
162
|
var isActive = activeIndexPos && change.fromB >= activeIndexPos.from && change.toB <= activeIndexPos.to;
|
|
161
|
-
decorations.push((0,
|
|
163
|
+
decorations.push((0, _createInlineChangedDecoration.createInlineChangedDecoration)({
|
|
162
164
|
change: change,
|
|
163
165
|
colorScheme: colorScheme,
|
|
164
166
|
isActive: isActive
|
|
165
167
|
}));
|
|
166
168
|
});
|
|
167
|
-
(0,
|
|
169
|
+
(0, _getAttrChangeRanges.getAttrChangeRanges)(tr.doc, attrSteps).forEach(function (change) {
|
|
168
170
|
decorations.push.apply(decorations, (0, _toConsumableArray2.default)(calculateNodesForBlockDecoration({
|
|
169
171
|
doc: tr.doc,
|
|
170
172
|
from: change.fromB,
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.createBlockChangedDecoration = void 0;
|
|
7
|
+
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
8
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
9
|
+
var _standard = require("./colorSchemes/standard");
|
|
10
|
+
var _traditional = require("./colorSchemes/traditional");
|
|
11
|
+
var getNodeClass = function getNodeClass(name) {
|
|
12
|
+
switch (name) {
|
|
13
|
+
case 'extension':
|
|
14
|
+
return 'show-diff-changed-decoration-node';
|
|
15
|
+
default:
|
|
16
|
+
return undefined;
|
|
17
|
+
}
|
|
18
|
+
};
|
|
19
|
+
var getBlockNodeStyle = function getBlockNodeStyle(nodeName, colorScheme) {
|
|
20
|
+
var isTraditional = colorScheme === 'traditional';
|
|
21
|
+
if (['mediaSingle', 'mediaGroup', 'table',
|
|
22
|
+
// Handle table separately to avoid border issues
|
|
23
|
+
'tableRow', 'tableCell', 'tableHeader', 'paragraph',
|
|
24
|
+
// Paragraph and heading nodes do not need special styling
|
|
25
|
+
'heading', 'hardBreak', 'decisionList', 'taskList', 'taskItem', 'bulletList', 'orderedList', 'layoutSection'].includes(nodeName)) {
|
|
26
|
+
// Layout nodes do not need special styling
|
|
27
|
+
return undefined;
|
|
28
|
+
}
|
|
29
|
+
if (['extension', 'embedCard', 'listItem'].includes(nodeName)) {
|
|
30
|
+
return isTraditional ? _traditional.traditionalDecorationMarkerVariable : _standard.standardDecorationMarkerVariable;
|
|
31
|
+
}
|
|
32
|
+
if (nodeName === 'blockquote') {
|
|
33
|
+
return isTraditional ? _traditional.traditionalStyleQuoteNode : _standard.editingStyleQuoteNode;
|
|
34
|
+
}
|
|
35
|
+
if (nodeName === 'rule') {
|
|
36
|
+
return isTraditional ? _traditional.traditionalStyleRuleNode : _standard.editingStyleRuleNode;
|
|
37
|
+
}
|
|
38
|
+
if (nodeName === 'blockCard') {
|
|
39
|
+
return isTraditional ? _traditional.traditionalStyleCardBlockNode : _standard.editingStyleCardBlockNode;
|
|
40
|
+
}
|
|
41
|
+
return isTraditional ? _traditional.traditionalStyleNode : _standard.editingStyleNode;
|
|
42
|
+
};
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* Inline decoration used for insertions as the content already exists in the document
|
|
46
|
+
*
|
|
47
|
+
* @param change Changeset "change" containing information about the change content + range
|
|
48
|
+
* @returns Prosemirror inline decoration
|
|
49
|
+
*/
|
|
50
|
+
var createBlockChangedDecoration = exports.createBlockChangedDecoration = function createBlockChangedDecoration(_ref) {
|
|
51
|
+
var change = _ref.change,
|
|
52
|
+
colorScheme = _ref.colorScheme;
|
|
53
|
+
if ((0, _platformFeatureFlags.fg)('platform_editor_show_diff_scroll_navigation')) {
|
|
54
|
+
var style = getBlockNodeStyle(change.name, colorScheme);
|
|
55
|
+
var className = getNodeClass(change.name);
|
|
56
|
+
if (style || className) {
|
|
57
|
+
return _view.Decoration.node(change.from, change.to, {
|
|
58
|
+
style: style,
|
|
59
|
+
'data-testid': 'show-diff-changed-decoration-node',
|
|
60
|
+
class: className
|
|
61
|
+
}, {
|
|
62
|
+
key: 'diff-block'
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
return undefined;
|
|
66
|
+
} else {
|
|
67
|
+
return _view.Decoration.node(change.from, change.to, {
|
|
68
|
+
style: getBlockNodeStyle(change.name, colorScheme),
|
|
69
|
+
'data-testid': 'show-diff-changed-decoration-node',
|
|
70
|
+
class: getNodeClass(change.name)
|
|
71
|
+
}, {
|
|
72
|
+
key: 'diff-block'
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
};
|
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.
|
|
7
|
+
exports.createChangedRowDecorationWidgets = void 0;
|
|
8
8
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
9
9
|
var _document = require("@atlaskit/editor-common/utils/document");
|
|
10
10
|
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
@@ -12,15 +12,15 @@ var _view = require("@atlaskit/editor-prosemirror/view");
|
|
|
12
12
|
var _tableMap = require("@atlaskit/editor-tables/table-map");
|
|
13
13
|
var _standard = require("./colorSchemes/standard");
|
|
14
14
|
var _traditional = require("./colorSchemes/traditional");
|
|
15
|
-
var _findSafeInsertPos = require("./findSafeInsertPos");
|
|
15
|
+
var _findSafeInsertPos = require("./utils/findSafeInsertPos");
|
|
16
16
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
|
|
17
17
|
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; } }
|
|
18
18
|
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; }
|
|
19
19
|
/**
|
|
20
20
|
* Extracts information about deleted table rows from a change
|
|
21
21
|
*/
|
|
22
|
-
var
|
|
23
|
-
var
|
|
22
|
+
var extractChangedRows = function extractChangedRows(change, originalDoc, newDoc) {
|
|
23
|
+
var changedRows = [];
|
|
24
24
|
|
|
25
25
|
// Find the table in the original document
|
|
26
26
|
var $fromPos = originalDoc.resolve(change.fromA);
|
|
@@ -28,7 +28,7 @@ var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc
|
|
|
28
28
|
return node.type.name === 'table';
|
|
29
29
|
});
|
|
30
30
|
if (!tableOld) {
|
|
31
|
-
return
|
|
31
|
+
return changedRows;
|
|
32
32
|
}
|
|
33
33
|
var oldTableMap = _tableMap.TableMap.get(tableOld.node);
|
|
34
34
|
|
|
@@ -38,18 +38,18 @@ var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc
|
|
|
38
38
|
return node.type.name === 'table';
|
|
39
39
|
});
|
|
40
40
|
if (!tableNew) {
|
|
41
|
-
return
|
|
41
|
+
return changedRows;
|
|
42
42
|
}
|
|
43
43
|
var newTableMap = _tableMap.TableMap.get(tableNew.node);
|
|
44
44
|
|
|
45
|
-
// If no rows were
|
|
45
|
+
// If no rows were changed, return empty
|
|
46
46
|
if (oldTableMap.height <= newTableMap.height ||
|
|
47
47
|
// For now ignore if there are column deletions as well
|
|
48
48
|
oldTableMap.width !== newTableMap.width) {
|
|
49
|
-
return
|
|
49
|
+
return changedRows;
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
// Find which rows were
|
|
52
|
+
// Find which rows were changed by analyzing the change range
|
|
53
53
|
var changeStartInTable = change.fromA - tableOld.pos - 1;
|
|
54
54
|
var changeEndInTable = change.toA - tableOld.pos - 1;
|
|
55
55
|
var currentOffset = 0;
|
|
@@ -64,7 +64,7 @@ var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc
|
|
|
64
64
|
var startOfRow = newTableMap.mapByRow.slice().reverse().find(function (row) {
|
|
65
65
|
return row[0] + tableNew.pos < change.fromB && change.fromB < row[row.length - 1] + tableNew.pos;
|
|
66
66
|
});
|
|
67
|
-
|
|
67
|
+
changedRows.push({
|
|
68
68
|
rowIndex: rowIndex,
|
|
69
69
|
rowNode: rowNode,
|
|
70
70
|
fromA: tableOld.pos + 1 + rowStart,
|
|
@@ -79,9 +79,9 @@ var extractDeletedRows = function extractDeletedRows(change, originalDoc, newDoc
|
|
|
79
79
|
});
|
|
80
80
|
|
|
81
81
|
// Filter changes that never truly got deleted
|
|
82
|
-
return
|
|
82
|
+
return changedRows.filter(function (changedRow) {
|
|
83
83
|
return !tableNew.node.children.some(function (newRow) {
|
|
84
|
-
return (0, _document.areNodesEqualIgnoreAttrs)(newRow,
|
|
84
|
+
return (0, _document.areNodesEqualIgnoreAttrs)(newRow, changedRow.rowNode);
|
|
85
85
|
});
|
|
86
86
|
});
|
|
87
87
|
};
|
|
@@ -115,7 +115,7 @@ var isEmptyRow = function isEmptyRow(rowNode) {
|
|
|
115
115
|
/**
|
|
116
116
|
* Creates a DOM representation of a deleted table row
|
|
117
117
|
*/
|
|
118
|
-
var
|
|
118
|
+
var createChangedRowDOM = function createChangedRowDOM(rowNode, nodeViewSerializer, colorScheme) {
|
|
119
119
|
var tr = document.createElement('tr');
|
|
120
120
|
tr.setAttribute('style', colorScheme === 'traditional' ? _traditional.deletedTraditionalRowStyle : _standard.deletedRowStyle);
|
|
121
121
|
tr.setAttribute('data-testid', 'show-diff-deleted-row');
|
|
@@ -139,19 +139,19 @@ var createDeletedRowDOM = function createDeletedRowDOM(rowNode, nodeViewSerializ
|
|
|
139
139
|
};
|
|
140
140
|
|
|
141
141
|
/**
|
|
142
|
-
* Expands a diff to include whole
|
|
142
|
+
* Expands a diff to include whole changed rows when table rows are affected
|
|
143
143
|
*/
|
|
144
|
-
var
|
|
145
|
-
var
|
|
144
|
+
var expandDiffForChangedRows = function expandDiffForChangedRows(changes, originalDoc, newDoc) {
|
|
145
|
+
var rowInfo = [];
|
|
146
146
|
var _iterator = _createForOfIteratorHelper(changes),
|
|
147
147
|
_step;
|
|
148
148
|
try {
|
|
149
149
|
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
150
150
|
var change = _step.value;
|
|
151
151
|
// Check if this change affects table content
|
|
152
|
-
var
|
|
153
|
-
if (
|
|
154
|
-
|
|
152
|
+
var changedRows = extractChangedRows(change, originalDoc, newDoc);
|
|
153
|
+
if (changedRows.length > 0) {
|
|
154
|
+
rowInfo.push.apply(rowInfo, (0, _toConsumableArray2.default)(changedRows));
|
|
155
155
|
}
|
|
156
156
|
}
|
|
157
157
|
} catch (err) {
|
|
@@ -159,50 +159,29 @@ var expandDiffForDeletedRows = function expandDiffForDeletedRows(changes, origin
|
|
|
159
159
|
} finally {
|
|
160
160
|
_iterator.f();
|
|
161
161
|
}
|
|
162
|
-
return
|
|
162
|
+
return rowInfo;
|
|
163
163
|
};
|
|
164
164
|
|
|
165
165
|
/**
|
|
166
|
-
*
|
|
166
|
+
* Main function to handle deleted rows - computes diff and creates decorations
|
|
167
167
|
*/
|
|
168
|
-
var
|
|
169
|
-
var
|
|
168
|
+
var createChangedRowDecorationWidgets = exports.createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(_ref) {
|
|
169
|
+
var changes = _ref.changes,
|
|
170
170
|
originalDoc = _ref.originalDoc,
|
|
171
171
|
newDoc = _ref.newDoc,
|
|
172
172
|
nodeViewSerializer = _ref.nodeViewSerializer,
|
|
173
173
|
colorScheme = _ref.colorScheme;
|
|
174
|
-
|
|
175
|
-
|
|
174
|
+
// First, expand the changes to include complete deleted rows
|
|
175
|
+
var changedRows = expandDiffForChangedRows(changes.filter(function (change) {
|
|
176
|
+
return change.deleted.length > 0;
|
|
177
|
+
}), originalDoc, newDoc);
|
|
178
|
+
return changedRows.map(function (changedRow) {
|
|
179
|
+
var rowDOM = createChangedRowDOM(changedRow.rowNode, nodeViewSerializer, colorScheme);
|
|
176
180
|
|
|
177
181
|
// Find safe insertion position for the deleted row
|
|
178
|
-
var safeInsertPos = (0, _findSafeInsertPos.findSafeInsertPos)(newDoc,
|
|
182
|
+
var safeInsertPos = (0, _findSafeInsertPos.findSafeInsertPos)(newDoc, changedRow.fromB - 1,
|
|
179
183
|
// -1 to find the first safe position from the table
|
|
180
|
-
originalDoc.slice(
|
|
184
|
+
originalDoc.slice(changedRow.fromA, changedRow.toA));
|
|
181
185
|
return _view.Decoration.widget(safeInsertPos, rowDOM, {});
|
|
182
186
|
});
|
|
183
|
-
};
|
|
184
|
-
|
|
185
|
-
/**
|
|
186
|
-
* Main function to handle deleted rows - computes diff and creates decorations
|
|
187
|
-
*/
|
|
188
|
-
var handleDeletedRows = exports.handleDeletedRows = function handleDeletedRows(_ref2) {
|
|
189
|
-
var changes = _ref2.changes,
|
|
190
|
-
originalDoc = _ref2.originalDoc,
|
|
191
|
-
newDoc = _ref2.newDoc,
|
|
192
|
-
nodeViewSerializer = _ref2.nodeViewSerializer,
|
|
193
|
-
colorScheme = _ref2.colorScheme;
|
|
194
|
-
// First, expand the changes to include complete deleted rows
|
|
195
|
-
var deletedRows = expandDiffForDeletedRows(changes.filter(function (change) {
|
|
196
|
-
return change.deleted.length > 0;
|
|
197
|
-
}), originalDoc, newDoc);
|
|
198
|
-
var allDecorations = createDeletedRowsDecorations({
|
|
199
|
-
deletedRows: deletedRows,
|
|
200
|
-
originalDoc: originalDoc,
|
|
201
|
-
newDoc: newDoc,
|
|
202
|
-
nodeViewSerializer: nodeViewSerializer,
|
|
203
|
-
colorScheme: colorScheme
|
|
204
|
-
});
|
|
205
|
-
return {
|
|
206
|
-
decorations: allDecorations
|
|
207
|
-
};
|
|
208
187
|
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.createInlineChangedDecoration = void 0;
|
|
7
|
+
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
8
|
+
var _standard = require("./colorSchemes/standard");
|
|
9
|
+
var _traditional = require("./colorSchemes/traditional");
|
|
10
|
+
/**
|
|
11
|
+
* Inline decoration used for insertions as the content already exists in the document
|
|
12
|
+
*
|
|
13
|
+
* @param change Changeset "change" containing information about the change content + range
|
|
14
|
+
* @returns Prosemirror inline decoration
|
|
15
|
+
*/
|
|
16
|
+
var createInlineChangedDecoration = exports.createInlineChangedDecoration = function createInlineChangedDecoration(_ref) {
|
|
17
|
+
var change = _ref.change,
|
|
18
|
+
colorScheme = _ref.colorScheme,
|
|
19
|
+
_ref$isActive = _ref.isActive,
|
|
20
|
+
isActive = _ref$isActive === void 0 ? false : _ref$isActive;
|
|
21
|
+
var style;
|
|
22
|
+
if (colorScheme === 'traditional') {
|
|
23
|
+
style = isActive ? _traditional.traditionalInsertStyleActive : _traditional.traditionalInsertStyle;
|
|
24
|
+
} else {
|
|
25
|
+
style = isActive ? _standard.editingStyleActive : _standard.editingStyle;
|
|
26
|
+
}
|
|
27
|
+
return _view.Decoration.inline(change.fromB, change.toB, {
|
|
28
|
+
style: style,
|
|
29
|
+
'data-testid': 'show-diff-changed-decoration'
|
|
30
|
+
}, {
|
|
31
|
+
key: 'diff-inline'
|
|
32
|
+
});
|
|
33
|
+
};
|
package/dist/cjs/pm-plugins/{decorations.js → decorations/createNodeChangedDecorationWidget.js}
RENAMED
|
@@ -3,44 +3,20 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.createNodeChangedDecorationWidget = void 0;
|
|
7
7
|
var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
|
|
8
8
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
9
9
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
10
10
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
11
11
|
var _standard = require("./colorSchemes/standard");
|
|
12
12
|
var _traditional = require("./colorSchemes/traditional");
|
|
13
|
-
var
|
|
14
|
-
var
|
|
15
|
-
var
|
|
16
|
-
|
|
17
|
-
* Inline decoration used for insertions as the content already exists in the document
|
|
18
|
-
*
|
|
19
|
-
* @param change Changeset "change" containing information about the change content + range
|
|
20
|
-
* @returns Prosemirror inline decoration
|
|
21
|
-
*/
|
|
22
|
-
var createInlineChangedDecoration = exports.createInlineChangedDecoration = function createInlineChangedDecoration(_ref) {
|
|
23
|
-
var change = _ref.change,
|
|
24
|
-
colorScheme = _ref.colorScheme,
|
|
25
|
-
_ref$isActive = _ref.isActive,
|
|
26
|
-
isActive = _ref$isActive === void 0 ? false : _ref$isActive;
|
|
27
|
-
var style;
|
|
28
|
-
if (colorScheme === 'traditional') {
|
|
29
|
-
style = isActive ? _traditional.traditionalInsertStyleActive : _traditional.traditionalInsertStyle;
|
|
30
|
-
} else {
|
|
31
|
-
style = isActive ? _standard.editingStyleActive : _standard.editingStyle;
|
|
32
|
-
}
|
|
33
|
-
return _view.Decoration.inline(change.fromB, change.toB, {
|
|
34
|
-
style: style,
|
|
35
|
-
'data-testid': 'show-diff-changed-decoration'
|
|
36
|
-
}, {
|
|
37
|
-
key: 'diff-inline'
|
|
38
|
-
});
|
|
39
|
-
};
|
|
40
|
-
var getDeletedContentStyleUnbounded = exports.getDeletedContentStyleUnbounded = function getDeletedContentStyleUnbounded(colorScheme) {
|
|
13
|
+
var _createChangedRowDecorationWidgets = require("./createChangedRowDecorationWidgets");
|
|
14
|
+
var _findSafeInsertPos = require("./utils/findSafeInsertPos");
|
|
15
|
+
var _wrapBlockNodeView = require("./utils/wrapBlockNodeView");
|
|
16
|
+
var getDeletedContentStyleUnbounded = function getDeletedContentStyleUnbounded(colorScheme) {
|
|
41
17
|
return colorScheme === 'traditional' ? _traditional.deletedTraditionalContentStyleUnbounded : _standard.deletedContentStyleUnbounded;
|
|
42
18
|
};
|
|
43
|
-
var getDeletedContentStyle =
|
|
19
|
+
var getDeletedContentStyle = function getDeletedContentStyle(colorScheme) {
|
|
44
20
|
var isActive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
45
21
|
if (colorScheme === 'traditional') {
|
|
46
22
|
return _traditional.deletedTraditionalContentStyle;
|
|
@@ -50,38 +26,6 @@ var getDeletedContentStyle = exports.getDeletedContentStyle = function getDelete
|
|
|
50
26
|
}
|
|
51
27
|
return (0, _expValEquals.expValEquals)('platform_editor_enghealth_a11y_jan_fixes', 'isEnabled', true) ? _standard.deletedContentStyleNew : _standard.deletedContentStyle;
|
|
52
28
|
};
|
|
53
|
-
var getNodeClass = function getNodeClass(name) {
|
|
54
|
-
switch (name) {
|
|
55
|
-
case 'extension':
|
|
56
|
-
return 'show-diff-changed-decoration-node';
|
|
57
|
-
default:
|
|
58
|
-
return undefined;
|
|
59
|
-
}
|
|
60
|
-
};
|
|
61
|
-
var getBlockNodeStyle = function getBlockNodeStyle(nodeName, colorScheme) {
|
|
62
|
-
var isTraditional = colorScheme === 'traditional';
|
|
63
|
-
if (['mediaSingle', 'mediaGroup', 'table',
|
|
64
|
-
// Handle table separately to avoid border issues
|
|
65
|
-
'tableRow', 'tableCell', 'tableHeader', 'paragraph',
|
|
66
|
-
// Paragraph and heading nodes do not need special styling
|
|
67
|
-
'heading', 'hardBreak', 'decisionList', 'taskList', 'taskItem', 'bulletList', 'orderedList', 'layoutSection'].includes(nodeName)) {
|
|
68
|
-
// Layout nodes do not need special styling
|
|
69
|
-
return undefined;
|
|
70
|
-
}
|
|
71
|
-
if (['extension', 'embedCard', 'listItem'].includes(nodeName)) {
|
|
72
|
-
return isTraditional ? _traditional.traditionalDecorationMarkerVariable : _standard.standardDecorationMarkerVariable;
|
|
73
|
-
}
|
|
74
|
-
if (nodeName === 'blockquote') {
|
|
75
|
-
return isTraditional ? _traditional.traditionalStyleQuoteNode : _standard.editingStyleQuoteNode;
|
|
76
|
-
}
|
|
77
|
-
if (nodeName === 'rule') {
|
|
78
|
-
return isTraditional ? _traditional.traditionalStyleRuleNode : _standard.editingStyleRuleNode;
|
|
79
|
-
}
|
|
80
|
-
if (nodeName === 'blockCard') {
|
|
81
|
-
return isTraditional ? _traditional.traditionalStyleCardBlockNode : _standard.editingStyleCardBlockNode;
|
|
82
|
-
}
|
|
83
|
-
return isTraditional ? _traditional.traditionalStyleNode : _standard.editingStyleNode;
|
|
84
|
-
};
|
|
85
29
|
|
|
86
30
|
/**
|
|
87
31
|
* Wraps content with deleted styling without opacity (for use when content is a direct child of dom)
|
|
@@ -91,39 +35,6 @@ var createDeletedStyleWrapperWithoutOpacity = function createDeletedStyleWrapper
|
|
|
91
35
|
wrapper.setAttribute('style', getDeletedContentStyle(colorScheme, isActive));
|
|
92
36
|
return wrapper;
|
|
93
37
|
};
|
|
94
|
-
|
|
95
|
-
/**
|
|
96
|
-
* Inline decoration used for insertions as the content already exists in the document
|
|
97
|
-
*
|
|
98
|
-
* @param change Changeset "change" containing information about the change content + range
|
|
99
|
-
* @returns Prosemirror inline decoration
|
|
100
|
-
*/
|
|
101
|
-
var createBlockChangedDecoration = exports.createBlockChangedDecoration = function createBlockChangedDecoration(_ref2) {
|
|
102
|
-
var change = _ref2.change,
|
|
103
|
-
colorScheme = _ref2.colorScheme;
|
|
104
|
-
if ((0, _platformFeatureFlags.fg)('platform_editor_show_diff_scroll_navigation')) {
|
|
105
|
-
var style = getBlockNodeStyle(change.name, colorScheme);
|
|
106
|
-
var className = getNodeClass(change.name);
|
|
107
|
-
if (style || className) {
|
|
108
|
-
return _view.Decoration.node(change.from, change.to, {
|
|
109
|
-
style: style,
|
|
110
|
-
'data-testid': 'show-diff-changed-decoration-node',
|
|
111
|
-
class: className
|
|
112
|
-
}, {
|
|
113
|
-
key: 'diff-block'
|
|
114
|
-
});
|
|
115
|
-
}
|
|
116
|
-
return undefined;
|
|
117
|
-
} else {
|
|
118
|
-
return _view.Decoration.node(change.from, change.to, {
|
|
119
|
-
style: getBlockNodeStyle(change.name, colorScheme),
|
|
120
|
-
'data-testid': 'show-diff-changed-decoration-node',
|
|
121
|
-
class: getNodeClass(change.name)
|
|
122
|
-
}, {
|
|
123
|
-
key: 'diff-block'
|
|
124
|
-
});
|
|
125
|
-
}
|
|
126
|
-
};
|
|
127
38
|
var createContentWrapper = function createContentWrapper(colorScheme) {
|
|
128
39
|
var isActive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
129
40
|
var wrapper = document.createElement('span');
|
|
@@ -137,15 +48,15 @@ var createContentWrapper = function createContentWrapper(colorScheme) {
|
|
|
137
48
|
wrapper.append(strikethrough);
|
|
138
49
|
return wrapper;
|
|
139
50
|
};
|
|
140
|
-
var
|
|
141
|
-
var change =
|
|
142
|
-
doc =
|
|
143
|
-
nodeViewSerializer =
|
|
144
|
-
colorScheme =
|
|
145
|
-
newDoc =
|
|
146
|
-
intl =
|
|
147
|
-
|
|
148
|
-
isActive =
|
|
51
|
+
var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidget = function createNodeChangedDecorationWidget(_ref) {
|
|
52
|
+
var change = _ref.change,
|
|
53
|
+
doc = _ref.doc,
|
|
54
|
+
nodeViewSerializer = _ref.nodeViewSerializer,
|
|
55
|
+
colorScheme = _ref.colorScheme,
|
|
56
|
+
newDoc = _ref.newDoc,
|
|
57
|
+
intl = _ref.intl,
|
|
58
|
+
_ref$isActive = _ref.isActive,
|
|
59
|
+
isActive = _ref$isActive === void 0 ? false : _ref$isActive;
|
|
149
60
|
var slice = doc.slice(change.fromA, change.toA);
|
|
150
61
|
if (slice.content.content.length === 0) {
|
|
151
62
|
return;
|
|
@@ -167,15 +78,13 @@ var createDeletedContentDecoration = exports.createDeletedContentDecoration = fu
|
|
|
167
78
|
if (!(0, _platformFeatureFlags.fg)('platform_editor_ai_aifc_patch_ga')) {
|
|
168
79
|
return;
|
|
169
80
|
}
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
decorations = _handleDeletedRows.decorations;
|
|
178
|
-
return decorations;
|
|
81
|
+
return (0, _createChangedRowDecorationWidgets.createChangedRowDecorationWidgets)({
|
|
82
|
+
changes: [change],
|
|
83
|
+
originalDoc: doc,
|
|
84
|
+
newDoc: newDoc,
|
|
85
|
+
nodeViewSerializer: nodeViewSerializer,
|
|
86
|
+
colorScheme: colorScheme
|
|
87
|
+
});
|
|
179
88
|
}
|
|
180
89
|
var serializer = nodeViewSerializer;
|
|
181
90
|
|
|
@@ -253,7 +162,13 @@ var createDeletedContentDecoration = exports.createDeletedContentDecoration = fu
|
|
|
253
162
|
dom.append(wrapper);
|
|
254
163
|
} else {
|
|
255
164
|
// Handle all block nodes with unified function
|
|
256
|
-
(0,
|
|
165
|
+
(0, _wrapBlockNodeView.wrapBlockNodeView)({
|
|
166
|
+
dom: dom,
|
|
167
|
+
nodeView: nodeView,
|
|
168
|
+
targetNode: node,
|
|
169
|
+
colorScheme: colorScheme,
|
|
170
|
+
intl: intl
|
|
171
|
+
});
|
|
257
172
|
}
|
|
258
173
|
} else if (nodeViewSerializer.getFilteredNodeViewBlocklist(['paragraph', 'tableRow']).has(node.type.name)) {
|
|
259
174
|
// Skip the case where the node is a paragraph or table row that way it can still be rendered and delete the entire table
|