@devix-technologies/react-gjirafa-vp-player 1.0.12 → 1.0.13

package/dist/react-gjirafa-vp-player.es.js

@@ -1640,7 +1640,7 @@ const gr = ne.div`
           playlistVideoIndex: Number(u),
           // Remove first video from playlist to avoid duplication (already in file)
           videos: r.slice(1).map((I, E) => ({
-            videoId: String(E),
+            videoId: String(E + 1),
             // Keep original IDs
             title: I.title,
             file: I.hlsUrl,

package/dist/react-gjirafa-vp-player.umd.js

@@ -81,4 +81,4 @@ React keys must be passed directly to JSX without using spread:
  @media (min-width: 768px) {
    width: min(70vw, 960px); /* Responsive width for desktop, capped at 960px */
  }
-`,vr=(e,t)=>`https://vp-api.gjirafa.tech/api/v2/projects/${e}/videos?search=${t}`,wr=(e,t)=>`https://vp-api.gjirafa.tech/api/projects/${e}/playlists/${t}/videos`,xr=e=>`https://host.vpplayer.tech/player/${e}/vpplayer.js`,Ne=(e,t)=>`vp-player-${e||"default"}-${t||""}`,$e=new Map,dt=(e,t)=>{const[r,n]=P.useState(!1),[a,i]=P.useState(null);return P.useEffect(()=>{let s=null,c,d=0;const m=3;let l;try{l=t||xr(e||"latest")}catch(x){const b=x instanceof Error?x.message:String(x);i(`Failed to resolve script URL: ${b}`),n(!1);return}if($e.get(l)){n(!0),i(null);return}if(document.querySelector(`script[src="${l}"]`)){$e.set(l,!0),n(!0),i(null);return}const g=()=>{s=document.createElement("script"),s.src=l,s.async=!0,c=window.setTimeout(()=>{n(!1),i(`Loading script timed out: ${l}`)},1e4),s.onload=()=>{clearTimeout(c),$e.set(l,!0),n(!0),i(null)},s.onerror=()=>{clearTimeout(c),d++,d<m?setTimeout(g,1e3*d):(n(!1),i(`Failed to load VP Player script after ${m} attempts: ${l}`))},document.body.appendChild(s)};return g(),()=>{clearTimeout(c),s&&document.body.contains(s)&&document.body.removeChild(s)}},[e,t]),{isLoaded:r,error:a}},Pr={},Ee=new Map,kr=3e4,Ve=5,ft=({projectId:e,videoId:t,playlistId:r,videoUrl:n,apiKey:a})=>{const[i,s]=P.useState(null),[c,d]=P.useState(null),[m,l]=P.useState(!1),[p,g]=P.useState(null),x=a||(typeof Pr<"u"?"1CFC4B619E9342B6BAC4879BA8C30CF216C4BA9D3F084B11825F4AB2D5CF845E":void 0);return P.useEffect(()=>{const b=t?`video:${t}`:r?`playlist:${r}`:null;if(!e||n||!t&&!r){s(n||null),d(null),l(!1),g(null);return}if(!x){l(!1),g("No API key provided");return}if(b&&Ee.has(b)){const R=Ee.get(b);s(R.url),d(R.playlist),l(!1),g(null);return}let f=!0;const h=new AbortController,y=h.signal,A=setTimeout(async()=>{var C,T;if(!f)return;l(!0),g(null);let R=0;for(;R<Ve&&f;)try{const u=t&&!r?vr(e,t):wr(e,r),I=setTimeout(()=>h.abort(),kr),j=await fetch(u,{method:"GET",headers:{"api-key":x,Accept:"application/json","Cache-Control":"no-cache"},signal:y});if(clearTimeout(I),!j.ok)throw new Error(`Fetch failed with status ${j.status}`);const _=await j.json();if(!f)return;if(t&&!r){const N=(T=(C=_.result)==null?void 0:C.items)==null?void 0:T.find(X=>X.mediaId===t);if(!(N!=null&&N.playbackUrl))throw new Error("Invalid video data");s(N.playbackUrl),d(null),b&&Ee.set(b,{url:N.playbackUrl,playlist:null})}else{if(!Array.isArray(_.result))throw new Error("Invalid playlist format");d(_.result),s(null),b&&Ee.set(b,{url:null,playlist:_.result})}break}catch(u){if(y.aborted){f&&g("Request timed out");break}if(R++,R>=Ve){const I=u instanceof Error?u.message:String(u);f&&g(`Failed after ${Ve} attempts: ${I}`)}else await new Promise(I=>setTimeout(I,2e3))}f&&l(!1)},100);return()=>{f=!1,clearTimeout(A),h.abort()}},[x,e,t,r,n]),{fetchedPlaybackUrl:i,fetchedPlaylist:c,isLoading:m,error:p}},Er={projectId:"vp-player-projectId",video:{file:"",playlist:{state:!0,playlistVideoIndex:0,videos:[]}},config:{autoplay:!0,muted:!0,loop:!1,size:{width:"100%",height:"30vh"},controls:{settingsButton:!0,chromecastButton:!1,nextButton:!0,fullscreenButton:!0,airplayButton:!1,bigPlayButton:!1,autopausePlayButton:!0,pictureInPictureButton:!1,relatedButton:!1,volumeButton:!0,shareButton:!0}}},pt=({videoUrl:e,fetchedPlaybackUrl:t,fetchedPlaylist:r,projectId:n,config:a={},isVerticalPlayer:i})=>{var l,p,g,x,b,f,h,y,w,A,R,C,T;const s={...Er,...a},c={...s.config,...a.config};if(e)return{...s,video:{...s.video,file:e,playlist:void 0},config:c};if(t)return{...s,video:{...s.video,file:t,playlist:void 0},config:c};if(r&&r.length>0){const u=((p=(l=a==null?void 0:a.video)==null?void 0:l.playlist)==null?void 0:p.playlistVideoIndex)??((g=a==null?void 0:a.config)==null?void 0:g.playlistVideoIndex)??0;return i?{...s,projectId:n||"vp-player-projectId",video:{...s.video,file:(x=r[0])==null?void 0:x.hlsUrl,title:(b=r[0])==null?void 0:b.title,playlist:{state:!0,playlistId:"",playlistVideoIndex:Number(u),videos:r.slice(1).map((j,_)=>({videoId:String(_),title:j.title,file:j.hlsUrl,thumbnailUrl:j.thumbnailUrl,duration:j.duration}))}},config:c}:{...s,projectId:n||"vp-player-projectId",video:{...s.video,file:((f=r[Number(u)])==null?void 0:f.hlsUrl)||((h=r[0])==null?void 0:h.hlsUrl)||"",title:((y=r[Number(u)])==null?void 0:y.title)||((w=r[0])==null?void 0:w.title),thumbnail:((A=r[Number(u)])==null?void 0:A.thumbnailUrl)||((R=r[0])==null?void 0:R.thumbnailUrl),playlist:{state:!0,playlistVideoIndex:Number(u),videos:r.map((j,_)=>({videoId:String(_),title:j.title,file:j.hlsUrl,thumbnailUrl:j.thumbnailUrl,duration:j.duration}))}},config:c}}const d=((C=a==null?void 0:a.video)==null?void 0:C.playlist)||s.video.playlist,m=(T=a==null?void 0:a.video)==null?void 0:T.file;if(m)return{...s,video:{...s.video,file:m,playlist:void 0},config:c};if(d!=null&&d.videos&&d.videos.length>0){const u=d.videos[Number(d.playlistVideoIndex)||0];return{...s,video:{...s.video,file:(u==null?void 0:u.file)||"",playlist:{...d,state:d.state??!0,playlistVideoIndex:Number(d.playlistVideoIndex||0),videos:d.videos}},config:{...s.config,...a==null?void 0:a.config}}}throw new Error("No valid video source found. Provide videoUrl, videoId, playlistId, or config with video.file or playlist.")},ht=e=>{if(!e)return;const t=/https:\/\/host\.vpplayer\.tech\/player\/([^/]+)\/([^/]+)(?:\/[^/]+)?\.js/,r=e.match(t);return r?r[2]:void 0},mt=({playerId:e,videoId:t,version:r,videoUrl:n,projectId:a,playlistId:i,scriptUrl:s,config:c={},apiKey:d,isReels:m=!1})=>{const l=P.useRef(null),p=P.useRef(null),{isLoaded:g,error:x}=dt(r,s),b=t||ht(s),[f,h]=P.useState(null),{fetchedPlaybackUrl:y,fetchedPlaylist:w,isLoading:A,error:R}=ft({projectId:a,videoId:b,playlistId:i,videoUrl:n,apiKey:d}),C=Ne(e,b),T=P.useMemo(()=>{const u=c.config||{},I=m&&!u.size?{sizeType:"RESPONSIVE",aspectRatio:"9:16"}:u.size||{sizeType:"FIXED",width:"100%"};return{...c,config:{...u,size:I}}},[c,m]);return P.useEffect(()=>{if(x){h(x);return}if(!g||A&&!n)return;let u=!0;const j=setTimeout(async()=>{try{const _=s==null?void 0:s.includes("vertical-player");if(document.querySelectorAll('[id*="player"]').forEach(ae=>{var pe,he;const Z=ae.id;if(Z!==C)try{const o=_?(pe=window.vpVerticalPlayer)==null?void 0:pe.call(window,Z):(he=window.vpPlayer)==null?void 0:he.call(window,Z);o!=null&&o.destroy&&o.destroy()}catch(o){console.warn(`Failed to destroy existing player ${Z}:`,o)}}),await new Promise(ae=>setTimeout(ae,100)),!u||!l.current)return;if(!document.getElementById(C)){h("DOM element not found after cleanup.");return}if(!window.vpPlayer&&!window.vpVerticalPlayer){h("VP Player script not loaded.");return}const z=_?window.vpVerticalPlayer:window.vpPlayer;if(!z){h(`VP ${_?"Vertical ":""}Player script not loaded.`);return}const K=pt({videoUrl:n,fetchedPlaybackUrl:y??void 0,fetchedPlaylist:w??void 0,projectId:a,config:T,isVerticalPlayer:_}),ne=z(C);if(!ne){h(`Failed to create VP ${_?"Vertical ":""}Player instance.`);return}u&&l.current&&(ne.setup(K),p.current=ne,h(null))}catch(_){if(u){const N=_ instanceof Error?_.message:String(_);h(N),console.error("VP Player initialization error:",_)}}},150);return()=>{u=!1,clearTimeout(j)}},[g,A,n,y,w,a,T,C,x,s]),P.useEffect(()=>()=>{if(p.current){try{p.current.destroy&&p.current.destroy()}catch(I){console.warn(`Failed to destroy player ${C}:`,I)}p.current=null}const u=document.getElementById(C);u&&(u.innerHTML="")},[C]),{playerRef:l,playerInstanceRef:p,isScriptLoaded:g,isLoading:A,error:R||f||x}},yt=({playerId:e,videoId:t,version:r,videoUrl:n,projectId:a,playlistId:i,scriptUrl:s,config:c={},apiKey:d,isReels:m=!1,hiddenClasses:l=[],onClose:p,className:g})=>{var j,_,N,X;const{playerRef:x,playerInstanceRef:b,isScriptLoaded:f,isLoading:h,error:y}=mt({playerId:e,videoId:t,version:r,videoUrl:n,projectId:a,playlistId:i,scriptUrl:s,config:c,apiKey:d,isReels:m}),[w,A]=P.useState(!0),R=()=>m&&A(!0),C=()=>{var z,K;A(!1),(K=(z=b.current)==null?void 0:z.play)==null||K.call(z),p==null||p()},T=(_=(j=c==null?void 0:c.config)==null?void 0:j.size)!=null&&_.width?typeof c.config.size.width=="number"?`${c.config.size.width}px`:c.config.size.width:void 0,u=(X=(N=c==null?void 0:c.config)==null?void 0:N.size)!=null&&X.height?typeof c.config.size.height=="number"?`${c.config.size.height}px`:c.config.size.height:void 0,I=Ne(e,t);return y?$.jsxs(je,{type:"error",children:["An error occurred: ",y]}):h||!f?$.jsx(je,{type:"loading",children:"Loading..."}):$.jsxs($.Fragment,{children:[m&&!w?$.jsx("div",{onClick:R}):null,!m&&$.jsx("div",{children:$.jsx(Le,{id:I,ref:x,width:T||"100%",height:u||"auto",$hiddenClasses:l,className:g})},I),m&&w&&$.jsx(lt,{onClick:C,className:g,children:$.jsx(ut,{className:g,onClick:z=>z.stopPropagation(),children:$.jsx("div",{children:$.jsx(Le,{id:I,ref:x,width:"100%",height:"auto",$hiddenClasses:l,className:g})},I)})})]})},gt=P.createContext(void 0),_r=({children:e})=>{const[t,r]=P.useState(!1),[n,a]=P.useState(null),[i,s]=P.useState(null),c=P.useCallback(l=>{try{const p=Ne(l.playerId,l.videoId);a({...l,playerId:p}),r(!0),s(null)}catch{s("Failed to show player.")}},[]),d=P.useCallback(()=>{r(!1),a(null),s(null)},[]),m=P.useMemo(()=>({showPlayer:c,hidePlayer:d,isPlayerVisible:t,playerParams:n}),[c,d,t,n]);return $.jsxs(gt.Provider,{value:m,children:[e,i&&$.jsx(je,{type:"error",children:i}),t&&(n==null?void 0:n.playerId)&&$.jsx(yt,{playerId:n.playerId,videoId:n.videoId,projectId:n.projectId,videoUrl:n.videoUrl,version:n.version,playlistId:n.playlistId,scriptUrl:n.scriptUrl,config:n.config,isReels:n.isReels,thumbnailUrl:n.thumbnailUrl,onClose:d,hiddenClasses:n.hiddenClasses||[],apiKey:n.apiKey,className:n.className})]})},Sr=()=>{const e=P.useContext(gt);if(!e)throw new Error("useVPPlayer must be used within a VPPlayerProvider");return e},Ar={projectId:"vp-player-projectId",video:{file:"",playlist:{state:!0,playlistVideoIndex:0,videos:[]}},config:{autoplay:!0,pauseOtherVideos:!0,focusOnAutostart:!1,muted:!0,loop:!1,size:{width:"100%"},controls:{settingsButton:!0,chromecastButton:!1,nextButton:!1,fullscreenButton:!0,airplayButton:!1,bigPlayButton:!1,autopausePlayButton:!0,pictureInPictureButton:!1,relatedButton:!1,volumeButton:!0,shareButton:!0}}},Cr={config:{autostartOnLoad:{state:!0,onMobile:!0,onData:!0},muted:!0}},Tr={config:{autoplay:!0,muted:!0}},_e={video:{advertising:!0,ads:{skipAd:{state:!0,skipFrom:5}}},config:{adAnnouncement:{state:!0,timeBeforeAd:5},adsRequireInteraction:!1}},Rr=(e,t,r="time",n=0)=>{var a;return{..._e,video:{..._e.video,ads:{...(a=_e.video)==null?void 0:a.ads,adBreaks:[{adTagUrl:t,breakType:e,breakTimingType:r,breakTimingValue:n}]}}}},Ir="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4",Or="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4",jr="https://videos.pexels.com/video-files/4678261/4678261-hd_1080_1920_25fps.mp4",Lr="https://images.pexels.com/videos/4678261/pexels-photo-4678261.jpeg?auto=compress&cs=tinysrgb&w=600",Nr="https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=",$r="https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dskippablelinear&correlator=";S.AD_TAG_LINEAR_URL=Nr,S.AD_TAG_SKIPPABLE_LINEAR_URL=$r,S.BIG_BUCK_BUNNY_URL=Ir,S.ELEPHANTS_DREAM_URL=Or,S.Overlay=lt,S.PEXELS_THUMBNAIL_URL=Lr,S.PEXELS_VERTICAL_VIDEO_URL=jr,S.PlayerContainer=Le,S.PlayerWrapper=ut,S.VPPlayer=yt,S.VPPlayerProvider=_r,S.baseConfig=Cr,S.baseConfigWithAds=_e,S.baseConfigWithAutoplay=Tr,S.buildVPPlayerConfig=pt,S.defaultVPPlayerConfig=Ar,S.extractVideoId=ht,S.getAdConfig=Rr,S.useVPPlayer=Sr,S.useVPPlayerLogic=mt,S.useVPPlayerScript=dt,S.useVideoData=ft,Object.defineProperty(S,Symbol.toStringTag,{value:"Module"})});
+`,vr=(e,t)=>`https://vp-api.gjirafa.tech/api/v2/projects/${e}/videos?search=${t}`,wr=(e,t)=>`https://vp-api.gjirafa.tech/api/projects/${e}/playlists/${t}/videos`,xr=e=>`https://host.vpplayer.tech/player/${e}/vpplayer.js`,Ne=(e,t)=>`vp-player-${e||"default"}-${t||""}`,$e=new Map,dt=(e,t)=>{const[r,n]=P.useState(!1),[a,i]=P.useState(null);return P.useEffect(()=>{let s=null,c,d=0;const m=3;let l;try{l=t||xr(e||"latest")}catch(x){const b=x instanceof Error?x.message:String(x);i(`Failed to resolve script URL: ${b}`),n(!1);return}if($e.get(l)){n(!0),i(null);return}if(document.querySelector(`script[src="${l}"]`)){$e.set(l,!0),n(!0),i(null);return}const g=()=>{s=document.createElement("script"),s.src=l,s.async=!0,c=window.setTimeout(()=>{n(!1),i(`Loading script timed out: ${l}`)},1e4),s.onload=()=>{clearTimeout(c),$e.set(l,!0),n(!0),i(null)},s.onerror=()=>{clearTimeout(c),d++,d<m?setTimeout(g,1e3*d):(n(!1),i(`Failed to load VP Player script after ${m} attempts: ${l}`))},document.body.appendChild(s)};return g(),()=>{clearTimeout(c),s&&document.body.contains(s)&&document.body.removeChild(s)}},[e,t]),{isLoaded:r,error:a}},Pr={},Ee=new Map,kr=3e4,Ve=5,ft=({projectId:e,videoId:t,playlistId:r,videoUrl:n,apiKey:a})=>{const[i,s]=P.useState(null),[c,d]=P.useState(null),[m,l]=P.useState(!1),[p,g]=P.useState(null),x=a||(typeof Pr<"u"?"1CFC4B619E9342B6BAC4879BA8C30CF216C4BA9D3F084B11825F4AB2D5CF845E":void 0);return P.useEffect(()=>{const b=t?`video:${t}`:r?`playlist:${r}`:null;if(!e||n||!t&&!r){s(n||null),d(null),l(!1),g(null);return}if(!x){l(!1),g("No API key provided");return}if(b&&Ee.has(b)){const R=Ee.get(b);s(R.url),d(R.playlist),l(!1),g(null);return}let f=!0;const h=new AbortController,y=h.signal,A=setTimeout(async()=>{var C,T;if(!f)return;l(!0),g(null);let R=0;for(;R<Ve&&f;)try{const u=t&&!r?vr(e,t):wr(e,r),I=setTimeout(()=>h.abort(),kr),j=await fetch(u,{method:"GET",headers:{"api-key":x,Accept:"application/json","Cache-Control":"no-cache"},signal:y});if(clearTimeout(I),!j.ok)throw new Error(`Fetch failed with status ${j.status}`);const _=await j.json();if(!f)return;if(t&&!r){const N=(T=(C=_.result)==null?void 0:C.items)==null?void 0:T.find(X=>X.mediaId===t);if(!(N!=null&&N.playbackUrl))throw new Error("Invalid video data");s(N.playbackUrl),d(null),b&&Ee.set(b,{url:N.playbackUrl,playlist:null})}else{if(!Array.isArray(_.result))throw new Error("Invalid playlist format");d(_.result),s(null),b&&Ee.set(b,{url:null,playlist:_.result})}break}catch(u){if(y.aborted){f&&g("Request timed out");break}if(R++,R>=Ve){const I=u instanceof Error?u.message:String(u);f&&g(`Failed after ${Ve} attempts: ${I}`)}else await new Promise(I=>setTimeout(I,2e3))}f&&l(!1)},100);return()=>{f=!1,clearTimeout(A),h.abort()}},[x,e,t,r,n]),{fetchedPlaybackUrl:i,fetchedPlaylist:c,isLoading:m,error:p}},Er={projectId:"vp-player-projectId",video:{file:"",playlist:{state:!0,playlistVideoIndex:0,videos:[]}},config:{autoplay:!0,muted:!0,loop:!1,size:{width:"100%",height:"30vh"},controls:{settingsButton:!0,chromecastButton:!1,nextButton:!0,fullscreenButton:!0,airplayButton:!1,bigPlayButton:!1,autopausePlayButton:!0,pictureInPictureButton:!1,relatedButton:!1,volumeButton:!0,shareButton:!0}}},pt=({videoUrl:e,fetchedPlaybackUrl:t,fetchedPlaylist:r,projectId:n,config:a={},isVerticalPlayer:i})=>{var l,p,g,x,b,f,h,y,w,A,R,C,T;const s={...Er,...a},c={...s.config,...a.config};if(e)return{...s,video:{...s.video,file:e,playlist:void 0},config:c};if(t)return{...s,video:{...s.video,file:t,playlist:void 0},config:c};if(r&&r.length>0){const u=((p=(l=a==null?void 0:a.video)==null?void 0:l.playlist)==null?void 0:p.playlistVideoIndex)??((g=a==null?void 0:a.config)==null?void 0:g.playlistVideoIndex)??0;return i?{...s,projectId:n||"vp-player-projectId",video:{...s.video,file:(x=r[0])==null?void 0:x.hlsUrl,title:(b=r[0])==null?void 0:b.title,playlist:{state:!0,playlistId:"",playlistVideoIndex:Number(u),videos:r.slice(1).map((j,_)=>({videoId:String(_+1),title:j.title,file:j.hlsUrl,thumbnailUrl:j.thumbnailUrl,duration:j.duration}))}},config:c}:{...s,projectId:n||"vp-player-projectId",video:{...s.video,file:((f=r[Number(u)])==null?void 0:f.hlsUrl)||((h=r[0])==null?void 0:h.hlsUrl)||"",title:((y=r[Number(u)])==null?void 0:y.title)||((w=r[0])==null?void 0:w.title),thumbnail:((A=r[Number(u)])==null?void 0:A.thumbnailUrl)||((R=r[0])==null?void 0:R.thumbnailUrl),playlist:{state:!0,playlistVideoIndex:Number(u),videos:r.map((j,_)=>({videoId:String(_),title:j.title,file:j.hlsUrl,thumbnailUrl:j.thumbnailUrl,duration:j.duration}))}},config:c}}const d=((C=a==null?void 0:a.video)==null?void 0:C.playlist)||s.video.playlist,m=(T=a==null?void 0:a.video)==null?void 0:T.file;if(m)return{...s,video:{...s.video,file:m,playlist:void 0},config:c};if(d!=null&&d.videos&&d.videos.length>0){const u=d.videos[Number(d.playlistVideoIndex)||0];return{...s,video:{...s.video,file:(u==null?void 0:u.file)||"",playlist:{...d,state:d.state??!0,playlistVideoIndex:Number(d.playlistVideoIndex||0),videos:d.videos}},config:{...s.config,...a==null?void 0:a.config}}}throw new Error("No valid video source found. Provide videoUrl, videoId, playlistId, or config with video.file or playlist.")},ht=e=>{if(!e)return;const t=/https:\/\/host\.vpplayer\.tech\/player\/([^/]+)\/([^/]+)(?:\/[^/]+)?\.js/,r=e.match(t);return r?r[2]:void 0},mt=({playerId:e,videoId:t,version:r,videoUrl:n,projectId:a,playlistId:i,scriptUrl:s,config:c={},apiKey:d,isReels:m=!1})=>{const l=P.useRef(null),p=P.useRef(null),{isLoaded:g,error:x}=dt(r,s),b=t||ht(s),[f,h]=P.useState(null),{fetchedPlaybackUrl:y,fetchedPlaylist:w,isLoading:A,error:R}=ft({projectId:a,videoId:b,playlistId:i,videoUrl:n,apiKey:d}),C=Ne(e,b),T=P.useMemo(()=>{const u=c.config||{},I=m&&!u.size?{sizeType:"RESPONSIVE",aspectRatio:"9:16"}:u.size||{sizeType:"FIXED",width:"100%"};return{...c,config:{...u,size:I}}},[c,m]);return P.useEffect(()=>{if(x){h(x);return}if(!g||A&&!n)return;let u=!0;const j=setTimeout(async()=>{try{const _=s==null?void 0:s.includes("vertical-player");if(document.querySelectorAll('[id*="player"]').forEach(ae=>{var pe,he;const Z=ae.id;if(Z!==C)try{const o=_?(pe=window.vpVerticalPlayer)==null?void 0:pe.call(window,Z):(he=window.vpPlayer)==null?void 0:he.call(window,Z);o!=null&&o.destroy&&o.destroy()}catch(o){console.warn(`Failed to destroy existing player ${Z}:`,o)}}),await new Promise(ae=>setTimeout(ae,100)),!u||!l.current)return;if(!document.getElementById(C)){h("DOM element not found after cleanup.");return}if(!window.vpPlayer&&!window.vpVerticalPlayer){h("VP Player script not loaded.");return}const z=_?window.vpVerticalPlayer:window.vpPlayer;if(!z){h(`VP ${_?"Vertical ":""}Player script not loaded.`);return}const K=pt({videoUrl:n,fetchedPlaybackUrl:y??void 0,fetchedPlaylist:w??void 0,projectId:a,config:T,isVerticalPlayer:_}),ne=z(C);if(!ne){h(`Failed to create VP ${_?"Vertical ":""}Player instance.`);return}u&&l.current&&(ne.setup(K),p.current=ne,h(null))}catch(_){if(u){const N=_ instanceof Error?_.message:String(_);h(N),console.error("VP Player initialization error:",_)}}},150);return()=>{u=!1,clearTimeout(j)}},[g,A,n,y,w,a,T,C,x,s]),P.useEffect(()=>()=>{if(p.current){try{p.current.destroy&&p.current.destroy()}catch(I){console.warn(`Failed to destroy player ${C}:`,I)}p.current=null}const u=document.getElementById(C);u&&(u.innerHTML="")},[C]),{playerRef:l,playerInstanceRef:p,isScriptLoaded:g,isLoading:A,error:R||f||x}},yt=({playerId:e,videoId:t,version:r,videoUrl:n,projectId:a,playlistId:i,scriptUrl:s,config:c={},apiKey:d,isReels:m=!1,hiddenClasses:l=[],onClose:p,className:g})=>{var j,_,N,X;const{playerRef:x,playerInstanceRef:b,isScriptLoaded:f,isLoading:h,error:y}=mt({playerId:e,videoId:t,version:r,videoUrl:n,projectId:a,playlistId:i,scriptUrl:s,config:c,apiKey:d,isReels:m}),[w,A]=P.useState(!0),R=()=>m&&A(!0),C=()=>{var z,K;A(!1),(K=(z=b.current)==null?void 0:z.play)==null||K.call(z),p==null||p()},T=(_=(j=c==null?void 0:c.config)==null?void 0:j.size)!=null&&_.width?typeof c.config.size.width=="number"?`${c.config.size.width}px`:c.config.size.width:void 0,u=(X=(N=c==null?void 0:c.config)==null?void 0:N.size)!=null&&X.height?typeof c.config.size.height=="number"?`${c.config.size.height}px`:c.config.size.height:void 0,I=Ne(e,t);return y?$.jsxs(je,{type:"error",children:["An error occurred: ",y]}):h||!f?$.jsx(je,{type:"loading",children:"Loading..."}):$.jsxs($.Fragment,{children:[m&&!w?$.jsx("div",{onClick:R}):null,!m&&$.jsx("div",{children:$.jsx(Le,{id:I,ref:x,width:T||"100%",height:u||"auto",$hiddenClasses:l,className:g})},I),m&&w&&$.jsx(lt,{onClick:C,className:g,children:$.jsx(ut,{className:g,onClick:z=>z.stopPropagation(),children:$.jsx("div",{children:$.jsx(Le,{id:I,ref:x,width:"100%",height:"auto",$hiddenClasses:l,className:g})},I)})})]})},gt=P.createContext(void 0),_r=({children:e})=>{const[t,r]=P.useState(!1),[n,a]=P.useState(null),[i,s]=P.useState(null),c=P.useCallback(l=>{try{const p=Ne(l.playerId,l.videoId);a({...l,playerId:p}),r(!0),s(null)}catch{s("Failed to show player.")}},[]),d=P.useCallback(()=>{r(!1),a(null),s(null)},[]),m=P.useMemo(()=>({showPlayer:c,hidePlayer:d,isPlayerVisible:t,playerParams:n}),[c,d,t,n]);return $.jsxs(gt.Provider,{value:m,children:[e,i&&$.jsx(je,{type:"error",children:i}),t&&(n==null?void 0:n.playerId)&&$.jsx(yt,{playerId:n.playerId,videoId:n.videoId,projectId:n.projectId,videoUrl:n.videoUrl,version:n.version,playlistId:n.playlistId,scriptUrl:n.scriptUrl,config:n.config,isReels:n.isReels,thumbnailUrl:n.thumbnailUrl,onClose:d,hiddenClasses:n.hiddenClasses||[],apiKey:n.apiKey,className:n.className})]})},Sr=()=>{const e=P.useContext(gt);if(!e)throw new Error("useVPPlayer must be used within a VPPlayerProvider");return e},Ar={projectId:"vp-player-projectId",video:{file:"",playlist:{state:!0,playlistVideoIndex:0,videos:[]}},config:{autoplay:!0,pauseOtherVideos:!0,focusOnAutostart:!1,muted:!0,loop:!1,size:{width:"100%"},controls:{settingsButton:!0,chromecastButton:!1,nextButton:!1,fullscreenButton:!0,airplayButton:!1,bigPlayButton:!1,autopausePlayButton:!0,pictureInPictureButton:!1,relatedButton:!1,volumeButton:!0,shareButton:!0}}},Cr={config:{autostartOnLoad:{state:!0,onMobile:!0,onData:!0},muted:!0}},Tr={config:{autoplay:!0,muted:!0}},_e={video:{advertising:!0,ads:{skipAd:{state:!0,skipFrom:5}}},config:{adAnnouncement:{state:!0,timeBeforeAd:5},adsRequireInteraction:!1}},Rr=(e,t,r="time",n=0)=>{var a;return{..._e,video:{..._e.video,ads:{...(a=_e.video)==null?void 0:a.ads,adBreaks:[{adTagUrl:t,breakType:e,breakTimingType:r,breakTimingValue:n}]}}}},Ir="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4",Or="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4",jr="https://videos.pexels.com/video-files/4678261/4678261-hd_1080_1920_25fps.mp4",Lr="https://images.pexels.com/videos/4678261/pexels-photo-4678261.jpeg?auto=compress&cs=tinysrgb&w=600",Nr="https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=",$r="https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dskippablelinear&correlator=";S.AD_TAG_LINEAR_URL=Nr,S.AD_TAG_SKIPPABLE_LINEAR_URL=$r,S.BIG_BUCK_BUNNY_URL=Ir,S.ELEPHANTS_DREAM_URL=Or,S.Overlay=lt,S.PEXELS_THUMBNAIL_URL=Lr,S.PEXELS_VERTICAL_VIDEO_URL=jr,S.PlayerContainer=Le,S.PlayerWrapper=ut,S.VPPlayer=yt,S.VPPlayerProvider=_r,S.baseConfig=Cr,S.baseConfigWithAds=_e,S.baseConfigWithAutoplay=Tr,S.buildVPPlayerConfig=pt,S.defaultVPPlayerConfig=Ar,S.extractVideoId=ht,S.getAdConfig=Rr,S.useVPPlayer=Sr,S.useVPPlayerLogic=mt,S.useVPPlayerScript=dt,S.useVideoData=ft,Object.defineProperty(S,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devix-technologies/react-gjirafa-vp-player",
-  "version": "1.0.12",
+  "version": "1.0.13",
   "type": "module",
   "main": "./dist/react-gjirafa-vp-player.umd.js",
   "module": "./dist/react-gjirafa-vp-player.es.js",