pb-sxp-ui 1.16.10 → 1.16.11

package/dist/index.cjs

@@ -644,6 +644,7 @@ const DEFAULT_TAG = 'FOR U';
 const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isOpenConsent = false, isEditor = false, utmParameter, channelQueryList, data, dataList, isDiyH5, onUpdateSchema, onUpdateChannel }) => {
     var _a, _b, _c, _d, _e;
     const [rtcList, setRtcList] = React.useState([]);
+    const [firstRtcList, setFirstRtcList] = React.useState([]);
     const [tagList, setTagList] = React.useState([]);
     const [loading, setLoading] = React.useState(true);
     const [curReqInfo, setCurReqInfo] = React.useState({ rtc: '', requestId: '' });
@@ -814,6 +815,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
                 if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
                     setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
                     setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
+                    if (isDiyH5) {
+                        setFirstRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
+                    }
                 }
                 const isNotNullList = (_0 = (_z = result === null || result === void 0 ? void 0 : result.data) === null || _z === void 0 ? void 0 : _z.recList) === null || _0 === void 0 ? void 0 : _0.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
                 if (isNotNullList) {
@@ -853,12 +857,17 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         if (rtcList.length <= 0) {
             return;
         }
+        if (isDiyH5 && (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) > 0) {
+            setRtcList(rtcList.concat(firstRtcList));
+            setCacheRtcList(cacheRtcList.concat(firstRtcList));
+            return;
+        }
         const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
         const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((_1 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _1 === void 0 ? void 0 : _1.itemId) && { productFilter: [(_2 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _2 === void 0 ? void 0 : _2.itemId] })), (((_3 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _3 === void 0 ? void 0 : _3.itemId) && { contentFilter: [(_4 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _4 === void 0 ? void 0 : _4.itemId] })), { themeTag: themeTag.current }), ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor && { pageNum })));
         setRtcList(rtcList.concat(getFilterRecList(data)));
         setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
         return data;
-    }), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
+    }), [getRecommendVideos, rtcList, waterFallData, cacheRtcList, isDiyH5, firstRtcList]);
     const refreshFeSession = React.useCallback((enableReSid, event) => {
         var _a, _b, _c, _d, _e;
         let expire = false;
@@ -1205,6 +1214,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
                 }
                 setRtcList(list);
                 setCacheRtcList(list);
+                if (isDiyH5) {
+                    setFirstRtcList(list);
+                }
                 bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
                 if (channel) {
                     const item = list === null || list === void 0 ? void 0 : list[0];
@@ -1240,6 +1252,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
                 }
                 setRtcList(list);
                 setCacheRtcList(list);
+                if (isDiyH5) {
+                    setFirstRtcList(list);
+                }
             }
         })
             .finally(() => {
@@ -17936,23 +17951,21 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
         (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
     }, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
     const handleEnd = () => {
-        var _a, _b, _c, _d, _e, _f, _g, _h;
+        var _a, _b, _c, _d, _e, _f;
         if (!videoRef.current)
             return;
         if (isDiyH5) {
             (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
             if (!loopPlayRef.current)
                 return;
-            if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
-                (_c = (_b = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _b === void 0 ? void 0 : _b.swiper) === null || _c === void 0 ? void 0 : _c.slideTo(0);
-            }
+            if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) ;
             else {
-                const i = (_e = (_d = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _d === void 0 ? void 0 : _d.swiper) === null || _e === void 0 ? void 0 : _e.activeIndex;
-                (_g = (_f = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _f === void 0 ? void 0 : _f.swiper) === null || _g === void 0 ? void 0 : _g.slideTo(i + 1);
+                const i = (_c = (_b = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _b === void 0 ? void 0 : _b.swiper) === null || _c === void 0 ? void 0 : _c.activeIndex;
+                (_e = (_d = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _d === void 0 ? void 0 : _d.swiper) === null || _e === void 0 ? void 0 : _e.slideTo(i + 1);
             }
         }
         else {
-            (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.play();
+            (_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.play();
         }
     };
     const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
@@ -18357,15 +18370,13 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
         let timerId;
         if (isLoad && isActive && isDiyH5) {
             timerId = setTimeout(() => {
-                var _a, _b, _c, _d, _e, _f;
+                var _a, _b, _c, _d;
                 if (!loopPlayRef.current)
                     return;
-                if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
-                    (_b = (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper) === null || _b === void 0 ? void 0 : _b.slideTo(0);
-                }
+                if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) ;
                 else {
-                    const i = (_d = (_c = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _c === void 0 ? void 0 : _c.swiper) === null || _d === void 0 ? void 0 : _d.activeIndex;
-                    (_f = (_e = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _e === void 0 ? void 0 : _e.swiper) === null || _f === void 0 ? void 0 : _f.slideTo(i + 1);
+                    const i = (_b = (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper) === null || _b === void 0 ? void 0 : _b.activeIndex;
+                    (_d = (_c = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _c === void 0 ? void 0 : _c.swiper) === null || _d === void 0 ? void 0 : _d.slideTo(i + 1);
                 }
             }, 3000);
         }
@@ -18373,7 +18384,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
             if (timerId)
                 clearTimeout(timerId);
         };
-    }, [isLoad, isActive, isDiyH5, data, index, swiperRef]);
+    }, [isLoad, isActive, isDiyH5, index, swiperRef]);
     React.useEffect(() => {
         if (isLoad && isActive) {
             (imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
@@ -19331,15 +19342,20 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
                     swiperRef.current.swiper.allowTouchMove = true;
                 }, 500);
             }, onActiveIndexChange: (swiper) => {
+                var _a, _b;
                 setActiveIndex(swiper.activeIndex);
                 if (openHashtag)
                     return;
                 // 处理上滑下滑事件
                 handleScrollEvent(swiper);
-                if (waterFallData || isEditor || isDiyH5)
+                if (waterFallData || isEditor)
                     return;
                 if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
                     if (!isLoadMore) {
+                        if (isDiyH5) {
+                            (_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
+                            (_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
+                        }
                         setIsLoadMore(true);
                         loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
                             var _a;