add inline option to image node
This commit is contained in:
@@ -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" />
|
||||
|
||||
@@ -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,
|
||||
|
||||
|
||||
Reference in New Issue
Block a user