Controls

This exports the bundled player controls as individual components. The following will reproduce the default layout of controls:

import {Controls, Player} from "liqvid";

const controls = <>
  <Controls.PlayPause/>
  <Controls.Volume/>
  <Controls.TimeDisplay/>

  <div className="lv-controls-right">
    <Controls.Settings/>
    <Controls.FullScreen/>
  </div>
</>;

<Player controls={controls}>
{/* ... */}
</Player>

<FullScreen>

Toggle fullscreen.

<PlayPause>

Play/pause the video.

<Settings>

Controls playback rate.

<TimeDisplay>

Displays the current time and total duration of the video.

<Volume>

Adjust the volume.