@cloud-app-dev/vidc 3.2.13 → 3.2.15

package/es/List/index.d.ts

@@ -1,6 +1,29 @@
 import React from 'react';
-import { ListProps } from './interface';
 import './index.less';
+export interface ListProps<T> {
+    /**
+     * @description 列表数据
+     * @default []
+     */
+    list?: Array<T>;
+    /**
+     * @description 列表类名
+     * @default ''
+     */
+    className?: string;
+    /**
+     * @description 列表样式
+     * @default -
+     */
+    style?: React.CSSProperties;
+    /**
+     * @description 列表自定义渲染
+     * @default -
+     */
+    renderItem: (item: T, index: number) => JSX.Element;
+    rowHeight?: number;
+    renderHeaderExt?: () => JSX.Element;
+}
 declare function List<T>(props: ListProps<T>): JSX.Element;
 declare namespace List {
     var defaultProps: {
@@ -10,9 +33,9 @@ declare namespace List {
         itemNameKey: string;
         renderHeaderExt: () => JSX.Element;
     };
-    var VList: typeof import("./VList").default;
-    var DynamicList: typeof import("./DynamicList").default;
-    var GridList: React.ForwardRefExoticComponent<import("./GridList").GridListProps<unknown> & React.RefAttributes<HTMLDivElement>>;
-    var DynamicGridList: typeof import("./DynamicGridList").default;
+    var VList: typeof import("../VList").default;
+    var DynamicList: typeof import("../DynamicList").default;
+    var GridList: React.ForwardRefExoticComponent<import("../GridList").GridListProps<unknown> & React.RefAttributes<HTMLDivElement>>;
+    var DynamicGridList: typeof import("../DynamicGridList").default;
 }
 export default List;

package/es/List/index.js

@@ -1,8 +1,9 @@
 import React from 'react';
-import DynamicList from "./DynamicList";
-import GridList from "./GridList";
-import DynamicGridList from "./DynamicGridList";
-import VList from "./VList";
+import DynamicGridList from "../DynamicGridList";
+import DynamicList from "../DynamicList";
+import GridList from "../GridList";
+import VList from "../VList"; // style
+
 import "./index.less";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -20,7 +21,7 @@ function List(props) {
     style: style,
     children: [/*#__PURE__*/_jsx("div", {
       className: "lm-c-list-header",
-      children: renderHeaderExt()
+      children: renderHeaderExt === null || renderHeaderExt === void 0 ? void 0 : renderHeaderExt()
     }), /*#__PURE__*/_jsx("div", {
       className: "lm-c-base-list-layout",
       children: /*#__PURE__*/_jsx(VList, {

package/es/ListWithSizeAnimate/demo.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function App(): JSX.Element;

package/es/ListWithSizeAnimate/demo.js

@@ -0,0 +1,140 @@
+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; }
+
+/* eslint-disable @typescript-eslint/no-unused-expressions */
+import React from 'react';
+import ListWithSizeAnimate from "./index";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+
+function random(low, high) {
+  return Math.floor(Math.random() * high) + low;
+}
+
+var IMAGES = function IMAGES() {
+  return Array.from({
+    length: 20
+  }, function (_, index) {
+    var width = 300;
+    var height = random(200, 300);
+    return {
+      url: "https://picsum.photos/id/".concat(index + 1, "/").concat(width, "/").concat(height, ".jpg"),
+      width: width,
+      height: height
+    };
+  });
+};
+
+function loadPage(d) {
+  if (!d) {
+    // eslint-disable-next-line no-param-reassign
+    d = {};
+  }
+
+  var resultData = IMAGES();
+  d.page ? d.page++ : d.page = 1;
+  d.list ? d.list = [].concat(_toConsumableArray(d.list), _toConsumableArray(resultData)) : d.list = resultData;
+  return new Promise(function (resolve) {
+    console.log(d.page);
+    setTimeout(function () {
+      return resolve(d);
+    }, 10);
+  });
+}
+
+export default function App() {
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: '100%',
+      height: 800
+    },
+    children: /*#__PURE__*/_jsx(ListWithSizeAnimate, {
+      headerSize: 400,
+      header: /*#__PURE__*/_jsx("div", {
+        children: /*#__PURE__*/_jsxs("ul", {
+          children: [/*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF61"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF62"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          }), /*#__PURE__*/_jsx("li", {
+            children: "\u6761\u4EF63"
+          })]
+        })
+      }),
+      itemKey: "url",
+      itemHeight: 300,
+      itemWidth: 250,
+      renderItem: function renderItem(image) {
+        return /*#__PURE__*/_jsxs("div", {
+          style: {
+            border: '1px solid gray',
+            height: '100%',
+            display: 'flex',
+            flexDirection: 'column'
+          },
+          children: [/*#__PURE__*/_jsx("div", {
+            style: {
+              flex: 1,
+              overflow: 'hidden'
+            },
+            children: /*#__PURE__*/_jsx("img", {
+              src: image.url,
+              alt: "",
+              style: {
+                objectFit: 'cover',
+                display: 'block',
+                width: '100%',
+                height: '100%'
+              }
+            })
+          }), /*#__PURE__*/_jsx("p", {
+            children: "\u6807\u9898"
+          }), /*#__PURE__*/_jsx("p", {
+            children: "\u63CF\u8FF0"
+          })]
+        });
+      },
+      loadPage: loadPage,
+      children: /*#__PURE__*/_jsx("div", {
+        style: {
+          height: 800
+        }
+      })
+    })
+  });
+}

package/es/ListWithSizeAnimate/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { IDynamicGridListProps } from '../DynamicGridList';
+import './index.less';
+interface IListWithSizeAnimateProps<T> extends IDynamicGridListProps<T> {
+    headerSize: number;
+    children?: React.ReactNode;
+    header?: React.ReactNode;
+}
+interface IListWithSizeAnimateRef {
+    open: () => void;
+    close: () => void;
+}
+declare const ListWithSizeAnimate: React.ForwardRefExoticComponent<IListWithSizeAnimateProps<unknown> & React.RefAttributes<IListWithSizeAnimateRef>>;
+export default ListWithSizeAnimate;

package/es/ListWithSizeAnimate/index.js

@@ -0,0 +1,112 @@
+import _useEventListener from "ahooks/es/useEventListener";
+var _excluded = ["headerSize", "header"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure 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 _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 _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React, { useImperativeHandle, useMemo, useRef } from 'react';
+import DynamicGridList from "../DynamicGridList";
+import useSimpleState from "../useSimpleState";
+import "./index.less";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var ListWithSizeAnimate = /*#__PURE__*/React.forwardRef(function ListWithSizeAnimate(_ref, forwardRef) {
+  var _ref$current;
+
+  var headerSize = _ref.headerSize,
+      header = _ref.header,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var _useSimpleState = useSimpleState({
+    open: true
+  }),
+      _useSimpleState2 = _slicedToArray(_useSimpleState, 2),
+      state = _useSimpleState2[0],
+      updateState = _useSimpleState2[1];
+
+  var ref = useRef(null);
+  var headerHeight = useMemo(function () {
+    return state.open ? headerSize : 0;
+  }, [state.open]);
+  var contentHeight = useMemo(function () {
+    return "calc(100% - ".concat(headerHeight, "px)");
+  }, [headerHeight]);
+
+  _useEventListener('wheel', function (event) {
+    if (event.deltaY > 0 && state.open) {
+      updateState({
+        open: false
+      });
+    }
+  }, {
+    target: ref
+  });
+
+  _useEventListener('scroll', function (event) {
+    var _event$currentTarget;
+
+    if (((_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : _event$currentTarget.scrollTop) === 0) {
+      updateState({
+        open: true
+      });
+    }
+  }, {
+    target: (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.querySelector('.cloudapp-dynamic-grid-list')
+  });
+
+  useImperativeHandle(forwardRef, function () {
+    return {
+      open: function open() {
+        return updateState({
+          open: true
+        });
+      },
+      close: function close() {
+        return updateState({
+          open: false
+        });
+      }
+    };
+  }, []);
+  return /*#__PURE__*/_jsxs("div", {
+    className: "list-with-size-animate-layout",
+    ref: ref,
+    children: [/*#__PURE__*/_jsx("div", {
+      className: "list-animate-header",
+      style: {
+        height: headerHeight,
+        overflow: !state.open ? 'hidden' : undefined
+      },
+      children: /*#__PURE__*/_jsx("div", {
+        className: "list-animate-header-content",
+        children: header
+      })
+    }), /*#__PURE__*/_jsx("div", {
+      className: "list-animate-content",
+      style: {
+        height: contentHeight
+      },
+      children: /*#__PURE__*/_jsx(DynamicGridList, _objectSpread({}, props))
+    })]
+  });
+});
+export default ListWithSizeAnimate;

package/es/ListWithSizeAnimate/index.less

@@ -0,0 +1,14 @@
+.list-with-size-animate-layout {
+  height: 100%;
+  width: 100%;
+  overflow: hidden;
+  .list-animate-header {
+    background-color: gray;
+    transition: height 0.3s;
+  }
+  .list-animate-content {
+    background-color: blue;
+    overflow: hidden;
+    transition: height 0.3s;
+  }
+}

package/es/Picture/interface.d.ts

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 export type MenuRectType = {
   /**
    * 路由地址
@@ -21,7 +19,6 @@ export type MenuRectType = {
    */
   base64?: string;
 };
-export const MenuRectTypeDemo: React.FC<MenuRectType>;
 
 export type TagItemType = {
   /**
@@ -44,7 +41,6 @@ export type TagItemType = {
    */
   titleAttr?: string;
 };
-export const TagItemTypeDemo: React.FC<TagItemType>;
 
 export type ImageType = 'face' | 'body' | 'nonVehicle' | 'vehicle' | 'thing';
 
@@ -104,8 +100,6 @@ export type RectType = {
   base64?: string;
 };
 
-export const RectTypeDemo: React.FC<RectType>;
-
 export type PositionType = {
   x: number;
   y: number;

package/es/Player/contraller_bar/volume.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import type Api from '../api';
 import '../style/volume.less';
 declare function Volume({ api, style }: {
-    api: Api;
+    api?: Api;
     style?: React.CSSProperties;
 }): JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof Volume>;

package/es/PlayerExt/index.d.ts

@@ -41,7 +41,7 @@ export declare function getLocalPort(): string;
  * @returns
  */
 export declare function getLocalPlayPath(url: string, params?: string): string;
-export declare function usePlugin(mode: PlayModeType, key: any): {
+export declare function usePlugin(mode?: PlayModeType, key?: any): {
     needInstall: boolean;
 };
 export declare function ExtModel({ url, children, mode, pluginDownloadUrl, pluginParams, loading, segments }: IPluginProps): JSX.Element;

package/es/PlayerExt/index.js

@@ -16,7 +16,6 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-/* eslint-disable jsx-a11y/anchor-is-valid */
 import React, { useEffect, useMemo, useState } from 'react';
 import IconFont from "../Player/iconfont";
 import "./index.less";
@@ -46,7 +45,7 @@ export function getLocalPlayPath(url) {
   var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   var URL_TEMPLATE = "http://127.0.0.1:<port>/video/v1/transcoding?uri=<pull_uri>";
   var port = getLocalPort();
-  var pull_uri = window.btoa(url).replaceAll('=', '').replaceAll('/', '_').replaceAll('+', '-');
+  var pull_uri = window.btoa(url).replace(/=/g, '').replace(/\//, '_').replace('+', '-');
   return URL_TEMPLATE.replace('<port>', port).replace('<pull_uri>', pull_uri) + params;
 }
 export function usePlugin(mode, key) {
@@ -191,11 +190,11 @@ export function ExtModel(_ref2) {
   }, [url, mode]); // eslint-disable-next-line react-hooks/exhaustive-deps
 
   var playSegments = useMemo(function () {
-    return mode === 2 && url ? segments.map(function (v) {
+    return mode === 2 && segments ? segments.map(function (v) {
       return _objectSpread(_objectSpread({}, v), {}, {
-        url: getLocalPlayPath(v.url, pluginParams)
+        url: v.url ? getLocalPlayPath(v.url, pluginParams) : undefined
       });
-    }) : url;
+    }) : segments;
   }, [segments, mode]);
 
   if (needInstall) {

package/es/ScreenPlayer/Live.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { ILivePlayerProps } from './interface';
 import './index.less';
+import type { ILivePlayerProps } from './interface';
 declare function LivePlayer({ list, children, oneWinExtTools, allWinExtTools, ...props }: ILivePlayerProps): JSX.Element;
 declare namespace LivePlayer {
     var defaultProps: {

package/es/ScreenPlayer/Live.js

@@ -25,12 +25,12 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { ScreenType, mergeFill } from "./utils";
-import { LivePlayerWithExt } from "./PlayerWithExt";
-import Tools from "./LiveTools";
-import useVideoFit from "./useVideoFit";
 import DisableMark from "../DisableMark";
 import "./index.less";
+import Tools from "./LiveTools";
+import { LivePlayerWithExt } from "./PlayerWithExt";
+import useVideoFit from "./useVideoFit";
+import { mergeFill, ScreenType } from "./utils";
 import { createElement as _createElement } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -77,10 +77,11 @@ function LivePlayer(_ref) {
   }, [list, screenNum]); // 获取选中player对象
 
   var getPlayerItem = function getPlayerItem() {
-    var _playerRef$current, _playerRef$current$it;
+    var _playerRef$current, _playerRef$current$ci;
 
-    var item = list[state.selectIndex];
-    return (_playerRef$current = playerRef.current) === null || _playerRef$current === void 0 ? void 0 : (_playerRef$current$it = _playerRef$current[item === null || item === void 0 ? void 0 : item.cid]) === null || _playerRef$current$it === void 0 ? void 0 : _playerRef$current$it.current;
+    var item = list ? list[state.selectIndex] : {};
+    var cid = item === null || item === void 0 ? void 0 : item.cid;
+    return cid ? (_playerRef$current = playerRef.current) === null || _playerRef$current === void 0 ? void 0 : (_playerRef$current$ci = _playerRef$current[cid]) === null || _playerRef$current$ci === void 0 ? void 0 : _playerRef$current$ci.current : undefined;
   }; // 更新状态
 
 
@@ -98,18 +99,22 @@ function LivePlayer(_ref) {
       } // 修正选中索引
 
 
-      if (newState.screenNum < state.selectIndex) {
+      if (newState.screenNum && newState.screenNum < state.selectIndex) {
         obj.selectIndex = 0;
       }
     }
 
     if (newState.hasOwnProperty('mode')) {
-      var item = list[state.selectIndex];
+      var item = list === null || list === void 0 ? void 0 : list[state.selectIndex];
 
       var newModes = _objectSpread({}, state.modes);
 
-      newModes[item.cid] = newState.mode;
-      obj.modes = newModes;
+      var cid = item === null || item === void 0 ? void 0 : item.cid;
+
+      if (cid) {
+        newModes[cid] = newState.mode;
+        obj.modes = newModes;
+      }
     }
 
     setState(function (old) {
@@ -119,7 +124,7 @@ function LivePlayer(_ref) {
 
 
   var segmentItem = useMemo(function () {
-    return list[state.selectIndex] || {};
+    return (list === null || list === void 0 ? void 0 : list[state.selectIndex]) || {};
   }, [state.selectIndex, list]);
   /**
    * 同步外部的selectIndex变化
@@ -196,13 +201,15 @@ function LivePlayer(_ref) {
       className: "player-layout",
       ref: domRef,
       children: screenList.map(function (item, index) {
-        var _state$modes$item$cid, _item$url;
+        var _item$url;
 
         return /*#__PURE__*/_createElement(LivePlayerWithExt, _objectSpread(_objectSpread({}, item), {}, {
-          mode: (_state$modes$item$cid = state.modes[item.cid]) !== null && _state$modes$item$cid !== void 0 ? _state$modes$item$cid : item.mode,
+          mode: item.cid ? state.modes[item.cid] : item.mode,
           key: (_item$url = item.url) !== null && _item$url !== void 0 ? _item$url : "".concat(index),
           updatePlayer: function updatePlayer(player) {
-            return playerRef.current[item.cid] = player;
+            if (item.cid) {
+              playerRef.current[item.cid] = player;
+            }
           },
           className: state.selectIndex === index ? 'player-current-index' : '',
           onClick: index !== state.selectIndex ? function () {
@@ -213,8 +220,8 @@ function LivePlayer(_ref) {
             });
           } : undefined,
           style: {
-            width: screenType.width,
-            height: screenType.height
+            width: screenType === null || screenType === void 0 ? void 0 : screenType.width,
+            height: screenType === null || screenType === void 0 ? void 0 : screenType.height
           },
           pluginDownloadUrl: props.pluginDownloadUrl
         }));

package/es/ScreenPlayer/LiveTools.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { ExportPlayerType } from '../Player/player';
 import { PlayModeType } from '../PlayerExt';
 interface IToolsProps {
-    containerRef: React.MutableRefObject<HTMLDivElement>;
+    containerRef: React.RefObject<HTMLDivElement>;
     updateState: (state: {
         screenNum?: number;
         mode?: PlayModeType;
@@ -14,7 +14,7 @@ interface IToolsProps {
     toggleFit?: () => void;
     onClose?: () => void;
     onCloseAll?: () => void;
-    snapshot?: (base64?: string) => void;
+    snapshot?: (base64: string) => void;
     /**
      * 单窗口拓展工具条,左侧
      */

package/es/ScreenPlayer/LiveTools.js

@@ -19,10 +19,10 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import React from 'react';
+import Volume from "../Player/contraller_bar/volume";
 import IconFont from "../Player/iconfont";
-import ScreenSelect from "./ScreenSelect";
 import useFullscreen from "../useFullscreen";
-import Volume from "../Player/contraller_bar/volume";
+import ScreenSelect from "./ScreenSelect";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 
@@ -59,11 +59,14 @@ function LiveTools(_ref) {
   };
 
   var snapshotaction = function snapshotaction() {
-    var _props$snapshot;
-
     var player = props.getPlayerItem();
     var base64 = player === null || player === void 0 ? void 0 : player.api.snapshot();
-    (_props$snapshot = props.snapshot) === null || _props$snapshot === void 0 ? void 0 : _props$snapshot.call(props, base64);
+
+    if (base64) {
+      var _props$snapshot;
+
+      (_props$snapshot = props.snapshot) === null || _props$snapshot === void 0 ? void 0 : _props$snapshot.call(props, base64);
+    }
   };
 
   var player = props.getPlayerItem();
@@ -110,7 +113,7 @@ function LiveTools(_ref) {
           className: "icon-chajian",
           style: mode === 2 ? {
             color: 'var(--primary)'
-          } : null,
+          } : undefined,
           title: "\u5207\u6362".concat(mode === 1 ? '插件' : '浏览器', "\u6A21\u5F0F")
         })
       }), /*#__PURE__*/_jsx("div", {

package/es/ScreenPlayer/PlayerWithExt.d.ts

@@ -4,7 +4,7 @@ import type { PlayModeType } from '../PlayerExt';
 interface ILivePlayerWithExtProps extends ISinglePlayerProps {
     mode?: PlayModeType;
     style: React.CSSProperties;
-    onClick: () => void;
+    onClick?: () => void;
     updatePlayer: (obj: React.MutableRefObject<ExportPlayerType>) => void;
     pluginDownloadUrl?: string;
 }
@@ -28,7 +28,7 @@ interface IFrontendPlayerWithExtProps extends Omit<ILivePlayerWithExtProps, 'url
         end: number;
         screenIndex: number;
     }) => Promise<string>;
-    screenIndex?: number;
+    screenIndex: number;
 }
 export declare function FrontendPlayerWithExt({ mode, style, className, segments, pluginDownloadUrl, screenIndex, httpLoading, ...props }: IFrontendPlayerWithExtProps): JSX.Element;
 export {};

package/es/ScreenPlayer/PlayerWithExt.js

@@ -27,12 +27,12 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
+import moment from 'moment';
 import React, { useEffect, useRef, useState } from 'react';
-import LivePlayer from "../Player/single_player";
-import SegmentPlayer from "../Player/segment_player";
 import FrontendPlayer from "../Player/frontend_player";
+import SegmentPlayer from "../Player/segment_player";
+import LivePlayer from "../Player/single_player";
 import ExtModel from "../PlayerExt";
-import moment from 'moment';
 import useFullscreen from "../useFullscreen";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -114,7 +114,7 @@ export function SegmentPlayerWithExt(_ref2) {
     onClick: props.onClick,
     onDoubleClick: toggleFullscreen,
     children: /*#__PURE__*/_jsx(ExtModel, {
-      mode: 1,
+      mode: mode,
       loading: httpLoading,
       segments: segments,
       children: /*#__PURE__*/_jsx(SegmentPlayer, _objectSpread(_objectSpread({}, props), {}, {
@@ -155,6 +155,8 @@ export function FrontendPlayerWithExt(_ref3) {
   var latestUrl = _useLatest(state.url);
 
   useEffect(function () {
+    var _segments$index$url, _segments$index;
+
     if (!(Array.isArray(segments) && segments.length > 0)) {
       return undefined;
     }
@@ -170,7 +172,7 @@ export function FrontendPlayerWithExt(_ref3) {
     var _ref4 = [segments[0].beginTime, segments[segments.length - 1].endTime],
         begin = _ref4[0],
         end = _ref4[1];
-    var videoUrl = new URL(segments[index].url);
+    var videoUrl = new URL((_segments$index$url = (_segments$index = segments[index]) === null || _segments$index === void 0 ? void 0 : _segments$index.url) !== null && _segments$index$url !== void 0 ? _segments$index$url : '');
     var url;
 
     if (props.getLocalRecordUrl) {