npm - @anker-in/headless-ui - Versions diffs - 1.1.9-temp-112711 → 1.1.9-temp-120102 - Mend

@anker-in/headless-ui 1.1.9-temp-112711 → 1.1.9-temp-120102

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (74) hide show

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

@@ -1,2 +1,2 @@
-"use strict";var ae=Object.create;var F=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var oe=Object.getOwnPropertyNames;var ie=Object.getPrototypeOf,re=Object.prototype.hasOwnProperty;var le=(o,t)=>{for(var r in t)F(o,r,{get:t[r],enumerable:!0})},W=(o,t,r,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let u of oe(t))!re.call(o,u)&&u!==r&&F(o,u,{get:()=>t[u],enumerable:!(i=ne(t,u))||i.enumerable});return o};var ce=(o,t,r)=>(r=o!=null?ae(ie(o)):{},W(t||!o||!o.__esModule?F(r,"default",{value:o,enumerable:!0}):r,o)),se=o=>W(F({},"__esModule",{value:!0}),o);var me={};le(me,{default:()=>pe});module.exports=se(me);var e=require("react/jsx-runtime"),a=require("../../../../../components/index.js"),B=require("../../../BizProductProvider.js"),g=require("react"),h=require("../../../utils/index.js"),A=require("../../../../AiuiProvider/index.js"),G=ce(require("decimal.js")),J=require("../../../utils/textFormat.js"),Q=require("../../../../../shared/Styles.js"),H=require("../../../../../components/index.js"),U=require("../../../../../shared/track.js");const de=()=>{const{locale:o="us",copyWriting:t}=(0,A.useAiuiContext)(),{product:r,variant:i,finalPrice:u,comparePrice:f,coupon:N,selectedOptions:p,selectedVariants:v,totalSavings:s,onAddToCart:D,onBuyNow:E,savingDetail:b,checkedBundle:P,joinedRecommendBuyProducts:n,setJoinedRecommendBuyProducts:m,setSavingDetail:j,addToCartLoading:O,buyNowLoading:S,profile:I,addOrder:$,setAddOrder:w}=(0,B.useBizProductContext)(),L=(0,g.useMemo)(()=>r?.payload?.components?.find(l=>l.componentKey==="ProductSummary")?.data||{},[r?.payload]),[z]=v,_=(0,g.useMemo)(()=>{const l=P?.variants.find(k=>k.variant.sku===z?.sku),c=new G.default(z?.price?.amount||0).minus(l?.price||z?.price?.amount).toNumber();let x=new G.default(z?.price?.amount||0);I?.email&&(x=x.minus(b?.member||0));const y=x.minus(b?.coupon).minus(c).toNumber();return Math.floor(y*100)/100},[z,P,I,b?.member,b?.coupon]),{bundleVariant:T,giftVariant:V,exchangeVariant:R}=ue()||{},[d,C]=(0,g.useState)();(0,g.useEffect)(()=>{C({bundle:n.bundle?.value?void 0:T,gift:n.gift?.value?void 0:V,exchange:n.exchange?.value?void 0:R})},[T,V,R,n]);const X=(0,g.useMemo)(()=>{const l=[];return $&&$.forEach((c,x)=>{n[c]?.value&&l.push({type:c,key:`${c}-${x}`})}),l},[$,n]),Y=(0,g.useMemo)(()=>{const l=p?.quantity||"",c=p?.color||p?.colour||p?.couleur||"";return`${l&&c?`${l} | ${c}`:l||c}`},[p?.quantity,p?.color,p?.colour,p?.couleur]),Z=(0,g.useMemo)(()=>{const l=i?.payload?.components?.find(te=>te.componentKey==="ProductSummary")?.data||{},{image_1920:c,image_1440:x,image_1024:y,image_768:k,image_390:ee}=l?.thumbnail||{};return(l?.thumbnail?`${c} 1920, ${x} 1440, ${y} 1024, ${k} 768, ${ee} 390`:i.image?.url)||i.image?.url},[i.image?.url,i?.payload?.components]);return i.availableForSale?(0,e.jsx)("div",{className:"ipc-product-summary laptop:px-16 desktop:px-0 desktop:mt-[96px] lg-desktop:mt-[128px] mt-16",children:(0,e.jsx)("div",{className:"laptop:rounded-2xl bg-[#F5F5F7]",children:(0,e.jsxs)(a.Grid,{className:"tablet:p-8 tablet:!pb-0 px-4 pt-6",children:[(0,e.jsxs)(a.GridItem,{className:"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4",children:[(0,e.jsx)(a.Heading,{className:"lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]",html:L?.readyWant?.replace?.("{title}",r?.title)}),(0,e.jsx)("div",{className:"",children:(0,e.jsx)(a.Picture,{source:Z,className:"lg-desktop:aspect-[644/320]  desktop:aspect-[503/270] laptop:aspect-[332/190] tablet:aspect-[704/380] aspect-[358/190]",imgClassName:"object-cover h-full"})})]}),(0,e.jsxs)(a.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",children:[(0,e.jsxs)("div",{children:[(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,e.jsx)(H.ExposureDetector,{exposureKey:"listing_selector",onExposure:()=>{(0,U.gaTrack)({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${i.sku}`,component_type:"image",component_name:"listing_selector",position:1}})},children:(0,e.jsxs)("div",{className:"flex items-center justify-between gap-6",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(a.Picture,{source:i.image?.url||r?.images?.[0]?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),(0,e.jsxs)("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[(0,e.jsx)(a.Text,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:r.title}),(0,e.jsx)(a.Text,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:Y})]})]}),(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{className:"desktop:text-2xl text-base font-bold",html:(0,h.formatPrice)({amount:_,currencyCode:i.price.currencyCode,locale:o})}),_<i?.price?.amount&&(0,e.jsx)(a.Text,{className:"desktop:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:i?.price?.amount,currencyCode:i.price.currencyCode,locale:o})})]})]})}),X.map(({type:l,key:c})=>l==="gift"&&n?.gift?.value?(0,e.jsx)(K,{giftOperation:x=>{m?.({...n,gift:{value:void 0,canOperate:!0}}),C?.({...d,gift:x}),w?.(y=>y.filter(k=>k!=="gift"))},status:!!n?.gift,gift:n?.gift?.value,canOperate:n?.gift?.canOperate},c):l==="bundle"&&n?.bundle?.value?(0,e.jsx)(q,{bundleOperation:x=>{m?.({...n,bundle:{value:void 0,canOperate:!0}}),C?.({...d,bundle:x}),w?.(y=>y.filter(k=>k!=="bundle"))},status:!!n?.bundle,bundleListItem:n?.bundle?.value,canOperate:n?.bundle?.canOperate},c):l==="exchange"&&n?.exchange?.value?(0,e.jsx)(M,{exchangeOperation:x=>{m?.({...n,exchange:{value:void 0,canOperate:!0}}),C?.({...d,exchange:x}),w?.(y=>y.filter(k=>k!=="exchange"))},status:!!n?.exchange,canOperate:n?.exchange?.canOperate,exchange:n?.exchange?.value},c):null)]}),(d?.bundle||d?.gift||d?.exchange)&&(0,e.jsxs)("div",{className:"desktop:mt-8 mt-6",children:[(0,e.jsx)(a.Text,{className:"desktop:text-[18px] text-sm font-bold",html:L?.recommendBuy}),(0,e.jsxs)("div",{className:"desktop:gap-4 mt-4 flex flex-col gap-6",children:[d?.exchange&&(0,e.jsx)(M,{exchangeOperation:l=>{m?.({...n,exchange:{value:l,canOperate:!0}}),C?.({...d,exchange:void 0}),w?.(c=>[...c,"exchange"])},canOperate:n?.exchange?.canOperate,status:!d?.exchange,exchange:d?.exchange}),d?.bundle&&(0,e.jsx)(q,{bundleOperation:l=>{j?.({...b,exchangePurchase:0}),m?.({...n,bundle:{value:l,canOperate:!0}}),C?.({...d,bundle:void 0}),w?.(c=>[...c,"bundle"])},canOperate:n?.bundle?.canOperate,status:!d?.bundle,bundleListItem:d?.bundle}),d?.gift&&(0,e.jsx)(K,{giftOperation:l=>{m?.({...n,gift:{value:l,canOperate:!0}}),C?.({...d,gift:void 0}),w?.(c=>[...c,"gift"])},canOperate:n?.gift?.canOperate,status:!d?.gift,gift:d?.gift})]})]})]}),(0,e.jsxs)("div",{className:"text-right",children:[(0,e.jsx)(a.Text,{className:"laptop:text-xl desktop:text-2xl text-right font-bold",html:`${(0,J.replaceTemplate)(t?.totalPrice||"",{amount:(0,h.formatPrice)({amount:Math.floor(u*100)/100,currencyCode:i.price.currencyCode,locale:o})})}`}),s>0&&(0,e.jsx)(a.Text,{className:"laptop:text-xl desktop:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:f,currencyCode:i.price.currencyCode,locale:o})}),(0,e.jsxs)("div",{className:"mt-4 flex justify-end gap-3",children:[(0,e.jsx)(a.Button,{size:"lg",variant:"secondary",loading:O,className:"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2",onClick:()=>D?.(),children:t?.addToCart}),(0,e.jsx)(a.Button,{size:"lg",loading:S,variant:"primary",className:"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2",onClick:()=>E?.(),children:t?.shopNow})]})]})]})]})})}):null},ue=()=>{const{bundle:o,variant:t,checkedBundle:r,freeGift:i,checkedGift:u,exchangePurchase:f,checkedExchangePurchase:N}=(0,B.useBizProductContext)();let p,v,s;const{bundleList:D}=o||{},{giftList:E=[]}=i||{},{giftList:b=[]}=f||{},P=D?.filter(O=>O.variants.slice(1,O.variants.length).every(S=>S.variant.availableForSale))||[],[n]=P;p=r||n;const[m]=E?.filter(O=>O.availableForSale)??[];v=u||m;const[j]=b?.filter(O=>O.availableForSale)??[];return s=N||j,{bundleVariant:p,giftVariant:v,exchangeVariant:s}},q=({bundleOperation:o,bundleListItem:t,canOperate:r,status:i})=>{const{locale:u="us",copyWriting:f}=(0,A.useAiuiContext)(),{variant:N,setCheckedBundle:p}=(0,B.useBizProductContext)(),v=t?.variants.filter(s=>s.variant.sku!==N.sku);return(0,e.jsx)("div",{className:"",children:v?.map(s=>(0,e.jsxs)("div",{className:"flex items-center justify-between gap-4",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(a.Picture,{source:s?.variant?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),(0,e.jsx)("div",{className:"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]",children:(0,e.jsx)(a.Text,{className:"desktop:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold",html:s.variant.product.title})})]}),(0,e.jsxs)("div",{className:"flex flex-col items-end justify-center gap-1",children:[!!t&&(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{className:"desktop:text-2xl text-base font-bold",html:(0,h.formatPrice)({amount:s?.price||0,locale:u,currencyCode:s.variant?.price?.currencyCode||""})}),s.price<s.variant.price.amount&&(0,e.jsx)(a.Text,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:s.variant.price.amount||0,locale:u,currencyCode:s.variant?.price?.currencyCode||""})})]}),r&&(0,e.jsx)(a.Button,{size:"icon",variant:"link",onClick:()=>{p?.(i?void 0:t),o?.(t)},className:"size-auto shrink-0 underline",children:i?f?.remove:f?.add})]})]},s.variant.id))})},K=({giftOperation:o,gift:t,status:r,canOperate:i})=>{const{locale:u="us",copyWriting:f}=(0,A.useAiuiContext)(),{freeGift:N,setCheckedGift:p}=(0,B.useBizProductContext)(),{freeLabel:v}=N||{},{options:s}=t||{},D=(0,g.useMemo)(()=>{const E=s?.find(m=>m.name==="color"||m.name==="colour"||m.name==="couleur")||{},b=s?.find(m=>m.name==="quantity")||{},P=E?E.values?.[0]?.label:"",n=b?b.values?.[0]?.label:"";return`${P&&n?n+" | "+P:n||P} | ${v}`},[v,s]);return(0,e.jsxs)("div",{className:"flex items-center justify-between gap-6",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(a.Picture,{source:t?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),(0,e.jsxs)("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[(0,e.jsx)(a.Text,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:t?.product?.title}),(0,e.jsx)(a.Text,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:D})]})]}),(0,e.jsxs)("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!t&&(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{className:"desktop:text-2xl text-base font-bold",html:v}),(0,e.jsx)(a.Text,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:t.price.amount,locale:u,currencyCode:t.price.currencyCode})})]}),i&&(0,e.jsx)(a.Button,{size:"icon",variant:"link",onClick:()=>{p?.(r?void 0:t),o(t)},className:"size-auto shrink-0 underline",children:r?f?.remove:f?.add})]})]})},M=({exchangeOperation:o,exchange:t,canOperate:r,status:i})=>{const{locale:u="us",copyWriting:f}=(0,A.useAiuiContext)(),{setCheckedExchangePurchase:N}=(0,B.useBizProductContext)();return(0,e.jsxs)("div",{className:"flex items-center justify-between gap-6",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(a.Picture,{source:t?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),(0,e.jsxs)("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[(0,e.jsx)(a.Text,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:t?.product?.title}),(0,e.jsx)(a.Text,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]"})]})]}),(0,e.jsxs)("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!t&&(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{className:"desktop:text-2xl text-base font-bold",html:(0,h.formatPrice)({amount:t.finalPrice?.amount||0,locale:u,currencyCode:t.price.currencyCode})}),(0,e.jsx)(a.Text,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:t.price?.amount||0,locale:u,currencyCode:t.price.currencyCode})})]}),r&&(0,e.jsx)(a.Button,{size:"icon",variant:"link",onClick:()=>{N?.(i?void 0:t),o(t)},className:"size-auto shrink-0 underline",children:i?f?.remove:f?.add})]})]})};var pe=(0,Q.withLayout)(de);
+"use strict";var ae=Object.create;var F=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var oe=Object.getOwnPropertyNames;var le=Object.getPrototypeOf,ie=Object.prototype.hasOwnProperty;var re=(o,t)=>{for(var i in t)F(o,i,{get:t[i],enumerable:!0})},W=(o,t,i,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of oe(t))!ie.call(o,p)&&p!==i&&F(o,p,{get:()=>t[p],enumerable:!(l=ne(t,p))||l.enumerable});return o};var ce=(o,t,i)=>(i=o!=null?ae(le(o)):{},W(t||!o||!o.__esModule?F(i,"default",{value:o,enumerable:!0}):i,o)),se=o=>W(F({},"__esModule",{value:!0}),o);var me={};re(me,{default:()=>ue});module.exports=se(me);var e=require("react/jsx-runtime"),a=require("../../../../../components/index.js"),B=require("../../../BizProductProvider.js"),g=require("react"),h=require("../../../utils/index.js"),A=require("../../../../AiuiProvider/index.js"),G=ce(require("decimal.js")),J=require("../../../utils/textFormat.js"),Q=require("../../../../../shared/Styles.js"),H=require("../../../../../components/index.js"),U=require("../../../../../shared/track.js");const de=()=>{const{locale:o="us",copyWriting:t}=(0,A.useAiuiContext)(),{product:i,variant:l,finalPrice:p,comparePrice:f,coupon:P,selectedOptions:u,selectedVariants:v,totalSavings:s,onAddToCart:D,onBuyNow:E,savingDetail:b,checkedBundle:k,joinedRecommendBuyProducts:n,setJoinedRecommendBuyProducts:m,setSavingDetail:j,addToCartLoading:O,buyNowLoading:S,profile:I,addOrder:$,setAddOrder:w}=(0,B.useBizProductContext)(),L=(0,g.useMemo)(()=>i?.payload?.components?.find(r=>r.componentKey==="ProductSummary")?.data||{},[i?.payload]),[z]=v,_=(0,g.useMemo)(()=>{const r=k?.variants.find(N=>N.variant.sku===z?.sku),c=new G.default(z?.price?.amount||0).minus(r?.price||z?.price?.amount).toNumber();let x=new G.default(z?.price?.amount||0);I?.email&&(x=x.minus(b?.member||0));const y=x.minus(b?.coupon).minus(c).toNumber();return Math.floor(y*100)/100},[z,k,I,b?.member,b?.coupon]),{bundleVariant:T,giftVariant:V,exchangeVariant:R}=pe()||{},[d,C]=(0,g.useState)();(0,g.useEffect)(()=>{C({bundle:n.bundle?.value?void 0:T,gift:n.gift?.value?void 0:V,exchange:n.exchange?.value?void 0:R})},[T,V,R,n]);const X=(0,g.useMemo)(()=>{const r=[];return $&&$.forEach((c,x)=>{n[c]?.value&&r.push({type:c,key:`${c}-${x}`})}),r},[$,n]),Y=(0,g.useMemo)(()=>{const r=u?.quantity||"",c=u?.color||u?.colour||u?.couleur||"";return`${r&&c?`${r} | ${c}`:r||c}`},[u?.quantity,u?.color,u?.colour,u?.couleur]),Z=(0,g.useMemo)(()=>{const r=l?.payload?.components?.find(te=>te.componentKey==="ProductSummary")?.data||{},{image_1920:c,image_1440:x,image_1024:y,image_768:N,image_390:ee}=r?.thumbnail||{};return(r?.thumbnail?`${c} 1920, ${x} 1440, ${y} 1024, ${N} 768, ${ee} 390`:l.image?.url)||l.image?.url},[l.image?.url,l?.payload?.components]);return l.availableForSale?(0,e.jsx)("div",{className:"ipc-product-summary laptop:px-16 laptop-md:px-0 laptop-md:mt-[96px] lg-desktop:mt-[128px] mt-16",children:(0,e.jsx)("div",{className:"laptop:rounded-2xl bg-[#F5F5F7]",children:(0,e.jsxs)(a.Grid,{className:"tablet:p-8 tablet:!pb-0 px-4 pt-6",children:[(0,e.jsxs)(a.GridItem,{className:"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4",children:[(0,e.jsx)(a.Heading,{className:"lg-desktop:text-[48px] laptop:text-[32px] laptop-md:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]",html:L?.readyWant?.replace?.("{title}",i?.title)}),(0,e.jsx)("div",{className:"",children:(0,e.jsx)(a.Picture,{source:Z,className:"lg-desktop:aspect-[644/320]  laptop-md:aspect-[503/270] laptop:aspect-[332/190] tablet:aspect-[704/380] aspect-[358/190]",imgClassName:"object-cover h-full"})})]}),(0,e.jsxs)(a.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",children:[(0,e.jsxs)("div",{children:[(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,e.jsx)(H.ExposureDetector,{exposureKey:"listing_selector",onExposure:()=>{(0,U.gaTrack)({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${l.sku}`,component_type:"image",component_name:"listing_selector",position:1}})},children:(0,e.jsxs)("div",{className:"flex items-center justify-between gap-6",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(a.Picture,{source:l.image?.url||i?.images?.[0]?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),(0,e.jsxs)("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[(0,e.jsx)(a.Text,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:i.title}),(0,e.jsx)(a.Text,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:Y})]})]}),(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{className:"laptop-md:text-2xl text-base font-bold",html:(0,h.formatPrice)({amount:_,currencyCode:l.price.currencyCode,locale:o})}),_<l?.price?.amount&&(0,e.jsx)(a.Text,{className:"laptop-md:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:l?.price?.amount,currencyCode:l.price.currencyCode,locale:o})})]})]})}),X.map(({type:r,key:c})=>r==="gift"&&n?.gift?.value?(0,e.jsx)(K,{giftOperation:x=>{m?.({...n,gift:{value:void 0,canOperate:!0}}),C?.({...d,gift:x}),w?.(y=>y.filter(N=>N!=="gift"))},status:!!n?.gift,gift:n?.gift?.value,canOperate:n?.gift?.canOperate},c):r==="bundle"&&n?.bundle?.value?(0,e.jsx)(q,{bundleOperation:x=>{m?.({...n,bundle:{value:void 0,canOperate:!0}}),C?.({...d,bundle:x}),w?.(y=>y.filter(N=>N!=="bundle"))},status:!!n?.bundle,bundleListItem:n?.bundle?.value,canOperate:n?.bundle?.canOperate},c):r==="exchange"&&n?.exchange?.value?(0,e.jsx)(M,{exchangeOperation:x=>{m?.({...n,exchange:{value:void 0,canOperate:!0}}),C?.({...d,exchange:x}),w?.(y=>y.filter(N=>N!=="exchange"))},status:!!n?.exchange,canOperate:n?.exchange?.canOperate,exchange:n?.exchange?.value},c):null)]}),(d?.bundle||d?.gift||d?.exchange)&&(0,e.jsxs)("div",{className:"laptop-md:mt-8 mt-6",children:[(0,e.jsx)(a.Text,{className:"laptop-md:text-[18px] text-sm font-bold",html:L?.recommendBuy}),(0,e.jsxs)("div",{className:"laptop-md:gap-4 mt-4 flex flex-col gap-6",children:[d?.exchange&&(0,e.jsx)(M,{exchangeOperation:r=>{m?.({...n,exchange:{value:r,canOperate:!0}}),C?.({...d,exchange:void 0}),w?.(c=>[...c,"exchange"])},canOperate:n?.exchange?.canOperate,status:!d?.exchange,exchange:d?.exchange}),d?.bundle&&(0,e.jsx)(q,{bundleOperation:r=>{j?.({...b,exchangePurchase:0}),m?.({...n,bundle:{value:r,canOperate:!0}}),C?.({...d,bundle:void 0}),w?.(c=>[...c,"bundle"])},canOperate:n?.bundle?.canOperate,status:!d?.bundle,bundleListItem:d?.bundle}),d?.gift&&(0,e.jsx)(K,{giftOperation:r=>{m?.({...n,gift:{value:r,canOperate:!0}}),C?.({...d,gift:void 0}),w?.(c=>[...c,"gift"])},canOperate:n?.gift?.canOperate,status:!d?.gift,gift:d?.gift})]})]})]}),(0,e.jsxs)("div",{className:"text-right",children:[(0,e.jsx)(a.Text,{className:"laptop:text-xl laptop-md:text-2xl text-right font-bold",html:`${(0,J.replaceTemplate)(t?.totalPrice||"",{amount:(0,h.formatPrice)({amount:Math.floor(p*100)/100,currencyCode:l.price.currencyCode,locale:o})})}`}),s>0&&(0,e.jsx)(a.Text,{className:"laptop:text-xl laptop-md:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:f,currencyCode:l.price.currencyCode,locale:o})}),(0,e.jsxs)("div",{className:"mt-4 flex justify-end gap-3",children:[(0,e.jsx)(a.Button,{size:"lg",variant:"secondary",loading:O,className:"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2",onClick:()=>D?.(),children:t?.addToCart}),(0,e.jsx)(a.Button,{size:"lg",loading:S,variant:"primary",className:"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2",onClick:()=>E?.(),children:t?.shopNow})]})]})]})]})})}):null},pe=()=>{const{bundle:o,variant:t,checkedBundle:i,freeGift:l,checkedGift:p,exchangePurchase:f,checkedExchangePurchase:P}=(0,B.useBizProductContext)();let u,v,s;const{bundleList:D}=o||{},{giftList:E=[]}=l||{},{giftList:b=[]}=f||{},k=D?.filter(O=>O.variants.slice(1,O.variants.length).every(S=>S.variant.availableForSale))||[],[n]=k;u=i||n;const[m]=E?.filter(O=>O.availableForSale)??[];v=p||m;const[j]=b?.filter(O=>O.availableForSale)??[];return s=P||j,{bundleVariant:u,giftVariant:v,exchangeVariant:s}},q=({bundleOperation:o,bundleListItem:t,canOperate:i,status:l})=>{const{locale:p="us",copyWriting:f}=(0,A.useAiuiContext)(),{variant:P,setCheckedBundle:u}=(0,B.useBizProductContext)(),v=t?.variants.filter(s=>s.variant.sku!==P.sku);return(0,e.jsx)("div",{className:"",children:v?.map(s=>(0,e.jsxs)("div",{className:"flex items-center justify-between gap-4",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(a.Picture,{source:s?.variant?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),(0,e.jsx)("div",{className:"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]",children:(0,e.jsx)(a.Text,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold",html:s.variant.product.title})})]}),(0,e.jsxs)("div",{className:"flex flex-col items-end justify-center gap-1",children:[!!t&&(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{className:"laptop-md:text-2xl text-base font-bold",html:(0,h.formatPrice)({amount:s?.price||0,locale:p,currencyCode:s.variant?.price?.currencyCode||""})}),s.price<s.variant.price.amount&&(0,e.jsx)(a.Text,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:s.variant.price.amount||0,locale:p,currencyCode:s.variant?.price?.currencyCode||""})})]}),i&&(0,e.jsx)(a.Button,{size:"icon",variant:"link",onClick:()=>{u?.(l?void 0:t),o?.(t)},className:"size-auto shrink-0 underline",children:l?f?.remove:f?.add})]})]},s.variant.id))})},K=({giftOperation:o,gift:t,status:i,canOperate:l})=>{const{locale:p="us",copyWriting:f}=(0,A.useAiuiContext)(),{freeGift:P,setCheckedGift:u}=(0,B.useBizProductContext)(),{freeLabel:v}=P||{},{options:s}=t||{},D=(0,g.useMemo)(()=>{const E=s?.find(m=>m.name==="color"||m.name==="colour"||m.name==="couleur")||{},b=s?.find(m=>m.name==="quantity")||{},k=E?E.values?.[0]?.label:"",n=b?b.values?.[0]?.label:"";return`${k&&n?n+" | "+k:n||k} | ${v}`},[v,s]);return(0,e.jsxs)("div",{className:"flex items-center justify-between gap-6",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(a.Picture,{source:t?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),(0,e.jsxs)("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[(0,e.jsx)(a.Text,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:t?.product?.title}),(0,e.jsx)(a.Text,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:D})]})]}),(0,e.jsxs)("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!t&&(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{className:"laptop-md:text-2xl text-base font-bold",html:v}),(0,e.jsx)(a.Text,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:t.price.amount,locale:p,currencyCode:t.price.currencyCode})})]}),l&&(0,e.jsx)(a.Button,{size:"icon",variant:"link",onClick:()=>{u?.(i?void 0:t),o(t)},className:"size-auto shrink-0 underline",children:i?f?.remove:f?.add})]})]})},M=({exchangeOperation:o,exchange:t,canOperate:i,status:l})=>{const{locale:p="us",copyWriting:f}=(0,A.useAiuiContext)(),{setCheckedExchangePurchase:P}=(0,B.useBizProductContext)();return(0,e.jsxs)("div",{className:"flex items-center justify-between gap-6",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(a.Picture,{source:t?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),(0,e.jsxs)("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[(0,e.jsx)(a.Text,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:t?.product?.title}),(0,e.jsx)(a.Text,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]"})]})]}),(0,e.jsxs)("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!t&&(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{className:"laptop-md:text-2xl text-base font-bold",html:(0,h.formatPrice)({amount:t.finalPrice?.amount||0,locale:p,currencyCode:t.price.currencyCode})}),(0,e.jsx)(a.Text,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:(0,h.formatPrice)({amount:t.price?.amount||0,locale:p,currencyCode:t.price.currencyCode})})]}),i&&(0,e.jsx)(a.Button,{size:"icon",variant:"link",onClick:()=>{P?.(l?void 0:t),o(t)},className:"size-auto shrink-0 underline",children:l?f?.remove:f?.add})]})]})};var ue=(0,Q.withLayout)(de);
 //# sourceMappingURL=index.js.map

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

@@ -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 desktop:px-0 desktop: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] desktop: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]  desktop: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=\"desktop: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] desktop: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=\"desktop: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=\"desktop: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=\"desktop:mt-8 mt-6\">\n                  <Text className=\"desktop:text-[18px] text-sm font-bold\" html={productSummaryData?.recommendBuy} />\n                  <div className=\"desktop: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 desktop: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 desktop: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 desktop: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 desktop: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=\"desktop: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=\"desktop: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=\"desktop: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=\"desktop: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] desktop: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=\"desktop:text-2xl text-base font-bold\" html={freeLabel} />\n            <Text\n              className=\"desktop: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=\"desktop: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] desktop: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=\"desktop: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=\"desktop: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, 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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",
   "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/ProductCard/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var u=Object.create;var a=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,n=Object.prototype.hasOwnProperty;var N=(t,o)=>{for(var d in o)a(t,d,{get:o[d],enumerable:!0})},l=(t,o,d,c)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of f(o))!n.call(t,r)&&r!==d&&a(t,r,{get:()=>o[r],enumerable:!(c=x(o,r))||c.enumerable});return t};var e=(t,o,d)=>(d=t!=null?u(G(t)):{},l(o||!t||!t.__esModule?a(d,"default",{value:t,enumerable:!0}):d,t)),P=t=>l(a({},"__esModule",{value:!0}),t);var g={};N(g,{default:()=>I});module.exports=P(g);var p=require("react/jsx-runtime"),s=require("../../../../components/index.js"),m=e(require("./ProductGallery/index.js")),i=e(require("./ProductDetail/index.js")),k=e(require("./ProductSummary/index.js"));const y=()=>(0,p.jsxs)("div",{id:"ipc-product-card",className:"desktop:mt-6 desktop:px-16 lg-desktop:px-[calc(50%-832px)]",children:[(0,p.jsxs)(s.Grid,{className:"laptop:gap-6",children:[(0,p.jsx)(s.GridItem,{className:"tablet:px-8 laptop:px-16 desktop:px-0 desktop:col-start-1 desktop:col-span-8 desktop:sticky desktop:top-[124px] col-span-12 h-fit",children:(0,p.jsx)(m.default,{})}),(0,p.jsx)(s.GridItem,{className:"desktop:col-start-9 desktop:col-span-4 col-span-12",children:(0,p.jsx)(i.default,{})})]}),(0,p.jsx)(k.default,{})]});var I=y;
+"use strict";var x=Object.create;var m=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var n=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty;var P=(p,t)=>{for(var a in t)m(p,a,{get:t[a],enumerable:!0})},s=(p,t,a,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let l of G(t))!N.call(p,l)&&l!==a&&m(p,l,{get:()=>t[l],enumerable:!(c=f(t,l))||c.enumerable});return p};var r=(p,t,a)=>(a=p!=null?x(n(p)):{},s(t||!p||!p.__esModule?m(a,"default",{value:p,enumerable:!0}):a,p)),y=p=>s(m({},"__esModule",{value:!0}),p);var k={};P(k,{default:()=>g});module.exports=y(k);var o=require("react/jsx-runtime"),d=require("../../../../components/index.js"),i=r(require("./ProductGallery/index.js")),e=r(require("./ProductDetail/index.js")),u=r(require("./ProductSummary/index.js"));const I=()=>(0,o.jsxs)("div",{id:"ipc-product-card",className:"laptop-md:mt-6 laptop-md:px-16 lg-desktop:px-[calc(50%-832px)]",children:[(0,o.jsxs)(d.Grid,{className:"laptop:gap-6",children:[(0,o.jsx)(d.GridItem,{className:"tablet:px-8 laptop:px-16 laptop-md:px-0 laptop-md:col-start-1 laptop-md:col-span-8 laptop-md:sticky laptop-md:top-[124px] col-span-12 h-fit",children:(0,o.jsx)(i.default,{})}),(0,o.jsx)(d.GridItem,{className:"laptop-md:col-start-9 laptop-md:col-span-4 col-span-12",children:(0,o.jsx)(e.default,{})})]}),(0,o.jsx)(u.default,{})]});var g=I;
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/biz-components/Listing/components/ProductCard/index.tsx"],
-  "sourcesContent": ["import { Grid, GridItem } from '../../../../components/index.js'\nimport ProductGallery from './ProductGallery/index.js'\nimport ProductDetail from './ProductDetail/index.js'\nimport ProductSummary from './ProductSummary/index.js'\n\nconst ProductCard = () => {\n  return (\n    <div id=\"ipc-product-card\" className=\"desktop:mt-6 desktop:px-16 lg-desktop:px-[calc(50%-832px)]\">\n      <Grid className=\"laptop:gap-6\">\n        <GridItem className=\"tablet:px-8 laptop:px-16 desktop:px-0 desktop:col-start-1 desktop:col-span-8 desktop:sticky desktop:top-[124px] col-span-12 h-fit\">\n          <ProductGallery />\n        </GridItem>\n        <GridItem className=\"desktop:col-start-9 desktop:col-span-4 col-span-12\">\n          <ProductDetail />\n        </GridItem>\n      </Grid>\n      <ProductSummary />\n    </div>\n  )\n}\n\nexport default ProductCard\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAQM,IAAAI,EAAA,6BARNC,EAA+B,2CAC/BC,EAA2B,wCAC3BC,EAA0B,uCAC1BC,EAA2B,wCAE3B,MAAMC,EAAc,OAEhB,QAAC,OAAI,GAAG,mBAAmB,UAAU,6DACnC,qBAAC,QAAK,UAAU,eACd,oBAAC,YAAS,UAAU,oIAClB,mBAAC,EAAAC,QAAA,EAAe,EAClB,KACA,OAAC,YAAS,UAAU,qDAClB,mBAAC,EAAAC,QAAA,EAAc,EACjB,GACF,KACA,OAAC,EAAAC,QAAA,EAAe,GAClB,EAIJ,IAAOV,EAAQO",
+  "sourcesContent": ["import { Grid, GridItem } from '../../../../components/index.js'\nimport ProductGallery from './ProductGallery/index.js'\nimport ProductDetail from './ProductDetail/index.js'\nimport ProductSummary from './ProductSummary/index.js'\n\nconst ProductCard = () => {\n  return (\n    <div id=\"ipc-product-card\" className=\"laptop-md:mt-6 laptop-md:px-16 lg-desktop:px-[calc(50%-832px)]\">\n      <Grid className=\"laptop:gap-6\">\n        <GridItem className=\"tablet:px-8 laptop:px-16 laptop-md:px-0 laptop-md:col-start-1 laptop-md:col-span-8 laptop-md:sticky laptop-md:top-[124px] col-span-12 h-fit\">\n          <ProductGallery />\n        </GridItem>\n        <GridItem className=\"laptop-md:col-start-9 laptop-md:col-span-4 col-span-12\">\n          <ProductDetail />\n        </GridItem>\n      </Grid>\n      <ProductSummary />\n    </div>\n  )\n}\n\nexport default ProductCard\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAQM,IAAAI,EAAA,6BARNC,EAA+B,2CAC/BC,EAA2B,wCAC3BC,EAA0B,uCAC1BC,EAA2B,wCAE3B,MAAMC,EAAc,OAEhB,QAAC,OAAI,GAAG,mBAAmB,UAAU,iEACnC,qBAAC,QAAK,UAAU,eACd,oBAAC,YAAS,UAAU,8IAClB,mBAAC,EAAAC,QAAA,EAAe,EAClB,KACA,OAAC,YAAS,UAAU,yDAClB,mBAAC,EAAAC,QAAA,EAAc,EACjB,GACF,KACA,OAAC,EAAAC,QAAA,EAAe,GAClB,EAIJ,IAAOV,EAAQO",
   "names": ["ProductCard_exports", "__export", "ProductCard_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_ProductGallery", "import_ProductDetail", "import_ProductSummary", "ProductCard", "ProductGallery", "ProductDetail", "ProductSummary"]
 }

package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var c=Object.defineProperty;var N=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var w=Object.prototype.hasOwnProperty;var h=(t,e)=>{for(var o in e)c(t,o,{get:e[o],enumerable:!0})},S=(t,e,o,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of k(e))!w.call(t,r)&&r!==o&&c(t,r,{get:()=>e[r],enumerable:!(i=N(e,r))||i.enumerable});return t};var P=t=>S(c({},"__esModule",{value:!0}),t);var A={};h(A,{default:()=>T});module.exports=P(A);var a=require("react/jsx-runtime"),l=require("../../../../../components/index.js"),m=require("../../../../AiuiProvider/index.js"),x=require("../../../BizProductProvider.js"),p=require("react"),n=require("../../../utils/index.js"),b=require("../../../utils/textFormat.js");const B=()=>{const{copyWriting:t,locale:e="us"}=(0,m.useAiuiContext)(),{variant:o,finalPrice:i,totalSavings:r,isLogin:d,comparePrice:u,onAddToCart:g,onBuyNow:f,savingDetail:s,addToCartLoading:y,buyNowLoading:C}=(0,x.useBizProductContext)(),v=(0,p.useMemo)(()=>(0,b.replaceTemplate)(t?.totalSavings||"",{amount:(0,n.formatPrice)({amount:r,currencyCode:o.price.currencyCode,locale:e})}),[t?.totalSavings,r,o.price.currencyCode,e]);return(0,a.jsxs)(l.Container,{childClassName:"tablet:flex tablet:justify-end tablet:gap-8 desktop:px-0 desktop:px-0 tablet:items-center tablet:gap-4",className:"desktop:border-none desktop:py-0 border-t border-[#E4E5E6] bg-white py-3",children:[o.availableForSale?(0,a.jsxs)("div",{className:"desktop:items-end flex flex-col justify-between",children:[(0,a.jsxs)("div",{className:"flex items-center gap-1",children:[(0,a.jsx)(l.Text,{className:"tablet:text-2xl desktop:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2]",html:(0,n.formatPrice)({amount:Math.floor(i*100)/100,currencyCode:o.price.currencyCode,locale:e})}),(r>0||s?.member>0&&d)&&(0,a.jsx)(l.Text,{className:"tablet:text-2xl desktop:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2] text-[#999] line-through",html:(0,n.formatPrice)({amount:u,currencyCode:o.price.currencyCode,locale:e})}),s?.member>0&&d&&(0,a.jsx)(l.Text,{className:"bg-brand-0 rounded px-1 py-[2px] text-sm font-bold text-white",html:t?.memberPrice||"Member Price"})]}),(r>0||s?.member>0&&d)&&(0,a.jsx)(l.Text,{className:"text-brand-0 tablet:text-end desktop:text-xl lg-desktop:text-2xl whitespace-nowrap text-[18px] font-bold !leading-[1.2]",html:`${v}`})]}):(0,a.jsx)(l.Text,{className:"text-[20px] font-bold text-[#999999]",html:t?.soldOut??"Sold Out"}),(0,a.jsxs)("div",{className:"tablet:mt-0 mt-2 flex items-center gap-2",children:[(0,a.jsx)(l.Button,{variant:"secondary",disabled:!o.availableForSale,size:"lg",className:"tablet:w-auto w-1/2",onClick:()=>g?.(),loading:y,children:t?.addToCart??"Add to Cart"}),(0,a.jsx)(l.Button,{variant:"primary",disabled:!o.availableForSale,size:"lg",loading:C,className:"tablet:w-auto w-1/2",onClick:()=>f?.(),children:t?.buyNow??"Buy Now"})]})]})};var T=B;
+"use strict";var s=Object.defineProperty;var N=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var h=Object.prototype.hasOwnProperty;var S=(t,e)=>{for(var o in e)s(t,o,{get:e[o],enumerable:!0})},P=(t,e,o,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of w(e))!h.call(t,r)&&r!==o&&s(t,r,{get:()=>e[r],enumerable:!(i=N(e,r))||i.enumerable});return t};var B=t=>P(s({},"__esModule",{value:!0}),t);var A={};S(A,{default:()=>k});module.exports=B(A);var a=require("react/jsx-runtime"),l=require("../../../../../components/index.js"),c=require("../../../../AiuiProvider/index.js"),p=require("../../../BizProductProvider.js"),x=require("react"),n=require("../../../utils/index.js"),b=require("../../../utils/textFormat.js");const T=()=>{const{copyWriting:t,locale:e="us"}=(0,c.useAiuiContext)(),{variant:o,finalPrice:i,totalSavings:r,isLogin:d,comparePrice:u,onAddToCart:g,onBuyNow:f,savingDetail:m,addToCartLoading:y,buyNowLoading:C}=(0,p.useBizProductContext)(),v=(0,x.useMemo)(()=>(0,b.replaceTemplate)(t?.totalSavings||"",{amount:(0,n.formatPrice)({amount:r,currencyCode:o.price.currencyCode,locale:e})}),[t?.totalSavings,r,o.price.currencyCode,e]);return(0,a.jsxs)(l.Container,{childClassName:"tablet:flex tablet:justify-end tablet:gap-8 laptop-md:px-0 tablet:items-center tablet:gap-4",className:"laptop-md:border-none laptop-md:py-0 border-t border-[#E4E5E6] bg-white py-3",children:[o.availableForSale?(0,a.jsxs)("div",{className:"laptop-md:items-end flex flex-col justify-between",children:[(0,a.jsxs)("div",{className:"flex items-center gap-1",children:[(0,a.jsx)(l.Text,{className:"tablet:text-2xl laptop-md:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2]",html:(0,n.formatPrice)({amount:Math.floor(i*100)/100,currencyCode:o.price.currencyCode,locale:e})}),(r>0||m?.member>0&&d)&&(0,a.jsx)(l.Text,{className:"tablet:text-2xl laptop-md:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2] text-[#999] line-through",html:(0,n.formatPrice)({amount:u,currencyCode:o.price.currencyCode,locale:e})}),m?.member>0&&d&&(0,a.jsx)(l.Text,{className:"bg-brand-0 rounded px-1 py-[2px] text-sm font-bold text-white",html:t?.memberPrice||"Member Price"})]}),(r>0||m?.member>0&&d)&&(0,a.jsx)(l.Text,{className:"text-brand-0 tablet:text-end laptop-md:text-xl lg-desktop:text-2xl whitespace-nowrap text-[18px] font-bold !leading-[1.2]",html:`${v}`})]}):(0,a.jsx)(l.Text,{className:"text-[20px] font-bold text-[#999999]",html:t?.soldOut??"Sold Out"}),(0,a.jsxs)("div",{className:"tablet:mt-0 mt-2 flex items-center gap-2",children:[(0,a.jsx)(l.Button,{variant:"secondary",disabled:!o.availableForSale,size:"lg",className:"tablet:w-auto w-1/2",onClick:()=>g?.(),loading:y,children:t?.addToCart??"Add to Cart"}),(0,a.jsx)(l.Button,{variant:"primary",disabled:!o.availableForSale,size:"lg",loading:C,className:"tablet:w-auto w-1/2",onClick:()=>f?.(),children:t?.buyNow??"Buy Now"})]})]})};var k=T;
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/biz-components/Listing/components/PurchaseBar/ProductActions/index.tsx"],
-  "sourcesContent": ["import { Text, Button, Container } from '../../../../../components/index.js'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useMemo } from 'react'\nimport { formatPrice } from '../../../utils/index.js'\nimport { replaceTemplate } from '../../../utils/textFormat.js'\n\nconst ProductActions = () => {\n  const { copyWriting, locale = 'us' } = useAiuiContext()\n  const {\n    variant,\n    finalPrice,\n    totalSavings,\n    isLogin,\n    comparePrice,\n    onAddToCart,\n    onBuyNow,\n    savingDetail,\n    addToCartLoading,\n    buyNowLoading,\n  } = useBizProductContext()\n\n  const totalSavingsText = useMemo(() => {\n    return replaceTemplate(copyWriting?.totalSavings || '', {\n      amount: formatPrice({ amount: totalSavings, currencyCode: variant.price.currencyCode, locale }),\n    })\n  }, [copyWriting?.totalSavings, totalSavings, variant.price.currencyCode, locale])\n\n  // const memberPriceSaveText = useMemo(() => {\n  //   return replaceTemplate(copyWriting?.memberSaving || '', {\n  //     amount: formatPrice({\n  //       amount: savingDetail?.member,\n  //       currencyCode: variant.price.currencyCode,\n  //       locale,\n  //     }),\n  //   })\n  // }, [copyWriting?.memberSaving, savingDetail?.member, variant.price.currencyCode, locale])\n\n  return (\n    <Container\n      childClassName=\"tablet:flex tablet:justify-end tablet:gap-8 desktop:px-0 desktop:px-0 tablet:items-center tablet:gap-4\"\n      className=\"desktop:border-none desktop:py-0 border-t border-[#E4E5E6] bg-white py-3\"\n    >\n      {variant.availableForSale ? (\n        <div className=\"desktop:items-end flex flex-col justify-between\">\n          <div className=\"flex items-center gap-1\">\n            <Text\n              className=\"tablet:text-2xl desktop:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2]\"\n              html={formatPrice({\n                amount: Math.floor(finalPrice * 100) / 100,\n                currencyCode: variant.price.currencyCode,\n                locale,\n              })}\n            />\n            {(totalSavings > 0 || (savingDetail?.member > 0 && isLogin)) && (\n              <Text\n                className=\"tablet:text-2xl desktop:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2] text-[#999] line-through\"\n                html={formatPrice({\n                  amount: comparePrice,\n                  currencyCode: variant.price.currencyCode,\n                  locale,\n                })}\n              />\n            )}\n            {savingDetail?.member > 0 && isLogin && (\n              <Text\n                className=\"bg-brand-0 rounded px-1 py-[2px] text-sm font-bold text-white\"\n                html={copyWriting?.memberPrice || 'Member Price'}\n              />\n            )}\n          </div>\n          {(totalSavings > 0 || (savingDetail?.member > 0 && isLogin)) && (\n            <Text\n              className=\"text-brand-0 tablet:text-end desktop:text-xl lg-desktop:text-2xl whitespace-nowrap text-[18px] font-bold !leading-[1.2]\"\n              html={`${totalSavingsText}`}\n            />\n          )}\n        </div>\n      ) : (\n        <Text className=\"text-[20px] font-bold text-[#999999]\" html={copyWriting?.soldOut ?? 'Sold Out'} />\n      )}\n      <div className=\"tablet:mt-0 mt-2 flex items-center gap-2\">\n        <Button\n          variant=\"secondary\"\n          disabled={!variant.availableForSale}\n          size=\"lg\"\n          className=\"tablet:w-auto w-1/2\"\n          onClick={() => onAddToCart?.()}\n          loading={addToCartLoading}\n        >\n          {copyWriting?.addToCart ?? 'Add to Cart'}\n        </Button>\n        <Button\n          variant=\"primary\"\n          disabled={!variant.availableForSale}\n          size=\"lg\"\n          loading={buyNowLoading}\n          className=\"tablet:w-auto w-1/2\"\n          onClick={() => onBuyNow?.()}\n        >\n          {copyWriting?.buyNow ?? 'Buy Now'}\n        </Button>\n      </div>\n    </Container>\n  )\n}\n\nexport default ProductActions\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6CU,IAAAI,EAAA,6BA7CVC,EAAwC,8CACxCC,EAA+B,6CAC/BC,EAAqC,0CACrCC,EAAwB,iBACxBC,EAA4B,mCAC5BC,EAAgC,wCAEhC,MAAMC,EAAiB,IAAM,CAC3B,KAAM,CAAE,YAAAC,EAAa,OAAAC,EAAS,IAAK,KAAI,kBAAe,EAChD,CACJ,QAAAC,EACA,WAAAC,EACA,aAAAC,EACA,QAAAC,EACA,aAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,iBAAAC,EACA,cAAAC,CACF,KAAI,wBAAqB,EAEnBC,KAAmB,WAAQ,OACxB,mBAAgBZ,GAAa,cAAgB,GAAI,CACtD,UAAQ,eAAY,CAAE,OAAQI,EAAc,aAAcF,EAAQ,MAAM,aAAc,OAAAD,CAAO,CAAC,CAChG,CAAC,EACA,CAACD,GAAa,aAAcI,EAAcF,EAAQ,MAAM,aAAcD,CAAM,CAAC,EAYhF,SACE,QAAC,aACC,eAAe,yGACf,UAAU,2EAET,UAAAC,EAAQ,oBACP,QAAC,OAAI,UAAU,kDACb,qBAAC,OAAI,UAAU,0BACb,oBAAC,QACC,UAAU,uFACV,QAAM,eAAY,CAChB,OAAQ,KAAK,MAAMC,EAAa,GAAG,EAAI,IACvC,aAAcD,EAAQ,MAAM,aAC5B,OAAAD,CACF,CAAC,EACH,GACEG,EAAe,GAAMK,GAAc,OAAS,GAAKJ,OACjD,OAAC,QACC,UAAU,gHACV,QAAM,eAAY,CAChB,OAAQC,EACR,aAAcJ,EAAQ,MAAM,aAC5B,OAAAD,CACF,CAAC,EACH,EAEDQ,GAAc,OAAS,GAAKJ,MAC3B,OAAC,QACC,UAAU,gEACV,KAAML,GAAa,aAAe,eACpC,GAEJ,GACEI,EAAe,GAAMK,GAAc,OAAS,GAAKJ,OACjD,OAAC,QACC,UAAU,0HACV,KAAM,GAAGO,CAAgB,GAC3B,GAEJ,KAEA,OAAC,QAAK,UAAU,uCAAuC,KAAMZ,GAAa,SAAW,WAAY,KAEnG,QAAC,OAAI,UAAU,2CACb,oBAAC,UACC,QAAQ,YACR,SAAU,CAACE,EAAQ,iBACnB,KAAK,KACL,UAAU,sBACV,QAAS,IAAMK,IAAc,EAC7B,QAASG,EAER,SAAAV,GAAa,WAAa,cAC7B,KACA,OAAC,UACC,QAAQ,UACR,SAAU,CAACE,EAAQ,iBACnB,KAAK,KACL,QAASS,EACT,UAAU,sBACV,QAAS,IAAMH,IAAW,EAEzB,SAAAR,GAAa,QAAU,UAC1B,GACF,GACF,CAEJ,EAEA,IAAOV,EAAQS",
+  "sourcesContent": ["import { Text, Button, Container } from '../../../../../components/index.js'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useMemo } from 'react'\nimport { formatPrice } from '../../../utils/index.js'\nimport { replaceTemplate } from '../../../utils/textFormat.js'\n\nconst ProductActions = () => {\n  const { copyWriting, locale = 'us' } = useAiuiContext()\n  const {\n    variant,\n    finalPrice,\n    totalSavings,\n    isLogin,\n    comparePrice,\n    onAddToCart,\n    onBuyNow,\n    savingDetail,\n    addToCartLoading,\n    buyNowLoading,\n  } = useBizProductContext()\n\n  const totalSavingsText = useMemo(() => {\n    return replaceTemplate(copyWriting?.totalSavings || '', {\n      amount: formatPrice({ amount: totalSavings, currencyCode: variant.price.currencyCode, locale }),\n    })\n  }, [copyWriting?.totalSavings, totalSavings, variant.price.currencyCode, locale])\n\n  // const memberPriceSaveText = useMemo(() => {\n  //   return replaceTemplate(copyWriting?.memberSaving || '', {\n  //     amount: formatPrice({\n  //       amount: savingDetail?.member,\n  //       currencyCode: variant.price.currencyCode,\n  //       locale,\n  //     }),\n  //   })\n  // }, [copyWriting?.memberSaving, savingDetail?.member, variant.price.currencyCode, locale])\n\n  return (\n    <Container\n      childClassName=\"tablet:flex tablet:justify-end tablet:gap-8 laptop-md:px-0 tablet:items-center tablet:gap-4\"\n      className=\"laptop-md:border-none laptop-md:py-0 border-t border-[#E4E5E6] bg-white py-3\"\n    >\n      {variant.availableForSale ? (\n        <div className=\"laptop-md:items-end flex flex-col justify-between\">\n          <div className=\"flex items-center gap-1\">\n            <Text\n              className=\"tablet:text-2xl laptop-md:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2]\"\n              html={formatPrice({\n                amount: Math.floor(finalPrice * 100) / 100,\n                currencyCode: variant.price.currencyCode,\n                locale,\n              })}\n            />\n            {(totalSavings > 0 || (savingDetail?.member > 0 && isLogin)) && (\n              <Text\n                className=\"tablet:text-2xl laptop-md:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2] text-[#999] line-through\"\n                html={formatPrice({\n                  amount: comparePrice,\n                  currencyCode: variant.price.currencyCode,\n                  locale,\n                })}\n              />\n            )}\n            {savingDetail?.member > 0 && isLogin && (\n              <Text\n                className=\"bg-brand-0 rounded px-1 py-[2px] text-sm font-bold text-white\"\n                html={copyWriting?.memberPrice || 'Member Price'}\n              />\n            )}\n          </div>\n          {(totalSavings > 0 || (savingDetail?.member > 0 && isLogin)) && (\n            <Text\n              className=\"text-brand-0 tablet:text-end laptop-md:text-xl lg-desktop:text-2xl whitespace-nowrap text-[18px] font-bold !leading-[1.2]\"\n              html={`${totalSavingsText}`}\n            />\n          )}\n        </div>\n      ) : (\n        <Text className=\"text-[20px] font-bold text-[#999999]\" html={copyWriting?.soldOut ?? 'Sold Out'} />\n      )}\n      <div className=\"tablet:mt-0 mt-2 flex items-center gap-2\">\n        <Button\n          variant=\"secondary\"\n          disabled={!variant.availableForSale}\n          size=\"lg\"\n          className=\"tablet:w-auto w-1/2\"\n          onClick={() => onAddToCart?.()}\n          loading={addToCartLoading}\n        >\n          {copyWriting?.addToCart ?? 'Add to Cart'}\n        </Button>\n        <Button\n          variant=\"primary\"\n          disabled={!variant.availableForSale}\n          size=\"lg\"\n          loading={buyNowLoading}\n          className=\"tablet:w-auto w-1/2\"\n          onClick={() => onBuyNow?.()}\n        >\n          {copyWriting?.buyNow ?? 'Buy Now'}\n        </Button>\n      </div>\n    </Container>\n  )\n}\n\nexport default ProductActions\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6CU,IAAAI,EAAA,6BA7CVC,EAAwC,8CACxCC,EAA+B,6CAC/BC,EAAqC,0CACrCC,EAAwB,iBACxBC,EAA4B,mCAC5BC,EAAgC,wCAEhC,MAAMC,EAAiB,IAAM,CAC3B,KAAM,CAAE,YAAAC,EAAa,OAAAC,EAAS,IAAK,KAAI,kBAAe,EAChD,CACJ,QAAAC,EACA,WAAAC,EACA,aAAAC,EACA,QAAAC,EACA,aAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,iBAAAC,EACA,cAAAC,CACF,KAAI,wBAAqB,EAEnBC,KAAmB,WAAQ,OACxB,mBAAgBZ,GAAa,cAAgB,GAAI,CACtD,UAAQ,eAAY,CAAE,OAAQI,EAAc,aAAcF,EAAQ,MAAM,aAAc,OAAAD,CAAO,CAAC,CAChG,CAAC,EACA,CAACD,GAAa,aAAcI,EAAcF,EAAQ,MAAM,aAAcD,CAAM,CAAC,EAYhF,SACE,QAAC,aACC,eAAe,8FACf,UAAU,+EAET,UAAAC,EAAQ,oBACP,QAAC,OAAI,UAAU,oDACb,qBAAC,OAAI,UAAU,0BACb,oBAAC,QACC,UAAU,yFACV,QAAM,eAAY,CAChB,OAAQ,KAAK,MAAMC,EAAa,GAAG,EAAI,IACvC,aAAcD,EAAQ,MAAM,aAC5B,OAAAD,CACF,CAAC,EACH,GACEG,EAAe,GAAMK,GAAc,OAAS,GAAKJ,OACjD,OAAC,QACC,UAAU,kHACV,QAAM,eAAY,CAChB,OAAQC,EACR,aAAcJ,EAAQ,MAAM,aAC5B,OAAAD,CACF,CAAC,EACH,EAEDQ,GAAc,OAAS,GAAKJ,MAC3B,OAAC,QACC,UAAU,gEACV,KAAML,GAAa,aAAe,eACpC,GAEJ,GACEI,EAAe,GAAMK,GAAc,OAAS,GAAKJ,OACjD,OAAC,QACC,UAAU,4HACV,KAAM,GAAGO,CAAgB,GAC3B,GAEJ,KAEA,OAAC,QAAK,UAAU,uCAAuC,KAAMZ,GAAa,SAAW,WAAY,KAEnG,QAAC,OAAI,UAAU,2CACb,oBAAC,UACC,QAAQ,YACR,SAAU,CAACE,EAAQ,iBACnB,KAAK,KACL,UAAU,sBACV,QAAS,IAAMK,IAAc,EAC7B,QAASG,EAER,SAAAV,GAAa,WAAa,cAC7B,KACA,OAAC,UACC,QAAQ,UACR,SAAU,CAACE,EAAQ,iBACnB,KAAK,KACL,QAASS,EACT,UAAU,sBACV,QAAS,IAAMH,IAAW,EAEzB,SAAAR,GAAa,QAAU,UAC1B,GACF,GACF,CAEJ,EAEA,IAAOV,EAAQS",
   "names": ["ProductActions_exports", "__export", "ProductActions_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_AiuiProvider", "import_BizProductProvider", "import_react", "import_utils", "import_textFormat", "ProductActions", "copyWriting", "locale", "variant", "finalPrice", "totalSavings", "isLogin", "comparePrice", "onAddToCart", "onBuyNow", "savingDetail", "addToCartLoading", "buyNowLoading", "totalSavingsText"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";var N=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var M=(e,o)=>{for(var a in o)N(e,a,{get:o[a],enumerable:!0})},B=(e,o,a,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of x(o))!k.call(e,r)&&r!==a&&N(e,r,{get:()=>o[r],enumerable:!(l=R(o,r))||l.enumerable});return e};var C=e=>B(N({},"__esModule",{value:!0}),e);var P={};M(P,{default:()=>L});module.exports=C(P);var p=require("react/jsx-runtime"),E=require("../../../../../helpers/index.js"),n=require("react");const H=(e,o)=>{const[a,l]=(0,n.useState)(null),r=(0,n.useRef)(null),u=(0,n.useRef)(new Map),m=(0,n.useRef)(!1),g=(0,n.useRef)(null);(0,n.useEffect)(()=>{g.current=a},[a]),(0,n.useEffect)(()=>{if(!e||e.length===0)return;r.current&&r.current.disconnect();const f=document.getElementById("purchase-bar"),v=f?f.clientHeight:100;u.current.clear();const t=[];if(e.forEach(s=>{const d=s.id||s.href?.replace("#",""),h=document.getElementById(d);h&&(u.current.set(d,s),t.push(h))}),t.length===0){l(e[0]);return}const c={root:null,rootMargin:`-${v}px 0px -50% 0px`,threshold:[0,.25,.5,.75,1]},w=s=>{if(m.current)return;if((window.scrollY||document.documentElement.scrollTop)<v+50){const i=e[0];i&&g.current?.id!==i.id&&(console.log("\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:",i.label),l(i),o?.(i));return}const h=s.filter(i=>i.isIntersecting).sort((i,S)=>i.boundingClientRect.top-S.boundingClientRect.top);if(h.length>0){const S=h[0].target.id,b=u.current.get(S);b&&(l(b),o?.(b))}else{const i=[...s].sort((S,b)=>Math.abs(S.boundingClientRect.top)-Math.abs(b.boundingClientRect.top));if(i.length>0){const b=i[0].target.id,I=u.current.get(b);I&&(l(I),o?.(I))}}};r.current=new IntersectionObserver(w,c),t.forEach(s=>{r.current?.observe(s)});const T=()=>{if(m.current)return;if((window.scrollY||document.documentElement.scrollTop)<v+50){const d=e[0];d&&(l(d),o?.(d))}};return window.addEventListener("scroll",T,{passive:!0}),()=>{r.current&&r.current.disconnect(),window.removeEventListener("scroll",T)}},[e,o]),(0,n.useEffect)(()=>{!a&&e&&e.length>0&&l(e[0])},[e,a]);const y=(0,n.useCallback)(f=>{l(f);const v=f.id||f.href?.replace("#",""),t=document.getElementById(v);if(t){const c=document.getElementById("purchase-bar"),w=c?c.clientHeight:100;m.current=!0;const s=t.getBoundingClientRect().top+window.scrollY-w-10;window.scrollTo({top:s,behavior:"smooth"}),setTimeout(()=>{m.current=!1},1e3)}},[]);return{activeTab:a||e?.[0],setActiveTab:y}},O=({tabs:e,onSpyNavItemClick:o,className:a,renderRating:l})=>{const r=(0,n.useMemo)(()=>l?[...e,{label:"Reviews",id:"review",href:""}]:e,[e,l]),{activeTab:u,setActiveTab:m}=H(r),g=(0,n.useRef)(null),y=(0,n.useRef)(new Map),f=(0,n.useCallback)(t=>{m(t),o?.(t)},[o,m]);(0,n.useEffect)(()=>{if(!u||!g.current)return;const t=y.current.get(u.id);if(!t)return;const c=g.current,w=t.getBoundingClientRect(),T=c.getBoundingClientRect(),s=w.left+w.width/2-T.left,d=T.width/2,h=s-d;c.scrollTo({left:c.scrollLeft+h,behavior:"smooth"})},[u?.id]);const v=(0,n.useCallback)((t,c)=>{c?y.current.set(t,c):y.current.delete(t)},[]);return(0,p.jsx)("div",{ref:g,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:(0,E.cn)("overflow-x-auto",a),children:(0,p.jsx)("div",{className:"tablet:gap-8 flex gap-6",children:r?.map(t=>(0,p.jsx)("button",{ref:c=>v(t.id,c),children:t.id==="review"?(0,p.jsxs)("div",{className:"relative shrink-0 whitespace-nowrap py-[10px]",children:[l,(0,p.jsx)("div",{className:(0,E.cn)("desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":u?.id===t.id})})]}):(0,p.jsxs)("div",{className:(0,E.cn)("desktop:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]",{"text-[#1d1d1f]":u?.id===t.id}),onClick:()=>f(t),children:[t.label,(0,p.jsx)("div",{className:(0,E.cn)("desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":u?.id===t.id})})]})},t.id))})})};var L=O;
+"use strict";var N=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var M=Object.prototype.hasOwnProperty;var B=(e,o)=>{for(var a in o)N(e,a,{get:o[a],enumerable:!0})},C=(e,o,a,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of x(o))!M.call(e,r)&&r!==a&&N(e,r,{get:()=>o[r],enumerable:!(l=R(o,r))||l.enumerable});return e};var k=e=>C(N({},"__esModule",{value:!0}),e);var P={};B(P,{default:()=>L});module.exports=k(P);var p=require("react/jsx-runtime"),E=require("../../../../../helpers/index.js"),n=require("react");const H=(e,o)=>{const[a,l]=(0,n.useState)(null),r=(0,n.useRef)(null),u=(0,n.useRef)(new Map),m=(0,n.useRef)(!1),g=(0,n.useRef)(null);(0,n.useEffect)(()=>{g.current=a},[a]),(0,n.useEffect)(()=>{if(!e||e.length===0)return;r.current&&r.current.disconnect();const f=document.getElementById("purchase-bar"),v=f?f.clientHeight:100;u.current.clear();const t=[];if(e.forEach(s=>{const d=s.id||s.href?.replace("#",""),h=document.getElementById(d);h&&(u.current.set(d,s),t.push(h))}),t.length===0){l(e[0]);return}const c={root:null,rootMargin:`-${v}px 0px -50% 0px`,threshold:[0,.25,.5,.75,1]},w=s=>{if(m.current)return;if((window.scrollY||document.documentElement.scrollTop)<v+50){const i=e[0];i&&g.current?.id!==i.id&&(console.log("\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:",i.label),l(i),o?.(i));return}const h=s.filter(i=>i.isIntersecting).sort((i,S)=>i.boundingClientRect.top-S.boundingClientRect.top);if(h.length>0){const S=h[0].target.id,b=u.current.get(S);b&&(l(b),o?.(b))}else{const i=[...s].sort((S,b)=>Math.abs(S.boundingClientRect.top)-Math.abs(b.boundingClientRect.top));if(i.length>0){const b=i[0].target.id,I=u.current.get(b);I&&(l(I),o?.(I))}}};r.current=new IntersectionObserver(w,c),t.forEach(s=>{r.current?.observe(s)});const T=()=>{if(m.current)return;if((window.scrollY||document.documentElement.scrollTop)<v+50){const d=e[0];d&&(l(d),o?.(d))}};return window.addEventListener("scroll",T,{passive:!0}),()=>{r.current&&r.current.disconnect(),window.removeEventListener("scroll",T)}},[e,o]),(0,n.useEffect)(()=>{!a&&e&&e.length>0&&l(e[0])},[e,a]);const y=(0,n.useCallback)(f=>{l(f);const v=f.id||f.href?.replace("#",""),t=document.getElementById(v);if(t){const c=document.getElementById("purchase-bar"),w=c?c.clientHeight:100;m.current=!0;const s=t.getBoundingClientRect().top+window.scrollY-w-10;window.scrollTo({top:s,behavior:"smooth"}),setTimeout(()=>{m.current=!1},1e3)}},[]);return{activeTab:a||e?.[0],setActiveTab:y}},O=({tabs:e,onSpyNavItemClick:o,className:a,renderRating:l})=>{const r=(0,n.useMemo)(()=>l?[...e,{label:"Reviews",id:"review",href:""}]:e,[e,l]),{activeTab:u,setActiveTab:m}=H(r),g=(0,n.useRef)(null),y=(0,n.useRef)(new Map),f=(0,n.useCallback)(t=>{m(t),o?.(t)},[o,m]);(0,n.useEffect)(()=>{if(!u||!g.current)return;const t=y.current.get(u.id);if(!t)return;const c=g.current,w=t.getBoundingClientRect(),T=c.getBoundingClientRect(),s=w.left+w.width/2-T.left,d=T.width/2,h=s-d;c.scrollTo({left:c.scrollLeft+h,behavior:"smooth"})},[u?.id]);const v=(0,n.useCallback)((t,c)=>{c?y.current.set(t,c):y.current.delete(t)},[]);return(0,p.jsx)("div",{ref:g,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:(0,E.cn)("overflow-x-auto",a),children:(0,p.jsx)("div",{className:"tablet:gap-8 flex gap-6",children:r?.map(t=>(0,p.jsx)("button",{ref:c=>v(t.id,c),children:t.id==="review"?(0,p.jsxs)("div",{className:"relative shrink-0 whitespace-nowrap py-[10px]",children:[l,(0,p.jsx)("div",{className:(0,E.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":u?.id===t.id})})]}):(0,p.jsxs)("div",{className:(0,E.cn)("laptop-md:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]",{"text-[#1d1d1f]":u?.id===t.id}),onClick:()=>f(t),children:[t.label,(0,p.jsx)("div",{className:(0,E.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":u?.id===t.id})})]})},t.id))})})};var L=O;
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.tsx"],
-  "sourcesContent": ["import { cn } from '../../../../../helpers/index.js'\nimport { useState, useCallback, useRef, useEffect, useMemo } from 'react'\nimport type { ScrollSpyNavItem, ScrollSpyNavProps } from './types.js'\n\n// \u81EA\u5B9A\u4E49 hook\uFF1A\u76D1\u542C\u9875\u9762\u6EDA\u52A8\uFF0C\u81EA\u52A8\u66F4\u65B0\u5F53\u524D\u6FC0\u6D3B\u7684 tab\nconst useScrollSpy = (tabs: ScrollSpyNavItem[], onActiveChange?: (tab: ScrollSpyNavItem) => void) => {\n  const [activeTab, setActiveTab] = useState<ScrollSpyNavItem | null>(null)\n  const observerRef = useRef<IntersectionObserver | null>(null)\n  const sectionsRef = useRef<Map<string, ScrollSpyNavItem>>(new Map())\n  const isManualScrollRef = useRef(false) // \u6807\u8BB0\u662F\u5426\u4E3A\u624B\u52A8\u70B9\u51FB\u89E6\u53D1\u7684\u6EDA\u52A8\n  const activeTabRef = useRef<ScrollSpyNavItem | null>(null) // \u7528 ref \u5B58\u50A8\u5F53\u524D\u6FC0\u6D3B\u7684 tab\uFF0C\u907F\u514D\u95ED\u5305\u95EE\u9898\n\n  // \u540C\u6B65 activeTab \u5230 ref\n  useEffect(() => {\n    activeTabRef.current = activeTab\n  }, [activeTab])\n\n  useEffect(() => {\n    if (!tabs || tabs.length === 0) return\n\n    // \u6E05\u7406\u4E4B\u524D\u7684 observer\n    if (observerRef.current) {\n      observerRef.current.disconnect()\n    }\n\n    // \u83B7\u53D6\u5BFC\u822A\u680F\u9AD8\u5EA6\n    const purchaseBar = document.getElementById('purchase-bar')\n    const navHeight = purchaseBar ? purchaseBar.clientHeight : 100\n\n    // \u521B\u5EFA Map \u5B58\u50A8 section \u4FE1\u606F\n    sectionsRef.current.clear()\n    const elements: Element[] = []\n\n    tabs.forEach(tab => {\n      const id = tab.id || tab.href?.replace('#', '')\n      const element = document.getElementById(id)\n      if (element) {\n        sectionsRef.current.set(id, tab)\n        elements.push(element)\n      }\n    })\n\n    if (elements.length === 0) {\n      // \u5982\u679C\u6CA1\u6709\u627E\u5230\u5143\u7D20\uFF0C\u8BBE\u7F6E\u7B2C\u4E00\u4E2A tab \u4E3A\u6FC0\u6D3B\u72B6\u6001\n      setActiveTab(tabs[0])\n      return\n    }\n\n    // \u4F7F\u7528 IntersectionObserver \u76D1\u542C\u5143\u7D20\u8FDB\u5165\u89C6\u53E3\n    const observerOptions: IntersectionObserverInit = {\n      root: null,\n      rootMargin: `-${navHeight}px 0px -50% 0px`, // \u4E0A\u65B9\u504F\u79FB\u5BFC\u822A\u680F\u9AD8\u5EA6\uFF0C\u4E0B\u65B9\u504F\u79FB50%\u89C6\u53E3\u9AD8\u5EA6\n      threshold: [0, 0.25, 0.5, 0.75, 1],\n    }\n\n    const observerCallback: IntersectionObserverCallback = entries => {\n      // \u5982\u679C\u662F\u624B\u52A8\u70B9\u51FB\u89E6\u53D1\u7684\u6EDA\u52A8\uFF0C\u4E0D\u8981\u66F4\u65B0\u72B6\u6001\n      if (isManualScrollRef.current) {\n        return\n      }\n\n      // \u68C0\u67E5\u662F\u5426\u6EDA\u52A8\u5230\u9875\u9762\u9876\u90E8\uFF08\u7279\u6B8A\u5904\u7406\u7B2C\u4E00\u4E2A\u5143\u7D20\uFF09\n      const scrollTop = window.scrollY || document.documentElement.scrollTop\n      if (scrollTop < navHeight + 50) {\n        // \u5728\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab\n        const firstTab = tabs[0]\n        if (firstTab && activeTabRef.current?.id !== firstTab.id) {\n          console.log('\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:', firstTab.label)\n          setActiveTab(firstTab)\n          onActiveChange?.(firstTab)\n        }\n        return\n      }\n\n      // \u627E\u51FA\u6240\u6709\u6B63\u5728\u4EA4\u53C9\u7684 entries\n      const intersectingEntries = entries\n        .filter(entry => entry.isIntersecting)\n        .sort((a, b) => {\n          // \u6309\u7167\u5143\u7D20\u5728\u9875\u9762\u4E0A\u7684\u4F4D\u7F6E\u6392\u5E8F\uFF08\u4ECE\u4E0A\u5230\u4E0B\uFF09\n          return a.boundingClientRect.top - b.boundingClientRect.top\n        })\n\n      if (intersectingEntries.length > 0) {\n        // \u9009\u62E9\u6700\u4E0A\u9762\u7684\u6B63\u5728\u4EA4\u53C9\u7684\u5143\u7D20\n        const topEntry = intersectingEntries[0]\n        const id = topEntry.target.id\n        const tab = sectionsRef.current.get(id)\n\n        if (tab) {\n          setActiveTab(tab)\n          onActiveChange?.(tab)\n        }\n      } else {\n        // \u5982\u679C\u6CA1\u6709\u5143\u7D20\u6B63\u5728\u4EA4\u53C9\uFF0C\u627E\u51FA\u6700\u63A5\u8FD1\u89C6\u53E3\u9876\u90E8\u7684\u5143\u7D20\n        const sortedEntries = [...entries].sort((a, b) => {\n          return Math.abs(a.boundingClientRect.top) - Math.abs(b.boundingClientRect.top)\n        })\n\n        if (sortedEntries.length > 0) {\n          const closestEntry = sortedEntries[0]\n          const id = closestEntry.target.id\n          const tab = sectionsRef.current.get(id)\n\n          if (tab) {\n            setActiveTab(tab)\n            onActiveChange?.(tab)\n          }\n        }\n      }\n    }\n\n    observerRef.current = new IntersectionObserver(observerCallback, observerOptions)\n\n    // \u89C2\u5BDF\u6240\u6709 section \u5143\u7D20\n    elements.forEach(element => {\n      observerRef.current?.observe(element)\n    })\n\n    // \u6DFB\u52A0\u6EDA\u52A8\u4E8B\u4EF6\u76D1\u542C\uFF0C\u5904\u7406\u9875\u9762\u9876\u90E8\u7684\u60C5\u51B5\n    const handleScroll = () => {\n      if (isManualScrollRef.current) {\n        return\n      }\n\n      const scrollTop = window.scrollY || document.documentElement.scrollTop\n      // \u5982\u679C\u6EDA\u52A8\u5230\u63A5\u8FD1\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab\n      if (scrollTop < navHeight + 50) {\n        const firstTab = tabs[0]\n        if (firstTab) {\n          setActiveTab(firstTab)\n          onActiveChange?.(firstTab)\n        }\n      }\n    }\n\n    window.addEventListener('scroll', handleScroll, { passive: true })\n\n    return () => {\n      if (observerRef.current) {\n        observerRef.current.disconnect()\n      }\n      window.removeEventListener('scroll', handleScroll)\n    }\n  }, [tabs, onActiveChange])\n\n  // \u521D\u59CB\u5316\u65F6\u8BBE\u7F6E\u7B2C\u4E00\u4E2A tab\n  useEffect(() => {\n    if (!activeTab && tabs && tabs.length > 0) {\n      setActiveTab(tabs[0])\n    }\n  }, [tabs, activeTab])\n\n  // \u624B\u52A8\u8BBE\u7F6E\u6FC0\u6D3B tab \u5E76\u6EDA\u52A8\u5230\u5BF9\u5E94\u4F4D\u7F6E\n  const handleSetActiveTab = useCallback((tab: ScrollSpyNavItem) => {\n    setActiveTab(tab)\n\n    // \u6EDA\u52A8\u5230\u5BF9\u5E94\u7684\u951A\u70B9\n    const id = tab.id || tab.href?.replace('#', '')\n    const element = document.getElementById(id)\n\n    if (element) {\n      const purchaseBar = document.getElementById('purchase-bar')\n      const navHeight = purchaseBar ? purchaseBar.clientHeight : 100\n\n      // \u8BBE\u7F6E\u624B\u52A8\u6EDA\u52A8\u6807\u5FD7\n      isManualScrollRef.current = true\n\n      // \u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E\uFF08\u5143\u7D20\u9876\u90E8 - \u5BFC\u822A\u680F\u9AD8\u5EA6 - \u989D\u5916\u95F4\u8DDD\uFF09\n      const elementTop = element.getBoundingClientRect().top + window.scrollY\n      const scrollToPosition = elementTop - navHeight - 10\n\n      window.scrollTo({\n        top: scrollToPosition,\n        behavior: 'smooth',\n      })\n\n      // \u6EDA\u52A8\u7ED3\u675F\u540E\u91CD\u7F6E\u6807\u5FD7\n      setTimeout(() => {\n        isManualScrollRef.current = false\n      }, 1000) // 1\u79D2\u540E\u91CD\u7F6E\uFF0C\u786E\u4FDD\u6EDA\u52A8\u52A8\u753B\u5B8C\u6210\n    }\n  }, [])\n\n  return { activeTab: activeTab || tabs?.[0], setActiveTab: handleSetActiveTab }\n}\n\nconst ScrollSpyNav = ({ tabs, onSpyNavItemClick, className, renderRating }: ScrollSpyNavProps) => {\n  // \u4F7F\u7528 useScrollSpy hook \u81EA\u52A8\u76D1\u542C\u6EDA\u52A8\n  const combinedTabs = useMemo(() => {\n    if (renderRating) {\n      return [...tabs, { label: 'Reviews', id: 'review', href: '' }]\n    }\n    return tabs\n  }, [tabs, renderRating])\n\n  const { activeTab, setActiveTab } = useScrollSpy(combinedTabs)\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      setActiveTab(tab)\n      onSpyNavItemClick?.(tab)\n    },\n    [onSpyNavItemClick, setActiveTab]\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 (!activeTab || !scrollContainerRef.current) return\n\n    const activeTabElement = tabRefs.current.get(activeTab.id)\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  }, [activeTab?.id])\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  // \u684C\u9762\u7AEF\u6E32\u67D3\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 === 'review' ? (\n              <div className=\"relative shrink-0 whitespace-nowrap py-[10px]\">\n                {renderRating}\n                <div\n                  className={cn(\n                    'desktop: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': activeTab?.id === tab.id,\n                    }\n                  )}\n                />\n              </div>\n            ) : (\n              <div\n                className={cn(\n                  'desktop:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]',\n                  {\n                    'text-[#1d1d1f]': activeTab?.id === tab.id,\n                  }\n                )}\n                onClick={() => onTabClick(tab)}\n              >\n                {tab.label}\n                <div\n                  className={cn(\n                    'desktop: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': activeTab?.id === tab.id,\n                    }\n                  )}\n                />\n              </div>\n            )}\n          </button>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default ScrollSpyNav\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { cn } from '../../../../../helpers/index.js'\nimport { useState, useCallback, useRef, useEffect, useMemo } from 'react'\nimport type { ScrollSpyNavItem, ScrollSpyNavProps } from './types.js'\n\n// \u81EA\u5B9A\u4E49 hook\uFF1A\u76D1\u542C\u9875\u9762\u6EDA\u52A8\uFF0C\u81EA\u52A8\u66F4\u65B0\u5F53\u524D\u6FC0\u6D3B\u7684 tab\nconst useScrollSpy = (tabs: ScrollSpyNavItem[], onActiveChange?: (tab: ScrollSpyNavItem) => void) => {\n  const [activeTab, setActiveTab] = useState<ScrollSpyNavItem | null>(null)\n  const observerRef = useRef<IntersectionObserver | null>(null)\n  const sectionsRef = useRef<Map<string, ScrollSpyNavItem>>(new Map())\n  const isManualScrollRef = useRef(false) // \u6807\u8BB0\u662F\u5426\u4E3A\u624B\u52A8\u70B9\u51FB\u89E6\u53D1\u7684\u6EDA\u52A8\n  const activeTabRef = useRef<ScrollSpyNavItem | null>(null) // \u7528 ref \u5B58\u50A8\u5F53\u524D\u6FC0\u6D3B\u7684 tab\uFF0C\u907F\u514D\u95ED\u5305\u95EE\u9898\n\n  // \u540C\u6B65 activeTab \u5230 ref\n  useEffect(() => {\n    activeTabRef.current = activeTab\n  }, [activeTab])\n\n  useEffect(() => {\n    if (!tabs || tabs.length === 0) return\n\n    // \u6E05\u7406\u4E4B\u524D\u7684 observer\n    if (observerRef.current) {\n      observerRef.current.disconnect()\n    }\n\n    // \u83B7\u53D6\u5BFC\u822A\u680F\u9AD8\u5EA6\n    const purchaseBar = document.getElementById('purchase-bar')\n    const navHeight = purchaseBar ? purchaseBar.clientHeight : 100\n\n    // \u521B\u5EFA Map \u5B58\u50A8 section \u4FE1\u606F\n    sectionsRef.current.clear()\n    const elements: Element[] = []\n\n    tabs.forEach(tab => {\n      const id = tab.id || tab.href?.replace('#', '')\n      const element = document.getElementById(id)\n      if (element) {\n        sectionsRef.current.set(id, tab)\n        elements.push(element)\n      }\n    })\n\n    if (elements.length === 0) {\n      // \u5982\u679C\u6CA1\u6709\u627E\u5230\u5143\u7D20\uFF0C\u8BBE\u7F6E\u7B2C\u4E00\u4E2A tab \u4E3A\u6FC0\u6D3B\u72B6\u6001\n      setActiveTab(tabs[0])\n      return\n    }\n\n    // \u4F7F\u7528 IntersectionObserver \u76D1\u542C\u5143\u7D20\u8FDB\u5165\u89C6\u53E3\n    const observerOptions: IntersectionObserverInit = {\n      root: null,\n      rootMargin: `-${navHeight}px 0px -50% 0px`, // \u4E0A\u65B9\u504F\u79FB\u5BFC\u822A\u680F\u9AD8\u5EA6\uFF0C\u4E0B\u65B9\u504F\u79FB50%\u89C6\u53E3\u9AD8\u5EA6\n      threshold: [0, 0.25, 0.5, 0.75, 1],\n    }\n\n    const observerCallback: IntersectionObserverCallback = entries => {\n      // \u5982\u679C\u662F\u624B\u52A8\u70B9\u51FB\u89E6\u53D1\u7684\u6EDA\u52A8\uFF0C\u4E0D\u8981\u66F4\u65B0\u72B6\u6001\n      if (isManualScrollRef.current) {\n        return\n      }\n\n      // \u68C0\u67E5\u662F\u5426\u6EDA\u52A8\u5230\u9875\u9762\u9876\u90E8\uFF08\u7279\u6B8A\u5904\u7406\u7B2C\u4E00\u4E2A\u5143\u7D20\uFF09\n      const scrollTop = window.scrollY || document.documentElement.scrollTop\n      if (scrollTop < navHeight + 50) {\n        // \u5728\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab\n        const firstTab = tabs[0]\n        if (firstTab && activeTabRef.current?.id !== firstTab.id) {\n          console.log('\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:', firstTab.label)\n          setActiveTab(firstTab)\n          onActiveChange?.(firstTab)\n        }\n        return\n      }\n\n      // \u627E\u51FA\u6240\u6709\u6B63\u5728\u4EA4\u53C9\u7684 entries\n      const intersectingEntries = entries\n        .filter(entry => entry.isIntersecting)\n        .sort((a, b) => {\n          // \u6309\u7167\u5143\u7D20\u5728\u9875\u9762\u4E0A\u7684\u4F4D\u7F6E\u6392\u5E8F\uFF08\u4ECE\u4E0A\u5230\u4E0B\uFF09\n          return a.boundingClientRect.top - b.boundingClientRect.top\n        })\n\n      if (intersectingEntries.length > 0) {\n        // \u9009\u62E9\u6700\u4E0A\u9762\u7684\u6B63\u5728\u4EA4\u53C9\u7684\u5143\u7D20\n        const topEntry = intersectingEntries[0]\n        const id = topEntry.target.id\n        const tab = sectionsRef.current.get(id)\n\n        if (tab) {\n          setActiveTab(tab)\n          onActiveChange?.(tab)\n        }\n      } else {\n        // \u5982\u679C\u6CA1\u6709\u5143\u7D20\u6B63\u5728\u4EA4\u53C9\uFF0C\u627E\u51FA\u6700\u63A5\u8FD1\u89C6\u53E3\u9876\u90E8\u7684\u5143\u7D20\n        const sortedEntries = [...entries].sort((a, b) => {\n          return Math.abs(a.boundingClientRect.top) - Math.abs(b.boundingClientRect.top)\n        })\n\n        if (sortedEntries.length > 0) {\n          const closestEntry = sortedEntries[0]\n          const id = closestEntry.target.id\n          const tab = sectionsRef.current.get(id)\n\n          if (tab) {\n            setActiveTab(tab)\n            onActiveChange?.(tab)\n          }\n        }\n      }\n    }\n\n    observerRef.current = new IntersectionObserver(observerCallback, observerOptions)\n\n    // \u89C2\u5BDF\u6240\u6709 section \u5143\u7D20\n    elements.forEach(element => {\n      observerRef.current?.observe(element)\n    })\n\n    // \u6DFB\u52A0\u6EDA\u52A8\u4E8B\u4EF6\u76D1\u542C\uFF0C\u5904\u7406\u9875\u9762\u9876\u90E8\u7684\u60C5\u51B5\n    const handleScroll = () => {\n      if (isManualScrollRef.current) {\n        return\n      }\n\n      const scrollTop = window.scrollY || document.documentElement.scrollTop\n      // \u5982\u679C\u6EDA\u52A8\u5230\u63A5\u8FD1\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab\n      if (scrollTop < navHeight + 50) {\n        const firstTab = tabs[0]\n        if (firstTab) {\n          setActiveTab(firstTab)\n          onActiveChange?.(firstTab)\n        }\n      }\n    }\n\n    window.addEventListener('scroll', handleScroll, { passive: true })\n\n    return () => {\n      if (observerRef.current) {\n        observerRef.current.disconnect()\n      }\n      window.removeEventListener('scroll', handleScroll)\n    }\n  }, [tabs, onActiveChange])\n\n  // \u521D\u59CB\u5316\u65F6\u8BBE\u7F6E\u7B2C\u4E00\u4E2A tab\n  useEffect(() => {\n    if (!activeTab && tabs && tabs.length > 0) {\n      setActiveTab(tabs[0])\n    }\n  }, [tabs, activeTab])\n\n  // \u624B\u52A8\u8BBE\u7F6E\u6FC0\u6D3B tab \u5E76\u6EDA\u52A8\u5230\u5BF9\u5E94\u4F4D\u7F6E\n  const handleSetActiveTab = useCallback((tab: ScrollSpyNavItem) => {\n    setActiveTab(tab)\n\n    // \u6EDA\u52A8\u5230\u5BF9\u5E94\u7684\u951A\u70B9\n    const id = tab.id || tab.href?.replace('#', '')\n    const element = document.getElementById(id)\n\n    if (element) {\n      const purchaseBar = document.getElementById('purchase-bar')\n      const navHeight = purchaseBar ? purchaseBar.clientHeight : 100\n\n      // \u8BBE\u7F6E\u624B\u52A8\u6EDA\u52A8\u6807\u5FD7\n      isManualScrollRef.current = true\n\n      // \u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E\uFF08\u5143\u7D20\u9876\u90E8 - \u5BFC\u822A\u680F\u9AD8\u5EA6 - \u989D\u5916\u95F4\u8DDD\uFF09\n      const elementTop = element.getBoundingClientRect().top + window.scrollY\n      const scrollToPosition = elementTop - navHeight - 10\n\n      window.scrollTo({\n        top: scrollToPosition,\n        behavior: 'smooth',\n      })\n\n      // \u6EDA\u52A8\u7ED3\u675F\u540E\u91CD\u7F6E\u6807\u5FD7\n      setTimeout(() => {\n        isManualScrollRef.current = false\n      }, 1000) // 1\u79D2\u540E\u91CD\u7F6E\uFF0C\u786E\u4FDD\u6EDA\u52A8\u52A8\u753B\u5B8C\u6210\n    }\n  }, [])\n\n  return { activeTab: activeTab || tabs?.[0], setActiveTab: handleSetActiveTab }\n}\n\nconst ScrollSpyNav = ({ tabs, onSpyNavItemClick, className, renderRating }: ScrollSpyNavProps) => {\n  // \u4F7F\u7528 useScrollSpy hook \u81EA\u52A8\u76D1\u542C\u6EDA\u52A8\n  const combinedTabs = useMemo(() => {\n    if (renderRating) {\n      return [...tabs, { label: 'Reviews', id: 'review', href: '' }]\n    }\n    return tabs\n  }, [tabs, renderRating])\n\n  const { activeTab, setActiveTab } = useScrollSpy(combinedTabs)\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      setActiveTab(tab)\n      onSpyNavItemClick?.(tab)\n    },\n    [onSpyNavItemClick, setActiveTab]\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 (!activeTab || !scrollContainerRef.current) return\n\n    const activeTabElement = tabRefs.current.get(activeTab.id)\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  }, [activeTab?.id])\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  // \u684C\u9762\u7AEF\u6E32\u67D3\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 === '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': activeTab?.id === 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]': activeTab?.id === 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': activeTab?.id === tab.id,\n                    }\n                  )}\n                />\n              </div>\n            )}\n          </button>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default ScrollSpyNav\n"],
+  "mappings": "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",
   "names": ["ScrollSpyNav_exports", "__export", "ScrollSpyNav_default", "__toCommonJS", "import_jsx_runtime", "import_helpers", "import_react", "useScrollSpy", "tabs", "onActiveChange", "activeTab", "setActiveTab", "observerRef", "sectionsRef", "isManualScrollRef", "activeTabRef", "purchaseBar", "navHeight", "elements", "tab", "id", "element", "observerOptions", "observerCallback", "entries", "firstTab", "intersectingEntries", "entry", "a", "b", "sortedEntries", "handleScroll", "handleSetActiveTab", "scrollToPosition", "ScrollSpyNav", "onSpyNavItemClick", "className", "renderRating", "combinedTabs", "scrollContainerRef", "tabRefs", "onTabClick", "activeTabElement", "container", "tabRect", "containerRect", "tabCenter", "containerCenter", "scrollOffset", "setTabRef", "tabId", "el"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";var f=Object.create;var d=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var k=(e,t)=>{for(var o in t)d(e,o,{get:t[o],enumerable:!0})},l=(e,t,o,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of v(t))!y.call(e,r)&&r!==o&&d(e,r,{get:()=>t[r],enumerable:!(s=b(t,r))||s.enumerable});return e};var N=(e,t,o)=>(o=e!=null?f(h(e)):{},l(t||!e||!e.__esModule?d(o,"default",{value:e,enumerable:!0}):o,e)),g=e=>l(d({},"__esModule",{value:!0}),e);var x={};k(x,{default:()=>w});module.exports=g(x);var a=require("react/jsx-runtime"),n=require("react"),i=require("../../../../components/index.js"),m=require("../index.js"),c=require("../../BizProductProvider.js"),p=N(require("./ScrollSpyNav/index.js")),u=require("../../../../shared/Styles.js");const P=({onSpyNavItemClick:e})=>{const{product:t,renderRating:o}=(0,c.useBizProductContext)(),s=(0,n.useMemo)(()=>t?.payload?.components?.find(r=>r.componentKey==="PurchaseBar")?.data||[],[t?.payload]);return(0,a.jsxs)("div",{id:"purchase-bar",className:"sticky left-0 top-0 z-[45] w-full border-b border-[#E4E5E6] bg-white",children:[(0,a.jsx)(i.Container,{children:(0,a.jsxs)("div",{className:"tablet:justify-between desktop:gap-16 tablet:gap-0 tablet:w-full flex flex-wrap items-center gap-[10px]",children:[(0,a.jsxs)("div",{className:"desktop:pt-6 desktop:pb-0 min-w-0 flex-1 py-3",children:[(0,a.jsx)(i.Heading,{size:2,className:"line-clamp-2",html:t?.title}),(0,a.jsx)("div",{className:"desktop:block mt-3 hidden",children:(0,a.jsx)(p.default,{tabs:s,className:"",renderRating:o,onSpyNavItemClick:e})})]}),(0,a.jsx)("div",{className:"desktop:block hidden shrink-0",children:(0,a.jsx)(m.ProductActions,{})})]})}),(0,a.jsxs)(i.Container,{className:"desktop:hidden relative",children:[(0,a.jsx)("div",{className:"absolute left-0 top-0 h-px w-full bg-[#E4E5E6]"}),(0,a.jsx)(p.default,{tabs:s,renderRating:o,onSpyNavItemClick:e})]})]})};var w=(0,u.withLayout)(P);
+"use strict";var f=Object.create;var l=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var N=(a,t)=>{for(var o in t)l(a,o,{get:t[o],enumerable:!0})},d=(a,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of v(t))!y.call(a,r)&&r!==o&&l(a,r,{get:()=>t[r],enumerable:!(i=b(t,r))||i.enumerable});return a};var g=(a,t,o)=>(o=a!=null?f(h(a)):{},d(t||!a||!a.__esModule?l(o,"default",{value:a,enumerable:!0}):o,a)),P=a=>d(l({},"__esModule",{value:!0}),a);var B={};N(B,{default:()=>x});module.exports=P(B);var e=require("react/jsx-runtime"),m=require("react"),p=require("../../../../components/index.js"),n=require("../index.js"),c=require("../../BizProductProvider.js"),s=g(require("./ScrollSpyNav/index.js")),u=require("../../../../shared/Styles.js");const w=({onSpyNavItemClick:a})=>{const{product:t,renderRating:o}=(0,c.useBizProductContext)(),i=(0,m.useMemo)(()=>t?.payload?.components?.find(r=>r.componentKey==="PurchaseBar")?.data||[],[t?.payload]);return(0,e.jsxs)("div",{id:"purchase-bar",className:"sticky left-0 top-0 z-[45] w-full border-b border-[#E4E5E6] bg-white",children:[(0,e.jsx)(p.Container,{children:(0,e.jsxs)("div",{className:"tablet:justify-between laptop-md:gap-16 tablet:gap-0 tablet:w-full flex flex-wrap items-center gap-[10px]",children:[(0,e.jsxs)("div",{className:"laptop-md:pt-6 laptop-md:pb-0 min-w-0 flex-1 py-3",children:[(0,e.jsx)(p.Heading,{size:2,className:"line-clamp-2",html:t?.title}),(0,e.jsx)("div",{className:"laptop-md:block mt-3 hidden",children:(0,e.jsx)(s.default,{tabs:i,className:"",renderRating:o,onSpyNavItemClick:a})})]}),(0,e.jsx)("div",{className:"laptop-md:block hidden shrink-0",children:(0,e.jsx)(n.ProductActions,{})})]})}),(0,e.jsxs)(p.Container,{className:"laptop-md:hidden relative",children:[(0,e.jsx)("div",{className:"absolute left-0 top-0 h-px w-full bg-[#E4E5E6]"}),(0,e.jsx)(s.default,{tabs:i,renderRating:o,onSpyNavItemClick:a})]})]})};var x=(0,u.withLayout)(w);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/biz-components/Listing/components/PurchaseBar/index.tsx"],
-  "sourcesContent": ["import { useMemo } from 'react'\nimport { Text, Heading, Button, Container } from '../../../../components/index.js'\nimport type { PurchaseBarProps } from './types.js'\nimport { ProductActions } from '../index.js'\nimport { useBizProductContext } from '../../BizProductProvider.js'\nimport ScrollSpyNav from './ScrollSpyNav/index.js'\nimport { withLayout } from '../../../../shared/Styles.js'\n\nconst PurchaseBar = ({ onSpyNavItemClick }: PurchaseBarProps) => {\n  const { product, renderRating } = useBizProductContext()\n\n  const PurchaseBarData = useMemo(() => {\n    return product?.payload?.components?.find((item: any) => item.componentKey === 'PurchaseBar')?.data || []\n  }, [product?.payload])\n\n  return (\n    <div id=\"purchase-bar\" className=\"sticky left-0 top-0 z-[45] w-full border-b border-[#E4E5E6] bg-white\">\n      <Container>\n        <div className=\"tablet:justify-between desktop:gap-16 tablet:gap-0 tablet:w-full flex flex-wrap items-center gap-[10px]\">\n          <div className=\"desktop:pt-6 desktop:pb-0 min-w-0 flex-1 py-3\">\n            <Heading size={2} className=\"line-clamp-2\" html={product?.title} />\n            <div className=\"desktop:block mt-3 hidden\">\n              <ScrollSpyNav\n                tabs={PurchaseBarData}\n                className=\"\"\n                renderRating={renderRating}\n                onSpyNavItemClick={onSpyNavItemClick}\n              />\n            </div>\n          </div>\n          <div className=\"desktop:block hidden shrink-0\">\n            <ProductActions />\n          </div>\n        </div>\n      </Container>\n      <Container className=\"desktop:hidden relative\">\n        <div className=\"absolute left-0 top-0 h-px w-full bg-[#E4E5E6]\"></div>\n        <ScrollSpyNav tabs={PurchaseBarData} renderRating={renderRating} onSpyNavItemClick={onSpyNavItemClick} />\n      </Container>\n    </div>\n  )\n}\n\nexport default withLayout(PurchaseBar)\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAmBU,IAAAI,EAAA,6BAnBVC,EAAwB,iBACxBC,EAAiD,2CAEjDC,EAA+B,uBAC/BC,EAAqC,uCACrCC,EAAyB,sCACzBC,EAA2B,wCAE3B,MAAMC,EAAc,CAAC,CAAE,kBAAAC,CAAkB,IAAwB,CAC/D,KAAM,CAAE,QAAAC,EAAS,aAAAC,CAAa,KAAI,wBAAqB,EAEjDC,KAAkB,WAAQ,IACvBF,GAAS,SAAS,YAAY,KAAMG,GAAcA,EAAK,eAAiB,aAAa,GAAG,MAAQ,CAAC,EACvG,CAACH,GAAS,OAAO,CAAC,EAErB,SACE,QAAC,OAAI,GAAG,eAAe,UAAU,uEAC/B,oBAAC,aACC,oBAAC,OAAI,UAAU,0GACb,qBAAC,OAAI,UAAU,gDACb,oBAAC,WAAQ,KAAM,EAAG,UAAU,eAAe,KAAMA,GAAS,MAAO,KACjE,OAAC,OAAI,UAAU,4BACb,mBAAC,EAAAI,QAAA,CACC,KAAMF,EACN,UAAU,GACV,aAAcD,EACd,kBAAmBF,EACrB,EACF,GACF,KACA,OAAC,OAAI,UAAU,gCACb,mBAAC,mBAAe,EAClB,GACF,EACF,KACA,QAAC,aAAU,UAAU,0BACnB,oBAAC,OAAI,UAAU,iDAAiD,KAChE,OAAC,EAAAK,QAAA,CAAa,KAAMF,EAAiB,aAAcD,EAAc,kBAAmBF,EAAmB,GACzG,GACF,CAEJ,EAEA,IAAOV,KAAQ,cAAWS,CAAW",
+  "sourcesContent": ["import { useMemo } from 'react'\nimport { Text, Heading, Button, Container } from '../../../../components/index.js'\nimport type { PurchaseBarProps } from './types.js'\nimport { ProductActions } from '../index.js'\nimport { useBizProductContext } from '../../BizProductProvider.js'\nimport ScrollSpyNav from './ScrollSpyNav/index.js'\nimport { withLayout } from '../../../../shared/Styles.js'\n\nconst PurchaseBar = ({ onSpyNavItemClick }: PurchaseBarProps) => {\n  const { product, renderRating } = useBizProductContext()\n\n  const PurchaseBarData = useMemo(() => {\n    return product?.payload?.components?.find((item: any) => item.componentKey === 'PurchaseBar')?.data || []\n  }, [product?.payload])\n\n  return (\n    <div id=\"purchase-bar\" className=\"sticky left-0 top-0 z-[45] w-full border-b border-[#E4E5E6] bg-white\">\n      <Container>\n        <div className=\"tablet:justify-between laptop-md:gap-16 tablet:gap-0 tablet:w-full flex flex-wrap items-center gap-[10px]\">\n          <div className=\"laptop-md:pt-6 laptop-md:pb-0 min-w-0 flex-1 py-3\">\n            <Heading size={2} className=\"line-clamp-2\" html={product?.title} />\n            <div className=\"laptop-md:block mt-3 hidden\">\n              <ScrollSpyNav\n                tabs={PurchaseBarData}\n                className=\"\"\n                renderRating={renderRating}\n                onSpyNavItemClick={onSpyNavItemClick}\n              />\n            </div>\n          </div>\n          <div className=\"laptop-md:block hidden shrink-0\">\n            <ProductActions />\n          </div>\n        </div>\n      </Container>\n      <Container className=\"laptop-md:hidden relative\">\n        <div className=\"absolute left-0 top-0 h-px w-full bg-[#E4E5E6]\"></div>\n        <ScrollSpyNav tabs={PurchaseBarData} renderRating={renderRating} onSpyNavItemClick={onSpyNavItemClick} />\n      </Container>\n    </div>\n  )\n}\n\nexport default withLayout(PurchaseBar)\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAmBU,IAAAI,EAAA,6BAnBVC,EAAwB,iBACxBC,EAAiD,2CAEjDC,EAA+B,uBAC/BC,EAAqC,uCACrCC,EAAyB,sCACzBC,EAA2B,wCAE3B,MAAMC,EAAc,CAAC,CAAE,kBAAAC,CAAkB,IAAwB,CAC/D,KAAM,CAAE,QAAAC,EAAS,aAAAC,CAAa,KAAI,wBAAqB,EAEjDC,KAAkB,WAAQ,IACvBF,GAAS,SAAS,YAAY,KAAMG,GAAcA,EAAK,eAAiB,aAAa,GAAG,MAAQ,CAAC,EACvG,CAACH,GAAS,OAAO,CAAC,EAErB,SACE,QAAC,OAAI,GAAG,eAAe,UAAU,uEAC/B,oBAAC,aACC,oBAAC,OAAI,UAAU,4GACb,qBAAC,OAAI,UAAU,oDACb,oBAAC,WAAQ,KAAM,EAAG,UAAU,eAAe,KAAMA,GAAS,MAAO,KACjE,OAAC,OAAI,UAAU,8BACb,mBAAC,EAAAI,QAAA,CACC,KAAMF,EACN,UAAU,GACV,aAAcD,EACd,kBAAmBF,EACrB,EACF,GACF,KACA,OAAC,OAAI,UAAU,kCACb,mBAAC,mBAAe,EAClB,GACF,EACF,KACA,QAAC,aAAU,UAAU,4BACnB,oBAAC,OAAI,UAAU,iDAAiD,KAChE,OAAC,EAAAK,QAAA,CAAa,KAAMF,EAAiB,aAAcD,EAAc,kBAAmBF,EAAmB,GACzG,GACF,CAEJ,EAEA,IAAOV,KAAQ,cAAWS,CAAW",
   "names": ["PurchaseBar_exports", "__export", "PurchaseBar_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import__", "import_BizProductProvider", "import_ScrollSpyNav", "import_Styles", "PurchaseBar", "onSpyNavItemClick", "product", "renderRating", "PurchaseBarData", "item", "ScrollSpyNav"]
 }