npm - @anker-in/campaign-ui - Versions diffs - 0.2.11-beta.3 → 0.2.11-beta.4 - Mend

@anker-in/campaign-ui 0.2.11-beta.3 → 0.2.11-beta.4

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 (193) hide show

package/dist/esm/components/credits/creditsMemberPrice/MemberPriceItem.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsMemberPrice/MemberPriceItem.tsx"],
-  "sourcesContent": ["import { Button, Text, Picture } from '@anker-in/headless-ui'\nimport { useMemo } from 'react'\n\nimport { CreditsMemberPriceCopy, MemberPriceProduct } from './type'\nimport { formatPrice, extractVariantId } from '../context/utils'\nimport { classNames as cn, useHeadlessContext, useBuyNow } from '@anker-in/lib'\nimport { useCreditsContext } from '../context/provider'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nfunction MemberPriceItem({\n  itemData,\n  copy,\n  className,\n}: {\n  itemData: MemberPriceProduct\n  copy: CreditsMemberPriceCopy['memberPriceTab']\n  className?: string\n}) {\n  const { brand, locale } = useHeadlessContext()\n  const { profile, openSignUpPopup } = useCreditsContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n\n  // \u4F7F\u7528 buyNow hook \u6765\u5904\u7406\u7ED3\u7B97\n  const { trigger: buyNow, isMutating: isBuying } = useBuyNow({}, { throwOnError: true })\n\n  const isAvailable = useMemo(() => {\n    return itemData.productVariant?.availableForSale\n  }, [itemData.productVariant?.availableForSale])\n\n  const isLogin = useMemo(() => {\n    return !!profile\n  }, [profile])\n\n  // Learn More \u6309\u94AE\u70B9\u51FB - \u8DF3\u8F6C\u5230\u4EA7\u54C1\u8BE6\u60C5\u9875\n  const handleLearnMore = () => {\n    const variantId = extractVariantId(itemData.productVariant?.id)\n    const url = variantId\n      ? `/products/${itemData.product.handle}?variant=${variantId}`\n      : `/products/${itemData.product.handle}`\n    window.location.href = url\n  }\n\n  // Shop Now \u6309\u94AE\u70B9\u51FB - \u68C0\u67E5\u767B\u5F55\u72B6\u6001\u540E\u4F7F\u7528 buyNow \u8FDB\u884C\u7ED3\u7B97\n  const handleShopNow = () => {\n    // \u5982\u679C\u672A\u767B\u5F55\uFF0C\u5F39\u51FA\u767B\u5F55\u5F39\u7A97\n    if (!isLogin) {\n      openSignUpPopup()\n      return\n    }\n\n    // \u5DF2\u767B\u5F55\uFF0C\u6267\u884C\u8D2D\u4E70\n    buyNow({\n      customAttributes: [\n        {\n          key: '_member_type',\n          value: String(profile?.memberType || 0),\n        },\n      ],\n      lineItems: [\n        {\n          variant: itemData.productVariant,\n          quantity: 1,\n        },\n      ],\n    })\n  }\n\n  return (\n    <div\n      className={cn(\n        'relative flex flex-col items-center bg-[#EAEAEC] p-[24px] l:p-[8px] rounded-[16px] md-xl:p-[16px] md:rounded-[12px]',\n        !rounded && 'rounded-none md:rounded-none',\n        className\n      )}\n    >\n      {/* Member \u6807\u7B7E\u56FE\u7247 */}\n      {copy.memberPriceImg && (\n        <Picture\n          className=\"absolute left-[24px] top-[16px] h-[24px] w-auto\"\n          imgClassName=\"!h-full object-contain\"\n          source={copy.memberPriceImg.url}\n          alt={copy.memberPriceImg.alt || 'Member Price'}\n        />\n      )}\n\n      {/* \u4EA7\u54C1\u56FE\u7247 - \u4F18\u5148\u4F7F\u7528\u4EA7\u54C1\u7684 metafields \u900F\u660E\u56FE */}\n      <a\n        href={\n          extractVariantId(itemData.productVariant?.id)\n            ? `/products/${itemData.product.handle}?variant=${extractVariantId(itemData.productVariant?.id)}`\n            : `/products/${itemData.product.handle}`\n        }\n        className={cn('relative mx-auto size-[138px]')}\n      >\n        <Picture\n          className=\"mx-auto size-full\"\n          imgClassName=\"object-contain\"\n          source={\n            itemData?.productVariant?.metafields?.global?.transparentImg ||\n            itemData?.config?.image?.url ||\n            itemData?.productVariant?.image?.url\n          }\n        ></Picture>\n      </a>\n\n      {/* \u4EA7\u54C1\u4FE1\u606F */}\n      <div className={cn('mt-[10px] xl:mt-[8px] w-full')}>\n        {/* \u4EA7\u54C1\u6807\u9898 - \u4F7F\u7528\u4EA7\u54C1\u7684\u771F\u5B9E\u6807\u9898 */}\n        <Text\n          html={itemData?.product?.title}\n          title={itemData?.product?.title}\n          className=\"line-clamp-2 text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n        />\n\n        {/* \u4EF7\u683C\u4FE1\u606F */}\n        <div className=\"mt-[16px] flex flex-col gap-[8px]\">\n          {/* Member Price \u6807\u7B7E - \u4F7F\u7528 text-brand-color-1 */}\n          <Text\n            html={copy.memberPriceLabel}\n            className={cn(\n              'text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]',\n              brand === 'ankersolix' &&\n                'leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent'\n            )}\n            as=\"p\"\n          />\n\n          {/* \u4F1A\u5458\u4EF7\u548C\u539F\u4EF7\u5728\u540C\u4E00\u884C */}\n          <div className=\"flex items-center gap-[4px]\">\n            <Text\n              html={formatPrice({\n                amount: itemData.memberPrice,\n                currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n                locale: locale,\n              })}\n              className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n              as=\"span\"\n            />\n            <Text\n              html={formatPrice({\n                amount: itemData.originalPrice,\n                currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n                locale: locale,\n              })}\n              className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through\"\n              as=\"span\"\n            />\n          </div>\n\n          {/* \u6309\u94AE\u7EC4 */}\n          <div className=\"flex w-full gap-[8px] l:flex-col\">\n            {/* Learn More \u6309\u94AE */}\n            <Button\n              variant=\"secondary\"\n              className=\"flex-1 md:w-full\"\n              size=\"lg\"\n              onClick={handleLearnMore}\n              disabled={!isAvailable}\n            >\n              {copy.learnMoreText}\n            </Button>\n\n            {/* Shop Now \u6309\u94AE */}\n            <Button\n              variant=\"primary\"\n              className=\"flex-1 md:w-full\"\n              size=\"lg\"\n              onClick={handleShopNow}\n              disabled={!isAvailable || isBuying}\n              loading={isBuying}\n            >\n              {copy.shopNowText}\n            </Button>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default MemberPriceItem\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "Button", "Text", "Picture", "useMemo", "formatPrice", "extractVariantId", "cn", "useHeadlessContext", "useBuyNow", "useCreditsContext", "ROUNDED_BRANDS", "MemberPriceItem", "itemData", "copy", "className", "brand", "locale", "profile", "openSignUpPopup", "rounded", "buyNow", "isBuying", "isAvailable", "isLogin", "handleLearnMore", "variantId", "url", "handleShopNow", "MemberPriceItem_default"]
+  "sourcesContent": ["import { Button, Text, Picture, Badge } from '@anker-in/headless-ui'\nimport { useMemo, useState } from 'react'\n\nimport { CreditsMemberPriceCopy, MemberPriceProduct } from './type'\nimport { formatPrice, extractVariantId } from '../context/utils'\nimport { classNames as cn, useHeadlessContext, useBuyNow } from '@anker-in/lib'\nimport { useCreditsContext } from '../context/provider'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nfunction MemberPriceItem({\n  itemData,\n  copy,\n  className,\n}: {\n  itemData: MemberPriceProduct\n  copy: CreditsMemberPriceCopy['memberPriceTab']\n  className?: string\n}) {\n  const { brand, locale } = useHeadlessContext()\n  const { profile, openSignUpPopup, cartConfig } = useCreditsContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n\n  // \u4F7F\u7528 buyNow hook \u6765\u5904\u7406\u7ED3\u7B97\n  const { trigger: buyNow, isMutating: isBuying } = useBuyNow({}, { throwOnError: true })\n\n  // \u672C\u5730 loading \u72B6\u6001\uFF0C\u907F\u514D\u5168\u5C40 loading \u5F71\u54CD\u6240\u6709\u5361\u7247\n  const [isAddingToCart, setIsAddingToCart] = useState(false)\n\n  const isAvailable = useMemo(() => {\n    return itemData.productVariant?.availableForSale\n  }, [itemData.productVariant?.availableForSale])\n\n  const isLogin = useMemo(() => {\n    return !!profile\n  }, [profile])\n\n  // \u4ECE variant metafields \u4E2D\u83B7\u53D6 coupon code\n  const getCouponCode = useMemo(() => {\n    try {\n      const discountData = itemData.productVariant?.metafields?.__discountCodeApp?.data\n      if (!discountData) return undefined\n\n      // discountData \u5DF2\u7ECF\u662F\u5BF9\u8C61\uFF0C\u4E0D\u9700\u8981 JSON.parse\n      const discounts = discountData\n      if (!Array.isArray(discounts) || discounts.length === 0) return undefined\n\n      // \u83B7\u53D6\u7B2C\u4E00\u4E2A\u6709\u6548\u7684 coupon\uFF08\u68C0\u67E5\u65F6\u95F4\u8303\u56F4\uFF09\n      const now = new Date()\n      const validDiscount = discounts.find((discount: any) => {\n        const startsAt = discount.starts_at ? new Date(discount.starts_at) : null\n        const endsAt = discount.ends_at ? new Date(discount.ends_at) : null\n\n        // \u68C0\u67E5 coupon \u662F\u5426\u5728\u6709\u6548\u671F\u5185\n        if (startsAt && startsAt > now) return false\n        if (endsAt && endsAt < now) return false\n\n        return true\n      })\n\n      return validDiscount?.title\n    } catch (error) {\n      console.error('Failed to get discount code:', error)\n      return undefined\n    }\n  }, [itemData.productVariant?.metafields])\n\n  // Add to Cart \u6309\u94AE\u70B9\u51FB - \u8C03\u7528\u52A0\u8D2D\u65B9\u6CD5\n  const handleAddToCart = async () => {\n    if (!cartConfig?.addToCart) {\n      console.warn('cartConfig.addToCart is required')\n      return\n    }\n\n    try {\n      setIsAddingToCart(true)\n\n      // \u6784\u5EFA lineItem attributes\n      const lineItemAttributes: Array<{ key: string; value: string }> = []\n      if (getCouponCode) {\n        lineItemAttributes.push({\n          key: '_member_price',\n          value: JSON.stringify({ code: getCouponCode }),\n        })\n      }\n\n      await cartConfig.addToCart({\n        variantList: [\n          {\n            variant: itemData.productVariant,\n            quantity: 1,\n            attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n          },\n        ],\n        cartAttributes: {\n          _member_type: String(profile?.memberType || 0),\n        },\n        discountCodes: getCouponCode ? [getCouponCode] : undefined,\n      })\n    } catch (error) {\n      console.error('Add to cart failed:', error)\n    } finally {\n      setIsAddingToCart(false)\n    }\n  }\n\n  // Shop Now \u6309\u94AE\u70B9\u51FB - \u68C0\u67E5\u767B\u5F55\u72B6\u6001\u540E\u4F7F\u7528 buyNow \u8FDB\u884C\u7ED3\u7B97\n  const handleShopNow = () => {\n    // \u5982\u679C\u672A\u767B\u5F55\uFF0C\u5F39\u51FA\u767B\u5F55\u5F39\u7A97\n    if (!isLogin) {\n      openSignUpPopup()\n      return\n    }\n\n    // \u6784\u5EFA lineItem attributes\n    const lineItemAttributes: Array<{ key: string; value: string }> = []\n    if (getCouponCode) {\n      lineItemAttributes.push({\n        key: '_member_price',\n        value: JSON.stringify({ code: getCouponCode }),\n      })\n    }\n\n    // \u5DF2\u767B\u5F55\uFF0C\u6267\u884C\u8D2D\u4E70\n    buyNow({\n      customAttributes: [\n        {\n          key: '_member_type',\n          value: String(profile?.memberType || 0),\n        },\n      ],\n      lineItems: [\n        {\n          variant: itemData.productVariant,\n          quantity: 1,\n          attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n        },\n      ],\n    })\n  }\n\n  return (\n    <div\n      className={cn(\n        'relative flex flex-col items-center bg-[#EAEAEC] p-[24px] l:p-[8px] rounded-[16px] md-xl:p-[16px] md:rounded-[12px]',\n        !rounded && 'rounded-none md:rounded-none',\n        copy.badgeLabel && 'pt-[48px] l:pt-[44px]',\n        className\n      )}\n    >\n      {/* Member \u6807\u7B7E Badge */}\n      {copy.badgeLabel && (\n        <Badge\n          className=\"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10\"\n          size=\"lg\"\n          variant=\"promotional\"\n          promotionalType=\"regular-member\"\n        >\n          {copy.badgeLabel}\n        </Badge>\n      )}\n\n      {/* \u4EA7\u54C1\u56FE\u7247 - \u4F18\u5148\u4F7F\u7528\u4EA7\u54C1\u7684 metafields \u900F\u660E\u56FE */}\n      <a\n        href={\n          extractVariantId(itemData.productVariant?.id)\n            ? `/products/${itemData.product.handle}?variant=${extractVariantId(itemData.productVariant?.id)}`\n            : `/products/${itemData.product.handle}`\n        }\n        className={cn('relative mx-auto size-[138px]')}\n      >\n        <Picture\n          className=\"mx-auto size-full\"\n          imgClassName=\"object-contain\"\n          source={\n            itemData?.productVariant?.metafields?.global?.transparentImg ||\n            itemData?.config?.image?.url ||\n            itemData?.productVariant?.image?.url\n          }\n        ></Picture>\n      </a>\n\n      {/* \u4EA7\u54C1\u4FE1\u606F */}\n      <div className={cn('mt-[10px] xl:mt-[8px] w-full')}>\n        {/* \u4EA7\u54C1\u6807\u9898 - \u4F7F\u7528\u4EA7\u54C1\u7684\u771F\u5B9E\u6807\u9898 */}\n        <Text\n          html={itemData?.product?.title}\n          title={itemData?.product?.title}\n          className=\"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n        />\n\n        {/* \u4EF7\u683C\u4FE1\u606F */}\n        <div className=\"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0\">\n          {/* Member Price \u6807\u7B7E - \u4F7F\u7528 text-brand-color-1 */}\n          <Text\n            html={copy.memberPriceLabel}\n            className={cn(\n              'text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]',\n              brand === 'ankersolix' &&\n                'leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent'\n            )}\n            as=\"p\"\n          />\n\n          {/* \u4F1A\u5458\u4EF7\u548C\u539F\u4EF7\u5728\u540C\u4E00\u884C */}\n          <div className=\"flex items-center gap-[4px]\">\n            <Text\n              html={formatPrice({\n                amount: itemData.memberPrice,\n                currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n                locale: locale,\n              })}\n              className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n              as=\"span\"\n            />\n            <Text\n              html={formatPrice({\n                amount: itemData.originalPrice,\n                currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n                locale: locale,\n              })}\n              className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through\"\n              as=\"span\"\n            />\n          </div>\n\n          {/* \u6309\u94AE\u7EC4 */}\n          <div className=\"flex w-full mt-[8px] gap-[8px] l:flex-col\">\n            {/* Add to Cart \u6309\u94AE */}\n            <Button\n              variant=\"secondary\"\n              className=\"flex-1 md:w-full\"\n              size=\"lg\"\n              onClick={handleAddToCart}\n              disabled={!isAvailable || !cartConfig?.addToCart || isAddingToCart}\n              loading={isAddingToCart}\n            >\n              {copy.addToCart}\n            </Button>\n\n            {/* Shop Now \u6309\u94AE */}\n            <Button\n              variant=\"primary\"\n              className=\"flex-1 md:w-full\"\n              size=\"lg\"\n              onClick={handleShopNow}\n              disabled={!isAvailable || isBuying}\n              loading={isBuying}\n            >\n              {copy.shopNowText}\n            </Button>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default MemberPriceItem\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "Button", "Text", "Picture", "Badge", "useMemo", "useState", "formatPrice", "extractVariantId", "cn", "useHeadlessContext", "useBuyNow", "useCreditsContext", "ROUNDED_BRANDS", "MemberPriceItem", "itemData", "copy", "className", "brand", "locale", "profile", "openSignUpPopup", "cartConfig", "rounded", "buyNow", "isBuying", "isAddingToCart", "setIsAddingToCart", "isAvailable", "isLogin", "getCouponCode", "discountData", "discounts", "now", "discount", "startsAt", "endsAt", "error", "handleAddToCart", "lineItemAttributes", "handleShopNow", "MemberPriceItem_default"]
 }

package/dist/esm/components/credits/creditsMemberPrice/type.d.ts CHANGED Viewed

@@ -33,13 +33,10 @@ export type CreditsMemberPriceCopy = {
     tabs: TabConfig[];
     memberPriceTab: {
         memberPriceRuleId: string;
-        learnMoreText: string;
+        addToCart: string;
         shopNowText: string;
         memberPriceLabel: string;
-        memberPriceImg?: {
-            url: string;
-            alt?: string;
-        };
+        badgeLabel?: string;
     };
     redeemTab: {
         list: (RedeemableItemConfig & {
@@ -52,6 +49,7 @@ export type CreditsMemberPriceCopy = {
         unlockRewards: string;
         btnRedeem: string;
         off: string;
+        badgeLabel?: string;
     };
 };
 export type MemberPriceProduct = {

package/dist/esm/components/credits/creditsNavigation/CreditsNavigation.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as a}from"react/jsx-runtime";import{useEffect as x,useState as h,useRef as w,useCallback as C}from"react";import{classNames as c}from"@anker-in/lib";import{Container as I}from"@anker-in/headless-ui";const R=({copy:d})=>{const[m,b]=h(""),t=w(null),f=e=>{const o=document.getElementById(e);if(o){const s=o.getBoundingClientRect().top+window.pageYOffset-56;window.scrollTo({top:s,behavior:"smooth"})}},p=C(()=>{t.current&&t.current.disconnect();const e=new Map,o=r=>{r.forEach(n=>{const l=n.target.id;if(!l)return;const v=n.intersectionRect.height,u=n.intersectionRect.width,g=v*u;e.set(l,n.isIntersecting?g:0)});let i=0,s="";e.forEach((n,l)=>{n>i&&(i=n,s=l)}),s&&s!==m&&b(s)};t.current=new IntersectionObserver(o,{threshold:[0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1],rootMargin:"-56px 0px 0px 0px"}),d.items.forEach(r=>{const i=document.getElementById(r.targetId);i&&t.current&&t.current.observe(i)})},[d.items,m]);return x(()=>(p(),()=>{t.current&&t.current.disconnect()}),[p]),a("nav",{className:c("sticky top-0 z-50 bg-white"),children:a(I,{asChild:!0,children:a("div",{className:c("md:overflow-x-auto md:overflow-y-hidden md:-mx-[16px] md:px-[16px]","md:scrollbar-hide md:[&::-webkit-scrollbar]:hidden md:[-ms-overflow-style:none] md:[scrollbar-width:none]"),children:a("ul",{className:c("flex items-end gap-[24px] pt-[16px] md:gap-[16px] md:pr-[16px]"),children:d.items.map((e,o)=>{const r=m===e.targetId;return a("li",{className:c("md:flex-shrink-0"),children:a("button",{onClick:()=>f(e.targetId),className:c("pb-[16px] text-[14px] font-bold tracking-[-0.28px] leading-[1.4]","transition-all duration-200 relative border-b-4 whitespace-nowrap",r?"text-[#080a0f] border-brand-1":"text-[#4a4c56] hover:text-[#080a0f] border-transparent"),children:e.label})},o)})})})})})};export{R as CreditsNavigation};
+import{jsx as a}from"react/jsx-runtime";import{useEffect as x,useState as h,useRef as w,useCallback as C}from"react";import{classNames as c}from"@anker-in/lib";import{Container as I}from"@anker-in/headless-ui";const R=({copy:d})=>{const[m,b]=h(""),t=w(null),f=e=>{const i=document.getElementById(e);if(i){const s=i.getBoundingClientRect().top+window.pageYOffset-56;window.scrollTo({top:s,behavior:"smooth"})}},p=C(()=>{t.current&&t.current.disconnect();const e=new Map,i=o=>{o.forEach(n=>{const l=n.target.id;if(!l)return;const v=n.intersectionRect.height,g=n.intersectionRect.width,u=v*g;e.set(l,n.isIntersecting?u:0)});let r=0,s="";e.forEach((n,l)=>{n>r&&(r=n,s=l)}),s&&s!==m&&b(s)};t.current=new IntersectionObserver(i,{threshold:[0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1],rootMargin:"-56px 0px 0px 0px"}),d.items.forEach(o=>{const r=document.getElementById(o.targetId);r&&t.current&&t.current.observe(r)})},[d.items,m]);return x(()=>(p(),()=>{t.current&&t.current.disconnect()}),[p]),a("nav",{id:"creditsNavigation",className:c("sticky top-0 z-50 bg-white"),children:a(I,{asChild:!0,children:a("div",{className:c("md:overflow-x-auto md:overflow-y-hidden md:-mx-[16px] md:px-[16px]","md:scrollbar-hide md:[&::-webkit-scrollbar]:hidden md:[-ms-overflow-style:none] md:[scrollbar-width:none]"),children:a("ul",{className:c("flex items-end gap-[24px] pt-[16px] md:pt-[12px] md:gap-[16px] md:pr-[16px]"),children:d.items.map((e,i)=>{const o=m===e.targetId;return a("li",{className:c("md:flex-shrink-0"),children:a("button",{onClick:()=>f(e.targetId),className:c("pb-[16px] md:pb-[12px] text-[14px] font-bold tracking-[-0.28px] leading-[1.4]","transition-all duration-200 relative border-b-4 whitespace-nowrap",o?"text-[#080a0f] border-brand-1":"text-[#4a4c56] hover:text-[#080a0f] border-transparent"),children:e.label})},i)})})})})})};export{R as CreditsNavigation};
 //# sourceMappingURL=CreditsNavigation.js.map

package/dist/esm/components/credits/creditsNavigation/CreditsNavigation.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsNavigation/CreditsNavigation.tsx"],
-  "sourcesContent": ["import { useEffect, useState, useRef, useCallback } from 'react'\nimport { classNames as cn } from '@anker-in/lib'\nimport { Container } from '@anker-in/headless-ui'\nimport { CreditsNavigationCopy } from './type'\n\nexport const CreditsNavigation = ({ copy }: { copy: CreditsNavigationCopy }) => {\n  const [activeId, setActiveId] = useState<string>('')\n  const observerRef = useRef<IntersectionObserver | null>(null)\n\n  // \u5E73\u6ED1\u6EDA\u52A8\u5230\u76EE\u6807\u6A21\u5757\n  const scrollToSection = (targetId: string) => {\n    const element = document.getElementById(targetId)\n    if (element) {\n      const navHeight = 56 // \u5BFC\u822A\u680F\u9AD8\u5EA6\n      const elementPosition = element.getBoundingClientRect().top + window.pageYOffset\n      const offsetPosition = elementPosition - navHeight\n\n      window.scrollTo({\n        top: offsetPosition,\n        behavior: 'smooth',\n      })\n    }\n  }\n\n  // \u4F7F\u7528 Intersection Observer \u76D1\u542C\u6A21\u5757\u53EF\u89C1\u6027\n  const setupObserver = useCallback(() => {\n    // \u6E05\u7406\u4E4B\u524D\u7684 observer\n    if (observerRef.current) {\n      observerRef.current.disconnect()\n    }\n\n    // \u8BA1\u7B97\u6BCF\u4E2A\u5143\u7D20\u5728\u89C6\u53E3\u4E2D\u7684\u53EF\u89C1\u9762\u79EF\n    const visibilityMap = new Map<string, number>()\n\n    const observerCallback = (entries: IntersectionObserverEntry[]) => {\n      entries.forEach(entry => {\n        const id = entry.target.id\n        if (!id) return\n\n        // \u8BA1\u7B97\u53EF\u89C1\u9762\u79EF\n        const visibleHeight = entry.intersectionRect.height\n        const visibleWidth = entry.intersectionRect.width\n        const visibleArea = visibleHeight * visibleWidth\n\n        visibilityMap.set(id, entry.isIntersecting ? visibleArea : 0)\n      })\n\n      // \u627E\u51FA\u53EF\u89C1\u9762\u79EF\u6700\u5927\u7684\u5143\u7D20\n      let maxArea = 0\n      let maxId = ''\n\n      visibilityMap.forEach((area, id) => {\n        if (area > maxArea) {\n          maxArea = area\n          maxId = id\n        }\n      })\n\n      if (maxId && maxId !== activeId) {\n        setActiveId(maxId)\n      }\n    }\n\n    // \u521B\u5EFA\u65B0\u7684 observer\n    observerRef.current = new IntersectionObserver(observerCallback, {\n      threshold: [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1],\n      rootMargin: '-56px 0px 0px 0px', // \u8003\u8651\u5BFC\u822A\u680F\u9AD8\u5EA6\n    })\n\n    // \u89C2\u5BDF\u6240\u6709\u76EE\u6807\u5143\u7D20\n    copy.items.forEach(item => {\n      const element = document.getElementById(item.targetId)\n      if (element && observerRef.current) {\n        observerRef.current.observe(element)\n      }\n    })\n  }, [copy.items, activeId])\n\n  useEffect(() => {\n    setupObserver()\n\n    return () => {\n      if (observerRef.current) {\n        observerRef.current.disconnect()\n      }\n    }\n  }, [setupObserver])\n\n  return (\n    <nav className={cn('sticky top-0 z-50 bg-white')}>\n      <Container asChild>\n        <div\n          className={cn(\n            'md:overflow-x-auto md:overflow-y-hidden md:-mx-[16px] md:px-[16px]',\n            'md:scrollbar-hide md:[&::-webkit-scrollbar]:hidden md:[-ms-overflow-style:none] md:[scrollbar-width:none]'\n          )}\n        >\n          <ul className={cn('flex items-end gap-[24px] pt-[16px] md:gap-[16px] md:pr-[16px]')}>\n            {copy.items.map((item, index) => {\n              const isActive = activeId === item.targetId\n              return (\n                <li key={index} className={cn('md:flex-shrink-0')}>\n                  <button\n                    onClick={() => scrollToSection(item.targetId)}\n                    className={cn(\n                      'pb-[16px] text-[14px] font-bold tracking-[-0.28px] leading-[1.4]',\n                      'transition-all duration-200 relative border-b-4 whitespace-nowrap',\n                      isActive\n                        ? 'text-[#080a0f] border-brand-1'\n                        : 'text-[#4a4c56] hover:text-[#080a0f] border-transparent'\n                    )}\n                  >\n                    {item.label}\n                  </button>\n                </li>\n              )\n            })}\n          </ul>\n        </div>\n      </Container>\n    </nav>\n  )\n}\n"],
-  "mappings": "AAsGkB,cAAAA,MAAA,oBAtGlB,OAAS,aAAAC,EAAW,YAAAC,EAAU,UAAAC,EAAQ,eAAAC,MAAmB,QACzD,OAAS,cAAcC,MAAU,gBACjC,OAAS,aAAAC,MAAiB,wBAGnB,MAAMC,EAAoB,CAAC,CAAE,KAAAC,CAAK,IAAuC,CAC9E,KAAM,CAACC,EAAUC,CAAW,EAAIR,EAAiB,EAAE,EAC7CS,EAAcR,EAAoC,IAAI,EAGtDS,EAAmBC,GAAqB,CAC5C,MAAMC,EAAU,SAAS,eAAeD,CAAQ,EAChD,GAAIC,EAAS,CAGX,MAAMC,EADkBD,EAAQ,sBAAsB,EAAE,IAAM,OAAO,YAC5B,GAEzC,OAAO,SAAS,CACd,IAAKC,EACL,SAAU,QACZ,CAAC,CACH,CACF,EAGMC,EAAgBZ,EAAY,IAAM,CAElCO,EAAY,SACdA,EAAY,QAAQ,WAAW,EAIjC,MAAMM,EAAgB,IAAI,IAEpBC,EAAoBC,GAAyC,CACjEA,EAAQ,QAAQC,GAAS,CACvB,MAAMC,EAAKD,EAAM,OAAO,GACxB,GAAI,CAACC,EAAI,OAGT,MAAMC,EAAgBF,EAAM,iBAAiB,OACvCG,EAAeH,EAAM,iBAAiB,MACtCI,EAAcF,EAAgBC,EAEpCN,EAAc,IAAII,EAAID,EAAM,eAAiBI,EAAc,CAAC,CAC9D,CAAC,EAGD,IAAIC,EAAU,EACVC,EAAQ,GAEZT,EAAc,QAAQ,CAACU,EAAMN,IAAO,CAC9BM,EAAOF,IACTA,EAAUE,EACVD,EAAQL,EAEZ,CAAC,EAEGK,GAASA,IAAUjB,GACrBC,EAAYgB,CAAK,CAErB,EAGAf,EAAY,QAAU,IAAI,qBAAqBO,EAAkB,CAC/D,UAAW,CAAC,EAAG,GAAK,GAAK,GAAK,GAAK,GAAK,GAAK,GAAK,GAAK,GAAK,CAAC,EAC7D,WAAY,mBACd,CAAC,EAGDV,EAAK,MAAM,QAAQoB,GAAQ,CACzB,MAAMd,EAAU,SAAS,eAAec,EAAK,QAAQ,EACjDd,GAAWH,EAAY,SACzBA,EAAY,QAAQ,QAAQG,CAAO,CAEvC,CAAC,CACH,EAAG,CAACN,EAAK,MAAOC,CAAQ,CAAC,EAEzB,OAAAR,EAAU,KACRe,EAAc,EAEP,IAAM,CACPL,EAAY,SACdA,EAAY,QAAQ,WAAW,CAEnC,GACC,CAACK,CAAa,CAAC,EAGhBhB,EAAC,OAAI,UAAWK,EAAG,4BAA4B,EAC7C,SAAAL,EAACM,EAAA,CAAU,QAAO,GAChB,SAAAN,EAAC,OACC,UAAWK,EACT,qEACA,2GACF,EAEA,SAAAL,EAAC,MAAG,UAAWK,EAAG,gEAAgE,EAC/E,SAAAG,EAAK,MAAM,IAAI,CAACoB,EAAMC,IAAU,CAC/B,MAAMC,EAAWrB,IAAamB,EAAK,SACnC,OACE5B,EAAC,MAAe,UAAWK,EAAG,kBAAkB,EAC9C,SAAAL,EAAC,UACC,QAAS,IAAMY,EAAgBgB,EAAK,QAAQ,EAC5C,UAAWvB,EACT,mEACA,oEACAyB,EACI,gCACA,wDACN,EAEC,SAAAF,EAAK,MACR,GAZOC,CAaT,CAEJ,CAAC,EACH,EACF,EACF,EACF,CAEJ",
+  "sourcesContent": ["import { useEffect, useState, useRef, useCallback } from 'react'\nimport { classNames as cn } from '@anker-in/lib'\nimport { Container } from '@anker-in/headless-ui'\nimport { CreditsNavigationCopy } from './type'\n\nexport const CreditsNavigation = ({ copy }: { copy: CreditsNavigationCopy }) => {\n  const [activeId, setActiveId] = useState<string>('')\n  const observerRef = useRef<IntersectionObserver | null>(null)\n\n  // \u5E73\u6ED1\u6EDA\u52A8\u5230\u76EE\u6807\u6A21\u5757\n  const scrollToSection = (targetId: string) => {\n    const element = document.getElementById(targetId)\n    if (element) {\n      const navHeight = 56 // \u5BFC\u822A\u680F\u9AD8\u5EA6\n      const elementPosition = element.getBoundingClientRect().top + window.pageYOffset\n      const offsetPosition = elementPosition - navHeight\n\n      window.scrollTo({\n        top: offsetPosition,\n        behavior: 'smooth',\n      })\n    }\n  }\n\n  // \u4F7F\u7528 Intersection Observer \u76D1\u542C\u6A21\u5757\u53EF\u89C1\u6027\n  const setupObserver = useCallback(() => {\n    // \u6E05\u7406\u4E4B\u524D\u7684 observer\n    if (observerRef.current) {\n      observerRef.current.disconnect()\n    }\n\n    // \u8BA1\u7B97\u6BCF\u4E2A\u5143\u7D20\u5728\u89C6\u53E3\u4E2D\u7684\u53EF\u89C1\u9762\u79EF\n    const visibilityMap = new Map<string, number>()\n\n    const observerCallback = (entries: IntersectionObserverEntry[]) => {\n      entries.forEach(entry => {\n        const id = entry.target.id\n        if (!id) return\n\n        // \u8BA1\u7B97\u53EF\u89C1\u9762\u79EF\n        const visibleHeight = entry.intersectionRect.height\n        const visibleWidth = entry.intersectionRect.width\n        const visibleArea = visibleHeight * visibleWidth\n\n        visibilityMap.set(id, entry.isIntersecting ? visibleArea : 0)\n      })\n\n      // \u627E\u51FA\u53EF\u89C1\u9762\u79EF\u6700\u5927\u7684\u5143\u7D20\n      let maxArea = 0\n      let maxId = ''\n\n      visibilityMap.forEach((area, id) => {\n        if (area > maxArea) {\n          maxArea = area\n          maxId = id\n        }\n      })\n\n      if (maxId && maxId !== activeId) {\n        setActiveId(maxId)\n      }\n    }\n\n    // \u521B\u5EFA\u65B0\u7684 observer\n    observerRef.current = new IntersectionObserver(observerCallback, {\n      threshold: [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1],\n      rootMargin: '-56px 0px 0px 0px', // \u8003\u8651\u5BFC\u822A\u680F\u9AD8\u5EA6\n    })\n\n    // \u89C2\u5BDF\u6240\u6709\u76EE\u6807\u5143\u7D20\n    copy.items.forEach(item => {\n      const element = document.getElementById(item.targetId)\n      if (element && observerRef.current) {\n        observerRef.current.observe(element)\n      }\n    })\n  }, [copy.items, activeId])\n\n  useEffect(() => {\n    setupObserver()\n\n    return () => {\n      if (observerRef.current) {\n        observerRef.current.disconnect()\n      }\n    }\n  }, [setupObserver])\n\n  return (\n    <nav id=\"creditsNavigation\" className={cn('sticky top-0 z-50 bg-white')}>\n      <Container asChild>\n        <div\n          className={cn(\n            'md:overflow-x-auto md:overflow-y-hidden md:-mx-[16px] md:px-[16px]',\n            'md:scrollbar-hide md:[&::-webkit-scrollbar]:hidden md:[-ms-overflow-style:none] md:[scrollbar-width:none]'\n          )}\n        >\n          <ul className={cn('flex items-end gap-[24px] pt-[16px] md:pt-[12px] md:gap-[16px] md:pr-[16px]')}>\n            {copy.items.map((item, index) => {\n              const isActive = activeId === item.targetId\n              return (\n                <li key={index} className={cn('md:flex-shrink-0')}>\n                  <button\n                    onClick={() => scrollToSection(item.targetId)}\n                    className={cn(\n                      'pb-[16px] md:pb-[12px] text-[14px] font-bold tracking-[-0.28px] leading-[1.4]',\n                      'transition-all duration-200 relative border-b-4 whitespace-nowrap',\n                      isActive\n                        ? 'text-[#080a0f] border-brand-1'\n                        : 'text-[#4a4c56] hover:text-[#080a0f] border-transparent'\n                    )}\n                  >\n                    {item.label}\n                  </button>\n                </li>\n              )\n            })}\n          </ul>\n        </div>\n      </Container>\n    </nav>\n  )\n}\n"],
+  "mappings": "AAsGkB,cAAAA,MAAA,oBAtGlB,OAAS,aAAAC,EAAW,YAAAC,EAAU,UAAAC,EAAQ,eAAAC,MAAmB,QACzD,OAAS,cAAcC,MAAU,gBACjC,OAAS,aAAAC,MAAiB,wBAGnB,MAAMC,EAAoB,CAAC,CAAE,KAAAC,CAAK,IAAuC,CAC9E,KAAM,CAACC,EAAUC,CAAW,EAAIR,EAAiB,EAAE,EAC7CS,EAAcR,EAAoC,IAAI,EAGtDS,EAAmBC,GAAqB,CAC5C,MAAMC,EAAU,SAAS,eAAeD,CAAQ,EAChD,GAAIC,EAAS,CAGX,MAAMC,EADkBD,EAAQ,sBAAsB,EAAE,IAAM,OAAO,YAC5B,GAEzC,OAAO,SAAS,CACd,IAAKC,EACL,SAAU,QACZ,CAAC,CACH,CACF,EAGMC,EAAgBZ,EAAY,IAAM,CAElCO,EAAY,SACdA,EAAY,QAAQ,WAAW,EAIjC,MAAMM,EAAgB,IAAI,IAEpBC,EAAoBC,GAAyC,CACjEA,EAAQ,QAAQC,GAAS,CACvB,MAAMC,EAAKD,EAAM,OAAO,GACxB,GAAI,CAACC,EAAI,OAGT,MAAMC,EAAgBF,EAAM,iBAAiB,OACvCG,EAAeH,EAAM,iBAAiB,MACtCI,EAAcF,EAAgBC,EAEpCN,EAAc,IAAII,EAAID,EAAM,eAAiBI,EAAc,CAAC,CAC9D,CAAC,EAGD,IAAIC,EAAU,EACVC,EAAQ,GAEZT,EAAc,QAAQ,CAACU,EAAMN,IAAO,CAC9BM,EAAOF,IACTA,EAAUE,EACVD,EAAQL,EAEZ,CAAC,EAEGK,GAASA,IAAUjB,GACrBC,EAAYgB,CAAK,CAErB,EAGAf,EAAY,QAAU,IAAI,qBAAqBO,EAAkB,CAC/D,UAAW,CAAC,EAAG,GAAK,GAAK,GAAK,GAAK,GAAK,GAAK,GAAK,GAAK,GAAK,CAAC,EAC7D,WAAY,mBACd,CAAC,EAGDV,EAAK,MAAM,QAAQoB,GAAQ,CACzB,MAAMd,EAAU,SAAS,eAAec,EAAK,QAAQ,EACjDd,GAAWH,EAAY,SACzBA,EAAY,QAAQ,QAAQG,CAAO,CAEvC,CAAC,CACH,EAAG,CAACN,EAAK,MAAOC,CAAQ,CAAC,EAEzB,OAAAR,EAAU,KACRe,EAAc,EAEP,IAAM,CACPL,EAAY,SACdA,EAAY,QAAQ,WAAW,CAEnC,GACC,CAACK,CAAa,CAAC,EAGhBhB,EAAC,OAAI,GAAG,oBAAoB,UAAWK,EAAG,4BAA4B,EACpE,SAAAL,EAACM,EAAA,CAAU,QAAO,GAChB,SAAAN,EAAC,OACC,UAAWK,EACT,qEACA,2GACF,EAEA,SAAAL,EAAC,MAAG,UAAWK,EAAG,6EAA6E,EAC5F,SAAAG,EAAK,MAAM,IAAI,CAACoB,EAAMC,IAAU,CAC/B,MAAMC,EAAWrB,IAAamB,EAAK,SACnC,OACE5B,EAAC,MAAe,UAAWK,EAAG,kBAAkB,EAC9C,SAAAL,EAAC,UACC,QAAS,IAAMY,EAAgBgB,EAAK,QAAQ,EAC5C,UAAWvB,EACT,gFACA,oEACAyB,EACI,gCACA,wDACN,EAEC,SAAAF,EAAK,MACR,GAZOC,CAaT,CAEJ,CAAC,EACH,EACF,EACF,EACF,CAEJ",
   "names": ["jsx", "useEffect", "useState", "useRef", "useCallback", "cn", "Container", "CreditsNavigation", "copy", "activeId", "setActiveId", "observerRef", "scrollToSection", "targetId", "element", "offsetPosition", "setupObserver", "visibilityMap", "observerCallback", "entries", "entry", "id", "visibleHeight", "visibleWidth", "visibleArea", "maxArea", "maxId", "area", "item", "index", "isActive"]
 }

package/dist/esm/components/credits/creditsRedeemList/CreditsRedeemList.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as n,jsxs as ne}from"react/jsx-runtime";import{Container as H,Heading as z,Tabs as B,TabsList as U,TabsTrigger as j,Text as q}from"@anker-in/headless-ui";import u from"classnames";import{useCallback as w,useMemo as L,useState as g}from"react";import G from"./RedeemCouponModal";import V from"./RedeemProductModal";import{useCreditsContext as $}from"../context/provider";import J from"../context/hooks/useRedeemableList";import{AlpcConsumeType as f,AlpcErrorCode as K}from"../context/const";import{useHeadlessContext as Q,useProductsByHandles as W,gaTrack as X}from"@anker-in/lib";import{RedeemableItem as Y}from"./RedeemableItem";import{ROUNDED_BRANDS as Z}from"../../../constants";import ee from"../modal/rulesModal";import{useRegistration as te}from"../../../components/registration";import{numberFormat as se}from"../context/utils";const Re=({copy:t,id:N})=>{const{profile:l,openSignUpPopup:_,gtm:{pageGroup:k},pageCommon:I,creditInfo:A}=$(),{authCodeActivate:b}=te(),{brand:E}=Q(),S=Z.includes(E),C=Object.keys(l||{}).length>0,M=l?.activated,[d,O]=g(t.list[0].label),[o,m]=g(void 0),[p,v]=g(),{listLoading:P,redeemableList:x,getRedeemableList:R}=J(),i=L(()=>x.map(e=>({id:e.id.toString(),title:e.name,consumeCredits:e.consume_credits,remainingInventory:e.remaining_inventory,isLimited:!!e.is_limited,consumeType:e.consume_type,handle:e.sku_handle,sku:e.goods_sku,image:e.goods_url})),[t.list,d,x]),D=i.map(e=>e.handle),{data:y}=W({handles:D}),F=L(()=>t.list.find(s=>s.label===d)?.list.filter(s=>i.some(r=>r.id===s.id)).map(s=>{const r=i.find(a=>a.id===s.id),c=y?.find(a=>a.handle===r?.handle),h=c?.variants.find(a=>a.sku===r?.sku);return r?.isLimited&&(!r?.remainingInventory||r.remainingInventory<=0)||r?.consumeType===f.Product&&(!c||!h)?null:{alpc:i.find(a=>a.id===s.id),config:s,product:c,variant:h}}).filter(s=>s!==null),[i,y]),T=w(e=>{e===K.CodeLpcRuleInventoryNotEnough&&R()},[R]);return ne(H,{id:N,className:u("relative bg-[#F5F5F7]"),children:[n(z,{as:"h2",size:"4",html:t.title}),C&&M&&n(q,{html:t.availableCredits?.replace("$credits",se(A?.available_credit||0).toString()),className:"mt-[12px] text-[20px] l-xxl:text-[18px] l:text-[16px] font-bold text-[#4A4C56]",as:"p"}),n(B,{shape:S?"rounded":"square",align:"left",className:u("sticky top-0 z-20 py-[24px] md:justify-center"),value:d.toString(),onValueChange:e=>{O(e),X({event:"ga4Event",event_name:"lp_navigation",event_parameters:{navigation:e,page_group:k}})},children:n(U,{children:t.list.map(e=>n(j,{value:e.label,children:e.label},e.label))})}),!!i?.length&&!P&&n("div",{className:u("relative grid grid-cols-4 gap-[16px] md:grid-cols-2 md:gap-[12px] md-xl:grid-cols-3"),children:F?.map(e=>n(Y,{copy:t,item:e,onRedeem:s=>{C?!l?.activated&&!b.isActivateSuccess?b.open():m(s):_()},onRulesOpen:v},e?.alpc?.id))}),o?.alpc?.consumeType===f.Coupon&&t?.redeemModal?.coupon&&o&&n(G,{isOpen:!!o,item:o,copy:t,onError:T,onClose:()=>{m(void 0)}}),o?.alpc?.consumeType===f.Product&&t?.redeemModal&&o&&n(V,{isOpen:!!o,item:o,copy:t,onError:T,onClose:()=>{m(void 0)}}),p&&n(ee,{overlayClassName:"md:px-[16px] md:items-center",className:"md:h-fit md:rounded-b-[16px]",isOpen:p.length>0,onClose:()=>v([]),titleClassName:"border-b-transparent h-[56px]",rules:p,scrollClassName:"md:mt-[8px] md:mb-[24px] md:pt-0",title:I?.ruleLabel,ruleClassName:"text-[#1d1d1f] font-bold"})]})};export{Re as CreditsRedeemList};
+import{Fragment as ae,jsx as a,jsxs as k}from"react/jsx-runtime";import{Container as H,Heading as $,Tabs as z,TabsList as B,TabsTrigger as U}from"@anker-in/headless-ui";import c from"classnames";import{useCallback as j,useMemo as N,useState as u}from"react";import q from"./RedeemCouponModal";import w from"./RedeemProductModal";import{useCreditsContext as G}from"../context/provider";import V from"../context/hooks/useRedeemableList";import{AlpcConsumeType as g,AlpcErrorCode as J}from"../context/const";import{useHeadlessContext as K,useProductsByHandles as Q,gaTrack as W,classNames as X}from"@anker-in/lib";import{RedeemableItem as Y}from"./RedeemableItem";import{ROUNDED_BRANDS as Z}from"../../../constants";import ee from"../modal/rulesModal";import{useRegistration as te}from"../../../components/registration";import{numberFormat as se}from"../context/utils";const Re=({copy:t,id:_})=>{const{profile:b,openSignUpPopup:I,gtm:{pageGroup:A},pageCommon:E,creditInfo:S}=G(),{authCodeActivate:f}=te(),{brand:C}=K(),M=Z.includes(C),v=Object.keys(b||{}).length>0,[l,O]=u(t.list?.[0]?.label||""),[n,d]=u(void 0),[m,x]=u(),{listLoading:P,redeemableList:R,getRedeemableList:T}=V(),o=N(()=>R.map(e=>({id:e.id.toString(),title:e.name,consumeCredits:e.consume_credits,remainingInventory:e.remaining_inventory,isLimited:!!e.is_limited,consumeType:e.consume_type,handle:e.sku_handle,sku:e.goods_sku,image:e.goods_url})),[t.list,l,R]),D=o.map(e=>e.handle),{data:h}=Q({handles:D}),F=N(()=>(t.list?.find(s=>s.label===l)?.list||[]).filter(s=>o.some(r=>r.id===s.id)).map(s=>{const r=o.find(i=>i.id===s.id),p=h?.find(i=>i.handle===r?.handle),L=p?.variants.find(i=>i.sku===r?.sku);return r?.isLimited&&(!r?.remainingInventory||r.remainingInventory<=0)||r?.consumeType===g.Product&&(!p||!L)?null:{alpc:o.find(i=>i.id===s.id),config:s,product:p,variant:L}}).filter(s=>s!==null),[o,h]),y=j(e=>{e===J.CodeLpcRuleInventoryNotEnough&&T()},[T]);return k(H,{id:_,className:c("relative bg-[#F5F5F7]"),children:[a($,{as:"h2",size:"4",html:t.title}),v&&t.availableCredits&&a("p",{className:"mt-[12px] text-[20px] l-xxl:text-[18px] l:text-[16px] font-bold text-[#4A4C56]",children:t.availableCredits.includes("$credits")?k(ae,{children:[t.availableCredits.split("$credits")[0],a("span",{className:X("text-brand-color-0",C==="ankersolix"&&"bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent"),children:se(S?.available_credit||0).toString()}),t.availableCredits.split("$credits")[1]||""]}):t.availableCredits}),a(z,{shape:M?"rounded":"square",align:"left",className:c("sticky top-0 z-20 py-[24px] md:justify-center"),value:l.toString(),onValueChange:e=>{O(e),W({event:"ga4Event",event_name:"lp_navigation",event_parameters:{navigation:e,page_group:A}})},children:a(B,{children:(t.list||[]).map(e=>a(U,{value:e.label,children:e.label},e.label))})}),!!o?.length&&!P&&a("div",{className:c("relative grid grid-cols-4 gap-[16px] md:grid-cols-2 md:gap-[12px] md-xl:grid-cols-3"),children:F?.map(e=>a(Y,{copy:t,item:e,onRedeem:s=>{v?!b?.activated&&!f.isActivateSuccess?f.open():d(s):I()},onRulesOpen:x},e?.alpc?.id))}),n?.alpc?.consumeType===g.Coupon&&t?.redeemModal?.coupon&&n&&a(q,{isOpen:!!n,item:n,copy:t,onError:y,onClose:()=>{d(void 0)}}),n?.alpc?.consumeType===g.Product&&t?.redeemModal&&n&&a(w,{isOpen:!!n,item:n,copy:t,onError:y,onClose:()=>{d(void 0)}}),m&&a(ee,{overlayClassName:"md:px-[16px] md:items-center",className:"md:h-fit md:rounded-b-[16px]",isOpen:m.length>0,onClose:()=>x([]),titleClassName:"border-b-transparent h-[56px]",rules:m,scrollClassName:"md:mt-[8px] md:mb-[24px] md:pt-0",title:E?.ruleLabel,ruleClassName:"text-[#1d1d1f] font-bold"})]})};export{Re as CreditsRedeemList};
 //# sourceMappingURL=CreditsRedeemList.js.map

package/dist/esm/components/credits/creditsRedeemList/CreditsRedeemList.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsRedeemList/CreditsRedeemList.tsx"],
-  "sourcesContent": ["import { Container, Heading, Tabs, TabsList, TabsTrigger, Text } from '@anker-in/headless-ui'\nimport classNames from 'classnames'\nimport { useCallback, useMemo, useState } from 'react'\n\nimport RedeemCouponModal from './RedeemCouponModal'\nimport RedeemProductModal from './RedeemProductModal'\nimport { useCreditsContext } from '../context/provider'\nimport useRedeemableList from '../context/hooks/useRedeemableList'\nimport { AlpcConsumeType, AlpcErrorCode } from '../context/const'\nimport { useHeadlessContext, useProductsByHandles, gaTrack } from '@anker-in/lib'\nimport type { RedeemableItem as RedeemableItemType } from '../type'\nimport { RedeemableItem } from './RedeemableItem'\nimport { ROUNDED_BRANDS } from '../../../constants'\nimport RulesModal from '../modal/rulesModal'\nimport { CreditsRedeemListCopy } from './type'\nimport { useRegistration } from '../../../components/registration'\nimport { numberFormat } from '../context/utils'\n\nexport const CreditsRedeemList = ({ copy, id }: { copy: CreditsRedeemListCopy; id?: string }) => {\n  const {\n    profile,\n    openSignUpPopup,\n    gtm: { pageGroup },\n    pageCommon,\n    creditInfo,\n  } = useCreditsContext()\n  const { authCodeActivate } = useRegistration()\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n\n  const isLogin = Object.keys(profile || {}).length > 0\n  const isActivated = profile?.activated\n\n  const [activeTab, setActiveTab] = useState<string>(copy.list[0].label)\n\n  const [popRedeemData, setPopRedeemData] = useState<RedeemableItemType | undefined>(undefined)\n\n  const [rules, setRules] = useState<string | string[]>()\n\n  const { listLoading, redeemableList, getRedeemableList } = useRedeemableList()\n\n  const alpcList = useMemo(() => {\n    return redeemableList.map(item => {\n      return {\n        id: item.id.toString(),\n        title: item.name,\n        consumeCredits: item.consume_credits,\n        remainingInventory: item.remaining_inventory,\n        isLimited: !!item.is_limited,\n        consumeType: item.consume_type,\n        handle: item.sku_handle,\n        sku: item.goods_sku,\n        image: item.goods_url,\n      }\n    })\n  }, [copy.list, activeTab, redeemableList])\n\n  const handles = alpcList.map(item => item.handle)\n  const { data: products } = useProductsByHandles({ handles })\n\n  const list = useMemo(() => {\n    const currentList = copy.list.find(item => item.label === activeTab)\n    return currentList?.list\n      .filter(item => alpcList.some(alpcItem => alpcItem.id === item.id))\n      .map(item => {\n        const alpcItem = alpcList.find(alpcItem => alpcItem.id === item.id)\n        const product = products?.find(product => product.handle === alpcItem?.handle)\n        const variant = product?.variants.find(variant => variant.sku === alpcItem?.sku)\n        // \u8FC7\u6EE4\u6389\u5E93\u5B58\u4E0D\u8DB3\u7684\u5546\u54C1\n        if (alpcItem?.isLimited && (!alpcItem?.remainingInventory || alpcItem.remainingInventory <= 0)) return null\n        if (alpcItem?.consumeType === AlpcConsumeType.Product && (!product || !variant)) return null\n        return {\n          alpc: alpcList.find(alpcItem => alpcItem.id === item.id),\n          config: item,\n          product,\n          variant,\n        }\n      })\n      .filter(item => item !== null) as unknown as RedeemableItemType[]\n  }, [alpcList, products])\n\n  const handleRedeemError = useCallback(\n    (errorCode: AlpcErrorCode) => {\n      if (errorCode === AlpcErrorCode.CodeLpcRuleInventoryNotEnough) {\n        getRedeemableList()\n      }\n    },\n    [getRedeemableList]\n  )\n\n  return (\n    <Container id={id} className={classNames('relative bg-[#F5F5F7]')}>\n      <Heading as=\"h2\" size=\"4\" html={copy.title} />\n\n      {/* \u53EF\u7528\u79EF\u5206\u5C55\u793A */}\n      {isLogin && isActivated && (\n        <Text\n          html={copy.availableCredits?.replace('$credits', numberFormat(creditInfo?.available_credit || 0).toString())}\n          className=\"mt-[12px] text-[20px] l-xxl:text-[18px] l:text-[16px] font-bold text-[#4A4C56]\"\n          as=\"p\"\n        />\n      )}\n\n      <Tabs\n        shape={rounded ? 'rounded' : 'square'}\n        align=\"left\"\n        className={classNames('sticky top-0 z-20 py-[24px] md:justify-center')}\n        value={activeTab.toString()}\n        onValueChange={value => {\n          setActiveTab(value)\n          gaTrack({\n            event: 'ga4Event',\n            event_name: 'lp_navigation',\n            event_parameters: {\n              navigation: value,\n              page_group: pageGroup,\n            },\n          })\n        }}\n      >\n        <TabsList>\n          {copy.list.map(item => (\n            <TabsTrigger key={item.label} value={item.label}>\n              {item.label}\n            </TabsTrigger>\n          ))}\n        </TabsList>\n      </Tabs>\n      {/* PC\u7AEF */}\n      {!!alpcList?.length && !listLoading && (\n        <div\n          className={classNames('relative grid grid-cols-4 gap-[16px] md:grid-cols-2 md:gap-[12px] md-xl:grid-cols-3')}\n        >\n          {list?.map(item => (\n            <RedeemableItem\n              key={item?.alpc?.id}\n              copy={copy}\n              item={item}\n              onRedeem={(item: RedeemableItemType) => {\n                if (!isLogin) {\n                  openSignUpPopup()\n                } else if (!profile?.activated && !authCodeActivate.isActivateSuccess) {\n                  authCodeActivate.open()\n                } else {\n                  setPopRedeemData(item)\n                }\n              }}\n              onRulesOpen={setRules}\n            />\n          ))}\n        </div>\n      )}\n\n      {popRedeemData?.alpc?.consumeType === AlpcConsumeType.Coupon && copy?.redeemModal?.coupon && popRedeemData && (\n        <RedeemCouponModal\n          isOpen={!!popRedeemData}\n          item={popRedeemData}\n          copy={copy}\n          onError={handleRedeemError}\n          onClose={() => {\n            setPopRedeemData(undefined)\n          }}\n        />\n      )}\n      {popRedeemData?.alpc?.consumeType === AlpcConsumeType.Product && copy?.redeemModal && popRedeemData && (\n        <RedeemProductModal\n          isOpen={!!popRedeemData}\n          item={popRedeemData}\n          copy={copy}\n          onError={handleRedeemError}\n          onClose={() => {\n            setPopRedeemData(undefined)\n          }}\n        />\n      )}\n      {rules && (\n        <RulesModal\n          overlayClassName=\"md:px-[16px] md:items-center\"\n          className=\"md:h-fit md:rounded-b-[16px]\"\n          isOpen={rules.length > 0}\n          onClose={() => setRules([])}\n          titleClassName=\"border-b-transparent h-[56px]\"\n          rules={rules}\n          scrollClassName=\"md:mt-[8px] md:mb-[24px] md:pt-0\"\n          title={pageCommon?.ruleLabel}\n          ruleClassName=\"text-[#1d1d1f] font-bold\"\n        />\n      )}\n    </Container>\n  )\n}\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "Container", "Heading", "Tabs", "TabsList", "TabsTrigger", "Text", "classNames", "useCallback", "useMemo", "useState", "RedeemCouponModal", "RedeemProductModal", "useCreditsContext", "useRedeemableList", "AlpcConsumeType", "AlpcErrorCode", "useHeadlessContext", "useProductsByHandles", "gaTrack", "RedeemableItem", "ROUNDED_BRANDS", "RulesModal", "useRegistration", "numberFormat", "CreditsRedeemList", "copy", "id", "profile", "openSignUpPopup", "pageGroup", "pageCommon", "creditInfo", "authCodeActivate", "brand", "rounded", "isLogin", "isActivated", "activeTab", "setActiveTab", "popRedeemData", "setPopRedeemData", "rules", "setRules", "listLoading", "redeemableList", "getRedeemableList", "alpcList", "item", "handles", "products", "list", "alpcItem", "product", "variant", "handleRedeemError", "errorCode", "value"]
+  "sourcesContent": ["import { Container, Heading, Tabs, TabsList, TabsTrigger } from '@anker-in/headless-ui'\nimport classNames from 'classnames'\nimport { useCallback, useMemo, useState } from 'react'\n\nimport RedeemCouponModal from './RedeemCouponModal'\nimport RedeemProductModal from './RedeemProductModal'\nimport { useCreditsContext } from '../context/provider'\nimport useRedeemableList from '../context/hooks/useRedeemableList'\nimport { AlpcConsumeType, AlpcErrorCode } from '../context/const'\nimport { useHeadlessContext, useProductsByHandles, gaTrack, classNames as cn } from '@anker-in/lib'\nimport type { RedeemableItem as RedeemableItemType } from '../type'\nimport { RedeemableItem } from './RedeemableItem'\nimport { ROUNDED_BRANDS } from '../../../constants'\nimport RulesModal from '../modal/rulesModal'\nimport { CreditsRedeemListCopy } from './type'\nimport { useRegistration } from '../../../components/registration'\nimport { numberFormat } from '../context/utils'\n\nexport const CreditsRedeemList = ({ copy, id }: { copy: CreditsRedeemListCopy; id?: string }) => {\n  const {\n    profile,\n    openSignUpPopup,\n    gtm: { pageGroup },\n    pageCommon,\n    creditInfo,\n  } = useCreditsContext()\n  const { authCodeActivate } = useRegistration()\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n\n  const isLogin = Object.keys(profile || {}).length > 0\n\n  const [activeTab, setActiveTab] = useState<string>(copy.list?.[0]?.label || '')\n\n  const [popRedeemData, setPopRedeemData] = useState<RedeemableItemType | undefined>(undefined)\n\n  const [rules, setRules] = useState<string | string[]>()\n\n  const { listLoading, redeemableList, getRedeemableList } = useRedeemableList()\n\n  const alpcList = useMemo(() => {\n    return redeemableList.map(item => {\n      return {\n        id: item.id.toString(),\n        title: item.name,\n        consumeCredits: item.consume_credits,\n        remainingInventory: item.remaining_inventory,\n        isLimited: !!item.is_limited,\n        consumeType: item.consume_type,\n        handle: item.sku_handle,\n        sku: item.goods_sku,\n        image: item.goods_url,\n      }\n    })\n  }, [copy.list, activeTab, redeemableList])\n\n  const handles = alpcList.map(item => item.handle)\n  const { data: products } = useProductsByHandles({ handles })\n\n  const list = useMemo(() => {\n    const currentList = copy.list?.find(item => item.label === activeTab)\n    return (currentList?.list || [])\n      .filter(item => alpcList.some(alpcItem => alpcItem.id === item.id))\n      .map(item => {\n        const alpcItem = alpcList.find(alpcItem => alpcItem.id === item.id)\n        const product = products?.find(product => product.handle === alpcItem?.handle)\n        const variant = product?.variants.find(variant => variant.sku === alpcItem?.sku)\n        // \u8FC7\u6EE4\u6389\u5E93\u5B58\u4E0D\u8DB3\u7684\u5546\u54C1\n        if (alpcItem?.isLimited && (!alpcItem?.remainingInventory || alpcItem.remainingInventory <= 0)) return null\n        if (alpcItem?.consumeType === AlpcConsumeType.Product && (!product || !variant)) return null\n        return {\n          alpc: alpcList.find(alpcItem => alpcItem.id === item.id),\n          config: item,\n          product,\n          variant,\n        }\n      })\n      .filter(item => item !== null) as unknown as RedeemableItemType[]\n  }, [alpcList, products])\n\n  const handleRedeemError = useCallback(\n    (errorCode: AlpcErrorCode) => {\n      if (errorCode === AlpcErrorCode.CodeLpcRuleInventoryNotEnough) {\n        getRedeemableList()\n      }\n    },\n    [getRedeemableList]\n  )\n\n  return (\n    <Container id={id} className={classNames('relative bg-[#F5F5F7]')}>\n      <Heading as=\"h2\" size=\"4\" html={copy.title} />\n\n      {/* \u53EF\u7528\u79EF\u5206\u5C55\u793A */}\n      {isLogin && copy.availableCredits && (\n        <p className=\"mt-[12px] text-[20px] l-xxl:text-[18px] l:text-[16px] font-bold text-[#4A4C56]\">\n          {copy.availableCredits.includes('$credits') ? (\n            <>\n              {copy.availableCredits.split('$credits')[0]}\n              <span\n                className={cn(\n                  'text-brand-color-0',\n                  brand === 'ankersolix' &&\n                    'bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent'\n                )}\n              >\n                {numberFormat(creditInfo?.available_credit || 0).toString()}\n              </span>\n              {copy.availableCredits.split('$credits')[1] || ''}\n            </>\n          ) : (\n            copy.availableCredits\n          )}\n        </p>\n      )}\n\n      <Tabs\n        shape={rounded ? 'rounded' : 'square'}\n        align=\"left\"\n        className={classNames('sticky top-0 z-20 py-[24px] md:justify-center')}\n        value={activeTab.toString()}\n        onValueChange={value => {\n          setActiveTab(value)\n          gaTrack({\n            event: 'ga4Event',\n            event_name: 'lp_navigation',\n            event_parameters: {\n              navigation: value,\n              page_group: pageGroup,\n            },\n          })\n        }}\n      >\n        <TabsList>\n          {(copy.list || []).map(item => (\n            <TabsTrigger key={item.label} value={item.label}>\n              {item.label}\n            </TabsTrigger>\n          ))}\n        </TabsList>\n      </Tabs>\n      {/* PC\u7AEF */}\n      {!!alpcList?.length && !listLoading && (\n        <div\n          className={classNames('relative grid grid-cols-4 gap-[16px] md:grid-cols-2 md:gap-[12px] md-xl:grid-cols-3')}\n        >\n          {list?.map(item => (\n            <RedeemableItem\n              key={item?.alpc?.id}\n              copy={copy}\n              item={item}\n              onRedeem={(item: RedeemableItemType) => {\n                if (!isLogin) {\n                  openSignUpPopup()\n                } else if (!profile?.activated && !authCodeActivate.isActivateSuccess) {\n                  authCodeActivate.open()\n                } else {\n                  setPopRedeemData(item)\n                }\n              }}\n              onRulesOpen={setRules}\n            />\n          ))}\n        </div>\n      )}\n\n      {popRedeemData?.alpc?.consumeType === AlpcConsumeType.Coupon && copy?.redeemModal?.coupon && popRedeemData && (\n        <RedeemCouponModal\n          isOpen={!!popRedeemData}\n          item={popRedeemData}\n          copy={copy}\n          onError={handleRedeemError}\n          onClose={() => {\n            setPopRedeemData(undefined)\n          }}\n        />\n      )}\n      {popRedeemData?.alpc?.consumeType === AlpcConsumeType.Product && copy?.redeemModal && popRedeemData && (\n        <RedeemProductModal\n          isOpen={!!popRedeemData}\n          item={popRedeemData}\n          copy={copy}\n          onError={handleRedeemError}\n          onClose={() => {\n            setPopRedeemData(undefined)\n          }}\n        />\n      )}\n      {rules && (\n        <RulesModal\n          overlayClassName=\"md:px-[16px] md:items-center\"\n          className=\"md:h-fit md:rounded-b-[16px]\"\n          isOpen={rules.length > 0}\n          onClose={() => setRules([])}\n          titleClassName=\"border-b-transparent h-[56px]\"\n          rules={rules}\n          scrollClassName=\"md:mt-[8px] md:mb-[24px] md:pt-0\"\n          title={pageCommon?.ruleLabel}\n          ruleClassName=\"text-[#1d1d1f] font-bold\"\n        />\n      )}\n    </Container>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "Container", "Heading", "Tabs", "TabsList", "TabsTrigger", "classNames", "useCallback", "useMemo", "useState", "RedeemCouponModal", "RedeemProductModal", "useCreditsContext", "useRedeemableList", "AlpcConsumeType", "AlpcErrorCode", "useHeadlessContext", "useProductsByHandles", "gaTrack", "cn", "RedeemableItem", "ROUNDED_BRANDS", "RulesModal", "useRegistration", "numberFormat", "CreditsRedeemList", "copy", "id", "profile", "openSignUpPopup", "pageGroup", "pageCommon", "creditInfo", "authCodeActivate", "brand", "rounded", "isLogin", "activeTab", "setActiveTab", "popRedeemData", "setPopRedeemData", "rules", "setRules", "listLoading", "redeemableList", "getRedeemableList", "alpcList", "item", "handles", "products", "list", "alpcItem", "product", "variant", "handleRedeemError", "errorCode", "value"]
 }

package/dist/esm/components/credits/creditsRedeemList/RedeemableItem.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as o}from"react/jsx-runtime";import{Button as C,Text as u,Picture as p}from"@anker-in/headless-ui";import{useMemo as x}from"react";import s from"classnames";import{useCreditsContext as R}from"../context/provider";import{AlpcConsumeType as f,ConsumeType as T}from"../context/const";import{numberFormat as w}from"../context/utils";import{gaTrack as v,useHeadlessContext as I}from"@anker-in/lib";import{NoneProductValue as k}from"./NonProductValue";import{ROUNDED_BRANDS as S}from"../../../constants";function j({copy:l,className:g,item:e,onRulesOpen:b,onRedeem:y}){const{creditInfo:m,profile:a,gtm:{pageGroup:d},pageCommon:n}=R(),{brand:_}=I(),i=Object.keys(a||{}).length>0,h=S.includes(_),N=x(()=>!!(e.alpc?.remainingInventory<=0&&e.alpc?.isLimited||e.alpc?.consumeType===f.Product&&!e.variant?.availableForSale||i&&a?.activated&&e.alpc?.consumeCredits>Number(m?.available_credit||0)),[e.alpc?.remainingInventory,e.alpc?.isLimited,e.alpc?.consumeType,e.alpc?.consumeCredits,i,a?.activated,m?.available_credit,e.variant?.availableForSale]),c=x(()=>i?e.alpc?.consumeType===f.Product?e.variant?.availableForSale?l.btnRedeem:n?.soldOut||"Sold Out":l.btnRedeem:l.unlockRewards,[i,e.alpc?.consumeType,e.variant?.availableForSale,l.btnRedeem,l.unlockRewards,n?.soldOut]);return o("div",{className:s("flex flex-col items-center rounded-[16px] bg-[#EAEAEC] p-[24px] md:rounded-[12px] md:px-[8px] xl:py-[16px] md-xl:px-[16px]",!h&&"rounded-none md:rounded-none",g),children:[e.config?.type===T.Product?t("div",{className:s("relative mx-auto h-[224px] w-fit md:my-[10px] l:h-[120px] l-xxl:h-[138px]"),children:t(p,{className:"h-full w-auto [&_img]:h-full [&_img]:object-contain",source:e.config?.image?.url||e.product.images?.[0]?.url})}):o("div",{className:"relative mx-auto my-[30px] h-[164px] md:my-0 md:h-[66px] l-xxl:h-[138px] md-l:h-[80px]",children:[t(p,{source:n?.imageMapping?.[e.config?.type]?.url,className:"h-full [&_img]:h-full [&_img]:w-auto [&_img]:object-contain"}),t(k,{item:e})]}),o("div",{className:s("mt-[22px] flex w-full flex-1 flex-col justify-between"),children:[t(u,{html:e.config?.title||e.alpc?.title,title:e.config?.title||e.alpc?.title,size:2,className:"line-clamp-2 h-[58px] text-[24px] leading-[1.2] l:h-[40px] l:text-[16px] l-xxl:h-[48px] l-xxl:text-[20px]"}),e.config?.rules?.length>0&&t("button",{type:"button",onClick:()=>{b(e.config?.rules||[]),v({event:"ga4Event",event_name:"lp_button",member_active_status:a?.activated?"active":"not active",event_parameters:{page_group:d,position:l.title,button_name:n?.ruleLabel,info:e.alpc?.id?.toString()}})},className:"mt-[8px] w-fit text-[16px] font-bold underline md:text-[14px] l:mt-0",tabIndex:0,onKeyDown:r=>{(r.key==="Enter"||r.key===" ")&&r.preventDefault()},children:n?.ruleLabel}),o("div",{children:[o("div",{className:"mt-[26px] flex items-center l:mt-[12px] l-xl:mt-[16px]",children:[t(p,{className:"size-[24px] l-xxl:size-[22px] md-l:size-[18px] md:size-[16px]",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/icon_hire_purchase.png?v=1757496783"}),t(u,{html:`${w(e.alpc?.consumeCredits)}`,size:2,as:"p",className:"ml-[4px] text-[28px] font-bold mt-[4px] leading-none md:text-[18px] l-xxl:text-[24px] md-l:text-[20px] "})]}),t(C,{disabled:N,variant:"primary",size:"lg",className:"mt-[8px] md:px-[8px] l:w-full",onClick:()=>{y(e),v({event:"ga4Event",event_name:"lp_button",member_active_status:a?.activated?"active":"not active",event_parameters:{page_group:d,position:l.title,button_name:c,info:e.alpc?.id?.toString()}})},children:c})]})]})]})}export{j as RedeemableItem};
+import{jsx as t,jsxs as o}from"react/jsx-runtime";import{Button as C,Text as u,Picture as p}from"@anker-in/headless-ui";import{useMemo as x}from"react";import s from"classnames";import{useCreditsContext as R}from"../context/provider";import{AlpcConsumeType as f,ConsumeType as T}from"../context/const";import{numberFormat as w}from"../context/utils";import{gaTrack as v,useHeadlessContext as I}from"@anker-in/lib";import{NoneProductValue as k}from"./NonProductValue";import{ROUNDED_BRANDS as S}from"../../../constants";function j({copy:l,className:g,item:e,onRulesOpen:b,onRedeem:y}){const{creditInfo:m,profile:a,gtm:{pageGroup:c},pageCommon:n}=R(),{brand:_}=I(),i=Object.keys(a||{}).length>0,h=S.includes(_),N=x(()=>!!(e.alpc?.remainingInventory<=0&&e.alpc?.isLimited||e.alpc?.consumeType===f.Product&&!e.variant?.availableForSale||i&&a?.activated&&e.alpc?.consumeCredits>Number(m?.available_credit||0)),[e.alpc?.remainingInventory,e.alpc?.isLimited,e.alpc?.consumeType,e.alpc?.consumeCredits,i,a?.activated,m?.available_credit,e.variant?.availableForSale]),d=x(()=>i?e.alpc?.consumeType===f.Product?e.variant?.availableForSale?l.btnRedeem:n?.soldOut||"Sold Out":l.btnRedeem:l.unlockRewards,[i,e.alpc?.consumeType,e.variant?.availableForSale,l.btnRedeem,l.unlockRewards,n?.soldOut]);return o("div",{className:s("flex flex-col items-center rounded-[16px] bg-[#EAEAEC] p-[24px] md:rounded-[12px] md:px-[8px] xl:py-[16px] md-xl:px-[16px]",!h&&"rounded-none md:rounded-none",g),children:[e.config?.type===T.Product?t("div",{className:s("relative mx-auto h-[224px] w-fit md:my-[10px] l:h-[120px] l-xxl:h-[138px]"),children:t(p,{className:"h-full w-auto [&_img]:h-full [&_img]:object-contain",source:e.config?.image?.url||e.product.images?.[0]?.url})}):o("div",{className:"relative mx-auto my-[30px] h-[164px] md:my-0 md:h-[66px] l-xxl:h-[138px] md-l:h-[80px]",children:[t(p,{source:n?.imageMapping?.[e.config?.type]?.url,className:"h-full [&_img]:h-full [&_img]:w-auto [&_img]:object-contain"}),t(k,{item:e})]}),o("div",{className:s("mt-[22px] flex w-full flex-1 flex-col justify-between"),children:[t(u,{html:e.config?.title||e.alpc?.title,title:e.config?.title||e.alpc?.title,size:2,className:"line-clamp-2 h-[58px] text-[24px] leading-[1.2] l:h-[40px] l:text-[16px] l-xxl:h-[48px] l-xxl:text-[20px]"}),e.config?.rules?.length>0&&t("button",{type:"button",onClick:()=>{b(e.config?.rules||[]),v({event:"ga4Event",event_name:"lp_button",member_active_status:a?.activated?"active":"not active",event_parameters:{page_group:c,position:l.title,button_name:n?.ruleLabel,info:e.alpc?.id?.toString()}})},className:"mt-[8px] w-fit text-[16px] font-bold underline md:text-[14px] l:mt-0",tabIndex:0,onKeyDown:r=>{(r.key==="Enter"||r.key===" ")&&r.preventDefault()},children:n?.ruleLabel}),o("div",{children:[o("div",{className:"mt-[26px] flex items-center l:mt-[12px] l-xl:mt-[16px]",children:[t(p,{className:"size-[24px] l-xxl:size-[22px] md-l:size-[18px] md:size-[16px]",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/icon_hire_purchase.png?v=1757496783"}),t(u,{html:`${w(e.alpc?.consumeCredits)}`,size:2,as:"p",className:"ml-[4px] text-[24px] font-bold mt-[4px] leading-none l-xxl:text-[20px] l:text-[16px] "})]}),t(C,{disabled:N,variant:"primary",size:"lg",className:"mt-[8px] md:px-[8px] l:w-full",onClick:()=>{y(e),v({event:"ga4Event",event_name:"lp_button",member_active_status:a?.activated?"active":"not active",event_parameters:{page_group:c,position:l.title,button_name:d,info:e.alpc?.id?.toString()}})},children:d})]})]})]})}export{j as RedeemableItem};
 //# sourceMappingURL=RedeemableItem.js.map

package/dist/esm/components/credits/creditsRedeemList/RedeemableItem.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsRedeemList/RedeemableItem.tsx"],
-  "sourcesContent": ["import { Button, Text, Picture } from '@anker-in/headless-ui'\n\nimport { useMemo } from 'react'\n\nimport classNames from 'classnames'\nimport { useCreditsContext } from '../context/provider'\nimport type { RedeemableItem as RedeemableItemType } from '../type'\nimport { AlpcConsumeType, ConsumeType } from '../context/const'\nimport { numberFormat } from '../context/utils'\nimport type { CreditsRedeemListCopy } from './type'\nimport { gaTrack, useHeadlessContext } from '@anker-in/lib'\nimport { NoneProductValue } from './NonProductValue'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nexport function RedeemableItem({\n  copy,\n  className,\n  item,\n  onRulesOpen,\n  onRedeem,\n}: {\n  copy: CreditsRedeemListCopy\n  className?: string\n  item: RedeemableItemType\n  onRulesOpen: (rules: string[]) => void\n  onRedeem: (item: RedeemableItemType) => void\n}) {\n  const {\n    creditInfo,\n    profile,\n    gtm: { pageGroup },\n    pageCommon,\n  } = useCreditsContext()\n  const { brand } = useHeadlessContext()\n  const isLogin = Object.keys(profile || {}).length > 0\n  const rounded = ROUNDED_BRANDS.includes(brand)\n\n  const isDisabled = useMemo(() => {\n    if (item.alpc?.remainingInventory <= 0 && item.alpc?.isLimited) {\n      // \u6709\u5E93\u5B58\u9650\u5236\n      return true\n    }\n\n    if (item.alpc?.consumeType === AlpcConsumeType.Product) {\n      if (!item.variant?.availableForSale) {\n        return true\n      }\n    }\n    if (isLogin && profile?.activated && item.alpc?.consumeCredits > Number(creditInfo?.available_credit || 0)) {\n      return true\n    }\n    return false\n  }, [\n    item.alpc?.remainingInventory,\n    item.alpc?.isLimited,\n    item.alpc?.consumeType,\n    item.alpc?.consumeCredits,\n    isLogin,\n    profile?.activated,\n    creditInfo?.available_credit,\n    item.variant?.availableForSale,\n  ])\n\n  const redeemButtonText = useMemo(() => {\n    if (!isLogin) {\n      return copy.unlockRewards\n    }\n\n    // \u7F3A\u8D27\u6587\u6848\n    if (item.alpc?.consumeType === AlpcConsumeType.Product) {\n      return item.variant?.availableForSale ? copy.btnRedeem : pageCommon?.soldOut || 'Sold Out'\n    }\n    return copy.btnRedeem\n  }, [\n    isLogin,\n    item.alpc?.consumeType,\n    item.variant?.availableForSale,\n    copy.btnRedeem,\n    copy.unlockRewards,\n    pageCommon?.soldOut,\n  ])\n\n  return (\n    <div\n      className={classNames(\n        'flex flex-col items-center rounded-[16px] bg-[#EAEAEC] p-[24px] md:rounded-[12px] md:px-[8px] xl:py-[16px] md-xl:px-[16px]',\n        !rounded && 'rounded-none md:rounded-none',\n        className\n      )}\n    >\n      {item.config?.type === ConsumeType.Product ? (\n        <div className={classNames('relative mx-auto h-[224px] w-fit md:my-[10px] l:h-[120px] l-xxl:h-[138px]')}>\n          <Picture\n            className=\"h-full w-auto [&_img]:h-full [&_img]:object-contain\"\n            source={item.config?.image?.url || item.product.images?.[0]?.url}\n          ></Picture>\n        </div>\n      ) : (\n        <div className=\"relative mx-auto my-[30px] h-[164px] md:my-0 md:h-[66px] l-xxl:h-[138px] md-l:h-[80px]\">\n          <Picture\n            source={pageCommon?.imageMapping?.[item.config?.type]?.url}\n            className=\"h-full [&_img]:h-full [&_img]:w-auto [&_img]:object-contain\"\n          ></Picture>\n\n          <NoneProductValue item={item} />\n        </div>\n      )}\n      <div className={classNames('mt-[22px] flex w-full flex-1 flex-col justify-between')}>\n        <Text\n          html={item.config?.title || item.alpc?.title}\n          title={item.config?.title || item.alpc?.title}\n          size={2}\n          className=\"line-clamp-2 h-[58px] text-[24px] leading-[1.2] l:h-[40px] l:text-[16px] l-xxl:h-[48px] l-xxl:text-[20px]\"\n        />\n        {item.config?.rules?.length > 0 && (\n          <button\n            type=\"button\"\n            onClick={() => {\n              onRulesOpen(item.config?.rules || [])\n              gaTrack({\n                event: 'ga4Event',\n                event_name: 'lp_button',\n                member_active_status: profile?.activated ? 'active' : 'not active',\n                event_parameters: {\n                  page_group: pageGroup,\n                  position: copy.title,\n                  button_name: pageCommon?.ruleLabel,\n                  info: item.alpc?.id?.toString(),\n                },\n              })\n            }}\n            className=\"mt-[8px] w-fit text-[16px] font-bold underline md:text-[14px] l:mt-0\"\n            tabIndex={0}\n            onKeyDown={e => {\n              if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault()\n              }\n            }}\n          >\n            {pageCommon?.ruleLabel}\n          </button>\n        )}\n        <div>\n          <div className=\"mt-[26px] flex items-center l:mt-[12px] l-xl:mt-[16px]\">\n            <Picture\n              className=\"size-[24px] l-xxl:size-[22px] md-l:size-[18px] md:size-[16px]\"\n              source=\"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/icon_hire_purchase.png?v=1757496783\"\n            />\n            <Text\n              html={`${numberFormat(item.alpc?.consumeCredits)}`}\n              size={2}\n              as=\"p\"\n              className=\"ml-[4px] text-[28px] font-bold mt-[4px] leading-none md:text-[18px] l-xxl:text-[24px] md-l:text-[20px] \"\n            />\n          </div>\n\n          <Button\n            disabled={isDisabled}\n            variant=\"primary\"\n            size=\"lg\"\n            className=\"mt-[8px] md:px-[8px] l:w-full\"\n            onClick={() => {\n              onRedeem(item)\n              gaTrack({\n                event: 'ga4Event',\n                event_name: 'lp_button',\n                member_active_status: profile?.activated ? 'active' : 'not active',\n                event_parameters: {\n                  page_group: pageGroup,\n                  position: copy.title,\n                  button_name: redeemButtonText,\n                  info: item.alpc?.id?.toString(),\n                },\n              })\n            }}\n          >\n            {redeemButtonText}\n          </Button>\n        </div>\n      </div>\n    </div>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { Button, Text, Picture } from '@anker-in/headless-ui'\n\nimport { useMemo } from 'react'\n\nimport classNames from 'classnames'\nimport { useCreditsContext } from '../context/provider'\nimport type { RedeemableItem as RedeemableItemType } from '../type'\nimport { AlpcConsumeType, ConsumeType } from '../context/const'\nimport { numberFormat } from '../context/utils'\nimport type { CreditsRedeemListCopy } from './type'\nimport { gaTrack, useHeadlessContext } from '@anker-in/lib'\nimport { NoneProductValue } from './NonProductValue'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nexport function RedeemableItem({\n  copy,\n  className,\n  item,\n  onRulesOpen,\n  onRedeem,\n}: {\n  copy: CreditsRedeemListCopy\n  className?: string\n  item: RedeemableItemType\n  onRulesOpen: (rules: string[]) => void\n  onRedeem: (item: RedeemableItemType) => void\n}) {\n  const {\n    creditInfo,\n    profile,\n    gtm: { pageGroup },\n    pageCommon,\n  } = useCreditsContext()\n  const { brand } = useHeadlessContext()\n  const isLogin = Object.keys(profile || {}).length > 0\n  const rounded = ROUNDED_BRANDS.includes(brand)\n\n  const isDisabled = useMemo(() => {\n    if (item.alpc?.remainingInventory <= 0 && item.alpc?.isLimited) {\n      // \u6709\u5E93\u5B58\u9650\u5236\n      return true\n    }\n\n    if (item.alpc?.consumeType === AlpcConsumeType.Product) {\n      if (!item.variant?.availableForSale) {\n        return true\n      }\n    }\n    if (isLogin && profile?.activated && item.alpc?.consumeCredits > Number(creditInfo?.available_credit || 0)) {\n      return true\n    }\n    return false\n  }, [\n    item.alpc?.remainingInventory,\n    item.alpc?.isLimited,\n    item.alpc?.consumeType,\n    item.alpc?.consumeCredits,\n    isLogin,\n    profile?.activated,\n    creditInfo?.available_credit,\n    item.variant?.availableForSale,\n  ])\n\n  const redeemButtonText = useMemo(() => {\n    if (!isLogin) {\n      return copy.unlockRewards\n    }\n\n    // \u7F3A\u8D27\u6587\u6848\n    if (item.alpc?.consumeType === AlpcConsumeType.Product) {\n      return item.variant?.availableForSale ? copy.btnRedeem : pageCommon?.soldOut || 'Sold Out'\n    }\n    return copy.btnRedeem\n  }, [\n    isLogin,\n    item.alpc?.consumeType,\n    item.variant?.availableForSale,\n    copy.btnRedeem,\n    copy.unlockRewards,\n    pageCommon?.soldOut,\n  ])\n\n  return (\n    <div\n      className={classNames(\n        'flex flex-col items-center rounded-[16px] bg-[#EAEAEC] p-[24px] md:rounded-[12px] md:px-[8px] xl:py-[16px] md-xl:px-[16px]',\n        !rounded && 'rounded-none md:rounded-none',\n        className\n      )}\n    >\n      {item.config?.type === ConsumeType.Product ? (\n        <div className={classNames('relative mx-auto h-[224px] w-fit md:my-[10px] l:h-[120px] l-xxl:h-[138px]')}>\n          <Picture\n            className=\"h-full w-auto [&_img]:h-full [&_img]:object-contain\"\n            source={item.config?.image?.url || item.product.images?.[0]?.url}\n          ></Picture>\n        </div>\n      ) : (\n        <div className=\"relative mx-auto my-[30px] h-[164px] md:my-0 md:h-[66px] l-xxl:h-[138px] md-l:h-[80px]\">\n          <Picture\n            source={pageCommon?.imageMapping?.[item.config?.type]?.url}\n            className=\"h-full [&_img]:h-full [&_img]:w-auto [&_img]:object-contain\"\n          ></Picture>\n\n          <NoneProductValue item={item} />\n        </div>\n      )}\n      <div className={classNames('mt-[22px] flex w-full flex-1 flex-col justify-between')}>\n        <Text\n          html={item.config?.title || item.alpc?.title}\n          title={item.config?.title || item.alpc?.title}\n          size={2}\n          className=\"line-clamp-2 h-[58px] text-[24px] leading-[1.2] l:h-[40px] l:text-[16px] l-xxl:h-[48px] l-xxl:text-[20px]\"\n        />\n        {item.config?.rules?.length > 0 && (\n          <button\n            type=\"button\"\n            onClick={() => {\n              onRulesOpen(item.config?.rules || [])\n              gaTrack({\n                event: 'ga4Event',\n                event_name: 'lp_button',\n                member_active_status: profile?.activated ? 'active' : 'not active',\n                event_parameters: {\n                  page_group: pageGroup,\n                  position: copy.title,\n                  button_name: pageCommon?.ruleLabel,\n                  info: item.alpc?.id?.toString(),\n                },\n              })\n            }}\n            className=\"mt-[8px] w-fit text-[16px] font-bold underline md:text-[14px] l:mt-0\"\n            tabIndex={0}\n            onKeyDown={e => {\n              if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault()\n              }\n            }}\n          >\n            {pageCommon?.ruleLabel}\n          </button>\n        )}\n        <div>\n          <div className=\"mt-[26px] flex items-center l:mt-[12px] l-xl:mt-[16px]\">\n            <Picture\n              className=\"size-[24px] l-xxl:size-[22px] md-l:size-[18px] md:size-[16px]\"\n              source=\"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/icon_hire_purchase.png?v=1757496783\"\n            />\n            <Text\n              html={`${numberFormat(item.alpc?.consumeCredits)}`}\n              size={2}\n              as=\"p\"\n              className=\"ml-[4px] text-[24px] font-bold mt-[4px] leading-none l-xxl:text-[20px] l:text-[16px] \"\n            />\n          </div>\n\n          <Button\n            disabled={isDisabled}\n            variant=\"primary\"\n            size=\"lg\"\n            className=\"mt-[8px] md:px-[8px] l:w-full\"\n            onClick={() => {\n              onRedeem(item)\n              gaTrack({\n                event: 'ga4Event',\n                event_name: 'lp_button',\n                member_active_status: profile?.activated ? 'active' : 'not active',\n                event_parameters: {\n                  page_group: pageGroup,\n                  position: copy.title,\n                  button_name: redeemButtonText,\n                  info: item.alpc?.id?.toString(),\n                },\n              })\n            }}\n          >\n            {redeemButtonText}\n          </Button>\n        </div>\n      </div>\n    </div>\n  )\n}\n"],
+  "mappings": "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",
   "names": ["jsx", "jsxs", "Button", "Text", "Picture", "useMemo", "classNames", "useCreditsContext", "AlpcConsumeType", "ConsumeType", "numberFormat", "gaTrack", "useHeadlessContext", "NoneProductValue", "ROUNDED_BRANDS", "RedeemableItem", "copy", "className", "item", "onRulesOpen", "onRedeem", "creditInfo", "profile", "pageGroup", "pageCommon", "brand", "isLogin", "rounded", "isDisabled", "redeemButtonText", "e"]
 }

package/dist/esm/components/credits/creditsWaysToGetCredits/CreditsWaysToGetCredits.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Fragment as X,jsx as t,jsxs as i}from"react/jsx-runtime";import{Button as z,Container as P,Heading as f,Picture as b,Text as I}from"@anker-in/headless-ui";import{ChevronDownIcon as G,ChevronUpIcon as W}from"@heroicons/react/24/outline";import{motion as _}from"framer-motion";import{useMemo as j,useState as a}from"react";import{TaskType as h}from"./type";import{useActions as q}from"./useActions";import{useCreditsContext as E}from"../context/provider";import{classNames as p,useHeadlessContext as H}from"@anker-in/lib";import{useRegistration as V}from"../../registration";import{CreditsUploadReceiptModal as J}from"../modal/creditsUploadReceiptModal";import{CreditsSubscribeModal as K}from"../modal/subscribeModal";import{ROUNDED_BRANDS as Q}from"../../../constants";const re=({copy:s,classNames:v,id:y})=>{const[l,g]=a(!1),{profile:D}=E(),{authCodeActivate:R}=V(),{brand:T}=H(),k=Q.includes(T),c=!!D,[U,C]=a(!1),[L,m]=a(!1),[N,M]=a(!1),[w,O]=a(!1),{actions:u}=q({copy:s,subscribe:{openSubscribePopup:()=>m(!0),isSuccess:N},uploadReceipt:{openUploadReceiptPopup:()=>C(!0),isSuccess:w}}),A=j(()=>{const e=s.list.map(n=>{if(!u[n.id])return;const{finished:o,notLogin:F,notFinished:x,completed:B}=u[n.id];let d="",r,S;return c?o?(d=B.buttonLabel,r=void 0):(d=x.buttonLabel,r=x.handleClick,S=x.link):(d=F.buttonLabel,r=F.handleClick),{...n,buttonLabel:d,handleClick:r,finished:o,link:S}}).filter(Boolean);return c?e.sort((n,o)=>n?.finished&&!o?.finished?1:!n?.finished&&o?.finished?-1:0):e},[u,s.list,c]);return i(P,{id:y,className:" bg-[#F5F5F7] [&>div]:l:!px-0",children:[i("div",{className:p("rounded-[16px] bg-[#1D1D1F] py-[64px] px-[140px] text-white md:px-[16px] l:rounded-none md-l:px-[32px] l-xl:px-[77px]",!k&&"rounded-none"),children:[t(f,{as:"h2",size:4,html:s?.title,className:"text-center l:pl-[16px] l:text-left"}),i("div",{className:"mt-[64px] flex items-center justify-between md:mt-[64px] l:mt-[24px] l:flex-col-reverse l:items-start md-l:mt-[32px]",children:[i("div",{className:"pl-[16px] l:mt-[40px] desktop:pl-[24px] lg-desktop:pl-[32px]",children:[t(f,{size:3,as:"h3",html:s.subtitle,className:v?.subtitle}),i("div",{className:"mt-[8px] flex items-center",children:[s.creditsIcon?.url&&t(b,{className:"size-[48px] mr-[8px] stroke-brand xl:size-[30px] [&_path]:stroke-brand",source:s.creditsIcon.url,alt:s.creditsIcon.alt||"credits"}),t(f,{html:s.equalCredits,size:4,as:"h3",className:p("mt-2 text-white md:text-[24px]",v?.equalCreditsText)})]})]}),t(b,{className:"w-full laptop:w-[50%]",source:s.mainImage?.url})]}),i("div",{className:"relative",children:[i(_.div,{className:p("relative mt-[64px] grid grid-cols-3 gap-[16px] overflow-hidden md:mt-[16px] md:grid-cols-1 l:gap-[12px]  min-md:!h-auto md-l:mt-[32px] md-l:grid-cols-2"),initial:{height:512},animate:{height:l?"auto":512},transition:{duration:.3},onAnimationComplete:()=>{if(!l&&window.screen.width<768){const e=document.getElementById("ways-to-get-credits");e&&e.scrollIntoView({behavior:"smooth",block:"end"})}},children:[A.map(e=>i("div",{className:p("flex min-h-[160px] flex-col justify-between rounded-[16px] bg-white p-[16px] text-[#1D1D1F] desktop:min-h-[192px] desktop:p-[24px] lg-desktop:min-h-[240px] lg-desktop:p-[32px]",!k&&"rounded-none"),children:[i("div",{children:[t(I,{as:"p",html:e.title,size:2,className:"text-pretty text-[24px] font-bold xl:text-[20px]"}),i("div",{className:"mt-[4px] flex items-center",children:[t(b,{className:"size-[24px] xl:size-[18px] [&_path]:size-full",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450"}),t(I,{as:"p",html:e.credits,size:2,className:"ml-[4px] mt-[6px] text-[18px] l:text-[14px]"})]})]}),e.handleClick&&!(e.id===h.UploadReceipt&&w)&&!(e.id===h.Activate&&R.isActivateSuccess)&&!(e.id===h.Subscribe&&N)?t(z,{as:e.link?"a":"button",...e.link&&{href:e.link},...e.handleClick&&{onClick:e.handleClick},variant:"primary",size:"lg",className:"mt-[24px] w-fit",children:e.buttonLabel}):t(z,{variant:"primary",size:"lg",className:"mt-[24px] w-fit",disabled:!0,children:e.buttonLabel})]},e.id)),!l&&t("div",{className:"absolute inset-0 pointer-events-none min-md:hidden",style:{background:"linear-gradient(180deg, rgba(29, 29, 31, 0) 66.37%, #1D1D1F 100%)"}})]}),l?t("button",{className:"mx-auto mt-[12px] block w-fit min-md:hidden",onClick:()=>{g(!1)},children:t(W,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})}):t(X,{children:t("div",{className:"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden",children:t("button",{className:"w-fit",onClick:()=>g(!l),children:t(G,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})})})})]})]}),s.receipt&&t(J,{isOpen:U,onClose:()=>{C(!1)},copy:s.receipt,onSuccess:()=>{O(!0)}}),s.subscribe&&t(K,{copy:s.subscribe,onSuccess:()=>{M(!0),setTimeout(()=>{m(!1)},3e3)},isOpen:L,onClose:()=>{m(!1)}})]})};export{re as CreditsWaysToGetCredits};
+import{Fragment as Z,jsx as t,jsxs as i}from"react/jsx-runtime";import{Button as z,Container as E,Heading as f,Picture as b,Text as I}from"@anker-in/headless-ui";import{ChevronDownIcon as W,ChevronUpIcon as G}from"@heroicons/react/24/outline";import{useEffect as H,useMemo as _,useRef as j,useState as a}from"react";import{TaskType as h}from"./type";import{useActions as q}from"./useActions";import{useCreditsContext as V}from"../context/provider";import{classNames as p,useHeadlessContext as J}from"@anker-in/lib";import{useRegistration as K}from"../../registration";import{CreditsUploadReceiptModal as Q}from"../modal/creditsUploadReceiptModal";import{CreditsSubscribeModal as X}from"../modal/subscribeModal";import{ROUNDED_BRANDS as Y}from"../../../constants";const pe=({copy:s,classNames:v,id:R})=>{const[l,g]=a(!1),T=j(null),{profile:y}=V(),{authCodeActivate:D}=K(),{brand:L}=J(),k=Y.includes(L),c=!!y,[M,C]=a(!1),[U,u]=a(!1),[N,O]=a(!1),[w,B]=a(!1),{actions:m}=q({copy:s,subscribe:{openSubscribePopup:()=>u(!0),isSuccess:N},uploadReceipt:{openUploadReceiptPopup:()=>C(!0),isSuccess:w}}),A=_(()=>{const e=(s.list||[]).map(n=>{if(!m[n.id])return;const{finished:o,notLogin:F,notFinished:x,completed:P}=m[n.id];let d="",r,S;return c?o?(d=P.buttonLabel,r=void 0):(d=x.buttonLabel,r=x.handleClick,S=x.link):(d=F.buttonLabel,r=F.handleClick),{...n,buttonLabel:d,handleClick:r,finished:o,link:S}}).filter(Boolean);return c?e.sort((n,o)=>n?.finished&&!o?.finished?1:!n?.finished&&o?.finished?-1:0):e},[m,s.list,c]);return H(()=>{if(!l&&window.innerWidth<768){const e=document.getElementById("ways-to-get-credits");if(e){const n=setTimeout(()=>{e.scrollIntoView({behavior:"smooth",block:"end"})},300);return()=>clearTimeout(n)}}},[l]),i(E,{id:R,className:" bg-[#F5F5F7] [&>div]:l:!px-0",children:[i("div",{className:p("rounded-[16px] bg-[#1D1D1F] py-[64px] px-[140px] text-white md:px-[16px] l:rounded-none md-l:px-[32px] l-xl:px-[77px]",!k&&"rounded-none"),children:[t(f,{as:"h2",size:4,html:s?.title,className:"text-center l:pl-[16px] l:text-left"}),i("div",{className:"mt-[64px] flex items-center justify-between md:mt-[64px] l:mt-[24px] l:flex-col-reverse l:items-start md-l:mt-[32px]",children:[i("div",{className:"pl-[16px] l:mt-[40px] desktop:pl-[24px] lg-desktop:pl-[32px]",children:[t(f,{size:3,as:"h3",html:s.subtitle,className:v?.subtitle}),i("div",{className:"mt-[8px] flex items-center",children:[s.creditsIcon?.url&&t(b,{className:"size-[48px] mr-[8px] stroke-brand xl:size-[30px] [&_path]:stroke-brand",source:s.creditsIcon.url,alt:s.creditsIcon.alt||"credits"}),t(f,{html:s.equalCredits,size:4,as:"h3",className:p("mt-2 text-white md:text-[24px]",v?.equalCreditsText)})]})]}),t(b,{className:"w-full laptop:w-[50%]",source:s.mainImage?.url})]}),i("div",{className:"relative",children:[i("div",{ref:T,className:p("relative mt-[64px] grid grid-cols-3 gap-[16px] overflow-hidden transition-all duration-300 md:mt-[16px] md:grid-cols-1 l:gap-[12px] md-l:mt-[32px] md-l:grid-cols-2",l?"min-md:!h-auto md:h-auto":"md:h-[512px] min-md:!h-auto"),children:[A.map(e=>i("div",{className:p("flex min-h-[160px] flex-col justify-between rounded-[16px] bg-white p-[16px] text-[#1D1D1F] desktop:min-h-[192px] desktop:p-[24px] lg-desktop:min-h-[240px] lg-desktop:p-[32px]",!k&&"rounded-none"),children:[i("div",{children:[t(I,{as:"p",html:e.title,size:2,className:"text-pretty text-[24px] font-bold xl:text-[20px]"}),i("div",{className:"mt-[4px] flex items-center",children:[t(b,{className:"size-[24px] xl:size-[18px] [&_path]:size-full",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450"}),t(I,{as:"p",html:e.credits,size:2,className:"ml-[4px] mt-[6px] text-[18px] l:text-[14px]"})]})]}),e.handleClick&&!(e.id===h.UploadReceipt&&w)&&!(e.id===h.Activate&&D.isActivateSuccess)&&!(e.id===h.Subscribe&&N)?t(z,{as:e.link?"a":"button",...e.link&&{href:e.link},...e.handleClick&&{onClick:e.handleClick},variant:"primary",size:"lg",className:"mt-[24px] w-fit",children:e.buttonLabel}):t(z,{variant:"primary",size:"lg",className:"mt-[24px] w-fit",disabled:!0,children:e.buttonLabel})]},e.id)),!l&&t("div",{className:"absolute inset-0 pointer-events-none min-md:hidden",style:{background:"linear-gradient(180deg, rgba(29, 29, 31, 0) 66.37%, #1D1D1F 100%)"}})]}),l?t("button",{className:"mx-auto mt-[12px] block w-fit min-md:hidden",onClick:()=>{g(!1)},children:t(G,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})}):t(Z,{children:t("div",{className:"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden",children:t("button",{className:"w-fit",onClick:()=>g(!l),children:t(W,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})})})})]})]}),s.receipt&&t(Q,{isOpen:M,onClose:()=>{C(!1)},copy:s.receipt,onSuccess:()=>{B(!0)}}),s.subscribe&&t(X,{copy:s.subscribe,onSuccess:()=>{O(!0),setTimeout(()=>{u(!1)},3e3)},isOpen:U,onClose:()=>{u(!1)}})]})};export{pe as CreditsWaysToGetCredits};
 //# sourceMappingURL=CreditsWaysToGetCredits.js.map

package/dist/esm/components/credits/creditsWaysToGetCredits/CreditsWaysToGetCredits.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsWaysToGetCredits/CreditsWaysToGetCredits.tsx"],
-  "sourcesContent": ["import { Button, Container, Heading, Picture, Text } from '@anker-in/headless-ui'\nimport { ChevronDownIcon, ChevronUpIcon } from '@heroicons/react/24/outline'\nimport { motion } from 'framer-motion'\nimport { useMemo, useState } from 'react'\n\nimport { TaskType, type CreditsWaysToGetCreditsProps } from './type'\nimport { useActions } from './useActions'\nimport { useCreditsContext } from '../context/provider'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useRegistration } from '../../registration'\nimport { CreditsUploadReceiptModal } from '../modal/creditsUploadReceiptModal'\nimport { CreditsSubscribeModal } from '../modal/subscribeModal'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nexport const CreditsWaysToGetCredits = ({ copy, classNames, id }: CreditsWaysToGetCreditsProps & { id?: string }) => {\n  const [showMore, setShowMore] = useState(false)\n  const { profile } = useCreditsContext()\n  const { authCodeActivate } = useRegistration()\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const isLogin = !!profile\n\n  const [isUploadReceiptModalOpen, setIsUploadReceiptModalOpen] = useState(false)\n  const [isSubscribeModalOpen, setIsSubscribeModalOpen] = useState(false)\n  const [isSubscribeSuccess, setIsSubscribeSuccess] = useState(false)\n  const [isUploadReceiptSuccess, setIsUploadReceiptSuccess] = useState(false)\n\n  const { actions } = useActions({\n    copy,\n    subscribe: {\n      openSubscribePopup: () => setIsSubscribeModalOpen(true),\n      isSuccess: isSubscribeSuccess,\n    },\n    uploadReceipt: {\n      openUploadReceiptPopup: () => setIsUploadReceiptModalOpen(true),\n      isSuccess: isUploadReceiptSuccess,\n    },\n  })\n  const list = useMemo(() => {\n    const list = copy.list\n      .map(item => {\n        if (!actions[item.id as keyof typeof actions]) {\n          return undefined\n        }\n        const { finished, notLogin, notFinished, completed } = actions[item.id as keyof typeof actions]\n        let buttonLabel = ''\n        let handleClick = undefined\n        let link = undefined\n        if (!isLogin) {\n          buttonLabel = notLogin.buttonLabel\n          handleClick = notLogin.handleClick\n        } else if (finished) {\n          buttonLabel = completed.buttonLabel\n          handleClick = undefined\n        } else {\n          buttonLabel = notFinished.buttonLabel\n          handleClick = notFinished.handleClick\n          link = (notFinished as { link: string }).link\n        }\n        return {\n          ...item,\n          buttonLabel,\n          handleClick,\n          finished,\n          link,\n        }\n      })\n      .filter(Boolean) as {\n      title: string\n      credits: string\n      id: TaskType\n      buttonLabel: string\n      finished: boolean\n      link: string\n      handleClick: (() => void) | undefined\n    }[]\n\n    // \u767B\u5F55\u540E\uFF0C\u4FDD\u7559\u539F\u987A\u5E8F\uFF0C\u5C06\u5DF2\u5B8C\u6210\u7684\u4EFB\u52A1\u653E\u5728\u6700\u540E\n    if (isLogin) {\n      return list.sort((a, b) => {\n        if (a?.finished && !b?.finished) {\n          return 1 // a\u5DF2\u5B8C\u6210\uFF0Cb\u672A\u5B8C\u6210\uFF0Ca\u6392\u5728\u540E\u9762\n        }\n        if (!a?.finished && b?.finished) {\n          return -1 // a\u672A\u5B8C\u6210\uFF0Cb\u5DF2\u5B8C\u6210\uFF0Ca\u6392\u5728\u524D\u9762\n        }\n        return 0 // \u90FD\u5DF2\u5B8C\u6210\u6216\u90FD\u672A\u5B8C\u6210\uFF0C\u4FDD\u6301\u539F\u987A\u5E8F\n      })\n    } else {\n      return list\n    }\n  }, [actions, copy.list, isLogin])\n\n  return (\n    <Container id={id} className=\" bg-[#F5F5F7] [&>div]:l:!px-0\">\n      <div\n        className={cn(\n          'rounded-[16px] bg-[#1D1D1F] py-[64px] px-[140px] text-white md:px-[16px] l:rounded-none md-l:px-[32px] l-xl:px-[77px]',\n          !rounded && 'rounded-none'\n        )}\n      >\n        <Heading as=\"h2\" size={4} html={copy?.title} className=\"text-center l:pl-[16px] l:text-left\" />\n        <div className=\"mt-[64px] flex items-center justify-between md:mt-[64px] l:mt-[24px] l:flex-col-reverse l:items-start md-l:mt-[32px]\">\n          <div className=\"pl-[16px] l:mt-[40px] desktop:pl-[24px] lg-desktop:pl-[32px]\">\n            <Heading size={3} as=\"h3\" html={copy.subtitle} className={classNames?.subtitle} />\n            <div className=\"mt-[8px] flex items-center\">\n              {copy.creditsIcon?.url && (\n                <Picture\n                  className=\"size-[48px] mr-[8px] stroke-brand xl:size-[30px] [&_path]:stroke-brand\"\n                  source={copy.creditsIcon.url}\n                  alt={copy.creditsIcon.alt || 'credits'}\n                />\n              )}\n              <Heading\n                html={copy.equalCredits}\n                size={4}\n                as=\"h3\"\n                className={cn('mt-2 text-white md:text-[24px]', classNames?.equalCreditsText)}\n              />\n            </div>\n          </div>\n          <Picture className=\"w-full laptop:w-[50%]\" source={copy.mainImage?.url} />\n        </div>\n\n        <div className=\"relative\">\n          <motion.div\n            className={cn(\n              'relative mt-[64px] grid grid-cols-3 gap-[16px] overflow-hidden md:mt-[16px] md:grid-cols-1 l:gap-[12px]  min-md:!h-auto md-l:mt-[32px] md-l:grid-cols-2'\n            )}\n            initial={{ height: 512 }}\n            animate={{ height: showMore ? 'auto' : 512 }}\n            transition={{ duration: 0.3 }}\n            onAnimationComplete={() => {\n              if (!showMore && window.screen.width < 768) {\n                const section = document.getElementById('ways-to-get-credits')\n                if (section) {\n                  section.scrollIntoView({ behavior: 'smooth', block: 'end' })\n                }\n              }\n            }}\n          >\n            {list.map(item => (\n              <div\n                key={item.id}\n                className={cn(\n                  'flex min-h-[160px] flex-col justify-between rounded-[16px] bg-white p-[16px] text-[#1D1D1F] desktop:min-h-[192px] desktop:p-[24px] lg-desktop:min-h-[240px] lg-desktop:p-[32px]',\n                  !rounded && 'rounded-none'\n                )}\n              >\n                <div>\n                  <Text\n                    as=\"p\"\n                    html={item.title}\n                    size={2}\n                    className=\"text-pretty text-[24px] font-bold xl:text-[20px]\"\n                  />\n                  <div className=\"mt-[4px] flex items-center\">\n                    <Picture\n                      className=\"size-[24px] xl:size-[18px] [&_path]:size-full\"\n                      source=\"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450\"\n                    />\n                    <Text\n                      as=\"p\"\n                      html={item.credits}\n                      size={2}\n                      className=\"ml-[4px] mt-[6px] text-[18px] l:text-[14px]\"\n                    />\n                  </div>\n                </div>\n\n                {item.handleClick &&\n                !(item.id === TaskType.UploadReceipt && isUploadReceiptSuccess) &&\n                !(item.id === TaskType.Activate && authCodeActivate.isActivateSuccess) &&\n                !(item.id === TaskType.Subscribe && isSubscribeSuccess) ? (\n                  <Button\n                    as={item.link ? 'a' : 'button'}\n                    {...(item.link && { href: item.link })}\n                    {...(item.handleClick && { onClick: item.handleClick })}\n                    variant=\"primary\"\n                    size=\"lg\"\n                    className=\"mt-[24px] w-fit\"\n                  >\n                    {item.buttonLabel}\n                  </Button>\n                ) : (\n                  <Button variant=\"primary\" size=\"lg\" className=\"mt-[24px] w-fit\" disabled>\n                    {item.buttonLabel}\n                  </Button>\n                )}\n              </div>\n            ))}\n            {!showMore && (\n              <div\n                className=\"absolute inset-0 pointer-events-none min-md:hidden\"\n                style={{ background: 'linear-gradient(180deg, rgba(29, 29, 31, 0) 66.37%, #1D1D1F 100%)' }}\n              ></div>\n            )}\n          </motion.div>\n          {showMore ? (\n            <button\n              className=\"mx-auto mt-[12px] block w-fit min-md:hidden\"\n              onClick={() => {\n                setShowMore(false)\n              }}\n            >\n              <ChevronUpIcon className=\"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]\"></ChevronUpIcon>\n            </button>\n          ) : (\n            <>\n              <div className=\"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden\">\n                <button className=\"w-fit\" onClick={() => setShowMore(!showMore)}>\n                  <ChevronDownIcon className=\"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]\"></ChevronDownIcon>\n                </button>\n              </div>\n            </>\n          )}\n        </div>\n      </div>\n      {copy.receipt && (\n        <CreditsUploadReceiptModal\n          isOpen={isUploadReceiptModalOpen}\n          onClose={() => {\n            setIsUploadReceiptModalOpen(false)\n          }}\n          copy={copy.receipt}\n          onSuccess={() => {\n            setIsUploadReceiptSuccess(true)\n          }}\n        />\n      )}\n      {copy.subscribe && (\n        <CreditsSubscribeModal\n          copy={copy.subscribe}\n          onSuccess={() => {\n            setIsSubscribeSuccess(true)\n            setTimeout(() => {\n              setIsSubscribeModalOpen(false)\n            }, 3000)\n          }}\n          isOpen={isSubscribeModalOpen}\n          onClose={() => {\n            setIsSubscribeModalOpen(false)\n          }}\n        />\n      )}\n    </Container>\n  )\n}\n"],
-  "mappings": "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",
-  "names": ["Fragment", "jsx", "jsxs", "Button", "Container", "Heading", "Picture", "Text", "ChevronDownIcon", "ChevronUpIcon", "motion", "useMemo", "useState", "TaskType", "useActions", "useCreditsContext", "cn", "useHeadlessContext", "useRegistration", "CreditsUploadReceiptModal", "CreditsSubscribeModal", "ROUNDED_BRANDS", "CreditsWaysToGetCredits", "copy", "classNames", "id", "showMore", "setShowMore", "profile", "authCodeActivate", "brand", "rounded", "isLogin", "isUploadReceiptModalOpen", "setIsUploadReceiptModalOpen", "isSubscribeModalOpen", "setIsSubscribeModalOpen", "isSubscribeSuccess", "setIsSubscribeSuccess", "isUploadReceiptSuccess", "setIsUploadReceiptSuccess", "actions", "list", "item", "finished", "notLogin", "notFinished", "completed", "buttonLabel", "handleClick", "link", "a", "b", "section"]
+  "sourcesContent": ["import { Button, Container, Heading, Picture, Text } from '@anker-in/headless-ui'\nimport { ChevronDownIcon, ChevronUpIcon } from '@heroicons/react/24/outline'\nimport { useEffect, useMemo, useRef, useState } from 'react'\n\nimport { TaskType, type CreditsWaysToGetCreditsProps } from './type'\nimport { useActions } from './useActions'\nimport { useCreditsContext } from '../context/provider'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useRegistration } from '../../registration'\nimport { CreditsUploadReceiptModal } from '../modal/creditsUploadReceiptModal'\nimport { CreditsSubscribeModal } from '../modal/subscribeModal'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nexport const CreditsWaysToGetCredits = ({ copy, classNames, id }: CreditsWaysToGetCreditsProps & { id?: string }) => {\n  const [showMore, setShowMore] = useState(false)\n  const containerRef = useRef<HTMLDivElement>(null)\n  const { profile } = useCreditsContext()\n  const { authCodeActivate } = useRegistration()\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const isLogin = !!profile\n\n  const [isUploadReceiptModalOpen, setIsUploadReceiptModalOpen] = useState(false)\n  const [isSubscribeModalOpen, setIsSubscribeModalOpen] = useState(false)\n  const [isSubscribeSuccess, setIsSubscribeSuccess] = useState(false)\n  const [isUploadReceiptSuccess, setIsUploadReceiptSuccess] = useState(false)\n\n  const { actions } = useActions({\n    copy,\n    subscribe: {\n      openSubscribePopup: () => setIsSubscribeModalOpen(true),\n      isSuccess: isSubscribeSuccess,\n    },\n    uploadReceipt: {\n      openUploadReceiptPopup: () => setIsUploadReceiptModalOpen(true),\n      isSuccess: isUploadReceiptSuccess,\n    },\n  })\n  const list = useMemo(() => {\n    const list = (copy.list || [])\n      .map(item => {\n        if (!actions[item.id as keyof typeof actions]) {\n          return undefined\n        }\n        const { finished, notLogin, notFinished, completed } = actions[item.id as keyof typeof actions]\n        let buttonLabel = ''\n        let handleClick = undefined\n        let link = undefined\n        if (!isLogin) {\n          buttonLabel = notLogin.buttonLabel\n          handleClick = notLogin.handleClick\n        } else if (finished) {\n          buttonLabel = completed.buttonLabel\n          handleClick = undefined\n        } else {\n          buttonLabel = notFinished.buttonLabel\n          handleClick = notFinished.handleClick\n          link = (notFinished as { link: string }).link\n        }\n        return {\n          ...item,\n          buttonLabel,\n          handleClick,\n          finished,\n          link,\n        }\n      })\n      .filter(Boolean) as {\n      title: string\n      credits: string\n      id: TaskType\n      buttonLabel: string\n      finished: boolean\n      link: string\n      handleClick: (() => void) | undefined\n    }[]\n\n    // \u767B\u5F55\u540E\uFF0C\u4FDD\u7559\u539F\u987A\u5E8F\uFF0C\u5C06\u5DF2\u5B8C\u6210\u7684\u4EFB\u52A1\u653E\u5728\u6700\u540E\n    if (isLogin) {\n      return list.sort((a, b) => {\n        if (a?.finished && !b?.finished) {\n          return 1 // a\u5DF2\u5B8C\u6210\uFF0Cb\u672A\u5B8C\u6210\uFF0Ca\u6392\u5728\u540E\u9762\n        }\n        if (!a?.finished && b?.finished) {\n          return -1 // a\u672A\u5B8C\u6210\uFF0Cb\u5DF2\u5B8C\u6210\uFF0Ca\u6392\u5728\u524D\u9762\n        }\n        return 0 // \u90FD\u5DF2\u5B8C\u6210\u6216\u90FD\u672A\u5B8C\u6210\uFF0C\u4FDD\u6301\u539F\u987A\u5E8F\n      })\n    } else {\n      return list\n    }\n  }, [actions, copy.list, isLogin])\n\n  useEffect(() => {\n    if (!showMore && window.innerWidth < 768) {\n      const section = document.getElementById('ways-to-get-credits')\n      if (section) {\n        const timer = setTimeout(() => {\n          section.scrollIntoView({ behavior: 'smooth', block: 'end' })\n        }, 300)\n        return () => clearTimeout(timer)\n      }\n    }\n  }, [showMore])\n\n  return (\n    <Container id={id} className=\" bg-[#F5F5F7] [&>div]:l:!px-0\">\n      <div\n        className={cn(\n          'rounded-[16px] bg-[#1D1D1F] py-[64px] px-[140px] text-white md:px-[16px] l:rounded-none md-l:px-[32px] l-xl:px-[77px]',\n          !rounded && 'rounded-none'\n        )}\n      >\n        <Heading as=\"h2\" size={4} html={copy?.title} className=\"text-center l:pl-[16px] l:text-left\" />\n        <div className=\"mt-[64px] flex items-center justify-between md:mt-[64px] l:mt-[24px] l:flex-col-reverse l:items-start md-l:mt-[32px]\">\n          <div className=\"pl-[16px] l:mt-[40px] desktop:pl-[24px] lg-desktop:pl-[32px]\">\n            <Heading size={3} as=\"h3\" html={copy.subtitle} className={classNames?.subtitle} />\n            <div className=\"mt-[8px] flex items-center\">\n              {copy.creditsIcon?.url && (\n                <Picture\n                  className=\"size-[48px] mr-[8px] stroke-brand xl:size-[30px] [&_path]:stroke-brand\"\n                  source={copy.creditsIcon.url}\n                  alt={copy.creditsIcon.alt || 'credits'}\n                />\n              )}\n              <Heading\n                html={copy.equalCredits}\n                size={4}\n                as=\"h3\"\n                className={cn('mt-2 text-white md:text-[24px]', classNames?.equalCreditsText)}\n              />\n            </div>\n          </div>\n          <Picture className=\"w-full laptop:w-[50%]\" source={copy.mainImage?.url} />\n        </div>\n\n        <div className=\"relative\">\n          <div\n            ref={containerRef}\n            className={cn(\n              'relative mt-[64px] grid grid-cols-3 gap-[16px] overflow-hidden transition-all duration-300 md:mt-[16px] md:grid-cols-1 l:gap-[12px] md-l:mt-[32px] md-l:grid-cols-2',\n              showMore ? 'min-md:!h-auto md:h-auto' : 'md:h-[512px] min-md:!h-auto'\n            )}\n          >\n            {list.map(item => (\n              <div\n                key={item.id}\n                className={cn(\n                  'flex min-h-[160px] flex-col justify-between rounded-[16px] bg-white p-[16px] text-[#1D1D1F] desktop:min-h-[192px] desktop:p-[24px] lg-desktop:min-h-[240px] lg-desktop:p-[32px]',\n                  !rounded && 'rounded-none'\n                )}\n              >\n                <div>\n                  <Text\n                    as=\"p\"\n                    html={item.title}\n                    size={2}\n                    className=\"text-pretty text-[24px] font-bold xl:text-[20px]\"\n                  />\n                  <div className=\"mt-[4px] flex items-center\">\n                    <Picture\n                      className=\"size-[24px] xl:size-[18px] [&_path]:size-full\"\n                      source=\"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450\"\n                    />\n                    <Text\n                      as=\"p\"\n                      html={item.credits}\n                      size={2}\n                      className=\"ml-[4px] mt-[6px] text-[18px] l:text-[14px]\"\n                    />\n                  </div>\n                </div>\n\n                {item.handleClick &&\n                !(item.id === TaskType.UploadReceipt && isUploadReceiptSuccess) &&\n                !(item.id === TaskType.Activate && authCodeActivate.isActivateSuccess) &&\n                !(item.id === TaskType.Subscribe && isSubscribeSuccess) ? (\n                  <Button\n                    as={item.link ? 'a' : 'button'}\n                    {...(item.link && { href: item.link })}\n                    {...(item.handleClick && { onClick: item.handleClick })}\n                    variant=\"primary\"\n                    size=\"lg\"\n                    className=\"mt-[24px] w-fit\"\n                  >\n                    {item.buttonLabel}\n                  </Button>\n                ) : (\n                  <Button variant=\"primary\" size=\"lg\" className=\"mt-[24px] w-fit\" disabled>\n                    {item.buttonLabel}\n                  </Button>\n                )}\n              </div>\n            ))}\n            {!showMore && (\n              <div\n                className=\"absolute inset-0 pointer-events-none min-md:hidden\"\n                style={{ background: 'linear-gradient(180deg, rgba(29, 29, 31, 0) 66.37%, #1D1D1F 100%)' }}\n              ></div>\n            )}\n          </div>\n          {showMore ? (\n            <button\n              className=\"mx-auto mt-[12px] block w-fit min-md:hidden\"\n              onClick={() => {\n                setShowMore(false)\n              }}\n            >\n              <ChevronUpIcon className=\"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]\"></ChevronUpIcon>\n            </button>\n          ) : (\n            <>\n              <div className=\"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden\">\n                <button className=\"w-fit\" onClick={() => setShowMore(!showMore)}>\n                  <ChevronDownIcon className=\"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]\"></ChevronDownIcon>\n                </button>\n              </div>\n            </>\n          )}\n        </div>\n      </div>\n      {copy.receipt && (\n        <CreditsUploadReceiptModal\n          isOpen={isUploadReceiptModalOpen}\n          onClose={() => {\n            setIsUploadReceiptModalOpen(false)\n          }}\n          copy={copy.receipt}\n          onSuccess={() => {\n            setIsUploadReceiptSuccess(true)\n          }}\n        />\n      )}\n      {copy.subscribe && (\n        <CreditsSubscribeModal\n          copy={copy.subscribe}\n          onSuccess={() => {\n            setIsSubscribeSuccess(true)\n            setTimeout(() => {\n              setIsSubscribeModalOpen(false)\n            }, 3000)\n          }}\n          isOpen={isSubscribeModalOpen}\n          onClose={() => {\n            setIsSubscribeModalOpen(false)\n          }}\n        />\n      )}\n    </Container>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "Button", "Container", "Heading", "Picture", "Text", "ChevronDownIcon", "ChevronUpIcon", "useEffect", "useMemo", "useRef", "useState", "TaskType", "useActions", "useCreditsContext", "cn", "useHeadlessContext", "useRegistration", "CreditsUploadReceiptModal", "CreditsSubscribeModal", "ROUNDED_BRANDS", "CreditsWaysToGetCredits", "copy", "classNames", "id", "showMore", "setShowMore", "containerRef", "profile", "authCodeActivate", "brand", "rounded", "isLogin", "isUploadReceiptModalOpen", "setIsUploadReceiptModalOpen", "isSubscribeModalOpen", "setIsSubscribeModalOpen", "isSubscribeSuccess", "setIsSubscribeSuccess", "isUploadReceiptSuccess", "setIsUploadReceiptSuccess", "actions", "list", "item", "finished", "notLogin", "notFinished", "completed", "buttonLabel", "handleClick", "link", "a", "b", "section", "timer"]
 }

package/dist/esm/templates/{credits.d.ts → Credits.d.ts} RENAMED Viewed

@@ -69,5 +69,19 @@ export type CreditsTemplateProps = {
     gtm: {
         pageGroup: string;
     };
+    cartConfig?: {
+        addToCart: (params: {
+            variantList: Array<{
+                variant: any;
+                quantity: number;
+                attributes?: Array<{
+                    key: string;
+                    value: string;
+                }>;
+            }>;
+            cartAttributes?: Record<string, string>;
+            discountCodes?: string[];
+        }) => void | Promise<any>;
+    };
 };
-export declare const CreditsTemplate: ({ headlessConfig, siteConfig, creditsConfig, userContext, pageConfig, registrationContext, gtm, }: CreditsTemplateProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CreditsTemplate: ({ headlessConfig, siteConfig, creditsConfig, userContext, pageConfig, registrationContext, gtm, cartConfig, }: CreditsTemplateProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/templates/Credits.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{Fragment as F,jsx as o,jsxs as p}from"react/jsx-runtime";import{classNames as f,HeadlessProvider as y}from"@anker-in/lib";import{RegistrationProvider as l}from"../components/registration/context/provider";import{CreditsProvider as g}from"../components/credits/context/provider";import{CreditsBanner as P}from"../components/credits/creditsBanner";import{CreditsInfoCard as T}from"../components/credits/creditsInfoCard";import{CreditsBenefits as v}from"../components/credits/creditsBenefits";import{CreditsWaysToGetCredits as u}from"../components/credits/creditsWaysToGetCredits";import{CreditsAnkersolixTask as b}from"../components/credits/creditsAnkersolixTask";import{CreditsRedeemList as h}from"../components/credits/creditsRedeemList";import{CreditsCash as A}from"../components/credits/creditsCash";import{CreditsMemberPrice as B}from"../components/credits/creditsMemberPrice";import{CreditsFaq as I}from"../components/credits/creditsFaq";import{CreditsNavigation as L}from"../components/credits/creditsNavigation";var K=(r=>(r.Navigation="creditsNavigation",r.Banner="creditsBanner",r.InfoCard="creditsInfoCard",r.Benefits="creditsBenefits",r.WaysToGetCredits="creditsWaysToGetCredits",r.AnkersolixTask="creditsAnkersolixTask",r.RedeemList="creditsRedeemList",r.SpendCreditsLikeCash="creditsCash",r.MemberPrice="creditsMemberPrice",r.Faqs="creditsFaq",r))(K\|\|{});const ae=({headlessConfig:a,siteConfig:n,creditsConfig:C,userContext:t,pageConfig:s,registrationContext:d,gtm:m,cartConfig:c})=>(console.log("siteConfig",n),o(y,{headlessConfig:a,children:o(l,{copy:n.registrationsSettings,email:t?.profile?.email,children:p(g,{profile:t?.profile,removeProfile:t?.removeProfile,isLoadingProfile:t?.isLoadingProfile,openSignInPopup:d.openSignInPopup,openSignUpPopup:d.openSignUpPopup,creditInfo:t?.creditInfo,taskIdToTypeMapping:n.taskIdToTypeMapping,customer:t?.customer,fetchCreditInfo:t?.fetchCreditInfo,customerLoading:t?.customerLoading,gtm:m,pageCommon:s.common,memberPriceDiscount:n.memberPriceDiscount,alpcBrand:C?.alpcBrand,cartConfig:c,children:[s.components.creditsNavigation&&o(L,{copy:s.components.creditsNavigation}),o("div",{className:f("bg-[#f5f5f7] leading-[1.2]"),children:s.order.map(e=>{if(e==="creditsNavigation")return null;const i=s.components?.[e];return i?p(F,{children:[e==="creditsBanner"&&o(P,{copy:i,id:e}),e==="creditsInfoCard"&&t?.profile&&o(T,{copy:i,id:e}),e==="creditsBenefits"&&o(v,{copy:i,id:e}),e==="creditsWaysToGetCredits"&&o(u,{copy:i,id:e,classNames:a.brand==="anker"?{subtitle:"text-white",equalCreditsText:"bg-gradient-to-r from-[#3AD1FF] to-[#008CD6] bg-clip-text text-transparent"}:{subtitle:"text-[#D1D1D1]",equalCreditsText:"text-[#F6EAD0]"}}),e==="creditsAnkersolixTask"&&o(b,{copy:i,id:e}),e==="creditsRedeemList"&&o(h,{copy:i,id:e}),e==="creditsCash"&&o(A,{copy:i,id:e}),e==="creditsMemberPrice"&&o(B,{copy:i,id:e}),e==="creditsFaq"&&o(I,{copy:i,id:e}),e!=="creditsBanner"&&o("div",{className:"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16"})]}):null})})]})})}));export{K as ComponentKey,ae as CreditsTemplate};
2	+ //# sourceMappingURL=Credits.js.map

package/dist/esm/templates/Credits.js.map ADDED Viewed

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/templates/Credits.tsx"],
+  "sourcesContent": ["import { classNames, HeadlessConfig, HeadlessProvider } from '@anker-in/lib'\nimport { RegistrationProvider } from '../components/registration/context/provider'\n\nimport { DTC_TASK_TYPE } from '../components/credits/context/const'\nimport { CreditsProvider } from '../components/credits/context/provider'\nimport { CreditsPageCommon } from '../components/credits/type'\nimport { FunctionMemberPriceConfig } from '../components/credits/context/memberPriceTypes'\n\nimport { CreditsBanner, CreditsBannerCopy } from '../components/credits/creditsBanner'\nimport { CreditsInfoCard, CreditsInfoCardCopy } from '../components/credits/creditsInfoCard'\nimport { CreditsBenefits, CreditsBenefitsCopy } from '../components/credits/creditsBenefits'\nimport { CreditsWaysToGetCredits, CreditsWaysToGetCreditsCopy } from '../components/credits/creditsWaysToGetCredits'\nimport { CreditsAnkersolixTask, CreditsAnkersolixTaskCopy } from '../components/credits/creditsAnkersolixTask'\nimport { CreditsRedeemList, CreditsRedeemListCopy } from '../components/credits/creditsRedeemList'\nimport { CreditsCash, CreditsCashCopy } from '../components/credits/creditsCash'\nimport { CreditsMemberPrice, CreditsMemberPriceCopy } from '../components/credits/creditsMemberPrice'\nimport { CreditsFaq, CreditsFaqCopy } from '../components/credits/creditsFaq'\nimport { CreditsNavigation, CreditsNavigationCopy } from '../components/credits/creditsNavigation'\nimport { AuthCodeActivateCopy } from 'src/components/registration/authCodeActivate/type'\n\nexport enum ComponentKey {\n  Navigation = 'creditsNavigation',\n  Banner = 'creditsBanner',\n  InfoCard = 'creditsInfoCard',\n  Benefits = 'creditsBenefits',\n  WaysToGetCredits = 'creditsWaysToGetCredits',\n  AnkersolixTask = 'creditsAnkersolixTask',\n  RedeemList = 'creditsRedeemList',\n  SpendCreditsLikeCash = 'creditsCash',\n  MemberPrice = 'creditsMemberPrice',\n  Faqs = 'creditsFaq',\n}\nexport type CreditsTemplateProps = {\n  headlessConfig: HeadlessConfig\n  siteConfig: {\n    registrationsSettings: {\n      authCodeActivate: AuthCodeActivateCopy\n    }\n    taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>\n    memberPriceDiscount?: FunctionMemberPriceConfig[]\n  }\n  creditsConfig?: {\n    alpcBrand?: string\n  }\n  pageConfig: {\n    order: ComponentKey[]\n    common: CreditsPageCommon\n    components: {\n      [ComponentKey.Navigation]?: CreditsNavigationCopy\n      [ComponentKey.Banner]?: CreditsBannerCopy\n      [ComponentKey.InfoCard]?: CreditsInfoCardCopy\n      [ComponentKey.Benefits]?: CreditsBenefitsCopy\n      [ComponentKey.WaysToGetCredits]?: CreditsWaysToGetCreditsCopy\n      [ComponentKey.AnkersolixTask]?: CreditsAnkersolixTaskCopy\n      [ComponentKey.RedeemList]?: CreditsRedeemListCopy\n      [ComponentKey.SpendCreditsLikeCash]?: CreditsCashCopy\n      [ComponentKey.MemberPrice]?: CreditsMemberPriceCopy\n      [ComponentKey.Faqs]?: CreditsFaqCopy\n    }\n  }\n  userContext: {\n    profile: any\n    removeProfile: () => void\n    isLoadingProfile: boolean\n    creditInfo: any\n    customer: any\n    customerLoading: boolean\n    fetchCreditInfo: () => void\n  }\n  registrationContext: {\n    openSignUpPopup: () => void\n    openSignInPopup: () => void\n  }\n  gtm: {\n    pageGroup: string\n  }\n  cartConfig?: {\n    addToCart: (params: {\n      variantList: Array<{\n        variant: any\n        quantity: number\n        attributes?: Array<{ key: string; value: string }>\n      }>\n      cartAttributes?: Record<string, string>\n      discountCodes?: string[]\n    }) => void | Promise<any>\n  }\n}\n\nexport const CreditsTemplate = ({\n  headlessConfig,\n  siteConfig,\n  creditsConfig,\n  userContext,\n  pageConfig,\n  registrationContext,\n  gtm,\n  cartConfig,\n}: CreditsTemplateProps) => {\n  console.log('siteConfig', siteConfig)\n  return (\n    <HeadlessProvider headlessConfig={headlessConfig}>\n      <RegistrationProvider copy={siteConfig.registrationsSettings} email={userContext?.profile?.email}>\n        <CreditsProvider\n          profile={userContext?.profile}\n          removeProfile={userContext?.removeProfile}\n          isLoadingProfile={userContext?.isLoadingProfile}\n          openSignInPopup={registrationContext.openSignInPopup}\n          openSignUpPopup={registrationContext.openSignUpPopup}\n          creditInfo={userContext?.creditInfo}\n          taskIdToTypeMapping={siteConfig.taskIdToTypeMapping}\n          customer={userContext?.customer}\n          fetchCreditInfo={userContext?.fetchCreditInfo}\n          customerLoading={userContext?.customerLoading}\n          gtm={gtm}\n          pageCommon={pageConfig.common}\n          memberPriceDiscount={siteConfig.memberPriceDiscount}\n          alpcBrand={creditsConfig?.alpcBrand}\n          cartConfig={cartConfig}\n        >\n          {/* \u5BFC\u822A\u7EC4\u4EF6 - \u56FA\u5B9A\u4F4D\u7F6E\uFF0C\u4E0D\u53C2\u4E0E order \u6392\u5E8F */}\n          {pageConfig.components[ComponentKey.Navigation] && (\n            <CreditsNavigation copy={pageConfig.components[ComponentKey.Navigation]} />\n          )}\n          <div className={classNames('bg-[#f5f5f7] leading-[1.2]')}>\n            {pageConfig.order.map(key => {\n              // \u8DF3\u8FC7\u5BFC\u822A\u7EC4\u4EF6\uFF0C\u56E0\u4E3A\u5B83\u5DF2\u7ECF\u56FA\u5B9A\u6E32\u67D3\u5728\u4E0A\u65B9\n              if (key === ComponentKey.Navigation) return null\n              const componentCopy = pageConfig.components?.[key]\n              if (!componentCopy) return null\n              return (\n                <>\n                  {key === ComponentKey.Banner && <CreditsBanner copy={componentCopy as CreditsBannerCopy} id={key} />}\n                  {key === ComponentKey.InfoCard && userContext?.profile && (\n                    <CreditsInfoCard copy={componentCopy as CreditsInfoCardCopy} id={key} />\n                  )}\n                  {key === ComponentKey.Benefits && (\n                    <CreditsBenefits copy={componentCopy as CreditsBenefitsCopy} id={key} />\n                  )}\n                  {key === ComponentKey.WaysToGetCredits && (\n                    <CreditsWaysToGetCredits\n                      copy={componentCopy as CreditsWaysToGetCreditsCopy}\n                      id={key}\n                      classNames={\n                        headlessConfig.brand === 'anker'\n                          ? {\n                              subtitle: 'text-white',\n                              equalCreditsText:\n                                'bg-gradient-to-r from-[#3AD1FF] to-[#008CD6] bg-clip-text text-transparent',\n                            }\n                          : {\n                              subtitle: 'text-[#D1D1D1]',\n                              equalCreditsText: 'text-[#F6EAD0]',\n                            }\n                      }\n                    />\n                  )}\n                  {key === ComponentKey.AnkersolixTask && (\n                    <CreditsAnkersolixTask copy={componentCopy as CreditsAnkersolixTaskCopy} id={key} />\n                  )}\n                  {key === ComponentKey.RedeemList && (\n                    <CreditsRedeemList copy={componentCopy as CreditsRedeemListCopy} id={key} />\n                  )}\n                  {key === ComponentKey.SpendCreditsLikeCash && (\n                    <CreditsCash copy={componentCopy as CreditsCashCopy} id={key} />\n                  )}\n                  {key === ComponentKey.MemberPrice && (\n                    <CreditsMemberPrice copy={componentCopy as CreditsMemberPriceCopy} id={key} />\n                  )}\n                  {key === ComponentKey.Faqs && <CreditsFaq copy={componentCopy as CreditsFaqCopy} id={key} />}\n                  {key !== ComponentKey.Banner && (\n                    <div className=\"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16\" />\n                  )}\n                </>\n              )\n            })}\n          </div>\n        </CreditsProvider>\n      </RegistrationProvider>\n    </HeadlessProvider>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "classNames", "HeadlessProvider", "RegistrationProvider", "CreditsProvider", "CreditsBanner", "CreditsInfoCard", "CreditsBenefits", "CreditsWaysToGetCredits", "CreditsAnkersolixTask", "CreditsRedeemList", "CreditsCash", "CreditsMemberPrice", "CreditsFaq", "CreditsNavigation", "ComponentKey", "CreditsTemplate", "headlessConfig", "siteConfig", "creditsConfig", "userContext", "pageConfig", "registrationContext", "gtm", "cartConfig", "key", "componentCopy"]
+}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@anker-in/campaign-ui",
-  "version": "0.2.11-beta.3",
+  "version": "0.2.11-beta.4",
   "description": "Campaign UI components and utilities for Anker projects",
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",

package/src/components/credits/context/memberPriceConst.ts CHANGED Viewed

@@ -4,10 +4,3 @@ export enum FunctionDiscountType {
   FixedAmount,
   FixedPrice,
 }
-// 小数位取舍方式
-export enum RoundSelected {
-  RoundHighest = 'round_highest',
-  RoundLowest = 'round_lowest',
-  RoundNearest = 'round_nearest',
-}