https://wdn-cdn.unl.edu/wdn/templates_6.1/js/chunks/chunk.dcf-dialog.js?v=6.1.6

1var __defProp = Object.defineProperty;
2var __name = (target, value) => __defProp(target, "name", { value, configurable: !0 });
3import { u as uuidv4 } from "./chunk.dcf-utility.js?v=6.1.6";
4class DCFDialog {
5  static {
6    __name(this, "DCFDialog");
7  }
8  uuid = uuidv4();
9  dialogElement = null;
10  dynamicToggles = !1;
11  toggleButtons = [];
12  toggleButtonSelector = null;
13  closeButton = null;
14  dialogContentElement = null;
15  dialogHeaderElement = null;
16  headingElement = null;
17  confirmClose = !1;
18  deliberateCloseOnly = !1;
19  preOpen = new Event(DCFDialog.events("dialogPreOpen"));
20  postOpen = new Event(DCFDialog.events("dialogPostOpen"));
21  preClose = new Event(DCFDialog.events("dialogPreClose"));
22  postClose = new Event(DCFDialog.events("dialogPostClose"));
23  dialogElementClassList = [
24    "dcf-p-0",
25    "dcf-b-0",
26    "dcf-m-auto",
27    "dcf-rounded"
28  ];
29  dialogNonModalElementClassList = [
30    "dcf-b-0"
31  ];
32  dialogHeaderElementClassList = [
33    "dcf-wrapper",
34    "dcf-pt-8"
35  ];
36  dialogContentElementClassList = [
37    "dcf-wrapper",
38    "dcf-pb-8"
39  ];
40  dialogCloseButtonClassList = [
41    "dcf-btn",
42    "dcf-btn-tertiary",
43    "dcf-absolute",
44    "dcf-top-0",
45    "dcf-right-0",
46    "dcf-mt-1",
47    "dcf-mr-1",
48    "dcf-z-1"
49  ];
50  constructor(dialog, options = {}) {
51    if ("dialogElementClassList" in options && Array.isArray(options.dialogElementClassList) && (this.dialogElementClassList = options.dialogElementClassList), "dialogNonModalElementClassList" in options && Array.isArray(options.dialogNonModalElementClassList) && (this.dialogNonModalElementClassList = options.dialogNonModalElementClassList), "dialogHeaderElementClassList" in options && Array.isArray(options.dialogHeaderElementClassList) && (this.dialogHeaderElementClassList = options.dialogHeaderElementClassList), "dialogContentElementClassList" in options && Array.isArray(options.dialogContentElementClassList) && (this.dialogContentElementClassList = options.dialogContentElementClassList), "dialogCloseButtonClassList" in options && Array.isArray(options.dialogCloseButtonClassList) && (this.dialogCloseButtonClassList = options.dialogCloseButtonClassList), this.dialogElement = dialog, this.dialogElement.tagName !== "DIALOG")
52      throw new Error("dcf-dialog used on non-dialog element");
53    if (this.dialogElement.getAttribute("id") === null)
54      throw new Error("Dialog element is missing ID");
55    if (this.dialogElement.hasAttribute("data-confirmClose") && (this.confirmClose = !0), this.dialogElement.hasAttribute("data-deliberateCloseOnly") && (this.deliberateCloseOnly = !0), this.dialogElement.hasAttribute("data-dynamicToggleBtns") && (this.dynamicToggles = !0), this.dialogElement.dataset.defaultClasses !== "false" && (this.dialogElement.classList.contains("dcf-dialog-non-modal") ? this.dialogElement.classList.add(...this.dialogNonModalElementClassList) : this.dialogElement.classList.add(...this.dialogElementClassList)), this.dialogHeaderElement = this.dialogElement.querySelector(".dcf-dialog-header"), this.dialogHeaderElement === null)
56      throw new Error("Dialog is missing header (.dcf-dialog-header)");
57    if (this.dialogElement.dataset.defaultClasses !== "false" && this.dialogHeaderElement.classList.add(...this.dialogHeaderElementClassList), this.heading = this.dialogHeaderElement.querySelector("h1, h2, h3, h4, h5, h6"), (this.heading.getAttribute("id") === "" || this.heading.getAttribute("id") === null) && this.heading.setAttribute("id", this.uuid.concat("-heading")), this.dialogElement.setAttribute("aria-labelledby", this.heading.getAttribute("id")), this.dialogContentElement = this.dialogElement.querySelector(".dcf-dialog-content"), this.dialogContentElement === null)
58      throw new Error("Dialog is missing header (.dcf-dialog-content)");
59    if (this.dialogElement.dataset.defaultClasses !== "false" && this.dialogContentElement.classList.add(...this.dialogContentElementClassList), this.closeButton = this.dialogElement.querySelector(".dcf-btn-close-dialog"), this.closeButton === null)
60      throw new Error("Dialog is missing close button (.dcf-btn-close-dialog)");

61    this.dialogElement.dataset.defaultClasses !== "false" && this.closeButton.classList.add(...this.dialogCloseButtonClassList), this.closeButton.setAttribute("type", "button"), this.toggleButtonSelector = `.dcf-btn-toggle-dialog[data-controls='${this.dialogElement.getAttribute("id")}']`;
62    let toggleButtonList = [];
63    this.dynamicToggles ? toggleButtonList = document.querySelectorAll(this.toggleButtonSelector) : (this.toggleButtons = Array.from(document.querySelectorAll(this.toggleButtonSelector)), toggleButtonList = this.toggleButtons), toggleButtonList.forEach((singleToggleButton, index) => {
64      (singleToggleButton.getAttribute("id") === "" || singleToggleButton.getAttribute("id") === null) && singleToggleButton.setAttribute("id", this.uuid.concat(`-dialog-toggle-button-${index}`)), this.dialogElement.classList.contains("dcf-dialog-non-modal") ? singleToggleButton.setAttribute("aria-expanded", !1) : singleToggleButton.setAttribute("aria-haspopup", "dialog"), singleToggleButton.removeAttribute("disabled");
65    }), this.#addEventListeners(), this.dialogElement.classList.add("dcf-dialog-initialized"), this.dialogElement.removeAttribute("hidden"), this.dialogElement.dispatchEvent(new CustomEvent(DCFDialog.events("dialogReady"), {
66      detail: {
67        classInstance: this
68      }
69    }));
70  }
71  // The names of the events to be used easily
72  static events(name) {
73    const events = {
74      dialogReady: "dialogReady",
75      dialogPreOpen: "dialogPreOpen",
76      dialogPostOpen: "dialogPostOpen",
77      dialogPreClose: "dialogPreClose",
78      dialogPostClose: "dialogPostClose",
79      commandClose: "commandClose",
80      commandOpen: "commandOpen",
81      commandToggle: "commandToggle"
82    };
83    return Object.freeze(events), name in events ? events[name] : void 0;
84  }
85  #addEventListeners() {
86    this.dynamicToggles ? window.addEventListener("click", (event) => {
87      const toggleButton = event.target.closest(`.dcf-btn-toggle-dialog[data-controls='${this.dialogElement.getAttribute("id")}']`);
88      toggleButton !== null && this.toggle({
89        type: "toggleButton",
90        button: toggleButton
91      });
92    }) : this.toggleButtons.forEach((singleToggleButton) => {
93      singleToggleButton.addEventListener("click", () => {
94        this.toggle({
95          type: "toggleButton",
96          button: singleToggleButton
97        });
98      });
99    }), document.addEventListener("dialogPreOpen", (event) => {
100      event.target.isSameNode(this.dialogElement) || this.close({
101        type: "otherDialogOpened"
102      });
103    }, !0), this.closeButton.addEventListener("click", () => {
104      this.close({
105        type: "closeButton",
106        button: this.closeButton
107      });
108    }), this.dialogElement.addEventListener("focusout", (event) => {
109      let isToggleButtonFocusout = !1, allToggleButtons = this.toggleButtons;
110      this.dynamicToggles && (allToggleButtons = document.querySelectorAll(this.toggleButtonSelector));
111      for (const singleToggleButton of allToggleButtons)
112        (singleToggleButton.isSameNode(event.relatedTarget) || singleToggleButton.contains(event.relatedTarget)) && (isToggleButtonFocusout = !0);
113      this.dialogElement.open && !isToggleButtonFocusout && requestAnimationFrame(() => {
114        const active = document.activeElement;
115        this.dialogElement.contains(active) || this.close({
116          type: "focusout"
117        });
118      });
119    }), this.dialogElement.addEventListener("keydown", (event) => {
120      event.key === "Escape" && (event.preventDefault(), this.close({
121        type: "escapeKey"
122      }));
123    }), this.dialogElement.addEventListener(DCFDialog.events("commandClose"), () => {
124      this.close({
125        type: "commandClose"
126      });
127    }), this.dialogElement.addEventListener(DCFDialog.events("commandOpen"), () => {
128      this.open({
129        type: "commandOpen"
130      });
131    }), this.dialogElement.addEventListener(DCFDialog.events("commandToggle"), () => {
132      this.toggle({
133        type: "commandToggle"
134      });
135    }), this.deliberateCloseOnly || this.dialogElement.addEventListener("click", (event) => {
136      if (event.target.tagName !== "DIALOG")
137        return;
138      const rect = event.target.getBoundingClientRect();
139      (rect.top <= event.clientY && event.clientY <= rect.top + rect.height && rect.left <= event.clientX && event.clientX <= rect.left + rect.width) === !1 && this.close({
140        type: "clickedOutsideDialog"
141      });
142    });
143  }
144  close(eventData = {}) {
145    if (!this.dialogElement.open || this.confirmClose && !window.confirm(this.dialogElement.dataset.confirmclose))
146      return;
147    const preCloseEvent = new CustomEvent(
148      DCFDialog.events("dialogPreClose"),
149      {
150        detail: eventData
151      }
152    );
153    this.dialogElement.dispatchEvent(preCloseEvent), this.dialogElement.close(), this.dialogElement.classList.remove("dcf-dialog-is-open");
154    let allToggleButtons = this.toggleButtons;
155    this.dynamicToggles && (allToggleButtons = document.querySelectorAll(this.toggleButtonSelector)), allToggleButtons.forEach((singleToggleButton) => {
156      singleToggleButton.classList.remove("dcf-dialog-is-open"), this.dialogElement.classList.contains("dcf-dialog-non-modal") && singleToggleButton.setAttribute("aria-expanded", !1);
157    });
158    const postCloseEvent = new CustomEvent(
159      DCFDialog.events("dialogPostClose"),
160      {
161        detail: eventData
162      }
163    );
164    this.dialogElement.dispatchEvent(postCloseEvent);
165  }
166  open(eventData = {}) {
167    if (this.dialogElement.open)
168      return;
169    const preOpenEvent = new CustomEvent(
170      DCFDialog.events("dialogPreOpen"),
171      {
172        detail: eventData
173      }
174    );
175    this.dialogElement.dispatchEvent(preOpenEvent), this.dialogElement.classList.contains("dcf-dialog-non-modal") ? this.dialogElement.show() : this.dialogElement.showModal(), this.dialogElement.classList.add("dcf-dialog-is-open");
176    let allToggleButtons = this.toggleButtons;
177    this.dynamicToggles && (allToggleButtons = document.querySelectorAll(this.toggleButtonSelector)), allToggleButtons.forEach((singleToggleButton) => {
178      singleToggleButton.classList.add("dcf-dialog-is-open"), this.dialogElement.classList.contains("dcf-dialog-non-modal") && singleToggleButton.setAttribute("aria-expanded", !0);
179    });
180    const postOpenEvent = new CustomEvent(
181      DCFDialog.events("dialogPostOpen"),
182      {
183        detail: eventData
184      }
185    );
186    this.dialogElement.dispatchEvent(postOpenEvent);
187  }
188  toggle(eventData = {}) {
189    this.dialogElement.open ? this.close(eventData) : this.open(eventData);
190  }
191}
192export {
193  DCFDialog as D
194};
195//# sourceMappingURL=chunk.dcf-dialog.js.map