pb-sxp-ui 1.20.2 → 1.20.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/dist/index.cjs +379 -123
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +379 -123
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +7 -7
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +7 -7
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +379 -123
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +7 -7
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/SxpPageRender/LikeButton/index.js +12 -4
  14. package/es/core/components/SxpPageRender/VideoWidget/index.js +6 -2
  15. package/es/core/components/SxpPageRender/WaterFall/List.js +12 -22
  16. package/es/core/components/SxpPageRender/WaterFall/WaterfallList.js +6 -4
  17. package/es/core/components/SxpPageRender/WaterFall/index.js +6 -2
  18. package/es/core/components/SxpPageRender/index.js +62 -16
  19. package/es/core/context/SxpDataSourceProvider.d.ts +8 -3
  20. package/es/core/context/SxpDataSourceProvider.js +63 -43
  21. package/es/core/utils/tool.d.ts +2 -1
  22. package/es/core/utils/tool.js +15 -1
  23. package/es/materials/sxp/cta/AniLink/index.js +18 -7
  24. package/es/materials/sxp/cta/AniLinkPopup/index.js +21 -10
  25. package/es/materials/sxp/popup/CommodityDetail/index.js +59 -2
  26. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +60 -3
  27. package/es/materials/sxp/popup/CommodityList/index.js +21 -5
  28. package/es/materials/sxp/template/components/EventProvider.js +22 -10
  29. package/lib/core/components/SxpPageRender/LikeButton/index.js +12 -4
  30. package/lib/core/components/SxpPageRender/VideoWidget/index.js +6 -2
  31. package/lib/core/components/SxpPageRender/WaterFall/List.js +11 -21
  32. package/lib/core/components/SxpPageRender/WaterFall/WaterfallList.js +6 -4
  33. package/lib/core/components/SxpPageRender/WaterFall/index.js +6 -2
  34. package/lib/core/components/SxpPageRender/index.js +62 -16
  35. package/lib/core/context/SxpDataSourceProvider.d.ts +8 -3
  36. package/lib/core/context/SxpDataSourceProvider.js +61 -41
  37. package/lib/core/utils/tool.d.ts +2 -1
  38. package/lib/core/utils/tool.js +16 -1
  39. package/lib/materials/sxp/cta/AniLink/index.js +18 -7
  40. package/lib/materials/sxp/cta/AniLinkPopup/index.js +21 -10
  41. package/lib/materials/sxp/popup/CommodityDetail/index.js +59 -2
  42. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +60 -3
  43. package/lib/materials/sxp/popup/CommodityList/index.js +21 -5
  44. package/lib/materials/sxp/template/components/EventProvider.js +22 -10
  45. package/package.json +1 -1
package/es/core/components/SxpPageRender/LikeButton/index.js CHANGED
@@ -8,12 +8,12 @@ const defaultLikeIconPath = '/pb_static/f07900fe3f0f4ae188ea1611d4801a44.png';
8
8
  const LikeButton = (_a) => {
9
9
  var _b;
10
10
  var { active, activeIcon, unActicveIcon, recData, position } = _a, props = __rest(_a, ["active", "activeIcon", "unActicveIcon", "recData", "position"]);
11
- const { mutateLike, mutateUnlike, bffEventReport, setCacheRtcList, cacheRtcList } = useSxpDataSource();
11
+ const { mutateLike, mutateUnlike, bffEventReport, setCacheRtcList, cacheRtcList, bffFbReport } = useSxpDataSource();
12
12
  const [state, setState] = useState((_b = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList[position]) === null || _b === void 0 ? void 0 : _b.isCollected);
13
13
  const likeIcon = useIconLink(defaultLikeIconPath);
14
14
  const unlikeIcon = useIconLink(defaultUnLikeIconPath);
15
15
  const handleClick = debounce(() => __awaiter(void 0, void 0, void 0, function* () {
16
- var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
16
+ var _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;
17
17
  if (state) {
18
18
  setState(false);
19
19
  const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({ videoItemId: (_d = (_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.itemId) !== null && _d !== void 0 ? _d : '' })))) !== null && _e !== void 0 ? _e : false;
@@ -57,16 +57,24 @@ const LikeButton = (_a) => {
57
57
  traceInfo: (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.traceInfo
58
58
  }
59
59
  });
60
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
61
+ eventName: 'Engagement',
62
+ product: (_z = recData === null || recData === void 0 ? void 0 : recData.video) === null || _z === void 0 ? void 0 : _z.bindProducts,
63
+ rec: recData,
64
+ position,
65
+ content_id: (_1 = (_0 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _0 === void 0 ? void 0 : _0.itemId) !== null && _1 !== void 0 ? _1 : '',
66
+ engagement_type: 'like'
67
+ });
60
68
  if (!result) {
61
69
  setState(false);
62
70
  }
63
71
  else {
64
- const nRtcList = (_z = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
72
+ const nRtcList = (_2 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
65
73
  if (index === position) {
66
74
  item.isCollected = true;
67
75
  }
68
76
  return item;
69
- })) !== null && _z !== void 0 ? _z : [];
77
+ })) !== null && _2 !== void 0 ? _2 : [];
70
78
  setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
71
79
  }
72
80
  }
package/es/core/components/SxpPageRender/VideoWidget/index.js CHANGED
@@ -285,11 +285,15 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
285
285
  if (isActive) {
286
286
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
287
287
  eventName: 'ViewContent',
288
- product: (_b = (_a = data === null || data === void 0 ? void 0 : data[index]) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.bindProduct
288
+ product: (_b = (_a = data === null || data === void 0 ? void 0 : data[index]) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.bindProducts,
289
+ rec: data === null || data === void 0 ? void 0 : data[index],
290
+ position: index
289
291
  });
290
292
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
291
293
  eventName: 'PageView',
292
- product: (_d = (_c = data === null || data === void 0 ? void 0 : data[index]) === null || _c === void 0 ? void 0 : _c.video) === null || _d === void 0 ? void 0 : _d.bindProduct
294
+ product: (_d = (_c = data === null || data === void 0 ? void 0 : data[index]) === null || _c === void 0 ? void 0 : _c.video) === null || _d === void 0 ? void 0 : _d.bindProducts,
295
+ rec: data === null || data === void 0 ? void 0 : data[index],
296
+ position: index
293
297
  });
294
298
  (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
295
299
  }
package/es/core/components/SxpPageRender/WaterFall/List.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { __rest } from "tslib";
2
- import React, { useState, useEffect, useMemo, useRef, useCallback } from 'react';
2
+ import React, { useState, useEffect, useMemo, useRef } from 'react';
3
3
  import './List.less';
4
4
  import FormatImage from '../FormatImage';
5
5
  import previewData from './preview.json';
@@ -10,7 +10,8 @@ import { useEventReport } from '../../../../core/hooks/useEventReport';
10
10
  import { getPriceText } from '../../../../core/utils/materials';
11
11
  const WaterfallFlowItem = (props) => {
12
12
  var _a;
13
- const { rec, index, list, reportTagsView, textStyles, space, openFixedSize, fixedSizeRatio } = props;
13
+ const { listItem, index, list, reportTagsView, textStyles, space, openFixedSize, fixedSizeRatio } = props;
14
+ const rec = listItem;
14
15
  const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = useSxpDataSource();
15
16
  const [showVideo, setShowVideo] = useState(false);
16
17
  const imgDom = useRef(null);
@@ -120,41 +121,30 @@ const WaterfallFlowItem = (props) => {
120
121
  export default function WaterfallList(_a) {
121
122
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
122
123
  var { reportTagsView, showBanner } = _a, props = __rest(_a, ["reportTagsView", "showBanner"]);
123
- const { waterFallData, getRecommendVideos, hashTagSize, loadingImage, isOpenHashTag, cacheActiveIndex } = useSxpDataSource();
124
+ const { waterFallData, getRecommendVideos, hashTagSize, loadingImage, isOpenHashTag, cacheActiveIndex, bffFbReport } = useSxpDataSource();
124
125
  const { jumpToWeb } = useEventReport();
125
126
  const [list, setList] = useState();
126
127
  const [data, setData] = useState();
127
128
  const [isLoadingData, setIsLoadingData] = useState(false);
128
129
  const containerRef = useRef(null);
129
130
  const [isLoadMore, setIsLoadMore] = useState(false);
130
- const loadMoreData = useCallback(() => {
131
- if (isLoadMore)
132
- return;
133
- setIsLoadMore(true);
134
- waterFallData &&
135
- (getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
136
- hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag
137
- }).then((res) => {
138
- var _a;
139
- setList(list === null || list === void 0 ? void 0 : list.concat((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []));
140
- setIsLoadMore(false);
141
- }));
142
- }, [waterFallData, getRecommendVideos, list, isLoadMore]);
143
131
  useEffect(() => {
144
132
  var _a, _b;
145
133
  setIsLoadingData(true);
146
- waterFallData &&
147
- (getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
134
+ if (waterFallData) {
135
+ getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
148
136
  hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag,
149
137
  defaultSize: hashTagSize,
150
138
  maxSize: hashTagSize
151
139
  }).then((res) => {
152
140
  var _a, _b;
153
141
  setData(res);
154
- 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 : []);
142
+ 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 : [];
143
+ setList(list);
155
144
  setIsLoadingData(false);
156
- }));
157
- if (isOpenHashTag) {
145
+ });
146
+ }
147
+ else if (isOpenHashTag) {
158
148
  const res = previewData;
159
149
  setData(res);
160
150
  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 : []);
@@ -186,7 +176,7 @@ export default function WaterfallList(_a) {
186
176
  __html: 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)
187
177
  } }),
188
178
  React.createElement("div", { className: 'list-content' }, list === null || list === void 0 ? void 0 : list.map((item, ind) => {
189
- return (React.createElement(WaterfallFlowItem, Object.assign({ key: ind, index: ind, rec: item, list: list, reportTagsView: reportTagsView }, props)));
179
+ return (React.createElement(WaterfallFlowItem, Object.assign({ key: ind, index: ind, listItem: item, list: list, reportTagsView: reportTagsView }, props)));
190
180
  })),
191
181
  React.createElement("div", { hidden: !isLoadMore, style: { textAlign: 'center' } }, "loading..."),
192
182
  React.createElement("div", { hidden: !((_l = data === null || data === void 0 ? void 0 : data.tag) === null || _l === void 0 ? void 0 : _l.link), style: {
package/es/core/components/SxpPageRender/WaterFall/WaterfallList.js CHANGED
@@ -10,7 +10,7 @@ import { useEventReport } from '../../../../core/hooks/useEventReport';
10
10
  import { getPriceText } from '../../../../core/utils/materials';
11
11
  const WaterfallFlowItem = (props) => {
12
12
  var _a;
13
- const { rec, style = {}, sizeChange = () => { }, unitWidth, index, showBorder, list, reportTagsView, textStyles, space } = props;
13
+ const { listItem, style = {}, sizeChange = () => { }, unitWidth, index, showBorder, list, reportTagsView, textStyles, space } = props;
14
14
  const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = useSxpDataSource();
15
15
  const [showVideo, setShowVideo] = useState(false);
16
16
  const [isLoading, setIsLoading] = useState(false);
@@ -23,6 +23,7 @@ const WaterfallFlowItem = (props) => {
23
23
  const videoDom = useRef(null);
24
24
  const canvasRef = useRef(null);
25
25
  const [firstFrameSrc, setFirstFrameSrc] = useState('');
26
+ const rec = listItem;
26
27
  const src = useMemo(() => {
27
28
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
28
29
  if ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) {
@@ -112,7 +113,7 @@ const WaterfallFlowItem = (props) => {
112
113
  export default function WaterfallList(_a) {
113
114
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
114
115
  var { reportTagsView, showBanner } = _a, props = __rest(_a, ["reportTagsView", "showBanner"]);
115
- const { waterFallData, getRecommendVideos, hashTagSize, loadingImage, isOpenHashTag, cacheActiveIndex } = useSxpDataSource();
116
+ const { waterFallData, getRecommendVideos, hashTagSize, loadingImage, isOpenHashTag, cacheActiveIndex, bffFbReport } = useSxpDataSource();
116
117
  const { jumpToWeb } = useEventReport();
117
118
  const scrollParent = useRef(null);
118
119
  const [scrollTop, setScrollTop] = useState(0);
@@ -217,7 +218,8 @@ export default function WaterfallList(_a) {
217
218
  }).then((res) => {
218
219
  var _a, _b;
219
220
  setData(res);
220
- 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 : []);
221
+ 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 : [];
222
+ setList(list);
221
223
  setIsLoadingData(false);
222
224
  }));
223
225
  if (isOpenHashTag) {
@@ -296,7 +298,7 @@ export default function WaterfallList(_a) {
296
298
  React.createElement("div", { className: 'waterFallList-content' }, list === null || list === void 0 ? void 0 :
297
299
  list.map((item, ind) => {
298
300
  var _a;
299
- return (React.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)));
301
+ return (React.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)));
300
302
  }),
301
303
  React.createElement("div", { hidden: !((_l = data === null || data === void 0 ? void 0 : data.tag) === null || _l === void 0 ? void 0 : _l.link), style: {
302
304
  position: 'absolute',
package/es/core/components/SxpPageRender/WaterFall/index.js CHANGED
@@ -75,13 +75,17 @@ const WaterFall = (props) => {
75
75
  });
76
76
  }, [recData, bffEventReport, viewTime, isFromHashtag, cacheActiveIndex]);
77
77
  useEffect(() => {
78
+ var _a, _b;
78
79
  if (openHashtag) {
79
80
  setViewTime(new Date());
80
81
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
81
- eventName: 'PageView'
82
+ eventName: 'PageView',
83
+ 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,
84
+ rec: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec,
85
+ position: cacheActiveIndex
82
86
  });
83
87
  }
84
- }, [openHashtag, bffFbReport]);
88
+ }, [openHashtag, bffFbReport, waterFallData, cacheActiveIndex]);
85
89
  useEffect(() => {
86
90
  const initTime = () => {
87
91
  setViewTime(new Date());
package/es/core/components/SxpPageRender/index.js CHANGED
@@ -94,7 +94,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
94
94
  (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
95
95
  }, [data, ctaType, swiperRef]);
96
96
  const handleSessionCompleted = useCallback((fk) => {
97
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
97
+ 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;
98
98
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
99
99
  let fromKName = '';
100
100
  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))) {
@@ -129,7 +129,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
129
129
  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 : ''
130
130
  }
131
131
  });
132
- }, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
132
+ 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);
133
+ if (!popupDetailData) {
134
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
135
+ eventName: 'ExitFeed',
136
+ 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] : [],
137
+ rec: item,
138
+ position: activeIndex,
139
+ 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 : '',
140
+ view_time: new Date() - viewTime.current
141
+ });
142
+ }
143
+ }, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime, bffFbReport]);
133
144
  useEffect(() => {
134
145
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
135
146
  const visibleChange = () => {
@@ -429,48 +440,79 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
429
440
  }
430
441
  };
431
442
  const handleScrollEvent = (swiper) => {
432
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
443
+ 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;
433
444
  const item = data[swiper.previousIndex];
445
+ const activeItem = data[swiper.activeIndex];
434
446
  if (!item)
435
447
  return;
436
448
  let contentFormat = null;
437
- if ((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.url) {
449
+ let previousContentType = 'post';
450
+ let previousContentId = (_b = (_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.itemId) !== null && _b !== void 0 ? _b : '';
451
+ let previousProduct = (_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.bindProducts;
452
+ let previousContentsName = (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.title) !== null && _e !== void 0 ? _e : '';
453
+ let previousDirection = '';
454
+ let contentId = (_g = (_f = activeItem === null || activeItem === void 0 ? void 0 : activeItem.video) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '';
455
+ if ((_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.url) {
438
456
  contentFormat = 'video';
439
457
  }
440
- else if ((_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.imgUrls) === null || _c === void 0 ? void 0 : _c.length) {
458
+ else if ((_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.imgUrls) === null || _k === void 0 ? void 0 : _k.length) {
441
459
  contentFormat = 'image';
442
460
  }
461
+ else {
462
+ previousContentType = 'product';
463
+ 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 : '';
464
+ previousProduct = (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [];
465
+ previousContentsName = '';
466
+ }
467
+ 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)) {
468
+ 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 : '';
469
+ }
443
470
  if (swiper.previousIndex - swiper.activeIndex < 0) {
444
471
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
445
472
  eventInfo: {
446
473
  eventSubject: 'scrollDown',
447
474
  eventDescription: 'User scroll down',
448
- 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 : '',
449
- 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 : '',
475
+ 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 : '',
476
+ 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 : '',
450
477
  requestId: null,
451
- 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 : '',
478
+ 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 : '',
452
479
  contentFormat,
453
- position: ((_m = swiper.previousIndex) !== null && _m !== void 0 ? _m : 0) + ''
480
+ position: ((_1 = swiper.previousIndex) !== null && _1 !== void 0 ? _1 : 0) + ''
454
481
  }
455
482
  });
456
483
  handleViewImageStartEnd(item);
457
484
  handleSlideSkip(item, swiper.previousIndex);
485
+ previousDirection = 'up';
458
486
  }
459
487
  else {
460
488
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
461
489
  eventInfo: {
462
490
  eventSubject: 'scrollUp',
463
491
  eventDescription: 'User scroll up',
464
- 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 : '',
465
- productId: (_r = (_q = item.product) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
492
+ 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 : '',
493
+ productId: (_5 = (_4 = item.product) === null || _4 === void 0 ? void 0 : _4.itemId) !== null && _5 !== void 0 ? _5 : '',
466
494
  requestId: null,
467
- 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 : '',
495
+ 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 : '',
468
496
  contentFormat,
469
- position: ((_w = swiper.previousIndex) !== null && _w !== void 0 ? _w : 0) + ''
497
+ position: ((_10 = swiper.previousIndex) !== null && _10 !== void 0 ? _10 : 0) + ''
470
498
  }
471
499
  });
472
500
  handleViewImageStartEnd(item);
473
- }
501
+ previousDirection = 'down';
502
+ }
503
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
504
+ eventName: 'ContentSwipe',
505
+ product: previousProduct,
506
+ rec: activeItem,
507
+ position: swiper.activeIndex,
508
+ previous_content_id: previousContentId,
509
+ previous_content_type: previousContentType,
510
+ previous_contents_name: previousContentsName,
511
+ previosu_position: swiper.previousIndex,
512
+ swipe_direction: previousDirection,
513
+ view_time: new Date() - viewTime.current,
514
+ content_id: contentId
515
+ });
474
516
  handleReportProductView(item);
475
517
  viewTime.current = new Date();
476
518
  };
@@ -571,11 +613,15 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
571
613
  if (enableCapi) {
572
614
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
573
615
  eventName: 'ViewContent',
574
- product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProduct
616
+ product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProducts,
617
+ rec: item,
618
+ position: activeIndex
575
619
  });
576
620
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
577
621
  eventName: 'PageView',
578
- product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct
622
+ product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProducts,
623
+ rec: item,
624
+ position: activeIndex
579
625
  });
580
626
  }
581
627
  }
package/es/core/context/SxpDataSourceProvider.d.ts CHANGED
@@ -12,6 +12,7 @@ export interface IEventTimeType {
12
12
  time: Date;
13
13
  target: EventTarget;
14
14
  }
15
+ export type ICapiEventNameType = 'PageView' | 'ProductView' | 'ViewContent' | 'ClickCTA' | 'ContentSwipe' | 'Engagement' | 'ExitFeed';
15
16
  export interface ISxpDataSourceContext {
16
17
  rtcList: RecItemType[];
17
18
  setRtcList?: React.Dispatch<React.SetStateAction<RecItemType[]>>;
@@ -51,7 +52,7 @@ export interface ISxpDataSourceContext {
51
52
  sxpParameter?: PageData['sxp_parameter'];
52
53
  waterFallData?: IWaterFallDataType;
53
54
  setWaterFallData?: React.Dispatch<React.SetStateAction<IWaterFallDataType | undefined>>;
54
- ctaEvent?: (eventInfo: any, rec?: RecItemType, product?: ProductInfoType | VideoInfoType | null, number?: number) => void;
55
+ ctaEvent?: (eventInfo: any, rec?: RecItemType, product?: ProductInfoType | VideoInfoType | null, number?: number, ctaActionType?: 'open_internal_popup' | 'open_external_link', targetUrl?: string | null, contentType?: 'product' | 'post') => void;
55
56
  swiperRef?: any;
56
57
  openHashtag?: boolean;
57
58
  setOpenHashtag?: React.Dispatch<React.SetStateAction<boolean>>;
@@ -72,8 +73,12 @@ export interface ISxpDataSourceContext {
72
73
  videoRef?: any;
73
74
  setVideoRef?: React.Dispatch<React.SetStateAction<any>>;
74
75
  bffFbReport?: (body: {
75
- eventName: 'PageView' | 'ProductView' | 'ViewContent';
76
- product?: any;
76
+ eventName: ICapiEventNameType;
77
+ product?: ProductInfoType[];
78
+ contentType?: 'product' | 'post';
79
+ rec?: RecItemType;
80
+ position?: number;
81
+ [key: string]: any;
77
82
  }) => void;
78
83
  curTime?: any;
79
84
  h5EnterLink?: () => void;
package/es/core/context/SxpDataSourceProvider.js CHANGED
@@ -1,4 +1,4 @@
1
- import { __awaiter } from "tslib";
1
+ import { __awaiter, __rest } from "tslib";
2
2
  import React, { createContext, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
3
3
  import qs from 'qs';
4
4
  import { cloneDeep } from 'lodash';
@@ -7,7 +7,7 @@ import { storeAndLoadFeUserId, AGREE_POLICY } from '../utils/localStore';
7
7
  import { useIconLink } from '../components/SxpPageRender/useIconLink';
8
8
  import SXP_EVENT_BUS, { SXP_EVENT_TYPE } from '../utils/event';
9
9
  import Consent from '../components/Consent';
10
- import { getCookie, splitUrlParams } from '../utils/tool';
10
+ import { getCookie, getUrlParamByKey, splitUrlParams } from '../utils/tool';
11
11
  export const SxpDataSourceContext = createContext({
12
12
  rtcList: [],
13
13
  tagList: []
@@ -328,7 +328,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
328
328
  }
329
329
  });
330
330
  };
331
- }, [bffCollectEvent]);
331
+ }, []);
332
332
  useEffect(() => {
333
333
  const originalOpen = XMLHttpRequest.prototype.open;
334
334
  const originalSend = XMLHttpRequest.prototype.send;
@@ -532,19 +532,45 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
532
532
  playbookType,
533
533
  bffDataSource
534
534
  ]);
535
- const getEventParamsByJson = useCallback((json, product) => {
536
- var _a, _b, _c;
535
+ const getEventParamsByJson = useCallback((_a) => {
536
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
537
+ var { json, product = [], rec, contentType = 'post', position, eventName } = _a, props = __rest(_a, ["json", "product", "rec", "contentType", "position", "eventName"]);
537
538
  const jsonParams = cloneDeep(json);
538
539
  const urlParams = new URLSearchParams(window.location.search);
539
540
  const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
540
541
  const fix_par = {
541
- event_source_url: (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.href,
542
+ event_source_url: (_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.href,
542
543
  external_id: fakeUserId,
543
- client_user_agent: (_c = (_b = window === null || window === void 0 ? void 0 : window.navigator) === null || _b === void 0 ? void 0 : _b.userAgent) !== null && _c !== void 0 ? _c : '',
544
+ client_user_agent: (_d = (_c = window === null || window === void 0 ? void 0 : window.navigator) === null || _c === void 0 ? void 0 : _c.userAgent) !== null && _d !== void 0 ? _d : '',
544
545
  fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
545
546
  fbp: getCookie('_fbp') ? `${getCookie('_fbp')}` : '',
546
547
  time: Math.floor(Date.now() / 1000)
547
548
  };
549
+ let customData = Object.assign({ content_ids: [(_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.itemId, ...((_f = product === null || product === void 0 ? void 0 : product.map((item) => item === null || item === void 0 ? void 0 : item.itemId)) !== null && _f !== void 0 ? _f : [])], content_type: contentType, content_name: (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.title, total_posts: rtcList === null || rtcList === void 0 ? void 0 : rtcList.length, position, currency: (_h = product === null || product === void 0 ? void 0 : product[0]) === null || _h === void 0 ? void 0 : _h.currency, contents: (_j = product === null || product === void 0 ? void 0 : product.map((item) => ({
550
+ item_id: item === null || item === void 0 ? void 0 : item.itemId,
551
+ item_price: item === null || item === void 0 ? void 0 : item.price
552
+ }))) !== null && _j !== void 0 ? _j : [], image_urls: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) !== null && _l !== void 0 ? _l : [], video_urls: (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.url, headline: getUrlParamByKey('headline'), scene: getUrlParamByKey('scene'), campaign_id: getUrlParamByKey('campaign_id'), ad_id: getUrlParamByKey('ad_id'), utm_source: getUrlParamByKey('utm_source'), utm_medium: getUrlParamByKey('utm_medium'), utm_campaign: getUrlParamByKey('utm_campaign'), utm_content: getUrlParamByKey('utm_content') }, props);
553
+ if (!((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.url) && !((_q = (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.imgUrls) === null || _q === void 0 ? void 0 : _q.length) && (rec === null || rec === void 0 ? void 0 : rec.product) && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _r === void 0 ? void 0 : _r.length) > 0) {
554
+ const product = rec === null || rec === void 0 ? void 0 : rec.product;
555
+ const productCustomData = {
556
+ content_ids: [product === null || product === void 0 ? void 0 : product.itemId],
557
+ content_type: 'product',
558
+ content_name: '',
559
+ contents: [{
560
+ item_id: product === null || product === void 0 ? void 0 : product.itemId,
561
+ item_price: product === null || product === void 0 ? void 0 : product.price
562
+ }],
563
+ image_urls: (_s = product.homePage) !== null && _s !== void 0 ? _s : []
564
+ };
565
+ customData = Object.assign(Object.assign({}, customData), productCustomData);
566
+ }
567
+ if (eventName === 'ContentSwipe' || eventName === 'Engagement' || eventName === 'ExitFeed') {
568
+ const deleteKeys = ['content_ids', 'content_category', 'currency', 'contents', 'image_urls', 'video_urls', 'prompt'];
569
+ deleteKeys.forEach(key => {
570
+ if (customData === null || customData === void 0 ? void 0 : customData[key])
571
+ delete customData[key];
572
+ });
573
+ }
548
574
  const regex = /\{\{(.*?)\}\}/g;
549
575
  const getEventParams = (obj) => {
550
576
  if (!obj)
@@ -557,6 +583,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
557
583
  if (Object.prototype.hasOwnProperty.call(obj, key)) {
558
584
  const value = obj === null || obj === void 0 ? void 0 : obj[key];
559
585
  if (typeof value === 'object') {
586
+ if (key === 'custom_data') {
587
+ obj[key] = customData !== null && customData !== void 0 ? customData : {};
588
+ }
560
589
  getEventParams(value);
561
590
  }
562
591
  else if (typeof value === 'string') {
@@ -566,7 +595,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
566
595
  var _a;
567
596
  const prop = match.substring(2, match.length - 2);
568
597
  try {
569
- let replaceValue = new Function('fix_par', 'product', `return ${prop}`)(fix_par, product);
598
+ let replaceValue = new Function('fix_par', 'product', `return ${prop}`)(fix_par, product === null || product === void 0 ? void 0 : product[0]);
570
599
  if (replaceValue) {
571
600
  if ((prop === null || prop === void 0 ? void 0 : prop.indexOf('currency')) !== -1 &&
572
601
  (replaceValue === null || replaceValue === void 0 ? void 0 : replaceValue.indexOf('-')) !== -1 &&
@@ -591,15 +620,17 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
591
620
  }
592
621
  };
593
622
  getEventParams(jsonParams);
623
+ console.log('capi event params:', jsonParams);
594
624
  return jsonParams;
595
- }, [fakeUserId]);
596
- const bffFbReport = useCallback(({ eventName, product }) => {
597
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
625
+ }, [fakeUserId, globalConfig, rtcList]);
626
+ const bffFbReport = useCallback((_a) => {
627
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
628
+ var { eventName } = _a, props = __rest(_a, ["eventName"]);
598
629
  if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || getTargetingCookie()) {
599
630
  return;
600
631
  }
601
632
  let isPushState = false;
602
- const pixelEventParamsJson = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.pixel) === null || _a === void 0 ? void 0 : _a[eventName];
633
+ const pixelEventParamsJson = (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.pixel) === null || _b === void 0 ? void 0 : _b[eventName];
603
634
  if ((pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
604
635
  function updateQueryStringParameter(uri, key, value) {
605
636
  const re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
@@ -623,39 +654,39 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
623
654
  }
624
655
  }
625
656
  else {
626
- window === null || window === void 0 ? void 0 : window.fbq('track', pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name, getEventParamsByJson(pixelEventParamsJson, product));
657
+ window === null || window === void 0 ? void 0 : window.fbq('track', pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name, getEventParamsByJson(Object.assign({ json: pixelEventParamsJson, eventName }, props)));
627
658
  }
628
659
  }
629
660
  if (!isPushState) {
630
661
  if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.gtag) === 'function') {
631
662
  window === null || window === void 0 ? void 0 : window.gtag('event', 'page_view');
632
663
  }
633
- const tiktokPixelEventParamsJson = (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.tiktokPixel) === null || _b === void 0 ? void 0 : _b[eventName];
664
+ const tiktokPixelEventParamsJson = (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.tiktokPixel) === null || _c === void 0 ? void 0 : _c[eventName];
634
665
  if ((tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name) &&
635
666
  typeof (window === null || window === void 0 ? void 0 : window.ttq) === 'object' &&
636
- typeof ((_c = window === null || window === void 0 ? void 0 : window.ttq) === null || _c === void 0 ? void 0 : _c.track) === 'function') {
637
- (_d = window === null || window === void 0 ? void 0 : window.ttq) === null || _d === void 0 ? void 0 : _d.track(tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name, getEventParamsByJson(tiktokPixelEventParamsJson, product));
667
+ typeof ((_d = window === null || window === void 0 ? void 0 : window.ttq) === null || _d === void 0 ? void 0 : _d.track) === 'function') {
668
+ (_e = window === null || window === void 0 ? void 0 : window.ttq) === null || _e === void 0 ? void 0 : _e.track(tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name, getEventParamsByJson(Object.assign({ json: tiktokPixelEventParamsJson, eventName }, props)));
638
669
  }
639
670
  }
640
- const snapchatPixelEventParamsJson = (_e = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.snapchatPixel) === null || _e === void 0 ? void 0 : _e[eventName];
671
+ const snapchatPixelEventParamsJson = (_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.snapchatPixel) === null || _f === void 0 ? void 0 : _f[eventName];
641
672
  if ((snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.snaptr) === 'function') {
642
- window === null || window === void 0 ? void 0 : window.snaptr('track', snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name, getEventParamsByJson(snapchatPixelEventParamsJson, product));
673
+ window === null || window === void 0 ? void 0 : window.snaptr('track', snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name, getEventParamsByJson(Object.assign({ json: snapchatPixelEventParamsJson, eventName }, props)));
643
674
  }
644
- if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.Northbeam) === 'object' && typeof ((_f = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _f === void 0 ? void 0 : _f.trackPageView) === 'function') {
645
- (_g = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _g === void 0 ? void 0 : _g.trackPageView();
675
+ if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.Northbeam) === 'object' && typeof ((_g = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _g === void 0 ? void 0 : _g.trackPageView) === 'function') {
676
+ (_h = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _h === void 0 ? void 0 : _h.trackPageView();
646
677
  }
647
- const converApiEventParamsJson = (_h = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _h === void 0 ? void 0 : _h[eventName];
678
+ const converApiEventParamsJson = (_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _j === void 0 ? void 0 : _j[eventName];
648
679
  if (enabledMetaConversionApi && converApiEventParamsJson) {
649
- const body = getEventParamsByJson(converApiEventParamsJson, product);
680
+ const body = getEventParamsByJson(Object.assign({ json: converApiEventParamsJson, eventName }, props));
650
681
  const params = {};
651
682
  const queryString = location.search.slice(1);
652
- (_j = splitUrlParams(queryString)) === null || _j === void 0 ? void 0 : _j.forEach((val) => {
683
+ (_k = splitUrlParams(queryString)) === null || _k === void 0 ? void 0 : _k.forEach((val) => {
653
684
  const key = val.split('=')[0];
654
685
  const value = val.split('=')[1];
655
686
  params[key] = value;
656
687
  });
657
688
  const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
658
- bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/fb/${(_k = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _k === void 0 ? void 0 : _k['x-app-id']}/${eventName}${cl_source ? `/${decodeURIComponent(cl_source)}` : ''}`, {
689
+ bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/fb/${(_l = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _l === void 0 ? void 0 : _l['x-app-id']}/${eventName}${cl_source ? `/${decodeURIComponent(cl_source)}` : ''}`, {
659
690
  method: 'POST',
660
691
  body,
661
692
  type: 'beacon'
@@ -692,7 +723,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
692
723
  console.log('e', e);
693
724
  }
694
725
  }), [bffFetch, utmVal]);
695
- const ctaEvent = useCallback((eventInfo, rec, product, position) => {
726
+ const ctaEvent = useCallback((eventInfo, rec, product, position, ctaActionType, targetUrl, contentType) => {
696
727
  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;
697
728
  const cta = product === null || product === void 0 ? void 0 : product.bindCta;
698
729
  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);
@@ -715,32 +746,21 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
715
746
  });
716
747
  }, [bffEventReport, isFromHashtag]);
717
748
  const h5EnterLink = useCallback(() => {
718
- var _a, _b, _c;
719
- const queryString = location.search.slice(1);
720
- const params = {};
721
- (_a = splitUrlParams(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
722
- const key = val.split('=')[0];
723
- const value = val.split('=')[1];
724
- params[key] = value;
725
- });
726
- for (const key in params) {
727
- params[key] = params[key].replace(/%2B/g, '+');
728
- }
729
- const getVal = (key) => { var _a; return (_a = params[key]) !== null && _a !== void 0 ? _a : ''; };
749
+ var _a, _b;
730
750
  const time = new Date();
731
751
  curTime.current = time;
732
752
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
733
753
  eventInfo: {
734
754
  eventSubject: 'h5LinkEnterFeed',
735
755
  eventDescription: 'User enter h5 link',
736
- utmSource: getVal('utm_source'),
737
- utmMedium: getVal('utm_medium'),
738
- utmCampaign: getVal('utm_campaign'),
739
- utmId: getVal('utm_id'),
740
- utmContent: getVal('utm_content'),
756
+ utmSource: getUrlParamByKey('utm_source'),
757
+ utmMedium: getUrlParamByKey('utm_medium'),
758
+ utmCampaign: getUrlParamByKey('utm_campaign'),
759
+ utmId: getUrlParamByKey('utm_id'),
760
+ utmContent: getUrlParamByKey('utm_content'),
741
761
  enterTime: Math.floor(time / 1000) + '',
742
762
  requestId: null,
743
- enterUrl: (_c = (_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.href) !== null && _c !== void 0 ? _c : ''
763
+ enterUrl: (_b = (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.href) !== null && _b !== void 0 ? _b : ''
744
764
  },
745
765
  reportLayId: false
746
766
  });
package/es/core/utils/tool.d.ts CHANGED
@@ -15,4 +15,5 @@ declare function getScreenReader(): boolean;
15
15
  declare function splitUrlParams(urlParams: string): string[] | undefined;
16
16
  declare function deleteCookie(name: string, path?: string, domain?: string): void;
17
17
  declare function setCookie(name: string, value: string, days?: number, path?: string, domain?: string, secure?: boolean, sameSite?: string): void;
18
- export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams, deleteCookie, setCookie };
18
+ declare function getUrlParamByKey(key: string): any;
19
+ export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams, deleteCookie, setCookie, getUrlParamByKey };