@webiny/lexical-nodes 6.0.0-beta.0 → 6.0.0-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/FontColorNode.d.ts +24 -22
- package/FontColorNode.js +114 -103
- package/FontColorNode.js.map +1 -1
- package/HeadingNode.d.ts +30 -20
- package/HeadingNode.js +185 -176
- package/HeadingNode.js.map +1 -1
- package/ImageNode.d.ts +2 -12
- package/ImageNode.js +119 -193
- package/ImageNode.js.map +1 -1
- package/LinkNode.d.ts +6 -6
- package/LinkNode.js +249 -347
- package/LinkNode.js.map +1 -1
- package/ListItemNode.d.ts +6 -5
- package/ListItemNode.js +275 -352
- package/ListItemNode.js.map +1 -1
- package/ListNode.d.ts +32 -19
- package/ListNode.js +170 -210
- package/ListNode.js.map +1 -1
- package/ParagraphNode.d.ts +30 -20
- package/ParagraphNode.js +144 -201
- package/ParagraphNode.js.map +1 -1
- package/QuoteNode.d.ts +27 -20
- package/QuoteNode.js +102 -208
- package/QuoteNode.js.map +1 -1
- package/README.md +9 -4
- package/components/ImageNode/ImageComponent.d.ts +2 -7
- package/components/ImageNode/ImageComponent.js +72 -166
- package/components/ImageNode/ImageComponent.js.map +1 -1
- package/components/ImageNode/ImageResizer.d.ts +1 -8
- package/components/ImageNode/ImageResizer.js +80 -95
- package/components/ImageNode/ImageResizer.js.map +1 -1
- package/generateInitialLexicalValue.d.ts +4 -0
- package/generateInitialLexicalValue.js +27 -0
- package/generateInitialLexicalValue.js.map +1 -0
- package/index.d.ts +19 -23
- package/index.js +50 -233
- package/index.js.map +1 -1
- package/package.json +22 -19
- package/prepareLexicalState.d.ts +2 -0
- package/prepareLexicalState.js +53 -0
- package/prepareLexicalState.js.map +1 -0
- package/types.d.ts +5 -9
- package/types.js +1 -5
- package/types.js.map +1 -1
- package/utils/clearNodeFormating.d.ts +2 -2
- package/utils/clearNodeFormating.js +12 -18
- package/utils/clearNodeFormating.js.map +1 -1
- package/utils/formatList.d.ts +4 -4
- package/utils/formatList.js +171 -208
- package/utils/formatList.js.map +1 -1
- package/utils/formatToHeading.d.ts +2 -2
- package/utils/formatToHeading.js +8 -15
- package/utils/formatToHeading.js.map +1 -1
- package/utils/formatToParagraph.d.ts +1 -1
- package/utils/formatToParagraph.js +8 -16
- package/utils/formatToParagraph.js.map +1 -1
- package/utils/formatToQuote.d.ts +1 -1
- package/utils/formatToQuote.js +10 -17
- package/utils/formatToQuote.js.map +1 -1
- package/utils/getStyleId.d.ts +11 -0
- package/utils/getStyleId.js +14 -0
- package/utils/getStyleId.js.map +1 -0
- package/utils/listNode.d.ts +14 -4
- package/utils/listNode.js +43 -49
- package/utils/listNode.js.map +1 -1
- package/utils/toggleLink.d.ts +1 -1
- package/utils/toggleLink.js +41 -45
- package/utils/toggleLink.js.map +1 -1
- package/TypographyNode.d.ts +0 -39
- package/TypographyNode.js +0 -147
- package/TypographyNode.js.map +0 -1
- package/components/ImageNode/ContentEditable.css +0 -22
- package/components/ImageNode/ContentEditable.d.ts +0 -12
- package/components/ImageNode/ContentEditable.js +0 -26
- package/components/ImageNode/ContentEditable.js.map +0 -1
- package/components/ImageNode/ImageComponent.css +0 -43
- package/components/ImageNode/Placeholder.css +0 -20
- package/components/ImageNode/Placeholder.d.ts +0 -15
- package/components/ImageNode/Placeholder.js +0 -30
- package/components/ImageNode/Placeholder.js.map +0 -1
- package/components/ImageNode/SharedHistoryContext.d.ts +0 -10
- package/components/ImageNode/SharedHistoryContext.js +0 -27
- package/components/ImageNode/SharedHistoryContext.js.map +0 -1
package/ListItemNode.js
CHANGED
|
@@ -1,380 +1,305 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
exports.$createListItemNode = $createListItemNode;
|
|
8
|
-
exports.$isListItemNode = $isListItemNode;
|
|
9
|
-
exports.ListItemNode = void 0;
|
|
10
|
-
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
11
|
-
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
12
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
13
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
14
|
-
var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
|
|
15
|
-
var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));
|
|
16
|
-
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
17
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
18
|
-
var _lexical = require("lexical");
|
|
19
|
-
var _ListNode = require("./ListNode");
|
|
20
|
-
var _utils = require("@lexical/utils");
|
|
21
|
-
var _formatList = require("./utils/formatList");
|
|
22
|
-
var _ParagraphNode = require("./ParagraphNode");
|
|
23
|
-
var _listNode = require("./utils/listNode");
|
|
1
|
+
import { $isElementNode, $isRangeSelection, ElementNode, addClassNamesToElement, removeClassNamesFromElement } from "lexical";
|
|
2
|
+
import { $createListNode, $isListNode } from "./ListNode.js";
|
|
3
|
+
import { $handleIndent, $handleOutdent, mergeLists, updateChildrenListItemValue } from "./utils/formatList.js";
|
|
4
|
+
import { $createParagraphNode, $isParagraphNode } from "./ParagraphNode.js";
|
|
5
|
+
import { isNestedListNode } from "./utils/listNode.js";
|
|
6
|
+
export const LIST_ITEM_TYPE = "wby-list-item";
|
|
24
7
|
/** @noInheritDoc */
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
}
|
|
47
|
-
}, {
|
|
48
|
-
key: "updateDOM",
|
|
49
|
-
value: function updateDOM(prevNode, dom, config) {
|
|
50
|
-
var parent = this.getParent();
|
|
51
|
-
if ((0, _ListNode.$isListNode)(parent) && parent.getListType() === "check") {
|
|
52
|
-
updateListItemChecked(dom, this, prevNode, parent);
|
|
53
|
-
}
|
|
54
|
-
// @ts-expect-error - this is always HTMLListItemElement
|
|
55
|
-
dom.value = this.__value;
|
|
56
|
-
$setListItemThemeClassNames(dom, config.theme, this);
|
|
57
|
-
return false;
|
|
58
|
-
}
|
|
59
|
-
}, {
|
|
60
|
-
key: "exportJSON",
|
|
61
|
-
value: function exportJSON() {
|
|
62
|
-
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _get2.default)((0, _getPrototypeOf2.default)(ListItemNode.prototype), "exportJSON", this).call(this)), {}, {
|
|
63
|
-
checked: this.getChecked(),
|
|
64
|
-
type: "webiny-listitem",
|
|
65
|
-
value: this.getValue(),
|
|
66
|
-
version: 1
|
|
67
|
-
});
|
|
8
|
+
export class ListItemNode extends ElementNode {
|
|
9
|
+
/** @internal */
|
|
10
|
+
|
|
11
|
+
/** @internal */
|
|
12
|
+
|
|
13
|
+
static getType() {
|
|
14
|
+
return LIST_ITEM_TYPE;
|
|
15
|
+
}
|
|
16
|
+
static clone(node) {
|
|
17
|
+
return new ListItemNode(node.__value, node.__checked, node.__key);
|
|
18
|
+
}
|
|
19
|
+
constructor(value, checked, key) {
|
|
20
|
+
super(key);
|
|
21
|
+
this.__value = value === undefined ? 1 : value;
|
|
22
|
+
this.__checked = checked;
|
|
23
|
+
}
|
|
24
|
+
createDOM(config) {
|
|
25
|
+
const element = document.createElement("li");
|
|
26
|
+
const parent = this.getParent();
|
|
27
|
+
if ($isListNode(parent) && parent.getListType() === "check") {
|
|
28
|
+
updateListItemChecked(element, this, null, parent);
|
|
68
29
|
}
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
node.remove();
|
|
78
|
-
} else {
|
|
79
|
-
(0, _get2.default)((0, _getPrototypeOf2.default)(ListItemNode.prototype), "append", this).call(this, node);
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
return this;
|
|
30
|
+
element.value = this.__value;
|
|
31
|
+
$setListItemThemeClassNames(element, config.theme, this);
|
|
32
|
+
return element;
|
|
33
|
+
}
|
|
34
|
+
updateDOM(prevNode, dom, config) {
|
|
35
|
+
const parent = this.getParent();
|
|
36
|
+
if ($isListNode(parent) && parent.getListType() === "check") {
|
|
37
|
+
updateListItemChecked(dom, this, prevNode, parent);
|
|
83
38
|
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
39
|
+
// @ts-expect-error - this is always HTMLListItemElement
|
|
40
|
+
dom.value = this.__value;
|
|
41
|
+
$setListItemThemeClassNames(dom, config.theme, this);
|
|
42
|
+
return false;
|
|
43
|
+
}
|
|
44
|
+
static importDOM() {
|
|
45
|
+
return {
|
|
46
|
+
li: () => ({
|
|
47
|
+
conversion: convertListItemElement,
|
|
48
|
+
priority: 0
|
|
49
|
+
})
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
static importJSON(serializedNode) {
|
|
53
|
+
const node = new ListItemNode(serializedNode.value, serializedNode.checked);
|
|
54
|
+
node.setFormat(serializedNode.format);
|
|
55
|
+
node.setIndent(serializedNode.indent);
|
|
56
|
+
node.setDirection(serializedNode.direction);
|
|
57
|
+
return node;
|
|
58
|
+
}
|
|
59
|
+
exportJSON() {
|
|
60
|
+
return {
|
|
61
|
+
...super.exportJSON(),
|
|
62
|
+
checked: this.getChecked(),
|
|
63
|
+
type: LIST_ITEM_TYPE,
|
|
64
|
+
value: this.getValue()
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
append(...nodes) {
|
|
68
|
+
for (let i = 0; i < nodes.length; i++) {
|
|
69
|
+
const node = nodes[i];
|
|
70
|
+
if ($isElementNode(node) && this.canMergeWith(node)) {
|
|
71
|
+
const children = node.getChildren();
|
|
72
|
+
this.append(...children);
|
|
73
|
+
node.remove();
|
|
99
74
|
} else {
|
|
100
|
-
|
|
101
|
-
var newList = (0, _ListNode.$createListNode)(list.getListType());
|
|
102
|
-
var nextSibling = this.getNextSibling();
|
|
103
|
-
while (nextSibling) {
|
|
104
|
-
var nodeToAppend = nextSibling;
|
|
105
|
-
nextSibling = nextSibling.getNextSibling();
|
|
106
|
-
newList.append(nodeToAppend);
|
|
107
|
-
}
|
|
108
|
-
list.insertAfter(replaceWithNode);
|
|
109
|
-
replaceWithNode.insertAfter(newList);
|
|
110
|
-
}
|
|
111
|
-
if (includeChildren) {
|
|
112
|
-
this.getChildren().forEach(function (child) {
|
|
113
|
-
replaceWithNode.append(child);
|
|
114
|
-
});
|
|
115
|
-
}
|
|
116
|
-
this.remove();
|
|
117
|
-
if (list.getChildrenSize() === 0) {
|
|
118
|
-
list.remove();
|
|
75
|
+
super.append(node);
|
|
119
76
|
}
|
|
77
|
+
}
|
|
78
|
+
return this;
|
|
79
|
+
}
|
|
80
|
+
replace(replaceWithNode, includeChildren) {
|
|
81
|
+
if ($isListItemNode(replaceWithNode)) {
|
|
82
|
+
return super.replace(replaceWithNode);
|
|
83
|
+
}
|
|
84
|
+
this.setIndent(0);
|
|
85
|
+
const list = this.getParentOrThrow();
|
|
86
|
+
if (!$isListNode(list)) {
|
|
120
87
|
return replaceWithNode;
|
|
121
88
|
}
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
if ((0, _ListNode.$isListNode)(afterListNode)) {
|
|
135
|
-
(0, _formatList.updateChildrenListItemValue)(afterListNode);
|
|
136
|
-
}
|
|
137
|
-
return after;
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
// Attempt to merge if the list is of the same type.
|
|
141
|
-
|
|
142
|
-
if ((0, _ListNode.$isListNode)(node) && node.getListType() === listNode.getListType()) {
|
|
143
|
-
var child = node;
|
|
144
|
-
var children = node.getChildren();
|
|
145
|
-
for (var i = children.length - 1; i >= 0; i--) {
|
|
146
|
-
child = children[i];
|
|
147
|
-
this.insertAfter(child);
|
|
148
|
-
}
|
|
149
|
-
return child;
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
// Otherwise, split the list
|
|
153
|
-
// Split the lists and insert the node in between them
|
|
154
|
-
listNode.insertAfter(node);
|
|
155
|
-
if (siblings.length !== 0) {
|
|
156
|
-
var newListNode = (0, _ListNode.$createListNode)(listNode.getListType());
|
|
157
|
-
siblings.forEach(function (sibling) {
|
|
158
|
-
return newListNode.append(sibling);
|
|
159
|
-
});
|
|
160
|
-
node.insertAfter(newListNode);
|
|
89
|
+
if (list.__first === this.getKey()) {
|
|
90
|
+
list.insertBefore(replaceWithNode);
|
|
91
|
+
} else if (list.__last === this.getKey()) {
|
|
92
|
+
list.insertAfter(replaceWithNode);
|
|
93
|
+
} else {
|
|
94
|
+
// Split the list
|
|
95
|
+
const newList = $createListNode(list.getListType());
|
|
96
|
+
let nextSibling = this.getNextSibling();
|
|
97
|
+
while (nextSibling) {
|
|
98
|
+
const nodeToAppend = nextSibling;
|
|
99
|
+
nextSibling = nextSibling.getNextSibling();
|
|
100
|
+
newList.append(nodeToAppend);
|
|
161
101
|
}
|
|
162
|
-
|
|
102
|
+
list.insertAfter(replaceWithNode);
|
|
103
|
+
replaceWithNode.insertAfter(newList);
|
|
163
104
|
}
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
var prevSibling = this.getPreviousSibling();
|
|
168
|
-
var nextSibling = this.getNextSibling();
|
|
169
|
-
(0, _get2.default)((0, _getPrototypeOf2.default)(ListItemNode.prototype), "remove", this).call(this, preserveEmptyParent);
|
|
170
|
-
if (prevSibling && nextSibling && (0, _listNode.isNestedListNode)(prevSibling) && (0, _listNode.isNestedListNode)(nextSibling)) {
|
|
171
|
-
(0, _formatList.mergeLists)(prevSibling.getFirstChild(), nextSibling.getFirstChild());
|
|
172
|
-
nextSibling.remove();
|
|
173
|
-
} else if (nextSibling) {
|
|
174
|
-
var parent = nextSibling.getParent();
|
|
175
|
-
if ((0, _ListNode.$isListNode)(parent)) {
|
|
176
|
-
(0, _formatList.updateChildrenListItemValue)(parent);
|
|
177
|
-
}
|
|
105
|
+
if (includeChildren) {
|
|
106
|
+
if (!$isElementNode(replaceWithNode)) {
|
|
107
|
+
throw Error("includeChildren should only be true for ElementNodes");
|
|
178
108
|
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
key: "insertNewAfter",
|
|
182
|
-
value: function insertNewAfter() {
|
|
183
|
-
var newElement = $createListItemNode(this.__checked == null ? undefined : false);
|
|
184
|
-
this.insertAfter(newElement);
|
|
185
|
-
return newElement;
|
|
186
|
-
}
|
|
187
|
-
}, {
|
|
188
|
-
key: "collapseAtStart",
|
|
189
|
-
value: function collapseAtStart(selection) {
|
|
190
|
-
var paragraph = (0, _ParagraphNode.$createParagraphNode)();
|
|
191
|
-
var children = this.getChildren();
|
|
192
|
-
children.forEach(function (child) {
|
|
193
|
-
return paragraph.append(child);
|
|
109
|
+
this.getChildren().forEach(child => {
|
|
110
|
+
replaceWithNode.append(child);
|
|
194
111
|
});
|
|
195
|
-
var listNode = this.getParentOrThrow();
|
|
196
|
-
var listNodeParent = listNode.getParentOrThrow();
|
|
197
|
-
var isIndented = $isListItemNode(listNodeParent);
|
|
198
|
-
if (listNode.getChildrenSize() === 1) {
|
|
199
|
-
if (isIndented) {
|
|
200
|
-
// if the list node is nested, we just want to remove it,
|
|
201
|
-
// effectively unindenting it.
|
|
202
|
-
listNode.remove();
|
|
203
|
-
listNodeParent.select();
|
|
204
|
-
} else {
|
|
205
|
-
listNode.replace(paragraph);
|
|
206
|
-
// If we have selection on the list item, we'll need to move it
|
|
207
|
-
// to the paragraph
|
|
208
|
-
var anchor = selection.anchor;
|
|
209
|
-
var focus = selection.focus;
|
|
210
|
-
var key = paragraph.getKey();
|
|
211
|
-
if (anchor.type === "element" && anchor.getNode().is(this)) {
|
|
212
|
-
anchor.set(key, anchor.offset, "element");
|
|
213
|
-
}
|
|
214
|
-
if (focus.type === "element" && focus.getNode().is(this)) {
|
|
215
|
-
focus.set(key, focus.offset, "element");
|
|
216
|
-
}
|
|
217
|
-
}
|
|
218
|
-
} else {
|
|
219
|
-
listNode.insertBefore(paragraph);
|
|
220
|
-
this.remove();
|
|
221
|
-
}
|
|
222
|
-
return true;
|
|
223
|
-
}
|
|
224
|
-
}, {
|
|
225
|
-
key: "getValue",
|
|
226
|
-
value: function getValue() {
|
|
227
|
-
var self = this.getLatest();
|
|
228
|
-
return self.__value;
|
|
229
112
|
}
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
var self = this.getWritable();
|
|
234
|
-
self.__value = value;
|
|
113
|
+
this.remove();
|
|
114
|
+
if (list.getChildrenSize() === 0) {
|
|
115
|
+
list.remove();
|
|
235
116
|
}
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
key: "setChecked",
|
|
244
|
-
value: function setChecked(checked) {
|
|
245
|
-
var self = this.getWritable();
|
|
246
|
-
self.__checked = checked;
|
|
117
|
+
return replaceWithNode;
|
|
118
|
+
}
|
|
119
|
+
insertAfter(node) {
|
|
120
|
+
const listNode = this.getParentOrThrow();
|
|
121
|
+
if (!$isListNode(listNode)) {
|
|
122
|
+
console.log("insertAfter: webiny list node is not parent of list item node");
|
|
123
|
+
return listNode;
|
|
247
124
|
}
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
return this.getLatest().__indent;
|
|
255
|
-
}
|
|
256
|
-
// ListItemNode should always have a ListNode for a parent.
|
|
257
|
-
var listNodeParent = parent.getParentOrThrow();
|
|
258
|
-
var indentLevel = 0;
|
|
259
|
-
while ($isListItemNode(listNodeParent)) {
|
|
260
|
-
listNodeParent = listNodeParent.getParentOrThrow().getParentOrThrow();
|
|
261
|
-
indentLevel++;
|
|
125
|
+
const siblings = this.getNextSiblings();
|
|
126
|
+
if ($isListItemNode(node)) {
|
|
127
|
+
const after = super.insertAfter(node);
|
|
128
|
+
const afterListNode = node.getParentOrThrow();
|
|
129
|
+
if ($isListNode(afterListNode)) {
|
|
130
|
+
updateChildrenListItemValue(afterListNode);
|
|
262
131
|
}
|
|
263
|
-
return
|
|
132
|
+
return after;
|
|
264
133
|
}
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
(0, _formatList.$handleOutdent)([this]);
|
|
275
|
-
currentIndent--;
|
|
276
|
-
}
|
|
134
|
+
|
|
135
|
+
// Attempt to merge if the list is of the same type.
|
|
136
|
+
|
|
137
|
+
if ($isListNode(node) && node.getListType() === listNode.getListType()) {
|
|
138
|
+
let child = node;
|
|
139
|
+
const children = node.getChildren();
|
|
140
|
+
for (let i = children.length - 1; i >= 0; i--) {
|
|
141
|
+
child = children[i];
|
|
142
|
+
this.insertAfter(child);
|
|
277
143
|
}
|
|
278
|
-
return
|
|
144
|
+
return child;
|
|
279
145
|
}
|
|
280
|
-
}, {
|
|
281
|
-
key: "canIndent",
|
|
282
|
-
value: function canIndent() {
|
|
283
|
-
// Indent/outdent is handled specifically in the RichText logic.
|
|
284
146
|
|
|
285
|
-
|
|
147
|
+
// Otherwise, split the list
|
|
148
|
+
// Split the lists and insert the node in between them
|
|
149
|
+
listNode.insertAfter(node);
|
|
150
|
+
if (siblings.length !== 0) {
|
|
151
|
+
const newListNode = $createListNode(listNode.getListType());
|
|
152
|
+
siblings.forEach(sibling => newListNode.append(sibling));
|
|
153
|
+
node.insertAfter(newListNode);
|
|
286
154
|
}
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
155
|
+
return node;
|
|
156
|
+
}
|
|
157
|
+
remove(preserveEmptyParent) {
|
|
158
|
+
const prevSibling = this.getPreviousSibling();
|
|
159
|
+
const nextSibling = this.getNextSibling();
|
|
160
|
+
super.remove(preserveEmptyParent);
|
|
161
|
+
if (prevSibling && nextSibling && isNestedListNode(prevSibling) && isNestedListNode(nextSibling)) {
|
|
162
|
+
mergeLists(prevSibling.getFirstChild(), nextSibling.getFirstChild());
|
|
163
|
+
nextSibling.remove();
|
|
164
|
+
} else if (nextSibling) {
|
|
165
|
+
const parent = nextSibling.getParent();
|
|
166
|
+
if ($isListNode(parent)) {
|
|
167
|
+
updateChildrenListItemValue(parent);
|
|
296
168
|
}
|
|
297
|
-
return (0, _get2.default)((0, _getPrototypeOf2.default)(ListItemNode.prototype), "insertBefore", this).call(this, nodeToInsert);
|
|
298
169
|
}
|
|
299
|
-
}
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
170
|
+
}
|
|
171
|
+
insertNewAfter() {
|
|
172
|
+
const newElement = $createListItemNode(this.__checked == null ? undefined : false);
|
|
173
|
+
this.insertAfter(newElement);
|
|
174
|
+
return newElement;
|
|
175
|
+
}
|
|
176
|
+
collapseAtStart(selection) {
|
|
177
|
+
const paragraph = $createParagraphNode();
|
|
178
|
+
const children = this.getChildren();
|
|
179
|
+
children.forEach(child => paragraph.append(child));
|
|
180
|
+
const listNode = this.getParentOrThrow();
|
|
181
|
+
const listNodeParent = listNode.getParentOrThrow();
|
|
182
|
+
const isIndented = $isListItemNode(listNodeParent);
|
|
183
|
+
if (listNode.getChildrenSize() === 1) {
|
|
184
|
+
if (isIndented) {
|
|
185
|
+
// if the list node is nested, we just want to remove it,
|
|
186
|
+
// effectively unindenting it.
|
|
187
|
+
listNode.remove();
|
|
188
|
+
listNodeParent.select();
|
|
189
|
+
} else {
|
|
190
|
+
listNode.replace(paragraph);
|
|
191
|
+
// If we have selection on the list item, we'll need to move it
|
|
192
|
+
// to the paragraph
|
|
193
|
+
const anchor = selection.anchor;
|
|
194
|
+
const focus = selection.focus;
|
|
195
|
+
const key = paragraph.getKey();
|
|
196
|
+
if (anchor.type === "element" && anchor.getNode().is(this)) {
|
|
197
|
+
anchor.set(key, anchor.offset, "element");
|
|
198
|
+
}
|
|
199
|
+
if (focus.type === "element" && focus.getNode().is(this)) {
|
|
200
|
+
focus.set(key, focus.offset, "element");
|
|
201
|
+
}
|
|
202
|
+
}
|
|
203
|
+
} else {
|
|
204
|
+
listNode.insertBefore(paragraph);
|
|
205
|
+
this.remove();
|
|
303
206
|
}
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
207
|
+
return true;
|
|
208
|
+
}
|
|
209
|
+
getValue() {
|
|
210
|
+
const self = this.getLatest();
|
|
211
|
+
return self.__value;
|
|
212
|
+
}
|
|
213
|
+
setValue(value) {
|
|
214
|
+
const self = this.getWritable();
|
|
215
|
+
self.__value = value;
|
|
216
|
+
}
|
|
217
|
+
getChecked() {
|
|
218
|
+
const self = this.getLatest();
|
|
219
|
+
return self.__checked;
|
|
220
|
+
}
|
|
221
|
+
setChecked(checked) {
|
|
222
|
+
const self = this.getWritable();
|
|
223
|
+
self.__checked = checked;
|
|
224
|
+
}
|
|
225
|
+
getIndent() {
|
|
226
|
+
// If we don't have a parent, we are likely serializing
|
|
227
|
+
const parent = this.getParent();
|
|
228
|
+
if (parent === null) {
|
|
229
|
+
return this.getLatest().__indent;
|
|
308
230
|
}
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
231
|
+
// ListItemNode should always have a ListNode for a parent.
|
|
232
|
+
let listNodeParent = parent.getParentOrThrow();
|
|
233
|
+
let indentLevel = 0;
|
|
234
|
+
while ($isListItemNode(listNodeParent)) {
|
|
235
|
+
listNodeParent = listNodeParent.getParentOrThrow().getParentOrThrow();
|
|
236
|
+
indentLevel++;
|
|
313
237
|
}
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
238
|
+
return indentLevel;
|
|
239
|
+
}
|
|
240
|
+
setIndent(indent) {
|
|
241
|
+
let currentIndent = this.getIndent();
|
|
242
|
+
while (currentIndent !== indent) {
|
|
243
|
+
if (currentIndent < indent) {
|
|
244
|
+
$handleIndent([this]);
|
|
245
|
+
currentIndent++;
|
|
246
|
+
} else {
|
|
247
|
+
$handleOutdent([this]);
|
|
248
|
+
currentIndent--;
|
|
319
249
|
}
|
|
320
|
-
var anchorNode = selection.anchor.getNode();
|
|
321
|
-
var focusNode = selection.focus.getNode();
|
|
322
|
-
return this.isParentOf(anchorNode) && this.isParentOf(focusNode) && this.getTextContent().length === selection.getTextContent().length;
|
|
323
250
|
}
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
/** @internal */
|
|
251
|
+
return this;
|
|
252
|
+
}
|
|
253
|
+
canIndent() {
|
|
254
|
+
// Indent/outdent is handled specifically in the RichText logic.
|
|
329
255
|
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
key: "importDOM",
|
|
340
|
-
value: function importDOM() {
|
|
341
|
-
return {
|
|
342
|
-
li: function li() {
|
|
343
|
-
return {
|
|
344
|
-
conversion: convertListItemElement,
|
|
345
|
-
priority: 0
|
|
346
|
-
};
|
|
347
|
-
}
|
|
348
|
-
};
|
|
256
|
+
return false;
|
|
257
|
+
}
|
|
258
|
+
insertBefore(nodeToInsert) {
|
|
259
|
+
if ($isListItemNode(nodeToInsert)) {
|
|
260
|
+
const parent = this.getParentOrThrow();
|
|
261
|
+
if ($isListNode(parent)) {
|
|
262
|
+
const siblings = this.getNextSiblings();
|
|
263
|
+
updateChildrenListItemValue(parent, siblings);
|
|
264
|
+
}
|
|
349
265
|
}
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
266
|
+
return super.insertBefore(nodeToInsert);
|
|
267
|
+
}
|
|
268
|
+
canInsertAfter(node) {
|
|
269
|
+
return $isListNode(node);
|
|
270
|
+
}
|
|
271
|
+
canReplaceWith(replacement) {
|
|
272
|
+
return $isListItemNode(replacement);
|
|
273
|
+
}
|
|
274
|
+
canMergeWith(node) {
|
|
275
|
+
return $isParagraphNode(node) || $isListItemNode(node);
|
|
276
|
+
}
|
|
277
|
+
extractWithChild(child, selection) {
|
|
278
|
+
if (!$isRangeSelection(selection)) {
|
|
279
|
+
return false;
|
|
358
280
|
}
|
|
359
|
-
|
|
360
|
-
|
|
281
|
+
const anchorNode = selection.anchor.getNode();
|
|
282
|
+
const focusNode = selection.focus.getNode();
|
|
283
|
+
return this.isParentOf(anchorNode) && this.isParentOf(focusNode) && this.getTextContent().length === selection.getTextContent().length;
|
|
284
|
+
}
|
|
285
|
+
}
|
|
361
286
|
function $setListItemThemeClassNames(dom, editorThemeClasses, node) {
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
287
|
+
const classesToAdd = [];
|
|
288
|
+
const classesToRemove = [];
|
|
289
|
+
const listTheme = editorThemeClasses.list;
|
|
290
|
+
const listItemClassName = listTheme ? listTheme.listitem : undefined;
|
|
291
|
+
let nestedListItemClassName;
|
|
367
292
|
if (listTheme && listTheme.nested) {
|
|
368
293
|
nestedListItemClassName = listTheme.nested.listitem;
|
|
369
294
|
}
|
|
370
295
|
if (listItemClassName !== undefined) {
|
|
371
|
-
|
|
372
|
-
classesToAdd.push
|
|
296
|
+
const listItemClasses = listItemClassName.split(" ");
|
|
297
|
+
classesToAdd.push(...listItemClasses);
|
|
373
298
|
}
|
|
374
299
|
if (listTheme) {
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
300
|
+
const parentNode = node.getParent();
|
|
301
|
+
const isCheckList = $isListNode(parentNode) && parentNode?.getListType() === "check";
|
|
302
|
+
const checked = node.getChecked();
|
|
378
303
|
if (!isCheckList || checked) {
|
|
379
304
|
classesToRemove.push(listTheme.listitemUnchecked);
|
|
380
305
|
}
|
|
@@ -386,27 +311,25 @@ function $setListItemThemeClassNames(dom, editorThemeClasses, node) {
|
|
|
386
311
|
}
|
|
387
312
|
}
|
|
388
313
|
if (nestedListItemClassName !== undefined) {
|
|
389
|
-
|
|
390
|
-
if (node.getChildren().some(
|
|
391
|
-
|
|
392
|
-
})) {
|
|
393
|
-
classesToAdd.push.apply(classesToAdd, (0, _toConsumableArray2.default)(nestedListItemClasses));
|
|
314
|
+
const nestedListItemClasses = nestedListItemClassName.split(" ");
|
|
315
|
+
if (node.getChildren().some(child => $isListNode(child))) {
|
|
316
|
+
classesToAdd.push(...nestedListItemClasses);
|
|
394
317
|
} else {
|
|
395
|
-
classesToRemove.push
|
|
318
|
+
classesToRemove.push(...nestedListItemClasses);
|
|
396
319
|
}
|
|
397
320
|
}
|
|
398
321
|
if (classesToRemove.length > 0) {
|
|
399
|
-
|
|
322
|
+
removeClassNamesFromElement(dom, ...classesToRemove);
|
|
400
323
|
}
|
|
401
324
|
if (classesToAdd.length > 0) {
|
|
402
|
-
|
|
325
|
+
addClassNamesToElement(dom, ...classesToAdd);
|
|
403
326
|
}
|
|
404
327
|
}
|
|
405
328
|
function updateListItemChecked(dom, listItemNode, prevListItemNode, listNode) {
|
|
406
|
-
|
|
329
|
+
const isCheckList = listNode.getListType() === "check";
|
|
407
330
|
if (isCheckList) {
|
|
408
331
|
// Only add attributes for leaf list items
|
|
409
|
-
if (
|
|
332
|
+
if ($isListNode(listItemNode.getFirstChild())) {
|
|
410
333
|
dom.removeAttribute("role");
|
|
411
334
|
dom.removeAttribute("tabIndex");
|
|
412
335
|
dom.removeAttribute("aria-checked");
|
|
@@ -429,10 +352,10 @@ function convertListItemElement() {
|
|
|
429
352
|
node: $createListItemNode()
|
|
430
353
|
};
|
|
431
354
|
}
|
|
432
|
-
function $createListItemNode(checked) {
|
|
355
|
+
export function $createListItemNode(checked) {
|
|
433
356
|
return new ListItemNode(undefined, checked);
|
|
434
357
|
}
|
|
435
|
-
function $isListItemNode(node) {
|
|
358
|
+
export function $isListItemNode(node) {
|
|
436
359
|
return node instanceof ListItemNode;
|
|
437
360
|
}
|
|
438
361
|
|