@nok-integration/storefront-react 0.24.0 → 0.25.0

package/dist/index.d.ts

@@ -63,7 +63,7 @@ export declare interface BadgeProps {
 
 export declare type BadgeTone = 'neutral' | 'success' | 'critical' | 'promo';
 
-export declare function BottomSheet({ open, onClose, title, children, footer }: BottomSheetProps): JSX.Element | null;
+export declare function BottomSheet({ open, onClose, title, children, footer, wide }: BottomSheetProps): JSX.Element | null;
 
 export declare interface BottomSheetProps {
     open: boolean;
@@ -72,6 +72,7 @@ export declare interface BottomSheetProps {
     children: ReactNode;
     /** Optional sticky footer (e.g. a StickyCtaBar). */
     footer?: ReactNode;
+    wide?: 'sheet' | 'panel';
 }
 
 /**
@@ -419,13 +420,19 @@ declare const CategoryHero: z.ZodObject<{
     title: z.ZodString;
     subtitle: z.ZodOptional<z.ZodString>;
     image: z.ZodOptional<z.ZodString>;
+    /**
+     * The hero at desktop width (1200px and up). Absent = `image` is used at every width.
+     */
+    desktop_image: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
     title: string;
     image?: string | undefined;
+    desktop_image?: string | undefined;
     subtitle?: string | undefined;
 }, {
     title: string;
     image?: string | undefined;
+    desktop_image?: string | undefined;
     subtitle?: string | undefined;
 }>;
 
@@ -437,13 +444,19 @@ declare const CategoryPage: z.ZodObject<{
         title: z.ZodString;
         subtitle: z.ZodOptional<z.ZodString>;
         image: z.ZodOptional<z.ZodString>;
+        /**
+         * The hero at desktop width (1200px and up). Absent = `image` is used at every width.
+         */
+        desktop_image: z.ZodOptional<z.ZodString>;
     }, "strip", z.ZodTypeAny, {
         title: string;
         image?: string | undefined;
+        desktop_image?: string | undefined;
         subtitle?: string | undefined;
     }, {
         title: string;
         image?: string | undefined;
+        desktop_image?: string | undefined;
         subtitle?: string | undefined;
     }>;
     blocks: z.ZodArray<z.ZodDiscriminatedUnion<"kind", [z.ZodObject<{
@@ -1299,14 +1312,22 @@ declare const CategoryPage: z.ZodObject<{
         kind: z.ZodLiteral<"lifestyle_image">;
         images: z.ZodArray<z.ZodString, "many">;
         videos: z.ZodOptional<z.ZodArray<z.ZodNullable<z.ZodString>, "many">>;
+        /**
+         * Parallel to `images`: the still drawn for slide `i` at desktop width (1200px and up),
+         * in place of `images[i]` and of `videos[i]`. `null`, or an index past the end, keeps
+         * that slide as it is at every width. Like `videos`, it never adds a slide.
+         */
+        desktop_images: z.ZodOptional<z.ZodArray<z.ZodNullable<z.ZodString>, "many">>;
     }, "strip", z.ZodTypeAny, {
         kind: "lifestyle_image";
         images: string[];
         videos?: (string | null)[] | undefined;
+        desktop_images?: (string | null)[] | undefined;
     }, {
         kind: "lifestyle_image";
         images: string[];
         videos?: (string | null)[] | undefined;
+        desktop_images?: (string | null)[] | undefined;
     }>, z.ZodObject<{
         kind: z.ZodLiteral<"grid">;
         title: z.ZodOptional<z.ZodString>;
@@ -1676,6 +1697,7 @@ declare const CategoryPage: z.ZodObject<{
     hero: {
         title: string;
         image?: string | undefined;
+        desktop_image?: string | undefined;
         subtitle?: string | undefined;
     };
     blocks: ({
@@ -1776,6 +1798,7 @@ declare const CategoryPage: z.ZodObject<{
         kind: "lifestyle_image";
         images: string[];
         videos?: (string | null)[] | undefined;
+        desktop_images?: (string | null)[] | undefined;
     } | {
         kind: "grid";
         products: {
@@ -1893,6 +1916,7 @@ declare const CategoryPage: z.ZodObject<{
     hero: {
         title: string;
         image?: string | undefined;
+        desktop_image?: string | undefined;
         subtitle?: string | undefined;
     };
     blocks: ({
@@ -1993,6 +2017,7 @@ declare const CategoryPage: z.ZodObject<{
         kind: "lifestyle_image";
         images: string[];
         videos?: (string | null)[] | undefined;
+        desktop_images?: (string | null)[] | undefined;
     } | {
         kind: "grid";
         products: {
@@ -2371,6 +2396,7 @@ declare function createClient(options: ClientOptions): {
                 title: string;
                 image?: string | undefined;
                 subtitle?: string | undefined;
+                desktop_image?: string | undefined;
             };
             blocks: ({
                 title: string;
@@ -2470,6 +2496,7 @@ declare function createClient(options: ClientOptions): {
                 kind: "lifestyle_image";
                 images: string[];
                 videos?: (string | null)[] | undefined;
+                desktop_images?: (string | null)[] | undefined;
             } | {
                 kind: "grid";
                 products: {
@@ -2593,6 +2620,7 @@ declare function createClient(options: ClientOptions): {
                 key: string;
                 cta: string;
                 image?: string | undefined;
+                desktop_image?: string | undefined;
                 target?: string | undefined;
                 video?: string | undefined;
                 focal_y?: number | undefined;
@@ -2949,7 +2977,7 @@ declare function createClient(options: ClientOptions): {
      */
     stockAlerts: {
         /** "Remind me when available" — idempotent per SKU for the session's principal. */
-        create: (body: StockAlertRequest) => Promise<{
+        create: (body: StockAlertRequest, query?: CartMarketQuery) => Promise<{
             sku: string;
             created_at: string;
             notified_at?: string | undefined;
@@ -3761,7 +3789,7 @@ export declare function isUnauthorized(err: unknown): boolean;
  * down the page has no business fetching a megabyte before it is anywhere near the screen,
  * and `ShopVideo` starts its own download when the slide comes into view.
  */
-export declare function LifestyleImage({ images, videos }: LifestyleImageProps): JSX.Element | null;
+export declare function LifestyleImage({ images, videos, desktopImages }: LifestyleImageProps): JSX.Element | null;
 
 declare interface LifestyleImageProps {
     images: string[];
@@ -3771,6 +3799,8 @@ declare interface LifestyleImageProps {
      * contracts 2.51.0.
      */
     videos?: (string | null)[];
+    /** Parallel to `images`: the still drawn for that slide from 1200px wide, `null` for none. */
+    desktopImages?: (string | null)[];
 }
 
 /** Editorial text band between PCP sections. */
@@ -4466,7 +4496,7 @@ declare type OrderDetail = z.infer<typeof OrderDetail>;
 export declare function OrderListView(props: OrderListViewProps): JSX.Element;
 
 export declare interface OrderListViewProps {
-    /** Opens one order. Without it the rows render as static cards rather than dead links. */
+    /** Opens one order on a route of your own. Without it the order opens in place of the list. */
     onOpenOrder?: (orderRef: string) => void;
     /**
      * Open one return on a route of your own.
@@ -4478,7 +4508,7 @@ export declare interface OrderListViewProps {
      * landing them on the order is a different answer to the question they asked.
      */
     onOpenReturn?: (returnRef: string) => void;
-    /** The empty state's call to action — the design's "Continue shopping" button. */
+    /** The empty state's "Continue shopping". Without it the button navigates to the shop home. */
     onStartShopping?: () => void;
     /** Overrides the provider's locale for dates. */
     locale?: string;
@@ -4518,7 +4548,7 @@ export declare interface OrderStatusBadgeProps {
  * The pricing breakdown. DISPLAY ONLY — every value is server-authoritative; the UI
  * never sums or computes anything here.
  */
-export declare function OrderSummary({ pricing, deferred, hidden, rows, discount, }: OrderSummaryProps): JSX.Element;
+export declare function OrderSummary({ pricing, deferred, hidden, rows, discount, collapsible, }: OrderSummaryProps): JSX.Element;
 
 export declare interface OrderSummaryProps {
     pricing: Pricing;
@@ -4569,6 +4599,7 @@ export declare interface OrderSummaryProps {
      * the grand total is DAZN's, never the sum of the rows above it.
      */
     discount?: Money;
+    collapsible?: boolean;
 }
 
 export declare function OrderTimeline({ progress, estimatedDelivery, locale: localeProp, }: OrderTimelineProps): JSX.Element;
@@ -5734,14 +5765,6 @@ declare interface Review {
     author: string;
 }
 
-/**
- * Tester-quote carousel — swipeable cards with dot pagination.
- *
- * These are tester quotes, not customer reviews: no stars and no ratings, and the `author`
- * under each quote is what says whose words they are — a team and a city, never a person.
- * A quote must therefore never arrive without one. The block draws no disclaimer line, in
- * line with the frame.
- */
 export declare function ReviewCarousel({ quotes }: ReviewCarouselProps): JSX.Element;
 
 declare interface ReviewCarouselProps {
@@ -5760,6 +5783,18 @@ export declare interface SaleBadgeProps {
     pct: number;
 }
 
+export declare interface ScreenCrumb {
+    label: string;
+    to?: ShopRoute;
+}
+
+export declare interface ScreenNav {
+    crumbs: ScreenCrumb[];
+    tone: ScreenNavTone;
+}
+
+export declare type ScreenNavTone = 'media' | 'light';
+
 /**
  * What a whole screen looks like while its data is in flight.
  *
@@ -6064,28 +6099,15 @@ export declare interface ShopHeaderProps {
     className?: string;
 }
 
-/**
- * The replacement for `next/image` inside the SDK.
- *
- * `next/image` cannot come with us: it needs the Next runtime and its optimiser
- * endpoint, and the SDK runs in DAZN's bundle where neither exists. So this is a plain
- * `<img>` with the platform features that actually carry the weight — native lazy
- * loading, `decoding="async"`, `sizes`, and `fetchpriority` for the LCP image.
- *
- * **What is genuinely lost is on-the-fly resizing and format negotiation** (AVIF/WebP
- * per browser). That is not something a component can polyfill — it is a serving
- * concern. Whoever serves the catalogue media should emit `srcset`-ready derivatives
- * and modern formats; until then, this renders the source as given rather than
- * pretending to optimise it.
- *
- * The one rewrite it does perform is rebasing **root-relative** paths onto the host's
- * `assetBaseUrl` — see {@link resolveAssetUrl}. Without it the SDK's own design imagery
- * is requested from the host's origin, which does not serve it.
- */
-export declare function ShopImage({ src, alt, fill, width, height, sizes, className, style, priority, }: ShopImageProps): JSX.Element;
+export declare function ShopImage({ src, desktopSrc, alt, fill, width, height, sizes, className, style, priority, }: ShopImageProps): JSX.Element;
 
 export declare interface ShopImageProps {
     src: string;
+    /**
+     * Drawn instead of `src` from 1200px wide. The browser picks one before fetching, so only
+     * the one shown is downloaded and nothing moves when it is chosen.
+     */
+    desktopSrc?: string;
     alt: string;
     /**
      * Fill the positioned ancestor, as `next/image`'s `fill` does. The parent must be
@@ -6146,7 +6168,7 @@ export declare interface ShopLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnc
  * that has one passes `onHelp`. An inert row is marked `aria-disabled`, so a screen reader
  * is told what a sighted fan discovers by tapping.
  */
-export declare function ShopMenuSheet({ open, onClose, onManageOrders, onHelp, closeLabel, label, }: ShopMenuSheetProps): JSX.Element | null;
+export declare function ShopMenuSheet({ open, onClose, onManageOrders, onHelp, closeLabel, label, placement, }: ShopMenuSheetProps): JSX.Element | null;
 
 export declare interface ShopMenuSheetProps {
     open: boolean;
@@ -6160,6 +6182,16 @@ export declare interface ShopMenuSheetProps {
     closeLabel?: string;
     /** Accessible name for the dialog itself; it has no visible title in the design. */
     label?: string;
+    placement?: 'sheet' | 'dropdown';
+}
+
+export declare function ShopNav({ onManageOrders, onHelp, menuLabel, className }: ShopNavProps): JSX.Element | null;
+
+export declare interface ShopNavProps {
+    onManageOrders?: () => void;
+    onHelp?: () => void;
+    menuLabel?: string;
+    className?: string;
 }
 
 /**
@@ -6167,7 +6199,7 @@ export declare interface ShopMenuSheetProps {
  * implementation detail — see the versioning policy in the component SDK specification.
  */
 /** A storefront-relative identifier. NOT a URL expected to resolve on the host. */
-export declare type ShopRoute = '/' | `/category/${string}` | `/product/${string}` | '/cart' | `/vip/${string}`;
+export declare type ShopRoute = '/' | `/category/${string}` | `/product/${string}` | '/cart' | '/orders' | `/vip/${string}`;
 
 /**
  * Request: the shopping session id and the one-time code, exactly as they arrive on the
@@ -6762,6 +6794,10 @@ export declare interface UseProductResult {
     error: ReturnType<typeof codeOf> | undefined;
 }
 
+export declare function useScreenNav(): ScreenNav | undefined;
+
+export declare function useSetScreenNav(crumbs: ScreenCrumb[] | undefined, tone: ScreenNavTone): void;
+
 /** The typed, schema-validating commerce client. Requires a provider. */
 export declare function useShopApi(): DaznClient;