// core/ui-state/js/tab-controller.js — generic, root-scoped top-tab host.
//
// Owns ONLY the show/hide contract: toggle `.active` on `.main-tab-button[data-tab]`
// and `.tab-pane[data-tab]` within a single root element. It has no app/feature
// knowledge and binds no listeners of its own — consumers wire their own triggers
// (inline onclick or a delegated listener) and call switch(). Scoping every query
// to `root` lets several hosts coexist on one page (e.g. the per-app detail tabs
// and the fleet Overview tabs) without cross-talk, and matching panes by a
// data-tab attribute (not id) avoids duplicate-id collisions between hosts.
class TabController {
  constructor(root) {
    this.root = typeof root === 'string' ? document.querySelector(root) : root;
    this.current = null;
  }

  switch(tabId) {
    if (!this.root || !tabId) return;
    this.root.querySelectorAll('.main-tab-button[data-tab]').forEach((b) => {
      b.classList.toggle('active', b.dataset.tab === tabId);
    });
    this.root.querySelectorAll('.tab-pane[data-tab]').forEach((p) => {
      p.classList.toggle('active', p.dataset.tab === tabId);
    });
    this.current = tabId;
  }
}

window.TabController = TabController;
