ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

add codeblock commands

Browse Source
This commit is contained in:
Philipp Kühn
2020-11-18 12:00:26 +01:00
parent a148d9cd17
commit 116b189a93
5 changed files with 13 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/src/demos/Examples/Basic/index.vue
View File

@@ -46,7 +46,7 @@
<button @click="editor.chain().focus().toggleOrderedList().run()" :class="{ 'is-active': editor.isActive('orderedList') }">
ordered list
</button>
<button @click="editor.chain().focus().codeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
<button @click="editor.chain().focus().toggleCodeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
code block
</button>
<button @click="editor.chain().focus().toggleBlockquote().run()" :class="{ 'is-active': editor.isActive('blockquote') }">

2
docs/src/demos/Examples/CollaborativeEditing/index.vue
View File

@@ -46,7 +46,7 @@
<button @click="editor.chain().focus().toggleOrderedList().run()" :class="{ 'is-active': editor.isActive('orderedList') }">
ordered list
</button>
<button @click="editor.chain().focus().codeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
<button @click="editor.chain().focus().toggleCodeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
code block
</button>
<button @click="editor.chain().focus().toggleBlockquote().run()" :class="{ 'is-active': editor.isActive('blockquote') }">

2
docs/src/demos/Examples/CollaborativeEditingWs/index.vue
View File

@@ -46,7 +46,7 @@
<button @click="editor.chain().focus().toggleOrderedList().run()" :class="{ 'is-active': editor.isActive('orderedList') }">
ordered list
</button>
<button @click="editor.chain().focus().codeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
<button @click="editor.chain().focus().toggleCodeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
code block
</button>
<button @click="editor.chain().focus().toggleBlockquote().run()" :class="{ 'is-active': editor.isActive('blockquote') }">

2
docs/src/demos/Nodes/CodeBlock/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.chain().focus().codeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
<button @click="editor.chain().focus().toggleCodeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
code block
</button>

12
packages/extension-code-block/src/index.ts
View File

@@ -74,18 +74,24 @@ const CodeBlock = Node.create({
addCommands() {
return {
/**
* Set a code block
*/
setCodeBlock: (attributes?: { language: string }): Command => ({ commands }) => {
return commands.setBlockType('codeBlock', attributes)
},
/**
* Toggle a code block
*/
codeBlock: (attrs?: CodeBlockOptions): Command => ({ commands }) => {
return commands.toggleBlockType('codeBlock', 'paragraph', attrs)
toggleCodeBlock: (attributes?: { language: string }): Command => ({ commands }) => {
return commands.toggleBlockType('codeBlock', 'paragraph', attributes)
},
}
},
addKeyboardShortcuts() {
return {
'Mod-Shift-c': () => this.editor.commands.codeBlock(),
'Mod-Shift-c': () => this.editor.commands.toggleCodeBlock(),
}
},