@t007/toast 0.0.38 → 0.0.39

package/dist/index.css

@@ -280,6 +280,14 @@
   animation-duration: var(--t007-toast-animation-duration);
   touch-action: none;
 }
+.t007-toast.t007-toast-compact {
+  min-width: unset;
+  width: fit-content;
+  max-width: var(--t007-toast-width);
+  height: fit-content;
+  min-height: unset;
+  max-height: var(--t007-toast-height);
+}
 .t007-toast:not(:has(.t007-toast-image, .t007-toast-icon:not(:empty))):has(.t007-toast-body) {
   padding-left: max(var(--t007-toast-padding), var(--t007-toast-smart-padding-left));
 }

package/dist/index.d.ts

@@ -3,7 +3,7 @@ type ToastType = undefined | "info" | "success" | "error" | "warning";
 /** Screen anchor for toast placement. */
 type ToastPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | "center-left" | "center-center" | "center-right";
 /** Motion preset used when a toast enters or leaves the screen. */
-type ToastAnimation = "fade" | "zoom" | "slide" | "slide-left" | "slide-right" | "slide-up" | "slide-down" | boolean;
+type ToastAnimation = "fade" | "zoom" | "slide" | "slide-left" | "slide-right" | "slide-up" | "slide-down" | false;
 /** Allowed pointer types for drag-to-dismiss gestures. */
 type ToastDragOption = boolean | "mouse" | "touch" | "pen";
 /** Allowed drag directions for dismiss gestures. `|` combines axes where it can be `a` or `b` and can change anytime while `||` does not change after a pick is determined. */
@@ -68,11 +68,13 @@ interface ToastOptions {
   /** Action buttons rendered under the message body. */
   actions?: Record<string, (e: MouseEvent, toast: ToastInstance) => void> | false;
   /** Callback fired when the toast closes. */
-  onClose?: (timeElapsed?: boolean | false) => void;
+  onClose?: (timeElapsed?: boolean | false, userInitiated?: boolean) => void;
   /** Callback fired as the toast auto-close timer advances. */
   onTimeUpdate?: (timeVisible: number) => void;
   /** Abort signal to control the toast's lifecycle and timeout aborts. */
   signal?: AbortSignal;
+  /** When true, the toast will be displayed in a more compact form. */
+  compact?: boolean;
   // [key: string]: any; // To allow arbitrary overrides internally if needed
 }
 
@@ -128,6 +130,8 @@ interface ToastPromiseConfig<T = any> {
 
 /** Public toast API exposed to consumers. */
 interface Toast {
+  /** Default options merged into every toast, update as needed. */
+  defaults: ToastOptions;
   /** Create a default toast.
    * @param render Body text for the toast.
    * @param options Toast configuration.
@@ -187,6 +191,11 @@ interface Toast {
    * @param timeElapsed Whether the auto-close timer already elapsed.
    */
   dismiss(id?: string, manner?: "smooth" | "instant", timeElapsed?: boolean): void;
+  /** Check if any toasts that share a group id are currently active.
+   * @param groupId Optional group id filter.
+   * @returns True if any toasts are active, false otherwise.
+   */
+  anyActive(groupId?: string): boolean;
   /** Dismiss every toast that matches an optional group id or the whole stack.
    * @param groupId Optional group id filter.
    */
@@ -222,11 +231,11 @@ interface Toasting {
 /** Internal helper methods used by the toast factory. */
 declare const toasting: Toasting;
 /** Create a toast factory with custom defaults and a group id.
- * @param defOptions Default options merged into every toast.
+ * @param defaults Default options merged into every toast.
  * @param groupId Prefix applied to generated ids.
  * @returns Toast factory.
  */
-declare function toaster(defOptions?: ToastOptions, groupId?: string): Toast;
+declare function toaster(defaults?: ToastOptions, groupId?: string): Toast;
 /** Default toast factory instance attached by the bundle. */
 declare const toast: Toast;
 

package/dist/index.global.js

@@ -13,7 +13,7 @@
     return sig.addEventListener("abort", kill, { once: true }), id;
   }
 
-  // ../../../sia-reactor/dist/chunk-PJTPFVEG.js
+  // ../../../sia-reactor/dist/chunk-4SGW3Y6X.js
   function onAllMethods(owner, callback, skipOwn = true, nested = false) {
     let proto = owner;
     while (proto && proto !== Object.prototype) {
@@ -53,7 +53,7 @@
     return el;
   }
 
-  // ../../../sia-reactor/dist/chunk-LZJYX2LE.js
+  // ../../../sia-reactor/dist/chunk-GH5QAGIC.js
   var RTR_BATCH = "undefined" !== typeof window ? ("undefined" !== typeof queueMicrotask ? queueMicrotask : setTimeout).bind(window) : "undefined" !== typeof process && process.nextTick ? process.nextTick : setTimeout;
   var RTR_LOG = console.log.bind(console, "[S.I.A Reactor]");
   var NIL = Object.freeze({});
@@ -88,7 +88,7 @@
     return "object" === typeof obj && obj !== null && (arraycheck ? !Array.isArray(obj) : true);
   }
 
-  // ../utils/dist/chunk-ZFW6HNGO.js
+  // ../utils/dist/chunk-RCSOMCIC.js
   var INTERACTIVE_SELECTOR = ":is(button,[href],input:not([type='hidden']),select,textarea,details>summary,[contenteditable],iframe,audio[controls],video[controls],[tabindex]):not([disabled],[tabindex='-1'],[data-focus-guard],[inert],[inert] *)";
   var VIRTUAL_RESOURCE = /* @__PURE__ */ Symbol.for("T007_VIRTUAL_RESOURCE");
   function loadResource(req, type = "style", { module, media, crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, attempts = 3, retryKey = false } = {}, win = window) {
@@ -104,7 +104,7 @@
           el?.remove?.();
           if (remaining > 1) {
             setTimeout(tryLoad, 1e3, remaining - 1);
-            console.warn(`Retrying ${type} load for "${src}" (${attempts - remaining + 1})...`);
+            console.warn(`Retrying ${type} load for "${src}" (${attempts - remaining + 1}/${attempts})...`);
           } else {
             delete win.t007._resourceCache[src];
             reject(new Error(`${capitalize(type)} load failed for "${src}"`));
@@ -172,7 +172,6 @@
     #constructed = false;
     // to minimize updates
     #autoCloseInterval;
-    #progressInterval;
     #timeVisible = 0;
     #isPaused = false;
     #shouldUnPause;
@@ -282,7 +281,7 @@
     }
     set closeButton(value) {
       const btn = this.toastElement.querySelector(".t007-toast-cancel-button");
-      if (value) this.toastElement.append(btn || createEl("button", { title: "Close", ariaLabel: "Close notification", className: "t007-toast-cancel-button", innerHTML: "×", onclick: this.remove }));
+      if (value) this.toastElement.append(btn || createEl("button", { title: "Close", ariaLabel: "Close notification", className: "t007-toast-cancel-button", innerHTML: "×", onclick: () => this.remove(void 0, false, true) }));
       else btn?.remove();
     }
     get animation() {
@@ -302,6 +301,7 @@
     set autoClose(value) {
       cancelAnimationFrame(this.#autoCloseInterval);
       this.#timeVisible = 0;
+      this.toastElement.classList.toggle("progress", !this.opts.hideProgressBar && isNum(this.autoClose));
       this.nprogress = void 0;
       let lastTime;
       const loop = (time) => {
@@ -316,6 +316,7 @@
         if (!this.#isPaused) {
           this.#timeVisible += time - lastTime;
           this.onTimeUpdate?.(this.#timeVisible);
+          if (!this.opts.hideProgressBar) this.nprogress = void 0;
           if (isNum(this.autoClose) && this.#timeVisible >= this.autoClose) return this.remove("smooth", true);
         }
         lastTime = time;
@@ -327,21 +328,15 @@
       if (!this.#constructed) return;
       const currContainer = this.toastElement.parentElement, container = this.rootElement.querySelector(`:scope > .t007-toast-container[data-position="${value}"]`) || this._createContainer(value);
       !container.contains(this.toastElement) && container[this.opts.newestOnTop ? "prepend" : "append"](this.toastElement);
-      this.toastElement.classList.toggle("t007-toast-scoped", this.scoped);
+      this.toastElement.classList.toggle("t007-toast-scoped", this.scoped), this.animation = true;
       if (!(currContainer == null || currContainer.hasChildNodes())) currContainer.remove();
     }
     set closeOnClick(value) {
-      this.toastElement.onclick = value ? () => this.remove() : null;
+      this.toastElement.onclick = value ? () => this.remove(void 0, false, true) : null;
     }
     set hideProgressBar(value) {
-      this.toastElement.classList.toggle("progress", !value);
-      this.nprogress = void 0;
-      cancelAnimationFrame(this.#progressInterval);
-      const loop = () => {
-        if (isNum(this.autoClose) && !this.#isPaused) this.nprogress = void 0;
-        this.#progressInterval = requestAnimationFrame(loop);
-      };
-      if (!value) this.#progressInterval = requestAnimationFrame(loop);
+      this.toastElement.classList.toggle("progress", !value && isNum(this.autoClose));
+      if (!value && isNum(this.autoClose)) this.nprogress = void 0;
     }
     get nprogress() {
       return Number(this.toastElement.style.getProperty("--progress"));
@@ -372,9 +367,10 @@
       value && navigator?.vibrate?.(this.vibrate);
     }
     set limit(value) {
-      const toastsInContainer = [...this.toastElement?.parentElement?.children || []];
-      if (!toastsInContainer.length) return;
-      for (let i = 0; i < toastsInContainer.length - value; i++) [...t007.toasts.values()].find((t) => t.toastElement === (this.opts.newestOnTop ? toastsInContainer[toastsInContainer.length - 1 - i] : toastsInContainer[i]))?.abort();
+      if (!value) return;
+      const els = [...this.toastElement?.parentElement?.children || []];
+      if (!els.length) return;
+      for (let i = 0; i < els.length - value; i++) [...t007.toasts.values()].find((t) => t.toastElement === (this.opts.newestOnTop ? els[els.length - 1 - i] : els[i]))?.abort();
     }
     set newestOnTop(value) {
       this.toastElement?.parentElement?.[value ? "prepend" : "append"](this.toastElement);
@@ -384,6 +380,9 @@
       this.toastElement.onpointerdown = value ? this._handleToastPointerStart : null;
       this.toastElement.onpointerup = value ? this._handleToastPointerUp : null;
     }
+    set compact(value) {
+      this.toastElement.classList.toggle("t007-toast-compact", !!value);
+    }
     _handleToastPointerStart(e) {
       if (isStr(this._ptrType) && e.pointerType !== this._ptrType) return;
       if (e.touches?.length > 1) return;
@@ -417,22 +416,22 @@
     _handleToastPointerUp(e) {
       if (isStr(this._ptrType) && e.pointerType !== this._ptrType) return;
       cancelAnimationFrame(this._ptrRAF);
-      if (Math.abs(this._ptrDeltaX) > this.toastElement.offsetWidth * ((this.opts.dragToClosePercent.x ?? this.opts.dragToClosePercent) / 100) || Math.abs(this._ptrDeltaY) > this.toastElement.offsetHeight * ((this.opts.dragToClosePercent.y ?? this.opts.dragToClosePercent) / 100)) return this.abort();
+      if (Math.abs(this._ptrDeltaX) > this.toastElement.offsetWidth * ((this.opts.dragToClosePercent.x ?? this.opts.dragToClosePercent) / 100) || Math.abs(this._ptrDeltaY) > this.toastElement.offsetHeight * ((this.opts.dragToClosePercent.y ?? this.opts.dragToClosePercent) / 100)) return this.remove("instant", false, true);
       this.#isPaused = this._ptrTicker = this._ptrDirSet = this._ptrDir = false;
       this.toastElement.removeEventListener("pointermove", this._handleToastPointerMove, { passive: false });
       for (const prop of ["transition", "transform", "opacity"]) this.toastElement.style.removeProperty(prop);
     }
-    remove(manner = "smooth", timeElapsed = false) {
+    remove(manner = "smooth", timeElapsed = false, userInitiated = false) {
       if (!this.opts.isLoading) t007.toasts.delete(this.opts.id);
       for (const tid of this.queue) clearTimeout(tid);
       document.removeEventListener("visibilitychange", this.#visiblityChange);
-      cancelAnimationFrame(this.#autoCloseInterval), cancelAnimationFrame(this.#progressInterval);
+      cancelAnimationFrame(this.#autoCloseInterval);
       if (this.inactive || manner === "instant" || !this.animation) this._cleanUpToast();
       else if (this.toastElement) this.toastElement.onanimationend = this._cleanUpToast;
       this.toastElement?.classList.remove("t007-toast-show");
-      this.onClose?.(timeElapsed);
+      this.onClose?.(timeElapsed, userInitiated);
     }
-    abort = () => this.remove("instant", false);
+    abort = () => this.remove("instant");
     _createContainer(position) {
       const container = createEl("div", { className: "t007-toast-container" }, { position });
       container.style.setProperty("--t007-toast-container-position", !this.scoped ? "fixed" : "absolute");
@@ -479,19 +478,19 @@
       const pendingId = base.loading(pendingCfg.render || "Promise pending...", { ...pendingCfg });
       promise.then(
         (response) => {
-          const successConfig = NFC(success || "Promise resolved", "success");
-          const { render, bodyHTML } = successConfig;
-          if (isFunc(render)) successConfig.render = (txt = response) => render(txt);
-          if (isFunc(bodyHTML)) successConfig.bodyHTML = (txt = response) => bodyHTML(txt);
-          base.success(pendingId, successConfig);
+          const config = NFC(success || "Promise resolved", "success");
+          const { render, bodyHTML } = config;
+          if (isFunc(render)) config.render = (txt = response) => render(txt);
+          if (isFunc(bodyHTML)) config.bodyHTML = (txt = response) => bodyHTML(txt);
+          base.success(pendingId, config);
           return response;
         },
         (err) => {
-          const errorConfig = NFC(error || "Promise rejected", "error");
-          const { render, bodyHTML } = errorConfig;
-          if (isFunc(render)) errorConfig.render = (txt = err) => render(txt);
-          if (isFunc(bodyHTML)) errorConfig.bodyHTML = (txt = err) => bodyHTML(txt);
-          base.error(pendingId, errorConfig);
+          const config = NFC(error || "Promise rejected", "error");
+          const { render, bodyHTML } = config;
+          if (isFunc(render)) config.render = (txt = err) => render(txt);
+          if (isFunc(bodyHTML)) config.bodyHTML = (txt = err) => bodyHTML(txt);
+          base.error(pendingId, config);
           return Promise.reject(err);
         }
       );
@@ -500,6 +499,9 @@
     dismiss(base, id, manner, timeElapsed) {
       return !isDef(id) ? base.dismissAll() : t007.toasts.get(id)?.remove(manner, timeElapsed);
     },
+    anyActive(base, groupId) {
+      return [...t007.toasts.values()].some((toast2) => (!isDef(groupId) ? true : toast2.opts.groupId === groupId) && base.isActive(toast2.opts.id, toast2));
+    },
     dismissAll(base, groupId) {
       for (const toast2 of t007.toasts.values()) (!isDef(groupId) ? true : toast2.opts.groupId === groupId) && toast2.remove();
     },
@@ -510,14 +512,16 @@
       return t007.toasts.values().filter((toast2) => !isDef(groupId) ? true : toast2.opts.groupId === groupId);
     }
   };
-  var toaster = (defOptions = {}, groupId = "t007_toast_") => {
-    const getDefaults = () => ({ ...t007.TOAST_DEFAULT_OPTIONS, ...defOptions }), base = (renderOrId, options = {}, mayBeId = renderOrId?.startsWith?.(groupId), render = mayBeId ? options.render : renderOrId, id = mayBeId ? renderOrId : options.id, toast2 = t007.toasts.get(id)) => toast2 ? toasting.update(base, id, { ...options, render }, toast2) : new T007_Toast({ ...getDefaults(), ...options, id, render, groupId }).opts.id;
+  var toaster = (defaults = {}, groupId = "t007_toast_") => {
+    const getDefaults = () => ({ ...t007.TOAST_DEFAULT_OPTIONS, ...base.defaults, groupId }), base = (renderOrId, options = {}, mayBeId = renderOrId?.startsWith?.(groupId), render = mayBeId ? options.render : renderOrId, id = mayBeId ? renderOrId : options.id, toast2 = t007.toasts.get(id)) => toast2 ? toasting.update(base, id, { ...options, render }, toast2) : new T007_Toast({ ...getDefaults(), ...options, id, render }).opts.id;
+    base.defaults = defaults;
     base.isActive = (id) => toasting.isActive(base, id);
     base.update = (id, options, _toast) => toasting.update(base, id, options, _toast);
     for (const action of ["info", "success", "warn", "error"]) base[action] = (renderOrId, options) => toasting.message(base, getDefaults, action, renderOrId, options);
     base.loading = (renderOrId, options) => toasting.loading(base, renderOrId, options);
     base.promise = (promise, config) => toasting.promise(base, promise, config);
     base.dismiss = (id, manner, timeElapsed) => toasting.dismiss(base, id, manner, timeElapsed);
+    base.anyActive = (groupId2) => toasting.anyActive(base, groupId2);
     base.dismissAll = (groupId2) => toasting.dismissAll(base, groupId2);
     base.doForAll = (action, options, groupId2) => toasting.doForAll(base, action, options, groupId2);
     base.getAll = (groupId2) => toasting.getAll(base, groupId2);
@@ -526,7 +530,7 @@
   var toast = toaster();
   var index_default = toast;
   var TOAST_UI_POSITIONS = [{ value: "top-left", display: "Top Left" }, { value: "top-center", display: "Top Center" }, { value: "top-right", display: "Top Right" }, { value: "center-left", display: "Center Left" }, { value: "center-center", display: "Center Center" }, { value: "center-right", display: "Center Right" }, { value: "bottom-left", display: "Bottom Left" }, { value: "bottom-center", display: "Bottom Center" }, { value: "bottom-right", display: "Bottom Right" }];
-  var TOAST_UI_ANIMATIONS = [{ value: "fade", display: "Fade" }, { value: "zoom", display: "Zoom" }, { value: "slide", display: "Slide" }, { value: "slide-left", display: "Slide Left" }, { value: "slide-right", display: "Slide Right" }, { value: "slide-up", display: "Slide Up" }, { value: "slide-down", display: "Slide Down" }];
+  var TOAST_UI_ANIMATIONS = [{ value: "fade", display: "Fade" }, { value: "zoom", display: "Zoom" }, { value: "slide", display: "Slide" }, { value: "slide-left", display: "Slide Left" }, { value: "slide-right", display: "Slide Right" }, { value: "slide-up", display: "Slide Up" }, { value: "slide-down", display: "Slide Down" }, { value: false, display: "None" }];
   var TOAST_UI_TYPES = [{ value: void 0, display: "None" }, { value: "info", display: "Info" }, { value: "success", display: "Success" }, { value: "warning", display: "Warning" }, { value: "error", display: "Error" }];
   var TOAST_UI_DRAG_OPTIONS = [{ value: true, display: "On" }, { value: "mouse", display: "Mouse" }, { value: "touch", display: "Touch" }, { value: "pen", display: "Pen" }, { value: false, display: "Off" }];
   var TOAST_UI_DRAG_DIRECTIONS = [{ value: "x", display: "Horizontal" }, { value: "y", display: "Vertical" }, { value: "xy", display: "Horizontal and Vertical" }, { value: "x|y", display: "Horizontal or Vertical" }, { value: "x||y", display: "Horizontal or Vertical (Locked)" }, { value: "x+", display: "Right" }, { value: "x-", display: "Left" }, { value: "y+", display: "Down" }, { value: "y-", display: "Up" }, { value: "xy+", display: "Right and Down" }, { value: "xy-", display: "Left and Up" }, { value: "x|y+", display: "Right or Down" }, { value: "x|y-", display: "Left or Up" }, { value: "x||y+", display: "Right or Down (Locked)" }, { value: "x||y-", display: "Left or Up (Locked)" }];
@@ -554,6 +558,7 @@
     t007.TOAST_DEFAULT_OPTIONS.animation ??= true;
     t007.TOAST_DEFAULT_OPTIONS.newestOnTop ??= false;
     t007.TOAST_DEFAULT_OPTIONS.limit ??= 100;
+    t007.TOAST_DEFAULT_OPTIONS.compact ??= false;
     t007.TOAST_DURATIONS.success ??= 2500, t007.TOAST_DURATIONS.error ??= 4500, t007.TOAST_DURATIONS.warning ??= 3500, t007.TOAST_DURATIONS.info ??= 4e3;
     t007.TOAST_VIBRATIONS.success ??= [100, 50, 100], t007.TOAST_VIBRATIONS.warning ??= [300, 100, 300], t007.TOAST_VIBRATIONS.error ??= [500, 200, 500], t007.TOAST_VIBRATIONS.info ??= [200];
     t007.TOAST_ICONS.success ??= `<svg class="no-css-fill" width="24" height="24" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#27ae60"/><path fill="none" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M7 12l3 3l6-6"/></svg>`;

package/dist/index.js

@@ -4,7 +4,6 @@ var T007_Toast = class {
   #constructed = false;
   // to minimize updates
   #autoCloseInterval;
-  #progressInterval;
   #timeVisible = 0;
   #isPaused = false;
   #shouldUnPause;
@@ -114,7 +113,7 @@ var T007_Toast = class {
   }
   set closeButton(value) {
     const btn = this.toastElement.querySelector(".t007-toast-cancel-button");
-    if (value) this.toastElement.append(btn || createEl("button", { title: "Close", ariaLabel: "Close notification", className: "t007-toast-cancel-button", innerHTML: "×", onclick: this.remove }));
+    if (value) this.toastElement.append(btn || createEl("button", { title: "Close", ariaLabel: "Close notification", className: "t007-toast-cancel-button", innerHTML: "×", onclick: () => this.remove(void 0, false, true) }));
     else btn?.remove();
   }
   get animation() {
@@ -134,6 +133,7 @@ var T007_Toast = class {
   set autoClose(value) {
     cancelAnimationFrame(this.#autoCloseInterval);
     this.#timeVisible = 0;
+    this.toastElement.classList.toggle("progress", !this.opts.hideProgressBar && isNum(this.autoClose));
     this.nprogress = void 0;
     let lastTime;
     const loop = (time) => {
@@ -148,6 +148,7 @@ var T007_Toast = class {
       if (!this.#isPaused) {
         this.#timeVisible += time - lastTime;
         this.onTimeUpdate?.(this.#timeVisible);
+        if (!this.opts.hideProgressBar) this.nprogress = void 0;
         if (isNum(this.autoClose) && this.#timeVisible >= this.autoClose) return this.remove("smooth", true);
       }
       lastTime = time;
@@ -159,21 +160,15 @@ var T007_Toast = class {
     if (!this.#constructed) return;
     const currContainer = this.toastElement.parentElement, container = this.rootElement.querySelector(`:scope > .t007-toast-container[data-position="${value}"]`) || this._createContainer(value);
     !container.contains(this.toastElement) && container[this.opts.newestOnTop ? "prepend" : "append"](this.toastElement);
-    this.toastElement.classList.toggle("t007-toast-scoped", this.scoped);
+    this.toastElement.classList.toggle("t007-toast-scoped", this.scoped), this.animation = true;
     if (!(currContainer == null || currContainer.hasChildNodes())) currContainer.remove();
   }
   set closeOnClick(value) {
-    this.toastElement.onclick = value ? () => this.remove() : null;
+    this.toastElement.onclick = value ? () => this.remove(void 0, false, true) : null;
   }
   set hideProgressBar(value) {
-    this.toastElement.classList.toggle("progress", !value);
-    this.nprogress = void 0;
-    cancelAnimationFrame(this.#progressInterval);
-    const loop = () => {
-      if (isNum(this.autoClose) && !this.#isPaused) this.nprogress = void 0;
-      this.#progressInterval = requestAnimationFrame(loop);
-    };
-    if (!value) this.#progressInterval = requestAnimationFrame(loop);
+    this.toastElement.classList.toggle("progress", !value && isNum(this.autoClose));
+    if (!value && isNum(this.autoClose)) this.nprogress = void 0;
   }
   get nprogress() {
     return Number(this.toastElement.style.getProperty("--progress"));
@@ -204,9 +199,10 @@ var T007_Toast = class {
     value && navigator?.vibrate?.(this.vibrate);
   }
   set limit(value) {
-    const toastsInContainer = [...this.toastElement?.parentElement?.children || []];
-    if (!toastsInContainer.length) return;
-    for (let i = 0; i < toastsInContainer.length - value; i++) [...t007.toasts.values()].find((t) => t.toastElement === (this.opts.newestOnTop ? toastsInContainer[toastsInContainer.length - 1 - i] : toastsInContainer[i]))?.abort();
+    if (!value) return;
+    const els = [...this.toastElement?.parentElement?.children || []];
+    if (!els.length) return;
+    for (let i = 0; i < els.length - value; i++) [...t007.toasts.values()].find((t) => t.toastElement === (this.opts.newestOnTop ? els[els.length - 1 - i] : els[i]))?.abort();
   }
   set newestOnTop(value) {
     this.toastElement?.parentElement?.[value ? "prepend" : "append"](this.toastElement);
@@ -216,6 +212,9 @@ var T007_Toast = class {
     this.toastElement.onpointerdown = value ? this._handleToastPointerStart : null;
     this.toastElement.onpointerup = value ? this._handleToastPointerUp : null;
   }
+  set compact(value) {
+    this.toastElement.classList.toggle("t007-toast-compact", !!value);
+  }
   _handleToastPointerStart(e) {
     if (isStr(this._ptrType) && e.pointerType !== this._ptrType) return;
     if (e.touches?.length > 1) return;
@@ -249,22 +248,22 @@ var T007_Toast = class {
   _handleToastPointerUp(e) {
     if (isStr(this._ptrType) && e.pointerType !== this._ptrType) return;
     cancelAnimationFrame(this._ptrRAF);
-    if (Math.abs(this._ptrDeltaX) > this.toastElement.offsetWidth * ((this.opts.dragToClosePercent.x ?? this.opts.dragToClosePercent) / 100) || Math.abs(this._ptrDeltaY) > this.toastElement.offsetHeight * ((this.opts.dragToClosePercent.y ?? this.opts.dragToClosePercent) / 100)) return this.abort();
+    if (Math.abs(this._ptrDeltaX) > this.toastElement.offsetWidth * ((this.opts.dragToClosePercent.x ?? this.opts.dragToClosePercent) / 100) || Math.abs(this._ptrDeltaY) > this.toastElement.offsetHeight * ((this.opts.dragToClosePercent.y ?? this.opts.dragToClosePercent) / 100)) return this.remove("instant", false, true);
     this.#isPaused = this._ptrTicker = this._ptrDirSet = this._ptrDir = false;
     this.toastElement.removeEventListener("pointermove", this._handleToastPointerMove, { passive: false });
     for (const prop of ["transition", "transform", "opacity"]) this.toastElement.style.removeProperty(prop);
   }
-  remove(manner = "smooth", timeElapsed = false) {
+  remove(manner = "smooth", timeElapsed = false, userInitiated = false) {
     if (!this.opts.isLoading) t007.toasts.delete(this.opts.id);
     for (const tid of this.queue) clearTimeout(tid);
     document.removeEventListener("visibilitychange", this.#visiblityChange);
-    cancelAnimationFrame(this.#autoCloseInterval), cancelAnimationFrame(this.#progressInterval);
+    cancelAnimationFrame(this.#autoCloseInterval);
     if (this.inactive || manner === "instant" || !this.animation) this._cleanUpToast();
     else if (this.toastElement) this.toastElement.onanimationend = this._cleanUpToast;
     this.toastElement?.classList.remove("t007-toast-show");
-    this.onClose?.(timeElapsed);
+    this.onClose?.(timeElapsed, userInitiated);
   }
-  abort = () => this.remove("instant", false);
+  abort = () => this.remove("instant");
   _createContainer(position) {
     const container = createEl("div", { className: "t007-toast-container" }, { position });
     container.style.setProperty("--t007-toast-container-position", !this.scoped ? "fixed" : "absolute");
@@ -311,19 +310,19 @@ var toasting = {
     const pendingId = base.loading(pendingCfg.render || "Promise pending...", { ...pendingCfg });
     promise.then(
       (response) => {
-        const successConfig = NFC(success || "Promise resolved", "success");
-        const { render, bodyHTML } = successConfig;
-        if (isFunc(render)) successConfig.render = (txt = response) => render(txt);
-        if (isFunc(bodyHTML)) successConfig.bodyHTML = (txt = response) => bodyHTML(txt);
-        base.success(pendingId, successConfig);
+        const config = NFC(success || "Promise resolved", "success");
+        const { render, bodyHTML } = config;
+        if (isFunc(render)) config.render = (txt = response) => render(txt);
+        if (isFunc(bodyHTML)) config.bodyHTML = (txt = response) => bodyHTML(txt);
+        base.success(pendingId, config);
         return response;
       },
       (err) => {
-        const errorConfig = NFC(error || "Promise rejected", "error");
-        const { render, bodyHTML } = errorConfig;
-        if (isFunc(render)) errorConfig.render = (txt = err) => render(txt);
-        if (isFunc(bodyHTML)) errorConfig.bodyHTML = (txt = err) => bodyHTML(txt);
-        base.error(pendingId, errorConfig);
+        const config = NFC(error || "Promise rejected", "error");
+        const { render, bodyHTML } = config;
+        if (isFunc(render)) config.render = (txt = err) => render(txt);
+        if (isFunc(bodyHTML)) config.bodyHTML = (txt = err) => bodyHTML(txt);
+        base.error(pendingId, config);
         return Promise.reject(err);
       }
     );
@@ -332,6 +331,9 @@ var toasting = {
   dismiss(base, id, manner, timeElapsed) {
     return !isDef(id) ? base.dismissAll() : t007.toasts.get(id)?.remove(manner, timeElapsed);
   },
+  anyActive(base, groupId) {
+    return [...t007.toasts.values()].some((toast2) => (!isDef(groupId) ? true : toast2.opts.groupId === groupId) && base.isActive(toast2.opts.id, toast2));
+  },
   dismissAll(base, groupId) {
     for (const toast2 of t007.toasts.values()) (!isDef(groupId) ? true : toast2.opts.groupId === groupId) && toast2.remove();
   },
@@ -342,14 +344,16 @@ var toasting = {
     return t007.toasts.values().filter((toast2) => !isDef(groupId) ? true : toast2.opts.groupId === groupId);
   }
 };
-var toaster = (defOptions = {}, groupId = "t007_toast_") => {
-  const getDefaults = () => ({ ...t007.TOAST_DEFAULT_OPTIONS, ...defOptions }), base = (renderOrId, options = {}, mayBeId = renderOrId?.startsWith?.(groupId), render = mayBeId ? options.render : renderOrId, id = mayBeId ? renderOrId : options.id, toast2 = t007.toasts.get(id)) => toast2 ? toasting.update(base, id, { ...options, render }, toast2) : new T007_Toast({ ...getDefaults(), ...options, id, render, groupId }).opts.id;
+var toaster = (defaults = {}, groupId = "t007_toast_") => {
+  const getDefaults = () => ({ ...t007.TOAST_DEFAULT_OPTIONS, ...base.defaults, groupId }), base = (renderOrId, options = {}, mayBeId = renderOrId?.startsWith?.(groupId), render = mayBeId ? options.render : renderOrId, id = mayBeId ? renderOrId : options.id, toast2 = t007.toasts.get(id)) => toast2 ? toasting.update(base, id, { ...options, render }, toast2) : new T007_Toast({ ...getDefaults(), ...options, id, render }).opts.id;
+  base.defaults = defaults;
   base.isActive = (id) => toasting.isActive(base, id);
   base.update = (id, options, _toast) => toasting.update(base, id, options, _toast);
   for (const action of ["info", "success", "warn", "error"]) base[action] = (renderOrId, options) => toasting.message(base, getDefaults, action, renderOrId, options);
   base.loading = (renderOrId, options) => toasting.loading(base, renderOrId, options);
   base.promise = (promise, config) => toasting.promise(base, promise, config);
   base.dismiss = (id, manner, timeElapsed) => toasting.dismiss(base, id, manner, timeElapsed);
+  base.anyActive = (groupId2) => toasting.anyActive(base, groupId2);
   base.dismissAll = (groupId2) => toasting.dismissAll(base, groupId2);
   base.doForAll = (action, options, groupId2) => toasting.doForAll(base, action, options, groupId2);
   base.getAll = (groupId2) => toasting.getAll(base, groupId2);
@@ -358,7 +362,7 @@ var toaster = (defOptions = {}, groupId = "t007_toast_") => {
 var toast = toaster();
 var index_default = toast;
 var TOAST_UI_POSITIONS = [{ value: "top-left", display: "Top Left" }, { value: "top-center", display: "Top Center" }, { value: "top-right", display: "Top Right" }, { value: "center-left", display: "Center Left" }, { value: "center-center", display: "Center Center" }, { value: "center-right", display: "Center Right" }, { value: "bottom-left", display: "Bottom Left" }, { value: "bottom-center", display: "Bottom Center" }, { value: "bottom-right", display: "Bottom Right" }];
-var TOAST_UI_ANIMATIONS = [{ value: "fade", display: "Fade" }, { value: "zoom", display: "Zoom" }, { value: "slide", display: "Slide" }, { value: "slide-left", display: "Slide Left" }, { value: "slide-right", display: "Slide Right" }, { value: "slide-up", display: "Slide Up" }, { value: "slide-down", display: "Slide Down" }];
+var TOAST_UI_ANIMATIONS = [{ value: "fade", display: "Fade" }, { value: "zoom", display: "Zoom" }, { value: "slide", display: "Slide" }, { value: "slide-left", display: "Slide Left" }, { value: "slide-right", display: "Slide Right" }, { value: "slide-up", display: "Slide Up" }, { value: "slide-down", display: "Slide Down" }, { value: false, display: "None" }];
 var TOAST_UI_TYPES = [{ value: void 0, display: "None" }, { value: "info", display: "Info" }, { value: "success", display: "Success" }, { value: "warning", display: "Warning" }, { value: "error", display: "Error" }];
 var TOAST_UI_DRAG_OPTIONS = [{ value: true, display: "On" }, { value: "mouse", display: "Mouse" }, { value: "touch", display: "Touch" }, { value: "pen", display: "Pen" }, { value: false, display: "Off" }];
 var TOAST_UI_DRAG_DIRECTIONS = [{ value: "x", display: "Horizontal" }, { value: "y", display: "Vertical" }, { value: "xy", display: "Horizontal and Vertical" }, { value: "x|y", display: "Horizontal or Vertical" }, { value: "x||y", display: "Horizontal or Vertical (Locked)" }, { value: "x+", display: "Right" }, { value: "x-", display: "Left" }, { value: "y+", display: "Down" }, { value: "y-", display: "Up" }, { value: "xy+", display: "Right and Down" }, { value: "xy-", display: "Left and Up" }, { value: "x|y+", display: "Right or Down" }, { value: "x|y-", display: "Left or Up" }, { value: "x||y+", display: "Right or Down (Locked)" }, { value: "x||y-", display: "Left or Up (Locked)" }];
@@ -386,6 +390,7 @@ if ("undefined" !== typeof window) {
   t007.TOAST_DEFAULT_OPTIONS.animation ??= true;
   t007.TOAST_DEFAULT_OPTIONS.newestOnTop ??= false;
   t007.TOAST_DEFAULT_OPTIONS.limit ??= 100;
+  t007.TOAST_DEFAULT_OPTIONS.compact ??= false;
   t007.TOAST_DURATIONS.success ??= 2500, t007.TOAST_DURATIONS.error ??= 4500, t007.TOAST_DURATIONS.warning ??= 3500, t007.TOAST_DURATIONS.info ??= 4e3;
   t007.TOAST_VIBRATIONS.success ??= [100, 50, 100], t007.TOAST_VIBRATIONS.warning ??= [300, 100, 300], t007.TOAST_VIBRATIONS.error ??= [500, 200, 500], t007.TOAST_VIBRATIONS.info ??= [200];
   t007.TOAST_ICONS.success ??= `<svg class="no-css-fill" width="24" height="24" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#27ae60"/><path fill="none" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M7 12l3 3l6-6"/></svg>`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@t007/toast",
-  "version": "0.0.38",
+  "version": "0.0.39",
   "description": "A lightweight, pure JS toast system.",
   "author": "Oketade Oluwatobiloba <tobioketade007@gmail.com>",
   "license": "MIT",
@@ -55,7 +55,7 @@
     "promise"
   ],
   "dependencies": {
-    "@t007/utils": "^0.0.39"
+    "@t007/utils": "^0.0.40"
   },
   "devDependencies": {
     "esbuild-sass-plugin": "^3.7.0"