@glitchlab/react-video-player 1.0.2 → 1.1.1

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 CHANGED
@@ -100,6 +100,7 @@ No client-component wrapper required.
100
100
  | `muted` | `boolean` | `true` | Mute the video. Required for autoplay in most browsers. |
101
101
  | `loop` | `boolean` | `false` | Loop playback. |
102
102
  | `controls` | `boolean` | `false` | Show native browser controls. |
103
+ | `autoPlay` | `boolean` | `false` | Start playback as soon as the source is ready. Works for HLS (after `MANIFEST_PARSED`), native MP4/WebM (after `loadedmetadata`), and YouTube embeds. Browsers block sound-on autoplay, so this only fires when `muted` is also `true` (the default). |
103
104
  | `frameMaxWidth` | `{ desktop?: string; mobile?: string }` | `{ desktop: "960px", mobile: "420px" }` | Max width of the player in each device mode. |
104
105
  | `aspectRatio` | `{ desktop?: AspectRatio; mobile?: AspectRatio }` | `{ desktop: "16/9", mobile: "9/16" }` | Aspect ratio per device mode. `AspectRatio` is `` `${number}/${number}` ``. |
105
106
  | `hlsConfig` | `Hls.HlsConfig` | — | Optional hls.js config. Pass a stable reference (e.g. `useMemo`) to avoid HLS rebuilds. |
@@ -107,6 +108,39 @@ No client-component wrapper required.
107
108
 
108
109
  ---
109
110
 
111
+ ## YouTube URLs
112
+
113
+ Pass any common YouTube URL as `src` and the player swaps the `<video>` element for a privacy-enhanced (`youtube-nocookie.com`) embed inside the same styled frame — no extra prop needed:
114
+
115
+ ```tsx
116
+ <ReactVideoPlayer src="https://www.youtube.com/watch?v=dQw4w9WgXcQ" />
117
+ <ReactVideoPlayer src="https://youtu.be/dQw4w9WgXcQ?t=90" autoPlay />
118
+ <ReactVideoPlayer src="https://www.youtube.com/shorts/dQw4w9WgXcQ" />
119
+ ```
120
+
121
+ Recognised forms: `youtube.com/watch?v=ID`, `youtu.be/ID`, `youtube.com/embed/ID`, `youtube.com/shorts/ID`, `youtube.com/live/ID`, `music.youtube.com/watch?v=ID`, and bare 11-character IDs. A `?t=` / `?start=` timestamp in the URL is honored.
122
+
123
+ ### Which props work over YouTube
124
+
125
+ | Prop | YouTube behavior |
126
+ |---------------------------------------|---------------------------------------------------------------------------------------------------|
127
+ | `muted` | ✅ Mutes the embed (`mute=1`). |
128
+ | `loop` | ✅ Loops the single video (`loop=1` + `playlist=<id>`, YouTube's required workaround). |
129
+ | `controls` | ✅ Shows/hides YouTube's controls (`controls=1` / `controls=0`). |
130
+ | `autoPlay` | ✅ Autoplays (`autoplay=1`). YouTube + browsers force muted autoplay, so `mute=1` is set too — even if `muted={false}`. |
131
+ | `showDeviceToggle` / `defaultDevice` | ✅ The desktop/mobile aspect-ratio toggle still works. |
132
+ | `onClose` | ✅ The close button still renders and fires. |
133
+ | `className` / `frameMaxWidth` / `aspectRatio` | ✅ Frame styling, sizing, and aspect ratio all apply. |
134
+ | `hoverPlay` | ❌ **No effect.** Hover-to-play needs programmatic pause, which requires the YouTube IFrame Player API (not loaded). YouTube's own controls handle starting playback. |
135
+ | `tooltipText` | ❌ **No effect.** The tooltip is attached to the centered play-button overlay, which isn't rendered for YouTube. |
136
+ | `poster` | ❌ **No effect.** YouTube shows its own video thumbnail; a custom poster would require an overlay layer. |
137
+ | `children` (`<track>` captions) | ❌ **No effect.** There's no `<video>` element to attach `<track>` to — use YouTube's own caption settings. |
138
+ | `hlsConfig` | ❌ **No effect.** Not an HLS stream. |
139
+
140
+ > If you need `hoverPlay`, a custom poster, or a play-button overlay over a YouTube video, you'd need the YouTube IFrame Player API integrated — that's not in this build (it'd add a ~30 KB external script). Open an issue if it matters for your use case.
141
+
142
+ ---
143
+
110
144
  ## Examples
111
145
 
112
146
  ### Looping background video, no UI chrome
@@ -116,10 +150,22 @@ No client-component wrapper required.
116
150
  src="/videos/hero.m3u8"
117
151
  muted
118
152
  loop
153
+ autoPlay
119
154
  showDeviceToggle={false}
120
155
  />
121
156
  ```
122
157
 
158
+ ### Autoplay an HLS stream
159
+
160
+ ```tsx
161
+ <ReactVideoPlayer
162
+ src="https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8"
163
+ autoPlay
164
+ />
165
+ ```
166
+
167
+ > `autoPlay` waits for the manifest to parse (HLS) or for `loadedmetadata` (native), then calls `.play()` for you. Browsers reject sound-on autoplay without a prior user gesture — `muted` (the default) is the reliable path.
168
+
123
169
  ### Hover-to-play with a tooltip
124
170
 
125
171
  ```tsx
package/dist/index.cjs CHANGED
@@ -1,3 +1,3 @@
1
1
  "use client";
2
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),s=require("react"),N=require("hls.js");function H(e){var l,o,t="";if(typeof e=="string"||typeof e=="number")t+=e;else if(typeof e=="object")if(Array.isArray(e)){var i=e.length;for(l=0;l<i;l++)e[l]&&(o=H(e[l]))&&(t&&(t+=" "),t+=o)}else for(o in e)e[o]&&(t&&(t+=" "),t+=o);return t}function m(){for(var e,l,o=0,t="",i=arguments.length;o<i;o++)(e=arguments[o])&&(l=H(e))&&(t&&(t+=" "),t+=l);return t}const I=s.forwardRef(({src:e,hlsConfig:l,isHls:o,children:t,...i},v)=>{const C=s.useRef(null),c=s.useRef(null);s.useImperativeHandle(v,()=>C.current);const x=globalThis.window!==void 0&&N.isSupported(),h=!!o||x&&typeof e=="string"&&e.endsWith(".m3u8");return s.useEffect(()=>{if(!e)return;const n=C.current;if(n){for(c.current&&(c.current.destroy(),c.current=null),n.pause(),n.removeAttribute("src");n.firstChild;)n.firstChild.remove();if(h){const a=new N(l);c.current=a,a.attachMedia(n),a.loadSource(e),a.on(N.Events.ERROR,(d,L)=>{L.fatal&&(a.destroy(),c.current=null)})}else n.src=e,n.load();return()=>{for(c.current&&(c.current.destroy(),c.current=null),n.pause(),n.removeAttribute("src");n.firstChild;)n.firstChild.remove();n.load()}}},[e,h,l]),r.jsx("video",{ref:C,...i,children:t})});I.displayName="HLSPlayer";const P="gvp-icon",y=e=>e?`${P} ${e}`:P,O=({className:e})=>r.jsxs("svg",{className:y(e),width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[r.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"}),r.jsx("path",{d:"M11 15H13",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),r.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"}),r.jsx("path",{d:"M7 22H17",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),U=({className:e})=>r.jsxs("svg",{className:y(e),width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[r.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"}),r.jsx("path",{d:"M11 19H13",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"}),r.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"})]}),$=({className:e})=>r.jsx("svg",{className:y(e),width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:r.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"})}),J=({className:e})=>r.jsx("svg",{className:y(e),width:"22",height:"22",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:r.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"})}),W=({src:e,poster:l,showDeviceToggle:o=!0,defaultDevice:t="desktop",hoverPlay:i=!1,tooltipText:v,onClose:C,className:c="",muted:x=!0,loop:h=!1,controls:n=!1,frameMaxWidth:a,aspectRatio:d,hlsConfig:L,children:R})=>{const g=s.useRef(null),k=s.useRef(null),[p,S]=s.useState(t),[E,f]=s.useState(!1),[B,w]=s.useState(!1),V=s.useMemo(()=>p==="mobile"?(d==null?void 0:d.mobile)??"9/16":(d==null?void 0:d.desktop)??"16/9",[p,d]),Z=s.useMemo(()=>p==="mobile"?(a==null?void 0:a.mobile)??"420px":(a==null?void 0:a.desktop)??"960px",[p,a]),b=s.useCallback(async()=>{const u=g.current;if(u){if(k.current)try{await k.current}catch{}u.pause()}},[]),j=s.useCallback(async()=>{const u=g.current;if(u)try{u.readyState<2&&u.load();const M=u.play();k.current=M,await M,f(!0)}catch{f(!1)}finally{k.current=null}},[]),q=s.useCallback(()=>{i&&j()},[i,j]),D=s.useCallback(()=>{i&&b().then(()=>f(!1))},[i,b]),T=s.useCallback(async()=>{const u=g.current;u&&(u.paused?await j():(await b(),f(!1)))},[j,b]);return r.jsxs("div",{className:m("gvp-root",c),style:{width:Z,aspectRatio:V},onMouseEnter:()=>{w(!0),q()},onMouseLeave:()=>{w(!1),D()},children:[r.jsx(I,{ref:g,src:e,poster:l,muted:x,loop:h,playsInline:!0,preload:"metadata",controls:n,hlsConfig:L,className:"gvp-video",onPlay:()=>f(!0),onPause:()=>f(!1),children:R}),r.jsx("div",{className:"gvp-vignette"}),o&&r.jsx("div",{className:"gvp-toggle",children:r.jsxs("div",{className:"gvp-toggle-pill",children:[r.jsx("button",{type:"button",onClick:()=>S("desktop"),className:m("gvp-toggle-btn",p==="desktop"&&"is-active"),"aria-label":"Desktop view","aria-pressed":p==="desktop",children:r.jsx(O,{})}),r.jsx("div",{className:"gvp-toggle-divider"}),r.jsx("button",{type:"button",onClick:()=>S("mobile"),className:m("gvp-toggle-btn",p==="mobile"&&"is-active"),"aria-label":"Mobile view","aria-pressed":p==="mobile",children:r.jsx(U,{})})]})}),C&&r.jsx("button",{type:"button",onClick:C,className:"gvp-close","aria-label":"Close",children:r.jsx($,{})}),!E&&r.jsx("div",{className:"gvp-play-wrap",children:r.jsxs("button",{type:"button",onClick:()=>void T(),onMouseEnter:()=>w(!0),onMouseLeave:()=>w(!1),className:"gvp-play","aria-label":"Play",children:[r.jsx(J,{}),v&&B&&r.jsx("span",{className:"gvp-tooltip",role:"tooltip",children:v})]})}),r.jsx("div",{className:"gvp-bottom-fade"})]})};exports.ReactVideoPlayer=W;
2
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),l=require("react"),N=require("hls.js");function R(e){var n,s,t="";if(typeof e=="string"||typeof e=="number")t+=e;else if(typeof e=="object")if(Array.isArray(e)){var a=e.length;for(n=0;n<a;n++)e[n]&&(s=R(e[n]))&&(t&&(t+=" "),t+=s)}else for(s in e)e[s]&&(t&&(t+=" "),t+=s);return t}function I(){for(var e,n,s=0,t="",a=arguments.length;s<a;s++)(e=arguments[s])&&(n=R(e))&&(t&&(t+=" "),t+=n);return t}const $=l.forwardRef(({src:e,hlsConfig:n,isHls:s,autoPlay:t,children:a,...h},p)=>{const i=l.useRef(null),c=l.useRef(null);l.useImperativeHandle(p,()=>i.current);const y=globalThis.window!==void 0&&N.isSupported(),b=!!s||y&&typeof e=="string"&&e.endsWith(".m3u8");return l.useEffect(()=>{if(!e)return;const o=i.current;if(!o)return;const d=()=>{t&&o.play().catch(()=>{})};for(c.current&&(c.current.destroy(),c.current=null),o.pause(),o.removeAttribute("src");o.firstChild;)o.firstChild.remove();if(b){const u=new N(n);c.current=u,u.attachMedia(o),u.loadSource(e),u.on(N.Events.MANIFEST_PARSED,d),u.on(N.Events.ERROR,(M,P)=>{P.fatal&&(u.destroy(),c.current=null)})}else o.src=e,o.load(),o.addEventListener("loadedmetadata",d,{once:!0});return()=>{for(o.removeEventListener("loadedmetadata",d),c.current&&(c.current.destroy(),c.current=null),o.pause(),o.removeAttribute("src");o.firstChild;)o.firstChild.remove();o.load()}},[e,b,n,t]),r.jsx("video",{ref:i,...h,children:a})});$.displayName="HLSPlayer";const H="gvp-icon",S=e=>e?`${H} ${e}`:H,J=({className:e})=>r.jsxs("svg",{className:S(e),width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[r.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"}),r.jsx("path",{d:"M11 15H13",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),r.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"}),r.jsx("path",{d:"M7 22H17",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),W=({className:e})=>r.jsxs("svg",{className:S(e),width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[r.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"}),r.jsx("path",{d:"M11 19H13",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"}),r.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"})]}),X=({className:e})=>r.jsx("svg",{className:S(e),width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:r.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"})}),G=({className:e})=>r.jsx("svg",{className:S(e),width:"22",height:"22",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:r.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"})});function Z(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 t=n.pathname.slice(1).split("/")[0];return/^[A-Za-z0-9_-]{11}$/.test(t)?t:null}if(s==="youtube.com"||s==="m.youtube.com"||s==="music.youtube.com"||s==="youtube-nocookie.com"){const t=n.searchParams.get("v");if(t&&/^[A-Za-z0-9_-]{11}$/.test(t))return t;const a=/^\/(?:embed|shorts|v|live)\/([A-Za-z0-9_-]{11})/.exec(n.pathname);if(a)return a[1]}return null}function U(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 t=/^(?:(\d+)h)?(?:(\d+)m)?(?:(\d+)s)?$/.exec(s);if(t){const a=Number.parseInt(t[1]??"0",10),h=Number.parseInt(t[2]??"0",10),p=Number.parseInt(t[3]??"0",10),i=a*3600+h*60+p;return i>0?i:null}}catch{}return null}function Y(e,n={}){const{autoPlay:s=!1,muted:t=!0,loop:a=!1,controls:h=!0,startSeconds:p}=n,i=new URLSearchParams({rel:"0",modestbranding:"1",playsinline:"1",controls:h?"1":"0"});return s?(i.set("autoplay","1"),i.set("mute","1")):t&&i.set("mute","1"),a&&(i.set("loop","1"),i.set("playlist",e)),p&&p>0&&i.set("start",String(p)),`https://www.youtube-nocookie.com/embed/${e}?${i.toString()}`}const K=({src:e,poster:n,showDeviceToggle:s=!0,defaultDevice:t="desktop",hoverPlay:a=!1,tooltipText:h,onClose:p,className:i="",muted:c=!0,loop:y=!1,controls:b=!1,autoPlay:o=!1,frameMaxWidth:d,aspectRatio:u,hlsConfig:M,children:P})=>{const m=l.useRef(null),w=l.useRef(null),[v,T]=l.useState(t),[_,g]=l.useState(!1),[B,k]=l.useState(!1),j=l.useMemo(()=>Z(e),[e]),C=j!==null,V=l.useMemo(()=>v==="mobile"?(u==null?void 0:u.mobile)??"9/16":(u==null?void 0:u.desktop)??"16/9",[v,u]),z=l.useMemo(()=>v==="mobile"?(d==null?void 0:d.mobile)??"420px":(d==null?void 0:d.desktop)??"960px",[v,d]),D=l.useMemo(()=>j?Y(j,{autoPlay:o,muted:c,loop:y,controls:b,startSeconds:U(e)}):null,[j,e,o,c,y,b]),x=l.useCallback(async()=>{const f=m.current;if(f){if(w.current)try{await w.current}catch{}f.pause()}},[]),L=l.useCallback(async()=>{const f=m.current;if(f)try{f.readyState<2&&f.load();const E=f.play();w.current=E,await E,g(!0)}catch{g(!1)}finally{w.current=null}},[]),q=l.useCallback(()=>{!a||C||L()},[a,C,L]),O=l.useCallback(()=>{!a||C||x().then(()=>g(!1))},[a,C,x]),A=l.useCallback(async()=>{const f=m.current;f&&(f.paused?await L():(await x(),g(!1)))},[L,x]);return r.jsxs("div",{className:I("gvp-root",i),style:{width:z,aspectRatio:V},onMouseEnter:()=>{k(!0),q()},onMouseLeave:()=>{k(!1),O()},children:[C?r.jsx("iframe",{className:"gvp-video gvp-youtube",src:D??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"}):r.jsx($,{ref:m,src:e,poster:n,muted:c,loop:y,playsInline:!0,preload:"metadata",controls:b,autoPlay:o,hlsConfig:M,className:"gvp-video",onPlay:()=>g(!0),onPause:()=>g(!1),children:P}),!C&&r.jsx("div",{className:"gvp-vignette"}),s&&r.jsx("div",{className:"gvp-toggle",children:r.jsxs("div",{className:"gvp-toggle-pill",children:[r.jsx("button",{type:"button",onClick:()=>T("desktop"),className:I("gvp-toggle-btn",v==="desktop"&&"is-active"),"aria-label":"Desktop view","aria-pressed":v==="desktop",children:r.jsx(J,{})}),r.jsx("div",{className:"gvp-toggle-divider"}),r.jsx("button",{type:"button",onClick:()=>T("mobile"),className:I("gvp-toggle-btn",v==="mobile"&&"is-active"),"aria-label":"Mobile view","aria-pressed":v==="mobile",children:r.jsx(W,{})})]})}),p&&r.jsx("button",{type:"button",onClick:p,className:"gvp-close","aria-label":"Close",children:r.jsx(X,{})}),!C&&!_&&r.jsx("div",{className:"gvp-play-wrap",children:r.jsxs("button",{type:"button",onClick:()=>void A(),onMouseEnter:()=>k(!0),onMouseLeave:()=>k(!1),className:"gvp-play","aria-label":"Play",children:[r.jsx(G,{}),h&&B&&r.jsx("span",{className:"gvp-tooltip",role:"tooltip",children:h})]})}),!C&&r.jsx("div",{className:"gvp-bottom-fade"})]})};exports.ReactVideoPlayer=K;exports.parseYouTubeId=Z;exports.parseYouTubeStart=U;exports.youTubeEmbedUrl=Y;
3
3
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/HLSPlayer.tsx","../src/utils/icons.tsx","../src/VideoPlayerWrapper.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","\"use client\";\n\nimport Hls from \"hls.js\";\nimport React, { useEffect, useImperativeHandle, useRef } from \"react\";\nimport type { HLSPlayerProps } from \"./types\";\n\nexport const HLSPlayer = React.forwardRef<HTMLVideoElement, HLSPlayerProps>(\n ({ src, hlsConfig, isHls, children, ...videoProps }, forwardedRef) => {\n const internalRef = useRef<HTMLVideoElement | null>(null);\n const hlsRef = useRef<Hls | null>(null);\n\n useImperativeHandle(forwardedRef, () => internalRef.current as HTMLVideoElement);\n\n const canUseHlsJs = globalThis.window !== undefined && Hls.isSupported();\n const shouldUseHls =\n Boolean(isHls) || (canUseHlsJs && typeof src === \"string\" && src.endsWith(\".m3u8\"));\n\n useEffect(() => {\n if (!src) return;\n const videoEl = internalRef.current;\n if (!videoEl) return;\n\n // destroy previous\n if (hlsRef.current) {\n hlsRef.current.destroy();\n hlsRef.current = null;\n }\n\n // reset video element\n videoEl.pause();\n videoEl.removeAttribute(\"src\");\n while (videoEl.firstChild) videoEl.firstChild.remove();\n\n if (shouldUseHls) {\n const hls = new Hls(hlsConfig);\n hlsRef.current = hls;\n\n hls.attachMedia(videoEl);\n hls.loadSource(src);\n\n hls.on(Hls.Events.ERROR, (_evt, data) => {\n if (data.fatal) {\n hls.destroy();\n hlsRef.current = null;\n }\n });\n } else {\n // native playback\n videoEl.src = src;\n videoEl.load();\n }\n\n return () => {\n if (hlsRef.current) {\n hlsRef.current.destroy();\n hlsRef.current = null;\n }\n videoEl.pause();\n videoEl.removeAttribute(\"src\");\n while (videoEl.firstChild) videoEl.firstChild.remove();\n videoEl.load();\n };\n }, [src, shouldUseHls, hlsConfig]);\n\n // Captions are the consumer's responsibility — pass <track> elements as children.\n // NOSONAR: typescript:S4084\n return (\n <video ref={internalRef} {...videoProps}>\n {children}\n </video>\n );\n }\n);\n\nHLSPlayer.displayName = \"HLSPlayer\";\nexport default HLSPlayer;\n","\"use client\";\n\nimport React from \"react\";\n\ntype IconProps = { className?: string };\n\nconst baseClass = \"gvp-icon\";\nconst cls = (extra?: string) => (extra ? `${baseClass} ${extra}` : baseClass);\n\nexport const IconDesktop: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n <path\n d=\"M11 15H13\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n <path d=\"M7 22H17\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n);\n\nexport const IconMobile: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n <path\n d=\"M11 19H13\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinejoin=\"round\"\n />\n </svg>\n);\n\nexport const IconX: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport const IconPlay: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"22\"\n height=\"22\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n fill=\"currentColor\"\n />\n </svg>\n);\n","\"use client\";\n\nimport clsx from \"clsx\";\nimport React, { useCallback, useMemo, useRef, useState } from \"react\";\nimport { HLSPlayer } from \"./HLSPlayer\";\nimport type { DeviceMode, VideoPlayerWrapperProps } from \"./types\";\nimport { IconDesktop, IconMobile, IconPlay, IconX } from \"./utils/icons\";\n\nexport const VideoPlayerWrapper: React.FC<VideoPlayerWrapperProps> = ({\n src,\n poster,\n showDeviceToggle = true,\n defaultDevice = \"desktop\",\n hoverPlay = false,\n tooltipText,\n onClose,\n className = \"\",\n muted = true,\n loop = false,\n controls = false,\n frameMaxWidth: customFrameMaxWidth,\n aspectRatio: customAspectRatio,\n hlsConfig,\n children,\n}) => {\n const videoRef = useRef<HTMLVideoElement | null>(null);\n const playPromiseRef = useRef<Promise<void> | null>(null);\n\n const [device, setDevice] = useState<DeviceMode>(defaultDevice);\n const [isPlaying, setIsPlaying] = useState(false);\n const [showTooltip, setShowTooltip] = useState(false);\n\n const aspectRatio = useMemo(() => {\n return device === \"mobile\"\n ? (customAspectRatio?.mobile ?? \"9/16\")\n : (customAspectRatio?.desktop ?? \"16/9\");\n }, [device, customAspectRatio]);\n\n const frameMaxWidth = useMemo(() => {\n return device === \"mobile\"\n ? (customFrameMaxWidth?.mobile ?? \"420px\")\n : (customFrameMaxWidth?.desktop ?? \"960px\");\n }, [device, customFrameMaxWidth]);\n\n const safePause = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n if (playPromiseRef.current) {\n try {\n await playPromiseRef.current;\n } catch {\n /* play was interrupted; nothing to await */\n }\n }\n el.pause();\n }, []);\n\n const safePlay = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n try {\n if (el.readyState < 2) el.load();\n const p = el.play();\n playPromiseRef.current = p;\n await p;\n setIsPlaying(true);\n } catch {\n setIsPlaying(false);\n } finally {\n playPromiseRef.current = null;\n }\n }, []);\n\n const hoverStart = useCallback(() => {\n if (!hoverPlay) return;\n void safePlay();\n }, [hoverPlay, safePlay]);\n\n const hoverStop = useCallback(() => {\n if (!hoverPlay) return;\n void safePause().then(() => setIsPlaying(false));\n }, [hoverPlay, safePause]);\n\n const togglePlay = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n if (el.paused) {\n await safePlay();\n } else {\n await safePause();\n setIsPlaying(false);\n }\n }, [safePlay, safePause]);\n\n return (\n // The mouse handlers are a progressive enhancement (hoverPlay + tooltip).\n // Keyboard/click users reach the same actions via the inner <button> elements,\n // so the outer container is intentionally non-interactive at the role level.\n // NOSONAR: typescript:S6848\n <div\n className={clsx(\"gvp-root\", className)}\n style={{ width: frameMaxWidth, aspectRatio }}\n onMouseEnter={() => {\n setShowTooltip(true);\n hoverStart();\n }}\n onMouseLeave={() => {\n setShowTooltip(false);\n hoverStop();\n }}\n >\n <HLSPlayer\n ref={videoRef}\n src={src}\n poster={poster}\n muted={muted}\n loop={loop}\n playsInline\n preload=\"metadata\"\n controls={controls}\n hlsConfig={hlsConfig}\n className=\"gvp-video\"\n onPlay={() => setIsPlaying(true)}\n onPause={() => setIsPlaying(false)}\n >\n {children}\n </HLSPlayer>\n\n <div className=\"gvp-vignette\" />\n\n {showDeviceToggle && (\n <div className=\"gvp-toggle\">\n <div className=\"gvp-toggle-pill\">\n <button\n type=\"button\"\n onClick={() => setDevice(\"desktop\")}\n className={clsx(\n \"gvp-toggle-btn\",\n device === \"desktop\" && \"is-active\"\n )}\n aria-label=\"Desktop view\"\n aria-pressed={device === \"desktop\"}\n >\n <IconDesktop />\n </button>\n\n <div className=\"gvp-toggle-divider\" />\n\n <button\n type=\"button\"\n onClick={() => setDevice(\"mobile\")}\n className={clsx(\n \"gvp-toggle-btn\",\n device === \"mobile\" && \"is-active\"\n )}\n aria-label=\"Mobile view\"\n aria-pressed={device === \"mobile\"}\n >\n <IconMobile />\n </button>\n </div>\n </div>\n )}\n\n {onClose && (\n <button\n type=\"button\"\n onClick={onClose}\n className=\"gvp-close\"\n aria-label=\"Close\"\n >\n <IconX />\n </button>\n )}\n\n {!isPlaying && (\n <div className=\"gvp-play-wrap\">\n <button\n type=\"button\"\n onClick={() => void togglePlay()}\n onMouseEnter={() => setShowTooltip(true)}\n onMouseLeave={() => setShowTooltip(false)}\n className=\"gvp-play\"\n aria-label=\"Play\"\n >\n <IconPlay />\n {tooltipText && showTooltip && (\n <span className=\"gvp-tooltip\" role=\"tooltip\">\n {tooltipText}\n </span>\n )}\n </button>\n </div>\n )}\n\n <div className=\"gvp-bottom-fade\" />\n </div>\n );\n};\n\nexport default VideoPlayerWrapper;\n"],"names":["r","t","f","n","o","clsx","HLSPlayer","React","src","hlsConfig","isHls","children","videoProps","forwardedRef","internalRef","useRef","hlsRef","useImperativeHandle","canUseHlsJs","Hls","shouldUseHls","useEffect","videoEl","hls","_evt","data","baseClass","cls","extra","IconDesktop","className","jsxs","jsx","IconMobile","IconX","IconPlay","VideoPlayerWrapper","poster","showDeviceToggle","defaultDevice","hoverPlay","tooltipText","onClose","muted","loop","controls","customFrameMaxWidth","customAspectRatio","videoRef","playPromiseRef","device","setDevice","useState","isPlaying","setIsPlaying","showTooltip","setShowTooltip","aspectRatio","useMemo","frameMaxWidth","safePause","useCallback","el","safePlay","p","hoverStart","hoverStop","togglePlay"],"mappings":"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","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"index.cjs","sources":["../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/HLSPlayer.tsx","../src/utils/icons.tsx","../src/utils/youtube.ts","../src/VideoPlayerWrapper.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","\"use client\";\n\nimport Hls from \"hls.js\";\nimport React, { useEffect, useImperativeHandle, useRef } from \"react\";\nimport type { HLSPlayerProps } from \"./types\";\n\nexport const HLSPlayer = React.forwardRef<HTMLVideoElement, HLSPlayerProps>(\n ({ src, hlsConfig, isHls, autoPlay, children, ...videoProps }, forwardedRef) => {\n const internalRef = useRef<HTMLVideoElement | null>(null);\n const hlsRef = useRef<Hls | null>(null);\n\n useImperativeHandle(forwardedRef, () => internalRef.current as HTMLVideoElement);\n\n const canUseHlsJs = globalThis.window !== undefined && Hls.isSupported();\n const shouldUseHls =\n Boolean(isHls) || (canUseHlsJs && typeof src === \"string\" && src.endsWith(\".m3u8\"));\n\n useEffect(() => {\n if (!src) return;\n const videoEl = internalRef.current;\n if (!videoEl) return;\n\n // Tries to start playback once the stream is ready. Browsers only\n // honor sound-on autoplay after a user gesture, so this is best\n // effort — silently swallows the NotAllowedError when blocked.\n const tryAutoPlay = () => {\n if (!autoPlay) return;\n videoEl.play().catch(() => {\n /* autoplay blocked; user gesture required */\n });\n };\n\n // destroy previous\n if (hlsRef.current) {\n hlsRef.current.destroy();\n hlsRef.current = null;\n }\n\n // reset video element\n videoEl.pause();\n videoEl.removeAttribute(\"src\");\n while (videoEl.firstChild) videoEl.firstChild.remove();\n\n if (shouldUseHls) {\n const hls = new Hls(hlsConfig);\n hlsRef.current = hls;\n\n hls.attachMedia(videoEl);\n hls.loadSource(src);\n\n hls.on(Hls.Events.MANIFEST_PARSED, tryAutoPlay);\n hls.on(Hls.Events.ERROR, (_evt, data) => {\n if (data.fatal) {\n hls.destroy();\n hlsRef.current = null;\n }\n });\n } else {\n // native playback\n videoEl.src = src;\n videoEl.load();\n // For a plain <video>, we wait for metadata so play() has\n // something to start.\n videoEl.addEventListener(\"loadedmetadata\", tryAutoPlay, { once: true });\n }\n\n return () => {\n videoEl.removeEventListener(\"loadedmetadata\", tryAutoPlay);\n if (hlsRef.current) {\n hlsRef.current.destroy();\n hlsRef.current = null;\n }\n videoEl.pause();\n videoEl.removeAttribute(\"src\");\n while (videoEl.firstChild) videoEl.firstChild.remove();\n videoEl.load();\n };\n }, [src, shouldUseHls, hlsConfig, autoPlay]);\n\n // Captions are the consumer's responsibility — pass <track> elements as children.\n // NOSONAR: typescript:S4084\n return (\n <video ref={internalRef} {...videoProps}>\n {children}\n </video>\n );\n }\n);\n\nHLSPlayer.displayName = \"HLSPlayer\";\nexport default HLSPlayer;\n","\"use client\";\n\nimport React from \"react\";\n\ntype IconProps = { className?: string };\n\nconst baseClass = \"gvp-icon\";\nconst cls = (extra?: string) => (extra ? `${baseClass} ${extra}` : baseClass);\n\nexport const IconDesktop: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n <path\n d=\"M11 15H13\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n <path d=\"M7 22H17\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n);\n\nexport const IconMobile: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n <path\n d=\"M11 19H13\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinejoin=\"round\"\n />\n </svg>\n);\n\nexport const IconX: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport const IconPlay: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"22\"\n height=\"22\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n fill=\"currentColor\"\n />\n </svg>\n);\n","/**\n * Extract a YouTube video ID from any common URL form, or `null` if the URL\n * isn't a YouTube link.\n *\n * Recognised:\n * - https://www.youtube.com/watch?v=ID\n * - https://youtube.com/watch?v=ID&t=42\n * - https://youtu.be/ID\n * - https://youtu.be/ID?t=42\n * - https://www.youtube.com/embed/ID\n * - https://www.youtube.com/shorts/ID\n * - https://music.youtube.com/watch?v=ID\n * - bare 11-character video IDs\n */\nexport function parseYouTubeId(input: string): string | null {\n if (!input) return null;\n\n // Bare 11-char ID (YouTube IDs are [A-Za-z0-9_-]{11}).\n if (/^[A-Za-z0-9_-]{11}$/.test(input)) return input;\n\n let url: URL;\n try {\n url = new URL(input);\n } catch {\n return null;\n }\n\n const host = url.hostname.replace(/^www\\./, \"\");\n\n if (host === \"youtu.be\") {\n const id = url.pathname.slice(1).split(\"/\")[0];\n return /^[A-Za-z0-9_-]{11}$/.test(id) ? id : null;\n }\n\n if (\n host === \"youtube.com\" ||\n host === \"m.youtube.com\" ||\n host === \"music.youtube.com\" ||\n host === \"youtube-nocookie.com\"\n ) {\n // /watch?v=ID\n const v = url.searchParams.get(\"v\");\n if (v && /^[A-Za-z0-9_-]{11}$/.test(v)) return v;\n\n // /embed/ID, /shorts/ID, /v/ID, /live/ID\n const m = /^\\/(?:embed|shorts|v|live)\\/([A-Za-z0-9_-]{11})/.exec(\n url.pathname\n );\n if (m) return m[1];\n }\n\n return null;\n}\n\n/** Extract a `t`/`start` timestamp (in seconds) from a YouTube URL, if present. */\nexport function parseYouTubeStart(input: string): number | null {\n try {\n const url = new URL(input);\n const t = url.searchParams.get(\"t\") ?? url.searchParams.get(\"start\");\n if (!t) return null;\n // Supports \"90\", \"90s\", \"1m30s\", \"1h2m3s\".\n if (/^\\d+s?$/.test(t)) return Number.parseInt(t, 10);\n const m = /^(?:(\\d+)h)?(?:(\\d+)m)?(?:(\\d+)s)?$/.exec(t);\n if (m) {\n const h = Number.parseInt(m[1] ?? \"0\", 10);\n const min = Number.parseInt(m[2] ?? \"0\", 10);\n const s = Number.parseInt(m[3] ?? \"0\", 10);\n const total = h * 3600 + min * 60 + s;\n return total > 0 ? total : null;\n }\n } catch {\n /* not a URL */\n }\n return null;\n}\n\nexport interface YouTubeEmbedOptions {\n /** Start playback immediately. Forces `mute` on, since browsers block sound-on autoplay. */\n autoPlay?: boolean;\n /** Mute the player. */\n muted?: boolean;\n /** Loop the video. */\n loop?: boolean;\n /** Show YouTube's player controls. Defaults to `true`. */\n controls?: boolean;\n /** Start offset in seconds. */\n startSeconds?: number | null;\n}\n\n/**\n * Build a privacy-enhanced YouTube embed URL from a video ID and player options.\n *\n * Notes on YouTube's quirks:\n * - `autoplay=1` only takes effect if `mute=1` is also set (browser policy).\n * - single-video loop requires `loop=1` **and** `playlist=<id>`.\n */\nexport function youTubeEmbedUrl(id: string, opts: YouTubeEmbedOptions = {}): string {\n const { autoPlay = false, muted = true, loop = false, controls = true, startSeconds } = opts;\n\n const params = new URLSearchParams({\n rel: \"0\",\n modestbranding: \"1\",\n playsinline: \"1\",\n controls: controls ? \"1\" : \"0\",\n });\n\n if (autoPlay) {\n params.set(\"autoplay\", \"1\");\n params.set(\"mute\", \"1\"); // required for autoplay to actually fire\n } else if (muted) {\n params.set(\"mute\", \"1\");\n }\n\n if (loop) {\n params.set(\"loop\", \"1\");\n params.set(\"playlist\", id); // YouTube needs this for single-video loop\n }\n\n if (startSeconds && startSeconds > 0) {\n params.set(\"start\", String(startSeconds));\n }\n\n return `https://www.youtube-nocookie.com/embed/${id}?${params.toString()}`;\n}\n","\"use client\";\n\nimport clsx from \"clsx\";\nimport React, { useCallback, useMemo, useRef, useState } from \"react\";\nimport { HLSPlayer } from \"./HLSPlayer\";\nimport type { DeviceMode, VideoPlayerWrapperProps } from \"./types\";\nimport { IconDesktop, IconMobile, IconPlay, IconX } from \"./utils/icons\";\nimport { parseYouTubeId, parseYouTubeStart, youTubeEmbedUrl } from \"./utils/youtube\";\n\nexport const VideoPlayerWrapper: React.FC<VideoPlayerWrapperProps> = ({\n src,\n poster,\n showDeviceToggle = true,\n defaultDevice = \"desktop\",\n hoverPlay = false,\n tooltipText,\n onClose,\n className = \"\",\n muted = true,\n loop = false,\n controls = false,\n autoPlay = false,\n frameMaxWidth: customFrameMaxWidth,\n aspectRatio: customAspectRatio,\n hlsConfig,\n children,\n}) => {\n const videoRef = useRef<HTMLVideoElement | null>(null);\n const playPromiseRef = useRef<Promise<void> | null>(null);\n\n const [device, setDevice] = useState<DeviceMode>(defaultDevice);\n const [isPlaying, setIsPlaying] = useState(false);\n const [showTooltip, setShowTooltip] = useState(false);\n\n const youTubeId = useMemo(() => parseYouTubeId(src), [src]);\n const isYouTube = youTubeId !== null;\n\n const aspectRatio = useMemo(() => {\n return device === \"mobile\"\n ? (customAspectRatio?.mobile ?? \"9/16\")\n : (customAspectRatio?.desktop ?? \"16/9\");\n }, [device, customAspectRatio]);\n\n const frameMaxWidth = useMemo(() => {\n return device === \"mobile\"\n ? (customFrameMaxWidth?.mobile ?? \"420px\")\n : (customFrameMaxWidth?.desktop ?? \"960px\");\n }, [device, customFrameMaxWidth]);\n\n const youTubeSrc = useMemo(\n () =>\n youTubeId\n ? youTubeEmbedUrl(youTubeId, {\n autoPlay,\n muted,\n loop,\n controls,\n startSeconds: parseYouTubeStart(src),\n })\n : null,\n [youTubeId, src, autoPlay, muted, loop, controls]\n );\n\n const safePause = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n if (playPromiseRef.current) {\n try {\n await playPromiseRef.current;\n } catch {\n /* play was interrupted; nothing to await */\n }\n }\n el.pause();\n }, []);\n\n const safePlay = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n try {\n if (el.readyState < 2) el.load();\n const p = el.play();\n playPromiseRef.current = p;\n await p;\n setIsPlaying(true);\n } catch {\n setIsPlaying(false);\n } finally {\n playPromiseRef.current = null;\n }\n }, []);\n\n const hoverStart = useCallback(() => {\n if (!hoverPlay || isYouTube) return;\n void safePlay();\n }, [hoverPlay, isYouTube, safePlay]);\n\n const hoverStop = useCallback(() => {\n if (!hoverPlay || isYouTube) return;\n void safePause().then(() => setIsPlaying(false));\n }, [hoverPlay, isYouTube, safePause]);\n\n const togglePlay = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n if (el.paused) {\n await safePlay();\n } else {\n await safePause();\n setIsPlaying(false);\n }\n }, [safePlay, safePause]);\n\n return (\n // The mouse handlers are a progressive enhancement (hoverPlay + tooltip).\n // Keyboard/click users reach the same actions via the inner <button> elements,\n // so the outer container is intentionally non-interactive at the role level.\n // NOSONAR: typescript:S6848\n <div\n className={clsx(\"gvp-root\", className)}\n style={{ width: frameMaxWidth, aspectRatio }}\n onMouseEnter={() => {\n setShowTooltip(true);\n hoverStart();\n }}\n onMouseLeave={() => {\n setShowTooltip(false);\n hoverStop();\n }}\n >\n {isYouTube ? (\n <iframe\n className=\"gvp-video gvp-youtube\"\n src={youTubeSrc ?? undefined}\n title=\"YouTube video player\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\"\n allowFullScreen\n referrerPolicy=\"strict-origin-when-cross-origin\"\n />\n ) : (\n <HLSPlayer\n ref={videoRef}\n src={src}\n poster={poster}\n muted={muted}\n loop={loop}\n playsInline\n preload=\"metadata\"\n controls={controls}\n autoPlay={autoPlay}\n hlsConfig={hlsConfig}\n className=\"gvp-video\"\n onPlay={() => setIsPlaying(true)}\n onPause={() => setIsPlaying(false)}\n >\n {children}\n </HLSPlayer>\n )}\n\n {!isYouTube && <div className=\"gvp-vignette\" />}\n\n {showDeviceToggle && (\n <div className=\"gvp-toggle\">\n <div className=\"gvp-toggle-pill\">\n <button\n type=\"button\"\n onClick={() => setDevice(\"desktop\")}\n className={clsx(\n \"gvp-toggle-btn\",\n device === \"desktop\" && \"is-active\"\n )}\n aria-label=\"Desktop view\"\n aria-pressed={device === \"desktop\"}\n >\n <IconDesktop />\n </button>\n\n <div className=\"gvp-toggle-divider\" />\n\n <button\n type=\"button\"\n onClick={() => setDevice(\"mobile\")}\n className={clsx(\n \"gvp-toggle-btn\",\n device === \"mobile\" && \"is-active\"\n )}\n aria-label=\"Mobile view\"\n aria-pressed={device === \"mobile\"}\n >\n <IconMobile />\n </button>\n </div>\n </div>\n )}\n\n {onClose && (\n <button\n type=\"button\"\n onClick={onClose}\n className=\"gvp-close\"\n aria-label=\"Close\"\n >\n <IconX />\n </button>\n )}\n\n {!isYouTube && !isPlaying && (\n <div className=\"gvp-play-wrap\">\n <button\n type=\"button\"\n onClick={() => void togglePlay()}\n onMouseEnter={() => setShowTooltip(true)}\n onMouseLeave={() => setShowTooltip(false)}\n className=\"gvp-play\"\n aria-label=\"Play\"\n >\n <IconPlay />\n {tooltipText && showTooltip && (\n <span className=\"gvp-tooltip\" role=\"tooltip\">\n {tooltipText}\n </span>\n )}\n </button>\n </div>\n )}\n\n {!isYouTube && <div className=\"gvp-bottom-fade\" />}\n </div>\n );\n};\n\nexport default VideoPlayerWrapper;\n"],"names":["r","t","f","n","o","clsx","HLSPlayer","React","src","hlsConfig","isHls","autoPlay","children","videoProps","forwardedRef","internalRef","useRef","hlsRef","useImperativeHandle","canUseHlsJs","Hls","shouldUseHls","useEffect","videoEl","tryAutoPlay","hls","_evt","data","baseClass","cls","extra","IconDesktop","className","jsxs","jsx","IconMobile","IconX","IconPlay","parseYouTubeId","input","url","host","id","v","m","parseYouTubeStart","h","min","s","total","youTubeEmbedUrl","opts","muted","loop","controls","startSeconds","params","VideoPlayerWrapper","poster","showDeviceToggle","defaultDevice","hoverPlay","tooltipText","onClose","customFrameMaxWidth","customAspectRatio","videoRef","playPromiseRef","device","setDevice","useState","isPlaying","setIsPlaying","showTooltip","setShowTooltip","youTubeId","useMemo","isYouTube","aspectRatio","frameMaxWidth","youTubeSrc","safePause","useCallback","el","safePlay","p","hoverStart","hoverStop","togglePlay"],"mappings":"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","x_google_ignoreList":[0]}
package/dist/index.d.ts CHANGED
@@ -5,6 +5,25 @@ declare type AspectRatio = `${number}/${number}`;
5
5
 
6
6
  declare type DeviceMode = "desktop" | "mobile";
7
7
 
8
+ /**
9
+ * Extract a YouTube video ID from any common URL form, or `null` if the URL
10
+ * isn't a YouTube link.
11
+ *
12
+ * Recognised:
13
+ * - https://www.youtube.com/watch?v=ID
14
+ * - https://youtube.com/watch?v=ID&t=42
15
+ * - https://youtu.be/ID
16
+ * - https://youtu.be/ID?t=42
17
+ * - https://www.youtube.com/embed/ID
18
+ * - https://www.youtube.com/shorts/ID
19
+ * - https://music.youtube.com/watch?v=ID
20
+ * - bare 11-character video IDs
21
+ */
22
+ export declare function parseYouTubeId(input: string): string | null;
23
+
24
+ /** Extract a `t`/`start` timestamp (in seconds) from a YouTube URL, if present. */
25
+ export declare function parseYouTubeStart(input: string): number | null;
26
+
8
27
  export declare const ReactVideoPlayer: default_2.FC<ReactVideoPlayerProps>;
9
28
 
10
29
  export declare interface ReactVideoPlayerProps {
@@ -30,6 +49,12 @@ export declare interface ReactVideoPlayerProps {
30
49
  loop?: boolean;
31
50
  /** Show native browser controls. Defaults to `false`. */
32
51
  controls?: boolean;
52
+ /**
53
+ * Start playback as soon as the source loads. Defaults to `false`.
54
+ * Browsers block sound-on autoplay, so this only autoplays when `muted`
55
+ * is also `true` (which is the default).
56
+ */
57
+ autoPlay?: boolean;
33
58
  /** Maximum width of the player in each device mode. */
34
59
  frameMaxWidth?: {
35
60
  desktop?: string;
@@ -52,4 +77,26 @@ export declare interface ReactVideoPlayerProps {
52
77
  children?: default_2.ReactNode;
53
78
  }
54
79
 
80
+ declare interface YouTubeEmbedOptions {
81
+ /** Start playback immediately. Forces `mute` on, since browsers block sound-on autoplay. */
82
+ autoPlay?: boolean;
83
+ /** Mute the player. */
84
+ muted?: boolean;
85
+ /** Loop the video. */
86
+ loop?: boolean;
87
+ /** Show YouTube's player controls. Defaults to `true`. */
88
+ controls?: boolean;
89
+ /** Start offset in seconds. */
90
+ startSeconds?: number | null;
91
+ }
92
+
93
+ /**
94
+ * Build a privacy-enhanced YouTube embed URL from a video ID and player options.
95
+ *
96
+ * Notes on YouTube's quirks:
97
+ * - `autoplay=1` only takes effect if `mute=1` is also set (browser policy).
98
+ * - single-video loop requires `loop=1` **and** `playlist=<id>`.
99
+ */
100
+ export declare function youTubeEmbedUrl(id: string, opts?: YouTubeEmbedOptions): string;
101
+
55
102
  export { }
package/dist/index.mjs CHANGED
@@ -1,50 +1,53 @@
1
1
  "use client";
2
- import { jsx as r, jsxs as v } from "react/jsx-runtime";
3
- import X, { useRef as m, useImperativeHandle as _, useEffect as q, useState as M, useMemo as B, useCallback as C } from "react";
4
- import S from "hls.js";
5
- function x(e) {
6
- var o, l, t = "";
2
+ import { jsx as r, jsxs as m } from "react/jsx-runtime";
3
+ import X, { useRef as H, useImperativeHandle as q, useEffect as G, useState as $, useMemo as I, useCallback as b } from "react";
4
+ import E from "hls.js";
5
+ function _(e) {
6
+ var o, n, t = "";
7
7
  if (typeof e == "string" || typeof e == "number") t += e;
8
8
  else if (typeof e == "object") if (Array.isArray(e)) {
9
- var i = e.length;
10
- for (o = 0; o < i; o++) e[o] && (l = x(e[o])) && (t && (t += " "), t += l);
11
- } else for (l in e) e[l] && (t && (t += " "), t += l);
9
+ var l = e.length;
10
+ for (o = 0; o < l; o++) e[o] && (n = _(e[o])) && (t && (t += " "), t += n);
11
+ } else for (n in e) e[n] && (t && (t += " "), t += n);
12
12
  return t;
13
13
  }
14
- function I() {
15
- for (var e, o, l = 0, t = "", i = arguments.length; l < i; l++) (e = arguments[l]) && (o = x(e)) && (t && (t += " "), t += o);
14
+ function Z() {
15
+ for (var e, o, n = 0, t = "", l = arguments.length; n < l; n++) (e = arguments[n]) && (o = _(e)) && (t && (t += " "), t += o);
16
16
  return t;
17
17
  }
18
- const Z = X.forwardRef(
19
- ({ src: e, hlsConfig: o, isHls: l, children: t, ...i }, h) => {
20
- const p = m(null), a = m(null);
21
- _(h, () => p.current);
22
- const H = globalThis.window !== void 0 && S.isSupported(), g = !!l || H && typeof e == "string" && e.endsWith(".m3u8");
23
- return q(() => {
18
+ const B = X.forwardRef(
19
+ ({ src: e, hlsConfig: o, isHls: n, autoPlay: t, children: l, ...f }, d) => {
20
+ const a = H(null), c = H(null);
21
+ q(d, () => a.current);
22
+ const y = globalThis.window !== void 0 && E.isSupported(), C = !!n || y && typeof e == "string" && e.endsWith(".m3u8");
23
+ return G(() => {
24
24
  if (!e) return;
25
- const n = p.current;
26
- if (n) {
27
- for (a.current && (a.current.destroy(), a.current = null), n.pause(), n.removeAttribute("src"); n.firstChild; ) n.firstChild.remove();
28
- if (g) {
29
- const s = new S(o);
30
- a.current = s, s.attachMedia(n), s.loadSource(e), s.on(S.Events.ERROR, (d, P) => {
31
- P.fatal && (s.destroy(), a.current = null);
32
- });
33
- } else
34
- n.src = e, n.load();
35
- return () => {
36
- for (a.current && (a.current.destroy(), a.current = null), n.pause(), n.removeAttribute("src"); n.firstChild; ) n.firstChild.remove();
37
- n.load();
38
- };
39
- }
40
- }, [e, g, o]), /* @__PURE__ */ r("video", { ref: p, ...i, children: t });
25
+ const s = a.current;
26
+ if (!s) return;
27
+ const u = () => {
28
+ t && s.play().catch(() => {
29
+ });
30
+ };
31
+ for (c.current && (c.current.destroy(), c.current = null), s.pause(), s.removeAttribute("src"); s.firstChild; ) s.firstChild.remove();
32
+ if (C) {
33
+ const i = new E(o);
34
+ c.current = i, i.attachMedia(s), i.loadSource(e), i.on(E.Events.MANIFEST_PARSED, u), i.on(E.Events.ERROR, (R, T) => {
35
+ T.fatal && (i.destroy(), c.current = null);
36
+ });
37
+ } else
38
+ s.src = e, s.load(), s.addEventListener("loadedmetadata", u, { once: !0 });
39
+ return () => {
40
+ for (s.removeEventListener("loadedmetadata", u), c.current && (c.current.destroy(), c.current = null), s.pause(), s.removeAttribute("src"); s.firstChild; ) s.firstChild.remove();
41
+ s.load();
42
+ };
43
+ }, [e, C, o, t]), /* @__PURE__ */ r("video", { ref: a, ...f, children: l });
41
44
  }
42
45
  );
43
- Z.displayName = "HLSPlayer";
44
- const V = "gvp-icon", N = (e) => e ? `${V} ${e}` : V, z = ({ className: e }) => /* @__PURE__ */ v(
46
+ B.displayName = "HLSPlayer";
47
+ const U = "gvp-icon", M = (e) => e ? `${U} ${e}` : U, K = ({ className: e }) => /* @__PURE__ */ m(
45
48
  "svg",
46
49
  {
47
- className: N(e),
50
+ className: M(e),
48
51
  width: "20",
49
52
  height: "20",
50
53
  viewBox: "0 0 24 24",
@@ -83,10 +86,10 @@ const V = "gvp-icon", N = (e) => e ? `${V} ${e}` : V, z = ({ className: e }) =>
83
86
  /* @__PURE__ */ r("path", { d: "M7 22H17", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
84
87
  ]
85
88
  }
86
- ), G = ({ className: e }) => /* @__PURE__ */ v(
89
+ ), Q = ({ className: e }) => /* @__PURE__ */ m(
87
90
  "svg",
88
91
  {
89
- className: N(e),
92
+ className: M(e),
90
93
  width: "20",
91
94
  height: "20",
92
95
  viewBox: "0 0 24 24",
@@ -124,10 +127,10 @@ const V = "gvp-icon", N = (e) => e ? `${V} ${e}` : V, z = ({ className: e }) =>
124
127
  )
125
128
  ]
126
129
  }
127
- ), K = ({ className: e }) => /* @__PURE__ */ r(
130
+ ), F = ({ className: e }) => /* @__PURE__ */ r(
128
131
  "svg",
129
132
  {
130
- className: N(e),
133
+ className: M(e),
131
134
  width: "14",
132
135
  height: "14",
133
136
  viewBox: "0 0 14 14",
@@ -142,10 +145,10 @@ const V = "gvp-icon", N = (e) => e ? `${V} ${e}` : V, z = ({ className: e }) =>
142
145
  }
143
146
  )
144
147
  }
145
- ), Q = ({ className: e }) => /* @__PURE__ */ r(
148
+ ), ee = ({ className: e }) => /* @__PURE__ */ r(
146
149
  "svg",
147
150
  {
148
- className: N(e),
151
+ className: M(e),
149
152
  width: "22",
150
153
  height: "22",
151
154
  viewBox: "0 0 16 16",
@@ -160,102 +163,171 @@ const V = "gvp-icon", N = (e) => e ? `${V} ${e}` : V, z = ({ className: e }) =>
160
163
  }
161
164
  )
162
165
  }
163
- ), e1 = ({
166
+ );
167
+ function te(e) {
168
+ if (!e) return null;
169
+ if (/^[A-Za-z0-9_-]{11}$/.test(e)) return e;
170
+ let o;
171
+ try {
172
+ o = new URL(e);
173
+ } catch {
174
+ return null;
175
+ }
176
+ const n = o.hostname.replace(/^www\./, "");
177
+ if (n === "youtu.be") {
178
+ const t = o.pathname.slice(1).split("/")[0];
179
+ return /^[A-Za-z0-9_-]{11}$/.test(t) ? t : null;
180
+ }
181
+ if (n === "youtube.com" || n === "m.youtube.com" || n === "music.youtube.com" || n === "youtube-nocookie.com") {
182
+ const t = o.searchParams.get("v");
183
+ if (t && /^[A-Za-z0-9_-]{11}$/.test(t)) return t;
184
+ const l = /^\/(?:embed|shorts|v|live)\/([A-Za-z0-9_-]{11})/.exec(
185
+ o.pathname
186
+ );
187
+ if (l) return l[1];
188
+ }
189
+ return null;
190
+ }
191
+ function re(e) {
192
+ try {
193
+ const o = new URL(e), n = o.searchParams.get("t") ?? o.searchParams.get("start");
194
+ if (!n) return null;
195
+ if (/^\d+s?$/.test(n)) return Number.parseInt(n, 10);
196
+ const t = /^(?:(\d+)h)?(?:(\d+)m)?(?:(\d+)s)?$/.exec(n);
197
+ if (t) {
198
+ const l = Number.parseInt(t[1] ?? "0", 10), f = Number.parseInt(t[2] ?? "0", 10), d = Number.parseInt(t[3] ?? "0", 10), a = l * 3600 + f * 60 + d;
199
+ return a > 0 ? a : null;
200
+ }
201
+ } catch {
202
+ }
203
+ return null;
204
+ }
205
+ function ne(e, o = {}) {
206
+ const { autoPlay: n = !1, muted: t = !0, loop: l = !1, controls: f = !0, startSeconds: d } = o, a = new URLSearchParams({
207
+ rel: "0",
208
+ modestbranding: "1",
209
+ playsinline: "1",
210
+ controls: f ? "1" : "0"
211
+ });
212
+ return n ? (a.set("autoplay", "1"), a.set("mute", "1")) : t && a.set("mute", "1"), l && (a.set("loop", "1"), a.set("playlist", e)), d && d > 0 && a.set("start", String(d)), `https://www.youtube-nocookie.com/embed/${e}?${a.toString()}`;
213
+ }
214
+ const ae = ({
164
215
  src: e,
165
216
  poster: o,
166
- showDeviceToggle: l = !0,
217
+ showDeviceToggle: n = !0,
167
218
  defaultDevice: t = "desktop",
168
- hoverPlay: i = !1,
169
- tooltipText: h,
170
- onClose: p,
219
+ hoverPlay: l = !1,
220
+ tooltipText: f,
221
+ onClose: d,
171
222
  className: a = "",
172
- muted: H = !0,
173
- loop: g = !1,
174
- controls: n = !1,
175
- frameMaxWidth: s,
176
- aspectRatio: d,
177
- hlsConfig: P,
178
- children: D
223
+ muted: c = !0,
224
+ loop: y = !1,
225
+ controls: C = !1,
226
+ autoPlay: s = !1,
227
+ frameMaxWidth: u,
228
+ aspectRatio: i,
229
+ hlsConfig: R,
230
+ children: T
179
231
  }) => {
180
- const w = m(null), k = m(null), [u, j] = M(t), [R, f] = M(!1), [T, y] = M(!1), U = B(() => u === "mobile" ? (d == null ? void 0 : d.mobile) ?? "9/16" : (d == null ? void 0 : d.desktop) ?? "16/9", [u, d]), $ = B(() => u === "mobile" ? (s == null ? void 0 : s.mobile) ?? "420px" : (s == null ? void 0 : s.desktop) ?? "960px", [u, s]), b = C(async () => {
181
- const c = w.current;
182
- if (c) {
232
+ const w = H(null), k = H(null), [h, j] = $(t), [V, g] = $(!1), [z, L] = $(!1), N = I(() => te(e), [e]), v = N !== null, D = I(() => h === "mobile" ? (i == null ? void 0 : i.mobile) ?? "9/16" : (i == null ? void 0 : i.desktop) ?? "16/9", [h, i]), Y = I(() => h === "mobile" ? (u == null ? void 0 : u.mobile) ?? "420px" : (u == null ? void 0 : u.desktop) ?? "960px", [h, u]), A = I(
233
+ () => N ? ne(N, {
234
+ autoPlay: s,
235
+ muted: c,
236
+ loop: y,
237
+ controls: C,
238
+ startSeconds: re(e)
239
+ }) : null,
240
+ [N, e, s, c, y, C]
241
+ ), S = b(async () => {
242
+ const p = w.current;
243
+ if (p) {
183
244
  if (k.current)
184
245
  try {
185
246
  await k.current;
186
247
  } catch {
187
248
  }
188
- c.pause();
249
+ p.pause();
189
250
  }
190
- }, []), L = C(async () => {
191
- const c = w.current;
192
- if (c)
251
+ }, []), P = b(async () => {
252
+ const p = w.current;
253
+ if (p)
193
254
  try {
194
- c.readyState < 2 && c.load();
195
- const E = c.play();
196
- k.current = E, await E, f(!0);
255
+ p.readyState < 2 && p.load();
256
+ const x = p.play();
257
+ k.current = x, await x, g(!0);
197
258
  } catch {
198
- f(!1);
259
+ g(!1);
199
260
  } finally {
200
261
  k.current = null;
201
262
  }
202
- }, []), J = C(() => {
203
- i && L();
204
- }, [i, L]), O = C(() => {
205
- i && b().then(() => f(!1));
206
- }, [i, b]), W = C(async () => {
207
- const c = w.current;
208
- c && (c.paused ? await L() : (await b(), f(!1)));
209
- }, [L, b]);
263
+ }, []), J = b(() => {
264
+ !l || v || P();
265
+ }, [l, v, P]), O = b(() => {
266
+ !l || v || S().then(() => g(!1));
267
+ }, [l, v, S]), W = b(async () => {
268
+ const p = w.current;
269
+ p && (p.paused ? await P() : (await S(), g(!1)));
270
+ }, [P, S]);
210
271
  return (
211
272
  // The mouse handlers are a progressive enhancement (hoverPlay + tooltip).
212
273
  // Keyboard/click users reach the same actions via the inner <button> elements,
213
274
  // so the outer container is intentionally non-interactive at the role level.
214
275
  // NOSONAR: typescript:S6848
215
- /* @__PURE__ */ v(
276
+ /* @__PURE__ */ m(
216
277
  "div",
217
278
  {
218
- className: I("gvp-root", a),
219
- style: { width: $, aspectRatio: U },
279
+ className: Z("gvp-root", a),
280
+ style: { width: Y, aspectRatio: D },
220
281
  onMouseEnter: () => {
221
- y(!0), J();
282
+ L(!0), J();
222
283
  },
223
284
  onMouseLeave: () => {
224
- y(!1), O();
285
+ L(!1), O();
225
286
  },
226
287
  children: [
227
- /* @__PURE__ */ r(
228
- Z,
288
+ v ? /* @__PURE__ */ r(
289
+ "iframe",
290
+ {
291
+ className: "gvp-video gvp-youtube",
292
+ src: A ?? void 0,
293
+ title: "YouTube video player",
294
+ allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",
295
+ allowFullScreen: !0,
296
+ referrerPolicy: "strict-origin-when-cross-origin"
297
+ }
298
+ ) : /* @__PURE__ */ r(
299
+ B,
229
300
  {
230
301
  ref: w,
231
302
  src: e,
232
303
  poster: o,
233
- muted: H,
234
- loop: g,
304
+ muted: c,
305
+ loop: y,
235
306
  playsInline: !0,
236
307
  preload: "metadata",
237
- controls: n,
238
- hlsConfig: P,
308
+ controls: C,
309
+ autoPlay: s,
310
+ hlsConfig: R,
239
311
  className: "gvp-video",
240
- onPlay: () => f(!0),
241
- onPause: () => f(!1),
242
- children: D
312
+ onPlay: () => g(!0),
313
+ onPause: () => g(!1),
314
+ children: T
243
315
  }
244
316
  ),
245
- /* @__PURE__ */ r("div", { className: "gvp-vignette" }),
246
- l && /* @__PURE__ */ r("div", { className: "gvp-toggle", children: /* @__PURE__ */ v("div", { className: "gvp-toggle-pill", children: [
317
+ !v && /* @__PURE__ */ r("div", { className: "gvp-vignette" }),
318
+ n && /* @__PURE__ */ r("div", { className: "gvp-toggle", children: /* @__PURE__ */ m("div", { className: "gvp-toggle-pill", children: [
247
319
  /* @__PURE__ */ r(
248
320
  "button",
249
321
  {
250
322
  type: "button",
251
323
  onClick: () => j("desktop"),
252
- className: I(
324
+ className: Z(
253
325
  "gvp-toggle-btn",
254
- u === "desktop" && "is-active"
326
+ h === "desktop" && "is-active"
255
327
  ),
256
328
  "aria-label": "Desktop view",
257
- "aria-pressed": u === "desktop",
258
- children: /* @__PURE__ */ r(z, {})
329
+ "aria-pressed": h === "desktop",
330
+ children: /* @__PURE__ */ r(K, {})
259
331
  }
260
332
  ),
261
333
  /* @__PURE__ */ r("div", { className: "gvp-toggle-divider" }),
@@ -264,48 +336,51 @@ const V = "gvp-icon", N = (e) => e ? `${V} ${e}` : V, z = ({ className: e }) =>
264
336
  {
265
337
  type: "button",
266
338
  onClick: () => j("mobile"),
267
- className: I(
339
+ className: Z(
268
340
  "gvp-toggle-btn",
269
- u === "mobile" && "is-active"
341
+ h === "mobile" && "is-active"
270
342
  ),
271
343
  "aria-label": "Mobile view",
272
- "aria-pressed": u === "mobile",
273
- children: /* @__PURE__ */ r(G, {})
344
+ "aria-pressed": h === "mobile",
345
+ children: /* @__PURE__ */ r(Q, {})
274
346
  }
275
347
  )
276
348
  ] }) }),
277
- p && /* @__PURE__ */ r(
349
+ d && /* @__PURE__ */ r(
278
350
  "button",
279
351
  {
280
352
  type: "button",
281
- onClick: p,
353
+ onClick: d,
282
354
  className: "gvp-close",
283
355
  "aria-label": "Close",
284
- children: /* @__PURE__ */ r(K, {})
356
+ children: /* @__PURE__ */ r(F, {})
285
357
  }
286
358
  ),
287
- !R && /* @__PURE__ */ r("div", { className: "gvp-play-wrap", children: /* @__PURE__ */ v(
359
+ !v && !V && /* @__PURE__ */ r("div", { className: "gvp-play-wrap", children: /* @__PURE__ */ m(
288
360
  "button",
289
361
  {
290
362
  type: "button",
291
363
  onClick: () => void W(),
292
- onMouseEnter: () => y(!0),
293
- onMouseLeave: () => y(!1),
364
+ onMouseEnter: () => L(!0),
365
+ onMouseLeave: () => L(!1),
294
366
  className: "gvp-play",
295
367
  "aria-label": "Play",
296
368
  children: [
297
- /* @__PURE__ */ r(Q, {}),
298
- h && T && /* @__PURE__ */ r("span", { className: "gvp-tooltip", role: "tooltip", children: h })
369
+ /* @__PURE__ */ r(ee, {}),
370
+ f && z && /* @__PURE__ */ r("span", { className: "gvp-tooltip", role: "tooltip", children: f })
299
371
  ]
300
372
  }
301
373
  ) }),
302
- /* @__PURE__ */ r("div", { className: "gvp-bottom-fade" })
374
+ !v && /* @__PURE__ */ r("div", { className: "gvp-bottom-fade" })
303
375
  ]
304
376
  }
305
377
  )
306
378
  );
307
379
  };
308
380
  export {
309
- e1 as ReactVideoPlayer
381
+ ae as ReactVideoPlayer,
382
+ te as parseYouTubeId,
383
+ re as parseYouTubeStart,
384
+ ne as youTubeEmbedUrl
310
385
  };
311
386
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/HLSPlayer.tsx","../src/utils/icons.tsx","../src/VideoPlayerWrapper.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","\"use client\";\n\nimport Hls from \"hls.js\";\nimport React, { useEffect, useImperativeHandle, useRef } from \"react\";\nimport type { HLSPlayerProps } from \"./types\";\n\nexport const HLSPlayer = React.forwardRef<HTMLVideoElement, HLSPlayerProps>(\n ({ src, hlsConfig, isHls, children, ...videoProps }, forwardedRef) => {\n const internalRef = useRef<HTMLVideoElement | null>(null);\n const hlsRef = useRef<Hls | null>(null);\n\n useImperativeHandle(forwardedRef, () => internalRef.current as HTMLVideoElement);\n\n const canUseHlsJs = globalThis.window !== undefined && Hls.isSupported();\n const shouldUseHls =\n Boolean(isHls) || (canUseHlsJs && typeof src === \"string\" && src.endsWith(\".m3u8\"));\n\n useEffect(() => {\n if (!src) return;\n const videoEl = internalRef.current;\n if (!videoEl) return;\n\n // destroy previous\n if (hlsRef.current) {\n hlsRef.current.destroy();\n hlsRef.current = null;\n }\n\n // reset video element\n videoEl.pause();\n videoEl.removeAttribute(\"src\");\n while (videoEl.firstChild) videoEl.firstChild.remove();\n\n if (shouldUseHls) {\n const hls = new Hls(hlsConfig);\n hlsRef.current = hls;\n\n hls.attachMedia(videoEl);\n hls.loadSource(src);\n\n hls.on(Hls.Events.ERROR, (_evt, data) => {\n if (data.fatal) {\n hls.destroy();\n hlsRef.current = null;\n }\n });\n } else {\n // native playback\n videoEl.src = src;\n videoEl.load();\n }\n\n return () => {\n if (hlsRef.current) {\n hlsRef.current.destroy();\n hlsRef.current = null;\n }\n videoEl.pause();\n videoEl.removeAttribute(\"src\");\n while (videoEl.firstChild) videoEl.firstChild.remove();\n videoEl.load();\n };\n }, [src, shouldUseHls, hlsConfig]);\n\n // Captions are the consumer's responsibility — pass <track> elements as children.\n // NOSONAR: typescript:S4084\n return (\n <video ref={internalRef} {...videoProps}>\n {children}\n </video>\n );\n }\n);\n\nHLSPlayer.displayName = \"HLSPlayer\";\nexport default HLSPlayer;\n","\"use client\";\n\nimport React from \"react\";\n\ntype IconProps = { className?: string };\n\nconst baseClass = \"gvp-icon\";\nconst cls = (extra?: string) => (extra ? `${baseClass} ${extra}` : baseClass);\n\nexport const IconDesktop: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n <path\n d=\"M11 15H13\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n <path d=\"M7 22H17\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n);\n\nexport const IconMobile: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n <path\n d=\"M11 19H13\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinejoin=\"round\"\n />\n </svg>\n);\n\nexport const IconX: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport const IconPlay: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"22\"\n height=\"22\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n fill=\"currentColor\"\n />\n </svg>\n);\n","\"use client\";\n\nimport clsx from \"clsx\";\nimport React, { useCallback, useMemo, useRef, useState } from \"react\";\nimport { HLSPlayer } from \"./HLSPlayer\";\nimport type { DeviceMode, VideoPlayerWrapperProps } from \"./types\";\nimport { IconDesktop, IconMobile, IconPlay, IconX } from \"./utils/icons\";\n\nexport const VideoPlayerWrapper: React.FC<VideoPlayerWrapperProps> = ({\n src,\n poster,\n showDeviceToggle = true,\n defaultDevice = \"desktop\",\n hoverPlay = false,\n tooltipText,\n onClose,\n className = \"\",\n muted = true,\n loop = false,\n controls = false,\n frameMaxWidth: customFrameMaxWidth,\n aspectRatio: customAspectRatio,\n hlsConfig,\n children,\n}) => {\n const videoRef = useRef<HTMLVideoElement | null>(null);\n const playPromiseRef = useRef<Promise<void> | null>(null);\n\n const [device, setDevice] = useState<DeviceMode>(defaultDevice);\n const [isPlaying, setIsPlaying] = useState(false);\n const [showTooltip, setShowTooltip] = useState(false);\n\n const aspectRatio = useMemo(() => {\n return device === \"mobile\"\n ? (customAspectRatio?.mobile ?? \"9/16\")\n : (customAspectRatio?.desktop ?? \"16/9\");\n }, [device, customAspectRatio]);\n\n const frameMaxWidth = useMemo(() => {\n return device === \"mobile\"\n ? (customFrameMaxWidth?.mobile ?? \"420px\")\n : (customFrameMaxWidth?.desktop ?? \"960px\");\n }, [device, customFrameMaxWidth]);\n\n const safePause = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n if (playPromiseRef.current) {\n try {\n await playPromiseRef.current;\n } catch {\n /* play was interrupted; nothing to await */\n }\n }\n el.pause();\n }, []);\n\n const safePlay = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n try {\n if (el.readyState < 2) el.load();\n const p = el.play();\n playPromiseRef.current = p;\n await p;\n setIsPlaying(true);\n } catch {\n setIsPlaying(false);\n } finally {\n playPromiseRef.current = null;\n }\n }, []);\n\n const hoverStart = useCallback(() => {\n if (!hoverPlay) return;\n void safePlay();\n }, [hoverPlay, safePlay]);\n\n const hoverStop = useCallback(() => {\n if (!hoverPlay) return;\n void safePause().then(() => setIsPlaying(false));\n }, [hoverPlay, safePause]);\n\n const togglePlay = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n if (el.paused) {\n await safePlay();\n } else {\n await safePause();\n setIsPlaying(false);\n }\n }, [safePlay, safePause]);\n\n return (\n // The mouse handlers are a progressive enhancement (hoverPlay + tooltip).\n // Keyboard/click users reach the same actions via the inner <button> elements,\n // so the outer container is intentionally non-interactive at the role level.\n // NOSONAR: typescript:S6848\n <div\n className={clsx(\"gvp-root\", className)}\n style={{ width: frameMaxWidth, aspectRatio }}\n onMouseEnter={() => {\n setShowTooltip(true);\n hoverStart();\n }}\n onMouseLeave={() => {\n setShowTooltip(false);\n hoverStop();\n }}\n >\n <HLSPlayer\n ref={videoRef}\n src={src}\n poster={poster}\n muted={muted}\n loop={loop}\n playsInline\n preload=\"metadata\"\n controls={controls}\n hlsConfig={hlsConfig}\n className=\"gvp-video\"\n onPlay={() => setIsPlaying(true)}\n onPause={() => setIsPlaying(false)}\n >\n {children}\n </HLSPlayer>\n\n <div className=\"gvp-vignette\" />\n\n {showDeviceToggle && (\n <div className=\"gvp-toggle\">\n <div className=\"gvp-toggle-pill\">\n <button\n type=\"button\"\n onClick={() => setDevice(\"desktop\")}\n className={clsx(\n \"gvp-toggle-btn\",\n device === \"desktop\" && \"is-active\"\n )}\n aria-label=\"Desktop view\"\n aria-pressed={device === \"desktop\"}\n >\n <IconDesktop />\n </button>\n\n <div className=\"gvp-toggle-divider\" />\n\n <button\n type=\"button\"\n onClick={() => setDevice(\"mobile\")}\n className={clsx(\n \"gvp-toggle-btn\",\n device === \"mobile\" && \"is-active\"\n )}\n aria-label=\"Mobile view\"\n aria-pressed={device === \"mobile\"}\n >\n <IconMobile />\n </button>\n </div>\n </div>\n )}\n\n {onClose && (\n <button\n type=\"button\"\n onClick={onClose}\n className=\"gvp-close\"\n aria-label=\"Close\"\n >\n <IconX />\n </button>\n )}\n\n {!isPlaying && (\n <div className=\"gvp-play-wrap\">\n <button\n type=\"button\"\n onClick={() => void togglePlay()}\n onMouseEnter={() => setShowTooltip(true)}\n onMouseLeave={() => setShowTooltip(false)}\n className=\"gvp-play\"\n aria-label=\"Play\"\n >\n <IconPlay />\n {tooltipText && showTooltip && (\n <span className=\"gvp-tooltip\" role=\"tooltip\">\n {tooltipText}\n </span>\n )}\n </button>\n </div>\n )}\n\n <div className=\"gvp-bottom-fade\" />\n </div>\n );\n};\n\nexport default VideoPlayerWrapper;\n"],"names":["r","t","f","n","o","clsx","HLSPlayer","React","src","hlsConfig","isHls","children","videoProps","forwardedRef","internalRef","useRef","hlsRef","useImperativeHandle","canUseHlsJs","Hls","shouldUseHls","useEffect","videoEl","hls","_evt","data","baseClass","cls","extra","IconDesktop","className","jsxs","jsx","IconMobile","IconX","IconPlay","VideoPlayerWrapper","poster","showDeviceToggle","defaultDevice","hoverPlay","tooltipText","onClose","muted","loop","controls","customFrameMaxWidth","customAspectRatio","videoRef","playPromiseRef","device","setDevice","useState","isPlaying","setIsPlaying","showTooltip","setShowTooltip","aspectRatio","useMemo","frameMaxWidth","safePause","useCallback","el","safePlay","p","hoverStart","hoverStop","togglePlay"],"mappings":"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","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"index.mjs","sources":["../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/HLSPlayer.tsx","../src/utils/icons.tsx","../src/utils/youtube.ts","../src/VideoPlayerWrapper.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","\"use client\";\n\nimport Hls from \"hls.js\";\nimport React, { useEffect, useImperativeHandle, useRef } from \"react\";\nimport type { HLSPlayerProps } from \"./types\";\n\nexport const HLSPlayer = React.forwardRef<HTMLVideoElement, HLSPlayerProps>(\n ({ src, hlsConfig, isHls, autoPlay, children, ...videoProps }, forwardedRef) => {\n const internalRef = useRef<HTMLVideoElement | null>(null);\n const hlsRef = useRef<Hls | null>(null);\n\n useImperativeHandle(forwardedRef, () => internalRef.current as HTMLVideoElement);\n\n const canUseHlsJs = globalThis.window !== undefined && Hls.isSupported();\n const shouldUseHls =\n Boolean(isHls) || (canUseHlsJs && typeof src === \"string\" && src.endsWith(\".m3u8\"));\n\n useEffect(() => {\n if (!src) return;\n const videoEl = internalRef.current;\n if (!videoEl) return;\n\n // Tries to start playback once the stream is ready. Browsers only\n // honor sound-on autoplay after a user gesture, so this is best\n // effort — silently swallows the NotAllowedError when blocked.\n const tryAutoPlay = () => {\n if (!autoPlay) return;\n videoEl.play().catch(() => {\n /* autoplay blocked; user gesture required */\n });\n };\n\n // destroy previous\n if (hlsRef.current) {\n hlsRef.current.destroy();\n hlsRef.current = null;\n }\n\n // reset video element\n videoEl.pause();\n videoEl.removeAttribute(\"src\");\n while (videoEl.firstChild) videoEl.firstChild.remove();\n\n if (shouldUseHls) {\n const hls = new Hls(hlsConfig);\n hlsRef.current = hls;\n\n hls.attachMedia(videoEl);\n hls.loadSource(src);\n\n hls.on(Hls.Events.MANIFEST_PARSED, tryAutoPlay);\n hls.on(Hls.Events.ERROR, (_evt, data) => {\n if (data.fatal) {\n hls.destroy();\n hlsRef.current = null;\n }\n });\n } else {\n // native playback\n videoEl.src = src;\n videoEl.load();\n // For a plain <video>, we wait for metadata so play() has\n // something to start.\n videoEl.addEventListener(\"loadedmetadata\", tryAutoPlay, { once: true });\n }\n\n return () => {\n videoEl.removeEventListener(\"loadedmetadata\", tryAutoPlay);\n if (hlsRef.current) {\n hlsRef.current.destroy();\n hlsRef.current = null;\n }\n videoEl.pause();\n videoEl.removeAttribute(\"src\");\n while (videoEl.firstChild) videoEl.firstChild.remove();\n videoEl.load();\n };\n }, [src, shouldUseHls, hlsConfig, autoPlay]);\n\n // Captions are the consumer's responsibility — pass <track> elements as children.\n // NOSONAR: typescript:S4084\n return (\n <video ref={internalRef} {...videoProps}>\n {children}\n </video>\n );\n }\n);\n\nHLSPlayer.displayName = \"HLSPlayer\";\nexport default HLSPlayer;\n","\"use client\";\n\nimport React from \"react\";\n\ntype IconProps = { className?: string };\n\nconst baseClass = \"gvp-icon\";\nconst cls = (extra?: string) => (extra ? `${baseClass} ${extra}` : baseClass);\n\nexport const IconDesktop: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n <path\n d=\"M11 15H13\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n <path d=\"M7 22H17\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n);\n\nexport const IconMobile: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n <path\n d=\"M11 19H13\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n 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\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinejoin=\"round\"\n />\n </svg>\n);\n\nexport const IconX: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport const IconPlay: React.FC<IconProps> = ({ className }) => (\n <svg\n className={cls(className)}\n width=\"22\"\n height=\"22\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n 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\"\n fill=\"currentColor\"\n />\n </svg>\n);\n","/**\n * Extract a YouTube video ID from any common URL form, or `null` if the URL\n * isn't a YouTube link.\n *\n * Recognised:\n * - https://www.youtube.com/watch?v=ID\n * - https://youtube.com/watch?v=ID&t=42\n * - https://youtu.be/ID\n * - https://youtu.be/ID?t=42\n * - https://www.youtube.com/embed/ID\n * - https://www.youtube.com/shorts/ID\n * - https://music.youtube.com/watch?v=ID\n * - bare 11-character video IDs\n */\nexport function parseYouTubeId(input: string): string | null {\n if (!input) return null;\n\n // Bare 11-char ID (YouTube IDs are [A-Za-z0-9_-]{11}).\n if (/^[A-Za-z0-9_-]{11}$/.test(input)) return input;\n\n let url: URL;\n try {\n url = new URL(input);\n } catch {\n return null;\n }\n\n const host = url.hostname.replace(/^www\\./, \"\");\n\n if (host === \"youtu.be\") {\n const id = url.pathname.slice(1).split(\"/\")[0];\n return /^[A-Za-z0-9_-]{11}$/.test(id) ? id : null;\n }\n\n if (\n host === \"youtube.com\" ||\n host === \"m.youtube.com\" ||\n host === \"music.youtube.com\" ||\n host === \"youtube-nocookie.com\"\n ) {\n // /watch?v=ID\n const v = url.searchParams.get(\"v\");\n if (v && /^[A-Za-z0-9_-]{11}$/.test(v)) return v;\n\n // /embed/ID, /shorts/ID, /v/ID, /live/ID\n const m = /^\\/(?:embed|shorts|v|live)\\/([A-Za-z0-9_-]{11})/.exec(\n url.pathname\n );\n if (m) return m[1];\n }\n\n return null;\n}\n\n/** Extract a `t`/`start` timestamp (in seconds) from a YouTube URL, if present. */\nexport function parseYouTubeStart(input: string): number | null {\n try {\n const url = new URL(input);\n const t = url.searchParams.get(\"t\") ?? url.searchParams.get(\"start\");\n if (!t) return null;\n // Supports \"90\", \"90s\", \"1m30s\", \"1h2m3s\".\n if (/^\\d+s?$/.test(t)) return Number.parseInt(t, 10);\n const m = /^(?:(\\d+)h)?(?:(\\d+)m)?(?:(\\d+)s)?$/.exec(t);\n if (m) {\n const h = Number.parseInt(m[1] ?? \"0\", 10);\n const min = Number.parseInt(m[2] ?? \"0\", 10);\n const s = Number.parseInt(m[3] ?? \"0\", 10);\n const total = h * 3600 + min * 60 + s;\n return total > 0 ? total : null;\n }\n } catch {\n /* not a URL */\n }\n return null;\n}\n\nexport interface YouTubeEmbedOptions {\n /** Start playback immediately. Forces `mute` on, since browsers block sound-on autoplay. */\n autoPlay?: boolean;\n /** Mute the player. */\n muted?: boolean;\n /** Loop the video. */\n loop?: boolean;\n /** Show YouTube's player controls. Defaults to `true`. */\n controls?: boolean;\n /** Start offset in seconds. */\n startSeconds?: number | null;\n}\n\n/**\n * Build a privacy-enhanced YouTube embed URL from a video ID and player options.\n *\n * Notes on YouTube's quirks:\n * - `autoplay=1` only takes effect if `mute=1` is also set (browser policy).\n * - single-video loop requires `loop=1` **and** `playlist=<id>`.\n */\nexport function youTubeEmbedUrl(id: string, opts: YouTubeEmbedOptions = {}): string {\n const { autoPlay = false, muted = true, loop = false, controls = true, startSeconds } = opts;\n\n const params = new URLSearchParams({\n rel: \"0\",\n modestbranding: \"1\",\n playsinline: \"1\",\n controls: controls ? \"1\" : \"0\",\n });\n\n if (autoPlay) {\n params.set(\"autoplay\", \"1\");\n params.set(\"mute\", \"1\"); // required for autoplay to actually fire\n } else if (muted) {\n params.set(\"mute\", \"1\");\n }\n\n if (loop) {\n params.set(\"loop\", \"1\");\n params.set(\"playlist\", id); // YouTube needs this for single-video loop\n }\n\n if (startSeconds && startSeconds > 0) {\n params.set(\"start\", String(startSeconds));\n }\n\n return `https://www.youtube-nocookie.com/embed/${id}?${params.toString()}`;\n}\n","\"use client\";\n\nimport clsx from \"clsx\";\nimport React, { useCallback, useMemo, useRef, useState } from \"react\";\nimport { HLSPlayer } from \"./HLSPlayer\";\nimport type { DeviceMode, VideoPlayerWrapperProps } from \"./types\";\nimport { IconDesktop, IconMobile, IconPlay, IconX } from \"./utils/icons\";\nimport { parseYouTubeId, parseYouTubeStart, youTubeEmbedUrl } from \"./utils/youtube\";\n\nexport const VideoPlayerWrapper: React.FC<VideoPlayerWrapperProps> = ({\n src,\n poster,\n showDeviceToggle = true,\n defaultDevice = \"desktop\",\n hoverPlay = false,\n tooltipText,\n onClose,\n className = \"\",\n muted = true,\n loop = false,\n controls = false,\n autoPlay = false,\n frameMaxWidth: customFrameMaxWidth,\n aspectRatio: customAspectRatio,\n hlsConfig,\n children,\n}) => {\n const videoRef = useRef<HTMLVideoElement | null>(null);\n const playPromiseRef = useRef<Promise<void> | null>(null);\n\n const [device, setDevice] = useState<DeviceMode>(defaultDevice);\n const [isPlaying, setIsPlaying] = useState(false);\n const [showTooltip, setShowTooltip] = useState(false);\n\n const youTubeId = useMemo(() => parseYouTubeId(src), [src]);\n const isYouTube = youTubeId !== null;\n\n const aspectRatio = useMemo(() => {\n return device === \"mobile\"\n ? (customAspectRatio?.mobile ?? \"9/16\")\n : (customAspectRatio?.desktop ?? \"16/9\");\n }, [device, customAspectRatio]);\n\n const frameMaxWidth = useMemo(() => {\n return device === \"mobile\"\n ? (customFrameMaxWidth?.mobile ?? \"420px\")\n : (customFrameMaxWidth?.desktop ?? \"960px\");\n }, [device, customFrameMaxWidth]);\n\n const youTubeSrc = useMemo(\n () =>\n youTubeId\n ? youTubeEmbedUrl(youTubeId, {\n autoPlay,\n muted,\n loop,\n controls,\n startSeconds: parseYouTubeStart(src),\n })\n : null,\n [youTubeId, src, autoPlay, muted, loop, controls]\n );\n\n const safePause = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n if (playPromiseRef.current) {\n try {\n await playPromiseRef.current;\n } catch {\n /* play was interrupted; nothing to await */\n }\n }\n el.pause();\n }, []);\n\n const safePlay = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n try {\n if (el.readyState < 2) el.load();\n const p = el.play();\n playPromiseRef.current = p;\n await p;\n setIsPlaying(true);\n } catch {\n setIsPlaying(false);\n } finally {\n playPromiseRef.current = null;\n }\n }, []);\n\n const hoverStart = useCallback(() => {\n if (!hoverPlay || isYouTube) return;\n void safePlay();\n }, [hoverPlay, isYouTube, safePlay]);\n\n const hoverStop = useCallback(() => {\n if (!hoverPlay || isYouTube) return;\n void safePause().then(() => setIsPlaying(false));\n }, [hoverPlay, isYouTube, safePause]);\n\n const togglePlay = useCallback(async () => {\n const el = videoRef.current;\n if (!el) return;\n if (el.paused) {\n await safePlay();\n } else {\n await safePause();\n setIsPlaying(false);\n }\n }, [safePlay, safePause]);\n\n return (\n // The mouse handlers are a progressive enhancement (hoverPlay + tooltip).\n // Keyboard/click users reach the same actions via the inner <button> elements,\n // so the outer container is intentionally non-interactive at the role level.\n // NOSONAR: typescript:S6848\n <div\n className={clsx(\"gvp-root\", className)}\n style={{ width: frameMaxWidth, aspectRatio }}\n onMouseEnter={() => {\n setShowTooltip(true);\n hoverStart();\n }}\n onMouseLeave={() => {\n setShowTooltip(false);\n hoverStop();\n }}\n >\n {isYouTube ? (\n <iframe\n className=\"gvp-video gvp-youtube\"\n src={youTubeSrc ?? undefined}\n title=\"YouTube video player\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\"\n allowFullScreen\n referrerPolicy=\"strict-origin-when-cross-origin\"\n />\n ) : (\n <HLSPlayer\n ref={videoRef}\n src={src}\n poster={poster}\n muted={muted}\n loop={loop}\n playsInline\n preload=\"metadata\"\n controls={controls}\n autoPlay={autoPlay}\n hlsConfig={hlsConfig}\n className=\"gvp-video\"\n onPlay={() => setIsPlaying(true)}\n onPause={() => setIsPlaying(false)}\n >\n {children}\n </HLSPlayer>\n )}\n\n {!isYouTube && <div className=\"gvp-vignette\" />}\n\n {showDeviceToggle && (\n <div className=\"gvp-toggle\">\n <div className=\"gvp-toggle-pill\">\n <button\n type=\"button\"\n onClick={() => setDevice(\"desktop\")}\n className={clsx(\n \"gvp-toggle-btn\",\n device === \"desktop\" && \"is-active\"\n )}\n aria-label=\"Desktop view\"\n aria-pressed={device === \"desktop\"}\n >\n <IconDesktop />\n </button>\n\n <div className=\"gvp-toggle-divider\" />\n\n <button\n type=\"button\"\n onClick={() => setDevice(\"mobile\")}\n className={clsx(\n \"gvp-toggle-btn\",\n device === \"mobile\" && \"is-active\"\n )}\n aria-label=\"Mobile view\"\n aria-pressed={device === \"mobile\"}\n >\n <IconMobile />\n </button>\n </div>\n </div>\n )}\n\n {onClose && (\n <button\n type=\"button\"\n onClick={onClose}\n className=\"gvp-close\"\n aria-label=\"Close\"\n >\n <IconX />\n </button>\n )}\n\n {!isYouTube && !isPlaying && (\n <div className=\"gvp-play-wrap\">\n <button\n type=\"button\"\n onClick={() => void togglePlay()}\n onMouseEnter={() => setShowTooltip(true)}\n onMouseLeave={() => setShowTooltip(false)}\n className=\"gvp-play\"\n aria-label=\"Play\"\n >\n <IconPlay />\n {tooltipText && showTooltip && (\n <span className=\"gvp-tooltip\" role=\"tooltip\">\n {tooltipText}\n </span>\n )}\n </button>\n </div>\n )}\n\n {!isYouTube && <div className=\"gvp-bottom-fade\" />}\n </div>\n );\n};\n\nexport default VideoPlayerWrapper;\n"],"names":["r","t","f","n","o","clsx","HLSPlayer","React","src","hlsConfig","isHls","autoPlay","children","videoProps","forwardedRef","internalRef","useRef","hlsRef","useImperativeHandle","canUseHlsJs","Hls","shouldUseHls","useEffect","videoEl","tryAutoPlay","hls","_evt","data","baseClass","cls","extra","IconDesktop","className","jsxs","jsx","IconMobile","IconX","IconPlay","parseYouTubeId","input","url","host","id","v","m","parseYouTubeStart","h","min","s","total","youTubeEmbedUrl","opts","muted","loop","controls","startSeconds","params","VideoPlayerWrapper","poster","showDeviceToggle","defaultDevice","hoverPlay","tooltipText","onClose","customFrameMaxWidth","customAspectRatio","videoRef","playPromiseRef","device","setDevice","useState","isPlaying","setIsPlaying","showTooltip","setShowTooltip","youTubeId","useMemo","isYouTube","aspectRatio","frameMaxWidth","youTubeSrc","safePause","useCallback","el","safePlay","p","hoverStart","hoverStop","togglePlay"],"mappings":"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","x_google_ignoreList":[0]}
package/dist/style.css CHANGED
@@ -1,4 +1,4 @@
1
1
  /*!
2
2
  * @glitchlab/react-video-player styles
3
3
  * Scoped under .gvp-root — no global resets, no theme tokens, safe for any host.
4
- */.gvp-root{position:relative;overflow:hidden;border-radius:1.5rem;background-color:#1717174d;box-shadow:0 25px 50px -12px #00000040;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}.gvp-root *,.gvp-root *:before,.gvp-root *:after{box-sizing:border-box}.gvp-video{height:100%;width:100%;object-fit:cover;display:block}.gvp-vignette{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to top right,#00000059,#0000,#00000059)}.gvp-bottom-fade{pointer-events:none;position:absolute;bottom:0;left:0;right:0;height:4rem;background-image:linear-gradient(to top,rgb(0 0 0 / .35),transparent)}.gvp-toggle{position:absolute;left:1rem;top:1rem}.gvp-toggle-pill{display:flex;align-items:center;overflow:hidden;border-radius:1rem;background-color:#fffffff2;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(0 0 0 / .05);outline-offset:-1px}.gvp-toggle-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;cursor:pointer;background:transparent;border:0;color:#737373;transition:color .15s ease;font-family:inherit}.gvp-toggle-btn:hover{color:#404040}.gvp-toggle-btn.is-active{color:#5b21b6}.gvp-toggle-divider{height:1.75rem;width:1px;background-color:#e5e5e5}.gvp-close{position:absolute;right:1rem;top:1rem;display:grid;place-items:center;height:2.5rem;width:2.5rem;border:0;border-radius:9999px;background-color:#00000059;color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;cursor:pointer;z-index:10;transition:background-color .15s ease}.gvp-close:hover{background-color:#00000080}.gvp-play-wrap{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.gvp-play{position:relative;display:grid;place-items:center;height:3.5rem;width:3.5rem;border:0;border-radius:9999px;cursor:pointer;outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;background-color:#5b21b680;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;transition:background-color .2s ease,opacity .2s ease;color:#fff}.gvp-play:hover{background-color:#5b21b6e6}.gvp-tooltip{position:absolute;top:-3rem;left:50%;transform:translate(-50%);white-space:nowrap;border-radius:.75rem;background-color:#000000b3;padding:.375rem .75rem;font-size:.75rem;line-height:1rem;color:#fff;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.gvp-icon{display:block}
4
+ */.gvp-root{position:relative;overflow:hidden;border-radius:1.5rem;background-color:#1717174d;box-shadow:0 25px 50px -12px #00000040;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}.gvp-root *,.gvp-root *:before,.gvp-root *:after{box-sizing:border-box}.gvp-video{height:100%;width:100%;object-fit:cover;display:block}.gvp-youtube{border:0;object-fit:contain}.gvp-vignette{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to top right,#00000059,#0000,#00000059)}.gvp-bottom-fade{pointer-events:none;position:absolute;bottom:0;left:0;right:0;height:4rem;background-image:linear-gradient(to top,rgb(0 0 0 / .35),transparent)}.gvp-toggle{position:absolute;left:1rem;top:1rem}.gvp-toggle-pill{display:flex;align-items:center;overflow:hidden;border-radius:1rem;background-color:#fffffff2;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(0 0 0 / .05);outline-offset:-1px}.gvp-toggle-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;cursor:pointer;background:transparent;border:0;color:#737373;transition:color .15s ease;font-family:inherit}.gvp-toggle-btn:hover{color:#404040}.gvp-toggle-btn.is-active{color:#5b21b6}.gvp-toggle-divider{height:1.75rem;width:1px;background-color:#e5e5e5}.gvp-close{position:absolute;right:1rem;top:1rem;display:grid;place-items:center;height:2.5rem;width:2.5rem;border:0;border-radius:9999px;background-color:#00000059;color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;cursor:pointer;z-index:10;transition:background-color .15s ease}.gvp-close:hover{background-color:#00000080}.gvp-play-wrap{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.gvp-play{position:relative;display:grid;place-items:center;height:3.5rem;width:3.5rem;border:0;border-radius:9999px;cursor:pointer;outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;background-color:#5b21b680;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;transition:background-color .2s ease,opacity .2s ease;color:#fff}.gvp-play:hover{background-color:#5b21b6e6}.gvp-tooltip{position:absolute;top:-3rem;left:50%;transform:translate(-50%);white-space:nowrap;border-radius:.75rem;background-color:#000000b3;padding:.375rem .75rem;font-size:.75rem;line-height:1rem;color:#fff;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.gvp-icon{display:block}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@glitchlab/react-video-player",
3
- "version": "1.0.2",
3
+ "version": "1.1.1",
4
4
  "description": "React video player with HLS support (hls.js), device-mode toggle, hover-to-play, and zero global CSS side-effects. Works with Next.js App Router and TypeScript.",
5
5
  "license": "MIT",
6
6
  "author": "im-fahad",