-
Notifications
You must be signed in to change notification settings - Fork 0
/
TipTapTaskItem.js
139 lines (137 loc) · 4.24 KB
/
TipTapTaskItem.js
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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
// TipTap Task Item
// Task Items do not work in TipTap if you have Bitwarden or Enpass installed.
// This version of tiptap-task-tem.cjs.js gets around the issue by not using
// real inputs for the task items. TipTav dev isn't interesting in addressing
// the issue as they claim its a Bitwarden bug, and Bitwarden has has the issue
// for three years now. You can read the bug reports here:
// TapTap: https://github.com/ueberdosis/tiptap/issues/2697
// Bitwaden: https://github.com/bitwarden/browser/issues/725
//
// If either of the above bugs ever get closed, we can delete this file and
// change the import in Notes.vue to:
// import TaskList from '@tiptap/extension-task-item';
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var core = require("@tiptap/core");
const inputRegex = /^\s*(\[([ |x])\])\s$/;
const TaskItem = core.Node.create({
name: "taskItem",
addOptions() {
return {
nested: false,
HTMLAttributes: {}
};
},
content() {
return this.options.nested ? "paragraph block*" : "paragraph+";
},
defining: true,
addAttributes() {
return {
checked: {
default: false,
keepOnSplit: false,
parseHTML: (element) => element.getAttribute("data-checked") === "true",
renderHTML: (attributes) => ({"data-checked": attributes.checked})
}
};
},
parseHTML() {
return [{
tag: `li[data-type="${this.name}"]`,
priority: 51
}];
},
renderHTML({HTMLAttributes}) {
return [
"li",
core.mergeAttributes(
this.options.HTMLAttributes,
HTMLAttributes,
{"data-type": this.name}),
["label", ["span"]],
["div", 0]
];
},
addKeyboardShortcuts() {
const shortcuts = {
Enter: () => this.editor.commands.splitListItem(this.name),
"Shift-Tab": () => this.editor.commands.liftListItem(this.name)
};
if (!this.options.nested) {
return shortcuts;
}
return {
...shortcuts,
Tab: () => this.editor.commands.sinkListItem(this.name)
};
},
addNodeView() {
return ({ node, HTMLAttributes, getPos, editor }) => {
const listItem = document.createElement("li");
const checkboxWrapper = document.createElement("label");
const checkboxStyler = document.createElement("span");
const content = document.createElement("div");
checkboxWrapper.contentEditable = "false";
checkboxWrapper.addEventListener("click", () => {
// If the editor isn’t editable break early
if (!editor.isEditable) {
return;
}
// reverse the value
const checked = listItem.dataset.checked !== "true";
if (editor.isEditable && typeof getPos === "function") {
editor
.chain()
.focus(undefined, { scrollIntoView: false })
.command(({ tr }) => {
const position = getPos();
const currentNode = tr.doc.nodeAt(position);
tr.setNodeMarkup(position, undefined, {
...(currentNode === null || currentNode === void 0
? void 0
: currentNode.attrs),
checked
});
return true;
})
.run();
}
});
Object.entries(this.options.HTMLAttributes).forEach(([key, value]) => {
listItem.setAttribute(key, value);
});
listItem.dataset.checked = node.attrs.checked;
checkboxWrapper.append(checkboxStyler);
listItem.append(checkboxWrapper, content);
Object.entries(HTMLAttributes).forEach(([key, value]) => {
listItem.setAttribute(key, value);
});
return {
dom: listItem,
contentDOM: content,
update: (updatedNode) => {
if (updatedNode.type !== this.type) {
return false;
}
listItem.dataset.checked = updatedNode.attrs.checked;
return true;
}
};
};
},
addInputRules() {
return [
core.wrappingInputRule({
find: inputRegex,
type: this.type,
getAttributes: (match) => ({
checked: match[match.length - 1] === "x"
})
})
];
}
});
exports.TaskItem = TaskItem;
exports["default"] = TaskItem;
exports.inputRegex = inputRegex;