@nok-integration/storefront-react 0.19.42 → 0.19.44

package/dist/index.d.ts

@@ -3282,6 +3282,7 @@ export declare interface DaznShopConfig {
     assetBaseUrl?: string;
     market?: Market;
     navigate?: Navigate;
+    prefetch?: Prefetch;
     /**
      * @deprecated No longer affects how anything renders, and safe to remove.
      *
@@ -4451,6 +4452,9 @@ export declare interface PdpBadgesProps {
     badges: string[];
 }
 
+/** Optional host router warm-up. Omit it and every navigation is a cold fetch. */
+export declare type Prefetch = (to: ShopRoute) => void;
+
 /**
  * Displays a price with an optional discount. DISPLAY ONLY — it never computes totals;
  * any percentage shown is a presentational rounding of values the server already
@@ -5568,6 +5572,7 @@ declare interface ShopContextValue {
     /** Listen to the same event stream the host sees. Returns an unsubscribe. */
     subscribe: (listener: OnEvent) => () => void;
     navigate: (to: ShopRoute) => void;
+    prefetch: ((to: ShopRoute) => void) | null;
 }
 
 export declare type ShopEvent = {
@@ -6417,6 +6422,8 @@ export declare function useMoney(defaultLocale?: string): {
  */
 export declare function useNavigate(): ((to: ShopRoute) => void) | null;
 
+export declare function usePrefetch(): ((to: ShopRoute) => void) | null;
+
 /**
  * The data behind a product screen: the product, then inventory and recommendations.
  *

package/dist/index.mjs

@@ -5257,7 +5257,7 @@ function NoScreenTitle({ children }) {
 }
 const ShopContext = createContext(null);
 function DaznShopProvider({ children, ...config }) {
-  const { apiBaseUrl, getToken, market, navigate: hostNavigate, sessionTransport = "bearer", theme = "auto", notifications = "internal", onEvent, locale, assetBaseUrl } = config;
+  const { apiBaseUrl, getToken, market, navigate: hostNavigate, prefetch: hostPrefetch, sessionTransport = "bearer", theme = "auto", notifications = "internal", onEvent, locale, assetBaseUrl } = config;
   const listeners = useRef(/* @__PURE__ */ new Set());
   const subscribe = useCallback((listener) => {
     listeners.current.add(listener);
@@ -5320,8 +5320,9 @@ function DaznShopProvider({ children, ...config }) {
     assetBaseUrl,
     emit,
     subscribe,
-    navigate
-  }), [api, market, products, theme, notifications, locale, assetBaseUrl, emit, subscribe, navigate]);
+    navigate,
+    prefetch: hostPrefetch ?? null
+  }), [api, market, products, theme, notifications, locale, assetBaseUrl, emit, subscribe, navigate, hostPrefetch]);
   return jsx(ShopContext.Provider, {
     value: value2,
     children: jsx(ScreenTitleProvider, {
@@ -5345,6 +5346,9 @@ function useShopApi() {
 function useNavigate() {
   return useShopOptional()?.navigate ?? null;
 }
+function usePrefetch() {
+  return useShopOptional()?.prefetch ?? null;
+}
 function useAssetUrl() {
   const base = useShopOptional()?.assetBaseUrl;
   return useCallback((src) => resolveAssetUrl(src, base), [base]);
@@ -5355,7 +5359,35 @@ function useShopEvent() {
 }
 function ShopLink({ to, children, ...rest }) {
   const navigate = useNavigate();
+  const prefetch = usePrefetch();
+  const anchor2 = useRef(null);
+  const warmed = useRef(false);
+  const warm = () => {
+    if (warmed.current || !prefetch) return;
+    warmed.current = true;
+    prefetch(to);
+  };
+  useEffect(() => {
+    warmed.current = false;
+  }, [to]);
+  useEffect(() => {
+    const el = anchor2.current;
+    if (!el || !prefetch || typeof IntersectionObserver === "undefined") return;
+    const observer = new IntersectionObserver((entries) => {
+      for (const entry of entries) {
+        if (!entry.isIntersecting) continue;
+        observer.disconnect();
+        warm();
+      }
+    }, {
+      rootMargin: "200px"
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [prefetch, to]);
   return jsx("a", {
+    ref: anchor2,
+    onPointerDown: warm,
     href: to,
     onClick: (event) => {
       if (!navigate || event.defaultPrevented || event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || rest.target && rest.target !== "_self") {
@@ -5524,8 +5556,8 @@ function Skeleton({ width, height, radius, className, circle }) {
     style
   });
 }
-const surface$1 = "_surface_ekrjo_10";
-const fill = "_fill_ekrjo_35";
+const surface$1 = "_surface_1xwok_10";
+const fill = "_fill_1xwok_35";
 const styles$O = {
   surface: surface$1,
   fill
@@ -6599,27 +6631,27 @@ function renderValue(key, pricing, format, t) {
   }
   return key === "discount" ? null : format(pricing[key]);
 }
-const lines$1 = "_lines_1nchz_19";
-const line$2 = "_line_1nchz_19";
-const thumb$2 = "_thumb_1nchz_34";
-const image$9 = "_image_1nchz_44";
-const placeholder$8 = "_placeholder_1nchz_51";
-const lineBody = "_lineBody_1nchz_56";
-const lineText = "_lineText_1nchz_65";
-const lineTitle = "_lineTitle_1nchz_75";
-const lineMeta = "_lineMeta_1nchz_107";
-const detail$1 = "_detail_1nchz_104";
-const linePrice = "_linePrice_1nchz_128";
-const paid$3 = "_paid_1nchz_140";
-const was$4 = "_was_1nchz_153";
-const card$4 = "_card_1nchz_176";
-const cardTitle = "_cardTitle_1nchz_184";
-const cardBody = "_cardBody_1nchz_196";
-const summaryCard = "_summaryCard_1nchz_168";
-const itemsHeader = "_itemsHeader_1nchz_14";
-const itemsTitle = "_itemsTitle_1nchz_239";
-const itemsCount = "_itemsCount_1nchz_250";
-const cardLines = "_cardLines_1nchz_269";
+const lines$1 = "_lines_15b52_19";
+const line$2 = "_line_15b52_19";
+const thumb$2 = "_thumb_15b52_34";
+const image$9 = "_image_15b52_44";
+const placeholder$8 = "_placeholder_15b52_51";
+const lineBody = "_lineBody_15b52_56";
+const lineText = "_lineText_15b52_65";
+const lineTitle = "_lineTitle_15b52_75";
+const lineMeta = "_lineMeta_15b52_107";
+const detail$1 = "_detail_15b52_104";
+const linePrice = "_linePrice_15b52_128";
+const paid$3 = "_paid_15b52_140";
+const was$4 = "_was_15b52_153";
+const card$4 = "_card_15b52_176";
+const cardTitle = "_cardTitle_15b52_184";
+const cardBody = "_cardBody_15b52_196";
+const summaryCard = "_summaryCard_15b52_168";
+const itemsHeader = "_itemsHeader_15b52_14";
+const itemsTitle = "_itemsTitle_15b52_225";
+const itemsCount = "_itemsCount_15b52_236";
+const cardLines = "_cardLines_15b52_255";
 const styles$F = {
   lines: lines$1,
   line: line$2,
@@ -7057,17 +7089,17 @@ function ReturnItemRow({ item: item2, className }) {
     })]
   });
 }
-const page$6 = "_page_1wude_7";
-const titles$2 = "_titles_1wude_15";
-const title$k = "_title_1wude_15";
-const subtitle$7 = "_subtitle_1wude_30";
-const list$2 = "_list_1wude_38";
-const card$3 = "_card_1wude_48";
-const checkSlot = "_checkSlot_1wude_61";
-const check = "_check_1wude_61";
-const row$6 = "_row_1wude_105";
-const reason = "_reason_1wude_130";
-const reasonSet = "_reasonSet_1wude_150";
+const page$6 = "_page_v0hbj_7";
+const titles$2 = "_titles_v0hbj_15";
+const title$k = "_title_v0hbj_15";
+const subtitle$7 = "_subtitle_v0hbj_30";
+const list$2 = "_list_v0hbj_38";
+const card$3 = "_card_v0hbj_48";
+const checkSlot = "_checkSlot_v0hbj_61";
+const check = "_check_v0hbj_61";
+const row$6 = "_row_v0hbj_105";
+const reason = "_reason_v0hbj_112";
+const reasonSet = "_reasonSet_v0hbj_132";
 const styles$B = {
   page: page$6,
   titles: titles$2,
@@ -7943,13 +7975,13 @@ function HelpRow({ label: label2, status, onClick }) {
 function shortRef$1(orderRef) {
   return orderRef.replace(/^ord_/, "");
 }
-const page$2 = "_page_o6awf_6";
-const confirmed = "_confirmed_o6awf_16";
-const title$h = "_title_o6awf_22";
-const headline = "_headline_o6awf_47";
-const subtitle$4 = "_subtitle_o6awf_65";
-const rule = "_rule_o6awf_89";
-const done = "_done_o6awf_106";
+const page$2 = "_page_vqbqs_6";
+const confirmed = "_confirmed_vqbqs_16";
+const title$h = "_title_vqbqs_22";
+const headline = "_headline_vqbqs_47";
+const subtitle$4 = "_subtitle_vqbqs_65";
+const rule = "_rule_vqbqs_77";
+const done = "_done_vqbqs_94";
 const styles$x = {
   page: page$2,
   confirmed,
@@ -8698,16 +8730,16 @@ function RailCarousel({ title: title2, products, seeAllTo, inset: inset2 }) {
     })]
   });
 }
-const overlay$2 = "_overlay_fszc5_1";
-const scrim$4 = "_scrim_fszc5_10";
-const sheet$2 = "_sheet_fszc5_16";
-const grabArea = "_grabArea_fszc5_41";
-const grabber = "_grabber_fszc5_51";
-const header$4 = "_header_fszc5_59";
-const title$c = "_title_fszc5_67";
-const close$1 = "_close_fszc5_71";
-const body$4 = "_body_fszc5_84";
-const footer = "_footer_fszc5_97";
+const overlay$2 = "_overlay_uxpgl_1";
+const scrim$4 = "_scrim_uxpgl_10";
+const sheet$2 = "_sheet_uxpgl_16";
+const grabArea = "_grabArea_uxpgl_41";
+const grabber = "_grabber_uxpgl_51";
+const header$4 = "_header_uxpgl_59";
+const title$c = "_title_uxpgl_67";
+const close$1 = "_close_uxpgl_71";
+const body$4 = "_body_uxpgl_84";
+const footer = "_footer_uxpgl_97";
 const styles$o = {
   overlay: overlay$2,
   scrim: scrim$4,
@@ -9139,11 +9171,11 @@ function ShippingInfo() {
     })]
   });
 }
-const bar = "_bar_1e0f6_1";
-const floating$1 = "_floating_1e0f6_53";
-const divider = "_divider_1e0f6_59";
-const info$1 = "_info_1e0f6_63";
-const actions = "_actions_1e0f6_71";
+const bar = "_bar_v20rr_1";
+const floating$1 = "_floating_v20rr_31";
+const divider = "_divider_v20rr_37";
+const info$1 = "_info_v20rr_41";
+const actions = "_actions_v20rr_49";
 const styles$k = {
   bar,
   floating: floating$1,
@@ -9163,14 +9195,14 @@ function StickyCtaBar({ children, info: info2, variant = "floating" }) {
     })]
   });
 }
-const surface = "_surface_3g1wi_15";
-const screen = "_screen_3g1wi_20";
-const body$3 = "_body_3g1wi_12";
-const items = "_items_3g1wi_34";
-const sectionHeader = "_sectionHeader_3g1wi_40";
-const sectionTitle = "_sectionTitle_3g1wi_46";
-const count = "_count_3g1wi_67";
-const lines = "_lines_3g1wi_91";
+const surface = "_surface_15488_15";
+const screen = "_screen_15488_20";
+const body$3 = "_body_15488_12";
+const items = "_items_15488_34";
+const sectionHeader = "_sectionHeader_15488_40";
+const sectionTitle = "_sectionTitle_15488_46";
+const count = "_count_15488_55";
+const lines = "_lines_15488_79";
 const styles$j = {
   surface,
   screen,
@@ -9429,14 +9461,14 @@ function CartSheetProvider({ children }) {
     })]
   });
 }
-const gallery = "_gallery_o876w_1";
-const track$2 = "_track_o876w_5";
-const slide$1 = "_slide_o876w_29";
-const image$4 = "_image_o876w_36";
-const placeholder$1 = "_placeholder_o876w_40";
-const dots$2 = "_dots_o876w_58";
-const dot$2 = "_dot_o876w_58";
-const dotActive$2 = "_dotActive_o876w_109";
+const gallery = "_gallery_1wmgz_1";
+const track$2 = "_track_1wmgz_5";
+const slide$1 = "_slide_1wmgz_20";
+const image$4 = "_image_1wmgz_27";
+const placeholder$1 = "_placeholder_1wmgz_31";
+const dots$2 = "_dots_1wmgz_49";
+const dot$2 = "_dot_1wmgz_49";
+const dotActive$2 = "_dotActive_1wmgz_100";
 const styles$i = {
   gallery,
   track: track$2,
@@ -10402,14 +10434,14 @@ function ProductDetail({ product, inventory: inventory2, recommendations = [] })
     })]
   });
 }
-const hero$1 = "_hero_s25l3_10";
-const image$2 = "_image_s25l3_42";
-const scrim$1 = "_scrim_s25l3_70";
-const fade = "_fade_s25l3_94";
-const text$2 = "_text_s25l3_108";
-const title$5 = "_title_s25l3_157";
-const subtitle$2 = "_subtitle_s25l3_168";
-const noImage = "_noImage_s25l3_183";
+const hero$1 = "_hero_1tiqx_10";
+const image$2 = "_image_1tiqx_42";
+const scrim$1 = "_scrim_1tiqx_70";
+const fade = "_fade_1tiqx_94";
+const text$2 = "_text_1tiqx_108";
+const title$5 = "_title_1tiqx_157";
+const subtitle$2 = "_subtitle_1tiqx_168";
+const noImage = "_noImage_1tiqx_183";
 const styles$9 = {
   hero: hero$1,
   image: image$2,
@@ -10925,24 +10957,24 @@ function ProductView({ sku, initialData, showRecommendations = true, onNotFound
     })
   });
 }
-const showcase = "_showcase_t7w1s_59";
-const panel = "_panel_t7w1s_63";
-const image = "_image_t7w1s_91";
-const hero = "_hero_t7w1s_131";
-const heroContent = "_heroContent_t7w1s_212";
-const heroText = "_heroText_t7w1s_236";
-const logo = "_logo_t7w1s_245";
-const heroTitle = "_heroTitle_t7w1s_265";
-const heroSub = "_heroSub_t7w1s_289";
-const swipe = "_swipe_t7w1s_308";
-const swipeLabel = "_swipeLabel_t7w1s_315";
-const chevron$1 = "_chevron_t7w1s_321";
-const overlay$1 = "_overlay_t7w1s_11";
-const copy = "_copy_t7w1s_356";
-const title$2 = "_title_t7w1s_361";
-const subtitle$1 = "_subtitle_t7w1s_368";
-const cta = "_cta_t7w1s_374";
-const mosaic = "_mosaic_t7w1s_418";
+const showcase = "_showcase_x4nga_14";
+const panel = "_panel_x4nga_19";
+const image = "_image_x4nga_48";
+const hero = "_hero_x4nga_88";
+const heroContent = "_heroContent_x4nga_173";
+const heroText = "_heroText_x4nga_197";
+const logo = "_logo_x4nga_206";
+const heroTitle = "_heroTitle_x4nga_226";
+const heroSub = "_heroSub_x4nga_250";
+const swipe = "_swipe_x4nga_269";
+const swipeLabel = "_swipeLabel_x4nga_276";
+const chevron$1 = "_chevron_x4nga_282";
+const overlay$1 = "_overlay_x4nga_11";
+const copy = "_copy_x4nga_317";
+const title$2 = "_title_x4nga_322";
+const subtitle$1 = "_subtitle_x4nga_329";
+const cta = "_cta_x4nga_335";
+const mosaic = "_mosaic_x4nga_379";
 const styles$2 = {
   showcase,
   panel,
@@ -11217,18 +11249,18 @@ function useCartCount() {
   }, [subscribe]);
   return count2;
 }
-const header$1 = "_header_1a3o7_25";
-const floating = "_floating_1a3o7_44";
-const scrolled = "_scrolled_1a3o7_79";
-const title$1 = "_title_1a3o7_172";
-const leading = "_leading_1a3o7_199";
-const right = "_right_1a3o7_205";
-const spacer = "_spacer_1a3o7_218";
-const iconBtn = "_iconBtn_1a3o7_223";
-const menuBtn = "_menuBtn_1a3o7_250";
-const badge = "_badge_1a3o7_278";
-const closeSlot = "_closeSlot_1a3o7_305";
-const centred = "_centred_1a3o7_320";
+const header$1 = "_header_r9jjq_14";
+const floating = "_floating_r9jjq_39";
+const scrolled = "_scrolled_r9jjq_47";
+const title$1 = "_title_r9jjq_121";
+const leading = "_leading_r9jjq_134";
+const right = "_right_r9jjq_140";
+const spacer = "_spacer_r9jjq_153";
+const iconBtn = "_iconBtn_r9jjq_158";
+const menuBtn = "_menuBtn_r9jjq_185";
+const badge = "_badge_r9jjq_194";
+const closeSlot = "_closeSlot_r9jjq_221";
+const centred = "_centred_r9jjq_236";
 const styles$1 = {
   header: header$1,
   floating,
@@ -11702,6 +11734,7 @@ export {
   useCartSheet,
   useMoney,
   useNavigate,
+  usePrefetch,
   useProduct,
   useShopApi,
   useShopEvent,