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

package/dist/pb-ui.js

@@ -444,39 +444,6 @@
         })
     };
 
-    function useEditor() {
-        return React.useContext(EditorContext);
-    }
-
-    function useDataSource() {
-        return React.useContext(DataSourceContext);
-    }
-
-    const feRealSessionIdKey = 'feRealSessionIdKey';
-    const generateFeSessionId = () => {
-        const uid = getUid(); // 32位长度
-        const timestamp = Date.now(); // 13位长度
-        const result = `${timestamp}${uid}`; // 总共45位长度的唯一ID
-        return result;
-    };
-    // 生成或者获取sessionID
-    const storeAndLoadFeSessionId = () => {
-        let result = getFeSessionId();
-        if (!result) {
-            result = generateFeSessionId();
-            window.localStorage.setItem(feRealSessionIdKey, result);
-        }
-        return result;
-    };
-    const refreshFeSessionId = () => {
-        const result = generateFeSessionId();
-        window.localStorage.setItem(feRealSessionIdKey, result);
-    };
-    // 获取 sessionID
-    const getFeSessionId = () => {
-        return window.localStorage.getItem(feRealSessionIdKey);
-    };
-
     /*
      * @Author: binruan@chatlabs.com
      * @Date: 2024-03-20 10:27:31
@@ -528,6 +495,39 @@
         window.localStorage.setItem(USER_CONSENT_RESULT_KEY, 'true');
     };
 
+    function useEditor() {
+        return React.useContext(EditorContext);
+    }
+
+    function useDataSource() {
+        return React.useContext(DataSourceContext);
+    }
+
+    const feRealSessionIdKey = 'feRealSessionIdKey';
+    const generateFeSessionId = () => {
+        const uid = getUid(); // 32位长度
+        const timestamp = Date.now(); // 13位长度
+        const result = `${timestamp}${uid}`; // 总共45位长度的唯一ID
+        return result;
+    };
+    // 生成或者获取sessionID
+    const storeAndLoadFeSessionId = () => {
+        let result = getFeSessionId();
+        if (!result) {
+            result = generateFeSessionId();
+            window.localStorage.setItem(feRealSessionIdKey, result);
+        }
+        return result;
+    };
+    const refreshFeSessionId = () => {
+        const result = generateFeSessionId();
+        window.localStorage.setItem(feRealSessionIdKey, result);
+    };
+    // 获取 sessionID
+    const getFeSessionId = () => {
+        return window.localStorage.getItem(feRealSessionIdKey);
+    };
+
     /*
      * @Author: binruan@chatlabs.com
      * @Date: 2024-03-20 10:27:31
@@ -772,17 +772,16 @@
         }, [bffDataSource]);
         // 获取推荐视频数据
         const getRecommendVideos = React.useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
-            var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
-            query = Object.assign({ maxSize: (_f = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _f !== void 0 ? _f : maxSize, defaultSize: (_g = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _g !== void 0 ? _g : defaultSize, hashTag: query === null || query === void 0 ? void 0 : query.hashTag, traceInfo: query === null || query === void 0 ? void 0 : query.traceInfo, themeTag: query === null || query === void 0 ? void 0 : query.themeTag, pageNum: query === null || query === void 0 ? void 0 : query.pageNum, contentFilter: query === null || query === void 0 ? void 0 : query.contentFilter, productFilter: query === null || query === void 0 ? void 0 : query.productFilter }, (chatlabsId && { chatlabsId }));
+            var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+            query = Object.assign({ maxSize: 50, defaultSize: 50, hashTag: query === null || query === void 0 ? void 0 : query.hashTag, traceInfo: query === null || query === void 0 ? void 0 : query.traceInfo, themeTag: query === null || query === void 0 ? void 0 : query.themeTag, pageNum: query === null || query === void 0 ? void 0 : query.pageNum, contentFilter: query === null || query === void 0 ? void 0 : query.contentFilter, productFilter: query === null || query === void 0 ? void 0 : query.productFilter }, (chatlabsId && { chatlabsId }));
             if (channel) {
                 query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
             }
             else if (utmVal) {
-                const val = (_k = (_j = (_h = splitUrlParams(utmVal)) === null || _h === void 0 ? void 0 : _h.filter((val) => {
-                    var _a, _b;
+                const val = (_h = (_g = (_f = splitUrlParams(utmVal)) === null || _f === void 0 ? void 0 : _f.filter((val) => {
                     const key = val.split('=')[0];
-                    return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
-                })) === null || _j === void 0 ? void 0 : _j.join('&')) !== null && _k !== void 0 ? _k : '';
+                    return key;
+                })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
                 if (val)
                     query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
             }
@@ -796,19 +795,19 @@
                 let list = [];
                 let result = null;
                 const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
-                    var _v, _w, _x, _y, _z, _0;
+                    var _t, _u, _v, _w, _x, _y;
                     query.pageNum = pageNum;
                     result = yield (bffFetchAdmin === null || bffFetchAdmin === void 0 ? void 0 : bffFetchAdmin('recommend/direct_page', { method: 'POST', body: query }));
                     if (!(result === null || result === void 0 ? void 0 : result.success)) {
                         return undefined;
                     }
                     setLoading(false);
-                    list = list.concat((_y = (_x = (_w = (_v = result === null || result === void 0 ? void 0 : result.data) === null || _v === void 0 ? void 0 : _v.recList) === null || _w === void 0 ? void 0 : _w.filter) === null || _x === void 0 ? void 0 : _x.call(_w, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _y !== void 0 ? _y : []);
+                    list = list.concat((_w = (_v = (_u = (_t = result === null || result === void 0 ? void 0 : result.data) === null || _t === void 0 ? void 0 : _t.recList) === null || _u === void 0 ? void 0 : _u.filter) === null || _v === void 0 ? void 0 : _v.call(_u, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _w !== void 0 ? _w : []);
                     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 })));
                     }
-                    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));
+                    const isNotNullList = (_y = (_x = result === null || result === void 0 ? void 0 : result.data) === null || _x === void 0 ? void 0 : _x.recList) === null || _y === void 0 ? void 0 : _y.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
                     if (isNotNullList) {
                         pageNum = pageNum + 1;
                         yield recurveRecList(query);
@@ -816,13 +815,13 @@
                 });
                 yield recurveRecList(query);
                 if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
-                    setCurReqInfo({ rtc: (_l = result === null || result === void 0 ? void 0 : result.data) === null || _l === void 0 ? void 0 : _l.rtc, requestId: (_m = result === null || result === void 0 ? void 0 : result.data) === null || _m === void 0 ? void 0 : _m.requestId });
+                    setCurReqInfo({ rtc: (_j = result === null || result === void 0 ? void 0 : result.data) === null || _j === void 0 ? void 0 : _j.rtc, requestId: (_k = result === null || result === void 0 ? void 0 : result.data) === null || _k === void 0 ? void 0 : _k.requestId });
                 return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
             }
             if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
-                query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (_o = query === null || query === void 0 ? void 0 : query.pageNum) !== null && _o !== void 0 ? _o : 1 });
+                query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (_l = query === null || query === void 0 ? void 0 : query.pageNum) !== null && _l !== void 0 ? _l : 1 });
             }
-            const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', { method: 'POST', body: query }));
+            const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct', { method: 'POST', body: query }));
             if (!(result === null || result === void 0 ? void 0 : result.success)) {
                 return undefined;
             }
@@ -830,8 +829,8 @@
                 setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
             if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
                 let list = [];
-                list = list.concat((_s = (_r = (_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.recList) === null || _q === void 0 ? void 0 : _q.filter) === null || _r === void 0 ? void 0 : _r.call(_q, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _s !== void 0 ? _s : []);
-                const isNotNullList = (_u = (_t = result === null || result === void 0 ? void 0 : result.data) === null || _t === void 0 ? void 0 : _t.recList) === null || _u === void 0 ? void 0 : _u.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
+                list = list.concat((_q = (_p = (_o = (_m = result === null || result === void 0 ? void 0 : result.data) === null || _m === void 0 ? void 0 : _m.recList) === null || _o === void 0 ? void 0 : _o.filter) === null || _p === void 0 ? void 0 : _p.call(_o, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _q !== void 0 ? _q : []);
+                const isNotNullList = (_s = (_r = result === null || result === void 0 ? void 0 : result.data) === null || _r === void 0 ? void 0 : _r.recList) === null || _s === void 0 ? void 0 : _s.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
                 if (!isNotNullList) {
                     setIsNoMoreData(true);
                 }
@@ -840,12 +839,12 @@
             return result === null || result === void 0 ? void 0 : result.data;
         }), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList, channel, chatlabsId, bffFetchAdmin]);
         const loadVideos = React.useCallback((pageNum) => __awaiter(void 0, void 0, void 0, function* () {
-            var _1, _2, _3, _4;
+            var _z, _0, _1, _2;
             if (rtcList.length <= 0) {
                 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 })));
+            const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((_z = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _z === void 0 ? void 0 : _z.itemId) && { productFilter: [(_0 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _0 === void 0 ? void 0 : _0.itemId] })), (((_1 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _1 === void 0 ? void 0 : _1.itemId) && { contentFilter: [(_2 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _2 === void 0 ? void 0 : _2.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;
@@ -1010,18 +1009,18 @@
         }), [bffFetch]);
         // 获取 Tag
         const bffGetTagList = React.useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
-            var _5, _6, _7, _8, _9, _10, _11, _12;
-            const isShowTag = !!((_7 = (_6 = (_5 = data === null || data === void 0 ? void 0 : data.data) === null || _5 === void 0 ? void 0 : _5.sxpPageConf) === null || _6 === void 0 ? void 0 : _6.globalConfig) === null || _7 === void 0 ? void 0 : _7.isShowTag);
+            var _3, _4, _5, _6, _7, _8, _9, _10;
+            const isShowTag = !!((_5 = (_4 = (_3 = data === null || data === void 0 ? void 0 : data.data) === null || _3 === void 0 ? void 0 : _3.sxpPageConf) === null || _4 === void 0 ? void 0 : _4.globalConfig) === null || _5 === void 0 ? void 0 : _5.isShowTag);
             if (!utmVal || !isShowTag)
                 return;
             try {
-                const val = (_10 = (_9 = (_8 = splitUrlParams(utmVal)) === null || _8 === void 0 ? void 0 : _8.filter((val) => {
+                const val = (_8 = (_7 = (_6 = splitUrlParams(utmVal)) === null || _6 === void 0 ? void 0 : _6.filter((val) => {
                     var _a, _b;
                     const key = val.split('=')[0];
                     return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
-                })) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
+                })) === null || _7 === void 0 ? void 0 : _7.join('&')) !== null && _8 !== void 0 ? _8 : '';
                 const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
-                setTagList((_12 = (_11 = result === null || result === void 0 ? void 0 : result.data) === null || _11 === void 0 ? void 0 : _11.tags) !== null && _12 !== void 0 ? _12 : []);
+                setTagList((_10 = (_9 = result === null || result === void 0 ? void 0 : result.data) === null || _9 === void 0 ? void 0 : _9.tags) !== null && _10 !== void 0 ? _10 : []);
             }
             catch (e) {
                 console.log('e', e);
@@ -1081,10 +1080,10 @@
             });
         }, [bffEventReport]);
         const getAccount = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
-            var _13, _14;
+            var _11, _12;
             const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account', { method: 'GET' }));
-            setChatlabsId((_13 = res === null || res === void 0 ? void 0 : res.data) === null || _13 === void 0 ? void 0 : _13.chatLabsId);
-            return ((_14 = res === null || res === void 0 ? void 0 : res.data) === null || _14 === void 0 ? void 0 : _14.consentResult) === 'true';
+            setChatlabsId((_11 = res === null || res === void 0 ? void 0 : res.data) === null || _11 === void 0 ? void 0 : _11.chatLabsId);
+            return ((_12 = res === null || res === void 0 ? void 0 : res.data) === null || _12 === void 0 ? void 0 : _12.consentResult) === 'true';
         }), [bffFetch]);
         const accountSonsent = React.useCallback((consentResult) => __awaiter(void 0, void 0, void 0, function* () {
             const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account/consent', {
@@ -18314,7 +18313,7 @@ Made in Italy` })));
      * @Author: binruan@chatlabs.com
      * @Date: 2023-12-26 16:11:34
      * @LastEditors: binruan@chatlabs.com
-     * @LastEditTime: 2025-03-26 19:32:00
+     * @LastEditTime: 2025-03-28 14:46:08
      * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\RenderCard.tsx
      *
      */
@@ -19079,7 +19078,7 @@ Made in Italy` })));
             React.createElement(ConsentPopup, { resolver: resolver, globalConfig: globalConfig }),
             openMultiPosts && (React.createElement(MultiPosts$2, Object.assign({}, (_x = (_w = (_v = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _v === void 0 ? void 0 : _v[0]) === null || _w === void 0 ? void 0 : _w.item) === null || _x === void 0 ? void 0 : _x.props, (_0 = (_z = (_y = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _y === void 0 ? void 0 : _y[0]) === null || _z === void 0 ? void 0 : _z.item) === null || _0 === void 0 ? void 0 : _0.event, { style: { position: 'fixed', top: 0, left: 0, right: 0 } })))))));
     };
-    var SxpPageRender$1 = React.memo(SxpPageRender);
+    var index$2 = React.memo(SxpPageRender);
 
     const PictureGroup$2 = ({ imgUrls, width, height, imgUrlsPostConfig, rec, index }) => {
         return (React.createElement(Swiper, { defaultValue: 0, direction: 'horizontal', modules: [Pagination, Autoplay], pagination: {
@@ -19443,7 +19442,7 @@ Made in Italy` })));
             return renderView(rec, index);
         })));
     };
-    var index$2 = React.memo(DiyPortalPreview);
+    var index$1 = React.memo(DiyPortalPreview);
 
     const PictureGroup = ({ imgUrls, width, height, imgUrlsPostConfig, rec, index, swiperRef, data = [], loopPlay }) => {
         const { isActive } = useSwiperSlide();
@@ -19476,7 +19475,7 @@ Made in Italy` })));
     };
     var PictureGroup$1 = React.memo(PictureGroup);
 
-    const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, width, swiperRef, loopPlay }) => {
+    const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, width, swiperRef, loopPlay, videoPlayIcon, isPlay }) => {
         const { isActive } = useSwiperSlide();
         const [isPauseVideo, setIsPauseVideo] = React.useState(false);
         const videoRef = React.useRef(null);
@@ -19497,7 +19496,7 @@ Made in Italy` })));
             var _a;
             (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
         }, []);
-        useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
+        const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
         const handlePlaying = React.useCallback(() => {
             var _a, _b, _c, _d, _e, _f;
             setIsPauseVideo(false);
@@ -19535,6 +19534,9 @@ Made in Italy` })));
                     break;
                 default:
                     if (isPause) {
+                        // if (videoRef?.current?.currentTime >= rec?.endTime) {
+                        //   videoRef.current.currentTime = rec?.startTime;
+                        // }
                         (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
                     }
                     else {
@@ -19583,6 +19585,14 @@ Made in Italy` })));
                 (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
             }
         }, []);
+        // useEffect(() => {
+        //   if (!videoRef.current || !isActive) return;
+        //   if (isPlay) {
+        //     videoRef.current?.play();
+        //   } else {
+        //     videoRef.current?.pause();
+        //   }
+        // }, [isPlay, isActive]);
         const handlePause = () => {
             var _a, _b, _c, _d, _e, _f;
             if (!videoRef.current || !isActive)
@@ -19597,15 +19607,6 @@ Made in Italy` })));
                 (_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);
             }
         };
-        // useEffect(() => {
-        //   if (!videoRef.current) return;
-        //   if (!isActive) return;
-        //   if (!loopPlay) {
-        //     videoRef?.current?.pause();
-        //   } else {
-        //     videoRef?.current?.play();
-        //   }
-        // }, [loopPlay, isActive]);
         React.useEffect(() => {
             var _a, _b, _c;
             if (!isActive)
@@ -19652,7 +19653,7 @@ Made in Italy` })));
                 (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.removeEventListener('timeupdate', handleTimeUpload);
             };
         }, [handleLoadedMetadata, handlePlaying, rec, handLoadeddata, isActive, loopPlay]);
-        React.useMemo(() => {
+        const renderPoster = React.useMemo(() => {
             if (!(sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image) || isLoadFinish) {
                 return null;
             }
@@ -19669,14 +19670,35 @@ Made in Italy` })));
         if (!(rec === null || rec === void 0 ? void 0 : rec.mediaUrl)) {
             return null;
         }
+        // const renderLoading = useMemo(() => {
+        //     if (!waiting || !isLoadFinish) return;
+        //     return (
+        //       <img
+        //         style={{
+        //           position: 'absolute',
+        //           top: '50%',
+        //           left: 0,
+        //           right: 0,
+        //           transform: 'translateY(-100%)',
+        //           margin: 'auto',
+        //           width: '50px',
+        //           height: '50px',
+        //           objectFit: 'contain'
+        //         }}
+        //         src={loading_gif}
+        //         alt='placeholder image'
+        //       />
+        //     );
+        // }, [waiting, isLoadFinish]);
         return (React.createElement("div", { className: 'video-container', key: rec.itemId, style: {
                 position: 'relative',
                 width: '100%',
                 height,
-                overflow: 'hidden',
-                pointerEvents: 'none'
+                overflow: 'hidden'
             } },
-            React.createElement("div", { className: 'n-full-screen', id: videoId, style: { width: '100%', height: '100%' } })));
+            React.createElement("div", { className: 'n-full-screen', id: videoId, style: { width: '100%', height: '100%' } }),
+            renderPoster,
+            isPauseVideo && React.createElement(FormatImage$1, { className: 'clc-pb-video-pause', src: videoPlayIcon !== null && videoPlayIcon !== void 0 ? videoPlayIcon : PAUSE_ICON, alt: 'pause' })));
     };
     var VideoWidget$1 = React.memo(VideoWidget);
 
@@ -19684,16 +19706,10 @@ Made in Italy` })));
      * @Author: binruan@chatlabs.com
      * @Date: 2025-03-25 13:54:27
      * @LastEditors: binruan@chatlabs.com
-     * @LastEditTime: 2025-03-26 22:40:52
+     * @LastEditTime: 2025-03-28 18:08:02
      * @FilePath: \pb-sxp-ui\src\core\components\DiyStoryPreview\index.tsx
      *
      */
-    const RESOLVER$1 = {};
-    Object.values(_materials_).forEach((v) => {
-        RESOLVER$1[v.extend.type] = v;
-    });
-    const defaultUnLikeIconPath = '/pb_static/f71266d2c64446c5ae6a5a7f5489cc0a.png';
-    const defaultLikeIconPath = '/pb_static/f07900fe3f0f4ae188ea1611d4801a44.png';
     const recData = {
         position: 0,
         isCollected: false,
@@ -19872,7 +19888,14 @@ Made in Italy` })));
             ]
         }
     };
-    const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, descStyle, hashTagStyle, containerHeight = 664, containerWidth = 375, appDomain, tagList = [], scenes, onActiveChange, activeIndex, loopPlay = false }) => {
+    const RESOLVER$1 = {};
+    Object.values(_materials_).forEach((v) => {
+        RESOLVER$1[v.extend.type] = v;
+    });
+    const defaultUnLikeIconPath = '/pb_static/f71266d2c64446c5ae6a5a7f5489cc0a.png';
+    const defaultLikeIconPath = '/pb_static/f07900fe3f0f4ae188ea1611d4801a44.png';
+    const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, descStyle, hashTagStyle, containerHeight = 664, containerWidth = 375, appDomain, tagList = [], scenes, onActiveChange, activeIndex, loopPlay = false, pointerEvents = 'none', isPlay }) => {
+        const [loopPlaySwiper, setLooPlaySwiper] = React.useState(loopPlay);
         const swiperRef = React.useRef(null);
         React.useMemo(() => {
             let minusHeight = 0;
@@ -19898,10 +19921,10 @@ Made in Italy` })));
         const renderContent = (rec, index) => {
             const isVideo = isVideoUrl(rec === null || rec === void 0 ? void 0 : rec.mediaUrl);
             if (isVideo) {
-                return (React.createElement(VideoWidget$1, { rec: rec, index: index, muted: true, width: containerWidth, data: scenes !== null && scenes !== void 0 ? scenes : [], height: containerHeight, activeIndex: index, videoPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.videoPost, swiperRef: swiperRef, loopPlay: loopPlay }));
+                return (React.createElement(VideoWidget$1, { isPlay: isPlay, rec: rec, index: index, muted: true, width: containerWidth, data: scenes !== null && scenes !== void 0 ? scenes : [], height: containerHeight, activeIndex: index, videoPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.videoPost, videoPlayIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.videoPlayIcon, swiperRef: swiperRef, loopPlay: loopPlaySwiper }));
             }
             else {
-                return (React.createElement(PictureGroup$1, { key: rec.itemId, imgUrls: [rec === null || rec === void 0 ? void 0 : rec.mediaUrl], width: containerWidth, height: containerHeight, rec: rec, index: index, imgUrlsPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.imgUrlsPost, data: scenes !== null && scenes !== void 0 ? scenes : [], swiperRef: swiperRef, loopPlay: loopPlay }));
+                return (React.createElement(PictureGroup$1, { key: rec.itemId, imgUrls: [rec === null || rec === void 0 ? void 0 : rec.mediaUrl], width: containerWidth, height: containerHeight, rec: rec, index: index, imgUrlsPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.imgUrlsPost, data: scenes !== null && scenes !== void 0 ? scenes : [], swiperRef: swiperRef, loopPlay: loopPlaySwiper }));
             }
         };
         React.useMemo(() => {
@@ -19934,7 +19957,7 @@ Made in Italy` })));
                             width: '100%',
                             willChange: 'transform',
                             zIndex: 2,
-                            pointerEvents: 'none'
+                            pointerEvents
                         } })),
                     React.createElement("div", { style: {
                             marginBottom: `${(_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _g !== void 0 ? _g : 40}px`,
@@ -20018,6 +20041,7 @@ Made in Italy` })));
             var _a, _b, _c, _d;
             const rec = lodash.cloneDeep(recData);
             rec.video.bindProducts = item === null || item === void 0 ? void 0 : item.bindProducts;
+            rec.video.title = (item === null || item === void 0 ? void 0 : item.title) || '';
             return (React.createElement("div", { style: { position: 'relative' } },
                 React.createElement(SwiperSlide, { key: index, virtualIndex: index, style: { overflow: 'hidden', position: 'relative' } },
                     renderBottom(rec, index),
@@ -20039,28 +20063,47 @@ Made in Italy` })));
             (_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(activeIndex);
         }, [activeIndex]);
         React.useEffect(() => {
-            var _a, _b;
             if (!(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current))
                 return;
-            (_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);
+            // swiperRef?.current?.swiper?.slideTo(0);
+            setLooPlaySwiper(loopPlay);
         }, [loopPlay]);
+        const handleSessionExpire = React.useCallback(lodash.debounce(() => {
+            setLooPlaySwiper(false);
+        }, 1000), []);
+        React.useEffect(() => {
+            const events = ['touchstart', 'touchcancel'];
+            events.forEach((event) => {
+                window.addEventListener(event, handleSessionExpire);
+            });
+            return () => {
+                events.forEach((event) => {
+                    window.removeEventListener(event, handleSessionExpire);
+                });
+            };
+        }, [handleSessionExpire]);
         return (React.createElement("div", { id: 'sxp-render', 
             // className={style['clc-sxp-container']}
-            style: { height: containerHeight, position: 'relative', pointerEvents: 'none' } },
-            React.createElement(Swiper, { ref: swiperRef, allowTouchMove: false, onActiveIndexChange: (swiper) => {
+            style: { height: containerHeight, position: 'relative', pointerEvents } },
+            React.createElement(Swiper, { ref: swiperRef, allowTouchMove: pointerEvents !== 'none', onSlideChange: () => {
+                    swiperRef.current.swiper.allowTouchMove = false;
+                    setTimeout(() => {
+                        swiperRef.current.swiper.allowTouchMove = true;
+                    }, 500);
+                }, onActiveIndexChange: (swiper) => {
                     // setActiveIndex(swiper.activeIndex);
                     onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(swiper.activeIndex);
                 }, direction: 'vertical', style: { overflow: 'hidden', height: containerHeight }, height: containerHeight }, scenes === null || scenes === void 0 ? void 0 : scenes.map((rec, index) => {
                 return renderView(rec, index);
             }))));
     };
-    var index$1 = React.memo(DiyStoryPreview);
+    var DiyStoryPreview$1 = React.memo(DiyStoryPreview);
 
     /*
      * @Author: binruan@chatlabs.com
      * @Date: 2023-10-31 10:56:01
      * @LastEditors: binruan@chatlabs.com
-     * @LastEditTime: 2024-10-23 15:07:29
+     * @LastEditTime: 2025-03-28 17:15:47
      * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Popup\index.tsx
      *
      */
@@ -20152,17 +20195,9 @@ Made in Italy` })));
 
     /*
      * @Author: binruan@chatlabs.com
-     * @Date: 2024-01-15 19:03:09
-     * @LastEditors: binruan@chatlabs.com
-     * @LastEditTime: 2025-02-24 15:47:44
-     * @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
-     *
-     */
-    /*
-     * @Author: binruan@chatlabs.com
-     * @Date: 2023-11-24 15:58:00
+     * @Date: 2024-03-20 10:27:31
      * @LastEditors: binruan@chatlabs.com
-     * @LastEditTime: 2023-12-26 10:24:42
+     * @LastEditTime: 2025-03-28 16:55:21
      * @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
      *
      */
@@ -20170,20 +20205,20 @@ Made in Italy` })));
     Object.values(_materials_).forEach((v) => {
         RESOLVER[v.extend.type] = v;
     });
-    const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, loadingImage, appDomain, enabledMetaConversionApi, dataList }) => {
-        var _a, _b, _c, _d, _e, _f;
+    const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, loadingImage, appDomain, enabledMetaConversionApi, dataList, pointerEvents }) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         const utmVal = React.useMemo(() => {
             var _a;
             const searchParams = (location === null || location === void 0 ? void 0 : location.search) ? (_a = location === null || location === void 0 ? void 0 : location.search) === null || _a === void 0 ? void 0 : _a.replace('?', '') : '';
             return searchParams;
         }, []);
-        const [_schema, setSchema] = React.useState(data === null || data === void 0 ? void 0 : data.data);
+        const [_schema, setSchema] = React.useState((_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.data);
         const [channel, setChannel] = React.useState();
         return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: _schema, utmVal: channel || utmVal },
-            React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, utmParameter: data === null || data === void 0 ? void 0 : data.utm_parameter, data: data, dataList: dataList, onUpdateSchema: (d) => setSchema(d), onUpdateChannel: (d) => setChannel(d), render: ({ rtcList, tagList, pageData }) => {
-                    var _a;
+            React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_c = (_b = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _b === void 0 ? void 0 : _b.personalized_recommend) !== null && _c !== void 0 ? _c : maxSize, defaultSize: (_e = (_d = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _d === void 0 ? void 0 : _d.default_recommend) !== null && _e !== void 0 ? _e : defaultSize, hashTagSize: (_g = (_f = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _f === void 0 ? void 0 : _f.hash_tag_size) !== null && _g !== void 0 ? _g : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, utmParameter: data === null || data === void 0 ? void 0 : data.utm_parameter, data: Object.assign(Object.assign({}, data), { data: (_h = data === null || data === void 0 ? void 0 : data.data) === null || _h === void 0 ? void 0 : _h.data }), dataList: dataList, onUpdateSchema: (d) => setSchema(d), onUpdateChannel: (d) => setChannel(d), render: ({ rtcList, tagList, pageData }) => {
+                    var _a, _b;
                     return (React.createElement(React.Fragment, null,
-                        React.createElement(SxpPageRender$1, Object.assign({ defaultData: data }, (_a = pageData === null || pageData === void 0 ? void 0 : pageData.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER })),
+                        React.createElement(DiyStoryPreview$1, Object.assign({ defaultData: Object.assign(Object.assign({}, data), { data: (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.data }) }, (_b = pageData === null || pageData === void 0 ? void 0 : pageData.data) === null || _b === void 0 ? void 0 : _b.sxpPageConf, { tagList: tagList, scenes: rtcList, resolver: RESOLVER, containerHeight: window === null || window === void 0 ? void 0 : window.innerHeight, pointerEvents: pointerEvents, loopPlay: true })),
                         React.createElement(Popup, null)));
                 } })));
     };
@@ -20197,13 +20232,13 @@ Made in Italy` })));
      * @FilePath: \pb-sxp-ui\src\index.ts
      */
 
-    exports.DiyPortalPreview = index$2;
-    exports.DiyStoryPreview = index$1;
+    exports.DiyPortalPreview = index$1;
+    exports.DiyStoryPreview = DiyStoryPreview$1;
     exports.EditorDataProvider = EditorDataProvider;
     exports.Modal = Modal$1;
     exports.SxpDataSourceProvider = SxpDataSourceProvider$1;
     exports.SxpPageCore = index;
-    exports.SxpPageRender = SxpPageRender$1;
+    exports.SxpPageRender = index$2;
     exports.core = index$3;
     exports.default = Pagebuilder;
     exports.materials = _materials_;