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/pb-ui.js CHANGED
@@ -444,39 +444,6 @@
444
444
  })
445
445
  };
446
446
 
447
- function useEditor() {
448
- return React.useContext(EditorContext);
449
- }
450
-
451
- function useDataSource() {
452
- return React.useContext(DataSourceContext);
453
- }
454
-
455
- const feRealSessionIdKey = 'feRealSessionIdKey';
456
- const generateFeSessionId = () => {
457
- const uid = getUid(); // 32位长度
458
- const timestamp = Date.now(); // 13位长度
459
- const result = `${timestamp}${uid}`; // 总共45位长度的唯一ID
460
- return result;
461
- };
462
- // 生成或者获取sessionID
463
- const storeAndLoadFeSessionId = () => {
464
- let result = getFeSessionId();
465
- if (!result) {
466
- result = generateFeSessionId();
467
- window.localStorage.setItem(feRealSessionIdKey, result);
468
- }
469
- return result;
470
- };
471
- const refreshFeSessionId = () => {
472
- const result = generateFeSessionId();
473
- window.localStorage.setItem(feRealSessionIdKey, result);
474
- };
475
- // 获取 sessionID
476
- const getFeSessionId = () => {
477
- return window.localStorage.getItem(feRealSessionIdKey);
478
- };
479
-
480
447
  /*
481
448
  * @Author: binruan@chatlabs.com
482
449
  * @Date: 2024-03-20 10:27:31
@@ -528,6 +495,39 @@
528
495
  window.localStorage.setItem(USER_CONSENT_RESULT_KEY, 'true');
529
496
  };
530
497
 
498
+ function useEditor() {
499
+ return React.useContext(EditorContext);
500
+ }
501
+
502
+ function useDataSource() {
503
+ return React.useContext(DataSourceContext);
504
+ }
505
+
506
+ const feRealSessionIdKey = 'feRealSessionIdKey';
507
+ const generateFeSessionId = () => {
508
+ const uid = getUid(); // 32位长度
509
+ const timestamp = Date.now(); // 13位长度
510
+ const result = `${timestamp}${uid}`; // 总共45位长度的唯一ID
511
+ return result;
512
+ };
513
+ // 生成或者获取sessionID
514
+ const storeAndLoadFeSessionId = () => {
515
+ let result = getFeSessionId();
516
+ if (!result) {
517
+ result = generateFeSessionId();
518
+ window.localStorage.setItem(feRealSessionIdKey, result);
519
+ }
520
+ return result;
521
+ };
522
+ const refreshFeSessionId = () => {
523
+ const result = generateFeSessionId();
524
+ window.localStorage.setItem(feRealSessionIdKey, result);
525
+ };
526
+ // 获取 sessionID
527
+ const getFeSessionId = () => {
528
+ return window.localStorage.getItem(feRealSessionIdKey);
529
+ };
530
+
531
531
  /*
532
532
  * @Author: binruan@chatlabs.com
533
533
  * @Date: 2024-03-20 10:27:31
@@ -772,16 +772,16 @@
772
772
  }, [bffDataSource]);
773
773
  // 获取推荐视频数据
774
774
  const getRecommendVideos = React.useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
775
- var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
776
- 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 }));
775
+ var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
776
+ 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 }));
777
777
  if (channel) {
778
778
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
779
779
  }
780
780
  else if (utmVal) {
781
- const val = (_k = (_j = (_h = splitUrlParams(utmVal)) === null || _h === void 0 ? void 0 : _h.filter((val) => {
781
+ const val = (_h = (_g = (_f = splitUrlParams(utmVal)) === null || _f === void 0 ? void 0 : _f.filter((val) => {
782
782
  const key = val.split('=')[0];
783
783
  return key;
784
- })) === null || _j === void 0 ? void 0 : _j.join('&')) !== null && _k !== void 0 ? _k : '';
784
+ })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
785
785
  if (val)
786
786
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
787
787
  }
@@ -795,19 +795,19 @@
795
795
  let list = [];
796
796
  let result = null;
797
797
  const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
798
- var _v, _w, _x, _y, _z, _0;
798
+ var _t, _u, _v, _w, _x, _y;
799
799
  query.pageNum = pageNum;
800
800
  result = yield (bffFetchAdmin === null || bffFetchAdmin === void 0 ? void 0 : bffFetchAdmin('recommend/direct_page', { method: 'POST', body: query }));
801
801
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
802
802
  return undefined;
803
803
  }
804
804
  setLoading(false);
805
- 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 : []);
805
+ 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 : []);
806
806
  if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
807
807
  setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
808
808
  setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
809
809
  }
810
- 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));
810
+ 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));
811
811
  if (isNotNullList) {
812
812
  pageNum = pageNum + 1;
813
813
  yield recurveRecList(query);
@@ -815,11 +815,11 @@
815
815
  });
816
816
  yield recurveRecList(query);
817
817
  if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
818
- 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 });
818
+ 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 });
819
819
  return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
820
820
  }
821
821
  if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
822
- 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 });
822
+ 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 });
823
823
  }
824
824
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct', { method: 'POST', body: query }));
825
825
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
@@ -829,8 +829,8 @@
829
829
  setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
830
830
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
831
831
  let list = [];
832
- 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 : []);
833
- 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));
832
+ 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 : []);
833
+ 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));
834
834
  if (!isNotNullList) {
835
835
  setIsNoMoreData(true);
836
836
  }
@@ -839,12 +839,12 @@
839
839
  return result === null || result === void 0 ? void 0 : result.data;
840
840
  }), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList, channel, chatlabsId, bffFetchAdmin]);
841
841
  const loadVideos = React.useCallback((pageNum) => __awaiter(void 0, void 0, void 0, function* () {
842
- var _1, _2, _3, _4;
842
+ var _z, _0, _1, _2;
843
843
  if (rtcList.length <= 0) {
844
844
  return;
845
845
  }
846
846
  const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
847
- 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 })));
847
+ 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 })));
848
848
  setRtcList(rtcList.concat(getFilterRecList(data)));
849
849
  setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
850
850
  return data;
@@ -1009,18 +1009,18 @@
1009
1009
  }), [bffFetch]);
1010
1010
  // 获取 Tag
1011
1011
  const bffGetTagList = React.useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
1012
- var _5, _6, _7, _8, _9, _10, _11, _12;
1013
- 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);
1012
+ var _3, _4, _5, _6, _7, _8, _9, _10;
1013
+ 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);
1014
1014
  if (!utmVal || !isShowTag)
1015
1015
  return;
1016
1016
  try {
1017
- const val = (_10 = (_9 = (_8 = splitUrlParams(utmVal)) === null || _8 === void 0 ? void 0 : _8.filter((val) => {
1017
+ const val = (_8 = (_7 = (_6 = splitUrlParams(utmVal)) === null || _6 === void 0 ? void 0 : _6.filter((val) => {
1018
1018
  var _a, _b;
1019
1019
  const key = val.split('=')[0];
1020
1020
  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);
1021
- })) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
1021
+ })) === null || _7 === void 0 ? void 0 : _7.join('&')) !== null && _8 !== void 0 ? _8 : '';
1022
1022
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
1023
- 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 : []);
1023
+ 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 : []);
1024
1024
  }
1025
1025
  catch (e) {
1026
1026
  console.log('e', e);
@@ -1080,10 +1080,10 @@
1080
1080
  });
1081
1081
  }, [bffEventReport]);
1082
1082
  const getAccount = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
1083
- var _13, _14;
1083
+ var _11, _12;
1084
1084
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account', { method: 'GET' }));
1085
- setChatlabsId((_13 = res === null || res === void 0 ? void 0 : res.data) === null || _13 === void 0 ? void 0 : _13.chatLabsId);
1086
- return ((_14 = res === null || res === void 0 ? void 0 : res.data) === null || _14 === void 0 ? void 0 : _14.consentResult) === 'true';
1085
+ setChatlabsId((_11 = res === null || res === void 0 ? void 0 : res.data) === null || _11 === void 0 ? void 0 : _11.chatLabsId);
1086
+ return ((_12 = res === null || res === void 0 ? void 0 : res.data) === null || _12 === void 0 ? void 0 : _12.consentResult) === 'true';
1087
1087
  }), [bffFetch]);
1088
1088
  const accountSonsent = React.useCallback((consentResult) => __awaiter(void 0, void 0, void 0, function* () {
1089
1089
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account/consent', {
@@ -1098,7 +1098,6 @@
1098
1098
  if (!isShowConsent)
1099
1099
  h5EnterLink();
1100
1100
  }, [isShowConsent]);
1101
- console.log(data, '111');
1102
1101
  React.useEffect(() => {
1103
1102
  if (isShowConsent || isPreview)
1104
1103
  return;
@@ -18314,7 +18313,7 @@ Made in Italy` })));
18314
18313
  * @Author: binruan@chatlabs.com
18315
18314
  * @Date: 2023-12-26 16:11:34
18316
18315
  * @LastEditors: binruan@chatlabs.com
18317
- * @LastEditTime: 2025-03-26 19:32:00
18316
+ * @LastEditTime: 2025-03-28 14:46:08
18318
18317
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\RenderCard.tsx
18319
18318
  *
18320
18319
  */
@@ -19476,7 +19475,7 @@ Made in Italy` })));
19476
19475
  };
19477
19476
  var PictureGroup$1 = React.memo(PictureGroup);
19478
19477
 
19479
- const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, width, swiperRef, loopPlay }) => {
19478
+ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, width, swiperRef, loopPlay, videoPlayIcon, isPlay }) => {
19480
19479
  const { isActive } = useSwiperSlide();
19481
19480
  const [isPauseVideo, setIsPauseVideo] = React.useState(false);
19482
19481
  const videoRef = React.useRef(null);
@@ -19497,7 +19496,7 @@ Made in Italy` })));
19497
19496
  var _a;
19498
19497
  (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
19499
19498
  }, []);
19500
- useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
19499
+ const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
19501
19500
  const handlePlaying = React.useCallback(() => {
19502
19501
  var _a, _b, _c, _d, _e, _f;
19503
19502
  setIsPauseVideo(false);
@@ -19535,6 +19534,9 @@ Made in Italy` })));
19535
19534
  break;
19536
19535
  default:
19537
19536
  if (isPause) {
19537
+ // if (videoRef?.current?.currentTime >= rec?.endTime) {
19538
+ // videoRef.current.currentTime = rec?.startTime;
19539
+ // }
19538
19540
  (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
19539
19541
  }
19540
19542
  else {
@@ -19583,6 +19585,14 @@ Made in Italy` })));
19583
19585
  (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
19584
19586
  }
19585
19587
  }, []);
19588
+ // useEffect(() => {
19589
+ // if (!videoRef.current || !isActive) return;
19590
+ // if (isPlay) {
19591
+ // videoRef.current?.play();
19592
+ // } else {
19593
+ // videoRef.current?.pause();
19594
+ // }
19595
+ // }, [isPlay, isActive]);
19586
19596
  const handlePause = () => {
19587
19597
  var _a, _b, _c, _d, _e, _f;
19588
19598
  if (!videoRef.current || !isActive)
@@ -19597,15 +19607,6 @@ Made in Italy` })));
19597
19607
  (_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);
19598
19608
  }
19599
19609
  };
19600
- // useEffect(() => {
19601
- // if (!videoRef.current) return;
19602
- // if (!isActive) return;
19603
- // if (!loopPlay) {
19604
- // videoRef?.current?.pause();
19605
- // } else {
19606
- // videoRef?.current?.play();
19607
- // }
19608
- // }, [loopPlay, isActive]);
19609
19610
  React.useEffect(() => {
19610
19611
  var _a, _b, _c;
19611
19612
  if (!isActive)
@@ -19652,7 +19653,7 @@ Made in Italy` })));
19652
19653
  (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.removeEventListener('timeupdate', handleTimeUpload);
19653
19654
  };
19654
19655
  }, [handleLoadedMetadata, handlePlaying, rec, handLoadeddata, isActive, loopPlay]);
19655
- React.useMemo(() => {
19656
+ const renderPoster = React.useMemo(() => {
19656
19657
  if (!(sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image) || isLoadFinish) {
19657
19658
  return null;
19658
19659
  }
@@ -19669,14 +19670,35 @@ Made in Italy` })));
19669
19670
  if (!(rec === null || rec === void 0 ? void 0 : rec.mediaUrl)) {
19670
19671
  return null;
19671
19672
  }
19673
+ // const renderLoading = useMemo(() => {
19674
+ // if (!waiting || !isLoadFinish) return;
19675
+ // return (
19676
+ // <img
19677
+ // style={{
19678
+ // position: 'absolute',
19679
+ // top: '50%',
19680
+ // left: 0,
19681
+ // right: 0,
19682
+ // transform: 'translateY(-100%)',
19683
+ // margin: 'auto',
19684
+ // width: '50px',
19685
+ // height: '50px',
19686
+ // objectFit: 'contain'
19687
+ // }}
19688
+ // src={loading_gif}
19689
+ // alt='placeholder image'
19690
+ // />
19691
+ // );
19692
+ // }, [waiting, isLoadFinish]);
19672
19693
  return (React.createElement("div", { className: 'video-container', key: rec.itemId, style: {
19673
19694
  position: 'relative',
19674
19695
  width: '100%',
19675
19696
  height,
19676
- overflow: 'hidden',
19677
- pointerEvents: 'none'
19697
+ overflow: 'hidden'
19678
19698
  } },
19679
- React.createElement("div", { className: 'n-full-screen', id: videoId, style: { width: '100%', height: '100%' } })));
19699
+ React.createElement("div", { className: 'n-full-screen', id: videoId, style: { width: '100%', height: '100%' } }),
19700
+ renderPoster,
19701
+ isPauseVideo && React.createElement(FormatImage$1, { className: 'clc-pb-video-pause', src: videoPlayIcon !== null && videoPlayIcon !== void 0 ? videoPlayIcon : PAUSE_ICON, alt: 'pause' })));
19680
19702
  };
19681
19703
  var VideoWidget$1 = React.memo(VideoWidget);
19682
19704
 
@@ -19684,7 +19706,7 @@ Made in Italy` })));
19684
19706
  * @Author: binruan@chatlabs.com
19685
19707
  * @Date: 2025-03-25 13:54:27
19686
19708
  * @LastEditors: binruan@chatlabs.com
19687
- * @LastEditTime: 2025-03-27 17:20:34
19709
+ * @LastEditTime: 2025-03-28 18:08:02
19688
19710
  * @FilePath: \pb-sxp-ui\src\core\components\DiyStoryPreview\index.tsx
19689
19711
  *
19690
19712
  */
@@ -19872,7 +19894,7 @@ Made in Italy` })));
19872
19894
  });
19873
19895
  const defaultUnLikeIconPath = '/pb_static/f71266d2c64446c5ae6a5a7f5489cc0a.png';
19874
19896
  const defaultLikeIconPath = '/pb_static/f07900fe3f0f4ae188ea1611d4801a44.png';
19875
- const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, descStyle, hashTagStyle, containerHeight = 664, containerWidth = 375, appDomain, tagList = [], scenes, onActiveChange, activeIndex, loopPlay = false, pointerEvents = 'none' }) => {
19897
+ const DiyStoryPreview = ({ data = [], globalConfig, tipText, nudge, tempMap, descStyle, hashTagStyle, containerHeight = 664, containerWidth = 375, appDomain, tagList = [], scenes, onActiveChange, activeIndex, loopPlay = false, pointerEvents = 'none', isPlay }) => {
19876
19898
  const [loopPlaySwiper, setLooPlaySwiper] = React.useState(loopPlay);
19877
19899
  const swiperRef = React.useRef(null);
19878
19900
  React.useMemo(() => {
@@ -19899,7 +19921,7 @@ Made in Italy` })));
19899
19921
  const renderContent = (rec, index) => {
19900
19922
  const isVideo = isVideoUrl(rec === null || rec === void 0 ? void 0 : rec.mediaUrl);
19901
19923
  if (isVideo) {
19902
- 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 }));
19924
+ 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 }));
19903
19925
  }
19904
19926
  else {
19905
19927
  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 }));
@@ -20019,6 +20041,7 @@ Made in Italy` })));
20019
20041
  var _a, _b, _c, _d;
20020
20042
  const rec = lodash.cloneDeep(recData);
20021
20043
  rec.video.bindProducts = item === null || item === void 0 ? void 0 : item.bindProducts;
20044
+ rec.video.title = (item === null || item === void 0 ? void 0 : item.title) || '';
20022
20045
  return (React.createElement("div", { style: { position: 'relative' } },
20023
20046
  React.createElement(SwiperSlide, { key: index, virtualIndex: index, style: { overflow: 'hidden', position: 'relative' } },
20024
20047
  renderBottom(rec, index),
@@ -20040,16 +20063,29 @@ Made in Italy` })));
20040
20063
  (_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);
20041
20064
  }, [activeIndex]);
20042
20065
  React.useEffect(() => {
20043
- var _a, _b;
20044
20066
  if (!(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current))
20045
20067
  return;
20046
- (_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);
20068
+ // swiperRef?.current?.swiper?.slideTo(0);
20069
+ setLooPlaySwiper(loopPlay);
20047
20070
  }, [loopPlay]);
20071
+ const handleSessionExpire = React.useCallback(lodash.debounce(() => {
20072
+ setLooPlaySwiper(false);
20073
+ }, 1000), []);
20074
+ React.useEffect(() => {
20075
+ const events = ['touchstart', 'touchcancel'];
20076
+ events.forEach((event) => {
20077
+ window.addEventListener(event, handleSessionExpire);
20078
+ });
20079
+ return () => {
20080
+ events.forEach((event) => {
20081
+ window.removeEventListener(event, handleSessionExpire);
20082
+ });
20083
+ };
20084
+ }, [handleSessionExpire]);
20048
20085
  return (React.createElement("div", { id: 'sxp-render',
20049
20086
  // className={style['clc-sxp-container']}
20050
20087
  style: { height: containerHeight, position: 'relative', pointerEvents } },
20051
20088
  React.createElement(Swiper, { ref: swiperRef, allowTouchMove: pointerEvents !== 'none', onSlideChange: () => {
20052
- setLooPlaySwiper(false);
20053
20089
  swiperRef.current.swiper.allowTouchMove = false;
20054
20090
  setTimeout(() => {
20055
20091
  swiperRef.current.swiper.allowTouchMove = true;
@@ -20067,7 +20103,7 @@ Made in Italy` })));
20067
20103
  * @Author: binruan@chatlabs.com
20068
20104
  * @Date: 2023-10-31 10:56:01
20069
20105
  * @LastEditors: binruan@chatlabs.com
20070
- * @LastEditTime: 2024-10-23 15:07:29
20106
+ * @LastEditTime: 2025-03-28 17:15:47
20071
20107
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Popup\index.tsx
20072
20108
  *
20073
20109
  */
@@ -20161,7 +20197,7 @@ Made in Italy` })));
20161
20197
  * @Author: binruan@chatlabs.com
20162
20198
  * @Date: 2024-03-20 10:27:31
20163
20199
  * @LastEditors: binruan@chatlabs.com
20164
- * @LastEditTime: 2025-03-27 17:17:56
20200
+ * @LastEditTime: 2025-03-28 16:55:21
20165
20201
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
20166
20202
  *
20167
20203
  */
@@ -20170,19 +20206,19 @@ Made in Italy` })));
20170
20206
  RESOLVER[v.extend.type] = v;
20171
20207
  });
20172
20208
  const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, loadingImage, appDomain, enabledMetaConversionApi, dataList, pointerEvents }) => {
20173
- var _a, _b, _c, _d, _e, _f;
20209
+ var _a, _b, _c, _d, _e, _f, _g, _h;
20174
20210
  const utmVal = React.useMemo(() => {
20175
20211
  var _a;
20176
20212
  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('?', '') : '';
20177
20213
  return searchParams;
20178
20214
  }, []);
20179
- const [_schema, setSchema] = React.useState(data === null || data === void 0 ? void 0 : data.data);
20215
+ const [_schema, setSchema] = React.useState((_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.data);
20180
20216
  const [channel, setChannel] = React.useState();
20181
20217
  return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: _schema, utmVal: channel || utmVal },
20182
- 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 }) => {
20183
- var _a;
20218
+ 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 }) => {
20219
+ var _a, _b;
20184
20220
  return (React.createElement(React.Fragment, null,
20185
- 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 })),
20221
+ 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 })),
20186
20222
  React.createElement(Popup, null)));
20187
20223
  } })));
20188
20224
  };