"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.WMermaidNodeView = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const uikit_1 = require("@gravity-ui/uikit");
const ReactRenderer_1 = require("../../../behavior/ReactRenderer/index.js");
const entity_id_1 = require("../../../../utils/entity-id.js");
const const_1 = require("../MermaidSpecs/const.js");
const MermaidView_1 = require("./MermaidView.js");
let mermaidInstance;
class WMermaidNodeView {
    dom;
    node;
    view;
    getPos;
    renderItem;
    loadRuntimeScript;
    options;
    constructor(node, view, getPos, opts) {
        const { loadRuntimeScript } = opts;
        this.node = node;
        this.dom = document.createElement('div');
        this.dom.classList.add('mermaid-container');
        this.dom.contentEditable = 'false';
        this.view = view;
        this.getPos = getPos;
        this.loadRuntimeScript = loadRuntimeScript;
        this.options = opts;
        this.initializeMermaid();
        this.renderItem = (0, ReactRenderer_1.getReactRendererFromState)(view.state).createItem('mermaid-view', this.renderMermaid.bind(this));
        this.validateEntityId();
    }
    initializeMermaid() {
        // https://github.com/diplodoc-platform/mermaid-extension/tree/master#prepared-mermaid-runtime
        window.mermaidJsonp = window.mermaidJsonp || [];
        window.mermaidJsonp.push((mermaid) => {
            mermaidInstance = mermaid;
        });
        this.loadRuntimeScript();
    }
    update(node) {
        if (node.type !== this.node.type)
            return false;
        this.node = node;
        this.renderItem.rerender();
        return true;
    }
    destroy() {
        this.renderItem.remove();
    }
    ignoreMutation() {
        return true;
    }
    stopEvent(e) {
        const target = e.target;
        return target.classList.contains(MermaidView_1.STOP_EVENT_CLASSNAME);
    }
    validateEntityId() {
        if ((0, entity_id_1.isInvalidEntityId)({
            node: this.node,
            doc: this.view.state.doc,
            defaultId: const_1.defaultMermaidEntityId,
        })) {
            const newId = (0, entity_id_1.generateEntityId)(const_1.MermaidConsts.NodeName);
            this.view.dispatch(this.view.state.tr.setNodeAttribute(this.getPos(), const_1.MermaidConsts.NodeAttrs.EntityId, newId));
        }
    }
    onChange(attrs) {
        const pos = this.getPos();
        if (pos === undefined)
            return;
        const tr = this.view.state.tr.setNodeMarkup(pos, undefined, {
            ...this.node.attrs,
            ...attrs,
        }, []);
        this.view.dispatch(tr);
    }
    getMermaidInstance = () => mermaidInstance;
    renderMermaid() {
        return ((0, jsx_runtime_1.jsx)(uikit_1.Portal, { container: this.dom, children: (0, jsx_runtime_1.jsx)(MermaidView_1.MermaidView, { view: this.view, onChange: this.onChange.bind(this), node: this.node, getMermaidInstance: this.getMermaidInstance, getPos: this.getPos, options: this.options }) }));
    }
}
exports.WMermaidNodeView = WMermaidNodeView;
//# sourceMappingURL=NodeView.js.map
