pb-sxp-ui 1.16.25 → 1.17.0-alpha

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 (76) hide show
  1. package/dist/index.cjs +268 -338
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +15 -7
  4. package/dist/index.js +268 -338
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +6 -6
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +6 -6
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +268 -338
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +6 -6
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/components/DiyPortalPreview/VideoWidget.js +8 -10
  15. package/es/core/components/SxpPageRender/LikeButton/index.js +16 -18
  16. package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
  17. package/es/core/components/SxpPageRender/PictureGroup/index.js +13 -39
  18. package/es/core/components/SxpPageRender/RenderCard.js +1 -1
  19. package/es/core/components/SxpPageRender/VideoWidget/index.js +45 -32
  20. package/es/core/components/SxpPageRender/WaterFall/index.js +3 -4
  21. package/es/core/components/SxpPageRender/index.js +37 -53
  22. package/es/core/context/SxpDataSourceProvider.d.ts +12 -5
  23. package/es/core/context/SxpDataSourceProvider.js +10 -32
  24. package/es/core/hooks/useEventReport.js +5 -6
  25. package/es/materials/sxp/consentPopup/Display/index.js +1 -1
  26. package/es/materials/sxp/cta/AniLinkPopup/material.js +2 -3
  27. package/es/materials/sxp/popup/CommodityDetail/material.js +1 -2
  28. package/es/materials/sxp/popup/CommodityList/index.js +4 -5
  29. package/es/materials/sxp/popup/CommodityList/material.js +1 -1
  30. package/es/materials/sxp/popup/CommodityList/settingRender.js +1 -1
  31. package/es/materials/sxp/template/Appoint/material.js +1 -2
  32. package/es/materials/sxp/template/Commodity/material.js +2 -3
  33. package/es/materials/sxp/template/CommodityDiro/material.js +2 -3
  34. package/es/materials/sxp/template/CommodityDiroNew/material.js +2 -4
  35. package/es/materials/sxp/template/Link/material.js +2 -4
  36. package/es/materials/sxp/template/MultiCommodity/index.js +1 -1
  37. package/es/materials/sxp/template/MultiCommodity/material.js +1 -2
  38. package/es/materials/sxp/template/MultiCommodityDiro/index.js +1 -1
  39. package/es/materials/sxp/template/MultiCommodityDiro/material.js +2 -3
  40. package/es/materials/sxp/template/MultiCommodityDiroNew/index.js +1 -1
  41. package/es/materials/sxp/template/MultiCommodityDiroNew/material.js +2 -4
  42. package/es/materials/sxp/template/NineCommodity/material.js +2 -3
  43. package/es/materials/sxp/template/components/CommodityGroup.js +1 -1
  44. package/es/materials/sxp/template/components/settingRender.js +1 -1
  45. package/lib/core/components/DiyPortalPreview/VideoWidget.js +8 -10
  46. package/lib/core/components/SxpPageRender/LikeButton/index.js +16 -18
  47. package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
  48. package/lib/core/components/SxpPageRender/PictureGroup/index.js +12 -38
  49. package/lib/core/components/SxpPageRender/RenderCard.js +1 -1
  50. package/lib/core/components/SxpPageRender/VideoWidget/index.js +45 -32
  51. package/lib/core/components/SxpPageRender/WaterFall/index.js +3 -4
  52. package/lib/core/components/SxpPageRender/index.js +37 -53
  53. package/lib/core/context/SxpDataSourceProvider.d.ts +12 -5
  54. package/lib/core/context/SxpDataSourceProvider.js +10 -32
  55. package/lib/core/hooks/useEventReport.js +5 -6
  56. package/lib/materials/sxp/consentPopup/Display/index.js +1 -1
  57. package/lib/materials/sxp/cta/AniLinkPopup/material.js +1 -2
  58. package/lib/materials/sxp/popup/CommodityDetail/material.js +1 -2
  59. package/lib/materials/sxp/popup/CommodityList/index.js +4 -5
  60. package/lib/materials/sxp/popup/CommodityList/material.js +1 -1
  61. package/lib/materials/sxp/popup/CommodityList/settingRender.js +1 -1
  62. package/lib/materials/sxp/template/Appoint/material.js +1 -2
  63. package/lib/materials/sxp/template/Commodity/material.js +2 -3
  64. package/lib/materials/sxp/template/CommodityDiro/material.js +2 -3
  65. package/lib/materials/sxp/template/CommodityDiroNew/material.js +2 -4
  66. package/lib/materials/sxp/template/Link/material.js +2 -4
  67. package/lib/materials/sxp/template/MultiCommodity/index.js +1 -1
  68. package/lib/materials/sxp/template/MultiCommodity/material.js +1 -2
  69. package/lib/materials/sxp/template/MultiCommodityDiro/index.js +1 -1
  70. package/lib/materials/sxp/template/MultiCommodityDiro/material.js +2 -3
  71. package/lib/materials/sxp/template/MultiCommodityDiroNew/index.js +1 -1
  72. package/lib/materials/sxp/template/MultiCommodityDiroNew/material.js +2 -4
  73. package/lib/materials/sxp/template/NineCommodity/material.js +2 -3
  74. package/lib/materials/sxp/template/components/CommodityGroup.js +1 -1
  75. package/lib/materials/sxp/template/components/settingRender.js +1 -1
  76. package/package.json +1 -1
package/es/core/components/SxpPageRender/index.js CHANGED
@@ -42,7 +42,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
42
42
  const skipLinkRef = useRef(false);
43
43
  const [pageNum, setPageNum] = useState(2);
44
44
  const videoWidgetRef = useRef(null);
45
- const pictureGroupRef = useRef(null);
46
45
  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 } = useSxpDataSource();
47
46
  const { backMainFeed, productView, jumpToWeb } = useEventReport();
48
47
  const isShowFingerTip = useMemo(() => {
@@ -90,7 +89,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
90
89
  (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
91
90
  }, [data, ctaType, swiperRef]);
92
91
  const handleSessionCompleted = useCallback((fk) => {
93
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
92
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
94
93
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
95
94
  let fromKName = '';
96
95
  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))) {
@@ -117,13 +116,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
117
116
  eventSubject: 'sessionCompleted',
118
117
  eventDescription: 'Session completed',
119
118
  contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
120
- 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 : '',
121
- productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
119
+ productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
122
120
  position: activeIndex + '',
123
121
  fromKName: fk || fromKName,
124
122
  fromKPage: location === null || location === void 0 ? void 0 : location.href,
125
- 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 : '',
126
- 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 : ''
123
+ 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 : '',
124
+ 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 : ''
127
125
  }
128
126
  });
129
127
  }, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
@@ -179,9 +177,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
179
177
  refreshFeSession
180
178
  ]);
181
179
  const handleSessionExpire = useCallback(debounce(() => {
182
- var _a, _b;
180
+ var _a;
183
181
  (_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
184
- (_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
185
182
  refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
186
183
  }, 1000), [handleSessionCompleted, refreshFeSession]);
187
184
  useEffect(() => {
@@ -251,18 +248,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
251
248
  return null;
252
249
  }, [globalConfig, activeIndex, visList]);
253
250
  const renderContent = useCallback((rec, index) => {
254
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
251
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
255
252
  if (rec === 'organic menu') {
256
253
  return (React.createElement(MultiPosts, 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)));
257
254
  }
258
- 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)) {
255
+ if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.url) {
259
256
  return (React.createElement(VideoWidget, 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 })));
260
257
  }
261
- if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
262
- return (React.createElement(PictureGroup, 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 })));
258
+ if ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.imgUrls) {
259
+ return (React.createElement(PictureGroup, { 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 }));
263
260
  }
264
- 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) {
265
- return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
261
+ 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) {
262
+ return (_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _k === void 0 ? void 0 : _k.map((value, idx) => {
266
263
  var _a, _b, _c, _d, _e, _f, _g, _h;
267
264
  const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
268
265
  const Component = withBindDataSource(t);
@@ -300,7 +297,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
300
297
  };
301
298
  }, [isShowMore]);
302
299
  const renderBottom = useCallback((rec, index) => {
303
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
300
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
304
301
  if (rec === null || rec === void 0 ? void 0 : rec.video) {
305
302
  let cta = null;
306
303
  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) {
@@ -309,27 +306,24 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
309
306
  else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
310
307
  cta = '商品CTA';
311
308
  }
312
- 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)) {
313
- cta = '服务CTA';
314
- }
315
309
  else {
316
- 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;
310
+ 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;
317
311
  }
318
312
  const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
319
313
  const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
320
314
  index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
321
- ((_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));
315
+ ((_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));
322
316
  return (React.createElement(React.Fragment, null,
323
317
  isNineProduct && (React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
324
- ((_l = rec === null || rec === void 0 ? void 0 : rec.video) === null || _l === void 0 ? void 0 : _l.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
325
- React.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` } },
318
+ ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
319
+ React.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` } },
326
320
  React.createElement(Nudge, { nudge: nudge }),
327
321
  ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA)) && !isNineProduct ? (React.createElement("div", { className: 'clc-sxp-bottom-card' },
328
322
  React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
329
323
  React.createElement("div", null,
330
- React.createElement(ExpandableText, { 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 }),
324
+ React.createElement(ExpandableText, { 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 }),
331
325
  React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
332
- React.createElement(Hashtag, { 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) }))),
326
+ React.createElement(Hashtag, { 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) }))),
333
327
  React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
334
328
  }
335
329
  return null;
@@ -368,7 +362,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
368
362
  return null;
369
363
  }, [globalConfig, waterFallData]);
370
364
  const handleViewImageStartEnd = (item) => {
371
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
365
+ var _a, _b, _c, _d, _e, _f;
372
366
  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)) {
373
367
  const endTime = Date.now();
374
368
  const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
@@ -377,11 +371,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
377
371
  eventSubject: 'viewImageCarouselEnd',
378
372
  eventDescription: 'User end view the image carousel',
379
373
  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 : '',
380
- 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 : '',
381
- contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
374
+ contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
382
375
  imageEndTime: `${endTime}`,
383
376
  playDuration: `${duration}`,
384
- contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
377
+ contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
385
378
  position: activeIndex + '',
386
379
  contentFormat: 'image',
387
380
  traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
@@ -390,7 +383,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
390
383
  }
391
384
  };
392
385
  const handleSlideSkip = (item, position) => {
393
- 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;
386
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
394
387
  if (isPreview || waterFallData)
395
388
  return;
396
389
  const t = new Date() - curTime.current;
@@ -416,8 +409,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
416
409
  contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
417
410
  position: position + '',
418
411
  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 : '',
419
- 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 : '',
420
- 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 : '',
412
+ 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 : '',
421
413
  contentFormat
422
414
  }
423
415
  });
@@ -427,7 +419,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
427
419
  }
428
420
  };
429
421
  const handleScrollEvent = (swiper) => {
430
- 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;
422
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
431
423
  const item = data[swiper.previousIndex];
432
424
  if (!item)
433
425
  return;
@@ -444,12 +436,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
444
436
  eventSubject: 'scrollDown',
445
437
  eventDescription: 'User scroll down',
446
438
  contentId: (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.itemId) !== null && _e !== void 0 ? _e : '',
447
- sceneId: (_h = (_g = (_f = item === null || item === void 0 ? void 0 : item.video) === null || _f === void 0 ? void 0 : _f.scene) === null || _g === void 0 ? void 0 : _g.sceneId) !== null && _h !== void 0 ? _h : '',
448
- productId: (_k = (_j = item === null || item === void 0 ? void 0 : item.product) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '',
439
+ productId: (_g = (_f = item === null || item === void 0 ? void 0 : item.product) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '',
449
440
  requestId: null,
450
- traceInfo: (_p = (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : '',
441
+ traceInfo: (_l = (_j = (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.traceInfo) !== null && _j !== void 0 ? _j : (_k = item === null || item === void 0 ? void 0 : item.product) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : '',
451
442
  contentFormat,
452
- position: ((_q = swiper.previousIndex) !== null && _q !== void 0 ? _q : 0) + ''
443
+ position: ((_m = swiper.previousIndex) !== null && _m !== void 0 ? _m : 0) + ''
453
444
  }
454
445
  });
455
446
  handleViewImageStartEnd(item);
@@ -460,13 +451,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
460
451
  eventInfo: {
461
452
  eventSubject: 'scrollUp',
462
453
  eventDescription: 'User scroll up',
463
- contentId: (_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '',
464
- sceneId: (_v = (_u = (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.scene) === null || _u === void 0 ? void 0 : _u.sceneId) !== null && _v !== void 0 ? _v : '',
465
- productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
454
+ contentId: (_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.itemId) !== null && _p !== void 0 ? _p : '',
455
+ productId: (_r = (_q = item.product) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
466
456
  requestId: null,
467
- traceInfo: (_1 = (_z = (_y = item === null || item === void 0 ? void 0 : item.video) === null || _y === void 0 ? void 0 : _y.traceInfo) !== null && _z !== void 0 ? _z : (_0 = item === null || item === void 0 ? void 0 : item.product) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : '',
457
+ 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 : '',
468
458
  contentFormat,
469
- position: ((_2 = swiper.previousIndex) !== null && _2 !== void 0 ? _2 : 0) + ''
459
+ position: ((_w = swiper.previousIndex) !== null && _w !== void 0 ? _w : 0) + ''
470
460
  }
471
461
  });
472
462
  handleViewImageStartEnd(item);
@@ -490,7 +480,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
490
480
  }
491
481
  }, [openHashtag, data, activeIndex]);
492
482
  const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
493
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
483
+ var _a, _b, _c, _d, _e, _f, _g, _h;
494
484
  const item = data[activeIndex];
495
485
  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)) {
496
486
  const startTime = Date.now();
@@ -500,10 +490,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
500
490
  eventSubject: 'viewImageCarouselStart',
501
491
  eventDescription: 'User start view the image carousel',
502
492
  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 : '',
503
- 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 : '',
504
- contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
493
+ contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
505
494
  imageStartTime: `${startTime}`,
506
- contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
495
+ contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
507
496
  position: activeIndex + '',
508
497
  contentFormat: 'image',
509
498
  traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
@@ -513,11 +502,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
513
502
  if (enableCapi) {
514
503
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
515
504
  eventName: 'ViewContent',
516
- product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProduct
505
+ product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProduct
517
506
  });
518
507
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
519
508
  eventName: 'PageView',
520
- product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProduct
509
+ product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct
521
510
  });
522
511
  }
523
512
  }
@@ -609,19 +598,14 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
609
598
  swiperRef.current.swiper.allowTouchMove = true;
610
599
  }, 500);
611
600
  }, onActiveIndexChange: (swiper) => {
612
- var _a, _b;
613
601
  setActiveIndex(swiper.activeIndex);
614
602
  if (openHashtag)
615
603
  return;
616
604
  handleScrollEvent(swiper);
617
- if (waterFallData || isEditor)
605
+ if (waterFallData || isEditor || isDiyH5)
618
606
  return;
619
607
  if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
620
608
  if (!isLoadMore) {
621
- if (isDiyH5) {
622
- (_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
623
- (_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
624
- }
625
609
  setIsLoadMore(true);
626
610
  loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
627
611
  var _a;
package/es/core/context/SxpDataSourceProvider.d.ts CHANGED
@@ -21,8 +21,12 @@ export interface ISxpDataSourceContext {
21
21
  value: string;
22
22
  }>;
23
23
  }) => Promise<boolean | undefined>;
24
- mutateUnlike?: (body: Record<string, any>) => Promise<boolean>;
25
- mutateLike?: (body: Record<string, any>) => Promise<boolean>;
24
+ mutateUnlike?: (body: {
25
+ videoItemId: string;
26
+ }) => Promise<boolean>;
27
+ mutateLike?: (body: {
28
+ content: string;
29
+ }) => Promise<boolean>;
26
30
  popupDetailData?: RecItemType;
27
31
  setPopupDetailData?: React.Dispatch<React.SetStateAction<any | null>>;
28
32
  loadVideos?: (page: number) => Promise<RecommendVideoResultType | undefined>;
@@ -89,7 +93,6 @@ export interface ISxpDataSourceContext {
89
93
  getAccount?: () => Promise<any>;
90
94
  accountSonsent?: (v: boolean) => Promise<boolean>;
91
95
  isDiyH5?: boolean;
92
- firstRtcList?: RecItemType[];
93
96
  }
94
97
  export declare const SxpDataSourceContext: React.Context<ISxpDataSourceContext>;
95
98
  export interface SxpDataSourceProviderProps {
@@ -103,8 +106,12 @@ export interface SxpDataSourceProviderProps {
103
106
  value: string;
104
107
  }>;
105
108
  }) => Promise<boolean | undefined>;
106
- mutateUnlike: (body: Record<string, any>) => Promise<boolean>;
107
- mutateLike: (body: Record<string, any>) => Promise<boolean>;
109
+ mutateUnlike: (body: {
110
+ videoItemId: string;
111
+ }) => Promise<boolean>;
112
+ mutateLike: (body: {
113
+ content: string;
114
+ }) => Promise<boolean>;
108
115
  pageData?: PageData;
109
116
  }) => ReactNode;
110
117
  utmVal?: string;
package/es/core/context/SxpDataSourceProvider.js CHANGED
@@ -20,7 +20,6 @@ export const DEFAULT_TAG = 'FOR U';
20
20
  const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isOpenConsent = false, isEditor = false, utmParameter, channelQueryList, data, dataList, isDiyH5, onUpdateSchema, onUpdateChannel }) => {
21
21
  var _a, _b, _c, _d, _e;
22
22
  const [rtcList, setRtcList] = useState([]);
23
- const [firstRtcList, setFirstRtcList] = useState([]);
24
23
  const [tagList, setTagList] = useState([]);
25
24
  const [loading, setLoading] = useState(true);
26
25
  const [curReqInfo, setCurReqInfo] = useState({ rtc: '', requestId: '' });
@@ -107,7 +106,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
107
106
  return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + storeAndLoadFeUserId();
108
107
  }, [bffDataSource]);
109
108
  const bffFetch = useCallback((path, options, isBota = true) => {
110
- var _a, _b;
109
+ var _a;
111
110
  if (!bffDataSource)
112
111
  return;
113
112
  const url = bffDataSource.url;
@@ -122,9 +121,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
122
121
  const value = val.split('=')[1];
123
122
  params[key] = value;
124
123
  });
125
- options.body = Object.assign(Object.assign({}, options.body), { productUserId: fakeUserId });
126
124
  return window
127
- .fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId, 'tenant-id': (_b = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _b === void 0 ? void 0 : _b['x-app-id'] }, bffDataSource.headers), method: options.method, body: options.type === 'beacon' && isBota
125
+ .fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers), method: options.method, body: options.type === 'beacon' && isBota
128
126
  ? JSON.stringify({
129
127
  body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
130
128
  })
@@ -380,9 +378,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
380
378
  if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
381
379
  setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
382
380
  setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
383
- if (isDiyH5) {
384
- setFirstRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
385
- }
386
381
  }
387
382
  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));
388
383
  if (isNotNullList) {
@@ -422,17 +417,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
422
417
  if (rtcList.length <= 0) {
423
418
  return;
424
419
  }
425
- if (isDiyH5 && (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) > 0) {
426
- setRtcList(rtcList.concat(firstRtcList));
427
- setCacheRtcList(cacheRtcList.concat(firstRtcList));
428
- return;
429
- }
430
420
  const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
431
421
  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 })));
432
422
  setRtcList(rtcList.concat(getFilterRecList(data)));
433
423
  setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
434
424
  return data;
435
- }), [getRecommendVideos, rtcList, waterFallData, cacheRtcList, isDiyH5, firstRtcList]);
425
+ }), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
436
426
  const refreshFeSession = useCallback((enableReSid, event) => {
437
427
  var _a, _b, _c, _d, _e;
438
428
  let expire = false;
@@ -460,9 +450,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
460
450
  return;
461
451
  }
462
452
  if (!userInfo) {
463
- userInfo = {
464
- productUserId: fakeUserId
465
- };
453
+ userInfo = {};
466
454
  }
467
455
  const sessionID = storeAndLoadFeSessionId();
468
456
  const params = {};
@@ -495,8 +483,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
495
483
  layoutVariantId,
496
484
  globalConfig,
497
485
  playbookType,
498
- bffDataSource,
499
- fakeUserId
486
+ bffDataSource
500
487
  ]);
501
488
  const getEventParamsByJson = useCallback((json, product) => {
502
489
  var _a, _b, _c;
@@ -629,15 +616,13 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
629
616
  }
630
617
  }, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
631
618
  const bffMutateLike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
632
- body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
633
619
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
634
620
  return res === null || res === void 0 ? void 0 : res.success;
635
- }), [bffFetch, fakeUserId]);
621
+ }), [bffFetch]);
636
622
  const bffMutateUnlike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
637
- body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
638
623
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
639
624
  return res === null || res === void 0 ? void 0 : res.success;
640
- }), [bffFetch, fakeUserId]);
625
+ }), [bffFetch]);
641
626
  const bffSubmitForm = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
642
627
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
643
628
  return res === null || res === void 0 ? void 0 : res.success;
@@ -661,7 +646,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
661
646
  }
662
647
  }), [bffFetch, utmVal]);
663
648
  const ctaEvent = useCallback((eventInfo, rec, product, position) => {
664
- 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;
649
+ 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;
665
650
  const cta = product === null || product === void 0 ? void 0 : product.bindCta;
666
651
  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);
667
652
  let fromKName = '';
@@ -679,7 +664,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
679
664
  }
680
665
  const contentTags = (_p = (_m = (_h = product === null || product === void 0 ? void 0 : product.tags) !== null && _h !== void 0 ? _h : (_l = (_k = (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.tags) !== null && _p !== void 0 ? _p : (_q = rec === null || rec === void 0 ? void 0 : rec.product) === null || _q === void 0 ? void 0 : _q.tags;
681
666
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
682
- eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_r = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _r !== void 0 ? _r : '', ctaName: (_s = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _s !== void 0 ? _s : '', contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_u = (_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '', sceneId: (_x = (_w = (_v = rec === null || rec === void 0 ? void 0 : rec.video) === null || _v === void 0 ? void 0 : _v.scene) === null || _w === void 0 ? void 0 : _w.sceneId) !== null && _x !== void 0 ? _x : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_13 = (_10 = (_5 = (_1 = (_y = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _y !== void 0 ? _y : (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.video) === null || _z === void 0 ? void 0 : _z.bindCta) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : (_4 = (_3 = (_2 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _2 === void 0 ? void 0 : _2.bindProduct) === null || _3 === void 0 ? void 0 : _3.bindCta) === null || _4 === void 0 ? void 0 : _4.traceInfo) !== null && _5 !== void 0 ? _5 : (_9 = (_8 = (_7 = (_6 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _6 === void 0 ? void 0 : _6.bindProducts) === null || _7 === void 0 ? void 0 : _7[0]) === null || _8 === void 0 ? void 0 : _8.bindCta) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : (_12 = (_11 = rec === null || rec === void 0 ? void 0 : rec.product) === null || _11 === void 0 ? void 0 : _11.bindCta) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : '', fromKName, fromKPage: (_14 = location === null || location === void 0 ? void 0 : location.href) !== null && _14 !== void 0 ? _14 : '', contentFormat })
667
+ eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_r = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _r !== void 0 ? _r : '', ctaName: (_s = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _s !== void 0 ? _s : '', contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_u = (_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_10 = (_7 = (_2 = (_y = (_v = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _v !== void 0 ? _v : (_x = (_w = rec === null || rec === void 0 ? void 0 : rec.video) === null || _w === void 0 ? void 0 : _w.bindCta) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_1 = (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.video) === null || _z === void 0 ? void 0 : _z.bindProduct) === null || _0 === void 0 ? void 0 : _0.bindCta) === null || _1 === void 0 ? void 0 : _1.traceInfo) !== null && _2 !== void 0 ? _2 : (_6 = (_5 = (_4 = (_3 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _3 === void 0 ? void 0 : _3.bindProducts) === null || _4 === void 0 ? void 0 : _4[0]) === null || _5 === void 0 ? void 0 : _5.bindCta) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_9 = (_8 = rec === null || rec === void 0 ? void 0 : rec.product) === null || _8 === void 0 ? void 0 : _8.bindCta) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : '', fromKName, fromKPage: (_11 = location === null || location === void 0 ? void 0 : location.href) !== null && _11 !== void 0 ? _11 : '', contentFormat })
683
668
  });
684
669
  }, [bffEventReport, isFromHashtag]);
685
670
  const h5EnterLink = useCallback(() => {
@@ -781,9 +766,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
781
766
  }
782
767
  setRtcList(list);
783
768
  setCacheRtcList(list);
784
- if (isDiyH5) {
785
- setFirstRtcList(list);
786
- }
787
769
  bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
788
770
  if (channel) {
789
771
  const item = list === null || list === void 0 ? void 0 : list[0];
@@ -818,9 +800,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
818
800
  }
819
801
  setRtcList(list);
820
802
  setCacheRtcList(list);
821
- if (isDiyH5) {
822
- setFirstRtcList(list);
823
- }
824
803
  }
825
804
  })
826
805
  .finally(() => {
@@ -884,8 +863,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
884
863
  refreshFeSession,
885
864
  getAccount,
886
865
  accountSonsent,
887
- isDiyH5,
888
- firstRtcList
866
+ isDiyH5
889
867
  } }, isShowConsent ? (React.createElement(Consent, Object.assign({}, (_e = (_d = (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.item) === null || _e === void 0 ? void 0 : _e.props))) : (render({
890
868
  rtcList,
891
869
  mutateLike: bffMutateLike,
package/es/core/hooks/useEventReport.js CHANGED
@@ -1,10 +1,10 @@
1
1
  import { useCallback } from 'react';
2
- import { DEFAULT_TAG } from '../context/SxpDataSourceProvider';
3
2
  import { useSxpDataSource } from './useSxpDataSource';
3
+ import { DEFAULT_TAG } from '../context/SxpDataSourceProvider';
4
4
  export function useEventReport() {
5
5
  const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
6
6
  const jumpToWeb = useCallback((e, data, product, cta, position, traceInfo) => {
7
- 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;
7
+ 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;
8
8
  const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
9
9
  if (i !== -1) {
10
10
  return;
@@ -37,11 +37,11 @@ export function useEventReport() {
37
37
  contentFormat = 'image';
38
38
  }
39
39
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
40
- eventInfo: Object.assign({ eventSubject: 'jumpToWeb', eventDescription: 'User jumped to website', productId: (_v = product === null || product === void 0 ? void 0 : product.itemId) !== null && _v !== void 0 ? _v : '', productName: (_w = product === null || product === void 0 ? void 0 : product.title) !== null && _w !== void 0 ? _w : '', price: (product === null || product === void 0 ? void 0 : product.price) ? (product === null || product === void 0 ? void 0 : product.price) + '' : '0', productCollection: (_x = product === null || product === void 0 ? void 0 : product.collection) !== null && _x !== void 0 ? _x : '', fromKName, fromKPage: location === null || location === void 0 ? void 0 : location.href, contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.itemId) !== null && _z !== void 0 ? _z : '', sceneId: (_2 = (_1 = (_0 = data === null || data === void 0 ? void 0 : data.video) === null || _0 === void 0 ? void 0 : _0.scene) === null || _1 === void 0 ? void 0 : _1.sceneId) !== null && _2 !== void 0 ? _2 : '', ctatId: (_3 = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _3 !== void 0 ? _3 : '', traceInfo: (_16 = (_13 = (_11 = (_7 = (_4 = traceInfo !== null && traceInfo !== void 0 ? traceInfo : product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _4 !== void 0 ? _4 : (_6 = (_5 = data === null || data === void 0 ? void 0 : data.video) === null || _5 === void 0 ? void 0 : _5.bindProduct) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_10 = (_9 = (_8 = data === null || data === void 0 ? void 0 : data.video) === null || _8 === void 0 ? void 0 : _8.bindProducts) === null || _9 === void 0 ? void 0 : _9[0]) === null || _10 === void 0 ? void 0 : _10.traceInfo) !== null && _11 !== void 0 ? _11 : (_12 = data === null || data === void 0 ? void 0 : data.product) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : (_15 = (_14 = data === null || data === void 0 ? void 0 : data.video) === null || _14 === void 0 ? void 0 : _14.bindCta) === null || _15 === void 0 ? void 0 : _15.traceInfo) !== null && _16 !== void 0 ? _16 : '' }, (contentFormat && { contentFormat }))
40
+ eventInfo: Object.assign({ eventSubject: 'jumpToWeb', eventDescription: 'User jumped to website', productId: (_v = product === null || product === void 0 ? void 0 : product.itemId) !== null && _v !== void 0 ? _v : '', productName: (_w = product === null || product === void 0 ? void 0 : product.title) !== null && _w !== void 0 ? _w : '', price: (product === null || product === void 0 ? void 0 : product.price) ? (product === null || product === void 0 ? void 0 : product.price) + '' : '0', productCollection: (_x = product === null || product === void 0 ? void 0 : product.collection) !== null && _x !== void 0 ? _x : '', fromKName, fromKPage: location === null || location === void 0 ? void 0 : location.href, contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.itemId) !== null && _z !== void 0 ? _z : '', ctatId: (_0 = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _0 !== void 0 ? _0 : '', traceInfo: (_13 = (_10 = (_8 = (_4 = (_1 = traceInfo !== null && traceInfo !== void 0 ? traceInfo : product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _1 !== void 0 ? _1 : (_3 = (_2 = data === null || data === void 0 ? void 0 : data.video) === null || _2 === void 0 ? void 0 : _2.bindProduct) === null || _3 === void 0 ? void 0 : _3.traceInfo) !== null && _4 !== void 0 ? _4 : (_7 = (_6 = (_5 = data === null || data === void 0 ? void 0 : data.video) === null || _5 === void 0 ? void 0 : _5.bindProducts) === null || _6 === void 0 ? void 0 : _6[0]) === null || _7 === void 0 ? void 0 : _7.traceInfo) !== null && _8 !== void 0 ? _8 : (_9 = data === null || data === void 0 ? void 0 : data.product) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : (_12 = (_11 = data === null || data === void 0 ? void 0 : data.video) === null || _11 === void 0 ? void 0 : _11.bindCta) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : '' }, (contentFormat && { contentFormat }))
41
41
  });
42
42
  }, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
43
43
  const productView = useCallback((data, product, cta, viewTime, position) => {
44
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
44
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
45
45
  let fromKName = '';
46
46
  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))) {
47
47
  fromKName = 'pdpPage';
@@ -60,9 +60,8 @@ export function useEventReport() {
60
60
  contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
61
61
  position: position + '',
62
62
  contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
63
- sceneId: (_g = (_f = (_e = data === null || data === void 0 ? void 0 : data.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
64
63
  ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
65
- traceInfo: (_s = (_q = (_l = (_h = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _h !== void 0 ? _h : (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProduct) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : (_p = (_o = (_m = data === null || data === void 0 ? void 0 : data.video) === null || _m === void 0 ? void 0 : _m.bindProducts) === null || _o === void 0 ? void 0 : _o[0]) === null || _p === void 0 ? void 0 : _p.traceInfo) !== null && _q !== void 0 ? _q : (_r = data === null || data === void 0 ? void 0 : data.product) === null || _r === void 0 ? void 0 : _r.traceInfo) !== null && _s !== void 0 ? _s : '',
64
+ 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 : '',
66
65
  timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
67
66
  eventSubject: 'productView',
68
67
  eventDescription: 'User browsed the product'
package/es/materials/sxp/consentPopup/Display/index.js CHANGED
@@ -26,7 +26,7 @@ const Display = (_a) => {
26
26
  React.createElement("span", { style: content === null || content === void 0 ? void 0 : content.style, dangerouslySetInnerHTML: {
27
27
  __html: setFontForText((_b = content === null || content === void 0 ? void 0 : content.text) === null || _b === void 0 ? void 0 : _b.replace(/\n/g, '</br>'), content === null || content === void 0 ? void 0 : content.style)
28
28
  } }),
29
- React.createElement("span", { style: Object.assign(Object.assign({}, interaction === null || interaction === void 0 ? void 0 : interaction.style), { marginLeft: '5px' }), dangerouslySetInnerHTML: {
29
+ React.createElement("span", { style: Object.assign(Object.assign({}, interaction === null || interaction === void 0 ? void 0 : interaction.style), { marginInlineEnd: '5px' }), dangerouslySetInnerHTML: {
30
30
  __html: setFontForText((_c = interaction === null || interaction === void 0 ? void 0 : interaction.text) === null || _c === void 0 ? void 0 : _c.replace(/\n/g, '</br>'), interaction === null || interaction === void 0 ? void 0 : interaction.style)
31
31
  }, onClick: handleClick })),
32
32
  isShowClose && (React.createElement("button", { "aria-label": 'close', className: 'consentPopupDisplay-close', onClick: handleClickClose },
package/es/materials/sxp/cta/AniLinkPopup/material.js CHANGED
@@ -1,14 +1,14 @@
1
1
  import settingRender from './settingRender';
2
+ import interactionRender from './interactionRender';
2
3
  import AniLinkPopupComponent from '.';
3
4
  import { createMaterial } from '../../../../core/create';
4
- import interactionRender from './interactionRender';
5
5
  const AniLinkPopup = createMaterial(AniLinkPopupComponent, {
6
6
  displayName: '竖版弹窗CTA',
7
7
  icon: '',
8
8
  category: 'cta',
9
9
  type: 'AniLinkPopup',
10
10
  related: {
11
- settingRender: settingRender,
11
+ settingRender,
12
12
  bindableProps: [],
13
13
  interactionRender
14
14
  },
@@ -24,7 +24,6 @@ const AniLinkPopup = createMaterial(AniLinkPopupComponent, {
24
24
  title: {
25
25
  fontSize: 14,
26
26
  color: '#000',
27
- textAlign: 'left',
28
27
  lineHeight: 2.6
29
28
  },
30
29
  ctaTitle: {
package/es/materials/sxp/popup/CommodityDetail/material.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import settingRender from './settingRender';
2
+ import interactionRender from './interactionRender';
2
3
  import CommodityDetailComponent from '.';
3
4
  import { createMaterial } from '../../../../core/create';
4
- import interactionRender from './interactionRender';
5
5
  const CommodityDetail = createMaterial(CommodityDetailComponent, {
6
6
  displayName: '商品详情',
7
7
  icon: '',
@@ -40,7 +40,6 @@ const CommodityDetail = createMaterial(CommodityDetailComponent, {
40
40
  taxInfo: {
41
41
  color: '#000',
42
42
  fontSize: 13,
43
- textAlign: 'left',
44
43
  marginBottom: '10px'
45
44
  }
46
45
  },
package/es/materials/sxp/popup/CommodityList/index.js CHANGED
@@ -1,12 +1,12 @@
1
1
  import { __rest } from "tslib";
2
2
  import { css } from '@emotion/css';
3
3
  import React, { memo, useCallback, useEffect } from 'react';
4
+ import { throttle } from 'lodash';
5
+ import Img from '../../template/components/Img';
4
6
  import { useEditor, useSxpDataSource } from '../../../../core/hooks';
5
7
  import './index.less';
6
8
  import { useEventReport } from '../../../../core/hooks/useEventReport';
7
9
  import { setFontForText } from '../../../../core/utils/tool';
8
- import Img from '../../template/components/Img';
9
- import { throttle } from 'lodash';
10
10
  import { getPriceText } from '../../../../core/utils/materials';
11
11
  const CommodityList = (_a) => {
12
12
  var _b, _c, _d;
@@ -53,12 +53,11 @@ const CommodityList = (_a) => {
53
53
  React.createElement("button", Object.assign({ role: 'button', "aria-label": item === null || item === void 0 ? void 0 : item.title, tabIndex: 0, className: css({
54
54
  display: 'flex',
55
55
  alignItems: 'normal',
56
- width: '100%',
57
- textAlign: 'left'
56
+ width: '100%'
58
57
  }) }, props),
59
58
  React.createElement(Img, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: commodityPicture, enableEventReport: false }),
60
59
  React.createElement("div", { style: {
61
- width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.marginRight) !== null && _f !== void 0 ? _f : 0}px)`,
60
+ width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.marginInlineStart) !== null && _f !== void 0 ? _f : 0}px)`,
62
61
  display: 'flex',
63
62
  flexDirection: 'column',
64
63
  justifyContent: 'space-between'