@sv443-network/userutils 7.1.0 → 7.2.0

package/dist/index.js

@@ -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,6 @@ Has: ${checksum}`);
     });
   }
 };
-
-// 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");
-  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
-    });
-    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 NanoEmitter = class {
   constructor(options = {}) {
     __publicField(this, "events", createNanoEvents());
@@ -756,9 +827,8 @@ var Dialog = class _Dialog extends NanoEmitter {
       destroyOnClose: false,
       unmountOnClose: true,
       removeListenersOnDestroy: true,
-      smallHeader: false,
-      verticalAlign: "center",
-      dialogCss: defaultDialogCss
+      small: false,
+      verticalAlign: "center"
     }, opts);
     this.id = opts.id;
   }
@@ -766,11 +836,12 @@ var Dialog = class _Dialog extends NanoEmitter {
   /** 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(this.options.dialogCss).classList.add("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");
@@ -1007,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);
@@ -1045,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;
@@ -1312,4 +1325,4 @@ tr.getLanguage = () => {
   return curLang;
 };
 
-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, takeRandomItem, 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 };

package/dist/lib/Dialog.d.ts

@@ -1,5 +1,5 @@
 import { NanoEmitter } from "./NanoEmitter.js";
-export declare const defaultDialogCss = ".uu-no-select {\n  user-select: none;\n}\n\n.uu-dialog-bg {\n  --uu-dialog-bg: #333333;\n  --uu-dialog-bg-highlight: #252525;\n  --uu-scroll-indicator-bg: rgba(10, 10, 10, 0.7);\n  --uu-dialog-separator-color: #797979;\n  --uu-dialog-border-radius: 10px;\n}\n\n.uu-dialog-bg {\n  display: block;\n  position: fixed;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  z-index: 5;\n  background-color: rgba(0, 0, 0, 0.6);\n}\n\n.uu-dialog {\n  --uu-calc-dialog-height: calc(min(100vh - 40px, var(--uu-dialog-height-max)));\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  width: calc(min(100% - 60px, var(--uu-dialog-width-max)));\n  border-radius: var(--uu-dialog-border-radius);\n  height: auto;\n  max-height: var(--uu-calc-dialog-height);\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 6;\n  color: #fff;\n  background-color: var(--uu-dialog-bg);\n}\n\n.uu-dialog.align-top {\n  top: 0;\n  transform: translate(-50%, 40px);\n}\n\n.uu-dialog.align-bottom {\n  top: 100%;\n  transform: translate(-50%, -100%);\n}\n\n.uu-dialog-body {\n  font-size: 1.5rem;\n  padding: 20px;\n}\n\n.uu-dialog-body.small {\n  padding: 15px;\n}\n\n#uu-dialog-opts {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  padding: 30px 0px;\n  overflow-y: auto;\n}\n\n.uu-dialog-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 6px;\n  padding: 15px 20px 15px 20px;\n  background-color: var(--uu-dialog-bg);\n  border: 2px solid var(--uu-dialog-separator-color);\n  border-style: none none solid none !important;\n  border-radius: var(--uu-dialog-border-radius) var(--uu-dialog-border-radius) 0px 0px;\n}\n\n.uu-dialog-header.small {\n  padding: 10px 15px;\n  border-style: none none solid none !important;\n}\n\n.uu-dialog-header-pad {\n  content: \" \";\n  min-height: 32px;\n}\n\n.uu-dialog-header-pad.small {\n  min-height: 24px;\n}\n\n.uu-dialog-titlecont {\n  display: flex;\n  align-items: center;\n}\n\n.uu-dialog-titlecont-no-title {\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n}\n\n.uu-dialog-title {\n  position: relative;\n  display: inline-block;\n  font-size: 22px;\n}\n\n.uu-dialog-close {\n  cursor: pointer;\n}\n\n.uu-dialog-header-img,\n.uu-dialog-close\n{\n  width: 32px;\n  height: 32px;\n}\n\n.uu-dialog-header-img.small,\n.uu-dialog-close.small\n{\n  width: 24px;\n  height: 24px;\n}\n\n.uu-dialog-footer {\n  font-size: 17px;\n  text-decoration: underline;\n}\n\n.uu-dialog-footer.hidden {\n  display: none;\n}\n\n.uu-dialog-footer-cont {\n  margin-top: 6px;\n  padding: 15px 20px;\n  background: var(--uu-dialog-bg);\n  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, var(--uu-dialog-bg) 30%, var(--uu-dialog-bg) 100%);\n  border: 2px solid var(--uu-dialog-separator-color);\n  border-style: solid none none none !important;\n  border-radius: 0px 0px var(--uu-dialog-border-radius) var(--uu-dialog-border-radius);\n}\n\n.uu-dialog-footer-buttons-cont button:not(:last-of-type) {\n  margin-right: 15px;\n}";
+export declare const defaultDialogCss: string;
 /** ID of the last opened (top-most) dialog */
 export declare let currentDialogId: string | null;
 /** IDs of all currently open dialogs, top-most first */
@@ -56,43 +56,16 @@ export declare class Dialog extends NanoEmitter<{
     destroy: () => void;
 }> {
     /** Options passed to the dialog in the constructor */
-    readonly options: {
-        /** ID that gets added to child element IDs - has to be unique and conform to HTML ID naming rules! */
-        id: string;
-        /** Target and max width of the dialog in pixels */
-        width: number;
-        /** Target and max height of the dialog in pixels */
-        height: number;
-        closeOnBgClick: boolean;
-        closeOnEscPress: boolean;
-        destroyOnClose: boolean;
-        unmountOnClose: boolean;
-        removeListenersOnDestroy: boolean;
-        /** Whether the dialog should have a smaller overall appearance - defaults to false */
-        small?: boolean | undefined;
-        verticalAlign: string;
-        dialogCss: string;
-        /** Called to render the body of the dialog */
-        renderBody: () => HTMLElement | Promise<HTMLElement>;
-        /** Called to render the header of the dialog - leave undefined for a blank header */
-        renderHeader?: (() => HTMLElement | Promise<HTMLElement>) | undefined;
-        /** Called to render the footer of the dialog - leave undefined for no footer */
-        renderFooter?: (() => HTMLElement | Promise<HTMLElement>) | undefined;
-        /** Called to render the close button of the dialog - leave undefined for no close button */
-        renderCloseBtn?: (() => HTMLElement | Promise<HTMLElement>) | undefined;
-        smallHeader: boolean;
-    };
+    readonly options: DialogOptions;
     /** ID that gets added to child element IDs - has to be unique and conform to HTML ID naming rules! */
     readonly id: string;
     /** Strings used in the dialog (used for translations) */
-    strings: {
-        closeDialogTooltip: string;
-    };
+    strings: typeof defaultStrings;
     protected dialogOpen: boolean;
     protected dialogMounted: boolean;
     constructor(options: DialogOptions);
     /** Call after DOMContentLoaded to pre-render the dialog and invisibly mount it in the DOM */
-    mount(): Promise<HTMLDivElement | undefined>;
+    mount(): Promise<HTMLElement | void>;
     /** Closes the dialog and clears all its contents (unmounts elements from the DOM) in preparation for a new rendering call */
     unmount(): void;
     /** Clears the DOM of the dialog and then renders it again */
@@ -101,7 +74,7 @@ export declare class Dialog extends NanoEmitter<{
      * 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?: MouseEvent | KeyboardEvent): Promise<void | HTMLElement>;
+    open(e?: MouseEvent | KeyboardEvent): Promise<HTMLElement | void>;
     /** Closes the dialog - prevents default action and immediate propagation of the passed event */
     close(e?: MouseEvent | KeyboardEvent): void;
     /** Returns true if the dialog is currently open */
@@ -127,5 +100,5 @@ export declare class Dialog extends NanoEmitter<{
         stopPropagation?: boolean;
     }): void;
     /** Returns the dialog content element and all its children */
-    protected getDialogContent(): Promise<HTMLDivElement>;
+    protected getDialogContent(): Promise<HTMLElement>;
 }

package/dist/lib/NanoEmitter.d.ts

@@ -1,11 +1,11 @@
-import { type DefaultEvents, type EventsMap, type Unsubscribe } from "nanoevents";
+import { type DefaultEvents, type Emitter, type EventsMap, type Unsubscribe } from "nanoevents";
 export interface NanoEmitterOptions {
     /** If set to true, allows emitting events through the public method emit() */
     publicEmit: boolean;
 }
 /** Class that can be extended or instantiated by itself to create an event emitter with helper methods and a strongly typed event map */
 export declare class NanoEmitter<TEvtMap extends EventsMap = DefaultEvents> {
-    protected readonly events: import("nanoevents").Emitter<TEvtMap>;
+    protected readonly events: Emitter<TEvtMap>;
     protected eventUnsubscribes: Unsubscribe[];
     protected emitterOptions: NanoEmitterOptions;
     constructor(options?: Partial<NanoEmitterOptions>);

package/dist/lib/colors.d.ts

@@ -0,0 +1,18 @@
+/** Converts a hex color string to a tuple of RGB values */
+export declare function hexToRgb(hex: string): [red: number, green: number, blue: number];
+/** Converts RGB values to a hex color string */
+export declare function rgbToHex(red: number, green: number, blue: number, withHash?: boolean, upperCase?: boolean): string;
+/**
+ * Lightens a CSS color value (in hex, RGB or RGBA format) by a given percentage.
+ * Will not exceed the maximum range (00-FF or 0-255).
+ * @returns Returns the new color value in the same format as the input
+ * @throws Throws if the color format is invalid or not supported
+ */
+export declare function lightenColor(color: string, percent: number): string;
+/**
+ * Darkens a CSS color value (in hex, RGB or RGBA format) by a given percentage.
+ * Will not exceed the maximum range (00-FF or 0-255).
+ * @returns Returns the new color value in the same format as the input
+ * @throws Throws if the color format is invalid or not supported
+ */
+export declare function darkenColor(color: string, percent: number): string;

package/dist/lib/crypto.d.ts

@@ -0,0 +1,24 @@
+/** Compresses a string or an ArrayBuffer using the provided {@linkcode compressionFormat} and returns it as a base64 string */
+export declare function compress(input: string | ArrayBuffer, compressionFormat: CompressionFormat, outputType?: "string"): Promise<string>;
+/** Compresses a string or an ArrayBuffer using the provided {@linkcode compressionFormat} and returns it as an ArrayBuffer */
+export declare function compress(input: string | ArrayBuffer, compressionFormat: CompressionFormat, outputType: "arrayBuffer"): Promise<ArrayBuffer>;
+/** Decompresses a previously compressed base64 string or ArrayBuffer, with the format passed by {@linkcode compressionFormat}, converted to a string */
+export declare function decompress(input: string | ArrayBuffer, compressionFormat: CompressionFormat, outputType?: "string"): Promise<string>;
+/** Decompresses a previously compressed base64 string or ArrayBuffer, with the format passed by {@linkcode compressionFormat}, converted to an ArrayBuffer */
+export declare function decompress(input: string | ArrayBuffer, compressionFormat: CompressionFormat, outputType: "arrayBuffer"): Promise<ArrayBuffer>;
+/**
+ * Creates a hash / checksum of the given {@linkcode input} string or ArrayBuffer using the specified {@linkcode algorithm} ("SHA-256" by default).
+ *
+ * ⚠️ Uses the SubtleCrypto API so it needs to run in a secure context (HTTPS).
+ * ⚠️ If you use this for cryptography, make sure to use a secure algorithm (under no circumstances use SHA-1) and to [salt](https://en.wikipedia.org/wiki/Salt_(cryptography)) your input data.
+ */
+export declare function computeHash(input: string | ArrayBuffer, algorithm?: string): Promise<string>;
+/**
+ * Generates a random ID with the specified length and radix (16 characters and hexadecimal by default)
+ *
+ * ⚠️ Not suitable for generating anything related to cryptography! Use [SubtleCrypto's `generateKey()`](https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/generateKey) for that instead.
+ * @param length The length of the ID to generate (defaults to 16)
+ * @param radix The [radix](https://en.wikipedia.org/wiki/Radix) of each digit (defaults to 16 which is hexadecimal. Use 2 for binary, 10 for decimal, 36 for alphanumeric, etc.)
+ * @param enhancedEntropy If set to true, uses [`crypto.getRandomValues()`](https://developer.mozilla.org/en-US/docs/Web/API/Crypto/getRandomValues) for better cryptographic randomness (this also makes it take MUCH longer to generate)
+ */
+export declare function randomId(length?: number, radix?: number, enhancedEntropy?: boolean): string;

package/dist/lib/dom.d.ts

@@ -63,3 +63,11 @@ export declare function observeElementProp<TElem extends Element = HTMLElement,
  * @returns An array of sibling elements
  */
 export declare function getSiblingsFrame<TSibling extends Element = HTMLElement>(refElement: Element, siblingAmount: number, refElementAlignment?: "center-top" | "center-bottom" | "top" | "bottom", includeRef?: boolean): TSibling[];
+/**
+ * Sets the innerHTML property of the provided element without any sanitation or validation.
+ * Uses a [Trusted Types policy](https://developer.mozilla.org/en-US/docs/Web/API/Trusted_Types_API) on Chromium-based browsers to trick the browser into thinking the HTML is safe.
+ * Use this if the page makes use of the CSP directive `require-trusted-types-for 'script'` and throws a "This document requires 'TrustedHTML' assignment" error on Chromium-based browsers.
+ *
+ * ⚠️ This function does not perform any sanitization and should thus be used with utmost caution, as it can easily lead to XSS vulnerabilities!
+ */
+export declare function setInnerHtmlUnsafe<TElement extends Element = HTMLElement>(element: TElement, html: string): TElement;

package/dist/lib/index.d.ts

@@ -1,4 +1,5 @@
 export * from "./array.js";
+export * from "./crypto.js";
 export * from "./DataStore.js";
 export * from "./DataStoreSerializer.js";
 export * from "./Dialog.js";

package/dist/lib/misc.d.ts

@@ -5,6 +5,13 @@ import type { Stringifiable } from "./types.js";
  * @param num If this is an array or NodeList, the amount of items is used
  */
 export declare function autoPlural(word: Stringifiable, num: number | unknown[] | NodeList): string;
+/**
+ * Inserts the passed values into a string at the respective placeholders.
+ * The placeholder format is `%n`, where `n` is the 1-indexed argument number.
+ * @param input The string to insert the values into
+ * @param values The values to insert, in order, starting at `%1`
+ */
+export declare function insertValues(input: string, ...values: Stringifiable[]): string;
 /** Pauses async execution for the specified time in ms */
 export declare function pauseFor(time: number): Promise<void>;
 /**
@@ -23,34 +30,3 @@ export type FetchAdvancedOpts = Omit<RequestInit & Partial<{
 }>, "signal">;
 /** Calls the fetch API with special options like a timeout */
 export declare function fetchAdvanced(input: RequestInfo | URL, options?: FetchAdvancedOpts): Promise<Response>;
-/**
- * Inserts the passed values into a string at the respective placeholders.
- * The placeholder format is `%n`, where `n` is the 1-indexed argument number.
- * @param input The string to insert the values into
- * @param values The values to insert, in order, starting at `%1`
- */
-export declare function insertValues(input: string, ...values: Stringifiable[]): string;
-/** Compresses a string or an ArrayBuffer using the provided {@linkcode compressionFormat} and returns it as a base64 string */
-export declare function compress(input: string | ArrayBuffer, compressionFormat: CompressionFormat, outputType?: "string"): Promise<string>;
-/** Compresses a string or an ArrayBuffer using the provided {@linkcode compressionFormat} and returns it as an ArrayBuffer */
-export declare function compress(input: string | ArrayBuffer, compressionFormat: CompressionFormat, outputType: "arrayBuffer"): Promise<ArrayBuffer>;
-/** Decompresses a previously compressed base64 string or ArrayBuffer, with the format passed by {@linkcode compressionFormat}, converted to a string */
-export declare function decompress(input: string | ArrayBuffer, compressionFormat: CompressionFormat, outputType?: "string"): Promise<string>;
-/** Decompresses a previously compressed base64 string or ArrayBuffer, with the format passed by {@linkcode compressionFormat}, converted to an ArrayBuffer */
-export declare function decompress(input: string | ArrayBuffer, compressionFormat: CompressionFormat, outputType: "arrayBuffer"): Promise<ArrayBuffer>;
-/**
- * Creates a hash / checksum of the given {@linkcode input} string or ArrayBuffer using the specified {@linkcode algorithm} ("SHA-256" by default).
- *
- * ⚠️ Uses the SubtleCrypto API so it needs to run in a secure context (HTTPS).
- * ⚠️ If you use this for cryptography, make sure to use a secure algorithm (under no circumstances use SHA-1) and to [salt](https://en.wikipedia.org/wiki/Salt_(cryptography)) your input data.
- */
-export declare function computeHash(input: string | ArrayBuffer, algorithm?: string): Promise<string>;
-/**
- * Generates a random ID with the specified length and radix (16 characters and hexadecimal by default)
- *
- * ⚠️ Not suitable for generating anything related to cryptography! Use [SubtleCrypto's `generateKey()`](https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/generateKey) for that instead.
- * @param length The length of the ID to generate (defaults to 16)
- * @param radix The [radix](https://en.wikipedia.org/wiki/Radix) of each digit (defaults to 16 which is hexadecimal. Use 2 for binary, 10 for decimal, 36 for alphanumeric, etc.)
- * @param enhancedEntropy If set to true, uses [`crypto.getRandomValues()`](https://developer.mozilla.org/en-US/docs/Web/API/Crypto/getRandomValues) for better cryptographic randomness (this also makes it take MUCH longer to generate)
- */
-export declare function randomId(length?: number, radix?: number, enhancedEntropy?: boolean): string;

package/dist/lib/types.d.ts

@@ -1,3 +1,13 @@
+export type TrustedTypesPolicy = {
+    createHTML?: (dirty: string) => string;
+};
+declare global {
+    interface Window {
+        trustedTypes: {
+            createPolicy(name: string, policy: TrustedTypesPolicy): TrustedTypesPolicy;
+        };
+    }
+}
 /** Represents any value that is either a string itself or can be converted to one (implicitly and explicitly) because it has a toString() method */
 export type Stringifiable = string | {
     toString(): string;