@anker-in/headless-ui 1.1.9-temp-120101 → 1.1.9-temp-120103

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

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

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerBase/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { useState, useRef, useMemo, useEffect, forwardRef, useImperativeHandle, useCallback } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Button from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerBaseProps } from './types.js'\nimport { useInView } from 'react-intersection-observer'\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\n\nconst componentName = 'media_player_base'\nconst componentType = 'video'\n\n// \u52A8\u753B\u914D\u7F6E\u5E38\u91CF\nconst ANIMATION_CONFIG = {\n  TEXT_START_OFFSET: '10%',\n  TEXT_ANIMATION_MULTIPLIER: 1.5,\n  TEXT_ANIMATION_OFFSET: 80,\n  VIDEO_HEIGHT_BASE: 102,\n  OVERLAP_FACTOR: 0.5,\n  VIDEO_PROGRESS_THRESHOLD: 0.9,\n  HEIGHT_CHANGE_THRESHOLD: 5, // \u9AD8\u5EA6\u53D8\u5316\u9608\u503C(px)\n} as const\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\ninterface ScrollTriggerInstance {\n  progress: number\n  kill: () => void\n}\n\nconst MediaPlayerBase = forwardRef<HTMLDivElement, MediaPlayerBaseProps>(\n  (\n    {\n      className = '',\n      id,\n      onBtnClick,\n      data: { title, videoTitle, btnText, youtubeId, video, mobileVideo, theme, img, shape, titleAnimation, ...rest },\n    },\n    ref\n  ) => {\n    const { sticky } = rest\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [btb, setbtb] = useState(0)\n    const [titleHeight, setTitleHeight] = useState(0)\n    const [videoHeightProgress, setVideoHeightProgress] = useState(0)\n    const [visible, setVisible] = useState<boolean>(false)\n\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const bgRef = useRef<HTMLDivElement>(null)\n    const titleRef = useRef<HTMLDivElement>(null)\n    const titleFadeInRef = useRef<HTMLDivElement>(null)\n    const trackRef = useRef<HTMLDivElement>(null)\n    const splitTextInstance = useRef<SplitText | null>(null)\n    const scrollTriggerRef = useRef<ScrollTriggerInstance | null>(null)\n    const heightTriggerRef = useRef<ScrollTriggerInstance | null>(null)\n    const { ref: inViewRef, inView } = useInView()\n\n    useImperativeHandle(ref, () => titleRef.current as HTMLDivElement)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    const videoTitle_html =\n      typeof videoTitle === 'string'\n        ? videoTitle\n        : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    // \u89C6\u9891\u64AD\u653E\u63A7\u5236\n    useEffect(() => {\n      if (inView) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      } else {\n        videoRef.current?.pause()\n        setIsPlaying(false)\n      }\n    }, [inView])\n\n    // \u4F18\u5316: \u4F7F\u7528 ResizeObserver \u66FF\u4EE3 debounce + resize \u4E8B\u4EF6\n    useEffect(() => {\n      if (!titleRef.current || !sticky) return\n\n      // \u8BA1\u7B97\u5E03\u5C40\u5C3A\u5BF8\u7684\u6838\u5FC3\u51FD\u6570\n      const calculateLayout = () => {\n        if (!titleRef.current) return\n\n        const rect = titleRef.current.getBoundingClientRect()\n        const screenHeight = window.innerHeight\n        // const scrollTop = window.scrollY || window.pageYOffset\n        // const elementBottomToPageTop = rect.bottom + scrollTop\n        // const pageHeight = document.documentElement.scrollHeight\n        // const distanceToPageBottom = pageHeight - elementBottomToPageTop\n\n        const inViewRefToBottom = screenHeight - rect.bottom\n        const newBtb = inViewRefToBottom > screenHeight ? screenHeight : inViewRefToBottom\n        const newTitleHeight = titleRef.current.clientHeight + screenHeight\n\n        // \u4F7F\u7528\u9608\u503C\u68C0\u6D4B,\u907F\u514D\u9891\u7E41\u66F4\u65B0\n        // setbtb(prevBtb => {\n        //   return Math.abs(newBtb - prevBtb) > ANIMATION_CONFIG.HEIGHT_CHANGE_THRESHOLD ? newBtb : prevBtb\n        // })\n        setbtb(newBtb)\n\n        setTitleHeight(newTitleHeight)\n      }\n\n      // \u521D\u59CB\u8BA1\u7B97\n      calculateLayout()\n\n      // ResizeObserver \u76D1\u542C\u5C3A\u5BF8\u53D8\u5316\n      const resizeObserver = new ResizeObserver(() => {\n        // \u4F7F\u7528 requestAnimationFrame \u6279\u91CF\u66F4\u65B0\n        requestAnimationFrame(() => {\n          calculateLayout()\n        })\n      })\n\n      resizeObserver.observe(titleRef.current)\n\n      // \u76D1\u542C\u7A97\u53E3\u6EDA\u52A8(\u7528\u4E8E\u8BA1\u7B97 btb)\n      const handleScroll = () => {\n        requestAnimationFrame(() => {\n          calculateLayout()\n        })\n      }\n\n      // \u4F7F\u7528\u8282\u6D41\u7684\u6EDA\u52A8\u76D1\u542C\n      let scrollTimeout: NodeJS.Timeout\n      const throttledScroll = () => {\n        if (!scrollTimeout) {\n          scrollTimeout = setTimeout(() => {\n            handleScroll()\n            scrollTimeout = null as any\n          }, 100)\n        }\n      }\n\n      window.addEventListener('scroll', throttledScroll, { passive: true })\n\n      return () => {\n        resizeObserver.disconnect()\n        window.removeEventListener('scroll', throttledScroll)\n        if (scrollTimeout) clearTimeout(scrollTimeout)\n      }\n    }, [sticky])\n\n    // \u4F18\u5316: GSAP \u52A8\u753B\u8BBE\u7F6E\n    useEffect(() => {\n      if (!inView || !titleAnimation || titleAnimation !== 'fade-in' || !titleFadeInRef.current) return\n\n      const titleElement = titleFadeInRef.current\n      const height = titleElement.clientHeight || 80\n\n      // \u5206\u8BCD\n      splitTextInstance.current = new SplitText(titleElement, {\n        type: 'words',\n        wordsClass: 'word',\n      })\n\n      const words = splitTextInstance.current.words\n      const total = words.length\n      const interval = 1 / total\n\n      // \u9884\u8BA1\u7B97\u6BCF\u4E2A\u5355\u8BCD\u7684\u52A8\u753B\u53C2\u6570 - \u907F\u514D\u6BCF\u5E27\u91CD\u590D\u8BA1\u7B97\n      const wordAnimations = words.map((_, i) => {\n        const start = (i / total) * (1 - ANIMATION_CONFIG.OVERLAP_FACTOR)\n        const width = interval * (1 + ANIMATION_CONFIG.OVERLAP_FACTOR)\n        return { start, width }\n      })\n\n      // \u521D\u59CB\u5316\u900F\u660E\u5EA6\n      gsap.set(words, { opacity: 0 })\n\n      // \u521B\u5EFA\u6587\u5B57\u6DE1\u5165 ScrollTrigger\n      scrollTriggerRef.current = ScrollTrigger.create({\n        trigger: titleRef.current,\n        start: `top center-=${ANIMATION_CONFIG.TEXT_START_OFFSET}`,\n        end: `top+=${height * ANIMATION_CONFIG.TEXT_ANIMATION_MULTIPLIER + ANIMATION_CONFIG.TEXT_ANIMATION_OFFSET}px center-=${ANIMATION_CONFIG.TEXT_START_OFFSET}`,\n        scrub: true,\n        onUpdate: self => {\n          const progress = self.progress\n\n          // \u6279\u91CF\u66F4\u65B0\u6587\u5B57\u900F\u660E\u5EA6\n          words.forEach((word, i) => {\n            const { start, width } = wordAnimations[i]\n            let opacity = (progress - start) / width\n            opacity = Math.max(0, Math.min(opacity, 1))\n            gsap.set(word, { opacity })\n          })\n\n          // \u66F4\u65B0\u80CC\u666F\u900F\u660E\u5EA6\n          if (bgRef.current) {\n            gsap.set(bgRef.current, { opacity: progress })\n          }\n        },\n      }) as ScrollTriggerInstance\n\n      return () => {\n        splitTextInstance.current?.revert()\n        scrollTriggerRef.current?.kill()\n      }\n    }, [titleAnimation, inView])\n\n    // \u89C6\u9891\u9AD8\u5EA6\u52A8\u753B ScrollTrigger\n    useEffect(() => {\n      if (!inView || !titleRef.current) return\n\n      heightTriggerRef.current = ScrollTrigger.create({\n        trigger: titleRef.current,\n        start: 'bottom bottom',\n        end: 'bottom top',\n        scrub: true,\n        onUpdate: self => {\n          setVideoHeightProgress(self.progress)\n        },\n      }) as ScrollTriggerInstance\n\n      return () => {\n        heightTriggerRef.current?.kill()\n      }\n    }, [inView])\n\n    // \u66DD\u5149\u57CB\u70B9\n    useExposure(trackRef, {\n      componentType,\n      componentName,\n      componentTitle: videoTitle_html,\n    })\n\n    // \u8BA1\u7B97\u89C6\u9891\u5BB9\u5668\u7684 z-index\n    const zIndexVideo = useMemo(() => {\n      if (inView && videoHeightProgress > 0 && videoHeightProgress < ANIMATION_CONFIG.VIDEO_PROGRESS_THRESHOLD) return 3\n      if (inView) return 2\n      return 1\n    }, [videoHeightProgress, inView])\n\n    // \u5904\u7406\u6309\u94AE\u70B9\u51FB\n    const handleBtnClick = useCallback(() => {\n      setVisible(true)\n      onBtnClick?.()\n    }, [onBtnClick])\n\n    const aspect =\n      'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] laptop:aspect-w-[1024] laptop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]'\n\n    // \u975E sticky \u6A21\u5F0F - \u7B80\u5355\u5E03\u5C40\n    if (!sticky) {\n      return (\n        <>\n          <div\n            id={id}\n            className={cn(\n              'relative overflow-hidden',\n              aspect,\n              {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              },\n              className\n            )}\n          >\n            <div ref={inViewRef}>\n              {/* \u5185\u5BB9\u5C42 */}\n              {!titleAnimation && (\n                <div className=\"media-content text-info-primary absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                  {title_html && !isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: title_html }}\n                    />\n                  )}\n                  {videoTitle_html && isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                    />\n                  )}\n                  {btnText && (\n                    <Button variant=\"link\" className={cn('member-equity-button-secondary')} onClick={handleBtnClick}>\n                      {btnText}\n                    </Button>\n                  )}\n                </div>\n              )}\n\n              {/* \u89C6\u9891\u5C42 */}\n              <ScrollLoadVideo\n                videoRef={videoRef}\n                poster={img?.url || ''}\n                src={video?.url!}\n                className=\"tablet:block hidden size-full\"\n                videoClassName=\"object-cover\"\n                muted\n                loop\n                playsInline\n                autoplay\n                webkit-playsinline\n                x5-playsinline\n              />\n              <ScrollLoadVideo\n                videoRef={videoRef}\n                poster={img?.url || ''}\n                src={mobileVideo?.url || video?.url!}\n                className=\"tablet:hidden block size-full\"\n                videoClassName=\"object-cover\"\n                muted\n                loop\n                playsInline\n                autoplay\n                webkit-playsinline\n                x5-playsinline\n              />\n            </div>\n\n            {/* \u57CB\u70B9\u5143\u7D20 */}\n            <div ref={trackRef} className=\"absolute bottom-0 left-0 h-px w-full\" />\n          </div>\n\n          {visible && youtubeId && (\n            <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n          )}\n        </>\n      )\n    }\n\n    // Sticky \u6A21\u5F0F - \u590D\u6742\u5E03\u5C40\n    return (\n      <>\n        <div\n          ref={titleRef}\n          className={cn(\n            'relative z-10',\n            aspect,\n            {\n              'aiui-dark': theme === 'dark',\n              'rounded-box': shape === 'rounded',\n            },\n            className\n          )}\n        >\n          <div ref={inViewRef}>\n            {!titleAnimation && (\n              <div className=\"media-content text-info-primary absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                {title_html && !isPlaying && (\n                  <div\n                    className=\"lg-desktop:text-[64px]  text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                    dangerouslySetInnerHTML={{ __html: title_html }}\n                  />\n                )}\n                {videoTitle_html && isPlaying && (\n                  <div\n                    className=\"lg-desktop:text-[64px]  text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                    dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                  />\n                )}\n                {btnText && (\n                  <Button variant=\"link\" className={cn('member-equity-button-secondary ')} onClick={handleBtnClick}>\n                    {btnText}\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n        </div>\n        <div\n          style={{\n            marginBottom: `-${btb}px`,\n            marginTop: `-${titleHeight}px`,\n            zIndex: zIndexVideo,\n          }}\n          className=\"relative\"\n        >\n          <div className=\"sticky top-0\">\n            <div\n              id={id}\n              className={cn('relative h-screen w-full overflow-hidden', {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              })}\n            >\n              {titleAnimation === 'fade-in' && title_html && (\n                <div\n                  ref={titleFadeInRef}\n                  className=\"lg-desktop:text-[64px]  absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                  dangerouslySetInnerHTML={{ __html: title_html }}\n                />\n              )}\n              <div\n                className=\"media-cover absolute left-0 top-0 size-full\"\n                style={{\n                  height: `${ANIMATION_CONFIG.VIDEO_HEIGHT_BASE - videoHeightProgress * 100}vh`,\n                }}\n              >\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={video?.url!}\n                  className=\"tablet:block hidden size-full\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={mobileVideo?.url || video?.url!}\n                  className=\"tablet:hidden block size-full\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <div\n                  ref={bgRef}\n                  className=\"absolute left-0 top-0 z-10 size-full opacity-0\"\n                  style={{\n                    background: 'rgba(0, 0, 0, 0.2)',\n                  }}\n                />\n              </div>\n            </div>\n          </div>\n          <div className={cn('relative box-content block', aspect)} style={{ height: `${btb}px` }} ref={trackRef} />\n        </div>\n        {visible && youtubeId && (\n          <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n        )}\n      </>\n    )\n  }\n)\n\nMediaPlayerBase.displayName = 'MediaPlayerBase'\n\nexport default withLayout(MediaPlayerBase)\n"],
-  "mappings": "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",
-  "names": ["MediaPlayerBase_exports", "__export", "MediaPlayerBase_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_button", "import_VideoModal", "import_html", "import_react_intersection_observer", "import_useExposure", "import_ScrollLoadVideo", "import_gsap", "import_SplitText", "import_ScrollTrigger", "componentName", "componentType", "ANIMATION_CONFIG", "htmlConverters", "defaultConverters", "args", "node", "MediaPlayerBase", "className", "id", "onBtnClick", "title", "videoTitle", "btnText", "youtubeId", "video", "mobileVideo", "theme", "img", "shape", "titleAnimation", "rest", "ref", "sticky", "isPlaying", "setIsPlaying", "btb", "setbtb", "titleHeight", "setTitleHeight", "videoHeightProgress", "setVideoHeightProgress", "visible", "setVisible", "videoRef", "bgRef", "titleRef", "titleFadeInRef", "trackRef", "splitTextInstance", "scrollTriggerRef", "heightTriggerRef", "inViewRef", "inView", "title_html", "videoTitle_html", "calculateLayout", "rect", "screenHeight", "inViewRefToBottom", "newBtb", "newTitleHeight", "resizeObserver", "handleScroll", "scrollTimeout", "throttledScroll", "titleElement", "height", "words", "total", "interval", "wordAnimations", "_", "i", "start", "width", "self", "progress", "word", "opacity", "zIndexVideo", "handleBtnClick", "aspect", "Button", "ScrollLoadVideo"]
+  "sourcesContent": ["'use client'\nimport { useState, useRef, useMemo, useEffect, forwardRef, useImperativeHandle, useCallback } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Button from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerBaseProps } from './types.js'\nimport { useInView } from 'react-intersection-observer'\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\n\nconst componentName = 'media_player_base'\nconst componentType = 'video'\n\n// \u52A8\u753B\u914D\u7F6E\u5E38\u91CF\nconst ANIMATION_CONFIG = {\n  TEXT_START_OFFSET: '10%',\n  TEXT_ANIMATION_MULTIPLIER: 1.5,\n  TEXT_ANIMATION_OFFSET: 80,\n  VIDEO_HEIGHT_BASE: 102,\n  OVERLAP_FACTOR: 0.5,\n  VIDEO_PROGRESS_THRESHOLD: 0.9,\n  HEIGHT_CHANGE_THRESHOLD: 5, // \u9AD8\u5EA6\u53D8\u5316\u9608\u503C(px)\n} as const\n\nconst PARALLAX_CONFIG = {\n  TRANSLATE_RANGE: 120,\n} as const\n\nconst SMOOTHING_CONFIG = {\n  DAMPING: 0.18,\n  EPSILON: 0.5,\n} as const\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\ninterface ScrollTriggerInstance {\n  progress: number\n  kill: () => void\n}\n\nconst MediaPlayerBase = forwardRef<HTMLDivElement, MediaPlayerBaseProps>(\n  (\n    {\n      className = '',\n      id,\n      onBtnClick,\n      data: { title, videoTitle, btnText, youtubeId, video, mobileVideo, theme, img, shape, titleAnimation, ...rest },\n    },\n    ref\n  ) => {\n    const { sticky } = rest\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [btb, setbtb] = useState(0)\n    const [titleHeight, setTitleHeight] = useState(0)\n    const [videoHeightProgress, setVideoHeightProgress] = useState(0)\n    const [visible, setVisible] = useState<boolean>(false)\n\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const bgRef = useRef<HTMLDivElement>(null)\n    const titleRef = useRef<HTMLDivElement>(null)\n    const titleFadeInRef = useRef<HTMLDivElement>(null)\n    const trackRef = useRef<HTMLDivElement>(null)\n    const splitTextInstance = useRef<SplitText | null>(null)\n    const scrollTriggerRef = useRef<ScrollTriggerInstance | null>(null)\n    const heightTriggerRef = useRef<ScrollTriggerInstance | null>(null)\n    const layoutTargetsRef = useRef({ btb: 0, titleHeight: 0 })\n    const layoutInitializedRef = useRef(false)\n    const { ref: inViewRef, inView } = useInView()\n\n    useImperativeHandle(ref, () => titleRef.current as HTMLDivElement)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    const videoTitle_html =\n      typeof videoTitle === 'string'\n        ? videoTitle\n        : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    // \u89C6\u9891\u64AD\u653E\u63A7\u5236\n    useEffect(() => {\n      if (inView) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      } else {\n        videoRef.current?.pause()\n        setIsPlaying(false)\n      }\n    }, [inView])\n\n    // \u4F18\u5316: \u4F7F\u7528 ResizeObserver \u66FF\u4EE3 debounce + resize \u4E8B\u4EF6\n    useEffect(() => {\n      if (!titleRef.current || !sticky) return\n\n      // \u8BA1\u7B97\u5E03\u5C40\u5C3A\u5BF8\u7684\u6838\u5FC3\u51FD\u6570\n      const calculateLayout = () => {\n        if (!titleRef.current) return\n\n        const rect = titleRef.current.getBoundingClientRect()\n        const screenHeight = window.innerHeight\n        // const scrollTop = window.scrollY || window.pageYOffset\n        // const elementBottomToPageTop = rect.bottom + scrollTop\n        // const pageHeight = document.documentElement.scrollHeight\n        // const distanceToPageBottom = pageHeight - elementBottomToPageTop\n\n        const inViewRefToBottom = screenHeight - rect.bottom\n        const newBtb = inViewRefToBottom > screenHeight ? screenHeight : inViewRefToBottom\n        const newTitleHeight = titleRef.current.clientHeight + screenHeight\n\n        layoutTargetsRef.current.btb = newBtb\n        layoutTargetsRef.current.titleHeight = newTitleHeight\n\n        if (!layoutInitializedRef.current) {\n          layoutInitializedRef.current = true\n          setbtb(newBtb)\n          setTitleHeight(newTitleHeight)\n        }\n      }\n\n      // \u521D\u59CB\u8BA1\u7B97\n      calculateLayout()\n\n      // ResizeObserver \u76D1\u542C\u5C3A\u5BF8\u53D8\u5316\n      const resizeObserver = new ResizeObserver(() => {\n        // \u4F7F\u7528 requestAnimationFrame \u6279\u91CF\u66F4\u65B0\n        requestAnimationFrame(() => {\n          calculateLayout()\n        })\n      })\n\n      resizeObserver.observe(titleRef.current)\n\n      // \u76D1\u542C\u7A97\u53E3\u6EDA\u52A8(\u7528\u4E8E\u8BA1\u7B97 btb)\n      let scrollFrame: number | null = null\n      const handleScroll = () => {\n        if (scrollFrame !== null) return\n        scrollFrame = requestAnimationFrame(() => {\n          calculateLayout()\n          scrollFrame = null\n        })\n      }\n\n      window.addEventListener('scroll', handleScroll, { passive: true })\n\n      return () => {\n        resizeObserver.disconnect()\n        window.removeEventListener('scroll', handleScroll)\n        if (scrollFrame !== null) {\n          cancelAnimationFrame(scrollFrame)\n        }\n        layoutInitializedRef.current = false\n      }\n    }, [sticky])\n\n    useEffect(() => {\n      if (!sticky) return\n\n      let rafId: number\n      const smoothAnimate = () => {\n        setbtb(prev => {\n          const target = layoutTargetsRef.current.btb\n          const delta = target - prev\n          if (Math.abs(delta) <= SMOOTHING_CONFIG.EPSILON) return target\n          return prev + delta * SMOOTHING_CONFIG.DAMPING\n        })\n\n        setTitleHeight(prev => {\n          const target = layoutTargetsRef.current.titleHeight\n          const delta = target - prev\n          if (Math.abs(delta) <= SMOOTHING_CONFIG.EPSILON) return target\n          return prev + delta * SMOOTHING_CONFIG.DAMPING\n        })\n\n        rafId = requestAnimationFrame(smoothAnimate)\n      }\n\n      rafId = requestAnimationFrame(smoothAnimate)\n\n      return () => {\n        cancelAnimationFrame(rafId)\n      }\n    }, [sticky])\n\n    // \u4F18\u5316: GSAP \u52A8\u753B\u8BBE\u7F6E\n    useEffect(() => {\n      if (!inView || !titleAnimation || titleAnimation !== 'fade-in' || !titleFadeInRef.current) return\n\n      const titleElement = titleFadeInRef.current\n      const height = titleElement.clientHeight || 80\n\n      // \u5206\u8BCD\n      splitTextInstance.current = new SplitText(titleElement, {\n        type: 'words',\n        wordsClass: 'word',\n      })\n\n      const words = splitTextInstance.current.words\n      const total = words.length\n      const interval = 1 / total\n\n      // \u9884\u8BA1\u7B97\u6BCF\u4E2A\u5355\u8BCD\u7684\u52A8\u753B\u53C2\u6570 - \u907F\u514D\u6BCF\u5E27\u91CD\u590D\u8BA1\u7B97\n      const wordAnimations = words.map((_, i) => {\n        const start = (i / total) * (1 - ANIMATION_CONFIG.OVERLAP_FACTOR)\n        const width = interval * (1 + ANIMATION_CONFIG.OVERLAP_FACTOR)\n        return { start, width }\n      })\n\n      // \u521D\u59CB\u5316\u900F\u660E\u5EA6\n      gsap.set(words, { opacity: 0 })\n\n      // \u521B\u5EFA\u6587\u5B57\u6DE1\u5165 ScrollTrigger\n      scrollTriggerRef.current = ScrollTrigger.create({\n        trigger: titleRef.current,\n        start: `top center-=${ANIMATION_CONFIG.TEXT_START_OFFSET}`,\n        end: `top+=${height * ANIMATION_CONFIG.TEXT_ANIMATION_MULTIPLIER + ANIMATION_CONFIG.TEXT_ANIMATION_OFFSET}px center-=${ANIMATION_CONFIG.TEXT_START_OFFSET}`,\n        scrub: true,\n        onUpdate: self => {\n          const progress = self.progress\n\n          // \u6279\u91CF\u66F4\u65B0\u6587\u5B57\u900F\u660E\u5EA6\n          words.forEach((word, i) => {\n            const { start, width } = wordAnimations[i]\n            let opacity = (progress - start) / width\n            opacity = Math.max(0, Math.min(opacity, 1))\n            gsap.set(word, { opacity })\n          })\n\n          // \u66F4\u65B0\u80CC\u666F\u900F\u660E\u5EA6\n          if (bgRef.current) {\n            gsap.set(bgRef.current, { opacity: progress })\n          }\n        },\n      }) as ScrollTriggerInstance\n\n      return () => {\n        splitTextInstance.current?.revert()\n        scrollTriggerRef.current?.kill()\n      }\n    }, [titleAnimation, inView])\n\n    // \u89C6\u9891\u9AD8\u5EA6\u52A8\u753B ScrollTrigger\n    useEffect(() => {\n      if (!inView || !titleRef.current) return\n\n      heightTriggerRef.current = ScrollTrigger.create({\n        trigger: titleRef.current,\n        start: 'bottom bottom',\n        end: 'bottom top',\n        scrub: true,\n        onUpdate: self => {\n          setVideoHeightProgress(self.progress)\n        },\n      }) as ScrollTriggerInstance\n\n      return () => {\n        heightTriggerRef.current?.kill()\n      }\n    }, [inView])\n\n    // \u66DD\u5149\u57CB\u70B9\n    useExposure(trackRef, {\n      componentType,\n      componentName,\n      componentTitle: videoTitle_html,\n    })\n\n    // \u8BA1\u7B97\u89C6\u9891\u5BB9\u5668\u7684 z-index\n    const zIndexVideo = useMemo(() => {\n      if (inView && videoHeightProgress > 0 && videoHeightProgress < ANIMATION_CONFIG.VIDEO_PROGRESS_THRESHOLD) return 3\n      if (inView) return 2\n      return 1\n    }, [videoHeightProgress, inView])\n\n    const videoParallaxOffset = useMemo(() => {\n      if (!sticky) return 0\n      return (videoHeightProgress - 0.5) * PARALLAX_CONFIG.TRANSLATE_RANGE\n    }, [videoHeightProgress, sticky])\n\n    // \u5904\u7406\u6309\u94AE\u70B9\u51FB\n    const handleBtnClick = useCallback(() => {\n      setVisible(true)\n      onBtnClick?.()\n    }, [onBtnClick])\n\n    const aspect =\n      'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] laptop:aspect-w-[1024] laptop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]'\n\n    // \u975E sticky \u6A21\u5F0F - \u7B80\u5355\u5E03\u5C40\n    if (!sticky) {\n      return (\n        <>\n          <div\n            id={id}\n            className={cn(\n              'relative overflow-hidden',\n              aspect,\n              {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              },\n              className\n            )}\n          >\n            <div ref={inViewRef}>\n              {/* \u5185\u5BB9\u5C42 */}\n              {!titleAnimation && (\n                <div className=\"media-content text-info-primary absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                  {title_html && !isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: title_html }}\n                    />\n                  )}\n                  {videoTitle_html && isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                    />\n                  )}\n                  {btnText && (\n                    <Button variant=\"link\" className={cn('member-equity-button-secondary')} onClick={handleBtnClick}>\n                      {btnText}\n                    </Button>\n                  )}\n                </div>\n              )}\n\n              {/* \u89C6\u9891\u5C42 */}\n              <ScrollLoadVideo\n                videoRef={videoRef}\n                poster={img?.url || ''}\n                src={video?.url!}\n                className=\"tablet:block hidden size-full\"\n                videoClassName=\"object-cover\"\n                muted\n                loop\n                playsInline\n                autoplay\n                webkit-playsinline\n                x5-playsinline\n              />\n              <ScrollLoadVideo\n                videoRef={videoRef}\n                poster={img?.url || ''}\n                src={mobileVideo?.url || video?.url!}\n                className=\"tablet:hidden block size-full\"\n                videoClassName=\"object-cover\"\n                muted\n                loop\n                playsInline\n                autoplay\n                webkit-playsinline\n                x5-playsinline\n              />\n            </div>\n\n            {/* \u57CB\u70B9\u5143\u7D20 */}\n            <div ref={trackRef} className=\"absolute bottom-0 left-0 h-px w-full\" />\n          </div>\n\n          {visible && youtubeId && (\n            <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n          )}\n        </>\n      )\n    }\n\n    // Sticky \u6A21\u5F0F - \u590D\u6742\u5E03\u5C40\n    return (\n      <>\n        <div\n          ref={titleRef}\n          className={cn(\n            'relative z-10',\n            aspect,\n            {\n              'aiui-dark': theme === 'dark',\n              'rounded-box': shape === 'rounded',\n            },\n            className\n          )}\n        >\n          <div ref={inViewRef}>\n            {!titleAnimation && (\n              <div className=\"media-content text-info-primary absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                {title_html && !isPlaying && (\n                  <div\n                    className=\"lg-desktop:text-[64px]  text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                    dangerouslySetInnerHTML={{ __html: title_html }}\n                  />\n                )}\n                {videoTitle_html && isPlaying && (\n                  <div\n                    className=\"lg-desktop:text-[64px]  text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                    dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                  />\n                )}\n                {btnText && (\n                  <Button variant=\"link\" className={cn('member-equity-button-secondary ')} onClick={handleBtnClick}>\n                    {btnText}\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n        </div>\n        <div\n          style={{\n            marginBottom: `-${btb}px`,\n            marginTop: `-${titleHeight}px`,\n            zIndex: zIndexVideo,\n          }}\n          className=\"relative\"\n        >\n          <div className=\"sticky top-0\">\n            <div\n              id={id}\n              className={cn('relative h-screen w-full overflow-hidden', {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              })}\n            >\n              {titleAnimation === 'fade-in' && title_html && (\n                <div\n                  ref={titleFadeInRef}\n                  className=\"lg-desktop:text-[64px]  absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                  dangerouslySetInnerHTML={{ __html: title_html }}\n                />\n              )}\n              <div\n                className=\"media-cover absolute left-0 top-0 size-full\"\n                style={{\n                  transform: `translateY(${videoParallaxOffset}px)`,\n                  willChange: 'transform',\n                }}\n              >\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={video?.url!}\n                  className=\"tablet:block hidden size-full\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={mobileVideo?.url || video?.url!}\n                  className=\"tablet:hidden block size-full\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <div\n                  ref={bgRef}\n                  className=\"absolute left-0 top-0 z-10 size-full opacity-0\"\n                  style={{\n                    background: 'rgba(0, 0, 0, 0.2)',\n                  }}\n                />\n              </div>\n            </div>\n          </div>\n          <div className={cn('relative box-content block', aspect)} style={{ height: `${btb}px` }} ref={trackRef} />\n        </div>\n        {visible && youtubeId && (\n          <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n        )}\n      </>\n    )\n  }\n)\n\nMediaPlayerBase.displayName = 'MediaPlayerBase'\n\nexport default withLayout(MediaPlayerBase)\n"],
+  "mappings": "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",
+  "names": ["MediaPlayerBase_exports", "__export", "MediaPlayerBase_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_button", "import_VideoModal", "import_html", "import_react_intersection_observer", "import_useExposure", "import_ScrollLoadVideo", "import_gsap", "import_SplitText", "import_ScrollTrigger", "componentName", "componentType", "ANIMATION_CONFIG", "PARALLAX_CONFIG", "SMOOTHING_CONFIG", "htmlConverters", "defaultConverters", "args", "node", "MediaPlayerBase", "className", "id", "onBtnClick", "title", "videoTitle", "btnText", "youtubeId", "video", "mobileVideo", "theme", "img", "shape", "titleAnimation", "rest", "ref", "sticky", "isPlaying", "setIsPlaying", "btb", "setbtb", "titleHeight", "setTitleHeight", "videoHeightProgress", "setVideoHeightProgress", "visible", "setVisible", "videoRef", "bgRef", "titleRef", "titleFadeInRef", "trackRef", "splitTextInstance", "scrollTriggerRef", "heightTriggerRef", "layoutTargetsRef", "layoutInitializedRef", "inViewRef", "inView", "title_html", "videoTitle_html", "calculateLayout", "rect", "screenHeight", "inViewRefToBottom", "newBtb", "newTitleHeight", "resizeObserver", "scrollFrame", "handleScroll", "rafId", "smoothAnimate", "prev", "target", "delta", "titleElement", "height", "words", "total", "interval", "wordAnimations", "i", "start", "width", "self", "progress", "word", "opacity", "zIndexVideo", "videoParallaxOffset", "handleBtnClick", "aspect", "Button", "ScrollLoadVideo"]
 }

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

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

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerBase/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { useState, useRef, useMemo, useEffect, forwardRef, useImperativeHandle, useCallback } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Button from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerBaseProps } from './types.js'\nimport { useInView } from 'react-intersection-observer'\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\n\nconst componentName = 'media_player_base'\nconst componentType = 'video'\n\n// \u52A8\u753B\u914D\u7F6E\u5E38\u91CF\nconst ANIMATION_CONFIG = {\n  TEXT_START_OFFSET: '10%',\n  TEXT_ANIMATION_MULTIPLIER: 1.5,\n  TEXT_ANIMATION_OFFSET: 80,\n  VIDEO_HEIGHT_BASE: 102,\n  OVERLAP_FACTOR: 0.5,\n  VIDEO_PROGRESS_THRESHOLD: 0.9,\n  HEIGHT_CHANGE_THRESHOLD: 5, // \u9AD8\u5EA6\u53D8\u5316\u9608\u503C(px)\n} as const\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\ninterface ScrollTriggerInstance {\n  progress: number\n  kill: () => void\n}\n\nconst MediaPlayerBase = forwardRef<HTMLDivElement, MediaPlayerBaseProps>(\n  (\n    {\n      className = '',\n      id,\n      onBtnClick,\n      data: { title, videoTitle, btnText, youtubeId, video, mobileVideo, theme, img, shape, titleAnimation, ...rest },\n    },\n    ref\n  ) => {\n    const { sticky } = rest\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [btb, setbtb] = useState(0)\n    const [titleHeight, setTitleHeight] = useState(0)\n    const [videoHeightProgress, setVideoHeightProgress] = useState(0)\n    const [visible, setVisible] = useState<boolean>(false)\n\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const bgRef = useRef<HTMLDivElement>(null)\n    const titleRef = useRef<HTMLDivElement>(null)\n    const titleFadeInRef = useRef<HTMLDivElement>(null)\n    const trackRef = useRef<HTMLDivElement>(null)\n    const splitTextInstance = useRef<SplitText | null>(null)\n    const scrollTriggerRef = useRef<ScrollTriggerInstance | null>(null)\n    const heightTriggerRef = useRef<ScrollTriggerInstance | null>(null)\n    const { ref: inViewRef, inView } = useInView()\n\n    useImperativeHandle(ref, () => titleRef.current as HTMLDivElement)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    const videoTitle_html =\n      typeof videoTitle === 'string'\n        ? videoTitle\n        : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    // \u89C6\u9891\u64AD\u653E\u63A7\u5236\n    useEffect(() => {\n      if (inView) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      } else {\n        videoRef.current?.pause()\n        setIsPlaying(false)\n      }\n    }, [inView])\n\n    // \u4F18\u5316: \u4F7F\u7528 ResizeObserver \u66FF\u4EE3 debounce + resize \u4E8B\u4EF6\n    useEffect(() => {\n      if (!titleRef.current || !sticky) return\n\n      // \u8BA1\u7B97\u5E03\u5C40\u5C3A\u5BF8\u7684\u6838\u5FC3\u51FD\u6570\n      const calculateLayout = () => {\n        if (!titleRef.current) return\n\n        const rect = titleRef.current.getBoundingClientRect()\n        const screenHeight = window.innerHeight\n        // const scrollTop = window.scrollY || window.pageYOffset\n        // const elementBottomToPageTop = rect.bottom + scrollTop\n        // const pageHeight = document.documentElement.scrollHeight\n        // const distanceToPageBottom = pageHeight - elementBottomToPageTop\n\n        const inViewRefToBottom = screenHeight - rect.bottom\n        const newBtb = inViewRefToBottom > screenHeight ? screenHeight : inViewRefToBottom\n        const newTitleHeight = titleRef.current.clientHeight + screenHeight\n\n        // \u4F7F\u7528\u9608\u503C\u68C0\u6D4B,\u907F\u514D\u9891\u7E41\u66F4\u65B0\n        // setbtb(prevBtb => {\n        //   return Math.abs(newBtb - prevBtb) > ANIMATION_CONFIG.HEIGHT_CHANGE_THRESHOLD ? newBtb : prevBtb\n        // })\n        setbtb(newBtb)\n\n        setTitleHeight(newTitleHeight)\n      }\n\n      // \u521D\u59CB\u8BA1\u7B97\n      calculateLayout()\n\n      // ResizeObserver \u76D1\u542C\u5C3A\u5BF8\u53D8\u5316\n      const resizeObserver = new ResizeObserver(() => {\n        // \u4F7F\u7528 requestAnimationFrame \u6279\u91CF\u66F4\u65B0\n        requestAnimationFrame(() => {\n          calculateLayout()\n        })\n      })\n\n      resizeObserver.observe(titleRef.current)\n\n      // \u76D1\u542C\u7A97\u53E3\u6EDA\u52A8(\u7528\u4E8E\u8BA1\u7B97 btb)\n      const handleScroll = () => {\n        requestAnimationFrame(() => {\n          calculateLayout()\n        })\n      }\n\n      // \u4F7F\u7528\u8282\u6D41\u7684\u6EDA\u52A8\u76D1\u542C\n      let scrollTimeout: NodeJS.Timeout\n      const throttledScroll = () => {\n        if (!scrollTimeout) {\n          scrollTimeout = setTimeout(() => {\n            handleScroll()\n            scrollTimeout = null as any\n          }, 100)\n        }\n      }\n\n      window.addEventListener('scroll', throttledScroll, { passive: true })\n\n      return () => {\n        resizeObserver.disconnect()\n        window.removeEventListener('scroll', throttledScroll)\n        if (scrollTimeout) clearTimeout(scrollTimeout)\n      }\n    }, [sticky])\n\n    // \u4F18\u5316: GSAP \u52A8\u753B\u8BBE\u7F6E\n    useEffect(() => {\n      if (!inView || !titleAnimation || titleAnimation !== 'fade-in' || !titleFadeInRef.current) return\n\n      const titleElement = titleFadeInRef.current\n      const height = titleElement.clientHeight || 80\n\n      // \u5206\u8BCD\n      splitTextInstance.current = new SplitText(titleElement, {\n        type: 'words',\n        wordsClass: 'word',\n      })\n\n      const words = splitTextInstance.current.words\n      const total = words.length\n      const interval = 1 / total\n\n      // \u9884\u8BA1\u7B97\u6BCF\u4E2A\u5355\u8BCD\u7684\u52A8\u753B\u53C2\u6570 - \u907F\u514D\u6BCF\u5E27\u91CD\u590D\u8BA1\u7B97\n      const wordAnimations = words.map((_, i) => {\n        const start = (i / total) * (1 - ANIMATION_CONFIG.OVERLAP_FACTOR)\n        const width = interval * (1 + ANIMATION_CONFIG.OVERLAP_FACTOR)\n        return { start, width }\n      })\n\n      // \u521D\u59CB\u5316\u900F\u660E\u5EA6\n      gsap.set(words, { opacity: 0 })\n\n      // \u521B\u5EFA\u6587\u5B57\u6DE1\u5165 ScrollTrigger\n      scrollTriggerRef.current = ScrollTrigger.create({\n        trigger: titleRef.current,\n        start: `top center-=${ANIMATION_CONFIG.TEXT_START_OFFSET}`,\n        end: `top+=${height * ANIMATION_CONFIG.TEXT_ANIMATION_MULTIPLIER + ANIMATION_CONFIG.TEXT_ANIMATION_OFFSET}px center-=${ANIMATION_CONFIG.TEXT_START_OFFSET}`,\n        scrub: true,\n        onUpdate: self => {\n          const progress = self.progress\n\n          // \u6279\u91CF\u66F4\u65B0\u6587\u5B57\u900F\u660E\u5EA6\n          words.forEach((word, i) => {\n            const { start, width } = wordAnimations[i]\n            let opacity = (progress - start) / width\n            opacity = Math.max(0, Math.min(opacity, 1))\n            gsap.set(word, { opacity })\n          })\n\n          // \u66F4\u65B0\u80CC\u666F\u900F\u660E\u5EA6\n          if (bgRef.current) {\n            gsap.set(bgRef.current, { opacity: progress })\n          }\n        },\n      }) as ScrollTriggerInstance\n\n      return () => {\n        splitTextInstance.current?.revert()\n        scrollTriggerRef.current?.kill()\n      }\n    }, [titleAnimation, inView])\n\n    // \u89C6\u9891\u9AD8\u5EA6\u52A8\u753B ScrollTrigger\n    useEffect(() => {\n      if (!inView || !titleRef.current) return\n\n      heightTriggerRef.current = ScrollTrigger.create({\n        trigger: titleRef.current,\n        start: 'bottom bottom',\n        end: 'bottom top',\n        scrub: true,\n        onUpdate: self => {\n          setVideoHeightProgress(self.progress)\n        },\n      }) as ScrollTriggerInstance\n\n      return () => {\n        heightTriggerRef.current?.kill()\n      }\n    }, [inView])\n\n    // \u66DD\u5149\u57CB\u70B9\n    useExposure(trackRef, {\n      componentType,\n      componentName,\n      componentTitle: videoTitle_html,\n    })\n\n    // \u8BA1\u7B97\u89C6\u9891\u5BB9\u5668\u7684 z-index\n    const zIndexVideo = useMemo(() => {\n      if (inView && videoHeightProgress > 0 && videoHeightProgress < ANIMATION_CONFIG.VIDEO_PROGRESS_THRESHOLD) return 3\n      if (inView) return 2\n      return 1\n    }, [videoHeightProgress, inView])\n\n    // \u5904\u7406\u6309\u94AE\u70B9\u51FB\n    const handleBtnClick = useCallback(() => {\n      setVisible(true)\n      onBtnClick?.()\n    }, [onBtnClick])\n\n    const aspect =\n      'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] laptop:aspect-w-[1024] laptop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]'\n\n    // \u975E sticky \u6A21\u5F0F - \u7B80\u5355\u5E03\u5C40\n    if (!sticky) {\n      return (\n        <>\n          <div\n            id={id}\n            className={cn(\n              'relative overflow-hidden',\n              aspect,\n              {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              },\n              className\n            )}\n          >\n            <div ref={inViewRef}>\n              {/* \u5185\u5BB9\u5C42 */}\n              {!titleAnimation && (\n                <div className=\"media-content text-info-primary absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                  {title_html && !isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: title_html }}\n                    />\n                  )}\n                  {videoTitle_html && isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                    />\n                  )}\n                  {btnText && (\n                    <Button variant=\"link\" className={cn('member-equity-button-secondary')} onClick={handleBtnClick}>\n                      {btnText}\n                    </Button>\n                  )}\n                </div>\n              )}\n\n              {/* \u89C6\u9891\u5C42 */}\n              <ScrollLoadVideo\n                videoRef={videoRef}\n                poster={img?.url || ''}\n                src={video?.url!}\n                className=\"tablet:block hidden size-full\"\n                videoClassName=\"object-cover\"\n                muted\n                loop\n                playsInline\n                autoplay\n                webkit-playsinline\n                x5-playsinline\n              />\n              <ScrollLoadVideo\n                videoRef={videoRef}\n                poster={img?.url || ''}\n                src={mobileVideo?.url || video?.url!}\n                className=\"tablet:hidden block size-full\"\n                videoClassName=\"object-cover\"\n                muted\n                loop\n                playsInline\n                autoplay\n                webkit-playsinline\n                x5-playsinline\n              />\n            </div>\n\n            {/* \u57CB\u70B9\u5143\u7D20 */}\n            <div ref={trackRef} className=\"absolute bottom-0 left-0 h-px w-full\" />\n          </div>\n\n          {visible && youtubeId && (\n            <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n          )}\n        </>\n      )\n    }\n\n    // Sticky \u6A21\u5F0F - \u590D\u6742\u5E03\u5C40\n    return (\n      <>\n        <div\n          ref={titleRef}\n          className={cn(\n            'relative z-10',\n            aspect,\n            {\n              'aiui-dark': theme === 'dark',\n              'rounded-box': shape === 'rounded',\n            },\n            className\n          )}\n        >\n          <div ref={inViewRef}>\n            {!titleAnimation && (\n              <div className=\"media-content text-info-primary absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                {title_html && !isPlaying && (\n                  <div\n                    className=\"lg-desktop:text-[64px]  text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                    dangerouslySetInnerHTML={{ __html: title_html }}\n                  />\n                )}\n                {videoTitle_html && isPlaying && (\n                  <div\n                    className=\"lg-desktop:text-[64px]  text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                    dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                  />\n                )}\n                {btnText && (\n                  <Button variant=\"link\" className={cn('member-equity-button-secondary ')} onClick={handleBtnClick}>\n                    {btnText}\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n        </div>\n        <div\n          style={{\n            marginBottom: `-${btb}px`,\n            marginTop: `-${titleHeight}px`,\n            zIndex: zIndexVideo,\n          }}\n          className=\"relative\"\n        >\n          <div className=\"sticky top-0\">\n            <div\n              id={id}\n              className={cn('relative h-screen w-full overflow-hidden', {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              })}\n            >\n              {titleAnimation === 'fade-in' && title_html && (\n                <div\n                  ref={titleFadeInRef}\n                  className=\"lg-desktop:text-[64px]  absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                  dangerouslySetInnerHTML={{ __html: title_html }}\n                />\n              )}\n              <div\n                className=\"media-cover absolute left-0 top-0 size-full\"\n                style={{\n                  height: `${ANIMATION_CONFIG.VIDEO_HEIGHT_BASE - videoHeightProgress * 100}vh`,\n                }}\n              >\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={video?.url!}\n                  className=\"tablet:block hidden size-full\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={mobileVideo?.url || video?.url!}\n                  className=\"tablet:hidden block size-full\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <div\n                  ref={bgRef}\n                  className=\"absolute left-0 top-0 z-10 size-full opacity-0\"\n                  style={{\n                    background: 'rgba(0, 0, 0, 0.2)',\n                  }}\n                />\n              </div>\n            </div>\n          </div>\n          <div className={cn('relative box-content block', aspect)} style={{ height: `${btb}px` }} ref={trackRef} />\n        </div>\n        {visible && youtubeId && (\n          <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n        )}\n      </>\n    )\n  }\n)\n\nMediaPlayerBase.displayName = 'MediaPlayerBase'\n\nexport default withLayout(MediaPlayerBase)\n"],
-  "mappings": "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",
-  "names": ["Fragment", "jsx", "jsxs", "useState", "useRef", "useMemo", "useEffect", "forwardRef", "useImperativeHandle", "useCallback", "cn", "withLayout", "Button", "VideoModal", "convertLexicalToHTML", "useInView", "useExposure", "ScrollLoadVideo", "gsap", "SplitText", "ScrollTrigger", "componentName", "componentType", "ANIMATION_CONFIG", "htmlConverters", "defaultConverters", "args", "node", "MediaPlayerBase", "className", "id", "onBtnClick", "title", "videoTitle", "btnText", "youtubeId", "video", "mobileVideo", "theme", "img", "shape", "titleAnimation", "rest", "ref", "sticky", "isPlaying", "setIsPlaying", "btb", "setbtb", "titleHeight", "setTitleHeight", "videoHeightProgress", "setVideoHeightProgress", "visible", "setVisible", "videoRef", "bgRef", "titleRef", "titleFadeInRef", "trackRef", "splitTextInstance", "scrollTriggerRef", "heightTriggerRef", "inViewRef", "inView", "title_html", "videoTitle_html", "calculateLayout", "rect", "screenHeight", "inViewRefToBottom", "newBtb", "newTitleHeight", "resizeObserver", "handleScroll", "scrollTimeout", "throttledScroll", "titleElement", "height", "words", "total", "interval", "wordAnimations", "_", "i", "start", "width", "self", "progress", "word", "opacity", "zIndexVideo", "handleBtnClick", "aspect", "MediaPlayerBase_default"]
+  "sourcesContent": ["'use client'\nimport { useState, useRef, useMemo, useEffect, forwardRef, useImperativeHandle, useCallback } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Button from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerBaseProps } from './types.js'\nimport { useInView } from 'react-intersection-observer'\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\n\nconst componentName = 'media_player_base'\nconst componentType = 'video'\n\n// \u52A8\u753B\u914D\u7F6E\u5E38\u91CF\nconst ANIMATION_CONFIG = {\n  TEXT_START_OFFSET: '10%',\n  TEXT_ANIMATION_MULTIPLIER: 1.5,\n  TEXT_ANIMATION_OFFSET: 80,\n  VIDEO_HEIGHT_BASE: 102,\n  OVERLAP_FACTOR: 0.5,\n  VIDEO_PROGRESS_THRESHOLD: 0.9,\n  HEIGHT_CHANGE_THRESHOLD: 5, // \u9AD8\u5EA6\u53D8\u5316\u9608\u503C(px)\n} as const\n\nconst PARALLAX_CONFIG = {\n  TRANSLATE_RANGE: 120,\n} as const\n\nconst SMOOTHING_CONFIG = {\n  DAMPING: 0.18,\n  EPSILON: 0.5,\n} as const\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\ninterface ScrollTriggerInstance {\n  progress: number\n  kill: () => void\n}\n\nconst MediaPlayerBase = forwardRef<HTMLDivElement, MediaPlayerBaseProps>(\n  (\n    {\n      className = '',\n      id,\n      onBtnClick,\n      data: { title, videoTitle, btnText, youtubeId, video, mobileVideo, theme, img, shape, titleAnimation, ...rest },\n    },\n    ref\n  ) => {\n    const { sticky } = rest\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [btb, setbtb] = useState(0)\n    const [titleHeight, setTitleHeight] = useState(0)\n    const [videoHeightProgress, setVideoHeightProgress] = useState(0)\n    const [visible, setVisible] = useState<boolean>(false)\n\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const bgRef = useRef<HTMLDivElement>(null)\n    const titleRef = useRef<HTMLDivElement>(null)\n    const titleFadeInRef = useRef<HTMLDivElement>(null)\n    const trackRef = useRef<HTMLDivElement>(null)\n    const splitTextInstance = useRef<SplitText | null>(null)\n    const scrollTriggerRef = useRef<ScrollTriggerInstance | null>(null)\n    const heightTriggerRef = useRef<ScrollTriggerInstance | null>(null)\n    const layoutTargetsRef = useRef({ btb: 0, titleHeight: 0 })\n    const layoutInitializedRef = useRef(false)\n    const { ref: inViewRef, inView } = useInView()\n\n    useImperativeHandle(ref, () => titleRef.current as HTMLDivElement)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    const videoTitle_html =\n      typeof videoTitle === 'string'\n        ? videoTitle\n        : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    // \u89C6\u9891\u64AD\u653E\u63A7\u5236\n    useEffect(() => {\n      if (inView) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      } else {\n        videoRef.current?.pause()\n        setIsPlaying(false)\n      }\n    }, [inView])\n\n    // \u4F18\u5316: \u4F7F\u7528 ResizeObserver \u66FF\u4EE3 debounce + resize \u4E8B\u4EF6\n    useEffect(() => {\n      if (!titleRef.current || !sticky) return\n\n      // \u8BA1\u7B97\u5E03\u5C40\u5C3A\u5BF8\u7684\u6838\u5FC3\u51FD\u6570\n      const calculateLayout = () => {\n        if (!titleRef.current) return\n\n        const rect = titleRef.current.getBoundingClientRect()\n        const screenHeight = window.innerHeight\n        // const scrollTop = window.scrollY || window.pageYOffset\n        // const elementBottomToPageTop = rect.bottom + scrollTop\n        // const pageHeight = document.documentElement.scrollHeight\n        // const distanceToPageBottom = pageHeight - elementBottomToPageTop\n\n        const inViewRefToBottom = screenHeight - rect.bottom\n        const newBtb = inViewRefToBottom > screenHeight ? screenHeight : inViewRefToBottom\n        const newTitleHeight = titleRef.current.clientHeight + screenHeight\n\n        layoutTargetsRef.current.btb = newBtb\n        layoutTargetsRef.current.titleHeight = newTitleHeight\n\n        if (!layoutInitializedRef.current) {\n          layoutInitializedRef.current = true\n          setbtb(newBtb)\n          setTitleHeight(newTitleHeight)\n        }\n      }\n\n      // \u521D\u59CB\u8BA1\u7B97\n      calculateLayout()\n\n      // ResizeObserver \u76D1\u542C\u5C3A\u5BF8\u53D8\u5316\n      const resizeObserver = new ResizeObserver(() => {\n        // \u4F7F\u7528 requestAnimationFrame \u6279\u91CF\u66F4\u65B0\n        requestAnimationFrame(() => {\n          calculateLayout()\n        })\n      })\n\n      resizeObserver.observe(titleRef.current)\n\n      // \u76D1\u542C\u7A97\u53E3\u6EDA\u52A8(\u7528\u4E8E\u8BA1\u7B97 btb)\n      let scrollFrame: number | null = null\n      const handleScroll = () => {\n        if (scrollFrame !== null) return\n        scrollFrame = requestAnimationFrame(() => {\n          calculateLayout()\n          scrollFrame = null\n        })\n      }\n\n      window.addEventListener('scroll', handleScroll, { passive: true })\n\n      return () => {\n        resizeObserver.disconnect()\n        window.removeEventListener('scroll', handleScroll)\n        if (scrollFrame !== null) {\n          cancelAnimationFrame(scrollFrame)\n        }\n        layoutInitializedRef.current = false\n      }\n    }, [sticky])\n\n    useEffect(() => {\n      if (!sticky) return\n\n      let rafId: number\n      const smoothAnimate = () => {\n        setbtb(prev => {\n          const target = layoutTargetsRef.current.btb\n          const delta = target - prev\n          if (Math.abs(delta) <= SMOOTHING_CONFIG.EPSILON) return target\n          return prev + delta * SMOOTHING_CONFIG.DAMPING\n        })\n\n        setTitleHeight(prev => {\n          const target = layoutTargetsRef.current.titleHeight\n          const delta = target - prev\n          if (Math.abs(delta) <= SMOOTHING_CONFIG.EPSILON) return target\n          return prev + delta * SMOOTHING_CONFIG.DAMPING\n        })\n\n        rafId = requestAnimationFrame(smoothAnimate)\n      }\n\n      rafId = requestAnimationFrame(smoothAnimate)\n\n      return () => {\n        cancelAnimationFrame(rafId)\n      }\n    }, [sticky])\n\n    // \u4F18\u5316: GSAP \u52A8\u753B\u8BBE\u7F6E\n    useEffect(() => {\n      if (!inView || !titleAnimation || titleAnimation !== 'fade-in' || !titleFadeInRef.current) return\n\n      const titleElement = titleFadeInRef.current\n      const height = titleElement.clientHeight || 80\n\n      // \u5206\u8BCD\n      splitTextInstance.current = new SplitText(titleElement, {\n        type: 'words',\n        wordsClass: 'word',\n      })\n\n      const words = splitTextInstance.current.words\n      const total = words.length\n      const interval = 1 / total\n\n      // \u9884\u8BA1\u7B97\u6BCF\u4E2A\u5355\u8BCD\u7684\u52A8\u753B\u53C2\u6570 - \u907F\u514D\u6BCF\u5E27\u91CD\u590D\u8BA1\u7B97\n      const wordAnimations = words.map((_, i) => {\n        const start = (i / total) * (1 - ANIMATION_CONFIG.OVERLAP_FACTOR)\n        const width = interval * (1 + ANIMATION_CONFIG.OVERLAP_FACTOR)\n        return { start, width }\n      })\n\n      // \u521D\u59CB\u5316\u900F\u660E\u5EA6\n      gsap.set(words, { opacity: 0 })\n\n      // \u521B\u5EFA\u6587\u5B57\u6DE1\u5165 ScrollTrigger\n      scrollTriggerRef.current = ScrollTrigger.create({\n        trigger: titleRef.current,\n        start: `top center-=${ANIMATION_CONFIG.TEXT_START_OFFSET}`,\n        end: `top+=${height * ANIMATION_CONFIG.TEXT_ANIMATION_MULTIPLIER + ANIMATION_CONFIG.TEXT_ANIMATION_OFFSET}px center-=${ANIMATION_CONFIG.TEXT_START_OFFSET}`,\n        scrub: true,\n        onUpdate: self => {\n          const progress = self.progress\n\n          // \u6279\u91CF\u66F4\u65B0\u6587\u5B57\u900F\u660E\u5EA6\n          words.forEach((word, i) => {\n            const { start, width } = wordAnimations[i]\n            let opacity = (progress - start) / width\n            opacity = Math.max(0, Math.min(opacity, 1))\n            gsap.set(word, { opacity })\n          })\n\n          // \u66F4\u65B0\u80CC\u666F\u900F\u660E\u5EA6\n          if (bgRef.current) {\n            gsap.set(bgRef.current, { opacity: progress })\n          }\n        },\n      }) as ScrollTriggerInstance\n\n      return () => {\n        splitTextInstance.current?.revert()\n        scrollTriggerRef.current?.kill()\n      }\n    }, [titleAnimation, inView])\n\n    // \u89C6\u9891\u9AD8\u5EA6\u52A8\u753B ScrollTrigger\n    useEffect(() => {\n      if (!inView || !titleRef.current) return\n\n      heightTriggerRef.current = ScrollTrigger.create({\n        trigger: titleRef.current,\n        start: 'bottom bottom',\n        end: 'bottom top',\n        scrub: true,\n        onUpdate: self => {\n          setVideoHeightProgress(self.progress)\n        },\n      }) as ScrollTriggerInstance\n\n      return () => {\n        heightTriggerRef.current?.kill()\n      }\n    }, [inView])\n\n    // \u66DD\u5149\u57CB\u70B9\n    useExposure(trackRef, {\n      componentType,\n      componentName,\n      componentTitle: videoTitle_html,\n    })\n\n    // \u8BA1\u7B97\u89C6\u9891\u5BB9\u5668\u7684 z-index\n    const zIndexVideo = useMemo(() => {\n      if (inView && videoHeightProgress > 0 && videoHeightProgress < ANIMATION_CONFIG.VIDEO_PROGRESS_THRESHOLD) return 3\n      if (inView) return 2\n      return 1\n    }, [videoHeightProgress, inView])\n\n    const videoParallaxOffset = useMemo(() => {\n      if (!sticky) return 0\n      return (videoHeightProgress - 0.5) * PARALLAX_CONFIG.TRANSLATE_RANGE\n    }, [videoHeightProgress, sticky])\n\n    // \u5904\u7406\u6309\u94AE\u70B9\u51FB\n    const handleBtnClick = useCallback(() => {\n      setVisible(true)\n      onBtnClick?.()\n    }, [onBtnClick])\n\n    const aspect =\n      'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] laptop:aspect-w-[1024] laptop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]'\n\n    // \u975E sticky \u6A21\u5F0F - \u7B80\u5355\u5E03\u5C40\n    if (!sticky) {\n      return (\n        <>\n          <div\n            id={id}\n            className={cn(\n              'relative overflow-hidden',\n              aspect,\n              {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              },\n              className\n            )}\n          >\n            <div ref={inViewRef}>\n              {/* \u5185\u5BB9\u5C42 */}\n              {!titleAnimation && (\n                <div className=\"media-content text-info-primary absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                  {title_html && !isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: title_html }}\n                    />\n                  )}\n                  {videoTitle_html && isPlaying && (\n                    <div\n                      className=\"lg-desktop:text-[64px] text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                      dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                    />\n                  )}\n                  {btnText && (\n                    <Button variant=\"link\" className={cn('member-equity-button-secondary')} onClick={handleBtnClick}>\n                      {btnText}\n                    </Button>\n                  )}\n                </div>\n              )}\n\n              {/* \u89C6\u9891\u5C42 */}\n              <ScrollLoadVideo\n                videoRef={videoRef}\n                poster={img?.url || ''}\n                src={video?.url!}\n                className=\"tablet:block hidden size-full\"\n                videoClassName=\"object-cover\"\n                muted\n                loop\n                playsInline\n                autoplay\n                webkit-playsinline\n                x5-playsinline\n              />\n              <ScrollLoadVideo\n                videoRef={videoRef}\n                poster={img?.url || ''}\n                src={mobileVideo?.url || video?.url!}\n                className=\"tablet:hidden block size-full\"\n                videoClassName=\"object-cover\"\n                muted\n                loop\n                playsInline\n                autoplay\n                webkit-playsinline\n                x5-playsinline\n              />\n            </div>\n\n            {/* \u57CB\u70B9\u5143\u7D20 */}\n            <div ref={trackRef} className=\"absolute bottom-0 left-0 h-px w-full\" />\n          </div>\n\n          {visible && youtubeId && (\n            <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n          )}\n        </>\n      )\n    }\n\n    // Sticky \u6A21\u5F0F - \u590D\u6742\u5E03\u5C40\n    return (\n      <>\n        <div\n          ref={titleRef}\n          className={cn(\n            'relative z-10',\n            aspect,\n            {\n              'aiui-dark': theme === 'dark',\n              'rounded-box': shape === 'rounded',\n            },\n            className\n          )}\n        >\n          <div ref={inViewRef}>\n            {!titleAnimation && (\n              <div className=\"media-content text-info-primary absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 px-4 text-center\">\n                {title_html && !isPlaying && (\n                  <div\n                    className=\"lg-desktop:text-[64px]  text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                    dangerouslySetInnerHTML={{ __html: title_html }}\n                  />\n                )}\n                {videoTitle_html && isPlaying && (\n                  <div\n                    className=\"lg-desktop:text-[64px]  text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                    dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n                  />\n                )}\n                {btnText && (\n                  <Button variant=\"link\" className={cn('member-equity-button-secondary ')} onClick={handleBtnClick}>\n                    {btnText}\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n        </div>\n        <div\n          style={{\n            marginBottom: `-${btb}px`,\n            marginTop: `-${titleHeight}px`,\n            zIndex: zIndexVideo,\n          }}\n          className=\"relative\"\n        >\n          <div className=\"sticky top-0\">\n            <div\n              id={id}\n              className={cn('relative h-screen w-full overflow-hidden', {\n                'aiui-dark': theme === 'dark',\n                'rounded-box': shape === 'rounded',\n              })}\n            >\n              {titleAnimation === 'fade-in' && title_html && (\n                <div\n                  ref={titleFadeInRef}\n                  className=\"lg-desktop:text-[64px]  absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2 text-center text-[40px] font-bold leading-none lg:text-5xl\"\n                  dangerouslySetInnerHTML={{ __html: title_html }}\n                />\n              )}\n              <div\n                className=\"media-cover absolute left-0 top-0 size-full\"\n                style={{\n                  transform: `translateY(${videoParallaxOffset}px)`,\n                  willChange: 'transform',\n                }}\n              >\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={video?.url!}\n                  className=\"tablet:block hidden size-full\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <ScrollLoadVideo\n                  videoRef={videoRef}\n                  poster={img?.url || ''}\n                  src={mobileVideo?.url || video?.url!}\n                  className=\"tablet:hidden block size-full\"\n                  videoClassName=\"object-cover\"\n                  muted\n                  loop\n                  playsInline\n                  autoplay\n                  webkit-playsinline\n                  x5-playsinline\n                />\n                <div\n                  ref={bgRef}\n                  className=\"absolute left-0 top-0 z-10 size-full opacity-0\"\n                  style={{\n                    background: 'rgba(0, 0, 0, 0.2)',\n                  }}\n                />\n              </div>\n            </div>\n          </div>\n          <div className={cn('relative box-content block', aspect)} style={{ height: `${btb}px` }} ref={trackRef} />\n        </div>\n        {visible && youtubeId && (\n          <VideoModal visible={visible} youTubeId={youtubeId} onCloseModal={() => setVisible(false)} />\n        )}\n      </>\n    )\n  }\n)\n\nMediaPlayerBase.displayName = 'MediaPlayerBase'\n\nexport default withLayout(MediaPlayerBase)\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "useState", "useRef", "useMemo", "useEffect", "forwardRef", "useImperativeHandle", "useCallback", "cn", "withLayout", "Button", "VideoModal", "convertLexicalToHTML", "useInView", "useExposure", "ScrollLoadVideo", "gsap", "SplitText", "ScrollTrigger", "componentName", "componentType", "ANIMATION_CONFIG", "PARALLAX_CONFIG", "SMOOTHING_CONFIG", "htmlConverters", "defaultConverters", "args", "node", "MediaPlayerBase", "className", "id", "onBtnClick", "title", "videoTitle", "btnText", "youtubeId", "video", "mobileVideo", "theme", "img", "shape", "titleAnimation", "rest", "ref", "sticky", "isPlaying", "setIsPlaying", "btb", "setbtb", "titleHeight", "setTitleHeight", "videoHeightProgress", "setVideoHeightProgress", "visible", "setVisible", "videoRef", "bgRef", "titleRef", "titleFadeInRef", "trackRef", "splitTextInstance", "scrollTriggerRef", "heightTriggerRef", "layoutTargetsRef", "layoutInitializedRef", "inViewRef", "inView", "title_html", "videoTitle_html", "calculateLayout", "rect", "screenHeight", "inViewRefToBottom", "newBtb", "newTitleHeight", "resizeObserver", "scrollFrame", "handleScroll", "rafId", "smoothAnimate", "prev", "target", "delta", "titleElement", "height", "words", "total", "interval", "wordAnimations", "_", "i", "start", "width", "self", "progress", "word", "opacity", "zIndexVideo", "videoParallaxOffset", "handleBtnClick", "aspect", "MediaPlayerBase_default"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anker-in/headless-ui",
-  "version": "1.1.9-temp-120101",
+  "version": "1.1.9-temp-120103",
   "type": "commonjs",
   "main": "./dist/cjs/index.js",
   "types": "./dist/cjs/index.d.ts",