@primestyleai/tryon 5.8.40 → 5.8.41

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 (3) hide show
  1. package/dist/react/index.js +201 -33
  2. package/dist/storefront/primestyle-tryon.js +201 -33
  3. package/package.json +1 -1
package/dist/react/index.js CHANGED
@@ -11588,6 +11588,7 @@ function BodyProfileView({
11588
11588
  const [photoBase64, setPhotoBase64] = useState(null);
11589
11589
  const [photoProcessing, setPhotoProcessing] = useState(false);
11590
11590
  const fileInputRef = useRef(null);
11591
+ const [ageConfirmed, setAgeConfirmed] = useState(null);
11591
11592
  const [photoStepHeight, setPhotoStepHeight] = useState(() => {
11592
11593
  if (seedTotalIn != null) return String(Math.round(seedTotalIn * 2.54));
11593
11594
  return seedHeightCm;
@@ -11612,6 +11613,10 @@ function BodyProfileView({
11612
11613
  const handlePhotoSelect = useCallback(async (e) => {
11613
11614
  const file = e.target.files?.[0];
11614
11615
  if (!file) return;
11616
+ if (ageConfirmed !== true) {
11617
+ setError(t("Please confirm that the person in the photo is 18 or older before uploading."));
11618
+ return;
11619
+ }
11615
11620
  if (!file.type.startsWith("image/")) {
11616
11621
  setError(t("Please upload an image file"));
11617
11622
  return;
@@ -11634,7 +11639,7 @@ function BodyProfileView({
11634
11639
  } finally {
11635
11640
  setPhotoProcessing(false);
11636
11641
  }
11637
- }, [t]);
11642
+ }, [t, ageConfirmed]);
11638
11643
  const handleRemovePhoto = useCallback(() => {
11639
11644
  if (photoPreview) URL.revokeObjectURL(photoPreview);
11640
11645
  setPhotoFile(null);
@@ -11800,38 +11805,186 @@ function BodyProfileView({
11800
11805
  }
11801
11806
  return /* @__PURE__ */ jsxs("div", { className: "ps-bp-wrapper", children: [
11802
11807
  /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "1.2vw", padding: "1.5vw", width: "100%", height: "100%", minHeight: "20vw", alignItems: "stretch" }, children: [
11803
- /* @__PURE__ */ jsx(
11804
- "div",
11805
- {
11806
- onClick: () => !photoPreview && fileInputRef.current?.click(),
11807
- style: {
11808
- flex: 1,
11809
- display: "flex",
11810
- flexDirection: "column",
11811
- alignItems: "center",
11812
- justifyContent: "center",
11813
- border: photoPreview ? "2px solid var(--ps-accent)" : "2px dashed var(--ps-border-color)",
11814
- borderRadius: "0.5vw",
11815
- cursor: photoPreview ? "default" : "pointer",
11816
- position: "relative",
11817
- background: "var(--ps-bg-secondary)",
11818
- transition: "border-color 0.2s",
11819
- overflow: "hidden"
11820
- },
11821
- children: photoPreview ? /* @__PURE__ */ jsxs(Fragment, { children: [
11822
- /* @__PURE__ */ jsx("img", { src: photoPreview, alt: "preview", style: { width: "100%", height: "100%", objectFit: "contain" } }),
11823
- /* @__PURE__ */ jsx("button", { onClick: (e) => {
11824
- e.stopPropagation();
11825
- handleRemovePhoto();
11826
- }, style: { position: "absolute", top: "0.5vw", right: "0.5vw", width: "1.4vw", height: "1.4vw", borderRadius: "50%", background: "rgba(0,0,0,0.6)", border: "none", color: "#fff", fontSize: "0.7vw", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center" }, children: "×" })
11827
- ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
11828
- /* @__PURE__ */ jsx(UploadIcon, { size: 32 }),
11829
- /* @__PURE__ */ jsx("span", { style: { fontSize: "0.85vw", fontWeight: 600, color: "var(--ps-text-primary)", marginTop: "0.5vw" }, children: t("Upload your photo") }),
11830
- /* @__PURE__ */ jsx("span", { style: { fontSize: "0.6vw", color: "var(--ps-text-muted)", marginTop: "0.2vw" }, children: t("Click or drag a full-body photo") }),
11831
- /* @__PURE__ */ jsx("span", { style: { fontSize: "0.5vw", color: "var(--ps-text-dim)", marginTop: "0.4vw" }, children: "JPEG, PNG (max 10MB)" })
11832
- ] })
11833
- }
11834
- ),
11808
+ /* @__PURE__ */ jsxs("div", { style: { flex: 1, position: "relative", display: "flex" }, children: [
11809
+ /* @__PURE__ */ jsx(
11810
+ "div",
11811
+ {
11812
+ onClick: () => {
11813
+ if (!photoPreview && ageConfirmed === true) fileInputRef.current?.click();
11814
+ },
11815
+ style: {
11816
+ flex: 1,
11817
+ display: "flex",
11818
+ flexDirection: "column",
11819
+ alignItems: "center",
11820
+ justifyContent: "center",
11821
+ border: photoPreview ? "2px solid var(--ps-accent)" : "2px dashed var(--ps-border-color)",
11822
+ borderRadius: "0.5vw",
11823
+ cursor: photoPreview ? "default" : ageConfirmed === true ? "pointer" : "not-allowed",
11824
+ position: "relative",
11825
+ background: "var(--ps-bg-secondary)",
11826
+ transition: "border-color 0.2s, filter 0.25s",
11827
+ overflow: "hidden",
11828
+ filter: !photoPreview && ageConfirmed !== true ? "blur(6px) saturate(0.7)" : void 0,
11829
+ pointerEvents: !photoPreview && ageConfirmed !== true ? "none" : void 0,
11830
+ userSelect: !photoPreview && ageConfirmed !== true ? "none" : void 0
11831
+ },
11832
+ "aria-hidden": !photoPreview && ageConfirmed !== true,
11833
+ children: photoPreview ? /* @__PURE__ */ jsxs(Fragment, { children: [
11834
+ /* @__PURE__ */ jsx("img", { src: photoPreview, alt: "preview", style: { width: "100%", height: "100%", objectFit: "contain" } }),
11835
+ /* @__PURE__ */ jsx("button", { onClick: (e) => {
11836
+ e.stopPropagation();
11837
+ handleRemovePhoto();
11838
+ }, style: { position: "absolute", top: "0.5vw", right: "0.5vw", width: "1.4vw", height: "1.4vw", borderRadius: "50%", background: "rgba(0,0,0,0.6)", border: "none", color: "#fff", fontSize: "0.7vw", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center" }, children: "×" })
11839
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
11840
+ /* @__PURE__ */ jsx(UploadIcon, { size: 32 }),
11841
+ /* @__PURE__ */ jsx("span", { style: { fontSize: "0.85vw", fontWeight: 600, color: "var(--ps-text-primary)", marginTop: "0.5vw" }, children: t("Upload your photo") }),
11842
+ /* @__PURE__ */ jsx("span", { style: { fontSize: "0.6vw", color: "var(--ps-text-muted)", marginTop: "0.2vw" }, children: t("Click or drag a full-body photo") }),
11843
+ /* @__PURE__ */ jsx("span", { style: { fontSize: "0.5vw", color: "var(--ps-text-dim)", marginTop: "0.4vw" }, children: "JPEG, PNG (max 10MB)" })
11844
+ ] })
11845
+ }
11846
+ ),
11847
+ !photoPreview && ageConfirmed === null && /* @__PURE__ */ jsx(
11848
+ "div",
11849
+ {
11850
+ role: "dialog",
11851
+ "aria-labelledby": "ps-bp-age-q",
11852
+ style: {
11853
+ position: "absolute",
11854
+ inset: 0,
11855
+ display: "flex",
11856
+ alignItems: "center",
11857
+ justifyContent: "center",
11858
+ padding: "1vw",
11859
+ background: "rgba(255,255,255,0.55)",
11860
+ backdropFilter: "blur(8px)",
11861
+ WebkitBackdropFilter: "blur(8px)",
11862
+ borderRadius: "0.5vw",
11863
+ zIndex: 2,
11864
+ animation: "ps-cpw-age-gate-in 0.28s ease-out both"
11865
+ },
11866
+ children: /* @__PURE__ */ jsxs("div", { style: {
11867
+ width: "100%",
11868
+ maxWidth: "min(420px, 22vw)",
11869
+ padding: "1.4vw 1.6vw",
11870
+ background: "#FFFFFF",
11871
+ border: "1px solid var(--ps-border-subtle)",
11872
+ borderRadius: "0.9vw",
11873
+ boxShadow: "0 20px 40px -12px rgba(17,24,39,0.25), 0 8px 16px -8px rgba(17,24,39,0.15)",
11874
+ display: "flex",
11875
+ flexDirection: "column",
11876
+ alignItems: "center",
11877
+ textAlign: "center",
11878
+ gap: "0.75vw"
11879
+ }, children: [
11880
+ /* @__PURE__ */ jsx("div", { style: { fontSize: "0.62vw", fontWeight: 700, letterSpacing: "0.18em", textTransform: "uppercase", color: "var(--ps-accent)" }, children: t("AGE VERIFICATION") }),
11881
+ /* @__PURE__ */ jsx("div", { id: "ps-bp-age-q", style: { fontSize: "0.95vw", fontWeight: 600, lineHeight: 1.35, color: "var(--ps-text-primary)" }, children: t("Is the person in this photo 18 years or older?") }),
11882
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "0.65vw", width: "100%", marginTop: "0.4vw" }, children: [
11883
+ /* @__PURE__ */ jsx(
11884
+ "button",
11885
+ {
11886
+ type: "button",
11887
+ onClick: () => {
11888
+ setAgeConfirmed(true);
11889
+ setError("");
11890
+ },
11891
+ style: {
11892
+ flex: 1,
11893
+ padding: "0.75vw 1vw",
11894
+ borderRadius: "999px",
11895
+ background: "var(--ps-accent)",
11896
+ color: "#FFFFFF",
11897
+ border: "1.5px solid var(--ps-accent)",
11898
+ fontFamily: "inherit",
11899
+ fontSize: "0.78vw",
11900
+ fontWeight: 700,
11901
+ cursor: "pointer",
11902
+ transition: "transform 0.18s, background 0.18s"
11903
+ },
11904
+ children: t("Yes, 18 or older")
11905
+ }
11906
+ ),
11907
+ /* @__PURE__ */ jsx(
11908
+ "button",
11909
+ {
11910
+ type: "button",
11911
+ onClick: () => setAgeConfirmed(false),
11912
+ style: {
11913
+ flex: 1,
11914
+ padding: "0.75vw 1vw",
11915
+ borderRadius: "999px",
11916
+ background: "transparent",
11917
+ color: "var(--ps-text-primary)",
11918
+ border: "1.5px solid var(--ps-border-color)",
11919
+ fontFamily: "inherit",
11920
+ fontSize: "0.78vw",
11921
+ fontWeight: 700,
11922
+ cursor: "pointer",
11923
+ transition: "background 0.18s, border-color 0.18s"
11924
+ },
11925
+ children: t("No, under 18")
11926
+ }
11927
+ )
11928
+ ] })
11929
+ ] })
11930
+ }
11931
+ ),
11932
+ !photoPreview && ageConfirmed === false && /* @__PURE__ */ jsx(
11933
+ "div",
11934
+ {
11935
+ role: "alert",
11936
+ style: {
11937
+ position: "absolute",
11938
+ inset: 0,
11939
+ display: "flex",
11940
+ alignItems: "center",
11941
+ justifyContent: "center",
11942
+ padding: "1vw",
11943
+ background: "rgba(255,255,255,0.55)",
11944
+ backdropFilter: "blur(8px)",
11945
+ WebkitBackdropFilter: "blur(8px)",
11946
+ borderRadius: "0.5vw",
11947
+ zIndex: 2
11948
+ },
11949
+ children: /* @__PURE__ */ jsxs("div", { style: {
11950
+ width: "100%",
11951
+ maxWidth: "min(420px, 22vw)",
11952
+ padding: "1.4vw 1.6vw",
11953
+ background: "#FFFFFF",
11954
+ border: "1px solid rgba(192,38,38,0.35)",
11955
+ borderRadius: "0.9vw",
11956
+ boxShadow: "0 20px 40px -12px rgba(17,24,39,0.25)",
11957
+ display: "flex",
11958
+ flexDirection: "column",
11959
+ alignItems: "center",
11960
+ textAlign: "center",
11961
+ gap: "0.75vw"
11962
+ }, children: [
11963
+ /* @__PURE__ */ jsx("div", { style: { fontSize: "0.62vw", fontWeight: 700, letterSpacing: "0.18em", textTransform: "uppercase", color: "#C02626" }, children: t("UPLOAD NOT ALLOWED") }),
11964
+ /* @__PURE__ */ jsx("div", { style: { fontSize: "0.95vw", fontWeight: 600, lineHeight: 1.35, color: "var(--ps-text-primary)" }, children: t("For your safety, we cannot process photos of people under 18.") }),
11965
+ /* @__PURE__ */ jsx(
11966
+ "button",
11967
+ {
11968
+ type: "button",
11969
+ onClick: () => setAgeConfirmed(null),
11970
+ style: {
11971
+ padding: "0.75vw 1.4vw",
11972
+ borderRadius: "999px",
11973
+ background: "transparent",
11974
+ color: "var(--ps-text-primary)",
11975
+ border: "1.5px solid var(--ps-border-color)",
11976
+ fontFamily: "inherit",
11977
+ fontSize: "0.78vw",
11978
+ fontWeight: 700,
11979
+ cursor: "pointer"
11980
+ },
11981
+ children: t("Go back")
11982
+ }
11983
+ )
11984
+ ] })
11985
+ }
11986
+ )
11987
+ ] }),
11835
11988
  /* @__PURE__ */ jsxs("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "0.6vw", justifyContent: "center" }, children: [
11836
11989
  /* @__PURE__ */ jsx("div", { style: { fontSize: "0.85vw", fontWeight: 700, color: "var(--ps-text-primary)", marginBottom: "0.3vw" }, children: t("How to take the best photo") }),
11837
11990
  /* @__PURE__ */ jsxs("div", { style: { background: "#ddfbe7", borderRadius: "0.5vw", padding: "0.6vw 0.8vw" }, children: [
@@ -11874,6 +12027,21 @@ function BodyProfileView({
11874
12027
  /* @__PURE__ */ jsx("span", { style: { color: "#3267c3", fontSize: "0.65vw", fontWeight: 600 }, children: t("Quick Tip") })
11875
12028
  ] }),
11876
12029
  /* @__PURE__ */ jsx("div", { style: { fontSize: "0.58vw", color: "var(--ps-text-primary)", lineHeight: 1.6 }, children: t("The simpler your photo is, the more accurate your virtual try-on results will be.") })
12030
+ ] }),
12031
+ /* @__PURE__ */ jsxs("div", { style: {
12032
+ background: "rgba(33, 84, 239, 0.04)",
12033
+ border: "1px solid rgba(33, 84, 239, 0.16)",
12034
+ borderRadius: "0.5vw",
12035
+ padding: "0.6vw 0.8vw",
12036
+ display: "flex",
12037
+ flexDirection: "column",
12038
+ gap: "0.3vw"
12039
+ }, children: [
12040
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.35vw" }, children: [
12041
+ /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "0.75vw", height: "0.75vw", fill: "none", stroke: "#2154ef", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }) }),
12042
+ /* @__PURE__ */ jsx("span", { style: { color: "#2154ef", fontSize: "0.62vw", fontWeight: 700, letterSpacing: "0.12em", textTransform: "uppercase" }, children: t("Legal Notice") })
12043
+ ] }),
12044
+ /* @__PURE__ */ jsx("div", { style: { fontSize: "0.58vw", color: "var(--ps-text-secondary)", lineHeight: 1.55 }, children: t("Your image will be used to generate a virtual try-on preview showing how selected items may look and fit. Images are processed securely and are not stored after generation.") })
11877
12045
  ] })
11878
12046
  ] })
11879
12047
  ] }),
package/dist/storefront/primestyle-tryon.js CHANGED
@@ -21012,6 +21012,7 @@ function BodyProfileView({
21012
21012
  const [photoBase64, setPhotoBase64] = reactExports.useState(null);
21013
21013
  const [photoProcessing, setPhotoProcessing] = reactExports.useState(false);
21014
21014
  const fileInputRef = reactExports.useRef(null);
21015
+ const [ageConfirmed, setAgeConfirmed] = reactExports.useState(null);
21015
21016
  const [photoStepHeight, setPhotoStepHeight] = reactExports.useState(() => {
21016
21017
  if (seedTotalIn != null) return String(Math.round(seedTotalIn * 2.54));
21017
21018
  return seedHeightCm;
@@ -21036,6 +21037,10 @@ function BodyProfileView({
21036
21037
  const handlePhotoSelect = reactExports.useCallback(async (e) => {
21037
21038
  const file = e.target.files?.[0];
21038
21039
  if (!file) return;
21040
+ if (ageConfirmed !== true) {
21041
+ setError(t2("Please confirm that the person in the photo is 18 or older before uploading."));
21042
+ return;
21043
+ }
21039
21044
  if (!file.type.startsWith("image/")) {
21040
21045
  setError(t2("Please upload an image file"));
21041
21046
  return;
@@ -21058,7 +21063,7 @@ function BodyProfileView({
21058
21063
  } finally {
21059
21064
  setPhotoProcessing(false);
21060
21065
  }
21061
- }, [t2]);
21066
+ }, [t2, ageConfirmed]);
21062
21067
  const handleRemovePhoto = reactExports.useCallback(() => {
21063
21068
  if (photoPreview) URL.revokeObjectURL(photoPreview);
21064
21069
  setPhotoFile(null);
@@ -21224,38 +21229,186 @@ function BodyProfileView({
21224
21229
  }
21225
21230
  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-bp-wrapper", children: [
21226
21231
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", gap: "1.2vw", padding: "1.5vw", width: "100%", height: "100%", minHeight: "20vw", alignItems: "stretch" }, children: [
21227
- /* @__PURE__ */ jsxRuntimeExports.jsx(
21228
- "div",
21229
- {
21230
- onClick: () => !photoPreview && fileInputRef.current?.click(),
21231
- style: {
21232
- flex: 1,
21233
- display: "flex",
21234
- flexDirection: "column",
21235
- alignItems: "center",
21236
- justifyContent: "center",
21237
- border: photoPreview ? "2px solid var(--ps-accent)" : "2px dashed var(--ps-border-color)",
21238
- borderRadius: "0.5vw",
21239
- cursor: photoPreview ? "default" : "pointer",
21240
- position: "relative",
21241
- background: "var(--ps-bg-secondary)",
21242
- transition: "border-color 0.2s",
21243
- overflow: "hidden"
21244
- },
21245
- children: photoPreview ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
21246
- /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: photoPreview, alt: "preview", style: { width: "100%", height: "100%", objectFit: "contain" } }),
21247
- /* @__PURE__ */ jsxRuntimeExports.jsx("button", { onClick: (e) => {
21248
- e.stopPropagation();
21249
- handleRemovePhoto();
21250
- }, style: { position: "absolute", top: "0.5vw", right: "0.5vw", width: "1.4vw", height: "1.4vw", borderRadius: "50%", background: "rgba(0,0,0,0.6)", border: "none", color: "#fff", fontSize: "0.7vw", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center" }, children: "×" })
21251
- ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
21252
- /* @__PURE__ */ jsxRuntimeExports.jsx(UploadIcon, { size: 32 }),
21253
- /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "0.85vw", fontWeight: 600, color: "var(--ps-text-primary)", marginTop: "0.5vw" }, children: t2("Upload your photo") }),
21254
- /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "0.6vw", color: "var(--ps-text-muted)", marginTop: "0.2vw" }, children: t2("Click or drag a full-body photo") }),
21255
- /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "0.5vw", color: "var(--ps-text-dim)", marginTop: "0.4vw" }, children: "JPEG, PNG (max 10MB)" })
21256
- ] })
21257
- }
21258
- ),
21232
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { flex: 1, position: "relative", display: "flex" }, children: [
21233
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
21234
+ "div",
21235
+ {
21236
+ onClick: () => {
21237
+ if (!photoPreview && ageConfirmed === true) fileInputRef.current?.click();
21238
+ },
21239
+ style: {
21240
+ flex: 1,
21241
+ display: "flex",
21242
+ flexDirection: "column",
21243
+ alignItems: "center",
21244
+ justifyContent: "center",
21245
+ border: photoPreview ? "2px solid var(--ps-accent)" : "2px dashed var(--ps-border-color)",
21246
+ borderRadius: "0.5vw",
21247
+ cursor: photoPreview ? "default" : ageConfirmed === true ? "pointer" : "not-allowed",
21248
+ position: "relative",
21249
+ background: "var(--ps-bg-secondary)",
21250
+ transition: "border-color 0.2s, filter 0.25s",
21251
+ overflow: "hidden",
21252
+ filter: !photoPreview && ageConfirmed !== true ? "blur(6px) saturate(0.7)" : void 0,
21253
+ pointerEvents: !photoPreview && ageConfirmed !== true ? "none" : void 0,
21254
+ userSelect: !photoPreview && ageConfirmed !== true ? "none" : void 0
21255
+ },
21256
+ "aria-hidden": !photoPreview && ageConfirmed !== true,
21257
+ children: photoPreview ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
21258
+ /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: photoPreview, alt: "preview", style: { width: "100%", height: "100%", objectFit: "contain" } }),
21259
+ /* @__PURE__ */ jsxRuntimeExports.jsx("button", { onClick: (e) => {
21260
+ e.stopPropagation();
21261
+ handleRemovePhoto();
21262
+ }, style: { position: "absolute", top: "0.5vw", right: "0.5vw", width: "1.4vw", height: "1.4vw", borderRadius: "50%", background: "rgba(0,0,0,0.6)", border: "none", color: "#fff", fontSize: "0.7vw", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center" }, children: "×" })
21263
+ ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
21264
+ /* @__PURE__ */ jsxRuntimeExports.jsx(UploadIcon, { size: 32 }),
21265
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "0.85vw", fontWeight: 600, color: "var(--ps-text-primary)", marginTop: "0.5vw" }, children: t2("Upload your photo") }),
21266
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "0.6vw", color: "var(--ps-text-muted)", marginTop: "0.2vw" }, children: t2("Click or drag a full-body photo") }),
21267
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: "0.5vw", color: "var(--ps-text-dim)", marginTop: "0.4vw" }, children: "JPEG, PNG (max 10MB)" })
21268
+ ] })
21269
+ }
21270
+ ),
21271
+ !photoPreview && ageConfirmed === null && /* @__PURE__ */ jsxRuntimeExports.jsx(
21272
+ "div",
21273
+ {
21274
+ role: "dialog",
21275
+ "aria-labelledby": "ps-bp-age-q",
21276
+ style: {
21277
+ position: "absolute",
21278
+ inset: 0,
21279
+ display: "flex",
21280
+ alignItems: "center",
21281
+ justifyContent: "center",
21282
+ padding: "1vw",
21283
+ background: "rgba(255,255,255,0.55)",
21284
+ backdropFilter: "blur(8px)",
21285
+ WebkitBackdropFilter: "blur(8px)",
21286
+ borderRadius: "0.5vw",
21287
+ zIndex: 2,
21288
+ animation: "ps-cpw-age-gate-in 0.28s ease-out both"
21289
+ },
21290
+ children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: {
21291
+ width: "100%",
21292
+ maxWidth: "min(420px, 22vw)",
21293
+ padding: "1.4vw 1.6vw",
21294
+ background: "#FFFFFF",
21295
+ border: "1px solid var(--ps-border-subtle)",
21296
+ borderRadius: "0.9vw",
21297
+ boxShadow: "0 20px 40px -12px rgba(17,24,39,0.25), 0 8px 16px -8px rgba(17,24,39,0.15)",
21298
+ display: "flex",
21299
+ flexDirection: "column",
21300
+ alignItems: "center",
21301
+ textAlign: "center",
21302
+ gap: "0.75vw"
21303
+ }, children: [
21304
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: "0.62vw", fontWeight: 700, letterSpacing: "0.18em", textTransform: "uppercase", color: "var(--ps-accent)" }, children: t2("AGE VERIFICATION") }),
21305
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { id: "ps-bp-age-q", style: { fontSize: "0.95vw", fontWeight: 600, lineHeight: 1.35, color: "var(--ps-text-primary)" }, children: t2("Is the person in this photo 18 years or older?") }),
21306
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", gap: "0.65vw", width: "100%", marginTop: "0.4vw" }, children: [
21307
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
21308
+ "button",
21309
+ {
21310
+ type: "button",
21311
+ onClick: () => {
21312
+ setAgeConfirmed(true);
21313
+ setError("");
21314
+ },
21315
+ style: {
21316
+ flex: 1,
21317
+ padding: "0.75vw 1vw",
21318
+ borderRadius: "999px",
21319
+ background: "var(--ps-accent)",
21320
+ color: "#FFFFFF",
21321
+ border: "1.5px solid var(--ps-accent)",
21322
+ fontFamily: "inherit",
21323
+ fontSize: "0.78vw",
21324
+ fontWeight: 700,
21325
+ cursor: "pointer",
21326
+ transition: "transform 0.18s, background 0.18s"
21327
+ },
21328
+ children: t2("Yes, 18 or older")
21329
+ }
21330
+ ),
21331
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
21332
+ "button",
21333
+ {
21334
+ type: "button",
21335
+ onClick: () => setAgeConfirmed(false),
21336
+ style: {
21337
+ flex: 1,
21338
+ padding: "0.75vw 1vw",
21339
+ borderRadius: "999px",
21340
+ background: "transparent",
21341
+ color: "var(--ps-text-primary)",
21342
+ border: "1.5px solid var(--ps-border-color)",
21343
+ fontFamily: "inherit",
21344
+ fontSize: "0.78vw",
21345
+ fontWeight: 700,
21346
+ cursor: "pointer",
21347
+ transition: "background 0.18s, border-color 0.18s"
21348
+ },
21349
+ children: t2("No, under 18")
21350
+ }
21351
+ )
21352
+ ] })
21353
+ ] })
21354
+ }
21355
+ ),
21356
+ !photoPreview && ageConfirmed === false && /* @__PURE__ */ jsxRuntimeExports.jsx(
21357
+ "div",
21358
+ {
21359
+ role: "alert",
21360
+ style: {
21361
+ position: "absolute",
21362
+ inset: 0,
21363
+ display: "flex",
21364
+ alignItems: "center",
21365
+ justifyContent: "center",
21366
+ padding: "1vw",
21367
+ background: "rgba(255,255,255,0.55)",
21368
+ backdropFilter: "blur(8px)",
21369
+ WebkitBackdropFilter: "blur(8px)",
21370
+ borderRadius: "0.5vw",
21371
+ zIndex: 2
21372
+ },
21373
+ children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: {
21374
+ width: "100%",
21375
+ maxWidth: "min(420px, 22vw)",
21376
+ padding: "1.4vw 1.6vw",
21377
+ background: "#FFFFFF",
21378
+ border: "1px solid rgba(192,38,38,0.35)",
21379
+ borderRadius: "0.9vw",
21380
+ boxShadow: "0 20px 40px -12px rgba(17,24,39,0.25)",
21381
+ display: "flex",
21382
+ flexDirection: "column",
21383
+ alignItems: "center",
21384
+ textAlign: "center",
21385
+ gap: "0.75vw"
21386
+ }, children: [
21387
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: "0.62vw", fontWeight: 700, letterSpacing: "0.18em", textTransform: "uppercase", color: "#C02626" }, children: t2("UPLOAD NOT ALLOWED") }),
21388
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: "0.95vw", fontWeight: 600, lineHeight: 1.35, color: "var(--ps-text-primary)" }, children: t2("For your safety, we cannot process photos of people under 18.") }),
21389
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
21390
+ "button",
21391
+ {
21392
+ type: "button",
21393
+ onClick: () => setAgeConfirmed(null),
21394
+ style: {
21395
+ padding: "0.75vw 1.4vw",
21396
+ borderRadius: "999px",
21397
+ background: "transparent",
21398
+ color: "var(--ps-text-primary)",
21399
+ border: "1.5px solid var(--ps-border-color)",
21400
+ fontFamily: "inherit",
21401
+ fontSize: "0.78vw",
21402
+ fontWeight: 700,
21403
+ cursor: "pointer"
21404
+ },
21405
+ children: t2("Go back")
21406
+ }
21407
+ )
21408
+ ] })
21409
+ }
21410
+ )
21411
+ ] }),
21259
21412
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "0.6vw", justifyContent: "center" }, children: [
21260
21413
  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: "0.85vw", fontWeight: 700, color: "var(--ps-text-primary)", marginBottom: "0.3vw" }, children: t2("How to take the best photo") }),
21261
21414
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { background: "#ddfbe7", borderRadius: "0.5vw", padding: "0.6vw 0.8vw" }, children: [
@@ -21298,6 +21451,21 @@ function BodyProfileView({
21298
21451
  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "#3267c3", fontSize: "0.65vw", fontWeight: 600 }, children: t2("Quick Tip") })
21299
21452
  ] }),
21300
21453
  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: "0.58vw", color: "var(--ps-text-primary)", lineHeight: 1.6 }, children: t2("The simpler your photo is, the more accurate your virtual try-on results will be.") })
21454
+ ] }),
21455
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: {
21456
+ background: "rgba(33, 84, 239, 0.04)",
21457
+ border: "1px solid rgba(33, 84, 239, 0.16)",
21458
+ borderRadius: "0.5vw",
21459
+ padding: "0.6vw 0.8vw",
21460
+ display: "flex",
21461
+ flexDirection: "column",
21462
+ gap: "0.3vw"
21463
+ }, children: [
21464
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.35vw" }, children: [
21465
+ /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { viewBox: "0 0 24 24", width: "0.75vw", height: "0.75vw", fill: "none", stroke: "#2154ef", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }) }),
21466
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "#2154ef", fontSize: "0.62vw", fontWeight: 700, letterSpacing: "0.12em", textTransform: "uppercase" }, children: t2("Legal Notice") })
21467
+ ] }),
21468
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: "0.58vw", color: "var(--ps-text-secondary)", lineHeight: 1.55 }, children: t2("Your image will be used to generate a virtual try-on preview showing how selected items may look and fit. Images are processed securely and are not stored after generation.") })
21301
21469
  ] })
21302
21470
  ] })
21303
21471
  ] }),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primestyleai/tryon",
3
- "version": "5.8.40",
3
+ "version": "5.8.41",
4
4
  "description": "PrimeStyle Virtual Try-On SDK — React component & Web Component",
5
5
  "type": "module",
6
6
  "main": "dist/primestyle-tryon.js",