67 lines
1.3 KiB
TypeScript
67 lines
1.3 KiB
TypeScript
import { Node, mergeAttributes } from '@tiptap/core'
|
|
|
|
declare module '@tiptap/core' {
|
|
interface Commands<ReturnType> {
|
|
Article: {
|
|
toggleArticle: () => ReturnType
|
|
setArticleFloat: (float: null | 'left' | 'half-left' | 'right' | 'half-right') => ReturnType
|
|
setArticleBg: (bg: null | string) => ReturnType
|
|
}
|
|
}
|
|
}
|
|
|
|
export default Node.create({
|
|
name: 'article',
|
|
|
|
defaultOptions: {
|
|
HTMLAttributes: {
|
|
'data-type': 'incut'
|
|
}
|
|
},
|
|
group: 'block',
|
|
content: 'block+',
|
|
|
|
parseHTML() {
|
|
return [
|
|
{
|
|
tag: 'article'
|
|
}
|
|
]
|
|
},
|
|
|
|
renderHTML({ HTMLAttributes }) {
|
|
return ['article', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
|
|
},
|
|
|
|
addAttributes() {
|
|
return {
|
|
'data-float': {
|
|
default: null
|
|
},
|
|
'data-bg': {
|
|
default: null
|
|
}
|
|
}
|
|
},
|
|
|
|
addCommands() {
|
|
return {
|
|
toggleArticle:
|
|
() =>
|
|
({ commands }) => {
|
|
return commands.toggleWrap('article')
|
|
},
|
|
setArticleFloat:
|
|
(value) =>
|
|
({ commands }) => {
|
|
return commands.updateAttributes(this.name, { 'data-float': value })
|
|
},
|
|
setArticleBg:
|
|
(value) =>
|
|
({ commands }) => {
|
|
return commands.updateAttributes(this.name, { 'data-bg': value })
|
|
}
|
|
}
|
|
}
|
|
})
|