"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = require("react");
const LexicalComposerContext_1 = require("@lexical/react/LexicalComposerContext");
const lexical_1 = require("lexical");
const html_1 = require("@lexical/html");
function DefaultHtmlValuePlugin({ defaultValue }) {
    const [editor] = (0, LexicalComposerContext_1.useLexicalComposerContext)();
    (0, react_1.useEffect)(() => {
        if (!defaultValue) {
            return;
        }
        editor.update(() => {
            // See:
            // https://github.com/facebook/lexical/issues/1834
            // https://github.com/facebook/lexical/issues/2328
            // In the browser you can use the native DOMParser API to parse the HTML string.
            const parser = new DOMParser();
            const dom = parser.parseFromString(defaultValue, 'text/html');
            // Once you have the DOM instance it's easy to generate LexicalNodes.
            const nodes = (0, html_1.$generateNodesFromDOM)(editor, dom);
            // Select the root
            const root = (0, lexical_1.$getRoot)();
            // Add nodes
            if (nodes.length <= 1) {
                const paragraphNode = (0, lexical_1.$createParagraphNode)();
                nodes.forEach((node) => paragraphNode.append(node));
                root.getFirstChild().replace(paragraphNode).selectEnd();
            }
            else {
                root.getFirstChild().remove();
                nodes.forEach((node) => {
                    if ((0, lexical_1.$isElementNode)(node) || (0, lexical_1.$isDecoratorNode)(node)) {
                        root.append(node);
                    }
                });
                root.selectEnd();
            }
        });
    }, []);
    return null;
}
exports.default = DefaultHtmlValuePlugin;
