@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 +21 -0
- package/afm-cc/tsconfig.json +51 -46
- package/afm-jira/tsconfig.json +6 -1
- package/afm-post-office/tsconfig.json +6 -1
- package/afm-townsquare/tsconfig.json +53 -0
- package/build/tsconfig.json +20 -15
- package/dist/cjs/codeBlockAdvancedPlugin.js +4 -2
- package/dist/cjs/nodeviews/codeBlockAdvanced.js +10 -26
- package/dist/es2019/codeBlockAdvancedPlugin.js +5 -2
- package/dist/es2019/nodeviews/codeBlockAdvanced.js +11 -25
- package/dist/esm/codeBlockAdvancedPlugin.js +4 -2
- package/dist/esm/nodeviews/codeBlockAdvanced.js +11 -27
- package/dist/types/nodeviews/codeBlockAdvanced.d.ts +2 -0
- package/dist/types/nodeviews/lazyCodeBlockAdvanced.d.ts +2 -0
- package/dist/types/pm-plugins/main.d.ts +2 -0
- package/dist/types-ts4.5/nodeviews/codeBlockAdvanced.d.ts +2 -0
- package/dist/types-ts4.5/nodeviews/lazyCodeBlockAdvanced.d.ts +2 -0
- package/dist/types-ts4.5/pm-plugins/main.d.ts +2 -0
- package/package.json +6 -9
- package/src/codeBlockAdvancedPlugin.tsx +2 -1
- package/src/nodeviews/codeBlockAdvanced.ts +13 -31
- package/src/nodeviews/lazyCodeBlockAdvanced.ts +2 -0
- package/src/pm-plugins/main.ts +2 -0
- package/tsconfig.dev.json +7 -1
- package/tsconfig.json +0 -1
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
|
package/afm-cc/tsconfig.json
CHANGED
|
@@ -1,48 +1,53 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
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
|
}
|
package/afm-jira/tsconfig.json
CHANGED
|
@@ -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
|
+
}
|
package/build/tsconfig.json
CHANGED
|
@@ -1,17 +1,22 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
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:
|
|
82
|
+
domEventHandlers: {
|
|
80
83
|
click: function click() {
|
|
81
84
|
_this.selectCodeBlockNode(undefined);
|
|
82
85
|
_this.view.focus();
|
|
83
86
|
return true;
|
|
84
87
|
}
|
|
85
|
-
}
|
|
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
|
|
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,
|
|
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:
|
|
63
|
+
domEventHandlers: {
|
|
60
64
|
click: () => {
|
|
61
65
|
this.selectCodeBlockNode(undefined);
|
|
62
66
|
this.view.focus();
|
|
63
67
|
return true;
|
|
64
68
|
}
|
|
65
|
-
}
|
|
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,
|
|
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:
|
|
75
|
+
domEventHandlers: {
|
|
73
76
|
click: function click() {
|
|
74
77
|
_this.selectCodeBlockNode(undefined);
|
|
75
78
|
_this.view.focus();
|
|
76
79
|
return true;
|
|
77
80
|
}
|
|
78
|
-
}
|
|
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
|
|
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
|
+
"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": "^
|
|
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.
|
|
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.
|
|
43
|
-
"@atlaskit/tokens": "^5.
|
|
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.
|
|
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: (
|
|
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:
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
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) => {
|
package/src/pm-plugins/main.ts
CHANGED
|
@@ -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": {
|