@anker-in/headless-ui 1.1.9-alpha.1764216664003 → 1.1.9-alpha.1764237195908

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/dist/cjs/biz-components/HeroBanner/HeroBanner.js +1 -1
  2. package/dist/cjs/biz-components/HeroBanner/HeroBanner.js.map +2 -2
  3. package/dist/cjs/biz-components/ImageWithText/ImageWithText.js +1 -1
  4. package/dist/cjs/biz-components/ImageWithText/ImageWithText.js.map +1 -1
  5. package/dist/cjs/biz-components/Ksp/index.js +1 -1
  6. package/dist/cjs/biz-components/Ksp/index.js.map +2 -2
  7. package/dist/cjs/biz-components/Listing/BizProductProvider.d.ts +1 -1
  8. package/dist/cjs/biz-components/Listing/BizProductProvider.js.map +1 -1
  9. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.js +1 -1
  10. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.js.map +3 -3
  11. package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js +1 -1
  12. package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js.map +2 -2
  13. package/dist/cjs/biz-components/MarqueeReview/index.js +1 -1
  14. package/dist/cjs/biz-components/MarqueeReview/index.js.map +3 -3
  15. package/dist/cjs/biz-components/ThreeDCarousel/ThreeDCarousel.js +1 -1
  16. package/dist/cjs/biz-components/ThreeDCarousel/ThreeDCarousel.js.map +3 -3
  17. package/dist/esm/biz-components/HeroBanner/HeroBanner.js +1 -1
  18. package/dist/esm/biz-components/HeroBanner/HeroBanner.js.map +2 -2
  19. package/dist/esm/biz-components/ImageWithText/ImageWithText.js +1 -1
  20. package/dist/esm/biz-components/ImageWithText/ImageWithText.js.map +1 -1
  21. package/dist/esm/biz-components/Ksp/index.js +1 -1
  22. package/dist/esm/biz-components/Ksp/index.js.map +2 -2
  23. package/dist/esm/biz-components/Listing/BizProductProvider.d.ts +1 -1
  24. package/dist/esm/biz-components/Listing/BizProductProvider.js.map +1 -1
  25. package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.js +1 -1
  26. package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.js.map +3 -3
  27. package/dist/esm/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js +1 -1
  28. package/dist/esm/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/index.js.map +2 -2
  29. package/dist/esm/biz-components/MarqueeReview/index.js +1 -1
  30. package/dist/esm/biz-components/MarqueeReview/index.js.map +3 -3
  31. package/dist/esm/biz-components/ThreeDCarousel/ThreeDCarousel.js +1 -1
  32. package/dist/esm/biz-components/ThreeDCarousel/ThreeDCarousel.js.map +3 -3
  33. package/package.json +1 -1
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/Listing/BizProductProvider.tsx"],
4
- "sourcesContent": ["import React, {\n createContext,\n useCallback,\n useContext,\n type Dispatch,\n type SetStateAction,\n type PropsWithChildren,\n useState,\n useEffect,\n} from 'react'\nimport type {\n Product,\n ProductPrice,\n ProductVariant,\n VariantCoupon,\n Options,\n FreeGift,\n BundleListItem,\n Bundle,\n} from './types/product'\nimport type { CompareData, DiscountData } from './types.js'\n\ntype Country = {\n id?: number\n name?: string\n code?: string\n}\n\nexport type UserProfile = {\n user_id: string\n email: string\n nick_name?: string\n full_name?: string\n first_name?: string\n last_name?: string\n dob?: string\n gender?: string\n phone_number?: string\n phone_account?: string\n country?: Country\n is_subscribe?: boolean\n avatar?: string\n can_change_password?: boolean\n invitation_code?: string\n phone_carrier?: string\n dob_programmed?: boolean\n activated?: boolean\n registed_at?: number\n activated_at?: number\n token?: string\n}\n\nexport type SavingDetail = {\n coupon: number\n bundle: number\n member: number\n freeGift: number\n compare: number\n exchangePurchase: number\n}\n\ntype variantWithFinalPrice = ProductVariant & { finalPrice?: ProductPrice }\n\nexport type FunctionMemberPriceResult = {\n hasMemberPrice: boolean\n originalPrice: number\n withCouponMemberTotalSave: number\n withoutCouponMaxMemberTotalSave?: number\n labels: {\n key: string\n value: string\n desc: string\n }[]\n}\n\nexport type ModalData = {\n needClickAway?: boolean\n className?: string\n title?: string\n content?: string\n domContent?: React.ReactNode\n}\n\nexport type JoinedRecommendBuyProducts = {\n bundle?: {\n value?: BundleListItem\n canOperate?: boolean\n }\n gift?: {\n value?: ProductVariant\n canOperate?: boolean\n }\n exchange?: {\n value?: ProductVariant\n canOperate?: boolean\n }\n}\n\nexport type CreditsRedemption = {\n amount: number\n availablePoints: number\n usedPoints: number\n skuDetails?: {\n sku: string\n is_eligible: boolean\n }[]\n}\n\nexport interface ProductContextType {\n isLogin?: boolean\n isMobile?: boolean\n isDesktop?: boolean\n product: Product\n profile?: UserProfile\n variant: ProductVariant\n selectedVariants: Array<variantWithFinalPrice>\n renderRating?: React.ReactNode\n coupon?: VariantCoupon\n savingDetail: SavingDetail\n setSavingDetail: Dispatch<SetStateAction<SavingDetail>>\n finalPrice: number\n comparePrice: number\n totalSavings: number\n selectedOptions: Options\n setSelectedOptions: Dispatch<SetStateAction<Options>>\n freeGift?: FreeGift\n checkedGift?: ProductVariant\n setCheckedGift?: Dispatch<SetStateAction<ProductVariant | undefined>>\n exchangePurchase?: FreeGift\n checkedExchangePurchase?: ProductVariant\n setCheckedExchangePurchase?: Dispatch<SetStateAction<ProductVariant | undefined>>\n checkedBundle?: BundleListItem\n setCheckedBundle: Dispatch<SetStateAction<BundleListItem | undefined>>\n joinedRecommendBuyProducts: JoinedRecommendBuyProducts\n setJoinedRecommendBuyProducts?: Dispatch<SetStateAction<JoinedRecommendBuyProducts>>\n checkedCareBundle?: ProductVariant\n setCheckedCareBundle?: Dispatch<SetStateAction<ProductVariant | undefined>>\n bundle?: Bundle\n compareData?: CompareData['data']\n onAddToCart?: () => void\n onBuyNow?: () => void\n creditsRedemption: CreditsRedemption\n memberFunctionResult?: FunctionMemberPriceResult\n openModal: ({ title, content, domContent }: ModalData) => void\n openSignInPopup?: () => void\n openAuthCodePopup?: () => void\n openSignUpPopup?: () => void\n renderInstallments?: React.ReactNode\n onUseCouponChange?: (couponSaving: number) => void\n onUseMemberDiscountChange?: (memberSaving: number) => void\n discount?: DiscountData\n buyNowLoading?: boolean\n addToCartLoading?: boolean\n addOrder?: Array<'bundle' | 'gift' | 'exchange'>\n setAddOrder?: Dispatch<SetStateAction<Array<'bundle' | 'gift' | 'exchange'>>>\n}\n\n// const initialState: ProductContextType = {\n// isLogin: false,\n// isMobile: false,\n// product: {} as Product,\n// variant: {} as ProductVariant,\n// savingDetail: { coupon: 0, bundle: 0, member: 0, freeGift: 0, compare: 0 },\n// finalPrice: 0,\n// comparePrice: 0,\n// totalSavings: 0,\n// renderRating: null,\n// selectedOptions: {} as Options,\n// setSelectedOptions: () => {},\n// checkedBundle: undefined,\n// checkedGift: undefined,\n// setCheckedBundle: () => {},\n// setCheckedGift: () => {},\n// checkedCareBundle: undefined,\n// setCheckedCareBundle: () => {},\n// }\n\nexport const BizProductContext = createContext<ProductContextType>({} as ProductContextType)\n\nexport const useBizProductContext = () => {\n const context = useContext(BizProductContext)\n if (!context) {\n throw new Error('useProductContext must be used in <ProductProvider>')\n }\n return useContext(BizProductContext)\n}\n\nconst ProductProvider = ({\n product,\n isLogin,\n profile,\n isMobile,\n isDesktop,\n children,\n renderRating,\n freeGift,\n exchangePurchase,\n bundle,\n checkedBundle,\n checkedGift,\n setCheckedBundle,\n setCheckedGift,\n checkedExchangePurchase,\n setCheckedExchangePurchase,\n variant,\n selectedOptions,\n setSelectedOptions,\n compareData,\n coupon,\n finalPrice,\n comparePrice,\n totalSavings,\n savingDetail,\n setSavingDetail,\n selectedVariants,\n onAddToCart,\n onBuyNow,\n creditsRedemption,\n memberFunctionResult,\n openModal,\n openSignInPopup,\n openAuthCodePopup,\n openSignUpPopup,\n renderInstallments,\n onUseCouponChange,\n onUseMemberDiscountChange,\n discount,\n buyNowLoading,\n addToCartLoading,\n}: PropsWithChildren<\n Omit<ProductContextType, 'joinedRecommendBuyProducts' | 'setJoinedRecommendBuyProducts' | 'addOrder' | 'setAddOrder'>\n>) => {\n const [joinedRecommendBuyProducts, setJoinedRecommendBuyProducts] = useState<JoinedRecommendBuyProducts>({})\n const [addOrder, setAddOrder] = useState<Array<'bundle' | 'gift' | 'exchange'>>([])\n\n useEffect(() => {\n if (variant?.id) {\n setJoinedRecommendBuyProducts({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n gift: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: undefined,\n canOperate: true,\n },\n })\n setAddOrder([])\n }\n }, [variant?.id])\n\n return (\n <BizProductContext.Provider\n value={{\n product,\n variant,\n isMobile,\n isDesktop,\n isLogin,\n profile,\n coupon,\n renderRating,\n finalPrice,\n comparePrice,\n savingDetail,\n setSavingDetail,\n totalSavings,\n selectedOptions,\n setSelectedOptions,\n freeGift,\n exchangePurchase,\n checkedGift,\n setCheckedGift,\n checkedBundle,\n setCheckedBundle,\n bundle,\n compareData,\n selectedVariants,\n onAddToCart,\n onBuyNow,\n joinedRecommendBuyProducts,\n setJoinedRecommendBuyProducts,\n checkedExchangePurchase,\n setCheckedExchangePurchase,\n creditsRedemption,\n memberFunctionResult,\n openModal,\n openSignInPopup,\n openAuthCodePopup,\n openSignUpPopup,\n renderInstallments,\n onUseCouponChange,\n onUseMemberDiscountChange,\n discount,\n buyNowLoading,\n addToCartLoading,\n addOrder,\n setAddOrder,\n }}\n >\n {children}\n </BizProductContext.Provider>\n )\n}\n\nexport default ProductProvider\n"],
4
+ "sourcesContent": ["import React, {\n createContext,\n useCallback,\n useContext,\n type Dispatch,\n type SetStateAction,\n type PropsWithChildren,\n useState,\n useEffect,\n} from 'react'\nimport type {\n Product,\n ProductPrice,\n ProductVariant,\n VariantCoupon,\n Options,\n FreeGift,\n BundleListItem,\n Bundle,\n} from './types/product'\nimport type { CompareData, DiscountData } from './types.js'\n\ntype Country = {\n id?: number\n name?: string\n code?: string\n}\n\nexport type UserProfile = {\n user_id: string\n email: string\n nick_name?: string\n full_name?: string\n first_name?: string\n last_name?: string\n dob?: string\n gender?: string\n phone_number?: string\n phone_account?: string\n country?: Country\n is_subscribe?: boolean\n avatar?: string\n can_change_password?: boolean\n invitation_code?: string\n phone_carrier?: string\n dob_programmed?: boolean\n activated?: boolean\n registed_at?: number\n activated_at?: number\n token?: string\n}\n\nexport type SavingDetail = {\n coupon: number\n bundle: number\n member: number\n freeGift: number\n compare: number\n exchangePurchase: number\n}\n\ntype variantWithFinalPrice = ProductVariant & { finalPrice?: ProductPrice }\n\nexport type FunctionMemberPriceResult = {\n hasMemberPrice: boolean\n originalPrice: number\n withCouponMemberTotalSave: number\n withoutCouponMaxMemberTotalSave?: number\n labels: {\n key: string\n value: string\n desc: string\n }[]\n}\n\nexport type ModalData = {\n needClickAway?: boolean\n className?: string\n title?: string\n content?: string\n domContent?: React.ReactNode\n}\n\nexport type JoinedRecommendBuyProducts = {\n bundle?: {\n value?: BundleListItem\n canOperate?: boolean\n }\n gift?: {\n value?: ProductVariant\n canOperate?: boolean\n }\n exchange?: {\n value?: ProductVariant\n canOperate?: boolean\n }\n}\n\nexport type CreditsRedemption = {\n amount: number\n availablePoints: number\n usedPoints: number\n skuDetails?: {\n sku: string\n is_eligible: boolean\n }[]\n}\n\nexport interface ProductContextType {\n isLogin?: boolean\n isMobile?: boolean\n isDesktop?: boolean\n product: Product\n profile?: UserProfile\n variant: ProductVariant\n selectedVariants: Array<variantWithFinalPrice>\n renderRating?: React.ReactNode\n coupon?: VariantCoupon\n savingDetail: SavingDetail\n setSavingDetail: Dispatch<SetStateAction<SavingDetail>>\n finalPrice: number\n comparePrice: number\n totalSavings: number\n selectedOptions: Options\n setSelectedOptions: Dispatch<SetStateAction<Options>>\n freeGift?: FreeGift\n checkedGift?: ProductVariant\n setCheckedGift?: Dispatch<SetStateAction<ProductVariant | undefined>>\n exchangePurchase?: FreeGift\n checkedExchangePurchase?: ProductVariant\n setCheckedExchangePurchase?: Dispatch<SetStateAction<ProductVariant | undefined>>\n checkedBundle?: BundleListItem\n setCheckedBundle: Dispatch<SetStateAction<BundleListItem | undefined>>\n joinedRecommendBuyProducts: JoinedRecommendBuyProducts\n setJoinedRecommendBuyProducts?: Dispatch<SetStateAction<JoinedRecommendBuyProducts>>\n checkedCareBundle?: ProductVariant\n setCheckedCareBundle?: Dispatch<SetStateAction<ProductVariant | undefined>>\n bundle?: Bundle\n compareData?: CompareData['data']\n onAddToCart?: () => void\n onBuyNow?: () => void\n creditsRedemption?: CreditsRedemption\n memberFunctionResult?: FunctionMemberPriceResult\n openModal: ({ title, content, domContent }: ModalData) => void\n openSignInPopup?: () => void\n openAuthCodePopup?: () => void\n openSignUpPopup?: () => void\n renderInstallments?: React.ReactNode\n onUseCouponChange?: (couponSaving: number) => void\n onUseMemberDiscountChange?: (memberSaving: number) => void\n discount?: DiscountData\n buyNowLoading?: boolean\n addToCartLoading?: boolean\n addOrder?: Array<'bundle' | 'gift' | 'exchange'>\n setAddOrder?: Dispatch<SetStateAction<Array<'bundle' | 'gift' | 'exchange'>>>\n}\n\n// const initialState: ProductContextType = {\n// isLogin: false,\n// isMobile: false,\n// product: {} as Product,\n// variant: {} as ProductVariant,\n// savingDetail: { coupon: 0, bundle: 0, member: 0, freeGift: 0, compare: 0 },\n// finalPrice: 0,\n// comparePrice: 0,\n// totalSavings: 0,\n// renderRating: null,\n// selectedOptions: {} as Options,\n// setSelectedOptions: () => {},\n// checkedBundle: undefined,\n// checkedGift: undefined,\n// setCheckedBundle: () => {},\n// setCheckedGift: () => {},\n// checkedCareBundle: undefined,\n// setCheckedCareBundle: () => {},\n// }\n\nexport const BizProductContext = createContext<ProductContextType>({} as ProductContextType)\n\nexport const useBizProductContext = () => {\n const context = useContext(BizProductContext)\n if (!context) {\n throw new Error('useProductContext must be used in <ProductProvider>')\n }\n return useContext(BizProductContext)\n}\n\nconst ProductProvider = ({\n product,\n isLogin,\n profile,\n isMobile,\n isDesktop,\n children,\n renderRating,\n freeGift,\n exchangePurchase,\n bundle,\n checkedBundle,\n checkedGift,\n setCheckedBundle,\n setCheckedGift,\n checkedExchangePurchase,\n setCheckedExchangePurchase,\n variant,\n selectedOptions,\n setSelectedOptions,\n compareData,\n coupon,\n finalPrice,\n comparePrice,\n totalSavings,\n savingDetail,\n setSavingDetail,\n selectedVariants,\n onAddToCart,\n onBuyNow,\n creditsRedemption,\n memberFunctionResult,\n openModal,\n openSignInPopup,\n openAuthCodePopup,\n openSignUpPopup,\n renderInstallments,\n onUseCouponChange,\n onUseMemberDiscountChange,\n discount,\n buyNowLoading,\n addToCartLoading,\n}: PropsWithChildren<\n Omit<ProductContextType, 'joinedRecommendBuyProducts' | 'setJoinedRecommendBuyProducts' | 'addOrder' | 'setAddOrder'>\n>) => {\n const [joinedRecommendBuyProducts, setJoinedRecommendBuyProducts] = useState<JoinedRecommendBuyProducts>({})\n const [addOrder, setAddOrder] = useState<Array<'bundle' | 'gift' | 'exchange'>>([])\n\n useEffect(() => {\n if (variant?.id) {\n setJoinedRecommendBuyProducts({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n gift: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: undefined,\n canOperate: true,\n },\n })\n setAddOrder([])\n }\n }, [variant?.id])\n\n return (\n <BizProductContext.Provider\n value={{\n product,\n variant,\n isMobile,\n isDesktop,\n isLogin,\n profile,\n coupon,\n renderRating,\n finalPrice,\n comparePrice,\n savingDetail,\n setSavingDetail,\n totalSavings,\n selectedOptions,\n setSelectedOptions,\n freeGift,\n exchangePurchase,\n checkedGift,\n setCheckedGift,\n checkedBundle,\n setCheckedBundle,\n bundle,\n compareData,\n selectedVariants,\n onAddToCart,\n onBuyNow,\n joinedRecommendBuyProducts,\n setJoinedRecommendBuyProducts,\n checkedExchangePurchase,\n setCheckedExchangePurchase,\n creditsRedemption,\n memberFunctionResult,\n openModal,\n openSignInPopup,\n openAuthCodePopup,\n openSignUpPopup,\n renderInstallments,\n onUseCouponChange,\n onUseMemberDiscountChange,\n discount,\n buyNowLoading,\n addToCartLoading,\n addOrder,\n setAddOrder,\n }}\n >\n {children}\n </BizProductContext.Provider>\n )\n}\n\nexport default ProductProvider\n"],
5
5
  "mappings": "AAgQI,cAAAA,MAAA,oBAhQJ,OACE,iBAAAC,EAEA,cAAAC,EAIA,YAAAC,EACA,aAAAC,MACK,QAwKA,MAAMC,EAAoBJ,EAAkC,CAAC,CAAuB,EAE9EK,GAAuB,IAAM,CAExC,GAAI,CADYJ,EAAWG,CAAiB,EAE1C,MAAM,IAAI,MAAM,qDAAqD,EAEvE,OAAOH,EAAWG,CAAiB,CACrC,EAEME,EAAkB,CAAC,CACvB,QAAAC,EACA,QAAAC,EACA,QAAAC,EACA,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,aAAAC,EACA,SAAAC,EACA,iBAAAC,EACA,OAAAC,EACA,cAAAC,EACA,YAAAC,EACA,iBAAAC,EACA,eAAAC,EACA,wBAAAC,EACA,2BAAAC,EACA,QAAAC,EACA,gBAAAC,EACA,mBAAAC,EACA,YAAAC,EACA,OAAAC,EACA,WAAAC,EACA,aAAAC,EACA,aAAAC,EACA,aAAAC,EACA,gBAAAC,EACA,iBAAAC,EACA,YAAAC,EACA,SAAAC,EACA,kBAAAC,EACA,qBAAAC,EACA,UAAAC,EACA,gBAAAC,EACA,kBAAAC,EACA,gBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,0BAAAC,EACA,SAAAC,EACA,cAAAC,EACA,iBAAAC,CACF,IAEM,CACJ,KAAM,CAACC,EAA4BC,CAA6B,EAAI/C,EAAqC,CAAC,CAAC,EACrG,CAACgD,EAAUC,CAAW,EAAIjD,EAAgD,CAAC,CAAC,EAElF,OAAAC,EAAU,IAAM,CACVoB,GAAS,KACX0B,EAA8B,CAC5B,OAAQ,CACN,MAAO,OACP,WAAY,EACd,EACA,KAAM,CACJ,MAAO,OACP,WAAY,EACd,EACA,SAAU,CACR,MAAO,OACP,WAAY,EACd,CACF,CAAC,EACDE,EAAY,CAAC,CAAC,EAElB,EAAG,CAAC5B,GAAS,EAAE,CAAC,EAGdxB,EAACK,EAAkB,SAAlB,CACC,MAAO,CACL,QAAAG,EACA,QAAAgB,EACA,SAAAb,EACA,UAAAC,EACA,QAAAH,EACA,QAAAC,EACA,OAAAkB,EACA,aAAAd,EACA,WAAAe,EACA,aAAAC,EACA,aAAAE,EACA,gBAAAC,EACA,aAAAF,EACA,gBAAAN,EACA,mBAAAC,EACA,SAAAX,EACA,iBAAAC,EACA,YAAAG,EACA,eAAAE,EACA,cAAAH,EACA,iBAAAE,EACA,OAAAH,EACA,YAAAU,EACA,iBAAAO,EACA,YAAAC,EACA,SAAAC,EACA,2BAAAa,EACA,8BAAAC,EACA,wBAAA5B,EACA,2BAAAC,EACA,kBAAAc,EACA,qBAAAC,EACA,UAAAC,EACA,gBAAAC,EACA,kBAAAC,EACA,gBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,0BAAAC,EACA,SAAAC,EACA,cAAAC,EACA,iBAAAC,EACA,SAAAG,EACA,YAAAC,CACF,EAEC,SAAAvC,EACH,CAEJ,EAEA,IAAOwC,GAAQ9C",
6
6
  "names": ["jsx", "createContext", "useContext", "useState", "useEffect", "BizProductContext", "useBizProductContext", "ProductProvider", "product", "isLogin", "profile", "isMobile", "isDesktop", "children", "renderRating", "freeGift", "exchangePurchase", "bundle", "checkedBundle", "checkedGift", "setCheckedBundle", "setCheckedGift", "checkedExchangePurchase", "setCheckedExchangePurchase", "variant", "selectedOptions", "setSelectedOptions", "compareData", "coupon", "finalPrice", "comparePrice", "totalSavings", "savingDetail", "setSavingDetail", "selectedVariants", "onAddToCart", "onBuyNow", "creditsRedemption", "memberFunctionResult", "openModal", "openSignInPopup", "openAuthCodePopup", "openSignUpPopup", "renderInstallments", "onUseCouponChange", "onUseMemberDiscountChange", "discount", "buyNowLoading", "addToCartLoading", "joinedRecommendBuyProducts", "setJoinedRecommendBuyProducts", "addOrder", "setAddOrder", "BizProductProvider_default"]
7
7
  }
@@ -1,2 +1,2 @@
1
- import{jsx as e,jsxs as n}from"react/jsx-runtime";import{Text as s,Button as G,Grid as Y,GridItem as q,Picture as A,Heading as Z}from"../../../../../components/index.js";import{useBizProductContext as F}from"../../../BizProductProvider.js";import{useEffect as ee,useMemo as B,useState as te}from"react";import{formatPrice as y}from"../../../utils/index.js";import{useAiuiContext as j}from"../../../../AiuiProvider/index.js";import K from"decimal.js";import{replaceTemplate as ae}from"../../../utils/textFormat.js";import{withLayout as ne}from"../../../../../shared/Styles.js";import{ExposureDetector as oe}from"../../../../../components/index.js";import{gaTrack as re}from"../../../../../shared/track.js";const le=()=>{const{locale:m="us",copyWriting:a}=j(),{product:u,variant:o,finalPrice:g,comparePrice:x,coupon:k,selectedOptions:d,selectedVariants:b,totalSavings:l,onAddToCart:D,onBuyNow:E,savingDetail:h,checkedBundle:N,joinedRecommendBuyProducts:t,setJoinedRecommendBuyProducts:p,setSavingDetail:I,addToCartLoading:P,buyNowLoading:L,profile:T,addOrder:S,setAddOrder:w}=F(),V=B(()=>u?.payload?.components?.find(r=>r.componentKey==="ProductSummary")?.data||{},[u?.payload]),[z]=b,_=B(()=>{const r=N?.variants.find(C=>C.variant.sku===z?.sku),i=new K(z?.price?.amount||0).minus(r?.price||z?.price?.amount).toNumber();let f=new K(z?.price?.amount||0);T?.email&&(f=f.minus(h?.member||0));const v=f.minus(h?.coupon).minus(i).toNumber();return Math.floor(v*100)/100},[z,N,T,h?.member,h?.coupon]),{bundleVariant:$,giftVariant:R,exchangeVariant:W}=ie()||{},[c,O]=te();ee(()=>{O({bundle:t.bundle?.value?void 0:$,gift:t.gift?.value?void 0:R,exchange:t.exchange?.value?void 0:W})},[$,R,W,t]);const H=B(()=>{const r=[];return S&&S.forEach((i,f)=>{t[i]?.value&&r.push({type:i,key:`${i}-${f}`})}),r},[S,t]),U=B(()=>{const r=d?.quantity||"",i=d?.color||d?.colour||d?.couleur||"";return`${r&&i?`${r} | ${i}`:r||i}`},[d?.quantity,d?.color,d?.colour,d?.couleur]),X=B(()=>(o?.payload?.components?.find(v=>v.componentKey==="ProductGallery")?.data||[])?.find(v=>v?.galleries==="productList")?.images?.[0]?.image_1920||o.image?.url||o.image?.url,[o.image?.url,o?.payload?.components]);return o.availableForSale?e("div",{className:"ipc-product-summary laptop:px-16 desktop:px-0 desktop:mt-[96px] lg-desktop:mt-[128px] mt-16",children:e("div",{className:"laptop:rounded-2xl bg-[#F5F5F7]",children:n(Y,{className:"tablet:p-8 tablet:!pb-0 px-4 pt-6",children:[n(q,{className:"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4",children:[e(Z,{className:"lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]",html:V?.readyWant?.replace?.("{title}",u?.title)}),e("div",{className:"",children:e(A,{source:X,className:"lg-desktop:h-[320px] desktop:h-[272px] laptop:h-[191px] tablet:h-[380px] aspect-1 mx-auto h-[192px]",imgClassName:"object-cover h-full"})})]}),n(q,{className:"tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 col-span-12 mt-8 flex flex-col justify-between gap-6 pb-6",children:[n("div",{children:[n("div",{className:"flex flex-col gap-4",children:[e(oe,{exposureKey:"listing_selector",onExposure:()=>{re({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${o.sku}`,component_type:"image",component_name:"listing_selector",position:1}})},children:n("div",{className:"flex items-center justify-between gap-6",children:[n("div",{className:"flex items-center gap-4",children:[e(A,{source:o.image?.url||u?.images?.[0]?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),n("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:u.title}),e(s,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:U})]})]}),n("div",{className:"flex items-center gap-1",children:[e(s,{className:"desktop:text-2xl text-base font-bold",html:y({amount:_,currencyCode:o.price.currencyCode,locale:m})}),_<o?.price?.amount&&e(s,{className:"desktop:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through",html:y({amount:o?.price?.amount,currencyCode:o.price.currencyCode,locale:m})})]})]})}),H.map(({type:r,key:i})=>r==="gift"&&t?.gift?.value?e(J,{giftOperation:f=>{p?.({...t,gift:{value:void 0,canOperate:!0}}),O?.({...c,gift:f}),w?.(v=>v.filter(C=>C!=="gift"))},status:!!t?.gift,gift:t?.gift?.value,canOperate:t?.gift?.canOperate},i):r==="bundle"&&t?.bundle?.value?e(M,{bundleOperation:f=>{p?.({...t,bundle:{value:void 0,canOperate:!0}}),O?.({...c,bundle:f}),w?.(v=>v.filter(C=>C!=="bundle"))},status:!!t?.bundle,bundleListItem:t?.bundle?.value,canOperate:t?.bundle?.canOperate},i):r==="exchange"&&t?.exchange?.value?e(Q,{exchangeOperation:f=>{p?.({...t,exchange:{value:void 0,canOperate:!0}}),O?.({...c,exchange:f}),w?.(v=>v.filter(C=>C!=="exchange"))},status:!!t?.exchange,canOperate:t?.exchange?.canOperate,exchange:t?.exchange?.value},i):null)]}),(c?.bundle||c?.gift||c?.exchange)&&n("div",{className:"desktop:mt-8 mt-6",children:[e(s,{className:"desktop:text-[18px] text-sm font-bold",html:V?.recommendBuy}),n("div",{className:"desktop:gap-4 mt-4 flex flex-col gap-6",children:[c?.exchange&&e(Q,{exchangeOperation:r=>{p?.({...t,exchange:{value:r,canOperate:!0}}),O?.({...c,exchange:void 0}),w?.(i=>[...i,"exchange"])},canOperate:t?.exchange?.canOperate,status:!c?.exchange,exchange:c?.exchange}),c?.bundle&&e(M,{bundleOperation:r=>{I?.({...h,exchangePurchase:0}),p?.({...t,bundle:{value:r,canOperate:!0}}),O?.({...c,bundle:void 0}),w?.(i=>[...i,"bundle"])},canOperate:t?.bundle?.canOperate,status:!c?.bundle,bundleListItem:c?.bundle}),c?.gift&&e(J,{giftOperation:r=>{p?.({...t,gift:{value:r,canOperate:!0}}),O?.({...c,gift:void 0}),w?.(i=>[...i,"gift"])},canOperate:t?.gift?.canOperate,status:!c?.gift,gift:c?.gift})]})]})]}),n("div",{className:"text-right",children:[e(s,{className:"laptop:text-xl desktop:text-2xl text-right font-bold",html:`${ae(a?.totalPrice||"",{amount:y({amount:Math.floor(g*100)/100,currencyCode:o.price.currencyCode,locale:m})})}`}),l>0&&e(s,{className:"laptop:text-xl desktop:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through",html:y({amount:x,currencyCode:o.price.currencyCode,locale:m})}),n("div",{className:"mt-4 flex justify-end gap-3",children:[e(G,{size:"lg",variant:"secondary",loading:P,className:"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2",onClick:()=>D?.(),children:a?.addToCart}),e(G,{size:"lg",loading:L,variant:"primary",className:"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2",onClick:()=>E?.(),children:a?.shopNow})]})]})]})]})})}):null},ie=()=>{const{bundle:m,variant:a,checkedBundle:u,freeGift:o,checkedGift:g,exchangePurchase:x,checkedExchangePurchase:k}=F();let d,b,l;const{bundleList:D}=m||{},{giftList:E=[]}=o||{},{giftList:h=[]}=x||{},N=D?.filter(P=>P.variants.slice(1,P.variants.length).every(L=>L.variant.availableForSale))||[],[t]=N;d=u||t;const[p]=E?.filter(P=>P.availableForSale)??[];b=g||p;const[I]=h?.filter(P=>P.availableForSale)??[];return l=k||I,{bundleVariant:d,giftVariant:b,exchangeVariant:l}},M=({bundleOperation:m,bundleListItem:a,canOperate:u,status:o})=>{const{locale:g="us",copyWriting:x}=j(),{variant:k,setCheckedBundle:d}=F(),b=a?.variants.filter(l=>l.variant.sku!==k.sku);return e("div",{className:"",children:b?.map(l=>n("div",{className:"flex items-center justify-between gap-4",children:[n("div",{className:"flex items-center gap-4",children:[e(A,{source:l?.variant?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),e("div",{className:"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]",children:e(s,{className:"desktop:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold",html:l.variant.product.title})})]}),n("div",{className:"flex flex-col items-end justify-center gap-1",children:[!!a&&n("div",{className:"flex items-center gap-1",children:[e(s,{className:"desktop:text-2xl text-base font-bold",html:y({amount:l?.price||0,locale:g,currencyCode:l.variant?.price?.currencyCode||""})}),l.price<l.variant.price.amount&&e(s,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:y({amount:l.variant.price.amount||0,locale:g,currencyCode:l.variant?.price?.currencyCode||""})})]}),u&&e(G,{size:"icon",variant:"link",onClick:()=>{d?.(o?void 0:a),m?.(a)},className:"size-auto shrink-0 underline",children:o?x?.remove:x?.add})]})]},l.variant.id))})},J=({giftOperation:m,gift:a,status:u,canOperate:o})=>{const{locale:g="us",copyWriting:x}=j(),{freeGift:k,setCheckedGift:d}=F(),{freeLabel:b}=k||{},{options:l}=a||{},D=B(()=>{const E=l?.find(p=>p.name==="color"||p.name==="colour"||p.name==="couleur")||{},h=l?.find(p=>p.name==="quantity")||{},N=E?E.values?.[0]?.label:"",t=h?h.values?.[0]?.label:"";return`${N&&t?t+" | "+N:t||N} | ${b}`},[b,l]);return n("div",{className:"flex items-center justify-between gap-6",children:[n("div",{className:"flex items-center gap-4",children:[e(A,{source:a?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),n("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:a?.product?.title}),e(s,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:D})]})]}),n("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!a&&n("div",{className:"flex items-center gap-1",children:[e(s,{className:"desktop:text-2xl text-base font-bold",html:b}),e(s,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:y({amount:a.price.amount,locale:g,currencyCode:a.price.currencyCode})})]}),o&&e(G,{size:"icon",variant:"link",onClick:()=>{d?.(u?void 0:a),m(a)},className:"size-auto shrink-0 underline",children:u?x?.remove:x?.add})]})]})},Q=({exchangeOperation:m,exchange:a,canOperate:u,status:o})=>{const{locale:g="us",copyWriting:x}=j(),{setCheckedExchangePurchase:k}=F();return n("div",{className:"flex items-center justify-between gap-6",children:[n("div",{className:"flex items-center gap-4",children:[e(A,{source:a?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),n("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:a?.product?.title}),e(s,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]"})]})]}),n("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!a&&n("div",{className:"flex items-center gap-1",children:[e(s,{className:"desktop:text-2xl text-base font-bold",html:y({amount:a.finalPrice?.amount||0,locale:g,currencyCode:a.price.currencyCode})}),e(s,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:y({amount:a.price?.amount||0,locale:g,currencyCode:a.price.currencyCode})})]}),u&&e(G,{size:"icon",variant:"link",onClick:()=>{k?.(o?void 0:a),m(a)},className:"size-auto shrink-0 underline",children:o?x?.remove:x?.add})]})]})};var ye=ne(le);export{ye as default};
1
+ import{jsx as e,jsxs as n}from"react/jsx-runtime";import{Text as s,Button as A,Grid as ee,GridItem as q,Picture as F,Heading as te}from"../../../../../components/index.js";import{useBizProductContext as j}from"../../../BizProductProvider.js";import{useEffect as ae,useMemo as B,useState as ne}from"react";import{formatPrice as k}from"../../../utils/index.js";import{useAiuiContext as S}from"../../../../AiuiProvider/index.js";import K from"decimal.js";import{replaceTemplate as oe}from"../../../utils/textFormat.js";import{withLayout as ie}from"../../../../../shared/Styles.js";import{ExposureDetector as re}from"../../../../../components/index.js";import{gaTrack as le}from"../../../../../shared/track.js";const ce=()=>{const{locale:x="us",copyWriting:a}=S(),{product:u,variant:o,finalPrice:g,comparePrice:f,coupon:N,selectedOptions:d,selectedVariants:v,totalSavings:l,onAddToCart:D,onBuyNow:E,savingDetail:b,checkedBundle:P,joinedRecommendBuyProducts:t,setJoinedRecommendBuyProducts:p,setSavingDetail:$,addToCartLoading:O,buyNowLoading:G,profile:L,addOrder:I,setAddOrder:w}=j(),_=B(()=>u?.payload?.components?.find(i=>i.componentKey==="ProductSummary")?.data||{},[u?.payload]),[z]=v,T=B(()=>{const i=P?.variants.find(y=>y.variant.sku===z?.sku),r=new K(z?.price?.amount||0).minus(i?.price||z?.price?.amount).toNumber();let m=new K(z?.price?.amount||0);L?.email&&(m=m.minus(b?.member||0));const h=m.minus(b?.coupon).minus(r).toNumber();return Math.floor(h*100)/100},[z,P,L,b?.member,b?.coupon]),{bundleVariant:V,giftVariant:R,exchangeVariant:W}=se()||{},[c,C]=ne();ae(()=>{C({bundle:t.bundle?.value?void 0:V,gift:t.gift?.value?void 0:R,exchange:t.exchange?.value?void 0:W})},[V,R,W,t]);const H=B(()=>{const i=[];return I&&I.forEach((r,m)=>{t[r]?.value&&i.push({type:r,key:`${r}-${m}`})}),i},[I,t]),U=B(()=>{const i=d?.quantity||"",r=d?.color||d?.colour||d?.couleur||"";return`${i&&r?`${i} | ${r}`:i||r}`},[d?.quantity,d?.color,d?.colour,d?.couleur]),X=B(()=>{const i=o?.payload?.components?.find(Z=>Z.componentKey==="ProductSummary")?.data||{},{image_1920:r,image_1440:m,image_1024:h,image_768:y,image_390:Y}=i?.thumbnail||{};return(i?.thumbnail?`${r} 1920, ${m} 1440, ${h} 1024, ${y} 768, ${Y} 390`:o.image?.url)||o.image?.url},[o.image?.url,o?.payload?.components]);return o.availableForSale?e("div",{className:"ipc-product-summary laptop:px-16 desktop:px-0 desktop:mt-[96px] lg-desktop:mt-[128px] mt-16",children:e("div",{className:"laptop:rounded-2xl bg-[#F5F5F7]",children:n(ee,{className:"tablet:p-8 tablet:!pb-0 px-4 pt-6",children:[n(q,{className:"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4",children:[e(te,{className:"lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]",html:_?.readyWant?.replace?.("{title}",u?.title)}),e("div",{className:"",children:e(F,{source:X,className:"lg-desktop:aspect-[644/320] desktop:aspect-[503/270] laptop:aspect-[332/190] tablet:aspect-[704/380] aspect-[358/190]",imgClassName:"object-cover h-full"})})]}),n(q,{className:"tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 col-span-12 mt-8 flex flex-col justify-between gap-6 pb-6",children:[n("div",{children:[n("div",{className:"flex flex-col gap-4",children:[e(re,{exposureKey:"listing_selector",onExposure:()=>{le({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${o.sku}`,component_type:"image",component_name:"listing_selector",position:1}})},children:n("div",{className:"flex items-center justify-between gap-6",children:[n("div",{className:"flex items-center gap-4",children:[e(F,{source:o.image?.url||u?.images?.[0]?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),n("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:u.title}),e(s,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:U})]})]}),n("div",{className:"flex items-center gap-1",children:[e(s,{className:"desktop:text-2xl text-base font-bold",html:k({amount:T,currencyCode:o.price.currencyCode,locale:x})}),T<o?.price?.amount&&e(s,{className:"desktop:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through",html:k({amount:o?.price?.amount,currencyCode:o.price.currencyCode,locale:x})})]})]})}),H.map(({type:i,key:r})=>i==="gift"&&t?.gift?.value?e(J,{giftOperation:m=>{p?.({...t,gift:{value:void 0,canOperate:!0}}),C?.({...c,gift:m}),w?.(h=>h.filter(y=>y!=="gift"))},status:!!t?.gift,gift:t?.gift?.value,canOperate:t?.gift?.canOperate},r):i==="bundle"&&t?.bundle?.value?e(M,{bundleOperation:m=>{p?.({...t,bundle:{value:void 0,canOperate:!0}}),C?.({...c,bundle:m}),w?.(h=>h.filter(y=>y!=="bundle"))},status:!!t?.bundle,bundleListItem:t?.bundle?.value,canOperate:t?.bundle?.canOperate},r):i==="exchange"&&t?.exchange?.value?e(Q,{exchangeOperation:m=>{p?.({...t,exchange:{value:void 0,canOperate:!0}}),C?.({...c,exchange:m}),w?.(h=>h.filter(y=>y!=="exchange"))},status:!!t?.exchange,canOperate:t?.exchange?.canOperate,exchange:t?.exchange?.value},r):null)]}),(c?.bundle||c?.gift||c?.exchange)&&n("div",{className:"desktop:mt-8 mt-6",children:[e(s,{className:"desktop:text-[18px] text-sm font-bold",html:_?.recommendBuy}),n("div",{className:"desktop:gap-4 mt-4 flex flex-col gap-6",children:[c?.exchange&&e(Q,{exchangeOperation:i=>{p?.({...t,exchange:{value:i,canOperate:!0}}),C?.({...c,exchange:void 0}),w?.(r=>[...r,"exchange"])},canOperate:t?.exchange?.canOperate,status:!c?.exchange,exchange:c?.exchange}),c?.bundle&&e(M,{bundleOperation:i=>{$?.({...b,exchangePurchase:0}),p?.({...t,bundle:{value:i,canOperate:!0}}),C?.({...c,bundle:void 0}),w?.(r=>[...r,"bundle"])},canOperate:t?.bundle?.canOperate,status:!c?.bundle,bundleListItem:c?.bundle}),c?.gift&&e(J,{giftOperation:i=>{p?.({...t,gift:{value:i,canOperate:!0}}),C?.({...c,gift:void 0}),w?.(r=>[...r,"gift"])},canOperate:t?.gift?.canOperate,status:!c?.gift,gift:c?.gift})]})]})]}),n("div",{className:"text-right",children:[e(s,{className:"laptop:text-xl desktop:text-2xl text-right font-bold",html:`${oe(a?.totalPrice||"",{amount:k({amount:Math.floor(g*100)/100,currencyCode:o.price.currencyCode,locale:x})})}`}),l>0&&e(s,{className:"laptop:text-xl desktop:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through",html:k({amount:f,currencyCode:o.price.currencyCode,locale:x})}),n("div",{className:"mt-4 flex justify-end gap-3",children:[e(A,{size:"lg",variant:"secondary",loading:O,className:"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2",onClick:()=>D?.(),children:a?.addToCart}),e(A,{size:"lg",loading:G,variant:"primary",className:"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2",onClick:()=>E?.(),children:a?.shopNow})]})]})]})]})})}):null},se=()=>{const{bundle:x,variant:a,checkedBundle:u,freeGift:o,checkedGift:g,exchangePurchase:f,checkedExchangePurchase:N}=j();let d,v,l;const{bundleList:D}=x||{},{giftList:E=[]}=o||{},{giftList:b=[]}=f||{},P=D?.filter(O=>O.variants.slice(1,O.variants.length).every(G=>G.variant.availableForSale))||[],[t]=P;d=u||t;const[p]=E?.filter(O=>O.availableForSale)??[];v=g||p;const[$]=b?.filter(O=>O.availableForSale)??[];return l=N||$,{bundleVariant:d,giftVariant:v,exchangeVariant:l}},M=({bundleOperation:x,bundleListItem:a,canOperate:u,status:o})=>{const{locale:g="us",copyWriting:f}=S(),{variant:N,setCheckedBundle:d}=j(),v=a?.variants.filter(l=>l.variant.sku!==N.sku);return e("div",{className:"",children:v?.map(l=>n("div",{className:"flex items-center justify-between gap-4",children:[n("div",{className:"flex items-center gap-4",children:[e(F,{source:l?.variant?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),e("div",{className:"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]",children:e(s,{className:"desktop:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold",html:l.variant.product.title})})]}),n("div",{className:"flex flex-col items-end justify-center gap-1",children:[!!a&&n("div",{className:"flex items-center gap-1",children:[e(s,{className:"desktop:text-2xl text-base font-bold",html:k({amount:l?.price||0,locale:g,currencyCode:l.variant?.price?.currencyCode||""})}),l.price<l.variant.price.amount&&e(s,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:k({amount:l.variant.price.amount||0,locale:g,currencyCode:l.variant?.price?.currencyCode||""})})]}),u&&e(A,{size:"icon",variant:"link",onClick:()=>{d?.(o?void 0:a),x?.(a)},className:"size-auto shrink-0 underline",children:o?f?.remove:f?.add})]})]},l.variant.id))})},J=({giftOperation:x,gift:a,status:u,canOperate:o})=>{const{locale:g="us",copyWriting:f}=S(),{freeGift:N,setCheckedGift:d}=j(),{freeLabel:v}=N||{},{options:l}=a||{},D=B(()=>{const E=l?.find(p=>p.name==="color"||p.name==="colour"||p.name==="couleur")||{},b=l?.find(p=>p.name==="quantity")||{},P=E?E.values?.[0]?.label:"",t=b?b.values?.[0]?.label:"";return`${P&&t?t+" | "+P:t||P} | ${v}`},[v,l]);return n("div",{className:"flex items-center justify-between gap-6",children:[n("div",{className:"flex items-center gap-4",children:[e(F,{source:a?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),n("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:a?.product?.title}),e(s,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:D})]})]}),n("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!a&&n("div",{className:"flex items-center gap-1",children:[e(s,{className:"desktop:text-2xl text-base font-bold",html:v}),e(s,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:k({amount:a.price.amount,locale:g,currencyCode:a.price.currencyCode})})]}),o&&e(A,{size:"icon",variant:"link",onClick:()=>{d?.(u?void 0:a),x(a)},className:"size-auto shrink-0 underline",children:u?f?.remove:f?.add})]})]})},Q=({exchangeOperation:x,exchange:a,canOperate:u,status:o})=>{const{locale:g="us",copyWriting:f}=S(),{setCheckedExchangePurchase:N}=j();return n("div",{className:"flex items-center justify-between gap-6",children:[n("div",{className:"flex items-center gap-4",children:[e(F,{source:a?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),n("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:a?.product?.title}),e(s,{className:"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]"})]})]}),n("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!a&&n("div",{className:"flex items-center gap-1",children:[e(s,{className:"desktop:text-2xl text-base font-bold",html:k({amount:a.finalPrice?.amount||0,locale:g,currencyCode:a.price.currencyCode})}),e(s,{className:"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:k({amount:a.price?.amount||0,locale:g,currencyCode:a.price.currencyCode})})]}),u&&e(A,{size:"icon",variant:"link",onClick:()=>{N?.(o?void 0:a),x(a)},className:"size-auto shrink-0 underline",children:o?f?.remove:f?.add})]})]})};var Pe=ie(ce);export{Pe 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/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useEffect, useMemo, useState } from 'react'\nimport { formatPrice } from '../../../utils/index.js'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport type { BundleListItem, ProductVariant, ProductPrice, ProductOption } from '../../../types/product'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat.js'\nimport { withLayout } from '../../../../../shared/Styles.js'\nimport { ExposureDetector } from '../../../../../components/index.js'\nimport { gaTrack } from '../../../../../shared/track.js'\n\nconst ProductSummary = () => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const {\n product,\n variant,\n finalPrice,\n comparePrice,\n coupon,\n selectedOptions,\n selectedVariants,\n totalSavings,\n onAddToCart,\n onBuyNow,\n savingDetail,\n checkedBundle,\n joinedRecommendBuyProducts,\n setJoinedRecommendBuyProducts,\n setSavingDetail,\n addToCartLoading,\n buyNowLoading,\n profile,\n addOrder,\n setAddOrder,\n } = useBizProductContext()\n\n const productSummaryData = useMemo(() => {\n return product?.payload?.components?.find((item: any) => item.componentKey === 'ProductSummary')?.data || {}\n }, [product?.payload])\n\n const [currentProductVariant] = selectedVariants\n\n const summaryFinalPrice = useMemo(() => {\n const currentBundleVariant = checkedBundle?.variants.find(v => v.variant.sku === currentProductVariant?.sku)\n const currentBundlePrice = new Decimal(currentProductVariant?.price?.amount || 0)\n .minus(currentBundleVariant?.price || currentProductVariant?.price?.amount)\n .toNumber()\n let currentProductPrice = new Decimal(currentProductVariant?.price?.amount || 0)\n if (profile?.email) {\n currentProductPrice = currentProductPrice.minus(savingDetail?.member || 0)\n }\n const finalPrice = currentProductPrice.minus(savingDetail?.coupon).minus(currentBundlePrice).toNumber()\n return Math.floor(finalPrice * 100) / 100\n }, [currentProductVariant, checkedBundle, profile, savingDetail?.member, savingDetail?.coupon])\n\n const { bundleVariant, giftVariant, exchangeVariant } = useRecommendBuyProducts() || {}\n\n const [initialRecommendBuyProducts, setInitialRecommendBuyProducts] = useState<{\n bundle?: BundleListItem\n gift?: ProductVariant\n exchange?: ProductVariant\n }>()\n\n useEffect(() => {\n setInitialRecommendBuyProducts({\n bundle: joinedRecommendBuyProducts.bundle?.value ? undefined : bundleVariant,\n gift: joinedRecommendBuyProducts.gift?.value ? undefined : giftVariant,\n exchange: joinedRecommendBuyProducts.exchange?.value ? undefined : exchangeVariant,\n })\n }, [bundleVariant, giftVariant, exchangeVariant, joinedRecommendBuyProducts])\n\n // \u6839\u636E\u6DFB\u52A0\u987A\u5E8F\u751F\u6210\u5DF2\u6DFB\u52A0\u4EA7\u54C1\u7684\u5217\u8868\n const orderedJoinedProducts = useMemo(() => {\n const result: Array<{ type: 'bundle' | 'gift' | 'exchange'; key: string }> = []\n\n // \u6309\u7167\u6DFB\u52A0\u987A\u5E8F\u6DFB\u52A0\n if (addOrder) {\n addOrder.forEach((type, index) => {\n if (joinedRecommendBuyProducts[type]?.value) {\n result.push({ type, key: `${type}-${index}` })\n }\n })\n }\n\n return result\n }, [addOrder, joinedRecommendBuyProducts])\n\n const productOptionsText = useMemo(() => {\n const quantity = selectedOptions?.quantity || ''\n const color = selectedOptions?.color || selectedOptions?.colour || selectedOptions?.couleur || ''\n return `${quantity && color ? `${quantity} | ${color}` : quantity || color}`\n }, [selectedOptions?.quantity, selectedOptions?.color, selectedOptions?.colour, selectedOptions?.couleur])\n\n const variantImage = useMemo(() => {\n const variantProductGallery =\n variant?.payload?.components?.find((item: any) => item.componentKey === 'ProductGallery')?.data || []\n const variantProductGalleryItem = variantProductGallery?.find(\n (variantItem: any) => variantItem?.galleries === 'productList'\n )\n const variantProductGalleryItemImage = variantProductGalleryItem?.images?.[0]?.image_1920 || variant.image?.url\n return variantProductGalleryItemImage || variant.image?.url\n }, [variant.image?.url, variant?.payload?.components])\n\n const isAvailable = variant.availableForSale\n if (!isAvailable) return null\n\n return (\n <div className=\"ipc-product-summary laptop:px-16 desktop:px-0 desktop:mt-[96px] lg-desktop:mt-[128px] mt-16\">\n <div className=\"laptop:rounded-2xl bg-[#F5F5F7]\">\n <Grid className=\"tablet:p-8 tablet:!pb-0 px-4 pt-6\">\n <GridItem className=\"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4\">\n <Heading\n className=\"lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]\"\n html={productSummaryData?.readyWant?.replace?.('{title}', product?.title)}\n />\n <div className=\"\">\n <Picture\n source={variantImage}\n className=\"lg-desktop:h-[320px] desktop:h-[272px] laptop:h-[191px] tablet:h-[380px] aspect-1 mx-auto h-[192px]\"\n imgClassName=\"object-cover h-full\"\n />\n </div>\n </GridItem>\n <GridItem className=\"tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 col-span-12 mt-8 flex flex-col justify-between gap-6 pb-6\">\n <div>\n <div className=\"flex flex-col gap-4\">\n <ExposureDetector\n exposureKey=\"listing_selector\"\n onExposure={() => {\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: `Product Detail Page${variant.sku}`,\n component_type: 'image',\n component_name: 'listing_selector',\n position: 1,\n },\n })\n }}\n >\n <div className=\"flex items-center justify-between gap-6\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n />\n <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n <Text\n className=\"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n html={product.title}\n />\n <Text\n className=\"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]\"\n html={productOptionsText}\n />\n </div>\n </div>\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"desktop:text-2xl text-base font-bold\"\n html={formatPrice({\n amount: summaryFinalPrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n {summaryFinalPrice < variant?.price?.amount && (\n <Text\n className=\"desktop:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: variant?.price?.amount,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n </div>\n </div>\n </ExposureDetector>\n {/* \u6309\u7167\u6DFB\u52A0\u987A\u5E8F\u6E32\u67D3\u5DF2\u6DFB\u52A0\u7684\u4EA7\u54C1 */}\n {orderedJoinedProducts.map(({ type, key }) => {\n if (type === 'gift' && joinedRecommendBuyProducts?.gift?.value) {\n return (\n <ProductGiftSummary\n key={key}\n giftOperation={gift => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n gift: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift })\n // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n setAddOrder?.(prev => prev.filter(t => t !== 'gift'))\n }}\n status={!!joinedRecommendBuyProducts?.gift}\n gift={joinedRecommendBuyProducts?.gift?.value}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n />\n )\n }\n if (type === 'bundle' && joinedRecommendBuyProducts?.bundle?.value) {\n return (\n <ProductBundleSummary\n key={key}\n bundleOperation={bundle => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n bundle: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle })\n // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n setAddOrder?.(prev => prev.filter(t => t !== 'bundle'))\n }}\n status={!!joinedRecommendBuyProducts?.bundle}\n bundleListItem={joinedRecommendBuyProducts?.bundle?.value}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n />\n )\n }\n if (type === 'exchange' && joinedRecommendBuyProducts?.exchange?.value) {\n return (\n <ProductExchangeSummary\n key={key}\n exchangeOperation={exchange => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n exchange: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange })\n // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n setAddOrder?.(prev => prev.filter(t => t !== 'exchange'))\n }}\n status={!!joinedRecommendBuyProducts?.exchange}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n exchange={joinedRecommendBuyProducts?.exchange?.value}\n />\n )\n }\n return null\n })}\n </div>\n {(initialRecommendBuyProducts?.bundle ||\n initialRecommendBuyProducts?.gift ||\n initialRecommendBuyProducts?.exchange) && (\n <div className=\"desktop:mt-8 mt-6\">\n <Text className=\"desktop:text-[18px] text-sm font-bold\" html={productSummaryData?.recommendBuy} />\n <div className=\"desktop:gap-4 mt-4 flex flex-col gap-6\">\n {initialRecommendBuyProducts?.exchange && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n exchange: {\n value: exchange,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange: undefined })\n // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n setAddOrder?.(prev => [...prev, 'exchange'])\n }}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n status={!initialRecommendBuyProducts?.exchange}\n exchange={initialRecommendBuyProducts?.exchange}\n />\n )}\n {initialRecommendBuyProducts?.bundle && (\n <ProductBundleSummary\n bundleOperation={bundle => {\n setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n bundle: {\n value: bundle,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle: undefined })\n // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n setAddOrder?.(prev => [...prev, 'bundle'])\n }}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n status={!initialRecommendBuyProducts?.bundle}\n bundleListItem={initialRecommendBuyProducts?.bundle}\n />\n )}\n {initialRecommendBuyProducts?.gift && (\n <ProductGiftSummary\n giftOperation={gift => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n gift: {\n value: gift,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift: undefined })\n // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n setAddOrder?.(prev => [...prev, 'gift'])\n }}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n status={!initialRecommendBuyProducts?.gift}\n gift={initialRecommendBuyProducts?.gift}\n />\n )}\n </div>\n </div>\n )}\n </div>\n <div className=\"text-right\">\n <Text\n className=\"laptop:text-xl desktop:text-2xl text-right font-bold\"\n html={`${replaceTemplate(copyWriting?.totalPrice || '', { amount: formatPrice({ amount: Math.floor(finalPrice * 100) / 100, currencyCode: variant.price.currencyCode, locale }) })}`}\n />\n\n {totalSavings > 0 && (\n <Text\n className=\"laptop:text-xl desktop:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: comparePrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n <div className=\"mt-4 flex justify-end gap-3\">\n <Button\n size=\"lg\"\n variant=\"secondary\"\n loading={addToCartLoading}\n className=\"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2\"\n onClick={() => onAddToCart?.()}\n >\n {copyWriting?.addToCart}\n </Button>\n <Button\n size=\"lg\"\n loading={buyNowLoading}\n variant=\"primary\"\n className=\"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2\"\n onClick={() => onBuyNow?.()}\n >\n {copyWriting?.shopNow}\n </Button>\n </div>\n </div>\n </GridItem>\n </Grid>\n </div>\n </div>\n )\n}\n\nconst useRecommendBuyProducts = () => {\n const { bundle, variant, checkedBundle, freeGift, checkedGift, exchangePurchase, checkedExchangePurchase } =\n useBizProductContext()\n let bundleVariant = undefined\n let giftVariant = undefined\n let exchangeVariant = undefined\n const { bundleList } = bundle || {}\n\n const { giftList = [] } = freeGift || {}\n const { giftList: exchangeList = [] } = exchangePurchase || {}\n\n const availableBundleList =\n bundleList?.filter(bundle =>\n bundle.variants.slice(1, bundle.variants.length).every(v => v.variant.availableForSale)\n ) || []\n\n const [firstAvailableBundle] = availableBundleList\n bundleVariant = checkedBundle || firstAvailableBundle\n\n const [firstAvailableGift] = giftList?.filter(gift => gift.availableForSale) ?? []\n giftVariant = checkedGift || firstAvailableGift\n\n const [firstAvailableExchange] = exchangeList?.filter(exchange => exchange.availableForSale) ?? []\n exchangeVariant = checkedExchangePurchase || firstAvailableExchange\n\n return { bundleVariant, giftVariant, exchangeVariant }\n}\n\nconst ProductBundleSummary = ({\n bundleOperation,\n bundleListItem,\n canOperate,\n status,\n}: {\n bundleOperation: (bundle?: BundleListItem) => void\n bundleListItem?: BundleListItem\n canOperate?: boolean\n status?: boolean\n}) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const { variant, setCheckedBundle } = useBizProductContext()\n const bundleVariants = bundleListItem?.variants.filter(v => v.variant.sku !== variant.sku)\n\n return (\n <div className=\"\">\n {bundleVariants?.map(bundleVariant => {\n return (\n <div className=\"flex items-center justify-between gap-4\" key={bundleVariant.variant.id}>\n <div className=\"flex items-center gap-4\">\n <Picture\n source={bundleVariant?.variant?.image?.url}\n className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n />\n <div className=\"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]\">\n <Text\n className=\"desktop:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold\"\n html={bundleVariant.variant.product.title}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end justify-center gap-1\">\n {!!bundleListItem && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"desktop:text-2xl text-base font-bold\"\n html={formatPrice({\n amount: bundleVariant?.price || 0,\n locale,\n currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n })}\n />\n {bundleVariant.price < bundleVariant.variant.price.amount && (\n <Text\n className=\"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: bundleVariant.variant.price.amount || 0,\n locale,\n currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n })}\n />\n )}\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedBundle?.(status ? undefined : bundleListItem)\n bundleOperation?.(bundleListItem)\n }}\n className=\"size-auto shrink-0 underline\"\n >\n {status ? copyWriting?.remove : copyWriting?.add}\n </Button>\n )}\n </div>\n </div>\n )\n })}\n </div>\n )\n}\n\nconst ProductGiftSummary = ({\n giftOperation,\n gift,\n status,\n canOperate,\n}: {\n giftOperation: (gift?: ProductVariant) => void\n gift?: ProductVariant\n status?: boolean\n canOperate?: boolean\n}) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const { freeGift, setCheckedGift } = useBizProductContext()\n const { freeLabel } = freeGift || {}\n const { options } = gift || {}\n\n const giftOptionsText = useMemo(() => {\n const giftColorOption = (options?.find(\n option => option.name === 'color' || option.name === 'colour' || option.name === 'couleur'\n ) || {}) as ProductOption\n const giftQuantityOption = options?.find(option => option.name === 'quantity') || ({} as ProductOption)\n const giftColorOptionText = giftColorOption ? giftColorOption.values?.[0]?.label : ''\n const giftQuantityOptionText = giftQuantityOption ? giftQuantityOption.values?.[0]?.label : ''\n return `${giftColorOptionText && giftQuantityOptionText ? giftQuantityOptionText + ' | ' + giftColorOptionText : giftQuantityOptionText || giftColorOptionText} | ${freeLabel}`\n }, [freeLabel, options])\n\n return (\n <div className=\"flex items-center justify-between gap-6\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={gift?.image?.url}\n className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n />\n <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n <Text\n className=\"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n html={gift?.product?.title}\n />\n <Text\n className=\"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]\"\n html={giftOptionsText}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end justify-center gap-2\">\n {!!gift && (\n <div className=\"flex items-center gap-1\">\n <Text className=\"desktop:text-2xl text-base font-bold\" html={freeLabel} />\n <Text\n className=\"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: gift.price.amount,\n locale,\n currencyCode: gift.price.currencyCode,\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedGift?.(status ? undefined : gift)\n giftOperation(gift)\n }}\n className=\"size-auto shrink-0 underline\"\n >\n {status ? copyWriting?.remove : copyWriting?.add}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nconst ProductExchangeSummary = ({\n exchangeOperation,\n exchange,\n canOperate,\n status,\n}: {\n exchangeOperation: (exchange?: ProductVariant) => void\n exchange?: ProductVariant & { finalPrice?: ProductPrice }\n canOperate?: boolean\n status?: boolean\n}) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const { setCheckedExchangePurchase } = useBizProductContext()\n\n return (\n <div className=\"flex items-center justify-between gap-6\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={exchange?.image?.url}\n className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n />\n <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n <Text\n className=\"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n html={exchange?.product?.title}\n />\n <Text className=\"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]\" />\n </div>\n </div>\n <div className=\"flex flex-col items-end justify-center gap-2\">\n {!!exchange && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"desktop:text-2xl text-base font-bold\"\n html={formatPrice({\n amount: exchange.finalPrice?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n <Text\n className=\"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: exchange.price?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedExchangePurchase?.(status ? undefined : exchange)\n exchangeOperation(exchange)\n }}\n className=\"size-auto shrink-0 underline\"\n >\n {status ? copyWriting?.remove : copyWriting?.add}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nexport default withLayout(ProductSummary)\n"],
5
- "mappings": "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",
6
- "names": ["jsx", "jsxs", "Text", "Button", "Grid", "GridItem", "Picture", "Heading", "useBizProductContext", "useEffect", "useMemo", "useState", "formatPrice", "useAiuiContext", "Decimal", "replaceTemplate", "withLayout", "ExposureDetector", "gaTrack", "ProductSummary", "locale", "copyWriting", "product", "variant", "finalPrice", "comparePrice", "coupon", "selectedOptions", "selectedVariants", "totalSavings", "onAddToCart", "onBuyNow", "savingDetail", "checkedBundle", "joinedRecommendBuyProducts", "setJoinedRecommendBuyProducts", "setSavingDetail", "addToCartLoading", "buyNowLoading", "profile", "addOrder", "setAddOrder", "productSummaryData", "item", "currentProductVariant", "summaryFinalPrice", "currentBundleVariant", "v", "currentBundlePrice", "currentProductPrice", "bundleVariant", "giftVariant", "exchangeVariant", "useRecommendBuyProducts", "initialRecommendBuyProducts", "setInitialRecommendBuyProducts", "orderedJoinedProducts", "result", "type", "index", "productOptionsText", "quantity", "color", "variantImage", "variantItem", "key", "ProductGiftSummary", "gift", "prev", "t", "ProductBundleSummary", "bundle", "ProductExchangeSummary", "exchange", "freeGift", "checkedGift", "exchangePurchase", "checkedExchangePurchase", "bundleList", "giftList", "exchangeList", "availableBundleList", "firstAvailableBundle", "firstAvailableGift", "firstAvailableExchange", "bundleOperation", "bundleListItem", "canOperate", "status", "setCheckedBundle", "bundleVariants", "giftOperation", "setCheckedGift", "freeLabel", "options", "giftOptionsText", "giftColorOption", "option", "giftQuantityOption", "giftColorOptionText", "giftQuantityOptionText", "exchangeOperation", "setCheckedExchangePurchase", "ProductSummary_default"]
4
+ "sourcesContent": ["import { Text, Button, Container, Grid, GridItem, Picture, Heading } from '../../../../../components/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useEffect, useMemo, useState } from 'react'\nimport { formatPrice } from '../../../utils/index.js'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport type { BundleListItem, ProductVariant, ProductPrice, ProductOption } from '../../../types/product'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat.js'\nimport { withLayout } from '../../../../../shared/Styles.js'\nimport { ExposureDetector } from '../../../../../components/index.js'\nimport { gaTrack } from '../../../../../shared/track.js'\n\nconst ProductSummary = () => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const {\n product,\n variant,\n finalPrice,\n comparePrice,\n coupon,\n selectedOptions,\n selectedVariants,\n totalSavings,\n onAddToCart,\n onBuyNow,\n savingDetail,\n checkedBundle,\n joinedRecommendBuyProducts,\n setJoinedRecommendBuyProducts,\n setSavingDetail,\n addToCartLoading,\n buyNowLoading,\n profile,\n addOrder,\n setAddOrder,\n } = useBizProductContext()\n\n const productSummaryData = useMemo(() => {\n return product?.payload?.components?.find((item: any) => item.componentKey === 'ProductSummary')?.data || {}\n }, [product?.payload])\n\n const [currentProductVariant] = selectedVariants\n\n const summaryFinalPrice = useMemo(() => {\n const currentBundleVariant = checkedBundle?.variants.find(v => v.variant.sku === currentProductVariant?.sku)\n const currentBundlePrice = new Decimal(currentProductVariant?.price?.amount || 0)\n .minus(currentBundleVariant?.price || currentProductVariant?.price?.amount)\n .toNumber()\n let currentProductPrice = new Decimal(currentProductVariant?.price?.amount || 0)\n if (profile?.email) {\n currentProductPrice = currentProductPrice.minus(savingDetail?.member || 0)\n }\n const finalPrice = currentProductPrice.minus(savingDetail?.coupon).minus(currentBundlePrice).toNumber()\n return Math.floor(finalPrice * 100) / 100\n }, [currentProductVariant, checkedBundle, profile, savingDetail?.member, savingDetail?.coupon])\n\n const { bundleVariant, giftVariant, exchangeVariant } = useRecommendBuyProducts() || {}\n\n const [initialRecommendBuyProducts, setInitialRecommendBuyProducts] = useState<{\n bundle?: BundleListItem\n gift?: ProductVariant\n exchange?: ProductVariant\n }>()\n\n useEffect(() => {\n setInitialRecommendBuyProducts({\n bundle: joinedRecommendBuyProducts.bundle?.value ? undefined : bundleVariant,\n gift: joinedRecommendBuyProducts.gift?.value ? undefined : giftVariant,\n exchange: joinedRecommendBuyProducts.exchange?.value ? undefined : exchangeVariant,\n })\n }, [bundleVariant, giftVariant, exchangeVariant, joinedRecommendBuyProducts])\n\n // \u6839\u636E\u6DFB\u52A0\u987A\u5E8F\u751F\u6210\u5DF2\u6DFB\u52A0\u4EA7\u54C1\u7684\u5217\u8868\n const orderedJoinedProducts = useMemo(() => {\n const result: Array<{ type: 'bundle' | 'gift' | 'exchange'; key: string }> = []\n\n // \u6309\u7167\u6DFB\u52A0\u987A\u5E8F\u6DFB\u52A0\n if (addOrder) {\n addOrder.forEach((type, index) => {\n if (joinedRecommendBuyProducts[type]?.value) {\n result.push({ type, key: `${type}-${index}` })\n }\n })\n }\n\n return result\n }, [addOrder, joinedRecommendBuyProducts])\n\n const productOptionsText = useMemo(() => {\n const quantity = selectedOptions?.quantity || ''\n const color = selectedOptions?.color || selectedOptions?.colour || selectedOptions?.couleur || ''\n return `${quantity && color ? `${quantity} | ${color}` : quantity || color}`\n }, [selectedOptions?.quantity, selectedOptions?.color, selectedOptions?.colour, selectedOptions?.couleur])\n\n const variantImage = useMemo(() => {\n const variantProductSummary =\n variant?.payload?.components?.find((item: any) => item.componentKey === 'ProductSummary')?.data || {}\n const { image_1920, image_1440, image_1024, image_768, image_390 } = variantProductSummary?.thumbnail || {}\n const variantProductGalleryItemImage = variantProductSummary?.thumbnail\n ? `${image_1920} 1920, ${image_1440} 1440, ${image_1024} 1024, ${image_768} 768, ${image_390} 390`\n : variant.image?.url\n return variantProductGalleryItemImage || variant.image?.url\n }, [variant.image?.url, variant?.payload?.components])\n\n const isAvailable = variant.availableForSale\n if (!isAvailable) return null\n\n return (\n <div className=\"ipc-product-summary laptop:px-16 desktop:px-0 desktop:mt-[96px] lg-desktop:mt-[128px] mt-16\">\n <div className=\"laptop:rounded-2xl bg-[#F5F5F7]\">\n <Grid className=\"tablet:p-8 tablet:!pb-0 px-4 pt-6\">\n <GridItem className=\"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4\">\n <Heading\n className=\"lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]\"\n html={productSummaryData?.readyWant?.replace?.('{title}', product?.title)}\n />\n <div className=\"\">\n <Picture\n source={variantImage}\n className=\"lg-desktop:aspect-[644/320] desktop:aspect-[503/270] laptop:aspect-[332/190] tablet:aspect-[704/380] aspect-[358/190]\"\n imgClassName=\"object-cover h-full\"\n />\n </div>\n </GridItem>\n <GridItem className=\"tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 col-span-12 mt-8 flex flex-col justify-between gap-6 pb-6\">\n <div>\n <div className=\"flex flex-col gap-4\">\n <ExposureDetector\n exposureKey=\"listing_selector\"\n onExposure={() => {\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: `Product Detail Page${variant.sku}`,\n component_type: 'image',\n component_name: 'listing_selector',\n position: 1,\n },\n })\n }}\n >\n <div className=\"flex items-center justify-between gap-6\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n />\n <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n <Text\n className=\"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n html={product.title}\n />\n <Text\n className=\"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]\"\n html={productOptionsText}\n />\n </div>\n </div>\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"desktop:text-2xl text-base font-bold\"\n html={formatPrice({\n amount: summaryFinalPrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n {summaryFinalPrice < variant?.price?.amount && (\n <Text\n className=\"desktop:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: variant?.price?.amount,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n </div>\n </div>\n </ExposureDetector>\n {/* \u6309\u7167\u6DFB\u52A0\u987A\u5E8F\u6E32\u67D3\u5DF2\u6DFB\u52A0\u7684\u4EA7\u54C1 */}\n {orderedJoinedProducts.map(({ type, key }) => {\n if (type === 'gift' && joinedRecommendBuyProducts?.gift?.value) {\n return (\n <ProductGiftSummary\n key={key}\n giftOperation={gift => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n gift: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift })\n // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n setAddOrder?.(prev => prev.filter(t => t !== 'gift'))\n }}\n status={!!joinedRecommendBuyProducts?.gift}\n gift={joinedRecommendBuyProducts?.gift?.value}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n />\n )\n }\n if (type === 'bundle' && joinedRecommendBuyProducts?.bundle?.value) {\n return (\n <ProductBundleSummary\n key={key}\n bundleOperation={bundle => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n bundle: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle })\n // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n setAddOrder?.(prev => prev.filter(t => t !== 'bundle'))\n }}\n status={!!joinedRecommendBuyProducts?.bundle}\n bundleListItem={joinedRecommendBuyProducts?.bundle?.value}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n />\n )\n }\n if (type === 'exchange' && joinedRecommendBuyProducts?.exchange?.value) {\n return (\n <ProductExchangeSummary\n key={key}\n exchangeOperation={exchange => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n exchange: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange })\n // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n setAddOrder?.(prev => prev.filter(t => t !== 'exchange'))\n }}\n status={!!joinedRecommendBuyProducts?.exchange}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n exchange={joinedRecommendBuyProducts?.exchange?.value}\n />\n )\n }\n return null\n })}\n </div>\n {(initialRecommendBuyProducts?.bundle ||\n initialRecommendBuyProducts?.gift ||\n initialRecommendBuyProducts?.exchange) && (\n <div className=\"desktop:mt-8 mt-6\">\n <Text className=\"desktop:text-[18px] text-sm font-bold\" html={productSummaryData?.recommendBuy} />\n <div className=\"desktop:gap-4 mt-4 flex flex-col gap-6\">\n {initialRecommendBuyProducts?.exchange && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n exchange: {\n value: exchange,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange: undefined })\n // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n setAddOrder?.(prev => [...prev, 'exchange'])\n }}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n status={!initialRecommendBuyProducts?.exchange}\n exchange={initialRecommendBuyProducts?.exchange}\n />\n )}\n {initialRecommendBuyProducts?.bundle && (\n <ProductBundleSummary\n bundleOperation={bundle => {\n setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n bundle: {\n value: bundle,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle: undefined })\n // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n setAddOrder?.(prev => [...prev, 'bundle'])\n }}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n status={!initialRecommendBuyProducts?.bundle}\n bundleListItem={initialRecommendBuyProducts?.bundle}\n />\n )}\n {initialRecommendBuyProducts?.gift && (\n <ProductGiftSummary\n giftOperation={gift => {\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n gift: {\n value: gift,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift: undefined })\n // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n setAddOrder?.(prev => [...prev, 'gift'])\n }}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n status={!initialRecommendBuyProducts?.gift}\n gift={initialRecommendBuyProducts?.gift}\n />\n )}\n </div>\n </div>\n )}\n </div>\n <div className=\"text-right\">\n <Text\n className=\"laptop:text-xl desktop:text-2xl text-right font-bold\"\n html={`${replaceTemplate(copyWriting?.totalPrice || '', { amount: formatPrice({ amount: Math.floor(finalPrice * 100) / 100, currencyCode: variant.price.currencyCode, locale }) })}`}\n />\n\n {totalSavings > 0 && (\n <Text\n className=\"laptop:text-xl desktop:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: comparePrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n <div className=\"mt-4 flex justify-end gap-3\">\n <Button\n size=\"lg\"\n variant=\"secondary\"\n loading={addToCartLoading}\n className=\"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2\"\n onClick={() => onAddToCart?.()}\n >\n {copyWriting?.addToCart}\n </Button>\n <Button\n size=\"lg\"\n loading={buyNowLoading}\n variant=\"primary\"\n className=\"tablet:w-auto laptop:w-1/2 desktop:w-auto w-1/2\"\n onClick={() => onBuyNow?.()}\n >\n {copyWriting?.shopNow}\n </Button>\n </div>\n </div>\n </GridItem>\n </Grid>\n </div>\n </div>\n )\n}\n\nconst useRecommendBuyProducts = () => {\n const { bundle, variant, checkedBundle, freeGift, checkedGift, exchangePurchase, checkedExchangePurchase } =\n useBizProductContext()\n let bundleVariant = undefined\n let giftVariant = undefined\n let exchangeVariant = undefined\n const { bundleList } = bundle || {}\n\n const { giftList = [] } = freeGift || {}\n const { giftList: exchangeList = [] } = exchangePurchase || {}\n\n const availableBundleList =\n bundleList?.filter(bundle =>\n bundle.variants.slice(1, bundle.variants.length).every(v => v.variant.availableForSale)\n ) || []\n\n const [firstAvailableBundle] = availableBundleList\n bundleVariant = checkedBundle || firstAvailableBundle\n\n const [firstAvailableGift] = giftList?.filter(gift => gift.availableForSale) ?? []\n giftVariant = checkedGift || firstAvailableGift\n\n const [firstAvailableExchange] = exchangeList?.filter(exchange => exchange.availableForSale) ?? []\n exchangeVariant = checkedExchangePurchase || firstAvailableExchange\n\n return { bundleVariant, giftVariant, exchangeVariant }\n}\n\nconst ProductBundleSummary = ({\n bundleOperation,\n bundleListItem,\n canOperate,\n status,\n}: {\n bundleOperation: (bundle?: BundleListItem) => void\n bundleListItem?: BundleListItem\n canOperate?: boolean\n status?: boolean\n}) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const { variant, setCheckedBundle } = useBizProductContext()\n const bundleVariants = bundleListItem?.variants.filter(v => v.variant.sku !== variant.sku)\n\n return (\n <div className=\"\">\n {bundleVariants?.map(bundleVariant => {\n return (\n <div className=\"flex items-center justify-between gap-4\" key={bundleVariant.variant.id}>\n <div className=\"flex items-center gap-4\">\n <Picture\n source={bundleVariant?.variant?.image?.url}\n className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n />\n <div className=\"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]\">\n <Text\n className=\"desktop:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold\"\n html={bundleVariant.variant.product.title}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end justify-center gap-1\">\n {!!bundleListItem && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"desktop:text-2xl text-base font-bold\"\n html={formatPrice({\n amount: bundleVariant?.price || 0,\n locale,\n currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n })}\n />\n {bundleVariant.price < bundleVariant.variant.price.amount && (\n <Text\n className=\"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: bundleVariant.variant.price.amount || 0,\n locale,\n currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n })}\n />\n )}\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedBundle?.(status ? undefined : bundleListItem)\n bundleOperation?.(bundleListItem)\n }}\n className=\"size-auto shrink-0 underline\"\n >\n {status ? copyWriting?.remove : copyWriting?.add}\n </Button>\n )}\n </div>\n </div>\n )\n })}\n </div>\n )\n}\n\nconst ProductGiftSummary = ({\n giftOperation,\n gift,\n status,\n canOperate,\n}: {\n giftOperation: (gift?: ProductVariant) => void\n gift?: ProductVariant\n status?: boolean\n canOperate?: boolean\n}) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const { freeGift, setCheckedGift } = useBizProductContext()\n const { freeLabel } = freeGift || {}\n const { options } = gift || {}\n\n const giftOptionsText = useMemo(() => {\n const giftColorOption = (options?.find(\n option => option.name === 'color' || option.name === 'colour' || option.name === 'couleur'\n ) || {}) as ProductOption\n const giftQuantityOption = options?.find(option => option.name === 'quantity') || ({} as ProductOption)\n const giftColorOptionText = giftColorOption ? giftColorOption.values?.[0]?.label : ''\n const giftQuantityOptionText = giftQuantityOption ? giftQuantityOption.values?.[0]?.label : ''\n return `${giftColorOptionText && giftQuantityOptionText ? giftQuantityOptionText + ' | ' + giftColorOptionText : giftQuantityOptionText || giftColorOptionText} | ${freeLabel}`\n }, [freeLabel, options])\n\n return (\n <div className=\"flex items-center justify-between gap-6\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={gift?.image?.url}\n className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n />\n <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n <Text\n className=\"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n html={gift?.product?.title}\n />\n <Text\n className=\"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]\"\n html={giftOptionsText}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end justify-center gap-2\">\n {!!gift && (\n <div className=\"flex items-center gap-1\">\n <Text className=\"desktop:text-2xl text-base font-bold\" html={freeLabel} />\n <Text\n className=\"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: gift.price.amount,\n locale,\n currencyCode: gift.price.currencyCode,\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedGift?.(status ? undefined : gift)\n giftOperation(gift)\n }}\n className=\"size-auto shrink-0 underline\"\n >\n {status ? copyWriting?.remove : copyWriting?.add}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nconst ProductExchangeSummary = ({\n exchangeOperation,\n exchange,\n canOperate,\n status,\n}: {\n exchangeOperation: (exchange?: ProductVariant) => void\n exchange?: ProductVariant & { finalPrice?: ProductPrice }\n canOperate?: boolean\n status?: boolean\n}) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const { setCheckedExchangePurchase } = useBizProductContext()\n\n return (\n <div className=\"flex items-center justify-between gap-6\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={exchange?.image?.url}\n className=\"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2\"\n />\n <div className=\"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]\">\n <Text\n className=\"desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold\"\n html={exchange?.product?.title}\n />\n <Text className=\"laptop:text-[14px] desktop:text-[18px] text-[12px] font-bold text-[#6D6D6F]\" />\n </div>\n </div>\n <div className=\"flex flex-col items-end justify-center gap-2\">\n {!!exchange && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"desktop:text-2xl text-base font-bold\"\n html={formatPrice({\n amount: exchange.finalPrice?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n <Text\n className=\"desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n html={formatPrice({\n amount: exchange.price?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedExchangePurchase?.(status ? undefined : exchange)\n exchangeOperation(exchange)\n }}\n className=\"size-auto shrink-0 underline\"\n >\n {status ? copyWriting?.remove : copyWriting?.add}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nexport default withLayout(ProductSummary)\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "Text", "Button", "Grid", "GridItem", "Picture", "Heading", "useBizProductContext", "useEffect", "useMemo", "useState", "formatPrice", "useAiuiContext", "Decimal", "replaceTemplate", "withLayout", "ExposureDetector", "gaTrack", "ProductSummary", "locale", "copyWriting", "product", "variant", "finalPrice", "comparePrice", "coupon", "selectedOptions", "selectedVariants", "totalSavings", "onAddToCart", "onBuyNow", "savingDetail", "checkedBundle", "joinedRecommendBuyProducts", "setJoinedRecommendBuyProducts", "setSavingDetail", "addToCartLoading", "buyNowLoading", "profile", "addOrder", "setAddOrder", "productSummaryData", "item", "currentProductVariant", "summaryFinalPrice", "currentBundleVariant", "v", "currentBundlePrice", "currentProductPrice", "bundleVariant", "giftVariant", "exchangeVariant", "useRecommendBuyProducts", "initialRecommendBuyProducts", "setInitialRecommendBuyProducts", "orderedJoinedProducts", "result", "type", "index", "productOptionsText", "quantity", "color", "variantImage", "variantProductSummary", "image_1920", "image_1440", "image_1024", "image_768", "image_390", "key", "ProductGiftSummary", "gift", "prev", "t", "ProductBundleSummary", "bundle", "ProductExchangeSummary", "exchange", "freeGift", "checkedGift", "exchangePurchase", "checkedExchangePurchase", "bundleList", "giftList", "exchangeList", "availableBundleList", "firstAvailableBundle", "firstAvailableGift", "firstAvailableExchange", "bundleOperation", "bundleListItem", "canOperate", "status", "setCheckedBundle", "bundleVariants", "giftOperation", "setCheckedGift", "freeLabel", "options", "giftOptionsText", "giftColorOption", "option", "giftQuantityOption", "giftColorOptionText", "giftQuantityOptionText", "exchangeOperation", "setCheckedExchangePurchase", "ProductSummary_default"]
7
7
  }
@@ -1,2 +1,2 @@
1
- import{jsx as y,jsxs as x}from"react/jsx-runtime";import{cn as E}from"../../../../../helpers/index.js";import{useState as k,useCallback as R,useRef as T,useEffect as I,useMemo as M}from"react";const B=(t,u)=>{const[d,l]=k(null),s=T(null),c=T(new Map),p=T(!1),h=T(null);I(()=>{h.current=d},[d]),I(()=>{if(!t||t.length===0)return;s.current&&s.current.disconnect();const a=document.getElementById("purchase-bar"),f=a?a.clientHeight:100;c.current.clear();const e=[];if(t.forEach(o=>{const i=o.id||o.href?.replace("#",""),m=document.getElementById(i);m&&(c.current.set(i,o),e.push(m))}),e.length===0){l(t[0]);return}const n={root:null,rootMargin:`-${f}px 0px -50% 0px`,threshold:[0,.25,.5,.75,1]},b=o=>{if(p.current)return;if((window.scrollY||document.documentElement.scrollTop)<f+50){const r=t[0];r&&h.current?.id!==r.id&&(console.log("\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:",r.label),l(r),u?.(r));return}const m=o.filter(r=>r.isIntersecting).sort((r,w)=>r.boundingClientRect.top-w.boundingClientRect.top);if(m.length>0){const w=m[0].target.id,v=c.current.get(w);v&&(l(v),u?.(v))}else{const r=[...o].sort((w,v)=>Math.abs(w.boundingClientRect.top)-Math.abs(v.boundingClientRect.top));if(r.length>0){const v=r[0].target.id,N=c.current.get(v);N&&(l(N),u?.(N))}}};s.current=new IntersectionObserver(b,n),e.forEach(o=>{s.current?.observe(o)});const g=()=>{if(p.current)return;if((window.scrollY||document.documentElement.scrollTop)<f+50){const i=t[0];i&&(l(i),u?.(i))}};return window.addEventListener("scroll",g,{passive:!0}),()=>{s.current&&s.current.disconnect(),window.removeEventListener("scroll",g)}},[t]),I(()=>{!d&&t&&t.length>0&&l(t[0])},[t,d]);const S=R(a=>{l(a);const f=a.id||a.href?.replace("#",""),e=document.getElementById(f);if(e){const n=document.getElementById("purchase-bar"),b=n?n.clientHeight:100;p.current=!0;const o=e.getBoundingClientRect().top+window.scrollY-b-10;window.scrollTo({top:o,behavior:"smooth"}),setTimeout(()=>{p.current=!1},1e3)}},[]);return{activeTab:d||t?.[0],setActiveTab:S}},C=({tabs:t,onSpyNavItemClick:u,className:d,renderRating:l})=>{const s=M(()=>l?[...t,{label:"Reviews",id:"review",href:""}]:t,[t,l]),{activeTab:c,setActiveTab:p}=B(s),h=T(null),S=T(new Map),a=R(e=>{p(e),u?.(e)},[u,p]);I(()=>{if(!c||!h.current)return;const e=S.current.get(c.id);if(!e)return;const n=h.current,b=e.getBoundingClientRect(),g=n.getBoundingClientRect(),o=b.left+b.width/2-g.left,i=g.width/2,m=o-i;n.scrollTo({left:n.scrollLeft+m,behavior:"smooth"})},[c?.id]);const f=R((e,n)=>{n?S.current.set(e,n):S.current.delete(e)},[]);return y("div",{ref:h,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:E("overflow-x-auto",d),children:y("div",{className:"tablet:gap-8 flex gap-6",children:s?.map(e=>y("button",{ref:n=>f(e.id,n),children:e.id==="review"?x("div",{className:"relative shrink-0 whitespace-nowrap py-[10px]",children:[l,y("div",{className:E("desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":c?.id===e.id})})]}):x("div",{className:E("desktop:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]",{"text-[#1d1d1f]":c?.id===e.id}),onClick:()=>a(e),children:[e.label,y("div",{className:E("desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":c?.id===e.id})})]})},e.id))})})};var L=C;export{L as default};
1
+ import{jsx as y,jsxs as x}from"react/jsx-runtime";import{cn as E}from"../../../../../helpers/index.js";import{useState as k,useCallback as R,useRef as T,useEffect as I,useMemo as M}from"react";const B=(t,a)=>{const[d,l]=k(null),s=T(null),c=T(new Map),p=T(!1),h=T(null);I(()=>{h.current=d},[d]),I(()=>{if(!t||t.length===0)return;s.current&&s.current.disconnect();const u=document.getElementById("purchase-bar"),f=u?u.clientHeight:100;c.current.clear();const e=[];if(t.forEach(o=>{const i=o.id||o.href?.replace("#",""),m=document.getElementById(i);m&&(c.current.set(i,o),e.push(m))}),e.length===0){l(t[0]);return}const n={root:null,rootMargin:`-${f}px 0px -50% 0px`,threshold:[0,.25,.5,.75,1]},b=o=>{if(p.current)return;if((window.scrollY||document.documentElement.scrollTop)<f+50){const r=t[0];r&&h.current?.id!==r.id&&(console.log("\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:",r.label),l(r),a?.(r));return}const m=o.filter(r=>r.isIntersecting).sort((r,w)=>r.boundingClientRect.top-w.boundingClientRect.top);if(m.length>0){const w=m[0].target.id,v=c.current.get(w);v&&(l(v),a?.(v))}else{const r=[...o].sort((w,v)=>Math.abs(w.boundingClientRect.top)-Math.abs(v.boundingClientRect.top));if(r.length>0){const v=r[0].target.id,N=c.current.get(v);N&&(l(N),a?.(N))}}};s.current=new IntersectionObserver(b,n),e.forEach(o=>{s.current?.observe(o)});const g=()=>{if(p.current)return;if((window.scrollY||document.documentElement.scrollTop)<f+50){const i=t[0];i&&(l(i),a?.(i))}};return window.addEventListener("scroll",g,{passive:!0}),()=>{s.current&&s.current.disconnect(),window.removeEventListener("scroll",g)}},[t,a]),I(()=>{!d&&t&&t.length>0&&l(t[0])},[t,d]);const S=R(u=>{l(u);const f=u.id||u.href?.replace("#",""),e=document.getElementById(f);if(e){const n=document.getElementById("purchase-bar"),b=n?n.clientHeight:100;p.current=!0;const o=e.getBoundingClientRect().top+window.scrollY-b-10;window.scrollTo({top:o,behavior:"smooth"}),setTimeout(()=>{p.current=!1},1e3)}},[]);return{activeTab:d||t?.[0],setActiveTab:S}},C=({tabs:t,onSpyNavItemClick:a,className:d,renderRating:l})=>{const s=M(()=>l?[...t,{label:"Reviews",id:"review",href:""}]:t,[t,l]),{activeTab:c,setActiveTab:p}=B(s),h=T(null),S=T(new Map),u=R(e=>{p(e),a?.(e)},[a,p]);I(()=>{if(!c||!h.current)return;const e=S.current.get(c.id);if(!e)return;const n=h.current,b=e.getBoundingClientRect(),g=n.getBoundingClientRect(),o=b.left+b.width/2-g.left,i=g.width/2,m=o-i;n.scrollTo({left:n.scrollLeft+m,behavior:"smooth"})},[c?.id]);const f=R((e,n)=>{n?S.current.set(e,n):S.current.delete(e)},[]);return y("div",{ref:h,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:E("overflow-x-auto",d),children:y("div",{className:"tablet:gap-8 flex gap-6",children:s?.map(e=>y("button",{ref:n=>f(e.id,n),children:e.id==="review"?x("div",{className:"relative shrink-0 whitespace-nowrap py-[10px]",children:[l,y("div",{className:E("desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":c?.id===e.id})})]}):x("div",{className:E("desktop:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]",{"text-[#1d1d1f]":c?.id===e.id}),onClick:()=>u(e),children:[e.label,y("div",{className:E("desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out",{"w-full":c?.id===e.id})})]})},e.id))})})};var L=C;export{L 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 { cn } from '../../../../../helpers/index.js'\nimport { useState, useCallback, useRef, useEffect, useMemo } from 'react'\nimport type { ScrollSpyNavItem, ScrollSpyNavProps } from './types.js'\n\n// \u81EA\u5B9A\u4E49 hook\uFF1A\u76D1\u542C\u9875\u9762\u6EDA\u52A8\uFF0C\u81EA\u52A8\u66F4\u65B0\u5F53\u524D\u6FC0\u6D3B\u7684 tab\nconst useScrollSpy = (tabs: ScrollSpyNavItem[], onActiveChange?: (tab: ScrollSpyNavItem) => void) => {\n const [activeTab, setActiveTab] = useState<ScrollSpyNavItem | null>(null)\n const observerRef = useRef<IntersectionObserver | null>(null)\n const sectionsRef = useRef<Map<string, ScrollSpyNavItem>>(new Map())\n const isManualScrollRef = useRef(false) // \u6807\u8BB0\u662F\u5426\u4E3A\u624B\u52A8\u70B9\u51FB\u89E6\u53D1\u7684\u6EDA\u52A8\n const activeTabRef = useRef<ScrollSpyNavItem | null>(null) // \u7528 ref \u5B58\u50A8\u5F53\u524D\u6FC0\u6D3B\u7684 tab\uFF0C\u907F\u514D\u95ED\u5305\u95EE\u9898\n\n // \u540C\u6B65 activeTab \u5230 ref\n useEffect(() => {\n activeTabRef.current = activeTab\n }, [activeTab])\n\n useEffect(() => {\n if (!tabs || tabs.length === 0) return\n\n // \u6E05\u7406\u4E4B\u524D\u7684 observer\n if (observerRef.current) {\n observerRef.current.disconnect()\n }\n\n // \u83B7\u53D6\u5BFC\u822A\u680F\u9AD8\u5EA6\n const purchaseBar = document.getElementById('purchase-bar')\n const navHeight = purchaseBar ? purchaseBar.clientHeight : 100\n\n // \u521B\u5EFA Map \u5B58\u50A8 section \u4FE1\u606F\n sectionsRef.current.clear()\n const elements: Element[] = []\n\n tabs.forEach(tab => {\n const id = tab.id || tab.href?.replace('#', '')\n const element = document.getElementById(id)\n if (element) {\n sectionsRef.current.set(id, tab)\n elements.push(element)\n }\n })\n\n if (elements.length === 0) {\n // \u5982\u679C\u6CA1\u6709\u627E\u5230\u5143\u7D20\uFF0C\u8BBE\u7F6E\u7B2C\u4E00\u4E2A tab \u4E3A\u6FC0\u6D3B\u72B6\u6001\n setActiveTab(tabs[0])\n return\n }\n\n // \u4F7F\u7528 IntersectionObserver \u76D1\u542C\u5143\u7D20\u8FDB\u5165\u89C6\u53E3\n const observerOptions: IntersectionObserverInit = {\n root: null,\n rootMargin: `-${navHeight}px 0px -50% 0px`, // \u4E0A\u65B9\u504F\u79FB\u5BFC\u822A\u680F\u9AD8\u5EA6\uFF0C\u4E0B\u65B9\u504F\u79FB50%\u89C6\u53E3\u9AD8\u5EA6\n threshold: [0, 0.25, 0.5, 0.75, 1],\n }\n\n const observerCallback: IntersectionObserverCallback = entries => {\n // \u5982\u679C\u662F\u624B\u52A8\u70B9\u51FB\u89E6\u53D1\u7684\u6EDA\u52A8\uFF0C\u4E0D\u8981\u66F4\u65B0\u72B6\u6001\n if (isManualScrollRef.current) {\n return\n }\n\n // \u68C0\u67E5\u662F\u5426\u6EDA\u52A8\u5230\u9875\u9762\u9876\u90E8\uFF08\u7279\u6B8A\u5904\u7406\u7B2C\u4E00\u4E2A\u5143\u7D20\uFF09\n const scrollTop = window.scrollY || document.documentElement.scrollTop\n if (scrollTop < navHeight + 50) {\n // \u5728\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab\n const firstTab = tabs[0]\n if (firstTab && activeTabRef.current?.id !== firstTab.id) {\n console.log('\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:', firstTab.label)\n setActiveTab(firstTab)\n onActiveChange?.(firstTab)\n }\n return\n }\n\n // \u627E\u51FA\u6240\u6709\u6B63\u5728\u4EA4\u53C9\u7684 entries\n const intersectingEntries = entries\n .filter(entry => entry.isIntersecting)\n .sort((a, b) => {\n // \u6309\u7167\u5143\u7D20\u5728\u9875\u9762\u4E0A\u7684\u4F4D\u7F6E\u6392\u5E8F\uFF08\u4ECE\u4E0A\u5230\u4E0B\uFF09\n return a.boundingClientRect.top - b.boundingClientRect.top\n })\n\n if (intersectingEntries.length > 0) {\n // \u9009\u62E9\u6700\u4E0A\u9762\u7684\u6B63\u5728\u4EA4\u53C9\u7684\u5143\u7D20\n const topEntry = intersectingEntries[0]\n const id = topEntry.target.id\n const tab = sectionsRef.current.get(id)\n\n if (tab) {\n setActiveTab(tab)\n onActiveChange?.(tab)\n }\n } else {\n // \u5982\u679C\u6CA1\u6709\u5143\u7D20\u6B63\u5728\u4EA4\u53C9\uFF0C\u627E\u51FA\u6700\u63A5\u8FD1\u89C6\u53E3\u9876\u90E8\u7684\u5143\u7D20\n const sortedEntries = [...entries].sort((a, b) => {\n return Math.abs(a.boundingClientRect.top) - Math.abs(b.boundingClientRect.top)\n })\n\n if (sortedEntries.length > 0) {\n const closestEntry = sortedEntries[0]\n const id = closestEntry.target.id\n const tab = sectionsRef.current.get(id)\n\n if (tab) {\n setActiveTab(tab)\n onActiveChange?.(tab)\n }\n }\n }\n }\n\n observerRef.current = new IntersectionObserver(observerCallback, observerOptions)\n\n // \u89C2\u5BDF\u6240\u6709 section \u5143\u7D20\n elements.forEach(element => {\n observerRef.current?.observe(element)\n })\n\n // \u6DFB\u52A0\u6EDA\u52A8\u4E8B\u4EF6\u76D1\u542C\uFF0C\u5904\u7406\u9875\u9762\u9876\u90E8\u7684\u60C5\u51B5\n const handleScroll = () => {\n if (isManualScrollRef.current) {\n return\n }\n\n const scrollTop = window.scrollY || document.documentElement.scrollTop\n // \u5982\u679C\u6EDA\u52A8\u5230\u63A5\u8FD1\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab\n if (scrollTop < navHeight + 50) {\n const firstTab = tabs[0]\n if (firstTab) {\n setActiveTab(firstTab)\n onActiveChange?.(firstTab)\n }\n }\n }\n\n window.addEventListener('scroll', handleScroll, { passive: true })\n\n return () => {\n if (observerRef.current) {\n observerRef.current.disconnect()\n }\n window.removeEventListener('scroll', handleScroll)\n }\n }, [tabs])\n\n // \u521D\u59CB\u5316\u65F6\u8BBE\u7F6E\u7B2C\u4E00\u4E2A tab\n useEffect(() => {\n if (!activeTab && tabs && tabs.length > 0) {\n setActiveTab(tabs[0])\n }\n }, [tabs, activeTab])\n\n // \u624B\u52A8\u8BBE\u7F6E\u6FC0\u6D3B tab \u5E76\u6EDA\u52A8\u5230\u5BF9\u5E94\u4F4D\u7F6E\n const handleSetActiveTab = useCallback((tab: ScrollSpyNavItem) => {\n setActiveTab(tab)\n\n // \u6EDA\u52A8\u5230\u5BF9\u5E94\u7684\u951A\u70B9\n const id = tab.id || tab.href?.replace('#', '')\n const element = document.getElementById(id)\n\n if (element) {\n const purchaseBar = document.getElementById('purchase-bar')\n const navHeight = purchaseBar ? purchaseBar.clientHeight : 100\n\n // \u8BBE\u7F6E\u624B\u52A8\u6EDA\u52A8\u6807\u5FD7\n isManualScrollRef.current = true\n\n // \u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E\uFF08\u5143\u7D20\u9876\u90E8 - \u5BFC\u822A\u680F\u9AD8\u5EA6 - \u989D\u5916\u95F4\u8DDD\uFF09\n const elementTop = element.getBoundingClientRect().top + window.scrollY\n const scrollToPosition = elementTop - navHeight - 10\n\n window.scrollTo({\n top: scrollToPosition,\n behavior: 'smooth',\n })\n\n // \u6EDA\u52A8\u7ED3\u675F\u540E\u91CD\u7F6E\u6807\u5FD7\n setTimeout(() => {\n isManualScrollRef.current = false\n }, 1000) // 1\u79D2\u540E\u91CD\u7F6E\uFF0C\u786E\u4FDD\u6EDA\u52A8\u52A8\u753B\u5B8C\u6210\n }\n }, [])\n\n return { activeTab: activeTab || tabs?.[0], setActiveTab: handleSetActiveTab }\n}\n\nconst ScrollSpyNav = ({ tabs, onSpyNavItemClick, className, renderRating }: ScrollSpyNavProps) => {\n // \u4F7F\u7528 useScrollSpy hook \u81EA\u52A8\u76D1\u542C\u6EDA\u52A8\n const combinedTabs = useMemo(() => {\n if (renderRating) {\n return [...tabs, { label: 'Reviews', id: 'review', href: '' }]\n }\n return tabs\n }, [tabs, renderRating])\n\n const { activeTab, setActiveTab } = useScrollSpy(combinedTabs)\n\n // \u79FB\u52A8\u7AEF\uFF1A\u6A2A\u5411\u6EDA\u52A8\u5BB9\u5668\u548C tab \u6309\u94AE\u7684 refs\n const scrollContainerRef = useRef<HTMLDivElement>(null)\n const tabRefs = useRef<Map<string, HTMLButtonElement>>(new Map())\n\n const onTabClick = useCallback(\n (tab: ScrollSpyNavItem) => {\n setActiveTab(tab)\n onSpyNavItemClick?.(tab)\n },\n [onSpyNavItemClick, setActiveTab]\n )\n\n // \u79FB\u52A8\u7AEF\uFF1A\u5F53 activeTab \u6539\u53D8\u65F6\uFF0C\u81EA\u52A8\u6EDA\u52A8\u5230\u4E2D\u5FC3\u4F4D\u7F6E\n useEffect(() => {\n if (!activeTab || !scrollContainerRef.current) return\n\n const activeTabElement = tabRefs.current.get(activeTab.id)\n if (!activeTabElement) return\n\n const container = scrollContainerRef.current\n const tabRect = activeTabElement.getBoundingClientRect()\n const containerRect = container.getBoundingClientRect()\n\n // \u8BA1\u7B97\u9700\u8981\u6EDA\u52A8\u7684\u8DDD\u79BB\uFF0C\u4F7F tab \u4F4D\u4E8E\u5BB9\u5668\u4E2D\u5FC3\n const tabCenter = tabRect.left + tabRect.width / 2 - containerRect.left\n const containerCenter = containerRect.width / 2\n const scrollOffset = tabCenter - containerCenter\n\n container.scrollTo({\n left: container.scrollLeft + scrollOffset,\n behavior: 'smooth',\n })\n }, [activeTab?.id])\n\n // \u8BBE\u7F6E tab ref\n const setTabRef = useCallback((tabId: string, element: HTMLButtonElement | null) => {\n if (element) {\n tabRefs.current.set(tabId, element)\n } else {\n tabRefs.current.delete(tabId)\n }\n }, [])\n\n // \u684C\u9762\u7AEF\u6E32\u67D3\n return (\n <div\n ref={scrollContainerRef}\n style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}\n className={cn('overflow-x-auto', className)}\n >\n <div className=\"tablet:gap-8 flex gap-6\">\n {combinedTabs?.map(tab => (\n <button key={tab.id} ref={el => setTabRef(tab.id, el)}>\n {tab.id === 'review' ? (\n <div className=\"relative shrink-0 whitespace-nowrap py-[10px]\">\n {renderRating}\n <div\n className={cn(\n 'desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out',\n {\n 'w-full': activeTab?.id === tab.id,\n }\n )}\n />\n </div>\n ) : (\n <div\n className={cn(\n 'desktop:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]',\n {\n 'text-[#1d1d1f]': activeTab?.id === tab.id,\n }\n )}\n onClick={() => onTabClick(tab)}\n >\n {tab.label}\n <div\n className={cn(\n 'desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out',\n {\n 'w-full': activeTab?.id === tab.id,\n }\n )}\n />\n </div>\n )}\n </button>\n ))}\n </div>\n </div>\n )\n}\n\nexport default ScrollSpyNav\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { cn } from '../../../../../helpers/index.js'\nimport { useState, useCallback, useRef, useEffect, useMemo } from 'react'\nimport type { ScrollSpyNavItem, ScrollSpyNavProps } from './types.js'\n\n// \u81EA\u5B9A\u4E49 hook\uFF1A\u76D1\u542C\u9875\u9762\u6EDA\u52A8\uFF0C\u81EA\u52A8\u66F4\u65B0\u5F53\u524D\u6FC0\u6D3B\u7684 tab\nconst useScrollSpy = (tabs: ScrollSpyNavItem[], onActiveChange?: (tab: ScrollSpyNavItem) => void) => {\n const [activeTab, setActiveTab] = useState<ScrollSpyNavItem | null>(null)\n const observerRef = useRef<IntersectionObserver | null>(null)\n const sectionsRef = useRef<Map<string, ScrollSpyNavItem>>(new Map())\n const isManualScrollRef = useRef(false) // \u6807\u8BB0\u662F\u5426\u4E3A\u624B\u52A8\u70B9\u51FB\u89E6\u53D1\u7684\u6EDA\u52A8\n const activeTabRef = useRef<ScrollSpyNavItem | null>(null) // \u7528 ref \u5B58\u50A8\u5F53\u524D\u6FC0\u6D3B\u7684 tab\uFF0C\u907F\u514D\u95ED\u5305\u95EE\u9898\n\n // \u540C\u6B65 activeTab \u5230 ref\n useEffect(() => {\n activeTabRef.current = activeTab\n }, [activeTab])\n\n useEffect(() => {\n if (!tabs || tabs.length === 0) return\n\n // \u6E05\u7406\u4E4B\u524D\u7684 observer\n if (observerRef.current) {\n observerRef.current.disconnect()\n }\n\n // \u83B7\u53D6\u5BFC\u822A\u680F\u9AD8\u5EA6\n const purchaseBar = document.getElementById('purchase-bar')\n const navHeight = purchaseBar ? purchaseBar.clientHeight : 100\n\n // \u521B\u5EFA Map \u5B58\u50A8 section \u4FE1\u606F\n sectionsRef.current.clear()\n const elements: Element[] = []\n\n tabs.forEach(tab => {\n const id = tab.id || tab.href?.replace('#', '')\n const element = document.getElementById(id)\n if (element) {\n sectionsRef.current.set(id, tab)\n elements.push(element)\n }\n })\n\n if (elements.length === 0) {\n // \u5982\u679C\u6CA1\u6709\u627E\u5230\u5143\u7D20\uFF0C\u8BBE\u7F6E\u7B2C\u4E00\u4E2A tab \u4E3A\u6FC0\u6D3B\u72B6\u6001\n setActiveTab(tabs[0])\n return\n }\n\n // \u4F7F\u7528 IntersectionObserver \u76D1\u542C\u5143\u7D20\u8FDB\u5165\u89C6\u53E3\n const observerOptions: IntersectionObserverInit = {\n root: null,\n rootMargin: `-${navHeight}px 0px -50% 0px`, // \u4E0A\u65B9\u504F\u79FB\u5BFC\u822A\u680F\u9AD8\u5EA6\uFF0C\u4E0B\u65B9\u504F\u79FB50%\u89C6\u53E3\u9AD8\u5EA6\n threshold: [0, 0.25, 0.5, 0.75, 1],\n }\n\n const observerCallback: IntersectionObserverCallback = entries => {\n // \u5982\u679C\u662F\u624B\u52A8\u70B9\u51FB\u89E6\u53D1\u7684\u6EDA\u52A8\uFF0C\u4E0D\u8981\u66F4\u65B0\u72B6\u6001\n if (isManualScrollRef.current) {\n return\n }\n\n // \u68C0\u67E5\u662F\u5426\u6EDA\u52A8\u5230\u9875\u9762\u9876\u90E8\uFF08\u7279\u6B8A\u5904\u7406\u7B2C\u4E00\u4E2A\u5143\u7D20\uFF09\n const scrollTop = window.scrollY || document.documentElement.scrollTop\n if (scrollTop < navHeight + 50) {\n // \u5728\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab\n const firstTab = tabs[0]\n if (firstTab && activeTabRef.current?.id !== firstTab.id) {\n console.log('\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab:', firstTab.label)\n setActiveTab(firstTab)\n onActiveChange?.(firstTab)\n }\n return\n }\n\n // \u627E\u51FA\u6240\u6709\u6B63\u5728\u4EA4\u53C9\u7684 entries\n const intersectingEntries = entries\n .filter(entry => entry.isIntersecting)\n .sort((a, b) => {\n // \u6309\u7167\u5143\u7D20\u5728\u9875\u9762\u4E0A\u7684\u4F4D\u7F6E\u6392\u5E8F\uFF08\u4ECE\u4E0A\u5230\u4E0B\uFF09\n return a.boundingClientRect.top - b.boundingClientRect.top\n })\n\n if (intersectingEntries.length > 0) {\n // \u9009\u62E9\u6700\u4E0A\u9762\u7684\u6B63\u5728\u4EA4\u53C9\u7684\u5143\u7D20\n const topEntry = intersectingEntries[0]\n const id = topEntry.target.id\n const tab = sectionsRef.current.get(id)\n\n if (tab) {\n setActiveTab(tab)\n onActiveChange?.(tab)\n }\n } else {\n // \u5982\u679C\u6CA1\u6709\u5143\u7D20\u6B63\u5728\u4EA4\u53C9\uFF0C\u627E\u51FA\u6700\u63A5\u8FD1\u89C6\u53E3\u9876\u90E8\u7684\u5143\u7D20\n const sortedEntries = [...entries].sort((a, b) => {\n return Math.abs(a.boundingClientRect.top) - Math.abs(b.boundingClientRect.top)\n })\n\n if (sortedEntries.length > 0) {\n const closestEntry = sortedEntries[0]\n const id = closestEntry.target.id\n const tab = sectionsRef.current.get(id)\n\n if (tab) {\n setActiveTab(tab)\n onActiveChange?.(tab)\n }\n }\n }\n }\n\n observerRef.current = new IntersectionObserver(observerCallback, observerOptions)\n\n // \u89C2\u5BDF\u6240\u6709 section \u5143\u7D20\n elements.forEach(element => {\n observerRef.current?.observe(element)\n })\n\n // \u6DFB\u52A0\u6EDA\u52A8\u4E8B\u4EF6\u76D1\u542C\uFF0C\u5904\u7406\u9875\u9762\u9876\u90E8\u7684\u60C5\u51B5\n const handleScroll = () => {\n if (isManualScrollRef.current) {\n return\n }\n\n const scrollTop = window.scrollY || document.documentElement.scrollTop\n // \u5982\u679C\u6EDA\u52A8\u5230\u63A5\u8FD1\u9875\u9762\u9876\u90E8\uFF0C\u6FC0\u6D3B\u7B2C\u4E00\u4E2A tab\n if (scrollTop < navHeight + 50) {\n const firstTab = tabs[0]\n if (firstTab) {\n setActiveTab(firstTab)\n onActiveChange?.(firstTab)\n }\n }\n }\n\n window.addEventListener('scroll', handleScroll, { passive: true })\n\n return () => {\n if (observerRef.current) {\n observerRef.current.disconnect()\n }\n window.removeEventListener('scroll', handleScroll)\n }\n }, [tabs, onActiveChange])\n\n // \u521D\u59CB\u5316\u65F6\u8BBE\u7F6E\u7B2C\u4E00\u4E2A tab\n useEffect(() => {\n if (!activeTab && tabs && tabs.length > 0) {\n setActiveTab(tabs[0])\n }\n }, [tabs, activeTab])\n\n // \u624B\u52A8\u8BBE\u7F6E\u6FC0\u6D3B tab \u5E76\u6EDA\u52A8\u5230\u5BF9\u5E94\u4F4D\u7F6E\n const handleSetActiveTab = useCallback((tab: ScrollSpyNavItem) => {\n setActiveTab(tab)\n\n // \u6EDA\u52A8\u5230\u5BF9\u5E94\u7684\u951A\u70B9\n const id = tab.id || tab.href?.replace('#', '')\n const element = document.getElementById(id)\n\n if (element) {\n const purchaseBar = document.getElementById('purchase-bar')\n const navHeight = purchaseBar ? purchaseBar.clientHeight : 100\n\n // \u8BBE\u7F6E\u624B\u52A8\u6EDA\u52A8\u6807\u5FD7\n isManualScrollRef.current = true\n\n // \u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E\uFF08\u5143\u7D20\u9876\u90E8 - \u5BFC\u822A\u680F\u9AD8\u5EA6 - \u989D\u5916\u95F4\u8DDD\uFF09\n const elementTop = element.getBoundingClientRect().top + window.scrollY\n const scrollToPosition = elementTop - navHeight - 10\n\n window.scrollTo({\n top: scrollToPosition,\n behavior: 'smooth',\n })\n\n // \u6EDA\u52A8\u7ED3\u675F\u540E\u91CD\u7F6E\u6807\u5FD7\n setTimeout(() => {\n isManualScrollRef.current = false\n }, 1000) // 1\u79D2\u540E\u91CD\u7F6E\uFF0C\u786E\u4FDD\u6EDA\u52A8\u52A8\u753B\u5B8C\u6210\n }\n }, [])\n\n return { activeTab: activeTab || tabs?.[0], setActiveTab: handleSetActiveTab }\n}\n\nconst ScrollSpyNav = ({ tabs, onSpyNavItemClick, className, renderRating }: ScrollSpyNavProps) => {\n // \u4F7F\u7528 useScrollSpy hook \u81EA\u52A8\u76D1\u542C\u6EDA\u52A8\n const combinedTabs = useMemo(() => {\n if (renderRating) {\n return [...tabs, { label: 'Reviews', id: 'review', href: '' }]\n }\n return tabs\n }, [tabs, renderRating])\n\n const { activeTab, setActiveTab } = useScrollSpy(combinedTabs)\n\n // \u79FB\u52A8\u7AEF\uFF1A\u6A2A\u5411\u6EDA\u52A8\u5BB9\u5668\u548C tab \u6309\u94AE\u7684 refs\n const scrollContainerRef = useRef<HTMLDivElement>(null)\n const tabRefs = useRef<Map<string, HTMLButtonElement>>(new Map())\n\n const onTabClick = useCallback(\n (tab: ScrollSpyNavItem) => {\n setActiveTab(tab)\n onSpyNavItemClick?.(tab)\n },\n [onSpyNavItemClick, setActiveTab]\n )\n\n // \u79FB\u52A8\u7AEF\uFF1A\u5F53 activeTab \u6539\u53D8\u65F6\uFF0C\u81EA\u52A8\u6EDA\u52A8\u5230\u4E2D\u5FC3\u4F4D\u7F6E\n useEffect(() => {\n if (!activeTab || !scrollContainerRef.current) return\n\n const activeTabElement = tabRefs.current.get(activeTab.id)\n if (!activeTabElement) return\n\n const container = scrollContainerRef.current\n const tabRect = activeTabElement.getBoundingClientRect()\n const containerRect = container.getBoundingClientRect()\n\n // \u8BA1\u7B97\u9700\u8981\u6EDA\u52A8\u7684\u8DDD\u79BB\uFF0C\u4F7F tab \u4F4D\u4E8E\u5BB9\u5668\u4E2D\u5FC3\n const tabCenter = tabRect.left + tabRect.width / 2 - containerRect.left\n const containerCenter = containerRect.width / 2\n const scrollOffset = tabCenter - containerCenter\n\n container.scrollTo({\n left: container.scrollLeft + scrollOffset,\n behavior: 'smooth',\n })\n }, [activeTab?.id])\n\n // \u8BBE\u7F6E tab ref\n const setTabRef = useCallback((tabId: string, element: HTMLButtonElement | null) => {\n if (element) {\n tabRefs.current.set(tabId, element)\n } else {\n tabRefs.current.delete(tabId)\n }\n }, [])\n\n // \u684C\u9762\u7AEF\u6E32\u67D3\n return (\n <div\n ref={scrollContainerRef}\n style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}\n className={cn('overflow-x-auto', className)}\n >\n <div className=\"tablet:gap-8 flex gap-6\">\n {combinedTabs?.map(tab => (\n <button key={tab.id} ref={el => setTabRef(tab.id, el)}>\n {tab.id === 'review' ? (\n <div className=\"relative shrink-0 whitespace-nowrap py-[10px]\">\n {renderRating}\n <div\n className={cn(\n 'desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out',\n {\n 'w-full': activeTab?.id === tab.id,\n }\n )}\n />\n </div>\n ) : (\n <div\n className={cn(\n 'desktop:text-[#1d1d1f] relative shrink-0 whitespace-nowrap py-[10px] text-sm font-bold text-[#949494]',\n {\n 'text-[#1d1d1f]': activeTab?.id === tab.id,\n }\n )}\n onClick={() => onTabClick(tab)}\n >\n {tab.label}\n <div\n className={cn(\n 'desktop:block bg-brand-0 absolute bottom-0 left-0 hidden h-[2px] w-0 transition-all duration-300 ease-in-out',\n {\n 'w-full': activeTab?.id === tab.id,\n }\n )}\n />\n </div>\n )}\n </button>\n ))}\n </div>\n </div>\n )\n}\n\nexport default ScrollSpyNav\n"],
5
+ "mappings": "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",
6
6
  "names": ["jsx", "jsxs", "cn", "useState", "useCallback", "useRef", "useEffect", "useMemo", "useScrollSpy", "tabs", "onActiveChange", "activeTab", "setActiveTab", "observerRef", "sectionsRef", "isManualScrollRef", "activeTabRef", "purchaseBar", "navHeight", "elements", "tab", "id", "element", "observerOptions", "observerCallback", "entries", "firstTab", "intersectingEntries", "entry", "a", "b", "sortedEntries", "handleScroll", "handleSetActiveTab", "scrollToPosition", "ScrollSpyNav", "onSpyNavItemClick", "className", "renderRating", "combinedTabs", "scrollContainerRef", "tabRefs", "onTabClick", "activeTabElement", "container", "tabRect", "containerRect", "tabCenter", "containerCenter", "scrollOffset", "setTabRef", "tabId", "el", "ScrollSpyNav_default"]
7
7
  }
@@ -1,2 +1,2 @@
1
- import{jsx as e,jsxs as p}from"react/jsx-runtime";import{Text as m,Heading as c,Avatar as g,AvatarImage as u,AvatarFallback as w}from"../../components/index.js";import{cn as n}from"../../helpers/utils.js";import{withLayout as k}from"../../shared/Styles.js";const x=9,N=3,b=(t,a)=>Array.from({length:Math.ceil(t.length/a)},(i,r)=>t.slice(r*a,(r+1)*a)),C=()=>e("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z",fill:"#F77234"})}),y=({item:t})=>p("div",{className:"rounded-box bg-container-primary text-info-primary min-l:p-[24px] laptop:h-[240px] desktop:h-[240px] lg-desktop:h-[240px] flex h-[240px] grow flex-col justify-between p-[16px]",children:[p("div",{className:"flex justify-between",children:[p("div",{className:"flex flex-col",children:[e(m,{size:4,html:t.name,className:"laptop:block hidden"}),e(m,{size:2,html:t.name,className:"laptop:hidden block"}),e("div",{className:"mt-2 flex gap-1",children:new Array(t.rating||5).fill(0).map((a,i)=>e(C,{},i))})]}),p(g,{size:"small",className:" laptop:size-[48px] size-[40px]",children:[e(u,{src:t.avatar?.url,alt:t.avatar?.alt||""}),e(w,{children:(t.name??"").slice(0,2).toUpperCase()})]})]}),e("div",{children:e(c,{as:"h6",size:2,html:`"${t.comment}`,className:"line-clamp-5 min-h-[120px] text-wrap"})})]});function L({data:t,className:a}){const{title:i,subtitle:r,items:l=[],theme:d="light"}=t,f=b(l.length<x?[...l,...l.slice(x-l.length)]:l,N).slice(0,3).map(o=>[...o,...o]);return p("section",{className:n("text-info-primary flex flex-col items-center justify-center py-3",a,{"aiui-dark":d==="dark"}),children:[e(c,{as:"h1",size:4,html:i,className:"laptop:text-center w-full text-left"}),e(m,{size:2,html:r,className:"tablet:mt-[16px] tablet:text-[14px] laptop:text-center laptop:text-[14px] desktop:mt-[8px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] w-full text-left text-[14px]"}),e("div",{className:n("mask-fade-vertical laptop:h-[384px] desktop:h-[512px] lg-desktop:h-[640px] mt-[24px] flex h-[480px] gap-4 overflow-hidden"),children:f.map((o,s)=>e("div",{className:n("animate-marquee-scroll relative flex h-fit flex-1 flex-col gap-4",{"top-10":s===0||s===2,"hidden desktop:flex":s===1,"hidden tablet:flex":s===2}),children:o.map((h,v)=>e(y,{item:h},v))},s))})]})}var R=k(L);export{R as default};
1
+ import{jsx as e,jsxs as s}from"react/jsx-runtime";import{Text as n,Heading as c,Avatar as g,AvatarImage as w,AvatarFallback as u}from"../../components/index.js";import{cn as m}from"../../helpers/utils.js";import{withLayout as C}from"../../shared/Styles.js";const x=9,L=3,k=(t,a)=>Array.from({length:Math.ceil(t.length/a)},(l,r)=>t.slice(r*a,(r+1)*a)),y=()=>e("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z",fill:"#F77234"})}),N=()=>e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"13",viewBox:"0 0 14 13",fill:"none",children:e("path",{d:"M6.07501 0.418036C6.35012 -0.139398 7.145 -0.139397 7.42011 0.418037L8.9242 3.46565C9.03344 3.68701 9.24462 3.84043 9.4889 3.87593L12.8521 4.36464C13.4673 4.45403 13.7129 5.21 13.2678 5.64391L10.8341 8.01614C10.6574 8.18844 10.5767 8.43669 10.6184 8.67999L11.1929 12.0296C11.298 12.6423 10.655 13.1095 10.1047 12.8203L7.09656 11.2388C6.87807 11.1239 6.61705 11.1239 6.39855 11.2388L3.39038 12.8203C2.84016 13.1095 2.19709 12.6423 2.30217 12.0296L2.87668 8.67999C2.91841 8.43669 2.83775 8.18844 2.66098 8.01614L0.227318 5.64391C-0.21782 5.21 0.0278133 4.45403 0.642979 4.36464L4.00622 3.87593C4.2505 3.84043 4.46167 3.68701 4.57092 3.46565L6.07501 0.418036Z",fill:"#75787F"})}),b=({item:t})=>s("div",{className:"rounded-box bg-container-primary text-info-primary min-l:p-[24px] laptop:h-[240px] desktop:h-[240px] lg-desktop:h-[240px] flex h-[240px] grow flex-col justify-between p-[16px]",children:[s("div",{className:"flex justify-between",children:[s("div",{className:"flex flex-col",children:[e(n,{size:4,html:t.name,className:"laptop:block hidden"}),e(n,{size:2,html:t.name,className:"laptop:hidden block"}),s("div",{className:"mt-2 flex gap-1",children:[new Array(t.rating||5).fill(0).map((a,l)=>e(y,{},l)),new Array(5-(t.rating||5)).fill(0).map((a,l)=>e("span",{children:N()},l))]})]}),s(g,{size:"small",className:" laptop:size-[48px] size-[40px]",children:[e(w,{src:t.avatar?.url,alt:t.avatar?.alt||""}),e(u,{children:(t.name??"").slice(0,2).toUpperCase()})]})]}),e("div",{children:e(c,{as:"h6",size:2,html:`${t.comment}`,className:"line-clamp-5 min-h-[120px] text-wrap"})})]});function M({data:t,className:a}){const{title:l,subtitle:r,items:i=[],theme:h="light"}=t,d=k(i.length<x?[...i,...i.slice(x-i.length)]:i,L).slice(0,3).map(o=>[...o,...o]);return s("section",{className:m("text-info-primary flex flex-col items-center justify-center py-3",a,{"aiui-dark":h==="dark"}),children:[e(c,{as:"h1",size:4,html:l,className:"laptop:text-center w-full text-left"}),e(n,{size:2,html:r,className:"tablet:mt-[16px] tablet:text-[14px] laptop:text-center laptop:text-[14px] desktop:mt-[8px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] w-full text-left text-[14px]"}),e("div",{className:m("mask-fade-vertical laptop:h-[384px] desktop:h-[512px] lg-desktop:h-[640px] mt-[24px] flex h-[480px] gap-4 overflow-hidden"),children:d.map((o,p)=>e("div",{className:m("animate-marquee-scroll relative flex h-fit flex-1 flex-col gap-4",{"top-10":p===0||p===2,"hidden desktop:flex":p===1,"hidden tablet:flex":p===2}),children:o.map((f,v)=>e(b,{item:f},v))},p))})]})}var R=C(M);export{R as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/MarqueeReview/index.tsx"],
4
- "sourcesContent": ["import { Text, Heading, Avatar, AvatarImage, AvatarFallback } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media, Theme } from '../../types/props.js'\n\nconst FIX_ITEMS_LENGTH = 9\nconst COUNT = 3\n\n/**\n * \u8BC4\u8BBA\u9879\u6570\u636E\u7ED3\u6784\n */\nexport interface ReviewItem {\n /** \u8BC4\u8BBA\u8005\u540D\u79F0 */\n name: string\n /** \u8BC4\u8BBA\u8005\u5934\u50CF URL */\n avatar: Media\n /** \u8BC4\u8BBA\u5185\u5BB9 */\n comment: string\n /** \u8BC4\u5206(1-5\u661F) */\n rating?: number\n}\n\n/**\n * \u8F6E\u64AD\u8BC4\u8BBA\u6570\u636E\u7ED3\u6784\n */\nexport interface MarqueeReviewData {\n /** \u4E3B\u6807\u9898 */\n title: string\n /** \u526F\u6807\u9898 */\n subtitle: string\n /** \u8BC4\u8BBA\u5217\u8868 */\n items: ReviewItem[]\n /** \u4E3B\u9898\uFF1Alight \u6216 dark */\n theme?: Theme\n}\n\n/**\n * MarqueeReview \u7EC4\u4EF6 Props\n */\nexport interface MarqueeReviewProps {\n /** \u8BC4\u8BBA\u6570\u636E */\n data: MarqueeReviewData\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n}\n\nconst _chunk = <T,>(array: T[], size: number): T[][] => {\n return Array.from({ length: Math.ceil(array.length / size) }, (_, index) =>\n array.slice(index * size, (index + 1) * size)\n )\n}\n\nconst StarIcon = () => (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z\"\n fill=\"#F77234\"\n />\n </svg>\n)\n\ninterface CardProps {\n item: ReviewItem\n}\n\nconst Card = ({ item }: CardProps) => {\n return (\n <div className=\"rounded-box bg-container-primary text-info-primary min-l:p-[24px] laptop:h-[240px] desktop:h-[240px] lg-desktop:h-[240px] flex h-[240px] grow flex-col justify-between p-[16px]\">\n <div className=\"flex justify-between\">\n <div className=\"flex flex-col\">\n <Text size={4} html={item.name} className=\"laptop:block hidden\" />\n <Text size={2} html={item.name} className=\"laptop:hidden block\" />\n <div className=\"mt-2 flex gap-1\">\n {new Array(item.rating || 5).fill(0).map((_, index) => (\n <StarIcon key={index} />\n ))}\n </div>\n </div>\n <Avatar size=\"small\" className=\" laptop:size-[48px] size-[40px]\">\n <AvatarImage src={item.avatar?.url} alt={item.avatar?.alt || ''} />\n <AvatarFallback>{(item.name ?? '').slice(0, 2).toUpperCase()}</AvatarFallback>\n </Avatar>\n </div>\n <div>\n <Heading as=\"h6\" size={2} html={`\"${item.comment}`} className=\"line-clamp-5 min-h-[120px] text-wrap\" />\n </div>\n </div>\n )\n}\n\n/**\n * MarqueeReview - \u5782\u76F4\u6EDA\u52A8\u7684\u8BC4\u8BBA\u8F6E\u64AD\u7EC4\u4EF6\n *\n * \u7528\u4E8E\u5C55\u793A\u7528\u6237\u8BC4\u8BBA,\u652F\u6301\u591A\u5217\u5782\u76F4\u65E0\u9650\u6EDA\u52A8\u6548\u679C\u3002\n *\n * @example\n * ```tsx\n * <MarqueeReview\n * data={{\n * title: \"\u5BA2\u6237\u8BC4\u4EF7\",\n * subtitle: \"\u770B\u770B\u7528\u6237\u600E\u4E48\u8BF4\",\n * items: [\n * {\n * name: \"\u5F20\u4E09\",\n * avatar: \"/avatar1.jpg\",\n * comment: \"\u975E\u5E38\u597D\u7528\u7684\u4EA7\u54C1!\",\n * rating: 5\n * }\n * ]\n * }}\n * />\n * ```\n */\nfunction MarqueeReview({ data, className }: MarqueeReviewProps) {\n const { title, subtitle, items = [], theme = 'light' } = data\n\n const chunkItems = _chunk(\n items.length < FIX_ITEMS_LENGTH ? [...items, ...items.slice(FIX_ITEMS_LENGTH - items.length)] : items,\n COUNT\n )\n .slice(0, 3)\n .map(item => [...item, ...item])\n\n return (\n <section\n className={cn('text-info-primary flex flex-col items-center justify-center py-3', className, {\n 'aiui-dark': theme === 'dark',\n })}\n >\n <Heading as=\"h1\" size={4} html={title} className=\"laptop:text-center w-full text-left\" />\n <Text\n size={2}\n html={subtitle}\n className=\"tablet:mt-[16px] tablet:text-[14px] laptop:text-center laptop:text-[14px] desktop:mt-[8px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] w-full text-left text-[14px]\"\n />\n <div\n className={cn(\n 'mask-fade-vertical laptop:h-[384px] desktop:h-[512px] lg-desktop:h-[640px] mt-[24px] flex h-[480px] gap-4 overflow-hidden'\n )}\n >\n {chunkItems.map((items, index) => (\n <div\n key={index}\n className={cn('animate-marquee-scroll relative flex h-fit flex-1 flex-col gap-4', {\n 'top-10': index === 0 || index === 2,\n 'hidden desktop:flex': index === 1,\n 'hidden tablet:flex': index === 2,\n })}\n >\n {items.map((item, innerIndex) => (\n <Card key={innerIndex} item={item} />\n ))}\n </div>\n ))}\n </div>\n </section>\n )\n}\n\nexport default withLayout(MarqueeReview)\n"],
5
- "mappings": "AAsDI,cAAAA,EAeI,QAAAC,MAfJ,oBAtDJ,OAAS,QAAAC,EAAM,WAAAC,EAAS,UAAAC,EAAQ,eAAAC,EAAa,kBAAAC,MAAsB,4BACnE,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAG3B,MAAMC,EAAmB,EACnBC,EAAQ,EAwCRC,EAAS,CAAKC,EAAYC,IACvB,MAAM,KAAK,CAAE,OAAQ,KAAK,KAAKD,EAAM,OAASC,CAAI,CAAE,EAAG,CAACC,EAAGC,IAChEH,EAAM,MAAMG,EAAQF,GAAOE,EAAQ,GAAKF,CAAI,CAC9C,EAGIG,EAAW,IACfhB,EAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,SAAAA,EAAC,QACC,EAAE,6oBACF,KAAK,UACP,EACF,EAOIiB,EAAO,CAAC,CAAE,KAAAC,CAAK,IAEjBjB,EAAC,OAAI,UAAU,kLACb,UAAAA,EAAC,OAAI,UAAU,uBACb,UAAAA,EAAC,OAAI,UAAU,gBACb,UAAAD,EAACE,EAAA,CAAK,KAAM,EAAG,KAAMgB,EAAK,KAAM,UAAU,sBAAsB,EAChElB,EAACE,EAAA,CAAK,KAAM,EAAG,KAAMgB,EAAK,KAAM,UAAU,sBAAsB,EAChElB,EAAC,OAAI,UAAU,kBACZ,aAAI,MAAMkB,EAAK,QAAU,CAAC,EAAE,KAAK,CAAC,EAAE,IAAI,CAACJ,EAAGC,IAC3Cf,EAACgB,EAAA,GAAcD,CAAO,CACvB,EACH,GACF,EACAd,EAACG,EAAA,CAAO,KAAK,QAAQ,UAAU,mCAC7B,UAAAJ,EAACK,EAAA,CAAY,IAAKa,EAAK,QAAQ,IAAK,IAAKA,EAAK,QAAQ,KAAO,GAAI,EACjElB,EAACM,EAAA,CAAiB,UAAAY,EAAK,MAAQ,IAAI,MAAM,EAAG,CAAC,EAAE,YAAY,EAAE,GAC/D,GACF,EACAlB,EAAC,OACC,SAAAA,EAACG,EAAA,CAAQ,GAAG,KAAK,KAAM,EAAG,KAAM,IAAIe,EAAK,OAAO,GAAI,UAAU,uCAAuC,EACvG,GACF,EA2BJ,SAASC,EAAc,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAuB,CAC9D,KAAM,CAAE,MAAAC,EAAO,SAAAC,EAAU,MAAAC,EAAQ,CAAC,EAAG,MAAAC,EAAQ,OAAQ,EAAIL,EAEnDM,EAAaf,EACjBa,EAAM,OAASf,EAAmB,CAAC,GAAGe,EAAO,GAAGA,EAAM,MAAMf,EAAmBe,EAAM,MAAM,CAAC,EAAIA,EAChGd,CACF,EACG,MAAM,EAAG,CAAC,EACV,IAAIQ,GAAQ,CAAC,GAAGA,EAAM,GAAGA,CAAI,CAAC,EAEjC,OACEjB,EAAC,WACC,UAAWM,EAAG,mEAAoEc,EAAW,CAC3F,YAAaI,IAAU,MACzB,CAAC,EAED,UAAAzB,EAACG,EAAA,CAAQ,GAAG,KAAK,KAAM,EAAG,KAAMmB,EAAO,UAAU,sCAAsC,EACvFtB,EAACE,EAAA,CACC,KAAM,EACN,KAAMqB,EACN,UAAU,8KACZ,EACAvB,EAAC,OACC,UAAWO,EACT,2HACF,EAEC,SAAAmB,EAAW,IAAI,CAACF,EAAOT,IACtBf,EAAC,OAEC,UAAWO,EAAG,mEAAoE,CAChF,SAAUQ,IAAU,GAAKA,IAAU,EACnC,sBAAuBA,IAAU,EACjC,qBAAsBA,IAAU,CAClC,CAAC,EAEA,SAAAS,EAAM,IAAI,CAACN,EAAMS,IAChB3B,EAACiB,EAAA,CAAsB,KAAMC,GAAlBS,CAAwB,CACpC,GATIZ,CAUP,CACD,EACH,GACF,CAEJ,CAEA,IAAOa,EAAQpB,EAAWW,CAAa",
6
- "names": ["jsx", "jsxs", "Text", "Heading", "Avatar", "AvatarImage", "AvatarFallback", "cn", "withLayout", "FIX_ITEMS_LENGTH", "COUNT", "_chunk", "array", "size", "_", "index", "StarIcon", "Card", "item", "MarqueeReview", "data", "className", "title", "subtitle", "items", "theme", "chunkItems", "innerIndex", "MarqueeReview_default"]
4
+ "sourcesContent": ["import { Text, Heading, Avatar, AvatarImage, AvatarFallback } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media, Theme } from '../../types/props.js'\n\nconst FIX_ITEMS_LENGTH = 9\nconst COUNT = 3\n\n/**\n * \u8BC4\u8BBA\u9879\u6570\u636E\u7ED3\u6784\n */\nexport interface ReviewItem {\n /** \u8BC4\u8BBA\u8005\u540D\u79F0 */\n name: string\n /** \u8BC4\u8BBA\u8005\u5934\u50CF URL */\n avatar: Media\n /** \u8BC4\u8BBA\u5185\u5BB9 */\n comment: string\n /** \u8BC4\u5206(1-5\u661F) */\n rating?: number\n}\n\n/**\n * \u8F6E\u64AD\u8BC4\u8BBA\u6570\u636E\u7ED3\u6784\n */\nexport interface MarqueeReviewData {\n /** \u4E3B\u6807\u9898 */\n title: string\n /** \u526F\u6807\u9898 */\n subtitle: string\n /** \u8BC4\u8BBA\u5217\u8868 */\n items: ReviewItem[]\n /** \u4E3B\u9898\uFF1Alight \u6216 dark */\n theme?: Theme\n}\n\n/**\n * MarqueeReview \u7EC4\u4EF6 Props\n */\nexport interface MarqueeReviewProps {\n /** \u8BC4\u8BBA\u6570\u636E */\n data: MarqueeReviewData\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n}\n\nconst _chunk = <T,>(array: T[], size: number): T[][] => {\n return Array.from({ length: Math.ceil(array.length / size) }, (_, index) =>\n array.slice(index * size, (index + 1) * size)\n )\n}\n\nconst StarIcon = () => (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z\"\n fill=\"#F77234\"\n />\n </svg>\n)\n\nconst unStarIcon = () => (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"13\" viewBox=\"0 0 14 13\" fill=\"none\">\n <path\n d=\"M6.07501 0.418036C6.35012 -0.139398 7.145 -0.139397 7.42011 0.418037L8.9242 3.46565C9.03344 3.68701 9.24462 3.84043 9.4889 3.87593L12.8521 4.36464C13.4673 4.45403 13.7129 5.21 13.2678 5.64391L10.8341 8.01614C10.6574 8.18844 10.5767 8.43669 10.6184 8.67999L11.1929 12.0296C11.298 12.6423 10.655 13.1095 10.1047 12.8203L7.09656 11.2388C6.87807 11.1239 6.61705 11.1239 6.39855 11.2388L3.39038 12.8203C2.84016 13.1095 2.19709 12.6423 2.30217 12.0296L2.87668 8.67999C2.91841 8.43669 2.83775 8.18844 2.66098 8.01614L0.227318 5.64391C-0.21782 5.21 0.0278133 4.45403 0.642979 4.36464L4.00622 3.87593C4.2505 3.84043 4.46167 3.68701 4.57092 3.46565L6.07501 0.418036Z\"\n fill=\"#75787F\"\n />\n </svg>\n)\n\ninterface CardProps {\n item: ReviewItem\n}\n\nconst Card = ({ item }: CardProps) => {\n return (\n <div className=\"rounded-box bg-container-primary text-info-primary min-l:p-[24px] laptop:h-[240px] desktop:h-[240px] lg-desktop:h-[240px] flex h-[240px] grow flex-col justify-between p-[16px]\">\n <div className=\"flex justify-between\">\n <div className=\"flex flex-col\">\n <Text size={4} html={item.name} className=\"laptop:block hidden\" />\n <Text size={2} html={item.name} className=\"laptop:hidden block\" />\n <div className=\"mt-2 flex gap-1\">\n {new Array(item.rating || 5).fill(0).map((_, index) => (\n <StarIcon key={index} />\n ))}\n {new Array(5 - (item.rating || 5)).fill(0).map((_, index) => (\n <span key={index}>{unStarIcon()}</span>\n ))}\n </div>\n </div>\n <Avatar size=\"small\" className=\" laptop:size-[48px] size-[40px]\">\n <AvatarImage src={item.avatar?.url} alt={item.avatar?.alt || ''} />\n <AvatarFallback>{(item.name ?? '').slice(0, 2).toUpperCase()}</AvatarFallback>\n </Avatar>\n </div>\n <div>\n <Heading as=\"h6\" size={2} html={`${item.comment}`} className=\"line-clamp-5 min-h-[120px] text-wrap\" />\n </div>\n </div>\n )\n}\n\n/**\n * MarqueeReview - \u5782\u76F4\u6EDA\u52A8\u7684\u8BC4\u8BBA\u8F6E\u64AD\u7EC4\u4EF6\n *\n * \u7528\u4E8E\u5C55\u793A\u7528\u6237\u8BC4\u8BBA,\u652F\u6301\u591A\u5217\u5782\u76F4\u65E0\u9650\u6EDA\u52A8\u6548\u679C\u3002\n *\n * @example\n * ```tsx\n * <MarqueeReview\n * data={{\n * title: \"\u5BA2\u6237\u8BC4\u4EF7\",\n * subtitle: \"\u770B\u770B\u7528\u6237\u600E\u4E48\u8BF4\",\n * items: [\n * {\n * name: \"\u5F20\u4E09\",\n * avatar: \"/avatar1.jpg\",\n * comment: \"\u975E\u5E38\u597D\u7528\u7684\u4EA7\u54C1!\",\n * rating: 5\n * }\n * ]\n * }}\n * />\n * ```\n */\nfunction MarqueeReview({ data, className }: MarqueeReviewProps) {\n const { title, subtitle, items = [], theme = 'light' } = data\n\n const chunkItems = _chunk(\n items.length < FIX_ITEMS_LENGTH ? [...items, ...items.slice(FIX_ITEMS_LENGTH - items.length)] : items,\n COUNT\n )\n .slice(0, 3)\n .map(item => [...item, ...item])\n\n return (\n <section\n className={cn('text-info-primary flex flex-col items-center justify-center py-3', className, {\n 'aiui-dark': theme === 'dark',\n })}\n >\n <Heading as=\"h1\" size={4} html={title} className=\"laptop:text-center w-full text-left\" />\n <Text\n size={2}\n html={subtitle}\n className=\"tablet:mt-[16px] tablet:text-[14px] laptop:text-center laptop:text-[14px] desktop:mt-[8px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] w-full text-left text-[14px]\"\n />\n <div\n className={cn(\n 'mask-fade-vertical laptop:h-[384px] desktop:h-[512px] lg-desktop:h-[640px] mt-[24px] flex h-[480px] gap-4 overflow-hidden'\n )}\n >\n {chunkItems.map((items, index) => (\n <div\n key={index}\n className={cn('animate-marquee-scroll relative flex h-fit flex-1 flex-col gap-4', {\n 'top-10': index === 0 || index === 2,\n 'hidden desktop:flex': index === 1,\n 'hidden tablet:flex': index === 2,\n })}\n >\n {items.map((item, innerIndex) => (\n <Card key={innerIndex} item={item} />\n ))}\n </div>\n ))}\n </div>\n </section>\n )\n}\n\nexport default withLayout(MarqueeReview)\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "Text", "Heading", "Avatar", "AvatarImage", "AvatarFallback", "cn", "withLayout", "FIX_ITEMS_LENGTH", "COUNT", "_chunk", "array", "size", "_", "index", "StarIcon", "unStarIcon", "Card", "item", "MarqueeReview", "data", "className", "title", "subtitle", "items", "theme", "chunkItems", "innerIndex", "MarqueeReview_default"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use client";import{Fragment as D,jsx as e,jsxs as o}from"react/jsx-runtime";import _,{useRef as p,useImperativeHandle as g}from"react";import{Button as k,Heading as a,Picture as u,Text as h}from"../../components/index.js";import{cn as i}from"../../helpers/utils.js";import{withLayout as N}from"../../shared/Styles.js";import{useExposure as S}from"../../hooks/useExposure.js";import{Swiper as f,SwiperSlide as m}from"swiper/react";import{Navigation as y,EffectCoverflow as T}from"swiper/modules";import"swiper/css";import"swiper/css/navigation";import"swiper/css/pagination";import"swiper/css/effect-coverflow";const C="carousel",L="three_d_carousel",E=()=>o("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"three-d-carousel__nav-icon lg-desktop:scale-100 scale-[70%] text-white hover:text-[#1f1f1f]",children:[e("circle",{cx:"28",cy:"28",r:"28",fill:"currentColor",fillOpacity:"0.2"}),e("path",{d:"M32 20L24 28L32 36",stroke:"white",strokeWidth:"2.66667",strokeLinecap:"round",strokeLinejoin:"round"})]}),z=()=>o("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"three-d-carousel__nav-icon lg-desktop:scale-100 scale-[70%] text-white hover:text-[#1f1f1f]",children:[e("circle",{cx:"28",cy:"28",r:"28",fill:"currentColor",fillOpacity:"0.2"}),e("path",{d:"M24 20L32 28L24 36",stroke:"white",strokeWidth:"2.66667",strokeLinecap:"round",strokeLinejoin:"round"})]}),w=_.forwardRef(({data:v,className:x},b)=>{const{title:c,items:d=[]}=v,r=p(null),l=p(null);return S(l,{componentType:C,componentName:L,componentTitle:c}),g(b,()=>l.current),o("section",{ref:l,"data-ui-component-id":"ThreeDCarousel",className:i("three-d-carousel laptop:overflow-hidden w-full overflow-visible text-white",x),children:[e(a,{as:"h1",size:4,html:c,className:"three-d-carousel__title laptop:text-center text-left"}),o("div",{className:"three-d-carousel__desktop laptop:block relative mx-auto mt-[24px] hidden w-full",children:[e(f,{onSwiper:t=>r.current=t,centeredSlides:!0,initialSlide:0,loop:!0,slidesPerView:"auto",spaceBetween:0,grabCursor:!0,modules:[T,y],slideToClickedSlide:!0,className:"three-d-carousel__swiper rounded-box relative aspect-[1386/502] overflow-visible",effect:"coverflow",coverflowEffect:{rotate:0,stretch:427,depth:300,slideShadows:!0},breakpoints:{1921:{coverflowEffect:{rotate:0,stretch:427,depth:300,slideShadows:!0}},1490:{coverflowEffect:{rotate:0,stretch:350,depth:300,slideShadows:!0}},1441:{coverflowEffect:{rotate:0,stretch:334,depth:300,slideShadows:!0}},1025:{coverflowEffect:{rotate:0,stretch:230,depth:300,slideShadows:!0}},769:{coverflowEffect:{rotate:0,stretch:286,depth:300,slideShadows:!0}}},children:d.map((t,s)=>e(m,{className:"three-d-carousel__slide relative !w-[62.23%] cursor-grab overflow-hidden",children:({isActive:n})=>o(D,{children:[e(u,{source:t.imageUrl?.url||"",alt:t.imageUrl?.alt||t.title,className:i("three-d-carousel__image rounded-box mx-auto h-full overflow-hidden shadow-lg"),imgClassName:"h-full object-cover",style:{filter:n?"":"brightness(50%) contrast(120%)"}}),o("div",{className:i("three-d-carousel__image-content tablet:p-[24px] desktop:p-[32px] absolute left-0 top-0 flex size-full flex-col justify-end gap-1 p-[16px]",{"aiui-dark":t.theme==="dark","opacity-0":!n}),children:[e(a,{as:"h2",size:2,html:t.title}),e(h,{as:"p",size:4,html:t.description,className:"three-d-carousel__image-description text-[14px]"}),t.buttonText&&e("a",{href:t.buttonLink||"",className:"three-d-carousel__image-link ",children:e(k,{size:"base",variant:"secondary",className:"three-d-carousel__image-button desktop:mt-6 mt-4",children:t.buttonText})})]})]})},s))}),o("div",{className:"three-d-carousel__nav-controls laptop:px-[64px] desktop:px-[140px] lg-desktop:px-[200px] absolute left-[50%] top-[50%] z-20 flex w-full -translate-x-[50%] -translate-y-[50%] justify-between",children:[e("button",{className:"three-d-carousel__nav-button three-d-carousel__nav-button--prev",onClick:()=>r.current?.slidePrev(),"aria-label":"Previous slide",children:e(E,{})}),e("button",{className:"three-d-carousel__nav-button three-d-carousel__nav-button--next",onClick:()=>r.current?.slideNext(),"aria-label":"Next slide",children:e(z,{})})]})]}),e("div",{className:"three-d-carousel__mobile laptop:hidden mt-[24px] block w-full overflow-visible",children:e(f,{loop:!0,slidesPerView:"auto",spaceBetween:12,grabCursor:!0,className:"three-d-carousel__swiper-mobile relative w-full !overflow-visible",children:d.map((t,s)=>o(m,{className:"three-d-carousel__slide-mobile relative !h-[360px] !w-[296px] cursor-grab overflow-hidden",children:[e(u,{source:t.mobImageUrl?.url||t.imageUrl?.url||"",alt:t.mobImageUrl?.alt||t.title,className:"three-d-carousel__image-mobile rounded-box mx-auto h-full overflow-hidden shadow-lg",imgClassName:"h-full object-cover"}),o("div",{className:"three-d-carousel__image-mobile-content tablet:p-[24px] desktop:p-[32px] absolute left-0 top-0 flex size-full flex-col justify-end gap-1 p-[16px]",children:[e(a,{as:"h2",size:2,html:t.title}),e(h,{as:"p",size:4,html:t.description,className:"three-d-carousel__image-mobile-description text-[14px] text-white"}),t.buttonText&&e("a",{href:t.buttonLink||"",className:"three-d-carousel__image-mobile-link ",children:e("button",{className:"three-d-carousel__image-mobile-button rounded-btn mt-3 border border-white px-[16px] py-[8px] text-[14px] font-semibold text-white transition-all duration-300 ease-in-out hover:bg-white hover:text-black active:scale-95",children:t.buttonText})})]})]},s))})})]})});w.displayName="ThreeDCarousel";var q=N(w);export{q as default};
1
+ "use client";import{Fragment as j,jsx as e,jsxs as o}from"react/jsx-runtime";import g,{useRef as p,useImperativeHandle as k}from"react";import{Button as N,Heading as i,Picture as u,Text as h}from"../../components/index.js";import{cn as c}from"../../helpers/utils.js";import{withLayout as y}from"../../shared/Styles.js";import{useExposure as S}from"../../hooks/useExposure.js";import{Swiper as f,SwiperSlide as m}from"swiper/react";import{Navigation as T,EffectCoverflow as C}from"swiper/modules";import"swiper/css";import"swiper/css/navigation";import"swiper/css/pagination";import"swiper/css/effect-coverflow";const L="carousel",E="three_d_carousel",z=()=>o("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"three-d-carousel__nav-icon lg-desktop:scale-100 scale-[70%] text-white hover:text-[#1f1f1f]",children:[e("circle",{cx:"28",cy:"28",r:"28",fill:"currentColor",fillOpacity:"0.2"}),e("path",{d:"M32 20L24 28L32 36",stroke:"white",strokeWidth:"2.66667",strokeLinecap:"round",strokeLinejoin:"round"})]}),D=()=>o("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"three-d-carousel__nav-icon lg-desktop:scale-100 scale-[70%] text-white hover:text-[#1f1f1f]",children:[e("circle",{cx:"28",cy:"28",r:"28",fill:"currentColor",fillOpacity:"0.2"}),e("path",{d:"M24 20L32 28L24 36",stroke:"white",strokeWidth:"2.66667",strokeLinecap:"round",strokeLinejoin:"round"})]}),w=g.forwardRef(({data:v,className:x},b)=>{const{title:d,items:r=[]}=v,_=r.length<4?[...r,...r]:r,l=p(null),s=p(null);return S(s,{componentType:L,componentName:E,componentTitle:d}),k(b,()=>s.current),o("section",{ref:s,"data-ui-component-id":"ThreeDCarousel",className:c("three-d-carousel laptop:overflow-hidden w-full overflow-visible text-white",x),children:[e(i,{as:"h1",size:4,html:d,className:"three-d-carousel__title laptop:text-center text-left"}),o("div",{className:"three-d-carousel__desktop laptop:block relative mx-auto mt-[24px] hidden w-full px-4",children:[e(f,{onSwiper:t=>l.current=t,centeredSlides:!0,initialSlide:0,loop:!0,slidesPerView:"auto",spaceBetween:0,grabCursor:!0,modules:[C,T],slideToClickedSlide:!0,className:"three-d-carousel__swiper rounded-box relative aspect-[1386/502] overflow-visible",effect:"coverflow",coverflowEffect:{rotate:0,stretch:427,depth:300,slideShadows:!0},breakpoints:{1921:{coverflowEffect:{rotate:0,stretch:427,depth:300,slideShadows:!0}},1490:{coverflowEffect:{rotate:0,stretch:350,depth:300,slideShadows:!0}},1441:{coverflowEffect:{rotate:0,stretch:334,depth:300,slideShadows:!0}},1025:{coverflowEffect:{rotate:0,stretch:230,depth:300,slideShadows:!0}},769:{coverflowEffect:{rotate:0,stretch:286,depth:300,slideShadows:!0}}},children:_.map((t,a)=>e(m,{className:"three-d-carousel__slide relative !w-[62.23%] cursor-grab overflow-hidden",children:({isActive:n})=>o(j,{children:[e(u,{source:t.imageUrl?.url||"",alt:t.imageUrl?.alt||t.title,className:c("three-d-carousel__image rounded-box mx-auto h-full overflow-hidden shadow-lg"),imgClassName:"h-full object-cover",style:{filter:n?"":"brightness(50%) contrast(120%)"}}),o("div",{className:c("three-d-carousel__image-content tablet:p-[24px] desktop:p-[32px] text-info-primary absolute left-0 top-0 flex size-full flex-col justify-end gap-1 p-[16px]",{"aiui-dark":t.theme==="dark","opacity-0":!n}),children:[e(i,{as:"h2",size:2,html:t.title}),e(h,{as:"p",size:4,html:t.description,className:"three-d-carousel__image-description text-[14px]"}),t.buttonText&&e("a",{href:t.buttonLink||"",className:"three-d-carousel__image-link ",children:e(N,{size:"base",variant:"secondary",className:"three-d-carousel__image-button desktop:mt-6 mt-4",children:t.buttonText})})]})]})},a))}),o("div",{className:"three-d-carousel__nav-controls laptop:px-[64px] desktop:px-[140px] lg-desktop:px-[200px] absolute left-1/2 top-1/2 z-20 flex w-full -translate-x-1/2 -translate-y-1/2 justify-between",children:[e("button",{className:"three-d-carousel__nav-button three-d-carousel__nav-button--prev",onClick:()=>l.current?.slidePrev(),"aria-label":"Previous slide",children:e(z,{})}),e("button",{className:"three-d-carousel__nav-button three-d-carousel__nav-button--next",onClick:()=>l.current?.slideNext(),"aria-label":"Next slide",children:e(D,{})})]})]}),e("div",{className:"three-d-carousel__mobile laptop:hidden mt-[24px] block w-full overflow-visible",children:e(f,{loop:!0,slidesPerView:"auto",spaceBetween:12,grabCursor:!0,className:"three-d-carousel__swiper-mobile relative w-full !overflow-visible",children:r.map((t,a)=>o(m,{className:"three-d-carousel__slide-mobile relative !h-[360px] !w-[296px] cursor-grab overflow-hidden",children:[e(u,{source:t.mobImageUrl?.url||t.imageUrl?.url||"",alt:t.mobImageUrl?.alt||t.title,className:"three-d-carousel__image-mobile rounded-box mx-auto h-full overflow-hidden shadow-lg",imgClassName:"h-full object-cover"}),o("div",{className:"three-d-carousel__image-mobile-content tablet:p-[24px] desktop:p-[32px] absolute left-0 top-0 flex size-full flex-col justify-end gap-1 p-[16px]",children:[e(i,{as:"h2",size:2,html:t.title}),e(h,{as:"p",size:4,html:t.description,className:"three-d-carousel__image-mobile-description text-[14px] text-white"}),t.buttonText&&e("a",{href:t.buttonLink||"",className:"three-d-carousel__image-mobile-link ",children:e("button",{className:"three-d-carousel__image-mobile-button rounded-btn mt-3 border border-white px-[16px] py-[8px] text-[14px] font-semibold text-white transition-all duration-300 ease-in-out hover:bg-white hover:text-black active:scale-95",children:t.buttonText})})]})]},a))})})]})});w.displayName="ThreeDCarousel";var A=y(w);export{A as default};
2
2
  //# sourceMappingURL=ThreeDCarousel.js.map