@primestyleai/tryon 5.10.194 → 5.10.196

package/dist/storefront/primestyle-tryon.js

@@ -9321,53 +9321,6 @@ reactJsxRuntime_production_min.jsxs = q;
   jsxRuntime.exports = reactJsxRuntime_production_min;
 }
 var jsxRuntimeExports = jsxRuntime.exports;
-function cx(base, override) {
-  return override ? `${base} ${override}` : base;
-}
-const MOBILE_BREAKPOINT = 768;
-function useIsMobile() {
-  const [isMobile, setIsMobile] = reactExports.useState(false);
-  reactExports.useEffect(() => {
-    if (typeof window === "undefined") return;
-    const check = () => setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    check();
-    window.addEventListener("resize", check);
-    return () => window.removeEventListener("resize", check);
-  }, []);
-  return isMobile;
-}
-function ErrorView({
-  productImage,
-  productTitle,
-  onManualMeasurements,
-  cn,
-  t: t2
-}) {
-  const isMobile = useIsMobile();
-  const RightColumn = /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cx("ps-tryon-no-chart-content ps-tryon-error-fallback", cn.error), children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-no-chart-icon ps-tryon-error-fallback-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 24 24", width: "44", height: "44", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 3l8.5 15H3.5L12 3z" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 9v4" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 17h.01" })
-    ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "ps-tryon-no-chart-title", children: t2("We couldn't find a matching size for you") }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: cx("ps-tryon-no-chart-msg", cn.errorText), children: t2("Please try the manual measurement screen so we can calculate your fit from your measurements.") }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-no-chart-actions", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { type: "button", onClick: onManualMeasurements, className: cx("ps-tryon-no-chart-cta", cn.submitButton), children: [
-      t2("Try manual measurements"),
-      " →"
-    ] }) })
-  ] });
-  if (isMobile) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-sr", children: [
-      productImage && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-img-col", style: { flex: "0 0 auto", maxHeight: "38vh" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: productImage, alt: productTitle || "", className: "ps-tryon-sr-product-img" }) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-no-chart-right-col", children: RightColumn })
-    ] });
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-sr-split", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-img-col", children: productImage && /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: productImage, alt: productTitle || "", className: "ps-tryon-sr-product-img" }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-right-col ps-tryon-no-chart-right-col", children: RightColumn })
-  ] }) });
-}
 const STORAGE_KEY = "ps_session";
 const MAX_AGE_MS = 30 * 24 * 60 * 60 * 1e3;
 const FALLBACK_PREFIX = "ps_mem_";
@@ -9412,6 +9365,14 @@ function writeRecord(record) {
   } catch {
   }
 }
+function attachReplaySession(sessionId) {
+  if (typeof window === "undefined") return;
+  try {
+    const clarity = window.clarity;
+    if (typeof clarity === "function") clarity("set", STORAGE_KEY, sessionId);
+  } catch {
+  }
+}
 function getOrCreateSessionId() {
   const now = Date.now();
   const existing = readRecord();
@@ -9419,10 +9380,12 @@ function getOrCreateSessionId() {
     if (now - existing.lastSeenAt > 5 * 60 * 1e3) {
       writeRecord({ ...existing, lastSeenAt: now });
     }
+    attachReplaySession(existing.id);
     return existing.id;
   }
   const fresh = { id: uuid(), issuedAt: now, lastSeenAt: now };
   writeRecord(fresh);
+  attachReplaySession(fresh.id);
   return fresh.id;
 }
 function getDeviceHint() {
@@ -9433,6 +9396,16 @@ function getDeviceHint() {
   return "desktop";
 }
 const DEFAULT_API_URL = "http://localhost:4000";
+function isShopifyProxyBase(baseUrl) {
+  return /\/apps\/primestyle(?:\/|$)/.test(baseUrl) || /\/api\/proxy(?:\/|$)/.test(baseUrl);
+}
+function getShopDomain$2() {
+  if (typeof window === "undefined") return null;
+  const w2 = window;
+  if (w2.Shopify?.shop) return w2.Shopify.shop;
+  const hostname = window.location.hostname;
+  return hostname.endsWith(".myshopify.com") ? hostname : null;
+}
 class ApiClient {
   constructor(apiKey, apiUrl) {
     this.apiKey = apiKey || void 0;
@@ -9544,8 +9517,69 @@ class ApiClient {
     }
     return res.json();
   }
-  getStreamUrl() {
-    const streamUrl = `${this.baseUrl}/api/v1/tryon/stream`;
+  async reportEvent(input) {
+    const res = await fetch(`${this.baseUrl}/api/v1/tryon/event`, {
+      method: "POST",
+      headers: this.headers,
+      keepalive: true,
+      body: JSON.stringify({
+        ...input,
+        sessionId: getOrCreateSessionId(),
+        deviceHint: getDeviceHint()
+      })
+    });
+    if (!res.ok) {
+      const data = await res.json().catch(() => ({}));
+      throw new PrimeStyleError(
+        data.message || "Failed to report SDK event",
+        "EVENT_REPORT_FAILED"
+      );
+    }
+    return res.json();
+  }
+  async reportClientError(input) {
+    const res = await fetch(`${this.baseUrl}/api/v1/tryon/client-error`, {
+      method: "POST",
+      headers: this.headers,
+      keepalive: true,
+      body: JSON.stringify({
+        ...input,
+        sessionId: getOrCreateSessionId(),
+        deviceHint: getDeviceHint()
+      })
+    });
+    if (!res.ok) {
+      const data = await res.json().catch(() => ({}));
+      throw new PrimeStyleError(
+        data.message || "Failed to report SDK client error",
+        "CLIENT_ERROR_REPORT_FAILED"
+      );
+    }
+    return res.json();
+  }
+  async reportReplayChunk(input) {
+    const shopifyProxy = isShopifyProxyBase(this.baseUrl);
+    const shopDomain = shopifyProxy ? getShopDomain$2() : null;
+    const url = shopifyProxy && shopDomain ? `${this.baseUrl}/events/replay` : `${this.baseUrl}/api/v1/tryon/replay`;
+    const headers = shopifyProxy && shopDomain ? jsonHeaders() : this.headers;
+    const body = shopifyProxy && shopDomain ? { shopDomain, ...input } : input;
+    const res = await fetch(url, {
+      method: "POST",
+      headers,
+      body: JSON.stringify(body)
+    });
+    if (!res.ok) {
+      const data = await res.json().catch(() => ({}));
+      throw new PrimeStyleError(
+        data.message || "Failed to report SDK replay",
+        "REPLAY_REPORT_FAILED"
+      );
+    }
+    return res.json();
+  }
+  getStreamUrl(jobId) {
+    const streamPath = jobId ? `/api/v1/tryon/stream/${encodeURIComponent(jobId)}` : "/api/v1/tryon/stream";
+    const streamUrl = `${this.baseUrl}${streamPath}`;
     return this.apiKey ? `${streamUrl}?key=${encodeURIComponent(this.apiKey)}` : streamUrl;
   }
 }
@@ -9561,6 +9595,89 @@ class PrimeStyleError extends Error {
     this.code = code;
   }
 }
+function detectLocale() {
+  if (typeof navigator === "undefined") return "US";
+  const lang = navigator.language || "";
+  const region = lang.split("-")[1]?.toUpperCase();
+  if (region === "GB") return "UK";
+  if (region) return region;
+  const map = {
+    en: "US",
+    ja: "JP",
+    ko: "KR",
+    zh: "CN",
+    fr: "FR",
+    it: "IT",
+    de: "DE",
+    es: "ES",
+    pt: "BR"
+  };
+  return map[lang.split("-")[0].toLowerCase()] || "US";
+}
+function getApiKey() {
+  let key = "";
+  try {
+    key = "shopify-proxy";
+  } catch {
+  }
+  return key;
+}
+function getApiUrl(override) {
+  if (override) return override;
+  let envUrl = "";
+  try {
+    envUrl = "";
+  } catch {
+  }
+  return envUrl || "http://localhost:4000";
+}
+function cx(base, override) {
+  return override ? `${base} ${override}` : base;
+}
+const MOBILE_BREAKPOINT = 768;
+function useIsMobile() {
+  const [isMobile, setIsMobile] = reactExports.useState(false);
+  reactExports.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const check = () => setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    check();
+    window.addEventListener("resize", check);
+    return () => window.removeEventListener("resize", check);
+  }, []);
+  return isMobile;
+}
+function ErrorView({
+  productImage,
+  productTitle,
+  onManualMeasurements,
+  cn,
+  t: t2
+}) {
+  const isMobile = useIsMobile();
+  const RightColumn = /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cx("ps-tryon-no-chart-content ps-tryon-error-fallback", cn.error), children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-no-chart-icon ps-tryon-error-fallback-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 24 24", width: "44", height: "44", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 3l8.5 15H3.5L12 3z" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 9v4" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 17h.01" })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "ps-tryon-no-chart-title", children: t2("We couldn't find a matching size for you") }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: cx("ps-tryon-no-chart-msg", cn.errorText), children: t2("Please try the manual measurement screen so we can calculate your fit from your measurements.") }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-no-chart-actions", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { type: "button", onClick: onManualMeasurements, className: cx("ps-tryon-no-chart-cta", cn.submitButton), children: [
+      t2("Try manual measurements"),
+      " →"
+    ] }) })
+  ] });
+  if (isMobile) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-sr", children: [
+      productImage && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-img-col", style: { flex: "0 0 auto", maxHeight: "38vh" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: productImage, alt: productTitle || "", className: "ps-tryon-sr-product-img" }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-no-chart-right-col", children: RightColumn })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-sr-split", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-img-col", children: productImage && /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: productImage, alt: productTitle || "", className: "ps-tryon-sr-product-img" }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-right-col ps-tryon-no-chart-right-col", children: RightColumn })
+  ] }) });
+}
 class SseClient {
   constructor(streamUrl) {
     this.eventSource = null;
@@ -10932,42 +11049,6 @@ function installCartHook() {
   }
   console.log(TAG$1, "attribution hook installed");
 }
-function detectLocale() {
-  if (typeof navigator === "undefined") return "US";
-  const lang = navigator.language || "";
-  const region = lang.split("-")[1]?.toUpperCase();
-  if (region === "GB") return "UK";
-  if (region) return region;
-  const map = {
-    en: "US",
-    ja: "JP",
-    ko: "KR",
-    zh: "CN",
-    fr: "FR",
-    it: "IT",
-    de: "DE",
-    es: "ES",
-    pt: "BR"
-  };
-  return map[lang.split("-")[0].toLowerCase()] || "US";
-}
-function getApiKey() {
-  let key = "";
-  try {
-    key = "shopify-proxy";
-  } catch {
-  }
-  return key;
-}
-function getApiUrl(override) {
-  if (override) return override;
-  let envUrl = "";
-  try {
-    envUrl = "";
-  } catch {
-  }
-  return envUrl || "http://localhost:4000";
-}
 const SESSION_KEY = "primestyle_profile_session";
 const AUTH_MESSAGE_TYPE = "PRIMESTYLE_SDK_AUTH";
 const POPUP_TIMEOUT_MS = 12e4;
@@ -11150,6 +11231,30 @@ async function saveRemoteProfiles(apiUrl, accessToken, profiles, activeProfileId
   });
   return normalizeStore(await parseResponse(response));
 }
+function shouldUseShopifyProxy(apiUrl) {
+  if (typeof window === "undefined") return false;
+  try {
+    const w2 = window;
+    if (w2.Shopify?.shop) return true;
+    return /\/apps\/primestyle\/?$/.test(apiUrl);
+  } catch {
+    return false;
+  }
+}
+function reportDirectSdkEvent(apiUrl, apiKey, body) {
+  if (!apiKey || shouldUseShopifyProxy(apiUrl)) return;
+  void fetch(`${apiUrl}/api/v1/tryon/event`, {
+    method: "POST",
+    headers: jsonHeaders(apiKey),
+    keepalive: true,
+    body: JSON.stringify({
+      ...body,
+      sessionId: getOrCreateSessionId(),
+      deviceHint: getDeviceHint()
+    })
+  }).catch(() => {
+  });
+}
 let cachedMP = null;
 const MP_CACHE_TTL_MS = 6e4;
 function setCachedMediaPipe(landmarks) {
@@ -11223,6 +11328,13 @@ async function recommendForProduct(input) {
         recommendedSize: cached.recommendedSize,
         fromCache: true
       });
+      reportDirectSdkEvent(apiUrl, apiKey, {
+        eventType: "SIZE_RECOMMENDATION_SHOWN",
+        productId: input.productId,
+        productTitle: input.productTitle,
+        recommendedSize: cached.recommendedSize,
+        metadata: { fromCache: true, profileId: profile.id }
+      });
       const reconstructedRaw = cached.sectionsFull ? {
         recommendedSize: cached.recommendedSize,
         confidence: cached.confidence || "high",
@@ -11434,6 +11546,19 @@ async function recommendForProduct(input) {
     size: result.recommendedSize,
     recommendedSize: result.recommendedSize
   });
+  logSizeShown({
+    productId: input.productId,
+    productTitle: input.productTitle,
+    recommendedSize: result.recommendedSize,
+    fromCache: false
+  });
+  reportDirectSdkEvent(apiUrl, apiKey, {
+    eventType: "SIZE_RECOMMENDATION_SHOWN",
+    productId: input.productId,
+    productTitle: input.productTitle,
+    recommendedSize: result.recommendedSize,
+    metadata: { fromCache: false, profileId: profile.id, found: result.found }
+  });
   return {
     recommendedSize: result.recommendedSize,
     confidence: result.confidence,
@@ -13117,7 +13242,7 @@ const STYLES = `
   }
 
   /* ── Product photo strip (single-garment, below the size card) ──
-     Three thumbnails per row, evenly spaced, auto-advances. Lives at
+     Two thumbnails per row, evenly spaced, auto-advances. Lives at
      the bottom of the right panel as decoration / entertainment. */
   .ps-tryon-photo-strip {
     margin-top: 0.65vw;
@@ -13136,17 +13261,16 @@ const STYLES = `
   }
   .ps-tryon-photo-strip-row {
     display: grid;
-    grid-template-columns: repeat(3, minmax(0, 1fr));
+    grid-template-columns: repeat(2, minmax(0, 1fr));
     gap: 0.45vw;
     animation: ps-tryon-photo-strip-fade 0.5s ease;
   }
   .ps-tryon-photo-strip-row.ps-count-1 {
-    grid-template-columns: minmax(0, calc((100% - 0.9vw) / 3));
+    grid-template-columns: minmax(0, calc((100% - 0.45vw) / 2));
     justify-content: center;
   }
   .ps-tryon-photo-strip-row.ps-count-2 {
-    grid-template-columns: repeat(2, minmax(0, calc((100% - 0.9vw) / 3)));
-    justify-content: center;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
   }
   .ps-tryon-photo-strip-cell {
     position: relative;
@@ -13207,13 +13331,14 @@ const STYLES = `
       gap: 8px;
     }
     .ps-tryon-photo-strip-row {
-      grid-template-columns: repeat(3, minmax(0, 1fr));
+      grid-template-columns: repeat(2, minmax(0, 1fr));
     }
     .ps-tryon-photo-strip-row.ps-count-1 {
-      grid-template-columns: minmax(0, calc((100% - 16px) / 3));
+      grid-template-columns: minmax(0, calc((100% - 8px) / 2));
+      justify-content: center;
     }
     .ps-tryon-photo-strip-row.ps-count-2 {
-      grid-template-columns: repeat(2, minmax(0, calc((100% - 16px) / 3)));
+      grid-template-columns: repeat(2, minmax(0, 1fr));
     }
     .ps-tryon-photo-strip-cell {
       aspect-ratio: 1 / 1; border-radius: 12px;
@@ -22458,16 +22583,16 @@ const STYLES = `
     }
     .ps-tryon-photo-strip-row {
       display: grid !important;
-      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
+      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
       gap: 8px !important;
     }
     .ps-tryon-photo-strip-row.ps-count-1 {
-      grid-template-columns: minmax(0, calc((100% - 16px) / 3)) !important;
+      grid-template-columns: minmax(0, calc((100% - 8px) / 2)) !important;
       justify-content: center !important;
     }
     .ps-tryon-photo-strip-row.ps-count-2 {
-      grid-template-columns: repeat(2, minmax(0, calc((100% - 16px) / 3))) !important;
-      justify-content: center !important;
+      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+      justify-content: stretch !important;
     }
     .ps-tryon-photo-strip-cell {
       aspect-ratio: 1 / 1 !important;
@@ -23141,6 +23266,232 @@ const STYLES = `
     }
   }
 `;
+const RRWEB_SCRIPT_URL = "https://cdn.jsdelivr.net/npm/rrweb@2.0.1/dist/rrweb.min.js";
+const CHUNK_SIZE = 20;
+const FLUSH_MS = 2500;
+const MAX_EVENT_JSON_BYTES = 5e6;
+const MAX_CHUNK_JSON_BYTES = 6e6;
+let globalSequence = 0;
+let rrwebLoadPromise = null;
+function estimateJsonBytes(value) {
+  try {
+    return JSON.stringify(value).length;
+  } catch {
+    return MAX_EVENT_JSON_BYTES + 1;
+  }
+}
+function canRecord() {
+  return typeof window !== "undefined" && typeof document !== "undefined";
+}
+function getLoadedRrwebRecord() {
+  const rrweb = window.rrweb;
+  return typeof rrweb?.record === "function" ? rrweb.record : null;
+}
+function loadRrwebRecord() {
+  const loaded = getLoadedRrwebRecord();
+  if (loaded) return Promise.resolve(loaded);
+  if (rrwebLoadPromise) return rrwebLoadPromise;
+  rrwebLoadPromise = new Promise((resolve) => {
+    const script = document.createElement("script");
+    script.src = RRWEB_SCRIPT_URL;
+    script.async = true;
+    script.crossOrigin = "anonymous";
+    script.onload = () => resolve(getLoadedRrwebRecord());
+    script.onerror = () => resolve(null);
+    document.head.appendChild(script);
+  });
+  return rrwebLoadPromise;
+}
+function startSdkReplay(input) {
+  if (!canRecord()) return () => {
+  };
+  const sessionId = getOrCreateSessionId();
+  const queue = [];
+  let stopped = false;
+  let timer = null;
+  let stopRecord;
+  const flush = (all = false) => {
+    if (timer) {
+      window.clearTimeout(timer);
+      timer = null;
+    }
+    if (!queue.length) return;
+    do {
+      const events = [];
+      let chunkBytes = 0;
+      while (queue.length && events.length < CHUNK_SIZE) {
+        const event = queue[0];
+        const eventBytes = estimateJsonBytes(event);
+        if (events.length && chunkBytes + eventBytes > MAX_CHUNK_JSON_BYTES) break;
+        events.push(queue.shift());
+        chunkBytes += eventBytes;
+        if (chunkBytes >= MAX_CHUNK_JSON_BYTES) break;
+      }
+      if (!events.length) events.push(queue.shift());
+      const sequence = globalSequence++;
+      void input.client.reportReplayChunk({
+        sessionId,
+        sequence,
+        events,
+        productId: input.productId,
+        productTitle: input.productTitle,
+        productUrl: input.productUrl,
+        deviceHint: getDeviceHint()
+      }).catch((error) => {
+        console.warn("[ps-sdk:replay] failed to upload replay chunk", error);
+      });
+    } while (all && queue.length);
+    if (queue.length) scheduleFlush(0);
+  };
+  const scheduleFlush = (delay = FLUSH_MS) => {
+    if (stopped || timer) return;
+    timer = window.setTimeout(flush, delay);
+  };
+  void loadRrwebRecord().then((record) => {
+    if (!record || stopped) return;
+    stopRecord = record({
+      emit(event) {
+        if (stopped) return;
+        if (estimateJsonBytes(event) > MAX_EVENT_JSON_BYTES) return;
+        queue.push(event);
+        if (queue.length >= CHUNK_SIZE) flush();
+        else scheduleFlush();
+      },
+      checkoutEveryNms: 1e4,
+      maskAllInputs: false,
+      maskInputOptions: {
+        password: true,
+        email: true,
+        tel: true
+      },
+      blockClass: "ps-replay-block",
+      blockSelector: "body > *:not([data-ps-tryon-portal]):not(.ps-tryon-root)",
+      inlineStylesheet: true,
+      inlineImages: true,
+      collectFonts: false,
+      recordCanvas: false,
+      recordCrossOriginIframes: false,
+      slimDOMOptions: {
+        script: true,
+        comment: true,
+        headFavicon: true,
+        headMetaDescKeywords: true,
+        headMetaSocial: true,
+        headMetaRobots: true,
+        headMetaHttpEquiv: true,
+        headMetaAuthorship: true,
+        headMetaVerification: true
+      },
+      sampling: {
+        mousemove: 80,
+        mouseInteraction: true,
+        scroll: 150,
+        media: 800,
+        input: "last"
+      },
+      errorHandler(error) {
+        console.warn("[ps-sdk:replay] recorder error", error);
+      }
+    });
+  });
+  return () => {
+    stopped = true;
+    if (timer) {
+      window.clearTimeout(timer);
+      timer = null;
+    }
+    try {
+      stopRecord?.();
+    } catch {
+    }
+    flush(true);
+  };
+}
+var define_process_env_default = {};
+const SCRIPT_ID_PREFIX = "ps-clarity-script";
+const DEFAULT_PROJECT_ID = "wwb75cfm2z";
+let initializedProjectId = null;
+function cleanProjectId(value) {
+  const trimmed = String(value || "").trim();
+  if (!trimmed) return null;
+  return /^[a-z0-9]+$/i.test(trimmed) ? trimmed : null;
+}
+function readEnvProjectId() {
+  let id2 = "";
+  try {
+    id2 = define_process_env_default.NEXT_PUBLIC_PRIMESTYLE_CLARITY_PROJECT_ID ?? "";
+  } catch {
+  }
+  if (!id2) {
+    try {
+      id2 = define_process_env_default.NEXT_PUBLIC_CLARITY_PROJECT_ID ?? "";
+    } catch {
+    }
+  }
+  return cleanProjectId(id2);
+}
+function readWindowProjectId() {
+  if (typeof window === "undefined") return null;
+  const w2 = window;
+  return cleanProjectId(w2.PrimeStyleAIClarityProjectId || w2.PRIMESTYLE_CLARITY_PROJECT_ID);
+}
+function resolveSdkClarityProjectId(projectId) {
+  return cleanProjectId(projectId) || readWindowProjectId() || readEnvProjectId() || DEFAULT_PROJECT_ID;
+}
+function getClarity() {
+  if (typeof window === "undefined") return null;
+  const clarity = window.clarity;
+  return typeof clarity === "function" ? clarity : null;
+}
+function installClarity(projectId) {
+  if (typeof window === "undefined" || typeof document === "undefined") return null;
+  const scriptId = `${SCRIPT_ID_PREFIX}-${projectId}`;
+  if (!document.getElementById(scriptId)) {
+    ((c, l2, a, r2, i) => {
+      c[a] = c[a] || function(...args) {
+        const queued = c[a];
+        (queued.q = queued.q || []).push(args);
+      };
+      const script = l2.createElement(r2);
+      const firstScript = l2.getElementsByTagName(r2)[0];
+      script.id = scriptId;
+      script.async = true;
+      script.src = "https://www.clarity.ms/tag/" + i;
+      firstScript?.parentNode?.insertBefore(script, firstScript);
+    })(window, document, "clarity", "script", projectId);
+  }
+  return getClarity();
+}
+function setTag(key, value) {
+  const clarity = getClarity();
+  if (!clarity || value === void 0 || value === null || value === "") return;
+  try {
+    clarity("set", key, String(value).slice(0, 512));
+  } catch {
+  }
+}
+function tagSdkClaritySession(input = {}) {
+  const sessionId = getOrCreateSessionId();
+  setTag("ps_session", sessionId);
+  setTag("ps_sdk_session", sessionId);
+  setTag("ps_product_id", input.productId || void 0);
+  setTag("ps_product_title", input.productTitle || void 0);
+  setTag("ps_product_url", input.productUrl || void 0);
+  setTag("ps_sdk_view", input.view || void 0);
+  setTag("ps_tryon_job_id", input.jobId || void 0);
+  setTag("ps_source", input.source || void 0);
+}
+function startSdkClarity(input = {}) {
+  if (typeof window === "undefined" || typeof document === "undefined") return false;
+  const projectId = resolveSdkClarityProjectId(input.projectId);
+  {
+    initializedProjectId = initializedProjectId || projectId;
+    installClarity(initializedProjectId);
+  }
+  if (!getClarity()) return false;
+  tagSdkClaritySession(input);
+  return true;
+}
 function CameraIcon$1({ size = 18 }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z" }),
@@ -24327,8 +24678,8 @@ function MultiSectionMobile({
     sizeGuide ? null : null
   ] });
 }
-const PER_SLIDE = 3;
-const CYCLE_MS = 4e3;
+const PER_SLIDE = 2;
+const CYCLE_MS = 2500;
 function ProductPhotoCarouselCard({
   photos,
   items,
@@ -34632,6 +34983,7 @@ function PrimeStyleTryonInner({
   continueShoppingLabel,
   backToProductPageLabel,
   sizeGuideData,
+  clarityProjectId,
   initialView,
   initialBodyProfileStep
 }) {
@@ -35031,7 +35383,7 @@ function PrimeStyleTryonInner({
       const key = getApiKey();
       const url = getApiUrl(apiUrl);
       apiRef.current = new ApiClient(key, url);
-      sseRef.current = shouldUseShopifyCartAttribution(url) ? null : new SseClient(apiRef.current.getStreamUrl());
+      sseRef.current = null;
     } catch {
     }
     return () => {
@@ -35040,6 +35392,76 @@ function PrimeStyleTryonInner({
       if (pollingRef.current) clearInterval(pollingRef.current);
     };
   }, [apiUrl]);
+  const sdkReplayOpen = view !== "idle";
+  reactExports.useEffect(() => {
+    if (!sdkReplayOpen) return void 0;
+    const client = apiRef.current;
+    if (!client) return void 0;
+    return startSdkReplay({
+      client,
+      productId: effectiveProductId,
+      productTitle: restoredProductTitle || productTitle,
+      productUrl: restoredProductUrl || effectiveProductUrl
+    });
+  }, [sdkReplayOpen, effectiveProductId, effectiveProductUrl, productTitle, restoredProductTitle, restoredProductUrl]);
+  reactExports.useEffect(() => {
+    if (!sdkReplayOpen) return;
+    startSdkClarity({
+      projectId: clarityProjectId,
+      productId: effectiveProductId,
+      productTitle: restoredProductTitle || productTitle,
+      productUrl: restoredProductUrl || effectiveProductUrl,
+      view,
+      jobId: currentTryOnJobIdRef.current,
+      source: shouldUseShopifyCartAttribution(apiUrl) ? "shopify-sdk" : "sdk"
+    });
+  }, [apiUrl, clarityProjectId, effectiveProductId, effectiveProductUrl, productTitle, restoredProductTitle, restoredProductUrl, sdkReplayOpen, view]);
+  const reportSdkEvent = reactExports.useCallback((eventType, input = {}) => {
+    if (shouldUseShopifyCartAttribution(apiUrl)) return;
+    const client = apiRef.current;
+    if (!client) return;
+    void client.reportEvent({
+      eventType,
+      productId: effectiveProductId,
+      productTitle: restoredProductTitle || productTitle,
+      productUrl: restoredProductUrl || effectiveProductUrl,
+      jobId: input.jobId ?? currentTryOnJobIdRef.current ?? void 0,
+      recommendedSize: input.recommendedSize ?? sizingResultRef.current?.recommendedSize,
+      metadata: input.metadata
+    }).catch(() => {
+    });
+  }, [apiUrl, effectiveProductId, effectiveProductUrl, productTitle, restoredProductTitle, restoredProductUrl]);
+  const reportSdkClientError = reactExports.useCallback((input) => {
+    if (shouldUseShopifyCartAttribution(apiUrl)) return;
+    const client = apiRef.current;
+    if (!client) return;
+    void client.reportClientError({
+      ...input,
+      productId: effectiveProductId,
+      productTitle: restoredProductTitle || productTitle,
+      productUrl: restoredProductUrl || effectiveProductUrl,
+      jobId: input.jobId ?? currentTryOnJobIdRef.current ?? void 0
+    }).catch(() => {
+    });
+  }, [apiUrl, effectiveProductId, effectiveProductUrl, productTitle, restoredProductTitle, restoredProductUrl]);
+  const productViewLoggedRef = reactExports.useRef(null);
+  reactExports.useEffect(() => {
+    const key = `${effectiveProductId || ""}|${effectiveProductUrl || ""}`;
+    if (!key.trim() || productViewLoggedRef.current === key) return;
+    productViewLoggedRef.current = key;
+    if (shouldUseShopifyCartAttribution(apiUrl)) {
+      logProductView({ productId: effectiveProductId, productTitle });
+      return;
+    }
+    reportSdkEvent("PRODUCT_VIEW", {
+      metadata: {
+        productUrl: effectiveProductUrl,
+        productFitType: resolvedProductFitType,
+        productCategory,
+        productSubcategory
+      }
+    });
+  }, [apiUrl, effectiveProductId, effectiveProductUrl, productCategory, productSubcategory, productTitle, reportSdkEvent, resolvedProductFitType]);
   const pickFireCountRef = reactExports.useRef(0);
   const toBackendFetchableImageUrl = reactExports.useCallback((url) => {
     const trimmed = String(url || "").trim();
@@ -35580,10 +36002,11 @@ function PrimeStyleTryonInner({
   });
   const handleOpen = reactExports.useCallback(() => {
     console.log("[ps-sdk] handleOpen fired — opening modal");
+    reportSdkEvent("SDK_OPENED", { metadata: { view: "body-profile" } });
     setBodyProfileInitialStep(null);
     setView("body-profile");
     onOpen?.();
-  }, [onOpen]);
+  }, [onOpen, reportSdkEvent]);
   const handleClose = reactExports.useCallback(() => {
     const tryOnInFlight = tryOnProcessing;
     setView("idle");
@@ -35673,12 +36096,28 @@ function PrimeStyleTryonInner({
     if (!isValidImageFile(file)) {
       setErrorMessage(t2("Please upload a JPEG, PNG, or WebP image."));
       setView("error");
+      reportSdkClientError({
+        message: "Invalid image file type",
+        code: "INVALID_FILE",
+        component: "PhotoUpload",
+        view,
+        severity: "low",
+        metadata: { fileType: file.type, fileSize: file.size }
+      });
       onError?.({ message: "Invalid file type", code: "INVALID_FILE" });
       return;
     }
     if (file.size > 10 * 1024 * 1024) {
       setErrorMessage(t2("Image must be under 10MB."));
       setView("error");
+      reportSdkClientError({
+        message: "Image file too large",
+        code: "FILE_TOO_LARGE",
+        component: "PhotoUpload",
+        view,
+        severity: "low",
+        metadata: { fileType: file.type, fileSize: file.size }
+      });
       onError?.({ message: "File too large", code: "FILE_TOO_LARGE" });
       return;
     }
@@ -35687,13 +36126,23 @@ function PrimeStyleTryonInner({
     modelImageIdRef.current = null;
     const objUrl = URL.createObjectURL(file);
     setPreviewUrl(objUrl);
+    reportSdkEvent("PHOTO_UPLOADED", {
+      metadata: { fileType: file.type, fileSize: file.size, view }
+    });
     onUpload?.(file);
     modelPoseRef.current = null;
     detectMeasurementLines(objUrl).then((lines) => {
       modelPoseRef.current = lines;
-    }).catch(() => {
+    }).catch((error) => {
+      reportSdkClientError({
+        message: error instanceof Error ? error.message : "Pose detection failed",
+        code: "POSE_DETECTION_FAILED",
+        component: "MediaPipe",
+        view,
+        severity: "low"
+      });
     });
-  }, [onUpload, onError]);
+  }, [onUpload, onError, reportSdkClientError, reportSdkEvent, t2, view]);
   const handleRemovePreview = reactExports.useCallback(() => {
     setSelectedFile(null);
     if (previewUrl) URL.revokeObjectURL(previewUrl);
@@ -35762,12 +36211,21 @@ function PrimeStyleTryonInner({
         setTryOnProcessing(false);
         setTryOnStartedAt(null);
         const msg = update.error || t2("Try-on generation failed");
+        reportSdkClientError({
+          message: msg,
+          code: "TRYON_GENERATION_FAILED",
+          component: "TryOn",
+          view,
+          severity: "medium",
+          jobId: update.galleryId,
+          metadata: { status: update.status }
+        });
         setErrorMessage(msg);
         setView("error");
         onError?.({ message: msg });
       }
     }
-  }, [apiUrl, effectiveProductId, productTitle, onComplete, onError, cleanupJob]);
+  }, [apiUrl, effectiveProductId, productTitle, onComplete, onError, cleanupJob, reportSdkClientError, t2, view]);
   const dynamicFields = reactExports.useMemo(() => {
     if (sizeGuide?.found && sizeGuide.requiredFields && sizeGuide.requiredFields.length > 0) {
       return sizeGuide.requiredFields;
@@ -35781,6 +36239,14 @@ function PrimeStyleTryonInner({
     const method = methodOverride || sizingMethod;
     const baseUrl = getApiUrl(apiUrl);
     const key = getApiKey();
+    reportSdkEvent("SIZING_STARTED", {
+      metadata: {
+        method,
+        measurementType,
+        productFitType: resolvedProductFitType,
+        hasSizeGuide: !!sizeGuide?.found
+      }
+    });
     if (measurementType === "face" || measurementType === "head") {
       const f2 = formRef.current;
       const toNum = (v2) => {
@@ -35839,16 +36305,42 @@ function PrimeStyleTryonInner({
           const data = await resp.json();
           await minVisible;
           if (data?.found === false) {
+            reportSdkEvent("SIZING_FAILED", {
+              metadata: {
+                reason: data?.reasoning || "NO_MATCH",
+                measurementType,
+                found: false
+              }
+            });
             setNoSizeReason(data?.reasoning === "NO_SIZE_CHART" ? "no-chart" : "no-match");
             setView("no-chart");
             setEstimationDone(true);
             return;
           }
           setSizingResult(data);
+          reportSdkEvent("SIZE_RECOMMENDATION_SHOWN", {
+            recommendedSize: data?.recommendedSize,
+            metadata: {
+              confidence: data?.confidence,
+              measurementType,
+              source: "face-recommend"
+            }
+          });
           onComplete?.(data);
         } else {
           const body = await resp.text().catch(() => "");
           console.error("[PS-SDK] face-recommend failed:", resp.status, body);
+          reportSdkEvent("SIZING_FAILED", {
+            metadata: { status: resp.status, measurementType, source: "face-recommend" }
+          });
+          reportSdkClientError({
+            message: body || "Face/head sizing request failed",
+            code: "FACE_RECOMMEND_FAILED",
+            component: "Sizing",
+            view,
+            severity: "medium",
+            metadata: { status: resp.status, measurementType }
+          });
           await minVisible;
           setErrorMessage(t2("Unable to get a size suggestion. Please try again."));
           setView("error");
@@ -35856,6 +36348,18 @@ function PrimeStyleTryonInner({
         }
       } catch (err) {
         console.error("[PS-SDK] face-recommend network error:", err);
+        reportSdkEvent("SIZING_FAILED", {
+          metadata: { measurementType, source: "face-recommend", network: true }
+        });
+        reportSdkClientError({
+          message: err instanceof Error ? err.message : "Face/head sizing network error",
+          code: "FACE_RECOMMEND_NETWORK_ERROR",
+          stack: err instanceof Error ? err.stack : void 0,
+          component: "Sizing",
+          view,
+          severity: "medium",
+          metadata: { measurementType }
+        });
         await minVisible;
         setErrorMessage(t2("Unable to connect to sizing service. Please try again."));
         setView("error");
@@ -35916,6 +36420,17 @@ function PrimeStyleTryonInner({
       const qWeight = parseFloat(formRef.current.weight || "0");
       if (!qHeight || !qWeight) {
         console.error("[PS-SDK] submitSizing ABORT — qHeight:", qHeight, "qWeight:", qWeight, "formRef:", JSON.stringify(formRef.current));
+        reportSdkEvent("SIZING_FAILED", {
+          metadata: { reason: "missing_height_or_weight", method, measurementType }
+        });
+        reportSdkClientError({
+          message: "Sizing submitted without height or weight",
+          code: "SIZING_INPUT_MISSING",
+          component: "Sizing",
+          view,
+          severity: "low",
+          metadata: { method, measurementType, qHeight, qWeight }
+        });
         setSizingLoading(false);
         return;
       }
@@ -35948,12 +36463,29 @@ function PrimeStyleTryonInner({
         const data = await res.json();
         console.log("[PS-SDK] Sizing recommend RESULT:", JSON.stringify(data));
         if (data?.found === false) {
+          reportSdkEvent("SIZING_FAILED", {
+            metadata: {
+              reason: data?.reasoning || "NO_MATCH",
+              method,
+              measurementType,
+              found: false
+            }
+          });
           setNoSizeReason(data?.reasoning === "NO_SIZE_CHART" ? "no-chart" : "no-match");
           setView("no-chart");
           setEstimationDone(true);
           return;
         }
         setSizingResult(data);
+        reportSdkEvent("SIZE_RECOMMENDATION_SHOWN", {
+          recommendedSize: data?.recommendedSize,
+          metadata: {
+            confidence: data?.confidence,
+            method,
+            measurementType,
+            found: data?.found
+          }
+        });
         onComplete?.(data);
         const m2 = payload.measurements || {};
         const qe2 = payload.quickEstimate || {};
@@ -35981,26 +36513,49 @@ function PrimeStyleTryonInner({
       } else {
         const errBody = await res.text().catch(() => "");
         console.error("[PS-SDK] Sizing recommend failed:", res.status, errBody);
+        reportSdkEvent("SIZING_FAILED", {
+          metadata: { status: res.status, method, measurementType, source: "sizing-recommend" }
+        });
+        reportSdkClientError({
+          message: errBody || "Sizing request failed",
+          code: "SIZING_RECOMMEND_FAILED",
+          component: "Sizing",
+          view,
+          severity: "medium",
+          metadata: { status: res.status, method, measurementType }
+        });
         setErrorMessage(t2("Unable to get a size suggestion. Please try again."));
         setView("error");
         setEstimationDone(true);
       }
     } catch (err) {
       console.error("[PS-SDK] Sizing recommend network error:", err);
+      reportSdkEvent("SIZING_FAILED", {
+        metadata: { method, measurementType, source: "sizing-recommend", network: true }
+      });
+      reportSdkClientError({
+        message: err instanceof Error ? err.message : "Sizing network error",
+        code: "SIZING_RECOMMEND_NETWORK_ERROR",
+        stack: err instanceof Error ? err.stack : void 0,
+        component: "Sizing",
+        view,
+        severity: "medium",
+        metadata: { method, measurementType }
+      });
       setErrorMessage(t2("Unable to connect to sizing service. Please try again."));
       setView("error");
       setEstimationDone(true);
     } finally {
       setSizingLoading(false);
     }
-  }, [apiUrl, sizingMethod, sizingCountry, heightUnit, weightUnit, sizingUnit, sizeGuide, productContext, measurementType, dynamicFields, persistResultToProfile]);
+  }, [apiUrl, sizingMethod, sizingCountry, heightUnit, weightUnit, sizingUnit, sizeGuide, productContext, measurementType, resolvedProductFitType, dynamicFields, persistResultToProfile, reportSdkClientError, reportSdkEvent, t2, view]);
   const handleQuickEstimate = reactExports.useCallback(async (height, weight, heightUnit2, weightUnit2, gender, age, bodyType, chestProfile, midsectionProfile, hipProfile, bodyImage) => {
     if (!apiRef.current) {
       const msg = t2("SDK not configured. Please refresh and try again.");
       console.warn("[ps-sdk] handleQuickEstimate BAILED — apiRef is null. API key not loaded.");
       setErrorMessage(msg);
       setView("error");
-      onError?.({ message: msg, code: "SDK_NOT_CONFIGURED" });
+      onError?.({ message: msg, code: !apiRef.current ? "SDK_NOT_CONFIGURED" : "PHOTO_MISSING" });
       return;
     }
     getApiUrl(apiUrl);
@@ -36379,6 +36934,13 @@ function PrimeStyleTryonInner({
       const msg = !apiRef.current ? t2("SDK not configured. Please provide an API key.") : t2("Please upload a photo first.");
       setErrorMessage(msg);
       setView("error");
+      reportSdkClientError({
+        message: msg,
+        code: !apiRef.current ? "SDK_NOT_CONFIGURED" : "PHOTO_MISSING",
+        component: "TryOn",
+        view,
+        severity: !apiRef.current ? "high" : "low"
+      });
       onError?.({ message: msg, code: "SDK_NOT_CONFIGURED" });
       return;
     }
@@ -36533,12 +37095,20 @@ function PrimeStyleTryonInner({
         }
       );
       currentTryOnJobIdRef.current = response.jobId;
+      tagSdkClaritySession({
+        productId: effectiveProductId,
+        productTitle: restoredProductTitle || productTitle,
+        productUrl: restoredProductUrl || effectiveProductUrl,
+        view,
+        jobId: response.jobId,
+        source: shouldUseShopifyCartAttribution(apiUrl) ? "shopify-sdk" : "sdk"
+      });
       if (response.modelImageId) modelImageIdRef.current = response.modelImageId;
       onProcessing?.(response.jobId);
       const usePollingOnly = shouldUseShopifyCartAttribution(apiUrl);
-      if (!usePollingOnly && response.streamUrl) {
+      if (!usePollingOnly) {
         sseRef.current?.disconnect();
-        sseRef.current = new SseClient(response.streamUrl);
+        sseRef.current = new SseClient(response.streamUrl || apiRef.current.getStreamUrl(response.jobId));
       }
       unsubRef.current?.();
       unsubRef.current = usePollingOnly ? null : sseRef.current?.onJob(response.jobId, handleVtoUpdate) ?? null;
@@ -36566,11 +37136,19 @@ function PrimeStyleTryonInner({
     } catch (err) {
       const message = err instanceof Error ? err.message : t2("Failed to start try-on");
       const code = err instanceof PrimeStyleError ? err.code : void 0;
+      reportSdkClientError({
+        message,
+        code: code || "TRYON_SUBMIT_FAILED",
+        stack: err instanceof Error ? err.stack : void 0,
+        component: "TryOn",
+        view,
+        severity: "medium"
+      });
       setErrorMessage(message);
       setView("error");
       onError?.({ message, code });
     }
-  }, [selectedFile, productImage, effectiveProductImages, garmentReferenceImage, garmentDetailImage, productTitle, productCategory, productSubcategory, resolvedProductFitType, productType, productTagsList, productDescription, productMaterial, measurementType, sizingResult, sizeGuide, apiUrl, onProcessing, onError, handleVtoUpdate]);
+  }, [selectedFile, productImage, effectiveProductImages, garmentReferenceImage, garmentDetailImage, effectiveProductId, effectiveProductUrl, productTitle, restoredProductTitle, restoredProductUrl, productCategory, productSubcategory, resolvedProductFitType, productType, productTagsList, productDescription, productMaterial, measurementType, sizingResult, sizeGuide, apiUrl, onProcessing, onError, handleVtoUpdate, reportSdkClientError, t2, view]);
   reactExports.useEffect(() => {
     if (view !== "size-result") {
       autoTryOnFiredRef.current = false;
@@ -36662,7 +37240,7 @@ function PrimeStyleTryonInner({
   }, [sizingResult]);
   const handleAddToBag = reactExports.useCallback(async () => {
     if (!onAddToBag || !sizingResult) return;
-    await onAddToBag({
+    const payload = {
       productId,
       productTitle: restoredProductTitle || productTitle,
       productUrl: restoredProductUrl || effectiveProductUrl,
@@ -36671,7 +37249,33 @@ function PrimeStyleTryonInner({
       resultImageUrl: resultImageUrlRef.current || resultImageUrl,
       historyEntryId: currentHistoryEntryIdRef.current ?? void 0,
       selectedSizes: buildAddToBagSelectedSizes()
-    });
+    };
+    try {
+      await onAddToBag(payload);
+      reportSdkEvent("SIZE_RECOMMENDATION_ACCEPTED", {
+        recommendedSize: sizingResult.recommendedSize,
+        metadata: { selectedSizes: payload.selectedSizes }
+      });
+      reportSdkEvent("ADD_TO_CART_FROM_TRYON", {
+        recommendedSize: sizingResult.recommendedSize,
+        metadata: {
+          selectedSizes: payload.selectedSizes,
+          historyEntryId: payload.historyEntryId,
+          hasResult: Boolean(payload.resultImageUrl)
+        }
+      });
+    } catch (error) {
+      reportSdkClientError({
+        message: error instanceof Error ? error.message : "Add to bag failed",
+        code: "ADD_TO_BAG_FAILED",
+        stack: error instanceof Error ? error.stack : void 0,
+        component: "ResultActions",
+        view,
+        severity: "medium",
+        metadata: { selectedSizes: payload.selectedSizes }
+      });
+      throw error;
+    }
   }, [
     buildAddToBagSelectedSizes,
     effectiveProductUrl,
@@ -36681,7 +37285,10 @@ function PrimeStyleTryonInner({
     restoredProductTitle,
     restoredProductUrl,
     resultImageUrl,
-    sizingResult
+    reportSdkClientError,
+    reportSdkEvent,
+    sizingResult,
+    view
   ]);
   const handleTryOnFeedbackSubmit = reactExports.useCallback(async ({ rating, note }) => {
     const profileLoggedIn = Boolean(profileSession);
@@ -37639,7 +38246,7 @@ function PrimeStyleTryonInner({
         return null;
     }
   }
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cx("ps-tryon-root", cn.root || className), style: { visibility: cssReady ? "visible" : "hidden", ...cssVars, ...style }, suppressHydrationWarning: true, "data-ps-tryon": true, children: [
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cx("ps-tryon-root", cn.root || className), style: { visibility: cssReady ? "visible" : "hidden", ...cssVars, ...style }, suppressHydrationWarning: true, "data-ps-tryon": true, "data-clarity-unmask": "true", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "button",
       {
@@ -37653,7 +38260,7 @@ function PrimeStyleTryonInner({
       }
     ),
     view !== "idle" && resolvedPortalContainer && reactDomExports.createPortal(
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cx("ps-tryon-overlay", cn.overlay), style: cssVars, "data-ps-tryon-portal": true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cx(`ps-tryon-modal${view === "result" && resultImageUrl && sizingResult || view === "size-result" || view === "estimation-review" || view === "body-profile" || view === "profiles" || view === "no-chart" || view === "photo-guide" || view === "error" ? " ps-tryon-modal-wide" : ""}`, cn.modal), onClick: (e) => e.stopPropagation(), children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cx("ps-tryon-overlay", cn.overlay), style: cssVars, "data-ps-tryon-portal": true, "data-clarity-unmask": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cx(`ps-tryon-modal${view === "result" && resultImageUrl && sizingResult || view === "size-result" || view === "estimation-review" || view === "body-profile" || view === "profiles" || view === "no-chart" || view === "photo-guide" || view === "error" ? " ps-tryon-modal-wide" : ""}`, cn.modal), onClick: (e) => e.stopPropagation(), "data-clarity-unmask": "true", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cx("ps-tryon-header ps-tryon-header-minimal", cn.header), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "a",
@@ -37811,7 +38418,7 @@ function PrimeStyleTryonInner({
           resolvedPortalContainer
         ),
         view !== "body-profile" && view !== "processing" && !(view === "size-result" && sizeGuide?.sections && Object.keys(sizeGuide.sections).length > 1) && /* @__PURE__ */ jsxRuntimeExports.jsx(Stepper, { view, stepIndex }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: bodyRef, className: cx("ps-tryon-body", cn.body), style: { position: "relative", overflow: drawer ? "hidden" : void 0 }, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: bodyRef, className: cx("ps-tryon-body", cn.body), style: { position: "relative", overflow: drawer ? "hidden" : void 0 }, "data-clarity-unmask": "true", children: [
           showBackButton && /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-tryon-back-btn", onClick: handleBack, children: [
             /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "18", height: "12", viewBox: "0 0 18 12", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "17", y1: "6", x2: "1", y2: "6" }),
@@ -37891,8 +38498,20 @@ class PrimeStyleTryonErrorBoundary extends reactExports.Component {
   }
   componentDidCatch(error) {
     console.error("[ps-sdk] PrimeStyleTryon render failed:", error);
+    const message = error instanceof Error ? error.message : "PrimeStyleTryon render failed";
+    void new ApiClient(getApiKey(), getApiUrl(this.props.apiUrl)).reportClientError({
+      message,
+      code: "RENDER_ERROR",
+      stack: error instanceof Error ? error.stack : void 0,
+      component: "PrimeStyleTryon",
+      productId: this.props.productId || this.props.productImage,
+      productTitle: this.props.productTitle,
+      productUrl: this.props.productUrl,
+      severity: "high"
+    }).catch(() => {
+    });
     this.props.onError?.({
-      message: error instanceof Error ? error.message : "PrimeStyleTryon render failed",
+      message,
       code: "RENDER_ERROR"
     });
   }
@@ -38447,7 +39066,8 @@ function buildPropsFromDataAttrs(data) {
     sizingCountry: data.sizingCountry,
     showPoweredBy: data.showPoweredBy === "true",
     buttonStyles: parseJsonAttr(data.buttonStyles, void 0),
-    modalStyles: parseJsonAttr(data.modalStyles, void 0)
+    modalStyles: parseJsonAttr(data.modalStyles, void 0),
+    clarityProjectId: data.clarityProjectId
   };
   console.log(`${TAG} built props`, props);
   return props;