pb-sxp-ui 1.10.6 → 1.10.8
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 +49 -87
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +49 -87
- 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 +49 -87
- 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 +1 -2
- package/es/core/components/SxpPageRender/FormatImage.js +7 -9
- package/es/core/components/SxpPageRender/LikeButton/index.js +1 -2
- package/es/core/components/SxpPageRender/Modal/index.js +1 -2
- package/es/core/components/SxpPageRender/NavBack.js +1 -2
- package/es/core/components/SxpPageRender/Nudge/index.js +2 -2
- package/es/core/components/SxpPageRender/ToggleButton/index.js +1 -2
- package/es/core/components/SxpPageRender/VideoWidget/index.js +1 -3
- package/es/core/components/SxpPageRender/WaterFall/WaterfallList.js +1 -1
- package/es/core/components/SxpPageRender/WaterFall/index.js +1 -2
- package/es/core/components/SxpPageRender/index.js +9 -8
- package/es/core/context/EditorDataProvider.d.ts +3 -2
- package/es/core/context/SxpDataSourceProvider.d.ts +1 -0
- package/es/core/context/SxpDataSourceProvider.js +11 -9
- package/es/core/utils/tool.d.ts +1 -2
- package/es/core/utils/tool.js +1 -14
- package/es/materials/sxp/MultiPosts/index.js +7 -10
- package/es/materials/sxp/cta/AniLinkPopup/index.js +2 -2
- package/lib/core/components/SxpPageRender/FingerSwipeTip/index.js +1 -2
- package/lib/core/components/SxpPageRender/FormatImage.js +7 -9
- package/lib/core/components/SxpPageRender/LikeButton/index.js +1 -2
- package/lib/core/components/SxpPageRender/Modal/index.js +1 -2
- package/lib/core/components/SxpPageRender/NavBack.js +1 -2
- package/lib/core/components/SxpPageRender/Nudge/index.js +1 -1
- package/lib/core/components/SxpPageRender/ToggleButton/index.js +1 -2
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +1 -3
- package/lib/core/components/SxpPageRender/WaterFall/WaterfallList.js +1 -1
- package/lib/core/components/SxpPageRender/WaterFall/index.js +1 -2
- package/lib/core/components/SxpPageRender/index.js +9 -8
- package/lib/core/context/EditorDataProvider.d.ts +3 -2
- package/lib/core/context/SxpDataSourceProvider.d.ts +1 -0
- package/lib/core/context/SxpDataSourceProvider.js +11 -9
- package/lib/core/utils/tool.d.ts +1 -2
- package/lib/core/utils/tool.js +1 -15
- package/lib/materials/sxp/MultiPosts/index.js +7 -10
- package/lib/materials/sxp/cta/AniLinkPopup/index.js +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
@@ -309,19 +309,6 @@ function getScreenReader() {
|
|
309
309
|
/JAWS/i.test(userAgent) ||
|
310
310
|
/ChromeVox/i.test(userAgent));
|
311
311
|
}
|
312
|
-
const getSpliceQueryUrl = (url) => {
|
313
|
-
if (!url)
|
314
|
-
return '';
|
315
|
-
if ((url === null || url === void 0 ? void 0 : url.indexOf('http')) === -1)
|
316
|
-
return url;
|
317
|
-
let query = 'x-im-piez=on';
|
318
|
-
if ((url === null || url === void 0 ? void 0 : url.indexOf('?')) !== -1) {
|
319
|
-
return url + ('&' + query );
|
320
|
-
}
|
321
|
-
else {
|
322
|
-
return url + ('?' + query );
|
323
|
-
}
|
324
|
-
};
|
325
312
|
|
326
313
|
function unzip(b64Data) {
|
327
314
|
const strData = atob(b64Data);
|
@@ -663,6 +650,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
663
650
|
const [videoRef, setVideoRef] = useState(null);
|
664
651
|
const themeTag = useRef();
|
665
652
|
const curTime = useRef();
|
653
|
+
const multiPostTimeRef = useRef();
|
666
654
|
const [selectTag, setSelectTag] = useState(DEFAULT_TAG);
|
667
655
|
const checkCommodityIndexRef = useRef(-1);
|
668
656
|
const popupCurTimeRef = useRef(null);
|
@@ -861,7 +849,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
861
849
|
};
|
862
850
|
}
|
863
851
|
const sessionID = storeAndLoadFeSessionId();
|
864
|
-
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() })), (
|
852
|
+
const ef = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, { playbookType }), (layoutVariantId && reportLayId && { layoutVariantId })), eventInfo), (getDevice$1() && { sxpDevice: getDevice$1() })), (getSystem() && { sxpSystem: getSystem() })), (getBrowserInfo() && { sxpBrowser: getBrowserInfo() })), ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) && channel && { position: Number(eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) + 1 + '' }));
|
865
853
|
const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
|
866
854
|
const realEventInfo = Object.entries(ef)
|
867
855
|
.map(([k, v]) => v && { name: k, value: v })
|
@@ -1039,7 +1027,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1039
1027
|
let pbType;
|
1040
1028
|
getRecommendVideos()
|
1041
1029
|
.then((data) => {
|
1042
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l
|
1030
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
1043
1031
|
if (data) {
|
1044
1032
|
const list = getFilterRecList(data);
|
1045
1033
|
let curData;
|
@@ -1082,13 +1070,13 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1082
1070
|
setCacheRtcList(list);
|
1083
1071
|
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
1084
1072
|
if (channel) {
|
1073
|
+
const item = list === null || list === void 0 ? void 0 : list[0];
|
1074
|
+
const traceInfo = ((_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.traceInfo) || ((_l = item === null || item === void 0 ? void 0 : item.product) === null || _l === void 0 ? void 0 : _l.traceInfo) || '';
|
1085
1075
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1086
|
-
eventInfo: {
|
1087
|
-
|
1088
|
-
|
1089
|
-
|
1090
|
-
branchfeed: channel
|
1091
|
-
}
|
1076
|
+
eventInfo: Object.assign({ eventSubject: 'multiPostClick', eventDescription: 'multiPostClick', traceInfo, branchfeed: channel }, (layId && { layoutVariantId: layId }))
|
1077
|
+
});
|
1078
|
+
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1079
|
+
eventInfo: Object.assign({ eventSubject: 'endMultiPost', eventDescription: 'endMultiPost', contentFormat: 'image', position: '0', traceInfo, nextStep: 'multipostClick', timeOnSite: Math.floor((new Date() - (multiPostTimeRef === null || multiPostTimeRef === void 0 ? void 0 : multiPostTimeRef.current)) / 1000) + '' }, (layId && { layoutVariantId: layId }))
|
1092
1080
|
});
|
1093
1081
|
}
|
1094
1082
|
}
|
@@ -1173,7 +1161,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1173
1161
|
updateChannel,
|
1174
1162
|
channel,
|
1175
1163
|
eventTimeList,
|
1176
|
-
setEventTimeList
|
1164
|
+
setEventTimeList,
|
1165
|
+
multiPostTimeRef
|
1177
1166
|
} }, isShowConsent ? (React.createElement(Consent$4, Object.assign({}, (_e = (_d = (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.item) === null || _e === void 0 ? void 0 : _e.props))) : (render({
|
1178
1167
|
rtcList,
|
1179
1168
|
mutateLike: bffMutateLike,
|
@@ -9778,7 +9767,7 @@ SwiperSlide.displayName = 'SwiperSlide';
|
|
9778
9767
|
* @Author: binruan@chatlabs.com
|
9779
9768
|
* @Date: 2023-11-02 18:34:34
|
9780
9769
|
* @LastEditors: binruan@chatlabs.com
|
9781
|
-
* @LastEditTime: 2024-
|
9770
|
+
* @LastEditTime: 2024-11-20 18:37:10
|
9782
9771
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Modal\index.tsx
|
9783
9772
|
*
|
9784
9773
|
*/
|
@@ -9962,7 +9951,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
|
|
9962
9951
|
}
|
9963
9952
|
})), child()),
|
9964
9953
|
React.createElement("button", { className: 'modal-icon-wrapper', role: 'button', "aria-label": 'close button', onClick: onClose, style: { top: scrollTop } },
|
9965
|
-
React.createElement("img", { src:
|
9954
|
+
React.createElement("img", { src: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) || closeIcon$1, alt: 'close button', className: 'modal-icon' }))))))), modalEleRef.current);
|
9966
9955
|
};
|
9967
9956
|
var Modal$1 = memo(Modal);
|
9968
9957
|
|
@@ -10035,20 +10024,19 @@ var ExpandableText$1 = memo(ExpandableText);
|
|
10035
10024
|
|
10036
10025
|
const FormatImage = forwardRef((props, ref) => {
|
10037
10026
|
const { src, onLoad, style, className, loading, alt = 'image' } = props;
|
10038
|
-
const
|
10039
|
-
const [imgSrc, setImgSrc] = useState(querySrc);
|
10027
|
+
const [imgSrc, setImgSrc] = useState(src);
|
10040
10028
|
const imgRef = useRef(null);
|
10041
10029
|
const [visible, setVisible] = useState(false);
|
10042
10030
|
useImperativeHandle(ref, () => ({
|
10043
10031
|
setSrc: (v) => {
|
10044
10032
|
if (v)
|
10045
|
-
setImgSrc(
|
10033
|
+
setImgSrc(v);
|
10046
10034
|
}
|
10047
10035
|
}));
|
10048
10036
|
useEffect(() => {
|
10049
|
-
if (
|
10050
|
-
setImgSrc(
|
10051
|
-
}, [
|
10037
|
+
if (src)
|
10038
|
+
setImgSrc(src);
|
10039
|
+
}, [src]);
|
10052
10040
|
useEffect(() => {
|
10053
10041
|
const onShow = () => {
|
10054
10042
|
if (src && !visible && imgRef.current) {
|
@@ -10065,8 +10053,8 @@ const FormatImage = forwardRef((props, ref) => {
|
|
10065
10053
|
!visible && !imgSrc && React.createElement("div", { style: { width: '100%', height: '100%', zIndex: 1, backgroundColor: '#fff' } }),
|
10066
10054
|
(imgSrc === null || imgSrc === void 0 ? void 0 : imgSrc.includes('.avif')) ? (React.createElement("picture", null,
|
10067
10055
|
React.createElement("source", { type: 'image/avif', srcSet: imgSrc }),
|
10068
|
-
React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}
|
10069
|
-
React.createElement("source", { type: 'image/jpeg', srcSet: `${imgSrc}
|
10056
|
+
React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}?imageMogr2/format/webp` }),
|
10057
|
+
React.createElement("source", { type: 'image/jpeg', srcSet: `${imgSrc}?imageMogr2/format/jpg` }),
|
10070
10058
|
React.createElement("img", { ref: imgRef, className: className, src: imgSrc, style: Object.assign({}, style), loading: loading, onLoad: (e) => {
|
10071
10059
|
setVisible(true);
|
10072
10060
|
onLoad === null || onLoad === void 0 ? void 0 : onLoad(e.target);
|
@@ -14912,7 +14900,7 @@ const WaterfallFlowItem$1 = (props) => {
|
|
14912
14900
|
const imgLoad = useCallback((img) => {
|
14913
14901
|
setTimeout(() => {
|
14914
14902
|
var _a;
|
14915
|
-
const height = (_a = pictRef === null || pictRef === void 0 ? void 0 : pictRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight;
|
14903
|
+
const height = (img === null || img === void 0 ? void 0 : img.clientHeight) || ((_a = pictRef === null || pictRef === void 0 ? void 0 : pictRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight);
|
14916
14904
|
// 加56是因为下方文字部分高度为56,可以自己设置
|
14917
14905
|
sizeChange(height + 56 + space, index);
|
14918
14906
|
}, 0);
|
@@ -15402,7 +15390,7 @@ function WaterfallList(_a) {
|
|
15402
15390
|
* @Author: binruan@chatlabs.com
|
15403
15391
|
* @Date: 2024-01-10 10:58:24
|
15404
15392
|
* @LastEditors: binruan@chatlabs.com
|
15405
|
-
* @LastEditTime: 2024-
|
15393
|
+
* @LastEditTime: 2024-12-09 11:18:32
|
15406
15394
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
15407
15395
|
*
|
15408
15396
|
*/
|
@@ -15410,7 +15398,6 @@ const WaterFall = (props) => {
|
|
15410
15398
|
var _a;
|
15411
15399
|
const { waterFallData, setOpenHashtag, openHashtag, swiperRef, setWaterFallData, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, setCacheRtcList, setIsFromHashtag, isFromHashtag, bffEventReport, themeTag, selectTag, bffFbReport } = useSxpDataSource();
|
15412
15400
|
const { backMainFeed } = useEventReport();
|
15413
|
-
useRef(null);
|
15414
15401
|
const modalEleRef = useRef(null);
|
15415
15402
|
const [viewTime, setViewTime] = useState();
|
15416
15403
|
useEffect(() => {
|
@@ -15427,20 +15414,12 @@ const WaterFall = (props) => {
|
|
15427
15414
|
}, []);
|
15428
15415
|
const handleClose = () => {
|
15429
15416
|
var _a, _b;
|
15430
|
-
// const isEq = isEqual(rtcList, cacheRtcList);
|
15431
|
-
// if (!isEq && cacheRtcList && cacheRtcList?.length) {
|
15432
|
-
// setRtcList?.(cacheRtcList);
|
15433
|
-
// }
|
15434
15417
|
backMainFeed('branch', selectTag, undefined, waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag);
|
15435
15418
|
reportTagsView();
|
15436
15419
|
setWaterFallData === null || setWaterFallData === void 0 ? void 0 : setWaterFallData(undefined);
|
15437
15420
|
setIsFromHashtag === null || setIsFromHashtag === void 0 ? void 0 : setIsFromHashtag(false);
|
15438
|
-
// setTimeout(() => {
|
15439
|
-
// if (!isEq) {
|
15440
15421
|
(_b = (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper) === null || _b === void 0 ? void 0 : _b.slideTo(cacheActiveIndex, 0, false);
|
15441
|
-
// }
|
15442
15422
|
setOpenHashtag === null || setOpenHashtag === void 0 ? void 0 : setOpenHashtag(false);
|
15443
|
-
// }, 0);
|
15444
15423
|
};
|
15445
15424
|
const [recData, setRecData] = useState();
|
15446
15425
|
useEffect(() => {
|
@@ -15505,7 +15484,7 @@ const WaterFall = (props) => {
|
|
15505
15484
|
display: openHashtag ? 'block' : 'none'
|
15506
15485
|
} },
|
15507
15486
|
React.createElement(Navbar$1, { icon: img$4, styles: { top: '32px' }, textStyle: (_a = props === null || props === void 0 ? void 0 : props.textStyles) === null || _a === void 0 ? void 0 : _a.hashTagTitle, onClose: handleClose }),
|
15508
|
-
(props === null || props === void 0 ? void 0 : props.openFixedSize) === true || (props === null || props === void 0 ? void 0 : props.openFixedSize) === undefined ? (React.createElement(WaterfallList, Object.assign({ reportTagsView: reportTagsView }, props))) : (React.createElement(WaterfallList$1, Object.assign({ reportTagsView: reportTagsView }, props)))), modalEleRef.current);
|
15487
|
+
(props === null || props === void 0 ? void 0 : props.openFixedSize) === true || (props === null || props === void 0 ? void 0 : props.openFixedSize) === undefined ? (React.createElement(WaterfallList, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props))) : (React.createElement(WaterfallList$1, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props)))), modalEleRef.current);
|
15509
15488
|
};
|
15510
15489
|
var WaterFall$1 = memo(WaterFall);
|
15511
15490
|
|
@@ -16301,7 +16280,7 @@ const AniLinkPopup$1 = (_a) => {
|
|
16301
16280
|
paddingLeft: '6px'
|
16302
16281
|
} }, "Cta Title")) : (React.createElement("div", Object.assign({}, 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 }),
|
16303
16282
|
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 } },
|
16304
|
-
React.createElement("img", { src:
|
16283
|
+
React.createElement("img", { src: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) || closeIcon, alt: 'close', className: styles['modal-icon-wrapper-img'] })),
|
16305
16284
|
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 }),
|
16306
16285
|
(!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: {
|
16307
16286
|
__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)
|
@@ -16612,7 +16591,7 @@ var settingRender$1 = [
|
|
16612
16591
|
* @Author: binruan@chatlabs.com
|
16613
16592
|
* @Date: 2023-12-26 10:38:53
|
16614
16593
|
* @LastEditors: binruan@chatlabs.com
|
16615
|
-
* @LastEditTime: 2024-
|
16594
|
+
* @LastEditTime: 2024-10-29 18:04:27
|
16616
16595
|
* @FilePath: \pb-sxp-ui\src\core\context\EditorDataProvider.tsx
|
16617
16596
|
*
|
16618
16597
|
*/
|
@@ -16867,11 +16846,10 @@ var settingRender = [
|
|
16867
16846
|
const MultiPosts$1 = (_a) => {
|
16868
16847
|
var _b, _c;
|
16869
16848
|
var { bgImgUrl, style, recData } = _a, props = __rest(_a, ["bgImgUrl", "style", "recData"]);
|
16870
|
-
const { bffEventReport, curTime, updateChannel } = useSxpDataSource();
|
16849
|
+
const { bffEventReport, curTime, updateChannel, multiPostTimeRef } = useSxpDataSource();
|
16871
16850
|
const { isActive } = useSwiperSlide() || {};
|
16872
16851
|
const initRef = useRef(false);
|
16873
|
-
const
|
16874
|
-
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 : '';
|
16852
|
+
const traceInfo = ((_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.traceInfo) || ((_c = recData === null || recData === void 0 ? void 0 : recData.product) === null || _c === void 0 ? void 0 : _c.traceInfo) || '';
|
16875
16853
|
const getPropsVal = useCallback((index, str) => {
|
16876
16854
|
try {
|
16877
16855
|
return new Function('props', 'str', `if (str) {
|
@@ -16888,7 +16866,6 @@ const MultiPosts$1 = (_a) => {
|
|
16888
16866
|
if (!value)
|
16889
16867
|
return;
|
16890
16868
|
if ((v === null || v === void 0 ? void 0 : v.linkType) === 'recommendFlow') {
|
16891
|
-
endMultiPost('multipostClick');
|
16892
16869
|
updateChannel === null || updateChannel === void 0 ? void 0 : updateChannel(value);
|
16893
16870
|
curTime.current = new Date();
|
16894
16871
|
}
|
@@ -16897,12 +16874,12 @@ const MultiPosts$1 = (_a) => {
|
|
16897
16874
|
}
|
16898
16875
|
}, [props]);
|
16899
16876
|
const startMultiPost = useCallback(() => {
|
16900
|
-
|
16877
|
+
multiPostTimeRef.current = new Date();
|
16901
16878
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
16902
16879
|
eventInfo: {
|
16903
16880
|
eventSubject: 'startMultiPost',
|
16904
16881
|
eventDescription: 'startMultiPost',
|
16905
|
-
contentFormat: '
|
16882
|
+
contentFormat: 'image',
|
16906
16883
|
position: '0',
|
16907
16884
|
traceInfo
|
16908
16885
|
}
|
@@ -16914,11 +16891,11 @@ const MultiPosts$1 = (_a) => {
|
|
16914
16891
|
eventInfo: {
|
16915
16892
|
eventSubject: 'endMultiPost',
|
16916
16893
|
eventDescription: 'endMultiPost',
|
16917
|
-
contentFormat: '
|
16894
|
+
contentFormat: 'image',
|
16918
16895
|
position: '0',
|
16919
16896
|
traceInfo,
|
16920
16897
|
nextStep: nextStep || 'others',
|
16921
|
-
timeOnSite: Math.floor((new Date() - (
|
16898
|
+
timeOnSite: Math.floor((new Date() - (multiPostTimeRef === null || multiPostTimeRef === void 0 ? void 0 : multiPostTimeRef.current)) / 1000) + ''
|
16922
16899
|
}
|
16923
16900
|
});
|
16924
16901
|
}, []);
|
@@ -16945,7 +16922,7 @@ const MultiPosts$1 = (_a) => {
|
|
16945
16922
|
}, [isActive]);
|
16946
16923
|
return (React.createElement("div", { className: 'multiposts', style: Object.assign(Object.assign({}, style), getBgStyle(bgImgUrl)) }, Array.from({ length: 4 }, (_, index) => {
|
16947
16924
|
return (React.createElement("button", { hidden: !getPropsVal(index, 'Url'), className: 'multiposts-btn', role: 'button', "aria-label": `multiposts-${index + 1}`, onClick: () => handleClick(index) },
|
16948
|
-
React.createElement("img", { className: 'multiposts-btn-img', src:
|
16925
|
+
React.createElement("img", { className: 'multiposts-btn-img', src: getPropsVal(index, 'Url'), alt: `multiposts-img-${index + 1}` })));
|
16949
16926
|
})));
|
16950
16927
|
};
|
16951
16928
|
var MultiPosts$2 = memo(MultiPosts$1);
|
@@ -17132,7 +17109,7 @@ const LikeButton = (_a) => {
|
|
17132
17109
|
}
|
17133
17110
|
}), 200);
|
17134
17111
|
return (React.createElement("button", Object.assign({}, props, { "aria-label": 'like', onClick: handleClick }),
|
17135
|
-
React.createElement("img", { style: { width: '100%', height: '100%', objectFit: 'contain' }, src:
|
17112
|
+
React.createElement("img", { style: { width: '100%', height: '100%', objectFit: 'contain' }, src: state ? activeIcon || likeIcon : unActicveIcon || unlikeIcon, alt: 'icon' })));
|
17136
17113
|
};
|
17137
17114
|
var LikeButton$1 = memo(LikeButton);
|
17138
17115
|
|
@@ -17346,10 +17323,9 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
17346
17323
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
17347
17324
|
if (!isActive)
|
17348
17325
|
return;
|
17349
|
-
|
17326
|
+
const videoSrc = rec === null || rec === void 0 ? void 0 : rec.video.url;
|
17350
17327
|
if (!videoSrc)
|
17351
17328
|
return;
|
17352
|
-
videoSrc = getSpliceQueryUrl(videoSrc);
|
17353
17329
|
const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
|
17354
17330
|
if (!videoPlayerWrapperNode)
|
17355
17331
|
return;
|
@@ -17533,7 +17509,7 @@ const ToggleButton = ({ defaultValue, activeIcon, unactiveIcon, onChange, style
|
|
17533
17509
|
setIsTure(defaultValue);
|
17534
17510
|
}, [defaultValue]);
|
17535
17511
|
return (React.createElement("button", { style: style, "aria-label": 'toggle button', className: 'pb-toggle-button', onClick: handleClick },
|
17536
|
-
React.createElement("img", { className: 'pb-toggle-button-icon', alt: 'toggle image', src:
|
17512
|
+
React.createElement("img", { className: 'pb-toggle-button-icon', alt: 'toggle image', src: isTrue ? activeIcon : unactiveIcon })));
|
17537
17513
|
};
|
17538
17514
|
var ToggleButton$1 = memo(ToggleButton);
|
17539
17515
|
|
@@ -17541,7 +17517,7 @@ var ToggleButton$1 = memo(ToggleButton);
|
|
17541
17517
|
* @Author: binruan@chatlabs.com
|
17542
17518
|
* @Date: 2024-01-15 19:03:09
|
17543
17519
|
* @LastEditors: binruan@chatlabs.com
|
17544
|
-
* @LastEditTime: 2024-
|
17520
|
+
* @LastEditTime: 2024-07-11 18:19:29
|
17545
17521
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FingerSwipeTip\index.tsx
|
17546
17522
|
*
|
17547
17523
|
*/
|
@@ -17558,7 +17534,7 @@ const FingerSwipeTip = ({ imageUrl, style, duration = 2000 }) => {
|
|
17558
17534
|
return show ? 'pb-fadeIn' : 'pb-fadeOut';
|
17559
17535
|
}, [show]);
|
17560
17536
|
return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: Object.assign(Object.assign({}, style), { animationDuration: `${duration / 1000}s` }) },
|
17561
|
-
React.createElement("img", { src:
|
17537
|
+
React.createElement("img", { src: imageUrl || FINGER_SWIPE_ICON, alt: 'finger swiper' })));
|
17562
17538
|
};
|
17563
17539
|
|
17564
17540
|
/*
|
@@ -17865,7 +17841,7 @@ var RenderCard$1 = memo(RenderCard);
|
|
17865
17841
|
* @Author: binruan@chatlabs.com
|
17866
17842
|
* @Date: 2024-03-26 10:07:41
|
17867
17843
|
* @LastEditors: binruan@chatlabs.com
|
17868
|
-
* @LastEditTime: 2024-
|
17844
|
+
* @LastEditTime: 2024-07-03 10:07:29
|
17869
17845
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Nudge\index.tsx
|
17870
17846
|
*
|
17871
17847
|
*/
|
@@ -17878,7 +17854,7 @@ const Nudge = ({ nudge }) => {
|
|
17878
17854
|
backgroundColor: nudge === null || nudge === void 0 ? void 0 : nudge.backgroundColor,
|
17879
17855
|
borderRadius: (_f = nudge === null || nudge === void 0 ? void 0 : nudge.borderRadius) !== null && _f !== void 0 ? _f : 4
|
17880
17856
|
} },
|
17881
|
-
(nudge === null || nudge === void 0 ? void 0 : nudge.icon) ? (React.createElement("img", { src:
|
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,
|
17882
17858
|
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: {
|
17883
17859
|
__html: setFontForText(nudge === null || nudge === void 0 ? void 0 : nudge.content, nudge === null || nudge === void 0 ? void 0 : nudge.textStyle)
|
17884
17860
|
} })))));
|
@@ -17971,26 +17947,10 @@ const NavBack = ({ data, minusHeight, tagHeight, onClick }) => {
|
|
17971
17947
|
padding: 0,
|
17972
17948
|
background: 'transparent'
|
17973
17949
|
}, role: 'button', "aria-label": 'back button', onClick: onClick },
|
17974
|
-
React.createElement("img", { src:
|
17950
|
+
React.createElement("img", { src: (data === null || data === void 0 ? void 0 : data.icon) || img, alt: 'back button', width: 100, style: { objectFit: 'cover' } })));
|
17975
17951
|
};
|
17976
17952
|
var NavBack$1 = memo(NavBack);
|
17977
17953
|
|
17978
|
-
/*
|
17979
|
-
* @Author: binruan@chatlabs.com
|
17980
|
-
* @Date: 2024-03-20 10:27:31
|
17981
|
-
* @LastEditors: binruan@chatlabs.com
|
17982
|
-
* @LastEditTime: 2024-12-04 16:13:02
|
17983
|
-
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
17984
|
-
*
|
17985
|
-
*/
|
17986
|
-
/*
|
17987
|
-
* @Author: binruan@chatlabs.com
|
17988
|
-
* @Date: 2024-03-20 10:27:31
|
17989
|
-
* @LastEditors: binruan@chatlabs.com
|
17990
|
-
* @LastEditTime: 2024-12-03 15:27:20
|
17991
|
-
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
17992
|
-
*
|
17993
|
-
*/
|
17994
17954
|
const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, hashTagRightMargin, tagList = [], licenseUrl }) => {
|
17995
17955
|
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;
|
17996
17956
|
const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
|
@@ -18079,7 +18039,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18079
18039
|
else if (item === null || item === void 0 ? void 0 : item.product) {
|
18080
18040
|
fromKName = 'productPage';
|
18081
18041
|
}
|
18082
|
-
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.playbook) !== 'organic menu' || activeIndex !== 0) {
|
18042
|
+
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.playbook) !== 'organic menu' || activeIndex !== 0 || channel) {
|
18083
18043
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18084
18044
|
eventInfo: {
|
18085
18045
|
sessionDuration: Math.floor((new Date() - curTime.current) / 1000) + '',
|
@@ -18125,7 +18085,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18125
18085
|
backMainFeed,
|
18126
18086
|
openHashtag,
|
18127
18087
|
isShowConsent,
|
18128
|
-
selectTag
|
18088
|
+
selectTag,
|
18089
|
+
channel
|
18129
18090
|
]);
|
18130
18091
|
const tagHeight = useMemo(() => {
|
18131
18092
|
let h = 0;
|
@@ -18178,7 +18139,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18178
18139
|
new Function(link)();
|
18179
18140
|
}
|
18180
18141
|
})),
|
18181
|
-
React.createElement("img", { src:
|
18142
|
+
React.createElement("img", { src: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl, alt: 'logo' })));
|
18182
18143
|
}
|
18183
18144
|
return null;
|
18184
18145
|
}, [globalConfig, activeIndex, visList]);
|
@@ -18468,7 +18429,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18468
18429
|
const renderView = useMemo(() => {
|
18469
18430
|
if (loading) {
|
18470
18431
|
return (React.createElement("div", { style: { height, width: containerWidth, display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
18471
|
-
React.createElement("img", { width: 64, height: 64, src:
|
18432
|
+
React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })));
|
18472
18433
|
}
|
18473
18434
|
return visList === null || visList === void 0 ? void 0 : visList.map((rec, index) => {
|
18474
18435
|
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: {
|
@@ -18478,7 +18439,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18478
18439
|
justifyContent: 'center',
|
18479
18440
|
alignItems: 'center'
|
18480
18441
|
} },
|
18481
|
-
React.createElement("img", { width: 64, height: 64, src:
|
18442
|
+
React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (React.createElement(React.Fragment, null,
|
18482
18443
|
renderBottom(rec, index),
|
18483
18444
|
renderLikeButton(rec, index, !(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
|
18484
18445
|
renderToggleButton(!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed)),
|
@@ -18511,12 +18472,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18511
18472
|
((_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _f === void 0 ? void 0 : _f.enable) && !channel && !openMultiPosts && !waterFallData && (React.createElement(NavBack$1, { data: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton, minusHeight: minusHeight, tagHeight: tagHeight, onClick: () => history === null || history === void 0 ? void 0 : history.back() })),
|
18512
18473
|
((((_l = (_k = (_j = (_h = (_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _g === void 0 ? void 0 : _g[0]) === null || _h === void 0 ? void 0 : _h.item) === null || _j === void 0 ? void 0 : _j.props) === null || _k === void 0 ? void 0 : _k.backButton) === null || _l === void 0 ? void 0 : _l.enable) && channel) || openMultiPosts) &&
|
18513
18474
|
!waterFallData && (React.createElement(NavBack$1, { data: (_q = (_p = (_o = (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _m === void 0 ? void 0 : _m[0]) === null || _o === void 0 ? void 0 : _o.item) === null || _p === void 0 ? void 0 : _p.props) === null || _q === void 0 ? void 0 : _q.backButton, minusHeight: minusHeight, tagHeight: tagHeight, onClick: () => {
|
18514
|
-
var _a, _b
|
18475
|
+
var _a, _b;
|
18476
|
+
const item = visList === null || visList === void 0 ? void 0 : visList[activeIndex];
|
18515
18477
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18516
18478
|
eventInfo: {
|
18517
18479
|
eventSubject: 'backMultiPostClick',
|
18518
18480
|
eventDescription: 'backMultiPostClick',
|
18519
|
-
traceInfo: (
|
18481
|
+
traceInfo: ((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.traceInfo) || ((_b = item === null || item === void 0 ? void 0 : item.product) === null || _b === void 0 ? void 0 : _b.traceInfo) || ''
|
18520
18482
|
}
|
18521
18483
|
});
|
18522
18484
|
location === null || location === void 0 ? void 0 : location.reload();
|