import { Root, createRoot } from "react-dom/client";
import OpenQuizButton from "./OpenQuizButton";
import { ComponentPropsWithoutRef } from "react";


export class ButtonWidget {
    root: Root | undefined;
    element = document.createElement("div");

    constructor({ quizId, selector, fixedSide }: ComponentPropsWithoutRef<typeof OpenQuizButton>) {
        if (!fixedSide && !selector) throw new Error("ButtonWidget: Either selector or fixedSide params must be provided");

        this.element.style.setProperty("display", "none");
        document.body.appendChild(this.element);

        this.root = createRoot(this.element);

        this.root.render(
            <OpenQuizButton
                selector={selector}
                fixedSide={fixedSide}
                quizId={quizId}
            />
        );
    }

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