@atlaskit/editor-plugin-code-block-advanced 3.0.3 → 3.0.5

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,26 @@
1
1
  # @atlaskit/editor-plugin-code-block-advanced
2
2
 
3
+ ## 3.0.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [#194707](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/194707)
8
+ [`03234d0ecc5a6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/03234d0ecc5a6) -
9
+ Cleanup feature gate to fix right click in code blocks
10
+ - Updated dependencies
11
+
12
+ ## 3.0.4
13
+
14
+ ### Patch Changes
15
+
16
+ - [#191913](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/191913)
17
+ [`6d1e56695e91d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6d1e56695e91d) -
18
+ EDITOR-1131 Bump adf-schema package to 50.0.0
19
+ - [#193159](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/193159)
20
+ [`b004f44506551`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b004f44506551) -
21
+ [ED-28680] Fix a11y violation for aria-input-field-name in advanced code blocks
22
+ - Updated dependencies
23
+
3
24
  ## 3.0.3
4
25
 
5
26
  ### Patch Changes
@@ -1,48 +1,53 @@
1
1
  {
2
- "extends": "../../../../tsconfig.entry-points.confluence.json",
3
- "compilerOptions": {
4
- "target": "es5",
5
- "composite": true,
6
- "outDir": "../../../../../confluence/tsDist/@atlaskit__editor-plugin-code-block-advanced",
7
- "rootDir": "../"
8
- },
9
- "include": [
10
- "../src/**/*.ts",
11
- "../src/**/*.tsx"
12
- ],
13
- "exclude": [
14
- "../src/**/__tests__/*",
15
- "../src/**/*.test.*",
16
- "../src/**/test.*",
17
- "../src/**/examples.*"
18
- ],
19
- "references": [
20
- {
21
- "path": "../../editor-plugin-code-block/afm-cc/tsconfig.json"
22
- },
23
- {
24
- "path": "../../editor-plugin-editor-disabled/afm-cc/tsconfig.json"
25
- },
26
- {
27
- "path": "../../editor-plugin-find-replace/afm-cc/tsconfig.json"
28
- },
29
- {
30
- "path": "../../editor-plugin-selection/afm-cc/tsconfig.json"
31
- },
32
- {
33
- "path": "../../editor-plugin-selection-marker/afm-cc/tsconfig.json"
34
- },
35
- {
36
- "path": "../../../platform/feature-flags/afm-cc/tsconfig.json"
37
- },
38
- {
39
- "path": "../../tmp-editor-statsig/afm-cc/tsconfig.json"
40
- },
41
- {
42
- "path": "../../../design-system/tokens/afm-cc/tsconfig.json"
43
- },
44
- {
45
- "path": "../../editor-common/afm-cc/tsconfig.json"
46
- }
47
- ]
2
+ "extends": "../../../../tsconfig.entry-points.confluence.json",
3
+ "compilerOptions": {
4
+ "target": "es5",
5
+ "composite": true,
6
+ "outDir": "../../../../../confluence/tsDist/@atlaskit__editor-plugin-code-block-advanced",
7
+ "rootDir": "../"
8
+ },
9
+ "include": [
10
+ "../src/**/*.ts",
11
+ "../src/**/*.tsx"
12
+ ],
13
+ "exclude": [
14
+ "../src/**/__tests__/*",
15
+ "../src/**/*.test.*",
16
+ "../src/**/test.*",
17
+ "../src/**/examples.*",
18
+ "../src/**/examples/*",
19
+ "../src/**/examples/**/*",
20
+ "../src/**/*.stories.*",
21
+ "../src/**/stories/*",
22
+ "../src/**/stories/**/*"
23
+ ],
24
+ "references": [
25
+ {
26
+ "path": "../../editor-plugin-code-block/afm-cc/tsconfig.json"
27
+ },
28
+ {
29
+ "path": "../../editor-plugin-editor-disabled/afm-cc/tsconfig.json"
30
+ },
31
+ {
32
+ "path": "../../editor-plugin-find-replace/afm-cc/tsconfig.json"
33
+ },
34
+ {
35
+ "path": "../../editor-plugin-selection/afm-cc/tsconfig.json"
36
+ },
37
+ {
38
+ "path": "../../editor-plugin-selection-marker/afm-cc/tsconfig.json"
39
+ },
40
+ {
41
+ "path": "../../../platform/feature-flags/afm-cc/tsconfig.json"
42
+ },
43
+ {
44
+ "path": "../../tmp-editor-statsig/afm-cc/tsconfig.json"
45
+ },
46
+ {
47
+ "path": "../../../design-system/tokens/afm-cc/tsconfig.json"
48
+ },
49
+ {
50
+ "path": "../../editor-common/afm-cc/tsconfig.json"
51
+ }
52
+ ]
48
53
  }
@@ -14,7 +14,12 @@
14
14
  "../src/**/__tests__/*",
15
15
  "../src/**/*.test.*",
16
16
  "../src/**/test.*",
17
- "../src/**/examples.*"
17
+ "../src/**/examples.*",
18
+ "../src/**/examples/*",
19
+ "../src/**/examples/**/*",
20
+ "../src/**/*.stories.*",
21
+ "../src/**/stories/*",
22
+ "../src/**/stories/**/*"
18
23
  ],
19
24
  "references": [
20
25
  {
@@ -14,7 +14,12 @@
14
14
  "../src/**/__tests__/*",
15
15
  "../src/**/*.test.*",
16
16
  "../src/**/test.*",
17
- "../src/**/examples.*"
17
+ "../src/**/examples.*",
18
+ "../src/**/examples/*",
19
+ "../src/**/examples/**/*",
20
+ "../src/**/*.stories.*",
21
+ "../src/**/stories/*",
22
+ "../src/**/stories/**/*"
18
23
  ],
19
24
  "references": [
20
25
  {
@@ -0,0 +1,53 @@
1
+ {
2
+ "extends": "../../../../tsconfig.entry-points.townsquare.json",
3
+ "compilerOptions": {
4
+ "target": "es5",
5
+ "outDir": "../../../../../townsquare/tsDist/@atlaskit__editor-plugin-code-block-advanced/app",
6
+ "rootDir": "../",
7
+ "composite": true
8
+ },
9
+ "include": [
10
+ "../src/**/*.ts",
11
+ "../src/**/*.tsx"
12
+ ],
13
+ "exclude": [
14
+ "../src/**/__tests__/*",
15
+ "../src/**/*.test.*",
16
+ "../src/**/test.*",
17
+ "../src/**/examples.*",
18
+ "../src/**/examples/*",
19
+ "../src/**/examples/**/*",
20
+ "../src/**/*.stories.*",
21
+ "../src/**/stories/*",
22
+ "../src/**/stories/**/*"
23
+ ],
24
+ "references": [
25
+ {
26
+ "path": "../../editor-plugin-code-block/afm-townsquare/tsconfig.json"
27
+ },
28
+ {
29
+ "path": "../../editor-plugin-editor-disabled/afm-townsquare/tsconfig.json"
30
+ },
31
+ {
32
+ "path": "../../editor-plugin-find-replace/afm-townsquare/tsconfig.json"
33
+ },
34
+ {
35
+ "path": "../../editor-plugin-selection/afm-townsquare/tsconfig.json"
36
+ },
37
+ {
38
+ "path": "../../editor-plugin-selection-marker/afm-townsquare/tsconfig.json"
39
+ },
40
+ {
41
+ "path": "../../../platform/feature-flags/afm-townsquare/tsconfig.json"
42
+ },
43
+ {
44
+ "path": "../../tmp-editor-statsig/afm-townsquare/tsconfig.json"
45
+ },
46
+ {
47
+ "path": "../../../design-system/tokens/afm-townsquare/tsconfig.json"
48
+ },
49
+ {
50
+ "path": "../../editor-common/afm-townsquare/tsconfig.json"
51
+ }
52
+ ]
53
+ }
@@ -1,17 +1,22 @@
1
1
  {
2
- "extends": "../tsconfig",
3
- "compilerOptions": {
4
- "target": "es5",
5
- "paths": {}
6
- },
7
- "include": [
8
- "../src/**/*.ts",
9
- "../src/**/*.tsx"
10
- ],
11
- "exclude": [
12
- "../src/**/__tests__/*",
13
- "../src/**/*.test.*",
14
- "../src/**/test.*",
15
- "../src/**/examples.*"
16
- ]
2
+ "extends": "../tsconfig",
3
+ "compilerOptions": {
4
+ "target": "es5",
5
+ "paths": {}
6
+ },
7
+ "include": [
8
+ "../src/**/*.ts",
9
+ "../src/**/*.tsx"
10
+ ],
11
+ "exclude": [
12
+ "../src/**/__tests__/*",
13
+ "../src/**/*.test.*",
14
+ "../src/**/test.*",
15
+ "../src/**/examples.*",
16
+ "../src/**/examples/*",
17
+ "../src/**/examples/**/*",
18
+ "../src/**/*.stories.*",
19
+ "../src/**/stories/*",
20
+ "../src/**/stories/**/*"
21
+ ]
17
22
  }
@@ -20,11 +20,13 @@ var codeBlockAdvancedPlugin = exports.codeBlockAdvancedPlugin = function codeBlo
20
20
  pmPlugins: function pmPlugins() {
21
21
  return [{
22
22
  name: 'codeBlockAdvancedPlugin',
23
- plugin: function plugin() {
23
+ plugin: function plugin(_ref2) {
24
24
  var _config$extensions;
25
+ var getIntl = _ref2.getIntl;
25
26
  return (0, _main.createPlugin)({
26
27
  api: api,
27
- extensions: (_config$extensions = config === null || config === void 0 ? void 0 : config.extensions) !== null && _config$extensions !== void 0 ? _config$extensions : []
28
+ extensions: (_config$extensions = config === null || config === void 0 ? void 0 : config.extensions) !== null && _config$extensions !== void 0 ? _config$extensions : [],
29
+ getIntl: getIntl
28
30
  });
29
31
  }
30
32
  }];
@@ -14,10 +14,10 @@ var _language = require("@codemirror/language");
14
14
  var _state = require("@codemirror/state");
15
15
  var _view = require("@codemirror/view");
16
16
  var _codeBlock = require("@atlaskit/editor-common/code-block");
17
+ var _messages = require("@atlaskit/editor-common/messages");
17
18
  var _whitespace = require("@atlaskit/editor-common/whitespace");
18
19
  var _state2 = require("@atlaskit/editor-prosemirror/state");
19
20
  var _view2 = require("@atlaskit/editor-prosemirror/view");
20
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
21
21
  var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
22
22
  var _syntaxHighlightingTheme = require("../ui/syntaxHighlightingTheme");
23
23
  var _theme = require("../ui/theme");
@@ -64,6 +64,9 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
64
64
  });
65
65
  _this.updating = false;
66
66
  });
67
+ var _config$getIntl = config.getIntl(),
68
+ formatMessage = _config$getIntl.formatMessage;
69
+ var formattedAriaLabel = formatMessage(_messages.blockTypeMessages.codeblock);
67
70
  this.cm = new _view.EditorView({
68
71
  doc: this.node.textContent,
69
72
  extensions: [].concat((0, _toConsumableArray2.default)(config.extensions), [this.lineWrappingCompartment.of((0, _codeBlock.isCodeBlockWordWrapEnabled)(node) ? _view.EditorView.lineWrapping : []), this.languageCompartment.of([]), this.pmDecorationsCompartment.of(this.pmFacet.compute([], function () {
@@ -76,13 +79,13 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
76
79
  onMaybeNodeSelection: onMaybeNodeSelection,
77
80
  customFindReplace: Boolean((_config$api3 = config.api) === null || _config$api3 === void 0 ? void 0 : _config$api3.findReplace)
78
81
  }), _theme.cmTheme, (0, _language.syntaxHighlighting)(_syntaxHighlightingTheme.highlightStyle), (0, _language.bracketMatching)(), (0, _view.lineNumbers)({
79
- domEventHandlers: (0, _platformFeatureFlags.fg)('platform_editor_fix_right_click_paste') ? {
82
+ domEventHandlers: {
80
83
  click: function click() {
81
84
  _this.selectCodeBlockNode(undefined);
82
85
  _this.view.focus();
83
86
  return true;
84
87
  }
85
- } : undefined
88
+ }
86
89
  }),
87
90
  // Explicitly disable "sticky" positioning on line numbers to match
88
91
  // Renderer behaviour
@@ -94,7 +97,9 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
94
97
  contentEditable: "".concat(this.view.editable)
95
98
  })]), (0, _autocomplete.closeBrackets)(), _view.EditorView.editorAttributes.of({
96
99
  class: 'code-block'
97
- }), (0, _manageSelectionMarker.manageSelectionMarker)(config.api), (0, _prosemirrorDecorations.prosemirrorDecorationPlugin)(this.pmFacet, view, getPos), (0, _tripleClickExtension.tripleClickSelectAllExtension)(), (0, _firstCodeBlockInDocument.firstCodeBlockInDocument)(getPos)])
100
+ }), (0, _manageSelectionMarker.manageSelectionMarker)(config.api), (0, _prosemirrorDecorations.prosemirrorDecorationPlugin)(this.pmFacet, view, getPos), (0, _tripleClickExtension.tripleClickSelectAllExtension)(), (0, _firstCodeBlockInDocument.firstCodeBlockInDocument)(getPos), _view.EditorView.contentAttributes.of({
101
+ 'aria-label': formattedAriaLabel
102
+ })])
98
103
  });
99
104
 
100
105
  // We append an additional element that fixes a selection bug on chrome if the code block
@@ -250,28 +255,7 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
250
255
  }, {
251
256
  key: "stopEvent",
252
257
  value: function stopEvent(e) {
253
- var _this2 = this,
254
- _this$getPos5;
255
- if (!(0, _platformFeatureFlags.fg)('platform_editor_fix_right_click_paste')) {
256
- if (e instanceof MouseEvent && e.type === 'mousedown') {
257
- // !Warning: Side effect!
258
- // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
259
- // We need to select the nodeview after this has taken place to ensure
260
- // ProseMirror takes over
261
- // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
262
- setTimeout(function () {
263
- // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
264
- // cause funky behaviour
265
- _this2.updating = true;
266
- _this2.cm.dispatch({
267
- selection: _state.EditorSelection.create([_state.EditorSelection.cursor(0)], 0)
268
- });
269
- _this2.updating = false;
270
- _this2.selectCodeBlockNode(undefined);
271
- _this2.view.focus();
272
- }, 20);
273
- }
274
- }
258
+ var _this$getPos5;
275
259
  // If we have selected the node we should not stop these events
276
260
  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))) {
277
261
  return false;
@@ -14,11 +14,14 @@ export const codeBlockAdvancedPlugin = ({
14
14
  pmPlugins() {
15
15
  return [{
16
16
  name: 'codeBlockAdvancedPlugin',
17
- plugin: () => {
17
+ plugin: ({
18
+ getIntl
19
+ }) => {
18
20
  var _config$extensions;
19
21
  return createPlugin({
20
22
  api,
21
- extensions: (_config$extensions = config === null || config === void 0 ? void 0 : config.extensions) !== null && _config$extensions !== void 0 ? _config$extensions : []
23
+ extensions: (_config$extensions = config === null || config === void 0 ? void 0 : config.extensions) !== null && _config$extensions !== void 0 ? _config$extensions : [],
24
+ getIntl
22
25
  });
23
26
  }
24
27
  }];
@@ -1,13 +1,13 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  import { closeBrackets } from '@codemirror/autocomplete';
3
3
  import { syntaxHighlighting, bracketMatching } from '@codemirror/language';
4
- import { Compartment, EditorSelection, Facet, EditorState as CodeMirrorState } from '@codemirror/state';
4
+ import { Compartment, Facet, EditorState as CodeMirrorState } from '@codemirror/state';
5
5
  import { EditorView as CodeMirror, lineNumbers, gutters } from '@codemirror/view';
6
6
  import { isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
7
+ import { blockTypeMessages } from '@atlaskit/editor-common/messages';
7
8
  import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/whitespace';
8
9
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
9
10
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
10
- import { fg } from '@atlaskit/platform-feature-flags';
11
11
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
12
12
  import { highlightStyle } from '../ui/syntaxHighlightingTheme';
13
13
  import { cmTheme } from '../ui/theme';
@@ -46,6 +46,10 @@ class CodeBlockAdvancedNodeView {
46
46
  });
47
47
  this.updating = false;
48
48
  });
49
+ const {
50
+ formatMessage
51
+ } = config.getIntl();
52
+ const formattedAriaLabel = formatMessage(blockTypeMessages.codeblock);
49
53
  this.cm = new CodeMirror({
50
54
  doc: this.node.textContent,
51
55
  extensions: [...config.extensions, this.lineWrappingCompartment.of(isCodeBlockWordWrapEnabled(node) ? CodeMirror.lineWrapping : []), this.languageCompartment.of([]), this.pmDecorationsCompartment.of(this.pmFacet.compute([], () => innerDecorations)), keymapExtension({
@@ -56,13 +60,13 @@ class CodeBlockAdvancedNodeView {
56
60
  onMaybeNodeSelection,
57
61
  customFindReplace: Boolean((_config$api3 = config.api) === null || _config$api3 === void 0 ? void 0 : _config$api3.findReplace)
58
62
  }), cmTheme, syntaxHighlighting(highlightStyle), bracketMatching(), lineNumbers({
59
- domEventHandlers: fg('platform_editor_fix_right_click_paste') ? {
63
+ domEventHandlers: {
60
64
  click: () => {
61
65
  this.selectCodeBlockNode(undefined);
62
66
  this.view.focus();
63
67
  return true;
64
68
  }
65
- } : undefined
69
+ }
66
70
  }),
67
71
  // Explicitly disable "sticky" positioning on line numbers to match
68
72
  // Renderer behaviour
@@ -72,7 +76,9 @@ class CodeBlockAdvancedNodeView {
72
76
  contentEditable: `${this.view.editable}`
73
77
  })]), closeBrackets(), CodeMirror.editorAttributes.of({
74
78
  class: 'code-block'
75
- }), manageSelectionMarker(config.api), prosemirrorDecorationPlugin(this.pmFacet, view, getPos), tripleClickSelectAllExtension(), firstCodeBlockInDocument(getPos)]
79
+ }), manageSelectionMarker(config.api), prosemirrorDecorationPlugin(this.pmFacet, view, getPos), tripleClickSelectAllExtension(), firstCodeBlockInDocument(getPos), CodeMirror.contentAttributes.of({
80
+ 'aria-label': formattedAriaLabel
81
+ })]
76
82
  });
77
83
 
78
84
  // We append an additional element that fixes a selection bug on chrome if the code block
@@ -201,26 +207,6 @@ class CodeBlockAdvancedNodeView {
201
207
  }
202
208
  stopEvent(e) {
203
209
  var _this$getPos5;
204
- if (!fg('platform_editor_fix_right_click_paste')) {
205
- if (e instanceof MouseEvent && e.type === 'mousedown') {
206
- // !Warning: Side effect!
207
- // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
208
- // We need to select the nodeview after this has taken place to ensure
209
- // ProseMirror takes over
210
- // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
211
- setTimeout(() => {
212
- // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
213
- // cause funky behaviour
214
- this.updating = true;
215
- this.cm.dispatch({
216
- selection: EditorSelection.create([EditorSelection.cursor(0)], 0)
217
- });
218
- this.updating = false;
219
- this.selectCodeBlockNode(undefined);
220
- this.view.focus();
221
- }, 20);
222
- }
223
- }
224
210
  // If we have selected the node we should not stop these events
225
211
  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))) {
226
212
  return false;
@@ -14,11 +14,13 @@ export var codeBlockAdvancedPlugin = function codeBlockAdvancedPlugin(_ref) {
14
14
  pmPlugins: function pmPlugins() {
15
15
  return [{
16
16
  name: 'codeBlockAdvancedPlugin',
17
- plugin: function plugin() {
17
+ plugin: function plugin(_ref2) {
18
18
  var _config$extensions;
19
+ var getIntl = _ref2.getIntl;
19
20
  return createPlugin({
20
21
  api: api,
21
- extensions: (_config$extensions = config === null || config === void 0 ? void 0 : config.extensions) !== null && _config$extensions !== void 0 ? _config$extensions : []
22
+ extensions: (_config$extensions = config === null || config === void 0 ? void 0 : config.extensions) !== null && _config$extensions !== void 0 ? _config$extensions : [],
23
+ getIntl: getIntl
22
24
  });
23
25
  }
24
26
  }];
@@ -4,13 +4,13 @@ import _createClass from "@babel/runtime/helpers/createClass";
4
4
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
5
5
  import { closeBrackets } from '@codemirror/autocomplete';
6
6
  import { syntaxHighlighting, bracketMatching } from '@codemirror/language';
7
- import { Compartment, EditorSelection, Facet, EditorState as CodeMirrorState } from '@codemirror/state';
7
+ import { Compartment, Facet, EditorState as CodeMirrorState } from '@codemirror/state';
8
8
  import { EditorView as CodeMirror, lineNumbers, gutters } from '@codemirror/view';
9
9
  import { isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
10
+ import { blockTypeMessages } from '@atlaskit/editor-common/messages';
10
11
  import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/whitespace';
11
12
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
12
13
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
13
- import { fg } from '@atlaskit/platform-feature-flags';
14
14
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
15
15
  import { highlightStyle } from '../ui/syntaxHighlightingTheme';
16
16
  import { cmTheme } from '../ui/theme';
@@ -57,6 +57,9 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
57
57
  });
58
58
  _this.updating = false;
59
59
  });
60
+ var _config$getIntl = config.getIntl(),
61
+ formatMessage = _config$getIntl.formatMessage;
62
+ var formattedAriaLabel = formatMessage(blockTypeMessages.codeblock);
60
63
  this.cm = new CodeMirror({
61
64
  doc: this.node.textContent,
62
65
  extensions: [].concat(_toConsumableArray(config.extensions), [this.lineWrappingCompartment.of(isCodeBlockWordWrapEnabled(node) ? CodeMirror.lineWrapping : []), this.languageCompartment.of([]), this.pmDecorationsCompartment.of(this.pmFacet.compute([], function () {
@@ -69,13 +72,13 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
69
72
  onMaybeNodeSelection: onMaybeNodeSelection,
70
73
  customFindReplace: Boolean((_config$api3 = config.api) === null || _config$api3 === void 0 ? void 0 : _config$api3.findReplace)
71
74
  }), cmTheme, syntaxHighlighting(highlightStyle), bracketMatching(), lineNumbers({
72
- domEventHandlers: fg('platform_editor_fix_right_click_paste') ? {
75
+ domEventHandlers: {
73
76
  click: function click() {
74
77
  _this.selectCodeBlockNode(undefined);
75
78
  _this.view.focus();
76
79
  return true;
77
80
  }
78
- } : undefined
81
+ }
79
82
  }),
80
83
  // Explicitly disable "sticky" positioning on line numbers to match
81
84
  // Renderer behaviour
@@ -87,7 +90,9 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
87
90
  contentEditable: "".concat(this.view.editable)
88
91
  })]), closeBrackets(), CodeMirror.editorAttributes.of({
89
92
  class: 'code-block'
90
- }), manageSelectionMarker(config.api), prosemirrorDecorationPlugin(this.pmFacet, view, getPos), tripleClickSelectAllExtension(), firstCodeBlockInDocument(getPos)])
93
+ }), manageSelectionMarker(config.api), prosemirrorDecorationPlugin(this.pmFacet, view, getPos), tripleClickSelectAllExtension(), firstCodeBlockInDocument(getPos), CodeMirror.contentAttributes.of({
94
+ 'aria-label': formattedAriaLabel
95
+ })])
91
96
  });
92
97
 
93
98
  // We append an additional element that fixes a selection bug on chrome if the code block
@@ -243,28 +248,7 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
243
248
  }, {
244
249
  key: "stopEvent",
245
250
  value: function stopEvent(e) {
246
- var _this2 = this,
247
- _this$getPos5;
248
- if (!fg('platform_editor_fix_right_click_paste')) {
249
- if (e instanceof MouseEvent && e.type === 'mousedown') {
250
- // !Warning: Side effect!
251
- // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
252
- // We need to select the nodeview after this has taken place to ensure
253
- // ProseMirror takes over
254
- // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
255
- setTimeout(function () {
256
- // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
257
- // cause funky behaviour
258
- _this2.updating = true;
259
- _this2.cm.dispatch({
260
- selection: EditorSelection.create([EditorSelection.cursor(0)], 0)
261
- });
262
- _this2.updating = false;
263
- _this2.selectCodeBlockNode(undefined);
264
- _this2.view.focus();
265
- }, 20);
266
- }
267
- }
251
+ var _this$getPos5;
268
252
  // If we have selected the node we should not stop these events
269
253
  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))) {
270
254
  return false;
@@ -1,5 +1,6 @@
1
1
  import { type Extension } from '@codemirror/state';
2
2
  import { type ViewUpdate } from '@codemirror/view';
3
+ import type { IntlShape } from 'react-intl-next';
3
4
  import type { getPosHandler, getPosHandlerNode, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
5
  import { type Node as PMNode } from '@atlaskit/editor-prosemirror/model';
5
6
  import type { Decoration, DecorationSource, EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
@@ -7,6 +8,7 @@ import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
7
8
  interface ConfigProps {
8
9
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
9
10
  extensions: Extension[];
11
+ getIntl: () => IntlShape;
10
12
  }
11
13
  declare class CodeBlockAdvancedNodeView implements NodeView {
12
14
  dom: Node;
@@ -1,9 +1,11 @@
1
1
  import { type Extension } from '@codemirror/state';
2
+ import type { IntlShape } from 'react-intl-next';
2
3
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
4
  import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
4
5
  interface Props {
5
6
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
6
7
  extensions: Extension[];
8
+ getIntl: () => IntlShape;
7
9
  }
8
10
  export declare const lazyCodeBlockView: (props: Props) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;
9
11
  export {};
@@ -1,10 +1,12 @@
1
1
  import type { Extension } from '@codemirror/state';
2
+ import type { IntlShape } from 'react-intl-next';
2
3
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
3
4
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
5
  import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
5
6
  interface Props {
6
7
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
7
8
  extensions: Extension[];
9
+ getIntl: () => IntlShape;
8
10
  }
9
11
  export declare const createPlugin: (props: Props) => SafePlugin<any>;
10
12
  export {};
@@ -1,5 +1,6 @@
1
1
  import { type Extension } from '@codemirror/state';
2
2
  import { type ViewUpdate } from '@codemirror/view';
3
+ import type { IntlShape } from 'react-intl-next';
3
4
  import type { getPosHandler, getPosHandlerNode, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
5
  import { type Node as PMNode } from '@atlaskit/editor-prosemirror/model';
5
6
  import type { Decoration, DecorationSource, EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
@@ -7,6 +8,7 @@ import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
7
8
  interface ConfigProps {
8
9
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
9
10
  extensions: Extension[];
11
+ getIntl: () => IntlShape;
10
12
  }
11
13
  declare class CodeBlockAdvancedNodeView implements NodeView {
12
14
  dom: Node;
@@ -1,9 +1,11 @@
1
1
  import { type Extension } from '@codemirror/state';
2
+ import type { IntlShape } from 'react-intl-next';
2
3
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
4
  import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
4
5
  interface Props {
5
6
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
6
7
  extensions: Extension[];
8
+ getIntl: () => IntlShape;
7
9
  }
8
10
  export declare const lazyCodeBlockView: (props: Props) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;
9
11
  export {};
@@ -1,10 +1,12 @@
1
1
  import type { Extension } from '@codemirror/state';
2
+ import type { IntlShape } from 'react-intl-next';
2
3
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
3
4
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
5
  import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
5
6
  interface Props {
6
7
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
7
8
  extensions: Extension[];
9
+ getIntl: () => IntlShape;
8
10
  }
9
11
  export declare const createPlugin: (props: Props) => SafePlugin<any>;
10
12
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-code-block-advanced",
3
- "version": "3.0.3",
3
+ "version": "3.0.5",
4
4
  "description": "CodeBlockAdvanced plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -31,16 +31,16 @@
31
31
  ".": "./src/index.ts"
32
32
  },
33
33
  "dependencies": {
34
- "@atlaskit/adf-schema": "^49.0.6",
34
+ "@atlaskit/adf-schema": "^50.0.1",
35
35
  "@atlaskit/editor-plugin-code-block": "^5.0.0",
36
36
  "@atlaskit/editor-plugin-editor-disabled": "^3.0.0",
37
- "@atlaskit/editor-plugin-find-replace": "^3.1.0",
37
+ "@atlaskit/editor-plugin-find-replace": "^3.2.0",
38
38
  "@atlaskit/editor-plugin-selection": "^3.0.0",
39
39
  "@atlaskit/editor-plugin-selection-marker": "^3.0.0",
40
40
  "@atlaskit/editor-prosemirror": "7.0.0",
41
41
  "@atlaskit/platform-feature-flags": "^1.1.0",
42
- "@atlaskit/tmp-editor-statsig": "^9.7.0",
43
- "@atlaskit/tokens": "^5.5.0",
42
+ "@atlaskit/tmp-editor-statsig": "^9.20.0",
43
+ "@atlaskit/tokens": "^5.6.0",
44
44
  "@babel/runtime": "^7.0.0",
45
45
  "@codemirror/autocomplete": "6.18.4",
46
46
  "@codemirror/commands": "6.7.1",
@@ -54,7 +54,7 @@
54
54
  "codemirror-lang-elixir": "4.0.0"
55
55
  },
56
56
  "peerDependencies": {
57
- "@atlaskit/editor-common": "^107.8.0",
57
+ "@atlaskit/editor-common": "^107.16.0",
58
58
  "react": "^18.2.0"
59
59
  },
60
60
  "devDependencies": {
@@ -100,9 +100,6 @@
100
100
  "platform-feature-flags": {
101
101
  "platform_editor_breakout_resizing_hello_release": {
102
102
  "type": "boolean"
103
- },
104
- "platform_editor_fix_right_click_paste": {
105
- "type": "boolean"
106
103
  }
107
104
  }
108
105
  }
@@ -18,7 +18,8 @@ export const codeBlockAdvancedPlugin: CodeBlockAdvancedPlugin = ({ api, config }
18
18
  return [
19
19
  {
20
20
  name: 'codeBlockAdvancedPlugin',
21
- plugin: () => createPlugin({ api, extensions: config?.extensions ?? [] }),
21
+ plugin: ({ getIntl }) =>
22
+ createPlugin({ api, extensions: config?.extensions ?? [], getIntl }),
22
23
  },
23
24
  ];
24
25
  },
@@ -3,14 +3,15 @@ import { syntaxHighlighting, bracketMatching } from '@codemirror/language';
3
3
  import {
4
4
  Compartment,
5
5
  type Extension,
6
- EditorSelection,
7
6
  Facet,
8
7
  EditorState as CodeMirrorState,
9
8
  type StateEffect,
10
9
  } from '@codemirror/state';
11
10
  import { EditorView as CodeMirror, lineNumbers, type ViewUpdate, gutters } from '@codemirror/view';
11
+ import type { IntlShape } from 'react-intl-next';
12
12
 
13
13
  import { isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
14
+ import { blockTypeMessages } from '@atlaskit/editor-common/messages';
14
15
  import { type RelativeSelectionPos } from '@atlaskit/editor-common/selection';
15
16
  import type {
16
17
  getPosHandler,
@@ -28,7 +29,6 @@ import type {
28
29
  NodeView,
29
30
  } from '@atlaskit/editor-prosemirror/view';
30
31
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
31
- import { fg } from '@atlaskit/platform-feature-flags';
32
32
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
33
33
 
34
34
  import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
@@ -47,6 +47,7 @@ import { LanguageLoader } from './languages/loader';
47
47
  interface ConfigProps {
48
48
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
49
49
  extensions: Extension[];
50
+ getIntl: () => IntlShape;
50
51
  }
51
52
 
52
53
  // Based on: https://prosemirror.net/examples/codemirror/
@@ -90,6 +91,8 @@ class CodeBlockAdvancedNodeView implements NodeView {
90
91
  });
91
92
  this.updating = false;
92
93
  });
94
+ const { formatMessage } = config.getIntl();
95
+ const formattedAriaLabel = formatMessage(blockTypeMessages.codeblock);
93
96
 
94
97
  this.cm = new CodeMirror({
95
98
  doc: this.node.textContent,
@@ -112,15 +115,13 @@ class CodeBlockAdvancedNodeView implements NodeView {
112
115
  syntaxHighlighting(highlightStyle),
113
116
  bracketMatching(),
114
117
  lineNumbers({
115
- domEventHandlers: fg('platform_editor_fix_right_click_paste')
116
- ? {
117
- click: () => {
118
- this.selectCodeBlockNode(undefined);
119
- this.view.focus();
120
- return true;
121
- },
122
- }
123
- : undefined,
118
+ domEventHandlers: {
119
+ click: () => {
120
+ this.selectCodeBlockNode(undefined);
121
+ this.view.focus();
122
+ return true;
123
+ },
124
+ },
124
125
  }),
125
126
  // Explicitly disable "sticky" positioning on line numbers to match
126
127
  // Renderer behaviour
@@ -136,6 +137,7 @@ class CodeBlockAdvancedNodeView implements NodeView {
136
137
  prosemirrorDecorationPlugin(this.pmFacet, view, getPos),
137
138
  tripleClickSelectAllExtension(),
138
139
  firstCodeBlockInDocument(getPos),
140
+ CodeMirror.contentAttributes.of({ 'aria-label': formattedAriaLabel }),
139
141
  ],
140
142
  });
141
143
 
@@ -275,26 +277,6 @@ class CodeBlockAdvancedNodeView implements NodeView {
275
277
  }
276
278
 
277
279
  stopEvent(e: Event) {
278
- if (!fg('platform_editor_fix_right_click_paste')) {
279
- if (e instanceof MouseEvent && e.type === 'mousedown') {
280
- // !Warning: Side effect!
281
- // CodeMirror on blur updates the dom observer with a `setTimeout(..., 10);`
282
- // We need to select the nodeview after this has taken place to ensure
283
- // ProseMirror takes over
284
- // https://github.com/codemirror/view/commit/70a9a253df04a57004247b9463198c17832f92f4#diff-cb8cbffa623ff0975389e7e8c315e69d5e10345239ffe2c9b4b7986a56ad95efR720
285
- setTimeout(() => {
286
- // Ensure the CM selection is reset - if we have a ranged selection when we do node selection can
287
- // cause funky behaviour
288
- this.updating = true;
289
- this.cm.dispatch({
290
- selection: EditorSelection.create([EditorSelection.cursor(0)], 0),
291
- });
292
- this.updating = false;
293
- this.selectCodeBlockNode(undefined);
294
- this.view.focus();
295
- }, 20);
296
- }
297
- }
298
280
  // If we have selected the node we should not stop these events
299
281
  if (
300
282
  (e instanceof KeyboardEvent || e instanceof ClipboardEvent) &&
@@ -1,4 +1,5 @@
1
1
  import { type Extension } from '@codemirror/state';
2
+ import type { IntlShape } from 'react-intl-next';
2
3
 
3
4
  import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
4
5
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
@@ -10,6 +11,7 @@ import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
10
11
  interface Props {
11
12
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
12
13
  extensions: Extension[];
14
+ getIntl: () => IntlShape;
13
15
  }
14
16
 
15
17
  export const lazyCodeBlockView = (props: Props) => {
@@ -1,4 +1,5 @@
1
1
  import type { Extension } from '@codemirror/state';
2
+ import type { IntlShape } from 'react-intl-next';
2
3
 
3
4
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
4
5
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
@@ -12,6 +13,7 @@ import { shiftArrowDownWorkaround, shiftArrowUpWorkaround } from './shiftArrowKe
12
13
  interface Props {
13
14
  api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
14
15
  extensions: Extension[];
16
+ getIntl: () => IntlShape;
15
17
  }
16
18
 
17
19
  export const createPlugin = (props: Props) => {
package/tsconfig.dev.json CHANGED
@@ -23,7 +23,13 @@
23
23
  "./__mocks__/**/*",
24
24
  "**/mock.*",
25
25
  "**/codemods/**/*.ts",
26
- "**/codemods/**/*.tsx"
26
+ "**/codemods/**/*.tsx",
27
+ "**/stories.ts",
28
+ "**/stories.tsx",
29
+ "**/stories/*.ts",
30
+ "**/stories/*.tsx",
31
+ "**/stories/**/*.ts",
32
+ "**/stories/**/*.tsx"
27
33
  ],
28
34
  "exclude": ["./dist/**/*", "./build/**/*", "./node_modules/**/*"],
29
35
  "compilerOptions": {
package/tsconfig.json CHANGED
@@ -5,6 +5,5 @@
5
5
  "src/**/*.tsx"
6
6
  ],
7
7
  "compilerOptions": {
8
- "baseUrl": ""
9
8
  }
10
9
  }