pb-sxp-ui 1.15.22-alpha.5 → 1.15.22

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 (24) hide show
  1. package/dist/index.cjs +6629 -6577
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +46 -46
  4. package/dist/index.js +6629 -6577
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +4 -4
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +4 -4
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +6629 -6577
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +4 -4
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/components/SxpPageRender/index.d.ts +1 -0
  15. package/es/core/context/SxpDataSourceProvider.d.ts +1 -1
  16. package/es/core/context/SxpDataSourceProvider.js +93 -41
  17. package/es/materials/sxp/popup/CommodityDetail/index.js +2 -2
  18. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +1 -1
  19. package/lib/core/components/SxpPageRender/index.d.ts +1 -0
  20. package/lib/core/context/SxpDataSourceProvider.d.ts +1 -1
  21. package/lib/core/context/SxpDataSourceProvider.js +93 -41
  22. package/lib/materials/sxp/popup/CommodityDetail/index.js +2 -2
  23. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +1 -1
  24. package/package.json +1 -1
package/es/core/components/SxpPageRender/index.d.ts CHANGED
@@ -67,6 +67,7 @@ export interface ISxpPageRenderProps {
67
67
  y: number;
68
68
  };
69
69
  converApi?: any;
70
+ pixel?: any;
70
71
  consentPopup?: any;
71
72
  multiPosts?: any;
72
73
  playbook?: 'paid media' | 'organic menu';
package/es/core/context/SxpDataSourceProvider.d.ts CHANGED
@@ -72,7 +72,7 @@ export interface ISxpDataSourceContext {
72
72
  bffFbReport?: (body: {
73
73
  eventName: 'PageView' | 'ProductView' | 'ViewContent';
74
74
  product?: any;
75
- }) => Promise<any> | undefined | boolean;
75
+ }) => void;
76
76
  curTime?: any;
77
77
  h5EnterLink?: () => void;
78
78
  themeTag?: any;
package/es/core/context/SxpDataSourceProvider.js CHANGED
@@ -105,6 +105,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
105
105
  return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + storeAndLoadFeUserId();
106
106
  }, [bffDataSource]);
107
107
  const bffFetch = useCallback((path, options) => {
108
+ var _a, _b;
108
109
  if (!bffDataSource)
109
110
  return;
110
111
  const url = bffDataSource.url;
@@ -112,7 +113,33 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
112
113
  const queryString = qs.stringify(options.query);
113
114
  path = `${path}?${queryString}`;
114
115
  }
115
- if (options.type === 'beacon' && navigator.sendBeacon) {
116
+ let isTikTokChannel = false;
117
+ const params = {};
118
+ const queryString = location.search.slice(1);
119
+ (_a = splitUrlParams(queryString)) === null || _a === void 0 ? void 0 : _a.forEach((val) => {
120
+ const key = val.split('=')[0];
121
+ const value = val.split('=')[1];
122
+ params[key] = value;
123
+ });
124
+ const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
125
+ if (cl_source &&
126
+ ((_b = [
127
+ '40A-SPRK--DRESS_EYEWEAR-',
128
+ '41A-SPRK--MADRAGUE-',
129
+ '42A-SPRK--MOOD-',
130
+ '43A-SPRK--SUMMER-',
131
+ '44A-SPRK--DRESS_EYEWEAR-',
132
+ '45A-SPRK--MADRAGUE-',
133
+ '46A-SPRK--MOOD-',
134
+ '47A-SPRK--SUMMER-',
135
+ '48A-SPRK--DRESS_EYEWEAR-',
136
+ '49A-SPRK--MADRAGUE-',
137
+ '50A-SPRK--MOOD-',
138
+ '51A-SPRK--SUMMER-'
139
+ ]) === null || _b === void 0 ? void 0 : _b.includes(cl_source))) {
140
+ isTikTokChannel = true;
141
+ }
142
+ if (options.type === 'beacon' && navigator.sendBeacon && !isTikTokChannel) {
116
143
  return navigator.sendBeacon(`${url}/api/${path}`, new Blob([
117
144
  JSON.stringify({
118
145
  body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
@@ -122,11 +149,11 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
122
149
  }));
123
150
  }
124
151
  return window
125
- .fetch(`${url}/api/${path}`, {
126
- headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers),
127
- method: options.method,
128
- body: JSON.stringify(options.body)
129
- })
152
+ .fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers), method: options.method, body: isTikTokChannel
153
+ ? JSON.stringify({
154
+ body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
155
+ })
156
+ : JSON.stringify(options.body) }, (isTikTokChannel && { keepalive: true })))
130
157
  .then((res) => res.json())
131
158
  .catch((err) => Promise.reject(err));
132
159
  }, [bffDataSource, fakeUserId]);
@@ -291,23 +318,17 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
291
318
  playbookType,
292
319
  bffDataSource
293
320
  ]);
294
- const bffFbReport = useCallback(({ eventName, product }) => {
295
- var _a, _b, _c, _d, _e, _f, _g;
296
- if (!enableReportEvent ||
297
- !enabledMetaConversionApi ||
298
- (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) ||
299
- !((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _a === void 0 ? void 0 : _a[eventName])) {
300
- return;
301
- }
302
- const jsonParams = cloneDeep((_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _b === void 0 ? void 0 : _b[eventName]);
321
+ const getEventParamsByJson = useCallback((json, product) => {
322
+ var _a, _b, _c;
323
+ const jsonParams = cloneDeep(json);
303
324
  const urlParams = new URLSearchParams(window.location.search);
304
325
  const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
305
326
  const fix_par = {
306
- event_source_url: (_c = window === null || window === void 0 ? void 0 : window.location) === null || _c === void 0 ? void 0 : _c.href,
327
+ event_source_url: (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.href,
307
328
  external_id: fakeUserId,
308
- client_user_agent: (_e = (_d = window === null || window === void 0 ? void 0 : window.navigator) === null || _d === void 0 ? void 0 : _d.userAgent) !== null && _e !== void 0 ? _e : '',
329
+ 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 : '',
309
330
  fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
310
- fbp: getCookie('_fbp') ? `fb.2.${new Date().getTime()}.${getCookie('_fbp')}` : '',
331
+ fbp: getCookie('_fbp') ? `${getCookie('_fbp')}` : '',
311
332
  time: Math.floor(Date.now() / 1000)
312
333
  };
313
334
  const regex = /\{\{(.*?)\}\}/g;
@@ -319,7 +340,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
319
340
  }
320
341
  else {
321
342
  for (const key in obj) {
322
- if (obj.hasOwnProperty(key)) {
343
+ if (Object.prototype.hasOwnProperty.call(obj, key)) {
323
344
  const value = obj === null || obj === void 0 ? void 0 : obj[key];
324
345
  if (typeof value === 'object') {
325
346
  getEventParams(value);
@@ -356,28 +377,59 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
356
377
  }
357
378
  };
358
379
  getEventParams(jsonParams);
359
- const params = {};
360
- const queryString = location.search.slice(1);
361
- (_f = splitUrlParams(queryString)) === null || _f === void 0 ? void 0 : _f.map((val) => {
362
- const key = val.split('=')[0];
363
- const value = val.split('=')[1];
364
- params[key] = value;
365
- });
366
- const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
367
- return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/fb/${(_g = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _g === void 0 ? void 0 : _g['x-app-id']}/${eventName}${cl_source ? `/${decodeURIComponent(cl_source)}` : ''}`, {
368
- method: 'POST',
369
- body: jsonParams,
370
- type: 'beacon'
371
- });
372
- }, [
373
- bffFetch,
374
- enableReportEvent,
375
- enabledMetaConversionApi,
376
- globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
377
- globalConfig,
378
- fakeUserId,
379
- bffDataSource
380
- ]);
380
+ return jsonParams;
381
+ }, [fakeUserId]);
382
+ const bffFbReport = useCallback(({ eventName, product }) => {
383
+ var _a, _b, _c, _d;
384
+ if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
385
+ return;
386
+ }
387
+ const pixelEventParamsJson = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.pixel) === null || _a === void 0 ? void 0 : _a[eventName];
388
+ if ((pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
389
+ function updateQueryStringParameter(uri, key, value) {
390
+ const re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
391
+ const separator = uri.indexOf('?') !== -1 ? '&' : '?';
392
+ if (uri.match(re)) {
393
+ return uri.replace(re, '$1' + key + '=' + value + '$2');
394
+ }
395
+ else {
396
+ return uri + separator + key + '=' + value;
397
+ }
398
+ }
399
+ if (eventName === 'PageView' && (pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name) === 'PageView') {
400
+ const currentUrl = window.location.href;
401
+ const newUrl = updateQueryStringParameter(currentUrl, 'timestamp', Date.now());
402
+ history.pushState({ path: newUrl }, '', newUrl);
403
+ }
404
+ else {
405
+ const body = getEventParamsByJson(pixelEventParamsJson);
406
+ window === null || window === void 0 ? void 0 : window.fbq('track', pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name, body);
407
+ if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.gtag) === 'function') {
408
+ window === null || window === void 0 ? void 0 : window.gtag('event', 'page_view');
409
+ }
410
+ }
411
+ }
412
+ else if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.gtag) === 'function') {
413
+ window === null || window === void 0 ? void 0 : window.gtag('event', 'page_view');
414
+ }
415
+ const converApiEventParamsJson = (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _b === void 0 ? void 0 : _b[eventName];
416
+ if (enabledMetaConversionApi && converApiEventParamsJson) {
417
+ const body = getEventParamsByJson(converApiEventParamsJson, product);
418
+ const params = {};
419
+ const queryString = location.search.slice(1);
420
+ (_c = splitUrlParams(queryString)) === null || _c === void 0 ? void 0 : _c.forEach((val) => {
421
+ const key = val.split('=')[0];
422
+ const value = val.split('=')[1];
423
+ params[key] = value;
424
+ });
425
+ const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
426
+ bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/fb/${(_d = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _d === void 0 ? void 0 : _d['x-app-id']}/${eventName}${cl_source ? `/${decodeURIComponent(cl_source)}` : ''}`, {
427
+ method: 'POST',
428
+ body,
429
+ type: 'beacon'
430
+ });
431
+ }
432
+ }, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
381
433
  const bffMutateLike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
382
434
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
383
435
  return res === null || res === void 0 ? void 0 : res.success;
package/es/materials/sxp/popup/CommodityDetail/index.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { __rest } from "tslib";
2
2
  import { css } from '@emotion/css';
3
3
  import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
4
+ import CommodityGroup from '../../template/components/CommodityGroup';
4
5
  import { useSxpDataSource } from '../../../../core/hooks';
5
6
  import './index.less';
6
7
  import { A11y, Autoplay, Keyboard, Mousewheel, Navigation, Pagination } from 'swiper/modules';
@@ -10,7 +11,6 @@ import Modal from '../../../../core/components/SxpPageRender/Modal';
10
11
  import ExpandableText from '../../../../core/components/SxpPageRender/ExpandableText';
11
12
  import FormatImage from '../../../../core/components/SxpPageRender/FormatImage';
12
13
  import { getScreenReader, setFontForText } from '../../../../core/utils/tool';
13
- import CommodityGroup from '../../template/components/CommodityGroup';
14
14
  import { getPriceText } from '../../../../core/utils/materials';
15
15
  const CommodityDetail = (_a) => {
16
16
  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;
@@ -67,7 +67,7 @@ const CommodityDetail = (_a) => {
67
67
  };
68
68
  }, []);
69
69
  const priceText = getPriceText({
70
- product: product,
70
+ product,
71
71
  enableFormattedPrice: (_t = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _t === void 0 ? void 0 : _t.enableFormattedPrice,
72
72
  globalConfig,
73
73
  style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price
package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { __rest } from "tslib";
2
2
  import { css } from '@emotion/css';
3
3
  import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
4
+ import CommodityGroup from '../../template/components/CommodityGroup';
4
5
  import { useSxpDataSource } from '../../../../core/hooks';
5
6
  import './index.less';
6
7
  import { Autoplay, Pagination, Navigation, A11y, Mousewheel, Keyboard } from 'swiper/modules';
@@ -10,7 +11,6 @@ import ExpandableText from '../../../../core/components/SxpPageRender/Expandable
10
11
  import { useEventReport } from '../../../../core/hooks/useEventReport';
11
12
  import FormatImage from '../../../../core/components/SxpPageRender/FormatImage';
12
13
  import { getScreenReader, setFontForText } from '../../../../core/utils/tool';
13
- import CommodityGroup from '../../template/components/CommodityGroup';
14
14
  import { getPriceText } from '../../../../core/utils/materials';
15
15
  const CommodityDetailDiroNew = (_a) => {
16
16
  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;
package/lib/core/components/SxpPageRender/index.d.ts CHANGED
@@ -67,6 +67,7 @@ export interface ISxpPageRenderProps {
67
67
  y: number;
68
68
  };
69
69
  converApi?: any;
70
+ pixel?: any;
70
71
  consentPopup?: any;
71
72
  multiPosts?: any;
72
73
  playbook?: 'paid media' | 'organic menu';
package/lib/core/context/SxpDataSourceProvider.d.ts CHANGED
@@ -72,7 +72,7 @@ export interface ISxpDataSourceContext {
72
72
  bffFbReport?: (body: {
73
73
  eventName: 'PageView' | 'ProductView' | 'ViewContent';
74
74
  product?: any;
75
- }) => Promise<any> | undefined | boolean;
75
+ }) => void;
76
76
  curTime?: any;
77
77
  h5EnterLink?: () => void;
78
78
  themeTag?: any;
package/lib/core/context/SxpDataSourceProvider.js CHANGED
@@ -108,6 +108,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
108
108
  return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + (0, localStore_1.storeAndLoadFeUserId)();
109
109
  }, [bffDataSource]);
110
110
  const bffFetch = (0, react_1.useCallback)((path, options) => {
111
+ var _a, _b;
111
112
  if (!bffDataSource)
112
113
  return;
113
114
  const url = bffDataSource.url;
@@ -115,7 +116,33 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
115
116
  const queryString = qs_1.default.stringify(options.query);
116
117
  path = `${path}?${queryString}`;
117
118
  }
118
- if (options.type === 'beacon' && navigator.sendBeacon) {
119
+ let isTikTokChannel = false;
120
+ const params = {};
121
+ const queryString = location.search.slice(1);
122
+ (_a = (0, tool_1.splitUrlParams)(queryString)) === null || _a === void 0 ? void 0 : _a.forEach((val) => {
123
+ const key = val.split('=')[0];
124
+ const value = val.split('=')[1];
125
+ params[key] = value;
126
+ });
127
+ const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
128
+ if (cl_source &&
129
+ ((_b = [
130
+ '40A-SPRK--DRESS_EYEWEAR-',
131
+ '41A-SPRK--MADRAGUE-',
132
+ '42A-SPRK--MOOD-',
133
+ '43A-SPRK--SUMMER-',
134
+ '44A-SPRK--DRESS_EYEWEAR-',
135
+ '45A-SPRK--MADRAGUE-',
136
+ '46A-SPRK--MOOD-',
137
+ '47A-SPRK--SUMMER-',
138
+ '48A-SPRK--DRESS_EYEWEAR-',
139
+ '49A-SPRK--MADRAGUE-',
140
+ '50A-SPRK--MOOD-',
141
+ '51A-SPRK--SUMMER-'
142
+ ]) === null || _b === void 0 ? void 0 : _b.includes(cl_source))) {
143
+ isTikTokChannel = true;
144
+ }
145
+ if (options.type === 'beacon' && navigator.sendBeacon && !isTikTokChannel) {
119
146
  return navigator.sendBeacon(`${url}/api/${path}`, new Blob([
120
147
  JSON.stringify({
121
148
  body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
@@ -125,11 +152,11 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
125
152
  }));
126
153
  }
127
154
  return window
128
- .fetch(`${url}/api/${path}`, {
129
- headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers),
130
- method: options.method,
131
- body: JSON.stringify(options.body)
132
- })
155
+ .fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers), method: options.method, body: isTikTokChannel
156
+ ? JSON.stringify({
157
+ body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
158
+ })
159
+ : JSON.stringify(options.body) }, (isTikTokChannel && { keepalive: true })))
133
160
  .then((res) => res.json())
134
161
  .catch((err) => Promise.reject(err));
135
162
  }, [bffDataSource, fakeUserId]);
@@ -294,23 +321,17 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
294
321
  playbookType,
295
322
  bffDataSource
296
323
  ]);
297
- const bffFbReport = (0, react_1.useCallback)(({ eventName, product }) => {
298
- var _a, _b, _c, _d, _e, _f, _g;
299
- if (!enableReportEvent ||
300
- !enabledMetaConversionApi ||
301
- (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) ||
302
- !((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _a === void 0 ? void 0 : _a[eventName])) {
303
- return;
304
- }
305
- const jsonParams = (0, lodash_1.cloneDeep)((_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _b === void 0 ? void 0 : _b[eventName]);
324
+ const getEventParamsByJson = (0, react_1.useCallback)((json, product) => {
325
+ var _a, _b, _c;
326
+ const jsonParams = (0, lodash_1.cloneDeep)(json);
306
327
  const urlParams = new URLSearchParams(window.location.search);
307
328
  const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
308
329
  const fix_par = {
309
- event_source_url: (_c = window === null || window === void 0 ? void 0 : window.location) === null || _c === void 0 ? void 0 : _c.href,
330
+ event_source_url: (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.href,
310
331
  external_id: fakeUserId,
311
- client_user_agent: (_e = (_d = window === null || window === void 0 ? void 0 : window.navigator) === null || _d === void 0 ? void 0 : _d.userAgent) !== null && _e !== void 0 ? _e : '',
332
+ 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 : '',
312
333
  fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
313
- fbp: (0, tool_1.getCookie)('_fbp') ? `fb.2.${new Date().getTime()}.${(0, tool_1.getCookie)('_fbp')}` : '',
334
+ fbp: (0, tool_1.getCookie)('_fbp') ? `${(0, tool_1.getCookie)('_fbp')}` : '',
314
335
  time: Math.floor(Date.now() / 1000)
315
336
  };
316
337
  const regex = /\{\{(.*?)\}\}/g;
@@ -322,7 +343,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
322
343
  }
323
344
  else {
324
345
  for (const key in obj) {
325
- if (obj.hasOwnProperty(key)) {
346
+ if (Object.prototype.hasOwnProperty.call(obj, key)) {
326
347
  const value = obj === null || obj === void 0 ? void 0 : obj[key];
327
348
  if (typeof value === 'object') {
328
349
  getEventParams(value);
@@ -359,28 +380,59 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
359
380
  }
360
381
  };
361
382
  getEventParams(jsonParams);
362
- const params = {};
363
- const queryString = location.search.slice(1);
364
- (_f = (0, tool_1.splitUrlParams)(queryString)) === null || _f === void 0 ? void 0 : _f.map((val) => {
365
- const key = val.split('=')[0];
366
- const value = val.split('=')[1];
367
- params[key] = value;
368
- });
369
- const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
370
- return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/fb/${(_g = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _g === void 0 ? void 0 : _g['x-app-id']}/${eventName}${cl_source ? `/${decodeURIComponent(cl_source)}` : ''}`, {
371
- method: 'POST',
372
- body: jsonParams,
373
- type: 'beacon'
374
- });
375
- }, [
376
- bffFetch,
377
- enableReportEvent,
378
- enabledMetaConversionApi,
379
- globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
380
- globalConfig,
381
- fakeUserId,
382
- bffDataSource
383
- ]);
383
+ return jsonParams;
384
+ }, [fakeUserId]);
385
+ const bffFbReport = (0, react_1.useCallback)(({ eventName, product }) => {
386
+ var _a, _b, _c, _d;
387
+ if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
388
+ return;
389
+ }
390
+ const pixelEventParamsJson = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.pixel) === null || _a === void 0 ? void 0 : _a[eventName];
391
+ if ((pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
392
+ function updateQueryStringParameter(uri, key, value) {
393
+ const re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
394
+ const separator = uri.indexOf('?') !== -1 ? '&' : '?';
395
+ if (uri.match(re)) {
396
+ return uri.replace(re, '$1' + key + '=' + value + '$2');
397
+ }
398
+ else {
399
+ return uri + separator + key + '=' + value;
400
+ }
401
+ }
402
+ if (eventName === 'PageView' && (pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name) === 'PageView') {
403
+ const currentUrl = window.location.href;
404
+ const newUrl = updateQueryStringParameter(currentUrl, 'timestamp', Date.now());
405
+ history.pushState({ path: newUrl }, '', newUrl);
406
+ }
407
+ else {
408
+ const body = getEventParamsByJson(pixelEventParamsJson);
409
+ window === null || window === void 0 ? void 0 : window.fbq('track', pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name, body);
410
+ if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.gtag) === 'function') {
411
+ window === null || window === void 0 ? void 0 : window.gtag('event', 'page_view');
412
+ }
413
+ }
414
+ }
415
+ else if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.gtag) === 'function') {
416
+ window === null || window === void 0 ? void 0 : window.gtag('event', 'page_view');
417
+ }
418
+ const converApiEventParamsJson = (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _b === void 0 ? void 0 : _b[eventName];
419
+ if (enabledMetaConversionApi && converApiEventParamsJson) {
420
+ const body = getEventParamsByJson(converApiEventParamsJson, product);
421
+ const params = {};
422
+ const queryString = location.search.slice(1);
423
+ (_c = (0, tool_1.splitUrlParams)(queryString)) === null || _c === void 0 ? void 0 : _c.forEach((val) => {
424
+ const key = val.split('=')[0];
425
+ const value = val.split('=')[1];
426
+ params[key] = value;
427
+ });
428
+ const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
429
+ bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/fb/${(_d = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _d === void 0 ? void 0 : _d['x-app-id']}/${eventName}${cl_source ? `/${decodeURIComponent(cl_source)}` : ''}`, {
430
+ method: 'POST',
431
+ body,
432
+ type: 'beacon'
433
+ });
434
+ }
435
+ }, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
384
436
  const bffMutateLike = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
385
437
  const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
386
438
  return res === null || res === void 0 ? void 0 : res.success;
package/lib/materials/sxp/popup/CommodityDetail/index.js CHANGED
@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const css_1 = require("@emotion/css");
5
5
  const react_1 = tslib_1.__importStar(require("react"));
6
+ const CommodityGroup_1 = tslib_1.__importDefault(require("../../template/components/CommodityGroup"));
6
7
  const hooks_1 = require("../../../../core/hooks");
7
8
  require("./index.less");
8
9
  const modules_1 = require("swiper/modules");
@@ -12,7 +13,6 @@ const Modal_1 = tslib_1.__importDefault(require("../../../../core/components/Sxp
12
13
  const ExpandableText_1 = tslib_1.__importDefault(require("../../../../core/components/SxpPageRender/ExpandableText"));
13
14
  const FormatImage_1 = tslib_1.__importDefault(require("../../../../core/components/SxpPageRender/FormatImage"));
14
15
  const tool_1 = require("../../../../core/utils/tool");
15
- const CommodityGroup_1 = tslib_1.__importDefault(require("../../template/components/CommodityGroup"));
16
16
  const materials_1 = require("../../../../core/utils/materials");
17
17
  const CommodityDetail = (_a) => {
18
18
  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;
@@ -69,7 +69,7 @@ const CommodityDetail = (_a) => {
69
69
  };
70
70
  }, []);
71
71
  const priceText = (0, materials_1.getPriceText)({
72
- product: product,
72
+ product,
73
73
  enableFormattedPrice: (_t = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _t === void 0 ? void 0 : _t.enableFormattedPrice,
74
74
  globalConfig,
75
75
  style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price
package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js CHANGED
@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const css_1 = require("@emotion/css");
5
5
  const react_1 = tslib_1.__importStar(require("react"));
6
+ const CommodityGroup_1 = tslib_1.__importDefault(require("../../template/components/CommodityGroup"));
6
7
  const hooks_1 = require("../../../../core/hooks");
7
8
  require("./index.less");
8
9
  const modules_1 = require("swiper/modules");
@@ -12,7 +13,6 @@ const ExpandableText_1 = tslib_1.__importDefault(require("../../../../core/compo
12
13
  const useEventReport_1 = require("../../../../core/hooks/useEventReport");
13
14
  const FormatImage_1 = tslib_1.__importDefault(require("../../../../core/components/SxpPageRender/FormatImage"));
14
15
  const tool_1 = require("../../../../core/utils/tool");
15
- const CommodityGroup_1 = tslib_1.__importDefault(require("../../template/components/CommodityGroup"));
16
16
  const materials_1 = require("../../../../core/utils/materials");
17
17
  const CommodityDetailDiroNew = (_a) => {
18
18
  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;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pb-sxp-ui",
3
- "version": "1.15.22-alpha.5",
3
+ "version": "1.15.22",
4
4
  "description": "React enterprise-class UI components",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",