feat: add allowBase64 option to image extension

This commit is contained in:
Philipp Kühn 2022-02-09 12:21:03 +01:00
parent 55d907885d
commit a97a46fc51
2 changed files with 27 additions and 12 deletions

View File

@ -20,17 +20,6 @@ npm install @tiptap/extension-image
## Settings
### HTMLAttributes
Custom HTML attributes that should be added to the rendered HTML tag.
```js
Image.configure({
HTMLAttributes: {
class: 'my-custom-class',
},
})
```
### inline
Renders the image node inline, for example in a paragraph tag: `<p><img src="spacer.gif"></p>`. By default images are on the same level as paragraphs.
@ -44,6 +33,28 @@ Image.configure({
})
```
### allowBase64
Allow images to be parsed as base64 strings `<img src="data:image/jpg;base64...">`.
Default: `false`
```js
Image.configure({
allowBase64: true,
})
```
### HTMLAttributes
Custom HTML attributes that should be added to the rendered HTML tag.
```js
Image.configure({
HTMLAttributes: {
class: 'my-custom-class',
},
})
```
## Commands
### setImage()

View File

@ -6,6 +6,7 @@ import {
export interface ImageOptions {
inline: boolean,
allowBase64: boolean,
HTMLAttributes: Record<string, any>,
}
@ -28,6 +29,7 @@ export const Image = Node.create<ImageOptions>({
addOptions() {
return {
inline: false,
allowBase64: false,
HTMLAttributes: {},
}
},
@ -59,7 +61,9 @@ export const Image = Node.create<ImageOptions>({
parseHTML() {
return [
{
tag: 'img[src]:not([src^="data:"])',
tag: this.options.allowBase64
? 'img[src]'
: 'img[src]:not([src^="data:"])',
},
]
},