pb-sxp-ui 1.14.1 → 1.15.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 +66 -24
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +13 -0
- package/dist/index.js +66 -24
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +5 -5
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +5 -5
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +66 -24
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +5 -5
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/Consent/index.js +8 -2
- package/es/core/components/SxpPageRender/WaterFall/List.js +3 -3
- package/es/core/components/SxpPageRender/WaterFall/index.js +2 -2
- package/es/core/context/SxpDataSourceProvider.js +13 -8
- package/es/core/utils/tool.d.ts +2 -1
- package/es/core/utils/tool.js +38 -14
- package/es/materials/sxp/HashTag/index.d.ts +4 -1
- package/es/materials/sxp/HashTag/material.js +2 -1
- package/es/materials/sxp/HashTag/settingRender.d.ts +0 -2
- package/es/materials/sxp/HashTag/settingRender.js +2 -3
- package/lib/core/components/Consent/index.js +8 -2
- package/lib/core/components/SxpPageRender/WaterFall/List.js +3 -3
- package/lib/core/components/SxpPageRender/WaterFall/index.js +2 -2
- package/lib/core/context/SxpDataSourceProvider.js +12 -7
- package/lib/core/utils/tool.d.ts +2 -1
- package/lib/core/utils/tool.js +39 -14
- package/lib/materials/sxp/HashTag/index.d.ts +4 -1
- package/lib/materials/sxp/HashTag/material.js +2 -1
- package/lib/materials/sxp/HashTag/settingRender.d.ts +0 -2
- package/lib/materials/sxp/HashTag/settingRender.js +2 -3
- package/package.json +1 -1
@@ -1,12 +1,18 @@
|
|
1
1
|
import React, { memo, useEffect, useMemo } from 'react';
|
2
|
-
import qs from 'qs';
|
3
2
|
import { useSxpDataSource } from '../../../core/hooks';
|
4
3
|
import { AGREE_POLICY } from '../../../core/utils/localStore';
|
4
|
+
import { splitUrlParams } from '../../../core/utils/tool';
|
5
5
|
const Consent = ({ width = window.innerWidth, height = window.innerHeight, privacy_title, privacy_context, privacy_policy_url, privacy_policy_title }) => {
|
6
6
|
const { setIsAgreePolicy, bffEventReport } = useSxpDataSource();
|
7
7
|
const channelObj = useMemo(() => {
|
8
|
+
var _a;
|
8
9
|
const queryString = location.search.slice(1);
|
9
|
-
const params =
|
10
|
+
const params = {};
|
11
|
+
(_a = splitUrlParams(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
12
|
+
const key = val.split('=')[0];
|
13
|
+
const value = val.split('=')[1];
|
14
|
+
params[key] = value;
|
15
|
+
});
|
10
16
|
for (const key in params) {
|
11
17
|
params[key] = params[key].replace(/%2B/g, '+');
|
12
18
|
}
|
@@ -10,7 +10,7 @@ import { useEventReport } from '../../../../core/hooks/useEventReport';
|
|
10
10
|
import { getPriceText } from '../../../../core/utils/materials';
|
11
11
|
const WaterfallFlowItem = (props) => {
|
12
12
|
var _a;
|
13
|
-
const { rec, index, list, reportTagsView, textStyles, space } = props;
|
13
|
+
const { rec, index, list, reportTagsView, textStyles, space, openFixedSize } = props;
|
14
14
|
const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = useSxpDataSource();
|
15
15
|
const [showVideo, setShowVideo] = useState(false);
|
16
16
|
const imgDom = useRef(null);
|
@@ -104,11 +104,11 @@ const WaterfallFlowItem = (props) => {
|
|
104
104
|
}, 0);
|
105
105
|
};
|
106
106
|
return (React.createElement("div", { ref: ref, className: 'list-content-listItem', key: index, onClick: handleClickToDetail, style: { marginBottom: space } },
|
107
|
-
React.createElement("div", { className: 'list-content-listItem-picture' },
|
107
|
+
React.createElement("div", { className: (openFixedSize === null || openFixedSize === void 0 ? void 0 : openFixedSize.ratio) === '1' ? 'list-content-listItem-picture' : 'list-content-listItem-picture1609' },
|
108
108
|
showVideo && (React.createElement("div", { style: { display: 'none' } },
|
109
109
|
React.createElement("video", { ref: videoDom, crossOrigin: 'anonymous', className: 'list-content-listItem-picture-img' }),
|
110
110
|
React.createElement("canvas", { ref: canvasRef }))),
|
111
|
-
React.createElement(FormatImage, { loading: 'lazy', className: 'list-content-listItem-picture-img', ref: imgDom })),
|
111
|
+
React.createElement(FormatImage, { loading: 'lazy', className: (openFixedSize === null || openFixedSize === void 0 ? void 0 : openFixedSize.ratio) === '1' ? 'list-content-listItem-picture-img' : 'list-content-listItem-picture1609-img', ref: imgDom })),
|
112
112
|
React.createElement("div", { className: 'list-content-listItem-info' },
|
113
113
|
React.createElement("div", { className: `${'list-content-listItem-info-title'} ${priceText ? 'list-content-listItem-info-nowrap' : ''}`, style: textStyles === null || textStyles === void 0 ? void 0 : textStyles.title, dangerouslySetInnerHTML: {
|
114
114
|
__html: setFontForText(title, textStyles === null || textStyles === void 0 ? void 0 : textStyles.title)
|
@@ -8,7 +8,7 @@ import List from './List';
|
|
8
8
|
import { useSxpDataSource } from '../../../../core/hooks';
|
9
9
|
import { useEventReport } from '../../../../core/hooks/useEventReport';
|
10
10
|
const WaterFall = (props) => {
|
11
|
-
var _a;
|
11
|
+
var _a, _b;
|
12
12
|
const { waterFallData, setOpenHashtag, openHashtag, swiperRef, setWaterFallData, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, setCacheRtcList, setIsFromHashtag, isFromHashtag, bffEventReport, themeTag, selectTag, bffFbReport } = useSxpDataSource();
|
13
13
|
const { backMainFeed } = useEventReport();
|
14
14
|
const modalEleRef = useRef(null);
|
@@ -97,6 +97,6 @@ const WaterFall = (props) => {
|
|
97
97
|
display: openHashtag ? 'block' : 'none'
|
98
98
|
} },
|
99
99
|
React.createElement(Navbar, { icon: left, styles: { top: '32px' }, textStyle: (_a = props === null || props === void 0 ? void 0 : props.textStyles) === null || _a === void 0 ? void 0 : _a.hashTagTitle, onClose: handleClose }),
|
100
|
-
(props === null || props === void 0 ? void 0 : props.openFixedSize) === true || (props === null || props === void 0 ? void 0 : props.openFixedSize) === undefined ? (React.createElement(List, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props))) : (React.createElement(WaterfallList, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props)))), modalEleRef.current);
|
100
|
+
((_b = props === null || props === void 0 ? void 0 : props.openFixedSize) === null || _b === void 0 ? void 0 : _b.open) === true || (props === null || props === void 0 ? void 0 : props.openFixedSize) === undefined ? (React.createElement(List, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props))) : (React.createElement(WaterfallList, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props)))), modalEleRef.current);
|
101
101
|
};
|
102
102
|
export default memo(WaterFall);
|
@@ -1,13 +1,13 @@
|
|
1
1
|
import { __awaiter } from "tslib";
|
2
2
|
import React, { createContext, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
3
3
|
import qs from 'qs';
|
4
|
+
import { cloneDeep } from 'lodash';
|
4
5
|
import { refreshFeSessionId, storeAndLoadFeSessionId } from '../utils/sessionStore';
|
5
6
|
import { storeAndLoadFeUserId, AGREE_POLICY } from '../utils/localStore';
|
6
7
|
import { useIconLink } from '../components/SxpPageRender/useIconLink';
|
7
8
|
import SXP_EVENT_BUS, { SXP_EVENT_TYPE } from '../utils/event';
|
8
9
|
import Consent from '../components/Consent';
|
9
|
-
import { getCookie } from '../utils/tool';
|
10
|
-
import { cloneDeep } from 'lodash';
|
10
|
+
import { getCookie, splitUrlParams } from '../utils/tool';
|
11
11
|
export const SxpDataSourceContext = createContext({
|
12
12
|
rtcList: [],
|
13
13
|
tagList: []
|
@@ -138,7 +138,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
138
138
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
139
139
|
}
|
140
140
|
else if (utmVal) {
|
141
|
-
const val = (_k = (_j = (_h = utmVal
|
141
|
+
const val = (_k = (_j = (_h = splitUrlParams(utmVal)) === null || _h === void 0 ? void 0 : _h.filter((val) => {
|
142
142
|
var _a, _b;
|
143
143
|
const key = val.split('=')[0];
|
144
144
|
return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
|
@@ -260,7 +260,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
260
260
|
!((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _a === void 0 ? void 0 : _a[eventName])) {
|
261
261
|
return;
|
262
262
|
}
|
263
|
-
|
263
|
+
const jsonParams = cloneDeep((_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _b === void 0 ? void 0 : _b[eventName]);
|
264
264
|
const urlParams = new URLSearchParams(window.location.search);
|
265
265
|
const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
|
266
266
|
const fix_par = {
|
@@ -341,7 +341,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
341
341
|
if (!utmVal || !isShowTag)
|
342
342
|
return;
|
343
343
|
try {
|
344
|
-
const val = (_10 = (_9 = (_8 = utmVal
|
344
|
+
const val = (_10 = (_9 = (_8 = splitUrlParams(utmVal)) === null || _8 === void 0 ? void 0 : _8.filter((val) => {
|
345
345
|
var _a, _b;
|
346
346
|
const key = val.split('=')[0];
|
347
347
|
return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
|
@@ -376,9 +376,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
376
376
|
});
|
377
377
|
}, [bffEventReport, isFromHashtag]);
|
378
378
|
const h5EnterLink = useCallback(() => {
|
379
|
-
var _a, _b;
|
379
|
+
var _a, _b, _c;
|
380
380
|
const queryString = location.search.slice(1);
|
381
|
-
const params =
|
381
|
+
const params = {};
|
382
|
+
(_a = splitUrlParams(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
383
|
+
const key = val.split('=')[0];
|
384
|
+
const value = val.split('=')[1];
|
385
|
+
params[key] = value;
|
386
|
+
});
|
382
387
|
for (const key in params) {
|
383
388
|
params[key] = params[key].replace(/%2B/g, '+');
|
384
389
|
}
|
@@ -396,7 +401,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
396
401
|
utmContent: getVal('utm_content'),
|
397
402
|
enterTime: Math.floor(time / 1000) + '',
|
398
403
|
requestId: null,
|
399
|
-
enterUrl: (
|
404
|
+
enterUrl: (_c = (_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.href) !== null && _c !== void 0 ? _c : '',
|
400
405
|
clSource: getVal('cl_source')
|
401
406
|
},
|
402
407
|
reportLayId: false
|
package/es/core/utils/tool.d.ts
CHANGED
@@ -12,4 +12,5 @@ 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
|
-
|
15
|
+
declare function splitUrlParams(urlParams: string): string[] | undefined;
|
16
|
+
export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams };
|
package/es/core/utils/tool.js
CHANGED
@@ -60,8 +60,8 @@ export const setFontForText = (textContent, style) => {
|
|
60
60
|
const cnStyle = `font-family:${cn !== null && cn !== void 0 ? cn : 'inherit'}`;
|
61
61
|
const enStyle = `font-family:${en !== null && en !== void 0 ? en : 'inherit'}`;
|
62
62
|
const fn = (str) => {
|
63
|
-
|
64
|
-
|
63
|
+
const chineseStartIndex = str.search(chineseRegex);
|
64
|
+
const englishStartIndex = str.search(englishRegex);
|
65
65
|
if (chineseStartIndex !== -1 && englishStartIndex !== -1 && chineseStartIndex < englishStartIndex) {
|
66
66
|
content += `<span style="${cnStyle}">${str.substring(chineseStartIndex, englishStartIndex)}</span>`;
|
67
67
|
text = str.substring(englishStartIndex, str === null || str === void 0 ? void 0 : str.length);
|
@@ -90,7 +90,7 @@ export const setFontForText = (textContent, style) => {
|
|
90
90
|
};
|
91
91
|
function getBrowserInfo() {
|
92
92
|
var _a, _b, _c, _d, _e, _f, _g;
|
93
|
-
|
93
|
+
const userAgent = self.navigator.userAgent;
|
94
94
|
if (!userAgent)
|
95
95
|
return null;
|
96
96
|
if (/edge\/([\d\.]+)/i.exec(userAgent))
|
@@ -111,7 +111,7 @@ function getBrowserInfo() {
|
|
111
111
|
}
|
112
112
|
function getSystem() {
|
113
113
|
var _a, _b, _c;
|
114
|
-
|
114
|
+
const userAgent = self.navigator.userAgent;
|
115
115
|
if (!userAgent)
|
116
116
|
return null;
|
117
117
|
if (/iphone/i.test(userAgent))
|
@@ -121,27 +121,27 @@ function getSystem() {
|
|
121
121
|
if (/windows/i.test(userAgent))
|
122
122
|
return `Windows ${(_c = userAgent.match(/Windows\s(.*?)\;/)) === null || _c === void 0 ? void 0 : _c[1]}`;
|
123
123
|
if (/mac/i.test(userAgent))
|
124
|
-
return
|
124
|
+
return 'Mac OS';
|
125
125
|
return null;
|
126
126
|
}
|
127
127
|
function getDevice() {
|
128
|
-
|
128
|
+
const userAgent = self.navigator.userAgent;
|
129
129
|
if (!userAgent)
|
130
130
|
return null;
|
131
131
|
if (/iphone/i.test(userAgent))
|
132
|
-
return
|
132
|
+
return 'iPhone';
|
133
133
|
if (/android/i.test(userAgent)) {
|
134
|
-
|
135
|
-
|
134
|
+
const index1 = userAgent.indexOf('(');
|
135
|
+
const index2 = userAgent.indexOf(')');
|
136
136
|
if (index1 !== -1 && index2 !== -1) {
|
137
|
-
|
137
|
+
const value = userAgent.substring(index1 + 1, index2);
|
138
138
|
return `${value}`;
|
139
139
|
}
|
140
140
|
}
|
141
141
|
if (/windows/i.test(userAgent))
|
142
|
-
return
|
142
|
+
return 'Windows';
|
143
143
|
if (/mac/i.test(userAgent))
|
144
|
-
return
|
144
|
+
return 'Mac';
|
145
145
|
return null;
|
146
146
|
}
|
147
147
|
function getCookie(val) {
|
@@ -157,7 +157,7 @@ function getCookie(val) {
|
|
157
157
|
return value !== null && value !== void 0 ? value : '';
|
158
158
|
}
|
159
159
|
function getScreenReader() {
|
160
|
-
|
160
|
+
const userAgent = self.navigator.userAgent;
|
161
161
|
if (!userAgent)
|
162
162
|
return false;
|
163
163
|
return (/TalkBack/i.test(userAgent) ||
|
@@ -167,4 +167,28 @@ function getScreenReader() {
|
|
167
167
|
/JAWS/i.test(userAgent) ||
|
168
168
|
/ChromeVox/i.test(userAgent));
|
169
169
|
}
|
170
|
-
|
170
|
+
function splitUrlParams(urlParams) {
|
171
|
+
if (!urlParams)
|
172
|
+
return;
|
173
|
+
const indList = [];
|
174
|
+
for (let i = 0; i < urlParams.length; i++) {
|
175
|
+
const item = urlParams[i];
|
176
|
+
const curStr = urlParams.substring(i + 1, urlParams.length);
|
177
|
+
if (item === '&' &&
|
178
|
+
(curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('=')) !== -1 &&
|
179
|
+
((curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('=')) < (curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('&')) || (curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('&')) === -1)) {
|
180
|
+
indList.push(i);
|
181
|
+
}
|
182
|
+
}
|
183
|
+
const splitList = indList.length > 0 ? [] : [urlParams];
|
184
|
+
let lastIndex = 0;
|
185
|
+
indList === null || indList === void 0 ? void 0 : indList.map((i) => {
|
186
|
+
splitList === null || splitList === void 0 ? void 0 : splitList.push(urlParams.substring(lastIndex, i));
|
187
|
+
lastIndex = i + 1;
|
188
|
+
if (i === indList[indList.length - 1] && i < urlParams.length) {
|
189
|
+
splitList === null || splitList === void 0 ? void 0 : splitList.push(urlParams.substring(lastIndex, urlParams.length));
|
190
|
+
}
|
191
|
+
});
|
192
|
+
return splitList !== null && splitList !== void 0 ? splitList : [];
|
193
|
+
}
|
194
|
+
export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams };
|
@@ -14,7 +14,10 @@ export interface IHashTagProps {
|
|
14
14
|
};
|
15
15
|
buttonBgStyle: CSSProperties;
|
16
16
|
showBanner?: boolean;
|
17
|
-
openFixedSize?:
|
17
|
+
openFixedSize?: {
|
18
|
+
open: true;
|
19
|
+
ratio: string;
|
20
|
+
};
|
18
21
|
}
|
19
22
|
declare const _default: React.NamedExoticComponent<IHashTagProps>;
|
20
23
|
export default _default;
|
@@ -2,14 +2,20 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
const tslib_1 = require("tslib");
|
4
4
|
const react_1 = tslib_1.__importStar(require("react"));
|
5
|
-
const qs_1 = tslib_1.__importDefault(require("qs"));
|
6
5
|
const hooks_1 = require("../../../core/hooks");
|
7
6
|
const localStore_1 = require("../../../core/utils/localStore");
|
7
|
+
const tool_1 = require("../../../core/utils/tool");
|
8
8
|
const Consent = ({ width = window.innerWidth, height = window.innerHeight, privacy_title, privacy_context, privacy_policy_url, privacy_policy_title }) => {
|
9
9
|
const { setIsAgreePolicy, bffEventReport } = (0, hooks_1.useSxpDataSource)();
|
10
10
|
const channelObj = (0, react_1.useMemo)(() => {
|
11
|
+
var _a;
|
11
12
|
const queryString = location.search.slice(1);
|
12
|
-
const params =
|
13
|
+
const params = {};
|
14
|
+
(_a = (0, tool_1.splitUrlParams)(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
15
|
+
const key = val.split('=')[0];
|
16
|
+
const value = val.split('=')[1];
|
17
|
+
params[key] = value;
|
18
|
+
});
|
13
19
|
for (const key in params) {
|
14
20
|
params[key] = params[key].replace(/%2B/g, '+');
|
15
21
|
}
|
@@ -12,7 +12,7 @@ const useEventReport_1 = require("../../../../core/hooks/useEventReport");
|
|
12
12
|
const materials_1 = require("../../../../core/utils/materials");
|
13
13
|
const WaterfallFlowItem = (props) => {
|
14
14
|
var _a;
|
15
|
-
const { rec, index, list, reportTagsView, textStyles, space } = props;
|
15
|
+
const { rec, index, list, reportTagsView, textStyles, space, openFixedSize } = props;
|
16
16
|
const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = (0, hooks_1.useSxpDataSource)();
|
17
17
|
const [showVideo, setShowVideo] = (0, react_1.useState)(false);
|
18
18
|
const imgDom = (0, react_1.useRef)(null);
|
@@ -106,11 +106,11 @@ const WaterfallFlowItem = (props) => {
|
|
106
106
|
}, 0);
|
107
107
|
};
|
108
108
|
return (react_1.default.createElement("div", { ref: ref, className: 'list-content-listItem', key: index, onClick: handleClickToDetail, style: { marginBottom: space } },
|
109
|
-
react_1.default.createElement("div", { className: 'list-content-listItem-picture' },
|
109
|
+
react_1.default.createElement("div", { className: (openFixedSize === null || openFixedSize === void 0 ? void 0 : openFixedSize.ratio) === '1' ? 'list-content-listItem-picture' : 'list-content-listItem-picture1609' },
|
110
110
|
showVideo && (react_1.default.createElement("div", { style: { display: 'none' } },
|
111
111
|
react_1.default.createElement("video", { ref: videoDom, crossOrigin: 'anonymous', className: 'list-content-listItem-picture-img' }),
|
112
112
|
react_1.default.createElement("canvas", { ref: canvasRef }))),
|
113
|
-
react_1.default.createElement(FormatImage_1.default, { loading: 'lazy', className: 'list-content-listItem-picture-img', ref: imgDom })),
|
113
|
+
react_1.default.createElement(FormatImage_1.default, { loading: 'lazy', className: (openFixedSize === null || openFixedSize === void 0 ? void 0 : openFixedSize.ratio) === '1' ? 'list-content-listItem-picture-img' : 'list-content-listItem-picture1609-img', ref: imgDom })),
|
114
114
|
react_1.default.createElement("div", { className: 'list-content-listItem-info' },
|
115
115
|
react_1.default.createElement("div", { className: `${'list-content-listItem-info-title'} ${priceText ? 'list-content-listItem-info-nowrap' : ''}`, style: textStyles === null || textStyles === void 0 ? void 0 : textStyles.title, dangerouslySetInnerHTML: {
|
116
116
|
__html: (0, tool_1.setFontForText)(title, textStyles === null || textStyles === void 0 ? void 0 : textStyles.title)
|
@@ -11,7 +11,7 @@ const List_1 = tslib_1.__importDefault(require("./List"));
|
|
11
11
|
const hooks_1 = require("../../../../core/hooks");
|
12
12
|
const useEventReport_1 = require("../../../../core/hooks/useEventReport");
|
13
13
|
const WaterFall = (props) => {
|
14
|
-
var _a;
|
14
|
+
var _a, _b;
|
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
17
|
const modalEleRef = (0, react_1.useRef)(null);
|
@@ -100,6 +100,6 @@ const WaterFall = (props) => {
|
|
100
100
|
display: openHashtag ? 'block' : 'none'
|
101
101
|
} },
|
102
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 }),
|
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);
|
103
|
+
((_b = props === null || props === void 0 ? void 0 : props.openFixedSize) === null || _b === void 0 ? void 0 : _b.open) === 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);
|
104
104
|
};
|
105
105
|
exports.default = (0, react_1.memo)(WaterFall);
|
@@ -4,13 +4,13 @@ exports.DEFAULT_TAG = exports.SxpDataSourceContext = void 0;
|
|
4
4
|
const tslib_1 = require("tslib");
|
5
5
|
const react_1 = tslib_1.__importStar(require("react"));
|
6
6
|
const qs_1 = tslib_1.__importDefault(require("qs"));
|
7
|
+
const lodash_1 = require("lodash");
|
7
8
|
const sessionStore_1 = require("../utils/sessionStore");
|
8
9
|
const localStore_1 = require("../utils/localStore");
|
9
10
|
const useIconLink_1 = require("../components/SxpPageRender/useIconLink");
|
10
11
|
const event_1 = tslib_1.__importStar(require("../utils/event"));
|
11
12
|
const Consent_1 = tslib_1.__importDefault(require("../components/Consent"));
|
12
13
|
const tool_1 = require("../utils/tool");
|
13
|
-
const lodash_1 = require("lodash");
|
14
14
|
exports.SxpDataSourceContext = (0, react_1.createContext)({
|
15
15
|
rtcList: [],
|
16
16
|
tagList: []
|
@@ -141,7 +141,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
141
141
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
142
142
|
}
|
143
143
|
else if (utmVal) {
|
144
|
-
const val = (_k = (_j = (_h =
|
144
|
+
const val = (_k = (_j = (_h = (0, tool_1.splitUrlParams)(utmVal)) === null || _h === void 0 ? void 0 : _h.filter((val) => {
|
145
145
|
var _a, _b;
|
146
146
|
const key = val.split('=')[0];
|
147
147
|
return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
|
@@ -263,7 +263,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
263
263
|
!((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _a === void 0 ? void 0 : _a[eventName])) {
|
264
264
|
return;
|
265
265
|
}
|
266
|
-
|
266
|
+
const jsonParams = (0, lodash_1.cloneDeep)((_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _b === void 0 ? void 0 : _b[eventName]);
|
267
267
|
const urlParams = new URLSearchParams(window.location.search);
|
268
268
|
const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
|
269
269
|
const fix_par = {
|
@@ -344,7 +344,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
344
344
|
if (!utmVal || !isShowTag)
|
345
345
|
return;
|
346
346
|
try {
|
347
|
-
const val = (_10 = (_9 = (_8 =
|
347
|
+
const val = (_10 = (_9 = (_8 = (0, tool_1.splitUrlParams)(utmVal)) === null || _8 === void 0 ? void 0 : _8.filter((val) => {
|
348
348
|
var _a, _b;
|
349
349
|
const key = val.split('=')[0];
|
350
350
|
return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
|
@@ -379,9 +379,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
379
379
|
});
|
380
380
|
}, [bffEventReport, isFromHashtag]);
|
381
381
|
const h5EnterLink = (0, react_1.useCallback)(() => {
|
382
|
-
var _a, _b;
|
382
|
+
var _a, _b, _c;
|
383
383
|
const queryString = location.search.slice(1);
|
384
|
-
const params =
|
384
|
+
const params = {};
|
385
|
+
(_a = (0, tool_1.splitUrlParams)(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
386
|
+
const key = val.split('=')[0];
|
387
|
+
const value = val.split('=')[1];
|
388
|
+
params[key] = value;
|
389
|
+
});
|
385
390
|
for (const key in params) {
|
386
391
|
params[key] = params[key].replace(/%2B/g, '+');
|
387
392
|
}
|
@@ -399,7 +404,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
399
404
|
utmContent: getVal('utm_content'),
|
400
405
|
enterTime: Math.floor(time / 1000) + '',
|
401
406
|
requestId: null,
|
402
|
-
enterUrl: (
|
407
|
+
enterUrl: (_c = (_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.href) !== null && _c !== void 0 ? _c : '',
|
403
408
|
clSource: getVal('cl_source')
|
404
409
|
},
|
405
410
|
reportLayId: false
|
package/lib/core/utils/tool.d.ts
CHANGED
@@ -12,4 +12,5 @@ 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
|
-
|
15
|
+
declare function splitUrlParams(urlParams: string): string[] | undefined;
|
16
|
+
export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams };
|
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.getScreenReader = exports.getCookie = exports.getSystem = exports.getDevice = exports.getBrowserInfo = exports.getIndexByblockType = exports.uuid = exports.setFontForText = exports.getUid = exports.generateRandomString = void 0;
|
3
|
+
exports.splitUrlParams = 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('');
|
@@ -67,8 +67,8 @@ const setFontForText = (textContent, style) => {
|
|
67
67
|
const cnStyle = `font-family:${cn !== null && cn !== void 0 ? cn : 'inherit'}`;
|
68
68
|
const enStyle = `font-family:${en !== null && en !== void 0 ? en : 'inherit'}`;
|
69
69
|
const fn = (str) => {
|
70
|
-
|
71
|
-
|
70
|
+
const chineseStartIndex = str.search(chineseRegex);
|
71
|
+
const englishStartIndex = str.search(englishRegex);
|
72
72
|
if (chineseStartIndex !== -1 && englishStartIndex !== -1 && chineseStartIndex < englishStartIndex) {
|
73
73
|
content += `<span style="${cnStyle}">${str.substring(chineseStartIndex, englishStartIndex)}</span>`;
|
74
74
|
text = str.substring(englishStartIndex, str === null || str === void 0 ? void 0 : str.length);
|
@@ -98,7 +98,7 @@ const setFontForText = (textContent, style) => {
|
|
98
98
|
exports.setFontForText = setFontForText;
|
99
99
|
function getBrowserInfo() {
|
100
100
|
var _a, _b, _c, _d, _e, _f, _g;
|
101
|
-
|
101
|
+
const userAgent = self.navigator.userAgent;
|
102
102
|
if (!userAgent)
|
103
103
|
return null;
|
104
104
|
if (/edge\/([\d\.]+)/i.exec(userAgent))
|
@@ -120,7 +120,7 @@ function getBrowserInfo() {
|
|
120
120
|
exports.getBrowserInfo = getBrowserInfo;
|
121
121
|
function getSystem() {
|
122
122
|
var _a, _b, _c;
|
123
|
-
|
123
|
+
const userAgent = self.navigator.userAgent;
|
124
124
|
if (!userAgent)
|
125
125
|
return null;
|
126
126
|
if (/iphone/i.test(userAgent))
|
@@ -130,28 +130,28 @@ function getSystem() {
|
|
130
130
|
if (/windows/i.test(userAgent))
|
131
131
|
return `Windows ${(_c = userAgent.match(/Windows\s(.*?)\;/)) === null || _c === void 0 ? void 0 : _c[1]}`;
|
132
132
|
if (/mac/i.test(userAgent))
|
133
|
-
return
|
133
|
+
return 'Mac OS';
|
134
134
|
return null;
|
135
135
|
}
|
136
136
|
exports.getSystem = getSystem;
|
137
137
|
function getDevice() {
|
138
|
-
|
138
|
+
const userAgent = self.navigator.userAgent;
|
139
139
|
if (!userAgent)
|
140
140
|
return null;
|
141
141
|
if (/iphone/i.test(userAgent))
|
142
|
-
return
|
142
|
+
return 'iPhone';
|
143
143
|
if (/android/i.test(userAgent)) {
|
144
|
-
|
145
|
-
|
144
|
+
const index1 = userAgent.indexOf('(');
|
145
|
+
const index2 = userAgent.indexOf(')');
|
146
146
|
if (index1 !== -1 && index2 !== -1) {
|
147
|
-
|
147
|
+
const value = userAgent.substring(index1 + 1, index2);
|
148
148
|
return `${value}`;
|
149
149
|
}
|
150
150
|
}
|
151
151
|
if (/windows/i.test(userAgent))
|
152
|
-
return
|
152
|
+
return 'Windows';
|
153
153
|
if (/mac/i.test(userAgent))
|
154
|
-
return
|
154
|
+
return 'Mac';
|
155
155
|
return null;
|
156
156
|
}
|
157
157
|
exports.getDevice = getDevice;
|
@@ -169,7 +169,7 @@ function getCookie(val) {
|
|
169
169
|
}
|
170
170
|
exports.getCookie = getCookie;
|
171
171
|
function getScreenReader() {
|
172
|
-
|
172
|
+
const userAgent = self.navigator.userAgent;
|
173
173
|
if (!userAgent)
|
174
174
|
return false;
|
175
175
|
return (/TalkBack/i.test(userAgent) ||
|
@@ -180,3 +180,28 @@ function getScreenReader() {
|
|
180
180
|
/ChromeVox/i.test(userAgent));
|
181
181
|
}
|
182
182
|
exports.getScreenReader = getScreenReader;
|
183
|
+
function splitUrlParams(urlParams) {
|
184
|
+
if (!urlParams)
|
185
|
+
return;
|
186
|
+
const indList = [];
|
187
|
+
for (let i = 0; i < urlParams.length; i++) {
|
188
|
+
const item = urlParams[i];
|
189
|
+
const curStr = urlParams.substring(i + 1, urlParams.length);
|
190
|
+
if (item === '&' &&
|
191
|
+
(curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('=')) !== -1 &&
|
192
|
+
((curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('=')) < (curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('&')) || (curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('&')) === -1)) {
|
193
|
+
indList.push(i);
|
194
|
+
}
|
195
|
+
}
|
196
|
+
const splitList = indList.length > 0 ? [] : [urlParams];
|
197
|
+
let lastIndex = 0;
|
198
|
+
indList === null || indList === void 0 ? void 0 : indList.map((i) => {
|
199
|
+
splitList === null || splitList === void 0 ? void 0 : splitList.push(urlParams.substring(lastIndex, i));
|
200
|
+
lastIndex = i + 1;
|
201
|
+
if (i === indList[indList.length - 1] && i < urlParams.length) {
|
202
|
+
splitList === null || splitList === void 0 ? void 0 : splitList.push(urlParams.substring(lastIndex, urlParams.length));
|
203
|
+
}
|
204
|
+
});
|
205
|
+
return splitList !== null && splitList !== void 0 ? splitList : [];
|
206
|
+
}
|
207
|
+
exports.splitUrlParams = splitUrlParams;
|
@@ -14,7 +14,10 @@ export interface IHashTagProps {
|
|
14
14
|
};
|
15
15
|
buttonBgStyle: CSSProperties;
|
16
16
|
showBanner?: boolean;
|
17
|
-
openFixedSize?:
|
17
|
+
openFixedSize?: {
|
18
|
+
open: true;
|
19
|
+
ratio: string;
|
20
|
+
};
|
18
21
|
}
|
19
22
|
declare const _default: React.NamedExoticComponent<IHashTagProps>;
|
20
23
|
export default _default;
|