pb-sxp-ui 1.1.1 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/dist/index.cjs +6 -5
  2. package/dist/index.cjs.map +1 -0
  3. package/dist/index.js +6 -5
  4. package/dist/index.js.map +1 -0
  5. package/dist/index.min.cjs +2 -1
  6. package/dist/index.min.cjs.map +1 -0
  7. package/dist/index.min.js +2 -1
  8. package/dist/index.min.js.map +1 -0
  9. package/dist/pb-ui.js +6 -5
  10. package/dist/pb-ui.js.map +1 -0
  11. package/dist/pb-ui.min.js +2 -1
  12. package/dist/pb-ui.min.js.map +1 -0
  13. package/es/core/components/SxpPageRender/FingerSwipeTip/index.d.ts +1 -0
  14. package/es/core/components/SxpPageRender/FingerSwipeTip/index.js +3 -3
  15. package/es/core/components/SxpPageRender/VideoWidget/index.js +6 -2
  16. package/es/core/components/SxpPageRender/index.d.ts +1 -0
  17. package/es/core/components/SxpPageRender/index.js +1 -1
  18. package/lib/core/components/SxpPageRender/FingerSwipeTip/index.d.ts +1 -0
  19. package/lib/core/components/SxpPageRender/FingerSwipeTip/index.js +3 -3
  20. package/lib/core/components/SxpPageRender/VideoWidget/index.js +6 -2
  21. package/lib/core/components/SxpPageRender/index.d.ts +1 -0
  22. package/lib/core/components/SxpPageRender/index.js +1 -1
  23. package/package.json +1 -1
package/es/core/components/SxpPageRender/FingerSwipeTip/index.d.ts CHANGED
@@ -2,6 +2,7 @@ import { CSSProperties, FC } from 'react';
2
2
  interface IProps {
3
3
  imageUrl?: string;
4
4
  style?: CSSProperties;
5
+ duration?: number;
5
6
  }
6
7
  declare const FingerSwipeTip: FC<IProps>;
7
8
  export default FingerSwipeTip;
package/es/core/components/SxpPageRender/FingerSwipeTip/index.js CHANGED
@@ -1,19 +1,19 @@
1
1
  import React, { useEffect, useMemo, useState } from 'react';
2
2
  import { useIconLink } from '../useIconLink';
3
3
  import { useEditor } from '../../../../core/hooks';
4
- const FingerSwipeTip = ({ imageUrl, style }) => {
4
+ const FingerSwipeTip = ({ imageUrl, style, duration = 2000 }) => {
5
5
  const [show, setShow] = useState(true);
6
6
  const { schema: { sxpPageConf } } = useEditor();
7
7
  useEffect(() => {
8
8
  setTimeout(() => {
9
9
  setShow(false);
10
- }, 2000);
10
+ }, duration);
11
11
  }, []);
12
12
  const FINGER_SWIPE_ICON = useIconLink('/pb_static/finger-swipe-tip.29dc3a48a3c746c906ea..png');
13
13
  const animationCls = useMemo(() => {
14
14
  return show ? 'pb-fadeIn' : 'pb-fadeOut';
15
15
  }, [show]);
16
- return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: style },
16
+ return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: Object.assign(Object.assign({}, style), { animationDuration: `${duration / 1000}s` }) },
17
17
  React.createElement("img", { src: imageUrl || FINGER_SWIPE_ICON, alt: 'finger swiper' })));
18
18
  };
19
19
  export default FingerSwipeTip;
package/es/core/components/SxpPageRender/VideoWidget/index.js CHANGED
@@ -156,6 +156,8 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
156
156
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
157
157
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
158
158
  return;
159
+ if (activeIndex !== index)
160
+ return;
159
161
  const item = data[index];
160
162
  const videoDuration = ((_b = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
161
163
  const videoCurrentTime = ((_d = (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
@@ -220,7 +222,9 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
220
222
  (_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
221
223
  return () => {
222
224
  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
223
- (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
225
+ const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
226
+ if (!isPause)
227
+ handlePause();
224
228
  if (hls)
225
229
  hls === null || hls === void 0 ? void 0 : hls.destroy();
226
230
  setIsLoadFinish(false);
@@ -233,7 +237,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
233
237
  (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('canplay', handlePlay);
234
238
  (_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('waiting', handleWaiting);
235
239
  };
236
- }, [isActive, videoId, rec]);
240
+ }, [isActive, videoId, rec, handlePause]);
237
241
  useEffect(() => {
238
242
  var _a, _b;
239
243
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || !isLoadFinish)
package/es/core/components/SxpPageRender/index.d.ts CHANGED
@@ -39,6 +39,7 @@ export interface ISxpPageRenderProps {
39
39
  videoPlayIcon?: string;
40
40
  isShowMute?: boolean;
41
41
  bottomInfoDist?: number;
42
+ swiperTipAniDur?: number;
42
43
  };
43
44
  descStyle?: CSSProperties;
44
45
  tipText?: {
package/es/core/components/SxpPageRender/index.js CHANGED
@@ -398,7 +398,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
398
398
  React.createElement(Tagbar, { tagList: tagList, setActiveIndex: setActiveIndex, style: {
399
399
  top: minusHeight
400
400
  } }),
401
- isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` } })) : null,
401
+ isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
402
402
  React.createElement(Swiper, { style: {
403
403
  marginTop: tagHeight
404
404
  }, ref: swiperRef, onSlideChange: () => {
package/lib/core/components/SxpPageRender/FingerSwipeTip/index.d.ts CHANGED
@@ -2,6 +2,7 @@ import { CSSProperties, FC } from 'react';
2
2
  interface IProps {
3
3
  imageUrl?: string;
4
4
  style?: CSSProperties;
5
+ duration?: number;
5
6
  }
6
7
  declare const FingerSwipeTip: FC<IProps>;
7
8
  export default FingerSwipeTip;
package/lib/core/components/SxpPageRender/FingerSwipeTip/index.js CHANGED
@@ -4,19 +4,19 @@ const tslib_1 = require("tslib");
4
4
  const react_1 = tslib_1.__importStar(require("react"));
5
5
  const useIconLink_1 = require("../useIconLink");
6
6
  const hooks_1 = require("../../../../core/hooks");
7
- const FingerSwipeTip = ({ imageUrl, style }) => {
7
+ const FingerSwipeTip = ({ imageUrl, style, duration = 2000 }) => {
8
8
  const [show, setShow] = (0, react_1.useState)(true);
9
9
  const { schema: { sxpPageConf } } = (0, hooks_1.useEditor)();
10
10
  (0, react_1.useEffect)(() => {
11
11
  setTimeout(() => {
12
12
  setShow(false);
13
- }, 2000);
13
+ }, duration);
14
14
  }, []);
15
15
  const FINGER_SWIPE_ICON = (0, useIconLink_1.useIconLink)('/pb_static/finger-swipe-tip.29dc3a48a3c746c906ea..png');
16
16
  const animationCls = (0, react_1.useMemo)(() => {
17
17
  return show ? 'pb-fadeIn' : 'pb-fadeOut';
18
18
  }, [show]);
19
- return (react_1.default.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: style },
19
+ return (react_1.default.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: Object.assign(Object.assign({}, style), { animationDuration: `${duration / 1000}s` }) },
20
20
  react_1.default.createElement("img", { src: imageUrl || FINGER_SWIPE_ICON, alt: 'finger swiper' })));
21
21
  };
22
22
  exports.default = FingerSwipeTip;
package/lib/core/components/SxpPageRender/VideoWidget/index.js CHANGED
@@ -159,6 +159,8 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
159
159
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
160
160
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
161
161
  return;
162
+ if (activeIndex !== index)
163
+ return;
162
164
  const item = data[index];
163
165
  const videoDuration = ((_b = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
164
166
  const videoCurrentTime = ((_d = (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
@@ -223,7 +225,9 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
223
225
  (_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
224
226
  return () => {
225
227
  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
226
- (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
228
+ const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
229
+ if (!isPause)
230
+ handlePause();
227
231
  if (hls)
228
232
  hls === null || hls === void 0 ? void 0 : hls.destroy();
229
233
  setIsLoadFinish(false);
@@ -236,7 +240,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
236
240
  (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('canplay', handlePlay);
237
241
  (_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('waiting', handleWaiting);
238
242
  };
239
- }, [isActive, videoId, rec]);
243
+ }, [isActive, videoId, rec, handlePause]);
240
244
  (0, react_1.useEffect)(() => {
241
245
  var _a, _b;
242
246
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || !isLoadFinish)
package/lib/core/components/SxpPageRender/index.d.ts CHANGED
@@ -39,6 +39,7 @@ export interface ISxpPageRenderProps {
39
39
  videoPlayIcon?: string;
40
40
  isShowMute?: boolean;
41
41
  bottomInfoDist?: number;
42
+ swiperTipAniDur?: number;
42
43
  };
43
44
  descStyle?: CSSProperties;
44
45
  tipText?: {
package/lib/core/components/SxpPageRender/index.js CHANGED
@@ -401,7 +401,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
401
401
  react_1.default.createElement(Tagbar_1.default, { tagList: tagList, setActiveIndex: setActiveIndex, style: {
402
402
  top: minusHeight
403
403
  } }),
404
- isShowFingerTip ? (react_1.default.createElement(FingerSwipeTip_1.default, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` } })) : null,
404
+ isShowFingerTip ? (react_1.default.createElement(FingerSwipeTip_1.default, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
405
405
  react_1.default.createElement(react_2.Swiper, { style: {
406
406
  marginTop: tagHeight
407
407
  }, ref: swiperRef, onSlideChange: () => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pb-sxp-ui",
3
- "version": "1.1.1",
3
+ "version": "1.1.2",
4
4
  "description": "React enterprise-class UI components",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",