@primestyleai/tryon 5.10.195 → 5.10.196

package/dist/primestyle-tryon.js

@@ -1,21 +1,21 @@
 "use client";
-import { c as l, A as c, i as h, a as u, S as m } from "./index-D_9-KLXy.js";
-import { P as x, b as w, T as C, d as S, e as E, r as U } from "./index-D_9-KLXy.js";
-function d() {
+import { c as l, A as c, s as h, t as u, i as m, a as g, S as y } from "./index-8lZs7T93.js";
+import { P as C, b as S, T as k, d as E, e as U, r as I } from "./index-8lZs7T93.js";
+function p() {
   const i = document.querySelector(
     'meta[property="og:image"]'
   );
   if (i?.content) return i.content;
-  const e = document.querySelectorAll(
+  const t = document.querySelectorAll(
     'script[type="application/ld+json"]'
   );
-  for (const r of e)
+  for (const r of t)
     try {
-      const s = JSON.parse(r.textContent || ""), o = p(s);
+      const s = JSON.parse(r.textContent || ""), o = d(s);
       if (o) return o;
     } catch {
     }
-  const t = [
+  const e = [
     "[data-product-image] img",
     "[data-product-image]",
     ".product-image img",
@@ -26,7 +26,7 @@ function d() {
     ".woocommerce-product-gallery img",
     ".product-media img"
   ];
-  for (const r of t) {
+  for (const r of e) {
     const s = document.querySelector(r);
     if (s) {
       const o = s.src || s.dataset.src || s.dataset.zoom;
@@ -35,29 +35,29 @@ function d() {
   }
   return null;
 }
-function p(i) {
+function d(i) {
   if (!i || typeof i != "object") return null;
   if (Array.isArray(i)) {
-    for (const t of i) {
-      const r = p(t);
+    for (const e of i) {
+      const r = d(e);
       if (r) return r;
     }
     return null;
   }
-  const e = i;
-  if (e["@type"] === "Product" || e["@type"] === "IndividualProduct") {
-    const t = e.image;
-    if (typeof t == "string") return t;
-    if (Array.isArray(t) && typeof t[0] == "string") return t[0];
-    if (t && typeof t == "object") {
-      const r = t;
+  const t = i;
+  if (t["@type"] === "Product" || t["@type"] === "IndividualProduct") {
+    const e = t.image;
+    if (typeof e == "string") return e;
+    if (Array.isArray(e) && typeof e[0] == "string") return e[0];
+    if (e && typeof e == "object") {
+      const r = e;
       if (typeof r.url == "string") return r.url;
       if (typeof r.contentUrl == "string") return r.contentUrl;
     }
   }
-  return Array.isArray(e["@graph"]) ? p(e["@graph"]) : null;
+  return Array.isArray(t["@graph"]) ? d(t["@graph"]) : null;
 }
-function g() {
+function b() {
   return `
     :host {
       display: inline-block;
@@ -440,7 +440,7 @@ const n = {
   x: '<svg viewBox="0 0 24 24"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>',
   alert: '<svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>'
 };
-class b extends HTMLElement {
+class v extends HTMLElement {
   constructor() {
     super(), this.apiClient = null, this.sseClient = null, this.sseUnsubscribe = null, this.state = "idle", this.selectedFile = null, this.previewUrl = null, this.resultImageUrl = null, this.errorMessage = null, this.currentJobId = null, this.productImageUrl = null, this.productViewReportedFor = null, this.t = l(), this.buttonStyles = {}, this.modalStyles = {}, this.savedScrollY = 0, this.shadow = this.attachShadow({ mode: "open" });
   }
@@ -452,6 +452,7 @@ class b extends HTMLElement {
       "button-text",
       "locale",
       "show-powered-by",
+      "clarity-project-id",
       "button-styles",
       "modal-styles"
     ];
@@ -462,13 +463,13 @@ class b extends HTMLElement {
   disconnectedCallback() {
     this.cleanup();
   }
-  attributeChangedCallback(e, t, r) {
-    if ((e === "api-key" || e === "api-url") && this.initApi(), e === "locale" && (this.t = l(r || void 0)), e === "product-image" && (this.productImageUrl = r), e === "button-styles")
+  attributeChangedCallback(t, e, r) {
+    if ((t === "api-key" || t === "api-url") && this.initApi(), t === "locale" && (this.t = l(r || void 0)), t === "product-image" && (this.productImageUrl = r), t === "button-styles")
       try {
         this.buttonStyles = JSON.parse(r);
       } catch {
       }
-    if (e === "modal-styles")
+    if (t === "modal-styles")
       try {
         this.modalStyles = JSON.parse(r);
       } catch {
@@ -477,12 +478,12 @@ class b extends HTMLElement {
   }
   // ── Public API ──────────────────────────────
   /** Configure button appearance programmatically */
-  setButtonStyles(e) {
-    this.buttonStyles = { ...this.buttonStyles, ...e }, this.applyButtonStyles();
+  setButtonStyles(t) {
+    this.buttonStyles = { ...this.buttonStyles, ...t }, this.applyButtonStyles();
   }
   /** Configure modal appearance programmatically */
-  setModalStyles(e) {
-    this.modalStyles = { ...this.modalStyles, ...e }, this.applyModalStyles();
+  setModalStyles(t) {
+    this.modalStyles = { ...this.modalStyles, ...t }, this.applyModalStyles();
   }
   lockBodyScroll() {
     this.savedScrollY = window.scrollY, document.body.style.overflow = "hidden", document.body.style.position = "fixed", document.body.style.top = `-${this.savedScrollY}px`, document.body.style.left = "0", document.body.style.right = "0";
@@ -492,7 +493,7 @@ class b extends HTMLElement {
   }
   /** Open the try-on modal */
   open() {
-    this.reportEvent("SDK_OPENED", { metadata: { component: "PrimeStyleTryonElement" } }), this.state = "upload", this.lockBodyScroll(), this.render(), this.emit("ps:open");
+    this.reportEvent("SDK_OPENED", { metadata: { component: "PrimeStyleTryonElement" } }), this.state = "upload", this.tagClarity("upload"), this.lockBodyScroll(), this.render(), this.emit("ps:open");
   }
   /** Close the try-on modal */
   close() {
@@ -500,36 +501,36 @@ class b extends HTMLElement {
   }
   /** Detect product image from the current page */
   detectProduct() {
-    const e = d();
-    return e && (this.productImageUrl = e, this.emit("ps:product-detected", { imageUrl: e })), e;
+    const t = p();
+    return t && (this.productImageUrl = t, this.emit("ps:product-detected", { imageUrl: t })), t;
   }
   // ── Private ─────────────────────────────────
   init() {
-    const e = this.getAttribute("button-styles");
-    if (e)
+    const t = this.getAttribute("button-styles");
+    if (t)
       try {
-        this.buttonStyles = JSON.parse(e);
+        this.buttonStyles = JSON.parse(t);
       } catch {
       }
-    const t = this.getAttribute("modal-styles");
-    if (t)
+    const e = this.getAttribute("modal-styles");
+    if (e)
       try {
-        this.modalStyles = JSON.parse(t);
+        this.modalStyles = JSON.parse(e);
       } catch {
       }
     const r = this.getAttribute("locale");
-    r && (this.t = l(r)), this.productImageUrl = this.getAttribute("product-image") || null, this.productImageUrl || (this.productImageUrl = d(), this.productImageUrl && this.emit("ps:product-detected", { imageUrl: this.productImageUrl })), this.initApi(), this.reportProductView();
+    r && (this.t = l(r)), this.productImageUrl = this.getAttribute("product-image") || null, this.productImageUrl || (this.productImageUrl = p(), this.productImageUrl && this.emit("ps:product-detected", { imageUrl: this.productImageUrl })), this.initApi(), this.reportProductView();
   }
   initApi() {
-    const e = this.getAttribute("api-key") || void 0, t = this.getAttribute("api-url") || void 0;
-    this.apiClient = new c(e, t), this.sseClient = null;
+    const t = this.getAttribute("api-key") || void 0, e = this.getAttribute("api-url") || void 0;
+    this.apiClient = new c(t, e), this.sseClient = null;
   }
   cleanup() {
     this.state !== "idle" && this.unlockBodyScroll(), this.sseUnsubscribe && (this.sseUnsubscribe(), this.sseUnsubscribe = null), this.sseClient && (this.sseClient.disconnect(), this.sseClient = null), this.previewUrl && URL.revokeObjectURL(this.previewUrl);
   }
-  emit(e, t) {
+  emit(t, e) {
     this.dispatchEvent(
-      new CustomEvent(e, { bubbles: !0, composed: !0, detail: t })
+      new CustomEvent(t, { bubbles: !0, composed: !0, detail: e })
     );
   }
   get eventProductContext() {
@@ -540,21 +541,31 @@ class b extends HTMLElement {
     };
   }
   reportProductView() {
-    const e = `${this.eventProductContext.productId || ""}|${this.eventProductContext.productUrl || ""}`;
-    !e.trim() || this.productViewReportedFor === e || (this.productViewReportedFor = e, this.reportEvent("PRODUCT_VIEW", { metadata: { component: "PrimeStyleTryonElement" } }));
+    const t = `${this.eventProductContext.productId || ""}|${this.eventProductContext.productUrl || ""}`;
+    !t.trim() || this.productViewReportedFor === t || (this.productViewReportedFor = t, this.tagClarity("idle"), this.reportEvent("PRODUCT_VIEW", { metadata: { component: "PrimeStyleTryonElement" } }));
   }
-  reportEvent(e, t = {}) {
+  tagClarity(t, e) {
+    const r = {
+      projectId: this.getAttribute("clarity-project-id"),
+      ...this.eventProductContext,
+      view: t,
+      jobId: e,
+      source: "custom-element-sdk"
+    };
+    h(r), u(r);
+  }
+  reportEvent(t, e = {}) {
     this.apiClient?.reportEvent({
-      eventType: e,
+      eventType: t,
       ...this.eventProductContext,
-      ...t
+      ...e
     }).catch(() => {
     });
   }
-  reportClientError(e) {
+  reportClientError(t) {
     this.apiClient?.reportClientError({
       ...this.eventProductContext,
-      ...e
+      ...t
     }).catch(() => {
     });
   }
@@ -567,34 +578,34 @@ class b extends HTMLElement {
   // ── Rendering ───────────────────────────────
   render() {
     this.shadow.innerHTML = "";
-    const e = document.createElement("style");
-    e.textContent = g(), this.shadow.appendChild(e);
-    const t = this.createButton();
-    if (this.shadow.appendChild(t), this.state !== "idle") {
+    const t = document.createElement("style");
+    t.textContent = b(), this.shadow.appendChild(t);
+    const e = this.createButton();
+    if (this.shadow.appendChild(e), this.state !== "idle") {
       const r = this.createModal();
       this.shadow.appendChild(r), requestAnimationFrame(() => r.classList.add("ps-open"));
     }
     this.applyButtonStyles(), this.applyModalStyles();
   }
   createButton() {
-    const e = document.createElement("button");
-    return e.className = "ps-button", e.innerHTML = `${n.camera}<span>${this.buttonText}</span>`, e.addEventListener("click", () => this.open()), e;
+    const t = document.createElement("button");
+    return t.className = "ps-button", t.innerHTML = `${n.camera}<span>${this.buttonText}</span>`, t.addEventListener("click", () => this.open()), t;
   }
   createModal() {
-    const e = document.createElement("div");
-    e.className = "ps-overlay", e.addEventListener("click", (a) => {
-      a.target === e && this.close();
-    });
     const t = document.createElement("div");
-    t.className = "ps-modal";
+    t.className = "ps-overlay", t.setAttribute("data-clarity-unmask", "true"), t.addEventListener("click", (a) => {
+      a.target === t && this.close();
+    });
+    const e = document.createElement("div");
+    e.className = "ps-modal", e.setAttribute("data-clarity-unmask", "true");
     const r = document.createElement("div");
     r.className = "ps-header", r.innerHTML = `
       <span class="ps-header-title">${this.t("Virtual Try-On")}</span>
     `;
     const s = document.createElement("button");
-    s.className = "ps-close", s.innerHTML = n.x, s.addEventListener("click", () => this.close()), r.appendChild(s), t.appendChild(r);
+    s.className = "ps-close", s.innerHTML = n.x, s.addEventListener("click", () => this.close()), r.appendChild(s), e.appendChild(r);
     const o = document.createElement("div");
-    switch (o.className = "ps-body", this.state) {
+    switch (o.className = "ps-body", o.setAttribute("data-clarity-unmask", "true"), this.state) {
       case "upload":
         o.appendChild(this.createUploadView());
         break;
@@ -608,109 +619,109 @@ class b extends HTMLElement {
         o.appendChild(this.createErrorView());
         break;
     }
-    if (t.appendChild(o), this.showPoweredBy) {
+    if (e.appendChild(o), this.showPoweredBy) {
       const a = document.createElement("div");
-      a.className = "ps-powered", a.innerHTML = `${this.t("Powered by")} <a href="https://myaifitting.com" target="_blank" rel="noopener">PrimeStyle AI</a>`, t.appendChild(a);
+      a.className = "ps-powered", a.innerHTML = `${this.t("Powered by")} <a href="https://myaifitting.com" target="_blank" rel="noopener">PrimeStyle AI</a>`, e.appendChild(a);
     }
-    return e.appendChild(t), e;
+    return t.appendChild(e), t;
   }
   createUploadView() {
-    const e = document.createDocumentFragment();
+    const t = document.createDocumentFragment();
     if (this.selectedFile && this.previewUrl) {
-      const t = document.createElement("div");
-      t.className = "ps-preview";
+      const e = document.createElement("div");
+      e.className = "ps-preview";
       const r = document.createElement("img");
-      r.src = this.previewUrl, r.alt = this.t("Your photo"), t.appendChild(r);
+      r.src = this.previewUrl, r.alt = this.t("Your photo"), e.appendChild(r);
       const s = document.createElement("button");
       s.className = "ps-preview-remove", s.textContent = "×", s.addEventListener("click", () => {
         this.resetUpload(), this.render();
-      }), t.appendChild(s), e.appendChild(t);
+      }), e.appendChild(s), t.appendChild(e);
       const o = document.createElement("button");
-      o.className = "ps-submit", o.textContent = this.t("Try It On"), o.addEventListener("click", () => this.handleSubmit()), e.appendChild(o);
+      o.className = "ps-submit", o.textContent = this.t("Try It On"), o.addEventListener("click", () => this.handleSubmit()), t.appendChild(o);
     } else {
-      const t = document.createElement("div");
-      t.className = "ps-upload-zone";
+      const e = document.createElement("div");
+      e.className = "ps-upload-zone";
       const r = document.createElement("input");
       r.type = "file", r.accept = "image/jpeg,image/png,image/webp", r.addEventListener("change", (s) => {
         const o = s.target.files?.[0];
         o && this.handleFileSelect(o);
-      }), t.innerHTML = `
+      }), e.innerHTML = `
         <svg class="ps-upload-icon" viewBox="0 0 24 24">${n.upload.replace(/<\/?svg[^>]*>/g, "")}</svg>
         <p class="ps-upload-text">${this.t("Drop your photo here or click to upload")}</p>
         <p class="ps-upload-hint">${this.t("JPEG, PNG or WebP (max 10MB)")}</p>
-      `, t.appendChild(r), t.addEventListener("click", () => r.click()), t.addEventListener("dragover", (s) => {
-        s.preventDefault(), t.classList.add("ps-drag-over");
-      }), t.addEventListener("dragleave", () => {
-        t.classList.remove("ps-drag-over");
-      }), t.addEventListener("drop", (s) => {
-        s.preventDefault(), t.classList.remove("ps-drag-over");
+      `, e.appendChild(r), e.addEventListener("click", () => r.click()), e.addEventListener("dragover", (s) => {
+        s.preventDefault(), e.classList.add("ps-drag-over");
+      }), e.addEventListener("dragleave", () => {
+        e.classList.remove("ps-drag-over");
+      }), e.addEventListener("drop", (s) => {
+        s.preventDefault(), e.classList.remove("ps-drag-over");
         const o = s.dataTransfer?.files?.[0];
         o && this.handleFileSelect(o);
-      }), e.appendChild(t);
+      }), t.appendChild(e);
     }
-    return e;
+    return t;
   }
   createProcessingView() {
-    const e = document.createElement("div");
-    return e.className = "ps-processing", e.innerHTML = `
+    const t = document.createElement("div");
+    return t.className = "ps-processing", t.innerHTML = `
       <div class="ps-spinner"></div>
       <p class="ps-processing-text">${this.t("Generating virtual try-on...")}</p>
       <p class="ps-processing-sub">${this.t("This usually takes 15-20 seconds")}</p>
-    `, e;
+    `, t;
   }
   createResultView() {
-    const e = document.createElement("div");
-    if (e.className = "ps-result", this.resultImageUrl) {
+    const t = document.createElement("div");
+    if (t.className = "ps-result", this.resultImageUrl) {
       const o = document.createElement("img");
-      o.src = this.resultImageUrl, o.alt = this.t("Try-on result"), e.appendChild(o);
+      o.src = this.resultImageUrl, o.alt = this.t("Try-on result"), t.appendChild(o);
     }
-    const t = document.createElement("div");
-    t.className = "ps-result-actions";
+    const e = document.createElement("div");
+    e.className = "ps-result-actions";
     const r = document.createElement("button");
-    r.className = "ps-btn-download", r.textContent = this.t("Download"), r.addEventListener("click", () => this.handleDownload()), t.appendChild(r);
+    r.className = "ps-btn-download", r.textContent = this.t("Download"), r.addEventListener("click", () => this.handleDownload()), e.appendChild(r);
     const s = document.createElement("button");
     return s.className = "ps-btn-retry", s.textContent = this.t("Try Another"), s.addEventListener("click", () => {
       this.resetUpload(), this.state = "upload", this.render();
-    }), t.appendChild(s), e.appendChild(t), e;
+    }), e.appendChild(s), t.appendChild(e), t;
   }
   createErrorView() {
-    const e = document.createElement("div");
-    e.className = "ps-error", e.innerHTML = `
+    const t = document.createElement("div");
+    t.className = "ps-error", t.innerHTML = `
       <svg class="ps-error-icon" viewBox="0 0 24 24">${n.alert.replace(/<\/?svg[^>]*>/g, "")}</svg>
       <p class="ps-error-text">${this.errorMessage || this.t("Something went wrong")}</p>
     `;
-    const t = document.createElement("button");
-    return t.className = "ps-submit", t.textContent = this.t("Try Again"), t.addEventListener("click", () => {
+    const e = document.createElement("button");
+    return e.className = "ps-submit", e.textContent = this.t("Try Again"), e.addEventListener("click", () => {
       this.state = "upload", this.errorMessage = null, this.render();
-    }), e.appendChild(t), e;
+    }), t.appendChild(e), t;
   }
   // ── Handlers ────────────────────────────────
-  handleFileSelect(e) {
-    if (!h(e)) {
+  handleFileSelect(t) {
+    if (!m(t)) {
       this.errorMessage = this.t("Please upload a JPEG, PNG, or WebP image."), this.state = "error", this.reportClientError({
         message: "Invalid image file type",
         code: "INVALID_FILE",
         component: "PrimeStyleTryonElement",
         view: "upload",
         severity: "low",
-        metadata: { fileType: e.type, fileSize: e.size }
+        metadata: { fileType: t.type, fileSize: t.size }
       }), this.render();
       return;
     }
-    if (e.size > 10 * 1024 * 1024) {
+    if (t.size > 10 * 1024 * 1024) {
       this.errorMessage = this.t("Image must be under 10MB."), this.state = "error", this.reportClientError({
         message: "Image file too large",
         code: "FILE_TOO_LARGE",
         component: "PrimeStyleTryonElement",
         view: "upload",
         severity: "low",
-        metadata: { fileType: e.type, fileSize: e.size }
+        metadata: { fileType: t.type, fileSize: t.size }
       }), this.render();
       return;
     }
-    this.selectedFile = e, this.previewUrl = URL.createObjectURL(e), this.reportEvent("PHOTO_UPLOADED", {
-      metadata: { fileType: e.type, fileSize: e.size, component: "PrimeStyleTryonElement" }
-    }), this.emit("ps:upload", { file: e }), this.render();
+    this.selectedFile = t, this.previewUrl = URL.createObjectURL(t), this.reportEvent("PHOTO_UPLOADED", {
+      metadata: { fileType: t.type, fileSize: t.size, component: "PrimeStyleTryonElement" }
+    }), this.emit("ps:upload", { file: t }), this.render();
   }
   async handleSubmit() {
     if (!this.selectedFile || !this.apiClient) {
@@ -733,45 +744,45 @@ class b extends HTMLElement {
       }), this.render();
       return;
     }
-    this.state = "processing", this.render();
+    this.state = "processing", this.tagClarity("processing"), this.render();
     try {
-      const e = await u(this.selectedFile), t = await this.apiClient.submitTryOn(
-        e,
+      const t = await g(this.selectedFile), e = await this.apiClient.submitTryOn(
+        t,
         this.productImageUrl
       );
-      this.currentJobId = t.jobId, this.emit("ps:processing", { jobId: t.jobId }), this.sseClient?.disconnect(), this.sseClient = new m(t.streamUrl || this.apiClient.getStreamUrl(t.jobId)), this.sseUnsubscribe = this.sseClient.onJob(
-        t.jobId,
+      this.currentJobId = e.jobId, this.tagClarity("processing", e.jobId), this.emit("ps:processing", { jobId: e.jobId }), this.sseClient?.disconnect(), this.sseClient = new y(e.streamUrl || this.apiClient.getStreamUrl(e.jobId)), this.sseUnsubscribe = this.sseClient.onJob(
+        e.jobId,
         (r) => this.handleVtoUpdate(r)
-      ), this.startPolling(t.jobId);
-    } catch (e) {
-      const t = e instanceof Error ? e.message : this.t("Failed to start try-on");
-      this.errorMessage = t, this.state = "error", this.reportClientError({
-        message: t,
-        code: e?.code || "TRYON_SUBMIT_FAILED",
-        stack: e instanceof Error ? e.stack : void 0,
+      ), this.startPolling(e.jobId);
+    } catch (t) {
+      const e = t instanceof Error ? t.message : this.t("Failed to start try-on");
+      this.errorMessage = e, this.state = "error", this.reportClientError({
+        message: e,
+        code: t?.code || "TRYON_SUBMIT_FAILED",
+        stack: t instanceof Error ? t.stack : void 0,
         component: "PrimeStyleTryonElement",
         view: "processing",
         severity: "medium"
-      }), this.emit("ps:error", { message: t, code: e?.code }), this.render();
+      }), this.emit("ps:error", { message: e, code: t?.code }), this.render();
     }
   }
-  handleVtoUpdate(e) {
-    e.status === "completed" && e.imageUrl ? (this.state !== "result" || this.resultImageUrl?.startsWith("data:") && !e.imageUrl.startsWith("data:")) && (this.resultImageUrl = e.imageUrl, this.state = "result", this.emit("ps:complete", {
-      jobId: e.galleryId,
-      imageUrl: e.imageUrl
-    }), this.render()) : e.status === "failed" && (this.errorMessage = e.error || this.t("Try-on generation failed"), this.state = "error", this.reportClientError({
+  handleVtoUpdate(t) {
+    t.status === "completed" && t.imageUrl ? (this.state !== "result" || this.resultImageUrl?.startsWith("data:") && !t.imageUrl.startsWith("data:")) && (this.resultImageUrl = t.imageUrl, this.state = "result", this.tagClarity("result", t.galleryId), this.emit("ps:complete", {
+      jobId: t.galleryId,
+      imageUrl: t.imageUrl
+    }), this.render()) : t.status === "failed" && (this.errorMessage = t.error || this.t("Try-on generation failed"), this.state = "error", this.tagClarity("error", t.galleryId), this.reportClientError({
       message: this.errorMessage,
       code: "TRYON_GENERATION_FAILED",
       component: "PrimeStyleTryonElement",
       view: "processing",
       severity: "medium",
-      jobId: e.galleryId
+      jobId: t.galleryId
     }), this.emit("ps:error", { message: this.errorMessage }), this.render());
   }
-  startPolling(e) {
-    let t = 0;
+  startPolling(t) {
+    let e = 0;
     const r = 60, s = setInterval(async () => {
-      if (t++, t > r || this.state === "result" || this.state === "idle") {
+      if (e++, e > r || this.state === "result" || this.state === "idle") {
         clearInterval(s);
         return;
       }
@@ -780,15 +791,15 @@ class b extends HTMLElement {
         return;
       }
       try {
-        const o = await this.apiClient.getStatus(e);
+        const o = await this.apiClient.getStatus(t);
         o.status === "completed" && o.imageUrl ? (this.state === "processing" && this.handleVtoUpdate({
-          galleryId: e,
+          galleryId: t,
           status: "completed",
           imageUrl: o.imageUrl,
           error: null,
           timestamp: Date.now()
         }), clearInterval(s)) : o.status === "failed" && (this.state === "processing" && this.handleVtoUpdate({
-          galleryId: e,
+          galleryId: t,
           status: "failed",
           imageUrl: null,
           error: o.message,
@@ -800,10 +811,10 @@ class b extends HTMLElement {
   }
   handleDownload() {
     if (!this.resultImageUrl) return;
-    const e = document.createElement("a");
-    e.href = this.resultImageUrl, e.download = `primestyle-tryon-${Date.now()}.png`, e.target = "_blank", this.resultImageUrl.startsWith("data:") ? e.click() : fetch(this.resultImageUrl).then((t) => t.blob()).then((t) => {
-      const r = URL.createObjectURL(t);
-      e.href = r, e.click(), setTimeout(() => URL.revokeObjectURL(r), 100);
+    const t = document.createElement("a");
+    t.href = this.resultImageUrl, t.download = `primestyle-tryon-${Date.now()}.png`, t.target = "_blank", this.resultImageUrl.startsWith("data:") ? t.click() : fetch(this.resultImageUrl).then((e) => e.blob()).then((e) => {
+      const r = URL.createObjectURL(e);
+      t.href = r, t.click(), setTimeout(() => URL.revokeObjectURL(r), 100);
     }).catch(() => {
       window.open(this.resultImageUrl, "_blank");
     });
@@ -814,7 +825,7 @@ class b extends HTMLElement {
   // ── Custom Style Application ────────────────
   applyButtonStyles() {
     if (!this.shadow.querySelector(".ps-button")) return;
-    const t = {
+    const e = {
       backgroundColor: "--ps-btn-bg",
       textColor: "--ps-btn-color",
       borderRadius: "--ps-btn-radius",
@@ -838,13 +849,13 @@ class b extends HTMLElement {
       iconColor: "--ps-btn-icon-color",
       boxShadow: "--ps-btn-shadow"
     };
-    for (const [r, s] of Object.entries(t)) {
+    for (const [r, s] of Object.entries(e)) {
       const o = this.buttonStyles[r];
       o && this.style.setProperty(s, o);
     }
   }
   applyModalStyles() {
-    const e = {
+    const t = {
       overlayColor: "--ps-modal-overlay",
       backgroundColor: "--ps-modal-bg",
       textColor: "--ps-modal-color",
@@ -876,26 +887,26 @@ class b extends HTMLElement {
       successColor: "--ps-success-color",
       logoHeight: "--ps-logo-height"
     };
-    for (const [t, r] of Object.entries(e)) {
-      const s = this.modalStyles[t];
+    for (const [e, r] of Object.entries(t)) {
+      const s = this.modalStyles[e];
       s && this.style.setProperty(r, s);
     }
   }
 }
-typeof window < "u" && !customElements.get("primestyle-tryon") && customElements.define("primestyle-tryon", b);
+typeof window < "u" && !customElements.get("primestyle-tryon") && customElements.define("primestyle-tryon", v);
 export {
   c as ApiClient,
-  x as PrimeStyleError,
-  b as PrimeStyleTryon,
-  w as SUPPORTED_LOCALES,
-  m as SseClient,
-  C as TRANSLATION_KEYS,
-  S as checkAgeBeforeUpload,
-  u as compressImage,
+  C as PrimeStyleError,
+  v as PrimeStyleTryon,
+  S as SUPPORTED_LOCALES,
+  y as SseClient,
+  k as TRANSLATION_KEYS,
+  E as checkAgeBeforeUpload,
+  g as compressImage,
   l as createT,
-  E as detectLanguage,
-  d as detectProductImage,
-  h as isValidImageFile,
-  U as registerLocale
+  U as detectLanguage,
+  p as detectProductImage,
+  m as isValidImageFile,
+  I as registerLocale
 };
 //# sourceMappingURL=primestyle-tryon.js.map