import { deleteTooltip } from "./tooltip.js";
import { deleteMetadata } from "./metadata.js";

export class DomList {
  list;
  template;

  constructor(rootElem, templateElement = undefined) {
    this.list = rootElem;
    this.template = (templateElement ?? this.list.querySelector("template"))
        .content.firstElementChild;
  }

  clear() {
    this.list.querySelectorAll("[data-tooltip]")
        .forEach(e => deleteTooltip(Number(e.dataset.tooltip)));
    this.list.querySelectorAll("[data-solver-metadata]")
        .forEach(e => deleteMetadata(Number(e.dataset.solverMetadata)));
    this.list.replaceChildren(...this.list.querySelectorAll(":scope > template, :scope > [data-keep]"));
  }

  makeItem() {
    return document.importNode(this.template, true);
  }

  addItem(item) {
    this.list.appendChild(item);
  }
}