pb-sxp-ui 1.2.2 → 1.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/dist/index.cjs +79 -49
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +36 -1
  4. package/dist/index.js +79 -49
  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 +79 -49
  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/components/SxpPageRender/Hashtag/index.js +0 -1
  17. package/es/core/components/SxpPageRender/Modal/index.js +16 -8
  18. package/es/core/components/SxpPageRender/Popup/index.js +1 -1
  19. package/es/core/components/SxpPageRender/RenderCard.js +15 -2
  20. package/es/core/components/SxpPageRender/index.js +1 -1
  21. package/es/core/context/SxpDataSourceProvider.d.ts +1 -0
  22. package/es/core/context/SxpDataSourceProvider.js +3 -3
  23. package/es/materials/sxp/cta/AniLink/index.js +4 -1
  24. package/es/materials/sxp/cta/AniLinkPopup/index.js +9 -6
  25. package/es/materials/sxp/cta/AniLinkPopup/settingRender.js +1 -1
  26. package/es/materials/sxp/popup/CommodityList/index.js +13 -7
  27. package/lib/core/Pagebuilder/type.d.ts +1 -0
  28. package/lib/core/components/SxpPageCore/index.js +1 -1
  29. package/lib/core/components/SxpPageRender/Hashtag/index.js +0 -1
  30. package/lib/core/components/SxpPageRender/Modal/index.js +16 -8
  31. package/lib/core/components/SxpPageRender/Popup/index.js +1 -1
  32. package/lib/core/components/SxpPageRender/RenderCard.js +15 -2
  33. package/lib/core/components/SxpPageRender/index.js +1 -1
  34. package/lib/core/context/SxpDataSourceProvider.d.ts +1 -0
  35. package/lib/core/context/SxpDataSourceProvider.js +3 -3
  36. package/lib/materials/sxp/cta/AniLink/index.js +4 -1
  37. package/lib/materials/sxp/cta/AniLinkPopup/index.js +9 -6
  38. package/lib/materials/sxp/cta/AniLinkPopup/settingRender.js +1 -1
  39. package/lib/materials/sxp/popup/CommodityList/index.js +13 -7
  40. 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/components/SxpPageRender/Hashtag/index.js CHANGED
@@ -36,7 +36,6 @@ const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle }) => {
36
36
  }
37
37
  return (React.createElement("span", { style: { textDecoration: 'underline', cursor: 'pointer', color: '#fff' }, onClick: () => setIsShowMore(!isShowMore) }, isShowMore ? 'show less' : 'show more'));
38
38
  }, [isShowMore, tags]);
39
- console.log(hashTagStyle, '111');
40
39
  return (React.createElement("div", { className: 'clc-sxp-bottom-hashtag', style: { marginTop: `${(_a = hashTagStyle === null || hashTagStyle === void 0 ? void 0 : hashTagStyle.marginTop) !== null && _a !== void 0 ? _a : 16}px` } },
41
40
  React.createElement(Scroll, null, tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (React.createElement(SwiperSlide, { key: index, hidden: !isShowMore ? index >= 6 : false, className: 'clc-sxp-bottom-hashtag-item', style: hashTagStyle, onClick: () => handleClickTag(item) },
42
41
  React.createElement("div", { dangerouslySetInnerHTML: { __html: setFontForText(`#${item}`, hashTagStyle) } })))))));
package/es/core/components/SxpPageRender/Modal/index.js CHANGED
@@ -54,19 +54,23 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
54
54
  onClose === null || onClose === void 0 ? void 0 : onClose();
55
55
  }, 300);
56
56
  const handleTouchStart = (event) => {
57
- event.stopPropagation();
58
- touchRef.current = event.touches[0].clientY;
59
- fTouchRef.current = event.touches[0].clientY;
57
+ touchRef.current = event.touches[0];
58
+ fTouchRef.current = event.touches[0];
60
59
  touchMoveRef.current = true;
61
60
  };
62
61
  const handleTouchMove = (event) => {
63
- event.stopPropagation();
64
62
  requestAnimationFrame(() => {
65
63
  var _a;
66
64
  if (touchMoveRef.current && ((_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.scrollTop) === 0) {
67
65
  const currentY = event.touches[0].clientY;
68
- const diff = touchRef.current - currentY;
69
- touchRef.current = currentY;
66
+ const currentX = event.touches[0].clientX;
67
+ const diff = touchRef.current.clientY - currentY;
68
+ touchRef.current = event.touches[0];
69
+ const diffY = currentY - fTouchRef.current.clientY;
70
+ const diffX = currentX - fTouchRef.current.clientX;
71
+ if (Math.abs(diffX) > Math.abs(diffY)) {
72
+ return;
73
+ }
70
74
  const ts = modalTrans - diff;
71
75
  if (ts > 0) {
72
76
  setModalTrans(ts);
@@ -76,9 +80,13 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
76
80
  };
77
81
  const handleTouchEnd = (event) => {
78
82
  var _a;
79
- event.stopPropagation();
80
83
  if (touchMoveRef.current && ((_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.scrollTop) === 0) {
81
- const diff = fTouchRef.current - touchRef.current;
84
+ const diffY = event.changedTouches[0].clientY - fTouchRef.current.clientY;
85
+ const diffX = event.changedTouches[0].clientX - fTouchRef.current.clientX;
86
+ if (Math.abs(diffX) > Math.abs(diffY)) {
87
+ return;
88
+ }
89
+ const diff = fTouchRef.current.clientY - touchRef.current.clientY;
82
90
  if (diff > 0) {
83
91
  setModalTrans(0);
84
92
  }
package/es/core/components/SxpPageRender/Popup/index.js CHANGED
@@ -52,7 +52,7 @@ const Popup = () => {
52
52
  const isExternalLink = ((_d = (_c = (_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.event) === null || _c === void 0 ? void 0 : _c.onClick) === null || _d === void 0 ? void 0 : _d.linkType) === 'externalLink';
53
53
  const isPopup = ((_g = (_f = (_e = value === null || value === void 0 ? void 0 : value.item) === null || _e === void 0 ? void 0 : _e.event) === null || _f === void 0 ? void 0 : _f.onClick) === null || _g === void 0 ? void 0 : _g.linkType) === 'popup';
54
54
  const defaulSetting = (_h = t === null || t === void 0 ? void 0 : t.extend) === null || _h === void 0 ? void 0 : _h.defaulSetting;
55
- return (React.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose })));
55
+ return (React.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw', height: '100%' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose })));
56
56
  }
57
57
  else {
58
58
  return React.createElement(React.Fragment, null);
package/es/core/components/SxpPageRender/RenderCard.js CHANGED
@@ -3,7 +3,21 @@ import './index.less';
3
3
  import withBindDataSource from '../../../core/hoc/withBindDataSource';
4
4
  import { useEditor } from '../../../core/hooks';
5
5
  const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType }) => {
6
+ var _a, _b, _c, _d, _e;
6
7
  const { schema } = useEditor();
8
+ if (!(rec === null || rec === void 0 ? void 0 : rec.video))
9
+ return null;
10
+ let cta = null;
11
+ if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
12
+ cta = '多商品CTA';
13
+ }
14
+ else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
15
+ cta = '商品CTA';
16
+ }
17
+ else {
18
+ cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
19
+ }
20
+ const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
7
21
  const renderComp = useMemo(() => {
8
22
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8;
9
23
  if (!(rec === null || rec === void 0 ? void 0 : rec.video))
@@ -18,7 +32,6 @@ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType }) => {
18
32
  else {
19
33
  cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
20
34
  }
21
- const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
22
35
  if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((_f = value === null || value === void 0 ? void 0 : value.item) === null || _f === void 0 ? void 0 : _f.type)))
23
36
  return;
24
37
  if (!includesCtaType && ((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.category) === 'cta')
@@ -41,7 +54,7 @@ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType }) => {
41
54
  else {
42
55
  return null;
43
56
  }
44
- }, [rec, resolver, tempMap, schema]);
57
+ }, [rec, resolver, tempMap, schema, value === null || value === void 0 ? void 0 : value.id]);
45
58
  return React.createElement(React.Fragment, null, renderComp);
46
59
  };
47
60
  export default memo(RenderCard);
package/es/core/components/SxpPageRender/index.js CHANGED
@@ -291,7 +291,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
291
291
  return;
292
292
  const t = new Date() - curTime.current;
293
293
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.openSlideSkip) && t >= ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.slideSkipStartTime) !== null && _a !== void 0 ? _a : 0) && getSlideSkipState() && item) {
294
- const link = ((_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.bindProduct) === null || _c === void 0 ? void 0 : _c.link) || ((_f = (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.bindProducts) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.link) || ((_g = item === null || item === void 0 ? void 0 : item.product) === null || _g === void 0 ? void 0 : _g.link);
294
+ const link = ((_d = (_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.link) || ((_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.link) || ((_g = item === null || item === void 0 ? void 0 : item.product) === null || _g === void 0 ? void 0 : _g.link);
295
295
  const product = (item === null || item === void 0 ? void 0 : item.product) || ((_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct) || ((_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]);
296
296
  if (link) {
297
297
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
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
@@ -62,13 +62,16 @@ const AniLink = (_a) => {
62
62
  if (isOnScreen) {
63
63
  setVisible(true);
64
64
  }
65
+ else {
66
+ setVisible(false);
67
+ }
65
68
  }, [isOnScreen]);
66
69
  const aniNamStyle = useMemo(() => {
67
70
  if (!visible)
68
71
  return null;
69
72
  return styles['animated-button'];
70
73
  }, [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: {
74
+ 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
75
  __html: setFontForText(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
73
76
  } })));
74
77
  };
package/es/materials/sxp/cta/AniLinkPopup/index.js CHANGED
@@ -59,25 +59,28 @@ const AniLinkPopup = (_a) => {
59
59
  if (isOnScreen) {
60
60
  setVisible(true);
61
61
  }
62
+ else {
63
+ setVisible(false);
64
+ }
62
65
  }, [isOnScreen]);
63
66
  const aniNamStyle = useMemo(() => {
64
67
  if (!visible)
65
68
  return null;
66
- return startAni ? styles['animated-fadeIn'] : styles['animated-fadeOut'];
69
+ return startAni ? styles['animated-fadeIn'] : null;
67
70
  }, [visible, startAni]);
68
71
  return (React.createElement(React.Fragment, null, isTel ? (React.createElement("div", { style: {
69
72
  height: '40px',
70
73
  lineHeight: '40px',
71
74
  paddingLeft: '6px'
72
- } }, "Cta Title")) : (React.createElement("div", Object.assign({ ref: ref }, props, { className: `${css(Object.assign(Object.assign({}, style), { '--transY': `translateY(calc(100% + ${(_r = style === null || style === void 0 ? void 0 : style.margin) !== null && _r !== void 0 ? _r : 0}px))` }))} ${styles['aniLinkPopup']} ${aniNamStyle} ${css(aniTimStyle)}`, onClick: handleTo }),
75
+ } }, "Cta Title")) : (React.createElement(React.Fragment, null, aniNamStyle ? (React.createElement("div", Object.assign({ ref: ref }, props, { className: `${css(Object.assign(Object.assign({}, style), { '--transY': `translateY(calc(100% + ${(_r = style === null || style === void 0 ? void 0 : style.margin) !== null && _r !== void 0 ? _r : 0}px))` }))} ${styles['aniLinkPopup']} ${aniNamStyle} ${css(aniTimStyle)}`, onClick: handleTo }),
73
76
  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
77
  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
78
  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: {
79
+ (!recData || (product === null || product === void 0 ? void 0 : product.title)) && (React.createElement("div", { className: styles['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
77
80
  __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
- } }),
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: {
81
+ } })),
82
+ 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
83
  __html: setFontForText(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
81
- } })))));
84
+ } }))) : (React.createElement("div", { ref: ref, style: { position: 'absolute', height: '50px', width: '50px', bottom: 0, right: 0, zIndex: 1000 } }))))));
82
85
  };
83
86
  export default memo(AniLinkPopup);
package/es/materials/sxp/cta/AniLinkPopup/settingRender.js CHANGED
@@ -196,7 +196,7 @@ export default [
196
196
  },
197
197
  {
198
198
  type: 'TextSpace',
199
- name: ['props', 'ctaTempStyles', 'title']
199
+ name: ['props', 'ctaTempStyles', 'ctaTitle']
200
200
  },
201
201
  {
202
202
  type: 'Color',
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/components/SxpPageRender/Hashtag/index.js CHANGED
@@ -39,7 +39,6 @@ const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle }) => {
39
39
  }
40
40
  return (react_1.default.createElement("span", { style: { textDecoration: 'underline', cursor: 'pointer', color: '#fff' }, onClick: () => setIsShowMore(!isShowMore) }, isShowMore ? 'show less' : 'show more'));
41
41
  }, [isShowMore, tags]);
42
- console.log(hashTagStyle, '111');
43
42
  return (react_1.default.createElement("div", { className: 'clc-sxp-bottom-hashtag', style: { marginTop: `${(_a = hashTagStyle === null || hashTagStyle === void 0 ? void 0 : hashTagStyle.marginTop) !== null && _a !== void 0 ? _a : 16}px` } },
44
43
  react_1.default.createElement(Scroll_1.default, null, tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (react_1.default.createElement(react_2.SwiperSlide, { key: index, hidden: !isShowMore ? index >= 6 : false, className: 'clc-sxp-bottom-hashtag-item', style: hashTagStyle, onClick: () => handleClickTag(item) },
45
44
  react_1.default.createElement("div", { dangerouslySetInnerHTML: { __html: (0, tool_1.setFontForText)(`#${item}`, hashTagStyle) } })))))));
package/lib/core/components/SxpPageRender/Modal/index.js CHANGED
@@ -57,19 +57,23 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
57
57
  onClose === null || onClose === void 0 ? void 0 : onClose();
58
58
  }, 300);
59
59
  const handleTouchStart = (event) => {
60
- event.stopPropagation();
61
- touchRef.current = event.touches[0].clientY;
62
- fTouchRef.current = event.touches[0].clientY;
60
+ touchRef.current = event.touches[0];
61
+ fTouchRef.current = event.touches[0];
63
62
  touchMoveRef.current = true;
64
63
  };
65
64
  const handleTouchMove = (event) => {
66
- event.stopPropagation();
67
65
  requestAnimationFrame(() => {
68
66
  var _a;
69
67
  if (touchMoveRef.current && ((_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.scrollTop) === 0) {
70
68
  const currentY = event.touches[0].clientY;
71
- const diff = touchRef.current - currentY;
72
- touchRef.current = currentY;
69
+ const currentX = event.touches[0].clientX;
70
+ const diff = touchRef.current.clientY - currentY;
71
+ touchRef.current = event.touches[0];
72
+ const diffY = currentY - fTouchRef.current.clientY;
73
+ const diffX = currentX - fTouchRef.current.clientX;
74
+ if (Math.abs(diffX) > Math.abs(diffY)) {
75
+ return;
76
+ }
73
77
  const ts = modalTrans - diff;
74
78
  if (ts > 0) {
75
79
  setModalTrans(ts);
@@ -79,9 +83,13 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
79
83
  };
80
84
  const handleTouchEnd = (event) => {
81
85
  var _a;
82
- event.stopPropagation();
83
86
  if (touchMoveRef.current && ((_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.scrollTop) === 0) {
84
- const diff = fTouchRef.current - touchRef.current;
87
+ const diffY = event.changedTouches[0].clientY - fTouchRef.current.clientY;
88
+ const diffX = event.changedTouches[0].clientX - fTouchRef.current.clientX;
89
+ if (Math.abs(diffX) > Math.abs(diffY)) {
90
+ return;
91
+ }
92
+ const diff = fTouchRef.current.clientY - touchRef.current.clientY;
85
93
  if (diff > 0) {
86
94
  setModalTrans(0);
87
95
  }
package/lib/core/components/SxpPageRender/Popup/index.js CHANGED
@@ -55,7 +55,7 @@ const Popup = () => {
55
55
  const isExternalLink = ((_d = (_c = (_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.event) === null || _c === void 0 ? void 0 : _c.onClick) === null || _d === void 0 ? void 0 : _d.linkType) === 'externalLink';
56
56
  const isPopup = ((_g = (_f = (_e = value === null || value === void 0 ? void 0 : value.item) === null || _e === void 0 ? void 0 : _e.event) === null || _f === void 0 ? void 0 : _f.onClick) === null || _g === void 0 ? void 0 : _g.linkType) === 'popup';
57
57
  const defaulSetting = (_h = t === null || t === void 0 ? void 0 : t.extend) === null || _h === void 0 ? void 0 : _h.defaulSetting;
58
- return (react_1.default.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose })));
58
+ return (react_1.default.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw', height: '100%' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose })));
59
59
  }
60
60
  else {
61
61
  return react_1.default.createElement(react_1.default.Fragment, null);
package/lib/core/components/SxpPageRender/RenderCard.js CHANGED
@@ -6,7 +6,21 @@ require("./index.less");
6
6
  const withBindDataSource_1 = tslib_1.__importDefault(require("../../../core/hoc/withBindDataSource"));
7
7
  const hooks_1 = require("../../../core/hooks");
8
8
  const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType }) => {
9
+ var _a, _b, _c, _d, _e;
9
10
  const { schema } = (0, hooks_1.useEditor)();
11
+ if (!(rec === null || rec === void 0 ? void 0 : rec.video))
12
+ return null;
13
+ let cta = null;
14
+ if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
15
+ cta = '多商品CTA';
16
+ }
17
+ else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
18
+ cta = '商品CTA';
19
+ }
20
+ else {
21
+ cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
22
+ }
23
+ const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
10
24
  const renderComp = (0, react_1.useMemo)(() => {
11
25
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8;
12
26
  if (!(rec === null || rec === void 0 ? void 0 : rec.video))
@@ -21,7 +35,6 @@ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType }) => {
21
35
  else {
22
36
  cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
23
37
  }
24
- const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
25
38
  if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((_f = value === null || value === void 0 ? void 0 : value.item) === null || _f === void 0 ? void 0 : _f.type)))
26
39
  return;
27
40
  if (!includesCtaType && ((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.category) === 'cta')
@@ -44,7 +57,7 @@ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType }) => {
44
57
  else {
45
58
  return null;
46
59
  }
47
- }, [rec, resolver, tempMap, schema]);
60
+ }, [rec, resolver, tempMap, schema, value === null || value === void 0 ? void 0 : value.id]);
48
61
  return react_1.default.createElement(react_1.default.Fragment, null, renderComp);
49
62
  };
50
63
  exports.default = (0, react_1.memo)(RenderCard);
package/lib/core/components/SxpPageRender/index.js CHANGED
@@ -294,7 +294,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
294
294
  return;
295
295
  const t = new Date() - curTime.current;
296
296
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.openSlideSkip) && t >= ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.slideSkipStartTime) !== null && _a !== void 0 ? _a : 0) && (0, localStore_1.getSlideSkipState)() && item) {
297
- const link = ((_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.bindProduct) === null || _c === void 0 ? void 0 : _c.link) || ((_f = (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.bindProducts) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.link) || ((_g = item === null || item === void 0 ? void 0 : item.product) === null || _g === void 0 ? void 0 : _g.link);
297
+ const link = ((_d = (_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.link) || ((_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.link) || ((_g = item === null || item === void 0 ? void 0 : item.product) === null || _g === void 0 ? void 0 : _g.link);
298
298
  const product = (item === null || item === void 0 ? void 0 : item.product) || ((_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct) || ((_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]);
299
299
  if (link) {
300
300
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
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
@@ -64,13 +64,16 @@ const AniLink = (_a) => {
64
64
  if (isOnScreen) {
65
65
  setVisible(true);
66
66
  }
67
+ else {
68
+ setVisible(false);
69
+ }
67
70
  }, [isOnScreen]);
68
71
  const aniNamStyle = (0, react_1.useMemo)(() => {
69
72
  if (!visible)
70
73
  return null;
71
74
  return index_module_less_1.default['animated-button'];
72
75
  }, [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: {
76
+ 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
77
  __html: (0, tool_1.setFontForText)(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
75
78
  } })));
76
79
  };
package/lib/materials/sxp/cta/AniLinkPopup/index.js CHANGED
@@ -61,25 +61,28 @@ const AniLinkPopup = (_a) => {
61
61
  if (isOnScreen) {
62
62
  setVisible(true);
63
63
  }
64
+ else {
65
+ setVisible(false);
66
+ }
64
67
  }, [isOnScreen]);
65
68
  const aniNamStyle = (0, react_1.useMemo)(() => {
66
69
  if (!visible)
67
70
  return null;
68
- return startAni ? index_module_less_1.default['animated-fadeIn'] : index_module_less_1.default['animated-fadeOut'];
71
+ return startAni ? index_module_less_1.default['animated-fadeIn'] : null;
69
72
  }, [visible, startAni]);
70
73
  return (react_1.default.createElement(react_1.default.Fragment, null, isTel ? (react_1.default.createElement("div", { style: {
71
74
  height: '40px',
72
75
  lineHeight: '40px',
73
76
  paddingLeft: '6px'
74
- } }, "Cta Title")) : (react_1.default.createElement("div", Object.assign({ ref: ref }, props, { className: `${(0, css_1.css)(Object.assign(Object.assign({}, style), { '--transY': `translateY(calc(100% + ${(_r = style === null || style === void 0 ? void 0 : style.margin) !== null && _r !== void 0 ? _r : 0}px))` }))} ${index_module_less_1.default['aniLinkPopup']} ${aniNamStyle} ${(0, css_1.css)(aniTimStyle)}`, onClick: handleTo }),
77
+ } }, "Cta Title")) : (react_1.default.createElement(react_1.default.Fragment, null, aniNamStyle ? (react_1.default.createElement("div", Object.assign({ ref: ref }, props, { className: `${(0, css_1.css)(Object.assign(Object.assign({}, style), { '--transY': `translateY(calc(100% + ${(_r = style === null || style === void 0 ? void 0 : style.margin) !== null && _r !== void 0 ? _r : 0}px))` }))} ${index_module_less_1.default['aniLinkPopup']} ${aniNamStyle} ${(0, css_1.css)(aniTimStyle)}`, onClick: handleTo }),
75
78
  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
79
  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
80
  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: {
81
+ (!recData || (product === null || product === void 0 ? void 0 : product.title)) && (react_1.default.createElement("div", { className: index_module_less_1.default['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
79
82
  __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
- } }),
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: {
83
+ } })),
84
+ 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
85
  __html: (0, tool_1.setFontForText)(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
83
- } })))));
86
+ } }))) : (react_1.default.createElement("div", { ref: ref, style: { position: 'absolute', height: '50px', width: '50px', bottom: 0, right: 0, zIndex: 1000 } }))))));
84
87
  };
85
88
  exports.default = (0, react_1.memo)(AniLinkPopup);
package/lib/materials/sxp/cta/AniLinkPopup/settingRender.js CHANGED
@@ -198,7 +198,7 @@ exports.default = [
198
198
  },
199
199
  {
200
200
  type: 'TextSpace',
201
- name: ['props', 'ctaTempStyles', 'title']
201
+ name: ['props', 'ctaTempStyles', 'ctaTitle']
202
202
  },
203
203
  {
204
204
  type: 'Color',