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