import { PopupWidgetParams } from "@/model/widget/popup";
import { Root, createRoot } from "react-dom/client";
import QuizPopup from "./QuizPopup";

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

  constructor(props: PopupWidgetParams) {
    this.element.style.setProperty("display", "none");
    document.body.appendChild(this.element);

    this.root = createRoot(this.element);

    this.render(props);
  }

  render(props: PopupWidgetParams) {
    this.root?.render(<QuizPopup {...props} />);
  }

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