React Native Video Types

react-native-video-types.ts

// This documents most of the types available in react-native-video when rendering a player

// To use these types, can inject as follows
import RNVideo from 'react-native-video';
const Video = RNVideo as unknown as React.JSXElementConstructor<VideoProps>;
// ...Now use 'Video' as your react-native-video component, and you'll get the props.

// these below types were organized in 2020, so there may be new types available now in react-native-video

// The types are below:
import { Ref } from "react";
import { ViewProps, ImageResizeMode } from "react-native";
import RNVideo from 'react-native-video';

enum DRMType {
  WIDEVINE = "widevine",
  PLAYREADY = "playready",
  CLEARKEY = "clearkey",
  FAIRPLAY = "fairplay",
}
export type DRMProp = {
  type: DRMType;
  licenseServer: string;
  headers: { [s: string]: number | string };
  base64Certificate: boolean;
  certificateUrl: string;
  getLicense: (spcBase64: string, contentId: string, licenseUrl: string) => string;
};

export enum TextTrackType {
  SRT = "application/x-subrip",
  TTML = "application/ttml+xml",
  VTT = "text/vtt",
  CEA = "application/cea-608",
}

export type BandwidthEvent = {
  bitrate: number;
};

export type SeekEvent = {
  currentTime: number;
  seekTime: number;
};
type IOSError = {
  code: number;
  domain: string;
  localizedDescription: string;
  localizedFailureReason: string;
  localizedRecoverySuggestion: string;
};

type AndroidError = {
  errorString: string;
  errorException: string;
  localizedDescription?: string;
};
export type VideoError = {
  error: IOSError | AndroidError;
  target?: number;
};

export type TimedMetadata = { value: string; identifier: string };
export type VideoProps = {
  source: { uri: string; type?: string; workoutID?: string };
  ref: Ref<RNVideo>;
  onAudioBecomingNoisy?: () => void;
  onBandwidthUpdate?: (e: BandwidthEvent) => void;
  onEnd?: (e?: any) => void;
  onExternalPlaybackChange?: (e?: { isExternalPlaybackActive: boolean }) => void;
  onFullscreenPlayerWillPresent?: (e?: any) => void;
  onFullscreenPlayerDidPresent?: (e?: any) => void;
  onFullscreenPlayerWillDismiss?: (e?: any) => void;
  onFullscreenPlayerDidDismiss?: (e?: any) => void;
  onLoad?: (e: VideoLoadEvent) => void;
  // seek: {
  //   time: number;
  //   tolerance: number;
  // };
  onLoadStart?: (e?: any) => void;
  onReadyForDisplay?: (e?: any) => void;
  onPictureInPictureStatusChanged?: (e?: { isActive: boolean }) => void;
  onPlaybackRateChange?: (e?: { playbackRate: number }) => void;
  onProgress?: (e?: any) => void;
  onSeek?: (e?: SeekEvent) => void;
  onRestoreUserInterfaceForPictureInPictureStop?: () => void;
  onAudioFocusChanged?: (e: { hasAudioFocus: boolean }) => void;
  volume?: number;
  paused: boolean;
  width: number;
  height: number;
  progressUpdateInterval?: number;
  onBuffer?: (e: { isBuffering: boolean }) => void;
  onTimedMetadata?: (e: TimedMetadata[]) => void;
  onError?: (params: VideoError) => void;
  onPlaybackStalled?: () => void;
  onPlaybackResume?: () => void;
  currentPlaybackTime?: number;
  allowsExternalPlayback?: boolean;
  pictureInPicture: boolean;
  bufferConfig?: {
    minBufferMs?: number;
    maxBufferMs?: number;
    bufferForPlaybackMs?: number;
    bufferForPlaybackAfterRebufferMs?: number;
  };
  selectedAudioTrack?: {
    type: TrackPreferenceType;
    value: string | number;
  };
  selectedVideoTrack?: {
    type: VideoTrackPreferenceType;
    value?: string | number;
  };
  selectedTextTrack?: {
    type: TrackPreferenceType;
    value?: string | number;
  };
  textTracks?: {
    title: string;
    uri: string;
    type: TextTrackType;
    language: string;
  }[];
  resizeMode?: ImageResizeMode;
  poster?: string;
  posterResizeMode?: ImageResizeMode;
  audioOnly?: boolean;
  drm?: DRMProp;
  disableFocus?: boolean;
  hideShutterView?: boolean;
  ignoreSilentSwitch: "inherit" | "ignore" | "obey";
  maxBitRate?: number;
  minLoadRetryCount?: number;
  mixWithOthers?: number;
  muted?: number;
  playInBackground?: boolean;
  playWhenInactive?: boolean;
  preferredForwardBufferDuration?: boolean;

};
export type State = {
  showPoster: boolean;
};
type VideoTrackPreferenceType = "auto" | "disabled" | "resolution" | "index";
type TrackPreferenceType = "title" | "index" | "disabled" | "language";
export type TextTrack = {
  language: "" | "en";
  type: TextTrackType;
  title: string;
  index: number;
};
export type VideoTrack = {
  codecs: string;
  trackId: string;
  bitrate: number;
  height: number;
  width: number;
};
export type AudioTrack = {
  language: "en" | string;
  type: "audio/mp4a-latm" | string;
  title: string;
  //Some tracks have string for bitrate:
  bitrate: string | number;
};

export type VideoLoadEvent = {
  trackId: string;
  duration: number;
  canStepBackward: boolean;
  canPlaySlowReverse: boolean;
  canPlaySlowForward: boolean;
  canPlayReverse: boolean;
  canStepForward: boolean;
  canPlayFastForward: boolean;
  naturalSize: {
    width: number;
    height: number;
    orientation: "landscape" | "portrait" | null;
  };
  textTracks: TextTrack[];
  videoTracks: VideoTrack[];
  audioTracks: AudioTrack[];
  currentTime: number;
  title: string;
};

export type LoadStartEvent = {
  isNetwork: boolean;
  type: string;
  uri: string;
};

export type ProgressEvent = {
  currentTime: number;
  playableDuration: number;
  seekableDuration: number;
};

export type LicenseEvent = {
  spcBase64: string;
  contentId: string;
  licenseUrl: string;
};