@atlaskit/editor-plugin-code-block-advanced 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (110) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/LICENSE.md +11 -0
  3. package/README.md +1 -0
  4. package/afm-cc/tsconfig.json +36 -0
  5. package/build/tsconfig.json +17 -0
  6. package/dist/cjs/codeBlockAdvancedPlugin.js +33 -0
  7. package/dist/cjs/codeBlockAdvancedPluginType.js +5 -0
  8. package/dist/cjs/index.js +12 -0
  9. package/dist/cjs/nodeviews/codeBlockAdvanced.js +212 -0
  10. package/dist/cjs/nodeviews/codeBlockNodeWithToDOMFixed.js +55 -0
  11. package/dist/cjs/nodeviews/codemirrorSync/syncCMWithPM.js +38 -0
  12. package/dist/cjs/nodeviews/codemirrorSync/updateCMSelection.js +36 -0
  13. package/dist/cjs/nodeviews/extensions/bidiCharWarning.js +83 -0
  14. package/dist/cjs/nodeviews/extensions/keymap/backspace.js +33 -0
  15. package/dist/cjs/nodeviews/extensions/keymap/index.js +129 -0
  16. package/dist/cjs/nodeviews/extensions/keymap/maybeEscape.js +63 -0
  17. package/dist/cjs/nodeviews/languages/languageMap.js +100 -0
  18. package/dist/cjs/nodeviews/languages/loader.js +50 -0
  19. package/dist/cjs/nodeviews/lazyCodeBlockAdvanced.js +29 -0
  20. package/dist/cjs/pm-plugins/main.js +17 -0
  21. package/dist/cjs/ui/syntaxHighlightingTheme.js +76 -0
  22. package/dist/cjs/ui/theme.js +55 -0
  23. package/dist/es2019/codeBlockAdvancedPlugin.js +26 -0
  24. package/dist/es2019/codeBlockAdvancedPluginType.js +1 -0
  25. package/dist/es2019/index.js +4 -0
  26. package/dist/es2019/nodeviews/codeBlockAdvanced.js +170 -0
  27. package/dist/es2019/nodeviews/codeBlockNodeWithToDOMFixed.js +42 -0
  28. package/dist/es2019/nodeviews/codemirrorSync/syncCMWithPM.js +35 -0
  29. package/dist/es2019/nodeviews/codemirrorSync/updateCMSelection.js +30 -0
  30. package/dist/es2019/nodeviews/extensions/bidiCharWarning.js +53 -0
  31. package/dist/es2019/nodeviews/extensions/keymap/backspace.js +28 -0
  32. package/dist/es2019/nodeviews/extensions/keymap/index.js +107 -0
  33. package/dist/es2019/nodeviews/extensions/keymap/maybeEscape.js +57 -0
  34. package/dist/es2019/nodeviews/languages/languageMap.js +82 -0
  35. package/dist/es2019/nodeviews/languages/loader.js +37 -0
  36. package/dist/es2019/nodeviews/lazyCodeBlockAdvanced.js +18 -0
  37. package/dist/es2019/pm-plugins/main.js +11 -0
  38. package/dist/es2019/ui/syntaxHighlightingTheme.js +70 -0
  39. package/dist/es2019/ui/theme.js +49 -0
  40. package/dist/esm/codeBlockAdvancedPlugin.js +27 -0
  41. package/dist/esm/codeBlockAdvancedPluginType.js +1 -0
  42. package/dist/esm/index.js +4 -0
  43. package/dist/esm/nodeviews/codeBlockAdvanced.js +205 -0
  44. package/dist/esm/nodeviews/codeBlockNodeWithToDOMFixed.js +48 -0
  45. package/dist/esm/nodeviews/codemirrorSync/syncCMWithPM.js +32 -0
  46. package/dist/esm/nodeviews/codemirrorSync/updateCMSelection.js +30 -0
  47. package/dist/esm/nodeviews/extensions/bidiCharWarning.js +77 -0
  48. package/dist/esm/nodeviews/extensions/keymap/backspace.js +27 -0
  49. package/dist/esm/nodeviews/extensions/keymap/index.js +122 -0
  50. package/dist/esm/nodeviews/extensions/keymap/maybeEscape.js +56 -0
  51. package/dist/esm/nodeviews/languages/languageMap.js +86 -0
  52. package/dist/esm/nodeviews/languages/loader.js +44 -0
  53. package/dist/esm/nodeviews/lazyCodeBlockAdvanced.js +17 -0
  54. package/dist/esm/pm-plugins/main.js +11 -0
  55. package/dist/esm/ui/syntaxHighlightingTheme.js +70 -0
  56. package/dist/esm/ui/theme.js +49 -0
  57. package/dist/types/codeBlockAdvancedPlugin.d.ts +2 -0
  58. package/dist/types/codeBlockAdvancedPluginType.d.ts +11 -0
  59. package/dist/types/index.d.ts +2 -0
  60. package/dist/types/nodeviews/codeBlockAdvanced.d.ts +38 -0
  61. package/dist/types/nodeviews/codeBlockNodeWithToDOMFixed.d.ts +2 -0
  62. package/dist/types/nodeviews/codemirrorSync/syncCMWithPM.d.ts +17 -0
  63. package/dist/types/nodeviews/codemirrorSync/updateCMSelection.d.ts +11 -0
  64. package/dist/types/nodeviews/extensions/bidiCharWarning.d.ts +8 -0
  65. package/dist/types/nodeviews/extensions/keymap/backspace.d.ts +12 -0
  66. package/dist/types/nodeviews/extensions/keymap/index.d.ts +14 -0
  67. package/dist/types/nodeviews/extensions/keymap/maybeEscape.d.ts +17 -0
  68. package/dist/types/nodeviews/languages/languageMap.d.ts +5 -0
  69. package/dist/types/nodeviews/languages/loader.d.ts +11 -0
  70. package/dist/types/nodeviews/lazyCodeBlockAdvanced.d.ts +9 -0
  71. package/dist/types/pm-plugins/main.d.ts +10 -0
  72. package/dist/types/ui/syntaxHighlightingTheme.d.ts +2 -0
  73. package/dist/types/ui/theme.d.ts +1 -0
  74. package/dist/types-ts4.5/codeBlockAdvancedPlugin.d.ts +2 -0
  75. package/dist/types-ts4.5/codeBlockAdvancedPluginType.d.ts +15 -0
  76. package/dist/types-ts4.5/index.d.ts +2 -0
  77. package/dist/types-ts4.5/nodeviews/codeBlockAdvanced.d.ts +38 -0
  78. package/dist/types-ts4.5/nodeviews/codeBlockNodeWithToDOMFixed.d.ts +2 -0
  79. package/dist/types-ts4.5/nodeviews/codemirrorSync/syncCMWithPM.d.ts +17 -0
  80. package/dist/types-ts4.5/nodeviews/codemirrorSync/updateCMSelection.d.ts +11 -0
  81. package/dist/types-ts4.5/nodeviews/extensions/bidiCharWarning.d.ts +8 -0
  82. package/dist/types-ts4.5/nodeviews/extensions/keymap/backspace.d.ts +12 -0
  83. package/dist/types-ts4.5/nodeviews/extensions/keymap/index.d.ts +14 -0
  84. package/dist/types-ts4.5/nodeviews/extensions/keymap/maybeEscape.d.ts +17 -0
  85. package/dist/types-ts4.5/nodeviews/languages/languageMap.d.ts +5 -0
  86. package/dist/types-ts4.5/nodeviews/languages/loader.d.ts +12 -0
  87. package/dist/types-ts4.5/nodeviews/lazyCodeBlockAdvanced.d.ts +9 -0
  88. package/dist/types-ts4.5/pm-plugins/main.d.ts +10 -0
  89. package/dist/types-ts4.5/ui/syntaxHighlightingTheme.d.ts +2 -0
  90. package/dist/types-ts4.5/ui/theme.d.ts +1 -0
  91. package/docs/0-intro.tsx +56 -0
  92. package/package.json +96 -0
  93. package/src/codeBlockAdvancedPlugin.tsx +25 -0
  94. package/src/codeBlockAdvancedPluginType.ts +18 -0
  95. package/src/index.ts +5 -0
  96. package/src/nodeviews/codeBlockAdvanced.ts +223 -0
  97. package/src/nodeviews/codeBlockNodeWithToDOMFixed.ts +59 -0
  98. package/src/nodeviews/codemirrorSync/syncCMWithPM.ts +40 -0
  99. package/src/nodeviews/codemirrorSync/updateCMSelection.ts +40 -0
  100. package/src/nodeviews/extensions/bidiCharWarning.ts +72 -0
  101. package/src/nodeviews/extensions/keymap/backspace.ts +47 -0
  102. package/src/nodeviews/extensions/keymap/index.ts +118 -0
  103. package/src/nodeviews/extensions/keymap/maybeEscape.ts +69 -0
  104. package/src/nodeviews/languages/languageMap.ts +91 -0
  105. package/src/nodeviews/languages/loader.ts +44 -0
  106. package/src/nodeviews/lazyCodeBlockAdvanced.ts +32 -0
  107. package/src/pm-plugins/main.ts +22 -0
  108. package/src/ui/syntaxHighlightingTheme.ts +50 -0
  109. package/src/ui/theme.ts +52 -0
  110. package/tsconfig.json +10 -0
@@ -0,0 +1,122 @@
1
+ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
2
+ import { defaultKeymap, indentWithTab } from '@codemirror/commands';
3
+ import { keymap as cmKeymap } from '@codemirror/view';
4
+ import { exitCode } from '@atlaskit/editor-prosemirror/commands';
5
+ import { undo, redo } from '@atlaskit/editor-prosemirror/history';
6
+ import { backspaceKeymap } from './backspace';
7
+ import { maybeEscapeKeymap } from './maybeEscape';
8
+ export var keymapExtension = function keymapExtension(_ref) {
9
+ var view = _ref.view,
10
+ getNode = _ref.getNode,
11
+ getPos = _ref.getPos,
12
+ selectCodeBlockNode = _ref.selectCodeBlockNode,
13
+ onMaybeNodeSelection = _ref.onMaybeNodeSelection;
14
+ return cmKeymap.of(codeBlockKeymap({
15
+ view: view,
16
+ getNode: getNode,
17
+ getPos: getPos,
18
+ selectCodeBlockNode: selectCodeBlockNode,
19
+ onMaybeNodeSelection: onMaybeNodeSelection
20
+ }));
21
+ };
22
+ var codeBlockKeymap = function codeBlockKeymap(_ref2) {
23
+ var view = _ref2.view,
24
+ getNode = _ref2.getNode,
25
+ getPos = _ref2.getPos,
26
+ selectCodeBlockNode = _ref2.selectCodeBlockNode,
27
+ onMaybeNodeSelection = _ref2.onMaybeNodeSelection;
28
+ return [{
29
+ key: 'ArrowUp',
30
+ run: function run(cm) {
31
+ return maybeEscapeKeymap({
32
+ unit: 'line',
33
+ dir: -1,
34
+ cm: cm,
35
+ view: view,
36
+ getNode: getNode,
37
+ getPos: getPos,
38
+ selectCodeBlockNode: selectCodeBlockNode,
39
+ onMaybeNodeSelection: onMaybeNodeSelection
40
+ });
41
+ }
42
+ }, {
43
+ key: 'ArrowLeft',
44
+ run: function run(cm) {
45
+ return maybeEscapeKeymap({
46
+ unit: 'char',
47
+ dir: -1,
48
+ cm: cm,
49
+ view: view,
50
+ getNode: getNode,
51
+ getPos: getPos,
52
+ selectCodeBlockNode: selectCodeBlockNode,
53
+ onMaybeNodeSelection: onMaybeNodeSelection
54
+ });
55
+ }
56
+ }, {
57
+ key: 'ArrowDown',
58
+ run: function run(cm) {
59
+ return maybeEscapeKeymap({
60
+ unit: 'line',
61
+ dir: 1,
62
+ cm: cm,
63
+ view: view,
64
+ getNode: getNode,
65
+ getPos: getPos,
66
+ selectCodeBlockNode: selectCodeBlockNode,
67
+ onMaybeNodeSelection: onMaybeNodeSelection
68
+ });
69
+ }
70
+ }, {
71
+ key: 'ArrowRight',
72
+ run: function run(cm) {
73
+ return maybeEscapeKeymap({
74
+ unit: 'char',
75
+ dir: 1,
76
+ cm: cm,
77
+ view: view,
78
+ getNode: getNode,
79
+ getPos: getPos,
80
+ selectCodeBlockNode: selectCodeBlockNode,
81
+ onMaybeNodeSelection: onMaybeNodeSelection
82
+ });
83
+ }
84
+ }, {
85
+ key: 'Ctrl-Enter',
86
+ run: function run() {
87
+ if (!exitCode(view.state, view.dispatch)) {
88
+ return false;
89
+ }
90
+ view.focus();
91
+ return true;
92
+ }
93
+ }, {
94
+ key: 'Ctrl-z',
95
+ mac: 'Cmd-z',
96
+ run: function run() {
97
+ return undo(view.state, view.dispatch);
98
+ }
99
+ }, {
100
+ key: 'Shift-Ctrl-z',
101
+ mac: 'Shift-Cmd-z',
102
+ run: function run() {
103
+ return redo(view.state, view.dispatch);
104
+ }
105
+ }, {
106
+ key: 'Ctrl-y',
107
+ mac: 'Cmd-y',
108
+ run: function run() {
109
+ return redo(view.state, view.dispatch);
110
+ }
111
+ }, {
112
+ key: 'Backspace',
113
+ run: function run(cm) {
114
+ return backspaceKeymap({
115
+ cm: cm,
116
+ view: view,
117
+ getNode: getNode,
118
+ getPos: getPos
119
+ });
120
+ }
121
+ }].concat(_toConsumableArray(defaultKeymap.concat(indentWithTab)));
122
+ };
@@ -0,0 +1,56 @@
1
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
+ import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
5
+ import { Selection } from '@atlaskit/editor-prosemirror/state';
6
+ export var maybeEscapeKeymap = function maybeEscapeKeymap(_ref) {
7
+ var _getPos;
8
+ var unit = _ref.unit,
9
+ dir = _ref.dir,
10
+ view = _ref.view,
11
+ cm = _ref.cm,
12
+ getPos = _ref.getPos,
13
+ getNode = _ref.getNode,
14
+ onMaybeNodeSelection = _ref.onMaybeNodeSelection,
15
+ selectCodeBlockNode = _ref.selectCodeBlockNode;
16
+ if (unit === 'char') {
17
+ onMaybeNodeSelection();
18
+ }
19
+ var node = getNode();
20
+ var state = cm.state;
21
+ var main = state.selection.main;
22
+ if (!main.empty) {
23
+ return false;
24
+ }
25
+ if (unit === 'line') {
26
+ main = _objectSpread(_objectSpread({}, state.doc.lineAt(main.head)), {}, {
27
+ head: 0,
28
+ empty: false
29
+ });
30
+ }
31
+ if (dir < 0 ? main.from > 0 : main.to < state.doc.length) {
32
+ return false;
33
+ }
34
+ var targetPos = ((_getPos = getPos === null || getPos === void 0 ? void 0 : getPos()) !== null && _getPos !== void 0 ? _getPos : 0) + (dir < 0 ? 0 : node.nodeSize);
35
+ if (unit === 'char') {
36
+ view.focus();
37
+ selectCodeBlockNode(dir === -1 ? RelativeSelectionPos.Start : RelativeSelectionPos.End);
38
+ return true;
39
+ } else {
40
+ createParagraphIfEndOfDoc(view, targetPos);
41
+ var tr = view.state.tr;
42
+ var selection = Selection.near(tr.doc.resolve(targetPos), dir);
43
+ tr.setSelection(selection).scrollIntoView();
44
+ view.dispatch(tr);
45
+ view.focus();
46
+ return true;
47
+ }
48
+ };
49
+ var createParagraphIfEndOfDoc = function createParagraphIfEndOfDoc(view, targetPos) {
50
+ if (targetPos === view.state.doc.content.size) {
51
+ var paragraph = view.state.schema.nodes.paragraph.createChecked({});
52
+ var tr = view.state.tr.insert(targetPos, paragraph);
53
+ // Note: we purposefully do a multi-dispatch here, otherwise we get stuck in codemirror
54
+ view.dispatch(tr);
55
+ }
56
+ };
@@ -0,0 +1,86 @@
1
+ import { LanguageDescription } from '@codemirror/language';
2
+ import { languages } from '@codemirror/language-data';
3
+ // getLanguageIdentifier defines `language.alias[0]`
4
+ export var mapLanguageToCodeMirror = function mapLanguageToCodeMirror(language) {
5
+ if (!language || language === 'none') {
6
+ return undefined;
7
+ }
8
+ switch (language) {
9
+ case 'coldfusion':
10
+ return languages.find(function (l) {
11
+ return l.name.toLowerCase() === 'xml';
12
+ });
13
+ case 'matlab':
14
+ return languages.find(function (l) {
15
+ return l.name.toLowerCase() === 'octave';
16
+ });
17
+ case 'javafx':
18
+ return languages.find(function (l) {
19
+ return l.name.toLowerCase() === 'java';
20
+ });
21
+ case 'vbnet':
22
+ return languages.find(function (l) {
23
+ return l.name === 'VB.NET';
24
+ });
25
+ case 'pas':
26
+ return languages.find(function (l) {
27
+ return l.name.toLowerCase() === 'pascal';
28
+ });
29
+ case 'cuda':
30
+ return languages.find(function (l) {
31
+ return l.name.toLowerCase() === 'c++';
32
+ });
33
+ case 'racket':
34
+ return languages.find(function (l) {
35
+ return l.name === 'Common Lisp';
36
+ });
37
+ case 'abap':
38
+ return languages.find(function (l) {
39
+ return l.name === 'SQL';
40
+ });
41
+ case 'standardmL':
42
+ return languages.find(function (l) {
43
+ return l.name === 'SML';
44
+ });
45
+ case 'objective-j':
46
+ return languages.find(function (l) {
47
+ return l.name === 'Objective-C';
48
+ });
49
+ case 'docker':
50
+ return languages.find(function (l) {
51
+ return l.name === 'Dockerfile';
52
+ });
53
+ case 'arduino':
54
+ return languages.find(function (l) {
55
+ return l.name === 'C++';
56
+ });
57
+ case 'visualbasic':
58
+ return languages.find(function (l) {
59
+ return l.name === 'VB.NET';
60
+ });
61
+ case 'elixir':
62
+ return LanguageDescription.of({
63
+ name: 'Elixir',
64
+ load: function load() {
65
+ return import( /* webpackChunkName: "@atlaskit-internal_@atlaskit/editor-plugin-code-block-advanced-lang-elixir" */
66
+ 'codemirror-lang-elixir').then(function (m) {
67
+ return m.elixir();
68
+ });
69
+ }
70
+ });
71
+ case 'graphql':
72
+ return LanguageDescription.of({
73
+ name: 'GraphQL',
74
+ load: function load() {
75
+ return import( /* webpackChunkName: "@atlaskit-internal_@atlaskit/editor-plugin-code-block-advanced-lang-graphql" */
76
+ 'cm6-graphql').then(function (m) {
77
+ return m.graphqlLanguageSupport();
78
+ });
79
+ }
80
+ });
81
+ default:
82
+ return languages.find(function (l) {
83
+ return l.alias.includes(language) || l.name.toLowerCase() === (language === null || language === void 0 ? void 0 : language.toLowerCase());
84
+ });
85
+ }
86
+ };
@@ -0,0 +1,44 @@
1
+ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
2
+ import _createClass from "@babel/runtime/helpers/createClass";
3
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
4
+ import { mapLanguageToCodeMirror } from './languageMap';
5
+
6
+ /**
7
+ * Manages loading the languages (for syntax highlighting, etc.)
8
+ * from CodeMirror and updating the language in the CodeMirror view
9
+ */
10
+ export var LanguageLoader = /*#__PURE__*/function () {
11
+ function LanguageLoader(updateLanguageCompartment) {
12
+ _classCallCheck(this, LanguageLoader);
13
+ _defineProperty(this, "languageName", '');
14
+ this.updateLanguageCompartment = updateLanguageCompartment;
15
+ }
16
+ return _createClass(LanguageLoader, [{
17
+ key: "updateLanguage",
18
+ value: function updateLanguage(languageName) {
19
+ var _this = this;
20
+ if (languageName === this.languageName) {
21
+ return;
22
+ }
23
+ var language = mapLanguageToCodeMirror(languageName);
24
+ var configureEmpty = function configureEmpty() {
25
+ _this.updateLanguageCompartment([]);
26
+ _this.languageName = '';
27
+ };
28
+ if (!language) {
29
+ configureEmpty();
30
+ return;
31
+ }
32
+ language.load().then(function (lang) {
33
+ if (lang) {
34
+ _this.updateLanguageCompartment(lang);
35
+ _this.languageName = languageName;
36
+ } else {
37
+ configureEmpty();
38
+ }
39
+ }).catch(function () {
40
+ configureEmpty();
41
+ });
42
+ }
43
+ }]);
44
+ }();
@@ -0,0 +1,17 @@
1
+ import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
2
+ export var lazyCodeBlockView = function lazyCodeBlockView(props) {
3
+ return withLazyLoading({
4
+ nodeName: 'codeBlock',
5
+ getNodeViewOptions: function getNodeViewOptions() {},
6
+ loader: function loader() {
7
+ var result = import( /* webpackChunkName: "@atlaskit-internal_editor-plugin-code-block-advanced-nodeview" */
8
+ './codeBlockAdvanced').then(function (_ref) {
9
+ var getCodeBlockAdvancedNodeView = _ref.getCodeBlockAdvancedNodeView;
10
+ return function (node, view, getPos) {
11
+ return getCodeBlockAdvancedNodeView(props)(node, view, getPos);
12
+ };
13
+ });
14
+ return result;
15
+ }
16
+ });
17
+ };
@@ -0,0 +1,11 @@
1
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
+ import { lazyCodeBlockView } from '../nodeviews/lazyCodeBlockAdvanced';
3
+ export var createPlugin = function createPlugin(props) {
4
+ return new SafePlugin({
5
+ props: {
6
+ nodeViews: {
7
+ codeBlock: lazyCodeBlockView(props)
8
+ }
9
+ }
10
+ });
11
+ };
@@ -0,0 +1,70 @@
1
+ import { HighlightStyle } from '@codemirror/language';
2
+ import { tags } from '@lezer/highlight';
3
+ // Based on `platform/packages/design-system/code/src/internal/theme/styles.tsx`
4
+ export var highlightStyle = HighlightStyle.define([{
5
+ tag: tags.meta,
6
+ color: "var(--ds-text, #172B4D)"
7
+ }, {
8
+ tag: tags.link,
9
+ textDecoration: 'underline'
10
+ }, {
11
+ tag: tags.heading,
12
+ textDecoration: 'underline',
13
+ // Custom syntax styling to match existing styling
14
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
15
+ fontWeight: "var(--ds-font-weight-bold, 700)"
16
+ }, {
17
+ tag: tags.emphasis,
18
+ fontStyle: 'italic'
19
+ }, {
20
+ tag: tags.strong,
21
+ // Custom syntax styling to match existing styling
22
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
23
+ fontWeight: "var(--ds-font-weight-bold, 700)"
24
+ }, {
25
+ tag: tags.strikethrough,
26
+ textDecoration: 'line-through'
27
+ }, {
28
+ tag: tags.keyword,
29
+ color: "var(--ds-text-accent-blue, #0055CC)",
30
+ // Custom syntax styling to match existing styling
31
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
32
+ fontWeight: "var(--ds-font-weight-bold, 700)"
33
+ }, {
34
+ tag: [tags.atom, tags.bool, tags.url, tags.contentSeparator, tags.labelName],
35
+ color: "var(--ds-text-accent-blue, #0055CC)"
36
+ }, {
37
+ tag: [tags.literal, tags.inserted],
38
+ color: "var(--ds-text-accent-blue, #0055CC)"
39
+ }, {
40
+ tag: [tags.string, tags.deleted],
41
+ color: "var(--ds-text-accent-green, #216E4E)"
42
+ }, {
43
+ tag: [tags.regexp, tags.escape, tags.special(tags.string)],
44
+ color: "var(--ds-text, #172B4D)"
45
+ }, {
46
+ tag: tags.definition(tags.variableName),
47
+ color: "var(--ds-text, #172B4D)"
48
+ }, {
49
+ tag: tags.local(tags.variableName),
50
+ color: "var(--ds-text, #172B4D)"
51
+ }, {
52
+ tag: [tags.typeName, tags.namespace],
53
+ color: "var(--ds-text-accent-blue, #0055CC)"
54
+ }, {
55
+ tag: tags.className,
56
+ color: "var(--ds-text-accent-purple, #5E4DB2)"
57
+ }, {
58
+ tag: [tags.special(tags.variableName), tags.macroName],
59
+ color: "var(--ds-text, #172B4D)"
60
+ }, {
61
+ tag: tags.definition(tags.propertyName),
62
+ color: "var(--ds-text, #172B4D)"
63
+ }, {
64
+ tag: tags.comment,
65
+ color: "var(--ds-text-subtlest, #626F86)",
66
+ fontStyle: 'italic'
67
+ }, {
68
+ tag: tags.invalid,
69
+ color: "var(--ds-text, #172B4D)"
70
+ }]);
@@ -0,0 +1,49 @@
1
+ import { EditorView as CodeMirror } from '@codemirror/view';
2
+ export var cmTheme = CodeMirror.theme({
3
+ '&': {
4
+ backgroundColor: "var(--ds-background-neutral, #091E420F)",
5
+ padding: '0',
6
+ marginTop: "var(--ds-space-100, 8px)",
7
+ marginBottom: "var(--ds-space-100, 8px)",
8
+ borderRadius: "var(--ds-border-radius, 4px)",
9
+ fontSize: '0.875rem',
10
+ // Custom syntax styling to match existing styling
11
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
12
+ lineHeight: '1.5rem'
13
+ },
14
+ '&.cm-focused': {
15
+ outline: 'none'
16
+ },
17
+ '.cm-line': {
18
+ padding: '0'
19
+ },
20
+ '&.cm-editor.code-block.danger': {
21
+ backgroundColor: "var(--ds-background-danger, #FFECEB)"
22
+ },
23
+ '.cm-content': {
24
+ cursor: 'text',
25
+ caretColor: "var(--ds-text, #172B4D)",
26
+ margin: "var(--ds-space-100, 8px)",
27
+ padding: "var(--ds-space-0, 0px)"
28
+ },
29
+ '.cm-scroller': {
30
+ backgroundColor: "var(--ds-background-neutral, #091E420F)",
31
+ // Custom syntax styling to match existing styling
32
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
33
+ lineHeight: 'unset',
34
+ fontFamily: "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)"
35
+ },
36
+ '&.cm-focused .cm-cursor': {
37
+ borderLeftColor: "var(--ds-text, #172B4D)"
38
+ },
39
+ '.cm-gutters': {
40
+ backgroundColor: "var(--ds-background-neutral, #091E420F)",
41
+ border: 'none',
42
+ padding: "var(--ds-space-100, 8px)"
43
+ },
44
+ '.cm-lineNumbers .cm-gutterElement': {
45
+ paddingLeft: "var(--ds-space-0, 0px)",
46
+ paddingRight: "var(--ds-space-0, 0px)",
47
+ minWidth: 'unset'
48
+ }
49
+ });
@@ -0,0 +1,2 @@
1
+ import type { CodeBlockAdvancedPlugin } from './codeBlockAdvancedPluginType';
2
+ export declare const codeBlockAdvancedPlugin: CodeBlockAdvancedPlugin;
@@ -0,0 +1,11 @@
1
+ import type { Extension } from '@codemirror/state';
2
+ import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
3
+ import type { CodeBlockPlugin } from '@atlaskit/editor-plugin-code-block';
4
+ import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
5
+ import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
6
+ export type CodeBlockAdvancedPlugin = NextEditorPlugin<'codeBlockAdvanced', {
7
+ dependencies: [CodeBlockPlugin, SelectionPlugin, OptionalPlugin<EditorDisabledPlugin>];
8
+ pluginConfiguration: {
9
+ extensions?: Extension[];
10
+ } | undefined;
11
+ }>;
@@ -0,0 +1,2 @@
1
+ export { codeBlockAdvancedPlugin } from './codeBlockAdvancedPlugin';
2
+ export type { CodeBlockAdvancedPlugin } from './codeBlockAdvancedPluginType';
@@ -0,0 +1,38 @@
1
+ import { Extension } from '@codemirror/state';
2
+ import { ViewUpdate } from '@codemirror/view';
3
+ import type { getPosHandler, getPosHandlerNode, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
+ import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
5
+ import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
6
+ import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
7
+ interface ConfigProps {
8
+ api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
9
+ extensions: Extension[];
10
+ }
11
+ declare class CodeBlockAdvancedNodeView implements NodeView {
12
+ dom: Node;
13
+ private updating;
14
+ private view;
15
+ private lineWrappingCompartment;
16
+ private languageCompartment;
17
+ private readOnlyCompartment;
18
+ private node;
19
+ private getPos;
20
+ private cm;
21
+ private selectionAPI;
22
+ private maybeTryingToReachNodeSelection;
23
+ private cleanupDisabledState;
24
+ private languageLoader;
25
+ constructor(node: PMNode, view: EditorView, getPos: getPosHandlerNode, config: ConfigProps);
26
+ destroy(): void;
27
+ forwardUpdate(update: ViewUpdate): void;
28
+ setSelection(anchor: number, head: number): void;
29
+ private updateReadonlyState;
30
+ private updateLanguage;
31
+ private selectCodeBlockNode;
32
+ private wordWrappingEnabled;
33
+ private updateWordWrap;
34
+ update(node: PMNode): boolean;
35
+ stopEvent(e: Event): boolean;
36
+ }
37
+ export declare const getCodeBlockAdvancedNodeView: (props: ConfigProps) => (node: PMNode, view: EditorView, getPos: getPosHandler) => CodeBlockAdvancedNodeView;
38
+ export {};
@@ -0,0 +1,2 @@
1
+ import type { NodeSpec } from '@atlaskit/editor-prosemirror/model';
2
+ export declare const codeBlockNodeWithFixedToDOM: () => NodeSpec;
@@ -0,0 +1,17 @@
1
+ import { ViewUpdate } from '@codemirror/view';
2
+ import { EditorView } from '@atlaskit/editor-prosemirror/view';
3
+ interface Props {
4
+ view: EditorView;
5
+ update: ViewUpdate;
6
+ offset: number;
7
+ }
8
+ /**
9
+ *
10
+ * Synchronises the CodeMirror update changes with the Prosemirror editor
11
+ *
12
+ * @param props.view EditorView - Prosemirror EditorView
13
+ * @param props.update ViewUpdate - CodeMirror ViewUpdate
14
+ * @param props.offset number - position where the code block starts in prosemirror
15
+ */
16
+ export declare const syncCMWithPM: ({ view, update, offset }: Props) => void;
17
+ export {};
@@ -0,0 +1,11 @@
1
+ import { TransactionSpec as CMTransactionSpec } from '@codemirror/state';
2
+ /**
3
+ *
4
+ * Compares the updated text with the current to determine the transaction to fire
5
+ * in the CodeMirror editor.
6
+ *
7
+ * @param curText string - the current CodeMirror text
8
+ * @param newText string - the new CodeMirror text
9
+ * @param updateCallback Callback to process the CodeMirror transaction
10
+ */
11
+ export declare const updateCMSelection: (curText: string, newText: string, updateCallback: (value: CMTransactionSpec) => void) => void;
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Code based on warning from @atlaskit/code
3
+ */
4
+ import { ViewPlugin, ViewUpdate, DecorationSet } from '@codemirror/view';
5
+ export declare const bidiCharWarningExtension: ViewPlugin<{
6
+ placeholders: DecorationSet;
7
+ update(update: ViewUpdate): void;
8
+ }>;
@@ -0,0 +1,12 @@
1
+ import { EditorView as CodeMirror } from '@codemirror/view';
2
+ import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
3
+ import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
4
+ import { EditorView } from '@atlaskit/editor-prosemirror/view';
5
+ interface BackspaceProps {
6
+ view: EditorView;
7
+ cm: CodeMirror;
8
+ getPos: getPosHandlerNode;
9
+ getNode: () => PMNode;
10
+ }
11
+ export declare const backspaceKeymap: ({ cm, view, getPos, getNode }: BackspaceProps) => boolean;
12
+ export {};
@@ -0,0 +1,14 @@
1
+ import { Extension } from '@codemirror/state';
2
+ import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
3
+ import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
4
+ import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
5
+ import { EditorView } from '@atlaskit/editor-prosemirror/view';
6
+ interface KeymapProps {
7
+ view: EditorView;
8
+ getNode: () => PMNode;
9
+ getPos: getPosHandlerNode;
10
+ selectCodeBlockNode: (relativeSelectionPos: RelativeSelectionPos | undefined) => void;
11
+ onMaybeNodeSelection: () => void;
12
+ }
13
+ export declare const keymapExtension: ({ view, getNode, getPos, selectCodeBlockNode, onMaybeNodeSelection, }: KeymapProps) => Extension;
14
+ export {};
@@ -0,0 +1,17 @@
1
+ import { EditorView as CodeMirror } from '@codemirror/view';
2
+ import { RelativeSelectionPos } from '@atlaskit/editor-common/selection';
3
+ import type { getPosHandlerNode } from '@atlaskit/editor-common/types';
4
+ import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
5
+ import { EditorView } from '@atlaskit/editor-prosemirror/view';
6
+ interface MaybeEscapeProps {
7
+ unit: 'line' | 'char';
8
+ dir: -1 | 1;
9
+ view: EditorView;
10
+ cm: CodeMirror;
11
+ getPos: getPosHandlerNode;
12
+ getNode: () => PMNode;
13
+ onMaybeNodeSelection: () => void;
14
+ selectCodeBlockNode: (relativeSelectionPos: RelativeSelectionPos | undefined) => void;
15
+ }
16
+ export declare const maybeEscapeKeymap: ({ unit, dir, view, cm, getPos, getNode, onMaybeNodeSelection, selectCodeBlockNode, }: MaybeEscapeProps) => boolean;
17
+ export {};
@@ -0,0 +1,5 @@
1
+ import { LanguageDescription } from '@codemirror/language';
2
+ import type { LanguageAlias } from '@atlaskit/code';
3
+ type LanguageAliasValue = LanguageAlias[0];
4
+ export declare const mapLanguageToCodeMirror: (language: LanguageAliasValue) => LanguageDescription | undefined;
5
+ export {};
@@ -0,0 +1,11 @@
1
+ import { LanguageSupport } from '@codemirror/language';
2
+ /**
3
+ * Manages loading the languages (for syntax highlighting, etc.)
4
+ * from CodeMirror and updating the language in the CodeMirror view
5
+ */
6
+ export declare class LanguageLoader {
7
+ private updateLanguageCompartment;
8
+ private languageName;
9
+ constructor(updateLanguageCompartment: (value: LanguageSupport | []) => void);
10
+ updateLanguage(languageName: string): void;
11
+ }
@@ -0,0 +1,9 @@
1
+ import { Extension } from '@codemirror/state';
2
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
+ import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
4
+ interface Props {
5
+ api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
6
+ extensions: Extension[];
7
+ }
8
+ export declare const lazyCodeBlockView: (props: Props) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;
9
+ export {};
@@ -0,0 +1,10 @@
1
+ import type { Extension } from '@codemirror/state';
2
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
3
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
+ import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
5
+ interface Props {
6
+ api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
7
+ extensions: Extension[];
8
+ }
9
+ export declare const createPlugin: (props: Props) => SafePlugin<any>;
10
+ export {};
@@ -0,0 +1,2 @@
1
+ import { HighlightStyle } from '@codemirror/language';
2
+ export declare const highlightStyle: HighlightStyle;
@@ -0,0 +1 @@
1
+ export declare const cmTheme: import("@codemirror/state").Extension;
@@ -0,0 +1,2 @@
1
+ import type { CodeBlockAdvancedPlugin } from './codeBlockAdvancedPluginType';
2
+ export declare const codeBlockAdvancedPlugin: CodeBlockAdvancedPlugin;