add inline option to image node

This commit is contained in:
Philipp Kühn
2020-10-30 16:57:55 +01:00
parent a8216d0840
commit 3e3dd26ca5
2 changed files with 20 additions and 3 deletions

View File

@@ -9,8 +9,13 @@ npm install @tiptap/extension-image
yarn add @tiptap/extension-image
```
## Settings
| Option | Type | Default | Description |
| ------ | ------- | ------- | ------------------------ |
| inline | boolean | false | Renders the node inline. |
## Source code
[packages/extension-image/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-image/)
## Usage
<demo name="Extensions/Image" highlight="12,30" />
<demo name="Extensions/Image" />

View File

@@ -1,13 +1,25 @@
import { Command, createNode, nodeInputRule } from '@tiptap/core'
export interface ImageOptions {
inline: boolean,
}
export const inputRegex = /!\[(.+|:?)]\((\S+)(?:(?:\s+)["'](\S+)["'])?\)/
const Image = createNode({
name: 'image',
inline: true,
defaultOptions: <ImageOptions>{
inline: false,
},
group: 'inline',
inline() {
return this.options.inline
},
group() {
return this.options.inline ? 'inline' : 'block'
},
draggable: true,