@glitchlab/react-video-player 1.3.0 → 1.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +14 -0
- package/dist/index.mjs +585 -442
- package/dist/index.mjs.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -14,11 +14,17 @@ A lightweight, HLS-capable React video player with a polished overlay UI, device
|
|
|
14
14
|
## Why this player
|
|
15
15
|
|
|
16
16
|
- **HLS streaming** via `hls.js` with automatic native fallback (Safari)
|
|
17
|
+
- **YouTube support** — pass a YouTube URL and it embeds automatically, no extra config
|
|
18
|
+
- **Custom control bar** (default) — play/seek/time/speed/quality/captions/volume/PiP/fullscreen, consistent across every browser and OS. Or use `"native"` controls, or none.
|
|
19
|
+
- **Quality selector** — `Auto` + per-resolution switching for multi-rendition HLS streams
|
|
20
|
+
- **Audio-track switcher** — pick between multiple audio tracks (e.g. languages) when the stream provides them
|
|
21
|
+
- **Captions** — `<track>` subtitles/captions with an in-bar menu
|
|
22
|
+
- **Keyboard shortcuts** — space, arrows, `M`, `F`, `P`
|
|
17
23
|
- **Next.js App Router compatible** — `"use client"` is preserved in the build
|
|
18
24
|
- **Scoped CSS, no preflight** — all styles live under `.gvp-root`. No `*` resets, no theme tokens leaked into your design system
|
|
19
25
|
- **Device-mode toggle** — flip between desktop (16:9) and mobile (9:16) presets
|
|
20
26
|
- **Hover-to-play** with safe play/pause race handling
|
|
21
|
-
-
|
|
27
|
+
- Lightweight: ~2 KB CSS + ~11 KB JS gzipped (hls.js is a peer dependency, loaded once)
|
|
22
28
|
- Fully typed; SSR-safe
|
|
23
29
|
|
|
24
30
|
---
|
|
@@ -132,6 +138,7 @@ The bar includes, left to right:
|
|
|
132
138
|
- **Seek bar** with a buffered indicator (live scrub — the video previews as you drag)
|
|
133
139
|
- **Time** — `current / duration`
|
|
134
140
|
- **Playback speed** — `0.5×` to `2×` menu
|
|
141
|
+
- **Quality** — resolution selector (`Auto` + each height) — appears only for HLS streams with more than one quality level
|
|
135
142
|
- **Captions** — appears only when the source has `<track>` subtitle/caption tracks
|
|
136
143
|
- **Volume** — mute toggle + slider (slider expands on hover)
|
|
137
144
|
- **Picture-in-Picture** — appears only where the browser supports it
|
package/dist/index.cjs
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("react"),H=require("hls.js");function z(e){var n,s,r="";if(typeof e=="string"||typeof e=="number")r+=e;else if(typeof e=="object")if(Array.isArray(e)){var u=e.length;for(n=0;n<u;n++)e[n]&&(s=z(e[n]))&&(r&&(r+=" "),r+=s)}else for(s in e)e[s]&&(r&&(r+=" "),r+=s);return r}function M(){for(var e,n,s=0,r="",u=arguments.length;s<u;s++)(e=arguments[s])&&(n=z(e))&&(r&&(r+=" "),r+=n);return r}const _="gvp-icon",w=e=>e?`${_} ${e}`:_,de=({className:e})=>t.jsxs("svg",{className:w(e),width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M14 2H10C6.72077 2 5.08116 2 3.91891 2.81382C3.48891 3.1149 3.1149 3.48891 2.81382 3.91891C2 5.08116 2 6.72077 2 10C2 13.2792 2 14.9188 2.81382 16.0811C3.1149 16.5111 3.48891 16.8851 3.91891 17.1862C5.08116 18 6.72077 18 10 18H14C17.2792 18 18.9188 18 20.0811 17.1862C20.5111 16.8851 20.8851 16.5111 21.1862 16.0811C22 14.9188 22 13.2792 22 10C22 6.72077 22 5.08116 21.1862 3.91891C20.8851 3.48891 20.5111 3.1149 20.0811 2.81382C18.9188 2 17.2792 2 14 2Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),t.jsx("path",{d:"M11 15H13",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M14.5 22L14.1845 21.5811C13.4733 20.6369 13.2969 19.1944 13.7468 18M9.5 22L9.8155 21.5811C10.5267 20.6369 10.7031 19.1944 10.2532 18",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),t.jsx("path",{d:"M7 22H17",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),he=({className:e})=>t.jsxs("svg",{className:w(e),width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M5 9C5 5.70017 5 4.05025 6.02513 3.02513C7.05025 2 8.70017 2 12 2C15.2998 2 16.9497 2 17.9749 3.02513C19 4.05025 19 5.70017 19 9V15C19 18.2998 19 19.9497 17.9749 20.9749C16.9497 22 15.2998 22 12 22C8.70017 22 7.05025 22 6.02513 20.9749C5 19.9497 5 18.2998 5 15V9Z",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"}),t.jsx("path",{d:"M11 19H13",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M9 2L9.089 2.53402C9.28188 3.69129 9.37832 4.26993 9.77519 4.62204C10.1892 4.98934 10.7761 5 12 5C13.2239 5 13.8108 4.98934 14.2248 4.62204C14.6217 4.26993 14.7181 3.69129 14.911 2.53402L15 2",stroke:"currentColor",strokeWidth:"2",strokeLinejoin:"round"})]}),pe=({className:e})=>t.jsx("svg",{className:w(e),width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M6.94994 5.53594L12.1929 0.292938C12.5834 -0.0975275 13.2165 -0.0975279 13.6069 0.292938C13.9974 0.683403 13.9974 1.31647 13.6069 1.70694L8.36394 6.94994L13.6069 12.1929C13.9974 12.5834 13.9974 13.2165 13.6069 13.6069C13.2165 13.9974 12.5834 13.9974 12.1929 13.6069L6.94994 8.36394L1.70694 13.6069C1.31647 13.9974 0.683403 13.9974 0.292938 13.6069C-0.0975279 13.2165 -0.0975277 12.5834 0.292938 12.1929L5.53594 6.94994L0.292938 1.70694C-0.0975279 1.31647 -0.0975279 0.683403 0.292938 0.292938C0.683403 -0.0975279 1.31647 -0.0975277 1.70694 0.292938L6.94994 5.53594Z",fill:"currentColor"})}),me=({className:e})=>t.jsx("svg",{className:w(e),width:"22",height:"22",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M5.3335 11.45V4.54997C5.3335 4.36108 5.40016 4.20275 5.5335 4.07497C5.66683 3.94719 5.82238 3.8833 6.00016 3.8833C6.05572 3.8833 6.11405 3.89163 6.17516 3.9083C6.23627 3.92497 6.29461 3.94997 6.35016 3.9833L11.7835 7.4333C11.8835 7.49997 11.9585 7.5833 12.0085 7.6833C12.0585 7.7833 12.0835 7.88886 12.0835 7.99997C12.0835 8.11108 12.0585 8.21663 12.0085 8.31663C11.9585 8.41663 11.8835 8.49997 11.7835 8.56663L6.35016 12.0166C6.29461 12.05 6.23627 12.075 6.17516 12.0916C6.11405 12.1083 6.05572 12.1166 6.00016 12.1166C5.82238 12.1166 5.66683 12.0527 5.5335 11.925C5.40016 11.7972 5.3335 11.6389 5.3335 11.45Z",fill:"currentColor"})}),fe=({className:e})=>t.jsxs("svg",{className:w(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M3 14V10C3 9.44772 3.44772 9 4 9H6.58579C6.851 9 7.10536 8.89464 7.29289 8.70711L11.2929 4.70711C11.9229 4.07714 13 4.52331 13 5.41421V18.5858C13 19.4767 11.9229 19.9229 11.2929 19.2929L7.29289 15.2929C7.10536 15.1054 6.851 15 6.58579 15H4C3.44772 15 3 14.5523 3 14Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),t.jsx("path",{d:"M16.5 8C17.5 9 18 10.5 18 12C18 13.5 17.5 15 16.5 16M19 5.5C20.5 7 21.5 9.5 21.5 12C21.5 14.5 20.5 17 19 18.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),ge=({className:e})=>t.jsx("svg",{className:w(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M7 5.5V18.5C7 19.2659 7.84856 19.7261 8.4899 19.3071L19.0801 12.4014C19.6644 12.0204 19.6644 11.9796 19.0801 11.5986L8.4899 4.69288C7.84856 4.27388 7 4.73408 7 5.5Z",fill:"currentColor"})}),ve=({className:e})=>t.jsxs("svg",{className:w(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("rect",{x:"6",y:"5",width:"4",height:"14",rx:"1",fill:"currentColor"}),t.jsx("rect",{x:"14",y:"5",width:"4",height:"14",rx:"1",fill:"currentColor"})]}),xe=({className:e})=>t.jsxs("svg",{className:w(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M3 14V10C3 9.44772 3.44772 9 4 9H6.58579C6.851 9 7.10536 8.89464 7.29289 8.70711L11.2929 4.70711C11.9229 4.07714 13 4.52331 13 5.41421V18.5858C13 19.4767 11.9229 19.9229 11.2929 19.2929L7.29289 15.2929C7.10536 15.1054 6.851 15 6.58579 15H4C3.44772 15 3 14.5523 3 14Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),t.jsx("path",{d:"M16.5 8C17.5 9 18 10.5 18 12C18 13.5 17.5 15 16.5 16M19 5.5C20.5 7 21.5 9.5 21.5 12C21.5 14.5 20.5 17 19 18.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),ke=({className:e})=>t.jsxs("svg",{className:w(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M3 14V10C3 9.44772 3.44772 9 4 9H6.58579C6.851 9 7.10536 8.89464 7.29289 8.70711L11.2929 4.70711C11.9229 4.07714 13 4.52331 13 5.41421V18.5858C13 19.4767 11.9229 19.9229 11.2929 19.2929L7.29289 15.2929C7.10536 15.1054 6.851 15 6.58579 15H4C3.44772 15 3 14.5523 3 14Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),t.jsx("path",{d:"M16.5 8C17.5 9 18 10.5 18 12C18 13.5 17.5 15 16.5 16",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),be=({className:e})=>t.jsxs("svg",{className:w(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M3 14V10C3 9.44772 3.44772 9 4 9H6.58579C6.851 9 7.10536 8.89464 7.29289 8.70711L11.2929 4.70711C11.9229 4.07714 13 4.52331 13 5.41421V18.5858C13 19.4767 11.9229 19.9229 11.2929 19.2929L7.29289 15.2929C7.10536 15.1054 6.851 15 6.58579 15H4C3.44772 15 3 14.5523 3 14Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),t.jsx("path",{d:"M16 9L22 15M22 9L16 15",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),we=({className:e})=>t.jsx("svg",{className:w(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M4 9V4H9M15 4H20V9M20 15V20H15M9 20H4V15",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})}),Ce=({className:e})=>t.jsx("svg",{className:w(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M9 4V9H4M15 9V4H20M15 20V15H20M9 15H4V20",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})}),je=({className:e})=>t.jsxs("svg",{className:w(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("rect",{x:"2",y:"4",width:"20",height:"16",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),t.jsx("rect",{x:"12",y:"12",width:"8",height:"5",rx:"1",fill:"currentColor"})]}),Le=({className:e})=>t.jsxs("svg",{className:w(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("rect",{x:"2",y:"5",width:"20",height:"14",rx:"3",stroke:"currentColor",strokeWidth:"1.5"}),t.jsx("path",{d:"M7 12H11M13 12H17M7 15H9M11 15H13M15 15H17",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),Ee=({className:e})=>t.jsxs("svg",{className:w(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2Z",stroke:"currentColor",strokeWidth:"1.5"}),t.jsx("path",{d:"M12 8V12L14.5 14.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),ye=({className:e})=>t.jsx("svg",{className:w(e),width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M6 9L12 15L18 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})});function q(e){if(!Number.isFinite(e)||e<0)return"--:--";const n=Math.floor(e),s=Math.floor(n/3600),r=Math.floor(n%3600/60),d=(n%60).toString().padStart(2,"0");if(s>0){const c=r.toString().padStart(2,"0");return`${s}:${c}:${d}`}return`${r}:${d}`}const F=(()=>{if(typeof navigator>"u")return!1;const e=navigator.userAgent;return/iPad|iPhone|iPod/.test(e)||e.includes("Mac")&&navigator.maxTouchPoints>1})(),U=typeof navigator>"u"?!1:/iPhone|iPod/.test(navigator.userAgent),Ne=3e3,P={isSupported(){return typeof document>"u"?!1:!!(document.fullscreenEnabled||document.webkitFullscreenEnabled)},element(){return typeof document>"u"?null:document.fullscreenElement??document.webkitFullscreenElement??null},request(e){const n=e.requestFullscreen??e.webkitRequestFullscreen;return n?n.call(e):Promise.reject(new Error("Fullscreen not supported"))},exit(){const e=document.exitFullscreen??document.webkitExitFullscreen;return e?e.call(document):Promise.reject(new Error("Fullscreen not supported"))},onChange(e){return document.addEventListener("fullscreenchange",e),document.addEventListener("webkitfullscreenchange",e),()=>{document.removeEventListener("fullscreenchange",e),document.removeEventListener("webkitfullscreenchange",e)}}},Se=({video:e,isPlaying:n,container:s,onTogglePlay:r})=>{const[u,d]=o.useState(!0),c=o.useRef(null),l=o.useCallback(()=>{c.current!==null&&(clearTimeout(c.current),c.current=null)},[]),i=o.useCallback(()=>{l(),n&&(c.current=setTimeout(()=>d(!1),Ne))},[l,n]),f=o.useCallback(()=>{d(!0),i()},[i]);return o.useEffect(()=>{if(!n){l(),d(!0);return}return i(),l},[n,i,l]),o.useEffect(()=>{if(!s)return;const g=()=>f();return s.addEventListener("mousemove",g),s.addEventListener("touchstart",g),s.addEventListener("focusin",g),()=>{s.removeEventListener("mousemove",g),s.removeEventListener("touchstart",g),s.removeEventListener("focusin",g)}},[s,f]),o.useEffect(()=>{if(!s||!e)return;const g=a=>{if(!(!s.contains(document.activeElement)||a.target.tagName==="INPUT"&&a.key!==" "))switch(a.key){case" ":case"k":a.preventDefault(),r(),f();break;case"ArrowLeft":a.preventDefault(),e.currentTime=Math.max(0,e.currentTime-5),f();break;case"ArrowRight":a.preventDefault(),e.currentTime=Math.min(e.duration||0,e.currentTime+5),f();break;case"ArrowUp":a.preventDefault(),e.volume=Math.min(1,e.volume+.1),e.muted&&(e.muted=!1),f();break;case"ArrowDown":a.preventDefault(),e.volume=Math.max(0,e.volume-.1),f();break;case"m":e.muted=!e.muted,f();break;case"f":P.element()===s?P.exit().catch(()=>{}):P.request(s).catch(()=>{}),f();break;case"p":document.pictureInPictureElement?document.exitPictureInPicture().catch(()=>{}):document.pictureInPictureEnabled&&e.requestPictureInPicture().catch(()=>{}),f();break}};return document.addEventListener("keydown",g),()=>document.removeEventListener("keydown",g)},[s,e,r,f]),t.jsx("div",{role:"toolbar","aria-label":"Video controls",className:M("gvp-controls",!u&&"is-hidden"),onMouseEnter:l,onMouseLeave:i,children:t.jsxs("div",{className:"gvp-controls-row",children:[t.jsx(Me,{isPlaying:n,onToggle:r}),t.jsx(Pe,{video:e}),t.jsx(Te,{video:e}),t.jsx(Ve,{video:e}),t.jsx(Re,{video:e}),t.jsx(Ie,{video:e}),t.jsx(Be,{video:e}),t.jsx(De,{container:s,video:e})]})})},Me=({isPlaying:e,onToggle:n})=>t.jsx("button",{type:"button",className:"gvp-ctrl-btn","aria-label":e?"Pause":"Play","aria-pressed":e,onClick:n,children:e?t.jsx(ve,{}):t.jsx(ge,{})}),Pe=({video:e})=>{const[n,s]=o.useState(0),[r,u]=o.useState(0),[d,c]=o.useState(0);o.useEffect(()=>{if(!e)return;const a=()=>s(e.currentTime),m=()=>u(Number.isFinite(e.duration)?e.duration:0),v=()=>{const h=e.buffered;if(!h||h.length===0){c(0);return}let x=h.end(h.length-1);for(let b=0;b<h.length;b++)if(h.start(b)<=e.currentTime&&e.currentTime<=h.end(b)){x=h.end(b);break}c(x)};return a(),m(),v(),e.addEventListener("timeupdate",a),e.addEventListener("durationchange",m),e.addEventListener("loadedmetadata",m),e.addEventListener("progress",v),e.addEventListener("timeupdate",v),()=>{e.removeEventListener("timeupdate",a),e.removeEventListener("durationchange",m),e.removeEventListener("loadedmetadata",m),e.removeEventListener("progress",v),e.removeEventListener("timeupdate",v)}},[e]);const l=r>0,i=l?n/r*100:0,f=l?d/r*100:0,g=a=>{if(!e||!l)return;const m=Number(a.target.value)/100*r;e.currentTime=m,s(m)};return t.jsxs("div",{className:"gvp-seek",children:[t.jsxs("div",{className:"gvp-seek-track",children:[t.jsx("div",{className:"gvp-seek-buffered",style:{width:`${f}%`}}),t.jsx("div",{className:"gvp-seek-progress",style:{width:`${i}%`}})]}),t.jsx("input",{type:"range",className:"gvp-seek-input",min:0,max:100,step:.1,value:i,onChange:g,disabled:!l,"aria-label":"Seek","aria-valuemin":0,"aria-valuemax":Math.floor(r),"aria-valuenow":Math.floor(n)})]})},Te=({video:e})=>{const[n,s]=o.useState(0),[r,u]=o.useState(0);return o.useEffect(()=>{if(!e)return;const d=()=>s(e.currentTime),c=()=>u(Number.isFinite(e.duration)?e.duration:0);return d(),c(),e.addEventListener("timeupdate",d),e.addEventListener("durationchange",c),e.addEventListener("loadedmetadata",c),()=>{e.removeEventListener("timeupdate",d),e.removeEventListener("durationchange",c),e.removeEventListener("loadedmetadata",c)}},[e]),t.jsxs("span",{className:"gvp-time","aria-live":"off",children:[q(n)," / ",q(r)]})},Ie=({video:e})=>{const[n,s]=o.useState(1),[r,u]=o.useState(!1);o.useEffect(()=>{if(!e)return;const f=()=>{s(e.volume),u(e.muted)};return f(),e.addEventListener("volumechange",f),()=>e.removeEventListener("volumechange",f)},[e]);const d=()=>{e&&(e.muted=!e.muted)},c=f=>{if(!e)return;const g=Number(f.target.value)/100;e.volume=g,g>0&&e.muted&&(e.muted=!1)};let l=xe;r||n===0?l=be:n<.5&&(l=ke);const i=r?0:Math.round(n*100);return t.jsxs("div",{className:M("gvp-volume",!F&&"is-expandable"),children:[t.jsx("button",{type:"button",className:"gvp-ctrl-btn","aria-label":r?"Unmute":"Mute","aria-pressed":r,onClick:d,children:t.jsx(l,{})}),!F&&t.jsxs("div",{className:"gvp-volume-slider-wrap",children:[t.jsx("div",{className:"gvp-volume-track",children:t.jsx("div",{className:"gvp-volume-fill",style:{width:`${i}%`}})}),t.jsx("input",{type:"range",className:"gvp-volume-input",min:0,max:100,step:1,value:i,onChange:c,"aria-label":"Volume","aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":i})]})]})},He=[.5,.75,1,1.25,1.5,2],Ve=({video:e})=>{const[n,s]=o.useState(1),[r,u]=o.useState(!1),d=o.useRef(null);o.useEffect(()=>{if(!e)return;const i=()=>s(e.playbackRate);return i(),e.addEventListener("ratechange",i),()=>e.removeEventListener("ratechange",i)},[e]),o.useEffect(()=>{if(!r)return;const i=g=>{d.current&&!d.current.contains(g.target)&&u(!1)},f=g=>{g.key==="Escape"&&u(!1)};return document.addEventListener("mousedown",i),document.addEventListener("keydown",f),()=>{document.removeEventListener("mousedown",i),document.removeEventListener("keydown",f)}},[r]);const c=i=>{e&&(e.playbackRate=i),s(i),u(!1)},l=n===1?"1×":`${n}×`;return t.jsxs("div",{className:"gvp-speed",ref:d,children:[t.jsxs("button",{type:"button",className:"gvp-ctrl-btn gvp-speed-btn","aria-haspopup":"listbox","aria-expanded":r,"aria-label":`Playback speed: ${l}`,onClick:()=>u(i=>!i),children:[t.jsx(Ee,{}),t.jsx("span",{className:"gvp-speed-label",children:l})]}),r&&t.jsx("ul",{className:"gvp-speed-menu",role:"listbox","aria-label":"Playback speed",children:He.map(i=>t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":i===n,className:M("gvp-speed-menu-item",i===n&&"is-active"),onClick:()=>c(i),children:i===1?"Normal":`${i}×`})},i))})]})},Re=({video:e})=>{const[n,s]=o.useState([]),[r,u]=o.useState(-1),[d,c]=o.useState(!1),l=o.useRef(null),i=o.useCallback(a=>{const m=[];for(let h=0;h<a.length;h++){const x=a[h];(x.kind==="subtitles"||x.kind==="captions")&&m.push({index:h,label:x.label||x.language||`Track ${h+1}`,language:x.language})}s(m);let v=-1;for(let h=0;h<a.length;h++)if(a[h].mode==="showing"){v=h;break}u(v)},[]);o.useEffect(()=>{if(!e){s([]),u(-1);return}const a=e.textTracks;i(a);const m=()=>i(a);if(typeof a.addEventListener=="function")return a.addEventListener("addtrack",m),a.addEventListener("removetrack",m),a.addEventListener("change",m),()=>{a.removeEventListener("addtrack",m),a.removeEventListener("removetrack",m),a.removeEventListener("change",m)}},[e,i]),o.useEffect(()=>{if(!d)return;const a=v=>{l.current&&!l.current.contains(v.target)&&c(!1)},m=v=>{v.key==="Escape"&&c(!1)};return document.addEventListener("mousedown",a),document.addEventListener("keydown",m),()=>{document.removeEventListener("mousedown",a),document.removeEventListener("keydown",m)}},[d]);const f=a=>{if(!e)return;const m=e.textTracks;for(let v=0;v<m.length;v++)m[v].mode=v===a?"showing":"hidden";u(a),c(!1)},g=()=>{if(!e)return;const a=e.textTracks;for(let m=0;m<a.length;m++)a[m].mode="hidden";u(-1),c(!1)};return n.length===0?null:t.jsxs("div",{className:"gvp-captions",ref:l,children:[t.jsx("button",{type:"button",className:M("gvp-ctrl-btn",r>=0&&"is-active"),"aria-haspopup":"listbox","aria-expanded":d,"aria-label":"Captions","aria-pressed":r>=0,onClick:()=>c(a=>!a),children:t.jsx(Le,{})}),d&&t.jsxs("ul",{className:"gvp-captions-menu",role:"listbox","aria-label":"Captions",children:[t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":r===-1,className:M("gvp-captions-menu-item",r===-1&&"is-active"),onClick:g,children:"Off"})}),n.map(a=>t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":a.index===r,className:M("gvp-captions-menu-item",a.index===r&&"is-active"),onClick:()=>f(a.index),children:a.label})},a.index))]})]})},Be=({video:e})=>{const[n,s]=o.useState(!1);if(o.useEffect(()=>{if(!e)return;const u=()=>s(!0),d=()=>s(!1);return e.addEventListener("enterpictureinpicture",u),e.addEventListener("leavepictureinpicture",d),()=>{e.removeEventListener("enterpictureinpicture",u),e.removeEventListener("leavepictureinpicture",d)}},[e]),!document.pictureInPictureEnabled)return null;const r=()=>{document.pictureInPictureElement?document.exitPictureInPicture().catch(()=>{}):e==null||e.requestPictureInPicture().catch(()=>{})};return t.jsx("button",{type:"button",className:M("gvp-ctrl-btn",n&&"is-active"),"aria-label":n?"Exit picture-in-picture":"Picture-in-picture","aria-pressed":n,onClick:r,children:t.jsx(je,{})})},De=({container:e,video:n})=>{const[s,r]=o.useState(!1);if(o.useEffect(()=>{if(U)return;const i=()=>r(P.element()===e);return i(),P.onChange(i)},[e]),!(P.isSupported()||U&&n!==null&&typeof n.webkitEnterFullscreen=="function"))return null;const d=()=>{var i;if(U){(i=n==null?void 0:n.webkitEnterFullscreen)==null||i.call(n);return}s?P.exit().catch(()=>{}):e&&P.request(e).catch(()=>{})},c=s?Ce:we,l=s?"Exit fullscreen":"Enter fullscreen";return t.jsx("button",{type:"button",className:"gvp-ctrl-btn","aria-label":l,"aria-pressed":s,onClick:d,children:t.jsx(c,{})})};function Y(e,n,s){const r=e==null?void 0:e.trim();if(r)return r;if(n){try{const d=new Intl.DisplayNames(void 0,{type:"language"}).of(n);if(d&&d!==n)return d}catch{}return n}return`Audio ${s+1}`}const K=o.forwardRef(({src:e,hlsConfig:n,isHls:s,autoPlay:r,children:u,onAudioTracks:d,audioTrackIndex:c,...l},i)=>{const f=o.useRef(null),g=o.useRef(null),a=o.useRef(d);a.current=d,o.useImperativeHandle(i,()=>f.current);const m=globalThis.window!==void 0&&H.isSupported(),v=!!s||m&&typeof e=="string"&&e.endsWith(".m3u8");return o.useEffect(()=>{var y,V,T;if(!e)return;const h=f.current;if(!h)return;const x=p=>{var C;(C=a.current)==null||C.call(a,p)},b=()=>{r&&h.play().catch(()=>{})};for(g.current&&(g.current.destroy(),g.current=null),h.pause(),h.removeAttribute("src");h.firstChild;)h.firstChild.remove();x([]);let L;if(v){const p=new H(n);g.current=p;const C=()=>{const E=p.audioTracks.map((k,N)=>({index:N,label:Y(k.name,k.lang,N),lang:k.lang||void 0}));x(E)};p.on(H.Events.MANIFEST_PARSED,b),p.on(H.Events.AUDIO_TRACKS_UPDATED,C),p.on(H.Events.AUDIO_TRACK_SWITCHED,C),p.on(H.Events.ERROR,(E,k)=>{k.fatal&&(p.destroy(),g.current=null)}),p.attachMedia(h),p.loadSource(e)}else{h.src=e,h.load(),h.addEventListener("loadedmetadata",b,{once:!0});const p=h.audioTracks;if(p){const C=()=>{const E=[];for(let k=0;k<p.length;k++){const N=p[k];E.push({index:k,label:Y(N.label,N.language,k),lang:N.language||void 0})}x(E)};(y=p.addEventListener)==null||y.call(p,"addtrack",C),(V=p.addEventListener)==null||V.call(p,"removetrack",C),(T=p.addEventListener)==null||T.call(p,"change",C),p.length>0&&C(),L=()=>{var E,k,N;(E=p.removeEventListener)==null||E.call(p,"addtrack",C),(k=p.removeEventListener)==null||k.call(p,"removetrack",C),(N=p.removeEventListener)==null||N.call(p,"change",C)}}}return()=>{for(h.removeEventListener("loadedmetadata",b),L==null||L(),g.current&&(g.current.destroy(),g.current=null),h.pause(),h.removeAttribute("src");h.firstChild;)h.firstChild.remove();h.load(),x([])}},[e,v,n,r]),o.useEffect(()=>{var b;if(c==null||c<0)return;const h=g.current;if(h){h.audioTrack!==c&&(h.audioTrack=c);return}const x=(b=f.current)==null?void 0:b.audioTracks;if(x)for(let L=0;L<x.length;L++)x[L].enabled=L===c},[c]),t.jsx("video",{ref:f,...l,children:u})});K.displayName="HLSPlayer";function J(e){if(!e)return null;if(/^[A-Za-z0-9_-]{11}$/.test(e))return e;let n;try{n=new URL(e)}catch{return null}const s=n.hostname.replace(/^www\./,"");if(s==="youtu.be"){const r=n.pathname.slice(1).split("/")[0];return/^[A-Za-z0-9_-]{11}$/.test(r)?r:null}if(s==="youtube.com"||s==="m.youtube.com"||s==="music.youtube.com"||s==="youtube-nocookie.com"){const r=n.searchParams.get("v");if(r&&/^[A-Za-z0-9_-]{11}$/.test(r))return r;const u=/^\/(?:embed|shorts|v|live)\/([A-Za-z0-9_-]{11})/.exec(n.pathname);if(u)return u[1]}return null}function X(e){try{const n=new URL(e),s=n.searchParams.get("t")??n.searchParams.get("start");if(!s)return null;if(/^\d+s?$/.test(s))return Number.parseInt(s,10);const r=/^(?:(\d+)h)?(?:(\d+)m)?(?:(\d+)s)?$/.exec(s);if(r){const u=Number.parseInt(r[1]??"0",10),d=Number.parseInt(r[2]??"0",10),c=Number.parseInt(r[3]??"0",10),l=u*3600+d*60+c;return l>0?l:null}}catch{}return null}function G(e,n={}){const{autoPlay:s=!1,muted:r=!0,loop:u=!1,controls:d=!0,startSeconds:c}=n,l=new URLSearchParams({rel:"0",modestbranding:"1",playsinline:"1",controls:d?"1":"0"});return s?(l.set("autoplay","1"),l.set("mute","1")):r&&l.set("mute","1"),u&&(l.set("loop","1"),l.set("playlist",e)),c&&c>0&&l.set("start",String(c)),`https://www.youtube-nocookie.com/embed/${e}?${l.toString()}`}const Ae=({tracks:e,activeIndex:n,onSelect:s})=>{const[r,u]=o.useState(!1),d=o.useRef(null);o.useEffect(()=>{if(!r)return;const l=f=>{d.current&&!d.current.contains(f.target)&&u(!1)},i=f=>{f.key==="Escape"&&u(!1)};return document.addEventListener("mousedown",l),document.addEventListener("keydown",i),()=>{document.removeEventListener("mousedown",l),document.removeEventListener("keydown",i)}},[r]);const c=e.find(l=>l.index===n)??e[0];return t.jsxs("div",{className:"gvp-audio",ref:d,children:[t.jsxs("button",{type:"button",className:"gvp-audio-btn","aria-haspopup":"listbox","aria-expanded":r,"aria-label":"Audio track",onClick:()=>u(l=>!l),children:[t.jsx(fe,{}),t.jsx("span",{className:"gvp-audio-label",children:c==null?void 0:c.label}),t.jsx(ye,{})]}),r&&t.jsx("ul",{className:"gvp-audio-menu",role:"listbox","aria-label":"Audio tracks",children:e.map(l=>t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":l.index===n,className:M("gvp-audio-menu-item",l.index===n&&"is-active"),onClick:()=>{s(l.index),u(!1)},children:l.label})},l.index))})]})},$e=({src:e,poster:n,showDeviceToggle:s=!0,defaultDevice:r="desktop",hoverPlay:u=!1,tooltipText:d,onClose:c,className:l="",muted:i=!0,loop:f=!1,controls:g=!0,autoPlay:a=!1,frameMaxWidth:m,aspectRatio:v,hlsConfig:h,children:x})=>{const b=o.useRef(null),L=o.useRef(null),[y,V]=o.useState(r),[T,p]=o.useState(!1),[C,E]=o.useState(!1),[k,N]=o.useState([]),[A,Z]=o.useState(-1),[Q,ee]=o.useState(null),[te,ne]=o.useState(null),re=o.useCallback(j=>{b.current=j,ne(j)},[]),I=g===!0||g==="custom",$=g==="native",R=o.useMemo(()=>J(e),[e]),S=R!==null,se=o.useMemo(()=>y==="mobile"?(v==null?void 0:v.mobile)??"9/16":(v==null?void 0:v.desktop)??"16/9",[y,v]),oe=o.useMemo(()=>y==="mobile"?(m==null?void 0:m.mobile)??"420px":(m==null?void 0:m.desktop)??"960px",[y,m]),ae=o.useMemo(()=>R?G(R,{autoPlay:a,muted:i,loop:f,controls:I?!0:$,startSeconds:X(e)}):null,[R,e,a,i,f,I,$]),le=o.useCallback(j=>{N(j),Z(-1)},[]),B=o.useCallback(async()=>{const j=b.current;if(j){if(L.current)try{await L.current}catch{}j.pause()}},[]),D=o.useCallback(async()=>{const j=b.current;if(j)try{j.readyState<2&&j.load();const O=j.play();L.current=O,await O,p(!0)}catch{p(!1)}finally{L.current=null}},[]),ie=o.useCallback(()=>{!u||S||D()},[u,S,D]),ce=o.useCallback(()=>{!u||S||B().then(()=>p(!1))},[u,S,B]),W=o.useCallback(async()=>{const j=b.current;j&&(j.paused?await D():(await B(),p(!1)))},[D,B]),ue=!S&&k.length>1;return t.jsxs("div",{ref:ee,className:M("gvp-root",l),style:{width:oe,aspectRatio:se},onMouseEnter:()=>{E(!0),ie()},onMouseLeave:()=>{E(!1),ce()},children:[S?t.jsx("iframe",{className:"gvp-video gvp-youtube",src:ae??void 0,title:"YouTube video player",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0,referrerPolicy:"strict-origin-when-cross-origin"}):t.jsx(K,{ref:re,src:e,poster:n,muted:i,loop:f,playsInline:!0,preload:"metadata",controls:$,autoPlay:a,hlsConfig:h,className:"gvp-video",onPlay:()=>p(!0),onPause:()=>p(!1),onAudioTracks:le,audioTrackIndex:A,children:x}),!S&&t.jsx("div",{className:"gvp-vignette"}),s&&t.jsx("div",{className:"gvp-toggle",children:t.jsxs("div",{className:"gvp-toggle-pill",children:[t.jsx("button",{type:"button",onClick:()=>V("desktop"),className:M("gvp-toggle-btn",y==="desktop"&&"is-active"),"aria-label":"Desktop view","aria-pressed":y==="desktop",children:t.jsx(de,{})}),t.jsx("div",{className:"gvp-toggle-divider"}),t.jsx("button",{type:"button",onClick:()=>V("mobile"),className:M("gvp-toggle-btn",y==="mobile"&&"is-active"),"aria-label":"Mobile view","aria-pressed":y==="mobile",children:t.jsx(he,{})})]})}),c&&t.jsx("button",{type:"button",onClick:c,className:"gvp-close","aria-label":"Close",children:t.jsx(pe,{})}),ue&&t.jsx(Ae,{tracks:k,activeIndex:A>=0?A:k[0].index,onSelect:Z}),!S&&I&&t.jsx("button",{type:"button",className:"gvp-click-layer",onClick:()=>void W(),"aria-label":T?"Pause":"Play"}),!S&&!I&&!T&&t.jsx("div",{className:"gvp-play-wrap",children:t.jsxs("button",{type:"button",onClick:()=>void W(),onMouseEnter:()=>E(!0),onMouseLeave:()=>E(!1),className:"gvp-play","aria-label":"Play",children:[t.jsx(me,{}),d&&C&&t.jsx("span",{className:"gvp-tooltip",role:"tooltip",children:d})]})}),!S&&I&&t.jsx(Se,{video:te,isPlaying:T,container:Q,onTogglePlay:()=>void W()}),!S&&!I&&t.jsx("div",{className:"gvp-bottom-fade"})]})};exports.ReactVideoPlayer=$e;exports.parseYouTubeId=J;exports.parseYouTubeStart=X;exports.youTubeEmbedUrl=G;
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("react"),H=require("hls.js");function te(e){var n,r,s="";if(typeof e=="string"||typeof e=="number")s+=e;else if(typeof e=="object")if(Array.isArray(e)){var i=e.length;for(n=0;n<i;n++)e[n]&&(r=te(e[n]))&&(s&&(s+=" "),s+=r)}else for(r in e)e[r]&&(s&&(s+=" "),s+=r);return s}function N(){for(var e,n,r=0,s="",i=arguments.length;r<i;r++)(e=arguments[r])&&(n=te(e))&&(s&&(s+=" "),s+=n);return s}const J="gvp-icon",L=e=>e?`${J} ${e}`:J,be=({className:e})=>t.jsxs("svg",{className:L(e),width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M14 2H10C6.72077 2 5.08116 2 3.91891 2.81382C3.48891 3.1149 3.1149 3.48891 2.81382 3.91891C2 5.08116 2 6.72077 2 10C2 13.2792 2 14.9188 2.81382 16.0811C3.1149 16.5111 3.48891 16.8851 3.91891 17.1862C5.08116 18 6.72077 18 10 18H14C17.2792 18 18.9188 18 20.0811 17.1862C20.5111 16.8851 20.8851 16.5111 21.1862 16.0811C22 14.9188 22 13.2792 22 10C22 6.72077 22 5.08116 21.1862 3.91891C20.8851 3.48891 20.5111 3.1149 20.0811 2.81382C18.9188 2 17.2792 2 14 2Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),t.jsx("path",{d:"M11 15H13",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M14.5 22L14.1845 21.5811C13.4733 20.6369 13.2969 19.1944 13.7468 18M9.5 22L9.8155 21.5811C10.5267 20.6369 10.7031 19.1944 10.2532 18",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),t.jsx("path",{d:"M7 22H17",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),ke=({className:e})=>t.jsxs("svg",{className:L(e),width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M5 9C5 5.70017 5 4.05025 6.02513 3.02513C7.05025 2 8.70017 2 12 2C15.2998 2 16.9497 2 17.9749 3.02513C19 4.05025 19 5.70017 19 9V15C19 18.2998 19 19.9497 17.9749 20.9749C16.9497 22 15.2998 22 12 22C8.70017 22 7.05025 22 6.02513 20.9749C5 19.9497 5 18.2998 5 15V9Z",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"}),t.jsx("path",{d:"M11 19H13",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M9 2L9.089 2.53402C9.28188 3.69129 9.37832 4.26993 9.77519 4.62204C10.1892 4.98934 10.7761 5 12 5C13.2239 5 13.8108 4.98934 14.2248 4.62204C14.6217 4.26993 14.7181 3.69129 14.911 2.53402L15 2",stroke:"currentColor",strokeWidth:"2",strokeLinejoin:"round"})]}),Ce=({className:e})=>t.jsx("svg",{className:L(e),width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M6.94994 5.53594L12.1929 0.292938C12.5834 -0.0975275 13.2165 -0.0975279 13.6069 0.292938C13.9974 0.683403 13.9974 1.31647 13.6069 1.70694L8.36394 6.94994L13.6069 12.1929C13.9974 12.5834 13.9974 13.2165 13.6069 13.6069C13.2165 13.9974 12.5834 13.9974 12.1929 13.6069L6.94994 8.36394L1.70694 13.6069C1.31647 13.9974 0.683403 13.9974 0.292938 13.6069C-0.0975279 13.2165 -0.0975277 12.5834 0.292938 12.1929L5.53594 6.94994L0.292938 1.70694C-0.0975279 1.31647 -0.0975279 0.683403 0.292938 0.292938C0.683403 -0.0975279 1.31647 -0.0975277 1.70694 0.292938L6.94994 5.53594Z",fill:"currentColor"})}),we=({className:e})=>t.jsx("svg",{className:L(e),width:"22",height:"22",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M5.3335 11.45V4.54997C5.3335 4.36108 5.40016 4.20275 5.5335 4.07497C5.66683 3.94719 5.82238 3.8833 6.00016 3.8833C6.05572 3.8833 6.11405 3.89163 6.17516 3.9083C6.23627 3.92497 6.29461 3.94997 6.35016 3.9833L11.7835 7.4333C11.8835 7.49997 11.9585 7.5833 12.0085 7.6833C12.0585 7.7833 12.0835 7.88886 12.0835 7.99997C12.0835 8.11108 12.0585 8.21663 12.0085 8.31663C11.9585 8.41663 11.8835 8.49997 11.7835 8.56663L6.35016 12.0166C6.29461 12.05 6.23627 12.075 6.17516 12.0916C6.11405 12.1083 6.05572 12.1166 6.00016 12.1166C5.82238 12.1166 5.66683 12.0527 5.5335 11.925C5.40016 11.7972 5.3335 11.6389 5.3335 11.45Z",fill:"currentColor"})}),je=({className:e})=>t.jsxs("svg",{className:L(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M3 14V10C3 9.44772 3.44772 9 4 9H6.58579C6.851 9 7.10536 8.89464 7.29289 8.70711L11.2929 4.70711C11.9229 4.07714 13 4.52331 13 5.41421V18.5858C13 19.4767 11.9229 19.9229 11.2929 19.2929L7.29289 15.2929C7.10536 15.1054 6.851 15 6.58579 15H4C3.44772 15 3 14.5523 3 14Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),t.jsx("path",{d:"M16.5 8C17.5 9 18 10.5 18 12C18 13.5 17.5 15 16.5 16M19 5.5C20.5 7 21.5 9.5 21.5 12C21.5 14.5 20.5 17 19 18.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),Le=({className:e})=>t.jsx("svg",{className:L(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M7 5.5V18.5C7 19.2659 7.84856 19.7261 8.4899 19.3071L19.0801 12.4014C19.6644 12.0204 19.6644 11.9796 19.0801 11.5986L8.4899 4.69288C7.84856 4.27388 7 4.73408 7 5.5Z",fill:"currentColor"})}),Ee=({className:e})=>t.jsxs("svg",{className:L(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("rect",{x:"6",y:"5",width:"4",height:"14",rx:"1",fill:"currentColor"}),t.jsx("rect",{x:"14",y:"5",width:"4",height:"14",rx:"1",fill:"currentColor"})]}),ye=({className:e})=>t.jsxs("svg",{className:L(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M3 14V10C3 9.44772 3.44772 9 4 9H6.58579C6.851 9 7.10536 8.89464 7.29289 8.70711L11.2929 4.70711C11.9229 4.07714 13 4.52331 13 5.41421V18.5858C13 19.4767 11.9229 19.9229 11.2929 19.2929L7.29289 15.2929C7.10536 15.1054 6.851 15 6.58579 15H4C3.44772 15 3 14.5523 3 14Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),t.jsx("path",{d:"M16.5 8C17.5 9 18 10.5 18 12C18 13.5 17.5 15 16.5 16M19 5.5C20.5 7 21.5 9.5 21.5 12C21.5 14.5 20.5 17 19 18.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),Ne=({className:e})=>t.jsxs("svg",{className:L(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M3 14V10C3 9.44772 3.44772 9 4 9H6.58579C6.851 9 7.10536 8.89464 7.29289 8.70711L11.2929 4.70711C11.9229 4.07714 13 4.52331 13 5.41421V18.5858C13 19.4767 11.9229 19.9229 11.2929 19.2929L7.29289 15.2929C7.10536 15.1054 6.851 15 6.58579 15H4C3.44772 15 3 14.5523 3 14Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),t.jsx("path",{d:"M16.5 8C17.5 9 18 10.5 18 12C18 13.5 17.5 15 16.5 16",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),Se=({className:e})=>t.jsxs("svg",{className:L(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M3 14V10C3 9.44772 3.44772 9 4 9H6.58579C6.851 9 7.10536 8.89464 7.29289 8.70711L11.2929 4.70711C11.9229 4.07714 13 4.52331 13 5.41421V18.5858C13 19.4767 11.9229 19.9229 11.2929 19.2929L7.29289 15.2929C7.10536 15.1054 6.851 15 6.58579 15H4C3.44772 15 3 14.5523 3 14Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),t.jsx("path",{d:"M16 9L22 15M22 9L16 15",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),Me=({className:e})=>t.jsx("svg",{className:L(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M4 9V4H9M15 4H20V9M20 15V20H15M9 20H4V15",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})}),Te=({className:e})=>t.jsx("svg",{className:L(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M9 4V9H4M15 9V4H20M15 20V15H20M9 15H4V20",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})}),Pe=({className:e})=>t.jsxs("svg",{className:L(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("rect",{x:"2",y:"4",width:"20",height:"16",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),t.jsx("rect",{x:"12",y:"12",width:"8",height:"5",rx:"1",fill:"currentColor"})]}),Ie=({className:e})=>t.jsxs("svg",{className:L(e),width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("rect",{x:"2",y:"5",width:"20",height:"14",rx:"3",stroke:"currentColor",strokeWidth:"1.5"}),t.jsx("path",{d:"M7 12H11M13 12H17M7 15H9M11 15H13M15 15H17",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),He=({className:e})=>t.jsxs("svg",{className:L(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2Z",stroke:"currentColor",strokeWidth:"1.5"}),t.jsx("path",{d:"M12 8V12L14.5 14.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),Ve=({className:e})=>t.jsxs("svg",{className:L(e),width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t.jsx("path",{d:"M12 15C13.6569 15 15 13.6569 15 12C15 10.3431 13.6569 9 12 9C10.3431 9 9 10.3431 9 12C9 13.6569 10.3431 15 12 15Z",stroke:"currentColor",strokeWidth:"1.5"}),t.jsx("path",{d:"M3 12C3 12.6 3.08 13.18 3.23 13.73L4.6 14.5C4.86 14.65 5.02 14.94 5 15.24C4.98 15.58 4.96 15.92 5.07 16.24C5.18 16.56 5.39 16.83 5.62 17.08C5.83 17.3 6.13 17.4 6.42 17.36L7.99 17.13C8.28 17.09 8.57 17.21 8.74 17.45C9.07 17.93 9.49 18.34 9.97 18.66C10.21 18.83 10.34 19.11 10.31 19.4L10.13 20.97C10.1 21.26 10.21 21.55 10.43 21.74C10.91 22.16 11.45 22 12 22C12.55 22 13.09 22.16 13.57 21.74C13.79 21.55 13.9 21.26 13.87 20.97L13.69 19.4C13.66 19.11 13.79 18.83 14.03 18.66",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),Ae=({className:e})=>t.jsx("svg",{className:L(e),width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:t.jsx("path",{d:"M6 9L12 15L18 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})});function X(e){if(!Number.isFinite(e)||e<0)return"--:--";const n=Math.floor(e),r=Math.floor(n/3600),s=Math.floor(n%3600/60),c=(n%60).toString().padStart(2,"0");if(r>0){const d=s.toString().padStart(2,"0");return`${r}:${d}:${c}`}return`${s}:${c}`}const Re={index:-1};function De(e,n){return e>0?`${e}p`:`Level ${n+1}`}const G=(()=>{if(typeof navigator>"u")return!1;const e=navigator.userAgent;return/iPad|iPhone|iPod/.test(e)||e.includes("Mac")&&navigator.maxTouchPoints>1})(),Q=typeof navigator>"u"?!1:/iPhone|iPod/.test(navigator.userAgent),Be=3e3,D={isSupported(){return typeof document>"u"?!1:!!(document.fullscreenEnabled||document.webkitFullscreenEnabled)},element(){return typeof document>"u"?null:document.fullscreenElement??document.webkitFullscreenElement??null},request(e){const n=e.requestFullscreen??e.webkitRequestFullscreen;return n?n.call(e):Promise.reject(new Error("Fullscreen not supported"))},exit(){const e=document.exitFullscreen??document.webkitExitFullscreen;return e?e.call(document):Promise.reject(new Error("Fullscreen not supported"))},onChange(e){return document.addEventListener("fullscreenchange",e),document.addEventListener("webkitfullscreenchange",e),()=>{document.removeEventListener("fullscreenchange",e),document.removeEventListener("webkitfullscreenchange",e)}}},$e=({video:e,isPlaying:n,container:r,onTogglePlay:s,qualityLevels:i=[],currentLevel:c=-1,selectedLevel:d=-1,onSelectLevel:u})=>{const[m,h]=o.useState(!0),b=o.useRef(null),x=o.useCallback(()=>{b.current!==null&&(clearTimeout(b.current),b.current=null)},[]),a=o.useCallback(()=>{x(),n&&(b.current=setTimeout(()=>h(!1),Be))},[x,n]),l=o.useCallback(()=>{h(!0),a()},[a]);return o.useEffect(()=>{if(!n){x(),h(!0);return}return a(),x},[n,a,x]),o.useEffect(()=>{if(!r)return;const f=()=>l();return r.addEventListener("mousemove",f),r.addEventListener("touchstart",f),r.addEventListener("focusin",f),()=>{r.removeEventListener("mousemove",f),r.removeEventListener("touchstart",f),r.removeEventListener("focusin",f)}},[r,l]),o.useEffect(()=>{if(!r||!e)return;const f=g=>{if(!(!r.contains(document.activeElement)||g.target.tagName==="INPUT"&&g.key!==" "))switch(g.key){case" ":case"k":g.preventDefault(),s(),l();break;case"ArrowLeft":g.preventDefault(),e.currentTime=Math.max(0,e.currentTime-5),l();break;case"ArrowRight":g.preventDefault(),e.currentTime=Math.min(e.duration||0,e.currentTime+5),l();break;case"ArrowUp":g.preventDefault(),e.volume=Math.min(1,e.volume+.1),e.muted&&(e.muted=!1),l();break;case"ArrowDown":g.preventDefault(),e.volume=Math.max(0,e.volume-.1),l();break;case"m":e.muted=!e.muted,l();break;case"f":D.element()===r?D.exit().catch(()=>{}):D.request(r).catch(()=>{}),l();break;case"p":document.pictureInPictureElement?document.exitPictureInPicture().catch(()=>{}):document.pictureInPictureEnabled&&e.requestPictureInPicture().catch(()=>{}),l();break}};return document.addEventListener("keydown",f),()=>document.removeEventListener("keydown",f)},[r,e,s,l]),t.jsx("div",{role:"toolbar","aria-label":"Video controls",className:N("gvp-controls",!m&&"is-hidden"),onMouseEnter:x,onMouseLeave:a,children:t.jsxs("div",{className:"gvp-controls-row",children:[t.jsx(We,{isPlaying:n,onToggle:s}),t.jsx(_e,{video:e}),t.jsx(Ue,{video:e}),t.jsx(Ze,{video:e}),t.jsx(Fe,{levels:i,currentLevel:c,selectedLevel:d,onSelect:u}),t.jsx(Ye,{video:e}),t.jsx(qe,{video:e}),t.jsx(Qe,{video:e}),t.jsx(ze,{container:r,video:e})]})})};function z(e,n,r){o.useEffect(()=>{if(!e)return;const s=c=>{n.current&&!n.current.contains(c.target)&&r()},i=c=>{c.key==="Escape"&&r()};return document.addEventListener("mousedown",s),document.addEventListener("keydown",i),()=>{document.removeEventListener("mousedown",s),document.removeEventListener("keydown",i)}},[e,n,r])}const We=({isPlaying:e,onToggle:n})=>t.jsx("button",{type:"button",className:"gvp-ctrl-btn","aria-label":e?"Pause":"Play","aria-pressed":e,onClick:n,children:e?t.jsx(Ee,{}):t.jsx(Le,{})}),_e=({video:e})=>{const[n,r]=o.useState(0),[s,i]=o.useState(0),[c,d]=o.useState(0);o.useEffect(()=>{if(!e)return;const x=()=>r(e.currentTime),a=()=>i(Number.isFinite(e.duration)?e.duration:0),l=()=>{const f=e.buffered;if(!f||f.length===0){d(0);return}let g=f.end(f.length-1);for(let k=0;k<f.length;k++)if(f.start(k)<=e.currentTime&&e.currentTime<=f.end(k)){g=f.end(k);break}d(g)};return x(),a(),l(),e.addEventListener("timeupdate",x),e.addEventListener("durationchange",a),e.addEventListener("loadedmetadata",a),e.addEventListener("progress",l),e.addEventListener("timeupdate",l),()=>{e.removeEventListener("timeupdate",x),e.removeEventListener("durationchange",a),e.removeEventListener("loadedmetadata",a),e.removeEventListener("progress",l),e.removeEventListener("timeupdate",l)}},[e]);const u=s>0,m=u?n/s*100:0,h=u?c/s*100:0,b=x=>{if(!e||!u)return;const a=Number(x.target.value)/100*s;e.currentTime=a,r(a)};return t.jsxs("div",{className:"gvp-seek",children:[t.jsxs("div",{className:"gvp-seek-track",children:[t.jsx("div",{className:"gvp-seek-buffered",style:{width:`${h}%`}}),t.jsx("div",{className:"gvp-seek-progress",style:{width:`${m}%`}})]}),t.jsx("input",{type:"range",className:"gvp-seek-input",min:0,max:100,step:.1,value:m,onChange:b,disabled:!u,"aria-label":"Seek","aria-valuemin":0,"aria-valuemax":Math.floor(s),"aria-valuenow":Math.floor(n)})]})},Ue=({video:e})=>{const[n,r]=o.useState(0),[s,i]=o.useState(0);return o.useEffect(()=>{if(!e)return;const c=()=>r(e.currentTime),d=()=>i(Number.isFinite(e.duration)?e.duration:0);return c(),d(),e.addEventListener("timeupdate",c),e.addEventListener("durationchange",d),e.addEventListener("loadedmetadata",d),()=>{e.removeEventListener("timeupdate",c),e.removeEventListener("durationchange",d),e.removeEventListener("loadedmetadata",d)}},[e]),t.jsxs("span",{className:"gvp-time","aria-live":"off",children:[X(n)," / ",X(s)]})},qe=({video:e})=>{const[n,r]=o.useState(1),[s,i]=o.useState(!1);o.useEffect(()=>{if(!e)return;const h=()=>{r(e.volume),i(e.muted)};return h(),e.addEventListener("volumechange",h),()=>e.removeEventListener("volumechange",h)},[e]);const c=()=>{e&&(e.muted=!e.muted)},d=h=>{if(!e)return;const b=Number(h.target.value)/100;e.volume=b,b>0&&e.muted&&(e.muted=!1)};let u=ye;s||n===0?u=Se:n<.5&&(u=Ne);const m=s?0:Math.round(n*100);return t.jsxs("div",{className:N("gvp-volume",!G&&"is-expandable"),children:[t.jsx("button",{type:"button",className:"gvp-ctrl-btn","aria-label":s?"Unmute":"Mute","aria-pressed":s,onClick:c,children:t.jsx(u,{})}),!G&&t.jsxs("div",{className:"gvp-volume-slider-wrap",children:[t.jsx("div",{className:"gvp-volume-track",children:t.jsx("div",{className:"gvp-volume-fill",style:{width:`${m}%`}})}),t.jsx("input",{type:"range",className:"gvp-volume-input",min:0,max:100,step:1,value:m,onChange:d,"aria-label":"Volume","aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":m})]})]})},Oe=[.5,.75,1,1.25,1.5,2],Ze=({video:e})=>{const[n,r]=o.useState(1),[s,i]=o.useState(!1),c=o.useRef(null);o.useEffect(()=>{if(!e)return;const h=()=>r(e.playbackRate);return h(),e.addEventListener("ratechange",h),()=>e.removeEventListener("ratechange",h)},[e]);const d=o.useCallback(()=>i(!1),[]);z(s,c,d);const u=h=>{e&&(e.playbackRate=h),r(h),i(!1)},m=n===1?"1×":`${n}×`;return t.jsxs("div",{className:"gvp-speed",ref:c,children:[t.jsxs("button",{type:"button",className:"gvp-ctrl-btn gvp-speed-btn","aria-haspopup":"listbox","aria-expanded":s,"aria-label":`Playback speed: ${m}`,onClick:()=>i(h=>!h),children:[t.jsx(He,{}),t.jsx("span",{className:"gvp-speed-label",children:m})]}),s&&t.jsx("ul",{className:"gvp-speed-menu",role:"listbox","aria-label":"Playback speed",children:Oe.map(h=>t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":h===n,className:N("gvp-speed-menu-item",h===n&&"is-active"),onClick:()=>u(h),children:h===1?"Normal":`${h}×`})},h))})]})},Fe=({levels:e,currentLevel:n,selectedLevel:r,onSelect:s})=>{const[i,c]=o.useState(!1),d=o.useRef(null),u=o.useCallback(()=>c(!1),[]);if(z(i,d,u),e.length<2)return null;const m=a=>{s==null||s(a),c(!1)},h=[...e].sort((a,l)=>l.height-a.height),b=e.find(a=>a.index===n);let x;if(r<0)x=b?`Auto (${b.label})`:"Auto";else{const a=e.find(l=>l.index===r);x=(a==null?void 0:a.label)??"Auto"}return t.jsxs("div",{className:"gvp-quality",ref:d,children:[t.jsxs("button",{type:"button",className:"gvp-ctrl-btn gvp-quality-btn","aria-haspopup":"listbox","aria-expanded":i,"aria-label":`Quality: ${x}`,onClick:()=>c(a=>!a),children:[t.jsx(Ve,{}),t.jsx("span",{className:"gvp-quality-label",children:x})]}),i&&t.jsxs("ul",{className:"gvp-quality-menu",role:"listbox","aria-label":"Quality",children:[t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":r<0,className:N("gvp-quality-menu-item",r<0&&"is-active"),onClick:()=>m(Re.index),children:b?`Auto (${b.label})`:"Auto"})}),h.map(a=>t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":a.index===r,className:N("gvp-quality-menu-item",a.index===r&&"is-active"),onClick:()=>m(a.index),children:a.label})},a.index))]})]})},Ye=({video:e})=>{const[n,r]=o.useState([]),[s,i]=o.useState(-1),[c,d]=o.useState(!1),u=o.useRef(null),m=o.useCallback(a=>{const l=[];for(let g=0;g<a.length;g++){const k=a[g];(k.kind==="subtitles"||k.kind==="captions")&&l.push({index:g,label:k.label||k.language||`Track ${g+1}`,language:k.language})}r(l);let f=-1;for(let g=0;g<a.length;g++)if(a[g].mode==="showing"){f=g;break}i(f)},[]);o.useEffect(()=>{if(!e){r([]),i(-1);return}const a=e.textTracks;m(a);const l=()=>m(a);if(typeof a.addEventListener=="function")return a.addEventListener("addtrack",l),a.addEventListener("removetrack",l),a.addEventListener("change",l),()=>{a.removeEventListener("addtrack",l),a.removeEventListener("removetrack",l),a.removeEventListener("change",l)}},[e,m]);const h=o.useCallback(()=>d(!1),[]);z(c,u,h);const b=a=>{if(!e)return;const l=e.textTracks;for(let f=0;f<l.length;f++)l[f].mode=f===a?"showing":"hidden";i(a),d(!1)},x=()=>{if(!e)return;const a=e.textTracks;for(let l=0;l<a.length;l++)a[l].mode="hidden";i(-1),d(!1)};return n.length===0?null:t.jsxs("div",{className:"gvp-captions",ref:u,children:[t.jsx("button",{type:"button",className:N("gvp-ctrl-btn",s>=0&&"is-active"),"aria-haspopup":"listbox","aria-expanded":c,"aria-label":"Captions","aria-pressed":s>=0,onClick:()=>d(a=>!a),children:t.jsx(Ie,{})}),c&&t.jsxs("ul",{className:"gvp-captions-menu",role:"listbox","aria-label":"Captions",children:[t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":s===-1,className:N("gvp-captions-menu-item",s===-1&&"is-active"),onClick:x,children:"Off"})}),n.map(a=>t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":a.index===s,className:N("gvp-captions-menu-item",a.index===s&&"is-active"),onClick:()=>b(a.index),children:a.label})},a.index))]})]})},Qe=({video:e})=>{const[n,r]=o.useState(!1);if(o.useEffect(()=>{if(!e)return;const i=()=>r(!0),c=()=>r(!1);return e.addEventListener("enterpictureinpicture",i),e.addEventListener("leavepictureinpicture",c),()=>{e.removeEventListener("enterpictureinpicture",i),e.removeEventListener("leavepictureinpicture",c)}},[e]),!document.pictureInPictureEnabled)return null;const s=()=>{document.pictureInPictureElement?document.exitPictureInPicture().catch(()=>{}):e==null||e.requestPictureInPicture().catch(()=>{})};return t.jsx("button",{type:"button",className:N("gvp-ctrl-btn",n&&"is-active"),"aria-label":n?"Exit picture-in-picture":"Picture-in-picture","aria-pressed":n,onClick:s,children:t.jsx(Pe,{})})},ze=({container:e,video:n})=>{const[r,s]=o.useState(!1);if(o.useEffect(()=>{if(Q)return;const m=()=>s(D.element()===e);return m(),D.onChange(m)},[e]),!(D.isSupported()||Q&&n!==null&&typeof n.webkitEnterFullscreen=="function"))return null;const c=()=>{var m;if(Q){(m=n==null?void 0:n.webkitEnterFullscreen)==null||m.call(n);return}r?D.exit().catch(()=>{}):e&&D.request(e).catch(()=>{})},d=r?Te:Me,u=r?"Exit fullscreen":"Enter fullscreen";return t.jsx("button",{type:"button",className:"gvp-ctrl-btn","aria-label":u,"aria-pressed":r,onClick:c,children:t.jsx(d,{})})};function ee(e,n,r){const s=e==null?void 0:e.trim();if(s)return s;if(n){try{const c=new Intl.DisplayNames(void 0,{type:"language"}).of(n);if(c&&c!==n)return c}catch{}return n}return`Audio ${r+1}`}const ne=o.forwardRef(({src:e,hlsConfig:n,isHls:r,autoPlay:s,children:i,onAudioTracks:c,audioTrackIndex:d,onQualityLevels:u,onCurrentLevel:m,qualityLevelIndex:h,...b},x)=>{const a=o.useRef(null),l=o.useRef(null),f=o.useRef(c);f.current=c;const g=o.useRef(u);g.current=u;const k=o.useRef(m);k.current=m,o.useImperativeHandle(x,()=>a.current);const B=globalThis.window!==void 0&&H.isSupported(),M=!!r||B&&typeof e=="string"&&e.endsWith(".m3u8");return o.useEffect(()=>{var U,$,_;if(!e)return;const v=a.current;if(!v)return;const S=p=>{var C;(C=f.current)==null||C.call(f,p)},y=p=>{var C;(C=g.current)==null||C.call(g,p)},P=p=>{var C;(C=k.current)==null||C.call(k,p)},V=()=>{s&&v.play().catch(()=>{})};for(l.current&&(l.current.destroy(),l.current=null),v.pause(),v.removeAttribute("src");v.firstChild;)v.firstChild.remove();S([]),y([]),P(-1);let A;if(M){const p=new H(n);l.current=p;const C=()=>{const E=p.audioTracks.map((w,R)=>({index:R,label:ee(w.name,w.lang,R),lang:w.lang||void 0}));S(E)},I=()=>{const E=p.levels.map((w,R)=>({index:R,height:w.height||0,label:De(w.height||0,R)}));y(E)};p.on(H.Events.MANIFEST_PARSED,V),p.on(H.Events.MANIFEST_PARSED,I),p.on(H.Events.LEVELS_UPDATED,I),p.on(H.Events.LEVEL_SWITCHED,(E,w)=>{P(w.level)}),p.on(H.Events.AUDIO_TRACKS_UPDATED,C),p.on(H.Events.AUDIO_TRACK_SWITCHED,C),p.on(H.Events.ERROR,(E,w)=>{w.fatal&&(p.destroy(),l.current=null)}),p.attachMedia(v),p.loadSource(e)}else{v.src=e,v.load(),v.addEventListener("loadedmetadata",V,{once:!0});const p=v.audioTracks;if(p){const C=()=>{const I=[];for(let E=0;E<p.length;E++){const w=p[E];I.push({index:E,label:ee(w.label,w.language,E),lang:w.language||void 0})}S(I)};(U=p.addEventListener)==null||U.call(p,"addtrack",C),($=p.addEventListener)==null||$.call(p,"removetrack",C),(_=p.addEventListener)==null||_.call(p,"change",C),p.length>0&&C(),A=()=>{var I,E,w;(I=p.removeEventListener)==null||I.call(p,"addtrack",C),(E=p.removeEventListener)==null||E.call(p,"removetrack",C),(w=p.removeEventListener)==null||w.call(p,"change",C)}}}return()=>{for(v.removeEventListener("loadedmetadata",V),A==null||A(),l.current&&(l.current.destroy(),l.current=null),v.pause(),v.removeAttribute("src");v.firstChild;)v.firstChild.remove();v.load(),S([]),y([]),P(-1)}},[e,M,n,s]),o.useEffect(()=>{if(h==null)return;const v=l.current;v&&v.currentLevel!==h&&(v.currentLevel=h)},[h]),o.useEffect(()=>{var y;if(d==null||d<0)return;const v=l.current;if(v){v.audioTrack!==d&&(v.audioTrack=d);return}const S=(y=a.current)==null?void 0:y.audioTracks;if(S)for(let P=0;P<S.length;P++)S[P].enabled=P===d},[d]),t.jsx("video",{ref:a,...b,children:i})});ne.displayName="HLSPlayer";function se(e){if(!e)return null;if(/^[A-Za-z0-9_-]{11}$/.test(e))return e;let n;try{n=new URL(e)}catch{return null}const r=n.hostname.replace(/^www\./,"");if(r==="youtu.be"){const s=n.pathname.slice(1).split("/")[0];return/^[A-Za-z0-9_-]{11}$/.test(s)?s:null}if(r==="youtube.com"||r==="m.youtube.com"||r==="music.youtube.com"||r==="youtube-nocookie.com"){const s=n.searchParams.get("v");if(s&&/^[A-Za-z0-9_-]{11}$/.test(s))return s;const i=/^\/(?:embed|shorts|v|live)\/([A-Za-z0-9_-]{11})/.exec(n.pathname);if(i)return i[1]}return null}function re(e){try{const n=new URL(e),r=n.searchParams.get("t")??n.searchParams.get("start");if(!r)return null;if(/^\d+s?$/.test(r))return Number.parseInt(r,10);const s=/^(?:(\d+)h)?(?:(\d+)m)?(?:(\d+)s)?$/.exec(r);if(s){const i=Number.parseInt(s[1]??"0",10),c=Number.parseInt(s[2]??"0",10),d=Number.parseInt(s[3]??"0",10),u=i*3600+c*60+d;return u>0?u:null}}catch{}return null}function oe(e,n={}){const{autoPlay:r=!1,muted:s=!0,loop:i=!1,controls:c=!0,startSeconds:d}=n,u=new URLSearchParams({rel:"0",modestbranding:"1",playsinline:"1",controls:c?"1":"0"});return r?(u.set("autoplay","1"),u.set("mute","1")):s&&u.set("mute","1"),i&&(u.set("loop","1"),u.set("playlist",e)),d&&d>0&&u.set("start",String(d)),`https://www.youtube-nocookie.com/embed/${e}?${u.toString()}`}const Ke=({tracks:e,activeIndex:n,onSelect:r})=>{const[s,i]=o.useState(!1),c=o.useRef(null);o.useEffect(()=>{if(!s)return;const u=h=>{c.current&&!c.current.contains(h.target)&&i(!1)},m=h=>{h.key==="Escape"&&i(!1)};return document.addEventListener("mousedown",u),document.addEventListener("keydown",m),()=>{document.removeEventListener("mousedown",u),document.removeEventListener("keydown",m)}},[s]);const d=e.find(u=>u.index===n)??e[0];return t.jsxs("div",{className:"gvp-audio",ref:c,children:[t.jsxs("button",{type:"button",className:"gvp-audio-btn","aria-haspopup":"listbox","aria-expanded":s,"aria-label":"Audio track",onClick:()=>i(u=>!u),children:[t.jsx(je,{}),t.jsx("span",{className:"gvp-audio-label",children:d==null?void 0:d.label}),t.jsx(Ae,{})]}),s&&t.jsx("ul",{className:"gvp-audio-menu",role:"listbox","aria-label":"Audio tracks",children:e.map(u=>t.jsx("li",{children:t.jsx("button",{type:"button",role:"option","aria-selected":u.index===n,className:N("gvp-audio-menu-item",u.index===n&&"is-active"),onClick:()=>{r(u.index),i(!1)},children:u.label})},u.index))})]})},Je=({src:e,poster:n,showDeviceToggle:r=!0,defaultDevice:s="desktop",hoverPlay:i=!1,tooltipText:c,onClose:d,className:u="",muted:m=!0,loop:h=!1,controls:b=!0,autoPlay:x=!1,frameMaxWidth:a,aspectRatio:l,hlsConfig:f,children:g})=>{const k=o.useRef(null),B=o.useRef(null),[M,v]=o.useState(s),[S,y]=o.useState(!1),[P,V]=o.useState(!1),[A,U]=o.useState([]),[$,_]=o.useState(-1),[p,C]=o.useState([]),[I,E]=o.useState(-1),[w,R]=o.useState(-1),[ae,le]=o.useState(null),[ie,ce]=o.useState(null),ue=o.useCallback(j=>{k.current=j,ce(j)},[]),W=b===!0||b==="custom",F=b==="native",q=o.useMemo(()=>se(e),[e]),T=q!==null,de=o.useMemo(()=>M==="mobile"?(l==null?void 0:l.mobile)??"9/16":(l==null?void 0:l.desktop)??"16/9",[M,l]),he=o.useMemo(()=>M==="mobile"?(a==null?void 0:a.mobile)??"420px":(a==null?void 0:a.desktop)??"960px",[M,a]),pe=o.useMemo(()=>q?oe(q,{autoPlay:x,muted:m,loop:h,controls:W?!0:F,startSeconds:re(e)}):null,[q,e,x,m,h,W,F]),me=o.useCallback(j=>{U(j),_(-1)},[]),fe=o.useCallback(j=>{C(j),R(-1)},[]),O=o.useCallback(async()=>{const j=k.current;if(j){if(B.current)try{await B.current}catch{}j.pause()}},[]),Z=o.useCallback(async()=>{const j=k.current;if(j)try{j.readyState<2&&j.load();const K=j.play();B.current=K,await K,y(!0)}catch{y(!1)}finally{B.current=null}},[]),ge=o.useCallback(()=>{!i||T||Z()},[i,T,Z]),ve=o.useCallback(()=>{!i||T||O().then(()=>y(!1))},[i,T,O]),Y=o.useCallback(async()=>{const j=k.current;j&&(j.paused?await Z():(await O(),y(!1)))},[Z,O]),xe=!T&&A.length>1;return t.jsxs("div",{ref:le,className:N("gvp-root",u),style:{width:he,aspectRatio:de},onMouseEnter:()=>{V(!0),ge()},onMouseLeave:()=>{V(!1),ve()},children:[T?t.jsx("iframe",{className:"gvp-video gvp-youtube",src:pe??void 0,title:"YouTube video player",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0,referrerPolicy:"strict-origin-when-cross-origin"}):t.jsx(ne,{ref:ue,src:e,poster:n,muted:m,loop:h,playsInline:!0,preload:"metadata",controls:F,autoPlay:x,hlsConfig:f,className:"gvp-video",onPlay:()=>y(!0),onPause:()=>y(!1),onAudioTracks:me,audioTrackIndex:$,onQualityLevels:fe,onCurrentLevel:E,qualityLevelIndex:w,children:g}),!T&&t.jsx("div",{className:"gvp-vignette"}),r&&t.jsx("div",{className:"gvp-toggle",children:t.jsxs("div",{className:"gvp-toggle-pill",children:[t.jsx("button",{type:"button",onClick:()=>v("desktop"),className:N("gvp-toggle-btn",M==="desktop"&&"is-active"),"aria-label":"Desktop view","aria-pressed":M==="desktop",children:t.jsx(be,{})}),t.jsx("div",{className:"gvp-toggle-divider"}),t.jsx("button",{type:"button",onClick:()=>v("mobile"),className:N("gvp-toggle-btn",M==="mobile"&&"is-active"),"aria-label":"Mobile view","aria-pressed":M==="mobile",children:t.jsx(ke,{})})]})}),d&&t.jsx("button",{type:"button",onClick:d,className:"gvp-close","aria-label":"Close",children:t.jsx(Ce,{})}),xe&&t.jsx(Ke,{tracks:A,activeIndex:$>=0?$:A[0].index,onSelect:_}),!T&&W&&t.jsx("button",{type:"button",className:"gvp-click-layer",onClick:()=>void Y(),"aria-label":S?"Pause":"Play"}),!T&&!W&&!S&&t.jsx("div",{className:"gvp-play-wrap",children:t.jsxs("button",{type:"button",onClick:()=>void Y(),onMouseEnter:()=>V(!0),onMouseLeave:()=>V(!1),className:"gvp-play","aria-label":"Play",children:[t.jsx(we,{}),c&&P&&t.jsx("span",{className:"gvp-tooltip",role:"tooltip",children:c})]})}),!T&&W&&t.jsx($e,{video:ie,isPlaying:S,container:ae,onTogglePlay:()=>void Y(),qualityLevels:p,currentLevel:I,selectedLevel:w,onSelectLevel:R}),!T&&!W&&t.jsx("div",{className:"gvp-bottom-fade"})]})};exports.ReactVideoPlayer=Je;exports.parseYouTubeId=se;exports.parseYouTubeStart=re;exports.youTubeEmbedUrl=oe;
|
|
3
3
|
//# sourceMappingURL=index.cjs.map
|