@faststore/core 3.39.0 → 3.40.0

package/.turbo/turbo-build.log

@@ -1,23 +1,23 @@
 
-> @faststore/core@3.38.3 prebuild /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.39.0 prebuild /home/runner/work/faststore/faststore/packages/core
 > na run partytown && na run generate
 
 
-> @faststore/core@3.38.3 partytown /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.39.0 partytown /home/runner/work/faststore/faststore/packages/core
 > partytown copylib ./public/~partytown
 
 Partytown lib copied to: /home/runner/work/faststore/faststore/packages/core/public/~partytown
 
-> @faststore/core@3.38.3 generate /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.39.0 generate /home/runner/work/faststore/faststore/packages/core
 > na run generate:schema && na run generate:codegen && na run format:generated
 
 
-> @faststore/core@3.38.3 generate:schema /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.39.0 generate:schema /home/runner/work/faststore/faststore/packages/core
 > tsx src/server/generator/generateGraphQLSchemaFile.ts
 
 Schema GraphQL file generated successfully
 
-> @faststore/core@3.38.3 generate:codegen /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.39.0 generate:codegen /home/runner/work/faststore/faststore/packages/core
 > graphql-codegen
 
 [STARTED] Parse Configuration
@@ -37,11 +37,11 @@ Running lifecycle hook "afterStart" scripts...
 [CLI] Loading Documents
 [CLI] Generating output
 
-> @faststore/core@3.38.3 format:generated /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.39.0 format:generated /home/runner/work/faststore/faststore/packages/core
 > prettier --write "@generated/**/*.{ts,js,tsx,jsx,json}" --loglevel error
 
 
-> @faststore/core@3.38.3 build /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.39.0 build /home/runner/work/faststore/faststore/packages/core
 > next build
 
 ⚠ No build cache found. Please configure build caching for faster rebuilds. Read more: https://nextjs.org/docs/messages/no-cache
@@ -71,7 +71,7 @@ Route (pages)                              Size     First Load JS
 ├   └ css/b1806cbafd0c1f81.css             3.06 kB
 ├   /_app                                  0 B            92.4 kB
 ├ ● /[...slug]                             2.34 kB         133 kB
-├ ● /[slug]/p                              35.5 kB         156 kB
+├ ● /[slug]/p                              35.6 kB         156 kB
 ├   ├ css/a3ca6a9b63f657be.css             5.75 kB
 ├   ├ css/62a5153ac7061286.css             6.11 kB
 ├   └ css/b5bf49598c8f8b66.css             16.1 kB
@@ -91,7 +91,7 @@ Route (pages)                              Size     First Load JS
   ├ chunks/framework-807b0f81cbc129f0.js   45.4 kB
   ├ chunks/main-5569625b3fdd6741.js        33.1 kB
   ├ chunks/pages/_app-012e51403727ae6a.js  10.4 kB
-  ├ chunks/webpack-1cd1c4aa7f418483.js     3.59 kB
+  ├ chunks/webpack-071462ed32bcb285.js     3.59 kB
   └ css/0a57ee6c7a57788c.css               3.49 kB
 
 λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

package/.turbo/turbo-test.log

@@ -1,14 +1,15 @@
 
-> @faststore/core@3.38.3 test /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.39.0 test /home/runner/work/faststore/faststore/packages/core
 > jest
 
-PASS test/server/cms/global.test.ts (24.44 s)
-PASS test/utils/multipleTemplates.test.ts (25.325 s)
+PASS test/server/cms/global.test.ts (24.343 s)
+PASS test/utils/multipleTemplates.test.ts (25.211 s)
 PASS test/server/cms/index.test.ts
-PASS test/server/index.test.ts (30.268 s)
+PASS test/server/index.test.ts (28.944 s)
+A worker process has failed to exit gracefully and has been force exited. This is likely caused by tests leaking due to improper teardown. Try running with --detectOpenHandles to find leaks. Active timers can also cause this, ensure that .unref() was called on them.
 
 Test Suites: 4 passed, 4 total
 Tests:       22 passed, 22 total
 Snapshots:   0 total
-Time:        31.501 s
+Time:        30.228 s
 Ran all test suites.

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.40.0](https://github.com/vtex/faststore/compare/v3.39.0...v3.40.0) (2025-04-11)
+
+### Features
+
+- GA `view_item_list` event only when item is in viewport of `ProductGallery` ([#2771](https://github.com/vtex/faststore/issues/2771)) ([16a4efa](https://github.com/vtex/faststore/commit/16a4efa23b7459a4327df0bc994b96c15f44ee5e))
+
 # [3.39.0](https://github.com/vtex/faststore/compare/v3.38.3...v3.39.0) (2025-04-11)
 
 ### Features

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "3.39.0",
+  "version": "3.40.0",
   "license": "MIT",
   "repository": "vtex/faststore",
   "browserslist": "supports es6-module and not dead",
@@ -105,5 +105,5 @@
     "ts-jest": "29.1.1",
     "typescript": "5.3.2"
   },
-  "gitHead": "28aac8ff648e71795c6932b3b7cdc60cbbddbc74"
+  "gitHead": "be8308dc73b997370c8c1aac56682362acfe58c0"
 }

package/src/components/product/ProductGrid/ProductGrid.tsx

@@ -10,6 +10,7 @@ import { memo } from 'react'
 import ViewportObserver from 'src/components/cms/ViewportObserver'
 import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 import useScreenResize from 'src/sdk/ui/useScreenResize'
+import ProductSentinel from 'src/sdk/product/ProductSentinel'
 
 interface Props {
   /**
@@ -35,6 +36,10 @@ interface Props {
    * Determine if the current page is the first page.
    */
   firstPage?: number
+  /**
+   * Title for the `ProductGrid` component that will be send to GA events.
+   */
+  title?: string
 }
 
 function ProductGrid({
@@ -48,6 +53,7 @@ function ProductGrid({
     sponsoredLabel,
   } = {},
   firstPage,
+  title,
 }: Props) {
   const { isMobile } = useScreenResize()
   const { __experimentalProductCard: ProductCard } =
@@ -67,36 +73,19 @@ function ProductGrid({
           <>
             {products.slice(0, 2).map(({ node: product }, idx) => (
               <UIProductGridItem key={`${product.id}`}>
-                <ProductCard.Component
-                  aspectRatio={aspectRatio}
-                  imgProps={{
-                    width: 150,
-                    height: 150,
-                    sizes: '30vw',
-                    loading: 'eager',
-                  }}
-                  {...ProductCard.props}
-                  bordered={bordered ?? ProductCard.props.bordered}
-                  showDiscountBadge={
-                    showDiscountBadge ?? ProductCard.props.showDiscountBadge
-                  }
+                <ProductSentinel
                   product={product}
-                  index={pageSize * page + idx + 1}
-                  taxesConfiguration={taxesConfiguration}
-                  sponsoredLabel={sponsoredLabel}
-                />
-              </UIProductGridItem>
-            ))}
-            <ViewportObserver sectionName="UIProductGrid-out-viewport">
-              {products.slice(2).map(({ node: product }, idx) => (
-                <UIProductGridItem key={`${product.id}`}>
+                  title={title}
+                  page={page}
+                  pageSize={pageSize}
+                >
                   <ProductCard.Component
                     aspectRatio={aspectRatio}
                     imgProps={{
                       width: 150,
                       height: 150,
                       sizes: '30vw',
-                      loading: 'lazy',
+                      loading: 'eager',
                     }}
                     {...ProductCard.props}
                     bordered={bordered ?? ProductCard.props.bordered}
@@ -108,6 +97,37 @@ function ProductGrid({
                     taxesConfiguration={taxesConfiguration}
                     sponsoredLabel={sponsoredLabel}
                   />
+                </ProductSentinel>
+              </UIProductGridItem>
+            ))}
+            <ViewportObserver sectionName="UIProductGrid-out-viewport">
+              {products.slice(2).map(({ node: product }, idx) => (
+                <UIProductGridItem key={`${product.id}`}>
+                  <ProductSentinel
+                    product={product}
+                    title={title}
+                    page={page}
+                    pageSize={pageSize}
+                  >
+                    <ProductCard.Component
+                      aspectRatio={aspectRatio}
+                      imgProps={{
+                        width: 150,
+                        height: 150,
+                        sizes: '30vw',
+                        loading: 'lazy',
+                      }}
+                      {...ProductCard.props}
+                      bordered={bordered ?? ProductCard.props.bordered}
+                      showDiscountBadge={
+                        showDiscountBadge ?? ProductCard.props.showDiscountBadge
+                      }
+                      product={product}
+                      index={pageSize * page + idx + 1}
+                      taxesConfiguration={taxesConfiguration}
+                      sponsoredLabel={sponsoredLabel}
+                    />
+                  </ProductSentinel>
                 </UIProductGridItem>
               ))}
             </ViewportObserver>
@@ -116,24 +136,31 @@ function ProductGrid({
           <>
             {products.map(({ node: product }, idx) => (
               <UIProductGridItem key={`${product.id}`}>
-                <ProductCard.Component
-                  aspectRatio={aspectRatio}
-                  imgProps={{
-                    width: 150,
-                    height: 150,
-                    sizes: '30vw',
-                    loading: idx === 0 ? 'eager' : 'lazy',
-                  }}
-                  {...ProductCard.props}
-                  bordered={bordered ?? ProductCard.props.bordered}
-                  showDiscountBadge={
-                    showDiscountBadge ?? ProductCard.props.showDiscountBadge
-                  }
+                <ProductSentinel
                   product={product}
-                  index={pageSize * page + idx + 1}
-                  taxesConfiguration={taxesConfiguration}
-                  sponsoredLabel={sponsoredLabel}
-                />
+                  title={title}
+                  page={page}
+                  pageSize={pageSize}
+                >
+                  <ProductCard.Component
+                    aspectRatio={aspectRatio}
+                    imgProps={{
+                      width: 150,
+                      height: 150,
+                      sizes: '30vw',
+                      loading: idx === 0 ? 'eager' : 'lazy',
+                    }}
+                    {...ProductCard.props}
+                    bordered={bordered ?? ProductCard.props.bordered}
+                    showDiscountBadge={
+                      showDiscountBadge ?? ProductCard.props.showDiscountBadge
+                    }
+                    product={product}
+                    index={pageSize * page + idx + 1}
+                    taxesConfiguration={taxesConfiguration}
+                    sponsoredLabel={sponsoredLabel}
+                  />
+                </ProductSentinel>
               </UIProductGridItem>
             ))}
           </>

package/src/components/ui/ProductGallery/ProductGalleryPage.tsx

@@ -40,6 +40,7 @@ function ProductGalleryPage({
         pageSize={itemsPerPage}
         productCard={productCard}
         firstPage={firstPage}
+        title={title}
       />
     </Sentinel>
   )

package/src/sdk/analytics/hooks/useViewItemListEvent.ts

@@ -1,4 +1,4 @@
-import { useCallback } from 'react'
+import { useCallback, useRef } from 'react'
 import type { CurrencyCode, ViewItemListEvent } from '@faststore/sdk'
 
 import { useSession } from 'src/sdk/session'
@@ -7,12 +7,16 @@ import type { ProductSummary_ProductFragment } from '@generated/graphql'
 import type { AnalyticsItem } from '../types'
 
 type Props = {
-  products: Array<{ node: ProductSummary_ProductFragment }>
+  products?: Array<{ node: ProductSummary_ProductFragment }>
   title: string
   page: number
   pageSize: number
 }
 
+type ProductsFallbackProps = {
+  products?: Array<{ node: ProductSummary_ProductFragment }>
+}
+
 export const useViewItemListEvent = ({
   products,
   title,
@@ -23,31 +27,40 @@ export const useViewItemListEvent = ({
     currency: { code },
   } = useSession()
 
-  const sendViewItemListEvent = useCallback(() => {
-    import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
-      sendAnalyticsEvent<ViewItemListEvent<AnalyticsItem>>({
-        name: 'view_item_list',
-        params: {
-          item_list_name: title,
-          item_list_id: title,
-          items: products.map(({ node: product }, index) => ({
-            item_id: product.isVariantOf.productGroupID,
-            item_name: product.isVariantOf.name,
-            item_brand: product.brand.name,
-            item_variant: product.sku,
-            price: product.offers.offers[0].price,
-            index: page * pageSize + index + 1,
-            discount:
-              product.offers.offers[0].listPrice -
-              product.offers.offers[0].price,
-            currency: code as CurrencyCode,
-            item_variant_name: product.name,
-            product_reference_id: product.gtin,
-          })),
-        },
+  const sendViewItemListEvent = useCallback(
+    (productsFallback?: ProductsFallbackProps) => {
+      const items = products?.length ? products : productsFallback?.products
+
+      if (!items || items.length === 0) {
+        return
+      }
+
+      import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+        sendAnalyticsEvent<ViewItemListEvent<AnalyticsItem>>({
+          name: 'view_item_list',
+          params: {
+            item_list_name: title,
+            item_list_id: title,
+            items: items.map(({ node: product }, index) => ({
+              item_id: product.isVariantOf.productGroupID,
+              item_name: product.isVariantOf.name,
+              item_brand: product.brand.name,
+              item_variant: product.sku,
+              price: product.offers.offers[0].price,
+              index: page * pageSize + index + 1,
+              discount:
+                product.offers.offers[0].listPrice -
+                product.offers.offers[0].price,
+              currency: code as CurrencyCode,
+              item_variant_name: product.name,
+              product_reference_id: product.gtin,
+            })),
+          },
+        })
       })
-    })
-  }, [code, products, title, page, pageSize])
+    },
+    [code, products, title, page, pageSize]
+  )
 
   return { sendViewItemListEvent }
 }

package/src/sdk/product/ProductSentinel.tsx

@@ -0,0 +1,60 @@
+import { useEffect, type PropsWithChildren } from 'react'
+import { useInView } from 'react-intersection-observer'
+
+import type { ProductSummary_ProductFragment } from '@generated/graphql'
+
+import { useViewItemListEvent } from '../analytics/hooks/useViewItemListEvent'
+import { queueViewItemList } from './viewItemListQueue'
+
+interface ProductSentinelProps {
+  /**
+   * Title for the `ProductSentinel` component.
+   */
+  title: string
+  /**
+   * Product listed on the grid.
+   */
+  product: ProductSummary_ProductFragment
+  /**
+   * The page's number that the Product is being rendered.
+   */
+  page: number
+  /**
+   * Quantity of products listed by page.
+   */
+  pageSize: number
+}
+
+/**
+ * Use this component to add a boundary between Products to send the right view_item_list event to GA in ProductGallery
+ */
+export function ProductSentinel({
+  product,
+  title,
+  page,
+  pageSize,
+  children,
+}: PropsWithChildren<ProductSentinelProps>) {
+  const { ref, inView } = useInView()
+
+  const { sendViewItemListEvent } = useViewItemListEvent({
+    title,
+    page,
+    pageSize,
+  })
+
+  useEffect(() => {
+    if (inView) {
+      queueViewItemList({ product, sendViewItemListEvent })
+    }
+  }, [inView, product])
+
+  return (
+    // minHeight to avoid the layout shift when the sentinel is not in view, '15.225rem' is the min value from the Product Card
+    <div ref={ref} style={{ minHeight: '15.225rem' }}>
+      {children}
+    </div>
+  )
+}
+
+export default ProductSentinel

package/src/sdk/product/viewItemListQueue.ts

@@ -0,0 +1,31 @@
+import type { ProductSummary_ProductFragment } from '@generated/graphql'
+
+const sentItems = new Set<string>()
+let pendingItems: { node: ProductSummary_ProductFragment }[] = []
+let debounceTimeout: NodeJS.Timeout | null = null
+
+type QueueViewItemListProps = {
+  product: ProductSummary_ProductFragment
+  sendViewItemListEvent: (props: {
+    products: Array<{ node: ProductSummary_ProductFragment }>
+  }) => void
+}
+
+export function queueViewItemList({
+  product,
+  sendViewItemListEvent,
+}: QueueViewItemListProps) {
+  if (sentItems.has(product.id)) return
+
+  sentItems.add(product.id)
+  pendingItems.push({ node: product })
+
+  if (debounceTimeout) clearTimeout(debounceTimeout)
+
+  debounceTimeout = setTimeout(() => {
+    if (pendingItems.length > 0) {
+      sendViewItemListEvent({ products: pendingItems })
+      pendingItems = []
+    }
+  }, 300)
+}

package/src/sdk/search/Sentinel.tsx

@@ -1,5 +1,5 @@
 import { useSearch } from '@faststore/sdk'
-import { useEffect, useRef, type PropsWithChildren } from 'react'
+import { useEffect, type PropsWithChildren } from 'react'
 import { useInView } from 'react-intersection-observer'
 import type { NextRouter } from 'next/router'
 import { useRouter } from 'next/router'
@@ -7,7 +7,6 @@ import { useRouter } from 'next/router'
 import type { ProductSummary_ProductFragment } from '@generated/graphql'
 
 import useScreenResize from 'src/sdk/ui/useScreenResize'
-import { useViewItemListEvent } from '../analytics/hooks/useViewItemListEvent'
 
 interface SentinelProps {
   page: number
@@ -39,24 +38,11 @@ const replacePagination = (page: string, router: NextRouter) => {
  * Also, this component's name is kind of curious. Wikipedia calls is Page Break(https://en.wikipedia.org/wiki/Page_break)
  * however all codes I've seen online use Sentinel
  */
-function Sentinel({
-  page,
-  pageSize,
-  products,
-  title,
-  children,
-}: PropsWithChildren<SentinelProps>) {
+function Sentinel({ page, children }: PropsWithChildren<SentinelProps>) {
   const router = useRouter()
   const { pages } = useSearch()
   const { isMobile } = useScreenResize()
   const { ref, inView } = useInView({ threshold: isMobile ? 0.3 : 0.7 })
-  const { sendViewItemListEvent } = useViewItemListEvent({
-    products,
-    title,
-    page,
-    pageSize,
-  })
-  const viewedRef = useRef(false)
 
   useEffect(() => {
     // Only replace pagination state when infinite scroll
@@ -64,19 +50,7 @@ function Sentinel({
     if (inView && pages.length > 1) {
       replacePagination(page.toString(), router)
     }
-
-    if (inView && !viewedRef.current && products.length) {
-      sendViewItemListEvent()
-      viewedRef.current = true
-    }
-  }, [
-    pages.length,
-    inView,
-    page,
-    router,
-    sendViewItemListEvent,
-    products.length,
-  ])
+  }, [pages.length, inView, page])
 
   return <div ref={ref}>{children}</div>
 }

package/.next/static/chunks/3143.1aaec7f4a9e83b8d.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[3143],{3143:function(e,r,t){t.r(r),t.d(r,{default:function(){return w}});var n=t(4424),i=t(9115),o=t(1347),s=t(3125),a=t(4194),c=t(143),d=t(6220),u=t(6259),l=t(1549);function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter(function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable})),t.push.apply(t,n)}return t}function _objectSpread(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?ownKeys(Object(t),!0).forEach(function(r){(0,n.Z)(e,r,t[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):ownKeys(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})}return e}var p=(0,a.memo)(function(e){var{products:r,page:t,pageSize:n,productCard:{showDiscountBadge:a,bordered:p,taxesConfiguration:h,sponsoredLabel:f}={},firstPage:v}=e,{isMobile:g}=(0,u.Z)(),{__experimentalProductCard:b}=(0,d.r3)();return(0,l.jsx)(s.Z,{aspectRatio:1,loading:0===r.length,children:(0,l.jsx)(i.Z,{children:g&&v===t?(0,l.jsxs)(l.Fragment,{children:[r.slice(0,2).map((e,r)=>{var{node:i}=e;return(0,l.jsx)(o.Z,{children:(0,l.jsx)(b.Component,_objectSpread(_objectSpread({aspectRatio:1,imgProps:{width:150,height:150,sizes:"30vw",loading:"eager"}},b.props),{},{bordered:null!=p?p:b.props.bordered,showDiscountBadge:null!=a?a:b.props.showDiscountBadge,product:i,index:n*t+r+1,taxesConfiguration:h,sponsoredLabel:f}))},"".concat(i.id))}),(0,l.jsx)(c.Z,{sectionName:"UIProductGrid-out-viewport",children:r.slice(2).map((e,r)=>{var{node:i}=e;return(0,l.jsx)(o.Z,{children:(0,l.jsx)(b.Component,_objectSpread(_objectSpread({aspectRatio:1,imgProps:{width:150,height:150,sizes:"30vw",loading:"lazy"}},b.props),{},{bordered:null!=p?p:b.props.bordered,showDiscountBadge:null!=a?a:b.props.showDiscountBadge,product:i,index:n*t+r+1,taxesConfiguration:h,sponsoredLabel:f}))},"".concat(i.id))})})]}):(0,l.jsx)(l.Fragment,{children:r.map((e,r)=>{var{node:i}=e;return(0,l.jsx)(o.Z,{children:(0,l.jsx)(b.Component,_objectSpread(_objectSpread({aspectRatio:1,imgProps:{width:150,height:150,sizes:"30vw",loading:0===r?"eager":"lazy"}},b.props),{},{bordered:null!=p?p:b.props.bordered,showDiscountBadge:null!=a?a:b.props.showDiscountBadge,product:i,index:n*t+r+1,taxesConfiguration:h,sponsoredLabel:f}))},"".concat(i.id))})})})})}),h=t(9029),f=t(6410),v=t(4444),g=t(2032),replacePagination=(e,r)=>{var t=new URL(window.location.href);t.searchParams.get("page")!==e&&(t.searchParams.set("page",e),r.replace(t,void 0,{shallow:!0,scroll:!1}))},search_Sentinel=function(e){var{page:r,pageSize:t,products:n,title:i,children:o}=e,s=(0,v.useRouter)(),{pages:c}=(0,h.R)(),{isMobile:d}=(0,u.Z)(),{ref:p,inView:b}=(0,f.YD)({threshold:d?.3:.7}),{sendViewItemListEvent:w}=(0,g.m)({products:n,title:i,page:r,pageSize:t}),y=(0,a.useRef)(!1);return(0,a.useEffect)(()=>{b&&c.length>1&&replacePagination(r.toString(),s),b&&!y.current&&n.length&&(w(),y.current=!0)},[c.length,b,r,s,w,n.length]),(0,l.jsx)("div",{ref:p,children:o})},b=t(2125),w=(0,a.memo)(function(e){var r,t,n,{page:i,title:o,productCard:s,itemsPerPage:a,firstPage:c}=e,{data:d}=(0,b.__)(i),u=null!==(r=null==d?void 0:null===(t=d.search)||void 0===t?void 0:null===(n=t.products)||void 0===n?void 0:n.edges)&&void 0!==r?r:[];return(0,l.jsx)(search_Sentinel,{products:u,page:i,pageSize:a,title:o,children:(0,l.jsx)(p,{products:u,page:i,pageSize:a,productCard:s,firstPage:c})})})},2032:function(e,r,t){t.d(r,{m:function(){return useViewItemListEvent}});var n=t(4194),i=t(4355),useViewItemListEvent=e=>{var{products:r,title:o,page:s,pageSize:a}=e,{currency:{code:c}}=(0,i.kP)();return{sendViewItemListEvent:(0,n.useCallback)(()=>{t.e(7195).then(t.bind(t,1153)).then(e=>{var{sendAnalyticsEvent:t}=e;t({name:"view_item_list",params:{item_list_name:o,item_list_id:o,items:r.map((e,r)=>{var{node:t}=e;return{item_id:t.isVariantOf.productGroupID,item_name:t.isVariantOf.name,item_brand:t.brand.name,item_variant:t.sku,price:t.offers.offers[0].price,index:s*a+r+1,discount:t.offers.offers[0].listPrice-t.offers.offers[0].price,currency:c,item_variant_name:t.name,product_reference_id:t.gtin}})}})})},[c,r,o,s,a])}}},6410:function(e,r,t){t.d(r,{YD:function(){return useInView},df:function(){return d}});var n=t(4194);function _extends(){return(_extends=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e}).apply(this,arguments)}function _setPrototypeOf(e,r){return(_setPrototypeOf=Object.setPrototypeOf||function(e,r){return e.__proto__=r,e})(e,r)}var i=new Map,o=new WeakMap,s=0,a=void 0;function observe(e,r,t,n){if(void 0===t&&(t={}),void 0===n&&(n=a),void 0===window.IntersectionObserver&&void 0!==n){var c=e.getBoundingClientRect();return r(n,{isIntersecting:n,target:e,intersectionRatio:"number"==typeof t.threshold?t.threshold:0,time:0,boundingClientRect:c,intersectionRect:c,rootBounds:c}),function(){}}var d=function(e){var r=Object.keys(e).sort().filter(function(r){return void 0!==e[r]}).map(function(r){var t;return r+"_"+("root"===r?(t=e.root)?(o.has(t)||(s+=1,o.set(t,s.toString())),o.get(t)):"0":e[r])}).toString(),t=i.get(r);if(!t){var n,a=new Map,c=new IntersectionObserver(function(r){r.forEach(function(r){var t,i=r.isIntersecting&&n.some(function(e){return r.intersectionRatio>=e});e.trackVisibility&&void 0===r.isVisible&&(r.isVisible=i),null==(t=a.get(r.target))||t.forEach(function(e){e(i,r)})})},e);n=c.thresholds||(Array.isArray(e.threshold)?e.threshold:[e.threshold||0]),t={id:r,observer:c,elements:a},i.set(r,t)}return t}(t),u=d.id,l=d.observer,p=d.elements,h=p.get(e)||[];return p.has(e)||p.set(e,h),h.push(r),l.observe(e),function(){h.splice(h.indexOf(r),1),0===h.length&&(p.delete(e),l.unobserve(e)),0===p.size&&(l.disconnect(),i.delete(u))}}var c=["children","as","triggerOnce","threshold","root","rootMargin","onChange","skip","trackVisibility","delay","initialInView","fallbackInView"];function isPlainChildren(e){return"function"!=typeof e.children}var d=function(e){function InView(r){var t;return(t=e.call(this,r)||this).node=null,t._unobserveCb=null,t.handleNode=function(e){!t.node||(t.unobserve(),e||t.props.triggerOnce||t.props.skip||t.setState({inView:!!t.props.initialInView,entry:void 0})),t.node=e||null,t.observeNode()},t.handleChange=function(e,r){e&&t.props.triggerOnce&&t.unobserve(),isPlainChildren(t.props)||t.setState({inView:e,entry:r}),t.props.onChange&&t.props.onChange(e,r)},t.state={inView:!!r.initialInView,entry:void 0},t}InView.prototype=Object.create(e.prototype),InView.prototype.constructor=InView,_setPrototypeOf(InView,e);var r=InView.prototype;return r.componentDidUpdate=function(e){(e.rootMargin!==this.props.rootMargin||e.root!==this.props.root||e.threshold!==this.props.threshold||e.skip!==this.props.skip||e.trackVisibility!==this.props.trackVisibility||e.delay!==this.props.delay)&&(this.unobserve(),this.observeNode())},r.componentWillUnmount=function(){this.unobserve(),this.node=null},r.observeNode=function(){if(this.node&&!this.props.skip){var e=this.props,r=e.threshold,t=e.root,n=e.rootMargin,i=e.trackVisibility,o=e.delay,s=e.fallbackInView;this._unobserveCb=observe(this.node,this.handleChange,{threshold:r,root:t,rootMargin:n,trackVisibility:i,delay:o},s)}},r.unobserve=function(){this._unobserveCb&&(this._unobserveCb(),this._unobserveCb=null)},r.render=function(){if(!isPlainChildren(this.props)){var e=this.state,r=e.inView,t=e.entry;return this.props.children({inView:r,entry:t,ref:this.handleNode})}var i=this.props,o=i.children,s=i.as,a=function(e,r){if(null==e)return{};var t,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||(i[t]=e[t]);return i}(i,c);return n.createElement(s||"div",_extends({ref:this.handleNode},a),o)},InView}(n.Component);function useInView(e){var r=void 0===e?{}:e,t=r.threshold,i=r.delay,o=r.trackVisibility,s=r.rootMargin,a=r.root,c=r.triggerOnce,d=r.skip,u=r.initialInView,l=r.fallbackInView,p=n.useRef(),h=n.useState({inView:!!u}),f=h[0],v=h[1],g=n.useCallback(function(e){void 0!==p.current&&(p.current(),p.current=void 0),!d&&e&&(p.current=observe(e,function(e,r){v({inView:e,entry:r}),r.isIntersecting&&c&&p.current&&(p.current(),p.current=void 0)},{root:a,rootMargin:s,threshold:t,trackVisibility:o,delay:i},l))},[Array.isArray(t)?t.toString():t,a,s,c,d,o,l,i]);(0,n.useEffect)(function(){p.current||!f.entry||c||d||v({inView:!!u})});var b=[g,f.inView,f.entry];return b.ref=b[0],b.inView=b[1],b.entry=b[2],b}d.displayName="InView",d.defaultProps={threshold:0,triggerOnce:!1,initialInView:!1}},9115:function(e,r,t){var n=t(4194);let i=(0,n.forwardRef)(function({testId:e="fs-product-grid",children:r,...t},i){return n.createElement("ul",{ref:i,"data-fs-product-grid":!0,...t},r)});r.Z=i},1347:function(e,r,t){var n=t(4194);let i=(0,n.forwardRef)(function({testId:e="fs-product-grid-item",children:r,...t},i){return n.createElement("li",{ref:i,"data-fs-product-grid-item":!0,...t},r)});r.Z=i}}]);

package/.next/static/chunks/ProductShelf.e80131dfc337fae6.js

@@ -1 +0,0 @@
-(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[3506],{4794:function(e,t,r){"use strict";r.r(t),r.d(t,{OverriddenDefaultProductShelf:function(){return O}});var n=r(4424),o={section:"ProductShelf"},i=r(7264),s=r(6410),c=r(9836),a=r(3406),u=r(2184),l=r.n(u),d=r(7281),p=r.n(d),f=p()(()=>Promise.all([r.e(2206),r.e(7498),r.e(4865),r.e(1173)]).then(r.bind(r,4865)).then(e=>e.ProductShelf),{loadableGenerated:{webpack:()=>[null]}}),h=p()(()=>r.e(7668).then(r.bind(r,7668)),{loadableGenerated:{webpack:()=>[7668]}}),b=p()(()=>r.e(3684).then(r.bind(r,3684)),{loadableGenerated:{webpack:()=>[3684]}}),v=r(1549);function ownKeys(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}var y=(0,i.B)("ProductShelf",function(e){var t=Object.assign({},e),{ref:r,inView:o}=(0,s.YD)();return(0,v.jsx)(c.Z,{className:"".concat(l().section," section-product-shelf layout__section"),ref:r,children:(0,v.jsx)(a.Z,function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?ownKeys(Object(r),!0).forEach(function(t){(0,n.Z)(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ownKeys(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}({inView:o},t))})},{ProductShelf:f,__experimentalCarousel:h,__experimentalProductCard:b});function OverriddenDefaultProductShelf_ownKeys(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function OverriddenDefaultProductShelf_objectSpread(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?OverriddenDefaultProductShelf_ownKeys(Object(r),!0).forEach(function(t){(0,n.Z)(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):OverriddenDefaultProductShelf_ownKeys(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}var O=(0,i.v)(OverriddenDefaultProductShelf_objectSpread(OverriddenDefaultProductShelf_objectSpread(OverriddenDefaultProductShelf_objectSpread({},o),o),{},{Section:y}))},3406:function(e,t,r){"use strict";r.d(t,{Z:function(){return ProductShelf_ProductShelf}});var n=r(4424),o=r(6349),i=r(7281),s=r.n(i),c=r(4194),a=r(2032),u=r(6220),l=r(3921),d=r(1549),p=["title","inView","productCardConfiguration","numberOfItems","itemsPerPage","taxesConfiguration"];function ownKeys(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function _objectSpread(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?ownKeys(Object(r),!0).forEach(function(t){(0,n.Z)(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ownKeys(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}var f=s()(()=>r.e(4216).then(r.bind(r,4216)),{loadableGenerated:{webpack:()=>[4216]}}),ProductShelf_ProductShelf=function(e){var t,r,n,{title:i,inView:s,productCardConfiguration:{bordered:h,showDiscountBadge:b}={},numberOfItems:v,itemsPerPage:y=5,taxesConfiguration:O={}}=e,g=(0,o.Z)(e,p),{ProductShelf:w,__experimentalCarousel:P,__experimentalProductCard:_}=(0,u.r3)(),j=null!==(t=i.replace(/[^\w\s]/gi,"-").replace(/\s+/g,"-").toLowerCase())&&void 0!==t?t:"",m=(0,c.useId)(),V=(0,c.useRef)(!1),S=(0,l.k)(_objectSpread({first:v},g)),k=null==S?void 0:null===(r=S.search)||void 0===r?void 0:r.products,C=null!==(n=null==k?void 0:k.edges)&&void 0!==n?n:[],{sendViewItemListEvent:D}=(0,a.m)({products:C,title:i,page:0,pageSize:0});return((0,c.useEffect)(()=>{s&&!V.current&&C.length&&(D(),V.current=!0)},[s,C.length,D]),(null==k?void 0:k.edges.length)===0)?null:(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)("h2",{className:"text__title-section layout__content",children:i}),(0,d.jsx)(f,{aspectRatio:1,loading:void 0===k,itemsPerPage:y,children:(0,d.jsx)(w.Component,_objectSpread(_objectSpread({},w.props),{},{children:(0,d.jsx)(P.Component,_objectSpread(_objectSpread({id:j||m,itemsPerPage:y},P.props),{},{children:C.map((e,t)=>(0,c.createElement)(_.Component,_objectSpread(_objectSpread({aspectRatio:1,imgProps:{width:216,height:216,sizes:"(max-width: 768px) 42vw, 30vw"}},_.props),{},{bordered:null!=h?h:_.props.bordered,showDiscountBadge:null!=b?b:_.props.showDiscountBadge,taxesConfiguration:O,key:"".concat(e.node.id),product:e.node,index:t+1})))}))}))})]})}},2218:function(e,t,r){"use strict";r.d(t,{K:function(){return o},g:function(){return n}});var n=12,o=5},2032:function(e,t,r){"use strict";r.d(t,{m:function(){return useViewItemListEvent}});var n=r(4194),o=r(4355),useViewItemListEvent=e=>{var{products:t,title:i,page:s,pageSize:c}=e,{currency:{code:a}}=(0,o.kP)();return{sendViewItemListEvent:(0,n.useCallback)(()=>{r.e(7195).then(r.bind(r,1153)).then(e=>{var{sendAnalyticsEvent:r}=e;r({name:"view_item_list",params:{item_list_name:i,item_list_id:i,items:t.map((e,t)=>{var{node:r}=e;return{item_id:r.isVariantOf.productGroupID,item_name:r.isVariantOf.name,item_brand:r.brand.name,item_variant:r.sku,price:r.offers.offers[0].price,index:s*c+t+1,discount:r.offers.offers[0].listPrice-r.offers.offers[0].price,currency:a,item_variant_name:r.name,product_reference_id:r.gtin}})}})})},[a,t,i,s,c])}}},6616:function(e,t,r){"use strict";r.d(t,{y:function(){return useLocalizedVariables}});var n=r(4194),o=r(2218),i=r(4355),toArray=e=>Array.isArray(e)?e:e?[e]:[],useLocalizedVariables=e=>{var{first:t,after:r,sort:s,term:c,selectedFacets:a,sponsoredCount:u}=e,{channel:l,locale:d}=(0,i.kP)();return(0,n.useMemo)(()=>{var e=toArray(a);return{first:null!=t?t:o.K,after:null!=r?r:"0",sort:null!=s?s:"score_desc",term:null!=c?c:"",selectedFacets:[...e,{key:"channel",value:null!=l?l:""},{key:"locale",value:d}],sponsoredCount:null!=u?u:3}},[a,t,r,s,c,l,d,u])}},3921:function(e,t,r){"use strict";r.d(t,{k:function(){return useProductsQuery}});var n=r(4424),o=r(1921),i=r(8385),s=r(6616);function ownKeys(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}var c=o.gU,useProductsQuery=(e,t)=>{var r=(0,s.y)(e),{data:o}=(0,i.aM)(c,r,function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?ownKeys(Object(r),!0).forEach(function(t){(0,n.Z)(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ownKeys(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}({fallbackData:null,suspense:!0},t));return o}},2184:function(e){e.exports={section:"section_section__TjtMz",loading:"section_loading__ffSvt"}},6410:function(e,t,r){"use strict";r.d(t,{YD:function(){return useInView},df:function(){return u}});var n=r(4194);function _extends(){return(_extends=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function _setPrototypeOf(e,t){return(_setPrototypeOf=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}var o=new Map,i=new WeakMap,s=0,c=void 0;function observe(e,t,r,n){if(void 0===r&&(r={}),void 0===n&&(n=c),void 0===window.IntersectionObserver&&void 0!==n){var a=e.getBoundingClientRect();return t(n,{isIntersecting:n,target:e,intersectionRatio:"number"==typeof r.threshold?r.threshold:0,time:0,boundingClientRect:a,intersectionRect:a,rootBounds:a}),function(){}}var u=function(e){var t=Object.keys(e).sort().filter(function(t){return void 0!==e[t]}).map(function(t){var r;return t+"_"+("root"===t?(r=e.root)?(i.has(r)||(s+=1,i.set(r,s.toString())),i.get(r)):"0":e[t])}).toString(),r=o.get(t);if(!r){var n,c=new Map,a=new IntersectionObserver(function(t){t.forEach(function(t){var r,o=t.isIntersecting&&n.some(function(e){return t.intersectionRatio>=e});e.trackVisibility&&void 0===t.isVisible&&(t.isVisible=o),null==(r=c.get(t.target))||r.forEach(function(e){e(o,t)})})},e);n=a.thresholds||(Array.isArray(e.threshold)?e.threshold:[e.threshold||0]),r={id:t,observer:a,elements:c},o.set(t,r)}return r}(r),l=u.id,d=u.observer,p=u.elements,f=p.get(e)||[];return p.has(e)||p.set(e,f),f.push(t),d.observe(e),function(){f.splice(f.indexOf(t),1),0===f.length&&(p.delete(e),d.unobserve(e)),0===p.size&&(d.disconnect(),o.delete(l))}}var a=["children","as","triggerOnce","threshold","root","rootMargin","onChange","skip","trackVisibility","delay","initialInView","fallbackInView"];function isPlainChildren(e){return"function"!=typeof e.children}var u=function(e){function InView(t){var r;return(r=e.call(this,t)||this).node=null,r._unobserveCb=null,r.handleNode=function(e){!r.node||(r.unobserve(),e||r.props.triggerOnce||r.props.skip||r.setState({inView:!!r.props.initialInView,entry:void 0})),r.node=e||null,r.observeNode()},r.handleChange=function(e,t){e&&r.props.triggerOnce&&r.unobserve(),isPlainChildren(r.props)||r.setState({inView:e,entry:t}),r.props.onChange&&r.props.onChange(e,t)},r.state={inView:!!t.initialInView,entry:void 0},r}InView.prototype=Object.create(e.prototype),InView.prototype.constructor=InView,_setPrototypeOf(InView,e);var t=InView.prototype;return t.componentDidUpdate=function(e){(e.rootMargin!==this.props.rootMargin||e.root!==this.props.root||e.threshold!==this.props.threshold||e.skip!==this.props.skip||e.trackVisibility!==this.props.trackVisibility||e.delay!==this.props.delay)&&(this.unobserve(),this.observeNode())},t.componentWillUnmount=function(){this.unobserve(),this.node=null},t.observeNode=function(){if(this.node&&!this.props.skip){var e=this.props,t=e.threshold,r=e.root,n=e.rootMargin,o=e.trackVisibility,i=e.delay,s=e.fallbackInView;this._unobserveCb=observe(this.node,this.handleChange,{threshold:t,root:r,rootMargin:n,trackVisibility:o,delay:i},s)}},t.unobserve=function(){this._unobserveCb&&(this._unobserveCb(),this._unobserveCb=null)},t.render=function(){if(!isPlainChildren(this.props)){var e=this.state,t=e.inView,r=e.entry;return this.props.children({inView:t,entry:r,ref:this.handleNode})}var o=this.props,i=o.children,s=o.as,c=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(o,a);return n.createElement(s||"div",_extends({ref:this.handleNode},c),i)},InView}(n.Component);function useInView(e){var t=void 0===e?{}:e,r=t.threshold,o=t.delay,i=t.trackVisibility,s=t.rootMargin,c=t.root,a=t.triggerOnce,u=t.skip,l=t.initialInView,d=t.fallbackInView,p=n.useRef(),f=n.useState({inView:!!l}),h=f[0],b=f[1],v=n.useCallback(function(e){void 0!==p.current&&(p.current(),p.current=void 0),!u&&e&&(p.current=observe(e,function(e,t){b({inView:e,entry:t}),t.isIntersecting&&a&&p.current&&(p.current(),p.current=void 0)},{root:c,rootMargin:s,threshold:r,trackVisibility:i,delay:o},d))},[Array.isArray(r)?r.toString():r,c,s,a,u,i,d,o]);(0,n.useEffect)(function(){p.current||!h.entry||a||u||b({inView:!!l})});var y=[v,h.inView,h.entry];return y.ref=y[0],y.inView=y[1],y.entry=y[2],y}u.displayName="InView",u.defaultProps={threshold:0,triggerOnce:!1,initialInView:!1}}}]);

package/.next/static/chunks/ProductTiles.413c061cf10578b4.js

@@ -1 +0,0 @@
-(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[7181],{5071:function(e,t,r){"use strict";var n=r(4424),i=r(6349),a=r(8394),o=r(5167),s=r(547),c=r(4194),l=r(5236),d=r.n(l),u=r(6659),f=r(6087),p=r(5436),h=r(1549),v=["product","index","bordered","variant","aspectRatio","imgProps","ratingValue","buttonLabel","onButtonClick","showDiscountBadge","taxesConfiguration","sponsoredLabel"];function ownKeys(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function _objectSpread(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?ownKeys(Object(r),!0).forEach(function(t){(0,n.Z)(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ownKeys(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}t.Z=(0,c.memo)(function(e){var t,r,{product:n,index:l,bordered:m=!0,variant:g="default",aspectRatio:b=1,imgProps:y,ratingValue:w,buttonLabel:_="Add",onButtonClick:k,showDiscountBadge:O=!0,taxesConfiguration:P,sponsoredLabel:j}=e,x=(0,i.Z)(e,v),{sku:E,isVariantOf:{name:V},image:[Z],advertisement:S,offers:{lowPrice:I,lowPriceWithTaxes:C,offers:[{listPrice:R,availability:D,listPriceWithTaxes:T}]}}=n,M=_objectSpread(_objectSpread({},(0,p.w)({product:n,selectedOffer:0,index:l})),{},{as:d(),passHref:!0,legacyBehavior:!1,prefetch:!1}),z=(0,c.useMemo)(()=>"https://schema.org/InStock"!==D,[D]),N=null!=P&&P.usePriceWithTaxes?C:I,L=null!=P&&P.usePriceWithTaxes?T:R,A=S?{"data-van-res-id":S.adResponseId,"data-van-aid":S.adId,"data-van-prod-name":V}:{};return(0,h.jsxs)(a.Z,_objectSpread(_objectSpread(_objectSpread({outOfStock:z,bordered:m,variant:g,"data-fs-product-card-sku":E},A),x),{},{children:[(0,h.jsx)(o.Z,{aspectRatio:b,children:(0,h.jsx)(u.Z,{src:Z.url,alt:Z.alternateName,sizes:"".concat(null!==(t=null==y?void 0:y.sizes)&&void 0!==t?t:"(max-width: 768px) 40vw, 30vw"),width:null!==(r=null==y?void 0:y.width)&&void 0!==r?r:360,height:Math.round((Number(null==y?void 0:y.height)||360)/b),loading:null==y?void 0:y.loading})}),(0,h.jsx)(s.Z,{title:V,price:{value:N,listPrice:L,formatter:f.P},ratingValue:w,outOfStock:z,onButtonClick:k,linkProps:M,showDiscountBadge:N<=L&&O,includeTaxes:null==P?void 0:P.usePriceWithTaxes,includeTaxesLabel:null==P?void 0:P.taxesLabel,sponsored:!!S,sponsoredLabel:j})]}))})},4838:function(e,t,r){"use strict";r.d(t,{Z:function(){return ProductTiles_ProductTiles}});var n=r(6349),i=r(4194),a=r(6410),o=r(5071),s=r(4424),c=r(3877),l=r(1549),d=["children"];function ownKeys(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function _objectSpread(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?ownKeys(Object(r),!0).forEach(function(t){(0,s.Z)(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ownKeys(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}var ui_Tiles_Tiles=e=>{var{children:t}=e,r=(0,n.Z)(e,d);return(0,l.jsx)(c.Z,_objectSpread(_objectSpread({},r),{},{children:t}))},u=r(7901),f=r(792),ProductTileSkeleton_ProductTileSkeleton=function(e){var{index:t,aspectRatio:r=1}=e;return(0,l.jsxs)("div",{"data-fs-product-tile-skeleton":!0,"data-fs-product-tile-skeleton-index":t,children:[(0,l.jsx)("div",{"data-fs-product-tile-skeleton-image":!0,"data-fs-product-tile-skeleton-index":t,style:{"--fs-product-tile-skeleton-image-aspect-ratio":r},children:(0,l.jsx)(f.Z,{size:{width:"auto",height:"100%"},loading:!0})}),(0,l.jsxs)("div",{"data-fs-product-tile-skeleton-content":!0,"data-fs-product-tile-skeleton-index":t,children:[(0,l.jsxs)("div",{"data-fs-product-tile-skeleton-heading":!0,children:[(0,l.jsx)("div",{"data-fs-product-tile-skeleton-text":!0,"data-fs-product-tile-skeleton-index":t,children:(0,l.jsx)(f.Z,{size:{width:"70%",height:"1.5rem"}})}),(0,l.jsx)("div",{"data-fs-product-tile-skeleton-price":!0,children:(0,l.jsx)(f.Z,{size:{width:"60%",height:"1.5rem"}})})]}),(0,l.jsx)("div",{"data-fs-product-tile-skeleton-badge":!0,"data-fs-product-tile-skeleton-index":t,children:(0,l.jsx)(f.Z,{size:{width:"6rem",height:"2rem"},border:"pill"})})]})]})},getRatio=(e,t)=>3===e&&0===t||2===e&&(0===t||1===t)?5/3:3/4,ProductTilesSkeleton_ProductTilesSkeleton=function(e){var{children:t,loading:r=!0}=e;return r?(0,l.jsx)(ui_Tiles_Tiles,{children:Array.from({length:3},(e,t)=>(0,l.jsx)(u.Z,{children:(0,l.jsx)(ProductTileSkeleton_ProductTileSkeleton,{index:t+1,aspectRatio:getRatio(3,t)})},String(t)))}):(0,l.jsx)(l.Fragment,{children:t})},p=r(2032),h=r(3921),v=r(9836),m=r(245),g=r.n(m),b=["title","taxesConfiguration"],ProductTiles_getRatio=(e,t)=>3===e&&0===t||2===e&&(0===t||1===t)?5/3:3/4,getSizes=(e,t)=>3===e&&0===t||2===e&&(0===t||1===t)?{width:594,height:364}:{width:284,height:364},ProductTiles_ProductTiles=e=>{var t,r,{title:s,taxesConfiguration:c}=e,d=(0,n.Z)(e,b),f=(0,i.useRef)(!1),{ref:m,inView:y}=(0,a.YD)(),w=(0,h.k)(d),_=null==w?void 0:null===(t=w.search)||void 0===t?void 0:t.products,k=null!==(r=null==_?void 0:_.edges)&&void 0!==r?r:[],{sendViewItemListEvent:O}=(0,p.m)({products:k,title:s,page:0,pageSize:0});return((0,i.useEffect)(()=>{y&&!f.current&&k.length&&(O(),f.current=!0)},[y,k.length,O]),(null==_?void 0:_.edges.length)===0)?null:(0,l.jsxs)(v.Z,{className:"".concat(g().section," section-product-tiles layout__section"),ref:m,children:[(0,l.jsx)("h2",{className:"text__title-section layout__content",children:s}),(0,l.jsx)(ProductTilesSkeleton_ProductTilesSkeleton,{loading:!_,children:(0,l.jsx)(ui_Tiles_Tiles,{children:k.map((e,t)=>(0,l.jsx)(u.Z,{children:(0,l.jsx)(o.Z,{"data-testid":"tile-card",product:e.node,index:t+1,variant:"wide",aspectRatio:ProductTiles_getRatio(k.length,t),imgProps:getSizes(k.length,t),taxesConfiguration:c})},e.node.id))})})]})}},1839:function(e,t,r){"use strict";r.r(t),r.d(t,{default:function(){return n.Z}});var n=r(4838)},2218:function(e,t,r){"use strict";r.d(t,{K:function(){return i},g:function(){return n}});var n=12,i=5},2032:function(e,t,r){"use strict";r.d(t,{m:function(){return useViewItemListEvent}});var n=r(4194),i=r(4355),useViewItemListEvent=e=>{var{products:t,title:a,page:o,pageSize:s}=e,{currency:{code:c}}=(0,i.kP)();return{sendViewItemListEvent:(0,n.useCallback)(()=>{r.e(7195).then(r.bind(r,1153)).then(e=>{var{sendAnalyticsEvent:r}=e;r({name:"view_item_list",params:{item_list_name:a,item_list_id:a,items:t.map((e,t)=>{var{node:r}=e;return{item_id:r.isVariantOf.productGroupID,item_name:r.isVariantOf.name,item_brand:r.brand.name,item_variant:r.sku,price:r.offers.offers[0].price,index:o*s+t+1,discount:r.offers.offers[0].listPrice-r.offers.offers[0].price,currency:c,item_variant_name:r.name,product_reference_id:r.gtin}})}})})},[c,t,a,o,s])}}},6087:function(e,t,r){"use strict";r.d(t,{P:function(){return useFormattedPrice}});var n=r(4194),i=r(4355),usePriceFormatter=function(){var{decimals:e}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},{currency:t,locale:r}=(0,i.kP)();return(0,n.useCallback)(n=>Intl.NumberFormat(r,{style:"currency",currency:t.code,minimumFractionDigits:e?2:0}).format(n),[t.code,r,e])},useFormattedPrice=e=>{var t=usePriceFormatter();return(0,n.useMemo)(()=>t(e),[t,e])}},6616:function(e,t,r){"use strict";r.d(t,{y:function(){return useLocalizedVariables}});var n=r(4194),i=r(2218),a=r(4355),toArray=e=>Array.isArray(e)?e:e?[e]:[],useLocalizedVariables=e=>{var{first:t,after:r,sort:o,term:s,selectedFacets:c,sponsoredCount:l}=e,{channel:d,locale:u}=(0,a.kP)();return(0,n.useMemo)(()=>{var e=toArray(c);return{first:null!=t?t:i.K,after:null!=r?r:"0",sort:null!=o?o:"score_desc",term:null!=s?s:"",selectedFacets:[...e,{key:"channel",value:null!=d?d:""},{key:"locale",value:u}],sponsoredCount:null!=l?l:3}},[c,t,r,o,s,d,u,l])}},5436:function(e,t,r){"use strict";r.d(t,{w:function(){return useProductLink}});var n=r(4194),i=r(4355),useProductLink=e=>{var{index:t,product:a,selectedOffer:o}=e,{slug:s}=a,{currency:{code:c}}=(0,i.kP)(),l=(0,n.useCallback)(()=>{r.e(7195).then(r.bind(r,1153)).then(e=>{var{sendAnalyticsEvent:r}=e;r({name:"select_item",params:{items:[{item_id:a.isVariantOf.productGroupID,item_name:a.isVariantOf.name,item_brand:a.brand.name,item_variant:a.sku,index:t,price:a.offers.offers[o].price,discount:a.offers.offers[o].listPrice-a.offers.offers[o].price,currency:c,item_variant_name:a.name,product_reference_id:a.gtin}]}}),r({name:"search_select_item",params:{url:window.location.href,items:[{item_id:a.isVariantOf.productGroupID,item_variant:a.sku,index:t}]}})})},[c,a,t,o]);return{href:"/".concat(s,"/p"),onClick:l,"data-testid":"product-link"}}},3921:function(e,t,r){"use strict";r.d(t,{k:function(){return useProductsQuery}});var n=r(4424),i=r(1921),a=r(8385),o=r(6616);function ownKeys(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}var s=i.gU,useProductsQuery=(e,t)=>{var r=(0,o.y)(e),{data:i}=(0,a.aM)(s,r,function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?ownKeys(Object(r),!0).forEach(function(t){(0,n.Z)(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ownKeys(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}({fallbackData:null,suspense:!0},t));return i}},245:function(e){e.exports={section:"section_section__Wwc_y",loading:"section_loading__7M1Dl"}},6410:function(e,t,r){"use strict";r.d(t,{YD:function(){return useInView},df:function(){return l}});var n=r(4194);function _extends(){return(_extends=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function _setPrototypeOf(e,t){return(_setPrototypeOf=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}var i=new Map,a=new WeakMap,o=0,s=void 0;function observe(e,t,r,n){if(void 0===r&&(r={}),void 0===n&&(n=s),void 0===window.IntersectionObserver&&void 0!==n){var c=e.getBoundingClientRect();return t(n,{isIntersecting:n,target:e,intersectionRatio:"number"==typeof r.threshold?r.threshold:0,time:0,boundingClientRect:c,intersectionRect:c,rootBounds:c}),function(){}}var l=function(e){var t=Object.keys(e).sort().filter(function(t){return void 0!==e[t]}).map(function(t){var r;return t+"_"+("root"===t?(r=e.root)?(a.has(r)||(o+=1,a.set(r,o.toString())),a.get(r)):"0":e[t])}).toString(),r=i.get(t);if(!r){var n,s=new Map,c=new IntersectionObserver(function(t){t.forEach(function(t){var r,i=t.isIntersecting&&n.some(function(e){return t.intersectionRatio>=e});e.trackVisibility&&void 0===t.isVisible&&(t.isVisible=i),null==(r=s.get(t.target))||r.forEach(function(e){e(i,t)})})},e);n=c.thresholds||(Array.isArray(e.threshold)?e.threshold:[e.threshold||0]),r={id:t,observer:c,elements:s},i.set(t,r)}return r}(r),d=l.id,u=l.observer,f=l.elements,p=f.get(e)||[];return f.has(e)||f.set(e,p),p.push(t),u.observe(e),function(){p.splice(p.indexOf(t),1),0===p.length&&(f.delete(e),u.unobserve(e)),0===f.size&&(u.disconnect(),i.delete(d))}}var c=["children","as","triggerOnce","threshold","root","rootMargin","onChange","skip","trackVisibility","delay","initialInView","fallbackInView"];function isPlainChildren(e){return"function"!=typeof e.children}var l=function(e){function InView(t){var r;return(r=e.call(this,t)||this).node=null,r._unobserveCb=null,r.handleNode=function(e){!r.node||(r.unobserve(),e||r.props.triggerOnce||r.props.skip||r.setState({inView:!!r.props.initialInView,entry:void 0})),r.node=e||null,r.observeNode()},r.handleChange=function(e,t){e&&r.props.triggerOnce&&r.unobserve(),isPlainChildren(r.props)||r.setState({inView:e,entry:t}),r.props.onChange&&r.props.onChange(e,t)},r.state={inView:!!t.initialInView,entry:void 0},r}InView.prototype=Object.create(e.prototype),InView.prototype.constructor=InView,_setPrototypeOf(InView,e);var t=InView.prototype;return t.componentDidUpdate=function(e){(e.rootMargin!==this.props.rootMargin||e.root!==this.props.root||e.threshold!==this.props.threshold||e.skip!==this.props.skip||e.trackVisibility!==this.props.trackVisibility||e.delay!==this.props.delay)&&(this.unobserve(),this.observeNode())},t.componentWillUnmount=function(){this.unobserve(),this.node=null},t.observeNode=function(){if(this.node&&!this.props.skip){var e=this.props,t=e.threshold,r=e.root,n=e.rootMargin,i=e.trackVisibility,a=e.delay,o=e.fallbackInView;this._unobserveCb=observe(this.node,this.handleChange,{threshold:t,root:r,rootMargin:n,trackVisibility:i,delay:a},o)}},t.unobserve=function(){this._unobserveCb&&(this._unobserveCb(),this._unobserveCb=null)},t.render=function(){if(!isPlainChildren(this.props)){var e=this.state,t=e.inView,r=e.entry;return this.props.children({inView:t,entry:r,ref:this.handleNode})}var i=this.props,a=i.children,o=i.as,s=function(e,t){if(null==e)return{};var r,n,i={},a=Object.keys(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}(i,c);return n.createElement(o||"div",_extends({ref:this.handleNode},s),a)},InView}(n.Component);function useInView(e){var t=void 0===e?{}:e,r=t.threshold,i=t.delay,a=t.trackVisibility,o=t.rootMargin,s=t.root,c=t.triggerOnce,l=t.skip,d=t.initialInView,u=t.fallbackInView,f=n.useRef(),p=n.useState({inView:!!d}),h=p[0],v=p[1],m=n.useCallback(function(e){void 0!==f.current&&(f.current(),f.current=void 0),!l&&e&&(f.current=observe(e,function(e,t){v({inView:e,entry:t}),t.isIntersecting&&c&&f.current&&(f.current(),f.current=void 0)},{root:s,rootMargin:o,threshold:r,trackVisibility:a,delay:i},u))},[Array.isArray(r)?r.toString():r,s,o,c,l,a,u,i]);(0,n.useEffect)(function(){f.current||!h.entry||c||l||v({inView:!!d})});var g=[m,h.inView,h.entry];return g.ref=g[0],g.inView=g[1],g.entry=g[2],g}l.displayName="InView",l.defaultProps={threshold:0,triggerOnce:!1,initialInView:!1}},1953:function(e,t,r){"use strict";var n=r(4194);let i=(0,n.forwardRef)(function({testId:e="fs-label",children:t,...r},i){return n.createElement("label",{ref:i,"data-fs-label":!0,"data-testid":e,...r},t)});t.Z=i},9767:function(e,t,r){"use strict";var n=r(4194),i=r(5450);let a=(0,n.forwardRef)(function({value:e,as:t="span",variant:r="selling",testId:a="fs-price",formatter:o=e=>e,SRText:s,...c},l){let d=o(e,r);return n.createElement(t,{ref:l,"data-fs-price":!0,"data-fs-price-variant":r,"data-testid":a,...c},s&&n.createElement(i.Z,{text:s}),d)});t.Z=a},5450:function(e,t,r){"use strict";var n=r(4194);t.Z=function({text:e,as:t}){let r=t??"span";return n.createElement(r,{"data-fs-sr-only":!0},e)}},792:function(e,t,r){"use strict";var n=r(4194);let i=(0,n.forwardRef)(function({testId:e="fs-skeleton",loading:t=!0,shimmer:r=!0,children:i,size:a,border:o,borderRadius:s,...c},l){let d={width:a.width,height:a.height};return t?n.createElement("div",{ref:l,"data-fs-skeleton":!0,"data-testid":e,"data-fs-skeleton-border":o||null,style:s?{...d,borderRadius:s}:d,...c},r&&n.createElement("div",{"data-fs-skeleton-shimmer":!0})):n.createElement(n.Fragment,null,i)});t.Z=i},2946:function(e,t,r){"use strict";r.d(t,{Z:function(){return DiscountBadge_DiscountBadge}});var n=r(4194),i=r(276);let useDiscountPercent=(e,t)=>(0,n.useMemo)(()=>{let r=e-t,n=100*r/e;return Math.round(n)},[t,e]);var DiscountBadge_DiscountBadge=({listPrice:e,spotPrice:t,thresholdLow:r=15,thresholdHigh:a=40,size:o,testId:s="fs-discount-badge"})=>{let c=useDiscountPercent(e,t);if(0===c)return n.createElement(n.Fragment,null);let l=c<=r?"low":c<=a?"medium":"high";return n.createElement(i.Z,{"data-fs-discount-badge":!0,"data-fs-discount-badge-variant":l,size:o,"data-testid":s},c,"% off")}},8394:function(e,t,r){"use strict";var n=r(4194);let i=(0,n.forwardRef)(function({testId:e="fs-product-card",variant:t="default",bordered:r=!1,outOfStock:i,children:a,...o},s){return n.createElement("article",{ref:s,"data-fs-product-card":i?"out-of-stock":"","data-fs-product-card-variant":t,"data-fs-product-card-bordered":r,"data-testid":e,...o},a)});t.Z=i},547:function(e,t,r){"use strict";var n=r(4194),i=r(727),a=r(9088),o=r(1953),s=r(3024),c=r(2614),l=r(2946),d=r(276),u=r(3339);let f=(0,n.forwardRef)(function({testId:e="fs-product-card-content",title:t,linkProps:r,price:f,outOfStock:p,outOfStockLabel:h="Out of stock",ratingValue:v,showDiscountBadge:m,buttonLabel:g="Add",onButtonClick:b,children:y,includeTaxes:w=!1,includeTaxesLabel:_="Tax included",sponsored:k=!1,sponsoredLabel:O="Sponsored",...P},j){let x=f?.listPrice?f.listPrice:0,E=f?.value?f.value:0;return n.createElement("section",{ref:j,"data-fs-product-card-content":!0,"data-fs-product-card-badge":m,"data-testid":e,...P},k&&n.createElement("span",{"data-fs-product-card-sponsored-label":!0},O),n.createElement("div",{"data-fs-product-card-heading":!0},n.createElement("h3",{"data-fs-product-card-title":!0},n.createElement(i.Z,{...r,title:t},n.createElement("span",null,t))),!p&&n.createElement(a.Z,{"data-fs-product-card-prices":!0,value:E,listPrice:x,formatter:f?.formatter}),w&&n.createElement(o.Z,{"data-fs-product-card-taxes-label":!0},_),v&&n.createElement(s.Z,{value:v,icon:n.createElement(c.Z,{name:"Star"})})),m&&!p&&n.createElement(l.Z,{listPrice:x,spotPrice:E}),p&&n.createElement(d.Z,null,h),b&&!p&&n.createElement("div",{"data-fs-product-card-actions":!0},n.createElement(u.Z,{variant:"primary",icon:n.createElement(c.Z,{name:"ShoppingCart"}),iconPosition:"left",size:"small",onClick:b},g)))});t.Z=f},5167:function(e,t,r){"use strict";var n=r(4194);let i=(0,n.forwardRef)(function({testId:e="fs-product-card-image",aspectRatio:t=1,children:r,...i},a){return n.createElement("div",{ref:a,"data-fs-product-card-image":!0,"data-testid":e,style:{"--fs-product-card-image-aspect-ratio":t},...i},r)});t.Z=i},9088:function(e,t,r){"use strict";var n=r(4194),i=r(9767);let a=(0,n.forwardRef)(function({testId:e="fs-product-price",value:t,listPrice:r,formatter:a,...o},s){let c=r??0,l=t??0;return n.createElement("div",{ref:s,"data-fs-product-price":!0,"data-testid":e,...o},l!==c&&0!==c?n.createElement(n.Fragment,null,n.createElement(i.Z,{value:c,formatter:a,testId:"list-price","data-value":c,variant:"listing",SRText:"Original price:"}),n.createElement(i.Z,{value:l,formatter:a,testId:"price","data-value":l,variant:"spot",SRText:"Price:"})):n.createElement(i.Z,{value:l,formatter:a,testId:"price","data-value":l,variant:"spot",SRText:"Price:"}))});t.Z=a},3024:function(e,t,r){"use strict";var n=r(4194),i=r(2614),a=r(7041),o=r(4564);let s=(0,n.forwardRef)(function({children:e,testId:t="fs-rating",length:r=5,value:s=0,icon:c,onChange:l,disabled:d,...u},f){let[p,h]=(0,n.useState)(0),v={"data-fs-rating-icon-outline":!0},m=n.isValidElement(c)?c:n.createElement(i.Z,{name:"Star"});return n.createElement(o.Z,{ref:f,"data-fs-rating":!0,"data-fs-rating-actionable":"function"==typeof l,"data-testid":t,...u},Array.from({length:r}).map((e,r)=>{let o=r+1;return n.createElement("li",{key:`rating-${r}`,"data-fs-rating-item":o<=(p||s)?"full":o-s>0&&o-s<1?"partial":"empty","data-testid":`${t}-item`},l?n.createElement(a.Z,{"data-fs-rating-button":!0,icon:m,size:"small","aria-label":"rate",onClick:()=>{l(o)},onMouseEnter:()=>h(o),onMouseLeave:()=>h(s),disabled:d}):n.createElement(n.Fragment,null,n.createElement("div",{"data-fs-rating-icon-wrapper":!0},m),n.isValidElement(c)?n.cloneElement(c,v):n.createElement(i.Z,{name:"Star","data-fs-rating-icon-outline":!0})))}))});t.Z=s},7901:function(e,t,r){"use strict";var n=r(4194);let i=(0,n.forwardRef)(function({testId:e="store-tile",children:t,...r},i){return n.createElement("li",{ref:i,role:"listitem","data-fs-tile":!0,"data-testid":e,...r},t)});t.Z=i},3877:function(e,t,r){"use strict";var n=r(4194);let i=(0,n.forwardRef)(function({testId:e="store-tiles",children:t,...r},i){let a=n.Children.count(t);return n.createElement("ul",{ref:i,role:"list","data-fs-tiles":!0,"data-fs-tiles-variant":3===a?"expanded-first":2===a?"expanded-first-two":"","data-fs-content":"tiles","data-testid":e,...r},t)});t.Z=i}}]);