@anker-in/headless-ui 1.0.26-temp-111002 → 1.0.26-temp-111005
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/biz-components/AccordionCards/index.d.ts +2 -2
- package/dist/cjs/biz-components/AplusDesc/index.d.ts +3 -2
- package/dist/cjs/biz-components/BrandEquity/BrandEquity.d.ts +3 -2
- package/dist/cjs/biz-components/Category/index.d.ts +2 -2
- package/dist/cjs/biz-components/CollectionShelves/index.d.ts +3 -2
- package/dist/cjs/biz-components/CollectionsBanner/index.d.ts +2 -2
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.d.ts +2 -0
- package/dist/cjs/biz-components/CollectionsFilters/index.d.ts +4 -2
- package/dist/cjs/biz-components/CreativeModule/index.d.ts +3 -2
- package/dist/cjs/biz-components/DownLoad/index.d.ts +3 -2
- package/dist/cjs/biz-components/Evaluate/index.d.ts +2 -2
- package/dist/cjs/biz-components/Faq/Faq.d.ts +2 -2
- package/dist/cjs/biz-components/FeatureCards/FeatureCards.d.ts +2 -2
- package/dist/cjs/biz-components/FeatureCards/FeatureCards.js +1 -1
- package/dist/cjs/biz-components/FeatureCards/FeatureCards.js.map +2 -2
- package/dist/cjs/biz-components/FeatureShowcase/FeatureShowcase.d.ts +2 -2
- package/dist/cjs/biz-components/FeatureShowcase/FeatureShowcase.js +1 -1
- package/dist/cjs/biz-components/FeatureShowcase/FeatureShowcase.js.map +2 -2
- package/dist/cjs/biz-components/Features/index.d.ts +3 -2
- package/dist/cjs/biz-components/FootCharger/index.d.ts +3 -2
- package/dist/cjs/biz-components/FooterNavigation/index.d.ts +3 -2
- package/dist/cjs/biz-components/GiftBox/index.d.ts +3 -2
- package/dist/cjs/biz-components/Graphic/index.d.ts +2 -2
- package/dist/cjs/biz-components/GraphicAttractionBlock/index.d.ts +2 -2
- package/dist/cjs/biz-components/GraphicMore/index.d.ts +3 -2
- package/dist/cjs/biz-components/GraphicOverlay/GraphicOverlay.d.ts +2 -2
- package/dist/cjs/biz-components/HeaderNavigation/index.d.ts +2 -2
- package/dist/cjs/biz-components/HeaderNavigation/index.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/index.js.map +3 -3
- package/dist/cjs/biz-components/HeroBanner/Countdown.d.ts +1 -1
- package/dist/cjs/biz-components/HeroBanner/Countdown.js +1 -1
- package/dist/cjs/biz-components/HeroBanner/Countdown.js.map +3 -3
- package/dist/cjs/biz-components/HeroBanner/HeroBanner.d.ts +2 -2
- package/dist/cjs/biz-components/ImageTextFeature/ImageTextFeature.d.ts +2 -2
- package/dist/cjs/biz-components/ImageTextFeature/ImageTextFeature.js +1 -1
- package/dist/cjs/biz-components/ImageTextFeature/ImageTextFeature.js.map +2 -2
- package/dist/cjs/biz-components/ImageWithText/ImageWithText.d.ts +2 -2
- package/dist/cjs/biz-components/ImageWithText/ImageWithText.js +1 -1
- package/dist/cjs/biz-components/ImageWithText/ImageWithText.js.map +2 -2
- package/dist/cjs/biz-components/Ksp/index.d.ts +3 -2
- package/dist/cjs/biz-components/Ksp/index.js +1 -1
- package/dist/cjs/biz-components/Ksp/index.js.map +3 -3
- package/dist/cjs/biz-components/Listing/BizProductProvider.d.ts +2 -4
- package/dist/cjs/biz-components/Listing/BizProductProvider.js +1 -1
- package/dist/cjs/biz-components/Listing/BizProductProvider.js.map +3 -3
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js +4 -4
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js.map +3 -3
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.js.map +3 -3
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.js.map +3 -3
- package/dist/cjs/biz-components/Listing/index.d.ts +1 -0
- package/dist/cjs/biz-components/Listing/index.js +1 -1
- package/dist/cjs/biz-components/Listing/index.js.map +3 -3
- package/dist/cjs/biz-components/Marquee/Marquee.d.ts +2 -2
- package/dist/cjs/biz-components/MarqueeReview/index.d.ts +3 -2
- package/dist/cjs/biz-components/MediaPlayerBase/index.d.ts +3 -2
- package/dist/cjs/biz-components/MediaPlayerMulti/index.d.ts +3 -2
- package/dist/cjs/biz-components/MediaPlayerSticky/index.d.ts +2 -2
- package/dist/cjs/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.d.ts +3 -2
- package/dist/cjs/biz-components/MemberEquity/index.d.ts +2 -2
- package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.d.ts +2 -2
- package/dist/cjs/biz-components/NavigationSearch/index.d.ts +1 -0
- package/dist/cjs/biz-components/ProductCompare/index.d.ts +3 -2
- package/dist/cjs/biz-components/ProductHero/ProductHero.d.ts +2 -2
- package/dist/cjs/biz-components/ProductHero/ProductHero.js +1 -1
- package/dist/cjs/biz-components/ProductHero/ProductHero.js.map +2 -2
- package/dist/cjs/biz-components/SelectStore/index.d.ts +3 -2
- package/dist/cjs/biz-components/ShelfDisplay/index.d.ts +2 -2
- package/dist/cjs/biz-components/Slogan/index.d.ts +2 -2
- package/dist/cjs/biz-components/Spacer/index.d.ts +2 -2
- package/dist/cjs/biz-components/Specs/dropdown.js +2 -2
- package/dist/cjs/biz-components/Specs/dropdown.js.map +2 -2
- package/dist/cjs/biz-components/Specs/index.d.ts +2 -2
- package/dist/cjs/biz-components/SpecsComparison/SpecsComparison.d.ts +2 -2
- package/dist/cjs/biz-components/TabWithImage/TabWithImage.d.ts +2 -2
- package/dist/cjs/biz-components/TabWithImage/TabWithImage.js +1 -1
- package/dist/cjs/biz-components/TabWithImage/TabWithImage.js.map +2 -2
- package/dist/cjs/biz-components/Tabs/Tabs.d.ts +2 -2
- package/dist/cjs/biz-components/TabsGroup/index.d.ts +2 -2
- package/dist/cjs/biz-components/TabsWithMedia/TabsWithMedia.d.ts +2 -2
- package/dist/cjs/biz-components/TextMarquee/index.d.ts +3 -2
- package/dist/cjs/biz-components/ThreeDCarousel/ThreeDCarousel.d.ts +2 -2
- package/dist/cjs/biz-components/Title/index.d.ts +2 -2
- package/dist/cjs/biz-components/VideoFeature/VideoFeature.d.ts +2 -2
- package/dist/cjs/biz-components/VideoFeature/VideoFeature.js +1 -1
- package/dist/cjs/biz-components/VideoFeature/VideoFeature.js.map +2 -2
- package/dist/cjs/biz-components/WhyChoose/WhyChoose.d.ts +2 -2
- package/dist/cjs/components/alert.d.ts +2 -2
- package/dist/cjs/components/avatar.d.ts +8 -8
- package/dist/cjs/components/container.d.ts +7 -7
- package/dist/cjs/components/dialog.d.ts +1 -1
- package/dist/cjs/components/drop-down.d.ts +3 -3
- package/dist/cjs/components/input-number.d.ts +15 -15
- package/dist/cjs/components/link.d.ts +6 -6
- package/dist/cjs/components/tabs.d.ts +2 -2
- package/dist/cjs/cpn-components/CpnNavigation/types.d.ts +1 -0
- package/dist/cjs/shared/Styles.d.ts +2 -2
- package/dist/cjs/stories/HeroBanner.stories.js +2 -2
- package/dist/cjs/stories/HeroBanner.stories.js.map +3 -3
- package/dist/cjs/tsconfig.tsbuildinfo +1 -1
- package/dist/esm/biz-components/AccordionCards/index.d.ts +2 -2
- package/dist/esm/biz-components/AplusDesc/index.d.ts +3 -2
- package/dist/esm/biz-components/BrandEquity/BrandEquity.d.ts +3 -2
- package/dist/esm/biz-components/Category/index.d.ts +2 -2
- package/dist/esm/biz-components/CollectionShelves/index.d.ts +3 -2
- package/dist/esm/biz-components/CollectionsBanner/index.d.ts +2 -2
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.d.ts +2 -0
- package/dist/esm/biz-components/CollectionsFilters/index.d.ts +4 -2
- package/dist/esm/biz-components/CreativeModule/index.d.ts +3 -2
- package/dist/esm/biz-components/DownLoad/index.d.ts +3 -2
- package/dist/esm/biz-components/Evaluate/index.d.ts +2 -2
- package/dist/esm/biz-components/Faq/Faq.d.ts +2 -2
- package/dist/esm/biz-components/FeatureCards/FeatureCards.d.ts +2 -2
- package/dist/esm/biz-components/FeatureCards/FeatureCards.js +1 -1
- package/dist/esm/biz-components/FeatureCards/FeatureCards.js.map +2 -2
- package/dist/esm/biz-components/FeatureShowcase/FeatureShowcase.d.ts +2 -2
- package/dist/esm/biz-components/FeatureShowcase/FeatureShowcase.js +1 -1
- package/dist/esm/biz-components/FeatureShowcase/FeatureShowcase.js.map +2 -2
- package/dist/esm/biz-components/Features/index.d.ts +3 -2
- package/dist/esm/biz-components/FootCharger/index.d.ts +3 -2
- package/dist/esm/biz-components/FooterNavigation/index.d.ts +3 -2
- package/dist/esm/biz-components/GiftBox/index.d.ts +3 -2
- package/dist/esm/biz-components/Graphic/index.d.ts +2 -2
- package/dist/esm/biz-components/GraphicAttractionBlock/index.d.ts +2 -2
- package/dist/esm/biz-components/GraphicMore/index.d.ts +3 -2
- package/dist/esm/biz-components/GraphicOverlay/GraphicOverlay.d.ts +2 -2
- package/dist/esm/biz-components/HeaderNavigation/index.d.ts +2 -2
- package/dist/esm/biz-components/HeaderNavigation/index.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/index.js.map +3 -3
- package/dist/esm/biz-components/HeroBanner/Countdown.d.ts +1 -1
- package/dist/esm/biz-components/HeroBanner/Countdown.js +1 -1
- package/dist/esm/biz-components/HeroBanner/Countdown.js.map +3 -3
- package/dist/esm/biz-components/HeroBanner/HeroBanner.d.ts +2 -2
- package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.d.ts +2 -2
- package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.js +1 -1
- package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.js.map +2 -2
- package/dist/esm/biz-components/ImageWithText/ImageWithText.d.ts +2 -2
- package/dist/esm/biz-components/ImageWithText/ImageWithText.js +1 -1
- package/dist/esm/biz-components/ImageWithText/ImageWithText.js.map +2 -2
- package/dist/esm/biz-components/Ksp/index.d.ts +3 -2
- package/dist/esm/biz-components/Ksp/index.js +1 -1
- package/dist/esm/biz-components/Ksp/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/BizProductProvider.d.ts +2 -4
- package/dist/esm/biz-components/Listing/BizProductProvider.js +1 -1
- package/dist/esm/biz-components/Listing/BizProductProvider.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js +4 -4
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ProductActions/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ProductActions/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/index.d.ts +1 -0
- package/dist/esm/biz-components/Listing/index.js +1 -1
- package/dist/esm/biz-components/Listing/index.js.map +3 -3
- package/dist/esm/biz-components/Marquee/Marquee.d.ts +2 -2
- package/dist/esm/biz-components/MarqueeReview/index.d.ts +3 -2
- package/dist/esm/biz-components/MediaPlayerBase/index.d.ts +3 -2
- package/dist/esm/biz-components/MediaPlayerMulti/index.d.ts +3 -2
- package/dist/esm/biz-components/MediaPlayerSticky/index.d.ts +2 -2
- package/dist/esm/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.d.ts +3 -2
- package/dist/esm/biz-components/MemberEquity/index.d.ts +2 -2
- package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.d.ts +2 -2
- package/dist/esm/biz-components/NavigationSearch/index.d.ts +1 -0
- package/dist/esm/biz-components/ProductCompare/index.d.ts +3 -2
- package/dist/esm/biz-components/ProductHero/ProductHero.d.ts +2 -2
- package/dist/esm/biz-components/ProductHero/ProductHero.js +1 -1
- package/dist/esm/biz-components/ProductHero/ProductHero.js.map +2 -2
- package/dist/esm/biz-components/SelectStore/index.d.ts +3 -2
- package/dist/esm/biz-components/ShelfDisplay/index.d.ts +2 -2
- package/dist/esm/biz-components/Slogan/index.d.ts +2 -2
- package/dist/esm/biz-components/Spacer/index.d.ts +2 -2
- package/dist/esm/biz-components/Specs/dropdown.js +1 -1
- package/dist/esm/biz-components/Specs/dropdown.js.map +2 -2
- package/dist/esm/biz-components/Specs/index.d.ts +2 -2
- package/dist/esm/biz-components/SpecsComparison/SpecsComparison.d.ts +2 -2
- package/dist/esm/biz-components/TabWithImage/TabWithImage.d.ts +2 -2
- package/dist/esm/biz-components/TabWithImage/TabWithImage.js +1 -1
- package/dist/esm/biz-components/TabWithImage/TabWithImage.js.map +2 -2
- package/dist/esm/biz-components/Tabs/Tabs.d.ts +2 -2
- package/dist/esm/biz-components/TabsGroup/index.d.ts +2 -2
- package/dist/esm/biz-components/TabsWithMedia/TabsWithMedia.d.ts +2 -2
- package/dist/esm/biz-components/TextMarquee/index.d.ts +3 -2
- package/dist/esm/biz-components/ThreeDCarousel/ThreeDCarousel.d.ts +2 -2
- package/dist/esm/biz-components/Title/index.d.ts +2 -2
- package/dist/esm/biz-components/VideoFeature/VideoFeature.d.ts +2 -2
- package/dist/esm/biz-components/VideoFeature/VideoFeature.js +1 -1
- package/dist/esm/biz-components/VideoFeature/VideoFeature.js.map +2 -2
- package/dist/esm/biz-components/WhyChoose/WhyChoose.d.ts +2 -2
- package/dist/esm/components/alert.d.ts +2 -2
- package/dist/esm/components/avatar.d.ts +8 -8
- package/dist/esm/components/container.d.ts +7 -7
- package/dist/esm/components/dialog.d.ts +1 -1
- package/dist/esm/components/drop-down.d.ts +3 -3
- package/dist/esm/components/input-number.d.ts +15 -15
- package/dist/esm/components/link.d.ts +6 -6
- package/dist/esm/components/tabs.d.ts +2 -2
- package/dist/esm/cpn-components/CpnNavigation/types.d.ts +1 -0
- package/dist/esm/shared/Styles.d.ts +2 -2
- package/dist/esm/stories/HeroBanner.stories.js +2 -2
- package/dist/esm/stories/HeroBanner.stories.js.map +2 -2
- package/dist/esm/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/style.css +1 -2
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../src/biz-components/Listing/components/ProductCard/ProductSummary/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Text, Button, Container, Grid, GridItem, Picture, Heading } from '../../../../../components'\nimport type { ProductSummaryProps } from './types'\nimport { useBizProductContext } from '../../../BizProductProvider'\nimport { useEffect, useMemo, useState } from 'react'\nimport { formatPrice } from '../../../utils'\nimport { useAiuiContext } from '../../../../AiuiProvider'\nimport type { BundleListItem, ProductVariant, ProductPrice } from '../../../types/product'\nimport { cn } from '../../../../../helpers'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat'\n\nconst ProductSummary = ({}: ProductSummaryProps) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const {\n product,\n variant,\n finalPrice,\n comparePrice,\n coupon,\n selectedOptions,\n selectedVariants,\n totalSavings,\n onAddToCart,\n onBuyNow,\n savingDetail,\n checkedBundle,\n joinedRecommendBuyProducts,\n setJoinedRecommendBuyProducts,\n setCheckedGift,\n setCheckedExchangePurchase,\n setCheckedBundle,\n setSavingDetail,\n addToCartLoading,\n buyNowLoading,\n } = useBizProductContext()\n\n const [currentProductVariant] = selectedVariants\n\n const summaryFinalPrice = useMemo(() => {\n const [currentBundleVariant] = checkedBundle?.variants || []\n const currentBundlePrice = new Decimal(currentProductVariant?.price?.amount || 0)\n .minus(currentBundleVariant?.price || currentProductVariant?.price?.amount)\n .toNumber()\n return new Decimal(currentProductVariant?.price?.amount || 0)\n .minus(savingDetail?.coupon)\n .minus(currentBundlePrice)\n .toNumber()\n }, [currentProductVariant, totalSavings, checkedBundle])\n\n const isAvailable = variant.availableForSale\n if (!isAvailable) return null\n\n const { bundleVariant, giftVariant, exchangeVariant } = useRecommendBuyProducts() || {}\n const [initialRecommendBuyProducts, setInitialRecommendBuyProducts] = useState<{\n bundle?: BundleListItem\n gift?: ProductVariant\n exchange?: ProductVariant\n }>()\n\n useEffect(() => {\n setInitialRecommendBuyProducts({\n bundle: joinedRecommendBuyProducts.bundle?.value ? undefined : bundleVariant,\n gift: joinedRecommendBuyProducts.gift?.value ? undefined : giftVariant,\n exchange: joinedRecommendBuyProducts.exchange?.value ? undefined : exchangeVariant,\n })\n }, [bundleVariant, giftVariant, exchangeVariant, joinedRecommendBuyProducts])\n\n const comparePriceRemovedFreeGift = useMemo(\n () => new Decimal(comparePrice).minus(savingDetail.freeGift).toNumber(),\n [comparePrice, savingDetail]\n )\n\n return (\n <div className=\"ipc-product-summary laptop:px-16 desktop:px-0 mt-16 desktop:mt-[96px] lg-desktop:mt-[128px]\">\n <div className=\"bg-[#F5F5F7] laptop:rounded-2xl\">\n <Grid className=\"px-4 pt-6 tablet:p-8 tablet:!pb-0\">\n <GridItem className=\"col-span-12 laptop:col-start-1 laptop:col-span-5 gap-4 flex flex-col justify-between\">\n <Heading\n className=\"font-bold text-[24px] lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] leading-[1] mb-4 [&>span]:text-[#D1D1D1]\"\n html={`${product.title} is ready <br/><span>Just the way you want it.</span>`}\n />\n <div className=\"\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"lg-desktop:aspect-[644/368] desktop:aspect-[503/272] laptop:aspect-[331/191] tablet:aspect-[704/380] aspect-[358/192]\"\n imgClassName=\"object-cover h-full\"\n />\n </div>\n </GridItem>\n <GridItem className=\"col-span-12 mt-8 pb-6 tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 flex flex-col gap-6 justify-between\">\n <div>\n <div className=\"flex flex-col gap-4\">\n <div className=\"flex items-center justify-between\">\n <div className=\"shrink-0 flex items-center gap-4\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={product.title}\n />\n <Text\n className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\"\n html={`x1 | ${selectedOptions.color || selectedOptions.colour || selectedOptions.couleur}`}\n />\n </div>\n </div>\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: summaryFinalPrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n {totalSavings > 0 && (\n <Text\n className=\"text-base desktop:text-2xl laptop:text-xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: variant?.price?.amount,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n </div>\n </div>\n {joinedRecommendBuyProducts?.gift?.value && (\n <ProductGiftSummary\n giftOperation={gift => {\n setCheckedGift?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n gift: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift })\n }}\n status={!!joinedRecommendBuyProducts?.gift}\n gift={joinedRecommendBuyProducts?.gift?.value}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n />\n )}\n {joinedRecommendBuyProducts?.bundle?.value && (\n <ProductBundleSummary\n bundleOperation={bundle => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n bundle: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle })\n }}\n status={!!joinedRecommendBuyProducts?.bundle}\n bundleListItem={joinedRecommendBuyProducts?.bundle?.value}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n />\n )}\n {joinedRecommendBuyProducts?.exchange?.value && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setCheckedExchangePurchase?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n exchange: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange })\n }}\n status={!!joinedRecommendBuyProducts?.exchange}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n exchange={joinedRecommendBuyProducts?.exchange?.value}\n />\n )}\n </div>\n {(initialRecommendBuyProducts?.bundle ||\n initialRecommendBuyProducts?.gift ||\n initialRecommendBuyProducts?.exchange) && (\n <div className=\"mt-6\">\n <Text className=\"text-sm desktop:text-[18px] font-bold\" html={'Recommend Buy'} />\n <div className=\"flex flex-col gap-6 mt-6\">\n {initialRecommendBuyProducts?.exchange && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n gift: {\n value: joinedRecommendBuyProducts?.gift?.value,\n canOperate: true,\n },\n exchange: {\n value: exchange,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange: undefined })\n }}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n status={!initialRecommendBuyProducts?.exchange}\n exchange={initialRecommendBuyProducts?.exchange}\n />\n )}\n {initialRecommendBuyProducts?.bundle && (\n <ProductBundleSummary\n bundleOperation={bundle => {\n setCheckedGift?.(undefined)\n setCheckedExchangePurchase?.(undefined)\n setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n setJoinedRecommendBuyProducts?.({\n gift: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: undefined,\n canOperate: true,\n },\n bundle: {\n value: bundle,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle: undefined })\n }}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n status={!initialRecommendBuyProducts?.bundle}\n bundleListItem={initialRecommendBuyProducts?.bundle}\n />\n )}\n {initialRecommendBuyProducts?.gift && (\n <ProductGiftSummary\n giftOperation={gift => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: joinedRecommendBuyProducts?.exchange?.value,\n canOperate: true,\n },\n gift: {\n value: gift,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift: undefined })\n }}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n status={!initialRecommendBuyProducts?.gift}\n gift={initialRecommendBuyProducts?.gift}\n />\n )}\n </div>\n </div>\n )}\n </div>\n <div className=\"text-right\">\n <Text\n className=\"laptop:text-xl desktop:text-2xl font-bold text-right\"\n html={`${replaceTemplate(copyWriting?.totalPrice || '', { amount: formatPrice({ amount: finalPrice, currencyCode: variant.price.currencyCode, locale }) })}`}\n />\n\n {totalSavings > 0 && (\n <Text\n className=\"text-base laptop:text-xl desktop:text-2xl ml-1 font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: comparePrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n <div className=\"flex gap-3 mt-2 justify-end\">\n <Button\n size=\"lg\"\n variant=\"secondary\"\n loading={addToCartLoading}\n className=\"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto\"\n onClick={() => onAddToCart?.()}\n >\n {copyWriting?.addToCart}\n </Button>\n <Button\n size=\"lg\"\n loading={buyNowLoading}\n variant=\"primary\"\n className=\"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto\"\n onClick={() => onBuyNow?.()}\n >\n {copyWriting?.shopNow}\n </Button>\n </div>\n </div>\n </GridItem>\n </Grid>\n </div>\n </div>\n )\n}\n\nconst useRecommendBuyProducts = () => {\n const { bundle, variant, checkedBundle, freeGift, checkedGift, exchangePurchase, checkedExchangePurchase } =\n useBizProductContext()\n let bundleVariant = undefined\n let giftVariant = undefined\n let exchangeVariant = undefined\n const { bundleList } = bundle || {}\n\n const { giftList = [] } = freeGift || {}\n const { giftList: exchangeList = [] } = exchangePurchase || {}\n\n const availableBundleList =\n bundleList?.filter(bundle =>\n bundle.variants.slice(1, bundle.variants.length).every(v => v.variant.availableForSale)\n ) || []\n\n const [firstAvailableBundle] = availableBundleList\n bundleVariant = checkedBundle || firstAvailableBundle\n\n const [firstAvailableGift] = giftList?.filter(gift => gift.availableForSale)\n giftVariant = checkedGift || firstAvailableGift\n\n const [firstAvailableExchange] = exchangeList?.filter(exchange => exchange.availableForSale)\n exchangeVariant = checkedExchangePurchase || firstAvailableExchange\n\n return { bundleVariant, giftVariant, exchangeVariant }\n}\n\nconst ProductBundleSummary = ({\n bundleOperation,\n bundleListItem,\n canOperate,\n status,\n}: {\n bundleOperation: (bundle?: BundleListItem) => void\n bundleListItem?: BundleListItem\n canOperate?: boolean\n status?: boolean\n}) => {\n const { locale = 'us' } = useAiuiContext()\n const { variant, setCheckedBundle } = useBizProductContext()\n const bundleVariants = bundleListItem?.variants.filter(v => v.variant.sku !== variant.sku)\n\n return (\n <div className=\"\">\n {bundleVariants?.map(bundleVariant => {\n return (\n <div className=\"flex items-center gap-4 justify-between\" key={bundleVariant.variant.id}>\n <div className=\"flex items-center gap-4\">\n <Picture\n source={bundleVariant?.variant?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] line-clamp-2 max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] desktop:text-[16px] lg-desktop:text-[18px]\"\n html={bundleVariant.variant.product.title}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-1 justify-center\">\n {!!bundleListItem && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: bundleVariant?.price || 0,\n locale,\n currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n })}\n />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: bundleVariant.variant.price.amount || 0,\n locale,\n currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedBundle?.(status ? undefined : bundleListItem)\n bundleOperation?.(bundleListItem)\n }}\n className=\"shrink-0 size-auto underline\"\n >\n {!!status ? 'Remove' : 'Add'}\n </Button>\n )}\n </div>\n </div>\n )\n })}\n </div>\n )\n}\n\nconst ProductGiftSummary = ({\n giftOperation,\n gift,\n status,\n canOperate,\n}: {\n giftOperation: (gift?: ProductVariant) => void\n gift?: ProductVariant\n status?: boolean\n canOperate?: boolean\n}) => {\n const { locale = 'us' } = useAiuiContext()\n const { freeGift, setCheckedGift } = useBizProductContext()\n const { freeLabel, count } = freeGift || {}\n\n return (\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={gift?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={gift?.product?.title}\n />\n <Text\n className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\"\n html={`x${count} | ${freeLabel}`}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-2 justify-center\">\n {!!gift && (\n <div className=\"flex items-center gap-1\">\n <Text className=\"text-base desktop:text-2xl font-bold\" html={freeLabel} />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: gift.price.amount,\n locale,\n currencyCode: gift.price.currencyCode,\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedGift?.(status ? undefined : gift)\n giftOperation(gift)\n }}\n className=\"shrink-0 size-auto underline\"\n >\n {status ? 'Remove' : 'Add'}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nconst ProductExchangeSummary = ({\n exchangeOperation,\n exchange,\n canOperate,\n status,\n}: {\n exchangeOperation: (exchange?: ProductVariant) => void\n exchange?: ProductVariant & { finalPrice?: ProductPrice }\n canOperate?: boolean\n status?: boolean\n}) => {\n const { locale = 'us' } = useAiuiContext()\n const { setCheckedExchangePurchase } = useBizProductContext()\n\n return (\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={exchange?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={exchange?.product?.title}\n />\n <Text className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\" />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-2 justify-center\">\n {!!exchange && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: exchange.finalPrice?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: exchange.price?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedExchangePurchase?.(status ? undefined : exchange)\n exchangeOperation(exchange)\n }}\n className=\"shrink-0 size-auto underline\"\n >\n {status ? 'Remove' : 'Add'}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nexport default ProductSummary\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "Text", "Button", "Grid", "GridItem", "Picture", "Heading", "useBizProductContext", "useEffect", "useMemo", "useState", "formatPrice", "useAiuiContext", "Decimal", "replaceTemplate", "ProductSummary", "locale", "copyWriting", "product", "variant", "finalPrice", "comparePrice", "coupon", "selectedOptions", "selectedVariants", "totalSavings", "onAddToCart", "onBuyNow", "savingDetail", "checkedBundle", "joinedRecommendBuyProducts", "setJoinedRecommendBuyProducts", "setCheckedGift", "setCheckedExchangePurchase", "setCheckedBundle", "setSavingDetail", "addToCartLoading", "buyNowLoading", "currentProductVariant", "summaryFinalPrice", "currentBundleVariant", "currentBundlePrice", "bundleVariant", "giftVariant", "exchangeVariant", "useRecommendBuyProducts", "initialRecommendBuyProducts", "setInitialRecommendBuyProducts", "
|
|
4
|
+
"sourcesContent": ["import { Text, Button, Container, Grid, GridItem, Picture, Heading } from '../../../../../components'\nimport type { ProductSummaryProps } from './types'\nimport { useBizProductContext } from '../../../BizProductProvider'\nimport { useEffect, useMemo, useState } from 'react'\nimport { formatPrice } from '../../../utils'\nimport { useAiuiContext } from '../../../../AiuiProvider'\nimport type { BundleListItem, ProductVariant, ProductPrice } from '../../../types/product'\nimport { cn } from '../../../../../helpers'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat'\n\nconst ProductSummary = ({}: ProductSummaryProps) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n const {\n product,\n variant,\n finalPrice,\n comparePrice,\n coupon,\n selectedOptions,\n selectedVariants,\n totalSavings,\n onAddToCart,\n onBuyNow,\n savingDetail,\n checkedBundle,\n joinedRecommendBuyProducts,\n setJoinedRecommendBuyProducts,\n setCheckedGift,\n setCheckedExchangePurchase,\n setCheckedBundle,\n setSavingDetail,\n addToCartLoading,\n buyNowLoading,\n profile,\n } = useBizProductContext()\n\n const [currentProductVariant] = selectedVariants\n\n const summaryFinalPrice = useMemo(() => {\n const currentBundleVariant = checkedBundle?.variants.find(v => v.variant.sku === currentProductVariant?.sku)\n const currentBundlePrice = new Decimal(currentProductVariant?.price?.amount || 0)\n .minus(currentBundleVariant?.price || currentProductVariant?.price?.amount)\n .toNumber()\n let currentProductPrice = new Decimal(currentProductVariant?.price?.amount || 0)\n if (!!profile?.email) {\n currentProductPrice = currentProductPrice.minus(savingDetail?.member || 0)\n }\n currentProductPrice.minus(savingDetail?.coupon).minus(currentBundlePrice).toNumber()\n return currentProductPrice.toNumber()\n }, [currentProductVariant, totalSavings, checkedBundle, profile])\n\n const isAvailable = variant.availableForSale\n if (!isAvailable) return null\n\n const { bundleVariant, giftVariant, exchangeVariant } = useRecommendBuyProducts() || {}\n const [initialRecommendBuyProducts, setInitialRecommendBuyProducts] = useState<{\n bundle?: BundleListItem\n gift?: ProductVariant\n exchange?: ProductVariant\n }>()\n\n useEffect(() => {\n setInitialRecommendBuyProducts({\n bundle: joinedRecommendBuyProducts.bundle?.value ? undefined : bundleVariant,\n gift: joinedRecommendBuyProducts.gift?.value ? undefined : giftVariant,\n exchange: joinedRecommendBuyProducts.exchange?.value ? undefined : exchangeVariant,\n })\n }, [bundleVariant, giftVariant, exchangeVariant, joinedRecommendBuyProducts])\n\n return (\n <div className=\"ipc-product-summary laptop:px-16 desktop:px-0 mt-16 desktop:mt-[96px] lg-desktop:mt-[128px]\">\n <div className=\"bg-[#F5F5F7] laptop:rounded-2xl\">\n <Grid className=\"px-4 pt-6 tablet:p-8 tablet:!pb-0\">\n <GridItem className=\"col-span-12 laptop:col-start-1 laptop:col-span-5 gap-4 flex flex-col justify-between\">\n <Heading\n className=\"font-bold text-[24px] lg-desktop:text-[48px] laptop:text-[32px] desktop:text-[40px] leading-[1] mb-4 [&>span]:text-[#D1D1D1]\"\n html={`${product.title} is ready <br/><span>Just the way you want it.</span>`}\n />\n <div className=\"\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"lg-desktop:aspect-[644/368] desktop:aspect-[503/272] laptop:aspect-[331/191] tablet:aspect-[704/380] aspect-[358/192]\"\n imgClassName=\"object-cover h-full\"\n />\n </div>\n </GridItem>\n <GridItem className=\"col-span-12 mt-8 pb-6 tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 flex flex-col gap-6 justify-between\">\n <div>\n <div className=\"flex flex-col gap-4\">\n <div className=\"flex items-center justify-between\">\n <div className=\"shrink-0 flex items-center gap-4\">\n <Picture\n source={variant.image?.url || product?.images?.[0]?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={product.title}\n />\n <Text\n className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\"\n html={`x1 | ${selectedOptions.color || selectedOptions.colour || selectedOptions.couleur}`}\n />\n </div>\n </div>\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: summaryFinalPrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n {totalSavings > 0 && (\n <Text\n className=\"text-base desktop:text-2xl laptop:text-xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: variant?.price?.amount,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n </div>\n </div>\n {joinedRecommendBuyProducts?.gift?.value && (\n <ProductGiftSummary\n giftOperation={gift => {\n setCheckedGift?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n gift: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift })\n }}\n status={!!joinedRecommendBuyProducts?.gift}\n gift={joinedRecommendBuyProducts?.gift?.value}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n />\n )}\n {joinedRecommendBuyProducts?.bundle?.value && (\n <ProductBundleSummary\n bundleOperation={bundle => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n bundle: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle })\n }}\n status={!!joinedRecommendBuyProducts?.bundle}\n bundleListItem={joinedRecommendBuyProducts?.bundle?.value}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n />\n )}\n {joinedRecommendBuyProducts?.exchange?.value && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setCheckedExchangePurchase?.(undefined)\n setJoinedRecommendBuyProducts?.({\n ...joinedRecommendBuyProducts,\n exchange: {\n value: undefined,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange })\n }}\n status={!!joinedRecommendBuyProducts?.exchange}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n exchange={joinedRecommendBuyProducts?.exchange?.value}\n />\n )}\n </div>\n {(initialRecommendBuyProducts?.bundle ||\n initialRecommendBuyProducts?.gift ||\n initialRecommendBuyProducts?.exchange) && (\n <div className=\"mt-6\">\n <Text className=\"text-sm desktop:text-[18px] font-bold\" html={'Recommend Buy'} />\n <div className=\"flex flex-col gap-6 mt-6\">\n {initialRecommendBuyProducts?.exchange && (\n <ProductExchangeSummary\n exchangeOperation={exchange => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n gift: {\n value: joinedRecommendBuyProducts?.gift?.value,\n canOperate: true,\n },\n exchange: {\n value: exchange,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, exchange: undefined })\n }}\n canOperate={joinedRecommendBuyProducts?.exchange?.canOperate}\n status={!initialRecommendBuyProducts?.exchange}\n exchange={initialRecommendBuyProducts?.exchange}\n />\n )}\n {initialRecommendBuyProducts?.bundle && (\n <ProductBundleSummary\n bundleOperation={bundle => {\n setCheckedGift?.(undefined)\n setCheckedExchangePurchase?.(undefined)\n setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n setJoinedRecommendBuyProducts?.({\n gift: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: undefined,\n canOperate: true,\n },\n bundle: {\n value: bundle,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, bundle: undefined })\n }}\n canOperate={joinedRecommendBuyProducts?.bundle?.canOperate}\n status={!initialRecommendBuyProducts?.bundle}\n bundleListItem={initialRecommendBuyProducts?.bundle}\n />\n )}\n {initialRecommendBuyProducts?.gift && (\n <ProductGiftSummary\n giftOperation={gift => {\n setCheckedBundle?.(undefined)\n setJoinedRecommendBuyProducts?.({\n bundle: {\n value: undefined,\n canOperate: true,\n },\n exchange: {\n value: joinedRecommendBuyProducts?.exchange?.value,\n canOperate: true,\n },\n gift: {\n value: gift,\n canOperate: true,\n },\n })\n setInitialRecommendBuyProducts?.({ ...initialRecommendBuyProducts, gift: undefined })\n }}\n canOperate={joinedRecommendBuyProducts?.gift?.canOperate}\n status={!initialRecommendBuyProducts?.gift}\n gift={initialRecommendBuyProducts?.gift}\n />\n )}\n </div>\n </div>\n )}\n </div>\n <div className=\"text-right\">\n <Text\n className=\"laptop:text-xl desktop:text-2xl font-bold text-right\"\n html={`${replaceTemplate(copyWriting?.totalPrice || '', { amount: formatPrice({ amount: finalPrice, currencyCode: variant.price.currencyCode, locale }) })}`}\n />\n\n {totalSavings > 0 && (\n <Text\n className=\"text-base laptop:text-xl desktop:text-2xl ml-1 font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: comparePrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n <div className=\"flex gap-3 mt-2 justify-end\">\n <Button\n size=\"lg\"\n variant=\"secondary\"\n loading={addToCartLoading}\n className=\"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto\"\n onClick={() => onAddToCart?.()}\n >\n {copyWriting?.addToCart}\n </Button>\n <Button\n size=\"lg\"\n loading={buyNowLoading}\n variant=\"primary\"\n className=\"w-1/2 tablet:w-auto laptop:w-1/2 desktop:w-auto\"\n onClick={() => onBuyNow?.()}\n >\n {copyWriting?.shopNow}\n </Button>\n </div>\n </div>\n </GridItem>\n </Grid>\n </div>\n </div>\n )\n}\n\nconst useRecommendBuyProducts = () => {\n const { bundle, variant, checkedBundle, freeGift, checkedGift, exchangePurchase, checkedExchangePurchase } =\n useBizProductContext()\n let bundleVariant = undefined\n let giftVariant = undefined\n let exchangeVariant = undefined\n const { bundleList } = bundle || {}\n\n const { giftList = [] } = freeGift || {}\n const { giftList: exchangeList = [] } = exchangePurchase || {}\n\n const availableBundleList =\n bundleList?.filter(bundle =>\n bundle.variants.slice(1, bundle.variants.length).every(v => v.variant.availableForSale)\n ) || []\n\n const [firstAvailableBundle] = availableBundleList\n bundleVariant = checkedBundle || firstAvailableBundle\n\n const [firstAvailableGift] = giftList?.filter(gift => gift.availableForSale)\n giftVariant = checkedGift || firstAvailableGift\n\n const [firstAvailableExchange] = exchangeList?.filter(exchange => exchange.availableForSale)\n exchangeVariant = checkedExchangePurchase || firstAvailableExchange\n\n return { bundleVariant, giftVariant, exchangeVariant }\n}\n\nconst ProductBundleSummary = ({\n bundleOperation,\n bundleListItem,\n canOperate,\n status,\n}: {\n bundleOperation: (bundle?: BundleListItem) => void\n bundleListItem?: BundleListItem\n canOperate?: boolean\n status?: boolean\n}) => {\n const { locale = 'us' } = useAiuiContext()\n const { variant, setCheckedBundle } = useBizProductContext()\n const bundleVariants = bundleListItem?.variants.filter(v => v.variant.sku !== variant.sku)\n\n return (\n <div className=\"\">\n {bundleVariants?.map(bundleVariant => {\n return (\n <div className=\"flex items-center gap-4 justify-between\" key={bundleVariant.variant.id}>\n <div className=\"flex items-center gap-4\">\n <Picture\n source={bundleVariant?.variant?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] line-clamp-2 max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] desktop:text-[16px] lg-desktop:text-[18px]\"\n html={bundleVariant.variant.product.title}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-1 justify-center\">\n {!!bundleListItem && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: bundleVariant?.price || 0,\n locale,\n currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n })}\n />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: bundleVariant.variant.price.amount || 0,\n locale,\n currencyCode: bundleVariant.variant?.price?.currencyCode || '',\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedBundle?.(status ? undefined : bundleListItem)\n bundleOperation?.(bundleListItem)\n }}\n className=\"shrink-0 size-auto underline\"\n >\n {!!status ? 'Remove' : 'Add'}\n </Button>\n )}\n </div>\n </div>\n )\n })}\n </div>\n )\n}\n\nconst ProductGiftSummary = ({\n giftOperation,\n gift,\n status,\n canOperate,\n}: {\n giftOperation: (gift?: ProductVariant) => void\n gift?: ProductVariant\n status?: boolean\n canOperate?: boolean\n}) => {\n const { locale = 'us' } = useAiuiContext()\n const { freeGift, setCheckedGift } = useBizProductContext()\n const { freeLabel, count } = freeGift || {}\n\n return (\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={gift?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={gift?.product?.title}\n />\n <Text\n className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\"\n html={`x${count} | ${freeLabel}`}\n />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-2 justify-center\">\n {!!gift && (\n <div className=\"flex items-center gap-1\">\n <Text className=\"text-base desktop:text-2xl font-bold\" html={freeLabel} />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: gift.price.amount,\n locale,\n currencyCode: gift.price.currencyCode,\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedGift?.(status ? undefined : gift)\n giftOperation(gift)\n }}\n className=\"shrink-0 size-auto underline\"\n >\n {status ? 'Remove' : 'Add'}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nconst ProductExchangeSummary = ({\n exchangeOperation,\n exchange,\n canOperate,\n status,\n}: {\n exchangeOperation: (exchange?: ProductVariant) => void\n exchange?: ProductVariant & { finalPrice?: ProductPrice }\n canOperate?: boolean\n status?: boolean\n}) => {\n const { locale = 'us' } = useAiuiContext()\n const { setCheckedExchangePurchase } = useBizProductContext()\n\n return (\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n <Picture\n source={exchange?.image?.url}\n className=\"size-10 laptop:size-12 p-2 lg-desktop:size-16 object-cover border-1 border-[#E4E5E6] bg-[#EAEAEC] rounded-[5px] rounded-lg\"\n />\n <div className=\"flex flex-col gap-[6px] max-w-[178px] tablet:max-w-none\">\n <Text\n className=\"font-bold text-[14px] line-clamp-2 desktop:text-[16px] lg-desktop:text-[18px]\"\n html={exchange?.product?.title}\n />\n <Text className=\"text-[12px] laptop:text-[14px] desktop:text-[18px] font-bold text-[#6D6D6F]\" />\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-2 justify-center\">\n {!!exchange && (\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-base desktop:text-2xl font-bold\"\n html={formatPrice({\n amount: exchange.finalPrice?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n <Text\n className=\"text-base desktop:text-2xl font-bold line-through text-[#6D6D6F]\"\n html={formatPrice({\n amount: exchange.price?.amount || 0,\n locale,\n currencyCode: exchange.price.currencyCode,\n })}\n />\n </div>\n )}\n {canOperate && (\n <Button\n size=\"icon\"\n variant=\"link\"\n onClick={() => {\n setCheckedExchangePurchase?.(status ? undefined : exchange)\n exchangeOperation(exchange)\n }}\n className=\"shrink-0 size-auto underline\"\n >\n {status ? 'Remove' : 'Add'}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nexport default ProductSummary\n"],
|
|
5
|
+
"mappings": "AA0EU,OACE,OAAAA,EADF,QAAAC,MAAA,oBA1EV,OAAS,QAAAC,EAAM,UAAAC,EAAmB,QAAAC,EAAM,YAAAC,EAAU,WAAAC,EAAS,WAAAC,MAAe,4BAE1E,OAAS,wBAAAC,MAA4B,8BACrC,OAAS,aAAAC,EAAW,WAAAC,EAAS,YAAAC,MAAgB,QAC7C,OAAS,eAAAC,MAAmB,iBAC5B,OAAS,kBAAAC,MAAsB,2BAE/B,MAAmB,yBACnB,OAAOC,MAAa,aACpB,OAAS,mBAAAC,MAAuB,4BAEhC,MAAMC,EAAiB,CAAC,CAAC,IAA2B,CAClD,KAAM,CAAE,OAAAC,EAAS,KAAM,YAAAC,CAAY,EAAIL,EAAe,EAChD,CACJ,QAAAM,EACA,QAAAC,EACA,WAAAC,EACA,aAAAC,EACA,OAAAC,EACA,gBAAAC,EACA,iBAAAC,EACA,aAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,cAAAC,EACA,2BAAAC,EACA,8BAAAC,EACA,eAAAC,EACA,2BAAAC,EACA,iBAAAC,EACA,gBAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,QAAAC,CACF,EAAI/B,EAAqB,EAEnB,CAACgC,CAAqB,EAAIf,EAE1BgB,EAAoB/B,EAAQ,IAAM,CACtC,MAAMgC,EAAuBZ,GAAe,SAAS,KAAKa,GAAKA,EAAE,QAAQ,MAAQH,GAAuB,GAAG,EACrGI,EAAqB,IAAI9B,EAAQ0B,GAAuB,OAAO,QAAU,CAAC,EAC7E,MAAME,GAAsB,OAASF,GAAuB,OAAO,MAAM,EACzE,SAAS,EACZ,IAAIK,EAAsB,IAAI/B,EAAQ0B,GAAuB,OAAO,QAAU,CAAC,EAC/E,OAAMD,GAAS,QACbM,EAAsBA,EAAoB,MAAMhB,GAAc,QAAU,CAAC,GAE3EgB,EAAoB,MAAMhB,GAAc,MAAM,EAAE,MAAMe,CAAkB,EAAE,SAAS,EAC5EC,EAAoB,SAAS,CACtC,EAAG,CAACL,EAAuBd,EAAcI,EAAeS,CAAO,CAAC,EAGhE,GAAI,CADgBnB,EAAQ,iBACV,OAAO,KAEzB,KAAM,CAAE,cAAA0B,EAAe,YAAAC,EAAa,gBAAAC,CAAgB,EAAIC,GAAwB,GAAK,CAAC,EAChF,CAACC,EAA6BC,CAA8B,EAAIxC,EAInE,EAEH,OAAAF,EAAU,IAAM,CACd0C,EAA+B,CAC7B,OAAQpB,EAA2B,QAAQ,MAAQ,OAAYe,EAC/D,KAAMf,EAA2B,MAAM,MAAQ,OAAYgB,EAC3D,SAAUhB,EAA2B,UAAU,MAAQ,OAAYiB,CACrE,CAAC,CACH,EAAG,CAACF,EAAeC,EAAaC,EAAiBjB,CAA0B,CAAC,EAG1E/B,EAAC,OAAI,UAAU,8FACb,SAAAA,EAAC,OAAI,UAAU,kCACb,SAAAC,EAACG,EAAA,CAAK,UAAU,oCACd,UAAAH,EAACI,EAAA,CAAS,UAAU,uFAClB,UAAAL,EAACO,EAAA,CACC,UAAU,+HACV,KAAM,GAAGY,EAAQ,KAAK,wDACxB,EACAnB,EAAC,OAAI,UAAU,GACb,SAAAA,EAACM,EAAA,CACC,OAAQc,EAAQ,OAAO,KAAOD,GAAS,SAAS,CAAC,GAAG,IACpD,UAAU,wHACV,aAAa,sBACf,EACF,GACF,EACAlB,EAACI,EAAA,CAAS,UAAU,yHAClB,UAAAJ,EAAC,OACC,UAAAA,EAAC,OAAI,UAAU,sBACb,UAAAA,EAAC,OAAI,UAAU,oCACb,UAAAA,EAAC,OAAI,UAAU,mCACb,UAAAD,EAACM,EAAA,CACC,OAAQc,EAAQ,OAAO,KAAOD,GAAS,SAAS,CAAC,GAAG,IACpD,UAAU,6HACZ,EACAlB,EAAC,OAAI,UAAU,0DACb,UAAAD,EAACE,EAAA,CACC,UAAU,gFACV,KAAMiB,EAAQ,MAChB,EACAnB,EAACE,EAAA,CACC,UAAU,8EACV,KAAM,QAAQsB,EAAgB,OAASA,EAAgB,QAAUA,EAAgB,OAAO,GAC1F,GACF,GACF,EACAvB,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACE,EAAA,CACC,UAAU,uCACV,KAAMU,EAAY,CAChB,OAAQ6B,EACR,aAAcrB,EAAQ,MAAM,aAC5B,OAAAH,CACF,CAAC,EACH,EACCS,EAAe,GACd1B,EAACE,EAAA,CACC,UAAU,kFACV,KAAMU,EAAY,CAChB,OAAQQ,GAAS,OAAO,OACxB,aAAcA,EAAQ,MAAM,aAC5B,OAAAH,CACF,CAAC,EACH,GAEJ,GACF,EACCc,GAA4B,MAAM,OACjC/B,EAACoD,EAAA,CACC,cAAeC,GAAQ,CACrBpB,IAAiB,MAAS,EAC1BD,IAAgC,CAC9B,GAAGD,EACH,KAAM,CACJ,MAAO,OACP,WAAY,EACd,CACF,CAAC,EACDoB,IAAiC,CAAE,GAAGD,EAA6B,KAAAG,CAAK,CAAC,CAC3E,EACA,OAAQ,CAAC,CAACtB,GAA4B,KACtC,KAAMA,GAA4B,MAAM,MACxC,WAAYA,GAA4B,MAAM,WAChD,EAEDA,GAA4B,QAAQ,OACnC/B,EAACsD,EAAA,CACC,gBAAiBC,GAAU,CACzBpB,IAAmB,MAAS,EAC5BH,IAAgC,CAC9B,GAAGD,EACH,OAAQ,CACN,MAAO,OACP,WAAY,EACd,CACF,CAAC,EACDoB,IAAiC,CAAE,GAAGD,EAA6B,OAAAK,CAAO,CAAC,CAC7E,EACA,OAAQ,CAAC,CAACxB,GAA4B,OACtC,eAAgBA,GAA4B,QAAQ,MACpD,WAAYA,GAA4B,QAAQ,WAClD,EAEDA,GAA4B,UAAU,OACrC/B,EAACwD,EAAA,CACC,kBAAmBC,GAAY,CAC7BvB,IAA6B,MAAS,EACtCF,IAAgC,CAC9B,GAAGD,EACH,SAAU,CACR,MAAO,OACP,WAAY,EACd,CACF,CAAC,EACDoB,IAAiC,CAAE,GAAGD,EAA6B,SAAAO,CAAS,CAAC,CAC/E,EACA,OAAQ,CAAC,CAAC1B,GAA4B,SACtC,WAAYA,GAA4B,UAAU,WAClD,SAAUA,GAA4B,UAAU,MAClD,GAEJ,GACEmB,GAA6B,QAC7BA,GAA6B,MAC7BA,GAA6B,WAC7BjD,EAAC,OAAI,UAAU,OACb,UAAAD,EAACE,EAAA,CAAK,UAAU,wCAAwC,KAAM,gBAAiB,EAC/ED,EAAC,OAAI,UAAU,2BACZ,UAAAiD,GAA6B,UAC5BlD,EAACwD,EAAA,CACC,kBAAmBC,GAAY,CAC7BtB,IAAmB,MAAS,EAC5BH,IAAgC,CAC9B,OAAQ,CACN,MAAO,OACP,WAAY,EACd,EACA,KAAM,CACJ,MAAOD,GAA4B,MAAM,MACzC,WAAY,EACd,EACA,SAAU,CACR,MAAO0B,EACP,WAAY,EACd,CACF,CAAC,EACDN,IAAiC,CAAE,GAAGD,EAA6B,SAAU,MAAU,CAAC,CAC1F,EACA,WAAYnB,GAA4B,UAAU,WAClD,OAAQ,CAACmB,GAA6B,SACtC,SAAUA,GAA6B,SACzC,EAEDA,GAA6B,QAC5BlD,EAACsD,EAAA,CACC,gBAAiBC,GAAU,CACzBtB,IAAiB,MAAS,EAC1BC,IAA6B,MAAS,EACtCE,IAAkB,CAAE,GAAGP,EAAc,iBAAkB,CAAE,CAAC,EAC1DG,IAAgC,CAC9B,KAAM,CACJ,MAAO,OACP,WAAY,EACd,EACA,SAAU,CACR,MAAO,OACP,WAAY,EACd,EACA,OAAQ,CACN,MAAOuB,EACP,WAAY,EACd,CACF,CAAC,EACDJ,IAAiC,CAAE,GAAGD,EAA6B,OAAQ,MAAU,CAAC,CACxF,EACA,WAAYnB,GAA4B,QAAQ,WAChD,OAAQ,CAACmB,GAA6B,OACtC,eAAgBA,GAA6B,OAC/C,EAEDA,GAA6B,MAC5BlD,EAACoD,EAAA,CACC,cAAeC,GAAQ,CACrBlB,IAAmB,MAAS,EAC5BH,IAAgC,CAC9B,OAAQ,CACN,MAAO,OACP,WAAY,EACd,EACA,SAAU,CACR,MAAOD,GAA4B,UAAU,MAC7C,WAAY,EACd,EACA,KAAM,CACJ,MAAOsB,EACP,WAAY,EACd,CACF,CAAC,EACDF,IAAiC,CAAE,GAAGD,EAA6B,KAAM,MAAU,CAAC,CACtF,EACA,WAAYnB,GAA4B,MAAM,WAC9C,OAAQ,CAACmB,GAA6B,KACtC,KAAMA,GAA6B,KACrC,GAEJ,GACF,GAEJ,EACAjD,EAAC,OAAI,UAAU,aACb,UAAAD,EAACE,EAAA,CACC,UAAU,uDACV,KAAM,GAAGa,EAAgBG,GAAa,YAAc,GAAI,CAAE,OAAQN,EAAY,CAAE,OAAQS,EAAY,aAAcD,EAAQ,MAAM,aAAc,OAAAH,CAAO,CAAC,CAAE,CAAC,CAAC,GAC5J,EAECS,EAAe,GACd1B,EAACE,EAAA,CACC,UAAU,uFACV,KAAMU,EAAY,CAChB,OAAQU,EACR,aAAcF,EAAQ,MAAM,aAC5B,OAAAH,CACF,CAAC,EACH,EAEFhB,EAAC,OAAI,UAAU,8BACb,UAAAD,EAACG,EAAA,CACC,KAAK,KACL,QAAQ,YACR,QAASkC,EACT,UAAU,kDACV,QAAS,IAAMV,IAAc,EAE5B,SAAAT,GAAa,UAChB,EACAlB,EAACG,EAAA,CACC,KAAK,KACL,QAASmC,EACT,QAAQ,UACR,UAAU,kDACV,QAAS,IAAMV,IAAW,EAEzB,SAAAV,GAAa,QAChB,GACF,GACF,GACF,GACF,EACF,EACF,CAEJ,EAEM+B,GAA0B,IAAM,CACpC,KAAM,CAAE,OAAAM,EAAQ,QAAAnC,EAAS,cAAAU,EAAe,SAAA4B,EAAU,YAAAC,EAAa,iBAAAC,EAAkB,wBAAAC,CAAwB,EACvGrD,EAAqB,EACvB,IAAIsC,EACAC,EACAC,EACJ,KAAM,CAAE,WAAAc,CAAW,EAAIP,GAAU,CAAC,EAE5B,CAAE,SAAAQ,EAAW,CAAC,CAAE,EAAIL,GAAY,CAAC,EACjC,CAAE,SAAUM,EAAe,CAAC,CAAE,EAAIJ,GAAoB,CAAC,EAEvDK,EACJH,GAAY,OAAOP,GACjBA,EAAO,SAAS,MAAM,EAAGA,EAAO,SAAS,MAAM,EAAE,MAAMZ,GAAKA,EAAE,QAAQ,gBAAgB,CACxF,GAAK,CAAC,EAEF,CAACuB,CAAoB,EAAID,EAC/BnB,EAAgBhB,GAAiBoC,EAEjC,KAAM,CAACC,CAAkB,EAAIJ,GAAU,OAAOV,GAAQA,EAAK,gBAAgB,EAC3EN,EAAcY,GAAeQ,EAE7B,KAAM,CAACC,CAAsB,EAAIJ,GAAc,OAAOP,GAAYA,EAAS,gBAAgB,EAC3F,OAAAT,EAAkBa,GAA2BO,EAEtC,CAAE,cAAAtB,EAAe,YAAAC,EAAa,gBAAAC,CAAgB,CACvD,EAEMM,EAAuB,CAAC,CAC5B,gBAAAe,EACA,eAAAC,EACA,WAAAC,EACA,OAAAC,CACF,IAKM,CACJ,KAAM,CAAE,OAAAvD,EAAS,IAAK,EAAIJ,EAAe,EACnC,CAAE,QAAAO,EAAS,iBAAAe,CAAiB,EAAI3B,EAAqB,EACrDiE,EAAiBH,GAAgB,SAAS,OAAO3B,GAAKA,EAAE,QAAQ,MAAQvB,EAAQ,GAAG,EAEzF,OACEpB,EAAC,OAAI,UAAU,GACZ,SAAAyE,GAAgB,IAAI3B,GAEjB7C,EAAC,OAAI,UAAU,0CACb,UAAAA,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACM,EAAA,CACC,OAAQwC,GAAe,SAAS,OAAO,IACvC,UAAU,6HACZ,EACA9C,EAAC,OAAI,UAAU,uEACb,SAAAA,EAACE,EAAA,CACC,UAAU,mEACV,KAAM4C,EAAc,QAAQ,QAAQ,MACtC,EACF,GACF,EACA7C,EAAC,OAAI,UAAU,+CACZ,WAAC,CAACqE,GACDrE,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACE,EAAA,CACC,UAAU,uCACV,KAAMU,EAAY,CAChB,OAAQkC,GAAe,OAAS,EAChC,OAAA7B,EACA,aAAc6B,EAAc,SAAS,OAAO,cAAgB,EAC9D,CAAC,EACH,EACA9C,EAACE,EAAA,CACC,UAAU,mEACV,KAAMU,EAAY,CAChB,OAAQkC,EAAc,QAAQ,MAAM,QAAU,EAC9C,OAAA7B,EACA,aAAc6B,EAAc,SAAS,OAAO,cAAgB,EAC9D,CAAC,EACH,GACF,EAEDyB,GACCvE,EAACG,EAAA,CACC,KAAK,OACL,QAAQ,OACR,QAAS,IAAM,CACbgC,IAAmBqC,EAAS,OAAYF,CAAc,EACtDD,IAAkBC,CAAc,CAClC,EACA,UAAU,+BAET,SAAEE,EAAS,SAAW,MACzB,GAEJ,IA/C4D1B,EAAc,QAAQ,EAgDpF,CAEH,EACH,CAEJ,EAEMM,EAAqB,CAAC,CAC1B,cAAAsB,EACA,KAAArB,EACA,OAAAmB,EACA,WAAAD,CACF,IAKM,CACJ,KAAM,CAAE,OAAAtD,EAAS,IAAK,EAAIJ,EAAe,EACnC,CAAE,SAAA6C,EAAU,eAAAzB,CAAe,EAAIzB,EAAqB,EACpD,CAAE,UAAAmE,EAAW,MAAAC,CAAM,EAAIlB,GAAY,CAAC,EAE1C,OACEzD,EAAC,OAAI,UAAU,oCACb,UAAAA,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACM,EAAA,CACC,OAAQ+C,GAAM,OAAO,IACrB,UAAU,6HACZ,EACApD,EAAC,OAAI,UAAU,0DACb,UAAAD,EAACE,EAAA,CACC,UAAU,gFACV,KAAMmD,GAAM,SAAS,MACvB,EACArD,EAACE,EAAA,CACC,UAAU,8EACV,KAAM,IAAI0E,CAAK,MAAMD,CAAS,GAChC,GACF,GACF,EACA1E,EAAC,OAAI,UAAU,+CACZ,WAAC,CAACoD,GACDpD,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACE,EAAA,CAAK,UAAU,uCAAuC,KAAMyE,EAAW,EACxE3E,EAACE,EAAA,CACC,UAAU,mEACV,KAAMU,EAAY,CAChB,OAAQyC,EAAK,MAAM,OACnB,OAAApC,EACA,aAAcoC,EAAK,MAAM,YAC3B,CAAC,EACH,GACF,EAEDkB,GACCvE,EAACG,EAAA,CACC,KAAK,OACL,QAAQ,OACR,QAAS,IAAM,CACb8B,IAAiBuC,EAAS,OAAYnB,CAAI,EAC1CqB,EAAcrB,CAAI,CACpB,EACA,UAAU,+BAET,SAAAmB,EAAS,SAAW,MACvB,GAEJ,GACF,CAEJ,EAEMhB,EAAyB,CAAC,CAC9B,kBAAAqB,EACA,SAAApB,EACA,WAAAc,EACA,OAAAC,CACF,IAKM,CACJ,KAAM,CAAE,OAAAvD,EAAS,IAAK,EAAIJ,EAAe,EACnC,CAAE,2BAAAqB,CAA2B,EAAI1B,EAAqB,EAE5D,OACEP,EAAC,OAAI,UAAU,oCACb,UAAAA,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACM,EAAA,CACC,OAAQmD,GAAU,OAAO,IACzB,UAAU,6HACZ,EACAxD,EAAC,OAAI,UAAU,0DACb,UAAAD,EAACE,EAAA,CACC,UAAU,gFACV,KAAMuD,GAAU,SAAS,MAC3B,EACAzD,EAACE,EAAA,CAAK,UAAU,8EAA8E,GAChG,GACF,EACAD,EAAC,OAAI,UAAU,+CACZ,WAAC,CAACwD,GACDxD,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACE,EAAA,CACC,UAAU,uCACV,KAAMU,EAAY,CAChB,OAAQ6C,EAAS,YAAY,QAAU,EACvC,OAAAxC,EACA,aAAcwC,EAAS,MAAM,YAC/B,CAAC,EACH,EACAzD,EAACE,EAAA,CACC,UAAU,mEACV,KAAMU,EAAY,CAChB,OAAQ6C,EAAS,OAAO,QAAU,EAClC,OAAAxC,EACA,aAAcwC,EAAS,MAAM,YAC/B,CAAC,EACH,GACF,EAEDc,GACCvE,EAACG,EAAA,CACC,KAAK,OACL,QAAQ,OACR,QAAS,IAAM,CACb+B,IAA6BsC,EAAS,OAAYf,CAAQ,EAC1DoB,EAAkBpB,CAAQ,CAC5B,EACA,UAAU,+BAET,SAAAe,EAAS,SAAW,MACvB,GAEJ,GACF,CAEJ,EAEA,IAAOM,GAAQ9D",
|
|
6
|
+
"names": ["jsx", "jsxs", "Text", "Button", "Grid", "GridItem", "Picture", "Heading", "useBizProductContext", "useEffect", "useMemo", "useState", "formatPrice", "useAiuiContext", "Decimal", "replaceTemplate", "ProductSummary", "locale", "copyWriting", "product", "variant", "finalPrice", "comparePrice", "coupon", "selectedOptions", "selectedVariants", "totalSavings", "onAddToCart", "onBuyNow", "savingDetail", "checkedBundle", "joinedRecommendBuyProducts", "setJoinedRecommendBuyProducts", "setCheckedGift", "setCheckedExchangePurchase", "setCheckedBundle", "setSavingDetail", "addToCartLoading", "buyNowLoading", "profile", "currentProductVariant", "summaryFinalPrice", "currentBundleVariant", "v", "currentBundlePrice", "currentProductPrice", "bundleVariant", "giftVariant", "exchangeVariant", "useRecommendBuyProducts", "initialRecommendBuyProducts", "setInitialRecommendBuyProducts", "ProductGiftSummary", "gift", "ProductBundleSummary", "bundle", "ProductExchangeSummary", "exchange", "freeGift", "checkedGift", "exchangePurchase", "checkedExchangePurchase", "bundleList", "giftList", "exchangeList", "availableBundleList", "firstAvailableBundle", "firstAvailableGift", "firstAvailableExchange", "bundleOperation", "bundleListItem", "canOperate", "status", "bundleVariants", "giftOperation", "freeLabel", "count", "exchangeOperation", "ProductSummary_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as a,jsxs as c}from"react/jsx-runtime";import{Text as i,Button as
|
|
1
|
+
import{jsx as a,jsxs as c}from"react/jsx-runtime";import{Text as i,Button as d}from"../../../../../components";import{useAiuiContext as S}from"../../../../AiuiProvider/index.js";import{useBizProductContext as w}from"../../../BizProductProvider.js";import{useMemo as u}from"react";import{formatPrice as n}from"../../../utils";import"decimal.js";import{replaceTemplate as p}from"../../../utils/textFormat";const h=()=>{const{copyWriting:t,locale:o="us"}=S(),{variant:e,finalPrice:x,totalSavings:l,memberFunctionResult:s,isLogin:m,comparePrice:b,onAddToCart:g,onBuyNow:v,savingDetail:k,coupon:T,addToCartLoading:f,buyNowLoading:C}=w(),r=Math.max(s?.withCouponMemberTotalSave??0,s?.withoutCouponMaxMemberTotalSave??0),y=u(()=>p(t?.totalSavings||"",{amount:n({amount:l,currencyCode:e.price.currencyCode,locale:o})}),[t?.totalSavings,l,e.price.currencyCode,o]),N=u(()=>p(t?.memberSaving||"",{amount:n({amount:r,currencyCode:e.price.currencyCode,locale:o})}),[t?.memberSaving,r,e.price.currencyCode,o]);return c("div",{className:"bg-white py-3 px-4 tablet:p-0 tablet:flex tablet:items-center tablet:gap-4",children:[e.availableForSale?c("div",{className:"flex items-center justify-between tablet:flex-col desktop:items-end",children:[c("div",{className:"flex items-center gap-1",children:[a(i,{className:"text-xl font-bold !leading-[1.2] desktop:text-xl lg-desktop:text-2xl",html:n({amount:x,currencyCode:e.price.currencyCode,locale:o})}),(l>0||r>0&&m)&&a(i,{className:"text-xl font-bold line-through text-[#999] !leading-[1.2] desktop:text-xl lg-desktop:text-2xl",html:n({amount:b,currencyCode:e.price.currencyCode,locale:o})})]}),(l>0||r>0&&m)&&a(i,{className:"text-brand-0 text-base !leading-[1.2] font-bold desktop:text-xl lg-desktop:text-2xl",html:`${r>0&&m?N:y}`})]}):a(i,{className:"text-[20px] font-bold text-[#999999]",html:t?.soldOut??"Sold Out"}),c("div",{className:"flex items-center gap-2 mt-2 tablet:mt-0",children:[a(d,{variant:"secondary",disabled:!e.availableForSale,size:"lg",className:"w-1/2 tablet:w-auto",onClick:()=>g?.(),loading:f,children:t?.addToCart??"Add to Cart"}),a(d,{variant:"primary",disabled:!e.availableForSale,size:"lg",loading:C,className:"w-1/2 tablet:w-auto",onClick:()=>v?.(),children:t?.buyNow??"Buy Now"})]})]})};var O=h;export{O as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../src/biz-components/Listing/components/PurchaseBar/ProductActions/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Text, Button } from '../../../../../components'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useMemo } from 'react'\nimport { formatPrice } from '../../../utils'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat'\n\nconst ProductActions = () => {\n const { copyWriting, locale = 'us' } = useAiuiContext()\n const {\n variant,\n finalPrice,\n totalSavings,\n memberFunctionResult,\n isLogin,\n comparePrice,\n onAddToCart,\n onBuyNow,\n savingDetail,\n coupon,\n addToCartLoading,\n buyNowLoading,\n } = useBizProductContext()\n\n const
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "Text", "Button", "useAiuiContext", "useBizProductContext", "useMemo", "formatPrice", "
|
|
4
|
+
"sourcesContent": ["import { Text, Button } from '../../../../../components'\nimport { useAiuiContext } from '../../../../AiuiProvider/index.js'\nimport { useBizProductContext } from '../../../BizProductProvider.js'\nimport { useMemo } from 'react'\nimport { formatPrice } from '../../../utils'\nimport Decimal from 'decimal.js'\nimport { replaceTemplate } from '../../../utils/textFormat'\n\nconst ProductActions = () => {\n const { copyWriting, locale = 'us' } = useAiuiContext()\n const {\n variant,\n finalPrice,\n totalSavings,\n memberFunctionResult,\n isLogin,\n comparePrice,\n onAddToCart,\n onBuyNow,\n savingDetail,\n coupon,\n addToCartLoading,\n buyNowLoading,\n } = useBizProductContext()\n\n const memberPriceSave = Math.max(\n memberFunctionResult?.withCouponMemberTotalSave ?? 0,\n memberFunctionResult?.withoutCouponMaxMemberTotalSave ?? 0\n )\n\n const totalSavingsText = useMemo(() => {\n return replaceTemplate(copyWriting?.totalSavings || '', {\n amount: formatPrice({ amount: totalSavings, currencyCode: variant.price.currencyCode, locale }),\n })\n }, [copyWriting?.totalSavings, totalSavings, variant.price.currencyCode, locale])\n\n const memberPriceSaveText = useMemo(() => {\n return replaceTemplate(copyWriting?.memberSaving || '', {\n amount: formatPrice({ amount: memberPriceSave, currencyCode: variant.price.currencyCode, locale }),\n })\n }, [copyWriting?.memberSaving, memberPriceSave, variant.price.currencyCode, locale])\n\n return (\n <div className=\"bg-white py-3 px-4 tablet:p-0 tablet:flex tablet:items-center tablet:gap-4\">\n {variant.availableForSale ? (\n <div className=\"flex items-center justify-between tablet:flex-col desktop:items-end\">\n <div className=\"flex items-center gap-1\">\n <Text\n className=\"text-xl font-bold !leading-[1.2] desktop:text-xl lg-desktop:text-2xl\"\n html={formatPrice({ amount: finalPrice, currencyCode: variant.price.currencyCode, locale })}\n />\n {(totalSavings > 0 || memberPriceSave > 0 && isLogin ) && (\n <Text\n className=\"text-xl font-bold line-through text-[#999] !leading-[1.2] desktop:text-xl lg-desktop:text-2xl\"\n html={formatPrice({\n amount: comparePrice,\n currencyCode: variant.price.currencyCode,\n locale,\n })}\n />\n )}\n </div>\n {(totalSavings > 0 || (memberPriceSave > 0 && isLogin)) && (\n <Text\n className=\"text-brand-0 text-base !leading-[1.2] font-bold desktop:text-xl lg-desktop:text-2xl\"\n html={`${memberPriceSave > 0 && isLogin ? memberPriceSaveText : totalSavingsText}`}\n />\n )}\n </div>\n ) : (\n <Text className=\"text-[20px] font-bold text-[#999999]\" html={copyWriting?.soldOut ?? 'Sold Out'} />\n )}\n <div className=\"flex items-center gap-2 mt-2 tablet:mt-0\">\n <Button\n variant=\"secondary\"\n disabled={!variant.availableForSale}\n size=\"lg\"\n className=\"w-1/2 tablet:w-auto\"\n onClick={() => onAddToCart?.()}\n loading={addToCartLoading}\n >\n {copyWriting?.addToCart ?? 'Add to Cart'}\n </Button>\n <Button\n variant=\"primary\"\n disabled={!variant.availableForSale}\n size=\"lg\"\n loading={buyNowLoading}\n className=\"w-1/2 tablet:w-auto\"\n onClick={() => onBuyNow?.()}\n >\n {copyWriting?.buyNow ?? 'Buy Now'}\n </Button>\n </div>\n </div>\n )\n}\n\nexport default ProductActions\n"],
|
|
5
|
+
"mappings": "AA8CU,OACE,OAAAA,EADF,QAAAC,MAAA,oBA9CV,OAAS,QAAAC,EAAM,UAAAC,MAAc,4BAC7B,OAAS,kBAAAC,MAAsB,oCAC/B,OAAS,wBAAAC,MAA4B,iCACrC,OAAS,WAAAC,MAAe,QACxB,OAAS,eAAAC,MAAmB,iBAC5B,MAAoB,aACpB,OAAS,mBAAAC,MAAuB,4BAEhC,MAAMC,EAAiB,IAAM,CAC3B,KAAM,CAAE,YAAAC,EAAa,OAAAC,EAAS,IAAK,EAAIP,EAAe,EAChD,CACJ,QAAAQ,EACA,WAAAC,EACA,aAAAC,EACA,qBAAAC,EACA,QAAAC,EACA,aAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,OAAAC,EACA,iBAAAC,EACA,cAAAC,CACF,EAAIlB,EAAqB,EAEnBmB,EAAkB,KAAK,IAC3BT,GAAsB,2BAA6B,EACnDA,GAAsB,iCAAmC,CAC3D,EAEMU,EAAmBnB,EAAQ,IACxBE,EAAgBE,GAAa,cAAgB,GAAI,CACtD,OAAQH,EAAY,CAAE,OAAQO,EAAc,aAAcF,EAAQ,MAAM,aAAc,OAAAD,CAAO,CAAC,CAChG,CAAC,EACA,CAACD,GAAa,aAAcI,EAAcF,EAAQ,MAAM,aAAcD,CAAM,CAAC,EAE1Ee,EAAsBpB,EAAQ,IAC3BE,EAAgBE,GAAa,cAAgB,GAAI,CACtD,OAAQH,EAAY,CAAE,OAAQiB,EAAiB,aAAcZ,EAAQ,MAAM,aAAc,OAAAD,CAAO,CAAC,CACnG,CAAC,EACA,CAACD,GAAa,aAAcc,EAAiBZ,EAAQ,MAAM,aAAcD,CAAM,CAAC,EAEnF,OACEV,EAAC,OAAI,UAAU,6EACZ,UAAAW,EAAQ,iBACPX,EAAC,OAAI,UAAU,sEACb,UAAAA,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACE,EAAA,CACC,UAAU,uEACV,KAAMK,EAAY,CAAE,OAAQM,EAAY,aAAcD,EAAQ,MAAM,aAAc,OAAAD,CAAO,CAAC,EAC5F,GACEG,EAAe,GAAKU,EAAkB,GAAKR,IAC3ChB,EAACE,EAAA,CACC,UAAU,gGACV,KAAMK,EAAY,CAChB,OAAQU,EACR,aAAcL,EAAQ,MAAM,aAC5B,OAAAD,CACF,CAAC,EACH,GAEJ,GACEG,EAAe,GAAMU,EAAkB,GAAKR,IAC5ChB,EAACE,EAAA,CACC,UAAU,sFACV,KAAM,GAAGsB,EAAkB,GAAKR,EAAUU,EAAsBD,CAAgB,GAClF,GAEJ,EAEAzB,EAACE,EAAA,CAAK,UAAU,uCAAuC,KAAMQ,GAAa,SAAW,WAAY,EAEnGT,EAAC,OAAI,UAAU,2CACb,UAAAD,EAACG,EAAA,CACC,QAAQ,YACR,SAAU,CAACS,EAAQ,iBACnB,KAAK,KACL,UAAU,sBACV,QAAS,IAAMM,IAAc,EAC7B,QAASI,EAER,SAAAZ,GAAa,WAAa,cAC7B,EACAV,EAACG,EAAA,CACC,QAAQ,UACR,SAAU,CAACS,EAAQ,iBACnB,KAAK,KACL,QAASW,EACT,UAAU,sBACV,QAAS,IAAMJ,IAAW,EAEzB,SAAAT,GAAa,QAAU,UAC1B,GACF,GACF,CAEJ,EAEA,IAAOiB,EAAQlB",
|
|
6
|
+
"names": ["jsx", "jsxs", "Text", "Button", "useAiuiContext", "useBizProductContext", "useMemo", "formatPrice", "replaceTemplate", "ProductActions", "copyWriting", "locale", "variant", "finalPrice", "totalSavings", "memberFunctionResult", "isLogin", "comparePrice", "onAddToCart", "onBuyNow", "savingDetail", "coupon", "addToCartLoading", "buyNowLoading", "memberPriceSave", "totalSavingsText", "memberPriceSaveText", "ProductActions_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as O}from"react/jsx-runtime";import{useAiuiContext as M}from"../AiuiProvider/index.js";import{PurchaseBar as R,ProductActions as z}from"./components/index.js";import G from"./BizProductProvider.js";import{ProductCard as L}from"./components/index.js";import{useMediaQuery as o}from"react-responsive";const i=({product:n,renderRating:r,variant:c,selectedOptions:d,setSelectedOptions:s,isLogin:T,finalPrice:a,coupon:p,comparePrice:l,totalSavings:m,savingDetail:u,freeGift:y,bundle:P,checkedBundle:f,checkedGift:v,setCheckedBundle:C,setCheckedGift:S,compareData:g,selectedVariants:h,onAddToCart:k,onBuyNow:B,openModal:N,setSavingDetail:x,openSignInPopup:I,openAuthCodePopup:D,renderInstallments:b})=>{const{locale:q}=M(),t=o({query:"(max-width: 768px)"}),w=o({query:"(min-width: 1440px)"});return e(G,{product:n,isMobile:t,isDesktop:w,freeGift:y,renderRating:r,finalPrice:a,comparePrice:l,totalSavings:m,savingDetail:u,variant:c,selectedOptions:d,setSelectedOptions:s,bundle:P,coupon:p,checkedBundle:f,checkedGift:v,setCheckedBundle:C,setCheckedGift:S,compareData:g,selectedVariants:h,onAddToCart:k,onBuyNow:B,openModal:N,setSavingDetail:x,openSignInPopup:I,openAuthCodePopup:D,renderInstallments:b,children:O("div",{id:"ipc-listing",children:[e(R,{onSpyNavItemClick:A=>{console.log(A)}}),t&&e("div",{className:"fixed bottom-0 left-0 w-full z-[60]",children:e(z,{})}),e(L,{})]})})};i.displayName="Listing";var H=i;export{H 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/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useAiuiContext } from '../AiuiProvider/index.js'\nimport { PurchaseBar, ProductActions } from './components/index.js'\nimport type { ScrollSpyNavItem } from './components/PurchaseBar/types.js'\nimport BizProductProvider, { type ProductContextType } from './BizProductProvider.js'\nimport { ProductCard } from './components/index.js'\n\nimport { useMediaQuery } from 'react-responsive'\n\nconst Listing: React.FC<Omit<ProductContextType, 'joinedRecommendBuyProducts' | 'setJoinedRecommendBuyProducts'>> = ({\n product,\n renderRating,\n variant,\n selectedOptions,\n setSelectedOptions,\n isLogin,\n finalPrice,\n coupon,\n comparePrice,\n totalSavings,\n savingDetail,\n freeGift,\n bundle,\n checkedBundle,\n checkedGift,\n setCheckedBundle,\n setCheckedGift,\n compareData,\n selectedVariants,\n onAddToCart,\n onBuyNow,\n openModal,\n setSavingDetail,\n openSignInPopup,\n openAuthCodePopup,\n
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "useAiuiContext", "PurchaseBar", "ProductActions", "BizProductProvider", "ProductCard", "useMediaQuery", "Listing", "product", "renderRating", "variant", "selectedOptions", "setSelectedOptions", "isLogin", "finalPrice", "coupon", "comparePrice", "totalSavings", "savingDetail", "freeGift", "bundle", "checkedBundle", "checkedGift", "setCheckedBundle", "setCheckedGift", "compareData", "selectedVariants", "onAddToCart", "onBuyNow", "openModal", "setSavingDetail", "openSignInPopup", "openAuthCodePopup", "
|
|
4
|
+
"sourcesContent": ["import { useAiuiContext } from '../AiuiProvider/index.js'\nimport { PurchaseBar, ProductActions } from './components/index.js'\nimport type { ScrollSpyNavItem } from './components/PurchaseBar/types.js'\nimport BizProductProvider, { type ProductContextType } from './BizProductProvider.js'\nimport { ProductCard } from './components/index.js'\n\nimport { useMediaQuery } from 'react-responsive'\n\nconst Listing: React.FC<Omit<ProductContextType, 'joinedRecommendBuyProducts' | 'setJoinedRecommendBuyProducts'>> = ({\n product,\n renderRating,\n variant,\n selectedOptions,\n setSelectedOptions,\n isLogin,\n finalPrice,\n coupon,\n comparePrice,\n totalSavings,\n savingDetail,\n freeGift,\n bundle,\n checkedBundle,\n checkedGift,\n setCheckedBundle,\n setCheckedGift,\n compareData,\n selectedVariants,\n onAddToCart,\n onBuyNow,\n openModal,\n setSavingDetail,\n openSignInPopup,\n openAuthCodePopup,\n renderInstallments,\n}) => {\n const { locale } = useAiuiContext()\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n const isDesktop = useMediaQuery({ query: '(min-width: 1440px)' })\n\n const onSpyNavItemClick = (tab: ScrollSpyNavItem) => {\n console.log(tab)\n }\n\n return (\n <BizProductProvider\n product={product}\n isMobile={isMobile}\n isDesktop={isDesktop}\n freeGift={freeGift}\n renderRating={renderRating}\n finalPrice={finalPrice}\n comparePrice={comparePrice}\n totalSavings={totalSavings}\n savingDetail={savingDetail}\n variant={variant}\n selectedOptions={selectedOptions}\n setSelectedOptions={setSelectedOptions}\n bundle={bundle}\n coupon={coupon}\n checkedBundle={checkedBundle}\n checkedGift={checkedGift}\n setCheckedBundle={setCheckedBundle}\n setCheckedGift={setCheckedGift}\n compareData={compareData}\n selectedVariants={selectedVariants}\n onAddToCart={onAddToCart}\n onBuyNow={onBuyNow}\n openModal={openModal}\n setSavingDetail={setSavingDetail}\n openSignInPopup={openSignInPopup}\n openAuthCodePopup={openAuthCodePopup}\n renderInstallments={renderInstallments}\n >\n <div id=\"ipc-listing\">\n <PurchaseBar onSpyNavItemClick={onSpyNavItemClick} />\n {isMobile && (\n <div className=\"fixed bottom-0 left-0 w-full z-[60]\">\n <ProductActions />\n </div>\n )}\n <ProductCard />\n </div>\n </BizProductProvider>\n )\n}\n\nListing.displayName = 'Listing'\n\nexport default Listing\n"],
|
|
5
|
+
"mappings": "AA2EM,OACE,OAAAA,EADF,QAAAC,MAAA,oBA3EN,OAAS,kBAAAC,MAAsB,2BAC/B,OAAS,eAAAC,EAAa,kBAAAC,MAAsB,wBAE5C,OAAOC,MAAqD,0BAC5D,OAAS,eAAAC,MAAmB,wBAE5B,OAAS,iBAAAC,MAAqB,mBAE9B,MAAMC,EAA8G,CAAC,CACnH,QAAAC,EACA,aAAAC,EACA,QAAAC,EACA,gBAAAC,EACA,mBAAAC,EACA,QAAAC,EACA,WAAAC,EACA,OAAAC,EACA,aAAAC,EACA,aAAAC,EACA,aAAAC,EACA,SAAAC,EACA,OAAAC,EACA,cAAAC,EACA,YAAAC,EACA,iBAAAC,EACA,eAAAC,EACA,YAAAC,EACA,iBAAAC,EACA,YAAAC,EACA,SAAAC,EACA,UAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,kBAAAC,EACA,mBAAAC,CACF,IAAM,CACJ,KAAM,CAAE,OAAAC,CAAO,EAAIjC,EAAe,EAE5BkC,EAAW7B,EAAc,CAAE,MAAO,oBAAqB,CAAC,EACxD8B,EAAY9B,EAAc,CAAE,MAAO,qBAAsB,CAAC,EAMhE,OACEP,EAACK,EAAA,CACC,QAASI,EACT,SAAU2B,EACV,UAAWC,EACX,SAAUjB,EACV,aAAcV,EACd,WAAYK,EACZ,aAAcE,EACd,aAAcC,EACd,aAAcC,EACd,QAASR,EACT,gBAAiBC,EACjB,mBAAoBC,EACpB,OAAQQ,EACR,OAAQL,EACR,cAAeM,EACf,YAAaC,EACb,iBAAkBC,EAClB,eAAgBC,EAChB,YAAaC,EACb,iBAAkBC,EAClB,YAAaC,EACb,SAAUC,EACV,UAAWC,EACX,gBAAiBC,EACjB,gBAAiBC,EACjB,kBAAmBC,EACnB,mBAAoBC,EAEpB,SAAAjC,EAAC,OAAI,GAAG,cACN,UAAAD,EAACG,EAAA,CAAY,kBAnCQmC,GAA0B,CACnD,QAAQ,IAAIA,CAAG,CACjB,EAiCyD,EAClDF,GACCpC,EAAC,OAAI,UAAU,sCACb,SAAAA,EAACI,EAAA,EAAe,EAClB,EAEFJ,EAACM,EAAA,EAAY,GACf,EACF,CAEJ,EAEAE,EAAQ,YAAc,UAEtB,IAAO+B,EAAQ/B",
|
|
6
|
+
"names": ["jsx", "jsxs", "useAiuiContext", "PurchaseBar", "ProductActions", "BizProductProvider", "ProductCard", "useMediaQuery", "Listing", "product", "renderRating", "variant", "selectedOptions", "setSelectedOptions", "isLogin", "finalPrice", "coupon", "comparePrice", "totalSavings", "savingDetail", "freeGift", "bundle", "checkedBundle", "checkedGift", "setCheckedBundle", "setCheckedGift", "compareData", "selectedVariants", "onAddToCart", "onBuyNow", "openModal", "setSavingDetail", "openSignInPopup", "openAuthCodePopup", "renderInstallments", "locale", "isMobile", "isDesktop", "tab", "Listing_default"]
|
|
7
7
|
}
|
|
@@ -11,8 +11,8 @@ declare const MarqueeImageContent: {
|
|
|
11
11
|
};
|
|
12
12
|
declare const MarqueeTextContent: React.ForwardRefExoticComponent<MarqueeTextContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
13
13
|
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<MarqueeProps & React.RefAttributes<SwiperRef>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
14
|
-
className?: string;
|
|
15
|
-
data?: Record<string, any
|
|
14
|
+
className?: string | undefined;
|
|
15
|
+
data?: Record<string, any> | undefined;
|
|
16
16
|
}, "ref"> & React.RefAttributes<any>>;
|
|
17
17
|
export default _default;
|
|
18
18
|
export { MarqueeItem, MarqueeImageContent, MarqueeTextContent };
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import type { Media, Theme } from '../../types/props.js';
|
|
2
3
|
/**
|
|
3
4
|
* 评论项数据结构
|
|
@@ -35,7 +36,7 @@ export interface MarqueeReviewProps {
|
|
|
35
36
|
className?: string;
|
|
36
37
|
}
|
|
37
38
|
declare const _default: import("react").ForwardRefExoticComponent<Omit<MarqueeReviewProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
38
|
-
className?: string;
|
|
39
|
-
data?: Record<string, any
|
|
39
|
+
className?: string | undefined;
|
|
40
|
+
data?: Record<string, any> | undefined;
|
|
40
41
|
} & import("react").RefAttributes<any>>;
|
|
41
42
|
export default _default;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import type { MediaPlayerBaseProps } from './types.js';
|
|
2
3
|
declare const _default: import("react").ForwardRefExoticComponent<Omit<Omit<MediaPlayerBaseProps & import("react").RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
3
|
-
className?: string;
|
|
4
|
-
data?: Record<string, any
|
|
4
|
+
className?: string | undefined;
|
|
5
|
+
data?: Record<string, any> | undefined;
|
|
5
6
|
}, "ref"> & import("react").RefAttributes<any>>;
|
|
6
7
|
export default _default;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import type { MediaPlayerMultiProps } from './types.js';
|
|
2
3
|
declare const _default: import("react").ForwardRefExoticComponent<Omit<Omit<MediaPlayerMultiProps & import("react").RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
3
|
-
className?: string;
|
|
4
|
-
data?: Record<string, any
|
|
4
|
+
className?: string | undefined;
|
|
5
|
+
data?: Record<string, any> | undefined;
|
|
5
6
|
}, "ref"> & import("react").RefAttributes<any>>;
|
|
6
7
|
export default _default;
|
|
@@ -3,7 +3,7 @@ import type { MediaPlayerBaseProps } from './types.js';
|
|
|
3
3
|
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<MediaPlayerBaseProps & React.RefAttributes<{
|
|
4
4
|
mediaPlayerStickyRef: HTMLDivElement;
|
|
5
5
|
}>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
6
|
-
className?: string;
|
|
7
|
-
data?: Record<string, any
|
|
6
|
+
className?: string | undefined;
|
|
7
|
+
data?: Record<string, any> | undefined;
|
|
8
8
|
}, "ref"> & React.RefAttributes<any>>;
|
|
9
9
|
export default _default;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import type { MediaSceneSwitcherProps } from './types.js';
|
|
2
3
|
import 'swiper/css';
|
|
3
4
|
declare const _default: import("react").ForwardRefExoticComponent<Omit<Omit<MediaSceneSwitcherProps & import("react").RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
4
|
-
className?: string;
|
|
5
|
-
data?: Record<string, any
|
|
5
|
+
className?: string | undefined;
|
|
6
|
+
data?: Record<string, any> | undefined;
|
|
6
7
|
}, "ref"> & import("react").RefAttributes<any>>;
|
|
7
8
|
export default _default;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { MemberEquityProps } from './types.js';
|
|
3
3
|
declare const _default: React.ForwardRefExoticComponent<Omit<MemberEquityProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
4
|
-
className?: string;
|
|
5
|
-
data?: Record<string, any
|
|
4
|
+
className?: string | undefined;
|
|
5
|
+
data?: Record<string, any> | undefined;
|
|
6
6
|
} & React.RefAttributes<any>>;
|
|
7
7
|
export default _default;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { MultiLayoutGraphicBlockProps } from './types';
|
|
3
3
|
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<MultiLayoutGraphicBlockProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
4
|
-
className?: string;
|
|
5
|
-
data?: Record<string, any
|
|
4
|
+
className?: string | undefined;
|
|
5
|
+
data?: Record<string, any> | undefined;
|
|
6
6
|
}, "ref"> & React.RefAttributes<any>>;
|
|
7
7
|
export default _default;
|
|
8
8
|
export type { MultiLayoutGraphicBlockProps };
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import type { NavigationSearchProps } from './types.js';
|
|
2
3
|
export declare const canSearch: (target: any) => boolean;
|
|
3
4
|
declare const NavigationSearch: import("react").ForwardRefExoticComponent<NavigationSearchProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import type { Media, Theme, Shape } from '../../types/props.js';
|
|
2
3
|
export interface ProductItemData {
|
|
3
4
|
/** 产品标签文本 */
|
|
@@ -31,7 +32,7 @@ export interface ProductCompareProps {
|
|
|
31
32
|
className?: string;
|
|
32
33
|
}
|
|
33
34
|
declare const _default: import("react").ForwardRefExoticComponent<Omit<ProductCompareProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
34
|
-
className?: string;
|
|
35
|
-
data?: Record<string, any
|
|
35
|
+
className?: string | undefined;
|
|
36
|
+
data?: Record<string, any> | undefined;
|
|
36
37
|
} & import("react").RefAttributes<any>>;
|
|
37
38
|
export default _default;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { ProductHeroProps } from './types.js';
|
|
3
3
|
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<ProductHeroProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
4
|
-
className?: string;
|
|
5
|
-
data?: Record<string, any
|
|
4
|
+
className?: string | undefined;
|
|
5
|
+
data?: Record<string, any> | undefined;
|
|
6
6
|
}, "ref"> & React.RefAttributes<any>>;
|
|
7
7
|
export default _default;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as s}from"react/jsx-runtime";import f,{useRef as h,useImperativeHandle as b}from"react";import{Heading as p,Button as x,Picture as _,Text as N}from"../../components/index.js";import{cn as H}from"../../helpers/utils.js";import{withLayout as k}from"../../shared/Styles.js";import{useExposure as P}from"../../hooks/useExposure.js";const g="image",v="product_hero",a=f.forwardRef(({data:l,className:c},i)=>{const{title:r,subtitle:e,ctaText:m,poster:u,mobPoster:n,ctaLink:d}=l,o=h(null);return P(o,{componentType:g,componentName:v,componentTitle:r,componentDescription:e}),b(i,()=>o.current),s("section",{ref:o,"data-ui-component-id":"ProductHero",className:H("product-hero flex w-full flex-col items-center justify-between gap-[32px] tablet:flex-row tablet:gap-[16px] lg-desktop:gap-[64px]",c),children:[s("div",{className:"product-hero__content flex w-full flex-col items-start gap-[24px] tablet:basis-[42%] laptop:basis-[36%]",children:[s("div",{className:"product-hero__text",children:[t(p,{as:"h3",size:4,html:r,className:"product-hero__title"}),t(p,{as:"h4",size:2,html:e,className:"product-hero__subtitle product-hero__subtitle--desktop mt-[4px] hidden laptop:mt-[12px] laptop:block desktop:mt-[16px]"}),t(N,{as:"p",size:2,html:e,className:"product-hero__subtitle product-hero__subtitle--mobile mt-[4px] block laptop:mt-[12px] laptop:hidden desktop:mt-[16px]"})]}),t("a",{href:d,className:"product-hero__cta-link",children:t(x,{className:"product-hero__cta-button w-fit",children:m})})]}),t(_,{className:"product-hero__image aspect-[358/360] flex-shrink tablet:aspect-[824/640] tablet:basis-[58%] laptop:basis-[64%]",source:`${u
|
|
1
|
+
"use client";import{jsx as t,jsxs as s}from"react/jsx-runtime";import f,{useRef as h,useImperativeHandle as b}from"react";import{Heading as p,Button as x,Picture as _,Text as N}from"../../components/index.js";import{cn as H}from"../../helpers/utils.js";import{withLayout as k}from"../../shared/Styles.js";import{useExposure as P}from"../../hooks/useExposure.js";const g="image",v="product_hero",a=f.forwardRef(({data:l,className:c},i)=>{const{title:r,subtitle:e,ctaText:m,poster:u,mobPoster:n,ctaLink:d}=l,o=h(null);return P(o,{componentType:g,componentName:v,componentTitle:r,componentDescription:e}),b(i,()=>o.current),s("section",{ref:o,"data-ui-component-id":"ProductHero",className:H("product-hero flex w-full flex-col items-center justify-between gap-[32px] tablet:flex-row tablet:gap-[16px] lg-desktop:gap-[64px]",c),children:[s("div",{className:"product-hero__content flex w-full flex-col items-start gap-[24px] tablet:basis-[42%] laptop:basis-[36%]",children:[s("div",{className:"product-hero__text",children:[t(p,{as:"h3",size:4,html:r,className:"product-hero__title"}),t(p,{as:"h4",size:2,html:e,className:"product-hero__subtitle product-hero__subtitle--desktop mt-[4px] hidden laptop:mt-[12px] laptop:block desktop:mt-[16px]"}),t(N,{as:"p",size:2,html:e,className:"product-hero__subtitle product-hero__subtitle--mobile mt-[4px] block laptop:mt-[12px] laptop:hidden desktop:mt-[16px]"})]}),t("a",{href:d,className:"product-hero__cta-link",children:t(x,{className:"product-hero__cta-button w-fit",children:m})})]}),t(_,{className:"product-hero__image aspect-[358/360] flex-shrink tablet:aspect-[824/640] tablet:basis-[58%] laptop:basis-[64%]",source:`${u?.url}, ${n?.url} 768`})]})});a.displayName="ProductHero";var E=k(a);export{E as default};
|
|
2
2
|
//# sourceMappingURL=ProductHero.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/ProductHero/ProductHero.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React, { useRef, useImperativeHandle } from 'react'\nimport { Heading, Button, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { ProductHeroProps } from './types.js'\n\nconst componentType = 'image'\nconst componentName = 'product_hero'\n\nconst ProductHero = React.forwardRef<HTMLDivElement, ProductHeroProps>(({ data, className }, ref) => {\n const { title, subtitle, ctaText, poster, mobPoster, ctaLink } = data\n\n const boxRef = useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: title,\n componentDescription: subtitle,\n })\n\n useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n return (\n <section\n ref={boxRef}\n data-ui-component-id=\"ProductHero\"\n className={cn(\n 'product-hero flex w-full flex-col items-center justify-between gap-[32px] tablet:flex-row tablet:gap-[16px] lg-desktop:gap-[64px]',\n className\n )}\n >\n <div className=\"product-hero__content flex w-full flex-col items-start gap-[24px] tablet:basis-[42%] laptop:basis-[36%]\">\n <div className=\"product-hero__text\">\n <Heading as={'h3'} size={4} html={title} className=\"product-hero__title\" />\n <Heading\n as={'h4'}\n size={2}\n html={subtitle}\n className=\"product-hero__subtitle product-hero__subtitle--desktop mt-[4px] hidden laptop:mt-[12px] laptop:block desktop:mt-[16px]\"\n />\n <Text\n as={'p'}\n size={2}\n html={subtitle}\n className=\"product-hero__subtitle product-hero__subtitle--mobile mt-[4px] block laptop:mt-[12px] laptop:hidden desktop:mt-[16px]\"\n />\n </div>\n <a href={ctaLink} className=\"product-hero__cta-link\">\n <Button className=\"product-hero__cta-button w-fit\">{ctaText}</Button>\n </a>\n </div>\n <Picture\n className=\"product-hero__image aspect-[358/360] flex-shrink tablet:aspect-[824/640] tablet:basis-[58%] laptop:basis-[64%]\"\n source={`${poster
|
|
5
|
-
"mappings": "aAmCQ,OACE,OAAAA,EADF,QAAAC,MAAA,oBAlCR,OAAOC,GAAS,UAAAC,EAAQ,uBAAAC,MAA2B,QACnD,OAAS,WAAAC,EAAS,UAAAC,EAAQ,WAAAC,EAAS,QAAAC,MAAY,4BAC/C,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,eAAAC,MAAmB,6BAG5B,MAAMC,EAAgB,QAChBC,EAAgB,eAEhBC,EAAcZ,EAAM,WAA6C,CAAC,CAAE,KAAAa,EAAM,UAAAC,CAAU,EAAGC,IAAQ,CACnG,KAAM,CAAE,MAAAC,EAAO,SAAAC,EAAU,QAAAC,EAAS,OAAAC,EAAQ,UAAAC,EAAW,QAAAC,CAAQ,EAAIR,EAE3DS,EAASrB,EAAuB,IAAI,EAE1C,OAAAQ,EAAYa,EAAQ,CAClB,cAAAZ,EACA,cAAAC,EACA,eAAgBK,EAChB,qBAAsBC,CACxB,CAAC,EAEDf,EAAoBa,EAAK,IAAMO,EAAO,OAAyB,EAG7DvB,EAAC,WACC,IAAKuB,EACL,uBAAqB,cACrB,UAAWf,EACT,oIACAO,CACF,EAEA,UAAAf,EAAC,OAAI,UAAU,0GACb,UAAAA,EAAC,OAAI,UAAU,qBACb,UAAAD,EAACK,EAAA,CAAQ,GAAI,KAAM,KAAM,EAAG,KAAMa,EAAO,UAAU,sBAAsB,EACzElB,EAACK,EAAA,CACC,GAAI,KACJ,KAAM,EACN,KAAMc,EACN,UAAU,yHACZ,EACAnB,EAACQ,EAAA,CACC,GAAI,IACJ,KAAM,EACN,KAAMW,EACN,UAAU,wHACZ,GACF,EACAnB,EAAC,KAAE,KAAMuB,EAAS,UAAU,yBAC1B,SAAAvB,EAACM,EAAA,CAAO,UAAU,iCAAkC,SAAAc,EAAQ,EAC9D,GACF,EACApB,EAACO,EAAA,CACC,UAAU,iHACV,OAAQ,GAAGc,
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useRef, useImperativeHandle } from 'react'\nimport { Heading, Button, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { ProductHeroProps } from './types.js'\n\nconst componentType = 'image'\nconst componentName = 'product_hero'\n\nconst ProductHero = React.forwardRef<HTMLDivElement, ProductHeroProps>(({ data, className }, ref) => {\n const { title, subtitle, ctaText, poster, mobPoster, ctaLink } = data\n\n const boxRef = useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: title,\n componentDescription: subtitle,\n })\n\n useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n return (\n <section\n ref={boxRef}\n data-ui-component-id=\"ProductHero\"\n className={cn(\n 'product-hero flex w-full flex-col items-center justify-between gap-[32px] tablet:flex-row tablet:gap-[16px] lg-desktop:gap-[64px]',\n className\n )}\n >\n <div className=\"product-hero__content flex w-full flex-col items-start gap-[24px] tablet:basis-[42%] laptop:basis-[36%]\">\n <div className=\"product-hero__text\">\n <Heading as={'h3'} size={4} html={title} className=\"product-hero__title\" />\n <Heading\n as={'h4'}\n size={2}\n html={subtitle}\n className=\"product-hero__subtitle product-hero__subtitle--desktop mt-[4px] hidden laptop:mt-[12px] laptop:block desktop:mt-[16px]\"\n />\n <Text\n as={'p'}\n size={2}\n html={subtitle}\n className=\"product-hero__subtitle product-hero__subtitle--mobile mt-[4px] block laptop:mt-[12px] laptop:hidden desktop:mt-[16px]\"\n />\n </div>\n <a href={ctaLink} className=\"product-hero__cta-link\">\n <Button className=\"product-hero__cta-button w-fit\">{ctaText}</Button>\n </a>\n </div>\n <Picture\n className=\"product-hero__image aspect-[358/360] flex-shrink tablet:aspect-[824/640] tablet:basis-[58%] laptop:basis-[64%]\"\n source={`${poster?.url}, ${mobPoster?.url} 768`}\n />\n </section>\n )\n})\n\nProductHero.displayName = 'ProductHero'\n\nexport default withLayout(ProductHero)\n"],
|
|
5
|
+
"mappings": "aAmCQ,OACE,OAAAA,EADF,QAAAC,MAAA,oBAlCR,OAAOC,GAAS,UAAAC,EAAQ,uBAAAC,MAA2B,QACnD,OAAS,WAAAC,EAAS,UAAAC,EAAQ,WAAAC,EAAS,QAAAC,MAAY,4BAC/C,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,eAAAC,MAAmB,6BAG5B,MAAMC,EAAgB,QAChBC,EAAgB,eAEhBC,EAAcZ,EAAM,WAA6C,CAAC,CAAE,KAAAa,EAAM,UAAAC,CAAU,EAAGC,IAAQ,CACnG,KAAM,CAAE,MAAAC,EAAO,SAAAC,EAAU,QAAAC,EAAS,OAAAC,EAAQ,UAAAC,EAAW,QAAAC,CAAQ,EAAIR,EAE3DS,EAASrB,EAAuB,IAAI,EAE1C,OAAAQ,EAAYa,EAAQ,CAClB,cAAAZ,EACA,cAAAC,EACA,eAAgBK,EAChB,qBAAsBC,CACxB,CAAC,EAEDf,EAAoBa,EAAK,IAAMO,EAAO,OAAyB,EAG7DvB,EAAC,WACC,IAAKuB,EACL,uBAAqB,cACrB,UAAWf,EACT,oIACAO,CACF,EAEA,UAAAf,EAAC,OAAI,UAAU,0GACb,UAAAA,EAAC,OAAI,UAAU,qBACb,UAAAD,EAACK,EAAA,CAAQ,GAAI,KAAM,KAAM,EAAG,KAAMa,EAAO,UAAU,sBAAsB,EACzElB,EAACK,EAAA,CACC,GAAI,KACJ,KAAM,EACN,KAAMc,EACN,UAAU,yHACZ,EACAnB,EAACQ,EAAA,CACC,GAAI,IACJ,KAAM,EACN,KAAMW,EACN,UAAU,wHACZ,GACF,EACAnB,EAAC,KAAE,KAAMuB,EAAS,UAAU,yBAC1B,SAAAvB,EAACM,EAAA,CAAO,UAAU,iCAAkC,SAAAc,EAAQ,EAC9D,GACF,EACApB,EAACO,EAAA,CACC,UAAU,iHACV,OAAQ,GAAGc,GAAQ,GAAG,KAAKC,GAAW,GAAG,OAC3C,GACF,CAEJ,CAAC,EAEDR,EAAY,YAAc,cAE1B,IAAOW,EAAQf,EAAWI,CAAW",
|
|
6
6
|
"names": ["jsx", "jsxs", "React", "useRef", "useImperativeHandle", "Heading", "Button", "Picture", "Text", "cn", "withLayout", "useExposure", "componentType", "componentName", "ProductHero", "data", "className", "ref", "title", "subtitle", "ctaText", "poster", "mobPoster", "ctaLink", "boxRef", "ProductHero_default"]
|
|
7
7
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import type { Img } from '../../types/props.js';
|
|
2
3
|
export type SelectStoreDataType = {
|
|
3
4
|
title: string;
|
|
@@ -14,7 +15,7 @@ type SelectStoreType = {
|
|
|
14
15
|
className?: string;
|
|
15
16
|
};
|
|
16
17
|
declare const _default: import("react").ForwardRefExoticComponent<Omit<SelectStoreType, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
17
|
-
className?: string;
|
|
18
|
-
data?: Record<string, any
|
|
18
|
+
className?: string | undefined;
|
|
19
|
+
data?: Record<string, any> | undefined;
|
|
19
20
|
} & import("react").RefAttributes<any>>;
|
|
20
21
|
export default _default;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { ShelfDisplayProps } from './shelfDisplay.js';
|
|
3
3
|
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<ShelfDisplayProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
4
|
-
className?: string;
|
|
5
|
-
data?: Record<string, any
|
|
4
|
+
className?: string | undefined;
|
|
5
|
+
data?: Record<string, any> | undefined;
|
|
6
6
|
}, "ref"> & React.RefAttributes<any>>;
|
|
7
7
|
export default _default;
|
|
@@ -3,7 +3,7 @@ import type { SloganProps } from './types.js';
|
|
|
3
3
|
export declare const componentType = "copy";
|
|
4
4
|
export declare const componentName = "brand_slogan";
|
|
5
5
|
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<SloganProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
6
|
-
className?: string;
|
|
7
|
-
data?: Record<string, any
|
|
6
|
+
className?: string | undefined;
|
|
7
|
+
data?: Record<string, any> | undefined;
|
|
8
8
|
}, "ref"> & React.RefAttributes<any>>;
|
|
9
9
|
export default _default;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { SpacerProps } from './types.js';
|
|
3
3
|
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<SpacerProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
4
|
-
className?: string;
|
|
5
|
-
data?: Record<string, any
|
|
4
|
+
className?: string | undefined;
|
|
5
|
+
data?: Record<string, any> | undefined;
|
|
6
6
|
}, "ref"> & React.RefAttributes<any>>;
|
|
7
7
|
export default _default;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{jsx as l}from"react/jsx-runtime";import{useEffect as b,useRef as h,useMemo as x}from"react";const m="openDropDown",v=({index:o,active:s,list:d,setActive:p,setVisible:c,visible:r,filterActive:a})=>{const u=h(null);b(()=>{const e=n=>{const t=n?.target?.getAttribute?.("class");!u?.current?.contains(n?.target)&&!t?.includes(m)&&c({...r,[o]:!1})};return document.addEventListener("click",e),()=>document.removeEventListener("click",e)},[]);const f=x(()=>{const e=Object.keys(a||{});return d?.filter(n=>!e?.find(i=>a?.[i]?.handle===n?.handle))},[a,d]);return l("div",{ref:u,className:`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-
|
|
1
|
+
import{jsx as l}from"react/jsx-runtime";import{useEffect as b,useRef as h,useMemo as x}from"react";const m="openDropDown",v=({index:o,active:s,list:d,setActive:p,setVisible:c,visible:r,filterActive:a})=>{const u=h(null);b(()=>{const e=n=>{const t=n?.target?.getAttribute?.("class");!u?.current?.contains(n?.target)&&!t?.includes(m)&&c({...r,[o]:!1})};return document.addEventListener("click",e),()=>document.removeEventListener("click",e)},[]);const f=x(()=>{const e=Object.keys(a||{});return d?.filter(n=>!e?.find(i=>a?.[i]?.handle===n?.handle))},[a,d]);return l("div",{ref:u,className:`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-auto rounded-lg bg-[#F5F5F7] ${r?.[o]?"block":"hidden"}`,children:l("div",{className:"m-0 box-border h-full flex-1 overflow-hidden p-0 [&:last-child]:border-r-0",children:f?.map((e,n)=>{const t=e?.sku||e?.variants?.[0]?.sku;return l("div",{onClick:()=>{p({...s,[o]:{sku:t,name:e?.name,handle:e?.handle}}),c({...r,[o]:!1})},title:e?.name,className:`openDropDown box-border cursor-pointer truncate px-6 py-4 text-base font-bold min-xl:text-lg min-xxl:text-lg [&:hover]:bg-[#EAEAEC]
|
|
2
2
|
${e?.handle===s?.handle?"bg-[#EAEAEC]":""}`,children:e?.name},n)})})})};var D=v;export{D as default};
|
|
3
3
|
//# sourceMappingURL=dropdown.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Specs/dropdown.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useEffect, useRef, useMemo } from 'react'\n\nconst clickContent = 'openDropDown'\n\nexport type DropDownProps = {\n index: number\n active: any\n list: any\n setActive: any\n setVisible: any\n visible: any\n filterActive: any\n}\n\nconst DropDown = ({ index, active, list, setActive, setVisible, visible, filterActive }: DropDownProps) => {\n const dropDownRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n const handleClickOutside = (event: any) => {\n const isDel = event?.target?.getAttribute?.('class')\n const isContainer = !dropDownRef?.current?.contains(event?.target)\n if (isContainer && !isDel?.includes(clickContent)) {\n setVisible({ ...visible, [index]: false })\n }\n }\n document.addEventListener('click', handleClickOutside)\n return () => document.removeEventListener('click', handleClickOutside)\n }, [])\n\n const handleList = useMemo(() => {\n const activeIndex = Object.keys(filterActive || {})\n return list?.filter((item: { handle: any }) => {\n const currentIndex = activeIndex?.find((items: string) => filterActive?.[items]?.handle === item?.handle)\n return !currentIndex\n })\n }, [filterActive, list])\n\n return (\n <div\n ref={dropDownRef}\n className={`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-
|
|
5
|
-
"mappings": "AA8CY,cAAAA,MAAA,oBA9CZ,OAAS,aAAAC,EAAW,UAAAC,EAAQ,WAAAC,MAAe,QAE3C,MAAMC,EAAe,eAYfC,EAAW,CAAC,CAAE,MAAAC,EAAO,OAAAC,EAAQ,KAAAC,EAAM,UAAAC,EAAW,WAAAC,EAAY,QAAAC,EAAS,aAAAC,CAAa,IAAqB,CACzG,MAAMC,EAAcX,EAAuB,IAAI,EAE/CD,EAAU,IAAM,CACd,MAAMa,EAAsBC,GAAe,CACzC,MAAMC,EAAQD,GAAO,QAAQ,eAAe,OAAO,EAC/B,CAACF,GAAa,SAAS,SAASE,GAAO,MAAM,GAC9C,CAACC,GAAO,SAASZ,CAAY,GAC9CM,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAE7C,EACA,gBAAS,iBAAiB,QAASQ,CAAkB,EAC9C,IAAM,SAAS,oBAAoB,QAASA,CAAkB,CACvE,EAAG,CAAC,CAAC,EAEL,MAAMG,EAAad,EAAQ,IAAM,CAC/B,MAAMe,EAAc,OAAO,KAAKN,GAAgB,CAAC,CAAC,EAClD,OAAOJ,GAAM,OAAQW,GAEZ,CADcD,GAAa,KAAME,GAAkBR,IAAeQ,CAAK,GAAG,SAAWD,GAAM,MAAM,CAEzG,CACH,EAAG,CAACP,EAAcJ,CAAI,CAAC,EAEvB,OACER,EAAC,OACC,IAAKa,EACL,UAAW,
|
|
4
|
+
"sourcesContent": ["import { useEffect, useRef, useMemo } from 'react'\n\nconst clickContent = 'openDropDown'\n\nexport type DropDownProps = {\n index: number\n active: any\n list: any\n setActive: any\n setVisible: any\n visible: any\n filterActive: any\n}\n\nconst DropDown = ({ index, active, list, setActive, setVisible, visible, filterActive }: DropDownProps) => {\n const dropDownRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n const handleClickOutside = (event: any) => {\n const isDel = event?.target?.getAttribute?.('class')\n const isContainer = !dropDownRef?.current?.contains(event?.target)\n if (isContainer && !isDel?.includes(clickContent)) {\n setVisible({ ...visible, [index]: false })\n }\n }\n document.addEventListener('click', handleClickOutside)\n return () => document.removeEventListener('click', handleClickOutside)\n }, [])\n\n const handleList = useMemo(() => {\n const activeIndex = Object.keys(filterActive || {})\n return list?.filter((item: { handle: any }) => {\n const currentIndex = activeIndex?.find((items: string) => filterActive?.[items]?.handle === item?.handle)\n return !currentIndex\n })\n }, [filterActive, list])\n\n return (\n <div\n ref={dropDownRef}\n className={`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-auto rounded-lg bg-[#F5F5F7] ${visible?.[index] ? 'block' : 'hidden'}`}\n >\n <div className={'m-0 box-border h-full flex-1 overflow-hidden p-0 [&:last-child]:border-r-0'}>\n {handleList?.map((item: any, id: number) => {\n const currentSku = item?.sku || item?.variants?.[0]?.sku\n return (\n <div\n key={id}\n onClick={() => {\n setActive({\n ...active,\n [index]: {\n sku: currentSku,\n name: item?.name,\n handle: item?.handle,\n },\n })\n setVisible({ ...visible, [index]: false })\n }}\n title={item?.name}\n className={`openDropDown box-border cursor-pointer truncate px-6 py-4 text-base font-bold min-xl:text-lg min-xxl:text-lg [&:hover]:bg-[#EAEAEC]\n ${item?.handle === active?.handle ? 'bg-[#EAEAEC]' : ''}`}\n >\n {item?.name}\n </div>\n )\n })}\n </div>\n </div>\n )\n}\n\nexport default DropDown\n"],
|
|
5
|
+
"mappings": "AA8CY,cAAAA,MAAA,oBA9CZ,OAAS,aAAAC,EAAW,UAAAC,EAAQ,WAAAC,MAAe,QAE3C,MAAMC,EAAe,eAYfC,EAAW,CAAC,CAAE,MAAAC,EAAO,OAAAC,EAAQ,KAAAC,EAAM,UAAAC,EAAW,WAAAC,EAAY,QAAAC,EAAS,aAAAC,CAAa,IAAqB,CACzG,MAAMC,EAAcX,EAAuB,IAAI,EAE/CD,EAAU,IAAM,CACd,MAAMa,EAAsBC,GAAe,CACzC,MAAMC,EAAQD,GAAO,QAAQ,eAAe,OAAO,EAC/B,CAACF,GAAa,SAAS,SAASE,GAAO,MAAM,GAC9C,CAACC,GAAO,SAASZ,CAAY,GAC9CM,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAE7C,EACA,gBAAS,iBAAiB,QAASQ,CAAkB,EAC9C,IAAM,SAAS,oBAAoB,QAASA,CAAkB,CACvE,EAAG,CAAC,CAAC,EAEL,MAAMG,EAAad,EAAQ,IAAM,CAC/B,MAAMe,EAAc,OAAO,KAAKN,GAAgB,CAAC,CAAC,EAClD,OAAOJ,GAAM,OAAQW,GAEZ,CADcD,GAAa,KAAME,GAAkBR,IAAeQ,CAAK,GAAG,SAAWD,GAAM,MAAM,CAEzG,CACH,EAAG,CAACP,EAAcJ,CAAI,CAAC,EAEvB,OACER,EAAC,OACC,IAAKa,EACL,UAAW,yGAAyGF,IAAUL,CAAK,EAAI,QAAU,QAAQ,GAEzJ,SAAAN,EAAC,OAAI,UAAW,6EACb,SAAAiB,GAAY,IAAI,CAACE,EAAWE,IAAe,CAC1C,MAAMC,EAAaH,GAAM,KAAOA,GAAM,WAAW,CAAC,GAAG,IACrD,OACEnB,EAAC,OAEC,QAAS,IAAM,CACbS,EAAU,CACR,GAAGF,EACH,CAACD,CAAK,EAAG,CACP,IAAKgB,EACL,KAAMH,GAAM,KACZ,OAAQA,GAAM,MAChB,CACF,CAAC,EACDT,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAC3C,EACA,MAAOa,GAAM,KACb,UAAW;AAAA,kBACPA,GAAM,SAAWZ,GAAQ,OAAS,eAAiB,EAAE,GAExD,SAAAY,GAAM,MAhBFE,CAiBP,CAEJ,CAAC,EACH,EACF,CAEJ,EAEA,IAAOE,EAAQlB",
|
|
6
6
|
"names": ["jsx", "useEffect", "useRef", "useMemo", "clickContent", "DropDown", "index", "active", "list", "setActive", "setVisible", "visible", "filterActive", "dropDownRef", "handleClickOutside", "event", "isDel", "handleList", "activeIndex", "item", "items", "id", "currentSku", "dropdown_default"]
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<Omit<any, "ref"> & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
3
|
-
className?: string;
|
|
4
|
-
data?: Record<string, any
|
|
3
|
+
className?: string | undefined;
|
|
4
|
+
data?: Record<string, any> | undefined;
|
|
5
5
|
}, "ref"> & React.RefAttributes<any>>;
|
|
6
6
|
export default _default;
|