pb-sxp-ui 1.2.3 → 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.
- package/dist/index.cjs +56 -32
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +56 -32
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +56 -32
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/Hashtag/index.js +0 -1
- package/es/core/components/SxpPageRender/Modal/index.js +16 -8
- package/es/core/components/SxpPageRender/Popup/index.js +1 -1
- package/es/core/components/SxpPageRender/RenderCard.js +15 -2
- package/es/core/components/SxpPageRender/index.js +1 -1
- package/es/materials/sxp/cta/AniLink/index.js +3 -0
- package/es/materials/sxp/cta/AniLinkPopup/index.js +7 -4
- package/es/materials/sxp/cta/AniLinkPopup/settingRender.js +1 -1
- package/lib/core/components/SxpPageRender/Hashtag/index.js +0 -1
- package/lib/core/components/SxpPageRender/Modal/index.js +16 -8
- package/lib/core/components/SxpPageRender/Popup/index.js +1 -1
- package/lib/core/components/SxpPageRender/RenderCard.js +15 -2
- package/lib/core/components/SxpPageRender/index.js +1 -1
- package/lib/materials/sxp/cta/AniLink/index.js +3 -0
- package/lib/materials/sxp/cta/AniLinkPopup/index.js +7 -4
- package/lib/materials/sxp/cta/AniLinkPopup/settingRender.js +1 -1
- package/package.json +1 -1
@@ -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) } })))))));
|
@@ -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.
|
58
|
-
|
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
|
69
|
-
touchRef.current
|
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
|
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
|
}
|
@@ -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);
|
@@ -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);
|
@@ -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.
|
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({
|
@@ -59,6 +59,9 @@ 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)
|
@@ -69,15 +72,15 @@ const AniLinkPopup = (_a) => {
|
|
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
|
-
|
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
|
-
} }),
|
81
|
+
} })),
|
79
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);
|
@@ -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) } })))))));
|
@@ -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.
|
61
|
-
|
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
|
72
|
-
touchRef.current
|
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
|
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
|
}
|
@@ -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);
|
@@ -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);
|
@@ -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.
|
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({
|
@@ -61,6 +61,9 @@ 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)
|
@@ -71,15 +74,15 @@ const AniLinkPopup = (_a) => {
|
|
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
|
-
|
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
|
-
} }),
|
83
|
+
} })),
|
81
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);
|