@primestyleai/tryon 5.9.1 → 5.10.0

package/dist/react/utils/units.d.ts

@@ -4,3 +4,9 @@ export declare function kgToLbs(kg: number): number;
 export declare function lbsToKg(lbs: number): number;
 export declare function ftInToCm(ft: number, inch: number): number;
 export declare function isImperial(locale: string): boolean;
+/**
+ * Human-readable label for a unit token. Used to append a system label to
+ * primary CTAs ("Find My Best Fit (Metric)") so the user knows whether their
+ * values will be interpreted as cm/kg or in/lbs before they submit.
+ */
+export declare function getUnitLabel(unit: string | undefined | null): string;

package/dist/storefront/primestyle-tryon.js

@@ -10080,7 +10080,8 @@ async function recommendForProduct(input) {
     sections: sectionsMap,
     profileId: profile.id,
     fromCache: false,
-    raw: result
+    raw: result,
+    found: result.found
   };
 }
 async function estimateFullMeasurements(args) {
@@ -10139,6 +10140,12 @@ async function estimateFullMeasurements(args) {
 function isImperial(locale) {
   return ["US", "UK", "AU"].includes(locale);
 }
+function getUnitLabel(unit) {
+  if (unit === "in" || unit === "inches" || unit === "lbs") return "Imperial";
+  if (unit === "cm" || unit === "kg") return "Metric";
+  if (unit === "mm") return "mm";
+  return "";
+}
 function cx(base, override) {
   return override ? `${base} ${override}` : base;
 }
@@ -11524,21 +11531,21 @@ const STYLES$1 = `
   /* Shared progress layout used inside StageCycler (desktop) and
      MobileScanningView — row of ring + bar + percent, same tokens. */
   .ps-tryon-progress-wrap {
-    display: flex; align-items: center; gap: 10px;
-    width: 100%; max-width: 320px; margin-top: 16px;
+    display: flex; align-items: center; gap: 12px;
+    width: 100%; max-width: 360px; margin-top: 18px;
   }
   .ps-tryon-progress-wrap .ps-tryon-progress-bar-wrap {
-    flex: 1; height: 4px; border-radius: 3px; overflow: hidden;
+    flex: 1; height: 6px; border-radius: 4px; overflow: hidden;
     position: relative; background: var(--ps-border-color);
   }
   .ps-tryon-progress-wrap .ps-tryon-progress-bar-fill {
     height: 100%; width: 0%;
     background: linear-gradient(90deg, var(--ps-accent), var(--ps-accent-light));
-    border-radius: 3px; transition: width 0.3s ease;
+    border-radius: 4px; transition: width 0.3s ease;
   }
   .ps-tryon-progress-wrap .ps-tryon-progress-pct {
-    font-size: 11px; font-weight: 700; color: var(--ps-accent);
-    min-width: 30px; text-align: right;
+    font-size: 13px; font-weight: 700; color: var(--ps-accent);
+    min-width: 36px; text-align: right;
     font-variant-numeric: tabular-nums;
   }
   .ps-tryon-progress-bar-wrap {
@@ -11566,25 +11573,25 @@ const STYLES$1 = `
     font-variant-numeric: tabular-nums;
   }
 
-  /* Circular ETA ring — 48×48 px SVG with a track + progress circle; ETA
+  /* Circular ETA ring — 64×64 px SVG with a track + progress circle; ETA
      text centered. strokeDashoffset is driven by the ticker in
      PrimeStyleTryonInner, so CSS only styles the appearance. */
   .ps-tryon-progress-ring {
-    position: relative; width: 48px; height: 48px; flex: 0 0 48px;
+    position: relative; width: 64px; height: 64px; flex: 0 0 64px;
     display: flex; align-items: center; justify-content: center;
   }
   .ps-tryon-progress-ring svg { transform: rotate(-90deg); }
   .ps-tryon-progress-ring-track {
-    fill: none; stroke: var(--ps-border-color); stroke-width: 3.5;
+    fill: none; stroke: var(--ps-border-color); stroke-width: 5;
   }
   .ps-tryon-progress-ring-fill {
-    fill: none; stroke: var(--ps-accent); stroke-width: 3.5;
+    fill: none; stroke: var(--ps-accent); stroke-width: 5;
     stroke-linecap: round;
     transition: stroke-dashoffset 0.3s ease;
   }
   .ps-tryon-progress-eta {
     position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
-    font-size: 10px; font-weight: 700; color: var(--ps-accent);
+    font-size: 13px; font-weight: 700; color: var(--ps-accent);
     font-variant-numeric: tabular-nums; letter-spacing: 0.01em;
     pointer-events: none;
   }
@@ -16671,6 +16678,92 @@ function ProfileDetailModal({
     document.body
   );
 }
+function ConfirmMeasurementsModal({
+  profile,
+  onProceed,
+  onEdit,
+  t: t2
+}) {
+  const heightUnit = profile.heightUnit === "in" || profile.heightUnit === "ft" ? "in" : "cm";
+  const weightUnit = profile.weightUnit === "lbs" ? "lbs" : "kg";
+  const systemLabel = getUnitLabel(heightUnit);
+  const formatHeight = (h) => {
+    if (!h) return "—";
+    if (heightUnit === "in") {
+      const ft = Math.floor(h / 12);
+      const inches = Math.round(h % 12);
+      return `${ft}'${inches}"`;
+    }
+    return `${Math.round(h)} cm`;
+  };
+  const formatWeight = (w2) => {
+    if (!w2) return "—";
+    return `${Math.round(w2)} ${weightUnit}`;
+  };
+  const height = profile.height ?? profile.heightCm;
+  const weight = profile.weight ?? profile.weightKg;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-confirm-overlay", onClick: onEdit, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-confirm-modal", onClick: (e) => e.stopPropagation(), children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "button",
+      {
+        type: "button",
+        "aria-label": t2("Close"),
+        onClick: onEdit,
+        style: {
+          position: "absolute",
+          top: "0.75vw",
+          right: "0.75vw",
+          width: "1.8vw",
+          height: "1.8vw",
+          borderRadius: "50%",
+          background: "transparent",
+          border: "none",
+          cursor: "pointer",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          color: "var(--ps-text-muted)"
+        },
+        children: /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "16", height: "16", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { style: { fontWeight: 700, marginBottom: "0.4vw" }, children: t2("Confirm your measurements") }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("small", { style: { color: "var(--ps-text-muted)" }, children: systemLabel ? t2("You chose") + " " + systemLabel + ". " + t2("Review before continuing.") : t2("Review before continuing.") }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("ul", { style: {
+      listStyle: "none",
+      padding: 0,
+      margin: "0.8vw 0 0.2vw 0",
+      width: "100%",
+      textAlign: "left",
+      fontSize: "0.78vw",
+      lineHeight: 1.6
+    }, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { style: { display: "flex", justifyContent: "space-between", gap: "1vw" }, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "var(--ps-text-muted)" }, children: t2("Height") }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontWeight: 600 }, children: formatHeight(height) })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { style: { display: "flex", justifyContent: "space-between", gap: "1vw" }, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "var(--ps-text-muted)" }, children: t2("Weight") }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontWeight: 600 }, children: formatWeight(weight) })
+      ] }),
+      profile.age ? /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { style: { display: "flex", justifyContent: "space-between", gap: "1vw" }, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "var(--ps-text-muted)" }, children: t2("Age") }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontWeight: 600 }, children: profile.age })
+      ] }) : null,
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { style: { display: "flex", justifyContent: "space-between", gap: "1vw" }, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "var(--ps-text-muted)" }, children: t2("Gender") }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontWeight: 600 }, children: profile.gender === "female" ? t2("Female") : t2("Male") })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-confirm-actions", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("button", { type: "button", className: "ps-confirm-cancel", onClick: onEdit, children: t2("Edit") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("button", { type: "button", className: "ps-confirm-delete", onClick: onProceed, children: t2("Proceed") })
+    ] })
+  ] }) });
+}
 function WelcomeView({
   productImage,
   setView,
@@ -16907,7 +17000,7 @@ function MobileSkeleton({ landmarks, w: w2, h }) {
   );
 }
 const MSC_TRYON_TARGET_SECONDS = 22;
-const MSC_RING_RADIUS = 20;
+const MSC_RING_RADIUS = 27;
 const MSC_RING_CIRC = 2 * Math.PI * MSC_RING_RADIUS;
 function MscTryOnProgress({ t: t2 }) {
   const startRef = reactExports.useRef(Date.now());
@@ -16930,17 +17023,17 @@ function MscTryOnProgress({ t: t2 }) {
       }
     }, 200);
     return () => clearInterval(id2);
-  }, [t2]);
+  }, []);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-progress-wrap", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-progress-ring", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "48", height: "48", viewBox: "0 0 48 48", "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "24", cy: "24", r: MSC_RING_RADIUS, className: "ps-tryon-progress-ring-track" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "64", height: "64", viewBox: "0 0 64 64", "aria-hidden": "true", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "32", cy: "32", r: MSC_RING_RADIUS, className: "ps-tryon-progress-ring-track" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           "circle",
           {
             ref: ringRef,
-            cx: "24",
-            cy: "24",
+            cx: "32",
+            cy: "32",
             r: MSC_RING_RADIUS,
             className: "ps-tryon-progress-ring-fill",
             strokeDasharray: MSC_RING_CIRC,
@@ -16989,11 +17082,12 @@ function MobileScanningView({
   };
   const [stageIdx, setStageIdx] = reactExports.useState(0);
   reactExports.useEffect(() => {
+    const intervalMs = tryOnProcessing ? 2200 : 1500;
     const id2 = setInterval(() => {
       setStageIdx((i) => (i + 1) % stages.length);
-    }, 1500);
+    }, intervalMs);
     return () => clearInterval(id2);
-  }, [stages.length]);
+  }, [stages.length, tryOnProcessing]);
   reactExports.useEffect(() => {
     if (isPhotoMode && bodyLandmarks && stageIdx === 0) {
       setStageIdx(1);
@@ -17150,7 +17244,7 @@ function MultiSectionMobile({
       /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-msr-sections", children: sectionEntries.map(({ name, secResult }) => {
         const cleanName = name.replace(/\s*[—–-]\s*.*/g, "");
         const sec = secResult;
-        const sizeValue = sec.size || secResult.recommendedSize;
+        const sizeValue = sec.found === false ? t2("No fit") : sec.size || secResult.recommendedSize;
         return /* @__PURE__ */ jsxRuntimeExports.jsxs(
           "button",
           {
@@ -17185,7 +17279,19 @@ function MultiSectionMobile({
           children: t2("Continue Shopping")
         }
       )
-    ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    ] }) : sizingResult?.found === false ? (
+      // Backend couldn't find a size that fits — Try-On is meaningless
+      // without a recommendation, so surface a clear terminal action.
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "button",
+        {
+          type: "button",
+          className: "ps-msr-tryon-cta",
+          onClick: onClose,
+          children: t2("Continue Shopping")
+        }
+      )
+    ) : /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "button",
       {
         type: "button",
@@ -17218,7 +17324,7 @@ const SKELETON_CONNECTIONS = [
   ["rightKnee", "rightAnkle"]
 ];
 const TRYON_TARGET_SECONDS = 22;
-const TRYON_RING_RADIUS = 20;
+const TRYON_RING_RADIUS = 27;
 const TRYON_RING_CIRC = 2 * Math.PI * TRYON_RING_RADIUS;
 function TryOnProgress({ t: t2, isActive }) {
   const startRef = reactExports.useRef(null);
@@ -17248,18 +17354,18 @@ function TryOnProgress({ t: t2, isActive }) {
       }
     }, 200);
     return () => clearInterval(id2);
-  }, [isActive, t2]);
+  }, [isActive]);
   if (!isActive) return null;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-progress-wrap", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-progress-ring", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "48", height: "48", viewBox: "0 0 48 48", "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "24", cy: "24", r: TRYON_RING_RADIUS, className: "ps-tryon-progress-ring-track" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "64", height: "64", viewBox: "0 0 64 64", "aria-hidden": "true", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "32", cy: "32", r: TRYON_RING_RADIUS, className: "ps-tryon-progress-ring-track" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           "circle",
           {
             ref: ringRef,
-            cx: "24",
-            cy: "24",
+            cx: "32",
+            cy: "32",
             r: TRYON_RING_RADIUS,
             className: "ps-tryon-progress-ring-fill",
             strokeDasharray: TRYON_RING_CIRC,
@@ -17410,11 +17516,12 @@ function StageCycler({
   }, [tryOnProcessing]);
   reactExports.useEffect(() => {
     if (isDone) return;
+    const intervalMs = tryOnProcessing ? 2200 : 900;
     const id2 = setInterval(() => {
       setIdx((i) => Math.min(i + 1, active.length - 1));
-    }, 900);
+    }, intervalMs);
     return () => clearInterval(id2);
-  }, [isDone, active.length]);
+  }, [isDone, active.length, tryOnProcessing]);
   const current = active[idx] ?? active[0];
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-msc-stage", style: { alignSelf: "center", marginTop: "auto", marginBottom: "auto" }, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-msc-stage-slot", children: [
@@ -17661,7 +17768,8 @@ function SectionDetailView({
   backLabel,
   internationalSizes,
   continueLabel,
-  renderRaw = false
+  renderRaw = false,
+  sectionFound
 }) {
   const recSize = sectionResult?.recommendedSize || "";
   const [selectedSize, setSelectedSize] = reactExports.useState(null);
@@ -17706,7 +17814,8 @@ function SectionDetailView({
     const hasBadFit = details.some((d) => BAD_FIT.test(d.fit || ""));
     return hasBadFit ? t2("Not Recommended") : t2("Your Selection");
   }, [isRecommended, sectionResult, t2]);
-  const displaySizeLabel = selectedCountry && isRecommended && internationalSizes && internationalSizes[selectedCountry] ? internationalSizes[selectedCountry] : displaySize;
+  const noFitMessage = t2("We couldn't find a size that fits for this product");
+  const displaySizeLabel = sectionFound === false ? noFitMessage : selectedCountry && isRecommended && internationalSizes && internationalSizes[selectedCountry] ? internationalSizes[selectedCountry] : displaySize;
   const columnUnits = reactExports.useMemo(() => {
     const units = [];
     for (let i = 0; i < section.headers.length; i++) {
@@ -18560,6 +18669,7 @@ function SizeResultView({
   const allDone = hasPhoto ? sizingDone && tryOnDone : sizingDone;
   const isMobile = useIsMobile();
   const isAccessory = measurementType === "face" || measurementType === "head";
+  const noFit = sizingResult?.found === false;
   const vtoExcluded = measurementType === "foot";
   console.log("[PS-SDK] SizeResultView render:", {
     hasPhoto,
@@ -18644,6 +18754,7 @@ function SizeResultView({
                 sectionName: entry.name,
                 section: entry.section,
                 sectionResult: entry.secResult,
+                sectionFound: entry.secResult?.found,
                 userMeasurements: entry.userMeasurements,
                 unitLbl,
                 chartUnit: resultUnit,
@@ -18693,6 +18804,7 @@ function SizeResultView({
                 sectionName: entry.name,
                 section: entry.section,
                 sectionResult: entry.secResult,
+                sectionFound: entry.secResult?.found,
                 userMeasurements: entry.userMeasurements,
                 unitLbl,
                 chartUnit: resultUnit,
@@ -18814,7 +18926,7 @@ function SizeResultView({
               return /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: `ps-tryon-sr-card-v2${isLast ? " ps-full" : ""}`, onClick: () => setActiveSection(name), style: { animationDelay: `${idx * 0.07}s` }, children: [
                 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-sr-card-v2-text", children: [
                   /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-sr-card-v2-label", children: name.replace(/\s*[—–-]\s*.*/g, "") }),
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-sr-card-v2-value", children: sec.size || secResult.recommendedSize }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-sr-card-v2-value", children: sec.found === false ? t2("No fit") : sec.size || secResult.recommendedSize }),
                   /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-sr-card-v2-rec", children: t2("recommended") })
                 ] }),
                 sectionImg && /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: sectionImg, alt: name, className: "ps-tryon-sr-card-v2-img" }),
@@ -18838,7 +18950,7 @@ function SizeResultView({
                     " →"
                   ]
                 }
-              ) : vtoExcluded ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              ) : vtoExcluded || noFit ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
                 "button",
                 {
                   className: "ps-tryon-v2-cta",
@@ -18891,6 +19003,7 @@ function SizeResultView({
                 sectionName,
                 section: singleSection,
                 sectionResult: singleResult,
+                sectionFound: sizingResult?.found,
                 userMeasurements: singleUserMeasurements,
                 unitLbl,
                 chartUnit: resultUnit,
@@ -18898,7 +19011,7 @@ function SizeResultView({
                 onBack: resultImageUrl ? onClose || (() => setView("body-profile")) : () => setView("body-profile"),
                 backLabel: t2("Back"),
                 internationalSizes: sizingResult?.internationalSizes,
-                onTryOn: resultImageUrl || vtoExcluded ? void 0 : handleSingleTryOn,
+                onTryOn: resultImageUrl || vtoExcluded || noFit ? void 0 : handleSingleTryOn,
                 continueLabel: resultImageUrl ? t2("Continue Shopping") : void 0,
                 tryOnProcessing,
                 productImage: resultImageUrl || productImage,
@@ -18938,6 +19051,7 @@ function SizeResultView({
                 sectionName,
                 section: singleSection,
                 sectionResult: singleResult,
+                sectionFound: sizingResult?.found,
                 userMeasurements: singleUserMeasurements,
                 unitLbl,
                 chartUnit: resultUnit,
@@ -18945,7 +19059,7 @@ function SizeResultView({
                 onBack: resultImageUrl ? onClose || (() => setView("body-profile")) : () => setView("body-profile"),
                 backLabel: t2("Back"),
                 internationalSizes: sizingResult?.internationalSizes,
-                onTryOn: resultImageUrl || vtoExcluded ? void 0 : handleSingleTryOn,
+                onTryOn: resultImageUrl || vtoExcluded || noFit ? void 0 : handleSingleTryOn,
                 continueLabel: resultImageUrl ? t2("Continue Shopping") : void 0,
                 tryOnProcessing,
                 t: t2,
@@ -19321,7 +19435,7 @@ function UploadView({
     }
   ) });
 }
-const RING_RADIUS = 20;
+const RING_RADIUS = 27;
 const RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS;
 function ProcessingView({
   previewUrl,
@@ -19366,12 +19480,12 @@ function ProcessingView({
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-progress-section", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-progress-ring", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 48 48", width: "48", height: "48", "aria-hidden": "true", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 64 64", width: "64", height: "64", "aria-hidden": "true", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(
             "circle",
             {
-              cx: "24",
-              cy: "24",
+              cx: "32",
+              cy: "32",
               r: RING_RADIUS,
               className: "ps-tryon-progress-ring-track"
             }
@@ -19380,8 +19494,8 @@ function ProcessingView({
             "circle",
             {
               ref: ringCb,
-              cx: "24",
-              cy: "24",
+              cx: "32",
+              cy: "32",
               r: RING_RADIUS,
               className: "ps-tryon-progress-ring-fill",
               strokeDasharray: RING_CIRCUMFERENCE,
@@ -21951,7 +22065,7 @@ function BodyProfileView({
               hidePhotoOptions: hasActiveProfileWithMeasurements,
               onNext: hasActiveProfileWithMeasurements && onUseActiveProfile ? onUseActiveProfile : handleNext,
               canProceed: true,
-              fastPathLabel: hasActiveProfileWithMeasurements ? t2("Find My Best Fit") : void 0,
+              fastPathLabel: hasActiveProfileWithMeasurements ? t2("Find My Best Fit") + (getUnitLabel(hUnit) ? ` (${getUnitLabel(hUnit)})` : "") : void 0,
               activeProfileName: hasActiveProfileWithMeasurements ? activeProfileName : null,
               onStartFresh,
               error,
@@ -22206,7 +22320,8 @@ function BodyProfileView({
       !(isMobile && step === "basics") && (() => {
         const useProfileFast = step === "basics" && hasActiveProfileWithMeasurements && !!onUseActiveProfile;
         const handleClick = useProfileFast ? onUseActiveProfile : handleNext;
-        const label = useProfileFast ? t2("Find My Best Fit") : isLastStep ? t2("Find My Size") : t2("Next");
+        const unitSuffix = getUnitLabel(hUnit) ? ` (${getUnitLabel(hUnit)})` : "";
+        const label = useProfileFast ? t2("Find My Best Fit") + unitSuffix : isLastStep ? t2("Find My Size") + unitSuffix : t2("Next");
         return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-bp-nav", children: [
           step !== "basics" ? /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-bp-back-btn", onClick: handleBackStep, type: "button", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-bp-back-arrow", children: "←" }),
@@ -22396,6 +22511,7 @@ function AccessorySizeView({
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-bpm-bottom", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { type: "button", className: "ps-bpm-next-btn", onClick: handleManualSubmit, children: [
           t2("Find My Size"),
+          getUnitLabel(sizingUnit) ? ` (${getUnitLabel(sizingUnit)})` : "",
           " ",
           /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowRightIcon, {})
         ] }),
@@ -22730,6 +22846,7 @@ function AccessorySizeView({
           /* @__PURE__ */ jsxRuntimeExports.jsx("div", {}),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-bp-next-btn", onClick: handleManualSubmit, type: "button", children: [
             t2("Find My Size"),
+            getUnitLabel(sizingUnit) ? ` (${getUnitLabel(sizingUnit)})` : "",
             " ",
             /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowRightIcon, {})
           ] })
@@ -22963,6 +23080,9 @@ function PrimeStyleTryonInner({
   const [sizingUnit, setSizingUnit] = reactExports.useState(imperial ? "in" : "cm");
   const [heightUnit, setHeightUnit] = reactExports.useState(imperial ? "in" : "cm");
   const [weightUnit, setWeightUnit] = reactExports.useState(imperial ? "lbs" : "kg");
+  reactExports.useEffect(() => {
+    if (detectMeasurementType(productTitle) === "foot") setSizingUnit("cm");
+  }, [productTitle]);
   const formRef = reactExports.useRef({});
   const [formGender, setFormGender] = reactExports.useState("male");
   const [formKey, setFormKey] = reactExports.useState(0);
@@ -23037,7 +23157,7 @@ function PrimeStyleTryonInner({
         { at: 75, text: t2("Refining details...") },
         { at: 90, text: t2("Almost there...") }
       ];
-      const RING_CIRCUMFERENCE2 = 2 * Math.PI * 20;
+      const RING_CIRCUMFERENCE2 = 2 * Math.PI * 27;
       progressIntervalRef.current = setInterval(() => {
         if (completedRef.current) return;
         const startTs = progressStartTsRef.current || Date.now();
@@ -23215,13 +23335,10 @@ function PrimeStyleTryonInner({
     [activeProfileId, profiles, apiUrl, productImage, productTitle, effectiveProductId, setActiveProfileId$1]
   );
   const snapSubmitRef = reactExports.useRef(null);
-  const handleUseActiveProfile = reactExports.useCallback(async () => {
-    const p2 = profiles.find((x2) => x2.id === activeProfileId);
-    if (!p2) return;
+  const [confirmProfile, setConfirmProfile] = reactExports.useState(null);
+  const runRecommendWithProfile = reactExports.useCallback(async (p2) => {
     const profileHeight = p2.height ?? p2.heightCm ?? 0;
     const profileWeight = p2.weight ?? p2.weightKg ?? 0;
-    const hasIdentity = profileHeight > 0 && profileWeight > 0;
-    if (!hasIdentity) return;
     const hasStored = !!p2.measurements && Object.keys(p2.measurements).length > 0;
     const storedPhoto = p2.photoBase64;
     if (!hasStored && storedPhoto && profileHeight > 0 && snapSubmitRef.current) {
@@ -23245,9 +23362,8 @@ function PrimeStyleTryonInner({
     }
     setSizingResult(null);
     setSizingLoading(true);
-    const hasStoredMeasurements = !!p2.measurements && Object.keys(p2.measurements).length > 0;
-    setEstimationDone(hasStoredMeasurements);
-    if (hasStoredMeasurements) {
+    setEstimationDone(hasStored);
+    if (hasStored) {
       setPreviewUrl(null);
       setBodyLandmarks(null);
     }
@@ -23280,7 +23396,27 @@ function PrimeStyleTryonInner({
       setEstimationDone(true);
     }).catch(() => {
     }).finally(() => setSizingLoading(false));
-  }, [profiles, activeProfileId, effectiveProductId, productTitle, productImage, sizeGuideData, apiUrl]);
+  }, [effectiveProductId, productTitle, productImage, sizeGuideData, apiUrl, previewUrl]);
+  const handleUseActiveProfile = reactExports.useCallback(async () => {
+    const p2 = profiles.find((x2) => x2.id === activeProfileId);
+    if (!p2) return;
+    const profileHeight = p2.height ?? p2.heightCm ?? 0;
+    const profileWeight = p2.weight ?? p2.weightKg ?? 0;
+    const hasIdentity = profileHeight > 0 && profileWeight > 0;
+    if (!hasIdentity) return;
+    setConfirmProfile(p2);
+  }, [profiles, activeProfileId]);
+  const proceedFromConfirmProfile = reactExports.useCallback(() => {
+    if (!confirmProfile) return;
+    const p2 = confirmProfile;
+    setConfirmProfile(null);
+    void runRecommendWithProfile(p2);
+  }, [confirmProfile, runRecommendWithProfile]);
+  const cancelFromConfirmProfile = reactExports.useCallback(() => {
+    setConfirmProfile(null);
+    setFormKey((k2) => k2 + 1);
+    setView("body-profile");
+  }, []);
   const applyProfileRef = reactExports.useRef(() => {
   });
   const handleOpen = reactExports.useCallback(() => {
@@ -24655,6 +24791,15 @@ function PrimeStyleTryonInner({
             onCancel: () => setDeleteConfirmId(null),
             t: t2
           }
+        ),
+        confirmProfile && /* @__PURE__ */ jsxRuntimeExports.jsx(
+          ConfirmMeasurementsModal,
+          {
+            profile: confirmProfile,
+            onProceed: proceedFromConfirmProfile,
+            onEdit: cancelFromConfirmProfile,
+            t: t2
+          }
         )
       ] }) }),
       document.body

package/dist/types.d.ts

@@ -198,6 +198,8 @@ export interface MatchDetail {
 export interface SectionRecommendation {
     recommendedSize: string;
     matchDetails: MatchDetail[];
+    /** True when the user's measurements fit inside this section's chart. */
+    found?: boolean;
 }
 /** Full sizing recommendation result */
 export interface SizingResult {
@@ -213,6 +215,11 @@ export interface SizingResult {
     sections?: Record<string, SectionRecommendation>;
     /** Unit the matchDetails values (and chart columns used for matching) are in. */
     unit?: "cm" | "in";
+    /** True when the backend found a size whose measurements actually fit the
+     *  user. False when the user's body is outside every row in the chart —
+     *  the SDK renders a "no size" message and disables Try-On. Optional for
+     *  backwards compatibility with older backends (treat `undefined` as true). */
+    found?: boolean;
 }
 /** Fit info for a body area — tells Gemini how the garment should render at this region */
 export interface FitAreaInfo {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primestyleai/tryon",
-  "version": "5.9.1",
+  "version": "5.10.0",
   "description": "PrimeStyle Virtual Try-On SDK — React component & Web Component",
   "type": "module",
   "main": "dist/primestyle-tryon.js",