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

package/dist/index.cjs

@@ -451,39 +451,6 @@ const Pagebuilder = {
     })
 };
 
-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
@@ -535,6 +502,39 @@ const setUserConsentResult = () => {
     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
@@ -779,17 +779,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
     }, [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) });
         }
@@ -803,19 +802,19 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             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);
@@ -823,13 +822,13 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             });
             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;
         }
@@ -837,8 +836,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             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);
             }
@@ -847,12 +846,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         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;
@@ -1017,18 +1016,18 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
     }), [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);
@@ -1088,10 +1087,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         });
     }, [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', {
@@ -18321,7 +18320,7 @@ function withBindDataSource(Component) {
  * @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
  *
  */
@@ -19086,7 +19085,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
         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: {
@@ -19450,7 +19449,7 @@ const DiyPortalPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, de
         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();
@@ -19483,7 +19482,7 @@ const PictureGroup = ({ imgUrls, width, height, imgUrlsPostConfig, rec, index, s
 };
 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);
@@ -19504,7 +19503,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
         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);
@@ -19542,6 +19541,9 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
                 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 {
@@ -19590,6 +19592,14 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
             (_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)
@@ -19604,15 +19614,6 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
             (_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)
@@ -19659,7 +19660,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
             (_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;
         }
@@ -19676,14 +19677,35 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
     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);
 
@@ -19691,16 +19713,10 @@ var VideoWidget$1 = React.memo(VideoWidget);
  * @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,
@@ -19879,7 +19895,14 @@ const recData = {
         ]
     }
 };
-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;
@@ -19905,10 +19928,10 @@ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, des
     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(() => {
@@ -19941,7 +19964,7 @@ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, des
                         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`,
@@ -20025,6 +20048,7 @@ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, des
         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),
@@ -20046,28 +20070,47 @@ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, des
         (_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
  *
  */
@@ -20159,17 +20202,9 @@ const Popup = () => {
 
 /*
  * @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
  *
  */
@@ -20177,20 +20212,20 @@ const RESOLVER = {};
 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)));
             } })));
 };
@@ -20204,13 +20239,13 @@ var index = React.memo(SxpPageCore);
  * @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_;