pb-sxp-ui 1.2.2 → 1.2.3

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 (28) hide show
  1. package/dist/index.cjs +24 -18
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +36 -1
  4. package/dist/index.js +24 -18
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +3 -3
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +3 -3
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +24 -18
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +3 -3
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/Pagebuilder/type.d.ts +1 -0
  15. package/es/core/components/SxpPageCore/index.js +1 -1
  16. package/es/core/context/SxpDataSourceProvider.d.ts +1 -0
  17. package/es/core/context/SxpDataSourceProvider.js +3 -3
  18. package/es/materials/sxp/cta/AniLink/index.js +1 -1
  19. package/es/materials/sxp/cta/AniLinkPopup/index.js +3 -3
  20. package/es/materials/sxp/popup/CommodityList/index.js +13 -7
  21. package/lib/core/Pagebuilder/type.d.ts +1 -0
  22. package/lib/core/components/SxpPageCore/index.js +1 -1
  23. package/lib/core/context/SxpDataSourceProvider.d.ts +1 -0
  24. package/lib/core/context/SxpDataSourceProvider.js +3 -3
  25. package/lib/materials/sxp/cta/AniLink/index.js +1 -1
  26. package/lib/materials/sxp/cta/AniLinkPopup/index.js +3 -3
  27. package/lib/materials/sxp/popup/CommodityList/index.js +13 -7
  28. package/package.json +1 -1
package/es/core/Pagebuilder/type.d.ts CHANGED
@@ -53,6 +53,7 @@ export interface UtmParameter {
53
53
  utm_source: string;
54
54
  utm_medium: string;
55
55
  utm_campaign: string;
56
+ channels?: string[];
56
57
  }
57
58
  interface PagebuilderProps {
58
59
  init: (e: initParams) => void;
package/es/core/components/SxpPageCore/index.js CHANGED
@@ -16,7 +16,7 @@ const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, l
16
16
  return searchParams;
17
17
  }, []);
18
18
  return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: data === null || data === void 0 ? void 0 : data.data, utmVal: utmVal },
19
- React.createElement(SxpDataSourceProvider, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, isShowTag: (_j = (_h = (_g = data === null || data === void 0 ? void 0 : data.data) === null || _g === void 0 ? void 0 : _g.sxpPageConf) === null || _h === void 0 ? void 0 : _h.globalConfig) === null || _j === void 0 ? void 0 : _j.isShowTag, globalConfig: (_l = (_k = data === null || data === void 0 ? void 0 : data.data) === null || _k === void 0 ? void 0 : _k.sxpPageConf) === null || _l === void 0 ? void 0 : _l.globalConfig, render: ({ rtcList, tagList }) => {
19
+ React.createElement(SxpDataSourceProvider, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, isShowTag: (_j = (_h = (_g = data === null || data === void 0 ? void 0 : data.data) === null || _g === void 0 ? void 0 : _g.sxpPageConf) === null || _h === void 0 ? void 0 : _h.globalConfig) === null || _j === void 0 ? void 0 : _j.isShowTag, globalConfig: (_l = (_k = data === null || data === void 0 ? void 0 : data.data) === null || _k === void 0 ? void 0 : _k.sxpPageConf) === null || _l === void 0 ? void 0 : _l.globalConfig, utmParameter: data === null || data === void 0 ? void 0 : data.utm_parameter, render: ({ rtcList, tagList }) => {
20
20
  var _a;
21
21
  return (React.createElement(React.Fragment, null,
22
22
  React.createElement(SxpPageRender, Object.assign({}, (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER, licenseUrl: licenseUrl })),
package/es/core/context/SxpDataSourceProvider.d.ts CHANGED
@@ -118,6 +118,7 @@ export interface SxpDataSourceProviderProps {
118
118
  isOpenConsent?: boolean;
119
119
  globalConfig?: ISxpPageRenderProps['globalConfig'];
120
120
  isEditor?: boolean;
121
+ utmParameter?: PageData['utm_parameter'];
121
122
  }
122
123
  export declare const DEFAULT_TAG = "FOR U";
123
124
  declare const _default: React.NamedExoticComponent<SxpDataSourceProviderProps>;
package/es/core/context/SxpDataSourceProvider.js CHANGED
@@ -15,7 +15,7 @@ var DataSourceType;
15
15
  DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
16
16
  })(DataSourceType || (DataSourceType = {}));
17
17
  export const DEFAULT_TAG = 'FOR U';
18
- const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig, isEditor = false }) => {
18
+ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig, isEditor = false, utmParameter }) => {
19
19
  var _a, _b, _c;
20
20
  const [rtcList, setRtcList] = useState([]);
21
21
  const [tagList, setTagList] = useState([]);
@@ -91,7 +91,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
91
91
  const val = (_h = (_g = (_f = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _f === void 0 ? void 0 : _f.filter((val) => {
92
92
  var _a, _b;
93
93
  const key = val.split('=')[0];
94
- return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
94
+ return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
95
95
  })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
96
96
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
97
97
  }
@@ -180,7 +180,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
180
180
  const val = (_o = (_m = (_l = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _l === void 0 ? void 0 : _l.filter((val) => {
181
181
  var _a, _b;
182
182
  const key = val.split('=')[0];
183
- return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
183
+ return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
184
184
  })) === null || _m === void 0 ? void 0 : _m.join('&')) !== null && _o !== void 0 ? _o : '';
185
185
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
186
186
  setTagList((_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []);
package/es/materials/sxp/cta/AniLink/index.js CHANGED
@@ -68,7 +68,7 @@ const AniLink = (_a) => {
68
68
  return null;
69
69
  return styles['animated-button'];
70
70
  }, [visible]);
71
- return (React.createElement("div", Object.assign({ ref: ref, style: Object.assign(Object.assign(Object.assign({}, style), ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: `${(_l = style === null || style === void 0 ? void 0 : style.height) !== null && _l !== void 0 ? _l : 0}px` }) }, props, { className: `${aniNamStyle} ${css(aniTimStyle)} one-line-ellipsis`, onClick: handleTo, dangerouslySetInnerHTML: {
71
+ return (React.createElement("div", Object.assign({ ref: ref, style: Object.assign(Object.assign(Object.assign({}, style), ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: `${(_l = style === null || style === void 0 ? void 0 : style.height) !== null && _l !== void 0 ? _l : 0}px` }) }, props, { className: `${aniNamStyle} ${css(aniTimStyle)} ${styles['one-line-ellipsis']}`, onClick: handleTo, dangerouslySetInnerHTML: {
72
72
  __html: setFontForText(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
73
73
  } })));
74
74
  };
package/es/materials/sxp/cta/AniLinkPopup/index.js CHANGED
@@ -63,7 +63,7 @@ const AniLinkPopup = (_a) => {
63
63
  const aniNamStyle = useMemo(() => {
64
64
  if (!visible)
65
65
  return null;
66
- return startAni ? styles['animated-fadeIn'] : styles['animated-fadeOut'];
66
+ return startAni ? styles['animated-fadeIn'] : null;
67
67
  }, [visible, startAni]);
68
68
  return (React.createElement(React.Fragment, null, isTel ? (React.createElement("div", { style: {
69
69
  height: '40px',
@@ -73,10 +73,10 @@ const AniLinkPopup = (_a) => {
73
73
  React.createElement("div", { onClick: onClose, className: styles['modal-icon-wrapper'], style: { padding: (_s = style === null || style === void 0 ? void 0 : style['padding']) !== null && _s !== void 0 ? _s : 0 } },
74
74
  React.createElement("img", { src: (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _t !== void 0 ? _t : closeIcon, alt: 'close', className: styles['modal-icon-wrapper-img'] })),
75
75
  React.createElement(Img, { src: src, rec: recData, item: (_y = (_w = (_v = (_u = recData === null || recData === void 0 ? void 0 : recData.video) === null || _u === void 0 ? void 0 : _u.bindProducts) === null || _v === void 0 ? void 0 : _v[0]) !== null && _w !== void 0 ? _w : (_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.bindProduct) !== null && _y !== void 0 ? _y : recData === null || recData === void 0 ? void 0 : recData.video, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img }),
76
- React.createElement("div", { hidden: !!recData && !(product === null || product === void 0 ? void 0 : product.title), className: styles['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
76
+ React.createElement("div", { hidden: !!recData && !(product === null || product === void 0 ? void 0 : product.title), className: styles['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
77
77
  __html: setFontForText((_z = product === null || product === void 0 ? void 0 : product.title) !== null && _z !== void 0 ? _z : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
78
78
  } }),
79
- React.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: ((_0 = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _0 === void 0 ? void 0 : _0.height) + 'px' }), dangerouslySetInnerHTML: {
79
+ React.createElement("div", { className: styles['one-line-ellipsis'], style: Object.assign(Object.assign({}, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: ((_0 = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _0 === void 0 ? void 0 : _0.height) + 'px' }), dangerouslySetInnerHTML: {
80
80
  __html: setFontForText(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
81
81
  } })))));
82
82
  };
package/es/materials/sxp/popup/CommodityList/index.js CHANGED
@@ -25,18 +25,24 @@ const CommodityList = (_a) => {
25
25
  }
26
26
  }, []);
27
27
  return (React.createElement("div", { className: css(Object.assign(Object.assign({}, style), { display: 'flex', flexDirection: 'column', gap: '10px', padding: '0 20px', marginTop: '50px' })) }, product === null || product === void 0 ? void 0 : product.map((item, index) => {
28
- var _a, _b, _c, _d, _e, _f, _g, _h;
28
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
29
29
  return (React.createElement(EventProvider, Object.assign({ key: index, isExternalLink: isExternalLink, rec: recData, index: index }, props, { className: css({
30
30
  display: 'flex'
31
31
  }) }),
32
32
  React.createElement(Img, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: commodityPicture }),
33
- React.createElement("div", { style: { flex: 1, display: 'flex', flexDirection: 'column', justifyContent: 'space-between' } },
33
+ React.createElement("div", { style: {
34
+ flex: 1,
35
+ width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.marginRight) !== null && _f !== void 0 ? _f : 0}px - ${(_g = style === null || style === void 0 ? void 0 : style.padding) !== null && _g !== void 0 ? _g : 0}px)`,
36
+ display: 'flex',
37
+ flexDirection: 'column',
38
+ justifyContent: 'space-between'
39
+ } },
34
40
  React.createElement("div", null,
35
- React.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.title), dangerouslySetInnerHTML: {
36
- __html: setFontForText((_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Pendant in Yellow Gold with Diamonds, Medium', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
41
+ React.createElement("div", { className: 'one-line-ellipsis', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.title), dangerouslySetInnerHTML: {
42
+ __html: setFontForText((_h = item === null || item === void 0 ? void 0 : item.title) !== null && _h !== void 0 ? _h : 'Pendant in Yellow Gold with Diamonds, Medium', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
37
43
  } }),
38
- React.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection, hidden: !!item && (!(item === null || item === void 0 ? void 0 : item.collection) || (item === null || item === void 0 ? void 0 : item.collection) === ''), dangerouslySetInnerHTML: {
39
- __html: setFontForText((_f = item === null || item === void 0 ? void 0 : item.collection) !== null && _f !== void 0 ? _f : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
44
+ React.createElement("div", { className: 'two-line-ellipsis', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection, hidden: !!item && (!(item === null || item === void 0 ? void 0 : item.collection) || (item === null || item === void 0 ? void 0 : item.collection) === ''), dangerouslySetInnerHTML: {
45
+ __html: setFontForText((_j = item === null || item === void 0 ? void 0 : item.collection) !== null && _j !== void 0 ? _j : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
40
46
  } })),
41
47
  React.createElement("div", { className: css({
42
48
  display: 'flex',
@@ -49,7 +55,7 @@ const CommodityList = (_a) => {
49
55
  __html: setFontForText(priceText(item), commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
50
56
  } }),
51
57
  React.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, buttonStyle), { padding: '0 15px', maxWidth: '100px' }), dangerouslySetInnerHTML: {
52
- __html: setFontForText((_h = (_g = item === null || item === void 0 ? void 0 : item.bindCta) === null || _g === void 0 ? void 0 : _g.enTitle) !== null && _h !== void 0 ? _h : 'Shop Now', buttonStyle)
58
+ __html: setFontForText((_l = (_k = item === null || item === void 0 ? void 0 : item.bindCta) === null || _k === void 0 ? void 0 : _k.enTitle) !== null && _l !== void 0 ? _l : 'Shop Now', buttonStyle)
53
59
  } })))));
54
60
  })));
55
61
  };
package/lib/core/Pagebuilder/type.d.ts CHANGED
@@ -53,6 +53,7 @@ export interface UtmParameter {
53
53
  utm_source: string;
54
54
  utm_medium: string;
55
55
  utm_campaign: string;
56
+ channels?: string[];
56
57
  }
57
58
  interface PagebuilderProps {
58
59
  init: (e: initParams) => void;
package/lib/core/components/SxpPageCore/index.js CHANGED
@@ -19,7 +19,7 @@ const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, l
19
19
  return searchParams;
20
20
  }, []);
21
21
  return (react_1.default.createElement(core_1.EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: data === null || data === void 0 ? void 0 : data.data, utmVal: utmVal },
22
- react_1.default.createElement(SxpDataSourceProvider_1.default, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, isShowTag: (_j = (_h = (_g = data === null || data === void 0 ? void 0 : data.data) === null || _g === void 0 ? void 0 : _g.sxpPageConf) === null || _h === void 0 ? void 0 : _h.globalConfig) === null || _j === void 0 ? void 0 : _j.isShowTag, globalConfig: (_l = (_k = data === null || data === void 0 ? void 0 : data.data) === null || _k === void 0 ? void 0 : _k.sxpPageConf) === null || _l === void 0 ? void 0 : _l.globalConfig, render: ({ rtcList, tagList }) => {
22
+ react_1.default.createElement(SxpDataSourceProvider_1.default, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, isShowTag: (_j = (_h = (_g = data === null || data === void 0 ? void 0 : data.data) === null || _g === void 0 ? void 0 : _g.sxpPageConf) === null || _h === void 0 ? void 0 : _h.globalConfig) === null || _j === void 0 ? void 0 : _j.isShowTag, globalConfig: (_l = (_k = data === null || data === void 0 ? void 0 : data.data) === null || _k === void 0 ? void 0 : _k.sxpPageConf) === null || _l === void 0 ? void 0 : _l.globalConfig, utmParameter: data === null || data === void 0 ? void 0 : data.utm_parameter, render: ({ rtcList, tagList }) => {
23
23
  var _a;
24
24
  return (react_1.default.createElement(react_1.default.Fragment, null,
25
25
  react_1.default.createElement(SxpPageRender_1.default, Object.assign({}, (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER, licenseUrl: licenseUrl })),
package/lib/core/context/SxpDataSourceProvider.d.ts CHANGED
@@ -118,6 +118,7 @@ export interface SxpDataSourceProviderProps {
118
118
  isOpenConsent?: boolean;
119
119
  globalConfig?: ISxpPageRenderProps['globalConfig'];
120
120
  isEditor?: boolean;
121
+ utmParameter?: PageData['utm_parameter'];
121
122
  }
122
123
  export declare const DEFAULT_TAG = "FOR U";
123
124
  declare const _default: React.NamedExoticComponent<SxpDataSourceProviderProps>;
package/lib/core/context/SxpDataSourceProvider.js CHANGED
@@ -18,7 +18,7 @@ var DataSourceType;
18
18
  DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
19
19
  })(DataSourceType || (DataSourceType = {}));
20
20
  exports.DEFAULT_TAG = 'FOR U';
21
- const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig, isEditor = false }) => {
21
+ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig, isEditor = false, utmParameter }) => {
22
22
  var _a, _b, _c;
23
23
  const [rtcList, setRtcList] = (0, react_1.useState)([]);
24
24
  const [tagList, setTagList] = (0, react_1.useState)([]);
@@ -94,7 +94,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
94
94
  const val = (_h = (_g = (_f = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _f === void 0 ? void 0 : _f.filter((val) => {
95
95
  var _a, _b;
96
96
  const key = val.split('=')[0];
97
- return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
97
+ return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
98
98
  })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
99
99
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
100
100
  }
@@ -183,7 +183,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
183
183
  const val = (_o = (_m = (_l = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _l === void 0 ? void 0 : _l.filter((val) => {
184
184
  var _a, _b;
185
185
  const key = val.split('=')[0];
186
- return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
186
+ return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
187
187
  })) === null || _m === void 0 ? void 0 : _m.join('&')) !== null && _o !== void 0 ? _o : '';
188
188
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
189
189
  setTagList((_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []);
package/lib/materials/sxp/cta/AniLink/index.js CHANGED
@@ -70,7 +70,7 @@ const AniLink = (_a) => {
70
70
  return null;
71
71
  return index_module_less_1.default['animated-button'];
72
72
  }, [visible]);
73
- return (react_1.default.createElement("div", Object.assign({ ref: ref, style: Object.assign(Object.assign(Object.assign({}, style), ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: `${(_l = style === null || style === void 0 ? void 0 : style.height) !== null && _l !== void 0 ? _l : 0}px` }) }, props, { className: `${aniNamStyle} ${(0, css_1.css)(aniTimStyle)} one-line-ellipsis`, onClick: handleTo, dangerouslySetInnerHTML: {
73
+ return (react_1.default.createElement("div", Object.assign({ ref: ref, style: Object.assign(Object.assign(Object.assign({}, style), ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: `${(_l = style === null || style === void 0 ? void 0 : style.height) !== null && _l !== void 0 ? _l : 0}px` }) }, props, { className: `${aniNamStyle} ${(0, css_1.css)(aniTimStyle)} ${index_module_less_1.default['one-line-ellipsis']}`, onClick: handleTo, dangerouslySetInnerHTML: {
74
74
  __html: (0, tool_1.setFontForText)(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
75
75
  } })));
76
76
  };
package/lib/materials/sxp/cta/AniLinkPopup/index.js CHANGED
@@ -65,7 +65,7 @@ const AniLinkPopup = (_a) => {
65
65
  const aniNamStyle = (0, react_1.useMemo)(() => {
66
66
  if (!visible)
67
67
  return null;
68
- return startAni ? index_module_less_1.default['animated-fadeIn'] : index_module_less_1.default['animated-fadeOut'];
68
+ return startAni ? index_module_less_1.default['animated-fadeIn'] : null;
69
69
  }, [visible, startAni]);
70
70
  return (react_1.default.createElement(react_1.default.Fragment, null, isTel ? (react_1.default.createElement("div", { style: {
71
71
  height: '40px',
@@ -75,10 +75,10 @@ const AniLinkPopup = (_a) => {
75
75
  react_1.default.createElement("div", { onClick: onClose, className: index_module_less_1.default['modal-icon-wrapper'], style: { padding: (_s = style === null || style === void 0 ? void 0 : style['padding']) !== null && _s !== void 0 ? _s : 0 } },
76
76
  react_1.default.createElement("img", { src: (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _t !== void 0 ? _t : closeIcon, alt: 'close', className: index_module_less_1.default['modal-icon-wrapper-img'] })),
77
77
  react_1.default.createElement(Img_1.default, { src: src, rec: recData, item: (_y = (_w = (_v = (_u = recData === null || recData === void 0 ? void 0 : recData.video) === null || _u === void 0 ? void 0 : _u.bindProducts) === null || _v === void 0 ? void 0 : _v[0]) !== null && _w !== void 0 ? _w : (_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.bindProduct) !== null && _y !== void 0 ? _y : recData === null || recData === void 0 ? void 0 : recData.video, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img }),
78
- react_1.default.createElement("div", { hidden: !!recData && !(product === null || product === void 0 ? void 0 : product.title), className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
78
+ react_1.default.createElement("div", { hidden: !!recData && !(product === null || product === void 0 ? void 0 : product.title), className: index_module_less_1.default['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
79
79
  __html: (0, tool_1.setFontForText)((_z = product === null || product === void 0 ? void 0 : product.title) !== null && _z !== void 0 ? _z : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
80
80
  } }),
81
- react_1.default.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: ((_0 = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _0 === void 0 ? void 0 : _0.height) + 'px' }), dangerouslySetInnerHTML: {
81
+ react_1.default.createElement("div", { className: index_module_less_1.default['one-line-ellipsis'], style: Object.assign(Object.assign({}, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: ((_0 = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _0 === void 0 ? void 0 : _0.height) + 'px' }), dangerouslySetInnerHTML: {
82
82
  __html: (0, tool_1.setFontForText)(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
83
83
  } })))));
84
84
  };
package/lib/materials/sxp/popup/CommodityList/index.js CHANGED
@@ -27,18 +27,24 @@ const CommodityList = (_a) => {
27
27
  }
28
28
  }, []);
29
29
  return (react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign(Object.assign({}, style), { display: 'flex', flexDirection: 'column', gap: '10px', padding: '0 20px', marginTop: '50px' })) }, product === null || product === void 0 ? void 0 : product.map((item, index) => {
30
- var _a, _b, _c, _d, _e, _f, _g, _h;
30
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
31
31
  return (react_1.default.createElement(EventProvider_1.default, Object.assign({ key: index, isExternalLink: isExternalLink, rec: recData, index: index }, props, { className: (0, css_1.css)({
32
32
  display: 'flex'
33
33
  }) }),
34
34
  react_1.default.createElement(Img_1.default, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: commodityPicture }),
35
- react_1.default.createElement("div", { style: { flex: 1, display: 'flex', flexDirection: 'column', justifyContent: 'space-between' } },
35
+ react_1.default.createElement("div", { style: {
36
+ flex: 1,
37
+ width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.marginRight) !== null && _f !== void 0 ? _f : 0}px - ${(_g = style === null || style === void 0 ? void 0 : style.padding) !== null && _g !== void 0 ? _g : 0}px)`,
38
+ display: 'flex',
39
+ flexDirection: 'column',
40
+ justifyContent: 'space-between'
41
+ } },
36
42
  react_1.default.createElement("div", null,
37
- react_1.default.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.title), dangerouslySetInnerHTML: {
38
- __html: (0, tool_1.setFontForText)((_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Pendant in Yellow Gold with Diamonds, Medium', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
43
+ react_1.default.createElement("div", { className: 'one-line-ellipsis', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.title), dangerouslySetInnerHTML: {
44
+ __html: (0, tool_1.setFontForText)((_h = item === null || item === void 0 ? void 0 : item.title) !== null && _h !== void 0 ? _h : 'Pendant in Yellow Gold with Diamonds, Medium', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
39
45
  } }),
40
- react_1.default.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection, hidden: !!item && (!(item === null || item === void 0 ? void 0 : item.collection) || (item === null || item === void 0 ? void 0 : item.collection) === ''), dangerouslySetInnerHTML: {
41
- __html: (0, tool_1.setFontForText)((_f = item === null || item === void 0 ? void 0 : item.collection) !== null && _f !== void 0 ? _f : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
46
+ react_1.default.createElement("div", { className: 'two-line-ellipsis', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection, hidden: !!item && (!(item === null || item === void 0 ? void 0 : item.collection) || (item === null || item === void 0 ? void 0 : item.collection) === ''), dangerouslySetInnerHTML: {
47
+ __html: (0, tool_1.setFontForText)((_j = item === null || item === void 0 ? void 0 : item.collection) !== null && _j !== void 0 ? _j : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
42
48
  } })),
43
49
  react_1.default.createElement("div", { className: (0, css_1.css)({
44
50
  display: 'flex',
@@ -51,7 +57,7 @@ const CommodityList = (_a) => {
51
57
  __html: (0, tool_1.setFontForText)(priceText(item), commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
52
58
  } }),
53
59
  react_1.default.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, buttonStyle), { padding: '0 15px', maxWidth: '100px' }), dangerouslySetInnerHTML: {
54
- __html: (0, tool_1.setFontForText)((_h = (_g = item === null || item === void 0 ? void 0 : item.bindCta) === null || _g === void 0 ? void 0 : _g.enTitle) !== null && _h !== void 0 ? _h : 'Shop Now', buttonStyle)
60
+ __html: (0, tool_1.setFontForText)((_l = (_k = item === null || item === void 0 ? void 0 : item.bindCta) === null || _k === void 0 ? void 0 : _k.enTitle) !== null && _l !== void 0 ? _l : 'Shop Now', buttonStyle)
55
61
  } })))));
56
62
  })));
57
63
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pb-sxp-ui",
3
- "version": "1.2.2",
3
+ "version": "1.2.3",
4
4
  "description": "React enterprise-class UI components",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",