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
@@ -9,7 +9,6 @@ const hooks_1 = require("../../../../core/hooks");
|
|
9
9
|
const event_1 = tslib_1.__importStar(require("../../../../core/utils/event"));
|
10
10
|
const loading_gif_1 = tslib_1.__importDefault(require("./loading.gif"));
|
11
11
|
const VideoPlayer_1 = require("./VideoPlayer");
|
12
|
-
const tool_1 = require("../../../../core/utils/tool");
|
13
12
|
const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon }) => {
|
14
13
|
const [isPauseVideo, setIsPauseVideo] = (0, react_1.useState)(false);
|
15
14
|
const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport } = (0, hooks_1.useSxpDataSource)();
|
@@ -196,10 +195,9 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
|
|
196
195
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
197
196
|
if (!isActive)
|
198
197
|
return;
|
199
|
-
|
198
|
+
const videoSrc = rec === null || rec === void 0 ? void 0 : rec.video.url;
|
200
199
|
if (!videoSrc)
|
201
200
|
return;
|
202
|
-
videoSrc = (0, tool_1.getSpliceQueryUrl)(videoSrc);
|
203
201
|
const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
|
204
202
|
if (!videoPlayerWrapperNode)
|
205
203
|
return;
|
@@ -87,7 +87,7 @@ const WaterfallFlowItem = (props) => {
|
|
87
87
|
const imgLoad = (0, react_1.useCallback)((img) => {
|
88
88
|
setTimeout(() => {
|
89
89
|
var _a;
|
90
|
-
const height = (_a = pictRef === null || pictRef === void 0 ? void 0 : pictRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight;
|
90
|
+
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);
|
91
91
|
sizeChange(height + 56 + space, index);
|
92
92
|
}, 0);
|
93
93
|
}, [space, sizeChange, index, unitWidth, pictRef]);
|
@@ -14,7 +14,6 @@ const WaterFall = (props) => {
|
|
14
14
|
var _a;
|
15
15
|
const { waterFallData, setOpenHashtag, openHashtag, swiperRef, setWaterFallData, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, setCacheRtcList, setIsFromHashtag, isFromHashtag, bffEventReport, themeTag, selectTag, bffFbReport } = (0, hooks_1.useSxpDataSource)();
|
16
16
|
const { backMainFeed } = (0, useEventReport_1.useEventReport)();
|
17
|
-
const ref = (0, react_1.useRef)(null);
|
18
17
|
const modalEleRef = (0, react_1.useRef)(null);
|
19
18
|
const [viewTime, setViewTime] = (0, react_1.useState)();
|
20
19
|
(0, react_1.useEffect)(() => {
|
@@ -101,6 +100,6 @@ const WaterFall = (props) => {
|
|
101
100
|
display: openHashtag ? 'block' : 'none'
|
102
101
|
} },
|
103
102
|
react_1.default.createElement(Navbar_1.default, { icon: left_png_1.default, styles: { top: '32px' }, textStyle: (_a = props === null || props === void 0 ? void 0 : props.textStyles) === null || _a === void 0 ? void 0 : _a.hashTagTitle, onClose: handleClose }),
|
104
|
-
(props === null || props === void 0 ? void 0 : props.openFixedSize) === true || (props === null || props === void 0 ? void 0 : props.openFixedSize) === undefined ? (react_1.default.createElement(List_1.default, Object.assign({ reportTagsView: reportTagsView }, props))) : (react_1.default.createElement(WaterfallList_1.default, Object.assign({ reportTagsView: reportTagsView }, props)))), modalEleRef.current);
|
103
|
+
(props === null || props === void 0 ? void 0 : props.openFixedSize) === true || (props === null || props === void 0 ? void 0 : props.openFixedSize) === undefined ? (react_1.default.createElement(List_1.default, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props))) : (react_1.default.createElement(WaterfallList_1.default, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props)))), modalEleRef.current);
|
105
104
|
};
|
106
105
|
exports.default = (0, react_1.memo)(WaterFall);
|
@@ -29,7 +29,6 @@ const ConsentPopup_1 = tslib_1.__importDefault(require("./ConsentPopup"));
|
|
29
29
|
const MultiPosts_1 = tslib_1.__importDefault(require("../../../materials/sxp/MultiPosts"));
|
30
30
|
const EditorDataProvider_1 = require("../../../core/context/EditorDataProvider");
|
31
31
|
const NavBack_1 = tslib_1.__importDefault(require("./NavBack"));
|
32
|
-
const tool_1 = require("../../../core/utils/tool");
|
33
32
|
const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, hashTagRightMargin, tagList = [], licenseUrl }) => {
|
34
33
|
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;
|
35
34
|
const mutedIcon = (0, useIconLink_1.useIconLink)('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
|
@@ -116,7 +115,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
116
115
|
else if (item === null || item === void 0 ? void 0 : item.product) {
|
117
116
|
fromKName = 'productPage';
|
118
117
|
}
|
119
|
-
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.playbook) !== 'organic menu' || activeIndex !== 0) {
|
118
|
+
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.playbook) !== 'organic menu' || activeIndex !== 0 || channel) {
|
120
119
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
121
120
|
eventInfo: {
|
122
121
|
sessionDuration: Math.floor((new Date() - curTime.current) / 1000) + '',
|
@@ -161,7 +160,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
161
160
|
backMainFeed,
|
162
161
|
openHashtag,
|
163
162
|
isShowConsent,
|
164
|
-
selectTag
|
163
|
+
selectTag,
|
164
|
+
channel
|
165
165
|
]);
|
166
166
|
const tagHeight = (0, react_1.useMemo)(() => {
|
167
167
|
let h = 0;
|
@@ -214,7 +214,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
214
214
|
new Function(link)();
|
215
215
|
}
|
216
216
|
})),
|
217
|
-
react_1.default.createElement("img", { src:
|
217
|
+
react_1.default.createElement("img", { src: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl, alt: 'logo' })));
|
218
218
|
}
|
219
219
|
return null;
|
220
220
|
}, [globalConfig, activeIndex, visList]);
|
@@ -500,7 +500,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
500
500
|
const renderView = (0, react_1.useMemo)(() => {
|
501
501
|
if (loading) {
|
502
502
|
return (react_1.default.createElement("div", { style: { height, width: containerWidth, display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
503
|
-
react_1.default.createElement("img", { width: 64, height: 64, src:
|
503
|
+
react_1.default.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })));
|
504
504
|
}
|
505
505
|
return visList === null || visList === void 0 ? void 0 : visList.map((rec, index) => {
|
506
506
|
return (react_1.default.createElement(react_2.SwiperSlide, { key: index, virtualIndex: index, style: { overflow: 'hidden' } }, rec && (react_1.default.createElement(react_1.default.Fragment, null, (rec === null || rec === void 0 ? void 0 : rec.loading) ? (react_1.default.createElement("div", { style: {
|
@@ -510,7 +510,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
510
510
|
justifyContent: 'center',
|
511
511
|
alignItems: 'center'
|
512
512
|
} },
|
513
|
-
react_1.default.createElement("img", { width: 64, height: 64, src:
|
513
|
+
react_1.default.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (react_1.default.createElement(react_1.default.Fragment, null,
|
514
514
|
renderBottom(rec, index),
|
515
515
|
renderLikeButton(rec, index, !(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
|
516
516
|
renderToggleButton(!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed)),
|
@@ -543,12 +543,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
543
543
|
((_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _f === void 0 ? void 0 : _f.enable) && !channel && !openMultiPosts && !waterFallData && (react_1.default.createElement(NavBack_1.default, { data: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton, minusHeight: minusHeight, tagHeight: tagHeight, onClick: () => history === null || history === void 0 ? void 0 : history.back() })),
|
544
544
|
((((_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) &&
|
545
545
|
!waterFallData && (react_1.default.createElement(NavBack_1.default, { 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: () => {
|
546
|
-
var _a, _b
|
546
|
+
var _a, _b;
|
547
|
+
const item = visList === null || visList === void 0 ? void 0 : visList[activeIndex];
|
547
548
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
548
549
|
eventInfo: {
|
549
550
|
eventSubject: 'backMultiPostClick',
|
550
551
|
eventDescription: 'backMultiPostClick',
|
551
|
-
traceInfo: (
|
552
|
+
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) || ''
|
552
553
|
}
|
553
554
|
});
|
554
555
|
location === null || location === void 0 ? void 0 : location.reload();
|
@@ -1,5 +1,4 @@
|
|
1
1
|
import React, { FC, PropsWithChildren } from 'react';
|
2
|
-
import { PageData } from '../Pagebuilder/type';
|
3
2
|
interface IEditorDataContext {
|
4
3
|
sxpPrameter?: {
|
5
4
|
bottomImage: string;
|
@@ -22,7 +21,9 @@ interface IEditorDataContext {
|
|
22
21
|
openConsent?: boolean;
|
23
22
|
setOpenConsent?: React.Dispatch<React.SetStateAction<boolean>>;
|
24
23
|
sxpFontLinks?: any[];
|
25
|
-
utmParameter?:
|
24
|
+
utmParameter?: {
|
25
|
+
channels: string[];
|
26
|
+
};
|
26
27
|
consentPopupCate?: string;
|
27
28
|
setConsentPopupCate?: React.Dispatch<React.SetStateAction<string>>;
|
28
29
|
openMultiPosts?: boolean;
|
@@ -88,6 +88,7 @@ export interface ISxpDataSourceContext {
|
|
88
88
|
channel?: string;
|
89
89
|
eventTimeList?: Array<IEventTimeType>;
|
90
90
|
setEventTimeList?: React.Dispatch<React.SetStateAction<Array<IEventTimeType>>>;
|
91
|
+
multiPostTimeRef?: any;
|
91
92
|
}
|
92
93
|
export declare const SxpDataSourceContext: React.Context<ISxpDataSourceContext>;
|
93
94
|
export interface SxpDataSourceProviderProps {
|
@@ -38,6 +38,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
38
38
|
const [videoRef, setVideoRef] = (0, react_1.useState)(null);
|
39
39
|
const themeTag = (0, react_1.useRef)();
|
40
40
|
const curTime = (0, react_1.useRef)();
|
41
|
+
const multiPostTimeRef = (0, react_1.useRef)();
|
41
42
|
const [selectTag, setSelectTag] = (0, react_1.useState)(exports.DEFAULT_TAG);
|
42
43
|
const checkCommodityIndexRef = (0, react_1.useRef)(-1);
|
43
44
|
const popupCurTimeRef = (0, react_1.useRef)(null);
|
@@ -222,7 +223,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
222
223
|
userInfo = {};
|
223
224
|
}
|
224
225
|
const sessionID = (0, sessionStore_1.storeAndLoadFeSessionId)();
|
225
|
-
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), ((0, tool_1.getDevice)() && { sxpDevice: (0, tool_1.getDevice)() })), ((0, tool_1.getSystem)() && { sxpSystem: (0, tool_1.getSystem)() })), ((0, tool_1.getBrowserInfo)() && { sxpBrowser: (0, tool_1.getBrowserInfo)() })), (
|
226
|
+
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), ((0, tool_1.getDevice)() && { sxpDevice: (0, tool_1.getDevice)() })), ((0, tool_1.getSystem)() && { sxpSystem: (0, tool_1.getSystem)() })), ((0, tool_1.getBrowserInfo)() && { sxpBrowser: (0, tool_1.getBrowserInfo)() })), ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) && channel && { position: Number(eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) + 1 + '' }));
|
226
227
|
const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
|
227
228
|
const realEventInfo = Object.entries(ef)
|
228
229
|
.map(([k, v]) => v && { name: k, value: v })
|
@@ -399,7 +400,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
399
400
|
let pbType;
|
400
401
|
getRecommendVideos()
|
401
402
|
.then((data) => {
|
402
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l
|
403
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
403
404
|
if (data) {
|
404
405
|
const list = getFilterRecList(data);
|
405
406
|
let curData;
|
@@ -442,13 +443,13 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
442
443
|
setCacheRtcList(list);
|
443
444
|
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
444
445
|
if (channel) {
|
446
|
+
const item = list === null || list === void 0 ? void 0 : list[0];
|
447
|
+
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) || '';
|
445
448
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
446
|
-
eventInfo: {
|
447
|
-
|
448
|
-
|
449
|
-
|
450
|
-
branchfeed: channel
|
451
|
-
}
|
449
|
+
eventInfo: Object.assign({ eventSubject: 'multiPostClick', eventDescription: 'multiPostClick', traceInfo, branchfeed: channel }, (layId && { layoutVariantId: layId }))
|
450
|
+
});
|
451
|
+
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
452
|
+
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 }))
|
452
453
|
});
|
453
454
|
}
|
454
455
|
}
|
@@ -532,7 +533,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
532
533
|
updateChannel,
|
533
534
|
channel,
|
534
535
|
eventTimeList,
|
535
|
-
setEventTimeList
|
536
|
+
setEventTimeList,
|
537
|
+
multiPostTimeRef
|
536
538
|
} }, isShowConsent ? (react_1.default.createElement(Consent_1.default, 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({
|
537
539
|
rtcList,
|
538
540
|
mutateLike: bffMutateLike,
|
package/lib/core/utils/tool.d.ts
CHANGED
@@ -12,5 +12,4 @@ declare function getSystem(): string | null;
|
|
12
12
|
declare function getDevice(): string | null;
|
13
13
|
declare function getCookie(val: string): string;
|
14
14
|
declare function getScreenReader(): boolean;
|
15
|
-
|
16
|
-
export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, getSpliceQueryUrl };
|
15
|
+
export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader };
|
package/lib/core/utils/tool.js
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
"use strict";
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
-
exports.
|
3
|
+
exports.getScreenReader = exports.getCookie = exports.getSystem = exports.getDevice = exports.getBrowserInfo = exports.getIndexByblockType = exports.uuid = exports.setFontForText = exports.getUid = exports.generateRandomString = void 0;
|
4
4
|
const uuid_1 = require("uuid");
|
5
5
|
function uuid(len, radix) {
|
6
6
|
const chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
|
@@ -180,17 +180,3 @@ function getScreenReader() {
|
|
180
180
|
/ChromeVox/i.test(userAgent));
|
181
181
|
}
|
182
182
|
exports.getScreenReader = getScreenReader;
|
183
|
-
const getSpliceQueryUrl = (url) => {
|
184
|
-
if (!url)
|
185
|
-
return '';
|
186
|
-
if ((url === null || url === void 0 ? void 0 : url.indexOf('http')) === -1)
|
187
|
-
return url;
|
188
|
-
let query = 'x-im-piez=on';
|
189
|
-
if ((url === null || url === void 0 ? void 0 : url.indexOf('?')) !== -1) {
|
190
|
-
return url + (query ? '&' + query : '');
|
191
|
-
}
|
192
|
-
else {
|
193
|
-
return url + (query ? '?' + query : '');
|
194
|
-
}
|
195
|
-
};
|
196
|
-
exports.getSpliceQueryUrl = getSpliceQueryUrl;
|
@@ -7,15 +7,13 @@ require("./index.less");
|
|
7
7
|
const hooks_1 = require("../../../core/hooks");
|
8
8
|
const event_1 = tslib_1.__importStar(require("../../../core/utils/event"));
|
9
9
|
const react_2 = require("swiper/react");
|
10
|
-
const tool_1 = require("../../../core/utils/tool");
|
11
10
|
const MultiPosts = (_a) => {
|
12
11
|
var _b, _c;
|
13
12
|
var { bgImgUrl, style, recData } = _a, props = tslib_1.__rest(_a, ["bgImgUrl", "style", "recData"]);
|
14
|
-
const { bffEventReport, curTime, updateChannel } = (0, hooks_1.useSxpDataSource)();
|
13
|
+
const { bffEventReport, curTime, updateChannel, multiPostTimeRef } = (0, hooks_1.useSxpDataSource)();
|
15
14
|
const { isActive } = (0, react_2.useSwiperSlide)() || {};
|
16
15
|
const initRef = (0, react_1.useRef)(false);
|
17
|
-
const
|
18
|
-
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 : '';
|
16
|
+
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) || '';
|
19
17
|
const getPropsVal = (0, react_1.useCallback)((index, str) => {
|
20
18
|
try {
|
21
19
|
return new Function('props', 'str', `if (str) {
|
@@ -32,7 +30,6 @@ const MultiPosts = (_a) => {
|
|
32
30
|
if (!value)
|
33
31
|
return;
|
34
32
|
if ((v === null || v === void 0 ? void 0 : v.linkType) === 'recommendFlow') {
|
35
|
-
endMultiPost('multipostClick');
|
36
33
|
updateChannel === null || updateChannel === void 0 ? void 0 : updateChannel(value);
|
37
34
|
curTime.current = new Date();
|
38
35
|
}
|
@@ -41,12 +38,12 @@ const MultiPosts = (_a) => {
|
|
41
38
|
}
|
42
39
|
}, [props]);
|
43
40
|
const startMultiPost = (0, react_1.useCallback)(() => {
|
44
|
-
|
41
|
+
multiPostTimeRef.current = new Date();
|
45
42
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
46
43
|
eventInfo: {
|
47
44
|
eventSubject: 'startMultiPost',
|
48
45
|
eventDescription: 'startMultiPost',
|
49
|
-
contentFormat: '
|
46
|
+
contentFormat: 'image',
|
50
47
|
position: '0',
|
51
48
|
traceInfo
|
52
49
|
}
|
@@ -58,11 +55,11 @@ const MultiPosts = (_a) => {
|
|
58
55
|
eventInfo: {
|
59
56
|
eventSubject: 'endMultiPost',
|
60
57
|
eventDescription: 'endMultiPost',
|
61
|
-
contentFormat: '
|
58
|
+
contentFormat: 'image',
|
62
59
|
position: '0',
|
63
60
|
traceInfo,
|
64
61
|
nextStep: nextStep || 'others',
|
65
|
-
timeOnSite: Math.floor((new Date() - (
|
62
|
+
timeOnSite: Math.floor((new Date() - (multiPostTimeRef === null || multiPostTimeRef === void 0 ? void 0 : multiPostTimeRef.current)) / 1000) + ''
|
66
63
|
}
|
67
64
|
});
|
68
65
|
}, []);
|
@@ -89,7 +86,7 @@ const MultiPosts = (_a) => {
|
|
89
86
|
}, [isActive]);
|
90
87
|
return (react_1.default.createElement("div", { className: 'multiposts', style: Object.assign(Object.assign({}, style), (0, materials_1.getBgStyle)(bgImgUrl)) }, Array.from({ length: 4 }, (_, index) => {
|
91
88
|
return (react_1.default.createElement("button", { hidden: !getPropsVal(index, 'Url'), className: 'multiposts-btn', role: 'button', "aria-label": `multiposts-${index + 1}`, onClick: () => handleClick(index) },
|
92
|
-
react_1.default.createElement("img", { className: 'multiposts-btn-img', src:
|
89
|
+
react_1.default.createElement("img", { className: 'multiposts-btn-img', src: getPropsVal(index, 'Url'), alt: `multiposts-img-${index + 1}` })));
|
93
90
|
})));
|
94
91
|
};
|
95
92
|
exports.default = (0, react_1.memo)(MultiPosts);
|
@@ -67,7 +67,7 @@ const AniLinkPopup = (_a) => {
|
|
67
67
|
paddingLeft: '6px'
|
68
68
|
} }, "Cta Title")) : (react_1.default.createElement("div", Object.assign({}, 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 }),
|
69
69
|
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 } },
|
70
|
-
react_1.default.createElement("img", { src: (
|
70
|
+
react_1.default.createElement("img", { src: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) || closeIcon, alt: 'close', className: index_module_less_1.default['modal-icon-wrapper-img'] })),
|
71
71
|
react_1.default.createElement(Img_1.default, { src: src, rec: recData, item: (_x = (_v = (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.bindProducts) === null || _u === void 0 ? void 0 : _u[0]) !== null && _v !== void 0 ? _v : (_w = recData === null || recData === void 0 ? void 0 : recData.video) === null || _w === void 0 ? void 0 : _w.bindProduct) !== null && _x !== void 0 ? _x : recData === null || recData === void 0 ? void 0 : recData.video, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img, isActive: isActive }),
|
72
72
|
(!recData || (product === null || product === void 0 ? void 0 : product.title)) && (react_1.default.createElement("div", { className: index_module_less_1.default['one-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
|
73
73
|
__html: (0, tool_1.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)
|