var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", { value, configurable: !0 });
import { u as uuidv4, c as checkSetElementId, i as isKeyEvent, k as keyEvents } from "../chunks/chunk.dcf-utility.js?v=6.1.1";
class DCFTabs {
  static {
    __name(this, "DCFTabs");
  }
  uuid = uuidv4();
  options = {};
  /** @type { HTMLElement|null } tabsGroup */
  tabsGroup = null;
  /** @type { HTMLElement|null } tabsList */
  tabsList = null;
  /** @type { HTMLElement[]|null } tabsPanelList */
  tabsPanelList = null;
  tabSwitchedEvent = new Event(DCFTabs.events("tabSwitched"));
  /**
   * Sets up events to be used and reconfigures tabGroups input to correct form
   * @constructor
   * @param { HTMLElement } tabsGroup - Array, Collection, or single tab group element
   * @param { Object } options - Unused
   * @returns { void }
   */
  constructor(tabsGroup, options = {}) {
    if (this.tabsGroup = tabsGroup, this.options = options, this.tabsList = this.tabsGroup.querySelector(".dcf-tabs > ol, .dcf-tabs > ul"), this.tabsPanelList = Array.from(this.tabsGroup.querySelectorAll(".dcf-tabs > div:not(:empty), .dcf-tabs > section:not(:empty)")), (this.tabsGroup.getAttribute("id") === "" || this.tabsGroup.getAttribute("id") === null) && this.tabsGroup.setAttribute("id", checkSetElementId(this.tabsGroup, this.uuid.concat("-tab-group"))), this.tabsPanelList.length === 0)
      throw new Error("No Panels Found", { cause: this.tabsGroup });
    const panelsWithNoIds = this.tabsPanelList.filter((panel) => panel.getAttribute("id") === null);
    if (panelsWithNoIds.length !== 0)
      throw new Error("Panels Missing Ids", { cause: panelsWithNoIds });
    this.tabsList === null && (this.tabsList = document.createElement("ul"), this.tabsPanelList.forEach((singlePanel) => {
      const tabTextElem = singlePanel.querySelector(".dcf-tabs-panel-title"), tabText = tabTextElem !== null ? tabTextElem.innerText : "Untitled", tabHidden = singlePanel.dataset.tabHidden === "true", newTabLinkElem = document.createElement("button");
      newTabLinkElem.innerText = tabText, newTabLinkElem.setAttribute("data-href", `#${singlePanel.getAttribute("id")}`), tabHidden && newTabLinkElem.setAttribute("hidden", "");
      const newTabElem = document.createElement("li");
      newTabElem.append(newTabLinkElem), this.tabsList.append(newTabElem);
    }), this.tabsGroup.insertBefore(this.tabsList, this.tabsPanelList[0])), this.tabsList.classList.add("dcf-tabs-list", "dcf-mb-0", "dcf-pl-0"), this.tabsList.setAttribute("role", "tablist"), this.tabsPanelList.forEach((panel) => {
      panel.setAttribute("role", "tabpanel"), panel.setAttribute("tabindex", "0"), panel.classList.add("dcf-tabs-panel"), panel.setAttribute("hidden", "");
    });
    const tabs = Array.from(this.tabsList.querySelectorAll("a, button"));
    if (tabs.filter((tab) => tab.getAttribute("hidden") === null).length === 0)
      throw new Error("All Tabs Hidden");
    tabs.forEach((tab, tabIndex) => {
      tab.classList.add("dcf-tab", "dcf-d-block"), tab.setAttribute("role", "tab"), tab.setAttribute("tabindex", "-1"), tab.removeAttribute("aria-selected");
      const nextTab = tabIndex + 1;
      tab.setAttribute("id", checkSetElementId(tab, this.uuid.concat("-tab-", nextTab))), tab.parentNode.classList.add("dcf-tabs-list-item", "dcf-mb-0"), tab.parentNode.setAttribute("role", "presentation");
      const tabHref = this.#getTabHref(tab);
      if (tabHref === "" || !tabHref.startsWith("#"))
        throw new Error("Invalid Tab href", { cause: tab });
      const matchingPanel = document.getElementById(tabHref.replace("#", ""));
      if (matchingPanel === null)
        throw new Error("Invalid Tab href reference", { cause: tab });
      matchingPanel.setAttribute("aria-labelledby", tab.getAttribute("id")), this.#setTabEventListeners(tab);
    });
    let selectedTab = null;
    const allNonHiddenTabs = Array.from(this.tabsGroup.querySelectorAll(".dcf-tab:not([hidden])"));
    if (location.hash !== "" && (selectedTab = this.tabsGroup.querySelector(`.dcf-tab[href="${location.hash}"]:not([hidden]), .dcf-tab[data-href="${location.hash}"]:not([hidden]`), selectedTab === null)) {
      const anchoredElement = document.querySelector(location.hash);
      anchoredElement !== null && this.tabsGroup.contains(anchoredElement) && allNonHiddenTabs.forEach((tab) => {
        const tabHref = this.#getTabHref(tab);
        document.getElementById(tabHref.replace("#", "")).contains(anchoredElement) && (selectedTab = tab);
      });
    }
    selectedTab === null && (allNonHiddenTabs.forEach((tab) => {
      const tabHref = this.#getTabHref(tab), matchingPanel = document.getElementById(tabHref.replace("#", ""));
      selectedTab === null && this.#checkPanelInURL(matchingPanel.getAttribute("id")) && (selectedTab = tab);
    }), selectedTab === null && (allNonHiddenTabs.forEach((tab) => {
      const tabHref = this.#getTabHref(tab), matchingPanel = document.getElementById(tabHref.replace("#", ""));
      selectedTab === null && "default" in matchingPanel.dataset && matchingPanel.dataset.default === "true" && (selectedTab = tab);
    }), selectedTab === null && (selectedTab = allNonHiddenTabs[0]))), this.switchTab(selectedTab, !1), this.tabsGroup.classList.add("dcf-tabs-initialized"), this.tabsGroup.removeAttribute("hidden"), this.#setTabGroupEventListeners(this.tabsGroup), this.tabsGroup.dispatchEvent(new CustomEvent(DCFTabs.events("tabsReady"), {
      detail: {
        classInstance: this
      }
    })), this.#scrollToHash(), window.addEventListener("hashchange", () => {
      const tab = this.tabsGroup.querySelector(`.dcf-tab[href="${location.hash}"], .dcf-tab[data-href="${location.hash}"]`);
      if (tab !== null) {
        this.switchTab(tab), this.#scrollToHash();
        return;
      }
      if (location.hash !== "") {
        const anchoredElement = document.querySelector(location.hash);
        if (anchoredElement !== null && this.tabsGroup.contains(anchoredElement)) {
          Array.from(this.tabsGroup.querySelectorAll(".dcf-tab:not([hidden])")).forEach((singleTabToCheck) => {
            const tabHref = this.#getTabHref(singleTabToCheck);
            document.getElementById(tabHref.replace("#", "")).contains(anchoredElement) && (this.switchTab(singleTabToCheck), this.#scrollToHash());
          });
          return;
        }
      }
    });
  }
  /**
   * Validates and returns standardized name of events for tabs
   * @static
   * @param { string } name - Name of the event to be returned
   * @returns { string } Standard name of the event
   */
  static events(name) {
    const events = {
      tabsReady: "tabsReady",
      tabSwitched: "tabSwitched",
      commandSwitch: "commandSwitch",
      commandPrev: "commandPrev",
      commandNext: "commandNext",
      commandHome: "commandHome",
      commandEnd: "commandEnd"
    };
    return Object.freeze(events), name in events ? events[name] : void 0;
  }
  #scrollToHash() {
    if (document.querySelector(`.dcf-tab[href="${location.hash}"], .dcf-tab[data-href="${location.hash}"]`) !== null) {
      document.getElementById(location.hash.replace("#", "")).scrollIntoView();
      return;
    }
    if (location.hash !== "") {
      const anchoredElement = document.querySelector(location.hash);
      if (anchoredElement !== null && this.tabsGroup.contains(anchoredElement)) {
        anchoredElement.scrollIntoView(!0);
        return;
      }
    }
  }
  /**
   * Parses url and determines if the panel id is in it
   * @param { string } panelID - Id of the panel element to check
   * @returns { bool }
   */
  #checkPanelInURL(panelID) {
    const tabsParam = new URL(location.href).searchParams.get("tabs");
    return tabsParam === null ? !1 : tabsParam.split(" ").includes(panelID);
  }
  /**
   * Parses url and modifies the hash value in it
   * @returns { void }
   */
  #updateURLHash() {
    const url = new URL(location.href), panel = this.tabsGroup.querySelector(".dcf-tabs-panel:not([hidden])");
    if (panel === null)
      throw new Error("Invalid tabGroup");
    url.hash = panel.getAttribute("id"), history.replaceState("", "", url.toString());
  }
  /**
   * Parses url and removes any non-selected tabs from that tabGroup and adds any selected tabs
   * @returns { void }
   */
  #updateURLParam() {
    const url = new URL(location.href), tabsParam = url.searchParams.get("tabs"), panel = this.tabsGroup.querySelector(".dcf-tabs-panel:not([hidden])");
    if (panel === null)
      throw new Error("Invalid tabGroup");
    if (tabsParam === null) {
      url.searchParams.set("tabs", panel.getAttribute("id")), history.replaceState("", "", url.toString());
      return;
    }
    const newPanelList = tabsParam.split(" ").filter((panelToCheck) => this.tabsGroup.querySelector(`#${panelToCheck}`) === null);
    newPanelList.push(panel.getAttribute("id")), url.searchParams.set("tabs", newPanelList.join(" ")), history.replaceState("", "", url.toString());
  }
  /**
   * Sets up event listeners on tab group
   * - commandPrev to go to previous tab
   * - commandNext to go to next tab
   * - commandHome to go to first tab
   * - commandEnd to go to last tab
   *
   * @returns { void }
   */
  #setTabGroupEventListeners() {
    this.tabsGroup.addEventListener(DCFTabs.events("commandPrev"), () => {
      this.switchToPreviousTab();
    }, !0), this.tabsGroup.addEventListener(DCFTabs.events("commandNext"), () => {
      this.switchToNextTab();
    }, !0), this.tabsGroup.addEventListener(DCFTabs.events("commandHome"), () => {
      this.switchToFirstTab();
    }, !0), this.tabsGroup.addEventListener(DCFTabs.events("commandEnd"), () => {
      this.switchToLastTab();
    }, !0);
  }
  /**
   * Set event listeners on inputted tab element
   * - Left Arrow for previous tab
   * - Right Arrow for next tab
   * - Home for first tab
   * - End for last tab
   * - Click to switch to the inputted tab
   * - commandSwitch to switch to the inputted tab
   *
   * @param {HTMLElement} tab - Tab to set event listeners for
   * @returns { void }
   */
  #setTabEventListeners(tab) {
    tab.addEventListener("keydown", (keydownEvent) => {
      if (isKeyEvent(keydownEvent, keyEvents("arrowLeft"))) {
        const newTab = this.switchToPreviousTab();
        if (newTab === null)
          return;
        newTab.focus(), keydownEvent.preventDefault(), this.#updateURLHash();
      } else if (isKeyEvent(keydownEvent, keyEvents("arrowRight"))) {
        const newTab = this.switchToNextTab();
        if (newTab === null)
          return;
        newTab.focus(), keydownEvent.preventDefault(), this.#updateURLHash();
      } else if (isKeyEvent(keydownEvent, keyEvents("home"))) {
        const newTab = this.switchToFirstTab();
        if (newTab === null)
          return;
        newTab.focus(), keydownEvent.preventDefault(), this.#updateURLHash();
      } else if (isKeyEvent(keydownEvent, keyEvents("end"))) {
        const newTab = this.switchToLastTab();
        if (newTab === null)
          return;
        newTab.focus(), keydownEvent.preventDefault(), this.#updateURLHash();
      }
    }), tab.addEventListener("click", (clickEvent) => {
      this.switchTab(tab), this.#updateURLHash(), clickEvent.preventDefault();
    }), tab.addEventListener(DCFTabs.events("commandSwitch"), () => {
      this.switchTab(tab);
    });
  }
  /**
   * This function will switch to the next tab
   * @returns {HTMLElement | null}
   */
  switchToNextTab() {
    const selectedTab = this.tabsGroup.querySelector('.dcf-tab[aria-selected="true"]'), nonHiddenTabs = Array.from(selectedTab.closest(".dcf-tabs-list").querySelectorAll(".dcf-tab:not([hidden])"));
    let selectedTabIndex = nonHiddenTabs.findIndex((tab) => tab.isEqualNode(selectedTab));
    selectedTabIndex === -1 && (selectedTabIndex = 0);
    const nextIndex = selectedTabIndex + 1;
    if (nextIndex >= nonHiddenTabs.length)
      return null;
    const newTab = nonHiddenTabs[nextIndex];
    return this.switchTab(newTab), newTab;
  }
  /**
   * This function will switch to the previous tab
   * @returns {HTMLElement | null}
   */
  switchToPreviousTab() {
    const selectedTab = this.tabsGroup.querySelector('.dcf-tab[aria-selected="true"]'), nonHiddenTabs = Array.from(selectedTab.closest(".dcf-tabs-list").querySelectorAll(".dcf-tab:not([hidden])"));
    let selectedTabIndex = nonHiddenTabs.findIndex((tab) => tab.isEqualNode(selectedTab));
    selectedTabIndex === -1 && (selectedTabIndex = 0);
    const nextIndex = selectedTabIndex - 1;
    if (nextIndex < 0)
      return null;
    const newTab = nonHiddenTabs[nextIndex];
    return this.switchTab(newTab), newTab;
  }
  /**
   * This function will switch to the first tab
   * @returns {HTMLElement | null}
   */
  switchToFirstTab() {
    const selectedTab = this.tabsGroup.querySelector('.dcf-tab[aria-selected="true"]'), newTab = Array.from(selectedTab.closest(".dcf-tabs-list").querySelectorAll(".dcf-tab:not([hidden])"))[0];
    return this.switchTab(newTab), newTab;
  }
  /**
   * This function will switch to the last tab
   * @returns {HTMLElement | null}
   */
  switchToLastTab() {
    const selectedTab = this.tabsGroup.querySelector('.dcf-tab[aria-selected="true"]'), nonHiddenTabs = Array.from(selectedTab.closest(".dcf-tabs-list").querySelectorAll(".dcf-tab:not([hidden])")), newTab = nonHiddenTabs[nonHiddenTabs.length - 1];
    return this.switchTab(newTab), newTab;
  }
  /**
   * Switched tabs to new tab
   * @param {HTMLElement} newTab - Tab to switch to
   * @param {bool} AfterPageLoad - Whether the page has loaded yet
   * @returns { void }
   */
  switchTab(newTab, AfterPageLoad = !0) {
    const selectedTab = this.tabsList.querySelector('.dcf-tab[aria-selected="true"]');
    if (selectedTab !== null && selectedTab.isEqualNode(newTab))
      return;
    this.tabsGroup.classList.contains("dcf-tabs-scroll") && AfterPageLoad && newTab.scrollIntoView(), this.tabsList.querySelectorAll(".dcf-tab").forEach((tab) => {
      const tabHref = this.#getTabHref(tab), matchingPanel = document.getElementById(tabHref.replace("#", ""));
      if (matchingPanel === null)
        throw new Error("Invalid Tab href reference", { cause: tab });
      tab.isEqualNode(newTab) ? (tab.setAttribute("tabindex", "0"), tab.setAttribute("aria-selected", !0), matchingPanel.removeAttribute("hidden"), this.tabsGroup.dataset.urlTracking === "true" && AfterPageLoad && this.#updateURLParam()) : (tab.setAttribute("tabindex", "-1"), tab.removeAttribute("aria-selected"), matchingPanel.setAttribute("hidden", ""));
    }), this.tabsGroup.dispatchEvent(this.tabSwitchedEvent);
  }
  #getTabHref(tabElem) {
    return tabElem.getAttribute("href") || tabElem.getAttribute("data-href") || "";
  }
}
class UNLTab extends DCFTabs {
  static {
    __name(this, "UNLTab");
  }
  constructor(tabsGroup, options = {}) {
    super(tabsGroup, options), window.UNL = window.UNL || {}, window.UNL.classes = window.UNL.classes || {}, window.UNL.classes[this.tabsGroup.getAttribute("id")] = this, this.tabsPanelList.forEach((singlePanel) => {
      window.UNL.classes[singlePanel.getAttribute("id")] = this, singlePanel.dispatchEvent(new Event("UNLClassReady"));
    }), Array.from(this.tabsList.querySelectorAll("a, button")).forEach((singleTab) => {
      window.UNL.classes[singleTab.getAttribute("id")] = this, singleTab.dispatchEvent(new Event("UNLClassReady"));
    }), this.tabsGroup.dispatchEvent(new Event("UNLClassReady"));
  }
}
export {
  UNLTab as default
};
//# sourceMappingURL=component.tab.js.map
