@nok-integration/storefront-react 0.19.30 → 0.19.32
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/index.d.ts +63 -0
- package/dist/index.mjs +28 -11
- package/dist/standalone/storefront.mjs +28 -11
- package/package.json +28 -9
package/dist/index.d.ts
CHANGED
|
@@ -444,6 +444,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
444
444
|
currency: string;
|
|
445
445
|
}>>;
|
|
446
446
|
media: z.ZodArray<z.ZodString, "many">;
|
|
447
|
+
media_by_colour: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodArray<z.ZodString, "many">>>;
|
|
447
448
|
variants: z.ZodArray<z.ZodObject<{
|
|
448
449
|
sku: z.ZodString;
|
|
449
450
|
attributes: z.ZodRecord<z.ZodString, z.ZodString>;
|
|
@@ -542,6 +543,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
542
543
|
amount: number;
|
|
543
544
|
currency: string;
|
|
544
545
|
} | undefined;
|
|
546
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
545
547
|
badges?: string[] | undefined;
|
|
546
548
|
promo?: {
|
|
547
549
|
message: string;
|
|
@@ -582,6 +584,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
582
584
|
amount: number;
|
|
583
585
|
currency: string;
|
|
584
586
|
} | undefined;
|
|
587
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
585
588
|
badges?: string[] | undefined;
|
|
586
589
|
promo?: {
|
|
587
590
|
message: string;
|
|
@@ -626,6 +629,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
626
629
|
amount: number;
|
|
627
630
|
currency: string;
|
|
628
631
|
} | undefined;
|
|
632
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
629
633
|
badges?: string[] | undefined;
|
|
630
634
|
promo?: {
|
|
631
635
|
message: string;
|
|
@@ -670,6 +674,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
670
674
|
amount: number;
|
|
671
675
|
currency: string;
|
|
672
676
|
} | undefined;
|
|
677
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
673
678
|
badges?: string[] | undefined;
|
|
674
679
|
promo?: {
|
|
675
680
|
message: string;
|
|
@@ -730,6 +735,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
730
735
|
currency: string;
|
|
731
736
|
}>>;
|
|
732
737
|
media: z.ZodArray<z.ZodString, "many">;
|
|
738
|
+
media_by_colour: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodArray<z.ZodString, "many">>>;
|
|
733
739
|
variants: z.ZodArray<z.ZodObject<{
|
|
734
740
|
sku: z.ZodString;
|
|
735
741
|
attributes: z.ZodRecord<z.ZodString, z.ZodString>;
|
|
@@ -828,6 +834,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
828
834
|
amount: number;
|
|
829
835
|
currency: string;
|
|
830
836
|
} | undefined;
|
|
837
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
831
838
|
badges?: string[] | undefined;
|
|
832
839
|
promo?: {
|
|
833
840
|
message: string;
|
|
@@ -868,6 +875,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
868
875
|
amount: number;
|
|
869
876
|
currency: string;
|
|
870
877
|
} | undefined;
|
|
878
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
871
879
|
badges?: string[] | undefined;
|
|
872
880
|
promo?: {
|
|
873
881
|
message: string;
|
|
@@ -911,6 +919,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
911
919
|
amount: number;
|
|
912
920
|
currency: string;
|
|
913
921
|
} | undefined;
|
|
922
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
914
923
|
badges?: string[] | undefined;
|
|
915
924
|
promo?: {
|
|
916
925
|
message: string;
|
|
@@ -955,6 +964,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
955
964
|
amount: number;
|
|
956
965
|
currency: string;
|
|
957
966
|
} | undefined;
|
|
967
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
958
968
|
badges?: string[] | undefined;
|
|
959
969
|
promo?: {
|
|
960
970
|
message: string;
|
|
@@ -1004,6 +1014,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1004
1014
|
currency: string;
|
|
1005
1015
|
}>>;
|
|
1006
1016
|
media: z.ZodArray<z.ZodString, "many">;
|
|
1017
|
+
media_by_colour: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodArray<z.ZodString, "many">>>;
|
|
1007
1018
|
variants: z.ZodArray<z.ZodObject<{
|
|
1008
1019
|
sku: z.ZodString;
|
|
1009
1020
|
attributes: z.ZodRecord<z.ZodString, z.ZodString>;
|
|
@@ -1102,6 +1113,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1102
1113
|
amount: number;
|
|
1103
1114
|
currency: string;
|
|
1104
1115
|
} | undefined;
|
|
1116
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1105
1117
|
badges?: string[] | undefined;
|
|
1106
1118
|
promo?: {
|
|
1107
1119
|
message: string;
|
|
@@ -1142,6 +1154,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1142
1154
|
amount: number;
|
|
1143
1155
|
currency: string;
|
|
1144
1156
|
} | undefined;
|
|
1157
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1145
1158
|
badges?: string[] | undefined;
|
|
1146
1159
|
promo?: {
|
|
1147
1160
|
message: string;
|
|
@@ -1186,6 +1199,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1186
1199
|
amount: number;
|
|
1187
1200
|
currency: string;
|
|
1188
1201
|
} | undefined;
|
|
1202
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1189
1203
|
badges?: string[] | undefined;
|
|
1190
1204
|
promo?: {
|
|
1191
1205
|
message: string;
|
|
@@ -1230,6 +1244,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1230
1244
|
amount: number;
|
|
1231
1245
|
currency: string;
|
|
1232
1246
|
} | undefined;
|
|
1247
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1233
1248
|
badges?: string[] | undefined;
|
|
1234
1249
|
promo?: {
|
|
1235
1250
|
message: string;
|
|
@@ -1290,6 +1305,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1290
1305
|
currency: string;
|
|
1291
1306
|
}>>;
|
|
1292
1307
|
media: z.ZodArray<z.ZodString, "many">;
|
|
1308
|
+
media_by_colour: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodArray<z.ZodString, "many">>>;
|
|
1293
1309
|
variants: z.ZodArray<z.ZodObject<{
|
|
1294
1310
|
sku: z.ZodString;
|
|
1295
1311
|
attributes: z.ZodRecord<z.ZodString, z.ZodString>;
|
|
@@ -1388,6 +1404,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1388
1404
|
amount: number;
|
|
1389
1405
|
currency: string;
|
|
1390
1406
|
} | undefined;
|
|
1407
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1391
1408
|
badges?: string[] | undefined;
|
|
1392
1409
|
promo?: {
|
|
1393
1410
|
message: string;
|
|
@@ -1428,6 +1445,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1428
1445
|
amount: number;
|
|
1429
1446
|
currency: string;
|
|
1430
1447
|
} | undefined;
|
|
1448
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1431
1449
|
badges?: string[] | undefined;
|
|
1432
1450
|
promo?: {
|
|
1433
1451
|
message: string;
|
|
@@ -1471,6 +1489,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1471
1489
|
amount: number;
|
|
1472
1490
|
currency: string;
|
|
1473
1491
|
} | undefined;
|
|
1492
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1474
1493
|
badges?: string[] | undefined;
|
|
1475
1494
|
promo?: {
|
|
1476
1495
|
message: string;
|
|
@@ -1515,6 +1534,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1515
1534
|
amount: number;
|
|
1516
1535
|
currency: string;
|
|
1517
1536
|
} | undefined;
|
|
1537
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1518
1538
|
badges?: string[] | undefined;
|
|
1519
1539
|
promo?: {
|
|
1520
1540
|
message: string;
|
|
@@ -1651,6 +1671,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1651
1671
|
amount: number;
|
|
1652
1672
|
currency: string;
|
|
1653
1673
|
} | undefined;
|
|
1674
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1654
1675
|
badges?: string[] | undefined;
|
|
1655
1676
|
promo?: {
|
|
1656
1677
|
message: string;
|
|
@@ -1698,6 +1719,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1698
1719
|
amount: number;
|
|
1699
1720
|
currency: string;
|
|
1700
1721
|
} | undefined;
|
|
1722
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1701
1723
|
badges?: string[] | undefined;
|
|
1702
1724
|
promo?: {
|
|
1703
1725
|
message: string;
|
|
@@ -1746,6 +1768,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1746
1768
|
amount: number;
|
|
1747
1769
|
currency: string;
|
|
1748
1770
|
} | undefined;
|
|
1771
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1749
1772
|
badges?: string[] | undefined;
|
|
1750
1773
|
promo?: {
|
|
1751
1774
|
message: string;
|
|
@@ -1812,6 +1835,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1812
1835
|
amount: number;
|
|
1813
1836
|
currency: string;
|
|
1814
1837
|
} | undefined;
|
|
1838
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1815
1839
|
badges?: string[] | undefined;
|
|
1816
1840
|
promo?: {
|
|
1817
1841
|
message: string;
|
|
@@ -1864,6 +1888,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1864
1888
|
amount: number;
|
|
1865
1889
|
currency: string;
|
|
1866
1890
|
} | undefined;
|
|
1891
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1867
1892
|
badges?: string[] | undefined;
|
|
1868
1893
|
promo?: {
|
|
1869
1894
|
message: string;
|
|
@@ -1911,6 +1936,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1911
1936
|
amount: number;
|
|
1912
1937
|
currency: string;
|
|
1913
1938
|
} | undefined;
|
|
1939
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1914
1940
|
badges?: string[] | undefined;
|
|
1915
1941
|
promo?: {
|
|
1916
1942
|
message: string;
|
|
@@ -1959,6 +1985,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
1959
1985
|
amount: number;
|
|
1960
1986
|
currency: string;
|
|
1961
1987
|
} | undefined;
|
|
1988
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
1962
1989
|
badges?: string[] | undefined;
|
|
1963
1990
|
promo?: {
|
|
1964
1991
|
message: string;
|
|
@@ -2025,6 +2052,7 @@ declare const CategoryPage: z.ZodObject<{
|
|
|
2025
2052
|
amount: number;
|
|
2026
2053
|
currency: string;
|
|
2027
2054
|
} | undefined;
|
|
2055
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
2028
2056
|
badges?: string[] | undefined;
|
|
2029
2057
|
promo?: {
|
|
2030
2058
|
message: string;
|
|
@@ -2163,6 +2191,7 @@ declare function createClient(options: ClientOptions): {
|
|
|
2163
2191
|
amount: number;
|
|
2164
2192
|
currency: string;
|
|
2165
2193
|
} | undefined;
|
|
2194
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
2166
2195
|
badges?: string[] | undefined;
|
|
2167
2196
|
promo?: {
|
|
2168
2197
|
message: string;
|
|
@@ -2209,6 +2238,7 @@ declare function createClient(options: ClientOptions): {
|
|
|
2209
2238
|
amount: number;
|
|
2210
2239
|
currency: string;
|
|
2211
2240
|
} | undefined;
|
|
2241
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
2212
2242
|
badges?: string[] | undefined;
|
|
2213
2243
|
promo?: {
|
|
2214
2244
|
message: string;
|
|
@@ -2251,6 +2281,7 @@ declare function createClient(options: ClientOptions): {
|
|
|
2251
2281
|
amount: number;
|
|
2252
2282
|
currency: string;
|
|
2253
2283
|
} | undefined;
|
|
2284
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
2254
2285
|
badges?: string[] | undefined;
|
|
2255
2286
|
promo?: {
|
|
2256
2287
|
message: string;
|
|
@@ -2315,6 +2346,7 @@ declare function createClient(options: ClientOptions): {
|
|
|
2315
2346
|
amount: number;
|
|
2316
2347
|
currency: string;
|
|
2317
2348
|
} | undefined;
|
|
2349
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
2318
2350
|
badges?: string[] | undefined;
|
|
2319
2351
|
promo?: {
|
|
2320
2352
|
message: string;
|
|
@@ -2362,6 +2394,7 @@ declare function createClient(options: ClientOptions): {
|
|
|
2362
2394
|
amount: number;
|
|
2363
2395
|
currency: string;
|
|
2364
2396
|
} | undefined;
|
|
2397
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
2365
2398
|
badges?: string[] | undefined;
|
|
2366
2399
|
promo?: {
|
|
2367
2400
|
message: string;
|
|
@@ -2410,6 +2443,7 @@ declare function createClient(options: ClientOptions): {
|
|
|
2410
2443
|
amount: number;
|
|
2411
2444
|
currency: string;
|
|
2412
2445
|
} | undefined;
|
|
2446
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
2413
2447
|
badges?: string[] | undefined;
|
|
2414
2448
|
promo?: {
|
|
2415
2449
|
message: string;
|
|
@@ -2476,6 +2510,7 @@ declare function createClient(options: ClientOptions): {
|
|
|
2476
2510
|
amount: number;
|
|
2477
2511
|
currency: string;
|
|
2478
2512
|
} | undefined;
|
|
2513
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
2479
2514
|
badges?: string[] | undefined;
|
|
2480
2515
|
promo?: {
|
|
2481
2516
|
message: string;
|
|
@@ -4341,6 +4376,15 @@ export declare interface OrderTrackingViewProps {
|
|
|
4341
4376
|
* "Start a return" row is there for a fan whether you route it or not.
|
|
4342
4377
|
*/
|
|
4343
4378
|
onStartReturn?: () => void;
|
|
4379
|
+
/**
|
|
4380
|
+
* Open an EXISTING return's progress on a route of your own.
|
|
4381
|
+
*
|
|
4382
|
+
* Optional, and optional in the way every handler here is: it customises where the row
|
|
4383
|
+
* goes, it does not decide whether the row is drawn. The rows follow `order.returns`
|
|
4384
|
+
* from the engine and nothing else. Omit this and the return opens in place, exactly as
|
|
4385
|
+
* starting one does.
|
|
4386
|
+
*/
|
|
4387
|
+
onOpenReturn?: (returnRef: string) => void;
|
|
4344
4388
|
/**
|
|
4345
4389
|
* Called once the fan has confirmed a cancellation and the engine has accepted it,
|
|
4346
4390
|
* with the order as it now stands. The screen redraws itself either way; this is for a
|
|
@@ -4531,6 +4575,23 @@ declare const Product: z.ZodObject<{
|
|
|
4531
4575
|
currency: string;
|
|
4532
4576
|
}>>;
|
|
4533
4577
|
media: z.ZodArray<z.ZodString, "many">;
|
|
4578
|
+
/**
|
|
4579
|
+
* Which of `media` belongs to which colourway, keyed on the colour's attribute value.
|
|
4580
|
+
*
|
|
4581
|
+
* **`media` stays the whole ordered list and is unchanged**, so a consumer that ignores
|
|
4582
|
+
* this shows exactly what it showed before. This says only which shots are *about* a
|
|
4583
|
+
* colour; a URL in no bucket is colour-neutral — a flat-lay, a fabric detail, a size
|
|
4584
|
+
* chart — and belongs to every colourway.
|
|
4585
|
+
*
|
|
4586
|
+
* It exists because a colour selector cannot filter a gallery without it. `media` is a
|
|
4587
|
+
* flat list with no attribution, and it is not colour-neutral in practice: a merged
|
|
4588
|
+
* product inherits the photography of whichever colourway it was merged from, so the
|
|
4589
|
+
* black shots were being shown under White. Filtering on a guess about which colour an
|
|
4590
|
+
* unattributed shot depicts is the thing this replaces.
|
|
4591
|
+
*
|
|
4592
|
+
* Absent entirely for a product with no colourways, which is most of them.
|
|
4593
|
+
*/
|
|
4594
|
+
media_by_colour: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodArray<z.ZodString, "many">>>;
|
|
4534
4595
|
variants: z.ZodArray<z.ZodObject<{
|
|
4535
4596
|
sku: z.ZodString;
|
|
4536
4597
|
attributes: z.ZodRecord<z.ZodString, z.ZodString>;
|
|
@@ -4669,6 +4730,7 @@ declare const Product: z.ZodObject<{
|
|
|
4669
4730
|
amount: number;
|
|
4670
4731
|
currency: string;
|
|
4671
4732
|
} | undefined;
|
|
4733
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
4672
4734
|
badges?: string[] | undefined;
|
|
4673
4735
|
promo?: {
|
|
4674
4736
|
message: string;
|
|
@@ -4709,6 +4771,7 @@ declare const Product: z.ZodObject<{
|
|
|
4709
4771
|
amount: number;
|
|
4710
4772
|
currency: string;
|
|
4711
4773
|
} | undefined;
|
|
4774
|
+
media_by_colour?: Record<string, string[]> | undefined;
|
|
4712
4775
|
badges?: string[] | undefined;
|
|
4713
4776
|
promo?: {
|
|
4714
4777
|
message: string;
|
package/dist/index.mjs
CHANGED
|
@@ -4286,6 +4286,7 @@ function requireCatalog() {
|
|
|
4286
4286
|
price: money_1.Money,
|
|
4287
4287
|
compare_at: money_1.Money.optional(),
|
|
4288
4288
|
media: zod_1.z.array(common_1.Url),
|
|
4289
|
+
media_by_colour: zod_1.z.record(zod_1.z.string(), zod_1.z.array(common_1.Url)).optional(),
|
|
4289
4290
|
variants: zod_1.z.array(exports.ProductVariant),
|
|
4290
4291
|
description: zod_1.z.string().optional(),
|
|
4291
4292
|
badges: zod_1.z.array(zod_1.z.string()).optional(),
|
|
@@ -7564,11 +7565,14 @@ function ChevronRight$1() {
|
|
|
7564
7565
|
});
|
|
7565
7566
|
}
|
|
7566
7567
|
function OrderTrackingView(props) {
|
|
7567
|
-
const [
|
|
7568
|
-
if (
|
|
7568
|
+
const [flow, setFlow] = useState(null);
|
|
7569
|
+
if (flow !== null) {
|
|
7569
7570
|
return jsx(ReturnFlowView, {
|
|
7570
7571
|
orderRef: props.orderRef,
|
|
7571
|
-
|
|
7572
|
+
...flow ? {
|
|
7573
|
+
returnRef: flow
|
|
7574
|
+
} : {},
|
|
7575
|
+
onDone: () => setFlow(null)
|
|
7572
7576
|
});
|
|
7573
7577
|
}
|
|
7574
7578
|
return jsx(ShopSurface, {
|
|
@@ -7576,11 +7580,12 @@ function OrderTrackingView(props) {
|
|
|
7576
7580
|
fill: true,
|
|
7577
7581
|
children: jsx(OrderTrackingContent, {
|
|
7578
7582
|
...props,
|
|
7579
|
-
onStartReturn: props.onStartReturn ?? (() =>
|
|
7583
|
+
onStartReturn: props.onStartReturn ?? (() => setFlow("")),
|
|
7584
|
+
onOpenReturn: props.onOpenReturn ?? ((returnRef) => setFlow(returnRef))
|
|
7580
7585
|
})
|
|
7581
7586
|
});
|
|
7582
7587
|
}
|
|
7583
|
-
function OrderTrackingContent({ orderRef, locale: localeProp, onStartReturn, onContactSupport, onCancelled, onReorder }) {
|
|
7588
|
+
function OrderTrackingContent({ orderRef, locale: localeProp, onStartReturn, onOpenReturn, onContactSupport, onCancelled, onReorder }) {
|
|
7584
7589
|
const t = useT();
|
|
7585
7590
|
const { api } = useShop();
|
|
7586
7591
|
const locale = useLocale(localeProp);
|
|
@@ -7757,6 +7762,9 @@ function OrderTrackingContent({ orderRef, locale: localeProp, onStartReturn, onC
|
|
|
7757
7762
|
...onStartReturn ? {
|
|
7758
7763
|
onStartReturn
|
|
7759
7764
|
} : {},
|
|
7765
|
+
...onOpenReturn ? {
|
|
7766
|
+
onOpenReturn
|
|
7767
|
+
} : {},
|
|
7760
7768
|
...onContactSupport ? {
|
|
7761
7769
|
onContactSupport
|
|
7762
7770
|
} : {}
|
|
@@ -7793,9 +7801,10 @@ function placedOn(iso, locale) {
|
|
|
7793
7801
|
}).format(d);
|
|
7794
7802
|
return `${day} ${month}, ${d.getUTCFullYear()}`;
|
|
7795
7803
|
}
|
|
7796
|
-
function NeedHelp({ order, onStartReturn, onContactSupport }) {
|
|
7804
|
+
function NeedHelp({ order, onStartReturn, onOpenReturn, onContactSupport }) {
|
|
7797
7805
|
const emit = useShopEvent();
|
|
7798
7806
|
if (order.status !== "delivered") return null;
|
|
7807
|
+
const returns = order.returns ?? [];
|
|
7799
7808
|
return jsxs("section", {
|
|
7800
7809
|
className: styles$y.help,
|
|
7801
7810
|
"aria-labelledby": "order-help",
|
|
@@ -7805,7 +7814,10 @@ function NeedHelp({ order, onStartReturn, onContactSupport }) {
|
|
|
7805
7814
|
children: "Need help?"
|
|
7806
7815
|
}), jsxs("div", {
|
|
7807
7816
|
className: styles$y.helpRows,
|
|
7808
|
-
children: [
|
|
7817
|
+
children: [returns.map((ret) => jsx(HelpRow, {
|
|
7818
|
+
label: returns.length > 1 ? `Track return ${ret.return_ref}` : "Track your return",
|
|
7819
|
+
onClick: () => onOpenReturn?.(ret.return_ref)
|
|
7820
|
+
}, ret.return_ref)), order.can_return && onStartReturn && jsx(HelpRow, {
|
|
7809
7821
|
label: "Start a return",
|
|
7810
7822
|
onClick: onStartReturn
|
|
7811
7823
|
}), jsx(HelpRow, {
|
|
@@ -10060,9 +10072,14 @@ function ProductDetail({ product, inventory: inventory2, recommendations = [] })
|
|
|
10060
10072
|
const purchasable = anyInStock && !colourSoldOut;
|
|
10061
10073
|
const colourImage = useMemo(() => selectedColour ? baseColours.find((c) => c.value === selectedColour)?.image : void 0, [baseColours, selectedColour]);
|
|
10062
10074
|
const media2 = useMemo(() => {
|
|
10063
|
-
const
|
|
10064
|
-
|
|
10065
|
-
|
|
10075
|
+
const byColour = product.media_by_colour ?? {};
|
|
10076
|
+
const attributed = new Set(Object.values(byColour).flat());
|
|
10077
|
+
const mine = selectedColour ? new Set(byColour[selectedColour] ?? []) : null;
|
|
10078
|
+
const swatch2 = selectedColour ? baseColours.find((c) => c.value === selectedColour)?.image : void 0;
|
|
10079
|
+
const lead = typeof swatch2 === "string" && swatch2.length > 0 ? [swatch2] : [];
|
|
10080
|
+
const rest = product.media.filter((m) => mine ? mine.has(m) || !attributed.has(m) : true);
|
|
10081
|
+
return [...lead, ...rest.filter((m) => !lead.includes(m))];
|
|
10082
|
+
}, [baseColours, product.media, product.media_by_colour, selectedColour]);
|
|
10066
10083
|
const focus = useMemo(() => {
|
|
10067
10084
|
if (!colourImage) return void 0;
|
|
10068
10085
|
const at = media2.indexOf(colourImage);
|
|
@@ -11573,4 +11590,4 @@ export {
|
|
|
11573
11590
|
useToast,
|
|
11574
11591
|
variantLabel
|
|
11575
11592
|
};
|
|
11576
|
-
|
|
11593
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -4286,6 +4286,7 @@ function requireCatalog() {
|
|
|
4286
4286
|
price: money_1.Money,
|
|
4287
4287
|
compare_at: money_1.Money.optional(),
|
|
4288
4288
|
media: zod_1.z.array(common_1.Url),
|
|
4289
|
+
media_by_colour: zod_1.z.record(zod_1.z.string(), zod_1.z.array(common_1.Url)).optional(),
|
|
4289
4290
|
variants: zod_1.z.array(exports.ProductVariant),
|
|
4290
4291
|
description: zod_1.z.string().optional(),
|
|
4291
4292
|
badges: zod_1.z.array(zod_1.z.string()).optional(),
|
|
@@ -7564,11 +7565,14 @@ function ChevronRight$1() {
|
|
|
7564
7565
|
});
|
|
7565
7566
|
}
|
|
7566
7567
|
function OrderTrackingView(props) {
|
|
7567
|
-
const [
|
|
7568
|
-
if (
|
|
7568
|
+
const [flow, setFlow] = useState(null);
|
|
7569
|
+
if (flow !== null) {
|
|
7569
7570
|
return jsx(ReturnFlowView, {
|
|
7570
7571
|
orderRef: props.orderRef,
|
|
7571
|
-
|
|
7572
|
+
...flow ? {
|
|
7573
|
+
returnRef: flow
|
|
7574
|
+
} : {},
|
|
7575
|
+
onDone: () => setFlow(null)
|
|
7572
7576
|
});
|
|
7573
7577
|
}
|
|
7574
7578
|
return jsx(ShopSurface, {
|
|
@@ -7576,11 +7580,12 @@ function OrderTrackingView(props) {
|
|
|
7576
7580
|
fill: true,
|
|
7577
7581
|
children: jsx(OrderTrackingContent, {
|
|
7578
7582
|
...props,
|
|
7579
|
-
onStartReturn: props.onStartReturn ?? (() =>
|
|
7583
|
+
onStartReturn: props.onStartReturn ?? (() => setFlow("")),
|
|
7584
|
+
onOpenReturn: props.onOpenReturn ?? ((returnRef) => setFlow(returnRef))
|
|
7580
7585
|
})
|
|
7581
7586
|
});
|
|
7582
7587
|
}
|
|
7583
|
-
function OrderTrackingContent({ orderRef, locale: localeProp, onStartReturn, onContactSupport, onCancelled, onReorder }) {
|
|
7588
|
+
function OrderTrackingContent({ orderRef, locale: localeProp, onStartReturn, onOpenReturn, onContactSupport, onCancelled, onReorder }) {
|
|
7584
7589
|
const t = useT();
|
|
7585
7590
|
const { api } = useShop();
|
|
7586
7591
|
const locale = useLocale(localeProp);
|
|
@@ -7757,6 +7762,9 @@ function OrderTrackingContent({ orderRef, locale: localeProp, onStartReturn, onC
|
|
|
7757
7762
|
...onStartReturn ? {
|
|
7758
7763
|
onStartReturn
|
|
7759
7764
|
} : {},
|
|
7765
|
+
...onOpenReturn ? {
|
|
7766
|
+
onOpenReturn
|
|
7767
|
+
} : {},
|
|
7760
7768
|
...onContactSupport ? {
|
|
7761
7769
|
onContactSupport
|
|
7762
7770
|
} : {}
|
|
@@ -7793,9 +7801,10 @@ function placedOn(iso, locale) {
|
|
|
7793
7801
|
}).format(d);
|
|
7794
7802
|
return `${day} ${month}, ${d.getUTCFullYear()}`;
|
|
7795
7803
|
}
|
|
7796
|
-
function NeedHelp({ order, onStartReturn, onContactSupport }) {
|
|
7804
|
+
function NeedHelp({ order, onStartReturn, onOpenReturn, onContactSupport }) {
|
|
7797
7805
|
const emit = useShopEvent();
|
|
7798
7806
|
if (order.status !== "delivered") return null;
|
|
7807
|
+
const returns = order.returns ?? [];
|
|
7799
7808
|
return jsxs("section", {
|
|
7800
7809
|
className: styles$y.help,
|
|
7801
7810
|
"aria-labelledby": "order-help",
|
|
@@ -7805,7 +7814,10 @@ function NeedHelp({ order, onStartReturn, onContactSupport }) {
|
|
|
7805
7814
|
children: "Need help?"
|
|
7806
7815
|
}), jsxs("div", {
|
|
7807
7816
|
className: styles$y.helpRows,
|
|
7808
|
-
children: [
|
|
7817
|
+
children: [returns.map((ret) => jsx(HelpRow, {
|
|
7818
|
+
label: returns.length > 1 ? `Track return ${ret.return_ref}` : "Track your return",
|
|
7819
|
+
onClick: () => onOpenReturn?.(ret.return_ref)
|
|
7820
|
+
}, ret.return_ref)), order.can_return && onStartReturn && jsx(HelpRow, {
|
|
7809
7821
|
label: "Start a return",
|
|
7810
7822
|
onClick: onStartReturn
|
|
7811
7823
|
}), jsx(HelpRow, {
|
|
@@ -10060,9 +10072,14 @@ function ProductDetail({ product, inventory: inventory2, recommendations = [] })
|
|
|
10060
10072
|
const purchasable = anyInStock && !colourSoldOut;
|
|
10061
10073
|
const colourImage = useMemo(() => selectedColour ? baseColours.find((c) => c.value === selectedColour)?.image : void 0, [baseColours, selectedColour]);
|
|
10062
10074
|
const media2 = useMemo(() => {
|
|
10063
|
-
const
|
|
10064
|
-
|
|
10065
|
-
|
|
10075
|
+
const byColour = product.media_by_colour ?? {};
|
|
10076
|
+
const attributed = new Set(Object.values(byColour).flat());
|
|
10077
|
+
const mine = selectedColour ? new Set(byColour[selectedColour] ?? []) : null;
|
|
10078
|
+
const swatch2 = selectedColour ? baseColours.find((c) => c.value === selectedColour)?.image : void 0;
|
|
10079
|
+
const lead = typeof swatch2 === "string" && swatch2.length > 0 ? [swatch2] : [];
|
|
10080
|
+
const rest = product.media.filter((m) => mine ? mine.has(m) || !attributed.has(m) : true);
|
|
10081
|
+
return [...lead, ...rest.filter((m) => !lead.includes(m))];
|
|
10082
|
+
}, [baseColours, product.media, product.media_by_colour, selectedColour]);
|
|
10066
10083
|
const focus = useMemo(() => {
|
|
10067
10084
|
if (!colourImage) return void 0;
|
|
10068
10085
|
const at = media2.indexOf(colourImage);
|
|
@@ -11573,4 +11590,4 @@ export {
|
|
|
11573
11590
|
useToast,
|
|
11574
11591
|
variantLabel
|
|
11575
11592
|
};
|
|
11576
|
-
|
|
11593
|
+
//# sourceMappingURL=storefront.mjs.map
|
package/package.json
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nok-integration/storefront-react",
|
|
3
|
-
"version": "0.19.
|
|
3
|
+
"version": "0.19.32",
|
|
4
4
|
"description": "Mountable React storefront components: catalogue, product detail and cart, mounted directly into a host DOM tree. No iframe.",
|
|
5
5
|
"license": "UNLICENSED",
|
|
6
|
+
"publishConfig": {
|
|
7
|
+
"access": "public",
|
|
8
|
+
"registry": "https://registry.npmjs.org/"
|
|
9
|
+
},
|
|
6
10
|
"type": "module",
|
|
7
11
|
"main": "./dist/index.mjs",
|
|
8
|
-
"module": "./dist/index.mjs",
|
|
9
12
|
"types": "./dist/index.d.ts",
|
|
10
13
|
"exports": {
|
|
11
14
|
".": {
|
|
@@ -20,18 +23,34 @@
|
|
|
20
23
|
"dist",
|
|
21
24
|
"!dist/**/*.map"
|
|
22
25
|
],
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
|
|
26
|
+
"scripts": {
|
|
27
|
+
"build": "pnpm build:package && pnpm build:standalone",
|
|
28
|
+
"build:package": "vite build",
|
|
29
|
+
"build:standalone": "BUILD_TARGET=standalone vite build",
|
|
30
|
+
"typecheck": "tsc --noEmit",
|
|
31
|
+
"build:partner": "PARTNER_DROP=1 pnpm build && pnpm pack"
|
|
32
|
+
},
|
|
26
33
|
"peerDependencies": {
|
|
27
34
|
"react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
28
35
|
"react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
|
29
36
|
},
|
|
37
|
+
"devDependencies": {
|
|
38
|
+
"@microsoft/api-extractor": "^7.58.12",
|
|
39
|
+
"@raqmix/contracts": "^2.0.0",
|
|
40
|
+
"@types/react": "^19.1.0",
|
|
41
|
+
"@types/react-dom": "^19.1.0",
|
|
42
|
+
"@vitejs/plugin-react": "^4.3.4",
|
|
43
|
+
"esbuild": "^0.28.1",
|
|
44
|
+
"terser": "^5.50.0",
|
|
45
|
+
"typescript": "^5.7.3",
|
|
46
|
+
"vite": "^7.0.0",
|
|
47
|
+
"vite-plugin-dts": "^5.0.3"
|
|
48
|
+
},
|
|
49
|
+
"module": "./dist/index.mjs",
|
|
50
|
+
"sideEffects": [
|
|
51
|
+
"*.css"
|
|
52
|
+
],
|
|
30
53
|
"dependencies": {
|
|
31
54
|
"zod": "^3.24.1"
|
|
32
|
-
},
|
|
33
|
-
"publishConfig": {
|
|
34
|
-
"access": "public",
|
|
35
|
-
"registry": "https://registry.npmjs.org/"
|
|
36
55
|
}
|
|
37
56
|
}
|