@zuude-ui/video 0.1.9 → 0.1.25
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/chunk-2LPC7QHR.js +2 -0
- package/dist/chunk-2LPC7QHR.js.map +1 -0
- package/dist/chunk-OYLOY3EO.js +2 -0
- package/dist/chunk-OYLOY3EO.js.map +1 -0
- package/dist/chunk-ZTXJNTLA.js +2 -0
- package/dist/chunk-ZTXJNTLA.js.map +1 -0
- package/dist/hooks/index.cjs +2 -0
- package/dist/hooks/index.cjs.map +1 -0
- package/dist/hooks/index.d.cts +84 -0
- package/dist/hooks/index.d.ts +84 -0
- package/dist/hooks/index.js +2 -0
- package/dist/hooks/index.js.map +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +14 -8
- package/dist/index.d.ts +14 -8
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/types-DejCaLAg.d.cts +9 -0
- package/dist/types-DejCaLAg.d.ts +9 -0
- package/package.json +2 -2
- package/dist/chunk-WLYC6MHJ.js +0 -2
- package/dist/chunk-WLYC6MHJ.js.map +0 -1
- package/dist/new/index.cjs +0 -2
- package/dist/new/index.cjs.map +0 -1
- package/dist/new/index.d.cts +0 -53
- package/dist/new/index.d.ts +0 -53
- package/dist/new/index.js +0 -2
- package/dist/new/index.js.map +0 -1
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import rt,{createContext as nt,useContext as st,useEffect as O,useRef as ut,useState as j}from"react";import{jsx as B}from"react/jsx-runtime";var z=nt(null),ct=rt.memo(({children:t,config:s,onError:e,...r})=>{let[n,u]=j({current:null}),[c,i]=j(null),[o,p]=j(!1),d=ut(null);return O(()=>{e==null||e(c)},[c]),O(()=>{let m=d.current;if(m){let a=m.querySelectorAll("[data-zuude-hide-elements]"),l=m.querySelector("[data-zuude-video]");if(a){let y=null,k=3e3,h=!1,V=()=>{y&&(clearTimeout(y),y=null),y=setTimeout(()=>{h&&l&&!l.paused&&a.forEach(P=>{P.setAttribute("data-hidden","true")}),y=null},k)},w=()=>{h=!0,a.forEach(P=>{P.removeAttribute("data-hidden")}),V()},D=()=>{h=!1,y&&(clearTimeout(y),y=null),l&&!l.paused&&a.forEach(P=>{P.setAttribute("data-hidden","true")})},T=()=>{h&&(a.forEach(P=>{P.hasAttribute("data-hidden")&&P.removeAttribute("data-hidden")}),V())},x=()=>{h||a.forEach(P=>{P.setAttribute("data-hidden","true")})};return m.addEventListener("mouseenter",w),m.addEventListener("mouseleave",D),m.addEventListener("mousemove",T),l.addEventListener("pause",w),l.addEventListener("play",x),()=>{y&&clearTimeout(y),m.removeEventListener("mouseenter",w),m.removeEventListener("mouseleave",D),m.removeEventListener("mousemove",T),l.removeEventListener("pause",w),l.removeEventListener("play",x)}}}},[]),O(()=>{if(o){let m=a=>{var l;(l=d.current)!=null&&l.contains(a.target)||p(!1)};return document.addEventListener("click",m),()=>{document.removeEventListener("click",m)}}},[o]),B(z.Provider,{value:{videoRef:n,setVideoRef:u,config:{clickToPlay:!0,...s},error:c,setError:i,isFocused:o,setIsFocused:p},children:B("div",{ref:d,"data-zuude-video-wrapper":!0,onClick:()=>p(!0),...r,children:t})})}),E=()=>{let t=st(z);if(!t)throw new Error("useVideo must be used within a VideoProvider");return t};import{forwardRef as it,useEffect as pt,useRef as dt}from"react";import ot from"react";var K=(t,s,e)=>{ot.useEffect(()=>{if(!(t!=null&&t.current)||!s)return;(async()=>{var n;try{await((n=t.current)==null?void 0:n.play())}catch(u){if(u instanceof Error&&u.name==="NotAllowedError"){if(e==null||e("NotAllowedError"),console.error("NotAllowedError"),t!=null&&t.current){t.current.muted=!0;try{await t.current.play()}catch(c){console.error(c)}}}else console.error(u)}})()},[s,t==null?void 0:t.current])};import{useEffect as at}from"react";var C=(t,s,e=!0)=>{let r=n=>{n.key===t&&(n.preventDefault(),s(n))};at(()=>{if(e)return document.addEventListener("keydown",r),()=>{document.removeEventListener("keydown",r)}},[t,s,e])};import W from"react";var f=(t,s=10)=>{let e=W.useCallback(()=>{t!=null&&t.current&&(t.current.currentTime+=s)},[t==null?void 0:t.current]),r=W.useCallback(()=>{t!=null&&t.current&&(t.current.currentTime-=s)},[t==null?void 0:t.current]);return{seekForward:e,seekBackward:r}};import S from"react";var I=t=>{let[s,e]=S.useState(!1),r=S.useCallback(()=>{t!=null&&t.current&&(t.current.paused?t.current.play():t.current.pause())},[t==null?void 0:t.current]),n=S.useCallback(()=>{t!=null&&t.current&&t.current.play()},[t==null?void 0:t.current]),u=S.useCallback(()=>{t!=null&&t.current&&t.current.pause()},[t==null?void 0:t.current]);return S.useEffect(()=>{if(!(t!=null&&t.current))return;let c=()=>{e(!0)},i=()=>{e(!1)};if(e(!(t!=null&&t.current.paused)),t!=null&&t.current)return t.current.addEventListener("play",c),t.current.addEventListener("pause",i),()=>{var o,p;(o=t.current)==null||o.removeEventListener("play",c),(p=t.current)==null||p.removeEventListener("pause",i)}},[t==null?void 0:t.current]),{togglePlay:r,isPlaying:s,play:n,pause:u}};import F from"react";var M=t=>{let[s,e]=F.useState(!1),r=F.useCallback(()=>{t!=null&&t.current&&(t.current.muted=!t.current.muted)},[t==null?void 0:t.current]),n=F.useCallback(()=>{t!=null&&t.current&&(t.current.muted=!0)},[t==null?void 0:t.current]),u=F.useCallback(()=>{t!=null&&t.current&&(t.current.muted=!1)},[t==null?void 0:t.current]);return F.useEffect(()=>{if(!(t!=null&&t.current))return;e(t.current.muted);let c=()=>{t.current&&e(t.current.muted)};return t.current.addEventListener("volumechange",c),()=>{var i;(i=t.current)==null||i.removeEventListener("volumechange",c)}},[t==null?void 0:t.current]),{toggleMute:r,isMuted:s,mute:n,unmute:u}};import $ from"react";var A=t=>{let[s,e]=$.useState(!1);$.useEffect(()=>{let n=()=>{e==null||e(!!document.fullscreenElement),r()};return document.addEventListener("fullscreenchange",n),()=>document.removeEventListener("fullscreenchange",n)},[s]);let r=()=>{console.log("toggleFullscreen");let n=/^((?!chrome|android).)*safari/i.test(navigator.userAgent),u=t==null?void 0:t.current;if(u&&n){if(u.webkitEnterFullscreen){u.webkitEnterFullscreen();return}else if(u.requestFullscreen){u.requestFullscreen();return}}let c=u==null?void 0:u.closest("[data-zuude-video-wrapper]");c&&(s?(document.exitFullscreen(),u&&(u.style.objectFit="cover")):(c.requestFullscreen(),u&&(u.style.objectFit="contain")))};return{isFullscreen:s!=null?s:!1,toggleFullscreen:r}};var H=t=>({togglePictureInPicture:async()=>{let n=t==null?void 0:t.current;if(n)try{document.pictureInPictureElement?await document.exitPictureInPicture():await n.requestPictureInPicture()}catch(u){if(/^((?!chrome|android).)*safari/i.test(navigator.userAgent))n.webkitEnterFullscreen?n.webkitEnterFullscreen():n.requestFullscreen&&n.requestFullscreen();else{let i=n.closest("[data-zuude-video-wrapper]");i&&(document.fullscreenElement?await document.exitFullscreen():await i.requestFullscreen())}}},requestPictureInPicture:async()=>{let n=t==null?void 0:t.current;n&&await n.requestPictureInPicture()},exitPictureInPicture:async()=>{t!=null&&t.current&&await document.exitPictureInPicture()}});var G=()=>{let{videoRef:t}=E(),{seekForward:s,seekBackward:e}=f(t),{togglePlay:r}=I(t),{toggleMute:n}=M(t),{toggleFullscreen:u}=A(t),{togglePictureInPicture:c}=H(t);return C("ArrowRight",()=>{s()}),C("ArrowLeft",()=>{e()}),C(" ",()=>{r()}),C("m",()=>{n()}),C("f",()=>{u()}),C("p",()=>{c()}),null};import lt from"react";var _=(t,s,e=!0)=>{lt.useEffect(()=>{if(!(t!=null&&t.current)||!e)return;let r=new IntersectionObserver(n=>{n.forEach(u=>{var c;t!=null&&t.current&&(u.isIntersecting?t.current.play().catch(i=>{t.current&&(t.current.pause(),t.current.muted=!0,t.current.play(),console.error(i))}):(c=t.current)==null||c.pause())})},{threshold:s!=null?s:.5});return r.observe(t==null?void 0:t.current),()=>{r.disconnect()}},[t==null?void 0:t.current])};import $t from"react";import N from"react";var J=t=>{let[s,e]=N.useState(1),r=n=>{e(n)};return N.useEffect(()=>{t!=null&&t.current&&e(t.current.playbackRate)},[t==null?void 0:t.current]),N.useEffect(()=>{t!=null&&t.current&&(t.current.playbackRate=s)},[s,t==null?void 0:t.current]),{speed:s,onChangeSpeed:r}};import Xt from"react";import vt from"react";import{useEffect as re,useState as ne}from"react";import ce from"react";import le from"react";import{useEffect as mt,useState as q,useCallback as Q}from"react";var X=t=>{let[s,e]=q(!1),[r,n]=q(0),[u,c]=q(null),i=Q(async p=>{var a;if(!(t!=null&&t.current)){c("Video element not found");return}let d=t.current,m=d.src||d.currentSrc;if(!m){c("No video source found");return}try{e(!0),c(null),n(0);let l=await fetch(m);if(!l.ok)throw new Error(`Failed to fetch video: ${l.statusText}`);let y=l.headers.get("content-length"),k=y?parseInt(y,10):0,h=(a=l.body)==null?void 0:a.getReader();if(!h)throw new Error("Failed to create download stream");let V=[],w=0;for(;;){let{done:tt,value:U}=await h.read();if(tt)break;if(V.push(U),w+=U.length,k>0){let et=w/k*100;n(Math.round(et))}}let D=new Blob(V,{type:l.headers.get("content-type")||"video/mp4"}),T=URL.createObjectURL(D),x=document.createElement("a");x.href=T;let P=p||`video-${Date.now()}.mp4`;x.download=P,document.body.appendChild(x),x.click(),document.body.removeChild(x),URL.revokeObjectURL(T),n(100),e(!1)}catch(l){c(l instanceof Error?l.message:"Download failed"),e(!1),n(0)}},[t]),o=Q(p=>{if(!(t!=null&&t.current)){c("Video element not found");return}let d=t.current,m=d.src||d.currentSrc;if(!m){c("No video source found");return}try{e(!0),c(null),n(0);let a=document.createElement("a");a.href=m,a.download=p||`video-${Date.now()}.mp4`,a.target="_blank",document.body.appendChild(a),a.click(),document.body.removeChild(a),e(!1),n(100)}catch(a){c(a instanceof Error?a.message:"Download failed"),e(!1),n(0)}},[t]);return mt(()=>()=>{e(!1),n(0),c(null)},[]),{downloadVideo:i,downloadDirect:o,isDownloading:s,downloadProgress:r,error:u,resetError:()=>c(null)}};import Ee from"react";import{Fragment as Et,jsx as Y,jsxs as yt}from"react/jsx-runtime";var Z=it(({src:t,autoPlay:s,muteFallback:e,controls:r,preload:n="metadata",autoPlayOnVisible:u,...c},i)=>{let{videoRef:o,setVideoRef:p,config:d,setError:m,error:a,isFocused:l}=E(),y=dt(null);pt(()=>{let h=y.current,V=i;V?p(V):h&&p({current:h})},[t]),K(o,s==="force"&&c.muted===void 0,m),_(o,typeof u=="number"?u:u?void 0:.5,!!u);let k=()=>{var h,V,w;(h=o==null?void 0:o.current)!=null&&h.paused?(V=o.current)==null||V.play():(w=o==null?void 0:o.current)==null||w.pause()};return yt(Et,{children:[Y("video",{ref:i||y,"data-zuude-video":!0,src:t,onClick:d!=null&&d.clickToPlay?k:void 0,autoPlay:s==="force"?!0:s,preload:n,...c}),r&&l&&Y(G,{}),a==="NotAllowedError"&&typeof e=="function"&&e(()=>{o!=null&&o.current&&(o.current.muted=!o.current.muted),m(null)})]})});Z.displayName="Video";import L,{useRef as gt}from"react";import{Slot as b}from"@radix-ui/react-slot";import v from"react";var R=t=>{let[s,e]=v.useState(!1);return v.useEffect(()=>{if(!(t!=null&&t.current))return;let r=t.current,n=()=>{e(!0)},u=()=>{},c=()=>{},i=()=>{e(!1)},o=()=>{e(!1)},p=()=>{e(!0)},d=()=>{e(!1)},m=()=>{e(!1)},a=()=>{e(!1)},l=()=>{};return r.addEventListener("loadstart",n),r.addEventListener("loadedmetadata",u),r.addEventListener("loadeddata",c),r.addEventListener("canplay",i),r.addEventListener("canplaythrough",o),r.addEventListener("waiting",p),r.addEventListener("playing",d),r.addEventListener("error",m),r.addEventListener("abort",a),r.addEventListener("suspend",l),r.readyState>=2&&e(!1),()=>{r.removeEventListener("loadstart",n),r.removeEventListener("loadedmetadata",u),r.removeEventListener("loadeddata",c),r.removeEventListener("canplay",i),r.removeEventListener("canplaythrough",o),r.removeEventListener("waiting",p),r.removeEventListener("playing",d),r.removeEventListener("error",m),r.removeEventListener("abort",a),r.removeEventListener("suspend",l)}},[t]),{isLoading:s}};import{jsx as g}from"react/jsx-runtime";var nr=L.memo(({children:t,asChild:s,...e})=>g("div",{"data-zuude-hide-elements":!0,...e,children:t})),sr=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{play:u}=I(n);return g(r,{...e,onClick:u,children:t})}),ur=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{pause:u}=I(n);return g(r,{...e,onClick:u,children:t})}),cr=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{mute:u}=M(n);return g(r,{...e,onClick:u,children:t})}),or=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{unmute:u}=M(n);return g(r,{...e,onClick:u,children:t})}),ar=L.memo(({children:t,asChild:s,value:e,onClick:r,...n})=>{let u=s?b:"button",{videoRef:c}=E(),{speed:i,onChangeSpeed:o}=J(c);return g(u,{...n,value:e,onClick:()=>{o(e),r==null||r()},children:t})}),lr=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{seekForward:u}=f(n,10);return g(r,{...e,onClick:u,children:t})}),mr=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{seekBackward:u}=f(n,10);return g(r,{...e,onClick:u,children:t})}),ir=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{toggleFullscreen:u}=A(n);return g(r,{...e,onClick:u,children:t})}),pr=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{toggleFullscreen:u}=A(n);return g(r,{...e,onClick:u,children:t})}),dr=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{togglePictureInPicture:u}=H(n);return g(r,{...e,onClick:u,children:t})}),Er=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"button",{videoRef:n}=E(),{downloadDirect:u}=X(n);return g(r,{...e,onClick:()=>u(),children:t})}),yr=L.memo(({children:t,asChild:s,...e})=>{let r=s?b:"div",{videoRef:n}=E(),{isLoading:u}=R(n);return g(r,{...e,style:{...e.style,pointerEvents:"none"},"data-loading":u,children:t})}),gr=({...t})=>{let{videoRef:s}=E(),e=gt(null);return L.useEffect(()=>{let r=s==null?void 0:s.current;if(e.current&&r){let n=0,u=!1,c=null,i=()=>{c&&clearInterval(c),c=setInterval(()=>{console.log("currentTime",r.currentTime),n=r.currentTime,e.current&&(e.current.currentTime=n)},100)},o=()=>{c&&(clearInterval(c),c=null)},p=()=>{u=!0,i()},d=()=>{u=!1,o()};return r.addEventListener("play",p),r.addEventListener("pause",d),()=>{o(),r.removeEventListener("play",p),r.removeEventListener("pause",d)}}},[s==null?void 0:s.current]),s!=null&&s.current?g("div",{...t,style:{...t.style,position:"absolute",top:0,left:0,width:"100%",height:"100%",pointerEvents:"none"},children:g("video",{ref:e,src:s.current.src,muted:!0,playsInline:!0,style:{width:"100%",height:"100%",objectFit:"cover"}})}):null};export{nr as Controls,Er as Download,pr as ExitFullscreen,ir as Fullscreen,yr as Loading,cr as Mute,ur as Pause,dr as PictureInPicture,sr as Play,mr as SeekBackward,lr as SeekForward,gr as Shadow,ar as Speed,or as Unmute,Z as Video,ct as VideoProvider};
|
|
1
|
+
"use client";import{a as H,b as V,c as g,d as C,e as k,f as w,g as M,h as O,j,p as N}from"./chunk-ZTXJNTLA.js";import G,{createContext as J,useContext as Q,useEffect as S,useRef as X,useState as F}from"react";import{jsx as D}from"react/jsx-runtime";var z=J(null),Y=G.memo(({children:o,config:n,onError:t,...e})=>{let[s,r]=F({current:null}),[i,y]=F(null),[m,d]=F(!1),E=X(null);return S(()=>{t==null||t(i)},[i]),S(()=>{let a=E.current;if(a){let f=a.querySelectorAll("[data-zuude-hide-elements]"),l=a.querySelector("[data-zuude-video]");if(f){let P=null,x=3e3,b=!1,h=()=>{P&&(clearTimeout(P),P=null),P=setTimeout(()=>{b&&l&&!l.paused&&f.forEach(R=>{R.setAttribute("data-hidden","true")}),P=null},x)},v=()=>{b=!0,f.forEach(R=>{R.removeAttribute("data-hidden")}),h()},T=()=>{b=!1,P&&(clearTimeout(P),P=null),l&&!l.paused&&f.forEach(R=>{R.setAttribute("data-hidden","true")})},I=()=>{b&&(f.forEach(R=>{R.hasAttribute("data-hidden")&&R.removeAttribute("data-hidden")}),h())},A=()=>{b||f.forEach(R=>{R.setAttribute("data-hidden","true")})};return a.addEventListener("mouseenter",v),a.addEventListener("mouseleave",T),a.addEventListener("mousemove",I),l.addEventListener("pause",v),l.addEventListener("play",A),()=>{P&&clearTimeout(P),a.removeEventListener("mouseenter",v),a.removeEventListener("mouseleave",T),a.removeEventListener("mousemove",I),l.removeEventListener("pause",v),l.removeEventListener("play",A)}}}},[]),S(()=>{if(m){let a=f=>{var l;(l=E.current)!=null&&l.contains(f.target)||d(!1)};return document.addEventListener("click",a),()=>{document.removeEventListener("click",a)}}},[m]),D(z.Provider,{value:{videoRef:s,setVideoRef:r,config:{clickToPlay:!0,...n},error:i,setError:y,isFocused:m,setIsFocused:d},children:D("div",{ref:E,"data-zuude-video-wrapper":!0,onClick:()=>d(!0),...e,children:o})})}),c=()=>{let o=Q(z);if(!o)throw new Error("useVideo must be used within a VideoProvider");return o};import{forwardRef as Z,useEffect as _,useRef as $}from"react";var B=()=>{let{videoRef:o}=c(),{seekForward:n,seekBackward:t}=g(o),{togglePlay:e}=C(o),{toggleMute:s}=k(o),{toggleFullscreen:r}=w(o),{togglePictureInPicture:i}=M(o);return V("ArrowRight",()=>{n()}),V("ArrowLeft",()=>{t()}),V(" ",()=>{e()}),V("m",()=>{s()}),V("f",()=>{r()}),V("p",()=>{i()}),null};import{Fragment as ee,jsx as U,jsxs as te}from"react/jsx-runtime";var K=Z(({src:o,autoPlay:n,muteFallback:t,controls:e,preload:s="metadata",autoPlayOnVisible:r,ranges:i,...y},m)=>{let{videoRef:d,setVideoRef:E,config:a,setError:f,error:l,isFocused:P}=c(),x=$(null);_(()=>{let h=x.current,v=m;v?E(v):h&&E({current:h})},[o]),H(d,n==="force"&&y.muted===void 0,f),O(d,typeof r=="number"?r:r?void 0:.5,!!r);let b=()=>{var h,v,T;(h=d==null?void 0:d.current)!=null&&h.paused?(v=d.current)==null||v.play():(T=d==null?void 0:d.current)==null||T.pause()};return te(ee,{children:[U("video",{ref:m||x,"data-zuude-video":!0,src:o,onClick:a!=null&&a.clickToPlay?b:void 0,autoPlay:n==="force"?!0:n,preload:s,playsInline:!0,onTimeUpdate:h=>{if((i==null?void 0:i[0])!==void 0&&(i==null?void 0:i[1])!==void 0){let v=h.currentTarget.currentTime;(v>=i[1]||v<=i[0])&&(h.currentTarget.currentTime=i[0])}},...y}),e&&P&&U(B,{}),l==="NotAllowedError"&&typeof t=="function"&&t(()=>{d!=null&&d.current&&(d.current.muted=!d.current.muted),f(null)})]})});K.displayName="Video";import p,{useRef as oe}from"react";import{Slot as L}from"@radix-ui/react-slot";import W from"react";var q=o=>{let[n,t]=W.useState(!1);return W.useEffect(()=>{if(!(o!=null&&o.current))return;let e=o.current,s=()=>{t(!0)},r=()=>{},i=()=>{},y=()=>{t(!1)},m=()=>{t(!1)},d=()=>{t(!0)},E=()=>{t(!1)},a=()=>{t(!1)},f=()=>{t(!1)},l=()=>{};return e.addEventListener("loadstart",s),e.addEventListener("loadedmetadata",r),e.addEventListener("loadeddata",i),e.addEventListener("canplay",y),e.addEventListener("canplaythrough",m),e.addEventListener("waiting",d),e.addEventListener("playing",E),e.addEventListener("error",a),e.addEventListener("abort",f),e.addEventListener("suspend",l),e.readyState>=2&&t(!1),()=>{e.removeEventListener("loadstart",s),e.removeEventListener("loadedmetadata",r),e.removeEventListener("loadeddata",i),e.removeEventListener("canplay",y),e.removeEventListener("canplaythrough",m),e.removeEventListener("waiting",d),e.removeEventListener("playing",E),e.removeEventListener("error",a),e.removeEventListener("abort",f),e.removeEventListener("suspend",l)}},[o]),{isLoading:n}};import{jsx as u}from"react/jsx-runtime";var je=p.memo(({children:o,asChild:n,...t})=>u("div",{"data-zuude-hide-elements":!0,...t,children:o})),Ne=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{play:r}=C(s);return u(e,{...t,onClick:r,children:o})}),De=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{pause:r}=C(s);return u(e,{...t,onClick:r,children:o})}),ze=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{mute:r}=k(s);return u(e,{...t,onClick:r,children:o})}),Be=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{unmute:r}=k(s);return u(e,{...t,onClick:r,children:o})}),Ue=p.memo(({children:o,asChild:n,value:t,onClick:e,...s})=>{let r=n?L:"button",{videoRef:i}=c(),{speed:y,onChangeSpeed:m}=j(i);return u(r,{...s,value:t,onClick:()=>{m(t),e==null||e()},children:o})}),Ke=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{seekForward:r}=g(s,10);return u(e,{...t,onClick:r,children:o})}),We=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{seekBackward:r}=g(s,10);return u(e,{...t,onClick:r,children:o})}),qe=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{toggleFullscreen:r}=w(s);return u(e,{...t,onClick:r,children:o})}),Ge=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{toggleFullscreen:r}=w(s);return u(e,{...t,onClick:r,children:o})}),Je=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{togglePictureInPicture:r}=M(s);return u(e,{...t,onClick:r,children:o})}),Qe=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"button",{videoRef:s}=c(),{downloadDirect:r}=N(s);return u(e,{...t,onClick:()=>r(),children:o})}),Xe=p.memo(({children:o,asChild:n,...t})=>{let e=n?L:"div",{videoRef:s}=c(),{isLoading:r}=q(s);return u(e,{...t,style:{...t.style,pointerEvents:"none"},"data-loading":r,children:o})}),Ye=({...o})=>{let{videoRef:n}=c(),t=oe(null);return p.useEffect(()=>{let e=n==null?void 0:n.current;if(t.current&&e){let s=0,r=!1,i=null,y=()=>{i&&clearInterval(i),i=setInterval(()=>{console.log("currentTime",e.currentTime),s=e.currentTime,t.current&&(t.current.currentTime=s)},100)},m=()=>{i&&(clearInterval(i),i=null)},d=()=>{r=!0,y()},E=()=>{r=!1,m()};return e.addEventListener("play",d),e.addEventListener("pause",E),()=>{m(),e.removeEventListener("play",d),e.removeEventListener("pause",E)}}},[n==null?void 0:n.current]),n!=null&&n.current?u("div",{...o,style:{...o.style,position:"absolute",top:0,left:0,width:"100%",height:"100%",pointerEvents:"none"},children:u("video",{ref:t,src:n.current.src,muted:!0,playsInline:!0,style:{width:"100%",height:"100%",objectFit:"cover"}})}):null};export{je as Controls,Qe as Download,Ge as ExitFullscreen,qe as Fullscreen,Xe as Loading,ze as Mute,De as Pause,Je as PictureInPicture,Ne as Play,We as SeekBackward,Ke as SeekForward,Ye as Shadow,Ue as Speed,Be as Unmute,K as Video,Y as VideoProvider,c as useVideo};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/wrapper.tsx","../src/video.tsx","../src/hooks/use-autoplay-by-force.tsx","../src/hooks/use-hot-keys.tsx","../src/hooks/use-seek.tsx","../src/hooks/use-play-pause.tsx","../src/hooks/use-mute-unmute.tsx","../src/hooks/use-fullscreen.tsx","../src/hooks/use-picture-in-picture.tsx","../src/keyboard.tsx","../src/hooks/use-autoplay-on-visible.tsx","../src/hooks/use-get-duration.tsx","../src/hooks/use-speed.tsx","../src/hooks/use-start-at.tsx","../src/hooks/use-current-time.tsx","../src/hooks/use-video-state.tsx","../src/hooks/use-volume.tsx","../src/hooks/use-buffer.tsx","../src/hooks/use-download.tsx","../src/hooks/use-range.tsx","../src/components.tsx","../src/hooks/use-loading.tsx"],"sourcesContent":["import React, {\n createContext,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { VideoRef } from \"./types\";\n\ninterface VideoConfig {\n config?: Partial<{\n clickToPlay: boolean;\n }>;\n}\n\ninterface VideoContextType extends VideoConfig {\n videoRef: VideoRef;\n setVideoRef: (video: VideoRef) => void;\n error: string | null;\n setError: (error: string | null) => void;\n isFocused: boolean;\n setIsFocused: (isFocused: boolean) => void;\n}\n\nexport const VideoContext = createContext<VideoContextType | null>(null);\n\ntype VideoProviderProps = Omit<React.ComponentProps<\"div\">, \"onError\"> &\n VideoConfig & {\n children: React.ReactNode;\n onError?: (error: string | null) => void;\n };\n\nexport const VideoProvider = React.memo(\n ({ children, config, onError, ...props }: VideoProviderProps) => {\n const [videoRef, setVideoRef] = useState<VideoRef>({ current: null });\n const [error, setError] = useState<string | null>(null);\n const [isFocused, setIsFocused] = useState(false);\n\n const videoWrapperRef = useRef<HTMLDivElement>(null);\n\n // Sending error to user if it exists\n useEffect(() => {\n onError?.(error);\n }, [error]);\n\n useEffect(() => {\n const videoWrapper = videoWrapperRef.current;\n if (videoWrapper) {\n const controls = videoWrapper.querySelectorAll(\n \"[data-zuude-hide-elements]\"\n );\n const video = videoWrapper.querySelector(\n \"[data-zuude-video]\"\n ) as HTMLVideoElement;\n\n if (controls) {\n let hideTimeout: ReturnType<typeof setTimeout> | null = null;\n const hideDelay = 3000; // 3 seconds delay\n let isMouseOver = false;\n\n const resetTimer = () => {\n // Clear any pending hide timeout\n if (hideTimeout) {\n clearTimeout(hideTimeout);\n hideTimeout = null;\n }\n\n // Start new timer to hide controls after delay\n hideTimeout = setTimeout(() => {\n if (isMouseOver) {\n // Check if video is paused - don't hide controls if paused\n if (video && !video.paused) {\n controls.forEach((control) => {\n control.setAttribute(\"data-hidden\", \"true\");\n });\n }\n }\n hideTimeout = null;\n }, hideDelay);\n };\n\n const showControls = () => {\n isMouseOver = true;\n controls.forEach((control) => {\n control.removeAttribute(\"data-hidden\");\n });\n resetTimer();\n };\n\n const hideControls = () => {\n isMouseOver = false;\n // Clear any pending hide timeout\n if (hideTimeout) {\n clearTimeout(hideTimeout);\n hideTimeout = null;\n }\n // Hide controls immediately when mouse leaves\n if (video && !video.paused) {\n controls.forEach((control) => {\n control.setAttribute(\"data-hidden\", \"true\");\n });\n }\n };\n\n const handleMouseMove = () => {\n if (isMouseOver) {\n // If controls are hidden, show them\n controls.forEach((control) => {\n if (control.hasAttribute(\"data-hidden\")) {\n control.removeAttribute(\"data-hidden\");\n }\n });\n resetTimer();\n }\n };\n\n const handlePlay = () => {\n // Hide controls when video starts playing (autoplay)\n if (!isMouseOver) {\n controls.forEach((control) => {\n control.setAttribute(\"data-hidden\", \"true\");\n });\n }\n };\n\n videoWrapper.addEventListener(\"mouseenter\", showControls);\n videoWrapper.addEventListener(\"mouseleave\", hideControls);\n videoWrapper.addEventListener(\"mousemove\", handleMouseMove);\n video.addEventListener(\"pause\", showControls);\n video.addEventListener(\"play\", handlePlay);\n\n // Cleanup function\n return () => {\n if (hideTimeout) {\n clearTimeout(hideTimeout);\n }\n videoWrapper.removeEventListener(\"mouseenter\", showControls);\n videoWrapper.removeEventListener(\"mouseleave\", hideControls);\n videoWrapper.removeEventListener(\"mousemove\", handleMouseMove);\n video.removeEventListener(\"pause\", showControls);\n video.removeEventListener(\"play\", handlePlay);\n };\n }\n }\n }, []);\n\n useEffect(() => {\n if (isFocused) {\n const handleClick = (event: MouseEvent) => {\n if (!videoWrapperRef.current?.contains(event.target as Node)) {\n setIsFocused(false);\n }\n };\n document.addEventListener(\"click\", handleClick);\n\n return () => {\n document.removeEventListener(\"click\", handleClick);\n };\n }\n }, [isFocused]);\n\n return (\n <VideoContext.Provider\n value={{\n videoRef,\n setVideoRef,\n config: { clickToPlay: true, ...config },\n error,\n setError,\n isFocused,\n setIsFocused,\n }}\n >\n <div\n ref={videoWrapperRef}\n data-zuude-video-wrapper\n onClick={() => setIsFocused(true)}\n {...props}\n >\n {children}\n </div>\n </VideoContext.Provider>\n );\n }\n);\n\nexport const useVideo = () => {\n const context = useContext(VideoContext);\n if (!context) {\n throw new Error(\"useVideo must be used within a VideoProvider\");\n }\n return context;\n};\n","import React, { forwardRef, RefObject, useEffect, useRef } from \"react\";\nimport { useVideo } from \"./wrapper\";\nimport { VideoAutoplay } from \"./types\";\nimport { useAutoplayByForce } from \"./hooks/use-autoplay-by-force\";\nimport { Keyboards } from \"./keyboard\";\nimport { useAutoplayOnVisible } from \"./hooks\";\n\ninterface Props\n extends Omit<React.ComponentProps<\"video\">, \"autoPlay\" | \"preload\"> {\n src: string;\n autoPlay?: VideoAutoplay;\n controls?: boolean;\n preload?: \"none\" | \"metadata\" | \"auto\";\n muteFallback?: (onMute: () => void) => React.ReactNode;\n autoPlayOnVisible?: boolean | number;\n}\n\nexport const Video = forwardRef<HTMLVideoElement, Props>(\n (\n {\n src,\n autoPlay,\n muteFallback,\n controls,\n preload = \"metadata\",\n autoPlayOnVisible,\n ...props\n },\n ref\n ) => {\n const { videoRef, setVideoRef, config, setError, error, isFocused } =\n useVideo();\n\n const refVideo = useRef<HTMLVideoElement>(null);\n\n useEffect(() => {\n const video = refVideo.current;\n const thirdPartyRef = ref;\n\n if (thirdPartyRef) {\n setVideoRef(thirdPartyRef as RefObject<HTMLVideoElement>);\n } else {\n if (video) {\n setVideoRef({ current: video });\n }\n }\n }, [src]);\n\n useAutoplayByForce(\n videoRef,\n autoPlay === \"force\" && props.muted === undefined,\n setError\n );\n\n useAutoplayOnVisible(\n videoRef,\n typeof autoPlayOnVisible === \"number\"\n ? autoPlayOnVisible\n : !autoPlayOnVisible\n ? 0.5\n : undefined,\n !!autoPlayOnVisible\n );\n\n const onPlay = () => {\n if (videoRef?.current?.paused) {\n videoRef.current?.play();\n } else {\n videoRef?.current?.pause();\n }\n };\n\n return (\n <>\n <video\n ref={ref || refVideo}\n data-zuude-video\n src={src}\n onClick={config?.clickToPlay ? onPlay : undefined}\n autoPlay={autoPlay === \"force\" ? true : autoPlay}\n preload={preload}\n {...props}\n />\n\n {controls && isFocused && <Keyboards />}\n\n {error === \"NotAllowedError\" &&\n typeof muteFallback === \"function\" &&\n muteFallback(() => {\n if (videoRef?.current) {\n videoRef.current.muted = !videoRef.current.muted;\n }\n setError(null);\n })}\n </>\n );\n }\n);\n\nVideo.displayName = \"Video\";\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useAutoplayByForce = (\n videoRef: VideoRef,\n enabled: boolean,\n setError?: (error: string | null) => void\n) => {\n React.useEffect(() => {\n if (!videoRef?.current || !enabled) return;\n\n const playVideo = async () => {\n try {\n await videoRef.current?.play();\n } catch (error) {\n // If autoplay fails, try muting and playing again\n if (error instanceof Error && error.name === \"NotAllowedError\") {\n setError?.(\"NotAllowedError\");\n console.error(\"NotAllowedError\");\n if (videoRef?.current) {\n videoRef.current.muted = true;\n try {\n await videoRef.current.play();\n } catch (retryError) {\n console.error(retryError);\n }\n }\n } else {\n console.error(error);\n }\n }\n };\n\n playVideo();\n }, [enabled, videoRef?.current]);\n};\n","import { useEffect } from \"react\";\n\nexport const useHotKeys = (\n key: string,\n func: (event: KeyboardEvent) => void,\n enabled = true\n) => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === key) {\n event.preventDefault();\n func(event);\n }\n };\n\n useEffect(() => {\n if (!enabled) return;\n\n document.addEventListener(\"keydown\", handleKeyDown);\n\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n };\n }, [key, func, enabled]);\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useSeek = (videoRef: VideoRef, value = 10) => {\n const seekForward = React.useCallback(() => {\n if (videoRef?.current) {\n videoRef.current.currentTime += value;\n }\n }, [videoRef?.current]);\n\n const seekBackward = React.useCallback(() => {\n if (videoRef?.current) {\n videoRef.current.currentTime -= value;\n }\n }, [videoRef?.current]);\n\n return { seekForward, seekBackward };\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const usePlayPause = (videoRef: VideoRef) => {\n const [isPlaying, setIsPlaying] = React.useState(false);\n\n const togglePlay = React.useCallback(() => {\n if (videoRef?.current) {\n videoRef.current.paused\n ? videoRef.current.play()\n : videoRef.current.pause();\n }\n }, [videoRef?.current]);\n\n const play = React.useCallback(() => {\n if (videoRef?.current) {\n videoRef.current.play();\n }\n }, [videoRef?.current]);\n\n const pause = React.useCallback(() => {\n if (videoRef?.current) {\n videoRef.current.pause();\n }\n }, [videoRef?.current]);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n const handlePlay = () => {\n setIsPlaying(true);\n };\n const handlePause = () => {\n setIsPlaying(false);\n };\n\n setIsPlaying(!videoRef?.current.paused);\n\n if (videoRef?.current) {\n videoRef.current.addEventListener(\"play\", handlePlay);\n videoRef.current.addEventListener(\"pause\", handlePause);\n\n return () => {\n videoRef.current?.removeEventListener(\"play\", handlePlay);\n videoRef.current?.removeEventListener(\"pause\", handlePause);\n };\n }\n }, [videoRef?.current]);\n\n return { togglePlay, isPlaying, play, pause };\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useMuteUnmute = (videoRef: VideoRef) => {\n const [isMuted, setIsMuted] = React.useState(false);\n\n const toggleMute = React.useCallback(() => {\n if (videoRef?.current) {\n videoRef.current.muted = !videoRef.current.muted;\n }\n }, [videoRef?.current]);\n\n const mute = React.useCallback(() => {\n if (videoRef?.current) {\n videoRef.current.muted = true;\n }\n }, [videoRef?.current]);\n\n const unmute = React.useCallback(() => {\n if (videoRef?.current) {\n videoRef.current.muted = false;\n }\n }, [videoRef?.current]);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n // Set the initial state\n setIsMuted(videoRef.current.muted);\n\n const handleVolumeChange = () => {\n if (videoRef.current) {\n setIsMuted(videoRef.current.muted);\n }\n };\n\n videoRef.current.addEventListener(\"volumechange\", handleVolumeChange);\n\n return () => {\n videoRef.current?.removeEventListener(\"volumechange\", handleVolumeChange);\n };\n }, [videoRef?.current]);\n\n return { toggleMute, isMuted, mute, unmute };\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nconst useFullscreen = (videoRef: VideoRef) => {\n const [isFullscreen, setIsFullscreen] = React.useState(false);\n\n React.useEffect(() => {\n const handleFullscreenChange = () => {\n setIsFullscreen?.(!!document.fullscreenElement);\n toggleFullscreen();\n };\n\n document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n return () =>\n document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n }, [isFullscreen]);\n\n const toggleFullscreen = () => {\n console.log(\"toggleFullscreen\");\n const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);\n const video = videoRef?.current;\n\n if (video && isSafari) {\n if ((video as any).webkitEnterFullscreen) {\n (video as any).webkitEnterFullscreen();\n return;\n } else if (video.requestFullscreen) {\n video.requestFullscreen();\n return;\n }\n }\n\n const videoContainer = video?.closest(\n \"[data-zuude-video-wrapper]\"\n ) as HTMLElement;\n\n if (videoContainer) {\n if (!isFullscreen) {\n videoContainer.requestFullscreen();\n if (video) {\n video.style.objectFit = \"contain\";\n }\n } else {\n document.exitFullscreen();\n if (video) {\n video.style.objectFit = \"cover\";\n }\n }\n }\n };\n\n return { isFullscreen: isFullscreen ?? false, toggleFullscreen };\n};\n\nexport { useFullscreen };\n","import type { VideoRef } from \"../types\";\n\nexport const usePictureInPicture = (videoRef: VideoRef) => {\n const togglePictureInPicture = async () => {\n const video = videoRef?.current;\n if (!video) return;\n\n try {\n if (document.pictureInPictureElement) {\n await document.exitPictureInPicture();\n } else {\n await video.requestPictureInPicture();\n }\n } catch (error) {\n // Fallback for browsers that don't support PiP\n const isSafari = /^((?!chrome|android).)*safari/i.test(\n navigator.userAgent\n );\n\n if (isSafari) {\n if ((video as any).webkitEnterFullscreen) {\n (video as any).webkitEnterFullscreen();\n } else if (video.requestFullscreen) {\n video.requestFullscreen();\n }\n } else {\n const videoContainer = video.closest(\n \"[data-zuude-video-wrapper]\"\n ) as HTMLElement;\n if (videoContainer) {\n if (!document.fullscreenElement) {\n await videoContainer.requestFullscreen();\n } else {\n await document.exitFullscreen();\n }\n }\n }\n }\n };\n\n const requestPictureInPicture = async () => {\n const video = videoRef?.current;\n if (!video) return;\n await video.requestPictureInPicture();\n };\n\n const exitPictureInPicture = async () => {\n const video = videoRef?.current;\n if (!video) return;\n await document.exitPictureInPicture();\n };\n\n return {\n togglePictureInPicture,\n requestPictureInPicture,\n exitPictureInPicture,\n };\n};\n","import { useVideo } from \"./wrapper\";\nimport { useHotKeys } from \"./hooks/use-hot-keys\";\nimport { useSeek } from \"./hooks/use-seek\";\nimport { usePlayPause } from \"./hooks/use-play-pause\";\nimport { useMuteUnmute } from \"./hooks/use-mute-unmute\";\nimport { useFullscreen } from \"./hooks/use-fullscreen\";\nimport { usePictureInPicture } from \"./hooks/use-picture-in-picture\";\n\nexport const Keyboards = () => {\n const { videoRef } = useVideo();\n\n const { seekForward, seekBackward } = useSeek(videoRef);\n const { togglePlay } = usePlayPause(videoRef);\n const { toggleMute } = useMuteUnmute(videoRef);\n const { toggleFullscreen } = useFullscreen(videoRef);\n const { togglePictureInPicture } = usePictureInPicture(videoRef);\n\n useHotKeys(\"ArrowRight\", () => {\n seekForward();\n });\n useHotKeys(\"ArrowLeft\", () => {\n seekBackward();\n });\n useHotKeys(\" \", () => {\n togglePlay();\n });\n useHotKeys(\"m\", () => {\n toggleMute();\n });\n useHotKeys(\"f\", () => {\n toggleFullscreen();\n });\n useHotKeys(\"p\", () => {\n togglePictureInPicture();\n });\n\n return null;\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useAutoplayOnVisible = (\n videoRef: VideoRef,\n threshold: number | undefined,\n enabled = true\n) => {\n React.useEffect(() => {\n if (!videoRef?.current || !enabled) return;\n\n const observer = new IntersectionObserver(\n (entries) => {\n entries.forEach((entry) => {\n if (!videoRef?.current) return;\n\n if (entry.isIntersecting) {\n videoRef.current.play().catch((error) => {\n if (!videoRef.current) return;\n\n videoRef.current.pause();\n videoRef.current.muted = true;\n videoRef.current.play();\n console.error(error);\n });\n } else {\n videoRef.current?.pause();\n }\n });\n },\n { threshold: threshold ?? 0.5 }\n );\n\n observer.observe(videoRef?.current);\n\n return () => {\n observer.disconnect();\n };\n }, [videoRef?.current]);\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useGetDuration = (videoRef: VideoRef) => {\n const [isLoading, setIsLoading] = React.useState(false);\n const [duration, setDuration] = React.useState<number | null>(null);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n setIsLoading(true);\n\n const getDuration = () => {\n setDuration(videoRef.current?.duration ?? null);\n setIsLoading(false);\n };\n\n const handleError = () => {\n setIsLoading(false);\n };\n\n const video = videoRef.current;\n\n // Check if duration is already available\n if (video.duration && !isNaN(video.duration)) {\n setDuration(video.duration);\n setIsLoading(false);\n } else {\n // Add event listeners\n video.addEventListener(\"loadedmetadata\", getDuration);\n video.addEventListener(\"error\", handleError);\n video.addEventListener(\"loadeddata\", getDuration);\n\n return () => {\n video.removeEventListener(\"loadedmetadata\", getDuration);\n video.removeEventListener(\"error\", handleError);\n video.removeEventListener(\"loadeddata\", getDuration);\n };\n }\n }, [videoRef]);\n\n return { duration, isLoading };\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useSpeed = (videoRef: VideoRef) => {\n const [speed, setSpeed] = React.useState(1);\n\n const onChangeSpeed = (speed: number) => {\n setSpeed(speed);\n };\n\n // Get the speed from the video element\n React.useEffect(() => {\n if (!videoRef?.current) return;\n setSpeed(videoRef.current.playbackRate);\n }, [videoRef?.current]);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n videoRef.current.playbackRate = speed;\n }, [speed, videoRef?.current]);\n\n return { speed, onChangeSpeed };\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useStartAt = (videoRef: VideoRef, startAt: number) => {\n React.useEffect(() => {\n if (!videoRef?.current || !startAt) return;\n\n const video = videoRef?.current;\n if (video && startAt) {\n video.currentTime = startAt;\n }\n }, [startAt, videoRef?.current]);\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types.js\";\n\nexport const useCurrentTime = (videoRef: VideoRef, interval = 10) => {\n const [isPlaying, setIsPlaying] = React.useState(false);\n const [currentTime, setCurrentTime] = React.useState(0);\n\n React.useEffect(() => {\n if (videoRef?.current && isPlaying) {\n const intervalId = setInterval(() => {\n setCurrentTime(videoRef.current?.currentTime || 0);\n }, interval);\n\n return () => clearInterval(intervalId);\n }\n }, [videoRef?.current, isPlaying]);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n videoRef.current.addEventListener(\"play\", () => setIsPlaying(true));\n videoRef.current.addEventListener(\"pause\", () => setIsPlaying(false));\n\n return () => {\n videoRef.current?.removeEventListener(\"play\", () => setIsPlaying(true));\n videoRef.current?.removeEventListener(\"pause\", () => setIsPlaying(false));\n };\n }, [videoRef?.current]);\n\n const onTimeUpdate = (time: number) => {\n if (videoRef?.current) {\n setCurrentTime(time);\n videoRef.current.currentTime = time;\n }\n };\n\n return {\n currentTime,\n onTimeUpdate,\n };\n};\n","import { RefObject, useEffect, useState } from \"react\";\n\nconst useVideoState = (videoRef: RefObject<HTMLVideoElement | null>) => {\n const [isPlaying, setIsPlaying] = useState(false);\n const [isMuted, setIsMuted] = useState(false);\n const [isFullscreen, setIsFullscreen] = useState(false);\n\n useEffect(() => {\n const video = videoRef.current;\n\n if (video) {\n video.addEventListener(\"play\", () => setIsPlaying(true));\n video.addEventListener(\"pause\", () => setIsPlaying(false));\n\n return () => {\n video.removeEventListener(\"play\", () => setIsPlaying(true));\n video.removeEventListener(\"pause\", () => setIsPlaying(false));\n };\n }\n }, [videoRef]);\n\n useEffect(() => {\n if (!videoRef?.current) return;\n\n // Set the initial state\n setIsMuted(videoRef.current.muted);\n\n const handleVolumeChange = () => {\n if (videoRef.current) {\n setIsMuted(videoRef.current.muted);\n }\n };\n\n videoRef.current.addEventListener(\"volumechange\", handleVolumeChange);\n\n return () => {\n videoRef.current?.removeEventListener(\"volumechange\", handleVolumeChange);\n };\n }, [videoRef]);\n\n useEffect(() => {\n if (!videoRef?.current) return;\n\n const handleFullscreenChange = () => {\n setIsFullscreen(!!document.fullscreenElement);\n };\n\n document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n return () =>\n document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n }, [videoRef]);\n\n return { isPlaying, isMuted, isFullscreen };\n};\n\nexport { useVideoState };\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useVolume = (videoRef: VideoRef, initialVolume = 100) => {\n const [volume, setVolume] = React.useState(initialVolume);\n\n const onChangeVolume = (volume: number) => {\n setVolume(volume);\n };\n\n // Get the volume from the video element\n React.useEffect(() => {\n if (!videoRef?.current) return;\n setVolume(videoRef.current.volume * 100);\n }, [videoRef?.current]);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n videoRef.current.volume = volume / 100;\n }, [volume, videoRef?.current]);\n\n return { volume, onChangeVolume };\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types.js\";\n\nexport const useBuffer = (videoRef: VideoRef, duration?: number) => {\n const [isPlaying, setIsPlaying] = React.useState(false);\n const [buffered, setBuffered] = React.useState(0);\n\n React.useEffect(() => {\n if (videoRef?.current && isPlaying) {\n const intervalId = setInterval(() => {\n if (videoRef.current?.buffered.length) {\n setBuffered(\n videoRef.current.buffered.end(videoRef.current.buffered.length - 1)\n );\n }\n }, 10);\n\n return () => clearInterval(intervalId);\n }\n }, [videoRef?.current, isPlaying]);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n videoRef.current.addEventListener(\"play\", () => setIsPlaying(true));\n videoRef.current.addEventListener(\"pause\", () => setIsPlaying(false));\n\n return () => {\n videoRef.current?.removeEventListener(\"play\", () => setIsPlaying(true));\n videoRef.current?.removeEventListener(\"pause\", () => setIsPlaying(false));\n };\n }, []);\n\n return {\n buffered,\n bufferedPercentage: (buffered / (duration || 0)) * 100 || 0,\n };\n};\n","import { useEffect, useState, useCallback } from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useDownload = (videoRef: VideoRef) => {\n const [isDownloading, setIsDownloading] = useState(false);\n const [downloadProgress, setDownloadProgress] = useState(0);\n const [error, setError] = useState<string | null>(null);\n\n const downloadVideo = useCallback(\n async (filename?: string) => {\n if (!videoRef?.current) {\n setError(\"Video element not found\");\n return;\n }\n\n const video = videoRef.current;\n const videoSrc = video.src || video.currentSrc;\n\n if (!videoSrc) {\n setError(\"No video source found\");\n return;\n }\n\n try {\n setIsDownloading(true);\n setError(null);\n setDownloadProgress(0);\n\n // Fetch the video file\n const response = await fetch(videoSrc);\n\n if (!response.ok) {\n throw new Error(`Failed to fetch video: ${response.statusText}`);\n }\n\n // Get the content length for progress tracking\n const contentLength = response.headers.get(\"content-length\");\n const total = contentLength ? parseInt(contentLength, 10) : 0;\n\n // Create a readable stream to track progress\n const reader = response.body?.getReader();\n if (!reader) {\n throw new Error(\"Failed to create download stream\");\n }\n\n const chunks: Uint8Array[] = [];\n let receivedLength = 0;\n\n while (true) {\n const { done, value } = await reader.read();\n\n if (done) break;\n\n chunks.push(value);\n receivedLength += value.length;\n\n if (total > 0) {\n const progress = (receivedLength / total) * 100;\n setDownloadProgress(Math.round(progress));\n }\n }\n\n // Combine chunks into a single blob\n const blob = new Blob(chunks, {\n type: response.headers.get(\"content-type\") || \"video/mp4\",\n });\n\n // Create download link\n const url = URL.createObjectURL(blob);\n const link = document.createElement(\"a\");\n link.href = url;\n\n // Generate filename if not provided\n const defaultFilename = filename || `video-${Date.now()}.mp4`;\n link.download = defaultFilename;\n\n // Trigger download\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n\n // Clean up\n URL.revokeObjectURL(url);\n\n setDownloadProgress(100);\n setIsDownloading(false);\n } catch (err) {\n setError(err instanceof Error ? err.message : \"Download failed\");\n setIsDownloading(false);\n setDownloadProgress(0);\n }\n },\n [videoRef]\n );\n\n // Alternative simple download method for direct video URLs\n const downloadDirect = useCallback(\n (filename?: string) => {\n if (!videoRef?.current) {\n setError(\"Video element not found\");\n return;\n }\n\n const video = videoRef.current;\n const videoSrc = video.src || video.currentSrc;\n\n if (!videoSrc) {\n setError(\"No video source found\");\n return;\n }\n\n try {\n setIsDownloading(true);\n setError(null);\n setDownloadProgress(0);\n\n const link = document.createElement(\"a\");\n link.href = videoSrc;\n link.download = filename || `video-${Date.now()}.mp4`;\n link.target = \"_blank\";\n\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n\n setIsDownloading(false);\n setDownloadProgress(100);\n } catch (err) {\n setError(err instanceof Error ? err.message : \"Download failed\");\n setIsDownloading(false);\n setDownloadProgress(0);\n }\n },\n [videoRef]\n );\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n setIsDownloading(false);\n setDownloadProgress(0);\n setError(null);\n };\n }, []);\n\n return {\n downloadVideo,\n downloadDirect,\n isDownloading,\n downloadProgress,\n error,\n resetError: () => setError(null),\n };\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useRange = (videoRef: VideoRef, range: [number, number]) => {\n React.useEffect(() => {\n if (!videoRef?.current || !range) return;\n\n const video = videoRef.current;\n\n if (video) {\n const handleTimeUpdate = () => {\n if (video.currentTime >= range[1]) {\n video.currentTime = range[0];\n } else if (video.currentTime <= range[0]) {\n video.currentTime = range[0];\n }\n };\n\n video.addEventListener(\"timeupdate\", handleTimeUpdate);\n\n return () => {\n video.removeEventListener(\"timeupdate\", handleTimeUpdate);\n };\n }\n }, [range, videoRef?.current]);\n};\n","import React, { RefObject, useRef } from \"react\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useVideo } from \"./wrapper\";\nimport { useFullscreen } from \"./hooks/use-fullscreen\";\nimport { useSeek } from \"./hooks/use-seek\";\nimport { useMuteUnmute } from \"./hooks/use-mute-unmute\";\nimport { usePlayPause } from \"./hooks/use-play-pause\";\nimport { useCurrentTime } from \"./hooks/use-current-time\";\nimport { usePictureInPicture } from \"./hooks/use-picture-in-picture\";\nimport { useDownload } from \"./hooks/use-download\";\nimport { useSpeed } from \"./hooks\";\nimport { useLoading } from \"./hooks/use-loading\";\n\ninterface ControlsProps extends React.ComponentProps<\"div\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Controls = React.memo(\n ({ children, asChild, ...props }: ControlsProps) => {\n return (\n <div data-zuude-hide-elements {...props}>\n {children}\n </div>\n );\n }\n);\n\ninterface Props extends React.ComponentProps<\"button\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Play = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { play } = usePlayPause(videoRef as RefObject<HTMLVideoElement>);\n\n return (\n <Element {...props} onClick={play}>\n {children}\n </Element>\n );\n});\n\nconst Pause = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { pause } = usePlayPause(videoRef as RefObject<HTMLVideoElement>);\n\n return (\n <Element {...props} onClick={pause}>\n {children}\n </Element>\n );\n});\n\nconst Mute = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { mute } = useMuteUnmute(videoRef as RefObject<HTMLVideoElement>);\n\n return (\n <Element {...props} onClick={mute}>\n {children}\n </Element>\n );\n});\n\nconst Unmute = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { unmute } = useMuteUnmute(videoRef as RefObject<HTMLVideoElement>);\n\n return (\n <Element {...props} onClick={unmute}>\n {children}\n </Element>\n );\n});\n\ninterface SpeedProps extends Props {\n value: number;\n onClick?: () => void;\n}\n\nconst Speed = React.memo(\n ({ children, asChild, value, onClick, ...props }: SpeedProps) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { speed, onChangeSpeed } = useSpeed(\n videoRef as RefObject<HTMLVideoElement>\n );\n\n return (\n <Element\n {...props}\n value={value}\n onClick={() => {\n onChangeSpeed(value);\n onClick?.();\n }}\n >\n {children}\n </Element>\n );\n }\n);\n\nconst SeekForward = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { seekForward } = useSeek(videoRef as RefObject<HTMLVideoElement>, 10);\n\n return (\n <Element {...props} onClick={seekForward}>\n {children}\n </Element>\n );\n});\n\nconst SeekBackward = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { seekBackward } = useSeek(videoRef as RefObject<HTMLVideoElement>, 10);\n\n return (\n <Element {...props} onClick={seekBackward}>\n {children}\n </Element>\n );\n});\n\nconst Fullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { toggleFullscreen } = useFullscreen(videoRef);\n\n return (\n <Element {...props} onClick={toggleFullscreen}>\n {children}\n </Element>\n );\n});\n\nconst ExitFullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { toggleFullscreen } = useFullscreen(videoRef);\n\n return (\n <Element {...props} onClick={toggleFullscreen}>\n {children}\n </Element>\n );\n});\n\nconst PictureInPicture = React.memo(\n ({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { togglePictureInPicture } = usePictureInPicture(videoRef);\n\n return (\n <Element {...props} onClick={togglePictureInPicture}>\n {children}\n </Element>\n );\n }\n);\n\nconst Download = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { downloadDirect } = useDownload(videoRef);\n\n return (\n <Element {...props} onClick={() => downloadDirect()}>\n {children}\n </Element>\n );\n});\n\ninterface LoadingProps extends React.ComponentProps<\"div\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Loading = React.memo(({ children, asChild, ...props }: LoadingProps) => {\n const Element = asChild ? Slot : \"div\";\n const { videoRef } = useVideo();\n\n const { isLoading } = useLoading(videoRef);\n\n return (\n <Element\n {...props}\n style={{ ...props.style, pointerEvents: \"none\" }}\n data-loading={isLoading}\n >\n {children}\n </Element>\n );\n});\n\ninterface ShadowProps extends React.ComponentProps<\"div\"> {}\n\nconst Shadow = ({ ...props }: ShadowProps) => {\n const { videoRef } = useVideo();\n\n const shadowVideoRef = useRef<HTMLVideoElement>(null);\n\n React.useEffect(() => {\n const video = videoRef?.current;\n if (shadowVideoRef.current && video) {\n let currentTime = 0;\n let isPlaying = false;\n let interval: ReturnType<typeof setInterval> | null = null;\n\n const startInterval = () => {\n if (interval) clearInterval(interval);\n interval = setInterval(() => {\n console.log(\"currentTime\", video.currentTime);\n currentTime = video.currentTime;\n if (shadowVideoRef.current) {\n shadowVideoRef.current.currentTime = currentTime;\n }\n }, 100);\n };\n\n const stopInterval = () => {\n if (interval) {\n clearInterval(interval);\n interval = null;\n }\n };\n\n const handlePlay = () => {\n isPlaying = true;\n startInterval();\n };\n\n const handlePause = () => {\n isPlaying = false;\n stopInterval();\n };\n\n video.addEventListener(\"play\", handlePlay);\n video.addEventListener(\"pause\", handlePause);\n\n return () => {\n stopInterval();\n video.removeEventListener(\"play\", handlePlay);\n video.removeEventListener(\"pause\", handlePause);\n };\n }\n }, [videoRef?.current]);\n\n if (!videoRef?.current) return null;\n\n return (\n <div\n {...props}\n style={{\n ...props.style,\n position: \"absolute\",\n top: 0,\n left: 0,\n width: \"100%\",\n height: \"100%\",\n pointerEvents: \"none\",\n }}\n >\n <video\n ref={shadowVideoRef}\n src={videoRef.current.src}\n muted\n playsInline\n style={{\n width: \"100%\",\n height: \"100%\",\n objectFit: \"cover\",\n }}\n />\n </div>\n );\n};\n\nexport {\n Controls,\n Play,\n Pause,\n Mute,\n Unmute,\n Speed,\n SeekForward,\n SeekBackward,\n Fullscreen,\n ExitFullscreen,\n PictureInPicture,\n Download,\n Loading,\n Shadow,\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useLoading = (videoRef: VideoRef) => {\n const [isLoading, setIsLoading] = React.useState(false);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n const video = videoRef.current;\n\n const handleLoadStart = () => {\n setIsLoading(true);\n };\n\n const handleLoadedMetadata = () => {\n // Metadata loaded but video might not be ready to play yet\n // Keep loading true until canplay\n };\n\n const handleLoadedData = () => {\n // First frame loaded, but might still be buffering\n // Keep loading true until canplay\n };\n\n const handleCanPlay = () => {\n setIsLoading(false);\n };\n\n const handleCanPlayThrough = () => {\n setIsLoading(false);\n };\n\n const handleWaiting = () => {\n // Video is waiting for data (buffering)\n setIsLoading(true);\n };\n\n const handlePlaying = () => {\n // Video is playing, so it's not loading anymore\n setIsLoading(false);\n };\n\n const handleError = () => {\n setIsLoading(false);\n };\n\n const handleAbort = () => {\n setIsLoading(false);\n };\n\n const handleSuspend = () => {\n // Loading suspended (e.g., user paused)\n // Don't change loading state here\n };\n\n // Add event listeners\n video.addEventListener(\"loadstart\", handleLoadStart);\n video.addEventListener(\"loadedmetadata\", handleLoadedMetadata);\n video.addEventListener(\"loadeddata\", handleLoadedData);\n video.addEventListener(\"canplay\", handleCanPlay);\n video.addEventListener(\"canplaythrough\", handleCanPlayThrough);\n video.addEventListener(\"waiting\", handleWaiting);\n video.addEventListener(\"playing\", handlePlaying);\n video.addEventListener(\"error\", handleError);\n video.addEventListener(\"abort\", handleAbort);\n video.addEventListener(\"suspend\", handleSuspend);\n\n // Check initial state\n if (video.readyState >= 2) {\n setIsLoading(false);\n }\n\n return () => {\n // Remove event listeners\n video.removeEventListener(\"loadstart\", handleLoadStart);\n video.removeEventListener(\"loadedmetadata\", handleLoadedMetadata);\n video.removeEventListener(\"loadeddata\", handleLoadedData);\n video.removeEventListener(\"canplay\", handleCanPlay);\n video.removeEventListener(\"canplaythrough\", handleCanPlayThrough);\n video.removeEventListener(\"waiting\", handleWaiting);\n video.removeEventListener(\"playing\", handlePlaying);\n video.removeEventListener(\"error\", handleError);\n video.removeEventListener(\"abort\", handleAbort);\n video.removeEventListener(\"suspend\", handleSuspend);\n };\n }, [videoRef]);\n\n return { isLoading };\n};\n"],"mappings":"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","names":["React","createContext","useContext","useEffect","useRef","useState","jsx","VideoContext","VideoProvider","children","config","onError","props","videoRef","setVideoRef","error","setError","isFocused","setIsFocused","videoWrapperRef","videoWrapper","controls","video","hideTimeout","hideDelay","isMouseOver","resetTimer","control","showControls","hideControls","handleMouseMove","handlePlay","handleClick","event","_a","useVideo","context","forwardRef","useEffect","useRef","React","useAutoplayByForce","videoRef","enabled","setError","_a","error","retryError","useEffect","useHotKeys","key","func","enabled","handleKeyDown","event","React","useSeek","videoRef","value","seekForward","seekBackward","React","usePlayPause","videoRef","isPlaying","setIsPlaying","togglePlay","play","pause","handlePlay","handlePause","_a","_b","React","useMuteUnmute","videoRef","isMuted","setIsMuted","toggleMute","mute","unmute","handleVolumeChange","_a","React","useFullscreen","videoRef","isFullscreen","setIsFullscreen","handleFullscreenChange","toggleFullscreen","isSafari","video","videoContainer","usePictureInPicture","videoRef","video","error","videoContainer","Keyboards","videoRef","useVideo","seekForward","seekBackward","useSeek","togglePlay","usePlayPause","toggleMute","useMuteUnmute","toggleFullscreen","useFullscreen","togglePictureInPicture","usePictureInPicture","useHotKeys","React","useAutoplayOnVisible","videoRef","threshold","enabled","observer","entries","entry","_a","error","React","React","useSpeed","videoRef","speed","setSpeed","onChangeSpeed","React","React","useEffect","useState","React","React","useEffect","useState","useCallback","useDownload","videoRef","isDownloading","setIsDownloading","downloadProgress","setDownloadProgress","error","setError","downloadVideo","filename","_a","video","videoSrc","response","contentLength","total","reader","chunks","receivedLength","done","value","progress","blob","url","link","defaultFilename","err","downloadDirect","React","Fragment","jsx","jsxs","Video","forwardRef","src","autoPlay","muteFallback","controls","preload","autoPlayOnVisible","props","ref","videoRef","setVideoRef","config","setError","error","isFocused","useVideo","refVideo","useRef","useEffect","video","thirdPartyRef","useAutoplayByForce","useAutoplayOnVisible","onPlay","_a","_b","_c","Keyboards","React","useRef","Slot","React","useLoading","videoRef","isLoading","setIsLoading","video","handleLoadStart","handleLoadedMetadata","handleLoadedData","handleCanPlay","handleCanPlayThrough","handleWaiting","handlePlaying","handleError","handleAbort","handleSuspend","jsx","Controls","React","children","asChild","props","Play","Element","Slot","videoRef","useVideo","play","usePlayPause","Pause","pause","Mute","mute","useMuteUnmute","Unmute","unmute","Speed","value","onClick","speed","onChangeSpeed","useSpeed","SeekForward","seekForward","useSeek","SeekBackward","seekBackward","Fullscreen","toggleFullscreen","useFullscreen","ExitFullscreen","PictureInPicture","togglePictureInPicture","usePictureInPicture","Download","downloadDirect","useDownload","Loading","isLoading","useLoading","Shadow","shadowVideoRef","useRef","video","currentTime","isPlaying","interval","startInterval","stopInterval","handlePlay","handlePause"]}
|
|
1
|
+
{"version":3,"sources":["../src/wrapper.tsx","../src/video.tsx","../src/keyboard.tsx","../src/components.tsx","../src/hooks/use-loading.tsx"],"sourcesContent":["import React, {\n createContext,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { VideoRef } from \"./types\";\n\ninterface VideoConfig {\n config?: Partial<{\n clickToPlay: boolean;\n }>;\n}\n\ninterface VideoContextType extends VideoConfig {\n videoRef: VideoRef;\n setVideoRef: (video: VideoRef) => void;\n error: string | null;\n setError: (error: string | null) => void;\n isFocused: boolean;\n setIsFocused: (isFocused: boolean) => void;\n}\n\nexport const VideoContext = createContext<VideoContextType | null>(null);\n\ntype VideoProviderProps = Omit<React.ComponentProps<\"div\">, \"onError\"> &\n VideoConfig & {\n children: React.ReactNode;\n onError?: (error: string | null) => void;\n };\n\nexport const VideoProvider = React.memo(\n ({ children, config, onError, ...props }: VideoProviderProps) => {\n const [videoRef, setVideoRef] = useState<VideoRef>({ current: null });\n const [error, setError] = useState<string | null>(null);\n const [isFocused, setIsFocused] = useState(false);\n\n const videoWrapperRef = useRef<HTMLDivElement>(null);\n\n // Sending error to user if it exists\n useEffect(() => {\n onError?.(error);\n }, [error]);\n\n useEffect(() => {\n const videoWrapper = videoWrapperRef.current;\n if (videoWrapper) {\n const controls = videoWrapper.querySelectorAll(\n \"[data-zuude-hide-elements]\"\n );\n const video = videoWrapper.querySelector(\n \"[data-zuude-video]\"\n ) as HTMLVideoElement;\n\n if (controls) {\n let hideTimeout: ReturnType<typeof setTimeout> | null = null;\n const hideDelay = 3000; // 3 seconds delay\n let isMouseOver = false;\n\n const resetTimer = () => {\n // Clear any pending hide timeout\n if (hideTimeout) {\n clearTimeout(hideTimeout);\n hideTimeout = null;\n }\n\n // Start new timer to hide controls after delay\n hideTimeout = setTimeout(() => {\n if (isMouseOver) {\n // Check if video is paused - don't hide controls if paused\n if (video && !video.paused) {\n controls.forEach((control) => {\n control.setAttribute(\"data-hidden\", \"true\");\n });\n }\n }\n hideTimeout = null;\n }, hideDelay);\n };\n\n const showControls = () => {\n isMouseOver = true;\n controls.forEach((control) => {\n control.removeAttribute(\"data-hidden\");\n });\n resetTimer();\n };\n\n const hideControls = () => {\n isMouseOver = false;\n // Clear any pending hide timeout\n if (hideTimeout) {\n clearTimeout(hideTimeout);\n hideTimeout = null;\n }\n // Hide controls immediately when mouse leaves\n if (video && !video.paused) {\n controls.forEach((control) => {\n control.setAttribute(\"data-hidden\", \"true\");\n });\n }\n };\n\n const handleMouseMove = () => {\n if (isMouseOver) {\n // If controls are hidden, show them\n controls.forEach((control) => {\n if (control.hasAttribute(\"data-hidden\")) {\n control.removeAttribute(\"data-hidden\");\n }\n });\n resetTimer();\n }\n };\n\n const handlePlay = () => {\n // Hide controls when video starts playing (autoplay)\n if (!isMouseOver) {\n controls.forEach((control) => {\n control.setAttribute(\"data-hidden\", \"true\");\n });\n }\n };\n\n videoWrapper.addEventListener(\"mouseenter\", showControls);\n videoWrapper.addEventListener(\"mouseleave\", hideControls);\n videoWrapper.addEventListener(\"mousemove\", handleMouseMove);\n video.addEventListener(\"pause\", showControls);\n video.addEventListener(\"play\", handlePlay);\n\n // Cleanup function\n return () => {\n if (hideTimeout) {\n clearTimeout(hideTimeout);\n }\n videoWrapper.removeEventListener(\"mouseenter\", showControls);\n videoWrapper.removeEventListener(\"mouseleave\", hideControls);\n videoWrapper.removeEventListener(\"mousemove\", handleMouseMove);\n video.removeEventListener(\"pause\", showControls);\n video.removeEventListener(\"play\", handlePlay);\n };\n }\n }\n }, []);\n\n useEffect(() => {\n if (isFocused) {\n const handleClick = (event: MouseEvent) => {\n if (!videoWrapperRef.current?.contains(event.target as Node)) {\n setIsFocused(false);\n }\n };\n document.addEventListener(\"click\", handleClick);\n\n return () => {\n document.removeEventListener(\"click\", handleClick);\n };\n }\n }, [isFocused]);\n\n return (\n <VideoContext.Provider\n value={{\n videoRef,\n setVideoRef,\n config: { clickToPlay: true, ...config },\n error,\n setError,\n isFocused,\n setIsFocused,\n }}\n >\n <div\n ref={videoWrapperRef}\n data-zuude-video-wrapper\n onClick={() => setIsFocused(true)}\n {...props}\n >\n {children}\n </div>\n </VideoContext.Provider>\n );\n }\n);\n\nexport const useVideo = () => {\n const context = useContext(VideoContext);\n if (!context) {\n throw new Error(\"useVideo must be used within a VideoProvider\");\n }\n return context;\n};\n","import React, { forwardRef, RefObject, useEffect, useRef } from \"react\";\nimport { useVideo } from \"./wrapper\";\nimport { VideoAutoplay } from \"./types\";\nimport { useAutoplayByForce } from \"./hooks/use-autoplay-by-force\";\nimport { Keyboards } from \"./keyboard\";\nimport { useAutoplayOnVisible } from \"./hooks\";\n\ninterface Props\n extends Omit<React.ComponentProps<\"video\">, \"autoPlay\" | \"preload\"> {\n src: string;\n autoPlay?: VideoAutoplay;\n controls?: boolean;\n preload?: \"none\" | \"metadata\" | \"auto\";\n muteFallback?: (onMute: () => void) => React.ReactNode;\n autoPlayOnVisible?: boolean | number;\n ranges?: number[];\n}\n\nexport const Video = forwardRef<HTMLVideoElement, Props>(\n (\n {\n src,\n autoPlay,\n muteFallback,\n controls,\n preload = \"metadata\",\n autoPlayOnVisible,\n ranges,\n ...props\n },\n ref\n ) => {\n const { videoRef, setVideoRef, config, setError, error, isFocused } =\n useVideo();\n\n const refVideo = useRef<HTMLVideoElement>(null);\n\n useEffect(() => {\n const video = refVideo.current;\n const thirdPartyRef = ref;\n\n if (thirdPartyRef) {\n setVideoRef(thirdPartyRef as RefObject<HTMLVideoElement>);\n } else {\n if (video) {\n setVideoRef({ current: video });\n }\n }\n }, [src]);\n\n useAutoplayByForce(\n videoRef,\n autoPlay === \"force\" && props.muted === undefined,\n setError\n );\n\n useAutoplayOnVisible(\n videoRef,\n typeof autoPlayOnVisible === \"number\"\n ? autoPlayOnVisible\n : !autoPlayOnVisible\n ? 0.5\n : undefined,\n !!autoPlayOnVisible\n );\n\n const onPlay = () => {\n if (videoRef?.current?.paused) {\n videoRef.current?.play();\n } else {\n videoRef?.current?.pause();\n }\n };\n\n return (\n <>\n <video\n ref={ref || refVideo}\n data-zuude-video\n src={src}\n onClick={config?.clickToPlay ? onPlay : undefined}\n autoPlay={autoPlay === \"force\" ? true : autoPlay}\n preload={preload}\n playsInline\n onTimeUpdate={(e) => {\n if (ranges?.[0] !== undefined && ranges?.[1] !== undefined) {\n const currentTime = e.currentTarget.currentTime;\n if (currentTime >= ranges[1]) {\n e.currentTarget.currentTime = ranges[0];\n } else if (currentTime <= ranges[0]) {\n e.currentTarget.currentTime = ranges[0];\n }\n }\n }}\n {...props}\n />\n\n {controls && isFocused && <Keyboards />}\n\n {error === \"NotAllowedError\" &&\n typeof muteFallback === \"function\" &&\n muteFallback(() => {\n if (videoRef?.current) {\n videoRef.current.muted = !videoRef.current.muted;\n }\n setError(null);\n })}\n </>\n );\n }\n);\n\nVideo.displayName = \"Video\";\n","import { useVideo } from \"./wrapper\";\nimport { useHotKeys } from \"./hooks/use-hot-keys\";\nimport { useSeek } from \"./hooks/use-seek\";\nimport { usePlayPause } from \"./hooks/use-play-pause\";\nimport { useMuteUnmute } from \"./hooks/use-mute-unmute\";\nimport { useFullscreen } from \"./hooks/use-fullscreen\";\nimport { usePictureInPicture } from \"./hooks/use-picture-in-picture\";\n\nexport const Keyboards = () => {\n const { videoRef } = useVideo();\n\n const { seekForward, seekBackward } = useSeek(videoRef);\n const { togglePlay } = usePlayPause(videoRef);\n const { toggleMute } = useMuteUnmute(videoRef);\n const { toggleFullscreen } = useFullscreen(videoRef);\n const { togglePictureInPicture } = usePictureInPicture(videoRef);\n\n useHotKeys(\"ArrowRight\", () => {\n seekForward();\n });\n useHotKeys(\"ArrowLeft\", () => {\n seekBackward();\n });\n useHotKeys(\" \", () => {\n togglePlay();\n });\n useHotKeys(\"m\", () => {\n toggleMute();\n });\n useHotKeys(\"f\", () => {\n toggleFullscreen();\n });\n useHotKeys(\"p\", () => {\n togglePictureInPicture();\n });\n\n return null;\n};\n","import React, { RefObject, useRef } from \"react\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useVideo } from \"./wrapper\";\nimport { useFullscreen } from \"./hooks/use-fullscreen\";\nimport { useSeek } from \"./hooks/use-seek\";\nimport { useMuteUnmute } from \"./hooks/use-mute-unmute\";\nimport { usePlayPause } from \"./hooks/use-play-pause\";\nimport { useCurrentTime } from \"./hooks/use-current-time\";\nimport { usePictureInPicture } from \"./hooks/use-picture-in-picture\";\nimport { useDownload } from \"./hooks/use-download\";\nimport { useSpeed } from \"./hooks\";\nimport { useLoading } from \"./hooks/use-loading\";\n\ninterface ControlsProps extends React.ComponentProps<\"div\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Controls = React.memo(\n ({ children, asChild, ...props }: ControlsProps) => {\n return (\n <div data-zuude-hide-elements {...props}>\n {children}\n </div>\n );\n }\n);\n\ninterface Props extends React.ComponentProps<\"button\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Play = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { play } = usePlayPause(videoRef as RefObject<HTMLVideoElement>);\n\n return (\n <Element {...props} onClick={play}>\n {children}\n </Element>\n );\n});\n\nconst Pause = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { pause } = usePlayPause(videoRef as RefObject<HTMLVideoElement>);\n\n return (\n <Element {...props} onClick={pause}>\n {children}\n </Element>\n );\n});\n\nconst Mute = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { mute } = useMuteUnmute(videoRef as RefObject<HTMLVideoElement>);\n\n return (\n <Element {...props} onClick={mute}>\n {children}\n </Element>\n );\n});\n\nconst Unmute = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { unmute } = useMuteUnmute(videoRef as RefObject<HTMLVideoElement>);\n\n return (\n <Element {...props} onClick={unmute}>\n {children}\n </Element>\n );\n});\n\ninterface SpeedProps extends Props {\n value: number;\n onClick?: () => void;\n}\n\nconst Speed = React.memo(\n ({ children, asChild, value, onClick, ...props }: SpeedProps) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { speed, onChangeSpeed } = useSpeed(\n videoRef as RefObject<HTMLVideoElement>\n );\n\n return (\n <Element\n {...props}\n value={value}\n onClick={() => {\n onChangeSpeed(value);\n onClick?.();\n }}\n >\n {children}\n </Element>\n );\n }\n);\n\nconst SeekForward = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { seekForward } = useSeek(videoRef as RefObject<HTMLVideoElement>, 10);\n\n return (\n <Element {...props} onClick={seekForward}>\n {children}\n </Element>\n );\n});\n\nconst SeekBackward = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { seekBackward } = useSeek(videoRef as RefObject<HTMLVideoElement>, 10);\n\n return (\n <Element {...props} onClick={seekBackward}>\n {children}\n </Element>\n );\n});\n\nconst Fullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { toggleFullscreen } = useFullscreen(videoRef);\n\n return (\n <Element {...props} onClick={toggleFullscreen}>\n {children}\n </Element>\n );\n});\n\nconst ExitFullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { toggleFullscreen } = useFullscreen(videoRef);\n\n return (\n <Element {...props} onClick={toggleFullscreen}>\n {children}\n </Element>\n );\n});\n\nconst PictureInPicture = React.memo(\n ({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { togglePictureInPicture } = usePictureInPicture(videoRef);\n\n return (\n <Element {...props} onClick={togglePictureInPicture}>\n {children}\n </Element>\n );\n }\n);\n\nconst Download = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { downloadDirect } = useDownload(videoRef);\n\n return (\n <Element {...props} onClick={() => downloadDirect()}>\n {children}\n </Element>\n );\n});\n\ninterface LoadingProps extends React.ComponentProps<\"div\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Loading = React.memo(({ children, asChild, ...props }: LoadingProps) => {\n const Element = asChild ? Slot : \"div\";\n const { videoRef } = useVideo();\n\n const { isLoading } = useLoading(videoRef);\n\n return (\n <Element\n {...props}\n style={{ ...props.style, pointerEvents: \"none\" }}\n data-loading={isLoading}\n >\n {children}\n </Element>\n );\n});\n\ninterface ShadowProps extends React.ComponentProps<\"div\"> {}\n\nconst Shadow = ({ ...props }: ShadowProps) => {\n const { videoRef } = useVideo();\n\n const shadowVideoRef = useRef<HTMLVideoElement>(null);\n\n React.useEffect(() => {\n const video = videoRef?.current;\n if (shadowVideoRef.current && video) {\n let currentTime = 0;\n let isPlaying = false;\n let interval: ReturnType<typeof setInterval> | null = null;\n\n const startInterval = () => {\n if (interval) clearInterval(interval);\n interval = setInterval(() => {\n console.log(\"currentTime\", video.currentTime);\n currentTime = video.currentTime;\n if (shadowVideoRef.current) {\n shadowVideoRef.current.currentTime = currentTime;\n }\n }, 100);\n };\n\n const stopInterval = () => {\n if (interval) {\n clearInterval(interval);\n interval = null;\n }\n };\n\n const handlePlay = () => {\n isPlaying = true;\n startInterval();\n };\n\n const handlePause = () => {\n isPlaying = false;\n stopInterval();\n };\n\n video.addEventListener(\"play\", handlePlay);\n video.addEventListener(\"pause\", handlePause);\n\n return () => {\n stopInterval();\n video.removeEventListener(\"play\", handlePlay);\n video.removeEventListener(\"pause\", handlePause);\n };\n }\n }, [videoRef?.current]);\n\n if (!videoRef?.current) return null;\n\n return (\n <div\n {...props}\n style={{\n ...props.style,\n position: \"absolute\",\n top: 0,\n left: 0,\n width: \"100%\",\n height: \"100%\",\n pointerEvents: \"none\",\n }}\n >\n <video\n ref={shadowVideoRef}\n src={videoRef.current.src}\n muted\n playsInline\n style={{\n width: \"100%\",\n height: \"100%\",\n objectFit: \"cover\",\n }}\n />\n </div>\n );\n};\n\nexport {\n Controls,\n Play,\n Pause,\n Mute,\n Unmute,\n Speed,\n SeekForward,\n SeekBackward,\n Fullscreen,\n ExitFullscreen,\n PictureInPicture,\n Download,\n Loading,\n Shadow,\n};\n","import React from \"react\";\nimport type { VideoRef } from \"../types\";\n\nexport const useLoading = (videoRef: VideoRef) => {\n const [isLoading, setIsLoading] = React.useState(false);\n\n React.useEffect(() => {\n if (!videoRef?.current) return;\n\n const video = videoRef.current;\n\n const handleLoadStart = () => {\n setIsLoading(true);\n };\n\n const handleLoadedMetadata = () => {\n // Metadata loaded but video might not be ready to play yet\n // Keep loading true until canplay\n };\n\n const handleLoadedData = () => {\n // First frame loaded, but might still be buffering\n // Keep loading true until canplay\n };\n\n const handleCanPlay = () => {\n setIsLoading(false);\n };\n\n const handleCanPlayThrough = () => {\n setIsLoading(false);\n };\n\n const handleWaiting = () => {\n // Video is waiting for data (buffering)\n setIsLoading(true);\n };\n\n const handlePlaying = () => {\n // Video is playing, so it's not loading anymore\n setIsLoading(false);\n };\n\n const handleError = () => {\n setIsLoading(false);\n };\n\n const handleAbort = () => {\n setIsLoading(false);\n };\n\n const handleSuspend = () => {\n // Loading suspended (e.g., user paused)\n // Don't change loading state here\n };\n\n // Add event listeners\n video.addEventListener(\"loadstart\", handleLoadStart);\n video.addEventListener(\"loadedmetadata\", handleLoadedMetadata);\n video.addEventListener(\"loadeddata\", handleLoadedData);\n video.addEventListener(\"canplay\", handleCanPlay);\n video.addEventListener(\"canplaythrough\", handleCanPlayThrough);\n video.addEventListener(\"waiting\", handleWaiting);\n video.addEventListener(\"playing\", handlePlaying);\n video.addEventListener(\"error\", handleError);\n video.addEventListener(\"abort\", handleAbort);\n video.addEventListener(\"suspend\", handleSuspend);\n\n // Check initial state\n if (video.readyState >= 2) {\n setIsLoading(false);\n }\n\n return () => {\n // Remove event listeners\n video.removeEventListener(\"loadstart\", handleLoadStart);\n video.removeEventListener(\"loadedmetadata\", handleLoadedMetadata);\n video.removeEventListener(\"loadeddata\", handleLoadedData);\n video.removeEventListener(\"canplay\", handleCanPlay);\n video.removeEventListener(\"canplaythrough\", handleCanPlayThrough);\n video.removeEventListener(\"waiting\", handleWaiting);\n video.removeEventListener(\"playing\", handlePlaying);\n video.removeEventListener(\"error\", handleError);\n video.removeEventListener(\"abort\", handleAbort);\n video.removeEventListener(\"suspend\", handleSuspend);\n };\n }, [videoRef]);\n\n return { isLoading };\n};\n"],"mappings":"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","names":["React","createContext","useContext","useEffect","useRef","useState","jsx","VideoContext","VideoProvider","children","config","onError","props","videoRef","setVideoRef","error","setError","isFocused","setIsFocused","videoWrapperRef","videoWrapper","controls","video","hideTimeout","hideDelay","isMouseOver","resetTimer","control","showControls","hideControls","handleMouseMove","handlePlay","handleClick","event","_a","useVideo","context","forwardRef","useEffect","useRef","Keyboards","videoRef","useVideo","seekForward","seekBackward","useSeek","togglePlay","usePlayPause","toggleMute","useMuteUnmute","toggleFullscreen","useFullscreen","togglePictureInPicture","usePictureInPicture","useHotKeys","Fragment","jsx","jsxs","Video","forwardRef","src","autoPlay","muteFallback","controls","preload","autoPlayOnVisible","ranges","props","ref","videoRef","setVideoRef","config","setError","error","isFocused","useVideo","refVideo","useRef","useEffect","video","thirdPartyRef","useAutoplayByForce","useAutoplayOnVisible","onPlay","_a","_b","_c","e","currentTime","Keyboards","React","useRef","Slot","React","useLoading","videoRef","isLoading","setIsLoading","video","handleLoadStart","handleLoadedMetadata","handleLoadedData","handleCanPlay","handleCanPlayThrough","handleWaiting","handlePlaying","handleError","handleAbort","handleSuspend","jsx","Controls","React","children","asChild","props","Play","Element","Slot","videoRef","useVideo","play","usePlayPause","Pause","pause","Mute","mute","useMuteUnmute","Unmute","unmute","Speed","value","onClick","speed","onChangeSpeed","useSpeed","SeekForward","seekForward","useSeek","SeekBackward","seekBackward","Fullscreen","toggleFullscreen","useFullscreen","ExitFullscreen","PictureInPicture","togglePictureInPicture","usePictureInPicture","Download","downloadDirect","useDownload","Loading","isLoading","useLoading","Shadow","shadowVideoRef","useRef","video","currentTime","isPlaying","interval","startInterval","stopInterval","handlePlay","handlePause"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { RefObject } from 'react';
|
|
2
|
+
|
|
3
|
+
type VideoAutoplay = boolean | "force";
|
|
4
|
+
type CustomVideoRef = RefObject<(Omit<HTMLVideoElement, "autoplay"> & {
|
|
5
|
+
autoplay?: VideoAutoplay;
|
|
6
|
+
}) | null>;
|
|
7
|
+
type VideoRef = RefObject<HTMLVideoElement | null> | null;
|
|
8
|
+
|
|
9
|
+
export type { CustomVideoRef as C, VideoRef as V, VideoAutoplay as a };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { RefObject } from 'react';
|
|
2
|
+
|
|
3
|
+
type VideoAutoplay = boolean | "force";
|
|
4
|
+
type CustomVideoRef = RefObject<(Omit<HTMLVideoElement, "autoplay"> & {
|
|
5
|
+
autoplay?: VideoAutoplay;
|
|
6
|
+
}) | null>;
|
|
7
|
+
type VideoRef = RefObject<HTMLVideoElement | null> | null;
|
|
8
|
+
|
|
9
|
+
export type { CustomVideoRef as C, VideoRef as V, VideoAutoplay as a };
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"publishConfig": {
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
|
-
"version": "0.1.
|
|
6
|
+
"version": "0.1.25",
|
|
7
7
|
"main": "./dist/index.js",
|
|
8
8
|
"module": "./dist/index.mjs",
|
|
9
9
|
"types": "./dist/index.d.ts",
|
|
@@ -45,6 +45,6 @@
|
|
|
45
45
|
"@radix-ui/react-slot": "^1.1.2"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
|
-
"@types/react": "^19.
|
|
48
|
+
"@types/react": "^19.1.12"
|
|
49
49
|
}
|
|
50
50
|
}
|
package/dist/chunk-WLYC6MHJ.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import a from"react";var u=(o,c,r)=>{a.useEffect(()=>{if(!(o!=null&&o.current)||!c)return;(async()=>{var l;try{await((l=o.current)==null?void 0:l.play())}catch(t){if(t instanceof Error&&t.name==="NotAllowedError"){if(r==null||r("NotAllowedError"),console.error("NotAllowedError"),o!=null&&o.current){o.current.muted=!0;try{await o.current.play()}catch(n){console.error(n)}}}else console.error(t)}})()},[c,o==null?void 0:o.current])};export{u as a};
|
|
2
|
-
//# sourceMappingURL=chunk-WLYC6MHJ.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/use-autoplay-by-force.tsx"],"sourcesContent":["import React from \"react\";\nimport { VideoRef } from \"../types.js\";\n\nexport const useAutoplayByForce = (\n ref: VideoRef | null,\n enabled: boolean,\n setError?: (error: string | null) => void\n) => {\n React.useEffect(() => {\n if (!ref?.current || !enabled) return;\n\n const playVideo = async () => {\n try {\n await ref.current?.play();\n } catch (error) {\n // If autoplay fails, try muting and playing again\n if (error instanceof Error && error.name === \"NotAllowedError\") {\n setError?.(\"NotAllowedError\");\n console.error(\"NotAllowedError\");\n if (ref?.current) {\n ref.current.muted = true;\n try {\n await ref.current.play();\n } catch (retryError) {\n console.error(retryError);\n }\n }\n } else {\n console.error(error);\n }\n }\n };\n\n playVideo();\n }, [enabled, ref?.current]);\n};\n"],"mappings":"AAAA,OAAOA,MAAW,QAGX,IAAMC,EAAqB,CAChCC,EACAC,EACAC,IACG,CACHJ,EAAM,UAAU,IAAM,CACpB,GAAI,EAACE,GAAA,MAAAA,EAAK,UAAW,CAACC,EAAS,QAEb,SAAY,CAXlC,IAAAE,EAYM,GAAI,CACF,OAAMA,EAAAH,EAAI,UAAJ,YAAAG,EAAa,OACrB,OAASC,EAAO,CAEd,GAAIA,aAAiB,OAASA,EAAM,OAAS,mBAG3C,GAFAF,GAAA,MAAAA,EAAW,mBACX,QAAQ,MAAM,iBAAiB,EAC3BF,GAAA,MAAAA,EAAK,QAAS,CAChBA,EAAI,QAAQ,MAAQ,GACpB,GAAI,CACF,MAAMA,EAAI,QAAQ,KAAK,CACzB,OAASK,EAAY,CACnB,QAAQ,MAAMA,CAAU,CAC1B,CACF,OAEA,QAAQ,MAAMD,CAAK,CAEvB,CACF,GAEU,CACZ,EAAG,CAACH,EAASD,GAAA,YAAAA,EAAK,OAAO,CAAC,CAC5B","names":["React","useAutoplayByForce","ref","enabled","setError","_a","error","retryError"]}
|
package/dist/new/index.cjs
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";"use client";var S=Object.create;var h=Object.defineProperty;var O=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var B=(e,r)=>{for(var n in r)h(e,n,{get:r[n],enumerable:!0})},v=(e,r,n,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let t of j(r))!q.call(e,t)&&t!==n&&h(e,t,{get:()=>r[t],enumerable:!(c=O(r,t))||c.enumerable});return e};var g=(e,r,n)=>(n=e!=null?S(R(e)):{},v(r||!e||!e.__esModule?h(n,"default",{value:e,enumerable:!0}):n,e)),z=e=>v(h({},"__esModule",{value:!0}),e);var _={};B(_,{Controls:()=>U,ExitFullscreen:()=>Y,Fullscreen:()=>X,Loading:()=>Z,Mute:()=>J,Pause:()=>G,Play:()=>D,SeekBackward:()=>W,SeekForward:()=>Q,Unmute:()=>K,Video:()=>b,VideoProvider:()=>T,useFullscreen:()=>y,useVideoState:()=>I});module.exports=z(_);var d=require("react"),k=require("react/jsx-runtime"),w=(0,d.createContext)(void 0),T=({children:e,config:r,onError:n,...c})=>{let[t,o]=(0,d.useState)(null),[s,l]=(0,d.useState)(null);return(0,d.useEffect)(()=>{n==null||n(s)},[s]),(0,k.jsx)(w.Provider,{value:{videoRef:t,setVideoRef:o,config:{clickToPlay:!0,...r},error:s,setError:l},children:(0,k.jsx)("div",{"data-zuude-video-wrapper":!0,...c,children:e})})},u=()=>{let e=(0,d.useContext)(w);if(!e)throw new Error("useVideo must be used within a VideoProvider");return e};var f=require("react");var M=g(require("react"),1),A=(e,r,n)=>{M.default.useEffect(()=>{if(!(e!=null&&e.current)||!r)return;(async()=>{var t;try{await((t=e.current)==null?void 0:t.play())}catch(o){if(o instanceof Error&&o.name==="NotAllowedError"){if(n==null||n("NotAllowedError"),console.error("NotAllowedError"),e!=null&&e.current){e.current.muted=!0;try{await e.current.play()}catch(s){console.error(s)}}}else console.error(o)}})()},[r,e==null?void 0:e.current])};var E=require("react/jsx-runtime"),b=(0,f.forwardRef)(({src:e,autoPlay:r,muteFallback:n,...c},t)=>{let{videoRef:o,setVideoRef:s,config:l,setError:C,error:N}=u(),x=(0,f.useRef)(null);(0,f.useEffect)(()=>{let V=x.current,P=t;P?s(P):V&&s({current:V})},[e]),A(o,r==="force"&&c.muted===void 0,C);let H=()=>{var V,P,L;(V=o==null?void 0:o.current)!=null&&V.paused?(P=o.current)==null||P.play():(L=o==null?void 0:o.current)==null||L.pause()};return(0,E.jsxs)(E.Fragment,{children:[(0,E.jsx)("video",{ref:t||x,src:e,onClick:l!=null&&l.clickToPlay?H:void 0,autoPlay:r==="force"?!0:r,...c}),N==="NotAllowedError"&&typeof n=="function"&&n(()=>{o!=null&&o.current&&(o.current.muted=!o.current.muted),C(null)})]})});b.displayName="Video";var a=g(require("react"),1),m=require("@radix-ui/react-slot");var p=require("react"),F=g(require("react"),1),I=e=>{let[r,n]=(0,p.useState)(!1),[c,t]=(0,p.useState)(!1),[o,s]=(0,p.useState)(!1);return(0,p.useEffect)(()=>{let l=e.current;if(l)return l.addEventListener("play",()=>n(!0)),l.addEventListener("pause",()=>n(!1)),()=>{l.removeEventListener("play",()=>n(!0)),l.removeEventListener("pause",()=>n(!1))}},[e]),(0,p.useEffect)(()=>{if(!(e!=null&&e.current))return;t(e.current.muted);let l=()=>{e.current&&t(e.current.muted)};return e.current.addEventListener("volumechange",l),()=>{var C;(C=e.current)==null||C.removeEventListener("volumechange",l)}},[e]),(0,p.useEffect)(()=>{if(!(e!=null&&e.current))return;let l=()=>{s(!!document.fullscreenElement)};return document.addEventListener("fullscreenchange",l),()=>document.removeEventListener("fullscreenchange",l)},[e]),{isPlaying:r,isMuted:c,isFullscreen:o}},y=e=>{let[r,n]=F.default.useState(!1);F.default.useEffect(()=>{let t=()=>{n==null||n(!!document.fullscreenElement),c()};return document.addEventListener("fullscreenchange",t),()=>document.removeEventListener("fullscreenchange",t)},[r]);let c=()=>{console.log("toggleFullscreen");let t=/^((?!chrome|android).)*safari/i.test(navigator.userAgent),o=e;if(o&&t){if(o.webkitEnterFullscreen){o.webkitEnterFullscreen();return}else if(o.requestFullscreen){o.requestFullscreen();return}}let s=o==null?void 0:o.closest("[data-zuude-video-wrapper]");s&&(r?(document.exitFullscreen(),o&&(o.style.objectFit="cover")):(s.requestFullscreen(),o&&(o.style.objectFit="contain")))};return{isFullscreen:r!=null?r:!1,toggleFullscreen:c}};var i=require("react/jsx-runtime"),U=a.default.memo(({children:e,asChild:r,...n})=>(0,i.jsx)("div",{...n,children:e})),D=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{var s,l;(s=t==null?void 0:t.current)!=null&&s.paused&&((l=t.current)==null||l.play())},children:e})}),G=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{var s;t!=null&&t.current&&((s=t.current)==null||s.pause())},children:e})}),J=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{t!=null&&t.current&&(t.current.muted=!0)},children:e})}),K=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{t!=null&&t.current&&(t.current.muted=!1)},children:e})}),Q=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{t!=null&&t.current&&(t.current.currentTime+=10)},children:e})}),W=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{t!=null&&t.current&&(t.current.currentTime-=10)},children:e})}),X=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u(),{toggleFullscreen:o}=y(t==null?void 0:t.current);return(0,i.jsx)(c,{...n,onClick:o,children:e})}),Y=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u(),{toggleFullscreen:o}=y(t==null?void 0:t.current);return(0,i.jsx)(c,{...n,onClick:o,children:e})}),Z=()=>(0,i.jsx)("div",{children:"Loading"});0&&(module.exports={Controls,ExitFullscreen,Fullscreen,Loading,Mute,Pause,Play,SeekBackward,SeekForward,Unmute,Video,VideoProvider,useFullscreen,useVideoState});
|
|
2
|
-
//# sourceMappingURL=index.cjs.map
|
package/dist/new/index.cjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/new/index.ts","../../src/new/wrapper.tsx","../../src/new/video.tsx","../../src/hooks/use-autoplay-by-force.tsx","../../src/new/components.tsx","../../src/new/hook.tsx"],"sourcesContent":["\"use client\";\n\nexport { VideoProvider } from \"./wrapper\";\nexport { Video } from \"./video\";\nexport * from \"./components\";\nexport * from \"./hook\";\n","import {\n createContext,\n RefObject,\n useContext,\n useEffect,\n useState,\n} from \"react\";\nimport { VideoRef } from \"./types\";\n\ninterface VideoConfig {\n config?: Partial<{\n clickToPlay: boolean;\n }>;\n}\n\ninterface VideoContextType extends VideoConfig {\n videoRef: VideoRef | null;\n setVideoRef: (video: VideoRef | null) => void;\n error: string | null;\n setError: (error: string | null) => void;\n}\n\nexport const VideoContext = createContext<VideoContextType | undefined>(\n undefined\n);\n\ntype VideoProviderProps = React.ComponentProps<\"div\"> &\n VideoConfig & {\n children: React.ReactNode;\n onError?: (error: string | null) => void;\n };\n\nexport const VideoProvider = ({\n children,\n config,\n onError,\n ...props\n}: VideoProviderProps) => {\n const [videoRef, setVideoRef] = useState<VideoRef | null>(null);\n const [error, setError] = useState<string | null>(null);\n\n // Sending error to user if it exists\n useEffect(() => {\n onError?.(error);\n }, [error]);\n\n return (\n <VideoContext.Provider\n value={{\n videoRef,\n setVideoRef,\n config: { clickToPlay: true, ...config },\n error,\n setError,\n }}\n >\n <div data-zuude-video-wrapper {...props}>\n {children}\n </div>\n </VideoContext.Provider>\n );\n};\n\nexport const useVideo = () => {\n const context = useContext(VideoContext);\n if (!context) {\n throw new Error(\"useVideo must be used within a VideoProvider\");\n }\n return context;\n};\n","import React, { forwardRef, RefObject, useEffect, useRef } from \"react\";\nimport { useVideo } from \"./wrapper\";\nimport { VideoAutoplay } from \"./types\";\nimport { useAutoplayByForce } from \"../hooks/use-autoplay-by-force\";\n\ninterface Props extends Omit<React.ComponentProps<\"video\">, \"autoPlay\"> {\n src: string;\n autoPlay?: VideoAutoplay;\n muteFallback?: (onMute: () => void) => React.ReactNode;\n}\n\nexport const Video = forwardRef<HTMLVideoElement, Props>(\n ({ src, autoPlay, muteFallback, ...props }, ref) => {\n const { videoRef, setVideoRef, config, setError, error } = useVideo();\n\n const refVideo = useRef<HTMLVideoElement>(null);\n\n useEffect(() => {\n const video = refVideo.current;\n const thirdPartyRef = ref;\n\n if (thirdPartyRef) {\n setVideoRef(thirdPartyRef as RefObject<HTMLVideoElement>);\n } else {\n if (video) {\n setVideoRef({ current: video });\n }\n }\n }, [src]);\n\n useAutoplayByForce(\n videoRef,\n autoPlay === \"force\" && props.muted === undefined,\n setError\n );\n\n const onPlay = () => {\n if (videoRef?.current?.paused) {\n videoRef.current?.play();\n } else {\n videoRef?.current?.pause();\n }\n };\n\n return (\n <>\n <video\n ref={ref || refVideo}\n src={src}\n onClick={config?.clickToPlay ? onPlay : undefined}\n autoPlay={autoPlay === \"force\" ? true : autoPlay}\n {...props}\n />\n\n {error === \"NotAllowedError\" &&\n typeof muteFallback === \"function\" &&\n muteFallback(() => {\n if (videoRef?.current) {\n videoRef.current.muted = !videoRef.current.muted;\n }\n setError(null);\n })}\n </>\n );\n }\n);\n\nVideo.displayName = \"Video\";\n","import React from \"react\";\nimport { VideoRef } from \"../types.js\";\n\nexport const useAutoplayByForce = (\n ref: VideoRef | null,\n enabled: boolean,\n setError?: (error: string | null) => void\n) => {\n React.useEffect(() => {\n if (!ref?.current || !enabled) return;\n\n const playVideo = async () => {\n try {\n await ref.current?.play();\n } catch (error) {\n // If autoplay fails, try muting and playing again\n if (error instanceof Error && error.name === \"NotAllowedError\") {\n setError?.(\"NotAllowedError\");\n console.error(\"NotAllowedError\");\n if (ref?.current) {\n ref.current.muted = true;\n try {\n await ref.current.play();\n } catch (retryError) {\n console.error(retryError);\n }\n }\n } else {\n console.error(error);\n }\n }\n };\n\n playVideo();\n }, [enabled, ref?.current]);\n};\n","import React from \"react\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useVideo } from \"./wrapper\";\nimport { useFullscreen } from \"./hook\";\n\ninterface ControlsProps extends React.ComponentProps<\"div\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Controls = React.memo(\n ({ children, asChild, ...props }: ControlsProps) => {\n return <div {...props}>{children}</div>;\n }\n);\n\ninterface Props extends React.ComponentProps<\"button\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Play = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current?.paused) {\n videoRef.current?.play();\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst Pause = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current?.pause();\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst Mute = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current.muted = true;\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst Unmute = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current.muted = false;\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst SeekForward = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current.currentTime += 10;\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst SeekBackward = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current.currentTime -= 10;\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst Fullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { toggleFullscreen } = useFullscreen(\n videoRef?.current as HTMLVideoElement | null\n );\n\n return (\n <Element {...props} onClick={toggleFullscreen}>\n {children}\n </Element>\n );\n});\n\nconst ExitFullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { toggleFullscreen } = useFullscreen(\n videoRef?.current as HTMLVideoElement | null\n );\n\n return (\n <Element {...props} onClick={toggleFullscreen}>\n {children}\n </Element>\n );\n});\n\nconst Loading = () => {\n return <div>Loading</div>;\n};\n\nexport {\n Controls,\n Play,\n Pause,\n Mute,\n Unmute,\n SeekForward,\n SeekBackward,\n Fullscreen,\n ExitFullscreen,\n Loading,\n};\n","import { RefObject, useEffect, useState } from \"react\";\n\nconst useVideoState = (videoRef: RefObject<HTMLVideoElement | null>) => {\n const [isPlaying, setIsPlaying] = useState(false);\n const [isMuted, setIsMuted] = useState(false);\n const [isFullscreen, setIsFullscreen] = useState(false);\n\n useEffect(() => {\n const video = videoRef.current;\n\n if (video) {\n video.addEventListener(\"play\", () => setIsPlaying(true));\n video.addEventListener(\"pause\", () => setIsPlaying(false));\n\n return () => {\n video.removeEventListener(\"play\", () => setIsPlaying(true));\n video.removeEventListener(\"pause\", () => setIsPlaying(false));\n };\n }\n }, [videoRef]);\n\n useEffect(() => {\n if (!videoRef?.current) return;\n\n // Set the initial state\n setIsMuted(videoRef.current.muted);\n\n const handleVolumeChange = () => {\n if (videoRef.current) {\n setIsMuted(videoRef.current.muted);\n }\n };\n\n videoRef.current.addEventListener(\"volumechange\", handleVolumeChange);\n\n return () => {\n videoRef.current?.removeEventListener(\"volumechange\", handleVolumeChange);\n };\n }, [videoRef]);\n\n useEffect(() => {\n if (!videoRef?.current) return;\n\n const handleFullscreenChange = () => {\n setIsFullscreen(!!document.fullscreenElement);\n };\n\n document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n return () =>\n document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n }, [videoRef]);\n\n return { isPlaying, isMuted, isFullscreen };\n};\n\nimport React from \"react\";\n\nconst useFullscreen = (videoRef: HTMLVideoElement | null) => {\n const [isFullscreen, setIsFullscreen] = React.useState(false);\n\n React.useEffect(() => {\n const handleFullscreenChange = () => {\n setIsFullscreen?.(!!document.fullscreenElement);\n toggleFullscreen();\n };\n\n document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n return () =>\n document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n }, [isFullscreen]);\n\n const toggleFullscreen = () => {\n console.log(\"toggleFullscreen\");\n const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);\n const video = videoRef;\n\n if (video && isSafari) {\n if ((video as any).webkitEnterFullscreen) {\n (video as any).webkitEnterFullscreen();\n return;\n } else if (video.requestFullscreen) {\n video.requestFullscreen();\n return;\n }\n }\n\n const videoContainer = video?.closest(\n \"[data-zuude-video-wrapper]\"\n ) as HTMLElement;\n\n if (videoContainer) {\n if (!isFullscreen) {\n videoContainer.requestFullscreen();\n if (video) {\n video.style.objectFit = \"contain\";\n }\n } else {\n document.exitFullscreen();\n if (video) {\n video.style.objectFit = \"cover\";\n }\n }\n }\n };\n\n return { isFullscreen: isFullscreen ?? false, toggleFullscreen };\n};\n\nexport { useVideoState, useFullscreen };\n"],"mappings":"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","names":["new_exports","__export","Controls","ExitFullscreen","Fullscreen","Loading","Mute","Pause","Play","SeekBackward","SeekForward","Unmute","Video","VideoProvider","useFullscreen","useVideoState","__toCommonJS","import_react","import_jsx_runtime","VideoContext","VideoProvider","children","config","onError","props","videoRef","setVideoRef","error","setError","useVideo","context","import_react","import_react","useAutoplayByForce","ref","enabled","setError","React","_a","error","retryError","import_jsx_runtime","Video","src","autoPlay","muteFallback","props","ref","videoRef","setVideoRef","config","setError","error","useVideo","refVideo","video","thirdPartyRef","useAutoplayByForce","onPlay","_a","_b","_c","import_react","import_react_slot","import_react","useVideoState","videoRef","isPlaying","setIsPlaying","isMuted","setIsMuted","isFullscreen","setIsFullscreen","video","handleVolumeChange","_a","handleFullscreenChange","useFullscreen","React","toggleFullscreen","isSafari","videoContainer","import_jsx_runtime","Controls","React","children","asChild","props","Play","Element","videoRef","useVideo","_a","_b","Pause","Mute","Unmute","SeekForward","SeekBackward","Fullscreen","toggleFullscreen","useFullscreen","ExitFullscreen","Loading"]}
|
package/dist/new/index.d.cts
DELETED
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import React$1, { RefObject } from 'react';
|
|
3
|
-
|
|
4
|
-
type VideoAutoplay = boolean | "force";
|
|
5
|
-
|
|
6
|
-
interface VideoConfig {
|
|
7
|
-
config?: Partial<{
|
|
8
|
-
clickToPlay: boolean;
|
|
9
|
-
}>;
|
|
10
|
-
}
|
|
11
|
-
type VideoProviderProps = React.ComponentProps<"div"> & VideoConfig & {
|
|
12
|
-
children: React.ReactNode;
|
|
13
|
-
onError?: (error: string | null) => void;
|
|
14
|
-
};
|
|
15
|
-
declare const VideoProvider: ({ children, config, onError, ...props }: VideoProviderProps) => react_jsx_runtime.JSX.Element;
|
|
16
|
-
|
|
17
|
-
interface Props$1 extends Omit<React$1.ComponentProps<"video">, "autoPlay"> {
|
|
18
|
-
src: string;
|
|
19
|
-
autoPlay?: VideoAutoplay;
|
|
20
|
-
muteFallback?: (onMute: () => void) => React$1.ReactNode;
|
|
21
|
-
}
|
|
22
|
-
declare const Video: React$1.ForwardRefExoticComponent<Omit<Props$1, "ref"> & React$1.RefAttributes<HTMLVideoElement>>;
|
|
23
|
-
|
|
24
|
-
interface ControlsProps extends React$1.ComponentProps<"div"> {
|
|
25
|
-
children: React$1.ReactNode;
|
|
26
|
-
asChild?: boolean;
|
|
27
|
-
}
|
|
28
|
-
declare const Controls: React$1.MemoExoticComponent<({ children, asChild, ...props }: ControlsProps) => react_jsx_runtime.JSX.Element>;
|
|
29
|
-
interface Props extends React$1.ComponentProps<"button"> {
|
|
30
|
-
children: React$1.ReactNode;
|
|
31
|
-
asChild?: boolean;
|
|
32
|
-
}
|
|
33
|
-
declare const Play: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
34
|
-
declare const Pause: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
35
|
-
declare const Mute: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
36
|
-
declare const Unmute: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
37
|
-
declare const SeekForward: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
38
|
-
declare const SeekBackward: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
39
|
-
declare const Fullscreen: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
40
|
-
declare const ExitFullscreen: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
41
|
-
declare const Loading: () => react_jsx_runtime.JSX.Element;
|
|
42
|
-
|
|
43
|
-
declare const useVideoState: (videoRef: RefObject<HTMLVideoElement | null>) => {
|
|
44
|
-
isPlaying: boolean;
|
|
45
|
-
isMuted: boolean;
|
|
46
|
-
isFullscreen: boolean;
|
|
47
|
-
};
|
|
48
|
-
declare const useFullscreen: (videoRef: HTMLVideoElement | null) => {
|
|
49
|
-
isFullscreen: boolean;
|
|
50
|
-
toggleFullscreen: () => void;
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
export { Controls, ExitFullscreen, Fullscreen, Loading, Mute, Pause, Play, SeekBackward, SeekForward, Unmute, Video, VideoProvider, useFullscreen, useVideoState };
|
package/dist/new/index.d.ts
DELETED
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import React$1, { RefObject } from 'react';
|
|
3
|
-
|
|
4
|
-
type VideoAutoplay = boolean | "force";
|
|
5
|
-
|
|
6
|
-
interface VideoConfig {
|
|
7
|
-
config?: Partial<{
|
|
8
|
-
clickToPlay: boolean;
|
|
9
|
-
}>;
|
|
10
|
-
}
|
|
11
|
-
type VideoProviderProps = React.ComponentProps<"div"> & VideoConfig & {
|
|
12
|
-
children: React.ReactNode;
|
|
13
|
-
onError?: (error: string | null) => void;
|
|
14
|
-
};
|
|
15
|
-
declare const VideoProvider: ({ children, config, onError, ...props }: VideoProviderProps) => react_jsx_runtime.JSX.Element;
|
|
16
|
-
|
|
17
|
-
interface Props$1 extends Omit<React$1.ComponentProps<"video">, "autoPlay"> {
|
|
18
|
-
src: string;
|
|
19
|
-
autoPlay?: VideoAutoplay;
|
|
20
|
-
muteFallback?: (onMute: () => void) => React$1.ReactNode;
|
|
21
|
-
}
|
|
22
|
-
declare const Video: React$1.ForwardRefExoticComponent<Omit<Props$1, "ref"> & React$1.RefAttributes<HTMLVideoElement>>;
|
|
23
|
-
|
|
24
|
-
interface ControlsProps extends React$1.ComponentProps<"div"> {
|
|
25
|
-
children: React$1.ReactNode;
|
|
26
|
-
asChild?: boolean;
|
|
27
|
-
}
|
|
28
|
-
declare const Controls: React$1.MemoExoticComponent<({ children, asChild, ...props }: ControlsProps) => react_jsx_runtime.JSX.Element>;
|
|
29
|
-
interface Props extends React$1.ComponentProps<"button"> {
|
|
30
|
-
children: React$1.ReactNode;
|
|
31
|
-
asChild?: boolean;
|
|
32
|
-
}
|
|
33
|
-
declare const Play: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
34
|
-
declare const Pause: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
35
|
-
declare const Mute: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
36
|
-
declare const Unmute: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
37
|
-
declare const SeekForward: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
38
|
-
declare const SeekBackward: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
39
|
-
declare const Fullscreen: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
40
|
-
declare const ExitFullscreen: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
|
|
41
|
-
declare const Loading: () => react_jsx_runtime.JSX.Element;
|
|
42
|
-
|
|
43
|
-
declare const useVideoState: (videoRef: RefObject<HTMLVideoElement | null>) => {
|
|
44
|
-
isPlaying: boolean;
|
|
45
|
-
isMuted: boolean;
|
|
46
|
-
isFullscreen: boolean;
|
|
47
|
-
};
|
|
48
|
-
declare const useFullscreen: (videoRef: HTMLVideoElement | null) => {
|
|
49
|
-
isFullscreen: boolean;
|
|
50
|
-
toggleFullscreen: () => void;
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
export { Controls, ExitFullscreen, Fullscreen, Loading, Mute, Pause, Play, SeekBackward, SeekForward, Unmute, Video, VideoProvider, useFullscreen, useVideoState };
|
package/dist/new/index.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use client";import{a as g}from"../chunk-WLYC6MHJ.js";import{createContext as T,useContext as M,useEffect as w,useState as k}from"react";import{jsx as y}from"react/jsx-runtime";var b=T(void 0),H=({children:t,config:o,onError:r,...c})=>{let[e,n]=k(null),[s,l]=k(null);return w(()=>{r==null||r(s)},[s]),y(b.Provider,{value:{videoRef:e,setVideoRef:n,config:{clickToPlay:!0,...o},error:s,setError:l},children:y("div",{"data-zuude-video-wrapper":!0,...c,children:t})})},u=()=>{let t=M(b);if(!t)throw new Error("useVideo must be used within a VideoProvider");return t};import{forwardRef as S,useEffect as N,useRef as O}from"react";import{Fragment as j,jsx as A,jsxs as q}from"react/jsx-runtime";var F=S(({src:t,autoPlay:o,muteFallback:r,...c},e)=>{let{videoRef:n,setVideoRef:s,config:l,setError:m,error:L}=u(),P=O(null);N(()=>{let f=P.current,p=e;p?s(p):f&&s({current:f})},[t]),g(n,o==="force"&&c.muted===void 0,m);let v=()=>{var f,p,h;(f=n==null?void 0:n.current)!=null&&f.paused?(p=n.current)==null||p.play():(h=n==null?void 0:n.current)==null||h.pause()};return q(j,{children:[A("video",{ref:e||P,src:t,onClick:l!=null&&l.clickToPlay?v:void 0,autoPlay:o==="force"?!0:o,...c}),L==="NotAllowedError"&&typeof r=="function"&&r(()=>{n!=null&&n.current&&(n.current.muted=!n.current.muted),m(null)})]})});F.displayName="Video";import a from"react";import{Slot as d}from"@radix-ui/react-slot";import{useEffect as E,useState as C}from"react";import x from"react";var Z=t=>{let[o,r]=C(!1),[c,e]=C(!1),[n,s]=C(!1);return E(()=>{let l=t.current;if(l)return l.addEventListener("play",()=>r(!0)),l.addEventListener("pause",()=>r(!1)),()=>{l.removeEventListener("play",()=>r(!0)),l.removeEventListener("pause",()=>r(!1))}},[t]),E(()=>{if(!(t!=null&&t.current))return;e(t.current.muted);let l=()=>{t.current&&e(t.current.muted)};return t.current.addEventListener("volumechange",l),()=>{var m;(m=t.current)==null||m.removeEventListener("volumechange",l)}},[t]),E(()=>{if(!(t!=null&&t.current))return;let l=()=>{s(!!document.fullscreenElement)};return document.addEventListener("fullscreenchange",l),()=>document.removeEventListener("fullscreenchange",l)},[t]),{isPlaying:o,isMuted:c,isFullscreen:n}},V=t=>{let[o,r]=x.useState(!1);x.useEffect(()=>{let e=()=>{r==null||r(!!document.fullscreenElement),c()};return document.addEventListener("fullscreenchange",e),()=>document.removeEventListener("fullscreenchange",e)},[o]);let c=()=>{console.log("toggleFullscreen");let e=/^((?!chrome|android).)*safari/i.test(navigator.userAgent),n=t;if(n&&e){if(n.webkitEnterFullscreen){n.webkitEnterFullscreen();return}else if(n.requestFullscreen){n.requestFullscreen();return}}let s=n==null?void 0:n.closest("[data-zuude-video-wrapper]");s&&(o?(document.exitFullscreen(),n&&(n.style.objectFit="cover")):(s.requestFullscreen(),n&&(n.style.objectFit="contain")))};return{isFullscreen:o!=null?o:!1,toggleFullscreen:c}};import{jsx as i}from"react/jsx-runtime";var oe=a.memo(({children:t,asChild:o,...r})=>i("div",{...r,children:t})),ce=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{var s,l;(s=e==null?void 0:e.current)!=null&&s.paused&&((l=e.current)==null||l.play())},children:t})}),le=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{var s;e!=null&&e.current&&((s=e.current)==null||s.pause())},children:t})}),se=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{e!=null&&e.current&&(e.current.muted=!0)},children:t})}),ue=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{e!=null&&e.current&&(e.current.muted=!1)},children:t})}),ie=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{e!=null&&e.current&&(e.current.currentTime+=10)},children:t})}),ae=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{e!=null&&e.current&&(e.current.currentTime-=10)},children:t})}),de=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u(),{toggleFullscreen:n}=V(e==null?void 0:e.current);return i(c,{...r,onClick:n,children:t})}),me=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u(),{toggleFullscreen:n}=V(e==null?void 0:e.current);return i(c,{...r,onClick:n,children:t})}),fe=()=>i("div",{children:"Loading"});export{oe as Controls,me as ExitFullscreen,de as Fullscreen,fe as Loading,se as Mute,le as Pause,ce as Play,ae as SeekBackward,ie as SeekForward,ue as Unmute,F as Video,H as VideoProvider,V as useFullscreen,Z as useVideoState};
|
|
2
|
-
//# sourceMappingURL=index.js.map
|
package/dist/new/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/new/wrapper.tsx","../../src/new/video.tsx","../../src/new/components.tsx","../../src/new/hook.tsx"],"sourcesContent":["import {\n createContext,\n RefObject,\n useContext,\n useEffect,\n useState,\n} from \"react\";\nimport { VideoRef } from \"./types\";\n\ninterface VideoConfig {\n config?: Partial<{\n clickToPlay: boolean;\n }>;\n}\n\ninterface VideoContextType extends VideoConfig {\n videoRef: VideoRef | null;\n setVideoRef: (video: VideoRef | null) => void;\n error: string | null;\n setError: (error: string | null) => void;\n}\n\nexport const VideoContext = createContext<VideoContextType | undefined>(\n undefined\n);\n\ntype VideoProviderProps = React.ComponentProps<\"div\"> &\n VideoConfig & {\n children: React.ReactNode;\n onError?: (error: string | null) => void;\n };\n\nexport const VideoProvider = ({\n children,\n config,\n onError,\n ...props\n}: VideoProviderProps) => {\n const [videoRef, setVideoRef] = useState<VideoRef | null>(null);\n const [error, setError] = useState<string | null>(null);\n\n // Sending error to user if it exists\n useEffect(() => {\n onError?.(error);\n }, [error]);\n\n return (\n <VideoContext.Provider\n value={{\n videoRef,\n setVideoRef,\n config: { clickToPlay: true, ...config },\n error,\n setError,\n }}\n >\n <div data-zuude-video-wrapper {...props}>\n {children}\n </div>\n </VideoContext.Provider>\n );\n};\n\nexport const useVideo = () => {\n const context = useContext(VideoContext);\n if (!context) {\n throw new Error(\"useVideo must be used within a VideoProvider\");\n }\n return context;\n};\n","import React, { forwardRef, RefObject, useEffect, useRef } from \"react\";\nimport { useVideo } from \"./wrapper\";\nimport { VideoAutoplay } from \"./types\";\nimport { useAutoplayByForce } from \"../hooks/use-autoplay-by-force\";\n\ninterface Props extends Omit<React.ComponentProps<\"video\">, \"autoPlay\"> {\n src: string;\n autoPlay?: VideoAutoplay;\n muteFallback?: (onMute: () => void) => React.ReactNode;\n}\n\nexport const Video = forwardRef<HTMLVideoElement, Props>(\n ({ src, autoPlay, muteFallback, ...props }, ref) => {\n const { videoRef, setVideoRef, config, setError, error } = useVideo();\n\n const refVideo = useRef<HTMLVideoElement>(null);\n\n useEffect(() => {\n const video = refVideo.current;\n const thirdPartyRef = ref;\n\n if (thirdPartyRef) {\n setVideoRef(thirdPartyRef as RefObject<HTMLVideoElement>);\n } else {\n if (video) {\n setVideoRef({ current: video });\n }\n }\n }, [src]);\n\n useAutoplayByForce(\n videoRef,\n autoPlay === \"force\" && props.muted === undefined,\n setError\n );\n\n const onPlay = () => {\n if (videoRef?.current?.paused) {\n videoRef.current?.play();\n } else {\n videoRef?.current?.pause();\n }\n };\n\n return (\n <>\n <video\n ref={ref || refVideo}\n src={src}\n onClick={config?.clickToPlay ? onPlay : undefined}\n autoPlay={autoPlay === \"force\" ? true : autoPlay}\n {...props}\n />\n\n {error === \"NotAllowedError\" &&\n typeof muteFallback === \"function\" &&\n muteFallback(() => {\n if (videoRef?.current) {\n videoRef.current.muted = !videoRef.current.muted;\n }\n setError(null);\n })}\n </>\n );\n }\n);\n\nVideo.displayName = \"Video\";\n","import React from \"react\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useVideo } from \"./wrapper\";\nimport { useFullscreen } from \"./hook\";\n\ninterface ControlsProps extends React.ComponentProps<\"div\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Controls = React.memo(\n ({ children, asChild, ...props }: ControlsProps) => {\n return <div {...props}>{children}</div>;\n }\n);\n\ninterface Props extends React.ComponentProps<\"button\"> {\n children: React.ReactNode;\n asChild?: boolean;\n}\n\nconst Play = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current?.paused) {\n videoRef.current?.play();\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst Pause = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current?.pause();\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst Mute = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current.muted = true;\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst Unmute = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current.muted = false;\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst SeekForward = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current.currentTime += 10;\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst SeekBackward = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const handleClick = () => {\n if (videoRef?.current) {\n videoRef.current.currentTime -= 10;\n }\n };\n\n return (\n <Element {...props} onClick={handleClick}>\n {children}\n </Element>\n );\n});\n\nconst Fullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { toggleFullscreen } = useFullscreen(\n videoRef?.current as HTMLVideoElement | null\n );\n\n return (\n <Element {...props} onClick={toggleFullscreen}>\n {children}\n </Element>\n );\n});\n\nconst ExitFullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n const Element = asChild ? Slot : \"button\";\n const { videoRef } = useVideo();\n\n const { toggleFullscreen } = useFullscreen(\n videoRef?.current as HTMLVideoElement | null\n );\n\n return (\n <Element {...props} onClick={toggleFullscreen}>\n {children}\n </Element>\n );\n});\n\nconst Loading = () => {\n return <div>Loading</div>;\n};\n\nexport {\n Controls,\n Play,\n Pause,\n Mute,\n Unmute,\n SeekForward,\n SeekBackward,\n Fullscreen,\n ExitFullscreen,\n Loading,\n};\n","import { RefObject, useEffect, useState } from \"react\";\n\nconst useVideoState = (videoRef: RefObject<HTMLVideoElement | null>) => {\n const [isPlaying, setIsPlaying] = useState(false);\n const [isMuted, setIsMuted] = useState(false);\n const [isFullscreen, setIsFullscreen] = useState(false);\n\n useEffect(() => {\n const video = videoRef.current;\n\n if (video) {\n video.addEventListener(\"play\", () => setIsPlaying(true));\n video.addEventListener(\"pause\", () => setIsPlaying(false));\n\n return () => {\n video.removeEventListener(\"play\", () => setIsPlaying(true));\n video.removeEventListener(\"pause\", () => setIsPlaying(false));\n };\n }\n }, [videoRef]);\n\n useEffect(() => {\n if (!videoRef?.current) return;\n\n // Set the initial state\n setIsMuted(videoRef.current.muted);\n\n const handleVolumeChange = () => {\n if (videoRef.current) {\n setIsMuted(videoRef.current.muted);\n }\n };\n\n videoRef.current.addEventListener(\"volumechange\", handleVolumeChange);\n\n return () => {\n videoRef.current?.removeEventListener(\"volumechange\", handleVolumeChange);\n };\n }, [videoRef]);\n\n useEffect(() => {\n if (!videoRef?.current) return;\n\n const handleFullscreenChange = () => {\n setIsFullscreen(!!document.fullscreenElement);\n };\n\n document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n return () =>\n document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n }, [videoRef]);\n\n return { isPlaying, isMuted, isFullscreen };\n};\n\nimport React from \"react\";\n\nconst useFullscreen = (videoRef: HTMLVideoElement | null) => {\n const [isFullscreen, setIsFullscreen] = React.useState(false);\n\n React.useEffect(() => {\n const handleFullscreenChange = () => {\n setIsFullscreen?.(!!document.fullscreenElement);\n toggleFullscreen();\n };\n\n document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n return () =>\n document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n }, [isFullscreen]);\n\n const toggleFullscreen = () => {\n console.log(\"toggleFullscreen\");\n const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);\n const video = videoRef;\n\n if (video && isSafari) {\n if ((video as any).webkitEnterFullscreen) {\n (video as any).webkitEnterFullscreen();\n return;\n } else if (video.requestFullscreen) {\n video.requestFullscreen();\n return;\n }\n }\n\n const videoContainer = video?.closest(\n \"[data-zuude-video-wrapper]\"\n ) as HTMLElement;\n\n if (videoContainer) {\n if (!isFullscreen) {\n videoContainer.requestFullscreen();\n if (video) {\n video.style.objectFit = \"contain\";\n }\n } else {\n document.exitFullscreen();\n if (video) {\n video.style.objectFit = \"cover\";\n }\n }\n }\n };\n\n return { isFullscreen: isFullscreen ?? false, toggleFullscreen };\n};\n\nexport { useVideoState, useFullscreen };\n"],"mappings":"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","names":["createContext","useContext","useEffect","useState","jsx","VideoContext","VideoProvider","children","config","onError","props","videoRef","setVideoRef","error","setError","useVideo","context","forwardRef","useEffect","useRef","Fragment","jsx","jsxs","Video","forwardRef","src","autoPlay","muteFallback","props","ref","videoRef","setVideoRef","config","setError","error","useVideo","refVideo","useRef","useEffect","video","thirdPartyRef","useAutoplayByForce","onPlay","_a","_b","_c","React","Slot","useEffect","useState","React","useVideoState","videoRef","isPlaying","setIsPlaying","isMuted","setIsMuted","isFullscreen","setIsFullscreen","video","handleVolumeChange","_a","handleFullscreenChange","useFullscreen","toggleFullscreen","isSafari","videoContainer","jsx","Controls","React","children","asChild","props","Play","Element","Slot","videoRef","useVideo","_a","_b","Pause","Mute","Unmute","SeekForward","SeekBackward","Fullscreen","toggleFullscreen","useFullscreen","ExitFullscreen","Loading"]}
|