pb-sxp-ui 1.2.0 → 1.2.1

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 (21) hide show
  1. package/dist/index.cjs +16 -15
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +16 -15
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +3 -3
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +3 -3
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +16 -15
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +3 -3
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/context/SxpDataSourceProvider.js +2 -3
  14. package/es/materials/sxp/cta/AniLink/index.js +2 -1
  15. package/es/materials/sxp/cta/AniLinkPopup/index.js +3 -2
  16. package/es/materials/sxp/popup/CommodityList/index.js +10 -10
  17. package/lib/core/context/SxpDataSourceProvider.js +2 -3
  18. package/lib/materials/sxp/cta/AniLink/index.js +2 -1
  19. package/lib/materials/sxp/cta/AniLinkPopup/index.js +3 -2
  20. package/lib/materials/sxp/popup/CommodityList/index.js +9 -9
  21. package/package.json +1 -1
package/es/core/context/SxpDataSourceProvider.js CHANGED
@@ -14,7 +14,6 @@ var DataSourceType;
14
14
  (function (DataSourceType) {
15
15
  DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
16
16
  })(DataSourceType || (DataSourceType = {}));
17
- const UTM_KEYS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_id', 'utm_content', 'cl_source'];
18
17
  export const DEFAULT_TAG = 'FOR U';
19
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 }) => {
20
19
  var _a, _b, _c;
@@ -92,7 +91,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
92
91
  const val = (_h = (_g = (_f = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _f === void 0 ? void 0 : _f.filter((val) => {
93
92
  var _a, _b;
94
93
  const key = val.split('=')[0];
95
- return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : UTM_KEYS)) === null || _b === void 0 ? void 0 : _b.includes(key);
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);
96
95
  })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
97
96
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
98
97
  }
@@ -181,7 +180,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
181
180
  const val = (_o = (_m = (_l = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _l === void 0 ? void 0 : _l.filter((val) => {
182
181
  var _a, _b;
183
182
  const key = val.split('=')[0];
184
- return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : UTM_KEYS)) === null || _b === void 0 ? void 0 : _b.includes(key);
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);
185
184
  })) === null || _m === void 0 ? void 0 : _m.join('&')) !== null && _o !== void 0 ? _o : '';
186
185
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
187
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
@@ -9,7 +9,7 @@ import useOnScreen from '../../../../core/hooks/useOnScreen';
9
9
  const AniLink = (_a) => {
10
10
  var _b, _c, _d, _e, _f, _g, _h, _j, _k;
11
11
  var { style, recData, ctaTempStyles, index, event, onClick, isExternalLink = false } = _a, props = __rest(_a, ["style", "recData", "ctaTempStyles", "index", "event", "onClick", "isExternalLink"]);
12
- const { ctaEvent } = useSxpDataSource();
12
+ const { ctaEvent, setPopupDetailData } = useSxpDataSource();
13
13
  const { jumpToWeb } = useEventReport();
14
14
  const ref = useRef(null);
15
15
  const isOnScreen = useOnScreen(ref);
@@ -22,6 +22,7 @@ const AniLink = (_a) => {
22
22
  eventSubject: 'clickCta',
23
23
  eventDescription: 'User clicked the CTA'
24
24
  }, recData, item, index);
25
+ setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { index }));
25
26
  if (isExternalLink) {
26
27
  jumpToWeb(recData, product, cta, index);
27
28
  }
package/es/materials/sxp/cta/AniLinkPopup/index.js CHANGED
@@ -10,7 +10,7 @@ const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAAB
10
10
  const AniLinkPopup = (_a) => {
11
11
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
12
12
  var { style, recData, ctaTempStyles, index, event, bottom_image, translateY, isTel, onClick, isExternalLink = false } = _a, props = __rest(_a, ["style", "recData", "ctaTempStyles", "index", "event", "bottom_image", "translateY", "isTel", "onClick", "isExternalLink"]);
13
- const { sxpParameter, globalConfig, ctaEvent } = useSxpDataSource();
13
+ const { sxpParameter, globalConfig, ctaEvent, setPopupDetailData } = useSxpDataSource();
14
14
  const { jumpToWeb } = useEventReport();
15
15
  const [visible, setVisible] = useState(true);
16
16
  const cta = ((_d = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.bindCta) || ((_f = (_e = recData === null || recData === void 0 ? void 0 : recData.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.bindCta) || ((_g = recData === null || recData === void 0 ? void 0 : recData.video) === null || _g === void 0 ? void 0 : _g.bindCta);
@@ -22,6 +22,7 @@ const AniLinkPopup = (_a) => {
22
22
  eventSubject: 'clickCta',
23
23
  eventDescription: 'User clicked the CTA'
24
24
  }, recData, item, index);
25
+ setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { index }));
25
26
  if (isExternalLink) {
26
27
  jumpToWeb(recData, product, cta, index);
27
28
  }
@@ -51,7 +52,7 @@ const AniLinkPopup = (_a) => {
51
52
  height: '40px',
52
53
  lineHeight: '40px',
53
54
  paddingLeft: '6px'
54
- } }, "Cta Title")) : (React.createElement("div", Object.assign({ style: Object.assign(Object.assign({}, style), { position: 'fixed', right: 0, bottom: 0, zIndex: 1000, display: visible ? 'block' : 'none' }) }, props, { className: `${styles['animated-button']} ${css(aniStyle)}`, onClick: handleTo }),
55
+ } }, "Cta Title")) : (React.createElement("div", Object.assign({ style: Object.assign(Object.assign({}, style), { position: 'absolute', right: 0, bottom: 0, zIndex: 1000, display: visible ? 'block' : 'none' }) }, props, { className: `${styles['animated-button']} ${css(aniStyle)}`, onClick: handleTo }),
55
56
  React.createElement("div", { onClick: onClose, className: styles['modal-icon-wrapper'], style: { padding: (_r = style === null || style === void 0 ? void 0 : style['padding']) !== null && _r !== void 0 ? _r : 0 } },
56
57
  React.createElement("img", { src: (_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _s !== void 0 ? _s : closeIcon, alt: 'close', className: styles['modal-icon-wrapper-img'] })),
57
58
  React.createElement(Img, { src: src, rec: recData, item: (_x = (_v = (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.bindProducts) === null || _u === void 0 ? void 0 : _u[0]) !== null && _v !== void 0 ? _v : (_w = recData === null || recData === void 0 ? void 0 : recData.video) === null || _w === void 0 ? void 0 : _w.bindProduct) !== null && _x !== void 0 ? _x : recData === null || recData === void 0 ? void 0 : recData.video, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img }),
package/es/materials/sxp/popup/CommodityList/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { __rest } from "tslib";
2
2
  import { css } from '@emotion/css';
3
- import React, { memo, useCallback, useRef } from 'react';
3
+ import React, { memo, useCallback } from 'react';
4
4
  import { useSxpDataSource } from '../../../../core/hooks';
5
5
  import './index.less';
6
6
  import { setFontForText } from '../../../../core/utils/tool';
@@ -11,7 +11,6 @@ const CommodityList = (_a) => {
11
11
  var { style, isDefault, rec, viewTime, isPost, bottom_image, commodityStyles, buttonStyle, index, translateY = 0, commodityPicture, isExternalLink } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "commodityStyles", "buttonStyle", "index", "translateY", "commodityPicture", "isExternalLink"]);
12
12
  const { sxpParameter } = useSxpDataSource();
13
13
  const { popupDetailData, bffEventReport, isPreview, swiperRef, bffFbReport } = useSxpDataSource();
14
- const curTimeRef = useRef(null);
15
14
  const recData = isPost ? rec : popupDetailData;
16
15
  const product = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) !== null && _c !== void 0 ? _c : [null, null, null, null];
17
16
  const priceText = useCallback((product) => {
@@ -31,13 +30,14 @@ const CommodityList = (_a) => {
31
30
  display: 'flex'
32
31
  }) }),
33
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 }),
34
- 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)
37
- } }),
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)
40
- } }),
33
+ React.createElement("div", { style: { flex: 1, display: 'flex', flexDirection: 'column', justifyContent: 'space-between' } },
34
+ 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)
37
+ } }),
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)
40
+ } })),
41
41
  React.createElement("div", { className: css({
42
42
  display: 'flex',
43
43
  alignItems: 'flex-end',
@@ -48,7 +48,7 @@ const CommodityList = (_a) => {
48
48
  React.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.price), dangerouslySetInnerHTML: {
49
49
  __html: setFontForText(priceText(item), commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
50
50
  } }),
51
- React.createElement("div", { style: Object.assign(Object.assign({}, buttonStyle), { padding: '0 15px' }), dangerouslySetInnerHTML: {
51
+ React.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, buttonStyle), { padding: '0 15px', maxWidth: '100px' }), dangerouslySetInnerHTML: {
52
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)
53
53
  } })))));
54
54
  })));
package/lib/core/context/SxpDataSourceProvider.js CHANGED
@@ -17,7 +17,6 @@ var DataSourceType;
17
17
  (function (DataSourceType) {
18
18
  DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
19
19
  })(DataSourceType || (DataSourceType = {}));
20
- const UTM_KEYS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_id', 'utm_content', 'cl_source'];
21
20
  exports.DEFAULT_TAG = 'FOR U';
22
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 }) => {
23
22
  var _a, _b, _c;
@@ -95,7 +94,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
95
94
  const val = (_h = (_g = (_f = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _f === void 0 ? void 0 : _f.filter((val) => {
96
95
  var _a, _b;
97
96
  const key = val.split('=')[0];
98
- return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : UTM_KEYS)) === null || _b === void 0 ? void 0 : _b.includes(key);
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);
99
98
  })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
100
99
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
101
100
  }
@@ -184,7 +183,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
184
183
  const val = (_o = (_m = (_l = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _l === void 0 ? void 0 : _l.filter((val) => {
185
184
  var _a, _b;
186
185
  const key = val.split('=')[0];
187
- return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : UTM_KEYS)) === null || _b === void 0 ? void 0 : _b.includes(key);
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);
188
187
  })) === null || _m === void 0 ? void 0 : _m.join('&')) !== null && _o !== void 0 ? _o : '';
189
188
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
190
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
@@ -11,7 +11,7 @@ const useOnScreen_1 = tslib_1.__importDefault(require("../../../../core/hooks/us
11
11
  const AniLink = (_a) => {
12
12
  var _b, _c, _d, _e, _f, _g, _h, _j, _k;
13
13
  var { style, recData, ctaTempStyles, index, event, onClick, isExternalLink = false } = _a, props = tslib_1.__rest(_a, ["style", "recData", "ctaTempStyles", "index", "event", "onClick", "isExternalLink"]);
14
- const { ctaEvent } = (0, hooks_1.useSxpDataSource)();
14
+ const { ctaEvent, setPopupDetailData } = (0, hooks_1.useSxpDataSource)();
15
15
  const { jumpToWeb } = (0, useEventReport_1.useEventReport)();
16
16
  const ref = (0, react_1.useRef)(null);
17
17
  const isOnScreen = (0, useOnScreen_1.default)(ref);
@@ -24,6 +24,7 @@ const AniLink = (_a) => {
24
24
  eventSubject: 'clickCta',
25
25
  eventDescription: 'User clicked the CTA'
26
26
  }, recData, item, index);
27
+ setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { index }));
27
28
  if (isExternalLink) {
28
29
  jumpToWeb(recData, product, cta, index);
29
30
  }
package/lib/materials/sxp/cta/AniLinkPopup/index.js CHANGED
@@ -12,7 +12,7 @@ const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAAB
12
12
  const AniLinkPopup = (_a) => {
13
13
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
14
14
  var { style, recData, ctaTempStyles, index, event, bottom_image, translateY, isTel, onClick, isExternalLink = false } = _a, props = tslib_1.__rest(_a, ["style", "recData", "ctaTempStyles", "index", "event", "bottom_image", "translateY", "isTel", "onClick", "isExternalLink"]);
15
- const { sxpParameter, globalConfig, ctaEvent } = (0, hooks_1.useSxpDataSource)();
15
+ const { sxpParameter, globalConfig, ctaEvent, setPopupDetailData } = (0, hooks_1.useSxpDataSource)();
16
16
  const { jumpToWeb } = (0, useEventReport_1.useEventReport)();
17
17
  const [visible, setVisible] = (0, react_1.useState)(true);
18
18
  const cta = ((_d = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.bindCta) || ((_f = (_e = recData === null || recData === void 0 ? void 0 : recData.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.bindCta) || ((_g = recData === null || recData === void 0 ? void 0 : recData.video) === null || _g === void 0 ? void 0 : _g.bindCta);
@@ -24,6 +24,7 @@ const AniLinkPopup = (_a) => {
24
24
  eventSubject: 'clickCta',
25
25
  eventDescription: 'User clicked the CTA'
26
26
  }, recData, item, index);
27
+ setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { index }));
27
28
  if (isExternalLink) {
28
29
  jumpToWeb(recData, product, cta, index);
29
30
  }
@@ -53,7 +54,7 @@ const AniLinkPopup = (_a) => {
53
54
  height: '40px',
54
55
  lineHeight: '40px',
55
56
  paddingLeft: '6px'
56
- } }, "Cta Title")) : (react_1.default.createElement("div", Object.assign({ style: Object.assign(Object.assign({}, style), { position: 'fixed', right: 0, bottom: 0, zIndex: 1000, display: visible ? 'block' : 'none' }) }, props, { className: `${index_module_less_1.default['animated-button']} ${(0, css_1.css)(aniStyle)}`, onClick: handleTo }),
57
+ } }, "Cta Title")) : (react_1.default.createElement("div", Object.assign({ style: Object.assign(Object.assign({}, style), { position: 'absolute', right: 0, bottom: 0, zIndex: 1000, display: visible ? 'block' : 'none' }) }, props, { className: `${index_module_less_1.default['animated-button']} ${(0, css_1.css)(aniStyle)}`, onClick: handleTo }),
57
58
  react_1.default.createElement("div", { onClick: onClose, className: index_module_less_1.default['modal-icon-wrapper'], style: { padding: (_r = style === null || style === void 0 ? void 0 : style['padding']) !== null && _r !== void 0 ? _r : 0 } },
58
59
  react_1.default.createElement("img", { src: (_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _s !== void 0 ? _s : closeIcon, alt: 'close', className: index_module_less_1.default['modal-icon-wrapper-img'] })),
59
60
  react_1.default.createElement(Img_1.default, { src: src, rec: recData, item: (_x = (_v = (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.bindProducts) === null || _u === void 0 ? void 0 : _u[0]) !== null && _v !== void 0 ? _v : (_w = recData === null || recData === void 0 ? void 0 : recData.video) === null || _w === void 0 ? void 0 : _w.bindProduct) !== null && _x !== void 0 ? _x : recData === null || recData === void 0 ? void 0 : recData.video, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img }),
package/lib/materials/sxp/popup/CommodityList/index.js CHANGED
@@ -13,7 +13,6 @@ const CommodityList = (_a) => {
13
13
  var { style, isDefault, rec, viewTime, isPost, bottom_image, commodityStyles, buttonStyle, index, translateY = 0, commodityPicture, isExternalLink } = _a, props = tslib_1.__rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "commodityStyles", "buttonStyle", "index", "translateY", "commodityPicture", "isExternalLink"]);
14
14
  const { sxpParameter } = (0, hooks_1.useSxpDataSource)();
15
15
  const { popupDetailData, bffEventReport, isPreview, swiperRef, bffFbReport } = (0, hooks_1.useSxpDataSource)();
16
- const curTimeRef = (0, react_1.useRef)(null);
17
16
  const recData = isPost ? rec : popupDetailData;
18
17
  const product = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) !== null && _c !== void 0 ? _c : [null, null, null, null];
19
18
  const priceText = (0, react_1.useCallback)((product) => {
@@ -33,13 +32,14 @@ const CommodityList = (_a) => {
33
32
  display: 'flex'
34
33
  }) }),
35
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 }),
36
- 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)
39
- } }),
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)
42
- } }),
35
+ react_1.default.createElement("div", { style: { flex: 1, display: 'flex', flexDirection: 'column', justifyContent: 'space-between' } },
36
+ 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)
39
+ } }),
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)
42
+ } })),
43
43
  react_1.default.createElement("div", { className: (0, css_1.css)({
44
44
  display: 'flex',
45
45
  alignItems: 'flex-end',
@@ -50,7 +50,7 @@ const CommodityList = (_a) => {
50
50
  react_1.default.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.price), dangerouslySetInnerHTML: {
51
51
  __html: (0, tool_1.setFontForText)(priceText(item), commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
52
52
  } }),
53
- react_1.default.createElement("div", { style: Object.assign(Object.assign({}, buttonStyle), { padding: '0 15px' }), dangerouslySetInnerHTML: {
53
+ react_1.default.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, buttonStyle), { padding: '0 15px', maxWidth: '100px' }), dangerouslySetInnerHTML: {
54
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)
55
55
  } })))));
56
56
  })));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pb-sxp-ui",
3
- "version": "1.2.0",
3
+ "version": "1.2.1",
4
4
  "description": "React enterprise-class UI components",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",