@nok-integration/storefront-react 0.6.0 → 0.11.3

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 CHANGED
@@ -24,15 +24,15 @@ declare type AddCartItemRequest = z.infer<typeof AddCartItemRequest>;
24
24
 
25
25
  /** The `error` member — a machine `code`, a human `message`, and optional `details`. */
26
26
  declare const ApiErrorBody: z.ZodObject<{
27
- code: z.ZodEnum<["invalid_request", "unauthorized", "out_of_stock", "cart_locked", "sku_not_found", "category_not_found", "amount_mismatch", "duplicate_order", "order_not_found", "order_not_cancellable", "forbidden", "invalid_transition", "rate_limited", "server_error"]>;
27
+ code: z.ZodEnum<["invalid_request", "unauthorized", "out_of_stock", "cart_locked", "sku_not_found", "category_not_found", "amount_mismatch", "duplicate_order", "order_not_found", "order_not_cancellable", "cart_not_found", "forbidden", "invalid_transition", "rate_limited", "server_error"]>;
28
28
  message: z.ZodString;
29
29
  details: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodUnknown>>;
30
30
  }, "strip", z.ZodTypeAny, {
31
- code: "invalid_request" | "unauthorized" | "out_of_stock" | "cart_locked" | "sku_not_found" | "category_not_found" | "amount_mismatch" | "duplicate_order" | "order_not_found" | "order_not_cancellable" | "forbidden" | "invalid_transition" | "rate_limited" | "server_error";
31
+ code: "invalid_request" | "unauthorized" | "out_of_stock" | "cart_locked" | "sku_not_found" | "category_not_found" | "amount_mismatch" | "duplicate_order" | "order_not_found" | "order_not_cancellable" | "cart_not_found" | "forbidden" | "invalid_transition" | "rate_limited" | "server_error";
32
32
  message: string;
33
33
  details?: Record<string, unknown> | undefined;
34
34
  }, {
35
- code: "invalid_request" | "unauthorized" | "out_of_stock" | "cart_locked" | "sku_not_found" | "category_not_found" | "amount_mismatch" | "duplicate_order" | "order_not_found" | "order_not_cancellable" | "forbidden" | "invalid_transition" | "rate_limited" | "server_error";
35
+ code: "invalid_request" | "unauthorized" | "out_of_stock" | "cart_locked" | "sku_not_found" | "category_not_found" | "amount_mismatch" | "duplicate_order" | "order_not_found" | "order_not_cancellable" | "cart_not_found" | "forbidden" | "invalid_transition" | "rate_limited" | "server_error";
36
36
  message: string;
37
37
  details?: Record<string, unknown> | undefined;
38
38
  }>;
@@ -192,18 +192,17 @@ declare const CartItem: z.ZodObject<{
192
192
  declare type CartItem = z.infer<typeof CartItem>;
193
193
 
194
194
  /**
195
- * A single cart line: media, title, variant, unit price, qty stepper, and line total.
195
+ * A single cart line: media, title, variant, price and the qty stepper.
196
196
  *
197
- * Title, image and variant come from the line itself (contracts 2.15.0). Before that the
198
- * wire carried only a SKU, so this rendered an internal code against an empty grey box —
199
- * and two sizes of one product were indistinguishable.
197
+ * Title, image and variant come from the line itself (contracts 2.15.0) and are all
198
+ * optional the catalogue projection is a cache, so a de-listed SKU still has a line. It
199
+ * degrades: the SKU stands in for a missing title, a missing image leaves the placeholder.
200
200
  *
201
- * All three stay optional, because the catalogue projection is a cache: a SKU de-listed
202
- * after it entered the cart still has a line. It degrades rather than breaks the SKU
203
- * stands in for a missing title, and a missing image leaves the placeholder — so the fan
204
- * can always still read the price and remove the line.
201
+ * The figure shown is the LINE TOTAL, not the unit price. The design shows one price at
202
+ * qty 1, where the two are equal, so it does not settle it; line total is what reconciles
203
+ * with the Subtotal below.
205
204
  */
206
- export declare function CartLineItem({ item, title, image, maxQty, onQtyChange, onRemove, pending, }: CartLineItemProps): JSX.Element;
205
+ export declare function CartLineItem({ item, title, image, compareAt, discountPct, maxQty, onQtyChange, onRemove, pending, }: CartLineItemProps): JSX.Element;
207
206
 
208
207
  export declare interface CartLineItemProps {
209
208
  item: CartItem;
@@ -214,6 +213,16 @@ export declare interface CartLineItemProps {
214
213
  */
215
214
  title?: string;
216
215
  image?: string;
216
+ /**
217
+ * Was-price and discount: a struck figure under the price, and a `-NN%` badge over the
218
+ * thumbnail (Figma `Property 1=cart-item`).
219
+ *
220
+ * `CartView` does not supply these — `CartItem` carries no was-price, so the cart cannot
221
+ * know a line is discounted and will not invent one. Same escape hatch as `title`/`image`
222
+ * above, for a host with its own catalogue data.
223
+ */
224
+ compareAt?: Money;
225
+ discountPct?: number;
217
226
  maxQty?: number;
218
227
  onQtyChange: (qty: number) => void;
219
228
  onRemove: () => void;
@@ -446,11 +455,11 @@ declare const CategoryPage: z.ZodObject<{
446
455
  }, "strip", z.ZodTypeAny, {
447
456
  sku: string;
448
457
  title: string;
449
- category: string;
450
458
  price: {
451
459
  amount: number;
452
460
  currency: string;
453
461
  };
462
+ category: string;
454
463
  media: string[];
455
464
  variants: {
456
465
  sku: string;
@@ -478,11 +487,11 @@ declare const CategoryPage: z.ZodObject<{
478
487
  }, {
479
488
  sku: string;
480
489
  title: string;
481
- category: string;
482
490
  price: {
483
491
  amount: number;
484
492
  currency: string;
485
493
  };
494
+ category: string;
486
495
  media: string[];
487
496
  variants: {
488
497
  sku: string;
@@ -514,11 +523,11 @@ declare const CategoryPage: z.ZodObject<{
514
523
  products: {
515
524
  sku: string;
516
525
  title: string;
517
- category: string;
518
526
  price: {
519
527
  amount: number;
520
528
  currency: string;
521
529
  };
530
+ category: string;
522
531
  media: string[];
523
532
  variants: {
524
533
  sku: string;
@@ -550,11 +559,11 @@ declare const CategoryPage: z.ZodObject<{
550
559
  products: {
551
560
  sku: string;
552
561
  title: string;
553
- category: string;
554
562
  price: {
555
563
  amount: number;
556
564
  currency: string;
557
565
  };
566
+ category: string;
558
567
  media: string[];
559
568
  variants: {
560
569
  sku: string;
@@ -594,6 +603,7 @@ declare const CategoryPage: z.ZodObject<{
594
603
  align?: "center" | "left" | undefined;
595
604
  }>, z.ZodObject<{
596
605
  kind: z.ZodLiteral<"featured">;
606
+ title: z.ZodOptional<z.ZodString>;
597
607
  product: z.ZodObject<{
598
608
  sku: z.ZodString;
599
609
  title: z.ZodString;
@@ -669,11 +679,11 @@ declare const CategoryPage: z.ZodObject<{
669
679
  }, "strip", z.ZodTypeAny, {
670
680
  sku: string;
671
681
  title: string;
672
- category: string;
673
682
  price: {
674
683
  amount: number;
675
684
  currency: string;
676
685
  };
686
+ category: string;
677
687
  media: string[];
678
688
  variants: {
679
689
  sku: string;
@@ -701,11 +711,11 @@ declare const CategoryPage: z.ZodObject<{
701
711
  }, {
702
712
  sku: string;
703
713
  title: string;
704
- category: string;
705
714
  price: {
706
715
  amount: number;
707
716
  currency: string;
708
717
  };
718
+ category: string;
709
719
  media: string[];
710
720
  variants: {
711
721
  sku: string;
@@ -736,11 +746,11 @@ declare const CategoryPage: z.ZodObject<{
736
746
  product: {
737
747
  sku: string;
738
748
  title: string;
739
- category: string;
740
749
  price: {
741
750
  amount: number;
742
751
  currency: string;
743
752
  };
753
+ category: string;
744
754
  media: string[];
745
755
  variants: {
746
756
  sku: string;
@@ -766,16 +776,17 @@ declare const CategoryPage: z.ZodObject<{
766
776
  notes?: string[] | undefined;
767
777
  } | undefined;
768
778
  };
779
+ title?: string | undefined;
769
780
  }, {
770
781
  kind: "featured";
771
782
  product: {
772
783
  sku: string;
773
784
  title: string;
774
- category: string;
775
785
  price: {
776
786
  amount: number;
777
787
  currency: string;
778
788
  };
789
+ category: string;
779
790
  media: string[];
780
791
  variants: {
781
792
  sku: string;
@@ -801,6 +812,7 @@ declare const CategoryPage: z.ZodObject<{
801
812
  notes?: string[] | undefined;
802
813
  } | undefined;
803
814
  };
815
+ title?: string | undefined;
804
816
  }>, z.ZodObject<{
805
817
  kind: z.ZodLiteral<"lifestyle_image">;
806
818
  images: z.ZodArray<z.ZodString, "many">;
@@ -888,11 +900,11 @@ declare const CategoryPage: z.ZodObject<{
888
900
  }, "strip", z.ZodTypeAny, {
889
901
  sku: string;
890
902
  title: string;
891
- category: string;
892
903
  price: {
893
904
  amount: number;
894
905
  currency: string;
895
906
  };
907
+ category: string;
896
908
  media: string[];
897
909
  variants: {
898
910
  sku: string;
@@ -920,11 +932,11 @@ declare const CategoryPage: z.ZodObject<{
920
932
  }, {
921
933
  sku: string;
922
934
  title: string;
923
- category: string;
924
935
  price: {
925
936
  amount: number;
926
937
  currency: string;
927
938
  };
939
+ category: string;
928
940
  media: string[];
929
941
  variants: {
930
942
  sku: string;
@@ -956,11 +968,11 @@ declare const CategoryPage: z.ZodObject<{
956
968
  products: {
957
969
  sku: string;
958
970
  title: string;
959
- category: string;
960
971
  price: {
961
972
  amount: number;
962
973
  currency: string;
963
974
  };
975
+ category: string;
964
976
  media: string[];
965
977
  variants: {
966
978
  sku: string;
@@ -992,11 +1004,11 @@ declare const CategoryPage: z.ZodObject<{
992
1004
  products: {
993
1005
  sku: string;
994
1006
  title: string;
995
- category: string;
996
1007
  price: {
997
1008
  amount: number;
998
1009
  currency: string;
999
1010
  };
1011
+ category: string;
1000
1012
  media: string[];
1001
1013
  variants: {
1002
1014
  sku: string;
@@ -1034,18 +1046,21 @@ declare const CategoryPage: z.ZodObject<{
1034
1046
  quote: string;
1035
1047
  author: string;
1036
1048
  }>, "many">;
1049
+ disclaimer: z.ZodOptional<z.ZodString>;
1037
1050
  }, "strip", z.ZodTypeAny, {
1038
1051
  kind: "review";
1039
1052
  quotes: {
1040
1053
  quote: string;
1041
1054
  author: string;
1042
1055
  }[];
1056
+ disclaimer?: string | undefined;
1043
1057
  }, {
1044
1058
  kind: "review";
1045
1059
  quotes: {
1046
1060
  quote: string;
1047
1061
  author: string;
1048
1062
  }[];
1063
+ disclaimer?: string | undefined;
1049
1064
  }>, z.ZodObject<{
1050
1065
  kind: z.ZodLiteral<"why_us">;
1051
1066
  items: z.ZodArray<z.ZodObject<{
@@ -1116,11 +1131,11 @@ declare const CategoryPage: z.ZodObject<{
1116
1131
  products: {
1117
1132
  sku: string;
1118
1133
  title: string;
1119
- category: string;
1120
1134
  price: {
1121
1135
  amount: number;
1122
1136
  currency: string;
1123
1137
  };
1138
+ category: string;
1124
1139
  media: string[];
1125
1140
  variants: {
1126
1141
  sku: string;
@@ -1155,11 +1170,11 @@ declare const CategoryPage: z.ZodObject<{
1155
1170
  product: {
1156
1171
  sku: string;
1157
1172
  title: string;
1158
- category: string;
1159
1173
  price: {
1160
1174
  amount: number;
1161
1175
  currency: string;
1162
1176
  };
1177
+ category: string;
1163
1178
  media: string[];
1164
1179
  variants: {
1165
1180
  sku: string;
@@ -1185,6 +1200,7 @@ declare const CategoryPage: z.ZodObject<{
1185
1200
  notes?: string[] | undefined;
1186
1201
  } | undefined;
1187
1202
  };
1203
+ title?: string | undefined;
1188
1204
  } | {
1189
1205
  kind: "lifestyle_image";
1190
1206
  images: string[];
@@ -1194,11 +1210,11 @@ declare const CategoryPage: z.ZodObject<{
1194
1210
  products: {
1195
1211
  sku: string;
1196
1212
  title: string;
1197
- category: string;
1198
1213
  price: {
1199
1214
  amount: number;
1200
1215
  currency: string;
1201
1216
  };
1217
+ category: string;
1202
1218
  media: string[];
1203
1219
  variants: {
1204
1220
  sku: string;
@@ -1230,6 +1246,7 @@ declare const CategoryPage: z.ZodObject<{
1230
1246
  quote: string;
1231
1247
  author: string;
1232
1248
  }[];
1249
+ disclaimer?: string | undefined;
1233
1250
  } | {
1234
1251
  items: {
1235
1252
  title: string;
@@ -1258,11 +1275,11 @@ declare const CategoryPage: z.ZodObject<{
1258
1275
  products: {
1259
1276
  sku: string;
1260
1277
  title: string;
1261
- category: string;
1262
1278
  price: {
1263
1279
  amount: number;
1264
1280
  currency: string;
1265
1281
  };
1282
+ category: string;
1266
1283
  media: string[];
1267
1284
  variants: {
1268
1285
  sku: string;
@@ -1297,11 +1314,11 @@ declare const CategoryPage: z.ZodObject<{
1297
1314
  product: {
1298
1315
  sku: string;
1299
1316
  title: string;
1300
- category: string;
1301
1317
  price: {
1302
1318
  amount: number;
1303
1319
  currency: string;
1304
1320
  };
1321
+ category: string;
1305
1322
  media: string[];
1306
1323
  variants: {
1307
1324
  sku: string;
@@ -1327,6 +1344,7 @@ declare const CategoryPage: z.ZodObject<{
1327
1344
  notes?: string[] | undefined;
1328
1345
  } | undefined;
1329
1346
  };
1347
+ title?: string | undefined;
1330
1348
  } | {
1331
1349
  kind: "lifestyle_image";
1332
1350
  images: string[];
@@ -1336,11 +1354,11 @@ declare const CategoryPage: z.ZodObject<{
1336
1354
  products: {
1337
1355
  sku: string;
1338
1356
  title: string;
1339
- category: string;
1340
1357
  price: {
1341
1358
  amount: number;
1342
1359
  currency: string;
1343
1360
  };
1361
+ category: string;
1344
1362
  media: string[];
1345
1363
  variants: {
1346
1364
  sku: string;
@@ -1372,6 +1390,7 @@ declare const CategoryPage: z.ZodObject<{
1372
1390
  quote: string;
1373
1391
  author: string;
1374
1392
  }[];
1393
+ disclaimer?: string | undefined;
1375
1394
  } | {
1376
1395
  items: {
1377
1396
  title: string;
@@ -1440,9 +1459,15 @@ declare interface ClientOptions {
1440
1459
  export declare function codeOf(err: unknown): ErrorCode | undefined;
1441
1460
 
1442
1461
  /**
1443
- * PDP colour selector (Figma `mobile/pdp/color`): a "Colour: <name>" header and a row of
1444
- * 79×105 image tiles. The selected tile gets a dark border; sold-out colours are disabled
1445
- * with an overlay. A real radiogroup for keyboard + screen-reader support.
1462
+ * PDP colour selector (Figma `mobile/pdp/color`): a "Color: <name>" header and a row of
1463
+ * 79×105 image tiles. The selected tile gets a 1px dark border; a sold-out colour gets a
1464
+ * dark scrim reading "Out of stock".
1465
+ *
1466
+ * A sold-out colour stays SELECTABLE, per the tile's design note ("tap always selects —
1467
+ * sold-out selectable to view"): choosing it swaps the gallery, which is the only way a
1468
+ * fan can look at a colourway that happens to be unavailable. The purchase is blocked
1469
+ * further down, at the CTA, not here — disabling the tile would hide the product rather
1470
+ * than the transaction.
1446
1471
  */
1447
1472
  export declare function ColorSelector({ colours, selected, onSelect }: ColorSelectorProps): JSX.Element;
1448
1473
 
@@ -1677,6 +1702,7 @@ declare function createClient(options: ClientOptions): {
1677
1702
  notes?: string[] | undefined;
1678
1703
  } | undefined;
1679
1704
  };
1705
+ title?: string | undefined;
1680
1706
  } | {
1681
1707
  kind: "lifestyle_image";
1682
1708
  images: string[];
@@ -1722,6 +1748,7 @@ declare function createClient(options: ClientOptions): {
1722
1748
  quote: string;
1723
1749
  author: string;
1724
1750
  }[];
1751
+ disclaimer?: string | undefined;
1725
1752
  } | {
1726
1753
  kind: "why_us";
1727
1754
  items: {
@@ -1739,6 +1766,19 @@ declare function createClient(options: ClientOptions): {
1739
1766
  })[];
1740
1767
  }>;
1741
1768
  };
1769
+ content: {
1770
+ /** The shop entry's slides. Falls back to whatever the consumer ships with. */
1771
+ home: () => Promise<{
1772
+ slides: {
1773
+ title: string;
1774
+ subtitle: string;
1775
+ key: string;
1776
+ cta: string;
1777
+ image?: string | undefined;
1778
+ target?: string | undefined;
1779
+ }[];
1780
+ }>;
1781
+ };
1742
1782
  inventory: {
1743
1783
  get: (sku: string) => Promise<{
1744
1784
  sku: string;
@@ -1972,6 +2012,106 @@ declare function createClient(options: ClientOptions): {
1972
2012
  checkout_url: string;
1973
2013
  }>;
1974
2014
  };
2015
+ /**
2016
+ * The fan's own orders (ADR-0015). Session-scoped: there is no way to ask for
2017
+ * someone else's, because there is no parameter that names a customer.
2018
+ */
2019
+ stockAlerts: {
2020
+ /** "Remind me when available" — idempotent per SKU for the session's principal. */
2021
+ create: (body: StockAlertRequest) => Promise<{
2022
+ sku: string;
2023
+ created_at: string;
2024
+ notified_at?: string | undefined;
2025
+ }>;
2026
+ };
2027
+ orders: {
2028
+ list: () => Promise<{
2029
+ orders: {
2030
+ status: "packing" | "on_its_way" | "out_for_delivery" | "delivered" | "cancelled";
2031
+ currency: string;
2032
+ total: {
2033
+ amount: number;
2034
+ currency: string;
2035
+ };
2036
+ order_ref: string;
2037
+ placed_at: string;
2038
+ headline: string;
2039
+ item_count: number;
2040
+ image?: string | undefined;
2041
+ }[];
2042
+ }>;
2043
+ get: (orderRef: string) => Promise<{
2044
+ status: "packing" | "on_its_way" | "out_for_delivery" | "delivered" | "cancelled";
2045
+ currency: string;
2046
+ items: {
2047
+ sku: string;
2048
+ qty: number;
2049
+ unit_price: {
2050
+ amount: number;
2051
+ currency: string;
2052
+ };
2053
+ line_total: {
2054
+ amount: number;
2055
+ currency: string;
2056
+ };
2057
+ line_ref: string;
2058
+ cancelled_qty: number;
2059
+ refunded_qty: number;
2060
+ attributes?: Record<string, string> | undefined;
2061
+ image?: string | undefined;
2062
+ title?: string | undefined;
2063
+ }[];
2064
+ totals: {
2065
+ shipping: {
2066
+ amount: number;
2067
+ currency: string;
2068
+ };
2069
+ tax: {
2070
+ amount: number;
2071
+ currency: string;
2072
+ };
2073
+ items: {
2074
+ amount: number;
2075
+ currency: string;
2076
+ };
2077
+ grand_total: {
2078
+ amount: number;
2079
+ currency: string;
2080
+ };
2081
+ };
2082
+ order_ref: string;
2083
+ placed_at: string;
2084
+ ship_to: {
2085
+ country: string;
2086
+ name: string;
2087
+ line1: string;
2088
+ city: string;
2089
+ postcode: string;
2090
+ line2?: string | undefined;
2091
+ region?: string | undefined;
2092
+ };
2093
+ headline: string;
2094
+ progress: {
2095
+ label: string;
2096
+ step: "packing" | "on_its_way" | "out_for_delivery" | "delivered" | "cancelled";
2097
+ current: boolean;
2098
+ at?: string | undefined;
2099
+ }[];
2100
+ payment?: {
2101
+ brand: string;
2102
+ last4?: string | undefined;
2103
+ } | undefined;
2104
+ estimated_delivery?: {
2105
+ from: string;
2106
+ to: string;
2107
+ } | undefined;
2108
+ tracking?: {
2109
+ carrier: string;
2110
+ url?: string | undefined;
2111
+ reference?: string | undefined;
2112
+ } | undefined;
2113
+ }>;
2114
+ };
1975
2115
  auth: {
1976
2116
  /** Exchange a single-use DAZN identity JWT for a session (sets the cookie). */
1977
2117
  exchangeSession: (body: SessionExchangeRequest) => Promise<{
@@ -2137,7 +2277,7 @@ export declare interface EmptyStateProps {
2137
2277
  * | rate_limited | 429 | too many requests |
2138
2278
  * | server_error | 500 | unexpected error (safe to retry idempotent) |
2139
2279
  */
2140
- declare const ErrorCode: z.ZodEnum<["invalid_request", "unauthorized", "out_of_stock", "cart_locked", "sku_not_found", "category_not_found", "amount_mismatch", "duplicate_order", "order_not_found", "order_not_cancellable", "forbidden", "invalid_transition", "rate_limited", "server_error"]>;
2280
+ declare const ErrorCode: z.ZodEnum<["invalid_request", "unauthorized", "out_of_stock", "cart_locked", "sku_not_found", "category_not_found", "amount_mismatch", "duplicate_order", "order_not_found", "order_not_cancellable", "cart_not_found", "forbidden", "invalid_transition", "rate_limited", "server_error"]>;
2141
2281
 
2142
2282
  declare type ErrorCode = z.infer<typeof ErrorCode>;
2143
2283
 
@@ -2160,7 +2300,7 @@ declare type ErrorCode = z.infer<typeof ErrorCode>;
2160
2300
  * | rate_limited | 429 | too many requests |
2161
2301
  * | server_error | 500 | unexpected error (safe to retry idempotent) |
2162
2302
  */
2163
- declare const ErrorCode_2: z.ZodEnum<["invalid_request", "unauthorized", "out_of_stock", "cart_locked", "sku_not_found", "category_not_found", "amount_mismatch", "duplicate_order", "order_not_found", "order_not_cancellable", "forbidden", "invalid_transition", "rate_limited", "server_error"]>;
2303
+ declare const ErrorCode_2: z.ZodEnum<["invalid_request", "unauthorized", "out_of_stock", "cart_locked", "sku_not_found", "category_not_found", "amount_mismatch", "duplicate_order", "order_not_found", "order_not_cancellable", "cart_not_found", "forbidden", "invalid_transition", "rate_limited", "server_error"]>;
2164
2304
 
2165
2305
  declare type ErrorCode_2 = z.infer<typeof ErrorCode_2>;
2166
2306
 
@@ -2288,7 +2428,13 @@ export declare function isDuplicateOrder(err: unknown): boolean;
2288
2428
  /** A 401 anywhere in the flow means the session lapsed — re-handshake, keep the cart. */
2289
2429
  export declare function isUnauthorized(err: unknown): boolean;
2290
2430
 
2291
- /** Full-width lifestyle image (rounded), inset from the page edges. */
2431
+ /**
2432
+ * Full-width editorial image, swipeable when the CMS supplies more than one.
2433
+ *
2434
+ * It previously rendered `images[0]` and dropped the rest, which is a silent failure of
2435
+ * the worst kind: the block takes an array, an author publishes three, and nothing on the
2436
+ * screen says the other two exist.
2437
+ */
2292
2438
  export declare function LifestyleImage({ images }: {
2293
2439
  images: string[];
2294
2440
  }): JSX.Element | null;
@@ -2377,6 +2523,36 @@ export declare type Navigate = (to: ShopRoute) => void;
2377
2523
  */
2378
2524
  export declare type OnEvent = (event: ShopEvent) => void;
2379
2525
 
2526
+ /**
2527
+ * One row of the timeline.
2528
+ *
2529
+ * **`at` is present only for a step that has actually happened.** A future step has no
2530
+ * date, rather than a projected one: a predicted date rendered in the same place as a
2531
+ * recorded one is indistinguishable from a promise, and this timeline is the fan's
2532
+ * evidence of what occurred.
2533
+ */
2534
+ declare const OrderProgressEntry: z.ZodObject<{
2535
+ step: z.ZodEnum<["packing", "on_its_way", "out_for_delivery", "delivered", "cancelled"]>;
2536
+ /** Ready-to-render label for the step, localised with the rest of the response. */
2537
+ label: z.ZodString;
2538
+ /** When the step completed. Absent = not reached yet. */
2539
+ at: z.ZodOptional<z.ZodString>;
2540
+ /** Exactly one entry is `current`; every earlier one is complete. */
2541
+ current: z.ZodBoolean;
2542
+ }, "strip", z.ZodTypeAny, {
2543
+ label: string;
2544
+ step: "packing" | "on_its_way" | "out_for_delivery" | "delivered" | "cancelled";
2545
+ current: boolean;
2546
+ at?: string | undefined;
2547
+ }, {
2548
+ label: string;
2549
+ step: "packing" | "on_its_way" | "out_for_delivery" | "delivered" | "cancelled";
2550
+ current: boolean;
2551
+ at?: string | undefined;
2552
+ }>;
2553
+
2554
+ declare type OrderProgressEntry = z.infer<typeof OrderProgressEntry>;
2555
+
2380
2556
  /**
2381
2557
  * Fulfilment order status. Lives here (not in a synchronous order contract) because the
2382
2558
  * engine no longer owns orders (ADR-0008) — order/fulfilment status reaches us only as
@@ -2390,10 +2566,18 @@ declare type OrderStatus = z.infer<typeof OrderStatus>;
2390
2566
  * The pricing breakdown. DISPLAY ONLY — every value is server-authoritative; the UI
2391
2567
  * never sums or computes anything here.
2392
2568
  */
2393
- export declare function OrderSummary({ pricing, deferred }: OrderSummaryProps): JSX.Element;
2569
+ export declare function OrderSummary({ pricing, deferred, rows }: OrderSummaryProps): JSX.Element;
2394
2570
 
2395
2571
  export declare interface OrderSummaryProps {
2396
2572
  pricing: Pricing;
2573
+ /**
2574
+ * Row order and wording, where a surface's design differs from the cart's.
2575
+ *
2576
+ * The order screen lists Subtotal, Tax, Shipping, Total and says "Shipping"; the cart
2577
+ * says "Delivery". One component, two designs — passed in rather than picked here so
2578
+ * neither screen silently inherits the other's wording.
2579
+ */
2580
+ rows?: SummaryRow[];
2397
2581
  /**
2398
2582
  * Rows whose value is **not ours to state**, rendered as "Calculated at checkout"
2399
2583
  * instead of the figure in `pricing`.
@@ -2410,7 +2594,42 @@ export declare interface OrderSummaryProps {
2410
2594
  deferred?: DeferredLine[];
2411
2595
  }
2412
2596
 
2413
- /** PCP hero — category title + subtitle over a full-bleed lifestyle image (dark). */
2597
+ /**
2598
+ * The order progress timeline (Figma `mobile/order/timeline-row`, 3879:13868).
2599
+ *
2600
+ * The steps come from the engine rather than being enumerated here, so the screen renders
2601
+ * what the order can actually evidence — three rows for a normal delivery, four when a
2602
+ * carrier reports the parcel out for delivery, and a cancelled tail when it applies.
2603
+ *
2604
+ * An ordered list, because it is one: the rows have a sequence and a screen reader should
2605
+ * announce it as such.
2606
+ */
2607
+ export declare function OrderTimeline({ progress, locale: localeProp }: OrderTimelineProps): JSX.Element;
2608
+
2609
+ export declare interface OrderTimelineProps {
2610
+ progress: OrderProgressEntry[];
2611
+ /** Overrides the provider's locale for the step dates. */
2612
+ locale?: string;
2613
+ }
2614
+
2615
+ /**
2616
+ * Order tracking (Figma `mobile/order/details`, ADR-0015).
2617
+ *
2618
+ * Read-only by design. Cancellation and refunds remain DAZN's under ADR-0008, so the
2619
+ * design's "Cancel order" and "Return items" buttons are deliberately not here: a control
2620
+ * that cannot complete is worse than an absent one, and both need a contract from DAZN
2621
+ * before they can do anything.
2622
+ */
2623
+ export declare function OrderTrackingView(props: OrderTrackingViewProps): JSX.Element;
2624
+
2625
+ export declare interface OrderTrackingViewProps {
2626
+ /** DAZN's order reference, e.g. `ord_GB26081021`. */
2627
+ orderRef: string;
2628
+ /** Overrides the provider's locale for dates. */
2629
+ locale?: string;
2630
+ }
2631
+
2632
+ /** PCP hero — category title and tagline read over a full-screen lifestyle image. */
2414
2633
  export declare function PcpHero({ hero }: {
2415
2634
  hero: CategoryHero;
2416
2635
  }): JSX.Element;
@@ -2639,11 +2858,11 @@ declare const Product: z.ZodObject<{
2639
2858
  }, "strip", z.ZodTypeAny, {
2640
2859
  sku: string;
2641
2860
  title: string;
2642
- category: string;
2643
2861
  price: {
2644
2862
  amount: number;
2645
2863
  currency: string;
2646
2864
  };
2865
+ category: string;
2647
2866
  media: string[];
2648
2867
  variants: {
2649
2868
  sku: string;
@@ -2671,11 +2890,11 @@ declare const Product: z.ZodObject<{
2671
2890
  }, {
2672
2891
  sku: string;
2673
2892
  title: string;
2674
- category: string;
2675
2893
  price: {
2676
2894
  amount: number;
2677
2895
  currency: string;
2678
2896
  };
2897
+ category: string;
2679
2898
  media: string[];
2680
2899
  variants: {
2681
2900
  sku: string;
@@ -2777,12 +2996,17 @@ declare type ProductPromo = z.infer<typeof ProductPromo>;
2777
2996
  * 165:220 image (radius-6) with a TOP PICK flag top-left and a green sale badge
2778
2997
  * bottom-left; below sit the title (2-line clamp) and price with a struck was-price.
2779
2998
  */
2780
- export declare function ProductTile({ product, priority }: ProductTileProps): JSX.Element;
2999
+ export declare function ProductTile({ product, priority, size }: ProductTileProps): JSX.Element;
2781
3000
 
2782
3001
  export declare interface ProductTileProps {
2783
3002
  product: Product;
2784
3003
  /** Priority-load the image (above-the-fold tiles). */
2785
3004
  priority?: boolean;
3005
+ /**
3006
+ * `default` is the 165px rail/grid card. `large` is the full-width spotlight card —
3007
+ * a taller 343:457 image and an 18px title (Figma `size=large`).
3008
+ */
3009
+ size?: 'default' | 'large';
2786
3010
  }
2787
3011
 
2788
3012
  /** `GET /v1/catalog/products` — a single purchasable variant of a product. */
@@ -2940,10 +3164,17 @@ declare interface Review {
2940
3164
  author: string;
2941
3165
  }
2942
3166
 
2943
- /** Testimonial carousel — swipeable light cards with dot pagination. */
2944
- export declare function ReviewCarousel({ quotes }: {
3167
+ /** Tester-quote carousel — swipeable cards with dot pagination. */
3168
+ export declare function ReviewCarousel({ quotes, disclaimer }: ReviewCarouselProps): JSX.Element;
3169
+
3170
+ declare interface ReviewCarouselProps {
2945
3171
  quotes: Review[];
2946
- }): JSX.Element;
3172
+ /**
3173
+ * The line that says these are tester quotes rather than customer reviews. The design
3174
+ * makes it mandatory; without it the block is unattributed social proof.
3175
+ */
3176
+ disclaimer?: string;
3177
+ }
2947
3178
 
2948
3179
  /**
2949
3180
  * The single green sale/discount badge (Figma `mobile/badge/sale`): success-soft
@@ -3026,14 +3257,37 @@ export declare type ShopEvent = {
3026
3257
  type: 'cart_updated';
3027
3258
  itemCount: number;
3028
3259
  subtotal: Money;
3029
- } | {
3260
+ }
3261
+ /**
3262
+ * Everything past `sku`/`qty` is display metadata (0.7.0), for a host that renders its
3263
+ * own add-to-cart confirmation. Optional and non-identifying: key on `sku`, and expect
3264
+ * any of them to be absent — they come from the catalogue projection, which is a cache.
3265
+ */
3266
+ | {
3030
3267
  type: 'add_to_cart';
3031
3268
  sku: string;
3032
3269
  qty: number;
3270
+ /** Product name, e.g. `DAZN Hoodie`. Display only. */
3271
+ title?: string;
3272
+ /** Mirror of `attributes.size`. Absent for a product with no size dimension. */
3273
+ size?: string;
3274
+ /** The variant's defining attributes, e.g. `{ colour: 'White', size: 'M' }`. */
3275
+ attributes?: Record<string, string>;
3276
+ /** Variant thumbnail, absolute URL. Absent = render without one. */
3277
+ image?: string;
3033
3278
  } | {
3034
3279
  type: 'remove_from_cart';
3035
3280
  sku: string;
3036
3281
  qty: number;
3282
+ }
3283
+ /**
3284
+ * A fan asked to be told when a sold-out SKU returns (0.9.0). The engine records the
3285
+ * interest and raises the message when stock lands; this is the host's chance to
3286
+ * count the demand, which is the number a merchandiser actually wants.
3287
+ */
3288
+ | {
3289
+ type: 'stock_alert_requested';
3290
+ sku: string;
3037
3291
  } | {
3038
3292
  type: 'checkout_handoff';
3039
3293
  cartId: string;
@@ -3043,10 +3297,18 @@ export declare type ShopEvent = {
3043
3297
  action: string;
3044
3298
  } | {
3045
3299
  type: 'session_expired';
3046
- } | {
3300
+ }
3301
+ /**
3302
+ * A message the SDK would have shown, handed over because the host set
3303
+ * `notifications: 'host'`. `description`/`image` (0.7.0) are what the rich toast draws;
3304
+ * a plain error notification has neither.
3305
+ */
3306
+ | {
3047
3307
  type: 'notification';
3048
3308
  tone: 'neutral' | 'success' | 'critical';
3049
3309
  message: string;
3310
+ description?: string;
3311
+ image?: string;
3050
3312
  } | {
3051
3313
  type: 'error';
3052
3314
  code: ErrorCode | undefined;
@@ -3064,13 +3326,14 @@ export declare type ShopEvent = {
3064
3326
  * if the design is ours, and a mismatch if only half of it is.
3065
3327
  *
3066
3328
  * The cart count is real, never fabricated: `useCartCount` returns `null` until it knows,
3067
- * and the badge stays hidden for both `null` and `0` an empty cart wearing a "0" is
3068
- * noise, and a guessed number is worse.
3329
+ * and the badge stays hidden until then. It is shown at zero, as the design draws it
3330
+ * `.cart.icon` has an explicit empty state carrying "0" — but a "0" that appears while the
3331
+ * cart is still loading and then jumps to "3" is a guess wearing a number.
3069
3332
  *
3070
3333
  * Mount it inside `DaznShopProvider`, and inside `CartSheet` if `showCart` is on, since
3071
3334
  * the trigger opens that sheet.
3072
3335
  */
3073
- export declare function ShopHeader({ onBack, onMenu, showCart, backLabel, menuLabel, className, }: ShopHeaderProps): JSX.Element;
3336
+ export declare function ShopHeader({ onBack, onMenu, showCart, floating, backLabel, menuLabel, className, }: ShopHeaderProps): JSX.Element;
3074
3337
 
3075
3338
  export declare interface ShopHeaderProps {
3076
3339
  /**
@@ -3082,6 +3345,14 @@ export declare interface ShopHeaderProps {
3082
3345
  onMenu?: () => void;
3083
3346
  /** The cart icon and its live count. */
3084
3347
  showCart?: boolean;
3348
+ /**
3349
+ * Lay the bar over the content instead of above it, with no background of its own.
3350
+ *
3351
+ * For screens whose artwork starts at the top of the display — the category page, where
3352
+ * the hero's own measurements are taken from y=0. The parent must establish a containing
3353
+ * block, and the content beneath must expect nothing reserved for the bar.
3354
+ */
3355
+ floating?: boolean;
3085
3356
  /** Accessible name for the back control, for a host that is not in English. */
3086
3357
  backLabel?: string;
3087
3358
  menuLabel?: string;
@@ -3350,12 +3621,38 @@ export declare interface StatusBadgeProps {
3350
3621
  }
3351
3622
 
3352
3623
  /** Bottom-pinned CTA bar, safe-area aware. Holds one or two primary actions. */
3353
- export declare function StickyCtaBar({ children, info }: StickyCtaBarProps): JSX.Element;
3624
+ export declare function StickyCtaBar({ children, info, variant }: StickyCtaBarProps): JSX.Element;
3354
3625
 
3355
3626
  export declare interface StickyCtaBarProps {
3356
3627
  children: ReactNode;
3357
3628
  /** Optional content shown above the actions (e.g. a total). */
3358
3629
  info?: ReactNode;
3630
+ /**
3631
+ * `floating` (default) is the PDP bar: rounded top, drop shadow. `divider` is the cart
3632
+ * bar: square, hairline top border. Two different frames in Figma, not a preference.
3633
+ */
3634
+ variant?: 'floating' | 'divider';
3635
+ }
3636
+
3637
+ /** `POST /v1/stock-alerts` — tell me when this is buyable again. */
3638
+ declare const StockAlertRequest: z.ZodObject<{
3639
+ /**
3640
+ * The variant a fan actually wants, when one is resolvable — a fan who chose Black /
3641
+ * M does not want telling that White / L came back. The parent product SKU is
3642
+ * accepted and means "any variant of this product".
3643
+ */
3644
+ sku: z.ZodString;
3645
+ }, "strict", z.ZodTypeAny, {
3646
+ sku: string;
3647
+ }, {
3648
+ sku: string;
3649
+ }>;
3650
+
3651
+ declare type StockAlertRequest = z.infer<typeof StockAlertRequest>;
3652
+
3653
+ declare interface SummaryRow {
3654
+ label: string;
3655
+ key: keyof Pricing;
3359
3656
  }
3360
3657
 
3361
3658
  export declare function swatchColour(name: string): string;
@@ -3366,8 +3663,22 @@ export declare interface ToastAction {
3366
3663
  onAction: () => void;
3367
3664
  }
3368
3665
 
3666
+ /**
3667
+ * `show` takes a tone or an options object as its second argument. The positional form
3668
+ * stays because it is public API and DAZN are integrated against 0.6.x.
3669
+ */
3369
3670
  declare interface ToastApi {
3370
- show: (message: string, tone?: ToastTone, action?: ToastAction) => void;
3671
+ show: (message: string, toneOrOptions?: ToastTone | ToastOptions, action?: ToastAction) => void;
3672
+ }
3673
+
3674
+ /** The richer toast: Figma `toast-added-to-cart`. Both fields optional and independent. */
3675
+ declare interface ToastOptions {
3676
+ tone?: ToastTone;
3677
+ action?: ToastAction;
3678
+ /** Second line, quieter and smaller — e.g. `DAZN Hoodie · Size M`. */
3679
+ description?: string;
3680
+ /** 40×40 thumbnail. Decorative, so never given alt text. */
3681
+ image?: string;
3371
3682
  }
3372
3683
 
3373
3684
  export declare function ToastProvider({ children }: {
@@ -3516,12 +3827,17 @@ export declare interface VariantSelectorProps {
3516
3827
  labelAttribute?: string;
3517
3828
  }
3518
3829
 
3519
- /** "Why shop with us" reassurance rows. */
3830
+ /** "Why shop with us" reassurance tiles. */
3520
3831
  export declare function WhyUs({ items }: {
3521
3832
  items: WhyUsItem[];
3522
3833
  }): JSX.Element;
3523
3834
 
3524
3835
  declare interface WhyUsItem {
3836
+ /**
3837
+ * Accepted and ignored. The built design carries no icons — only the component's own
3838
+ * description still mentions them, and it predates the frame. Kept so a host passing it
3839
+ * does not break.
3840
+ */
3525
3841
  icon?: 'payment' | 'delivery' | 'returns';
3526
3842
  title: string;
3527
3843
  body: string;