@sv443-network/userutils 7.0.1 → 7.2.0

package/dist/index.js

@@ -1,4 +1,4 @@
-'use strict';
+import { createNanoEvents } from 'nanoevents';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -108,6 +108,197 @@ function randomizeArray(array) {
   return retArray;
 }
 
+// lib/dom.ts
+function getUnsafeWindow() {
+  try {
+    return unsafeWindow;
+  } catch (e) {
+    return window;
+  }
+}
+function addParent(element, newParent) {
+  const oldParent = element.parentNode;
+  if (!oldParent)
+    throw new Error("Element doesn't have a parent node");
+  oldParent.replaceChild(newParent, element);
+  newParent.appendChild(element);
+  return newParent;
+}
+function addGlobalStyle(style) {
+  const styleElem = document.createElement("style");
+  setInnerHtmlUnsafe(styleElem, style);
+  document.head.appendChild(styleElem);
+  return styleElem;
+}
+function preloadImages(srcUrls, rejects = false) {
+  const promises = srcUrls.map((src) => new Promise((res, rej) => {
+    const image = new Image();
+    image.src = src;
+    image.addEventListener("load", () => res(image));
+    image.addEventListener("error", (evt) => rejects && rej(evt));
+  }));
+  return Promise.allSettled(promises);
+}
+function openInNewTab(href, background) {
+  try {
+    GM.openInTab(href, background);
+  } catch (e) {
+    const openElem = document.createElement("a");
+    Object.assign(openElem, {
+      className: "userutils-open-in-new-tab",
+      target: "_blank",
+      rel: "noopener noreferrer",
+      href
+    });
+    openElem.style.display = "none";
+    document.body.appendChild(openElem);
+    openElem.click();
+    setTimeout(openElem.remove, 50);
+  }
+}
+function interceptEvent(eventObject, eventName, predicate = () => true) {
+  Error.stackTraceLimit = Math.max(Error.stackTraceLimit, 100);
+  if (isNaN(Error.stackTraceLimit))
+    Error.stackTraceLimit = 100;
+  (function(original) {
+    eventObject.__proto__.addEventListener = function(...args) {
+      var _a, _b;
+      const origListener = typeof args[1] === "function" ? args[1] : (_b = (_a = args[1]) == null ? void 0 : _a.handleEvent) != null ? _b : () => void 0;
+      args[1] = function(...a) {
+        if (args[0] === eventName && predicate(Array.isArray(a) ? a[0] : a))
+          return;
+        else
+          return origListener.apply(this, a);
+      };
+      original.apply(this, args);
+    };
+  })(eventObject.__proto__.addEventListener);
+}
+function interceptWindowEvent(eventName, predicate = () => true) {
+  return interceptEvent(getUnsafeWindow(), eventName, predicate);
+}
+function isScrollable(element) {
+  const { overflowX, overflowY } = getComputedStyle(element);
+  return {
+    vertical: (overflowY === "scroll" || overflowY === "auto") && element.scrollHeight > element.clientHeight,
+    horizontal: (overflowX === "scroll" || overflowX === "auto") && element.scrollWidth > element.clientWidth
+  };
+}
+function observeElementProp(element, property, callback) {
+  const elementPrototype = Object.getPrototypeOf(element);
+  if (elementPrototype.hasOwnProperty(property)) {
+    const descriptor = Object.getOwnPropertyDescriptor(elementPrototype, property);
+    Object.defineProperty(element, property, {
+      get: function() {
+        var _a;
+        return (_a = descriptor == null ? void 0 : descriptor.get) == null ? void 0 : _a.apply(this, arguments);
+      },
+      set: function() {
+        var _a;
+        const oldValue = this[property];
+        (_a = descriptor == null ? void 0 : descriptor.set) == null ? void 0 : _a.apply(this, arguments);
+        const newValue = this[property];
+        if (typeof callback === "function") {
+          callback.bind(this, oldValue, newValue);
+        }
+        return newValue;
+      }
+    });
+  }
+}
+function getSiblingsFrame(refElement, siblingAmount, refElementAlignment = "center-top", includeRef = true) {
+  var _a, _b;
+  const siblings = [...(_b = (_a = refElement.parentNode) == null ? void 0 : _a.childNodes) != null ? _b : []];
+  const elemSiblIdx = siblings.indexOf(refElement);
+  if (elemSiblIdx === -1)
+    throw new Error("Element doesn't have a parent node");
+  if (refElementAlignment === "top")
+    return [...siblings.slice(elemSiblIdx + Number(!includeRef), elemSiblIdx + siblingAmount + Number(!includeRef))];
+  else if (refElementAlignment.startsWith("center-")) {
+    const halfAmount = (refElementAlignment === "center-bottom" ? Math.ceil : Math.floor)(siblingAmount / 2);
+    const startIdx = Math.max(0, elemSiblIdx - halfAmount);
+    const topOffset = Number(refElementAlignment === "center-top" && siblingAmount % 2 === 0 && includeRef);
+    const btmOffset = Number(refElementAlignment === "center-bottom" && siblingAmount % 2 !== 0 && includeRef);
+    const startIdxWithOffset = startIdx + topOffset + btmOffset;
+    return [
+      ...siblings.filter((_, idx) => includeRef || idx !== elemSiblIdx).slice(startIdxWithOffset, startIdxWithOffset + siblingAmount)
+    ];
+  } else if (refElementAlignment === "bottom")
+    return [...siblings.slice(elemSiblIdx - siblingAmount + Number(includeRef), elemSiblIdx + Number(includeRef))];
+  return [];
+}
+var ttPolicy;
+function setInnerHtmlUnsafe(element, html) {
+  var _a, _b, _c;
+  if (!ttPolicy && typeof ((_a = window == null ? void 0 : window.trustedTypes) == null ? void 0 : _a.createPolicy) === "function") {
+    ttPolicy = window.trustedTypes.createPolicy("_uu_set_innerhtml_unsafe", {
+      createHTML: (unsafeHtml) => unsafeHtml
+    });
+  }
+  element.innerHTML = (_c = (_b = ttPolicy == null ? void 0 : ttPolicy.createHTML) == null ? void 0 : _b.call(ttPolicy, html)) != null ? _c : html;
+  return element;
+}
+
+// lib/crypto.ts
+function compress(input, compressionFormat, outputType = "string") {
+  return __async(this, null, function* () {
+    const byteArray = typeof input === "string" ? new TextEncoder().encode(input) : input;
+    const comp = new CompressionStream(compressionFormat);
+    const writer = comp.writable.getWriter();
+    writer.write(byteArray);
+    writer.close();
+    const buf = yield new Response(comp.readable).arrayBuffer();
+    return outputType === "arrayBuffer" ? buf : ab2str(buf);
+  });
+}
+function decompress(input, compressionFormat, outputType = "string") {
+  return __async(this, null, function* () {
+    const byteArray = typeof input === "string" ? str2ab(input) : input;
+    const decomp = new DecompressionStream(compressionFormat);
+    const writer = decomp.writable.getWriter();
+    writer.write(byteArray);
+    writer.close();
+    const buf = yield new Response(decomp.readable).arrayBuffer();
+    return outputType === "arrayBuffer" ? buf : new TextDecoder().decode(buf);
+  });
+}
+function ab2str(buf) {
+  return getUnsafeWindow().btoa(
+    new Uint8Array(buf).reduce((data, byte) => data + String.fromCharCode(byte), "")
+  );
+}
+function str2ab(str) {
+  return Uint8Array.from(getUnsafeWindow().atob(str), (c) => c.charCodeAt(0));
+}
+function computeHash(input, algorithm = "SHA-256") {
+  return __async(this, null, function* () {
+    let data;
+    if (typeof input === "string") {
+      const encoder = new TextEncoder();
+      data = encoder.encode(input);
+    } else
+      data = input;
+    const hashBuffer = yield crypto.subtle.digest(algorithm, data);
+    const hashArray = Array.from(new Uint8Array(hashBuffer));
+    const hashHex = hashArray.map((byte) => byte.toString(16).padStart(2, "0")).join("");
+    return hashHex;
+  });
+}
+function randomId(length = 16, radix = 16, enhancedEntropy = false) {
+  if (enhancedEntropy) {
+    const arr = new Uint8Array(length);
+    crypto.getRandomValues(arr);
+    return Array.from(
+      arr,
+      (v) => mapRange(v, 0, 255, 0, radix).toString(radix).substring(0, 1)
+    ).join("");
+  }
+  return Array.from(
+    { length },
+    () => Math.floor(Math.random() * radix).toString(radix)
+  ).join("");
+}
+
 // lib/DataStore.ts
 var DataStore = class {
   /**
@@ -411,126 +602,475 @@ Has: ${checksum}`);
     });
   }
 };
-
-// lib/dom.ts
-function getUnsafeWindow() {
-  try {
-    return unsafeWindow;
-  } catch (e) {
-    return window;
+var NanoEmitter = class {
+  constructor(options = {}) {
+    __publicField(this, "events", createNanoEvents());
+    __publicField(this, "eventUnsubscribes", []);
+    __publicField(this, "emitterOptions");
+    this.emitterOptions = __spreadValues({
+      publicEmit: false
+    }, options);
+  }
+  /** Subscribes to an event - returns a function that unsubscribes the event listener */
+  on(event, cb) {
+    let unsub;
+    const unsubProxy = () => {
+      if (!unsub)
+        return;
+      unsub();
+      this.eventUnsubscribes = this.eventUnsubscribes.filter((u) => u !== unsub);
+    };
+    unsub = this.events.on(event, cb);
+    this.eventUnsubscribes.push(unsub);
+    return unsubProxy;
+  }
+  /** Subscribes to an event and calls the callback or resolves the Promise only once */
+  once(event, cb) {
+    return new Promise((resolve) => {
+      let unsub;
+      const onceProxy = (...args) => {
+        unsub();
+        cb == null ? void 0 : cb(...args);
+        resolve(args);
+      };
+      unsub = this.on(event, onceProxy);
+    });
+  }
+  /** Emits an event on this instance - Needs `publicEmit` to be set to true in the constructor! */
+  emit(event, ...args) {
+    if (this.emitterOptions.publicEmit) {
+      this.events.emit(event, ...args);
+      return true;
+    }
+    return false;
+  }
+  /** Unsubscribes all event listeners */
+  unsubscribeAll() {
+    for (const unsub of this.eventUnsubscribes)
+      unsub();
+    this.eventUnsubscribes = [];
   }
+};
+
+// lib/Dialog.ts
+var defaultDialogCss = `.uu-no-select {
+  user-select: none;
 }
-function addParent(element, newParent) {
-  const oldParent = element.parentNode;
-  if (!oldParent)
-    throw new Error("Element doesn't have a parent node");
-  oldParent.replaceChild(newParent, element);
-  newParent.appendChild(element);
-  return newParent;
+
+.uu-dialog-bg {
+  --uu-dialog-bg: #333333;
+  --uu-dialog-bg-highlight: #252525;
+  --uu-scroll-indicator-bg: rgba(10, 10, 10, 0.7);
+  --uu-dialog-separator-color: #797979;
+  --uu-dialog-border-radius: 10px;
 }
-function addGlobalStyle(style) {
-  const styleElem = document.createElement("style");
-  styleElem.innerHTML = style;
-  document.head.appendChild(styleElem);
-  return styleElem;
+
+.uu-dialog-bg {
+  display: block;
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  z-index: 5;
+  background-color: rgba(0, 0, 0, 0.6);
 }
-function preloadImages(srcUrls, rejects = false) {
-  const promises = srcUrls.map((src) => new Promise((res, rej) => {
-    const image = new Image();
-    image.src = src;
-    image.addEventListener("load", () => res(image));
-    image.addEventListener("error", (evt) => rejects && rej(evt));
-  }));
-  return Promise.allSettled(promises);
+
+.uu-dialog {
+  --uu-calc-dialog-height: calc(min(100vh - 40px, var(--uu-dialog-height-max)));
+  position: absolute;
+  display: flex;
+  flex-direction: column;
+  width: calc(min(100% - 60px, var(--uu-dialog-width-max)));
+  border-radius: var(--uu-dialog-border-radius);
+  height: auto;
+  max-height: var(--uu-calc-dialog-height);
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 6;
+  color: #fff;
+  background-color: var(--uu-dialog-bg);
 }
-function openInNewTab(href, background) {
-  try {
-    GM.openInTab(href, background);
-  } catch (e) {
-    const openElem = document.createElement("a");
-    Object.assign(openElem, {
-      className: "userutils-open-in-new-tab",
-      target: "_blank",
-      rel: "noopener noreferrer",
-      href
-    });
-    openElem.style.display = "none";
-    document.body.appendChild(openElem);
-    openElem.click();
-    setTimeout(openElem.remove, 50);
-  }
+
+.uu-dialog.align-top {
+  top: 0;
+  transform: translate(-50%, 40px);
 }
-function interceptEvent(eventObject, eventName, predicate = () => true) {
-  Error.stackTraceLimit = Math.max(Error.stackTraceLimit, 100);
-  if (isNaN(Error.stackTraceLimit))
-    Error.stackTraceLimit = 100;
-  (function(original) {
-    eventObject.__proto__.addEventListener = function(...args) {
-      var _a, _b;
-      const origListener = typeof args[1] === "function" ? args[1] : (_b = (_a = args[1]) == null ? void 0 : _a.handleEvent) != null ? _b : () => void 0;
-      args[1] = function(...a) {
-        if (args[0] === eventName && predicate(Array.isArray(a) ? a[0] : a))
-          return;
-        else
-          return origListener.apply(this, a);
-      };
-      original.apply(this, args);
-    };
-  })(eventObject.__proto__.addEventListener);
+
+.uu-dialog.align-bottom {
+  top: 100%;
+  transform: translate(-50%, -100%);
 }
-function interceptWindowEvent(eventName, predicate = () => true) {
-  return interceptEvent(getUnsafeWindow(), eventName, predicate);
+
+.uu-dialog-body {
+  font-size: 1.5rem;
+  padding: 20px;
 }
-function isScrollable(element) {
-  const { overflowX, overflowY } = getComputedStyle(element);
-  return {
-    vertical: (overflowY === "scroll" || overflowY === "auto") && element.scrollHeight > element.clientHeight,
-    horizontal: (overflowX === "scroll" || overflowX === "auto") && element.scrollWidth > element.clientWidth
-  };
+
+.uu-dialog-body.small {
+  padding: 15px;
 }
-function observeElementProp(element, property, callback) {
-  const elementPrototype = Object.getPrototypeOf(element);
-  if (elementPrototype.hasOwnProperty(property)) {
-    const descriptor = Object.getOwnPropertyDescriptor(elementPrototype, property);
-    Object.defineProperty(element, property, {
-      get: function() {
-        var _a;
-        return (_a = descriptor == null ? void 0 : descriptor.get) == null ? void 0 : _a.apply(this, arguments);
-      },
-      set: function() {
+
+#uu-dialog-opts {
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  padding: 30px 0px;
+  overflow-y: auto;
+}
+
+.uu-dialog-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 6px;
+  padding: 15px 20px 15px 20px;
+  background-color: var(--uu-dialog-bg);
+  border: 2px solid var(--uu-dialog-separator-color);
+  border-style: none none solid none !important;
+  border-radius: var(--uu-dialog-border-radius) var(--uu-dialog-border-radius) 0px 0px;
+}
+
+.uu-dialog-header.small {
+  padding: 10px 15px;
+  border-style: none none solid none !important;
+}
+
+.uu-dialog-header-pad {
+  content: " ";
+  min-height: 32px;
+}
+
+.uu-dialog-header-pad.small {
+  min-height: 24px;
+}
+
+.uu-dialog-titlecont {
+  display: flex;
+  align-items: center;
+}
+
+.uu-dialog-titlecont-no-title {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+}
+
+.uu-dialog-title {
+  position: relative;
+  display: inline-block;
+  font-size: 22px;
+}
+
+.uu-dialog-close {
+  cursor: pointer;
+}
+
+.uu-dialog-header-img,
+.uu-dialog-close
+{
+  width: 32px;
+  height: 32px;
+}
+
+.uu-dialog-header-img.small,
+.uu-dialog-close.small
+{
+  width: 24px;
+  height: 24px;
+}
+
+.uu-dialog-footer {
+  font-size: 17px;
+  text-decoration: underline;
+}
+
+.uu-dialog-footer.hidden {
+  display: none;
+}
+
+.uu-dialog-footer-cont {
+  margin-top: 6px;
+  padding: 15px 20px;
+  background: var(--uu-dialog-bg);
+  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, var(--uu-dialog-bg) 30%, var(--uu-dialog-bg) 100%);
+  border: 2px solid var(--uu-dialog-separator-color);
+  border-style: solid none none none !important;
+  border-radius: 0px 0px var(--uu-dialog-border-radius) var(--uu-dialog-border-radius);
+}
+
+.uu-dialog-footer-buttons-cont button:not(:last-of-type) {
+  margin-right: 15px;
+}`;
+var currentDialogId = null;
+var openDialogs = [];
+var defaultStrings = {
+  closeDialogTooltip: "Click to close the dialog"
+};
+var Dialog = class _Dialog extends NanoEmitter {
+  constructor(options) {
+    super();
+    /** Options passed to the dialog in the constructor */
+    __publicField(this, "options");
+    /** ID that gets added to child element IDs - has to be unique and conform to HTML ID naming rules! */
+    __publicField(this, "id");
+    /** Strings used in the dialog (used for translations) */
+    __publicField(this, "strings");
+    __publicField(this, "dialogOpen", false);
+    __publicField(this, "dialogMounted", false);
+    const _a = options, { strings } = _a, opts = __objRest(_a, ["strings"]);
+    this.strings = __spreadValues(__spreadValues({}, defaultStrings), strings != null ? strings : {});
+    this.options = __spreadValues({
+      closeOnBgClick: true,
+      closeOnEscPress: true,
+      destroyOnClose: false,
+      unmountOnClose: true,
+      removeListenersOnDestroy: true,
+      small: false,
+      verticalAlign: "center"
+    }, opts);
+    this.id = opts.id;
+  }
+  //#region public
+  /** Call after DOMContentLoaded to pre-render the dialog and invisibly mount it in the DOM */
+  mount() {
+    return __async(this, null, function* () {
+      var _a;
+      if (this.dialogMounted)
+        return;
+      this.dialogMounted = true;
+      if (!document.querySelector("style.uu-dialog-css"))
+        addGlobalStyle((_a = this.options.dialogCss) != null ? _a : defaultDialogCss).classList.add("uu-dialog-css");
+      const bgElem = document.createElement("div");
+      bgElem.id = `uu-${this.id}-dialog-bg`;
+      bgElem.classList.add("uu-dialog-bg");
+      if (this.options.closeOnBgClick)
+        bgElem.ariaLabel = bgElem.title = this.getString("closeDialogTooltip");
+      bgElem.style.setProperty("--uu-dialog-width-max", `${this.options.width}px`);
+      bgElem.style.setProperty("--uu-dialog-height-max", `${this.options.height}px`);
+      bgElem.style.visibility = "hidden";
+      bgElem.style.display = "none";
+      bgElem.inert = true;
+      bgElem.appendChild(yield this.getDialogContent());
+      document.body.appendChild(bgElem);
+      this.attachListeners(bgElem);
+      this.events.emit("render");
+      return bgElem;
+    });
+  }
+  /** Closes the dialog and clears all its contents (unmounts elements from the DOM) in preparation for a new rendering call */
+  unmount() {
+    var _a;
+    this.close();
+    this.dialogMounted = false;
+    const clearSelectors = [
+      `#uu-${this.id}-dialog-bg`,
+      `#uu-style-dialog-${this.id}`
+    ];
+    for (const sel of clearSelectors)
+      (_a = document.querySelector(sel)) == null ? void 0 : _a.remove();
+    this.events.emit("clear");
+  }
+  /** Clears the DOM of the dialog and then renders it again */
+  remount() {
+    return __async(this, null, function* () {
+      this.unmount();
+      yield this.mount();
+    });
+  }
+  /**
+   * Opens the dialog - also mounts it if it hasn't been mounted yet  
+   * Prevents default action and immediate propagation of the passed event
+   */
+  open(e) {
+    return __async(this, null, function* () {
+      var _a;
+      e == null ? void 0 : e.preventDefault();
+      e == null ? void 0 : e.stopImmediatePropagation();
+      if (this.isOpen())
+        return;
+      this.dialogOpen = true;
+      if (openDialogs.includes(this.id))
+        throw new Error(`A dialog with the same ID of '${this.id}' already exists and is open!`);
+      if (!this.isMounted())
+        yield this.mount();
+      const dialogBg = document.querySelector(`#uu-${this.id}-dialog-bg`);
+      if (!dialogBg)
+        return console.warn(`Couldn't find background element for dialog with ID '${this.id}'`);
+      dialogBg.style.visibility = "visible";
+      dialogBg.style.display = "block";
+      dialogBg.inert = false;
+      currentDialogId = this.id;
+      openDialogs.unshift(this.id);
+      for (const dialogId of openDialogs)
+        if (dialogId !== this.id)
+          (_a = document.querySelector(`#uu-${dialogId}-dialog-bg`)) == null ? void 0 : _a.setAttribute("inert", "true");
+      document.body.classList.remove("uu-no-select");
+      document.body.setAttribute("inert", "true");
+      this.events.emit("open");
+      return dialogBg;
+    });
+  }
+  /** Closes the dialog - prevents default action and immediate propagation of the passed event */
+  close(e) {
+    var _a, _b;
+    e == null ? void 0 : e.preventDefault();
+    e == null ? void 0 : e.stopImmediatePropagation();
+    if (!this.isOpen())
+      return;
+    this.dialogOpen = false;
+    const dialogBg = document.querySelector(`#uu-${this.id}-dialog-bg`);
+    if (!dialogBg)
+      return console.warn(`Couldn't find background element for dialog with ID '${this.id}'`);
+    dialogBg.style.visibility = "hidden";
+    dialogBg.style.display = "none";
+    dialogBg.inert = true;
+    openDialogs.splice(openDialogs.indexOf(this.id), 1);
+    currentDialogId = (_a = openDialogs[0]) != null ? _a : null;
+    if (currentDialogId)
+      (_b = document.querySelector(`#uu-${currentDialogId}-dialog-bg`)) == null ? void 0 : _b.removeAttribute("inert");
+    if (openDialogs.length === 0) {
+      document.body.classList.add("uu-no-select");
+      document.body.removeAttribute("inert");
+    }
+    this.events.emit("close");
+    if (this.options.destroyOnClose)
+      this.destroy();
+    else if (this.options.unmountOnClose)
+      this.unmount();
+  }
+  /** Returns true if the dialog is currently open */
+  isOpen() {
+    return this.dialogOpen;
+  }
+  /** Returns true if the dialog is currently mounted */
+  isMounted() {
+    return this.dialogMounted;
+  }
+  /** Clears the DOM of the dialog and removes all event listeners */
+  destroy() {
+    this.unmount();
+    this.events.emit("destroy");
+    this.options.removeListenersOnDestroy && this.unsubscribeAll();
+  }
+  //#region static
+  /** Returns the ID of the top-most dialog (the dialog that has been opened last) */
+  static getCurrentDialogId() {
+    return currentDialogId;
+  }
+  /** Returns the IDs of all currently open dialogs, top-most first */
+  static getOpenDialogs() {
+    return openDialogs;
+  }
+  //#region protected
+  getString(key) {
+    var _a;
+    return (_a = this.strings[key]) != null ? _a : defaultStrings[key];
+  }
+  /** Called once to attach all generic event listeners */
+  attachListeners(bgElem) {
+    if (this.options.closeOnBgClick) {
+      bgElem.addEventListener("click", (e) => {
         var _a;
-        const oldValue = this[property];
-        (_a = descriptor == null ? void 0 : descriptor.set) == null ? void 0 : _a.apply(this, arguments);
-        const newValue = this[property];
-        if (typeof callback === "function") {
-          callback.bind(this, oldValue, newValue);
-        }
-        return newValue;
+        if (this.isOpen() && ((_a = e.target) == null ? void 0 : _a.id) === `uu-${this.id}-dialog-bg`)
+          this.close(e);
+      });
+    }
+    if (this.options.closeOnEscPress) {
+      document.body.addEventListener("keydown", (e) => {
+        if (e.key === "Escape" && this.isOpen() && _Dialog.getCurrentDialogId() === this.id)
+          this.close(e);
+      });
+    }
+  }
+  //#region protected
+  /**
+   * Adds generic, accessible interaction listeners to the passed element.  
+   * All listeners have the default behavior prevented and stop propagation (for keyboard events only as long as the captured key is valid).
+   * @param listenerOptions Provide a {@linkcode listenerOptions} object to configure the listeners
+   */
+  onInteraction(elem, listener, listenerOptions) {
+    const _a = listenerOptions != null ? listenerOptions : {}, { preventDefault = true, stopPropagation = true } = _a, listenerOpts = __objRest(_a, ["preventDefault", "stopPropagation"]);
+    const interactionKeys = ["Enter", " ", "Space"];
+    const proxListener = (e) => {
+      if (e instanceof KeyboardEvent) {
+        if (interactionKeys.includes(e.key)) {
+          preventDefault && e.preventDefault();
+          stopPropagation && e.stopPropagation();
+        } else
+          return;
+      } else if (e instanceof MouseEvent) {
+        preventDefault && e.preventDefault();
+        stopPropagation && e.stopPropagation();
       }
+      (listenerOpts == null ? void 0 : listenerOpts.once) && e.type === "keydown" && elem.removeEventListener("click", proxListener, listenerOpts);
+      (listenerOpts == null ? void 0 : listenerOpts.once) && e.type === "click" && elem.removeEventListener("keydown", proxListener, listenerOpts);
+      listener(e);
+    };
+    elem.addEventListener("click", proxListener, listenerOpts);
+    elem.addEventListener("keydown", proxListener, listenerOpts);
+  }
+  /** Returns the dialog content element and all its children */
+  getDialogContent() {
+    return __async(this, null, function* () {
+      var _a, _b, _c, _d;
+      const header = (_b = (_a = this.options).renderHeader) == null ? void 0 : _b.call(_a);
+      const footer = (_d = (_c = this.options).renderFooter) == null ? void 0 : _d.call(_c);
+      const dialogWrapperEl = document.createElement("div");
+      dialogWrapperEl.id = `uu-${this.id}-dialog`;
+      dialogWrapperEl.classList.add("uu-dialog");
+      dialogWrapperEl.ariaLabel = dialogWrapperEl.title = "";
+      dialogWrapperEl.role = "dialog";
+      dialogWrapperEl.setAttribute("aria-labelledby", `uu-${this.id}-dialog-title`);
+      dialogWrapperEl.setAttribute("aria-describedby", `uu-${this.id}-dialog-body`);
+      if (this.options.verticalAlign !== "center")
+        dialogWrapperEl.classList.add(`align-${this.options.verticalAlign}`);
+      const headerWrapperEl = document.createElement("div");
+      headerWrapperEl.classList.add("uu-dialog-header");
+      this.options.small && headerWrapperEl.classList.add("small");
+      if (header) {
+        const headerTitleWrapperEl = document.createElement("div");
+        headerTitleWrapperEl.id = `uu-${this.id}-dialog-title`;
+        headerTitleWrapperEl.classList.add("uu-dialog-title-wrapper");
+        headerTitleWrapperEl.role = "heading";
+        headerTitleWrapperEl.ariaLevel = "1";
+        headerTitleWrapperEl.appendChild(header instanceof Promise ? yield header : header);
+        headerWrapperEl.appendChild(headerTitleWrapperEl);
+      } else {
+        const padEl = document.createElement("div");
+        padEl.classList.add("uu-dialog-header-pad", this.options.small ? "small" : "");
+        headerWrapperEl.appendChild(padEl);
+      }
+      if (this.options.renderCloseBtn) {
+        const closeBtnEl = yield this.options.renderCloseBtn();
+        closeBtnEl.classList.add("uu-dialog-close");
+        this.options.small && closeBtnEl.classList.add("small");
+        closeBtnEl.tabIndex = 0;
+        if (closeBtnEl.hasAttribute("alt"))
+          closeBtnEl.setAttribute("alt", this.getString("closeDialogTooltip"));
+        closeBtnEl.title = closeBtnEl.ariaLabel = this.getString("closeDialogTooltip");
+        this.onInteraction(closeBtnEl, () => this.close());
+        headerWrapperEl.appendChild(closeBtnEl);
+      }
+      dialogWrapperEl.appendChild(headerWrapperEl);
+      const dialogBodyElem = document.createElement("div");
+      dialogBodyElem.id = `uu-${this.id}-dialog-body`;
+      dialogBodyElem.classList.add("uu-dialog-body");
+      this.options.small && dialogBodyElem.classList.add("small");
+      const body = this.options.renderBody();
+      dialogBodyElem.appendChild(body instanceof Promise ? yield body : body);
+      dialogWrapperEl.appendChild(dialogBodyElem);
+      if (footer) {
+        const footerWrapper = document.createElement("div");
+        footerWrapper.classList.add("uu-dialog-footer-cont");
+        dialogWrapperEl.appendChild(footerWrapper);
+        footerWrapper.appendChild(footer instanceof Promise ? yield footer : footer);
+      }
+      return dialogWrapperEl;
     });
   }
-}
-function getSiblingsFrame(refElement, siblingAmount, refElementAlignment = "center-top", includeRef = true) {
-  var _a, _b;
-  const siblings = [...(_b = (_a = refElement.parentNode) == null ? void 0 : _a.childNodes) != null ? _b : []];
-  const elemSiblIdx = siblings.indexOf(refElement);
-  if (elemSiblIdx === -1)
-    throw new Error("Element doesn't have a parent node");
-  if (refElementAlignment === "top")
-    return [...siblings.slice(elemSiblIdx + Number(!includeRef), elemSiblIdx + siblingAmount + Number(!includeRef))];
-  else if (refElementAlignment.startsWith("center-")) {
-    const halfAmount = (refElementAlignment === "center-bottom" ? Math.ceil : Math.floor)(siblingAmount / 2);
-    const startIdx = Math.max(0, elemSiblIdx - halfAmount);
-    const topOffset = Number(refElementAlignment === "center-top" && siblingAmount % 2 === 0 && includeRef);
-    const btmOffset = Number(refElementAlignment === "center-bottom" && siblingAmount % 2 !== 0 && includeRef);
-    const startIdxWithOffset = startIdx + topOffset + btmOffset;
-    return [
-      ...siblings.filter((_, idx) => includeRef || idx !== elemSiblIdx).slice(startIdxWithOffset, startIdxWithOffset + siblingAmount)
-    ];
-  } else if (refElementAlignment === "bottom")
-    return [...siblings.slice(elemSiblIdx - siblingAmount + Number(includeRef), elemSiblIdx + Number(includeRef))];
-  return [];
-}
+};
 
 // lib/misc.ts
 function autoPlural(word, num) {
@@ -538,6 +1078,13 @@ function autoPlural(word, num) {
     num = num.length;
   return `${word}${num === 1 ? "" : "s"}`;
 }
+function insertValues(input, ...values) {
+  return input.replace(/%\d/gm, (match) => {
+    var _a, _b;
+    const argIndex = Number(match.substring(1)) - 1;
+    return (_b = (_a = values[argIndex]) != null ? _a : match) == null ? void 0 : _b.toString();
+  });
+}
 function pauseFor(time) {
   return new Promise((res) => {
     setTimeout(() => res(), time);
@@ -576,71 +1123,6 @@ function fetchAdvanced(_0) {
     }
   });
 }
-function insertValues(input, ...values) {
-  return input.replace(/%\d/gm, (match) => {
-    var _a, _b;
-    const argIndex = Number(match.substring(1)) - 1;
-    return (_b = (_a = values[argIndex]) != null ? _a : match) == null ? void 0 : _b.toString();
-  });
-}
-function compress(input, compressionFormat, outputType = "string") {
-  return __async(this, null, function* () {
-    const byteArray = typeof input === "string" ? new TextEncoder().encode(input) : input;
-    const comp = new CompressionStream(compressionFormat);
-    const writer = comp.writable.getWriter();
-    writer.write(byteArray);
-    writer.close();
-    const buf = yield new Response(comp.readable).arrayBuffer();
-    return outputType === "arrayBuffer" ? buf : ab2str(buf);
-  });
-}
-function decompress(input, compressionFormat, outputType = "string") {
-  return __async(this, null, function* () {
-    const byteArray = typeof input === "string" ? str2ab(input) : input;
-    const decomp = new DecompressionStream(compressionFormat);
-    const writer = decomp.writable.getWriter();
-    writer.write(byteArray);
-    writer.close();
-    const buf = yield new Response(decomp.readable).arrayBuffer();
-    return outputType === "arrayBuffer" ? buf : new TextDecoder().decode(buf);
-  });
-}
-function ab2str(buf) {
-  return getUnsafeWindow().btoa(
-    new Uint8Array(buf).reduce((data, byte) => data + String.fromCharCode(byte), "")
-  );
-}
-function str2ab(str) {
-  return Uint8Array.from(getUnsafeWindow().atob(str), (c) => c.charCodeAt(0));
-}
-function computeHash(input, algorithm = "SHA-256") {
-  return __async(this, null, function* () {
-    let data;
-    if (typeof input === "string") {
-      const encoder = new TextEncoder();
-      data = encoder.encode(input);
-    } else
-      data = input;
-    const hashBuffer = yield crypto.subtle.digest(algorithm, data);
-    const hashArray = Array.from(new Uint8Array(hashBuffer));
-    const hashHex = hashArray.map((byte) => byte.toString(16).padStart(2, "0")).join("");
-    return hashHex;
-  });
-}
-function randomId(length = 16, radix = 16, enhancedEntropy = false) {
-  if (enhancedEntropy) {
-    const arr = new Uint8Array(length);
-    crypto.getRandomValues(arr);
-    return Array.from(
-      arr,
-      (v) => mapRange(v, 0, 255, 0, radix).toString(radix).substring(0, 1)
-    ).join("");
-  }
-  return Array.from(
-    { length },
-    () => Math.floor(Math.random() * radix).toString(radix)
-  ).join("");
-}
 
 // lib/SelectorObserver.ts
 var domLoaded = false;
@@ -843,33 +1325,4 @@ tr.getLanguage = () => {
   return curLang;
 };
 
-exports.DataStore = DataStore;
-exports.DataStoreSerializer = DataStoreSerializer;
-exports.SelectorObserver = SelectorObserver;
-exports.addGlobalStyle = addGlobalStyle;
-exports.addParent = addParent;
-exports.autoPlural = autoPlural;
-exports.clamp = clamp;
-exports.compress = compress;
-exports.computeHash = computeHash;
-exports.debounce = debounce;
-exports.decompress = decompress;
-exports.fetchAdvanced = fetchAdvanced;
-exports.getSiblingsFrame = getSiblingsFrame;
-exports.getUnsafeWindow = getUnsafeWindow;
-exports.insertValues = insertValues;
-exports.interceptEvent = interceptEvent;
-exports.interceptWindowEvent = interceptWindowEvent;
-exports.isScrollable = isScrollable;
-exports.mapRange = mapRange;
-exports.observeElementProp = observeElementProp;
-exports.openInNewTab = openInNewTab;
-exports.pauseFor = pauseFor;
-exports.preloadImages = preloadImages;
-exports.randRange = randRange;
-exports.randomId = randomId;
-exports.randomItem = randomItem;
-exports.randomItemIndex = randomItemIndex;
-exports.randomizeArray = randomizeArray;
-exports.takeRandomItem = takeRandomItem;
-exports.tr = tr;
+export { DataStore, DataStoreSerializer, Dialog, NanoEmitter, SelectorObserver, addGlobalStyle, addParent, autoPlural, clamp, compress, computeHash, currentDialogId, debounce, decompress, defaultDialogCss, defaultStrings, fetchAdvanced, getSiblingsFrame, getUnsafeWindow, insertValues, interceptEvent, interceptWindowEvent, isScrollable, mapRange, observeElementProp, openDialogs, openInNewTab, pauseFor, preloadImages, randRange, randomId, randomItem, randomItemIndex, randomizeArray, setInnerHtmlUnsafe, takeRandomItem, tr };