pb-sxp-ui 1.2.6 → 1.2.7

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 (32) hide show
  1. package/dist/index.cjs +53 -37
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +1 -3
  4. package/dist/index.js +53 -37
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +3 -3
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +3 -3
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +53 -37
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +3 -3
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/components/SxpPageRender/FormatImage.js +7 -3
  15. package/es/core/components/SxpPageRender/Popup/index.js +5 -5
  16. package/es/core/components/SxpPageRender/index.js +5 -5
  17. package/es/core/context/SxpDataSourceProvider.js +25 -15
  18. package/es/core/hooks/useEventReport.js +4 -4
  19. package/es/materials/sxp/popup/CommodityList/index.d.ts +0 -1
  20. package/es/materials/sxp/popup/CommodityList/index.js +2 -1
  21. package/es/materials/sxp/template/components/CommodityGroup.d.ts +1 -1
  22. package/es/materials/sxp/template/components/CommodityGroup.js +2 -1
  23. package/lib/core/components/SxpPageRender/FormatImage.js +7 -3
  24. package/lib/core/components/SxpPageRender/Popup/index.js +5 -5
  25. package/lib/core/components/SxpPageRender/index.js +5 -5
  26. package/lib/core/context/SxpDataSourceProvider.js +25 -15
  27. package/lib/core/hooks/useEventReport.js +4 -4
  28. package/lib/materials/sxp/popup/CommodityList/index.d.ts +0 -1
  29. package/lib/materials/sxp/popup/CommodityList/index.js +2 -1
  30. package/lib/materials/sxp/template/components/CommodityGroup.d.ts +1 -1
  31. package/lib/materials/sxp/template/components/CommodityGroup.js +2 -1
  32. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -580,6 +580,19 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
580
580
  var _a, _b, _c, _d;
581
581
  return (((_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.privacy_necessity) && !isAgreePolicy && !isEditor) || isOpenConsent;
582
582
  }, [isAgreePolicy, globalConfig, isOpenConsent, isEditor]);
583
+ const getFilterRecList = React.useCallback((data) => {
584
+ var _a;
585
+ const recList = data === null || data === void 0 ? void 0 : data.recList;
586
+ const nList = (_a = recList === null || recList === void 0 ? void 0 : recList.map((item) => {
587
+ var _a, _b, _c, _d, _e, _f;
588
+ if (((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.bindProducts) && ((_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c.length) > 0) {
589
+ const bindProducts = (_f = (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.bindProducts) === null || _e === void 0 ? void 0 : _e.filter((item) => !!(item === null || item === void 0 ? void 0 : item.bindCta))) !== null && _f !== void 0 ? _f : [];
590
+ return Object.assign(Object.assign({}, item), { video: Object.assign(Object.assign({}, item === null || item === void 0 ? void 0 : item.video), { bindProducts }) });
591
+ }
592
+ return item;
593
+ })) !== null && _a !== void 0 ? _a : [];
594
+ return nList;
595
+ }, []);
583
596
  React.useEffect(() => {
584
597
  const handleChangeThemeTag = (tag) => {
585
598
  themeTag.current = tag;
@@ -651,7 +664,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
651
664
  return result === null || result === void 0 ? void 0 : result.data;
652
665
  }), [bffFetch, utmVal, maxSize, defaultSize]);
653
666
  const loadVideos = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
654
- var _j, _k;
655
667
  if (rtcList.length <= 0) {
656
668
  return;
657
669
  }
@@ -661,8 +673,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
661
673
  'itemFilter.itemType': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemType,
662
674
  themeTag: themeTag.current
663
675
  });
664
- setRtcList(rtcList.concat((_j = data === null || data === void 0 ? void 0 : data.recList) !== null && _j !== void 0 ? _j : []));
665
- setCacheRtcList(cacheRtcList.concat((_k = data === null || data === void 0 ? void 0 : data.recList) !== null && _k !== void 0 ? _k : []));
676
+ setRtcList(getFilterRecList(data));
677
+ setCacheRtcList(getFilterRecList(data));
666
678
  }), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
667
679
  const bffEventReport = React.useCallback(({ userInfo, eventInfo }) => {
668
680
  // 关闭 BFF 事件上报
@@ -726,24 +738,24 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
726
738
  }), [bffFetch]);
727
739
  // 获取 Tag
728
740
  const bffGetTagList = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
729
- var _l, _m, _o, _p, _q;
741
+ var _j, _k, _l, _m, _o;
730
742
  if (!utmVal || !isShowTag)
731
743
  return;
732
744
  try {
733
- const val = (_o = (_m = (_l = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _l === void 0 ? void 0 : _l.filter((val) => {
745
+ const val = (_l = (_k = (_j = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _j === void 0 ? void 0 : _j.filter((val) => {
734
746
  var _a, _b;
735
747
  const key = val.split('=')[0];
736
748
  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);
737
- })) === null || _m === void 0 ? void 0 : _m.join('&')) !== null && _o !== void 0 ? _o : '';
749
+ })) === null || _k === void 0 ? void 0 : _k.join('&')) !== null && _l !== void 0 ? _l : '';
738
750
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
739
- setTagList((_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []);
751
+ setTagList((_o = (_m = result === null || result === void 0 ? void 0 : result.data) === null || _m === void 0 ? void 0 : _m.tags) !== null && _o !== void 0 ? _o : []);
740
752
  }
741
753
  catch (e) {
742
754
  console.log('e', e);
743
755
  }
744
756
  }), [bffFetch, utmVal, isShowTag]);
745
757
  const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
746
- 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;
758
+ 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;
747
759
  const cta = product === null || product === void 0 ? void 0 : product.bindCta;
748
760
  const isProd = ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProduct) || (((_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.bindProducts) && ((_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProducts) === null || _d === void 0 ? void 0 : _d.length) > 0);
749
761
  let fromKName = '';
@@ -757,7 +769,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
757
769
  fromKName = 'imagePage';
758
770
  }
759
771
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
760
- eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_h = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _h !== void 0 ? _h : '', ctaName: (_j = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _j !== void 0 ? _j : '', contentTags: JSON.stringify(cta === null || cta === void 0 ? void 0 : cta.tags), position: position + '', contentId: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.itemId) !== null && _l !== void 0 ? _l : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_1 = (_y = (_t = (_p = (_o = (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.bindCta) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : (_s = (_r = (_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.bindProduct) === null || _r === void 0 ? void 0 : _r.bindCta) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_x = (_w = (_v = (_u = rec === null || rec === void 0 ? void 0 : rec.video) === null || _u === void 0 ? void 0 : _u.bindProducts) === null || _v === void 0 ? void 0 : _v[0]) === null || _w === void 0 ? void 0 : _w.bindCta) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.product) === null || _z === void 0 ? void 0 : _z.bindCta) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : '', fromKName, fromKPage: (_2 = location === null || location === void 0 ? void 0 : location.href) !== null && _2 !== void 0 ? _2 : '' })
772
+ eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_h = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _h !== void 0 ? _h : '', ctaName: (_j = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _j !== void 0 ? _j : '', contentTags: JSON.stringify(cta === null || cta === void 0 ? void 0 : cta.tags), position: position + '', contentId: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.itemId) !== null && _l !== void 0 ? _l : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_2 = (_z = (_u = (_q = (_m = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _m !== void 0 ? _m : (_p = (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.bindCta) === null || _p === void 0 ? void 0 : _p.traceInfo) !== null && _q !== void 0 ? _q : (_t = (_s = (_r = rec === null || rec === void 0 ? void 0 : rec.video) === null || _r === void 0 ? void 0 : _r.bindProduct) === null || _s === void 0 ? void 0 : _s.bindCta) === null || _t === void 0 ? void 0 : _t.traceInfo) !== null && _u !== void 0 ? _u : (_y = (_x = (_w = (_v = rec === null || rec === void 0 ? void 0 : rec.video) === null || _v === void 0 ? void 0 : _v.bindProducts) === null || _w === void 0 ? void 0 : _w[0]) === null || _x === void 0 ? void 0 : _x.bindCta) === null || _y === void 0 ? void 0 : _y.traceInfo) !== null && _z !== void 0 ? _z : (_1 = (_0 = rec === null || rec === void 0 ? void 0 : rec.product) === null || _0 === void 0 ? void 0 : _0.bindCta) === null || _1 === void 0 ? void 0 : _1.traceInfo) !== null && _2 !== void 0 ? _2 : '', fromKName, fromKPage: (_3 = location === null || location === void 0 ? void 0 : location.href) !== null && _3 !== void 0 ? _3 : '' })
761
773
  });
762
774
  }, [bffEventReport, isFromHashtag]);
763
775
  const h5EnterLink = React.useCallback(() => {
@@ -797,9 +809,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
797
809
  bffGetTagList();
798
810
  getRecommendVideos()
799
811
  .then((data) => {
800
- var _a, _b;
801
- setRtcList((_a = data === null || data === void 0 ? void 0 : data.recList) !== null && _a !== void 0 ? _a : []);
802
- setCacheRtcList((_b = data === null || data === void 0 ? void 0 : data.recList) !== null && _b !== void 0 ? _b : []);
812
+ setRtcList(getFilterRecList(data));
813
+ setCacheRtcList(getFilterRecList(data));
803
814
  })
804
815
  .finally(() => {
805
816
  bffEventReport({
@@ -819,9 +830,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
819
830
  bffGetTagList();
820
831
  getRecommendVideos()
821
832
  .then((data) => {
822
- var _a, _b;
823
- setRtcList((_a = data === null || data === void 0 ? void 0 : data.recList) !== null && _a !== void 0 ? _a : []);
824
- setCacheRtcList((_b = data === null || data === void 0 ? void 0 : data.recList) !== null && _b !== void 0 ? _b : []);
833
+ setRtcList(getFilterRecList(data));
834
+ setCacheRtcList(getFilterRecList(data));
825
835
  })
826
836
  .finally(() => {
827
837
  setLoading(false);
@@ -1289,14 +1299,14 @@ var settingRender$9 = [
1289
1299
  * @Author: binruan@chatlabs.com
1290
1300
  * @Date: 2024-03-12 10:59:06
1291
1301
  * @LastEditors: binruan@chatlabs.com
1292
- * @LastEditTime: 2024-07-31 11:41:47
1302
+ * @LastEditTime: 2024-08-01 17:36:34
1293
1303
  * @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
1294
1304
  *
1295
1305
  */
1296
1306
  function useEventReport() {
1297
1307
  const { bffEventReport, popupDetailData, waterFallData, isFromHashtag } = useSxpDataSource();
1298
1308
  const jumpToWeb = React.useCallback((data, product, cta, position) => {
1299
- 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;
1309
+ 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;
1300
1310
  let fromKName = '';
1301
1311
  if (popupDetailData && (((_b = (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) || ((_c = data === null || data === void 0 ? void 0 : data.video) === null || _c === void 0 ? void 0 : _c.bindProduct))) {
1302
1312
  fromKName = 'pdpPage';
@@ -1327,12 +1337,12 @@ function useEventReport() {
1327
1337
  position: position + '',
1328
1338
  contentId: (_m = (_l = data === null || data === void 0 ? void 0 : data.video) === null || _l === void 0 ? void 0 : _l.itemId) !== null && _m !== void 0 ? _m : '',
1329
1339
  ctatId: (_o = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _o !== void 0 ? _o : '',
1330
- traceInfo: (_0 = (_x = (_v = (_r = (_q = (_p = data === null || data === void 0 ? void 0 : data.video) === null || _p === void 0 ? void 0 : _p.bindProduct) === null || _q === void 0 ? void 0 : _q.traceInfo) !== null && _r !== void 0 ? _r : (_u = (_t = (_s = data === null || data === void 0 ? void 0 : data.video) === null || _s === void 0 ? void 0 : _s.bindProducts) === null || _t === void 0 ? void 0 : _t[0]) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : (_w = data === null || data === void 0 ? void 0 : data.product) === null || _w === void 0 ? void 0 : _w.traceInfo) !== null && _x !== void 0 ? _x : (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.bindCta) === null || _z === void 0 ? void 0 : _z.traceInfo) !== null && _0 !== void 0 ? _0 : ''
1340
+ traceInfo: (_1 = (_y = (_w = (_s = (_p = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _p !== void 0 ? _p : (_r = (_q = data === null || data === void 0 ? void 0 : data.video) === null || _q === void 0 ? void 0 : _q.bindProduct) === null || _r === void 0 ? void 0 : _r.traceInfo) !== null && _s !== void 0 ? _s : (_v = (_u = (_t = data === null || data === void 0 ? void 0 : data.video) === null || _t === void 0 ? void 0 : _t.bindProducts) === null || _u === void 0 ? void 0 : _u[0]) === null || _v === void 0 ? void 0 : _v.traceInfo) !== null && _w !== void 0 ? _w : (_x = data === null || data === void 0 ? void 0 : data.product) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_0 = (_z = data === null || data === void 0 ? void 0 : data.video) === null || _z === void 0 ? void 0 : _z.bindCta) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : ''
1331
1341
  }
1332
1342
  });
1333
1343
  }, [bffEventReport, popupDetailData, isFromHashtag]);
1334
1344
  const productView = React.useCallback((data, product, cta, viewTime, position) => {
1335
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
1345
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
1336
1346
  let fromKName = '';
1337
1347
  if (popupDetailData && (((_b = (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) || ((_c = data === null || data === void 0 ? void 0 : data.video) === null || _c === void 0 ? void 0 : _c.bindProduct))) {
1338
1348
  fromKName = 'pdpPage';
@@ -1352,7 +1362,7 @@ function useEventReport() {
1352
1362
  position: position + '',
1353
1363
  contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
1354
1364
  ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
1355
- traceInfo: (_o = (_l = (_g = (_f = (_e = data === null || data === void 0 ? void 0 : data.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.traceInfo) !== null && _g !== void 0 ? _g : (_k = (_j = (_h = data === null || data === void 0 ? void 0 : data.video) === null || _h === void 0 ? void 0 : _h.bindProducts) === null || _j === void 0 ? void 0 : _j[0]) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : (_m = data === null || data === void 0 ? void 0 : data.product) === null || _m === void 0 ? void 0 : _m.traceInfo) !== null && _o !== void 0 ? _o : '',
1365
+ traceInfo: (_p = (_m = (_h = (_e = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _e !== void 0 ? _e : (_g = (_f = data === null || data === void 0 ? void 0 : data.video) === null || _f === void 0 ? void 0 : _f.bindProduct) === null || _g === void 0 ? void 0 : _g.traceInfo) !== null && _h !== void 0 ? _h : (_l = (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : (_o = data === null || data === void 0 ? void 0 : data.product) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : '',
1356
1366
  timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
1357
1367
  eventSubject: 'productView',
1358
1368
  eventDescription: 'User browsed the product'
@@ -8813,6 +8823,7 @@ var ExpandableText$1 = React.memo(ExpandableText);
8813
8823
  const FormatImage = React.forwardRef((props, ref) => {
8814
8824
  const { src, onLoad, style, className, loading } = props;
8815
8825
  const [imgSrc, setImgSrc] = React.useState();
8826
+ const imgRef = React.useRef(null);
8816
8827
  React.useImperativeHandle(ref, () => ({
8817
8828
  setSrc: (v) => {
8818
8829
  setImgSrc(v);
@@ -8821,7 +8832,6 @@ const FormatImage = React.forwardRef((props, ref) => {
8821
8832
  React.useEffect(() => {
8822
8833
  setImgSrc(src);
8823
8834
  }, [src]);
8824
- React.useRef(null);
8825
8835
  // useEffect(() => {
8826
8836
  // let observer: any = null;
8827
8837
  // const { current } = imgRef;
@@ -8849,9 +8859,13 @@ const FormatImage = React.forwardRef((props, ref) => {
8849
8859
  React.createElement("source", { type: 'image/avif', srcSet: imgSrc }),
8850
8860
  React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}?imageMogr2/format/webp` }),
8851
8861
  React.createElement("source", { type: 'image/jpeg', srcSet: `${imgSrc}?imageMogr2/format/jpg` }),
8852
- React.createElement("img", { className: className, src: imgSrc, style: style, loading: loading, onLoad: (e) => {
8862
+ React.createElement("img", { ref: imgRef, className: className, src: imgSrc, style: Object.assign(Object.assign({}, style), { display: 'none' }), loading: loading, onLoad: (e) => {
8863
+ if (imgRef.current)
8864
+ imgRef.current.style.display = 'block';
8853
8865
  onLoad === null || onLoad === void 0 ? void 0 : onLoad(e.target);
8854
- }, alt: 'image' }))) : (React.createElement("img", { className: className, src: imgSrc, style: style, loading: loading, onLoad: (e) => {
8866
+ }, alt: 'image' }))) : (React.createElement("img", { ref: imgRef, className: className, src: imgSrc, style: Object.assign(Object.assign({}, style), { display: 'none' }), loading: loading, onLoad: (e) => {
8867
+ if (imgRef.current)
8868
+ imgRef.current.style.display = 'block';
8855
8869
  onLoad === null || onLoad === void 0 ? void 0 : onLoad(e.target);
8856
8870
  }, alt: 'image' }))));
8857
8871
  });
@@ -8884,7 +8898,8 @@ const CommodityGroup = ({ products, data, defImg, style, onCLick, popupDetailDat
8884
8898
  const handleClick = (item, index) => {
8885
8899
  if (check === index)
8886
8900
  return;
8887
- productView(popupDetailData, item, item === null || item === void 0 ? void 0 : item.bindCta, popupCurTimeRef.current, popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index);
8901
+ const prevItem = products === null || products === void 0 ? void 0 : products[check];
8902
+ productView(popupDetailData, prevItem, prevItem === null || prevItem === void 0 ? void 0 : prevItem.bindCta, popupCurTimeRef.current, popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index);
8888
8903
  onCLick === null || onCLick === void 0 ? void 0 : onCLick(index);
8889
8904
  };
8890
8905
  return (React.createElement(React.Fragment, null, (data === null || data === void 0 ? void 0 : data.open) && ((products && (products === null || products === void 0 ? void 0 : products.length) > 1) || !popupDetailData) && (React.createElement(Scroll$1, { enableSlideActive: true, isPadding: false, style: Object.assign(Object.assign({}, style), data === null || data === void 0 ? void 0 : data.style) }, (_a = (popupDetailData ? products : [0, 1, 2, 3])) === null || _a === void 0 ? void 0 : _a.map((item, index) => {
@@ -10205,12 +10220,13 @@ var Img$1 = React.memo(Img);
10205
10220
 
10206
10221
  const CommodityList$1 = (_a) => {
10207
10222
  var _b, _c;
10208
- var { style, isDefault, rec, viewTime, isPost, bottom_image, commodityStyles, buttonStyle, index, translateY = 0, commodityPicture, isExternalLink, onClick } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "commodityStyles", "buttonStyle", "index", "translateY", "commodityPicture", "isExternalLink", "onClick"]);
10223
+ var { style, isDefault, rec, viewTime, isPost, bottom_image, commodityStyles, buttonStyle, translateY = 0, commodityPicture, isExternalLink, onClick } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "commodityStyles", "buttonStyle", "translateY", "commodityPicture", "isExternalLink", "onClick"]);
10209
10224
  const { sxpParameter, popupDetailData, setPopupDetailData, ctaEvent } = useSxpDataSource();
10210
10225
  const { jumpToWeb } = useEventReport();
10211
10226
  const { popup } = useEditor();
10212
10227
  const recData = isPost ? rec : popupDetailData;
10213
10228
  const product = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) !== null && _c !== void 0 ? _c : [null, null, null, null];
10229
+ const index = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index;
10214
10230
  const priceText = React.useCallback((product) => {
10215
10231
  var _a, _b, _c, _d, _e;
10216
10232
  if ((product === null || product === void 0 ? void 0 : product.currency) && (product === null || product === void 0 ? void 0 : product.price)) {
@@ -15528,7 +15544,7 @@ var Tagbar$1 = React.memo(Tagbar);
15528
15544
  * @Author: binruan@chatlabs.com
15529
15545
  * @Date: 2024-01-15 19:03:09
15530
15546
  * @LastEditors: binruan@chatlabs.com
15531
- * @LastEditTime: 2024-07-31 11:33:42
15547
+ * @LastEditTime: 2024-08-01 17:42:09
15532
15548
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
15533
15549
  *
15534
15550
  */
@@ -15589,7 +15605,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
15589
15605
  React.useEffect(() => {
15590
15606
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
15591
15607
  const visibleChange = () => {
15592
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
15608
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
15593
15609
  const repCond = !openHashtag && !isShowConsent;
15594
15610
  if (document.visibilityState === 'hidden') {
15595
15611
  // 当用户导航到新页面、切换标签页、关闭标签页、最小化或关闭浏览器、刷新原页面(即离开原页面时),或者在移动设备上从浏览器切换到不同的应用程序时
@@ -15629,7 +15645,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
15629
15645
  fromKName,
15630
15646
  fromKPage: location === null || location === void 0 ? void 0 : location.href,
15631
15647
  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 : '',
15632
- traceInfo: (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : ''
15648
+ 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 : ''
15633
15649
  }
15634
15650
  });
15635
15651
  }
@@ -15674,7 +15690,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
15674
15690
  const minusHeight = React.useMemo(() => {
15675
15691
  let minusHeight = 0;
15676
15692
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
15677
- minusHeight += 45;
15693
+ minusHeight += 56;
15678
15694
  }
15679
15695
  return minusHeight;
15680
15696
  }, []);
@@ -15800,7 +15816,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
15800
15816
  }
15801
15817
  };
15802
15818
  const handleSlideSkip = (item, position) => {
15803
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
15819
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
15804
15820
  if (isPreview || waterFallData)
15805
15821
  return;
15806
15822
  const t = new Date() - curTime.current;
@@ -15819,7 +15835,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
15819
15835
  contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
15820
15836
  position: position + '',
15821
15837
  contentId: (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.itemId) !== null && _q !== void 0 ? _q : '',
15822
- traceInfo: (_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo) !== null && _s !== void 0 ? _s : ''
15838
+ traceInfo: (_u = (_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo) !== null && _s !== void 0 ? _s : (_t = item === null || item === void 0 ? void 0 : item.product) === null || _t === void 0 ? void 0 : _t.traceInfo) !== null && _u !== void 0 ? _u : ''
15823
15839
  }
15824
15840
  });
15825
15841
  setSlideSkipState();
@@ -16350,7 +16366,7 @@ var index$1 = React.memo(DiyPortalPreview);
16350
16366
  * @Author: binruan@chatlabs.com
16351
16367
  * @Date: 2023-10-31 10:56:01
16352
16368
  * @LastEditors: binruan@chatlabs.com
16353
- * @LastEditTime: 2024-07-31 18:54:49
16369
+ * @LastEditTime: 2024-08-01 15:23:51
16354
16370
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Popup\index.tsx
16355
16371
  *
16356
16372
  */
@@ -16376,7 +16392,7 @@ const Popup = () => {
16376
16392
  }
16377
16393
  }, [popup]);
16378
16394
  const handleClose = () => {
16379
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
16395
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
16380
16396
  if (!popup ||
16381
16397
  (popup === null || popup === void 0 ? void 0 : popup.id) === '' ||
16382
16398
  !visible ||
@@ -16387,10 +16403,10 @@ const Popup = () => {
16387
16403
  const value = (_d = (_c = (_b = schema === null || schema === void 0 ? void 0 : schema.sxpPageConf) === null || _b === void 0 ? void 0 : _b.globalConfig) === null || _c === void 0 ? void 0 : _c.popupList) === null || _d === void 0 ? void 0 : _d.find((item) => (item === null || item === void 0 ? void 0 : item.id) === (popup === null || popup === void 0 ? void 0 : popup.id));
16388
16404
  if (((_e = value === null || value === void 0 ? void 0 : value.item) === null || _e === void 0 ? void 0 : _e.type) === 'CommodityDetail' || ((_f = value === null || value === void 0 ? void 0 : value.item) === null || _f === void 0 ? void 0 : _f.type) === 'CommodityDetailDiroNew') {
16389
16405
  const data = popupDetailData;
16390
- let product = (_g = data === null || data === void 0 ? void 0 : data.video) === null || _g === void 0 ? void 0 : _g.bindProduct;
16391
- let cta = (_j = (_h = data === null || data === void 0 ? void 0 : data.video) === null || _h === void 0 ? void 0 : _h.bindProduct) === null || _j === void 0 ? void 0 : _j.bindCta;
16406
+ let product = (_h = (_g = data === null || data === void 0 ? void 0 : data.video) === null || _g === void 0 ? void 0 : _g.bindProduct) !== null && _h !== void 0 ? _h : (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0];
16407
+ let cta = (_o = (_m = (_l = data === null || data === void 0 ? void 0 : data.video) === null || _l === void 0 ? void 0 : _l.bindProduct) === null || _m === void 0 ? void 0 : _m.bindCta) !== null && _o !== void 0 ? _o : (_r = (_q = (_p = data === null || data === void 0 ? void 0 : data.video) === null || _p === void 0 ? void 0 : _p.bindProducts) === null || _q === void 0 ? void 0 : _q[0]) === null || _r === void 0 ? void 0 : _r.bindCta;
16392
16408
  if ((checkCommodityIndexRef === null || checkCommodityIndexRef === void 0 ? void 0 : checkCommodityIndexRef.current) >= 0) {
16393
- const p = (_l = (_k = data === null || data === void 0 ? void 0 : data.video) === null || _k === void 0 ? void 0 : _k.bindProducts) === null || _l === void 0 ? void 0 : _l[checkCommodityIndexRef === null || checkCommodityIndexRef === void 0 ? void 0 : checkCommodityIndexRef.current];
16409
+ const p = (_t = (_s = data === null || data === void 0 ? void 0 : data.video) === null || _s === void 0 ? void 0 : _s.bindProducts) === null || _t === void 0 ? void 0 : _t[checkCommodityIndexRef === null || checkCommodityIndexRef === void 0 ? void 0 : checkCommodityIndexRef.current];
16394
16410
  if (p) {
16395
16411
  product = p;
16396
16412
  cta = p === null || p === void 0 ? void 0 : p.bindCta;
@@ -16416,7 +16432,7 @@ const Popup = () => {
16416
16432
  const isExternalLink = ((_d = (_c = (_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.event) === null || _c === void 0 ? void 0 : _c.onClick) === null || _d === void 0 ? void 0 : _d.linkType) === 'externalLink';
16417
16433
  const isPopup = ((_g = (_f = (_e = value === null || value === void 0 ? void 0 : value.item) === null || _e === void 0 ? void 0 : _e.event) === null || _f === void 0 ? void 0 : _f.onClick) === null || _g === void 0 ? void 0 : _g.linkType) === 'popup';
16418
16434
  const defaulSetting = (_h = t === null || t === void 0 ? void 0 : t.extend) === null || _h === void 0 ? void 0 : _h.defaulSetting;
16419
- return (React.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw', height: '100%' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose, index: index })));
16435
+ return (React.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw', height: '100%' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose })));
16420
16436
  }
16421
16437
  else {
16422
16438
  return React.createElement(React.Fragment, null);