@anker-in/headless-ui 1.1.56 → 1.1.57

package/dist/cjs/biz-components/ImageOverlayShelf/ProductCard.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ImageOverlayShelf/ProductCard.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\n\nimport Badge from '../../components/badge.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ProductCardProps, ButtonFunctionType, ImageObjectPosition } from './types.js'\n\n/**\n * \u56FE\u7247\u88C1\u5207\u4F4D\u7F6E\u6620\u5C04\n */\nconst objectPositionClassMap: Record<ImageObjectPosition, string> = {\n  center: 'object-center',\n  top: 'object-top',\n  bottom: 'object-bottom',\n  left: 'object-left',\n  right: 'object-right',\n  'top-left': 'object-left-top',\n  'top-right': 'object-right-top',\n  'bottom-left': 'object-left-bottom',\n  'bottom-right': 'object-right-bottom',\n}\n\n/**\n * ProductCard - ImageOverlayShelf \u7684\u5355\u4E2A\u4EA7\u54C1\u5361\u7247\n * \u56FE\u6587\u53E0\u52A0\u6837\u5F0F\uFF0C\u80CC\u666F\u56FE\u5B8C\u5168\u8986\u76D6\u5361\u7247\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n  (\n    {\n      product,\n      className,\n      showTags = true,\n      showOriginalPrice = true,\n      onLearnMore,\n      onShopNow,\n      onAddToCart,\n      onProductImageClick,\n      classNames,\n      secondaryButtonText,\n      secondaryButtonFun,\n      primaryButtonText,\n      primaryButtonFun,\n      copy,\n    },\n    ref\n  ) => {\n    const [primaryLoading, setPrimaryLoading] = React.useState(false)\n    const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n    const isSoldOut = !product.availableForSale\n\n    // \u6839\u636E\u6309\u94AE\u529F\u80FD\u7C7B\u578B\u8C03\u7528\u76F8\u5E94\u7684\u56DE\u8C03\u51FD\u6570\n    const handleButtonClick = async (buttonFun?: ButtonFunctionType, buttonType?: 'primary' | 'secondary') => {\n      if (!buttonFun) return\n\n      const setLoading = buttonType === 'primary' ? setPrimaryLoading : setSecondaryLoading\n      setLoading(true)\n\n      try {\n        switch (buttonFun) {\n          case 'buyNow':\n            await onShopNow?.(product)\n            break\n          case 'addCart':\n            await onAddToCart?.(product)\n            break\n          case 'learnMore':\n            await onLearnMore?.(product)\n            break\n          default:\n            break\n        }\n      } finally {\n        setLoading(false)\n      }\n    }\n\n    const displayTitle = product.custom_name || product.name\n    const displayDescription = product.custom_description || product.description\n    const theme = product.custom_theme ?? 'dark'\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'rounded-box relative box-border w-full cursor-pointer overflow-hidden duration-300',\n          'desktop:h-[384px] lg-desktop:h-[480px] h-[360px]',\n          'min-w-[296px] max-w-[824px]',\n          {\n            'aiui-dark': theme === 'dark',\n          },\n          className,\n          classNames?.productCard\n        )}\n      >\n        <div className=\"box-border flex h-full flex-col justify-between overflow-hidden\">\n          {/* \u80CC\u666F\u56FE */}\n          <a\n            onClick={() => onProductImageClick?.(product)}\n            {...(!onProductImageClick &&\n              product.listingLink && {\n                href: product.listingLink,\n              })}\n            rel=\"noreferrer\"\n            className={cn('absolute inset-0', classNames?.productImage)}\n          >\n            <Picture\n              alt={product.name}\n              source={product.custom_image ?? product.image}\n              className={cn(\n                'rounded-box h-full overflow-hidden object-cover transition-all duration-300 [&_img]:size-full'\n              )}\n              imgClassName={cn('object-cover', objectPositionClassMap[product.imageObjectPosition ?? 'center'])}\n            />\n          </a>\n          {/* \u5185\u5BB9\u533A\u57DF */}\n          <div\n            className={cn(\n              'desktop:p-6 collection-shelves-product-content pointer-events-none z-10 box-border flex flex-1 flex-col justify-end overflow-hidden p-4',\n              classNames?.productContent\n            )}\n          >\n            {/* \u6807\u7B7E */}\n            {showTags && product.tags?.length ? (\n              <div className={cn('mb-2 box-border flex flex-wrap gap-1 overflow-visible', classNames?.tagsContainer)}>\n                {product.tags.map((tag: any, index: number) =>\n                  (tag as any).label ? (\n                    <Badge\n                      key={index}\n                      size=\"sm\"\n                      variant={(tag.variant as any) || 'outline'}\n                      promotionalType={tag.promotionalType}\n                    >\n                      {tag.label}\n                    </Badge>\n                  ) : (\n                    React.isValidElement(tag) && <React.Fragment key={index}>123</React.Fragment>\n                  )\n                )}\n              </div>\n            ) : null}\n\n            {/* \u4EA7\u54C1\u6807\u9898 */}\n            {displayTitle ? (\n              <Heading\n                as=\"h3\"\n                title={displayTitle}\n                html={displayTitle}\n                className={cn(\n                  'lg-desktop:text-2xl lg-desktop:leading-7 tablet:text-xl text-info-primary tablet:leading-6 line-clamp-2 text-base font-bold',\n                  classNames?.productTitle\n                )}\n              />\n            ) : null}\n\n            {/* \u4EA7\u54C1\u63CF\u8FF0 */}\n            {displayDescription ? (\n              <Text\n                size={2}\n                html={displayDescription}\n                className={cn(\n                  'lg-desktop:text-lg desktop:text-base text-info-primary line-clamp-1 text-sm font-bold',\n                  classNames?.productDescription\n                )}\n              />\n            ) : null}\n\n            {/* \u4EF7\u683C\u533A\u57DF */}\n            <div className={cn('mb-1 mt-4 flex items-center', classNames?.priceContainer)}>\n              {isSoldOut ? (\n                <div className={cn('tablet:text-2xl text-info-primary text-xl font-bold', classNames?.productPrice)}>\n                  {copy?.outOfStockLabel ?? 'Sold Out'}\n                </div>\n              ) : (\n                <>\n                  <div className={cn('tablet:text-2xl text-info-primary text-xl font-bold', classNames?.productPrice)}>\n                    {product.price}\n                  </div>\n                  {showOriginalPrice && product.originalPrice && (\n                    <div\n                      className={cn(\n                        'tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through',\n                        classNames?.originalPrice\n                      )}\n                    >\n                      {product.originalPrice}\n                    </div>\n                  )}\n                </>\n              )}\n            </div>\n\n            {/* \u6309\u94AE\u533A\u57DF */}\n            <div\n              className={cn('lg-desktop:gap-3 pointer-events-auto flex items-center gap-2', classNames?.buttonGroup)}\n            >\n              {secondaryButtonText && (\n                <Button\n                  variant=\"secondary\"\n                  onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n                  disabled={isSoldOut && secondaryButtonFun !== 'learnMore'}\n                  loading={secondaryLoading}\n                  className={cn(classNames?.secondaryButton)}\n                >\n                  {secondaryButtonText}\n                </Button>\n              )}\n              {primaryButtonText && (\n                <Button\n                  variant=\"primary\"\n                  onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n                  disabled={isSoldOut && primaryButtonFun !== 'learnMore'}\n                  loading={primaryLoading}\n                  className={cn(classNames?.primaryButton)}\n                >\n                  {primaryButtonText}\n                </Button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    )\n  }\n)\n\nProductCard.displayName = 'ImageOverlayShelf.ProductCard'\n\nexport { ProductCard }\nexport default ProductCard\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\n\nimport Badge from '../../components/badge.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ProductCardProps, ButtonFunctionType, ImageObjectPosition } from './types.js'\n\n/**\n * \u56FE\u7247\u88C1\u5207\u4F4D\u7F6E\u6620\u5C04\n */\nconst objectPositionClassMap: Record<ImageObjectPosition, string> = {\n  center: 'object-center',\n  top: 'object-top',\n  bottom: 'object-bottom',\n  left: 'object-left',\n  right: 'object-right',\n  'top-left': 'object-left-top',\n  'top-right': 'object-right-top',\n  'bottom-left': 'object-left-bottom',\n  'bottom-right': 'object-right-bottom',\n}\n\n/**\n * ProductCard - ImageOverlayShelf \u7684\u5355\u4E2A\u4EA7\u54C1\u5361\u7247\n * \u56FE\u6587\u53E0\u52A0\u6837\u5F0F\uFF0C\u80CC\u666F\u56FE\u5B8C\u5168\u8986\u76D6\u5361\u7247\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n  (\n    {\n      product,\n      className,\n      showTags = true,\n      showOriginalPrice = true,\n      onLearnMore,\n      onShopNow,\n      onAddToCart,\n      onProductImageClick,\n      classNames,\n      secondaryButtonText,\n      secondaryButtonFun,\n      primaryButtonText,\n      primaryButtonFun,\n      copy,\n    },\n    ref\n  ) => {\n    const [primaryLoading, setPrimaryLoading] = React.useState(false)\n    const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n    const isSoldOut = !product.availableForSale\n\n    // \u6839\u636E\u6309\u94AE\u529F\u80FD\u7C7B\u578B\u8C03\u7528\u76F8\u5E94\u7684\u56DE\u8C03\u51FD\u6570\n    const handleButtonClick = async (buttonFun?: ButtonFunctionType, buttonType?: 'primary' | 'secondary') => {\n      if (!buttonFun) return\n\n      const setLoading = buttonType === 'primary' ? setPrimaryLoading : setSecondaryLoading\n      setLoading(true)\n\n      try {\n        switch (buttonFun) {\n          case 'buyNow':\n            await onShopNow?.(product)\n            break\n          case 'addCart':\n            await onAddToCart?.(product)\n            break\n          case 'learnMore':\n            await onLearnMore?.(product)\n            break\n          default:\n            break\n        }\n      } finally {\n        setLoading(false)\n      }\n    }\n\n    const displayTitle = product.custom_name || product.name\n    const displayDescription = product.custom_description || product.description\n    const theme = product.custom_theme ?? 'dark'\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'rounded-box relative box-border w-full cursor-pointer overflow-hidden duration-300',\n          'desktop:h-[384px] lg-desktop:h-[480px] h-[360px]',\n          'tablet:min-w-[auto] min-w-[296px] max-w-[824px]',\n          {\n            'aiui-dark': theme === 'dark',\n          },\n          className,\n          classNames?.productCard\n        )}\n      >\n        <div className=\"box-border flex h-full flex-col justify-between overflow-hidden\">\n          {/* \u80CC\u666F\u56FE */}\n          <a\n            onClick={() => onProductImageClick?.(product)}\n            {...(!onProductImageClick &&\n              product.listingLink && {\n                href: product.listingLink,\n              })}\n            rel=\"noreferrer\"\n            className={cn('absolute inset-0', classNames?.productImage)}\n          >\n            <Picture\n              alt={product.name}\n              source={product.custom_image ?? product.image}\n              className={cn(\n                'rounded-box h-full overflow-hidden object-cover transition-all duration-300 [&_img]:size-full'\n              )}\n              imgClassName={cn('object-cover', objectPositionClassMap[product.imageObjectPosition ?? 'center'])}\n            />\n          </a>\n          {/* \u5185\u5BB9\u533A\u57DF */}\n          <div\n            className={cn(\n              'desktop:p-6 collection-shelves-product-content pointer-events-none z-10 box-border flex flex-1 flex-col justify-end overflow-hidden p-4',\n              classNames?.productContent\n            )}\n          >\n            {/* \u6807\u7B7E */}\n            {showTags && product.tags?.length ? (\n              <div className={cn('mb-2 box-border flex flex-wrap gap-1 overflow-visible', classNames?.tagsContainer)}>\n                {product.tags.map((tag: any, index: number) =>\n                  (tag as any).label ? (\n                    <Badge\n                      key={index}\n                      size=\"sm\"\n                      variant={(tag.variant as any) || 'outline'}\n                      promotionalType={tag.promotionalType}\n                    >\n                      {tag.label}\n                    </Badge>\n                  ) : (\n                    React.isValidElement(tag) && <React.Fragment key={index}>123</React.Fragment>\n                  )\n                )}\n              </div>\n            ) : null}\n\n            {/* \u4EA7\u54C1\u6807\u9898 */}\n            {displayTitle ? (\n              <Heading\n                as=\"h3\"\n                title={displayTitle}\n                html={displayTitle}\n                className={cn(\n                  'lg-desktop:text-2xl lg-desktop:leading-7 tablet:text-xl text-info-primary tablet:leading-6 line-clamp-2 text-base font-bold',\n                  classNames?.productTitle\n                )}\n              />\n            ) : null}\n\n            {/* \u4EA7\u54C1\u63CF\u8FF0 */}\n            {displayDescription ? (\n              <Text\n                size={2}\n                html={displayDescription}\n                className={cn(\n                  'lg-desktop:text-lg desktop:text-base text-info-primary line-clamp-1 text-sm font-bold',\n                  classNames?.productDescription\n                )}\n              />\n            ) : null}\n\n            {/* \u4EF7\u683C\u533A\u57DF */}\n            <div className={cn('mb-1 mt-4 flex items-center', classNames?.priceContainer)}>\n              {isSoldOut ? (\n                <div className={cn('tablet:text-2xl text-info-primary text-xl font-bold', classNames?.productPrice)}>\n                  {copy?.outOfStockLabel ?? 'Sold Out'}\n                </div>\n              ) : (\n                <>\n                  <div className={cn('tablet:text-2xl text-info-primary text-xl font-bold', classNames?.productPrice)}>\n                    {product.price}\n                  </div>\n                  {showOriginalPrice && product.originalPrice && (\n                    <div\n                      className={cn(\n                        'tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through',\n                        classNames?.originalPrice\n                      )}\n                    >\n                      {product.originalPrice}\n                    </div>\n                  )}\n                </>\n              )}\n            </div>\n\n            {/* \u6309\u94AE\u533A\u57DF */}\n            <div\n              className={cn('lg-desktop:gap-3 pointer-events-auto flex items-center gap-2', classNames?.buttonGroup)}\n            >\n              {secondaryButtonText && (\n                <Button\n                  variant=\"secondary\"\n                  onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n                  disabled={isSoldOut && secondaryButtonFun !== 'learnMore'}\n                  loading={secondaryLoading}\n                  className={cn(classNames?.secondaryButton)}\n                >\n                  {secondaryButtonText}\n                </Button>\n              )}\n              {primaryButtonText && (\n                <Button\n                  variant=\"primary\"\n                  onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n                  disabled={isSoldOut && primaryButtonFun !== 'learnMore'}\n                  loading={primaryLoading}\n                  className={cn(classNames?.primaryButton)}\n                >\n                  {primaryButtonText}\n                </Button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    )\n  }\n)\n\nProductCard.displayName = 'ImageOverlayShelf.ProductCard'\n\nexport { ProductCard }\nexport default ProductCard\n"],
+  "mappings": "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",
   "names": ["ProductCard_exports", "__export", "ProductCard", "ProductCard_default", "__toCommonJS", "import_jsx_runtime", "React", "import_utils", "import_badge", "import_text", "import_button", "import_picture", "import_heading", "objectPositionClassMap", "product", "className", "showTags", "showOriginalPrice", "onLearnMore", "onShopNow", "onAddToCart", "onProductImageClick", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "copy", "ref", "primaryLoading", "setPrimaryLoading", "secondaryLoading", "setSecondaryLoading", "isSoldOut", "handleButtonClick", "buttonFun", "buttonType", "setLoading", "displayTitle", "displayDescription", "theme", "Picture", "tag", "index", "Badge", "Button"]
 }

package/dist/cjs/biz-components/MediaPlayerBase/index.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var be=Object.create;var H=Object.defineProperty;var we=Object.getOwnPropertyDescriptor;var He=Object.getOwnPropertyNames;var Te=Object.getPrototypeOf,ke=Object.prototype.hasOwnProperty;var Me=(r,n)=>{for(var o in n)H(r,o,{get:n[o],enumerable:!0})},Q=(r,n,o,a)=>{if(n&&typeof n=="object"||typeof n=="function")for(let s of He(n))!ke.call(r,s)&&s!==o&&H(r,s,{get:()=>n[s],enumerable:!(a=we(n,s))||a.enumerable});return r};var W=(r,n,o)=>(o=r!=null?be(Te(r)):{},Q(n||!r||!r.__esModule?H(o,"default",{value:r,enumerable:!0}):o,r)),Le=r=>Q(H({},"__esModule",{value:!0}),r);var Ee={};Me(Ee,{default:()=>ze});module.exports=Le(Ee);var t=require("react/jsx-runtime"),e=require("react"),A=require("lodash"),f=require("../../helpers/utils.js"),ee=require("../../shared/Styles.js"),te=W(require("../../components/button.js")),re=require("../VideoModal/index.js"),E=require("@payloadcms/richtext-lexical/html"),oe=require("react-intersection-observer"),ne=require("../../hooks/useExposure.js"),I=W(require("../../helpers/ScrollLoadVideo.js")),T=require("gsap"),se=require("gsap/dist/SplitText"),P=require("gsap/dist/ScrollTrigger");const Ne="media_player_base",Re="video",X=({defaultConverters:r})=>({...r,text:n=>{const{node:o}=n;return o.$&&o.$.color?`<span class="lexical-${o.$.color}">${o.text}</span>`:o.text}}),Z=(0,e.forwardRef)(({className:r="",id:n,onBtnClick:o,data:{title:a,videoTitle:s,btnText:_,youtubeId:S,video:V,mobileVideo:le,theme:$,img:B,shape:C,titleAnimation:v,...ie}},ae)=>{const{sticky:p}=ie,[D,F]=(0,e.useState)(!1),[j,ce]=(0,e.useState)(0),[de,pe]=(0,e.useState)(0),[x,ue]=(0,e.useState)(0),[U,Y]=(0,e.useState)(!1),y=(0,e.useRef)(null),q=(0,e.useRef)(null),l=(0,e.useRef)(null),h=(0,e.useRef)(null),O=(0,e.useRef)(null),b=(0,e.useRef)(null),k=(0,e.useRef)(null),M=(0,e.useRef)(null),{ref:me,inView:c}=(0,oe.useInView)();(0,e.useImperativeHandle)(ae,()=>l.current);const w=typeof a=="string"?a:a&&(0,E.convertLexicalToHTML)({data:a,converters:X}),L=typeof s=="string"?s:s&&(0,E.convertLexicalToHTML)({data:s,converters:X});(0,e.useEffect)(()=>{c?(y.current?.play(),F(!0)):(y.current?.pause(),F(!1))},[c]);const N=(0,A.debounce)(()=>{if(l.current){const u=l.current.getBoundingClientRect(),d=window.innerHeight,m=window.scrollY||window.pageYOffset,i=u.bottom+m,g=document.documentElement.scrollHeight-i;ce(g>d?d:g)}if(l.current){const u=l.current.clientHeight,d=window.innerHeight;pe(u+d)}},600);(0,e.useEffect)(()=>(N(),window.addEventListener("resize",N),()=>{window.removeEventListener("resize",N)}),[]),(0,e.useEffect)(()=>{function u(){if(!h.current||v!=="fade-in")return;const m=h.current?.clientHeight||80;b.current=new se.SplitText(h.current,{type:"words",wordsClass:"word"});const i=b.current.words;T.gsap.set(i,{opacity:0}),k.current=P.ScrollTrigger.create({trigger:l.current,start:"top center-=10%",end:`top+=${m*1.5+80}px center-=10%`,scrub:!0,onUpdate:G=>{const g=G.progress,J=i.length,fe=1/J,K=.5;i.forEach((ve,xe)=>{const ye=xe/J*(1-K),he=fe*(1+K);let z=(g-ye)/he;z=Math.max(0,Math.min(z,1)),T.gsap.set(ve,{opacity:z})}),T.gsap.set(q.current,{opacity:g})}})}function d(){M.current=P.ScrollTrigger.create({trigger:l.current,start:"bottom bottom",end:"bottom top",scrub:!0,onUpdate:m=>{const i=m.progress;console.log("progress__",i),ue(i)}})}return c&&(u(),d()),()=>{b.current&&b.current.revert(),k.current&&k.current.kill(),M.current&&M.current.kill()}},[v,c]),(0,ne.useExposure)(O,{componentType:Re,componentName:Ne,componentTitle:L});const ge=(0,e.useMemo)(()=>c&&x>0&&x<.9?3:c?2:1,[x,c]),R="lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] laptop:aspect-w-[1024] laptop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]";return(0,t.jsxs)(t.Fragment,{children:[p&&(0,t.jsx)("div",{ref:l,className:(0,f.cn)("relative z-10",R,{"aiui-dark":$==="dark","rounded-box":C==="rounded"},r),children:(0,t.jsx)("div",{ref:me,children:!v&&(0,t.jsxs)("div",{className:"media-content absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center",children:[w&&!D&&(0,t.jsx)("div",{className:"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:w}}),L&&D&&(0,t.jsx)("div",{className:"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:L}}),_&&(0,t.jsx)(te.default,{variant:"link",className:(0,f.cn)("member-equity-button-secondary text-btn-primary-foreground"),onClick:()=>{Y(!0),o&&o?.()},children:_})]})})}),(0,t.jsxs)("div",{style:p?{marginBottom:`-${j}px`,marginTop:`-${de}px`,zIndex:ge}:{},className:"relative",children:[(0,t.jsx)("div",{className:"sticky top-0 ",children:(0,t.jsxs)("div",{id:n,className:(0,f.cn)("relative overflow-hidden",p?"h-screen w-full":R,{"aiui-dark":$==="dark","rounded-box":C==="rounded"}),children:[v==="fade-in"&&w&&(0,t.jsx)("div",{ref:h,className:"lg-desktop:text-[64px] text-btn-primary-foreground absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:w}}),(0,t.jsxs)("div",{className:"media-cover left-0 top-0 h-screen w-screen overflow-hidden",style:{height:`${102-x*100}vh`},children:[(0,t.jsx)(I.default,{videoRef:y,poster:B?.url||"",src:V?.url,className:"tablet:block hidden size-full min-h-screen",videoClassName:"object-cover",muted:!0,loop:!0,playsInline:!0,autoplay:!0,"webkit-playsinline":!0,"x5-playsinline":!0}),(0,t.jsx)(I.default,{videoRef:y,poster:B?.url||"",src:le?.url||V?.url,className:"tablet:hidden block size-full min-h-screen",videoClassName:"object-cover",muted:!0,loop:!0,playsInline:!0,autoplay:!0,"webkit-playsinline":!0,"x5-playsinline":!0}),(0,t.jsx)("div",{ref:q,className:"absolute left-0 top-0 z-10 size-full opacity-0",style:{background:"rgba(0, 0, 0, 0.2)"}})]})]})}),(0,t.jsx)("div",{className:(0,f.cn)(p&&"relative box-content block",R),style:p?{height:`${j}px`}:{},ref:O})]}),U&&S&&(0,t.jsx)(re.VideoModal,{visible:U,youTubeId:S,onCloseModal:()=>Y(!1)})]})});Z.displayName="MediaPlayerBase";var ze=(0,ee.withLayout)(Z);
+"use strict";"use client";var be=Object.create;var H=Object.defineProperty;var we=Object.getOwnPropertyDescriptor;var He=Object.getOwnPropertyNames;var Te=Object.getPrototypeOf,ke=Object.prototype.hasOwnProperty;var Me=(r,n)=>{for(var o in n)H(r,o,{get:n[o],enumerable:!0})},Q=(r,n,o,a)=>{if(n&&typeof n=="object"||typeof n=="function")for(let s of He(n))!ke.call(r,s)&&s!==o&&H(r,s,{get:()=>n[s],enumerable:!(a=we(n,s))||a.enumerable});return r};var W=(r,n,o)=>(o=r!=null?be(Te(r)):{},Q(n||!r||!r.__esModule?H(o,"default",{value:r,enumerable:!0}):o,r)),Le=r=>Q(H({},"__esModule",{value:!0}),r);var Ee={};Me(Ee,{default:()=>ze});module.exports=Le(Ee);var t=require("react/jsx-runtime"),e=require("react"),A=require("lodash"),f=require("../../helpers/utils.js"),ee=require("../../shared/Styles.js"),te=W(require("../../components/button.js")),re=require("../VideoModal/index.js"),E=require("@payloadcms/richtext-lexical/html"),oe=require("react-intersection-observer"),ne=require("../../hooks/useExposure.js"),I=W(require("../../helpers/ScrollLoadVideo.js")),T=require("gsap"),se=require("gsap/dist/SplitText"),P=require("gsap/dist/ScrollTrigger");const Ne="media_player_base",Re="video",X=({defaultConverters:r})=>({...r,text:n=>{const{node:o}=n;return o.$&&o.$.color?`<span class="lexical-${o.$.color}">${o.text}</span>`:o.text}}),Z=(0,e.forwardRef)(({className:r="",id:n,onBtnClick:o,data:{title:a,videoTitle:s,btnText:_,youtubeId:S,video:V,mobileVideo:le,theme:$,img:B,shape:C,titleAnimation:v,...ie}},ae)=>{const{sticky:d}=ie,[D,F]=(0,e.useState)(!1),[j,ce]=(0,e.useState)(0),[de,pe]=(0,e.useState)(0),[x,ue]=(0,e.useState)(0),[U,Y]=(0,e.useState)(!1),y=(0,e.useRef)(null),q=(0,e.useRef)(null),l=(0,e.useRef)(null),h=(0,e.useRef)(null),O=(0,e.useRef)(null),b=(0,e.useRef)(null),k=(0,e.useRef)(null),M=(0,e.useRef)(null),{ref:me,inView:c}=(0,oe.useInView)();(0,e.useImperativeHandle)(ae,()=>l.current);const w=typeof a=="string"?a:a&&(0,E.convertLexicalToHTML)({data:a,converters:X}),L=typeof s=="string"?s:s&&(0,E.convertLexicalToHTML)({data:s,converters:X});(0,e.useEffect)(()=>{c?(y.current?.play(),F(!0)):(y.current?.pause(),F(!1))},[c]);const N=(0,A.debounce)(()=>{if(l.current){const u=l.current.getBoundingClientRect(),p=window.innerHeight,m=window.scrollY||window.pageYOffset,i=u.bottom+m,g=document.documentElement.scrollHeight-i;ce(g>p?p:g)}if(l.current){const u=l.current.clientHeight,p=window.innerHeight;pe(u+p)}},600);(0,e.useEffect)(()=>(N(),window.addEventListener("resize",N),()=>{window.removeEventListener("resize",N)}),[]),(0,e.useEffect)(()=>{function u(){if(!h.current||v!=="fade-in")return;const m=h.current?.clientHeight||80;b.current=new se.SplitText(h.current,{type:"words",wordsClass:"word"});const i=b.current.words;T.gsap.set(i,{opacity:0}),k.current=P.ScrollTrigger.create({trigger:l.current,start:"top center-=10%",end:`top+=${m*1.5+80}px center-=10%`,scrub:!0,onUpdate:G=>{const g=G.progress,J=i.length,fe=1/J,K=.5;i.forEach((ve,xe)=>{const ye=xe/J*(1-K),he=fe*(1+K);let z=(g-ye)/he;z=Math.max(0,Math.min(z,1)),T.gsap.set(ve,{opacity:z})}),T.gsap.set(q.current,{opacity:g})}})}function p(){M.current=P.ScrollTrigger.create({trigger:l.current,start:"bottom bottom",end:"bottom top",scrub:!0,onUpdate:m=>{const i=m.progress;console.log("progress__",i),ue(i)}})}return c&&(u(),p()),()=>{b.current&&b.current.revert(),k.current&&k.current.kill(),M.current&&M.current.kill()}},[v,c]),(0,ne.useExposure)(O,{componentType:Re,componentName:Ne,componentTitle:L});const ge=(0,e.useMemo)(()=>c&&x>0&&x<.9?3:c?2:1,[x,c]),R="lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] laptop:aspect-w-[1024] laptop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]";return(0,t.jsxs)(t.Fragment,{children:[d&&(0,t.jsx)("div",{ref:l,className:(0,f.cn)("relative z-10",R,{"aiui-dark":$==="dark","rounded-box":C==="rounded"},r),children:(0,t.jsx)("div",{ref:me,children:!v&&(0,t.jsxs)("div",{className:"media-content absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center",children:[w&&!D&&(0,t.jsx)("div",{className:"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:w}}),L&&D&&(0,t.jsx)("div",{className:"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:L}}),_&&(0,t.jsx)(te.default,{variant:"link",className:(0,f.cn)("member-equity-button-secondary text-btn-primary-foreground"),onClick:()=>{Y(!0),o&&o?.()},children:_})]})})}),(0,t.jsxs)("div",{style:d?{marginBottom:`-${j}px`,marginTop:`-${de}px`,zIndex:ge}:{},className:"relative",children:[(0,t.jsx)("div",{className:"sticky top-0 ",children:(0,t.jsxs)("div",{id:n,className:(0,f.cn)("relative overflow-hidden",d?"h-screen w-full":R,{"aiui-dark":$==="dark","rounded-box":C==="rounded"}),children:[v==="fade-in"&&w&&(0,t.jsx)("div",{ref:h,className:"lg-desktop:text-[64px] text-btn-primary-foreground absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:w}}),(0,t.jsxs)("div",{className:"media-cover left-0 top-0 h-screen w-screen overflow-hidden",style:{height:`${102-x*100}vh`},children:[(0,t.jsx)(I.default,{videoRef:y,poster:B?.url||"",src:V?.url,className:"tablet:block hidden size-full min-h-screen",videoClassName:"object-cover",muted:!0,loop:!0,playsInline:!0,autoplay:!0,"webkit-playsinline":!0,"x5-playsinline":!0}),(0,t.jsx)(I.default,{videoRef:y,poster:B?.url||"",src:le?.url||V?.url,className:"tablet:hidden block size-full min-h-screen",videoClassName:"object-cover",muted:!0,loop:!0,playsInline:!0,autoplay:!0,"webkit-playsinline":!0,"x5-playsinline":!0}),(0,t.jsx)("div",{ref:q,className:"absolute left-0 top-0 z-10 size-full opacity-0",style:{background:"rgba(0, 0, 0, 0.2)"}})]})]})}),d&&(0,t.jsx)("div",{className:(0,f.cn)(d&&"relative box-content block",R),style:d?{height:`${j}px`}:{},ref:O})]}),U&&S&&(0,t.jsx)(re.VideoModal,{visible:U,youTubeId:S,onCloseModal:()=>Y(!1)})]})});Z.displayName="MediaPlayerBase";var ze=(0,ee.withLayout)(Z);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/MediaPlayerBase/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerBase/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { useState, useRef, useMemo, useEffect, forwardRef, useImperativeHandle } from 'react'\nimport { debounce } from 'lodash'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Button from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerBaseProps } from './types.js'\n// import { Right } from './right.js'\nimport { useInView } from 'react-intersection-observer'\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\n\nconst componentName = 'media_player_base'\nconst componentType = 'video'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\nconst MediaPlayerBase = forwardRef<HTMLDivElement, MediaPlayerBaseProps>(\n  (\n    {\n      className = '',\n      id,\n      onBtnClick,\n      data: { title, videoTitle, btnText, youtubeId, video, mobileVideo, theme, img, shape, titleAnimation, ...rest },\n    },\n    ref\n  ) => {\n    const { sticky } = rest\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [btb, setbtb] = useState(0)\n    const [titleHeight, setTitleHeight] = useState(0)\n    const [videoHeightProgress, setVideoHeightProgress] = useState(0)\n    const [visible, setVisible] = useState<boolean>(false)\n\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const bgRef = useRef<HTMLImageElement>(null)\n    const titleRef = useRef<HTMLDivElement>(null)\n    const titleFadeInRef = useRef<HTMLDivElement>(null)\n    const trackRef = useRef<HTMLDivElement>(null)\n    const splitTextInstance = useRef<SplitText | null>(null)\n    const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n    const heightTriggerRef = useRef<ScrollTrigger | null>(null)\n    const { ref: inViewRef, inView } = useInView()\n\n    useImperativeHandle(ref, () => titleRef.current as HTMLDivElement)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    const videoTitle_html =\n      typeof videoTitle === 'string'\n        ? videoTitle\n        : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    useEffect(() => {\n      if (inView) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      } else {\n        videoRef.current?.pause()\n        setIsPlaying(false)\n      }\n    }, [inView])\n\n    const debouncedHandleResize = debounce(() => {\n      if (titleRef.current) {\n        const rect = titleRef.current.getBoundingClientRect()\n        const screenHeight = window.innerHeight\n        const scrollTop = window.scrollY || window.pageYOffset\n        const elementBottomToPageTop = rect.bottom + scrollTop\n        const pageHeight = document.documentElement.scrollHeight\n        const distanceToPageBottom = pageHeight - elementBottomToPageTop\n        setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n      }\n      if (titleRef.current) {\n        const titleHeight = titleRef.current.clientHeight\n        const screenHeight = window.innerHeight\n        setTitleHeight(titleHeight + screenHeight)\n      }\n    }, 600)\n\n    useEffect(() => {\n      debouncedHandleResize()\n      window.addEventListener('resize', debouncedHandleResize)\n      return () => {\n        window.removeEventListener('resize', debouncedHandleResize)\n      }\n    }, [])\n\n    useEffect(() => {\n      function gsapResize() {\n        if (!titleFadeInRef.current || titleAnimation !== 'fade-in') return\n        const height = titleFadeInRef.current?.clientHeight || 80\n        splitTextInstance.current = new SplitText(titleFadeInRef.current, {\n          type: 'words',\n          wordsClass: 'word',\n        })\n        const words = splitTextInstance.current.words\n        gsap.set(words, { opacity: 0 })\n        scrollTriggerRef.current = ScrollTrigger.create({\n          trigger: titleRef.current,\n          start: 'top center-=10%',\n          end: `top+=${height * 1.5 + 80}px center-=10%`,\n          scrub: true,\n          onUpdate: (self: any) => {\n            const progress = self.progress\n            const total = words.length\n            const interval = 1 / total\n            const overlap = 0.5\n            words.forEach((word: any, i: number) => {\n              const start = (i / total) * (1 - overlap)\n              const width = interval * (1 + overlap)\n              let opacity = (progress - start) / width\n              opacity = Math.max(0, Math.min(opacity, 1))\n              gsap.set(word, { opacity })\n            })\n            gsap.set(bgRef.current, { opacity: progress })\n          },\n        })\n      }\n\n      function gsapVideoHeightResize() {\n        heightTriggerRef.current = ScrollTrigger.create({\n          trigger: titleRef.current,\n          start: 'bottom bottom',\n          end: `bottom top`,\n          // markers: true,\n          scrub: true,\n          onUpdate: (self: any) => {\n            const progress = self.progress\n            console.log('progress__', progress)\n            setVideoHeightProgress(progress)\n          },\n        })\n      }\n\n      if (inView) {\n        gsapResize()\n        gsapVideoHeightResize()\n      }\n\n      return () => {\n        splitTextInstance.current && splitTextInstance.current.revert()\n        // ScrollTrigger.getAll().forEach((t: { kill: () => any }) => t.kill())\n        scrollTriggerRef.current && scrollTriggerRef.current.kill()\n        heightTriggerRef.current && heightTriggerRef.current.kill()\n      }\n    }, [titleAnimation, inView])\n\n    useExposure(trackRef, {\n      componentType,\n      componentName,\n      componentTitle: videoTitle_html,\n    })\n\n    const zIndexVideo = useMemo(() => {\n      if (inView && videoHeightProgress > 0 && videoHeightProgress < 0.9) return 3\n      if (inView) return 2\n      return 1\n    }, [videoHeightProgress, inView])\n\n    const aspect =\n      'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] laptop:aspect-w-[1024] laptop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]'\n    return (\n      <>\n        {sticky && (\n          <div\n            ref={titleRef}\n            className={cn(\n              'relative z-10',\n              aspect,\n              {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              },\n              className\n            )}\n          >\n            <div ref={inViewRef}>\n              {!titleAnimation && (\n                <div className=\"media-content absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                  {title_html && !isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: title_html }}\n                    />\n                  )}\n                  {videoTitle_html && isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                    />\n                  )}\n                  {btnText && (\n                    <Button\n                      variant=\"link\"\n                      className={cn('member-equity-button-secondary text-btn-primary-foreground')}\n                      onClick={() => {\n                        setVisible(true)\n                        // if (isPlaying) {\n                        //   if (videoRef.current) {\n                        //     videoRef.current.pause()\n                        //   }\n                        //   setIsPlaying(false)\n                        // } else {\n                        //   if (videoRef.current) {\n                        //     videoRef.current.play()\n                        //   }\n                        //   setIsPlaying(true)\n                        // }\n                        onBtnClick && onBtnClick?.()\n                      }}\n                    >\n                      {btnText}\n                      {/* <Right /> */}\n                    </Button>\n                  )}\n                </div>\n              )}\n            </div>\n          </div>\n        )}\n        <div\n          style={\n            sticky\n              ? {\n                  marginBottom: `-${btb}px`,\n                  marginTop: `-${titleHeight}px`,\n                  zIndex: zIndexVideo,\n                }\n              : {}\n          }\n          className=\"relative\"\n        >\n          <div className=\"sticky top-0 \">\n            <div\n              id={id}\n              className={cn('relative overflow-hidden', sticky ? 'h-screen w-full' : aspect, {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              })}\n            >\n              {titleAnimation === 'fade-in' && title_html && (\n                <div\n                  ref={titleFadeInRef}\n                  className=\"lg-desktop:text-[64px] text-btn-primary-foreground absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                  dangerouslySetInnerHTML={{ __html: title_html }}\n                />\n              )}\n              <div\n                className=\"media-cover left-0 top-0 h-screen w-screen overflow-hidden\"\n                style={{ height: `${102 - videoHeightProgress * 100}vh` }}\n              >\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={video?.url!}\n                  className=\"tablet:block hidden size-full min-h-screen\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={mobileVideo?.url || video?.url!}\n                  className=\"tablet:hidden block size-full min-h-screen\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <div\n                  ref={bgRef}\n                  className=\"absolute left-0 top-0 z-10 size-full opacity-0\"\n                  style={{\n                    background: 'rgba(0, 0, 0, 0.2)',\n                  }}\n                />\n              </div>\n            </div>\n          </div>\n          <div\n            className={cn(sticky && 'relative box-content block', aspect)}\n            style={sticky ? { height: `${btb}px` } : {}}\n            ref={trackRef}\n          />\n        </div>\n        {visible && youtubeId && (\n          <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n        )}\n      </>\n    )\n  }\n)\n\nMediaPlayerBase.displayName = 'MediaPlayerBase'\n\nexport default withLayout(MediaPlayerBase)\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport { useState, useRef, useMemo, useEffect, forwardRef, useImperativeHandle } from 'react'\nimport { debounce } from 'lodash'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Button from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerBaseProps } from './types.js'\n// import { Right } from './right.js'\nimport { useInView } from 'react-intersection-observer'\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\n\nconst componentName = 'media_player_base'\nconst componentType = 'video'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\nconst MediaPlayerBase = forwardRef<HTMLDivElement, MediaPlayerBaseProps>(\n  (\n    {\n      className = '',\n      id,\n      onBtnClick,\n      data: { title, videoTitle, btnText, youtubeId, video, mobileVideo, theme, img, shape, titleAnimation, ...rest },\n    },\n    ref\n  ) => {\n    const { sticky } = rest\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [btb, setbtb] = useState(0)\n    const [titleHeight, setTitleHeight] = useState(0)\n    const [videoHeightProgress, setVideoHeightProgress] = useState(0)\n    const [visible, setVisible] = useState<boolean>(false)\n\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const bgRef = useRef<HTMLImageElement>(null)\n    const titleRef = useRef<HTMLDivElement>(null)\n    const titleFadeInRef = useRef<HTMLDivElement>(null)\n    const trackRef = useRef<HTMLDivElement>(null)\n    const splitTextInstance = useRef<SplitText | null>(null)\n    const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n    const heightTriggerRef = useRef<ScrollTrigger | null>(null)\n    const { ref: inViewRef, inView } = useInView()\n\n    useImperativeHandle(ref, () => titleRef.current as HTMLDivElement)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    const videoTitle_html =\n      typeof videoTitle === 'string'\n        ? videoTitle\n        : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    useEffect(() => {\n      if (inView) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      } else {\n        videoRef.current?.pause()\n        setIsPlaying(false)\n      }\n    }, [inView])\n\n    const debouncedHandleResize = debounce(() => {\n      if (titleRef.current) {\n        const rect = titleRef.current.getBoundingClientRect()\n        const screenHeight = window.innerHeight\n        const scrollTop = window.scrollY || window.pageYOffset\n        const elementBottomToPageTop = rect.bottom + scrollTop\n        const pageHeight = document.documentElement.scrollHeight\n        const distanceToPageBottom = pageHeight - elementBottomToPageTop\n        setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n      }\n      if (titleRef.current) {\n        const titleHeight = titleRef.current.clientHeight\n        const screenHeight = window.innerHeight\n        setTitleHeight(titleHeight + screenHeight)\n      }\n    }, 600)\n\n    useEffect(() => {\n      debouncedHandleResize()\n      window.addEventListener('resize', debouncedHandleResize)\n      return () => {\n        window.removeEventListener('resize', debouncedHandleResize)\n      }\n    }, [])\n\n    useEffect(() => {\n      function gsapResize() {\n        if (!titleFadeInRef.current || titleAnimation !== 'fade-in') return\n        const height = titleFadeInRef.current?.clientHeight || 80\n        splitTextInstance.current = new SplitText(titleFadeInRef.current, {\n          type: 'words',\n          wordsClass: 'word',\n        })\n        const words = splitTextInstance.current.words\n        gsap.set(words, { opacity: 0 })\n        scrollTriggerRef.current = ScrollTrigger.create({\n          trigger: titleRef.current,\n          start: 'top center-=10%',\n          end: `top+=${height * 1.5 + 80}px center-=10%`,\n          scrub: true,\n          onUpdate: (self: any) => {\n            const progress = self.progress\n            const total = words.length\n            const interval = 1 / total\n            const overlap = 0.5\n            words.forEach((word: any, i: number) => {\n              const start = (i / total) * (1 - overlap)\n              const width = interval * (1 + overlap)\n              let opacity = (progress - start) / width\n              opacity = Math.max(0, Math.min(opacity, 1))\n              gsap.set(word, { opacity })\n            })\n            gsap.set(bgRef.current, { opacity: progress })\n          },\n        })\n      }\n\n      function gsapVideoHeightResize() {\n        heightTriggerRef.current = ScrollTrigger.create({\n          trigger: titleRef.current,\n          start: 'bottom bottom',\n          end: `bottom top`,\n          // markers: true,\n          scrub: true,\n          onUpdate: (self: any) => {\n            const progress = self.progress\n            console.log('progress__', progress)\n            setVideoHeightProgress(progress)\n          },\n        })\n      }\n\n      if (inView) {\n        gsapResize()\n        gsapVideoHeightResize()\n      }\n\n      return () => {\n        splitTextInstance.current && splitTextInstance.current.revert()\n        // ScrollTrigger.getAll().forEach((t: { kill: () => any }) => t.kill())\n        scrollTriggerRef.current && scrollTriggerRef.current.kill()\n        heightTriggerRef.current && heightTriggerRef.current.kill()\n      }\n    }, [titleAnimation, inView])\n\n    useExposure(trackRef, {\n      componentType,\n      componentName,\n      componentTitle: videoTitle_html,\n    })\n\n    const zIndexVideo = useMemo(() => {\n      if (inView && videoHeightProgress > 0 && videoHeightProgress < 0.9) return 3\n      if (inView) return 2\n      return 1\n    }, [videoHeightProgress, inView])\n\n    const aspect =\n      'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] laptop:aspect-w-[1024] laptop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]'\n    return (\n      <>\n        {sticky && (\n          <div\n            ref={titleRef}\n            className={cn(\n              'relative z-10',\n              aspect,\n              {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              },\n              className\n            )}\n          >\n            <div ref={inViewRef}>\n              {!titleAnimation && (\n                <div className=\"media-content absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                  {title_html && !isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: title_html }}\n                    />\n                  )}\n                  {videoTitle_html && isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                    />\n                  )}\n                  {btnText && (\n                    <Button\n                      variant=\"link\"\n                      className={cn('member-equity-button-secondary text-btn-primary-foreground')}\n                      onClick={() => {\n                        setVisible(true)\n                        // if (isPlaying) {\n                        //   if (videoRef.current) {\n                        //     videoRef.current.pause()\n                        //   }\n                        //   setIsPlaying(false)\n                        // } else {\n                        //   if (videoRef.current) {\n                        //     videoRef.current.play()\n                        //   }\n                        //   setIsPlaying(true)\n                        // }\n                        onBtnClick && onBtnClick?.()\n                      }}\n                    >\n                      {btnText}\n                      {/* <Right /> */}\n                    </Button>\n                  )}\n                </div>\n              )}\n            </div>\n          </div>\n        )}\n        <div\n          style={\n            sticky\n              ? {\n                  marginBottom: `-${btb}px`,\n                  marginTop: `-${titleHeight}px`,\n                  zIndex: zIndexVideo,\n                }\n              : {}\n          }\n          className=\"relative\"\n        >\n          <div className=\"sticky top-0 \">\n            <div\n              id={id}\n              className={cn('relative overflow-hidden', sticky ? 'h-screen w-full' : aspect, {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              })}\n            >\n              {titleAnimation === 'fade-in' && title_html && (\n                <div\n                  ref={titleFadeInRef}\n                  className=\"lg-desktop:text-[64px] text-btn-primary-foreground absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                  dangerouslySetInnerHTML={{ __html: title_html }}\n                />\n              )}\n              <div\n                className=\"media-cover left-0 top-0 h-screen w-screen overflow-hidden\"\n                style={{ height: `${102 - videoHeightProgress * 100}vh` }}\n              >\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={video?.url!}\n                  className=\"tablet:block hidden size-full min-h-screen\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={mobileVideo?.url || video?.url!}\n                  className=\"tablet:hidden block size-full min-h-screen\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <div\n                  ref={bgRef}\n                  className=\"absolute left-0 top-0 z-10 size-full opacity-0\"\n                  style={{\n                    background: 'rgba(0, 0, 0, 0.2)',\n                  }}\n                />\n              </div>\n            </div>\n          </div>\n          {sticky && (\n            <div\n              className={cn(sticky && 'relative box-content block', aspect)}\n              style={sticky ? { height: `${btb}px` } : {}}\n              ref={trackRef}\n            />\n          )}\n        </div>\n        {visible && youtubeId && (\n          <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n        )}\n      </>\n    )\n  }\n)\n\nMediaPlayerBase.displayName = 'MediaPlayerBase'\n\nexport default withLayout(MediaPlayerBase)\n"],
+  "mappings": "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",
   "names": ["MediaPlayerBase_exports", "__export", "MediaPlayerBase_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_lodash", "import_utils", "import_Styles", "import_button", "import_VideoModal", "import_html", "import_react_intersection_observer", "import_useExposure", "import_ScrollLoadVideo", "import_gsap", "import_SplitText", "import_ScrollTrigger", "componentName", "componentType", "htmlConverters", "defaultConverters", "args", "node", "MediaPlayerBase", "className", "id", "onBtnClick", "title", "videoTitle", "btnText", "youtubeId", "video", "mobileVideo", "theme", "img", "shape", "titleAnimation", "rest", "ref", "sticky", "isPlaying", "setIsPlaying", "btb", "setbtb", "titleHeight", "setTitleHeight", "videoHeightProgress", "setVideoHeightProgress", "visible", "setVisible", "videoRef", "bgRef", "titleRef", "titleFadeInRef", "trackRef", "splitTextInstance", "scrollTriggerRef", "heightTriggerRef", "inViewRef", "inView", "title_html", "videoTitle_html", "debouncedHandleResize", "rect", "screenHeight", "scrollTop", "elementBottomToPageTop", "distanceToPageBottom", "gsapResize", "height", "words", "self", "progress", "total", "interval", "overlap", "word", "i", "start", "width", "opacity", "gsapVideoHeightResize", "zIndexVideo", "aspect", "Button", "ScrollLoadVideo"]
 }

package/dist/cjs/biz-components/MediaShelf/ProductCard.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var z=Object.create;var f=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var _=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var E=(e,i)=>{for(var r in i)f(e,r,{get:i[r],enumerable:!0})},h=(e,i,r,d)=>{if(i&&typeof i=="object"||typeof i=="function")for(let s of I(i))!q.call(e,s)&&s!==r&&f(e,s,{get:()=>i[s],enumerable:!(d=A(i,s))||d.enumerable});return e};var H=(e,i,r)=>(r=e!=null?z(_(e)):{},h(i||!e||!e.__esModule?f(r,"default",{value:e,enumerable:!0}):r,e)),R=e=>h(f({},"__esModule",{value:!0}),e);var K={};E(K,{ProductCard:()=>u,default:()=>j});module.exports=R(K);var a=require("react/jsx-runtime"),c=H(require("react")),n=require("../../helpers/index.js"),t=require("../../components/index.js");const O=5;function G(e,i,r,d){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return i===void 0?!0:r<=i;case"below-percentage":return i===void 0?!0:r/d*100<=i;default:return!0}}const u=c.forwardRef(({product:e,className:i,stockDisplayMode:r,stockThresholdValue:d,onLearnMore:s,onShopNow:k,onAddToCart:w,classNames:l,secondaryButtonText:y,secondaryButtonFun:b,primaryButtonText:v,primaryButtonFun:g,showOriginalPrice:N,copy:p,onProductImageClick:x},P)=>{const[B,F]=c.useState(!1),[L,M]=c.useState(!1),T=c.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?O:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),C=async(o,m)=>{if(!o)return;const S=m==="primary"?F:M;S(!0);try{switch(o){case"buyNow":await k?.(e);break;case"addCart":await w?.(e);break;case"learnMore":await s?.(e);break;default:break}}finally{S(!1)}},D=e.availableForSale&&e.quantityAvailable<=0;return(0,a.jsxs)(t.Card,{ref:P,className:(0,n.cn)("flex h-full min-w-[296px] flex-col overflow-hidden",e.custom_link?"cursor-pointer":"",i,l?.productCard),children:[(0,a.jsxs)("div",{className:(0,n.cn)("media-shelf-product-card-image-wrapper desktop:h-[240px] relative h-[200px] shrink-0 overflow-hidden",l?.productCardImageWrapper),children:[(0,a.jsx)("div",{className:(0,n.cn)("media-shelf-product-card-image-bg absolute inset-0 ",l?.productCardImageBg),children:(0,a.jsx)("a",{onClick:()=>x?.(e),...!x&&{href:e.custom_link||e.listingLink},className:"cursor-pointer",children:(0,a.jsx)(t.Picture,{source:e.custom_image||e.image,alt:e.name,className:(0,n.cn)("h-full",l?.productCardImage),imgClassName:"h-full object-contain"})})}),(0,a.jsx)("div",{className:"lg-desktop:h-[28px] absolute left-4 top-4 flex h-[24px]",children:e.tags?.map((o,m)=>o.label?(0,a.jsx)(t.Badge,{size:"sm",variant:o.variant||"outline",className:(0,n.cn)("mr-1"),promotionalType:o.promotionalType,children:o.label},m):(0,a.jsx)(c.Fragment,{children:o},m))})]}),(0,a.jsxs)(t.CardContent,{className:"desktop:p-6 flex h-[calc(100%-240px)] grow flex-col justify-between p-4",children:[(0,a.jsxs)("div",{className:"mb-6 flex-1",children:[(0,a.jsx)(t.Heading,{as:"h3",size:2,className:(0,n.cn)("text-info-primary mb-1 line-clamp-2 tracking-tight",l?.productTitle),children:e.custom_name||e.name}),(e.custom_description||e?.description)&&(0,a.jsx)(t.Text,{size:2,className:(0,n.cn)("text-info-primary line-clamp-1",l?.productDescription),html:e.custom_description||e.description})]}),G(r,d,e?.quantityAvailable??0,e?.totalInventory??0)&&(0,a.jsxs)("div",{"data-total":e?.totalInventory??0,"data-available":e?.quantityAvailable??0,className:"space-y-2",children:[(0,a.jsx)(t.Progress,{value:T,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{progressBar:"transition-all duration-300 ease-in-out"}}),(0,a.jsx)(t.Text,{size:3,className:"text-info-tertiary text-[14px]",children:D?p?.limitedStock:p?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]}),(0,a.jsx)(a.Fragment,{children:e?.priceLabel&&e?.availableForSale&&(0,a.jsx)(t.Text,{size:4,className:(0,n.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[12px]",l?.productPriceLabel),children:e.priceLabel})}),(0,a.jsx)("div",{className:(0,n.cn)("mb-6",l?.productPrice),children:(0,a.jsx)("div",{className:"flex items-baseline gap-2",children:e.availableForSale?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Heading,{size:2,className:"text-info-primary",as:"h6",children:e.price}),N&&e.originalPrice&&(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary line-through",as:"h6",children:e.originalPrice})]}):(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary",children:p?.outOfStockLabel??"Sold Out"})})}),(0,a.jsxs)("div",{className:(0,n.cn)("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",l?.buttonGroup),children:[y&&(0,a.jsx)(t.Button,{variant:"secondary",size:"base",className:(0,n.cn)("tablet:w-fit w-full",l?.secondaryButton),onClick:()=>C(b,"secondary"),disabled:!e.availableForSale&&b!=="learnMore",loading:L,children:y}),v&&(0,a.jsx)(t.Button,{variant:"primary",size:"base",className:(0,n.cn)("tablet:w-fit w-full",l?.primaryButton),onClick:()=>C(g,"primary"),disabled:!e.availableForSale&&g!=="learnMore",loading:B,children:v})]})]})]})});u.displayName="MediaShelf.ProductCard";var j=u;
+"use strict";"use client";var z=Object.create;var p=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var _=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var E=(e,i)=>{for(var r in i)p(e,r,{get:i[r],enumerable:!0})},k=(e,i,r,d)=>{if(i&&typeof i=="object"||typeof i=="function")for(let s of I(i))!q.call(e,s)&&s!==r&&p(e,s,{get:()=>i[s],enumerable:!(d=A(i,s))||d.enumerable});return e};var H=(e,i,r)=>(r=e!=null?z(_(e)):{},k(i||!e||!e.__esModule?p(r,"default",{value:e,enumerable:!0}):r,e)),R=e=>k(p({},"__esModule",{value:!0}),e);var K={};E(K,{ProductCard:()=>f,default:()=>G});module.exports=R(K);var a=require("react/jsx-runtime"),c=H(require("react")),n=require("../../helpers/index.js"),t=require("../../components/index.js");const O=5;function j(e,i,r,d){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return i===void 0?!0:r<=i;case"below-percentage":return i===void 0?!0:r/d*100<=i;default:return!0}}const f=c.forwardRef(({product:e,className:i,stockDisplayMode:r,stockThresholdValue:d,onLearnMore:s,onShopNow:S,onAddToCart:w,classNames:l,secondaryButtonText:y,secondaryButtonFun:b,primaryButtonText:g,primaryButtonFun:v,showOriginalPrice:N,copy:u,onProductImageClick:x},P)=>{const[B,F]=c.useState(!1),[L,M]=c.useState(!1),T=c.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?O:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),C=async(o,m)=>{if(!o)return;const h=m==="primary"?F:M;h(!0);try{switch(o){case"buyNow":await S?.(e);break;case"addCart":await w?.(e);break;case"learnMore":await s?.(e);break;default:break}}finally{h(!1)}},D=e.availableForSale&&e.quantityAvailable<=0;return(0,a.jsxs)(t.Card,{ref:P,className:(0,n.cn)("tablet:min-w-[auto] hover:bg-container-secondary-0 flex h-full min-w-[296px] flex-col overflow-hidden border-none",e.custom_link?"cursor-pointer":"",i,l?.productCard),children:[(0,a.jsxs)("div",{className:(0,n.cn)("media-shelf-product-card-image-wrapper desktop:h-[240px] relative h-[200px] shrink-0 overflow-hidden",l?.productCardImageWrapper),children:[(0,a.jsx)("div",{className:(0,n.cn)("media-shelf-product-card-image-bg absolute inset-0 ",l?.productCardImageBg),children:(0,a.jsx)("a",{onClick:()=>x?.(e),...!x&&{href:e.custom_link||e.listingLink},className:"cursor-pointer",children:(0,a.jsx)(t.Picture,{source:e.custom_image||e.image,alt:e.name,className:(0,n.cn)("h-full",l?.productCardImage),imgClassName:"h-full object-contain"})})}),(0,a.jsx)("div",{className:"lg-desktop:h-[28px] absolute left-4 top-4 flex h-[24px]",children:e.tags?.map((o,m)=>o.label?(0,a.jsx)(t.Badge,{size:"sm",variant:o.variant||"outline",className:(0,n.cn)("mr-1"),promotionalType:o.promotionalType,children:o.label},m):(0,a.jsx)(c.Fragment,{children:o},m))})]}),(0,a.jsxs)(t.CardContent,{className:"desktop:p-6 bg-container-primary laptop:gap-6 flex h-[calc(100%-240px)] grow flex-col justify-between gap-4 p-4",children:[(0,a.jsxs)("div",{className:"flex-0",children:[(0,a.jsx)(t.Heading,{as:"h3",size:2,className:(0,n.cn)("text-info-primary mb-1 line-clamp-2 tracking-tight",l?.productTitle),children:e.custom_name||e.name}),(e.custom_description||e?.description)&&(0,a.jsx)(t.Text,{size:2,className:(0,n.cn)("text-info-primary line-clamp-1",l?.productDescription),html:e.custom_description||e.description})]}),j(r,d,e?.quantityAvailable??0,e?.totalInventory??0)&&(0,a.jsxs)("div",{"data-total":e?.totalInventory??0,"data-available":e?.quantityAvailable??0,className:"space-y-2",children:[(0,a.jsx)(t.Progress,{value:T,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{progressBar:"transition-all duration-300 ease-in-out"}}),(0,a.jsx)(t.Text,{size:3,className:"text-info-tertiary desktop:text-[16px] lg-desktop:text-[18px] text-[12px]",children:D?u?.limitedStock:u?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]}),(0,a.jsxs)("div",{children:[e?.priceLabel&&e?.availableForSale&&(0,a.jsx)(t.Text,{size:4,className:(0,n.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[12px]",l?.productPriceLabel),children:e.priceLabel}),(0,a.jsx)("div",{className:(0,n.cn)("mb-2",l?.productPrice),children:(0,a.jsx)("div",{className:"flex items-baseline gap-2",children:e.availableForSale?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Heading,{size:2,className:"text-info-primary",as:"h6",children:e.price}),N&&e.originalPrice&&(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary line-through",as:"h6",children:e.originalPrice})]}):(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary",children:u?.outOfStockLabel??"Sold Out"})})}),(0,a.jsxs)("div",{className:(0,n.cn)("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",l?.buttonGroup),children:[y&&(0,a.jsx)(t.Button,{variant:"secondary",size:"base",className:(0,n.cn)("tablet:w-fit w-full",l?.secondaryButton),onClick:()=>C(b,"secondary"),disabled:!e.availableForSale&&b!=="learnMore",loading:L,children:y}),g&&(0,a.jsx)(t.Button,{variant:"primary",size:"base",className:(0,n.cn)("tablet:w-fit w-full",l?.primaryButton),onClick:()=>C(v,"primary"),disabled:!e.availableForSale&&v!=="learnMore",loading:B,children:g})]})]})]})]})});f.displayName="MediaShelf.ProductCard";var G=f;
 //# sourceMappingURL=ProductCard.js.map

package/dist/cjs/biz-components/MediaShelf/ProductCard.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaShelf/ProductCard.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Button, Badge, Card, CardContent, Picture, Text, Heading, Progress } from '../../components/index.js'\n\nimport type {\n  ButtonFunctionType,\n  CopyConfig,\n  ProductCardData,\n  StockDisplayMode,\n  MediaShelfSemanticName,\n} from './types.js'\n\n/**\n * \u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u7684\u6700\u5C0F\u767E\u5206\u6BD4\n * \u9632\u6B62\u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u4E3A\u6EE1\u683C\uFF08100%\uFF09\u6216\u5B8C\u5168\u7A7A\uFF080%\uFF09\n */\nconst OVERSELLING_STOCK_PERCENTAGE = 5\n\n/**\n * \u5224\u65AD\u662F\u5426\u5E94\u8BE5\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n * @param stockDisplayMode \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n * @param stockThresholdValue \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09\n * @param quantityAvailable \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n * @param totalInventory \u603B\u5E93\u5B58\n * @returns \u662F\u5426\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n */\nfunction shouldShowStock(\n  stockDisplayMode: StockDisplayMode | undefined,\n  stockThresholdValue: number | undefined,\n  quantityAvailable: number,\n  totalInventory: number\n): boolean {\n  // \u672A\u914D\u7F6E\u65F6\u9ED8\u8BA4\u663E\u793A\n  if (stockDisplayMode === undefined) {\n    return true\n  }\n\n  // \u6839\u636E\u5C55\u793A\u6A21\u5F0F\u5224\u65AD\n  switch (stockDisplayMode) {\n    case 'always':\n      // \u603B\u662F\u663E\u793A\n      return true\n\n    case 'never':\n      // \u6C38\u4E0D\u663E\u793A\n      return false\n\n    case 'below-quantity':\n      // \u5F53\u5E93\u5B58\u6570\u91CF\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n      if (stockThresholdValue === undefined) {\n        return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n      }\n\n      return quantityAvailable <= stockThresholdValue\n\n    case 'below-percentage':\n      // \u5F53\u5E93\u5B58\u767E\u5206\u6BD4\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n      if (stockThresholdValue === undefined) {\n        return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n      }\n      return (quantityAvailable / totalInventory) * 100 <= stockThresholdValue\n\n    default:\n      // \u672A\u77E5\u6A21\u5F0F\u65F6\u9ED8\u8BA4\u663E\u793A\n      return true\n  }\n}\n\n/**\n * MediaShelf ProductCard \u7EC4\u4EF6 Props \u63A5\u53E3\n */\nexport interface MediaShelfProductCardProps {\n  /** \u4EA7\u54C1\u6570\u636E */\n  product: ProductCardData\n  /** \u6837\u5F0F\u7C7B\u540D */\n  className?: string\n  /** \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F */\n  stockDisplayMode?: StockDisplayMode\n  /** \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09 */\n  stockThresholdValue?: number\n  /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n  onLearnMore?: (product: ProductCardData) => void\n  /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n  onShopNow?: (product: ProductCardData) => void\n  /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n  onAddToCart?: (product: ProductCardData) => void\n  /** \u8BED\u4E49\u5316\u7C7B\u540D */\n  classNames?: Partial<Record<MediaShelfSemanticName, string>>\n  /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n  secondaryButtonText?: string\n  /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u529F\u80FD */\n  secondaryButtonFun?: ButtonFunctionType\n  /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n  primaryButtonText?: string\n  /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u529F\u80FD */\n  primaryButtonFun?: ButtonFunctionType\n  /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\u4EF7\u683C\uFF09 */\n  showOriginalPrice?: boolean\n  /** \u6587\u6848\u914D\u7F6E */\n  copy?: CopyConfig\n  /** \u70B9\u51FB\u4EA7\u54C1\u56FE\u7247\u56DE\u8C03 */\n  onProductImageClick?: (product: ProductCardData) => void\n}\n\n/**\n * MediaShelf \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, MediaShelfProductCardProps>(\n  (\n    {\n      product,\n      className,\n      stockDisplayMode,\n      stockThresholdValue,\n      onLearnMore,\n      onShopNow,\n      onAddToCart,\n      classNames,\n      secondaryButtonText,\n      secondaryButtonFun,\n      primaryButtonText,\n      primaryButtonFun,\n      showOriginalPrice,\n      copy,\n      onProductImageClick,\n    },\n    ref\n  ) => {\n    const [primaryLoading, setPrimaryLoading] = React.useState(false)\n    const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n    const stockPercentage = React.useMemo(() => {\n      if (product?.availableForSale && product?.quantityAvailable <= 0) {\n        return OVERSELLING_STOCK_PERCENTAGE\n      }\n      // \u4E0D\u53EF\u552E\u65F6\u663E\u793A0%\n      if (!product?.availableForSale) {\n        return 0\n      }\n      return ((product?.quantityAvailable ?? 0) / (product?.totalInventory ?? 1)) * 100\n    }, [product?.availableForSale, product?.quantityAvailable, product?.totalInventory])\n\n    // \u6839\u636E\u6309\u94AE\u529F\u80FD\u7C7B\u578B\u8C03\u7528\u76F8\u5E94\u7684\u56DE\u8C03\u51FD\u6570\n    const handleButtonClick = async (buttonFun?: ButtonFunctionType, buttonType?: 'primary' | 'secondary') => {\n      if (!buttonFun) return\n\n      const setLoading = buttonType === 'primary' ? setPrimaryLoading : setSecondaryLoading\n      setLoading(true)\n\n      try {\n        switch (buttonFun) {\n          case 'buyNow':\n            await onShopNow?.(product)\n            break\n          case 'addCart':\n            await onAddToCart?.(product)\n            break\n          case 'learnMore':\n            await onLearnMore?.(product)\n            break\n          default:\n            break\n        }\n      } finally {\n        setLoading(false)\n      }\n    }\n\n    const overselling = product.availableForSale && product.quantityAvailable <= 0\n\n    return (\n      <Card\n        ref={ref}\n        className={cn(\n          'flex h-full min-w-[296px] flex-col overflow-hidden',\n          product.custom_link ? 'cursor-pointer' : '',\n          className,\n          classNames?.productCard\n        )}\n      >\n        {/* \u56FE\u7247\u533A\u57DF */}\n        <div\n          className={cn(\n            'media-shelf-product-card-image-wrapper desktop:h-[240px] relative h-[200px] shrink-0 overflow-hidden',\n            classNames?.productCardImageWrapper\n          )}\n        >\n          {/* \u80CC\u666F\u56FE\u7247 */}\n          <div className={cn('media-shelf-product-card-image-bg absolute inset-0 ', classNames?.productCardImageBg)}>\n            <a\n              onClick={() => onProductImageClick?.(product)}\n              {...(!onProductImageClick && {\n                href: product.custom_link || product.listingLink,\n              })}\n              className=\"cursor-pointer\"\n            >\n              <Picture\n                source={product.custom_image || product.image}\n                alt={product.name}\n                className={cn('h-full', classNames?.productCardImage)}\n                imgClassName=\"h-full object-contain\"\n              />\n            </a>\n          </div>\n\n          {/* \u6807\u7B7E\u533A\u57DF */}\n          <div className=\"lg-desktop:h-[28px] absolute left-4 top-4 flex h-[24px]\">\n            {product.tags?.map((tag: any, index) =>\n              (tag as any).label ? (\n                <Badge\n                  key={index}\n                  size=\"sm\"\n                  variant={(tag.variant as any) || 'outline'}\n                  className={cn('mr-1')}\n                  promotionalType={tag.promotionalType}\n                >\n                  {tag.label}\n                </Badge>\n              ) : (\n                <React.Fragment key={index}>{tag}</React.Fragment>\n              )\n            )}\n          </div>\n        </div>\n\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <CardContent className=\"desktop:p-6 flex h-[calc(100%-240px)] grow flex-col justify-between p-4\">\n          {/* \u4EA7\u54C1\u6807\u9898\u548C\u526F\u6807\u9898 */}\n          <div className=\"mb-6 flex-1\">\n            <Heading\n              as=\"h3\"\n              size={2}\n              className={cn('text-info-primary mb-1 line-clamp-2 tracking-tight', classNames?.productTitle)}\n            >\n              {product.custom_name || product.name}\n            </Heading>\n            {(product.custom_description || product?.description) && (\n              <Text\n                size={2}\n                className={cn('text-info-primary line-clamp-1', classNames?.productDescription)}\n                html={product.custom_description || product.description}\n              />\n            )}\n          </div>\n\n          {/* \u5E93\u5B58\u4FE1\u606F */}\n          {shouldShowStock(\n            stockDisplayMode,\n            stockThresholdValue,\n            product?.quantityAvailable ?? 0,\n            product?.totalInventory ?? 0\n          ) && (\n            <div\n              data-total={product?.totalInventory ?? 0}\n              data-available={product?.quantityAvailable ?? 0}\n              className=\"space-y-2\"\n            >\n              <Progress\n                value={stockPercentage}\n                max={100}\n                min={0}\n                size=\"base\"\n                variant=\"default\"\n                aria-label=\"stock progress\"\n                classNames={{\n                  progressBar: 'transition-all duration-300 ease-in-out',\n                }}\n              />\n              <Text size={3} className=\"text-info-tertiary text-[14px]\">\n                {overselling\n                  ? copy?.limitedStock\n                  : copy?.stockDisplayText?.replace(\n                      '{count}',\n                      `${product.availableForSale ? product.quantityAvailable : 0}`\n                    )}\n              </Text>\n            </div>\n          )}\n\n          {/** \u4EF7\u683C\u6807\u7B7E */}\n          <>\n            {product?.priceLabel && product?.availableForSale && (\n              <Text\n                size={4}\n                className={cn(\n                  'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[12px]',\n                  classNames?.productPriceLabel\n                )}\n              >\n                {product.priceLabel}\n              </Text>\n            )}\n          </>\n          {/* \u4EF7\u683C\u533A\u57DF */}\n          <div className={cn('mb-6', classNames?.productPrice)}>\n            <div className=\"flex items-baseline gap-2\">\n              {product.availableForSale ? (\n                <>\n                  <Heading size={2} className=\"text-info-primary\" as=\"h6\">\n                    {product.price}\n                  </Heading>\n                  {showOriginalPrice && product.originalPrice && (\n                    <Heading size={2} className=\"text-info-tertiary line-through\" as=\"h6\">\n                      {product.originalPrice}\n                    </Heading>\n                  )}\n                </>\n              ) : (\n                <Heading size={2} className=\"text-info-tertiary\">\n                  {copy?.outOfStockLabel ?? 'Sold Out'}\n                </Heading>\n              )}\n            </div>\n          </div>\n\n          {/* \u6309\u94AE\u533A\u57DF */}\n          <div className={cn('lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2', classNames?.buttonGroup)}>\n            {secondaryButtonText && (\n              <Button\n                variant=\"secondary\"\n                size=\"base\"\n                className={cn('tablet:w-fit w-full', classNames?.secondaryButton)}\n                onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n                disabled={!product.availableForSale && secondaryButtonFun !== 'learnMore'}\n                loading={secondaryLoading}\n              >\n                {secondaryButtonText}\n              </Button>\n            )}\n            {primaryButtonText && (\n              <Button\n                variant=\"primary\"\n                size=\"base\"\n                className={cn('tablet:w-fit w-full', classNames?.primaryButton)}\n                onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n                disabled={!product.availableForSale && primaryButtonFun !== 'learnMore'}\n                loading={primaryLoading}\n              >\n                {primaryButtonText}\n              </Button>\n            )}\n          </div>\n        </CardContent>\n      </Card>\n    )\n  }\n)\n\nProductCard.displayName = 'MediaShelf.ProductCard'\n\nexport default ProductCard\nexport { ProductCard }\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Button, Badge, Card, CardContent, Picture, Text, Heading, Progress } from '../../components/index.js'\n\nimport type {\n  ButtonFunctionType,\n  CopyConfig,\n  ProductCardData,\n  StockDisplayMode,\n  MediaShelfSemanticName,\n} from './types.js'\nimport type { Theme } from '../../types/props.js'\n\n/**\n * \u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u7684\u6700\u5C0F\u767E\u5206\u6BD4\n * \u9632\u6B62\u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u4E3A\u6EE1\u683C\uFF08100%\uFF09\u6216\u5B8C\u5168\u7A7A\uFF080%\uFF09\n */\nconst OVERSELLING_STOCK_PERCENTAGE = 5\n\n/**\n * \u5224\u65AD\u662F\u5426\u5E94\u8BE5\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n * @param stockDisplayMode \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n * @param stockThresholdValue \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09\n * @param quantityAvailable \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n * @param totalInventory \u603B\u5E93\u5B58\n * @returns \u662F\u5426\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n */\nfunction shouldShowStock(\n  stockDisplayMode: StockDisplayMode | undefined,\n  stockThresholdValue: number | undefined,\n  quantityAvailable: number,\n  totalInventory: number\n): boolean {\n  // \u672A\u914D\u7F6E\u65F6\u9ED8\u8BA4\u663E\u793A\n  if (stockDisplayMode === undefined) {\n    return true\n  }\n\n  // \u6839\u636E\u5C55\u793A\u6A21\u5F0F\u5224\u65AD\n  switch (stockDisplayMode) {\n    case 'always':\n      // \u603B\u662F\u663E\u793A\n      return true\n\n    case 'never':\n      // \u6C38\u4E0D\u663E\u793A\n      return false\n\n    case 'below-quantity':\n      // \u5F53\u5E93\u5B58\u6570\u91CF\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n      if (stockThresholdValue === undefined) {\n        return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n      }\n\n      return quantityAvailable <= stockThresholdValue\n\n    case 'below-percentage':\n      // \u5F53\u5E93\u5B58\u767E\u5206\u6BD4\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n      if (stockThresholdValue === undefined) {\n        return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n      }\n      return (quantityAvailable / totalInventory) * 100 <= stockThresholdValue\n\n    default:\n      // \u672A\u77E5\u6A21\u5F0F\u65F6\u9ED8\u8BA4\u663E\u793A\n      return true\n  }\n}\n\n/**\n * MediaShelf ProductCard \u7EC4\u4EF6 Props \u63A5\u53E3\n */\nexport interface MediaShelfProductCardProps {\n  /** \u4EA7\u54C1\u6570\u636E */\n  product: ProductCardData\n  /** \u6837\u5F0F\u7C7B\u540D */\n  className?: string\n  /** \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F */\n  stockDisplayMode?: StockDisplayMode\n  /** \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09 */\n  stockThresholdValue?: number\n  /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n  onLearnMore?: (product: ProductCardData) => void\n  /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n  onShopNow?: (product: ProductCardData) => void\n  /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n  onAddToCart?: (product: ProductCardData) => void\n  /** \u8BED\u4E49\u5316\u7C7B\u540D */\n  classNames?: Partial<Record<MediaShelfSemanticName, string>>\n  /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n  secondaryButtonText?: string\n  /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u529F\u80FD */\n  secondaryButtonFun?: ButtonFunctionType\n  /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n  primaryButtonText?: string\n  /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u529F\u80FD */\n  primaryButtonFun?: ButtonFunctionType\n  /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\u4EF7\u683C\uFF09 */\n  showOriginalPrice?: boolean\n  /** \u6587\u6848\u914D\u7F6E */\n  copy?: CopyConfig\n  /** \u70B9\u51FB\u4EA7\u54C1\u56FE\u7247\u56DE\u8C03 */\n  onProductImageClick?: (product: ProductCardData) => void\n}\n\n/**\n * MediaShelf \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, MediaShelfProductCardProps>(\n  (\n    {\n      product,\n      className,\n      stockDisplayMode,\n      stockThresholdValue,\n      onLearnMore,\n      onShopNow,\n      onAddToCart,\n      classNames,\n      secondaryButtonText,\n      secondaryButtonFun,\n      primaryButtonText,\n      primaryButtonFun,\n      showOriginalPrice,\n      copy,\n      onProductImageClick,\n    },\n    ref\n  ) => {\n    const [primaryLoading, setPrimaryLoading] = React.useState(false)\n    const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n    const stockPercentage = React.useMemo(() => {\n      if (product?.availableForSale && product?.quantityAvailable <= 0) {\n        return OVERSELLING_STOCK_PERCENTAGE\n      }\n      // \u4E0D\u53EF\u552E\u65F6\u663E\u793A0%\n      if (!product?.availableForSale) {\n        return 0\n      }\n      return ((product?.quantityAvailable ?? 0) / (product?.totalInventory ?? 1)) * 100\n    }, [product?.availableForSale, product?.quantityAvailable, product?.totalInventory])\n\n    // \u6839\u636E\u6309\u94AE\u529F\u80FD\u7C7B\u578B\u8C03\u7528\u76F8\u5E94\u7684\u56DE\u8C03\u51FD\u6570\n    const handleButtonClick = async (buttonFun?: ButtonFunctionType, buttonType?: 'primary' | 'secondary') => {\n      if (!buttonFun) return\n\n      const setLoading = buttonType === 'primary' ? setPrimaryLoading : setSecondaryLoading\n      setLoading(true)\n\n      try {\n        switch (buttonFun) {\n          case 'buyNow':\n            await onShopNow?.(product)\n            break\n          case 'addCart':\n            await onAddToCart?.(product)\n            break\n          case 'learnMore':\n            await onLearnMore?.(product)\n            break\n          default:\n            break\n        }\n      } finally {\n        setLoading(false)\n      }\n    }\n\n    const overselling = product.availableForSale && product.quantityAvailable <= 0\n\n    return (\n      <Card\n        ref={ref}\n        className={cn(\n          'tablet:min-w-[auto] hover:bg-container-secondary-0 flex h-full min-w-[296px] flex-col overflow-hidden border-none',\n          product.custom_link ? 'cursor-pointer' : '',\n          className,\n          classNames?.productCard\n        )}\n      >\n        {/* \u56FE\u7247\u533A\u57DF */}\n        <div\n          className={cn(\n            'media-shelf-product-card-image-wrapper desktop:h-[240px] relative h-[200px] shrink-0 overflow-hidden',\n            classNames?.productCardImageWrapper\n          )}\n        >\n          {/* \u80CC\u666F\u56FE\u7247 */}\n          <div className={cn('media-shelf-product-card-image-bg absolute inset-0 ', classNames?.productCardImageBg)}>\n            <a\n              onClick={() => onProductImageClick?.(product)}\n              {...(!onProductImageClick && {\n                href: product.custom_link || product.listingLink,\n              })}\n              className=\"cursor-pointer\"\n            >\n              <Picture\n                source={product.custom_image || product.image}\n                alt={product.name}\n                className={cn('h-full', classNames?.productCardImage)}\n                imgClassName=\"h-full object-contain\"\n              />\n            </a>\n          </div>\n\n          {/* \u6807\u7B7E\u533A\u57DF */}\n          <div className=\"lg-desktop:h-[28px] absolute left-4 top-4 flex h-[24px]\">\n            {product.tags?.map((tag: any, index) =>\n              (tag as any).label ? (\n                <Badge\n                  key={index}\n                  size=\"sm\"\n                  variant={(tag.variant as any) || 'outline'}\n                  className={cn('mr-1')}\n                  promotionalType={tag.promotionalType}\n                >\n                  {tag.label}\n                </Badge>\n              ) : (\n                <React.Fragment key={index}>{tag}</React.Fragment>\n              )\n            )}\n          </div>\n        </div>\n\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <CardContent className=\"desktop:p-6 bg-container-primary laptop:gap-6 flex h-[calc(100%-240px)] grow flex-col justify-between gap-4 p-4\">\n          {/* \u4EA7\u54C1\u6807\u9898\u548C\u526F\u6807\u9898 */}\n          <div className=\"flex-0\">\n            <Heading\n              as=\"h3\"\n              size={2}\n              className={cn('text-info-primary mb-1 line-clamp-2 tracking-tight', classNames?.productTitle)}\n            >\n              {product.custom_name || product.name}\n            </Heading>\n            {(product.custom_description || product?.description) && (\n              <Text\n                size={2}\n                className={cn('text-info-primary line-clamp-1', classNames?.productDescription)}\n                html={product.custom_description || product.description}\n              />\n            )}\n          </div>\n\n          {/* \u5E93\u5B58\u4FE1\u606F */}\n          {shouldShowStock(\n            stockDisplayMode,\n            stockThresholdValue,\n            product?.quantityAvailable ?? 0,\n            product?.totalInventory ?? 0\n          ) && (\n            <div\n              data-total={product?.totalInventory ?? 0}\n              data-available={product?.quantityAvailable ?? 0}\n              className=\"space-y-2\"\n            >\n              <Progress\n                value={stockPercentage}\n                max={100}\n                min={0}\n                size=\"base\"\n                variant=\"default\"\n                aria-label=\"stock progress\"\n                classNames={{\n                  progressBar: 'transition-all duration-300 ease-in-out',\n                }}\n              />\n              <Text size={3} className=\"text-info-tertiary desktop:text-[16px] lg-desktop:text-[18px] text-[12px]\">\n                {overselling\n                  ? copy?.limitedStock\n                  : copy?.stockDisplayText?.replace(\n                      '{count}',\n                      `${product.availableForSale ? product.quantityAvailable : 0}`\n                    )}\n              </Text>\n            </div>\n          )}\n\n          <div>\n            {/** \u4EF7\u683C\u6807\u7B7E */}\n            {product?.priceLabel && product?.availableForSale && (\n              <Text\n                size={4}\n                className={cn(\n                  'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[12px]',\n                  classNames?.productPriceLabel\n                )}\n              >\n                {product.priceLabel}\n              </Text>\n            )}\n            {/* \u4EF7\u683C\u533A\u57DF */}\n            <div className={cn('mb-2', classNames?.productPrice)}>\n              <div className=\"flex items-baseline gap-2\">\n                {product.availableForSale ? (\n                  <>\n                    <Heading size={2} className=\"text-info-primary\" as=\"h6\">\n                      {product.price}\n                    </Heading>\n                    {showOriginalPrice && product.originalPrice && (\n                      <Heading size={2} className=\"text-info-tertiary line-through\" as=\"h6\">\n                        {product.originalPrice}\n                      </Heading>\n                    )}\n                  </>\n                ) : (\n                  <Heading size={2} className=\"text-info-tertiary\">\n                    {copy?.outOfStockLabel ?? 'Sold Out'}\n                  </Heading>\n                )}\n              </div>\n            </div>\n\n            {/* \u6309\u94AE\u533A\u57DF */}\n            <div className={cn('lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2', classNames?.buttonGroup)}>\n              {secondaryButtonText && (\n                <Button\n                  variant=\"secondary\"\n                  size=\"base\"\n                  className={cn('tablet:w-fit w-full', classNames?.secondaryButton)}\n                  onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n                  disabled={!product.availableForSale && secondaryButtonFun !== 'learnMore'}\n                  loading={secondaryLoading}\n                >\n                  {secondaryButtonText}\n                </Button>\n              )}\n              {primaryButtonText && (\n                <Button\n                  variant=\"primary\"\n                  size=\"base\"\n                  className={cn('tablet:w-fit w-full', classNames?.primaryButton)}\n                  onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n                  disabled={!product.availableForSale && primaryButtonFun !== 'learnMore'}\n                  loading={primaryLoading}\n                >\n                  {primaryButtonText}\n                </Button>\n              )}\n            </div>\n          </div>\n        </CardContent>\n      </Card>\n    )\n  }\n)\n\nProductCard.displayName = 'MediaShelf.ProductCard'\n\nexport default ProductCard\nexport { ProductCard }\n"],
+  "mappings": "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",
   "names": ["ProductCard_exports", "__export", "ProductCard", "ProductCard_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "OVERSELLING_STOCK_PERCENTAGE", "shouldShowStock", "stockDisplayMode", "stockThresholdValue", "quantityAvailable", "totalInventory", "product", "className", "onLearnMore", "onShopNow", "onAddToCart", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "showOriginalPrice", "copy", "onProductImageClick", "ref", "primaryLoading", "setPrimaryLoading", "secondaryLoading", "setSecondaryLoading", "stockPercentage", "handleButtonClick", "buttonFun", "buttonType", "setLoading", "overselling", "tag", "index"]
 }

package/dist/cjs/biz-components/MiniCart/CircleProgress.d.ts

@@ -0,0 +1,38 @@
+import type { Img } from '../../types/props.js';
+export interface CircleProgressProps {
+    /** 总阶段数 (1-4) */
+    totalSteps?: 1 | 2 | 3 | 4;
+    /** 当前完成的阶段 (0 到 totalSteps) */
+    currentStep?: number;
+    /** 中间显示的图片 */
+    image?: Img;
+    /** 底部显示的文案 */
+    label?: string;
+    /** 进度条颜色，默认为品牌色 */
+    progressColor?: string;
+    /** 底部文案背景色，默认为品牌营销色 */
+    labelColor?: string;
+    /** 未完成阶段的颜色 */
+    trackColor?: string;
+    /** 背景颜色，默认为容器背景色 */
+    backgroundColor?: string;
+    /** 移动端组件尺寸，默认 64 */
+    size?: number;
+    /** laptop 以上组件尺寸，默认 80 */
+    laptopSize?: number;
+    /** 段之间的间隙（像素），默认 3 */
+    gap?: number;
+    /** 自定义类名 */
+    className?: string;
+}
+/**
+ * 分段式圆形进度条组件
+ * 用于 MiniCart 左侧显示阶段性进度，支持 1-4 个阶段配置
+ * 每个阶段是独立的弧段，中间有间隙
+ * 移动端默认 64px，laptop 以上默认 80px
+ */
+declare const CircleProgress: {
+    ({ totalSteps, currentStep, image, label, progressColor, labelColor, trackColor, backgroundColor, size, laptopSize, gap, className, }: CircleProgressProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default CircleProgress;

package/dist/cjs/biz-components/MiniCart/CircleProgress.js

@@ -0,0 +1,2 @@
+"use strict";"use client";var Y=Object.create;var x=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var F=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,T=Object.prototype.hasOwnProperty;var q=(e,t)=>{for(var s in t)x(e,s,{get:t[s],enumerable:!0})},P=(e,t,s,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of F(t))!T.call(e,a)&&a!==s&&x(e,a,{get:()=>t[a],enumerable:!(o=B(t,a))||o.enumerable});return e};var H=(e,t,s)=>(s=e!=null?Y(L(e)):{},P(t||!e||!e.__esModule?x(s,"default",{value:e,enumerable:!0}):s,e)),J=e=>P(x({},"__esModule",{value:!0}),e);var U={};q(U,{default:()=>Q});module.exports=J(U);var r=require("react/jsx-runtime"),K=H(require("react")),y=require("../../components/index.js"),v=require("../../helpers/index.js");const M=({totalSteps:e=4,currentStep:t=0,image:s,label:o,progressColor:a="var(--brand-color-0)",labelColor:z="var(--marketing-color-1)",trackColor:j="#DADCE0",backgroundColor:A="#EAEAEC",size:m=64,laptopSize:u=96,gap:$=3,className:w})=>{const d=Math.max(m,u),C=6,l=(d-C)/2,c=d/2,E=K.useMemo(()=>{const b=($+C)/l*(180/Math.PI),G=(360-b*e)/e,f=n=>n*Math.PI/180,I=(n,i)=>{const p=n-90,h=i-90,R=c+l*Math.cos(f(p)),D=c+l*Math.sin(f(p)),O=c+l*Math.cos(f(h)),W=c+l*Math.sin(f(h)),X=i-n>180?1:0;return`M ${R} ${D} A ${l} ${l} 0 ${X} 1 ${O} ${W}`},k=[];let N=e===2?-45:0;for(let n=0;n<e;n++){const i=N+b/2,p=i+G,h=n<t;k.push({path:I(i,p),isCompleted:h,index:n}),N=p+b/2}return k},[e,t,$,l,c]);return(0,r.jsxs)("div",{className:(0,v.cn)("relative inline-flex shrink-0 flex-col items-center","laptop:w-[--circle-laptop-size] w-[--circle-size]","laptop:h-[--circle-laptop-height] h-[--circle-height]",w),style:{"--circle-size":`${m}px`,"--circle-laptop-size":`${u}px`,"--circle-height":`${o?m+8:m}px`,"--circle-laptop-height":`${o?u+8:u}px`},children:[(0,r.jsxs)("div",{className:"laptop:size-[--circle-laptop-size] relative size-[--circle-size]",children:[(0,r.jsxs)("svg",{viewBox:`0 0 ${d} ${d}`,className:(0,v.cn)("absolute inset-0 size-full",o?"translate-y-[-8px]":""),children:[(0,r.jsx)("circle",{cx:c,cy:c,r:l,fill:A,stroke:"none"}),E.map(g=>(0,r.jsx)("path",{d:g.path,fill:"none",stroke:g.isCompleted?a:j,strokeWidth:C,strokeLinecap:"round",style:{transition:"stroke 0.3s ease-in-out"}},g.index))]}),(0,r.jsx)("div",{className:(0,v.cn)("absolute inset-[10px] flex items-center justify-center",o?"translate-y-[-8px]":""),children:(0,r.jsx)("div",{className:"flex size-full items-center justify-center overflow-hidden rounded-full",style:{backgroundColor:A},children:s?.url&&(0,r.jsx)(y.Picture,{className:"size-full",imgClassName:"object-contain",source:s.url,alt:s.alt||""})})})]}),o&&(0,r.jsx)("div",{className:"absolute bottom-0 left-1/2 flex -translate-x-1/2 items-center justify-center rounded-full px-2 py-0.5",style:{backgroundColor:z},children:(0,r.jsx)(y.Text,{className:"text-xs font-medium text-white",html:o})})]})};M.displayName="CircleProgress";var Q=M;
+//# sourceMappingURL=CircleProgress.js.map

package/dist/cjs/biz-components/MiniCart/CircleProgress.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/MiniCart/CircleProgress.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport type { Img } from '../../types/props.js'\nimport { Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\n\nexport interface CircleProgressProps {\n  /** \u603B\u9636\u6BB5\u6570 (1-4) */\n  totalSteps?: 1 | 2 | 3 | 4\n  /** \u5F53\u524D\u5B8C\u6210\u7684\u9636\u6BB5 (0 \u5230 totalSteps) */\n  currentStep?: number\n  /** \u4E2D\u95F4\u663E\u793A\u7684\u56FE\u7247 */\n  image?: Img\n  /** \u5E95\u90E8\u663E\u793A\u7684\u6587\u6848 */\n  label?: string\n  /** \u8FDB\u5EA6\u6761\u989C\u8272\uFF0C\u9ED8\u8BA4\u4E3A\u54C1\u724C\u8272 */\n  progressColor?: string\n  /** \u5E95\u90E8\u6587\u6848\u80CC\u666F\u8272\uFF0C\u9ED8\u8BA4\u4E3A\u54C1\u724C\u8425\u9500\u8272 */\n  labelColor?: string\n  /** \u672A\u5B8C\u6210\u9636\u6BB5\u7684\u989C\u8272 */\n  trackColor?: string\n  /** \u80CC\u666F\u989C\u8272\uFF0C\u9ED8\u8BA4\u4E3A\u5BB9\u5668\u80CC\u666F\u8272 */\n  backgroundColor?: string\n  /** \u79FB\u52A8\u7AEF\u7EC4\u4EF6\u5C3A\u5BF8\uFF0C\u9ED8\u8BA4 64 */\n  size?: number\n  /** laptop \u4EE5\u4E0A\u7EC4\u4EF6\u5C3A\u5BF8\uFF0C\u9ED8\u8BA4 80 */\n  laptopSize?: number\n  /** \u6BB5\u4E4B\u95F4\u7684\u95F4\u9699\uFF08\u50CF\u7D20\uFF09\uFF0C\u9ED8\u8BA4 3 */\n  gap?: number\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n}\n\n/**\n * \u5206\u6BB5\u5F0F\u5706\u5F62\u8FDB\u5EA6\u6761\u7EC4\u4EF6\n * \u7528\u4E8E MiniCart \u5DE6\u4FA7\u663E\u793A\u9636\u6BB5\u6027\u8FDB\u5EA6\uFF0C\u652F\u6301 1-4 \u4E2A\u9636\u6BB5\u914D\u7F6E\n * \u6BCF\u4E2A\u9636\u6BB5\u662F\u72EC\u7ACB\u7684\u5F27\u6BB5\uFF0C\u4E2D\u95F4\u6709\u95F4\u9699\n * \u79FB\u52A8\u7AEF\u9ED8\u8BA4 64px\uFF0Claptop \u4EE5\u4E0A\u9ED8\u8BA4 80px\n */\nconst CircleProgress = ({\n  totalSteps = 4,\n  currentStep = 0,\n  image,\n  label,\n  progressColor = 'var(--brand-color-0)',\n  labelColor = 'var(--marketing-color-1)',\n  trackColor = '#DADCE0',\n  backgroundColor = '#EAEAEC',\n  size = 64,\n  laptopSize = 96,\n  gap = 3,\n  className,\n}: CircleProgressProps) => {\n  // \u4F7F\u7528\u8F83\u5927\u5C3A\u5BF8\u8BA1\u7B97 SVG \u53C2\u6570\uFF0C\u786E\u4FDD\u5728\u6240\u6709\u5C3A\u5BF8\u4E0B\u90FD\u6E05\u6670\n  const maxSize = Math.max(size, laptopSize) // \u5982\u679C\u6709\u6807\u7B7E\uFF0C\u9884\u7559\u5E95\u90E8\u7A7A\u95F4\n  const strokeWidth = 6\n  const radius = (maxSize - strokeWidth) / 2\n  const center = maxSize / 2\n\n  // \u751F\u6210\u6240\u6709\u5206\u6BB5\n  const segments = React.useMemo(() => {\n    // \u89C6\u89C9\u95F4\u9699\u9700\u8981\u52A0\u4E0A\u4E24\u7AEF\u5706\u89D2\u5E3D\u5B50\u7684\u5BBD\u5EA6\uFF08strokeLinecap=\"round\" \u4F1A\u5EF6\u4F38 strokeWidth/2\uFF09\n    const actualGap = gap + strokeWidth\n    // \u5C06\u50CF\u7D20\u95F4\u9699\u8F6C\u6362\u4E3A\u89D2\u5EA6\uFF08\u5F27\u5EA6 = \u5F27\u957F / \u534A\u5F84\uFF0C\u518D\u8F6C\u4E3A\u5EA6\uFF09\n    const gapAngle = (actualGap / radius) * (180 / Math.PI)\n    const totalGapAngle = gapAngle * totalSteps\n    const availableAngle = 360 - totalGapAngle\n    const segmentAngle = availableAngle / totalSteps\n\n    // \u5C06\u89D2\u5EA6\u8F6C\u6362\u4E3A\u5F27\u5EA6\n    const toRadians = (degrees: number) => (degrees * Math.PI) / 180\n\n    // \u8BA1\u7B97\u5F27\u6BB5\u7684\u8D77\u70B9\u548C\u7EC8\u70B9\u5750\u6807\n    const getArcPath = (startAngle: number, endAngle: number) => {\n      // \u4ECE\u9876\u90E8\u5F00\u59CB\uFF08-90\u5EA6\uFF09\uFF0C\u987A\u65F6\u9488\u65B9\u5411\n      const adjustedStart = startAngle - 90\n      const adjustedEnd = endAngle - 90\n\n      const startX = center + radius * Math.cos(toRadians(adjustedStart))\n      const startY = center + radius * Math.sin(toRadians(adjustedStart))\n      const endX = center + radius * Math.cos(toRadians(adjustedEnd))\n      const endY = center + radius * Math.sin(toRadians(adjustedEnd))\n\n      // \u5224\u65AD\u662F\u5426\u4E3A\u5927\u5F27\uFF08\u8D85\u8FC7180\u5EA6\uFF09\n      const largeArcFlag = endAngle - startAngle > 180 ? 1 : 0\n\n      return `M ${startX} ${startY} A ${radius} ${radius} 0 ${largeArcFlag} 1 ${endX} ${endY}`\n    }\n\n    const result = []\n    // totalSteps = 2 \u65F6\uFF0C\u8D77\u59CB\u4F4D\u7F6E\u9006\u65F6\u9488\u504F\u79FB 45 \u5EA6\uFF0C\u8BA9\u65AD\u5F00\u4F4D\u7F6E\u5728\u5DE6\u4E0A\u548C\u53F3\u4E0B\n    const startOffset = totalSteps === 2 ? -45 : 0\n    let currentAngle = startOffset\n\n    for (let i = 0; i < totalSteps; i++) {\n      const startAngle = currentAngle + gapAngle / 2\n      const endAngle = startAngle + segmentAngle\n      const isCompleted = i < currentStep\n\n      result.push({\n        path: getArcPath(startAngle, endAngle),\n        isCompleted,\n        index: i,\n      })\n\n      currentAngle = endAngle + gapAngle / 2\n    }\n\n    return result\n  }, [totalSteps, currentStep, gap, radius, center])\n\n  return (\n    <div\n      className={cn(\n        'relative inline-flex shrink-0 flex-col items-center',\n        'laptop:w-[--circle-laptop-size] w-[--circle-size]',\n        'laptop:h-[--circle-laptop-height] h-[--circle-height]',\n        className\n      )}\n      style={\n        {\n          '--circle-size': `${size}px`,\n          '--circle-laptop-size': `${laptopSize}px`,\n          '--circle-height': `${label ? size + 8 : size}px`,\n          '--circle-laptop-height': `${label ? laptopSize + 8 : laptopSize}px`,\n        } as React.CSSProperties\n      }\n    >\n      {/* \u8FDB\u5EA6\u6761\u5706\u73AF */}\n      <div className=\"laptop:size-[--circle-laptop-size] relative size-[--circle-size]\">\n        <svg\n          viewBox={`0 0 ${maxSize} ${maxSize}`}\n          className={cn('absolute inset-0 size-full', label ? 'translate-y-[-8px]' : '')}\n        >\n          {/* \u80CC\u666F\u5706\u5F62 */}\n          <circle cx={center} cy={center} r={radius} fill={backgroundColor} stroke=\"none\" />\n\n          {/* \u5206\u6BB5\u5F27 */}\n          {segments.map(segment => (\n            <path\n              key={segment.index}\n              d={segment.path}\n              fill=\"none\"\n              stroke={segment.isCompleted ? progressColor : trackColor}\n              strokeWidth={strokeWidth}\n              strokeLinecap=\"round\"\n              style={{\n                transition: 'stroke 0.3s ease-in-out',\n              }}\n            />\n          ))}\n        </svg>\n\n        {/* \u4E2D\u95F4\u5185\u5BB9\u533A\u57DF */}\n        <div\n          className={cn('absolute inset-[10px] flex items-center justify-center', label ? 'translate-y-[-8px]' : '')}\n        >\n          <div\n            className=\"flex size-full items-center justify-center overflow-hidden rounded-full\"\n            style={{ backgroundColor }}\n          >\n            {image?.url && (\n              <Picture className=\"size-full\" imgClassName=\"object-contain\" source={image.url} alt={image.alt || ''} />\n            )}\n          </div>\n        </div>\n      </div>\n\n      {/* \u5E95\u90E8\u6587\u6848 - \u548C\u5706\u5F62\u5E95\u90E8\u91CD\u53E0 */}\n      {label && (\n        <div\n          className=\"absolute bottom-0 left-1/2 flex -translate-x-1/2 items-center justify-center rounded-full px-2 py-0.5\"\n          style={{ backgroundColor: labelColor }}\n        >\n          <Text className=\"text-xs font-medium text-white\" html={label} />\n        </div>\n      )}\n    </div>\n  )\n}\n\nCircleProgress.displayName = 'CircleProgress'\n\nexport default CircleProgress\n"],
+  "mappings": "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",
+  "names": ["CircleProgress_exports", "__export", "CircleProgress_default", "__toCommonJS", "import_jsx_runtime", "React", "import_components", "import_helpers", "CircleProgress", "totalSteps", "currentStep", "image", "label", "progressColor", "labelColor", "trackColor", "backgroundColor", "size", "laptopSize", "gap", "className", "maxSize", "strokeWidth", "radius", "center", "segments", "gapAngle", "segmentAngle", "toRadians", "degrees", "getArcPath", "startAngle", "endAngle", "adjustedStart", "adjustedEnd", "startX", "startY", "endX", "endY", "largeArcFlag", "result", "currentAngle", "i", "isCompleted", "segment"]
+}

package/dist/cjs/biz-components/MiniCart/MiniCartDialog.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var h=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var I=Object.prototype.hasOwnProperty;var N=(a,e)=>{for(var l in e)h(a,l,{get:e[l],enumerable:!0})},z=(a,e,l,p)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of D(e))!I.call(a,o)&&o!==l&&h(a,o,{get:()=>e[o],enumerable:!(p=w(e,o))||p.enumerable});return a};var P=a=>z(h({},"__esModule",{value:!0}),a);var L={};N(L,{MiniCartDialog:()=>f,default:()=>M});module.exports=P(L);var t=require("react/jsx-runtime"),i=require("../../helpers/index.js"),n=require("../../components/index.js");const T=({className:a})=>(0,t.jsx)("svg",{className:a,width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M2 6H10",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),k=({className:a})=>(0,t.jsx)("svg",{className:a,width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M6 2V10M2 6H10",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),q=({item:a,classNames:e,onIncrease:l,onDecrease:p})=>{const{merchandise:o,quantity:u,cost:y}=a,{image:c,title:b}=o,{totalAmount:d,subtotalAmount:m}=y,x=b||o.sku||"Product",g=d?.formattedPrice||"",v=m&&d&&parseFloat(m.amount)>parseFloat(d.amount);return(0,t.jsxs)("div",{className:(0,i.cn)("bg-container-primary rounded-box flex items-center gap-2 px-2 py-4","laptop:bg-container-primary laptop:gap-4 laptop:p-4",e?.item),children:[(0,t.jsx)("div",{className:(0,i.cn)("rounded-box relative size-16 shrink-0 overflow-hidden","laptop:size-20",e?.itemImage),children:c?.url&&(0,t.jsx)("img",{src:c.url,alt:c.altText||x,className:"size-full object-cover"})}),(0,t.jsxs)("div",{className:(0,i.cn)("laptop:gap-4 flex flex-1 flex-col gap-2",e?.itemInfo),children:[(0,t.jsx)(n.Text,{as:"p",size:3,className:(0,i.cn)("text-info-primary laptop:text-[16px] line-clamp-2 text-[14px]",e?.itemTitle),children:x}),(0,t.jsxs)("div",{className:"laptop:flex-row laptop:items-center laptop:justify-between flex flex-col items-start gap-1",children:[(0,t.jsxs)("div",{className:(0,i.cn)("flex items-center gap-1",e?.itemPrice),children:[g&&(0,t.jsx)(n.Text,{size:4,className:(0,i.cn)("text-info-primary laptop:text-[18px] text-[16px]",e?.itemCurrentPrice),children:g}),v&&m?.formattedPrice&&(0,t.jsx)(n.Text,{size:4,className:(0,i.cn)("text-info-tertiary laptop:text-[18px] text-[16px] line-through",e?.itemOriginalPrice),children:m.formattedPrice})]}),(0,t.jsxs)("div",{className:(0,i.cn)("flex items-center",e?.quantityControl),children:[(0,t.jsx)("button",{type:"button",onClick:p,disabled:u<=0,className:(0,i.cn)("border-lines flex size-8 items-center justify-center border","laptop:size-10","text-info-primary hover:bg-container-secondary-0 transition-colors","disabled:cursor-not-allowed disabled:opacity-50",e?.quantityButton),"aria-label":"Decrease quantity",children:(0,t.jsx)(T,{className:"laptop:size-3 size-[10.67px]"})}),(0,t.jsx)("div",{className:(0,i.cn)("border-lines text-info-primary flex size-8 items-center justify-center border-y text-center text-sm font-semibold","laptop:size-10 laptop:text-base",e?.quantityValue),children:u}),(0,t.jsx)("button",{type:"button",onClick:l,className:(0,i.cn)("border-lines flex size-8 items-center justify-center border","laptop:size-10","text-info-primary hover:bg-container-secondary-0 transition-colors",e?.quantityButton),"aria-label":"Increase quantity",children:(0,t.jsx)(k,{className:"laptop:size-3 size-[10.67px]"})})]})]})]})]})},f=({open:a,onOpenChange:e,cart:l,copy:p,classNames:o={},onIncreaseQuantity:u,onDecreaseQuantity:y,onQuantityChange:c})=>{const b=p?.title||"Selected ({count})",d=p?.emptyText||"Your cart is empty",m=l?.lineItems?.reduce((r,s)=>r+(s?.quantity||0),0)||0,x=l?.lineItems||[],g=x.length===0,v=(r,s)=>{u?.(r,s),c?.(r,s+1)},C=(r,s)=>{s>1&&(y?.(r,s),c?.(r,s-1))};return(0,t.jsx)(n.Dialog,{open:a,onOpenChange:e,children:(0,t.jsxs)(n.DialogContent,{className:(0,i.cn)("bg-container-secondary-0 fixed left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 flex-col gap-0 overflow-hidden p-0","rounded-box max-h-[80vh] w-[calc(100%-64px)] min-w-[326px]","laptop:w-full laptop:max-w-[560px] laptop:rounded-box",o?.root),children:[(0,t.jsx)(n.DialogHeader,{className:(0,i.cn)("bg-container-secondary-0 flex flex-row items-start justify-between gap-4 px-4 pb-2 pt-4",o?.header),children:(0,t.jsx)(n.DialogTitle,{asChild:!0,children:(0,t.jsx)(n.Heading,{as:"h3",size:2,className:(0,i.cn)("text-info-primary font-bold",o?.title),children:b.replace("{count}",m.toString())})})}),(0,t.jsx)("div",{className:(0,i.cn)("bg-container-secondary-0 h- flex flex-col gap-2 overflow-y-auto px-4 py-2",o?.content),children:g?(0,t.jsx)("div",{className:"flex items-center justify-center py-8",children:(0,t.jsx)(n.Text,{size:2,className:"text-info-tertiary",children:d})}):(0,t.jsx)("div",{className:(0,i.cn)("flex flex-col gap-2",o?.itemList),children:x.map(r=>(0,t.jsx)(q,{item:r,classNames:o,onIncrease:()=>v(r.id,r.quantity),onDecrease:()=>C(r.id,r.quantity)},r.id))})}),(0,t.jsx)("div",{className:"bg-container-secondary-0 h-8 w-full"})]})})};f.displayName="MiniCartDialog";var M=f;
+"use strict";"use client";var h=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var I=Object.prototype.hasOwnProperty;var N=(a,e)=>{for(var l in e)h(a,l,{get:e[l],enumerable:!0})},z=(a,e,l,p)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of D(e))!I.call(a,o)&&o!==l&&h(a,o,{get:()=>e[o],enumerable:!(p=w(e,o))||p.enumerable});return a};var P=a=>z(h({},"__esModule",{value:!0}),a);var L={};N(L,{MiniCartDialog:()=>f,default:()=>M});module.exports=P(L);var t=require("react/jsx-runtime"),i=require("../../helpers/index.js"),n=require("../../components/index.js");const T=({className:a})=>(0,t.jsx)("svg",{className:a,width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M2 6H10",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),k=({className:a})=>(0,t.jsx)("svg",{className:a,width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M6 2V10M2 6H10",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),q=({item:a,classNames:e,onIncrease:l,onDecrease:p})=>{const{merchandise:o,quantity:u,cost:y}=a,{image:c,title:b}=o,{totalAmount:d,subtotalAmount:m}=y,x=b||o.sku||"Product",g=d?.formattedPrice||"",v=m&&d&&parseFloat(m.amount)>parseFloat(d.amount);return(0,t.jsxs)("div",{className:(0,i.cn)("bg-container-primary rounded-box flex items-center gap-2 px-2 py-4","laptop:bg-container-primary laptop:gap-4 laptop:p-4",e?.item),children:[(0,t.jsx)("div",{className:(0,i.cn)("rounded-box relative size-16 shrink-0 overflow-hidden","laptop:size-20",e?.itemImage),children:c?.url&&(0,t.jsx)("img",{src:c.url,alt:c.altText||x,className:"size-full object-cover"})}),(0,t.jsxs)("div",{className:(0,i.cn)("laptop:gap-4 flex flex-1 flex-col gap-2",e?.itemInfo),children:[(0,t.jsx)(n.Text,{as:"p",size:3,className:(0,i.cn)("text-info-primary laptop:text-[16px] line-clamp-2 text-[14px]",e?.itemTitle),children:x}),(0,t.jsxs)("div",{className:"laptop:flex-row laptop:items-center laptop:justify-between flex flex-col items-start gap-1",children:[(0,t.jsxs)("div",{className:(0,i.cn)("flex items-center gap-1",e?.itemPrice),children:[g&&(0,t.jsx)(n.Text,{size:4,className:(0,i.cn)("text-info-primary laptop:text-[18px] text-[16px]",e?.itemCurrentPrice),children:g}),v&&m?.formattedPrice&&(0,t.jsx)(n.Text,{size:4,className:(0,i.cn)("text-info-tertiary laptop:text-[18px] text-[16px] line-through",e?.itemOriginalPrice),children:m.formattedPrice})]}),(0,t.jsxs)("div",{className:(0,i.cn)("flex items-center",e?.quantityControl),children:[(0,t.jsx)("button",{type:"button",onClick:p,disabled:u<=0,className:(0,i.cn)("border-lines flex size-8 items-center justify-center border","laptop:size-10","text-info-primary hover:bg-container-secondary-0 transition-colors","disabled:cursor-not-allowed disabled:opacity-50",e?.quantityButton),"aria-label":"Decrease quantity",children:(0,t.jsx)(T,{className:"laptop:size-3 size-[10.67px]"})}),(0,t.jsx)("div",{className:(0,i.cn)("border-lines text-info-primary flex size-8 items-center justify-center border-y text-center text-sm font-semibold","laptop:size-10 laptop:text-base",e?.quantityValue),children:u}),(0,t.jsx)("button",{type:"button",onClick:l,className:(0,i.cn)("border-lines flex size-8 items-center justify-center border","laptop:size-10","text-info-primary hover:bg-container-secondary-0 transition-colors",e?.quantityButton),"aria-label":"Increase quantity",children:(0,t.jsx)(k,{className:"laptop:size-3 size-[10.67px]"})})]})]})]})]})},f=({open:a,onOpenChange:e,cart:l,copy:p,classNames:o={},onIncreaseQuantity:u,onDecreaseQuantity:y,onQuantityChange:c})=>{const b=p?.title||"Selected ({count})",d=p?.emptyText||"Your cart is empty",m=l?.lineItems?.reduce((r,s)=>r+(s?.quantity||0),0)||0,x=l?.lineItems||[],g=x.length===0,v=(r,s)=>{u?.(r,s),c?.(r,s+1)},C=(r,s)=>{s>0&&(y?.(r,s),c?.(r,s-1))};return(0,t.jsx)(n.Dialog,{open:a,onOpenChange:e,children:(0,t.jsxs)(n.DialogContent,{className:(0,i.cn)("bg-container-secondary-0 fixed left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 flex-col gap-0 overflow-hidden p-0","rounded-box max-h-[80vh] w-[calc(100%-64px)] min-w-[326px]","laptop:w-full laptop:max-w-[560px] laptop:rounded-box",o?.root),children:[(0,t.jsx)(n.DialogHeader,{className:(0,i.cn)("bg-container-secondary-0 flex flex-row items-start justify-between gap-4 px-4 pb-2 pt-4",o?.header),children:(0,t.jsx)(n.DialogTitle,{asChild:!0,children:(0,t.jsx)(n.Heading,{as:"h3",size:2,className:(0,i.cn)("text-info-primary font-bold",o?.title),children:b.replace("{count}",m.toString())})})}),(0,t.jsx)("div",{className:(0,i.cn)("bg-container-secondary-0 h- flex flex-col gap-2 overflow-y-auto px-4 py-2",o?.content),children:g?(0,t.jsx)("div",{className:"flex items-center justify-center py-8",children:(0,t.jsx)(n.Text,{size:2,className:"text-info-tertiary",children:d})}):(0,t.jsx)("div",{className:(0,i.cn)("flex flex-col gap-2",o?.itemList),children:x.map(r=>(0,t.jsx)(q,{item:r,classNames:o,onIncrease:()=>v(r.id,r.quantity),onDecrease:()=>C(r.id,r.quantity)},r.id))})}),(0,t.jsx)("div",{className:"bg-container-secondary-0 h-8 w-full"})]})})};f.displayName="MiniCartDialog";var M=f;
 //# sourceMappingURL=MiniCartDialog.js.map

package/dist/cjs/biz-components/MiniCart/MiniCartDialog.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MiniCart/MiniCartDialog.tsx"],
-  "sourcesContent": ["'use client'\n\nimport { cn } from '../../helpers/index.js'\nimport { Heading, Text, Dialog, DialogContent, DialogHeader, DialogTitle } from '../../components/index.js'\nimport type { CartLineItem, Cart } from './index.js'\n\n/**\n * \u8D2D\u7269\u8F66\u6570\u636E\u7C7B\u578B - \u590D\u7528 MiniCart \u7684\u7C7B\u578B\u5B9A\u4E49\n */\nexport interface CartData {\n  id: string\n  checkoutUrl: string\n  lineItems: CartLineItem[]\n}\n\n// \u91CD\u65B0\u5BFC\u51FA\u7C7B\u578B\u4F9B\u5916\u90E8\u4F7F\u7528\nexport type { CartLineItem, Cart }\n\n/**\n * \u6587\u6848\u914D\u7F6E\n */\nexport interface MiniCartDialogCopy {\n  /** \u6807\u9898\u6587\u6848\uFF0C{count} \u4F1A\u88AB\u66FF\u6362\u4E3A\u5546\u54C1\u6570\u91CF */\n  title?: string\n  /** \u7A7A\u8D2D\u7269\u8F66\u63D0\u793A */\n  emptyText?: string\n}\n\nexport type MiniCartDialogSemanticName =\n  | 'root'\n  | 'header'\n  | 'title'\n  | 'content'\n  | 'itemList'\n  | 'item'\n  | 'itemImage'\n  | 'itemInfo'\n  | 'itemTitle'\n  | 'itemPrice'\n  | 'itemCurrentPrice'\n  | 'itemOriginalPrice'\n  | 'quantityControl'\n  | 'quantityButton'\n  | 'quantityValue'\n\nexport interface MiniCartDialogProps {\n  /** \u662F\u5426\u6253\u5F00\u5F39\u7A97 */\n  open: boolean\n  /** \u5173\u95ED\u5F39\u7A97\u56DE\u8C03 */\n  onOpenChange: (open: boolean) => void\n  /** \u8D2D\u7269\u8F66\u6570\u636E */\n  cart: CartData\n  /** \u6587\u6848\u914D\u7F6E */\n  copy?: MiniCartDialogCopy\n  /** \u5404\u90E8\u5206\u7684\u81EA\u5B9A\u4E49\u6837\u5F0F\u7C7B\u540D */\n  classNames?: Partial<Record<MiniCartDialogSemanticName, string>>\n  /**\n   * \u589E\u52A0\u5546\u54C1\u6570\u91CF\u56DE\u8C03\n   * @param lineItemId \u5546\u54C1\u884CID\n   * @param currentQuantity \u5F53\u524D\u6570\u91CF\n   */\n  onIncreaseQuantity?: (lineItemId: string, currentQuantity: number) => void\n  /**\n   * \u51CF\u5C11\u5546\u54C1\u6570\u91CF\u56DE\u8C03\n   * @param lineItemId \u5546\u54C1\u884CID\n   * @param currentQuantity \u5F53\u524D\u6570\u91CF\n   */\n  onDecreaseQuantity?: (lineItemId: string, currentQuantity: number) => void\n  /**\n   * \u6570\u91CF\u53D8\u66F4\u56DE\u8C03\n   * @param lineItemId \u5546\u54C1\u884CID\n   * @param quantity \u65B0\u6570\u91CF\n   */\n  onQuantityChange?: (lineItemId: string, quantity: number) => void\n}\n\n/**\n * MinusIcon - \u51CF\u53F7\u56FE\u6807\n */\nconst MinusIcon = ({ className }: { className?: string }) => (\n  <svg className={className} width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M2 6H10\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\n/**\n * PlusIcon - \u52A0\u53F7\u56FE\u6807\n */\nconst PlusIcon = ({ className }: { className?: string }) => (\n  <svg className={className} width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M6 2V10M2 6H10\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\n/**\n * CartItem - \u8D2D\u7269\u8F66\u5546\u54C1\u9879\u7EC4\u4EF6\n */\ninterface CartItemProps {\n  item: CartLineItem\n  classNames?: Partial<Record<MiniCartDialogSemanticName, string>>\n  onIncrease?: () => void\n  onDecrease?: () => void\n}\n\nconst CartItem = ({ item, classNames, onIncrease, onDecrease }: CartItemProps) => {\n  const { merchandise, quantity, cost } = item\n  const { image, title } = merchandise\n  const { totalAmount, subtotalAmount } = cost\n\n  // \u663E\u793A\u6807\u9898\uFF08\u56DE\u9000\u5230 SKU\uFF09\n  const displayTitle = title || merchandise.sku || 'Product'\n  // \u663E\u793A\u4EF7\u683C\uFF08\u73B0\u4EF7 = totalAmount\uFF09\n  const displayPrice = totalAmount?.formattedPrice || ''\n  // \u662F\u5426\u6709\u6298\u6263\uFF08\u539F\u4EF7 subtotalAmount \u5927\u4E8E\u73B0\u4EF7 totalAmount\uFF09\n  const hasDiscount =\n    subtotalAmount && totalAmount && parseFloat(subtotalAmount.amount) > parseFloat(totalAmount.amount)\n\n  return (\n    <div\n      className={cn(\n        // \u79FB\u52A8\u7AEF\uFF1A\u7070\u8272\u80CC\u666F\uFF0C\u8F83\u5C0F\u95F4\u8DDD\n        'bg-container-primary rounded-box flex items-center gap-2 px-2 py-4',\n        // \u684C\u9762\u7AEF\uFF1A\u767D\u8272\u80CC\u666F\uFF0C\u8F83\u5927\u95F4\u8DDD\n        'laptop:bg-container-primary laptop:gap-4 laptop:p-4',\n        classNames?.item\n      )}\n    >\n      {/* \u5546\u54C1\u56FE\u7247 - \u79FB\u52A8\u7AEF 64px\uFF0C\u684C\u9762\u7AEF 80px */}\n      <div\n        className={cn('rounded-box relative size-16 shrink-0 overflow-hidden', 'laptop:size-20', classNames?.itemImage)}\n      >\n        {image?.url && <img src={image.url} alt={image.altText || displayTitle} className=\"size-full object-cover\" />}\n      </div>\n\n      {/* \u5546\u54C1\u4FE1\u606F */}\n      <div className={cn('laptop:gap-4 flex flex-1 flex-col gap-2', classNames?.itemInfo)}>\n        {/* \u5546\u54C1\u540D\u79F0 - \u79FB\u52A8\u7AEF\u8F83\u5C0F\u5B57\u4F53 */}\n        <Text\n          as=\"p\"\n          size={3}\n          className={cn('text-info-primary laptop:text-[16px] line-clamp-2 text-[14px]', classNames?.itemTitle)}\n        >\n          {displayTitle}\n        </Text>\n\n        {/* \u4EF7\u683C\u548C\u6570\u91CF\u63A7\u5236 - \u79FB\u52A8\u7AEF\u5782\u76F4\u6392\u5217\uFF0C\u684C\u9762\u7AEF\u6C34\u5E73\u6392\u5217 */}\n        <div className=\"laptop:flex-row laptop:items-center laptop:justify-between flex flex-col items-start gap-1\">\n          {/* \u4EF7\u683C\u533A\u57DF */}\n          <div className={cn('flex items-center gap-1', classNames?.itemPrice)}>\n            {displayPrice && (\n              <Text\n                size={4}\n                className={cn('text-info-primary laptop:text-[18px] text-[16px]', classNames?.itemCurrentPrice)}\n              >\n                {displayPrice}\n              </Text>\n            )}\n            {hasDiscount && subtotalAmount?.formattedPrice && (\n              <Text\n                size={4}\n                className={cn(\n                  'text-info-tertiary laptop:text-[18px] text-[16px] line-through',\n                  classNames?.itemOriginalPrice\n                )}\n              >\n                {subtotalAmount.formattedPrice}\n              </Text>\n            )}\n          </div>\n\n          {/* \u6570\u91CF\u63A7\u5236 - \u79FB\u52A8\u7AEF 32px \u6309\u94AE\uFF0C\u684C\u9762\u7AEF 40px \u6309\u94AE */}\n          <div className={cn('flex items-center', classNames?.quantityControl)}>\n            {/* \u51CF\u5C11\u6309\u94AE */}\n            <button\n              type=\"button\"\n              onClick={onDecrease}\n              disabled={quantity <= 0}\n              className={cn(\n                'border-lines flex size-8 items-center justify-center border',\n                'laptop:size-10',\n                'text-info-primary hover:bg-container-secondary-0 transition-colors',\n                'disabled:cursor-not-allowed disabled:opacity-50',\n                classNames?.quantityButton\n              )}\n              aria-label=\"Decrease quantity\"\n            >\n              <MinusIcon className=\"laptop:size-3 size-[10.67px]\" />\n            </button>\n\n            {/* \u6570\u91CF\u663E\u793A */}\n            <div\n              className={cn(\n                'border-lines text-info-primary flex size-8 items-center justify-center border-y text-center text-sm font-semibold',\n                'laptop:size-10 laptop:text-base',\n                classNames?.quantityValue\n              )}\n            >\n              {quantity}\n            </div>\n\n            {/* \u589E\u52A0\u6309\u94AE */}\n            <button\n              type=\"button\"\n              onClick={onIncrease}\n              className={cn(\n                'border-lines flex size-8 items-center justify-center border',\n                'laptop:size-10',\n                'text-info-primary hover:bg-container-secondary-0 transition-colors',\n                classNames?.quantityButton\n              )}\n              aria-label=\"Increase quantity\"\n            >\n              <PlusIcon className=\"laptop:size-3 size-[10.67px]\" />\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/**\n * MiniCartDialog - \u8FF7\u4F60\u8D2D\u7269\u8F66\u5F39\u7A97\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u5C55\u793A\u8D2D\u7269\u8F66\u5546\u54C1\u5217\u8868\uFF0C\u652F\u6301\u8C03\u6574\u5546\u54C1\u6570\u91CF\n */\nconst MiniCartDialog = ({\n  open,\n  onOpenChange,\n  cart,\n  copy,\n  classNames = {},\n  onIncreaseQuantity,\n  onDecreaseQuantity,\n  onQuantityChange,\n}: MiniCartDialogProps) => {\n  // \u6587\u6848\u914D\u7F6E\n  const titleText = copy?.title || 'Selected ({count})'\n  const emptyText = copy?.emptyText || 'Your cart is empty'\n\n  // \u8BA1\u7B97\u5546\u54C1\u603B\u6570\u91CF\n  const totalQuantity = cart?.lineItems?.reduce((total, item) => total + (item?.quantity || 0), 0) || 0\n\n  const items = cart?.lineItems || []\n  const isEmpty = items.length === 0\n\n  // \u5904\u7406\u6570\u91CF\u589E\u52A0\n  const handleIncrease = (lineItemId: string, currentQuantity: number) => {\n    onIncreaseQuantity?.(lineItemId, currentQuantity)\n    onQuantityChange?.(lineItemId, currentQuantity + 1)\n  }\n\n  // \u5904\u7406\u6570\u91CF\u51CF\u5C11\n  const handleDecrease = (lineItemId: string, currentQuantity: number) => {\n    if (currentQuantity > 1) {\n      onDecreaseQuantity?.(lineItemId, currentQuantity)\n      onQuantityChange?.(lineItemId, currentQuantity - 1)\n    }\n  }\n\n  return (\n    <Dialog open={open} onOpenChange={onOpenChange}>\n      <DialogContent\n        className={cn(\n          // \u57FA\u7840\u6837\u5F0F + \u5C45\u4E2D\u5B9A\u4F4D\n          'bg-container-secondary-0 fixed left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 flex-col gap-0 overflow-hidden p-0',\n          // \u79FB\u52A8\u7AEF\uFF1A\u5C45\u4E2D\u5F39\u7A97\uFF0C\u6700\u5C0F\u5BBD\u5EA6326px\uFF0C\u5DE6\u53F3\u8DDD\u5C4F\u5E55\u8FB9\u7F1832px\n          'rounded-box max-h-[80vh] w-[calc(100%-64px)] min-w-[326px]',\n          // \u684C\u9762\u7AEF\uFF1A\u6700\u5927\u5BBD\u5EA6560px\n          'laptop:w-full laptop:max-w-[560px] laptop:rounded-box',\n          classNames?.root\n        )}\n      >\n        {/* \u5934\u90E8 */}\n        <DialogHeader\n          className={cn(\n            'bg-container-secondary-0 flex flex-row items-start justify-between gap-4 px-4 pb-2 pt-4',\n            classNames?.header\n          )}\n        >\n          <DialogTitle asChild>\n            <Heading as=\"h3\" size={2} className={cn('text-info-primary font-bold', classNames?.title)}>\n              {titleText.replace('{count}', totalQuantity.toString())}\n            </Heading>\n          </DialogTitle>\n        </DialogHeader>\n\n        {/* \u5546\u54C1\u5217\u8868 */}\n        <div\n          className={cn(\n            'bg-container-secondary-0 h- flex flex-col gap-2 overflow-y-auto px-4 py-2',\n            classNames?.content\n          )}\n        >\n          {isEmpty ? (\n            <div className=\"flex items-center justify-center py-8\">\n              <Text size={2} className=\"text-info-tertiary\">\n                {emptyText}\n              </Text>\n            </div>\n          ) : (\n            <div className={cn('flex flex-col gap-2', classNames?.itemList)}>\n              {items.map(item => (\n                <CartItem\n                  key={item.id}\n                  item={item}\n                  classNames={classNames}\n                  onIncrease={() => handleIncrease(item.id, item.quantity)}\n                  onDecrease={() => handleDecrease(item.id, item.quantity)}\n                />\n              ))}\n            </div>\n          )}\n        </div>\n\n        {/* \u5E95\u90E8\u5B89\u5168\u533A\u57DF */}\n        <div className=\"bg-container-secondary-0 h-8 w-full\" />\n      </DialogContent>\n    </Dialog>\n  )\n}\n\nMiniCartDialog.displayName = 'MiniCartDialog'\n\nexport default MiniCartDialog\nexport { MiniCartDialog }\n"],
+  "sourcesContent": ["'use client'\n\nimport { cn } from '../../helpers/index.js'\nimport { Heading, Text, Dialog, DialogContent, DialogHeader, DialogTitle } from '../../components/index.js'\nimport type { CartLineItem, Cart } from './index.js'\n\n/**\n * \u8D2D\u7269\u8F66\u6570\u636E\u7C7B\u578B - \u590D\u7528 MiniCart \u7684\u7C7B\u578B\u5B9A\u4E49\n */\nexport interface CartData {\n  id: string\n  checkoutUrl: string\n  lineItems: CartLineItem[]\n}\n\n// \u91CD\u65B0\u5BFC\u51FA\u7C7B\u578B\u4F9B\u5916\u90E8\u4F7F\u7528\nexport type { CartLineItem, Cart }\n\n/**\n * \u6587\u6848\u914D\u7F6E\n */\nexport interface MiniCartDialogCopy {\n  /** \u6807\u9898\u6587\u6848\uFF0C{count} \u4F1A\u88AB\u66FF\u6362\u4E3A\u5546\u54C1\u6570\u91CF */\n  title?: string\n  /** \u7A7A\u8D2D\u7269\u8F66\u63D0\u793A */\n  emptyText?: string\n}\n\nexport type MiniCartDialogSemanticName =\n  | 'root'\n  | 'header'\n  | 'title'\n  | 'content'\n  | 'itemList'\n  | 'item'\n  | 'itemImage'\n  | 'itemInfo'\n  | 'itemTitle'\n  | 'itemPrice'\n  | 'itemCurrentPrice'\n  | 'itemOriginalPrice'\n  | 'quantityControl'\n  | 'quantityButton'\n  | 'quantityValue'\n\nexport interface MiniCartDialogProps {\n  /** \u662F\u5426\u6253\u5F00\u5F39\u7A97 */\n  open: boolean\n  /** \u5173\u95ED\u5F39\u7A97\u56DE\u8C03 */\n  onOpenChange: (open: boolean) => void\n  /** \u8D2D\u7269\u8F66\u6570\u636E */\n  cart: CartData\n  /** \u6587\u6848\u914D\u7F6E */\n  copy?: MiniCartDialogCopy\n  /** \u5404\u90E8\u5206\u7684\u81EA\u5B9A\u4E49\u6837\u5F0F\u7C7B\u540D */\n  classNames?: Partial<Record<MiniCartDialogSemanticName, string>>\n  /**\n   * \u589E\u52A0\u5546\u54C1\u6570\u91CF\u56DE\u8C03\n   * @param lineItemId \u5546\u54C1\u884CID\n   * @param currentQuantity \u5F53\u524D\u6570\u91CF\n   */\n  onIncreaseQuantity?: (lineItemId: string, currentQuantity: number) => void\n  /**\n   * \u51CF\u5C11\u5546\u54C1\u6570\u91CF\u56DE\u8C03\n   * @param lineItemId \u5546\u54C1\u884CID\n   * @param currentQuantity \u5F53\u524D\u6570\u91CF\n   */\n  onDecreaseQuantity?: (lineItemId: string, currentQuantity: number) => void\n  /**\n   * \u6570\u91CF\u53D8\u66F4\u56DE\u8C03\n   * @param lineItemId \u5546\u54C1\u884CID\n   * @param quantity \u65B0\u6570\u91CF\n   */\n  onQuantityChange?: (lineItemId: string, quantity: number) => void\n}\n\n/**\n * MinusIcon - \u51CF\u53F7\u56FE\u6807\n */\nconst MinusIcon = ({ className }: { className?: string }) => (\n  <svg className={className} width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M2 6H10\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\n/**\n * PlusIcon - \u52A0\u53F7\u56FE\u6807\n */\nconst PlusIcon = ({ className }: { className?: string }) => (\n  <svg className={className} width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M6 2V10M2 6H10\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\n/**\n * CartItem - \u8D2D\u7269\u8F66\u5546\u54C1\u9879\u7EC4\u4EF6\n */\ninterface CartItemProps {\n  item: CartLineItem\n  classNames?: Partial<Record<MiniCartDialogSemanticName, string>>\n  onIncrease?: () => void\n  onDecrease?: () => void\n}\n\nconst CartItem = ({ item, classNames, onIncrease, onDecrease }: CartItemProps) => {\n  const { merchandise, quantity, cost } = item\n  const { image, title } = merchandise\n  const { totalAmount, subtotalAmount } = cost\n\n  // \u663E\u793A\u6807\u9898\uFF08\u56DE\u9000\u5230 SKU\uFF09\n  const displayTitle = title || merchandise.sku || 'Product'\n  // \u663E\u793A\u4EF7\u683C\uFF08\u73B0\u4EF7 = totalAmount\uFF09\n  const displayPrice = totalAmount?.formattedPrice || ''\n  // \u662F\u5426\u6709\u6298\u6263\uFF08\u539F\u4EF7 subtotalAmount \u5927\u4E8E\u73B0\u4EF7 totalAmount\uFF09\n  const hasDiscount =\n    subtotalAmount && totalAmount && parseFloat(subtotalAmount.amount) > parseFloat(totalAmount.amount)\n\n  return (\n    <div\n      className={cn(\n        // \u79FB\u52A8\u7AEF\uFF1A\u7070\u8272\u80CC\u666F\uFF0C\u8F83\u5C0F\u95F4\u8DDD\n        'bg-container-primary rounded-box flex items-center gap-2 px-2 py-4',\n        // \u684C\u9762\u7AEF\uFF1A\u767D\u8272\u80CC\u666F\uFF0C\u8F83\u5927\u95F4\u8DDD\n        'laptop:bg-container-primary laptop:gap-4 laptop:p-4',\n        classNames?.item\n      )}\n    >\n      {/* \u5546\u54C1\u56FE\u7247 - \u79FB\u52A8\u7AEF 64px\uFF0C\u684C\u9762\u7AEF 80px */}\n      <div\n        className={cn('rounded-box relative size-16 shrink-0 overflow-hidden', 'laptop:size-20', classNames?.itemImage)}\n      >\n        {image?.url && <img src={image.url} alt={image.altText || displayTitle} className=\"size-full object-cover\" />}\n      </div>\n\n      {/* \u5546\u54C1\u4FE1\u606F */}\n      <div className={cn('laptop:gap-4 flex flex-1 flex-col gap-2', classNames?.itemInfo)}>\n        {/* \u5546\u54C1\u540D\u79F0 - \u79FB\u52A8\u7AEF\u8F83\u5C0F\u5B57\u4F53 */}\n        <Text\n          as=\"p\"\n          size={3}\n          className={cn('text-info-primary laptop:text-[16px] line-clamp-2 text-[14px]', classNames?.itemTitle)}\n        >\n          {displayTitle}\n        </Text>\n\n        {/* \u4EF7\u683C\u548C\u6570\u91CF\u63A7\u5236 - \u79FB\u52A8\u7AEF\u5782\u76F4\u6392\u5217\uFF0C\u684C\u9762\u7AEF\u6C34\u5E73\u6392\u5217 */}\n        <div className=\"laptop:flex-row laptop:items-center laptop:justify-between flex flex-col items-start gap-1\">\n          {/* \u4EF7\u683C\u533A\u57DF */}\n          <div className={cn('flex items-center gap-1', classNames?.itemPrice)}>\n            {displayPrice && (\n              <Text\n                size={4}\n                className={cn('text-info-primary laptop:text-[18px] text-[16px]', classNames?.itemCurrentPrice)}\n              >\n                {displayPrice}\n              </Text>\n            )}\n            {hasDiscount && subtotalAmount?.formattedPrice && (\n              <Text\n                size={4}\n                className={cn(\n                  'text-info-tertiary laptop:text-[18px] text-[16px] line-through',\n                  classNames?.itemOriginalPrice\n                )}\n              >\n                {subtotalAmount.formattedPrice}\n              </Text>\n            )}\n          </div>\n\n          {/* \u6570\u91CF\u63A7\u5236 - \u79FB\u52A8\u7AEF 32px \u6309\u94AE\uFF0C\u684C\u9762\u7AEF 40px \u6309\u94AE */}\n          <div className={cn('flex items-center', classNames?.quantityControl)}>\n            {/* \u51CF\u5C11\u6309\u94AE */}\n            <button\n              type=\"button\"\n              onClick={onDecrease}\n              disabled={quantity <= 0}\n              className={cn(\n                'border-lines flex size-8 items-center justify-center border',\n                'laptop:size-10',\n                'text-info-primary hover:bg-container-secondary-0 transition-colors',\n                'disabled:cursor-not-allowed disabled:opacity-50',\n                classNames?.quantityButton\n              )}\n              aria-label=\"Decrease quantity\"\n            >\n              <MinusIcon className=\"laptop:size-3 size-[10.67px]\" />\n            </button>\n\n            {/* \u6570\u91CF\u663E\u793A */}\n            <div\n              className={cn(\n                'border-lines text-info-primary flex size-8 items-center justify-center border-y text-center text-sm font-semibold',\n                'laptop:size-10 laptop:text-base',\n                classNames?.quantityValue\n              )}\n            >\n              {quantity}\n            </div>\n\n            {/* \u589E\u52A0\u6309\u94AE */}\n            <button\n              type=\"button\"\n              onClick={onIncrease}\n              className={cn(\n                'border-lines flex size-8 items-center justify-center border',\n                'laptop:size-10',\n                'text-info-primary hover:bg-container-secondary-0 transition-colors',\n                classNames?.quantityButton\n              )}\n              aria-label=\"Increase quantity\"\n            >\n              <PlusIcon className=\"laptop:size-3 size-[10.67px]\" />\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/**\n * MiniCartDialog - \u8FF7\u4F60\u8D2D\u7269\u8F66\u5F39\u7A97\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u5C55\u793A\u8D2D\u7269\u8F66\u5546\u54C1\u5217\u8868\uFF0C\u652F\u6301\u8C03\u6574\u5546\u54C1\u6570\u91CF\n */\nconst MiniCartDialog = ({\n  open,\n  onOpenChange,\n  cart,\n  copy,\n  classNames = {},\n  onIncreaseQuantity,\n  onDecreaseQuantity,\n  onQuantityChange,\n}: MiniCartDialogProps) => {\n  // \u6587\u6848\u914D\u7F6E\n  const titleText = copy?.title || 'Selected ({count})'\n  const emptyText = copy?.emptyText || 'Your cart is empty'\n\n  // \u8BA1\u7B97\u5546\u54C1\u603B\u6570\u91CF\n  const totalQuantity = cart?.lineItems?.reduce((total, item) => total + (item?.quantity || 0), 0) || 0\n\n  const items = cart?.lineItems || []\n  const isEmpty = items.length === 0\n\n  // \u5904\u7406\u6570\u91CF\u589E\u52A0\n  const handleIncrease = (lineItemId: string, currentQuantity: number) => {\n    onIncreaseQuantity?.(lineItemId, currentQuantity)\n    onQuantityChange?.(lineItemId, currentQuantity + 1)\n  }\n\n  // \u5904\u7406\u6570\u91CF\u51CF\u5C11\n  const handleDecrease = (lineItemId: string, currentQuantity: number) => {\n    if (currentQuantity > 0) {\n      onDecreaseQuantity?.(lineItemId, currentQuantity)\n      onQuantityChange?.(lineItemId, currentQuantity - 1)\n    }\n  }\n\n  return (\n    <Dialog open={open} onOpenChange={onOpenChange}>\n      <DialogContent\n        className={cn(\n          // \u57FA\u7840\u6837\u5F0F + \u5C45\u4E2D\u5B9A\u4F4D\n          'bg-container-secondary-0 fixed left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 flex-col gap-0 overflow-hidden p-0',\n          // \u79FB\u52A8\u7AEF\uFF1A\u5C45\u4E2D\u5F39\u7A97\uFF0C\u6700\u5C0F\u5BBD\u5EA6326px\uFF0C\u5DE6\u53F3\u8DDD\u5C4F\u5E55\u8FB9\u7F1832px\n          'rounded-box max-h-[80vh] w-[calc(100%-64px)] min-w-[326px]',\n          // \u684C\u9762\u7AEF\uFF1A\u6700\u5927\u5BBD\u5EA6560px\n          'laptop:w-full laptop:max-w-[560px] laptop:rounded-box',\n          classNames?.root\n        )}\n      >\n        {/* \u5934\u90E8 */}\n        <DialogHeader\n          className={cn(\n            'bg-container-secondary-0 flex flex-row items-start justify-between gap-4 px-4 pb-2 pt-4',\n            classNames?.header\n          )}\n        >\n          <DialogTitle asChild>\n            <Heading as=\"h3\" size={2} className={cn('text-info-primary font-bold', classNames?.title)}>\n              {titleText.replace('{count}', totalQuantity.toString())}\n            </Heading>\n          </DialogTitle>\n        </DialogHeader>\n\n        {/* \u5546\u54C1\u5217\u8868 */}\n        <div\n          className={cn(\n            'bg-container-secondary-0 h- flex flex-col gap-2 overflow-y-auto px-4 py-2',\n            classNames?.content\n          )}\n        >\n          {isEmpty ? (\n            <div className=\"flex items-center justify-center py-8\">\n              <Text size={2} className=\"text-info-tertiary\">\n                {emptyText}\n              </Text>\n            </div>\n          ) : (\n            <div className={cn('flex flex-col gap-2', classNames?.itemList)}>\n              {items.map(item => (\n                <CartItem\n                  key={item.id}\n                  item={item}\n                  classNames={classNames}\n                  onIncrease={() => handleIncrease(item.id, item.quantity)}\n                  onDecrease={() => handleDecrease(item.id, item.quantity)}\n                />\n              ))}\n            </div>\n          )}\n        </div>\n\n        {/* \u5E95\u90E8\u5B89\u5168\u533A\u57DF */}\n        <div className=\"bg-container-secondary-0 h-8 w-full\" />\n      </DialogContent>\n    </Dialog>\n  )\n}\n\nMiniCartDialog.displayName = 'MiniCartDialog'\n\nexport default MiniCartDialog\nexport { MiniCartDialog }\n"],
   "mappings": "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",
   "names": ["MiniCartDialog_exports", "__export", "MiniCartDialog", "MiniCartDialog_default", "__toCommonJS", "import_jsx_runtime", "import_helpers", "import_components", "MinusIcon", "className", "PlusIcon", "CartItem", "item", "classNames", "onIncrease", "onDecrease", "merchandise", "quantity", "cost", "image", "title", "totalAmount", "subtotalAmount", "displayTitle", "displayPrice", "hasDiscount", "open", "onOpenChange", "cart", "copy", "onIncreaseQuantity", "onDecreaseQuantity", "onQuantityChange", "titleText", "emptyText", "totalQuantity", "total", "items", "isEmpty", "handleIncrease", "lineItemId", "currentQuantity", "handleDecrease"]
 }

package/dist/cjs/biz-components/MiniCart/index.d.ts

@@ -1,5 +1,29 @@
 import * as React from 'react';
-export type MiniCartSemanticName = 'root' | 'content' | 'cartInfo' | 'cartTitle' | 'cartDescription' | 'priceSection' | 'totalPrice' | 'originalPrice' | 'saveAmount' | 'actionButton' | 'itemsGrid' | 'itemGridContainer' | 'gridItem' | 'gridItemOverlay' | 'expandButton';
+import type { Img } from '../../types/props.js';
+export type MiniCartSemanticName = 'root' | 'content' | 'cartInfo' | 'cartTitle' | 'cartDescription' | 'priceSection' | 'totalPrice' | 'originalPrice' | 'saveAmount' | 'actionButton' | 'itemsGrid' | 'itemGridContainer' | 'gridItem' | 'gridItemOverlay' | 'expandButton' | 'circleProgress' | 'mobileViewMoreButton';
+/**
+ * 圆形进度条配置
+ */
+export interface CircleProgressConfig {
+    /** 总阶段数 (1-4) */
+    totalSteps?: 1 | 2 | 3 | 4;
+    /** 当前完成的阶段 (0 到 totalSteps) */
+    currentStep?: number;
+    /** 中间显示的图片 */
+    image?: Img;
+    /** 底部显示的文案 */
+    label?: string;
+    /** 进度条颜色，默认为品牌色 */
+    progressColor?: string;
+    /** 底部文案背景色，默认为品牌营销色 */
+    labelColor?: string;
+    /** 背景颜色，默认为容器背景色 */
+    backgroundColor?: string;
+    /** 移动端组件尺寸，默认 48 */
+    size?: number;
+    /** laptop 以上组件尺寸，默认 80 */
+    laptopSize?: number;
+}
 /**
  * 文案配置
  */
@@ -22,6 +46,8 @@ export interface MiniCartData {
     theme?: 'light' | 'dark';
     /** 地区代码，用于价格格式化 */
     locale?: string;
+    /** 是否显示手机端查看更多按钮，默认 true */
+    showMobileViewMore?: boolean;
 }
 /**
  * 购物车商品项类型
@@ -88,6 +114,10 @@ export interface MiniCartProps extends React.HTMLAttributes<HTMLDivElement> {
      * 产品信息（用于主要展示的产品）
      */
     cart: Cart;
+    /**
+     * 圆形进度条配置，不传则不显示进度条
+     */
+    progressConfig?: CircleProgressConfig;
     /**
      * 删除商品项的回调函数
      * @param id 商品 ID