frontAnswerer/src/widgets/popup/PopupWidget.tsx

import { Root, createRoot } from "react-dom/client";
import QuizDialog from "../shared/QuizDialog";


export class PopupWidget {
    root: Root | undefined;
    element: HTMLDivElement;

    constructor({ quizId }: {
        quizId: string;
    }) {
        this.element = document.createElement("div");
        this.element.style.setProperty("display", "none");
        document.body.appendChild(this.element);

        this.root = createRoot(this.element);

        this.root.render(
            <QuizDialog
                quizId={quizId}
                onClose={() => this.destroy()}
            />
        );
    }

    destroy() {
        if (this.root) this.root.unmount();
        this.element.remove();
    }
}