@anker-in/headless-ui 1.1.13 → 1.1.14

package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/biz-components/Listing/components/ProductCard/ProductGallery/types.ts"],
-  "sourcesContent": ["import type { Img, Video } from '../../../../../types/props.js'\nimport type { ImageMedia, VideoMedia } from '../../../hooks/use-variant-media.js'\n\nexport enum GalleryTabType {\n  GALLERY_IMAGE_MAIN = 'ipc-gallery-tab-image-main',\n  GALLERY_IMAGE_FEATURES = 'ipc-gallery-tab-image-features',\n  GALLERY_IMAGE_SCENE = 'ipc-gallery-tab-image-scene',\n  GALLERY_VIDEO = 'ipc-gallery-tab-video',\n  GALLERY_3D_VIEW = 'ipc-gallery-tab-3d-view',\n}\n\n// \u8F93\u5165\u6570\u636E\u7684\u7C7B\u578B\u5B9A\u4E49\uFF08\u4ECE product.payload.components \u4E2D\u83B7\u53D6\u7684\u539F\u59CB\u6570\u636E\u683C\u5F0F\uFF09\nexport interface ProductGalleryTabData {\n  tabLabel: string\n  tabValue: string\n  galleries: 'productList' | 'keyFeaturesList' | 'sceneList' | 'videoList'\n  galleryTabType: GalleryTabType | string\n  images?: Array<{\n    image_390?: string\n    image_768?: string\n    image_1024?: string\n    image_1440?: string\n    image_1920?: string\n  }>\n  comment?: {\n    avatar: {\n      url: string\n    }\n    content: string\n  }\n  id?: string\n}\n\nexport type ProductGalleryProps = ProductGalleryTabData[]\n\nexport interface ProductGalleryTabItemProps {\n  index?: number\n  realIndex?: number\n  galleryTabType: GalleryTabType\n  galleries: ImageMedia[] | VideoMedia[]\n  onCurrentTabLoopStart?: (index: number) => void\n  onCurrentTabLoopEnd?: (index: number) => void\n  onNextTab?: () => void\n  onPrevTab?: () => void\n  targetSlideIndex?: number | null\n  onSlideChange?: () => void\n  onImageExposure?: (data: { imageUrl: string; imageAlt?: string; index: number; tabId: string }) => void\n  id: string\n  comment?: {\n    content: string\n    avatar: Img\n  }\n  tabLabel: string\n  tabValue: string\n  // galleryImgs?: Img[]\n  // galleryVideo?: Video\n  // gallery3DView?: Video\n}\n\nexport interface GalleryTabItemProps {\n  tabLabel: string\n  tabValue: string\n  id: string\n  galleryTabType: GalleryTabType\n  galleries: ImageMedia[] | VideoMedia[]\n  images?: {\n    image_390?: string\n    image_768?: string\n    image_1024?: string\n    image_1440?: string\n    image_1920?: string\n  }\n  comment?: {\n    avatar: Img\n    content: string\n  }\n}\n"],
+  "sourcesContent": ["import type { Img } from '../../../../../types/props.js'\nimport type { ImageMedia, VideoMedia } from '../../../hooks/use-variant-media.js'\n\nexport enum GalleryTabType {\n  GALLERY_IMAGE_MAIN = 'ipc-gallery-tab-image-main',\n  GALLERY_IMAGE_FEATURES = 'ipc-gallery-tab-image-features',\n  GALLERY_IMAGE_SCENE = 'ipc-gallery-tab-image-scene',\n  GALLERY_VIDEO = 'ipc-gallery-tab-video',\n  GALLERY_3D_VIEW = 'ipc-gallery-tab-3d-view',\n}\n\n// \u8F93\u5165\u6570\u636E\u7684\u7C7B\u578B\u5B9A\u4E49\uFF08\u4ECE product.payload.components \u4E2D\u83B7\u53D6\u7684\u539F\u59CB\u6570\u636E\u683C\u5F0F\uFF09\nexport interface ProductGalleryTabData {\n  tabLabel: string\n  tabValue: string\n  galleries: 'productList' | 'keyFeaturesList' | 'sceneList' | 'videoList'\n  galleryTabType: GalleryTabType | string\n  images?: Array<{\n    image_390?: string\n    image_768?: string\n    image_1024?: string\n    image_1440?: string\n    image_1920?: string\n  }>\n  comment?: {\n    avatar: {\n      url: string\n    }\n    content: string\n  }\n  id?: string\n}\n\nexport type ProductGalleryProps = ProductGalleryTabData[]\n\nexport interface ProductGalleryTabItemProps {\n  index?: number\n  realIndex?: number\n  galleryTabType: GalleryTabType\n  galleries: ImageMedia[] | VideoMedia[]\n  onCurrentTabLoopStart?: (_index: number) => void\n  onCurrentTabLoopEnd?: (_index: number) => void\n  onNextTab?: () => void\n  onPrevTab?: () => void\n  targetSlideIndex?: number | null\n  onSlideChange?: () => void\n  onImageExposure?: (_data: { imageUrl: string; imageAlt?: string; index: number; tabId: string }) => void\n  id: string\n  comment?: {\n    content: string\n    avatar: Img\n  }\n  tabLabel: string\n  tabValue: string\n  // galleryImgs?: Img[]\n  // galleryVideo?: Video\n  // gallery3DView?: Video\n}\n\nexport interface GalleryTabItemProps {\n  tabLabel: string\n  tabValue: string\n  id: string\n  galleryTabType: GalleryTabType\n  galleries: ImageMedia[] | VideoMedia[]\n  images?: {\n    image_390?: string\n    image_768?: string\n    image_1024?: string\n    image_1440?: string\n    image_1920?: string\n  }\n  comment?: {\n    avatar: Img\n    content: string\n  }\n}\n"],
   "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,oBAAAE,IAAA,eAAAC,EAAAH,GAGO,IAAKE,OACVA,EAAA,mBAAqB,6BACrBA,EAAA,uBAAyB,iCACzBA,EAAA,oBAAsB,8BACtBA,EAAA,cAAgB,wBAChBA,EAAA,gBAAkB,0BALRA,OAAA",
   "names": ["types_exports", "__export", "GalleryTabType", "__toCommonJS"]
 }

package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/biz-components/Listing/components/ProductCard/ProductSummary/index.tsx"],
-  "sourcesContent": ["import { Text, Button, Container, Grid, GridItem, Picture, Heading } from '../../../../../components/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useEffect, useMemo, useState } from 'react'\nimport { formatPrice } from '../../../utils/index.js'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport type { BundleListItem, ProductVariant, ProductPrice, ProductOption } from '../../../types/product'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat.js'\nimport { withLayout } from '../../../../../shared/Styles.js'\nimport { ExposureDetector } from '../../../../../components/index.js'\nimport { gaTrack } from '../../../../../shared/track.js'\n\nconst ProductSummary = () => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const {\n    product,\n    variant,\n    finalPrice,\n    comparePrice,\n    coupon,\n    selectedOptions,\n    selectedVariants,\n    totalSavings,\n    onAddToCart,\n    onBuyNow,\n    savingDetail,\n    checkedBundle,\n    joinedRecommendBuyProducts,\n    setJoinedRecommendBuyProducts,\n    setSavingDetail,\n    addToCartLoading,\n    buyNowLoading,\n    profile,\n    addOrder,\n    setAddOrder,\n  } = useBizProductContext()\n\n  const productSummaryData = useMemo(() => {\n    return product?.payload?.components?.find((item: any) => item.componentKey === 'ProductSummary')?.data || {}\n  }, [product?.payload])\n\n  const [currentProductVariant] = selectedVariants\n\n  const summaryFinalPrice = useMemo(() => {\n    const currentBundleVariant = checkedBundle?.variants.find(v => v.variant.sku === currentProductVariant?.sku)\n    const currentBundlePrice = new Decimal(currentProductVariant?.price?.amount || 0)\n      .minus(currentBundleVariant?.price || currentProductVariant?.price?.amount)\n      .toNumber()\n    let currentProductPrice = new Decimal(currentProductVariant?.price?.amount || 0)\n    if (profile?.email) {\n      currentProductPrice = currentProductPrice.minus(savingDetail?.member || 0)\n    }\n    const finalPrice = currentProductPrice.minus(savingDetail?.coupon).minus(currentBundlePrice).toNumber()\n    return Math.floor(finalPrice * 100) / 100\n  }, [currentProductVariant, checkedBundle, profile, savingDetail?.member, savingDetail?.coupon])\n\n  const { bundleVariant, giftVariant, exchangeVariant } = useRecommendBuyProducts() || {}\n\n  const [initialRecommendBuyProducts, setInitialRecommendBuyProducts] = useState<{\n    bundle?: BundleListItem\n    gift?: ProductVariant\n    exchange?: ProductVariant\n  }>()\n\n  useEffect(() => {\n    setInitialRecommendBuyProducts({\n      bundle: joinedRecommendBuyProducts.bundle?.value ? undefined : bundleVariant,\n      gift: joinedRecommendBuyProducts.gift?.value ? undefined : giftVariant,\n      exchange: joinedRecommendBuyProducts.exchange?.value ? undefined : exchangeVariant,\n    })\n  }, [bundleVariant, giftVariant, exchangeVariant, joinedRecommendBuyProducts])\n\n  // \u6839\u636E\u6DFB\u52A0\u987A\u5E8F\u751F\u6210\u5DF2\u6DFB\u52A0\u4EA7\u54C1\u7684\u5217\u8868\n  const orderedJoinedProducts = useMemo(() => {\n    const result: Array<{ type: 'bundle' | 'gift' | 'exchange'; key: string }> = []\n\n    // \u6309\u7167\u6DFB\u52A0\u987A\u5E8F\u6DFB\u52A0\n    if (addOrder) {\n      addOrder.forEach((type, index) => {\n        if (joinedRecommendBuyProducts[type]?.value) {\n          result.push({ type, key: `${type}-${index}` })\n        }\n      })\n    }\n\n    return result\n  }, [addOrder, joinedRecommendBuyProducts])\n\n  const productOptionsText = useMemo(() => {\n    const quantity = selectedOptions?.quantity || ''\n    const color = selectedOptions?.color || selectedOptions?.colour || selectedOptions?.couleur || ''\n    return `${quantity && color ? `${quantity} | ${color}` : quantity || color}`\n  }, [selectedOptions?.quantity, selectedOptions?.color, selectedOptions?.colour, selectedOptions?.couleur])\n\n  const variantImage = useMemo(() => {\n    const variantProductSummary =\n      variant?.payload?.components?.find((item: any) => item.componentKey === 'ProductSummary')?.data || {}\n    const { image_1920, image_1440, image_1024, image_768, image_390 } = variantProductSummary?.thumbnail || {}\n    const variantProductGalleryItemImage = variantProductSummary?.thumbnail\n      ? `${image_1920} 1920, ${image_1440} 1440, ${image_1024} 1024, ${image_768} 768, ${image_390} 390`\n      : variant.image?.url\n    return variantProductGalleryItemImage || variant.image?.url\n  }, [variant.image?.url, variant?.payload?.components])\n\n  const isAvailable = variant.availableForSale\n  if (!isAvailable) return null\n\n  return (\n    <div className=\"ipc-product-summary laptop:px-16 laptop-md:px-0 laptop-md:mt-[96px] lg-desktop:mt-[128px] mt-16\">\n      <div className=\"laptop:rounded-2xl bg-[#F5F5F7]\">\n        <Grid className=\"tablet:p-8 tablet:!pb-0 px-4 pt-6\">\n          <GridItem className=\"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4\">\n            <Heading\n              className=\"lg-desktop:text-[48px] laptop:text-[32px] laptop-md:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]\"\n              html={productSummaryData?.readyWant?.replace?.('{title}', product?.title)}\n            />\n            <div className=\"\">\n              <Picture\n                source={variantImage}\n                className=\"lg-desktop:aspect-[644/320]  laptop-md:aspect-[503/270] laptop:aspect-[332/190] tablet:aspect-[704/380] aspect-[358/190]\"\n                imgClassName=\"object-cover h-full\"\n              />\n            </div>\n          </GridItem>\n          <GridItem className=\"tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 col-span-12 mt-8 flex flex-col justify-between gap-6 pb-6\">\n            <div>\n              <div className=\"flex flex-col gap-4\">\n                <ExposureDetector\n                  exposureKey=\"listing_selector\"\n                  onExposure={() => {\n                    gaTrack({\n                      event: 'ga4Event',\n                      event_name: 'component_impression',\n                      event_parameters: {\n                        page_group: `Product Detail Page${variant.sku}`,\n                        component_type: 'image',\n                        component_name: 'listing_selector',\n                        position: 1,\n                      },\n                    })\n                  }}\n                >\n                  <div className=\"flex items-center justify-between gap-6\">\n                    <div className=\"flex items-center gap-4\">\n                      <Picture\n                        source={variant.image?.url || product?.images?.[0]?.url}\n                        className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n                      />\n                      <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n                        <Text\n                          className=\"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n                          html={product.title}\n                        />\n                        <Text\n                          className=\"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]\"\n                          html={productOptionsText}\n                        />\n                      </div>\n                    </div>\n                    <div className=\"flex items-center gap-1\">\n                      <Text\n                        className=\"laptop-md:text-2xl text-base font-bold\"\n                        html={formatPrice({\n                          amount: summaryFinalPrice,\n                          currencyCode: variant.price.currencyCode,\n                          locale,\n                        })}\n                      />\n                      {summaryFinalPrice < variant?.price?.amount && (\n                        <Text\n                          className=\"laptop-md:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through\"\n                          html={formatPrice({\n                            amount: variant?.price?.amount,\n                            currencyCode: variant.price.currencyCode,\n                            locale,\n                          })}\n                        />\n                      )}\n                    </div>\n                  </div>\n                </ExposureDetector>\n                {/* \u6309\u7167\u6DFB\u52A0\u987A\u5E8F\u6E32\u67D3\u5DF2\u6DFB\u52A0\u7684\u4EA7\u54C1 */}\n                {orderedJoinedProducts.map(({ type, key }) => {\n                  if (type === 'gift' && joinedRecommendBuyProducts?.gift?.value) {\n                    return (\n                      <ProductGiftSummary\n                        key={key}\n                        giftOperation={gift => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            gift: {\n                              value: undefined,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift })\n                          // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n                          setAddOrder?.(prev => prev.filter(t => t !== 'gift'))\n                        }}\n                        status={!!joinedRecommendBuyProducts?.gift}\n                        gift={joinedRecommendBuyProducts?.gift?.value}\n                        canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n                      />\n                    )\n                  }\n                  if (type === 'bundle' && joinedRecommendBuyProducts?.bundle?.value) {\n                    return (\n                      <ProductBundleSummary\n                        key={key}\n                        bundleOperation={bundle => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            bundle: {\n                              value: undefined,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle })\n                          // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n                          setAddOrder?.(prev => prev.filter(t => t !== 'bundle'))\n                        }}\n                        status={!!joinedRecommendBuyProducts?.bundle}\n                        bundleListItem={joinedRecommendBuyProducts?.bundle?.value}\n                        canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n                      />\n                    )\n                  }\n                  if (type === 'exchange' && joinedRecommendBuyProducts?.exchange?.value) {\n                    return (\n                      <ProductExchangeSummary\n                        key={key}\n                        exchangeOperation={exchange => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            exchange: {\n                              value: undefined,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange })\n                          // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n                          setAddOrder?.(prev => prev.filter(t => t !== 'exchange'))\n                        }}\n                        status={!!joinedRecommendBuyProducts?.exchange}\n                        canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n                        exchange={joinedRecommendBuyProducts?.exchange?.value}\n                      />\n                    )\n                  }\n                  return null\n                })}\n              </div>\n              {(initialRecommendBuyProducts?.bundle ||\n                initialRecommendBuyProducts?.gift ||\n                initialRecommendBuyProducts?.exchange) && (\n                <div className=\"laptop-md:mt-8 mt-6\">\n                  <Text className=\"laptop-md:text-[18px] text-sm font-bold\" html={productSummaryData?.recommendBuy} />\n                  <div className=\"laptop-md:gap-4 mt-4 flex flex-col gap-6\">\n                    {initialRecommendBuyProducts?.exchange && (\n                      <ProductExchangeSummary\n                        exchangeOperation={exchange => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            exchange: {\n                              value: exchange,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange: undefined })\n                          // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n                          setAddOrder?.(prev => [...prev, 'exchange'])\n                        }}\n                        canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n                        status={!initialRecommendBuyProducts?.exchange}\n                        exchange={initialRecommendBuyProducts?.exchange}\n                      />\n                    )}\n                    {initialRecommendBuyProducts?.bundle && (\n                      <ProductBundleSummary\n                        bundleOperation={bundle => {\n                          setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            bundle: {\n                              value: bundle,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle: undefined })\n                          // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n                          setAddOrder?.(prev => [...prev, 'bundle'])\n                        }}\n                        canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n                        status={!initialRecommendBuyProducts?.bundle}\n                        bundleListItem={initialRecommendBuyProducts?.bundle}\n                      />\n                    )}\n                    {initialRecommendBuyProducts?.gift && (\n                      <ProductGiftSummary\n                        giftOperation={gift => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            gift: {\n                              value: gift,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift: undefined })\n                          // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n                          setAddOrder?.(prev => [...prev, 'gift'])\n                        }}\n                        canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n                        status={!initialRecommendBuyProducts?.gift}\n                        gift={initialRecommendBuyProducts?.gift}\n                      />\n                    )}\n                  </div>\n                </div>\n              )}\n            </div>\n            <div className=\"text-right\">\n              <Text\n                className=\"laptop:text-xl laptop-md:text-2xl text-right font-bold\"\n                html={`${replaceTemplate(copyWriting?.totalPrice || '', { amount: formatPrice({ amount: Math.floor(finalPrice * 100) / 100, currencyCode: variant.price.currencyCode, locale }) })}`}\n              />\n\n              {totalSavings > 0 && (\n                <Text\n                  className=\"laptop:text-xl laptop-md:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through\"\n                  html={formatPrice({\n                    amount: comparePrice,\n                    currencyCode: variant.price.currencyCode,\n                    locale,\n                  })}\n                />\n              )}\n              <div className=\"mt-4 flex justify-end gap-3\">\n                <Button\n                  size=\"lg\"\n                  variant=\"secondary\"\n                  loading={addToCartLoading}\n                  className=\"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2\"\n                  onClick={() => onAddToCart?.()}\n                >\n                  {copyWriting?.addToCart}\n                </Button>\n                <Button\n                  size=\"lg\"\n                  loading={buyNowLoading}\n                  variant=\"primary\"\n                  className=\"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2\"\n                  onClick={() => onBuyNow?.()}\n                >\n                  {copyWriting?.shopNow}\n                </Button>\n              </div>\n            </div>\n          </GridItem>\n        </Grid>\n      </div>\n    </div>\n  )\n}\n\nconst useRecommendBuyProducts = () => {\n  const { bundle, variant, checkedBundle, freeGift, checkedGift, exchangePurchase, checkedExchangePurchase } =\n    useBizProductContext()\n  let bundleVariant = undefined\n  let giftVariant = undefined\n  let exchangeVariant = undefined\n  const { bundleList } = bundle || {}\n\n  const { giftList = [] } = freeGift || {}\n  const { giftList: exchangeList = [] } = exchangePurchase || {}\n\n  const availableBundleList =\n    bundleList?.filter(bundle =>\n      bundle.variants.slice(1, bundle.variants.length).every(v => v.variant.availableForSale)\n    ) || []\n\n  const [firstAvailableBundle] = availableBundleList\n  bundleVariant = checkedBundle || firstAvailableBundle\n\n  const [firstAvailableGift] = giftList?.filter(gift => gift.availableForSale) ?? []\n  giftVariant = checkedGift || firstAvailableGift\n\n  const [firstAvailableExchange] = exchangeList?.filter(exchange => exchange.availableForSale) ?? []\n  exchangeVariant = checkedExchangePurchase || firstAvailableExchange\n\n  return { bundleVariant, giftVariant, exchangeVariant }\n}\n\nconst ProductBundleSummary = ({\n  bundleOperation,\n  bundleListItem,\n  canOperate,\n  status,\n}: {\n  bundleOperation: (bundle?: BundleListItem) => void\n  bundleListItem?: BundleListItem\n  canOperate?: boolean\n  status?: boolean\n}) => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const { variant, setCheckedBundle } = useBizProductContext()\n  const bundleVariants = bundleListItem?.variants.filter(v => v.variant.sku !== variant.sku)\n\n  return (\n    <div className=\"\">\n      {bundleVariants?.map(bundleVariant => {\n        return (\n          <div className=\"flex items-center justify-between gap-4\" key={bundleVariant.variant.id}>\n            <div className=\"flex items-center gap-4\">\n              <Picture\n                source={bundleVariant?.variant?.image?.url}\n                className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n              />\n              <div className=\"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]\">\n                <Text\n                  className=\"laptop-md:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold\"\n                  html={bundleVariant.variant.product.title}\n                />\n              </div>\n            </div>\n            <div className=\"flex flex-col items-end justify-center gap-1\">\n              {!!bundleListItem && (\n                <div className=\"flex items-center gap-1\">\n                  <Text\n                    className=\"laptop-md:text-2xl text-base font-bold\"\n                    html={formatPrice({\n                      amount: bundleVariant?.price || 0,\n                      locale,\n                      currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n                    })}\n                  />\n                  {bundleVariant.price < bundleVariant.variant.price.amount && (\n                    <Text\n                      className=\"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n                      html={formatPrice({\n                        amount: bundleVariant.variant.price.amount || 0,\n                        locale,\n                        currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n                      })}\n                    />\n                  )}\n                </div>\n              )}\n              {canOperate && (\n                <Button\n                  size=\"icon\"\n                  variant=\"link\"\n                  onClick={() => {\n                    setCheckedBundle?.(status ? undefined : bundleListItem)\n                    bundleOperation?.(bundleListItem)\n                  }}\n                  className=\"size-auto shrink-0 underline\"\n                >\n                  {status ? copyWriting?.remove : copyWriting?.add}\n                </Button>\n              )}\n            </div>\n          </div>\n        )\n      })}\n    </div>\n  )\n}\n\nconst ProductGiftSummary = ({\n  giftOperation,\n  gift,\n  status,\n  canOperate,\n}: {\n  giftOperation: (gift?: ProductVariant) => void\n  gift?: ProductVariant\n  status?: boolean\n  canOperate?: boolean\n}) => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const { freeGift, setCheckedGift } = useBizProductContext()\n  const { freeLabel } = freeGift || {}\n  const { options } = gift || {}\n\n  const giftOptionsText = useMemo(() => {\n    const giftColorOption = (options?.find(\n      option => option.name === 'color' || option.name === 'colour' || option.name === 'couleur'\n    ) || {}) as ProductOption\n    const giftQuantityOption = options?.find(option => option.name === 'quantity') || ({} as ProductOption)\n    const giftColorOptionText = giftColorOption ? giftColorOption.values?.[0]?.label : ''\n    const giftQuantityOptionText = giftQuantityOption ? giftQuantityOption.values?.[0]?.label : ''\n    return `${giftColorOptionText && giftQuantityOptionText ? giftQuantityOptionText + ' | ' + giftColorOptionText : giftQuantityOptionText || giftColorOptionText} | ${freeLabel}`\n  }, [freeLabel, options])\n\n  return (\n    <div className=\"flex items-center justify-between gap-6\">\n      <div className=\"flex items-center gap-4\">\n        <Picture\n          source={gift?.image?.url}\n          className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n        />\n        <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n          <Text\n            className=\"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n            html={gift?.product?.title}\n          />\n          <Text\n            className=\"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]\"\n            html={giftOptionsText}\n          />\n        </div>\n      </div>\n      <div className=\"flex flex-col items-end justify-center gap-2\">\n        {!!gift && (\n          <div className=\"flex items-center gap-1\">\n            <Text className=\"laptop-md:text-2xl text-base font-bold\" html={freeLabel} />\n            <Text\n              className=\"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n              html={formatPrice({\n                amount: gift.price.amount,\n                locale,\n                currencyCode: gift.price.currencyCode,\n              })}\n            />\n          </div>\n        )}\n        {canOperate && (\n          <Button\n            size=\"icon\"\n            variant=\"link\"\n            onClick={() => {\n              setCheckedGift?.(status ? undefined : gift)\n              giftOperation(gift)\n            }}\n            className=\"size-auto shrink-0 underline\"\n          >\n            {status ? copyWriting?.remove : copyWriting?.add}\n          </Button>\n        )}\n      </div>\n    </div>\n  )\n}\n\nconst ProductExchangeSummary = ({\n  exchangeOperation,\n  exchange,\n  canOperate,\n  status,\n}: {\n  exchangeOperation: (exchange?: ProductVariant) => void\n  exchange?: ProductVariant & { finalPrice?: ProductPrice }\n  canOperate?: boolean\n  status?: boolean\n}) => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const { setCheckedExchangePurchase } = useBizProductContext()\n\n  return (\n    <div className=\"flex items-center justify-between gap-6\">\n      <div className=\"flex items-center gap-4\">\n        <Picture\n          source={exchange?.image?.url}\n          className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n        />\n        <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n          <Text\n            className=\"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n            html={exchange?.product?.title}\n          />\n          <Text className=\"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]\" />\n        </div>\n      </div>\n      <div className=\"flex flex-col items-end justify-center gap-2\">\n        {!!exchange && (\n          <div className=\"flex items-center gap-1\">\n            <Text\n              className=\"laptop-md:text-2xl text-base font-bold\"\n              html={formatPrice({\n                amount: exchange.finalPrice?.amount || 0,\n                locale,\n                currencyCode: exchange.price.currencyCode,\n              })}\n            />\n            <Text\n              className=\"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n              html={formatPrice({\n                amount: exchange.price?.amount || 0,\n                locale,\n                currencyCode: exchange.price.currencyCode,\n              })}\n            />\n          </div>\n        )}\n        {canOperate && (\n          <Button\n            size=\"icon\"\n            variant=\"link\"\n            onClick={() => {\n              setCheckedExchangePurchase?.(status ? undefined : exchange)\n              exchangeOperation(exchange)\n            }}\n            className=\"size-auto shrink-0 underline\"\n          >\n            {status ? copyWriting?.remove : copyWriting?.add}\n          </Button>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(ProductSummary)\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { Text, Button, Grid, GridItem, Picture, Heading } from '../../../../../components/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useEffect, useMemo, useState } from 'react'\nimport { formatPrice } from '../../../utils/index.js'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport type { BundleListItem, ProductVariant, ProductPrice, ProductOption } from '../../../types/product'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat.js'\nimport { withLayout } from '../../../../../shared/Styles.js'\nimport { ExposureDetector } from '../../../../../components/index.js'\nimport { gaTrack } from '../../../../../shared/track.js'\n\nconst ProductSummary = () => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const {\n    product,\n    variant,\n    finalPrice,\n    comparePrice,\n    coupon,\n    selectedOptions,\n    selectedVariants,\n    totalSavings,\n    onAddToCart,\n    onBuyNow,\n    savingDetail,\n    checkedBundle,\n    joinedRecommendBuyProducts,\n    setJoinedRecommendBuyProducts,\n    setSavingDetail,\n    addToCartLoading,\n    buyNowLoading,\n    profile,\n    addOrder,\n    setAddOrder,\n  } = useBizProductContext()\n\n  const productSummaryData = useMemo(() => {\n    return product?.payload?.components?.find((item: any) => item.componentKey === 'ProductSummary')?.data || {}\n  }, [product?.payload])\n\n  const [currentProductVariant] = selectedVariants\n\n  const summaryFinalPrice = useMemo(() => {\n    const currentBundleVariant = checkedBundle?.variants.find(v => v.variant.sku === currentProductVariant?.sku)\n    const currentBundlePrice = new Decimal(currentProductVariant?.price?.amount || 0)\n      .minus(currentBundleVariant?.price || currentProductVariant?.price?.amount)\n      .toNumber()\n    let currentProductPrice = new Decimal(currentProductVariant?.price?.amount || 0)\n    if (profile?.email) {\n      currentProductPrice = currentProductPrice.minus(savingDetail?.member || 0)\n    }\n    const finalPrice = currentProductPrice.minus(savingDetail?.coupon).minus(currentBundlePrice).toNumber()\n    return Math.floor(finalPrice * 100) / 100\n  }, [currentProductVariant, checkedBundle, profile, savingDetail?.member, savingDetail?.coupon])\n\n  const { bundleVariant, giftVariant, exchangeVariant } = useRecommendBuyProducts() || {}\n\n  const [initialRecommendBuyProducts, setInitialRecommendBuyProducts] = useState<{\n    bundle?: BundleListItem\n    gift?: ProductVariant\n    exchange?: ProductVariant\n  }>()\n\n  useEffect(() => {\n    setInitialRecommendBuyProducts({\n      bundle: joinedRecommendBuyProducts.bundle?.value ? undefined : bundleVariant,\n      gift: joinedRecommendBuyProducts.gift?.value ? undefined : giftVariant,\n      exchange: joinedRecommendBuyProducts.exchange?.value ? undefined : exchangeVariant,\n    })\n  }, [bundleVariant, giftVariant, exchangeVariant, joinedRecommendBuyProducts])\n\n  // \u6839\u636E\u6DFB\u52A0\u987A\u5E8F\u751F\u6210\u5DF2\u6DFB\u52A0\u4EA7\u54C1\u7684\u5217\u8868\n  const orderedJoinedProducts = useMemo(() => {\n    const result: Array<{ type: 'bundle' | 'gift' | 'exchange'; key: string }> = []\n\n    // \u6309\u7167\u6DFB\u52A0\u987A\u5E8F\u6DFB\u52A0\n    if (addOrder) {\n      addOrder.forEach((type, index) => {\n        if (joinedRecommendBuyProducts[type]?.value) {\n          result.push({ type, key: `${type}-${index}` })\n        }\n      })\n    }\n\n    return result\n  }, [addOrder, joinedRecommendBuyProducts])\n\n  const productOptionsText = useMemo(() => {\n    const quantity = selectedOptions?.quantity || ''\n    const color = selectedOptions?.color || selectedOptions?.colour || selectedOptions?.couleur || ''\n    return `${quantity && color ? `${quantity} | ${color}` : quantity || color}`\n  }, [selectedOptions?.quantity, selectedOptions?.color, selectedOptions?.colour, selectedOptions?.couleur])\n\n  const variantImage = useMemo(() => {\n    const variantProductSummary =\n      variant?.payload?.components?.find((item: any) => item.componentKey === 'ProductSummary')?.data || {}\n    const { image_1920, image_1440, image_1024, image_768, image_390 } = variantProductSummary?.thumbnail || {}\n    const variantProductGalleryItemImage = variantProductSummary?.thumbnail\n      ? `${image_1920} 1920, ${image_1440} 1440, ${image_1024} 1024, ${image_768} 768, ${image_390} 390`\n      : variant.image?.url\n    return variantProductGalleryItemImage || variant.image?.url\n  }, [variant.image?.url, variant?.payload?.components])\n\n  const isAvailable = variant.availableForSale\n  if (!isAvailable) return null\n\n  return (\n    <div className=\"ipc-product-summary laptop:px-16 laptop-md:px-0 laptop-md:mt-[96px] lg-desktop:mt-[128px] mt-16\">\n      <div className=\"laptop:rounded-2xl bg-[#F5F5F7]\">\n        <Grid className=\"tablet:p-8 tablet:!pb-0 px-4 pt-6\">\n          <GridItem className=\"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4\">\n            <Heading\n              className=\"lg-desktop:text-[48px] laptop:text-[32px] laptop-md:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]\"\n              html={productSummaryData?.readyWant?.replace?.('{title}', product?.title)}\n            />\n            <div className=\"\">\n              <Picture\n                source={variantImage}\n                className=\"lg-desktop:aspect-[644/320]  laptop-md:aspect-[503/270] laptop:aspect-[332/190] tablet:aspect-[704/380] aspect-[358/190]\"\n                imgClassName=\"object-cover h-full\"\n              />\n            </div>\n          </GridItem>\n          <GridItem className=\"tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 col-span-12 mt-8 flex flex-col justify-between gap-6 pb-6\">\n            <div>\n              <div className=\"flex flex-col gap-4\">\n                <ExposureDetector\n                  exposureKey=\"listing_selector\"\n                  onExposure={() => {\n                    gaTrack({\n                      event: 'ga4Event',\n                      event_name: 'component_impression',\n                      event_parameters: {\n                        page_group: `Product Detail Page${variant.sku}`,\n                        component_type: 'image',\n                        component_name: 'listing_selector',\n                        position: 1,\n                      },\n                    })\n                  }}\n                >\n                  <div className=\"flex items-center justify-between gap-6\">\n                    <div className=\"flex items-center gap-4\">\n                      <Picture\n                        source={variant.image?.url || product?.images?.[0]?.url}\n                        className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n                      />\n                      <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n                        <Text\n                          className=\"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n                          html={product.title}\n                        />\n                        <Text\n                          className=\"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]\"\n                          html={productOptionsText}\n                        />\n                      </div>\n                    </div>\n                    <div className=\"flex items-center gap-1\">\n                      <Text\n                        className=\"laptop-md:text-2xl text-base font-bold\"\n                        html={formatPrice({\n                          amount: summaryFinalPrice,\n                          currencyCode: variant.price.currencyCode,\n                          locale,\n                        })}\n                      />\n                      {summaryFinalPrice < variant?.price?.amount && (\n                        <Text\n                          className=\"laptop-md:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through\"\n                          html={formatPrice({\n                            amount: variant?.price?.amount,\n                            currencyCode: variant.price.currencyCode,\n                            locale,\n                          })}\n                        />\n                      )}\n                    </div>\n                  </div>\n                </ExposureDetector>\n                {/* \u6309\u7167\u6DFB\u52A0\u987A\u5E8F\u6E32\u67D3\u5DF2\u6DFB\u52A0\u7684\u4EA7\u54C1 */}\n                {orderedJoinedProducts.map(({ type, key }) => {\n                  if (type === 'gift' && joinedRecommendBuyProducts?.gift?.value) {\n                    return (\n                      <ProductGiftSummary\n                        key={key}\n                        giftOperation={gift => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            gift: {\n                              value: undefined,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift })\n                          // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n                          setAddOrder?.(prev => prev.filter(t => t !== 'gift'))\n                        }}\n                        status={!!joinedRecommendBuyProducts?.gift}\n                        gift={joinedRecommendBuyProducts?.gift?.value}\n                        canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n                      />\n                    )\n                  }\n                  if (type === 'bundle' && joinedRecommendBuyProducts?.bundle?.value) {\n                    return (\n                      <ProductBundleSummary\n                        key={key}\n                        bundleOperation={bundle => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            bundle: {\n                              value: undefined,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle })\n                          // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n                          setAddOrder?.(prev => prev.filter(t => t !== 'bundle'))\n                        }}\n                        status={!!joinedRecommendBuyProducts?.bundle}\n                        bundleListItem={joinedRecommendBuyProducts?.bundle?.value}\n                        canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n                      />\n                    )\n                  }\n                  if (type === 'exchange' && joinedRecommendBuyProducts?.exchange?.value) {\n                    return (\n                      <ProductExchangeSummary\n                        key={key}\n                        exchangeOperation={exchange => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            exchange: {\n                              value: undefined,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange })\n                          // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n                          setAddOrder?.(prev => prev.filter(t => t !== 'exchange'))\n                        }}\n                        status={!!joinedRecommendBuyProducts?.exchange}\n                        canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n                        exchange={joinedRecommendBuyProducts?.exchange?.value}\n                      />\n                    )\n                  }\n                  return null\n                })}\n              </div>\n              {(initialRecommendBuyProducts?.bundle ||\n                initialRecommendBuyProducts?.gift ||\n                initialRecommendBuyProducts?.exchange) && (\n                <div className=\"laptop-md:mt-8 mt-6\">\n                  <Text className=\"laptop-md:text-[18px] text-sm font-bold\" html={productSummaryData?.recommendBuy} />\n                  <div className=\"laptop-md:gap-4 mt-4 flex flex-col gap-6\">\n                    {initialRecommendBuyProducts?.exchange && (\n                      <ProductExchangeSummary\n                        exchangeOperation={exchange => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            exchange: {\n                              value: exchange,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange: undefined })\n                          // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n                          setAddOrder?.(prev => [...prev, 'exchange'])\n                        }}\n                        canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n                        status={!initialRecommendBuyProducts?.exchange}\n                        exchange={initialRecommendBuyProducts?.exchange}\n                      />\n                    )}\n                    {initialRecommendBuyProducts?.bundle && (\n                      <ProductBundleSummary\n                        bundleOperation={bundle => {\n                          setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            bundle: {\n                              value: bundle,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle: undefined })\n                          // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n                          setAddOrder?.(prev => [...prev, 'bundle'])\n                        }}\n                        canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n                        status={!initialRecommendBuyProducts?.bundle}\n                        bundleListItem={initialRecommendBuyProducts?.bundle}\n                      />\n                    )}\n                    {initialRecommendBuyProducts?.gift && (\n                      <ProductGiftSummary\n                        giftOperation={gift => {\n                          setJoinedRecommendBuyProducts?.({\n                            ...joinedRecommendBuyProducts,\n                            gift: {\n                              value: gift,\n                              canOperate: true,\n                            },\n                          })\n                          setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift: undefined })\n                          // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n                          setAddOrder?.(prev => [...prev, 'gift'])\n                        }}\n                        canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n                        status={!initialRecommendBuyProducts?.gift}\n                        gift={initialRecommendBuyProducts?.gift}\n                      />\n                    )}\n                  </div>\n                </div>\n              )}\n            </div>\n            <div className=\"text-right\">\n              <Text\n                className=\"laptop:text-xl laptop-md:text-2xl text-right font-bold\"\n                html={`${replaceTemplate(copyWriting?.totalPrice || '', { amount: formatPrice({ amount: Math.floor(finalPrice * 100) / 100, currencyCode: variant.price.currencyCode, locale }) })}`}\n              />\n\n              {totalSavings > 0 && (\n                <Text\n                  className=\"laptop:text-xl laptop-md:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through\"\n                  html={formatPrice({\n                    amount: comparePrice,\n                    currencyCode: variant.price.currencyCode,\n                    locale,\n                  })}\n                />\n              )}\n              <div className=\"mt-4 flex justify-end gap-3\">\n                <Button\n                  size=\"lg\"\n                  variant=\"secondary\"\n                  loading={addToCartLoading}\n                  className=\"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2\"\n                  onClick={() => onAddToCart?.()}\n                >\n                  {copyWriting?.addToCart}\n                </Button>\n                <Button\n                  size=\"lg\"\n                  loading={buyNowLoading}\n                  variant=\"primary\"\n                  className=\"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2\"\n                  onClick={() => onBuyNow?.()}\n                >\n                  {copyWriting?.shopNow}\n                </Button>\n              </div>\n            </div>\n          </GridItem>\n        </Grid>\n      </div>\n    </div>\n  )\n}\n\nconst useRecommendBuyProducts = () => {\n  const { bundle, variant, checkedBundle, freeGift, checkedGift, exchangePurchase, checkedExchangePurchase } =\n    useBizProductContext()\n  let bundleVariant = undefined\n  let giftVariant = undefined\n  let exchangeVariant = undefined\n  const { bundleList } = bundle || {}\n\n  const { giftList = [] } = freeGift || {}\n  const { giftList: exchangeList = [] } = exchangePurchase || {}\n\n  const availableBundleList =\n    bundleList?.filter(bundle =>\n      bundle.variants.slice(1, bundle.variants.length).every(v => v.variant.availableForSale)\n    ) || []\n\n  const [firstAvailableBundle] = availableBundleList\n  bundleVariant = checkedBundle || firstAvailableBundle\n\n  const [firstAvailableGift] = giftList?.filter(gift => gift.availableForSale) ?? []\n  giftVariant = checkedGift || firstAvailableGift\n\n  const [firstAvailableExchange] = exchangeList?.filter(exchange => exchange.availableForSale) ?? []\n  exchangeVariant = checkedExchangePurchase || firstAvailableExchange\n\n  return { bundleVariant, giftVariant, exchangeVariant }\n}\n\nconst ProductBundleSummary = ({\n  bundleOperation,\n  bundleListItem,\n  canOperate,\n  status,\n}: {\n  bundleOperation: (bundle?: BundleListItem) => void\n  bundleListItem?: BundleListItem\n  canOperate?: boolean\n  status?: boolean\n}) => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const { variant, setCheckedBundle } = useBizProductContext()\n  const bundleVariants = bundleListItem?.variants.filter(v => v.variant.sku !== variant.sku)\n\n  return (\n    <div className=\"\">\n      {bundleVariants?.map(bundleVariant => {\n        return (\n          <div className=\"flex items-center justify-between gap-4\" key={bundleVariant.variant.id}>\n            <div className=\"flex items-center gap-4\">\n              <Picture\n                source={bundleVariant?.variant?.image?.url}\n                className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n              />\n              <div className=\"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]\">\n                <Text\n                  className=\"laptop-md:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold\"\n                  html={bundleVariant.variant.product.title}\n                />\n              </div>\n            </div>\n            <div className=\"flex flex-col items-end justify-center gap-1\">\n              {!!bundleListItem && (\n                <div className=\"flex items-center gap-1\">\n                  <Text\n                    className=\"laptop-md:text-2xl text-base font-bold\"\n                    html={formatPrice({\n                      amount: bundleVariant?.price || 0,\n                      locale,\n                      currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n                    })}\n                  />\n                  {bundleVariant.price < bundleVariant.variant.price.amount && (\n                    <Text\n                      className=\"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n                      html={formatPrice({\n                        amount: bundleVariant.variant.price.amount || 0,\n                        locale,\n                        currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n                      })}\n                    />\n                  )}\n                </div>\n              )}\n              {canOperate && (\n                <Button\n                  size=\"icon\"\n                  variant=\"link\"\n                  onClick={() => {\n                    setCheckedBundle?.(status ? undefined : bundleListItem)\n                    bundleOperation?.(bundleListItem)\n                  }}\n                  className=\"size-auto shrink-0 underline\"\n                >\n                  {status ? copyWriting?.remove : copyWriting?.add}\n                </Button>\n              )}\n            </div>\n          </div>\n        )\n      })}\n    </div>\n  )\n}\n\nconst ProductGiftSummary = ({\n  giftOperation,\n  gift,\n  status,\n  canOperate,\n}: {\n  giftOperation: (gift?: ProductVariant) => void\n  gift?: ProductVariant\n  status?: boolean\n  canOperate?: boolean\n}) => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const { freeGift, setCheckedGift } = useBizProductContext()\n  const { freeLabel } = freeGift || {}\n  const { options } = gift || {}\n\n  const giftOptionsText = useMemo(() => {\n    const giftColorOption = (options?.find(\n      option => option.name === 'color' || option.name === 'colour' || option.name === 'couleur'\n    ) || {}) as ProductOption\n    const giftQuantityOption = options?.find(option => option.name === 'quantity') || ({} as ProductOption)\n    const giftColorOptionText = giftColorOption ? giftColorOption.values?.[0]?.label : ''\n    const giftQuantityOptionText = giftQuantityOption ? giftQuantityOption.values?.[0]?.label : ''\n    return `${giftColorOptionText && giftQuantityOptionText ? giftQuantityOptionText + ' | ' + giftColorOptionText : giftQuantityOptionText || giftColorOptionText} | ${freeLabel}`\n  }, [freeLabel, options])\n\n  return (\n    <div className=\"flex items-center justify-between gap-6\">\n      <div className=\"flex items-center gap-4\">\n        <Picture\n          source={gift?.image?.url}\n          className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n        />\n        <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n          <Text\n            className=\"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n            html={gift?.product?.title}\n          />\n          <Text\n            className=\"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]\"\n            html={giftOptionsText}\n          />\n        </div>\n      </div>\n      <div className=\"flex flex-col items-end justify-center gap-2\">\n        {!!gift && (\n          <div className=\"flex items-center gap-1\">\n            <Text className=\"laptop-md:text-2xl text-base font-bold\" html={freeLabel} />\n            <Text\n              className=\"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n              html={formatPrice({\n                amount: gift.price.amount,\n                locale,\n                currencyCode: gift.price.currencyCode,\n              })}\n            />\n          </div>\n        )}\n        {canOperate && (\n          <Button\n            size=\"icon\"\n            variant=\"link\"\n            onClick={() => {\n              setCheckedGift?.(status ? undefined : gift)\n              giftOperation(gift)\n            }}\n            className=\"size-auto shrink-0 underline\"\n          >\n            {status ? copyWriting?.remove : copyWriting?.add}\n          </Button>\n        )}\n      </div>\n    </div>\n  )\n}\n\nconst ProductExchangeSummary = ({\n  exchangeOperation,\n  exchange,\n  canOperate,\n  status,\n}: {\n  exchangeOperation: (exchange?: ProductVariant) => void\n  exchange?: ProductVariant & { finalPrice?: ProductPrice }\n  canOperate?: boolean\n  status?: boolean\n}) => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const { setCheckedExchangePurchase } = useBizProductContext()\n\n  return (\n    <div className=\"flex items-center justify-between gap-6\">\n      <div className=\"flex items-center gap-4\">\n        <Picture\n          source={exchange?.image?.url}\n          className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n        />\n        <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n          <Text\n            className=\"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n            html={exchange?.product?.title}\n          />\n          <Text className=\"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]\" />\n        </div>\n      </div>\n      <div className=\"flex flex-col items-end justify-center gap-2\">\n        {!!exchange && (\n          <div className=\"flex items-center gap-1\">\n            <Text\n              className=\"laptop-md:text-2xl text-base font-bold\"\n              html={formatPrice({\n                amount: exchange.finalPrice?.amount || 0,\n                locale,\n                currencyCode: exchange.price.currencyCode,\n              })}\n            />\n            <Text\n              className=\"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n              html={formatPrice({\n                amount: exchange.price?.amount || 0,\n                locale,\n                currencyCode: exchange.price.currencyCode,\n              })}\n            />\n          </div>\n        )}\n        {canOperate && (\n          <Button\n            size=\"icon\"\n            variant=\"link\"\n            onClick={() => {\n              setCheckedExchangePurchase?.(status ? undefined : exchange)\n              exchangeOperation(exchange)\n            }}\n            className=\"size-auto shrink-0 underline\"\n          >\n            {status ? copyWriting?.remove : copyWriting?.add}\n          </Button>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(ProductSummary)\n"],
+  "mappings": "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",
   "names": ["ProductSummary_exports", "__export", "ProductSummary_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_BizProductProvider", "import_react", "import_utils", "import_AiuiProvider", "import_decimal", "import_textFormat", "import_Styles", "import_track", "ProductSummary", "locale", "copyWriting", "product", "variant", "finalPrice", "comparePrice", "coupon", "selectedOptions", "selectedVariants", "totalSavings", "onAddToCart", "onBuyNow", "savingDetail", "checkedBundle", "joinedRecommendBuyProducts", "setJoinedRecommendBuyProducts", "setSavingDetail", "addToCartLoading", "buyNowLoading", "profile", "addOrder", "setAddOrder", "productSummaryData", "item", "currentProductVariant", "summaryFinalPrice", "currentBundleVariant", "v", "currentBundlePrice", "Decimal", "currentProductPrice", "bundleVariant", "giftVariant", "exchangeVariant", "useRecommendBuyProducts", "initialRecommendBuyProducts", "setInitialRecommendBuyProducts", "orderedJoinedProducts", "result", "type", "index", "productOptionsText", "quantity", "color", "variantImage", "variantProductSummary", "image_1920", "image_1440", "image_1024", "image_768", "image_390", "key", "ProductGiftSummary", "gift", "prev", "t", "ProductBundleSummary", "bundle", "ProductExchangeSummary", "exchange", "freeGift", "checkedGift", "exchangePurchase", "checkedExchangePurchase", "bundleList", "giftList", "exchangeList", "availableBundleList", "firstAvailableBundle", "firstAvailableGift", "firstAvailableExchange", "bundleOperation", "bundleListItem", "canOperate", "status", "setCheckedBundle", "bundleVariants", "giftOperation", "setCheckedGift", "freeLabel", "options", "giftOptionsText", "giftColorOption", "option", "giftQuantityOption", "giftColorOptionText", "giftQuantityOptionText", "exchangeOperation", "setCheckedExchangePurchase"]
 }

package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js

@@ -1,2 +1,2 @@
-"use strict";var v=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var H=(n,o)=>{for(var s in o)v(n,s,{get:o[s],enumerable:!0})},L=(n,o,s,c)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of k(o))!E.call(n,i)&&i!==s&&v(n,i,{get:()=>o[i],enumerable:!(c=T(o,i))||c.enumerable});return n};var M=n=>L(v({},"__esModule",{value:!0}),n);var I={};H(I,{default:()=>P});module.exports=M(I);var r=require("react/jsx-runtime"),d=require("../../../../../helpers/index.js"),t=require("react"),w=require("./useScrollSpy.js"),g=require("es-toolkit");const z=({tabs:n,onSpyNavItemClick:o,className:s,renderRating:c})=>{const[i,S]=(0,t.useState)(0),p=(0,t.useMemo)(()=>c?[...n,{label:"Reviews",id:"ipc-review",href:""}]:n,[n,c]),y=(0,t.useMemo)(()=>p.map(e=>e.id),[p]),u=(0,g.debounce)(()=>{const e=document.querySelector("#purchase-bar");e&&S(e.getBoundingClientRect().height)},500);(0,t.useEffect)(()=>(u(),window.addEventListener("resize",u),()=>{window.removeEventListener("resize",u)}),[u]);const a=(0,w.useScrollSpy)(y,i),f=(0,t.useRef)(null),m=(0,t.useRef)(new Map),x=(0,t.useCallback)(e=>{o?.(e)},[o]);(0,t.useEffect)(()=>{if(!a||!f.current)return;const e=m.current.get(a);if(!e)return;const l=f.current,h=e.getBoundingClientRect(),b=l.getBoundingClientRect(),R=h.left+h.width/2-b.left,B=b.width/2,C=R-B;l.scrollTo({left:l.scrollLeft+C,behavior:"smooth"})},[a]);const N=(0,t.useCallback)((e,l)=>{l?m.current.set(e,l):m.current.delete(e)},[]);return(0,r.jsx)("div",{ref:f,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:(0,d.cn)("overflow-x-auto",s),children:(0,r.jsx)("div",{className:"tablet:gap-8 flex gap-6",children:p?.map(e=>(0,r.jsx)("button",{ref:l=>N(e.id,l),children:e.id==="ipc-review"?(0,r.jsxs)("div",{className:"relative shrink-0 whitespace-nowrap py-[10px]",children:[c,(0,r.jsx)("div",{className:(0,d.cn)("laptop-md:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":a===e.id})})]}):(0,r.jsxs)("div",{className:(0,d.cn)("laptop-md:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]",{"text-[#1d1d1f]":a===e.id}),onClick:()=>x(e),children:[e.label,(0,r.jsx)("div",{className:(0,d.cn)("laptop-md:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":a===e.id})})]})},e.id))})})};var P=z;
+"use strict";var v=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var H=(n,o)=>{for(var s in o)v(n,s,{get:o[s],enumerable:!0})},L=(n,o,s,c)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of k(o))!E.call(n,i)&&i!==s&&v(n,i,{get:()=>o[i],enumerable:!(c=T(o,i))||c.enumerable});return n};var M=n=>L(v({},"__esModule",{value:!0}),n);var I={};H(I,{default:()=>P});module.exports=M(I);var r=require("react/jsx-runtime"),t=require("react"),w=require("es-toolkit"),d=require("../../../../../helpers/index.js"),g=require("./useScrollSpy.js");const z=({tabs:n,onSpyNavItemClick:o,className:s,renderRating:c})=>{const[i,S]=(0,t.useState)(0),p=(0,t.useMemo)(()=>c?[...n,{label:"Reviews",id:"ipc-review",href:""}]:n,[n,c]),y=(0,t.useMemo)(()=>p.map(e=>e.id),[p]),u=(0,w.debounce)(()=>{const e=document.querySelector("#purchase-bar");e&&S(e.getBoundingClientRect().height)},500);(0,t.useEffect)(()=>(u(),window.addEventListener("resize",u),()=>{window.removeEventListener("resize",u)}),[u]);const a=(0,g.useScrollSpy)(y,i),f=(0,t.useRef)(null),m=(0,t.useRef)(new Map),x=(0,t.useCallback)(e=>{o?.(e)},[o]);(0,t.useEffect)(()=>{if(!a||!f.current)return;const e=m.current.get(a);if(!e)return;const l=f.current,h=e.getBoundingClientRect(),b=l.getBoundingClientRect(),R=h.left+h.width/2-b.left,B=b.width/2,C=R-B;l.scrollTo({left:l.scrollLeft+C,behavior:"smooth"})},[a]);const N=(0,t.useCallback)((e,l)=>{l?m.current.set(e,l):m.current.delete(e)},[]);return(0,r.jsx)("div",{ref:f,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:(0,d.cn)("overflow-x-auto",s),children:(0,r.jsx)("div",{className:"tablet:gap-8 flex gap-6",children:p?.map(e=>(0,r.jsx)("button",{ref:l=>N(e.id,l),children:e.id==="ipc-review"?(0,r.jsxs)("div",{className:"relative shrink-0 whitespace-nowrap py-[10px]",children:[c,(0,r.jsx)("div",{className:(0,d.cn)("laptop-md:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":a===e.id})})]}):(0,r.jsxs)("div",{className:(0,d.cn)("laptop-md:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]",{"text-[#1d1d1f]":a===e.id}),onClick:()=>x(e),children:[e.label,(0,r.jsx)("div",{className:(0,d.cn)("laptop-md:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":a===e.id})})]})},e.id))})})};var P=z;
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.tsx"],
-  "sourcesContent": ["import { cn } from '../../../../../helpers/index.js'\nimport { useCallback, useRef, useMemo, useEffect, useState } from 'react'\nimport type { ScrollSpyNavItem, ScrollSpyNavProps } from './types.js'\nimport { useScrollSpy } from './useScrollSpy.js'\nimport { debounce } from 'es-toolkit'\n\nconst ScrollSpyNav = ({ tabs, onSpyNavItemClick, className, renderRating }: ScrollSpyNavProps) => {\n  // \u4F7F\u7528 useScrollSpy hook \u81EA\u52A8\u76D1\u542C\u6EDA\u52A8\n  const [purchaseBarHeight, setPurchaseBarHeight] = useState(0)\n  const combinedTabs = useMemo(() => {\n    if (renderRating) {\n      return [...tabs, { label: 'Reviews', id: 'ipc-review', href: '' }]\n    }\n    return tabs\n  }, [tabs, renderRating])\n\n  const sectionIds = useMemo(() => {\n    return combinedTabs.map(tab => tab.id)\n  }, [combinedTabs])\n\n  const debouncedHandleResize = debounce(() => {\n    const purchaseBar = document.querySelector('#purchase-bar')\n    if (purchaseBar) {\n      setPurchaseBarHeight(purchaseBar.getBoundingClientRect().height)\n    }\n  }, 500)\n\n  useEffect(() => {\n    debouncedHandleResize()\n    window.addEventListener('resize', debouncedHandleResize)\n    return () => {\n      window.removeEventListener('resize', debouncedHandleResize)\n    }\n  }, [debouncedHandleResize])\n\n  const activeId = useScrollSpy(sectionIds, purchaseBarHeight)\n\n  // \u79FB\u52A8\u7AEF\uFF1A\u6A2A\u5411\u6EDA\u52A8\u5BB9\u5668\u548C tab \u6309\u94AE\u7684 refs\n  const scrollContainerRef = useRef<HTMLDivElement>(null)\n  const tabRefs = useRef<Map<string, HTMLButtonElement>>(new Map())\n\n  const onTabClick = useCallback(\n    (tab: ScrollSpyNavItem) => {\n      onSpyNavItemClick?.(tab)\n    },\n    [onSpyNavItemClick]\n  )\n\n  // \u79FB\u52A8\u7AEF\uFF1A\u5F53 activeTab \u6539\u53D8\u65F6\uFF0C\u81EA\u52A8\u6EDA\u52A8\u5230\u4E2D\u5FC3\u4F4D\u7F6E\n  useEffect(() => {\n    if (!activeId || !scrollContainerRef.current) return\n\n    const activeTabElement = tabRefs.current.get(activeId)\n    if (!activeTabElement) return\n\n    const container = scrollContainerRef.current\n    const tabRect = activeTabElement.getBoundingClientRect()\n    const containerRect = container.getBoundingClientRect()\n\n    // \u8BA1\u7B97\u9700\u8981\u6EDA\u52A8\u7684\u8DDD\u79BB\uFF0C\u4F7F tab \u4F4D\u4E8E\u5BB9\u5668\u4E2D\u5FC3\n    const tabCenter = tabRect.left + tabRect.width / 2 - containerRect.left\n    const containerCenter = containerRect.width / 2\n    const scrollOffset = tabCenter - containerCenter\n\n    container.scrollTo({\n      left: container.scrollLeft + scrollOffset,\n      behavior: 'smooth',\n    })\n  }, [activeId])\n\n  // \u8BBE\u7F6E tab ref\n  const setTabRef = useCallback((tabId: string, element: HTMLButtonElement | null) => {\n    if (element) {\n      tabRefs.current.set(tabId, element)\n    } else {\n      tabRefs.current.delete(tabId)\n    }\n  }, [])\n\n  return (\n    <div\n      ref={scrollContainerRef}\n      style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}\n      className={cn('overflow-x-auto', className)}\n    >\n      <div className=\"tablet:gap-8 flex gap-6\">\n        {combinedTabs?.map(tab => (\n          <button key={tab.id} ref={el => setTabRef(tab.id, el)}>\n            {tab.id === 'ipc-review' ? (\n              <div className=\"relative shrink-0 whitespace-nowrap py-[10px]\">\n                {renderRating}\n                <div\n                  className={cn(\n                    'laptop-md:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out',\n                    {\n                      'w-full': activeId === tab.id,\n                    }\n                  )}\n                />\n              </div>\n            ) : (\n              <div\n                className={cn(\n                  'laptop-md:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]',\n                  {\n                    'text-[#1d1d1f]': activeId === tab.id,\n                  }\n                )}\n                onClick={() => onTabClick(tab)}\n              >\n                {tab.label}\n                <div\n                  className={cn(\n                    'laptop-md:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out',\n                    {\n                      'w-full': activeId === tab.id,\n                    }\n                  )}\n                />\n              </div>\n            )}\n          </button>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default ScrollSpyNav\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAyFc,IAAAI,EAAA,6BAzFdC,EAAmB,2CACnBC,EAAkE,iBAElEC,EAA6B,6BAC7BC,EAAyB,sBAEzB,MAAMC,EAAe,CAAC,CAAE,KAAAC,EAAM,kBAAAC,EAAmB,UAAAC,EAAW,aAAAC,CAAa,IAAyB,CAEhG,KAAM,CAACC,EAAmBC,CAAoB,KAAI,YAAS,CAAC,EACtDC,KAAe,WAAQ,IACvBH,EACK,CAAC,GAAGH,EAAM,CAAE,MAAO,UAAW,GAAI,aAAc,KAAM,EAAG,CAAC,EAE5DA,EACN,CAACA,EAAMG,CAAY,CAAC,EAEjBI,KAAa,WAAQ,IAClBD,EAAa,IAAIE,GAAOA,EAAI,EAAE,EACpC,CAACF,CAAY,CAAC,EAEXG,KAAwB,YAAS,IAAM,CAC3C,MAAMC,EAAc,SAAS,cAAc,eAAe,EACtDA,GACFL,EAAqBK,EAAY,sBAAsB,EAAE,MAAM,CAEnE,EAAG,GAAG,KAEN,aAAU,KACRD,EAAsB,EACtB,OAAO,iBAAiB,SAAUA,CAAqB,EAChD,IAAM,CACX,OAAO,oBAAoB,SAAUA,CAAqB,CAC5D,GACC,CAACA,CAAqB,CAAC,EAE1B,MAAME,KAAW,gBAAaJ,EAAYH,CAAiB,EAGrDQ,KAAqB,UAAuB,IAAI,EAChDC,KAAU,UAAuC,IAAI,GAAK,EAE1DC,KAAa,eAChBN,GAA0B,CACzBP,IAAoBO,CAAG,CACzB,EACA,CAACP,CAAiB,CACpB,KAGA,aAAU,IAAM,CACd,GAAI,CAACU,GAAY,CAACC,EAAmB,QAAS,OAE9C,MAAMG,EAAmBF,EAAQ,QAAQ,IAAIF,CAAQ,EACrD,GAAI,CAACI,EAAkB,OAEvB,MAAMC,EAAYJ,EAAmB,QAC/BK,EAAUF,EAAiB,sBAAsB,EACjDG,EAAgBF,EAAU,sBAAsB,EAGhDG,EAAYF,EAAQ,KAAOA,EAAQ,MAAQ,EAAIC,EAAc,KAC7DE,EAAkBF,EAAc,MAAQ,EACxCG,EAAeF,EAAYC,EAEjCJ,EAAU,SAAS,CACjB,KAAMA,EAAU,WAAaK,EAC7B,SAAU,QACZ,CAAC,CACH,EAAG,CAACV,CAAQ,CAAC,EAGb,MAAMW,KAAY,eAAY,CAACC,EAAeC,IAAsC,CAC9EA,EACFX,EAAQ,QAAQ,IAAIU,EAAOC,CAAO,EAElCX,EAAQ,QAAQ,OAAOU,CAAK,CAEhC,EAAG,CAAC,CAAC,EAEL,SACE,OAAC,OACC,IAAKX,EACL,MAAO,CAAE,eAAgB,OAAQ,gBAAiB,MAAO,EACzD,aAAW,MAAG,kBAAmBV,CAAS,EAE1C,mBAAC,OAAI,UAAU,0BACZ,SAAAI,GAAc,IAAIE,MACjB,OAAC,UAAoB,IAAKiB,GAAMH,EAAUd,EAAI,GAAIiB,CAAE,EACjD,SAAAjB,EAAI,KAAO,gBACV,QAAC,OAAI,UAAU,gDACZ,UAAAL,KACD,OAAC,OACC,aAAW,MACT,iHACA,CACE,SAAUQ,IAAaH,EAAI,EAC7B,CACF,EACF,GACF,KAEA,QAAC,OACC,aAAW,MACT,0GACA,CACE,iBAAkBG,IAAaH,EAAI,EACrC,CACF,EACA,QAAS,IAAMM,EAAWN,CAAG,EAE5B,UAAAA,EAAI,SACL,OAAC,OACC,aAAW,MACT,iHACA,CACE,SAAUG,IAAaH,EAAI,EAC7B,CACF,EACF,GACF,GAhCSA,EAAI,EAkCjB,CACD,EACH,EACF,CAEJ,EAEA,IAAOhB,EAAQO",
-  "names": ["ScrollSpyNav_exports", "__export", "ScrollSpyNav_default", "__toCommonJS", "import_jsx_runtime", "import_helpers", "import_react", "import_useScrollSpy", "import_es_toolkit", "ScrollSpyNav", "tabs", "onSpyNavItemClick", "className", "renderRating", "purchaseBarHeight", "setPurchaseBarHeight", "combinedTabs", "sectionIds", "tab", "debouncedHandleResize", "purchaseBar", "activeId", "scrollContainerRef", "tabRefs", "onTabClick", "activeTabElement", "container", "tabRect", "containerRect", "tabCenter", "containerCenter", "scrollOffset", "setTabRef", "tabId", "element", "el"]
+  "sourcesContent": ["import { useState, useCallback, useRef, useEffect, useMemo } from 'react'\nimport { debounce } from 'es-toolkit'\nimport type { ScrollSpyNavItem, ScrollSpyNavProps } from './types.js'\nimport { cn } from '../../../../../helpers/index.js'\nimport { useScrollSpy } from './useScrollSpy.js'\n\nconst ScrollSpyNav = ({ tabs, onSpyNavItemClick, className, renderRating }: ScrollSpyNavProps) => {\n  // \u4F7F\u7528 useScrollSpy hook \u81EA\u52A8\u76D1\u542C\u6EDA\u52A8\n  const [purchaseBarHeight, setPurchaseBarHeight] = useState(0)\n  const combinedTabs = useMemo(() => {\n    if (renderRating) {\n      return [...tabs, { label: 'Reviews', id: 'ipc-review', href: '' }]\n    }\n    return tabs\n  }, [tabs, renderRating])\n\n  const sectionIds = useMemo(() => {\n    return combinedTabs.map(tab => tab.id)\n  }, [combinedTabs])\n\n  const debouncedHandleResize = debounce(() => {\n    const purchaseBar = document.querySelector('#purchase-bar')\n    if (purchaseBar) {\n      setPurchaseBarHeight(purchaseBar.getBoundingClientRect().height)\n    }\n  }, 500)\n\n  useEffect(() => {\n    debouncedHandleResize()\n    window.addEventListener('resize', debouncedHandleResize)\n    return () => {\n      window.removeEventListener('resize', debouncedHandleResize)\n    }\n  }, [debouncedHandleResize])\n\n  const activeId = useScrollSpy(sectionIds, purchaseBarHeight)\n\n  // \u79FB\u52A8\u7AEF\uFF1A\u6A2A\u5411\u6EDA\u52A8\u5BB9\u5668\u548C tab \u6309\u94AE\u7684 refs\n  const scrollContainerRef = useRef<HTMLDivElement>(null)\n  const tabRefs = useRef<Map<string, HTMLButtonElement>>(new Map())\n\n  const onTabClick = useCallback(\n    (tab: ScrollSpyNavItem) => {\n      onSpyNavItemClick?.(tab)\n    },\n    [onSpyNavItemClick]\n  )\n\n  // \u79FB\u52A8\u7AEF\uFF1A\u5F53 activeTab \u6539\u53D8\u65F6\uFF0C\u81EA\u52A8\u6EDA\u52A8\u5230\u4E2D\u5FC3\u4F4D\u7F6E\n  useEffect(() => {\n    if (!activeId || !scrollContainerRef.current) return\n\n    const activeTabElement = tabRefs.current.get(activeId)\n    if (!activeTabElement) return\n\n    const container = scrollContainerRef.current\n    const tabRect = activeTabElement.getBoundingClientRect()\n    const containerRect = container.getBoundingClientRect()\n\n    // \u8BA1\u7B97\u9700\u8981\u6EDA\u52A8\u7684\u8DDD\u79BB\uFF0C\u4F7F tab \u4F4D\u4E8E\u5BB9\u5668\u4E2D\u5FC3\n    const tabCenter = tabRect.left + tabRect.width / 2 - containerRect.left\n    const containerCenter = containerRect.width / 2\n    const scrollOffset = tabCenter - containerCenter\n\n    container.scrollTo({\n      left: container.scrollLeft + scrollOffset,\n      behavior: 'smooth',\n    })\n  }, [activeId])\n\n  // \u8BBE\u7F6E tab ref\n  const setTabRef = useCallback((tabId: string, element: HTMLButtonElement | null) => {\n    if (element) {\n      tabRefs.current.set(tabId, element)\n    } else {\n      tabRefs.current.delete(tabId)\n    }\n  }, [])\n\n  return (\n    <div\n      ref={scrollContainerRef}\n      style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}\n      className={cn('overflow-x-auto', className)}\n    >\n      <div className=\"tablet:gap-8 flex gap-6\">\n        {combinedTabs?.map(tab => (\n          <button key={tab.id} ref={el => setTabRef(tab.id, el)}>\n            {tab.id === 'ipc-review' ? (\n              <div className=\"relative shrink-0 whitespace-nowrap py-[10px]\">\n                {renderRating}\n                <div\n                  className={cn(\n                    'laptop-md:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out',\n                    {\n                      'w-full': activeId === tab.id,\n                    }\n                  )}\n                />\n              </div>\n            ) : (\n              <div\n                className={cn(\n                  'laptop-md:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]',\n                  {\n                    'text-[#1d1d1f]': activeId === tab.id,\n                  }\n                )}\n                onClick={() => onTabClick(tab)}\n              >\n                {tab.label}\n                <div\n                  className={cn(\n                    'laptop-md:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out',\n                    {\n                      'w-full': activeId === tab.id,\n                    }\n                  )}\n                />\n              </div>\n            )}\n          </button>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default ScrollSpyNav\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAyFc,IAAAI,EAAA,6BAzFdC,EAAkE,iBAClEC,EAAyB,sBAEzBC,EAAmB,2CACnBC,EAA6B,6BAE7B,MAAMC,EAAe,CAAC,CAAE,KAAAC,EAAM,kBAAAC,EAAmB,UAAAC,EAAW,aAAAC,CAAa,IAAyB,CAEhG,KAAM,CAACC,EAAmBC,CAAoB,KAAI,YAAS,CAAC,EACtDC,KAAe,WAAQ,IACvBH,EACK,CAAC,GAAGH,EAAM,CAAE,MAAO,UAAW,GAAI,aAAc,KAAM,EAAG,CAAC,EAE5DA,EACN,CAACA,EAAMG,CAAY,CAAC,EAEjBI,KAAa,WAAQ,IAClBD,EAAa,IAAIE,GAAOA,EAAI,EAAE,EACpC,CAACF,CAAY,CAAC,EAEXG,KAAwB,YAAS,IAAM,CAC3C,MAAMC,EAAc,SAAS,cAAc,eAAe,EACtDA,GACFL,EAAqBK,EAAY,sBAAsB,EAAE,MAAM,CAEnE,EAAG,GAAG,KAEN,aAAU,KACRD,EAAsB,EACtB,OAAO,iBAAiB,SAAUA,CAAqB,EAChD,IAAM,CACX,OAAO,oBAAoB,SAAUA,CAAqB,CAC5D,GACC,CAACA,CAAqB,CAAC,EAE1B,MAAME,KAAW,gBAAaJ,EAAYH,CAAiB,EAGrDQ,KAAqB,UAAuB,IAAI,EAChDC,KAAU,UAAuC,IAAI,GAAK,EAE1DC,KAAa,eAChBN,GAA0B,CACzBP,IAAoBO,CAAG,CACzB,EACA,CAACP,CAAiB,CACpB,KAGA,aAAU,IAAM,CACd,GAAI,CAACU,GAAY,CAACC,EAAmB,QAAS,OAE9C,MAAMG,EAAmBF,EAAQ,QAAQ,IAAIF,CAAQ,EACrD,GAAI,CAACI,EAAkB,OAEvB,MAAMC,EAAYJ,EAAmB,QAC/BK,EAAUF,EAAiB,sBAAsB,EACjDG,EAAgBF,EAAU,sBAAsB,EAGhDG,EAAYF,EAAQ,KAAOA,EAAQ,MAAQ,EAAIC,EAAc,KAC7DE,EAAkBF,EAAc,MAAQ,EACxCG,EAAeF,EAAYC,EAEjCJ,EAAU,SAAS,CACjB,KAAMA,EAAU,WAAaK,EAC7B,SAAU,QACZ,CAAC,CACH,EAAG,CAACV,CAAQ,CAAC,EAGb,MAAMW,KAAY,eAAY,CAACC,EAAeC,IAAsC,CAC9EA,EACFX,EAAQ,QAAQ,IAAIU,EAAOC,CAAO,EAElCX,EAAQ,QAAQ,OAAOU,CAAK,CAEhC,EAAG,CAAC,CAAC,EAEL,SACE,OAAC,OACC,IAAKX,EACL,MAAO,CAAE,eAAgB,OAAQ,gBAAiB,MAAO,EACzD,aAAW,MAAG,kBAAmBV,CAAS,EAE1C,mBAAC,OAAI,UAAU,0BACZ,SAAAI,GAAc,IAAIE,MACjB,OAAC,UAAoB,IAAKiB,GAAMH,EAAUd,EAAI,GAAIiB,CAAE,EACjD,SAAAjB,EAAI,KAAO,gBACV,QAAC,OAAI,UAAU,gDACZ,UAAAL,KACD,OAAC,OACC,aAAW,MACT,iHACA,CACE,SAAUQ,IAAaH,EAAI,EAC7B,CACF,EACF,GACF,KAEA,QAAC,OACC,aAAW,MACT,0GACA,CACE,iBAAkBG,IAAaH,EAAI,EACrC,CACF,EACA,QAAS,IAAMM,EAAWN,CAAG,EAE5B,UAAAA,EAAI,SACL,OAAC,OACC,aAAW,MACT,iHACA,CACE,SAAUG,IAAaH,EAAI,EAC7B,CACF,EACF,GACF,GAhCSA,EAAI,EAkCjB,CACD,EACH,EACF,CAEJ,EAEA,IAAOhB,EAAQO",
+  "names": ["ScrollSpyNav_exports", "__export", "ScrollSpyNav_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_es_toolkit", "import_helpers", "import_useScrollSpy", "ScrollSpyNav", "tabs", "onSpyNavItemClick", "className", "renderRating", "purchaseBarHeight", "setPurchaseBarHeight", "combinedTabs", "sectionIds", "tab", "debouncedHandleResize", "purchaseBar", "activeId", "scrollContainerRef", "tabRefs", "onTabClick", "activeTabElement", "container", "tabRect", "containerRect", "tabCenter", "containerCenter", "scrollOffset", "setTabRef", "tabId", "element", "el"]
 }

package/dist/cjs/biz-components/Listing/hooks/useBenefits.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/biz-components/Listing/hooks/useBenefits.ts"],
-  "sourcesContent": ["import { useBizProductContext } from '../BizProductProvider.js'\nimport type { ProductVariant, FreeGift, Bundle } from '../types/product'\nimport { checkItemAvailableForProduct } from '../utils/helper.js'\nimport { useDiscountEnable } from './useDiscountEnable.js'\n\nimport { useAiuiContext } from '../../AiuiProvider/index.js'\n\ninterface BenefitsParams {\n  variant: ProductVariant\n}\n\ninterface BenefitItemConfig<T extends Record<string, any> = Record<string, any>> {\n  enable: boolean\n  config?: T // \u539F\u59CB\u914D\u7F6E\n}\n\ninterface BenefitsResult {\n  /**\n   * \u901A\u7528\u4F18\u60E0\u5238\n   */\n  commonCoupon?: BenefitItemConfig\n  /**\n   * \u4E70\u8D60\n   */\n  freeGift: BenefitItemConfig<FreeGift>\n  /**\n   * \u6346\u7ED1\u6298\u6263\n   */\n  bundle: BenefitItemConfig<Bundle>\n  /**\n   * \u4F1A\u5458\u4EF7\n   */\n  memberDiscount: BenefitItemConfig\n  /**\n   * \u79EF\u5206\u62B5\u73B0\n   */\n  creditsRedemption: BenefitItemConfig\n  /**\n   * \u9AD8\u6807\u7269\u6D41\n   */\n  paidShipping: BenefitItemConfig\n\n  /**\n   * \u6EE1\u8D60\n   */\n  fullGift: BenefitItemConfig\n\n  /**\n   * \u6EE1\u51CF\u6298\u6263\n   */\n  levelDiscount: BenefitItemConfig\n}\n\n/**\n * \u5546\u54C1\u6743\u76CA\n * \u83B7\u53D6\u5F53\u524Dsku \u6240\u6709\u7684\u6743\u76CA\n * \u5305\u62EC \u901A\u7528\u4F18\u60E0\u5238\uFF0C\u4F1A\u5458\u4EF7\uFF0C\u6EE1\u51CF\uFF0C\u6346\u7ED1\u6298\u6263\uFF0C\u4E70\u8D60 \uFF0C\u6EE1\u8D60 \uFF0C\u79EF\u5206\u62B5\u73B0\n * @returns\n */\nexport const useBenefits = ({ variant }: BenefitsParams): BenefitsResult => {\n  const { coupon, product, bundle, freeGift, memberFunctionResult, creditsRedemption, profile } = useBizProductContext()\n\n  const { amount: creditsRedemptionAmount } = creditsRedemption ?? {}\n\n  const { trackingData } = useAiuiContext()\n\n  const total = Math.max(\n    memberFunctionResult?.withCouponMemberTotalSave ?? 0,\n    memberFunctionResult?.withoutCouponMaxMemberTotalSave ?? 0\n  )\n\n  const discountEnable = useDiscountEnable({ profile, variant, memberFunctionResult, coupon })\n\n  // \u9AD8\u6807\u7269\u6D41\n  const showPaidShipping = Boolean(\n    trackingData?.paidShipping &&\n      variant.requiresShipping &&\n      !variant?.metafields?.global?.presell &&\n      !variant?.metafields?.global?.HideShipping\n  )\n\n  // \u811A\u672C\u6EE1\u8D60\n  const fullGift = trackingData?.freeGift\n  const excludeProducts =\n    fullGift?.excludeProducts?.map((item: any) => (typeof item === 'object' && 'sku' in item ? item.sku : item)) ?? []\n\n  const showLevelDiscount =\n    trackingData?.levelDiscount && checkItemAvailableForProduct({ product, variant, item: trackingData?.levelDiscount })\n\n  return {\n    commonCoupon: {\n      enable: discountEnable.showCommonCoupon && Boolean(coupon),\n      config: coupon ?? {},\n    },\n    freeGift: {\n      enable: Boolean(freeGift) && !!freeGift?.giftList?.length,\n      config: freeGift,\n    },\n    bundle: {\n      enable:\n        Boolean(bundle) &&\n        !!bundle?.bundleList?.length &&\n        Math.max(...(bundle?.bundleList?.map(item => item.savings ?? 0) ?? [])) > 0, // \u6709\u4F18\u60E0\u624D\u5C55\u793A\n      config: bundle,\n    },\n    memberDiscount: {\n      enable: discountEnable.showMemberDiscount,\n      // enable: total > 0,\n      config: {\n        amount: total,\n        description: memberFunctionResult?.labels?.[0],\n      },\n    },\n    creditsRedemption: {\n      enable: Boolean(creditsRedemptionAmount) && creditsRedemptionAmount! > 0,\n      config: { amount: creditsRedemptionAmount, label: trackingData?.creditsRedemptionLabel },\n    },\n    paidShipping: {\n      enable: showPaidShipping,\n      config: {},\n    },\n    fullGift: {\n      enable: Boolean(fullGift && !excludeProducts.includes(variant.sku)),\n      config: fullGift ?? {},\n    },\n    levelDiscount: {\n      enable: Boolean(showLevelDiscount),\n      config: trackingData?.levelDiscount ?? {},\n    },\n  }\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAqC,oCAErCC,EAA6C,8BAC7CC,EAAkC,kCAElCC,EAA+B,uCAsDxB,MAAML,EAAc,CAAC,CAAE,QAAAM,CAAQ,IAAsC,CAC1E,KAAM,CAAE,OAAAC,EAAQ,QAAAC,EAAS,OAAAC,EAAQ,SAAAC,EAAU,qBAAAC,EAAsB,kBAAAC,EAAmB,QAAAC,CAAQ,KAAI,wBAAqB,EAE/G,CAAE,OAAQC,CAAwB,EAAIF,GAAqB,CAAC,EAE5D,CAAE,aAAAG,CAAa,KAAI,kBAAe,EAElCC,EAAQ,KAAK,IACjBL,GAAsB,2BAA6B,EACnDA,GAAsB,iCAAmC,CAC3D,EAEMM,KAAiB,qBAAkB,CAAE,QAAAJ,EAAS,QAAAP,EAAS,qBAAAK,EAAsB,OAAAJ,CAAO,CAAC,EAGrFW,EAAmB,GACvBH,GAAc,cACZT,EAAQ,kBACR,CAACA,GAAS,YAAY,QAAQ,SAC9B,CAACA,GAAS,YAAY,QAAQ,cAI5Ba,EAAWJ,GAAc,SACzBK,EACJD,GAAU,iBAAiB,IAAKE,GAAe,OAAOA,GAAS,UAAY,QAASA,EAAOA,EAAK,IAAMA,CAAK,GAAK,CAAC,EAE7GC,EACJP,GAAc,kBAAiB,gCAA6B,CAAE,QAAAP,EAAS,QAAAF,EAAS,KAAMS,GAAc,aAAc,CAAC,EAErH,MAAO,CACL,aAAc,CACZ,OAAQE,EAAe,kBAAoB,EAAQV,EACnD,OAAQA,GAAU,CAAC,CACrB,EACA,SAAU,CACR,OAAQ,EAAQG,GAAa,CAAC,CAACA,GAAU,UAAU,OACnD,OAAQA,CACV,EACA,OAAQ,CACN,OACE,EAAQD,GACR,CAAC,CAACA,GAAQ,YAAY,QACtB,KAAK,IAAI,GAAIA,GAAQ,YAAY,IAAIY,GAAQA,EAAK,SAAW,CAAC,GAAK,CAAC,CAAE,EAAI,EAC5E,OAAQZ,CACV,EACA,eAAgB,CACd,OAAQQ,EAAe,mBAEvB,OAAQ,CACN,OAAQD,EACR,YAAaL,GAAsB,SAAS,CAAC,CAC/C,CACF,EACA,kBAAmB,CACjB,OAAQ,EAAQG,GAA4BA,EAA2B,EACvE,OAAQ,CAAE,OAAQA,EAAyB,MAAOC,GAAc,sBAAuB,CACzF,EACA,aAAc,CACZ,OAAQG,EACR,OAAQ,CAAC,CACX,EACA,SAAU,CACR,OAAQ,GAAQC,GAAY,CAACC,EAAgB,SAASd,EAAQ,GAAG,GACjE,OAAQa,GAAY,CAAC,CACvB,EACA,cAAe,CACb,OAAQ,EAAQG,EAChB,OAAQP,GAAc,eAAiB,CAAC,CAC1C,CACF,CACF",
+  "sourcesContent": ["import { useBizProductContext } from '../BizProductProvider.js'\nimport type { ProductVariant, FreeGift, Bundle } from '../types/product'\nimport { checkItemAvailableForProduct } from '../utils/helper.js'\nimport { useDiscountEnable } from './useDiscountEnable.js'\n\nimport { useAiuiContext } from '../../AiuiProvider/index.js'\n\ninterface BenefitsParams {\n  variant: ProductVariant\n}\n\ninterface BenefitItemConfig<T extends Record<string, any> = Record<string, any>> {\n  enable: boolean\n  config?: T // \u539F\u59CB\u914D\u7F6E\n}\n\ninterface BenefitsResult {\n  /**\n   * \u901A\u7528\u4F18\u60E0\u5238\n   */\n  commonCoupon?: BenefitItemConfig\n  /**\n   * \u4E70\u8D60\n   */\n  freeGift: BenefitItemConfig<FreeGift>\n  /**\n   * \u6346\u7ED1\u6298\u6263\n   */\n  bundle: BenefitItemConfig<Bundle>\n  /**\n   * \u4F1A\u5458\u4EF7\n   */\n  memberDiscount: BenefitItemConfig\n  /**\n   * \u79EF\u5206\u62B5\u73B0\n   */\n  creditsRedemption: BenefitItemConfig\n  /**\n   * \u9AD8\u6807\u7269\u6D41\n   */\n  paidShipping: BenefitItemConfig\n\n  /**\n   * \u6EE1\u8D60\n   */\n  fullGift: BenefitItemConfig\n\n  /**\n   * \u6EE1\u51CF\u6298\u6263\n   */\n  levelDiscount: BenefitItemConfig\n}\n\n/**\n * \u5546\u54C1\u6743\u76CA\n * \u83B7\u53D6\u5F53\u524Dsku \u6240\u6709\u7684\u6743\u76CA\n * \u5305\u62EC \u901A\u7528\u4F18\u60E0\u5238\uFF0C\u4F1A\u5458\u4EF7\uFF0C\u6EE1\u51CF\uFF0C\u6346\u7ED1\u6298\u6263\uFF0C\u4E70\u8D60 \uFF0C\u6EE1\u8D60 \uFF0C\u79EF\u5206\u62B5\u73B0\n * @returns\n */\nexport const useBenefits = ({ variant }: BenefitsParams): BenefitsResult => {\n  const { coupon, product, bundle, freeGift, memberFunctionResult, creditsRedemption, profile } = useBizProductContext()\n\n  const { amount: creditsRedemptionAmount } = creditsRedemption ?? {}\n\n  const { trackingData } = useAiuiContext()\n\n  const total = Math.max(\n    memberFunctionResult?.withCouponMemberTotalSave ?? 0,\n    memberFunctionResult?.withoutCouponMaxMemberTotalSave ?? 0\n  )\n\n  const discountEnable = useDiscountEnable({ profile, variant, memberFunctionResult, coupon })\n\n  // \u9AD8\u6807\u7269\u6D41\n  const showPaidShipping = Boolean(\n    trackingData?.paidShipping &&\n    variant.requiresShipping &&\n    !variant?.metafields?.global?.presell &&\n    !variant?.metafields?.global?.HideShipping\n  )\n\n  // \u811A\u672C\u6EE1\u8D60\n  const fullGift = trackingData?.freeGift\n  const excludeProducts =\n    fullGift?.excludeProducts?.map((item: any) => (typeof item === 'object' && 'sku' in item ? item.sku : item)) ?? []\n\n  const showLevelDiscount =\n    trackingData?.levelDiscount && checkItemAvailableForProduct({ product, variant, item: trackingData?.levelDiscount })\n\n  return {\n    commonCoupon: {\n      enable: discountEnable.showCommonCoupon && Boolean(coupon),\n      config: coupon ?? {},\n    },\n    freeGift: {\n      enable: Boolean(freeGift) && !!freeGift?.giftList?.length,\n      config: freeGift,\n    },\n    bundle: {\n      enable:\n        Boolean(bundle) &&\n        !!bundle?.bundleList?.length &&\n        Math.max(...(bundle?.bundleList?.map(item => item.savings ?? 0) ?? [])) > 0, // \u6709\u4F18\u60E0\u624D\u5C55\u793A\n      config: bundle,\n    },\n    memberDiscount: {\n      enable: discountEnable.showMemberDiscount,\n      // enable: total > 0,\n      config: {\n        amount: total,\n        description: memberFunctionResult?.labels?.[0],\n      },\n    },\n    creditsRedemption: {\n      enable: Boolean(creditsRedemptionAmount) && creditsRedemptionAmount! > 0,\n      config: { amount: creditsRedemptionAmount, label: trackingData?.creditsRedemptionLabel },\n    },\n    paidShipping: {\n      enable: showPaidShipping,\n      config: {},\n    },\n    fullGift: {\n      enable: Boolean(fullGift && !excludeProducts.includes(variant.sku)),\n      config: fullGift ?? {},\n    },\n    levelDiscount: {\n      enable: Boolean(showLevelDiscount),\n      config: trackingData?.levelDiscount ?? {},\n    },\n  }\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAqC,oCAErCC,EAA6C,8BAC7CC,EAAkC,kCAElCC,EAA+B,uCAsDxB,MAAML,EAAc,CAAC,CAAE,QAAAM,CAAQ,IAAsC,CAC1E,KAAM,CAAE,OAAAC,EAAQ,QAAAC,EAAS,OAAAC,EAAQ,SAAAC,EAAU,qBAAAC,EAAsB,kBAAAC,EAAmB,QAAAC,CAAQ,KAAI,wBAAqB,EAE/G,CAAE,OAAQC,CAAwB,EAAIF,GAAqB,CAAC,EAE5D,CAAE,aAAAG,CAAa,KAAI,kBAAe,EAElCC,EAAQ,KAAK,IACjBL,GAAsB,2BAA6B,EACnDA,GAAsB,iCAAmC,CAC3D,EAEMM,KAAiB,qBAAkB,CAAE,QAAAJ,EAAS,QAAAP,EAAS,qBAAAK,EAAsB,OAAAJ,CAAO,CAAC,EAGrFW,EAAmB,GACvBH,GAAc,cACdT,EAAQ,kBACR,CAACA,GAAS,YAAY,QAAQ,SAC9B,CAACA,GAAS,YAAY,QAAQ,cAI1Ba,EAAWJ,GAAc,SACzBK,EACJD,GAAU,iBAAiB,IAAKE,GAAe,OAAOA,GAAS,UAAY,QAASA,EAAOA,EAAK,IAAMA,CAAK,GAAK,CAAC,EAE7GC,EACJP,GAAc,kBAAiB,gCAA6B,CAAE,QAAAP,EAAS,QAAAF,EAAS,KAAMS,GAAc,aAAc,CAAC,EAErH,MAAO,CACL,aAAc,CACZ,OAAQE,EAAe,kBAAoB,EAAQV,EACnD,OAAQA,GAAU,CAAC,CACrB,EACA,SAAU,CACR,OAAQ,EAAQG,GAAa,CAAC,CAACA,GAAU,UAAU,OACnD,OAAQA,CACV,EACA,OAAQ,CACN,OACE,EAAQD,GACR,CAAC,CAACA,GAAQ,YAAY,QACtB,KAAK,IAAI,GAAIA,GAAQ,YAAY,IAAIY,GAAQA,EAAK,SAAW,CAAC,GAAK,CAAC,CAAE,EAAI,EAC5E,OAAQZ,CACV,EACA,eAAgB,CACd,OAAQQ,EAAe,mBAEvB,OAAQ,CACN,OAAQD,EACR,YAAaL,GAAsB,SAAS,CAAC,CAC/C,CACF,EACA,kBAAmB,CACjB,OAAQ,EAAQG,GAA4BA,EAA2B,EACvE,OAAQ,CAAE,OAAQA,EAAyB,MAAOC,GAAc,sBAAuB,CACzF,EACA,aAAc,CACZ,OAAQG,EACR,OAAQ,CAAC,CACX,EACA,SAAU,CACR,OAAQ,GAAQC,GAAY,CAACC,EAAgB,SAASd,EAAQ,GAAG,GACjE,OAAQa,GAAY,CAAC,CACvB,EACA,cAAe,CACb,OAAQ,EAAQG,EAChB,OAAQP,GAAc,eAAiB,CAAC,CAC1C,CACF,CACF",
   "names": ["useBenefits_exports", "__export", "useBenefits", "__toCommonJS", "import_BizProductProvider", "import_helper", "import_useDiscountEnable", "import_AiuiProvider", "variant", "coupon", "product", "bundle", "freeGift", "memberFunctionResult", "creditsRedemption", "profile", "creditsRedemptionAmount", "trackingData", "total", "discountEnable", "showPaidShipping", "fullGift", "excludeProducts", "item", "showLevelDiscount"]
 }

package/dist/cjs/biz-components/MediaPlayerSticky/index.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var oe=Object.create;var v=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var le=Object.getPrototypeOf,ce=Object.prototype.hasOwnProperty;var de=(r,s)=>{for(var t in s)v(r,t,{get:s[t],enumerable:!0})},S=(r,s,t,o)=>{if(s&&typeof s=="object"||typeof s=="function")for(let n of ie(s))!ce.call(r,n)&&n!==t&&v(r,n,{get:()=>s[n],enumerable:!(o=ne(s,n))||o.enumerable});return r};var l=(r,s,t)=>(t=r!=null?oe(le(r)):{},S(s||!r||!r.__esModule?v(t,"default",{value:r,enumerable:!0}):t,r)),pe=r=>S(v({},"__esModule",{value:!0}),r);var ye={};de(ye,{default:()=>fe});module.exports=pe(ye);var e=require("react/jsx-runtime"),a=l(require("react")),L=require("es-toolkit"),P=require("react-intersection-observer"),u=require("../../helpers/utils.js"),$=require("../../shared/Styles.js"),B=l(require("../Slogan/index.js")),Y=require("../VideoModal/YouTubePlayer.js"),d=require("../../components/gird.js"),q=require("../../components/container.js"),F=l(require("../BrandEquity/index.js")),I=l(require("../MemberEquity/index.js")),j=l(require("../Spacer/index.js")),G=l(require("gsap")),N=require("@payloadcms/richtext-lexical/html"),k=require("react-responsive"),V=l(require("../../helpers/ScrollLoadVideo.js"));const T=({defaultConverters:r})=>({...r,text:s=>{const{node:t}=s;return t.$&&t.$.color?`<span class="lexical-${t.$.color}">${t.text}</span>`:t.text}}),x=({children:r,spaceY:s,className:t})=>{const o=(0,k.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(q.Container,{spaceY:s,className:(0,u.cn)("!bg-transparent",t),children:(0,e.jsxs)(d.Grid,{children:[!o&&(0,e.jsx)(d.GridItem,{span:1}),(0,e.jsx)(d.GridItem,{span:o?12:10,children:r}),!o&&(0,e.jsx)(d.GridItem,{span:1})]})})},me=a.default.forwardRef(({children:r,id:s,components:t},o)=>{const n=(0,a.useRef)(null);return(0,e.jsxs)("div",{ref:n,className:"relative z-10",children:[(0,e.jsx)(e.Fragment,{children:r}),(0,e.jsx)(e.Fragment,{children:t?.map(i=>{switch(i.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(x,{spaceY:"none",children:(0,e.jsx)(F.default,{data:i,style:i?.style})})});case"ipc-member-equity":return(0,e.jsx)("div",{className:"relative z-20 w-full bg-transparent",children:(0,e.jsx)(x,{spaceY:"none",children:(0,e.jsx)(I.default,{data:i,className:"w-full",style:i?.style})})});case"ipc-spacer":return(0,e.jsx)(j.default,{data:i,style:i?.style,className:"!bg-transparent"});default:return null}})})]})}),ue=(0,a.forwardRef)(({className:r="",wrapperClassName:s="",id:t,data:{title:o,videoTitle:n,mobVideo:i,mobImg:f,img:y,isYouTube:Q,youtubePcId:M,youtubeMobileId:O,video:b,theme:R,shape:W,components:_}},ve)=>{const H=(0,a.useRef)(null),w=(0,a.useRef)(null),{ref:A,inView:p}=(0,P.useInView)(),[be,J]=(0,a.useState)(0),[z,K]=(0,a.useState)(!1),[U,X]=(0,a.useState)(!1),Z=(0,a.useRef)(null),D=typeof o=="string"?o:o&&(0,N.convertLexicalToHTML)({data:o,converters:T});typeof n=="string"||n&&(0,N.convertLexicalToHTML)({data:n,converters:T});const[ee,te]=(0,a.useState)(0),[c,re]=(0,a.useState)(!1),C=(0,k.useMediaQuery)({query:"(max-width: 768px)"});(0,a.useEffect)(()=>{re(C)},[C]);const g=(0,L.debounce)(()=>{if(w.current){const h=w.current.getBoundingClientRect(),m=c?window.screen.height:window.innerHeight,ae=window.scrollY||window.pageYOffset,se=h.bottom+ae,E=document.documentElement.scrollHeight-se;te(E>m?m:E),J(m)}},2e3);return(0,a.useEffect)(()=>{p&&!z&&(H.current?.play(),K(!0))},[p,z]),(0,a.useEffect)(()=>(g(),window.addEventListener("resize",g),()=>{window.removeEventListener("resize",g)}),[]),(0,a.useEffect)(()=>{function h(){const m=c?window.screen.height:window.innerHeight;G.default.timeline({scrollTrigger:{trigger:`#${t}`,start:"top top",end:`top+=${m*1.8}px bottom`,scrub:.5}}).from(`#${t} .media-content`,{top:"50%",transform:"translate(-50%, -50%)"}).to(`.${t} .sticky-cover`,{backdropFilter:"blur(8px)",duration:.4}).to(`#${t} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")}p&&h()},[p]),(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{id:t,className:(0,u.cn)("relative z-20 h-screen w-full",r,{"aiui-dark":R==="dark","rounded-box":W==="rounded"}),ref:Z,children:(0,e.jsx)("div",{ref:A,className:"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2 antialiased",style:{willChange:"transform",contain:"paint"},children:(0,e.jsx)(x,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)(B.default,{className:"sticky-title antialiased",data:{title:D||"",theme:R}})})})}),(0,e.jsxs)("div",{ref:w,style:{marginBottom:`-${ee}px`,zIndex:p?2:1},className:(0,u.cn)(t,"relative mt-[-200vh]",s),children:[(0,e.jsx)("div",{className:"sticky top-0 ",children:(0,e.jsxs)("div",{className:(0,u.cn)("media-cover","relative h-screen w-full"),children:[Q?(0,e.jsx)(Y.YouTubePlayer,{youTubeId:c&&O||M}):b?.url&&(0,e.jsx)(V.default,{videoRef:H,poster:c&&f?.url?f?.url:y?.url,src:c&&i?.url?i?.url:b?.url,className:"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]",videoClassName:" object-cover object-[82%]",muted:!0,loop:!1,playsInline:!0,onEnded:()=>{X(!0)}}),y?.url&&(!b?.url||U)&&(0,e.jsx)("img",{src:c&&f?.url?f?.url:y?.url,alt:y?.alt,className:"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]",loading:"lazy"}),(0,e.jsx)("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full",style:{backdropFilter:"blur(0px)",WebkitBackdropFilter:"blur(0px)",willChange:"backdrop-filter"}})]})}),(0,e.jsx)("div",{className:"relative h-screen w-full"}),(0,e.jsx)(me,{components:_}),(0,e.jsx)("div",{className:"relative h-screen w-full"})]})]})});var fe=(0,$.withLayout)(ue);
+"use strict";"use client";var oe=Object.create;var v=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var le=Object.getPrototypeOf,ce=Object.prototype.hasOwnProperty;var de=(r,s)=>{for(var t in s)v(r,t,{get:s[t],enumerable:!0})},S=(r,s,t,o)=>{if(s&&typeof s=="object"||typeof s=="function")for(let n of ie(s))!ce.call(r,n)&&n!==t&&v(r,n,{get:()=>s[n],enumerable:!(o=ne(s,n))||o.enumerable});return r};var l=(r,s,t)=>(t=r!=null?oe(le(r)):{},S(s||!r||!r.__esModule?v(t,"default",{value:r,enumerable:!0}):t,r)),pe=r=>S(v({},"__esModule",{value:!0}),r);var ye={};de(ye,{default:()=>fe});module.exports=pe(ye);var e=require("react/jsx-runtime"),a=l(require("react")),L=require("es-toolkit"),P=require("react-intersection-observer"),u=require("../../helpers/utils.js"),$=require("../../shared/Styles.js"),B=l(require("../Slogan/index.js")),Y=require("../VideoModal/YouTubePlayer.js"),d=require("../../components/grid.js"),q=require("../../components/container.js"),F=l(require("../BrandEquity/index.js")),I=l(require("../MemberEquity/index.js")),j=l(require("../Spacer/index.js")),G=l(require("gsap")),N=require("@payloadcms/richtext-lexical/html"),k=require("react-responsive"),V=l(require("../../helpers/ScrollLoadVideo.js"));const T=({defaultConverters:r})=>({...r,text:s=>{const{node:t}=s;return t.$&&t.$.color?`<span class="lexical-${t.$.color}">${t.text}</span>`:t.text}}),x=({children:r,spaceY:s,className:t})=>{const o=(0,k.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(q.Container,{spaceY:s,className:(0,u.cn)("!bg-transparent",t),children:(0,e.jsxs)(d.Grid,{children:[!o&&(0,e.jsx)(d.GridItem,{span:1}),(0,e.jsx)(d.GridItem,{span:o?12:10,children:r}),!o&&(0,e.jsx)(d.GridItem,{span:1})]})})},me=a.default.forwardRef(({children:r,id:s,components:t},o)=>{const n=(0,a.useRef)(null);return(0,e.jsxs)("div",{ref:n,className:"relative z-10",children:[(0,e.jsx)(e.Fragment,{children:r}),(0,e.jsx)(e.Fragment,{children:t?.map(i=>{switch(i.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(x,{spaceY:"none",children:(0,e.jsx)(F.default,{data:i,style:i?.style})})});case"ipc-member-equity":return(0,e.jsx)("div",{className:"relative z-20 w-full bg-transparent",children:(0,e.jsx)(x,{spaceY:"none",children:(0,e.jsx)(I.default,{data:i,className:"w-full",style:i?.style})})});case"ipc-spacer":return(0,e.jsx)(j.default,{data:i,style:i?.style,className:"!bg-transparent"});default:return null}})})]})}),ue=(0,a.forwardRef)(({className:r="",wrapperClassName:s="",id:t,data:{title:o,videoTitle:n,mobVideo:i,mobImg:f,img:y,isYouTube:Q,youtubePcId:M,youtubeMobileId:O,video:b,theme:R,shape:W,components:_}},ve)=>{const H=(0,a.useRef)(null),w=(0,a.useRef)(null),{ref:A,inView:p}=(0,P.useInView)(),[be,J]=(0,a.useState)(0),[z,K]=(0,a.useState)(!1),[U,X]=(0,a.useState)(!1),Z=(0,a.useRef)(null),D=typeof o=="string"?o:o&&(0,N.convertLexicalToHTML)({data:o,converters:T});typeof n=="string"||n&&(0,N.convertLexicalToHTML)({data:n,converters:T});const[ee,te]=(0,a.useState)(0),[c,re]=(0,a.useState)(!1),C=(0,k.useMediaQuery)({query:"(max-width: 768px)"});(0,a.useEffect)(()=>{re(C)},[C]);const g=(0,L.debounce)(()=>{if(w.current){const h=w.current.getBoundingClientRect(),m=c?window.screen.height:window.innerHeight,ae=window.scrollY||window.pageYOffset,se=h.bottom+ae,E=document.documentElement.scrollHeight-se;te(E>m?m:E),J(m)}},2e3);return(0,a.useEffect)(()=>{p&&!z&&(H.current?.play(),K(!0))},[p,z]),(0,a.useEffect)(()=>(g(),window.addEventListener("resize",g),()=>{window.removeEventListener("resize",g)}),[]),(0,a.useEffect)(()=>{function h(){const m=c?window.screen.height:window.innerHeight;G.default.timeline({scrollTrigger:{trigger:`#${t}`,start:"top top",end:`top+=${m*1.8}px bottom`,scrub:.5}}).from(`#${t} .media-content`,{top:"50%",transform:"translate(-50%, -50%)"}).to(`.${t} .sticky-cover`,{backdropFilter:"blur(8px)",duration:.4}).to(`#${t} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")}p&&h()},[p]),(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{id:t,className:(0,u.cn)("relative z-20 h-screen w-full",r,{"aiui-dark":R==="dark","rounded-box":W==="rounded"}),ref:Z,children:(0,e.jsx)("div",{ref:A,className:"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2 antialiased",style:{willChange:"transform",contain:"paint"},children:(0,e.jsx)(x,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)(B.default,{className:"sticky-title antialiased",data:{title:D||"",theme:R}})})})}),(0,e.jsxs)("div",{ref:w,style:{marginBottom:`-${ee}px`,zIndex:p?2:1},className:(0,u.cn)(t,"relative mt-[-200vh]",s),children:[(0,e.jsx)("div",{className:"sticky top-0 ",children:(0,e.jsxs)("div",{className:(0,u.cn)("media-cover","relative h-screen w-full"),children:[Q?(0,e.jsx)(Y.YouTubePlayer,{youTubeId:c&&O||M}):b?.url&&(0,e.jsx)(V.default,{videoRef:H,poster:c&&f?.url?f?.url:y?.url,src:c&&i?.url?i?.url:b?.url,className:"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]",videoClassName:" object-cover object-[82%]",muted:!0,loop:!1,playsInline:!0,autoplay:!1,onEnded:()=>{X(!0)}}),y?.url&&(!b?.url||U)&&(0,e.jsx)("img",{src:c&&f?.url?f?.url:y?.url,alt:y?.alt,className:"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]",loading:"lazy"}),(0,e.jsx)("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full",style:{backdropFilter:"blur(0px)",WebkitBackdropFilter:"blur(0px)",willChange:"backdrop-filter"}})]})}),(0,e.jsx)("div",{className:"relative h-screen w-full"}),(0,e.jsx)(me,{components:_}),(0,e.jsx)("div",{className:"relative h-screen w-full"})]})]})});var fe=(0,$.withLayout)(ue);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/MediaPlayerSticky/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerSticky/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect, forwardRef } from 'react'\nimport { debounce } from 'es-toolkit'\nimport { useInView } from 'react-intersection-observer'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { YouTubePlayer } from '../VideoModal/YouTubePlayer.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport Spacer from '../Spacer/index.js'\nimport gsap from 'gsap'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\n\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\nconst SubContainer = ({\n  children,\n  spaceY,\n  className,\n}: {\n  children: React.ReactNode\n  spaceY?: string\n  className?: string\n}) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  return (\n    <Container spaceY={spaceY} className={cn('!bg-transparent', className)}>\n      <Grid>\n        {!isMobile && <GridItem span={1} />}\n        <GridItem span={isMobile ? 12 : 10}>{children}</GridItem>\n        {!isMobile && <GridItem span={1} />}\n      </Grid>\n    </Container>\n  )\n}\n\nconst SubBox = React.forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  {\n    children?: React.ReactNode\n    id?: string\n    components?: MediaPlayerComponent[]\n  }\n>(({ children, id, components }, ref) => {\n  const mediaPlayerStickyRef = useRef<HTMLDivElement>(null)\n\n  return (\n    <div ref={mediaPlayerStickyRef} className=\"relative z-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"relative z-20 bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <BrandEquity data={componentData} style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"relative z-20 w-full bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <MemberEquity data={componentData} className=\"w-full\" style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-spacer': {\n              return <Spacer data={componentData} style={componentData?.style} className=\"!bg-transparent\" />\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n})\n\nconst MediaPlayerSticky = forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  MediaPlayerBaseProps\n>(\n  (\n    {\n      className = '',\n      wrapperClassName = '',\n      id,\n      data: {\n        title,\n        videoTitle,\n        mobVideo,\n        mobImg,\n        img,\n        isYouTube,\n        youtubePcId,\n        youtubeMobileId,\n        video,\n        theme,\n        shape,\n        components,\n      },\n    },\n    ref\n  ) => {\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const boxRef = useRef<HTMLDivElement>(null)\n    const { ref: inViewRef, inView } = useInView()\n    const [screenHeight, setScreenHeight] = useState(0)\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [isEntered, setIsEntered] = useState(false)\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    typeof videoTitle === 'string'\n      ? videoTitle\n      : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    const [btb, setbtb] = useState(0)\n    const [isMobile, setIsMobile] = useState(false)\n    const mediaQuery = useMediaQuery({ query: '(max-width: 768px)' })\n\n    useEffect(() => {\n      setIsMobile(mediaQuery)\n    }, [mediaQuery])\n\n    const debouncedHandleResize = debounce(() => {\n      if (boxRef.current) {\n        const rect = boxRef.current.getBoundingClientRect()\n        const screenHeight = isMobile ? window.screen.height : window.innerHeight\n        const scrollTop = window.scrollY || window.pageYOffset\n        const elementBottomToPageTop = rect.bottom + scrollTop\n        const pageHeight = document.documentElement.scrollHeight\n        const distanceToPageBottom = pageHeight - elementBottomToPageTop\n        setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n        setScreenHeight(screenHeight)\n      }\n    }, 2000)\n\n    useEffect(() => {\n      if (inView && !isPlaying) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      }\n    }, [inView, isPlaying])\n\n    useEffect(() => {\n      debouncedHandleResize()\n      window.addEventListener('resize', debouncedHandleResize)\n      return () => {\n        window.removeEventListener('resize', debouncedHandleResize)\n      }\n    }, [])\n\n    useEffect(() => {\n      function gsapResize() {\n        const height = isMobile ? window.screen.height : window.innerHeight\n        gsap\n          .timeline({\n            scrollTrigger: {\n              trigger: `#${id}`,\n              start: 'top top',\n              end: `top+=${height * 1.8}px bottom`,\n              scrub: 0.5,\n            },\n          })\n          .from(`#${id} .media-content`, { top: '50%', transform: 'translate(-50%, -50%)' })\n          .to(`.${id} .sticky-cover`, {\n            backdropFilter: 'blur(8px)',\n            duration: 0.4,\n          })\n          .to(\n            `#${id} .media-content`,\n            {\n              top: '100%',\n              transform: 'translate(-50%, -100%)',\n              duration: 1,\n            },\n            '<'\n          )\n      }\n      if (inView) {\n        gsapResize()\n      }\n    }, [inView])\n\n    return (\n      <>\n        <div\n          id={id}\n          className={cn('relative z-20 h-screen w-full', className, {\n            'aiui-dark': theme === 'dark',\n            'rounded-box': shape === 'rounded',\n          })}\n          ref={wrapperRef}\n        >\n          <div\n            ref={inViewRef}\n            className=\"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2 antialiased\"\n            style={{ willChange: 'transform', contain: 'paint' }}\n          >\n            <SubContainer spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n              <Slogan className=\"sticky-title antialiased\" data={{ title: title_html || '', theme }} />\n            </SubContainer>\n          </div>\n        </div>\n\n        <div\n          ref={boxRef}\n          style={{ marginBottom: `-${btb}px`, zIndex: inView ? 2 : 1 }}\n          className={cn(id, 'relative mt-[-200vh]', wrapperClassName)}\n        >\n          <div className=\"sticky top-0 \">\n            <div className={cn('media-cover', 'relative h-screen w-full')}>\n              {isYouTube ? (\n                <YouTubePlayer youTubeId={isMobile ? youtubeMobileId || youtubePcId : youtubePcId} />\n              ) : (\n                video?.url && (\n                  <ScrollLoadVideo\n                    videoRef={videoRef}\n                    poster={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                    src={isMobile && mobVideo?.url ? mobVideo?.url : video?.url}\n                    className=\"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]\"\n                    videoClassName=\" object-cover object-[82%]\"\n                    muted\n                    loop={false}\n                    playsInline\n                    onEnded={() => {\n                      setIsEntered(true)\n                    }}\n                  />\n                )\n              )}\n              {img?.url && (!video?.url || isEntered) && (\n                <img\n                  src={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                  alt={img?.alt}\n                  className=\"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]\"\n                  loading=\"lazy\"\n                />\n              )}\n              <div\n                className=\"sticky-cover absolute left-0 top-0 z-10 size-full\"\n                style={{\n                  backdropFilter: 'blur(0px)',\n                  WebkitBackdropFilter: 'blur(0px)',\n                  willChange: 'backdrop-filter',\n                }}\n              />\n            </div>\n          </div>\n\n          <div className=\"relative h-screen w-full\" />\n          <SubBox components={components}></SubBox>\n          <div className=\"relative h-screen w-full\" />\n        </div>\n      </>\n    )\n  }\n)\n\nexport default withLayout(MediaPlayerSticky)\n"],
-  "mappings": "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",
-  "names": ["MediaPlayerSticky_exports", "__export", "MediaPlayerSticky_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_es_toolkit", "import_react_intersection_observer", "import_utils", "import_Styles", "import_Slogan", "import_YouTubePlayer", "import_gird", "import_container", "import_BrandEquity", "import_MemberEquity", "import_Spacer", "import_gsap", "import_html", "import_react_responsive", "import_ScrollLoadVideo", "htmlConverters", "defaultConverters", "args", "node", "SubContainer", "children", "spaceY", "className", "isMobile", "SubBox", "React", "id", "components", "ref", "mediaPlayerStickyRef", "componentData", "BrandEquity", "MemberEquity", "Spacer", "MediaPlayerSticky", "wrapperClassName", "title", "videoTitle", "mobVideo", "mobImg", "img", "isYouTube", "youtubePcId", "youtubeMobileId", "video", "theme", "shape", "videoRef", "boxRef", "inViewRef", "inView", "screenHeight", "setScreenHeight", "isPlaying", "setIsPlaying", "isEntered", "setIsEntered", "wrapperRef", "title_html", "btb", "setbtb", "setIsMobile", "mediaQuery", "debouncedHandleResize", "rect", "scrollTop", "elementBottomToPageTop", "distanceToPageBottom", "gsapResize", "height", "gsap", "Slogan", "ScrollLoadVideo"]
+  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect, forwardRef } from 'react'\nimport { debounce } from 'es-toolkit'\nimport { useInView } from 'react-intersection-observer'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { YouTubePlayer } from '../VideoModal/YouTubePlayer.js'\nimport { Grid, GridItem } from '../../components/grid.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport Spacer from '../Spacer/index.js'\nimport gsap from 'gsap'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\n\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\nconst SubContainer = ({\n  children,\n  spaceY,\n  className,\n}: {\n  children: React.ReactNode\n  spaceY?: string\n  className?: string\n}) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  return (\n    <Container spaceY={spaceY} className={cn('!bg-transparent', className)}>\n      <Grid>\n        {!isMobile && <GridItem span={1} />}\n        <GridItem span={isMobile ? 12 : 10}>{children}</GridItem>\n        {!isMobile && <GridItem span={1} />}\n      </Grid>\n    </Container>\n  )\n}\n\nconst SubBox = React.forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  {\n    children?: React.ReactNode\n    id?: string\n    components?: MediaPlayerComponent[]\n  }\n>(({ children, id, components }, ref) => {\n  const mediaPlayerStickyRef = useRef<HTMLDivElement>(null)\n\n  return (\n    <div ref={mediaPlayerStickyRef} className=\"relative z-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"relative z-20 bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <BrandEquity data={componentData} style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"relative z-20 w-full bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <MemberEquity data={componentData} className=\"w-full\" style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-spacer': {\n              return <Spacer data={componentData} style={componentData?.style} className=\"!bg-transparent\" />\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n})\n\nconst MediaPlayerSticky = forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  MediaPlayerBaseProps\n>(\n  (\n    {\n      className = '',\n      wrapperClassName = '',\n      id,\n      data: {\n        title,\n        videoTitle,\n        mobVideo,\n        mobImg,\n        img,\n        isYouTube,\n        youtubePcId,\n        youtubeMobileId,\n        video,\n        theme,\n        shape,\n        components,\n      },\n    },\n    ref\n  ) => {\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const boxRef = useRef<HTMLDivElement>(null)\n    const { ref: inViewRef, inView } = useInView()\n    const [screenHeight, setScreenHeight] = useState(0)\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [isEntered, setIsEntered] = useState(false)\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    typeof videoTitle === 'string'\n      ? videoTitle\n      : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    const [btb, setbtb] = useState(0)\n    const [isMobile, setIsMobile] = useState(false)\n    const mediaQuery = useMediaQuery({ query: '(max-width: 768px)' })\n\n    useEffect(() => {\n      setIsMobile(mediaQuery)\n    }, [mediaQuery])\n\n    const debouncedHandleResize = debounce(() => {\n      if (boxRef.current) {\n        const rect = boxRef.current.getBoundingClientRect()\n        const screenHeight = isMobile ? window.screen.height : window.innerHeight\n        const scrollTop = window.scrollY || window.pageYOffset\n        const elementBottomToPageTop = rect.bottom + scrollTop\n        const pageHeight = document.documentElement.scrollHeight\n        const distanceToPageBottom = pageHeight - elementBottomToPageTop\n        setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n        setScreenHeight(screenHeight)\n      }\n    }, 2000)\n\n    useEffect(() => {\n      if (inView && !isPlaying) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      }\n    }, [inView, isPlaying])\n\n    useEffect(() => {\n      debouncedHandleResize()\n      window.addEventListener('resize', debouncedHandleResize)\n      return () => {\n        window.removeEventListener('resize', debouncedHandleResize)\n      }\n    }, [])\n\n    useEffect(() => {\n      function gsapResize() {\n        const height = isMobile ? window.screen.height : window.innerHeight\n        gsap\n          .timeline({\n            scrollTrigger: {\n              trigger: `#${id}`,\n              start: 'top top',\n              end: `top+=${height * 1.8}px bottom`,\n              scrub: 0.5,\n            },\n          })\n          .from(`#${id} .media-content`, { top: '50%', transform: 'translate(-50%, -50%)' })\n          .to(`.${id} .sticky-cover`, {\n            backdropFilter: 'blur(8px)',\n            duration: 0.4,\n          })\n          .to(\n            `#${id} .media-content`,\n            {\n              top: '100%',\n              transform: 'translate(-50%, -100%)',\n              duration: 1,\n            },\n            '<'\n          )\n      }\n      if (inView) {\n        gsapResize()\n      }\n    }, [inView])\n\n    return (\n      <>\n        <div\n          id={id}\n          className={cn('relative z-20 h-screen w-full', className, {\n            'aiui-dark': theme === 'dark',\n            'rounded-box': shape === 'rounded',\n          })}\n          ref={wrapperRef}\n        >\n          <div\n            ref={inViewRef}\n            className=\"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2 antialiased\"\n            style={{ willChange: 'transform', contain: 'paint' }}\n          >\n            <SubContainer spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n              <Slogan className=\"sticky-title antialiased\" data={{ title: title_html || '', theme }} />\n            </SubContainer>\n          </div>\n        </div>\n\n        <div\n          ref={boxRef}\n          style={{ marginBottom: `-${btb}px`, zIndex: inView ? 2 : 1 }}\n          className={cn(id, 'relative mt-[-200vh]', wrapperClassName)}\n        >\n          <div className=\"sticky top-0 \">\n            <div className={cn('media-cover', 'relative h-screen w-full')}>\n              {isYouTube ? (\n                <YouTubePlayer youTubeId={isMobile ? youtubeMobileId || youtubePcId : youtubePcId} />\n              ) : (\n                video?.url && (\n                  <ScrollLoadVideo\n                    videoRef={videoRef}\n                    poster={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                    src={isMobile && mobVideo?.url ? mobVideo?.url : video?.url}\n                    className=\"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]\"\n                    videoClassName=\" object-cover object-[82%]\"\n                    muted\n                    loop={false}\n                    playsInline\n                    autoplay={false}\n                    onEnded={() => {\n                      setIsEntered(true)\n                    }}\n                  />\n                )\n              )}\n              {img?.url && (!video?.url || isEntered) && (\n                <img\n                  src={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                  alt={img?.alt}\n                  className=\"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]\"\n                  loading=\"lazy\"\n                />\n              )}\n              <div\n                className=\"sticky-cover absolute left-0 top-0 z-10 size-full\"\n                style={{\n                  backdropFilter: 'blur(0px)',\n                  WebkitBackdropFilter: 'blur(0px)',\n                  willChange: 'backdrop-filter',\n                }}\n              />\n            </div>\n          </div>\n\n          <div className=\"relative h-screen w-full\" />\n          <SubBox components={components}></SubBox>\n          <div className=\"relative h-screen w-full\" />\n        </div>\n      </>\n    )\n  }\n)\n\nexport default withLayout(MediaPlayerSticky)\n"],
+  "mappings": "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",
+  "names": ["MediaPlayerSticky_exports", "__export", "MediaPlayerSticky_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_es_toolkit", "import_react_intersection_observer", "import_utils", "import_Styles", "import_Slogan", "import_YouTubePlayer", "import_grid", "import_container", "import_BrandEquity", "import_MemberEquity", "import_Spacer", "import_gsap", "import_html", "import_react_responsive", "import_ScrollLoadVideo", "htmlConverters", "defaultConverters", "args", "node", "SubContainer", "children", "spaceY", "className", "isMobile", "SubBox", "React", "id", "components", "ref", "mediaPlayerStickyRef", "componentData", "BrandEquity", "MemberEquity", "Spacer", "MediaPlayerSticky", "wrapperClassName", "title", "videoTitle", "mobVideo", "mobImg", "img", "isYouTube", "youtubePcId", "youtubeMobileId", "video", "theme", "shape", "videoRef", "boxRef", "inViewRef", "inView", "screenHeight", "setScreenHeight", "isPlaying", "setIsPlaying", "isEntered", "setIsEntered", "wrapperRef", "title_html", "btb", "setbtb", "setIsMobile", "mediaQuery", "debouncedHandleResize", "rect", "scrollTop", "elementBottomToPageTop", "distanceToPageBottom", "gsapResize", "height", "gsap", "Slogan", "ScrollLoadVideo"]
 }

package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js

@@ -1,2 +1,2 @@
-"use strict";var Z=Object.create;var V=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var J=Object.getOwnPropertyNames;var K=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var X=(a,l)=>{for(var o in l)V(a,o,{get:l[o],enumerable:!0})},H=(a,l,o,c)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of J(l))!W.call(a,i)&&i!==o&&V(a,i,{get:()=>l[i],enumerable:!(c=F(l,i))||c.enumerable});return a};var P=(a,l,o)=>(o=a!=null?Z(K(a)):{},H(l||!a||!a.__esModule?V(o,"default",{value:a,enumerable:!0}):o,a)),ee=a=>H(V({},"__esModule",{value:!0}),a);var ae={};X(ae,{default:()=>te});module.exports=ee(ae);var e=require("react/jsx-runtime"),r=P(require("react")),D=require("react-responsive"),Q=require("../../shared/Styles.js"),S=P(require("../../components/picture.js")),z=P(require("../../components/button.js")),R=require("../../components/heading.js"),Y=require("../VideoModal/index.js"),N=require("../../components/gird.js"),q=P(require("../Title/index.js")),m=require("../../helpers/utils.js"),C=P(require("../SwiperBox/index.js")),U=require("../../shared/mimeType.js"),g=require("../../components/tabs.js"),A=require("../../hooks/useExposure.js"),L=require("../../shared/trackUrlRef.js"),O=require("../../shared/track.js");const b="image",w="p1_banner",$=({data:a,configuration:l,jIndex:o,spanType:c,title:i,onSecondaryButtonClick:d,onPrimaryButtonClick:x})=>{const[B,k]=(0,r.useState)(!1),T=(0,D.useMediaQuery)({query:"(max-width: 768px)"}),M=(0,r.useRef)(null),I=()=>{if(c)switch(c){case"full":return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case"half":return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case"one-third":return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}else switch(l?.num){case 1:return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case 2:return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case 3:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}};(0,A.useExposure)(M,{componentType:b,componentName:w,position:o,componentTitle:a.title,componentDescription:a.description,navigation:l?.activeTab}),(0,r.useEffect)(()=>{k(T)},[T]);const{theme:G="light",title:h,description:f,imageUrl:n,primaryButton:u,secondaryButton:p,imageMobileUrl:y,blockLink:v,video:t,youtubeId:s,isYouTube:_}=a,E="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return(0,e.jsxs)("div",{className:(0,m.cn)("item-wrapper cursor-pointer","text-info-primary group relative box-border w-full overflow-hidden",I(),{"rounded-2xl":l?.shape==="rounded","aiui-dark":G==="dark","h-[400px]":B},"text-info-primary"),ref:M,children:[(v||p.link)&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,L.trackUrlRef)(v||p.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,"aria-hidden":"true",tabIndex:-1}),(0,e.jsxs)("div",{className:"absolute inset-0",children:[(0,U.isVideo)(n?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:block hidden size-full overflow-hidden object-cover",children:(0,e.jsx)("source",{src:n?.url,type:"video/mp4"})}):(0,e.jsx)(S.default,{source:n?.url,alt:n?.alt||"",className:"tablet:block hidden h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${n?.width}/${n?.height}`}}),(0,U.isVideo)(y?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:hidden block size-full overflow-hidden object-cover",children:(0,e.jsx)("source",{src:y?.url,type:"video/mp4"})}):(0,e.jsx)(S.default,{source:y?.url||n?.url,alt:y?.alt||n?.alt||"",className:"tablet:hidden block h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 object-cover"}),(0,e.jsxs)("div",{className:(0,m.cn)("absolutestyle laptop:p-6 desktop:p-[32px] laptop:gap-4 desktop:gap-6 absolute inset-x-0 bottom-0 z-20 flex w-fit flex-col gap-6 p-4",{"fullstyle laptop:top-1/2 laptop:-translate-y-1/2 laptop:bottom-auto":a?.width==="full"}),children:[(0,e.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,e.jsx)(R.Heading,{size:3,as:"h3",className:"item-title",html:h}),(0,e.jsx)(R.Heading,{as:"h4",className:"item-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-1 text-[14px]",html:f})]}),(0,e.jsxs)("div",{className:"lg-desktop:gap-3 flex gap-2",children:[p&&p.text&&(0,e.jsxs)(z.default,{"aria-label":h??f,className:(0,m.cn)(E,"link-left"),variant:"secondary",as:"a",onClick:()=>{d?.(a)},href:(0,L.trackUrlRef)(p.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}#${p.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:[p.text,(0,e.jsx)("span",{className:"sr-only",children:h??f})]}),u&&u.text&&(0,e.jsx)(z.default,{"aria-label":h??f,className:(0,m.cn)(E,"link-right"),variant:"primary",as:"a",onClick:()=>{x?.(a)},href:(0,L.trackUrlRef)(u.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}#${u.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:u.text})]})]})]}),(0,e.jsx)("div",{children:(0,e.jsx)("div",{className:"laptop:bottom-6 laptop:right-6 absolute bottom-4 right-4 z-20",children:(t?.url||s)&&(0,e.jsx)("button",{onClick:()=>{l?.onVideoPlayBtnClick?.(t?.url||s,_)},className:"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white bg-opacity-20 hover:bg-black/75",children:(0,e.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})})})})]})},j=r.default.forwardRef((a,l)=>{const{onSecondaryButtonClick:o,onPrimaryButtonClick:c}=a,{shape:i,sectionTitle:d,groupByTab:x=!1,items:B=[],carousel:k}=a.data,[T,M]=(0,r.useState)(!1),[I,G]=(0,r.useState)(""),[h,f]=(0,r.useState)(""),n=t=>{switch(t){case"full":return 12;case"half":return 6;case"one-third":return 4}},u=B.map(t=>t.tabName).filter(Boolean).filter((t,s,_)=>_.indexOf(t)===s),p=(t,s)=>{M(!0),s?f?.(t||""):G?.(t||"")},y=(t,s)=>{switch(t){case 1:return 1;case 2:return 2;default:return s?2.3:3}},v=u.map(t=>({tabName:t,items:B.filter(s=>s.tabName===t)})).reduce((t,s)=>(t[s.tabName]=s.items,t),{});return(0,e.jsxs)("section",{"data-ui-component-id":"MultiLayoutGraphicBlock",ref:l,className:(0,m.cn)("multiLayoutGraphicBlock","text-info-primary",a.className),children:[d&&(0,e.jsx)(q.default,{data:{title:d},className:"section-title"}),x?(0,e.jsxs)(g.Tabs,{shape:i,align:"left",defaultValue:(0,m.spaceToHyphen)(u[0]),children:[(0,e.jsx)(g.TabsList,{children:u.map((t,s)=>(0,e.jsx)(g.TabsTrigger,{value:(0,m.spaceToHyphen)(t),onClick:()=>{(0,O.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:b,component_name:w,component_title:d,component_position:1,navigation:t,button_name:t}})},children:t},s))}),u.map((t,s)=>(0,e.jsx)(g.TabsContent,{value:(0,m.spaceToHyphen)(t),className:"desktop:mt-[36px] mt-[24px] w-full",children:(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock1",data:{list:v?.[t]||[],configuration:{shape:i,isTab:x,activeTab:t,title:d,num:v?.[t]?.length||0,onVideoPlayBtnClick:p,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:y(v?.[t]?.length||0,!0)},1024:{spaceBetween:16,freeMode:!1,slidesPerView:y(v?.[t]?.length||0)}}}),k&&k?.items.length>0?(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock2",data:{list:k?.items||[],configuration:{shape:i,isTab:x,onVideoPlayBtnClick:p,title:d,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]})},s))]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(N.Grid,{className:"w-full",children:[B.map((t,s)=>(0,e.jsx)(N.GridItem,{span:n(t.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)($,{data:t,configuration:{shape:i,onVideoPlayBtnClick:p,title:d},jIndex:s,spanType:t.width,onSecondaryButtonClick:o,onPrimaryButtonClick:c})},`${t?.title||""}${s}`)),B.map((t,s)=>(0,e.jsx)(N.GridItem,{span:n("full"),className:"laptop:hidden block",children:(0,e.jsx)($,{data:t,configuration:{shape:i,onVideoPlayBtnClick:p,title:d},jIndex:s,spanType:"full"})},`${t?.title||""}${s}`))]}),k&&k?.items.length>0?(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock3",data:{list:k?.items||[],configuration:{shape:i,onVideoPlayBtnClick:p,title:d,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]}),T&&(0,e.jsx)(Y.VideoModal,{visible:T,youTubeId:h,videoUrl:I,onCloseModal:()=>M(!1)})]})});j.displayName="MultiLayoutGraphicBlock";var te=(0,Q.withLayout)(j);
+"use strict";var Z=Object.create;var V=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var J=Object.getOwnPropertyNames;var K=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var X=(a,l)=>{for(var o in l)V(a,o,{get:l[o],enumerable:!0})},H=(a,l,o,c)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of J(l))!W.call(a,i)&&i!==o&&V(a,i,{get:()=>l[i],enumerable:!(c=F(l,i))||c.enumerable});return a};var P=(a,l,o)=>(o=a!=null?Z(K(a)):{},H(l||!a||!a.__esModule?V(o,"default",{value:a,enumerable:!0}):o,a)),ee=a=>H(V({},"__esModule",{value:!0}),a);var ae={};X(ae,{default:()=>te});module.exports=ee(ae);var e=require("react/jsx-runtime"),r=P(require("react")),D=require("react-responsive"),Q=require("../../shared/Styles.js"),S=P(require("../../components/picture.js")),z=P(require("../../components/button.js")),R=require("../../components/heading.js"),Y=require("../VideoModal/index.js"),N=require("../../components/grid.js"),q=P(require("../Title/index.js")),m=require("../../helpers/utils.js"),C=P(require("../SwiperBox/index.js")),U=require("../../shared/mimeType.js"),g=require("../../components/tabs.js"),A=require("../../hooks/useExposure.js"),L=require("../../shared/trackUrlRef.js"),O=require("../../shared/track.js");const b="image",w="p1_banner",$=({data:a,configuration:l,jIndex:o,spanType:c,title:i,onSecondaryButtonClick:d,onPrimaryButtonClick:x})=>{const[B,k]=(0,r.useState)(!1),T=(0,D.useMediaQuery)({query:"(max-width: 768px)"}),M=(0,r.useRef)(null),I=()=>{if(c)switch(c){case"full":return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case"half":return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case"one-third":return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}else switch(l?.num){case 1:return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case 2:return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case 3:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}};(0,A.useExposure)(M,{componentType:b,componentName:w,position:o,componentTitle:a.title,componentDescription:a.description,navigation:l?.activeTab}),(0,r.useEffect)(()=>{k(T)},[T]);const{theme:G="light",title:h,description:f,imageUrl:n,primaryButton:u,secondaryButton:p,imageMobileUrl:y,blockLink:v,video:t,youtubeId:s,isYouTube:_}=a,E="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return(0,e.jsxs)("div",{className:(0,m.cn)("item-wrapper cursor-pointer","text-info-primary group relative box-border w-full overflow-hidden",I(),{"rounded-2xl":l?.shape==="rounded","aiui-dark":G==="dark","h-[400px]":B},"text-info-primary"),ref:M,children:[(v||p.link)&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,L.trackUrlRef)(v||p.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,"aria-hidden":"true",tabIndex:-1}),(0,e.jsxs)("div",{className:"absolute inset-0",children:[(0,U.isVideo)(n?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:block hidden size-full overflow-hidden object-cover",children:(0,e.jsx)("source",{src:n?.url,type:"video/mp4"})}):(0,e.jsx)(S.default,{source:n?.url,alt:n?.alt||"",className:"tablet:block hidden h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${n?.width}/${n?.height}`}}),(0,U.isVideo)(y?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:hidden block size-full overflow-hidden object-cover",children:(0,e.jsx)("source",{src:y?.url,type:"video/mp4"})}):(0,e.jsx)(S.default,{source:y?.url||n?.url,alt:y?.alt||n?.alt||"",className:"tablet:hidden block h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 object-cover"}),(0,e.jsxs)("div",{className:(0,m.cn)("absolutestyle laptop:p-6 desktop:p-[32px] laptop:gap-4 desktop:gap-6 absolute inset-x-0 bottom-0 z-20 flex w-fit flex-col gap-6 p-4",{"fullstyle laptop:top-1/2 laptop:-translate-y-1/2 laptop:bottom-auto":a?.width==="full"}),children:[(0,e.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,e.jsx)(R.Heading,{size:3,as:"h3",className:"item-title",html:h}),(0,e.jsx)(R.Heading,{as:"h4",className:"item-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-1 text-[14px]",html:f})]}),(0,e.jsxs)("div",{className:"lg-desktop:gap-3 flex gap-2",children:[p&&p.text&&(0,e.jsxs)(z.default,{"aria-label":h??f,className:(0,m.cn)(E,"link-left"),variant:"secondary",as:"a",onClick:()=>{d?.(a)},href:(0,L.trackUrlRef)(p.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}#${p.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:[p.text,(0,e.jsx)("span",{className:"sr-only",children:h??f})]}),u&&u.text&&(0,e.jsx)(z.default,{"aria-label":h??f,className:(0,m.cn)(E,"link-right"),variant:"primary",as:"a",onClick:()=>{x?.(a)},href:(0,L.trackUrlRef)(u.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}#${u.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:u.text})]})]})]}),(0,e.jsx)("div",{children:(0,e.jsx)("div",{className:"laptop:bottom-6 laptop:right-6 absolute bottom-4 right-4 z-20",children:(t?.url||s)&&(0,e.jsx)("button",{onClick:()=>{l?.onVideoPlayBtnClick?.(t?.url||s,_)},className:"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white bg-opacity-20 hover:bg-black/75",children:(0,e.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})})})})]})},j=r.default.forwardRef((a,l)=>{const{onSecondaryButtonClick:o,onPrimaryButtonClick:c}=a,{shape:i,sectionTitle:d,groupByTab:x=!1,items:B=[],carousel:k}=a.data,[T,M]=(0,r.useState)(!1),[I,G]=(0,r.useState)(""),[h,f]=(0,r.useState)(""),n=t=>{switch(t){case"full":return 12;case"half":return 6;case"one-third":return 4}},u=B.map(t=>t.tabName).filter(Boolean).filter((t,s,_)=>_.indexOf(t)===s),p=(t,s)=>{M(!0),s?f?.(t||""):G?.(t||"")},y=(t,s)=>{switch(t){case 1:return 1;case 2:return 2;default:return s?2.3:3}},v=u.map(t=>({tabName:t,items:B.filter(s=>s.tabName===t)})).reduce((t,s)=>(t[s.tabName]=s.items,t),{});return(0,e.jsxs)("section",{"data-ui-component-id":"MultiLayoutGraphicBlock",ref:l,className:(0,m.cn)("multiLayoutGraphicBlock","text-info-primary",a.className),children:[d&&(0,e.jsx)(q.default,{data:{title:d},className:"section-title"}),x?(0,e.jsxs)(g.Tabs,{shape:i,align:"left",defaultValue:(0,m.spaceToHyphen)(u[0]),children:[(0,e.jsx)(g.TabsList,{children:u.map((t,s)=>(0,e.jsx)(g.TabsTrigger,{value:(0,m.spaceToHyphen)(t),onClick:()=>{(0,O.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:b,component_name:w,component_title:d,component_position:1,navigation:t,button_name:t}})},children:t},s))}),u.map((t,s)=>(0,e.jsx)(g.TabsContent,{value:(0,m.spaceToHyphen)(t),className:"desktop:mt-[36px] mt-[24px] w-full",children:(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock1",data:{list:v?.[t]||[],configuration:{shape:i,isTab:x,activeTab:t,title:d,num:v?.[t]?.length||0,onVideoPlayBtnClick:p,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:y(v?.[t]?.length||0,!0)},1024:{spaceBetween:16,freeMode:!1,slidesPerView:y(v?.[t]?.length||0)}}}),k&&k?.items.length>0?(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock2",data:{list:k?.items||[],configuration:{shape:i,isTab:x,onVideoPlayBtnClick:p,title:d,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]})},s))]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(N.Grid,{className:"w-full",children:[B.map((t,s)=>(0,e.jsx)(N.GridItem,{span:n(t.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)($,{data:t,configuration:{shape:i,onVideoPlayBtnClick:p,title:d},jIndex:s,spanType:t.width,onSecondaryButtonClick:o,onPrimaryButtonClick:c})},`${t?.title||""}${s}`)),B.map((t,s)=>(0,e.jsx)(N.GridItem,{span:n("full"),className:"laptop:hidden block",children:(0,e.jsx)($,{data:t,configuration:{shape:i,onVideoPlayBtnClick:p,title:d},jIndex:s,spanType:"full"})},`${t?.title||""}${s}`))]}),k&&k?.items.length>0?(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock3",data:{list:k?.items||[],configuration:{shape:i,onVideoPlayBtnClick:p,title:d,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]}),T&&(0,e.jsx)(Y.VideoModal,{visible:T,youTubeId:h,videoUrl:I,onCloseModal:()=>M(!1)})]})});j.displayName="MultiLayoutGraphicBlock";var te=(0,Q.withLayout)(j);
 //# sourceMappingURL=MultiLayoutGraphicBlock.js.map