pb-sxp-ui 1.15.22-alpha.2 → 1.15.22-alpha.4

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.
package/dist/index.js CHANGED
@@ -17662,6 +17662,7 @@ const mountVideoPlayerAtNode = (() => {
17662
17662
  })();
17663
17663
 
17664
17664
  const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
17665
+ var _a, _b, _c, _d, _e;
17665
17666
  const [isPauseVideo, setIsPauseVideo] = useState(false);
17666
17667
  const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
17667
17668
  const videoStartTime = useRef(0);
@@ -17679,6 +17680,11 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
17679
17680
  const isFirstPlayRef = useRef(true);
17680
17681
  const loopPlayRef = useRef(loopPlay);
17681
17682
  const scene = rec.video.scene;
17683
+ const videoUrl = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl) || ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.url);
17684
+ const videoCover = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl) ? scene === null || scene === void 0 ? void 0 : scene.cover : (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.cover;
17685
+ const videoPoster = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl)
17686
+ ? (_c = scene === null || scene === void 0 ? void 0 : scene.cover) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image
17687
+ : (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.cover) !== null && _e !== void 0 ? _e : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image;
17682
17688
  useImperativeHandle(ref, () => {
17683
17689
  return {
17684
17690
  setLoopPlay(v) {
@@ -17699,8 +17705,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
17699
17705
  : 'translateY(-50%)';
17700
17706
  }, [videoPostConfig]);
17701
17707
  const blurBgSrc = useMemo(() => {
17702
- var _a;
17703
- return ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || firstFrameSrc;
17708
+ return videoCover || firstFrameSrc;
17704
17709
  }, [firstFrameSrc, rec]);
17705
17710
  const blurStyle = useMemo(() => {
17706
17711
  return blur
@@ -17735,28 +17740,27 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
17735
17740
  setIsLoadFinish(true);
17736
17741
  }, []);
17737
17742
  const handleStartPlay = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
17738
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
17743
+ var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
17739
17744
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
17740
17745
  return;
17741
17746
  setIsPauseVideo(false);
17742
17747
  const item = data[index];
17743
- if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
17744
- videoStartTime.current = ((_b = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _b === void 0 ? void 0 : _b.currentTime) || 0;
17745
- const videoDuration = ((_d = (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.duration) !== null && _d !== void 0 ? _d : 0).toFixed(2);
17746
- const videoCurrentTime = ((_f = (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.currentTime) !== null && _f !== void 0 ? _f : 0).toFixed(2);
17748
+ if (item && ((_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.duration)) {
17749
+ videoStartTime.current = ((_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.currentTime) || 0;
17750
+ const videoDuration = ((_j = (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.duration) !== null && _j !== void 0 ? _j : 0).toFixed(2);
17751
+ const videoCurrentTime = ((_l = (_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.currentTime) !== null && _l !== void 0 ? _l : 0).toFixed(2);
17747
17752
  const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
17748
17753
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
17749
- eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_h = (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.itemId) !== null && _h !== void 0 ? _h : '', contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []), position: index + '', contentFormat: 'video', traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
17754
+ eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId) !== null && _o !== void 0 ? _o : '', contentName: (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.title) !== null && _q !== void 0 ? _q : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.tags) !== null && _s !== void 0 ? _s : []), position: index + '', contentFormat: 'video', traceInfo: (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
17750
17755
  });
17751
17756
  isFirstPlayRef.current = false;
17752
17757
  }
17753
17758
  }), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
17754
17759
  const handLoadeddata = useCallback(() => {
17755
- var _a;
17756
17760
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
17757
17761
  return;
17758
17762
  videoRef.current.style.objectFit = 'contain';
17759
- if (((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || !canvasRef || !canvasRef.current || isBgColor)
17763
+ if (videoCover || !canvasRef || !canvasRef.current || isBgColor)
17760
17764
  return;
17761
17765
  const setFrameImg = () => {
17762
17766
  const canvas = canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current;
@@ -17823,6 +17827,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
17823
17827
  return;
17824
17828
  if (activeIndex !== index)
17825
17829
  return;
17830
+ setIsPauseVideo(true);
17826
17831
  const item = data[index];
17827
17832
  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);
17828
17833
  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);
@@ -17871,7 +17876,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
17871
17876
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
17872
17877
  if (!isActive)
17873
17878
  return;
17874
- const videoSrc = rec === null || rec === void 0 ? void 0 : rec.video.url;
17879
+ const videoSrc = videoUrl;
17875
17880
  if (!videoSrc)
17876
17881
  return;
17877
17882
  const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
@@ -17975,7 +17980,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
17975
17980
  };
17976
17981
  }, [handleClickVideo, isActive]);
17977
17982
  const renderPoster = useMemo(() => {
17978
- if (!(sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image) || isLoadFinish) {
17983
+ if (!videoPoster || isLoadFinish) {
17979
17984
  return null;
17980
17985
  }
17981
17986
  return (React.createElement("img", { style: {
@@ -17985,8 +17990,8 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
17985
17990
  width: '100%',
17986
17991
  height: '100%',
17987
17992
  objectFit: 'cover'
17988
- }, src: sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image, alt: 'placeholder image' }));
17989
- }, [isLoadFinish, sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image]);
17993
+ }, src: videoPoster, alt: 'placeholder image' }));
17994
+ }, [isLoadFinish]);
17990
17995
  const renderLoading = useMemo(() => {
17991
17996
  if (!waiting || !isLoadFinish)
17992
17997
  return;
@@ -18006,8 +18011,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
18006
18011
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
18007
18012
  return;
18008
18013
  const handleBeforeUnload = () => {
18009
- var _a;
18010
- if (activeIndex === index && ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.url) && (videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) && !isPauseVideo) {
18014
+ if (activeIndex === index && videoUrl && (videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) && !isPauseVideo) {
18011
18015
  handleClickVideo('pause')();
18012
18016
  }
18013
18017
  };
@@ -18508,7 +18512,7 @@ var NavBack$1 = memo(NavBack);
18508
18512
  * @Author: binruan@chatlabs.com
18509
18513
  * @Date: 2024-03-20 10:27:31
18510
18514
  * @LastEditors: binruan@chatlabs.com
18511
- * @LastEditTime: 2025-05-06 18:19:21
18515
+ * @LastEditTime: 2025-05-07 13:33:18
18512
18516
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
18513
18517
  *
18514
18518
  */
@@ -18703,7 +18707,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
18703
18707
  }, [minusHeight, containerHeight, tagHeight]);
18704
18708
  const visList = useMemo(() => {
18705
18709
  var _a;
18706
- const list = activeIndex === 0 && !waterFallData && !isEditor
18710
+ const list = activeIndex === 0 && !waterFallData && !isEditor && !isDiyH5
18707
18711
  ? [(_a = data === null || data === void 0 ? void 0 : data[0]) !== null && _a !== void 0 ? _a : null]
18708
18712
  : data === null || data === void 0 ? void 0 : data.map((item, index) => {
18709
18713
  if (activeIndex === index || index - 1 === activeIndex || index + 1 === activeIndex) {
@@ -18715,8 +18719,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
18715
18719
  });
18716
18720
  if (!(list === null || list === void 0 ? void 0 : list.length))
18717
18721
  return [];
18718
- return !waterFallData && !isNoMoreData ? list.concat([{ loading: true }]) : list;
18719
- }, [data, activeIndex, waterFallData, isEditor, isNoMoreData]);
18722
+ return !waterFallData && !isNoMoreData && !isDiyH5 ? list.concat([{ loading: true }]) : list;
18723
+ }, [data, activeIndex, waterFallData, isEditor, isNoMoreData, isDiyH5]);
18720
18724
  const renderLogo = useMemo(() => {
18721
18725
  var _a, _b, _c, _d;
18722
18726
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {