diff --git a/src/components/RichTextEditor.vue b/src/components/RichTextEditor.vue index e01f193..d26cc63 100644 --- a/src/components/RichTextEditor.vue +++ b/src/components/RichTextEditor.vue @@ -62,6 +62,7 @@ History, HorizontalRule, Mention, + Image, } from 'tiptap-extensions' export default { @@ -94,6 +95,7 @@ new ListItem(), new TodoItem(), new TodoList(), + new Image(), new Bold(), new Code(), new Italic(), @@ -186,6 +188,7 @@ {name: 'underline', icon: 'underline'}, {name: 'strike', icon: 'strikethrough'}, {name: 'link', icon: 'link'}, + {name: 'image', icon: 'image'}, {name: 'heading', icon: 'heading'}, {name: 'horizontal_rule', icon: 'minus'}, ], @@ -219,6 +222,9 @@ case 'heading': this.editor.commands.heading({level: 1}); break; + case 'image': + this.showImagePrompt(); + break; case 'link': const {empty} = this.editor.state.tr.selection; if (empty) { @@ -266,11 +272,16 @@ return link; } }, + showImagePrompt() { + const src = prompt('Enter the url of your image here') + if (src !== null) { + this.editor.commands.image({ src }) + } + }, setLinkUrl(url) { this.editor.commands.link({href: url}); this.editor.focus() }, - // navigate to the previous item // if it's the first item, navigate to the last one upHandler() { diff --git a/src/components/section/Layout.vue b/src/components/section/Layout.vue index b02c8d7..281d92c 100644 --- a/src/components/section/Layout.vue +++ b/src/components/section/Layout.vue @@ -56,9 +56,9 @@