@atlaskit/editor-plugin-show-diff 22.0.4 → 22.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/pm-plugins/decorations/createAnchorDecorationWidgets.js +10 -3
  3. package/dist/cjs/ui/IndicatorBar/IndicatorBar.compiled.css +1 -0
  4. package/dist/cjs/ui/IndicatorBar/IndicatorBar.js +3 -1
  5. package/dist/es2019/pm-plugins/decorations/createAnchorDecorationWidgets.js +9 -2
  6. package/dist/es2019/ui/IndicatorBar/IndicatorBar.compiled.css +1 -0
  7. package/dist/es2019/ui/IndicatorBar/IndicatorBar.js +3 -1
  8. package/dist/esm/pm-plugins/decorations/createAnchorDecorationWidgets.js +10 -3
  9. package/dist/esm/ui/IndicatorBar/IndicatorBar.compiled.css +1 -0
  10. package/dist/esm/ui/IndicatorBar/IndicatorBar.js +3 -1
  11. package/package.json +6 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/editor-plugin-show-diff
2
2
 
3
+ ## 22.0.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [`3f41dc18d7b3e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3f41dc18d7b3e) -
8
+ EDITOR-9252 Align show diff indicators in Firefox without transformed anchors, disable
9
+ anchor-based hiding so indicators remain visible when the optional left-offset decoration is
10
+ absent, and size list replacement widgets to their content under
11
+ platform_editor_ai_show_diff_patch_2.
12
+ - Updated dependencies
13
+
14
+ ## 22.0.5
15
+
16
+ ### Patch Changes
17
+
18
+ - Updated dependencies
19
+
3
20
  ## 22.0.4
4
21
 
5
22
  ### Patch Changes
package/dist/cjs/pm-plugins/decorations/createAnchorDecorationWidgets.js CHANGED
@@ -235,7 +235,10 @@ var createLeftAnchorWidget = exports.createLeftAnchorWidget = function createLef
235
235
  anchor.style.setProperty('anchor-name', "--".concat(leftAnchorKey));
236
236
  anchor.style.setProperty('position', 'absolute');
237
237
  anchor.style.setProperty('left', "calc(50% - ".concat((edgeCase === null || edgeCase === void 0 ? void 0 : edgeCase.leftOffset) || 0, "px)"));
238
- anchor.style.setProperty('transform', 'translateX(-50%)');
238
+ // transforms on anchors have limited browser support
239
+ if (!(0, _fg.fg)('platform_editor_ai_show_diff_patch_2')) {
240
+ anchor.style.setProperty('transform', 'translateX(-50%)');
241
+ }
239
242
  wrapper.appendChild(anchor);
240
243
  var _measureWidth = function measureWidth() {
241
244
  var _nodeDOM$querySelecto;
@@ -248,7 +251,8 @@ var createLeftAnchorWidget = exports.createLeftAnchorWidget = function createLef
248
251
  return;
249
252
  }
250
253
  var measuredElements = widthMeasureTargets.flatMap(function (_ref2) {
251
- var targetMeasureElement = _ref2.measureElement,
254
+ var leftOffset = _ref2.leftOffset,
255
+ targetMeasureElement = _ref2.measureElement,
252
256
  measureLeft = _ref2.measureLeft,
253
257
  measurePos = _ref2.measurePos,
254
258
  measureSelector = _ref2.measureSelector;
@@ -260,6 +264,7 @@ var createLeftAnchorWidget = exports.createLeftAnchorWidget = function createLef
260
264
  return elements.map(function (element) {
261
265
  return {
262
266
  element: element,
267
+ leftOffset: leftOffset,
263
268
  measureLeft: measureLeft
264
269
  };
265
270
  });
@@ -289,7 +294,9 @@ var createLeftAnchorWidget = exports.createLeftAnchorWidget = function createLef
289
294
  if (widest.measureLeft) {
290
295
  var left = widest.element.getBoundingClientRect().left - wrapper.getBoundingClientRect().left;
291
296
  anchor.style.setProperty('left', "".concat(left, "px"));
292
- anchor.style.setProperty('transform', 'none');
297
+ } else {
298
+ var _widest$leftOffset;
299
+ anchor.style.setProperty('left', "calc(50% - ".concat((_widest$leftOffset = widest.leftOffset) !== null && _widest$leftOffset !== void 0 ? _widest$leftOffset : 0, "px - ").concat(widest.element.offsetWidth / 2, "px)"));
293
300
  }
294
301
  anchor.style.setProperty('width', "".concat(widest.element.offsetWidth, "px"));
295
302
  };
package/dist/cjs/ui/IndicatorBar/IndicatorBar.compiled.css CHANGED
@@ -1,4 +1,5 @@
1
1
  ._2rko1rr0{border-radius:var(--ds-radius-full,9999px)}._17c61i8t{position-visibility:anchors-valid}
2
+ ._17c6oga4{position-visibility:always}
2
3
  ._18u0mgjw{margin-left:var(--ds-space-negative-200,-1pc)}
3
4
  ._19pk196n{margin-top:var(--ds-space-negative-075,-6px)}
4
5
  ._1bsb1l7b{width:3px}
package/dist/cjs/ui/IndicatorBar/IndicatorBar.js CHANGED
@@ -9,11 +9,13 @@ exports.IndicatorBar = IndicatorBar;
9
9
  require("./IndicatorBar.compiled.css");
10
10
  var React = _interopRequireWildcard(require("react"));
11
11
  var _runtime = require("@compiled/react/runtime");
12
+ var _fg = require("@atlaskit/platform-feature-flags/fg");
12
13
  var _factory = require("../../pm-plugins/decorations/colorSchemes/factory");
13
14
  var _schemes = require("../../pm-plugins/decorations/colorSchemes/schemes");
14
15
  var _decorationKeys = require("../../pm-plugins/decorations/decorationKeys");
15
16
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
16
17
  var barStyles = null;
18
+ var barAlwaysVisibleStyles = null;
17
19
  var getIndicatorColor = function getIndicatorColor(colorScheme, isInserted) {
18
20
  if (colorScheme === undefined || colorScheme === 'standard' || colorScheme === 'traditional' || isInserted === undefined) {
19
21
  return "var(--ds-border-information, #357DE8)";
@@ -39,6 +41,6 @@ function IndicatorBar(_ref) {
39
41
  top: "anchor(--".concat(anchorTop, " top)"),
40
42
  bottom: "anchor(--".concat(anchorBottom, " bottom)")
41
43
  },
42
- className: (0, _runtime.ax)(["_2rko1rr0 _kqswstnw _1bsb1l7b _lcxvglyw _18u0mgjw _17c61i8t _19pk196n _otyr196n"])
44
+ className: (0, _runtime.ax)(["_2rko1rr0 _kqswstnw _1bsb1l7b _lcxvglyw _18u0mgjw _17c61i8t _19pk196n _otyr196n", (0, _fg.fg)('platform_editor_ai_show_diff_patch_2') && "_17c6oga4"])
43
45
  });
44
46
  }
package/dist/es2019/pm-plugins/decorations/createAnchorDecorationWidgets.js CHANGED
@@ -224,7 +224,10 @@ export const createLeftAnchorWidget = ({
224
224
  anchor.style.setProperty('anchor-name', `--${leftAnchorKey}`);
225
225
  anchor.style.setProperty('position', 'absolute');
226
226
  anchor.style.setProperty('left', `calc(50% - ${(edgeCase === null || edgeCase === void 0 ? void 0 : edgeCase.leftOffset) || 0}px)`);
227
- anchor.style.setProperty('transform', 'translateX(-50%)');
227
+ // transforms on anchors have limited browser support
228
+ if (!fg('platform_editor_ai_show_diff_patch_2')) {
229
+ anchor.style.setProperty('transform', 'translateX(-50%)');
230
+ }
228
231
  wrapper.appendChild(anchor);
229
232
  const measureWidth = () => {
230
233
  var _nodeDOM$querySelecto;
@@ -237,6 +240,7 @@ export const createLeftAnchorWidget = ({
237
240
  return;
238
241
  }
239
242
  const measuredElements = widthMeasureTargets.flatMap(({
243
+ leftOffset,
240
244
  measureElement: targetMeasureElement,
241
245
  measureLeft,
242
246
  measurePos,
@@ -249,6 +253,7 @@ export const createLeftAnchorWidget = ({
249
253
  const elements = nodeDOM instanceof HTMLElement ? measureSelector ? Array.from(nodeDOM.querySelectorAll(measureSelector)) : [nodeDOM] : [];
250
254
  return elements.map(element => ({
251
255
  element,
256
+ leftOffset,
252
257
  measureLeft
253
258
  }));
254
259
  });
@@ -268,7 +273,9 @@ export const createLeftAnchorWidget = ({
268
273
  if (widest.measureLeft) {
269
274
  const left = widest.element.getBoundingClientRect().left - wrapper.getBoundingClientRect().left;
270
275
  anchor.style.setProperty('left', `${left}px`);
271
- anchor.style.setProperty('transform', 'none');
276
+ } else {
277
+ var _widest$leftOffset;
278
+ anchor.style.setProperty('left', `calc(50% - ${(_widest$leftOffset = widest.leftOffset) !== null && _widest$leftOffset !== void 0 ? _widest$leftOffset : 0}px - ${widest.element.offsetWidth / 2}px)`);
272
279
  }
273
280
  anchor.style.setProperty('width', `${widest.element.offsetWidth}px`);
274
281
  };
package/dist/es2019/ui/IndicatorBar/IndicatorBar.compiled.css CHANGED
@@ -1,4 +1,5 @@
1
1
  ._2rko1rr0{border-radius:var(--ds-radius-full,9999px)}._17c61i8t{position-visibility:anchors-valid}
2
+ ._17c6oga4{position-visibility:always}
2
3
  ._18u0mgjw{margin-left:var(--ds-space-negative-200,-1pc)}
3
4
  ._19pk196n{margin-top:var(--ds-space-negative-075,-6px)}
4
5
  ._1bsb1l7b{width:3px}
package/dist/es2019/ui/IndicatorBar/IndicatorBar.js CHANGED
@@ -2,10 +2,12 @@
2
2
  import "./IndicatorBar.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
+ import { fg } from '@atlaskit/platform-feature-flags/fg';
5
6
  import { getAccentBorderColor } from '../../pm-plugins/decorations/colorSchemes/factory';
6
7
  import { colorSchemeRegistry } from '../../pm-plugins/decorations/colorSchemes/schemes';
7
8
  import { AnchorDocMarginKey } from '../../pm-plugins/decorations/decorationKeys';
8
9
  const barStyles = null;
10
+ const barAlwaysVisibleStyles = null;
9
11
  const getIndicatorColor = (colorScheme, isInserted) => {
10
12
  if (colorScheme === undefined || colorScheme === 'standard' || colorScheme === 'traditional' || isInserted === undefined) {
11
13
  return "var(--ds-border-information, #357DE8)";
@@ -30,6 +32,6 @@ export function IndicatorBar({
30
32
  top: `anchor(--${anchorTop} top)`,
31
33
  bottom: `anchor(--${anchorBottom} bottom)`
32
34
  },
33
- className: ax(["_2rko1rr0 _kqswstnw _1bsb1l7b _lcxvglyw _18u0mgjw _17c61i8t _19pk196n _otyr196n"])
35
+ className: ax(["_2rko1rr0 _kqswstnw _1bsb1l7b _lcxvglyw _18u0mgjw _17c61i8t _19pk196n _otyr196n", fg('platform_editor_ai_show_diff_patch_2') && "_17c6oga4"])
34
36
  });
35
37
  }
package/dist/esm/pm-plugins/decorations/createAnchorDecorationWidgets.js CHANGED
@@ -229,7 +229,10 @@ export var createLeftAnchorWidget = function createLeftAnchorWidget(_ref) {
229
229
  anchor.style.setProperty('anchor-name', "--".concat(leftAnchorKey));
230
230
  anchor.style.setProperty('position', 'absolute');
231
231
  anchor.style.setProperty('left', "calc(50% - ".concat((edgeCase === null || edgeCase === void 0 ? void 0 : edgeCase.leftOffset) || 0, "px)"));
232
- anchor.style.setProperty('transform', 'translateX(-50%)');
232
+ // transforms on anchors have limited browser support
233
+ if (!fg('platform_editor_ai_show_diff_patch_2')) {
234
+ anchor.style.setProperty('transform', 'translateX(-50%)');
235
+ }
233
236
  wrapper.appendChild(anchor);
234
237
  var _measureWidth = function measureWidth() {
235
238
  var _nodeDOM$querySelecto;
@@ -242,7 +245,8 @@ export var createLeftAnchorWidget = function createLeftAnchorWidget(_ref) {
242
245
  return;
243
246
  }
244
247
  var measuredElements = widthMeasureTargets.flatMap(function (_ref2) {
245
- var targetMeasureElement = _ref2.measureElement,
248
+ var leftOffset = _ref2.leftOffset,
249
+ targetMeasureElement = _ref2.measureElement,
246
250
  measureLeft = _ref2.measureLeft,
247
251
  measurePos = _ref2.measurePos,
248
252
  measureSelector = _ref2.measureSelector;
@@ -254,6 +258,7 @@ export var createLeftAnchorWidget = function createLeftAnchorWidget(_ref) {
254
258
  return elements.map(function (element) {
255
259
  return {
256
260
  element: element,
261
+ leftOffset: leftOffset,
257
262
  measureLeft: measureLeft
258
263
  };
259
264
  });
@@ -283,7 +288,9 @@ export var createLeftAnchorWidget = function createLeftAnchorWidget(_ref) {
283
288
  if (widest.measureLeft) {
284
289
  var left = widest.element.getBoundingClientRect().left - wrapper.getBoundingClientRect().left;
285
290
  anchor.style.setProperty('left', "".concat(left, "px"));
286
- anchor.style.setProperty('transform', 'none');
291
+ } else {
292
+ var _widest$leftOffset;
293
+ anchor.style.setProperty('left', "calc(50% - ".concat((_widest$leftOffset = widest.leftOffset) !== null && _widest$leftOffset !== void 0 ? _widest$leftOffset : 0, "px - ").concat(widest.element.offsetWidth / 2, "px)"));
287
294
  }
288
295
  anchor.style.setProperty('width', "".concat(widest.element.offsetWidth, "px"));
289
296
  };
package/dist/esm/ui/IndicatorBar/IndicatorBar.compiled.css CHANGED
@@ -1,4 +1,5 @@
1
1
  ._2rko1rr0{border-radius:var(--ds-radius-full,9999px)}._17c61i8t{position-visibility:anchors-valid}
2
+ ._17c6oga4{position-visibility:always}
2
3
  ._18u0mgjw{margin-left:var(--ds-space-negative-200,-1pc)}
3
4
  ._19pk196n{margin-top:var(--ds-space-negative-075,-6px)}
4
5
  ._1bsb1l7b{width:3px}
package/dist/esm/ui/IndicatorBar/IndicatorBar.js CHANGED
@@ -2,10 +2,12 @@
2
2
  import "./IndicatorBar.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
+ import { fg } from '@atlaskit/platform-feature-flags/fg';
5
6
  import { getAccentBorderColor } from '../../pm-plugins/decorations/colorSchemes/factory';
6
7
  import { colorSchemeRegistry } from '../../pm-plugins/decorations/colorSchemes/schemes';
7
8
  import { AnchorDocMarginKey } from '../../pm-plugins/decorations/decorationKeys';
8
9
  var barStyles = null;
10
+ var barAlwaysVisibleStyles = null;
9
11
  var getIndicatorColor = function getIndicatorColor(colorScheme, isInserted) {
10
12
  if (colorScheme === undefined || colorScheme === 'standard' || colorScheme === 'traditional' || isInserted === undefined) {
11
13
  return "var(--ds-border-information, #357DE8)";
@@ -31,6 +33,6 @@ export function IndicatorBar(_ref) {
31
33
  top: "anchor(--".concat(anchorTop, " top)"),
32
34
  bottom: "anchor(--".concat(anchorBottom, " bottom)")
33
35
  },
34
- className: ax(["_2rko1rr0 _kqswstnw _1bsb1l7b _lcxvglyw _18u0mgjw _17c61i8t _19pk196n _otyr196n"])
36
+ className: ax(["_2rko1rr0 _kqswstnw _1bsb1l7b _lcxvglyw _18u0mgjw _17c61i8t _19pk196n _otyr196n", fg('platform_editor_ai_show_diff_patch_2') && "_17c6oga4"])
35
37
  });
36
38
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-show-diff",
3
- "version": "22.0.4",
3
+ "version": "22.0.6",
4
4
  "description": "ShowDiff plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -25,7 +25,7 @@
25
25
  "sideEffects": false,
26
26
  "atlaskit:src": "src/index.ts",
27
27
  "dependencies": {
28
- "@atlaskit/adf-schema": "^57.6.0",
28
+ "@atlaskit/adf-schema": "^57.7.0",
29
29
  "@atlaskit/agent-color": "^1.0.0",
30
30
  "@atlaskit/avatar": "^30.0.0",
31
31
  "@atlaskit/custom-steps": "^1.1.0",
@@ -39,7 +39,7 @@
39
39
  "@atlaskit/platform-feature-experiments": "^0.3.0",
40
40
  "@atlaskit/platform-feature-flags": "^2.2.0",
41
41
  "@atlaskit/primitives": "^22.5.0",
42
- "@atlaskit/tmp-editor-statsig": "^223.0.0",
42
+ "@atlaskit/tmp-editor-statsig": "^224.0.0",
43
43
  "@atlaskit/tokens": "^20.3.0",
44
44
  "@babel/runtime": "^7.0.0",
45
45
  "@compiled/react": "^1.0.2",
@@ -55,7 +55,7 @@
55
55
  "@atlaskit/dropdown-menu": "^21.0.0",
56
56
  "@atlaskit/editor-core": "^234.3.0",
57
57
  "@atlaskit/editor-json-transformer": "^10.0.0",
58
- "@atlaskit/editor-plugins": "^16.1.0",
58
+ "@atlaskit/editor-plugins": "^16.2.0",
59
59
  "@atlaskit/form": "^18.1.0",
60
60
  "@atlaskit/section-message": "^10.2.0",
61
61
  "@atlaskit/textarea": "^10.2.0",
@@ -64,14 +64,14 @@
64
64
  "@atlassian/confluence-presets": "workspace:^",
65
65
  "@atlassian/content-reconciliation": "^0.1.3506",
66
66
  "@atlassian/editor-ai-injected-editors": "^38.0.0",
67
- "@atlassian/editor-plugin-ai": "^78.0.0",
67
+ "@atlassian/editor-plugin-ai": "^78.1.0",
68
68
  "@atlassian/structured-docs-types": "workspace:^",
69
69
  "react": "^19.2.0",
70
70
  "react-dom": "^19.2.0",
71
71
  "react-intl": "^7.0.0"
72
72
  },
73
73
  "peerDependencies": {
74
- "@atlaskit/editor-common": "^128.3.0",
74
+ "@atlaskit/editor-common": "^128.4.0",
75
75
  "react": "^18.2.0 || ^19.2.0",
76
76
  "react-dom": "^18.2.0 || ^19.2.0",
77
77
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"