Initial commit: modern React video player library

Add all source files for a feature-rich, reusable video player built with React, TypeScript, and Vite. Includes core components, context, hooks, utilities, styles, demo app, and configuration files.

src/types/index.ts

@@ -0,0 +1,123 @@
+export interface SubtitleTrack {
+  src: string
+  lang: string
+  label: string
+  default?: boolean
+}
+
+export interface AudioTrack {
+  name: string
+  language: string
+  url: string
+  groupId: string
+  default?: boolean
+  autoselect?: boolean
+}
+
+export interface VideoQuality {
+  height: number
+  label: string
+  url?: string
+}
+
+export interface PlayerTheme {
+  primaryColor?: string
+  accentColor?: string
+  backgroundColor?: string
+  textColor?: string
+}
+
+export interface VideoPlayerProps {
+  src: string
+  poster?: string
+  autoplay?: boolean
+  loop?: boolean
+  muted?: boolean
+  controls?: boolean
+  subtitles?: SubtitleTrack[]
+  theme?: PlayerTheme
+  keyboardShortcuts?: boolean
+  pictureInPicture?: boolean
+  className?: string
+  style?: React.CSSProperties
+  onPlay?: () => void
+  onPause?: () => void
+  onEnded?: () => void
+  onTimeUpdate?: (currentTime: number) => void
+  onVolumeChange?: (volume: number) => void
+  onError?: (error: Error) => void
+  onLoadedMetadata?: () => void
+  onSeeking?: () => void
+  onSeeked?: () => void
+}
+
+export interface VideoState {
+  playing: boolean
+  currentTime: number
+  duration: number
+  buffered: number
+  volume: number
+  muted: boolean
+  playbackRate: number
+  fullscreen: boolean
+  pictureInPicture: boolean
+  loading: boolean
+  error: Error | null
+  seeking: boolean
+}
+
+export interface UIState {
+  controlsVisible: boolean
+  settingsOpen: boolean
+  volumeControlOpen: boolean
+  qualityMenuOpen: boolean
+  subtitleMenuOpen: boolean
+}
+
+export interface PlayerSettings {
+  quality: VideoQuality | null
+  subtitle: SubtitleTrack | null
+  audioTrack: AudioTrack | null
+  playbackRate: number
+}
+
+export interface PlayerContextValue {
+  videoState: VideoState
+  uiState: UIState
+  settings: PlayerSettings
+  videoRef: React.RefObject<HTMLVideoElement>
+  containerRef: React.RefObject<HTMLDivElement>
+
+  // Video controls
+  play: () => void
+  pause: () => void
+  togglePlay: () => void
+  seek: (time: number) => void
+  setVolume: (volume: number) => void
+  toggleMute: () => void
+  setPlaybackRate: (rate: number) => void
+
+  // Fullscreen & PIP
+  toggleFullscreen: () => void
+  togglePictureInPicture: () => void
+
+  // UI controls
+  showControls: () => void
+  hideControls: () => void
+  toggleSettings: () => void
+
+  // Settings
+  setQuality: (quality: VideoQuality) => void
+  setSubtitle: (subtitle: SubtitleTrack | null) => void
+  setAudioTrack: (audioTrack: AudioTrack | null) => void
+}
+
+export type GestureType = 'tap' | 'doubleTap' | 'swipe'
+export type SwipeDirection = 'up' | 'down' | 'left' | 'right'
+
+export interface GestureEvent {
+  type: GestureType
+  direction?: SwipeDirection
+  x: number
+  y: number
+}