pb-sxp-ui 1.10.3 → 1.10.5
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 +122 -67
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +122 -67
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +4 -4
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +4 -4
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +122 -67
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +4 -4
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/FingerSwipeTip/index.js +2 -1
- package/es/core/components/SxpPageRender/FormatImage.js +9 -7
- package/es/core/components/SxpPageRender/LikeButton/index.js +2 -1
- package/es/core/components/SxpPageRender/Modal/index.js +2 -1
- package/es/core/components/SxpPageRender/NavBack.js +2 -1
- package/es/core/components/SxpPageRender/Nudge/index.js +2 -2
- package/es/core/components/SxpPageRender/ToggleButton/index.js +2 -1
- package/es/core/components/SxpPageRender/VideoWidget/index.js +3 -1
- package/es/core/components/SxpPageRender/index.js +28 -19
- package/es/core/context/EditorDataProvider.d.ts +2 -3
- package/es/core/context/SxpDataSourceProvider.js +44 -15
- package/es/core/utils/tool.d.ts +2 -1
- package/es/core/utils/tool.js +14 -1
- package/es/materials/sxp/MultiPosts/index.js +9 -13
- package/es/materials/sxp/cta/AniLinkPopup/index.js +2 -2
- package/lib/core/components/SxpPageRender/FingerSwipeTip/index.js +2 -1
- package/lib/core/components/SxpPageRender/FormatImage.js +9 -7
- package/lib/core/components/SxpPageRender/LikeButton/index.js +2 -1
- package/lib/core/components/SxpPageRender/Modal/index.js +2 -1
- package/lib/core/components/SxpPageRender/NavBack.js +2 -1
- package/lib/core/components/SxpPageRender/Nudge/index.js +1 -1
- package/lib/core/components/SxpPageRender/ToggleButton/index.js +2 -1
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +3 -1
- package/lib/core/components/SxpPageRender/index.js +28 -19
- package/lib/core/context/EditorDataProvider.d.ts +2 -3
- package/lib/core/context/SxpDataSourceProvider.js +44 -15
- package/lib/core/utils/tool.d.ts +2 -1
- package/lib/core/utils/tool.js +15 -1
- package/lib/materials/sxp/MultiPosts/index.js +9 -13
- package/lib/materials/sxp/cta/AniLinkPopup/index.js +1 -1
- package/package.json +1 -1
package/dist/pb-ui.js
CHANGED
@@ -324,6 +324,19 @@
|
|
324
324
|
/JAWS/i.test(userAgent) ||
|
325
325
|
/ChromeVox/i.test(userAgent));
|
326
326
|
}
|
327
|
+
const getSpliceQueryUrl = (url) => {
|
328
|
+
if (!url)
|
329
|
+
return '';
|
330
|
+
if ((url === null || url === void 0 ? void 0 : url.indexOf('http')) === -1)
|
331
|
+
return url;
|
332
|
+
let query = 'x-im-piez=on';
|
333
|
+
if ((url === null || url === void 0 ? void 0 : url.indexOf('?')) !== -1) {
|
334
|
+
return url + ('&' + query );
|
335
|
+
}
|
336
|
+
else {
|
337
|
+
return url + ('?' + query );
|
338
|
+
}
|
339
|
+
};
|
327
340
|
|
328
341
|
function unzip(b64Data) {
|
329
342
|
const strData = atob(b64Data);
|
@@ -670,11 +683,13 @@
|
|
670
683
|
const popupCurTimeRef = React.useRef(null);
|
671
684
|
const [isNoMoreData, setIsNoMoreData] = React.useState(false);
|
672
685
|
const [globalConfig, setGlobalConfig] = React.useState((_b = (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf) === null || _b === void 0 ? void 0 : _b.globalConfig);
|
673
|
-
const [pageData, setPageData] = React.useState(
|
686
|
+
const [pageData, setPageData] = React.useState();
|
674
687
|
const [showConsent, setShowConsent] = React.useState(false);
|
675
688
|
const [layoutVariantId, setLayoutVariantId] = React.useState();
|
676
689
|
const [channel, setChannel] = React.useState();
|
677
690
|
const [eventTimeList, setEventTimeList] = React.useState([]);
|
691
|
+
const [playbookType, setPlaybookType] = React.useState();
|
692
|
+
const finalPageData = React.useMemo(() => pageData !== null && pageData !== void 0 ? pageData : data, [pageData, data]);
|
678
693
|
const isShowConsent = React.useMemo(() => {
|
679
694
|
var _a, _b, _c, _d;
|
680
695
|
return (((((_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.privacy_necessity) && !isAgreePolicy && !isEditor) || isOpenConsent) &&
|
@@ -861,7 +876,7 @@
|
|
861
876
|
};
|
862
877
|
}
|
863
878
|
const sessionID = storeAndLoadFeSessionId();
|
864
|
-
const ef = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, eventInfo), (getDevice$1() && { sxpDevice: getDevice$1() })), (getSystem() && { sxpSystem: getSystem() })), (getBrowserInfo() && { sxpBrowser: getBrowserInfo() })), {
|
879
|
+
const ef = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, { playbookType }), eventInfo), (getDevice$1() && { sxpDevice: getDevice$1() })), (getSystem() && { sxpSystem: getSystem() })), (getBrowserInfo() && { sxpBrowser: getBrowserInfo() })), (layoutVariantId && reportLayId && { layoutVariantId })), ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) && channel && { position: Number(eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) + 1 + '' }));
|
865
880
|
const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
|
866
881
|
const realEventInfo = Object.entries(ef)
|
867
882
|
.map(([k, v]) => v && { name: k, value: v })
|
@@ -875,7 +890,7 @@
|
|
875
890
|
body: { userInfo: realUserInfo, eventInfo: realEventInfo },
|
876
891
|
type: 'beacon'
|
877
892
|
});
|
878
|
-
}, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, layoutVariantId]);
|
893
|
+
}, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, layoutVariantId, globalConfig, playbookType]);
|
879
894
|
const bffFbReport = React.useCallback(({ eventName, product }) => {
|
880
895
|
var _a, _b, _c, _d, _e;
|
881
896
|
if (!enableReportEvent ||
|
@@ -1036,17 +1051,14 @@
|
|
1036
1051
|
return;
|
1037
1052
|
setLoading(true);
|
1038
1053
|
let layId;
|
1054
|
+
let pbType;
|
1039
1055
|
getRecommendVideos()
|
1040
1056
|
.then((data) => {
|
1041
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
1057
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
1042
1058
|
if (data) {
|
1043
1059
|
const list = getFilterRecList(data);
|
1044
|
-
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.playbook) === 'organic menu' && !channel) {
|
1045
|
-
list.unshift('organic menu');
|
1046
|
-
}
|
1047
|
-
setRtcList(list);
|
1048
|
-
setCacheRtcList(list);
|
1049
1060
|
let curData;
|
1061
|
+
let gldata;
|
1050
1062
|
if (data === null || data === void 0 ? void 0 : data.layoutVariantId) {
|
1051
1063
|
const id = (_b = (_a = data === null || data === void 0 ? void 0 : data.layoutVariantId) === null || _a === void 0 ? void 0 : _a.split('-')) === null || _b === void 0 ? void 0 : _b[1];
|
1052
1064
|
if (id) {
|
@@ -1056,19 +1068,49 @@
|
|
1056
1068
|
if (curData) {
|
1057
1069
|
setPageData(curData);
|
1058
1070
|
document.title = (_c = curData === null || curData === void 0 ? void 0 : curData.name) !== null && _c !== void 0 ? _c : 'home';
|
1059
|
-
|
1071
|
+
gldata = (_e = (_d = curData === null || curData === void 0 ? void 0 : curData.data) === null || _d === void 0 ? void 0 : _d.sxpPageConf) === null || _e === void 0 ? void 0 : _e.globalConfig;
|
1072
|
+
setGlobalConfig(gldata);
|
1060
1073
|
onUpdateSchema === null || onUpdateSchema === void 0 ? void 0 : onUpdateSchema(curData === null || curData === void 0 ? void 0 : curData.data);
|
1061
|
-
if ((
|
1074
|
+
if ((_j = (_h = (_g = (_f = gldata === null || gldata === void 0 ? void 0 : gldata.consent) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.item) === null || _h === void 0 ? void 0 : _h.props) === null || _j === void 0 ? void 0 : _j.privacy_necessity)
|
1062
1075
|
setShowConsent(true);
|
1063
1076
|
}
|
1077
|
+
else {
|
1078
|
+
setShowConsent(true);
|
1079
|
+
}
|
1064
1080
|
}
|
1065
1081
|
}
|
1066
|
-
|
1082
|
+
else {
|
1083
|
+
setShowConsent(true);
|
1084
|
+
}
|
1085
|
+
if (!channel) {
|
1086
|
+
if ((gldata === null || gldata === void 0 ? void 0 : gldata.playbook) === 'organic menu' || (!gldata && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.playbook) === 'organic menu')) {
|
1087
|
+
setPlaybookType('organicMenu');
|
1088
|
+
list.unshift('organic menu');
|
1089
|
+
pbType = 'organicMenu';
|
1090
|
+
}
|
1091
|
+
else {
|
1092
|
+
setPlaybookType('paidMedia');
|
1093
|
+
pbType = 'paidMedia';
|
1094
|
+
}
|
1095
|
+
}
|
1096
|
+
setRtcList(list);
|
1097
|
+
setCacheRtcList(list);
|
1098
|
+
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
1099
|
+
if (channel) {
|
1100
|
+
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1101
|
+
eventInfo: {
|
1102
|
+
eventSubject: 'multiPostClick',
|
1103
|
+
eventDescription: 'multiPostClick',
|
1104
|
+
traceInfo: (_m = (_l = (_k = list === null || list === void 0 ? void 0 : list[0]) === null || _k === void 0 ? void 0 : _k.video) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : '',
|
1105
|
+
branchfeed: channel
|
1106
|
+
}
|
1107
|
+
});
|
1108
|
+
}
|
1067
1109
|
}
|
1068
1110
|
})
|
1069
1111
|
.finally(() => {
|
1070
1112
|
bffEventReport({
|
1071
|
-
eventInfo: Object.assign({ eventSubject: 'apiRequest', eventDescription: 'api request succeed' }, (layId && { layoutVariantId: layId }))
|
1113
|
+
eventInfo: Object.assign(Object.assign({ eventSubject: 'apiRequest', eventDescription: 'api request succeed' }, (layId && { layoutVariantId: layId })), (pbType && { playbookType: pbType }))
|
1072
1114
|
});
|
1073
1115
|
setLoading(false);
|
1074
1116
|
});
|
@@ -1078,7 +1120,7 @@
|
|
1078
1120
|
if (!isPreview)
|
1079
1121
|
return;
|
1080
1122
|
setLoading(true);
|
1081
|
-
bffGetTagList(
|
1123
|
+
bffGetTagList(data);
|
1082
1124
|
getRecommendVideos()
|
1083
1125
|
.then((data) => {
|
1084
1126
|
if (data) {
|
@@ -1153,7 +1195,7 @@
|
|
1153
1195
|
mutateUnlike: bffMutateUnlike,
|
1154
1196
|
submitForm: bffSubmitForm,
|
1155
1197
|
tagList,
|
1156
|
-
pageData
|
1198
|
+
pageData: finalPageData
|
1157
1199
|
}))));
|
1158
1200
|
};
|
1159
1201
|
var SxpDataSourceProvider$1 = React.memo(SxpDataSourceProvider);
|
@@ -9751,7 +9793,7 @@
|
|
9751
9793
|
* @Author: binruan@chatlabs.com
|
9752
9794
|
* @Date: 2023-11-02 18:34:34
|
9753
9795
|
* @LastEditors: binruan@chatlabs.com
|
9754
|
-
* @LastEditTime: 2024-
|
9796
|
+
* @LastEditTime: 2024-12-04 11:34:20
|
9755
9797
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Modal\index.tsx
|
9756
9798
|
*
|
9757
9799
|
*/
|
@@ -9935,7 +9977,7 @@
|
|
9935
9977
|
}
|
9936
9978
|
})), child()),
|
9937
9979
|
React.createElement("button", { className: 'modal-icon-wrapper', role: 'button', "aria-label": 'close button', onClick: onClose, style: { top: scrollTop } },
|
9938
|
-
React.createElement("img", { src: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) || closeIcon$1, alt: 'close button', className: 'modal-icon' }))))))), modalEleRef.current);
|
9980
|
+
React.createElement("img", { src: getSpliceQueryUrl((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) || closeIcon$1), alt: 'close button', className: 'modal-icon' }))))))), modalEleRef.current);
|
9939
9981
|
};
|
9940
9982
|
var Modal$1 = React.memo(Modal);
|
9941
9983
|
|
@@ -10008,19 +10050,20 @@
|
|
10008
10050
|
|
10009
10051
|
const FormatImage = React.forwardRef((props, ref) => {
|
10010
10052
|
const { src, onLoad, style, className, loading, alt = 'image' } = props;
|
10011
|
-
const
|
10053
|
+
const querySrc = src ? getSpliceQueryUrl(src) : '';
|
10054
|
+
const [imgSrc, setImgSrc] = React.useState(querySrc);
|
10012
10055
|
const imgRef = React.useRef(null);
|
10013
10056
|
const [visible, setVisible] = React.useState(false);
|
10014
10057
|
React.useImperativeHandle(ref, () => ({
|
10015
10058
|
setSrc: (v) => {
|
10016
10059
|
if (v)
|
10017
|
-
setImgSrc(v);
|
10060
|
+
setImgSrc(getSpliceQueryUrl(v));
|
10018
10061
|
}
|
10019
10062
|
}));
|
10020
10063
|
React.useEffect(() => {
|
10021
|
-
if (
|
10022
|
-
setImgSrc(
|
10023
|
-
}, [
|
10064
|
+
if (querySrc)
|
10065
|
+
setImgSrc(querySrc);
|
10066
|
+
}, [querySrc]);
|
10024
10067
|
React.useEffect(() => {
|
10025
10068
|
const onShow = () => {
|
10026
10069
|
if (src && !visible && imgRef.current) {
|
@@ -10037,8 +10080,8 @@
|
|
10037
10080
|
!visible && !imgSrc && React.createElement("div", { style: { width: '100%', height: '100%', zIndex: 1, backgroundColor: '#fff' } }),
|
10038
10081
|
(imgSrc === null || imgSrc === void 0 ? void 0 : imgSrc.includes('.avif')) ? (React.createElement("picture", null,
|
10039
10082
|
React.createElement("source", { type: 'image/avif', srcSet: imgSrc }),
|
10040
|
-
React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}
|
10041
|
-
React.createElement("source", { type: 'image/jpeg', srcSet: `${imgSrc}
|
10083
|
+
React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}&imageMogr2/format/webp` }),
|
10084
|
+
React.createElement("source", { type: 'image/jpeg', srcSet: `${imgSrc}&imageMogr2/format/jpg` }),
|
10042
10085
|
React.createElement("img", { ref: imgRef, className: className, src: imgSrc, style: Object.assign({}, style), loading: loading, onLoad: (e) => {
|
10043
10086
|
setVisible(true);
|
10044
10087
|
onLoad === null || onLoad === void 0 ? void 0 : onLoad(e.target);
|
@@ -16273,7 +16316,7 @@ Made in Italy` })));
|
|
16273
16316
|
paddingLeft: '6px'
|
16274
16317
|
} }, "Cta Title")) : (React.createElement("div", Object.assign({}, props, { className: `${css.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.css(aniTimStyle)}`, onClick: handleTo }),
|
16275
16318
|
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 } },
|
16276
|
-
React.createElement("img", { src: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) || closeIcon, alt: 'close', className: styles['modal-icon-wrapper-img'] })),
|
16319
|
+
React.createElement("img", { src: getSpliceQueryUrl((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) || closeIcon), alt: 'close', className: styles['modal-icon-wrapper-img'] })),
|
16277
16320
|
React.createElement(Img$1, { 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, isActive: isActive }),
|
16278
16321
|
(!recData || (product === null || product === void 0 ? void 0 : product.title)) && (React.createElement("div", { className: styles['one-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
|
16279
16322
|
__html: setFontForText((_y = product === null || product === void 0 ? void 0 : product.title) !== null && _y !== void 0 ? _y : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
|
@@ -16584,7 +16627,7 @@ Made in Italy` })));
|
|
16584
16627
|
* @Author: binruan@chatlabs.com
|
16585
16628
|
* @Date: 2023-12-26 10:38:53
|
16586
16629
|
* @LastEditors: binruan@chatlabs.com
|
16587
|
-
* @LastEditTime: 2024-
|
16630
|
+
* @LastEditTime: 2024-12-03 16:43:47
|
16588
16631
|
* @FilePath: \pb-sxp-ui\src\core\context\EditorDataProvider.tsx
|
16589
16632
|
*
|
16590
16633
|
*/
|
@@ -16843,7 +16886,7 @@ Made in Italy` })));
|
|
16843
16886
|
const { isActive } = useSwiperSlide() || {};
|
16844
16887
|
const initRef = React.useRef(false);
|
16845
16888
|
const viewTime = React.useRef();
|
16846
|
-
const
|
16889
|
+
const traceInfo = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.traceInfo) !== null && _c !== void 0 ? _c : '';
|
16847
16890
|
const getPropsVal = React.useCallback((index, str) => {
|
16848
16891
|
try {
|
16849
16892
|
return new Function('props', 'str', `if (str) {
|
@@ -16859,14 +16902,6 @@ Made in Italy` })));
|
|
16859
16902
|
const value = v === null || v === void 0 ? void 0 : v.value;
|
16860
16903
|
if (!value)
|
16861
16904
|
return;
|
16862
|
-
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
16863
|
-
eventInfo: {
|
16864
|
-
eventSubject: 'multiPostClick',
|
16865
|
-
eventDescription: 'multiPostClick',
|
16866
|
-
traceinfo,
|
16867
|
-
branchfeed: (v === null || v === void 0 ? void 0 : v.linkType) === 'recommendFlow' && value ? value : ''
|
16868
|
-
}
|
16869
|
-
});
|
16870
16905
|
if ((v === null || v === void 0 ? void 0 : v.linkType) === 'recommendFlow') {
|
16871
16906
|
endMultiPost('multipostClick');
|
16872
16907
|
updateChannel === null || updateChannel === void 0 ? void 0 : updateChannel(value);
|
@@ -16884,18 +16919,19 @@ Made in Italy` })));
|
|
16884
16919
|
eventDescription: 'startMultiPost',
|
16885
16920
|
contentFormat: 'IMAGE',
|
16886
16921
|
position: '0',
|
16887
|
-
|
16922
|
+
traceInfo
|
16888
16923
|
}
|
16889
16924
|
});
|
16890
16925
|
}, []);
|
16891
16926
|
const endMultiPost = React.useCallback((nextStep) => {
|
16927
|
+
curTime.current = new Date();
|
16892
16928
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
16893
16929
|
eventInfo: {
|
16894
16930
|
eventSubject: 'endMultiPost',
|
16895
16931
|
eventDescription: 'endMultiPost',
|
16896
16932
|
contentFormat: 'IMAGE',
|
16897
16933
|
position: '0',
|
16898
|
-
|
16934
|
+
traceInfo,
|
16899
16935
|
nextStep: nextStep || 'others',
|
16900
16936
|
timeOnSite: Math.floor((new Date() - (viewTime === null || viewTime === void 0 ? void 0 : viewTime.current)) / 1000) + ''
|
16901
16937
|
}
|
@@ -16911,6 +16947,8 @@ Made in Italy` })));
|
|
16911
16947
|
}
|
16912
16948
|
}, [isActive]);
|
16913
16949
|
React.useEffect(() => {
|
16950
|
+
if (!isActive)
|
16951
|
+
return;
|
16914
16952
|
const onShow = () => startMultiPost();
|
16915
16953
|
const onHide = () => endMultiPost();
|
16916
16954
|
SXP_EVENT_BUS.on(SXP_EVENT_TYPE.PAGE_DID_SHOW, onShow);
|
@@ -16921,8 +16959,8 @@ Made in Italy` })));
|
|
16921
16959
|
};
|
16922
16960
|
}, [isActive]);
|
16923
16961
|
return (React.createElement("div", { className: 'multiposts', style: Object.assign(Object.assign({}, style), getBgStyle(bgImgUrl)) }, Array.from({ length: 4 }, (_, index) => {
|
16924
|
-
return (React.createElement("button", { className: 'multiposts-btn', role: 'button', "aria-label": `multiposts-${index + 1}`, onClick: () => handleClick(index) },
|
16925
|
-
React.createElement("img", { className: 'multiposts-btn-img', src: getPropsVal(index, 'Url'), alt: `multiposts-img-${index + 1}` })));
|
16962
|
+
return (React.createElement("button", { hidden: !getPropsVal(index, 'Url'), className: 'multiposts-btn', role: 'button', "aria-label": `multiposts-${index + 1}`, onClick: () => handleClick(index) },
|
16963
|
+
React.createElement("img", { className: 'multiposts-btn-img', src: getSpliceQueryUrl(getPropsVal(index, 'Url')), alt: `multiposts-img-${index + 1}` })));
|
16926
16964
|
})));
|
16927
16965
|
};
|
16928
16966
|
var MultiPosts$2 = React.memo(MultiPosts$1);
|
@@ -17109,7 +17147,7 @@ Made in Italy` })));
|
|
17109
17147
|
}
|
17110
17148
|
}), 200);
|
17111
17149
|
return (React.createElement("button", Object.assign({}, props, { "aria-label": 'like', onClick: handleClick }),
|
17112
|
-
React.createElement("img", { style: { width: '100%', height: '100%', objectFit: 'contain' }, src: state ? activeIcon || likeIcon : unActicveIcon || unlikeIcon, alt: 'icon' })));
|
17150
|
+
React.createElement("img", { style: { width: '100%', height: '100%', objectFit: 'contain' }, src: getSpliceQueryUrl(state ? activeIcon || likeIcon : unActicveIcon || unlikeIcon), alt: 'icon' })));
|
17113
17151
|
};
|
17114
17152
|
var LikeButton$1 = React.memo(LikeButton);
|
17115
17153
|
|
@@ -17323,9 +17361,10 @@ Made in Italy` })));
|
|
17323
17361
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
17324
17362
|
if (!isActive)
|
17325
17363
|
return;
|
17326
|
-
|
17364
|
+
let videoSrc = rec === null || rec === void 0 ? void 0 : rec.video.url;
|
17327
17365
|
if (!videoSrc)
|
17328
17366
|
return;
|
17367
|
+
videoSrc = getSpliceQueryUrl(videoSrc);
|
17329
17368
|
const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
|
17330
17369
|
if (!videoPlayerWrapperNode)
|
17331
17370
|
return;
|
@@ -17509,7 +17548,7 @@ Made in Italy` })));
|
|
17509
17548
|
setIsTure(defaultValue);
|
17510
17549
|
}, [defaultValue]);
|
17511
17550
|
return (React.createElement("button", { style: style, "aria-label": 'toggle button', className: 'pb-toggle-button', onClick: handleClick },
|
17512
|
-
React.createElement("img", { className: 'pb-toggle-button-icon', alt: 'toggle image', src: isTrue ? activeIcon : unactiveIcon })));
|
17551
|
+
React.createElement("img", { className: 'pb-toggle-button-icon', alt: 'toggle image', src: getSpliceQueryUrl(isTrue ? activeIcon : unactiveIcon) })));
|
17513
17552
|
};
|
17514
17553
|
var ToggleButton$1 = React.memo(ToggleButton);
|
17515
17554
|
|
@@ -17517,7 +17556,7 @@ Made in Italy` })));
|
|
17517
17556
|
* @Author: binruan@chatlabs.com
|
17518
17557
|
* @Date: 2024-01-15 19:03:09
|
17519
17558
|
* @LastEditors: binruan@chatlabs.com
|
17520
|
-
* @LastEditTime: 2024-
|
17559
|
+
* @LastEditTime: 2024-12-04 11:24:16
|
17521
17560
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FingerSwipeTip\index.tsx
|
17522
17561
|
*
|
17523
17562
|
*/
|
@@ -17534,7 +17573,7 @@ Made in Italy` })));
|
|
17534
17573
|
return show ? 'pb-fadeIn' : 'pb-fadeOut';
|
17535
17574
|
}, [show]);
|
17536
17575
|
return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: Object.assign(Object.assign({}, style), { animationDuration: `${duration / 1000}s` }) },
|
17537
|
-
React.createElement("img", { src: imageUrl || FINGER_SWIPE_ICON, alt: 'finger swiper' })));
|
17576
|
+
React.createElement("img", { src: getSpliceQueryUrl(imageUrl || FINGER_SWIPE_ICON), alt: 'finger swiper' })));
|
17538
17577
|
};
|
17539
17578
|
|
17540
17579
|
/*
|
@@ -17841,7 +17880,7 @@ Made in Italy` })));
|
|
17841
17880
|
* @Author: binruan@chatlabs.com
|
17842
17881
|
* @Date: 2024-03-26 10:07:41
|
17843
17882
|
* @LastEditors: binruan@chatlabs.com
|
17844
|
-
* @LastEditTime: 2024-
|
17883
|
+
* @LastEditTime: 2024-12-04 11:29:23
|
17845
17884
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Nudge\index.tsx
|
17846
17885
|
*
|
17847
17886
|
*/
|
@@ -17854,7 +17893,7 @@ Made in Italy` })));
|
|
17854
17893
|
backgroundColor: nudge === null || nudge === void 0 ? void 0 : nudge.backgroundColor,
|
17855
17894
|
borderRadius: (_f = nudge === null || nudge === void 0 ? void 0 : nudge.borderRadius) !== null && _f !== void 0 ? _f : 4
|
17856
17895
|
} },
|
17857
|
-
(nudge === null || nudge === void 0 ? void 0 : nudge.icon) ? (React.createElement("img", { src: nudge.icon, alt: 'nudge icon', style: { height: '100%', objectFit: 'cover', flexShrink: 0 } })) : null,
|
17896
|
+
(nudge === null || nudge === void 0 ? void 0 : nudge.icon) ? (React.createElement("img", { src: getSpliceQueryUrl(nudge.icon), alt: 'nudge icon', style: { height: '100%', objectFit: 'cover', flexShrink: 0 } })) : null,
|
17858
17897
|
React.createElement("p", { style: Object.assign(Object.assign({}, nudge === null || nudge === void 0 ? void 0 : nudge.textStyle), { textWrap: 'nowrap', textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap', flex: 1, marginBottom: 0, marginTop: 0 }), dangerouslySetInnerHTML: {
|
17859
17898
|
__html: setFontForText(nudge === null || nudge === void 0 ? void 0 : nudge.content, nudge === null || nudge === void 0 ? void 0 : nudge.textStyle)
|
17860
17899
|
} })))));
|
@@ -17947,7 +17986,7 @@ Made in Italy` })));
|
|
17947
17986
|
padding: 0,
|
17948
17987
|
background: 'transparent'
|
17949
17988
|
}, role: 'button', "aria-label": 'back button', onClick: onClick },
|
17950
|
-
React.createElement("img", { src: (data === null || data === void 0 ? void 0 : data.icon) || img, alt: 'back button', width: 100, style: { objectFit: 'cover' } })));
|
17989
|
+
React.createElement("img", { src: getSpliceQueryUrl((data === null || data === void 0 ? void 0 : data.icon) || img), alt: 'back button', width: 100, style: { objectFit: 'cover' } })));
|
17951
17990
|
};
|
17952
17991
|
var NavBack$1 = React.memo(NavBack);
|
17953
17992
|
|
@@ -17955,7 +17994,15 @@ Made in Italy` })));
|
|
17955
17994
|
* @Author: binruan@chatlabs.com
|
17956
17995
|
* @Date: 2024-03-20 10:27:31
|
17957
17996
|
* @LastEditors: binruan@chatlabs.com
|
17958
|
-
* @LastEditTime: 2024-
|
17997
|
+
* @LastEditTime: 2024-12-04 11:30:35
|
17998
|
+
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
17999
|
+
*
|
18000
|
+
*/
|
18001
|
+
/*
|
18002
|
+
* @Author: binruan@chatlabs.com
|
18003
|
+
* @Date: 2024-03-20 10:27:31
|
18004
|
+
* @LastEditors: binruan@chatlabs.com
|
18005
|
+
* @LastEditTime: 2024-12-03 15:27:20
|
17959
18006
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
17960
18007
|
*
|
17961
18008
|
*/
|
@@ -18047,20 +18094,22 @@ Made in Italy` })));
|
|
18047
18094
|
else if (item === null || item === void 0 ? void 0 : item.product) {
|
18048
18095
|
fromKName = 'productPage';
|
18049
18096
|
}
|
18050
|
-
|
18051
|
-
|
18052
|
-
|
18053
|
-
|
18054
|
-
|
18055
|
-
|
18056
|
-
|
18057
|
-
|
18058
|
-
|
18059
|
-
|
18060
|
-
|
18061
|
-
|
18062
|
-
|
18063
|
-
|
18097
|
+
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.playbook) !== 'organic menu' || activeIndex !== 0) {
|
18098
|
+
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18099
|
+
eventInfo: {
|
18100
|
+
sessionDuration: Math.floor((new Date() - curTime.current) / 1000) + '',
|
18101
|
+
eventSubject: 'sessionCompleted',
|
18102
|
+
eventDescription: 'Session completed',
|
18103
|
+
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
18104
|
+
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
18105
|
+
position: activeIndex + '',
|
18106
|
+
fromKName,
|
18107
|
+
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
18108
|
+
ctatId: (_r = (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.bindCta) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
18109
|
+
traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
|
18110
|
+
}
|
18111
|
+
});
|
18112
|
+
}
|
18064
18113
|
}
|
18065
18114
|
else if (document.visibilityState === 'visible') {
|
18066
18115
|
if (skipLinkRef.current === true) {
|
@@ -18144,7 +18193,7 @@ Made in Italy` })));
|
|
18144
18193
|
new Function(link)();
|
18145
18194
|
}
|
18146
18195
|
})),
|
18147
|
-
React.createElement("img", { src: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl, alt: 'logo' })));
|
18196
|
+
React.createElement("img", { src: getSpliceQueryUrl(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl), alt: 'logo' })));
|
18148
18197
|
}
|
18149
18198
|
return null;
|
18150
18199
|
}, [globalConfig, activeIndex, visList]);
|
@@ -18242,9 +18291,12 @@ Made in Italy` })));
|
|
18242
18291
|
if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLike) || !visible)
|
18243
18292
|
return;
|
18244
18293
|
let top = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconY) !== null && _a !== void 0 ? _a : 400;
|
18245
|
-
if (waterFallData && top < 40 && globalConfig.likeIconYPosit === 'top') {
|
18294
|
+
if (waterFallData && top < 40 && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconYPosit) === 'top') {
|
18246
18295
|
top += 40;
|
18247
18296
|
}
|
18297
|
+
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconYPosit) === 'top') {
|
18298
|
+
top += minusHeight;
|
18299
|
+
}
|
18248
18300
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
18249
18301
|
return (React.createElement(LikeButton$1, { key: rec.position, activeIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIcon, unActicveIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unlikeIcon, active: rec.isCollected, recData: rec, className: 'clc-sxp-like-button', style: {
|
18250
18302
|
position: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed) ? 'fixed' : 'absolute',
|
@@ -18416,6 +18468,9 @@ Made in Italy` })));
|
|
18416
18468
|
if (waterFallData && top < 40 && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconYPosit) === 'top') {
|
18417
18469
|
top += 40;
|
18418
18470
|
}
|
18471
|
+
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconYPosit) === 'top') {
|
18472
|
+
top += minusHeight;
|
18473
|
+
}
|
18419
18474
|
return (((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowMute) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowMute) === true) && (React.createElement(ToggleButton$1, { style: {
|
18420
18475
|
position: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed) ? 'fixed' : 'absolute',
|
18421
18476
|
visibility: ((_c = (_b = visList === null || visList === void 0 ? void 0 : visList[activeIndex]) === null || _b === void 0 ? void 0 : _b.video) === null || _c === void 0 ? void 0 : _c.url) ? 'visible' : 'hidden',
|
@@ -18428,7 +18483,7 @@ Made in Italy` })));
|
|
18428
18483
|
const renderView = React.useMemo(() => {
|
18429
18484
|
if (loading) {
|
18430
18485
|
return (React.createElement("div", { style: { height, width: containerWidth, display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
18431
|
-
React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })));
|
18486
|
+
React.createElement("img", { width: 64, height: 64, src: getSpliceQueryUrl(loadingImage), alt: 'loading...', style: { objectFit: 'contain' } })));
|
18432
18487
|
}
|
18433
18488
|
return visList === null || visList === void 0 ? void 0 : visList.map((rec, index) => {
|
18434
18489
|
return (React.createElement(SwiperSlide, { key: index, virtualIndex: index, style: { overflow: 'hidden' } }, rec && (React.createElement(React.Fragment, null, (rec === null || rec === void 0 ? void 0 : rec.loading) ? (React.createElement("div", { style: {
|
@@ -18438,7 +18493,7 @@ Made in Italy` })));
|
|
18438
18493
|
justifyContent: 'center',
|
18439
18494
|
alignItems: 'center'
|
18440
18495
|
} },
|
18441
|
-
React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (React.createElement(React.Fragment, null,
|
18496
|
+
React.createElement("img", { width: 64, height: 64, src: getSpliceQueryUrl(loadingImage), alt: 'loading...', style: { objectFit: 'contain' } }))) : (React.createElement(React.Fragment, null,
|
18442
18497
|
renderBottom(rec, index),
|
18443
18498
|
renderLikeButton(rec, index, !(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
|
18444
18499
|
renderToggleButton(!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed)),
|
@@ -18475,7 +18530,7 @@ Made in Italy` })));
|
|
18475
18530
|
eventInfo: {
|
18476
18531
|
eventSubject: 'backMultiPostClick',
|
18477
18532
|
eventDescription: 'backMultiPostClick',
|
18478
|
-
|
18533
|
+
traceInfo: (_c = (_b = (_a = data === null || data === void 0 ? void 0 : data[activeIndex]) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.traceInfo) !== null && _c !== void 0 ? _c : ''
|
18479
18534
|
}
|
18480
18535
|
});
|
18481
18536
|
location === null || location === void 0 ? void 0 : location.reload();
|