@atlaskit/editor-plugin-code-block-advanced 8.0.21 → 8.0.22

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-code-block-advanced
 
+## 8.0.22
+
+### Patch Changes
+
+- [`cdf5e30bb1541`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cdf5e30bb1541) -
+  Fix for edge case in firefox with prosemirror decorations being unsorted, ensures they are sorted
+  for diff decorations.
+- Updated dependencies
+
 ## 8.0.21
 
 ### Patch Changes

package/dist/cjs/nodeviews/extensions/prosemirrorDecorations.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.prosemirrorDecorationPlugin = void 0;
+exports.sortDecorationsByPositionAndSide = exports.prosemirrorDecorationPlugin = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
@@ -12,6 +12,7 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _view = require("@codemirror/view");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var PMWidget = /*#__PURE__*/function (_WidgetType) {
@@ -76,6 +77,9 @@ var mapPMDecorationToCMDecoration = function mapPMDecorationToCMDecoration(decor
 function isDefined(value) {
   return value !== undefined;
 }
+var sortDecorationsByPositionAndSide = exports.sortDecorationsByPositionAndSide = function sortDecorationsByPositionAndSide(a, b) {
+  return a.from - b.from || a.value.startSide - b.value.startSide;
+};
 
 /**
  * Creates CodeMirror versions of the decorations provided by ProseMirror.
@@ -118,7 +122,11 @@ var prosemirrorDecorationPlugin = exports.prosemirrorDecorationPlugin = function
         }).map(function (decoration) {
           return mapPMDecorationToCMDecoration(decoration, editorView, getPos);
         }).filter(isDefined);
-        return _view.Decoration.set(cmDecorations);
+        if ((0, _platformFeatureFlags.fg)('platform_editor_fix_decoration_edge_case')) {
+          return _view.Decoration.set(cmDecorations.sort(sortDecorationsByPositionAndSide));
+        } else {
+          return _view.Decoration.set(cmDecorations);
+        }
       }
     }, {
       key: "update",

package/dist/es2019/nodeviews/extensions/prosemirrorDecorations.js

@@ -1,4 +1,5 @@
 import { ViewPlugin, WidgetType, Decoration as CodeMirrorDecoration } from '@codemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 class PMWidget extends WidgetType {
   constructor(toDOMElement) {
     super();
@@ -56,6 +57,7 @@ const mapPMDecorationToCMDecoration = (decoration, view, getPos) => {
 function isDefined(value) {
   return value !== undefined;
 }
+export const sortDecorationsByPositionAndSide = (a, b) => a.from - b.from || a.value.startSide - b.value.startSide;
 
 /**
  * Creates CodeMirror versions of the decorations provided by ProseMirror.
@@ -89,7 +91,11 @@ export const prosemirrorDecorationPlugin = (updateDecorationsEffect, editorView,
       });
     });
     const cmDecorations = allDecorations.sort((a, b) => a.from < b.from ? -1 : 1).map(decoration => mapPMDecorationToCMDecoration(decoration, editorView, getPos)).filter(isDefined);
-    return CodeMirrorDecoration.set(cmDecorations);
+    if (fg('platform_editor_fix_decoration_edge_case')) {
+      return CodeMirrorDecoration.set(cmDecorations.sort(sortDecorationsByPositionAndSide));
+    } else {
+      return CodeMirrorDecoration.set(cmDecorations);
+    }
   }
   update(update) {
     this.decorations = this.updateDecorations(update.view);

package/dist/esm/nodeviews/extensions/prosemirrorDecorations.js

@@ -7,6 +7,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import { ViewPlugin, WidgetType, Decoration as CodeMirrorDecoration } from '@codemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 var PMWidget = /*#__PURE__*/function (_WidgetType) {
   function PMWidget(toDOMElement) {
     var _this;
@@ -69,6 +70,9 @@ var mapPMDecorationToCMDecoration = function mapPMDecorationToCMDecoration(decor
 function isDefined(value) {
   return value !== undefined;
 }
+export var sortDecorationsByPositionAndSide = function sortDecorationsByPositionAndSide(a, b) {
+  return a.from - b.from || a.value.startSide - b.value.startSide;
+};
 
 /**
  * Creates CodeMirror versions of the decorations provided by ProseMirror.
@@ -111,7 +115,11 @@ export var prosemirrorDecorationPlugin = function prosemirrorDecorationPlugin(up
         }).map(function (decoration) {
           return mapPMDecorationToCMDecoration(decoration, editorView, getPos);
         }).filter(isDefined);
-        return CodeMirrorDecoration.set(cmDecorations);
+        if (fg('platform_editor_fix_decoration_edge_case')) {
+          return CodeMirrorDecoration.set(cmDecorations.sort(sortDecorationsByPositionAndSide));
+        } else {
+          return CodeMirrorDecoration.set(cmDecorations);
+        }
       }
     }, {
       key: "update",

package/dist/types/nodeviews/extensions/prosemirrorDecorations.d.ts

@@ -2,6 +2,17 @@ import type { Facet } from '@codemirror/state';
 import { ViewPlugin } from '@codemirror/view';
 import type { EditorView as CodeMirror, DecorationSet, ViewUpdate } from '@codemirror/view';
 import type { EditorView, DecorationSource } from '@atlaskit/editor-prosemirror/view';
+export declare const sortDecorationsByPositionAndSide: (a: {
+    from: number;
+    value: {
+        startSide: number;
+    };
+}, b: {
+    from: number;
+    value: {
+        startSide: number;
+    };
+}) => number;
 /**
  * Creates CodeMirror versions of the decorations provided by ProseMirror.
  *

package/dist/types-ts4.5/nodeviews/extensions/prosemirrorDecorations.d.ts

@@ -2,6 +2,17 @@ import type { Facet } from '@codemirror/state';
 import { ViewPlugin } from '@codemirror/view';
 import type { EditorView as CodeMirror, DecorationSet, ViewUpdate } from '@codemirror/view';
 import type { EditorView, DecorationSource } from '@atlaskit/editor-prosemirror/view';
+export declare const sortDecorationsByPositionAndSide: (a: {
+    from: number;
+    value: {
+        startSide: number;
+    };
+}, b: {
+    from: number;
+    value: {
+        startSide: number;
+    };
+}) => number;
 /**
  * Creates CodeMirror versions of the decorations provided by ProseMirror.
  *

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-code-block-advanced",
-	"version": "8.0.21",
+	"version": "8.0.22",
 	"description": "CodeBlockAdvanced plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -38,7 +38,7 @@
 		"@atlaskit/editor-prosemirror": "^7.3.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/prosemirror-history": "^0.2.0",
-		"@atlaskit/tmp-editor-statsig": "^54.0.0",
+		"@atlaskit/tmp-editor-statsig": "^54.4.0",
 		"@atlaskit/tokens": "^11.4.0",
 		"@babel/runtime": "^7.0.0",
 		"@codemirror/autocomplete": "6.18.4",
@@ -55,7 +55,7 @@
 		"codemirror-lang-elixir": "4.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^112.16.0",
+		"@atlaskit/editor-common": "^112.18.0",
 		"react": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},
@@ -99,6 +99,9 @@
 		"platform_editor_adf_with_localid": {
 			"type": "boolean"
 		},
+		"platform_editor_fix_decoration_edge_case": {
+			"type": "boolean"
+		},
 		"platform_editor_content_mode_button_mvp": {
 			"type": "boolean"
 		}

package/src/nodeviews/extensions/prosemirrorDecorations.ts

@@ -3,6 +3,7 @@ import { ViewPlugin, WidgetType, Decoration as CodeMirrorDecoration } from '@cod
 import type { EditorView as CodeMirror, DecorationSet, ViewUpdate } from '@codemirror/view';
 
 import type { EditorView, Decoration, DecorationSource } from '@atlaskit/editor-prosemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 
 class PMWidget extends WidgetType {
 	constructor(readonly toDOMElement: HTMLElement) {
@@ -86,6 +87,11 @@ function isDefined<TValue>(value: TValue | undefined): value is TValue {
 	return value !== undefined;
 }
 
+export const sortDecorationsByPositionAndSide = (
+	a: { from: number; value: { startSide: number } },
+	b: { from: number; value: { startSide: number } },
+) => a.from - b.from || a.value.startSide - b.value.startSide;
+
 /**
  * Creates CodeMirror versions of the decorations provided by ProseMirror.
  *
@@ -134,7 +140,13 @@ export const prosemirrorDecorationPlugin = (
 					.map((decoration) => mapPMDecorationToCMDecoration(decoration, editorView, getPos))
 					.filter(isDefined);
 
-				return CodeMirrorDecoration.set(cmDecorations);
+				if (fg('platform_editor_fix_decoration_edge_case')) {
+					return CodeMirrorDecoration.set(
+						cmDecorations.sort(sortDecorationsByPositionAndSide),
+					);
+				} else {
+					return CodeMirrorDecoration.set(cmDecorations);
+				}
 			}
 			update(update: ViewUpdate) {
 				this.decorations = this.updateDecorations(update.view);