// Type definitions for agate/MediaPlayer

import * as React from "react";
import { SlottableProps as ui_Slottable_SlottableProps } from "@enact/ui/Slottable";
import { SkinnableProps as agate_Skinnable_SkinnableProps } from "@enact/agate/Skinnable";

type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
type Merge<M, N> = Omit<M, Extract<keyof M, keyof N>> & N;

export interface MediaPlayerBaseProps {
  /**
 * Any children  `<source>`  tag elements will be sent directly to the media element as
sources.
 */
  source?: React.ReactNode;
  /**
   * The current time in seconds of the media source.
   */
  currentTime?: number;
  /**
 * The current locale as a
  .
 */
  locale?: string;
  /**
   * `true`  when the media loops.
   */
  loop?: boolean;
  /**
 * Media component to use.
 * 
 * The default ( `'video'` ) renders an  `HTMLVideoElement` . Custom media components must have
a similar API structure, exposing the following APIs:
 * 
 * Methods:
 * *  `load()`  - load media
 */
  mediaComponent?: string | React.ComponentType;
  /**
   * Function that generates a reference to the current loaded media
   */
  mediaRef?: Function;
  /**
   * Called when position of media slider is changed.
   */
  onChange?: Function;
  /**
   * Called when the media file reaches the end of its duration.
   */
  onEnded?: Function;
  /**
   * Called when jumping to next media
   */
  onNext?: Function;
  /**
   * Called when media is paused
   */
  onPause?: Function;
  /**
   * Called when media is played
   */
  onPlay?: Function;
  /**
   * Called when jumping to previous media
   */
  onPrevious?: Function;
  /**
   * Called when media is on repeat.
   */
  onRepeat?: Function;
  /**
   * Called when jumping to a random media
   */
  onShuffle?: Function;
  /**
   * Called when media is updating.
   */
  onUpdate?: Function;
  /**
   * The media pause state.
   */
  paused?: boolean;
  /**
   * The current list of media.
   */
  playlist?: Array<any>;
  /**
   * Proportion of media file played.
   */
  proportionPlayed?: number;
  /**
   * The repeat mode of the media playlist.
   */
  repeat?: "none" | "one" | "all";
  /**
   * `true`  when the media playlist is shuffled.
   */
  shuffle?: boolean;
  /**
   * The index of the current played media.
   */
  sourceIndex?: number;
  /**
   * The total time (duration) in seconds of the loaded media source.
   */
  total?: number;
}
/**
 * A player for media   .
 */

export class MediaPlayerBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, MediaPlayerBaseProps>
> {
  /**
 * Returns an object with the current state of the media including  `currentTime` ,  `duration` ,
 `paused`  and  `loop`
 */
  getMediaState(): object;
  /**
   * Programmatically plays the current media.
   */
  play(): void;
  /**
   * Programmatically plays the current media.
   */
  pause(): void;
  /**
   * Programmatically sets the loop property of the media.
   */
  handleOnRepeat(): void;
}

export interface MediaPlayerDecoratorProps
  extends Merge<ui_Slottable_SlottableProps, agate_Skinnable_SkinnableProps> {}
export function MediaPlayerDecorator<P>(
  Component: React.ComponentType<P> | string
): React.ComponentType<P & MediaPlayerDecoratorProps>;

export interface MediaPlayerProps
  extends Merge<MediaPlayerBaseProps, MediaPlayerDecoratorProps> {}
/**
 * An Agate-styled  `MediaPlayer`  component.
 * 
 * Usage:
 * ```
<MediaPlayer>
  <source src={['https://sampleswap.org/mp3/artist/254731/BossPlayer_Your-Right-Here-160.mp3']} type='audio/mp3' />
</MediaPlayer>
```
 */

export class MediaPlayer extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, MediaPlayerProps>
> {}

export default MediaPlayer;
