chore: use generateNodesFromDOM from core

This commit is contained in:
Aman Harwara
2023-05-04 23:01:56 +05:30
parent c7d28d2b2f
commit 74f8f9fafe
3 changed files with 2 additions and 137 deletions

View File

@@ -1,5 +1,5 @@
import { $createParagraphNode, $getRoot, $insertNodes, LexicalNode } from 'lexical'
import { $generateNodesFromDOM } from '../SuperEditor/Lexical/Utils/generateNodesFromDOM'
import { $generateNodesFromDOM } from '@lexical/html'
import { createHeadlessEditor } from '@lexical/headless'
import { BlockEditorNodes } from '../SuperEditor/Lexical/Nodes/AllNodes'
import BlocksEditorTheme from '../SuperEditor/Lexical/Theme/Theme'

View File

@@ -1,135 +0,0 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*/
import { $isElementNode, DOMChildConversion, DOMConversion, DOMConversionFn, LexicalEditor, LexicalNode } from 'lexical'
/**
* How you parse your html string to get a document is left up to you. In the browser you can use the native
* DOMParser API to generate a document (see clipboard.ts), but to use in a headless environment you can use JSDom
* or an equivilant library and pass in the document here.
*/
export function $generateNodesFromDOM(editor: LexicalEditor, dom: Document): Array<LexicalNode> {
let lexicalNodes: Array<LexicalNode> = []
const elements = dom.body ? dom.body.childNodes : []
for (let i = 0; i < elements.length; i++) {
const element = elements[i]
if (!IGNORE_TAGS.has(element.nodeName)) {
const lexicalNode = $createNodesFromDOM(element, editor)
if (lexicalNode !== null) {
lexicalNodes = lexicalNodes.concat(lexicalNode)
}
}
}
return lexicalNodes
}
function getConversionFunction(domNode: Node, editor: LexicalEditor): DOMConversionFn | null {
const { nodeName } = domNode
const cachedConversions = editor._htmlConversions.get(nodeName.toLowerCase())
let currentConversion: DOMConversion | null = null
if (cachedConversions !== undefined) {
for (const cachedConversion of cachedConversions) {
const domConversion = cachedConversion(domNode)
if (
domConversion !== null &&
(currentConversion === null || currentConversion.priority < domConversion.priority)
) {
currentConversion = domConversion
}
}
}
return currentConversion !== null ? currentConversion.conversion : null
}
const IGNORE_TAGS = new Set(['STYLE', 'SCRIPT'])
function $createNodesFromDOM(
node: Node,
editor: LexicalEditor,
forChildMap: Map<string, DOMChildConversion> = new Map(),
parentLexicalNode?: LexicalNode | null | undefined,
preformatted = false,
): Array<LexicalNode> {
let lexicalNodes: Array<LexicalNode> = []
if (IGNORE_TAGS.has(node.nodeName)) {
return lexicalNodes
}
let currentLexicalNode = null
const transformFunction = getConversionFunction(node, editor)
const transformOutput = transformFunction ? transformFunction(node as HTMLElement, undefined, preformatted) : null
let postTransform = null
if (transformOutput !== null) {
postTransform = transformOutput.after
currentLexicalNode = transformOutput.node
if (currentLexicalNode !== null) {
for (const [, forChildFunction] of forChildMap) {
currentLexicalNode = forChildFunction(currentLexicalNode, parentLexicalNode)
if (!currentLexicalNode) {
break
}
}
if (currentLexicalNode) {
lexicalNodes.push(currentLexicalNode)
}
}
if (transformOutput.forChild != null) {
forChildMap.set(node.nodeName, transformOutput.forChild)
}
}
// If the DOM node doesn't have a transformer, we don't know what
// to do with it but we still need to process any childNodes.
const children = node.childNodes
let childLexicalNodes = []
for (let i = 0; i < children.length; i++) {
childLexicalNodes.push(
...$createNodesFromDOM(
children[i],
editor,
new Map(forChildMap),
currentLexicalNode,
preformatted || (transformOutput && transformOutput.preformatted) === true,
),
)
}
if (postTransform != null) {
childLexicalNodes = postTransform(childLexicalNodes)
}
if (currentLexicalNode == null) {
// If it hasn't been converted to a LexicalNode, we hoist its children
// up to the same level as it.
lexicalNodes = lexicalNodes.concat(childLexicalNodes)
} else {
if ($isElementNode(currentLexicalNode)) {
// If the current node is a ElementNode after conversion,
// we can append all the children to it.
currentLexicalNode.append(...childLexicalNodes)
}
}
return lexicalNodes
}

View File

@@ -4,7 +4,7 @@ import { $convertFromMarkdownString, TRANSFORMERS } from '@lexical/markdown'
import { $createParagraphNode, $createRangeSelection, LexicalEditor } from 'lexical'
import { handleEditorChange } from '../../Utils'
import { SuperNotePreviewCharLimit } from '../../SuperEditor'
import { $generateNodesFromDOM } from '../../Lexical/Utils/generateNodesFromDOM'
import { $generateNodesFromDOM } from '@lexical/html'
/** Note that markdown conversion does not insert new lines. See: https://github.com/facebook/lexical/issues/2815 */
export default function ImportPlugin({