@primestyleai/tryon 5.8.15 → 5.8.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/react/index.js +89 -39
  2. package/dist/react/views/SizeResultView.d.ts +1 -1
  3. package/dist/storefront/primestyle-tryon.js +89 -39
  4. package/package.json +1 -1
package/dist/react/index.js CHANGED
@@ -198,24 +198,6 @@ const FALLBACK_FIELDS_MALE = [
198
198
  { key: "inseam", label: "Inseam", required: false, unit: "cm", placeholder: "e.g. 81", category: "body" },
199
199
  { key: "footLengthCm", label: "Foot length", required: false, unit: "cm", placeholder: "e.g. 27", category: "shoe" }
200
200
  ];
201
- const SIZE_CONVERSIONS = {
202
- "XXS": { US: "XXS", UK: "4", EU: "30", IT: "36", FR: "32", DE: "30", JP: "3", KR: "40", AU: "4", BR: "PP" },
203
- "XS": { US: "XS", UK: "6", EU: "32", IT: "38", FR: "34", DE: "32", JP: "5", KR: "44", AU: "6", BR: "PP" },
204
- "S": { US: "S", UK: "8", EU: "36", IT: "42", FR: "38", DE: "36", JP: "9", KR: "55", AU: "10", BR: "P" },
205
- "M": { US: "M", UK: "10", EU: "38", IT: "44", FR: "40", DE: "38", JP: "11", KR: "66", AU: "12", BR: "M" },
206
- "L": { US: "L", UK: "12", EU: "40", IT: "46", FR: "42", DE: "40", JP: "13", KR: "77", AU: "14", BR: "G" },
207
- "XL": { US: "XL", UK: "14", EU: "42", IT: "48", FR: "44", DE: "42", JP: "15", KR: "88", AU: "16", BR: "GG" },
208
- "XXL": { US: "XXL", UK: "16", EU: "44", IT: "50", FR: "46", DE: "44", JP: "17", KR: "99", AU: "18", BR: "XG" },
209
- "XXXL": { US: "XXXL", UK: "18", EU: "46", IT: "52", FR: "48", DE: "46", JP: "19", KR: "100", AU: "20", BR: "EG" },
210
- // Numeric sizes (EU-based)
211
- "34": { US: "XS", UK: "6", EU: "34", IT: "38", FR: "34", DE: "34", JP: "5", KR: "44", AU: "6" },
212
- "36": { US: "S", UK: "8", EU: "36", IT: "40", FR: "36", DE: "36", JP: "7", KR: "55", AU: "8" },
213
- "38": { US: "M", UK: "10", EU: "38", IT: "42", FR: "38", DE: "38", JP: "9", KR: "66", AU: "10" },
214
- "40": { US: "L", UK: "12", EU: "40", IT: "44", FR: "40", DE: "40", JP: "11", KR: "77", AU: "12" },
215
- "42": { US: "XL", UK: "14", EU: "42", IT: "46", FR: "42", DE: "42", JP: "13", KR: "88", AU: "14" },
216
- "44": { US: "XXL", UK: "16", EU: "44", IT: "48", FR: "44", DE: "44", JP: "15", KR: "99", AU: "16" },
217
- "46": { US: "XXXL", UK: "18", EU: "46", IT: "50", FR: "46", DE: "46", JP: "17", KR: "100", AU: "18" }
218
- };
219
201
  const TOTAL_STEPS = 3;
220
202
  const LS_PREFIX = "primestyle_";
221
203
  const PROFILES_KEY = "profiles";
@@ -6803,10 +6785,13 @@ function SectionDetailView({
6803
6785
  onImageLoad,
6804
6786
  onTryOn,
6805
6787
  tryOnProcessing,
6806
- backLabel
6788
+ backLabel,
6789
+ internationalSizes
6807
6790
  }) {
6808
6791
  const recSize = sectionResult?.recommendedSize || "";
6809
6792
  const [selectedSize, setSelectedSize] = useState(null);
6793
+ const countryOptions = internationalSizes ? Object.keys(internationalSizes) : [];
6794
+ const [selectedCountry, setSelectedCountry] = useState(null);
6810
6795
  const recLength = lengthEntry?.secResult?.recommendedSize || "";
6811
6796
  const [selectedLength, setSelectedLength] = useState(null);
6812
6797
  const lengthSizes = useMemo(() => {
@@ -6834,6 +6819,7 @@ function SectionDetailView({
6834
6819
  }, [section, sizeColIdx, sizeHeader]);
6835
6820
  const displaySize = selectedSize || recSize;
6836
6821
  const isRecommended = displaySize === recSize;
6822
+ const displaySizeLabel = selectedCountry && isRecommended && internationalSizes && internationalSizes[selectedCountry] ? internationalSizes[selectedCountry] : displaySize;
6837
6823
  const columnUnits = useMemo(() => {
6838
6824
  const units = [];
6839
6825
  for (let i = 0; i < section.headers.length; i++) {
@@ -7063,10 +7049,41 @@ function SectionDetailView({
7063
7049
  )
7064
7050
  ] }),
7065
7051
  /* @__PURE__ */ jsxs("div", { className: "ps-msd-card", children: [
7066
- /* @__PURE__ */ jsx("span", { className: "ps-msd-card-eyebrow", children: displaySize === backendSize ? t("RECOMMENDED SIZE") : t("TRYING SIZE") }),
7052
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: "10px" }, children: [
7053
+ /* @__PURE__ */ jsx("span", { className: "ps-msd-card-eyebrow", children: displaySize === backendSize ? t("RECOMMENDED SIZE") : t("TRYING SIZE") }),
7054
+ countryOptions.length > 0 && isRecommended && /* @__PURE__ */ jsxs(
7055
+ "select",
7056
+ {
7057
+ value: selectedCountry || "",
7058
+ onChange: (e) => setSelectedCountry(e.target.value || null),
7059
+ style: {
7060
+ fontSize: "11px",
7061
+ fontWeight: 600,
7062
+ fontFamily: "inherit",
7063
+ color: "var(--ps-text-secondary)",
7064
+ background: "white",
7065
+ border: "1px solid rgba(0,0,0,0.12)",
7066
+ borderRadius: "6px",
7067
+ padding: "4px 8px",
7068
+ cursor: "pointer",
7069
+ outline: "none"
7070
+ },
7071
+ "aria-label": t("Display size in country"),
7072
+ children: [
7073
+ /* @__PURE__ */ jsx("option", { value: "", children: t("Standard") }),
7074
+ countryOptions.map((c) => /* @__PURE__ */ jsx("option", { value: c, children: c }, c))
7075
+ ]
7076
+ }
7077
+ )
7078
+ ] }),
7067
7079
  /* @__PURE__ */ jsxs("div", { className: "ps-msd-card-size-row", children: [
7068
- /* @__PURE__ */ jsx("span", { className: "ps-msd-card-size", children: displaySize }),
7069
- finalDisplayLength && /* @__PURE__ */ jsx("span", { className: "ps-msd-card-size-meta", children: finalDisplayLength })
7080
+ /* @__PURE__ */ jsx("span", { className: "ps-msd-card-size", children: displaySizeLabel }),
7081
+ finalDisplayLength && /* @__PURE__ */ jsx("span", { className: "ps-msd-card-size-meta", children: finalDisplayLength }),
7082
+ selectedCountry && isRecommended && /* @__PURE__ */ jsxs("span", { className: "ps-msd-card-size-meta", style: { fontSize: "11px", opacity: 0.7 }, children: [
7083
+ "(",
7084
+ selectedCountry,
7085
+ ")"
7086
+ ] })
7070
7087
  ] }),
7071
7088
  /* @__PURE__ */ jsx("div", { className: "ps-msd-card-divider" }),
7072
7089
  /* @__PURE__ */ jsx("span", { className: "ps-msd-card-eyebrow", children: t("FIT ACCURACY") }),
@@ -7162,10 +7179,41 @@ function SectionDetailView({
7162
7179
  }
7163
7180
  return /* @__PURE__ */ jsxs("div", { className: "ps-tryon-sec-detail", style: { padding: "1.5vw", display: "flex", flexDirection: "column", height: "100%", background: "#F8F9FA" }, children: [
7164
7181
  /* @__PURE__ */ jsxs("div", { style: { flex: 1 }, children: [
7165
- /* @__PURE__ */ jsx("span", { style: { fontSize: "0.75vw", fontWeight: 700, color: "var(--ps-accent)", textTransform: "uppercase", letterSpacing: "0.12em" }, children: isRecommended ? t("Recommended Size") : t("Not Recommended") }),
7182
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: "0.5vw" }, children: [
7183
+ /* @__PURE__ */ jsx("span", { style: { fontSize: "0.75vw", fontWeight: 700, color: "var(--ps-accent)", textTransform: "uppercase", letterSpacing: "0.12em" }, children: isRecommended ? t("Recommended Size") : t("Not Recommended") }),
7184
+ countryOptions.length > 0 && isRecommended && /* @__PURE__ */ jsxs(
7185
+ "select",
7186
+ {
7187
+ value: selectedCountry || "",
7188
+ onChange: (e) => setSelectedCountry(e.target.value || null),
7189
+ style: {
7190
+ fontSize: "0.7vw",
7191
+ fontWeight: 600,
7192
+ fontFamily: "inherit",
7193
+ color: "var(--ps-text-secondary)",
7194
+ background: "white",
7195
+ border: "1px solid rgba(0,0,0,0.12)",
7196
+ borderRadius: "0.35vw",
7197
+ padding: "0.25vw 0.6vw",
7198
+ cursor: "pointer",
7199
+ outline: "none"
7200
+ },
7201
+ "aria-label": t("Display size in country"),
7202
+ children: [
7203
+ /* @__PURE__ */ jsx("option", { value: "", children: t("Standard") }),
7204
+ countryOptions.map((c) => /* @__PURE__ */ jsx("option", { value: c, children: c }, c))
7205
+ ]
7206
+ }
7207
+ )
7208
+ ] }),
7166
7209
  /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "baseline", gap: "0.5vw", marginTop: "0.3vw", marginBottom: "0.4vw" }, children: [
7167
- /* @__PURE__ */ jsx("span", { style: { fontSize: "3.5vw", fontWeight: 300, color: "var(--ps-text-primary)", lineHeight: 1, letterSpacing: "-0.02em" }, children: displaySize }),
7168
- finalDisplayLength && /* @__PURE__ */ jsx("span", { style: { fontSize: "1.4vw", fontWeight: 400, color: "var(--ps-text-secondary)" }, children: finalDisplayLength })
7210
+ /* @__PURE__ */ jsx("span", { style: { fontSize: "3.5vw", fontWeight: 300, color: "var(--ps-text-primary)", lineHeight: 1, letterSpacing: "-0.02em" }, children: displaySizeLabel }),
7211
+ finalDisplayLength && /* @__PURE__ */ jsx("span", { style: { fontSize: "1.4vw", fontWeight: 400, color: "var(--ps-text-secondary)" }, children: finalDisplayLength }),
7212
+ selectedCountry && isRecommended && /* @__PURE__ */ jsxs("span", { style: { fontSize: "0.7vw", color: "var(--ps-text-muted)", marginLeft: "0.3vw" }, children: [
7213
+ "(",
7214
+ selectedCountry,
7215
+ ")"
7216
+ ] })
7169
7217
  ] }),
7170
7218
  /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.4vw", marginBottom: "1.2vw" }, children: [
7171
7219
  /* @__PURE__ */ jsxs("svg", { width: "1vw", height: "1vw", viewBox: "0 0 16 16", fill: "none", children: [
@@ -7445,13 +7493,9 @@ function SizeResultView({
7445
7493
  return { range: val, ...parsed };
7446
7494
  }, [sizeGuide, sizeColIdx, sizeHeader, unitLbl, cellVal, pRange, sizeGuideColumnUnits]);
7447
7495
  const origSize = sizingResult?.recommendedSize || "";
7448
- const activeSize = origSize;
7449
7496
  useMemo(() => {
7450
- const backendIntl = sizingResult?.internationalSizes || {};
7451
- const upper = activeSize.toUpperCase().trim();
7452
- const fromTable = SIZE_CONVERSIONS[upper] || SIZE_CONVERSIONS[activeSize] || {};
7453
- return { ...fromTable, ...backendIntl };
7454
- }, [sizingResult, activeSize]);
7497
+ return sizingResult?.internationalSizes || {};
7498
+ }, [sizingResult]);
7455
7499
  const [resultTab, setResultTab] = useState("fit");
7456
7500
  const [selectedSize, setSelectedSize] = useState(null);
7457
7501
  const [showFullChart, setShowFullChart] = useState(false);
@@ -7671,6 +7715,7 @@ function SizeResultView({
7671
7715
  unitLbl,
7672
7716
  lengthEntry: findLengthForSection(entry.name, lengthEntries),
7673
7717
  onBack: () => setActiveSection(null),
7718
+ internationalSizes: sizingResult?.internationalSizes,
7674
7719
  productImage: resultImageUrl || productImage,
7675
7720
  productTitle,
7676
7721
  isMobile: true,
@@ -7718,6 +7763,7 @@ function SizeResultView({
7718
7763
  unitLbl,
7719
7764
  lengthEntry: findLengthForSection(entry.name, lengthEntries),
7720
7765
  onBack: () => setActiveSection(null),
7766
+ internationalSizes: sizingResult?.internationalSizes,
7721
7767
  t
7722
7768
  }
7723
7769
  ) }, `detail-${activeSection}`)
@@ -7890,6 +7936,7 @@ function SizeResultView({
7890
7936
  lengthEntry: null,
7891
7937
  onBack: () => setView("body-profile"),
7892
7938
  backLabel: t("Back"),
7939
+ internationalSizes: sizingResult?.internationalSizes,
7893
7940
  onTryOn: resultImageUrl ? void 0 : handleSingleTryOn,
7894
7941
  tryOnProcessing,
7895
7942
  productImage: resultImageUrl || productImage,
@@ -7933,6 +7980,7 @@ function SizeResultView({
7933
7980
  lengthEntry: null,
7934
7981
  onBack: () => setView("body-profile"),
7935
7982
  backLabel: t("Back"),
7983
+ internationalSizes: sizingResult?.internationalSizes,
7936
7984
  onTryOn: resultImageUrl ? void 0 : handleSingleTryOn,
7937
7985
  tryOnProcessing,
7938
7986
  t
@@ -8017,9 +8065,8 @@ function SizeResultView({
8017
8065
  onClick: () => {
8018
8066
  if (!guideFile) return;
8019
8067
  handleFileSelect(guideFile);
8020
- handleTryOnSubmit();
8068
+ handleTryOnSubmit(guideFile);
8021
8069
  setShowPhotoGuide(false);
8022
- setGuideFile(null);
8023
8070
  },
8024
8071
  children: t("START TRY-ON")
8025
8072
  }
@@ -8152,9 +8199,8 @@ function SizeResultView({
8152
8199
  /* @__PURE__ */ jsxs("button", { className: "ps-tryon-v2-cta", style: { marginTop: 0 }, disabled: !guideFile, onClick: () => {
8153
8200
  if (!guideFile) return;
8154
8201
  handleFileSelect(guideFile);
8155
- handleTryOnSubmit();
8202
+ handleTryOnSubmit(guideFile);
8156
8203
  setShowPhotoGuide(false);
8157
- setGuideFile(null);
8158
8204
  }, children: [
8159
8205
  /* @__PURE__ */ jsx(CameraIcon$1, { size: 14 }),
8160
8206
  " ",
@@ -11111,8 +11157,8 @@ function PrimeStyleTryonInner({
11111
11157
  }
11112
11158
  setSizingLoading(false);
11113
11159
  }, [apiUrl, productImage, productTitle, sizingUnit, weightUnit, sizingCountry, sizeGuide, dynamicFields, persistResultToProfile]);
11114
- const handleTryOnSubmit = useCallback(async () => {
11115
- const file = selectedFile || selectedFileRef.current;
11160
+ const handleTryOnSubmit = useCallback(async (overrideFile) => {
11161
+ const file = overrideFile || selectedFile || selectedFileRef.current;
11116
11162
  if (!file || !apiRef.current || !sseRef.current) {
11117
11163
  const msg = !apiRef.current ? t("SDK not configured. Please provide an API key.") : t("Please upload a photo first.");
11118
11164
  setErrorMessage(msg);
@@ -11120,10 +11166,14 @@ function PrimeStyleTryonInner({
11120
11166
  onError?.({ message: msg, code: "SDK_NOT_CONFIGURED" });
11121
11167
  return;
11122
11168
  }
11169
+ if (overrideFile && overrideFile !== selectedFile) {
11170
+ setSelectedFile(overrideFile);
11171
+ selectedFileRef.current = overrideFile;
11172
+ }
11123
11173
  completedRef.current = false;
11124
11174
  setTryOnProcessing(true);
11125
- const previewObjUrl = previewUrl || URL.createObjectURL(file);
11126
- if (!previewUrl) setPreviewUrl(previewObjUrl);
11175
+ const previewObjUrl = (overrideFile ? null : previewUrl) || URL.createObjectURL(file);
11176
+ if (overrideFile || !previewUrl) setPreviewUrl(previewObjUrl);
11127
11177
  modelPoseRef.current = null;
11128
11178
  setBodyLandmarks(null);
11129
11179
  detectMeasurementLines(previewObjUrl).then((lines) => {
package/dist/react/views/SizeResultView.d.ts CHANGED
@@ -19,7 +19,7 @@ export declare function SizeResultView({ sizingLoading, sizingResult, sizeGuide,
19
19
  previewUrl: string | null;
20
20
  handleFileSelect: (file: File) => void;
21
21
  handleRemovePreview: () => void;
22
- handleTryOnSubmit: () => void;
22
+ handleTryOnSubmit: (overrideFile?: File) => void;
23
23
  tryOnProcessing?: boolean;
24
24
  bodyLandmarks?: BodyLandmarks | null;
25
25
  activeSection: string | null;
package/dist/storefront/primestyle-tryon.js CHANGED
@@ -9660,24 +9660,6 @@ const FALLBACK_FIELDS_MALE = [
9660
9660
  { key: "inseam", label: "Inseam", required: false, unit: "cm", placeholder: "e.g. 81", category: "body" },
9661
9661
  { key: "footLengthCm", label: "Foot length", required: false, unit: "cm", placeholder: "e.g. 27", category: "shoe" }
9662
9662
  ];
9663
- const SIZE_CONVERSIONS = {
9664
- "XXS": { US: "XXS", UK: "4", EU: "30", IT: "36", FR: "32", DE: "30", JP: "3", KR: "40", AU: "4", BR: "PP" },
9665
- "XS": { US: "XS", UK: "6", EU: "32", IT: "38", FR: "34", DE: "32", JP: "5", KR: "44", AU: "6", BR: "PP" },
9666
- "S": { US: "S", UK: "8", EU: "36", IT: "42", FR: "38", DE: "36", JP: "9", KR: "55", AU: "10", BR: "P" },
9667
- "M": { US: "M", UK: "10", EU: "38", IT: "44", FR: "40", DE: "38", JP: "11", KR: "66", AU: "12", BR: "M" },
9668
- "L": { US: "L", UK: "12", EU: "40", IT: "46", FR: "42", DE: "40", JP: "13", KR: "77", AU: "14", BR: "G" },
9669
- "XL": { US: "XL", UK: "14", EU: "42", IT: "48", FR: "44", DE: "42", JP: "15", KR: "88", AU: "16", BR: "GG" },
9670
- "XXL": { US: "XXL", UK: "16", EU: "44", IT: "50", FR: "46", DE: "44", JP: "17", KR: "99", AU: "18", BR: "XG" },
9671
- "XXXL": { US: "XXXL", UK: "18", EU: "46", IT: "52", FR: "48", DE: "46", JP: "19", KR: "100", AU: "20", BR: "EG" },
9672
- // Numeric sizes (EU-based)
9673
- "34": { US: "XS", UK: "6", EU: "34", IT: "38", FR: "34", DE: "34", JP: "5", KR: "44", AU: "6" },
9674
- "36": { US: "S", UK: "8", EU: "36", IT: "40", FR: "36", DE: "36", JP: "7", KR: "55", AU: "8" },
9675
- "38": { US: "M", UK: "10", EU: "38", IT: "42", FR: "38", DE: "38", JP: "9", KR: "66", AU: "10" },
9676
- "40": { US: "L", UK: "12", EU: "40", IT: "44", FR: "40", DE: "40", JP: "11", KR: "77", AU: "12" },
9677
- "42": { US: "XL", UK: "14", EU: "42", IT: "46", FR: "42", DE: "42", JP: "13", KR: "88", AU: "14" },
9678
- "44": { US: "XXL", UK: "16", EU: "44", IT: "48", FR: "44", DE: "44", JP: "15", KR: "99", AU: "16" },
9679
- "46": { US: "XXXL", UK: "18", EU: "46", IT: "50", FR: "46", DE: "46", JP: "17", KR: "100", AU: "18" }
9680
- };
9681
9663
  const TOTAL_STEPS = 3;
9682
9664
  const LS_PREFIX = "primestyle_";
9683
9665
  const PROFILES_KEY = "profiles";
@@ -16227,10 +16209,13 @@ function SectionDetailView({
16227
16209
  onImageLoad,
16228
16210
  onTryOn,
16229
16211
  tryOnProcessing,
16230
- backLabel
16212
+ backLabel,
16213
+ internationalSizes
16231
16214
  }) {
16232
16215
  const recSize = sectionResult?.recommendedSize || "";
16233
16216
  const [selectedSize, setSelectedSize] = reactExports.useState(null);
16217
+ const countryOptions = internationalSizes ? Object.keys(internationalSizes) : [];
16218
+ const [selectedCountry, setSelectedCountry] = reactExports.useState(null);
16234
16219
  const recLength = lengthEntry?.secResult?.recommendedSize || "";
16235
16220
  const [selectedLength, setSelectedLength] = reactExports.useState(null);
16236
16221
  const lengthSizes = reactExports.useMemo(() => {
@@ -16258,6 +16243,7 @@ function SectionDetailView({
16258
16243
  }, [section, sizeColIdx, sizeHeader]);
16259
16244
  const displaySize = selectedSize || recSize;
16260
16245
  const isRecommended = displaySize === recSize;
16246
+ const displaySizeLabel = selectedCountry && isRecommended && internationalSizes && internationalSizes[selectedCountry] ? internationalSizes[selectedCountry] : displaySize;
16261
16247
  const columnUnits = reactExports.useMemo(() => {
16262
16248
  const units = [];
16263
16249
  for (let i = 0; i < section.headers.length; i++) {
@@ -16487,10 +16473,41 @@ function SectionDetailView({
16487
16473
  )
16488
16474
  ] }),
16489
16475
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-msd-card", children: [
16490
- /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-msd-card-eyebrow", children: displaySize === backendSize ? t2("RECOMMENDED SIZE") : t2("TRYING SIZE") }),
16476
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: "10px" }, children: [
16477
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-msd-card-eyebrow", children: displaySize === backendSize ? t2("RECOMMENDED SIZE") : t2("TRYING SIZE") }),
16478
+ countryOptions.length > 0 && isRecommended && /* @__PURE__ */ jsxRuntimeExports.jsxs(
16479
+ "select",
16480
+ {
16481
+ value: selectedCountry || "",
16482
+ onChange: (e) => setSelectedCountry(e.target.value || null),
16483
+ style: {
16484
+ fontSize: "11px",
16485
+ fontWeight: 600,
16486
+ fontFamily: "inherit",
16487
+ color: "var(--ps-text-secondary)",
16488
+ background: "white",
16489
+ border: "1px solid rgba(0,0,0,0.12)",
16490
+ borderRadius: "6px",
16491
+ padding: "4px 8px",
16492
+ cursor: "pointer",
16493
+ outline: "none"
16494
+ },
16495
+ "aria-label": t2("Display size in country"),
16496
+ children: [
16497
+ /* @__PURE__ */ jsxRuntimeExports.jsx("option", { value: "", children: t2("Standard") }),
16498
+ countryOptions.map((c) => /* @__PURE__ */ jsxRuntimeExports.jsx("option", { value: c, children: c }, c))
16499
+ ]
16500
+ }
16501
+ )
16502
+ ] }),
16491
16503
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-msd-card-size-row", children: [
16492
- /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-msd-card-size", children: displaySize }),
16493
- finalDisplayLength && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-msd-card-size-meta", children: finalDisplayLength })
16504
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-msd-card-size", children: displaySizeLabel }),
16505
+ finalDisplayLength && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-msd-card-size-meta", children: finalDisplayLength }),
16506
+ selectedCountry && isRecommended && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ps-msd-card-size-meta", style: { fontSize: "11px", opacity: 0.7 }, children: [
16507
+ "(",
16508
+ selectedCountry,
16509
+ ")"
16510
+ ] })
16494
16511
  ] }),
16495
16512
  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-msd-card-divider" }),
16496
16513
  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-msd-card-eyebrow", children: t2("FIT ACCURACY") }),
@@ -16586,10 +16603,41 @@ function SectionDetailView({
16586
16603
  }
16587
16604
  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-sec-detail", style: { padding: "1.5vw", display: "flex", flexDirection: "column", height: "100%", background: "#F8F9FA" }, children: [
16588
16605
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { flex: 1 }, children: [
16589
- /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "0.75vw", fontWeight: 700, color: "var(--ps-accent)", textTransform: "uppercase", letterSpacing: "0.12em" }, children: isRecommended ? t2("Recommended Size") : t2("Not Recommended") }),
16606
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: "0.5vw" }, children: [
16607
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "0.75vw", fontWeight: 700, color: "var(--ps-accent)", textTransform: "uppercase", letterSpacing: "0.12em" }, children: isRecommended ? t2("Recommended Size") : t2("Not Recommended") }),
16608
+ countryOptions.length > 0 && isRecommended && /* @__PURE__ */ jsxRuntimeExports.jsxs(
16609
+ "select",
16610
+ {
16611
+ value: selectedCountry || "",
16612
+ onChange: (e) => setSelectedCountry(e.target.value || null),
16613
+ style: {
16614
+ fontSize: "0.7vw",
16615
+ fontWeight: 600,
16616
+ fontFamily: "inherit",
16617
+ color: "var(--ps-text-secondary)",
16618
+ background: "white",
16619
+ border: "1px solid rgba(0,0,0,0.12)",
16620
+ borderRadius: "0.35vw",
16621
+ padding: "0.25vw 0.6vw",
16622
+ cursor: "pointer",
16623
+ outline: "none"
16624
+ },
16625
+ "aria-label": t2("Display size in country"),
16626
+ children: [
16627
+ /* @__PURE__ */ jsxRuntimeExports.jsx("option", { value: "", children: t2("Standard") }),
16628
+ countryOptions.map((c) => /* @__PURE__ */ jsxRuntimeExports.jsx("option", { value: c, children: c }, c))
16629
+ ]
16630
+ }
16631
+ )
16632
+ ] }),
16590
16633
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "baseline", gap: "0.5vw", marginTop: "0.3vw", marginBottom: "0.4vw" }, children: [
16591
- /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "3.5vw", fontWeight: 300, color: "var(--ps-text-primary)", lineHeight: 1, letterSpacing: "-0.02em" }, children: displaySize }),
16592
- finalDisplayLength && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "1.4vw", fontWeight: 400, color: "var(--ps-text-secondary)" }, children: finalDisplayLength })
16634
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "3.5vw", fontWeight: 300, color: "var(--ps-text-primary)", lineHeight: 1, letterSpacing: "-0.02em" }, children: displaySizeLabel }),
16635
+ finalDisplayLength && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "1.4vw", fontWeight: 400, color: "var(--ps-text-secondary)" }, children: finalDisplayLength }),
16636
+ selectedCountry && isRecommended && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { fontSize: "0.7vw", color: "var(--ps-text-muted)", marginLeft: "0.3vw" }, children: [
16637
+ "(",
16638
+ selectedCountry,
16639
+ ")"
16640
+ ] })
16593
16641
  ] }),
16594
16642
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.4vw", marginBottom: "1.2vw" }, children: [
16595
16643
  /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "1vw", height: "1vw", viewBox: "0 0 16 16", fill: "none", children: [
@@ -16869,13 +16917,9 @@ function SizeResultView({
16869
16917
  return { range: val, ...parsed };
16870
16918
  }, [sizeGuide, sizeColIdx, sizeHeader, unitLbl, cellVal, pRange, sizeGuideColumnUnits]);
16871
16919
  const origSize = sizingResult?.recommendedSize || "";
16872
- const activeSize = origSize;
16873
16920
  reactExports.useMemo(() => {
16874
- const backendIntl = sizingResult?.internationalSizes || {};
16875
- const upper = activeSize.toUpperCase().trim();
16876
- const fromTable = SIZE_CONVERSIONS[upper] || SIZE_CONVERSIONS[activeSize] || {};
16877
- return { ...fromTable, ...backendIntl };
16878
- }, [sizingResult, activeSize]);
16921
+ return sizingResult?.internationalSizes || {};
16922
+ }, [sizingResult]);
16879
16923
  const [resultTab, setResultTab] = reactExports.useState("fit");
16880
16924
  const [selectedSize, setSelectedSize] = reactExports.useState(null);
16881
16925
  const [showFullChart, setShowFullChart] = reactExports.useState(false);
@@ -17095,6 +17139,7 @@ function SizeResultView({
17095
17139
  unitLbl,
17096
17140
  lengthEntry: findLengthForSection(entry.name, lengthEntries),
17097
17141
  onBack: () => setActiveSection(null),
17142
+ internationalSizes: sizingResult?.internationalSizes,
17098
17143
  productImage: resultImageUrl || productImage,
17099
17144
  productTitle,
17100
17145
  isMobile: true,
@@ -17142,6 +17187,7 @@ function SizeResultView({
17142
17187
  unitLbl,
17143
17188
  lengthEntry: findLengthForSection(entry.name, lengthEntries),
17144
17189
  onBack: () => setActiveSection(null),
17190
+ internationalSizes: sizingResult?.internationalSizes,
17145
17191
  t: t2
17146
17192
  }
17147
17193
  ) }, `detail-${activeSection}`)
@@ -17314,6 +17360,7 @@ function SizeResultView({
17314
17360
  lengthEntry: null,
17315
17361
  onBack: () => setView("body-profile"),
17316
17362
  backLabel: t2("Back"),
17363
+ internationalSizes: sizingResult?.internationalSizes,
17317
17364
  onTryOn: resultImageUrl ? void 0 : handleSingleTryOn,
17318
17365
  tryOnProcessing,
17319
17366
  productImage: resultImageUrl || productImage,
@@ -17357,6 +17404,7 @@ function SizeResultView({
17357
17404
  lengthEntry: null,
17358
17405
  onBack: () => setView("body-profile"),
17359
17406
  backLabel: t2("Back"),
17407
+ internationalSizes: sizingResult?.internationalSizes,
17360
17408
  onTryOn: resultImageUrl ? void 0 : handleSingleTryOn,
17361
17409
  tryOnProcessing,
17362
17410
  t: t2
@@ -17441,9 +17489,8 @@ function SizeResultView({
17441
17489
  onClick: () => {
17442
17490
  if (!guideFile) return;
17443
17491
  handleFileSelect(guideFile);
17444
- handleTryOnSubmit();
17492
+ handleTryOnSubmit(guideFile);
17445
17493
  setShowPhotoGuide(false);
17446
- setGuideFile(null);
17447
17494
  },
17448
17495
  children: t2("START TRY-ON")
17449
17496
  }
@@ -17576,9 +17623,8 @@ function SizeResultView({
17576
17623
  /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-tryon-v2-cta", style: { marginTop: 0 }, disabled: !guideFile, onClick: () => {
17577
17624
  if (!guideFile) return;
17578
17625
  handleFileSelect(guideFile);
17579
- handleTryOnSubmit();
17626
+ handleTryOnSubmit(guideFile);
17580
17627
  setShowPhotoGuide(false);
17581
- setGuideFile(null);
17582
17628
  }, children: [
17583
17629
  /* @__PURE__ */ jsxRuntimeExports.jsx(CameraIcon$1, { size: 14 }),
17584
17630
  " ",
@@ -20535,8 +20581,8 @@ function PrimeStyleTryonInner({
20535
20581
  }
20536
20582
  setSizingLoading(false);
20537
20583
  }, [apiUrl, productImage, productTitle, sizingUnit, weightUnit, sizingCountry, sizeGuide, dynamicFields, persistResultToProfile]);
20538
- const handleTryOnSubmit = reactExports.useCallback(async () => {
20539
- const file = selectedFile || selectedFileRef.current;
20584
+ const handleTryOnSubmit = reactExports.useCallback(async (overrideFile) => {
20585
+ const file = overrideFile || selectedFile || selectedFileRef.current;
20540
20586
  if (!file || !apiRef.current || !sseRef.current) {
20541
20587
  const msg = !apiRef.current ? t2("SDK not configured. Please provide an API key.") : t2("Please upload a photo first.");
20542
20588
  setErrorMessage(msg);
@@ -20544,10 +20590,14 @@ function PrimeStyleTryonInner({
20544
20590
  onError?.({ message: msg, code: "SDK_NOT_CONFIGURED" });
20545
20591
  return;
20546
20592
  }
20593
+ if (overrideFile && overrideFile !== selectedFile) {
20594
+ setSelectedFile(overrideFile);
20595
+ selectedFileRef.current = overrideFile;
20596
+ }
20547
20597
  completedRef.current = false;
20548
20598
  setTryOnProcessing(true);
20549
- const previewObjUrl = previewUrl || URL.createObjectURL(file);
20550
- if (!previewUrl) setPreviewUrl(previewObjUrl);
20599
+ const previewObjUrl = (overrideFile ? null : previewUrl) || URL.createObjectURL(file);
20600
+ if (overrideFile || !previewUrl) setPreviewUrl(previewObjUrl);
20551
20601
  modelPoseRef.current = null;
20552
20602
  setBodyLandmarks(null);
20553
20603
  detectMeasurementLines(previewObjUrl).then((lines) => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primestyleai/tryon",
3
- "version": "5.8.15",
3
+ "version": "5.8.17",
4
4
  "description": "PrimeStyle Virtual Try-On SDK — React component & Web Component",
5
5
  "type": "module",
6
6
  "main": "dist/primestyle-tryon.js",