1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
|
import { Table } from '@tiptap/extension-table'
import { Node, mergeAttributes } from '@tiptap/core'
import { TextSelection } from 'prosemirror-state'
/*
* Markdown tables do not include captions.
* We still need to parse them though
* because otherwise tiptap will try to insert their text content
* and put it in the top row of the table.
*/
const tableCaption = Node.create({
name: 'tableCaption',
content: 'inline*',
addAttributes() {
return {}
},
renderHTML() {
return ['caption']
},
toMarkdown(state, node) {
},
parseHTML() {
return [
{ tag: 'table caption', priority: 90 },
]
},
})
function createTable(schema, rowsCount, colsCount, cellContent) {
const headerCells = []
const cells = []
for (let index = 0; index < colsCount; index += 1) {
const cell = schema.nodes.tableCell.createAndFill()
if (cell) {
cells.push(cell)
}
const headerCell = schema.nodes.tableHeader.createAndFill()
if (headerCell) {
headerCells.push(headerCell)
}
}
const headRow = schema.nodes.tableHeadRow.createChecked(null, headerCells)
const rows = []
for (let index = 1; index < rowsCount; index += 1) {
rows.push(schema.nodes.tableRow.createChecked(null, cells))
}
const head = schema.nodes.tableHead.createChecked(null, headRow)
const body = schema.nodes.tableBody.createChecked(null, rows)
return schema.nodes.table.createChecked(null, [head, body])
}
export default Table.extend({
content: 'tableCaption? tableHead tableBody',
addExtensions() {
return [
tableCaption,
]
},
addCommands() {
return {
...this.parent(),
insertTable: () => ({ tr, dispatch, editor }) => {
const node = createTable(editor.schema, 3, 3, true)
if (dispatch) {
const offset = tr.selection.anchor + 1
tr.replaceSelectionWith(node)
.scrollIntoView()
.setSelection(TextSelection.near(tr.doc.resolve(offset)))
}
return true
},
}
},
renderHTML({ HTMLAttributes }) {
return ['table', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
},
toMarkdown(state, node) {
state.renderContent(node)
state.closeBlock(node)
},
})
|