@atlaskit/editor-plugin-show-diff 10.5.3 → 10.6.1

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 CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/editor-plugin-show-diff
2
2
 
3
+ ## 10.6.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`963920819d38c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/963920819d38c) -
8
+ Fix rounded table diff overlays for whole-table widgets.
9
+ - Updated dependencies
10
+
11
+ ## 10.6.0
12
+
13
+ ### Minor Changes
14
+
15
+ - [`0840aa4f6b2d0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0840aa4f6b2d0) -
16
+ Add a new `inlineDeletedDiffPlacement: 'before' | 'after'` option to `PMDiffParams` for the
17
+ `smart` diff type. When set to `'after'`, inline-level (and sentence-level) deleted content is
18
+ rendered after the added/updated content instead of before it. Defaults to `'before'` and is
19
+ independent of the existing node/paragraph-level `deletedDiffPlacement` option. Post Stream Review
20
+ now requests `'after'` so reviewers read the new text first.
21
+
3
22
  ## 10.5.3
4
23
 
5
24
  ### Patch Changes
@@ -151,7 +151,9 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
151
151
  showIndicators = _ref3$showIndicators === void 0 ? false : _ref3$showIndicators,
152
152
  smartThresholds = _ref3.smartThresholds,
153
153
  _ref3$deletedDiffPlac = _ref3.deletedDiffPlacement,
154
- deletedDiffPlacement = _ref3$deletedDiffPlac === void 0 ? 'top' : _ref3$deletedDiffPlac;
154
+ deletedDiffPlacement = _ref3$deletedDiffPlac === void 0 ? 'top' : _ref3$deletedDiffPlac,
155
+ _ref3$inlineDeletedDi = _ref3.inlineDeletedDiffPlacement,
156
+ inlineDeletedDiffPlacement = _ref3$inlineDeletedDi === void 0 ? 'before' : _ref3$inlineDeletedDi;
155
157
  var originalDoc = pluginState.originalDoc,
156
158
  steps = pluginState.steps,
157
159
  isDisplayingChanges = pluginState.isDisplayingChanges;
@@ -326,10 +328,19 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
326
328
  isInserted: !isInserted,
327
329
  diffType: diffType,
328
330
  hideAddedDiffsUnderline: hideAddedDiffsUnderline,
329
- // For `smart` node- and paragraph-level changes, optionally render the
330
- // deleted content below the new content (gray + strikethrough) instead
331
- // of above it. Controlled by `deletedDiffPlacement` (default `'top'`).
332
- placeBelow: deletedDiffPlacement === 'bottom' && diffType === 'smart' && (0, _platformFeatureFlags.fg)('platform_editor_ai_smart_diff') && ((0, _helpers.smartChangeLevel)(change) === 'node' || (0, _helpers.smartChangeLevel)(change) === 'paragraph')
331
+ // For `smart` changes, optionally render the deleted content after the new
332
+ // content (gray + strikethrough) instead of before it. Two independent
333
+ // controls, split by change level:
334
+ // - node/paragraph-level: `deletedDiffPlacement` (default `'top'`).
335
+ // - inline/sentence-level: `inlineDeletedDiffPlacement` (default `'before'`).
336
+ placeBelow: diffType === 'smart' && (0, _platformFeatureFlags.fg)('platform_editor_ai_smart_diff') && function () {
337
+ var level = (0, _helpers.smartChangeLevel)(change);
338
+ if (level === 'node' || level === 'paragraph') {
339
+ return deletedDiffPlacement === 'bottom';
340
+ }
341
+ // Inline-level (undefined) and sentence-level changes.
342
+ return inlineDeletedDiffPlacement === 'after';
343
+ }()
333
344
  }), {}, {
334
345
  showIndicators: showIndicators
335
346
  }))));
@@ -500,7 +511,8 @@ function (_ref5, _ref6) {
500
511
  hideAddedDiffsUnderline = _ref7$.hideAddedDiffsUnderline,
501
512
  showIndicators = _ref7$.showIndicators,
502
513
  smartThresholds = _ref7$.smartThresholds,
503
- deletedDiffPlacement = _ref7$.deletedDiffPlacement;
514
+ deletedDiffPlacement = _ref7$.deletedDiffPlacement,
515
+ inlineDeletedDiffPlacement = _ref7$.inlineDeletedDiffPlacement;
504
516
  var _ref8 = (0, _slicedToArray2.default)(_ref6, 1),
505
517
  _ref8$ = _ref8[0],
506
518
  lastPluginState = _ref8$.pluginState,
@@ -514,11 +526,12 @@ function (_ref5, _ref6) {
514
526
  lastHideAddedDiffsUnderline = _ref8$.hideAddedDiffsUnderline,
515
527
  lastShowIndicators = _ref8$.showIndicators,
516
528
  lastSmartThresholds = _ref8$.smartThresholds,
517
- lastDeletedDiffPlacement = _ref8$.deletedDiffPlacement;
529
+ lastDeletedDiffPlacement = _ref8$.deletedDiffPlacement,
530
+ lastInlineDeletedDiffPlacement = _ref8$.inlineDeletedDiffPlacement;
518
531
  var originalDocIsSame = lastPluginState.originalDoc && pluginState.originalDoc && pluginState.originalDoc.eq(lastPluginState.originalDoc);
519
532
  if ((0, _isExtendedEnabled.isExtendedEnabled)(diffType)) {
520
533
  var _ref9;
521
- return (_ref9 = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && (0, _isEqual.default)(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && (0, _isEqual.default)(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && hideAddedDiffsUnderline === lastHideAddedDiffsUnderline && showIndicators === lastShowIndicators && (0, _isEqual.default)(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement) !== null && _ref9 !== void 0 ? _ref9 : false;
534
+ return (_ref9 = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && (0, _isEqual.default)(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && (0, _isEqual.default)(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && hideAddedDiffsUnderline === lastHideAddedDiffsUnderline && showIndicators === lastShowIndicators && (0, _isEqual.default)(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement && inlineDeletedDiffPlacement === lastInlineDeletedDiffPlacement) !== null && _ref9 !== void 0 ? _ref9 : false;
522
535
  }
523
536
  return (_ref0 = originalDocIsSame && (0, _isEqual.default)(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && colorScheme === lastColorScheme && intl.locale === lastIntl.locale && (0, _isEqual.default)(activeIndexPos, lastActiveIndexPos) && hideDeletedDiffs === lastHideDeletedDiffs) !== null && _ref0 !== void 0 ? _ref0 : false;
524
537
  });
@@ -17,60 +17,20 @@ var _standard = require("./colorSchemes/standard");
17
17
  var _traditional = require("./colorSchemes/traditional");
18
18
  var _decorationKeys = require("./decorationKeys");
19
19
  var _findSafeInsertPos = require("./utils/findSafeInsertPos");
20
+ var _tableCellEdgeAttrs = require("./utils/tableCellEdgeAttrs");
20
21
  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; }
21
22
  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; }
22
23
  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; } } }; }
23
24
  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; } }
24
25
  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; }
25
- /**
26
- * Inserted table rows are rendered as decoration widgets, so their cells do not get the
27
- * `data-reaches-*` attrs normally applied by the table cell node view. Mirror that boundary
28
- * metadata here so the existing rounded-table CSS can round widget cells like real table cells.
29
- */
30
- var getChangedRowCellEdgeAttrs = function getChangedRowCellEdgeAttrs(_ref) {
31
- var rowNode = _ref.rowNode,
32
- rowStart = _ref.rowStart,
33
- tableMap = _ref.tableMap;
34
- var cellEdgeAttrs = [];
35
- rowNode.content.forEach(function (cellNode, cellOffset) {
36
- if (cellNode.type.name !== 'tableCell' && cellNode.type.name !== 'tableHeader') {
37
- return;
38
- }
39
- var cellRect = tableMap.findCell(rowStart + 1 + cellOffset);
40
- cellEdgeAttrs.push({
41
- reachesBottom: cellRect.bottom >= tableMap.height,
42
- reachesLeft: cellRect.left === 0,
43
- reachesRight: cellRect.right >= tableMap.width,
44
- reachesTop: cellRect.top === 0
45
- });
46
- });
47
- return cellEdgeAttrs;
48
- };
49
- var applyCellEdgeAttrs = function applyCellEdgeAttrs(cell, edgeAttrs) {
50
- if (!edgeAttrs) {
51
- return;
52
- }
53
- if (edgeAttrs.reachesTop) {
54
- cell.setAttribute('data-reaches-top', 'true');
55
- }
56
- if (edgeAttrs.reachesBottom) {
57
- cell.setAttribute('data-reaches-bottom', 'true');
58
- }
59
- if (edgeAttrs.reachesLeft) {
60
- cell.setAttribute('data-reaches-left', 'true');
61
- }
62
- if (edgeAttrs.reachesRight) {
63
- cell.setAttribute('data-reaches-right', 'true');
64
- }
65
- };
66
26
  /**
67
27
  * Extracts information about deleted table rows from a change
68
28
  */
69
- var extractChangedRows = function extractChangedRows(_ref2) {
70
- var change = _ref2.change,
71
- originalDoc = _ref2.originalDoc,
72
- newDoc = _ref2.newDoc,
73
- diffType = _ref2.diffType;
29
+ var extractChangedRows = function extractChangedRows(_ref) {
30
+ var change = _ref.change,
31
+ originalDoc = _ref.originalDoc,
32
+ newDoc = _ref.newDoc,
33
+ diffType = _ref.diffType;
74
34
  var changedRows = [];
75
35
 
76
36
  // Find the table in the original document
@@ -111,7 +71,7 @@ var extractChangedRows = function extractChangedRows(_ref2) {
111
71
  // Check if this row overlaps with the deletion range
112
72
  var rowOverlapsChange = rowStart >= changeStartInTable && rowStart < changeEndInTable || rowEnd > changeStartInTable && rowEnd <= changeEndInTable || rowStart < changeStartInTable && rowEnd > changeEndInTable;
113
73
  if (rowOverlapsChange && rowNode.type.name === 'tableRow' && ((0, _isExtendedEnabled.isExtendedEnabled)(diffType) || !isEmptyRow(rowNode))) {
114
- var cellEdgeAttrs = (0, _isExtendedEnabled.isExtendedEnabled)(diffType) && (0, _expValEquals.expValEquals)('platform_editor_table_diff_rounded_corners', 'isEnabled', true) ? getChangedRowCellEdgeAttrs({
74
+ var cellEdgeAttrs = (0, _isExtendedEnabled.isExtendedEnabled)(diffType) && (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) && (0, _expValEquals.expValEquals)('platform_editor_table_diff_rounded_corners', 'isEnabled', true) ? (0, _tableCellEdgeAttrs.getRowCellEdgeAttrs)({
115
75
  rowNode: rowNode,
116
76
  rowStart: rowStart,
117
77
  tableMap: oldTableMap
@@ -189,7 +149,7 @@ var createChangedRowDOM = function createChangedRowDOM(rowNode, cellEdgeAttrs, n
189
149
  var nodeView = nodeViewSerializer.tryCreateNodeView(cellNode);
190
150
  if (nodeView) {
191
151
  if (nodeView instanceof HTMLElement) {
192
- applyCellEdgeAttrs(nodeView, cellEdgeAttrs === null || cellEdgeAttrs === void 0 ? void 0 : cellEdgeAttrs[cellIndex]);
152
+ (0, _tableCellEdgeAttrs.applyCellEdgeAttrs)(nodeView, cellEdgeAttrs === null || cellEdgeAttrs === void 0 ? void 0 : cellEdgeAttrs[cellIndex]);
193
153
  if ((0, _isExtendedEnabled.isExtendedEnabled)(diffType)) {
194
154
  var overlay = document.createElement('span');
195
155
  var isRoundedTable = (0, _expValEquals.expValEquals)('platform_editor_table_diff_rounded_corners', 'isEnabled', true);
@@ -218,11 +178,11 @@ var createChangedRowDOM = function createChangedRowDOM(rowNode, cellEdgeAttrs, n
218
178
  /**
219
179
  * Expands a diff to include whole changed rows when table rows are affected
220
180
  */
221
- var expandDiffForChangedRows = function expandDiffForChangedRows(_ref3) {
222
- var changes = _ref3.changes,
223
- originalDoc = _ref3.originalDoc,
224
- newDoc = _ref3.newDoc,
225
- diffType = _ref3.diffType;
181
+ var expandDiffForChangedRows = function expandDiffForChangedRows(_ref2) {
182
+ var changes = _ref2.changes,
183
+ originalDoc = _ref2.originalDoc,
184
+ newDoc = _ref2.newDoc,
185
+ diffType = _ref2.diffType;
226
186
  var rowInfo = [];
227
187
  var _iterator = _createForOfIteratorHelper(changes),
228
188
  _step;
@@ -251,15 +211,15 @@ var expandDiffForChangedRows = function expandDiffForChangedRows(_ref3) {
251
211
  /**
252
212
  * Main function to handle deleted rows - computes diff and creates decorations
253
213
  */
254
- var createChangedRowDecorationWidgets = exports.createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(_ref4) {
255
- var changes = _ref4.changes,
256
- originalDoc = _ref4.originalDoc,
257
- newDoc = _ref4.newDoc,
258
- nodeViewSerializer = _ref4.nodeViewSerializer,
259
- colorScheme = _ref4.colorScheme,
260
- _ref4$isInserted = _ref4.isInserted,
261
- isInserted = _ref4$isInserted === void 0 ? false : _ref4$isInserted,
262
- diffType = _ref4.diffType;
214
+ var createChangedRowDecorationWidgets = exports.createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(_ref3) {
215
+ var changes = _ref3.changes,
216
+ originalDoc = _ref3.originalDoc,
217
+ newDoc = _ref3.newDoc,
218
+ nodeViewSerializer = _ref3.nodeViewSerializer,
219
+ colorScheme = _ref3.colorScheme,
220
+ _ref3$isInserted = _ref3.isInserted,
221
+ isInserted = _ref3$isInserted === void 0 ? false : _ref3$isInserted,
222
+ diffType = _ref3.diffType;
263
223
  // First, expand the changes to include complete deleted rows
264
224
  var changedRows = expandDiffForChangedRows({
265
225
  changes: changes.filter(function (change) {
@@ -0,0 +1,73 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getRowCellEdgeAttrs = exports.applyTableCellEdgeAttrs = exports.applyCellEdgeAttrs = void 0;
7
+ var _tableMap = require("@atlaskit/editor-tables/table-map");
8
+ var getRowCellEdgeAttrs = exports.getRowCellEdgeAttrs = function getRowCellEdgeAttrs(_ref) {
9
+ var rowNode = _ref.rowNode,
10
+ rowStart = _ref.rowStart,
11
+ tableMap = _ref.tableMap;
12
+ var cellEdgeAttrs = [];
13
+ rowNode.content.forEach(function (cellNode, cellOffset) {
14
+ if (cellNode.type.name !== 'tableCell' && cellNode.type.name !== 'tableHeader') {
15
+ return;
16
+ }
17
+ var cellRect = tableMap.findCell(rowStart + 1 + cellOffset);
18
+ cellEdgeAttrs.push({
19
+ reachesBottom: cellRect.bottom >= tableMap.height,
20
+ reachesLeft: cellRect.left === 0,
21
+ reachesRight: cellRect.right >= tableMap.width,
22
+ reachesTop: cellRect.top === 0
23
+ });
24
+ });
25
+ return cellEdgeAttrs;
26
+ };
27
+ var applyCellEdgeAttrs = exports.applyCellEdgeAttrs = function applyCellEdgeAttrs(cell, edgeAttrs) {
28
+ if (!edgeAttrs) {
29
+ return;
30
+ }
31
+ if (edgeAttrs.reachesTop) {
32
+ cell.setAttribute('data-reaches-top', 'true');
33
+ }
34
+ if (edgeAttrs.reachesBottom) {
35
+ cell.setAttribute('data-reaches-bottom', 'true');
36
+ }
37
+ if (edgeAttrs.reachesLeft) {
38
+ cell.setAttribute('data-reaches-left', 'true');
39
+ }
40
+ if (edgeAttrs.reachesRight) {
41
+ cell.setAttribute('data-reaches-right', 'true');
42
+ }
43
+ };
44
+ var applyTableCellEdgeAttrs = exports.applyTableCellEdgeAttrs = function applyTableCellEdgeAttrs(_ref2) {
45
+ var element = _ref2.element,
46
+ tableNode = _ref2.tableNode;
47
+ try {
48
+ var table = element instanceof HTMLTableElement ? element : element.querySelector('table');
49
+ if (!(table instanceof HTMLTableElement)) {
50
+ return;
51
+ }
52
+ var tableMap = _tableMap.TableMap.get(tableNode);
53
+ var cells = Array.from(table.rows).flatMap(function (row) {
54
+ return Array.from(row.cells);
55
+ });
56
+ var cellIndex = 0;
57
+ tableNode.content.forEach(function (rowNode, rowStart) {
58
+ getRowCellEdgeAttrs({
59
+ rowNode: rowNode,
60
+ rowStart: rowStart,
61
+ tableMap: tableMap
62
+ }).forEach(function (edgeAttrs) {
63
+ var cell = cells[cellIndex];
64
+ cellIndex++;
65
+ if (cell) {
66
+ applyCellEdgeAttrs(cell, edgeAttrs);
67
+ }
68
+ });
69
+ });
70
+ } catch (_unused) {
71
+ // Table structure can be transient while widget DOM is being assembled.
72
+ }
73
+ };
@@ -13,6 +13,7 @@ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
13
13
  var _isExtendedEnabled = require("../../isExtendedEnabled");
14
14
  var _standard = require("../colorSchemes/standard");
15
15
  var _traditional = require("../colorSchemes/traditional");
16
+ var _tableCellEdgeAttrs = require("./tableCellEdgeAttrs");
16
17
  var lozengeStyle = (0, _lazyNodeView.convertToInlineCss)({
17
18
  display: 'inline-flex',
18
19
  boxSizing: 'border-box',
@@ -178,9 +179,13 @@ var applyCellOverlayStyles = function applyCellOverlayStyles(_ref2) {
178
179
  var element = _ref2.element,
179
180
  colorScheme = _ref2.colorScheme,
180
181
  isInserted = _ref2.isInserted;
182
+ var isRoundedTable = (0, _expValEquals.expValEquals)('platform_editor_table_diff_rounded_corners', 'isEnabled', true);
181
183
  element.querySelectorAll('td, th').forEach(function (cell) {
182
184
  var overlay = document.createElement('span');
183
- var overlayStyle = colorScheme === 'traditional' ? isInserted ? _traditional.traditionalAddedCellOverlayStyleNew : _traditional.deletedTraditionalCellOverlayStyle : isInserted ? _standard.addedCellOverlayStyle : _standard.deletedCellOverlayStyle;
185
+ var isTraditional = colorScheme === 'traditional';
186
+ var deletedCellStyle = isTraditional ? _traditional.deletedTraditionalCellOverlayStyle : _standard.deletedCellOverlayStyle;
187
+ var addedCellStyle = isTraditional ? isRoundedTable ? _traditional.traditionalAddedCellOverlayRoundedStyle : _traditional.traditionalAddedCellOverlayStyleNew : isRoundedTable ? _standard.addedCellOverlayRoundedStyle : _standard.addedCellOverlayStyle;
188
+ var overlayStyle = isInserted ? addedCellStyle : deletedCellStyle;
184
189
  overlay.setAttribute('style', overlayStyle);
185
190
  cell.appendChild(overlay);
186
191
  });
@@ -544,6 +549,12 @@ var wrapBlockNodeView = exports.wrapBlockNodeView = function wrapBlockNodeView(_
544
549
  return;
545
550
  }
546
551
  if (targetNode.type.name === 'table') {
552
+ if ((0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) && (0, _expValEquals.expValEquals)('platform_editor_table_diff_rounded_corners', 'isEnabled', true)) {
553
+ (0, _tableCellEdgeAttrs.applyTableCellEdgeAttrs)({
554
+ element: nodeView,
555
+ tableNode: targetNode
556
+ });
557
+ }
547
558
  applyCellOverlayStyles({
548
559
  element: nodeView,
549
560
  colorScheme: colorScheme,
@@ -52,7 +52,7 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
52
52
  var newPluginState = currentPluginState;
53
53
  if (meta) {
54
54
  if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'SHOW_DIFF') {
55
- var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8, _newPluginState9;
55
+ var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8, _newPluginState9, _newPluginState0;
56
56
  // Update the plugin state with the new metadata
57
57
  newPluginState = _objectSpread(_objectSpread(_objectSpread({}, currentPluginState), meta), {}, {
58
58
  isDisplayingChanges: true,
@@ -74,13 +74,14 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
74
74
  hideAddedDiffsUnderline: (_newPluginState5 = newPluginState) === null || _newPluginState5 === void 0 ? void 0 : _newPluginState5.hideAddedDiffsUnderline,
75
75
  showIndicators: (_newPluginState6 = newPluginState) === null || _newPluginState6 === void 0 ? void 0 : _newPluginState6.showIndicators,
76
76
  smartThresholds: (_newPluginState7 = newPluginState) === null || _newPluginState7 === void 0 ? void 0 : _newPluginState7.smartThresholds,
77
- deletedDiffPlacement: (_newPluginState8 = newPluginState) === null || _newPluginState8 === void 0 ? void 0 : _newPluginState8.deletedDiffPlacement
77
+ deletedDiffPlacement: (_newPluginState8 = newPluginState) === null || _newPluginState8 === void 0 ? void 0 : _newPluginState8.deletedDiffPlacement,
78
+ inlineDeletedDiffPlacement: (_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.inlineDeletedDiffPlacement
78
79
  } : {})),
79
80
  decorations = _calculateDiffDecorat.decorations,
80
81
  diffDescriptors = _calculateDiffDecorat.diffDescriptors;
81
82
  // Update the decorations and their ids
82
83
  newPluginState.decorations = decorations;
83
- if ((0, _isExtendedEnabled.isExtendedEnabled)((_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.diffType)) {
84
+ if ((0, _isExtendedEnabled.isExtendedEnabled)((_newPluginState0 = newPluginState) === null || _newPluginState0 === void 0 ? void 0 : _newPluginState0.diffType)) {
84
85
  newPluginState.diffDescriptors = diffDescriptors;
85
86
  }
86
87
  } else if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'HIDE_DIFF') {
@@ -96,9 +97,9 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
96
97
  diffDescriptors: []
97
98
  } : {});
98
99
  } 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') {
99
- var _newPluginState0;
100
+ var _newPluginState1;
100
101
  // Update the active index in plugin state and recalculate decorations
101
- var _decorations = (0, _getScrollableDecorations.getScrollableDecorations)(currentPluginState.decorations, newState.doc, (_newPluginState0 = newPluginState) === null || _newPluginState0 === void 0 ? void 0 : _newPluginState0.diffType);
102
+ var _decorations = (0, _getScrollableDecorations.getScrollableDecorations)(currentPluginState.decorations, newState.doc, (_newPluginState1 = newPluginState) === null || _newPluginState1 === void 0 ? void 0 : _newPluginState1.diffType);
102
103
  if (_decorations.length > 0) {
103
104
  var _currentPluginState$a;
104
105
  // Initialize to -1 if undefined so that the first "next" scroll takes us to index 0 (first change).
@@ -139,7 +140,8 @@ var createPlugin = exports.createPlugin = function createPlugin(config, getIntl,
139
140
  hideAddedDiffsUnderline: newPluginState.hideAddedDiffsUnderline,
140
141
  showIndicators: newPluginState.showIndicators,
141
142
  smartThresholds: newPluginState.smartThresholds,
142
- deletedDiffPlacement: newPluginState.deletedDiffPlacement
143
+ deletedDiffPlacement: newPluginState.deletedDiffPlacement,
144
+ inlineDeletedDiffPlacement: newPluginState.inlineDeletedDiffPlacement
143
145
  } : {})),
144
146
  updatedDecorations = _calculateDiffDecorat2.decorations,
145
147
  updatedDiffDescriptors = _calculateDiffDecorat2.diffDescriptors;
@@ -130,7 +130,8 @@ const calculateDiffDecorationsInner = ({
130
130
  hideAddedDiffsUnderline: hideAddedDiffsUnderlineParam = false,
131
131
  showIndicators = false,
132
132
  smartThresholds,
133
- deletedDiffPlacement = 'top'
133
+ deletedDiffPlacement = 'top',
134
+ inlineDeletedDiffPlacement = 'before'
134
135
  }) => {
135
136
  const {
136
137
  originalDoc,
@@ -292,10 +293,19 @@ const calculateDiffDecorationsInner = ({
292
293
  isInserted: !isInserted,
293
294
  diffType,
294
295
  hideAddedDiffsUnderline,
295
- // For `smart` node- and paragraph-level changes, optionally render the
296
- // deleted content below the new content (gray + strikethrough) instead
297
- // of above it. Controlled by `deletedDiffPlacement` (default `'top'`).
298
- placeBelow: deletedDiffPlacement === 'bottom' && diffType === 'smart' && fg('platform_editor_ai_smart_diff') && (smartChangeLevel(change) === 'node' || smartChangeLevel(change) === 'paragraph')
296
+ // For `smart` changes, optionally render the deleted content after the new
297
+ // content (gray + strikethrough) instead of before it. Two independent
298
+ // controls, split by change level:
299
+ // - node/paragraph-level: `deletedDiffPlacement` (default `'top'`).
300
+ // - inline/sentence-level: `inlineDeletedDiffPlacement` (default `'before'`).
301
+ placeBelow: diffType === 'smart' && fg('platform_editor_ai_smart_diff') && (() => {
302
+ const level = smartChangeLevel(change);
303
+ if (level === 'node' || level === 'paragraph') {
304
+ return deletedDiffPlacement === 'bottom';
305
+ }
306
+ // Inline-level (undefined) and sentence-level changes.
307
+ return inlineDeletedDiffPlacement === 'after';
308
+ })()
299
309
  }),
300
310
  showIndicators
301
311
  }));
@@ -460,7 +470,8 @@ export const calculateDiffDecorations = memoizeOne(calculateDiffDecorationsInner
460
470
  hideAddedDiffsUnderline,
461
471
  showIndicators,
462
472
  smartThresholds,
463
- deletedDiffPlacement
473
+ deletedDiffPlacement,
474
+ inlineDeletedDiffPlacement
464
475
  }], [{
465
476
  pluginState: lastPluginState,
466
477
  state: lastState,
@@ -473,13 +484,14 @@ export const calculateDiffDecorations = memoizeOne(calculateDiffDecorationsInner
473
484
  hideAddedDiffsUnderline: lastHideAddedDiffsUnderline,
474
485
  showIndicators: lastShowIndicators,
475
486
  smartThresholds: lastSmartThresholds,
476
- deletedDiffPlacement: lastDeletedDiffPlacement
487
+ deletedDiffPlacement: lastDeletedDiffPlacement,
488
+ inlineDeletedDiffPlacement: lastInlineDeletedDiffPlacement
477
489
  }]) => {
478
490
  var _ref2;
479
491
  const originalDocIsSame = lastPluginState.originalDoc && pluginState.originalDoc && pluginState.originalDoc.eq(lastPluginState.originalDoc);
480
492
  if (isExtendedEnabled(diffType)) {
481
493
  var _ref;
482
- return (_ref = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && isEqual(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && hideAddedDiffsUnderline === lastHideAddedDiffsUnderline && showIndicators === lastShowIndicators && isEqual(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement) !== null && _ref !== void 0 ? _ref : false;
494
+ return (_ref = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && isEqual(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && hideAddedDiffsUnderline === lastHideAddedDiffsUnderline && showIndicators === lastShowIndicators && isEqual(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement && inlineDeletedDiffPlacement === lastInlineDeletedDiffPlacement) !== null && _ref !== void 0 ? _ref : false;
483
495
  }
484
496
  return (_ref2 = originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isEqual(activeIndexPos, lastActiveIndexPos) && hideDeletedDiffs === lastHideDeletedDiffs) !== null && _ref2 !== void 0 ? _ref2 : false;
485
497
  });
@@ -8,48 +8,7 @@ import { addedCellOverlayStyle, addedCellOverlayRoundedStyle, deletedRowStyle, d
8
8
  import { deletedTraditionalRowStyle, deletedTraditionalCellOverlayStyle, traditionalAddedCellOverlayStyle, traditionalAddedCellOverlayRoundedStyle } from './colorSchemes/traditional';
9
9
  import { buildDiffDecorationSpec } from './decorationKeys';
10
10
  import { findSafeInsertPos } from './utils/findSafeInsertPos';
11
- /**
12
- * Inserted table rows are rendered as decoration widgets, so their cells do not get the
13
- * `data-reaches-*` attrs normally applied by the table cell node view. Mirror that boundary
14
- * metadata here so the existing rounded-table CSS can round widget cells like real table cells.
15
- */
16
- const getChangedRowCellEdgeAttrs = ({
17
- rowNode,
18
- rowStart,
19
- tableMap
20
- }) => {
21
- const cellEdgeAttrs = [];
22
- rowNode.content.forEach((cellNode, cellOffset) => {
23
- if (cellNode.type.name !== 'tableCell' && cellNode.type.name !== 'tableHeader') {
24
- return;
25
- }
26
- const cellRect = tableMap.findCell(rowStart + 1 + cellOffset);
27
- cellEdgeAttrs.push({
28
- reachesBottom: cellRect.bottom >= tableMap.height,
29
- reachesLeft: cellRect.left === 0,
30
- reachesRight: cellRect.right >= tableMap.width,
31
- reachesTop: cellRect.top === 0
32
- });
33
- });
34
- return cellEdgeAttrs;
35
- };
36
- const applyCellEdgeAttrs = (cell, edgeAttrs) => {
37
- if (!edgeAttrs) {
38
- return;
39
- }
40
- if (edgeAttrs.reachesTop) {
41
- cell.setAttribute('data-reaches-top', 'true');
42
- }
43
- if (edgeAttrs.reachesBottom) {
44
- cell.setAttribute('data-reaches-bottom', 'true');
45
- }
46
- if (edgeAttrs.reachesLeft) {
47
- cell.setAttribute('data-reaches-left', 'true');
48
- }
49
- if (edgeAttrs.reachesRight) {
50
- cell.setAttribute('data-reaches-right', 'true');
51
- }
52
- };
11
+ import { applyCellEdgeAttrs, getRowCellEdgeAttrs } from './utils/tableCellEdgeAttrs';
53
12
  /**
54
13
  * Extracts information about deleted table rows from a change
55
14
  */
@@ -95,7 +54,7 @@ const extractChangedRows = ({
95
54
  // Check if this row overlaps with the deletion range
96
55
  const rowOverlapsChange = rowStart >= changeStartInTable && rowStart < changeEndInTable || rowEnd > changeStartInTable && rowEnd <= changeEndInTable || rowStart < changeStartInTable && rowEnd > changeEndInTable;
97
56
  if (rowOverlapsChange && rowNode.type.name === 'tableRow' && (isExtendedEnabled(diffType) || !isEmptyRow(rowNode))) {
98
- const cellEdgeAttrs = isExtendedEnabled(diffType) && expValEquals('platform_editor_table_diff_rounded_corners', 'isEnabled', true) ? getChangedRowCellEdgeAttrs({
57
+ const cellEdgeAttrs = isExtendedEnabled(diffType) && expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && expValEquals('platform_editor_table_diff_rounded_corners', 'isEnabled', true) ? getRowCellEdgeAttrs({
99
58
  rowNode,
100
59
  rowStart,
101
60
  tableMap: oldTableMap
@@ -0,0 +1,67 @@
1
+ import { TableMap } from '@atlaskit/editor-tables/table-map';
2
+ export const getRowCellEdgeAttrs = ({
3
+ rowNode,
4
+ rowStart,
5
+ tableMap
6
+ }) => {
7
+ const cellEdgeAttrs = [];
8
+ rowNode.content.forEach((cellNode, cellOffset) => {
9
+ if (cellNode.type.name !== 'tableCell' && cellNode.type.name !== 'tableHeader') {
10
+ return;
11
+ }
12
+ const cellRect = tableMap.findCell(rowStart + 1 + cellOffset);
13
+ cellEdgeAttrs.push({
14
+ reachesBottom: cellRect.bottom >= tableMap.height,
15
+ reachesLeft: cellRect.left === 0,
16
+ reachesRight: cellRect.right >= tableMap.width,
17
+ reachesTop: cellRect.top === 0
18
+ });
19
+ });
20
+ return cellEdgeAttrs;
21
+ };
22
+ export const applyCellEdgeAttrs = (cell, edgeAttrs) => {
23
+ if (!edgeAttrs) {
24
+ return;
25
+ }
26
+ if (edgeAttrs.reachesTop) {
27
+ cell.setAttribute('data-reaches-top', 'true');
28
+ }
29
+ if (edgeAttrs.reachesBottom) {
30
+ cell.setAttribute('data-reaches-bottom', 'true');
31
+ }
32
+ if (edgeAttrs.reachesLeft) {
33
+ cell.setAttribute('data-reaches-left', 'true');
34
+ }
35
+ if (edgeAttrs.reachesRight) {
36
+ cell.setAttribute('data-reaches-right', 'true');
37
+ }
38
+ };
39
+ export const applyTableCellEdgeAttrs = ({
40
+ element,
41
+ tableNode
42
+ }) => {
43
+ try {
44
+ const table = element instanceof HTMLTableElement ? element : element.querySelector('table');
45
+ if (!(table instanceof HTMLTableElement)) {
46
+ return;
47
+ }
48
+ const tableMap = TableMap.get(tableNode);
49
+ const cells = Array.from(table.rows).flatMap(row => Array.from(row.cells));
50
+ let cellIndex = 0;
51
+ tableNode.content.forEach((rowNode, rowStart) => {
52
+ getRowCellEdgeAttrs({
53
+ rowNode,
54
+ rowStart,
55
+ tableMap
56
+ }).forEach(edgeAttrs => {
57
+ const cell = cells[cellIndex];
58
+ cellIndex++;
59
+ if (cell) {
60
+ applyCellEdgeAttrs(cell, edgeAttrs);
61
+ }
62
+ });
63
+ });
64
+ } catch {
65
+ // Table structure can be transient while widget DOM is being assembled.
66
+ }
67
+ };
@@ -3,8 +3,9 @@ import { trackChangesMessages } from '@atlaskit/editor-common/messages';
3
3
  import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
4
4
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
5
5
  import { isExtendedEnabled } from '../../isExtendedEnabled';
6
- import { deletedBlockOutline, deletedBlockOutlineActive, deletedBlockOutlineRounded, deletedBlockOutlineRoundedActive, deletedContentStyle, deletedContentStyleActive, deletedContentStyleNew, deletedContentStyleUnbounded, deletedInlineContentStyleExtended, deletedStyleQuoteNodeWithLozenge, deletedStyleQuoteNodeWithLozengeActive, editingContentStyleInBlockExtended, editingContentStyleInBlockExtendedNoUnderline, editingStyleExtended, editingStyleExtendedNoUnderline, editingStyleActiveExtended, editingStyleActiveExtendedNoUnderline, editingStyleNode, addedCellOverlayStyle, deletedCellOverlayStyle } from '../colorSchemes/standard';
7
- import { deletedTraditionalBlockOutlineActive, deletedTraditionalBlockOutlineNew, deletedTraditionalBlockOutlineRoundedActive, deletedTraditionalBlockOutlineRoundedNew, deletedTraditionalContentStyleUnbounded, deletedTraditionalContentStyleUnboundedActive, getDeletedTraditionalInlineStyle, deletedTraditionalStyleQuoteNode, deletedTraditionalStyleQuoteNodeActive, traditionalInsertStyle, traditionalInsertStyleActive, traditionalStyleNodeActive, traditionalStyleNodeNew, traditionalAddedCellOverlayStyleNew, deletedTraditionalCellOverlayStyle } from '../colorSchemes/traditional';
6
+ import { deletedBlockOutline, deletedBlockOutlineActive, deletedBlockOutlineRounded, deletedBlockOutlineRoundedActive, deletedContentStyle, deletedContentStyleActive, deletedContentStyleNew, deletedContentStyleUnbounded, deletedInlineContentStyleExtended, deletedStyleQuoteNodeWithLozenge, deletedStyleQuoteNodeWithLozengeActive, editingContentStyleInBlockExtended, editingContentStyleInBlockExtendedNoUnderline, editingStyleExtended, editingStyleExtendedNoUnderline, editingStyleActiveExtended, editingStyleActiveExtendedNoUnderline, editingStyleNode, addedCellOverlayStyle, addedCellOverlayRoundedStyle, deletedCellOverlayStyle } from '../colorSchemes/standard';
7
+ import { deletedTraditionalBlockOutlineActive, deletedTraditionalBlockOutlineNew, deletedTraditionalBlockOutlineRoundedActive, deletedTraditionalBlockOutlineRoundedNew, deletedTraditionalContentStyleUnbounded, deletedTraditionalContentStyleUnboundedActive, getDeletedTraditionalInlineStyle, deletedTraditionalStyleQuoteNode, deletedTraditionalStyleQuoteNodeActive, traditionalInsertStyle, traditionalInsertStyleActive, traditionalStyleNodeActive, traditionalStyleNodeNew, traditionalAddedCellOverlayRoundedStyle, traditionalAddedCellOverlayStyleNew, deletedTraditionalCellOverlayStyle } from '../colorSchemes/traditional';
8
+ import { applyTableCellEdgeAttrs } from './tableCellEdgeAttrs';
8
9
  const lozengeStyle = convertToInlineCss({
9
10
  display: 'inline-flex',
10
11
  boxSizing: 'border-box',
@@ -163,9 +164,13 @@ const applyCellOverlayStyles = ({
163
164
  colorScheme,
164
165
  isInserted
165
166
  }) => {
167
+ const isRoundedTable = expValEquals('platform_editor_table_diff_rounded_corners', 'isEnabled', true);
166
168
  element.querySelectorAll('td, th').forEach(cell => {
167
169
  const overlay = document.createElement('span');
168
- const overlayStyle = colorScheme === 'traditional' ? isInserted ? traditionalAddedCellOverlayStyleNew : deletedTraditionalCellOverlayStyle : isInserted ? addedCellOverlayStyle : deletedCellOverlayStyle;
170
+ const isTraditional = colorScheme === 'traditional';
171
+ const deletedCellStyle = isTraditional ? deletedTraditionalCellOverlayStyle : deletedCellOverlayStyle;
172
+ const addedCellStyle = isTraditional ? isRoundedTable ? traditionalAddedCellOverlayRoundedStyle : traditionalAddedCellOverlayStyleNew : isRoundedTable ? addedCellOverlayRoundedStyle : addedCellOverlayStyle;
173
+ const overlayStyle = isInserted ? addedCellStyle : deletedCellStyle;
169
174
  overlay.setAttribute('style', overlayStyle);
170
175
  cell.appendChild(overlay);
171
176
  });
@@ -523,6 +528,12 @@ export const wrapBlockNodeView = ({
523
528
  return;
524
529
  }
525
530
  if (targetNode.type.name === 'table') {
531
+ if (expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && expValEquals('platform_editor_table_diff_rounded_corners', 'isEnabled', true)) {
532
+ applyTableCellEdgeAttrs({
533
+ element: nodeView,
534
+ tableNode: targetNode
535
+ });
536
+ }
526
537
  applyCellOverlayStyles({
527
538
  element: nodeView,
528
539
  colorScheme,
@@ -43,7 +43,7 @@ export const createPlugin = (config, getIntl, api) => {
43
43
  let newPluginState = currentPluginState;
44
44
  if (meta) {
45
45
  if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'SHOW_DIFF') {
46
- var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8, _newPluginState9;
46
+ var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8, _newPluginState9, _newPluginState0;
47
47
  // Update the plugin state with the new metadata
48
48
  newPluginState = {
49
49
  ...currentPluginState,
@@ -70,12 +70,13 @@ export const createPlugin = (config, getIntl, api) => {
70
70
  hideAddedDiffsUnderline: (_newPluginState5 = newPluginState) === null || _newPluginState5 === void 0 ? void 0 : _newPluginState5.hideAddedDiffsUnderline,
71
71
  showIndicators: (_newPluginState6 = newPluginState) === null || _newPluginState6 === void 0 ? void 0 : _newPluginState6.showIndicators,
72
72
  smartThresholds: (_newPluginState7 = newPluginState) === null || _newPluginState7 === void 0 ? void 0 : _newPluginState7.smartThresholds,
73
- deletedDiffPlacement: (_newPluginState8 = newPluginState) === null || _newPluginState8 === void 0 ? void 0 : _newPluginState8.deletedDiffPlacement
73
+ deletedDiffPlacement: (_newPluginState8 = newPluginState) === null || _newPluginState8 === void 0 ? void 0 : _newPluginState8.deletedDiffPlacement,
74
+ inlineDeletedDiffPlacement: (_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.inlineDeletedDiffPlacement
74
75
  } : {})
75
76
  });
76
77
  // Update the decorations and their ids
77
78
  newPluginState.decorations = decorations;
78
- if (isExtendedEnabled((_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.diffType)) {
79
+ if (isExtendedEnabled((_newPluginState0 = newPluginState) === null || _newPluginState0 === void 0 ? void 0 : _newPluginState0.diffType)) {
79
80
  newPluginState.diffDescriptors = diffDescriptors;
80
81
  }
81
82
  } else if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'HIDE_DIFF') {
@@ -98,9 +99,9 @@ export const createPlugin = (config, getIntl, api) => {
98
99
  } : {})
99
100
  };
100
101
  } 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') {
101
- var _newPluginState0;
102
+ var _newPluginState1;
102
103
  // Update the active index in plugin state and recalculate decorations
103
- const decorations = getScrollableDecorations(currentPluginState.decorations, newState.doc, (_newPluginState0 = newPluginState) === null || _newPluginState0 === void 0 ? void 0 : _newPluginState0.diffType);
104
+ const decorations = getScrollableDecorations(currentPluginState.decorations, newState.doc, (_newPluginState1 = newPluginState) === null || _newPluginState1 === void 0 ? void 0 : _newPluginState1.diffType);
104
105
  if (decorations.length > 0) {
105
106
  var _currentPluginState$a;
106
107
  // Initialize to -1 if undefined so that the first "next" scroll takes us to index 0 (first change).
@@ -145,7 +146,8 @@ export const createPlugin = (config, getIntl, api) => {
145
146
  hideAddedDiffsUnderline: newPluginState.hideAddedDiffsUnderline,
146
147
  showIndicators: newPluginState.showIndicators,
147
148
  smartThresholds: newPluginState.smartThresholds,
148
- deletedDiffPlacement: newPluginState.deletedDiffPlacement
149
+ deletedDiffPlacement: newPluginState.deletedDiffPlacement,
150
+ inlineDeletedDiffPlacement: newPluginState.inlineDeletedDiffPlacement
149
151
  } : {})
150
152
  });
151
153
  newPluginState.decorations = updatedDecorations;
@@ -145,7 +145,9 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
145
145
  showIndicators = _ref3$showIndicators === void 0 ? false : _ref3$showIndicators,
146
146
  smartThresholds = _ref3.smartThresholds,
147
147
  _ref3$deletedDiffPlac = _ref3.deletedDiffPlacement,
148
- deletedDiffPlacement = _ref3$deletedDiffPlac === void 0 ? 'top' : _ref3$deletedDiffPlac;
148
+ deletedDiffPlacement = _ref3$deletedDiffPlac === void 0 ? 'top' : _ref3$deletedDiffPlac,
149
+ _ref3$inlineDeletedDi = _ref3.inlineDeletedDiffPlacement,
150
+ inlineDeletedDiffPlacement = _ref3$inlineDeletedDi === void 0 ? 'before' : _ref3$inlineDeletedDi;
149
151
  var originalDoc = pluginState.originalDoc,
150
152
  steps = pluginState.steps,
151
153
  isDisplayingChanges = pluginState.isDisplayingChanges;
@@ -320,10 +322,19 @@ var calculateDiffDecorationsInner = function calculateDiffDecorationsInner(_ref3
320
322
  isInserted: !isInserted,
321
323
  diffType: diffType,
322
324
  hideAddedDiffsUnderline: hideAddedDiffsUnderline,
323
- // For `smart` node- and paragraph-level changes, optionally render the
324
- // deleted content below the new content (gray + strikethrough) instead
325
- // of above it. Controlled by `deletedDiffPlacement` (default `'top'`).
326
- placeBelow: deletedDiffPlacement === 'bottom' && diffType === 'smart' && fg('platform_editor_ai_smart_diff') && (smartChangeLevel(change) === 'node' || smartChangeLevel(change) === 'paragraph')
325
+ // For `smart` changes, optionally render the deleted content after the new
326
+ // content (gray + strikethrough) instead of before it. Two independent
327
+ // controls, split by change level:
328
+ // - node/paragraph-level: `deletedDiffPlacement` (default `'top'`).
329
+ // - inline/sentence-level: `inlineDeletedDiffPlacement` (default `'before'`).
330
+ placeBelow: diffType === 'smart' && fg('platform_editor_ai_smart_diff') && function () {
331
+ var level = smartChangeLevel(change);
332
+ if (level === 'node' || level === 'paragraph') {
333
+ return deletedDiffPlacement === 'bottom';
334
+ }
335
+ // Inline-level (undefined) and sentence-level changes.
336
+ return inlineDeletedDiffPlacement === 'after';
337
+ }()
327
338
  }), {}, {
328
339
  showIndicators: showIndicators
329
340
  }))));
@@ -494,7 +505,8 @@ function (_ref5, _ref6) {
494
505
  hideAddedDiffsUnderline = _ref7$.hideAddedDiffsUnderline,
495
506
  showIndicators = _ref7$.showIndicators,
496
507
  smartThresholds = _ref7$.smartThresholds,
497
- deletedDiffPlacement = _ref7$.deletedDiffPlacement;
508
+ deletedDiffPlacement = _ref7$.deletedDiffPlacement,
509
+ inlineDeletedDiffPlacement = _ref7$.inlineDeletedDiffPlacement;
498
510
  var _ref8 = _slicedToArray(_ref6, 1),
499
511
  _ref8$ = _ref8[0],
500
512
  lastPluginState = _ref8$.pluginState,
@@ -508,11 +520,12 @@ function (_ref5, _ref6) {
508
520
  lastHideAddedDiffsUnderline = _ref8$.hideAddedDiffsUnderline,
509
521
  lastShowIndicators = _ref8$.showIndicators,
510
522
  lastSmartThresholds = _ref8$.smartThresholds,
511
- lastDeletedDiffPlacement = _ref8$.deletedDiffPlacement;
523
+ lastDeletedDiffPlacement = _ref8$.deletedDiffPlacement,
524
+ lastInlineDeletedDiffPlacement = _ref8$.inlineDeletedDiffPlacement;
512
525
  var originalDocIsSame = lastPluginState.originalDoc && pluginState.originalDoc && pluginState.originalDoc.eq(lastPluginState.originalDoc);
513
526
  if (isExtendedEnabled(diffType)) {
514
527
  var _ref9;
515
- return (_ref9 = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && isEqual(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && hideAddedDiffsUnderline === lastHideAddedDiffsUnderline && showIndicators === lastShowIndicators && isEqual(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement) !== null && _ref9 !== void 0 ? _ref9 : false;
528
+ return (_ref9 = colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isInverted === lastIsInverted && diffType === lastDiffType && isEqual(activeIndexPos, lastActiveIndexPos) && originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && hideDeletedDiffs === lastHideDeletedDiffs && hideAddedDiffsUnderline === lastHideAddedDiffsUnderline && showIndicators === lastShowIndicators && isEqual(smartThresholds, lastSmartThresholds) && deletedDiffPlacement === lastDeletedDiffPlacement && inlineDeletedDiffPlacement === lastInlineDeletedDiffPlacement) !== null && _ref9 !== void 0 ? _ref9 : false;
516
529
  }
517
530
  return (_ref0 = originalDocIsSame && isEqual(pluginState.steps, lastPluginState.steps) && state.doc.eq(lastState.doc) && colorScheme === lastColorScheme && intl.locale === lastIntl.locale && isEqual(activeIndexPos, lastActiveIndexPos) && hideDeletedDiffs === lastHideDeletedDiffs) !== null && _ref0 !== void 0 ? _ref0 : false;
518
531
  });
@@ -15,55 +15,15 @@ import { addedCellOverlayStyle, addedCellOverlayRoundedStyle, deletedRowStyle, d
15
15
  import { deletedTraditionalRowStyle, deletedTraditionalCellOverlayStyle, traditionalAddedCellOverlayStyle, traditionalAddedCellOverlayRoundedStyle } from './colorSchemes/traditional';
16
16
  import { buildDiffDecorationSpec } from './decorationKeys';
17
17
  import { findSafeInsertPos } from './utils/findSafeInsertPos';
18
- /**
19
- * Inserted table rows are rendered as decoration widgets, so their cells do not get the
20
- * `data-reaches-*` attrs normally applied by the table cell node view. Mirror that boundary
21
- * metadata here so the existing rounded-table CSS can round widget cells like real table cells.
22
- */
23
- var getChangedRowCellEdgeAttrs = function getChangedRowCellEdgeAttrs(_ref) {
24
- var rowNode = _ref.rowNode,
25
- rowStart = _ref.rowStart,
26
- tableMap = _ref.tableMap;
27
- var cellEdgeAttrs = [];
28
- rowNode.content.forEach(function (cellNode, cellOffset) {
29
- if (cellNode.type.name !== 'tableCell' && cellNode.type.name !== 'tableHeader') {
30
- return;
31
- }
32
- var cellRect = tableMap.findCell(rowStart + 1 + cellOffset);
33
- cellEdgeAttrs.push({
34
- reachesBottom: cellRect.bottom >= tableMap.height,
35
- reachesLeft: cellRect.left === 0,
36
- reachesRight: cellRect.right >= tableMap.width,
37
- reachesTop: cellRect.top === 0
38
- });
39
- });
40
- return cellEdgeAttrs;
41
- };
42
- var applyCellEdgeAttrs = function applyCellEdgeAttrs(cell, edgeAttrs) {
43
- if (!edgeAttrs) {
44
- return;
45
- }
46
- if (edgeAttrs.reachesTop) {
47
- cell.setAttribute('data-reaches-top', 'true');
48
- }
49
- if (edgeAttrs.reachesBottom) {
50
- cell.setAttribute('data-reaches-bottom', 'true');
51
- }
52
- if (edgeAttrs.reachesLeft) {
53
- cell.setAttribute('data-reaches-left', 'true');
54
- }
55
- if (edgeAttrs.reachesRight) {
56
- cell.setAttribute('data-reaches-right', 'true');
57
- }
58
- };
18
+ import { applyCellEdgeAttrs, getRowCellEdgeAttrs } from './utils/tableCellEdgeAttrs';
59
19
  /**
60
20
  * Extracts information about deleted table rows from a change
61
21
  */
62
- var extractChangedRows = function extractChangedRows(_ref2) {
63
- var change = _ref2.change,
64
- originalDoc = _ref2.originalDoc,
65
- newDoc = _ref2.newDoc,
66
- diffType = _ref2.diffType;
22
+ var extractChangedRows = function extractChangedRows(_ref) {
23
+ var change = _ref.change,
24
+ originalDoc = _ref.originalDoc,
25
+ newDoc = _ref.newDoc,
26
+ diffType = _ref.diffType;
67
27
  var changedRows = [];
68
28
 
69
29
  // Find the table in the original document
@@ -104,7 +64,7 @@ var extractChangedRows = function extractChangedRows(_ref2) {
104
64
  // Check if this row overlaps with the deletion range
105
65
  var rowOverlapsChange = rowStart >= changeStartInTable && rowStart < changeEndInTable || rowEnd > changeStartInTable && rowEnd <= changeEndInTable || rowStart < changeStartInTable && rowEnd > changeEndInTable;
106
66
  if (rowOverlapsChange && rowNode.type.name === 'tableRow' && (isExtendedEnabled(diffType) || !isEmptyRow(rowNode))) {
107
- var cellEdgeAttrs = isExtendedEnabled(diffType) && expValEquals('platform_editor_table_diff_rounded_corners', 'isEnabled', true) ? getChangedRowCellEdgeAttrs({
67
+ var cellEdgeAttrs = isExtendedEnabled(diffType) && expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && expValEquals('platform_editor_table_diff_rounded_corners', 'isEnabled', true) ? getRowCellEdgeAttrs({
108
68
  rowNode: rowNode,
109
69
  rowStart: rowStart,
110
70
  tableMap: oldTableMap
@@ -211,11 +171,11 @@ var createChangedRowDOM = function createChangedRowDOM(rowNode, cellEdgeAttrs, n
211
171
  /**
212
172
  * Expands a diff to include whole changed rows when table rows are affected
213
173
  */
214
- var expandDiffForChangedRows = function expandDiffForChangedRows(_ref3) {
215
- var changes = _ref3.changes,
216
- originalDoc = _ref3.originalDoc,
217
- newDoc = _ref3.newDoc,
218
- diffType = _ref3.diffType;
174
+ var expandDiffForChangedRows = function expandDiffForChangedRows(_ref2) {
175
+ var changes = _ref2.changes,
176
+ originalDoc = _ref2.originalDoc,
177
+ newDoc = _ref2.newDoc,
178
+ diffType = _ref2.diffType;
219
179
  var rowInfo = [];
220
180
  var _iterator = _createForOfIteratorHelper(changes),
221
181
  _step;
@@ -244,15 +204,15 @@ var expandDiffForChangedRows = function expandDiffForChangedRows(_ref3) {
244
204
  /**
245
205
  * Main function to handle deleted rows - computes diff and creates decorations
246
206
  */
247
- export var createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(_ref4) {
248
- var changes = _ref4.changes,
249
- originalDoc = _ref4.originalDoc,
250
- newDoc = _ref4.newDoc,
251
- nodeViewSerializer = _ref4.nodeViewSerializer,
252
- colorScheme = _ref4.colorScheme,
253
- _ref4$isInserted = _ref4.isInserted,
254
- isInserted = _ref4$isInserted === void 0 ? false : _ref4$isInserted,
255
- diffType = _ref4.diffType;
207
+ export var createChangedRowDecorationWidgets = function createChangedRowDecorationWidgets(_ref3) {
208
+ var changes = _ref3.changes,
209
+ originalDoc = _ref3.originalDoc,
210
+ newDoc = _ref3.newDoc,
211
+ nodeViewSerializer = _ref3.nodeViewSerializer,
212
+ colorScheme = _ref3.colorScheme,
213
+ _ref3$isInserted = _ref3.isInserted,
214
+ isInserted = _ref3$isInserted === void 0 ? false : _ref3$isInserted,
215
+ diffType = _ref3.diffType;
256
216
  // First, expand the changes to include complete deleted rows
257
217
  var changedRows = expandDiffForChangedRows({
258
218
  changes: changes.filter(function (change) {
@@ -0,0 +1,67 @@
1
+ import { TableMap } from '@atlaskit/editor-tables/table-map';
2
+ export var getRowCellEdgeAttrs = function getRowCellEdgeAttrs(_ref) {
3
+ var rowNode = _ref.rowNode,
4
+ rowStart = _ref.rowStart,
5
+ tableMap = _ref.tableMap;
6
+ var cellEdgeAttrs = [];
7
+ rowNode.content.forEach(function (cellNode, cellOffset) {
8
+ if (cellNode.type.name !== 'tableCell' && cellNode.type.name !== 'tableHeader') {
9
+ return;
10
+ }
11
+ var cellRect = tableMap.findCell(rowStart + 1 + cellOffset);
12
+ cellEdgeAttrs.push({
13
+ reachesBottom: cellRect.bottom >= tableMap.height,
14
+ reachesLeft: cellRect.left === 0,
15
+ reachesRight: cellRect.right >= tableMap.width,
16
+ reachesTop: cellRect.top === 0
17
+ });
18
+ });
19
+ return cellEdgeAttrs;
20
+ };
21
+ export var applyCellEdgeAttrs = function applyCellEdgeAttrs(cell, edgeAttrs) {
22
+ if (!edgeAttrs) {
23
+ return;
24
+ }
25
+ if (edgeAttrs.reachesTop) {
26
+ cell.setAttribute('data-reaches-top', 'true');
27
+ }
28
+ if (edgeAttrs.reachesBottom) {
29
+ cell.setAttribute('data-reaches-bottom', 'true');
30
+ }
31
+ if (edgeAttrs.reachesLeft) {
32
+ cell.setAttribute('data-reaches-left', 'true');
33
+ }
34
+ if (edgeAttrs.reachesRight) {
35
+ cell.setAttribute('data-reaches-right', 'true');
36
+ }
37
+ };
38
+ export var applyTableCellEdgeAttrs = function applyTableCellEdgeAttrs(_ref2) {
39
+ var element = _ref2.element,
40
+ tableNode = _ref2.tableNode;
41
+ try {
42
+ var table = element instanceof HTMLTableElement ? element : element.querySelector('table');
43
+ if (!(table instanceof HTMLTableElement)) {
44
+ return;
45
+ }
46
+ var tableMap = TableMap.get(tableNode);
47
+ var cells = Array.from(table.rows).flatMap(function (row) {
48
+ return Array.from(row.cells);
49
+ });
50
+ var cellIndex = 0;
51
+ tableNode.content.forEach(function (rowNode, rowStart) {
52
+ getRowCellEdgeAttrs({
53
+ rowNode: rowNode,
54
+ rowStart: rowStart,
55
+ tableMap: tableMap
56
+ }).forEach(function (edgeAttrs) {
57
+ var cell = cells[cellIndex];
58
+ cellIndex++;
59
+ if (cell) {
60
+ applyCellEdgeAttrs(cell, edgeAttrs);
61
+ }
62
+ });
63
+ });
64
+ } catch (_unused) {
65
+ // Table structure can be transient while widget DOM is being assembled.
66
+ }
67
+ };
@@ -4,8 +4,9 @@ import { trackChangesMessages } from '@atlaskit/editor-common/messages';
4
4
  import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
5
5
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
6
6
  import { isExtendedEnabled } from '../../isExtendedEnabled';
7
- import { deletedBlockOutline, deletedBlockOutlineActive, deletedBlockOutlineRounded, deletedBlockOutlineRoundedActive, deletedContentStyle, deletedContentStyleActive, deletedContentStyleNew, deletedContentStyleUnbounded, deletedInlineContentStyleExtended, deletedStyleQuoteNodeWithLozenge, deletedStyleQuoteNodeWithLozengeActive, editingContentStyleInBlockExtended, editingContentStyleInBlockExtendedNoUnderline, editingStyleExtended, editingStyleExtendedNoUnderline, editingStyleActiveExtended, editingStyleActiveExtendedNoUnderline, editingStyleNode, addedCellOverlayStyle, deletedCellOverlayStyle } from '../colorSchemes/standard';
8
- import { deletedTraditionalBlockOutlineActive, deletedTraditionalBlockOutlineNew, deletedTraditionalBlockOutlineRoundedActive, deletedTraditionalBlockOutlineRoundedNew, deletedTraditionalContentStyleUnbounded, deletedTraditionalContentStyleUnboundedActive, getDeletedTraditionalInlineStyle, deletedTraditionalStyleQuoteNode, deletedTraditionalStyleQuoteNodeActive, traditionalInsertStyle, traditionalInsertStyleActive, traditionalStyleNodeActive, traditionalStyleNodeNew, traditionalAddedCellOverlayStyleNew, deletedTraditionalCellOverlayStyle } from '../colorSchemes/traditional';
7
+ import { deletedBlockOutline, deletedBlockOutlineActive, deletedBlockOutlineRounded, deletedBlockOutlineRoundedActive, deletedContentStyle, deletedContentStyleActive, deletedContentStyleNew, deletedContentStyleUnbounded, deletedInlineContentStyleExtended, deletedStyleQuoteNodeWithLozenge, deletedStyleQuoteNodeWithLozengeActive, editingContentStyleInBlockExtended, editingContentStyleInBlockExtendedNoUnderline, editingStyleExtended, editingStyleExtendedNoUnderline, editingStyleActiveExtended, editingStyleActiveExtendedNoUnderline, editingStyleNode, addedCellOverlayStyle, addedCellOverlayRoundedStyle, deletedCellOverlayStyle } from '../colorSchemes/standard';
8
+ import { deletedTraditionalBlockOutlineActive, deletedTraditionalBlockOutlineNew, deletedTraditionalBlockOutlineRoundedActive, deletedTraditionalBlockOutlineRoundedNew, deletedTraditionalContentStyleUnbounded, deletedTraditionalContentStyleUnboundedActive, getDeletedTraditionalInlineStyle, deletedTraditionalStyleQuoteNode, deletedTraditionalStyleQuoteNodeActive, traditionalInsertStyle, traditionalInsertStyleActive, traditionalStyleNodeActive, traditionalStyleNodeNew, traditionalAddedCellOverlayRoundedStyle, traditionalAddedCellOverlayStyleNew, deletedTraditionalCellOverlayStyle } from '../colorSchemes/traditional';
9
+ import { applyTableCellEdgeAttrs } from './tableCellEdgeAttrs';
9
10
  var lozengeStyle = convertToInlineCss({
10
11
  display: 'inline-flex',
11
12
  boxSizing: 'border-box',
@@ -171,9 +172,13 @@ var applyCellOverlayStyles = function applyCellOverlayStyles(_ref2) {
171
172
  var element = _ref2.element,
172
173
  colorScheme = _ref2.colorScheme,
173
174
  isInserted = _ref2.isInserted;
175
+ var isRoundedTable = expValEquals('platform_editor_table_diff_rounded_corners', 'isEnabled', true);
174
176
  element.querySelectorAll('td, th').forEach(function (cell) {
175
177
  var overlay = document.createElement('span');
176
- var overlayStyle = colorScheme === 'traditional' ? isInserted ? traditionalAddedCellOverlayStyleNew : deletedTraditionalCellOverlayStyle : isInserted ? addedCellOverlayStyle : deletedCellOverlayStyle;
178
+ var isTraditional = colorScheme === 'traditional';
179
+ var deletedCellStyle = isTraditional ? deletedTraditionalCellOverlayStyle : deletedCellOverlayStyle;
180
+ var addedCellStyle = isTraditional ? isRoundedTable ? traditionalAddedCellOverlayRoundedStyle : traditionalAddedCellOverlayStyleNew : isRoundedTable ? addedCellOverlayRoundedStyle : addedCellOverlayStyle;
181
+ var overlayStyle = isInserted ? addedCellStyle : deletedCellStyle;
177
182
  overlay.setAttribute('style', overlayStyle);
178
183
  cell.appendChild(overlay);
179
184
  });
@@ -537,6 +542,12 @@ export var wrapBlockNodeView = function wrapBlockNodeView(_ref0) {
537
542
  return;
538
543
  }
539
544
  if (targetNode.type.name === 'table') {
545
+ if (expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && expValEquals('platform_editor_table_diff_rounded_corners', 'isEnabled', true)) {
546
+ applyTableCellEdgeAttrs({
547
+ element: nodeView,
548
+ tableNode: targetNode
549
+ });
550
+ }
540
551
  applyCellOverlayStyles({
541
552
  element: nodeView,
542
553
  colorScheme: colorScheme,
@@ -45,7 +45,7 @@ export var createPlugin = function createPlugin(config, getIntl, api) {
45
45
  var newPluginState = currentPluginState;
46
46
  if (meta) {
47
47
  if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'SHOW_DIFF') {
48
- var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8, _newPluginState9;
48
+ var _newPluginState, _newPluginState2, _newPluginState3, _newPluginState4, _newPluginState5, _newPluginState6, _newPluginState7, _newPluginState8, _newPluginState9, _newPluginState0;
49
49
  // Update the plugin state with the new metadata
50
50
  newPluginState = _objectSpread(_objectSpread(_objectSpread({}, currentPluginState), meta), {}, {
51
51
  isDisplayingChanges: true,
@@ -67,13 +67,14 @@ export var createPlugin = function createPlugin(config, getIntl, api) {
67
67
  hideAddedDiffsUnderline: (_newPluginState5 = newPluginState) === null || _newPluginState5 === void 0 ? void 0 : _newPluginState5.hideAddedDiffsUnderline,
68
68
  showIndicators: (_newPluginState6 = newPluginState) === null || _newPluginState6 === void 0 ? void 0 : _newPluginState6.showIndicators,
69
69
  smartThresholds: (_newPluginState7 = newPluginState) === null || _newPluginState7 === void 0 ? void 0 : _newPluginState7.smartThresholds,
70
- deletedDiffPlacement: (_newPluginState8 = newPluginState) === null || _newPluginState8 === void 0 ? void 0 : _newPluginState8.deletedDiffPlacement
70
+ deletedDiffPlacement: (_newPluginState8 = newPluginState) === null || _newPluginState8 === void 0 ? void 0 : _newPluginState8.deletedDiffPlacement,
71
+ inlineDeletedDiffPlacement: (_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.inlineDeletedDiffPlacement
71
72
  } : {})),
72
73
  decorations = _calculateDiffDecorat.decorations,
73
74
  diffDescriptors = _calculateDiffDecorat.diffDescriptors;
74
75
  // Update the decorations and their ids
75
76
  newPluginState.decorations = decorations;
76
- if (isExtendedEnabled((_newPluginState9 = newPluginState) === null || _newPluginState9 === void 0 ? void 0 : _newPluginState9.diffType)) {
77
+ if (isExtendedEnabled((_newPluginState0 = newPluginState) === null || _newPluginState0 === void 0 ? void 0 : _newPluginState0.diffType)) {
77
78
  newPluginState.diffDescriptors = diffDescriptors;
78
79
  }
79
80
  } else if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'HIDE_DIFF') {
@@ -89,9 +90,9 @@ export var createPlugin = function createPlugin(config, getIntl, api) {
89
90
  diffDescriptors: []
90
91
  } : {});
91
92
  } 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') {
92
- var _newPluginState0;
93
+ var _newPluginState1;
93
94
  // Update the active index in plugin state and recalculate decorations
94
- var _decorations = getScrollableDecorations(currentPluginState.decorations, newState.doc, (_newPluginState0 = newPluginState) === null || _newPluginState0 === void 0 ? void 0 : _newPluginState0.diffType);
95
+ var _decorations = getScrollableDecorations(currentPluginState.decorations, newState.doc, (_newPluginState1 = newPluginState) === null || _newPluginState1 === void 0 ? void 0 : _newPluginState1.diffType);
95
96
  if (_decorations.length > 0) {
96
97
  var _currentPluginState$a;
97
98
  // Initialize to -1 if undefined so that the first "next" scroll takes us to index 0 (first change).
@@ -132,7 +133,8 @@ export var createPlugin = function createPlugin(config, getIntl, api) {
132
133
  hideAddedDiffsUnderline: newPluginState.hideAddedDiffsUnderline,
133
134
  showIndicators: newPluginState.showIndicators,
134
135
  smartThresholds: newPluginState.smartThresholds,
135
- deletedDiffPlacement: newPluginState.deletedDiffPlacement
136
+ deletedDiffPlacement: newPluginState.deletedDiffPlacement,
137
+ inlineDeletedDiffPlacement: newPluginState.inlineDeletedDiffPlacement
136
138
  } : {})),
137
139
  updatedDecorations = _calculateDiffDecorat2.decorations,
138
140
  updatedDiffDescriptors = _calculateDiffDecorat2.diffDescriptors;
@@ -3,7 +3,7 @@ import type { IntlShape } from 'react-intl';
3
3
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
4
  import type { EditorState } from '@atlaskit/editor-prosemirror/state';
5
5
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
6
- import type { ColorScheme, DeletedDiffPlacement, DiffDescriptor, ShowDiffPlugin, SmartDiffThresholds } from '../../showDiffPluginType';
6
+ import type { ColorScheme, DeletedDiffPlacement, DiffDescriptor, InlineDeletedDiffPlacement, ShowDiffPlugin, SmartDiffThresholds } from '../../showDiffPluginType';
7
7
  import type { ShowDiffPluginState } from '../main';
8
8
  import type { NodeViewSerializer } from '../NodeViewSerializer';
9
9
  type CalculatedDiffs = {
@@ -20,6 +20,7 @@ export declare const calculateDiffDecorations: MemoizedFn<({ state, pluginState,
20
20
  deletedDiffPlacement?: DeletedDiffPlacement;
21
21
  hideAddedDiffsUnderline?: boolean;
22
22
  hideDeletedDiffs?: boolean;
23
+ inlineDeletedDiffPlacement?: InlineDeletedDiffPlacement;
23
24
  intl: IntlShape;
24
25
  nodeViewSerializer: NodeViewSerializer;
25
26
  pluginState: Omit<ShowDiffPluginState, 'decorations'>;
@@ -0,0 +1,18 @@
1
+ import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
2
+ import { TableMap } from '@atlaskit/editor-tables/table-map';
3
+ export type CellEdgeAttrs = {
4
+ reachesBottom: boolean;
5
+ reachesLeft: boolean;
6
+ reachesRight: boolean;
7
+ reachesTop: boolean;
8
+ };
9
+ export declare const getRowCellEdgeAttrs: ({ rowNode, rowStart, tableMap, }: {
10
+ rowNode: PMNode;
11
+ rowStart: number;
12
+ tableMap: TableMap;
13
+ }) => CellEdgeAttrs[];
14
+ export declare const applyCellEdgeAttrs: (cell: HTMLElement, edgeAttrs?: CellEdgeAttrs) => void;
15
+ export declare const applyTableCellEdgeAttrs: ({ element, tableNode, }: {
16
+ element: HTMLElement;
17
+ tableNode: PMNode;
18
+ }) => void;
@@ -5,7 +5,7 @@ import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
5
5
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
6
6
  import { Step as ProseMirrorStep } from '@atlaskit/editor-prosemirror/transform';
7
7
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
8
- import type { DeletedDiffPlacement, DiffDescriptor, DiffParams, DiffType, ShowDiffPlugin, SmartDiffThresholds } from '../showDiffPluginType';
8
+ import type { DeletedDiffPlacement, DiffDescriptor, DiffParams, DiffType, InlineDeletedDiffPlacement, ShowDiffPlugin, SmartDiffThresholds } from '../showDiffPluginType';
9
9
  export declare const showDiffPluginKey: PluginKey<ShowDiffPluginState>;
10
10
  export type ShowDiffPluginState = {
11
11
  activeIndex?: number;
@@ -25,8 +25,14 @@ export type ShowDiffPluginState = {
25
25
  */
26
26
  diffDescriptors?: DiffDescriptor[];
27
27
  diffType?: DiffType;
28
- hideDeletedDiffs?: boolean;
29
28
  hideAddedDiffsUnderline?: boolean;
29
+ hideDeletedDiffs?: boolean;
30
+ /**
31
+ * For the `smart` diffType, where inline-level (and sentence-level) deleted content is rendered
32
+ * relative to the new content. Set via SHOW_DIFF meta. Defaults to `'before'`. Independent of
33
+ * `deletedDiffPlacement`.
34
+ */
35
+ inlineDeletedDiffPlacement?: InlineDeletedDiffPlacement;
30
36
  isDisplayingChanges: boolean;
31
37
  isInverted?: boolean;
32
38
  originalDoc: PMNode | undefined;
@@ -16,6 +16,14 @@ export type DiffType = 'inline' | 'block' | 'step' | 'smart';
16
16
  * - `'bottom'`: the deleted content is anchored below the new content.
17
17
  */
18
18
  export type DeletedDiffPlacement = 'top' | 'bottom';
19
+ /**
20
+ * Where inline-level (and sentence-level) deleted content is rendered relative to the new
21
+ * (replacement) content in the `smart` diffType. This is independent of the node/paragraph-level
22
+ * `deletedDiffPlacement` option:
23
+ * - `'before'` (default): the deleted content is anchored before the new content.
24
+ * - `'after'`: the deleted content is anchored after the new content.
25
+ */
26
+ export type InlineDeletedDiffPlacement = 'before' | 'after';
19
27
  export type SmartDiffThresholds = SmartDiffThresholdsInternal;
20
28
  export type DiffDescriptor = {
21
29
  id: string;
@@ -49,6 +57,13 @@ export type PMDiffParams = {
49
57
  */
50
58
  hideAddedDiffsUnderline?: boolean;
51
59
  hideDeletedDiffs?: boolean;
60
+ /**
61
+ * For the `smart` diffType, where inline-level (and sentence-level) deleted content is rendered
62
+ * relative to the new content. Defaults to `'before'`. Independent of `deletedDiffPlacement`
63
+ * (which controls node/paragraph-level placement). Ignored for other diff types, and a no-op
64
+ * unless the relevant gate is enabled.
65
+ */
66
+ inlineDeletedDiffPlacement?: InlineDeletedDiffPlacement;
52
67
  isInverted?: boolean;
53
68
  originalDoc: Node;
54
69
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-show-diff",
3
- "version": "10.5.3",
3
+ "version": "10.6.1",
4
4
  "description": "ShowDiff plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -28,8 +28,8 @@
28
28
  "@atlaskit/editor-prosemirror": "^8.0.0",
29
29
  "@atlaskit/editor-tables": "^3.0.0",
30
30
  "@atlaskit/platform-feature-flags": "^2.1.0",
31
- "@atlaskit/tmp-editor-statsig": "^132.1.0",
32
- "@atlaskit/tokens": "^16.2.0",
31
+ "@atlaskit/tmp-editor-statsig": "^133.0.0",
32
+ "@atlaskit/tokens": "^16.3.0",
33
33
  "@babel/runtime": "^7.0.0",
34
34
  "@compiled/react": "^1.0.0",
35
35
  "lodash": "^4.17.21",
@@ -41,10 +41,10 @@
41
41
  "@atlaskit/button": "^24.3.0",
42
42
  "@atlaskit/css": "^1.0.0",
43
43
  "@atlaskit/dropdown-menu": "^17.1.0",
44
- "@atlaskit/editor-core": "^221.12.0",
44
+ "@atlaskit/editor-core": "^221.14.0",
45
45
  "@atlaskit/editor-json-transformer": "^9.0.0",
46
46
  "@atlaskit/form": "^16.1.0",
47
- "@atlaskit/primitives": "^22.1.0",
47
+ "@atlaskit/primitives": "^22.2.0",
48
48
  "@atlaskit/section-message": "^9.2.0",
49
49
  "@atlaskit/textarea": "^9.1.0",
50
50
  "@atlassian/confluence-presets": "workspace:^",
@@ -54,7 +54,7 @@
54
54
  "react-intl": "^7.0.0"
55
55
  },
56
56
  "peerDependencies": {
57
- "@atlaskit/editor-common": "^116.35.0",
57
+ "@atlaskit/editor-common": "^116.39.0",
58
58
  "react": "^18.2.0"
59
59
  },
60
60
  "techstack": {