tiptap/packages/extension-paragraph/index.ts

108 lines
2.0 KiB
TypeScript
Raw Normal View History

2020-10-21 21:17:05 +08:00
import { createNode } from '@tiptap/core'
// import { DOMOutputSpecArray } from 'prosemirror-model'
2020-04-27 15:06:42 +08:00
// import ParagraphComponent from './paragraph.vue'
2020-03-06 03:30:58 +08:00
2020-10-10 04:59:25 +08:00
// export type ParagraphCommand = () => Command
2020-09-25 01:07:47 +08:00
2020-10-10 04:59:25 +08:00
// declare module '@tiptap/core/src/Editor' {
// interface Commands {
// paragraph: ParagraphCommand,
// }
// }
// export default new Node()
// .name('paragraph')
// .schema(() => ({
// content: 'inline*',
// group: 'block',
// parseDOM: [{ tag: 'p' }],
// toDOM: () => ['p', 0],
// // toVue: ParagraphComponent,
// }))
// .commands(({ name }) => ({
// [name]: () => ({ commands }) => {
// return commands.toggleBlockType(name, 'paragraph')
// },
// }))
// .keys(({ editor }) => ({
// 'Mod-Alt-0': () => editor.paragraph(),
// }))
// .create()
2020-10-21 21:17:05 +08:00
// export default class Paragraph extends Node implements INode {
2020-10-10 04:59:25 +08:00
2020-10-21 21:17:05 +08:00
// name = 'paragraph'
2020-10-10 04:59:25 +08:00
2020-10-21 21:17:05 +08:00
// group = 'block'
2020-10-10 04:59:25 +08:00
2020-10-21 21:17:05 +08:00
// content = 'inline*'
2020-10-10 04:59:25 +08:00
2020-10-21 21:17:05 +08:00
// createAttributes() {
// return {
// // default rendering
// class: {
// default: 'jooo',
// },
// }
// }
// parseHTML() {
// return [
// { tag: 'p' },
// ]
// }
// renderHTML() {
// return ['p', 0] as const
// }
// }
export default createNode({
name: 'paragraph',
group: 'block',
content: 'inline*',
2020-10-12 16:32:54 +08:00
2020-10-22 05:55:14 +08:00
createGlobalAttributes() {
return [
{
types: ['paragraph'],
attributes: {
align: {
default: 'right',
renderHTML: attributes => ({
2020-10-22 15:14:24 +08:00
class: 'global',
2020-10-22 05:55:14 +08:00
style: `text-align: ${attributes.align}`,
}),
},
},
},
]
},
createAttributes() {
return {
id: {
default: '123',
2020-10-22 05:35:12 +08:00
rendered: true,
2020-10-22 05:55:14 +08:00
renderHTML: attributes => ({
2020-10-22 15:14:24 +08:00
// class: `foo-${attributes.id}`,
2020-10-22 05:55:14 +08:00
id: 'foo',
}),
},
}
},
2020-10-10 04:59:25 +08:00
parseHTML() {
return [
{ tag: 'p' },
]
2020-10-21 21:17:05 +08:00
},
2020-10-10 04:59:25 +08:00
2020-10-21 21:17:05 +08:00
renderHTML({ attributes }) {
return ['p', attributes, 0]
},
})