pb-sxp-ui 1.14.1 → 14.0.2

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.
Files changed (64) hide show
  1. package/dist/index.cjs +581 -158
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +89 -0
  4. package/dist/index.js +581 -158
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +6 -6
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +6 -6
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +581 -158
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +6 -6
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/components/SxpPageRender/ConsentPopup.js +8 -8
  15. package/es/core/components/SxpPageRender/index.js +5 -2
  16. package/es/core/context/SxpDataSourceProvider.js +39 -18
  17. package/es/core/utils/materials.js +5 -3
  18. package/es/materials/sxp/consentPopup/Click/index.d.ts +19 -0
  19. package/es/materials/sxp/consentPopup/Click/index.js +19 -0
  20. package/es/materials/sxp/consentPopup/Click/material.d.ts +2 -0
  21. package/es/materials/sxp/consentPopup/Click/material.js +48 -0
  22. package/es/materials/sxp/consentPopup/Click/settingRender.d.ts +63 -0
  23. package/es/materials/sxp/consentPopup/Click/settingRender.js +210 -0
  24. package/es/materials/sxp/consentPopup/Display/index.d.ts +2 -2
  25. package/es/materials/sxp/consentPopup/Display/index.js +7 -5
  26. package/es/materials/sxp/consentPopup/Swipe/index.d.ts +12 -0
  27. package/es/materials/sxp/consentPopup/Swipe/index.js +44 -0
  28. package/es/materials/sxp/consentPopup/Swipe/material.d.ts +2 -0
  29. package/es/materials/sxp/consentPopup/Swipe/material.js +24 -0
  30. package/es/materials/sxp/consentPopup/Swipe/settingRender.d.ts +29 -0
  31. package/es/materials/sxp/consentPopup/Swipe/settingRender.js +43 -0
  32. package/es/materials/sxp/consentPopup/index.d.ts +2 -0
  33. package/es/materials/sxp/consentPopup/index.js +2 -0
  34. package/es/materials/sxp/popup/ConsentDetail/index.d.ts +2 -1
  35. package/es/materials/sxp/popup/ConsentDetail/index.js +2 -2
  36. package/es/materials/sxp/popup/Iframe/index.d.ts +0 -4
  37. package/es/materials/sxp/popup/Iframe/index.js +4 -5
  38. package/es/materials/sxp/popup/Iframe/settingRender.js +0 -15
  39. package/lib/core/components/SxpPageRender/ConsentPopup.js +7 -7
  40. package/lib/core/components/SxpPageRender/index.js +5 -2
  41. package/lib/core/context/SxpDataSourceProvider.js +39 -18
  42. package/lib/core/utils/materials.js +5 -3
  43. package/lib/materials/sxp/consentPopup/Click/index.d.ts +19 -0
  44. package/lib/materials/sxp/consentPopup/Click/index.js +21 -0
  45. package/lib/materials/sxp/consentPopup/Click/material.d.ts +2 -0
  46. package/lib/materials/sxp/consentPopup/Click/material.js +52 -0
  47. package/lib/materials/sxp/consentPopup/Click/settingRender.d.ts +63 -0
  48. package/lib/materials/sxp/consentPopup/Click/settingRender.js +212 -0
  49. package/lib/materials/sxp/consentPopup/Display/index.d.ts +2 -2
  50. package/lib/materials/sxp/consentPopup/Display/index.js +7 -5
  51. package/lib/materials/sxp/consentPopup/Swipe/index.d.ts +12 -0
  52. package/lib/materials/sxp/consentPopup/Swipe/index.js +46 -0
  53. package/lib/materials/sxp/consentPopup/Swipe/material.d.ts +2 -0
  54. package/lib/materials/sxp/consentPopup/Swipe/material.js +28 -0
  55. package/lib/materials/sxp/consentPopup/Swipe/settingRender.d.ts +29 -0
  56. package/lib/materials/sxp/consentPopup/Swipe/settingRender.js +45 -0
  57. package/lib/materials/sxp/consentPopup/index.d.ts +2 -0
  58. package/lib/materials/sxp/consentPopup/index.js +2 -0
  59. package/lib/materials/sxp/popup/ConsentDetail/index.d.ts +2 -1
  60. package/lib/materials/sxp/popup/ConsentDetail/index.js +2 -2
  61. package/lib/materials/sxp/popup/Iframe/index.d.ts +0 -4
  62. package/lib/materials/sxp/popup/Iframe/index.js +4 -5
  63. package/lib/materials/sxp/popup/Iframe/settingRender.js +0 -15
  64. package/package.json +1 -1
@@ -1,15 +1,15 @@
1
- import React, { memo, useMemo } from 'react';
1
+ import React, { memo } from 'react';
2
2
  import './index.less';
3
3
  import withBindDataSource from '../../../core/hoc/withBindDataSource';
4
- import { getContsentState } from '../../../core/utils/localStore';
4
+ import { useEditorDataProvider } from '../../../core/context/EditorDataProvider';
5
5
  const Consent = ({ resolver, globalConfig }) => {
6
6
  var _a, _b;
7
- const contsentState = useMemo(() => {
8
- return getContsentState();
9
- }, []);
10
- const t = resolver === null || resolver === void 0 ? void 0 : resolver['Display'];
11
- const Component = withBindDataSource(t);
7
+ const { consentPopupCate } = useEditorDataProvider();
12
8
  const value = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consentPopup) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item;
13
- return React.createElement(Component, Object.assign({}, value === null || value === void 0 ? void 0 : value.props, { style: value === null || value === void 0 ? void 0 : value.style, event: (value === null || value === void 0 ? void 0 : value.event) || {}, contsentState: contsentState }));
9
+ if (!value)
10
+ return null;
11
+ const t = resolver === null || resolver === void 0 ? void 0 : resolver[value === null || value === void 0 ? void 0 : value.type];
12
+ const Component = withBindDataSource(t);
13
+ return (React.createElement(Component, Object.assign({}, value === null || value === void 0 ? void 0 : value.props, { style: value === null || value === void 0 ? void 0 : value.style, event: (value === null || value === void 0 ? void 0 : value.event) || {}, consentPopupCate: consentPopupCate })));
14
14
  };
15
15
  export default memo(Consent);
@@ -117,7 +117,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
117
117
  contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
118
118
  productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
119
119
  position: activeIndex + '',
120
- fromKName: fk ? fk : fromKName,
120
+ fromKName: fk || fromKName,
121
121
  fromKPage: location === null || location === void 0 ? void 0 : location.href,
122
122
  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 : '',
123
123
  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 : ''
@@ -144,9 +144,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
144
144
  setIsReload(new Date().getTime());
145
145
  skipLinkRef.current = false;
146
146
  }
147
+ refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false);
147
148
  handleH5EnterLink();
148
149
  if (repCond) {
149
- SXP_EVENT_BUS.emit(SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
150
+ setTimeout(() => {
151
+ SXP_EVENT_BUS.emit(SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
152
+ });
150
153
  backMainFeed('external', selectTag);
151
154
  }
152
155
  }
@@ -99,29 +99,32 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
99
99
  const bffDataSource = useMemo(() => {
100
100
  return dataSources === null || dataSources === void 0 ? void 0 : dataSources.find((d) => d.type === DataSourceType.BFF);
101
101
  }, [dataSources]);
102
+ const fakeUserId = useMemo(() => {
103
+ var _a;
104
+ return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + storeAndLoadFeUserId();
105
+ }, [bffDataSource]);
102
106
  const bffFetch = useCallback((path, options) => {
103
107
  if (!bffDataSource)
104
108
  return;
105
109
  const url = bffDataSource.url;
106
- const fakeUserId = storeAndLoadFeUserId();
107
110
  if (options === null || options === void 0 ? void 0 : options.query) {
108
111
  const queryString = qs.stringify(options.query);
109
112
  path = `${path}?${queryString}`;
110
113
  }
111
114
  if (options.type === 'beacon' && navigator.sendBeacon) {
112
- return navigator.sendBeacon(`${url}/api/v1${path}`, new Blob([
115
+ return navigator.sendBeacon(`${url}/api/${path}`, new Blob([
113
116
  JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))
114
117
  ], { type: 'application/json;charset=UTF-8' }));
115
118
  }
116
119
  return window
117
- .fetch(`${url}/api/v1${path}`, {
120
+ .fetch(`${url}/api/${path}`, {
118
121
  headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers),
119
122
  method: options.method,
120
123
  body: JSON.stringify(options.body)
121
124
  })
122
125
  .then((res) => res.json())
123
126
  .catch((err) => Promise.reject(err));
124
- }, [bffDataSource]);
127
+ }, [bffDataSource, fakeUserId]);
125
128
  const getRecommendVideos = useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
126
129
  var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
127
130
  query = {
@@ -158,7 +161,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
158
161
  const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
159
162
  var _v, _w, _x, _y, _z, _0;
160
163
  query.pageNum = pageNum;
161
- result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
164
+ result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', { method: 'POST', body: query }));
162
165
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
163
166
  return undefined;
164
167
  }
@@ -180,7 +183,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
180
183
  if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
181
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 });
182
185
  }
183
- const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
186
+ const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', { method: 'POST', body: query }));
184
187
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
185
188
  return undefined;
186
189
  }
@@ -230,6 +233,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
230
233
  return expire;
231
234
  }, [data]);
232
235
  const bffEventReport = useCallback(({ userInfo, eventInfo, reportLayId = true }) => {
236
+ var _a;
233
237
  if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
234
238
  return;
235
239
  }
@@ -246,14 +250,23 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
246
250
  console.log('userInfo:', userInfo);
247
251
  console.log('eventInfo:', ef);
248
252
  console.log('========= 结束 =========');
249
- return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/event/report', {
253
+ return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/event/report/CLD/${(_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']}/${eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.eventSubject}`, {
250
254
  method: 'POST',
251
255
  body: { userInfo: realUserInfo, eventInfo: realEventInfo },
252
256
  type: 'beacon'
253
257
  });
254
- }, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, layoutVariantId, globalConfig, playbookType]);
258
+ }, [
259
+ bffFetch,
260
+ curReqInfo,
261
+ enableReportEvent,
262
+ globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
263
+ layoutVariantId,
264
+ globalConfig,
265
+ playbookType,
266
+ bffDataSource
267
+ ]);
255
268
  const bffFbReport = useCallback(({ eventName, product }) => {
256
- var _a, _b, _c, _d, _e;
269
+ var _a, _b, _c, _d, _e, _f;
257
270
  if (!enableReportEvent ||
258
271
  !enabledMetaConversionApi ||
259
272
  (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) ||
@@ -265,7 +278,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
265
278
  const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
266
279
  const fix_par = {
267
280
  event_source_url: (_c = window === null || window === void 0 ? void 0 : window.location) === null || _c === void 0 ? void 0 : _c.href,
268
- external_id: storeAndLoadFeUserId(),
281
+ external_id: fakeUserId,
269
282
  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 : '',
270
283
  fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
271
284
  fbp: getCookie('_fbp') ? `fb.2.${new Date().getTime()}.${getCookie('_fbp')}` : '',
@@ -317,22 +330,30 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
317
330
  }
318
331
  };
319
332
  getEventParams(jsonParams);
320
- return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/fb/events', {
333
+ return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/event/report/FB/${(_f = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _f === void 0 ? void 0 : _f['x-app-id']}/${eventName}`, {
321
334
  method: 'POST',
322
335
  body: jsonParams,
323
336
  type: 'beacon'
324
337
  });
325
- }, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, globalConfig]);
338
+ }, [
339
+ bffFetch,
340
+ enableReportEvent,
341
+ enabledMetaConversionApi,
342
+ globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
343
+ globalConfig,
344
+ fakeUserId,
345
+ bffDataSource
346
+ ]);
326
347
  const bffMutateLike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
327
- const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/like', { method: 'POST', body }));
348
+ const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
328
349
  return res === null || res === void 0 ? void 0 : res.success;
329
350
  }), [bffFetch]);
330
351
  const bffMutateUnlike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
331
- const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/unlike', { method: 'POST', body }));
352
+ const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
332
353
  return res === null || res === void 0 ? void 0 : res.success;
333
354
  }), [bffFetch]);
334
355
  const bffSubmitForm = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
335
- const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/customform', { method: 'POST', body }));
356
+ const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
336
357
  return res === null || res === void 0 ? void 0 : res.success;
337
358
  }), [bffFetch]);
338
359
  const bffGetTagList = useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
@@ -346,7 +367,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
346
367
  const key = val.split('=')[0];
347
368
  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);
348
369
  })) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
349
- const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
370
+ const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
350
371
  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 : []);
351
372
  }
352
373
  catch (e) {
@@ -420,10 +441,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
420
441
  let curData;
421
442
  let gldata;
422
443
  if (data === null || data === void 0 ? void 0 : data.layoutVariantId) {
444
+ layId = data === null || data === void 0 ? void 0 : data.layoutVariantId;
445
+ setLayoutVariantId(data === null || data === void 0 ? void 0 : data.layoutVariantId);
423
446
  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];
424
447
  if (id) {
425
- layId = id;
426
- setLayoutVariantId(id);
427
448
  curData = dataList === null || dataList === void 0 ? void 0 : dataList.find((item) => (item === null || item === void 0 ? void 0 : item.id) === id);
428
449
  if (curData) {
429
450
  setPageData(curData);
@@ -32,14 +32,16 @@ export const getBgStyleByImg = (data) => {
32
32
  };
33
33
  export const getPriceText = ({ product, enableFormattedPrice, globalConfig, isHiddenDef, style }) => {
34
34
  var _a, _b, _c, _d, _e, _f, _g, _h;
35
+ let text = '';
35
36
  if ((!(product === null || product === void 0 ? void 0 : product.currency) || !(product === null || product === void 0 ? void 0 : product.price)) && isHiddenDef)
36
37
  return null;
37
- 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;
38
- let text = '';
38
+ let price = Number((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);
39
+ if (typeof price !== 'number')
40
+ return text;
39
41
  let priceSymbol = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.priceSymbol;
40
42
  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 : '' : '$';
41
43
  const isToLocStr = enableFormattedPrice === undefined || enableFormattedPrice;
42
- let decPic = price.toString();
44
+ let decPic = price === null || price === void 0 ? void 0 : price.toString();
43
45
  if (priceSymbol === null || priceSymbol === void 0 ? void 0 : priceSymbol.showTwoDecimalPoint) {
44
46
  decPic = price === null || price === void 0 ? void 0 : price.toFixed(2);
45
47
  }
@@ -0,0 +1,19 @@
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;
@@ -0,0 +1,19 @@
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);
@@ -0,0 +1,2 @@
1
+ declare const Click: import("../../../../core/create").MaterialComponet<import(".").IClickProps>;
2
+ export { Click };
@@ -0,0 +1,48 @@
1
+ import settingRender from './settingRender';
2
+ import ClickComponent from '.';
3
+ import { createMaterial } from '../../../../core/create';
4
+ const Click = createMaterial(ClickComponent, {
5
+ displayName: 'Click Consent',
6
+ icon: '',
7
+ category: 'consentPopup',
8
+ type: 'Click',
9
+ related: {
10
+ settingRender,
11
+ bindableProps: []
12
+ },
13
+ defaulSetting: {
14
+ props: {
15
+ content: '<p><strong><span style="font-size:14px"><span style="line-height:3">Your Cookie Preferences</span></span></strong></p><p>We use cookie, including third-party cookies, to ensure the proper functioning and security of this site, to analyse its use, and to show you personalised content. You can authorise the use of all cookies by clicking on &quot;Accept all cookies&quot;. If you click on &quot;Reject all cookies&quot;, we will only use cookies necessary for the proper functioning and security of this site. To personalise on adjust your preferences at any time, click on &quot;Cookies Settings&quot; below or at the bottom of any Fendi.com webpage. For more information, read our Cookie Policy.</p><p></p>',
16
+ acceptButton: {
17
+ text: 'Accept all cookies',
18
+ style: {
19
+ backgroundColor: '#000',
20
+ height: 45,
21
+ color: '#fff',
22
+ fontSize: 12,
23
+ textAlign: 'center',
24
+ marginTop: 5,
25
+ marginBottom: 5
26
+ }
27
+ },
28
+ rejectButton: {
29
+ text: 'Reject all cookies',
30
+ style: {
31
+ backgroundColor: '#000',
32
+ height: 45,
33
+ color: '#fff',
34
+ fontSize: 12,
35
+ textAlign: 'center',
36
+ marginTop: 5,
37
+ marginBottom: 5
38
+ }
39
+ }
40
+ },
41
+ style: {
42
+ backgroundColor: '#fff',
43
+ padding: 18
44
+ }
45
+ },
46
+ sort: 2
47
+ });
48
+ export { Click };
@@ -0,0 +1,63 @@
1
+ declare const _default: ({
2
+ title: string;
3
+ child: {
4
+ type: string;
5
+ name: string[];
6
+ }[];
7
+ } | {
8
+ title: string;
9
+ child: ({
10
+ type: string;
11
+ label: string;
12
+ name: string[];
13
+ addonAfter?: undefined;
14
+ child?: undefined;
15
+ } | {
16
+ type: string;
17
+ label: string;
18
+ name: string[];
19
+ addonAfter: string;
20
+ child?: undefined;
21
+ } | {
22
+ type: string;
23
+ label: string;
24
+ child: ({
25
+ type: string;
26
+ name: string[];
27
+ max: number;
28
+ addonAfter?: undefined;
29
+ } | {
30
+ type: string;
31
+ name: string[];
32
+ addonAfter: string;
33
+ max: number;
34
+ })[];
35
+ name?: undefined;
36
+ addonAfter?: undefined;
37
+ } | {
38
+ type: string;
39
+ label: string;
40
+ child: {
41
+ type: string;
42
+ name: string[];
43
+ bottomText: string;
44
+ }[];
45
+ name?: undefined;
46
+ addonAfter?: undefined;
47
+ } | {
48
+ type: string;
49
+ label: string;
50
+ child: ({
51
+ type: string;
52
+ name: string[];
53
+ addonAfter?: undefined;
54
+ } | {
55
+ type: string;
56
+ name: string[];
57
+ addonAfter: string;
58
+ })[];
59
+ name?: undefined;
60
+ addonAfter?: undefined;
61
+ })[];
62
+ })[];
63
+ export default _default;
@@ -0,0 +1,210 @@
1
+ export default [
2
+ {
3
+ title: '全局设置',
4
+ child: [
5
+ {
6
+ type: 'Switch',
7
+ label: '弹窗开关',
8
+ name: ['props', 'open']
9
+ },
10
+ {
11
+ type: 'Color',
12
+ label: '背景色',
13
+ name: ['style', 'backgroundColor']
14
+ },
15
+ {
16
+ type: 'Number',
17
+ label: '内边距',
18
+ name: ['style', 'padding'],
19
+ addonAfter: 'px'
20
+ }
21
+ ]
22
+ },
23
+ {
24
+ title: '弹窗文本',
25
+ child: [
26
+ {
27
+ type: 'RichText',
28
+ name: ['props', 'content']
29
+ }
30
+ ]
31
+ },
32
+ {
33
+ title: '接受按钮样式',
34
+ child: [
35
+ {
36
+ type: 'Color',
37
+ label: '背景色',
38
+ name: ['props', 'acceptButton', 'style', 'backgroundColor']
39
+ },
40
+ {
41
+ type: 'Number',
42
+ label: '尺寸',
43
+ name: ['props', 'acceptButton', 'style', 'height'],
44
+ addonAfter: 'H'
45
+ },
46
+ {
47
+ type: 'Group',
48
+ label: '圆角',
49
+ child: [
50
+ {
51
+ type: 'Slider',
52
+ name: ['props', 'acceptButton', 'style', 'borderRadius'],
53
+ max: 100
54
+ },
55
+ {
56
+ type: 'Number',
57
+ name: ['props', 'acceptButton', 'style', 'borderRadius'],
58
+ addonAfter: 'px',
59
+ max: 100
60
+ }
61
+ ]
62
+ },
63
+ {
64
+ type: 'TextMargin',
65
+ label: '边距',
66
+ name: ['props', 'acceptButton', 'style']
67
+ },
68
+ {
69
+ type: 'Group',
70
+ label: '字体',
71
+ child: [
72
+ {
73
+ type: 'Select',
74
+ name: ['props', 'acceptButton', 'style', 'fontFamily-cn'],
75
+ bottomText: '中文字体'
76
+ },
77
+ {
78
+ type: 'Select',
79
+ name: ['props', 'acceptButton', 'style', 'fontFamily-en'],
80
+ bottomText: '英文/其他字体'
81
+ }
82
+ ]
83
+ },
84
+ {
85
+ type: 'Group',
86
+ label: '',
87
+ child: [
88
+ {
89
+ type: 'Color',
90
+ name: ['props', 'acceptButton', 'style', 'color']
91
+ },
92
+ {
93
+ type: 'Number',
94
+ name: ['props', 'acceptButton', 'style', 'fontSize'],
95
+ addonAfter: 'px'
96
+ }
97
+ ]
98
+ },
99
+ {
100
+ label: '样式',
101
+ type: 'TextStyle',
102
+ name: ['props', 'acceptButton', 'style']
103
+ },
104
+ {
105
+ label: '对齐',
106
+ type: 'TextAlign',
107
+ name: ['props', 'acceptButton', 'style']
108
+ },
109
+ {
110
+ label: '间距',
111
+ type: 'TextSpace',
112
+ name: ['props', 'acceptButton', 'style']
113
+ },
114
+ {
115
+ label: '文本',
116
+ type: 'TextArea',
117
+ name: ['props', 'acceptButton', 'text']
118
+ }
119
+ ]
120
+ },
121
+ {
122
+ title: '拒绝按钮样式',
123
+ child: [
124
+ {
125
+ type: 'Color',
126
+ label: '背景色',
127
+ name: ['props', 'rejectButton', 'style', 'backgroundColor']
128
+ },
129
+ {
130
+ type: 'Number',
131
+ label: '尺寸',
132
+ name: ['props', 'rejectButton', 'style', 'height'],
133
+ addonAfter: 'H'
134
+ },
135
+ {
136
+ type: 'Group',
137
+ label: '圆角',
138
+ child: [
139
+ {
140
+ type: 'Slider',
141
+ name: ['props', 'rejectButton', 'style', 'borderRadius'],
142
+ max: 100
143
+ },
144
+ {
145
+ type: 'Number',
146
+ name: ['props', 'rejectButton', 'style', 'borderRadius'],
147
+ addonAfter: 'px',
148
+ max: 100
149
+ }
150
+ ]
151
+ },
152
+ {
153
+ type: 'TextMargin',
154
+ label: '边距',
155
+ name: ['props', 'acceptButton', 'style']
156
+ },
157
+ {
158
+ type: 'Group',
159
+ label: '字体',
160
+ child: [
161
+ {
162
+ type: 'Select',
163
+ name: ['props', 'rejectButton', 'style', 'fontFamily-cn'],
164
+ bottomText: '中文字体'
165
+ },
166
+ {
167
+ type: 'Select',
168
+ name: ['props', 'rejectButton', 'style', 'fontFamily-en'],
169
+ bottomText: '英文/其他字体'
170
+ }
171
+ ]
172
+ },
173
+ {
174
+ type: 'Group',
175
+ label: '',
176
+ child: [
177
+ {
178
+ type: 'Color',
179
+ name: ['props', 'rejectButton', 'style', 'color']
180
+ },
181
+ {
182
+ type: 'Number',
183
+ name: ['props', 'rejectButton', 'style', 'fontSize'],
184
+ addonAfter: 'px'
185
+ }
186
+ ]
187
+ },
188
+ {
189
+ label: '样式',
190
+ type: 'TextStyle',
191
+ name: ['props', 'rejectButton', 'style']
192
+ },
193
+ {
194
+ label: '对齐',
195
+ type: 'TextAlign',
196
+ name: ['props', 'rejectButton', 'style']
197
+ },
198
+ {
199
+ label: '间距',
200
+ type: 'TextSpace',
201
+ name: ['props', 'rejectButton', 'style']
202
+ },
203
+ {
204
+ label: '文本',
205
+ type: 'TextArea',
206
+ name: ['props', 'rejectButton', 'text']
207
+ }
208
+ ]
209
+ }
210
+ ];
@@ -13,9 +13,9 @@ export interface IDisplayProps {
13
13
  };
14
14
  style?: Record<string, any>;
15
15
  isTel?: boolean;
16
- onClick?: () => void;
17
- contsentState?: boolean;
18
16
  isShowClose?: boolean;
17
+ consentPopupCate?: string;
18
+ onClick?: () => void;
19
19
  }
20
20
  declare const _default: React.NamedExoticComponent<IDisplayProps>;
21
21
  export default _default;
@@ -1,18 +1,20 @@
1
1
  import { __rest } from "tslib";
2
2
  import React, { memo, useCallback, useMemo, useState } from 'react';
3
3
  import './index.less';
4
- import { useEditorDataProvider } from '../../../../core/context/EditorDataProvider';
5
4
  import closeSvg from './close.svg';
6
5
  import tel from './tel.png';
7
6
  import { setFontForText } from '../../../../core/utils/tool';
7
+ import { getContsentState } from '../../../../core/utils/localStore';
8
8
  const Display = (_a) => {
9
9
  var _b, _c;
10
- var { isTel, isShowOnce, open, content, interaction, style, onClick, contsentState, isShowClose } = _a, props = __rest(_a, ["isTel", "isShowOnce", "open", "content", "interaction", "style", "onClick", "contsentState", "isShowClose"]);
11
- const { consentPopupCate } = useEditorDataProvider();
10
+ var { isTel, isShowOnce, open, content, interaction, style, onClick, isShowClose, consentPopupCate } = _a, props = __rest(_a, ["isTel", "isShowOnce", "open", "content", "interaction", "style", "onClick", "isShowClose", "consentPopupCate"]);
12
11
  const [isClose, setIsClose] = useState(false);
12
+ const contsentState = useMemo(() => {
13
+ return getContsentState();
14
+ }, []);
13
15
  const visivle = useMemo(() => {
14
- return consentPopupCate === 'Display' || (open && (isShowOnce || contsentState) && style && !isClose);
15
- }, [consentPopupCate, open, isClose]);
16
+ return consentPopupCate || (open && (isShowOnce || contsentState) && style && !isClose);
17
+ }, [consentPopupCate, open, isClose, contsentState]);
16
18
  const handleClickClose = useCallback(() => {
17
19
  setIsClose(true);
18
20
  }, []);
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import './index.less';
3
+ export interface ISwipeProps {
4
+ open?: boolean;
5
+ content?: string;
6
+ style?: Record<string, any>;
7
+ isTel?: boolean;
8
+ consentPopupCate?: string;
9
+ swipeIcon?: string;
10
+ }
11
+ declare const _default: React.NamedExoticComponent<ISwipeProps>;
12
+ export default _default;