pb-sxp-ui 1.20.3 → 1.20.5

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 (37) hide show
  1. package/dist/index.cjs +234 -87
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +234 -87
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +8 -8
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +8 -8
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +234 -87
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +8 -8
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/SxpPageRender/WaterFall/List.js +8 -17
  14. package/es/core/components/SxpPageRender/WaterFall/WaterfallList.js +3 -13
  15. package/es/core/components/SxpPageRender/WaterFall/index.d.ts +0 -2
  16. package/es/core/components/SxpPageRender/WaterFall/index.js +8 -1
  17. package/es/core/components/SxpPageRender/index.js +23 -21
  18. package/es/core/context/SxpDataSourceProvider.js +22 -16
  19. package/es/materials/sxp/cta/AniLink/index.js +13 -2
  20. package/es/materials/sxp/cta/AniLinkPopup/index.js +13 -2
  21. package/es/materials/sxp/popup/CommodityDetail/index.js +54 -3
  22. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +55 -4
  23. package/es/materials/sxp/popup/CommodityList/index.js +13 -1
  24. package/es/materials/sxp/template/components/EventProvider.js +19 -7
  25. package/lib/core/components/SxpPageRender/WaterFall/List.js +8 -17
  26. package/lib/core/components/SxpPageRender/WaterFall/WaterfallList.js +3 -13
  27. package/lib/core/components/SxpPageRender/WaterFall/index.d.ts +0 -2
  28. package/lib/core/components/SxpPageRender/WaterFall/index.js +8 -1
  29. package/lib/core/components/SxpPageRender/index.js +23 -21
  30. package/lib/core/context/SxpDataSourceProvider.js +22 -16
  31. package/lib/materials/sxp/cta/AniLink/index.js +13 -2
  32. package/lib/materials/sxp/cta/AniLinkPopup/index.js +13 -2
  33. package/lib/materials/sxp/popup/CommodityDetail/index.js +54 -3
  34. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +55 -4
  35. package/lib/materials/sxp/popup/CommodityList/index.js +13 -1
  36. package/lib/materials/sxp/template/components/EventProvider.js +19 -7
  37. package/package.json +1 -1
package/lib/core/components/SxpPageRender/WaterFall/List.js CHANGED
@@ -12,7 +12,8 @@ const useEventReport_1 = require("../../../../core/hooks/useEventReport");
12
12
  const materials_1 = require("../../../../core/utils/materials");
13
13
  const WaterfallFlowItem = (props) => {
14
14
  var _a;
15
- const { rec, index, list, reportTagsView, textStyles, space, openFixedSize, fixedSizeRatio } = props;
15
+ const { listItem, index, list, reportTagsView, textStyles, space, openFixedSize, fixedSizeRatio } = props;
16
+ const rec = listItem;
16
17
  const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = (0, hooks_1.useSxpDataSource)();
17
18
  const [showVideo, setShowVideo] = (0, react_1.useState)(false);
18
19
  const imgDom = (0, react_1.useRef)(null);
@@ -132,8 +133,8 @@ function WaterfallList(_a) {
132
133
  (0, react_1.useEffect)(() => {
133
134
  var _a, _b;
134
135
  setIsLoadingData(true);
135
- waterFallData &&
136
- (getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
136
+ if (waterFallData) {
137
+ getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
137
138
  hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag,
138
139
  defaultSize: hashTagSize,
139
140
  maxSize: hashTagSize
@@ -143,19 +144,9 @@ function WaterfallList(_a) {
143
144
  const list = (_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : [];
144
145
  setList(list);
145
146
  setIsLoadingData(false);
146
- const products = [];
147
- list === null || list === void 0 ? void 0 : list.forEach((item) => {
148
- var _a, _b;
149
- products.push(...((_b = (_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.bindProducts) !== null && _b !== void 0 ? _b : []));
150
- });
151
- bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
152
- eventName: 'PageView',
153
- product: products,
154
- rec: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec,
155
- position: cacheActiveIndex
156
- });
157
- }));
158
- if (isOpenHashTag) {
147
+ });
148
+ }
149
+ else if (isOpenHashTag) {
159
150
  const res = preview_json_1.default;
160
151
  setData(res);
161
152
  setList((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : []);
@@ -187,7 +178,7 @@ function WaterfallList(_a) {
187
178
  __html: (0, tool_1.setFontForText)(((_j = data === null || data === void 0 ? void 0 : data.tag) === null || _j === void 0 ? void 0 : _j.linkTitle) || 'Shop the collection', (_k = props === null || props === void 0 ? void 0 : props.textStyles) === null || _k === void 0 ? void 0 : _k.hashTagLink)
188
179
  } }),
189
180
  react_1.default.createElement("div", { className: 'list-content' }, list === null || list === void 0 ? void 0 : list.map((item, ind) => {
190
- return (react_1.default.createElement(WaterfallFlowItem, Object.assign({ key: ind, index: ind, rec: item, list: list, reportTagsView: reportTagsView }, props)));
181
+ return (react_1.default.createElement(WaterfallFlowItem, Object.assign({ key: ind, index: ind, listItem: item, list: list, reportTagsView: reportTagsView }, props)));
191
182
  })),
192
183
  react_1.default.createElement("div", { hidden: !isLoadMore, style: { textAlign: 'center' } }, "loading..."),
193
184
  react_1.default.createElement("div", { hidden: !((_l = data === null || data === void 0 ? void 0 : data.tag) === null || _l === void 0 ? void 0 : _l.link), style: {
package/lib/core/components/SxpPageRender/WaterFall/WaterfallList.js CHANGED
@@ -12,7 +12,7 @@ const useEventReport_1 = require("../../../../core/hooks/useEventReport");
12
12
  const materials_1 = require("../../../../core/utils/materials");
13
13
  const WaterfallFlowItem = (props) => {
14
14
  var _a;
15
- const { rec, style = {}, sizeChange = () => { }, unitWidth, index, showBorder, list, reportTagsView, textStyles, space } = props;
15
+ const { listItem, style = {}, sizeChange = () => { }, unitWidth, index, showBorder, list, reportTagsView, textStyles, space } = props;
16
16
  const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = (0, hooks_1.useSxpDataSource)();
17
17
  const [showVideo, setShowVideo] = (0, react_1.useState)(false);
18
18
  const [isLoading, setIsLoading] = (0, react_1.useState)(false);
@@ -25,6 +25,7 @@ const WaterfallFlowItem = (props) => {
25
25
  const videoDom = (0, react_1.useRef)(null);
26
26
  const canvasRef = (0, react_1.useRef)(null);
27
27
  const [firstFrameSrc, setFirstFrameSrc] = (0, react_1.useState)('');
28
+ const rec = listItem;
28
29
  const src = (0, react_1.useMemo)(() => {
29
30
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
30
31
  if ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) {
@@ -222,17 +223,6 @@ function WaterfallList(_a) {
222
223
  const list = (_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : [];
223
224
  setList(list);
224
225
  setIsLoadingData(false);
225
- const products = [];
226
- list === null || list === void 0 ? void 0 : list.forEach((item) => {
227
- var _a, _b;
228
- products.push(...((_b = (_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.bindProducts) !== null && _b !== void 0 ? _b : []));
229
- });
230
- bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
231
- eventName: 'PageView',
232
- product: products,
233
- rec: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec,
234
- position: cacheActiveIndex
235
- });
236
226
  }));
237
227
  if (isOpenHashTag) {
238
228
  const res = preview_json_1.default;
@@ -310,7 +300,7 @@ function WaterfallList(_a) {
310
300
  react_1.default.createElement("div", { className: 'waterFallList-content' }, list === null || list === void 0 ? void 0 :
311
301
  list.map((item, ind) => {
312
302
  var _a;
313
- return (react_1.default.createElement(WaterfallFlowItem, Object.assign({ key: ind, index: ind, rec: item, list: list, showBorder: scrollTop + ((_a = scrollParent === null || scrollParent === void 0 ? void 0 : scrollParent.current) === null || _a === void 0 ? void 0 : _a.clientHeight), style: styleList[ind], sizeChange: onSizeChange, unitWidth: unitWidth, reportTagsView: reportTagsView }, props)));
303
+ return (react_1.default.createElement(WaterfallFlowItem, Object.assign({ key: ind, index: ind, listItem: item, list: list, showBorder: scrollTop + ((_a = scrollParent === null || scrollParent === void 0 ? void 0 : scrollParent.current) === null || _a === void 0 ? void 0 : _a.clientHeight), style: styleList[ind], sizeChange: onSizeChange, unitWidth: unitWidth, reportTagsView: reportTagsView }, props)));
314
304
  }),
315
305
  react_1.default.createElement("div", { hidden: !((_l = data === null || data === void 0 ? void 0 : data.tag) === null || _l === void 0 ? void 0 : _l.link), style: {
316
306
  position: 'absolute',
package/lib/core/components/SxpPageRender/WaterFall/index.d.ts CHANGED
@@ -1,9 +1,7 @@
1
1
  import React from 'react';
2
2
  import './index.less';
3
- import { RecItemType } from '../typing';
4
3
  import { IHashTagProps } from '../../../../materials/sxp/HashTag';
5
4
  interface IWaterFallProps {
6
- rec?: RecItemType;
7
5
  }
8
6
  declare const _default: React.NamedExoticComponent<IWaterFallProps & IHashTagProps>;
9
7
  export default _default;
package/lib/core/components/SxpPageRender/WaterFall/index.js CHANGED
@@ -78,10 +78,17 @@ const WaterFall = (props) => {
78
78
  });
79
79
  }, [recData, bffEventReport, viewTime, isFromHashtag, cacheActiveIndex]);
80
80
  (0, react_1.useEffect)(() => {
81
+ var _a, _b;
81
82
  if (openHashtag) {
82
83
  setViewTime(new Date());
84
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
85
+ eventName: 'PageView',
86
+ product: (_b = (_a = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.bindProducts,
87
+ rec: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec,
88
+ position: cacheActiveIndex
89
+ });
83
90
  }
84
- }, [openHashtag]);
91
+ }, [openHashtag, bffFbReport, waterFallData, cacheActiveIndex]);
85
92
  (0, react_1.useEffect)(() => {
86
93
  const initTime = () => {
87
94
  setViewTime(new Date());
package/lib/core/components/SxpPageRender/index.js CHANGED
@@ -133,14 +133,16 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
133
133
  }
134
134
  });
135
135
  const isPostType = ((_w = item === null || item === void 0 ? void 0 : item.video) === null || _w === void 0 ? void 0 : _w.url) || ((_y = (_x = item === null || item === void 0 ? void 0 : item.video) === null || _x === void 0 ? void 0 : _x.imgUrls) === null || _y === void 0 ? void 0 : _y.length);
136
- bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
137
- eventName: 'ExitFeed',
138
- product: isPostType ? (_z = item === null || item === void 0 ? void 0 : item.video) === null || _z === void 0 ? void 0 : _z.bindProducts : (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [],
139
- rec: item,
140
- position: activeIndex,
141
- content_id: isPostType ? (_1 = (_0 = item === null || item === void 0 ? void 0 : item.video) === null || _0 === void 0 ? void 0 : _0.itemId) !== null && _1 !== void 0 ? _1 : '' : (_3 = (_2 = item === null || item === void 0 ? void 0 : item.product) === null || _2 === void 0 ? void 0 : _2.itemId) !== null && _3 !== void 0 ? _3 : '',
142
- view_time: new Date() - viewTime.current
143
- });
136
+ if (!popupDetailData) {
137
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
138
+ eventName: 'ExitFeed',
139
+ product: isPostType ? (_z = item === null || item === void 0 ? void 0 : item.video) === null || _z === void 0 ? void 0 : _z.bindProducts : (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [],
140
+ rec: item,
141
+ position: activeIndex,
142
+ content_id: isPostType ? (_1 = (_0 = item === null || item === void 0 ? void 0 : item.video) === null || _0 === void 0 ? void 0 : _0.itemId) !== null && _1 !== void 0 ? _1 : '' : (_3 = (_2 = item === null || item === void 0 ? void 0 : item.product) === null || _2 === void 0 ? void 0 : _2.itemId) !== null && _3 !== void 0 ? _3 : '',
143
+ view_time: new Date() - viewTime.current
144
+ });
145
+ }
144
146
  }, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime, bffFbReport]);
145
147
  (0, react_1.useEffect)(() => {
146
148
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
@@ -441,7 +443,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
441
443
  }
442
444
  };
443
445
  const handleScrollEvent = (swiper) => {
444
- 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;
446
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10;
445
447
  const item = data[swiper.previousIndex];
446
448
  const activeItem = data[swiper.activeIndex];
447
449
  if (!item)
@@ -463,22 +465,22 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
463
465
  previousContentType = 'product';
464
466
  previousContentId = (_m = (_l = item === null || item === void 0 ? void 0 : item.product) === null || _l === void 0 ? void 0 : _l.itemId) !== null && _m !== void 0 ? _m : '';
465
467
  previousProduct = (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [];
466
- previousContentsName = (_p = (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.title) !== null && _p !== void 0 ? _p : '';
468
+ previousContentsName = '';
467
469
  }
468
- if (!((_q = activeItem === null || activeItem === void 0 ? void 0 : activeItem.video) === null || _q === void 0 ? void 0 : _q.url) && !((_s = (_r = activeItem === null || activeItem === void 0 ? void 0 : activeItem.video) === null || _r === void 0 ? void 0 : _r.imgUrls) === null || _s === void 0 ? void 0 : _s.length)) {
469
- contentId = (_u = (_t = activeItem === null || activeItem === void 0 ? void 0 : activeItem.product) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '';
470
+ if (!((_o = activeItem === null || activeItem === void 0 ? void 0 : activeItem.video) === null || _o === void 0 ? void 0 : _o.url) && !((_q = (_p = activeItem === null || activeItem === void 0 ? void 0 : activeItem.video) === null || _p === void 0 ? void 0 : _p.imgUrls) === null || _q === void 0 ? void 0 : _q.length)) {
471
+ contentId = (_s = (_r = activeItem === null || activeItem === void 0 ? void 0 : activeItem.product) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '';
470
472
  }
471
473
  if (swiper.previousIndex - swiper.activeIndex < 0) {
472
474
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
473
475
  eventInfo: {
474
476
  eventSubject: 'scrollDown',
475
477
  eventDescription: 'User scroll down',
476
- contentId: (_w = (_v = item === null || item === void 0 ? void 0 : item.video) === null || _v === void 0 ? void 0 : _v.itemId) !== null && _w !== void 0 ? _w : '',
477
- productId: (_y = (_x = item === null || item === void 0 ? void 0 : item.product) === null || _x === void 0 ? void 0 : _x.itemId) !== null && _y !== void 0 ? _y : '',
478
+ contentId: (_u = (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '',
479
+ productId: (_w = (_v = item === null || item === void 0 ? void 0 : item.product) === null || _v === void 0 ? void 0 : _v.itemId) !== null && _w !== void 0 ? _w : '',
478
480
  requestId: null,
479
- traceInfo: (_2 = (_0 = (_z = item === null || item === void 0 ? void 0 : item.video) === null || _z === void 0 ? void 0 : _z.traceInfo) !== null && _0 !== void 0 ? _0 : (_1 = item === null || item === void 0 ? void 0 : item.product) === null || _1 === void 0 ? void 0 : _1.traceInfo) !== null && _2 !== void 0 ? _2 : '',
481
+ traceInfo: (_0 = (_y = (_x = item === null || item === void 0 ? void 0 : item.video) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_z = item === null || item === void 0 ? void 0 : item.product) === null || _z === void 0 ? void 0 : _z.traceInfo) !== null && _0 !== void 0 ? _0 : '',
480
482
  contentFormat,
481
- position: ((_3 = swiper.previousIndex) !== null && _3 !== void 0 ? _3 : 0) + ''
483
+ position: ((_1 = swiper.previousIndex) !== null && _1 !== void 0 ? _1 : 0) + ''
482
484
  }
483
485
  });
484
486
  handleViewImageStartEnd(item);
@@ -490,12 +492,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
490
492
  eventInfo: {
491
493
  eventSubject: 'scrollUp',
492
494
  eventDescription: 'User scroll up',
493
- contentId: (_5 = (_4 = item === null || item === void 0 ? void 0 : item.video) === null || _4 === void 0 ? void 0 : _4.itemId) !== null && _5 !== void 0 ? _5 : '',
494
- productId: (_7 = (_6 = item.product) === null || _6 === void 0 ? void 0 : _6.itemId) !== null && _7 !== void 0 ? _7 : '',
495
+ contentId: (_3 = (_2 = item === null || item === void 0 ? void 0 : item.video) === null || _2 === void 0 ? void 0 : _2.itemId) !== null && _3 !== void 0 ? _3 : '',
496
+ productId: (_5 = (_4 = item.product) === null || _4 === void 0 ? void 0 : _4.itemId) !== null && _5 !== void 0 ? _5 : '',
495
497
  requestId: null,
496
- traceInfo: (_11 = (_9 = (_8 = item === null || item === void 0 ? void 0 : item.video) === null || _8 === void 0 ? void 0 : _8.traceInfo) !== null && _9 !== void 0 ? _9 : (_10 = item === null || item === void 0 ? void 0 : item.product) === null || _10 === void 0 ? void 0 : _10.traceInfo) !== null && _11 !== void 0 ? _11 : '',
498
+ traceInfo: (_9 = (_7 = (_6 = item === null || item === void 0 ? void 0 : item.video) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_8 = item === null || item === void 0 ? void 0 : item.product) === null || _8 === void 0 ? void 0 : _8.traceInfo) !== null && _9 !== void 0 ? _9 : '',
497
499
  contentFormat,
498
- position: ((_12 = swiper.previousIndex) !== null && _12 !== void 0 ? _12 : 0) + ''
500
+ position: ((_10 = swiper.previousIndex) !== null && _10 !== void 0 ? _10 : 0) + ''
499
501
  }
500
502
  });
501
503
  handleViewImageStartEnd(item);
@@ -740,7 +742,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
740
742
  renderView,
741
743
  renderLikeButton(visList[activeIndex], activeIndex, !!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
742
744
  renderToggleButton(!!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed))),
743
- react_1.default.createElement(WaterFall_1.default, Object.assign({}, (_u = (_t = (_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _s === void 0 ? void 0 : _s[0]) === null || _t === void 0 ? void 0 : _t.item) === null || _u === void 0 ? void 0 : _u.props, { rec: visList[activeIndex] })),
745
+ react_1.default.createElement(WaterFall_1.default, Object.assign({}, (_u = (_t = (_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _s === void 0 ? void 0 : _s[0]) === null || _t === void 0 ? void 0 : _t.item) === null || _u === void 0 ? void 0 : _u.props)),
744
746
  react_1.default.createElement(ConsentPopup_1.default, { resolver: resolver, globalConfig: globalConfig }),
745
747
  openMultiPosts && (react_1.default.createElement(MultiPosts_1.default, Object.assign({}, (_x = (_w = (_v = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _v === void 0 ? void 0 : _v[0]) === null || _w === void 0 ? void 0 : _w.item) === null || _x === void 0 ? void 0 : _x.props, (_0 = (_z = (_y = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _y === void 0 ? void 0 : _y[0]) === null || _z === void 0 ? void 0 : _z.item) === null || _0 === void 0 ? void 0 : _0.event, { style: { position: 'fixed', top: 0, left: 0, right: 0, bottom: bottomHeight + 'px' } }))))),
746
748
  (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting) && (react_1.default.createElement("div", { style: {
package/lib/core/context/SxpDataSourceProvider.js CHANGED
@@ -268,6 +268,25 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
268
268
  navigatorWithBeacon.sendBeacon = originalSendBeacon;
269
269
  };
270
270
  }, [bffCollectEvent]);
271
+ (0, react_1.useEffect)(() => {
272
+ const originalFormSubmit = HTMLFormElement.prototype.submit;
273
+ HTMLFormElement.prototype.submit = function () {
274
+ const form = this;
275
+ if (form.action.includes('facebook.com/tr')) {
276
+ const formData = new FormData(form);
277
+ const params = {};
278
+ for (const [key, value] of formData.entries()) {
279
+ params[key] = value;
280
+ }
281
+ bffCollectEvent({
282
+ eventName: params === null || params === void 0 ? void 0 : params.ev,
283
+ eventSource: 'Meta Pixel'
284
+ });
285
+ return originalFormSubmit.call(form);
286
+ }
287
+ return originalFormSubmit.call(form);
288
+ };
289
+ }, []);
271
290
  (0, react_1.useEffect)(() => {
272
291
  const _originalFetch = window.fetch;
273
292
  window.fetch = function (input, init) {
@@ -331,7 +350,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
331
350
  }
332
351
  });
333
352
  };
334
- }, [bffCollectEvent]);
353
+ }, []);
335
354
  (0, react_1.useEffect)(() => {
336
355
  const originalOpen = XMLHttpRequest.prototype.open;
337
356
  const originalSend = XMLHttpRequest.prototype.send;
@@ -558,7 +577,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
558
577
  const productCustomData = {
559
578
  content_ids: [product === null || product === void 0 ? void 0 : product.itemId],
560
579
  content_type: 'product',
561
- content_name: product === null || product === void 0 ? void 0 : product.title,
580
+ content_name: '',
562
581
  contents: [{
563
582
  item_id: product === null || product === void 0 ? void 0 : product.itemId,
564
583
  item_price: product === null || product === void 0 ? void 0 : product.price
@@ -747,20 +766,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
747
766
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
748
767
  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 })
749
768
  });
750
- if ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.eventSubject) === 'clickCta') {
751
- bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
752
- eventName: 'ClickCTA',
753
- product: product ? [product] : undefined,
754
- contentType: contentType !== null && contentType !== void 0 ? contentType : 'post',
755
- rec,
756
- position,
757
- cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
758
- cta_action_type: ctaActionType,
759
- target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
760
- target_url: targetUrl
761
- });
762
- }
763
- }, [bffEventReport, isFromHashtag, bffFbReport]);
769
+ }, [bffEventReport, isFromHashtag]);
764
770
  const h5EnterLink = (0, react_1.useCallback)(() => {
765
771
  var _a, _b;
766
772
  const time = new Date();
package/lib/materials/sxp/cta/AniLink/index.js CHANGED
@@ -11,7 +11,7 @@ const useOnScreen_1 = tslib_1.__importDefault(require("../../../../core/hooks/us
11
11
  const AniLink = (_a) => {
12
12
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
13
13
  var { style, recData, ctaTempStyles, index, event, onClick, isExternalLink = false, isActive } = _a, props = tslib_1.__rest(_a, ["style", "recData", "ctaTempStyles", "index", "event", "onClick", "isExternalLink", "isActive"]);
14
- const { ctaEvent, setPopupDetailData } = (0, hooks_1.useSxpDataSource)();
14
+ const { ctaEvent, setPopupDetailData, bffFbReport } = (0, hooks_1.useSxpDataSource)();
15
15
  const { jumpToWeb } = (0, useEventReport_1.useEventReport)();
16
16
  const [visible, setVisible] = (0, react_1.useState)(false);
17
17
  const ref = (0, react_1.useRef)(null);
@@ -25,7 +25,18 @@ const AniLink = (_a) => {
25
25
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
26
26
  eventSubject: 'clickCta',
27
27
  eventDescription: 'User clicked the CTA'
28
- }, recData, item, index, (isExternalLink && !!link) ? 'open_external_link' : 'open_internal_popup', link);
28
+ }, recData, item, index);
29
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
30
+ eventName: 'ClickCTA',
31
+ product: product ? [product] : undefined,
32
+ contentType: 'post',
33
+ recData,
34
+ index,
35
+ cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
36
+ cta_action_type: (isExternalLink && !!link) ? 'open_external_link' : 'open_internal_popup',
37
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
38
+ target_url: link
39
+ });
29
40
  setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { index }));
30
41
  if (isExternalLink) {
31
42
  if (!link)
package/lib/materials/sxp/cta/AniLinkPopup/index.js CHANGED
@@ -13,7 +13,7 @@ const AniLinkPopup = (_a) => {
13
13
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
14
14
  var { style, recData, ctaTempStyles, index, event, bottom_image, translateY, isTel, onClick, isExternalLink = false, isActive } = _a, props = tslib_1.__rest(_a, ["style", "recData", "ctaTempStyles", "index", "event", "bottom_image", "translateY", "isTel", "onClick", "isExternalLink", "isActive"]);
15
15
  style === null || style === void 0 ? true : delete style.transform;
16
- const { sxpParameter, globalConfig, ctaEvent, setPopupDetailData } = (0, hooks_1.useSxpDataSource)();
16
+ const { sxpParameter, globalConfig, ctaEvent, setPopupDetailData, bffFbReport } = (0, hooks_1.useSxpDataSource)();
17
17
  const { jumpToWeb } = (0, useEventReport_1.useEventReport)();
18
18
  const [visible, setVisible] = (0, react_1.useState)(true);
19
19
  const cta = ((_d = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.bindCta) || ((_f = (_e = recData === null || recData === void 0 ? void 0 : recData.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.bindCta) || ((_g = recData === null || recData === void 0 ? void 0 : recData.video) === null || _g === void 0 ? void 0 : _g.bindCta);
@@ -25,7 +25,18 @@ const AniLinkPopup = (_a) => {
25
25
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
26
26
  eventSubject: 'clickCta',
27
27
  eventDescription: 'User clicked the CTA'
28
- }, recData, item, index, (isExternalLink && !!link) ? 'open_external_link' : 'open_internal_popup', link);
28
+ }, recData, item, index);
29
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
30
+ eventName: 'ClickCTA',
31
+ product: product ? [product] : undefined,
32
+ contentType: 'post',
33
+ recData,
34
+ index,
35
+ cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
36
+ cta_action_type: (isExternalLink && !!link) ? 'open_external_link' : 'open_internal_popup',
37
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
38
+ target_url: link
39
+ });
29
40
  setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { index }));
30
41
  if (isExternalLink) {
31
42
  if (!link)
package/lib/materials/sxp/popup/CommodityDetail/index.js CHANGED
@@ -14,6 +14,7 @@ const ExpandableText_1 = tslib_1.__importDefault(require("../../../../core/compo
14
14
  const FormatImage_1 = tslib_1.__importDefault(require("../../../../core/components/SxpPageRender/FormatImage"));
15
15
  const tool_1 = require("../../../../core/utils/tool");
16
16
  const materials_1 = require("../../../../core/utils/materials");
17
+ const event_1 = tslib_1.__importStar(require("../../../../core/utils/event"));
17
18
  const CommodityDetail = (_a) => {
18
19
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
19
20
  var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel, iframeBgColor, isActive = true } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel", "iframeBgColor", "isActive"]);
@@ -47,29 +48,79 @@ const CommodityDetail = (_a) => {
47
48
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
48
49
  eventSubject: 'clickCta',
49
50
  eventDescription: 'User clicked the CTA'
50
- }, data, product, position, 'open_external_link', product.link, 'product');
51
+ }, data, product, position);
52
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
53
+ eventName: 'ClickCTA',
54
+ product: product ? [product] : undefined,
55
+ contentType: 'product',
56
+ data,
57
+ position,
58
+ cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
59
+ cta_action_type: 'open_external_link',
60
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
61
+ target_url: product.link
62
+ });
51
63
  }
52
64
  window.location.href = window.getJointUtmLink(product.link);
53
65
  }
54
66
  };
55
67
  (0, react_1.useEffect)(() => {
68
+ var _a;
56
69
  if (!isActive)
57
70
  return;
71
+ const recData = Object.assign(Object.assign({}, data), { video: (data === null || data === void 0 ? void 0 : data.video) ? Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.video), { title: '', imgUrls: !isPost ? product === null || product === void 0 ? void 0 : product.homePage : (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.imgUrls }) : null });
58
72
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
59
73
  eventName: 'ProductView',
60
74
  product: product ? [product] : undefined,
61
75
  contentType: 'product',
62
- rec: data,
76
+ rec: recData,
63
77
  position
64
78
  });
65
79
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
66
80
  eventName: 'PageView',
67
81
  product: product ? [product] : undefined,
68
82
  contentType: 'product',
69
- rec: data,
83
+ rec: recData,
70
84
  position
71
85
  });
72
86
  }, [isActive, bffFbReport]);
87
+ (0, react_1.useEffect)(() => {
88
+ if (!isActive || isPost)
89
+ return;
90
+ const onShow = () => {
91
+ curTimeRef.current = new Date();
92
+ };
93
+ const recData = Object.assign(Object.assign({}, data), { video: (data === null || data === void 0 ? void 0 : data.video) ? Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.video), { title: '' }) : null });
94
+ const onHide = () => {
95
+ var _a;
96
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
97
+ eventName: 'ExitFeed',
98
+ product: product ? [product] : undefined,
99
+ contentType: 'product',
100
+ rec: recData,
101
+ position,
102
+ view_time: new Date() - curTimeRef.current,
103
+ content_id: (_a = product === null || product === void 0 ? void 0 : product.itemId) !== null && _a !== void 0 ? _a : ''
104
+ });
105
+ };
106
+ event_1.default.on(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW, () => onShow());
107
+ event_1.default.on(event_1.SXP_EVENT_TYPE.PAGE_DID_HIDE, () => onHide());
108
+ return () => {
109
+ var _a;
110
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
111
+ eventName: 'Engagement',
112
+ product: product ? [product] : undefined,
113
+ rec: recData,
114
+ position,
115
+ content_id: (_a = product === null || product === void 0 ? void 0 : product.itemId) !== null && _a !== void 0 ? _a : '',
116
+ engagement_type: 'close_popup',
117
+ contentType: 'product',
118
+ view_time: new Date() - curTimeRef.current
119
+ });
120
+ event_1.default.off(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW);
121
+ event_1.default.off(event_1.SXP_EVENT_TYPE.PAGE_DID_HIDE);
122
+ };
123
+ }, [isActive, isPost, bffFbReport, data, product, position, curTimeRef]);
73
124
  (0, react_1.useEffect)(() => {
74
125
  const initTime = () => {
75
126
  curTimeRef.current = new Date();
package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js CHANGED
@@ -14,6 +14,7 @@ const useEventReport_1 = require("../../../../core/hooks/useEventReport");
14
14
  const FormatImage_1 = tslib_1.__importDefault(require("../../../../core/components/SxpPageRender/FormatImage"));
15
15
  const tool_1 = require("../../../../core/utils/tool");
16
16
  const materials_1 = require("../../../../core/utils/materials");
17
+ const event_1 = tslib_1.__importStar(require("../../../../core/utils/event"));
17
18
  const CommodityDetailDiroNew = (_a) => {
18
19
  var _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;
19
20
  var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel, iframeBgColor, isActive = true } = _a, props = tslib_1.__rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel", "iframeBgColor", "isActive"]);
@@ -51,29 +52,79 @@ const CommodityDetailDiroNew = (_a) => {
51
52
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
52
53
  eventSubject: 'clickCta',
53
54
  eventDescription: 'User clicked the CTA'
54
- }, data, product, position, 'open_external_link', product.link, 'product');
55
+ }, data, product, position);
56
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
57
+ eventName: 'ClickCTA',
58
+ product: product ? [product] : undefined,
59
+ contentType: 'product',
60
+ data,
61
+ position,
62
+ cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
63
+ cta_action_type: 'open_external_link',
64
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
65
+ target_url: product.link
66
+ });
55
67
  }
56
68
  window.location.href = window.getJointUtmLink(product.link);
57
69
  }
58
70
  };
59
71
  (0, react_1.useEffect)(() => {
72
+ var _a;
60
73
  if (!isActive)
61
74
  return;
75
+ const recData = Object.assign(Object.assign({}, data), { video: (data === null || data === void 0 ? void 0 : data.video) ? Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.video), { title: '', imgUrls: !isPost ? product === null || product === void 0 ? void 0 : product.homePage : (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.imgUrls }) : null });
62
76
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
63
77
  eventName: 'ProductView',
64
78
  product: product ? [product] : undefined,
65
79
  contentType: 'product',
66
- rec: data,
80
+ rec: recData,
67
81
  position
68
82
  });
69
83
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
70
84
  eventName: 'PageView',
71
85
  product: product ? [product] : undefined,
72
86
  contentType: 'product',
73
- rec: data,
87
+ rec: recData,
74
88
  position
75
89
  });
76
- }, [isActive, bffFbReport]);
90
+ }, [isActive, bffFbReport, isPost]);
91
+ (0, react_1.useEffect)(() => {
92
+ if (!isActive || isPost)
93
+ return;
94
+ const onShow = () => {
95
+ curTimeRef.current = new Date();
96
+ };
97
+ const recData = Object.assign(Object.assign({}, data), { video: (data === null || data === void 0 ? void 0 : data.video) ? Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.video), { title: '' }) : null });
98
+ const onHide = () => {
99
+ var _a;
100
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
101
+ eventName: 'ExitFeed',
102
+ product: product ? [product] : undefined,
103
+ contentType: 'product',
104
+ rec: recData,
105
+ position,
106
+ view_time: new Date() - curTimeRef.current,
107
+ content_id: (_a = product === null || product === void 0 ? void 0 : product.itemId) !== null && _a !== void 0 ? _a : ''
108
+ });
109
+ };
110
+ event_1.default.on(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW, () => onShow());
111
+ event_1.default.on(event_1.SXP_EVENT_TYPE.PAGE_DID_HIDE, () => onHide());
112
+ return () => {
113
+ var _a;
114
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
115
+ eventName: 'Engagement',
116
+ product: product ? [product] : undefined,
117
+ rec: recData,
118
+ position,
119
+ content_id: (_a = product === null || product === void 0 ? void 0 : product.itemId) !== null && _a !== void 0 ? _a : '',
120
+ engagement_type: 'close_popup',
121
+ contentType: 'product',
122
+ view_time: new Date() - curTimeRef.current
123
+ });
124
+ event_1.default.off(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW);
125
+ event_1.default.off(event_1.SXP_EVENT_TYPE.PAGE_DID_HIDE);
126
+ };
127
+ }, [isActive, isPost, bffFbReport, data, product, position, curTimeRef]);
77
128
  (0, react_1.useEffect)(() => {
78
129
  const initTime = () => {
79
130
  if (!isActive)
package/lib/materials/sxp/popup/CommodityList/index.js CHANGED
@@ -29,10 +29,22 @@ const CommodityList = (_a) => {
29
29
  });
30
30
  }, [(_d = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _d === void 0 ? void 0 : _d.enableFormattedPrice, globalConfig]);
31
31
  const handleClick = (0, lodash_1.throttle)((item, multiCheckIndex, e) => {
32
+ var _a;
32
33
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
33
34
  eventSubject: 'clickCta',
34
35
  eventDescription: 'User clicked the CTA'
35
- }, recData, item, index, isExternalLink && !!(item === null || item === void 0 ? void 0 : item.link) ? 'open_external_link' : 'open_internal_popup', item.link, 'product');
36
+ }, recData, item, index);
37
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
38
+ eventName: 'ClickCTA',
39
+ product: item ? [item] : undefined,
40
+ contentType: 'product',
41
+ recData,
42
+ index,
43
+ cta_text: (_a = item === null || item === void 0 ? void 0 : item.bindCta) === null || _a === void 0 ? void 0 : _a.enTitle,
44
+ cta_action_type: isExternalLink && !!(item === null || item === void 0 ? void 0 : item.link) ? 'open_external_link' : 'open_internal_popup',
45
+ target_content_id: item === null || item === void 0 ? void 0 : item.itemId,
46
+ target_url: item.link
47
+ });
36
48
  setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { video: Object.assign(Object.assign({}, recData === null || recData === void 0 ? void 0 : recData.video), { bindProduct: item }), index, multiCheckIndex }));
37
49
  if (isExternalLink) {
38
50
  if (!(item === null || item === void 0 ? void 0 : item.link))
package/lib/materials/sxp/template/components/EventProvider.js CHANGED
@@ -9,26 +9,38 @@ const EventProvider = (_a) => {
9
9
  var { rec, children, className, onClick, style, isExternalLink = false, index, jumpLink, multItem, multiCheckIndex } = _a, props = tslib_1.__rest(_a, ["rec", "children", "className", "onClick", "style", "isExternalLink", "index", "jumpLink", "multItem", "multiCheckIndex"]);
10
10
  const ref = (0, react_1.useRef)(null);
11
11
  const { popup } = (0, hooks_1.useEditor)();
12
- const { setPopupDetailData, ctaEvent } = (0, hooks_1.useSxpDataSource)();
12
+ const { setPopupDetailData, ctaEvent, bffFbReport } = (0, hooks_1.useSxpDataSource)();
13
13
  const { jumpToWeb } = (0, useEventReport_1.useEventReport)();
14
14
  const [element, setElement] = (0, react_1.useState)(null);
15
15
  const handleClick = (0, lodash_1.throttle)((e) => {
16
- var _a, _b, _c, _d, _e, _f;
16
+ var _a, _b, _c, _d, _e, _f, _g, _h;
17
17
  e.preventDefault();
18
18
  const item = multItem || ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProduct) !== null && _b !== void 0 ? _b : rec === null || rec === void 0 ? void 0 : rec.video);
19
- const link = ((_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) === null || _d === void 0 ? void 0 : _d.link) || (multItem === null || multItem === void 0 ? void 0 : multItem.link);
19
+ const link = jumpLink || ((_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) === null || _d === void 0 ? void 0 : _d.link) || (multItem === null || multItem === void 0 ? void 0 : multItem.link) || '';
20
20
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
21
21
  eventSubject: 'clickCta',
22
22
  eventDescription: 'User clicked the CTA'
23
- }, rec, item, index, isExternalLink && (jumpLink || !!link) ? 'open_external_link' : 'open_internal_popup', link);
23
+ }, rec, item, index);
24
+ const product = multItem || ((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.bindProduct);
25
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
26
+ eventName: 'ClickCTA',
27
+ product: product ? [product] : undefined,
28
+ contentType: 'post',
29
+ rec,
30
+ index,
31
+ cta_text: (_f = item === null || item === void 0 ? void 0 : item.bindCta) === null || _f === void 0 ? void 0 : _f.enTitle,
32
+ cta_action_type: isExternalLink && (!!link) ? 'open_external_link' : 'open_internal_popup',
33
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
34
+ target_url: link
35
+ });
24
36
  setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(multItem && multiCheckIndex !== undefined && multiCheckIndex >= 0
25
37
  ? Object.assign(Object.assign({}, rec), { video: Object.assign(Object.assign({}, rec === null || rec === void 0 ? void 0 : rec.video), { bindProduct: multItem }), index, multiCheckIndex }) : Object.assign(Object.assign({}, rec), { index }));
26
38
  setElement(ref === null || ref === void 0 ? void 0 : ref.current);
27
39
  if (isExternalLink) {
28
- if (!jumpLink && !link)
40
+ if (!link)
29
41
  return;
30
- const cta = ((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.bindCta) || (multItem === null || multItem === void 0 ? void 0 : multItem.bindCta);
31
- const product = ((_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.bindProduct) || multItem;
42
+ const cta = ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.bindCta) || (multItem === null || multItem === void 0 ? void 0 : multItem.bindCta);
43
+ const product = ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.bindProduct) || multItem;
32
44
  jumpToWeb(e, rec, product, cta, index);
33
45
  window.location.href = window.getJointUtmLink(link);
34
46
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pb-sxp-ui",
3
- "version": "1.20.3",
3
+ "version": "1.20.5",
4
4
  "description": "React enterprise-class UI components",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",