npm - @anker-in/headless-ui - Versions diffs - 1.1.87 → 1.1.89 - Mend

@anker-in/headless-ui 1.1.87 → 1.1.89

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

Files changed (412) hide show

package/dist/cjs/biz-components/HeaderNavigation/index.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { HeaderNavigationProps } from './types.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<HeaderNavigationProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps & React.RefAttributes<unknown>> & {
+declare const _default: React.ForwardRefExoticComponent<Omit<HeaderNavigationProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../WheelLottery/index.js").ContainerProps & React.RefAttributes<unknown>> & {
     readonly $$typeof: symbol;
 };
 export default _default;

package/dist/cjs/biz-components/HeroBanner/HeroBanner.d.ts CHANGED Viewed

@@ -1,9 +1,29 @@
 import React from 'react';
 import type { HeroBannerProps } from './types.js';
+/**
+ * jump.js 配置选项
+ */
+export interface JumpOptions {
+    /** 动画持续时间（毫秒） @default 500 */
+    duration?: number;
+    /** 偏移量（像素） @default 0 */
+    offset?: number;
+    /** 动画完成回调 */
+    callback?: () => void;
+    /** 缓动函数 */
+    easing?: (t: number, b: number, c: number, d: number) => number;
+    /** 是否考虑 a11y @default false */
+    a11y?: boolean;
+}
 export type HeroBannerSemanticName = 'root' | 'title' | 'subtitle' | 'buttonGroup' | 'primaryButton' | 'secondaryButton' | 'captionGroup';
 declare const _default: React.ForwardRefExoticComponent<Omit<HeroBannerProps & {
     classNames?: Partial<Record<HeroBannerSemanticName, string>>;
-} & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps & React.RefAttributes<unknown>> & {
+    /**
+     * 锚点跳转配置（用于 # 开头的链接）
+     * @default { duration: 500, offset: 0 }
+     */
+    jumpOptions?: JumpOptions;
+} & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../WheelLottery/index.js").ContainerProps & React.RefAttributes<unknown>> & {
     readonly $$typeof: symbol;
 };
 export default _default;

package/dist/cjs/biz-components/HeroBanner/HeroBanner.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var xe=Object.create;var V=Object.defineProperty;var he=Object.getOwnPropertyDescriptor;var ye=Object.getOwnPropertyNames;var ve=Object.getPrototypeOf,we=Object.prototype.hasOwnProperty;var ke=(t,o)=>{for(var s in o)V(t,s,{get:o[s],enumerable:!0})},K=(t,o,s,N)=>{if(o&&typeof o=="object"||typeof o=="function")for(let g of ye(o))!we.call(t,g)&&g!==s&&V(t,g,{get:()=>o[g],enumerable:!(N=he(o,g))||N.enumerable});return t};var M=(t,o,s)=>(s=t!=null?xe(ve(t)):{},K(o||!t||!t.__esModule?V(s,"default",{value:t,enumerable:!0}):s,t)),Ne=t=>K(V({},"__esModule",{value:!0}),t);var Ie={};ke(Ie,{default:()=>Te});module.exports=Ne(Ie);var e=require("react/jsx-runtime"),l=M(require("react")),v=M(require("gsap")),w=require("gsap/dist/ScrollTrigger"),D=require("react-responsive"),W=require("react-intersection-observer"),X=M(require("../../helpers/ScrollLoadVideo.js")),n=require("../../components/index.js"),c=require("../../helpers/index.js"),k=require("class-variance-authority"),ee=require("../../shared/Styles.js"),te=require("../../hooks/useExposure.js"),B=require("../../shared/trackUrlRef.js"),ae=require("../../helpers/utils.js"),oe=require("../AiuiProvider/index.js"),re=require("../../components/button.js"),le=require("../VideoModal/index.js");const d="image",m="hero_banner",$e=(0,k.cva)("hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]",{variants:{align:{left:"tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]",center:"tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center"}},defaultVariants:{align:"left"}}),Ve=(0,k.cva)("hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]",{variants:{align:{left:"laptop:text-left",center:"text-center"}},defaultVariants:{align:"left"}}),Be=(0,k.cva)("hero-banner-button-group lg-desktop:gap-3 flex items-center gap-2",{variants:{align:{left:"laptop:justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),ze=(0,k.cva)("hero-banner-icon-group flex items-center gap-2",{variants:{align:{left:"justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),He=({size:t="base"})=>{const{width:o,height:s}=re.sizeMap[t];return(0,e.jsx)("svg",{width:o,height:s,viewBox:"0 0 20 20",fill:"currentcolor",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z",fill:"currentcolor"})})},O=l.default.forwardRef(({data:t,className:o,classNames:s={},onSecondaryClick:N,onPrimaryClick:g,...ne},se)=>{const{locale:E}=(0,oe.useAiuiContext)(),z=a=>!a||!E?a:(0,ae.getLocalizedPath)(a,E),{label:j,title:i,subtitle:p,endDate:U,endDate_tz:ie,dateFormat:pe,pcImage:H,padImage:_,mobileImage:$,pcVideo:ce,padVideo:ue,mobileVideo:G,isShowVideo:de,isVideoLoop:me=!0,primaryButton:u,secondaryButton:r,theme:ge="light",size:T="default",titleSize:I,caption:C=[],blockLink:F,iconArray:fe,align:b="left"}=t,A=(0,D.useMediaQuery)({query:"(max-width: 768px)"}),q=(0,D.useMediaQuery)({query:"(max-width: 1024px)"}),[Y,Q]=(0,l.useState)(!1),{ref:be,inView:Z}=(0,W.useInView)(),P=(0,l.useRef)(null),S=(0,l.useRef)(null),R=(0,l.useRef)(null),x=(0,l.useRef)(null),f=(0,l.useRef)(null);return(0,te.useExposure)(f,{componentType:d,componentName:m,componentTitle:i,componentDescription:p}),(0,l.useImperativeHandle)(se,()=>f.current),(0,l.useEffect)(()=>{v.default.registerPlugin(w.ScrollTrigger);function a(){if(!x.current)return;const L=f.current?.clientHeight||100;window.innerHeight<=L?P.current=w.ScrollTrigger.create({trigger:f.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:h=>{const y=h.progress*40-20;v.default.set(x.current,{yPercent:y})}}):(R.current=w.ScrollTrigger.create({trigger:f.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:h=>{const y=h.progress*20-20;v.default.set(x.current,{yPercent:y})}}),S.current=w.ScrollTrigger.create({trigger:f.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:h=>{const y=h.progress*20;v.default.set(x.current,{yPercent:y})}}))}return Z&&a(),()=>{P.current&&P.current.kill(),R.current&&R.current.kill(),S.current&&S.current.kill()}},[Z]),(0,e.jsx)("div",{...ne,ref:be,"data-ui-component-id":"HeroBanner",children:(0,e.jsxs)("div",{ref:f,className:(0,c.cn)(ge==="dark"?"aiui-dark":"","text-info-primary relative  w-full overflow-hidden",{"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]":T==="default","lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]":T==="sm"},o),children:[F&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,B.trackUrlRef)(z(F),`${d}_${m}`),"data-headless-type-name":`${d}#${m}`,"data-headless-title-desc-button":`${i}#${p}`,tabIndex:-1,"aria-hidden":"true","aria-label":i}),(0,e.jsx)("div",{ref:x,className:(0,c.cn)("absolute left-0 top-0 size-full"),children:de?(0,e.jsx)(X.default,{poster:A?$?.url:q?_?.url||$?.url:H?.url,src:A?G?.url:q?ue?.url||G?.url:ce?.url,className:"laptop:w-full h-full",videoClassName:"h-full object-cover",muted:!0,loop:me,playsInline:!0}):(0,e.jsx)(n.Picture,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",fetchPriority:"high",alt:H?.alt||"",source:`${H?.url||""} , ${_?.url??($?.url||"")} 1024, ${$?.url||""} 767`})}),(0,e.jsxs)("div",{className:$e({align:b}),children:[(0,e.jsxs)("div",{className:Ve({align:b}),children:[j&&(0,e.jsx)(n.Text,{size:2,as:"p",className:(0,c.cn)("hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm"),html:j}),i&&(0,e.jsx)(n.Heading,{as:I==="4"?"h1":"h2",html:i,className:(0,c.cn)("hero-banner-title",s.title),size:I?Number(I||"5"):T==="sm"?4:5}),p&&(0,e.jsx)(n.Text,{as:"p",size:2,className:(0,c.cn)("hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm"),html:p}),U&&(0,e.jsx)("div",{className:"mt-3",children:(0,e.jsx)(n.Countdown,{endDate:U,endDate_tz:ie,dateFormat:pe,variant:"spacious",align:b})})]}),(0,e.jsxs)("div",{className:Be({align:b}),children:[r?.isShowPlayVideoButton&&r?.playVideoButtonText?(0,e.jsxs)(n.Button,{onClick:()=>Q(!0),size:"lg",variant:"secondary",className:"hero-banner-play-video-button","data-headless-type-name":`${d}#${m}`,"data-headless-title-desc-button":`${i}#${p}#${r?.playVideoButtonText}`,children:[r?.playVideoButtonText," ",(0,e.jsx)(He,{size:"lg"})]}):r?.text?(0,e.jsxs)(n.Button,{"aria-label":i??p,size:"lg",variant:"secondary",className:"hero-banner-secondary-button",as:r?.isCustomSecondaryButton?"button":"a",href:(0,B.trackUrlRef)(z(r?.link),`${d}_${m}`),onClick:a=>r?.isCustomSecondaryButton&&N?.(t,a,r?.customSecondaryEventId),"data-headless-type-name":`${d}#${m}`,"data-headless-title-desc-button":`${i}#${p}#${r?.text}`,children:[r?.text,(0,e.jsx)("span",{className:"sr-only",children:i??p})]}):null,u&&u.text&&(0,e.jsx)(n.Button,{"aria-label":i??p,size:"lg",variant:"primary",className:"hero-banner-primary-button",as:u?.isCustomPrimaryButton?"button":"a",href:(0,B.trackUrlRef)(z(u.link),`${d}_${m}`),onClick:a=>u?.isCustomPrimaryButton&&g?.(t,a,u?.customPrimaryEventId),"data-headless-type-name":`${d}#${m}`,"data-headless-title-desc-button":`${i}#${p}#${u?.text}`,children:u.text})]}),(0,e.jsx)("div",{className:ze({align:b}),children:fe?.map(a=>(0,e.jsx)("div",{className:"h-12",children:(0,e.jsx)(n.Picture,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",alt:a?.pcImage?.alt||"",source:a?.pcImage?.url})},a?.pcImage?.url||a?.pcImage?.alt))})]}),C.length>0&&(0,e.jsx)("div",{className:(0,c.cn)("hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]",s.captionGroup),children:C.map((a,L)=>(0,e.jsxs)(l.default.Fragment,{children:[(0,e.jsx)(n.Text,{size:2,className:(0,c.cn)("hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]"),html:a.title}),L<C.length-1&&(0,e.jsx)("div",{className:(0,c.cn)("bg-info-primary w-px")})]},a.title))}),Y&&(0,e.jsx)(le.VideoModal,{visible:Y,videoUrl:r?.isYoutubeVideo?void 0:r?.videoUrl?.url,youTubeId:r?.isYoutubeVideo?r?.youtubeId:void 0,onCloseModal:()=>Q(!1)})]})})});O.displayName="HeroBanner";var Te=(0,ee.withLayout)(O);
+"use strict";"use client";var $e=Object.create;var T=Object.defineProperty;var Be=Object.getOwnPropertyDescriptor;var Ve=Object.getOwnPropertyNames;var He=Object.getPrototypeOf,Te=Object.prototype.hasOwnProperty;var ze=(t,o)=>{for(var i in o)T(t,i,{get:o[i],enumerable:!0})},ee=(t,o,i,x)=>{if(o&&typeof o=="object"||typeof o=="function")for(let d of Ve(o))!Te.call(t,d)&&d!==i&&T(t,d,{get:()=>o[d],enumerable:!(x=Be(o,d))||x.enumerable});return t};var N=(t,o,i)=>(i=t!=null?$e(He(t)):{},ee(o||!t||!t.__esModule?T(i,"default",{value:t,enumerable:!0}):i,t)),Ce=t=>ee(T({},"__esModule",{value:!0}),t);var De={};ze(De,{default:()=>Me});module.exports=Ce(De);var e=require("react/jsx-runtime"),s=N(require("react")),$=N(require("gsap")),B=require("gsap/dist/ScrollTrigger"),D=N(require("jump.js")),E=require("react-responsive"),ae=require("react-intersection-observer"),re=N(require("../../helpers/ScrollLoadVideo.js")),l=require("../../components/index.js"),m=require("../../helpers/index.js"),V=require("class-variance-authority"),oe=require("../../shared/Styles.js"),ne=require("../../hooks/useExposure.js"),z=require("../../shared/trackUrlRef.js"),se=require("../../helpers/utils.js"),le=require("../AiuiProvider/index.js"),ie=require("../../components/button.js"),pe=require("../VideoModal/index.js"),ue=N(require("./HeroBannerCarousel.js"));const f="image",g="hero_banner",Ie=(0,V.cva)("hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]",{variants:{align:{left:"tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]",center:"tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center"}},defaultVariants:{align:"left"}}),Le=(0,V.cva)("hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]",{variants:{align:{left:"laptop:text-left",center:"text-center"}},defaultVariants:{align:"left"}}),Pe=(0,V.cva)("hero-banner-button-group lg-desktop:gap-3 flex items-center gap-2",{variants:{align:{left:"laptop:justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),Se=(0,V.cva)("hero-banner-icon-group flex items-center gap-2",{variants:{align:{left:"justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),Re=({size:t="base"})=>{const{width:o,height:i}=ie.sizeMap[t];return(0,e.jsx)("svg",{width:o,height:i,viewBox:"0 0 20 20",fill:"currentcolor",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z",fill:"currentcolor"})})},te=s.default.forwardRef(({data:t,className:o,classNames:i={},onSecondaryClick:x,onPrimaryClick:d,jumpOptions:ce={},...j},O)=>{const{locale:U}=(0,le.useAiuiContext)(),J={...{duration:500,offset:0},...ce},C=a=>!a||!U?a:(0,se.getLocalizedPath)(a,U),{label:_,title:p,subtitle:n,endDate:G,endDate_tz:me,dateFormat:de,pcImage:h,padImage:q,mobileImage:H,pcVideo:fe,padVideo:ge,mobileVideo:F,isShowVideo:be,isVideoLoop:xe=!0,primaryButton:u,secondaryButton:r,theme:he="light",size:I="default",titleSize:L,caption:P=[],blockLink:A,iconArray:ve,align:v="left"}=t,W=(0,E.useMediaQuery)({query:"(max-width: 768px)"}),Y=(0,E.useMediaQuery)({query:"(max-width: 1024px)"}),[Q,Z]=(0,s.useState)(!1),{ref:ye,inView:K}=(0,ae.useInView)(),S=(0,s.useRef)(null),R=(0,s.useRef)(null),M=(0,s.useRef)(null),y=(0,s.useRef)(null),b=(0,s.useRef)(null),ke=p?.trim()||n?.trim()||h?.alt?.trim()||void 0,we=p!==void 0?p?.trim()||n?.trim()||h?.alt?.trim()||void 0:n&&n.trim()||"",Ne=n&&n.trim()||"";return(0,ne.useExposure)(b,{componentType:f,componentName:g,componentTitle:we,componentDescription:Ne}),(0,s.useImperativeHandle)(O,()=>b.current),(0,s.useEffect)(()=>{if(t.items&&t.items.length>0)return;$.default.registerPlugin(B.ScrollTrigger);function a(){if(!y.current)return;const c=b.current?.clientHeight||100;window.innerHeight<=c?S.current=B.ScrollTrigger.create({trigger:b.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:k=>{const w=k.progress*40-20;$.default.set(y.current,{yPercent:w})}}):(M.current=B.ScrollTrigger.create({trigger:b.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:k=>{const w=k.progress*20-20;$.default.set(y.current,{yPercent:w})}}),R.current=B.ScrollTrigger.create({trigger:b.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:k=>{const w=k.progress*20;$.default.set(y.current,{yPercent:w})}}))}return K&&a(),()=>{S.current&&S.current.kill(),M.current&&M.current.kill(),R.current&&R.current.kill()}},[K,t.items]),t.items&&t.items.length>0?(0,e.jsx)(ue.default,{data:t,className:o,classNames:i,onPrimaryClick:d,onSecondaryClick:x,ref:O,...j}):(0,e.jsx)("div",{...j,ref:ye,"data-ui-component-id":"HeroBanner",children:(0,e.jsxs)("div",{ref:b,className:(0,m.cn)(he==="dark"?"aiui-dark":"","text-info-primary relative  w-full overflow-hidden",{"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]":I==="default","lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]":I==="sm"},o),children:[A&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,z.trackUrlRef)(C(A),`${f}_${g}`),"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${p}#${n}`,tabIndex:-1,"aria-hidden":"true","aria-label":ke}),(0,e.jsx)("div",{ref:y,className:(0,m.cn)("absolute left-0 top-0 size-full"),children:be?(0,e.jsx)(re.default,{poster:W?H?.url:Y?q?.url||H?.url:h?.url,src:W?F?.url:Y?ge?.url||F?.url:fe?.url,className:"laptop:w-full h-full",videoClassName:"h-full object-cover",muted:!0,loop:xe,playsInline:!0}):(0,e.jsx)(l.Picture,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",fetchPriority:"high",alt:h?.alt||"",source:`${h?.url||""} , ${q?.url??(H?.url||"")} 1024, ${H?.url||""} 767`})}),(0,e.jsxs)("div",{className:Ie({align:v}),children:[(0,e.jsxs)("div",{className:Le({align:v}),children:[_&&(0,e.jsx)(l.Text,{size:2,as:"p",className:(0,m.cn)("hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm"),html:_}),p&&(0,e.jsx)(l.Heading,{as:L==="4"?"h1":"h2",html:p,className:(0,m.cn)("hero-banner-title",i.title),size:L?Number(L||"5"):I==="sm"?4:5}),n&&(0,e.jsx)(l.Text,{as:"p",size:2,className:(0,m.cn)("hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm"),html:n}),G&&(0,e.jsx)("div",{className:"mt-3",children:(0,e.jsx)(l.Countdown,{endDate:G,endDate_tz:me,dateFormat:de,variant:"spacious",align:v})})]}),(0,e.jsxs)("div",{className:Pe({align:v}),children:[r?.isShowPlayVideoButton&&r?.playVideoButtonText?(0,e.jsxs)(l.Button,{onClick:()=>Z(!0),size:"lg",variant:"secondary",className:"hero-banner-play-video-button","data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${p}#${n}#${r?.playVideoButtonText}`,children:[r?.playVideoButtonText," ",(0,e.jsx)(Re,{size:"lg"})]}):r?.text?(0,e.jsxs)(l.Button,{"aria-label":p??n,size:"lg",variant:"secondary",className:"hero-banner-secondary-button",as:r?.isCustomSecondaryButton?"button":"a",href:(0,z.trackUrlRef)(C(r?.link),`${f}_${g}`),onClick:a=>{if(r.link?.startsWith("#")){a.preventDefault();const c=document.querySelector(r.link);c&&(0,D.default)(c,J)}r?.isCustomSecondaryButton&&x?.(t,a,r?.customSecondaryEventId)},"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${p}#${n}#${r?.text}`,children:[r?.text,(0,e.jsx)("span",{className:"sr-only",children:p??n})]}):null,u&&u.text&&(0,e.jsx)(l.Button,{"aria-label":p??n,size:"lg",variant:"primary",className:"hero-banner-primary-button",as:u?.isCustomPrimaryButton?"button":"a",href:(0,z.trackUrlRef)(C(u.link),`${f}_${g}`),onClick:a=>{if(u.link?.startsWith("#")){a.preventDefault();const c=document.querySelector(u.link);c&&(0,D.default)(c,J)}u?.isCustomPrimaryButton&&d?.(t,a,u?.customPrimaryEventId)},"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${p}#${n}#${u?.text}`,children:u.text})]}),(0,e.jsx)("div",{className:Se({align:v}),children:ve?.map(a=>(0,e.jsx)("div",{className:"h-12",children:(0,e.jsx)(l.Picture,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",alt:a?.pcImage?.alt||"",source:a?.pcImage?.url})},a?.pcImage?.url||a?.pcImage?.alt))})]}),P.length>0&&(0,e.jsx)("div",{className:(0,m.cn)("hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]",i.captionGroup),children:P.map((a,c)=>(0,e.jsxs)(s.default.Fragment,{children:[(0,e.jsx)(l.Text,{size:2,className:(0,m.cn)("hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]"),html:a.title}),c<P.length-1&&(0,e.jsx)("div",{className:(0,m.cn)("bg-info-primary w-px")})]},a.title))}),Q&&(0,e.jsx)(pe.VideoModal,{visible:Q,videoUrl:r?.isYoutubeVideo?void 0:r?.videoUrl?.url,youTubeId:r?.isYoutubeVideo?r?.youtubeId:void 0,onCloseModal:()=>Z(!1)})]})})});te.displayName="HeroBanner";var Me=(0,oe.withLayout)(te);
 //# sourceMappingURL=HeroBanner.js.map

package/dist/cjs/biz-components/HeroBanner/HeroBanner.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/HeroBanner/HeroBanner.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef, useState, useEffect } from 'react'\nimport gsap from 'gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport type { HeroBannerProps } from './types.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useInView } from 'react-intersection-observer'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { Button, Heading, Picture, Text, Countdown } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { cva } from 'class-variance-authority'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getLocalizedPath } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { sizeMap } from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\n\nconst componentType = 'image'\nconst componentName = 'hero_banner'\n\n// CVA variants for align\nconst contentVariants = cva(\n  'hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]',\n  {\n    variants: {\n      align: {\n        left: 'tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]',\n        center:\n          'tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center',\n      },\n    },\n    defaultVariants: {\n      align: 'left',\n    },\n  }\n)\n\nconst textVariants = cva(\n  'hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]',\n  {\n    variants: {\n      align: {\n        left: 'laptop:text-left',\n        center: 'text-center',\n      },\n    },\n    defaultVariants: {\n      align: 'left',\n    },\n  }\n)\n\nconst buttonGroupVariants = cva('hero-banner-button-group lg-desktop:gap-3 flex items-center gap-2', {\n  variants: {\n    align: {\n      left: 'laptop:justify-start',\n      center: 'justify-center',\n    },\n  },\n  defaultVariants: {\n    align: 'left',\n  },\n})\n\nconst iconGroupVariants = cva('hero-banner-icon-group flex items-center gap-2', {\n  variants: {\n    align: {\n      left: 'justify-start',\n      center: 'justify-center',\n    },\n  },\n  defaultVariants: {\n    align: 'left',\n  },\n})\n\nexport type HeroBannerSemanticName =\n  | 'root'\n  | 'title'\n  | 'subtitle'\n  | 'buttonGroup'\n  | 'primaryButton'\n  | 'secondaryButton'\n  | 'captionGroup'\n\nconst PlayButtonAppendIcon = ({ size = 'base' }: { size: 'base' | 'lg' | 'sm' }) => {\n  const { width, height } = sizeMap[size]\n  return (\n    <svg width={width} height={height} viewBox=\"0 0 20 20\" fill=\"currentcolor\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z\"\n        fill=\"currentcolor\"\n      />\n    </svg>\n  )\n}\n\nconst HeroBanner = React.forwardRef<\n  HTMLDivElement,\n  HeroBannerProps & {\n    classNames?: Partial<Record<HeroBannerSemanticName, string>>\n  }\n>(({ data, className, classNames = {}, onSecondaryClick, onPrimaryClick, ...rest }, ref) => {\n  const { locale } = useAiuiContext()\n\n  // \u5305\u88C5\u94FE\u63A5\uFF0C\u81EA\u52A8\u6DFB\u52A0 locale \u524D\u7F00\n  const localizeUrl = (url?: string) => {\n    if (!url || !locale) return url\n    return getLocalizedPath(url, locale)\n  }\n\n  const {\n    label,\n    title,\n    subtitle,\n    endDate,\n    endDate_tz,\n    dateFormat,\n    pcImage,\n    padImage,\n    mobileImage,\n    pcVideo,\n    padVideo,\n    mobileVideo,\n    isShowVideo,\n    isVideoLoop = true,\n    primaryButton,\n    secondaryButton,\n    theme = 'light',\n    size = 'default',\n    titleSize,\n    caption = [],\n    blockLink,\n    iconArray,\n    align = 'left',\n  } = data\n\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  const isPad = useMediaQuery({ query: '(max-width: 1024px)' })\n  const [visible, setVisible] = useState<boolean>(false)\n  const { ref: inViewRef, inView } = useInView()\n  const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n  const bgTriggerRef = useRef<ScrollTrigger | null>(null)\n  const boxTriggerRef = useRef<ScrollTrigger | null>(null)\n\n  const bgRef = useRef<HTMLImageElement>(null)\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n    componentDescription: subtitle,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  useEffect(() => {\n    gsap.registerPlugin(ScrollTrigger)\n    function gsapResize() {\n      if (!bgRef.current) return\n      const clientHeight = boxRef.current?.clientHeight || 100\n      const screenHeight = window.innerHeight\n\n      if (screenHeight <= clientHeight) {\n        scrollTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top bottom',\n          end: 'bottom top',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 40\n            const value = self.progress * base - base / 2\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n      } else {\n        boxTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top bottom',\n          end: 'bottom bottom',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 20\n            const value = self.progress * base - base\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n        bgTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top top',\n          end: 'bottom top',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 20\n            const value = self.progress * base\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n      }\n    }\n    if (inView) gsapResize()\n    return () => {\n      // ScrollTrigger.getAll().forEach((t: any) => t.kill())\n      scrollTriggerRef.current && scrollTriggerRef.current.kill()\n      boxTriggerRef.current && boxTriggerRef.current.kill()\n      bgTriggerRef.current && bgTriggerRef.current.kill()\n    }\n  }, [inView])\n\n  return (\n    <div {...rest} ref={inViewRef} data-ui-component-id=\"HeroBanner\">\n      <div\n        ref={boxRef}\n        className={cn(\n          theme === 'dark' ? 'aiui-dark' : '',\n          'text-info-primary relative  w-full overflow-hidden',\n          {\n            'lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]':\n              size === 'default',\n            'lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]':\n              size === 'sm',\n          },\n          className\n        )}\n      >\n        {blockLink && (\n          <a\n            className=\"absolute inset-0 z-10\"\n            href={trackUrlRef(localizeUrl(blockLink), `${componentType}_${componentName}`)}\n            data-headless-type-name={`${componentType}#${componentName}`}\n            data-headless-title-desc-button={`${title}#${subtitle}`}\n            tabIndex={-1}\n            aria-hidden=\"true\"\n            aria-label={title}\n          ></a>\n        )}\n        <div ref={bgRef} className={cn('absolute left-0 top-0 size-full')}>\n          {isShowVideo ? (\n            <ScrollLoadVideo\n              poster={isMobile ? mobileImage?.url : isPad ? padImage?.url || mobileImage?.url : pcImage?.url}\n              src={\n                isMobile\n                  ? (mobileVideo?.url as string)\n                  : isPad\n                    ? (padVideo?.url as string) || (mobileVideo?.url as string)\n                    : (pcVideo?.url as string)\n              }\n              className=\"laptop:w-full h-full\"\n              videoClassName=\"h-full object-cover\"\n              muted\n              loop={isVideoLoop}\n              playsInline\n            />\n          ) : (\n            <Picture\n              className=\"laptop:w-full h-full\"\n              imgClassName=\"h-full object-cover\"\n              loading=\"eager\"\n              fetchPriority=\"high\"\n              alt={pcImage?.alt || ''}\n              source={`${pcImage?.url || ''} , ${padImage?.url ?? (mobileImage?.url || '')} 1024, ${mobileImage?.url || ''} 767`}\n            />\n          )}\n        </div>\n\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <div className={contentVariants({ align })}>\n          <div className={textVariants({ align })}>\n            {label && (\n              <Text\n                size={2}\n                as=\"p\"\n                className={cn('hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm')}\n                html={label}\n              />\n            )}\n            {title && (\n              <Heading\n                as={titleSize === '4' ? 'h1' : 'h2'}\n                html={title}\n                className={cn('hero-banner-title', classNames.title)}\n                size={titleSize ? (Number(titleSize || '5') as any) : size === 'sm' ? 4 : 5}\n              />\n            )}\n            {subtitle && (\n              <Text\n                as=\"p\"\n                size={2}\n                className={cn(\n                  'hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm'\n                )}\n                html={subtitle}\n              />\n            )}\n            {endDate && (\n              <div className=\"mt-3\">\n                <Countdown\n                  endDate={endDate}\n                  endDate_tz={endDate_tz}\n                  dateFormat={dateFormat}\n                  variant=\"spacious\"\n                  align={align}\n                />\n              </div>\n            )}\n          </div>\n          {/* \u6309\u94AE\u7EC4 */}\n          <div className={buttonGroupVariants({ align })}>\n            {secondaryButton?.isShowPlayVideoButton && secondaryButton?.playVideoButtonText ? (\n              <Button\n                onClick={() => setVisible(true)}\n                size=\"lg\"\n                variant=\"secondary\"\n                className=\"hero-banner-play-video-button\"\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${secondaryButton?.playVideoButtonText}`}\n              >\n                {secondaryButton?.playVideoButtonText} <PlayButtonAppendIcon size=\"lg\" />\n              </Button>\n            ) : secondaryButton?.text ? (\n              <Button\n                aria-label={title ?? subtitle}\n                size=\"lg\"\n                variant=\"secondary\"\n                className=\"hero-banner-secondary-button\"\n                as={secondaryButton?.isCustomSecondaryButton ? 'button' : 'a'}\n                href={trackUrlRef(localizeUrl(secondaryButton?.link), `${componentType}_${componentName}`)}\n                onClick={e =>\n                  secondaryButton?.isCustomSecondaryButton &&\n                  onSecondaryClick?.(data, e, secondaryButton?.customSecondaryEventId)\n                }\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${secondaryButton?.text}`}\n              >\n                {secondaryButton?.text}\n                <span className=\"sr-only\">{title ?? subtitle}</span>\n              </Button>\n            ) : null}\n            {primaryButton && primaryButton.text && (\n              <Button\n                aria-label={title ?? subtitle}\n                size=\"lg\"\n                variant=\"primary\"\n                className=\"hero-banner-primary-button\"\n                as={primaryButton?.isCustomPrimaryButton ? 'button' : 'a'}\n                href={trackUrlRef(localizeUrl(primaryButton.link), `${componentType}_${componentName}`)}\n                onClick={e =>\n                  primaryButton?.isCustomPrimaryButton && onPrimaryClick?.(data, e, primaryButton?.customPrimaryEventId)\n                }\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${primaryButton?.text}`}\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n          <div className={iconGroupVariants({ align })}>\n            {iconArray?.map(icon => (\n              <div key={icon?.pcImage?.url || icon?.pcImage?.alt} className=\"h-12\">\n                <Picture\n                  className=\"laptop:w-full h-full\"\n                  imgClassName=\"h-full object-cover\"\n                  loading=\"eager\"\n                  alt={icon?.pcImage?.alt || ''}\n                  source={icon?.pcImage?.url}\n                />\n              </div>\n            ))}\n          </div>\n        </div>\n\n        {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n        {caption.length > 0 && (\n          <div\n            className={cn(\n              'hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]',\n              classNames.captionGroup\n            )}\n          >\n            {caption.map((c, index) => (\n              <React.Fragment key={c.title}>\n                <Text\n                  size={2}\n                  className={cn(\n                    'hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]'\n                  )}\n                  html={c.title}\n                />\n                {index < caption.length - 1 && <div className={cn('bg-info-primary w-px')} />}\n              </React.Fragment>\n            ))}\n          </div>\n        )}\n\n        {/* \u89C6\u9891\u5F39\u7A97 */}\n        {visible && (\n          <VideoModal\n            visible={visible}\n            videoUrl={secondaryButton?.isYoutubeVideo ? undefined : secondaryButton?.videoUrl?.url}\n            youTubeId={secondaryButton?.isYoutubeVideo ? secondaryButton?.youtubeId : undefined}\n            onCloseModal={() => setVisible(false)}\n          />\n        )}\n      </div>\n    </div>\n  )\n})\n\nHeroBanner.displayName = 'HeroBanner'\n\nexport default withLayout(HeroBanner)\n"],
-  "mappings": "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",
-  "names": ["HeroBanner_exports", "__export", "HeroBanner_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "import_ScrollTrigger", "import_react_responsive", "import_react_intersection_observer", "import_ScrollLoadVideo", "import_components", "import_helpers", "import_class_variance_authority", "import_Styles", "import_useExposure", "import_trackUrlRef", "import_utils", "import_AiuiProvider", "import_button", "import_VideoModal", "componentType", "componentName", "contentVariants", "textVariants", "buttonGroupVariants", "iconGroupVariants", "PlayButtonAppendIcon", "size", "width", "height", "HeroBanner", "React", "data", "className", "classNames", "onSecondaryClick", "onPrimaryClick", "rest", "ref", "locale", "localizeUrl", "url", "label", "title", "subtitle", "endDate", "endDate_tz", "dateFormat", "pcImage", "padImage", "mobileImage", "pcVideo", "padVideo", "mobileVideo", "isShowVideo", "isVideoLoop", "primaryButton", "secondaryButton", "theme", "titleSize", "caption", "blockLink", "iconArray", "align", "isMobile", "isPad", "visible", "setVisible", "inViewRef", "inView", "scrollTriggerRef", "bgTriggerRef", "boxTriggerRef", "bgRef", "boxRef", "gsap", "gsapResize", "clientHeight", "self", "value", "ScrollLoadVideo", "e", "icon", "c", "index"]
+  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef, useState, useEffect } from 'react'\nimport gsap from 'gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport jump from 'jump.js'\nimport type { HeroBannerProps } from './types.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useInView } from 'react-intersection-observer'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { Button, Heading, Picture, Text, Countdown } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { cva } from 'class-variance-authority'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getLocalizedPath } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { sizeMap } from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\n// Task 18: import carousel implementation for early-return delegation (DECISION-A002)\nimport HeroBannerCarousel from './HeroBannerCarousel.js'\n\n/**\n * jump.js \u914D\u7F6E\u9009\u9879\n */\nexport interface JumpOptions {\n  /** \u52A8\u753B\u6301\u7EED\u65F6\u95F4\uFF08\u6BEB\u79D2\uFF09 @default 500 */\n  duration?: number\n  /** \u504F\u79FB\u91CF\uFF08\u50CF\u7D20\uFF09 @default 0 */\n  offset?: number\n  /** \u52A8\u753B\u5B8C\u6210\u56DE\u8C03 */\n  callback?: () => void\n  /** \u7F13\u52A8\u51FD\u6570 */\n  easing?: (t: number, b: number, c: number, d: number) => number\n  /** \u662F\u5426\u8003\u8651 a11y @default false */\n  a11y?: boolean\n}\n\nconst componentType = 'image'\nconst componentName = 'hero_banner'\n\n// CVA variants for align\nconst contentVariants = cva(\n  'hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]',\n  {\n    variants: {\n      align: {\n        left: 'tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]',\n        center:\n          'tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center',\n      },\n    },\n    defaultVariants: {\n      align: 'left',\n    },\n  }\n)\n\nconst textVariants = cva(\n  'hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]',\n  {\n    variants: {\n      align: {\n        left: 'laptop:text-left',\n        center: 'text-center',\n      },\n    },\n    defaultVariants: {\n      align: 'left',\n    },\n  }\n)\n\nconst buttonGroupVariants = cva('hero-banner-button-group lg-desktop:gap-3 flex items-center gap-2', {\n  variants: {\n    align: {\n      left: 'laptop:justify-start',\n      center: 'justify-center',\n    },\n  },\n  defaultVariants: {\n    align: 'left',\n  },\n})\n\nconst iconGroupVariants = cva('hero-banner-icon-group flex items-center gap-2', {\n  variants: {\n    align: {\n      left: 'justify-start',\n      center: 'justify-center',\n    },\n  },\n  defaultVariants: {\n    align: 'left',\n  },\n})\n\nexport type HeroBannerSemanticName =\n  | 'root'\n  | 'title'\n  | 'subtitle'\n  | 'buttonGroup'\n  | 'primaryButton'\n  | 'secondaryButton'\n  | 'captionGroup'\n\nconst PlayButtonAppendIcon = ({ size = 'base' }: { size: 'base' | 'lg' | 'sm' }) => {\n  const { width, height } = sizeMap[size]\n  return (\n    <svg width={width} height={height} viewBox=\"0 0 20 20\" fill=\"currentcolor\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z\"\n        fill=\"currentcolor\"\n      />\n    </svg>\n  )\n}\n\nconst HeroBanner = React.forwardRef<\n  HTMLDivElement,\n  HeroBannerProps & {\n    classNames?: Partial<Record<HeroBannerSemanticName, string>>\n    /**\n     * \u951A\u70B9\u8DF3\u8F6C\u914D\u7F6E\uFF08\u7528\u4E8E # \u5F00\u5934\u7684\u94FE\u63A5\uFF09\n     * @default { duration: 500, offset: 0 }\n     */\n    jumpOptions?: JumpOptions\n  }\n>(({ data, className, classNames = {}, onSecondaryClick, onPrimaryClick, jumpOptions = {}, ...rest }, ref) => {\n  const { locale } = useAiuiContext()\n\n  // \u9ED8\u8BA4 jump \u914D\u7F6E\n  const defaultJumpOptions: JumpOptions = { duration: 500, offset: 0 }\n  const mergedJumpOptions = { ...defaultJumpOptions, ...jumpOptions }\n\n  // \u5305\u88C5\u94FE\u63A5\uFF0C\u81EA\u52A8\u6DFB\u52A0 locale \u524D\u7F00\n  const localizeUrl = (url?: string) => {\n    if (!url || !locale) return url\n    return getLocalizedPath(url, locale)\n  }\n\n  const {\n    label,\n    title,\n    subtitle,\n    endDate,\n    endDate_tz,\n    dateFormat,\n    pcImage,\n    padImage,\n    mobileImage,\n    pcVideo,\n    padVideo,\n    mobileVideo,\n    isShowVideo,\n    isVideoLoop = true,\n    primaryButton,\n    secondaryButton,\n    theme = 'light',\n    size = 'default',\n    titleSize,\n    caption = [],\n    blockLink,\n    iconArray,\n    align = 'left',\n  } = data\n\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  const isPad = useMediaQuery({ query: '(max-width: 1024px)' })\n  const [visible, setVisible] = useState<boolean>(false)\n  const { ref: inViewRef, inView } = useInView()\n  const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n  const bgTriggerRef = useRef<ScrollTrigger | null>(null)\n  const boxTriggerRef = useRef<ScrollTrigger | null>(null)\n\n  const bgRef = useRef<HTMLImageElement>(null)\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  // Task 7: Compute accessibility / tracking fallback values (Rule 2/3/4 \u2014 DECISION-T3)\n  // blockLink aria-label: title \u2192 subtitle \u2192 pcImage.alt \u2192 undefined (absent attr)\n  const blockLinkLabel = title?.trim() || subtitle?.trim() || pcImage?.alt?.trim() || undefined\n  // componentTitle: title=undefined \u2192 coerce '' via subtitle only (no pcImage.alt for undefined title);\n  //                 title='' (intentional) \u2192 cascade: subtitle \u2192 pcImage.alt \u2192 undefined\n  const resolvedComponentTitle =\n    title !== undefined\n      ? title?.trim() || subtitle?.trim() || pcImage?.alt?.trim() || undefined\n      : (subtitle && subtitle.trim()) || ''\n  // componentDescription: subtitle with undefined guard\n  const resolvedComponentDescription = (subtitle && subtitle.trim()) || ''\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: resolvedComponentTitle,\n    componentDescription: resolvedComponentDescription,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  useEffect(() => {\n    // Task 18: GSAP bypass \u2014 skip ALL GSAP setup in carousel mode (DECISION-A002/DECISION-009)\n    if (data.items && data.items.length > 0) return\n    gsap.registerPlugin(ScrollTrigger)\n    function gsapResize() {\n      if (!bgRef.current) return\n      const clientHeight = boxRef.current?.clientHeight || 100\n      const screenHeight = window.innerHeight\n\n      if (screenHeight <= clientHeight) {\n        scrollTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top bottom',\n          end: 'bottom top',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 40\n            const value = self.progress * base - base / 2\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n      } else {\n        boxTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top bottom',\n          end: 'bottom bottom',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 20\n            const value = self.progress * base - base\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n        bgTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top top',\n          end: 'bottom top',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 20\n            const value = self.progress * base\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n      }\n    }\n    if (inView) gsapResize()\n    return () => {\n      // ScrollTrigger.getAll().forEach((t: any) => t.kill())\n      scrollTriggerRef.current && scrollTriggerRef.current.kill()\n      boxTriggerRef.current && boxTriggerRef.current.kill()\n      bgTriggerRef.current && bgTriggerRef.current.kill()\n    }\n  }, [inView, data.items])\n\n  // Task 18: Carousel mode early return (DECISION-A002 / DECISION-011)\n  // All hooks above have already run. Delegate entirely to HeroBannerCarousel\n  // when data.items is non-empty; GSAP was already bypassed in the useEffect above.\n  if (data.items && data.items.length > 0) {\n    return (\n      <HeroBannerCarousel\n        data={data}\n        className={className}\n        classNames={classNames}\n        onPrimaryClick={onPrimaryClick}\n        onSecondaryClick={onSecondaryClick}\n        ref={ref as React.Ref<HTMLDivElement>}\n        {...rest}\n      />\n    )\n  }\n  return (\n    <div {...rest} ref={inViewRef} data-ui-component-id=\"HeroBanner\">\n      <div\n        ref={boxRef}\n        className={cn(\n          theme === 'dark' ? 'aiui-dark' : '',\n          'text-info-primary relative  w-full overflow-hidden',\n          {\n            'lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]':\n              size === 'default',\n            'lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]':\n              size === 'sm',\n          },\n          className\n        )}\n      >\n        {blockLink && (\n          <a\n            className=\"absolute inset-0 z-10\"\n            href={trackUrlRef(localizeUrl(blockLink), `${componentType}_${componentName}`)}\n            data-headless-type-name={`${componentType}#${componentName}`}\n            data-headless-title-desc-button={`${title}#${subtitle}`}\n            tabIndex={-1}\n            aria-hidden=\"true\"\n            aria-label={blockLinkLabel}\n          ></a>\n        )}\n        <div ref={bgRef} className={cn('absolute left-0 top-0 size-full')}>\n          {isShowVideo ? (\n            <ScrollLoadVideo\n              poster={isMobile ? mobileImage?.url : isPad ? padImage?.url || mobileImage?.url : pcImage?.url}\n              src={\n                isMobile\n                  ? (mobileVideo?.url as string)\n                  : isPad\n                    ? (padVideo?.url as string) || (mobileVideo?.url as string)\n                    : (pcVideo?.url as string)\n              }\n              className=\"laptop:w-full h-full\"\n              videoClassName=\"h-full object-cover\"\n              muted\n              loop={isVideoLoop}\n              playsInline\n            />\n          ) : (\n            <Picture\n              className=\"laptop:w-full h-full\"\n              imgClassName=\"h-full object-cover\"\n              loading=\"eager\"\n              fetchPriority=\"high\"\n              alt={pcImage?.alt || ''}\n              source={`${pcImage?.url || ''} , ${padImage?.url ?? (mobileImage?.url || '')} 1024, ${mobileImage?.url || ''} 767`}\n            />\n          )}\n        </div>\n\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <div className={contentVariants({ align })}>\n          <div className={textVariants({ align })}>\n            {label && (\n              <Text\n                size={2}\n                as=\"p\"\n                className={cn('hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm')}\n                html={label}\n              />\n            )}\n            {title && (\n              <Heading\n                as={titleSize === '4' ? 'h1' : 'h2'}\n                html={title}\n                className={cn('hero-banner-title', classNames.title)}\n                size={titleSize ? (Number(titleSize || '5') as any) : size === 'sm' ? 4 : 5}\n              />\n            )}\n            {subtitle && (\n              <Text\n                as=\"p\"\n                size={2}\n                className={cn(\n                  'hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm'\n                )}\n                html={subtitle}\n              />\n            )}\n            {endDate && (\n              <div className=\"mt-3\">\n                <Countdown\n                  endDate={endDate}\n                  endDate_tz={endDate_tz}\n                  dateFormat={dateFormat}\n                  variant=\"spacious\"\n                  align={align}\n                />\n              </div>\n            )}\n          </div>\n          {/* \u6309\u94AE\u7EC4 */}\n          <div className={buttonGroupVariants({ align })}>\n            {secondaryButton?.isShowPlayVideoButton && secondaryButton?.playVideoButtonText ? (\n              <Button\n                onClick={() => setVisible(true)}\n                size=\"lg\"\n                variant=\"secondary\"\n                className=\"hero-banner-play-video-button\"\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${secondaryButton?.playVideoButtonText}`}\n              >\n                {secondaryButton?.playVideoButtonText} <PlayButtonAppendIcon size=\"lg\" />\n              </Button>\n            ) : secondaryButton?.text ? (\n              <Button\n                aria-label={title ?? subtitle}\n                size=\"lg\"\n                variant=\"secondary\"\n                className=\"hero-banner-secondary-button\"\n                as={secondaryButton?.isCustomSecondaryButton ? 'button' : 'a'}\n                href={trackUrlRef(localizeUrl(secondaryButton?.link), `${componentType}_${componentName}`)}\n                onClick={e => {\n                  if (secondaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(secondaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  secondaryButton?.isCustomSecondaryButton &&\n                    onSecondaryClick?.(data, e, secondaryButton?.customSecondaryEventId)\n                }}\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${secondaryButton?.text}`}\n              >\n                {secondaryButton?.text}\n                <span className=\"sr-only\">{title ?? subtitle}</span>\n              </Button>\n            ) : null}\n            {primaryButton && primaryButton.text && (\n              <Button\n                aria-label={title ?? subtitle}\n                size=\"lg\"\n                variant=\"primary\"\n                className=\"hero-banner-primary-button\"\n                as={primaryButton?.isCustomPrimaryButton ? 'button' : 'a'}\n                href={trackUrlRef(localizeUrl(primaryButton.link), `${componentType}_${componentName}`)}\n                onClick={e => {\n                  if (primaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(primaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  primaryButton?.isCustomPrimaryButton && onPrimaryClick?.(data, e, primaryButton?.customPrimaryEventId)\n                }}\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${primaryButton?.text}`}\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n          <div className={iconGroupVariants({ align })}>\n            {iconArray?.map(icon => (\n              <div key={icon?.pcImage?.url || icon?.pcImage?.alt} className=\"h-12\">\n                <Picture\n                  className=\"laptop:w-full h-full\"\n                  imgClassName=\"h-full object-cover\"\n                  loading=\"eager\"\n                  alt={icon?.pcImage?.alt || ''}\n                  source={icon?.pcImage?.url}\n                />\n              </div>\n            ))}\n          </div>\n        </div>\n\n        {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n        {caption.length > 0 && (\n          <div\n            className={cn(\n              'hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]',\n              classNames.captionGroup\n            )}\n          >\n            {caption.map((c, index) => (\n              <React.Fragment key={c.title}>\n                <Text\n                  size={2}\n                  className={cn(\n                    'hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]'\n                  )}\n                  html={c.title}\n                />\n                {index < caption.length - 1 && <div className={cn('bg-info-primary w-px')} />}\n              </React.Fragment>\n            ))}\n          </div>\n        )}\n\n        {/* \u89C6\u9891\u5F39\u7A97 */}\n        {visible && (\n          <VideoModal\n            visible={visible}\n            videoUrl={secondaryButton?.isYoutubeVideo ? undefined : secondaryButton?.videoUrl?.url}\n            youTubeId={secondaryButton?.isYoutubeVideo ? secondaryButton?.youtubeId : undefined}\n            onCloseModal={() => setVisible(false)}\n          />\n        )}\n      </div>\n    </div>\n  )\n})\n\nHeroBanner.displayName = 'HeroBanner'\n\nexport default withLayout(HeroBanner)\n"],
+  "mappings": "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",
+  "names": ["HeroBanner_exports", "__export", "HeroBanner_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "import_ScrollTrigger", "import_jump", "import_react_responsive", "import_react_intersection_observer", "import_ScrollLoadVideo", "import_components", "import_helpers", "import_class_variance_authority", "import_Styles", "import_useExposure", "import_trackUrlRef", "import_utils", "import_AiuiProvider", "import_button", "import_VideoModal", "import_HeroBannerCarousel", "componentType", "componentName", "contentVariants", "textVariants", "buttonGroupVariants", "iconGroupVariants", "PlayButtonAppendIcon", "size", "width", "height", "HeroBanner", "React", "data", "className", "classNames", "onSecondaryClick", "onPrimaryClick", "jumpOptions", "rest", "ref", "locale", "mergedJumpOptions", "localizeUrl", "url", "label", "title", "subtitle", "endDate", "endDate_tz", "dateFormat", "pcImage", "padImage", "mobileImage", "pcVideo", "padVideo", "mobileVideo", "isShowVideo", "isVideoLoop", "primaryButton", "secondaryButton", "theme", "titleSize", "caption", "blockLink", "iconArray", "align", "isMobile", "isPad", "visible", "setVisible", "inViewRef", "inView", "scrollTriggerRef", "bgTriggerRef", "boxTriggerRef", "bgRef", "boxRef", "blockLinkLabel", "resolvedComponentTitle", "resolvedComponentDescription", "gsap", "gsapResize", "clientHeight", "self", "value", "HeroBannerCarousel", "ScrollLoadVideo", "e", "element", "jump", "icon", "c", "index"]
 }

package/dist/cjs/biz-components/HeroBanner/HeroBannerCarousel.d.ts ADDED Viewed

@@ -0,0 +1,23 @@
+import React from 'react';
+import type { HeroBannerProps } from './types.js';
+import 'swiper/css';
+import 'swiper/css/navigation';
+import 'swiper/css/pagination';
+interface HeroBannerCarouselProps extends React.HTMLAttributes<HTMLDivElement> {
+    data: HeroBannerProps['data'];
+    classNames?: Record<string, string>;
+    onPrimaryClick?: (data: any, e: any, id?: string) => void;
+    onSecondaryClick?: (data: any, e: any, id?: string) => void;
+}
+/**
+ * HeroBannerCarousel — arrows-only Navigation Swiper wrapping HeroBannerSlide units.
+ *
+ * Architecture:
+ *  - DECISION-A007: Navigation only, loop=false, slidesPerView=1
+ *  - DECISION-A003: ScrollLoadVideo videoRef as imperative pause channel
+ *  - DECISION-A010: initial activeIndex=0; useEffect pauses slides 1..N on mount
+ *  - DECISION-A006: arrow buttons at z-[20], above blockLink overlay z-10
+ *  - ISSUE-017: post-mount pause wins over IO rootMargin='200px' race
+ */
+declare const HeroBannerCarousel: React.ForwardRefExoticComponent<HeroBannerCarouselProps & React.RefAttributes<HTMLDivElement>>;
+export default HeroBannerCarousel;

package/dist/cjs/biz-components/HeroBanner/HeroBannerCarousel.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";"use client";var A=Object.create;var B=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var M=Object.getPrototypeOf,V=Object.prototype.hasOwnProperty;var D=(t,n)=>{for(var i in n)B(t,i,{get:n[i],enumerable:!0})},_=(t,n,i,f)=>{if(n&&typeof n=="object"\|\|typeof n=="function")for(let l of I(n))!V.call(t,l)&&l!==i&&B(t,l,{get:()=>n[l],enumerable:!(f=E(n,l))\|\|f.enumerable});return t};var T=(t,n,i)=>(i=t!=null?A(M(t)):{},_(n\|\|!t\|\|!t.__esModule?B(i,"default",{value:t,enumerable:!0}):i,t)),O=t=>_(B({},"__esModule",{value:!0}),t);var q={};D(q,{default:()=>$});module.exports=O(q);var e=require("react/jsx-runtime"),r=T(require("react")),N=require("swiper/react"),d=require("swiper/modules"),R=T(require("../../helpers/ScrollLoadVideo.js")),g=require("../../helpers/index.js"),m=require("../../components/index.js"),J=require("swiper/css"),K=require("swiper/css/navigation"),Q=require("swiper/css/pagination");const W=()=>(0,e.jsxs)("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[(0,e.jsx)("circle",{cx:"20",cy:"20",r:"20",fill:"currentColor",fillOpacity:"0.2"}),(0,e.jsx)("path",{d:"M23 13L16 20L23 27",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),F=()=>(0,e.jsxs)("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[(0,e.jsx)("circle",{cx:"20",cy:"20",r:"20",fill:"currentColor",fillOpacity:"0.2"}),(0,e.jsx)("path",{d:"M17 13L24 20L17 27",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),U=({data:t,isActive:n,videoRef:i,onPrimaryClick:f,onSecondaryClick:l})=>{const{pcVideo:H,padVideo:L,mobileVideo:x,pcImage:b,mobileImage:y,isVideoLoop:P=!0,title:k,subtitle:u,primaryButton:c,secondaryButton:s,theme:v="light",align:w="left",titleSize:h,size:S="default"}=t,a=H?.url\|\|L?.url\|\|x?.url\|\|"",o=b?.url\|\|y?.url\|\|"";return(0,e.jsxs)("div",{className:(0,g.cn)("text-info-primary relative w-full overflow-hidden",v==="dark"?"aiui-dark":"",S==="default"?"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]":"lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]"),children:[(0,e.jsx)(R.default,{videoRef:i,src:a,poster:o,className:"absolute inset-0 size-full",videoClassName:"size-full object-cover",muted:!0,loop:P,playsInline:!0}),(0,e.jsxs)("div",{className:(0,g.cn)("laptop:top-1/2 laptop:-translate-y-1/2 lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]",w==="center"?"left-1/2 -translate-x-1/2 items-center text-center":"tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] left-0 px-[16px]"),children:[(0,e.jsxs)("div",{className:(0,g.cn)("tablet:max-w-[704px] laptop:max-w-[440px] desktop:max-w-[648px] lg-desktop:max-w-[824px] max-w-[358px]",w==="center"?"text-center":"laptop:text-left"),children:[k&&(0,e.jsx)(m.Heading,{as:h==="4"?"h1":"h2",html:k,size:h?Number(h\|\|"5"):S==="sm"?4:5}),u&&(0,e.jsx)(m.Text,{as:"p",size:2,className:"font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm",html:u})]}),(c?.text\|\|s?.text)&&(0,e.jsxs)("div",{className:(0,g.cn)("lg-desktop:gap-3 flex items-center gap-2",w==="center"?"justify-center":"laptop:justify-start"),children:[s?.text&&(0,e.jsx)(m.Button,{size:"lg",variant:"secondary",as:s?.isCustomSecondaryButton?"button":"a",href:s.link,onClick:p=>s?.isCustomSecondaryButton&&l?.(t,p,s?.customSecondaryEventId),children:s.text}),c?.text&&(0,e.jsx)(m.Button,{size:"lg",variant:"primary",as:c?.isCustomPrimaryButton?"button":"a",href:c.link,onClick:p=>c?.isCustomPrimaryButton&&f?.(t,p,c?.customPrimaryEventId),children:c.text})]})]})]})},z=r.default.forwardRef(({data:t,className:n,classNames:i={},onPrimaryClick:f,onSecondaryClick:l,...H},L)=>{const x=t.items\|\|[],b=t.carousel,y=(0,r.useRef)(null),[P,k]=(0,r.useState)(0),u=(0,r.useRef)(x.map(()=>r.default.createRef())),c=(b?.showArrows??!0)&&x.length>1,s=b?.showDots??!0,v=b?.autoplaySeconds,w=v!==void 0?[d.Navigation,d.Pagination,d.Autoplay]:[d.Navigation,d.Pagination],h=v!==void 0?{delay:v*1e3,disableOnInteraction:!1}:!1;(0,r.useEffect)(()=>{u.current.forEach((a,o)=>{o!==0&&a.current&&(a.current.pause(),a.current.currentTime=0)})},[]);const S=(0,r.useCallback)(a=>{const o=a.realIndex;u.current.forEach((C,j)=>{j!==o&&C.current&&(C.current.pause(),C.current.currentTime=0)});const p=u.current[o];p?.current&&p.current.paused&&p.current.play()?.catch(()=>{}),k(o)},[]);return(0,e.jsxs)("div",{ref:L,className:(0,g.cn)("hero-banner-carousel relative w-full overflow-hidden",n),...H,children:[(0,e.jsx)(N.Swiper,{onSwiper:a=>y.current=a,onSlideChange:S,modules:w,slidesPerView:1,loop:b?.loop??!0,initialSlide:0,allowTouchMove:!0,autoplay:h,pagination:s?{clickable:!0,el:".hero-banner-pagination",renderBullet:(a,o)=>`<span class="${o} banner-dot"></span>`}:!1,children:x.map((a,o)=>(0,e.jsx)(N.SwiperSlide,{children:({isActive:p})=>(0,e.jsx)(U,{data:a,isActive:p,videoRef:u.current[o],onPrimaryClick:f,onSecondaryClick:l})},o))}),c&&(0,e.jsxs)("div",{className:"pointer-events-none absolute inset-0 z-20 flex items-center justify-between px-4",children:[(0,e.jsx)("button",{type:"button",className:"tablet:flex pointer-events-auto hidden items-center justify-center",onClick:()=>y.current?.slidePrev(),"aria-label":"Previous banner",children:(0,e.jsx)(W,{})}),(0,e.jsx)("button",{type:"button",className:"tablet:flex pointer-events-auto hidden items-center justify-center",onClick:()=>y.current?.slideNext(),"aria-label":"Next banner",children:(0,e.jsx)(F,{})})]}),s&&(0,e.jsx)("div",{className:"hero-banner-pagination swiper-pagination tablet:bottom-6 absolute bottom-5 left-1/2 z-20 flex -translate-x-1/2 items-center justify-center gap-2 [&_.banner-dot.swiper-pagination-bullet-active]:h-2 [&_.banner-dot.swiper-pagination-bullet-active]:w-8 [&_.banner-dot.swiper-pagination-bullet-active]:rounded-full [&_.banner-dot.swiper-pagination-bullet-active]:bg-[#080A0F] [&_.banner-dot]:size-2 [&_.banner-dot]:rounded-full [&_.banner-dot]:bg-[#767880] [&_.banner-dot]:transition-all [&_.banner-dot]:duration-300 [&_.banner-dot]:ease-out [&_.swiper-pagination-bullet]:m-0 [&_.swiper-pagination-bullet]:shrink-0 [&_.swiper-pagination-bullet]:opacity-100"})]})});z.displayName="HeroBannerCarousel";var $=z;
2	+ //# sourceMappingURL=HeroBannerCarousel.js.map

package/dist/cjs/biz-components/HeroBanner/HeroBannerCarousel.js.map ADDED Viewed

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/HeroBanner/HeroBannerCarousel.tsx"],
+  "sourcesContent": ["'use client'\nimport React, { useRef, useEffect, useCallback, useState } from 'react'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, Pagination, Autoplay } from 'swiper/modules'\nimport type { Swiper as SwiperType } from 'swiper'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { cn } from '../../helpers/index.js'\nimport type { HeroBannerProps, HeroBannerSlideData } from './types.js'\nimport { Button, Heading, Text } from '../../components/index.js'\n\nimport 'swiper/css'\nimport 'swiper/css/navigation'\nimport 'swiper/css/pagination'\n\n// \u2500\u2500 Arrow icons \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\nconst ChevronLeft = () => (\n  <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n    <circle cx=\"20\" cy=\"20\" r=\"20\" fill=\"currentColor\" fillOpacity=\"0.2\" />\n    <path d=\"M23 13L16 20L23 27\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\nconst ChevronRight = () => (\n  <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n    <circle cx=\"20\" cy=\"20\" r=\"20\" fill=\"currentColor\" fillOpacity=\"0.2\" />\n    <path d=\"M17 13L24 20L17 27\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\n// \u2500\u2500 HeroBannerSlide \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n// Minimal per-slide content unit. No GSAP, no withLayout, no useExposure.\n// videoRef is the imperative pause/play channel (DECISION-A003).\n\ninterface HeroBannerSlideProps {\n  data: HeroBannerSlideData\n  isActive: boolean\n  videoRef: React.RefObject<HTMLVideoElement>\n  onPrimaryClick?: (data: any, e: any, id?: string) => void\n  onSecondaryClick?: (data: any, e: any, id?: string) => void\n}\n\nconst HeroBannerSlide = ({\n  data,\n  isActive: _isActive,\n  videoRef,\n  onPrimaryClick,\n  onSecondaryClick,\n}: HeroBannerSlideProps) => {\n  const {\n    pcVideo,\n    padVideo,\n    mobileVideo,\n    pcImage,\n    mobileImage,\n    isVideoLoop = true,\n    title,\n    subtitle,\n    primaryButton,\n    secondaryButton,\n    theme = 'light',\n    align = 'left',\n    titleSize,\n    size = 'default',\n  } = data\n\n  // Resolve video src (pc preferred; fallback to mobile)\n  const videoSrc = pcVideo?.url || padVideo?.url || mobileVideo?.url || ''\n  // Poster from image (shown while video loads or for image-only slides)\n  const posterUrl = pcImage?.url || mobileImage?.url || ''\n\n  return (\n    <div\n      className={cn(\n        'text-info-primary relative w-full overflow-hidden',\n        theme === 'dark' ? 'aiui-dark' : '',\n        size === 'default'\n          ? 'lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]'\n          : 'lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]'\n      )}\n    >\n      {/* Background media \u2014 always ScrollLoadVideo so videoRef is always attached.\n          For image-only slides src='', IO won't load a video, but ref is live for control. */}\n      <ScrollLoadVideo\n        videoRef={videoRef}\n        src={videoSrc}\n        poster={posterUrl}\n        className=\"absolute inset-0 size-full\"\n        videoClassName=\"size-full object-cover\"\n        muted\n        loop={isVideoLoop}\n        playsInline\n      />\n\n      {/* Content Overlay */}\n      <div\n        className={cn(\n          'laptop:top-1/2 laptop:-translate-y-1/2 lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]',\n          align === 'center'\n            ? 'left-1/2 -translate-x-1/2 items-center text-center'\n            : 'tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] left-0 px-[16px]'\n        )}\n      >\n        <div\n          className={cn(\n            'tablet:max-w-[704px] laptop:max-w-[440px] desktop:max-w-[648px] lg-desktop:max-w-[824px] max-w-[358px]',\n            align === 'center' ? 'text-center' : 'laptop:text-left'\n          )}\n        >\n          {title && (\n            <Heading\n              as={titleSize === '4' ? 'h1' : 'h2'}\n              html={title}\n              size={titleSize ? (Number(titleSize || '5') as any) : size === 'sm' ? 4 : 5}\n            />\n          )}\n          {subtitle && (\n            <Text\n              as=\"p\"\n              size={2}\n              className=\"font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm\"\n              html={subtitle}\n            />\n          )}\n        </div>\n\n        {(primaryButton?.text || secondaryButton?.text) && (\n          <div\n            className={cn(\n              'lg-desktop:gap-3 flex items-center gap-2',\n              align === 'center' ? 'justify-center' : 'laptop:justify-start'\n            )}\n          >\n            {secondaryButton?.text && (\n              <Button\n                size=\"lg\"\n                variant=\"secondary\"\n                as={secondaryButton?.isCustomSecondaryButton ? 'button' : 'a'}\n                href={secondaryButton.link}\n                onClick={e =>\n                  secondaryButton?.isCustomSecondaryButton &&\n                  onSecondaryClick?.(data, e, secondaryButton?.customSecondaryEventId)\n                }\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton?.text && (\n              <Button\n                size=\"lg\"\n                variant=\"primary\"\n                as={primaryButton?.isCustomPrimaryButton ? 'button' : 'a'}\n                href={primaryButton.link}\n                onClick={e =>\n                  primaryButton?.isCustomPrimaryButton && onPrimaryClick?.(data, e, primaryButton?.customPrimaryEventId)\n                }\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n\n// \u2500\u2500 HeroBannerCarousel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\ninterface HeroBannerCarouselProps extends React.HTMLAttributes<HTMLDivElement> {\n  data: HeroBannerProps['data']\n  classNames?: Record<string, string>\n  onPrimaryClick?: (data: any, e: any, id?: string) => void\n  onSecondaryClick?: (data: any, e: any, id?: string) => void\n}\n\n/**\n * HeroBannerCarousel \u2014 arrows-only Navigation Swiper wrapping HeroBannerSlide units.\n *\n * Architecture:\n *  - DECISION-A007: Navigation only, loop=false, slidesPerView=1\n *  - DECISION-A003: ScrollLoadVideo videoRef as imperative pause channel\n *  - DECISION-A010: initial activeIndex=0; useEffect pauses slides 1..N on mount\n *  - DECISION-A006: arrow buttons at z-[20], above blockLink overlay z-10\n *  - ISSUE-017: post-mount pause wins over IO rootMargin='200px' race\n */\nconst HeroBannerCarousel = React.forwardRef<HTMLDivElement, HeroBannerCarouselProps>(\n  (\n    {\n      data,\n      className,\n      classNames: _classNames = {},\n      onPrimaryClick: _onPrimaryClick,\n      onSecondaryClick: _onSecondaryClick,\n      ...rest\n    },\n    ref\n  ) => {\n    const items = data.items || []\n    const carousel = data.carousel\n\n    const swiperRef = useRef<SwiperType | null>(null)\n    const [_activeIndex, setActiveIndex] = useState(0)\n\n    // One RefObject<HTMLVideoElement> per slide.\n    // Created once at mount; ref count is fixed (ISSUE-022 \u2014 stable data assumed).\n    // DECISION-A003: passed to HeroBannerSlide \u2192 ScrollLoadVideo as imperative channel.\n    const videoRefs = useRef<React.RefObject<HTMLVideoElement>[]>(items.map(() => React.createRef<HTMLVideoElement>()))\n\n    // Arrow visibility formula \u2014 DECISION-011\n    const showArrowControls = (carousel?.showArrows ?? true) && items.length > 1\n\n    // Pagination dots visibility formula \u2014 DECISION-006\n    const showDots = carousel?.showDots ?? true\n\n    // Autoplay module configuration \u2014 DECISION-006\n    const autoplaySeconds = carousel?.autoplaySeconds\n    const swiperModules = autoplaySeconds !== undefined ? [Navigation, Pagination, Autoplay] : [Navigation, Pagination]\n    const autoplayConfig =\n      autoplaySeconds !== undefined ? { delay: autoplaySeconds * 1000, disableOnInteraction: false } : false\n\n    // Post-mount effect: pause all non-active (index !== 0) slide videos.\n    // Wins the race against ScrollLoadVideo's IO rootMargin='200px' auto-play (ISSUE-017).\n    useEffect(() => {\n      videoRefs.current.forEach((vRef, i) => {\n        if (i !== 0 && vRef.current) {\n          vRef.current.pause()\n          vRef.current.currentTime = 0\n        }\n      })\n    }, [])\n\n    // Slide transition handler \u2014 pause outgoing, play incoming (DECISION-A003 / DECISION-009)\n    const handleSlideChange = useCallback((swiper: SwiperType) => {\n      const newIndex = swiper.realIndex\n      // Pause and reset all non-active slide videos\n      videoRefs.current.forEach((vRef, i) => {\n        if (i !== newIndex && vRef.current) {\n          vRef.current.pause()\n          vRef.current.currentTime = 0\n        }\n      })\n      // Play incoming slide video \u2014 guard against AbortError from rapid swipe (ISSUE-005)\n      const incoming = videoRefs.current[newIndex]\n      if (incoming?.current && incoming.current.paused) {\n        const p = incoming.current.play()\n        p?.catch(() => {}) // Absorb AbortError silently\n      }\n      setActiveIndex(newIndex)\n    }, [])\n\n    return (\n      <div ref={ref} className={cn('hero-banner-carousel relative w-full overflow-hidden', className)} {...rest}>\n        <Swiper\n          onSwiper={s => (swiperRef.current = s)}\n          onSlideChange={handleSlideChange}\n          modules={swiperModules}\n          slidesPerView={1}\n          loop={carousel?.loop ?? true}\n          initialSlide={0}\n          allowTouchMove={true}\n          autoplay={autoplayConfig}\n          pagination={\n            showDots\n              ? {\n                  clickable: true,\n                  el: '.hero-banner-pagination',\n                  renderBullet: (_index: number, className: string) => `<span class=\"${className} banner-dot\"></span>`,\n                }\n              : false\n          }\n        >\n          {items.map((slideData, index) => (\n            <SwiperSlide key={index}>\n              {({ isActive }) => (\n                <HeroBannerSlide\n                  data={slideData}\n                  isActive={isActive}\n                  videoRef={videoRefs.current[index]}\n                  onPrimaryClick={_onPrimaryClick}\n                  onSecondaryClick={_onSecondaryClick}\n                />\n              )}\n            </SwiperSlide>\n          ))}\n        </Swiper>\n\n        {/* Arrow navigation \u2014 z-[20] to stay above blockLink overlay (z-10) \u2014 DECISION-A006 */}\n        {showArrowControls && (\n          <div className=\"pointer-events-none absolute inset-0 z-20 flex items-center justify-between px-4\">\n            <button\n              type=\"button\"\n              className=\"tablet:flex pointer-events-auto hidden items-center justify-center\"\n              onClick={() => swiperRef.current?.slidePrev()}\n              aria-label=\"Previous banner\"\n            >\n              <ChevronLeft />\n            </button>\n            <button\n              type=\"button\"\n              className=\"tablet:flex pointer-events-auto hidden items-center justify-center\"\n              onClick={() => swiperRef.current?.slideNext()}\n              aria-label=\"Next banner\"\n            >\n              <ChevronRight />\n            </button>\n          </div>\n        )}\n\n        {/* Pagination dots \u2014 visible on all devices */}\n        {showDots && (\n          <div className=\"hero-banner-pagination swiper-pagination tablet:bottom-6 absolute bottom-5 left-1/2 z-20 flex -translate-x-1/2 items-center justify-center gap-2 [&_.banner-dot.swiper-pagination-bullet-active]:h-2 [&_.banner-dot.swiper-pagination-bullet-active]:w-8 [&_.banner-dot.swiper-pagination-bullet-active]:rounded-full [&_.banner-dot.swiper-pagination-bullet-active]:bg-[#080A0F] [&_.banner-dot]:size-2 [&_.banner-dot]:rounded-full [&_.banner-dot]:bg-[#767880] [&_.banner-dot]:transition-all [&_.banner-dot]:duration-300 [&_.banner-dot]:ease-out [&_.swiper-pagination-bullet]:m-0 [&_.swiper-pagination-bullet]:shrink-0 [&_.swiper-pagination-bullet]:opacity-100\" />\n        )}\n      </div>\n    )\n  }\n)\n\nHeroBannerCarousel.displayName = 'HeroBannerCarousel'\n\nexport default HeroBannerCarousel\n"],
+  "mappings": "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",
+  "names": ["HeroBannerCarousel_exports", "__export", "HeroBannerCarousel_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_modules", "import_ScrollLoadVideo", "import_helpers", "import_components", "import_css", "import_navigation", "import_pagination", "ChevronLeft", "ChevronRight", "HeroBannerSlide", "data", "_isActive", "videoRef", "onPrimaryClick", "onSecondaryClick", "pcVideo", "padVideo", "mobileVideo", "pcImage", "mobileImage", "isVideoLoop", "title", "subtitle", "primaryButton", "secondaryButton", "theme", "align", "titleSize", "size", "videoSrc", "posterUrl", "ScrollLoadVideo", "e", "HeroBannerCarousel", "React", "className", "_classNames", "_onPrimaryClick", "_onSecondaryClick", "rest", "ref", "items", "carousel", "swiperRef", "_activeIndex", "setActiveIndex", "videoRefs", "showArrowControls", "showDots", "autoplaySeconds", "swiperModules", "autoplayConfig", "vRef", "i", "handleSlideChange", "swiper", "newIndex", "incoming", "s", "_index", "slideData", "index", "isActive"]
+}

package/dist/cjs/biz-components/HeroBanner/index.d.ts CHANGED Viewed

	@@ -1 +1,2 @@
1 1	export { default } from './HeroBanner.js';
2	+ export type { JumpOptions } from './HeroBanner.js';

package/dist/cjs/biz-components/HeroBanner/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var m=Object.create;var t=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty;var c=(e,f)=>{for(var o in f)t(e,o,{get:f[o],enumerable:!0})},d=(e,f,o,a)=>{if(f&&typeof f=="object"||typeof f=="function")for(let r of u(f))!b.call(e,r)&&r!==o&&t(e,r,{get:()=>f[r],enumerable:!(a=p(f,r))||a.enumerable});return e};var g=(e,f,o)=>(o=e!=null?m(x(e)):{},d(f||!e||!e.__esModule?t(o,"default",{value:e,enumerable:!0}):o,e)),h=e=>d(t({},"__esModule",{value:!0}),e);var i={};c(i,{default:()=>l.default});module.exports=h(i);var l=g(require("./HeroBanner.js"));
+"use strict";var a=Object.create;var t=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,d=Object.prototype.hasOwnProperty;var i=(e,o)=>{for(var r in o)t(e,r,{get:o[r],enumerable:!0})},m=(e,o,r,f)=>{if(o&&typeof o=="object"||typeof o=="function")for(let p of u(o))!d.call(e,p)&&p!==r&&t(e,p,{get:()=>o[p],enumerable:!(f=s(o,p))||f.enumerable});return e};var j=(e,o,r)=>(r=e!=null?a(x(e)):{},m(o||!e||!e.__esModule?t(r,"default",{value:e,enumerable:!0}):r,e)),l=e=>m(t({},"__esModule",{value:!0}),e);var y={};i(y,{default:()=>n.default});module.exports=l(y);var n=j(require("./HeroBanner.js"));
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/HeroBanner/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/HeroBanner/index.tsx"],
-  "sourcesContent": ["export { default } from './HeroBanner.js'\n"],
+  "sourcesContent": ["export { default } from './HeroBanner.js'\nexport type { JumpOptions } from './HeroBanner.js'\n"],
   "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,wCAAAE,EAAAF,GAAA,IAAAG,EAAwB",
   "names": ["HeroBanner_exports", "__export", "__toCommonJS", "import_HeroBanner"]
 }

package/dist/cjs/biz-components/HeroBanner/types.d.ts CHANGED Viewed

@@ -1,6 +1,68 @@
 import type { ButtonProps } from '../../components/button.js';
 import type { Media, Theme } from '../../types/props.js';
 type TitleSizeType = '5' | '4' | '3' | '2' | '1';
+/**
+ * Carousel navigation configuration for HeroBanner. v1: arrows only.
+ * autoplay, dots, and progress are intentionally EXCLUDED from v1.
+ */
+export interface HeroBannerCarouselConfig {
+    /**
+     * Show prev/next arrow navigation controls.
+     * Only used when data.items has 2+ slides.
+     * @default true
+     */
+    showArrows?: boolean;
+    showDots?: boolean;
+    loop?: boolean;
+    autoplaySeconds?: number;
+}
+/**
+ * Per-slide data for HeroBanner carousel mode.
+ * Mirrors the single-banner data shape; no nested carousels allowed in v1.
+ */
+export interface HeroBannerSlideData {
+    title: string;
+    subtitle: string;
+    pcImage: Media;
+    mobileImage: Media;
+    label?: string;
+    endDate?: string;
+    endDate_tz?: string;
+    dateFormat?: string;
+    iconArray?: Array<any>;
+    padImage?: Media;
+    pcVideo?: Media;
+    padVideo?: Media;
+    mobileVideo?: Media;
+    isShowVideo?: boolean;
+    isVideoLoop?: boolean;
+    blockLink?: string;
+    primaryButton?: {
+        text: string;
+        link?: string;
+        isCustomPrimaryButton?: boolean;
+        customPrimaryEventId?: string;
+    } & Omit<ButtonProps, 'children'>;
+    secondaryButton?: {
+        text: string;
+        link?: string;
+        isShowPlayVideoButton?: boolean;
+        playVideoButtonText?: string;
+        playIcon?: boolean;
+        videoUrl?: Media;
+        youtubeId?: string;
+        isYoutubeVideo?: boolean;
+        isCustomSecondaryButton?: boolean;
+        customSecondaryEventId?: string;
+    } & Omit<ButtonProps, 'children'>;
+    theme?: Theme;
+    size?: 'default' | 'sm';
+    titleSize?: TitleSizeType;
+    align?: 'left' | 'center';
+    caption?: Array<{
+        title: string;
+    }>;
+}
 export interface HeroBannerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
     data: {
         /** 标签 */
@@ -60,6 +122,17 @@ export interface HeroBannerProps extends Omit<React.HTMLAttributes<HTMLDivElemen
         caption?: Array<{
             title: string;
         }>;
+        /**
+         * Carousel slide items. When present and non-empty, activates carousel mode.
+         * Single-banner mode is used when this field is absent or empty.
+         * DECISION-002: items absence = legacy single-banner path.
+         */
+        items?: HeroBannerSlideData[];
+        /**
+         * Carousel navigation configuration.
+         * Only meaningful when data.items is present and has 2+ items.
+         */
+        carousel?: HeroBannerCarouselConfig;
     };
     onSecondaryClick?: (data: any, e: any, customPrimaryEventId?: string) => void;
     onPrimaryClick?: (data: any, e: any, customSecondaryEventId?: string) => void;

package/dist/cjs/biz-components/HeroBanner/types.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var n=Object.defineProperty;var r=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var l=(e,t,a,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of s(t))!d.call(e,i)&&i!==a&&n(e,i,{get:()=>t[i],enumerable:!(o=r(t,i))||o.enumerable});return e};var m=e=>l(n({},"__esModule",{value:!0}),e);var y={};module.exports=m(y);
+"use strict";var n=Object.defineProperty;var r=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var l=(t,e,a,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of s(e))!d.call(t,o)&&o!==a&&n(t,o,{get:()=>e[o],enumerable:!(i=r(e,o))||i.enumerable});return t};var m=t=>l(n({},"__esModule",{value:!0}),t);var u={};module.exports=m(u);
 //# sourceMappingURL=types.js.map

package/dist/cjs/biz-components/HeroBanner/types.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/HeroBanner/types.ts"],
-  "sourcesContent": ["import type { ButtonProps } from '../../components/button.js'\nimport type { Media, Theme } from '../../types/props.js'\n\ntype TitleSizeType = '5' | '4' | '3' | '2' | '1'\nexport interface HeroBannerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n  data: {\n    /** \u6807\u7B7E */\n    label?: string\n    /** \u4E3B\u6807\u9898 */\n    title: string\n    /** \u526F\u6807\u9898/\u63CF\u8FF0\u6587\u672C */\n    subtitle: string\n    /** \u7ED3\u675F\u65F6\u95F4\uFF08ISO \u5B57\u7B26\u4E32\uFF09 */\n    endDate?: string\n    /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF08\u5982: America/Los_Angeles\uFF09 */\n    endDate_tz?: string\n    dateFormat?: string\n    /** \u56FE\u6807\u5217\u8868 */\n    iconArray?: Array<any>\n    pcImage: Media\n    padImage?: Media\n    mobileImage: Media\n    pcVideo?: Media\n    padVideo?: Media\n    mobileVideo?: Media\n    isShowVideo?: boolean\n    /** \u89C6\u9891\u662F\u5426\u5FAA\u73AF\u64AD\u653E */\n    isVideoLoop?: boolean\n    blockLink?: string\n    /** \u4E3B\u6309\u94AE\u6587\u672C\u548C\u914D\u7F6E */\n    primaryButton?: {\n      text: string\n      link?: string\n      isCustomPrimaryButton?: boolean\n      /** \u81EA\u5B9A\u4E49\u4E8B\u4EF6ID\uFF0C\u4F20\u9012\u7ED9 onPrimaryClick */\n      customPrimaryEventId?: string\n    } & Omit<ButtonProps, 'children'>\n    /** \u6B21\u8981\u6309\u94AE\u6587\u672C\u548C\u914D\u7F6E */\n    secondaryButton?: {\n      text: string\n      link?: string\n      isShowPlayVideoButton?: boolean\n      playVideoButtonText?: string\n      playIcon?: boolean\n      videoUrl?: Media\n      youtubeId?: string\n      /** \u662F\u5426\u4E3AYouTube\u89C6\u9891\uFF0Ctrue\u65F6\u64AD\u653EYouTube\u89C6\u9891\uFF08\u9700\u8981youtubeId\uFF09\uFF0Cfalse\u65F6\u64AD\u653E\u539F\u751Fvideo\uFF08\u9700\u8981isShowPlayVideoButton\u4E3Atrue\u4E14videoUrl.url\u5B58\u5728\uFF09 */\n      isYoutubeVideo?: boolean\n      isCustomSecondaryButton?: boolean\n      /** \u81EA\u5B9A\u4E49\u4E8B\u4EF6ID\uFF0C\u4F20\u9012\u7ED9 onSecondaryClick */\n      customSecondaryEventId?: string\n    } & Omit<ButtonProps, 'children'>\n    /** \u4E3B\u9898 */\n    theme?: Theme\n    /** \u5927\u5C0F, \u9ED8\u8BA4default,\u5355banner, \u53EF\u9009sm, \u7528\u4E8E\u591Abanner\u573A\u666F */\n    size?: 'default' | 'sm'\n    titleSize?: TitleSizeType\n    /** \u5185\u5BB9\u5BF9\u9F50\u65B9\u5F0F */\n    align?: 'left' | 'center'\n    /** \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */\n    caption?: Array<{\n      title: string\n    }>\n  }\n  onSecondaryClick?: (data: any, e: any, customPrimaryEventId?: string) => void\n  onPrimaryClick?: (data: any, e: any, customSecondaryEventId?: string) => void\n}\n"],
+  "sourcesContent": ["import type { ButtonProps } from '../../components/button.js'\nimport type { Media, Theme } from '../../types/props.js'\n\ntype TitleSizeType = '5' | '4' | '3' | '2' | '1'\n\n/**\n * Carousel navigation configuration for HeroBanner. v1: arrows only.\n * autoplay, dots, and progress are intentionally EXCLUDED from v1.\n */\nexport interface HeroBannerCarouselConfig {\n  /**\n   * Show prev/next arrow navigation controls.\n   * Only used when data.items has 2+ slides.\n   * @default true\n   */\n  showArrows?: boolean\n  showDots?: boolean\n  loop?: boolean\n  autoplaySeconds?: number\n}\n\n/**\n * Per-slide data for HeroBanner carousel mode.\n * Mirrors the single-banner data shape; no nested carousels allowed in v1.\n */\nexport interface HeroBannerSlideData {\n  // \u2500\u2500 Required (same constraints as single-banner) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n  title: string\n  subtitle: string\n  pcImage: Media\n  mobileImage: Media\n\n  // \u2500\u2500 Optional (all existing HeroBannerData optionals carried over) \u2500\u2500\u2500\u2500\u2500\n  label?: string\n  endDate?: string\n  endDate_tz?: string\n  dateFormat?: string\n  iconArray?: Array<any>\n  padImage?: Media\n  pcVideo?: Media\n  padVideo?: Media\n  mobileVideo?: Media\n  isShowVideo?: boolean\n  isVideoLoop?: boolean\n  blockLink?: string\n  primaryButton?: {\n    text: string\n    link?: string\n    isCustomPrimaryButton?: boolean\n    customPrimaryEventId?: string\n  } & Omit<ButtonProps, 'children'>\n  secondaryButton?: {\n    text: string\n    link?: string\n    isShowPlayVideoButton?: boolean\n    playVideoButtonText?: string\n    playIcon?: boolean\n    videoUrl?: Media\n    youtubeId?: string\n    isYoutubeVideo?: boolean\n    isCustomSecondaryButton?: boolean\n    customSecondaryEventId?: string\n  } & Omit<ButtonProps, 'children'>\n  theme?: Theme\n  size?: 'default' | 'sm'\n  titleSize?: TitleSizeType\n  align?: 'left' | 'center'\n  caption?: Array<{ title: string }>\n}\n\nexport interface HeroBannerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n  data: {\n    /** \u6807\u7B7E */\n    label?: string\n    /** \u4E3B\u6807\u9898 */\n    title: string\n    /** \u526F\u6807\u9898/\u63CF\u8FF0\u6587\u672C */\n    subtitle: string\n    /** \u7ED3\u675F\u65F6\u95F4\uFF08ISO \u5B57\u7B26\u4E32\uFF09 */\n    endDate?: string\n    /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF08\u5982: America/Los_Angeles\uFF09 */\n    endDate_tz?: string\n    dateFormat?: string\n    /** \u56FE\u6807\u5217\u8868 */\n    iconArray?: Array<any>\n    pcImage: Media\n    padImage?: Media\n    mobileImage: Media\n    pcVideo?: Media\n    padVideo?: Media\n    mobileVideo?: Media\n    isShowVideo?: boolean\n    /** \u89C6\u9891\u662F\u5426\u5FAA\u73AF\u64AD\u653E */\n    isVideoLoop?: boolean\n    blockLink?: string\n    /** \u4E3B\u6309\u94AE\u6587\u672C\u548C\u914D\u7F6E */\n    primaryButton?: {\n      text: string\n      link?: string\n      isCustomPrimaryButton?: boolean\n      /** \u81EA\u5B9A\u4E49\u4E8B\u4EF6ID\uFF0C\u4F20\u9012\u7ED9 onPrimaryClick */\n      customPrimaryEventId?: string\n    } & Omit<ButtonProps, 'children'>\n    /** \u6B21\u8981\u6309\u94AE\u6587\u672C\u548C\u914D\u7F6E */\n    secondaryButton?: {\n      text: string\n      link?: string\n      isShowPlayVideoButton?: boolean\n      playVideoButtonText?: string\n      playIcon?: boolean\n      videoUrl?: Media\n      youtubeId?: string\n      /** \u662F\u5426\u4E3AYouTube\u89C6\u9891\uFF0Ctrue\u65F6\u64AD\u653EYouTube\u89C6\u9891\uFF08\u9700\u8981youtubeId\uFF09\uFF0Cfalse\u65F6\u64AD\u653E\u539F\u751Fvideo\uFF08\u9700\u8981isShowPlayVideoButton\u4E3Atrue\u4E14videoUrl.url\u5B58\u5728\uFF09 */\n      isYoutubeVideo?: boolean\n      isCustomSecondaryButton?: boolean\n      /** \u81EA\u5B9A\u4E49\u4E8B\u4EF6ID\uFF0C\u4F20\u9012\u7ED9 onSecondaryClick */\n      customSecondaryEventId?: string\n    } & Omit<ButtonProps, 'children'>\n    /** \u4E3B\u9898 */\n    theme?: Theme\n    /** \u5927\u5C0F, \u9ED8\u8BA4default,\u5355banner, \u53EF\u9009sm, \u7528\u4E8E\u591Abanner\u573A\u666F */\n    size?: 'default' | 'sm'\n    titleSize?: TitleSizeType\n    /** \u5185\u5BB9\u5BF9\u9F50\u65B9\u5F0F */\n    align?: 'left' | 'center'\n    /** \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */\n    caption?: Array<{\n      title: string\n    }>\n    /**\n     * Carousel slide items. When present and non-empty, activates carousel mode.\n     * Single-banner mode is used when this field is absent or empty.\n     * DECISION-002: items absence = legacy single-banner path.\n     */\n    items?: HeroBannerSlideData[]\n    /**\n     * Carousel navigation configuration.\n     * Only meaningful when data.items is present and has 2+ items.\n     */\n    carousel?: HeroBannerCarouselConfig\n  }\n  onSecondaryClick?: (data: any, e: any, customPrimaryEventId?: string) => void\n  onPrimaryClick?: (data: any, e: any, customSecondaryEventId?: string) => void\n}\n"],
   "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
   "names": ["types_exports", "__toCommonJS"]
 }

package/dist/cjs/biz-components/ImageOverlayShelf/index.d.ts CHANGED Viewed

@@ -14,7 +14,7 @@ export interface ImageOverlayShelfData {
     /** 产品列表 */
     productsCard: ProductCardData[];
     /** 是否显示标签 */
-    showTags?: boolean;
+    isShowTag?: boolean;
     /** 是否显示原价 */
     showOriginalPrice?: boolean;
     /** 了解更多按钮文本 */
@@ -63,7 +63,7 @@ export interface ImageOverlayShelfComponent extends React.ForwardRefExoticCompon
     ProductCard: typeof ProductCard;
 }
 export { ProductCard };
-declare const ImageOverlayShelfWrapped: React.ForwardRefExoticComponent<Omit<ImageOverlayShelfProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps & React.RefAttributes<unknown>> & {
+declare const ImageOverlayShelfWrapped: React.ForwardRefExoticComponent<Omit<ImageOverlayShelfProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../WheelLottery/index.js").ContainerProps & React.RefAttributes<unknown>> & {
     readonly $$typeof: symbol;
     ProductCard: typeof ProductCard;
 };

package/dist/cjs/biz-components/ImageOverlayShelf/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var V=Object.create;var c=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var _=(e,t)=>{for(var r in t)c(e,r,{get:t[r],enumerable:!0})},f=(e,t,r,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of j(t))!W.call(e,a)&&a!==r&&c(e,a,{get:()=>t[a],enumerable:!(i=A(t,a))||i.enumerable});return e};var y=(e,t,r)=>(r=e!=null?V(z(e)):{},f(t||!e||!e.__esModule?c(r,"default",{value:e,enumerable:!0}):r,e)),q=e=>f(c({},"__esModule",{value:!0}),e);var U={};_(U,{ProductCard:()=>n.default,default:()=>Q});module.exports=q(U);var o=require("react/jsx-runtime"),P=y(require("react")),d=require("../../helpers/utils.js"),v=require("../../shared/Styles.js"),l=require("swiper/react"),Y=require("swiper/css"),C=require("../../components/text.js"),w=require("../../components/heading.js"),S=require("react"),n=y(require("./ProductCard.js")),T=require("../../hooks/useExposure.js");const G="shelf",J="image_overlay_shelf",g=(0,S.forwardRef)(({data:e,onLearnMore:t,onShopNow:r,onAddToCart:i,onProductImageClick:a,classNames:s,copy:x,breakpoints:B,className:O="",...I},b)=>{const m=P.useRef(null);(0,T.useExposure)(m,{componentType:G,componentName:J,componentTitle:e.title,componentDescription:e.description}),P.useImperativeHandle(b,()=>m.current);const{productsCard:p=[],showTags:D=!0,showOriginalPrice:M=!0,secondaryButtonText:N,secondaryButtonFun:R,primaryButtonText:F,primaryButtonFun:H}=e,L={showTags:D,showOriginalPrice:M,secondaryButtonText:N,secondaryButtonFun:R,primaryButtonText:F,primaryButtonFun:H,onLearnMore:t,onShopNow:r,onAddToCart:i,onProductImageClick:a,classNames:s,copy:x},k={0:{spaceBetween:12,slidesPerView:1.2},768:{spaceBetween:16,slidesPerView:p.length<=2?2:2.2},1024:{spaceBetween:16,slidesPerView:p.length<=2?2:3},1440:{spaceBetween:16,slidesPerView:Math.max(2,Math.min(4,p.length))}};return(0,o.jsxs)("div",{ref:m,className:(0,d.cn)("collection-shelves-wrap w-full",O,s?.root),...I,children:[e.title&&(0,o.jsx)(w.Heading,{as:"h2",size:4,className:(0,d.cn)("text-info-primary mb-4",s?.title),children:e.title}),e.description&&(0,o.jsx)(C.Text,{size:3,as:"p",className:(0,d.cn)("text-info-primary mb-6",s?.description),children:e.description}),(0,o.jsx)(l.Swiper,{spaceBetween:16,slidesPerView:"auto",className:"!overflow-visible",breakpoints:B||k,children:p.map((u,E)=>(0,o.jsx)(l.SwiperSlide,{children:(0,o.jsx)(n.default,{product:u,...L})},u.sku||E))})]})});g.displayName="ImageOverlayShelf";const h=g;h.ProductCard=n.default;const K=(0,v.withLayout)(h);var Q=K;
+"use strict";"use client";var V=Object.create;var c=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var _=(e,t)=>{for(var r in t)c(e,r,{get:t[r],enumerable:!0})},f=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of j(t))!W.call(e,a)&&a!==r&&c(e,a,{get:()=>t[a],enumerable:!(n=A(t,a))||n.enumerable});return e};var y=(e,t,r)=>(r=e!=null?V(z(e)):{},f(t||!e||!e.__esModule?c(r,"default",{value:e,enumerable:!0}):r,e)),q=e=>f(c({},"__esModule",{value:!0}),e);var U={};_(U,{ProductCard:()=>i.default,default:()=>Q});module.exports=q(U);var o=require("react/jsx-runtime"),P=y(require("react")),d=require("../../helpers/utils.js"),v=require("../../shared/Styles.js"),l=require("swiper/react"),Y=require("swiper/css"),C=require("../../components/text.js"),w=require("../../components/heading.js"),S=require("react"),i=y(require("./ProductCard.js")),T=require("../../hooks/useExposure.js");const G="shelf",J="image_overlay_shelf",g=(0,S.forwardRef)(({data:e,onLearnMore:t,onShopNow:r,onAddToCart:n,onProductImageClick:a,classNames:s,copy:x,breakpoints:B,className:O="",...I},b)=>{const m=P.useRef(null);(0,T.useExposure)(m,{componentType:G,componentName:J,componentTitle:e.title,componentDescription:e.description}),P.useImperativeHandle(b,()=>m.current);const{productsCard:p=[],isShowTag:D=!0,showOriginalPrice:M=!0,secondaryButtonText:N,secondaryButtonFun:R,primaryButtonText:F,primaryButtonFun:H}=e,L={showTags:D,showOriginalPrice:M,secondaryButtonText:N,secondaryButtonFun:R,primaryButtonText:F,primaryButtonFun:H,onLearnMore:t,onShopNow:r,onAddToCart:n,onProductImageClick:a,classNames:s,copy:x},k={0:{spaceBetween:12,slidesPerView:1.2},768:{spaceBetween:16,slidesPerView:p.length<=2?2:2.2},1024:{spaceBetween:16,slidesPerView:p.length<=2?2:3},1440:{spaceBetween:16,slidesPerView:Math.max(2,Math.min(4,p.length))}};return(0,o.jsxs)("div",{ref:m,className:(0,d.cn)("collection-shelves-wrap w-full",O,s?.root),...I,children:[e.title&&(0,o.jsx)(w.Heading,{as:"h2",size:4,className:(0,d.cn)("text-info-primary mb-4",s?.title),children:e.title}),e.description&&(0,o.jsx)(C.Text,{size:3,as:"p",className:(0,d.cn)("text-info-primary mb-6",s?.description),children:e.description}),(0,o.jsx)(l.Swiper,{spaceBetween:16,slidesPerView:"auto",className:"!overflow-visible",breakpoints:B||k,children:p.map((u,E)=>(0,o.jsx)(l.SwiperSlide,{children:(0,o.jsx)(i.default,{product:u,...L})},u.sku||E))})]})});g.displayName="ImageOverlayShelf";const h=g;h.ProductCard=i.default;const K=(0,v.withLayout)(h);var Q=K;
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/ImageOverlayShelf/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ImageOverlayShelf/index.tsx"],
-  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport 'swiper/css'\n\nimport { Text } from '../../components/text.js'\nimport { Heading } from '../../components/heading.js'\nimport { forwardRef } from 'react'\n\nimport ProductCard from './ProductCard.js'\nimport type {\n  ProductCardData,\n  ProductCardProps,\n  ButtonFunctionType,\n  ImageOverlayShelfSemanticName,\n  CopyConfig,\n} from './types.js'\nimport { useExposure } from '../../hooks/useExposure.js'\n\nconst componentType = 'shelf'\nconst componentName = 'image_overlay_shelf'\n\n// Re-export types for external use\nexport type {\n  ButtonFunctionType,\n  ProductCardData,\n  ProductCardProps,\n  ImageOverlayShelfSemanticName,\n  CopyConfig,\n  ImageObjectPosition,\n} from './types.js'\n\n/**\n * ImageOverlayShelf \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface ImageOverlayShelfData {\n  /** \u7EC4\u4EF6\u6807\u9898 */\n  title?: string\n  /** \u7EC4\u4EF6\u63CF\u8FF0 */\n  description?: string\n  /** \u4EA7\u54C1\u5217\u8868 */\n  productsCard: ProductCardData[]\n  /** \u662F\u5426\u663E\u793A\u6807\u7B7E */\n  showTags?: boolean\n  /** \u662F\u5426\u663E\u793A\u539F\u4EF7 */\n  showOriginalPrice?: boolean\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}\n\n/**\n * ImageOverlayShelf Props \u63A5\u53E3\n */\nexport interface ImageOverlayShelfProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: ImageOverlayShelfData\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  /** \u70B9\u51FB\u4EA7\u54C1\u56FE\u7247\u56DE\u8C03 */\n  onProductImageClick?: (product: ProductCardData) => void\n  /** \u8BED\u4E49\u5316\u7C7B\u540D */\n  classNames?: Partial<Record<ImageOverlayShelfSemanticName, string>>\n  /** \u6837\u5F0F\u7C7B\u540D */\n  className?: string\n  /** \u6587\u6848\u914D\u7F6E */\n  copy?: CopyConfig\n  /** \u65AD\u70B9\u914D\u7F6E */\n  breakpoints?: {\n    [key: number]: {\n      spaceBetween: number\n      freeMode: boolean\n      slidesPerView: number\n    }\n  }\n}\n\n/**\n * ImageOverlayShelf \u590D\u5408\u7EC4\u4EF6\u7C7B\u578B\u5B9A\u4E49\n */\nexport interface ImageOverlayShelfComponent extends React.ForwardRefExoticComponent<\n  ImageOverlayShelfProps & React.RefAttributes<HTMLDivElement>\n> {\n  /** \u72EC\u7ACB\u7684 ProductCard \u7EC4\u4EF6 */\n  ProductCard: typeof ProductCard\n}\n\n/**\n * \u5171\u4EAB Props \u7C7B\u578B\uFF08\u900F\u4F20\u7ED9 ProductCard\uFF09\n */\ntype SharedProductCardProps = Omit<ProductCardProps, 'product' | 'className'>\n\nconst ImageOverlayShelf = forwardRef<HTMLDivElement, ImageOverlayShelfProps>(\n  (\n    {\n      data,\n      onLearnMore,\n      onShopNow,\n      onAddToCart,\n      onProductImageClick,\n      classNames,\n      copy,\n      breakpoints,\n      className = '',\n      ...props\n    },\n    ref\n  ) => {\n    const boxRef = React.useRef<HTMLDivElement>(null)\n\n    useExposure(boxRef, {\n      componentType,\n      componentName,\n      componentTitle: data.title,\n      componentDescription: data.description,\n    })\n\n    React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n    const {\n      productsCard: products = [],\n      showTags = true,\n      showOriginalPrice = true,\n      secondaryButtonText,\n      secondaryButtonFun,\n      primaryButtonText,\n      primaryButtonFun,\n    } = data\n\n    // \u6784\u5EFA\u5171\u4EAB props\uFF08\u900F\u4F20\u7ED9 ProductCard\uFF09\n    const sharedProps: SharedProductCardProps = {\n      showTags,\n      showOriginalPrice,\n      secondaryButtonText,\n      secondaryButtonFun,\n      primaryButtonText,\n      primaryButtonFun,\n      onLearnMore,\n      onShopNow,\n      onAddToCart,\n      onProductImageClick,\n      classNames,\n      copy,\n    }\n\n    // \u9ED8\u8BA4\u65AD\u70B9\u914D\u7F6E\n    const defaultBreakpoints = {\n      0: {\n        spaceBetween: 12,\n        slidesPerView: 1.2,\n      },\n      768: {\n        spaceBetween: 16,\n        slidesPerView: products.length <= 2 ? 2 : 2.2,\n      },\n      1024: {\n        spaceBetween: 16,\n        slidesPerView: products.length <= 2 ? 2 : 3,\n      },\n      1440: {\n        spaceBetween: 16,\n        slidesPerView: Math.max(2, Math.min(4, products.length)),\n      },\n    }\n\n    return (\n      <div ref={boxRef} className={cn('collection-shelves-wrap w-full', className, classNames?.root)} {...props}>\n        {/* \u6807\u9898\u533A\u57DF */}\n        {data.title && (\n          <Heading as=\"h2\" size={4} className={cn('text-info-primary mb-4', classNames?.title)}>\n            {data.title}\n          </Heading>\n        )}\n        {data.description && (\n          <Text size={3} as=\"p\" className={cn('text-info-primary mb-6', classNames?.description)}>\n            {data.description}\n          </Text>\n        )}\n\n        {/* Swiper \u6A2A\u5411\u6ED1\u52A8\u5E03\u5C40 */}\n        <Swiper\n          spaceBetween={16}\n          slidesPerView=\"auto\"\n          className=\"!overflow-visible\"\n          breakpoints={breakpoints || defaultBreakpoints}\n        >\n          {products.map((product, index) => (\n            <SwiperSlide key={product.sku || index}>\n              <ProductCard product={product} {...sharedProps} />\n            </SwiperSlide>\n          ))}\n        </Swiper>\n      </div>\n    )\n  }\n)\n\nImageOverlayShelf.displayName = 'ImageOverlayShelf'\n\n// \u521B\u5EFA\u590D\u5408\u7EC4\u4EF6\nconst ImageOverlayShelfWithProductCard = ImageOverlayShelf as ImageOverlayShelfComponent\nImageOverlayShelfWithProductCard.ProductCard = ProductCard\n\nexport { ProductCard }\nconst ImageOverlayShelfWrapped = withLayout(ImageOverlayShelfWithProductCard)\nexport default ImageOverlayShelfWrapped\n"],
-  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mBAAAE,QAAA,YAAAC,IAAA,eAAAC,EAAAJ,GAkLM,IAAAK,EAAA,6BAjLNC,EAAuB,oBACvBC,EAAmB,kCACnBC,EAA2B,kCAE3BC,EAAoC,wBACpCC,EAAO,sBAEPC,EAAqB,oCACrBC,EAAwB,uCACxBH,EAA2B,iBAE3BI,EAAwB,+BAQxBC,EAA4B,sCAE5B,MAAMC,EAAgB,QAChBC,EAAgB,sBAiFhBC,KAAoB,cACxB,CACE,CACE,KAAAC,EACA,YAAAC,EACA,UAAAC,EACA,YAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,KAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAASvB,EAAM,OAAuB,IAAI,KAEhD,eAAYuB,EAAQ,CAClB,cAAAd,EACA,cAAAC,EACA,eAAgBE,EAAK,MACrB,qBAAsBA,EAAK,WAC7B,CAAC,EAEDZ,EAAM,oBAAoBsB,EAAK,IAAMC,EAAO,OAAyB,EAErE,KAAM,CACJ,aAAcC,EAAW,CAAC,EAC1B,SAAAC,EAAW,GACX,kBAAAC,EAAoB,GACpB,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,CACF,EAAIlB,EAGEmB,EAAsC,CAC1C,SAAAN,EACA,kBAAAC,EACA,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,EACA,YAAAjB,EACA,UAAAC,EACA,YAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,KAAAC,CACF,EAGMc,EAAqB,CACzB,EAAG,CACD,aAAc,GACd,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,cAAeR,EAAS,QAAU,EAAI,EAAI,GAC5C,EACA,KAAM,CACJ,aAAc,GACd,cAAeA,EAAS,QAAU,EAAI,EAAI,CAC5C,EACA,KAAM,CACJ,aAAc,GACd,cAAe,KAAK,IAAI,EAAG,KAAK,IAAI,EAAGA,EAAS,MAAM,CAAC,CACzD,CACF,EAEA,SACE,QAAC,OAAI,IAAKD,EAAQ,aAAW,MAAG,iCAAkCH,EAAWH,GAAY,IAAI,EAAI,GAAGI,EAEjG,UAAAT,EAAK,UACJ,OAAC,WAAQ,GAAG,KAAK,KAAM,EAAG,aAAW,MAAG,yBAA0BK,GAAY,KAAK,EAChF,SAAAL,EAAK,MACR,EAEDA,EAAK,gBACJ,OAAC,QAAK,KAAM,EAAG,GAAG,IAAI,aAAW,MAAG,yBAA0BK,GAAY,WAAW,EAClF,SAAAL,EAAK,YACR,KAIF,OAAC,UACC,aAAc,GACd,cAAc,OACd,UAAU,oBACV,YAAaO,GAAea,EAE3B,SAAAR,EAAS,IAAI,CAACS,EAASC,OACtB,OAAC,eACC,mBAAC,EAAAtC,QAAA,CAAY,QAASqC,EAAU,GAAGF,EAAa,GADhCE,EAAQ,KAAOC,CAEjC,CACD,EACH,GACF,CAEJ,CACF,EAEAvB,EAAkB,YAAc,oBAGhC,MAAMwB,EAAmCxB,EACzCwB,EAAiC,YAAc,EAAAvC,QAG/C,MAAMwC,KAA2B,cAAWD,CAAgC,EAC5E,IAAOtC,EAAQuC",
-  "names": ["ImageOverlayShelf_exports", "__export", "ProductCard", "ImageOverlayShelf_default", "__toCommonJS", "import_jsx_runtime", "React", "import_utils", "import_Styles", "import_react", "import_css", "import_text", "import_heading", "import_ProductCard", "import_useExposure", "componentType", "componentName", "ImageOverlayShelf", "data", "onLearnMore", "onShopNow", "onAddToCart", "onProductImageClick", "classNames", "copy", "breakpoints", "className", "props", "ref", "boxRef", "products", "showTags", "showOriginalPrice", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "sharedProps", "defaultBreakpoints", "product", "index", "ImageOverlayShelfWithProductCard", "ImageOverlayShelfWrapped"]
+  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport 'swiper/css'\n\nimport { Text } from '../../components/text.js'\nimport { Heading } from '../../components/heading.js'\nimport { forwardRef } from 'react'\n\nimport ProductCard from './ProductCard.js'\nimport type {\n  ProductCardData,\n  ProductCardProps,\n  ButtonFunctionType,\n  ImageOverlayShelfSemanticName,\n  CopyConfig,\n} from './types.js'\nimport { useExposure } from '../../hooks/useExposure.js'\n\nconst componentType = 'shelf'\nconst componentName = 'image_overlay_shelf'\n\n// Re-export types for external use\nexport type {\n  ButtonFunctionType,\n  ProductCardData,\n  ProductCardProps,\n  ImageOverlayShelfSemanticName,\n  CopyConfig,\n  ImageObjectPosition,\n} from './types.js'\n\n/**\n * ImageOverlayShelf \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface ImageOverlayShelfData {\n  /** \u7EC4\u4EF6\u6807\u9898 */\n  title?: string\n  /** \u7EC4\u4EF6\u63CF\u8FF0 */\n  description?: string\n  /** \u4EA7\u54C1\u5217\u8868 */\n  productsCard: ProductCardData[]\n  /** \u662F\u5426\u663E\u793A\u6807\u7B7E */\n  isShowTag?: boolean\n  /** \u662F\u5426\u663E\u793A\u539F\u4EF7 */\n  showOriginalPrice?: boolean\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}\n\n/**\n * ImageOverlayShelf Props \u63A5\u53E3\n */\nexport interface ImageOverlayShelfProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: ImageOverlayShelfData\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  /** \u70B9\u51FB\u4EA7\u54C1\u56FE\u7247\u56DE\u8C03 */\n  onProductImageClick?: (product: ProductCardData) => void\n  /** \u8BED\u4E49\u5316\u7C7B\u540D */\n  classNames?: Partial<Record<ImageOverlayShelfSemanticName, string>>\n  /** \u6837\u5F0F\u7C7B\u540D */\n  className?: string\n  /** \u6587\u6848\u914D\u7F6E */\n  copy?: CopyConfig\n  /** \u65AD\u70B9\u914D\u7F6E */\n  breakpoints?: {\n    [key: number]: {\n      spaceBetween: number\n      freeMode: boolean\n      slidesPerView: number\n    }\n  }\n}\n\n/**\n * ImageOverlayShelf \u590D\u5408\u7EC4\u4EF6\u7C7B\u578B\u5B9A\u4E49\n */\nexport interface ImageOverlayShelfComponent extends React.ForwardRefExoticComponent<\n  ImageOverlayShelfProps & React.RefAttributes<HTMLDivElement>\n> {\n  /** \u72EC\u7ACB\u7684 ProductCard \u7EC4\u4EF6 */\n  ProductCard: typeof ProductCard\n}\n\n/**\n * \u5171\u4EAB Props \u7C7B\u578B\uFF08\u900F\u4F20\u7ED9 ProductCard\uFF09\n */\ntype SharedProductCardProps = Omit<ProductCardProps, 'product' | 'className'>\n\nconst ImageOverlayShelf = forwardRef<HTMLDivElement, ImageOverlayShelfProps>(\n  (\n    {\n      data,\n      onLearnMore,\n      onShopNow,\n      onAddToCart,\n      onProductImageClick,\n      classNames,\n      copy,\n      breakpoints,\n      className = '',\n      ...props\n    },\n    ref\n  ) => {\n    const boxRef = React.useRef<HTMLDivElement>(null)\n\n    useExposure(boxRef, {\n      componentType,\n      componentName,\n      componentTitle: data.title,\n      componentDescription: data.description,\n    })\n\n    React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n    const {\n      productsCard: products = [],\n      isShowTag = true,\n      showOriginalPrice = true,\n      secondaryButtonText,\n      secondaryButtonFun,\n      primaryButtonText,\n      primaryButtonFun,\n    } = data\n\n    // \u6784\u5EFA\u5171\u4EAB props\uFF08\u900F\u4F20\u7ED9 ProductCard\uFF09\n    const sharedProps: SharedProductCardProps = {\n      showTags: isShowTag,\n      showOriginalPrice,\n      secondaryButtonText,\n      secondaryButtonFun,\n      primaryButtonText,\n      primaryButtonFun,\n      onLearnMore,\n      onShopNow,\n      onAddToCart,\n      onProductImageClick,\n      classNames,\n      copy,\n    }\n\n    // \u9ED8\u8BA4\u65AD\u70B9\u914D\u7F6E\n    const defaultBreakpoints = {\n      0: {\n        spaceBetween: 12,\n        slidesPerView: 1.2,\n      },\n      768: {\n        spaceBetween: 16,\n        slidesPerView: products.length <= 2 ? 2 : 2.2,\n      },\n      1024: {\n        spaceBetween: 16,\n        slidesPerView: products.length <= 2 ? 2 : 3,\n      },\n      1440: {\n        spaceBetween: 16,\n        slidesPerView: Math.max(2, Math.min(4, products.length)),\n      },\n    }\n\n    return (\n      <div ref={boxRef} className={cn('collection-shelves-wrap w-full', className, classNames?.root)} {...props}>\n        {/* \u6807\u9898\u533A\u57DF */}\n        {data.title && (\n          <Heading as=\"h2\" size={4} className={cn('text-info-primary mb-4', classNames?.title)}>\n            {data.title}\n          </Heading>\n        )}\n        {data.description && (\n          <Text size={3} as=\"p\" className={cn('text-info-primary mb-6', classNames?.description)}>\n            {data.description}\n          </Text>\n        )}\n\n        {/* Swiper \u6A2A\u5411\u6ED1\u52A8\u5E03\u5C40 */}\n        <Swiper\n          spaceBetween={16}\n          slidesPerView=\"auto\"\n          className=\"!overflow-visible\"\n          breakpoints={breakpoints || defaultBreakpoints}\n        >\n          {products.map((product, index) => (\n            <SwiperSlide key={product.sku || index}>\n              <ProductCard product={product} {...sharedProps} />\n            </SwiperSlide>\n          ))}\n        </Swiper>\n      </div>\n    )\n  }\n)\n\nImageOverlayShelf.displayName = 'ImageOverlayShelf'\n\n// \u521B\u5EFA\u590D\u5408\u7EC4\u4EF6\nconst ImageOverlayShelfWithProductCard = ImageOverlayShelf as ImageOverlayShelfComponent\nImageOverlayShelfWithProductCard.ProductCard = ProductCard\n\nexport { ProductCard }\nconst ImageOverlayShelfWrapped = withLayout(ImageOverlayShelfWithProductCard)\nexport default ImageOverlayShelfWrapped\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mBAAAE,QAAA,YAAAC,IAAA,eAAAC,EAAAJ,GAkLM,IAAAK,EAAA,6BAjLNC,EAAuB,oBACvBC,EAAmB,kCACnBC,EAA2B,kCAE3BC,EAAoC,wBACpCC,EAAO,sBAEPC,EAAqB,oCACrBC,EAAwB,uCACxBH,EAA2B,iBAE3BI,EAAwB,+BAQxBC,EAA4B,sCAE5B,MAAMC,EAAgB,QAChBC,EAAgB,sBAiFhBC,KAAoB,cACxB,CACE,CACE,KAAAC,EACA,YAAAC,EACA,UAAAC,EACA,YAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,KAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAASvB,EAAM,OAAuB,IAAI,KAEhD,eAAYuB,EAAQ,CAClB,cAAAd,EACA,cAAAC,EACA,eAAgBE,EAAK,MACrB,qBAAsBA,EAAK,WAC7B,CAAC,EAEDZ,EAAM,oBAAoBsB,EAAK,IAAMC,EAAO,OAAyB,EAErE,KAAM,CACJ,aAAcC,EAAW,CAAC,EAC1B,UAAAC,EAAY,GACZ,kBAAAC,EAAoB,GACpB,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,CACF,EAAIlB,EAGEmB,EAAsC,CAC1C,SAAUN,EACV,kBAAAC,EACA,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,EACA,YAAAjB,EACA,UAAAC,EACA,YAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,KAAAC,CACF,EAGMc,EAAqB,CACzB,EAAG,CACD,aAAc,GACd,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,cAAeR,EAAS,QAAU,EAAI,EAAI,GAC5C,EACA,KAAM,CACJ,aAAc,GACd,cAAeA,EAAS,QAAU,EAAI,EAAI,CAC5C,EACA,KAAM,CACJ,aAAc,GACd,cAAe,KAAK,IAAI,EAAG,KAAK,IAAI,EAAGA,EAAS,MAAM,CAAC,CACzD,CACF,EAEA,SACE,QAAC,OAAI,IAAKD,EAAQ,aAAW,MAAG,iCAAkCH,EAAWH,GAAY,IAAI,EAAI,GAAGI,EAEjG,UAAAT,EAAK,UACJ,OAAC,WAAQ,GAAG,KAAK,KAAM,EAAG,aAAW,MAAG,yBAA0BK,GAAY,KAAK,EAChF,SAAAL,EAAK,MACR,EAEDA,EAAK,gBACJ,OAAC,QAAK,KAAM,EAAG,GAAG,IAAI,aAAW,MAAG,yBAA0BK,GAAY,WAAW,EAClF,SAAAL,EAAK,YACR,KAIF,OAAC,UACC,aAAc,GACd,cAAc,OACd,UAAU,oBACV,YAAaO,GAAea,EAE3B,SAAAR,EAAS,IAAI,CAACS,EAASC,OACtB,OAAC,eACC,mBAAC,EAAAtC,QAAA,CAAY,QAASqC,EAAU,GAAGF,EAAa,GADhCE,EAAQ,KAAOC,CAEjC,CACD,EACH,GACF,CAEJ,CACF,EAEAvB,EAAkB,YAAc,oBAGhC,MAAMwB,EAAmCxB,EACzCwB,EAAiC,YAAc,EAAAvC,QAG/C,MAAMwC,KAA2B,cAAWD,CAAgC,EAC5E,IAAOtC,EAAQuC",
+  "names": ["ImageOverlayShelf_exports", "__export", "ProductCard", "ImageOverlayShelf_default", "__toCommonJS", "import_jsx_runtime", "React", "import_utils", "import_Styles", "import_react", "import_css", "import_text", "import_heading", "import_ProductCard", "import_useExposure", "componentType", "componentName", "ImageOverlayShelf", "data", "onLearnMore", "onShopNow", "onAddToCart", "onProductImageClick", "classNames", "copy", "breakpoints", "className", "props", "ref", "boxRef", "products", "isShowTag", "showOriginalPrice", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "sharedProps", "defaultBreakpoints", "product", "index", "ImageOverlayShelfWithProductCard", "ImageOverlayShelfWrapped"]
 }