pb-sxp-ui 14.0.3 → 14.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +470 -810
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +0 -89
- package/dist/index.js +470 -810
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +6 -6
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +6 -6
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +470 -810
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +6 -6
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/Consent/index.js +8 -2
- package/es/core/components/SxpPageRender/ConsentPopup.js +8 -8
- package/es/core/components/SxpPageRender/Navbar.js +1 -1
- package/es/core/components/SxpPageRender/WaterFall/preview.json +272 -207
- package/es/core/components/SxpPageRender/index.js +2 -5
- package/es/core/context/SxpDataSourceProvider.js +33 -53
- package/es/core/utils/materials.js +3 -5
- package/es/core/utils/tool.d.ts +2 -1
- package/es/core/utils/tool.js +38 -14
- package/es/materials/sxp/consentPopup/Display/index.d.ts +2 -2
- package/es/materials/sxp/consentPopup/Display/index.js +5 -7
- package/es/materials/sxp/consentPopup/index.d.ts +0 -2
- package/es/materials/sxp/consentPopup/index.js +0 -2
- package/es/materials/sxp/cta/AniLink/index.js +1 -1
- package/es/materials/sxp/cta/AniLinkPopup/index.js +1 -1
- package/es/materials/sxp/popup/ConsentDetail/index.d.ts +1 -2
- package/es/materials/sxp/popup/ConsentDetail/index.js +2 -2
- package/es/materials/sxp/popup/Iframe/index.d.ts +4 -0
- package/es/materials/sxp/popup/Iframe/index.js +5 -4
- package/es/materials/sxp/popup/Iframe/settingRender.js +15 -0
- package/lib/core/components/Consent/index.js +8 -2
- package/lib/core/components/SxpPageRender/ConsentPopup.js +7 -7
- package/lib/core/components/SxpPageRender/Navbar.js +1 -1
- package/lib/core/components/SxpPageRender/WaterFall/preview.json +272 -207
- package/lib/core/components/SxpPageRender/index.js +2 -5
- package/lib/core/context/SxpDataSourceProvider.js +32 -52
- package/lib/core/utils/materials.js +3 -5
- package/lib/core/utils/tool.d.ts +2 -1
- package/lib/core/utils/tool.js +39 -14
- package/lib/materials/sxp/consentPopup/Display/index.d.ts +2 -2
- package/lib/materials/sxp/consentPopup/Display/index.js +5 -7
- package/lib/materials/sxp/consentPopup/index.d.ts +0 -2
- package/lib/materials/sxp/consentPopup/index.js +0 -2
- package/lib/materials/sxp/cta/AniLink/index.js +1 -1
- package/lib/materials/sxp/cta/AniLinkPopup/index.js +1 -1
- package/lib/materials/sxp/popup/ConsentDetail/index.d.ts +1 -2
- package/lib/materials/sxp/popup/ConsentDetail/index.js +2 -2
- package/lib/materials/sxp/popup/Iframe/index.d.ts +4 -0
- package/lib/materials/sxp/popup/Iframe/index.js +5 -4
- package/lib/materials/sxp/popup/Iframe/settingRender.js +15 -0
- package/package.json +1 -1
- package/es/materials/sxp/consentPopup/Click/index.d.ts +0 -19
- package/es/materials/sxp/consentPopup/Click/index.js +0 -19
- package/es/materials/sxp/consentPopup/Click/material.d.ts +0 -2
- package/es/materials/sxp/consentPopup/Click/material.js +0 -48
- package/es/materials/sxp/consentPopup/Click/settingRender.d.ts +0 -63
- package/es/materials/sxp/consentPopup/Click/settingRender.js +0 -210
- package/es/materials/sxp/consentPopup/Swipe/index.d.ts +0 -12
- package/es/materials/sxp/consentPopup/Swipe/index.js +0 -44
- package/es/materials/sxp/consentPopup/Swipe/material.d.ts +0 -2
- package/es/materials/sxp/consentPopup/Swipe/material.js +0 -24
- package/es/materials/sxp/consentPopup/Swipe/settingRender.d.ts +0 -29
- package/es/materials/sxp/consentPopup/Swipe/settingRender.js +0 -43
- package/lib/materials/sxp/consentPopup/Click/index.d.ts +0 -19
- package/lib/materials/sxp/consentPopup/Click/index.js +0 -21
- package/lib/materials/sxp/consentPopup/Click/material.d.ts +0 -2
- package/lib/materials/sxp/consentPopup/Click/material.js +0 -52
- package/lib/materials/sxp/consentPopup/Click/settingRender.d.ts +0 -63
- package/lib/materials/sxp/consentPopup/Click/settingRender.js +0 -212
- package/lib/materials/sxp/consentPopup/Swipe/index.d.ts +0 -12
- package/lib/materials/sxp/consentPopup/Swipe/index.js +0 -46
- package/lib/materials/sxp/consentPopup/Swipe/material.d.ts +0 -2
- package/lib/materials/sxp/consentPopup/Swipe/material.js +0 -28
- package/lib/materials/sxp/consentPopup/Swipe/settingRender.d.ts +0 -29
- package/lib/materials/sxp/consentPopup/Swipe/settingRender.js +0 -45
@@ -120,7 +120,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
120
120
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
121
121
|
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
122
122
|
position: activeIndex + '',
|
123
|
-
fromKName: fk
|
123
|
+
fromKName: fk ? fk : fromKName,
|
124
124
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
125
125
|
ctatId: (_r = (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.bindCta) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
126
126
|
traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
|
@@ -147,12 +147,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
147
147
|
setIsReload(new Date().getTime());
|
148
148
|
skipLinkRef.current = false;
|
149
149
|
}
|
150
|
-
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false);
|
151
150
|
handleH5EnterLink();
|
152
151
|
if (repCond) {
|
153
|
-
|
154
|
-
event_1.default.emit(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
|
155
|
-
});
|
152
|
+
event_1.default.emit(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
|
156
153
|
backMainFeed('external', selectTag);
|
157
154
|
}
|
158
155
|
}
|
@@ -102,32 +102,29 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
102
102
|
const bffDataSource = (0, react_1.useMemo)(() => {
|
103
103
|
return dataSources === null || dataSources === void 0 ? void 0 : dataSources.find((d) => d.type === DataSourceType.BFF);
|
104
104
|
}, [dataSources]);
|
105
|
-
const fakeUserId = (0, react_1.useMemo)(() => {
|
106
|
-
var _a;
|
107
|
-
return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + (0, localStore_1.storeAndLoadFeUserId)();
|
108
|
-
}, [bffDataSource]);
|
109
105
|
const bffFetch = (0, react_1.useCallback)((path, options) => {
|
110
106
|
if (!bffDataSource)
|
111
107
|
return;
|
112
108
|
const url = bffDataSource.url;
|
109
|
+
const fakeUserId = (0, localStore_1.storeAndLoadFeUserId)();
|
113
110
|
if (options === null || options === void 0 ? void 0 : options.query) {
|
114
111
|
const queryString = qs_1.default.stringify(options.query);
|
115
112
|
path = `${path}?${queryString}`;
|
116
113
|
}
|
117
114
|
if (options.type === 'beacon' && navigator.sendBeacon) {
|
118
|
-
return navigator.sendBeacon(`${url}/api
|
115
|
+
return navigator.sendBeacon(`${url}/api/v1${path}`, new Blob([
|
119
116
|
JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))
|
120
117
|
], { type: 'application/json;charset=UTF-8' }));
|
121
118
|
}
|
122
119
|
return window
|
123
|
-
.fetch(`${url}/api
|
120
|
+
.fetch(`${url}/api/v1${path}`, {
|
124
121
|
headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers),
|
125
122
|
method: options.method,
|
126
123
|
body: JSON.stringify(options.body)
|
127
124
|
})
|
128
125
|
.then((res) => res.json())
|
129
126
|
.catch((err) => Promise.reject(err));
|
130
|
-
}, [bffDataSource
|
127
|
+
}, [bffDataSource]);
|
131
128
|
const getRecommendVideos = (0, react_1.useCallback)((query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
132
129
|
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
133
130
|
query = {
|
@@ -144,7 +141,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
144
141
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
145
142
|
}
|
146
143
|
else if (utmVal) {
|
147
|
-
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) => {
|
148
145
|
var _a, _b;
|
149
146
|
const key = val.split('=')[0];
|
150
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);
|
@@ -164,16 +161,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
164
161
|
const recurveRecList = (query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
165
162
|
var _v, _w, _x, _y, _z, _0;
|
166
163
|
query.pageNum = pageNum;
|
167
|
-
result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
164
|
+
result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
|
168
165
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
169
166
|
return undefined;
|
170
167
|
}
|
171
168
|
setLoading(false);
|
172
169
|
list = list.concat((_y = (_x = (_w = (_v = result === null || result === void 0 ? void 0 : result.data) === null || _v === void 0 ? void 0 : _v.recList) === null || _w === void 0 ? void 0 : _w.filter) === null || _x === void 0 ? void 0 : _x.call(_w, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _y !== void 0 ? _y : []);
|
173
|
-
|
174
|
-
|
175
|
-
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
176
|
-
}
|
170
|
+
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result.data), { recList: list })));
|
171
|
+
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result.data), { recList: list })));
|
177
172
|
const isNotNullList = (_0 = (_z = result === null || result === void 0 ? void 0 : result.data) === null || _z === void 0 ? void 0 : _z.recList) === null || _0 === void 0 ? void 0 : _0.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
|
178
173
|
if (isNotNullList) {
|
179
174
|
pageNum = pageNum + 1;
|
@@ -183,12 +178,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
183
178
|
yield recurveRecList(query);
|
184
179
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
|
185
180
|
setCurReqInfo({ rtc: (_l = result === null || result === void 0 ? void 0 : result.data) === null || _l === void 0 ? void 0 : _l.rtc, requestId: (_m = result === null || result === void 0 ? void 0 : result.data) === null || _m === void 0 ? void 0 : _m.requestId });
|
186
|
-
return Object.assign(Object.assign({}, result
|
181
|
+
return Object.assign(Object.assign({}, result.data), { recList: list });
|
187
182
|
}
|
188
183
|
if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
|
189
184
|
query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (_o = query === null || query === void 0 ? void 0 : query.pageNum) !== null && _o !== void 0 ? _o : 1 });
|
190
185
|
}
|
191
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
186
|
+
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
|
192
187
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
193
188
|
return undefined;
|
194
189
|
}
|
@@ -238,7 +233,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
238
233
|
return expire;
|
239
234
|
}, [data]);
|
240
235
|
const bffEventReport = (0, react_1.useCallback)(({ userInfo, eventInfo, reportLayId = true }) => {
|
241
|
-
var _a, _b;
|
242
236
|
if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
|
243
237
|
return;
|
244
238
|
}
|
@@ -246,9 +240,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
246
240
|
userInfo = {};
|
247
241
|
}
|
248
242
|
const sessionID = (0, sessionStore_1.storeAndLoadFeSessionId)();
|
249
|
-
const
|
250
|
-
const cl_source = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('cl_source');
|
251
|
-
const ef = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, { playbookType }), (layoutVariantId && reportLayId && { layoutVariantId })), eventInfo), ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) && channel && { position: Number(eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) + 1 + '' })), (cl_source && { cl_source }));
|
243
|
+
const ef = Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, { playbookType }), (layoutVariantId && reportLayId && { layoutVariantId })), eventInfo), ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) && channel && { position: Number(eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) + 1 + '' }));
|
252
244
|
const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
|
253
245
|
const realEventInfo = Object.entries(ef)
|
254
246
|
.map(([k, v]) => v && { name: k, value: v })
|
@@ -257,23 +249,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
257
249
|
console.log('userInfo:', userInfo);
|
258
250
|
console.log('eventInfo:', ef);
|
259
251
|
console.log('========= 结束 =========');
|
260
|
-
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(
|
252
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/event/report', {
|
261
253
|
method: 'POST',
|
262
254
|
body: { userInfo: realUserInfo, eventInfo: realEventInfo },
|
263
255
|
type: 'beacon'
|
264
256
|
});
|
265
|
-
}, [
|
266
|
-
bffFetch,
|
267
|
-
curReqInfo,
|
268
|
-
enableReportEvent,
|
269
|
-
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
270
|
-
layoutVariantId,
|
271
|
-
globalConfig,
|
272
|
-
playbookType,
|
273
|
-
bffDataSource
|
274
|
-
]);
|
257
|
+
}, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, layoutVariantId, globalConfig, playbookType]);
|
275
258
|
const bffFbReport = (0, react_1.useCallback)(({ eventName, product }) => {
|
276
|
-
var _a, _b, _c, _d, _e
|
259
|
+
var _a, _b, _c, _d, _e;
|
277
260
|
if (!enableReportEvent ||
|
278
261
|
!enabledMetaConversionApi ||
|
279
262
|
(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) ||
|
@@ -285,7 +268,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
285
268
|
const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
|
286
269
|
const fix_par = {
|
287
270
|
event_source_url: (_c = window === null || window === void 0 ? void 0 : window.location) === null || _c === void 0 ? void 0 : _c.href,
|
288
|
-
external_id:
|
271
|
+
external_id: (0, localStore_1.storeAndLoadFeUserId)(),
|
289
272
|
client_user_agent: (_e = (_d = window === null || window === void 0 ? void 0 : window.navigator) === null || _d === void 0 ? void 0 : _d.userAgent) !== null && _e !== void 0 ? _e : '',
|
290
273
|
fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
|
291
274
|
fbp: (0, tool_1.getCookie)('_fbp') ? `fb.2.${new Date().getTime()}.${(0, tool_1.getCookie)('_fbp')}` : '',
|
@@ -337,30 +320,22 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
337
320
|
}
|
338
321
|
};
|
339
322
|
getEventParams(jsonParams);
|
340
|
-
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(
|
323
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/fb/events', {
|
341
324
|
method: 'POST',
|
342
325
|
body: jsonParams,
|
343
326
|
type: 'beacon'
|
344
327
|
});
|
345
|
-
}, [
|
346
|
-
bffFetch,
|
347
|
-
enableReportEvent,
|
348
|
-
enabledMetaConversionApi,
|
349
|
-
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
350
|
-
globalConfig,
|
351
|
-
fakeUserId,
|
352
|
-
bffDataSource
|
353
|
-
]);
|
328
|
+
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, globalConfig]);
|
354
329
|
const bffMutateLike = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
355
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
330
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/like', { method: 'POST', body }));
|
356
331
|
return res === null || res === void 0 ? void 0 : res.success;
|
357
332
|
}), [bffFetch]);
|
358
333
|
const bffMutateUnlike = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
359
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
334
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/unlike', { method: 'POST', body }));
|
360
335
|
return res === null || res === void 0 ? void 0 : res.success;
|
361
336
|
}), [bffFetch]);
|
362
337
|
const bffSubmitForm = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
363
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
338
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/customform', { method: 'POST', body }));
|
364
339
|
return res === null || res === void 0 ? void 0 : res.success;
|
365
340
|
}), [bffFetch]);
|
366
341
|
const bffGetTagList = (0, react_1.useCallback)((data) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
@@ -369,12 +344,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
369
344
|
if (!utmVal || !isShowTag)
|
370
345
|
return;
|
371
346
|
try {
|
372
|
-
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) => {
|
373
348
|
var _a, _b;
|
374
349
|
const key = val.split('=')[0];
|
375
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);
|
376
351
|
})) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
|
377
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
352
|
+
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
378
353
|
setTagList((_12 = (_11 = result === null || result === void 0 ? void 0 : result.data) === null || _11 === void 0 ? void 0 : _11.tags) !== null && _12 !== void 0 ? _12 : []);
|
379
354
|
}
|
380
355
|
catch (e) {
|
@@ -404,9 +379,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
404
379
|
});
|
405
380
|
}, [bffEventReport, isFromHashtag]);
|
406
381
|
const h5EnterLink = (0, react_1.useCallback)(() => {
|
407
|
-
var _a, _b;
|
382
|
+
var _a, _b, _c;
|
408
383
|
const queryString = location.search.slice(1);
|
409
|
-
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
|
+
});
|
410
390
|
for (const key in params) {
|
411
391
|
params[key] = params[key].replace(/%2B/g, '+');
|
412
392
|
}
|
@@ -424,7 +404,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
424
404
|
utmContent: getVal('utm_content'),
|
425
405
|
enterTime: Math.floor(time / 1000) + '',
|
426
406
|
requestId: null,
|
427
|
-
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 : '',
|
428
408
|
clSource: getVal('cl_source')
|
429
409
|
},
|
430
410
|
reportLayId: false
|
@@ -448,10 +428,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
448
428
|
let curData;
|
449
429
|
let gldata;
|
450
430
|
if (data === null || data === void 0 ? void 0 : data.layoutVariantId) {
|
451
|
-
layId = data === null || data === void 0 ? void 0 : data.layoutVariantId;
|
452
|
-
setLayoutVariantId(data === null || data === void 0 ? void 0 : data.layoutVariantId);
|
453
431
|
const id = (_b = (_a = data === null || data === void 0 ? void 0 : data.layoutVariantId) === null || _a === void 0 ? void 0 : _a.split('-')) === null || _b === void 0 ? void 0 : _b[1];
|
454
432
|
if (id) {
|
433
|
+
layId = id;
|
434
|
+
setLayoutVariantId(id);
|
455
435
|
curData = dataList === null || dataList === void 0 ? void 0 : dataList.find((item) => (item === null || item === void 0 ? void 0 : item.id) === id);
|
456
436
|
if (curData) {
|
457
437
|
setPageData(curData);
|
@@ -38,16 +38,14 @@ const getBgStyleByImg = (data) => {
|
|
38
38
|
exports.getBgStyleByImg = getBgStyleByImg;
|
39
39
|
const getPriceText = ({ product, enableFormattedPrice, globalConfig, isHiddenDef, style }) => {
|
40
40
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
41
|
-
let text = '';
|
42
41
|
if ((!(product === null || product === void 0 ? void 0 : product.currency) || !(product === null || product === void 0 ? void 0 : product.price)) && isHiddenDef)
|
43
42
|
return null;
|
44
|
-
let price =
|
45
|
-
|
46
|
-
return text;
|
43
|
+
let price = (product === null || product === void 0 ? void 0 : product.currency) && (product === null || product === void 0 ? void 0 : product.price) ? product === null || product === void 0 ? void 0 : product.price : 7000;
|
44
|
+
let text = '';
|
47
45
|
let priceSymbol = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.priceSymbol;
|
48
46
|
let currency = (product === null || product === void 0 ? void 0 : product.currency) ? (_c = (_b = (_a = product === null || product === void 0 ? void 0 : product.currency) === null || _a === void 0 ? void 0 : _a.split('-')[1]) === null || _b === void 0 ? void 0 : _b.toUpperCase()) !== null && _c !== void 0 ? _c : '' : '$';
|
49
47
|
const isToLocStr = enableFormattedPrice === undefined || enableFormattedPrice;
|
50
|
-
let decPic = price
|
48
|
+
let decPic = price.toString();
|
51
49
|
if (priceSymbol === null || priceSymbol === void 0 ? void 0 : priceSymbol.showTwoDecimalPoint) {
|
52
50
|
decPic = price === null || price === void 0 ? void 0 : price.toFixed(2);
|
53
51
|
}
|
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;
|
@@ -13,9 +13,9 @@ export interface IDisplayProps {
|
|
13
13
|
};
|
14
14
|
style?: Record<string, any>;
|
15
15
|
isTel?: boolean;
|
16
|
-
isShowClose?: boolean;
|
17
|
-
consentPopupCate?: string;
|
18
16
|
onClick?: () => void;
|
17
|
+
contsentState?: boolean;
|
18
|
+
isShowClose?: boolean;
|
19
19
|
}
|
20
20
|
declare const _default: React.NamedExoticComponent<IDisplayProps>;
|
21
21
|
export default _default;
|
@@ -3,20 +3,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
const tslib_1 = require("tslib");
|
4
4
|
const react_1 = tslib_1.__importStar(require("react"));
|
5
5
|
require("./index.less");
|
6
|
+
const EditorDataProvider_1 = require("../../../../core/context/EditorDataProvider");
|
6
7
|
const close_svg_1 = tslib_1.__importDefault(require("./close.svg"));
|
7
8
|
const tel_png_1 = tslib_1.__importDefault(require("./tel.png"));
|
8
9
|
const tool_1 = require("../../../../core/utils/tool");
|
9
|
-
const localStore_1 = require("../../../../core/utils/localStore");
|
10
10
|
const Display = (_a) => {
|
11
11
|
var _b, _c;
|
12
|
-
var { isTel, isShowOnce, open, content, interaction, style, onClick,
|
12
|
+
var { isTel, isShowOnce, open, content, interaction, style, onClick, contsentState, isShowClose } = _a, props = tslib_1.__rest(_a, ["isTel", "isShowOnce", "open", "content", "interaction", "style", "onClick", "contsentState", "isShowClose"]);
|
13
|
+
const { consentPopupCate } = (0, EditorDataProvider_1.useEditorDataProvider)();
|
13
14
|
const [isClose, setIsClose] = (0, react_1.useState)(false);
|
14
|
-
const contsentState = (0, react_1.useMemo)(() => {
|
15
|
-
return (0, localStore_1.getContsentState)();
|
16
|
-
}, []);
|
17
15
|
const visivle = (0, react_1.useMemo)(() => {
|
18
|
-
return consentPopupCate || (open && (isShowOnce || contsentState) && style && !isClose);
|
19
|
-
}, [consentPopupCate, open, isClose
|
16
|
+
return consentPopupCate === 'Display' || (open && (isShowOnce || contsentState) && style && !isClose);
|
17
|
+
}, [consentPopupCate, open, isClose]);
|
20
18
|
const handleClickClose = (0, react_1.useCallback)(() => {
|
21
19
|
setIsClose(true);
|
22
20
|
}, []);
|
@@ -2,5 +2,3 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
const tslib_1 = require("tslib");
|
4
4
|
tslib_1.__exportStar(require("./Display/material"), exports);
|
5
|
-
tslib_1.__exportStar(require("./Click/material"), exports);
|
6
|
-
tslib_1.__exportStar(require("./Swipe/material"), exports);
|
@@ -37,7 +37,7 @@ const AniLink = (_a) => {
|
|
37
37
|
onClick === null || onClick === void 0 ? void 0 : onClick();
|
38
38
|
}
|
39
39
|
};
|
40
|
-
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '
|
40
|
+
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
|
41
41
|
const aniTimStyle = (0, react_1.useMemo)(() => {
|
42
42
|
var _a, _b;
|
43
43
|
const ani = event === null || event === void 0 ? void 0 : event.animation;
|
@@ -37,7 +37,7 @@ const AniLinkPopup = (_a) => {
|
|
37
37
|
onClick === null || onClick === void 0 ? void 0 : onClick();
|
38
38
|
}
|
39
39
|
};
|
40
|
-
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '
|
40
|
+
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
|
41
41
|
const aniTimStyle = (0, react_1.useMemo)(() => {
|
42
42
|
const ani = event === null || event === void 0 ? void 0 : event.animation;
|
43
43
|
if (ani) {
|
@@ -1,9 +1,8 @@
|
|
1
|
-
import React
|
1
|
+
import React from 'react';
|
2
2
|
import './index.less';
|
3
3
|
export interface IConsentDetailProps {
|
4
4
|
content?: string;
|
5
5
|
isTel?: boolean;
|
6
|
-
style?: CSSProperties;
|
7
6
|
}
|
8
7
|
declare const _default: React.NamedExoticComponent<IConsentDetailProps>;
|
9
8
|
export default _default;
|
@@ -4,11 +4,11 @@ const tslib_1 = require("tslib");
|
|
4
4
|
const react_1 = tslib_1.__importStar(require("react"));
|
5
5
|
require("./index.less");
|
6
6
|
const ConsentDetail = (_a) => {
|
7
|
-
var { content, isTel
|
7
|
+
var { content, isTel } = _a, props = tslib_1.__rest(_a, ["content", "isTel"]);
|
8
8
|
return (react_1.default.createElement("article", { className: 'consentDetail-article', dangerouslySetInnerHTML: {
|
9
9
|
__html: typeof content === 'string' ? content : ''
|
10
10
|
}, onClick: (e) => {
|
11
11
|
e.stopPropagation();
|
12
|
-
}
|
12
|
+
} }));
|
13
13
|
};
|
14
14
|
exports.default = (0, react_1.memo)(ConsentDetail);
|
@@ -12,6 +12,10 @@ export interface IIframeProps {
|
|
12
12
|
submitButtonStyle?: CSSProperties;
|
13
13
|
contentStyle?: CSSProperties;
|
14
14
|
isTel?: boolean;
|
15
|
+
iframe?: {
|
16
|
+
src?: string;
|
17
|
+
allow?: string;
|
18
|
+
};
|
15
19
|
}
|
16
20
|
declare const _default: React.NamedExoticComponent<IIframeProps>;
|
17
21
|
export default _default;
|
@@ -7,11 +7,12 @@ require("./index.less");
|
|
7
7
|
const hooks_1 = require("../../../../core/hooks");
|
8
8
|
const Iframe = (_a) => {
|
9
9
|
var _b, _c;
|
10
|
-
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle, contentStyle, isTel } = _a, props = tslib_1.__rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle", "contentStyle", "isTel"]);
|
10
|
+
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle, contentStyle, isTel, iframe } = _a, props = tslib_1.__rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle", "contentStyle", "isTel", "iframe"]);
|
11
11
|
const { popupDetailData } = (0, hooks_1.useSxpDataSource)();
|
12
|
-
const
|
13
|
-
|
14
|
-
|
12
|
+
const { src, allow } = iframe || {};
|
13
|
+
const iframeUrl = src || ((_c = (_b = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.video) === null || _b === void 0 ? void 0 : _b.bindCta) === null || _c === void 0 ? void 0 : _c.remark);
|
14
|
+
return (react_1.default.createElement("div", Object.assign({ className: `${(0, css_1.css)(Object.assign(Object.assign({}, style), { overflow: 'hidden' }))}` }, props),
|
15
|
+
react_1.default.createElement("iframe", { src: iframeUrl, allow: allow, scrolling: 'no', style: {
|
15
16
|
width: '100%',
|
16
17
|
height: 'calc(100% - 50px)',
|
17
18
|
marginTop: '50px',
|
@@ -10,5 +10,20 @@ exports.default = [
|
|
10
10
|
name: ['style', 'backgroundColor']
|
11
11
|
}
|
12
12
|
]
|
13
|
+
},
|
14
|
+
{
|
15
|
+
title: 'iframe',
|
16
|
+
child: [
|
17
|
+
{
|
18
|
+
type: 'TextArea',
|
19
|
+
label: 'url',
|
20
|
+
name: ['props', 'iframe', 'src']
|
21
|
+
},
|
22
|
+
{
|
23
|
+
type: 'TextArea',
|
24
|
+
label: 'allow',
|
25
|
+
name: ['props', 'iframe', 'allow']
|
26
|
+
}
|
27
|
+
]
|
13
28
|
}
|
14
29
|
];
|
package/package.json
CHANGED
@@ -1,19 +0,0 @@
|
|
1
|
-
import React, { CSSProperties } from 'react';
|
2
|
-
import './index.less';
|
3
|
-
export interface IClickProps {
|
4
|
-
open?: boolean;
|
5
|
-
content?: string;
|
6
|
-
style?: Record<string, any>;
|
7
|
-
isTel?: boolean;
|
8
|
-
acceptButton?: {
|
9
|
-
text?: string;
|
10
|
-
style?: CSSProperties;
|
11
|
-
};
|
12
|
-
rejectButton?: {
|
13
|
-
text?: string;
|
14
|
-
style?: CSSProperties;
|
15
|
-
};
|
16
|
-
consentPopupCate?: string;
|
17
|
-
}
|
18
|
-
declare const _default: React.NamedExoticComponent<IClickProps>;
|
19
|
-
export default _default;
|
@@ -1,19 +0,0 @@
|
|
1
|
-
import { __rest } from "tslib";
|
2
|
-
import React, { memo, useMemo } from 'react';
|
3
|
-
import './index.less';
|
4
|
-
import tel from './tel.png';
|
5
|
-
import ConsentDetail from '../../popup/ConsentDetail';
|
6
|
-
const Click = (_a) => {
|
7
|
-
var { isTel, open, content, style, consentPopupCate, acceptButton, rejectButton } = _a, props = __rest(_a, ["isTel", "open", "content", "style", "consentPopupCate", "acceptButton", "rejectButton"]);
|
8
|
-
const visivle = useMemo(() => {
|
9
|
-
return consentPopupCate || (open && style);
|
10
|
-
}, [consentPopupCate, open]);
|
11
|
-
const handleClickAccept = () => { };
|
12
|
-
const handleClickReject = () => { };
|
13
|
-
return (React.createElement(React.Fragment, null, isTel ? (React.createElement("img", { src: tel, style: { objectFit: 'cover', width: '100%', height: '100%' } })) : (React.createElement(React.Fragment, null, visivle && (React.createElement("div", { className: 'consentPopupClick' },
|
14
|
-
React.createElement("div", { className: 'consentPopupClick-container', style: style },
|
15
|
-
React.createElement(ConsentDetail, { content: content, style: { padding: 0 } }),
|
16
|
-
React.createElement("button", { style: acceptButton === null || acceptButton === void 0 ? void 0 : acceptButton.style, onClick: handleClickAccept }, acceptButton === null || acceptButton === void 0 ? void 0 : acceptButton.text),
|
17
|
-
React.createElement("button", { style: rejectButton === null || rejectButton === void 0 ? void 0 : rejectButton.style, onClick: handleClickReject }, rejectButton === null || rejectButton === void 0 ? void 0 : rejectButton.text))))))));
|
18
|
-
};
|
19
|
-
export default memo(Click);
|