@namphuongtechnologi/np-hub 0.2.0 → 0.2.2

package/dist/index.cjs

@@ -193,9 +193,9 @@ var SupportWidgetElement = class extends HTMLElement {
     this.prefilledAttachments = [];
     this.previewUrls = [];
     this.closeAfterSuccessTimer = null;
-    this.toastAutoCloseTimer = null;
     this.toastCountdownInterval = null;
-    this.toastDuration = 4e3;
+    this.toastSuccessDuration = 4e3;
+    this.toastErrorDuration = 4e3;
     this.toastRemainingMs = 0;
     this.toastTotalMs = 0;
     this.isToastPaused = false;
@@ -223,7 +223,6 @@ var SupportWidgetElement = class extends HTMLElement {
   disconnectedCallback() {
     window.removeEventListener("resize", this.handleResize);
     this.clearCloseAfterSuccessTimer();
-    this.clearToastAutoCloseTimer();
     this.clearToastCountdown();
   }
   attributeChangedCallback() {
@@ -236,6 +235,10 @@ var SupportWidgetElement = class extends HTMLElement {
     this.user = user;
     this.prefillFromState();
   }
+  /**
+   * Updates the widget configuration.
+   * Supports custom toast auto-close durations via `toastDuration`.
+   */
   setConfig(config) {
     this.config = {
       ...this.config,
@@ -261,7 +264,23 @@ var SupportWidgetElement = class extends HTMLElement {
       this.emailContacts = config.emailContacts;
     }
     if (config.toastDuration !== void 0) {
-      this.toastDuration = this.normalizeToastDuration(config.toastDuration);
+      const duration = config.toastDuration;
+      if (typeof duration === "number") {
+        const val = this.normalizeToastDuration(duration);
+        this.toastSuccessDuration = val;
+        this.toastErrorDuration = val;
+      } else if (duration && typeof duration === "object") {
+        if (duration.success !== void 0) {
+          this.toastSuccessDuration = this.normalizeToastDuration(duration.success);
+        } else {
+          this.toastSuccessDuration = 4e3;
+        }
+        if (duration.error !== void 0) {
+          this.toastErrorDuration = this.normalizeToastDuration(duration.error);
+        } else {
+          this.toastErrorDuration = 4e3;
+        }
+      }
     }
   }
   setFormPrefill(data) {
@@ -279,9 +298,14 @@ var SupportWidgetElement = class extends HTMLElement {
     var _a, _b;
     this.clearCloseAfterSuccessTimer();
     this.resetFormData();
+    this.hideToast(false);
     (_b = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById("modal")) == null ? void 0 : _b.classList.remove("show");
     this.dispatchEvent(new CustomEvent(WIDGET_EVENTS.CLOSE, { bubbles: true }));
   }
+  /**
+   * Helper method to trigger a mock/demo toast popup for testing and development.
+   * @param type - Either "success" or "error"
+   */
   showDemoToast(type) {
     if (type === "success") {
       this.showToast({
@@ -308,9 +332,27 @@ var SupportWidgetElement = class extends HTMLElement {
     };
     const toastDurationAttr = this.getAttribute("toast-duration");
     if (toastDurationAttr !== null) {
-      const parsed = parseInt(toastDurationAttr, 10);
-      if (!isNaN(parsed)) {
-        this.toastDuration = this.normalizeToastDuration(parsed);
+      const trimmed = toastDurationAttr.trim();
+      if (trimmed.startsWith("{")) {
+        try {
+          const parsed = JSON.parse(trimmed);
+          if (parsed && typeof parsed === "object") {
+            if (parsed.success !== void 0) {
+              this.toastSuccessDuration = this.normalizeToastDuration(Number(parsed.success));
+            }
+            if (parsed.error !== void 0) {
+              this.toastErrorDuration = this.normalizeToastDuration(Number(parsed.error));
+            }
+          }
+        } catch (e) {
+        }
+      } else {
+        const parsed = parseInt(trimmed, 10);
+        if (!isNaN(parsed)) {
+          const val = this.normalizeToastDuration(parsed);
+          this.toastSuccessDuration = val;
+          this.toastErrorDuration = val;
+        }
       }
     }
   }
@@ -751,7 +793,7 @@ var SupportWidgetElement = class extends HTMLElement {
     this.clearFieldError("email");
     this.clearFieldError("content");
   }
-  showToast(payload, autoCloseMs = this.toastDuration) {
+  showToast(payload, autoCloseMs) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
     const toastEl = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById("toast");
     const titleEl = (_b = this.shadowRoot) == null ? void 0 : _b.getElementById("toast-title");
@@ -772,7 +814,6 @@ var SupportWidgetElement = class extends HTMLElement {
     if (!toastEl || !titleEl || !messageEl || !detailsEl || !requestCodeEl || !linkRowEl || !linkEl || !countdownBarEl) {
       return;
     }
-    this.clearToastAutoCloseTimer();
     this.clearToastCountdown();
     titleEl.textContent = payload.title;
     messageEl.textContent = payload.message;
@@ -801,8 +842,9 @@ var SupportWidgetElement = class extends HTMLElement {
       linkRowEl.classList.add("is-hidden");
       detailsEl.classList.add("is-hidden");
     }
-    this.toastRemainingMs = autoCloseMs;
-    this.toastTotalMs = autoCloseMs;
+    const duration = autoCloseMs !== void 0 ? autoCloseMs : payload.type === "success" ? this.toastSuccessDuration : this.toastErrorDuration;
+    this.toastRemainingMs = duration;
+    this.toastTotalMs = duration;
     const toastCardEl = (_l = this.shadowRoot) == null ? void 0 : _l.querySelector(".toast-card");
     this.isToastPaused = Boolean(toastCardEl == null ? void 0 : toastCardEl.matches(":hover"));
     toastEl.classList.remove("success", "error");
@@ -813,7 +855,7 @@ var SupportWidgetElement = class extends HTMLElement {
       countdownBarEl
     );
   }
-  hideToast() {
+  hideToast(shouldCloseModal = true) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
     const toastEl = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById("toast");
     const titleEl = (_b = this.shadowRoot) == null ? void 0 : _b.getElementById("toast-title");
@@ -834,7 +876,7 @@ var SupportWidgetElement = class extends HTMLElement {
     if (!toastEl || !titleEl || !messageEl || !detailsEl || !requestCodeEl || !linkRowEl || !linkEl || !countdownBarEl) {
       return;
     }
-    this.clearToastAutoCloseTimer();
+    const isSuccess = toastEl.classList.contains("success");
     this.clearToastCountdown();
     this.toastRemainingMs = 0;
     this.toastTotalMs = 0;
@@ -855,6 +897,9 @@ var SupportWidgetElement = class extends HTMLElement {
       countdownEl.classList.add("is-hidden");
     }
     toastEl.classList.remove("success", "error", "show");
+    if (isSuccess && shouldCloseModal) {
+      this.close();
+    }
   }
   startToastCountdown(countdownEl, secondsEl, barEl) {
     const updateCountdown = () => {
@@ -897,12 +942,6 @@ var SupportWidgetElement = class extends HTMLElement {
       title: content.type === "success" ? "G\u1EEDi y\xEAu c\u1EA7u th\xE0nh c\xF4ng" : "G\u1EEDi y\xEAu c\u1EA7u th\u1EA5t b\u1EA1i"
     };
   }
-  clearToastAutoCloseTimer() {
-    if (this.toastAutoCloseTimer !== null) {
-      window.clearTimeout(this.toastAutoCloseTimer);
-      this.toastAutoCloseTimer = null;
-    }
-  }
   normalizeToastDuration(value) {
     if (!Number.isFinite(value) || value <= 0) {
       return 4e3;
@@ -954,7 +993,7 @@ var SupportWidgetElement = class extends HTMLElement {
   async submit() {
     var _a;
     this.clearCloseAfterSuccessTimer();
-    this.hideToast();
+    this.hideToast(false);
     if (!this.validateRequiredFields()) {
       this.dispatchEvent(
         new CustomEvent(WIDGET_EVENTS.SUBMIT_ERROR, {
@@ -1044,8 +1083,8 @@ var SupportWidgetElement = class extends HTMLElement {
         })
       );
       this.closeAfterSuccessTimer = window.setTimeout(() => {
-        this.close();
-      }, 1200);
+        this.hideToast();
+      }, this.toastSuccessDuration);
     } catch (error) {
       const errorContent = mapHttpClientError(error);
       this.showToast(this.toToastPayload(errorContent));