@sv443-network/userutils 7.0.1 → 7.2.0

package/dist/index.global.js

@@ -8,7 +8,7 @@
 // ==UserLibrary==
 // @name         UserUtils
 // @description  Library with various utilities for userscripts - register listeners for when CSS selectors exist, intercept events, create persistent & synchronous data stores, modify the DOM more easily and more
-// @version      7.0.1
+// @version      7.2.0
 // @license      MIT
 // @copyright    Sv443 (https://github.com/Sv443)
 
@@ -128,6 +128,197 @@ var UserUtils = (function (exports) {
     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 {
     /**
@@ -432,125 +623,494 @@ Has: ${checksum}`);
     }
   };
 
-  // lib/dom.ts
-  function getUnsafeWindow() {
-    try {
-      return unsafeWindow;
-    } catch (e) {
-      return window;
+  // node_modules/nanoevents/index.js
+  var createNanoEvents = () => ({
+    emit(event, ...args) {
+      for (let i = 0, callbacks = this.events[event] || [], length = callbacks.length; i < length; i++) {
+        callbacks[i](...args);
+      }
+    },
+    events: {},
+    on(event, cb) {
+      var _a;
+      ((_a = this.events)[event] || (_a[event] = [])).push(cb);
+      return () => {
+        var _a2;
+        this.events[event] = (_a2 = this.events[event]) == null ? void 0 : _a2.filter((i) => cb !== i);
+      };
     }
-  }
-  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");
-    styleElem.innerHTML = 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
+  });
+
+  // lib/NanoEmitter.ts
+  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);
       });
-      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))
+    /** 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;
+}
+
+.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;
+}
+
+.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);
+}
+
+.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);
+}
+
+.uu-dialog.align-top {
+  top: 0;
+  transform: translate(-50%, 40px);
+}
+
+.uu-dialog.align-bottom {
+  top: 100%;
+  transform: translate(-50%, -100%);
+}
+
+.uu-dialog-body {
+  font-size: 1.5rem;
+  padding: 20px;
+}
+
+.uu-dialog-body.small {
+  padding: 15px;
+}
+
+#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;
+}`;
+  exports.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;
+        exports.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);
+      exports.currentDialogId = (_a = openDialogs[0]) != null ? _a : null;
+      if (exports.currentDialogId)
+        (_b = document.querySelector(`#uu-${exports.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 exports.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;
+          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
-            return origListener.apply(this, a);
-        };
-        original.apply(this, args);
+        } 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);
       };
-    })(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;
+      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) {
@@ -558,6 +1118,13 @@ Has: ${checksum}`);
       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);
@@ -596,71 +1163,6 @@ Has: ${checksum}`);
       }
     });
   }
-  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;
@@ -865,6 +1367,8 @@ Has: ${checksum}`);
 
   exports.DataStore = DataStore;
   exports.DataStoreSerializer = DataStoreSerializer;
+  exports.Dialog = Dialog;
+  exports.NanoEmitter = NanoEmitter;
   exports.SelectorObserver = SelectorObserver;
   exports.addGlobalStyle = addGlobalStyle;
   exports.addParent = addParent;
@@ -874,6 +1378,8 @@ Has: ${checksum}`);
   exports.computeHash = computeHash;
   exports.debounce = debounce;
   exports.decompress = decompress;
+  exports.defaultDialogCss = defaultDialogCss;
+  exports.defaultStrings = defaultStrings;
   exports.fetchAdvanced = fetchAdvanced;
   exports.getSiblingsFrame = getSiblingsFrame;
   exports.getUnsafeWindow = getUnsafeWindow;
@@ -883,6 +1389,7 @@ Has: ${checksum}`);
   exports.isScrollable = isScrollable;
   exports.mapRange = mapRange;
   exports.observeElementProp = observeElementProp;
+  exports.openDialogs = openDialogs;
   exports.openInNewTab = openInNewTab;
   exports.pauseFor = pauseFor;
   exports.preloadImages = preloadImages;
@@ -891,6 +1398,7 @@ Has: ${checksum}`);
   exports.randomItem = randomItem;
   exports.randomItemIndex = randomItemIndex;
   exports.randomizeArray = randomizeArray;
+  exports.setInnerHtmlUnsafe = setInnerHtmlUnsafe;
   exports.takeRandomItem = takeRandomItem;
   exports.tr = tr;