import { FeatureGroup, Layer } from 'leaflet';
import { buildOptions } from '../core/utils.js';
import { registerChildren, unregisterChildren, getChildren } from '../core/register.js';

export class LeafletFeatureGroup extends HTMLElement {
  #obj?: FeatureGroup;

  static get observedAttributes() {
    return [];
  }

  connectedCallback() {
    this.#obj = new FeatureGroup([], buildOptions(this, {}));
    registerChildren(this, this.#obj);
  }

  disconnectedCallback() {
    for (const [el, entry] of getChildren(this) ?? []) {
      if (entry.type === 'popup') this.#obj?.unbindPopup();
      else if (entry.type === 'tooltip') this.#obj?.unbindTooltip();
      else if (entry.type === 'layer') this.#obj?.removeLayer(el as unknown as Layer);
    }
    unregisterChildren(this);
    this.#obj?.remove();
    this.#obj = undefined;
  }
}

customElements.define('leaflet-feature-group', LeafletFeatureGroup);