pb-sxp-ui 1.20.6 → 1.20.8

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.
Files changed (33) hide show
  1. package/dist/index.cjs +291 -189
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +291 -189
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +7 -7
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +7 -7
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +291 -189
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +7 -7
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/DiyPortalPreview/VideoWidget.js +10 -8
  14. package/es/core/components/SxpPageRender/LikeButton/index.js +20 -18
  15. package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
  16. package/es/core/components/SxpPageRender/PictureGroup/index.js +39 -13
  17. package/es/core/components/SxpPageRender/VideoWidget/index.js +33 -46
  18. package/es/core/components/SxpPageRender/WaterFall/index.js +4 -3
  19. package/es/core/components/SxpPageRender/index.js +56 -40
  20. package/es/core/context/SxpDataSourceProvider.d.ts +5 -12
  21. package/es/core/context/SxpDataSourceProvider.js +124 -56
  22. package/es/core/hooks/useEventReport.js +6 -5
  23. package/lib/core/components/DiyPortalPreview/VideoWidget.js +10 -8
  24. package/lib/core/components/SxpPageRender/LikeButton/index.js +20 -18
  25. package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
  26. package/lib/core/components/SxpPageRender/PictureGroup/index.js +38 -12
  27. package/lib/core/components/SxpPageRender/VideoWidget/index.js +33 -46
  28. package/lib/core/components/SxpPageRender/WaterFall/index.js +4 -3
  29. package/lib/core/components/SxpPageRender/index.js +56 -40
  30. package/lib/core/context/SxpDataSourceProvider.d.ts +5 -12
  31. package/lib/core/context/SxpDataSourceProvider.js +124 -56
  32. package/lib/core/hooks/useEventReport.js +6 -5
  33. package/package.json +1 -1
@@ -48,6 +48,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
48
48
  const [pageNum, setPageNum] = (0, react_1.useState)(2);
49
49
  const [isShowCookieSetting, setIsShowCookieSetting] = (0, react_1.useState)(false);
50
50
  const videoWidgetRef = (0, react_1.useRef)(null);
51
+ const pictureGroupRef = (0, react_1.useRef)(null);
51
52
  const fbcRef = (0, react_1.useRef)('');
52
53
  const { loadVideos, bffEventReport, loading, setPopupDetailData, ctaEvent, swiperRef, waterFallData, setOpenHashtag, appDomain, openHashtag, loadingImage, isFromHashtag, popupDetailData, bffFbReport, curTime, h5EnterLink, isShowConsent, selectTag, isPreview, isEditor, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, isNoMoreData, channel, refreshFeSession, isDiyH5, pixelPvStatusRef } = (0, hooks_1.useSxpDataSource)();
53
54
  const { backMainFeed, productView, jumpToWeb } = (0, useEventReport_1.useEventReport)();
@@ -97,7 +98,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
97
98
  (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
98
99
  }, [data, ctaType, swiperRef]);
99
100
  const handleSessionCompleted = (0, react_1.useCallback)((fk) => {
100
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3;
101
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6;
101
102
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
102
103
  let fromKName = '';
103
104
  if (popupDetailData && (((_b = (_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) || ((_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.bindProduct))) {
@@ -124,22 +125,23 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
124
125
  eventSubject: 'sessionCompleted',
125
126
  eventDescription: 'Session completed',
126
127
  contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
127
- productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
128
+ sceneId: (_q = (_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.scene) === null || _p === void 0 ? void 0 : _p.sceneId) !== null && _q !== void 0 ? _q : '',
129
+ productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
128
130
  position: activeIndex + '',
129
131
  fromKName: fk || fromKName,
130
132
  fromKPage: location === null || location === void 0 ? void 0 : location.href,
131
- ctatId: (_r = (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.bindCta) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
132
- traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
133
+ ctatId: (_u = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.bindCta) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '',
134
+ traceInfo: (_y = (_w = (_v = item === null || item === void 0 ? void 0 : item.video) === null || _v === void 0 ? void 0 : _v.traceInfo) !== null && _w !== void 0 ? _w : (_x = item === null || item === void 0 ? void 0 : item.product) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : ''
133
135
  }
134
136
  });
135
- const isPostType = ((_w = item === null || item === void 0 ? void 0 : item.video) === null || _w === void 0 ? void 0 : _w.url) || ((_y = (_x = item === null || item === void 0 ? void 0 : item.video) === null || _x === void 0 ? void 0 : _x.imgUrls) === null || _y === void 0 ? void 0 : _y.length);
137
+ const isPostType = ((_z = item === null || item === void 0 ? void 0 : item.video) === null || _z === void 0 ? void 0 : _z.url) || ((_1 = (_0 = item === null || item === void 0 ? void 0 : item.video) === null || _0 === void 0 ? void 0 : _0.imgUrls) === null || _1 === void 0 ? void 0 : _1.length);
136
138
  if (!popupDetailData) {
137
139
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
138
140
  eventName: 'ExitFeed',
139
- product: isPostType ? (_z = item === null || item === void 0 ? void 0 : item.video) === null || _z === void 0 ? void 0 : _z.bindProducts : (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [],
141
+ product: isPostType ? (_2 = item === null || item === void 0 ? void 0 : item.video) === null || _2 === void 0 ? void 0 : _2.bindProducts : (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [],
140
142
  rec: item,
141
143
  position: activeIndex,
142
- content_id: isPostType ? (_1 = (_0 = item === null || item === void 0 ? void 0 : item.video) === null || _0 === void 0 ? void 0 : _0.itemId) !== null && _1 !== void 0 ? _1 : '' : (_3 = (_2 = item === null || item === void 0 ? void 0 : item.product) === null || _2 === void 0 ? void 0 : _2.itemId) !== null && _3 !== void 0 ? _3 : '',
144
+ content_id: isPostType ? (_4 = (_3 = item === null || item === void 0 ? void 0 : item.video) === null || _3 === void 0 ? void 0 : _3.itemId) !== null && _4 !== void 0 ? _4 : '' : (_6 = (_5 = item === null || item === void 0 ? void 0 : item.product) === null || _5 === void 0 ? void 0 : _5.itemId) !== null && _6 !== void 0 ? _6 : '',
143
145
  view_time: new Date() - viewTime.current
144
146
  });
145
147
  }
@@ -196,8 +198,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
196
198
  refreshFeSession
197
199
  ]);
198
200
  const handleSessionExpire = (0, react_1.useCallback)((0, lodash_1.debounce)(() => {
199
- var _a;
201
+ var _a, _b;
200
202
  (_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
203
+ (_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
201
204
  refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
202
205
  }, 1000), [handleSessionCompleted, refreshFeSession]);
203
206
  (0, react_1.useEffect)(() => {
@@ -268,18 +271,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
268
271
  return null;
269
272
  }, [globalConfig, activeIndex, visList]);
270
273
  const renderContent = (0, react_1.useCallback)((rec, index) => {
271
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
274
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
272
275
  if (rec === 'organic menu') {
273
276
  return (react_1.default.createElement(MultiPosts_1.default, Object.assign({ recData: data === null || data === void 0 ? void 0 : data[1] }, (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props, (_f = (_e = (_d = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.item) === null || _f === void 0 ? void 0 : _f.event)));
274
277
  }
275
- if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.url) {
278
+ if (((_h = (_g = rec.video) === null || _g === void 0 ? void 0 : _g.scene) === null || _h === void 0 ? void 0 : _h.mediaUrl) || ((_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.url)) {
276
279
  return (react_1.default.createElement(VideoWidget_1.default, Object.assign({ key: isReload }, (activeIndex === index && { ref: videoWidgetRef }), { rec: rec, index: index, muted: isMuted, data: data, height: height, activeIndex: activeIndex, videoPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.videoPost, videoPlayIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.videoPlayIcon, loopPlay: true, swiperRef: swiperRef, visibleHeight: visibleHeight })));
277
280
  }
278
- if ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.imgUrls) {
279
- return (react_1.default.createElement(PictureGroup_1.default, { key: rec === null || rec === void 0 ? void 0 : rec.video.itemId, imgUrls: rec === null || rec === void 0 ? void 0 : rec.video.imgUrls, width: containerWidth, height: height, rec: rec, index: index, onViewImageEndEvent: handleViewImageStartEnd, onViewImageStartEvent: handleViewImageStartEvent, imgUrlsPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.imgUrlsPost }));
281
+ if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
282
+ return (react_1.default.createElement(PictureGroup_1.default, Object.assign({ data: data }, (activeIndex === index && { ref: pictureGroupRef }), { key: rec === null || rec === void 0 ? void 0 : rec.video.itemId, imgUrls: rec === null || rec === void 0 ? void 0 : rec.video.imgUrls, width: containerWidth, height: height, rec: rec, index: index, onViewImageEndEvent: handleViewImageStartEnd, onViewImageStartEvent: handleViewImageStartEvent, imgUrlsPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.imgUrlsPost, swiperRef: swiperRef })));
280
283
  }
281
- if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _j === void 0 ? void 0 : _j.length) > 0) {
282
- return (_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _k === void 0 ? void 0 : _k.map((value, idx) => {
284
+ if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_l = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _l === void 0 ? void 0 : _l.length) > 0) {
285
+ return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
283
286
  var _a, _b, _c, _d, _e, _f, _g, _h;
284
287
  const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
285
288
  const Component = (0, withBindDataSource_1.default)(t);
@@ -318,7 +321,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
318
321
  };
319
322
  }, [isShowMore]);
320
323
  const renderBottom = (0, react_1.useCallback)((rec, index) => {
321
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
324
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
322
325
  if (rec === null || rec === void 0 ? void 0 : rec.video) {
323
326
  let cta = null;
324
327
  if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
@@ -327,24 +330,27 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
327
330
  else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
328
331
  cta = '商品CTA';
329
332
  }
333
+ else if (tempMap && ((_d = Object.keys(tempMap)) === null || _d === void 0 ? void 0 : _d.includes('服务CTA')) && ((_f = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.bindCta) === null || _f === void 0 ? void 0 : _f.itemId)) {
334
+ cta = '服务CTA';
335
+ }
330
336
  else {
331
- cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
337
+ cta = (_h = (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.bindCta) === null || _h === void 0 ? void 0 : _h.itemId;
332
338
  }
333
339
  const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
334
340
  const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
335
341
  index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 1 : 0) &&
336
- ((_f = ['MultiCommodity', 'MultiCommodityDiro', 'MultiCommodityDiroNew']) === null || _f === void 0 ? void 0 : _f.includes((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.type));
342
+ ((_j = ['MultiCommodity', 'MultiCommodityDiro', 'MultiCommodityDiroNew']) === null || _j === void 0 ? void 0 : _j.includes((_k = value === null || value === void 0 ? void 0 : value.item) === null || _k === void 0 ? void 0 : _k.type));
337
343
  return (react_1.default.createElement(react_1.default.Fragment, null,
338
344
  isNineProduct && (react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, isNineProduct: isNineProduct })),
339
- ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.title) && !isShowMore && react_1.default.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
340
- react_1.default.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _j !== void 0 ? _j : 40}px` } },
345
+ ((_l = rec === null || rec === void 0 ? void 0 : rec.video) === null || _l === void 0 ? void 0 : _l.title) && !isShowMore && react_1.default.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
346
+ react_1.default.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _m !== void 0 ? _m : 40}px` } },
341
347
  react_1.default.createElement(Nudge_1.default, { nudge: nudge }),
342
348
  ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA)) && !isNineProduct ? (react_1.default.createElement("div", { className: 'clc-sxp-bottom-card' },
343
349
  react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, includesCtaType: [] }))) : null,
344
350
  react_1.default.createElement("div", { style: { display: 'flex', flexDirection: 'column' } },
345
- react_1.default.createElement(ExpandableText_1.default, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.title) !== null && _l !== void 0 ? _l : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
351
+ react_1.default.createElement(ExpandableText_1.default, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_p = (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.title) !== null && _p !== void 0 ? _p : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
346
352
  react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
347
- react_1.default.createElement(Hashtag_1.default, { index: activeIndex, tags: (_o = (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.hashTags) !== null && _o !== void 0 ? _o : [], itemId: (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.itemId, itemType: ((_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
353
+ react_1.default.createElement(Hashtag_1.default, { index: activeIndex, tags: (_r = (_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.hashTags) !== null && _r !== void 0 ? _r : [], itemId: (_s = rec === null || rec === void 0 ? void 0 : rec.video) === null || _s === void 0 ? void 0 : _s.itemId, itemType: ((_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
348
354
  react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
349
355
  }
350
356
  return null;
@@ -386,7 +392,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
386
392
  return null;
387
393
  }, [globalConfig, waterFallData, bottomHeight]);
388
394
  const handleViewImageStartEnd = (item) => {
389
- var _a, _b, _c, _d, _e, _f;
395
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
390
396
  if (!((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.url) && ((_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.imgUrls)) {
391
397
  const endTime = Date.now();
392
398
  const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
@@ -395,10 +401,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
395
401
  eventSubject: 'viewImageCarouselEnd',
396
402
  eventDescription: 'User end view the image carousel',
397
403
  contentId: (_d = (_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.itemId) !== null && _d !== void 0 ? _d : '',
398
- contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
404
+ sceneId: (_g = (_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
405
+ contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
399
406
  imageEndTime: `${endTime}`,
400
407
  playDuration: `${duration}`,
401
- contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
408
+ contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
402
409
  position: activeIndex + '',
403
410
  contentFormat: 'image',
404
411
  traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
@@ -407,7 +414,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
407
414
  }
408
415
  };
409
416
  const handleSlideSkip = (item, position) => {
410
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
417
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
411
418
  if (isPreview || waterFallData)
412
419
  return;
413
420
  const t = new Date() - curTime.current;
@@ -433,7 +440,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
433
440
  contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
434
441
  position: position + '',
435
442
  contentId: (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.itemId) !== null && _t !== void 0 ? _t : '',
436
- traceInfo: (_x = (_v = (_u = item === null || item === void 0 ? void 0 : item.video) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : (_w = item === null || item === void 0 ? void 0 : item.product) === null || _w === void 0 ? void 0 : _w.traceInfo) !== null && _x !== void 0 ? _x : '',
443
+ sceneId: (_w = (_v = (_u = item === null || item === void 0 ? void 0 : item.video) === null || _u === void 0 ? void 0 : _u.scene) === null || _v === void 0 ? void 0 : _v.sceneId) !== null && _w !== void 0 ? _w : '',
444
+ traceInfo: (_0 = (_y = (_x = item === null || item === void 0 ? void 0 : item.video) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_z = item === null || item === void 0 ? void 0 : item.product) === null || _z === void 0 ? void 0 : _z.traceInfo) !== null && _0 !== void 0 ? _0 : '',
437
445
  contentFormat
438
446
  }
439
447
  });
@@ -443,7 +451,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
443
451
  }
444
452
  };
445
453
  const handleScrollEvent = (swiper) => {
446
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10;
454
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16;
447
455
  const item = data[swiper.previousIndex];
448
456
  const activeItem = data[swiper.activeIndex];
449
457
  if (!item)
@@ -476,11 +484,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
476
484
  eventSubject: 'scrollDown',
477
485
  eventDescription: 'User scroll down',
478
486
  contentId: (_u = (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '',
479
- productId: (_w = (_v = item === null || item === void 0 ? void 0 : item.product) === null || _v === void 0 ? void 0 : _v.itemId) !== null && _w !== void 0 ? _w : '',
487
+ sceneId: (_x = (_w = (_v = item === null || item === void 0 ? void 0 : item.video) === null || _v === void 0 ? void 0 : _v.scene) === null || _w === void 0 ? void 0 : _w.sceneId) !== null && _x !== void 0 ? _x : '',
488
+ productId: (_z = (_y = item === null || item === void 0 ? void 0 : item.product) === null || _y === void 0 ? void 0 : _y.itemId) !== null && _z !== void 0 ? _z : '',
480
489
  requestId: null,
481
- traceInfo: (_0 = (_y = (_x = item === null || item === void 0 ? void 0 : item.video) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_z = item === null || item === void 0 ? void 0 : item.product) === null || _z === void 0 ? void 0 : _z.traceInfo) !== null && _0 !== void 0 ? _0 : '',
490
+ traceInfo: (_3 = (_1 = (_0 = item === null || item === void 0 ? void 0 : item.video) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : (_2 = item === null || item === void 0 ? void 0 : item.product) === null || _2 === void 0 ? void 0 : _2.traceInfo) !== null && _3 !== void 0 ? _3 : '',
482
491
  contentFormat,
483
- position: ((_1 = swiper.previousIndex) !== null && _1 !== void 0 ? _1 : 0) + ''
492
+ position: ((_4 = swiper.previousIndex) !== null && _4 !== void 0 ? _4 : 0) + ''
484
493
  }
485
494
  });
486
495
  handleViewImageStartEnd(item);
@@ -492,12 +501,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
492
501
  eventInfo: {
493
502
  eventSubject: 'scrollUp',
494
503
  eventDescription: 'User scroll up',
495
- contentId: (_3 = (_2 = item === null || item === void 0 ? void 0 : item.video) === null || _2 === void 0 ? void 0 : _2.itemId) !== null && _3 !== void 0 ? _3 : '',
496
- productId: (_5 = (_4 = item.product) === null || _4 === void 0 ? void 0 : _4.itemId) !== null && _5 !== void 0 ? _5 : '',
504
+ contentId: (_6 = (_5 = item === null || item === void 0 ? void 0 : item.video) === null || _5 === void 0 ? void 0 : _5.itemId) !== null && _6 !== void 0 ? _6 : '',
505
+ sceneId: (_9 = (_8 = (_7 = item === null || item === void 0 ? void 0 : item.video) === null || _7 === void 0 ? void 0 : _7.scene) === null || _8 === void 0 ? void 0 : _8.sceneId) !== null && _9 !== void 0 ? _9 : '',
506
+ productId: (_11 = (_10 = item.product) === null || _10 === void 0 ? void 0 : _10.itemId) !== null && _11 !== void 0 ? _11 : '',
497
507
  requestId: null,
498
- traceInfo: (_9 = (_7 = (_6 = item === null || item === void 0 ? void 0 : item.video) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_8 = item === null || item === void 0 ? void 0 : item.product) === null || _8 === void 0 ? void 0 : _8.traceInfo) !== null && _9 !== void 0 ? _9 : '',
508
+ traceInfo: (_15 = (_13 = (_12 = item === null || item === void 0 ? void 0 : item.video) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : (_14 = item === null || item === void 0 ? void 0 : item.product) === null || _14 === void 0 ? void 0 : _14.traceInfo) !== null && _15 !== void 0 ? _15 : '',
499
509
  contentFormat,
500
- position: ((_10 = swiper.previousIndex) !== null && _10 !== void 0 ? _10 : 0) + ''
510
+ position: ((_16 = swiper.previousIndex) !== null && _16 !== void 0 ? _16 : 0) + ''
501
511
  }
502
512
  });
503
513
  handleViewImageStartEnd(item);
@@ -594,7 +604,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
594
604
  };
595
605
  }, [globalConfig, bffEventReport, data, activeIndex]);
596
606
  const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
597
- var _a, _b, _c, _d, _e, _f, _g, _h;
607
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
598
608
  const item = data[activeIndex];
599
609
  if (!((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.url) && ((_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.imgUrls)) {
600
610
  const startTime = Date.now();
@@ -604,9 +614,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
604
614
  eventSubject: 'viewImageCarouselStart',
605
615
  eventDescription: 'User start view the image carousel',
606
616
  contentId: (_d = (_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.itemId) !== null && _d !== void 0 ? _d : '',
607
- contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
617
+ sceneId: (_g = (_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
618
+ contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
608
619
  imageStartTime: `${startTime}`,
609
- contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
620
+ contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
610
621
  position: activeIndex + '',
611
622
  contentFormat: 'image',
612
623
  traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
@@ -616,13 +627,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
616
627
  if (enableCapi) {
617
628
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
618
629
  eventName: 'ViewContent',
619
- product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProducts,
630
+ product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProducts,
620
631
  rec: item,
621
632
  position: activeIndex
622
633
  });
623
634
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
624
635
  eventName: 'PageView',
625
- product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProducts,
636
+ product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProducts,
626
637
  rec: item,
627
638
  position: activeIndex
628
639
  });
@@ -720,14 +731,19 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
720
731
  swiperRef.current.swiper.allowTouchMove = true;
721
732
  }, 500);
722
733
  }, onActiveIndexChange: (swiper) => {
734
+ var _a, _b;
723
735
  setActiveIndex(swiper.activeIndex);
724
736
  if (openHashtag)
725
737
  return;
726
738
  handleScrollEvent(swiper);
727
- if (waterFallData || isEditor || isDiyH5)
739
+ if (waterFallData || isEditor)
728
740
  return;
729
741
  if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
730
742
  if (!isLoadMore) {
743
+ if (isDiyH5) {
744
+ (_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
745
+ (_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
746
+ }
731
747
  setIsLoadMore(true);
732
748
  loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
733
749
  var _a;
@@ -22,12 +22,8 @@ export interface ISxpDataSourceContext {
22
22
  value: string;
23
23
  }>;
24
24
  }) => Promise<boolean | undefined>;
25
- mutateUnlike?: (body: {
26
- videoItemId: string;
27
- }) => Promise<boolean>;
28
- mutateLike?: (body: {
29
- content: string;
30
- }) => Promise<boolean>;
25
+ mutateUnlike?: (body: Record<string, any>) => Promise<boolean>;
26
+ mutateLike?: (body: Record<string, any>) => Promise<boolean>;
31
27
  popupDetailData?: RecItemType;
32
28
  setPopupDetailData?: React.Dispatch<React.SetStateAction<any | null>>;
33
29
  loadVideos?: (page: number) => Promise<RecommendVideoResultType | undefined>;
@@ -100,6 +96,7 @@ export interface ISxpDataSourceContext {
100
96
  getAccount?: () => Promise<any>;
101
97
  accountSonsent?: (v: boolean) => Promise<boolean>;
102
98
  isDiyH5?: boolean;
99
+ firstRtcList?: RecItemType[];
103
100
  pixelPvStatusRef?: any;
104
101
  }
105
102
  export declare const SxpDataSourceContext: React.Context<ISxpDataSourceContext>;
@@ -114,12 +111,8 @@ export interface SxpDataSourceProviderProps {
114
111
  value: string;
115
112
  }>;
116
113
  }) => Promise<boolean | undefined>;
117
- mutateUnlike: (body: {
118
- videoItemId: string;
119
- }) => Promise<boolean>;
120
- mutateLike: (body: {
121
- content: string;
122
- }) => Promise<boolean>;
114
+ mutateUnlike: (body: Record<string, any>) => Promise<boolean>;
115
+ mutateLike: (body: Record<string, any>) => Promise<boolean>;
123
116
  pageData?: PageData;
124
117
  }) => ReactNode;
125
118
  utmVal?: string;