@gravity-ui/graph/build/react-components/layer/ReactLayer.js

Modern graph editor component

import React from "react";
import { createPortal } from "react-dom";
import { Layer } from "../../services/Layer";
import { BlocksList } from "../BlocksList";
export class ReactLayer extends Layer {
    constructor(props) {
        super({
            html: {
                zIndex: 3,
                classNames: ["no-user-select"],
                transformByCameraPosition: true,
            },
            ...props,
        });
    }
    /**
     * Renders React components inside the layer's HTML element using React Portal
     * @param renderBlock Function to render a block component
     * @returns React Portal with BlocksList component
     */
    renderPortal(renderBlock) {
        if (!this.getHTML()) {
            return null;
        }
        return createPortal(React.createElement(BlocksList, {
            graphObject: this.context.graph,
            renderBlock: renderBlock,
        }), this.getHTML(), "graph-blocks-list");
    }
}