@tiptap/extension-code-block 2.0.0-beta.33 → 2.0.0-beta.34
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/dist/packages/extension-code-block/src/code-block.d.ts +17 -0
- package/dist/tiptap-extension-code-block.cjs.js +10 -2
- package/dist/tiptap-extension-code-block.cjs.js.map +1 -1
- package/dist/tiptap-extension-code-block.esm.js +10 -2
- package/dist/tiptap-extension-code-block.esm.js.map +1 -1
- package/dist/tiptap-extension-code-block.umd.js +10 -2
- package/dist/tiptap-extension-code-block.umd.js.map +1 -1
- package/package.json +2 -2
- package/src/code-block.ts +29 -2
|
@@ -1,6 +1,23 @@
|
|
|
1
1
|
import { Node } from '@tiptap/core';
|
|
2
2
|
export interface CodeBlockOptions {
|
|
3
|
+
/**
|
|
4
|
+
* Adds a prefix to language classes that are applied to code tags.
|
|
5
|
+
* Defaults to `'language-'`.
|
|
6
|
+
*/
|
|
3
7
|
languageClassPrefix: string;
|
|
8
|
+
/**
|
|
9
|
+
* Define whether the node should be exited on triple enter.
|
|
10
|
+
* Defaults to `true`.
|
|
11
|
+
*/
|
|
12
|
+
exitOnTripleEnter: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Define whether the node should be exited on arrow down if there is no node after it.
|
|
15
|
+
* Defaults to `true`.
|
|
16
|
+
*/
|
|
17
|
+
exitOnArrowDown: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* Custom HTML attributes that should be added to the rendered HTML tag.
|
|
20
|
+
*/
|
|
4
21
|
HTMLAttributes: Record<string, any>;
|
|
5
22
|
}
|
|
6
23
|
declare module '@tiptap/core' {
|
|
@@ -12,6 +12,8 @@ const CodeBlock = core.Node.create({
|
|
|
12
12
|
addOptions() {
|
|
13
13
|
return {
|
|
14
14
|
languageClassPrefix: 'language-',
|
|
15
|
+
exitOnTripleEnter: true,
|
|
16
|
+
exitOnArrowDown: true,
|
|
15
17
|
HTMLAttributes: {},
|
|
16
18
|
};
|
|
17
19
|
},
|
|
@@ -84,8 +86,11 @@ const CodeBlock = core.Node.create({
|
|
|
84
86
|
}
|
|
85
87
|
return false;
|
|
86
88
|
},
|
|
87
|
-
//
|
|
89
|
+
// exit node on triple enter
|
|
88
90
|
Enter: ({ editor }) => {
|
|
91
|
+
if (!this.options.exitOnTripleEnter) {
|
|
92
|
+
return false;
|
|
93
|
+
}
|
|
89
94
|
const { state } = editor;
|
|
90
95
|
const { selection } = state;
|
|
91
96
|
const { $from, empty } = selection;
|
|
@@ -106,8 +111,11 @@ const CodeBlock = core.Node.create({
|
|
|
106
111
|
.exitCode()
|
|
107
112
|
.run();
|
|
108
113
|
},
|
|
109
|
-
//
|
|
114
|
+
// exit node on arrow down
|
|
110
115
|
ArrowDown: ({ editor }) => {
|
|
116
|
+
if (!this.options.exitOnArrowDown) {
|
|
117
|
+
return false;
|
|
118
|
+
}
|
|
111
119
|
const { state } = editor;
|
|
112
120
|
const { selection, doc } = state;
|
|
113
121
|
const { $from, empty } = selection;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tiptap-extension-code-block.cjs.js","sources":["../src/code-block.ts"],"sourcesContent":["import { Node, textblockTypeInputRule } from '@tiptap/core'\nimport { Plugin, PluginKey, TextSelection } from 'prosemirror-state'\n\nexport interface CodeBlockOptions {\n languageClassPrefix: string,\n HTMLAttributes: Record<string, any>,\n}\n\ndeclare module '@tiptap/core' {\n interface Commands<ReturnType> {\n codeBlock: {\n /**\n * Set a code block\n */\n setCodeBlock: (attributes?: { language: string }) => ReturnType,\n /**\n * Toggle a code block\n */\n toggleCodeBlock: (attributes?: { language: string }) => ReturnType,\n }\n }\n}\n\nexport const backtickInputRegex = /^```(?<language>[a-z]*)?[\\s\\n]$/\nexport const tildeInputRegex = /^~~~(?<language>[a-z]*)?[\\s\\n]$/\n\nexport const CodeBlock = Node.create<CodeBlockOptions>({\n name: 'codeBlock',\n\n addOptions() {\n return {\n languageClassPrefix: 'language-',\n HTMLAttributes: {},\n }\n },\n\n content: 'text*',\n\n marks: '',\n\n group: 'block',\n\n code: true,\n\n defining: true,\n\n addAttributes() {\n return {\n language: {\n default: null,\n parseHTML: element => {\n const { languageClassPrefix } = this.options\n const classNames = [...element.firstElementChild?.classList || []]\n const languages = classNames\n .filter(className => className.startsWith(languageClassPrefix))\n .map(className => className.replace(languageClassPrefix, ''))\n const language = languages[0]\n\n if (!language) {\n return null\n }\n\n return language\n },\n renderHTML: attributes => {\n if (!attributes.language) {\n return null\n }\n\n return {\n class: this.options.languageClassPrefix + attributes.language,\n }\n },\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'pre',\n preserveWhitespace: 'full',\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['pre', this.options.HTMLAttributes, ['code', HTMLAttributes, 0]]\n },\n\n addCommands() {\n return {\n setCodeBlock: attributes => ({ commands }) => {\n return commands.setNode(this.name, attributes)\n },\n toggleCodeBlock: attributes => ({ commands }) => {\n return commands.toggleNode(this.name, 'paragraph', attributes)\n },\n }\n },\n\n addKeyboardShortcuts() {\n return {\n 'Mod-Alt-c': () => this.editor.commands.toggleCodeBlock(),\n\n // remove code block when at start of document or code block is empty\n Backspace: () => {\n const { empty, $anchor } = this.editor.state.selection\n const isAtStart = $anchor.pos === 1\n\n if (!empty || $anchor.parent.type.name !== this.name) {\n return false\n }\n\n if (isAtStart || !$anchor.parent.textContent.length) {\n return this.editor.commands.clearNodes()\n }\n\n return false\n },\n\n // escape node on triple enter\n Enter: ({ editor }) => {\n const { state } = editor\n const { selection } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n const endsWithDoubleNewline = $from.parent.textContent.endsWith('\\n\\n')\n\n if (!isAtEnd || !endsWithDoubleNewline) {\n return false\n }\n\n return editor\n .chain()\n .command(({ tr }) => {\n tr.delete($from.pos - 2, $from.pos)\n\n return true\n })\n .exitCode()\n .run()\n },\n\n // escape node on arrow down\n ArrowDown: ({ editor }) => {\n const { state } = editor\n const { selection, doc } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n\n if (!isAtEnd) {\n return false\n }\n\n const after = $from.after()\n\n if (after === undefined) {\n return false\n }\n\n const nodeAfter = doc.nodeAt(after)\n\n if (nodeAfter) {\n return false\n }\n\n return editor.commands.exitCode()\n },\n }\n },\n\n addInputRules() {\n return [\n textblockTypeInputRule({\n find: backtickInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n textblockTypeInputRule({\n find: tildeInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n ]\n },\n\n addProseMirrorPlugins() {\n return [\n // this plugin creates a code block for pasted content from VS Code\n // we can also detect the copied code language\n new Plugin({\n key: new PluginKey('codeBlockVSCodeHandler'),\n props: {\n handlePaste: (view, event) => {\n if (!event.clipboardData) {\n return false\n }\n\n // don’t create a new code block within code blocks\n if (this.editor.isActive(this.type.name)) {\n return false\n }\n\n const text = event.clipboardData.getData('text/plain')\n const vscode = event.clipboardData.getData('vscode-editor-data')\n const vscodeData = vscode\n ? JSON.parse(vscode)\n : undefined\n const language = vscodeData?.mode\n\n if (!text || !language) {\n return false\n }\n\n const { tr } = view.state\n\n // create an empty code block\n tr.replaceSelectionWith(this.type.create({ language }))\n\n // put cursor inside the newly created code block\n tr.setSelection(TextSelection.near(tr.doc.resolve(Math.max(0, tr.selection.from - 2))))\n\n // add text to code block\n // strip carriage return chars from text pasted as code\n // see: https://github.com/ProseMirror/prosemirror-view/commit/a50a6bcceb4ce52ac8fcc6162488d8875613aacd\n tr.insertText(text.replace(/\\r\\n?/g, '\\n'))\n\n // store meta information\n // this is useful for other plugins that depends on the paste event\n // like the paste rule plugin\n tr.setMeta('paste', true)\n\n view.dispatch(tr)\n\n return true\n },\n },\n }),\n ]\n },\n})\n"],"names":["Node","textblockTypeInputRule","Plugin","PluginKey","TextSelection"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tiptap-extension-code-block.cjs.js","sources":["../src/code-block.ts"],"sourcesContent":["import { Node, textblockTypeInputRule } from '@tiptap/core'\nimport { Plugin, PluginKey, TextSelection } from 'prosemirror-state'\n\nexport interface CodeBlockOptions {\n /**\n * Adds a prefix to language classes that are applied to code tags.\n * Defaults to `'language-'`.\n */\n languageClassPrefix: string,\n /**\n * Define whether the node should be exited on triple enter.\n * Defaults to `true`.\n */\n exitOnTripleEnter: boolean,\n /**\n * Define whether the node should be exited on arrow down if there is no node after it.\n * Defaults to `true`.\n */\n exitOnArrowDown: boolean,\n /**\n * Custom HTML attributes that should be added to the rendered HTML tag.\n */\n HTMLAttributes: Record<string, any>,\n}\n\ndeclare module '@tiptap/core' {\n interface Commands<ReturnType> {\n codeBlock: {\n /**\n * Set a code block\n */\n setCodeBlock: (attributes?: { language: string }) => ReturnType,\n /**\n * Toggle a code block\n */\n toggleCodeBlock: (attributes?: { language: string }) => ReturnType,\n }\n }\n}\n\nexport const backtickInputRegex = /^```(?<language>[a-z]*)?[\\s\\n]$/\nexport const tildeInputRegex = /^~~~(?<language>[a-z]*)?[\\s\\n]$/\n\nexport const CodeBlock = Node.create<CodeBlockOptions>({\n name: 'codeBlock',\n\n addOptions() {\n return {\n languageClassPrefix: 'language-',\n exitOnTripleEnter: true,\n exitOnArrowDown: true,\n HTMLAttributes: {},\n }\n },\n\n content: 'text*',\n\n marks: '',\n\n group: 'block',\n\n code: true,\n\n defining: true,\n\n addAttributes() {\n return {\n language: {\n default: null,\n parseHTML: element => {\n const { languageClassPrefix } = this.options\n const classNames = [...element.firstElementChild?.classList || []]\n const languages = classNames\n .filter(className => className.startsWith(languageClassPrefix))\n .map(className => className.replace(languageClassPrefix, ''))\n const language = languages[0]\n\n if (!language) {\n return null\n }\n\n return language\n },\n renderHTML: attributes => {\n if (!attributes.language) {\n return null\n }\n\n return {\n class: this.options.languageClassPrefix + attributes.language,\n }\n },\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'pre',\n preserveWhitespace: 'full',\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['pre', this.options.HTMLAttributes, ['code', HTMLAttributes, 0]]\n },\n\n addCommands() {\n return {\n setCodeBlock: attributes => ({ commands }) => {\n return commands.setNode(this.name, attributes)\n },\n toggleCodeBlock: attributes => ({ commands }) => {\n return commands.toggleNode(this.name, 'paragraph', attributes)\n },\n }\n },\n\n addKeyboardShortcuts() {\n return {\n 'Mod-Alt-c': () => this.editor.commands.toggleCodeBlock(),\n\n // remove code block when at start of document or code block is empty\n Backspace: () => {\n const { empty, $anchor } = this.editor.state.selection\n const isAtStart = $anchor.pos === 1\n\n if (!empty || $anchor.parent.type.name !== this.name) {\n return false\n }\n\n if (isAtStart || !$anchor.parent.textContent.length) {\n return this.editor.commands.clearNodes()\n }\n\n return false\n },\n\n // exit node on triple enter\n Enter: ({ editor }) => {\n if (!this.options.exitOnTripleEnter) {\n return false\n }\n\n const { state } = editor\n const { selection } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n const endsWithDoubleNewline = $from.parent.textContent.endsWith('\\n\\n')\n\n if (!isAtEnd || !endsWithDoubleNewline) {\n return false\n }\n\n return editor\n .chain()\n .command(({ tr }) => {\n tr.delete($from.pos - 2, $from.pos)\n\n return true\n })\n .exitCode()\n .run()\n },\n\n // exit node on arrow down\n ArrowDown: ({ editor }) => {\n if (!this.options.exitOnArrowDown) {\n return false\n }\n\n const { state } = editor\n const { selection, doc } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n\n if (!isAtEnd) {\n return false\n }\n\n const after = $from.after()\n\n if (after === undefined) {\n return false\n }\n\n const nodeAfter = doc.nodeAt(after)\n\n if (nodeAfter) {\n return false\n }\n\n return editor.commands.exitCode()\n },\n }\n },\n\n addInputRules() {\n return [\n textblockTypeInputRule({\n find: backtickInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n textblockTypeInputRule({\n find: tildeInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n ]\n },\n\n addProseMirrorPlugins() {\n return [\n // this plugin creates a code block for pasted content from VS Code\n // we can also detect the copied code language\n new Plugin({\n key: new PluginKey('codeBlockVSCodeHandler'),\n props: {\n handlePaste: (view, event) => {\n if (!event.clipboardData) {\n return false\n }\n\n // don’t create a new code block within code blocks\n if (this.editor.isActive(this.type.name)) {\n return false\n }\n\n const text = event.clipboardData.getData('text/plain')\n const vscode = event.clipboardData.getData('vscode-editor-data')\n const vscodeData = vscode\n ? JSON.parse(vscode)\n : undefined\n const language = vscodeData?.mode\n\n if (!text || !language) {\n return false\n }\n\n const { tr } = view.state\n\n // create an empty code block\n tr.replaceSelectionWith(this.type.create({ language }))\n\n // put cursor inside the newly created code block\n tr.setSelection(TextSelection.near(tr.doc.resolve(Math.max(0, tr.selection.from - 2))))\n\n // add text to code block\n // strip carriage return chars from text pasted as code\n // see: https://github.com/ProseMirror/prosemirror-view/commit/a50a6bcceb4ce52ac8fcc6162488d8875613aacd\n tr.insertText(text.replace(/\\r\\n?/g, '\\n'))\n\n // store meta information\n // this is useful for other plugins that depends on the paste event\n // like the paste rule plugin\n tr.setMeta('paste', true)\n\n view.dispatch(tr)\n\n return true\n },\n },\n }),\n ]\n },\n})\n"],"names":["Node","textblockTypeInputRule","Plugin","PluginKey","TextSelection"],"mappings":"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"}
|
|
@@ -8,6 +8,8 @@ const CodeBlock = Node.create({
|
|
|
8
8
|
addOptions() {
|
|
9
9
|
return {
|
|
10
10
|
languageClassPrefix: 'language-',
|
|
11
|
+
exitOnTripleEnter: true,
|
|
12
|
+
exitOnArrowDown: true,
|
|
11
13
|
HTMLAttributes: {},
|
|
12
14
|
};
|
|
13
15
|
},
|
|
@@ -80,8 +82,11 @@ const CodeBlock = Node.create({
|
|
|
80
82
|
}
|
|
81
83
|
return false;
|
|
82
84
|
},
|
|
83
|
-
//
|
|
85
|
+
// exit node on triple enter
|
|
84
86
|
Enter: ({ editor }) => {
|
|
87
|
+
if (!this.options.exitOnTripleEnter) {
|
|
88
|
+
return false;
|
|
89
|
+
}
|
|
85
90
|
const { state } = editor;
|
|
86
91
|
const { selection } = state;
|
|
87
92
|
const { $from, empty } = selection;
|
|
@@ -102,8 +107,11 @@ const CodeBlock = Node.create({
|
|
|
102
107
|
.exitCode()
|
|
103
108
|
.run();
|
|
104
109
|
},
|
|
105
|
-
//
|
|
110
|
+
// exit node on arrow down
|
|
106
111
|
ArrowDown: ({ editor }) => {
|
|
112
|
+
if (!this.options.exitOnArrowDown) {
|
|
113
|
+
return false;
|
|
114
|
+
}
|
|
107
115
|
const { state } = editor;
|
|
108
116
|
const { selection, doc } = state;
|
|
109
117
|
const { $from, empty } = selection;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tiptap-extension-code-block.esm.js","sources":["../src/code-block.ts"],"sourcesContent":["import { Node, textblockTypeInputRule } from '@tiptap/core'\nimport { Plugin, PluginKey, TextSelection } from 'prosemirror-state'\n\nexport interface CodeBlockOptions {\n languageClassPrefix: string,\n HTMLAttributes: Record<string, any>,\n}\n\ndeclare module '@tiptap/core' {\n interface Commands<ReturnType> {\n codeBlock: {\n /**\n * Set a code block\n */\n setCodeBlock: (attributes?: { language: string }) => ReturnType,\n /**\n * Toggle a code block\n */\n toggleCodeBlock: (attributes?: { language: string }) => ReturnType,\n }\n }\n}\n\nexport const backtickInputRegex = /^```(?<language>[a-z]*)?[\\s\\n]$/\nexport const tildeInputRegex = /^~~~(?<language>[a-z]*)?[\\s\\n]$/\n\nexport const CodeBlock = Node.create<CodeBlockOptions>({\n name: 'codeBlock',\n\n addOptions() {\n return {\n languageClassPrefix: 'language-',\n HTMLAttributes: {},\n }\n },\n\n content: 'text*',\n\n marks: '',\n\n group: 'block',\n\n code: true,\n\n defining: true,\n\n addAttributes() {\n return {\n language: {\n default: null,\n parseHTML: element => {\n const { languageClassPrefix } = this.options\n const classNames = [...element.firstElementChild?.classList || []]\n const languages = classNames\n .filter(className => className.startsWith(languageClassPrefix))\n .map(className => className.replace(languageClassPrefix, ''))\n const language = languages[0]\n\n if (!language) {\n return null\n }\n\n return language\n },\n renderHTML: attributes => {\n if (!attributes.language) {\n return null\n }\n\n return {\n class: this.options.languageClassPrefix + attributes.language,\n }\n },\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'pre',\n preserveWhitespace: 'full',\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['pre', this.options.HTMLAttributes, ['code', HTMLAttributes, 0]]\n },\n\n addCommands() {\n return {\n setCodeBlock: attributes => ({ commands }) => {\n return commands.setNode(this.name, attributes)\n },\n toggleCodeBlock: attributes => ({ commands }) => {\n return commands.toggleNode(this.name, 'paragraph', attributes)\n },\n }\n },\n\n addKeyboardShortcuts() {\n return {\n 'Mod-Alt-c': () => this.editor.commands.toggleCodeBlock(),\n\n // remove code block when at start of document or code block is empty\n Backspace: () => {\n const { empty, $anchor } = this.editor.state.selection\n const isAtStart = $anchor.pos === 1\n\n if (!empty || $anchor.parent.type.name !== this.name) {\n return false\n }\n\n if (isAtStart || !$anchor.parent.textContent.length) {\n return this.editor.commands.clearNodes()\n }\n\n return false\n },\n\n // escape node on triple enter\n Enter: ({ editor }) => {\n const { state } = editor\n const { selection } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n const endsWithDoubleNewline = $from.parent.textContent.endsWith('\\n\\n')\n\n if (!isAtEnd || !endsWithDoubleNewline) {\n return false\n }\n\n return editor\n .chain()\n .command(({ tr }) => {\n tr.delete($from.pos - 2, $from.pos)\n\n return true\n })\n .exitCode()\n .run()\n },\n\n // escape node on arrow down\n ArrowDown: ({ editor }) => {\n const { state } = editor\n const { selection, doc } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n\n if (!isAtEnd) {\n return false\n }\n\n const after = $from.after()\n\n if (after === undefined) {\n return false\n }\n\n const nodeAfter = doc.nodeAt(after)\n\n if (nodeAfter) {\n return false\n }\n\n return editor.commands.exitCode()\n },\n }\n },\n\n addInputRules() {\n return [\n textblockTypeInputRule({\n find: backtickInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n textblockTypeInputRule({\n find: tildeInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n ]\n },\n\n addProseMirrorPlugins() {\n return [\n // this plugin creates a code block for pasted content from VS Code\n // we can also detect the copied code language\n new Plugin({\n key: new PluginKey('codeBlockVSCodeHandler'),\n props: {\n handlePaste: (view, event) => {\n if (!event.clipboardData) {\n return false\n }\n\n // don’t create a new code block within code blocks\n if (this.editor.isActive(this.type.name)) {\n return false\n }\n\n const text = event.clipboardData.getData('text/plain')\n const vscode = event.clipboardData.getData('vscode-editor-data')\n const vscodeData = vscode\n ? JSON.parse(vscode)\n : undefined\n const language = vscodeData?.mode\n\n if (!text || !language) {\n return false\n }\n\n const { tr } = view.state\n\n // create an empty code block\n tr.replaceSelectionWith(this.type.create({ language }))\n\n // put cursor inside the newly created code block\n tr.setSelection(TextSelection.near(tr.doc.resolve(Math.max(0, tr.selection.from - 2))))\n\n // add text to code block\n // strip carriage return chars from text pasted as code\n // see: https://github.com/ProseMirror/prosemirror-view/commit/a50a6bcceb4ce52ac8fcc6162488d8875613aacd\n tr.insertText(text.replace(/\\r\\n?/g, '\\n'))\n\n // store meta information\n // this is useful for other plugins that depends on the paste event\n // like the paste rule plugin\n tr.setMeta('paste', true)\n\n view.dispatch(tr)\n\n return true\n },\n },\n }),\n ]\n },\n})\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tiptap-extension-code-block.esm.js","sources":["../src/code-block.ts"],"sourcesContent":["import { Node, textblockTypeInputRule } from '@tiptap/core'\nimport { Plugin, PluginKey, TextSelection } from 'prosemirror-state'\n\nexport interface CodeBlockOptions {\n /**\n * Adds a prefix to language classes that are applied to code tags.\n * Defaults to `'language-'`.\n */\n languageClassPrefix: string,\n /**\n * Define whether the node should be exited on triple enter.\n * Defaults to `true`.\n */\n exitOnTripleEnter: boolean,\n /**\n * Define whether the node should be exited on arrow down if there is no node after it.\n * Defaults to `true`.\n */\n exitOnArrowDown: boolean,\n /**\n * Custom HTML attributes that should be added to the rendered HTML tag.\n */\n HTMLAttributes: Record<string, any>,\n}\n\ndeclare module '@tiptap/core' {\n interface Commands<ReturnType> {\n codeBlock: {\n /**\n * Set a code block\n */\n setCodeBlock: (attributes?: { language: string }) => ReturnType,\n /**\n * Toggle a code block\n */\n toggleCodeBlock: (attributes?: { language: string }) => ReturnType,\n }\n }\n}\n\nexport const backtickInputRegex = /^```(?<language>[a-z]*)?[\\s\\n]$/\nexport const tildeInputRegex = /^~~~(?<language>[a-z]*)?[\\s\\n]$/\n\nexport const CodeBlock = Node.create<CodeBlockOptions>({\n name: 'codeBlock',\n\n addOptions() {\n return {\n languageClassPrefix: 'language-',\n exitOnTripleEnter: true,\n exitOnArrowDown: true,\n HTMLAttributes: {},\n }\n },\n\n content: 'text*',\n\n marks: '',\n\n group: 'block',\n\n code: true,\n\n defining: true,\n\n addAttributes() {\n return {\n language: {\n default: null,\n parseHTML: element => {\n const { languageClassPrefix } = this.options\n const classNames = [...element.firstElementChild?.classList || []]\n const languages = classNames\n .filter(className => className.startsWith(languageClassPrefix))\n .map(className => className.replace(languageClassPrefix, ''))\n const language = languages[0]\n\n if (!language) {\n return null\n }\n\n return language\n },\n renderHTML: attributes => {\n if (!attributes.language) {\n return null\n }\n\n return {\n class: this.options.languageClassPrefix + attributes.language,\n }\n },\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'pre',\n preserveWhitespace: 'full',\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['pre', this.options.HTMLAttributes, ['code', HTMLAttributes, 0]]\n },\n\n addCommands() {\n return {\n setCodeBlock: attributes => ({ commands }) => {\n return commands.setNode(this.name, attributes)\n },\n toggleCodeBlock: attributes => ({ commands }) => {\n return commands.toggleNode(this.name, 'paragraph', attributes)\n },\n }\n },\n\n addKeyboardShortcuts() {\n return {\n 'Mod-Alt-c': () => this.editor.commands.toggleCodeBlock(),\n\n // remove code block when at start of document or code block is empty\n Backspace: () => {\n const { empty, $anchor } = this.editor.state.selection\n const isAtStart = $anchor.pos === 1\n\n if (!empty || $anchor.parent.type.name !== this.name) {\n return false\n }\n\n if (isAtStart || !$anchor.parent.textContent.length) {\n return this.editor.commands.clearNodes()\n }\n\n return false\n },\n\n // exit node on triple enter\n Enter: ({ editor }) => {\n if (!this.options.exitOnTripleEnter) {\n return false\n }\n\n const { state } = editor\n const { selection } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n const endsWithDoubleNewline = $from.parent.textContent.endsWith('\\n\\n')\n\n if (!isAtEnd || !endsWithDoubleNewline) {\n return false\n }\n\n return editor\n .chain()\n .command(({ tr }) => {\n tr.delete($from.pos - 2, $from.pos)\n\n return true\n })\n .exitCode()\n .run()\n },\n\n // exit node on arrow down\n ArrowDown: ({ editor }) => {\n if (!this.options.exitOnArrowDown) {\n return false\n }\n\n const { state } = editor\n const { selection, doc } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n\n if (!isAtEnd) {\n return false\n }\n\n const after = $from.after()\n\n if (after === undefined) {\n return false\n }\n\n const nodeAfter = doc.nodeAt(after)\n\n if (nodeAfter) {\n return false\n }\n\n return editor.commands.exitCode()\n },\n }\n },\n\n addInputRules() {\n return [\n textblockTypeInputRule({\n find: backtickInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n textblockTypeInputRule({\n find: tildeInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n ]\n },\n\n addProseMirrorPlugins() {\n return [\n // this plugin creates a code block for pasted content from VS Code\n // we can also detect the copied code language\n new Plugin({\n key: new PluginKey('codeBlockVSCodeHandler'),\n props: {\n handlePaste: (view, event) => {\n if (!event.clipboardData) {\n return false\n }\n\n // don’t create a new code block within code blocks\n if (this.editor.isActive(this.type.name)) {\n return false\n }\n\n const text = event.clipboardData.getData('text/plain')\n const vscode = event.clipboardData.getData('vscode-editor-data')\n const vscodeData = vscode\n ? JSON.parse(vscode)\n : undefined\n const language = vscodeData?.mode\n\n if (!text || !language) {\n return false\n }\n\n const { tr } = view.state\n\n // create an empty code block\n tr.replaceSelectionWith(this.type.create({ language }))\n\n // put cursor inside the newly created code block\n tr.setSelection(TextSelection.near(tr.doc.resolve(Math.max(0, tr.selection.from - 2))))\n\n // add text to code block\n // strip carriage return chars from text pasted as code\n // see: https://github.com/ProseMirror/prosemirror-view/commit/a50a6bcceb4ce52ac8fcc6162488d8875613aacd\n tr.insertText(text.replace(/\\r\\n?/g, '\\n'))\n\n // store meta information\n // this is useful for other plugins that depends on the paste event\n // like the paste rule plugin\n tr.setMeta('paste', true)\n\n view.dispatch(tr)\n\n return true\n },\n },\n }),\n ]\n },\n})\n"],"names":[],"mappings":"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"}
|
|
@@ -11,6 +11,8 @@
|
|
|
11
11
|
addOptions() {
|
|
12
12
|
return {
|
|
13
13
|
languageClassPrefix: 'language-',
|
|
14
|
+
exitOnTripleEnter: true,
|
|
15
|
+
exitOnArrowDown: true,
|
|
14
16
|
HTMLAttributes: {},
|
|
15
17
|
};
|
|
16
18
|
},
|
|
@@ -83,8 +85,11 @@
|
|
|
83
85
|
}
|
|
84
86
|
return false;
|
|
85
87
|
},
|
|
86
|
-
//
|
|
88
|
+
// exit node on triple enter
|
|
87
89
|
Enter: ({ editor }) => {
|
|
90
|
+
if (!this.options.exitOnTripleEnter) {
|
|
91
|
+
return false;
|
|
92
|
+
}
|
|
88
93
|
const { state } = editor;
|
|
89
94
|
const { selection } = state;
|
|
90
95
|
const { $from, empty } = selection;
|
|
@@ -105,8 +110,11 @@
|
|
|
105
110
|
.exitCode()
|
|
106
111
|
.run();
|
|
107
112
|
},
|
|
108
|
-
//
|
|
113
|
+
// exit node on arrow down
|
|
109
114
|
ArrowDown: ({ editor }) => {
|
|
115
|
+
if (!this.options.exitOnArrowDown) {
|
|
116
|
+
return false;
|
|
117
|
+
}
|
|
110
118
|
const { state } = editor;
|
|
111
119
|
const { selection, doc } = state;
|
|
112
120
|
const { $from, empty } = selection;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tiptap-extension-code-block.umd.js","sources":["../src/code-block.ts"],"sourcesContent":["import { Node, textblockTypeInputRule } from '@tiptap/core'\nimport { Plugin, PluginKey, TextSelection } from 'prosemirror-state'\n\nexport interface CodeBlockOptions {\n languageClassPrefix: string,\n HTMLAttributes: Record<string, any>,\n}\n\ndeclare module '@tiptap/core' {\n interface Commands<ReturnType> {\n codeBlock: {\n /**\n * Set a code block\n */\n setCodeBlock: (attributes?: { language: string }) => ReturnType,\n /**\n * Toggle a code block\n */\n toggleCodeBlock: (attributes?: { language: string }) => ReturnType,\n }\n }\n}\n\nexport const backtickInputRegex = /^```(?<language>[a-z]*)?[\\s\\n]$/\nexport const tildeInputRegex = /^~~~(?<language>[a-z]*)?[\\s\\n]$/\n\nexport const CodeBlock = Node.create<CodeBlockOptions>({\n name: 'codeBlock',\n\n addOptions() {\n return {\n languageClassPrefix: 'language-',\n HTMLAttributes: {},\n }\n },\n\n content: 'text*',\n\n marks: '',\n\n group: 'block',\n\n code: true,\n\n defining: true,\n\n addAttributes() {\n return {\n language: {\n default: null,\n parseHTML: element => {\n const { languageClassPrefix } = this.options\n const classNames = [...element.firstElementChild?.classList || []]\n const languages = classNames\n .filter(className => className.startsWith(languageClassPrefix))\n .map(className => className.replace(languageClassPrefix, ''))\n const language = languages[0]\n\n if (!language) {\n return null\n }\n\n return language\n },\n renderHTML: attributes => {\n if (!attributes.language) {\n return null\n }\n\n return {\n class: this.options.languageClassPrefix + attributes.language,\n }\n },\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'pre',\n preserveWhitespace: 'full',\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['pre', this.options.HTMLAttributes, ['code', HTMLAttributes, 0]]\n },\n\n addCommands() {\n return {\n setCodeBlock: attributes => ({ commands }) => {\n return commands.setNode(this.name, attributes)\n },\n toggleCodeBlock: attributes => ({ commands }) => {\n return commands.toggleNode(this.name, 'paragraph', attributes)\n },\n }\n },\n\n addKeyboardShortcuts() {\n return {\n 'Mod-Alt-c': () => this.editor.commands.toggleCodeBlock(),\n\n // remove code block when at start of document or code block is empty\n Backspace: () => {\n const { empty, $anchor } = this.editor.state.selection\n const isAtStart = $anchor.pos === 1\n\n if (!empty || $anchor.parent.type.name !== this.name) {\n return false\n }\n\n if (isAtStart || !$anchor.parent.textContent.length) {\n return this.editor.commands.clearNodes()\n }\n\n return false\n },\n\n // escape node on triple enter\n Enter: ({ editor }) => {\n const { state } = editor\n const { selection } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n const endsWithDoubleNewline = $from.parent.textContent.endsWith('\\n\\n')\n\n if (!isAtEnd || !endsWithDoubleNewline) {\n return false\n }\n\n return editor\n .chain()\n .command(({ tr }) => {\n tr.delete($from.pos - 2, $from.pos)\n\n return true\n })\n .exitCode()\n .run()\n },\n\n // escape node on arrow down\n ArrowDown: ({ editor }) => {\n const { state } = editor\n const { selection, doc } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n\n if (!isAtEnd) {\n return false\n }\n\n const after = $from.after()\n\n if (after === undefined) {\n return false\n }\n\n const nodeAfter = doc.nodeAt(after)\n\n if (nodeAfter) {\n return false\n }\n\n return editor.commands.exitCode()\n },\n }\n },\n\n addInputRules() {\n return [\n textblockTypeInputRule({\n find: backtickInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n textblockTypeInputRule({\n find: tildeInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n ]\n },\n\n addProseMirrorPlugins() {\n return [\n // this plugin creates a code block for pasted content from VS Code\n // we can also detect the copied code language\n new Plugin({\n key: new PluginKey('codeBlockVSCodeHandler'),\n props: {\n handlePaste: (view, event) => {\n if (!event.clipboardData) {\n return false\n }\n\n // don’t create a new code block within code blocks\n if (this.editor.isActive(this.type.name)) {\n return false\n }\n\n const text = event.clipboardData.getData('text/plain')\n const vscode = event.clipboardData.getData('vscode-editor-data')\n const vscodeData = vscode\n ? JSON.parse(vscode)\n : undefined\n const language = vscodeData?.mode\n\n if (!text || !language) {\n return false\n }\n\n const { tr } = view.state\n\n // create an empty code block\n tr.replaceSelectionWith(this.type.create({ language }))\n\n // put cursor inside the newly created code block\n tr.setSelection(TextSelection.near(tr.doc.resolve(Math.max(0, tr.selection.from - 2))))\n\n // add text to code block\n // strip carriage return chars from text pasted as code\n // see: https://github.com/ProseMirror/prosemirror-view/commit/a50a6bcceb4ce52ac8fcc6162488d8875613aacd\n tr.insertText(text.replace(/\\r\\n?/g, '\\n'))\n\n // store meta information\n // this is useful for other plugins that depends on the paste event\n // like the paste rule plugin\n tr.setMeta('paste', true)\n\n view.dispatch(tr)\n\n return true\n },\n },\n }),\n ]\n },\n})\n"],"names":["Node","textblockTypeInputRule","Plugin","PluginKey","TextSelection"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tiptap-extension-code-block.umd.js","sources":["../src/code-block.ts"],"sourcesContent":["import { Node, textblockTypeInputRule } from '@tiptap/core'\nimport { Plugin, PluginKey, TextSelection } from 'prosemirror-state'\n\nexport interface CodeBlockOptions {\n /**\n * Adds a prefix to language classes that are applied to code tags.\n * Defaults to `'language-'`.\n */\n languageClassPrefix: string,\n /**\n * Define whether the node should be exited on triple enter.\n * Defaults to `true`.\n */\n exitOnTripleEnter: boolean,\n /**\n * Define whether the node should be exited on arrow down if there is no node after it.\n * Defaults to `true`.\n */\n exitOnArrowDown: boolean,\n /**\n * Custom HTML attributes that should be added to the rendered HTML tag.\n */\n HTMLAttributes: Record<string, any>,\n}\n\ndeclare module '@tiptap/core' {\n interface Commands<ReturnType> {\n codeBlock: {\n /**\n * Set a code block\n */\n setCodeBlock: (attributes?: { language: string }) => ReturnType,\n /**\n * Toggle a code block\n */\n toggleCodeBlock: (attributes?: { language: string }) => ReturnType,\n }\n }\n}\n\nexport const backtickInputRegex = /^```(?<language>[a-z]*)?[\\s\\n]$/\nexport const tildeInputRegex = /^~~~(?<language>[a-z]*)?[\\s\\n]$/\n\nexport const CodeBlock = Node.create<CodeBlockOptions>({\n name: 'codeBlock',\n\n addOptions() {\n return {\n languageClassPrefix: 'language-',\n exitOnTripleEnter: true,\n exitOnArrowDown: true,\n HTMLAttributes: {},\n }\n },\n\n content: 'text*',\n\n marks: '',\n\n group: 'block',\n\n code: true,\n\n defining: true,\n\n addAttributes() {\n return {\n language: {\n default: null,\n parseHTML: element => {\n const { languageClassPrefix } = this.options\n const classNames = [...element.firstElementChild?.classList || []]\n const languages = classNames\n .filter(className => className.startsWith(languageClassPrefix))\n .map(className => className.replace(languageClassPrefix, ''))\n const language = languages[0]\n\n if (!language) {\n return null\n }\n\n return language\n },\n renderHTML: attributes => {\n if (!attributes.language) {\n return null\n }\n\n return {\n class: this.options.languageClassPrefix + attributes.language,\n }\n },\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'pre',\n preserveWhitespace: 'full',\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['pre', this.options.HTMLAttributes, ['code', HTMLAttributes, 0]]\n },\n\n addCommands() {\n return {\n setCodeBlock: attributes => ({ commands }) => {\n return commands.setNode(this.name, attributes)\n },\n toggleCodeBlock: attributes => ({ commands }) => {\n return commands.toggleNode(this.name, 'paragraph', attributes)\n },\n }\n },\n\n addKeyboardShortcuts() {\n return {\n 'Mod-Alt-c': () => this.editor.commands.toggleCodeBlock(),\n\n // remove code block when at start of document or code block is empty\n Backspace: () => {\n const { empty, $anchor } = this.editor.state.selection\n const isAtStart = $anchor.pos === 1\n\n if (!empty || $anchor.parent.type.name !== this.name) {\n return false\n }\n\n if (isAtStart || !$anchor.parent.textContent.length) {\n return this.editor.commands.clearNodes()\n }\n\n return false\n },\n\n // exit node on triple enter\n Enter: ({ editor }) => {\n if (!this.options.exitOnTripleEnter) {\n return false\n }\n\n const { state } = editor\n const { selection } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n const endsWithDoubleNewline = $from.parent.textContent.endsWith('\\n\\n')\n\n if (!isAtEnd || !endsWithDoubleNewline) {\n return false\n }\n\n return editor\n .chain()\n .command(({ tr }) => {\n tr.delete($from.pos - 2, $from.pos)\n\n return true\n })\n .exitCode()\n .run()\n },\n\n // exit node on arrow down\n ArrowDown: ({ editor }) => {\n if (!this.options.exitOnArrowDown) {\n return false\n }\n\n const { state } = editor\n const { selection, doc } = state\n const { $from, empty } = selection\n\n if (!empty || $from.parent.type !== this.type) {\n return false\n }\n\n const isAtEnd = $from.parentOffset === $from.parent.nodeSize - 2\n\n if (!isAtEnd) {\n return false\n }\n\n const after = $from.after()\n\n if (after === undefined) {\n return false\n }\n\n const nodeAfter = doc.nodeAt(after)\n\n if (nodeAfter) {\n return false\n }\n\n return editor.commands.exitCode()\n },\n }\n },\n\n addInputRules() {\n return [\n textblockTypeInputRule({\n find: backtickInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n textblockTypeInputRule({\n find: tildeInputRegex,\n type: this.type,\n getAttributes: ({ groups }) => groups,\n }),\n ]\n },\n\n addProseMirrorPlugins() {\n return [\n // this plugin creates a code block for pasted content from VS Code\n // we can also detect the copied code language\n new Plugin({\n key: new PluginKey('codeBlockVSCodeHandler'),\n props: {\n handlePaste: (view, event) => {\n if (!event.clipboardData) {\n return false\n }\n\n // don’t create a new code block within code blocks\n if (this.editor.isActive(this.type.name)) {\n return false\n }\n\n const text = event.clipboardData.getData('text/plain')\n const vscode = event.clipboardData.getData('vscode-editor-data')\n const vscodeData = vscode\n ? JSON.parse(vscode)\n : undefined\n const language = vscodeData?.mode\n\n if (!text || !language) {\n return false\n }\n\n const { tr } = view.state\n\n // create an empty code block\n tr.replaceSelectionWith(this.type.create({ language }))\n\n // put cursor inside the newly created code block\n tr.setSelection(TextSelection.near(tr.doc.resolve(Math.max(0, tr.selection.from - 2))))\n\n // add text to code block\n // strip carriage return chars from text pasted as code\n // see: https://github.com/ProseMirror/prosemirror-view/commit/a50a6bcceb4ce52ac8fcc6162488d8875613aacd\n tr.insertText(text.replace(/\\r\\n?/g, '\\n'))\n\n // store meta information\n // this is useful for other plugins that depends on the paste event\n // like the paste rule plugin\n tr.setMeta('paste', true)\n\n view.dispatch(tr)\n\n return true\n },\n },\n }),\n ]\n },\n})\n"],"names":["Node","textblockTypeInputRule","Plugin","PluginKey","TextSelection"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tiptap/extension-code-block",
|
|
3
3
|
"description": "code block extension for tiptap",
|
|
4
|
-
"version": "2.0.0-beta.
|
|
4
|
+
"version": "2.0.0-beta.34",
|
|
5
5
|
"homepage": "https://tiptap.dev",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"tiptap",
|
|
@@ -31,5 +31,5 @@
|
|
|
31
31
|
"url": "https://github.com/ueberdosis/tiptap",
|
|
32
32
|
"directory": "packages/extension-code-block"
|
|
33
33
|
},
|
|
34
|
-
"gitHead": "
|
|
34
|
+
"gitHead": "0c4ab8bf68412c6f34d82e45a8600925b11ee2f5"
|
|
35
35
|
}
|
package/src/code-block.ts
CHANGED
|
@@ -2,7 +2,24 @@ import { Node, textblockTypeInputRule } from '@tiptap/core'
|
|
|
2
2
|
import { Plugin, PluginKey, TextSelection } from 'prosemirror-state'
|
|
3
3
|
|
|
4
4
|
export interface CodeBlockOptions {
|
|
5
|
+
/**
|
|
6
|
+
* Adds a prefix to language classes that are applied to code tags.
|
|
7
|
+
* Defaults to `'language-'`.
|
|
8
|
+
*/
|
|
5
9
|
languageClassPrefix: string,
|
|
10
|
+
/**
|
|
11
|
+
* Define whether the node should be exited on triple enter.
|
|
12
|
+
* Defaults to `true`.
|
|
13
|
+
*/
|
|
14
|
+
exitOnTripleEnter: boolean,
|
|
15
|
+
/**
|
|
16
|
+
* Define whether the node should be exited on arrow down if there is no node after it.
|
|
17
|
+
* Defaults to `true`.
|
|
18
|
+
*/
|
|
19
|
+
exitOnArrowDown: boolean,
|
|
20
|
+
/**
|
|
21
|
+
* Custom HTML attributes that should be added to the rendered HTML tag.
|
|
22
|
+
*/
|
|
6
23
|
HTMLAttributes: Record<string, any>,
|
|
7
24
|
}
|
|
8
25
|
|
|
@@ -30,6 +47,8 @@ export const CodeBlock = Node.create<CodeBlockOptions>({
|
|
|
30
47
|
addOptions() {
|
|
31
48
|
return {
|
|
32
49
|
languageClassPrefix: 'language-',
|
|
50
|
+
exitOnTripleEnter: true,
|
|
51
|
+
exitOnArrowDown: true,
|
|
33
52
|
HTMLAttributes: {},
|
|
34
53
|
}
|
|
35
54
|
},
|
|
@@ -119,8 +138,12 @@ export const CodeBlock = Node.create<CodeBlockOptions>({
|
|
|
119
138
|
return false
|
|
120
139
|
},
|
|
121
140
|
|
|
122
|
-
//
|
|
141
|
+
// exit node on triple enter
|
|
123
142
|
Enter: ({ editor }) => {
|
|
143
|
+
if (!this.options.exitOnTripleEnter) {
|
|
144
|
+
return false
|
|
145
|
+
}
|
|
146
|
+
|
|
124
147
|
const { state } = editor
|
|
125
148
|
const { selection } = state
|
|
126
149
|
const { $from, empty } = selection
|
|
@@ -147,8 +170,12 @@ export const CodeBlock = Node.create<CodeBlockOptions>({
|
|
|
147
170
|
.run()
|
|
148
171
|
},
|
|
149
172
|
|
|
150
|
-
//
|
|
173
|
+
// exit node on arrow down
|
|
151
174
|
ArrowDown: ({ editor }) => {
|
|
175
|
+
if (!this.options.exitOnArrowDown) {
|
|
176
|
+
return false
|
|
177
|
+
}
|
|
178
|
+
|
|
152
179
|
const { state } = editor
|
|
153
180
|
const { selection, doc } = state
|
|
154
181
|
const { $from, empty } = selection
|