@anker-in/headless-ui 1.0.26-alpha.1762848170464 → 1.0.26-alpha.1762872688412
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.
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.d.ts +1 -3
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js +4 -4
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js.map +3 -3
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.d.ts +10 -0
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.js +2 -0
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.js.map +7 -0
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js.map +3 -3
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.js.map +3 -3
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.js.map +3 -3
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.d.ts +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js.map +3 -3
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/types.d.ts +3 -0
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/types.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/types.js.map +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/index.js.map +3 -3
- package/dist/cjs/biz-components/Listing/hooks/useBenefits.js +1 -1
- package/dist/cjs/biz-components/Listing/hooks/useBenefits.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.d.ts +1 -3
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js +4 -4
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.d.ts +10 -0
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.js +2 -0
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.js.map +7 -0
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ProductActions/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ProductActions/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.d.ts +1 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/types.d.ts +3 -0
- package/dist/esm/biz-components/Listing/components/PurchaseBar/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/hooks/useBenefits.js +1 -1
- package/dist/esm/biz-components/Listing/hooks/useBenefits.js.map +2 -2
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Text as c,Button as C,Grid as K,GridItem as S,Picture as P,Heading as Q}from"../../../../../components";import{useBizProductContext as O}from"../../../BizProductProvider";import{useEffect as U,useMemo as X,useState as Y}from"react";import{formatPrice as f}from"../../../utils";import{useAiuiContext as B}from"../../../../AiuiProvider";import"../../../../../helpers";import R from"decimal.js";import{replaceTemplate as Z}from"../../../utils/textFormat";const _=()=>{const{locale:d="us",copyWriting:t}=B(),{product:s,variant:l,finalPrice:u,comparePrice:m,coupon:h,selectedOptions:p,selectedVariants:o,totalSavings:N,onAddToCart:D,onBuyNow:z,savingDetail:g,checkedBundle:E,joinedRecommendBuyProducts:n,setJoinedRecommendBuyProducts:v,setCheckedGift:w,setCheckedExchangePurchase:x,setCheckedBundle:k,setSavingDetail:$,addToCartLoading:J,buyNowLoading:H,profile:F}=O(),[y]=o,M=X(()=>{const r=E?.variants.find(q=>q.variant.sku===y?.sku),W=new R(y?.price?.amount||0).minus(r?.price||y?.price?.amount).toNumber();let A=new R(y?.price?.amount||0);return F?.email&&(A=A.minus(g?.member||0)),A.minus(g?.coupon).minus(W).toNumber()},[y,E,F,g?.member,g?.coupon]);if(!l.availableForSale)return null;const{bundleVariant:j,giftVariant:G,exchangeVariant:L}=ee()||{},[i,b]=Y();return U(()=>{b({bundle:n.bundle?.value?void 0:j,gift:n.gift?.value?void 0:G,exchange:n.exchange?.value?void 0:L})},[j,G,L,n]),e("div",{className:"ipc-product-summary laptop:px-16 desktop:px-0 mt-16 desktop:mt-[96px] lg-desktop:mt-[128px]",children:e("div",{className:"bg-[#F5F5F7] laptop:rounded-2xl",children:a(K,{className:"px-4 pt-6 tablet:p-8 tablet:!pb-0",children:[a(S,{className:"col-span-12 laptop:col-start-1 laptop:col-span-5 gap-4 flex flex-col justify-between",children:[e(Q,{className:"font-bold text-[24px] lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] leading-[1] mb-4 [&>span]:text-[#D1D1D1]",html:`${s.title} is ready <br/><span>Just the way you want it.</span>`}),e("div",{className:"",children:e(P,{source:l.image?.url||s?.images?.[0]?.url,className:"lg-desktop:aspect-[644/368] desktop:aspect-[503/272] laptop:aspect-[331/191] tablet:aspect-[704/380] aspect-[358/192]",imgClassName:"object-cover h-full"})})]}),a(S,{className:"col-span-12 mt-8 pb-6 tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 flex flex-col gap-6 justify-between",children:[a("div",{children:[a("div",{className:"flex flex-col gap-4",children:[a("div",{className:"flex items-center justify-between",children:[a("div",{className:"shrink-0 flex items-center gap-4",children:[e(P,{source:l.image?.url||s?.images?.[0]?.url,className:"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg"}),a("div",{className:"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none",children:[e(c,{className:"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]",html:s.title}),e(c,{className:"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]",html:`x1 | ${p.color||p.colour||p.couleur}`})]})]}),a("div",{className:"flex items-center gap-1",children:[e(c,{className:"text-base desktop:text-2xl font-bold",html:f({amount:M,currencyCode:l.price.currencyCode,locale:d})}),N>0&&e(c,{className:"text-base desktop:text-2xl laptop:text-xl font-bold line-through text-[#6D6D6F]",html:f({amount:l?.price?.amount,currencyCode:l.price.currencyCode,locale:d})})]})]}),n?.gift?.value&&e(I,{giftOperation:r=>{w?.(void 0),v?.({...n,gift:{value:void 0,canOperate:!0}}),b?.({...i,gift:r})},status:!!n?.gift,gift:n?.gift?.value,canOperate:n?.gift?.canOperate}),n?.bundle?.value&&e(V,{bundleOperation:r=>{k?.(void 0),v?.({...n,bundle:{value:void 0,canOperate:!0}}),b?.({...i,bundle:r})},status:!!n?.bundle,bundleListItem:n?.bundle?.value,canOperate:n?.bundle?.canOperate}),n?.exchange?.value&&e(T,{exchangeOperation:r=>{x?.(void 0),v?.({...n,exchange:{value:void 0,canOperate:!0}}),b?.({...i,exchange:r})},status:!!n?.exchange,canOperate:n?.exchange?.canOperate,exchange:n?.exchange?.value})]}),(i?.bundle||i?.gift||i?.exchange)&&a("div",{className:"mt-6",children:[e(c,{className:"text-sm desktop:text-[18px] font-bold",html:"Recommend Buy"}),a("div",{className:"flex flex-col gap-6 mt-6",children:[i?.exchange&&e(T,{exchangeOperation:r=>{k?.(void 0),v?.({bundle:{value:void 0,canOperate:!0},gift:{value:n?.gift?.value,canOperate:!0},exchange:{value:r,canOperate:!0}}),b?.({...i,exchange:void 0})},canOperate:n?.exchange?.canOperate,status:!i?.exchange,exchange:i?.exchange}),i?.bundle&&e(V,{bundleOperation:r=>{w?.(void 0),x?.(void 0),$?.({...g,exchangePurchase:0}),v?.({gift:{value:void 0,canOperate:!0},exchange:{value:void 0,canOperate:!0},bundle:{value:r,canOperate:!0}}),b?.({...i,bundle:void 0})},canOperate:n?.bundle?.canOperate,status:!i?.bundle,bundleListItem:i?.bundle}),i?.gift&&e(I,{giftOperation:r=>{k?.(void 0),v?.({bundle:{value:void 0,canOperate:!0},exchange:{value:n?.exchange?.value,canOperate:!0},gift:{value:r,canOperate:!0}}),b?.({...i,gift:void 0})},canOperate:n?.gift?.canOperate,status:!i?.gift,gift:i?.gift})]})]})]}),a("div",{className:"text-right",children:[e(c,{className:"laptop:text-xl desktop:text-2xl font-bold text-right",html:`${Z(t?.totalPrice||"",{amount:f({amount:u,currencyCode:l.price.currencyCode,locale:d})})}`}),N>0&&e(c,{className:"text-base laptop:text-xl desktop:text-2xl ml-1 font-bold line-through text-[#6D6D6F]",html:f({amount:m,currencyCode:l.price.currencyCode,locale:d})}),a("div",{className:"flex gap-3 mt-2 justify-end",children:[e(C,{size:"lg",variant:"secondary",loading:J,className:"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto",onClick:()=>D?.(),children:t?.addToCart}),e(C,{size:"lg",loading:H,variant:"primary",className:"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto",onClick:()=>z?.(),children:t?.shopNow})]})]})]})]})})})},ee=()=>{const{bundle:d,variant:t,checkedBundle:s,freeGift:l,checkedGift:u,exchangePurchase:m,checkedExchangePurchase:h}=O();let p,o,N;const{bundleList:D}=d||{},{giftList:z=[]}=l||{},{giftList:g=[]}=m||{},E=D?.filter(x=>x.variants.slice(1,x.variants.length).every(k=>k.variant.availableForSale))||[],[n]=E;p=s||n;const[v]=z?.filter(x=>x.availableForSale);o=u||v;const[w]=g?.filter(x=>x.availableForSale);return N=h||w,{bundleVariant:p,giftVariant:o,exchangeVariant:N}},V=({bundleOperation:d,bundleListItem:t,canOperate:s,status:l})=>{const{locale:u="us"}=B(),{variant:m,setCheckedBundle:h}=O(),p=t?.variants.filter(o=>o.variant.sku!==m.sku);return e("div",{className:"",children:p?.map(o=>a("div",{className:"flex items-center gap-4 justify-between",children:[a("div",{className:"flex items-center gap-4",children:[e(P,{source:o?.variant?.image?.url,className:"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg"}),e("div",{className:"flex flex-col gap-[6px] line-clamp-2 max-w-[178px] tablet:max-w-none",children:e(c,{className:"font-bold text-[14px] desktop:text-[16px] lg-desktop:text-[18px]",html:o.variant.product.title})})]}),a("div",{className:"flex flex-col items-end gap-1 justify-center",children:[!!t&&a("div",{className:"flex items-center gap-1",children:[e(c,{className:"text-base desktop:text-2xl font-bold",html:f({amount:o?.price||0,locale:u,currencyCode:o.variant?.price?.currencyCode||""})}),o.price<o.variant.price.amount&&e(c,{className:"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]",html:f({amount:o.variant.price.amount||0,locale:u,currencyCode:o.variant?.price?.currencyCode||""})})]}),s&&e(C,{size:"icon",variant:"link",onClick:()=>{h?.(l?void 0:t),d?.(t)},className:"shrink-0 size-auto underline",children:l?"Remove":"Add"})]})]},o.variant.id))})},I=({giftOperation:d,gift:t,status:s,canOperate:l})=>{const{locale:u="us"}=B(),{freeGift:m,setCheckedGift:h}=O(),{freeLabel:p,count:o}=m||{};return a("div",{className:"flex items-center justify-between",children:[a("div",{className:"flex items-center gap-4",children:[e(P,{source:t?.image?.url,className:"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg"}),a("div",{className:"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none",children:[e(c,{className:"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]",html:t?.product?.title}),e(c,{className:"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]",html:`x${o} | ${p}`})]})]}),a("div",{className:"flex flex-col items-end gap-2 justify-center",children:[!!t&&a("div",{className:"flex items-center gap-1",children:[e(c,{className:"text-base desktop:text-2xl font-bold",html:p}),e(c,{className:"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]",html:f({amount:t.price.amount,locale:u,currencyCode:t.price.currencyCode})})]}),l&&e(C,{size:"icon",variant:"link",onClick:()=>{h?.(s?void 0:t),d(t)},className:"shrink-0 size-auto underline",children:s?"Remove":"Add"})]})]})},T=({exchangeOperation:d,exchange:t,canOperate:s,status:l})=>{const{locale:u="us"}=B(),{setCheckedExchangePurchase:m}=O();return a("div",{className:"flex items-center justify-between",children:[a("div",{className:"flex items-center gap-4",children:[e(P,{source:t?.image?.url,className:"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg"}),a("div",{className:"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none",children:[e(c,{className:"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]",html:t?.product?.title}),e(c,{className:"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]"})]})]}),a("div",{className:"flex flex-col items-end gap-2 justify-center",children:[!!t&&a("div",{className:"flex items-center gap-1",children:[e(c,{className:"text-base desktop:text-2xl font-bold",html:f({amount:t.finalPrice?.amount||0,locale:u,currencyCode:t.price.currencyCode})}),e(c,{className:"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]",html:f({amount:t.price?.amount||0,locale:u,currencyCode:t.price.currencyCode})})]}),s&&e(C,{size:"icon",variant:"link",onClick:()=>{m?.(l?void 0:t),d(t)},className:"shrink-0 size-auto underline",children:l?"Remove":"Add"})]})]})};var pe=_;export{pe as default};
|
|
1
|
+
import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Text as c,Button as y,Grid as Q,GridItem as R,Picture as C,Heading as U}from"../../../../../components";import{useBizProductContext as P}from"../../../BizProductProvider";import{useEffect as X,useMemo as Y,useState as Z}from"react";import{formatPrice as f}from"../../../utils";import{useAiuiContext as B}from"../../../../AiuiProvider";import V from"decimal.js";import{replaceTemplate as _}from"../../../utils/textFormat";const ee=()=>{const{locale:d="us",copyWriting:t}=B(),{product:s,variant:l,finalPrice:u,comparePrice:m,coupon:h,selectedOptions:p,selectedVariants:o,totalSavings:O,onAddToCart:D,onBuyNow:z,savingDetail:g,checkedBundle:E,joinedRecommendBuyProducts:n,setJoinedRecommendBuyProducts:v,setCheckedGift:w,setCheckedExchangePurchase:x,setCheckedBundle:N,setSavingDetail:M,addToCartLoading:J,buyNowLoading:H,profile:F}=P(),[k]=o,j=Y(()=>{const r=E?.variants.find(K=>K.variant.sku===k?.sku),W=new V(k?.price?.amount||0).minus(r?.price||k?.price?.amount).toNumber();let A=new V(k?.price?.amount||0);F?.email&&(A=A.minus(g?.member||0));const q=A.minus(g?.coupon).minus(W).toNumber();return Math.floor(q*100)/100},[k,E,F,g?.member,g?.coupon]);if(!l.availableForSale)return null;const{bundleVariant:G,giftVariant:L,exchangeVariant:S}=te()||{},[i,b]=Z();return X(()=>{b({bundle:n.bundle?.value?void 0:G,gift:n.gift?.value?void 0:L,exchange:n.exchange?.value?void 0:S})},[G,L,S,n]),e("div",{className:"ipc-product-summary laptop:px-16 desktop:px-0 mt-16 desktop:mt-[96px] lg-desktop:mt-[128px]",children:e("div",{className:"bg-[#F5F5F7] laptop:rounded-2xl",children:a(Q,{className:"px-4 pt-6 tablet:p-8 tablet:!pb-0",children:[a(R,{className:"col-span-12 laptop:col-start-1 laptop:col-span-5 gap-4 flex flex-col justify-between",children:[e(U,{className:"font-bold text-[24px] lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] leading-[1] mb-4 [&>span]:text-[#D1D1D1]",html:`${s.title} is ready <br/><span>Just the way you want it.</span>`}),e("div",{className:"",children:e(C,{source:l.image?.url||s?.images?.[0]?.url,className:"lg-desktop:aspect-[644/368] desktop:aspect-[503/272] laptop:aspect-[331/191] tablet:aspect-[704/380] aspect-[358/192]",imgClassName:"object-cover h-full"})})]}),a(R,{className:"col-span-12 mt-8 pb-6 tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 flex flex-col gap-6 justify-between",children:[a("div",{children:[a("div",{className:"flex flex-col gap-4",children:[a("div",{className:"flex items-center justify-between",children:[a("div",{className:"shrink-0 flex items-center gap-4",children:[e(C,{source:l.image?.url||s?.images?.[0]?.url,className:"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg"}),a("div",{className:"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none",children:[e(c,{className:"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]",html:s.title}),e(c,{className:"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]",html:`x1 | ${p.color||p.colour||p.couleur}`})]})]}),a("div",{className:"flex items-center gap-1",children:[e(c,{className:"text-base desktop:text-2xl font-bold",html:f({amount:j,currencyCode:l.price.currencyCode,locale:d})}),j<l?.price?.amount&&e(c,{className:"text-base desktop:text-2xl laptop:text-xl font-bold line-through text-[#6D6D6F]",html:f({amount:l?.price?.amount,currencyCode:l.price.currencyCode,locale:d})})]})]}),n?.gift?.value&&e(T,{giftOperation:r=>{w?.(void 0),v?.({...n,gift:{value:void 0,canOperate:!0}}),b?.({...i,gift:r})},status:!!n?.gift,gift:n?.gift?.value,canOperate:n?.gift?.canOperate}),n?.bundle?.value&&e(I,{bundleOperation:r=>{N?.(void 0),v?.({...n,bundle:{value:void 0,canOperate:!0}}),b?.({...i,bundle:r})},status:!!n?.bundle,bundleListItem:n?.bundle?.value,canOperate:n?.bundle?.canOperate}),n?.exchange?.value&&e($,{exchangeOperation:r=>{x?.(void 0),v?.({...n,exchange:{value:void 0,canOperate:!0}}),b?.({...i,exchange:r})},status:!!n?.exchange,canOperate:n?.exchange?.canOperate,exchange:n?.exchange?.value})]}),(i?.bundle||i?.gift||i?.exchange)&&a("div",{className:"mt-6",children:[e(c,{className:"text-sm desktop:text-[18px] font-bold",html:"Recommend Buy"}),a("div",{className:"flex flex-col gap-6 mt-6",children:[i?.exchange&&e($,{exchangeOperation:r=>{N?.(void 0),v?.({bundle:{value:void 0,canOperate:!0},gift:{value:n?.gift?.value,canOperate:!0},exchange:{value:r,canOperate:!0}}),b?.({...i,exchange:void 0})},canOperate:n?.exchange?.canOperate,status:!i?.exchange,exchange:i?.exchange}),i?.bundle&&e(I,{bundleOperation:r=>{w?.(void 0),x?.(void 0),M?.({...g,exchangePurchase:0}),v?.({gift:{value:void 0,canOperate:!0},exchange:{value:void 0,canOperate:!0},bundle:{value:r,canOperate:!0}}),b?.({...i,bundle:void 0})},canOperate:n?.bundle?.canOperate,status:!i?.bundle,bundleListItem:i?.bundle}),i?.gift&&e(T,{giftOperation:r=>{N?.(void 0),v?.({bundle:{value:void 0,canOperate:!0},exchange:{value:n?.exchange?.value,canOperate:!0},gift:{value:r,canOperate:!0}}),b?.({...i,gift:void 0})},canOperate:n?.gift?.canOperate,status:!i?.gift,gift:i?.gift})]})]})]}),a("div",{className:"text-right",children:[e(c,{className:"laptop:text-xl desktop:text-2xl font-bold text-right",html:`${_(t?.totalPrice||"",{amount:f({amount:Math.floor(u*100)/100,currencyCode:l.price.currencyCode,locale:d})})}`}),O>0&&e(c,{className:"text-base laptop:text-xl desktop:text-2xl ml-1 font-bold line-through text-[#6D6D6F]",html:f({amount:m,currencyCode:l.price.currencyCode,locale:d})}),a("div",{className:"flex gap-3 mt-2 justify-end",children:[e(y,{size:"lg",variant:"secondary",loading:J,className:"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto",onClick:()=>D?.(),children:t?.addToCart}),e(y,{size:"lg",loading:H,variant:"primary",className:"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto",onClick:()=>z?.(),children:t?.shopNow})]})]})]})]})})})},te=()=>{const{bundle:d,variant:t,checkedBundle:s,freeGift:l,checkedGift:u,exchangePurchase:m,checkedExchangePurchase:h}=P();let p,o,O;const{bundleList:D}=d||{},{giftList:z=[]}=l||{},{giftList:g=[]}=m||{},E=D?.filter(x=>x.variants.slice(1,x.variants.length).every(N=>N.variant.availableForSale))||[],[n]=E;p=s||n;const[v]=z?.filter(x=>x.availableForSale);o=u||v;const[w]=g?.filter(x=>x.availableForSale);return O=h||w,{bundleVariant:p,giftVariant:o,exchangeVariant:O}},I=({bundleOperation:d,bundleListItem:t,canOperate:s,status:l})=>{const{locale:u="us"}=B(),{variant:m,setCheckedBundle:h}=P(),p=t?.variants.filter(o=>o.variant.sku!==m.sku);return e("div",{className:"",children:p?.map(o=>a("div",{className:"flex items-center gap-4 justify-between",children:[a("div",{className:"flex items-center gap-4",children:[e(C,{source:o?.variant?.image?.url,className:"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg"}),e("div",{className:"flex flex-col gap-[6px] line-clamp-2 max-w-[178px] tablet:max-w-none",children:e(c,{className:"font-bold text-[14px] desktop:text-[16px] lg-desktop:text-[18px]",html:o.variant.product.title})})]}),a("div",{className:"flex flex-col items-end gap-1 justify-center",children:[!!t&&a("div",{className:"flex items-center gap-1",children:[e(c,{className:"text-base desktop:text-2xl font-bold",html:f({amount:o?.price||0,locale:u,currencyCode:o.variant?.price?.currencyCode||""})}),o.price<o.variant.price.amount&&e(c,{className:"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]",html:f({amount:o.variant.price.amount||0,locale:u,currencyCode:o.variant?.price?.currencyCode||""})})]}),s&&e(y,{size:"icon",variant:"link",onClick:()=>{h?.(l?void 0:t),d?.(t)},className:"shrink-0 size-auto underline",children:l?"Remove":"Add"})]})]},o.variant.id))})},T=({giftOperation:d,gift:t,status:s,canOperate:l})=>{const{locale:u="us"}=B(),{freeGift:m,setCheckedGift:h}=P(),{freeLabel:p,count:o}=m||{};return a("div",{className:"flex items-center justify-between",children:[a("div",{className:"flex items-center gap-4",children:[e(C,{source:t?.image?.url,className:"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg"}),a("div",{className:"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none",children:[e(c,{className:"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]",html:t?.product?.title}),e(c,{className:"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]",html:`x${o} | ${p}`})]})]}),a("div",{className:"flex flex-col items-end gap-2 justify-center",children:[!!t&&a("div",{className:"flex items-center gap-1",children:[e(c,{className:"text-base desktop:text-2xl font-bold",html:p}),e(c,{className:"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]",html:f({amount:t.price.amount,locale:u,currencyCode:t.price.currencyCode})})]}),l&&e(y,{size:"icon",variant:"link",onClick:()=>{h?.(s?void 0:t),d(t)},className:"shrink-0 size-auto underline",children:s?"Remove":"Add"})]})]})},$=({exchangeOperation:d,exchange:t,canOperate:s,status:l})=>{const{locale:u="us"}=B(),{setCheckedExchangePurchase:m}=P();return a("div",{className:"flex items-center justify-between",children:[a("div",{className:"flex items-center gap-4",children:[e(C,{source:t?.image?.url,className:"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg"}),a("div",{className:"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none",children:[e(c,{className:"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]",html:t?.product?.title}),e(c,{className:"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]"})]})]}),a("div",{className:"flex flex-col items-end gap-2 justify-center",children:[!!t&&a("div",{className:"flex items-center gap-1",children:[e(c,{className:"text-base desktop:text-2xl font-bold",html:f({amount:t.finalPrice?.amount||0,locale:u,currencyCode:t.price.currencyCode})}),e(c,{className:"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]",html:f({amount:t.price?.amount||0,locale:u,currencyCode:t.price.currencyCode})})]}),s&&e(y,{size:"icon",variant:"link",onClick:()=>{m?.(l?void 0:t),d(t)},className:"shrink-0 size-auto underline",children:l?"Remove":"Add"})]})]})};var ue=ee;export{ue as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../src/biz-components/Listing/components/ProductCard/ProductSummary/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Text, Button, Container, Grid, GridItem, Picture, Heading } from '../../../../../components'\nimport { useBizProductContext } from '../../../BizProductProvider'\nimport { useEffect, useMemo, useState } from 'react'\nimport { formatPrice } from '../../../utils'\nimport { useAiuiContext } from '../../../../AiuiProvider'\nimport type { BundleListItem, ProductVariant, ProductPrice } from '../../../types/product'\nimport { cn } from '../../../../../helpers'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat'\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 setCheckedGift,\n setCheckedExchangePurchase,\n setCheckedBundle,\n setSavingDetail,\n addToCartLoading,\n buyNowLoading,\n profile,\n } = useBizProductContext()\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 return currentProductPrice.minus(savingDetail?.coupon).minus(currentBundlePrice).toNumber()\n }, [currentProductVariant, checkedBundle, profile, savingDetail?.member, savingDetail?.coupon])\n\n const isAvailable = variant.availableForSale\n if (!isAvailable) return null\n\n const { bundleVariant, giftVariant, exchangeVariant } = useRecommendBuyProducts() || {}\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 return (\n <div className=\"ipc-product-summary laptop:px-16 desktop:px-0 mt-16 desktop:mt-[96px] lg-desktop:mt-[128px]\">\n <div className=\"bg-[#F5F5F7] laptop:rounded-2xl\">\n <Grid className=\"px-4 pt-6 tablet:p-8 tablet:!pb-0\">\n <GridItem className=\"col-span-12 laptop:col-start-1 laptop:col-span-5 gap-4 flex flex-col justify-between\">\n <Heading\n className=\"font-bold text-[24px] lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] leading-[1] mb-4 [&>span]:text-[#D1D1D1]\"\n html={`${product.title} is ready <br/><span>Just the way you want it.</span>`}\n />\n <div className=\"\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"lg-desktop:aspect-[644/368] desktop:aspect-[503/272] laptop:aspect-[331/191] tablet:aspect-[704/380] aspect-[358/192]\"\n imgClassName=\"object-cover h-full\"\n />\n </div>\n </GridItem>\n <GridItem className=\"col-span-12 mt-8 pb-6 tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 flex flex-col gap-6 justify-between\">\n <div>\n <div className=\"flex flex-col gap-4\">\n <div className=\"flex items-center justify-between\">\n <div className=\"shrink-0 flex items-center gap-4\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={product.title}\n />\n <Text\n className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\"\n html={`x1 | ${selectedOptions.color || selectedOptions.colour || selectedOptions.couleur}`}\n />\n </div>\n </div>\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: summaryFinalPrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n {totalSavings > 0 && (\n <Text\n className=\"text-base desktop:text-2xl laptop:text-xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: variant?.price?.amount,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n </div>\n </div>\n {joinedRecommendBuyProducts?.gift?.value && (\n <ProductGiftSummary\n giftOperation={gift => {\n setCheckedGift?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n gift: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift })\n }}\n status={!!joinedRecommendBuyProducts?.gift}\n gift={joinedRecommendBuyProducts?.gift?.value}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n />\n )}\n {joinedRecommendBuyProducts?.bundle?.value && (\n <ProductBundleSummary\n bundleOperation={bundle => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n bundle: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle })\n }}\n status={!!joinedRecommendBuyProducts?.bundle}\n bundleListItem={joinedRecommendBuyProducts?.bundle?.value}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n />\n )}\n {joinedRecommendBuyProducts?.exchange?.value && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setCheckedExchangePurchase?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n exchange: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange })\n }}\n status={!!joinedRecommendBuyProducts?.exchange}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n exchange={joinedRecommendBuyProducts?.exchange?.value}\n />\n )}\n </div>\n {(initialRecommendBuyProducts?.bundle ||\n initialRecommendBuyProducts?.gift ||\n initialRecommendBuyProducts?.exchange) && (\n <div className=\"mt-6\">\n <Text className=\"text-sm desktop:text-[18px] font-bold\" html={'Recommend Buy'} />\n <div className=\"flex flex-col gap-6 mt-6\">\n {initialRecommendBuyProducts?.exchange && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n gift: {\n value: joinedRecommendBuyProducts?.gift?.value,\n canOperate: true,\n },\n exchange: {\n value: exchange,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange: undefined })\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 setCheckedGift?.(undefined)\n setCheckedExchangePurchase?.(undefined)\n setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n setJoinedRecommendBuyProducts?.({\n gift: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: undefined,\n canOperate: true,\n },\n bundle: {\n value: bundle,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle: undefined })\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 setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: joinedRecommendBuyProducts?.exchange?.value,\n canOperate: true,\n },\n gift: {\n value: gift,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift: undefined })\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 font-bold text-right\"\n html={`${replaceTemplate(copyWriting?.totalPrice || '', { amount: formatPrice({ amount: finalPrice, currencyCode: variant.price.currencyCode, locale }) })}`}\n />\n\n {totalSavings > 0 && (\n <Text\n className=\"text-base laptop:text-xl desktop:text-2xl ml-1 font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: comparePrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n <div className=\"flex gap-3 mt-2 justify-end\">\n <Button\n size=\"lg\"\n variant=\"secondary\"\n loading={addToCartLoading}\n className=\"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto\"\n onClick={() => onAddToCart?.()}\n >\n {copyWriting?.addToCart}\n </Button>\n <Button\n size=\"lg\"\n loading={buyNowLoading}\n variant=\"primary\"\n className=\"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto\"\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' } = 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 gap-4 justify-between\" key={bundleVariant.variant.id}>\n <div className=\"flex items-center gap-4\">\n <Picture\n source={bundleVariant?.variant?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] line-clamp-2 max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] desktop:text-[16px] lg-desktop:text-[18px]\"\n html={bundleVariant.variant.product.title}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-1 justify-center\">\n {!!bundleListItem && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl 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=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\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=\"shrink-0 size-auto underline\"\n >\n {!!status ? 'Remove' : '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' } = useAiuiContext()\n const { freeGift, setCheckedGift } = useBizProductContext()\n const { freeLabel, count } = freeGift || {}\n\n return (\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={gift?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={gift?.product?.title}\n />\n <Text\n className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\"\n html={`x${count} | ${freeLabel}`}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-2 justify-center\">\n {!!gift && (\n <div className=\"flex items-center gap-1\">\n <Text className=\"text-base desktop:text-2xl font-bold\" html={freeLabel} />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\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=\"shrink-0 size-auto underline\"\n >\n {status ? 'Remove' : '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' } = useAiuiContext()\n const { setCheckedExchangePurchase } = useBizProductContext()\n\n return (\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={exchange?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={exchange?.product?.title}\n />\n <Text className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\" />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-2 justify-center\">\n {!!exchange && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: exchange.finalPrice?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\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=\"shrink-0 size-auto underline\"\n >\n {status ? 'Remove' : 'Add'}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nexport default ProductSummary\n"],
|
|
5
|
-
"mappings": "AAwEU,OACE,OAAAA,EADF,QAAAC,MAAA,oBAxEV,OAAS,QAAAC,EAAM,UAAAC,EAAmB,QAAAC,EAAM,YAAAC,EAAU,WAAAC,EAAS,WAAAC,MAAe,4BAC1E,OAAS,wBAAAC,MAA4B,8BACrC,OAAS,aAAAC,EAAW,WAAAC,EAAS,YAAAC,MAAgB,QAC7C,OAAS,eAAAC,MAAmB,iBAC5B,OAAS,kBAAAC,MAAsB,2BAE/B,
|
|
4
|
+
"sourcesContent": ["import { Text, Button, Container, Grid, GridItem, Picture, Heading } from '../../../../../components'\nimport { useBizProductContext } from '../../../BizProductProvider'\nimport { useEffect, useMemo, useState } from 'react'\nimport { formatPrice } from '../../../utils'\nimport { useAiuiContext } from '../../../../AiuiProvider'\nimport type { BundleListItem, ProductVariant, ProductPrice } from '../../../types/product'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat'\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 setCheckedGift,\n setCheckedExchangePurchase,\n setCheckedBundle,\n setSavingDetail,\n addToCartLoading,\n buyNowLoading,\n profile,\n } = useBizProductContext()\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 isAvailable = variant.availableForSale\n if (!isAvailable) return null\n\n const { bundleVariant, giftVariant, exchangeVariant } = useRecommendBuyProducts() || {}\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 return (\n <div className=\"ipc-product-summary laptop:px-16 desktop:px-0 mt-16 desktop:mt-[96px] lg-desktop:mt-[128px]\">\n <div className=\"bg-[#F5F5F7] laptop:rounded-2xl\">\n <Grid className=\"px-4 pt-6 tablet:p-8 tablet:!pb-0\">\n <GridItem className=\"col-span-12 laptop:col-start-1 laptop:col-span-5 gap-4 flex flex-col justify-between\">\n <Heading\n className=\"font-bold text-[24px] lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] leading-[1] mb-4 [&>span]:text-[#D1D1D1]\"\n html={`${product.title} is ready <br/><span>Just the way you want it.</span>`}\n />\n <div className=\"\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"lg-desktop:aspect-[644/368] desktop:aspect-[503/272] laptop:aspect-[331/191] tablet:aspect-[704/380] aspect-[358/192]\"\n imgClassName=\"object-cover h-full\"\n />\n </div>\n </GridItem>\n <GridItem className=\"col-span-12 mt-8 pb-6 tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 flex flex-col gap-6 justify-between\">\n <div>\n <div className=\"flex flex-col gap-4\">\n <div className=\"flex items-center justify-between\">\n <div className=\"shrink-0 flex items-center gap-4\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={product.title}\n />\n <Text\n className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\"\n html={`x1 | ${selectedOptions.color || selectedOptions.colour || selectedOptions.couleur}`}\n />\n </div>\n </div>\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl 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=\"text-base desktop:text-2xl laptop:text-xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: variant?.price?.amount,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n </div>\n </div>\n {joinedRecommendBuyProducts?.gift?.value && (\n <ProductGiftSummary\n giftOperation={gift => {\n setCheckedGift?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n gift: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift })\n }}\n status={!!joinedRecommendBuyProducts?.gift}\n gift={joinedRecommendBuyProducts?.gift?.value}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n />\n )}\n {joinedRecommendBuyProducts?.bundle?.value && (\n <ProductBundleSummary\n bundleOperation={bundle => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n bundle: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle })\n }}\n status={!!joinedRecommendBuyProducts?.bundle}\n bundleListItem={joinedRecommendBuyProducts?.bundle?.value}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n />\n )}\n {joinedRecommendBuyProducts?.exchange?.value && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setCheckedExchangePurchase?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n exchange: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange })\n }}\n status={!!joinedRecommendBuyProducts?.exchange}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n exchange={joinedRecommendBuyProducts?.exchange?.value}\n />\n )}\n </div>\n {(initialRecommendBuyProducts?.bundle ||\n initialRecommendBuyProducts?.gift ||\n initialRecommendBuyProducts?.exchange) && (\n <div className=\"mt-6\">\n <Text className=\"text-sm desktop:text-[18px] font-bold\" html={'Recommend Buy'} />\n <div className=\"flex flex-col gap-6 mt-6\">\n {initialRecommendBuyProducts?.exchange && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n gift: {\n value: joinedRecommendBuyProducts?.gift?.value,\n canOperate: true,\n },\n exchange: {\n value: exchange,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange: undefined })\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 setCheckedGift?.(undefined)\n setCheckedExchangePurchase?.(undefined)\n setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n setJoinedRecommendBuyProducts?.({\n gift: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: undefined,\n canOperate: true,\n },\n bundle: {\n value: bundle,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle: undefined })\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 setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: joinedRecommendBuyProducts?.exchange?.value,\n canOperate: true,\n },\n gift: {\n value: gift,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift: undefined })\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 font-bold text-right\"\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=\"text-base laptop:text-xl desktop:text-2xl ml-1 font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: comparePrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n <div className=\"flex gap-3 mt-2 justify-end\">\n <Button\n size=\"lg\"\n variant=\"secondary\"\n loading={addToCartLoading}\n className=\"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto\"\n onClick={() => onAddToCart?.()}\n >\n {copyWriting?.addToCart}\n </Button>\n <Button\n size=\"lg\"\n loading={buyNowLoading}\n variant=\"primary\"\n className=\"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto\"\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' } = 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 gap-4 justify-between\" key={bundleVariant.variant.id}>\n <div className=\"flex items-center gap-4\">\n <Picture\n source={bundleVariant?.variant?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] line-clamp-2 max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] desktop:text-[16px] lg-desktop:text-[18px]\"\n html={bundleVariant.variant.product.title}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-1 justify-center\">\n {!!bundleListItem && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl 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=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\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=\"shrink-0 size-auto underline\"\n >\n {!!status ? 'Remove' : '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' } = useAiuiContext()\n const { freeGift, setCheckedGift } = useBizProductContext()\n const { freeLabel, count } = freeGift || {}\n\n return (\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={gift?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={gift?.product?.title}\n />\n <Text\n className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\"\n html={`x${count} | ${freeLabel}`}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-2 justify-center\">\n {!!gift && (\n <div className=\"flex items-center gap-1\">\n <Text className=\"text-base desktop:text-2xl font-bold\" html={freeLabel} />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\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=\"shrink-0 size-auto underline\"\n >\n {status ? 'Remove' : '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' } = useAiuiContext()\n const { setCheckedExchangePurchase } = useBizProductContext()\n\n return (\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={exchange?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={exchange?.product?.title}\n />\n <Text className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\" />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-2 justify-center\">\n {!!exchange && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: exchange.finalPrice?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\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=\"shrink-0 size-auto underline\"\n >\n {status ? 'Remove' : 'Add'}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nexport default ProductSummary\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["jsx", "jsxs", "Text", "Button", "Grid", "GridItem", "Picture", "Heading", "useBizProductContext", "useEffect", "useMemo", "useState", "formatPrice", "useAiuiContext", "Decimal", "replaceTemplate", "ProductSummary", "locale", "copyWriting", "product", "variant", "finalPrice", "comparePrice", "coupon", "selectedOptions", "selectedVariants", "totalSavings", "onAddToCart", "onBuyNow", "savingDetail", "checkedBundle", "joinedRecommendBuyProducts", "setJoinedRecommendBuyProducts", "setCheckedGift", "setCheckedExchangePurchase", "setCheckedBundle", "setSavingDetail", "addToCartLoading", "buyNowLoading", "profile", "currentProductVariant", "summaryFinalPrice", "currentBundleVariant", "v", "currentBundlePrice", "currentProductPrice", "bundleVariant", "giftVariant", "exchangeVariant", "useRecommendBuyProducts", "initialRecommendBuyProducts", "setInitialRecommendBuyProducts", "ProductGiftSummary", "gift", "ProductBundleSummary", "bundle", "ProductExchangeSummary", "exchange", "freeGift", "checkedGift", "exchangePurchase", "checkedExchangePurchase", "bundleList", "giftList", "exchangeList", "availableBundleList", "firstAvailableBundle", "firstAvailableGift", "firstAvailableExchange", "bundleOperation", "bundleListItem", "canOperate", "status", "bundleVariants", "giftOperation", "freeLabel", "count", "exchangeOperation", "ProductSummary_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as o,jsxs as m}from"react/jsx-runtime";import{Text as l,Button as d}from"../../../../../components";import{useAiuiContext as C}from"../../../../AiuiProvider/index.js";import{useBizProductContext as N}from"../../../BizProductProvider.js";import{useMemo as s}from"react";import{formatPrice as n}from"../../../utils";import{replaceTemplate as u}from"../../../utils/textFormat";const w=()=>{const{copyWriting:t,locale:a="us"}=C(),{variant:e,finalPrice:p,totalSavings:i,memberFunctionResult:S,isLogin:c,comparePrice:x,onAddToCart:b,onBuyNow:g,savingDetail:r,coupon:h,addToCartLoading:f,buyNowLoading:v,profile:k}=N(),y=s(()=>u(t?.totalSavings||"",{amount:n({amount:i,currencyCode:e.price.currencyCode,locale:a})}),[t?.totalSavings,i,e.price.currencyCode,a]),P=s(()=>u(t?.memberSaving||"",{amount:n({amount:r?.member,currencyCode:e.price.currencyCode,locale:a})}),[t?.memberSaving,r?.member,e.price.currencyCode,a]);return m("div",{className:"bg-white py-3 px-4 tablet:p-0 tablet:flex tablet:items-center tablet:gap-4",children:[e.availableForSale?m("div",{className:"flex flex-col justify-between desktop:items-end",children:[m("div",{className:"flex items-center gap-1",children:[o(l,{className:"text-xl font-bold !leading-[1.2] desktop:text-xl lg-desktop:text-2xl",html:n({amount:Math.floor(p*100)/100,currencyCode:e.price.currencyCode,locale:a})}),(i>0||r?.member>0&&c)&&o(l,{className:"text-xl font-bold line-through text-[#999] !leading-[1.2] desktop:text-xl lg-desktop:text-2xl",html:n({amount:x,currencyCode:e.price.currencyCode,locale:a})}),r?.member>0&&c&&o(l,{className:"bg-brand-0 font-bold text-white px-1 py-[2px] text-sm rounded",html:t?.memberPrice||"Member Price"})]}),(i>0||r?.member>0&&c)&&o(l,{className:"text-brand-0 text-[18px] !leading-[1.2] font-bold desktop:text-xl lg-desktop:text-2xl",html:`${y}`})]}):o(l,{className:"text-[20px] font-bold text-[#999999]",html:t?.soldOut??"Sold Out"}),m("div",{className:"flex items-center gap-2 mt-2 tablet:mt-0",children:[o(d,{variant:"secondary",disabled:!e.availableForSale,size:"lg",className:"w-1/2 tablet:w-auto",onClick:()=>b?.(),loading:f,children:t?.addToCart??"Add to Cart"}),o(d,{variant:"primary",disabled:!e.availableForSale,size:"lg",loading:v,className:"w-1/2 tablet:w-auto",onClick:()=>g?.(),children:t?.buyNow??"Buy Now"})]})]})};var M=w;export{M as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../src/biz-components/Listing/components/PurchaseBar/ProductActions/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Text, Button } from '../../../../../components'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useMemo } from 'react'\nimport { formatPrice } from '../../../utils'\nimport { replaceTemplate } from '../../../utils/textFormat'\
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "Text", "Button", "useAiuiContext", "useBizProductContext", "useMemo", "formatPrice", "replaceTemplate", "ProductActions", "copyWriting", "locale", "variant", "finalPrice", "totalSavings", "memberFunctionResult", "isLogin", "comparePrice", "onAddToCart", "onBuyNow", "savingDetail", "coupon", "addToCartLoading", "buyNowLoading", "profile", "
|
|
4
|
+
"sourcesContent": ["import { Text, Button } from '../../../../../components'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useMemo } from 'react'\nimport { formatPrice } from '../../../utils'\nimport { replaceTemplate } from '../../../utils/textFormat'\n\nconst ProductActions = () => {\n const { copyWriting, locale = 'us' } = useAiuiContext()\n const {\n variant,\n finalPrice,\n totalSavings,\n memberFunctionResult,\n isLogin,\n comparePrice,\n onAddToCart,\n onBuyNow,\n savingDetail,\n coupon,\n addToCartLoading,\n buyNowLoading,\n profile,\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 <div className=\"bg-white py-3 px-4 tablet:p-0 tablet:flex tablet:items-center tablet:gap-4\">\n {variant.availableForSale ? (\n <div className=\"flex flex-col justify-between desktop:items-end\">\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-xl font-bold !leading-[1.2] desktop:text-xl lg-desktop:text-2xl\"\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=\"text-xl font-bold line-through text-[#999] !leading-[1.2] desktop:text-xl lg-desktop:text-2xl\"\n html={formatPrice({\n amount: comparePrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n {savingDetail?.member > 0 && isLogin && (\n <Text className=\"bg-brand-0 font-bold text-white px-1 py-[2px] text-sm rounded\" html={copyWriting?.memberPrice || 'Member Price'} />\n )}\n </div>\n {(totalSavings > 0 || (savingDetail?.member > 0 && isLogin)) && (\n <Text\n className=\"text-brand-0 text-[18px] !leading-[1.2] font-bold desktop:text-xl lg-desktop:text-2xl\"\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=\"flex items-center gap-2 mt-2 tablet:mt-0\">\n <Button\n variant=\"secondary\"\n disabled={!variant.availableForSale}\n size=\"lg\"\n className=\"w-1/2 tablet:w-auto\"\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=\"w-1/2 tablet:w-auto\"\n onClick={() => onBuyNow?.()}\n >\n {copyWriting?.buyNow ?? 'Buy Now'}\n </Button>\n </div>\n </div>\n )\n}\n\nexport default ProductActions\n"],
|
|
5
|
+
"mappings": "AA6CU,OACE,OAAAA,EADF,QAAAC,MAAA,oBA7CV,OAAS,QAAAC,EAAM,UAAAC,MAAc,4BAC7B,OAAS,kBAAAC,MAAsB,oCAC/B,OAAS,wBAAAC,MAA4B,iCACrC,OAAS,WAAAC,MAAe,QACxB,OAAS,eAAAC,MAAmB,iBAC5B,OAAS,mBAAAC,MAAuB,4BAEhC,MAAMC,EAAiB,IAAM,CAC3B,KAAM,CAAE,YAAAC,EAAa,OAAAC,EAAS,IAAK,EAAIP,EAAe,EAChD,CACJ,QAAAQ,EACA,WAAAC,EACA,aAAAC,EACA,qBAAAC,EACA,QAAAC,EACA,aAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,OAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,QAAAC,CACF,EAAInB,EAAqB,EAEnBoB,EAAmBnB,EAAQ,IACxBE,EAAgBE,GAAa,cAAgB,GAAI,CACtD,OAAQH,EAAY,CAAE,OAAQO,EAAc,aAAcF,EAAQ,MAAM,aAAc,OAAAD,CAAO,CAAC,CAChG,CAAC,EACA,CAACD,GAAa,aAAcI,EAAcF,EAAQ,MAAM,aAAcD,CAAM,CAAC,EAE1Ee,EAAsBpB,EAAQ,IAC3BE,EAAgBE,GAAa,cAAgB,GAAI,CACtD,OAAQH,EAAY,CAClB,OAAQa,GAAc,OACtB,aAAcR,EAAQ,MAAM,aAC5B,OAAAD,CACF,CAAC,CACH,CAAC,EACA,CAACD,GAAa,aAAcU,GAAc,OAAQR,EAAQ,MAAM,aAAcD,CAAM,CAAC,EAExF,OACEV,EAAC,OAAI,UAAU,6EACZ,UAAAW,EAAQ,iBACPX,EAAC,OAAI,UAAU,kDACb,UAAAA,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACE,EAAA,CACC,UAAU,uEACV,KAAMK,EAAY,CAChB,OAAQ,KAAK,MAAMM,EAAa,GAAG,EAAI,IACvC,aAAcD,EAAQ,MAAM,aAC5B,OAAAD,CACF,CAAC,EACH,GACEG,EAAe,GAAMM,GAAc,OAAS,GAAKJ,IACjDhB,EAACE,EAAA,CACC,UAAU,gGACV,KAAMK,EAAY,CAChB,OAAQU,EACR,aAAcL,EAAQ,MAAM,aAC5B,OAAAD,CACF,CAAC,EACH,EAEDS,GAAc,OAAS,GAAKJ,GAC3BhB,EAACE,EAAA,CAAK,UAAU,gEAAgE,KAAMQ,GAAa,aAAe,eAAgB,GAEtI,GACEI,EAAe,GAAMM,GAAc,OAAS,GAAKJ,IACjDhB,EAACE,EAAA,CACC,UAAU,wFACV,KAAM,GAAGuB,CAAgB,GAC3B,GAEJ,EAEAzB,EAACE,EAAA,CAAK,UAAU,uCAAuC,KAAMQ,GAAa,SAAW,WAAY,EAEnGT,EAAC,OAAI,UAAU,2CACb,UAAAD,EAACG,EAAA,CACC,QAAQ,YACR,SAAU,CAACS,EAAQ,iBACnB,KAAK,KACL,UAAU,sBACV,QAAS,IAAMM,IAAc,EAC7B,QAASI,EAER,SAAAZ,GAAa,WAAa,cAC7B,EACAV,EAACG,EAAA,CACC,QAAQ,UACR,SAAU,CAACS,EAAQ,iBACnB,KAAK,KACL,QAASW,EACT,UAAU,sBACV,QAAS,IAAMJ,IAAW,EAEzB,SAAAT,GAAa,QAAU,UAC1B,GACF,GACF,CAEJ,EAEA,IAAOiB,EAAQlB",
|
|
6
|
+
"names": ["jsx", "jsxs", "Text", "Button", "useAiuiContext", "useBizProductContext", "useMemo", "formatPrice", "replaceTemplate", "ProductActions", "copyWriting", "locale", "variant", "finalPrice", "totalSavings", "memberFunctionResult", "isLogin", "comparePrice", "onAddToCart", "onBuyNow", "savingDetail", "coupon", "addToCartLoading", "buyNowLoading", "profile", "totalSavingsText", "memberPriceSaveText", "ProductActions_default"]
|
|
7
7
|
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { ScrollSpyNavProps } from './types.js';
|
|
2
|
-
declare const ScrollSpyNav: ({ tabs, onSpyNavItemClick }: ScrollSpyNavProps) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
declare const ScrollSpyNav: ({ tabs, onSpyNavItemClick, className, renderRating }: ScrollSpyNavProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default ScrollSpyNav;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as C,jsxs as I}from"react/jsx-runtime";import"../../../../AiuiProvider/index.js";import{cn as w}from"../../../../../helpers/index.js";import{useState as N,useCallback as R,useRef as T,useEffect as E}from"react";import"gsap";import{useBizProductContext as B}from"../../../BizProductProvider.js";const M=(t,p)=>{const[a,l]=N(null),c=T(null),s=T(new Map),f=T(!1),g=T(null);E(()=>{g.current=a},[a]),E(()=>{if(!t||t.length===0)return;c.current&&c.current.disconnect();const i=document.getElementById("purchase-bar"),m=i?i.clientHeight:100;s.current.clear();const e=[];if(t.forEach(r=>{const u=r.id||r.href?.replace("#",""),v=document.getElementById(u);v&&(s.current.set(u,r),e.push(v))}),e.length===0){l(t[0]);return}const o={root:null,rootMargin:`-${m}px 0px -50% 0px`,threshold:[0,.25,.5,.75,1]},b=r=>{if(f.current)return;if((window.scrollY||document.documentElement.scrollTop)<m+50){const n=t[0];n&&g.current?.id!==n.id&&(console.log("\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:",n.label),l(n),p?.(n));return}const v=r.filter(n=>n.isIntersecting).sort((n,S)=>n.boundingClientRect.top-S.boundingClientRect.top);if(v.length>0){const n=v[0],S=n.target.id,d=s.current.get(S);d&&(console.log("\u5F53\u524D\u6FC0\u6D3B\u533A\u57DF:",d.label,"\u4EA4\u53C9\u6BD4\u4F8B:",n.intersectionRatio.toFixed(2)),l(d),p?.(d))}else{const n=[...r].sort((S,d)=>Math.abs(S.boundingClientRect.top)-Math.abs(d.boundingClientRect.top));if(n.length>0){const d=n[0].target.id,x=s.current.get(d);x&&(l(x),p?.(x))}}};c.current=new IntersectionObserver(b,o),e.forEach(r=>{c.current?.observe(r)});const h=()=>{if(f.current)return;if((window.scrollY||document.documentElement.scrollTop)<m+50){const u=t[0];u&&(l(u),p?.(u))}};return window.addEventListener("scroll",h,{passive:!0}),()=>{c.current&&c.current.disconnect(),window.removeEventListener("scroll",h)}},[t]),E(()=>{!a&&t&&t.length>0&&l(t[0])},[t,a]);const y=R(i=>{l(i);const m=i.id||i.href?.replace("#",""),e=document.getElementById(m);if(e){const o=document.getElementById("purchase-bar"),b=o?o.clientHeight:100;f.current=!0;const r=e.getBoundingClientRect().top+window.scrollY-b-10;window.scrollTo({top:r,behavior:"smooth"}),setTimeout(()=>{f.current=!1},1e3)}},[]);return{activeTab:a||t?.[0],setActiveTab:y}},k=({tabs:t,onSpyNavItemClick:p,className:a,renderRating:l})=>{const{isMobile:c}=B(),{activeTab:s,setActiveTab:f}=M(t),g=T(null),y=T(new Map),i=R(e=>{f(e),p?.(e)},[p,f]);E(()=>{if(!c||!s||!g.current)return;const e=y.current.get(s.id);if(!e)return;const o=g.current,b=e.getBoundingClientRect(),h=o.getBoundingClientRect(),r=b.left+b.width/2-h.left,u=h.width/2,v=r-u;o.scrollTo({left:o.scrollLeft+v,behavior:"smooth"})},[s?.id,c]);const m=R((e,o)=>{o?y.current.set(e,o):y.current.delete(e)},[]);return c?I("div",{ref:g,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:w("flex gap-6 overflow-x-auto -mx-4 px-4",a),children:[t?.map(e=>C("button",{ref:o=>m(e.id,o),className:w("text-sm relative py-[10px] text-[#949494] font-bold whitespace-nowrap flex-shrink-0",{"text-[#1d1d1f]":s?.id===e.id}),onClick:()=>i(e),children:e.label},e.id)),l]}):I("div",{className:w("flex gap-8",a),children:[t?.map(e=>I("button",{className:"text-sm relative py-[10px] font-bold",onClick:()=>i(e),children:[e.label,C("div",{className:w("absolute bottom-0 left-0 w-0 transition-all duration-300 ease-in-out h-[2px] bg-brand-0",{"w-full":s?.id===e.id})})]},e.id)),l]})};var D=k;export{D as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../src/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport { cn } from '../../../../../helpers/index.js'\nimport { useState, useCallback, useRef, useEffect } from 'react'\nimport { gsap } from 'gsap'\nimport type { ScrollSpyNavItem, ScrollSpyNavProps } from './types.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\n\nconst ArrowDownIcon = (props: React.SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path d=\"M3 4.5L6 7.5L9 4.5\" stroke=\"#1D1D1F\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\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 console.log('\u5F53\u524D\u6FC0\u6D3B\u533A\u57DF:', tab.label, '\u4EA4\u53C9\u6BD4\u4F8B:', topEntry.intersectionRatio.toFixed(2))\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])\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(\n (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 )\n\n return { activeTab: activeTab || tabs?.[0], setActiveTab: handleSetActiveTab }\n}\n\nconst ScrollSpyNav = ({ tabs, onSpyNavItemClick }: ScrollSpyNavProps) => {\n const { isMobile } = useBizProductContext()\n \n // \u4F7F\u7528 useScrollSpy hook \u81EA\u52A8\u76D1\u542C\u6EDA\u52A8\n const { activeTab, setActiveTab } = useScrollSpy(tabs)\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 (!isMobile || !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, isMobile])\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 // \u79FB\u52A8\u7AEF\u6E32\u67D3\uFF1A\u6A2A\u5411\u6EDA\u52A8\n if (isMobile) {\n return (\n <div\n ref={scrollContainerRef}\n style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}\n className={cn('flex gap-6 overflow-x-auto -mx-4 px-4')}\n >\n {tabs?.map(tab => (\n <button\n ref={el => setTabRef(tab.id, el)}\n className={cn(\"text-sm relative py-[10px] text-[#949494] font-bold whitespace-nowrap flex-shrink-0\", {\n 'text-[#1d1d1f]': activeTab?.id === tab.id,\n })}\n key={tab.id}\n onClick={() => onTabClick(tab)}\n >\n {tab.label}\n </button>\n ))}\n </div>\n )\n }\n\n // \u684C\u9762\u7AEF\u6E32\u67D3\n return (\n <div className=\"flex gap-8\">\n {tabs?.map(tab => (\n <button className=\"text-sm relative py-[10px] font-bold\" key={tab.id} onClick={() => onTabClick(tab)}>\n {tab.label}\n <div\n className={cn('absolute bottom-0 left-0 w-0 transition-all duration-300 ease-in-out h-[2px] bg-brand-0', {\n 'w-full': activeTab?.id === tab.id,\n })}\n />\n </button>\n ))}\n </div>\n )\n}\n\nexport default ScrollSpyNav\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "cn", "useState", "useCallback", "useRef", "useEffect", "useBizProductContext", "
|
|
4
|
+
"sourcesContent": ["import { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport { cn } from '../../../../../helpers/index.js'\nimport { useState, useCallback, useRef, useEffect } from 'react'\nimport { gsap } from 'gsap'\nimport type { ScrollSpyNavItem, ScrollSpyNavProps } from './types.js'\nimport { useBizProductContext } from '../../../BizProductProvider.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 console.log('\u5F53\u524D\u6FC0\u6D3B\u533A\u57DF:', tab.label, '\u4EA4\u53C9\u6BD4\u4F8B:', topEntry.intersectionRatio.toFixed(2))\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])\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(\n (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 )\n\n return { activeTab: activeTab || tabs?.[0], setActiveTab: handleSetActiveTab }\n}\n\nconst ScrollSpyNav = ({ tabs, onSpyNavItemClick, className, renderRating }: ScrollSpyNavProps) => {\n const { isMobile } = useBizProductContext()\n \n // \u4F7F\u7528 useScrollSpy hook \u81EA\u52A8\u76D1\u542C\u6EDA\u52A8\n const { activeTab, setActiveTab } = useScrollSpy(tabs)\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 (!isMobile || !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, isMobile])\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 // \u79FB\u52A8\u7AEF\u6E32\u67D3\uFF1A\u6A2A\u5411\u6EDA\u52A8\n if (isMobile) {\n return (\n <div\n ref={scrollContainerRef}\n style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}\n className={cn('flex gap-6 overflow-x-auto -mx-4 px-4', className)}\n >\n {tabs?.map(tab => (\n <button\n ref={el => setTabRef(tab.id, el)}\n className={cn('text-sm relative py-[10px] text-[#949494] font-bold whitespace-nowrap flex-shrink-0', {\n 'text-[#1d1d1f]': activeTab?.id === tab.id,\n })}\n key={tab.id}\n onClick={() => onTabClick(tab)}\n >\n {tab.label}\n </button>\n ))}\n {renderRating}\n </div>\n )\n }\n\n // \u684C\u9762\u7AEF\u6E32\u67D3\n return (\n <div className={cn('flex gap-8', className)}>\n {tabs?.map(tab => (\n <button className=\"text-sm relative py-[10px] font-bold\" key={tab.id} onClick={() => onTabClick(tab)}>\n {tab.label}\n <div\n className={cn('absolute bottom-0 left-0 w-0 transition-all duration-300 ease-in-out h-[2px] bg-brand-0', {\n 'w-full': activeTab?.id === tab.id,\n })}\n />\n </button>\n ))}\n {renderRating}\n </div>\n )\n}\n\nexport default ScrollSpyNav\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["jsx", "jsxs", "cn", "useState", "useCallback", "useRef", "useEffect", "useBizProductContext", "useScrollSpy", "tabs", "onActiveChange", "activeTab", "setActiveTab", "observerRef", "sectionsRef", "isManualScrollRef", "activeTabRef", "purchaseBar", "navHeight", "elements", "tab", "id", "element", "observerOptions", "observerCallback", "entries", "firstTab", "intersectingEntries", "entry", "a", "b", "topEntry", "sortedEntries", "handleScroll", "handleSetActiveTab", "scrollToPosition", "ScrollSpyNav", "onSpyNavItemClick", "className", "renderRating", "isMobile", "scrollContainerRef", "tabRefs", "onTabClick", "activeTabElement", "container", "tabRect", "containerRect", "tabCenter", "containerCenter", "scrollOffset", "setTabRef", "tabId", "el", "ScrollSpyNav_default"]
|
|
7
7
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
export interface ScrollSpyNavItem {
|
|
2
3
|
label: string;
|
|
3
4
|
href: string;
|
|
@@ -7,4 +8,6 @@ export interface ScrollSpyNavProps {
|
|
|
7
8
|
tabs: ScrollSpyNavItem[];
|
|
8
9
|
purchaseBarHeight?: number;
|
|
9
10
|
onSpyNavItemClick?: (tab: ScrollSpyNavItem) => void;
|
|
11
|
+
className?: string;
|
|
12
|
+
renderRating?: React.ReactNode;
|
|
10
13
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as a}from"react/jsx-runtime";import{useMemo as i}from"react";import{Heading as d,Container as n}from"../../../../components";import"gsap";import"../../../AiuiProvider/index.js";import"../../../../helpers/index.js";import{ProductActions as m}from"../index.js";import{useBizProductContext as c}from"../../BizProductProvider.js";import l from"./ScrollSpyNav/index.js";const f=({onSpyNavItemClick:o})=>{const{product:t,renderRating:r}=c(),s=i(()=>t?.payload?.components?.find(p=>p.componentKey==="PurchaseBar")?.data||[],[t?.payload]);return e("div",{id:"purchase-bar",className:"bg-white sticky top-0 left-0 w-full z-[52] border-b border-[#E4E5E6]",children:a(n,{children:[a("div",{className:"flex gap-[10px] items-center tablet:justify-between tablet:gap-0 tablet:w-full",children:[a("div",{className:"flex-1 py-3 desktop:pt-6 desktop:pb-0 tablet:flex-none",children:[e(d,{size:2,className:"line-clamp-2 tablet:max-w-[406px] desktop:max-w-[570px] lg-desktop:max-w-[683px]",html:t?.title}),e("div",{className:"justify-between hidden desktop:flex gap-8 items-center mt-3",children:e(l,{tabs:s,className:"",renderRating:r,onSpyNavItemClick:o})})]}),e("div",{className:"hidden desktop:block",children:e(m,{})})]}),e("div",{className:"overflow-x-auto desktop:hidden flex gap-6 border-t-[1px] border-[#E4E5E6]",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:e(l,{tabs:s,renderRating:r,onSpyNavItemClick:o})})]})})};var j=f;export{j as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/biz-components/Listing/components/PurchaseBar/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useCallback, useEffect, useRef, useState, useMemo } from 'react'\nimport { Text, Heading, Button, Container } from '../../../../components'\nimport type { PurchaseBarProps, ScrollSpyNavProps, ScrollSpyNavItem } from './types.js'\nimport { gsap } from 'gsap'\nimport { useAiuiContext } from '../../../AiuiProvider/index.js'\nimport { cn } from '../../../../helpers/index.js'\nimport { ProductActions } from '../index.js'\nimport { useBizProductContext } from '../../BizProductProvider.js'\nimport ScrollSpyNav from './ScrollSpyNav/index.js'\n\nconst PurchaseBar = ({ onSpyNavItemClick }: PurchaseBarProps) => {\n const
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "
|
|
4
|
+
"sourcesContent": ["import { useCallback, useEffect, useRef, useState, useMemo } from 'react'\nimport { Text, Heading, Button, Container } from '../../../../components'\nimport type { PurchaseBarProps, ScrollSpyNavProps, ScrollSpyNavItem } from './types.js'\nimport { gsap } from 'gsap'\nimport { useAiuiContext } from '../../../AiuiProvider/index.js'\nimport { cn } from '../../../../helpers/index.js'\nimport { ProductActions } from '../index.js'\nimport { useBizProductContext } from '../../BizProductProvider.js'\nimport ScrollSpyNav from './ScrollSpyNav/index.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=\"bg-white sticky top-0 left-0 w-full z-[52] border-b border-[#E4E5E6]\">\n <Container>\n {/* // py-3 desktop:pt-6 desktop:pb-0 */}\n <div className=\"flex gap-[10px] items-center tablet:justify-between tablet:gap-0 tablet:w-full\">\n <div className=\"flex-1 py-3 desktop:pt-6 desktop:pb-0 tablet:flex-none\">\n <Heading\n size={2}\n className=\"line-clamp-2 tablet:max-w-[406px] desktop:max-w-[570px] lg-desktop:max-w-[683px]\"\n html={product?.title}\n />\n <div className=\"justify-between hidden desktop:flex gap-8 items-center mt-3\">\n <ScrollSpyNav\n tabs={PurchaseBarData}\n className=\"\"\n renderRating={renderRating}\n onSpyNavItemClick={onSpyNavItemClick}\n />\n </div>\n </div>\n <div className=\"hidden desktop:block\">\n <ProductActions />\n </div>\n </div>\n <div\n className=\"overflow-x-auto desktop:hidden flex gap-6 border-t-[1px] border-[#E4E5E6]\"\n style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}\n >\n <ScrollSpyNav tabs={PurchaseBarData} renderRating={renderRating} onSpyNavItemClick={onSpyNavItemClick} />\n </div>\n </Container>\n </div>\n )\n}\n\nexport default PurchaseBar\n"],
|
|
5
|
+
"mappings": "AAsBU,OACE,OAAAA,EADF,QAAAC,MAAA,oBAtBV,OAAmD,WAAAC,MAAe,QAClE,OAAe,WAAAC,EAAiB,aAAAC,MAAiB,yBAEjD,MAAqB,OACrB,MAA+B,iCAC/B,MAAmB,+BACnB,OAAS,kBAAAC,MAAsB,cAC/B,OAAS,wBAAAC,MAA4B,8BACrC,OAAOC,MAAkB,0BAEzB,MAAMC,EAAc,CAAC,CAAE,kBAAAC,CAAkB,IAAwB,CAC/D,KAAM,CAAE,QAAAC,EAAS,aAAAC,CAAa,EAAIL,EAAqB,EAEjDM,EAAkBV,EAAQ,IACvBQ,GAAS,SAAS,YAAY,KAAMG,GAAcA,EAAK,eAAiB,aAAa,GAAG,MAAQ,CAAC,EACvG,CAACH,GAAS,OAAO,CAAC,EAErB,OACEV,EAAC,OAAI,GAAG,eAAe,UAAU,uEAC/B,SAAAC,EAACG,EAAA,CAEC,UAAAH,EAAC,OAAI,UAAU,iFACb,UAAAA,EAAC,OAAI,UAAU,yDACb,UAAAD,EAACG,EAAA,CACC,KAAM,EACN,UAAU,mFACV,KAAMO,GAAS,MACjB,EACAV,EAAC,OAAI,UAAU,8DACb,SAAAA,EAACO,EAAA,CACC,KAAMK,EACN,UAAU,GACV,aAAcD,EACd,kBAAmBF,EACrB,EACF,GACF,EACAT,EAAC,OAAI,UAAU,uBACb,SAAAA,EAACK,EAAA,EAAe,EAClB,GACF,EACAL,EAAC,OACC,UAAU,4EACV,MAAO,CAAE,eAAgB,OAAQ,gBAAiB,MAAO,EAEzD,SAAAA,EAACO,EAAA,CAAa,KAAMK,EAAiB,aAAcD,EAAc,kBAAmBF,EAAmB,EACzG,GACF,EACF,CAEJ,EAEA,IAAOK,EAAQN",
|
|
6
|
+
"names": ["jsx", "jsxs", "useMemo", "Heading", "Container", "ProductActions", "useBizProductContext", "ScrollSpyNav", "PurchaseBar", "onSpyNavItemClick", "product", "renderRating", "PurchaseBarData", "item", "PurchaseBar_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{useBizProductContext as b}from"../BizProductProvider";import{checkItemAvailableForProduct as B}from"../utils/helper";import{useDiscountEnable as h}from"./useDiscountEnable";import{useAiuiContext as C}from"../../AiuiProvider/index.js";import"react";const M=({variant:
|
|
1
|
+
import{useBizProductContext as b}from"../BizProductProvider";import{checkItemAvailableForProduct as B}from"../utils/helper";import{useDiscountEnable as h}from"./useDiscountEnable";import{useAiuiContext as C}from"../../AiuiProvider/index.js";import"react";const M=({variant:e})=>{const{coupon:l,product:u,bundle:t,freeGift:s,memberFunctionResult:i,creditsRedemptionAmount:f,discount:D,profile:r,savingDetail:I}=b(),{trackingData:o}=C(),m=Math.max(i?.withCouponMemberTotalSave??0,i?.withoutCouponMaxMemberTotalSave??0),a=h({profile:r,variant:e,memberFunctionResult:i,coupon:l}),p=!!(o?.paidShipping&&e.requiresShipping&&!e?.metafields?.global?.presell&&!e?.metafields?.global?.HideShipping),c=o?.freeGift,d=c?.excludeProducts?.map(n=>typeof n=="object"&&"sku"in n?n.sku:n)??[],g=o?.levelDiscount&&B({product:u,variant:e,item:o?.levelDiscount});return{commonCoupon:{enable:a.showCommonCoupon&&!!l,config:l??{}},freeGift:{enable:!!s&&!!s?.giftList?.length,config:s},bundle:{enable:!!t&&!!t?.bundleList?.length&&Math.max(...t?.bundleList?.map(n=>n.savings??0))>0,config:t},memberDiscount:{enable:a.showMemberDiscount,config:{amount:m,description:i?.labels?.[0]}},creditsRedemption:{enable:!!f&&f>0,config:{amount:f,label:o?.creditsRedemptionLabel}},paidShipping:{enable:p,config:{}},fullGift:{enable:!!(c&&!d.includes(e.sku)),config:c??{}},levelDiscount:{enable:!!g,config:o?.levelDiscount??{}}}};export{M as useBenefits};
|
|
2
2
|
//# sourceMappingURL=useBenefits.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/biz-components/Listing/hooks/useBenefits.ts"],
|
|
4
|
-
"sourcesContent": ["import { useBizProductContext } from '../BizProductProvider'\nimport type { ProductVariant, FreeGift, Bundle } from '../types/product'\nimport { checkItemAvailableForProduct } from '../utils/helper'\nimport { useDiscountEnable } from './useDiscountEnable'\n\nimport { useAiuiContext } from '../../AiuiProvider/index.js'\nimport { useMemo } from 'react'\n\ninterface BenefitsParams {\n variant: ProductVariant\n}\n\ninterface BenefitItemConfig<T extends Record<string, any> = Record<string, any>> {\n enable: boolean\n config?: T // \u539F\u59CB\u914D\u7F6E\n}\n\ninterface BenefitsResult {\n /**\n * \u901A\u7528\u4F18\u60E0\u5238\n */\n commonCoupon?: BenefitItemConfig\n /**\n * \u4E70\u8D60\n */\n freeGift: BenefitItemConfig<FreeGift>\n /**\n * \u6346\u7ED1\u6298\u6263\n */\n bundle: BenefitItemConfig<Bundle>\n /**\n * \u4F1A\u5458\u4EF7\n */\n memberDiscount: BenefitItemConfig\n /**\n * \u79EF\u5206\u62B5\u73B0\n */\n creditsRedemption: BenefitItemConfig\n /**\n * \u9AD8\u6807\u7269\u6D41\n */\n paidShipping: BenefitItemConfig\n\n /**\n * \u6EE1\u8D60\n */\n fullGift: BenefitItemConfig\n\n /**\n * \u6EE1\u51CF\u6298\u6263\n */\n levelDiscount: BenefitItemConfig\n}\n\n/**\n * \u5546\u54C1\u6743\u76CA\n * \u83B7\u53D6\u5F53\u524Dsku \u6240\u6709\u7684\u6743\u76CA\n * \u5305\u62EC \u901A\u7528\u4F18\u60E0\u5238\uFF0C\u4F1A\u5458\u4EF7\uFF0C\u6EE1\u51CF\uFF0C\u6346\u7ED1\u6298\u6263\uFF0C\u4E70\u8D60 \uFF0C\u6EE1\u8D60 \uFF0C\u79EF\u5206\u62B5\u73B0\n * @returns\n */\nexport const useBenefits = ({ variant }: BenefitsParams): BenefitsResult => {\n const {\n coupon,\n product,\n bundle,\n freeGift,\n memberFunctionResult,\n creditsRedemptionAmount,\n discount,\n profile,\n savingDetail,\n } = useBizProductContext()\n\n const { trackingData } = useAiuiContext()\n\n const total = Math.
|
|
5
|
-
"mappings": "AAAA,OAAS,wBAAAA,MAA4B,wBAErC,OAAS,gCAAAC,MAAoC,kBAC7C,OAAS,qBAAAC,MAAyB,sBAElC,OAAS,kBAAAC,MAAsB,8BAC/B,MAAwB,QAsDjB,MAAMC,EAAc,CAAC,CAAE,QAAAC,CAAQ,IAAsC,CAC1E,KAAM,CACJ,OAAAC,EACA,QAAAC,EACA,OAAAC,EACA,SAAAC,EACA,qBAAAC,EACA,wBAAAC,EACA,SAAAC,EACA,QAAAC,EACA,aAAAC,CACF,EAAId,EAAqB,EAEnB,CAAE,aAAAe,CAAa,EAAIZ,EAAe,EAElCa,EAAQ,KAAK,
|
|
4
|
+
"sourcesContent": ["import { useBizProductContext } from '../BizProductProvider'\nimport type { ProductVariant, FreeGift, Bundle } from '../types/product'\nimport { checkItemAvailableForProduct } from '../utils/helper'\nimport { useDiscountEnable } from './useDiscountEnable'\n\nimport { useAiuiContext } from '../../AiuiProvider/index.js'\nimport { useMemo } from 'react'\n\ninterface BenefitsParams {\n variant: ProductVariant\n}\n\ninterface BenefitItemConfig<T extends Record<string, any> = Record<string, any>> {\n enable: boolean\n config?: T // \u539F\u59CB\u914D\u7F6E\n}\n\ninterface BenefitsResult {\n /**\n * \u901A\u7528\u4F18\u60E0\u5238\n */\n commonCoupon?: BenefitItemConfig\n /**\n * \u4E70\u8D60\n */\n freeGift: BenefitItemConfig<FreeGift>\n /**\n * \u6346\u7ED1\u6298\u6263\n */\n bundle: BenefitItemConfig<Bundle>\n /**\n * \u4F1A\u5458\u4EF7\n */\n memberDiscount: BenefitItemConfig\n /**\n * \u79EF\u5206\u62B5\u73B0\n */\n creditsRedemption: BenefitItemConfig\n /**\n * \u9AD8\u6807\u7269\u6D41\n */\n paidShipping: BenefitItemConfig\n\n /**\n * \u6EE1\u8D60\n */\n fullGift: BenefitItemConfig\n\n /**\n * \u6EE1\u51CF\u6298\u6263\n */\n levelDiscount: BenefitItemConfig\n}\n\n/**\n * \u5546\u54C1\u6743\u76CA\n * \u83B7\u53D6\u5F53\u524Dsku \u6240\u6709\u7684\u6743\u76CA\n * \u5305\u62EC \u901A\u7528\u4F18\u60E0\u5238\uFF0C\u4F1A\u5458\u4EF7\uFF0C\u6EE1\u51CF\uFF0C\u6346\u7ED1\u6298\u6263\uFF0C\u4E70\u8D60 \uFF0C\u6EE1\u8D60 \uFF0C\u79EF\u5206\u62B5\u73B0\n * @returns\n */\nexport const useBenefits = ({ variant }: BenefitsParams): BenefitsResult => {\n const {\n coupon,\n product,\n bundle,\n freeGift,\n memberFunctionResult,\n creditsRedemptionAmount,\n discount,\n profile,\n savingDetail,\n } = useBizProductContext()\n\n const { trackingData } = useAiuiContext()\n\n const total = Math.max(\n memberFunctionResult?.withCouponMemberTotalSave ?? 0,\n memberFunctionResult?.withoutCouponMaxMemberTotalSave ?? 0\n )\n\n const discountEnable = useDiscountEnable({ profile, variant, memberFunctionResult, coupon })\n\n // \u9AD8\u6807\u7269\u6D41\n const showPaidShipping = Boolean(\n trackingData?.paidShipping &&\n variant.requiresShipping &&\n !variant?.metafields?.global?.presell &&\n !variant?.metafields?.global?.HideShipping\n )\n\n // \u811A\u672C\u6EE1\u8D60\n const fullGift = trackingData?.freeGift\n const excludeProducts =\n fullGift?.excludeProducts?.map((item: any) => (typeof item === 'object' && 'sku' in item ? item.sku : item)) ?? []\n\n const showLevelDiscount =\n trackingData?.levelDiscount && checkItemAvailableForProduct({ product, variant, item: trackingData?.levelDiscount })\n\n return {\n commonCoupon: {\n enable: discountEnable.showCommonCoupon && Boolean(coupon),\n config: coupon ?? {},\n },\n freeGift: {\n enable: Boolean(freeGift) && !!freeGift?.giftList?.length,\n config: freeGift,\n },\n bundle: {\n enable:\n Boolean(bundle) &&\n !!bundle?.bundleList?.length &&\n Math.max(...bundle?.bundleList?.map(item => item.savings ?? 0)) > 0, // \u6709\u4F18\u60E0\u624D\u5C55\u793A\n config: bundle,\n },\n memberDiscount: {\n enable: discountEnable.showMemberDiscount,\n // enable: total > 0,\n config: {\n amount: total,\n description: memberFunctionResult?.labels?.[0],\n },\n },\n creditsRedemption: {\n enable: Boolean(creditsRedemptionAmount) && creditsRedemptionAmount! > 0,\n config: { amount: creditsRedemptionAmount, label: trackingData?.creditsRedemptionLabel },\n },\n paidShipping: {\n enable: showPaidShipping,\n config: {},\n },\n fullGift: {\n enable: Boolean(fullGift && !excludeProducts.includes(variant.sku)),\n config: fullGift ?? {},\n },\n levelDiscount: {\n enable: Boolean(showLevelDiscount),\n config: trackingData?.levelDiscount ?? {},\n },\n }\n}\n"],
|
|
5
|
+
"mappings": "AAAA,OAAS,wBAAAA,MAA4B,wBAErC,OAAS,gCAAAC,MAAoC,kBAC7C,OAAS,qBAAAC,MAAyB,sBAElC,OAAS,kBAAAC,MAAsB,8BAC/B,MAAwB,QAsDjB,MAAMC,EAAc,CAAC,CAAE,QAAAC,CAAQ,IAAsC,CAC1E,KAAM,CACJ,OAAAC,EACA,QAAAC,EACA,OAAAC,EACA,SAAAC,EACA,qBAAAC,EACA,wBAAAC,EACA,SAAAC,EACA,QAAAC,EACA,aAAAC,CACF,EAAId,EAAqB,EAEnB,CAAE,aAAAe,CAAa,EAAIZ,EAAe,EAElCa,EAAQ,KAAK,IACjBN,GAAsB,2BAA6B,EACnDA,GAAsB,iCAAmC,CAC3D,EAEMO,EAAiBf,EAAkB,CAAE,QAAAW,EAAS,QAAAR,EAAS,qBAAAK,EAAsB,OAAAJ,CAAO,CAAC,EAGrFY,EAAmB,GACvBH,GAAc,cACZV,EAAQ,kBACR,CAACA,GAAS,YAAY,QAAQ,SAC9B,CAACA,GAAS,YAAY,QAAQ,cAI5Bc,EAAWJ,GAAc,SACzBK,EACJD,GAAU,iBAAiB,IAAKE,GAAe,OAAOA,GAAS,UAAY,QAASA,EAAOA,EAAK,IAAMA,CAAK,GAAK,CAAC,EAE7GC,EACJP,GAAc,eAAiBd,EAA6B,CAAE,QAAAM,EAAS,QAAAF,EAAS,KAAMU,GAAc,aAAc,CAAC,EAErH,MAAO,CACL,aAAc,CACZ,OAAQE,EAAe,kBAAoB,EAAQX,EACnD,OAAQA,GAAU,CAAC,CACrB,EACA,SAAU,CACR,OAAQ,EAAQG,GAAa,CAAC,CAACA,GAAU,UAAU,OACnD,OAAQA,CACV,EACA,OAAQ,CACN,OACE,EAAQD,GACR,CAAC,CAACA,GAAQ,YAAY,QACtB,KAAK,IAAI,GAAGA,GAAQ,YAAY,IAAIa,GAAQA,EAAK,SAAW,CAAC,CAAC,EAAI,EACpE,OAAQb,CACV,EACA,eAAgB,CACd,OAAQS,EAAe,mBAEvB,OAAQ,CACN,OAAQD,EACR,YAAaN,GAAsB,SAAS,CAAC,CAC/C,CACF,EACA,kBAAmB,CACjB,OAAQ,EAAQC,GAA4BA,EAA2B,EACvE,OAAQ,CAAE,OAAQA,EAAyB,MAAOI,GAAc,sBAAuB,CACzF,EACA,aAAc,CACZ,OAAQG,EACR,OAAQ,CAAC,CACX,EACA,SAAU,CACR,OAAQ,GAAQC,GAAY,CAACC,EAAgB,SAASf,EAAQ,GAAG,GACjE,OAAQc,GAAY,CAAC,CACvB,EACA,cAAe,CACb,OAAQ,EAAQG,EAChB,OAAQP,GAAc,eAAiB,CAAC,CAC1C,CACF,CACF",
|
|
6
6
|
"names": ["useBizProductContext", "checkItemAvailableForProduct", "useDiscountEnable", "useAiuiContext", "useBenefits", "variant", "coupon", "product", "bundle", "freeGift", "memberFunctionResult", "creditsRedemptionAmount", "discount", "profile", "savingDetail", "trackingData", "total", "discountEnable", "showPaidShipping", "fullGift", "excludeProducts", "item", "showLevelDiscount"]
|
|
7
7
|
}
|