@primestyleai/tryon 5.8.14 → 5.8.16
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.
package/dist/react/index.js
CHANGED
|
@@ -6800,7 +6800,10 @@ function SectionDetailView({
|
|
|
6800
6800
|
showLines,
|
|
6801
6801
|
onToggleLines,
|
|
6802
6802
|
overlayNode,
|
|
6803
|
-
onImageLoad
|
|
6803
|
+
onImageLoad,
|
|
6804
|
+
onTryOn,
|
|
6805
|
+
tryOnProcessing,
|
|
6806
|
+
backLabel
|
|
6804
6807
|
}) {
|
|
6805
6808
|
const recSize = sectionResult?.recommendedSize || "";
|
|
6806
6809
|
const [selectedSize, setSelectedSize] = useState(null);
|
|
@@ -7262,9 +7265,41 @@ function SectionDetailView({
|
|
|
7262
7265
|
/* @__PURE__ */ jsxs("button", { className: "ps-bp-back-btn", onClick: onBack, type: "button", style: { fontSize: "0.7vw" }, children: [
|
|
7263
7266
|
/* @__PURE__ */ jsx("span", { className: "ps-bp-back-arrow", children: "←" }),
|
|
7264
7267
|
" ",
|
|
7265
|
-
t("Back to sections")
|
|
7268
|
+
backLabel || t("Back to sections")
|
|
7266
7269
|
] }),
|
|
7267
|
-
/* @__PURE__ */ jsxs(
|
|
7270
|
+
onTryOn ? /* @__PURE__ */ jsxs(
|
|
7271
|
+
"button",
|
|
7272
|
+
{
|
|
7273
|
+
onClick: onTryOn,
|
|
7274
|
+
disabled: tryOnProcessing,
|
|
7275
|
+
style: {
|
|
7276
|
+
padding: "0.45vw 1.2vw",
|
|
7277
|
+
borderRadius: "0.4vw",
|
|
7278
|
+
fontSize: "0.7vw",
|
|
7279
|
+
fontWeight: 600,
|
|
7280
|
+
background: "var(--ps-accent)",
|
|
7281
|
+
color: "white",
|
|
7282
|
+
border: "none",
|
|
7283
|
+
cursor: tryOnProcessing ? "default" : "pointer",
|
|
7284
|
+
opacity: tryOnProcessing ? 0.6 : 1,
|
|
7285
|
+
fontFamily: "inherit",
|
|
7286
|
+
display: "flex",
|
|
7287
|
+
alignItems: "center",
|
|
7288
|
+
gap: "0.4vw",
|
|
7289
|
+
transition: "opacity 0.2s"
|
|
7290
|
+
},
|
|
7291
|
+
onMouseEnter: (e) => {
|
|
7292
|
+
if (!tryOnProcessing) e.currentTarget.style.opacity = "0.9";
|
|
7293
|
+
},
|
|
7294
|
+
onMouseLeave: (e) => {
|
|
7295
|
+
if (!tryOnProcessing) e.currentTarget.style.opacity = "1";
|
|
7296
|
+
},
|
|
7297
|
+
children: [
|
|
7298
|
+
/* @__PURE__ */ jsx(CameraIcon$1, { size: 12 }),
|
|
7299
|
+
tryOnProcessing ? t("Processing...") : t("Try It On")
|
|
7300
|
+
]
|
|
7301
|
+
}
|
|
7302
|
+
) : /* @__PURE__ */ jsxs(
|
|
7268
7303
|
"button",
|
|
7269
7304
|
{
|
|
7270
7305
|
onClick: onBack,
|
|
@@ -7700,7 +7735,7 @@ function SizeResultView({
|
|
|
7700
7735
|
sectionEntries: sectionEntries.map(({ name, secResult }) => ({ name, secResult })),
|
|
7701
7736
|
onSelectSection: (name) => setActiveSection(name),
|
|
7702
7737
|
onTryOn: () => {
|
|
7703
|
-
setGuideFile(null);
|
|
7738
|
+
setGuideFile(selectedFile || null);
|
|
7704
7739
|
setShowPhotoGuide(true);
|
|
7705
7740
|
},
|
|
7706
7741
|
tryOnProcessing,
|
|
@@ -7708,7 +7743,7 @@ function SizeResultView({
|
|
|
7708
7743
|
tryOnDone: !!resultImageUrl && !tryOnProcessing,
|
|
7709
7744
|
onTryAgain: () => {
|
|
7710
7745
|
onResetTryOn?.();
|
|
7711
|
-
setGuideFile(null);
|
|
7746
|
+
setGuideFile(selectedFile || null);
|
|
7712
7747
|
setShowPhotoGuide(true);
|
|
7713
7748
|
},
|
|
7714
7749
|
onClose,
|
|
@@ -7815,7 +7850,7 @@ function SizeResultView({
|
|
|
7815
7850
|
style: { marginTop: 0 },
|
|
7816
7851
|
disabled: tryOnProcessing,
|
|
7817
7852
|
onClick: () => {
|
|
7818
|
-
setGuideFile(null);
|
|
7853
|
+
setGuideFile(selectedFile || null);
|
|
7819
7854
|
setShowPhotoGuide(true);
|
|
7820
7855
|
},
|
|
7821
7856
|
children: [
|
|
@@ -7838,6 +7873,11 @@ function SizeResultView({
|
|
|
7838
7873
|
for (const m of sizingResult.matchDetails) singleUserMeasurements[m.measurement.toLowerCase()] = pNumFn(m.userValue);
|
|
7839
7874
|
}
|
|
7840
7875
|
const sectionName = t("Your Fit");
|
|
7876
|
+
const handleSingleTryOn = () => {
|
|
7877
|
+
if (resultImageUrl) return;
|
|
7878
|
+
setGuideFile(selectedFile || null);
|
|
7879
|
+
setShowPhotoGuide(true);
|
|
7880
|
+
};
|
|
7841
7881
|
if (isMobile) {
|
|
7842
7882
|
return /* @__PURE__ */ jsx(
|
|
7843
7883
|
SectionDetailView,
|
|
@@ -7849,6 +7889,9 @@ function SizeResultView({
|
|
|
7849
7889
|
unitLbl,
|
|
7850
7890
|
lengthEntry: null,
|
|
7851
7891
|
onBack: () => setView("body-profile"),
|
|
7892
|
+
backLabel: t("Back"),
|
|
7893
|
+
onTryOn: resultImageUrl ? void 0 : handleSingleTryOn,
|
|
7894
|
+
tryOnProcessing,
|
|
7852
7895
|
productImage: resultImageUrl || productImage,
|
|
7853
7896
|
productTitle,
|
|
7854
7897
|
isMobile: true,
|
|
@@ -7889,6 +7932,9 @@ function SizeResultView({
|
|
|
7889
7932
|
unitLbl,
|
|
7890
7933
|
lengthEntry: null,
|
|
7891
7934
|
onBack: () => setView("body-profile"),
|
|
7935
|
+
backLabel: t("Back"),
|
|
7936
|
+
onTryOn: resultImageUrl ? void 0 : handleSingleTryOn,
|
|
7937
|
+
tryOnProcessing,
|
|
7892
7938
|
t
|
|
7893
7939
|
}
|
|
7894
7940
|
) }, "panel-single")
|
|
@@ -7971,9 +8017,8 @@ function SizeResultView({
|
|
|
7971
8017
|
onClick: () => {
|
|
7972
8018
|
if (!guideFile) return;
|
|
7973
8019
|
handleFileSelect(guideFile);
|
|
7974
|
-
handleTryOnSubmit();
|
|
8020
|
+
handleTryOnSubmit(guideFile);
|
|
7975
8021
|
setShowPhotoGuide(false);
|
|
7976
|
-
setGuideFile(null);
|
|
7977
8022
|
},
|
|
7978
8023
|
children: t("START TRY-ON")
|
|
7979
8024
|
}
|
|
@@ -8106,9 +8151,8 @@ function SizeResultView({
|
|
|
8106
8151
|
/* @__PURE__ */ jsxs("button", { className: "ps-tryon-v2-cta", style: { marginTop: 0 }, disabled: !guideFile, onClick: () => {
|
|
8107
8152
|
if (!guideFile) return;
|
|
8108
8153
|
handleFileSelect(guideFile);
|
|
8109
|
-
handleTryOnSubmit();
|
|
8154
|
+
handleTryOnSubmit(guideFile);
|
|
8110
8155
|
setShowPhotoGuide(false);
|
|
8111
|
-
setGuideFile(null);
|
|
8112
8156
|
}, children: [
|
|
8113
8157
|
/* @__PURE__ */ jsx(CameraIcon$1, { size: 14 }),
|
|
8114
8158
|
" ",
|
|
@@ -11065,8 +11109,8 @@ function PrimeStyleTryonInner({
|
|
|
11065
11109
|
}
|
|
11066
11110
|
setSizingLoading(false);
|
|
11067
11111
|
}, [apiUrl, productImage, productTitle, sizingUnit, weightUnit, sizingCountry, sizeGuide, dynamicFields, persistResultToProfile]);
|
|
11068
|
-
const handleTryOnSubmit = useCallback(async () => {
|
|
11069
|
-
const file = selectedFile || selectedFileRef.current;
|
|
11112
|
+
const handleTryOnSubmit = useCallback(async (overrideFile) => {
|
|
11113
|
+
const file = overrideFile || selectedFile || selectedFileRef.current;
|
|
11070
11114
|
if (!file || !apiRef.current || !sseRef.current) {
|
|
11071
11115
|
const msg = !apiRef.current ? t("SDK not configured. Please provide an API key.") : t("Please upload a photo first.");
|
|
11072
11116
|
setErrorMessage(msg);
|
|
@@ -11074,10 +11118,14 @@ function PrimeStyleTryonInner({
|
|
|
11074
11118
|
onError?.({ message: msg, code: "SDK_NOT_CONFIGURED" });
|
|
11075
11119
|
return;
|
|
11076
11120
|
}
|
|
11121
|
+
if (overrideFile && overrideFile !== selectedFile) {
|
|
11122
|
+
setSelectedFile(overrideFile);
|
|
11123
|
+
selectedFileRef.current = overrideFile;
|
|
11124
|
+
}
|
|
11077
11125
|
completedRef.current = false;
|
|
11078
11126
|
setTryOnProcessing(true);
|
|
11079
|
-
const previewObjUrl = previewUrl || URL.createObjectURL(file);
|
|
11080
|
-
if (!previewUrl) setPreviewUrl(previewObjUrl);
|
|
11127
|
+
const previewObjUrl = (overrideFile ? null : previewUrl) || URL.createObjectURL(file);
|
|
11128
|
+
if (overrideFile || !previewUrl) setPreviewUrl(previewObjUrl);
|
|
11081
11129
|
modelPoseRef.current = null;
|
|
11082
11130
|
setBodyLandmarks(null);
|
|
11083
11131
|
detectMeasurementLines(previewObjUrl).then((lines) => {
|
|
@@ -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;
|
|
@@ -16224,7 +16224,10 @@ function SectionDetailView({
|
|
|
16224
16224
|
showLines,
|
|
16225
16225
|
onToggleLines,
|
|
16226
16226
|
overlayNode,
|
|
16227
|
-
onImageLoad
|
|
16227
|
+
onImageLoad,
|
|
16228
|
+
onTryOn,
|
|
16229
|
+
tryOnProcessing,
|
|
16230
|
+
backLabel
|
|
16228
16231
|
}) {
|
|
16229
16232
|
const recSize = sectionResult?.recommendedSize || "";
|
|
16230
16233
|
const [selectedSize, setSelectedSize] = reactExports.useState(null);
|
|
@@ -16686,9 +16689,41 @@ function SectionDetailView({
|
|
|
16686
16689
|
/* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-bp-back-btn", onClick: onBack, type: "button", style: { fontSize: "0.7vw" }, children: [
|
|
16687
16690
|
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-bp-back-arrow", children: "←" }),
|
|
16688
16691
|
" ",
|
|
16689
|
-
t2("Back to sections")
|
|
16692
|
+
backLabel || t2("Back to sections")
|
|
16690
16693
|
] }),
|
|
16691
|
-
/* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
16694
|
+
onTryOn ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
16695
|
+
"button",
|
|
16696
|
+
{
|
|
16697
|
+
onClick: onTryOn,
|
|
16698
|
+
disabled: tryOnProcessing,
|
|
16699
|
+
style: {
|
|
16700
|
+
padding: "0.45vw 1.2vw",
|
|
16701
|
+
borderRadius: "0.4vw",
|
|
16702
|
+
fontSize: "0.7vw",
|
|
16703
|
+
fontWeight: 600,
|
|
16704
|
+
background: "var(--ps-accent)",
|
|
16705
|
+
color: "white",
|
|
16706
|
+
border: "none",
|
|
16707
|
+
cursor: tryOnProcessing ? "default" : "pointer",
|
|
16708
|
+
opacity: tryOnProcessing ? 0.6 : 1,
|
|
16709
|
+
fontFamily: "inherit",
|
|
16710
|
+
display: "flex",
|
|
16711
|
+
alignItems: "center",
|
|
16712
|
+
gap: "0.4vw",
|
|
16713
|
+
transition: "opacity 0.2s"
|
|
16714
|
+
},
|
|
16715
|
+
onMouseEnter: (e) => {
|
|
16716
|
+
if (!tryOnProcessing) e.currentTarget.style.opacity = "0.9";
|
|
16717
|
+
},
|
|
16718
|
+
onMouseLeave: (e) => {
|
|
16719
|
+
if (!tryOnProcessing) e.currentTarget.style.opacity = "1";
|
|
16720
|
+
},
|
|
16721
|
+
children: [
|
|
16722
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(CameraIcon$1, { size: 12 }),
|
|
16723
|
+
tryOnProcessing ? t2("Processing...") : t2("Try It On")
|
|
16724
|
+
]
|
|
16725
|
+
}
|
|
16726
|
+
) : /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
16692
16727
|
"button",
|
|
16693
16728
|
{
|
|
16694
16729
|
onClick: onBack,
|
|
@@ -17124,7 +17159,7 @@ function SizeResultView({
|
|
|
17124
17159
|
sectionEntries: sectionEntries.map(({ name, secResult }) => ({ name, secResult })),
|
|
17125
17160
|
onSelectSection: (name) => setActiveSection(name),
|
|
17126
17161
|
onTryOn: () => {
|
|
17127
|
-
setGuideFile(null);
|
|
17162
|
+
setGuideFile(selectedFile || null);
|
|
17128
17163
|
setShowPhotoGuide(true);
|
|
17129
17164
|
},
|
|
17130
17165
|
tryOnProcessing,
|
|
@@ -17132,7 +17167,7 @@ function SizeResultView({
|
|
|
17132
17167
|
tryOnDone: !!resultImageUrl && !tryOnProcessing,
|
|
17133
17168
|
onTryAgain: () => {
|
|
17134
17169
|
onResetTryOn?.();
|
|
17135
|
-
setGuideFile(null);
|
|
17170
|
+
setGuideFile(selectedFile || null);
|
|
17136
17171
|
setShowPhotoGuide(true);
|
|
17137
17172
|
},
|
|
17138
17173
|
onClose,
|
|
@@ -17239,7 +17274,7 @@ function SizeResultView({
|
|
|
17239
17274
|
style: { marginTop: 0 },
|
|
17240
17275
|
disabled: tryOnProcessing,
|
|
17241
17276
|
onClick: () => {
|
|
17242
|
-
setGuideFile(null);
|
|
17277
|
+
setGuideFile(selectedFile || null);
|
|
17243
17278
|
setShowPhotoGuide(true);
|
|
17244
17279
|
},
|
|
17245
17280
|
children: [
|
|
@@ -17262,6 +17297,11 @@ function SizeResultView({
|
|
|
17262
17297
|
for (const m2 of sizingResult.matchDetails) singleUserMeasurements[m2.measurement.toLowerCase()] = pNumFn(m2.userValue);
|
|
17263
17298
|
}
|
|
17264
17299
|
const sectionName = t2("Your Fit");
|
|
17300
|
+
const handleSingleTryOn = () => {
|
|
17301
|
+
if (resultImageUrl) return;
|
|
17302
|
+
setGuideFile(selectedFile || null);
|
|
17303
|
+
setShowPhotoGuide(true);
|
|
17304
|
+
};
|
|
17265
17305
|
if (isMobile) {
|
|
17266
17306
|
return /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
17267
17307
|
SectionDetailView,
|
|
@@ -17273,6 +17313,9 @@ function SizeResultView({
|
|
|
17273
17313
|
unitLbl,
|
|
17274
17314
|
lengthEntry: null,
|
|
17275
17315
|
onBack: () => setView("body-profile"),
|
|
17316
|
+
backLabel: t2("Back"),
|
|
17317
|
+
onTryOn: resultImageUrl ? void 0 : handleSingleTryOn,
|
|
17318
|
+
tryOnProcessing,
|
|
17276
17319
|
productImage: resultImageUrl || productImage,
|
|
17277
17320
|
productTitle,
|
|
17278
17321
|
isMobile: true,
|
|
@@ -17313,6 +17356,9 @@ function SizeResultView({
|
|
|
17313
17356
|
unitLbl,
|
|
17314
17357
|
lengthEntry: null,
|
|
17315
17358
|
onBack: () => setView("body-profile"),
|
|
17359
|
+
backLabel: t2("Back"),
|
|
17360
|
+
onTryOn: resultImageUrl ? void 0 : handleSingleTryOn,
|
|
17361
|
+
tryOnProcessing,
|
|
17316
17362
|
t: t2
|
|
17317
17363
|
}
|
|
17318
17364
|
) }, "panel-single")
|
|
@@ -17395,9 +17441,8 @@ function SizeResultView({
|
|
|
17395
17441
|
onClick: () => {
|
|
17396
17442
|
if (!guideFile) return;
|
|
17397
17443
|
handleFileSelect(guideFile);
|
|
17398
|
-
handleTryOnSubmit();
|
|
17444
|
+
handleTryOnSubmit(guideFile);
|
|
17399
17445
|
setShowPhotoGuide(false);
|
|
17400
|
-
setGuideFile(null);
|
|
17401
17446
|
},
|
|
17402
17447
|
children: t2("START TRY-ON")
|
|
17403
17448
|
}
|
|
@@ -17530,9 +17575,8 @@ function SizeResultView({
|
|
|
17530
17575
|
/* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-tryon-v2-cta", style: { marginTop: 0 }, disabled: !guideFile, onClick: () => {
|
|
17531
17576
|
if (!guideFile) return;
|
|
17532
17577
|
handleFileSelect(guideFile);
|
|
17533
|
-
handleTryOnSubmit();
|
|
17578
|
+
handleTryOnSubmit(guideFile);
|
|
17534
17579
|
setShowPhotoGuide(false);
|
|
17535
|
-
setGuideFile(null);
|
|
17536
17580
|
}, children: [
|
|
17537
17581
|
/* @__PURE__ */ jsxRuntimeExports.jsx(CameraIcon$1, { size: 14 }),
|
|
17538
17582
|
" ",
|
|
@@ -20489,8 +20533,8 @@ function PrimeStyleTryonInner({
|
|
|
20489
20533
|
}
|
|
20490
20534
|
setSizingLoading(false);
|
|
20491
20535
|
}, [apiUrl, productImage, productTitle, sizingUnit, weightUnit, sizingCountry, sizeGuide, dynamicFields, persistResultToProfile]);
|
|
20492
|
-
const handleTryOnSubmit = reactExports.useCallback(async () => {
|
|
20493
|
-
const file = selectedFile || selectedFileRef.current;
|
|
20536
|
+
const handleTryOnSubmit = reactExports.useCallback(async (overrideFile) => {
|
|
20537
|
+
const file = overrideFile || selectedFile || selectedFileRef.current;
|
|
20494
20538
|
if (!file || !apiRef.current || !sseRef.current) {
|
|
20495
20539
|
const msg = !apiRef.current ? t2("SDK not configured. Please provide an API key.") : t2("Please upload a photo first.");
|
|
20496
20540
|
setErrorMessage(msg);
|
|
@@ -20498,10 +20542,14 @@ function PrimeStyleTryonInner({
|
|
|
20498
20542
|
onError?.({ message: msg, code: "SDK_NOT_CONFIGURED" });
|
|
20499
20543
|
return;
|
|
20500
20544
|
}
|
|
20545
|
+
if (overrideFile && overrideFile !== selectedFile) {
|
|
20546
|
+
setSelectedFile(overrideFile);
|
|
20547
|
+
selectedFileRef.current = overrideFile;
|
|
20548
|
+
}
|
|
20501
20549
|
completedRef.current = false;
|
|
20502
20550
|
setTryOnProcessing(true);
|
|
20503
|
-
const previewObjUrl = previewUrl || URL.createObjectURL(file);
|
|
20504
|
-
if (!previewUrl) setPreviewUrl(previewObjUrl);
|
|
20551
|
+
const previewObjUrl = (overrideFile ? null : previewUrl) || URL.createObjectURL(file);
|
|
20552
|
+
if (overrideFile || !previewUrl) setPreviewUrl(previewObjUrl);
|
|
20505
20553
|
modelPoseRef.current = null;
|
|
20506
20554
|
setBodyLandmarks(null);
|
|
20507
20555
|
detectMeasurementLines(previewObjUrl).then((lines) => {
|