@atlaskit/editor-plugin-code-block-advanced 2.4.0 → 3.0.1

package/CHANGELOG.md

@@ -1,5 +1,54 @@
 # @atlaskit/editor-plugin-code-block-advanced
 
+## 3.0.1
+
+### Patch Changes
+
+- [#182587](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/182587)
+  [`ab1ee31f25e9c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ab1ee31f25e9c) -
+  Fixes issue where right click menu would select entire code block.
+- Updated dependencies
+
+## 3.0.0
+
+### Major Changes
+
+- [#181024](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/181024)
+  [`8e80c487ca307`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8e80c487ca307) - ##
+  Make `@atlaskit/editor-common` a peer dependency
+
+  **WHAT:** `@atlaskit/editor-common` has been moved from `dependencies` to `peerDependencies` in
+  all editor plugin packages.
+
+  **WHY:** This change ensures that only a single version of `@atlaskit/editor-common` is used in
+  consuming applications, preventing issues caused by multiple versions of singleton libraries (such
+  as context mismatches or duplicated state). This is especially important for packages that rely on
+  shared context or singletons.
+
+  **HOW TO ADJUST:**
+
+  - Consumers must now explicitly install `@atlaskit/editor-common` in their own project if they use
+    any of these editor plugins.
+  - Ensure the version you install matches the version required by the plugins.
+  - You can use the
+    [`check-peer-dependencies`](https://www.npmjs.com/package/check-peer-dependencies) package to
+    verify that all required peer dependencies are installed and compatible.
+  - Example install command:
+    ```
+    npm install @atlaskit/editor-common
+    ```
+    or
+    ```
+    yarn add @atlaskit/editor-common
+    ```
+
+  **Note:** This is a breaking change. If `@atlaskit/editor-common` is not installed at the
+  application level, you may see errors or unexpected behavior.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 2.4.0
 
 ### Minor Changes

package/afm-cc/tsconfig.json

@@ -17,9 +17,6 @@
         "../src/**/examples.*"
     ],
     "references": [
-        {
-            "path": "../../editor-common/afm-cc/tsconfig.json"
-        },
         {
             "path": "../../editor-plugin-code-block/afm-cc/tsconfig.json"
         },
@@ -43,6 +40,9 @@
         },
         {
             "path": "../../../design-system/tokens/afm-cc/tsconfig.json"
+        },
+        {
+            "path": "../../editor-common/afm-cc/tsconfig.json"
         }
     ]
 }

package/afm-jira/tsconfig.json

@@ -17,9 +17,6 @@
 		"../src/**/examples.*"
 	],
 	"references": [
-		{
-			"path": "../../editor-common/afm-jira/tsconfig.json"
-		},
 		{
 			"path": "../../editor-plugin-code-block/afm-jira/tsconfig.json"
 		},
@@ -43,6 +40,9 @@
 		},
 		{
 			"path": "../../../design-system/tokens/afm-jira/tsconfig.json"
+		},
+		{
+			"path": "../../editor-common/afm-jira/tsconfig.json"
 		}
 	]
 }

package/afm-post-office/tsconfig.json

@@ -17,9 +17,6 @@
 		"../src/**/examples.*"
 	],
 	"references": [
-		{
-			"path": "../../editor-common/afm-post-office/tsconfig.json"
-		},
 		{
 			"path": "../../editor-plugin-code-block/afm-post-office/tsconfig.json"
 		},
@@ -43,6 +40,9 @@
 		},
 		{
 			"path": "../../../design-system/tokens/afm-post-office/tsconfig.json"
+		},
+		{
+			"path": "../../editor-common/afm-post-office/tsconfig.json"
 		}
 	]
 }

package/dist/cjs/nodeviews/codeBlockAdvanced.js

@@ -17,6 +17,7 @@ var _codeBlock = require("@atlaskit/editor-common/code-block");
 var _whitespace = require("@atlaskit/editor-common/whitespace");
 var _state2 = require("@atlaskit/editor-prosemirror/state");
 var _view2 = require("@atlaskit/editor-prosemirror/view");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
 var _syntaxHighlightingTheme = require("../ui/syntaxHighlightingTheme");
 var _theme = require("../ui/theme");
@@ -74,7 +75,15 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
         selectCodeBlockNode: this.selectCodeBlockNode.bind(this),
         onMaybeNodeSelection: onMaybeNodeSelection,
         customFindReplace: Boolean((_config$api3 = config.api) === null || _config$api3 === void 0 ? void 0 : _config$api3.findReplace)
-      }), _theme.cmTheme, (0, _language.syntaxHighlighting)(_syntaxHighlightingTheme.highlightStyle), (0, _language.bracketMatching)(), (0, _view.lineNumbers)(),
+      }), _theme.cmTheme, (0, _language.syntaxHighlighting)(_syntaxHighlightingTheme.highlightStyle), (0, _language.bracketMatching)(), (0, _view.lineNumbers)({
+        domEventHandlers: (0, _platformFeatureFlags.fg)('platform_editor_fix_right_click_paste') ? {
+          click: function click() {
+            _this.selectCodeBlockNode(undefined);
+            _this.view.focus();
+            return true;
+          }
+        } : undefined
+      }),
       // Explicitly disable "sticky" positioning on line numbers to match
       // Renderer behaviour
       (0, _view.gutters)({
@@ -243,23 +252,25 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
     value: function stopEvent(e) {
       var _this2 = this,
         _this$getPos5;
-      if (e instanceof MouseEvent && e.type === 'mousedown') {
-        // !Warning: Side effect!
-        // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
-        // We need to select the nodeview after this has taken place to ensure
-        // ProseMirror takes over
-        // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
-        setTimeout(function () {
-          // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
-          // cause funky behaviour
-          _this2.updating = true;
-          _this2.cm.dispatch({
-            selection: _state.EditorSelection.create([_state.EditorSelection.cursor(0)], 0)
-          });
-          _this2.updating = false;
-          _this2.selectCodeBlockNode(undefined);
-          _this2.view.focus();
-        }, 20);
+      if (!(0, _platformFeatureFlags.fg)('platform_editor_fix_right_click_paste')) {
+        if (e instanceof MouseEvent && e.type === 'mousedown') {
+          // !Warning: Side effect!
+          // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
+          // We need to select the nodeview after this has taken place to ensure
+          // ProseMirror takes over
+          // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
+          setTimeout(function () {
+            // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
+            // cause funky behaviour
+            _this2.updating = true;
+            _this2.cm.dispatch({
+              selection: _state.EditorSelection.create([_state.EditorSelection.cursor(0)], 0)
+            });
+            _this2.updating = false;
+            _this2.selectCodeBlockNode(undefined);
+            _this2.view.focus();
+          }, 20);
+        }
       }
       // If we have selected the node we should not stop these events
       if ((e instanceof KeyboardEvent || e instanceof ClipboardEvent) && this.view.state.selection instanceof _state2.NodeSelection && this.view.state.selection.from === ((_this$getPos5 = this.getPos) === null || _this$getPos5 === void 0 ? void 0 : _this$getPos5.call(this))) {

package/dist/cjs/ui/theme.js

@@ -51,10 +51,13 @@ var cmTheme = exports.cmTheme = _view.EditorView.theme({
   '&.cm-focused .cm-cursor': {
     borderLeftColor: "var(--ds-text, #172B4D)"
   },
+  '.cm-gutter': {
+    padding: "var(--ds-space-100, 8px)"
+  },
   '.cm-gutters': {
     backgroundColor: "var(--ds-background-neutral, #091E420F)",
     border: 'none',
-    padding: "var(--ds-space-100, 8px)",
+    padding: "var(--ds-space-0, 0px)",
     color: "var(--ds-text-subtlest, #626F86)"
   },
   '.cm-lineNumbers .cm-gutterElement': {

package/dist/es2019/nodeviews/codeBlockAdvanced.js

@@ -7,6 +7,7 @@ import { isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
 import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/whitespace';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { highlightStyle } from '../ui/syntaxHighlightingTheme';
 import { cmTheme } from '../ui/theme';
@@ -54,7 +55,15 @@ class CodeBlockAdvancedNodeView {
         selectCodeBlockNode: this.selectCodeBlockNode.bind(this),
         onMaybeNodeSelection,
         customFindReplace: Boolean((_config$api3 = config.api) === null || _config$api3 === void 0 ? void 0 : _config$api3.findReplace)
-      }), cmTheme, syntaxHighlighting(highlightStyle), bracketMatching(), lineNumbers(),
+      }), cmTheme, syntaxHighlighting(highlightStyle), bracketMatching(), lineNumbers({
+        domEventHandlers: fg('platform_editor_fix_right_click_paste') ? {
+          click: () => {
+            this.selectCodeBlockNode(undefined);
+            this.view.focus();
+            return true;
+          }
+        } : undefined
+      }),
       // Explicitly disable "sticky" positioning on line numbers to match
       // Renderer behaviour
       gutters({
@@ -192,23 +201,25 @@ class CodeBlockAdvancedNodeView {
   }
   stopEvent(e) {
     var _this$getPos5;
-    if (e instanceof MouseEvent && e.type === 'mousedown') {
-      // !Warning: Side effect!
-      // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
-      // We need to select the nodeview after this has taken place to ensure
-      // ProseMirror takes over
-      // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
-      setTimeout(() => {
-        // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
-        // cause funky behaviour
-        this.updating = true;
-        this.cm.dispatch({
-          selection: EditorSelection.create([EditorSelection.cursor(0)], 0)
-        });
-        this.updating = false;
-        this.selectCodeBlockNode(undefined);
-        this.view.focus();
-      }, 20);
+    if (!fg('platform_editor_fix_right_click_paste')) {
+      if (e instanceof MouseEvent && e.type === 'mousedown') {
+        // !Warning: Side effect!
+        // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
+        // We need to select the nodeview after this has taken place to ensure
+        // ProseMirror takes over
+        // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
+        setTimeout(() => {
+          // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
+          // cause funky behaviour
+          this.updating = true;
+          this.cm.dispatch({
+            selection: EditorSelection.create([EditorSelection.cursor(0)], 0)
+          });
+          this.updating = false;
+          this.selectCodeBlockNode(undefined);
+          this.view.focus();
+        }, 20);
+      }
     }
     // If we have selected the node we should not stop these events
     if ((e instanceof KeyboardEvent || e instanceof ClipboardEvent) && this.view.state.selection instanceof NodeSelection && this.view.state.selection.from === ((_this$getPos5 = this.getPos) === null || _this$getPos5 === void 0 ? void 0 : _this$getPos5.call(this))) {

package/dist/es2019/ui/theme.js

@@ -45,10 +45,13 @@ export const cmTheme = CodeMirror.theme({
   '&.cm-focused .cm-cursor': {
     borderLeftColor: "var(--ds-text, #172B4D)"
   },
+  '.cm-gutter': {
+    padding: "var(--ds-space-100, 8px)"
+  },
   '.cm-gutters': {
     backgroundColor: "var(--ds-background-neutral, #091E420F)",
     border: 'none',
-    padding: "var(--ds-space-100, 8px)",
+    padding: "var(--ds-space-0, 0px)",
     color: "var(--ds-text-subtlest, #626F86)"
   },
   '.cm-lineNumbers .cm-gutterElement': {

package/dist/esm/nodeviews/codeBlockAdvanced.js

@@ -10,6 +10,7 @@ import { isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
 import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/whitespace';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { highlightStyle } from '../ui/syntaxHighlightingTheme';
 import { cmTheme } from '../ui/theme';
@@ -67,7 +68,15 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
         selectCodeBlockNode: this.selectCodeBlockNode.bind(this),
         onMaybeNodeSelection: onMaybeNodeSelection,
         customFindReplace: Boolean((_config$api3 = config.api) === null || _config$api3 === void 0 ? void 0 : _config$api3.findReplace)
-      }), cmTheme, syntaxHighlighting(highlightStyle), bracketMatching(), lineNumbers(),
+      }), cmTheme, syntaxHighlighting(highlightStyle), bracketMatching(), lineNumbers({
+        domEventHandlers: fg('platform_editor_fix_right_click_paste') ? {
+          click: function click() {
+            _this.selectCodeBlockNode(undefined);
+            _this.view.focus();
+            return true;
+          }
+        } : undefined
+      }),
       // Explicitly disable "sticky" positioning on line numbers to match
       // Renderer behaviour
       gutters({
@@ -236,23 +245,25 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
     value: function stopEvent(e) {
       var _this2 = this,
         _this$getPos5;
-      if (e instanceof MouseEvent && e.type === 'mousedown') {
-        // !Warning: Side effect!
-        // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
-        // We need to select the nodeview after this has taken place to ensure
-        // ProseMirror takes over
-        // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
-        setTimeout(function () {
-          // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
-          // cause funky behaviour
-          _this2.updating = true;
-          _this2.cm.dispatch({
-            selection: EditorSelection.create([EditorSelection.cursor(0)], 0)
-          });
-          _this2.updating = false;
-          _this2.selectCodeBlockNode(undefined);
-          _this2.view.focus();
-        }, 20);
+      if (!fg('platform_editor_fix_right_click_paste')) {
+        if (e instanceof MouseEvent && e.type === 'mousedown') {
+          // !Warning: Side effect!
+          // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
+          // We need to select the nodeview after this has taken place to ensure
+          // ProseMirror takes over
+          // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
+          setTimeout(function () {
+            // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
+            // cause funky behaviour
+            _this2.updating = true;
+            _this2.cm.dispatch({
+              selection: EditorSelection.create([EditorSelection.cursor(0)], 0)
+            });
+            _this2.updating = false;
+            _this2.selectCodeBlockNode(undefined);
+            _this2.view.focus();
+          }, 20);
+        }
       }
       // If we have selected the node we should not stop these events
       if ((e instanceof KeyboardEvent || e instanceof ClipboardEvent) && this.view.state.selection instanceof NodeSelection && this.view.state.selection.from === ((_this$getPos5 = this.getPos) === null || _this$getPos5 === void 0 ? void 0 : _this$getPos5.call(this))) {

package/dist/esm/ui/theme.js

@@ -45,10 +45,13 @@ export var cmTheme = CodeMirror.theme({
   '&.cm-focused .cm-cursor': {
     borderLeftColor: "var(--ds-text, #172B4D)"
   },
+  '.cm-gutter': {
+    padding: "var(--ds-space-100, 8px)"
+  },
   '.cm-gutters': {
     backgroundColor: "var(--ds-background-neutral, #091E420F)",
     border: 'none',
-    padding: "var(--ds-space-100, 8px)",
+    padding: "var(--ds-space-0, 0px)",
     color: "var(--ds-text-subtlest, #626F86)"
   },
   '.cm-lineNumbers .cm-gutterElement': {

package/dist/types/nodeviews/codeBlockAdvanced.d.ts

@@ -1,7 +1,7 @@
 import { type Extension } from '@codemirror/state';
-import { ViewUpdate } from '@codemirror/view';
+import { type ViewUpdate } from '@codemirror/view';
 import type { getPosHandler, getPosHandlerNode, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import { type Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { Decoration, DecorationSource, EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
 import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
 interface ConfigProps {

package/dist/types/nodeviews/codemirrorSync/syncCMWithPM.d.ts

@@ -1,5 +1,5 @@
-import { ViewUpdate } from '@codemirror/view';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type ViewUpdate } from '@codemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 interface Props {
     view: EditorView;
     update: ViewUpdate;

package/dist/types/nodeviews/extensions/keymap/backspace.d.ts

@@ -1,7 +1,7 @@
-import { EditorView as CodeMirror } from '@codemirror/view';
+import { type EditorView as CodeMirror } from '@codemirror/view';
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 interface BackspaceProps {
     view: EditorView;
     cm: CodeMirror;

package/dist/types/nodeviews/extensions/keymap/index.d.ts

@@ -1,8 +1,8 @@
 import { type Extension } from '@codemirror/state';
-import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
+import { type RelativeSelectionPos } from '@atlaskit/editor-common/selection';
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 interface KeymapProps {
     view: EditorView;
     getNode: () => PMNode;

package/dist/types/nodeviews/extensions/keymap/maybeEscape.d.ts

@@ -1,8 +1,8 @@
-import { EditorView as CodeMirror } from '@codemirror/view';
+import { type EditorView as CodeMirror } from '@codemirror/view';
 import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 interface MaybeEscapeProps {
     unit: 'line' | 'char';
     dir: -1 | 1;

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

@@ -1,5 +1,5 @@
-import { Facet } from '@codemirror/state';
-import { ViewPlugin, EditorView as CodeMirror, type DecorationSet, ViewUpdate } from '@codemirror/view';
+import { type Facet } from '@codemirror/state';
+import { ViewPlugin, type EditorView as CodeMirror, type DecorationSet, type ViewUpdate } from '@codemirror/view';
 import type { EditorView, DecorationSource } from '@atlaskit/editor-prosemirror/view';
 /**
  * Creates CodeMirror versions of the decorations provided by ProseMirror.

package/dist/types-ts4.5/nodeviews/codeBlockAdvanced.d.ts

@@ -1,7 +1,7 @@
 import { type Extension } from '@codemirror/state';
-import { ViewUpdate } from '@codemirror/view';
+import { type ViewUpdate } from '@codemirror/view';
 import type { getPosHandler, getPosHandlerNode, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import { type Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { Decoration, DecorationSource, EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
 import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
 interface ConfigProps {

package/dist/types-ts4.5/nodeviews/codemirrorSync/syncCMWithPM.d.ts

@@ -1,5 +1,5 @@
-import { ViewUpdate } from '@codemirror/view';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type ViewUpdate } from '@codemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 interface Props {
     view: EditorView;
     update: ViewUpdate;

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

@@ -1,7 +1,7 @@
-import { EditorView as CodeMirror } from '@codemirror/view';
+import { type EditorView as CodeMirror } from '@codemirror/view';
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 interface BackspaceProps {
     view: EditorView;
     cm: CodeMirror;

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

@@ -1,8 +1,8 @@
 import { type Extension } from '@codemirror/state';
-import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
+import { type RelativeSelectionPos } from '@atlaskit/editor-common/selection';
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 interface KeymapProps {
     view: EditorView;
     getNode: () => PMNode;

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

@@ -1,8 +1,8 @@
-import { EditorView as CodeMirror } from '@codemirror/view';
+import { type EditorView as CodeMirror } from '@codemirror/view';
 import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 interface MaybeEscapeProps {
     unit: 'line' | 'char';
     dir: -1 | 1;

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

@@ -1,5 +1,5 @@
-import { Facet } from '@codemirror/state';
-import { ViewPlugin, EditorView as CodeMirror, type DecorationSet, ViewUpdate } from '@codemirror/view';
+import { type Facet } from '@codemirror/state';
+import { ViewPlugin, type EditorView as CodeMirror, type DecorationSet, type ViewUpdate } from '@codemirror/view';
 import type { EditorView, DecorationSource } from '@atlaskit/editor-prosemirror/view';
 /**
  * Creates CodeMirror versions of the decorations provided by ProseMirror.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-code-block-advanced",
-	"version": "2.4.0",
+	"version": "3.0.1",
 	"description": "CodeBlockAdvanced plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -10,8 +10,7 @@
 	"atlassian": {
 		"team": "Editor: Lego",
 		"releaseModel": "continuous",
-		"singleton": true,
-		"runReact18": true
+		"singleton": true
 	},
 	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
 	"main": "dist/cjs/index.js",
@@ -33,15 +32,14 @@
 	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^47.6.0",
-		"@atlaskit/editor-common": "^107.2.0",
-		"@atlaskit/editor-plugin-code-block": "^4.4.0",
-		"@atlaskit/editor-plugin-editor-disabled": "^2.1.0",
-		"@atlaskit/editor-plugin-find-replace": "^2.7.0",
-		"@atlaskit/editor-plugin-selection": "^2.2.0",
-		"@atlaskit/editor-plugin-selection-marker": "^2.5.0",
+		"@atlaskit/editor-plugin-code-block": "^5.0.0",
+		"@atlaskit/editor-plugin-editor-disabled": "^3.0.0",
+		"@atlaskit/editor-plugin-find-replace": "^3.0.0",
+		"@atlaskit/editor-plugin-selection": "^3.0.0",
+		"@atlaskit/editor-plugin-selection-marker": "^3.0.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/tmp-editor-statsig": "^8.1.0",
+		"@atlaskit/tmp-editor-statsig": "^8.8.0",
 		"@atlaskit/tokens": "^5.4.0",
 		"@babel/runtime": "^7.0.0",
 		"@codemirror/autocomplete": "6.18.4",
@@ -56,6 +54,7 @@
 		"codemirror-lang-elixir": "4.0.0"
 	},
 	"peerDependencies": {
+		"@atlaskit/editor-common": "^107.7.0",
 		"react": "^18.2.0"
 	},
 	"devDependencies": {
@@ -101,6 +100,9 @@
 	"platform-feature-flags": {
 		"platform_editor_breakout_resizing_hello_release": {
 			"type": "boolean"
+		},
+		"platform_editor_fix_right_click_paste": {
+			"type": "boolean"
 		}
 	}
 }

package/src/nodeviews/codeBlockAdvanced.ts

@@ -6,12 +6,12 @@ import {
 	EditorSelection,
 	Facet,
 	EditorState as CodeMirrorState,
-	StateEffect,
+	type StateEffect,
 } from '@codemirror/state';
-import { EditorView as CodeMirror, lineNumbers, ViewUpdate, gutters } from '@codemirror/view';
+import { EditorView as CodeMirror, lineNumbers, type ViewUpdate, gutters } from '@codemirror/view';
 
 import { isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
-import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
+import { type RelativeSelectionPos } from '@atlaskit/editor-common/selection';
 import type {
 	getPosHandler,
 	getPosHandlerNode,
@@ -19,7 +19,7 @@ import type {
 } from '@atlaskit/editor-common/types';
 import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/whitespace';
 import { type EditorSelectionAPI } from '@atlaskit/editor-plugin-selection';
-import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import { type Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import type {
 	Decoration,
@@ -28,6 +28,7 @@ import type {
 	NodeView,
 } from '@atlaskit/editor-prosemirror/view';
 import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 
 import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
@@ -110,7 +111,17 @@ class CodeBlockAdvancedNodeView implements NodeView {
 				cmTheme,
 				syntaxHighlighting(highlightStyle),
 				bracketMatching(),
-				lineNumbers(),
+				lineNumbers({
+					domEventHandlers: fg('platform_editor_fix_right_click_paste')
+						? {
+								click: () => {
+									this.selectCodeBlockNode(undefined);
+									this.view.focus();
+									return true;
+								},
+							}
+						: undefined,
+				}),
 				// Explicitly disable "sticky" positioning on line numbers to match
 				// Renderer behaviour
 				gutters({ fixed: false }),
@@ -264,23 +275,25 @@ class CodeBlockAdvancedNodeView implements NodeView {
 	}
 
 	stopEvent(e: Event) {
-		if (e instanceof MouseEvent && e.type === 'mousedown') {
-			// !Warning: Side effect!
-			// CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
-			// We need to select the nodeview after this has taken place to ensure
-			// ProseMirror takes over
-			// https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
-			setTimeout(() => {
-				// Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
-				// cause funky behaviour
-				this.updating = true;
-				this.cm.dispatch({
-					selection: EditorSelection.create([EditorSelection.cursor(0)], 0),
-				});
-				this.updating = false;
-				this.selectCodeBlockNode(undefined);
-				this.view.focus();
-			}, 20);
+		if (!fg('platform_editor_fix_right_click_paste')) {
+			if (e instanceof MouseEvent && e.type === 'mousedown') {
+				// !Warning: Side effect!
+				// CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
+				// We need to select the nodeview after this has taken place to ensure
+				// ProseMirror takes over
+				// https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
+				setTimeout(() => {
+					// Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
+					// cause funky behaviour
+					this.updating = true;
+					this.cm.dispatch({
+						selection: EditorSelection.create([EditorSelection.cursor(0)], 0),
+					});
+					this.updating = false;
+					this.selectCodeBlockNode(undefined);
+					this.view.focus();
+				}, 20);
+			}
 		}
 		// If we have selected the node we should not stop these events
 		if (

package/src/nodeviews/codemirrorSync/syncCMWithPM.ts

@@ -1,7 +1,7 @@
-import { ViewUpdate } from '@codemirror/view';
+import { type ViewUpdate } from '@codemirror/view';
 
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 
 interface Props {
 	view: EditorView;

package/src/nodeviews/extensions/keymap/backspace.ts

@@ -1,9 +1,9 @@
-import { EditorView as CodeMirror } from '@codemirror/view';
+import { type EditorView as CodeMirror } from '@codemirror/view';
 
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 
 interface BackspaceProps {
 	view: EditorView;

package/src/nodeviews/extensions/keymap/index.ts

@@ -3,12 +3,12 @@ import { type Extension } from '@codemirror/state';
 import { type KeyBinding, keymap as cmKeymap } from '@codemirror/view';
 
 import { browser } from '@atlaskit/editor-common/browser';
-import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
+import { type RelativeSelectionPos } from '@atlaskit/editor-common/selection';
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import { exitCode, selectAll } from '@atlaskit/editor-prosemirror/commands';
 import { undo, redo } from '@atlaskit/editor-prosemirror/history';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 

package/src/nodeviews/extensions/keymap/maybeEscape.ts

@@ -1,10 +1,10 @@
-import { EditorView as CodeMirror } from '@codemirror/view';
+import { type EditorView as CodeMirror } from '@codemirror/view';
 
 import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
 import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import { Selection } from '@atlaskit/editor-prosemirror/state';
-import { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 
 interface MaybeEscapeProps {
 	unit: 'line' | 'char';

package/src/nodeviews/extensions/prosemirrorDecorations.ts

@@ -1,11 +1,11 @@
-import { Facet } from '@codemirror/state';
+import { type Facet } from '@codemirror/state';
 import {
 	ViewPlugin,
 	WidgetType,
 	Decoration as CodeMirrorDecoration,
-	EditorView as CodeMirror,
+	type EditorView as CodeMirror,
 	type DecorationSet,
-	ViewUpdate,
+	type ViewUpdate,
 } from '@codemirror/view';
 
 import type { EditorView, Decoration, DecorationSource } from '@atlaskit/editor-prosemirror/view';

package/src/ui/theme.ts

@@ -49,10 +49,13 @@ export const cmTheme = CodeMirror.theme({
 	'&.cm-focused .cm-cursor': {
 		borderLeftColor: token('color.text'),
 	},
+	'.cm-gutter': {
+		padding: token('space.100'),
+	},
 	'.cm-gutters': {
 		backgroundColor: token('color.background.neutral'),
 		border: 'none',
-		padding: token('space.100'),
+		padding: token('space.0'),
 		color: token('color.text.subtlest'),
 	},
 	'.cm-lineNumbers .cm-gutterElement': {