pb-sxp-ui 1.15.13-alpha.3 → 1.15.13-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
@@ -429,39 +429,6 @@ const Pagebuilder = {
429
429
  })
430
430
  };
431
431
 
432
- function useEditor() {
433
- return useContext(EditorContext);
434
- }
435
-
436
- function useDataSource() {
437
- return useContext(DataSourceContext);
438
- }
439
-
440
- const feRealSessionIdKey = 'feRealSessionIdKey';
441
- const generateFeSessionId = () => {
442
- const uid = getUid(); // 32位长度
443
- const timestamp = Date.now(); // 13位长度
444
- const result = `${timestamp}${uid}`; // 总共45位长度的唯一ID
445
- return result;
446
- };
447
- // 生成或者获取sessionID
448
- const storeAndLoadFeSessionId = () => {
449
- let result = getFeSessionId();
450
- if (!result) {
451
- result = generateFeSessionId();
452
- window.localStorage.setItem(feRealSessionIdKey, result);
453
- }
454
- return result;
455
- };
456
- const refreshFeSessionId = () => {
457
- const result = generateFeSessionId();
458
- window.localStorage.setItem(feRealSessionIdKey, result);
459
- };
460
- // 获取 sessionID
461
- const getFeSessionId = () => {
462
- return window.localStorage.getItem(feRealSessionIdKey);
463
- };
464
-
465
432
  /*
466
433
  * @Author: binruan@chatlabs.com
467
434
  * @Date: 2024-03-20 10:27:31
@@ -513,6 +480,39 @@ const setUserConsentResult = () => {
513
480
  window.localStorage.setItem(USER_CONSENT_RESULT_KEY, 'true');
514
481
  };
515
482
 
483
+ function useEditor() {
484
+ return useContext(EditorContext);
485
+ }
486
+
487
+ function useDataSource() {
488
+ return useContext(DataSourceContext);
489
+ }
490
+
491
+ const feRealSessionIdKey = 'feRealSessionIdKey';
492
+ const generateFeSessionId = () => {
493
+ const uid = getUid(); // 32位长度
494
+ const timestamp = Date.now(); // 13位长度
495
+ const result = `${timestamp}${uid}`; // 总共45位长度的唯一ID
496
+ return result;
497
+ };
498
+ // 生成或者获取sessionID
499
+ const storeAndLoadFeSessionId = () => {
500
+ let result = getFeSessionId();
501
+ if (!result) {
502
+ result = generateFeSessionId();
503
+ window.localStorage.setItem(feRealSessionIdKey, result);
504
+ }
505
+ return result;
506
+ };
507
+ const refreshFeSessionId = () => {
508
+ const result = generateFeSessionId();
509
+ window.localStorage.setItem(feRealSessionIdKey, result);
510
+ };
511
+ // 获取 sessionID
512
+ const getFeSessionId = () => {
513
+ return window.localStorage.getItem(feRealSessionIdKey);
514
+ };
515
+
516
516
  /*
517
517
  * @Author: binruan@chatlabs.com
518
518
  * @Date: 2024-03-20 10:27:31
@@ -757,16 +757,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
757
757
  }, [bffDataSource]);
758
758
  // 获取推荐视频数据
759
759
  const getRecommendVideos = useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
760
- var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
761
- 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 }));
760
+ var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
761
+ 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 }));
762
762
  if (channel) {
763
763
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
764
764
  }
765
765
  else if (utmVal) {
766
- const val = (_k = (_j = (_h = splitUrlParams(utmVal)) === null || _h === void 0 ? void 0 : _h.filter((val) => {
766
+ const val = (_h = (_g = (_f = splitUrlParams(utmVal)) === null || _f === void 0 ? void 0 : _f.filter((val) => {
767
767
  const key = val.split('=')[0];
768
768
  return key;
769
- })) === null || _j === void 0 ? void 0 : _j.join('&')) !== null && _k !== void 0 ? _k : '';
769
+ })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
770
770
  if (val)
771
771
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
772
772
  }
@@ -780,19 +780,19 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
780
780
  let list = [];
781
781
  let result = null;
782
782
  const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
783
- var _v, _w, _x, _y, _z, _0;
783
+ var _t, _u, _v, _w, _x, _y;
784
784
  query.pageNum = pageNum;
785
785
  result = yield (bffFetchAdmin === null || bffFetchAdmin === void 0 ? void 0 : bffFetchAdmin('recommend/direct_page', { method: 'POST', body: query }));
786
786
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
787
787
  return undefined;
788
788
  }
789
789
  setLoading(false);
790
- 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 : []);
790
+ 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 : []);
791
791
  if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
792
792
  setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
793
793
  setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
794
794
  }
795
- 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));
795
+ 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));
796
796
  if (isNotNullList) {
797
797
  pageNum = pageNum + 1;
798
798
  yield recurveRecList(query);
@@ -800,11 +800,11 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
800
800
  });
801
801
  yield recurveRecList(query);
802
802
  if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
803
- 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 });
803
+ 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 });
804
804
  return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
805
805
  }
806
806
  if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
807
- 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 });
807
+ 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 });
808
808
  }
809
809
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct', { method: 'POST', body: query }));
810
810
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
@@ -814,8 +814,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
814
814
  setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
815
815
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
816
816
  let list = [];
817
- 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 : []);
818
- 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));
817
+ 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 : []);
818
+ 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));
819
819
  if (!isNotNullList) {
820
820
  setIsNoMoreData(true);
821
821
  }
@@ -824,12 +824,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
824
824
  return result === null || result === void 0 ? void 0 : result.data;
825
825
  }), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList, channel, chatlabsId, bffFetchAdmin]);
826
826
  const loadVideos = useCallback((pageNum) => __awaiter(void 0, void 0, void 0, function* () {
827
- var _1, _2, _3, _4;
827
+ var _z, _0, _1, _2;
828
828
  if (rtcList.length <= 0) {
829
829
  return;
830
830
  }
831
831
  const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
832
- 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 })));
832
+ 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 })));
833
833
  setRtcList(rtcList.concat(getFilterRecList(data)));
834
834
  setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
835
835
  return data;
@@ -994,18 +994,18 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
994
994
  }), [bffFetch]);
995
995
  // 获取 Tag
996
996
  const bffGetTagList = useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
997
- var _5, _6, _7, _8, _9, _10, _11, _12;
998
- 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);
997
+ var _3, _4, _5, _6, _7, _8, _9, _10;
998
+ 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);
999
999
  if (!utmVal || !isShowTag)
1000
1000
  return;
1001
1001
  try {
1002
- const val = (_10 = (_9 = (_8 = splitUrlParams(utmVal)) === null || _8 === void 0 ? void 0 : _8.filter((val) => {
1002
+ const val = (_8 = (_7 = (_6 = splitUrlParams(utmVal)) === null || _6 === void 0 ? void 0 : _6.filter((val) => {
1003
1003
  var _a, _b;
1004
1004
  const key = val.split('=')[0];
1005
1005
  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);
1006
- })) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
1006
+ })) === null || _7 === void 0 ? void 0 : _7.join('&')) !== null && _8 !== void 0 ? _8 : '';
1007
1007
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
1008
- 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 : []);
1008
+ 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 : []);
1009
1009
  }
1010
1010
  catch (e) {
1011
1011
  console.log('e', e);
@@ -1065,10 +1065,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
1065
1065
  });
1066
1066
  }, [bffEventReport]);
1067
1067
  const getAccount = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
1068
- var _13, _14;
1068
+ var _11, _12;
1069
1069
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account', { method: 'GET' }));
1070
- setChatlabsId((_13 = res === null || res === void 0 ? void 0 : res.data) === null || _13 === void 0 ? void 0 : _13.chatLabsId);
1071
- return ((_14 = res === null || res === void 0 ? void 0 : res.data) === null || _14 === void 0 ? void 0 : _14.consentResult) === 'true';
1070
+ setChatlabsId((_11 = res === null || res === void 0 ? void 0 : res.data) === null || _11 === void 0 ? void 0 : _11.chatLabsId);
1071
+ return ((_12 = res === null || res === void 0 ? void 0 : res.data) === null || _12 === void 0 ? void 0 : _12.consentResult) === 'true';
1072
1072
  }), [bffFetch]);
1073
1073
  const accountSonsent = useCallback((consentResult) => __awaiter(void 0, void 0, void 0, function* () {
1074
1074
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account/consent', {
@@ -1083,7 +1083,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
1083
1083
  if (!isShowConsent)
1084
1084
  h5EnterLink();
1085
1085
  }, [isShowConsent]);
1086
- console.log(data, '111');
1087
1086
  useEffect(() => {
1088
1087
  if (isShowConsent || isPreview)
1089
1088
  return;
@@ -18299,7 +18298,7 @@ function withBindDataSource(Component) {
18299
18298
  * @Author: binruan@chatlabs.com
18300
18299
  * @Date: 2023-12-26 16:11:34
18301
18300
  * @LastEditors: binruan@chatlabs.com
18302
- * @LastEditTime: 2025-03-26 19:32:00
18301
+ * @LastEditTime: 2025-03-28 14:46:08
18303
18302
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\RenderCard.tsx
18304
18303
  *
18305
18304
  */
@@ -19461,7 +19460,7 @@ const PictureGroup = ({ imgUrls, width, height, imgUrlsPostConfig, rec, index, s
19461
19460
  };
19462
19461
  var PictureGroup$1 = memo(PictureGroup);
19463
19462
 
19464
- const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, width, swiperRef, loopPlay }) => {
19463
+ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, width, swiperRef, loopPlay, videoPlayIcon, isPlay }) => {
19465
19464
  const { isActive } = useSwiperSlide();
19466
19465
  const [isPauseVideo, setIsPauseVideo] = useState(false);
19467
19466
  const videoRef = useRef(null);
@@ -19482,7 +19481,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
19482
19481
  var _a;
19483
19482
  (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
19484
19483
  }, []);
19485
- useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
19484
+ const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
19486
19485
  const handlePlaying = useCallback(() => {
19487
19486
  var _a, _b, _c, _d, _e, _f;
19488
19487
  setIsPauseVideo(false);
@@ -19520,6 +19519,9 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
19520
19519
  break;
19521
19520
  default:
19522
19521
  if (isPause) {
19522
+ // if (videoRef?.current?.currentTime >= rec?.endTime) {
19523
+ // videoRef.current.currentTime = rec?.startTime;
19524
+ // }
19523
19525
  (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
19524
19526
  }
19525
19527
  else {
@@ -19568,6 +19570,14 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
19568
19570
  (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
19569
19571
  }
19570
19572
  }, []);
19573
+ // useEffect(() => {
19574
+ // if (!videoRef.current || !isActive) return;
19575
+ // if (isPlay) {
19576
+ // videoRef.current?.play();
19577
+ // } else {
19578
+ // videoRef.current?.pause();
19579
+ // }
19580
+ // }, [isPlay, isActive]);
19571
19581
  const handlePause = () => {
19572
19582
  var _a, _b, _c, _d, _e, _f;
19573
19583
  if (!videoRef.current || !isActive)
@@ -19582,15 +19592,6 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
19582
19592
  (_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);
19583
19593
  }
19584
19594
  };
19585
- // useEffect(() => {
19586
- // if (!videoRef.current) return;
19587
- // if (!isActive) return;
19588
- // if (!loopPlay) {
19589
- // videoRef?.current?.pause();
19590
- // } else {
19591
- // videoRef?.current?.play();
19592
- // }
19593
- // }, [loopPlay, isActive]);
19594
19595
  useEffect(() => {
19595
19596
  var _a, _b, _c;
19596
19597
  if (!isActive)
@@ -19637,7 +19638,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
19637
19638
  (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.removeEventListener('timeupdate', handleTimeUpload);
19638
19639
  };
19639
19640
  }, [handleLoadedMetadata, handlePlaying, rec, handLoadeddata, isActive, loopPlay]);
19640
- useMemo(() => {
19641
+ const renderPoster = useMemo(() => {
19641
19642
  if (!(sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image) || isLoadFinish) {
19642
19643
  return null;
19643
19644
  }
@@ -19654,14 +19655,35 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
19654
19655
  if (!(rec === null || rec === void 0 ? void 0 : rec.mediaUrl)) {
19655
19656
  return null;
19656
19657
  }
19658
+ // const renderLoading = useMemo(() => {
19659
+ // if (!waiting || !isLoadFinish) return;
19660
+ // return (
19661
+ // <img
19662
+ // style={{
19663
+ // position: 'absolute',
19664
+ // top: '50%',
19665
+ // left: 0,
19666
+ // right: 0,
19667
+ // transform: 'translateY(-100%)',
19668
+ // margin: 'auto',
19669
+ // width: '50px',
19670
+ // height: '50px',
19671
+ // objectFit: 'contain'
19672
+ // }}
19673
+ // src={loading_gif}
19674
+ // alt='placeholder image'
19675
+ // />
19676
+ // );
19677
+ // }, [waiting, isLoadFinish]);
19657
19678
  return (React.createElement("div", { className: 'video-container', key: rec.itemId, style: {
19658
19679
  position: 'relative',
19659
19680
  width: '100%',
19660
19681
  height,
19661
- overflow: 'hidden',
19662
- pointerEvents: 'none'
19682
+ overflow: 'hidden'
19663
19683
  } },
19664
- React.createElement("div", { className: 'n-full-screen', id: videoId, style: { width: '100%', height: '100%' } })));
19684
+ React.createElement("div", { className: 'n-full-screen', id: videoId, style: { width: '100%', height: '100%' } }),
19685
+ renderPoster,
19686
+ isPauseVideo && React.createElement(FormatImage$1, { className: 'clc-pb-video-pause', src: videoPlayIcon !== null && videoPlayIcon !== void 0 ? videoPlayIcon : PAUSE_ICON, alt: 'pause' })));
19665
19687
  };
19666
19688
  var VideoWidget$1 = memo(VideoWidget);
19667
19689
 
@@ -19669,7 +19691,7 @@ var VideoWidget$1 = memo(VideoWidget);
19669
19691
  * @Author: binruan@chatlabs.com
19670
19692
  * @Date: 2025-03-25 13:54:27
19671
19693
  * @LastEditors: binruan@chatlabs.com
19672
- * @LastEditTime: 2025-03-27 17:20:34
19694
+ * @LastEditTime: 2025-03-28 18:08:02
19673
19695
  * @FilePath: \pb-sxp-ui\src\core\components\DiyStoryPreview\index.tsx
19674
19696
  *
19675
19697
  */
@@ -19857,7 +19879,7 @@ Object.values(_materials_).forEach((v) => {
19857
19879
  });
19858
19880
  const defaultUnLikeIconPath = '/pb_static/f71266d2c64446c5ae6a5a7f5489cc0a.png';
19859
19881
  const defaultLikeIconPath = '/pb_static/f07900fe3f0f4ae188ea1611d4801a44.png';
19860
- const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, descStyle, hashTagStyle, containerHeight = 664, containerWidth = 375, appDomain, tagList = [], scenes, onActiveChange, activeIndex, loopPlay = false, pointerEvents = 'none' }) => {
19882
+ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, descStyle, hashTagStyle, containerHeight = 664, containerWidth = 375, appDomain, tagList = [], scenes, onActiveChange, activeIndex, loopPlay = false, pointerEvents = 'none', isPlay }) => {
19861
19883
  const [loopPlaySwiper, setLooPlaySwiper] = useState(loopPlay);
19862
19884
  const swiperRef = useRef(null);
19863
19885
  useMemo(() => {
@@ -19884,7 +19906,7 @@ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, des
19884
19906
  const renderContent = (rec, index) => {
19885
19907
  const isVideo = isVideoUrl(rec === null || rec === void 0 ? void 0 : rec.mediaUrl);
19886
19908
  if (isVideo) {
19887
- 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: loopPlaySwiper }));
19909
+ 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 }));
19888
19910
  }
19889
19911
  else {
19890
19912
  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 }));
@@ -20004,6 +20026,7 @@ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, des
20004
20026
  var _a, _b, _c, _d;
20005
20027
  const rec = cloneDeep(recData);
20006
20028
  rec.video.bindProducts = item === null || item === void 0 ? void 0 : item.bindProducts;
20029
+ rec.video.title = (item === null || item === void 0 ? void 0 : item.title) || '';
20007
20030
  return (React.createElement("div", { style: { position: 'relative' } },
20008
20031
  React.createElement(SwiperSlide, { key: index, virtualIndex: index, style: { overflow: 'hidden', position: 'relative' } },
20009
20032
  renderBottom(rec, index),
@@ -20025,16 +20048,29 @@ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, des
20025
20048
  (_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);
20026
20049
  }, [activeIndex]);
20027
20050
  useEffect(() => {
20028
- var _a, _b;
20029
20051
  if (!(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current))
20030
20052
  return;
20031
- (_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);
20053
+ // swiperRef?.current?.swiper?.slideTo(0);
20054
+ setLooPlaySwiper(loopPlay);
20032
20055
  }, [loopPlay]);
20056
+ const handleSessionExpire = useCallback(debounce(() => {
20057
+ setLooPlaySwiper(false);
20058
+ }, 1000), []);
20059
+ useEffect(() => {
20060
+ const events = ['touchstart', 'touchcancel'];
20061
+ events.forEach((event) => {
20062
+ window.addEventListener(event, handleSessionExpire);
20063
+ });
20064
+ return () => {
20065
+ events.forEach((event) => {
20066
+ window.removeEventListener(event, handleSessionExpire);
20067
+ });
20068
+ };
20069
+ }, [handleSessionExpire]);
20033
20070
  return (React.createElement("div", { id: 'sxp-render',
20034
20071
  // className={style['clc-sxp-container']}
20035
20072
  style: { height: containerHeight, position: 'relative', pointerEvents } },
20036
20073
  React.createElement(Swiper, { ref: swiperRef, allowTouchMove: pointerEvents !== 'none', onSlideChange: () => {
20037
- setLooPlaySwiper(false);
20038
20074
  swiperRef.current.swiper.allowTouchMove = false;
20039
20075
  setTimeout(() => {
20040
20076
  swiperRef.current.swiper.allowTouchMove = true;
@@ -20052,7 +20088,7 @@ var DiyStoryPreview$1 = memo(DiyStoryPreview);
20052
20088
  * @Author: binruan@chatlabs.com
20053
20089
  * @Date: 2023-10-31 10:56:01
20054
20090
  * @LastEditors: binruan@chatlabs.com
20055
- * @LastEditTime: 2024-10-23 15:07:29
20091
+ * @LastEditTime: 2025-03-28 17:15:47
20056
20092
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Popup\index.tsx
20057
20093
  *
20058
20094
  */
@@ -20146,7 +20182,7 @@ const Popup = () => {
20146
20182
  * @Author: binruan@chatlabs.com
20147
20183
  * @Date: 2024-03-20 10:27:31
20148
20184
  * @LastEditors: binruan@chatlabs.com
20149
- * @LastEditTime: 2025-03-27 17:17:56
20185
+ * @LastEditTime: 2025-03-28 16:55:21
20150
20186
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
20151
20187
  *
20152
20188
  */
@@ -20155,19 +20191,19 @@ Object.values(_materials_).forEach((v) => {
20155
20191
  RESOLVER[v.extend.type] = v;
20156
20192
  });
20157
20193
  const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, loadingImage, appDomain, enabledMetaConversionApi, dataList, pointerEvents }) => {
20158
- var _a, _b, _c, _d, _e, _f;
20194
+ var _a, _b, _c, _d, _e, _f, _g, _h;
20159
20195
  const utmVal = useMemo(() => {
20160
20196
  var _a;
20161
20197
  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('?', '') : '';
20162
20198
  return searchParams;
20163
20199
  }, []);
20164
- const [_schema, setSchema] = useState(data === null || data === void 0 ? void 0 : data.data);
20200
+ const [_schema, setSchema] = useState((_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.data);
20165
20201
  const [channel, setChannel] = useState();
20166
20202
  return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: _schema, utmVal: channel || utmVal },
20167
- 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 }) => {
20168
- var _a;
20203
+ 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 }) => {
20204
+ var _a, _b;
20169
20205
  return (React.createElement(React.Fragment, null,
20170
- React.createElement(DiyStoryPreview$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, scenes: rtcList, resolver: RESOLVER, containerHeight: window === null || window === void 0 ? void 0 : window.innerHeight, pointerEvents: pointerEvents })),
20206
+ 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 })),
20171
20207
  React.createElement(Popup, null)));
20172
20208
  } })));
20173
20209
  };