@lexical/html 0.7.8 → 0.8.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/LexicalHtml.dev.js +4 -40
- package/package.json +3 -3
package/LexicalHtml.dev.js
CHANGED
|
@@ -10,84 +10,68 @@ var selection = require('@lexical/selection');
|
|
|
10
10
|
var lexical = require('lexical');
|
|
11
11
|
|
|
12
12
|
/** @module @lexical/html */
|
|
13
|
+
|
|
13
14
|
/**
|
|
14
15
|
* How you parse your html string to get a document is left up to you. In the browser you can use the native
|
|
15
16
|
* DOMParser API to generate a document (see clipboard.ts), but to use in a headless environment you can use JSDom
|
|
16
17
|
* or an equivilant library and pass in the document here.
|
|
17
18
|
*/
|
|
18
|
-
|
|
19
19
|
function $generateNodesFromDOM(editor, dom) {
|
|
20
20
|
let lexicalNodes = [];
|
|
21
21
|
const elements = dom.body ? Array.from(dom.body.childNodes) : [];
|
|
22
22
|
const elementsLength = elements.length;
|
|
23
|
-
|
|
24
23
|
for (let i = 0; i < elementsLength; i++) {
|
|
25
24
|
const element = elements[i];
|
|
26
|
-
|
|
27
25
|
if (!IGNORE_TAGS.has(element.nodeName)) {
|
|
28
26
|
const lexicalNode = $createNodesFromDOM(element, editor);
|
|
29
|
-
|
|
30
27
|
if (lexicalNode !== null) {
|
|
31
28
|
lexicalNodes = lexicalNodes.concat(lexicalNode);
|
|
32
29
|
}
|
|
33
30
|
}
|
|
34
31
|
}
|
|
35
|
-
|
|
36
32
|
return lexicalNodes;
|
|
37
33
|
}
|
|
38
34
|
function $generateHtmlFromNodes(editor, selection) {
|
|
39
35
|
if (typeof document === 'undefined' || typeof window === 'undefined') {
|
|
40
36
|
throw new Error('To use $generateHtmlFromNodes in headless mode please initialize a headless browser implementation such as JSDom before calling this function.');
|
|
41
37
|
}
|
|
42
|
-
|
|
43
38
|
const container = document.createElement('div');
|
|
44
39
|
const root = lexical.$getRoot();
|
|
45
40
|
const topLevelChildren = root.getChildren();
|
|
46
|
-
|
|
47
41
|
for (let i = 0; i < topLevelChildren.length; i++) {
|
|
48
42
|
const topLevelNode = topLevelChildren[i];
|
|
49
43
|
$appendNodesToHTML(editor, topLevelNode, container, selection);
|
|
50
44
|
}
|
|
51
|
-
|
|
52
45
|
return container.innerHTML;
|
|
53
46
|
}
|
|
54
|
-
|
|
55
47
|
function $appendNodesToHTML(editor, currentNode, parentElement, selection$1 = null) {
|
|
56
48
|
let shouldInclude = selection$1 != null ? currentNode.isSelected() : true;
|
|
57
49
|
const shouldExclude = lexical.$isElementNode(currentNode) && currentNode.excludeFromCopy('html');
|
|
58
50
|
let target = currentNode;
|
|
59
|
-
|
|
60
51
|
if (selection$1 !== null) {
|
|
61
52
|
let clone = selection.$cloneWithProperties(currentNode);
|
|
62
53
|
clone = lexical.$isTextNode(clone) && selection$1 != null ? selection.$sliceSelectedTextNodeContent(selection$1, clone) : clone;
|
|
63
54
|
target = clone;
|
|
64
55
|
}
|
|
65
|
-
|
|
66
56
|
const children = lexical.$isElementNode(target) ? target.getChildren() : [];
|
|
67
57
|
const {
|
|
68
58
|
element,
|
|
69
59
|
after
|
|
70
60
|
} = target.exportDOM(editor);
|
|
71
|
-
|
|
72
61
|
if (!element) {
|
|
73
62
|
return false;
|
|
74
63
|
}
|
|
75
|
-
|
|
76
64
|
const fragment = new DocumentFragment();
|
|
77
|
-
|
|
78
65
|
for (let i = 0; i < children.length; i++) {
|
|
79
66
|
const childNode = children[i];
|
|
80
67
|
const shouldIncludeChild = $appendNodesToHTML(editor, childNode, fragment, selection$1);
|
|
81
|
-
|
|
82
68
|
if (!shouldInclude && lexical.$isElementNode(currentNode) && shouldIncludeChild && currentNode.extractWithChild(childNode, selection$1, 'html')) {
|
|
83
69
|
shouldInclude = true;
|
|
84
70
|
}
|
|
85
71
|
}
|
|
86
|
-
|
|
87
72
|
if (shouldInclude && !shouldExclude) {
|
|
88
73
|
element.append(fragment);
|
|
89
74
|
parentElement.append(element);
|
|
90
|
-
|
|
91
75
|
if (after) {
|
|
92
76
|
const newElement = after.call(target, element);
|
|
93
77
|
if (newElement) element.replaceWith(newElement);
|
|
@@ -95,82 +79,63 @@ function $appendNodesToHTML(editor, currentNode, parentElement, selection$1 = nu
|
|
|
95
79
|
} else {
|
|
96
80
|
parentElement.append(fragment);
|
|
97
81
|
}
|
|
98
|
-
|
|
99
82
|
return shouldInclude;
|
|
100
83
|
}
|
|
101
|
-
|
|
102
84
|
function getConversionFunction(domNode, editor) {
|
|
103
85
|
const {
|
|
104
86
|
nodeName
|
|
105
87
|
} = domNode;
|
|
106
|
-
|
|
107
88
|
const cachedConversions = editor._htmlConversions.get(nodeName.toLowerCase());
|
|
108
|
-
|
|
109
89
|
let currentConversion = null;
|
|
110
|
-
|
|
111
90
|
if (cachedConversions !== undefined) {
|
|
112
91
|
for (const cachedConversion of cachedConversions) {
|
|
113
92
|
const domConversion = cachedConversion(domNode);
|
|
114
|
-
|
|
115
93
|
if (domConversion !== null && (currentConversion === null || currentConversion.priority < domConversion.priority)) {
|
|
116
94
|
currentConversion = domConversion;
|
|
117
95
|
}
|
|
118
96
|
}
|
|
119
97
|
}
|
|
120
|
-
|
|
121
98
|
return currentConversion !== null ? currentConversion.conversion : null;
|
|
122
99
|
}
|
|
123
|
-
|
|
124
100
|
const IGNORE_TAGS = new Set(['STYLE']);
|
|
125
|
-
|
|
126
101
|
function $createNodesFromDOM(node, editor, forChildMap = new Map(), parentLexicalNode, preformatted = false) {
|
|
127
102
|
let lexicalNodes = [];
|
|
128
|
-
|
|
129
103
|
if (IGNORE_TAGS.has(node.nodeName)) {
|
|
130
104
|
return lexicalNodes;
|
|
131
105
|
}
|
|
132
|
-
|
|
133
106
|
let currentLexicalNode = null;
|
|
134
107
|
const transformFunction = getConversionFunction(node, editor);
|
|
135
108
|
const transformOutput = transformFunction ? transformFunction(node, undefined, preformatted) : null;
|
|
136
109
|
let postTransform = null;
|
|
137
|
-
|
|
138
110
|
if (transformOutput !== null) {
|
|
139
111
|
postTransform = transformOutput.after;
|
|
140
112
|
currentLexicalNode = transformOutput.node;
|
|
141
|
-
|
|
142
113
|
if (currentLexicalNode !== null) {
|
|
143
114
|
for (const [, forChildFunction] of forChildMap) {
|
|
144
115
|
currentLexicalNode = forChildFunction(currentLexicalNode, parentLexicalNode);
|
|
145
|
-
|
|
146
116
|
if (!currentLexicalNode) {
|
|
147
117
|
break;
|
|
148
118
|
}
|
|
149
119
|
}
|
|
150
|
-
|
|
151
120
|
if (currentLexicalNode) {
|
|
152
121
|
lexicalNodes.push(currentLexicalNode);
|
|
153
122
|
}
|
|
154
123
|
}
|
|
155
|
-
|
|
156
124
|
if (transformOutput.forChild != null) {
|
|
157
125
|
forChildMap.set(node.nodeName, transformOutput.forChild);
|
|
158
126
|
}
|
|
159
|
-
}
|
|
160
|
-
// to do with it but we still need to process any childNodes.
|
|
161
|
-
|
|
127
|
+
}
|
|
162
128
|
|
|
129
|
+
// If the DOM node doesn't have a transformer, we don't know what
|
|
130
|
+
// to do with it but we still need to process any childNodes.
|
|
163
131
|
const children = node.childNodes;
|
|
164
132
|
let childLexicalNodes = [];
|
|
165
|
-
|
|
166
133
|
for (let i = 0; i < children.length; i++) {
|
|
167
134
|
childLexicalNodes.push(...$createNodesFromDOM(children[i], editor, new Map(forChildMap), currentLexicalNode, preformatted || (transformOutput && transformOutput.preformatted) === true));
|
|
168
135
|
}
|
|
169
|
-
|
|
170
136
|
if (postTransform != null) {
|
|
171
137
|
childLexicalNodes = postTransform(childLexicalNodes);
|
|
172
138
|
}
|
|
173
|
-
|
|
174
139
|
if (currentLexicalNode == null) {
|
|
175
140
|
// If it hasn't been converted to a LexicalNode, we hoist its children
|
|
176
141
|
// up to the same level as it.
|
|
@@ -182,7 +147,6 @@ function $createNodesFromDOM(node, editor, forChildMap = new Map(), parentLexica
|
|
|
182
147
|
currentLexicalNode.append(...childLexicalNodes);
|
|
183
148
|
}
|
|
184
149
|
}
|
|
185
|
-
|
|
186
150
|
return lexicalNodes;
|
|
187
151
|
}
|
|
188
152
|
|
package/package.json
CHANGED
|
@@ -8,10 +8,10 @@
|
|
|
8
8
|
"html"
|
|
9
9
|
],
|
|
10
10
|
"license": "MIT",
|
|
11
|
-
"version": "0.
|
|
11
|
+
"version": "0.8.0",
|
|
12
12
|
"main": "LexicalHtml.js",
|
|
13
13
|
"peerDependencies": {
|
|
14
|
-
"lexical": "0.
|
|
14
|
+
"lexical": "0.8.0"
|
|
15
15
|
},
|
|
16
16
|
"repository": {
|
|
17
17
|
"type": "git",
|
|
@@ -19,6 +19,6 @@
|
|
|
19
19
|
"directory": "packages/lexical-html"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@lexical/selection": "0.
|
|
22
|
+
"@lexical/selection": "0.8.0"
|
|
23
23
|
}
|
|
24
24
|
}
|