pb-sxp-ui 1.18.2 → 1.19.0-alpha.1
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 +186 -99
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +186 -99
- 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 +186 -99
- 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/index.d.ts +1 -0
- package/es/core/components/SxpPageRender/index.js +63 -60
- package/es/core/context/SxpDataSourceProvider.js +95 -34
- package/es/core/utils/tool.d.ts +3 -1
- package/es/core/utils/tool.js +29 -1
- package/lib/core/components/SxpPageRender/index.d.ts +1 -0
- package/lib/core/components/SxpPageRender/index.js +63 -60
- package/lib/core/context/SxpDataSourceProvider.js +94 -33
- package/lib/core/utils/tool.d.ts +3 -1
- package/lib/core/utils/tool.js +31 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -276,6 +276,42 @@ function splitUrlParams(urlParams) {
|
|
|
276
276
|
});
|
|
277
277
|
return splitList !== null && splitList !== void 0 ? splitList : [];
|
|
278
278
|
}
|
|
279
|
+
function deleteCookie(name, path = '/', domain = '') {
|
|
280
|
+
// 设置过期时间为过去的时间
|
|
281
|
+
const expiration = 'expires=Thu, 01 Jan 1970 00:00:00 GMT';
|
|
282
|
+
const pathPart = path ? `; path=${path}` : '';
|
|
283
|
+
const domainPart = domain ? `; domain=${domain}` : '';
|
|
284
|
+
// 设置Cookie值为空，过期时间设为过去
|
|
285
|
+
document.cookie = `${name}=; ${expiration}${pathPart}${domainPart}`;
|
|
286
|
+
console.log(`已尝试删除Cookie: ${name}`);
|
|
287
|
+
}
|
|
288
|
+
function setCookie(name, value, days = 0, path = '/', domain = '', secure = false, sameSite = 'Lax') {
|
|
289
|
+
let cookieString = `${encodeURIComponent(name)}=${encodeURIComponent(value)}`;
|
|
290
|
+
// 设置过期时间
|
|
291
|
+
if (days) {
|
|
292
|
+
const date = new Date();
|
|
293
|
+
date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
|
|
294
|
+
cookieString += `; expires=${date.toUTCString()}`;
|
|
295
|
+
}
|
|
296
|
+
// 设置路径
|
|
297
|
+
if (path) {
|
|
298
|
+
cookieString += `; path=${path}`;
|
|
299
|
+
}
|
|
300
|
+
// 设置域名
|
|
301
|
+
if (domain) {
|
|
302
|
+
cookieString += `; domain=${domain}`;
|
|
303
|
+
}
|
|
304
|
+
// 设置Secure标志
|
|
305
|
+
if (secure) {
|
|
306
|
+
cookieString += '; secure';
|
|
307
|
+
}
|
|
308
|
+
// 设置SameSite属性
|
|
309
|
+
if (sameSite) {
|
|
310
|
+
cookieString += `; samesite=${sameSite}`;
|
|
311
|
+
}
|
|
312
|
+
// 设置Cookie
|
|
313
|
+
document.cookie = cookieString;
|
|
314
|
+
}
|
|
279
315
|
|
|
280
316
|
function unzip(b64Data) {
|
|
281
317
|
const strData = atob(b64Data);
|
|
@@ -653,6 +689,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
653
689
|
const [chatlabsId, setChatlabsId] = useState();
|
|
654
690
|
const finalPageData = useMemo(() => pageData !== null && pageData !== void 0 ? pageData : data, [pageData, data]);
|
|
655
691
|
const pixelPvStatusRef = useRef(false);
|
|
692
|
+
const fbcRef = useRef('');
|
|
656
693
|
const isShowConsent = useMemo(() => {
|
|
657
694
|
var _a, _b, _c, _d;
|
|
658
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) &&
|
|
@@ -713,6 +750,38 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
713
750
|
var _a;
|
|
714
751
|
return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + storeAndLoadFeUserId();
|
|
715
752
|
}, [bffDataSource]);
|
|
753
|
+
useEffect(() => {
|
|
754
|
+
if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting))
|
|
755
|
+
return;
|
|
756
|
+
fbcRef.current = getCookie('_fbc');
|
|
757
|
+
window.OptanonWrapper = function () {
|
|
758
|
+
const activeGroups = window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups;
|
|
759
|
+
if (!activeGroups)
|
|
760
|
+
return;
|
|
761
|
+
if (!(activeGroups === null || activeGroups === void 0 ? void 0 : activeGroups.includes('4'))) {
|
|
762
|
+
deleteCookie('_fbc');
|
|
763
|
+
}
|
|
764
|
+
else if (fbcRef.current) {
|
|
765
|
+
setCookie('_fbc', fbcRef.current, 90);
|
|
766
|
+
}
|
|
767
|
+
};
|
|
768
|
+
}, [globalConfig]);
|
|
769
|
+
const isActiveTargetingCookie = useMemo(() => {
|
|
770
|
+
var _a;
|
|
771
|
+
function getCookie(name) {
|
|
772
|
+
var _a;
|
|
773
|
+
const value = `; ${document.cookie}`;
|
|
774
|
+
const parts = value.split(`; ${name}=`);
|
|
775
|
+
if (parts.length === 2)
|
|
776
|
+
return (_a = parts.pop()) === null || _a === void 0 ? void 0 : _a.split(';').shift();
|
|
777
|
+
return '';
|
|
778
|
+
}
|
|
779
|
+
decodeURIComponent((_a = getCookie('OptanonConsent')) !== null && _a !== void 0 ? _a : '');
|
|
780
|
+
if (((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting) && (window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) && !(window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups.includes('4')))) {
|
|
781
|
+
return true;
|
|
782
|
+
}
|
|
783
|
+
return false;
|
|
784
|
+
}, [globalConfig]);
|
|
716
785
|
// bff API 请求方法
|
|
717
786
|
const bffFetch = useCallback((path, options, isBota = true) => {
|
|
718
787
|
var _a;
|
|
@@ -739,6 +808,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
739
808
|
}, [bffDataSource, fakeUserId]);
|
|
740
809
|
const bffCollectEvent = useCallback((params) => {
|
|
741
810
|
var _a;
|
|
811
|
+
if (isActiveTargetingCookie)
|
|
812
|
+
return Promise.resolve();
|
|
742
813
|
const body = {
|
|
743
814
|
eventName: params === null || params === void 0 ? void 0 : params.eventName,
|
|
744
815
|
eventSource: params === null || params === void 0 ? void 0 : params.eventSource
|
|
@@ -749,39 +820,42 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
749
820
|
body,
|
|
750
821
|
type: 'beacon'
|
|
751
822
|
}, false);
|
|
752
|
-
}, [bffFetch, bffDataSource]);
|
|
823
|
+
}, [bffFetch, bffDataSource, isActiveTargetingCookie]);
|
|
753
824
|
useEffect(() => {
|
|
754
|
-
if (typeof (window
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
// img.onload = function () {
|
|
765
|
-
// 检查是否是目标 URL
|
|
766
|
-
if (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/')) {
|
|
767
|
-
// 解析 URL 参数
|
|
768
|
-
const url = new URL(value);
|
|
769
|
-
const params = Object.fromEntries(url.searchParams.entries());
|
|
770
|
-
bffCollectEvent({
|
|
771
|
-
eventName: params === null || params === void 0 ? void 0 : params.ev,
|
|
772
|
-
eventSource: 'Meta Pixel'
|
|
773
|
-
});
|
|
774
|
-
// }
|
|
775
|
-
}
|
|
776
|
-
},
|
|
777
|
-
get() {
|
|
778
|
-
return originalSrcDescriptor.get.call(this);
|
|
825
|
+
// if (typeof (window as any)?.fbq === 'function') {
|
|
826
|
+
const OriginalImage = window.Image;
|
|
827
|
+
window.Image = function () {
|
|
828
|
+
const img = new OriginalImage();
|
|
829
|
+
// 劫持 src 的 setter
|
|
830
|
+
const originalSrcDescriptor = Object.getOwnPropertyDescriptor(HTMLImageElement.prototype, 'src');
|
|
831
|
+
Object.defineProperty(img, 'src', {
|
|
832
|
+
set(value) {
|
|
833
|
+
if (isActiveTargetingCookie && (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/') || value.includes('https://www.facebook.com/tr'))) {
|
|
834
|
+
return;
|
|
779
835
|
}
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
836
|
+
// 继续正常设置 src
|
|
837
|
+
originalSrcDescriptor.set.call(this, value);
|
|
838
|
+
// img.onload = function () {
|
|
839
|
+
// 检查是否是目标 URL
|
|
840
|
+
if (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/')) {
|
|
841
|
+
// 解析 URL 参数
|
|
842
|
+
const url = new URL(value);
|
|
843
|
+
const params = Object.fromEntries(url.searchParams.entries());
|
|
844
|
+
bffCollectEvent({
|
|
845
|
+
eventName: params === null || params === void 0 ? void 0 : params.ev,
|
|
846
|
+
eventSource: 'Meta Pixel'
|
|
847
|
+
});
|
|
848
|
+
// }
|
|
849
|
+
}
|
|
850
|
+
},
|
|
851
|
+
get() {
|
|
852
|
+
return originalSrcDescriptor.get.call(this);
|
|
853
|
+
}
|
|
854
|
+
});
|
|
855
|
+
return img;
|
|
856
|
+
};
|
|
857
|
+
// }
|
|
858
|
+
}, [bffCollectEvent, isActiveTargetingCookie]);
|
|
785
859
|
useEffect(() => {
|
|
786
860
|
// 类型安全声明
|
|
787
861
|
const navigatorWithBeacon = navigator;
|
|
@@ -794,6 +868,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
794
868
|
// 覆盖方法
|
|
795
869
|
navigatorWithBeacon.sendBeacon = function (url, data) {
|
|
796
870
|
const urlString = url instanceof URL ? url.href : url.toString();
|
|
871
|
+
if (isActiveTargetingCookie && (urlString.includes('https://tr.snapchat.com/p') || urlString.includes('https://analytics.tiktok.com/api/v2/pixel'))) {
|
|
872
|
+
return true;
|
|
873
|
+
}
|
|
797
874
|
const success = originalSendBeacon(url, data);
|
|
798
875
|
function parseBeaconData(data) {
|
|
799
876
|
return __awaiter(this, void 0, void 0, function* () {
|
|
@@ -843,7 +920,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
843
920
|
return () => {
|
|
844
921
|
navigatorWithBeacon.sendBeacon = originalSendBeacon;
|
|
845
922
|
};
|
|
846
|
-
}, [bffCollectEvent]);
|
|
923
|
+
}, [bffCollectEvent, isActiveTargetingCookie]);
|
|
847
924
|
useEffect(() => {
|
|
848
925
|
const _originalFetch = window.fetch;
|
|
849
926
|
// 覆盖 fetch 方法
|
|
@@ -865,6 +942,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
865
942
|
return _originalFetch.apply(this, arguments_1);
|
|
866
943
|
}
|
|
867
944
|
try {
|
|
945
|
+
if (isActiveTargetingCookie && (url.includes('https://www.google-analytics.com/g/collect') || url.includes('https://arms-retcode.aliyuncs.com/r.png'))) {
|
|
946
|
+
return Promise.resolve(new Response(''));
|
|
947
|
+
}
|
|
868
948
|
// 1. 先执行原始请求
|
|
869
949
|
const response = _originalFetch.apply(this, arguments_1);
|
|
870
950
|
// 检查是否是 GA4 收集端点
|
|
@@ -908,7 +988,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
908
988
|
}
|
|
909
989
|
});
|
|
910
990
|
};
|
|
911
|
-
}, [bffCollectEvent]);
|
|
991
|
+
}, [bffCollectEvent, isActiveTargetingCookie]);
|
|
912
992
|
useEffect(() => {
|
|
913
993
|
const originalOpen = XMLHttpRequest.prototype.open;
|
|
914
994
|
const originalSend = XMLHttpRequest.prototype.send;
|
|
@@ -918,6 +998,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
918
998
|
};
|
|
919
999
|
XMLHttpRequest.prototype.send = function (body) {
|
|
920
1000
|
var _a;
|
|
1001
|
+
if (isActiveTargetingCookie && this._url && typeof this._url === 'string' && (this._url.includes('https://rumcollector.uptime.com') || this._url.includes('https://arms-retcode.aliyuncs.com/r.png') || this._url.includes('https://i.giesswein.com/nb-collector'))) {
|
|
1002
|
+
return;
|
|
1003
|
+
}
|
|
921
1004
|
if (this._url && typeof this._url === 'string' && this._url.includes('https://i.giesswein.com/nb-collector')) {
|
|
922
1005
|
if (body && typeof body === 'string') {
|
|
923
1006
|
try {
|
|
@@ -943,7 +1026,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
943
1026
|
XMLHttpRequest.prototype.open = originalOpen;
|
|
944
1027
|
XMLHttpRequest.prototype.send = originalSend;
|
|
945
1028
|
};
|
|
946
|
-
}, [bffCollectEvent]);
|
|
1029
|
+
}, [bffCollectEvent, isActiveTargetingCookie]);
|
|
947
1030
|
useEffect(() => {
|
|
948
1031
|
if (typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
|
|
949
1032
|
window === null || window === void 0 ? void 0 : window.fbq('track', 'PageView');
|
|
@@ -1073,7 +1156,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1073
1156
|
const bffEventReport = useCallback(({ userInfo, eventInfo, reportLayId = true }) => {
|
|
1074
1157
|
var _a, _b;
|
|
1075
1158
|
// 关闭 BFF 事件上报
|
|
1076
|
-
if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
|
|
1159
|
+
if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || isActiveTargetingCookie) {
|
|
1077
1160
|
return;
|
|
1078
1161
|
}
|
|
1079
1162
|
// 用户信息都是公共的
|
|
@@ -1114,7 +1197,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1114
1197
|
layoutVariantId,
|
|
1115
1198
|
globalConfig,
|
|
1116
1199
|
playbookType,
|
|
1117
|
-
bffDataSource
|
|
1200
|
+
bffDataSource,
|
|
1201
|
+
isActiveTargetingCookie
|
|
1118
1202
|
]);
|
|
1119
1203
|
const getEventParamsByJson = useCallback((json, product) => {
|
|
1120
1204
|
var _a, _b, _c;
|
|
@@ -1179,7 +1263,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1179
1263
|
}, [fakeUserId]);
|
|
1180
1264
|
const bffFbReport = useCallback(({ eventName, product }) => {
|
|
1181
1265
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
1182
|
-
if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
|
|
1266
|
+
if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || isActiveTargetingCookie) {
|
|
1183
1267
|
return;
|
|
1184
1268
|
}
|
|
1185
1269
|
let isPushState = false;
|
|
@@ -1245,7 +1329,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1245
1329
|
type: 'beacon'
|
|
1246
1330
|
});
|
|
1247
1331
|
}
|
|
1248
|
-
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
|
|
1332
|
+
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson, isActiveTargetingCookie]);
|
|
1249
1333
|
const bffMutateLike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1250
1334
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
|
|
1251
1335
|
return res === null || res === void 0 ? void 0 : res.success;
|
|
@@ -19217,7 +19301,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19217
19301
|
React.createElement(Nudge, { nudge: nudge }),
|
|
19218
19302
|
((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA)) && !isNineProduct ? (React.createElement("div", { className: 'clc-sxp-bottom-card' },
|
|
19219
19303
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex }))) : null,
|
|
19220
|
-
React.createElement("div",
|
|
19304
|
+
React.createElement("div", { style: { display: 'flex', flexDirection: 'column' } },
|
|
19221
19305
|
React.createElement(ExpandableText$1, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.title) !== null && _l !== void 0 ? _l : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
|
|
19222
19306
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
|
|
19223
19307
|
React.createElement(Hashtag$1, { index: activeIndex, tags: (_o = (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.hashTags) !== null && _o !== void 0 ? _o : [], itemId: (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.itemId, itemType: ((_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
|
|
@@ -19463,68 +19547,71 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19463
19547
|
isReload,
|
|
19464
19548
|
renderToggleButton
|
|
19465
19549
|
]);
|
|
19466
|
-
return (React.createElement("div", { id: 'sxp-render', className: 'clc-sxp-container' },
|
|
19467
|
-
|
|
19468
|
-
|
|
19469
|
-
|
|
19470
|
-
|
|
19471
|
-
|
|
19472
|
-
|
|
19473
|
-
setOpenHashtag === null || setOpenHashtag === void 0 ? void 0 : setOpenHashtag(true);
|
|
19474
|
-
} })),
|
|
19475
|
-
renderLogo,
|
|
19476
|
-
React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex, style: {
|
|
19477
|
-
top: minusHeight
|
|
19478
|
-
} }),
|
|
19479
|
-
((_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() })),
|
|
19480
|
-
((((_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) &&
|
|
19481
|
-
!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: () => {
|
|
19482
|
-
var _a, _b;
|
|
19483
|
-
const item = visList === null || visList === void 0 ? void 0 : visList[activeIndex];
|
|
19484
|
-
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
19485
|
-
eventInfo: {
|
|
19486
|
-
eventSubject: 'backMultiPostClick',
|
|
19487
|
-
eventDescription: 'backMultiPostClick',
|
|
19488
|
-
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) || ''
|
|
19550
|
+
return (React.createElement("div", { id: 'sxp-render', className: 'clc-sxp-container' },
|
|
19551
|
+
(data === null || data === void 0 ? void 0 : data.length) < 1 && loading ? (React.createElement("div", { style: { height, width: containerWidth, display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
|
19552
|
+
React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (React.createElement("div", { style: Object.assign({}, ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.textUnderlineOffset) && { textUnderlineOffset: `${globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.textUnderlineOffset}px` })) },
|
|
19553
|
+
waterFallData && (React.createElement(Navbar$1, { icon: img, styles: { background: 'rgba(0,0,0,.3)', color: '#fff', top: `${minusHeight}px` }, textStyle: Object.assign(Object.assign({}, (_e = (_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === 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.textStyles) === null || _e === void 0 ? void 0 : _e.hashTagTitle), { color: '#fff' }), onClose: () => {
|
|
19554
|
+
const isEq = isEqual(rtcList, cacheRtcList);
|
|
19555
|
+
if (!isEq && cacheRtcList && (cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.length)) {
|
|
19556
|
+
setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList(cacheRtcList);
|
|
19489
19557
|
}
|
|
19490
|
-
|
|
19491
|
-
|
|
19492
|
-
|
|
19493
|
-
|
|
19494
|
-
|
|
19495
|
-
|
|
19496
|
-
|
|
19497
|
-
|
|
19498
|
-
|
|
19499
|
-
|
|
19500
|
-
|
|
19501
|
-
|
|
19502
|
-
|
|
19503
|
-
|
|
19504
|
-
|
|
19505
|
-
|
|
19506
|
-
|
|
19507
|
-
|
|
19508
|
-
|
|
19509
|
-
|
|
19510
|
-
|
|
19511
|
-
|
|
19512
|
-
|
|
19513
|
-
|
|
19514
|
-
|
|
19515
|
-
|
|
19516
|
-
|
|
19517
|
-
|
|
19518
|
-
|
|
19558
|
+
setOpenHashtag === null || setOpenHashtag === void 0 ? void 0 : setOpenHashtag(true);
|
|
19559
|
+
} })),
|
|
19560
|
+
renderLogo,
|
|
19561
|
+
React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex, style: {
|
|
19562
|
+
top: minusHeight
|
|
19563
|
+
} }),
|
|
19564
|
+
((_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() })),
|
|
19565
|
+
((((_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) &&
|
|
19566
|
+
!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: () => {
|
|
19567
|
+
var _a, _b;
|
|
19568
|
+
const item = visList === null || visList === void 0 ? void 0 : visList[activeIndex];
|
|
19569
|
+
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
19570
|
+
eventInfo: {
|
|
19571
|
+
eventSubject: 'backMultiPostClick',
|
|
19572
|
+
eventDescription: 'backMultiPostClick',
|
|
19573
|
+
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) || ''
|
|
19574
|
+
}
|
|
19575
|
+
});
|
|
19576
|
+
location === null || location === void 0 ? void 0 : location.reload();
|
|
19577
|
+
} })),
|
|
19578
|
+
isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _r !== void 0 ? _r : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
|
|
19579
|
+
React.createElement(Swiper, { style: {
|
|
19580
|
+
marginTop: tagHeight
|
|
19581
|
+
}, ref: swiperRef, onSlideChange: () => {
|
|
19582
|
+
swiperRef.current.swiper.allowTouchMove = false;
|
|
19583
|
+
setTimeout(() => {
|
|
19584
|
+
swiperRef.current.swiper.allowTouchMove = true;
|
|
19585
|
+
}, 500);
|
|
19586
|
+
}, onActiveIndexChange: (swiper) => {
|
|
19587
|
+
setActiveIndex(swiper.activeIndex);
|
|
19588
|
+
if (openHashtag)
|
|
19589
|
+
return;
|
|
19590
|
+
// 处理上滑下滑事件
|
|
19591
|
+
handleScrollEvent(swiper);
|
|
19592
|
+
if (waterFallData || isEditor || isDiyH5)
|
|
19593
|
+
return;
|
|
19594
|
+
if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
|
|
19595
|
+
if (!isLoadMore) {
|
|
19596
|
+
setIsLoadMore(true);
|
|
19597
|
+
loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
|
|
19598
|
+
var _a;
|
|
19599
|
+
setIsLoadMore(false);
|
|
19600
|
+
if (res && ((_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
19601
|
+
setPageNum(pageNum + 1);
|
|
19602
|
+
}
|
|
19603
|
+
});
|
|
19604
|
+
}
|
|
19519
19605
|
}
|
|
19520
|
-
}
|
|
19521
|
-
|
|
19522
|
-
|
|
19523
|
-
|
|
19524
|
-
|
|
19525
|
-
|
|
19526
|
-
|
|
19527
|
-
|
|
19606
|
+
}, direction: 'vertical', height: height },
|
|
19607
|
+
renderView,
|
|
19608
|
+
renderLikeButton(visList[activeIndex], activeIndex, !!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
|
|
19609
|
+
renderToggleButton(!!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed))),
|
|
19610
|
+
React.createElement(WaterFall$1, Object.assign({}, (_u = (_t = (_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _s === void 0 ? void 0 : _s[0]) === null || _t === void 0 ? void 0 : _t.item) === null || _u === void 0 ? void 0 : _u.props)),
|
|
19611
|
+
React.createElement(ConsentPopup, { resolver: resolver, globalConfig: globalConfig }),
|
|
19612
|
+
openMultiPosts && (React.createElement(MultiPosts$2, Object.assign({}, (_x = (_w = (_v = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _v === void 0 ? void 0 : _v[0]) === null || _w === void 0 ? void 0 : _w.item) === null || _x === void 0 ? void 0 : _x.props, (_0 = (_z = (_y = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _y === void 0 ? void 0 : _y[0]) === null || _z === void 0 ? void 0 : _z.item) === null || _0 === void 0 ? void 0 : _0.event, { style: { position: 'fixed', top: 0, left: 0, right: 0 } }))))),
|
|
19613
|
+
(window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting) && (React.createElement("div", { style: { position: 'fixed', bottom: 0, left: 0, right: 0, width: '100%', zIndex: 10, backgroundColor: '#000', fontSize: 0 } },
|
|
19614
|
+
React.createElement("button", { id: 'ot-sdk-btn', className: 'ot-sdk-show-settings', style: { textDecoration: 'underline', width: 'fit-content', border: 'none', lineHeight: '24px', fontSize: '10px', color: '#fff', padding: '0 20px' } }, "Cookie settings")))));
|
|
19528
19615
|
};
|
|
19529
19616
|
var SxpPageRender$1 = memo(SxpPageRender);
|
|
19530
19617
|
|