npm - @anker-in/headless-ui - Versions diffs - 1.1.78 → 1.1.80 - Mend

@anker-in/headless-ui 1.1.78 → 1.1.80

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

Files changed (173) hide show

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefits/index.js.map ADDED Viewed

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefits/index.tsx"],
+  "sourcesContent": ["/* eslint-disable react/no-unknown-property */\nimport { Text, Picture, Heading } from '../../../../../../components/index.js'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { useBenefits } from '../../../../hooks/useBenefits.js'\nimport { formatPrice } from '../../../../utils/index.js'\nimport { replaceTemplate } from '../../../../utils/textFormat.js'\nimport React, { useEffect, useMemo, useState, type PropsWithChildren } from 'react'\nimport { useAiuiContext } from '../../../../../AiuiProvider/index.js'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { motion } from 'framer-motion'\nimport Close from '../../../../../HeaderNavigation/icons/Close.js'\nimport ModalContainer from './../ProductBenefitsTabs/ModalContainer.js'\n\n// \u6587\u6848\u914D\u7F6E\u63A5\u53E3\n\nexport type ModalData = {\n  needClickAway?: boolean\n  className?: string\n  title?: string\n  content?: string\n  domContent?: React.ReactNode\n}\n\ninterface BenefitsTabProps {}\n\nexport const BenefitsModal = ({\n  title,\n  showModal,\n  closeModal,\n  children,\n  className,\n}: PropsWithChildren<{\n  title?: string\n  showModal: boolean\n  closeModal: () => void\n  className?: string\n}>) => {\n  return (\n    <motion.div\n      animate={showModal ? { opacity: 1 } : { opacity: 0, pointerEvents: 'none' }}\n      transition={{ duration: 0.15, bounce: 0 }}\n      className=\"fixed inset-0 z-[1000] bg-black/50 opacity-0 tablet:flex tablet:items-center tablet:justify-center\"\n    >\n      {/* Mobile: Bottom sheet */}\n      <motion.div\n        animate={showModal ? { y: 0 } : { y: '100%' }}\n        transition={{ duration: 0.2, ease: 'easeOut' }}\n        className={cn(\n          'absolute bottom-0 left-0 right-0 max-w-[80vh] rounded-t-box tablet:rounded-box overflow-hidden bg-white',\n          'tablet:static tablet:h-auto tablet:max-h-[80vh] tablet:w-[896px] tablet:max-w-[90vw]',\n          className\n        )}\n      >\n        {/* Desktop: Scale animation wrapper */}\n        <motion.div\n          animate={showModal ? { scale: 1 } : { scale: 0.95 }}\n          transition={{ duration: 0.15, bounce: 0 }}\n          className=\"hidden size-full tablet:block\"\n        >\n          <div className=\"relative size-full overflow-auto\">\n            <div className=\"sticky top-0 z-[2] bg-white\">\n              {title && (\n                <Heading size={2} className=\"w-full py-6 px-4 text-xl tablet:px-8 tablet:pt-4 tablet:pb-2 font-bold\">\n                  {title}\n                </Heading>\n              )}\n              <button onClick={closeModal} className=\"absolute right-4 top-4 z-[2]\" aria-label=\"Close modal\">\n                <Close className=\"size-6\" />\n              </button>\n            </div>\n            {children}\n          </div>\n        </motion.div>\n\n        {/* Mobile: No scale animation */}\n        <div className=\"relative size-full overflow-auto tablet:hidden\">\n          <div className=\"sticky top-0 z-[2] bg-white\">\n            {title && <p className=\"w-full py-4 pl-5 text-xl font-bold\">{title}</p>}\n            <button onClick={closeModal} className=\"absolute right-4 top-4 z-[2]\" aria-label=\"Close modal\">\n              <Close className=\"size-6\" />\n            </button>\n          </div>\n          {children}\n        </div>\n      </motion.div>\n    </motion.div>\n  )\n}\n\nconst ProductBenefits = ({}: BenefitsTabProps) => {\n  const { profile, variant, renderInstallments, savingDetail, openSignInPopup, openAuthCodePopup, product } =\n    useBizProductContext()\n  const { activated = false } = profile || {} // \u7528\u6237\u662F\u5426\u6FC0\u6D3B\n\n  // \u7F13\u5B58 renderInstallments\uFF0C\u9632\u6B62 variant \u5207\u6362\u65F6\u53D8\u6210 undefined \u5BFC\u81F4\u4E0D\u6E32\u67D3\n  const [cachedInstallments, setCachedInstallments] = useState<React.ReactNode>(renderInstallments)\n\n  useEffect(() => {\n    if (renderInstallments) {\n      setCachedInstallments(renderInstallments)\n    }\n    // Affirm \u63D2\u4EF6\u5728 variant \u53D8\u5316\u540E\u9700\u8981\u5237\u65B0\n    if (typeof window !== 'undefined' && (window as any).affirm?.ui?.refresh) {\n      ;(window as any).affirm.ui.refresh()\n    }\n  }, [renderInstallments, variant.id])\n\n  const productBenefitsData = useMemo(() => {\n    return product?.payload?.components?.find((item: any) => item.componentKey === 'ProductBenefits')?.data || {}\n  }, [product?.payload])\n\n  const [isFlexModalOpen, setIsFlexModalOpen] = useState(false)\n  const [memberBenefitsModal, setMemberBenefitsModal] = useState(false)\n\n  const benefits = useBenefits({ variant })\n  const { locale = 'us', copyWriting } = useAiuiContext()\n\n  const { creditsRedemption, freeGift, bundle, fullGift, levelDiscount } = benefits\n\n  const coupons = [\n    creditsRedemption.enable\n      ? {\n          title: productBenefitsData?.creditsRedemption?.creditsTitle,\n          description: productBenefitsData?.creditsRedemption?.creditsDesc,\n          icon: <CreditsRedemptionIcon className=\"desktop:size-6 size-5\" />,\n        }\n      : null,\n    creditsRedemption.enable\n      ? {\n          title: (\n            <>\n              {!activated && Boolean(profile?.email) ? (\n                <>\n                  {productBenefitsData?.creditsRedemption?.creditsAfterActivation}\n                  <span role=\"button\" tabIndex={0} onClick={() => openAuthCodePopup?.()} className=\"underline\">\n                    {productBenefitsData?.creditsRedemption?.active}\n                  </span>\n                </>\n              ) : (\n                creditsRedemption?.config?.label?.replace(\n                  '{{amount}}',\n                  formatPrice({\n                    amount: creditsRedemption?.config?.amount ?? 0,\n                    currencyCode: variant.price.currencyCode,\n                    locale,\n                  })\n                )\n              )}\n            </>\n          ),\n          icon: <CreditsRedemptionIcon className=\"desktop:size-6 size-5\" />,\n        }\n      : null,\n    levelDiscount.enable\n      ? {\n          title: levelDiscount?.config?.title ?? '',\n          description: levelDiscount?.config?.tag ?? '',\n          icon: <LevelDiscountIcon className=\"desktop:size-6 size-5\" />,\n        }\n      : null,\n    fullGift.enable\n      ? {\n          title: fullGift?.config?.title ?? '',\n          description: fullGift?.config?.desc ?? '',\n          icon: <FullGiftIcon className=\"desktop:size-6 size-5\" />,\n        }\n      : null,\n    freeGift.enable\n      ? {\n          title: freeGift?.config?.title ?? '',\n          icon: <FreeGiftIcon className=\"desktop:size-6 size-5\" />,\n        }\n      : null,\n    bundle.enable\n      ? {\n          title: replaceTemplate(productBenefitsData?.bundle?.bundleSaveUpTo, {\n            count: formatPrice({\n              amount: Math.max(...(bundle?.config?.bundleList?.map((item: any) => item.savings ?? 0) ?? [])),\n              currencyCode: variant.price.currencyCode,\n              locale,\n            }),\n          }),\n          description: replaceTemplate(productBenefitsData?.bundle?.bundleOffer, {\n            count: bundle?.config?.bundleList?.length?.toString() || '',\n          }),\n          icon: <BundleIcon className=\"desktop:size-6 size-5\" />,\n        }\n      : null,\n    {\n      title: productBenefitsData?.paymentMethod?.title,\n      image: productBenefitsData?.paymentMethod?.image,\n      icon: <PaymentMethodIcon className=\"desktop:size-6 size-5\" />,\n      event: () => setIsFlexModalOpen(true),\n    },\n    {\n      useAble: true,\n      isAutoUse: Boolean(profile?.email) && !!savingDetail?.member,\n      title: Boolean(profile?.email) ? (\n        productBenefitsData?.member?.loginTitle\n      ) : (\n        <div>\n          <span\n            className=\"mr-2 desktop:mr-3\"\n            dangerouslySetInnerHTML={{ __html: productBenefitsData?.member?.unloginTitle }}\n          ></span>\n          <span\n            role=\"button\"\n            tabIndex={0}\n            onClick={e => {\n              e?.stopPropagation()\n              openSignInPopup?.()\n            }}\n            className=\"underline text-nowrap\"\n            dangerouslySetInnerHTML={{ __html: productBenefitsData?.member?.loginNow }}\n          />\n        </div>\n      ),\n      icon: <MemberDiscountIcon className=\"desktop:size-6 size-5\" />,\n      event: () => setMemberBenefitsModal(true),\n    },\n    cachedInstallments\n      ? {\n          customRenderTitle: cachedInstallments,\n          icon: <InstallmentsIcon className=\"desktop:size-6 size-5\" />,\n        }\n      : null,\n  ].filter(Boolean)\n\n  \n  return (\n    <div>\n      {productBenefitsData?.benefitTitle && (\n        <Text\n          as=\"div\"\n          html={productBenefitsData?.benefitTitle}\n          className=\"text-sm mb-3 lg-desktop:mb-4 lg-desktop:text-base font-bold leading-[1.2]\"\n        />\n      )}\n      <ul className=\"desktop:px-4 px-3 rounded-box bg-[#F5F6F7]\">\n        <>\n          {coupons?.map((item, index) => (\n            <li key={index}>\n              <div className=\"flex gap-3 items-start py-3 laptop:py-4\">\n                <div className=\"shrink-0\">{item?.icon}</div>\n                <div\n                  onClick={item?.event}\n                  className={cn(\n                    'flex flex-1 items-center gap-1 desktop:gap-2',\n                    item?.event && 'cursor-pointer  justify-between'\n                  )}\n                >\n                  <div>\n                    {item?.customRenderTitle ? (\n                      <div>{item?.customRenderTitle}</div>\n                    ) : (\n                      <div className=\"flex items-center gap-2 desktop:gap-3 text-[14px] laptop:text-base font-bold leading-[1.2]\">\n                        {item?.title}\n                        {item?.image && <Picture source={item?.image} className=\"w-[40px] h-[20px] shrink-0\" />}\n                      </div>\n                    )}\n                    {item?.description && (\n                      <Text\n                        {...(typeof item.description === 'string' ? { html: item.description } : {})}\n                        as=\"p\"\n                        className=\"laptop:text-[14px] text-[12px] font-bold text-[#2A2C32]\"\n                      >\n                        {item.description}\n                      </Text>\n                    )}\n                  </div>\n                  {item?.event && <RightArrowIcon className=\"size-4 desktop:size-6\" />}\n                </div>\n              </div>\n              {index != coupons?.length - 1 && <div className=\"bg-[#DADCE0] h-[1px]\" />}\n            </li>\n          ))}\n        </>\n      </ul>\n      <ModalContainer showModal={isFlexModalOpen} closeModal={() => setIsFlexModalOpen(false)}>\n        <Picture source={productBenefitsData?.paymentMethod?.payImage}></Picture>\n      </ModalContainer>\n      <BenefitsModal\n        title={productBenefitsData?.member?.modelTitle}\n        showModal={memberBenefitsModal}\n        closeModal={() => setMemberBenefitsModal(false)}\n      >\n        <ul className=\"flex flex-col overflow-y-auto tablet:max-h-[calc(80vh-52px)] tablet:py-8 gap-5 pb-6 tablet:pb-8 tablet:gap-8 px-4 tablet:px-8\">\n          {productBenefitsData?.member?.modelBenefits?.map(\n            (benefit: { title?: string; desc?: string }, index: number) => (\n              <li key={index} className=\"flex flex-col gap-1\">\n                <Text html={benefit?.title} className=\"text-[16px] tablet:text-[18px] font-bold leading-[1.4]\" />\n                <Text\n                  html={benefit?.desc}\n                  className=\"text-[14px] text-[#1D1D1F] tablet:text-[16px] font-bold leading-[1.4] opacity-75\"\n                />\n              </li>\n            )\n          )}\n        </ul>\n      </BenefitsModal>\n    </div>\n  )\n}\n\n// Credits Redemption Icon\nconst CreditsRedemptionIcon = ({ className }: { className?: string }) => (\n  <svg className={className} viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      d=\"M12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1ZM12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM17 13C17.5523 13 18 13.4477 18 14C18 14.5523 17.5523 15 17 15H9.41406L9.70703 15.293C10.0976 15.6835 10.0976 16.3165 9.70703 16.707C9.31651 17.0976 8.68349 17.0976 8.29297 16.707L6.29297 14.707C6.00697 14.421 5.92139 13.9909 6.07617 13.6172C6.23098 13.2436 6.59558 13 7 13H17ZM14.293 7.29297C14.6835 6.90244 15.3165 6.90244 15.707 7.29297L17.707 9.29297C17.993 9.57897 18.0786 10.0091 17.9238 10.3828C17.769 10.7564 17.4044 11 17 11H7C6.44772 11 6 10.5523 6 10C6 9.44771 6.44772 9 7 9H14.5859L14.293 8.70703C13.9024 8.31651 13.9024 7.68349 14.293 7.29297Z\"\n      fill=\"#1D1D1F\"\n    />\n  </svg>\n)\n\nconst MemberDiscountIcon = ({ className }: { className?: string }) => (\n  <svg className={className} xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M14.4294 1.58368C15.0354 1.5838 15.6026 1.88286 15.944 2.38348L19.4997 7.5993C19.9918 8.32123 19.9058 9.29041 19.2946 9.91473L11.8571 17.5104C10.8453 18.5435 9.18314 18.5447 8.16961 17.5134L0.696949 9.90692C0.0916662 9.29063 -0.000821769 8.3354 0.474293 7.61395L3.90203 2.4079C4.24121 1.89312 4.81678 1.58368 5.43328 1.58368H14.4294ZM2.00457 8.62177L9.47722 16.2292C9.77143 16.5282 10.2539 16.5278 10.5475 16.2282L17.9841 8.63153L14.4294 3.41669H5.43328L2.00457 8.62177ZM13.5759 7.74481C13.9008 7.41946 14.4279 7.41834 14.7536 7.74286C15.0792 8.06792 15.0804 8.59584 14.7555 8.92157L10.6247 13.0593C10.2833 13.401 9.72933 13.4013 9.38738 13.0602L5.24382 8.92352C4.91829 8.59852 4.9172 8.07056 5.24187 7.74481C5.56689 7.41925 6.09484 7.41813 6.42058 7.74286L10.0046 11.321L13.5759 7.74481Z\"\n      fill=\"#080A0F\"\n    />\n  </svg>\n)\n\nconst LevelDiscountIcon = ({ className }: { className?: string }) => (\n  <svg className={className} xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n    <path\n      d=\"M13.1615 5.66083C13.4869 5.33539 14.0144 5.33539 14.3398 5.66083C14.6653 5.98626 14.6653 6.51378 14.3398 6.83921L6.83984 14.3392C6.51441 14.6646 5.98689 14.6646 5.66146 14.3392C5.33602 14.0138 5.33602 13.4863 5.66146 13.1608L13.1615 5.66083Z\"\n      fill=\"#080A0F\"\n    />\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M12.709 11.0417C13.6295 11.0417 14.3756 11.7879 14.3756 12.7084C14.3756 13.6288 13.6295 14.375 12.709 14.375C11.7885 14.375 11.0423 13.6288 11.0423 12.7084C11.0423 11.7879 11.7885 11.0417 12.709 11.0417ZM12.709 12.2917C12.4789 12.2917 12.2923 12.4782 12.2923 12.7084C12.2923 12.9385 12.4789 13.125 12.709 13.125C12.9391 13.125 13.1256 12.9385 13.1256 12.7084C13.1256 12.4782 12.9391 12.2917 12.709 12.2917Z\"\n      fill=\"#080A0F\"\n    />\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M7.29232 5.62502C8.21279 5.62502 8.95898 6.37121 8.95898 7.29169C8.95898 8.21216 8.21279 8.95835 7.29232 8.95835C6.37184 8.95835 5.62565 8.21216 5.62565 7.29169C5.62565 6.37121 6.37184 5.62502 7.29232 5.62502ZM7.29232 6.87502C7.0622 6.87502 6.87565 7.06157 6.87565 7.29169C6.87565 7.52181 7.0622 7.70835 7.29232 7.70835C7.52244 7.70835 7.70898 7.52181 7.70898 7.29169C7.70898 7.06157 7.52244 6.87502 7.29232 6.87502Z\"\n      fill=\"#080A0F\"\n    />\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M16.6673 2.91669C18.048 2.91669 19.1673 4.03597 19.1673 5.41669V8.0469C19.1673 8.39923 18.9458 8.71388 18.6139 8.83221C18.0561 9.03101 17.652 9.57037 17.652 10.2084C17.652 10.8463 18.0561 11.3857 18.6139 11.5845C18.9458 11.7028 19.1673 12.0175 19.1673 12.3698V15C19.1673 16.3807 18.048 17.5 16.6673 17.5H3.33398C1.95327 17.5 0.833984 16.3807 0.833984 15V12.3698L0.84375 12.2396C0.890672 11.9418 1.09696 11.688 1.38737 11.5845C1.94519 11.3857 2.34928 10.8463 2.34928 10.2084C2.34928 9.57036 1.94519 9.03101 1.38737 8.83221C1.05551 8.71388 0.833984 8.39923 0.833984 8.0469V5.41669C0.833985 4.03598 1.95327 2.91669 3.33398 2.91669H16.6673ZM3.33398 4.58335C2.87375 4.58335 2.50065 4.95645 2.50065 5.41669V7.52606C3.40888 8.07233 4.01595 9.06946 4.01595 10.2084C4.01595 11.3471 3.40868 12.3435 2.50065 12.8898V15C2.50065 15.4603 2.87375 15.8334 3.33398 15.8334H16.6673C17.1276 15.8334 17.5006 15.4603 17.5006 15V12.8898C16.5926 12.3435 15.9853 11.3471 15.9853 10.2084C15.9853 9.06945 16.5924 8.07233 17.5006 7.52606V5.41669C17.5006 4.95645 17.1276 4.58335 16.6673 4.58335H3.33398Z\"\n      fill=\"#080A0F\"\n    />\n  </svg>\n)\n\nconst FreeGiftIcon = ({ className }: { className?: string }) => (\n  <svg className={className} xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M12.4951 1.47201C12.791 1.17663 13.2707 1.17634 13.5664 1.47201C13.862 1.76788 13.8622 2.24851 13.5664 2.54428L11.8301 4.2806H17.5752C17.9935 4.28073 18.333 4.62012 18.333 5.03842V8.06869C18.333 8.48701 17.9935 8.82638 17.5752 8.8265H17.1982V17.1595C17.198 17.5776 16.8585 17.9171 16.4404 17.9173H3.56152C3.14327 17.9173 2.80394 17.5777 2.80371 17.1595V8.8265H2.42383C2.00543 8.8265 1.66602 8.48709 1.66602 8.06869V5.03842C1.66605 4.62005 2.00545 4.2806 2.42383 4.2806H8.16992L6.43359 2.54428C6.13775 2.24843 6.13776 1.76786 6.43359 1.47201C6.72945 1.17616 7.21001 1.17616 7.50586 1.47201L10 3.96615L12.4951 1.47201ZM4.31934 16.4017H9.24219V8.8265H4.31934V16.4017ZM10.7578 16.4017H15.6826V8.8265H10.7578V16.4017ZM3.18164 7.31088H16.8174V5.79623H3.18164V7.31088Z\"\n      fill=\"#080A0F\"\n    />\n  </svg>\n)\n\nconst BundleIcon = ({ className }: { className?: string }) => (\n  <svg className={className} xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n    <path\n      d=\"M14.1152 1.18357L14.2551 1.26642L18.4546 3.9088C18.8514 4.15858 19.178 4.50301 19.4043 4.91029C19.6306 5.31758 19.7492 5.77458 19.7493 6.23909V16.0194C19.7495 16.3825 19.6772 16.742 19.5366 17.0775C19.396 17.413 19.1898 17.7179 18.9298 17.9747C18.6697 18.2315 18.361 18.4352 18.0212 18.5742C17.6814 18.7132 17.3172 18.7847 16.9494 18.7847H8.55091C8.1623 18.7852 7.77786 18.7056 7.42219 18.5511C7.06652 18.3965 6.74745 18.1704 6.48539 17.8871L1.61712 16.3743C1.35494 16.2904 1.11208 16.1563 0.902404 15.9797C0.692732 15.8031 0.520358 15.5875 0.395126 15.3451C0.269895 15.1027 0.194259 14.8384 0.172541 14.5672C0.150822 14.296 0.183446 14.0232 0.268548 13.7644L3.25386 4.69868C3.36315 4.36757 3.55522 4.06899 3.81232 3.83053C4.06942 3.59207 4.38326 3.42141 4.72484 3.33434L9.66236 2.26275L11.246 1.26642C11.6722 0.998206 12.1641 0.848941 12.6694 0.834475C13.1747 0.820008 13.6746 0.94088 14.1159 1.18426L14.1152 1.18357ZM11.9979 2.44503L7.79829 5.08741C7.59979 5.21229 7.43639 5.38454 7.32319 5.58825C7.20998 5.79196 7.15061 6.02055 7.15058 6.2529V16.0201C7.15058 16.7838 7.7773 17.4024 8.55021 17.4024H16.9494C17.1333 17.4025 17.3155 17.3668 17.4855 17.2974C17.6555 17.228 17.8099 17.1261 17.94 16.9978C18.0701 16.8694 18.1733 16.717 18.2438 16.5492C18.3142 16.3815 18.3504 16.2017 18.3504 16.0201V6.2529C18.3504 5.78063 18.1056 5.3415 17.7027 5.08741L13.5031 2.44503C13.2784 2.30354 13.0174 2.22837 12.7508 2.22837C12.4843 2.22837 12.2233 2.30354 11.9986 2.44503H11.9979ZM6.49449 4.36243L5.07457 4.67106C4.96068 4.70009 4.85604 4.757 4.77033 4.83654C4.68463 4.91607 4.62062 5.01565 4.58425 5.12608L1.59823 14.1911C1.56987 14.2774 1.559 14.3683 1.56626 14.4587C1.57351 14.5491 1.59875 14.6373 1.64051 14.7181C1.68228 14.7988 1.73976 14.8707 1.80968 14.9296C1.87959 14.9884 1.96057 15.0331 2.04799 15.0611L5.76005 16.2459C5.75394 16.1708 5.75091 16.0955 5.75095 16.0201V6.23978C5.75095 5.53552 6.02235 4.86715 6.49518 4.36243H6.49449ZM15.4938 11.8801C15.909 11.8803 16.3148 12.0019 16.6599 12.2297C17.005 12.4575 17.2739 12.7812 17.4327 13.1599C17.5914 13.5386 17.6329 13.9552 17.5517 14.3571C17.4706 14.759 17.2706 15.1282 16.9769 15.4178C16.6832 15.7075 16.3091 15.9048 15.9019 15.9846C15.4947 16.0644 15.0727 16.0232 14.6892 15.8663C14.3057 15.7093 13.9779 15.4436 13.7474 15.1028C13.5168 14.762 13.3939 14.3613 13.394 13.9515C13.394 12.8074 14.3341 11.8801 15.4938 11.8801ZM10.0995 13.5124L15.0489 8.63015C15.1753 8.50803 15.3437 8.4376 15.5204 8.43301C15.6972 8.42841 15.8691 8.48998 16.0018 8.60536C16.1344 8.72074 16.2179 8.88139 16.2355 9.05504C16.2532 9.22869 16.2036 9.40249 16.0967 9.54155L16.0387 9.60645L11.0893 14.4887C10.963 14.6108 10.7945 14.6812 10.6178 14.6858C10.4411 14.6904 10.2691 14.6288 10.1365 14.5135C10.0038 14.3981 9.92029 14.2374 9.90267 14.0638C9.88506 13.8901 9.93464 13.7163 10.0415 13.5773L10.0995 13.5124ZM15.4938 13.261C15.3083 13.261 15.1304 13.3338 14.9992 13.4633C14.868 13.5928 14.7943 13.7684 14.7943 13.9515C14.7943 14.1346 14.868 14.3102 14.9992 14.4397C15.1304 14.5692 15.3083 14.642 15.4938 14.642C15.6793 14.642 15.8572 14.5692 15.9884 14.4397C16.1196 14.3102 16.1933 14.1346 16.1933 13.9515C16.1933 13.7684 16.1196 13.5928 15.9884 13.4633C15.8572 13.3338 15.6793 13.261 15.4938 13.261ZM10.5947 7.04693C11.0099 7.04706 11.4157 7.16872 11.7608 7.39652C12.1059 7.62431 12.3749 7.94801 12.5336 8.32668C12.6924 8.70536 12.7338 9.12199 12.6527 9.5239C12.5715 9.92582 12.3715 10.295 12.0778 10.5846C11.7842 10.8743 11.4101 11.0716 11.0029 11.1514C10.5957 11.2312 10.1736 11.19 9.79012 11.0331C9.40661 10.8761 9.07886 10.6104 8.84833 10.2696C8.61779 9.92877 8.49482 9.52811 8.49496 9.1183C8.49496 7.97421 9.43504 7.04693 10.5947 7.04693ZM10.5947 8.42784C10.5029 8.4278 10.4119 8.44561 10.327 8.48027C10.2422 8.51492 10.165 8.56574 10.1 8.62983C9.96881 8.75925 9.89503 8.93483 9.89493 9.11795C9.89484 9.30107 9.96845 9.47673 10.0996 9.60628C10.2307 9.73583 10.4085 9.80866 10.594 9.80876C10.7796 9.80876 10.9575 9.73601 11.0886 9.60653C11.2198 9.47704 11.2935 9.30142 11.2935 9.1183C11.2935 8.93518 11.2198 8.75956 11.0886 8.63007C10.9575 8.50059 10.7796 8.42784 10.594 8.42784H10.5947Z\"\n      fill=\"#080A0F\"\n      stroke=\"#080A0F\"\n      stroke-width=\"0.166667\"\n    />\n  </svg>\n)\n\nconst FullGiftIcon = ({ className }: { className?: string }) => (\n  <svg className={className} xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M5.45492 6.28808C6.43123 5.31177 8.01457 5.31177 8.99089 6.28808C9.96696 7.26431 9.96685 8.84695 8.99089 9.82324C8.01457 10.7996 6.43123 10.7996 5.45492 9.82324C4.47891 8.84694 4.4788 7.26431 5.45492 6.28808ZM8.04769 7.23047C7.59205 6.77513 6.85282 6.77495 6.3973 7.23047C5.94188 7.686 5.94199 8.42526 6.3973 8.88086C6.85287 9.33643 7.59207 9.33636 8.04769 8.88086C8.5033 8.42525 8.5033 7.68608 8.04769 7.23047Z\"\n      fill=\"#080A0F\"\n    />\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M9.07715 1.95703C9.58012 1.90116 10.0815 2.07705 10.4395 2.43473L18.1234 10.1187C18.7739 10.7695 18.7741 11.8246 18.1234 12.4754L11.6414 18.9574C10.9907 19.6081 9.93555 19.6079 9.28467 18.9574L1.60075 11.2734C1.28783 10.9603 1.11442 10.5376 1.11328 10.0999L1.12305 9.91113L1.77165 4.0778C1.85775 3.30308 2.46909 2.69171 3.24381 2.60563L9.07715 1.95703ZM3.42773 4.26172L2.77913 10.095L10.4631 17.779L16.945 11.297L9.26107 3.61312L3.42773 4.26172Z\"\n      fill=\"#080A0F\"\n    />\n  </svg>\n)\n\nconst InstallmentsIcon = ({ className }: { className?: string }) => (\n  <svg className={className} xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n    <path\n      d=\"M14.1673 11.8326C14.5355 11.8326 14.8338 12.131 14.8338 12.4991V13.4985H15.834C16.2022 13.4985 16.5005 13.7968 16.5005 14.165C16.5005 14.5332 16.2022 14.8315 15.834 14.8315H14.1844C14.1787 14.8316 14.173 14.8323 14.1673 14.8323C13.7991 14.8323 13.5008 14.534 13.5008 14.1658V12.4991C13.5008 12.131 13.7991 11.8326 14.1673 11.8326Z\"\n      fill=\"#1D1D1F\"\n    />\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M14.584 9.16581C17.1153 9.16581 19.1673 11.2178 19.1673 13.7491C19.1673 16.2805 17.1153 18.3325 14.584 18.3325C12.0527 18.3325 10.0007 16.2804 10.0007 13.7491C10.0007 11.2178 12.0527 9.16581 14.584 9.16581ZM14.584 10.4988C12.7891 10.4988 11.3337 11.9542 11.3337 13.7491C11.3337 15.5441 12.7891 16.9995 14.584 16.9995C16.3789 16.9995 17.8343 15.5441 17.8343 13.7491C17.8343 11.9542 16.3789 10.4988 14.584 10.4988Z\"\n      fill=\"#1D1D1F\"\n    />\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M16.6673 2.49915C18.048 2.49915 19.1673 3.61843 19.1673 4.99915V9.16581C19.1673 9.62605 18.7942 9.99915 18.334 9.99915C17.8737 9.99915 17.5006 9.62605 17.5006 9.16581V8.33248H2.50065V14.9991C2.50065 15.4594 2.87375 15.8325 3.33398 15.8325H9.16732C9.62755 15.8325 10.0007 16.2056 10.0007 16.6658C10.0007 17.126 9.62755 17.4991 9.16732 17.4991H3.33398C1.95327 17.4991 0.833984 16.3799 0.833984 14.9991V4.99915C0.833984 3.61843 1.95327 2.49915 3.33398 2.49915H16.6673ZM3.33398 4.16581C2.87375 4.16581 2.50065 4.53891 2.50065 4.99915V6.66581H17.5006V4.99915C17.5006 4.53891 17.1276 4.16581 16.6673 4.16581H3.33398Z\"\n      fill=\"#1D1D1F\"\n    />\n  </svg>\n)\n\nconst PaymentMethodIcon = ({ className }: { className?: string }) => (\n  <svg className={className} xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n    <path\n      d=\"M16.667 2.49915C18.0476 2.49915 19.1668 3.61858 19.167 4.99915V14.9991C19.1668 16.3797 18.0476 17.4991 16.667 17.4991H3.33398C1.95353 17.499 0.834161 16.3796 0.833984 14.9991V4.99915C0.83416 3.61869 1.95353 2.49932 3.33398 2.49915H16.667ZM2.5 14.9991C2.50018 15.4591 2.87401 15.832 3.33398 15.8322H16.667C17.1271 15.8322 17.4998 15.4592 17.5 14.9991V8.33215H2.50098L2.5 8.33118V14.9991ZM10.001 12.5333C10.4426 12.5335 10.8007 12.8915 10.8008 13.3331C10.8008 13.7748 10.4427 14.1328 10.001 14.1329H5.00098C4.55915 14.1329 4.20117 13.775 4.20117 13.3331C4.20126 12.8914 4.5592 12.5333 5.00098 12.5333H10.001ZM3.33398 4.16516C2.874 4.16534 2.50018 4.53917 2.5 4.99915V6.66614H17.5V4.99915C17.4998 4.53906 17.1271 4.16516 16.667 4.16516H3.33398Z\"\n      fill=\"#080A0F\"\n    />\n  </svg>\n)\n\nconst RightArrowIcon = ({ className }: { className?: string }) => (\n  <svg className={className} width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      d=\"M6.91058 4.4108C7.23602 4.08536 7.76353 4.08536 8.08897 4.4108L13.089 9.41079C13.4144 9.73623 13.4144 10.2637 13.089 10.5892L8.08897 15.5892C7.76353 15.9146 7.23602 15.9146 6.91058 15.5892C6.58515 15.2637 6.58514 14.7362 6.91058 14.4108L11.3214 9.99999L6.91058 5.58918C6.58514 5.26374 6.58514 4.73623 6.91058 4.4108Z\"\n      fill=\"#080A0F\"\n    />\n  </svg>\n)\n\nexport default ProductBenefits\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "Text", "Picture", "Heading", "useBizProductContext", "useBenefits", "formatPrice", "replaceTemplate", "useEffect", "useMemo", "useState", "useAiuiContext", "cn", "motion", "Close", "ModalContainer", "BenefitsModal", "title", "showModal", "closeModal", "children", "className", "ProductBenefits", "profile", "variant", "renderInstallments", "savingDetail", "openSignInPopup", "openAuthCodePopup", "product", "activated", "cachedInstallments", "setCachedInstallments", "productBenefitsData", "item", "isFlexModalOpen", "setIsFlexModalOpen", "memberBenefitsModal", "setMemberBenefitsModal", "benefits", "locale", "copyWriting", "creditsRedemption", "freeGift", "bundle", "fullGift", "levelDiscount", "coupons", "CreditsRedemptionIcon", "LevelDiscountIcon", "FullGiftIcon", "FreeGiftIcon", "BundleIcon", "PaymentMethodIcon", "e", "MemberDiscountIcon", "InstallmentsIcon", "index", "RightArrowIcon", "benefit", "ProductBenefits_default"]
+}

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as l}from"react/jsx-runtime";import{cn as o}from"../../../../../../helpers/index.js";import{motion as a}from"framer-motion";import d from"react";import p from"../../../../../HeaderNavigation/icons/Close.js";const b=({title:t,className:n,showModal:i,closeModal:s,children:r,stickyHeader:m=!0})=>{const c=d.useRef(null);return e(a.div,{animate:i?{opacity:1}:{opacity:0,pointerEvents:"none"},transition:{duration:.1,bounce:0},className:"fixed left-0 top-0 z-[1000] flex size-full items-center justify-center bg-black/50 opacity-0",children:e(a.div,{transition:{duration:.1,bounce:0},ref:c,animate:i?{scale:1}:{scale:.7},children:l("div",{className:o("relative z-1 max-h-[80vh] w-min min-w-[600px] overflow-scroll rounded-xl bg-white md:min-w-[90vw]",n),children:[l("div",{className:o(m&&"sticky top-0 z-[2] bg-white"),children:[t&&e("p",{className:o("w-full border-b border-[#e6e6e6] py-[16px] pl-[20px] pr-[60px] text-[20px] font-bold"),children:t}),e("button",{onClick:s,className:"close-button absolute right-4 top-5 z-[2]","aria-label":"Close modal",children:e(p,{className:"size-[24px]"})})]}),r]})})})};var h=b;export{h as default};
+import{jsx as e,jsxs as l}from"react/jsx-runtime";import{cn as o}from"../../../../../../helpers/index.js";import{motion as a}from"framer-motion";import d from"react";import p from"../../../../../HeaderNavigation/icons/Close.js";const b=({title:t,className:n,showModal:i,closeModal:s,children:r,stickyHeader:c=!0})=>{const m=d.useRef(null);return e(a.div,{animate:i?{opacity:1}:{opacity:0,pointerEvents:"none"},transition:{duration:.1,bounce:0},className:"fixed left-0 top-0 z-[1000] flex size-full items-center justify-center bg-black/50 opacity-0",children:e(a.div,{transition:{duration:.1,bounce:0},ref:m,animate:i?{scale:1}:{scale:.7},children:l("div",{className:o("relative z-1 max-h-[80vh] w-min tablet:min-w-[600px] overflow-scroll rounded-xl bg-white min-w-[90vw]",n),children:[l("div",{className:o(c&&"sticky top-0 z-[2] bg-white"),children:[t&&e("p",{className:o("w-full border-b border-[#e6e6e6] py-[16px] pl-[20px] pr-[60px] text-[20px] font-bold"),children:t}),e("button",{onClick:s,className:"close-button absolute right-4 top-5 z-[2]","aria-label":"Close modal",children:e(p,{className:"size-[24px]"})})]}),r]})})})};var h=b;export{h as default};
 //# sourceMappingURL=ModalContainer.js.map

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/ModalContainer.tsx"],
-  "sourcesContent": ["import { cn as classNames } from '../../../../../../helpers/index.js'\nimport { motion } from 'framer-motion'\nimport React, { type PropsWithChildren } from 'react'\nimport Close from '../../../../../HeaderNavigation/icons/Close.js'\n\nconst ModalContainer = ({\n  title,\n  className,\n  showModal,\n  closeModal,\n  children,\n  stickyHeader = true,\n}: PropsWithChildren<{\n  title?: string\n  className?: string\n  showModal: boolean\n  closeModal: () => void\n  needClickAway?: boolean\n  stickyHeader?: boolean\n}>) => {\n  const modalRef = React.useRef<HTMLDivElement>(null)\n\n  return (\n    <motion.div\n      animate={showModal ? { opacity: 1 } : { opacity: 0, pointerEvents: 'none' }}\n      transition={{ duration: 0.1, bounce: 0 }}\n      className=\"fixed left-0 top-0 z-[1000] flex size-full items-center justify-center bg-black/50 opacity-0\"\n    >\n      <motion.div\n        transition={{ duration: 0.1, bounce: 0 }}\n        ref={modalRef}\n        animate={showModal ? { scale: 1 } : { scale: 0.7 }}\n      >\n        <div\n          className={classNames(\n            'relative z-1 max-h-[80vh] w-min min-w-[600px] overflow-scroll rounded-xl bg-white md:min-w-[90vw]',\n            className\n          )}\n        >\n          <div className={classNames(stickyHeader && 'sticky top-0 z-[2] bg-white')}>\n            {title && (\n              <p\n                className={classNames(\n                  'w-full border-b border-[#e6e6e6] py-[16px] pl-[20px] pr-[60px] text-[20px] font-bold'\n                )}\n              >\n                {title}\n              </p>\n            )}\n            <button\n              onClick={closeModal}\n              className={'close-button absolute right-4 top-5 z-[2]'}\n              aria-label=\"Close modal\"\n            >\n              <Close className=\"size-[24px]\" />\n            </button>\n          </div>\n          {children}\n        </div>\n      </motion.div>\n    </motion.div>\n  )\n}\n\nexport default ModalContainer\n"],
-  "mappings": "AAuCU,OAEI,OAAAA,EAFJ,QAAAC,MAAA,oBAvCV,OAAS,MAAMC,MAAkB,qCACjC,OAAS,UAAAC,MAAc,gBACvB,OAAOC,MAAuC,QAC9C,OAAOC,MAAW,iDAElB,MAAMC,EAAiB,CAAC,CACtB,MAAAC,EACA,UAAAC,EACA,UAAAC,EACA,WAAAC,EACA,SAAAC,EACA,aAAAC,EAAe,EACjB,IAOO,CACL,MAAMC,EAAWT,EAAM,OAAuB,IAAI,EAElD,OACEJ,EAACG,EAAO,IAAP,CACC,QAASM,EAAY,CAAE,QAAS,CAAE,EAAI,CAAE,QAAS,EAAG,cAAe,MAAO,EAC1E,WAAY,CAAE,SAAU,GAAK,OAAQ,CAAE,EACvC,UAAU,+FAEV,SAAAT,EAACG,EAAO,IAAP,CACC,WAAY,CAAE,SAAU,GAAK,OAAQ,CAAE,EACvC,IAAKU,EACL,QAASJ,EAAY,CAAE,MAAO,CAAE,EAAI,CAAE,MAAO,EAAI,EAEjD,SAAAR,EAAC,OACC,UAAWC,EACT,oGACAM,CACF,EAEA,UAAAP,EAAC,OAAI,UAAWC,EAAWU,GAAgB,6BAA6B,EACrE,UAAAL,GACCP,EAAC,KACC,UAAWE,EACT,sFACF,EAEC,SAAAK,EACH,EAEFP,EAAC,UACC,QAASU,EACT,UAAW,4CACX,aAAW,cAEX,SAAAV,EAACK,EAAA,CAAM,UAAU,cAAc,EACjC,GACF,EACCM,GACH,EACF,EACF,CAEJ,EAEA,IAAOG,EAAQR",
+  "sourcesContent": ["import { cn as classNames } from '../../../../../../helpers/index.js'\nimport { motion } from 'framer-motion'\nimport React, { type PropsWithChildren } from 'react'\nimport Close from '../../../../../HeaderNavigation/icons/Close.js'\n\nconst ModalContainer = ({\n  title,\n  className,\n  showModal,\n  closeModal,\n  children,\n  stickyHeader = true,\n}: PropsWithChildren<{\n  title?: string\n  className?: string\n  showModal: boolean\n  closeModal: () => void\n  needClickAway?: boolean\n  stickyHeader?: boolean\n}>) => {\n  const modalRef = React.useRef<HTMLDivElement>(null)\n\n  return (\n    <motion.div\n      animate={showModal ? { opacity: 1 } : { opacity: 0, pointerEvents: 'none' }}\n      transition={{ duration: 0.1, bounce: 0 }}\n      className=\"fixed left-0 top-0 z-[1000] flex size-full items-center justify-center bg-black/50 opacity-0\"\n    >\n      <motion.div\n        transition={{ duration: 0.1, bounce: 0 }}\n        ref={modalRef}\n        animate={showModal ? { scale: 1 } : { scale: 0.7 }}\n      >\n        <div\n          className={classNames(\n            'relative z-1 max-h-[80vh] w-min tablet:min-w-[600px] overflow-scroll rounded-xl bg-white min-w-[90vw]',\n            className\n          )}\n        >\n          <div className={classNames(stickyHeader && 'sticky top-0 z-[2] bg-white')}>\n            {title && (\n              <p\n                className={classNames(\n                  'w-full border-b border-[#e6e6e6] py-[16px] pl-[20px] pr-[60px] text-[20px] font-bold'\n                )}\n              >\n                {title}\n              </p>\n            )}\n            <button\n              onClick={closeModal}\n              className={'close-button absolute right-4 top-5 z-[2]'}\n              aria-label=\"Close modal\"\n            >\n              <Close className=\"size-[24px]\" />\n            </button>\n          </div>\n          {children}\n        </div>\n      </motion.div>\n    </motion.div>\n  )\n}\n\nexport default ModalContainer\n"],
+  "mappings": "AAuCU,OAEI,OAAAA,EAFJ,QAAAC,MAAA,oBAvCV,OAAS,MAAMC,MAAkB,qCACjC,OAAS,UAAAC,MAAc,gBACvB,OAAOC,MAAuC,QAC9C,OAAOC,MAAW,iDAElB,MAAMC,EAAiB,CAAC,CACtB,MAAAC,EACA,UAAAC,EACA,UAAAC,EACA,WAAAC,EACA,SAAAC,EACA,aAAAC,EAAe,EACjB,IAOO,CACL,MAAMC,EAAWT,EAAM,OAAuB,IAAI,EAElD,OACEJ,EAACG,EAAO,IAAP,CACC,QAASM,EAAY,CAAE,QAAS,CAAE,EAAI,CAAE,QAAS,EAAG,cAAe,MAAO,EAC1E,WAAY,CAAE,SAAU,GAAK,OAAQ,CAAE,EACvC,UAAU,+FAEV,SAAAT,EAACG,EAAO,IAAP,CACC,WAAY,CAAE,SAAU,GAAK,OAAQ,CAAE,EACvC,IAAKU,EACL,QAASJ,EAAY,CAAE,MAAO,CAAE,EAAI,CAAE,MAAO,EAAI,EAEjD,SAAAR,EAAC,OACC,UAAWC,EACT,wGACAM,CACF,EAEA,UAAAP,EAAC,OAAI,UAAWC,EAAWU,GAAgB,6BAA6B,EACrE,UAAAL,GACCP,EAAC,KACC,UAAWE,EACT,sFACF,EAEC,SAAAK,EACH,EAEFP,EAAC,UACC,QAASU,EACT,UAAW,4CACX,aAAW,cAEX,SAAAV,EAACK,EAAA,CAAM,UAAU,cAAc,EACjC,GACF,EACCM,GACH,EACF,EACF,CAEJ,EAEA,IAAOG,EAAQR",
   "names": ["jsx", "jsxs", "classNames", "motion", "React", "Close", "ModalContainer", "title", "className", "showModal", "closeModal", "children", "stickyHeader", "modalRef", "ModalContainer_default"]
 }

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as i,jsxs as a}from"react/jsx-runtime";import{Text as l,Picture as N,Checkbox as b}from"../../../../../../components/index.js";import{cn as u}from"../../../../../../helpers/index.js";import{useAiuiContext as B}from"../../../../../AiuiProvider/index.js";import{useBizProductContext as E}from"../../../../BizProductProvider.js";import{formatPrice as f}from"../../../../utils/index.js";import{withLayout as P}from"../../../../../../shared/Styles.js";const L=()=>{const{locale:d="us"}=B(),{variant:v,bundle:x,checkedBundle:o,setCheckedBundle:s,setCheckedGift:z,savingDetail:w,setSavingDetail:D,setCheckedExchangePurchase:A,setJoinedRecommendBuyProducts:c,joinedRecommendBuyProducts:n,setAddOrder:p}=E(),{title:g,bundleList:h,showAtListing:k}=x||{},m=h?.filter(e=>e.variants.slice(1,e.variants.length).every(r=>r.variant.availableForSale));if(!m?.length&&k)return null;const y=e=>{o?.id===e.id?(s?.(void 0),c?.({...n,bundle:{value:void 0,canOperate:!0}}),p?.(r=>r.filter(t=>t!=="bundle"))):(s?.(e),c?.({...n,bundle:{value:e,canOperate:!1}}),p?.(r=>[...r.filter(C=>C!=="bundle"),"bundle"]))};return a("div",{className:"ipc-product-detail-bundle",children:[i(l,{size:3,className:"font-bold leading-[1.2]",html:g}),i("div",{className:"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3",children:m?.map(e=>{const r=e.variants.filter(t=>t.variant.sku!==v.sku);return i("div",{children:a("div",{className:u("rounded-box flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold",{"border-brand":o?.id===e.id}),children:[i(b,{onCheckedChange:()=>y(e),size:"lg",className:u("rounded-full border-2 border-[#E4E5E6]",{"border-brand":o?.id===e.id}),id:e.id,value:e.id,checked:o?.id===e.id}),i("label",{htmlFor:e.id,className:"size-full cursor-pointer py-6",children:r?.map(t=>a("div",{className:"flex items-center justify-between gap-6 ",children:[a("div",{className:"flex items-center gap-2",children:[i(N,{source:t?.variant?.image?.url,className:"size-12 shrink-0"}),i(l,{className:"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold",html:t.variant.product.title})]}),a("div",{className:"laptop:flex-row flex shrink-0 flex-col items-center  justify-end gap-1",children:[i(l,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold",html:f({amount:t.price,locale:d,currencyCode:t.variant.price.currencyCode})}),t.price<t.variant.price.amount&&i(l,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:f({amount:t.variant.price.amount,locale:d,currencyCode:t.variant.price.currencyCode})})]})]},t.variant.id))})]})},e.id)})})]})};var J=P(L);export{J as default};
+import{jsx as i,jsxs as r}from"react/jsx-runtime";import{Text as a,Picture as B,Checkbox as P}from"../../../../../../components/index.js";import{cn as u}from"../../../../../../helpers/index.js";import{useAiuiContext as E}from"../../../../../AiuiProvider/index.js";import{useBizProductContext as w}from"../../../../BizProductProvider.js";import{formatPrice as f}from"../../../../utils/index.js";import{withLayout as L}from"../../../../../../shared/Styles.js";import{useFollowTooltip as F,FollowTooltip as z}from"../../../../hooks/useFollowTooltip.js";const D=()=>{const{locale:s="us"}=E(),{variant:x,bundle:v,checkedBundle:l,setCheckedBundle:d,setCheckedGift:T,savingDetail:A,setSavingDetail:O,setCheckedExchangePurchase:S,setJoinedRecommendBuyProducts:c,joinedRecommendBuyProducts:n,setAddOrder:p}=w(),{title:g,bundleList:h,showAtListing:k}=v||{},m=h?.filter(e=>e.variants.slice(1,e.variants.length).every(o=>o.variant.availableForSale));if(!m?.length&&k)return null;const y=e=>{l?.id===e.id?(d?.(void 0),c?.({...n,bundle:{value:void 0,canOperate:!0}}),p?.(o=>o.filter(t=>t!=="bundle"))):(d?.(e),c?.({...n,bundle:{value:e,canOperate:!1}}),p?.(o=>[...o.filter(b=>b!=="bundle"),"bundle"]))},{tooltip:C,getTooltipProps:N}=F();return r("div",{className:"ipc-product-detail-bundle",children:[i(a,{className:"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]",html:g}),i("div",{className:"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3",children:m?.map(e=>{const o=e.variants.filter(t=>t.variant.sku!==x.sku);return i("div",{children:r("div",{className:u("rounded-box h-[80px] laptop:h-[100px] flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold",{"border-brand":l?.id===e.id}),children:[i(P,{onCheckedChange:()=>y(e),size:"lg",className:u("rounded-full border-2 border-[#E4E5E6]",{"border-brand":l?.id===e.id}),id:e.id,value:e.id,checked:l?.id===e.id}),i("label",{htmlFor:e.id,className:"size-full flex items-center cursor-pointer py-4 lg-desktop:py-6",children:o?.map(t=>r("div",{className:"flex items-center justify-between gap-6 ",children:[r("div",{className:"flex items-center gap-2",children:[i(B,{source:t?.variant?.image?.url,className:"size-12 shrink-0",imgClassName:"h-full"}),i(a,{...N(t.variant.product.title),className:"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold",html:t.variant.product.title}),i(z,{...C})]}),r("div",{className:"laptop:flex-row flex shrink-0 flex-col items-center justify-end gap-1",children:[i(a,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base !leading-[1.2] font-bold",html:f({amount:t.price,locale:s,currencyCode:t.variant.price.currencyCode})}),t.price<t.variant.price.amount&&i(a,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base !leading-[1.2] font-bold text-[#6D6D6F] line-through",html:f({amount:t.variant.price.amount,locale:s,currencyCode:t.variant.price.currencyCode})})]})]},t.variant.id))})]})},e.id)})})]})};var K=L(D);export{K as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.tsx"],
-  "sourcesContent": ["import { Text, Picture, Checkbox } from '../../../../../../components/index.js'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { useAiuiContext } from '../../../../../AiuiProvider/index.js'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { formatPrice } from '../../../../utils/index.js'\nimport type { BundleListItem } from '../../../../types/product'\nimport { withLayout } from '../../../../../../shared/Styles.js'\n\nconst ProductBundle = () => {\n  const { locale = 'us' } = useAiuiContext()\n  const {\n    variant,\n    bundle,\n    checkedBundle,\n    setCheckedBundle,\n    setCheckedGift,\n    savingDetail,\n    setSavingDetail,\n    setCheckedExchangePurchase,\n    setJoinedRecommendBuyProducts,\n    joinedRecommendBuyProducts,\n    setAddOrder,\n  } = useBizProductContext()\n\n  const { title, bundleList, showAtListing } = bundle || {}\n\n  const availableBundleList = bundleList?.filter(bundle =>\n    bundle.variants.slice(1, bundle.variants.length).every(v => v.variant.availableForSale)\n  )\n\n  if (!availableBundleList?.length && showAtListing) return null\n\n  const handleSelectedChange = (bundleItem: BundleListItem) => {\n    if (checkedBundle?.id === bundleItem.id) {\n      setCheckedBundle?.(undefined)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        bundle: {\n          value: undefined,\n          canOperate: true,\n        },\n      })\n      // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n      setAddOrder?.(prev => prev.filter(t => t !== 'bundle'))\n    } else {\n      setCheckedBundle?.(bundleItem)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        bundle: {\n          value: bundleItem,\n          canOperate: false,\n        },\n      })\n      // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n      setAddOrder?.(prev => {\n        // \u5982\u679C\u5DF2\u7ECF\u5B58\u5728\uFF0C\u5148\u79FB\u9664\u518D\u6DFB\u52A0\u5230\u672B\u5C3E\n        const filtered = prev.filter(t => t !== 'bundle')\n        return [...filtered, 'bundle']\n      })\n    }\n  }\n\n  return (\n    <div className=\"ipc-product-detail-bundle\">\n      <Text size={3} className=\"font-bold leading-[1.2]\" html={title} />\n      <div className=\"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3\">\n        {availableBundleList?.map(bundle => {\n          const bundleVariants = bundle.variants.filter(v => v.variant.sku !== variant.sku)\n          return (\n            <div key={bundle.id}>\n              <div\n                className={cn(\n                  'rounded-box flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold',\n                  {\n                    ['border-brand']: checkedBundle?.id === bundle.id,\n                  }\n                )}\n              >\n                <Checkbox\n                  onCheckedChange={() => handleSelectedChange(bundle)}\n                  size=\"lg\"\n                  className={cn('rounded-full border-2 border-[#E4E5E6]', {\n                    'border-brand': checkedBundle?.id === bundle.id,\n                  })}\n                  id={bundle.id}\n                  value={bundle.id}\n                  checked={checkedBundle?.id === bundle.id}\n                />\n                <label htmlFor={bundle.id} className=\"size-full cursor-pointer py-6\">\n                  {bundleVariants?.map(bundleVariant => {\n                    return (\n                      <div className=\"flex items-center justify-between gap-6 \" key={bundleVariant.variant.id}>\n                        <div className=\"flex items-center gap-2\">\n                          <Picture source={bundleVariant?.variant?.image?.url} className=\"size-12 shrink-0\" />\n                          <Text\n                            className=\"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold\"\n                            html={bundleVariant.variant.product.title}\n                          />\n                        </div>\n                        <div className=\"laptop:flex-row flex shrink-0 flex-col items-center  justify-end gap-1\">\n                          <Text\n                            className=\"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold\"\n                            html={formatPrice({\n                              amount: bundleVariant.price,\n                              locale,\n                              currencyCode: bundleVariant.variant.price.currencyCode,\n                            })}\n                          />\n                          {bundleVariant.price < bundleVariant.variant.price.amount && (\n                            <Text\n                              className=\"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n                              html={formatPrice({\n                                amount: bundleVariant.variant.price.amount,\n                                locale,\n                                currencyCode: bundleVariant.variant.price.currencyCode,\n                              })}\n                            />\n                          )}\n                        </div>\n                      </div>\n                    )\n                  })}\n                </label>\n              </div>\n            </div>\n          )\n        })}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(ProductBundle)\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "Text", "Picture", "Checkbox", "cn", "useAiuiContext", "useBizProductContext", "formatPrice", "withLayout", "ProductBundle", "locale", "variant", "bundle", "checkedBundle", "setCheckedBundle", "setCheckedGift", "savingDetail", "setSavingDetail", "setCheckedExchangePurchase", "setJoinedRecommendBuyProducts", "joinedRecommendBuyProducts", "setAddOrder", "title", "bundleList", "showAtListing", "availableBundleList", "v", "handleSelectedChange", "bundleItem", "prev", "t", "bundleVariants", "bundleVariant", "ProductBundle_default"]
+  "sourcesContent": ["import { Text, Picture, Checkbox } from '../../../../../../components/index.js'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { useAiuiContext } from '../../../../../AiuiProvider/index.js'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { formatPrice } from '../../../../utils/index.js'\nimport type { BundleListItem } from '../../../../types/product'\nimport { withLayout } from '../../../../../../shared/Styles.js'\nimport { useFollowTooltip, FollowTooltip } from '../../../../hooks/useFollowTooltip.js'\n\nconst ProductBundle = () => {\n  const { locale = 'us' } = useAiuiContext()\n  const {\n    variant,\n    bundle,\n    checkedBundle,\n    setCheckedBundle,\n    setCheckedGift,\n    savingDetail,\n    setSavingDetail,\n    setCheckedExchangePurchase,\n    setJoinedRecommendBuyProducts,\n    joinedRecommendBuyProducts,\n    setAddOrder,\n  } = useBizProductContext()\n\n  const { title, bundleList, showAtListing } = bundle || {}\n\n  const availableBundleList = bundleList?.filter(bundle =>\n    bundle.variants.slice(1, bundle.variants.length).every(v => v.variant.availableForSale)\n  )\n\n  if (!availableBundleList?.length && showAtListing) return null\n\n  const handleSelectedChange = (bundleItem: BundleListItem) => {\n    if (checkedBundle?.id === bundleItem.id) {\n      setCheckedBundle?.(undefined)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        bundle: {\n          value: undefined,\n          canOperate: true,\n        },\n      })\n      // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n      setAddOrder?.(prev => prev.filter(t => t !== 'bundle'))\n    } else {\n      setCheckedBundle?.(bundleItem)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        bundle: {\n          value: bundleItem,\n          canOperate: false,\n        },\n      })\n      // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n      setAddOrder?.(prev => {\n        // \u5982\u679C\u5DF2\u7ECF\u5B58\u5728\uFF0C\u5148\u79FB\u9664\u518D\u6DFB\u52A0\u5230\u672B\u5C3E\n        const filtered = prev.filter(t => t !== 'bundle')\n        return [...filtered, 'bundle']\n      })\n    }\n  }\n\n  const { tooltip, getTooltipProps } = useFollowTooltip()\n\n  return (\n    <div className=\"ipc-product-detail-bundle\">\n      <Text className=\"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]\" html={title} />\n      <div className=\"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3\">\n        {availableBundleList?.map(bundle => {\n          const bundleVariants = bundle.variants.filter(v => v.variant.sku !== variant.sku)\n          return (\n            <div key={bundle.id}>\n              <div\n                className={cn(\n                  'rounded-box h-[80px] laptop:h-[100px] flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold',\n                  {\n                    ['border-brand']: checkedBundle?.id === bundle.id,\n                  }\n                )}\n              >\n                <Checkbox\n                  onCheckedChange={() => handleSelectedChange(bundle)}\n                  size=\"lg\"\n                  className={cn('rounded-full border-2 border-[#E4E5E6]', {\n                    'border-brand': checkedBundle?.id === bundle.id,\n                  })}\n                  id={bundle.id}\n                  value={bundle.id}\n                  checked={checkedBundle?.id === bundle.id}\n                />\n                <label htmlFor={bundle.id} className=\"size-full flex items-center cursor-pointer py-4 lg-desktop:py-6\">\n                  {bundleVariants?.map(bundleVariant => {\n                    return (\n                      <div className=\"flex items-center justify-between gap-6 \" key={bundleVariant.variant.id}>\n                        <div className=\"flex items-center gap-2\">\n                          <Picture\n                            source={bundleVariant?.variant?.image?.url}\n                            className=\"size-12 shrink-0\"\n                            imgClassName=\"h-full\"\n                          />\n                          <Text\n                            {...getTooltipProps(bundleVariant.variant.product.title)}\n                            className=\"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold\"\n                            html={bundleVariant.variant.product.title}\n                          />\n                          <FollowTooltip {...tooltip} />\n                        </div>\n                        <div className=\"laptop:flex-row flex shrink-0 flex-col items-center justify-end gap-1\">\n                          <Text\n                            className=\"laptop:text-[20px] lg-desktop:text-2xl text-base !leading-[1.2] font-bold\"\n                            html={formatPrice({\n                              amount: bundleVariant.price,\n                              locale,\n                              currencyCode: bundleVariant.variant.price.currencyCode,\n                            })}\n                          />\n                          {bundleVariant.price < bundleVariant.variant.price.amount && (\n                            <Text\n                              className=\"laptop:text-[20px] lg-desktop:text-2xl text-base !leading-[1.2] font-bold text-[#6D6D6F] line-through\"\n                              html={formatPrice({\n                                amount: bundleVariant.variant.price.amount,\n                                locale,\n                                currencyCode: bundleVariant.variant.price.currencyCode,\n                              })}\n                            />\n                          )}\n                        </div>\n                      </div>\n                    )\n                  })}\n                </label>\n              </div>\n            </div>\n          )\n        })}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(ProductBundle)\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "Text", "Picture", "Checkbox", "cn", "useAiuiContext", "useBizProductContext", "formatPrice", "withLayout", "useFollowTooltip", "FollowTooltip", "ProductBundle", "locale", "variant", "bundle", "checkedBundle", "setCheckedBundle", "setCheckedGift", "savingDetail", "setSavingDetail", "setCheckedExchangePurchase", "setJoinedRecommendBuyProducts", "joinedRecommendBuyProducts", "setAddOrder", "title", "bundleList", "showAtListing", "availableBundleList", "v", "handleSelectedChange", "bundleItem", "prev", "t", "tooltip", "getTooltipProps", "bundleVariants", "bundleVariant", "ProductBundle_default"]
 }

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductCoupon/index.d.ts ADDED Viewed

@@ -0,0 +1,41 @@
+import React from 'react';
+export interface ProductCouponProps {
+    /** 自定义类名 */
+    className?: string;
+}
+export interface CouponCardProps {
+    /** 是否选中 */
+    checked: boolean;
+    /** 折扣文案 (如 "20% OFF") */
+    discountText: string;
+    /** 优惠码文案 (如 "With code: ABC123") */
+    codeText: string;
+    /** 优惠码 */
+    code: string;
+    /** 倒计时文案 (如 "Ends in: 1:23:45:00") */
+    countdownText?: string;
+    /** 复制按钮文案 */
+    copyText: string;
+    /** 已复制文案 */
+    copiedText: string;
+    /** 点击事件 */
+    onClick?: () => void;
+    /** 自定义类名 */
+    className?: string;
+}
+export declare const CouponCard: React.FC<CouponCardProps>;
+export interface MemberDiscountCardProps {
+    /** 是否选中 */
+    checked: boolean;
+    /** 折扣文案 (如 "$10 OFF Member Price") */
+    discountText: string;
+    /** 描述文案 */
+    description?: string;
+    /** 点击事件 */
+    onClick?: () => void;
+    /** 自定义类名 */
+    className?: string;
+}
+export declare const MemberDiscountCard: React.FC<MemberDiscountCardProps>;
+declare const ProductCoupon: React.FC<ProductCouponProps>;
+export default ProductCoupon;

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductCoupon/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use client";import{Fragment as E,jsx as e,jsxs as a}from"react/jsx-runtime";import{useMemo as _}from"react";import{cn as v,formatPrice as N}from"../../../../../../helpers/index.js";import{Text as l,Link as S,Checkbox as h}from"../../../../../../components/index.js";import B from"../../../../hooks/useCopy.js";import{useBenefits as L}from"../../../../hooks/useBenefits.js";import{useBizProductContext as R}from"../../../../BizProductProvider.js";import{replaceTemplate as g}from"../../../../utils/textFormat.js";import{useAiuiContext as $}from"../../../../../AiuiProvider/index.js";import z from"../../../../../../hooks/useCountDown.js";const T=({checked:s,discountText:r,codeText:t,code:p,countdownText:c,copyText:b,copiedText:C,onClick:d,className:m})=>{const{copied:x,copy:k}=B();return e("div",{className:v("flex flex-col gap-3 rounded-box overflow-hidden",m),role:"button",tabIndex:0,onClick:d,children:a("div",{className:"flex flex-col gap-3 overflow-hidden rounded-box bg-[#EDFBFF] p-3 laptop:p-4",children:[a("div",{className:"flex flex-col gap-1",children:[a("div",{className:"flex items-center gap-1",children:[e(h,{size:"lg",className:"data-[state=checked]:border-info-primary data-[state=checked]:bg-info-primary mr-2 rounded-full border-[1.6px] border-info-primary",checked:s}),e(l,{className:"text-info-primary text-base laptop:text-xl lg-desktop:text-2xl font-bold leading-[1.2] tracking-[-0.8px]",children:r})]}),a("div",{className:"flex w-full items-center gap-2",children:[e("div",{className:"flex shrink-0 flex-col items-start",children:e(l,{className:"text-info-primary lg-desktop:text-[16px] text-[14px] font-bold leading-[1.4] tracking-[-0.28px]",children:t})}),e(S,{className:"lg-desktop:text-[16px] text-[14px] font-bold underline",role:"button",tabIndex:0,onClick:u=>{u.preventDefault(),u.stopPropagation(),k(p)},children:x?C:b})]})]}),c&&e(l,{className:"text-brand-0 text-sm lg-desktop:text-base font-bold leading-[1.4] tracking-[-0.28px]",children:c})]})})};T.displayName="CouponCard";const P=({checked:s,discountText:r,description:t,onClick:p,className:c})=>e("div",{className:v("flex flex-col gap-3 rounded-box overflow-hidden",c),role:"button",tabIndex:0,onClick:p,children:e("div",{className:"flex flex-col gap-3 overflow-hidden rounded-box bg-[#EDFBFF] p-3 laptop:p-4",children:a("div",{className:"flex flex-col gap-1",children:[a("div",{className:"flex items-center gap-1",children:[e(h,{size:"lg",className:"data-[state=checked]:border-info-primary data-[state=checked]:bg-info-primary mr-2 rounded-full border-[1.6px] border-info-primary",checked:s}),e(l,{className:"text-info-primary text-base laptop:text-xl lg-desktop:text-2xl font-bold leading-[1.2] tracking-[-0.8px]",children:r})]}),t&&e(l,{className:"text-info-primary lg-desktop:text-[16px] text-[14px] font-bold leading-[1.4] tracking-[-0.28px] pl-8",children:t})]})})});P.displayName="MemberDiscountCard";const D=({className:s})=>{const{profile:r,variant:t,onUseCouponChange:p,onUseMemberDiscountChange:c,openSignInPopup:b,discount:C,savingDetail:d,product:m}=R(),{locale:x="us",trackingData:k}=$(),u=L({variant:t}),{commonCoupon:n,memberDiscount:f}=u,{days:M,hours:w,minutes:F,seconds:I}=z({endTime:n?.config?.ends_at}),y=k?.common?.coupon,o=_(()=>m?.payload?.components?.find(i=>i.componentKey==="ProductCoupon")?.data\|\|{},[m?.payload]);return!n?.enable&&!f?.enable\|\|!t?.availableForSale?null:a("div",{className:v("ipc-product-detail-product-coupon flex flex-col gap-3 lg-desktop:gap-4",s),children:[o?.title&&e(l,{className:"text-info-primary text-[14px] lg-desktop:text-[16px] font-bold leading-[1.2] tracking-[-0.56px]",children:o.title}),n?.enable&&e(T,{checked:d?.coupon>0,discountText:g(o?.common?.offCoupon,{discount:n?.config?.value_type=="percentage"?Math.abs(Number(n?.config?.value\|\|0))+"%":N({amount:Math.abs(Number(n?.config?.fixed_value\|\|0)),currencyCode:t.price.currencyCode,locale:x})\|\|""}),codeText:g(o?.common?.withCode,{code:n?.config?.title??""}),code:n?.config?.title??"",countdownText:n?.config?.ends_at?g(o?.common?.endsIn,{countdown:`${M}:${w}:${F}:${I}`}):void 0,copyText:y?.copy\|\|o?.copyCode,copiedText:y?.copied\|\|o?.copied,onClick:()=>{const i=d?.coupon?0:C?.codeSavings??0;p?.(i)}}),f?.enable&&e(P,{checked:!!r?.email&&!!d?.member,discountText:g(o?.member?.offMember,{discount:N({amount:f?.config?.amount??0,currencyCode:t.price.currencyCode,locale:x})\|\|""}),description:r?.email?o?.member?.loginDesc:a(E,{children:[e("span",{className:"mr-2",dangerouslySetInnerHTML:{__html:o?.member?.unloginDesc}}),e("span",{role:"button",tabIndex:0,onClick:i=>{i?.stopPropagation(),b?.()},className:"underline text-nowrap",dangerouslySetInnerHTML:{__html:o?.member?.login}})]}),onClick:()=>{if(r?.email){const i=d?.member?0:f?.config?.amount??0;c?.(i)}}})]})};D.displayName="ProductCoupon";var W=D;export{T as CouponCard,P as MemberDiscountCard,W as default};
2	+ //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductCoupon/index.js.map ADDED Viewed

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/biz-components/Listing/components/ProductCard/ProductDetail/ProductCoupon/index.tsx"],
+  "sourcesContent": ["'use client'\n\nimport React, { useMemo } from 'react'\nimport { cn, formatPrice } from '../../../../../../helpers/index.js'\nimport { Text, Link, Checkbox } from '../../../../../../components/index.js'\nimport useCopy from '../../../../hooks/useCopy.js'\nimport { useBenefits } from '../../../../hooks/useBenefits.js'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { replaceTemplate } from '../../../../utils/textFormat.js'\nimport { useAiuiContext } from '../../../../../AiuiProvider/index.js'\nimport useCountDown from '../../../../../../hooks/useCountDown.js'\n\nexport interface ProductCouponProps {\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n}\n\n// \u4F18\u60E0\u5238\u5361\u7247\u7EC4\u4EF6\nexport interface CouponCardProps {\n  /** \u662F\u5426\u9009\u4E2D */\n  checked: boolean\n  /** \u6298\u6263\u6587\u6848 (\u5982 \"20% OFF\") */\n  discountText: string\n  /** \u4F18\u60E0\u7801\u6587\u6848 (\u5982 \"With code: ABC123\") */\n  codeText: string\n  /** \u4F18\u60E0\u7801 */\n  code: string\n  /** \u5012\u8BA1\u65F6\u6587\u6848 (\u5982 \"Ends in: 1:23:45:00\") */\n  countdownText?: string\n  /** \u590D\u5236\u6309\u94AE\u6587\u6848 */\n  copyText: string\n  /** \u5DF2\u590D\u5236\u6587\u6848 */\n  copiedText: string\n  /** \u70B9\u51FB\u4E8B\u4EF6 */\n  onClick?: () => void\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n}\n\nexport const CouponCard: React.FC<CouponCardProps> = ({\n  checked,\n  discountText,\n  codeText,\n  code,\n  countdownText,\n  copyText,\n  copiedText,\n  onClick,\n  className,\n}) => {\n  const { copied: isCopied, copy: copyToClipboard } = useCopy()\n\n  return (\n    <div\n      className={cn('flex flex-col gap-3 rounded-box overflow-hidden', className)}\n      role=\"button\"\n      tabIndex={0}\n      onClick={onClick}\n    >\n      <div className=\"flex flex-col gap-3 overflow-hidden rounded-box bg-[#EDFBFF] p-3 laptop:p-4\">\n        <div className=\"flex flex-col gap-1\">\n          <div className=\"flex items-center gap-1\">\n            <Checkbox\n              size=\"lg\"\n              className=\"data-[state=checked]:border-info-primary data-[state=checked]:bg-info-primary mr-2 rounded-full border-[1.6px] border-info-primary\"\n              checked={checked}\n            />\n            <Text className=\"text-info-primary text-base laptop:text-xl lg-desktop:text-2xl font-bold leading-[1.2] tracking-[-0.8px]\">\n              {discountText}\n            </Text>\n          </div>\n\n          <div className=\"flex w-full items-center gap-2\">\n            <div className=\"flex shrink-0 flex-col items-start\">\n              <Text className=\"text-info-primary lg-desktop:text-[16px] text-[14px] font-bold leading-[1.4] tracking-[-0.28px]\">\n                {codeText}\n              </Text>\n            </div>\n            <Link\n              className=\"lg-desktop:text-[16px] text-[14px] font-bold underline\"\n              role=\"button\"\n              tabIndex={0}\n              onClick={event => {\n                event.preventDefault()\n                event.stopPropagation()\n                copyToClipboard(code)\n              }}\n            >\n              {isCopied ? copiedText : copyText}\n            </Link>\n          </div>\n        </div>\n\n        {countdownText && (\n          <Text className=\"text-brand-0 text-sm lg-desktop:text-base font-bold leading-[1.4] tracking-[-0.28px]\">\n            {countdownText}\n          </Text>\n        )}\n      </div>\n    </div>\n  )\n}\n\nCouponCard.displayName = 'CouponCard'\n\n// \u4F1A\u5458\u4EF7\u4F18\u60E0\u5361\u7247\u7EC4\u4EF6\nexport interface MemberDiscountCardProps {\n  /** \u662F\u5426\u9009\u4E2D */\n  checked: boolean\n  /** \u6298\u6263\u6587\u6848 (\u5982 \"$10 OFF Member Price\") */\n  discountText: string\n  /** \u63CF\u8FF0\u6587\u6848 */\n  description?: string\n  /** \u70B9\u51FB\u4E8B\u4EF6 */\n  onClick?: () => void\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n}\n\nexport const MemberDiscountCard: React.FC<MemberDiscountCardProps> = ({\n  checked,\n  discountText,\n  description,\n  onClick,\n  className,\n}) => {\n  return (\n    <div\n      className={cn('flex flex-col gap-3 rounded-box overflow-hidden', className)}\n      role=\"button\"\n      tabIndex={0}\n      onClick={onClick}\n    >\n      <div className=\"flex flex-col gap-3 overflow-hidden rounded-box bg-[#EDFBFF] p-3 laptop:p-4\">\n        <div className=\"flex flex-col gap-1\">\n          <div className=\"flex items-center gap-1\">\n            <Checkbox\n              size=\"lg\"\n              className=\"data-[state=checked]:border-info-primary data-[state=checked]:bg-info-primary mr-2 rounded-full border-[1.6px] border-info-primary\"\n              checked={checked}\n            />\n            <Text className=\"text-info-primary text-base laptop:text-xl lg-desktop:text-2xl font-bold leading-[1.2] tracking-[-0.8px]\">\n              {discountText}\n            </Text>\n          </div>\n\n          {description && (\n            <Text className=\"text-info-primary lg-desktop:text-[16px] text-[14px] font-bold leading-[1.4] tracking-[-0.28px] pl-8\">\n              {description}\n            </Text>\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nMemberDiscountCard.displayName = 'MemberDiscountCard'\n\nconst ProductCoupon: React.FC<ProductCouponProps> = ({ className }) => {\n  const {\n    profile,\n    variant,\n    onUseCouponChange,\n    onUseMemberDiscountChange,\n    openSignInPopup,\n    discount,\n    savingDetail,\n    product,\n  } = useBizProductContext()\n  const { locale = 'us', trackingData } = useAiuiContext()\n  const benefits = useBenefits({ variant })\n  const { commonCoupon, memberDiscount } = benefits\n\n  const { days, hours, minutes, seconds } = useCountDown({ endTime: commonCoupon?.config?.ends_at })\n\n  const couponCopy = trackingData?.common?.coupon\n\n  const productCouponData = useMemo(() => {\n    return product?.payload?.components?.find((item: any) => item.componentKey === 'ProductCoupon')?.data || {}\n  }, [product?.payload])\n\n  if ((!commonCoupon?.enable && !memberDiscount?.enable) || !variant?.availableForSale) {\n    return null\n  }\n\n  return (\n    <div className={cn('ipc-product-detail-product-coupon flex flex-col gap-3 lg-desktop:gap-4', className)}>\n      {productCouponData?.title && (\n        <Text className=\"text-info-primary text-[14px] lg-desktop:text-[16px] font-bold leading-[1.2] tracking-[-0.56px]\">\n          {productCouponData.title}\n        </Text>\n      )}\n      {commonCoupon?.enable && (\n        <CouponCard\n          checked={savingDetail?.coupon > 0}\n          discountText={replaceTemplate(productCouponData?.common?.offCoupon, {\n            discount:\n              commonCoupon?.config?.value_type == 'percentage'\n                ? Math.abs(Number(commonCoupon?.config?.value || 0)) + '%'\n                : formatPrice({\n                    amount: Math.abs(Number(commonCoupon?.config?.fixed_value || 0)),\n                    currencyCode: variant.price.currencyCode,\n                    locale,\n                  }) || '',\n          })}\n          codeText={replaceTemplate(productCouponData?.common?.withCode, {\n            code: commonCoupon?.config?.title ?? '',\n          })}\n          code={commonCoupon?.config?.title ?? ''}\n          countdownText={\n            commonCoupon?.config?.ends_at\n              ? replaceTemplate(productCouponData?.common?.endsIn, {\n                  countdown: `${days}:${hours}:${minutes}:${seconds}`,\n                })\n              : undefined\n          }\n          copyText={couponCopy?.copy || productCouponData?.copyCode}\n          copiedText={couponCopy?.copied || productCouponData?.copied}\n          onClick={() => {\n            const couponSaving = !savingDetail?.coupon ? (discount?.codeSavings ?? 0) : 0\n            onUseCouponChange?.(couponSaving)\n          }}\n        />\n      )}\n\n      {memberDiscount?.enable && (\n        <MemberDiscountCard\n          checked={Boolean(profile?.email) && !!savingDetail?.member}\n          discountText={replaceTemplate(productCouponData?.member?.offMember, {\n            discount:\n              formatPrice({\n                amount: memberDiscount?.config?.amount ?? 0,\n                currencyCode: variant.price.currencyCode,\n                locale,\n              }) || '',\n          })}\n          description={\n            Boolean(profile?.email) ? (\n              productCouponData?.member?.loginDesc\n            ) : (\n              <>\n                <span className=\"mr-2\" dangerouslySetInnerHTML={{ __html: productCouponData?.member?.unloginDesc }} />\n                <span\n                  role=\"button\"\n                  tabIndex={0}\n                  onClick={e => {\n                    e?.stopPropagation()\n                    openSignInPopup?.()\n                  }}\n                  className=\"underline text-nowrap\"\n                  dangerouslySetInnerHTML={{ __html: productCouponData?.member?.login }}\n                />\n              </>\n            )\n          }\n          onClick={() => {\n            if (profile?.email) {\n              const memberSaving = !savingDetail?.member ? (memberDiscount?.config?.amount ?? 0) : 0\n              onUseMemberDiscountChange?.(memberSaving)\n            }\n          }}\n        />\n      )}\n    </div>\n  )\n}\n\nProductCoupon.displayName = 'ProductCoupon'\n\nexport default ProductCoupon\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "useMemo", "cn", "formatPrice", "Text", "Link", "Checkbox", "useCopy", "useBenefits", "useBizProductContext", "replaceTemplate", "useAiuiContext", "useCountDown", "CouponCard", "checked", "discountText", "codeText", "code", "countdownText", "copyText", "copiedText", "onClick", "className", "isCopied", "copyToClipboard", "event", "MemberDiscountCard", "description", "ProductCoupon", "profile", "variant", "onUseCouponChange", "onUseMemberDiscountChange", "openSignInPopup", "discount", "savingDetail", "product", "locale", "trackingData", "benefits", "commonCoupon", "memberDiscount", "days", "hours", "minutes", "seconds", "couponCopy", "productCouponData", "item", "couponSaving", "e", "memberSaving", "ProductCoupon_default"]
+}

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as r}from"react/jsx-runtime";import{Text as o,Picture as C,Checkbox as y}from"../../../../../../components/index.js";import{cn as x}from"../../../../../../helpers/index.js";import{useMemo as N}from"react";import{useBizProductContext as E}from"../../../../BizProductProvider.js";import{formatPrice as h}from"../../../../utils/index.js";import{useAiuiContext as D}from"../../../../../AiuiProvider/index.js";import{withLayout as w}from"../../../../../../shared/Styles.js";const z=()=>{const{locale:l="us"}=D(),{checkedExchangePurchase:a,exchangePurchase:f,setCheckedBundle:B,setJoinedRecommendBuyProducts:d,setSavingDetail:b,setCheckedExchangePurchase:i,joinedRecommendBuyProducts:n,savingDetail:P,setAddOrder:s}=E(),{title:g,giftList:m=[],freeLabel:F}=f||{},u=N(()=>m?.filter(e=>e.availableForSale),[m]),k=e=>{a?.id===e.id?(i?.(void 0),d?.({...n,exchange:{value:void 0,canOperate:!0}}),b?.({...P,exchangePurchase:0}),s?.(c=>c.filter(p=>p!=="exchange"))):(i?.(e),d?.({...n,exchange:{value:e,canOperate:!1}}),s?.(c=>[...c.filter(v=>v!=="exchange"),"exchange"]))};return u?.length?r("div",{className:"ipc-product-detail-exchange-purchase",children:[t(o,{size:3,className:"font-bold leading-[1.2]",html:g}),t("div",{className:"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3",children:u.map(e=>r("div",{className:x("rounded-box flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold",{"border-brand":a?.id===e.id}),children:[t(y,{onCheckedChange:()=>k(e),size:"lg",className:x("rounded-full border-2 border-[#E4E5E6]",{"border-brand":a?.id===e.id}),id:e.id,checked:a?.id===e.id,value:e.id}),r("label",{htmlFor:e.id,className:"flex w-full cursor-pointer items-center justify-between gap-4 py-6",children:[r("div",{className:"flex items-center gap-2",children:[t(C,{source:e.image?.url,className:"size-12 shrink-0"}),t(o,{className:"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold",html:e.product.title})]}),r("div",{className:"tablet:flex-row flex shrink-0 flex-col items-center gap-1",children:[t(o,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold",html:h({amount:e?.finalPrice?.amount||0,locale:l,currencyCode:e?.finalPrice?.currencyCode||"USD"})}),t(o,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:h({amount:e.price.amount,locale:l,currencyCode:e.price.currencyCode})})]})]})]},e.id))})]}):null};var G=w(z);export{G as default};
+import{jsx as t,jsxs as o}from"react/jsx-runtime";import{Text as l,Picture as N,Checkbox as E}from"../../../../../../components/index.js";import{cn as x}from"../../../../../../helpers/index.js";import{useMemo as w}from"react";import{useBizProductContext as D}from"../../../../BizProductProvider.js";import{formatPrice as h}from"../../../../utils/index.js";import{useAiuiContext as F}from"../../../../../AiuiProvider/index.js";import{withLayout as B}from"../../../../../../shared/Styles.js";import{useFollowTooltip as T,FollowTooltip as z}from"../../../../hooks/useFollowTooltip.js";const L=()=>{const{locale:c="us"}=F(),{tooltip:f,getTooltipProps:b}=T(),{checkedExchangePurchase:r,exchangePurchase:g,setCheckedBundle:O,setJoinedRecommendBuyProducts:d,setSavingDetail:P,setCheckedExchangePurchase:i,joinedRecommendBuyProducts:s,savingDetail:k,setAddOrder:n}=D(),{title:C,giftList:p=[],freeLabel:S}=g||{},m=w(()=>p?.filter(e=>e.availableForSale),[p]),v=e=>{r?.id===e.id?(i?.(void 0),d?.({...s,exchange:{value:void 0,canOperate:!0}}),P?.({...k,exchangePurchase:0}),n?.(a=>a.filter(u=>u!=="exchange"))):(i?.(e),d?.({...s,exchange:{value:e,canOperate:!1}}),n?.(a=>[...a.filter(y=>y!=="exchange"),"exchange"]))};return m?.length?o("div",{className:"ipc-product-detail-exchange-purchase",children:[t(l,{className:"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]",html:C}),t("div",{className:"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3",children:m.map(e=>o("div",{className:x("rounded-box h-[80px] laptop:h-[100px] flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold",{"border-brand":r?.id===e.id}),children:[t(E,{onCheckedChange:()=>v(e),size:"lg",className:x("rounded-full border-2 border-[#E4E5E6]",{"border-brand":r?.id===e.id}),id:e.id,checked:r?.id===e.id,value:e.id}),o("label",{htmlFor:e.id,className:"flex w-full cursor-pointer items-center justify-between gap-4 py-4 lg-desktop:py-6",children:[o("div",{className:"flex items-center gap-2",children:[t(N,{source:e.image?.url,className:"size-12 shrink-0",imgClassName:"h-full"}),t(l,{...b(e.product.title),className:"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold",html:e.product.title}),t(z,{...f})]}),o("div",{className:"tablet:flex-row flex shrink-0 flex-col items-center gap-1",children:[t(l,{className:"laptop:text-[20px] lg-desktop:text-2xl !leading-[1.2] text-base font-bold",html:h({amount:e?.finalPrice?.amount||0,locale:c,currencyCode:e?.finalPrice?.currencyCode||"USD"})}),t(l,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base !leading-[1.2]  font-bold text-[#6D6D6F] line-through",html:h({amount:e.price.amount,locale:c,currencyCode:e.price.currencyCode})})]})]})]},e.id))})]}):null};var q=B(L);export{q as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.tsx"],
-  "sourcesContent": ["import { Text, Picture, Checkbox } from '../../../../../../components/index.js'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { useMemo } from 'react'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { formatPrice } from '../../../../utils/index.js'\nimport { useAiuiContext } from '../../../../../AiuiProvider/index.js'\nimport type { ProductVariant, ProductPrice } from '../../../../types/product'\nimport { withLayout } from '../../../../../../shared/Styles.js'\n\nconst ProductExchangePurchase = () => {\n  const { locale = 'us' } = useAiuiContext()\n  const {\n    checkedExchangePurchase,\n    exchangePurchase,\n    setCheckedBundle,\n    setJoinedRecommendBuyProducts,\n    setSavingDetail,\n    setCheckedExchangePurchase,\n    joinedRecommendBuyProducts,\n    savingDetail,\n    setAddOrder,\n  } = useBizProductContext()\n  const { title, giftList = [], freeLabel } = exchangePurchase || {}\n  const availableGifts = useMemo(() => giftList?.filter(item => item.availableForSale), [giftList])\n\n  const handleCheckboxClick = (value: ProductVariant) => {\n    if (checkedExchangePurchase?.id === value.id) {\n      setCheckedExchangePurchase?.(undefined)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        exchange: {\n          value: undefined,\n          canOperate: true,\n        },\n      })\n      setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n      // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n      setAddOrder?.(prev => prev.filter(t => t !== 'exchange'))\n    } else {\n      setCheckedExchangePurchase?.(value)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        exchange: {\n          value,\n          canOperate: false,\n        },\n      })\n      // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n      setAddOrder?.(prev => {\n        // \u5982\u679C\u5DF2\u7ECF\u5B58\u5728\uFF0C\u5148\u79FB\u9664\u518D\u6DFB\u52A0\u5230\u672B\u5C3E\n        const filtered = prev.filter(t => t !== 'exchange')\n        return [...filtered, 'exchange']\n      })\n    }\n  }\n\n  if (!availableGifts?.length) return null\n\n  return (\n    <div className=\"ipc-product-detail-exchange-purchase\">\n      <Text size={3} className=\"font-bold leading-[1.2]\" html={title} />\n      <div className=\"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3\">\n        {availableGifts.map((gift: ProductVariant & { finalPrice?: ProductPrice }) => (\n          <div\n            key={gift.id}\n            className={cn('rounded-box flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold', {\n              ['border-brand']: checkedExchangePurchase?.id === gift.id,\n            })}\n          >\n            <Checkbox\n              onCheckedChange={() => handleCheckboxClick(gift)}\n              size=\"lg\"\n              className={cn('rounded-full border-2 border-[#E4E5E6]', {\n                'border-brand': checkedExchangePurchase?.id === gift.id,\n              })}\n              id={gift.id}\n              checked={checkedExchangePurchase?.id === gift.id}\n              value={gift.id}\n            ></Checkbox>\n            <label htmlFor={gift.id} className=\"flex w-full cursor-pointer items-center justify-between gap-4 py-6\">\n              <div className=\"flex items-center gap-2\">\n                <Picture source={gift.image?.url} className=\"size-12 shrink-0\" />\n                <Text\n                  className=\"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold\"\n                  html={gift.product.title}\n                />\n              </div>\n              <div className=\"tablet:flex-row flex shrink-0 flex-col items-center gap-1\">\n                <Text\n                  className=\"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold\"\n                  html={formatPrice({\n                    amount: gift?.finalPrice?.amount || 0,\n                    locale,\n                    currencyCode: gift?.finalPrice?.currencyCode || 'USD',\n                  })}\n                />\n                <Text\n                  className=\"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n                  html={formatPrice({\n                    amount: gift.price.amount,\n                    locale,\n                    currencyCode: gift.price.currencyCode,\n                  })}\n                />\n              </div>\n            </label>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(ProductExchangePurchase)\n"],
-  "mappings": "AA4DM,cAAAA,EAoBQ,QAAAC,MApBR,oBA5DN,OAAS,QAAAC,EAAM,WAAAC,EAAS,YAAAC,MAAgB,wCACxC,OAAS,MAAAC,MAAU,qCACnB,OAAS,WAAAC,MAAe,QACxB,OAAS,wBAAAC,MAA4B,oCACrC,OAAS,eAAAC,MAAmB,6BAC5B,OAAS,kBAAAC,MAAsB,uCAE/B,OAAS,cAAAC,MAAkB,qCAE3B,MAAMC,EAA0B,IAAM,CACpC,KAAM,CAAE,OAAAC,EAAS,IAAK,EAAIH,EAAe,EACnC,CACJ,wBAAAI,EACA,iBAAAC,EACA,iBAAAC,EACA,8BAAAC,EACA,gBAAAC,EACA,2BAAAC,EACA,2BAAAC,EACA,aAAAC,EACA,YAAAC,CACF,EAAId,EAAqB,EACnB,CAAE,MAAAe,EAAO,SAAAC,EAAW,CAAC,EAAG,UAAAC,CAAU,EAAIV,GAAoB,CAAC,EAC3DW,EAAiBnB,EAAQ,IAAMiB,GAAU,OAAOG,GAAQA,EAAK,gBAAgB,EAAG,CAACH,CAAQ,CAAC,EAE1FI,EAAuBC,GAA0B,CACjDf,GAAyB,KAAOe,EAAM,IACxCV,IAA6B,MAAS,EACtCF,IAAgC,CAC9B,GAAGG,EACH,SAAU,CACR,MAAO,OACP,WAAY,EACd,CACF,CAAC,EACDF,IAAkB,CAAE,GAAGG,EAAc,iBAAkB,CAAE,CAAC,EAE1DC,IAAcQ,GAAQA,EAAK,OAAOC,GAAKA,IAAM,UAAU,CAAC,IAExDZ,IAA6BU,CAAK,EAClCZ,IAAgC,CAC9B,GAAGG,EACH,SAAU,CACR,MAAAS,EACA,WAAY,EACd,CACF,CAAC,EAEDP,IAAcQ,GAGL,CAAC,GADSA,EAAK,OAAOC,GAAKA,IAAM,UAAU,EAC7B,UAAU,CAChC,EAEL,EAEA,OAAKL,GAAgB,OAGnBxB,EAAC,OAAI,UAAU,uCACb,UAAAD,EAACE,EAAA,CAAK,KAAM,EAAG,UAAU,0BAA0B,KAAMoB,EAAO,EAChEtB,EAAC,OAAI,UAAU,uFACZ,SAAAyB,EAAe,IAAKM,GACnB9B,EAAC,OAEC,UAAWI,EAAG,yFAA0F,CACrG,eAAiBQ,GAAyB,KAAOkB,EAAK,EACzD,CAAC,EAED,UAAA/B,EAACI,EAAA,CACC,gBAAiB,IAAMuB,EAAoBI,CAAI,EAC/C,KAAK,KACL,UAAW1B,EAAG,yCAA0C,CACtD,eAAgBQ,GAAyB,KAAOkB,EAAK,EACvD,CAAC,EACD,GAAIA,EAAK,GACT,QAASlB,GAAyB,KAAOkB,EAAK,GAC9C,MAAOA,EAAK,GACb,EACD9B,EAAC,SAAM,QAAS8B,EAAK,GAAI,UAAU,qEACjC,UAAA9B,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACG,EAAA,CAAQ,OAAQ4B,EAAK,OAAO,IAAK,UAAU,mBAAmB,EAC/D/B,EAACE,EAAA,CACC,UAAU,2EACV,KAAM6B,EAAK,QAAQ,MACrB,GACF,EACA9B,EAAC,OAAI,UAAU,4DACb,UAAAD,EAACE,EAAA,CACC,UAAU,6DACV,KAAMM,EAAY,CAChB,OAAQuB,GAAM,YAAY,QAAU,EACpC,OAAAnB,EACA,aAAcmB,GAAM,YAAY,cAAgB,KAClD,CAAC,EACH,EACA/B,EAACE,EAAA,CACC,UAAU,yFACV,KAAMM,EAAY,CAChB,OAAQuB,EAAK,MAAM,OACnB,OAAAnB,EACA,aAAcmB,EAAK,MAAM,YAC3B,CAAC,EACH,GACF,GACF,IAzCKA,EAAK,EA0CZ,CACD,EACH,GACF,EArDkC,IAuDtC,EAEA,IAAOC,EAAQtB,EAAWC,CAAuB",
-  "names": ["jsx", "jsxs", "Text", "Picture", "Checkbox", "cn", "useMemo", "useBizProductContext", "formatPrice", "useAiuiContext", "withLayout", "ProductExchangePurchase", "locale", "checkedExchangePurchase", "exchangePurchase", "setCheckedBundle", "setJoinedRecommendBuyProducts", "setSavingDetail", "setCheckedExchangePurchase", "joinedRecommendBuyProducts", "savingDetail", "setAddOrder", "title", "giftList", "freeLabel", "availableGifts", "item", "handleCheckboxClick", "value", "prev", "t", "gift", "ProductExchangePurchase_default"]
+  "sourcesContent": ["import { Text, Picture, Checkbox } from '../../../../../../components/index.js'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { useMemo } from 'react'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { formatPrice } from '../../../../utils/index.js'\nimport { useAiuiContext } from '../../../../../AiuiProvider/index.js'\nimport type { ProductVariant, ProductPrice } from '../../../../types/product'\nimport { withLayout } from '../../../../../../shared/Styles.js'\nimport { useFollowTooltip, FollowTooltip } from '../../../../hooks/useFollowTooltip.js'\n\nconst ProductExchangePurchase = () => {\n  const { locale = 'us' } = useAiuiContext()\n  const { tooltip, getTooltipProps } = useFollowTooltip()\n  const {\n    checkedExchangePurchase,\n    exchangePurchase,\n    setCheckedBundle,\n    setJoinedRecommendBuyProducts,\n    setSavingDetail,\n    setCheckedExchangePurchase,\n    joinedRecommendBuyProducts,\n    savingDetail,\n    setAddOrder,\n  } = useBizProductContext()\n  const { title, giftList = [], freeLabel } = exchangePurchase || {}\n  const availableGifts = useMemo(() => giftList?.filter(item => item.availableForSale), [giftList])\n\n  const handleCheckboxClick = (value: ProductVariant) => {\n    if (checkedExchangePurchase?.id === value.id) {\n      setCheckedExchangePurchase?.(undefined)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        exchange: {\n          value: undefined,\n          canOperate: true,\n        },\n      })\n      setSavingDetail?.({ ...savingDetail, exchangePurchase: 0 })\n      // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n      setAddOrder?.(prev => prev.filter(t => t !== 'exchange'))\n    } else {\n      setCheckedExchangePurchase?.(value)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        exchange: {\n          value,\n          canOperate: false,\n        },\n      })\n      // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n      setAddOrder?.(prev => {\n        // \u5982\u679C\u5DF2\u7ECF\u5B58\u5728\uFF0C\u5148\u79FB\u9664\u518D\u6DFB\u52A0\u5230\u672B\u5C3E\n        const filtered = prev.filter(t => t !== 'exchange')\n        return [...filtered, 'exchange']\n      })\n    }\n  }\n\n  if (!availableGifts?.length) return null\n\n  return (\n    <div className=\"ipc-product-detail-exchange-purchase\">\n      <Text className=\"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]\" html={title} />\n      <div className=\"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3\">\n        {availableGifts.map((gift: ProductVariant & { finalPrice?: ProductPrice }) => (\n          <div\n            key={gift.id}\n            className={cn(\n              'rounded-box h-[80px] laptop:h-[100px] flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold',\n              {\n                ['border-brand']: checkedExchangePurchase?.id === gift.id,\n              }\n            )}\n          >\n            <Checkbox\n              onCheckedChange={() => handleCheckboxClick(gift)}\n              size=\"lg\"\n              className={cn('rounded-full border-2 border-[#E4E5E6]', {\n                'border-brand': checkedExchangePurchase?.id === gift.id,\n              })}\n              id={gift.id}\n              checked={checkedExchangePurchase?.id === gift.id}\n              value={gift.id}\n            ></Checkbox>\n            <label\n              htmlFor={gift.id}\n              className=\"flex w-full cursor-pointer items-center justify-between gap-4 py-4 lg-desktop:py-6\"\n            >\n              <div className=\"flex items-center gap-2\">\n                <Picture source={gift.image?.url} className=\"size-12 shrink-0\" imgClassName=\"h-full\" />\n                <Text\n                  {...getTooltipProps(gift.product.title)}\n                  className=\"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold\"\n                  html={gift.product.title}\n                />\n                <FollowTooltip {...tooltip} />\n              </div>\n              <div className=\"tablet:flex-row flex shrink-0 flex-col items-center gap-1\">\n                <Text\n                  className=\"laptop:text-[20px] lg-desktop:text-2xl !leading-[1.2] text-base font-bold\"\n                  html={formatPrice({\n                    amount: gift?.finalPrice?.amount || 0,\n                    locale,\n                    currencyCode: gift?.finalPrice?.currencyCode || 'USD',\n                  })}\n                />\n                <Text\n                  className=\"laptop:text-[20px] lg-desktop:text-2xl text-base !leading-[1.2]  font-bold text-[#6D6D6F] line-through\"\n                  html={formatPrice({\n                    amount: gift.price.amount,\n                    locale,\n                    currencyCode: gift.price.currencyCode,\n                  })}\n                />\n              </div>\n            </label>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(ProductExchangePurchase)\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "Text", "Picture", "Checkbox", "cn", "useMemo", "useBizProductContext", "formatPrice", "useAiuiContext", "withLayout", "useFollowTooltip", "FollowTooltip", "ProductExchangePurchase", "locale", "tooltip", "getTooltipProps", "checkedExchangePurchase", "exchangePurchase", "setCheckedBundle", "setJoinedRecommendBuyProducts", "setSavingDetail", "setCheckedExchangePurchase", "joinedRecommendBuyProducts", "savingDetail", "setAddOrder", "title", "giftList", "freeLabel", "availableGifts", "item", "handleCheckboxClick", "value", "prev", "t", "gift", "ProductExchangePurchase_default"]
 }

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as r}from"react/jsx-runtime";import{Text as l,Picture as N,Checkbox as y}from"../../../../../../components/index.js";import{cn as f}from"../../../../../../helpers/index.js";import{useMemo as P}from"react";import{useBizProductContext as E}from"../../../../BizProductProvider.js";import{formatPrice as G}from"../../../../utils/index.js";import{useAiuiContext as w}from"../../../../../AiuiProvider/index.js";import{withLayout as z}from"../../../../../../shared/Styles.js";const B=()=>{const{locale:u="us"}=w(),{freeGift:x,checkedGift:o,setCheckedGift:d,setCheckedBundle:D,setSavingDetail:b,savingDetail:h,setJoinedRecommendBuyProducts:a,joinedRecommendBuyProducts:s,setAddOrder:c}=E(),{title:g,giftList:n=[],freeLabel:k}=x||{},m=P(()=>n?.filter(e=>e.availableForSale),[n]),v=e=>{o?.id===e.id?(d?.(void 0),b?.({...h,freeGift:0}),a?.({...s,gift:{value:void 0,canOperate:!0}}),c?.(i=>i.filter(p=>p!=="gift"))):(d?.(e),a?.({...s,gift:{value:e,canOperate:!1}}),c?.(i=>[...i.filter(C=>C!=="gift"),"gift"]))};return m?.length?r("div",{className:"ipc-product-detail-free-gift",children:[t(l,{size:3,className:"font-bold leading-[1.2]",html:g}),t("div",{className:"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3",children:m.map(e=>r("div",{className:f("rounded-box flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold",{"border-brand":o?.id===e.id}),children:[t(y,{onCheckedChange:()=>v(e),size:"lg",className:f("rounded-full border-2 border-[#E4E5E6]",{"border-brand":o?.id===e.id}),id:e.id,checked:o?.id===e.id,value:e.id}),r("label",{htmlFor:e.id,className:"flex w-full cursor-pointer items-center justify-between gap-4 py-6",children:[r("div",{className:"flex items-center gap-2",children:[t(N,{source:e.image?.url,className:"size-12 shrink-0"}),t(l,{className:"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold",html:e.product.title})]}),r("div",{className:"tablet:flex-row flex shrink-0 flex-col items-center gap-1",children:[t(l,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold",html:k}),t(l,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:G({amount:e.price.amount,locale:u,currencyCode:e.price.currencyCode})})]})]})]},e.id))})]}):null};var J=z(B);export{J as default};
+import{jsx as t,jsxs as o}from"react/jsx-runtime";import{Text as r,Picture as P,Checkbox as E}from"../../../../../../components/index.js";import{cn as f}from"../../../../../../helpers/index.js";import{useMemo as w}from"react";import{useBizProductContext as F}from"../../../../BizProductProvider.js";import{formatPrice as G}from"../../../../utils/index.js";import{useAiuiContext as B}from"../../../../../AiuiProvider/index.js";import{withLayout as D}from"../../../../../../shared/Styles.js";import{useFollowTooltip as T,FollowTooltip as z}from"../../../../hooks/useFollowTooltip.js";const L=()=>{const{locale:u="us"}=B(),{tooltip:x,getTooltipProps:b}=T(),{freeGift:h,checkedGift:l,setCheckedGift:d,setCheckedBundle:O,setSavingDetail:g,savingDetail:k,setJoinedRecommendBuyProducts:a,joinedRecommendBuyProducts:s,setAddOrder:c}=F(),{title:v,giftList:p=[],freeLabel:C}=h||{},n=w(()=>p?.filter(e=>e.availableForSale),[p]),N=e=>{l?.id===e.id?(d?.(void 0),g?.({...k,freeGift:0}),a?.({...s,gift:{value:void 0,canOperate:!0}}),c?.(i=>i.filter(m=>m!=="gift"))):(d?.(e),a?.({...s,gift:{value:e,canOperate:!1}}),c?.(i=>[...i.filter(y=>y!=="gift"),"gift"]))};return n?.length?o("div",{className:"ipc-product-detail-free-gift",children:[t(r,{className:"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]",html:v}),t("div",{className:"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3",children:n.map(e=>o("div",{className:f("rounded-box h-[80px] laptop:h-[100px] flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold",{"border-brand":l?.id===e.id}),children:[t(E,{onCheckedChange:()=>N(e),size:"lg",className:f("rounded-full border-2 border-[#E4E5E6]",{"border-brand":l?.id===e.id}),id:e.id,checked:l?.id===e.id,value:e.id}),o("label",{htmlFor:e.id,className:"flex w-full cursor-pointer items-center justify-between gap-4 py-4 lg-desktop:py-6",children:[o("div",{className:"flex items-center gap-2",children:[t(P,{source:e.image?.url,className:"size-12 shrink-0",imgClassName:"h-full"}),t(r,{...b(e.product.title),className:"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold",html:e.product.title}),t(z,{...x})]}),o("div",{className:"tablet:flex-row flex shrink-0 flex-col items-center gap-1",children:[t(r,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold !leading-[1.2]",html:C}),t(r,{className:"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through !leading-[1.2]",html:G({amount:e.price.amount,locale:u,currencyCode:e.price.currencyCode})})]})]})]},e.id))})]}):null};var I=D(L);export{I as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.tsx"],
-  "sourcesContent": ["import { Text, Picture, Checkbox } from '../../../../../../components/index.js'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { useEffect, useMemo } from 'react'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { formatPrice } from '../../../../utils/index.js'\nimport { useAiuiContext } from '../../../../../AiuiProvider/index.js'\nimport type { ProductVariant } from '../../../../types/product'\nimport { withLayout } from '../../../../../../shared/Styles.js'\n\nconst ProductFreeGift = () => {\n  const { locale = 'us' } = useAiuiContext()\n  const {\n    freeGift,\n    checkedGift,\n    setCheckedGift,\n    setCheckedBundle,\n    setSavingDetail,\n    savingDetail,\n    setJoinedRecommendBuyProducts,\n    joinedRecommendBuyProducts,\n    setAddOrder,\n  } = useBizProductContext()\n  const { title, giftList = [], freeLabel } = freeGift || {}\n  const availableGifts = useMemo(() => giftList?.filter(item => item.availableForSale), [giftList])\n\n  const handleCheckboxClick = (value: ProductVariant) => {\n    if (checkedGift?.id === value.id) {\n      setCheckedGift?.(undefined)\n      setSavingDetail?.({ ...savingDetail, freeGift: 0 })\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        gift: {\n          value: undefined,\n          canOperate: true,\n        },\n      })\n      // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n      setAddOrder?.(prev => prev.filter(t => t !== 'gift'))\n    } else {\n      setCheckedGift?.(value)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        gift: {\n          value,\n          canOperate: false,\n        },\n      })\n      // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n      setAddOrder?.(prev => {\n        // \u5982\u679C\u5DF2\u7ECF\u5B58\u5728\uFF0C\u5148\u79FB\u9664\u518D\u6DFB\u52A0\u5230\u672B\u5C3E\n        const filtered = prev.filter(t => t !== 'gift')\n        return [...filtered, 'gift']\n      })\n    }\n  }\n\n  // useEffect(() => {\n  //   // \u5982\u679C\u7B2C\u4E00\u4E2A\u793C\u7269\u53EF\u7528\uFF0C\u5219\u9009\u4E2D\u5B83\n  //   availableGifts?.[0] && handleCheckboxClick(availableGifts?.[0])\n  // }, [availableGifts])\n\n  if (!availableGifts?.length) return null\n\n  return (\n    <div className=\"ipc-product-detail-free-gift\">\n      <Text size={3} className=\"font-bold leading-[1.2]\" html={title} />\n      <div className=\"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3\">\n        {availableGifts.map(gift => (\n          <div\n            key={gift.id}\n            className={cn('rounded-box flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold', {\n              ['border-brand']: checkedGift?.id === gift.id,\n            })}\n          >\n            <Checkbox\n              onCheckedChange={() => handleCheckboxClick(gift)}\n              size=\"lg\"\n              className={cn('rounded-full border-2 border-[#E4E5E6]', {\n                'border-brand': checkedGift?.id === gift.id,\n              })}\n              id={gift.id}\n              checked={checkedGift?.id === gift.id}\n              value={gift.id}\n            ></Checkbox>\n            <label htmlFor={gift.id} className=\"flex w-full cursor-pointer items-center justify-between gap-4 py-6\">\n              <div className=\"flex items-center gap-2\">\n                <Picture source={gift.image?.url} className=\"size-12 shrink-0\" />\n                <Text\n                  className=\"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold\"\n                  html={gift.product.title}\n                />\n              </div>\n              <div className=\"tablet:flex-row flex shrink-0 flex-col items-center gap-1\">\n                <Text className=\"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold\" html={freeLabel} />\n                <Text\n                  className=\"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through\"\n                  html={formatPrice({\n                    amount: gift.price.amount,\n                    locale,\n                    currencyCode: gift.price.currencyCode,\n                  })}\n                />\n              </div>\n            </label>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(ProductFreeGift)\n"],
-  "mappings": "AAiEM,cAAAA,EAoBQ,QAAAC,MApBR,oBAjEN,OAAS,QAAAC,EAAM,WAAAC,EAAS,YAAAC,MAAgB,wCACxC,OAAS,MAAAC,MAAU,qCACnB,OAAoB,WAAAC,MAAe,QACnC,OAAS,wBAAAC,MAA4B,oCACrC,OAAS,eAAAC,MAAmB,6BAC5B,OAAS,kBAAAC,MAAsB,uCAE/B,OAAS,cAAAC,MAAkB,qCAE3B,MAAMC,EAAkB,IAAM,CAC5B,KAAM,CAAE,OAAAC,EAAS,IAAK,EAAIH,EAAe,EACnC,CACJ,SAAAI,EACA,YAAAC,EACA,eAAAC,EACA,iBAAAC,EACA,gBAAAC,EACA,aAAAC,EACA,8BAAAC,EACA,2BAAAC,EACA,YAAAC,CACF,EAAId,EAAqB,EACnB,CAAE,MAAAe,EAAO,SAAAC,EAAW,CAAC,EAAG,UAAAC,CAAU,EAAIX,GAAY,CAAC,EACnDY,EAAiBnB,EAAQ,IAAMiB,GAAU,OAAOG,GAAQA,EAAK,gBAAgB,EAAG,CAACH,CAAQ,CAAC,EAE1FI,EAAuBC,GAA0B,CACjDd,GAAa,KAAOc,EAAM,IAC5Bb,IAAiB,MAAS,EAC1BE,IAAkB,CAAE,GAAGC,EAAc,SAAU,CAAE,CAAC,EAClDC,IAAgC,CAC9B,GAAGC,EACH,KAAM,CACJ,MAAO,OACP,WAAY,EACd,CACF,CAAC,EAEDC,IAAcQ,GAAQA,EAAK,OAAOC,GAAKA,IAAM,MAAM,CAAC,IAEpDf,IAAiBa,CAAK,EACtBT,IAAgC,CAC9B,GAAGC,EACH,KAAM,CACJ,MAAAQ,EACA,WAAY,EACd,CACF,CAAC,EAEDP,IAAcQ,GAGL,CAAC,GADSA,EAAK,OAAOC,GAAKA,IAAM,MAAM,EACzB,MAAM,CAC5B,EAEL,EAOA,OAAKL,GAAgB,OAGnBxB,EAAC,OAAI,UAAU,+BACb,UAAAD,EAACE,EAAA,CAAK,KAAM,EAAG,UAAU,0BAA0B,KAAMoB,EAAO,EAChEtB,EAAC,OAAI,UAAU,uFACZ,SAAAyB,EAAe,IAAIM,GAClB9B,EAAC,OAEC,UAAWI,EAAG,yFAA0F,CACrG,eAAiBS,GAAa,KAAOiB,EAAK,EAC7C,CAAC,EAED,UAAA/B,EAACI,EAAA,CACC,gBAAiB,IAAMuB,EAAoBI,CAAI,EAC/C,KAAK,KACL,UAAW1B,EAAG,yCAA0C,CACtD,eAAgBS,GAAa,KAAOiB,EAAK,EAC3C,CAAC,EACD,GAAIA,EAAK,GACT,QAASjB,GAAa,KAAOiB,EAAK,GAClC,MAAOA,EAAK,GACb,EACD9B,EAAC,SAAM,QAAS8B,EAAK,GAAI,UAAU,qEACjC,UAAA9B,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACG,EAAA,CAAQ,OAAQ4B,EAAK,OAAO,IAAK,UAAU,mBAAmB,EAC/D/B,EAACE,EAAA,CACC,UAAU,2EACV,KAAM6B,EAAK,QAAQ,MACrB,GACF,EACA9B,EAAC,OAAI,UAAU,4DACb,UAAAD,EAACE,EAAA,CAAK,UAAU,6DAA6D,KAAMsB,EAAW,EAC9FxB,EAACE,EAAA,CACC,UAAU,yFACV,KAAMM,EAAY,CAChB,OAAQuB,EAAK,MAAM,OACnB,OAAAnB,EACA,aAAcmB,EAAK,MAAM,YAC3B,CAAC,EACH,GACF,GACF,IAlCKA,EAAK,EAmCZ,CACD,EACH,GACF,EA9CkC,IAgDtC,EAEA,IAAOC,EAAQtB,EAAWC,CAAe",
-  "names": ["jsx", "jsxs", "Text", "Picture", "Checkbox", "cn", "useMemo", "useBizProductContext", "formatPrice", "useAiuiContext", "withLayout", "ProductFreeGift", "locale", "freeGift", "checkedGift", "setCheckedGift", "setCheckedBundle", "setSavingDetail", "savingDetail", "setJoinedRecommendBuyProducts", "joinedRecommendBuyProducts", "setAddOrder", "title", "giftList", "freeLabel", "availableGifts", "item", "handleCheckboxClick", "value", "prev", "t", "gift", "ProductFreeGift_default"]
+  "sourcesContent": ["import { Text, Picture, Checkbox } from '../../../../../../components/index.js'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { useEffect, useMemo } from 'react'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { formatPrice } from '../../../../utils/index.js'\nimport { useAiuiContext } from '../../../../../AiuiProvider/index.js'\nimport type { ProductVariant } from '../../../../types/product'\nimport { withLayout } from '../../../../../../shared/Styles.js'\nimport { useFollowTooltip, FollowTooltip } from '../../../../hooks/useFollowTooltip.js'\n\nconst ProductFreeGift = () => {\n  const { locale = 'us' } = useAiuiContext()\n  const { tooltip, getTooltipProps } = useFollowTooltip()\n  const {\n    freeGift,\n    checkedGift,\n    setCheckedGift,\n    setCheckedBundle,\n    setSavingDetail,\n    savingDetail,\n    setJoinedRecommendBuyProducts,\n    joinedRecommendBuyProducts,\n    setAddOrder,\n  } = useBizProductContext()\n  const { title, giftList = [], freeLabel } = freeGift || {}\n  const availableGifts = useMemo(() => giftList?.filter(item => item.availableForSale), [giftList])\n\n  const handleCheckboxClick = (value: ProductVariant) => {\n    if (checkedGift?.id === value.id) {\n      setCheckedGift?.(undefined)\n      setSavingDetail?.({ ...savingDetail, freeGift: 0 })\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        gift: {\n          value: undefined,\n          canOperate: true,\n        },\n      })\n      // \u4ECE\u6DFB\u52A0\u987A\u5E8F\u4E2D\u79FB\u9664\n      setAddOrder?.(prev => prev.filter(t => t !== 'gift'))\n    } else {\n      setCheckedGift?.(value)\n      setJoinedRecommendBuyProducts?.({\n        ...joinedRecommendBuyProducts,\n        gift: {\n          value,\n          canOperate: false,\n        },\n      })\n      // \u6DFB\u52A0\u5230\u987A\u5E8F\u6570\u7EC4\u7684\u672B\u5C3E\n      setAddOrder?.(prev => {\n        // \u5982\u679C\u5DF2\u7ECF\u5B58\u5728\uFF0C\u5148\u79FB\u9664\u518D\u6DFB\u52A0\u5230\u672B\u5C3E\n        const filtered = prev.filter(t => t !== 'gift')\n        return [...filtered, 'gift']\n      })\n    }\n  }\n\n  // useEffect(() => {\n  //   // \u5982\u679C\u7B2C\u4E00\u4E2A\u793C\u7269\u53EF\u7528\uFF0C\u5219\u9009\u4E2D\u5B83\n  //   availableGifts?.[0] && handleCheckboxClick(availableGifts?.[0])\n  // }, [availableGifts])\n\n  if (!availableGifts?.length) return null\n\n  return (\n    <div className=\"ipc-product-detail-free-gift\">\n      <Text className=\"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]\" html={title} />\n      <div className=\"laptop:grid-cols-2 laptop-md:grid-cols-1 lg-desktop:mt-4 mt-3 grid grid-cols-1 gap-3\">\n        {availableGifts.map(gift => (\n          <div\n            key={gift.id}\n            className={cn(\n              'rounded-box h-[80px] laptop:h-[100px] flex items-center gap-2 border-2 border-[#E4E5E6] px-4 text-left font-bold',\n              {\n                ['border-brand']: checkedGift?.id === gift.id,\n              }\n            )}\n          >\n            <Checkbox\n              onCheckedChange={() => handleCheckboxClick(gift)}\n              size=\"lg\"\n              className={cn('rounded-full border-2 border-[#E4E5E6]', {\n                'border-brand': checkedGift?.id === gift.id,\n              })}\n              id={gift.id}\n              checked={checkedGift?.id === gift.id}\n              value={gift.id}\n            ></Checkbox>\n            <label\n              htmlFor={gift.id}\n              className=\"flex w-full cursor-pointer items-center justify-between gap-4 py-4 lg-desktop:py-6\"\n            >\n              <div className=\"flex items-center gap-2\">\n                <Picture source={gift.image?.url} className=\"size-12 shrink-0\" imgClassName=\"h-full\" />\n                <Text\n                  {...getTooltipProps(gift.product.title)}\n                  className=\"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-sm font-bold\"\n                  html={gift.product.title}\n                />\n                <FollowTooltip {...tooltip} />\n              </div>\n              <div className=\"tablet:flex-row flex shrink-0 flex-col items-center gap-1\">\n                <Text\n                  className=\"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold !leading-[1.2]\"\n                  html={freeLabel}\n                />\n                <Text\n                  className=\"laptop:text-[20px] lg-desktop:text-2xl text-base font-bold text-[#6D6D6F] line-through !leading-[1.2]\"\n                  html={formatPrice({\n                    amount: gift.price.amount,\n                    locale,\n                    currencyCode: gift.price.currencyCode,\n                  })}\n                />\n              </div>\n            </label>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(ProductFreeGift)\n"],
+  "mappings": "AAmEM,cAAAA,EA0BQ,QAAAC,MA1BR,oBAnEN,OAAS,QAAAC,EAAM,WAAAC,EAAS,YAAAC,MAAgB,wCACxC,OAAS,MAAAC,MAAU,qCACnB,OAAoB,WAAAC,MAAe,QACnC,OAAS,wBAAAC,MAA4B,oCACrC,OAAS,eAAAC,MAAmB,6BAC5B,OAAS,kBAAAC,MAAsB,uCAE/B,OAAS,cAAAC,MAAkB,qCAC3B,OAAS,oBAAAC,EAAkB,iBAAAC,MAAqB,wCAEhD,MAAMC,EAAkB,IAAM,CAC5B,KAAM,CAAE,OAAAC,EAAS,IAAK,EAAIL,EAAe,EACnC,CAAE,QAAAM,EAAS,gBAAAC,CAAgB,EAAIL,EAAiB,EAChD,CACJ,SAAAM,EACA,YAAAC,EACA,eAAAC,EACA,iBAAAC,EACA,gBAAAC,EACA,aAAAC,EACA,8BAAAC,EACA,2BAAAC,EACA,YAAAC,CACF,EAAIlB,EAAqB,EACnB,CAAE,MAAAmB,EAAO,SAAAC,EAAW,CAAC,EAAG,UAAAC,CAAU,EAAIX,GAAY,CAAC,EACnDY,EAAiBvB,EAAQ,IAAMqB,GAAU,OAAOG,GAAQA,EAAK,gBAAgB,EAAG,CAACH,CAAQ,CAAC,EAE1FI,EAAuBC,GAA0B,CACjDd,GAAa,KAAOc,EAAM,IAC5Bb,IAAiB,MAAS,EAC1BE,IAAkB,CAAE,GAAGC,EAAc,SAAU,CAAE,CAAC,EAClDC,IAAgC,CAC9B,GAAGC,EACH,KAAM,CACJ,MAAO,OACP,WAAY,EACd,CACF,CAAC,EAEDC,IAAcQ,GAAQA,EAAK,OAAOC,GAAKA,IAAM,MAAM,CAAC,IAEpDf,IAAiBa,CAAK,EACtBT,IAAgC,CAC9B,GAAGC,EACH,KAAM,CACJ,MAAAQ,EACA,WAAY,EACd,CACF,CAAC,EAEDP,IAAcQ,GAGL,CAAC,GADSA,EAAK,OAAOC,GAAKA,IAAM,MAAM,EACzB,MAAM,CAC5B,EAEL,EAOA,OAAKL,GAAgB,OAGnB5B,EAAC,OAAI,UAAU,+BACb,UAAAD,EAACE,EAAA,CAAK,UAAU,6DAA6D,KAAMwB,EAAO,EAC1F1B,EAAC,OAAI,UAAU,uFACZ,SAAA6B,EAAe,IAAIM,GAClBlC,EAAC,OAEC,UAAWI,EACT,mHACA,CACG,eAAiBa,GAAa,KAAOiB,EAAK,EAC7C,CACF,EAEA,UAAAnC,EAACI,EAAA,CACC,gBAAiB,IAAM2B,EAAoBI,CAAI,EAC/C,KAAK,KACL,UAAW9B,EAAG,yCAA0C,CACtD,eAAgBa,GAAa,KAAOiB,EAAK,EAC3C,CAAC,EACD,GAAIA,EAAK,GACT,QAASjB,GAAa,KAAOiB,EAAK,GAClC,MAAOA,EAAK,GACb,EACDlC,EAAC,SACC,QAASkC,EAAK,GACd,UAAU,qFAEV,UAAAlC,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACG,EAAA,CAAQ,OAAQgC,EAAK,OAAO,IAAK,UAAU,mBAAmB,aAAa,SAAS,EACrFnC,EAACE,EAAA,CACE,GAAGc,EAAgBmB,EAAK,QAAQ,KAAK,EACtC,UAAU,2EACV,KAAMA,EAAK,QAAQ,MACrB,EACAnC,EAACY,EAAA,CAAe,GAAGG,EAAS,GAC9B,EACAd,EAAC,OAAI,UAAU,4DACb,UAAAD,EAACE,EAAA,CACC,UAAU,4EACV,KAAM0B,EACR,EACA5B,EAACE,EAAA,CACC,UAAU,wGACV,KAAMM,EAAY,CAChB,OAAQ2B,EAAK,MAAM,OACnB,OAAArB,EACA,aAAcqB,EAAK,MAAM,YAC3B,CAAC,EACH,GACF,GACF,IA7CKA,EAAK,EA8CZ,CACD,EACH,GACF,EAzDkC,IA2DtC,EAEA,IAAOC,EAAQ1B,EAAWG,CAAe",
+  "names": ["jsx", "jsxs", "Text", "Picture", "Checkbox", "cn", "useMemo", "useBizProductContext", "formatPrice", "useAiuiContext", "withLayout", "useFollowTooltip", "FollowTooltip", "ProductFreeGift", "locale", "tooltip", "getTooltipProps", "freeGift", "checkedGift", "setCheckedGift", "setCheckedBundle", "setSavingDetail", "savingDetail", "setJoinedRecommendBuyProducts", "joinedRecommendBuyProducts", "setAddOrder", "title", "giftList", "freeLabel", "availableGifts", "item", "handleCheckboxClick", "value", "prev", "t", "gift", "ProductFreeGift_default"]
 }

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import{jsx as e,jsxs as s}from"react/jsx-runtime";import{Text as u,Picture as k,Button as w,Dialog as y,DialogContent as N,DialogTrigger as C}from"../../../../../../components/index.js";import{Content as f,List as T,Root as E,Trigger as D}from"@radix-ui/react-tabs";import{useCallback as v,useEffect as A,useMemo as _,useRef as h,useState as x}from"react";import{cn as L}from"../../../../../../helpers/index.js";import{useBizProductContext as P}from"../../../../BizProductProvider.js";import{withLayout as R}from"../../../../../../shared/Styles.js";import{gaTrack as H}from"../../../../../../shared/track.js";const I=()=>{const{product:i,variant:a}=P(),[g,p]=x(!1),l=_(()=>i?.payload?.components?.find(o=>o.componentKey==="ProductHighlight")?.data||{},[i?.payload]),[r,n]=x(l?.ksp?.[0]),t=v(o=>{H({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:`Product Detail Page${a.sku}`,position:l?.title||"",button_name:o||l?.view||""}})},[l?.title,l?.view,a.sku]);return Reflect.ownKeys(l).length?s("div",{className:"ipc-product-detail-highlight",children:[s("div",{className:"flex items-center justify-between",children:[l?.title&&e(u,{size:3,className:"font-bold leading-[1.2]",html:l?.title}),s(y,{open:g,onOpenChange:p,children:[e(C,{asChild:!0,children:e(w,{variant:"link",className:"!p-0 text-base font-bold",onClick:()=>t(),children:l?.view})}),e(z,{ksp:l?.ksp||[],activeKspItem:r,setActiveKspItem:n,gaTrackEvent:t})]})]}),e("div",{className:"lg-desktop:mt-4 mt-3 flex flex-wrap gap-4",children:l?.ksp?.map(o=>e("div",{className:"product-highlight-item lg-desktop:h-[38px] lg-desktop:leading-[38px] h-[36px] cursor-pointer rounded-full bg-[#F5F5F7] px-4 leading-[36px] hover:bg-[#EAEAEC]",children:e(u,{size:3,onClick:()=>{n(o),p(!0),t(o?.title)},className:"lg-desktop:text-[16px] line-clamp-1 overflow-hidden break-all text-[14px] font-bold text-[#080A0F]",html:o?.title})},o?.title))})]}):null},z=({ksp:i,activeKspItem:a,setActiveKspItem:g,gaTrackEvent:p})=>{const l=h([]),r=h(null),n=v(t=>{const o=i.findIndex(d=>d.title===t?.title),c=l.current[o];if(c&&r.current){const d=r.current,m=c,b=m.offsetLeft-d.offsetWidth/2+m.offsetWidth/2;d.scrollTo({left:b,behavior:"smooth"})}},[i]);return A(()=>{a&&setTimeout(()=>{n(a)},100)},[n,a]),s(N,{className:"tablet:max-w-[896px] [&_.dialog-close-icon]:laptop:size-6 !rounded-box mx-auto w-full max-w-[326px] overflow-hidden border-none bg-transparent p-0 [&_.dialog-close-icon]:size-4",children:[e("style",{children:`
+import{jsx as e,jsxs as s}from"react/jsx-runtime";import{Text as g,Picture as w,Button as k,Dialog as y,DialogContent as N,DialogTrigger as C}from"../../../../../../components/index.js";import{Content as f,List as T,Root as D,Trigger as E}from"@radix-ui/react-tabs";import{useCallback as x,useEffect as _,useMemo as A,useRef as v,useState as h}from"react";import{cn as L}from"../../../../../../helpers/index.js";import{useBizProductContext as P}from"../../../../BizProductProvider.js";import{withLayout as R}from"../../../../../../shared/Styles.js";import{gaTrack as H}from"../../../../../../shared/track.js";const I=()=>{const{product:i,variant:a}=P(),[u,p]=h(!1),l=A(()=>i?.payload?.components?.find(o=>o.componentKey==="ProductHighlight")?.data||{},[i?.payload]),[r,n]=h(l?.ksp?.[0]),t=x(o=>{H({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:`Product Detail Page${a.sku}`,position:l?.title||"",button_name:o||l?.view||""}})},[l?.title,l?.view,a.sku]);return Reflect.ownKeys(l).length?s("div",{className:"ipc-product-detail-highlight",children:[s("div",{className:"flex items-center justify-between",children:[l?.title&&e(g,{className:"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]",html:l?.title}),s(y,{open:u,onOpenChange:p,children:[e(C,{asChild:!0,children:e(k,{variant:"link",className:"!p-0 text-[14px] lg-desktop:text-[16px] font-bold",onClick:()=>t(),children:l?.view})}),e(z,{ksp:l?.ksp||[],activeKspItem:r,setActiveKspItem:n,gaTrackEvent:t})]})]}),e("ul",{className:"lg-desktop:mt-4 mt-3 flex list-disc flex-col gap-1 pl-5",children:l?.ksp?.map(o=>e("li",{className:"product-highlight-item cursor-pointer",children:e(g,{size:3,onClick:()=>{n(o),p(!0),t(o?.title)},className:"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-1 overflow-hidden break-all text-[14px] font-bold text-[#080A0F]",html:o?.title})},o?.title))})]}):null},z=({ksp:i,activeKspItem:a,setActiveKspItem:u,gaTrackEvent:p})=>{const l=v([]),r=v(null),n=x(t=>{const o=i.findIndex(d=>d.title===t?.title),c=l.current[o];if(c&&r.current){const d=r.current,m=c,b=m.offsetLeft-d.offsetWidth/2+m.offsetWidth/2;d.scrollTo({left:b,behavior:"smooth"})}},[i]);return _(()=>{a&&setTimeout(()=>{n(a)},100)},[n,a]),s(N,{className:"tablet:max-w-[90vw] tablet:w-[896px] [&_.dialog-close-icon]:laptop:size-6 !rounded-box mx-auto w-full max-w-[326px] overflow-hidden border-none bg-transparent p-0 [&_.dialog-close-icon]:size-4",children:[e("style",{children:`
         .dialog-close-icon {
           color: ${a?.closeColor||"#1D1D1F"};
         }
-      `}),s(E,{value:a?.title,className:"w-full overflow-hidden",children:[i?.map(t=>e(f,{value:t.title,children:e(k,{source:`${t?.img}, ${t?.mobileImg} 767`,className:"laptop-md:h-[480px] h-[304px] w-full",alt:t.img.alt,imgClassName:"object-cover h-full"})},t.title)),s("div",{className:"laptop-md:py-6 w-full overflow-visible bg-white py-4",children:[e("div",{ref:r,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:"laptop-md:px-6 overflow-x-auto px-4",children:e("div",{className:"rounded-btn w-fit bg-[#EAEAEC]",children:e(T,{className:"flex w-max p-1",children:i?.map((t,o)=>e(D,{ref:c=>{c&&(l.current[o]=c)},className:L("lg-desktop:px-7 rounded-btn h-[38px] shrink-0 px-5 leading-[38px]",t.title===a?.title&&"bg-white"),onClick:()=>{n(t),g(t),p(t?.title)},value:t.title,children:e(u,{html:t.title,className:"text-[14px] font-bold leading-[1.2]"})},o+t.title))})})}),e("div",{className:"laptop-md:px-6 mt-4 px-4",children:i?.map((t,o)=>e(f,{value:t.title,className:"laptop-md:text-[18px] text-[14px] font-bold",children:t.description},o+t.title))})]})]})]})};var W=R(I);export{W as default};
+      `}),s(D,{value:a?.title,className:"w-full overflow-hidden",children:[i?.map(t=>e(f,{value:t.title,children:e(w,{source:`${t?.img}, ${t?.mobileImg} 767`,className:"laptop-md:h-[480px] h-[304px] w-full",alt:t.img.alt,imgClassName:"object-cover h-full"})},t.title)),s("div",{className:"laptop-md:py-6 w-full overflow-visible bg-white py-4",children:[e("div",{ref:r,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:"laptop-md:px-6 overflow-x-auto px-4",children:e("div",{className:"rounded-btn w-fit bg-[#EAEAEC]",children:e(T,{className:"flex w-max p-1",children:i?.map((t,o)=>e(E,{ref:c=>{c&&(l.current[o]=c)},className:L("lg-desktop:px-7 rounded-btn h-[38px] shrink-0 px-5 leading-[38px]",t.title===a?.title&&"bg-white"),onClick:()=>{n(t),u(t),p(t?.title)},value:t.title,children:e(g,{html:t.title,className:"text-[14px] font-bold leading-[1.2]"})},o+t.title))})})}),e("div",{className:"laptop-md:px-6 mt-4 px-4",children:i?.map((t,o)=>e(f,{value:t.title,className:"laptop-md:text-[18px] text-[14px] font-bold",children:t.description},o+t.title))})]})]})]})};var F=R(I);export{F as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.tsx"],
-  "sourcesContent": ["import { Text, Picture, Button, Dialog, DialogContent, DialogTrigger } from '../../../../../../components/index.js'\nimport { Content, List, Root, Trigger } from '@radix-ui/react-tabs'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { withLayout } from '../../../../../../shared/Styles.js'\nimport { gaTrack } from '../../../../../../shared/track.js'\n\nconst ProductHighlight = () => {\n  const { product, variant } = useBizProductContext()\n  const [open, setOpen] = useState(false)\n\n  const productHighlightData = useMemo(() => {\n    return product?.payload?.components?.find((item: any) => item.componentKey === 'ProductHighlight')?.data || {}\n  }, [product?.payload])\n\n  const [activeKspItem, setActiveKspItem] = useState(productHighlightData?.ksp?.[0])\n\n  const gaTrackEvent = useCallback(\n    (buttonName?: string) => {\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'lp_button',\n        event_parameters: {\n          page_group: `Product Detail Page${variant.sku}`,\n          position: productHighlightData?.title || '',\n          button_name: buttonName || productHighlightData?.view || '',\n        },\n      })\n    },\n    [productHighlightData?.title, productHighlightData?.view, variant.sku]\n  )\n\n  if (!Reflect.ownKeys(productHighlightData).length) return null\n\n  return (\n    <div className=\"ipc-product-detail-highlight\">\n      <div className=\"flex items-center justify-between\">\n        {productHighlightData?.title && (\n          <Text size={3} className=\"font-bold leading-[1.2]\" html={productHighlightData?.title} />\n        )}\n        <Dialog open={open} onOpenChange={setOpen}>\n          <DialogTrigger asChild>\n            <Button variant=\"link\" className=\"!p-0 text-base font-bold\" onClick={() => gaTrackEvent()}>\n              {productHighlightData?.view}\n            </Button>\n          </DialogTrigger>\n          <ProductHighlightModal\n            ksp={productHighlightData?.ksp || []}\n            activeKspItem={activeKspItem}\n            setActiveKspItem={setActiveKspItem}\n            gaTrackEvent={gaTrackEvent}\n          />\n        </Dialog>\n      </div>\n      <div className=\"lg-desktop:mt-4 mt-3 flex flex-wrap gap-4\">\n        {productHighlightData?.ksp?.map((item: any) => (\n          <div\n            key={item?.title}\n            className=\"product-highlight-item lg-desktop:h-[38px] lg-desktop:leading-[38px] h-[36px] cursor-pointer rounded-full bg-[#F5F5F7] px-4 leading-[36px] hover:bg-[#EAEAEC]\"\n          >\n            <Text\n              size={3}\n              onClick={() => {\n                setActiveKspItem(item)\n                setOpen(true)\n                gaTrackEvent(item?.title)\n              }}\n              className=\"lg-desktop:text-[16px] line-clamp-1 overflow-hidden break-all text-[14px] font-bold text-[#080A0F]\"\n              html={item?.title}\n            />\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nconst ProductHighlightModal = ({\n  ksp,\n  activeKspItem,\n  setActiveKspItem,\n  gaTrackEvent,\n}: {\n  ksp: any[]\n  activeKspItem: any\n  setActiveKspItem: (_activeKspItem: any) => void\n  gaTrackEvent: (_buttonName: string) => void\n}) => {\n  const highlightRef = useRef<HTMLButtonElement[]>([])\n  const scrollContainerRef = useRef<HTMLDivElement>(null)\n\n  const autoScrollToActiveItem = useCallback(\n    (activeKspItem: any) => {\n      const curIndex = ksp.findIndex(item => item.title === activeKspItem?.title)\n      const curRef = highlightRef.current[curIndex]\n\n      if (curRef && scrollContainerRef.current) {\n        const container = scrollContainerRef.current\n        const button = curRef\n        const scrollLeft = button.offsetLeft - container.offsetWidth / 2 + button.offsetWidth / 2\n\n        container.scrollTo({\n          left: scrollLeft,\n          behavior: 'smooth',\n        })\n      }\n    },\n    [ksp]\n  )\n\n  useEffect(() => {\n    if (!activeKspItem) return\n    // setActiveKspItem(clickActiveKspItem)\n\n    // \u5EF6\u8FDF\u6267\u884C\uFF0C\u7B49\u5F85 Dialog \u548C\u5185\u90E8\u5143\u7D20\u5B8C\u5168\u6E32\u67D3\n    setTimeout(() => {\n      autoScrollToActiveItem(activeKspItem)\n    }, 100)\n  }, [autoScrollToActiveItem, activeKspItem])\n\n  return (\n    <DialogContent className=\"tablet:max-w-[896px] [&_.dialog-close-icon]:laptop:size-6 !rounded-box mx-auto w-full max-w-[326px] overflow-hidden border-none bg-transparent p-0 [&_.dialog-close-icon]:size-4\">\n      <style>{`\n        .dialog-close-icon {\n          color: ${activeKspItem?.closeColor || '#1D1D1F'};\n        }\n      `}</style>\n      <Root value={activeKspItem?.title} className=\"w-full overflow-hidden\">\n        {ksp?.map(item => (\n          <Content value={item.title} key={item.title}>\n            <Picture\n              source={`${item?.img}, ${item?.mobileImg} 767`}\n              className=\"laptop-md:h-[480px] h-[304px] w-full\"\n              alt={item.img.alt}\n              imgClassName=\"object-cover h-full\"\n            />\n          </Content>\n        ))}\n        <div className=\"laptop-md:py-6 w-full overflow-visible bg-white py-4\">\n          <div\n            ref={scrollContainerRef}\n            style={{\n              scrollbarWidth: 'none',\n              msOverflowStyle: 'none',\n            }}\n            className=\"laptop-md:px-6 overflow-x-auto px-4\"\n          >\n            <div className=\"rounded-btn w-fit bg-[#EAEAEC]\">\n              <List className=\"flex w-max p-1\">\n                {ksp?.map((item, index) => (\n                  <Trigger\n                    ref={el => {\n                      if (el) {\n                        highlightRef.current[index] = el\n                      }\n                    }}\n                    className={cn(\n                      'lg-desktop:px-7 rounded-btn h-[38px] shrink-0 px-5 leading-[38px]',\n                      item.title === activeKspItem?.title && 'bg-white'\n                    )}\n                    onClick={() => {\n                      autoScrollToActiveItem(item)\n                      setActiveKspItem(item)\n                      gaTrackEvent(item?.title)\n                    }}\n                    key={index + item.title}\n                    value={item.title}\n                  >\n                    <Text html={item.title} className=\"text-[14px] font-bold leading-[1.2]\" />\n                  </Trigger>\n                ))}\n              </List>\n            </div>\n          </div>\n          <div className=\"laptop-md:px-6 mt-4 px-4\">\n            {ksp?.map((item, index) => (\n              <Content\n                value={item.title}\n                key={index + item.title}\n                className=\"laptop-md:text-[18px] text-[14px] font-bold\"\n              >\n                {item.description}\n              </Content>\n            ))}\n          </div>\n        </div>\n      </Root>\n    </DialogContent>\n  )\n}\n\nexport default withLayout(ProductHighlight)\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { Text, Picture, Button, Dialog, DialogContent, DialogTrigger } from '../../../../../../components/index.js'\nimport { Content, List, Root, Trigger } from '@radix-ui/react-tabs'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { cn } from '../../../../../../helpers/index.js'\nimport { useBizProductContext } from '../../../../BizProductProvider.js'\nimport { withLayout } from '../../../../../../shared/Styles.js'\nimport { gaTrack } from '../../../../../../shared/track.js'\n\nconst ProductHighlight = () => {\n  const { product, variant } = useBizProductContext()\n  const [open, setOpen] = useState(false)\n\n  const productHighlightData = useMemo(() => {\n    return product?.payload?.components?.find((item: any) => item.componentKey === 'ProductHighlight')?.data || {}\n  }, [product?.payload])\n\n  const [activeKspItem, setActiveKspItem] = useState(productHighlightData?.ksp?.[0])\n\n  const gaTrackEvent = useCallback(\n    (buttonName?: string) => {\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'lp_button',\n        event_parameters: {\n          page_group: `Product Detail Page${variant.sku}`,\n          position: productHighlightData?.title || '',\n          button_name: buttonName || productHighlightData?.view || '',\n        },\n      })\n    },\n    [productHighlightData?.title, productHighlightData?.view, variant.sku]\n  )\n\n  if (!Reflect.ownKeys(productHighlightData).length) return null\n\n  return (\n    <div className=\"ipc-product-detail-highlight\">\n      <div className=\"flex items-center justify-between\">\n        {productHighlightData?.title && (\n          <Text\n            className=\"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]\"\n            html={productHighlightData?.title}\n          />\n        )}\n        <Dialog open={open} onOpenChange={setOpen}>\n          <DialogTrigger asChild>\n            <Button\n              variant=\"link\"\n              className=\"!p-0 text-[14px] lg-desktop:text-[16px] font-bold\"\n              onClick={() => gaTrackEvent()}\n            >\n              {productHighlightData?.view}\n            </Button>\n          </DialogTrigger>\n          <ProductHighlightModal\n            ksp={productHighlightData?.ksp || []}\n            activeKspItem={activeKspItem}\n            setActiveKspItem={setActiveKspItem}\n            gaTrackEvent={gaTrackEvent}\n          />\n        </Dialog>\n      </div>\n      <ul className=\"lg-desktop:mt-4 mt-3 flex list-disc flex-col gap-1 pl-5\">\n        {productHighlightData?.ksp?.map((item: any) => (\n          <li key={item?.title} className=\"product-highlight-item cursor-pointer\">\n            <Text\n              size={3}\n              onClick={() => {\n                setActiveKspItem(item)\n                setOpen(true)\n                gaTrackEvent(item?.title)\n              }}\n              className=\"laptop:text-[16px] lg-desktop:text-[18px] line-clamp-1 overflow-hidden break-all text-[14px] font-bold text-[#080A0F]\"\n              html={item?.title}\n            />\n          </li>\n        ))}\n      </ul>\n    </div>\n  )\n}\n\nconst ProductHighlightModal = ({\n  ksp,\n  activeKspItem,\n  setActiveKspItem,\n  gaTrackEvent,\n}: {\n  ksp: any[]\n  activeKspItem: any\n  setActiveKspItem: (_activeKspItem: any) => void\n  gaTrackEvent: (_buttonName: string) => void\n}) => {\n  const highlightRef = useRef<HTMLButtonElement[]>([])\n  const scrollContainerRef = useRef<HTMLDivElement>(null)\n\n  const autoScrollToActiveItem = useCallback(\n    (activeKspItem: any) => {\n      const curIndex = ksp.findIndex(item => item.title === activeKspItem?.title)\n      const curRef = highlightRef.current[curIndex]\n\n      if (curRef && scrollContainerRef.current) {\n        const container = scrollContainerRef.current\n        const button = curRef\n        const scrollLeft = button.offsetLeft - container.offsetWidth / 2 + button.offsetWidth / 2\n\n        container.scrollTo({\n          left: scrollLeft,\n          behavior: 'smooth',\n        })\n      }\n    },\n    [ksp]\n  )\n\n  useEffect(() => {\n    if (!activeKspItem) return\n    // setActiveKspItem(clickActiveKspItem)\n\n    // \u5EF6\u8FDF\u6267\u884C\uFF0C\u7B49\u5F85 Dialog \u548C\u5185\u90E8\u5143\u7D20\u5B8C\u5168\u6E32\u67D3\n    setTimeout(() => {\n      autoScrollToActiveItem(activeKspItem)\n    }, 100)\n  }, [autoScrollToActiveItem, activeKspItem])\n\n  return (\n    <DialogContent className=\"tablet:max-w-[90vw] tablet:w-[896px] [&_.dialog-close-icon]:laptop:size-6 !rounded-box mx-auto w-full max-w-[326px] overflow-hidden border-none bg-transparent p-0 [&_.dialog-close-icon]:size-4\">\n      <style>{`\n        .dialog-close-icon {\n          color: ${activeKspItem?.closeColor || '#1D1D1F'};\n        }\n      `}</style>\n      <Root value={activeKspItem?.title} className=\"w-full overflow-hidden\">\n        {ksp?.map(item => (\n          <Content value={item.title} key={item.title}>\n            <Picture\n              source={`${item?.img}, ${item?.mobileImg} 767`}\n              className=\"laptop-md:h-[480px] h-[304px] w-full\"\n              alt={item.img.alt}\n              imgClassName=\"object-cover h-full\"\n            />\n          </Content>\n        ))}\n        <div className=\"laptop-md:py-6 w-full overflow-visible bg-white py-4\">\n          <div\n            ref={scrollContainerRef}\n            style={{\n              scrollbarWidth: 'none',\n              msOverflowStyle: 'none',\n            }}\n            className=\"laptop-md:px-6 overflow-x-auto px-4\"\n          >\n            <div className=\"rounded-btn w-fit bg-[#EAEAEC]\">\n              <List className=\"flex w-max p-1\">\n                {ksp?.map((item, index) => (\n                  <Trigger\n                    ref={el => {\n                      if (el) {\n                        highlightRef.current[index] = el\n                      }\n                    }}\n                    className={cn(\n                      'lg-desktop:px-7 rounded-btn h-[38px] shrink-0 px-5 leading-[38px]',\n                      item.title === activeKspItem?.title && 'bg-white'\n                    )}\n                    onClick={() => {\n                      autoScrollToActiveItem(item)\n                      setActiveKspItem(item)\n                      gaTrackEvent(item?.title)\n                    }}\n                    key={index + item.title}\n                    value={item.title}\n                  >\n                    <Text html={item.title} className=\"text-[14px] font-bold leading-[1.2]\" />\n                  </Trigger>\n                ))}\n              </List>\n            </div>\n          </div>\n          <div className=\"laptop-md:px-6 mt-4 px-4\">\n            {ksp?.map((item, index) => (\n              <Content\n                value={item.title}\n                key={index + item.title}\n                className=\"laptop-md:text-[18px] text-[14px] font-bold\"\n              >\n                {item.description}\n              </Content>\n            ))}\n          </div>\n        </div>\n      </Root>\n    </DialogContent>\n  )\n}\n\nexport default withLayout(ProductHighlight)\n"],
+  "mappings": "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",
   "names": ["jsx", "jsxs", "Text", "Picture", "Button", "Dialog", "DialogContent", "DialogTrigger", "Content", "List", "Root", "Trigger", "useCallback", "useEffect", "useMemo", "useRef", "useState", "cn", "useBizProductContext", "withLayout", "gaTrack", "ProductHighlight", "product", "variant", "open", "setOpen", "productHighlightData", "item", "activeKspItem", "setActiveKspItem", "gaTrackEvent", "buttonName", "ProductHighlightModal", "ksp", "highlightRef", "scrollContainerRef", "autoScrollToActiveItem", "curIndex", "curRef", "container", "button", "scrollLeft", "index", "el", "ProductHighlight_default"]
 }

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductOptions/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Fragment as P,jsx as o,jsxs as d}from"react/jsx-runtime";import{Text as m,Picture as N}from"../../../../../../components/index.js";import{cn as l}from"../../../../../../helpers/index.js";import{useState as h,useMemo as b}from"react";import{useBizProductContext as w}from"../../../../BizProductProvider.js";import{useAiuiContext as k}from"../../../../../AiuiProvider/index.js";import{handle as _}from"../../../../utils/helper.js";import{withLayout as C}from"../../../../../../shared/Styles.js";const E=()=>{const{product:r,selectedOptions:n,setSelectedOptions:c,setJoinedRecommendBuyProducts:u}=w(),{storeDomain:p}=k(),[f,v]=h({}),g=b(()=>r?.payload?.components?.find(e=>e.componentKey==="ProductOptions")?.data||{},[r?.payload]);return r.options.length?o("div",{className:"flex flex-col gap-12",children:r.options.map(e=>{const y=e.name.toLowerCase();if(["color","colour","couleur"].some(t=>y.includes(t)))return d("div",{className:"ipc-product-detail-options",children:[o(m,{as:"p",size:3,className:"font-bold leading-[1.2]",html:g?.selectColor+n[e.name]}),o("div",{className:"lg-desktop:mt-5 ml-1 mt-4 flex items-center gap-4",children:e.values.map(({label:t},s)=>{const a=`https://${p}/cdn/shop/files/${_(t)}.png`;return d("div",{className:"ipc-product-detail-options-value relative",children:[o("button",{"aria-label":`switch to ${t}`,title:t,onClick:()=>{c(i=>({...i,[e.name]:t})),u?.({gift:void 0,bundle:void 0})},className:l("flex size-[30px] items-center justify-center rounded-full bg-center bg-no-repeat outline outline-2 outline-offset-4 outline-white",{"outline-brand":n[e.name]===t}),children:!f[t]&&o(P,{children:o(N,{className:"w-full",source:a,onError:({currentTarget:i})=>{i.onerror=null,v(x=>({...x,[t]:!0}))}})})}),o("div",{className:"pointer-events-none absolute inset-0 rounded-full shadow-[inset_0_0_4px_rgba(0,0,0,0.08),inset_0_2px_2px_rgba(0,0,0,0.12)]"})]},t+s)})})]},e.id);{const t=e.name.charAt(0).toUpperCase()+e.name.slice(1);return d("div",{className:"ipc-product-detail-options",children:[o(m,{as:"p",size:3,className:"font-bold",html:t}),o("div",{className:"mt-4 flex items-center gap-4",children:e.values.map(({label:s})=>o("button",{onClick:()=>{c(a=>({...a,[e.name]:s}))},className:l("rounded-box w-1/2 border-2 border-[#E4E5E6] px-4 py-6 text-left font-bold",{"border-brand":n[e.name]===s}),children:s},s))})]},e.id)}})}):null};var S=C(E);export{S as default};
+import{Fragment as P,jsx as o,jsxs as i}from"react/jsx-runtime";import{Text as c,Picture as N}from"../../../../../../components/index.js";import{cn as m}from"../../../../../../helpers/index.js";import{useState as h,useMemo as k}from"react";import{useBizProductContext as b}from"../../../../BizProductProvider.js";import{useAiuiContext as w}from"../../../../../AiuiProvider/index.js";import{handle as _}from"../../../../utils/helper.js";import{withLayout as C}from"../../../../../../shared/Styles.js";const E=()=>{const{product:r,selectedOptions:n,setSelectedOptions:l,setJoinedRecommendBuyProducts:p}=b(),{storeDomain:u}=w(),[f,x]=h({}),g=k(()=>r?.payload?.components?.find(e=>e.componentKey==="ProductOptions")?.data||{},[r?.payload]);return r.options.length?o("div",{className:"flex flex-col gap-12",children:r.options.map(e=>{const v=e.name.toLowerCase();if(["color","colour","couleur"].some(t=>v.includes(t)))return i("div",{className:"ipc-product-detail-options",children:[o(c,{as:"p",className:"font-bold leading-[1.2] text-[14px] lg-desktop:text-[16px]",html:g?.selectColor+n[e.name]}),o("div",{className:"lg-desktop:mt-5 ml-1 lg-desktop:mt-4 mt-3 flex items-center gap-4",children:e.values.map(({label:t},s)=>{const a=`https://${u}/cdn/shop/files/${_(t)}.png`;return i("div",{className:"ipc-product-detail-options-value relative",children:[o("button",{"aria-label":`switch to ${t}`,title:t,onClick:()=>{l(d=>({...d,[e.name]:t})),p?.({gift:void 0,bundle:void 0})},className:m("flex size-[30px] items-center justify-center rounded-full bg-center bg-no-repeat outline outline-2 outline-offset-4 outline-white",{"outline-brand":n[e.name]===t}),children:!f[t]&&o(P,{children:o(N,{className:"w-full",source:a,onError:({currentTarget:d})=>{d.onerror=null,x(y=>({...y,[t]:!0}))}})})}),o("div",{className:"pointer-events-none absolute inset-0 rounded-full shadow-[inset_0_0_4px_rgba(0,0,0,0.08),inset_0_2px_2px_rgba(0,0,0,0.12)]"})]},t+s)})})]},e.id);{const t=e.name.charAt(0).toUpperCase()+e.name.slice(1);return i("div",{className:"ipc-product-detail-options",children:[o(c,{as:"p",size:3,className:"font-bold text-[14px] leading-[1.2] lg-desktop:text-[16px]",html:t}),o("div",{className:"lg-desktop:mt-4 mt-3 flex items-center gap-4",children:e.values.map(({label:s})=>o("button",{onClick:()=>{l(a=>({...a,[e.name]:s}))},className:m("rounded-box w-1/2 border-2 text-[14px] laptop:text-[16px] border-[#E4E5E6] px-4 py-6 text-left font-bold",{"border-brand":n[e.name]===s}),children:s},s))})]},e.id)}})}):null};var S=C(E);export{S as default};
 //# sourceMappingURL=index.js.map