@cloud-app-dev/vidc 3.0.16 → 3.0.18

package/es/Player/timeline.js

@@ -10,10 +10,11 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import useBarStatus from './contraller_bar/useBarStatus';
+import { useVideoEvent } from './event';
 import "./style/timeline.css";
-export function useTimes(api, event, isHide) {
+export function useTimes(api, event, isFpsPlay) {
   var _useState = useState({
     currentTime: 0,
     buffered: 0
@@ -22,46 +23,34 @@ export function useTimes(api, event, isHide) {
       state = _useState2[0],
       setState = _useState2[1];
 
-  useEffect(function () {
-    if (isHide) {
-      return undefined;
-    }
-
-    var getCurrentTime = function getCurrentTime() {
-      return setState(function (old) {
-        return Object.assign(Object.assign({}, old), {
-          currentTime: api.getCurrentTime(),
-          buffered: api.getSecondsLoaded()
-        });
+  var getCurrentTime = function getCurrentTime() {
+    return setState(function (old) {
+      return Object.assign(Object.assign({}, old), {
+        currentTime: api.getCurrentTime(),
+        buffered: api.getSecondsLoaded()
       });
-    };
+    });
+  };
 
-    var getBuffered = function getBuffered() {
-      return setState(function (old) {
-        return Object.assign(Object.assign({}, old), {
-          buffered: api.getSecondsLoaded()
-        });
+  var getBuffered = function getBuffered() {
+    return setState(function (old) {
+      return Object.assign(Object.assign({}, old), {
+        buffered: api.getSecondsLoaded()
       });
-    };
+    });
+  };
 
-    var seekendPlay = function seekendPlay() {
-      return api.play();
-    };
+  var seekendPlay = function seekendPlay() {
+    return !isFpsPlay && api.play();
+  };
 
-    event.addEventListener('timeupdate', getCurrentTime);
-    event.addEventListener('progress', getBuffered);
-    event.addEventListener('suspend', getBuffered);
-    event.addEventListener('seeked', seekendPlay);
-    return function () {
-      event.removeEventListener('timeupdate', getCurrentTime);
-      event.removeEventListener('progress', getBuffered);
-      event.removeEventListener('suspend', getBuffered);
-      event.removeEventListener('seeked', seekendPlay);
-    };
-  }, [event, api, isHide]);
+  useVideoEvent('timeupdate', getCurrentTime);
+  useVideoEvent('progress', getBuffered);
+  useVideoEvent('suspend', getBuffered);
+  useVideoEvent('seeked', seekendPlay);
   return useMemo(function () {
     return [state.currentTime, state.buffered, api.getDuration()];
-  }, [state.currentTime, state.buffered]);
+  }, [state.currentTime, state.buffered, api]);
 }
 
 function TimeLine(_ref) {
@@ -77,10 +66,10 @@ function TimeLine(_ref) {
 
   var playPercent = useMemo(function () {
     return currentTime / duration * 100;
-  }, [currentTime]);
+  }, [currentTime, duration]);
   var bufferedPercent = useMemo(function () {
     return buffered / duration * 100;
-  }, [buffered]);
+  }, [buffered, duration]);
   var seekWithLine = useCallback(function (e) {
     var rect = e.currentTarget.getBoundingClientRect();
     var current = e.pageX - rect.left;

package/es/Player/util.d.ts

@@ -7,7 +7,7 @@ import type { FlvPlayerConfig } from './player';
  * @param {*} video
  * @param {*} URL
  */
-export declare function createHlsPlayer(video: HTMLVideoElement, url: string, hlsConfig: HlsConfig): Hls;
+export declare function createHlsPlayer(video: HTMLVideoElement, url: string, isLive: boolean, hlsConfig: HlsConfig): Hls;
 /**
  * 创建FLV对象
  * @param {*} video

package/es/Player/util.js

@@ -12,16 +12,13 @@ import Events from './event/eventName';
  * @param {*} URL
  */
 
-export function createHlsPlayer(video, url, hlsConfig) {
+export function createHlsPlayer(video, url, isLive, hlsConfig) {
   if (!Hls.isSupported()) {
     return undefined;
   }
 
   var player = new Hls(Object.assign({
-    liveDurationInfinity: true,
-    fragLoadingMaxRetry: 0,
-    manifestLoadingMaxRetry: 0,
-    levelLoadingMaxRetry: 0,
+    liveDurationInfinity: isLive,
     enableWorker: true
   }, hlsConfig));
   player.loadSource(url);

package/es/ScreenPlayer/Live.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { ILivePlayerProps } from './interface';
 import './index.less';
-declare function LivePlayer({ list, children, onIndexChange, onClose, onCloseAll, snapshot, defaultScreen, screenChange, defaultSelectIndex, ...options }: ILivePlayerProps): JSX.Element;
+declare function LivePlayer({ list, children, onIndexChange, onClose, onCloseAll, snapshot, defaultScreen, screenChange, defaultSelectIndex, oneWinExtTools, allWinExtTools, ...options }: ILivePlayerProps): JSX.Element;
 declare namespace LivePlayer {
     var defaultProps: {
         list: any[];

package/es/ScreenPlayer/Live.js

@@ -38,7 +38,9 @@ function LivePlayer(_a) {
       defaultScreen = _a.defaultScreen,
       screenChange = _a.screenChange,
       defaultSelectIndex = _a.defaultSelectIndex,
-      options = __rest(_a, ["list", "children", "onIndexChange", "onClose", "onCloseAll", "snapshot", "defaultScreen", "screenChange", "defaultSelectIndex"]);
+      oneWinExtTools = _a.oneWinExtTools,
+      allWinExtTools = _a.allWinExtTools,
+      options = __rest(_a, ["list", "children", "onIndexChange", "onClose", "onCloseAll", "snapshot", "defaultScreen", "screenChange", "defaultSelectIndex", "oneWinExtTools", "allWinExtTools"]);
 
   var _useState = useState({
     screenNum: defaultScreen !== null && defaultScreen !== void 0 ? defaultScreen : 4,
@@ -155,7 +157,6 @@ function LivePlayer(_a) {
 
     return /*#__PURE__*/React.createElement(LivePlayerWithExt, Object.assign({}, item, {
       mode: (_a = item.mode) !== null && _a !== void 0 ? _a : state.modes[index],
-      isLive: true,
       key: "".concat(item.url, "-").concat(index),
       updatePlayer: function updatePlayer(player) {
         return playerRef.current[index] = player;
@@ -184,7 +185,9 @@ function LivePlayer(_a) {
     mode: state.modes[state.selectIndex],
     containerRef: domRef,
     updateState: updateState,
-    snapshot: snapshot
+    snapshot: snapshot,
+    oneWinExtTools: oneWinExtTools,
+    allWinExtTools: allWinExtTools
   }), children && /*#__PURE__*/React.cloneElement(children, {
     selectIndex: state.selectIndex
   }));

package/es/ScreenPlayer/LiveTools.d.ts

@@ -16,6 +16,14 @@ interface IToolsProps {
     onCloseAll?: () => void;
     disabled: boolean;
     snapshot?: (base64?: string) => void;
+    /**
+     * 单窗口拓展工具条,左侧
+     */
+    oneWinExtTools?: JSX.Element;
+    /**
+     * 全局窗口工具条，右侧
+     */
+    allWinExtTools?: JSX.Element;
 }
-declare function LiveTools({ containerRef, updateState, screenNum, getPlayerItem, mode, toggleFit, fit, onClose, onCloseAll, disabled, snapshot }: IToolsProps): JSX.Element;
+declare function LiveTools({ containerRef, oneWinExtTools, allWinExtTools, updateState, screenNum, getPlayerItem, mode, toggleFit, fit, onClose, onCloseAll, disabled, snapshot, }: IToolsProps): JSX.Element;
 export default LiveTools;

package/es/ScreenPlayer/LiveTools.js

@@ -21,6 +21,8 @@ import useFullscreen from '../useFullscreen';
 
 function LiveTools(_ref) {
   var containerRef = _ref.containerRef,
+      oneWinExtTools = _ref.oneWinExtTools,
+      allWinExtTools = _ref.allWinExtTools,
       updateState = _ref.updateState,
       screenNum = _ref.screenNum,
       getPlayerItem = _ref.getPlayerItem,
@@ -71,7 +73,8 @@ function LiveTools(_ref) {
   return /*#__PURE__*/React.createElement("div", {
     className: "player-tools"
   }, /*#__PURE__*/React.createElement(DisableMark, {
-    disabled: disabled
+    disabled: disabled,
+    width: "70%"
   }, /*#__PURE__*/React.createElement("div", {
     className: "player-tools-left"
   }, /*#__PURE__*/React.createElement("span", {
@@ -120,7 +123,7 @@ function LiveTools(_ref) {
       position: 'relative',
       top: 1
     }
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), oneWinExtTools), /*#__PURE__*/React.createElement("div", {
     className: "player-tools-mid"
   }, /*#__PURE__*/React.createElement("div", {
     className: "player-tools-item",
@@ -147,7 +150,7 @@ function LiveTools(_ref) {
     title: "\u64AD\u653E"
   }))), /*#__PURE__*/React.createElement("div", {
     className: "player-tools-right"
-  }, /*#__PURE__*/React.createElement("span", {
+  }, allWinExtTools, /*#__PURE__*/React.createElement("span", {
     className: "player-tools-item",
     onClick: onCloseAll
   }, /*#__PURE__*/React.createElement(IconFont, {

package/es/ScreenPlayer/PlayerWithExt.d.ts

@@ -8,7 +8,7 @@ interface ILivePlayerWithExtProps extends ISinglePlayerProps {
     updatePlayer: (obj: React.MutableRefObject<ExportPlayerType>) => void;
     pluginDownloadUrl?: string;
 }
-export declare function LivePlayerWithExt({ mode, isLive, url, type, style, className, updatePlayer, onClick, pluginDownloadUrl, ...props }: ILivePlayerWithExtProps): JSX.Element;
+export declare function LivePlayerWithExt({ mode, url, type, style, className, updatePlayer, onClick, pluginDownloadUrl, ...props }: ILivePlayerWithExtProps): JSX.Element;
 interface ISegmentPlayerWithExtProps extends Omit<ILivePlayerWithExtProps, 'url'> {
     segments?: ISegmentType[];
     begin?: number;

package/es/ScreenPlayer/PlayerWithExt.js

@@ -24,7 +24,6 @@ export function LivePlayerWithExt(_a) {
   var _b;
 
   var mode = _a.mode,
-      isLive = _a.isLive,
       url = _a.url,
       type = _a.type,
       style = _a.style,
@@ -32,7 +31,7 @@ export function LivePlayerWithExt(_a) {
       updatePlayer = _a.updatePlayer,
       onClick = _a.onClick,
       pluginDownloadUrl = _a.pluginDownloadUrl,
-      props = __rest(_a, ["mode", "isLive", "url", "type", "style", "className", "updatePlayer", "onClick", "pluginDownloadUrl"]);
+      props = __rest(_a, ["mode", "url", "type", "style", "className", "updatePlayer", "onClick", "pluginDownloadUrl"]);
 
   var forceUpdate = _useUpdate();
 
@@ -59,7 +58,7 @@ export function LivePlayerWithExt(_a) {
   }, /*#__PURE__*/React.createElement(LivePlayer, Object.assign({}, props, {
     type: type,
     url: url,
-    isLive: isLive,
+    isLive: true,
     hideContrallerBar: true,
     onCanPlayerInit: update,
     ref: ref
@@ -101,7 +100,6 @@ export function SegmentPlayerWithExt(_a) {
   }, /*#__PURE__*/React.createElement(SegmentPlayer, Object.assign({}, props, {
     segments: segments,
     type: "hls",
-    isLive: false,
     hideContrallerBar: true,
     forwordRef: ref,
     begin: begin,

package/es/ScreenPlayer/Record.d.ts

@@ -6,5 +6,5 @@ import './index.less';
  * @param param0
  * @returns
  */
-declare function RecordPlayer({ list, children, queryRecord, onIndexChange, onClose, onCloseAll, download, snapshot, defaultScreen, screenChange, defaultSelectIndex, ...options }: IRecordPlayerProps): JSX.Element;
+declare function RecordPlayer({ list, children, queryRecord, onIndexChange, onClose, onCloseAll, download, snapshot, defaultScreen, screenChange, defaultSelectIndex, oneWinExtTools, allWinExtTools, ...options }: IRecordPlayerProps): JSX.Element;
 export default RecordPlayer;

package/es/ScreenPlayer/Record.js

@@ -67,7 +67,9 @@ function RecordPlayer(_a) {
       defaultScreen = _a.defaultScreen,
       screenChange = _a.screenChange,
       defaultSelectIndex = _a.defaultSelectIndex,
-      options = __rest(_a, ["list", "children", "queryRecord", "onIndexChange", "onClose", "onCloseAll", "download", "snapshot", "defaultScreen", "screenChange", "defaultSelectIndex"]);
+      oneWinExtTools = _a.oneWinExtTools,
+      allWinExtTools = _a.allWinExtTools,
+      options = __rest(_a, ["list", "children", "queryRecord", "onIndexChange", "onClose", "onCloseAll", "download", "snapshot", "defaultScreen", "screenChange", "defaultSelectIndex", "oneWinExtTools", "allWinExtTools"]);
 
   var _useState = useState(Object.assign(Object.assign({}, defaultState), {
     screenNum: defaultScreen !== null && defaultScreen !== void 0 ? defaultScreen : defaultState.screenNum
@@ -411,7 +413,8 @@ function RecordPlayer(_a) {
   })), /*#__PURE__*/React.createElement("div", {
     className: "player-tools-group"
   }, /*#__PURE__*/React.createElement(DisableMark, {
-    disabled: !segmentItem.cid
+    disabled: !segmentItem.cid,
+    width: "70%"
   }, /*#__PURE__*/React.createElement(RecordTools, {
     time: state.currentTimes[state.selectIndex],
     fit: fit,
@@ -426,12 +429,13 @@ function RecordPlayer(_a) {
     onCloseAll: onCloseAll,
     timeMode: state.timeMode,
     download: download,
-    snapshot: snapshot
+    snapshot: snapshot,
+    oneWinExtTools: oneWinExtTools,
+    allWinExtTools: allWinExtTools
   }), /*#__PURE__*/React.createElement(SegmentTimeLine, {
     begin: timeBegin,
     updateState: updateState,
     segments: segmentItem.segments,
-    key: state.selectIndex,
     onTimeChange: onTimeChange,
     timeMode: state.timeMode
   }))), children && /*#__PURE__*/React.cloneElement(children, {

package/es/ScreenPlayer/RecordTools.d.ts

@@ -20,6 +20,14 @@ interface IToolsProps {
     timeMode: number;
     download?: () => void;
     snapshot?: (base64: string) => void;
+    /**
+     * 单窗口拓展工具条,左侧
+     */
+    oneWinExtTools?: JSX.Element;
+    /**
+     * 全局窗口工具条，右侧
+     */
+    allWinExtTools?: JSX.Element;
 }
-declare function RecordTools({ containerRef, updateState, download, screenNum, timeMode, getPlayerItem, mode, toggleFit, fit, time, onTimeChange, onClose, onCloseAll, snapshot, }: IToolsProps): JSX.Element;
+declare function RecordTools({ containerRef, updateState, download, screenNum, timeMode, getPlayerItem, mode, toggleFit, fit, time, onTimeChange, onClose, onCloseAll, snapshot, oneWinExtTools, allWinExtTools, }: IToolsProps): JSX.Element;
 export default RecordTools;

package/es/ScreenPlayer/RecordTools.js

@@ -34,7 +34,9 @@ function RecordTools(_ref) {
       onTimeChange = _ref.onTimeChange,
       onClose = _ref.onClose,
       onCloseAll = _ref.onCloseAll,
-      snapshot = _ref.snapshot;
+      snapshot = _ref.snapshot,
+      oneWinExtTools = _ref.oneWinExtTools,
+      allWinExtTools = _ref.allWinExtTools;
 
   var _useFullscreen = useFullscreen(containerRef),
       _useFullscreen2 = _slicedToArray(_useFullscreen, 2),
@@ -114,7 +116,7 @@ function RecordTools(_ref) {
     },
     type: "lm-player-S_Device_shezhi",
     title: "\u5207\u6362".concat(mode === 1 ? '插件' : '浏览器', "\u6A21\u5F0F")
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), oneWinExtTools), /*#__PURE__*/React.createElement("div", {
     className: "player-tools-mid"
   }, /*#__PURE__*/React.createElement("div", {
     className: "player-tools-item",
@@ -148,7 +150,7 @@ function RecordTools(_ref) {
     title: "\u64AD\u653E"
   }))), /*#__PURE__*/React.createElement("div", {
     className: "player-tools-right"
-  }, /*#__PURE__*/React.createElement("span", {
+  }, allWinExtTools, /*#__PURE__*/React.createElement("span", {
     className: "player-tools-item",
     onClick: onCloseAll
   }, /*#__PURE__*/React.createElement(IconFont, {

package/es/ScreenPlayer/demo2.js

@@ -28,7 +28,7 @@ import RecordPlayer from './Record';
 import moment from 'moment';
 import Service from '../Service';
 import { completionSegments } from './utils';
-var token = "eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NSIsImV4dCI6MTY2MjI1ODMwNzUxNSwidWlkIjoiMTAxMDAwMDAwNjk5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTA1MTgsMTAwMDAwMTEwNzI4XSwidmFsaWRUaW1lIjoxNzA0MzgzOTk5MDAwLCJvcHRDZW50ZXJJZCI6IjEwMDEwMDAwMDIzMyIsInVzZXJUeXBlIjoxMDA3MDQsImlhdCI6MTY2MTk5OTEwNzUxNX0.uk_G3vqBCFqxQM2jbV6CSN-z9YNVt_cx5nWXkSuCOIA";
+var token = "eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NSIsImV4dCI6MTY2MzQwNTM5ODYzOCwidWlkIjoiMTAxMDAwMDAwNjk5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTA1MTgsMTAwMDAwMTEwNzI4XSwidmFsaWRUaW1lIjoxNzA0MzgzOTk5MDAwLCJvcHRDZW50ZXJJZCI6IjEwMDEwMDAwMDIzMyIsInVzZXJUeXBlIjoxMDA3MDQsImlhdCI6MTY2MzE0NjE5ODYzOH0.EPh_1eNPNFl-fmLODbHo0mu5R_1kKdt3UUu_0qfBGFY";
 var cids = ['538509097', '539172446'];
 
 var query = function query(_ref) {

package/es/ScreenPlayer/interface.d.ts

@@ -40,15 +40,40 @@ export interface IRecordPlayerProps {
    */
   download?: () => void;
 
+  /**
+   * 截图
+   */
   snapshot?: (base64: string) => void;
 
+  /**
+   * 窗口变化
+   */
   screenChange?: (num: number) => void;
 
+  /**
+   * 默认窗口数量
+   */
   defaultScreen?: 1 | 4 | 6 | 9 | 16;
 
+  /**
+   * 窗口数量，若有值数量将由外部控制
+   */
   screenNum?: 1 | 4 | 6 | 9 | 16;
 
+  /**
+   * 默认选中窗口
+   * @default 0
+   */
   defaultSelectIndex?: number;
+  /**
+   * 单窗口拓展工具条,左侧
+   */
+  oneWinExtTools?: JSX.Element;
+
+  /**
+   * 全局窗口工具条，右侧
+   */
+  allWinExtTools?: JSX.Element;
 }
 
 export interface IRecordPlayerState {
@@ -118,15 +143,41 @@ export interface ILivePlayerProps {
    */
   onIndexChange?: (idx: number) => void;
 
+  /**
+   * 截图
+   */
   snapshot?: (base64: string) => void;
 
+  /**
+   * 窗口变化
+   */
   screenChange?: (num: number) => void;
 
+  /**
+   * 默认窗口数量
+   */
   defaultScreen?: 1 | 4 | 6 | 9 | 16;
 
+  /**
+   * 窗口数量，若有值由外部来完全控制
+   */
   screenNum?: 1 | 4 | 6 | 9 | 16;
 
+  /**
+   * 默认选中窗口
+   * @default 0
+   */
   defaultSelectIndex?: number;
+
+  /**
+   * 单窗口拓展工具条,左侧
+   */
+  oneWinExtTools?: JSX.Element;
+
+  /**
+   * 全局窗口工具条，右侧
+   */
+  allWinExtTools?: JSX.Element;
 }
 
 export interface ILivePlayerState {

package/es/index.d.ts

@@ -39,4 +39,5 @@ export { default as Tree } from './Tree';
 export { default as useFullscreen } from './useFullscreen';
 export { default as useHistory } from './useHistory';
 export { default as useInfiniteScroll } from './useInfiniteScroll';
+export { default as useRafInterval } from './useRafInterval';
 export { default as useVirtualList } from './useVirtualList';

package/es/index.js

@@ -39,4 +39,5 @@ export { default as Tree } from './Tree';
 export { default as useFullscreen } from './useFullscreen';
 export { default as useHistory } from './useHistory';
 export { default as useInfiniteScroll } from './useInfiniteScroll';
+export { default as useRafInterval } from './useRafInterval';
 export { default as useVirtualList } from './useVirtualList';

package/es/useRafInterval/index.d.ts

@@ -0,0 +1,5 @@
+declare function useRafInterval(fn: () => void, delay: number | undefined, options?: {
+    immediate?: boolean;
+    deps?: any[];
+}): () => void;
+export default useRafInterval;

package/es/useRafInterval/index.js

@@ -0,0 +1,94 @@
+import _useLatest from "ahooks/es/useLatest";
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+import { useCallback, useEffect, useRef } from 'react';
+import { isNumber } from 'lodash-es';
+
+var setRafInterval = function setRafInterval(callback) {
+  var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+
+  if ((typeof requestAnimationFrame === "undefined" ? "undefined" : _typeof(requestAnimationFrame)) === (typeof undefined === "undefined" ? "undefined" : _typeof(undefined))) {
+    return {
+      id: setInterval(callback, delay)
+    };
+  }
+
+  var start = new Date().getTime();
+  var handle = {
+    id: 0
+  };
+
+  var loop = function loop() {
+    var current = new Date().getTime();
+
+    if (current - start >= delay) {
+      callback();
+      start = new Date().getTime();
+    }
+
+    handle.id = requestAnimationFrame(loop);
+  };
+
+  handle.id = requestAnimationFrame(loop);
+  return handle;
+};
+
+function cancelAnimationFrameIsNotDefined(t) {
+  return (typeof cancelAnimationFrame === "undefined" ? "undefined" : _typeof(cancelAnimationFrame)) === (typeof undefined === "undefined" ? "undefined" : _typeof(undefined));
+}
+
+var clearRafInterval = function clearRafInterval(handle) {
+  if (cancelAnimationFrameIsNotDefined(handle.id)) {
+    return clearInterval(handle.id);
+  }
+
+  cancelAnimationFrame(handle.id);
+};
+
+function useRafInterval(fn, delay, options) {
+  var _a;
+
+  var immediate = options === null || options === void 0 ? void 0 : options.immediate;
+  var deps = (_a = options === null || options === void 0 ? void 0 : options.deps) !== null && _a !== void 0 ? _a : [];
+
+  var fnRef = _useLatest(fn);
+
+  var timerRef = useRef();
+  useEffect(function () {
+    if (!isNumber(delay) || delay < 0) return undefined;
+
+    if (immediate) {
+      fnRef.current();
+    }
+
+    timerRef.current = setRafInterval(function () {
+      fnRef.current();
+    }, delay);
+    return function () {
+      if (timerRef.current) {
+        clearRafInterval(timerRef.current);
+      }
+    }; // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [delay].concat(_toConsumableArray(deps)));
+  var clear = useCallback(function () {
+    if (timerRef.current) {
+      clearRafInterval(timerRef.current);
+    }
+  }, []);
+  return clear;
+}
+
+export default useRafInterval;

package/package.json

@@ -2,7 +2,7 @@
   "private": false,
   "name": "@cloud-app-dev/vidc",
   "description": "Video Image Data Componennts",
-  "version": "3.0.16",
+  "version": "3.0.18",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",

package/es/Player/event/browserTabEvent.d.ts

@@ -1,9 +0,0 @@
-declare function visibilityState(): any;
-declare function addEventListener(listener: () => void): void;
-declare function removeEventListener(listener: () => void): void;
-declare const _default: {
-    addEventListener: typeof addEventListener;
-    removeEventListener: typeof removeEventListener;
-    visibilityState: typeof visibilityState;
-};
-export default _default;

package/es/Player/event/browserTabEvent.js

@@ -1,57 +0,0 @@
-function getHiddenProp() {
-  var prefixes = ['webkit', 'moz', 'ms', 'o']; // 如果hidden 属性是原生支持的，我们就直接返回
-
-  if ('hidden' in document) {
-    return 'hidden';
-  } // 其他的情况就循环现有的浏览器前缀，拼接我们所需要的属性
-
-
-  for (var i = 0; i < prefixes.length; i++) {
-    // 如果当前的拼接的前缀在 document对象中存在 返回即可
-    if (prefixes[i] + 'Hidden' in document) {
-      return prefixes[i] + 'Hidden';
-    }
-  } // 其他的情况 直接返回null
-
-
-  return undefined;
-}
-
-function getVisibilityState() {
-  var prefixes = ['webkit', 'moz', 'ms', 'o'];
-
-  if ('visibilityState' in document) {
-    return 'visibilityState';
-  }
-
-  for (var i = 0; i < prefixes.length; i++) {
-    if (prefixes[i] + 'VisibilityState' in document) {
-      return prefixes[i] + 'VisibilityState';
-    }
-  } // 找不到返回 null
-
-
-  return null;
-}
-
-function visibilityState() {
-  return document[getVisibilityState()];
-}
-
-function addEventListener(listener) {
-  var visProp = getHiddenProp();
-  var evtname = visProp.replace(/[H|h]idden/, '') + 'visibilitychange';
-  document.addEventListener(evtname, listener, false);
-}
-
-function removeEventListener(listener) {
-  var visProp = getHiddenProp();
-  var evtname = visProp.replace(/[H|h]idden/, '') + 'visibilitychange';
-  document.removeEventListener(evtname, listener, false);
-}
-
-export default {
-  addEventListener: addEventListener,
-  removeEventListener: removeEventListener,
-  visibilityState: visibilityState
-};