react-native-video-player/lib/module/controls/Controls.js

A <VideoPlayer /> component for React Native with controls

"use strict";

import { forwardRef, useImperativeHandle, useRef } from 'react';
import { DurationText } from "./Duration.js";
import { Seekbar } from "./Seekbar.js";
import { PlayButton } from "./PlayButton.js";
import { Mute } from "./Mute.js";
import { Fullscreen } from "./Fullscreen.js";
import { AnimatedWrapper } from "./ControlsAnimatedWrapper.js";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export const Controls = /*#__PURE__*/forwardRef(({
  customStyles,
  onPlayPress,
  isPlaying,
  showDuration,
  onToggleFullScreen,
  duration,
  disableFullscreen,
  onMutePress,
  isMuted,
  animationDuration,
  controlsTimeoutId,
  isControlsVisible,
  ...seekbarProps
}, ref) => {
  const durationRef = useRef(null);
  const seekbarRef = useRef(null);
  const animationRef = useRef(null);
  useImperativeHandle(ref, () => ({
    onProgress: progress => {
      durationRef.current?.onProgress(progress);
      seekbarRef.current?.onProgress(progress);
    },
    runControlsAnimation: (toValue, callback) => {
      animationRef.current?.runControlsAnimation(toValue, callback);
    }
  }));
  if (!isControlsVisible) {
    return /*#__PURE__*/_jsx(Seekbar, {
      fullWidth: true,
      ref: seekbarRef,
      ...seekbarProps,
      onSeeking: progress => durationRef.current?.onProgress(progress),
      isPlaying: isPlaying,
      controlsTimeoutId: controlsTimeoutId,
      duration: duration,
      seekBarBackgroundCustomStyles: customStyles?.seekBarBackground,
      seekBarCustomStyles: customStyles?.seekBar,
      seekBarFullWidthCustomStyles: customStyles?.seekBarFullWidth,
      seekBarKnobCustomStyles: customStyles?.seekBarKnob,
      seekBarKnobSeekingCustomStyles: customStyles?.seekBarKnobSeeking,
      seekBarProgressCustomStyles: customStyles?.seekBarProgress
    });
  }
  return /*#__PURE__*/_jsxs(AnimatedWrapper, {
    ref: animationRef,
    animationDuration: animationDuration,
    customStylesControls: customStyles?.controls,
    children: [/*#__PURE__*/_jsx(PlayButton, {
      controlButtonCustomStyles: customStyles?.controlButton,
      playControlCustomStyles: customStyles?.playControl,
      isPlaying: isPlaying,
      onPlayPress: onPlayPress
    }), /*#__PURE__*/_jsx(Seekbar, {
      fullWidth: !isControlsVisible,
      ref: seekbarRef,
      ...seekbarProps,
      onSeeking: progress => durationRef.current?.onProgress(progress),
      isPlaying: isPlaying,
      controlsTimeoutId: controlsTimeoutId,
      duration: duration,
      seekBarBackgroundCustomStyles: customStyles?.seekBarBackground,
      seekBarCustomStyles: customStyles?.seekBar,
      seekBarFullWidthCustomStyles: customStyles?.seekBarFullWidth,
      seekBarKnobCustomStyles: customStyles?.seekBarKnob,
      seekBarKnobSeekingCustomStyles: customStyles?.seekBarKnobSeeking,
      seekBarProgressCustomStyles: customStyles?.seekBarProgress
    }), showDuration && /*#__PURE__*/_jsx(DurationText, {
      ref: durationRef,
      duration: duration,
      durationTextCustomStyles: customStyles?.durationText
    }), /*#__PURE__*/_jsx(Mute, {
      controlButtonCustomStyles: customStyles?.controlButton,
      controlIconCustomStyles: customStyles?.controlIcon,
      isMuted: isMuted,
      onMutePress: onMutePress
    }), !disableFullscreen && /*#__PURE__*/_jsx(Fullscreen, {
      onToggleFullScreen: onToggleFullScreen,
      controlButtonCustomStyles: customStyles?.controlButton,
      controlIconCustomStyles: customStyles?.controlIcon
    })]
  });
});
//# sourceMappingURL=Controls.js.map