@xhub-reel/embed 0.1.0 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +7 -7
package/dist/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
@keyframes xhub-reel-spin {
|
|
3
3
|
to { transform: rotate(360deg); }
|
|
4
4
|
}
|
|
5
|
-
`}),jsxRuntime.jsx("div",{role:"status","aria-label":"Loading",style:designTokens.mergeStyles({width:e,height:e,borderWidth:n,borderStyle:"solid",borderColor:`${t}30`,borderTopColor:t,borderRadius:"50%",animation:"xhub-reel-spin 1s linear infinite"},r),className:o})]})}var Oi={position:"fixed",left:designTokens.spacing[4],right:designTokens.spacing[4],zIndex:designTokens.zIndices.toast,display:"flex",justifyContent:"center",pointerEvents:"none"},Hi={display:"flex",alignItems:"center",gap:designTokens.spacing[3],padding:`${designTokens.spacing[3]}px ${designTokens.spacing[4]}px`,backgroundColor:designTokens.colors.surface,borderRadius:designTokens.radii.lg,boxShadow:"0 4px 12px rgba(0, 0, 0, 0.5)",pointerEvents:"auto",maxWidth:400},Di={default:{},success:{borderLeft:`3px solid ${designTokens.colors.success}`},error:{borderLeft:`3px solid ${designTokens.colors.error}`},warning:{borderLeft:`3px solid ${designTokens.colors.warning}`}},Bi={flex:1,fontSize:designTokens.fontSizes.sm,color:designTokens.colors.text,lineHeight:1.4},Ni={padding:`${designTokens.spacing[1]}px ${designTokens.spacing[3]}px`,backgroundColor:"transparent",border:"none",color:designTokens.colors.accent,fontSize:designTokens.fontSizes.sm,fontWeight:600,cursor:"pointer",borderRadius:designTokens.radii.sm};function An({message:e,isVisible:t,onClose:n,duration:r=3e3,variant:o="default",action:s,position:d="bottom",style:u,className:l=""}){react.useEffect(()=>{if(t&&r>0){let i=setTimeout(n,r);return ()=>clearTimeout(i)}},[t,r,n]);let m=d==="top"?{top:designTokens.spacing[4]}:{bottom:designTokens.spacing[4]+80};return jsxRuntime.jsx(react$1.AnimatePresence,{children:t&&jsxRuntime.jsx("div",{style:{...Oi,...m},children:jsxRuntime.jsxs(react$1.motion.div,{initial:{opacity:0,y:d==="top"?-20:20,scale:.95},animate:{opacity:1,y:0,scale:1},exit:{opacity:0,y:d==="top"?-20:20,scale:.95},transition:{type:"spring",...designTokens.springs.default},style:designTokens.mergeStyles(Hi,Di[o],u),className:l,children:[jsxRuntime.jsx("span",{style:Bi,children:e}),s&&jsxRuntime.jsx("button",{style:Ni,onClick:()=>{s.onClick(),n();},children:s.label})]})})})}var Wi={position:"absolute",pointerEvents:"none",zIndex:designTokens.zIndices.overlay},Gi={filter:"drop-shadow(0 4px 8px rgba(255, 45, 85, 0.5))"};function ct(){let[e,t]=react.useState(false),[n,r]=react.useState({x:0,y:0}),o=react.useCallback((d,u)=>{let l=d??(typeof window<"u"?window.innerWidth/2:200),m=u??(typeof window<"u"?window.innerHeight/2:400);r({x:l,y:m}),t(true),setTimeout(()=>{t(false);},800);},[]),s=react.useCallback(()=>{t(false);},[]);return {isShowing:e,position:n,showHeart:o,hideHeart:s}}var $i=({size:e,color:t})=>jsxRuntime.jsx("svg",{style:Gi,xmlns:"http://www.w3.org/2000/svg",width:e,height:e,viewBox:"0 0 28 28",fill:t,children:jsxRuntime.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M1.74988 11.0538C1.74988 6.75595 4.69822 2.91699 9.20877 2.91699C11.4347 2.91699 12.9986 3.9593 13.9999 4.96978C15.0011 3.95929 16.565 2.91699 18.791 2.91699C23.3015 2.91699 26.2499 6.75595 26.2499 11.0538C26.2499 15.3962 23.6265 18.9036 20.8781 21.3587C18.1288 23.8145 15.1442 25.3171 14.1843 25.6371L13.9999 25.6985L13.8154 25.6371C12.8555 25.3171 9.87093 23.8145 7.12168 21.3587C4.37329 18.9036 1.74988 15.3962 1.74988 11.0538ZM17.7449 6.41699C17.2617 6.41699 16.8699 6.80874 16.8699 7.29199C16.8699 7.77524 17.2617 8.16699 17.7449 8.16699C19.6221 8.16699 20.9952 9.75855 20.9952 11.8241C20.9952 12.3073 21.387 12.6991 21.8702 12.6991C22.3535 12.6991 22.7452 12.3073 22.7452 11.8241C22.7452 9.02543 20.8066 6.41699 17.7449 6.41699Z",fill:t})});function ht({show:e,position:t={x:0,y:0},size:n=100,color:r=designTokens.colors.like,showParticles:o=true,particleCount:s=8,onComplete:d,style:u,className:l=""}){return jsxRuntime.jsx(react$1.AnimatePresence,{onExitComplete:d,children:e&&jsxRuntime.jsxs(react$1.motion.div,{initial:{opacity:0,scale:0},animate:{opacity:[0,1,1,0],scale:[0,1.3,1,.8],y:[0,-20,-20,-40]},exit:{scale:0,opacity:0},transition:{duration:.8,times:[0,.2,.6,1],ease:"easeOut"},style:{...Wi,left:t.x-n/2,top:t.y-n/2,width:n,height:n,...u},className:l,children:[jsxRuntime.jsx($i,{size:n,color:r}),o&&[...Array(s)].map((m,i)=>jsxRuntime.jsx(react$1.motion.div,{style:{position:"absolute",width:12,height:12,borderRadius:"50%",backgroundColor:r,left:n/2-6,top:n/2-6},initial:{opacity:1,scale:1},animate:{opacity:0,scale:.5,x:Math.cos(i*Math.PI*2/s)*60,y:Math.sin(i*Math.PI*2/s)*60},transition:{duration:.5,delay:.1,ease:"easeOut"}},i))]})})}function Dn(e){let[t,n]=react.useState(false),r=typeof document<"u"&&!!(document.fullscreenEnabled||document.webkitFullscreenElement!==void 0||document.mozFullScreenElement!==void 0||document.msFullscreenElement!==void 0),o=()=>{let i=document;return i.fullscreenElement||i.webkitFullscreenElement||i.mozFullScreenElement||i.msFullscreenElement||null},s=async i=>{let a=i;a.requestFullscreen?await a.requestFullscreen():a.webkitRequestFullscreen?await a.webkitRequestFullscreen():a.mozRequestFullScreen?await a.mozRequestFullScreen():a.msRequestFullscreen&&await a.msRequestFullscreen();},d=async()=>{let i=document;i.exitFullscreen?await i.exitFullscreen():i.webkitExitFullscreen?await i.webkitExitFullscreen():i.mozCancelFullScreen?await i.mozCancelFullScreen():i.msExitFullscreen&&await i.msExitFullscreen();};react.useEffect(()=>{let i=()=>{let a=o();n(a===e.current);};return document.addEventListener("fullscreenchange",i),document.addEventListener("webkitfullscreenchange",i),document.addEventListener("mozfullscreenchange",i),document.addEventListener("MSFullscreenChange",i),()=>{document.removeEventListener("fullscreenchange",i),document.removeEventListener("webkitfullscreenchange",i),document.removeEventListener("mozfullscreenchange",i),document.removeEventListener("MSFullscreenChange",i);}},[e]);let u=react.useCallback(async()=>{let i=e.current;if(!(!i||!r))try{await s(i),n(!0);let a=screen.orientation;if(a?.lock)try{await a.lock("landscape");}catch{}}catch(a){console.error("[useFullscreen] Failed to enter fullscreen:",a);}},[e,r]),l=react.useCallback(async()=>{if(r)try{await d(),n(!1);let i=screen.orientation;i?.unlock&&i.unlock();}catch(i){console.error("[useFullscreen] Failed to exit fullscreen:",i);}},[r]),m=react.useCallback(async()=>{t?await l():await u();},[t,u,l]);return {isFullscreen:t,isSupported:r,toggleFullscreen:m,enterFullscreen:u,exitFullscreen:l}}var Zi={feed:{autoQualitySwitch:true,pauseOnOffline:false,resumeOnOnline:false,lowQualityOn:"2g"},watch:{autoQualitySwitch:true,pauseOnOffline:false,resumeOnOnline:false,lowQualityOn:"2g"},auto:{autoQualitySwitch:true,pauseOnOffline:true,resumeOnOnline:true,lowQualityOn:"2g"},manual:{autoQualitySwitch:false,pauseOnOffline:false,resumeOnOnline:false}},Ji={aggressive:{autoPauseOnLowBattery:true,pauseThreshold:.2},moderate:{autoPauseOnLowBattery:true,pauseThreshold:.15},conservative:{autoPauseOnLowBattery:true,pauseThreshold:.1},manual:{autoPauseOnLowBattery:false}};function $e(e,t,n={}){let r=react.useRef(null),o=react.useRef(null),s=t??o,[d,u]=react.useState(false),l=mn(),m=gn(e),i=yn(e),a=vn(r.current),p=Dn(s),c=react.useRef(n);c.current=n;let{networkBehavior:g,powerBehavior:f}=n,S=react.useMemo(()=>{if(g)return typeof g=="string"?Zi[g]:g},[g]),b=react.useMemo(()=>{if(f)return typeof f=="string"?Ji[f]:f},[f]),V=react.useMemo(()=>({onStateChange:v=>{l.transition(v),c.current.onStateChange?.(v),v==="ready"&&!d&&(u(true),c.current.onReady?.());},onError:(v,N)=>{c.current.onError?.(v,N);},onTimeUpdate:(v,N)=>{c.current.onTimeUpdate?.(v,N);},onQualityLevelsLoaded:v=>{c.current.onQualityLevelsLoaded?.(v);},onNetworkChange:v=>{S?.onNetworkChange?.(v),c.current.onNetworkChange?.(v);},onPowerChange:v=>{b?.onPowerChange?.(v),c.current.onPowerChange?.(v);},onAnalyticsUpdate:v=>{c.current.onAnalyticsUpdate?.(v);}}),[l,d,S,b]);react.useEffect(()=>{let v=e.current;if(!v)return;let N=()=>c.current.onPlay?.(),X=()=>c.current.onPause?.(),$=()=>c.current.onEnded?.();return v.addEventListener("play",N),v.addEventListener("pause",X),v.addEventListener("ended",$),()=>{v.removeEventListener("play",N),v.removeEventListener("pause",X),v.removeEventListener("ended",$);}},[e]);let L=react.useCallback((v,N)=>{let X=e.current;if(!X){console.error("[usePlayer] No video element");return}u(false),r.current&&r.current.destroy(),r.current=new fn({preferNative:c.current.preferNative,enableSmoothTimeUpdates:c.current.enableSmoothTimeUpdates,enableNetworkAdaptation:c.current.enableNetworkAdaptation,enablePowerAdaptation:c.current.enablePowerAdaptation,enableAnalytics:c.current.enableAnalytics,preloadConfig:c.current.preloadConfig,callbacks:V,autoQualityOnNetworkChange:S?.autoQualitySwitch,autoPauseOnOffline:S?.pauseOnOffline,autoResumeOnOnline:S?.resumeOnOnline,lowQualityThreshold:S?.lowQualityOn,autoPauseOnLowBattery:b?.autoPauseOnLowBattery,lowBatteryThreshold:b?.pauseThreshold}),r.current.attach(X,v,N);},[e,V,S,b]),h=react.useCallback(()=>{r.current&&(r.current.destroy(),r.current=null),l.reset(),u(false);},[l]),y=react.useCallback(async()=>{await r.current?.play();},[]),P=react.useCallback(()=>{r.current?.pause();},[]),O=react.useCallback(async()=>{await r.current?.togglePlay();},[]),C=react.useCallback(v=>{r.current?.seek(v);},[]),B=react.useCallback((v=10)=>{r.current?.seekForward(v);},[]),z=react.useCallback((v=10)=>{r.current?.seekBackward(v);},[]),H=react.useCallback(v=>{r.current?.setPlaybackRate(v);},[]),A=react.useCallback(()=>{let v=e.current;v&&(v.currentTime=0,v.play().catch(()=>{}));},[e]);return {playerCore:r.current,videoRef:e,containerRef:s,state:l,isReady:d,play:y,pause:P,togglePlay:O,seek:C,seekForward:B,seekBackward:z,setPlaybackSpeed:H,restart:A,volume:m,progress:i,quality:a,fullscreen:p,attach:L,destroy:h}}var no={position:"relative",width:"100%",height:"100%",backgroundColor:designTokens.colors.background},ro={width:"100%",height:"100%",objectFit:"contain"},_t=react.forwardRef(({video:e,autoPlay:t=true,muted:n=true,loop:r=true,poster:o,children:s,style:d,className:u="",onPlay:l,onPause:m,onEnded:i,onError:a,onStateChange:p,onTimeUpdate:c,onQualityLevelsLoaded:g,onReady:f},S)=>{let b=react.useRef(null),V=react.useRef(null),L=typeof e=="string"?e:e.url,h=o??(typeof e=="object"?e.thumbnail:void 0),y=$e(b,V,{onStateChange:p,onError:P=>a?.(P),onTimeUpdate:c,onQualityLevelsLoaded:g,onPlay:l,onPause:m,onEnded:i,onReady:f});return react.useEffect(()=>(L&&y.attach(L),()=>{y.destroy();}),[L]),react.useEffect(()=>{let P=b.current;P&&(P.muted=n,P.loop=r);},[n,r]),react.useEffect(()=>{let P=b.current;!P||!y.isReady||!t||P.play().catch(O=>{O.name==="NotAllowedError"&&(P.muted=true,P.play().catch(()=>{}));});},[t,y.isReady]),react.useImperativeHandle(S,()=>({play:y.play,pause:y.pause,togglePlay:y.togglePlay,seek:y.seek,seekForward:y.seekForward,seekBackward:y.seekBackward,restart:y.restart,setVolume:y.volume.setVolume,toggleMute:y.volume.toggleMute,setPlaybackSpeed:y.setPlaybackSpeed,setQuality:y.quality.setQuality,getQualityLevels:()=>y.quality.availableLevels,getVideoElement:()=>b.current,getCurrentTime:()=>y.progress.currentTime,getDuration:()=>y.progress.duration,isPaused:()=>b.current?.paused??true}),[y]),jsxRuntime.jsxs("div",{ref:V,style:Y(no,d),className:u,children:[jsxRuntime.jsx("video",{ref:b,poster:h,playsInline:true,preload:"auto",style:ro}),s]})});_t.displayName="VideoPlayer";var uo=30,co=1e3/uo,Z={container:{position:"absolute",bottom:0,left:0,right:0,zIndex:designTokens.zIndices.sticky,touchAction:"none",userSelect:"none",WebkitUserSelect:"none",transition:"all 0.125s ease-in-out"},collapsed:{height:Ne.HEIGHT_DEFAULT,paddingInline:designTokens.spacing[3],cursor:"pointer"},expanded:{padding:`${designTokens.spacing[2]}px ${designTokens.spacing[3]}px`,paddingBottom:`calc(${designTokens.spacing[1]}px + env(safe-area-inset-bottom, 0px))`,background:"linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 100%)"},timeContainer:{display:"flex",justifyContent:"center",alignItems:"center",marginBottom:designTokens.spacing[2]},timeText:{fontSize:designTokens.fontSizes.sm,fontWeight:designTokens.fontWeights.semibold,color:designTokens.colors.text,textShadow:designTokens.shadows.text,fontVariantNumeric:"tabular-nums",backgroundColor:"rgba(0, 0, 0, 0.6)",padding:`${designTokens.spacing[1]}px ${designTokens.spacing[3]}px`,borderRadius:designTokens.radii.md},track:{position:"relative",width:"100%",backgroundColor:"rgba(255, 255, 255, 0.2)",borderRadius:designTokens.radii.full,overflow:"hidden"},trackCollapsed:{height:Ne.HEIGHT_DEFAULT},trackExpanded:{height:Ne.HEIGHT_ACTIVE},buffer:{position:"absolute",top:0,left:0,height:"100%",backgroundColor:"rgba(255, 255, 255, 0.3)",borderRadius:designTokens.radii.full},progress:{position:"absolute",top:0,left:0,height:"100%",backgroundColor:designTokens.colors.text,borderRadius:designTokens.radii.full},scrubber:{position:"absolute",top:"50%",width:16,height:16,marginLeft:-8,marginTop:-8,backgroundColor:designTokens.colors.text,borderRadius:designTokens.radii.full,boxShadow:"0 2px 4px rgba(0,0,0,0.3)",transform:"scale(0)",transition:"transform 150ms ease"},scrubberVisible:{transform:"scale(1)"},touchArea:{position:"absolute",top:-12,left:0,right:0,bottom:-12,cursor:"pointer"}};function ye(e){if(!isFinite(e)||isNaN(e))return "0:00";let t=Math.floor(e/60),n=Math.floor(e%60);return `${t}:${n.toString().padStart(2,"0")}`}function ho(e){if(e.buffered.length===0)return 0;for(let t=0;t<e.buffered.length;t++)if(e.buffered.start(t)<=e.currentTime&&e.buffered.end(t)>=e.currentTime)return e.buffered.end(t);return e.buffered.end(e.buffered.length-1)}var pt=react.forwardRef(({videoRef:e,expanded:t=false,onSeekStart:n,onSeek:r,onSeekEnd:o,onExpandedChange:s,style:d,className:u=""},l)=>{let m=react.useRef(null),i=react.useRef(null),a=react.useRef(null),p=react.useRef(null),c=react.useRef(null),g=react.useRef(0),[f,S]=react.useState({currentTime:0,duration:0}),b=react.useRef(null),V=react.useRef(0),L=react.useRef(0),h=react.useRef(false),y=react.useRef(t);react.useEffect(()=>{y.current=t;},[t]);let P=react.useCallback(x=>{let w=e.current;if(!w||h.current)return;let k=w.duration||0,R=w.currentTime||0,D=ho(w),E=k>0?R/k*100:0,_=k>0?D/k*100:0;i.current&&(i.current.style.width=`${E}%`),a.current&&(a.current.style.width=`${_}%`),p.current&&y.current&&(p.current.style.left=`${E}%`),g.current=k,c.current&&(c.current.textContent=`${ye(R)} / ${ye(k)}`);let se=x??performance.now();se-L.current>=500&&(L.current=se,S(ge=>Math.abs(ge.currentTime-R)>=.5||ge.duration!==k?{currentTime:Math.floor(R),duration:Math.floor(k)}:ge));},[e]),O=react.useCallback(x=>{x-V.current>=co&&(V.current=x,P()),b.current=requestAnimationFrame(O);},[P]);react.useEffect(()=>(b.current=requestAnimationFrame(O),()=>{b.current&&cancelAnimationFrame(b.current);}),[O]);let C=react.useCallback(x=>{let w=m.current,k=e.current;if(!w||!k)return 0;let R=w.getBoundingClientRect(),D=x-R.left;return Math.max(0,Math.min(1,D/R.width))*(k.duration||0)},[e]),B=react.useCallback(x=>{h.current=true,n?.();let w=C(x);r?.(w);let k=e.current;if(k&&i.current){let R=k.duration||g.current||1,D=w/R*100;i.current.style.width=`${D}%`,p.current&&(p.current.style.left=`${D}%`),c.current&&(c.current.textContent=`${ye(w)} / ${ye(R)}`);}},[C,r,n,e]),z=react.useCallback(x=>{if(!h.current)return;let w=C(x);r?.(w);let k=e.current;if(k&&i.current){let R=k.duration||g.current||1,D=w/R*100;i.current.style.width=`${D}%`,p.current&&(p.current.style.left=`${D}%`),c.current&&(c.current.textContent=`${ye(w)} / ${ye(R)}`);}},[C,r,e]),H=react.useCallback(x=>{if(!h.current)return;h.current=false;let w=C(x);o?.(w);let k=e.current;k&&(k.currentTime=w);},[C,o,e]),A=react.useCallback(x=>{let w=x.touches[0];w&&B(w.clientX);},[B]),v=react.useCallback(x=>{let w=x.touches[0];w&&z(w.clientX);},[z]),N=react.useCallback(x=>{let w=x.changedTouches[0];w&&H(w.clientX);},[H]),X=react.useCallback(x=>{B(x.clientX);let w=R=>z(R.clientX),k=R=>{H(R.clientX),document.removeEventListener("mousemove",w),document.removeEventListener("mouseup",k);};document.addEventListener("mousemove",w),document.addEventListener("mouseup",k);},[B,z,H]),$=react.useCallback(()=>{t||s?.(true);},[t,s]),q=react.useCallback(x=>{let w=e.current;if(!w)return;let k=w.duration||0,R=w.currentTime||0,D=R;switch(x.key){case "ArrowLeft":D=Math.max(0,R-5);break;case "ArrowRight":D=Math.min(k,R+5);break;case "ArrowUp":D=Math.min(k,R+10);break;case "ArrowDown":D=Math.max(0,R-10);break;case "Home":D=0;break;case "End":D=k;break;default:return}x.preventDefault(),w.currentTime=D,r?.(D),P();},[e,r,P]);react.useImperativeHandle(l,()=>({update:P,setExpanded:x=>{s?.(x);}}));let K={...Z.container,...t?Z.expanded:Z.collapsed,...d},oe={...Z.track,...t?Z.trackExpanded:Z.trackCollapsed},J={...Z.scrubber,...t?Z.scrubberVisible:{}};return jsxRuntime.jsxs("div",{ref:m,style:K,className:u,onClick:t?void 0:$,onTouchStart:A,onTouchMove:v,onTouchEnd:N,onTouchCancel:N,onMouseDown:X,onKeyDown:q,role:"slider","aria-label":"Video progress","aria-valuemin":0,"aria-valuemax":f.duration,"aria-valuenow":f.currentTime,"aria-valuetext":`${ye(f.currentTime)} of ${ye(f.duration)}`,tabIndex:0,children:[t&&jsxRuntime.jsx("div",{style:Z.timeContainer,children:jsxRuntime.jsx("span",{ref:c,style:Z.timeText,children:"0:00 / 0:00"})}),jsxRuntime.jsxs("div",{style:oe,"aria-hidden":"true",children:[jsxRuntime.jsx("div",{style:Z.touchArea}),jsxRuntime.jsx("div",{ref:a,style:Z.buffer}),jsxRuntime.jsx("div",{ref:i,style:Z.progress}),t&&jsxRuntime.jsx("div",{ref:p,style:J})]})]})});pt.displayName="Timeline";var po={DOUBLE_TAP_DELAY:200},fo={THRESHOLD:500},qe={VERTICAL_THRESHOLD:.3,HORIZONTAL_THRESHOLD:.4,MIN_VELOCITY:.5},ft={THRESHOLD:10};var ve={TAP_DELAY:po.DOUBLE_TAP_DELAY,LONG_PRESS_THRESHOLD:fo.THRESHOLD,SWIPE_VERTICAL_THRESHOLD:qe.VERTICAL_THRESHOLD,SWIPE_HORIZONTAL_THRESHOLD:qe.HORIZONTAL_THRESHOLD,DRAG_THRESHOLD:ft.THRESHOLD};function Un(){return typeof navigator<"u"&&"vibrate"in navigator}function mt(){Un()&&navigator.vibrate(10);}function Qn(){Un()&&navigator.vibrate(20);}function zn(e,t){let n=e.currentTarget||e.target;if(!n||typeof n.getBoundingClientRect!="function")return "center";let r=n.getBoundingClientRect(),o=e.clientX-r.left,s=r.width;if(s===0)return "center";let d=s*.33,u=s*.67;return o<d?"left":o>u?"right":"center"}function gt(e){let t=react.useRef(0),n=react.useRef("center"),r=react.useRef(null),o=react.useRef(null),s=react.useRef(false),d=react.useRef(false),u=react.useRef({x:0,y:0}),l=react.useCallback(i=>{if(d.current){d.current=false;return}let a=zn(i),p=Date.now(),c=p-t.current,g={x:i.clientX,y:i.clientY};c<ve.TAP_DELAY&&n.current===a?(r.current&&(clearTimeout(r.current),r.current=null),mt(),e.onDoubleTap?.(a,g)):r.current=setTimeout(()=>{e.onSingleTap?.(a),r.current=null;},ve.TAP_DELAY),t.current=p,n.current=a;},[e]);return react$2.useGesture({onPointerDown:({event:i})=>{let a=i;u.current={x:a.clientX,y:a.clientY},d.current=false;let p=setTimeout(()=>{s.current=true,e.onHoldStart?.();},150);o.current=setTimeout(()=>{d.current=true,Qn();let g=a.target.getBoundingClientRect();e.onLongPress?.({x:a.clientX-g.left,y:a.clientY-g.top});},ve.LONG_PRESS_THRESHOLD),i.target.dataset.holdTimeout=String(p);},onPointerUp:({event:i})=>{let a=i.target.dataset.holdTimeout;a&&clearTimeout(Number(a)),o.current&&(clearTimeout(o.current),o.current=null),s.current&&(s.current=false,e.onHoldEnd?.());},onPointerMove:({event:i})=>{let a=i,p=Math.abs(a.clientX-u.current.x),c=Math.abs(a.clientY-u.current.y);(p>10||c>10)&&o.current&&(clearTimeout(o.current),o.current=null);},onClick:({event:i})=>{l(i);},onDrag:({movement:[i,a],direction:[p,c],velocity:[g,f],last:S,event:b})=>{if(b.preventDefault(),!S)return;let V=window.innerWidth,L=window.innerHeight;if(Math.abs(a)>L*ve.SWIPE_VERTICAL_THRESHOLD){c>0?e.onSwipeDown?.():e.onSwipeUp?.();return}if(Math.abs(i)>V*ve.SWIPE_HORIZONTAL_THRESHOLD){p>0?e.onSwipeRight?.():e.onSwipeLeft?.();return}Math.abs(i)>ve.DRAG_THRESHOLD&&Math.abs(g)>Math.abs(f)&&e.onSeekDrag?.(i);}},{drag:{threshold:ve.DRAG_THRESHOLD,filterTaps:true},eventOptions:{passive:false}})}var So=800,wo=.05,Po=.95;function Ut({onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r,threshold:o=qe.VERTICAL_THRESHOLD,velocityThreshold:s=qe.MIN_VELOCITY,hapticEnabled:d=true,disabled:u=false,enableProgressState:l=false}={}){let m=Math.max(wo,Math.min(Po,o)),[i,a]=react.useState({progress:0,direction:null,isSwiping:false}),p=react.useRef({onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r}),c=react.useRef(typeof window<"u"?window.innerHeight:So);return p.current={onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r},react.useEffect(()=>{let f=()=>{c.current=window.innerHeight;},S=()=>{setTimeout(()=>{c.current=window.innerHeight;},100);};return window.addEventListener("resize",f,{passive:true}),window.addEventListener("orientationchange",S,{passive:true}),()=>{window.removeEventListener("resize",f),window.removeEventListener("orientationchange",S);}},[]),{bind:react$2.useDrag(({movement:[,f],velocity:[,S],active:b,cancel:V})=>{if(u){V?.();return}let h=c.current*m,y=Math.min(1,Math.abs(f)/h),P=f<0?"up":"down";if(b)p.current.onSwipeProgress?.(y,P,f),l&&a({progress:y,direction:P,isSwiping:true});else {let O=Math.abs(f)>=h,C=Math.abs(S)>=s;O||C?(d&&mt(),P==="up"?p.current.onSwipeUp?.():p.current.onSwipeDown?.()):p.current.onSwipeCancel?.(),a({progress:0,direction:null,isSwiping:false});}},{axis:"y",threshold:ft.THRESHOLD,filterTaps:true,pointer:{touch:true},eventOptions:{passive:true}}),...i}}var Oe={container:{position:"relative",width:"100%",height:"100%",backgroundColor:designTokens.colors.background},video:{position:"absolute",inset:0,width:"100%",height:"100%",objectFit:"contain"},placeholder:{position:"absolute",inset:0,backgroundSize:"cover",backgroundPosition:"center"},tapArea:{zIndex:designTokens.zIndices.base},pauseOverlay:{zIndex:designTokens.zIndices.overlay},pauseIconWrapper:{borderRadius:designTokens.radii.full,transition:`opacity ${designTokens.durations.normal}ms ${designTokens.easings.xhubReel}, transform ${designTokens.durations.normal}ms ${designTokens.easings.xhubReel}`}};var Qt=react.createContext(null);function pe(){let e=react.useContext(Qt);if(!e)throw new Error("VideoFeedItem compound components must be used within a VideoFeedItem");return e}function Gn({elementRef:e,activateThreshold:t=Je.ACTIVATION_THRESHOLD,deactivateThreshold:n=Je.DEACTIVATION_THRESHOLD,rootMargin:r="0px",onVisibilityChange:o}){let[s,d]=react.useState(false),[u,l]=react.useState(false),[m,i]=react.useState(0),a=react.useRef(null);return react.useEffect(()=>{let p=e.current;if(!p)return;a.current&&a.current.disconnect();let c=[0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1];return a.current=new IntersectionObserver(g=>{g.forEach(f=>{let S=f.intersectionRatio;i(S),d(S>0),S>=t?l(true):S<n&&l(false),o?.(S>0,S);});},{threshold:c,rootMargin:r}),a.current.observe(p),()=>{a.current?.disconnect();}},[e,t,n,r,o]),{isVisible:s,isActive:u,visibilityRatio:m}}function qn({containerRef:e,videoRef:t,isCurrentVideo:n=false,onActivate:r,onDeactivate:o,autoActivate:s=true,trackVisibility:d=false,onVisibilityChange:u}){let l=react.useRef(false),{isVisible:m,isActive:i,visibilityRatio:a}=Gn({elementRef:e??{current:null},onVisibilityChange:d?u:void 0}),p=d?i:n;react.useEffect(()=>{s&&(p&&!l.current?(l.current=true,r?.()):!p&&l.current&&(l.current=false,o?.()));},[p,r,o,s]);let c=react.useCallback(()=>{let f=t.current;f&&f.play().catch(()=>{f.muted=true,f.play().catch(()=>{});}),r?.();},[t,r]),g=react.useCallback(()=>{let f=t.current;f&&(f.pause(),f.currentTime=0),o?.();},[t,o]);return {isActive:p,isVisible:d?m:n,visibilityRatio:d?a:n?1:0,activate:c,deactivate:g}}var Wt=class{entries=new Map;listeners=new Set;memoryWarningThreshold;constructor(){this.memoryWarningThreshold=Re.MAX_TOTAL_MEMORY/(1024*1024),this.setupMemoryPressureListener();}register(t,n=10){this.entries.set(t,{videoId:t,inDom:false,hasDecodedFrames:false,estimatedSizeMB:n,lastAccessed:Date.now()}),this.notifyListeners();}unregister(t){this.entries.delete(t),this.notifyListeners();}setInDom(t,n){let r=this.entries.get(t);r&&(r.inDom=n,r.lastAccessed=Date.now(),this.notifyListeners());}setHasDecodedFrames(t,n){let r=this.entries.get(t);r&&(r.hasDecodedFrames=n,r.lastAccessed=Date.now(),this.notifyListeners());}getState(){let t=0,n=0,r=0;return this.entries.forEach(o=>{o.inDom&&t++,o.hasDecodedFrames&&n++,r+=o.estimatedSizeMB;}),{videosInDom:t,decodedVideos:n,estimatedMemoryMB:r,isLowMemory:r>this.memoryWarningThreshold}}getVideosToDispose(){let t=this.getState(),n=[],r=Re?.MAX_VIDEOS_IN_DOM,o=Re?.MAX_DECODED_FRAMES,s=Array.from(this.entries.values()).sort((d,u)=>d.lastAccessed-u.lastAccessed);if(t.videosInDom>r){let d=t.videosInDom-r,u=0;for(let l of s){if(u>=d)break;l.inDom&&(n.push(l.videoId),u++);}}if(t.decodedVideos>o){let d=t.decodedVideos-o,u=0;for(let l of s){if(u>=d)break;l.hasDecodedFrames&&!n.includes(l.videoId)&&(n.push(l.videoId),u++);}}return n}subscribe(t){return this.listeners.add(t),()=>this.listeners.delete(t)}forceCleanup(){let t=this.getVideosToDispose();return t.forEach(n=>this.unregister(n)),t}notifyListeners(){let t=this.getState();this.listeners.forEach(n=>n(t));}setupMemoryPressureListener(){typeof window>"u"||"memory"in performance&&setInterval(()=>{this.getState().isLowMemory&&(console.warn("[MemoryManager] Low memory warning, forcing cleanup"),this.forceCleanup());},5e3);}},be=new Wt;function jn({videoId:e,estimatedSizeMB:t=10,onShouldDispose:n}){let[r,o]=react.useState(()=>be.getState()),[s,d]=react.useState(false);react.useEffect(()=>(be.register(e,t),()=>{be.unregister(e);}),[e,t]),react.useEffect(()=>be.subscribe(i=>{o(i);let p=be.getVideosToDispose().includes(e);p&&!s?(d(true),n?.()):!p&&s&&d(false);}),[e,s,n]);let u=react.useCallback(m=>{be.setInDom(e,m);},[e]),l=react.useCallback(m=>{be.setHasDecodedFrames(e,m);},[e]);return {memoryState:r,setInDom:u,setHasDecodedFrames:l,shouldDispose:s}}function Jn({video:e,isActive:t,priority:n,onLike:r,onComment:o,onShare:s,onAuthorClick:d}){let u=react.useRef(null),l=react.useRef(null),m=react.useRef(false),[i,a]=react.useState(false),[p,c]=react.useState(false),[g,f]=react.useState(false),{isShowing:S,position:b,showHeart:V}=ct(),L=react.useMemo(()=>({maxConcurrent:2,maxBufferSize:10*1024*1024,priorityLevels:10}),[]),h=react.useCallback(E=>{},[]),y=react.useCallback(E=>{},[]),P=react.useCallback(E=>{E.startupTime&&E.startupTime>1e3&&console.warn("[VideoFeedItem] Slow startup:",E.startupTime,"ms",e.id);},[e.id]),{state:O}=$e(l,u,{preferNative:true,enableSmoothTimeUpdates:true,networkBehavior:"feed",powerBehavior:"moderate",preloadConfig:L,enableAnalytics:true,onPlay:()=>{a(false),c(false);},onPause:()=>{l.current?.seeking||(a(true),c(true));},onNetworkChange:h,onPowerChange:y,onAnalyticsUpdate:P}),C=react.useCallback(async()=>{let E=l.current;if(E){E.muted=true;try{await E.play();}catch(_){console.warn("[VideoFeedItem] Play failed:",_.message);}}},[]),B=react.useCallback(()=>{let E=l.current;E&&E.pause();},[]),z=react.useCallback(E=>{let _=l.current;_&&(_.currentTime=E);},[]),[H,A]=react.useState(false);react.useEffect(()=>{let E=l.current;if(!E)return;let _=()=>A(true),se=()=>A(false),ge=()=>A(false);return E.addEventListener("play",_),E.addEventListener("pause",se),E.addEventListener("ended",ge),A(!E.paused),()=>{E.removeEventListener("play",_),E.removeEventListener("pause",se),E.removeEventListener("ended",ge);}},[e.id]);let v=H||O.state==="playing",{setInDom:N,setHasDecodedFrames:X,shouldDispose:$}=jn({videoId:e.id,onShouldDispose:()=>{B(),l.current&&(l.current.src="",l.current.load());}}),q=!$&&n!=="none",K=react.useRef(false);qn({videoRef:l,isCurrentVideo:t,onActivate:()=>{console.log("[VideoFeedItem] onActivate called, videoRef:",l.current?.src),X(true),l.current?C():(console.log("[VideoFeedItem] Video element not ready, marking pending play"),K.current=true);},onDeactivate:()=>{console.log("[VideoFeedItem] onDeactivate called"),K.current=false,X(false),B(),z(0);},autoActivate:true}),react.useEffect(()=>{l.current&&K.current&&t&&(console.log("[VideoFeedItem] Video element now available, executing pending play"),K.current=false,C());}),react.useEffect(()=>(N(true),()=>N(false)),[N]),react.useEffect(()=>{let E=l.current;if(!E)return;f(false);let _=()=>{console.log("[VideoFeedItem] Video loadeddata:",e.id,{isActive:t,priority:n}),n==="high"&&!t?requestAnimationFrame(()=>{E.readyState>=2&&(E.currentTime=.01,f(true),console.log("[VideoFeedItem] First frame decoded (preloaded):",e.id));}):t&&f(true);},se=()=>{n==="high"&&!g&&f(true);};return E.addEventListener("loadeddata",_),E.addEventListener("canplay",se),E.readyState>=2&&_(),()=>{E.removeEventListener("loadeddata",_),E.removeEventListener("canplay",se);}},[e.id,t,n,g]),react.useEffect(()=>{console.log("[VideoFeedItem] State:",{videoId:e.id,isActive:t,priority:n,shouldRenderVideo:q,hasVideoElement:!!l.current,videoSrc:l.current?.src});},[e.id,t,n,q]);let oe=react.useMemo(()=>{switch(n){case "high":return "auto";case "medium":return "metadata";case "low":case "metadata":return "none";default:return "none"}},[n]),J=react.useCallback(()=>{m.current=v,c(true),a(false),B();},[v,B]),x=react.useCallback(E=>{z(E),m.current?(C(),c(false)):a(true);},[z,C]),w=react.useCallback(()=>{v?B():C();},[v,C,B]),k=react.useCallback((E,_)=>{V(_.x,_.y),r?.();},[V,r]),R=react.useCallback(()=>{},[]),D=gt({onSingleTap:w,onDoubleTap:k,onLongPress:R});return {video:e,isActive:t,shouldRenderVideo:q,preload:oe,isPreloaded:g,containerRef:u,videoRef:l,isPlaying:v,showPauseOverlay:i,timelineExpanded:p,play:C,pause:B,seek:z,setShowPauseOverlay:a,setTimelineExpanded:c,gestureBindings:D,showHeart:S,heartPosition:b,triggerHeart:V,onLike:r,onComment:o,onShare:s,onAuthorClick:d,handleSeekStart:J,handleSeekEnd:x}}var bt=react.forwardRef(({placeholder:e,...t},n)=>{let{video:r,videoRef:o,shouldRenderVideo:s,preload:d,isPreloaded:u}=pe();if(!s)return e??jsxRuntime.jsx("div",{...t,style:{...Oe.placeholder,backgroundImage:`url(${r.thumbnail})`,...t.style}});let l=!u;return jsxRuntime.jsx("video",{ref:m=>{typeof n=="function"?n(m):n&&(n.current=m),o.current=m;},src:r.url,poster:l?r.thumbnail:void 0,preload:d,loop:true,playsInline:true,muted:true,style:Oe.video})});bt.displayName="VideoFeedItemPlayer";var St=react.forwardRef(({onLike:e,onComment:t,onShare:n,...r},o)=>{let{video:s,onLike:d,onComment:u,onShare:l}=pe();return jsxRuntime.jsx("div",{ref:o,...r,children:jsxRuntime.jsx(st,{avatarUrl:s.author.avatar,likeCount:s.stats.likes,commentCount:s.stats.comments,shareCount:s.stats.shares,isLiked:s.isLiked,onLike:e??d,onComment:t??u,onShare:n??l})})});St.displayName="VideoFeedItemActions";var wt=react.forwardRef(({expanded:e,...t},n)=>{let{videoRef:r,shouldRenderVideo:o,timelineExpanded:s,setTimelineExpanded:d,handleSeekStart:u,handleSeekEnd:l}=pe();return o?jsxRuntime.jsx("div",{ref:n,...t,children:jsxRuntime.jsx(pt,{videoRef:r,expanded:e??s,onSeekStart:u,onSeekEnd:l,onExpandedChange:d})}):null});wt.displayName="VideoFeedItemTimeline";var He={container:{position:"absolute",bottom:0,left:0,right:64,padding:designTokens.spacing[4],paddingBottom:"env(safe-area-inset-bottom, 16px)",zIndex:designTokens.zIndices.base},containerWithTimeline:{paddingBottom:"calc(env(safe-area-inset-bottom, 16px) + 48px)"},authorButton:{gap:designTokens.spacing[2],marginBottom:designTokens.spacing[3]},avatar:{borderRadius:designTokens.radii.full,border:`2px solid ${designTokens.colors.text}`},username:{color:designTokens.colors.text,fontWeight:designTokens.fontWeights.semibold,fontSize:designTokens.fontSizes.sm,textShadow:designTokens.shadows.text},caption:{color:designTokens.colors.text,fontSize:designTokens.fontSizes.sm,lineHeight:1.4,textShadow:designTokens.shadows.text,display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",paddingBottom:designTokens.spacing[1]},author:{color:designTokens.colors.text,fontSize:designTokens.fontSizes.sm,fontWeight:designTokens.fontWeights.semibold,textShadow:designTokens.shadows.text,display:"-webkit-box",WebkitLineClamp:1,WebkitBoxOrient:"vertical",overflow:"hidden",paddingBottom:designTokens.spacing[1]},hashtags:{display:"flex",flexWrap:"wrap",gap:designTokens.spacing[1],marginTop:designTokens.spacing[2],paddingBottom:designTokens.spacing[1]},hashtag:{color:designTokens.colors.accent,fontSize:designTokens.fontSizes.sm,fontWeight:designTokens.fontWeights.medium,textShadow:designTokens.shadows.text}};function ir({video:e,timelineExpanded:t=false,style:n,className:r=""}){let o=Y(He.container,t&&He.containerWithTimeline,n);return jsxRuntime.jsxs("div",{style:o,className:r,children:[e.author&&jsxRuntime.jsx("p",{style:He.author,children:e.author.displayName}),e.caption&&jsxRuntime.jsx("p",{style:He.caption,children:e.caption}),e.hashtags&&e.hashtags.length>0&&jsxRuntime.jsx("div",{style:He.hashtags,children:e.hashtags.slice(0,3).map((s,d)=>jsxRuntime.jsxs("span",{style:He.hashtag,children:["#",s]},d))})]})}var Pt=react.forwardRef(({showPlayPause:e=true,showDoubleTapHeart:t=true,showVideoInfo:n=true,...r},o)=>{let{video:s,isPlaying:d,showPauseOverlay:u,timelineExpanded:l,showHeart:m,heartPosition:i,onAuthorClick:a}=pe();return jsxRuntime.jsxs("div",{ref:o,...r,children:[e&&jsxRuntime.jsx(lt,{isPlaying:d,show:u,size:64,autoHideDelay:800,showOnStateChange:false}),t&&jsxRuntime.jsx(ht,{show:m,position:i,size:100,showParticles:true,particleCount:8}),n&&jsxRuntime.jsx(ir,{video:s,onAuthorClick:a,timelineExpanded:l})]})});Pt.displayName="VideoFeedItemOverlay";var Be=react.forwardRef(({video:e,isActive:t=false,priority:n="none",showTimeline:r=true,onLike:o,onComment:s,onShare:d,onAuthorClick:u,style:l,className:m="",children:i},a)=>{let p=Jn({video:e,isActive:t,priority:n,onLike:o,onComment:s,onShare:d,onAuthorClick:u}),c=i??jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(bt,{}),jsxRuntime.jsx(Pt,{}),jsxRuntime.jsx(St,{}),r&&jsxRuntime.jsx(wt,{})]});return jsxRuntime.jsx(Qt.Provider,{value:p,children:jsxRuntime.jsx("div",{ref:g=>{typeof a=="function"?a(g):a&&(a.current=g),p.containerRef.current=g;},style:Y(Oe.container,l),className:m,...p.gestureBindings(),children:c})})});Be.displayName="VideoFeedItem";function or(e,t){let n=e-t;return n===0||n===-1||n===1?"high":n===2?"medium":n===3?"low":Math.abs(n)<=5?"metadata":"none"}var Do="cubic-bezier(0.32, 0.72, 0, 1)",Bo=300,No=800,_o=50;function ar({trackRef:e,transitionDuration:t=Bo,easing:n=Do,onTransitionEnd:r}){let o=react.useRef(typeof window<"u"?window.innerHeight:No),s=react.useRef(0),d=react.useRef(null),u=react.useRef(false),l=react.useRef(true);react.useEffect(()=>{let c=()=>{o.current=window.innerHeight;},g=()=>{setTimeout(()=>{o.current=window.innerHeight;},100);};return window.addEventListener("resize",c,{passive:true}),window.addEventListener("orientationchange",g,{passive:true}),()=>{window.removeEventListener("resize",c),window.removeEventListener("orientationchange",g);}},[]);let m=react.useCallback(c=>{s.current=c,d.current!==null&&cancelAnimationFrame(d.current),d.current=requestAnimationFrame(()=>{let g=e.current;g&&(g.style.transition="none",g.style.transform=`translateY(${c}px)`),d.current=null;});},[e]),i=react.useCallback(c=>new Promise(g=>{let f=e.current;if(!f||!l.current){g();return}if(u.current){g();return}u.current=true,s.current=c;let S=null,b=null,V=L=>{L.propertyName==="transform"&&(S?.(),l.current&&(u.current=false,r?.()),g());};S=()=>{f.removeEventListener("transitionend",V),b&&(clearTimeout(b),b=null);},f.addEventListener("transitionend",V),b=setTimeout(()=>{S?.(),l.current&&u.current&&(u.current=false,r?.()),g();},t+_o),f.offsetHeight,f.style.transition=`transform ${t}ms ${n}`,f.style.transform=`translateY(${c}px)`;}),[e,t,n,r]),a=react.useCallback(()=>i(0),[i]),p=react.useCallback(()=>s.current,[]);return react.useEffect(()=>(l.current=true,()=>{l.current=false,d.current!==null&&(cancelAnimationFrame(d.current),d.current=null);}),[]),{setTranslateY:m,animateTo:i,snapBack:a,getCurrentY:p,viewportHeight:o.current,isAnimating:u.current}}var zo=300,Wo=50,Go=.3,$o="cubic-bezier(0.32, 0.72, 0, 1)",Se={container:{position:"fixed",inset:0,overflow:"hidden",backgroundColor:designTokens.colors.background,touchAction:"none",userSelect:"none",WebkitUserSelect:"none"},track:{position:"relative",width:"100%",height:"100%",willChange:"transform"},slide:{position:"absolute",left:0,width:"100%",height:"100%",backfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden"},loadingIndicator:{position:"absolute",bottom:80,left:0,right:0,display:"flex",justifyContent:"center",zIndex:designTokens.zIndices.base,pointerEvents:"none"},spinner:{width:24,height:24,borderWidth:2,borderStyle:"solid",borderColor:"rgba(255, 255, 255, 0.3)",borderTopColor:designTokens.colors.text,borderRadius:designTokens.radii.full,animation:"xhub-reel-spin 1s linear infinite"}},Ke=react.forwardRef(({videos:e,initialIndex:t=0,onLoadMore:n,onVideoChange:r,onLike:o,onComment:s,onShare:d,onAuthorClick:u,isLoading:l=false,hasMore:m=false,loadMoreThreshold:i=3,transitionDuration:a=zo,swipeThreshold:p=Wo,velocityThreshold:c=Go,gesturesDisabled:g=false,hapticEnabled:f=true,style:S,className:b=""},V)=>{let[L,h]=react.useState(()=>Math.min(Math.max(0,t),Math.max(0,e.length-1))),[y,P]=react.useState(false),[O,C]=react.useState(false),B=react.useRef(null),z=react.useRef(null),H=react.useRef(e),A=react.useRef(L),v=react.useRef(l),N=react.useRef(m),X=react.useRef(y),{setCurrentIndex:$}=Lt(),{setTranslateY:q,animateTo:K,snapBack:oe,viewportHeight:J}=ar({trackRef:z,transitionDuration:a,easing:$o});react.useEffect(()=>{H.current=e;},[e]),react.useEffect(()=>{A.current=L;},[L]),react.useEffect(()=>{v.current=l;},[l]),react.useEffect(()=>{N.current=m;},[m]),react.useEffect(()=>{X.current=y;},[y]),react.useEffect(()=>{if(e.length===0){h(0);return}if(L>=e.length){let I=e.length-1,U=e[I];h(I),$(I),U&&r?.(U,I);}},[e.length,L,$,r,e]);let x=react.useCallback(I=>or(I,L),[L]),w=react.useCallback(I=>{let U=H.current;N.current&&!v.current&&U.length-I<=i&&n?.();},[i,n]),k=react.useCallback(async(I,U=true)=>{if(X.current)return;let F=H.current,M=Math.max(0,Math.min(I,F.length-1)),ae=A.current;if(M===ae){q(0);return}let xe=M>ae?-1:1;if(U){P(true),C(true),await K(xe*J),h(M),$(M),q(0);let we=F[M];we&&r?.(we,M),w(M),C(false),P(false);}else {h(M),$(M),q(0);let we=F[M];we&&(r?.(we,M),w(M));}},[J,K,q,$,r,w]),R=react.useCallback((I=true)=>{let U=H.current,F=A.current;F<U.length-1&&k(F+1,I);},[k]),D=react.useCallback((I=true)=>{let U=A.current;U>0&&k(U-1,I);},[k]),E=react.useCallback((I,U,F)=>{let M=H.current,ae=A.current,xe=ae>0,we=ae<M.length-1,Xt=F;(U==="down"&&!xe||U==="up"&&!we)&&(Xt*=.3),q(Xt);},[q]),_=react.useCallback(async()=>{let I=H.current;if(!(A.current<I.length-1)){await oe();return}P(true),C(true),await K(-J);let M=A.current+1,ae=H.current;if(M<ae.length){h(M),$(M);let xe=ae[M];xe&&r?.(xe,M),w(M);}q(0),C(false),P(false);},[J,K,oe,q,$,r,w]),se=react.useCallback(async()=>{if(!(A.current>0)){await oe();return}P(true),C(true),await K(J);let F=A.current-1;if(F>=0){h(F),$(F);let M=H.current[F];M&&r?.(M,F);}q(0),C(false),P(false);},[J,K,oe,q,$,r]),ge=react.useCallback(async()=>{await oe();},[oe]),{bind:ur}=Ut({onSwipeUp:_,onSwipeDown:se,onSwipeProgress:E,onSwipeCancel:ge,threshold:p/J,velocityThreshold:c,hapticEnabled:f,disabled:g||y,enableProgressState:false});react.useImperativeHandle(V,()=>({slideTo:k,slideNext:R,slidePrev:D,get activeIndex(){return A.current},get totalSlides(){return H.current.length},get isBeginning(){return A.current===0},get isEnd(){return A.current===H.current.length-1}})),react.useEffect(()=>{let I=e[L];I&&r?.(I,L);},[]);let Ze=[];if(L>0&&Ze.push({index:L-1,position:-1}),Ze.push({index:L,position:0}),L<e.length-1&&Ze.push({index:L+1,position:1}),e.length===0)return jsxRuntime.jsx("div",{ref:B,style:Y(Se.container,S),className:b,"data-xhub-reel-feed":true,children:l&&jsxRuntime.jsx("div",{style:{...Se.loadingIndicator,top:"50%",bottom:"auto"},children:jsxRuntime.jsx("div",{style:Se.spinner})})});let cr={...Se.track};return jsxRuntime.jsxs("div",{ref:B,...ur(),style:Y(Se.container,S),className:b,"data-xhub-reel-feed":true,children:[jsxRuntime.jsx("style",{children:`
|
|
5
|
+
`}),jsxRuntime.jsx("div",{role:"status","aria-label":"Loading",style:designTokens.mergeStyles({width:e,height:e,borderWidth:n,borderStyle:"solid",borderColor:`${t}30`,borderTopColor:t,borderRadius:"50%",animation:"xhub-reel-spin 1s linear infinite"},r),className:o})]})}var Oi={position:"fixed",left:designTokens.spacing[4],right:designTokens.spacing[4],zIndex:designTokens.zIndices.toast,display:"flex",justifyContent:"center",pointerEvents:"none"},Hi={display:"flex",alignItems:"center",gap:designTokens.spacing[3],padding:`${designTokens.spacing[3]}px ${designTokens.spacing[4]}px`,backgroundColor:designTokens.colors.surface,borderRadius:designTokens.radii.lg,boxShadow:"0 4px 12px rgba(0, 0, 0, 0.5)",pointerEvents:"auto",maxWidth:400},Di={default:{},success:{borderLeft:`3px solid ${designTokens.colors.success}`},error:{borderLeft:`3px solid ${designTokens.colors.error}`},warning:{borderLeft:`3px solid ${designTokens.colors.warning}`}},Bi={flex:1,fontSize:designTokens.fontSizes.sm,color:designTokens.colors.text,lineHeight:1.4},Ni={padding:`${designTokens.spacing[1]}px ${designTokens.spacing[3]}px`,backgroundColor:"transparent",border:"none",color:designTokens.colors.accent,fontSize:designTokens.fontSizes.sm,fontWeight:600,cursor:"pointer",borderRadius:designTokens.radii.sm};function An({message:e,isVisible:t,onClose:n,duration:r=3e3,variant:o="default",action:s,position:d="bottom",style:u,className:l=""}){react.useEffect(()=>{if(t&&r>0){let i=setTimeout(n,r);return ()=>clearTimeout(i)}},[t,r,n]);let m=d==="top"?{top:designTokens.spacing[4]}:{bottom:designTokens.spacing[4]+80};return jsxRuntime.jsx(react$1.AnimatePresence,{children:t&&jsxRuntime.jsx("div",{style:{...Oi,...m},children:jsxRuntime.jsxs(react$1.motion.div,{initial:{opacity:0,y:d==="top"?-20:20,scale:.95},animate:{opacity:1,y:0,scale:1},exit:{opacity:0,y:d==="top"?-20:20,scale:.95},transition:{type:"spring",...designTokens.springs.default},style:designTokens.mergeStyles(Hi,Di[o],u),className:l,children:[jsxRuntime.jsx("span",{style:Bi,children:e}),s&&jsxRuntime.jsx("button",{style:Ni,onClick:()=>{s.onClick(),n();},children:s.label})]})})})}var Wi={position:"absolute",pointerEvents:"none",zIndex:designTokens.zIndices.overlay},Gi={filter:"drop-shadow(0 4px 8px rgba(255, 45, 85, 0.5))"};function ct(){let[e,t]=react.useState(false),[n,r]=react.useState({x:0,y:0}),o=react.useCallback((d,u)=>{let l=d??(typeof window<"u"?window.innerWidth/2:200),m=u??(typeof window<"u"?window.innerHeight/2:400);r({x:l,y:m}),t(true),setTimeout(()=>{t(false);},800);},[]),s=react.useCallback(()=>{t(false);},[]);return {isShowing:e,position:n,showHeart:o,hideHeart:s}}var $i=({size:e,color:t})=>jsxRuntime.jsx("svg",{style:Gi,xmlns:"http://www.w3.org/2000/svg",width:e,height:e,viewBox:"0 0 28 28",fill:t,children:jsxRuntime.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M1.74988 11.0538C1.74988 6.75595 4.69822 2.91699 9.20877 2.91699C11.4347 2.91699 12.9986 3.9593 13.9999 4.96978C15.0011 3.95929 16.565 2.91699 18.791 2.91699C23.3015 2.91699 26.2499 6.75595 26.2499 11.0538C26.2499 15.3962 23.6265 18.9036 20.8781 21.3587C18.1288 23.8145 15.1442 25.3171 14.1843 25.6371L13.9999 25.6985L13.8154 25.6371C12.8555 25.3171 9.87093 23.8145 7.12168 21.3587C4.37329 18.9036 1.74988 15.3962 1.74988 11.0538ZM17.7449 6.41699C17.2617 6.41699 16.8699 6.80874 16.8699 7.29199C16.8699 7.77524 17.2617 8.16699 17.7449 8.16699C19.6221 8.16699 20.9952 9.75855 20.9952 11.8241C20.9952 12.3073 21.387 12.6991 21.8702 12.6991C22.3535 12.6991 22.7452 12.3073 22.7452 11.8241C22.7452 9.02543 20.8066 6.41699 17.7449 6.41699Z",fill:t})});function ht({show:e,position:t={x:0,y:0},size:n=100,color:r=designTokens.colors.like,showParticles:o=true,particleCount:s=8,onComplete:d,style:u,className:l=""}){return jsxRuntime.jsx(react$1.AnimatePresence,{onExitComplete:d,children:e&&jsxRuntime.jsxs(react$1.motion.div,{initial:{opacity:0,scale:0},animate:{opacity:[0,1,1,0],scale:[0,1.3,1,.8],y:[0,-20,-20,-40]},exit:{scale:0,opacity:0},transition:{duration:.8,times:[0,.2,.6,1],ease:"easeOut"},style:{...Wi,left:t.x-n/2,top:t.y-n/2,width:n,height:n,...u},className:l,children:[jsxRuntime.jsx($i,{size:n,color:r}),o&&[...Array(s)].map((m,i)=>jsxRuntime.jsx(react$1.motion.div,{style:{position:"absolute",width:12,height:12,borderRadius:"50%",backgroundColor:r,left:n/2-6,top:n/2-6},initial:{opacity:1,scale:1},animate:{opacity:0,scale:.5,x:Math.cos(i*Math.PI*2/s)*60,y:Math.sin(i*Math.PI*2/s)*60},transition:{duration:.5,delay:.1,ease:"easeOut"}},i))]})})}function Dn(e){let[t,n]=react.useState(false),r=typeof document<"u"&&!!(document.fullscreenEnabled||document.webkitFullscreenElement!==void 0||document.mozFullScreenElement!==void 0||document.msFullscreenElement!==void 0),o=()=>{let i=document;return i.fullscreenElement||i.webkitFullscreenElement||i.mozFullScreenElement||i.msFullscreenElement||null},s=async i=>{let a=i;a.requestFullscreen?await a.requestFullscreen():a.webkitRequestFullscreen?await a.webkitRequestFullscreen():a.mozRequestFullScreen?await a.mozRequestFullScreen():a.msRequestFullscreen&&await a.msRequestFullscreen();},d=async()=>{let i=document;i.exitFullscreen?await i.exitFullscreen():i.webkitExitFullscreen?await i.webkitExitFullscreen():i.mozCancelFullScreen?await i.mozCancelFullScreen():i.msExitFullscreen&&await i.msExitFullscreen();};react.useEffect(()=>{let i=()=>{let a=o();n(a===e.current);};return document.addEventListener("fullscreenchange",i),document.addEventListener("webkitfullscreenchange",i),document.addEventListener("mozfullscreenchange",i),document.addEventListener("MSFullscreenChange",i),()=>{document.removeEventListener("fullscreenchange",i),document.removeEventListener("webkitfullscreenchange",i),document.removeEventListener("mozfullscreenchange",i),document.removeEventListener("MSFullscreenChange",i);}},[e]);let u=react.useCallback(async()=>{let i=e.current;if(!(!i||!r))try{await s(i),n(!0);let a=screen.orientation;if(a?.lock)try{await a.lock("landscape");}catch{}}catch(a){console.error("[useFullscreen] Failed to enter fullscreen:",a);}},[e,r]),l=react.useCallback(async()=>{if(r)try{await d(),n(!1);let i=screen.orientation;i?.unlock&&i.unlock();}catch(i){console.error("[useFullscreen] Failed to exit fullscreen:",i);}},[r]),m=react.useCallback(async()=>{t?await l():await u();},[t,u,l]);return {isFullscreen:t,isSupported:r,toggleFullscreen:m,enterFullscreen:u,exitFullscreen:l}}var Zi={feed:{autoQualitySwitch:true,pauseOnOffline:false,resumeOnOnline:false,lowQualityOn:"2g"},watch:{autoQualitySwitch:true,pauseOnOffline:false,resumeOnOnline:false,lowQualityOn:"2g"},auto:{autoQualitySwitch:true,pauseOnOffline:true,resumeOnOnline:true,lowQualityOn:"2g"},manual:{autoQualitySwitch:false,pauseOnOffline:false,resumeOnOnline:false}},Ji={aggressive:{autoPauseOnLowBattery:true,pauseThreshold:.2},moderate:{autoPauseOnLowBattery:true,pauseThreshold:.15},conservative:{autoPauseOnLowBattery:true,pauseThreshold:.1},manual:{autoPauseOnLowBattery:false}};function $e(e,t,n={}){let r=react.useRef(null),o=react.useRef(null),s=t??o,[d,u]=react.useState(false),l=mn(),m=gn(e),i=yn(e),a=vn(r.current),p=Dn(s),c=react.useRef(n);c.current=n;let{networkBehavior:g,powerBehavior:f}=n,S=react.useMemo(()=>{if(g)return typeof g=="string"?Zi[g]:g},[g]),b=react.useMemo(()=>{if(f)return typeof f=="string"?Ji[f]:f},[f]),V=react.useMemo(()=>({onStateChange:v=>{l.transition(v),c.current.onStateChange?.(v),v==="ready"&&!d&&(u(true),c.current.onReady?.());},onError:(v,N)=>{c.current.onError?.(v,N);},onTimeUpdate:(v,N)=>{c.current.onTimeUpdate?.(v,N);},onQualityLevelsLoaded:v=>{c.current.onQualityLevelsLoaded?.(v);},onNetworkChange:v=>{S?.onNetworkChange?.(v),c.current.onNetworkChange?.(v);},onPowerChange:v=>{b?.onPowerChange?.(v),c.current.onPowerChange?.(v);},onAnalyticsUpdate:v=>{c.current.onAnalyticsUpdate?.(v);}}),[l,d,S,b]);react.useEffect(()=>{let v=e.current;if(!v)return;let N=()=>c.current.onPlay?.(),X=()=>c.current.onPause?.(),$=()=>c.current.onEnded?.();return v.addEventListener("play",N),v.addEventListener("pause",X),v.addEventListener("ended",$),()=>{v.removeEventListener("play",N),v.removeEventListener("pause",X),v.removeEventListener("ended",$);}},[e]);let L=react.useCallback((v,N)=>{let X=e.current;if(!X){console.error("[usePlayer] No video element");return}u(false),r.current&&r.current.destroy(),r.current=new fn({preferNative:c.current.preferNative,enableSmoothTimeUpdates:c.current.enableSmoothTimeUpdates,enableNetworkAdaptation:c.current.enableNetworkAdaptation,enablePowerAdaptation:c.current.enablePowerAdaptation,enableAnalytics:c.current.enableAnalytics,preloadConfig:c.current.preloadConfig,callbacks:V,autoQualityOnNetworkChange:S?.autoQualitySwitch,autoPauseOnOffline:S?.pauseOnOffline,autoResumeOnOnline:S?.resumeOnOnline,lowQualityThreshold:S?.lowQualityOn,autoPauseOnLowBattery:b?.autoPauseOnLowBattery,lowBatteryThreshold:b?.pauseThreshold}),r.current.attach(X,v,N);},[e,V,S,b]),h=react.useCallback(()=>{r.current&&(r.current.destroy(),r.current=null),l.reset(),u(false);},[l]),y=react.useCallback(async()=>{await r.current?.play();},[]),P=react.useCallback(()=>{r.current?.pause();},[]),O=react.useCallback(async()=>{await r.current?.togglePlay();},[]),C=react.useCallback(v=>{r.current?.seek(v);},[]),B=react.useCallback((v=10)=>{r.current?.seekForward(v);},[]),z=react.useCallback((v=10)=>{r.current?.seekBackward(v);},[]),H=react.useCallback(v=>{r.current?.setPlaybackRate(v);},[]),A=react.useCallback(()=>{let v=e.current;v&&(v.currentTime=0,v.play().catch(()=>{}));},[e]);return {playerCore:r.current,videoRef:e,containerRef:s,state:l,isReady:d,play:y,pause:P,togglePlay:O,seek:C,seekForward:B,seekBackward:z,setPlaybackSpeed:H,restart:A,volume:m,progress:i,quality:a,fullscreen:p,attach:L,destroy:h}}var no={position:"relative",width:"100%",height:"100%",backgroundColor:designTokens.colors.background},ro={width:"100%",height:"100%",objectFit:"contain"},_t=react.forwardRef(({video:e,autoPlay:t=true,muted:n=true,loop:r=true,poster:o,children:s,style:d,className:u="",onPlay:l,onPause:m,onEnded:i,onError:a,onStateChange:p,onTimeUpdate:c,onQualityLevelsLoaded:g,onReady:f},S)=>{let b=react.useRef(null),V=react.useRef(null),L=typeof e=="string"?e:e.url,h=o??(typeof e=="object"?e.thumbnail:void 0),y=$e(b,V,{onStateChange:p,onError:P=>a?.(P),onTimeUpdate:c,onQualityLevelsLoaded:g,onPlay:l,onPause:m,onEnded:i,onReady:f});return react.useEffect(()=>(L&&y.attach(L),()=>{y.destroy();}),[L]),react.useEffect(()=>{let P=b.current;P&&(P.muted=n,P.loop=r);},[n,r]),react.useEffect(()=>{let P=b.current;!P||!y.isReady||!t||P.play().catch(O=>{O.name==="NotAllowedError"&&(P.muted=true,P.play().catch(()=>{}));});},[t,y.isReady]),react.useImperativeHandle(S,()=>({play:y.play,pause:y.pause,togglePlay:y.togglePlay,seek:y.seek,seekForward:y.seekForward,seekBackward:y.seekBackward,restart:y.restart,setVolume:y.volume.setVolume,toggleMute:y.volume.toggleMute,setPlaybackSpeed:y.setPlaybackSpeed,setQuality:y.quality.setQuality,getQualityLevels:()=>y.quality.availableLevels,getVideoElement:()=>b.current,getCurrentTime:()=>y.progress.currentTime,getDuration:()=>y.progress.duration,isPaused:()=>b.current?.paused??true}),[y]),jsxRuntime.jsxs("div",{ref:V,style:Y(no,d),className:u,children:[jsxRuntime.jsx("video",{ref:b,poster:h,playsInline:true,preload:"auto",style:ro}),s]})});_t.displayName="VideoPlayer";var uo=30,co=1e3/uo,Z={container:{position:"absolute",bottom:0,left:0,right:0,zIndex:designTokens.zIndices.sticky,touchAction:"none",userSelect:"none",WebkitUserSelect:"none",transition:"all 0.125s ease-in-out"},collapsed:{height:Ne.HEIGHT_DEFAULT,paddingInline:designTokens.spacing[3],cursor:"pointer"},expanded:{padding:`${designTokens.spacing[2]}px ${designTokens.spacing[3]}px`,paddingBottom:`calc(${designTokens.spacing[1]}px + env(safe-area-inset-bottom, 0px))`,background:"linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 100%)"},timeContainer:{display:"flex",justifyContent:"center",alignItems:"center",marginBottom:designTokens.spacing[2]},timeText:{fontSize:designTokens.fontSizes.sm,fontWeight:designTokens.fontWeights.semibold,color:designTokens.colors.text,textShadow:designTokens.shadows.text,fontVariantNumeric:"tabular-nums",backgroundColor:"rgba(0, 0, 0, 0.6)",padding:`${designTokens.spacing[1]}px ${designTokens.spacing[3]}px`,borderRadius:designTokens.radii.md},track:{position:"relative",width:"100%",backgroundColor:"rgba(255, 255, 255, 0.2)",borderRadius:designTokens.radii.full,overflow:"hidden"},trackCollapsed:{height:Ne.HEIGHT_DEFAULT},trackExpanded:{height:Ne.HEIGHT_ACTIVE},buffer:{position:"absolute",top:0,left:0,height:"100%",backgroundColor:"rgba(255, 255, 255, 0.3)",borderRadius:designTokens.radii.full},progress:{position:"absolute",top:0,left:0,height:"100%",backgroundColor:designTokens.colors.text,borderRadius:designTokens.radii.full},scrubber:{position:"absolute",top:"50%",width:16,height:16,marginLeft:-8,marginTop:-8,backgroundColor:designTokens.colors.text,borderRadius:designTokens.radii.full,boxShadow:"0 2px 4px rgba(0,0,0,0.3)",transform:"scale(0)",transition:"transform 150ms ease"},scrubberVisible:{transform:"scale(1)"},touchArea:{position:"absolute",top:-12,left:0,right:0,bottom:-12,cursor:"pointer"}};function ye(e){if(!isFinite(e)||isNaN(e))return "0:00";let t=Math.floor(e/60),n=Math.floor(e%60);return `${t}:${n.toString().padStart(2,"0")}`}function ho(e){if(e.buffered.length===0)return 0;for(let t=0;t<e.buffered.length;t++)if(e.buffered.start(t)<=e.currentTime&&e.buffered.end(t)>=e.currentTime)return e.buffered.end(t);return e.buffered.end(e.buffered.length-1)}var pt=react.forwardRef(({videoRef:e,expanded:t=false,onSeekStart:n,onSeek:r,onSeekEnd:o,onExpandedChange:s,style:d,className:u=""},l)=>{let m=react.useRef(null),i=react.useRef(null),a=react.useRef(null),p=react.useRef(null),c=react.useRef(null),g=react.useRef(0),[f,S]=react.useState({currentTime:0,duration:0}),b=react.useRef(null),V=react.useRef(0),L=react.useRef(0),h=react.useRef(false),y=react.useRef(t);react.useEffect(()=>{y.current=t;},[t]);let P=react.useCallback(x=>{let w=e.current;if(!w||h.current)return;let k=w.duration||0,R=w.currentTime||0,D=ho(w),E=k>0?R/k*100:0,_=k>0?D/k*100:0;i.current&&(i.current.style.width=`${E}%`),a.current&&(a.current.style.width=`${_}%`),p.current&&y.current&&(p.current.style.left=`${E}%`),g.current=k,c.current&&(c.current.textContent=`${ye(R)} / ${ye(k)}`);let se=x??performance.now();se-L.current>=500&&(L.current=se,S(ge=>Math.abs(ge.currentTime-R)>=.5||ge.duration!==k?{currentTime:Math.floor(R),duration:Math.floor(k)}:ge));},[e]),O=react.useCallback(x=>{x-V.current>=co&&(V.current=x,P()),b.current=requestAnimationFrame(O);},[P]);react.useEffect(()=>(b.current=requestAnimationFrame(O),()=>{b.current&&cancelAnimationFrame(b.current);}),[O]);let C=react.useCallback(x=>{let w=m.current,k=e.current;if(!w||!k)return 0;let R=w.getBoundingClientRect(),D=x-R.left;return Math.max(0,Math.min(1,D/R.width))*(k.duration||0)},[e]),B=react.useCallback(x=>{h.current=true,n?.();let w=C(x);r?.(w);let k=e.current;if(k&&i.current){let R=k.duration||g.current||1,D=w/R*100;i.current.style.width=`${D}%`,p.current&&(p.current.style.left=`${D}%`),c.current&&(c.current.textContent=`${ye(w)} / ${ye(R)}`);}},[C,r,n,e]),z=react.useCallback(x=>{if(!h.current)return;let w=C(x);r?.(w);let k=e.current;if(k&&i.current){let R=k.duration||g.current||1,D=w/R*100;i.current.style.width=`${D}%`,p.current&&(p.current.style.left=`${D}%`),c.current&&(c.current.textContent=`${ye(w)} / ${ye(R)}`);}},[C,r,e]),H=react.useCallback(x=>{if(!h.current)return;h.current=false;let w=C(x);o?.(w);let k=e.current;k&&(k.currentTime=w);},[C,o,e]),A=react.useCallback(x=>{let w=x.touches[0];w&&B(w.clientX);},[B]),v=react.useCallback(x=>{let w=x.touches[0];w&&z(w.clientX);},[z]),N=react.useCallback(x=>{let w=x.changedTouches[0];w&&H(w.clientX);},[H]),X=react.useCallback(x=>{B(x.clientX);let w=R=>z(R.clientX),k=R=>{H(R.clientX),document.removeEventListener("mousemove",w),document.removeEventListener("mouseup",k);};document.addEventListener("mousemove",w),document.addEventListener("mouseup",k);},[B,z,H]),$=react.useCallback(()=>{t||s?.(true);},[t,s]),q=react.useCallback(x=>{let w=e.current;if(!w)return;let k=w.duration||0,R=w.currentTime||0,D=R;switch(x.key){case "ArrowLeft":D=Math.max(0,R-5);break;case "ArrowRight":D=Math.min(k,R+5);break;case "ArrowUp":D=Math.min(k,R+10);break;case "ArrowDown":D=Math.max(0,R-10);break;case "Home":D=0;break;case "End":D=k;break;default:return}x.preventDefault(),w.currentTime=D,r?.(D),P();},[e,r,P]);react.useImperativeHandle(l,()=>({update:P,setExpanded:x=>{s?.(x);}}));let K={...Z.container,...t?Z.expanded:Z.collapsed,...d},oe={...Z.track,...t?Z.trackExpanded:Z.trackCollapsed},J={...Z.scrubber,...t?Z.scrubberVisible:{}};return jsxRuntime.jsxs("div",{ref:m,style:K,className:u,onClick:t?void 0:$,onTouchStart:A,onTouchMove:v,onTouchEnd:N,onTouchCancel:N,onMouseDown:X,onKeyDown:q,role:"slider","aria-label":"Video progress","aria-valuemin":0,"aria-valuemax":f.duration,"aria-valuenow":f.currentTime,"aria-valuetext":`${ye(f.currentTime)} of ${ye(f.duration)}`,tabIndex:0,children:[t&&jsxRuntime.jsx("div",{style:Z.timeContainer,children:jsxRuntime.jsx("span",{ref:c,style:Z.timeText,children:"0:00 / 0:00"})}),jsxRuntime.jsxs("div",{style:oe,"aria-hidden":"true",children:[jsxRuntime.jsx("div",{style:Z.touchArea}),jsxRuntime.jsx("div",{ref:a,style:Z.buffer}),jsxRuntime.jsx("div",{ref:i,style:Z.progress}),t&&jsxRuntime.jsx("div",{ref:p,style:J})]})]})});pt.displayName="Timeline";var po={DOUBLE_TAP_DELAY:200},fo={THRESHOLD:500},qe={VERTICAL_THRESHOLD:.3,HORIZONTAL_THRESHOLD:.4,MIN_VELOCITY:.5},ft={THRESHOLD:10};var ve={TAP_DELAY:po.DOUBLE_TAP_DELAY,LONG_PRESS_THRESHOLD:fo.THRESHOLD,SWIPE_VERTICAL_THRESHOLD:qe.VERTICAL_THRESHOLD,SWIPE_HORIZONTAL_THRESHOLD:qe.HORIZONTAL_THRESHOLD,DRAG_THRESHOLD:ft.THRESHOLD};function Un(){return typeof navigator<"u"&&"vibrate"in navigator}function mt(){Un()&&navigator.vibrate(10);}function Qn(){Un()&&navigator.vibrate(20);}function zn(e,t){let n=e.currentTarget||e.target;if(!n||typeof n.getBoundingClientRect!="function")return "center";let r=n.getBoundingClientRect(),o=e.clientX-r.left,s=r.width;if(s===0)return "center";let d=s*.33,u=s*.67;return o<d?"left":o>u?"right":"center"}function gt(e){let t=react.useRef(0),n=react.useRef("center"),r=react.useRef(null),o=react.useRef(null),s=react.useRef(false),d=react.useRef(false),u=react.useRef({x:0,y:0}),l=react.useCallback(i=>{if(d.current){d.current=false;return}let a=zn(i),p=Date.now(),c=p-t.current,g={x:i.clientX,y:i.clientY};c<ve.TAP_DELAY&&n.current===a?(r.current&&(clearTimeout(r.current),r.current=null),mt(),e.onDoubleTap?.(a,g)):r.current=setTimeout(()=>{e.onSingleTap?.(a),r.current=null;},ve.TAP_DELAY),t.current=p,n.current=a;},[e]);return react$2.useGesture({onPointerDown:({event:i})=>{let a=i;u.current={x:a.clientX,y:a.clientY},d.current=false;let p=setTimeout(()=>{s.current=true,e.onHoldStart?.();},150);o.current=setTimeout(()=>{d.current=true,Qn();let g=a.target.getBoundingClientRect();e.onLongPress?.({x:a.clientX-g.left,y:a.clientY-g.top});},ve.LONG_PRESS_THRESHOLD),i.target.dataset.holdTimeout=String(p);},onPointerUp:({event:i})=>{let a=i.target.dataset.holdTimeout;a&&clearTimeout(Number(a)),o.current&&(clearTimeout(o.current),o.current=null),s.current&&(s.current=false,e.onHoldEnd?.());},onPointerMove:({event:i})=>{let a=i,p=Math.abs(a.clientX-u.current.x),c=Math.abs(a.clientY-u.current.y);(p>10||c>10)&&o.current&&(clearTimeout(o.current),o.current=null);},onClick:({event:i})=>{l(i);},onDrag:({movement:[i,a],direction:[p,c],velocity:[g,f],last:S,event:b})=>{if(b.preventDefault(),!S)return;let V=window.innerWidth,L=window.innerHeight;if(Math.abs(a)>L*ve.SWIPE_VERTICAL_THRESHOLD){c>0?e.onSwipeDown?.():e.onSwipeUp?.();return}if(Math.abs(i)>V*ve.SWIPE_HORIZONTAL_THRESHOLD){p>0?e.onSwipeRight?.():e.onSwipeLeft?.();return}Math.abs(i)>ve.DRAG_THRESHOLD&&Math.abs(g)>Math.abs(f)&&e.onSeekDrag?.(i);}},{drag:{threshold:ve.DRAG_THRESHOLD,filterTaps:true},eventOptions:{passive:false}})}var So=800,wo=.05,Po=.95;function Ut({onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r,threshold:o=qe.VERTICAL_THRESHOLD,velocityThreshold:s=qe.MIN_VELOCITY,hapticEnabled:d=true,disabled:u=false,enableProgressState:l=false}={}){let m=Math.max(wo,Math.min(Po,o)),[i,a]=react.useState({progress:0,direction:null,isSwiping:false}),p=react.useRef({onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r}),c=react.useRef(typeof window<"u"?window.innerHeight:So);return p.current={onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r},react.useEffect(()=>{let f=()=>{c.current=window.innerHeight;},S=()=>{setTimeout(()=>{c.current=window.innerHeight;},100);};return window.addEventListener("resize",f,{passive:true}),window.addEventListener("orientationchange",S,{passive:true}),()=>{window.removeEventListener("resize",f),window.removeEventListener("orientationchange",S);}},[]),{bind:react$2.useDrag(({movement:[,f],velocity:[,S],active:b,cancel:V})=>{if(u){V?.();return}let h=c.current*m,y=Math.min(1,Math.abs(f)/h),P=f<0?"up":"down";if(b)p.current.onSwipeProgress?.(y,P,f),l&&a({progress:y,direction:P,isSwiping:true});else {let O=Math.abs(f)>=h,C=Math.abs(S)>=s;O||C?(d&&mt(),P==="up"?p.current.onSwipeUp?.():p.current.onSwipeDown?.()):p.current.onSwipeCancel?.(),a({progress:0,direction:null,isSwiping:false});}},{axis:"y",threshold:ft.THRESHOLD,filterTaps:true,pointer:{touch:true},eventOptions:{passive:true}}),...i}}var Oe={container:{position:"relative",width:"100%",height:"100%",backgroundColor:designTokens.colors.background},video:{position:"absolute",inset:0,width:"100%",height:"100%",objectFit:"cover"},placeholder:{position:"absolute",inset:0,backgroundSize:"cover",backgroundPosition:"center"},tapArea:{zIndex:designTokens.zIndices.base},pauseOverlay:{zIndex:designTokens.zIndices.overlay},pauseIconWrapper:{borderRadius:designTokens.radii.full,transition:`opacity ${designTokens.durations.normal}ms ${designTokens.easings.xhubReel}, transform ${designTokens.durations.normal}ms ${designTokens.easings.xhubReel}`}};var Qt=react.createContext(null);function pe(){let e=react.useContext(Qt);if(!e)throw new Error("VideoFeedItem compound components must be used within a VideoFeedItem");return e}function Gn({elementRef:e,activateThreshold:t=Je.ACTIVATION_THRESHOLD,deactivateThreshold:n=Je.DEACTIVATION_THRESHOLD,rootMargin:r="0px",onVisibilityChange:o}){let[s,d]=react.useState(false),[u,l]=react.useState(false),[m,i]=react.useState(0),a=react.useRef(null);return react.useEffect(()=>{let p=e.current;if(!p)return;a.current&&a.current.disconnect();let c=[0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1];return a.current=new IntersectionObserver(g=>{g.forEach(f=>{let S=f.intersectionRatio;i(S),d(S>0),S>=t?l(true):S<n&&l(false),o?.(S>0,S);});},{threshold:c,rootMargin:r}),a.current.observe(p),()=>{a.current?.disconnect();}},[e,t,n,r,o]),{isVisible:s,isActive:u,visibilityRatio:m}}function qn({containerRef:e,videoRef:t,isCurrentVideo:n=false,onActivate:r,onDeactivate:o,autoActivate:s=true,trackVisibility:d=false,onVisibilityChange:u}){let l=react.useRef(false),{isVisible:m,isActive:i,visibilityRatio:a}=Gn({elementRef:e??{current:null},onVisibilityChange:d?u:void 0}),p=d?i:n;react.useEffect(()=>{s&&(p&&!l.current?(l.current=true,r?.()):!p&&l.current&&(l.current=false,o?.()));},[p,r,o,s]);let c=react.useCallback(()=>{let f=t.current;f&&f.play().catch(()=>{f.muted=true,f.play().catch(()=>{});}),r?.();},[t,r]),g=react.useCallback(()=>{let f=t.current;f&&(f.pause(),f.currentTime=0),o?.();},[t,o]);return {isActive:p,isVisible:d?m:n,visibilityRatio:d?a:n?1:0,activate:c,deactivate:g}}var Wt=class{entries=new Map;listeners=new Set;memoryWarningThreshold;constructor(){this.memoryWarningThreshold=Re.MAX_TOTAL_MEMORY/(1024*1024),this.setupMemoryPressureListener();}register(t,n=10){this.entries.set(t,{videoId:t,inDom:false,hasDecodedFrames:false,estimatedSizeMB:n,lastAccessed:Date.now()}),this.notifyListeners();}unregister(t){this.entries.delete(t),this.notifyListeners();}setInDom(t,n){let r=this.entries.get(t);r&&(r.inDom=n,r.lastAccessed=Date.now(),this.notifyListeners());}setHasDecodedFrames(t,n){let r=this.entries.get(t);r&&(r.hasDecodedFrames=n,r.lastAccessed=Date.now(),this.notifyListeners());}getState(){let t=0,n=0,r=0;return this.entries.forEach(o=>{o.inDom&&t++,o.hasDecodedFrames&&n++,r+=o.estimatedSizeMB;}),{videosInDom:t,decodedVideos:n,estimatedMemoryMB:r,isLowMemory:r>this.memoryWarningThreshold}}getVideosToDispose(){let t=this.getState(),n=[],r=Re?.MAX_VIDEOS_IN_DOM,o=Re?.MAX_DECODED_FRAMES,s=Array.from(this.entries.values()).sort((d,u)=>d.lastAccessed-u.lastAccessed);if(t.videosInDom>r){let d=t.videosInDom-r,u=0;for(let l of s){if(u>=d)break;l.inDom&&(n.push(l.videoId),u++);}}if(t.decodedVideos>o){let d=t.decodedVideos-o,u=0;for(let l of s){if(u>=d)break;l.hasDecodedFrames&&!n.includes(l.videoId)&&(n.push(l.videoId),u++);}}return n}subscribe(t){return this.listeners.add(t),()=>this.listeners.delete(t)}forceCleanup(){let t=this.getVideosToDispose();return t.forEach(n=>this.unregister(n)),t}notifyListeners(){let t=this.getState();this.listeners.forEach(n=>n(t));}setupMemoryPressureListener(){typeof window>"u"||"memory"in performance&&setInterval(()=>{this.getState().isLowMemory&&(console.warn("[MemoryManager] Low memory warning, forcing cleanup"),this.forceCleanup());},5e3);}},be=new Wt;function jn({videoId:e,estimatedSizeMB:t=10,onShouldDispose:n}){let[r,o]=react.useState(()=>be.getState()),[s,d]=react.useState(false);react.useEffect(()=>(be.register(e,t),()=>{be.unregister(e);}),[e,t]),react.useEffect(()=>be.subscribe(i=>{o(i);let p=be.getVideosToDispose().includes(e);p&&!s?(d(true),n?.()):!p&&s&&d(false);}),[e,s,n]);let u=react.useCallback(m=>{be.setInDom(e,m);},[e]),l=react.useCallback(m=>{be.setHasDecodedFrames(e,m);},[e]);return {memoryState:r,setInDom:u,setHasDecodedFrames:l,shouldDispose:s}}function Jn({video:e,isActive:t,priority:n,onLike:r,onComment:o,onShare:s,onAuthorClick:d}){let u=react.useRef(null),l=react.useRef(null),m=react.useRef(false),[i,a]=react.useState(false),[p,c]=react.useState(false),[g,f]=react.useState(false),{isShowing:S,position:b,showHeart:V}=ct(),L=react.useMemo(()=>({maxConcurrent:2,maxBufferSize:10*1024*1024,priorityLevels:10}),[]),h=react.useCallback(E=>{},[]),y=react.useCallback(E=>{},[]),P=react.useCallback(E=>{E.startupTime&&E.startupTime>1e3&&console.warn("[VideoFeedItem] Slow startup:",E.startupTime,"ms",e.id);},[e.id]),{state:O}=$e(l,u,{preferNative:true,enableSmoothTimeUpdates:true,networkBehavior:"feed",powerBehavior:"moderate",preloadConfig:L,enableAnalytics:true,onPlay:()=>{a(false),c(false);},onPause:()=>{l.current?.seeking||(a(true),c(true));},onNetworkChange:h,onPowerChange:y,onAnalyticsUpdate:P}),C=react.useCallback(async()=>{let E=l.current;if(E){E.muted=true;try{await E.play();}catch(_){console.warn("[VideoFeedItem] Play failed:",_.message);}}},[]),B=react.useCallback(()=>{let E=l.current;E&&E.pause();},[]),z=react.useCallback(E=>{let _=l.current;_&&(_.currentTime=E);},[]),[H,A]=react.useState(false);react.useEffect(()=>{let E=l.current;if(!E)return;let _=()=>A(true),se=()=>A(false),ge=()=>A(false);return E.addEventListener("play",_),E.addEventListener("pause",se),E.addEventListener("ended",ge),A(!E.paused),()=>{E.removeEventListener("play",_),E.removeEventListener("pause",se),E.removeEventListener("ended",ge);}},[e.id]);let v=H||O.state==="playing",{setInDom:N,setHasDecodedFrames:X,shouldDispose:$}=jn({videoId:e.id,onShouldDispose:()=>{B(),l.current&&(l.current.src="",l.current.load());}}),q=!$&&n!=="none",K=react.useRef(false);qn({videoRef:l,isCurrentVideo:t,onActivate:()=>{console.log("[VideoFeedItem] onActivate called, videoRef:",l.current?.src),X(true),l.current?C():(console.log("[VideoFeedItem] Video element not ready, marking pending play"),K.current=true);},onDeactivate:()=>{console.log("[VideoFeedItem] onDeactivate called"),K.current=false,X(false),B(),z(0);},autoActivate:true}),react.useEffect(()=>{l.current&&K.current&&t&&(console.log("[VideoFeedItem] Video element now available, executing pending play"),K.current=false,C());}),react.useEffect(()=>(N(true),()=>N(false)),[N]),react.useEffect(()=>{let E=l.current;if(!E)return;f(false);let _=()=>{console.log("[VideoFeedItem] Video loadeddata:",e.id,{isActive:t,priority:n}),n==="high"&&!t?requestAnimationFrame(()=>{E.readyState>=2&&(E.currentTime=.01,f(true),console.log("[VideoFeedItem] First frame decoded (preloaded):",e.id));}):t&&f(true);},se=()=>{n==="high"&&!g&&f(true);};return E.addEventListener("loadeddata",_),E.addEventListener("canplay",se),E.readyState>=2&&_(),()=>{E.removeEventListener("loadeddata",_),E.removeEventListener("canplay",se);}},[e.id,t,n,g]),react.useEffect(()=>{console.log("[VideoFeedItem] State:",{videoId:e.id,isActive:t,priority:n,shouldRenderVideo:q,hasVideoElement:!!l.current,videoSrc:l.current?.src});},[e.id,t,n,q]);let oe=react.useMemo(()=>{switch(n){case "high":return "auto";case "medium":return "metadata";case "low":case "metadata":return "none";default:return "none"}},[n]),J=react.useCallback(()=>{m.current=v,c(true),a(false),B();},[v,B]),x=react.useCallback(E=>{z(E),m.current?(C(),c(false)):a(true);},[z,C]),w=react.useCallback(()=>{v?B():C();},[v,C,B]),k=react.useCallback((E,_)=>{V(_.x,_.y),r?.();},[V,r]),R=react.useCallback(()=>{},[]),D=gt({onSingleTap:w,onDoubleTap:k,onLongPress:R});return {video:e,isActive:t,shouldRenderVideo:q,preload:oe,isPreloaded:g,containerRef:u,videoRef:l,isPlaying:v,showPauseOverlay:i,timelineExpanded:p,play:C,pause:B,seek:z,setShowPauseOverlay:a,setTimelineExpanded:c,gestureBindings:D,showHeart:S,heartPosition:b,triggerHeart:V,onLike:r,onComment:o,onShare:s,onAuthorClick:d,handleSeekStart:J,handleSeekEnd:x}}var bt=react.forwardRef(({placeholder:e,...t},n)=>{let{video:r,videoRef:o,shouldRenderVideo:s,preload:d,isPreloaded:u}=pe();if(!s)return e??jsxRuntime.jsx("div",{...t,style:{...Oe.placeholder,backgroundImage:`url(${r.thumbnail})`,...t.style}});let l=!u;return jsxRuntime.jsx("video",{ref:m=>{typeof n=="function"?n(m):n&&(n.current=m),o.current=m;},src:r.url,poster:l?r.thumbnail:void 0,preload:d,loop:true,playsInline:true,muted:true,style:Oe.video})});bt.displayName="VideoFeedItemPlayer";var St=react.forwardRef(({onLike:e,onComment:t,onShare:n,...r},o)=>{let{video:s,onLike:d,onComment:u,onShare:l}=pe();return jsxRuntime.jsx("div",{ref:o,...r,children:jsxRuntime.jsx(st,{avatarUrl:s.author.avatar,likeCount:s.stats.likes,commentCount:s.stats.comments,shareCount:s.stats.shares,isLiked:s.isLiked,onLike:e??d,onComment:t??u,onShare:n??l})})});St.displayName="VideoFeedItemActions";var wt=react.forwardRef(({expanded:e,...t},n)=>{let{videoRef:r,shouldRenderVideo:o,timelineExpanded:s,setTimelineExpanded:d,handleSeekStart:u,handleSeekEnd:l}=pe();return o?jsxRuntime.jsx("div",{ref:n,...t,children:jsxRuntime.jsx(pt,{videoRef:r,expanded:e??s,onSeekStart:u,onSeekEnd:l,onExpandedChange:d})}):null});wt.displayName="VideoFeedItemTimeline";var He={container:{position:"absolute",bottom:0,left:0,right:64,padding:designTokens.spacing[4],paddingBottom:"env(safe-area-inset-bottom, 16px)",zIndex:designTokens.zIndices.base},containerWithTimeline:{paddingBottom:"calc(env(safe-area-inset-bottom, 16px) + 48px)"},authorButton:{gap:designTokens.spacing[2],marginBottom:designTokens.spacing[3]},avatar:{borderRadius:designTokens.radii.full,border:`2px solid ${designTokens.colors.text}`},username:{color:designTokens.colors.text,fontWeight:designTokens.fontWeights.semibold,fontSize:designTokens.fontSizes.sm,textShadow:designTokens.shadows.text},caption:{color:designTokens.colors.text,fontSize:designTokens.fontSizes.sm,lineHeight:1.4,textShadow:designTokens.shadows.text,display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",paddingBottom:designTokens.spacing[1]},author:{color:designTokens.colors.text,fontSize:designTokens.fontSizes.sm,fontWeight:designTokens.fontWeights.semibold,textShadow:designTokens.shadows.text,display:"-webkit-box",WebkitLineClamp:1,WebkitBoxOrient:"vertical",overflow:"hidden",paddingBottom:designTokens.spacing[1]},hashtags:{display:"flex",flexWrap:"wrap",gap:designTokens.spacing[1],marginTop:designTokens.spacing[2],paddingBottom:designTokens.spacing[1]},hashtag:{color:designTokens.colors.accent,fontSize:designTokens.fontSizes.sm,fontWeight:designTokens.fontWeights.medium,textShadow:designTokens.shadows.text}};function ir({video:e,timelineExpanded:t=false,style:n,className:r=""}){let o=Y(He.container,t&&He.containerWithTimeline,n);return jsxRuntime.jsxs("div",{style:o,className:r,children:[e.author&&jsxRuntime.jsx("p",{style:He.author,children:e.author.displayName}),e.caption&&jsxRuntime.jsx("p",{style:He.caption,children:e.caption}),e.hashtags&&e.hashtags.length>0&&jsxRuntime.jsx("div",{style:He.hashtags,children:e.hashtags.slice(0,3).map((s,d)=>jsxRuntime.jsxs("span",{style:He.hashtag,children:["#",s]},d))})]})}var Pt=react.forwardRef(({showPlayPause:e=true,showDoubleTapHeart:t=true,showVideoInfo:n=true,...r},o)=>{let{video:s,isPlaying:d,showPauseOverlay:u,timelineExpanded:l,showHeart:m,heartPosition:i,onAuthorClick:a}=pe();return jsxRuntime.jsxs("div",{ref:o,...r,children:[e&&jsxRuntime.jsx(lt,{isPlaying:d,show:u,size:64,autoHideDelay:800,showOnStateChange:false}),t&&jsxRuntime.jsx(ht,{show:m,position:i,size:100,showParticles:true,particleCount:8}),n&&jsxRuntime.jsx(ir,{video:s,onAuthorClick:a,timelineExpanded:l})]})});Pt.displayName="VideoFeedItemOverlay";var Be=react.forwardRef(({video:e,isActive:t=false,priority:n="none",showTimeline:r=true,onLike:o,onComment:s,onShare:d,onAuthorClick:u,style:l,className:m="",children:i},a)=>{let p=Jn({video:e,isActive:t,priority:n,onLike:o,onComment:s,onShare:d,onAuthorClick:u}),c=i??jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(bt,{}),jsxRuntime.jsx(Pt,{}),jsxRuntime.jsx(St,{}),r&&jsxRuntime.jsx(wt,{})]});return jsxRuntime.jsx(Qt.Provider,{value:p,children:jsxRuntime.jsx("div",{ref:g=>{typeof a=="function"?a(g):a&&(a.current=g),p.containerRef.current=g;},style:Y(Oe.container,l),className:m,...p.gestureBindings(),children:c})})});Be.displayName="VideoFeedItem";function or(e,t){let n=e-t;return n===0||n===-1||n===1?"high":n===2?"medium":n===3?"low":Math.abs(n)<=5?"metadata":"none"}var Do="cubic-bezier(0.32, 0.72, 0, 1)",Bo=300,No=800,_o=50;function ar({trackRef:e,transitionDuration:t=Bo,easing:n=Do,onTransitionEnd:r}){let o=react.useRef(typeof window<"u"?window.innerHeight:No),s=react.useRef(0),d=react.useRef(null),u=react.useRef(false),l=react.useRef(true);react.useEffect(()=>{let c=()=>{o.current=window.innerHeight;},g=()=>{setTimeout(()=>{o.current=window.innerHeight;},100);};return window.addEventListener("resize",c,{passive:true}),window.addEventListener("orientationchange",g,{passive:true}),()=>{window.removeEventListener("resize",c),window.removeEventListener("orientationchange",g);}},[]);let m=react.useCallback(c=>{s.current=c,d.current!==null&&cancelAnimationFrame(d.current),d.current=requestAnimationFrame(()=>{let g=e.current;g&&(g.style.transition="none",g.style.transform=`translateY(${c}px)`),d.current=null;});},[e]),i=react.useCallback(c=>new Promise(g=>{let f=e.current;if(!f||!l.current){g();return}if(u.current){g();return}u.current=true,s.current=c;let S=null,b=null,V=L=>{L.propertyName==="transform"&&(S?.(),l.current&&(u.current=false,r?.()),g());};S=()=>{f.removeEventListener("transitionend",V),b&&(clearTimeout(b),b=null);},f.addEventListener("transitionend",V),b=setTimeout(()=>{S?.(),l.current&&u.current&&(u.current=false,r?.()),g();},t+_o),f.offsetHeight,f.style.transition=`transform ${t}ms ${n}`,f.style.transform=`translateY(${c}px)`;}),[e,t,n,r]),a=react.useCallback(()=>i(0),[i]),p=react.useCallback(()=>s.current,[]);return react.useEffect(()=>(l.current=true,()=>{l.current=false,d.current!==null&&(cancelAnimationFrame(d.current),d.current=null);}),[]),{setTranslateY:m,animateTo:i,snapBack:a,getCurrentY:p,viewportHeight:o.current,isAnimating:u.current}}var zo=300,Wo=50,Go=.3,$o="cubic-bezier(0.32, 0.72, 0, 1)",Se={container:{position:"fixed",inset:0,overflow:"hidden",backgroundColor:designTokens.colors.background,touchAction:"none",userSelect:"none",WebkitUserSelect:"none"},track:{position:"relative",width:"100%",height:"100%",willChange:"transform"},slide:{position:"absolute",left:0,width:"100%",height:"100%",backfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden"},loadingIndicator:{position:"absolute",bottom:80,left:0,right:0,display:"flex",justifyContent:"center",zIndex:designTokens.zIndices.base,pointerEvents:"none"},spinner:{width:24,height:24,borderWidth:2,borderStyle:"solid",borderColor:"rgba(255, 255, 255, 0.3)",borderTopColor:designTokens.colors.text,borderRadius:designTokens.radii.full,animation:"xhub-reel-spin 1s linear infinite"}},Ke=react.forwardRef(({videos:e,initialIndex:t=0,onLoadMore:n,onVideoChange:r,onLike:o,onComment:s,onShare:d,onAuthorClick:u,isLoading:l=false,hasMore:m=false,loadMoreThreshold:i=3,transitionDuration:a=zo,swipeThreshold:p=Wo,velocityThreshold:c=Go,gesturesDisabled:g=false,hapticEnabled:f=true,style:S,className:b=""},V)=>{let[L,h]=react.useState(()=>Math.min(Math.max(0,t),Math.max(0,e.length-1))),[y,P]=react.useState(false),[O,C]=react.useState(false),B=react.useRef(null),z=react.useRef(null),H=react.useRef(e),A=react.useRef(L),v=react.useRef(l),N=react.useRef(m),X=react.useRef(y),{setCurrentIndex:$}=Lt(),{setTranslateY:q,animateTo:K,snapBack:oe,viewportHeight:J}=ar({trackRef:z,transitionDuration:a,easing:$o});react.useEffect(()=>{H.current=e;},[e]),react.useEffect(()=>{A.current=L;},[L]),react.useEffect(()=>{v.current=l;},[l]),react.useEffect(()=>{N.current=m;},[m]),react.useEffect(()=>{X.current=y;},[y]),react.useEffect(()=>{if(e.length===0){h(0);return}if(L>=e.length){let I=e.length-1,U=e[I];h(I),$(I),U&&r?.(U,I);}},[e.length,L,$,r,e]);let x=react.useCallback(I=>or(I,L),[L]),w=react.useCallback(I=>{let U=H.current;N.current&&!v.current&&U.length-I<=i&&n?.();},[i,n]),k=react.useCallback(async(I,U=true)=>{if(X.current)return;let F=H.current,M=Math.max(0,Math.min(I,F.length-1)),ae=A.current;if(M===ae){q(0);return}let xe=M>ae?-1:1;if(U){P(true),C(true),await K(xe*J),h(M),$(M),q(0);let we=F[M];we&&r?.(we,M),w(M),C(false),P(false);}else {h(M),$(M),q(0);let we=F[M];we&&(r?.(we,M),w(M));}},[J,K,q,$,r,w]),R=react.useCallback((I=true)=>{let U=H.current,F=A.current;F<U.length-1&&k(F+1,I);},[k]),D=react.useCallback((I=true)=>{let U=A.current;U>0&&k(U-1,I);},[k]),E=react.useCallback((I,U,F)=>{let M=H.current,ae=A.current,xe=ae>0,we=ae<M.length-1,Xt=F;(U==="down"&&!xe||U==="up"&&!we)&&(Xt*=.3),q(Xt);},[q]),_=react.useCallback(async()=>{let I=H.current;if(!(A.current<I.length-1)){await oe();return}P(true),C(true),await K(-J);let M=A.current+1,ae=H.current;if(M<ae.length){h(M),$(M);let xe=ae[M];xe&&r?.(xe,M),w(M);}q(0),C(false),P(false);},[J,K,oe,q,$,r,w]),se=react.useCallback(async()=>{if(!(A.current>0)){await oe();return}P(true),C(true),await K(J);let F=A.current-1;if(F>=0){h(F),$(F);let M=H.current[F];M&&r?.(M,F);}q(0),C(false),P(false);},[J,K,oe,q,$,r]),ge=react.useCallback(async()=>{await oe();},[oe]),{bind:ur}=Ut({onSwipeUp:_,onSwipeDown:se,onSwipeProgress:E,onSwipeCancel:ge,threshold:p/J,velocityThreshold:c,hapticEnabled:f,disabled:g||y,enableProgressState:false});react.useImperativeHandle(V,()=>({slideTo:k,slideNext:R,slidePrev:D,get activeIndex(){return A.current},get totalSlides(){return H.current.length},get isBeginning(){return A.current===0},get isEnd(){return A.current===H.current.length-1}})),react.useEffect(()=>{let I=e[L];I&&r?.(I,L);},[]);let Ze=[];if(L>0&&Ze.push({index:L-1,position:-1}),Ze.push({index:L,position:0}),L<e.length-1&&Ze.push({index:L+1,position:1}),e.length===0)return jsxRuntime.jsx("div",{ref:B,style:Y(Se.container,S),className:b,"data-xhub-reel-feed":true,children:l&&jsxRuntime.jsx("div",{style:{...Se.loadingIndicator,top:"50%",bottom:"auto"},children:jsxRuntime.jsx("div",{style:Se.spinner})})});let cr={...Se.track};return jsxRuntime.jsxs("div",{ref:B,...ur(),style:Y(Se.container,S),className:b,"data-xhub-reel-feed":true,children:[jsxRuntime.jsx("style",{children:`
|
|
6
6
|
@keyframes xhub-reel-spin {
|
|
7
7
|
to { transform: rotate(360deg); }
|
|
8
8
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -2,7 +2,7 @@ import ln,{Events,ErrorTypes}from'hls.js';import {create}from'zustand';import {p
|
|
|
2
2
|
@keyframes xhub-reel-spin {
|
|
3
3
|
to { transform: rotate(360deg); }
|
|
4
4
|
}
|
|
5
|
-
`}),jsx("div",{role:"status","aria-label":"Loading",style:mergeStyles({width:e,height:e,borderWidth:n,borderStyle:"solid",borderColor:`${t}30`,borderTopColor:t,borderRadius:"50%",animation:"xhub-reel-spin 1s linear infinite"},r),className:o})]})}var Oi={position:"fixed",left:spacing[4],right:spacing[4],zIndex:zIndices.toast,display:"flex",justifyContent:"center",pointerEvents:"none"},Hi={display:"flex",alignItems:"center",gap:spacing[3],padding:`${spacing[3]}px ${spacing[4]}px`,backgroundColor:colors.surface,borderRadius:radii.lg,boxShadow:"0 4px 12px rgba(0, 0, 0, 0.5)",pointerEvents:"auto",maxWidth:400},Di={default:{},success:{borderLeft:`3px solid ${colors.success}`},error:{borderLeft:`3px solid ${colors.error}`},warning:{borderLeft:`3px solid ${colors.warning}`}},Bi={flex:1,fontSize:fontSizes.sm,color:colors.text,lineHeight:1.4},Ni={padding:`${spacing[1]}px ${spacing[3]}px`,backgroundColor:"transparent",border:"none",color:colors.accent,fontSize:fontSizes.sm,fontWeight:600,cursor:"pointer",borderRadius:radii.sm};function An({message:e,isVisible:t,onClose:n,duration:r=3e3,variant:o="default",action:s,position:d="bottom",style:u,className:l=""}){useEffect(()=>{if(t&&r>0){let i=setTimeout(n,r);return ()=>clearTimeout(i)}},[t,r,n]);let m=d==="top"?{top:spacing[4]}:{bottom:spacing[4]+80};return jsx(AnimatePresence,{children:t&&jsx("div",{style:{...Oi,...m},children:jsxs(motion.div,{initial:{opacity:0,y:d==="top"?-20:20,scale:.95},animate:{opacity:1,y:0,scale:1},exit:{opacity:0,y:d==="top"?-20:20,scale:.95},transition:{type:"spring",...springs.default},style:mergeStyles(Hi,Di[o],u),className:l,children:[jsx("span",{style:Bi,children:e}),s&&jsx("button",{style:Ni,onClick:()=>{s.onClick(),n();},children:s.label})]})})})}var Wi={position:"absolute",pointerEvents:"none",zIndex:zIndices.overlay},Gi={filter:"drop-shadow(0 4px 8px rgba(255, 45, 85, 0.5))"};function ct(){let[e,t]=useState(false),[n,r]=useState({x:0,y:0}),o=useCallback((d,u)=>{let l=d??(typeof window<"u"?window.innerWidth/2:200),m=u??(typeof window<"u"?window.innerHeight/2:400);r({x:l,y:m}),t(true),setTimeout(()=>{t(false);},800);},[]),s=useCallback(()=>{t(false);},[]);return {isShowing:e,position:n,showHeart:o,hideHeart:s}}var $i=({size:e,color:t})=>jsx("svg",{style:Gi,xmlns:"http://www.w3.org/2000/svg",width:e,height:e,viewBox:"0 0 28 28",fill:t,children:jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M1.74988 11.0538C1.74988 6.75595 4.69822 2.91699 9.20877 2.91699C11.4347 2.91699 12.9986 3.9593 13.9999 4.96978C15.0011 3.95929 16.565 2.91699 18.791 2.91699C23.3015 2.91699 26.2499 6.75595 26.2499 11.0538C26.2499 15.3962 23.6265 18.9036 20.8781 21.3587C18.1288 23.8145 15.1442 25.3171 14.1843 25.6371L13.9999 25.6985L13.8154 25.6371C12.8555 25.3171 9.87093 23.8145 7.12168 21.3587C4.37329 18.9036 1.74988 15.3962 1.74988 11.0538ZM17.7449 6.41699C17.2617 6.41699 16.8699 6.80874 16.8699 7.29199C16.8699 7.77524 17.2617 8.16699 17.7449 8.16699C19.6221 8.16699 20.9952 9.75855 20.9952 11.8241C20.9952 12.3073 21.387 12.6991 21.8702 12.6991C22.3535 12.6991 22.7452 12.3073 22.7452 11.8241C22.7452 9.02543 20.8066 6.41699 17.7449 6.41699Z",fill:t})});function ht({show:e,position:t={x:0,y:0},size:n=100,color:r=colors.like,showParticles:o=true,particleCount:s=8,onComplete:d,style:u,className:l=""}){return jsx(AnimatePresence,{onExitComplete:d,children:e&&jsxs(motion.div,{initial:{opacity:0,scale:0},animate:{opacity:[0,1,1,0],scale:[0,1.3,1,.8],y:[0,-20,-20,-40]},exit:{scale:0,opacity:0},transition:{duration:.8,times:[0,.2,.6,1],ease:"easeOut"},style:{...Wi,left:t.x-n/2,top:t.y-n/2,width:n,height:n,...u},className:l,children:[jsx($i,{size:n,color:r}),o&&[...Array(s)].map((m,i)=>jsx(motion.div,{style:{position:"absolute",width:12,height:12,borderRadius:"50%",backgroundColor:r,left:n/2-6,top:n/2-6},initial:{opacity:1,scale:1},animate:{opacity:0,scale:.5,x:Math.cos(i*Math.PI*2/s)*60,y:Math.sin(i*Math.PI*2/s)*60},transition:{duration:.5,delay:.1,ease:"easeOut"}},i))]})})}function Dn(e){let[t,n]=useState(false),r=typeof document<"u"&&!!(document.fullscreenEnabled||document.webkitFullscreenElement!==void 0||document.mozFullScreenElement!==void 0||document.msFullscreenElement!==void 0),o=()=>{let i=document;return i.fullscreenElement||i.webkitFullscreenElement||i.mozFullScreenElement||i.msFullscreenElement||null},s=async i=>{let a=i;a.requestFullscreen?await a.requestFullscreen():a.webkitRequestFullscreen?await a.webkitRequestFullscreen():a.mozRequestFullScreen?await a.mozRequestFullScreen():a.msRequestFullscreen&&await a.msRequestFullscreen();},d=async()=>{let i=document;i.exitFullscreen?await i.exitFullscreen():i.webkitExitFullscreen?await i.webkitExitFullscreen():i.mozCancelFullScreen?await i.mozCancelFullScreen():i.msExitFullscreen&&await i.msExitFullscreen();};useEffect(()=>{let i=()=>{let a=o();n(a===e.current);};return document.addEventListener("fullscreenchange",i),document.addEventListener("webkitfullscreenchange",i),document.addEventListener("mozfullscreenchange",i),document.addEventListener("MSFullscreenChange",i),()=>{document.removeEventListener("fullscreenchange",i),document.removeEventListener("webkitfullscreenchange",i),document.removeEventListener("mozfullscreenchange",i),document.removeEventListener("MSFullscreenChange",i);}},[e]);let u=useCallback(async()=>{let i=e.current;if(!(!i||!r))try{await s(i),n(!0);let a=screen.orientation;if(a?.lock)try{await a.lock("landscape");}catch{}}catch(a){console.error("[useFullscreen] Failed to enter fullscreen:",a);}},[e,r]),l=useCallback(async()=>{if(r)try{await d(),n(!1);let i=screen.orientation;i?.unlock&&i.unlock();}catch(i){console.error("[useFullscreen] Failed to exit fullscreen:",i);}},[r]),m=useCallback(async()=>{t?await l():await u();},[t,u,l]);return {isFullscreen:t,isSupported:r,toggleFullscreen:m,enterFullscreen:u,exitFullscreen:l}}var Zi={feed:{autoQualitySwitch:true,pauseOnOffline:false,resumeOnOnline:false,lowQualityOn:"2g"},watch:{autoQualitySwitch:true,pauseOnOffline:false,resumeOnOnline:false,lowQualityOn:"2g"},auto:{autoQualitySwitch:true,pauseOnOffline:true,resumeOnOnline:true,lowQualityOn:"2g"},manual:{autoQualitySwitch:false,pauseOnOffline:false,resumeOnOnline:false}},Ji={aggressive:{autoPauseOnLowBattery:true,pauseThreshold:.2},moderate:{autoPauseOnLowBattery:true,pauseThreshold:.15},conservative:{autoPauseOnLowBattery:true,pauseThreshold:.1},manual:{autoPauseOnLowBattery:false}};function $e(e,t,n={}){let r=useRef(null),o=useRef(null),s=t??o,[d,u]=useState(false),l=mn(),m=gn(e),i=yn(e),a=vn(r.current),p=Dn(s),c=useRef(n);c.current=n;let{networkBehavior:g,powerBehavior:f}=n,S=useMemo(()=>{if(g)return typeof g=="string"?Zi[g]:g},[g]),b=useMemo(()=>{if(f)return typeof f=="string"?Ji[f]:f},[f]),V=useMemo(()=>({onStateChange:v=>{l.transition(v),c.current.onStateChange?.(v),v==="ready"&&!d&&(u(true),c.current.onReady?.());},onError:(v,N)=>{c.current.onError?.(v,N);},onTimeUpdate:(v,N)=>{c.current.onTimeUpdate?.(v,N);},onQualityLevelsLoaded:v=>{c.current.onQualityLevelsLoaded?.(v);},onNetworkChange:v=>{S?.onNetworkChange?.(v),c.current.onNetworkChange?.(v);},onPowerChange:v=>{b?.onPowerChange?.(v),c.current.onPowerChange?.(v);},onAnalyticsUpdate:v=>{c.current.onAnalyticsUpdate?.(v);}}),[l,d,S,b]);useEffect(()=>{let v=e.current;if(!v)return;let N=()=>c.current.onPlay?.(),X=()=>c.current.onPause?.(),$=()=>c.current.onEnded?.();return v.addEventListener("play",N),v.addEventListener("pause",X),v.addEventListener("ended",$),()=>{v.removeEventListener("play",N),v.removeEventListener("pause",X),v.removeEventListener("ended",$);}},[e]);let L=useCallback((v,N)=>{let X=e.current;if(!X){console.error("[usePlayer] No video element");return}u(false),r.current&&r.current.destroy(),r.current=new fn({preferNative:c.current.preferNative,enableSmoothTimeUpdates:c.current.enableSmoothTimeUpdates,enableNetworkAdaptation:c.current.enableNetworkAdaptation,enablePowerAdaptation:c.current.enablePowerAdaptation,enableAnalytics:c.current.enableAnalytics,preloadConfig:c.current.preloadConfig,callbacks:V,autoQualityOnNetworkChange:S?.autoQualitySwitch,autoPauseOnOffline:S?.pauseOnOffline,autoResumeOnOnline:S?.resumeOnOnline,lowQualityThreshold:S?.lowQualityOn,autoPauseOnLowBattery:b?.autoPauseOnLowBattery,lowBatteryThreshold:b?.pauseThreshold}),r.current.attach(X,v,N);},[e,V,S,b]),h=useCallback(()=>{r.current&&(r.current.destroy(),r.current=null),l.reset(),u(false);},[l]),y=useCallback(async()=>{await r.current?.play();},[]),P=useCallback(()=>{r.current?.pause();},[]),O=useCallback(async()=>{await r.current?.togglePlay();},[]),C=useCallback(v=>{r.current?.seek(v);},[]),B=useCallback((v=10)=>{r.current?.seekForward(v);},[]),z=useCallback((v=10)=>{r.current?.seekBackward(v);},[]),H=useCallback(v=>{r.current?.setPlaybackRate(v);},[]),A=useCallback(()=>{let v=e.current;v&&(v.currentTime=0,v.play().catch(()=>{}));},[e]);return {playerCore:r.current,videoRef:e,containerRef:s,state:l,isReady:d,play:y,pause:P,togglePlay:O,seek:C,seekForward:B,seekBackward:z,setPlaybackSpeed:H,restart:A,volume:m,progress:i,quality:a,fullscreen:p,attach:L,destroy:h}}var no={position:"relative",width:"100%",height:"100%",backgroundColor:colors.background},ro={width:"100%",height:"100%",objectFit:"contain"},_t=forwardRef(({video:e,autoPlay:t=true,muted:n=true,loop:r=true,poster:o,children:s,style:d,className:u="",onPlay:l,onPause:m,onEnded:i,onError:a,onStateChange:p,onTimeUpdate:c,onQualityLevelsLoaded:g,onReady:f},S)=>{let b=useRef(null),V=useRef(null),L=typeof e=="string"?e:e.url,h=o??(typeof e=="object"?e.thumbnail:void 0),y=$e(b,V,{onStateChange:p,onError:P=>a?.(P),onTimeUpdate:c,onQualityLevelsLoaded:g,onPlay:l,onPause:m,onEnded:i,onReady:f});return useEffect(()=>(L&&y.attach(L),()=>{y.destroy();}),[L]),useEffect(()=>{let P=b.current;P&&(P.muted=n,P.loop=r);},[n,r]),useEffect(()=>{let P=b.current;!P||!y.isReady||!t||P.play().catch(O=>{O.name==="NotAllowedError"&&(P.muted=true,P.play().catch(()=>{}));});},[t,y.isReady]),useImperativeHandle(S,()=>({play:y.play,pause:y.pause,togglePlay:y.togglePlay,seek:y.seek,seekForward:y.seekForward,seekBackward:y.seekBackward,restart:y.restart,setVolume:y.volume.setVolume,toggleMute:y.volume.toggleMute,setPlaybackSpeed:y.setPlaybackSpeed,setQuality:y.quality.setQuality,getQualityLevels:()=>y.quality.availableLevels,getVideoElement:()=>b.current,getCurrentTime:()=>y.progress.currentTime,getDuration:()=>y.progress.duration,isPaused:()=>b.current?.paused??true}),[y]),jsxs("div",{ref:V,style:Y(no,d),className:u,children:[jsx("video",{ref:b,poster:h,playsInline:true,preload:"auto",style:ro}),s]})});_t.displayName="VideoPlayer";var uo=30,co=1e3/uo,Z={container:{position:"absolute",bottom:0,left:0,right:0,zIndex:zIndices.sticky,touchAction:"none",userSelect:"none",WebkitUserSelect:"none",transition:"all 0.125s ease-in-out"},collapsed:{height:Ne.HEIGHT_DEFAULT,paddingInline:spacing[3],cursor:"pointer"},expanded:{padding:`${spacing[2]}px ${spacing[3]}px`,paddingBottom:`calc(${spacing[1]}px + env(safe-area-inset-bottom, 0px))`,background:"linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 100%)"},timeContainer:{display:"flex",justifyContent:"center",alignItems:"center",marginBottom:spacing[2]},timeText:{fontSize:fontSizes.sm,fontWeight:fontWeights.semibold,color:colors.text,textShadow:shadows.text,fontVariantNumeric:"tabular-nums",backgroundColor:"rgba(0, 0, 0, 0.6)",padding:`${spacing[1]}px ${spacing[3]}px`,borderRadius:radii.md},track:{position:"relative",width:"100%",backgroundColor:"rgba(255, 255, 255, 0.2)",borderRadius:radii.full,overflow:"hidden"},trackCollapsed:{height:Ne.HEIGHT_DEFAULT},trackExpanded:{height:Ne.HEIGHT_ACTIVE},buffer:{position:"absolute",top:0,left:0,height:"100%",backgroundColor:"rgba(255, 255, 255, 0.3)",borderRadius:radii.full},progress:{position:"absolute",top:0,left:0,height:"100%",backgroundColor:colors.text,borderRadius:radii.full},scrubber:{position:"absolute",top:"50%",width:16,height:16,marginLeft:-8,marginTop:-8,backgroundColor:colors.text,borderRadius:radii.full,boxShadow:"0 2px 4px rgba(0,0,0,0.3)",transform:"scale(0)",transition:"transform 150ms ease"},scrubberVisible:{transform:"scale(1)"},touchArea:{position:"absolute",top:-12,left:0,right:0,bottom:-12,cursor:"pointer"}};function ye(e){if(!isFinite(e)||isNaN(e))return "0:00";let t=Math.floor(e/60),n=Math.floor(e%60);return `${t}:${n.toString().padStart(2,"0")}`}function ho(e){if(e.buffered.length===0)return 0;for(let t=0;t<e.buffered.length;t++)if(e.buffered.start(t)<=e.currentTime&&e.buffered.end(t)>=e.currentTime)return e.buffered.end(t);return e.buffered.end(e.buffered.length-1)}var pt=forwardRef(({videoRef:e,expanded:t=false,onSeekStart:n,onSeek:r,onSeekEnd:o,onExpandedChange:s,style:d,className:u=""},l)=>{let m=useRef(null),i=useRef(null),a=useRef(null),p=useRef(null),c=useRef(null),g=useRef(0),[f,S]=useState({currentTime:0,duration:0}),b=useRef(null),V=useRef(0),L=useRef(0),h=useRef(false),y=useRef(t);useEffect(()=>{y.current=t;},[t]);let P=useCallback(x=>{let w=e.current;if(!w||h.current)return;let k=w.duration||0,R=w.currentTime||0,D=ho(w),E=k>0?R/k*100:0,_=k>0?D/k*100:0;i.current&&(i.current.style.width=`${E}%`),a.current&&(a.current.style.width=`${_}%`),p.current&&y.current&&(p.current.style.left=`${E}%`),g.current=k,c.current&&(c.current.textContent=`${ye(R)} / ${ye(k)}`);let se=x??performance.now();se-L.current>=500&&(L.current=se,S(ge=>Math.abs(ge.currentTime-R)>=.5||ge.duration!==k?{currentTime:Math.floor(R),duration:Math.floor(k)}:ge));},[e]),O=useCallback(x=>{x-V.current>=co&&(V.current=x,P()),b.current=requestAnimationFrame(O);},[P]);useEffect(()=>(b.current=requestAnimationFrame(O),()=>{b.current&&cancelAnimationFrame(b.current);}),[O]);let C=useCallback(x=>{let w=m.current,k=e.current;if(!w||!k)return 0;let R=w.getBoundingClientRect(),D=x-R.left;return Math.max(0,Math.min(1,D/R.width))*(k.duration||0)},[e]),B=useCallback(x=>{h.current=true,n?.();let w=C(x);r?.(w);let k=e.current;if(k&&i.current){let R=k.duration||g.current||1,D=w/R*100;i.current.style.width=`${D}%`,p.current&&(p.current.style.left=`${D}%`),c.current&&(c.current.textContent=`${ye(w)} / ${ye(R)}`);}},[C,r,n,e]),z=useCallback(x=>{if(!h.current)return;let w=C(x);r?.(w);let k=e.current;if(k&&i.current){let R=k.duration||g.current||1,D=w/R*100;i.current.style.width=`${D}%`,p.current&&(p.current.style.left=`${D}%`),c.current&&(c.current.textContent=`${ye(w)} / ${ye(R)}`);}},[C,r,e]),H=useCallback(x=>{if(!h.current)return;h.current=false;let w=C(x);o?.(w);let k=e.current;k&&(k.currentTime=w);},[C,o,e]),A=useCallback(x=>{let w=x.touches[0];w&&B(w.clientX);},[B]),v=useCallback(x=>{let w=x.touches[0];w&&z(w.clientX);},[z]),N=useCallback(x=>{let w=x.changedTouches[0];w&&H(w.clientX);},[H]),X=useCallback(x=>{B(x.clientX);let w=R=>z(R.clientX),k=R=>{H(R.clientX),document.removeEventListener("mousemove",w),document.removeEventListener("mouseup",k);};document.addEventListener("mousemove",w),document.addEventListener("mouseup",k);},[B,z,H]),$=useCallback(()=>{t||s?.(true);},[t,s]),q=useCallback(x=>{let w=e.current;if(!w)return;let k=w.duration||0,R=w.currentTime||0,D=R;switch(x.key){case "ArrowLeft":D=Math.max(0,R-5);break;case "ArrowRight":D=Math.min(k,R+5);break;case "ArrowUp":D=Math.min(k,R+10);break;case "ArrowDown":D=Math.max(0,R-10);break;case "Home":D=0;break;case "End":D=k;break;default:return}x.preventDefault(),w.currentTime=D,r?.(D),P();},[e,r,P]);useImperativeHandle(l,()=>({update:P,setExpanded:x=>{s?.(x);}}));let K={...Z.container,...t?Z.expanded:Z.collapsed,...d},oe={...Z.track,...t?Z.trackExpanded:Z.trackCollapsed},J={...Z.scrubber,...t?Z.scrubberVisible:{}};return jsxs("div",{ref:m,style:K,className:u,onClick:t?void 0:$,onTouchStart:A,onTouchMove:v,onTouchEnd:N,onTouchCancel:N,onMouseDown:X,onKeyDown:q,role:"slider","aria-label":"Video progress","aria-valuemin":0,"aria-valuemax":f.duration,"aria-valuenow":f.currentTime,"aria-valuetext":`${ye(f.currentTime)} of ${ye(f.duration)}`,tabIndex:0,children:[t&&jsx("div",{style:Z.timeContainer,children:jsx("span",{ref:c,style:Z.timeText,children:"0:00 / 0:00"})}),jsxs("div",{style:oe,"aria-hidden":"true",children:[jsx("div",{style:Z.touchArea}),jsx("div",{ref:a,style:Z.buffer}),jsx("div",{ref:i,style:Z.progress}),t&&jsx("div",{ref:p,style:J})]})]})});pt.displayName="Timeline";var po={DOUBLE_TAP_DELAY:200},fo={THRESHOLD:500},qe={VERTICAL_THRESHOLD:.3,HORIZONTAL_THRESHOLD:.4,MIN_VELOCITY:.5},ft={THRESHOLD:10};var ve={TAP_DELAY:po.DOUBLE_TAP_DELAY,LONG_PRESS_THRESHOLD:fo.THRESHOLD,SWIPE_VERTICAL_THRESHOLD:qe.VERTICAL_THRESHOLD,SWIPE_HORIZONTAL_THRESHOLD:qe.HORIZONTAL_THRESHOLD,DRAG_THRESHOLD:ft.THRESHOLD};function Un(){return typeof navigator<"u"&&"vibrate"in navigator}function mt(){Un()&&navigator.vibrate(10);}function Qn(){Un()&&navigator.vibrate(20);}function zn(e,t){let n=e.currentTarget||e.target;if(!n||typeof n.getBoundingClientRect!="function")return "center";let r=n.getBoundingClientRect(),o=e.clientX-r.left,s=r.width;if(s===0)return "center";let d=s*.33,u=s*.67;return o<d?"left":o>u?"right":"center"}function gt(e){let t=useRef(0),n=useRef("center"),r=useRef(null),o=useRef(null),s=useRef(false),d=useRef(false),u=useRef({x:0,y:0}),l=useCallback(i=>{if(d.current){d.current=false;return}let a=zn(i),p=Date.now(),c=p-t.current,g={x:i.clientX,y:i.clientY};c<ve.TAP_DELAY&&n.current===a?(r.current&&(clearTimeout(r.current),r.current=null),mt(),e.onDoubleTap?.(a,g)):r.current=setTimeout(()=>{e.onSingleTap?.(a),r.current=null;},ve.TAP_DELAY),t.current=p,n.current=a;},[e]);return useGesture({onPointerDown:({event:i})=>{let a=i;u.current={x:a.clientX,y:a.clientY},d.current=false;let p=setTimeout(()=>{s.current=true,e.onHoldStart?.();},150);o.current=setTimeout(()=>{d.current=true,Qn();let g=a.target.getBoundingClientRect();e.onLongPress?.({x:a.clientX-g.left,y:a.clientY-g.top});},ve.LONG_PRESS_THRESHOLD),i.target.dataset.holdTimeout=String(p);},onPointerUp:({event:i})=>{let a=i.target.dataset.holdTimeout;a&&clearTimeout(Number(a)),o.current&&(clearTimeout(o.current),o.current=null),s.current&&(s.current=false,e.onHoldEnd?.());},onPointerMove:({event:i})=>{let a=i,p=Math.abs(a.clientX-u.current.x),c=Math.abs(a.clientY-u.current.y);(p>10||c>10)&&o.current&&(clearTimeout(o.current),o.current=null);},onClick:({event:i})=>{l(i);},onDrag:({movement:[i,a],direction:[p,c],velocity:[g,f],last:S,event:b})=>{if(b.preventDefault(),!S)return;let V=window.innerWidth,L=window.innerHeight;if(Math.abs(a)>L*ve.SWIPE_VERTICAL_THRESHOLD){c>0?e.onSwipeDown?.():e.onSwipeUp?.();return}if(Math.abs(i)>V*ve.SWIPE_HORIZONTAL_THRESHOLD){p>0?e.onSwipeRight?.():e.onSwipeLeft?.();return}Math.abs(i)>ve.DRAG_THRESHOLD&&Math.abs(g)>Math.abs(f)&&e.onSeekDrag?.(i);}},{drag:{threshold:ve.DRAG_THRESHOLD,filterTaps:true},eventOptions:{passive:false}})}var So=800,wo=.05,Po=.95;function Ut({onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r,threshold:o=qe.VERTICAL_THRESHOLD,velocityThreshold:s=qe.MIN_VELOCITY,hapticEnabled:d=true,disabled:u=false,enableProgressState:l=false}={}){let m=Math.max(wo,Math.min(Po,o)),[i,a]=useState({progress:0,direction:null,isSwiping:false}),p=useRef({onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r}),c=useRef(typeof window<"u"?window.innerHeight:So);return p.current={onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r},useEffect(()=>{let f=()=>{c.current=window.innerHeight;},S=()=>{setTimeout(()=>{c.current=window.innerHeight;},100);};return window.addEventListener("resize",f,{passive:true}),window.addEventListener("orientationchange",S,{passive:true}),()=>{window.removeEventListener("resize",f),window.removeEventListener("orientationchange",S);}},[]),{bind:useDrag(({movement:[,f],velocity:[,S],active:b,cancel:V})=>{if(u){V?.();return}let h=c.current*m,y=Math.min(1,Math.abs(f)/h),P=f<0?"up":"down";if(b)p.current.onSwipeProgress?.(y,P,f),l&&a({progress:y,direction:P,isSwiping:true});else {let O=Math.abs(f)>=h,C=Math.abs(S)>=s;O||C?(d&&mt(),P==="up"?p.current.onSwipeUp?.():p.current.onSwipeDown?.()):p.current.onSwipeCancel?.(),a({progress:0,direction:null,isSwiping:false});}},{axis:"y",threshold:ft.THRESHOLD,filterTaps:true,pointer:{touch:true},eventOptions:{passive:true}}),...i}}var Oe={container:{position:"relative",width:"100%",height:"100%",backgroundColor:colors.background},video:{position:"absolute",inset:0,width:"100%",height:"100%",objectFit:"contain"},placeholder:{position:"absolute",inset:0,backgroundSize:"cover",backgroundPosition:"center"},tapArea:{zIndex:zIndices.base},pauseOverlay:{zIndex:zIndices.overlay},pauseIconWrapper:{borderRadius:radii.full,transition:`opacity ${durations.normal}ms ${easings.xhubReel}, transform ${durations.normal}ms ${easings.xhubReel}`}};var Qt=createContext(null);function pe(){let e=useContext(Qt);if(!e)throw new Error("VideoFeedItem compound components must be used within a VideoFeedItem");return e}function Gn({elementRef:e,activateThreshold:t=Je.ACTIVATION_THRESHOLD,deactivateThreshold:n=Je.DEACTIVATION_THRESHOLD,rootMargin:r="0px",onVisibilityChange:o}){let[s,d]=useState(false),[u,l]=useState(false),[m,i]=useState(0),a=useRef(null);return useEffect(()=>{let p=e.current;if(!p)return;a.current&&a.current.disconnect();let c=[0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1];return a.current=new IntersectionObserver(g=>{g.forEach(f=>{let S=f.intersectionRatio;i(S),d(S>0),S>=t?l(true):S<n&&l(false),o?.(S>0,S);});},{threshold:c,rootMargin:r}),a.current.observe(p),()=>{a.current?.disconnect();}},[e,t,n,r,o]),{isVisible:s,isActive:u,visibilityRatio:m}}function qn({containerRef:e,videoRef:t,isCurrentVideo:n=false,onActivate:r,onDeactivate:o,autoActivate:s=true,trackVisibility:d=false,onVisibilityChange:u}){let l=useRef(false),{isVisible:m,isActive:i,visibilityRatio:a}=Gn({elementRef:e??{current:null},onVisibilityChange:d?u:void 0}),p=d?i:n;useEffect(()=>{s&&(p&&!l.current?(l.current=true,r?.()):!p&&l.current&&(l.current=false,o?.()));},[p,r,o,s]);let c=useCallback(()=>{let f=t.current;f&&f.play().catch(()=>{f.muted=true,f.play().catch(()=>{});}),r?.();},[t,r]),g=useCallback(()=>{let f=t.current;f&&(f.pause(),f.currentTime=0),o?.();},[t,o]);return {isActive:p,isVisible:d?m:n,visibilityRatio:d?a:n?1:0,activate:c,deactivate:g}}var Wt=class{entries=new Map;listeners=new Set;memoryWarningThreshold;constructor(){this.memoryWarningThreshold=Re.MAX_TOTAL_MEMORY/(1024*1024),this.setupMemoryPressureListener();}register(t,n=10){this.entries.set(t,{videoId:t,inDom:false,hasDecodedFrames:false,estimatedSizeMB:n,lastAccessed:Date.now()}),this.notifyListeners();}unregister(t){this.entries.delete(t),this.notifyListeners();}setInDom(t,n){let r=this.entries.get(t);r&&(r.inDom=n,r.lastAccessed=Date.now(),this.notifyListeners());}setHasDecodedFrames(t,n){let r=this.entries.get(t);r&&(r.hasDecodedFrames=n,r.lastAccessed=Date.now(),this.notifyListeners());}getState(){let t=0,n=0,r=0;return this.entries.forEach(o=>{o.inDom&&t++,o.hasDecodedFrames&&n++,r+=o.estimatedSizeMB;}),{videosInDom:t,decodedVideos:n,estimatedMemoryMB:r,isLowMemory:r>this.memoryWarningThreshold}}getVideosToDispose(){let t=this.getState(),n=[],r=Re?.MAX_VIDEOS_IN_DOM,o=Re?.MAX_DECODED_FRAMES,s=Array.from(this.entries.values()).sort((d,u)=>d.lastAccessed-u.lastAccessed);if(t.videosInDom>r){let d=t.videosInDom-r,u=0;for(let l of s){if(u>=d)break;l.inDom&&(n.push(l.videoId),u++);}}if(t.decodedVideos>o){let d=t.decodedVideos-o,u=0;for(let l of s){if(u>=d)break;l.hasDecodedFrames&&!n.includes(l.videoId)&&(n.push(l.videoId),u++);}}return n}subscribe(t){return this.listeners.add(t),()=>this.listeners.delete(t)}forceCleanup(){let t=this.getVideosToDispose();return t.forEach(n=>this.unregister(n)),t}notifyListeners(){let t=this.getState();this.listeners.forEach(n=>n(t));}setupMemoryPressureListener(){typeof window>"u"||"memory"in performance&&setInterval(()=>{this.getState().isLowMemory&&(console.warn("[MemoryManager] Low memory warning, forcing cleanup"),this.forceCleanup());},5e3);}},be=new Wt;function jn({videoId:e,estimatedSizeMB:t=10,onShouldDispose:n}){let[r,o]=useState(()=>be.getState()),[s,d]=useState(false);useEffect(()=>(be.register(e,t),()=>{be.unregister(e);}),[e,t]),useEffect(()=>be.subscribe(i=>{o(i);let p=be.getVideosToDispose().includes(e);p&&!s?(d(true),n?.()):!p&&s&&d(false);}),[e,s,n]);let u=useCallback(m=>{be.setInDom(e,m);},[e]),l=useCallback(m=>{be.setHasDecodedFrames(e,m);},[e]);return {memoryState:r,setInDom:u,setHasDecodedFrames:l,shouldDispose:s}}function Jn({video:e,isActive:t,priority:n,onLike:r,onComment:o,onShare:s,onAuthorClick:d}){let u=useRef(null),l=useRef(null),m=useRef(false),[i,a]=useState(false),[p,c]=useState(false),[g,f]=useState(false),{isShowing:S,position:b,showHeart:V}=ct(),L=useMemo(()=>({maxConcurrent:2,maxBufferSize:10*1024*1024,priorityLevels:10}),[]),h=useCallback(E=>{},[]),y=useCallback(E=>{},[]),P=useCallback(E=>{E.startupTime&&E.startupTime>1e3&&console.warn("[VideoFeedItem] Slow startup:",E.startupTime,"ms",e.id);},[e.id]),{state:O}=$e(l,u,{preferNative:true,enableSmoothTimeUpdates:true,networkBehavior:"feed",powerBehavior:"moderate",preloadConfig:L,enableAnalytics:true,onPlay:()=>{a(false),c(false);},onPause:()=>{l.current?.seeking||(a(true),c(true));},onNetworkChange:h,onPowerChange:y,onAnalyticsUpdate:P}),C=useCallback(async()=>{let E=l.current;if(E){E.muted=true;try{await E.play();}catch(_){console.warn("[VideoFeedItem] Play failed:",_.message);}}},[]),B=useCallback(()=>{let E=l.current;E&&E.pause();},[]),z=useCallback(E=>{let _=l.current;_&&(_.currentTime=E);},[]),[H,A]=useState(false);useEffect(()=>{let E=l.current;if(!E)return;let _=()=>A(true),se=()=>A(false),ge=()=>A(false);return E.addEventListener("play",_),E.addEventListener("pause",se),E.addEventListener("ended",ge),A(!E.paused),()=>{E.removeEventListener("play",_),E.removeEventListener("pause",se),E.removeEventListener("ended",ge);}},[e.id]);let v=H||O.state==="playing",{setInDom:N,setHasDecodedFrames:X,shouldDispose:$}=jn({videoId:e.id,onShouldDispose:()=>{B(),l.current&&(l.current.src="",l.current.load());}}),q=!$&&n!=="none",K=useRef(false);qn({videoRef:l,isCurrentVideo:t,onActivate:()=>{console.log("[VideoFeedItem] onActivate called, videoRef:",l.current?.src),X(true),l.current?C():(console.log("[VideoFeedItem] Video element not ready, marking pending play"),K.current=true);},onDeactivate:()=>{console.log("[VideoFeedItem] onDeactivate called"),K.current=false,X(false),B(),z(0);},autoActivate:true}),useEffect(()=>{l.current&&K.current&&t&&(console.log("[VideoFeedItem] Video element now available, executing pending play"),K.current=false,C());}),useEffect(()=>(N(true),()=>N(false)),[N]),useEffect(()=>{let E=l.current;if(!E)return;f(false);let _=()=>{console.log("[VideoFeedItem] Video loadeddata:",e.id,{isActive:t,priority:n}),n==="high"&&!t?requestAnimationFrame(()=>{E.readyState>=2&&(E.currentTime=.01,f(true),console.log("[VideoFeedItem] First frame decoded (preloaded):",e.id));}):t&&f(true);},se=()=>{n==="high"&&!g&&f(true);};return E.addEventListener("loadeddata",_),E.addEventListener("canplay",se),E.readyState>=2&&_(),()=>{E.removeEventListener("loadeddata",_),E.removeEventListener("canplay",se);}},[e.id,t,n,g]),useEffect(()=>{console.log("[VideoFeedItem] State:",{videoId:e.id,isActive:t,priority:n,shouldRenderVideo:q,hasVideoElement:!!l.current,videoSrc:l.current?.src});},[e.id,t,n,q]);let oe=useMemo(()=>{switch(n){case "high":return "auto";case "medium":return "metadata";case "low":case "metadata":return "none";default:return "none"}},[n]),J=useCallback(()=>{m.current=v,c(true),a(false),B();},[v,B]),x=useCallback(E=>{z(E),m.current?(C(),c(false)):a(true);},[z,C]),w=useCallback(()=>{v?B():C();},[v,C,B]),k=useCallback((E,_)=>{V(_.x,_.y),r?.();},[V,r]),R=useCallback(()=>{},[]),D=gt({onSingleTap:w,onDoubleTap:k,onLongPress:R});return {video:e,isActive:t,shouldRenderVideo:q,preload:oe,isPreloaded:g,containerRef:u,videoRef:l,isPlaying:v,showPauseOverlay:i,timelineExpanded:p,play:C,pause:B,seek:z,setShowPauseOverlay:a,setTimelineExpanded:c,gestureBindings:D,showHeart:S,heartPosition:b,triggerHeart:V,onLike:r,onComment:o,onShare:s,onAuthorClick:d,handleSeekStart:J,handleSeekEnd:x}}var bt=forwardRef(({placeholder:e,...t},n)=>{let{video:r,videoRef:o,shouldRenderVideo:s,preload:d,isPreloaded:u}=pe();if(!s)return e??jsx("div",{...t,style:{...Oe.placeholder,backgroundImage:`url(${r.thumbnail})`,...t.style}});let l=!u;return jsx("video",{ref:m=>{typeof n=="function"?n(m):n&&(n.current=m),o.current=m;},src:r.url,poster:l?r.thumbnail:void 0,preload:d,loop:true,playsInline:true,muted:true,style:Oe.video})});bt.displayName="VideoFeedItemPlayer";var St=forwardRef(({onLike:e,onComment:t,onShare:n,...r},o)=>{let{video:s,onLike:d,onComment:u,onShare:l}=pe();return jsx("div",{ref:o,...r,children:jsx(st,{avatarUrl:s.author.avatar,likeCount:s.stats.likes,commentCount:s.stats.comments,shareCount:s.stats.shares,isLiked:s.isLiked,onLike:e??d,onComment:t??u,onShare:n??l})})});St.displayName="VideoFeedItemActions";var wt=forwardRef(({expanded:e,...t},n)=>{let{videoRef:r,shouldRenderVideo:o,timelineExpanded:s,setTimelineExpanded:d,handleSeekStart:u,handleSeekEnd:l}=pe();return o?jsx("div",{ref:n,...t,children:jsx(pt,{videoRef:r,expanded:e??s,onSeekStart:u,onSeekEnd:l,onExpandedChange:d})}):null});wt.displayName="VideoFeedItemTimeline";var He={container:{position:"absolute",bottom:0,left:0,right:64,padding:spacing[4],paddingBottom:"env(safe-area-inset-bottom, 16px)",zIndex:zIndices.base},containerWithTimeline:{paddingBottom:"calc(env(safe-area-inset-bottom, 16px) + 48px)"},authorButton:{gap:spacing[2],marginBottom:spacing[3]},avatar:{borderRadius:radii.full,border:`2px solid ${colors.text}`},username:{color:colors.text,fontWeight:fontWeights.semibold,fontSize:fontSizes.sm,textShadow:shadows.text},caption:{color:colors.text,fontSize:fontSizes.sm,lineHeight:1.4,textShadow:shadows.text,display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",paddingBottom:spacing[1]},author:{color:colors.text,fontSize:fontSizes.sm,fontWeight:fontWeights.semibold,textShadow:shadows.text,display:"-webkit-box",WebkitLineClamp:1,WebkitBoxOrient:"vertical",overflow:"hidden",paddingBottom:spacing[1]},hashtags:{display:"flex",flexWrap:"wrap",gap:spacing[1],marginTop:spacing[2],paddingBottom:spacing[1]},hashtag:{color:colors.accent,fontSize:fontSizes.sm,fontWeight:fontWeights.medium,textShadow:shadows.text}};function ir({video:e,timelineExpanded:t=false,style:n,className:r=""}){let o=Y(He.container,t&&He.containerWithTimeline,n);return jsxs("div",{style:o,className:r,children:[e.author&&jsx("p",{style:He.author,children:e.author.displayName}),e.caption&&jsx("p",{style:He.caption,children:e.caption}),e.hashtags&&e.hashtags.length>0&&jsx("div",{style:He.hashtags,children:e.hashtags.slice(0,3).map((s,d)=>jsxs("span",{style:He.hashtag,children:["#",s]},d))})]})}var Pt=forwardRef(({showPlayPause:e=true,showDoubleTapHeart:t=true,showVideoInfo:n=true,...r},o)=>{let{video:s,isPlaying:d,showPauseOverlay:u,timelineExpanded:l,showHeart:m,heartPosition:i,onAuthorClick:a}=pe();return jsxs("div",{ref:o,...r,children:[e&&jsx(lt,{isPlaying:d,show:u,size:64,autoHideDelay:800,showOnStateChange:false}),t&&jsx(ht,{show:m,position:i,size:100,showParticles:true,particleCount:8}),n&&jsx(ir,{video:s,onAuthorClick:a,timelineExpanded:l})]})});Pt.displayName="VideoFeedItemOverlay";var Be=forwardRef(({video:e,isActive:t=false,priority:n="none",showTimeline:r=true,onLike:o,onComment:s,onShare:d,onAuthorClick:u,style:l,className:m="",children:i},a)=>{let p=Jn({video:e,isActive:t,priority:n,onLike:o,onComment:s,onShare:d,onAuthorClick:u}),c=i??jsxs(Fragment,{children:[jsx(bt,{}),jsx(Pt,{}),jsx(St,{}),r&&jsx(wt,{})]});return jsx(Qt.Provider,{value:p,children:jsx("div",{ref:g=>{typeof a=="function"?a(g):a&&(a.current=g),p.containerRef.current=g;},style:Y(Oe.container,l),className:m,...p.gestureBindings(),children:c})})});Be.displayName="VideoFeedItem";function or(e,t){let n=e-t;return n===0||n===-1||n===1?"high":n===2?"medium":n===3?"low":Math.abs(n)<=5?"metadata":"none"}var Do="cubic-bezier(0.32, 0.72, 0, 1)",Bo=300,No=800,_o=50;function ar({trackRef:e,transitionDuration:t=Bo,easing:n=Do,onTransitionEnd:r}){let o=useRef(typeof window<"u"?window.innerHeight:No),s=useRef(0),d=useRef(null),u=useRef(false),l=useRef(true);useEffect(()=>{let c=()=>{o.current=window.innerHeight;},g=()=>{setTimeout(()=>{o.current=window.innerHeight;},100);};return window.addEventListener("resize",c,{passive:true}),window.addEventListener("orientationchange",g,{passive:true}),()=>{window.removeEventListener("resize",c),window.removeEventListener("orientationchange",g);}},[]);let m=useCallback(c=>{s.current=c,d.current!==null&&cancelAnimationFrame(d.current),d.current=requestAnimationFrame(()=>{let g=e.current;g&&(g.style.transition="none",g.style.transform=`translateY(${c}px)`),d.current=null;});},[e]),i=useCallback(c=>new Promise(g=>{let f=e.current;if(!f||!l.current){g();return}if(u.current){g();return}u.current=true,s.current=c;let S=null,b=null,V=L=>{L.propertyName==="transform"&&(S?.(),l.current&&(u.current=false,r?.()),g());};S=()=>{f.removeEventListener("transitionend",V),b&&(clearTimeout(b),b=null);},f.addEventListener("transitionend",V),b=setTimeout(()=>{S?.(),l.current&&u.current&&(u.current=false,r?.()),g();},t+_o),f.offsetHeight,f.style.transition=`transform ${t}ms ${n}`,f.style.transform=`translateY(${c}px)`;}),[e,t,n,r]),a=useCallback(()=>i(0),[i]),p=useCallback(()=>s.current,[]);return useEffect(()=>(l.current=true,()=>{l.current=false,d.current!==null&&(cancelAnimationFrame(d.current),d.current=null);}),[]),{setTranslateY:m,animateTo:i,snapBack:a,getCurrentY:p,viewportHeight:o.current,isAnimating:u.current}}var zo=300,Wo=50,Go=.3,$o="cubic-bezier(0.32, 0.72, 0, 1)",Se={container:{position:"fixed",inset:0,overflow:"hidden",backgroundColor:colors.background,touchAction:"none",userSelect:"none",WebkitUserSelect:"none"},track:{position:"relative",width:"100%",height:"100%",willChange:"transform"},slide:{position:"absolute",left:0,width:"100%",height:"100%",backfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden"},loadingIndicator:{position:"absolute",bottom:80,left:0,right:0,display:"flex",justifyContent:"center",zIndex:zIndices.base,pointerEvents:"none"},spinner:{width:24,height:24,borderWidth:2,borderStyle:"solid",borderColor:"rgba(255, 255, 255, 0.3)",borderTopColor:colors.text,borderRadius:radii.full,animation:"xhub-reel-spin 1s linear infinite"}},Ke=forwardRef(({videos:e,initialIndex:t=0,onLoadMore:n,onVideoChange:r,onLike:o,onComment:s,onShare:d,onAuthorClick:u,isLoading:l=false,hasMore:m=false,loadMoreThreshold:i=3,transitionDuration:a=zo,swipeThreshold:p=Wo,velocityThreshold:c=Go,gesturesDisabled:g=false,hapticEnabled:f=true,style:S,className:b=""},V)=>{let[L,h]=useState(()=>Math.min(Math.max(0,t),Math.max(0,e.length-1))),[y,P]=useState(false),[O,C]=useState(false),B=useRef(null),z=useRef(null),H=useRef(e),A=useRef(L),v=useRef(l),N=useRef(m),X=useRef(y),{setCurrentIndex:$}=Lt(),{setTranslateY:q,animateTo:K,snapBack:oe,viewportHeight:J}=ar({trackRef:z,transitionDuration:a,easing:$o});useEffect(()=>{H.current=e;},[e]),useEffect(()=>{A.current=L;},[L]),useEffect(()=>{v.current=l;},[l]),useEffect(()=>{N.current=m;},[m]),useEffect(()=>{X.current=y;},[y]),useEffect(()=>{if(e.length===0){h(0);return}if(L>=e.length){let I=e.length-1,U=e[I];h(I),$(I),U&&r?.(U,I);}},[e.length,L,$,r,e]);let x=useCallback(I=>or(I,L),[L]),w=useCallback(I=>{let U=H.current;N.current&&!v.current&&U.length-I<=i&&n?.();},[i,n]),k=useCallback(async(I,U=true)=>{if(X.current)return;let F=H.current,M=Math.max(0,Math.min(I,F.length-1)),ae=A.current;if(M===ae){q(0);return}let xe=M>ae?-1:1;if(U){P(true),C(true),await K(xe*J),h(M),$(M),q(0);let we=F[M];we&&r?.(we,M),w(M),C(false),P(false);}else {h(M),$(M),q(0);let we=F[M];we&&(r?.(we,M),w(M));}},[J,K,q,$,r,w]),R=useCallback((I=true)=>{let U=H.current,F=A.current;F<U.length-1&&k(F+1,I);},[k]),D=useCallback((I=true)=>{let U=A.current;U>0&&k(U-1,I);},[k]),E=useCallback((I,U,F)=>{let M=H.current,ae=A.current,xe=ae>0,we=ae<M.length-1,Xt=F;(U==="down"&&!xe||U==="up"&&!we)&&(Xt*=.3),q(Xt);},[q]),_=useCallback(async()=>{let I=H.current;if(!(A.current<I.length-1)){await oe();return}P(true),C(true),await K(-J);let M=A.current+1,ae=H.current;if(M<ae.length){h(M),$(M);let xe=ae[M];xe&&r?.(xe,M),w(M);}q(0),C(false),P(false);},[J,K,oe,q,$,r,w]),se=useCallback(async()=>{if(!(A.current>0)){await oe();return}P(true),C(true),await K(J);let F=A.current-1;if(F>=0){h(F),$(F);let M=H.current[F];M&&r?.(M,F);}q(0),C(false),P(false);},[J,K,oe,q,$,r]),ge=useCallback(async()=>{await oe();},[oe]),{bind:ur}=Ut({onSwipeUp:_,onSwipeDown:se,onSwipeProgress:E,onSwipeCancel:ge,threshold:p/J,velocityThreshold:c,hapticEnabled:f,disabled:g||y,enableProgressState:false});useImperativeHandle(V,()=>({slideTo:k,slideNext:R,slidePrev:D,get activeIndex(){return A.current},get totalSlides(){return H.current.length},get isBeginning(){return A.current===0},get isEnd(){return A.current===H.current.length-1}})),useEffect(()=>{let I=e[L];I&&r?.(I,L);},[]);let Ze=[];if(L>0&&Ze.push({index:L-1,position:-1}),Ze.push({index:L,position:0}),L<e.length-1&&Ze.push({index:L+1,position:1}),e.length===0)return jsx("div",{ref:B,style:Y(Se.container,S),className:b,"data-xhub-reel-feed":true,children:l&&jsx("div",{style:{...Se.loadingIndicator,top:"50%",bottom:"auto"},children:jsx("div",{style:Se.spinner})})});let cr={...Se.track};return jsxs("div",{ref:B,...ur(),style:Y(Se.container,S),className:b,"data-xhub-reel-feed":true,children:[jsx("style",{children:`
|
|
5
|
+
`}),jsx("div",{role:"status","aria-label":"Loading",style:mergeStyles({width:e,height:e,borderWidth:n,borderStyle:"solid",borderColor:`${t}30`,borderTopColor:t,borderRadius:"50%",animation:"xhub-reel-spin 1s linear infinite"},r),className:o})]})}var Oi={position:"fixed",left:spacing[4],right:spacing[4],zIndex:zIndices.toast,display:"flex",justifyContent:"center",pointerEvents:"none"},Hi={display:"flex",alignItems:"center",gap:spacing[3],padding:`${spacing[3]}px ${spacing[4]}px`,backgroundColor:colors.surface,borderRadius:radii.lg,boxShadow:"0 4px 12px rgba(0, 0, 0, 0.5)",pointerEvents:"auto",maxWidth:400},Di={default:{},success:{borderLeft:`3px solid ${colors.success}`},error:{borderLeft:`3px solid ${colors.error}`},warning:{borderLeft:`3px solid ${colors.warning}`}},Bi={flex:1,fontSize:fontSizes.sm,color:colors.text,lineHeight:1.4},Ni={padding:`${spacing[1]}px ${spacing[3]}px`,backgroundColor:"transparent",border:"none",color:colors.accent,fontSize:fontSizes.sm,fontWeight:600,cursor:"pointer",borderRadius:radii.sm};function An({message:e,isVisible:t,onClose:n,duration:r=3e3,variant:o="default",action:s,position:d="bottom",style:u,className:l=""}){useEffect(()=>{if(t&&r>0){let i=setTimeout(n,r);return ()=>clearTimeout(i)}},[t,r,n]);let m=d==="top"?{top:spacing[4]}:{bottom:spacing[4]+80};return jsx(AnimatePresence,{children:t&&jsx("div",{style:{...Oi,...m},children:jsxs(motion.div,{initial:{opacity:0,y:d==="top"?-20:20,scale:.95},animate:{opacity:1,y:0,scale:1},exit:{opacity:0,y:d==="top"?-20:20,scale:.95},transition:{type:"spring",...springs.default},style:mergeStyles(Hi,Di[o],u),className:l,children:[jsx("span",{style:Bi,children:e}),s&&jsx("button",{style:Ni,onClick:()=>{s.onClick(),n();},children:s.label})]})})})}var Wi={position:"absolute",pointerEvents:"none",zIndex:zIndices.overlay},Gi={filter:"drop-shadow(0 4px 8px rgba(255, 45, 85, 0.5))"};function ct(){let[e,t]=useState(false),[n,r]=useState({x:0,y:0}),o=useCallback((d,u)=>{let l=d??(typeof window<"u"?window.innerWidth/2:200),m=u??(typeof window<"u"?window.innerHeight/2:400);r({x:l,y:m}),t(true),setTimeout(()=>{t(false);},800);},[]),s=useCallback(()=>{t(false);},[]);return {isShowing:e,position:n,showHeart:o,hideHeart:s}}var $i=({size:e,color:t})=>jsx("svg",{style:Gi,xmlns:"http://www.w3.org/2000/svg",width:e,height:e,viewBox:"0 0 28 28",fill:t,children:jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M1.74988 11.0538C1.74988 6.75595 4.69822 2.91699 9.20877 2.91699C11.4347 2.91699 12.9986 3.9593 13.9999 4.96978C15.0011 3.95929 16.565 2.91699 18.791 2.91699C23.3015 2.91699 26.2499 6.75595 26.2499 11.0538C26.2499 15.3962 23.6265 18.9036 20.8781 21.3587C18.1288 23.8145 15.1442 25.3171 14.1843 25.6371L13.9999 25.6985L13.8154 25.6371C12.8555 25.3171 9.87093 23.8145 7.12168 21.3587C4.37329 18.9036 1.74988 15.3962 1.74988 11.0538ZM17.7449 6.41699C17.2617 6.41699 16.8699 6.80874 16.8699 7.29199C16.8699 7.77524 17.2617 8.16699 17.7449 8.16699C19.6221 8.16699 20.9952 9.75855 20.9952 11.8241C20.9952 12.3073 21.387 12.6991 21.8702 12.6991C22.3535 12.6991 22.7452 12.3073 22.7452 11.8241C22.7452 9.02543 20.8066 6.41699 17.7449 6.41699Z",fill:t})});function ht({show:e,position:t={x:0,y:0},size:n=100,color:r=colors.like,showParticles:o=true,particleCount:s=8,onComplete:d,style:u,className:l=""}){return jsx(AnimatePresence,{onExitComplete:d,children:e&&jsxs(motion.div,{initial:{opacity:0,scale:0},animate:{opacity:[0,1,1,0],scale:[0,1.3,1,.8],y:[0,-20,-20,-40]},exit:{scale:0,opacity:0},transition:{duration:.8,times:[0,.2,.6,1],ease:"easeOut"},style:{...Wi,left:t.x-n/2,top:t.y-n/2,width:n,height:n,...u},className:l,children:[jsx($i,{size:n,color:r}),o&&[...Array(s)].map((m,i)=>jsx(motion.div,{style:{position:"absolute",width:12,height:12,borderRadius:"50%",backgroundColor:r,left:n/2-6,top:n/2-6},initial:{opacity:1,scale:1},animate:{opacity:0,scale:.5,x:Math.cos(i*Math.PI*2/s)*60,y:Math.sin(i*Math.PI*2/s)*60},transition:{duration:.5,delay:.1,ease:"easeOut"}},i))]})})}function Dn(e){let[t,n]=useState(false),r=typeof document<"u"&&!!(document.fullscreenEnabled||document.webkitFullscreenElement!==void 0||document.mozFullScreenElement!==void 0||document.msFullscreenElement!==void 0),o=()=>{let i=document;return i.fullscreenElement||i.webkitFullscreenElement||i.mozFullScreenElement||i.msFullscreenElement||null},s=async i=>{let a=i;a.requestFullscreen?await a.requestFullscreen():a.webkitRequestFullscreen?await a.webkitRequestFullscreen():a.mozRequestFullScreen?await a.mozRequestFullScreen():a.msRequestFullscreen&&await a.msRequestFullscreen();},d=async()=>{let i=document;i.exitFullscreen?await i.exitFullscreen():i.webkitExitFullscreen?await i.webkitExitFullscreen():i.mozCancelFullScreen?await i.mozCancelFullScreen():i.msExitFullscreen&&await i.msExitFullscreen();};useEffect(()=>{let i=()=>{let a=o();n(a===e.current);};return document.addEventListener("fullscreenchange",i),document.addEventListener("webkitfullscreenchange",i),document.addEventListener("mozfullscreenchange",i),document.addEventListener("MSFullscreenChange",i),()=>{document.removeEventListener("fullscreenchange",i),document.removeEventListener("webkitfullscreenchange",i),document.removeEventListener("mozfullscreenchange",i),document.removeEventListener("MSFullscreenChange",i);}},[e]);let u=useCallback(async()=>{let i=e.current;if(!(!i||!r))try{await s(i),n(!0);let a=screen.orientation;if(a?.lock)try{await a.lock("landscape");}catch{}}catch(a){console.error("[useFullscreen] Failed to enter fullscreen:",a);}},[e,r]),l=useCallback(async()=>{if(r)try{await d(),n(!1);let i=screen.orientation;i?.unlock&&i.unlock();}catch(i){console.error("[useFullscreen] Failed to exit fullscreen:",i);}},[r]),m=useCallback(async()=>{t?await l():await u();},[t,u,l]);return {isFullscreen:t,isSupported:r,toggleFullscreen:m,enterFullscreen:u,exitFullscreen:l}}var Zi={feed:{autoQualitySwitch:true,pauseOnOffline:false,resumeOnOnline:false,lowQualityOn:"2g"},watch:{autoQualitySwitch:true,pauseOnOffline:false,resumeOnOnline:false,lowQualityOn:"2g"},auto:{autoQualitySwitch:true,pauseOnOffline:true,resumeOnOnline:true,lowQualityOn:"2g"},manual:{autoQualitySwitch:false,pauseOnOffline:false,resumeOnOnline:false}},Ji={aggressive:{autoPauseOnLowBattery:true,pauseThreshold:.2},moderate:{autoPauseOnLowBattery:true,pauseThreshold:.15},conservative:{autoPauseOnLowBattery:true,pauseThreshold:.1},manual:{autoPauseOnLowBattery:false}};function $e(e,t,n={}){let r=useRef(null),o=useRef(null),s=t??o,[d,u]=useState(false),l=mn(),m=gn(e),i=yn(e),a=vn(r.current),p=Dn(s),c=useRef(n);c.current=n;let{networkBehavior:g,powerBehavior:f}=n,S=useMemo(()=>{if(g)return typeof g=="string"?Zi[g]:g},[g]),b=useMemo(()=>{if(f)return typeof f=="string"?Ji[f]:f},[f]),V=useMemo(()=>({onStateChange:v=>{l.transition(v),c.current.onStateChange?.(v),v==="ready"&&!d&&(u(true),c.current.onReady?.());},onError:(v,N)=>{c.current.onError?.(v,N);},onTimeUpdate:(v,N)=>{c.current.onTimeUpdate?.(v,N);},onQualityLevelsLoaded:v=>{c.current.onQualityLevelsLoaded?.(v);},onNetworkChange:v=>{S?.onNetworkChange?.(v),c.current.onNetworkChange?.(v);},onPowerChange:v=>{b?.onPowerChange?.(v),c.current.onPowerChange?.(v);},onAnalyticsUpdate:v=>{c.current.onAnalyticsUpdate?.(v);}}),[l,d,S,b]);useEffect(()=>{let v=e.current;if(!v)return;let N=()=>c.current.onPlay?.(),X=()=>c.current.onPause?.(),$=()=>c.current.onEnded?.();return v.addEventListener("play",N),v.addEventListener("pause",X),v.addEventListener("ended",$),()=>{v.removeEventListener("play",N),v.removeEventListener("pause",X),v.removeEventListener("ended",$);}},[e]);let L=useCallback((v,N)=>{let X=e.current;if(!X){console.error("[usePlayer] No video element");return}u(false),r.current&&r.current.destroy(),r.current=new fn({preferNative:c.current.preferNative,enableSmoothTimeUpdates:c.current.enableSmoothTimeUpdates,enableNetworkAdaptation:c.current.enableNetworkAdaptation,enablePowerAdaptation:c.current.enablePowerAdaptation,enableAnalytics:c.current.enableAnalytics,preloadConfig:c.current.preloadConfig,callbacks:V,autoQualityOnNetworkChange:S?.autoQualitySwitch,autoPauseOnOffline:S?.pauseOnOffline,autoResumeOnOnline:S?.resumeOnOnline,lowQualityThreshold:S?.lowQualityOn,autoPauseOnLowBattery:b?.autoPauseOnLowBattery,lowBatteryThreshold:b?.pauseThreshold}),r.current.attach(X,v,N);},[e,V,S,b]),h=useCallback(()=>{r.current&&(r.current.destroy(),r.current=null),l.reset(),u(false);},[l]),y=useCallback(async()=>{await r.current?.play();},[]),P=useCallback(()=>{r.current?.pause();},[]),O=useCallback(async()=>{await r.current?.togglePlay();},[]),C=useCallback(v=>{r.current?.seek(v);},[]),B=useCallback((v=10)=>{r.current?.seekForward(v);},[]),z=useCallback((v=10)=>{r.current?.seekBackward(v);},[]),H=useCallback(v=>{r.current?.setPlaybackRate(v);},[]),A=useCallback(()=>{let v=e.current;v&&(v.currentTime=0,v.play().catch(()=>{}));},[e]);return {playerCore:r.current,videoRef:e,containerRef:s,state:l,isReady:d,play:y,pause:P,togglePlay:O,seek:C,seekForward:B,seekBackward:z,setPlaybackSpeed:H,restart:A,volume:m,progress:i,quality:a,fullscreen:p,attach:L,destroy:h}}var no={position:"relative",width:"100%",height:"100%",backgroundColor:colors.background},ro={width:"100%",height:"100%",objectFit:"contain"},_t=forwardRef(({video:e,autoPlay:t=true,muted:n=true,loop:r=true,poster:o,children:s,style:d,className:u="",onPlay:l,onPause:m,onEnded:i,onError:a,onStateChange:p,onTimeUpdate:c,onQualityLevelsLoaded:g,onReady:f},S)=>{let b=useRef(null),V=useRef(null),L=typeof e=="string"?e:e.url,h=o??(typeof e=="object"?e.thumbnail:void 0),y=$e(b,V,{onStateChange:p,onError:P=>a?.(P),onTimeUpdate:c,onQualityLevelsLoaded:g,onPlay:l,onPause:m,onEnded:i,onReady:f});return useEffect(()=>(L&&y.attach(L),()=>{y.destroy();}),[L]),useEffect(()=>{let P=b.current;P&&(P.muted=n,P.loop=r);},[n,r]),useEffect(()=>{let P=b.current;!P||!y.isReady||!t||P.play().catch(O=>{O.name==="NotAllowedError"&&(P.muted=true,P.play().catch(()=>{}));});},[t,y.isReady]),useImperativeHandle(S,()=>({play:y.play,pause:y.pause,togglePlay:y.togglePlay,seek:y.seek,seekForward:y.seekForward,seekBackward:y.seekBackward,restart:y.restart,setVolume:y.volume.setVolume,toggleMute:y.volume.toggleMute,setPlaybackSpeed:y.setPlaybackSpeed,setQuality:y.quality.setQuality,getQualityLevels:()=>y.quality.availableLevels,getVideoElement:()=>b.current,getCurrentTime:()=>y.progress.currentTime,getDuration:()=>y.progress.duration,isPaused:()=>b.current?.paused??true}),[y]),jsxs("div",{ref:V,style:Y(no,d),className:u,children:[jsx("video",{ref:b,poster:h,playsInline:true,preload:"auto",style:ro}),s]})});_t.displayName="VideoPlayer";var uo=30,co=1e3/uo,Z={container:{position:"absolute",bottom:0,left:0,right:0,zIndex:zIndices.sticky,touchAction:"none",userSelect:"none",WebkitUserSelect:"none",transition:"all 0.125s ease-in-out"},collapsed:{height:Ne.HEIGHT_DEFAULT,paddingInline:spacing[3],cursor:"pointer"},expanded:{padding:`${spacing[2]}px ${spacing[3]}px`,paddingBottom:`calc(${spacing[1]}px + env(safe-area-inset-bottom, 0px))`,background:"linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 100%)"},timeContainer:{display:"flex",justifyContent:"center",alignItems:"center",marginBottom:spacing[2]},timeText:{fontSize:fontSizes.sm,fontWeight:fontWeights.semibold,color:colors.text,textShadow:shadows.text,fontVariantNumeric:"tabular-nums",backgroundColor:"rgba(0, 0, 0, 0.6)",padding:`${spacing[1]}px ${spacing[3]}px`,borderRadius:radii.md},track:{position:"relative",width:"100%",backgroundColor:"rgba(255, 255, 255, 0.2)",borderRadius:radii.full,overflow:"hidden"},trackCollapsed:{height:Ne.HEIGHT_DEFAULT},trackExpanded:{height:Ne.HEIGHT_ACTIVE},buffer:{position:"absolute",top:0,left:0,height:"100%",backgroundColor:"rgba(255, 255, 255, 0.3)",borderRadius:radii.full},progress:{position:"absolute",top:0,left:0,height:"100%",backgroundColor:colors.text,borderRadius:radii.full},scrubber:{position:"absolute",top:"50%",width:16,height:16,marginLeft:-8,marginTop:-8,backgroundColor:colors.text,borderRadius:radii.full,boxShadow:"0 2px 4px rgba(0,0,0,0.3)",transform:"scale(0)",transition:"transform 150ms ease"},scrubberVisible:{transform:"scale(1)"},touchArea:{position:"absolute",top:-12,left:0,right:0,bottom:-12,cursor:"pointer"}};function ye(e){if(!isFinite(e)||isNaN(e))return "0:00";let t=Math.floor(e/60),n=Math.floor(e%60);return `${t}:${n.toString().padStart(2,"0")}`}function ho(e){if(e.buffered.length===0)return 0;for(let t=0;t<e.buffered.length;t++)if(e.buffered.start(t)<=e.currentTime&&e.buffered.end(t)>=e.currentTime)return e.buffered.end(t);return e.buffered.end(e.buffered.length-1)}var pt=forwardRef(({videoRef:e,expanded:t=false,onSeekStart:n,onSeek:r,onSeekEnd:o,onExpandedChange:s,style:d,className:u=""},l)=>{let m=useRef(null),i=useRef(null),a=useRef(null),p=useRef(null),c=useRef(null),g=useRef(0),[f,S]=useState({currentTime:0,duration:0}),b=useRef(null),V=useRef(0),L=useRef(0),h=useRef(false),y=useRef(t);useEffect(()=>{y.current=t;},[t]);let P=useCallback(x=>{let w=e.current;if(!w||h.current)return;let k=w.duration||0,R=w.currentTime||0,D=ho(w),E=k>0?R/k*100:0,_=k>0?D/k*100:0;i.current&&(i.current.style.width=`${E}%`),a.current&&(a.current.style.width=`${_}%`),p.current&&y.current&&(p.current.style.left=`${E}%`),g.current=k,c.current&&(c.current.textContent=`${ye(R)} / ${ye(k)}`);let se=x??performance.now();se-L.current>=500&&(L.current=se,S(ge=>Math.abs(ge.currentTime-R)>=.5||ge.duration!==k?{currentTime:Math.floor(R),duration:Math.floor(k)}:ge));},[e]),O=useCallback(x=>{x-V.current>=co&&(V.current=x,P()),b.current=requestAnimationFrame(O);},[P]);useEffect(()=>(b.current=requestAnimationFrame(O),()=>{b.current&&cancelAnimationFrame(b.current);}),[O]);let C=useCallback(x=>{let w=m.current,k=e.current;if(!w||!k)return 0;let R=w.getBoundingClientRect(),D=x-R.left;return Math.max(0,Math.min(1,D/R.width))*(k.duration||0)},[e]),B=useCallback(x=>{h.current=true,n?.();let w=C(x);r?.(w);let k=e.current;if(k&&i.current){let R=k.duration||g.current||1,D=w/R*100;i.current.style.width=`${D}%`,p.current&&(p.current.style.left=`${D}%`),c.current&&(c.current.textContent=`${ye(w)} / ${ye(R)}`);}},[C,r,n,e]),z=useCallback(x=>{if(!h.current)return;let w=C(x);r?.(w);let k=e.current;if(k&&i.current){let R=k.duration||g.current||1,D=w/R*100;i.current.style.width=`${D}%`,p.current&&(p.current.style.left=`${D}%`),c.current&&(c.current.textContent=`${ye(w)} / ${ye(R)}`);}},[C,r,e]),H=useCallback(x=>{if(!h.current)return;h.current=false;let w=C(x);o?.(w);let k=e.current;k&&(k.currentTime=w);},[C,o,e]),A=useCallback(x=>{let w=x.touches[0];w&&B(w.clientX);},[B]),v=useCallback(x=>{let w=x.touches[0];w&&z(w.clientX);},[z]),N=useCallback(x=>{let w=x.changedTouches[0];w&&H(w.clientX);},[H]),X=useCallback(x=>{B(x.clientX);let w=R=>z(R.clientX),k=R=>{H(R.clientX),document.removeEventListener("mousemove",w),document.removeEventListener("mouseup",k);};document.addEventListener("mousemove",w),document.addEventListener("mouseup",k);},[B,z,H]),$=useCallback(()=>{t||s?.(true);},[t,s]),q=useCallback(x=>{let w=e.current;if(!w)return;let k=w.duration||0,R=w.currentTime||0,D=R;switch(x.key){case "ArrowLeft":D=Math.max(0,R-5);break;case "ArrowRight":D=Math.min(k,R+5);break;case "ArrowUp":D=Math.min(k,R+10);break;case "ArrowDown":D=Math.max(0,R-10);break;case "Home":D=0;break;case "End":D=k;break;default:return}x.preventDefault(),w.currentTime=D,r?.(D),P();},[e,r,P]);useImperativeHandle(l,()=>({update:P,setExpanded:x=>{s?.(x);}}));let K={...Z.container,...t?Z.expanded:Z.collapsed,...d},oe={...Z.track,...t?Z.trackExpanded:Z.trackCollapsed},J={...Z.scrubber,...t?Z.scrubberVisible:{}};return jsxs("div",{ref:m,style:K,className:u,onClick:t?void 0:$,onTouchStart:A,onTouchMove:v,onTouchEnd:N,onTouchCancel:N,onMouseDown:X,onKeyDown:q,role:"slider","aria-label":"Video progress","aria-valuemin":0,"aria-valuemax":f.duration,"aria-valuenow":f.currentTime,"aria-valuetext":`${ye(f.currentTime)} of ${ye(f.duration)}`,tabIndex:0,children:[t&&jsx("div",{style:Z.timeContainer,children:jsx("span",{ref:c,style:Z.timeText,children:"0:00 / 0:00"})}),jsxs("div",{style:oe,"aria-hidden":"true",children:[jsx("div",{style:Z.touchArea}),jsx("div",{ref:a,style:Z.buffer}),jsx("div",{ref:i,style:Z.progress}),t&&jsx("div",{ref:p,style:J})]})]})});pt.displayName="Timeline";var po={DOUBLE_TAP_DELAY:200},fo={THRESHOLD:500},qe={VERTICAL_THRESHOLD:.3,HORIZONTAL_THRESHOLD:.4,MIN_VELOCITY:.5},ft={THRESHOLD:10};var ve={TAP_DELAY:po.DOUBLE_TAP_DELAY,LONG_PRESS_THRESHOLD:fo.THRESHOLD,SWIPE_VERTICAL_THRESHOLD:qe.VERTICAL_THRESHOLD,SWIPE_HORIZONTAL_THRESHOLD:qe.HORIZONTAL_THRESHOLD,DRAG_THRESHOLD:ft.THRESHOLD};function Un(){return typeof navigator<"u"&&"vibrate"in navigator}function mt(){Un()&&navigator.vibrate(10);}function Qn(){Un()&&navigator.vibrate(20);}function zn(e,t){let n=e.currentTarget||e.target;if(!n||typeof n.getBoundingClientRect!="function")return "center";let r=n.getBoundingClientRect(),o=e.clientX-r.left,s=r.width;if(s===0)return "center";let d=s*.33,u=s*.67;return o<d?"left":o>u?"right":"center"}function gt(e){let t=useRef(0),n=useRef("center"),r=useRef(null),o=useRef(null),s=useRef(false),d=useRef(false),u=useRef({x:0,y:0}),l=useCallback(i=>{if(d.current){d.current=false;return}let a=zn(i),p=Date.now(),c=p-t.current,g={x:i.clientX,y:i.clientY};c<ve.TAP_DELAY&&n.current===a?(r.current&&(clearTimeout(r.current),r.current=null),mt(),e.onDoubleTap?.(a,g)):r.current=setTimeout(()=>{e.onSingleTap?.(a),r.current=null;},ve.TAP_DELAY),t.current=p,n.current=a;},[e]);return useGesture({onPointerDown:({event:i})=>{let a=i;u.current={x:a.clientX,y:a.clientY},d.current=false;let p=setTimeout(()=>{s.current=true,e.onHoldStart?.();},150);o.current=setTimeout(()=>{d.current=true,Qn();let g=a.target.getBoundingClientRect();e.onLongPress?.({x:a.clientX-g.left,y:a.clientY-g.top});},ve.LONG_PRESS_THRESHOLD),i.target.dataset.holdTimeout=String(p);},onPointerUp:({event:i})=>{let a=i.target.dataset.holdTimeout;a&&clearTimeout(Number(a)),o.current&&(clearTimeout(o.current),o.current=null),s.current&&(s.current=false,e.onHoldEnd?.());},onPointerMove:({event:i})=>{let a=i,p=Math.abs(a.clientX-u.current.x),c=Math.abs(a.clientY-u.current.y);(p>10||c>10)&&o.current&&(clearTimeout(o.current),o.current=null);},onClick:({event:i})=>{l(i);},onDrag:({movement:[i,a],direction:[p,c],velocity:[g,f],last:S,event:b})=>{if(b.preventDefault(),!S)return;let V=window.innerWidth,L=window.innerHeight;if(Math.abs(a)>L*ve.SWIPE_VERTICAL_THRESHOLD){c>0?e.onSwipeDown?.():e.onSwipeUp?.();return}if(Math.abs(i)>V*ve.SWIPE_HORIZONTAL_THRESHOLD){p>0?e.onSwipeRight?.():e.onSwipeLeft?.();return}Math.abs(i)>ve.DRAG_THRESHOLD&&Math.abs(g)>Math.abs(f)&&e.onSeekDrag?.(i);}},{drag:{threshold:ve.DRAG_THRESHOLD,filterTaps:true},eventOptions:{passive:false}})}var So=800,wo=.05,Po=.95;function Ut({onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r,threshold:o=qe.VERTICAL_THRESHOLD,velocityThreshold:s=qe.MIN_VELOCITY,hapticEnabled:d=true,disabled:u=false,enableProgressState:l=false}={}){let m=Math.max(wo,Math.min(Po,o)),[i,a]=useState({progress:0,direction:null,isSwiping:false}),p=useRef({onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r}),c=useRef(typeof window<"u"?window.innerHeight:So);return p.current={onSwipeUp:e,onSwipeDown:t,onSwipeProgress:n,onSwipeCancel:r},useEffect(()=>{let f=()=>{c.current=window.innerHeight;},S=()=>{setTimeout(()=>{c.current=window.innerHeight;},100);};return window.addEventListener("resize",f,{passive:true}),window.addEventListener("orientationchange",S,{passive:true}),()=>{window.removeEventListener("resize",f),window.removeEventListener("orientationchange",S);}},[]),{bind:useDrag(({movement:[,f],velocity:[,S],active:b,cancel:V})=>{if(u){V?.();return}let h=c.current*m,y=Math.min(1,Math.abs(f)/h),P=f<0?"up":"down";if(b)p.current.onSwipeProgress?.(y,P,f),l&&a({progress:y,direction:P,isSwiping:true});else {let O=Math.abs(f)>=h,C=Math.abs(S)>=s;O||C?(d&&mt(),P==="up"?p.current.onSwipeUp?.():p.current.onSwipeDown?.()):p.current.onSwipeCancel?.(),a({progress:0,direction:null,isSwiping:false});}},{axis:"y",threshold:ft.THRESHOLD,filterTaps:true,pointer:{touch:true},eventOptions:{passive:true}}),...i}}var Oe={container:{position:"relative",width:"100%",height:"100%",backgroundColor:colors.background},video:{position:"absolute",inset:0,width:"100%",height:"100%",objectFit:"cover"},placeholder:{position:"absolute",inset:0,backgroundSize:"cover",backgroundPosition:"center"},tapArea:{zIndex:zIndices.base},pauseOverlay:{zIndex:zIndices.overlay},pauseIconWrapper:{borderRadius:radii.full,transition:`opacity ${durations.normal}ms ${easings.xhubReel}, transform ${durations.normal}ms ${easings.xhubReel}`}};var Qt=createContext(null);function pe(){let e=useContext(Qt);if(!e)throw new Error("VideoFeedItem compound components must be used within a VideoFeedItem");return e}function Gn({elementRef:e,activateThreshold:t=Je.ACTIVATION_THRESHOLD,deactivateThreshold:n=Je.DEACTIVATION_THRESHOLD,rootMargin:r="0px",onVisibilityChange:o}){let[s,d]=useState(false),[u,l]=useState(false),[m,i]=useState(0),a=useRef(null);return useEffect(()=>{let p=e.current;if(!p)return;a.current&&a.current.disconnect();let c=[0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1];return a.current=new IntersectionObserver(g=>{g.forEach(f=>{let S=f.intersectionRatio;i(S),d(S>0),S>=t?l(true):S<n&&l(false),o?.(S>0,S);});},{threshold:c,rootMargin:r}),a.current.observe(p),()=>{a.current?.disconnect();}},[e,t,n,r,o]),{isVisible:s,isActive:u,visibilityRatio:m}}function qn({containerRef:e,videoRef:t,isCurrentVideo:n=false,onActivate:r,onDeactivate:o,autoActivate:s=true,trackVisibility:d=false,onVisibilityChange:u}){let l=useRef(false),{isVisible:m,isActive:i,visibilityRatio:a}=Gn({elementRef:e??{current:null},onVisibilityChange:d?u:void 0}),p=d?i:n;useEffect(()=>{s&&(p&&!l.current?(l.current=true,r?.()):!p&&l.current&&(l.current=false,o?.()));},[p,r,o,s]);let c=useCallback(()=>{let f=t.current;f&&f.play().catch(()=>{f.muted=true,f.play().catch(()=>{});}),r?.();},[t,r]),g=useCallback(()=>{let f=t.current;f&&(f.pause(),f.currentTime=0),o?.();},[t,o]);return {isActive:p,isVisible:d?m:n,visibilityRatio:d?a:n?1:0,activate:c,deactivate:g}}var Wt=class{entries=new Map;listeners=new Set;memoryWarningThreshold;constructor(){this.memoryWarningThreshold=Re.MAX_TOTAL_MEMORY/(1024*1024),this.setupMemoryPressureListener();}register(t,n=10){this.entries.set(t,{videoId:t,inDom:false,hasDecodedFrames:false,estimatedSizeMB:n,lastAccessed:Date.now()}),this.notifyListeners();}unregister(t){this.entries.delete(t),this.notifyListeners();}setInDom(t,n){let r=this.entries.get(t);r&&(r.inDom=n,r.lastAccessed=Date.now(),this.notifyListeners());}setHasDecodedFrames(t,n){let r=this.entries.get(t);r&&(r.hasDecodedFrames=n,r.lastAccessed=Date.now(),this.notifyListeners());}getState(){let t=0,n=0,r=0;return this.entries.forEach(o=>{o.inDom&&t++,o.hasDecodedFrames&&n++,r+=o.estimatedSizeMB;}),{videosInDom:t,decodedVideos:n,estimatedMemoryMB:r,isLowMemory:r>this.memoryWarningThreshold}}getVideosToDispose(){let t=this.getState(),n=[],r=Re?.MAX_VIDEOS_IN_DOM,o=Re?.MAX_DECODED_FRAMES,s=Array.from(this.entries.values()).sort((d,u)=>d.lastAccessed-u.lastAccessed);if(t.videosInDom>r){let d=t.videosInDom-r,u=0;for(let l of s){if(u>=d)break;l.inDom&&(n.push(l.videoId),u++);}}if(t.decodedVideos>o){let d=t.decodedVideos-o,u=0;for(let l of s){if(u>=d)break;l.hasDecodedFrames&&!n.includes(l.videoId)&&(n.push(l.videoId),u++);}}return n}subscribe(t){return this.listeners.add(t),()=>this.listeners.delete(t)}forceCleanup(){let t=this.getVideosToDispose();return t.forEach(n=>this.unregister(n)),t}notifyListeners(){let t=this.getState();this.listeners.forEach(n=>n(t));}setupMemoryPressureListener(){typeof window>"u"||"memory"in performance&&setInterval(()=>{this.getState().isLowMemory&&(console.warn("[MemoryManager] Low memory warning, forcing cleanup"),this.forceCleanup());},5e3);}},be=new Wt;function jn({videoId:e,estimatedSizeMB:t=10,onShouldDispose:n}){let[r,o]=useState(()=>be.getState()),[s,d]=useState(false);useEffect(()=>(be.register(e,t),()=>{be.unregister(e);}),[e,t]),useEffect(()=>be.subscribe(i=>{o(i);let p=be.getVideosToDispose().includes(e);p&&!s?(d(true),n?.()):!p&&s&&d(false);}),[e,s,n]);let u=useCallback(m=>{be.setInDom(e,m);},[e]),l=useCallback(m=>{be.setHasDecodedFrames(e,m);},[e]);return {memoryState:r,setInDom:u,setHasDecodedFrames:l,shouldDispose:s}}function Jn({video:e,isActive:t,priority:n,onLike:r,onComment:o,onShare:s,onAuthorClick:d}){let u=useRef(null),l=useRef(null),m=useRef(false),[i,a]=useState(false),[p,c]=useState(false),[g,f]=useState(false),{isShowing:S,position:b,showHeart:V}=ct(),L=useMemo(()=>({maxConcurrent:2,maxBufferSize:10*1024*1024,priorityLevels:10}),[]),h=useCallback(E=>{},[]),y=useCallback(E=>{},[]),P=useCallback(E=>{E.startupTime&&E.startupTime>1e3&&console.warn("[VideoFeedItem] Slow startup:",E.startupTime,"ms",e.id);},[e.id]),{state:O}=$e(l,u,{preferNative:true,enableSmoothTimeUpdates:true,networkBehavior:"feed",powerBehavior:"moderate",preloadConfig:L,enableAnalytics:true,onPlay:()=>{a(false),c(false);},onPause:()=>{l.current?.seeking||(a(true),c(true));},onNetworkChange:h,onPowerChange:y,onAnalyticsUpdate:P}),C=useCallback(async()=>{let E=l.current;if(E){E.muted=true;try{await E.play();}catch(_){console.warn("[VideoFeedItem] Play failed:",_.message);}}},[]),B=useCallback(()=>{let E=l.current;E&&E.pause();},[]),z=useCallback(E=>{let _=l.current;_&&(_.currentTime=E);},[]),[H,A]=useState(false);useEffect(()=>{let E=l.current;if(!E)return;let _=()=>A(true),se=()=>A(false),ge=()=>A(false);return E.addEventListener("play",_),E.addEventListener("pause",se),E.addEventListener("ended",ge),A(!E.paused),()=>{E.removeEventListener("play",_),E.removeEventListener("pause",se),E.removeEventListener("ended",ge);}},[e.id]);let v=H||O.state==="playing",{setInDom:N,setHasDecodedFrames:X,shouldDispose:$}=jn({videoId:e.id,onShouldDispose:()=>{B(),l.current&&(l.current.src="",l.current.load());}}),q=!$&&n!=="none",K=useRef(false);qn({videoRef:l,isCurrentVideo:t,onActivate:()=>{console.log("[VideoFeedItem] onActivate called, videoRef:",l.current?.src),X(true),l.current?C():(console.log("[VideoFeedItem] Video element not ready, marking pending play"),K.current=true);},onDeactivate:()=>{console.log("[VideoFeedItem] onDeactivate called"),K.current=false,X(false),B(),z(0);},autoActivate:true}),useEffect(()=>{l.current&&K.current&&t&&(console.log("[VideoFeedItem] Video element now available, executing pending play"),K.current=false,C());}),useEffect(()=>(N(true),()=>N(false)),[N]),useEffect(()=>{let E=l.current;if(!E)return;f(false);let _=()=>{console.log("[VideoFeedItem] Video loadeddata:",e.id,{isActive:t,priority:n}),n==="high"&&!t?requestAnimationFrame(()=>{E.readyState>=2&&(E.currentTime=.01,f(true),console.log("[VideoFeedItem] First frame decoded (preloaded):",e.id));}):t&&f(true);},se=()=>{n==="high"&&!g&&f(true);};return E.addEventListener("loadeddata",_),E.addEventListener("canplay",se),E.readyState>=2&&_(),()=>{E.removeEventListener("loadeddata",_),E.removeEventListener("canplay",se);}},[e.id,t,n,g]),useEffect(()=>{console.log("[VideoFeedItem] State:",{videoId:e.id,isActive:t,priority:n,shouldRenderVideo:q,hasVideoElement:!!l.current,videoSrc:l.current?.src});},[e.id,t,n,q]);let oe=useMemo(()=>{switch(n){case "high":return "auto";case "medium":return "metadata";case "low":case "metadata":return "none";default:return "none"}},[n]),J=useCallback(()=>{m.current=v,c(true),a(false),B();},[v,B]),x=useCallback(E=>{z(E),m.current?(C(),c(false)):a(true);},[z,C]),w=useCallback(()=>{v?B():C();},[v,C,B]),k=useCallback((E,_)=>{V(_.x,_.y),r?.();},[V,r]),R=useCallback(()=>{},[]),D=gt({onSingleTap:w,onDoubleTap:k,onLongPress:R});return {video:e,isActive:t,shouldRenderVideo:q,preload:oe,isPreloaded:g,containerRef:u,videoRef:l,isPlaying:v,showPauseOverlay:i,timelineExpanded:p,play:C,pause:B,seek:z,setShowPauseOverlay:a,setTimelineExpanded:c,gestureBindings:D,showHeart:S,heartPosition:b,triggerHeart:V,onLike:r,onComment:o,onShare:s,onAuthorClick:d,handleSeekStart:J,handleSeekEnd:x}}var bt=forwardRef(({placeholder:e,...t},n)=>{let{video:r,videoRef:o,shouldRenderVideo:s,preload:d,isPreloaded:u}=pe();if(!s)return e??jsx("div",{...t,style:{...Oe.placeholder,backgroundImage:`url(${r.thumbnail})`,...t.style}});let l=!u;return jsx("video",{ref:m=>{typeof n=="function"?n(m):n&&(n.current=m),o.current=m;},src:r.url,poster:l?r.thumbnail:void 0,preload:d,loop:true,playsInline:true,muted:true,style:Oe.video})});bt.displayName="VideoFeedItemPlayer";var St=forwardRef(({onLike:e,onComment:t,onShare:n,...r},o)=>{let{video:s,onLike:d,onComment:u,onShare:l}=pe();return jsx("div",{ref:o,...r,children:jsx(st,{avatarUrl:s.author.avatar,likeCount:s.stats.likes,commentCount:s.stats.comments,shareCount:s.stats.shares,isLiked:s.isLiked,onLike:e??d,onComment:t??u,onShare:n??l})})});St.displayName="VideoFeedItemActions";var wt=forwardRef(({expanded:e,...t},n)=>{let{videoRef:r,shouldRenderVideo:o,timelineExpanded:s,setTimelineExpanded:d,handleSeekStart:u,handleSeekEnd:l}=pe();return o?jsx("div",{ref:n,...t,children:jsx(pt,{videoRef:r,expanded:e??s,onSeekStart:u,onSeekEnd:l,onExpandedChange:d})}):null});wt.displayName="VideoFeedItemTimeline";var He={container:{position:"absolute",bottom:0,left:0,right:64,padding:spacing[4],paddingBottom:"env(safe-area-inset-bottom, 16px)",zIndex:zIndices.base},containerWithTimeline:{paddingBottom:"calc(env(safe-area-inset-bottom, 16px) + 48px)"},authorButton:{gap:spacing[2],marginBottom:spacing[3]},avatar:{borderRadius:radii.full,border:`2px solid ${colors.text}`},username:{color:colors.text,fontWeight:fontWeights.semibold,fontSize:fontSizes.sm,textShadow:shadows.text},caption:{color:colors.text,fontSize:fontSizes.sm,lineHeight:1.4,textShadow:shadows.text,display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",paddingBottom:spacing[1]},author:{color:colors.text,fontSize:fontSizes.sm,fontWeight:fontWeights.semibold,textShadow:shadows.text,display:"-webkit-box",WebkitLineClamp:1,WebkitBoxOrient:"vertical",overflow:"hidden",paddingBottom:spacing[1]},hashtags:{display:"flex",flexWrap:"wrap",gap:spacing[1],marginTop:spacing[2],paddingBottom:spacing[1]},hashtag:{color:colors.accent,fontSize:fontSizes.sm,fontWeight:fontWeights.medium,textShadow:shadows.text}};function ir({video:e,timelineExpanded:t=false,style:n,className:r=""}){let o=Y(He.container,t&&He.containerWithTimeline,n);return jsxs("div",{style:o,className:r,children:[e.author&&jsx("p",{style:He.author,children:e.author.displayName}),e.caption&&jsx("p",{style:He.caption,children:e.caption}),e.hashtags&&e.hashtags.length>0&&jsx("div",{style:He.hashtags,children:e.hashtags.slice(0,3).map((s,d)=>jsxs("span",{style:He.hashtag,children:["#",s]},d))})]})}var Pt=forwardRef(({showPlayPause:e=true,showDoubleTapHeart:t=true,showVideoInfo:n=true,...r},o)=>{let{video:s,isPlaying:d,showPauseOverlay:u,timelineExpanded:l,showHeart:m,heartPosition:i,onAuthorClick:a}=pe();return jsxs("div",{ref:o,...r,children:[e&&jsx(lt,{isPlaying:d,show:u,size:64,autoHideDelay:800,showOnStateChange:false}),t&&jsx(ht,{show:m,position:i,size:100,showParticles:true,particleCount:8}),n&&jsx(ir,{video:s,onAuthorClick:a,timelineExpanded:l})]})});Pt.displayName="VideoFeedItemOverlay";var Be=forwardRef(({video:e,isActive:t=false,priority:n="none",showTimeline:r=true,onLike:o,onComment:s,onShare:d,onAuthorClick:u,style:l,className:m="",children:i},a)=>{let p=Jn({video:e,isActive:t,priority:n,onLike:o,onComment:s,onShare:d,onAuthorClick:u}),c=i??jsxs(Fragment,{children:[jsx(bt,{}),jsx(Pt,{}),jsx(St,{}),r&&jsx(wt,{})]});return jsx(Qt.Provider,{value:p,children:jsx("div",{ref:g=>{typeof a=="function"?a(g):a&&(a.current=g),p.containerRef.current=g;},style:Y(Oe.container,l),className:m,...p.gestureBindings(),children:c})})});Be.displayName="VideoFeedItem";function or(e,t){let n=e-t;return n===0||n===-1||n===1?"high":n===2?"medium":n===3?"low":Math.abs(n)<=5?"metadata":"none"}var Do="cubic-bezier(0.32, 0.72, 0, 1)",Bo=300,No=800,_o=50;function ar({trackRef:e,transitionDuration:t=Bo,easing:n=Do,onTransitionEnd:r}){let o=useRef(typeof window<"u"?window.innerHeight:No),s=useRef(0),d=useRef(null),u=useRef(false),l=useRef(true);useEffect(()=>{let c=()=>{o.current=window.innerHeight;},g=()=>{setTimeout(()=>{o.current=window.innerHeight;},100);};return window.addEventListener("resize",c,{passive:true}),window.addEventListener("orientationchange",g,{passive:true}),()=>{window.removeEventListener("resize",c),window.removeEventListener("orientationchange",g);}},[]);let m=useCallback(c=>{s.current=c,d.current!==null&&cancelAnimationFrame(d.current),d.current=requestAnimationFrame(()=>{let g=e.current;g&&(g.style.transition="none",g.style.transform=`translateY(${c}px)`),d.current=null;});},[e]),i=useCallback(c=>new Promise(g=>{let f=e.current;if(!f||!l.current){g();return}if(u.current){g();return}u.current=true,s.current=c;let S=null,b=null,V=L=>{L.propertyName==="transform"&&(S?.(),l.current&&(u.current=false,r?.()),g());};S=()=>{f.removeEventListener("transitionend",V),b&&(clearTimeout(b),b=null);},f.addEventListener("transitionend",V),b=setTimeout(()=>{S?.(),l.current&&u.current&&(u.current=false,r?.()),g();},t+_o),f.offsetHeight,f.style.transition=`transform ${t}ms ${n}`,f.style.transform=`translateY(${c}px)`;}),[e,t,n,r]),a=useCallback(()=>i(0),[i]),p=useCallback(()=>s.current,[]);return useEffect(()=>(l.current=true,()=>{l.current=false,d.current!==null&&(cancelAnimationFrame(d.current),d.current=null);}),[]),{setTranslateY:m,animateTo:i,snapBack:a,getCurrentY:p,viewportHeight:o.current,isAnimating:u.current}}var zo=300,Wo=50,Go=.3,$o="cubic-bezier(0.32, 0.72, 0, 1)",Se={container:{position:"fixed",inset:0,overflow:"hidden",backgroundColor:colors.background,touchAction:"none",userSelect:"none",WebkitUserSelect:"none"},track:{position:"relative",width:"100%",height:"100%",willChange:"transform"},slide:{position:"absolute",left:0,width:"100%",height:"100%",backfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden"},loadingIndicator:{position:"absolute",bottom:80,left:0,right:0,display:"flex",justifyContent:"center",zIndex:zIndices.base,pointerEvents:"none"},spinner:{width:24,height:24,borderWidth:2,borderStyle:"solid",borderColor:"rgba(255, 255, 255, 0.3)",borderTopColor:colors.text,borderRadius:radii.full,animation:"xhub-reel-spin 1s linear infinite"}},Ke=forwardRef(({videos:e,initialIndex:t=0,onLoadMore:n,onVideoChange:r,onLike:o,onComment:s,onShare:d,onAuthorClick:u,isLoading:l=false,hasMore:m=false,loadMoreThreshold:i=3,transitionDuration:a=zo,swipeThreshold:p=Wo,velocityThreshold:c=Go,gesturesDisabled:g=false,hapticEnabled:f=true,style:S,className:b=""},V)=>{let[L,h]=useState(()=>Math.min(Math.max(0,t),Math.max(0,e.length-1))),[y,P]=useState(false),[O,C]=useState(false),B=useRef(null),z=useRef(null),H=useRef(e),A=useRef(L),v=useRef(l),N=useRef(m),X=useRef(y),{setCurrentIndex:$}=Lt(),{setTranslateY:q,animateTo:K,snapBack:oe,viewportHeight:J}=ar({trackRef:z,transitionDuration:a,easing:$o});useEffect(()=>{H.current=e;},[e]),useEffect(()=>{A.current=L;},[L]),useEffect(()=>{v.current=l;},[l]),useEffect(()=>{N.current=m;},[m]),useEffect(()=>{X.current=y;},[y]),useEffect(()=>{if(e.length===0){h(0);return}if(L>=e.length){let I=e.length-1,U=e[I];h(I),$(I),U&&r?.(U,I);}},[e.length,L,$,r,e]);let x=useCallback(I=>or(I,L),[L]),w=useCallback(I=>{let U=H.current;N.current&&!v.current&&U.length-I<=i&&n?.();},[i,n]),k=useCallback(async(I,U=true)=>{if(X.current)return;let F=H.current,M=Math.max(0,Math.min(I,F.length-1)),ae=A.current;if(M===ae){q(0);return}let xe=M>ae?-1:1;if(U){P(true),C(true),await K(xe*J),h(M),$(M),q(0);let we=F[M];we&&r?.(we,M),w(M),C(false),P(false);}else {h(M),$(M),q(0);let we=F[M];we&&(r?.(we,M),w(M));}},[J,K,q,$,r,w]),R=useCallback((I=true)=>{let U=H.current,F=A.current;F<U.length-1&&k(F+1,I);},[k]),D=useCallback((I=true)=>{let U=A.current;U>0&&k(U-1,I);},[k]),E=useCallback((I,U,F)=>{let M=H.current,ae=A.current,xe=ae>0,we=ae<M.length-1,Xt=F;(U==="down"&&!xe||U==="up"&&!we)&&(Xt*=.3),q(Xt);},[q]),_=useCallback(async()=>{let I=H.current;if(!(A.current<I.length-1)){await oe();return}P(true),C(true),await K(-J);let M=A.current+1,ae=H.current;if(M<ae.length){h(M),$(M);let xe=ae[M];xe&&r?.(xe,M),w(M);}q(0),C(false),P(false);},[J,K,oe,q,$,r,w]),se=useCallback(async()=>{if(!(A.current>0)){await oe();return}P(true),C(true),await K(J);let F=A.current-1;if(F>=0){h(F),$(F);let M=H.current[F];M&&r?.(M,F);}q(0),C(false),P(false);},[J,K,oe,q,$,r]),ge=useCallback(async()=>{await oe();},[oe]),{bind:ur}=Ut({onSwipeUp:_,onSwipeDown:se,onSwipeProgress:E,onSwipeCancel:ge,threshold:p/J,velocityThreshold:c,hapticEnabled:f,disabled:g||y,enableProgressState:false});useImperativeHandle(V,()=>({slideTo:k,slideNext:R,slidePrev:D,get activeIndex(){return A.current},get totalSlides(){return H.current.length},get isBeginning(){return A.current===0},get isEnd(){return A.current===H.current.length-1}})),useEffect(()=>{let I=e[L];I&&r?.(I,L);},[]);let Ze=[];if(L>0&&Ze.push({index:L-1,position:-1}),Ze.push({index:L,position:0}),L<e.length-1&&Ze.push({index:L+1,position:1}),e.length===0)return jsx("div",{ref:B,style:Y(Se.container,S),className:b,"data-xhub-reel-feed":true,children:l&&jsx("div",{style:{...Se.loadingIndicator,top:"50%",bottom:"auto"},children:jsx("div",{style:Se.spinner})})});let cr={...Se.track};return jsxs("div",{ref:B,...ur(),style:Y(Se.container,S),className:b,"data-xhub-reel-feed":true,children:[jsx("style",{children:`
|
|
6
6
|
@keyframes xhub-reel-spin {
|
|
7
7
|
to { transform: rotate(360deg); }
|
|
8
8
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xhub-reel/embed",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"description": "Embeddable widget for XHubReel",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "XHubReel Team",
|
|
@@ -35,15 +35,15 @@
|
|
|
35
35
|
}
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@xhub-reel/core": "0.
|
|
38
|
+
"@xhub-reel/core": "0.2.0",
|
|
39
39
|
"@xhub-reel/design-tokens": "0.0.2",
|
|
40
|
-
"@xhub-reel/feed": "0.
|
|
41
|
-
"@xhub-reel/gestures": "0.
|
|
42
|
-
"@xhub-reel/player": "0.1.0",
|
|
43
|
-
"@xhub-reel/player-core": "0.0.2",
|
|
40
|
+
"@xhub-reel/feed": "0.2.0",
|
|
41
|
+
"@xhub-reel/gestures": "0.2.0",
|
|
44
42
|
"@xhub-reel/player-engine": "0.0.2",
|
|
43
|
+
"@xhub-reel/player": "0.2.0",
|
|
44
|
+
"@xhub-reel/player-core": "0.0.3",
|
|
45
45
|
"@xhub-reel/types": "0.0.2",
|
|
46
|
-
"@xhub-reel/ui": "0.
|
|
46
|
+
"@xhub-reel/ui": "0.2.0"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
49
49
|
"react": ">=18.0.0",
|