var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", { value, configurable: !0 });
import { u as uuidv4 } from "../chunks/chunk.dcf-utility.js?v=6.1.1";
import { D as DCFButtonToggles } from "../chunks/chunk.dcf-button-toggle.js?v=6.1.1";
class DCFPopup {
  static {
    __name(this, "DCFPopup");
  }
  // Create a random ID for the button
  uuid = uuidv4();
  popupElement = null;
  popupButton = null;
  popupContent = null;
  closeButtons = [];
  toggleButtonObj = null;
  popupClassList = [
    "dcf-relative"
  ];
  popupButtonClassList = [];
  popupContentClassList = [
    "dcf-absolute",
    "dcf-z-modal-fullscreen"
  ];
  // This is for when we our mouse leaves and comes back
  // This is helpful for the point option for the popup
  hoverTimeoutDuration = 250;
  // Set up the button
  constructor(popupElement) {
    if (this.popupOpenEvent = new Event(DCFPopup.events("popupOpen")), this.commandOpen = new Event(DCFButtonToggles.events("commandOpen")), this.commandClose = new Event(DCFButtonToggles.events("commandClose")), this.commandToggle = new Event(DCFButtonToggles.events("commandToggle")), this.positions = [
      "top",
      "bottom",
      "left",
      "right"
    ], this.alignments = [
      "start",
      "center",
      "end"
    ], this.popupElement = popupElement, this.popupClassList && this.popupClassList.forEach((cssClass) => {
      this.popupElement.classList.add(cssClass);
    }), this.popupButton = this.popupElement.querySelector(":scope > .dcf-btn-toggle-popup, :scope > .dcf-btn-popup"), this.popupButton === null || this.popupButton.tagName !== "BUTTON")
      throw new Error("Popup Button Is Missing Or Not A Button Tag");
    if (this.popupContent = this.popupElement.querySelector(":scope > .dcf-popup-content"), this.popupContent === null)
      throw new Error("Popup Content Is Missing");
    (this.popupElement.getAttribute("id") === "" || this.popupElement.getAttribute("id") === null) && this.popupElement.setAttribute("id", this.uuid.concat("-popup")), (this.popupButton.getAttribute("id") === "" || this.popupButton.getAttribute("id") === null) && this.popupButton.setAttribute("id", this.uuid.concat("-popup-btn")), (this.popupContent.getAttribute("id") === "" || this.popupContent.getAttribute("id") === null) && this.popupContent.setAttribute("id", this.uuid.concat("-popup-content")), this.popupButtonClassList && this.popupButtonClassList.forEach((cssClass) => {
      this.popupButton.classList.add(cssClass);
    }), this.popupContentClassList && this.popupContentClassList.forEach((cssClass) => {
      this.popupContent.classList.add(cssClass);
    }), this.popupButton.dataset.controls = this.popupContent.getAttribute("id"), this.popupButton.dataset.startExpanded = "false", this.#addPositionClasses(), this.toggleButtonObj = new DCFButtonToggles(this.popupButton), this.closeButtons = this.popupElement.querySelectorAll(
      `:scope > .dcf-popup-content > .dcf-btn-close-popup, :scope > .dcf-popup-content > .dcf-btn-popup-close, :scope > .dcf-popup-content .dcf-btn-close-popup[data-for="${this.popupElement.getAttribute("id")}"], :scope > .dcf-popup-content .dcf-btn-popup-close[data-for="${this.popupElement.getAttribute("id")}"]`
    ), this.closeButtons.forEach((closeButton) => {
      if (closeButton.tagName !== "BUTTON")
        throw new Error("Close Button is Not a Button Tag");
      closeButton.addEventListener("click", () => {
        this.popupButton.dispatchEvent(this.commandClose);
      });
    }), this.popupContent.addEventListener(DCFButtonToggles.events("toggleElementOn"), () => {
      this.popupElement.dispatchEvent(this.popupOpenEvent);
    }), document.addEventListener(DCFPopup.events("popupOpen"), (event) => {
      let eventIsFromTheInside = !1;
      this.popupElement.querySelectorAll(".dcf-popup").forEach((innerPopup) => {
        innerPopup.getAttribute("id") === event.target.getAttribute("id") && (eventIsFromTheInside = !0);
      }), !eventIsFromTheInside && event.target.getAttribute("id") !== this.popupElement.getAttribute("id") && this.popupButton.dispatchEvent(this.commandClose);
    }, !0), document.body.addEventListener("click", (event) => {
      this.popupElement.contains(event.target) || this.popupButton.dispatchEvent(this.commandClose);
    }, !0), this.popupElement.dataset.hover === "true" && (this.popupElement.addEventListener("mouseleave", () => {
      this.popupElement.dataset.hoverTimeout = setTimeout(() => {
        this.popupElement.removeAttribute("data-hover-timeout"), this.popupButton.dispatchEvent(this.commandClose);
      }, this.hoverTimeoutDuration);
    }), this.popupElement.addEventListener("mouseenter", () => {
      clearTimeout(this.popupElement.dataset.hoverTimeout), this.popupElement.removeAttribute("data-hover-timeout"), this.popupButton.dispatchEvent(this.commandOpen);
    })), this.popupElement.getAttribute("hidden") !== null && this.popupElement.removeAttribute("hidden"), this.popupElement.classList.add("dcf-popup-initialized"), this.popupButton.dispatchEvent(new CustomEvent(DCFPopup.events("popupReady"), {
      detail: {
        classInstance: this
      }
    })), this.popupElement.dispatchEvent(new CustomEvent(DCFPopup.events("popupReady"), {
      detail: {
        classInstance: this
      }
    }));
  }
  // The names of the events to be used easily
  static events(name) {
    const events = {
      popupReady: "popupReady",
      popupOpen: "popupOpen"
    };
    return Object.freeze(events), DCFButtonToggles.events(name) !== void 0 ? DCFButtonToggles.events(name) : name in events ? events[name] : void 0;
  }
  /**
   * Sets up the DCF classes for the popup content based on the popup data attributes
   */
  #addPositionClasses() {
    let position = this.popupElement.dataset.position;
    if (position === void 0)
      position = "bottom";
    else if (!this.positions.includes(position))
      throw new Error("Invalid Position On Popup");
    let alignment = this.popupElement.dataset.alignment;
    if (alignment === void 0)
      alignment = "center";
    else if (!this.alignments.includes(alignment))
      throw new Error("Invalid Alignment On Popup");
    position === "top" ? this.popupContent.classList.add("dcf-bottom-100%") : position === "bottom" ? this.popupContent.classList.add("dcf-top-100%") : position === "left" ? this.popupContent.classList.add("dcf-right-100%") : position === "right" && this.popupContent.classList.add("dcf-left-100%"), position === "top" || position === "bottom" ? alignment === "start" ? this.popupContent.classList.add("dcf-left-0") : alignment === "end" ? this.popupContent.classList.add("dcf-right-0") : alignment === "center" && this.popupContent.classList.add("dcf-left-50%") : (position === "left" || position === "right") && (alignment === "start" ? this.popupContent.classList.add("dcf-top-0") : alignment === "end" ? this.popupContent.classList.add("dcf-bottom-0") : alignment === "center" && this.popupContent.classList.add("dcf-top-50%"));
  }
}
class UNLPopup extends DCFPopup {
  static {
    __name(this, "UNLPopup");
  }
  constructor(popup, options = {}) {
    super(popup, options), window.UNL = window.UNL || {}, window.UNL.classes = window.UNL.classes || {}, window.UNL.classes[this.popupElement.getAttribute("id")] = this, window.UNL.classes[this.popupButton.getAttribute("id")] = this, window.UNL.classes[this.popupContent.getAttribute("id")] = this, this.popupElement.dispatchEvent(new Event("UNLClassReady")), this.popupButton.dispatchEvent(new Event("UNLClassReady")), this.popupContent.dispatchEvent(new Event("UNLClassReady"));
  }
}
export {
  UNLPopup as default
};
//# sourceMappingURL=component.popup.js.map
