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

add italic commands

Browse Source
This commit is contained in:
Philipp Kühn
2020-11-17 21:49:23 +01:00
parent 3349ebf081
commit f24e8f7ee9
9 changed files with 22 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -4,7 +4,7 @@
<button @click="editor.chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">
bold
</button>
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().toggleItalic().run()" :class="{ 'is-active': editor.isActive('italic') }">
italic
</button>
<button @click="editor.chain().focus().strike().run()" :class="{ 'is-active': editor.isActive('strike') }">

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

@@ -4,7 +4,7 @@
<button @click="editor.chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">
bold
</button>
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().toggleItalic().run()" :class="{ 'is-active': editor.isActive('italic') }">
italic
</button>
<button @click="editor.chain().focus().strike().run()" :class="{ 'is-active': editor.isActive('strike') }">

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

@@ -4,7 +4,7 @@
<button @click="editor.chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">
bold
</button>
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().toggleItalic().run()" :class="{ 'is-active': editor.isActive('italic') }">
italic
</button>
<button @click="editor.chain().focus().strike().run()" :class="{ 'is-active': editor.isActive('strike') }">

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

@@ -10,7 +10,7 @@
<button @click="editor.chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">
Bold
</button>
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().toggleItalic().run()" :class="{ 'is-active': editor.isActive('italic') }">
Italic
</button>
</div>

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

@@ -4,7 +4,7 @@
<button @click="editor.chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">
bold
</button>
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().toggleItalic().run()" :class="{ 'is-active': editor.isActive('italic') }">
italic
</button>
<button @click="editor.chain().focus().heading({ level: 1 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">

2
docs/src/demos/Guide/BuildYourEditor/index.vue
View File

@@ -13,7 +13,7 @@
<button @click="editor.chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">
bold
</button>
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().toggleItalic().run()" :class="{ 'is-active': editor.isActive('italic') }">
italic
</button>
<button @click="editor.chain().focus().heading({ level: 1 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">

2
docs/src/demos/Marks/Italic/index.vue
View File

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

2
docs/src/docPages/api/commands.md
View File

@@ -63,7 +63,7 @@ editor
.can()
.chain()
.toggleBold()
.italic()
.toggleItalic()
.run()
```

16
packages/extension-italic/src/index.ts
View File

@@ -44,18 +44,30 @@ const Italic = Mark.create({
addCommands() {
return {
/**
* Set a italic mark
*/
setItalic: (): Command => ({ commands }) => {
return commands.addMark('italic')
},
/**
* Toggle an italic mark
*/
italic: (): Command => ({ commands }) => {
toggleItalic: (): Command => ({ commands }) => {
return commands.toggleMark('italic')
},
/**
* Set a italic mark
*/
unsetItalic: (): Command => ({ commands }) => {
return commands.addMark('italic')
},
}
},
addKeyboardShortcuts() {
return {
'Mod-i': () => this.editor.commands.italic(),
'Mod-i': () => this.editor.commands.toggleItalic(),
}
},