@atlaskit/editor-plugin-show-diff 16.0.14 → 16.0.16
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 +18 -0
- package/dist/cjs/pm-plugins/calculateDiff/calculateDiffDecorations.js +1 -1
- package/dist/cjs/pm-plugins/decorations/createChangedRowDecorationWidgets.js +91 -28
- package/dist/cjs/pm-plugins/decorations/createNodeChangedDecorationWidget.js +5 -1
- package/dist/cjs/ui/ContributorTag/buildContributorTagDom.js +5 -4
- package/dist/es2019/pm-plugins/calculateDiff/calculateDiffDecorations.js +1 -1
- package/dist/es2019/pm-plugins/decorations/createChangedRowDecorationWidgets.js +70 -13
- package/dist/es2019/pm-plugins/decorations/createNodeChangedDecorationWidget.js +5 -1
- package/dist/es2019/ui/ContributorTag/buildContributorTagDom.js +5 -4
- package/dist/esm/pm-plugins/calculateDiff/calculateDiffDecorations.js +1 -1
- package/dist/esm/pm-plugins/decorations/createChangedRowDecorationWidgets.js +92 -29
- package/dist/esm/pm-plugins/decorations/createNodeChangedDecorationWidget.js +5 -1
- package/dist/esm/ui/ContributorTag/buildContributorTagDom.js +5 -4
- package/dist/types/pm-plugins/decorations/createChangedRowDecorationWidgets.d.ts +6 -1
- package/dist/types/ui/ContributorTag/buildContributorTagDom.d.ts +4 -4
- package/package.json +2 -2
- package/dist/cjs/pm-plugins/areDocsEqualByBlockStructureAndText.js +0 -55
- package/dist/es2019/pm-plugins/areDocsEqualByBlockStructureAndText.js +0 -50
- package/dist/esm/pm-plugins/areDocsEqualByBlockStructureAndText.js +0 -50
- package/dist/types/pm-plugins/areDocsEqualByBlockStructureAndText.d.ts +0 -12
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,23 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-show-diff
|
|
2
2
|
|
|
3
|
+
## 16.0.16
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`b56b3a7dbfb5a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b56b3a7dbfb5a) -
|
|
8
|
+
[ux] Show contributor tags at the top-left of removed table rows and above table interaction
|
|
9
|
+
overlays and sticky header rows. Behind `confluence_ncs_step_diffing_version_history`.
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
12
|
+
## 16.0.15
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- [`442abbe2a88e0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/442abbe2a88e0) -
|
|
17
|
+
Normalize documents before relaxed show-diff comparisons when Confluence version-history diffing
|
|
18
|
+
is enabled.
|
|
19
|
+
- Updated dependencies
|
|
20
|
+
|
|
3
21
|
## 16.0.14
|
|
4
22
|
|
|
5
23
|
### Patch Changes
|
|
@@ -11,13 +11,13 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
11
11
|
var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
|
|
12
12
|
var _memoizeOne = _interopRequireDefault(require("memoize-one"));
|
|
13
13
|
var _prosemirrorChangeset = require("prosemirror-changeset");
|
|
14
|
+
var _areDocsEqualByBlockStructureAndText = require("@atlaskit/editor-common/utils/areDocsEqualByBlockStructureAndText");
|
|
14
15
|
var _document = require("@atlaskit/editor-common/utils/document");
|
|
15
16
|
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
16
17
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
17
18
|
var _unsafeExpValNoExposure = require("@atlaskit/platform-feature-experiments/unsafe-exp-val-no-exposure");
|
|
18
19
|
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
19
20
|
var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
|
|
20
|
-
var _areDocsEqualByBlockStructureAndText = require("../areDocsEqualByBlockStructureAndText");
|
|
21
21
|
var _createAnchorDecorationWidgets = require("../decorations/createAnchorDecorationWidgets");
|
|
22
22
|
var _createBlockChangedDecoration = require("../decorations/createBlockChangedDecoration");
|
|
23
23
|
var _createInlineChangedDecoration = require("../decorations/createInlineChangedDecoration");
|
|
@@ -19,6 +19,7 @@ var _factory = require("./colorSchemes/factory");
|
|
|
19
19
|
var _schemes = require("./colorSchemes/schemes");
|
|
20
20
|
var _createAnchorDecorationWidgets = require("./createAnchorDecorationWidgets");
|
|
21
21
|
var _createChangedRowDecorationWidgetsStyles = require("./createChangedRowDecorationWidgets.styles.legacy");
|
|
22
|
+
var _createContributorTagWidget = require("./createContributorTagWidget");
|
|
22
23
|
var _decorationKeys = require("./decorationKeys");
|
|
23
24
|
var _findSafeInsertPos = require("./utils/findSafeInsertPos");
|
|
24
25
|
var _tableCellEdgeAttrs = require("./utils/tableCellEdgeAttrs");
|
|
@@ -105,20 +106,40 @@ var extractChangedRows = function extractChangedRows(_ref) {
|
|
|
105
106
|
}
|
|
106
107
|
});
|
|
107
108
|
|
|
108
|
-
// Filter changes that never truly got deleted
|
|
109
|
+
// Filter changes that never truly got deleted. Compare the number of equivalent rows rather
|
|
110
|
+
// than only checking whether one still exists: deleting two of three identical empty rows should
|
|
111
|
+
// retain two changed rows even though the third remains in the new table.
|
|
112
|
+
var equivalentRowDeletionCounts = [];
|
|
109
113
|
return changedRows.filter(function (changedRow) {
|
|
110
114
|
// A replacement leaves every sibling row in place, so asking "does this row still exist
|
|
111
115
|
// ANYWHERE in the new table?" can drop a genuinely rewritten row that happens to match a
|
|
112
|
-
// sibling. Compare it against the row at the same index instead.
|
|
113
|
-
// whole-table `some()`: their indices shift, so an index comparison would let every
|
|
114
|
-
// surviving row through and draw a widget for each one.
|
|
116
|
+
// sibling. Compare it against the row at the same index instead.
|
|
115
117
|
if (handleRowReplacement) {
|
|
116
118
|
var counterpart = tableNew.node.maybeChild(changedRow.rowIndex);
|
|
117
119
|
return !counterpart || !(0, _document.areNodesEqualIgnoreAttrs)(counterpart, changedRow.rowNode);
|
|
118
120
|
}
|
|
119
|
-
|
|
120
|
-
|
|
121
|
+
var deletionCount = equivalentRowDeletionCounts.find(function (_ref2) {
|
|
122
|
+
var rowNode = _ref2.rowNode;
|
|
123
|
+
return (0, _document.areNodesEqualIgnoreAttrs)(rowNode, changedRow.rowNode);
|
|
121
124
|
});
|
|
125
|
+
if (!deletionCount) {
|
|
126
|
+
var oldRowCount = tableOld.node.children.filter(function (oldRow) {
|
|
127
|
+
return (0, _document.areNodesEqualIgnoreAttrs)(oldRow, changedRow.rowNode);
|
|
128
|
+
}).length;
|
|
129
|
+
var newRowCount = tableNew.node.children.filter(function (newRow) {
|
|
130
|
+
return (0, _document.areNodesEqualIgnoreAttrs)(newRow, changedRow.rowNode);
|
|
131
|
+
}).length;
|
|
132
|
+
deletionCount = {
|
|
133
|
+
remaining: Math.max(0, oldRowCount - newRowCount),
|
|
134
|
+
rowNode: changedRow.rowNode
|
|
135
|
+
};
|
|
136
|
+
equivalentRowDeletionCounts.push(deletionCount);
|
|
137
|
+
}
|
|
138
|
+
if (deletionCount.remaining === 0) {
|
|
139
|
+
return false;
|
|
140
|
+
}
|
|
141
|
+
deletionCount.remaining--;
|
|
142
|
+
return true;
|
|
122
143
|
});
|
|
123
144
|
};
|
|
124
145
|
|
|
@@ -201,11 +222,11 @@ var createChangedRowDOM = function createChangedRowDOM(rowNode, cellEdgeAttrs, n
|
|
|
201
222
|
/**
|
|
202
223
|
* Expands a diff to include whole changed rows when table rows are affected
|
|
203
224
|
*/
|
|
204
|
-
var expandDiffForChangedRows = function expandDiffForChangedRows(
|
|
205
|
-
var changes =
|
|
206
|
-
originalDoc =
|
|
207
|
-
newDoc =
|
|
208
|
-
diffType =
|
|
225
|
+
var expandDiffForChangedRows = function expandDiffForChangedRows(_ref3) {
|
|
226
|
+
var changes = _ref3.changes,
|
|
227
|
+
originalDoc = _ref3.originalDoc,
|
|
228
|
+
newDoc = _ref3.newDoc,
|
|
229
|
+
diffType = _ref3.diffType;
|
|
209
230
|
var rowInfo = [];
|
|
210
231
|
var _iterator = _createForOfIteratorHelper(changes),
|
|
211
232
|
_step;
|
|
@@ -234,17 +255,22 @@ var expandDiffForChangedRows = function expandDiffForChangedRows(_ref2) {
|
|
|
234
255
|
/**
|
|
235
256
|
* Main function to handle deleted rows - computes diff and creates decorations
|
|
236
257
|
*/
|
|
237
|
-
var createChangedRowDecorationWidgets = exports.createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(
|
|
238
|
-
var
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
258
|
+
var createChangedRowDecorationWidgets = exports.createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(_ref4) {
|
|
259
|
+
var attributionKey = _ref4.attributionKey,
|
|
260
|
+
changes = _ref4.changes,
|
|
261
|
+
originalDoc = _ref4.originalDoc,
|
|
262
|
+
newDoc = _ref4.newDoc,
|
|
263
|
+
nodeViewSerializer = _ref4.nodeViewSerializer,
|
|
264
|
+
colorScheme = _ref4.colorScheme,
|
|
265
|
+
isActive = _ref4.isActive,
|
|
266
|
+
_ref4$isInserted = _ref4.isInserted,
|
|
267
|
+
isInserted = _ref4$isInserted === void 0 ? false : _ref4$isInserted,
|
|
268
|
+
diffType = _ref4.diffType,
|
|
269
|
+
_ref4$showIndicators = _ref4.showIndicators,
|
|
270
|
+
showIndicators = _ref4$showIndicators === void 0 ? false : _ref4$showIndicators,
|
|
271
|
+
_ref4$showContributor = _ref4.showContributorTags,
|
|
272
|
+
showContributorTags = _ref4$showContributor === void 0 ? false : _ref4$showContributor,
|
|
273
|
+
tagMountContext = _ref4.tagMountContext;
|
|
248
274
|
// First, expand the changes to include complete deleted rows
|
|
249
275
|
var changedRows = expandDiffForChangedRows({
|
|
250
276
|
changes: changes.filter(function (change) {
|
|
@@ -261,8 +287,12 @@ var createChangedRowDecorationWidgets = exports.createChangedRowDecorationWidget
|
|
|
261
287
|
var safeInsertPos = (0, _findSafeInsertPos.findSafeInsertPos)(newDoc, changedRow.fromB - 1,
|
|
262
288
|
// -1 to find the first safe position from the table
|
|
263
289
|
originalDoc.slice(changedRow.fromA, changedRow.toA));
|
|
264
|
-
|
|
290
|
+
|
|
291
|
+
// Stable while contributor tags are enabled so a decoration recalculation preserves the tag's
|
|
292
|
+
// identity and controller state.
|
|
293
|
+
var diffId = showContributorTags ? "widget-row-".concat(changedRow.fromA, "-").concat(changedRow.toA) : crypto.randomUUID();
|
|
265
294
|
var decorations = [];
|
|
295
|
+
var rowAnchorNames = [];
|
|
266
296
|
|
|
267
297
|
// `IndicatorBarContentComponent` renders a bar for every widget descriptor and anchors its
|
|
268
298
|
// top and bottom to `anchor-<diffId>`. Without an element carrying that anchor name the bar
|
|
@@ -270,9 +300,9 @@ var createChangedRowDecorationWidgets = exports.createChangedRowDecorationWidget
|
|
|
270
300
|
// bar covers only the row being changed. `createNodeChangedDecorationWidget` sets the same
|
|
271
301
|
// property on its own widget DOM for non-table content; this path returns before reaching it.
|
|
272
302
|
if (showIndicators && (0, _isExtendedEnabled.isExtendedEnabled)(diffType) && (0, _fg.fg)('platform_editor_ai_show_diff_patch_1')) {
|
|
273
|
-
|
|
303
|
+
rowAnchorNames.push((0, _decorationKeys.buildAnchorDecorationKey)({
|
|
274
304
|
diffId: diffId
|
|
275
|
-
}))
|
|
305
|
+
}));
|
|
276
306
|
|
|
277
307
|
// A table's content can extend past the doc margin, so the bar also needs a left anchor
|
|
278
308
|
// measured against the table itself or it is clipped once the table is resized.
|
|
@@ -285,14 +315,47 @@ var createChangedRowDecorationWidgets = exports.createChangedRowDecorationWidget
|
|
|
285
315
|
decorations.push(leftAnchor);
|
|
286
316
|
}
|
|
287
317
|
}
|
|
288
|
-
|
|
318
|
+
var tagAnchorName = showContributorTags && (0, _createContributorTagWidget.isContributorTagWidgetEnabled)() ? (0, _decorationKeys.buildAnchorDecorationKey)({
|
|
319
|
+
diffId: diffId,
|
|
320
|
+
anchorType: _decorationKeys.AnchorTypeKey.tag
|
|
321
|
+
}) : undefined;
|
|
322
|
+
var tagWidget = tagAnchorName ? (0, _createContributorTagWidget.createContributorTagWidget)({
|
|
323
|
+
anchorAtRangeStart: true,
|
|
324
|
+
anchorName: tagAnchorName,
|
|
325
|
+
diffId: diffId,
|
|
326
|
+
doc: newDoc,
|
|
327
|
+
from: safeInsertPos,
|
|
328
|
+
mountContext: tagMountContext,
|
|
329
|
+
to: safeInsertPos
|
|
330
|
+
}) : undefined;
|
|
331
|
+
if (tagAnchorName) {
|
|
332
|
+
// The tag host is a separate, table-safe widget. CSS anchor positioning aligns it to this
|
|
333
|
+
// synthetic row without placing non-cell DOM inside the `<tr>` or inheriting its deletion
|
|
334
|
+
// opacity and strikethrough.
|
|
335
|
+
rowAnchorNames.push(tagAnchorName);
|
|
336
|
+
}
|
|
337
|
+
if (rowAnchorNames.length > 0) {
|
|
338
|
+
rowDOM.style.setProperty('anchor-name', rowAnchorNames.map(function (anchorName) {
|
|
339
|
+
return "--".concat(anchorName);
|
|
340
|
+
}).join(', '));
|
|
341
|
+
}
|
|
342
|
+
if (tagWidget) {
|
|
343
|
+
// Lets the contributor tag reveal when any part of the deleted row is hovered.
|
|
344
|
+
rowDOM.setAttribute('data-diff-id', diffId);
|
|
345
|
+
}
|
|
346
|
+
var rowWidget = _view.Decoration.widget(safeInsertPos, rowDOM, _objectSpread({}, (0, _decorationKeys.buildDiffDecorationSpec)({
|
|
347
|
+
attributionKey: tagWidget ? attributionKey : undefined,
|
|
289
348
|
colorScheme: colorScheme,
|
|
290
349
|
decorationType: 'widget',
|
|
291
350
|
diffId: diffId,
|
|
292
|
-
isActive:
|
|
351
|
+
isActive: isActive,
|
|
293
352
|
isInserted: isInserted,
|
|
294
353
|
diffType: diffType
|
|
295
|
-
})))
|
|
354
|
+
})));
|
|
355
|
+
decorations.push(rowWidget);
|
|
356
|
+
if (tagWidget) {
|
|
357
|
+
decorations.push(tagWidget);
|
|
358
|
+
}
|
|
296
359
|
return decorations;
|
|
297
360
|
});
|
|
298
361
|
};
|
|
@@ -166,16 +166,20 @@ var createNodeChangedDecorationWidget = exports.createNodeChangedDecorationWidge
|
|
|
166
166
|
}
|
|
167
167
|
if (isTableRowContent) {
|
|
168
168
|
return (0, _createChangedRowDecorationWidgets.createChangedRowDecorationWidgets)({
|
|
169
|
+
attributionKey: attributionKey,
|
|
169
170
|
changes: [change],
|
|
170
171
|
originalDoc: doc,
|
|
171
172
|
newDoc: newDoc,
|
|
172
173
|
nodeViewSerializer: nodeViewSerializer,
|
|
173
174
|
colorScheme: colorScheme,
|
|
175
|
+
isActive: isActive,
|
|
174
176
|
isInserted: isInserted,
|
|
175
177
|
diffType: diffType,
|
|
176
178
|
// Needed for the row's own indicator anchor; this path returns before the
|
|
177
179
|
// `anchor-name` assignment further down.
|
|
178
|
-
showIndicators: showIndicators
|
|
180
|
+
showIndicators: showIndicators,
|
|
181
|
+
showContributorTags: showContributorTags,
|
|
182
|
+
tagMountContext: tagMountContext
|
|
179
183
|
});
|
|
180
184
|
}
|
|
181
185
|
var serializer = nodeViewSerializer;
|
|
@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.buildContributorTagDom = exports.TAG_EXIT_FALLBACK_MS = exports.MAX_TAG_WIDTH = exports.CONTRIBUTOR_TAG_Z_INDEX = exports.CONTRIBUTOR_TAG_TOOLTIP_STYLES = exports.CONTRIBUTOR_TAG_TESTID = exports.CONTRIBUTOR_TAG_REVEALED_ATTRIBUTE = exports.CONTRIBUTOR_TAG_NAME_TESTID = exports.CONTRIBUTOR_TAG_CLASS = void 0;
|
|
8
8
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
9
9
|
var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
|
|
10
|
+
var _constants = require("@atlaskit/editor-shared-styles/constants");
|
|
10
11
|
var CONTRIBUTOR_TAG_TESTID = exports.CONTRIBUTOR_TAG_TESTID = 'diff-contributor-tag';
|
|
11
12
|
var CONTRIBUTOR_TAG_NAME_TESTID = exports.CONTRIBUTOR_TAG_NAME_TESTID = 'diff-contributor-tag-name';
|
|
12
13
|
|
|
@@ -20,15 +21,15 @@ var MAX_TAG_WIDTH = exports.MAX_TAG_WIDTH = '200px';
|
|
|
20
21
|
/**
|
|
21
22
|
* The tag sits on the line above the change, so it has to paint over that line to be readable —
|
|
22
23
|
* including any diff highlight already on it, which would otherwise slice straight through the tag.
|
|
23
|
-
*
|
|
24
|
-
* change's own highlight is stacked one level below it — see
|
|
25
|
-
* `createInlineChangedDecoration`.
|
|
24
|
+
* It also has to paint above table interaction overlays and sticky-capable header rows, which use
|
|
25
|
+
* `akEditorSmallZIndex`. The change's own highlight is stacked one level below it — see
|
|
26
|
+
* `stackBelowContributorTagStyle` in `createInlineChangedDecoration`.
|
|
26
27
|
*
|
|
27
28
|
* Painting above its own highlight is only safe because the tag can never reach it: `bottom: 100%`
|
|
28
29
|
* puts the root's bottom edge exactly on the highlight's top edge, and the root's `overflow: clip`
|
|
29
30
|
* keeps every pixel the tag paints inside it.
|
|
30
31
|
*/
|
|
31
|
-
var CONTRIBUTOR_TAG_Z_INDEX = exports.CONTRIBUTOR_TAG_Z_INDEX =
|
|
32
|
+
var CONTRIBUTOR_TAG_Z_INDEX = exports.CONTRIBUTOR_TAG_Z_INDEX = _constants.akEditorSmallZIndex + 1;
|
|
32
33
|
|
|
33
34
|
/**
|
|
34
35
|
* The plugin's whole side of the tag's motion: the fade and the hidden state are
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import isEqual from 'lodash/isEqual';
|
|
2
2
|
import memoizeOne from 'memoize-one';
|
|
3
3
|
import { ChangeSet, simplifyChanges } from 'prosemirror-changeset';
|
|
4
|
+
import { areDocsEqualByBlockStructureAndText } from '@atlaskit/editor-common/utils/areDocsEqualByBlockStructureAndText';
|
|
4
5
|
import { areNodesEqualIgnoreAttrs } from '@atlaskit/editor-common/utils/document';
|
|
5
6
|
import { Mapping } from '@atlaskit/editor-prosemirror/transform';
|
|
6
7
|
import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
|
|
7
8
|
import { UNSAFE_expValNoExposure } from '@atlaskit/platform-feature-experiments/unsafe-exp-val-no-exposure';
|
|
8
9
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
9
10
|
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
10
|
-
import { areDocsEqualByBlockStructureAndText } from '../areDocsEqualByBlockStructureAndText';
|
|
11
11
|
import { createDocMarginAnchorWidget } from '../decorations/createAnchorDecorationWidgets';
|
|
12
12
|
import { createBlockChangedDecoration } from '../decorations/createBlockChangedDecoration';
|
|
13
13
|
import { createInlineChangedDecoration } from '../decorations/createInlineChangedDecoration';
|
|
@@ -10,7 +10,8 @@ import { buildAddedCellOverlayRoundedStyle, buildAddedCellOverlayStyle, buildDel
|
|
|
10
10
|
import { colorSchemeRegistry, getLegacyColorScheme } from './colorSchemes/schemes';
|
|
11
11
|
import { createLeftAnchorWidget } from './createAnchorDecorationWidgets';
|
|
12
12
|
import { resolveCellOverlayStyleLegacy, resolveDeletedRowStyleLegacy } from './createChangedRowDecorationWidgets.styles.legacy';
|
|
13
|
-
import {
|
|
13
|
+
import { createContributorTagWidget, isContributorTagWidgetEnabled } from './createContributorTagWidget';
|
|
14
|
+
import { AnchorTypeKey, buildAnchorDecorationKey, buildDiffDecorationSpec } from './decorationKeys';
|
|
14
15
|
import { findSafeInsertPos } from './utils/findSafeInsertPos';
|
|
15
16
|
import { applyCellEdgeAttrs, getRowCellEdgeAttrs, getTableTopAndBottomCellEdgeAttrs } from './utils/tableCellEdgeAttrs';
|
|
16
17
|
/**
|
|
@@ -86,18 +87,35 @@ const extractChangedRows = ({
|
|
|
86
87
|
}
|
|
87
88
|
});
|
|
88
89
|
|
|
89
|
-
// Filter changes that never truly got deleted
|
|
90
|
+
// Filter changes that never truly got deleted. Compare the number of equivalent rows rather
|
|
91
|
+
// than only checking whether one still exists: deleting two of three identical empty rows should
|
|
92
|
+
// retain two changed rows even though the third remains in the new table.
|
|
93
|
+
const equivalentRowDeletionCounts = [];
|
|
90
94
|
return changedRows.filter(changedRow => {
|
|
91
95
|
// A replacement leaves every sibling row in place, so asking "does this row still exist
|
|
92
96
|
// ANYWHERE in the new table?" can drop a genuinely rewritten row that happens to match a
|
|
93
|
-
// sibling. Compare it against the row at the same index instead.
|
|
94
|
-
// whole-table `some()`: their indices shift, so an index comparison would let every
|
|
95
|
-
// surviving row through and draw a widget for each one.
|
|
97
|
+
// sibling. Compare it against the row at the same index instead.
|
|
96
98
|
if (handleRowReplacement) {
|
|
97
99
|
const counterpart = tableNew.node.maybeChild(changedRow.rowIndex);
|
|
98
100
|
return !counterpart || !areNodesEqualIgnoreAttrs(counterpart, changedRow.rowNode);
|
|
99
101
|
}
|
|
100
|
-
|
|
102
|
+
let deletionCount = equivalentRowDeletionCounts.find(({
|
|
103
|
+
rowNode
|
|
104
|
+
}) => areNodesEqualIgnoreAttrs(rowNode, changedRow.rowNode));
|
|
105
|
+
if (!deletionCount) {
|
|
106
|
+
const oldRowCount = tableOld.node.children.filter(oldRow => areNodesEqualIgnoreAttrs(oldRow, changedRow.rowNode)).length;
|
|
107
|
+
const newRowCount = tableNew.node.children.filter(newRow => areNodesEqualIgnoreAttrs(newRow, changedRow.rowNode)).length;
|
|
108
|
+
deletionCount = {
|
|
109
|
+
remaining: Math.max(0, oldRowCount - newRowCount),
|
|
110
|
+
rowNode: changedRow.rowNode
|
|
111
|
+
};
|
|
112
|
+
equivalentRowDeletionCounts.push(deletionCount);
|
|
113
|
+
}
|
|
114
|
+
if (deletionCount.remaining === 0) {
|
|
115
|
+
return false;
|
|
116
|
+
}
|
|
117
|
+
deletionCount.remaining--;
|
|
118
|
+
return true;
|
|
101
119
|
});
|
|
102
120
|
};
|
|
103
121
|
|
|
@@ -206,14 +224,18 @@ const expandDiffForChangedRows = ({
|
|
|
206
224
|
* Main function to handle deleted rows - computes diff and creates decorations
|
|
207
225
|
*/
|
|
208
226
|
export const createChangedRowDecorationWidgets = ({
|
|
227
|
+
attributionKey,
|
|
209
228
|
changes,
|
|
210
229
|
originalDoc,
|
|
211
230
|
newDoc,
|
|
212
231
|
nodeViewSerializer,
|
|
213
232
|
colorScheme,
|
|
233
|
+
isActive,
|
|
214
234
|
isInserted = false,
|
|
215
235
|
diffType,
|
|
216
|
-
showIndicators = false
|
|
236
|
+
showIndicators = false,
|
|
237
|
+
showContributorTags = false,
|
|
238
|
+
tagMountContext
|
|
217
239
|
}) => {
|
|
218
240
|
// First, expand the changes to include complete deleted rows
|
|
219
241
|
const changedRows = expandDiffForChangedRows({
|
|
@@ -229,8 +251,12 @@ export const createChangedRowDecorationWidgets = ({
|
|
|
229
251
|
const safeInsertPos = findSafeInsertPos(newDoc, changedRow.fromB - 1,
|
|
230
252
|
// -1 to find the first safe position from the table
|
|
231
253
|
originalDoc.slice(changedRow.fromA, changedRow.toA));
|
|
232
|
-
|
|
254
|
+
|
|
255
|
+
// Stable while contributor tags are enabled so a decoration recalculation preserves the tag's
|
|
256
|
+
// identity and controller state.
|
|
257
|
+
const diffId = showContributorTags ? `widget-row-${changedRow.fromA}-${changedRow.toA}` : crypto.randomUUID();
|
|
233
258
|
const decorations = [];
|
|
259
|
+
const rowAnchorNames = [];
|
|
234
260
|
|
|
235
261
|
// `IndicatorBarContentComponent` renders a bar for every widget descriptor and anchors its
|
|
236
262
|
// top and bottom to `anchor-<diffId>`. Without an element carrying that anchor name the bar
|
|
@@ -238,9 +264,9 @@ export const createChangedRowDecorationWidgets = ({
|
|
|
238
264
|
// bar covers only the row being changed. `createNodeChangedDecorationWidget` sets the same
|
|
239
265
|
// property on its own widget DOM for non-table content; this path returns before reaching it.
|
|
240
266
|
if (showIndicators && isExtendedEnabled(diffType) && fg('platform_editor_ai_show_diff_patch_1')) {
|
|
241
|
-
|
|
267
|
+
rowAnchorNames.push(buildAnchorDecorationKey({
|
|
242
268
|
diffId
|
|
243
|
-
})
|
|
269
|
+
}));
|
|
244
270
|
|
|
245
271
|
// A table's content can extend past the doc margin, so the bar also needs a left anchor
|
|
246
272
|
// measured against the table itself or it is clipped once the table is resized.
|
|
@@ -253,16 +279,47 @@ export const createChangedRowDecorationWidgets = ({
|
|
|
253
279
|
decorations.push(leftAnchor);
|
|
254
280
|
}
|
|
255
281
|
}
|
|
256
|
-
|
|
282
|
+
const tagAnchorName = showContributorTags && isContributorTagWidgetEnabled() ? buildAnchorDecorationKey({
|
|
283
|
+
diffId,
|
|
284
|
+
anchorType: AnchorTypeKey.tag
|
|
285
|
+
}) : undefined;
|
|
286
|
+
const tagWidget = tagAnchorName ? createContributorTagWidget({
|
|
287
|
+
anchorAtRangeStart: true,
|
|
288
|
+
anchorName: tagAnchorName,
|
|
289
|
+
diffId,
|
|
290
|
+
doc: newDoc,
|
|
291
|
+
from: safeInsertPos,
|
|
292
|
+
mountContext: tagMountContext,
|
|
293
|
+
to: safeInsertPos
|
|
294
|
+
}) : undefined;
|
|
295
|
+
if (tagAnchorName) {
|
|
296
|
+
// The tag host is a separate, table-safe widget. CSS anchor positioning aligns it to this
|
|
297
|
+
// synthetic row without placing non-cell DOM inside the `<tr>` or inheriting its deletion
|
|
298
|
+
// opacity and strikethrough.
|
|
299
|
+
rowAnchorNames.push(tagAnchorName);
|
|
300
|
+
}
|
|
301
|
+
if (rowAnchorNames.length > 0) {
|
|
302
|
+
rowDOM.style.setProperty('anchor-name', rowAnchorNames.map(anchorName => `--${anchorName}`).join(', '));
|
|
303
|
+
}
|
|
304
|
+
if (tagWidget) {
|
|
305
|
+
// Lets the contributor tag reveal when any part of the deleted row is hovered.
|
|
306
|
+
rowDOM.setAttribute('data-diff-id', diffId);
|
|
307
|
+
}
|
|
308
|
+
const rowWidget = Decoration.widget(safeInsertPos, rowDOM, {
|
|
257
309
|
...buildDiffDecorationSpec({
|
|
310
|
+
attributionKey: tagWidget ? attributionKey : undefined,
|
|
258
311
|
colorScheme,
|
|
259
312
|
decorationType: 'widget',
|
|
260
313
|
diffId,
|
|
261
|
-
isActive
|
|
314
|
+
isActive,
|
|
262
315
|
isInserted,
|
|
263
316
|
diffType
|
|
264
317
|
})
|
|
265
|
-
})
|
|
318
|
+
});
|
|
319
|
+
decorations.push(rowWidget);
|
|
320
|
+
if (tagWidget) {
|
|
321
|
+
decorations.push(tagWidget);
|
|
322
|
+
}
|
|
266
323
|
return decorations;
|
|
267
324
|
});
|
|
268
325
|
};
|
|
@@ -150,16 +150,20 @@ export const createNodeChangedDecorationWidget = ({
|
|
|
150
150
|
}
|
|
151
151
|
if (isTableRowContent) {
|
|
152
152
|
return createChangedRowDecorationWidgets({
|
|
153
|
+
attributionKey,
|
|
153
154
|
changes: [change],
|
|
154
155
|
originalDoc: doc,
|
|
155
156
|
newDoc,
|
|
156
157
|
nodeViewSerializer,
|
|
157
158
|
colorScheme,
|
|
159
|
+
isActive,
|
|
158
160
|
isInserted,
|
|
159
161
|
diffType,
|
|
160
162
|
// Needed for the row's own indicator anchor; this path returns before the
|
|
161
163
|
// `anchor-name` assignment further down.
|
|
162
|
-
showIndicators
|
|
164
|
+
showIndicators,
|
|
165
|
+
showContributorTags,
|
|
166
|
+
tagMountContext
|
|
163
167
|
});
|
|
164
168
|
}
|
|
165
169
|
const serializer = nodeViewSerializer;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
|
|
2
|
+
import { akEditorSmallZIndex } from '@atlaskit/editor-shared-styles/constants';
|
|
2
3
|
export const CONTRIBUTOR_TAG_TESTID = 'diff-contributor-tag';
|
|
3
4
|
export const CONTRIBUTOR_TAG_NAME_TESTID = 'diff-contributor-tag-name';
|
|
4
5
|
|
|
@@ -12,15 +13,15 @@ export const MAX_TAG_WIDTH = '200px';
|
|
|
12
13
|
/**
|
|
13
14
|
* The tag sits on the line above the change, so it has to paint over that line to be readable —
|
|
14
15
|
* including any diff highlight already on it, which would otherwise slice straight through the tag.
|
|
15
|
-
*
|
|
16
|
-
* change's own highlight is stacked one level below it — see
|
|
17
|
-
* `createInlineChangedDecoration`.
|
|
16
|
+
* It also has to paint above table interaction overlays and sticky-capable header rows, which use
|
|
17
|
+
* `akEditorSmallZIndex`. The change's own highlight is stacked one level below it — see
|
|
18
|
+
* `stackBelowContributorTagStyle` in `createInlineChangedDecoration`.
|
|
18
19
|
*
|
|
19
20
|
* Painting above its own highlight is only safe because the tag can never reach it: `bottom: 100%`
|
|
20
21
|
* puts the root's bottom edge exactly on the highlight's top edge, and the root's `overflow: clip`
|
|
21
22
|
* keeps every pixel the tag paints inside it.
|
|
22
23
|
*/
|
|
23
|
-
export const CONTRIBUTOR_TAG_Z_INDEX =
|
|
24
|
+
export const CONTRIBUTOR_TAG_Z_INDEX = akEditorSmallZIndex + 1;
|
|
24
25
|
|
|
25
26
|
/**
|
|
26
27
|
* The plugin's whole side of the tag's motion: the fade and the hidden state are
|
|
@@ -9,13 +9,13 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
|
|
|
9
9
|
import isEqual from 'lodash/isEqual';
|
|
10
10
|
import memoizeOne from 'memoize-one';
|
|
11
11
|
import { ChangeSet, simplifyChanges } from 'prosemirror-changeset';
|
|
12
|
+
import { areDocsEqualByBlockStructureAndText } from '@atlaskit/editor-common/utils/areDocsEqualByBlockStructureAndText';
|
|
12
13
|
import { areNodesEqualIgnoreAttrs } from '@atlaskit/editor-common/utils/document';
|
|
13
14
|
import { Mapping } from '@atlaskit/editor-prosemirror/transform';
|
|
14
15
|
import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
|
|
15
16
|
import { UNSAFE_expValNoExposure } from '@atlaskit/platform-feature-experiments/unsafe-exp-val-no-exposure';
|
|
16
17
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
17
18
|
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
18
|
-
import { areDocsEqualByBlockStructureAndText } from '../areDocsEqualByBlockStructureAndText';
|
|
19
19
|
import { createDocMarginAnchorWidget } from '../decorations/createAnchorDecorationWidgets';
|
|
20
20
|
import { createBlockChangedDecoration } from '../decorations/createBlockChangedDecoration';
|
|
21
21
|
import { createInlineChangedDecoration } from '../decorations/createInlineChangedDecoration';
|
|
@@ -17,7 +17,8 @@ import { buildAddedCellOverlayRoundedStyle, buildAddedCellOverlayStyle, buildDel
|
|
|
17
17
|
import { colorSchemeRegistry, getLegacyColorScheme } from './colorSchemes/schemes';
|
|
18
18
|
import { createLeftAnchorWidget } from './createAnchorDecorationWidgets';
|
|
19
19
|
import { resolveCellOverlayStyleLegacy, resolveDeletedRowStyleLegacy } from './createChangedRowDecorationWidgets.styles.legacy';
|
|
20
|
-
import {
|
|
20
|
+
import { createContributorTagWidget, isContributorTagWidgetEnabled } from './createContributorTagWidget';
|
|
21
|
+
import { AnchorTypeKey, buildAnchorDecorationKey, buildDiffDecorationSpec } from './decorationKeys';
|
|
21
22
|
import { findSafeInsertPos } from './utils/findSafeInsertPos';
|
|
22
23
|
import { applyCellEdgeAttrs, getRowCellEdgeAttrs, getTableTopAndBottomCellEdgeAttrs } from './utils/tableCellEdgeAttrs';
|
|
23
24
|
/**
|
|
@@ -98,20 +99,40 @@ var extractChangedRows = function extractChangedRows(_ref) {
|
|
|
98
99
|
}
|
|
99
100
|
});
|
|
100
101
|
|
|
101
|
-
// Filter changes that never truly got deleted
|
|
102
|
+
// Filter changes that never truly got deleted. Compare the number of equivalent rows rather
|
|
103
|
+
// than only checking whether one still exists: deleting two of three identical empty rows should
|
|
104
|
+
// retain two changed rows even though the third remains in the new table.
|
|
105
|
+
var equivalentRowDeletionCounts = [];
|
|
102
106
|
return changedRows.filter(function (changedRow) {
|
|
103
107
|
// A replacement leaves every sibling row in place, so asking "does this row still exist
|
|
104
108
|
// ANYWHERE in the new table?" can drop a genuinely rewritten row that happens to match a
|
|
105
|
-
// sibling. Compare it against the row at the same index instead.
|
|
106
|
-
// whole-table `some()`: their indices shift, so an index comparison would let every
|
|
107
|
-
// surviving row through and draw a widget for each one.
|
|
109
|
+
// sibling. Compare it against the row at the same index instead.
|
|
108
110
|
if (handleRowReplacement) {
|
|
109
111
|
var counterpart = tableNew.node.maybeChild(changedRow.rowIndex);
|
|
110
112
|
return !counterpart || !areNodesEqualIgnoreAttrs(counterpart, changedRow.rowNode);
|
|
111
113
|
}
|
|
112
|
-
|
|
113
|
-
|
|
114
|
+
var deletionCount = equivalentRowDeletionCounts.find(function (_ref2) {
|
|
115
|
+
var rowNode = _ref2.rowNode;
|
|
116
|
+
return areNodesEqualIgnoreAttrs(rowNode, changedRow.rowNode);
|
|
114
117
|
});
|
|
118
|
+
if (!deletionCount) {
|
|
119
|
+
var oldRowCount = tableOld.node.children.filter(function (oldRow) {
|
|
120
|
+
return areNodesEqualIgnoreAttrs(oldRow, changedRow.rowNode);
|
|
121
|
+
}).length;
|
|
122
|
+
var newRowCount = tableNew.node.children.filter(function (newRow) {
|
|
123
|
+
return areNodesEqualIgnoreAttrs(newRow, changedRow.rowNode);
|
|
124
|
+
}).length;
|
|
125
|
+
deletionCount = {
|
|
126
|
+
remaining: Math.max(0, oldRowCount - newRowCount),
|
|
127
|
+
rowNode: changedRow.rowNode
|
|
128
|
+
};
|
|
129
|
+
equivalentRowDeletionCounts.push(deletionCount);
|
|
130
|
+
}
|
|
131
|
+
if (deletionCount.remaining === 0) {
|
|
132
|
+
return false;
|
|
133
|
+
}
|
|
134
|
+
deletionCount.remaining--;
|
|
135
|
+
return true;
|
|
115
136
|
});
|
|
116
137
|
};
|
|
117
138
|
|
|
@@ -194,11 +215,11 @@ var createChangedRowDOM = function createChangedRowDOM(rowNode, cellEdgeAttrs, n
|
|
|
194
215
|
/**
|
|
195
216
|
* Expands a diff to include whole changed rows when table rows are affected
|
|
196
217
|
*/
|
|
197
|
-
var expandDiffForChangedRows = function expandDiffForChangedRows(
|
|
198
|
-
var changes =
|
|
199
|
-
originalDoc =
|
|
200
|
-
newDoc =
|
|
201
|
-
diffType =
|
|
218
|
+
var expandDiffForChangedRows = function expandDiffForChangedRows(_ref3) {
|
|
219
|
+
var changes = _ref3.changes,
|
|
220
|
+
originalDoc = _ref3.originalDoc,
|
|
221
|
+
newDoc = _ref3.newDoc,
|
|
222
|
+
diffType = _ref3.diffType;
|
|
202
223
|
var rowInfo = [];
|
|
203
224
|
var _iterator = _createForOfIteratorHelper(changes),
|
|
204
225
|
_step;
|
|
@@ -227,17 +248,22 @@ var expandDiffForChangedRows = function expandDiffForChangedRows(_ref2) {
|
|
|
227
248
|
/**
|
|
228
249
|
* Main function to handle deleted rows - computes diff and creates decorations
|
|
229
250
|
*/
|
|
230
|
-
export var createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(
|
|
231
|
-
var
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
251
|
+
export var createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(_ref4) {
|
|
252
|
+
var attributionKey = _ref4.attributionKey,
|
|
253
|
+
changes = _ref4.changes,
|
|
254
|
+
originalDoc = _ref4.originalDoc,
|
|
255
|
+
newDoc = _ref4.newDoc,
|
|
256
|
+
nodeViewSerializer = _ref4.nodeViewSerializer,
|
|
257
|
+
colorScheme = _ref4.colorScheme,
|
|
258
|
+
isActive = _ref4.isActive,
|
|
259
|
+
_ref4$isInserted = _ref4.isInserted,
|
|
260
|
+
isInserted = _ref4$isInserted === void 0 ? false : _ref4$isInserted,
|
|
261
|
+
diffType = _ref4.diffType,
|
|
262
|
+
_ref4$showIndicators = _ref4.showIndicators,
|
|
263
|
+
showIndicators = _ref4$showIndicators === void 0 ? false : _ref4$showIndicators,
|
|
264
|
+
_ref4$showContributor = _ref4.showContributorTags,
|
|
265
|
+
showContributorTags = _ref4$showContributor === void 0 ? false : _ref4$showContributor,
|
|
266
|
+
tagMountContext = _ref4.tagMountContext;
|
|
241
267
|
// First, expand the changes to include complete deleted rows
|
|
242
268
|
var changedRows = expandDiffForChangedRows({
|
|
243
269
|
changes: changes.filter(function (change) {
|
|
@@ -254,8 +280,12 @@ export var createChangedRowDecorationWidgets = function createChangedRowDecorati
|
|
|
254
280
|
var safeInsertPos = findSafeInsertPos(newDoc, changedRow.fromB - 1,
|
|
255
281
|
// -1 to find the first safe position from the table
|
|
256
282
|
originalDoc.slice(changedRow.fromA, changedRow.toA));
|
|
257
|
-
|
|
283
|
+
|
|
284
|
+
// Stable while contributor tags are enabled so a decoration recalculation preserves the tag's
|
|
285
|
+
// identity and controller state.
|
|
286
|
+
var diffId = showContributorTags ? "widget-row-".concat(changedRow.fromA, "-").concat(changedRow.toA) : crypto.randomUUID();
|
|
258
287
|
var decorations = [];
|
|
288
|
+
var rowAnchorNames = [];
|
|
259
289
|
|
|
260
290
|
// `IndicatorBarContentComponent` renders a bar for every widget descriptor and anchors its
|
|
261
291
|
// top and bottom to `anchor-<diffId>`. Without an element carrying that anchor name the bar
|
|
@@ -263,9 +293,9 @@ export var createChangedRowDecorationWidgets = function createChangedRowDecorati
|
|
|
263
293
|
// bar covers only the row being changed. `createNodeChangedDecorationWidget` sets the same
|
|
264
294
|
// property on its own widget DOM for non-table content; this path returns before reaching it.
|
|
265
295
|
if (showIndicators && isExtendedEnabled(diffType) && fg('platform_editor_ai_show_diff_patch_1')) {
|
|
266
|
-
|
|
296
|
+
rowAnchorNames.push(buildAnchorDecorationKey({
|
|
267
297
|
diffId: diffId
|
|
268
|
-
}))
|
|
298
|
+
}));
|
|
269
299
|
|
|
270
300
|
// A table's content can extend past the doc margin, so the bar also needs a left anchor
|
|
271
301
|
// measured against the table itself or it is clipped once the table is resized.
|
|
@@ -278,14 +308,47 @@ export var createChangedRowDecorationWidgets = function createChangedRowDecorati
|
|
|
278
308
|
decorations.push(leftAnchor);
|
|
279
309
|
}
|
|
280
310
|
}
|
|
281
|
-
|
|
311
|
+
var tagAnchorName = showContributorTags && isContributorTagWidgetEnabled() ? buildAnchorDecorationKey({
|
|
312
|
+
diffId: diffId,
|
|
313
|
+
anchorType: AnchorTypeKey.tag
|
|
314
|
+
}) : undefined;
|
|
315
|
+
var tagWidget = tagAnchorName ? createContributorTagWidget({
|
|
316
|
+
anchorAtRangeStart: true,
|
|
317
|
+
anchorName: tagAnchorName,
|
|
318
|
+
diffId: diffId,
|
|
319
|
+
doc: newDoc,
|
|
320
|
+
from: safeInsertPos,
|
|
321
|
+
mountContext: tagMountContext,
|
|
322
|
+
to: safeInsertPos
|
|
323
|
+
}) : undefined;
|
|
324
|
+
if (tagAnchorName) {
|
|
325
|
+
// The tag host is a separate, table-safe widget. CSS anchor positioning aligns it to this
|
|
326
|
+
// synthetic row without placing non-cell DOM inside the `<tr>` or inheriting its deletion
|
|
327
|
+
// opacity and strikethrough.
|
|
328
|
+
rowAnchorNames.push(tagAnchorName);
|
|
329
|
+
}
|
|
330
|
+
if (rowAnchorNames.length > 0) {
|
|
331
|
+
rowDOM.style.setProperty('anchor-name', rowAnchorNames.map(function (anchorName) {
|
|
332
|
+
return "--".concat(anchorName);
|
|
333
|
+
}).join(', '));
|
|
334
|
+
}
|
|
335
|
+
if (tagWidget) {
|
|
336
|
+
// Lets the contributor tag reveal when any part of the deleted row is hovered.
|
|
337
|
+
rowDOM.setAttribute('data-diff-id', diffId);
|
|
338
|
+
}
|
|
339
|
+
var rowWidget = Decoration.widget(safeInsertPos, rowDOM, _objectSpread({}, buildDiffDecorationSpec({
|
|
340
|
+
attributionKey: tagWidget ? attributionKey : undefined,
|
|
282
341
|
colorScheme: colorScheme,
|
|
283
342
|
decorationType: 'widget',
|
|
284
343
|
diffId: diffId,
|
|
285
|
-
isActive:
|
|
344
|
+
isActive: isActive,
|
|
286
345
|
isInserted: isInserted,
|
|
287
346
|
diffType: diffType
|
|
288
|
-
})))
|
|
347
|
+
})));
|
|
348
|
+
decorations.push(rowWidget);
|
|
349
|
+
if (tagWidget) {
|
|
350
|
+
decorations.push(tagWidget);
|
|
351
|
+
}
|
|
289
352
|
return decorations;
|
|
290
353
|
});
|
|
291
354
|
};
|
|
@@ -159,16 +159,20 @@ export var createNodeChangedDecorationWidget = function createNodeChangedDecorat
|
|
|
159
159
|
}
|
|
160
160
|
if (isTableRowContent) {
|
|
161
161
|
return createChangedRowDecorationWidgets({
|
|
162
|
+
attributionKey: attributionKey,
|
|
162
163
|
changes: [change],
|
|
163
164
|
originalDoc: doc,
|
|
164
165
|
newDoc: newDoc,
|
|
165
166
|
nodeViewSerializer: nodeViewSerializer,
|
|
166
167
|
colorScheme: colorScheme,
|
|
168
|
+
isActive: isActive,
|
|
167
169
|
isInserted: isInserted,
|
|
168
170
|
diffType: diffType,
|
|
169
171
|
// Needed for the row's own indicator anchor; this path returns before the
|
|
170
172
|
// `anchor-name` assignment further down.
|
|
171
|
-
showIndicators: showIndicators
|
|
173
|
+
showIndicators: showIndicators,
|
|
174
|
+
showContributorTags: showContributorTags,
|
|
175
|
+
tagMountContext: tagMountContext
|
|
172
176
|
});
|
|
173
177
|
}
|
|
174
178
|
var serializer = nodeViewSerializer;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
2
|
import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
|
|
3
|
+
import { akEditorSmallZIndex } from '@atlaskit/editor-shared-styles/constants';
|
|
3
4
|
export var CONTRIBUTOR_TAG_TESTID = 'diff-contributor-tag';
|
|
4
5
|
export var CONTRIBUTOR_TAG_NAME_TESTID = 'diff-contributor-tag-name';
|
|
5
6
|
|
|
@@ -13,15 +14,15 @@ export var MAX_TAG_WIDTH = '200px';
|
|
|
13
14
|
/**
|
|
14
15
|
* The tag sits on the line above the change, so it has to paint over that line to be readable —
|
|
15
16
|
* including any diff highlight already on it, which would otherwise slice straight through the tag.
|
|
16
|
-
*
|
|
17
|
-
* change's own highlight is stacked one level below it — see
|
|
18
|
-
* `createInlineChangedDecoration`.
|
|
17
|
+
* It also has to paint above table interaction overlays and sticky-capable header rows, which use
|
|
18
|
+
* `akEditorSmallZIndex`. The change's own highlight is stacked one level below it — see
|
|
19
|
+
* `stackBelowContributorTagStyle` in `createInlineChangedDecoration`.
|
|
19
20
|
*
|
|
20
21
|
* Painting above its own highlight is only safe because the tag can never reach it: `bottom: 100%`
|
|
21
22
|
* puts the root's bottom edge exactly on the highlight's top edge, and the root's `overflow: clip`
|
|
22
23
|
* keeps every pixel the tag paints inside it.
|
|
23
24
|
*/
|
|
24
|
-
export var CONTRIBUTOR_TAG_Z_INDEX =
|
|
25
|
+
export var CONTRIBUTOR_TAG_Z_INDEX = akEditorSmallZIndex + 1;
|
|
25
26
|
|
|
26
27
|
/**
|
|
27
28
|
* The plugin's whole side of the tag's motion: the fade and the hidden state are
|
|
@@ -4,18 +4,23 @@ import { Decoration } from '@atlaskit/editor-prosemirror/view';
|
|
|
4
4
|
import type { DiffType } from '../../showDiffPluginType';
|
|
5
5
|
import type { NodeViewSerializer } from '../NodeViewSerializer';
|
|
6
6
|
import type { ColorScheme } from './colorSchemes/types';
|
|
7
|
+
import { type ContributorTagMountContext } from './createContributorTagWidget';
|
|
7
8
|
type SimpleChange = Pick<Change, 'fromA' | 'toA' | 'fromB' | 'deleted'>;
|
|
8
9
|
/**
|
|
9
10
|
* Main function to handle deleted rows - computes diff and creates decorations
|
|
10
11
|
*/
|
|
11
|
-
export declare const createChangedRowDecorationWidgets: ({ changes, originalDoc, newDoc, nodeViewSerializer, colorScheme, isInserted, diffType, showIndicators, }: {
|
|
12
|
+
export declare const createChangedRowDecorationWidgets: ({ attributionKey, changes, originalDoc, newDoc, nodeViewSerializer, colorScheme, isActive, isInserted, diffType, showIndicators, showContributorTags, tagMountContext, }: {
|
|
13
|
+
attributionKey?: string;
|
|
12
14
|
changes: SimpleChange[];
|
|
13
15
|
colorScheme?: ColorScheme;
|
|
14
16
|
diffType?: DiffType;
|
|
17
|
+
isActive?: boolean;
|
|
15
18
|
isInserted?: boolean;
|
|
16
19
|
newDoc: PMNode;
|
|
17
20
|
nodeViewSerializer: NodeViewSerializer;
|
|
18
21
|
originalDoc: PMNode;
|
|
22
|
+
showContributorTags?: boolean;
|
|
19
23
|
showIndicators?: boolean;
|
|
24
|
+
tagMountContext?: ContributorTagMountContext;
|
|
20
25
|
}) => Decoration[];
|
|
21
26
|
export {};
|
|
@@ -9,15 +9,15 @@ export declare const MAX_TAG_WIDTH = "200px";
|
|
|
9
9
|
/**
|
|
10
10
|
* The tag sits on the line above the change, so it has to paint over that line to be readable —
|
|
11
11
|
* including any diff highlight already on it, which would otherwise slice straight through the tag.
|
|
12
|
-
*
|
|
13
|
-
* change's own highlight is stacked one level below it — see
|
|
14
|
-
* `createInlineChangedDecoration`.
|
|
12
|
+
* It also has to paint above table interaction overlays and sticky-capable header rows, which use
|
|
13
|
+
* `akEditorSmallZIndex`. The change's own highlight is stacked one level below it — see
|
|
14
|
+
* `stackBelowContributorTagStyle` in `createInlineChangedDecoration`.
|
|
15
15
|
*
|
|
16
16
|
* Painting above its own highlight is only safe because the tag can never reach it: `bottom: 100%`
|
|
17
17
|
* puts the root's bottom edge exactly on the highlight's top edge, and the root's `overflow: clip`
|
|
18
18
|
* keeps every pixel the tag paints inside it.
|
|
19
19
|
*/
|
|
20
|
-
export declare const CONTRIBUTOR_TAG_Z_INDEX
|
|
20
|
+
export declare const CONTRIBUTOR_TAG_Z_INDEX: number;
|
|
21
21
|
/**
|
|
22
22
|
* The plugin's whole side of the tag's motion: the fade and the hidden state are
|
|
23
23
|
* `contributorTagStyles` in both EditorContentContainer stylesheets, keyed on this literal and the
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-show-diff",
|
|
3
|
-
"version": "16.0.
|
|
3
|
+
"version": "16.0.16",
|
|
4
4
|
"description": "ShowDiff plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"@atlaskit/platform-feature-experiments": "^0.3.0",
|
|
33
33
|
"@atlaskit/platform-feature-flags": "^2.2.0",
|
|
34
34
|
"@atlaskit/primitives": "^22.5.0",
|
|
35
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
35
|
+
"@atlaskit/tmp-editor-statsig": "^197.0.0",
|
|
36
36
|
"@atlaskit/tokens": "^17.0.0",
|
|
37
37
|
"@babel/runtime": "^7.0.0",
|
|
38
38
|
"@compiled/react": "^1.0.2",
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.areDocsEqualByBlockStructureAndText = areDocsEqualByBlockStructureAndText;
|
|
7
|
-
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
8
|
-
/**
|
|
9
|
-
* Returns a copy of the document with all marks removed from all text.
|
|
10
|
-
* This normalises mark fragmentation — e.g. annotation marks reordering can split
|
|
11
|
-
* a single text run into many text nodes, making structural comparison unreliable.
|
|
12
|
-
* After stripping, ProseMirror will merge adjacent text nodes so childCounts are stable.
|
|
13
|
-
*/
|
|
14
|
-
function stripMarks(doc) {
|
|
15
|
-
var tr = new _transform.Transform(doc);
|
|
16
|
-
tr.removeMark(0, doc.content.size);
|
|
17
|
-
return tr.doc;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
/**
|
|
21
|
-
* Returns true if both (mark-stripped) nodes have the same block tree structure (node type and child count at every level)
|
|
22
|
-
*/
|
|
23
|
-
function isBlockStructureEqual(node1, node2) {
|
|
24
|
-
if (node1.type !== node2.type || node1.childCount !== node2.childCount) {
|
|
25
|
-
return false;
|
|
26
|
-
}
|
|
27
|
-
for (var i = 0; i < node1.childCount; i++) {
|
|
28
|
-
if (!isBlockStructureEqual(node1.child(i), node2.child(i))) {
|
|
29
|
-
return false;
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
return true;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
/**
|
|
36
|
-
* Looser equality for "safe diff" cases: same full text content and same block structure
|
|
37
|
-
* (e.g. text moved across text-node boundaries). Used when strict areNodesEqualIgnoreAttrs fails.
|
|
38
|
-
* This is safe because we ensure decorations get applied to valid positions.
|
|
39
|
-
*
|
|
40
|
-
* Marks are intentionally ignored — two documents that differ only in mark application
|
|
41
|
-
* (e.g. bold/italic boundaries or annotation mark ordering) are considered equal here.
|
|
42
|
-
* Both documents are mark-stripped before comparison so that mark-driven text fragmentation
|
|
43
|
-
* does not produce false inequalities.
|
|
44
|
-
*/
|
|
45
|
-
function areDocsEqualByBlockStructureAndText(doc1, doc2) {
|
|
46
|
-
if (doc1.textContent !== doc2.textContent) {
|
|
47
|
-
return false;
|
|
48
|
-
}
|
|
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);
|
|
55
|
-
}
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
import { Transform } from '@atlaskit/editor-prosemirror/transform';
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Returns a copy of the document with all marks removed from all text.
|
|
5
|
-
* This normalises mark fragmentation — e.g. annotation marks reordering can split
|
|
6
|
-
* a single text run into many text nodes, making structural comparison unreliable.
|
|
7
|
-
* After stripping, ProseMirror will merge adjacent text nodes so childCounts are stable.
|
|
8
|
-
*/
|
|
9
|
-
function stripMarks(doc) {
|
|
10
|
-
const tr = new Transform(doc);
|
|
11
|
-
tr.removeMark(0, doc.content.size);
|
|
12
|
-
return tr.doc;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
/**
|
|
16
|
-
* Returns true if both (mark-stripped) nodes have the same block tree structure (node type and child count at every level)
|
|
17
|
-
*/
|
|
18
|
-
function isBlockStructureEqual(node1, node2) {
|
|
19
|
-
if (node1.type !== node2.type || node1.childCount !== node2.childCount) {
|
|
20
|
-
return false;
|
|
21
|
-
}
|
|
22
|
-
for (let i = 0; i < node1.childCount; i++) {
|
|
23
|
-
if (!isBlockStructureEqual(node1.child(i), node2.child(i))) {
|
|
24
|
-
return false;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
return true;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
/**
|
|
31
|
-
* Looser equality for "safe diff" cases: same full text content and same block structure
|
|
32
|
-
* (e.g. text moved across text-node boundaries). Used when strict areNodesEqualIgnoreAttrs fails.
|
|
33
|
-
* This is safe because we ensure decorations get applied to valid positions.
|
|
34
|
-
*
|
|
35
|
-
* Marks are intentionally ignored — two documents that differ only in mark application
|
|
36
|
-
* (e.g. bold/italic boundaries or annotation mark ordering) are considered equal here.
|
|
37
|
-
* Both documents are mark-stripped before comparison so that mark-driven text fragmentation
|
|
38
|
-
* does not produce false inequalities.
|
|
39
|
-
*/
|
|
40
|
-
export function areDocsEqualByBlockStructureAndText(doc1, doc2) {
|
|
41
|
-
if (doc1.textContent !== doc2.textContent) {
|
|
42
|
-
return false;
|
|
43
|
-
}
|
|
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);
|
|
50
|
-
}
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
import { Transform } from '@atlaskit/editor-prosemirror/transform';
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Returns a copy of the document with all marks removed from all text.
|
|
5
|
-
* This normalises mark fragmentation — e.g. annotation marks reordering can split
|
|
6
|
-
* a single text run into many text nodes, making structural comparison unreliable.
|
|
7
|
-
* After stripping, ProseMirror will merge adjacent text nodes so childCounts are stable.
|
|
8
|
-
*/
|
|
9
|
-
function stripMarks(doc) {
|
|
10
|
-
var tr = new Transform(doc);
|
|
11
|
-
tr.removeMark(0, doc.content.size);
|
|
12
|
-
return tr.doc;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
/**
|
|
16
|
-
* Returns true if both (mark-stripped) nodes have the same block tree structure (node type and child count at every level)
|
|
17
|
-
*/
|
|
18
|
-
function isBlockStructureEqual(node1, node2) {
|
|
19
|
-
if (node1.type !== node2.type || node1.childCount !== node2.childCount) {
|
|
20
|
-
return false;
|
|
21
|
-
}
|
|
22
|
-
for (var i = 0; i < node1.childCount; i++) {
|
|
23
|
-
if (!isBlockStructureEqual(node1.child(i), node2.child(i))) {
|
|
24
|
-
return false;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
return true;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
/**
|
|
31
|
-
* Looser equality for "safe diff" cases: same full text content and same block structure
|
|
32
|
-
* (e.g. text moved across text-node boundaries). Used when strict areNodesEqualIgnoreAttrs fails.
|
|
33
|
-
* This is safe because we ensure decorations get applied to valid positions.
|
|
34
|
-
*
|
|
35
|
-
* Marks are intentionally ignored — two documents that differ only in mark application
|
|
36
|
-
* (e.g. bold/italic boundaries or annotation mark ordering) are considered equal here.
|
|
37
|
-
* Both documents are mark-stripped before comparison so that mark-driven text fragmentation
|
|
38
|
-
* does not produce false inequalities.
|
|
39
|
-
*/
|
|
40
|
-
export function areDocsEqualByBlockStructureAndText(doc1, doc2) {
|
|
41
|
-
if (doc1.textContent !== doc2.textContent) {
|
|
42
|
-
return false;
|
|
43
|
-
}
|
|
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
|
-
var stripped1 = stripMarks(doc1);
|
|
48
|
-
var stripped2 = stripMarks(doc2);
|
|
49
|
-
return doc1.nodeSize === doc2.nodeSize && isBlockStructureEqual(stripped1, stripped2);
|
|
50
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
|
|
2
|
-
/**
|
|
3
|
-
* Looser equality for "safe diff" cases: same full text content and same block structure
|
|
4
|
-
* (e.g. text moved across text-node boundaries). Used when strict areNodesEqualIgnoreAttrs fails.
|
|
5
|
-
* This is safe because we ensure decorations get applied to valid positions.
|
|
6
|
-
*
|
|
7
|
-
* Marks are intentionally ignored — two documents that differ only in mark application
|
|
8
|
-
* (e.g. bold/italic boundaries or annotation mark ordering) are considered equal here.
|
|
9
|
-
* Both documents are mark-stripped before comparison so that mark-driven text fragmentation
|
|
10
|
-
* does not produce false inequalities.
|
|
11
|
-
*/
|
|
12
|
-
export declare function areDocsEqualByBlockStructureAndText(doc1: PMNode, doc2: PMNode): boolean;
|