@tsirosgeorge/toastnotification 5.3.2 → 5.4.0

package/Readme.md

@@ -8,7 +8,7 @@ A lightweight, customizable, and dependency-free toast notification system writt
 
 ## 📦 Include package via cdn
 ```html
-<script src="https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.2/toast.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.4.0/toast.min.js"></script>
 ```
 
 ## 📦 Include package via npm
@@ -41,8 +41,12 @@ toast('Data saved successfully!', {
 ```javascript
 toast.success('Saved!');
 toast.error('Failed!');
+toast.warning('Careful!');
+toast.info('Heads up.');
 ```
 
+Each helper returns the toast element, so you can hand it to `toast.update()` later.
+
 ### ⚠️ Confirm (SweetAlert-like)
 - Promise API
 ```javascript
@@ -75,13 +79,19 @@ const name = await toast.confirm('Enter your name:', {
   confirmText: 'Submit',
   cancelText: 'Cancel',
 });
-if (name) {
-  console.log('Hello', name);
+if (name !== null) {
+  console.log('Hello', name); // may be '' if they submitted an empty field
 } else {
   console.log('Cancelled');
 }
 ```
 
+> **Resolution contract.** Without `input`, `toast.confirm()` resolves `true` on confirm and
+> `false` on cancel. With `input`, it resolves the field's **string** value on confirm — which
+> may be `''` — and `null` on cancel. Check against `null`, not truthiness, or an empty
+> submission reads as a cancel. Cancelling, clicking the backdrop and the `(×)` button all
+> resolve the promise.
+
 - Callback API
 ```javascript
 toast('Are you sure?', {
@@ -155,4 +165,4 @@ This software is provided "as is", without warranty of any kind. Use at your own
 
 ---
 
-**Note:** This package is marked as `UNLICENSED` in `package.json` to reflect these restrictions.
+**Note:** See the [LICENSE](LICENSE) file included in this package for full terms and conditions.

package/package.json

@@ -1,32 +1,40 @@
 {
   "name": "@tsirosgeorge/toastnotification",
-  "version": "5.3.2",
+  "version": "5.4.0",
   "description": "a toast notification plugin",
   "main": "toast.min.js",
   "module": "toast.module.js",
   "exports": {
     ".": {
+      "types": "./toast.d.ts",
       "import": "./toast.module.js",
       "require": "./toast.min.js"
-    }
+    },
+    "./assets/css/toast.css": "./assets/css/toast.css",
+    "./assets/css/toast.min.css": "./assets/css/toast.min.css",
+    "./package.json": "./package.json"
   },
   "scripts": {
-      "test": "echo \"Error: no test specified\" && exit 1",
-      "build:css": "cleancss -o assets/css/toast.min.css assets/css/toast.css",
-      "build:js": "terser toast.js --compress --mangle --output toast.min.js",
-      "build": "npm run build:css && npm run build:js",
-      "prepublishOnly": "npm run build",
-      "release": "npm version && git push origin main --follow-tags && npm publish --access public"
+    "test": "tsc --noEmit --strict --skipLibCheck toast.d.ts",
+    "sync:version": "node scripts/sync-version.mjs",
+    "build:module": "node scripts/build-module.mjs",
+    "build:css": "cleancss -o assets/css/toast.min.css assets/css/toast.css",
+    "build:js": "terser toast.js --compress --mangle --output toast.min.js",
+    "build": "npm run sync:version && npm run build:module && npm run build:css && npm run build:js",
+    "prepublishOnly": "npm run build",
+    "release": "npm version ${V:-patch} && npm publish --access public && git push origin main --follow-tags"
   },
   "files": [
     "toast.js",
     "toast.min.js",
     "toast.module.js",
+    "toast.d.ts",
     "assets/css/toast.css",
     "assets/css/toast.min.css",
     "assets/img/",
+    "!assets/img/old/",
     "LICENSE",
-    "README.md"
+    "Readme.md"
   ],
   "repository": {
     "type": "git",
@@ -49,6 +57,14 @@
   "homepage": "https://github.com/tsirosgeorge/toast-notification#readme",
   "devDependencies": {
     "clean-css-cli": "^5.6.3",
-    "terser": "^5.40.0"
-  }
-}
+    "terser": "^5.40.0",
+    "typescript": "^5.9.3"
+  },
+  "types": "toast.d.ts",
+  "sideEffects": [
+    "./toast.js",
+    "./toast.min.js",
+    "./toast.module.js",
+    "*.css"
+  ]
+}

package/toast.d.ts

@@ -0,0 +1,89 @@
+export type ToastType = 'info' | 'success' | 'warning' | 'error';
+
+export type ToastPosition =
+  | 'top-left' | 'top-right' | 'top-center'
+  | 'bottom-left' | 'bottom-right' | 'bottom-center';
+
+export type ToastAnimation =
+  | 'slide-top' | 'slide-bottom' | 'slide-left' | 'slide-right'
+  | 'zoom-in' | 'zoom-out' | 'flip';
+
+export type ToastInput = 'text' | 'email' | 'password' | 'number' | 'textarea' | false;
+
+/** Value handed to a confirm dialog's callbacks and promise. */
+export type ConfirmResult = boolean | string | null;
+
+export interface ToastElement extends HTMLDivElement {
+  /** Present in confirm mode: resolves when the user confirms, cancels or dismisses. */
+  result?: Promise<ConfirmResult>;
+}
+
+export interface ToastOptions {
+  position?: ToastPosition;
+  animation?: ToastAnimation;
+  type?: ToastType;
+  /** Auto-dismiss delay in ms. `0` keeps the toast until it is closed. */
+  duration?: number;
+  /** Emoji or text used instead of the bundled animated icon. */
+  icon?: string | null;
+  showLoader?: boolean;
+  /** `'confirm'` (alias `'swal'`) renders a modal dialog instead of a toast. */
+  mode?: 'alert' | 'confirm' | 'swal';
+  dismissOnClick?: boolean;
+  onClick?: (el: ToastElement) => void;
+  onShow?: (el: ToastElement) => void;
+  onDismiss?: (el: ToastElement) => void;
+}
+
+export interface ConfirmOptions extends ToastOptions {
+  title?: string | null;
+  confirmText?: string;
+  cancelText?: string;
+  input?: ToastInput;
+  inputPlaceholder?: string;
+  inputValue?: string;
+  confirmButtonBg?: string | null;
+  confirmButtonColor?: string | null;
+  cancelButtonBg?: string | null;
+  cancelButtonColor?: string | null;
+  useOverlay?: boolean;
+  closeOnOverlayClick?: boolean;
+  showClose?: boolean;
+  /** Receives the input's value when `input` is set, otherwise `true`. */
+  onConfirm?: (value: string | true, el: ToastElement) => void;
+  onCancel?: (el: ToastElement) => void;
+  onResult?: (result: ConfirmResult, el: ToastElement) => void;
+}
+
+export interface LoadingHandle {
+  update(message: string, options?: ToastOptions): void;
+  close(): void;
+}
+
+export interface Toast {
+  (message: string, options?: ToastOptions | ConfirmOptions): ToastElement;
+  success(message: string, options?: ToastOptions): ToastElement;
+  error(message: string, options?: ToastOptions): ToastElement;
+  warning(message: string, options?: ToastOptions): ToastElement;
+  info(message: string, options?: ToastOptions): ToastElement;
+  update(el: ToastElement, message: string, options?: ToastOptions): void;
+  loading(message: string, options?: ToastOptions): LoadingHandle;
+  /**
+   * Without `input`: resolves `true` on confirm, `false` on cancel/dismiss.
+   * With `input`: resolves the input's string value on confirm (possibly `''`),
+   * and `null` on cancel/dismiss — so an empty submission is not read as a cancel.
+   */
+  confirm(message: string, options?: ConfirmOptions): Promise<ConfirmResult>;
+}
+
+declare const toast: Toast;
+export default toast;
+export { toast };
+
+declare global {
+  interface Window {
+    toast: Toast;
+    /** Set before loading the script to skip the CDN stylesheet injection. */
+    TS_TOAST_NO_CSS?: boolean;
+  }
+}

package/toast.js

@@ -1,10 +1,27 @@
 "use strict";
 
-// Dynamically load the external CSS file
-const link = document.createElement("link");
-link.rel = "stylesheet";
-link.href = "https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/css/toast.min.css";
-document.head.appendChild(link);
+// Single source of truth for the CDN this build points at.
+// `npm run sync:version` rewrites it from package.json, so it can never go stale.
+const TS_TOAST_VERSION = "5.4.0";
+// Point this at your own copy of assets/ to self-host the CSS and icons
+// (useful offline, behind a strict CSP, or when you don't want a CDN dependency):
+//   window.TS_TOAST_ASSET_BASE = '/vendor/toastnotification';
+const TS_TOAST_CDN = (typeof window !== 'undefined' && window.TS_TOAST_ASSET_BASE)
+    ? String(window.TS_TOAST_ASSET_BASE).replace(/\/+$/, '')
+    : `https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@${TS_TOAST_VERSION}`;
+
+// Load the stylesheet from the CDN, unless the page opted out by importing it itself
+// (set window.TS_TOAST_NO_CSS = true before loading, or ship assets/css/toast.css yourself).
+(function loadStylesheet() {
+    const LINK_ID = 'ts-toast-stylesheet';
+    if (typeof window !== 'undefined' && window.TS_TOAST_NO_CSS) return;
+    if (document.getElementById(LINK_ID)) return;
+    const link = document.createElement("link");
+    link.id = LINK_ID;
+    link.rel = "stylesheet";
+    link.href = `${TS_TOAST_CDN}/assets/css/toast.min.css`;
+    document.head.appendChild(link);
+})();
 
         // Inject minimal styles for confirm actions and overlay (kept tiny to avoid breaking existing CSS)
     (function injectInlineStyles() {
@@ -147,23 +164,16 @@ const toast = function (message, options = {}) {
             iconElement.textContent = icon;
         } else {
             const img = document.createElement('img');
-            img.src = '';
+            img.alt = '';
+            img.setAttribute('aria-hidden', 'true');
             img.style.width = '30px';
             img.style.height = '30px';
             img.style.objectFit = 'contain';
 
-            const baseUrl = 'https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/';
-            const timestamp = new Date().getTime(); // 🔄 force refresh
-
-            if (type === 'success') {
-                img.src = `${baseUrl}success.gif?t=${timestamp}`;
-            } else if (type === 'error') {
-                img.src = `${baseUrl}error.gif?t=${timestamp}`;
-            } else if (type === 'info') {
-                img.src = `${baseUrl}info.gif?t=${timestamp}`;
-            } else if (type === 'warning') {
-                img.src = `${baseUrl}warning.gif?t=${timestamp}`;
-            }
+            // No cache-buster: these GIFs are immutable per version, so let the
+            // browser and the CDN actually cache them.
+            const iconFile = { success: 'success.gif', error: 'error.gif', info: 'info.gif', warning: 'warning.gif' }[type];
+            if (iconFile) img.src = `${TS_TOAST_CDN}/assets/img/${iconFile}`;
 
             iconElement.appendChild(img);
         }
@@ -210,6 +220,9 @@ const toast = function (message, options = {}) {
         // Actions (for confirm mode)
         let actionsContainer = null;
         let resultResolver = null;
+        // Assigned in confirm mode; the overlay and (x) handlers below call it so that
+        // *every* way of dismissing the dialog settles the promise and the callbacks.
+        let resolveAndClose = null;
         if (isConfirm) {
             actionsContainer = document.createElement('div');
             actionsContainer.className = 'ts-toast-actions';
@@ -235,11 +248,19 @@ const toast = function (message, options = {}) {
             // Create a Promise that resolves on user choice; expose via property
             toastElement.result = new Promise((resolve) => { resultResolver = resolve; });
 
-            const resolveAndClose = (value) => {
-                const result = (value && inputElement !== null) ? inputElement.value : value;
+            let settled = false;
+            resolveAndClose = (confirmed) => {
+                if (settled) return; // a button click and a backdrop click can race
+                settled = true;
+                // With an input, confirming always yields a string (possibly '') and
+                // cancelling yields null, so an empty submission stays distinguishable
+                // from a cancel. Without an input the contract is still true/false.
+                const result = confirmed
+                    ? (inputElement ? inputElement.value : true)
+                    : (inputElement ? null : false);
                 if (resultResolver) resultResolver(result);
-                if (value && typeof onConfirm === 'function') onConfirm((inputElement !== null) ? inputElement.value : value, toastElement);
-                if (!value && typeof onCancel === 'function') onCancel(toastElement);
+                if (confirmed && typeof onConfirm === 'function') onConfirm(result, toastElement);
+                if (!confirmed && typeof onCancel === 'function') onCancel(toastElement);
                 if (typeof onResult === 'function') onResult(result, toastElement);
                 // Use the same slide+fade removal as alerts
                 removeWithAnimation(toastElement, () => {
@@ -265,7 +286,9 @@ const toast = function (message, options = {}) {
         let overlay = null;
         if (isConfirm && useOverlay) {
             overlay = document.createElement('div');
-            overlay.className = `ts-toast-overlay ${position}`;
+            // A modal centres by default. The `position` default of 'top-right' is meant
+            // for toasts; applying it here parked the dialog in a corner of the backdrop.
+            overlay.className = 'ts-toast-overlay' + (options.position ? ` ${position}` : '');
             document.body.appendChild(overlay);
             overlay.appendChild(toastElement);
             if (showClose) {
@@ -275,28 +298,17 @@ const toast = function (message, options = {}) {
                 closeBtn.innerHTML = '×';
                 closeBtn.addEventListener('click', (e) => {
                     e.stopPropagation();
-                    removeWithAnimation(toastElement, () => {
-                        if (onDismiss && typeof onDismiss === 'function') onDismiss(toastElement);
-                        if (overlay && overlay.parentNode) overlay.parentNode.removeChild(overlay);
-                    });
+                    // Dismissing via (x) is a cancel, so it has to settle like one.
+                    resolveAndClose(false);
                 });
                 toastElement.appendChild(closeBtn);
             }
             if (closeOnOverlayClick) {
                 overlay.addEventListener('click', (e) => {
-                    if (e.target === overlay) {
-                        // Overlay background click -> cancel
-                        if (toastElement.result) {
-                            // let the confirm logic close and cleanup
-                            if (typeof resultResolver === 'function') {
-                                resultResolver(false);
-                            }
-                        }
-                        removeWithAnimation(toastElement, () => {
-                            if (onDismiss && typeof onDismiss === 'function') onDismiss(toastElement);
-                            if (overlay && overlay.parentNode) overlay.parentNode.removeChild(overlay);
-                        });
-                    }
+                    // Backdrop click is a cancel: settle the promise and onCancel/onResult,
+                    // then close. Previously this resolved only the internal el.result,
+                    // so `await toast.confirm(...)` hung forever.
+                    if (e.target === overlay) resolveAndClose(false);
                 });
             }
         } else {
@@ -384,12 +396,21 @@ const toast = function (message, options = {}) {
         return toastElement;
     };
 
+    // Shorthands return the toast element so it can be passed to toast.update().
     toast.success = function (message, options) {
-        toast(message, { ...options, type: 'success' });
+        return toast(message, { ...options, type: 'success' });
     };
 
     toast.error = function (message, options) {
-        toast(message, { ...options, type: 'error' });
+        return toast(message, { ...options, type: 'error' });
+    };
+
+    toast.warning = function (message, options) {
+        return toast(message, { ...options, type: 'warning' });
+    };
+
+    toast.info = function (message, options) {
+        return toast(message, { ...options, type: 'info' });
     };
 
     // Update toast function to handle removal with animation
@@ -399,7 +420,6 @@ const toast = function (message, options = {}) {
             icon = null,
             showLoader = false,
             duration = 3000, // Default duration (in ms)
-            position = 'top-right', // Default position,
             onClick = null,      // Custom onClick event listener
             onShow = null,       // Custom onShow event listener
             onDismiss = null     // Custom onDismiss event listener
@@ -410,10 +430,13 @@ const toast = function (message, options = {}) {
         const oldIcon = toastElement.querySelector('.ts-toast-icon');
         if (oldLoader) oldLoader.remove();
 
-        // Update toast class and message
+        // Update toast class and message. Swap only the type modifier: overwriting
+        // className dropped ts-toast-show (so the toast faded out), dropped
+        // ts-toast-confirm (so confirm dialogs lost their layout), and leaked the
+        // position onto the toast instead of the container.
         if (type) {
-            // keep ts- prefix consistent
-            toastElement.className = `ts-toast ts-toast-${type} show ${position}`;
+            ['success', 'error', 'info', 'warning'].forEach((t) => toastElement.classList.remove(`ts-toast-${t}`));
+            toastElement.classList.add('ts-toast', `ts-toast-${type}`, 'ts-toast-show');
         }
         const toastBody = toastElement.querySelector('.ts-toast-body');
         if (toastBody) {
@@ -433,25 +456,21 @@ const toast = function (message, options = {}) {
             iconElement.textContent = icon;
         } else {
             const img = document.createElement('img');
+            img.alt = '';
+            img.setAttribute('aria-hidden', 'true');
             img.style.width = '30px';
             img.style.height = '30px';
             img.style.objectFit = 'contain';
 
-            if (type === 'success') {
-                img.src = 'https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/success.gif';
-            } else if (type === 'error') {
-                img.src = 'https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/error.gif';
-            } else if (type === 'info') {
-                img.src = 'https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/info.gif';
-            } else if (type === 'warning') {
-                img.src = 'https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/warning.gif';
-            }
+            const iconFile = { success: 'success.gif', error: 'error.gif', info: 'info.gif', warning: 'warning.gif' }[type];
+            if (iconFile) img.src = `${TS_TOAST_CDN}/assets/img/${iconFile}`;
 
             iconElement.appendChild(img);
         }
 
-        // Append the new icon immediately
-        toastElement.appendChild(iconElement);
+        // Append the new icon immediately (inside the content row for confirm dialogs)
+        const contentRow = toastElement.querySelector('.ts-toast-content');
+        (contentRow || toastElement).appendChild(iconElement);
 
         // Handle loader if requested
         if (showLoader) {
@@ -569,7 +588,9 @@ if (typeof window !== 'undefined') {
     window.toast = toast;
 }
 
+/* build:cjs-start (stripped when generating toast.module.js) */
 // CommonJS export for Node/bundlers (safe no-op in browsers)
 if (typeof module !== 'undefined' && module.exports) {
     module.exports = toast;
-}
+}
+/* build:cjs-end */

package/toast.min.js

@@ -1 +1 @@
-"use strict";const link=document.createElement("link");link.rel="stylesheet",link.href="https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/css/toast.min.css",document.head.appendChild(link),function(){const t="ts-toast-inline-extras";if(document.getElementById(t))return;const e=document.createElement("style");e.id=t,e.textContent="\n            /* Ensure center positions exist even if external CSS lacks them */\n            .ts-toast-container.top-center { top: 1rem; left: 50%; transform: translateX(-50%); align-items: center; }\n            .ts-toast-container.bottom-center { bottom: 1rem; left: 50%; transform: translateX(-50%); align-items: center; }\n            .ts-toast-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 2147483646; }\n            .ts-toast.ts-toast-confirm { max-width: min(92vw, 440px); width: max(320px, 60%); flex-direction: column; gap: 12px; padding: 16px 20px; background: var(--toast-bg, #fff); color: var(--toast-color, #000); border: 1px solid var(--toast-border, #e5e7eb); border-radius: 12px; box-shadow: var(--toast-shadow, 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)); text-align: center; }\n            .ts-toast.ts-toast-confirm .ts-toast-content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }\n            .ts-toast-actions { display: flex; gap: 10px; justify-content: center; margin-top: 12px; }\n            .ts-toast-btn { appearance: none; border: 0; padding: 8px 12px; border-radius: 8px; font-weight: 600; cursor: pointer; }\n            .ts-toast-btn.cancel { background: #e9ecef; color: #1f2937; }\n            .ts-toast-btn.confirm { background: #3b82f6; color: #fff; }\n            .ts-toast.ts-toast-error .ts-toast-btn.confirm,\n            .ts-toast.ts-toast-warning .ts-toast-btn.confirm { background: #ef4444; color: #fff; }\n            .ts-toast.ts-toast-confirm .ts-toast-title { font-weight: 700; font-size: 1.05rem; margin-top: 4px; }\n            .ts-toast.ts-toast-confirm .ts-toast-close { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; border-radius: 999px; border: 0; background: transparent; color: #6b7280; font-size: 20px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }\n            .ts-toast.ts-toast-confirm .ts-toast-close:hover { background: rgba(0,0,0,0.06); }\n            .ts-toast.ts-toast-confirm .ts-toast-icon { width: 64px; height: 64px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; }\n            .ts-toast.ts-toast-confirm .ts-toast-icon img { width: 36px; height: 36px; }\n            .ts-toast.ts-toast-confirm.ts-toast-success .ts-toast-icon { background: #dcfce7; }\n            .ts-toast.ts-toast-confirm.ts-toast-info .ts-toast-icon { background: #dbeafe; }\n            .ts-toast.ts-toast-confirm.ts-toast-warning .ts-toast-icon { background: #fef3c7; }\n            .ts-toast.ts-toast-confirm.ts-toast-error .ts-toast-icon { background: #fee2e2; }\n        ",document.head.appendChild(e)}();const toast=function(t,e={}){const{position:o="top-right",animation:s="slide-right",type:n="info",duration:a=3e3,icon:i=null,showLoader:l=!1,mode:r="alert",title:c=null,confirmText:d="Yes",cancelText:m="No",input:u=!1,inputPlaceholder:p="",inputValue:f="",confirmButtonBg:g=null,confirmButtonColor:h=null,cancelButtonBg:y=null,cancelButtonColor:x=null,onConfirm:v=null,onCancel:b=null,onResult:C=null,useOverlay:w=!0,closeOnOverlayClick:L=!0,showClose:E=!1,dismissOnClick:N=!0,onClick:k=null,onShow:T=null,onDismiss:$=null}=e,j="confirm"===r||"swal"===r,_="string"==typeof e.animation&&e.animation.trim()?{"slide-top":"ts-toast-slide-top","slide-bottom":"ts-toast-slide-bottom","slide-left":"ts-toast-slide-left","slide-right":"ts-toast-slide-right","zoom-in":"ts-toast-zoom-in","zoom-out":"ts-toast-zoom-out",flip:"ts-toast-flip"}[R=e.animation.trim()]||R:j?"ts-toast-zoom-in":o.startsWith("top")?"ts-toast-slide-top":o.startsWith("bottom")?"ts-toast-slide-bottom":o.endsWith("left")?"ts-toast-slide-left":"ts-toast-slide-right";var R;const B=(t,e)=>{const o=t.dataset&&t.dataset.anim?t.dataset.anim:t.style.animation||"";let s="";o.includes("ts-toast-slide-top")?s="translateY(-100%)":o.includes("ts-toast-slide-bottom")?s="translateY(100%)":(o.includes("ts-toast-slide-left")||o.includes("ts-toast-slide-right"))&&(s="translateX(100%)"),t.classList.add("ts-toast-slide-out"),t.classList.remove("ts-toast-show"),t.style.animation="",s&&(t.style.transform=s),t.style.opacity="0",setTimeout((()=>{t.classList.remove("ts-toast-slide-out"),t.parentNode&&t.parentNode.removeChild(t),"function"==typeof e&&e()}),500)},S=document.createElement("div");S.className=`ts-toast ts-toast-${n}${j?" ts-toast-confirm":""}`,S.dataset.anim=_,S.style.animation=`${_} 0.5s ease`,j||(S.style.flexDirection="row-reverse",S.style.justifyContent="flex-end");const z=document.createElement("span");if(z.className="ts-toast-icon",z.style.display="flex",i)z.textContent=i;else{const t=document.createElement("img");t.src="",t.style.width="30px",t.style.height="30px",t.style.objectFit="contain";const e="https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/",o=(new Date).getTime();"success"===n?t.src=`${e}success.gif?t=${o}`:"error"===n?t.src=`${e}error.gif?t=${o}`:"info"===n?t.src=`${e}info.gif?t=${o}`:"warning"===n&&(t.src=`${e}warning.gif?t=${o}`),z.appendChild(t)}const q=document.createElement("div");q.className="ts-toast-body",q.innerHTML=t;let P=null;if(j){if(P=document.createElement("div"),P.className="ts-toast-content",P.appendChild(z),c){const t=document.createElement("div");t.className="ts-toast-title",t.textContent=c,P.appendChild(t)}P.appendChild(q),S.appendChild(P)}else S.appendChild(q);let O=null;j&&u&&("textarea"===u?(O=document.createElement("textarea"),O.rows=3):(O=document.createElement("input"),O.type="text"===u||"email"===u||"password"===u||"number"===u?u:"text"),O.className="ts-toast-input",O.placeholder=p,O.value=f,S.appendChild(O));let X=null,D=null;if(j){X=document.createElement("div"),X.className="ts-toast-actions";const t=document.createElement("button");t.className="ts-toast-btn cancel",t.textContent=m;const e=document.createElement("button");e.className="ts-toast-btn confirm",e.textContent=d,y&&(t.style.background=y),x&&(t.style.color=x),g&&(e.style.background=g),h&&(e.style.color=h),X.appendChild(t),X.appendChild(e),S.appendChild(X),S.result=new Promise((t=>{D=t}));const o=t=>{const e=t&&null!==O?O.value:t;D&&D(e),t&&"function"==typeof v&&v(null!==O?O.value:t,S),t||"function"!=typeof b||b(S),"function"==typeof C&&C(e,S),B(S,(()=>{$&&"function"==typeof $&&$(S),F&&F.parentNode&&F.parentNode.removeChild(F)}))};t.addEventListener("click",(t=>{t.stopPropagation(),o(!1)})),e.addEventListener("click",(t=>{t.stopPropagation(),o(!0)}))}let M=null;l&&(M=document.createElement("div"),M.className="ts-toast-loader",S.appendChild(M));let F=null;if(j&&w){if(F=document.createElement("div"),F.className=`ts-toast-overlay ${o}`,document.body.appendChild(F),F.appendChild(S),E){const t=document.createElement("button");t.className="ts-toast-close",t.setAttribute("aria-label","Close"),t.innerHTML="×",t.addEventListener("click",(t=>{t.stopPropagation(),B(S,(()=>{$&&"function"==typeof $&&$(S),F&&F.parentNode&&F.parentNode.removeChild(F)}))})),S.appendChild(t)}L&&F.addEventListener("click",(t=>{t.target===F&&(S.result&&"function"==typeof D&&D(!1),B(S,(()=>{$&&"function"==typeof $&&$(S),F&&F.parentNode&&F.parentNode.removeChild(F)})))}))}else{let t=document.querySelector(`.ts-toast-container.${o}`);t||(t=document.createElement("div"),t.className=`ts-toast-container ${o}`,document.body.appendChild(t)),t.appendChild(S)}if(T&&"function"==typeof T&&T(S),setTimeout((()=>{S.classList.add("ts-toast-show")}),100),l&&M&&setTimeout((()=>{S._managedByLoading||(M.classList.add("done"),M.remove(),S.contains(z)||(j&&P?P.appendChild(z):S.appendChild(z)))}),2e3),l||j||S.contains(z)||S.appendChild(z),!j&&a>0){const t=setTimeout((()=>{B(S,(()=>{$&&"function"==typeof $&&$(S)}))}),a);S._autoRemove=t}if(!j&&N&&S.addEventListener("click",(()=>{S._autoRemove&&clearTimeout(S._autoRemove),B(S,(()=>{k&&"function"==typeof k&&k(S),$&&"function"==typeof $&&$(S)}))})),!j){let t=0,e=0;S.addEventListener("touchstart",(e=>{t=e.changedTouches[0].screenX})),S.addEventListener("touchend",(o=>{e=o.changedTouches[0].screenX,Math.abs(t-e)>50&&(S._autoRemove&&clearTimeout(S._autoRemove),B(S,(()=>{$&&"function"==typeof $&&$(S)})))}))}return S};toast.success=function(t,e){toast(t,{...e,type:"success"})},toast.error=function(t,e){toast(t,{...e,type:"error"})},toast.update=function(t,e,o={}){const{type:s=null,icon:n=null,showLoader:a=!1,duration:i=3e3,position:l="top-right",onClick:r=null,onShow:c=null,onDismiss:d=null}=o,m=t.querySelector(".ts-toast-loader"),u=t.querySelector(".ts-toast-icon");m&&m.remove(),s&&(t.className=`ts-toast ts-toast-${s} show ${l}`);const p=t.querySelector(".ts-toast-body");p&&(p.innerHTML=e),u&&u.remove();const f=document.createElement("span");if(f.className="ts-toast-icon",f.style.display="flex",n)f.textContent=n;else{const t=document.createElement("img");t.style.width="30px",t.style.height="30px",t.style.objectFit="contain","success"===s?t.src="https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/success.gif":"error"===s?t.src="https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/error.gif":"info"===s?t.src="https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/info.gif":"warning"===s&&(t.src="https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.3.0/assets/img/warning.gif"),f.appendChild(t)}if(t.appendChild(f),a){const e=document.createElement("div");e.className="ts-toast-loader",t.appendChild(e),setTimeout((()=>{e.classList.add("done")}),2e3)}t._autoRemove&&clearTimeout(t._autoRemove);const g=setTimeout((()=>{var e,o;o=()=>{d&&"function"==typeof d&&d(t)},(e=t).classList.add("ts-toast-slide-out"),e.classList.remove("ts-toast-show"),e.style.animation="",setTimeout((()=>{e.classList.remove("ts-toast-slide-out"),e.parentNode&&e.parentNode.removeChild(e),"function"==typeof o&&o()}),500)}),i);t._autoRemove=g},toast.loading=function(t,e={}){const o=toast(t,{...e,type:e.type||"info",duration:0,showLoader:!0,icon:null});requestAnimationFrame((()=>{o.classList.add("ts-toast-show")}));const s=o.querySelector(".ts-toast-loader");let n=o.querySelector(".ts-toast-icon");return n||(n=document.createElement("span"),n.className="ts-toast-icon",n.style.display="flex",o.appendChild(n)),o._managedByLoading=!0,s&&setTimeout((()=>{o._managedByLoading||s.classList.add("done")}),2e3),{update:(t,e={})=>{o._managedByLoading=!1,toast.update(o,t,{...e,showLoader:!1})},close:()=>{o._autoRemove&&clearTimeout(o._autoRemove),o.classList.add("ts-toast-slide-out"),o.classList.remove("ts-toast-show"),o.style.animation="",setTimeout((()=>{o.classList.remove("ts-toast-slide-out"),o.parentNode&&o.parentNode.removeChild(o)}),500)}}},toast.confirm=function(t,e={}){return new Promise((o=>{toast(t,{...e,mode:"confirm",duration:0,dismissOnClick:!1,onResult:t=>o(t)})}))},"undefined"!=typeof window&&(window.toast=toast),"undefined"!=typeof module&&module.exports&&(module.exports=toast);
+"use strict";const TS_TOAST_VERSION="5.4.0",TS_TOAST_CDN="undefined"!=typeof window&&window.TS_TOAST_ASSET_BASE?String(window.TS_TOAST_ASSET_BASE).replace(/\/+$/,""):"https://cdn.jsdelivr.net/npm/@tsirosgeorge/toastnotification@5.4.0";!function(){const t="ts-toast-stylesheet";if("undefined"!=typeof window&&window.TS_TOAST_NO_CSS)return;if(document.getElementById(t))return;const e=document.createElement("link");e.id=t,e.rel="stylesheet",e.href=`${TS_TOAST_CDN}/assets/css/toast.min.css`,document.head.appendChild(e)}(),function(){const t="ts-toast-inline-extras";if(document.getElementById(t))return;const e=document.createElement("style");e.id=t,e.textContent="\n            /* Ensure center positions exist even if external CSS lacks them */\n            .ts-toast-container.top-center { top: 1rem; left: 50%; transform: translateX(-50%); align-items: center; }\n            .ts-toast-container.bottom-center { bottom: 1rem; left: 50%; transform: translateX(-50%); align-items: center; }\n            .ts-toast-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 2147483646; }\n            .ts-toast.ts-toast-confirm { max-width: min(92vw, 440px); width: max(320px, 60%); flex-direction: column; gap: 12px; padding: 16px 20px; background: var(--toast-bg, #fff); color: var(--toast-color, #000); border: 1px solid var(--toast-border, #e5e7eb); border-radius: 12px; box-shadow: var(--toast-shadow, 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)); text-align: center; }\n            .ts-toast.ts-toast-confirm .ts-toast-content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }\n            .ts-toast-actions { display: flex; gap: 10px; justify-content: center; margin-top: 12px; }\n            .ts-toast-btn { appearance: none; border: 0; padding: 8px 12px; border-radius: 8px; font-weight: 600; cursor: pointer; }\n            .ts-toast-btn.cancel { background: #e9ecef; color: #1f2937; }\n            .ts-toast-btn.confirm { background: #3b82f6; color: #fff; }\n            .ts-toast.ts-toast-error .ts-toast-btn.confirm,\n            .ts-toast.ts-toast-warning .ts-toast-btn.confirm { background: #ef4444; color: #fff; }\n            .ts-toast.ts-toast-confirm .ts-toast-title { font-weight: 700; font-size: 1.05rem; margin-top: 4px; }\n            .ts-toast.ts-toast-confirm .ts-toast-close { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; border-radius: 999px; border: 0; background: transparent; color: #6b7280; font-size: 20px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }\n            .ts-toast.ts-toast-confirm .ts-toast-close:hover { background: rgba(0,0,0,0.06); }\n            .ts-toast.ts-toast-confirm .ts-toast-icon { width: 64px; height: 64px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; }\n            .ts-toast.ts-toast-confirm .ts-toast-icon img { width: 36px; height: 36px; }\n            .ts-toast.ts-toast-confirm.ts-toast-success .ts-toast-icon { background: #dcfce7; }\n            .ts-toast.ts-toast-confirm.ts-toast-info .ts-toast-icon { background: #dbeafe; }\n            .ts-toast.ts-toast-confirm.ts-toast-warning .ts-toast-icon { background: #fef3c7; }\n            .ts-toast.ts-toast-confirm.ts-toast-error .ts-toast-icon { background: #fee2e2; }\n        ",document.head.appendChild(e)}();const toast=function(t,e={}){const{position:o="top-right",animation:s="slide-right",type:n="info",duration:a=3e3,icon:i=null,showLoader:l=!1,mode:r="alert",title:c=null,confirmText:d="Yes",cancelText:u="No",input:m=!1,inputPlaceholder:p="",inputValue:f="",confirmButtonBg:h=null,confirmButtonColor:g=null,cancelButtonBg:y=null,cancelButtonColor:x=null,onConfirm:b=null,onCancel:v=null,onResult:w=null,useOverlay:C=!0,closeOnOverlayClick:T=!0,showClose:E=!1,dismissOnClick:S=!0,onClick:L=null,onShow:_=null,onDismiss:N=null}=e,k="confirm"===r||"swal"===r,A="string"==typeof e.animation&&e.animation.trim()?{"slide-top":"ts-toast-slide-top","slide-bottom":"ts-toast-slide-bottom","slide-left":"ts-toast-slide-left","slide-right":"ts-toast-slide-right","zoom-in":"ts-toast-zoom-in","zoom-out":"ts-toast-zoom-out",flip:"ts-toast-flip"}[O=e.animation.trim()]||O:k?"ts-toast-zoom-in":o.startsWith("top")?"ts-toast-slide-top":o.startsWith("bottom")?"ts-toast-slide-bottom":o.endsWith("left")?"ts-toast-slide-left":"ts-toast-slide-right";var O;const B=(t,e)=>{const o=t.dataset&&t.dataset.anim?t.dataset.anim:t.style.animation||"";let s="";o.includes("ts-toast-slide-top")?s="translateY(-100%)":o.includes("ts-toast-slide-bottom")?s="translateY(100%)":(o.includes("ts-toast-slide-left")||o.includes("ts-toast-slide-right"))&&(s="translateX(100%)"),t.classList.add("ts-toast-slide-out"),t.classList.remove("ts-toast-show"),t.style.animation="",s&&(t.style.transform=s),t.style.opacity="0",setTimeout((()=>{t.classList.remove("ts-toast-slide-out"),t.parentNode&&t.parentNode.removeChild(t),"function"==typeof e&&e()}),500)},$=document.createElement("div");$.className=`ts-toast ts-toast-${n}${k?" ts-toast-confirm":""}`,$.dataset.anim=A,$.style.animation=`${A} 0.5s ease`,k||($.style.flexDirection="row-reverse",$.style.justifyContent="flex-end");const R=document.createElement("span");if(R.className="ts-toast-icon",R.style.display="flex",i)R.textContent=i;else{const t=document.createElement("img");t.alt="",t.setAttribute("aria-hidden","true"),t.style.width="30px",t.style.height="30px",t.style.objectFit="contain";const e={success:"success.gif",error:"error.gif",info:"info.gif",warning:"warning.gif"}[n];e&&(t.src=`${TS_TOAST_CDN}/assets/img/${e}`),R.appendChild(t)}const j=document.createElement("div");j.className="ts-toast-body",j.innerHTML=t;let q=null;if(k){if(q=document.createElement("div"),q.className="ts-toast-content",q.appendChild(R),c){const t=document.createElement("div");t.className="ts-toast-title",t.textContent=c,q.appendChild(t)}q.appendChild(j),$.appendChild(q)}else $.appendChild(j);let z=null;k&&m&&("textarea"===m?(z=document.createElement("textarea"),z.rows=3):(z=document.createElement("input"),z.type="text"===m||"email"===m||"password"===m||"number"===m?m:"text"),z.className="ts-toast-input",z.placeholder=p,z.value=f,$.appendChild(z));let D=null,P=null,X=null;if(k){D=document.createElement("div"),D.className="ts-toast-actions";const t=document.createElement("button");t.className="ts-toast-btn cancel",t.textContent=u;const e=document.createElement("button");e.className="ts-toast-btn confirm",e.textContent=d,y&&(t.style.background=y),x&&(t.style.color=x),h&&(e.style.background=h),g&&(e.style.color=g),D.appendChild(t),D.appendChild(e),$.appendChild(D),$.result=new Promise((t=>{P=t}));let o=!1;X=t=>{if(o)return;o=!0;const e=t?!z||z.value:!!z&&null;P&&P(e),t&&"function"==typeof b&&b(e,$),t||"function"!=typeof v||v($),"function"==typeof w&&w(e,$),B($,(()=>{N&&"function"==typeof N&&N($),F&&F.parentNode&&F.parentNode.removeChild(F)}))},t.addEventListener("click",(t=>{t.stopPropagation(),X(!1)})),e.addEventListener("click",(t=>{t.stopPropagation(),X(!0)}))}let M=null;l&&(M=document.createElement("div"),M.className="ts-toast-loader",$.appendChild(M));let F=null;if(k&&C){if(F=document.createElement("div"),F.className="ts-toast-overlay"+(e.position?` ${o}`:""),document.body.appendChild(F),F.appendChild($),E){const t=document.createElement("button");t.className="ts-toast-close",t.setAttribute("aria-label","Close"),t.innerHTML="×",t.addEventListener("click",(t=>{t.stopPropagation(),X(!1)})),$.appendChild(t)}T&&F.addEventListener("click",(t=>{t.target===F&&X(!1)}))}else{let t=document.querySelector(`.ts-toast-container.${o}`);t||(t=document.createElement("div"),t.className=`ts-toast-container ${o}`,document.body.appendChild(t)),t.appendChild($)}if(_&&"function"==typeof _&&_($),setTimeout((()=>{$.classList.add("ts-toast-show")}),100),l&&M&&setTimeout((()=>{$._managedByLoading||(M.classList.add("done"),M.remove(),$.contains(R)||(k&&q?q.appendChild(R):$.appendChild(R)))}),2e3),l||k||$.contains(R)||$.appendChild(R),!k&&a>0){const t=setTimeout((()=>{B($,(()=>{N&&"function"==typeof N&&N($)}))}),a);$._autoRemove=t}if(!k&&S&&$.addEventListener("click",(()=>{$._autoRemove&&clearTimeout($._autoRemove),B($,(()=>{L&&"function"==typeof L&&L($),N&&"function"==typeof N&&N($)}))})),!k){let t=0,e=0;$.addEventListener("touchstart",(e=>{t=e.changedTouches[0].screenX})),$.addEventListener("touchend",(o=>{e=o.changedTouches[0].screenX,Math.abs(t-e)>50&&($._autoRemove&&clearTimeout($._autoRemove),B($,(()=>{N&&"function"==typeof N&&N($)})))}))}return $};toast.success=function(t,e){return toast(t,{...e,type:"success"})},toast.error=function(t,e){return toast(t,{...e,type:"error"})},toast.warning=function(t,e){return toast(t,{...e,type:"warning"})},toast.info=function(t,e){return toast(t,{...e,type:"info"})},toast.update=function(t,e,o={}){const{type:s=null,icon:n=null,showLoader:a=!1,duration:i=3e3,onClick:l=null,onShow:r=null,onDismiss:c=null}=o,d=t.querySelector(".ts-toast-loader"),u=t.querySelector(".ts-toast-icon");d&&d.remove(),s&&(["success","error","info","warning"].forEach((e=>t.classList.remove(`ts-toast-${e}`))),t.classList.add("ts-toast",`ts-toast-${s}`,"ts-toast-show"));const m=t.querySelector(".ts-toast-body");m&&(m.innerHTML=e),u&&u.remove();const p=document.createElement("span");if(p.className="ts-toast-icon",p.style.display="flex",n)p.textContent=n;else{const t=document.createElement("img");t.alt="",t.setAttribute("aria-hidden","true"),t.style.width="30px",t.style.height="30px",t.style.objectFit="contain";const e={success:"success.gif",error:"error.gif",info:"info.gif",warning:"warning.gif"}[s];e&&(t.src=`${TS_TOAST_CDN}/assets/img/${e}`),p.appendChild(t)}if((t.querySelector(".ts-toast-content")||t).appendChild(p),a){const e=document.createElement("div");e.className="ts-toast-loader",t.appendChild(e),setTimeout((()=>{e.classList.add("done")}),2e3)}t._autoRemove&&clearTimeout(t._autoRemove);const f=setTimeout((()=>{var e,o;o=()=>{c&&"function"==typeof c&&c(t)},(e=t).classList.add("ts-toast-slide-out"),e.classList.remove("ts-toast-show"),e.style.animation="",setTimeout((()=>{e.classList.remove("ts-toast-slide-out"),e.parentNode&&e.parentNode.removeChild(e),"function"==typeof o&&o()}),500)}),i);t._autoRemove=f},toast.loading=function(t,e={}){const o=toast(t,{...e,type:e.type||"info",duration:0,showLoader:!0,icon:null});requestAnimationFrame((()=>{o.classList.add("ts-toast-show")}));const s=o.querySelector(".ts-toast-loader");let n=o.querySelector(".ts-toast-icon");return n||(n=document.createElement("span"),n.className="ts-toast-icon",n.style.display="flex",o.appendChild(n)),o._managedByLoading=!0,s&&setTimeout((()=>{o._managedByLoading||s.classList.add("done")}),2e3),{update:(t,e={})=>{o._managedByLoading=!1,toast.update(o,t,{...e,showLoader:!1})},close:()=>{o._autoRemove&&clearTimeout(o._autoRemove),o.classList.add("ts-toast-slide-out"),o.classList.remove("ts-toast-show"),o.style.animation="",setTimeout((()=>{o.classList.remove("ts-toast-slide-out"),o.parentNode&&o.parentNode.removeChild(o)}),500)}}},toast.confirm=function(t,e={}){return new Promise((o=>{toast(t,{...e,mode:"confirm",duration:0,dismissOnClick:!1,onResult:t=>o(t)})}))},"undefined"!=typeof window&&(window.toast=toast),"undefined"!=typeof module&&module.exports&&(module.exports=toast);