@obipascal/player 1.0.7 → 1.0.8

package/README.md

@@ -1134,6 +1134,92 @@ pipButton.addEventListener("click", async () => {
 
 **Note:** Picture-in-Picture is supported in most modern browsers. The player includes a built-in PiP button in the controls.
 
+### File Information Utility
+
+The SDK includes a `WontumFileInfo` utility class to extract metadata from video files before uploading or processing them.
+
+```typescript
+import { WontumFileInfo } from "@obipascal/player"
+
+// Example: File input handling
+const fileInput = document.querySelector<HTMLInputElement>("#video-upload")
+
+fileInput.addEventListener("change", async (event) => {
+	const file = event.target.files?.[0]
+	if (!file) return
+
+	try {
+		// Create instance (validates it's a video file)
+		const videoInfo = new WontumFileInfo(file)
+
+		// Extract metadata
+		await videoInfo.extract()
+
+		// Access properties
+		console.log("Video Information:")
+		console.log("- Width:", videoInfo.width) // e.g., 1920
+		console.log("- Height:", videoInfo.height) // e.g., 1080
+		console.log("- Aspect Ratio:", videoInfo.aspectRatio) // e.g., "16:9"
+		console.log("- Quality:", videoInfo.quality) // e.g., "Full HD (1080p)"
+		console.log("- Duration (raw):", videoInfo.durationInSeconds, "seconds") // e.g., 125.5
+		console.log("- Formatted Duration:", videoInfo.durationFormatted) // e.g., "02:05"
+		console.log("- File Size (raw):", videoInfo.sizeInBytes, "bytes") // e.g., 52428800
+		console.log("- Formatted Size:", videoInfo.sizeFormatted) // e.g., "50 MB"
+		console.log("- MIME Type:", videoInfo.mimeType) // e.g., "video/mp4"
+		console.log("- File Name:", videoInfo.fileName) // e.g., "my-video.mp4"
+		console.log("- Extension:", videoInfo.fileExtension) // e.g., ".mp4"
+		console.log("- Bitrate:", videoInfo.bitrate, "kbps") // e.g., 3500
+
+		// Get all info as object
+		const allInfo = videoInfo.getInfo()
+		console.log(allInfo)
+
+		// Clean up when done
+		videoInfo.destroy()
+	} catch (error) {
+		console.error("Error extracting video info:", error.message)
+		// Throws error if file is not a video
+	}
+})
+```
+
+#### WontumFileInfo API
+
+**Constructor:**
+
+```typescript
+new WontumFileInfo(file: File)
+```
+
+Throws an error if the file is not a valid video file.
+
+**Methods:**
+
+- `extract(): Promise<VideoFileInfo>` - Extracts metadata from the video file
+- `getInfo(): VideoFileInfo | null` - Returns the extracted information object
+- `destroy(): void` - Cleans up resources
+
+**Properties (available after calling `extract()`):**
+
+- `width: number` - Video width in pixels
+- `height: number` - Video height in pixels
+- `aspectRatio: string` - Aspect ratio (e.g., "16:9", "4:3", "21:9")
+- `quality: string` - Quality description (e.g., "4K (2160p)", "Full HD (1080p)")
+- `size: number` - File size in bytes (raw value for computation)
+- `sizeInBytes: number` - Alias for size (raw value for computation)
+- `sizeFormatted: string` - Human-readable size (e.g., "50 MB")
+- `duration: number` - Duration in seconds (raw value for computation)
+- `durationInSeconds: number` - Alias for duration (raw value for computation)
+- `durationFormatted: string` - Formatted duration (e.g., "01:23:45")
+- `mimeType: string` - MIME type (e.g., "video/mp4")
+- `fileName: string` - Original file name
+- `fileExtension: string` - File extension (e.g., ".mp4")
+- `bitrate: number | undefined` - Estimated bitrate in kbps
+
+**Supported Video Formats:**
+
+`.mp4`, `.webm`, `.ogg`, `.mov`, `.avi`, `.mkv`, `.flv`, `.wmv`, `.m4v`, `.3gp`, `.ts`, `.m3u8`
+
 ## 📋 Complete API Reference
 
 For detailed API documentation including all methods, events, types, and configuration options, see **[API-REFERENCE.md](./API-REFERENCE.md)**.

package/dist/src/file-info.d.ts

@@ -0,0 +1,78 @@
+/**
+ * Video file information extractor
+ * Extracts metadata from video files (width, height, duration, size, etc.)
+ */
+export interface VideoFileInfo {
+    width: number;
+    height: number;
+    aspectRatio: string;
+    size: number;
+    sizeInBytes: number;
+    sizeFormatted: string;
+    duration: number;
+    durationInSeconds: number;
+    durationFormatted: string;
+    mimeType: string;
+    fileName: string;
+    fileExtension: string;
+    bitrate?: number;
+    frameRate?: number;
+    videoCodec?: string;
+    audioCodec?: string;
+}
+export declare class WontumFileInfo {
+    private file;
+    private videoElement;
+    private info;
+    constructor(file: File);
+    /**
+     * Check if the file is a valid video file
+     */
+    private isVideoFile;
+    /**
+     * Extract video metadata
+     */
+    extract(): Promise<VideoFileInfo>;
+    /**
+     * Calculate aspect ratio (e.g., "16:9", "4:3")
+     */
+    private calculateAspectRatio;
+    /**
+     * Get Greatest Common Divisor
+     */
+    private getGCD;
+    /**
+     * Format bytes to human-readable size
+     */
+    private formatBytes;
+    /**
+     * Format duration to HH:MM:SS
+     */
+    private formatDuration;
+    /**
+     * Get file extension
+     */
+    private getFileExtension;
+    get width(): number;
+    get height(): number;
+    get aspectRatio(): string;
+    get size(): number;
+    get sizeInBytes(): number;
+    get sizeFormatted(): string;
+    get duration(): number;
+    get durationInSeconds(): number;
+    get durationFormatted(): string;
+    get mimeType(): string;
+    get fileName(): string;
+    get fileExtension(): string;
+    get bitrate(): number | undefined;
+    get quality(): string;
+    /**
+     * Get all information as object
+     */
+    getInfo(): VideoFileInfo | null;
+    /**
+     * Clean up resources
+     */
+    destroy(): void;
+}

package/dist/src/index.d.ts

@@ -2,6 +2,8 @@ export { WontumPlayer } from './player';
 export { Analytics } from './analytics';
 export { S3Handler } from './s3-handler';
 export { UIController } from './ui-controller';
+export { WontumFileInfo } from './file-info';
 export { WontumPlayerReact, useWontumPlayer, WontumPlayerProvider, useWontumPlayerContext } from './react';
 export type { WontumPlayerConfig, PlayerTheme, S3Config, AnalyticsConfig, PlayerState, PlayerEvent, PlayerEventType, AnalyticsEvent, QualityLevel } from './types';
+export type { VideoFileInfo } from './file-info';
 export type { WontumPlayerReactProps } from './react';

package/dist/wontum-player.cjs.js

@@ -1,14 +1,14 @@
-"use strict";var j=Object.defineProperty;var W=(l,t,e)=>t in l?j(l,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):l[t]=e;var r=(l,t,e)=>W(l,typeof t!="symbol"?t+"":t,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("hls.js"),M=require("react/jsx-runtime"),h=require("react");function _(l){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const e in l)if(e!=="default"){const n=Object.getOwnPropertyDescriptor(l,e);Object.defineProperty(t,e,n.get?n:{enumerable:!0,get:()=>l[e]})}}return t.default=l,Object.freeze(t)}const R=_(h);class B{constructor(t){r(this,"config");r(this,"sessionId");r(this,"events",[]);r(this,"sessionStartTime");r(this,"playbackStartTime",null);r(this,"totalPlayTime",0);r(this,"totalBufferTime",0);r(this,"bufferStartTime",null);r(this,"rebufferCount",0);r(this,"seekCount",0);var e;this.config=t,this.sessionId=(t==null?void 0:t.sessionId)||this.generateSessionId(),this.sessionStartTime=Date.now(),(e=this.config)!=null&&e.enabled&&this.trackEvent("session_start",this.getSessionData())}trackEvent(t,e={}){var s;if(!((s=this.config)!=null&&s.enabled))return;const n={eventType:t,timestamp:Date.now(),sessionId:this.sessionId,videoId:this.config.videoId,userId:this.config.userId,data:{...e,...this.getQoEMetrics()}};this.events.push(n),this.updateMetrics(t,e),this.config.endpoint&&this.sendEvent(n),process.env.NODE_ENV==="development"&&console.log("[Analytics]",t,n.data)}updateMetrics(t,e){switch(t){case"play":this.playbackStartTime=Date.now();break;case"pause":case"ended":this.playbackStartTime&&(this.totalPlayTime+=Date.now()-this.playbackStartTime,this.playbackStartTime=null);break;case"buffering_start":this.bufferStartTime=Date.now(),this.rebufferCount++;break;case"buffering_end":this.bufferStartTime&&(this.totalBufferTime+=Date.now()-this.bufferStartTime,this.bufferStartTime=null);break;case"seeked":this.seekCount++;break}}getQoEMetrics(){const t=Date.now()-this.sessionStartTime,e=this.totalPlayTime>0?this.totalBufferTime/this.totalPlayTime:0;return{sessionDuration:t,totalPlayTime:this.totalPlayTime,totalBufferTime:this.totalBufferTime,bufferingRatio:Math.round(e*1e3)/1e3,rebufferCount:this.rebufferCount,seekCount:this.seekCount}}getSessionData(){return{userAgent:navigator.userAgent,platform:navigator.platform,language:navigator.language,screenResolution:`${screen.width}x${screen.height}`,viewport:`${window.innerWidth}x${window.innerHeight}`,connection:this.getConnectionInfo()}}getConnectionInfo(){const t=navigator,e=t.connection||t.mozConnection||t.webkitConnection;return e?{effectiveType:e.effectiveType,downlink:e.downlink,rtt:e.rtt,saveData:e.saveData}:null}async sendEvent(t){var e;if((e=this.config)!=null&&e.endpoint)try{await fetch(this.config.endpoint,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(t)})}catch(n){console.error("Failed to send analytics event:",n)}}generateSessionId(){return`session_${Date.now()}_${Math.random().toString(36).substr(2,9)}`}getEvents(){return[...this.events]}getMetrics(){return{sessionId:this.sessionId,...this.getQoEMetrics(),eventCount:this.events.length}}destroy(){var t;(t=this.config)!=null&&t.enabled&&this.trackEvent("session_end",this.getSessionData()),this.events=[]}}class A{constructor(t,e){r(this,"container");r(this,"player");r(this,"controlsContainer");r(this,"progressContainer");r(this,"progressBar");r(this,"playButton");r(this,"skipBackwardButton");r(this,"skipForwardButton");r(this,"volumeButton");r(this,"volumeContainer");r(this,"fullscreenButton");r(this,"pipButton");r(this,"settingsButton");r(this,"volumeSlider");r(this,"progressInput");r(this,"hideControlsTimeout",null);r(this,"stickyControls",!1);r(this,"isVolumeSliderActive",!1);this.container=t,this.player=e,this.injectStyles(),this.createProgressBar(),this.controlsContainer=this.createControls(),this.container.appendChild(this.controlsContainer),this.playButton=this.controlsContainer.querySelector(".wontum-play-btn"),this.skipBackwardButton=this.controlsContainer.querySelector(".wontum-skip-backward-btn"),this.skipForwardButton=this.controlsContainer.querySelector(".wontum-skip-forward-btn"),this.volumeButton=this.controlsContainer.querySelector(".wontum-volume-btn"),this.volumeContainer=this.controlsContainer.querySelector(".wontum-volume-container"),this.fullscreenButton=this.controlsContainer.querySelector(".wontum-fullscreen-btn"),this.pipButton=this.controlsContainer.querySelector(".wontum-pip-btn"),this.settingsButton=this.controlsContainer.querySelector(".wontum-settings-btn"),this.volumeSlider=this.controlsContainer.querySelector(".wontum-volume-slider"),this.progressInput=this.container.querySelector(".wontum-progress-input"),this.progressBar=this.container.querySelector(".wontum-progress-filled"),this.stickyControls=this.player.config.stickyControls||!1,this.stickyControls&&this.controlsContainer.classList.add("sticky"),this.setupEventListeners(),this.setupPlayerEventListeners()}injectStyles(){const t="wontum-player-styles";if(document.getElementById(t))return;const e=this.player.config.theme||{},n=e.primaryColor||"#3b82f6",s=e.accentColor||"#2563eb",i=e.fontFamily||"-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",a=e.controlsBackground||"linear-gradient(to top, rgba(0,0,0,0.8), transparent)",o=e.buttonHoverBg||"rgba(255, 255, 255, 0.1)",c=e.progressHeight||"6px",u=e.borderRadius||"4px",g=document.createElement("style");g.id=t,g.textContent=`
+"use strict";var W=Object.defineProperty;var j=(c,t,e)=>t in c?W(c,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):c[t]=e;var o=(c,t,e)=>j(c,typeof t!="symbol"?t+"":t,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("hls.js"),B=require("react/jsx-runtime"),h=require("react");function N(c){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const e in c)if(e!=="default"){const i=Object.getOwnPropertyDescriptor(c,e);Object.defineProperty(t,e,i.get?i:{enumerable:!0,get:()=>c[e]})}}return t.default=c,Object.freeze(t)}const F=N(h);class ${constructor(t){o(this,"config");o(this,"sessionId");o(this,"events",[]);o(this,"sessionStartTime");o(this,"playbackStartTime",null);o(this,"totalPlayTime",0);o(this,"totalBufferTime",0);o(this,"bufferStartTime",null);o(this,"rebufferCount",0);o(this,"seekCount",0);var e;this.config=t,this.sessionId=(t==null?void 0:t.sessionId)||this.generateSessionId(),this.sessionStartTime=Date.now(),(e=this.config)!=null&&e.enabled&&this.trackEvent("session_start",this.getSessionData())}trackEvent(t,e={}){var n;if(!((n=this.config)!=null&&n.enabled))return;const i={eventType:t,timestamp:Date.now(),sessionId:this.sessionId,videoId:this.config.videoId,userId:this.config.userId,data:{...e,...this.getQoEMetrics()}};this.events.push(i),this.updateMetrics(t,e),this.config.endpoint&&this.sendEvent(i),process.env.NODE_ENV==="development"&&console.log("[Analytics]",t,i.data)}updateMetrics(t,e){switch(t){case"play":this.playbackStartTime=Date.now();break;case"pause":case"ended":this.playbackStartTime&&(this.totalPlayTime+=Date.now()-this.playbackStartTime,this.playbackStartTime=null);break;case"buffering_start":this.bufferStartTime=Date.now(),this.rebufferCount++;break;case"buffering_end":this.bufferStartTime&&(this.totalBufferTime+=Date.now()-this.bufferStartTime,this.bufferStartTime=null);break;case"seeked":this.seekCount++;break}}getQoEMetrics(){const t=Date.now()-this.sessionStartTime,e=this.totalPlayTime>0?this.totalBufferTime/this.totalPlayTime:0;return{sessionDuration:t,totalPlayTime:this.totalPlayTime,totalBufferTime:this.totalBufferTime,bufferingRatio:Math.round(e*1e3)/1e3,rebufferCount:this.rebufferCount,seekCount:this.seekCount}}getSessionData(){return{userAgent:navigator.userAgent,platform:navigator.platform,language:navigator.language,screenResolution:`${screen.width}x${screen.height}`,viewport:`${window.innerWidth}x${window.innerHeight}`,connection:this.getConnectionInfo()}}getConnectionInfo(){const t=navigator,e=t.connection||t.mozConnection||t.webkitConnection;return e?{effectiveType:e.effectiveType,downlink:e.downlink,rtt:e.rtt,saveData:e.saveData}:null}async sendEvent(t){var e;if((e=this.config)!=null&&e.endpoint)try{await fetch(this.config.endpoint,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(t)})}catch(i){console.error("Failed to send analytics event:",i)}}generateSessionId(){return`session_${Date.now()}_${Math.random().toString(36).substr(2,9)}`}getEvents(){return[...this.events]}getMetrics(){return{sessionId:this.sessionId,...this.getQoEMetrics(),eventCount:this.events.length}}destroy(){var t;(t=this.config)!=null&&t.enabled&&this.trackEvent("session_end",this.getSessionData()),this.events=[]}}class A{constructor(t,e){o(this,"container");o(this,"player");o(this,"controlsContainer");o(this,"progressContainer");o(this,"progressBar");o(this,"playButton");o(this,"skipBackwardButton");o(this,"skipForwardButton");o(this,"volumeButton");o(this,"volumeContainer");o(this,"fullscreenButton");o(this,"pipButton");o(this,"settingsButton");o(this,"volumeSlider");o(this,"progressInput");o(this,"hideControlsTimeout",null);o(this,"stickyControls",!1);o(this,"isVolumeSliderActive",!1);this.container=t,this.player=e,this.injectStyles(),this.createProgressBar(),this.controlsContainer=this.createControls(),this.container.appendChild(this.controlsContainer),this.playButton=this.controlsContainer.querySelector(".wontum-play-btn"),this.skipBackwardButton=this.controlsContainer.querySelector(".wontum-skip-backward-btn"),this.skipForwardButton=this.controlsContainer.querySelector(".wontum-skip-forward-btn"),this.volumeButton=this.controlsContainer.querySelector(".wontum-volume-btn"),this.volumeContainer=this.controlsContainer.querySelector(".wontum-volume-container"),this.fullscreenButton=this.controlsContainer.querySelector(".wontum-fullscreen-btn"),this.pipButton=this.controlsContainer.querySelector(".wontum-pip-btn"),this.settingsButton=this.controlsContainer.querySelector(".wontum-settings-btn"),this.volumeSlider=this.controlsContainer.querySelector(".wontum-volume-slider"),this.progressInput=this.container.querySelector(".wontum-progress-input"),this.progressBar=this.container.querySelector(".wontum-progress-filled"),this.stickyControls=this.player.config.stickyControls||!1,this.stickyControls&&this.controlsContainer.classList.add("sticky"),this.setupEventListeners(),this.setupPlayerEventListeners()}injectStyles(){const t="wontum-player-styles";if(document.getElementById(t))return;const e=this.player.config.theme||{},i=e.primaryColor||"#3b82f6",n=e.accentColor||"#2563eb",s=e.fontFamily||"-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",r=e.controlsBackground||"linear-gradient(to top, rgba(0,0,0,0.8), transparent)",a=e.buttonHoverBg||"rgba(255, 255, 255, 0.1)",l=e.progressHeight||"6px",u=e.borderRadius||"4px",p=document.createElement("style");p.id=t,p.textContent=`
       .wontum-player-container {
         position: relative;
         background: #000;
-        font-family: ${i};
+        font-family: ${s};
         overflow: hidden;
-        --primary-color: ${n};
-        --accent-color: ${s};
-        --controls-bg: ${a};
-        --button-hover: ${o};
-        --progress-height: ${c};
+        --primary-color: ${i};
+        --accent-color: ${n};
+        --controls-bg: ${r};
+        --button-hover: ${a};
+        --progress-height: ${l};
         --border-radius: ${u};
       }
       
@@ -486,7 +486,7 @@
         transform: translateY(0) !important;
         pointer-events: all !important;
       }
-    `,document.head.appendChild(g),this.container.classList.add("wontum-player-container")}createProgressBar(){const t=document.createElement("div");t.className="wontum-progress-container",t.innerHTML=`
+    `,document.head.appendChild(p),this.container.classList.add("wontum-player-container")}createProgressBar(){const t=document.createElement("div");t.className="wontum-progress-container",t.innerHTML=`
       <div class="wontum-progress-track"></div>
       <div class="wontum-progress-filled"></div>
       <input type="range" class="wontum-progress-input" min="0" max="100" value="0" step="0.1">
@@ -562,28 +562,28 @@
       <div class="wontum-loading" style="display: none;">
         <div class="wontum-spinner"></div>
       </div>
-    `,t}setupEventListeners(){this.playButton.addEventListener("click",()=>{this.player.getState().playing?this.player.pause():this.player.play()}),this.skipBackwardButton.addEventListener("click",()=>{this.player.skipBackward(10)}),this.skipForwardButton.addEventListener("click",()=>{this.player.skipForward(10)}),this.progressInput.addEventListener("input",n=>{const s=n.target,i=parseFloat(s.value),a=this.player.getState(),o=i/100*a.duration;this.player.seek(o)}),this.volumeSlider.addEventListener("input",n=>{const s=n.target,i=parseFloat(s.value)/100;this.player.setVolume(i)}),this.volumeButton.addEventListener("click",()=>{this.player.getState().muted?this.player.unmute():this.player.mute()}),this.volumeContainer.addEventListener("mouseenter",()=>{this.isVolumeSliderActive=!0}),this.volumeContainer.addEventListener("mouseleave",()=>{this.isVolumeSliderActive=!1}),this.volumeSlider.addEventListener("input",()=>{this.isVolumeSliderActive=!0,this.resetHideControlsTimeout()}),this.volumeSlider.addEventListener("change",()=>{setTimeout(()=>{this.isVolumeSliderActive=!1},500)}),this.fullscreenButton.addEventListener("click",()=>{this.player.getState().fullscreen?this.player.exitFullscreen():this.player.enterFullscreen()}),this.pipButton.addEventListener("click",async()=>{try{await this.player.togglePictureInPicture()}catch(n){console.error("PiP error:",n)}}),this.settingsButton.addEventListener("click",()=>{const n=this.controlsContainer.querySelector(".wontum-settings-panel");n.classList.toggle("active"),n.classList.contains("active")&&(this.updateSettingsMenu(),this.updateQualityMenu(),this.updateSpeedMenu(),this.updateSubtitleMenu())});const t=this.controlsContainer.querySelectorAll(".wontum-tab");t.forEach(n=>{n.addEventListener("click",s=>{const i=s.currentTarget,a=i.getAttribute("data-tab");t.forEach(u=>u.classList.remove("active")),i.classList.add("active"),this.controlsContainer.querySelectorAll(".wontum-tab-panel").forEach(u=>u.classList.remove("active"));const c=this.controlsContainer.querySelector(`[data-panel="${a}"]`);c==null||c.classList.add("active")})}),this.player.getVideoElement().addEventListener("click",()=>{this.player.getState().playing?this.player.pause():this.player.play()}),this.container.addEventListener("mousemove",()=>{this.showControls(),this.resetHideControlsTimeout()}),this.container.addEventListener("mouseleave",()=>{this.hideControls()})}setupPlayerEventListeners(){this.player.on("play",()=>{this.playButton.innerHTML=this.getPauseIcon()}),this.player.on("pause",()=>{this.playButton.innerHTML=this.getPlayIcon()}),this.player.on("timeupdate",t=>{const{currentTime:e}=t.data,n=this.player.getState();if(n.duration>0){const i=e/n.duration*100;this.progressBar.style.width=`${i}%`,this.progressInput.value=i.toString()}const s=this.controlsContainer.querySelector(".wontum-current-time");s.textContent=this.formatTime(e)}),this.player.on("loadedmetadata",t=>{const{duration:e}=t.data,n=this.controlsContainer.querySelector(".wontum-duration");n.textContent=this.formatTime(e),t.data.qualities&&this.updateQualityMenu(t.data.qualities)}),this.player.on("volumechange",t=>{const{volume:e,muted:n}=t.data;this.volumeSlider.value=(e*100).toString(),this.volumeButton.innerHTML=n?this.getMutedIcon():this.getVolumeIcon()}),this.player.on("waiting",()=>{const t=this.controlsContainer.querySelector(".wontum-loading");t.style.display="block"}),this.player.on("canplay",()=>{const t=this.controlsContainer.querySelector(".wontum-loading");t.style.display="none"})}updateSubtitleMenu(){const t=this.controlsContainer.querySelector(".wontum-subtitle-menu"),e=this.player.getSubtitleTracks();if(e.length===0){t.innerHTML='<div class="wontum-subtitle-option">No subtitles available</div>';return}const n=e.findIndex(s=>s.mode==="showing");t.innerHTML=`
-      <div class="wontum-subtitle-option ${n===-1?"active":""}" data-track="-1">Off</div>
-      ${e.map((s,i)=>`
-        <div class="wontum-subtitle-option ${i===n?"active":""}" data-track="${i}">
-          ${s.label||s.language||`Track ${i+1}`}
+    `,t}setupEventListeners(){this.playButton.addEventListener("click",()=>{this.player.getState().playing?this.player.pause():this.player.play()}),this.skipBackwardButton.addEventListener("click",()=>{this.player.skipBackward(10)}),this.skipForwardButton.addEventListener("click",()=>{this.player.skipForward(10)}),this.progressInput.addEventListener("input",i=>{const n=i.target,s=parseFloat(n.value),r=this.player.getState(),a=s/100*r.duration;this.player.seek(a)}),this.volumeSlider.addEventListener("input",i=>{const n=i.target,s=parseFloat(n.value)/100;this.player.setVolume(s)}),this.volumeButton.addEventListener("click",()=>{this.player.getState().muted?this.player.unmute():this.player.mute()}),this.volumeContainer.addEventListener("mouseenter",()=>{this.isVolumeSliderActive=!0}),this.volumeContainer.addEventListener("mouseleave",()=>{this.isVolumeSliderActive=!1}),this.volumeSlider.addEventListener("input",()=>{this.isVolumeSliderActive=!0,this.resetHideControlsTimeout()}),this.volumeSlider.addEventListener("change",()=>{setTimeout(()=>{this.isVolumeSliderActive=!1},500)}),this.fullscreenButton.addEventListener("click",()=>{this.player.getState().fullscreen?this.player.exitFullscreen():this.player.enterFullscreen()}),this.pipButton.addEventListener("click",async()=>{try{await this.player.togglePictureInPicture()}catch(i){console.error("PiP error:",i)}}),this.settingsButton.addEventListener("click",()=>{const i=this.controlsContainer.querySelector(".wontum-settings-panel");i.classList.toggle("active"),i.classList.contains("active")&&(this.updateSettingsMenu(),this.updateQualityMenu(),this.updateSpeedMenu(),this.updateSubtitleMenu())});const t=this.controlsContainer.querySelectorAll(".wontum-tab");t.forEach(i=>{i.addEventListener("click",n=>{const s=n.currentTarget,r=s.getAttribute("data-tab");t.forEach(u=>u.classList.remove("active")),s.classList.add("active"),this.controlsContainer.querySelectorAll(".wontum-tab-panel").forEach(u=>u.classList.remove("active"));const l=this.controlsContainer.querySelector(`[data-panel="${r}"]`);l==null||l.classList.add("active")})}),this.player.getVideoElement().addEventListener("click",()=>{this.player.getState().playing?this.player.pause():this.player.play()}),this.container.addEventListener("mousemove",()=>{this.showControls(),this.resetHideControlsTimeout()}),this.container.addEventListener("mouseleave",()=>{this.hideControls()})}setupPlayerEventListeners(){this.player.on("play",()=>{this.playButton.innerHTML=this.getPauseIcon()}),this.player.on("pause",()=>{this.playButton.innerHTML=this.getPlayIcon()}),this.player.on("timeupdate",t=>{const{currentTime:e}=t.data,i=this.player.getState();if(i.duration>0){const s=e/i.duration*100;this.progressBar.style.width=`${s}%`,this.progressInput.value=s.toString()}const n=this.controlsContainer.querySelector(".wontum-current-time");n.textContent=this.formatTime(e)}),this.player.on("loadedmetadata",t=>{const{duration:e}=t.data,i=this.controlsContainer.querySelector(".wontum-duration");i.textContent=this.formatTime(e),t.data.qualities&&this.updateQualityMenu(t.data.qualities)}),this.player.on("volumechange",t=>{const{volume:e,muted:i}=t.data;this.volumeSlider.value=(e*100).toString(),this.volumeButton.innerHTML=i?this.getMutedIcon():this.getVolumeIcon()}),this.player.on("waiting",()=>{const t=this.controlsContainer.querySelector(".wontum-loading");t.style.display="block"}),this.player.on("canplay",()=>{const t=this.controlsContainer.querySelector(".wontum-loading");t.style.display="none"})}updateSubtitleMenu(){const t=this.controlsContainer.querySelector(".wontum-subtitle-menu"),e=this.player.getSubtitleTracks();if(e.length===0){t.innerHTML='<div class="wontum-subtitle-option">No subtitles available</div>';return}const i=e.findIndex(n=>n.mode==="showing");t.innerHTML=`
+      <div class="wontum-subtitle-option ${i===-1?"active":""}" data-track="-1">Off</div>
+      ${e.map((n,s)=>`
+        <div class="wontum-subtitle-option ${s===i?"active":""}" data-track="${s}">
+          ${n.label||n.language||`Track ${s+1}`}
         </div>
       `).join("")}
-    `,t.querySelectorAll(".wontum-subtitle-option").forEach(s=>{s.addEventListener("click",i=>{const a=i.target,o=parseInt(a.dataset.track||"-1");o===-1?this.player.disableSubtitles():this.player.enableSubtitles(o),t.querySelectorAll(".wontum-subtitle-option").forEach(c=>c.classList.remove("active")),a.classList.add("active")})})}updateSpeedMenu(){const t=this.controlsContainer.querySelector(".wontum-speed-menu"),n=this.player.getState().playbackRate||1,s=[.25,.5,.75,1,1.25,1.5,1.75,2];t.innerHTML=s.map(i=>`
-        <div class="wontum-speed-option ${n===i?"active":""}" data-speed="${i}">
-          ${i===1?"Normal":i+"x"}
+    `,t.querySelectorAll(".wontum-subtitle-option").forEach(n=>{n.addEventListener("click",s=>{const r=s.target,a=parseInt(r.dataset.track||"-1");a===-1?this.player.disableSubtitles():this.player.enableSubtitles(a),t.querySelectorAll(".wontum-subtitle-option").forEach(l=>l.classList.remove("active")),r.classList.add("active")})})}updateSpeedMenu(){const t=this.controlsContainer.querySelector(".wontum-speed-menu"),i=this.player.getState().playbackRate||1,n=[.25,.5,.75,1,1.25,1.5,1.75,2];t.innerHTML=n.map(s=>`
+        <div class="wontum-speed-option ${i===s?"active":""}" data-speed="${s}">
+          ${s===1?"Normal":s+"x"}
         </div>
-      `).join(""),t.querySelectorAll(".wontum-speed-option").forEach(i=>{i.addEventListener("click",a=>{const o=a.target,c=parseFloat(o.dataset.speed||"1");this.player.setPlaybackRate(c),t.querySelectorAll(".wontum-speed-option").forEach(u=>u.classList.remove("active")),o.classList.add("active")})})}updateSettingsMenu(){const t=this.controlsContainer.querySelector(".wontum-settings-menu");t.innerHTML=`
+      `).join(""),t.querySelectorAll(".wontum-speed-option").forEach(s=>{s.addEventListener("click",r=>{const a=r.target,l=parseFloat(a.dataset.speed||"1");this.player.setPlaybackRate(l),t.querySelectorAll(".wontum-speed-option").forEach(u=>u.classList.remove("active")),a.classList.add("active")})})}updateSettingsMenu(){const t=this.controlsContainer.querySelector(".wontum-settings-menu");t.innerHTML=`
       <div class="wontum-settings-option" data-setting="sticky-controls">
         <span>Sticky Controls</span>
         <div class="wontum-toggle-switch ${this.stickyControls?"active":""}"></div>
       </div>
-    `;const e=t.querySelector('[data-setting="sticky-controls"]');e.addEventListener("click",()=>{this.stickyControls=!this.stickyControls,e.querySelector(".wontum-toggle-switch").classList.toggle("active"),this.stickyControls?(this.controlsContainer.classList.add("sticky"),this.progressContainer.classList.add("sticky")):(this.controlsContainer.classList.remove("sticky"),this.progressContainer.classList.remove("sticky"))})}updateQualityMenu(t){const e=this.controlsContainer.querySelector(".wontum-quality-menu"),n=t||this.player.getQualities();if(!n||n.length===0){e.innerHTML='<div class="wontum-quality-option">No qualities available</div>';return}e.innerHTML=`
+    `;const e=t.querySelector('[data-setting="sticky-controls"]');e.addEventListener("click",()=>{this.stickyControls=!this.stickyControls,e.querySelector(".wontum-toggle-switch").classList.toggle("active"),this.stickyControls?(this.controlsContainer.classList.add("sticky"),this.progressContainer.classList.add("sticky")):(this.controlsContainer.classList.remove("sticky"),this.progressContainer.classList.remove("sticky"))})}updateQualityMenu(t){const e=this.controlsContainer.querySelector(".wontum-quality-menu"),i=t||this.player.getQualities();if(!i||i.length===0){e.innerHTML='<div class="wontum-quality-option">No qualities available</div>';return}e.innerHTML=`
       <div class="wontum-quality-option active" data-quality="-1">Auto</div>
-      ${n.map((s,i)=>`
-        <div class="wontum-quality-option" data-quality="${i}">${s.name}</div>
+      ${i.map((n,s)=>`
+        <div class="wontum-quality-option" data-quality="${s}">${n.name}</div>
       `).join("")}
-    `,e.querySelectorAll(".wontum-quality-option").forEach(s=>{s.addEventListener("click",i=>{const a=i.target,o=parseInt(a.dataset.quality||"-1");this.player.setQuality(o),e.querySelectorAll(".wontum-quality-option").forEach(c=>c.classList.remove("active")),a.classList.add("active")})})}showControls(){this.controlsContainer.classList.remove("hidden"),this.progressContainer.classList.remove("hidden")}hideControls(){if(this.stickyControls||this.isVolumeSliderActive)return;this.player.getState().playing&&(this.controlsContainer.classList.add("hidden"),this.progressContainer.classList.add("hidden"))}resetHideControlsTimeout(){this.stickyControls||(this.hideControlsTimeout&&clearTimeout(this.hideControlsTimeout),this.hideControlsTimeout=window.setTimeout(()=>{this.hideControls()},1e4))}formatTime(t){if(isNaN(t))return"0:00";const e=Math.floor(t/60),n=Math.floor(t%60);return`${e}:${n.toString().padStart(2,"0")}`}getPlayIcon(){return'<svg viewBox="0 0 24 24"><path fill="white" d="M8 5v14l11-7z"/></svg>'}getPauseIcon(){return'<svg viewBox="0 0 24 24"><path fill="white" d="M6 4h4v16H6V4zm8 0h4v16h-4V4z"/></svg>'}getVolumeIcon(){return'<svg viewBox="0 0 24 24"><path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02z"/></svg>'}getMutedIcon(){return'<svg viewBox="0 0 24 24"><path d="M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z"/></svg>'}getFullscreenIcon(){return'<svg viewBox="0 0 24 24"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg>'}getPipIcon(){return'<svg viewBox="0 0 24 24"><path d="M19 7h-8v6h8V7zm2-4H3c-1.1 0-2 .9-2 2v14c0 1.1.9 1.98 2 1.98h18c1.1 0 2-.88 2-1.98V5c0-1.1-.9-2-2-2zm0 16.01H3V4.98h18v14.03z"/></svg>'}getSkipBackwardIcon(){return`<svg viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
+    `,e.querySelectorAll(".wontum-quality-option").forEach(n=>{n.addEventListener("click",s=>{const r=s.target,a=parseInt(r.dataset.quality||"-1");this.player.setQuality(a),e.querySelectorAll(".wontum-quality-option").forEach(l=>l.classList.remove("active")),r.classList.add("active")})})}showControls(){this.controlsContainer.classList.remove("hidden"),this.progressContainer.classList.remove("hidden")}hideControls(){if(this.stickyControls||this.isVolumeSliderActive)return;this.player.getState().playing&&(this.controlsContainer.classList.add("hidden"),this.progressContainer.classList.add("hidden"))}resetHideControlsTimeout(){this.stickyControls||(this.hideControlsTimeout&&clearTimeout(this.hideControlsTimeout),this.hideControlsTimeout=window.setTimeout(()=>{this.hideControls()},1e4))}formatTime(t){if(isNaN(t))return"0:00";const e=Math.floor(t/60),i=Math.floor(t%60);return`${e}:${i.toString().padStart(2,"0")}`}getPlayIcon(){return'<svg viewBox="0 0 24 24"><path fill="white" d="M8 5v14l11-7z"/></svg>'}getPauseIcon(){return'<svg viewBox="0 0 24 24"><path fill="white" d="M6 4h4v16H6V4zm8 0h4v16h-4V4z"/></svg>'}getVolumeIcon(){return'<svg viewBox="0 0 24 24"><path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02z"/></svg>'}getMutedIcon(){return'<svg viewBox="0 0 24 24"><path d="M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z"/></svg>'}getFullscreenIcon(){return'<svg viewBox="0 0 24 24"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg>'}getPipIcon(){return'<svg viewBox="0 0 24 24"><path d="M19 7h-8v6h8V7zm2-4H3c-1.1 0-2 .9-2 2v14c0 1.1.9 1.98 2 1.98h18c1.1 0 2-.88 2-1.98V5c0-1.1-.9-2-2-2zm0 16.01H3V4.98h18v14.03z"/></svg>'}getSkipBackwardIcon(){return`<svg viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
 			<circle cx="30" cy="30" r="28" stroke="white" stroke-width="2"/>
 			<!-- Circular arrow backward -->
 			<path d="M30 12 A18 18 0 1 0 30 48" stroke="white" stroke-width="2.5" stroke-linecap="round" fill="none"/>
@@ -595,4 +595,4 @@
 			<path d="M30 12 A18 18 0 1 1 30 48" stroke="white" stroke-width="2.5" stroke-linecap="round" fill="none"/>
 			<path d="M35 12 L30 12 L30 17" stroke="white" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
 			<text x="30" y="35" font-family="Arial, sans-serif" font-size="14" font-weight="bold" fill="white" text-anchor="middle">10</text>
-		</svg>`}getSettingsIcon(){return'<svg viewBox="0 0 24 24"><path d="M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z"/></svg>'}destroy(){this.hideControlsTimeout&&clearTimeout(this.hideControlsTimeout),this.controlsContainer.remove()}}class F{constructor(t){r(this,"config");r(this,"urlCache",new Map);r(this,"signedUrls",new Set);this.config=t}async processUrl(t){return this.isCloudFrontUrl(t)?this.signCloudFrontUrl(t):this.isS3Url(t)?this.getPresignedUrl(t):t}isCloudFrontUrl(t){var e;if(!((e=this.config)!=null&&e.cloudFrontDomains)||this.config.cloudFrontDomains.length===0)return!1;try{const n=new URL(t);return this.config.cloudFrontDomains.some(s=>n.hostname.includes(s))}catch{return!1}}isS3Url(t){return t.includes(".s3.")||t.includes("s3.amazonaws.com")||t.startsWith("s3://")}async signCloudFrontUrl(t,e=0){var i,a;if(this.signedUrls.has(t))return t;if((i=this.config)!=null&&i.signUrl)try{const o=await this.config.signUrl(t);return this.signedUrls.add(t),o}catch(o){const c=(o==null?void 0:o.name)==="AbortError"||((a=o==null?void 0:o.message)==null?void 0:a.includes("aborted"));if(c&&e<2)return console.warn(`Sign URL aborted, retrying (${e+1}/2)...`),await new Promise(u=>setTimeout(u,300)),this.signCloudFrontUrl(t,e+1);throw console.error("Failed to sign CloudFront URL:",o),c?new Error("Failed to sign CloudFront URL: Request was aborted. If using Apollo Client or other GraphQL clients, consider moving the query outside component lifecycle or using useQuery with skip option."):new Error(`Failed to sign CloudFront URL: ${(o==null?void 0:o.message)||"Unknown error"}`)}return console.warn("No signUrl function provided. CloudFront cookies may not be set."),t}extractS3Key(t){if(t.startsWith("s3://"))return t.replace("s3://","").split("/").slice(1).join("/");const e=t.match(/s3[.-]([^.]+)\.amazonaws\.com\/(.+)/);if(e)return e[2];const n=t.match(/([^.]+)\.s3\.amazonaws\.com\/(.+)/);return n?n[2]:t}async getPresignedUrl(t){var s;const e=this.extractS3Key(t),n=this.urlCache.get(e);if(n&&n.expiresAt>Date.now())return n.url;if((s=this.config)!=null&&s.getPresignedUrl)try{const i=await this.config.getPresignedUrl(e);return this.urlCache.set(e,{url:i,expiresAt:Date.now()+50*60*1e3}),i}catch(i){throw console.error("Failed to generate presigned URL:",i),new Error("Failed to generate presigned URL for S3 object")}return console.warn("No getPresignedUrl function provided. Using direct S3 URL (requires public bucket)"),t}static constructS3Url(t,e,n="us-east-1"){return`https://${t}.s3.${n}.amazonaws.com/${e}`}static parseS3Uri(t){if(!t.startsWith("s3://"))return null;const e=t.replace("s3://","").split("/"),n=e[0],s=e.slice(1).join("/");return{bucket:n,key:s}}clearCache(){this.urlCache.clear(),this.signedUrls.clear()}}class b{constructor(t){r(this,"container");r(this,"videoElement");r(this,"hls",null);r(this,"config");r(this,"eventListeners",new Map);r(this,"analytics");r(this,"s3Handler");r(this,"uiController");r(this,"qualities",[]);r(this,"state",{playing:!1,paused:!0,ended:!1,buffering:!1,currentTime:0,duration:0,volume:1,muted:!1,playbackRate:1,quality:"auto",availableQualities:[],fullscreen:!1});if(this.config=t,this.container=typeof t.container=="string"?document.querySelector(t.container):t.container,!this.container)throw new Error("Container element not found");this.analytics=new B(t.analytics),this.s3Handler=new F(t.s3Config),this.videoElement=this.createVideoElement(),this.container.appendChild(this.videoElement),this.uiController=new A(this.container,this),this.setupVideoListeners(),this.loadSource(t.src),t.autoplay&&(this.videoElement.autoplay=!0),t.muted&&this.mute(),t.poster&&(this.videoElement.poster=t.poster),t.preload&&(this.videoElement.preload=t.preload),t.subtitles&&this.addSubtitleTracks(t.subtitles)}addSubtitleTracks(t){t.forEach(e=>{const n=document.createElement("track");n.kind="subtitles",n.label=e.label,n.src=e.src,n.srclang=e.srclang,e.default&&(n.default=!0),this.videoElement.appendChild(n)})}createVideoElement(){const t=document.createElement("video");return t.className="wontum-player-video",t.style.width="100%",t.style.height="100%",t.playsInline=!0,t.crossOrigin="use-credentials",t}setupVideoListeners(){this.videoElement.addEventListener("play",()=>{this.state.playing=!0,this.state.paused=!1,this.emit("play"),this.analytics.trackEvent("play",this.getAnalyticsData())}),this.videoElement.addEventListener("pause",()=>{this.state.playing=!1,this.state.paused=!0,this.emit("pause"),this.analytics.trackEvent("pause",this.getAnalyticsData())}),this.videoElement.addEventListener("ended",()=>{this.state.ended=!0,this.state.playing=!1,this.emit("ended"),this.analytics.trackEvent("ended",this.getAnalyticsData())}),this.videoElement.addEventListener("timeupdate",()=>{this.state.currentTime=this.videoElement.currentTime,this.emit("timeupdate",{currentTime:this.state.currentTime})}),this.videoElement.addEventListener("loadedmetadata",()=>{this.state.duration=this.videoElement.duration,this.emit("loadedmetadata",{duration:this.state.duration}),this.analytics.trackEvent("loadedmetadata",this.getAnalyticsData())}),this.videoElement.addEventListener("volumechange",()=>{this.state.volume=this.videoElement.volume,this.state.muted=this.videoElement.muted,this.emit("volumechange",{volume:this.state.volume,muted:this.state.muted})}),this.videoElement.addEventListener("ratechange",()=>{this.state.playbackRate=this.videoElement.playbackRate,this.emit("ratechange",{playbackRate:this.state.playbackRate})}),this.videoElement.addEventListener("waiting",()=>{this.state.buffering=!0,this.emit("waiting"),this.analytics.trackEvent("buffering_start",this.getAnalyticsData())}),this.videoElement.addEventListener("canplay",()=>{this.state.buffering=!1,this.emit("canplay"),this.analytics.trackEvent("buffering_end",this.getAnalyticsData())}),this.videoElement.addEventListener("seeking",()=>{this.emit("seeking")}),this.videoElement.addEventListener("seeked",()=>{this.emit("seeked",{currentTime:this.state.currentTime}),this.analytics.trackEvent("seeked",this.getAnalyticsData())}),this.videoElement.addEventListener("error",t=>{const e=this.videoElement.error;this.emit("error",{error:e}),this.analytics.trackEvent("error",{...this.getAnalyticsData(),error:e==null?void 0:e.message})}),this.videoElement.addEventListener("loadstart",()=>{this.emit("loadstart")}),this.videoElement.addEventListener("loadeddata",()=>{this.emit("loadeddata")}),this.videoElement.addEventListener("canplaythrough",()=>{this.emit("canplaythrough")}),this.videoElement.addEventListener("playing",()=>{this.state.playing=!0,this.state.buffering=!1,this.emit("playing")}),this.videoElement.addEventListener("durationchange",()=>{this.state.duration=this.videoElement.duration,this.emit("durationchange",{duration:this.state.duration})}),this.videoElement.addEventListener("progress",()=>{this.emit("progress",{buffered:this.videoElement.buffered})}),this.videoElement.addEventListener("stalled",()=>{this.emit("stalled")}),this.videoElement.addEventListener("suspend",()=>{this.emit("suspend")}),this.videoElement.addEventListener("abort",()=>{this.emit("abort")}),this.videoElement.addEventListener("emptied",()=>{this.emit("emptied")}),this.videoElement.addEventListener("resize",()=>{this.emit("resize",{videoWidth:this.videoElement.videoWidth,videoHeight:this.videoElement.videoHeight})})}async loadSource(t){var e;try{const n=await this.s3Handler.processUrl(t);if(m.isSupported()){const s=((e=this.config.s3Config)==null?void 0:e.withCredentials)??!1,i={...this.config.hlsConfig,xhrSetup:(a,o)=>{var c;s&&(a.withCredentials=!0),(c=this.config.hlsConfig)!=null&&c.xhrSetup&&this.config.hlsConfig.xhrSetup(a,o)}};this.hls=new m(i),this.hls.loadSource(n),this.hls.attachMedia(this.videoElement),this.hls.on(m.Events.MANIFEST_PARSED,(a,o)=>{const c=this.extractQualities(o.levels);this.qualities=c}),this.hls.on(m.Events.LEVEL_SWITCHED,(a,o)=>{var u;const c=(u=this.hls)==null?void 0:u.levels[o.level];c&&(this.state.quality=`${c.height}p`,this.emit("qualitychange",{quality:this.state.quality}))}),this.hls.on(m.Events.ERROR,(a,o)=>{o.fatal&&this.handleHlsError(o)})}else if(this.videoElement.canPlayType("application/vnd.apple.mpegurl"))this.videoElement.src=n;else throw new Error("HLS is not supported in this browser")}catch(n){console.error("Failed to load video source:",n),this.emit("error",{error:n})}}extractQualities(t){return t.map(e=>({height:e.height,width:e.width,bitrate:e.bitrate,name:`${e.height}p`}))}handleHlsError(t){var e,n;switch(t.type){case m.ErrorTypes.NETWORK_ERROR:console.error("Network error occurred"),(e=this.hls)==null||e.startLoad();break;case m.ErrorTypes.MEDIA_ERROR:console.error("Media error occurred"),(n=this.hls)==null||n.recoverMediaError();break;default:console.error("Fatal error occurred:",t),this.destroy();break}}getAnalyticsData(){return{currentTime:this.state.currentTime,duration:this.state.duration,quality:this.state.quality,playbackRate:this.state.playbackRate,volume:this.state.volume,muted:this.state.muted}}play(){return this.videoElement.play()}pause(){this.videoElement.pause()}seek(t){this.videoElement.currentTime=t}skipForward(t=10){const e=Math.min(this.state.currentTime+t,this.state.duration);this.seek(e)}skipBackward(t=10){const e=Math.max(this.state.currentTime-t,0);this.seek(e)}setVolume(t){this.videoElement.volume=Math.max(0,Math.min(1,t))}mute(){this.videoElement.muted=!0}unmute(){this.videoElement.muted=!1}setPlaybackRate(t){this.videoElement.playbackRate=t}setQuality(t){this.hls&&(this.hls.currentLevel=t)}getQualities(){return this.qualities}enterFullscreen(){this.container.requestFullscreen&&(this.container.requestFullscreen(),this.state.fullscreen=!0,this.emit("fullscreenchange",{fullscreen:!0}))}exitFullscreen(){document.exitFullscreen&&(document.exitFullscreen(),this.state.fullscreen=!1,this.emit("fullscreenchange",{fullscreen:!1}))}async enterPictureInPicture(){if(document.pictureInPictureEnabled&&!this.videoElement.disablePictureInPicture)try{await this.videoElement.requestPictureInPicture(),this.emit("pictureinpictureenter",{})}catch(t){throw console.error("Failed to enter Picture-in-Picture:",t),t}}async exitPictureInPicture(){if(document.pictureInPictureElement)try{await document.exitPictureInPicture(),this.emit("pictureinpictureexit",{})}catch(t){throw console.error("Failed to exit Picture-in-Picture:",t),t}}async togglePictureInPicture(){document.pictureInPictureElement?await this.exitPictureInPicture():await this.enterPictureInPicture()}getState(){return{...this.state}}getVideoElement(){return this.videoElement}enableSubtitles(t){const e=this.videoElement.textTracks;for(let n=0;n<e.length;n++)e[n].mode=n===t?"showing":"hidden"}disableSubtitles(){const t=this.videoElement.textTracks;for(let e=0;e<t.length;e++)t[e].mode="hidden"}toggleSubtitles(){const t=this.videoElement.textTracks;return Array.from(t).some(n=>n.mode==="showing")?(this.disableSubtitles(),!1):t.length>0?(this.enableSubtitles(0),!0):!1}getSubtitleTracks(){return Array.from(this.videoElement.textTracks)}areSubtitlesEnabled(){const t=this.videoElement.textTracks;return Array.from(t).some(e=>e.mode==="showing")}on(t,e){this.eventListeners.has(t)||this.eventListeners.set(t,new Set),this.eventListeners.get(t).add(e)}off(t,e){var n;(n=this.eventListeners.get(t))==null||n.delete(e)}emit(t,e){var s;const n={type:t,data:e,timestamp:Date.now()};(s=this.eventListeners.get(t))==null||s.forEach(i=>{i(n)})}destroy(){this.hls&&(this.hls.destroy(),this.hls=null),this.uiController.destroy(),this.videoElement.remove(),this.eventListeners.clear(),this.analytics.destroy()}}const N=l=>{const{src:t,autoplay:e,muted:n,controls:s=!0,poster:i,preload:a,theme:o,s3Config:c,analytics:u,hlsConfig:g,subtitles:z,stickyControls:U,onReady:f,onPlay:k,onPause:E,onEnded:x,onTimeUpdate:S,onVolumeChange:C,onError:L,onLoadedMetadata:T,onQualityChange:P,style:H,className:D,width:v="100%",height:y="500px"}=l,w=h.useRef(null),q=h.useRef(null);return h.useEffect(()=>{if(!w.current)return;const V={src:t,container:w.current,autoplay:e,muted:n,controls:s,poster:i,preload:a,theme:o,s3Config:c,analytics:u,hlsConfig:g,subtitles:z,stickyControls:U},d=new b(V);return q.current=d,k&&d.on("play",k),E&&d.on("pause",E),x&&d.on("ended",x),L&&d.on("error",p=>{var I;return L((I=p.data)==null?void 0:I.error)}),T&&d.on("loadedmetadata",T),P&&d.on("qualitychange",p=>P(p.data.level)),S&&d.on("timeupdate",p=>S(p.data.currentTime)),C&&d.on("volumechange",p=>C(p.data.volume,p.data.muted)),f&&f(d),()=>{d.destroy(),q.current=null}},[t]),M.jsx("div",{ref:w,className:D,style:{width:typeof v=="number"?`${v}px`:v,height:typeof y=="number"?`${y}px`:y,...H}})},O=l=>{const[t,e]=h.useState(null),[n,s]=h.useState(null),i=h.useRef(null);return h.useEffect(()=>{if(!i.current)return;const a=new b({...l,container:i.current});e(a);const o=()=>{s(a.getState())};return a.on("play",o),a.on("pause",o),a.on("timeupdate",o),a.on("volumechange",o),a.on("loadedmetadata",o),()=>{a.destroy()}},[l.src]),{containerRef:i,player:t,state:n}},$=R.createContext({player:null,state:null}),Q=l=>{const{player:t,children:e}=l,[n,s]=h.useState(t.getState());return h.useEffect(()=>{const i=()=>{s(t.getState())};return t.on("play",i),t.on("pause",i),t.on("timeupdate",i),t.on("volumechange",i),t.on("loadedmetadata",i),()=>{}},[t]),M.jsx($.Provider,{value:{player:t,state:n},children:e})},Y=()=>{const l=R.useContext($);if(!l.player)throw new Error("useWontumPlayerContext must be used within WontumPlayerProvider");return l};exports.Analytics=B;exports.S3Handler=F;exports.UIController=A;exports.WontumPlayer=b;exports.WontumPlayerProvider=Q;exports.WontumPlayerReact=N;exports.useWontumPlayer=O;exports.useWontumPlayerContext=Y;
+		</svg>`}getSettingsIcon(){return'<svg viewBox="0 0 24 24"><path d="M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z"/></svg>'}destroy(){this.hideControlsTimeout&&clearTimeout(this.hideControlsTimeout),this.controlsContainer.remove()}}class z{constructor(t){o(this,"config");o(this,"urlCache",new Map);o(this,"signedUrls",new Set);this.config=t}async processUrl(t){return this.isCloudFrontUrl(t)?this.signCloudFrontUrl(t):this.isS3Url(t)?this.getPresignedUrl(t):t}isCloudFrontUrl(t){var e;if(!((e=this.config)!=null&&e.cloudFrontDomains)||this.config.cloudFrontDomains.length===0)return!1;try{const i=new URL(t);return this.config.cloudFrontDomains.some(n=>i.hostname.includes(n))}catch{return!1}}isS3Url(t){return t.includes(".s3.")||t.includes("s3.amazonaws.com")||t.startsWith("s3://")}async signCloudFrontUrl(t,e=0){var s,r;if(this.signedUrls.has(t))return t;if((s=this.config)!=null&&s.signUrl)try{const a=await this.config.signUrl(t);return this.signedUrls.add(t),a}catch(a){const l=(a==null?void 0:a.name)==="AbortError"||((r=a==null?void 0:a.message)==null?void 0:r.includes("aborted"));if(l&&e<2)return console.warn(`Sign URL aborted, retrying (${e+1}/2)...`),await new Promise(u=>setTimeout(u,300)),this.signCloudFrontUrl(t,e+1);throw console.error("Failed to sign CloudFront URL:",a),l?new Error("Failed to sign CloudFront URL: Request was aborted. If using Apollo Client or other GraphQL clients, consider moving the query outside component lifecycle or using useQuery with skip option."):new Error(`Failed to sign CloudFront URL: ${(a==null?void 0:a.message)||"Unknown error"}`)}return console.warn("No signUrl function provided. CloudFront cookies may not be set."),t}extractS3Key(t){if(t.startsWith("s3://"))return t.replace("s3://","").split("/").slice(1).join("/");const e=t.match(/s3[.-]([^.]+)\.amazonaws\.com\/(.+)/);if(e)return e[2];const i=t.match(/([^.]+)\.s3\.amazonaws\.com\/(.+)/);return i?i[2]:t}async getPresignedUrl(t){var n;const e=this.extractS3Key(t),i=this.urlCache.get(e);if(i&&i.expiresAt>Date.now())return i.url;if((n=this.config)!=null&&n.getPresignedUrl)try{const s=await this.config.getPresignedUrl(e);return this.urlCache.set(e,{url:s,expiresAt:Date.now()+50*60*1e3}),s}catch(s){throw console.error("Failed to generate presigned URL:",s),new Error("Failed to generate presigned URL for S3 object")}return console.warn("No getPresignedUrl function provided. Using direct S3 URL (requires public bucket)"),t}static constructS3Url(t,e,i="us-east-1"){return`https://${t}.s3.${i}.amazonaws.com/${e}`}static parseS3Uri(t){if(!t.startsWith("s3://"))return null;const e=t.replace("s3://","").split("/"),i=e[0],n=e.slice(1).join("/");return{bucket:i,key:n}}clearCache(){this.urlCache.clear(),this.signedUrls.clear()}}class k{constructor(t){o(this,"container");o(this,"videoElement");o(this,"hls",null);o(this,"config");o(this,"eventListeners",new Map);o(this,"analytics");o(this,"s3Handler");o(this,"uiController");o(this,"qualities",[]);o(this,"state",{playing:!1,paused:!0,ended:!1,buffering:!1,currentTime:0,duration:0,volume:1,muted:!1,playbackRate:1,quality:"auto",availableQualities:[],fullscreen:!1});if(this.config=t,this.container=typeof t.container=="string"?document.querySelector(t.container):t.container,!this.container)throw new Error("Container element not found");this.analytics=new $(t.analytics),this.s3Handler=new z(t.s3Config),this.videoElement=this.createVideoElement(),this.container.appendChild(this.videoElement),this.uiController=new A(this.container,this),this.setupVideoListeners(),this.loadSource(t.src),t.autoplay&&(this.videoElement.autoplay=!0),t.muted&&this.mute(),t.poster&&(this.videoElement.poster=t.poster),t.preload&&(this.videoElement.preload=t.preload),t.subtitles&&this.addSubtitleTracks(t.subtitles)}addSubtitleTracks(t){t.forEach(e=>{const i=document.createElement("track");i.kind="subtitles",i.label=e.label,i.src=e.src,i.srclang=e.srclang,e.default&&(i.default=!0),this.videoElement.appendChild(i)})}createVideoElement(){const t=document.createElement("video");return t.className="wontum-player-video",t.style.width="100%",t.style.height="100%",t.playsInline=!0,t.crossOrigin="use-credentials",t}setupVideoListeners(){this.videoElement.addEventListener("play",()=>{this.state.playing=!0,this.state.paused=!1,this.emit("play"),this.analytics.trackEvent("play",this.getAnalyticsData())}),this.videoElement.addEventListener("pause",()=>{this.state.playing=!1,this.state.paused=!0,this.emit("pause"),this.analytics.trackEvent("pause",this.getAnalyticsData())}),this.videoElement.addEventListener("ended",()=>{this.state.ended=!0,this.state.playing=!1,this.emit("ended"),this.analytics.trackEvent("ended",this.getAnalyticsData())}),this.videoElement.addEventListener("timeupdate",()=>{this.state.currentTime=this.videoElement.currentTime,this.emit("timeupdate",{currentTime:this.state.currentTime})}),this.videoElement.addEventListener("loadedmetadata",()=>{this.state.duration=this.videoElement.duration,this.emit("loadedmetadata",{duration:this.state.duration}),this.analytics.trackEvent("loadedmetadata",this.getAnalyticsData())}),this.videoElement.addEventListener("volumechange",()=>{this.state.volume=this.videoElement.volume,this.state.muted=this.videoElement.muted,this.emit("volumechange",{volume:this.state.volume,muted:this.state.muted})}),this.videoElement.addEventListener("ratechange",()=>{this.state.playbackRate=this.videoElement.playbackRate,this.emit("ratechange",{playbackRate:this.state.playbackRate})}),this.videoElement.addEventListener("waiting",()=>{this.state.buffering=!0,this.emit("waiting"),this.analytics.trackEvent("buffering_start",this.getAnalyticsData())}),this.videoElement.addEventListener("canplay",()=>{this.state.buffering=!1,this.emit("canplay"),this.analytics.trackEvent("buffering_end",this.getAnalyticsData())}),this.videoElement.addEventListener("seeking",()=>{this.emit("seeking")}),this.videoElement.addEventListener("seeked",()=>{this.emit("seeked",{currentTime:this.state.currentTime}),this.analytics.trackEvent("seeked",this.getAnalyticsData())}),this.videoElement.addEventListener("error",t=>{const e=this.videoElement.error;this.emit("error",{error:e}),this.analytics.trackEvent("error",{...this.getAnalyticsData(),error:e==null?void 0:e.message})}),this.videoElement.addEventListener("loadstart",()=>{this.emit("loadstart")}),this.videoElement.addEventListener("loadeddata",()=>{this.emit("loadeddata")}),this.videoElement.addEventListener("canplaythrough",()=>{this.emit("canplaythrough")}),this.videoElement.addEventListener("playing",()=>{this.state.playing=!0,this.state.buffering=!1,this.emit("playing")}),this.videoElement.addEventListener("durationchange",()=>{this.state.duration=this.videoElement.duration,this.emit("durationchange",{duration:this.state.duration})}),this.videoElement.addEventListener("progress",()=>{this.emit("progress",{buffered:this.videoElement.buffered})}),this.videoElement.addEventListener("stalled",()=>{this.emit("stalled")}),this.videoElement.addEventListener("suspend",()=>{this.emit("suspend")}),this.videoElement.addEventListener("abort",()=>{this.emit("abort")}),this.videoElement.addEventListener("emptied",()=>{this.emit("emptied")}),this.videoElement.addEventListener("resize",()=>{this.emit("resize",{videoWidth:this.videoElement.videoWidth,videoHeight:this.videoElement.videoHeight})})}async loadSource(t){var e;try{const i=await this.s3Handler.processUrl(t);if(g.isSupported()){const n=((e=this.config.s3Config)==null?void 0:e.withCredentials)??!1,s={...this.config.hlsConfig,xhrSetup:(r,a)=>{var l;n&&(r.withCredentials=!0),(l=this.config.hlsConfig)!=null&&l.xhrSetup&&this.config.hlsConfig.xhrSetup(r,a)}};this.hls=new g(s),this.hls.loadSource(i),this.hls.attachMedia(this.videoElement),this.hls.on(g.Events.MANIFEST_PARSED,(r,a)=>{const l=this.extractQualities(a.levels);this.qualities=l}),this.hls.on(g.Events.LEVEL_SWITCHED,(r,a)=>{var u;const l=(u=this.hls)==null?void 0:u.levels[a.level];l&&(this.state.quality=`${l.height}p`,this.emit("qualitychange",{quality:this.state.quality}))}),this.hls.on(g.Events.ERROR,(r,a)=>{a.fatal&&this.handleHlsError(a)})}else if(this.videoElement.canPlayType("application/vnd.apple.mpegurl"))this.videoElement.src=i;else throw new Error("HLS is not supported in this browser")}catch(i){console.error("Failed to load video source:",i),this.emit("error",{error:i})}}extractQualities(t){return t.map(e=>({height:e.height,width:e.width,bitrate:e.bitrate,name:`${e.height}p`}))}handleHlsError(t){var e,i;switch(t.type){case g.ErrorTypes.NETWORK_ERROR:console.error("Network error occurred"),(e=this.hls)==null||e.startLoad();break;case g.ErrorTypes.MEDIA_ERROR:console.error("Media error occurred"),(i=this.hls)==null||i.recoverMediaError();break;default:console.error("Fatal error occurred:",t),this.destroy();break}}getAnalyticsData(){return{currentTime:this.state.currentTime,duration:this.state.duration,quality:this.state.quality,playbackRate:this.state.playbackRate,volume:this.state.volume,muted:this.state.muted}}play(){return this.videoElement.play()}pause(){this.videoElement.pause()}seek(t){this.videoElement.currentTime=t}skipForward(t=10){const e=Math.min(this.state.currentTime+t,this.state.duration);this.seek(e)}skipBackward(t=10){const e=Math.max(this.state.currentTime-t,0);this.seek(e)}setVolume(t){this.videoElement.volume=Math.max(0,Math.min(1,t))}mute(){this.videoElement.muted=!0}unmute(){this.videoElement.muted=!1}setPlaybackRate(t){this.videoElement.playbackRate=t}setQuality(t){this.hls&&(this.hls.currentLevel=t)}getQualities(){return this.qualities}enterFullscreen(){this.container.requestFullscreen&&(this.container.requestFullscreen(),this.state.fullscreen=!0,this.emit("fullscreenchange",{fullscreen:!0}))}exitFullscreen(){document.exitFullscreen&&(document.exitFullscreen(),this.state.fullscreen=!1,this.emit("fullscreenchange",{fullscreen:!1}))}async enterPictureInPicture(){if(document.pictureInPictureEnabled&&!this.videoElement.disablePictureInPicture)try{await this.videoElement.requestPictureInPicture(),this.emit("pictureinpictureenter",{})}catch(t){throw console.error("Failed to enter Picture-in-Picture:",t),t}}async exitPictureInPicture(){if(document.pictureInPictureElement)try{await document.exitPictureInPicture(),this.emit("pictureinpictureexit",{})}catch(t){throw console.error("Failed to exit Picture-in-Picture:",t),t}}async togglePictureInPicture(){document.pictureInPictureElement?await this.exitPictureInPicture():await this.enterPictureInPicture()}getState(){return{...this.state}}getVideoElement(){return this.videoElement}enableSubtitles(t){const e=this.videoElement.textTracks;for(let i=0;i<e.length;i++)e[i].mode=i===t?"showing":"hidden"}disableSubtitles(){const t=this.videoElement.textTracks;for(let e=0;e<t.length;e++)t[e].mode="hidden"}toggleSubtitles(){const t=this.videoElement.textTracks;return Array.from(t).some(i=>i.mode==="showing")?(this.disableSubtitles(),!1):t.length>0?(this.enableSubtitles(0),!0):!1}getSubtitleTracks(){return Array.from(this.videoElement.textTracks)}areSubtitlesEnabled(){const t=this.videoElement.textTracks;return Array.from(t).some(e=>e.mode==="showing")}on(t,e){this.eventListeners.has(t)||this.eventListeners.set(t,new Set),this.eventListeners.get(t).add(e)}off(t,e){var i;(i=this.eventListeners.get(t))==null||i.delete(e)}emit(t,e){var n;const i={type:t,data:e,timestamp:Date.now()};(n=this.eventListeners.get(t))==null||n.forEach(s=>{s(i)})}destroy(){this.hls&&(this.hls.destroy(),this.hls=null),this.uiController.destroy(),this.videoElement.remove(),this.eventListeners.clear(),this.analytics.destroy()}}class O{constructor(t){o(this,"file");o(this,"videoElement",null);o(this,"info",null);if(!this.isVideoFile(t))throw new Error(`Invalid file type: ${t.type}. Expected a video file.`);this.file=t}isVideoFile(t){if(t.type.startsWith("video/"))return!0;const e=[".mp4",".webm",".ogg",".mov",".avi",".mkv",".flv",".wmv",".m4v",".3gp",".ts",".m3u8"],i=t.name.toLowerCase();return e.some(n=>i.endsWith(n))}async extract(){return new Promise((t,e)=>{try{this.videoElement=document.createElement("video"),this.videoElement.preload="metadata",this.videoElement.muted=!0;const i=URL.createObjectURL(this.file);this.videoElement.onloadedmetadata=()=>{try{if(!this.videoElement){e(new Error("Video element not initialized"));return}const n=this.videoElement.videoWidth,s=this.videoElement.videoHeight,r=this.videoElement.duration,a=this.calculateAspectRatio(n,s),l=this.file.size,u=this.formatBytes(l),p=this.formatDuration(r),v=this.getFileExtension(this.file.name),f=r>0?Math.round(l*8/r/1e3):void 0;this.info={width:n,height:s,aspectRatio:a,size:l,sizeInBytes:l,sizeFormatted:u,duration:r,durationInSeconds:r,durationFormatted:p,mimeType:this.file.type||"video/unknown",fileName:this.file.name,fileExtension:v,bitrate:f},URL.revokeObjectURL(i),this.videoElement.remove(),t(this.info)}catch(n){URL.revokeObjectURL(i),e(n)}},this.videoElement.onerror=()=>{URL.revokeObjectURL(i),e(new Error(`Failed to load video file: ${this.file.name}`))},this.videoElement.src=i}catch(i){e(i)}})}calculateAspectRatio(t,e){const i=this.getGCD(t,e),n=t/i,s=e/i,r=n/s;return Math.abs(r-16/9)<.01?"16:9":Math.abs(r-4/3)<.01?"4:3":Math.abs(r-21/9)<.01?"21:9":Math.abs(r-1)<.01?"1:1":`${n}:${s}`}getGCD(t,e){return e===0?t:this.getGCD(e,t%e)}formatBytes(t){if(t===0)return"0 Bytes";const e=1024,i=["Bytes","KB","MB","GB","TB"],n=Math.floor(Math.log(t)/Math.log(e));return`${parseFloat((t/Math.pow(e,n)).toFixed(2))} ${i[n]}`}formatDuration(t){if(!isFinite(t)||t<0)return"00:00";const e=Math.floor(t/3600),i=Math.floor(t%3600/60),n=Math.floor(t%60);return e>0?`${e.toString().padStart(2,"0")}:${i.toString().padStart(2,"0")}:${n.toString().padStart(2,"0")}`:`${i.toString().padStart(2,"0")}:${n.toString().padStart(2,"0")}`}getFileExtension(t){const e=t.split(".");return e.length>1?`.${e[e.length-1].toLowerCase()}`:""}get width(){var t;return((t=this.info)==null?void 0:t.width)||0}get height(){var t;return((t=this.info)==null?void 0:t.height)||0}get aspectRatio(){var t;return((t=this.info)==null?void 0:t.aspectRatio)||"unknown"}get size(){var t;return((t=this.info)==null?void 0:t.size)||0}get sizeInBytes(){var t;return((t=this.info)==null?void 0:t.sizeInBytes)||0}get sizeFormatted(){var t;return((t=this.info)==null?void 0:t.sizeFormatted)||"0 Bytes"}get duration(){var t;return((t=this.info)==null?void 0:t.duration)||0}get durationInSeconds(){var t;return((t=this.info)==null?void 0:t.durationInSeconds)||0}get durationFormatted(){var t;return((t=this.info)==null?void 0:t.durationFormatted)||"00:00"}get mimeType(){var t;return((t=this.info)==null?void 0:t.mimeType)||this.file.type||"video/unknown"}get fileName(){return this.file.name}get fileExtension(){var t;return((t=this.info)==null?void 0:t.fileExtension)||""}get bitrate(){var t;return(t=this.info)==null?void 0:t.bitrate}get quality(){if(!this.info)return"unknown";const t=this.info.height;return t>=2160?"4K (2160p)":t>=1440?"2K (1440p)":t>=1080?"Full HD (1080p)":t>=720?"HD (720p)":t>=480?"SD (480p)":t>=360?"360p":"Low Quality"}getInfo(){return this.info}destroy(){this.videoElement&&(this.videoElement.remove(),this.videoElement=null),this.info=null}}const _=c=>{const{src:t,autoplay:e,muted:i,controls:n=!0,poster:s,preload:r,theme:a,s3Config:l,analytics:u,hlsConfig:p,subtitles:v,stickyControls:f,onReady:E,onPlay:x,onPause:S,onEnded:C,onTimeUpdate:L,onVolumeChange:T,onError:P,onLoadedMetadata:I,onQualityChange:M,style:D,className:H,width:y="100%",height:w="500px"}=c,b=h.useRef(null),q=h.useRef(null);return h.useEffect(()=>{if(!b.current)return;const V={src:t,container:b.current,autoplay:e,muted:i,controls:n,poster:s,preload:r,theme:a,s3Config:l,analytics:u,hlsConfig:p,subtitles:v,stickyControls:f},d=new k(V);return q.current=d,x&&d.on("play",x),S&&d.on("pause",S),C&&d.on("ended",C),P&&d.on("error",m=>{var R;return P((R=m.data)==null?void 0:R.error)}),I&&d.on("loadedmetadata",I),M&&d.on("qualitychange",m=>M(m.data.level)),L&&d.on("timeupdate",m=>L(m.data.currentTime)),T&&d.on("volumechange",m=>T(m.data.volume,m.data.muted)),E&&E(d),()=>{d.destroy(),q.current=null}},[t]),B.jsx("div",{ref:b,className:H,style:{width:typeof y=="number"?`${y}px`:y,height:typeof w=="number"?`${w}px`:w,...D}})},Q=c=>{const[t,e]=h.useState(null),[i,n]=h.useState(null),s=h.useRef(null);return h.useEffect(()=>{if(!s.current)return;const r=new k({...c,container:s.current});e(r);const a=()=>{n(r.getState())};return r.on("play",a),r.on("pause",a),r.on("timeupdate",a),r.on("volumechange",a),r.on("loadedmetadata",a),()=>{r.destroy()}},[c.src]),{containerRef:s,player:t,state:i}},U=F.createContext({player:null,state:null}),Y=c=>{const{player:t,children:e}=c,[i,n]=h.useState(t.getState());return h.useEffect(()=>{const s=()=>{n(t.getState())};return t.on("play",s),t.on("pause",s),t.on("timeupdate",s),t.on("volumechange",s),t.on("loadedmetadata",s),()=>{}},[t]),B.jsx(U.Provider,{value:{player:t,state:i},children:e})},X=()=>{const c=F.useContext(U);if(!c.player)throw new Error("useWontumPlayerContext must be used within WontumPlayerProvider");return c};exports.Analytics=$;exports.S3Handler=z;exports.UIController=A;exports.WontumFileInfo=O;exports.WontumPlayer=k;exports.WontumPlayerProvider=Y;exports.WontumPlayerReact=_;exports.useWontumPlayer=Q;exports.useWontumPlayerContext=X;

package/dist/wontum-player.esm.js

@@ -1,28 +1,28 @@
 var V = Object.defineProperty;
 var N = (c, t, e) => t in c ? V(c, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[t] = e;
-var r = (c, t, e) => N(c, typeof t != "symbol" ? t + "" : t, e);
+var o = (c, t, e) => N(c, typeof t != "symbol" ? t + "" : t, e);
 import p from "hls.js";
-import { jsx as B } from "react/jsx-runtime";
-import * as R from "react";
-import { useRef as y, useEffect as f, useState as b } from "react";
-class _ {
+import { jsx as F } from "react/jsx-runtime";
+import * as $ from "react";
+import { useRef as b, useEffect as E, useState as k } from "react";
+class W {
   constructor(t) {
-    r(this, "config");
-    r(this, "sessionId");
-    r(this, "events", []);
-    r(this, "sessionStartTime");
-    r(this, "playbackStartTime", null);
-    r(this, "totalPlayTime", 0);
-    r(this, "totalBufferTime", 0);
-    r(this, "bufferStartTime", null);
-    r(this, "rebufferCount", 0);
-    r(this, "seekCount", 0);
+    o(this, "config");
+    o(this, "sessionId");
+    o(this, "events", []);
+    o(this, "sessionStartTime");
+    o(this, "playbackStartTime", null);
+    o(this, "totalPlayTime", 0);
+    o(this, "totalBufferTime", 0);
+    o(this, "bufferStartTime", null);
+    o(this, "rebufferCount", 0);
+    o(this, "seekCount", 0);
     var e;
     this.config = t, this.sessionId = (t == null ? void 0 : t.sessionId) || this.generateSessionId(), this.sessionStartTime = Date.now(), (e = this.config) != null && e.enabled && this.trackEvent("session_start", this.getSessionData());
   }
   trackEvent(t, e = {}) {
-    var s;
-    if (!((s = this.config) != null && s.enabled)) return;
+    var n;
+    if (!((n = this.config) != null && n.enabled)) return;
     const i = {
       eventType: t,
       timestamp: Date.now(),
@@ -119,44 +119,44 @@ class _ {
     (t = this.config) != null && t.enabled && this.trackEvent("session_end", this.getSessionData()), this.events = [];
   }
 }
-class Q {
+class j {
   constructor(t, e) {
-    r(this, "container");
-    r(this, "player");
-    r(this, "controlsContainer");
-    r(this, "progressContainer");
-    r(this, "progressBar");
-    r(this, "playButton");
-    r(this, "skipBackwardButton");
-    r(this, "skipForwardButton");
-    r(this, "volumeButton");
-    r(this, "volumeContainer");
-    r(this, "fullscreenButton");
-    r(this, "pipButton");
-    r(this, "settingsButton");
+    o(this, "container");
+    o(this, "player");
+    o(this, "controlsContainer");
+    o(this, "progressContainer");
+    o(this, "progressBar");
+    o(this, "playButton");
+    o(this, "skipBackwardButton");
+    o(this, "skipForwardButton");
+    o(this, "volumeButton");
+    o(this, "volumeContainer");
+    o(this, "fullscreenButton");
+    o(this, "pipButton");
+    o(this, "settingsButton");
     // private timeDisplay: HTMLElement
-    r(this, "volumeSlider");
-    r(this, "progressInput");
+    o(this, "volumeSlider");
+    o(this, "progressInput");
     // private controlsVisible = true
-    r(this, "hideControlsTimeout", null);
-    r(this, "stickyControls", !1);
-    r(this, "isVolumeSliderActive", !1);
+    o(this, "hideControlsTimeout", null);
+    o(this, "stickyControls", !1);
+    o(this, "isVolumeSliderActive", !1);
     this.container = t, this.player = e, this.injectStyles(), this.createProgressBar(), this.controlsContainer = this.createControls(), this.container.appendChild(this.controlsContainer), this.playButton = this.controlsContainer.querySelector(".wontum-play-btn"), this.skipBackwardButton = this.controlsContainer.querySelector(".wontum-skip-backward-btn"), this.skipForwardButton = this.controlsContainer.querySelector(".wontum-skip-forward-btn"), this.volumeButton = this.controlsContainer.querySelector(".wontum-volume-btn"), this.volumeContainer = this.controlsContainer.querySelector(".wontum-volume-container"), this.fullscreenButton = this.controlsContainer.querySelector(".wontum-fullscreen-btn"), this.pipButton = this.controlsContainer.querySelector(".wontum-pip-btn"), this.settingsButton = this.controlsContainer.querySelector(".wontum-settings-btn"), this.volumeSlider = this.controlsContainer.querySelector(".wontum-volume-slider"), this.progressInput = this.container.querySelector(".wontum-progress-input"), this.progressBar = this.container.querySelector(".wontum-progress-filled"), this.stickyControls = this.player.config.stickyControls || !1, this.stickyControls && this.controlsContainer.classList.add("sticky"), this.setupEventListeners(), this.setupPlayerEventListeners();
   }
   injectStyles() {
     const t = "wontum-player-styles";
     if (document.getElementById(t)) return;
-    const e = this.player.config.theme || {}, i = e.primaryColor || "#3b82f6", s = e.accentColor || "#2563eb", n = e.fontFamily || "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif", a = e.controlsBackground || "linear-gradient(to top, rgba(0,0,0,0.8), transparent)", o = e.buttonHoverBg || "rgba(255, 255, 255, 0.1)", l = e.progressHeight || "6px", u = e.borderRadius || "4px", m = document.createElement("style");
+    const e = this.player.config.theme || {}, i = e.primaryColor || "#3b82f6", n = e.accentColor || "#2563eb", s = e.fontFamily || "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif", r = e.controlsBackground || "linear-gradient(to top, rgba(0,0,0,0.8), transparent)", a = e.buttonHoverBg || "rgba(255, 255, 255, 0.1)", l = e.progressHeight || "6px", u = e.borderRadius || "4px", m = document.createElement("style");
     m.id = t, m.textContent = `
       .wontum-player-container {
         position: relative;
         background: #000;
-        font-family: ${n};
+        font-family: ${s};
         overflow: hidden;
         --primary-color: ${i};
-        --accent-color: ${s};
-        --controls-bg: ${a};
-        --button-hover: ${o};
+        --accent-color: ${n};
+        --controls-bg: ${r};
+        --button-hover: ${a};
         --progress-height: ${l};
         --border-radius: ${u};
       }
@@ -729,11 +729,11 @@ class Q {
     }), this.skipForwardButton.addEventListener("click", () => {
       this.player.skipForward(10);
     }), this.progressInput.addEventListener("input", (i) => {
-      const s = i.target, n = parseFloat(s.value), a = this.player.getState(), o = n / 100 * a.duration;
-      this.player.seek(o);
+      const n = i.target, s = parseFloat(n.value), r = this.player.getState(), a = s / 100 * r.duration;
+      this.player.seek(a);
     }), this.volumeSlider.addEventListener("input", (i) => {
-      const s = i.target, n = parseFloat(s.value) / 100;
-      this.player.setVolume(n);
+      const n = i.target, s = parseFloat(n.value) / 100;
+      this.player.setVolume(s);
     }), this.volumeButton.addEventListener("click", () => {
       this.player.getState().muted ? this.player.unmute() : this.player.mute();
     }), this.volumeContainer.addEventListener("mouseenter", () => {
@@ -760,10 +760,10 @@ class Q {
     });
     const t = this.controlsContainer.querySelectorAll(".wontum-tab");
     t.forEach((i) => {
-      i.addEventListener("click", (s) => {
-        const n = s.currentTarget, a = n.getAttribute("data-tab");
-        t.forEach((u) => u.classList.remove("active")), n.classList.add("active"), this.controlsContainer.querySelectorAll(".wontum-tab-panel").forEach((u) => u.classList.remove("active"));
-        const l = this.controlsContainer.querySelector(`[data-panel="${a}"]`);
+      i.addEventListener("click", (n) => {
+        const s = n.currentTarget, r = s.getAttribute("data-tab");
+        t.forEach((u) => u.classList.remove("active")), s.classList.add("active"), this.controlsContainer.querySelectorAll(".wontum-tab-panel").forEach((u) => u.classList.remove("active"));
+        const l = this.controlsContainer.querySelector(`[data-panel="${r}"]`);
         l == null || l.classList.add("active");
       });
     }), this.player.getVideoElement().addEventListener("click", () => {
@@ -782,11 +782,11 @@ class Q {
     }), this.player.on("timeupdate", (t) => {
       const { currentTime: e } = t.data, i = this.player.getState();
       if (i.duration > 0) {
-        const n = e / i.duration * 100;
-        this.progressBar.style.width = `${n}%`, this.progressInput.value = n.toString();
+        const s = e / i.duration * 100;
+        this.progressBar.style.width = `${s}%`, this.progressInput.value = s.toString();
       }
-      const s = this.controlsContainer.querySelector(".wontum-current-time");
-      s.textContent = this.formatTime(e);
+      const n = this.controlsContainer.querySelector(".wontum-current-time");
+      n.textContent = this.formatTime(e);
     }), this.player.on("loadedmetadata", (t) => {
       const { duration: e } = t.data, i = this.controlsContainer.querySelector(".wontum-duration");
       i.textContent = this.formatTime(e), t.data.qualities && this.updateQualityMenu(t.data.qualities);
@@ -807,35 +807,35 @@ class Q {
       t.innerHTML = '<div class="wontum-subtitle-option">No subtitles available</div>';
       return;
     }
-    const i = e.findIndex((s) => s.mode === "showing");
+    const i = e.findIndex((n) => n.mode === "showing");
     t.innerHTML = `
       <div class="wontum-subtitle-option ${i === -1 ? "active" : ""}" data-track="-1">Off</div>
       ${e.map(
-      (s, n) => `
-        <div class="wontum-subtitle-option ${n === i ? "active" : ""}" data-track="${n}">
-          ${s.label || s.language || `Track ${n + 1}`}
+      (n, s) => `
+        <div class="wontum-subtitle-option ${s === i ? "active" : ""}" data-track="${s}">
+          ${n.label || n.language || `Track ${s + 1}`}
         </div>
       `
     ).join("")}
-    `, t.querySelectorAll(".wontum-subtitle-option").forEach((s) => {
-      s.addEventListener("click", (n) => {
-        const a = n.target, o = parseInt(a.dataset.track || "-1");
-        o === -1 ? this.player.disableSubtitles() : this.player.enableSubtitles(o), t.querySelectorAll(".wontum-subtitle-option").forEach((l) => l.classList.remove("active")), a.classList.add("active");
+    `, t.querySelectorAll(".wontum-subtitle-option").forEach((n) => {
+      n.addEventListener("click", (s) => {
+        const r = s.target, a = parseInt(r.dataset.track || "-1");
+        a === -1 ? this.player.disableSubtitles() : this.player.enableSubtitles(a), t.querySelectorAll(".wontum-subtitle-option").forEach((l) => l.classList.remove("active")), r.classList.add("active");
       });
     });
   }
   updateSpeedMenu() {
-    const t = this.controlsContainer.querySelector(".wontum-speed-menu"), i = this.player.getState().playbackRate || 1, s = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2];
-    t.innerHTML = s.map(
-      (n) => `
-        <div class="wontum-speed-option ${i === n ? "active" : ""}" data-speed="${n}">
-          ${n === 1 ? "Normal" : n + "x"}
+    const t = this.controlsContainer.querySelector(".wontum-speed-menu"), i = this.player.getState().playbackRate || 1, n = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2];
+    t.innerHTML = n.map(
+      (s) => `
+        <div class="wontum-speed-option ${i === s ? "active" : ""}" data-speed="${s}">
+          ${s === 1 ? "Normal" : s + "x"}
         </div>
       `
-    ).join(""), t.querySelectorAll(".wontum-speed-option").forEach((n) => {
-      n.addEventListener("click", (a) => {
-        const o = a.target, l = parseFloat(o.dataset.speed || "1");
-        this.player.setPlaybackRate(l), t.querySelectorAll(".wontum-speed-option").forEach((u) => u.classList.remove("active")), o.classList.add("active");
+    ).join(""), t.querySelectorAll(".wontum-speed-option").forEach((s) => {
+      s.addEventListener("click", (r) => {
+        const a = r.target, l = parseFloat(a.dataset.speed || "1");
+        this.player.setPlaybackRate(l), t.querySelectorAll(".wontum-speed-option").forEach((u) => u.classList.remove("active")), a.classList.add("active");
       });
     });
   }
@@ -861,14 +861,14 @@ class Q {
     e.innerHTML = `
       <div class="wontum-quality-option active" data-quality="-1">Auto</div>
       ${i.map(
-      (s, n) => `
-        <div class="wontum-quality-option" data-quality="${n}">${s.name}</div>
+      (n, s) => `
+        <div class="wontum-quality-option" data-quality="${s}">${n.name}</div>
       `
     ).join("")}
-    `, e.querySelectorAll(".wontum-quality-option").forEach((s) => {
-      s.addEventListener("click", (n) => {
-        const a = n.target, o = parseInt(a.dataset.quality || "-1");
-        this.player.setQuality(o), e.querySelectorAll(".wontum-quality-option").forEach((l) => l.classList.remove("active")), a.classList.add("active");
+    `, e.querySelectorAll(".wontum-quality-option").forEach((n) => {
+      n.addEventListener("click", (s) => {
+        const r = s.target, a = parseInt(r.dataset.quality || "-1");
+        this.player.setQuality(a), e.querySelectorAll(".wontum-quality-option").forEach((l) => l.classList.remove("active")), r.classList.add("active");
       });
     });
   }
@@ -933,11 +933,11 @@ class Q {
     this.hideControlsTimeout && clearTimeout(this.hideControlsTimeout), this.controlsContainer.remove();
   }
 }
-class j {
+class Q {
   constructor(t) {
-    r(this, "config");
-    r(this, "urlCache", /* @__PURE__ */ new Map());
-    r(this, "signedUrls", /* @__PURE__ */ new Set());
+    o(this, "config");
+    o(this, "urlCache", /* @__PURE__ */ new Map());
+    o(this, "signedUrls", /* @__PURE__ */ new Set());
     this.config = t;
   }
   /**
@@ -955,7 +955,7 @@ class j {
       return !1;
     try {
       const i = new URL(t);
-      return this.config.cloudFrontDomains.some((s) => i.hostname.includes(s));
+      return this.config.cloudFrontDomains.some((n) => i.hostname.includes(n));
     } catch {
       return !1;
     }
@@ -971,20 +971,20 @@ class j {
    * The endpoint should set signed cookies and return the URL
    */
   async signCloudFrontUrl(t, e = 0) {
-    var n, a;
+    var s, r;
     if (this.signedUrls.has(t))
       return t;
-    if ((n = this.config) != null && n.signUrl)
+    if ((s = this.config) != null && s.signUrl)
       try {
-        const o = await this.config.signUrl(t);
-        return this.signedUrls.add(t), o;
-      } catch (o) {
-        const l = (o == null ? void 0 : o.name) === "AbortError" || ((a = o == null ? void 0 : o.message) == null ? void 0 : a.includes("aborted"));
+        const a = await this.config.signUrl(t);
+        return this.signedUrls.add(t), a;
+      } catch (a) {
+        const l = (a == null ? void 0 : a.name) === "AbortError" || ((r = a == null ? void 0 : a.message) == null ? void 0 : r.includes("aborted"));
         if (l && e < 2)
           return console.warn(`Sign URL aborted, retrying (${e + 1}/2)...`), await new Promise((u) => setTimeout(u, 300)), this.signCloudFrontUrl(t, e + 1);
-        throw console.error("Failed to sign CloudFront URL:", o), l ? new Error(
+        throw console.error("Failed to sign CloudFront URL:", a), l ? new Error(
           "Failed to sign CloudFront URL: Request was aborted. If using Apollo Client or other GraphQL clients, consider moving the query outside component lifecycle or using useQuery with skip option."
-        ) : new Error(`Failed to sign CloudFront URL: ${(o == null ? void 0 : o.message) || "Unknown error"}`);
+        ) : new Error(`Failed to sign CloudFront URL: ${(a == null ? void 0 : a.message) || "Unknown error"}`);
       }
     return console.warn("No signUrl function provided. CloudFront cookies may not be set."), t;
   }
@@ -1004,19 +1004,19 @@ class j {
    * Get presigned URL from cache or generate new one
    */
   async getPresignedUrl(t) {
-    var s;
+    var n;
     const e = this.extractS3Key(t), i = this.urlCache.get(e);
     if (i && i.expiresAt > Date.now())
       return i.url;
-    if ((s = this.config) != null && s.getPresignedUrl)
+    if ((n = this.config) != null && n.getPresignedUrl)
       try {
-        const n = await this.config.getPresignedUrl(e);
+        const s = await this.config.getPresignedUrl(e);
         return this.urlCache.set(e, {
-          url: n,
+          url: s,
           expiresAt: Date.now() + 50 * 60 * 1e3
-        }), n;
-      } catch (n) {
-        throw console.error("Failed to generate presigned URL:", n), new Error("Failed to generate presigned URL for S3 object");
+        }), s;
+      } catch (s) {
+        throw console.error("Failed to generate presigned URL:", s), new Error("Failed to generate presigned URL for S3 object");
       }
     return console.warn("No getPresignedUrl function provided. Using direct S3 URL (requires public bucket)"), t;
   }
@@ -1032,8 +1032,8 @@ class j {
   static parseS3Uri(t) {
     if (!t.startsWith("s3://"))
       return null;
-    const e = t.replace("s3://", "").split("/"), i = e[0], s = e.slice(1).join("/");
-    return { bucket: i, key: s };
+    const e = t.replace("s3://", "").split("/"), i = e[0], n = e.slice(1).join("/");
+    return { bucket: i, key: n };
   }
   /**
    * Clear URL cache and signed URLs
@@ -1044,16 +1044,16 @@ class j {
 }
 class A {
   constructor(t) {
-    r(this, "container");
-    r(this, "videoElement");
-    r(this, "hls", null);
-    r(this, "config");
-    r(this, "eventListeners", /* @__PURE__ */ new Map());
-    r(this, "analytics");
-    r(this, "s3Handler");
-    r(this, "uiController");
-    r(this, "qualities", []);
-    r(this, "state", {
+    o(this, "container");
+    o(this, "videoElement");
+    o(this, "hls", null);
+    o(this, "config");
+    o(this, "eventListeners", /* @__PURE__ */ new Map());
+    o(this, "analytics");
+    o(this, "s3Handler");
+    o(this, "uiController");
+    o(this, "qualities", []);
+    o(this, "state", {
       playing: !1,
       paused: !0,
       ended: !1,
@@ -1069,7 +1069,7 @@ class A {
     });
     if (this.config = t, this.container = typeof t.container == "string" ? document.querySelector(t.container) : t.container, !this.container)
       throw new Error("Container element not found");
-    this.analytics = new _(t.analytics), this.s3Handler = new j(t.s3Config), this.videoElement = this.createVideoElement(), this.container.appendChild(this.videoElement), this.uiController = new Q(this.container, this), this.setupVideoListeners(), this.loadSource(t.src), t.autoplay && (this.videoElement.autoplay = !0), t.muted && this.mute(), t.poster && (this.videoElement.poster = t.poster), t.preload && (this.videoElement.preload = t.preload), t.subtitles && this.addSubtitleTracks(t.subtitles);
+    this.analytics = new W(t.analytics), this.s3Handler = new Q(t.s3Config), this.videoElement = this.createVideoElement(), this.container.appendChild(this.videoElement), this.uiController = new j(this.container, this), this.setupVideoListeners(), this.loadSource(t.src), t.autoplay && (this.videoElement.autoplay = !0), t.muted && this.mute(), t.poster && (this.videoElement.poster = t.poster), t.preload && (this.videoElement.preload = t.preload), t.subtitles && this.addSubtitleTracks(t.subtitles);
   }
   addSubtitleTracks(t) {
     t.forEach((e) => {
@@ -1139,22 +1139,22 @@ class A {
     try {
       const i = await this.s3Handler.processUrl(t);
       if (p.isSupported()) {
-        const s = ((e = this.config.s3Config) == null ? void 0 : e.withCredentials) ?? !1, n = {
+        const n = ((e = this.config.s3Config) == null ? void 0 : e.withCredentials) ?? !1, s = {
           ...this.config.hlsConfig,
-          xhrSetup: (a, o) => {
+          xhrSetup: (r, a) => {
             var l;
-            s && (a.withCredentials = !0), (l = this.config.hlsConfig) != null && l.xhrSetup && this.config.hlsConfig.xhrSetup(a, o);
+            n && (r.withCredentials = !0), (l = this.config.hlsConfig) != null && l.xhrSetup && this.config.hlsConfig.xhrSetup(r, a);
           }
         };
-        this.hls = new p(n), this.hls.loadSource(i), this.hls.attachMedia(this.videoElement), this.hls.on(p.Events.MANIFEST_PARSED, (a, o) => {
-          const l = this.extractQualities(o.levels);
+        this.hls = new p(s), this.hls.loadSource(i), this.hls.attachMedia(this.videoElement), this.hls.on(p.Events.MANIFEST_PARSED, (r, a) => {
+          const l = this.extractQualities(a.levels);
           this.qualities = l;
-        }), this.hls.on(p.Events.LEVEL_SWITCHED, (a, o) => {
+        }), this.hls.on(p.Events.LEVEL_SWITCHED, (r, a) => {
           var u;
-          const l = (u = this.hls) == null ? void 0 : u.levels[o.level];
+          const l = (u = this.hls) == null ? void 0 : u.levels[a.level];
           l && (this.state.quality = `${l.height}p`, this.emit("qualitychange", { quality: this.state.quality }));
-        }), this.hls.on(p.Events.ERROR, (a, o) => {
-          o.fatal && this.handleHlsError(o);
+        }), this.hls.on(p.Events.ERROR, (r, a) => {
+          a.fatal && this.handleHlsError(a);
         });
       } else if (this.videoElement.canPlayType("application/vnd.apple.mpegurl"))
         this.videoElement.src = i;
@@ -1307,128 +1307,296 @@ class A {
     (i = this.eventListeners.get(t)) == null || i.delete(e);
   }
   emit(t, e) {
-    var s;
+    var n;
     const i = {
       type: t,
       data: e,
       timestamp: Date.now()
     };
-    (s = this.eventListeners.get(t)) == null || s.forEach((n) => {
-      n(i);
+    (n = this.eventListeners.get(t)) == null || n.forEach((s) => {
+      s(i);
     });
   }
   destroy() {
     this.hls && (this.hls.destroy(), this.hls = null), this.uiController.destroy(), this.videoElement.remove(), this.eventListeners.clear(), this.analytics.destroy();
   }
 }
+class G {
+  constructor(t) {
+    o(this, "file");
+    o(this, "videoElement", null);
+    o(this, "info", null);
+    if (!this.isVideoFile(t))
+      throw new Error(`Invalid file type: ${t.type}. Expected a video file.`);
+    this.file = t;
+  }
+  /**
+   * Check if the file is a valid video file
+   */
+  isVideoFile(t) {
+    if (t.type.startsWith("video/"))
+      return !0;
+    const e = [".mp4", ".webm", ".ogg", ".mov", ".avi", ".mkv", ".flv", ".wmv", ".m4v", ".3gp", ".ts", ".m3u8"], i = t.name.toLowerCase();
+    return e.some((n) => i.endsWith(n));
+  }
+  /**
+   * Extract video metadata
+   */
+  async extract() {
+    return new Promise((t, e) => {
+      try {
+        this.videoElement = document.createElement("video"), this.videoElement.preload = "metadata", this.videoElement.muted = !0;
+        const i = URL.createObjectURL(this.file);
+        this.videoElement.onloadedmetadata = () => {
+          try {
+            if (!this.videoElement) {
+              e(new Error("Video element not initialized"));
+              return;
+            }
+            const n = this.videoElement.videoWidth, s = this.videoElement.videoHeight, r = this.videoElement.duration, a = this.calculateAspectRatio(n, s), l = this.file.size, u = this.formatBytes(l), m = this.formatDuration(r), g = this.getFileExtension(this.file.name), v = r > 0 ? Math.round(l * 8 / r / 1e3) : void 0;
+            this.info = {
+              width: n,
+              height: s,
+              aspectRatio: a,
+              size: l,
+              sizeInBytes: l,
+              // raw value alias
+              sizeFormatted: u,
+              duration: r,
+              durationInSeconds: r,
+              // raw value alias
+              durationFormatted: m,
+              mimeType: this.file.type || "video/unknown",
+              fileName: this.file.name,
+              fileExtension: g,
+              bitrate: v
+            }, URL.revokeObjectURL(i), this.videoElement.remove(), t(this.info);
+          } catch (n) {
+            URL.revokeObjectURL(i), e(n);
+          }
+        }, this.videoElement.onerror = () => {
+          URL.revokeObjectURL(i), e(new Error(`Failed to load video file: ${this.file.name}`));
+        }, this.videoElement.src = i;
+      } catch (i) {
+        e(i);
+      }
+    });
+  }
+  /**
+   * Calculate aspect ratio (e.g., "16:9", "4:3")
+   */
+  calculateAspectRatio(t, e) {
+    const i = this.getGCD(t, e), n = t / i, s = e / i, r = n / s;
+    return Math.abs(r - 16 / 9) < 0.01 ? "16:9" : Math.abs(r - 4 / 3) < 0.01 ? "4:3" : Math.abs(r - 21 / 9) < 0.01 ? "21:9" : Math.abs(r - 1) < 0.01 ? "1:1" : `${n}:${s}`;
+  }
+  /**
+   * Get Greatest Common Divisor
+   */
+  getGCD(t, e) {
+    return e === 0 ? t : this.getGCD(e, t % e);
+  }
+  /**
+   * Format bytes to human-readable size
+   */
+  formatBytes(t) {
+    if (t === 0) return "0 Bytes";
+    const e = 1024, i = ["Bytes", "KB", "MB", "GB", "TB"], n = Math.floor(Math.log(t) / Math.log(e));
+    return `${parseFloat((t / Math.pow(e, n)).toFixed(2))} ${i[n]}`;
+  }
+  /**
+   * Format duration to HH:MM:SS
+   */
+  formatDuration(t) {
+    if (!isFinite(t) || t < 0) return "00:00";
+    const e = Math.floor(t / 3600), i = Math.floor(t % 3600 / 60), n = Math.floor(t % 60);
+    return e > 0 ? `${e.toString().padStart(2, "0")}:${i.toString().padStart(2, "0")}:${n.toString().padStart(2, "0")}` : `${i.toString().padStart(2, "0")}:${n.toString().padStart(2, "0")}`;
+  }
+  /**
+   * Get file extension
+   */
+  getFileExtension(t) {
+    const e = t.split(".");
+    return e.length > 1 ? `.${e[e.length - 1].toLowerCase()}` : "";
+  }
+  // Getter properties for convenience
+  get width() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.width) || 0;
+  }
+  get height() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.height) || 0;
+  }
+  get aspectRatio() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.aspectRatio) || "unknown";
+  }
+  get size() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.size) || 0;
+  }
+  get sizeInBytes() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.sizeInBytes) || 0;
+  }
+  get sizeFormatted() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.sizeFormatted) || "0 Bytes";
+  }
+  get duration() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.duration) || 0;
+  }
+  get durationInSeconds() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.durationInSeconds) || 0;
+  }
+  get durationFormatted() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.durationFormatted) || "00:00";
+  }
+  get mimeType() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.mimeType) || this.file.type || "video/unknown";
+  }
+  get fileName() {
+    return this.file.name;
+  }
+  get fileExtension() {
+    var t;
+    return ((t = this.info) == null ? void 0 : t.fileExtension) || "";
+  }
+  get bitrate() {
+    var t;
+    return (t = this.info) == null ? void 0 : t.bitrate;
+  }
+  get quality() {
+    if (!this.info) return "unknown";
+    const t = this.info.height;
+    return t >= 2160 ? "4K (2160p)" : t >= 1440 ? "2K (1440p)" : t >= 1080 ? "Full HD (1080p)" : t >= 720 ? "HD (720p)" : t >= 480 ? "SD (480p)" : t >= 360 ? "360p" : "Low Quality";
+  }
+  /**
+   * Get all information as object
+   */
+  getInfo() {
+    return this.info;
+  }
+  /**
+   * Clean up resources
+   */
+  destroy() {
+    this.videoElement && (this.videoElement.remove(), this.videoElement = null), this.info = null;
+  }
+}
 const K = (c) => {
   const {
     src: t,
     autoplay: e,
     muted: i,
-    controls: s = !0,
-    poster: n,
-    preload: a,
-    theme: o,
+    controls: n = !0,
+    poster: s,
+    preload: r,
+    theme: a,
     s3Config: l,
     analytics: u,
     hlsConfig: m,
-    subtitles: $,
-    stickyControls: z,
-    onReady: k,
-    onPlay: E,
-    onPause: x,
-    onEnded: S,
-    onTimeUpdate: C,
-    onVolumeChange: L,
-    onError: T,
+    subtitles: g,
+    stickyControls: v,
+    onReady: x,
+    onPlay: S,
+    onPause: C,
+    onEnded: L,
+    onTimeUpdate: T,
+    onVolumeChange: I,
+    onError: M,
     onLoadedMetadata: q,
     onQualityChange: P,
     style: U,
-    className: H,
-    width: g = "100%",
-    height: v = "500px"
-  } = c, w = y(null), I = y(null);
-  return f(() => {
-    if (!w.current) return;
-    const D = {
+    className: D,
+    width: f = "100%",
+    height: w = "500px"
+  } = c, y = b(null), B = b(null);
+  return E(() => {
+    if (!y.current) return;
+    const H = {
       src: t,
-      container: w.current,
+      container: y.current,
       autoplay: e,
       muted: i,
-      controls: s,
-      poster: n,
-      preload: a,
-      theme: o,
+      controls: n,
+      poster: s,
+      preload: r,
+      theme: a,
       s3Config: l,
       analytics: u,
       hlsConfig: m,
-      subtitles: $,
-      stickyControls: z
-    }, d = new A(D);
-    return I.current = d, E && d.on("play", E), x && d.on("pause", x), S && d.on("ended", S), T && d.on("error", (h) => {
-      var M;
-      return T((M = h.data) == null ? void 0 : M.error);
-    }), q && d.on("loadedmetadata", q), P && d.on("qualitychange", (h) => P(h.data.level)), C && d.on("timeupdate", (h) => C(h.data.currentTime)), L && d.on("volumechange", (h) => L(h.data.volume, h.data.muted)), k && k(d), () => {
-      d.destroy(), I.current = null;
+      subtitles: g,
+      stickyControls: v
+    }, d = new A(H);
+    return B.current = d, S && d.on("play", S), C && d.on("pause", C), L && d.on("ended", L), M && d.on("error", (h) => {
+      var R;
+      return M((R = h.data) == null ? void 0 : R.error);
+    }), q && d.on("loadedmetadata", q), P && d.on("qualitychange", (h) => P(h.data.level)), T && d.on("timeupdate", (h) => T(h.data.currentTime)), I && d.on("volumechange", (h) => I(h.data.volume, h.data.muted)), x && x(d), () => {
+      d.destroy(), B.current = null;
     };
-  }, [t]), /* @__PURE__ */ B(
+  }, [t]), /* @__PURE__ */ F(
     "div",
     {
-      ref: w,
-      className: H,
+      ref: y,
+      className: D,
       style: {
-        width: typeof g == "number" ? `${g}px` : g,
-        height: typeof v == "number" ? `${v}px` : v,
+        width: typeof f == "number" ? `${f}px` : f,
+        height: typeof w == "number" ? `${w}px` : w,
         ...U
       }
     }
   );
-}, G = (c) => {
-  const [t, e] = b(null), [i, s] = b(null), n = y(null);
-  return f(() => {
-    if (!n.current) return;
-    const a = new A({
+}, J = (c) => {
+  const [t, e] = k(null), [i, n] = k(null), s = b(null);
+  return E(() => {
+    if (!s.current) return;
+    const r = new A({
       ...c,
-      container: n.current
+      container: s.current
     });
-    e(a);
-    const o = () => {
-      s(a.getState());
+    e(r);
+    const a = () => {
+      n(r.getState());
     };
-    return a.on("play", o), a.on("pause", o), a.on("timeupdate", o), a.on("volumechange", o), a.on("loadedmetadata", o), () => {
-      a.destroy();
+    return r.on("play", a), r.on("pause", a), r.on("timeupdate", a), r.on("volumechange", a), r.on("loadedmetadata", a), () => {
+      r.destroy();
     };
   }, [c.src]), {
-    containerRef: n,
+    containerRef: s,
     player: t,
     state: i
   };
-}, F = R.createContext({
+}, z = $.createContext({
   player: null,
   state: null
-}), J = (c) => {
-  const { player: t, children: e } = c, [i, s] = b(t.getState());
-  return f(() => {
-    const n = () => {
-      s(t.getState());
+}), Z = (c) => {
+  const { player: t, children: e } = c, [i, n] = k(t.getState());
+  return E(() => {
+    const s = () => {
+      n(t.getState());
     };
-    return t.on("play", n), t.on("pause", n), t.on("timeupdate", n), t.on("volumechange", n), t.on("loadedmetadata", n), () => {
+    return t.on("play", s), t.on("pause", s), t.on("timeupdate", s), t.on("volumechange", s), t.on("loadedmetadata", s), () => {
     };
-  }, [t]), /* @__PURE__ */ B(F.Provider, { value: { player: t, state: i }, children: e });
-}, Z = () => {
-  const c = R.useContext(F);
+  }, [t]), /* @__PURE__ */ F(z.Provider, { value: { player: t, state: i }, children: e });
+}, tt = () => {
+  const c = $.useContext(z);
   if (!c.player)
     throw new Error("useWontumPlayerContext must be used within WontumPlayerProvider");
   return c;
 };
 export {
-  _ as Analytics,
-  j as S3Handler,
-  Q as UIController,
+  W as Analytics,
+  Q as S3Handler,
+  j as UIController,
+  G as WontumFileInfo,
   A as WontumPlayer,
-  J as WontumPlayerProvider,
+  Z as WontumPlayerProvider,
   K as WontumPlayerReact,
-  G as useWontumPlayer,
-  Z as useWontumPlayerContext
+  J as useWontumPlayer,
+  tt as useWontumPlayerContext
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@obipascal/player",
-	"version": "1.0.7",
+	"version": "1.0.8",
 	"description": "A modern HLS video player SDK for educational platforms with S3 integration",
 	"main": "dist/wontum-player.cjs.js",
 	"module": "dist/wontum-player.esm.js",