Support inputRules in Image node

This commit is contained in:
michalsnik 2019-06-03 11:43:53 +02:00
parent 92c4e0457c
commit 39fb85b48b

View File

@ -1,4 +1,15 @@
import { Node, Plugin } from 'tiptap' import { Node, Plugin } from 'tiptap'
import { nodeInputRule } from 'tiptap-commands'
/**
* Matches following attributes in Markdown-typed image: [, alt, src, title]
*
* Example:
* ![Lorem](image.jpg) -> [, "Lorem", "image.jpg"]
* ![](image.jpg "Ipsum") -> [, "", "image.jpg", "Ipsum"]
* ![Lorem](image.jpg "Ipsum") -> [, "Lorem", "image.jpg", "Ipsum"]
*/
const IMAGE_INPUT_REGEX = /!\[(.+|:?)\]\((\S+)(?:(?:\s+)["'](\S+)["'])?\)/
export default class Image extends Node { export default class Image extends Node {
@ -44,6 +55,19 @@ export default class Image extends Node {
} }
} }
inputRules({ type }) {
return [
nodeInputRule(IMAGE_INPUT_REGEX, type, match => {
const [, alt, src, title] = match
return {
src,
alt,
title,
}
}),
]
}
get plugins() { get plugins() {
return [ return [
new Plugin({ new Plugin({