pb-sxp-ui 15.0.1 → 15.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 +594 -144
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +90 -3
  4. package/dist/index.js +594 -144
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +4 -4
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +4 -4
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +594 -144
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +4 -4
  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/Navbar.js +1 -1
  16. package/es/core/components/SxpPageRender/index.js +5 -2
  17. package/es/core/context/SxpDataSourceProvider.js +54 -22
  18. package/es/core/utils/materials.js +5 -3
  19. package/es/materials/sxp/consentPopup/Click/index.d.ts +19 -0
  20. package/es/materials/sxp/consentPopup/Click/index.js +19 -0
  21. package/es/materials/sxp/consentPopup/Click/material.d.ts +2 -0
  22. package/es/materials/sxp/consentPopup/Click/material.js +48 -0
  23. package/es/materials/sxp/consentPopup/Click/settingRender.d.ts +63 -0
  24. package/es/materials/sxp/consentPopup/Click/settingRender.js +210 -0
  25. package/es/materials/sxp/consentPopup/Display/index.d.ts +2 -2
  26. package/es/materials/sxp/consentPopup/Display/index.js +7 -5
  27. package/es/materials/sxp/consentPopup/Swipe/index.d.ts +12 -0
  28. package/es/materials/sxp/consentPopup/Swipe/index.js +44 -0
  29. package/es/materials/sxp/consentPopup/Swipe/material.d.ts +2 -0
  30. package/es/materials/sxp/consentPopup/Swipe/material.js +24 -0
  31. package/es/materials/sxp/consentPopup/Swipe/settingRender.d.ts +29 -0
  32. package/es/materials/sxp/consentPopup/Swipe/settingRender.js +43 -0
  33. package/es/materials/sxp/consentPopup/index.d.ts +2 -0
  34. package/es/materials/sxp/consentPopup/index.js +2 -0
  35. package/es/materials/sxp/cta/AniLink/index.js +1 -1
  36. package/es/materials/sxp/cta/AniLinkPopup/index.js +1 -1
  37. package/es/materials/sxp/popup/ConsentDetail/index.d.ts +2 -1
  38. package/es/materials/sxp/popup/ConsentDetail/index.js +2 -2
  39. package/lib/core/components/SxpPageRender/ConsentPopup.js +7 -7
  40. package/lib/core/components/SxpPageRender/Navbar.js +1 -1
  41. package/lib/core/components/SxpPageRender/index.js +5 -2
  42. package/lib/core/context/SxpDataSourceProvider.js +54 -22
  43. package/lib/core/utils/materials.js +5 -3
  44. package/lib/materials/sxp/consentPopup/Click/index.d.ts +19 -0
  45. package/lib/materials/sxp/consentPopup/Click/index.js +21 -0
  46. package/lib/materials/sxp/consentPopup/Click/material.d.ts +2 -0
  47. package/lib/materials/sxp/consentPopup/Click/material.js +52 -0
  48. package/lib/materials/sxp/consentPopup/Click/settingRender.d.ts +63 -0
  49. package/lib/materials/sxp/consentPopup/Click/settingRender.js +212 -0
  50. package/lib/materials/sxp/consentPopup/Display/index.d.ts +2 -2
  51. package/lib/materials/sxp/consentPopup/Display/index.js +7 -5
  52. package/lib/materials/sxp/consentPopup/Swipe/index.d.ts +12 -0
  53. package/lib/materials/sxp/consentPopup/Swipe/index.js +46 -0
  54. package/lib/materials/sxp/consentPopup/Swipe/material.d.ts +2 -0
  55. package/lib/materials/sxp/consentPopup/Swipe/material.js +28 -0
  56. package/lib/materials/sxp/consentPopup/Swipe/settingRender.d.ts +29 -0
  57. package/lib/materials/sxp/consentPopup/Swipe/settingRender.js +45 -0
  58. package/lib/materials/sxp/consentPopup/index.d.ts +2 -0
  59. package/lib/materials/sxp/consentPopup/index.js +2 -0
  60. package/lib/materials/sxp/cta/AniLink/index.js +1 -1
  61. package/lib/materials/sxp/cta/AniLinkPopup/index.js +1 -1
  62. package/lib/materials/sxp/popup/ConsentDetail/index.d.ts +2 -1
  63. package/lib/materials/sxp/popup/ConsentDetail/index.js +2 -2
  64. package/package.json +1 -1
@@ -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;
@@ -0,0 +1,44 @@
1
+ import { __rest } from "tslib";
2
+ import React, { memo, useMemo, useRef } from 'react';
3
+ import './index.less';
4
+ import tel from './tel.png';
5
+ import ConsentDetail from '../../popup/ConsentDetail';
6
+ const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
7
+ const Swipe = (_a) => {
8
+ var { isTel, open, content, style, consentPopupCate, swipeIcon } = _a, props = __rest(_a, ["isTel", "open", "content", "style", "consentPopupCate", "swipeIcon"]);
9
+ const touchInfo = useRef();
10
+ const threshold = 50;
11
+ const handleTouchStart = (event) => {
12
+ const touch = event.touches[0];
13
+ touchInfo.current = { y: touch.clientY, d: 0 };
14
+ };
15
+ const handleTouchMove = (event) => {
16
+ var _a;
17
+ if (!touchInfo.current)
18
+ return;
19
+ const touch = event.touches[0];
20
+ const dy = touch.clientY - ((_a = touchInfo === null || touchInfo === void 0 ? void 0 : touchInfo.current) === null || _a === void 0 ? void 0 : _a.y);
21
+ const currentDistance = Math.abs(dy);
22
+ touchInfo.current = Object.assign(Object.assign({}, touchInfo.current), { d: currentDistance });
23
+ };
24
+ const handleTouchEnd = () => {
25
+ if (!touchInfo.current)
26
+ return;
27
+ const { d } = touchInfo.current || {};
28
+ if (d > threshold) {
29
+ }
30
+ touchInfo.current = {};
31
+ };
32
+ const handleClickReject = () => { };
33
+ const visivle = useMemo(() => {
34
+ return consentPopupCate || (open && style);
35
+ }, [consentPopupCate, open]);
36
+ 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: 'consentPopupSwipe', onTouchStart: handleTouchStart, onTouchMove: handleTouchMove, onTouchEnd: handleTouchEnd },
37
+ React.createElement("div", { className: 'consentPopupSwipe-container', style: style },
38
+ React.createElement(ConsentDetail, { content: content, style: { padding: 0 } }),
39
+ React.createElement("button", { "aria-label": 'close', className: 'consentPopupSwipe-container-close', onClick: handleClickReject },
40
+ React.createElement("img", { src: closeIcon, alt: 'close' })),
41
+ swipeIcon && (React.createElement("div", { className: 'consentPopupSwipe-container-swipeIcon', onClick: handleClickReject },
42
+ React.createElement("img", { src: swipeIcon, alt: 'Swipe Icon' }))))))))));
43
+ };
44
+ export default memo(Swipe);
@@ -0,0 +1,2 @@
1
+ declare const Swipe: import("../../../../core/create").MaterialComponet<import(".").ISwipeProps>;
2
+ export { Swipe };
@@ -0,0 +1,24 @@
1
+ import settingRender from './settingRender';
2
+ import SwipeComponent from '.';
3
+ import { createMaterial } from '../../../../core/create';
4
+ const Swipe = createMaterial(SwipeComponent, {
5
+ displayName: 'Swipe Consent',
6
+ icon: '',
7
+ category: 'consentPopup',
8
+ type: 'Swipe',
9
+ related: {
10
+ settingRender,
11
+ bindableProps: []
12
+ },
13
+ defaulSetting: {
14
+ props: {
15
+ content: '<p><span style="font- size: 14px"><strong><span style="line - height: 3">Your Cookie Preferences</span></strong></span></p><p><span style="line- height: 1"><span style="font- size: 12px">We use cookie, including third-party cookies, to</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">ensure the proper functioning and security of</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">this site, to analyse its use, and to show you</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">personalised content.</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">You can authorise the use of all cookies by</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">clicking on &#x27;Accept all cookies&#x27;. If you click on</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">&#x27;Reject all cookies&#x27;, we will only use cookies</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">necessary for the proper functioning and </span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">security of this site. To personalise or adjust</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">your preferences at any time, click on &#x27;Cookies</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">Settings&#x27; below or at the bottom of any</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">Fendi.com webpage.</span></span></p><p><span style="line - height: 1"><span style="font - size: 12px">For more information, <u>read our Cookie Policy</u>.</span></span></p>'
16
+ },
17
+ style: {
18
+ backgroundColor: '#fff',
19
+ padding: 18
20
+ }
21
+ },
22
+ sort: 3
23
+ });
24
+ export { Swipe };
@@ -0,0 +1,29 @@
1
+ declare const _default: ({
2
+ title: string;
3
+ child: ({
4
+ type: string;
5
+ label: string;
6
+ name: string[];
7
+ addonAfter?: undefined;
8
+ } | {
9
+ type: string;
10
+ label: string;
11
+ name: string[];
12
+ addonAfter: string;
13
+ })[];
14
+ } | {
15
+ title: string;
16
+ child: {
17
+ type: string;
18
+ name: string[];
19
+ }[];
20
+ } | {
21
+ title: string;
22
+ child: {
23
+ type: string;
24
+ label: string;
25
+ name: string[];
26
+ text: string;
27
+ }[];
28
+ })[];
29
+ export default _default;
@@ -0,0 +1,43 @@
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: 'Upload',
37
+ label: '滑动图标',
38
+ name: ['props', 'swipeIcon'],
39
+ text: '建议尺寸:252 * 185'
40
+ }
41
+ ]
42
+ }
43
+ ];
@@ -1 +1,3 @@
1
1
  export * from './Display/material';
2
+ export * from './Click/material';
3
+ export * from './Swipe/material';
@@ -1 +1,3 @@
1
1
  export * from './Display/material';
2
+ export * from './Click/material';
3
+ export * from './Swipe/material';
@@ -35,7 +35,7 @@ const AniLink = (_a) => {
35
35
  onClick === null || onClick === void 0 ? void 0 : onClick();
36
36
  }
37
37
  };
38
- const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
38
+ const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || 'Show More';
39
39
  const aniTimStyle = useMemo(() => {
40
40
  var _a, _b;
41
41
  const ani = event === null || event === void 0 ? void 0 : event.animation;
@@ -35,7 +35,7 @@ const AniLinkPopup = (_a) => {
35
35
  onClick === null || onClick === void 0 ? void 0 : onClick();
36
36
  }
37
37
  };
38
- const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
38
+ const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || 'Show More';
39
39
  const aniTimStyle = useMemo(() => {
40
40
  const ani = event === null || event === void 0 ? void 0 : event.animation;
41
41
  if (ani) {
@@ -1,8 +1,9 @@
1
- import React from 'react';
1
+ import React, { CSSProperties } from 'react';
2
2
  import './index.less';
3
3
  export interface IConsentDetailProps {
4
4
  content?: string;
5
5
  isTel?: boolean;
6
+ style?: CSSProperties;
6
7
  }
7
8
  declare const _default: React.NamedExoticComponent<IConsentDetailProps>;
8
9
  export default _default;
@@ -2,11 +2,11 @@ import { __rest } from "tslib";
2
2
  import React, { memo } from 'react';
3
3
  import './index.less';
4
4
  const ConsentDetail = (_a) => {
5
- var { content, isTel } = _a, props = __rest(_a, ["content", "isTel"]);
5
+ var { content, isTel, style } = _a, props = __rest(_a, ["content", "isTel", "style"]);
6
6
  return (React.createElement("article", { className: 'consentDetail-article', dangerouslySetInnerHTML: {
7
7
  __html: typeof content === 'string' ? content : ''
8
8
  }, onClick: (e) => {
9
9
  e.stopPropagation();
10
- } }));
10
+ }, style: style }));
11
11
  };
12
12
  export default memo(ConsentDetail);
@@ -4,15 +4,15 @@ const tslib_1 = require("tslib");
4
4
  const react_1 = tslib_1.__importStar(require("react"));
5
5
  require("./index.less");
6
6
  const withBindDataSource_1 = tslib_1.__importDefault(require("../../../core/hoc/withBindDataSource"));
7
- const localStore_1 = require("../../../core/utils/localStore");
7
+ const EditorDataProvider_1 = require("../../../core/context/EditorDataProvider");
8
8
  const Consent = ({ resolver, globalConfig }) => {
9
9
  var _a, _b;
10
- const contsentState = (0, react_1.useMemo)(() => {
11
- return (0, localStore_1.getContsentState)();
12
- }, []);
13
- const t = resolver === null || resolver === void 0 ? void 0 : resolver['Display'];
14
- const Component = (0, withBindDataSource_1.default)(t);
10
+ const { consentPopupCate } = (0, EditorDataProvider_1.useEditorDataProvider)();
15
11
  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;
16
- return react_1.default.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 }));
12
+ if (!value)
13
+ return null;
14
+ const t = resolver === null || resolver === void 0 ? void 0 : resolver[value === null || value === void 0 ? void 0 : value.type];
15
+ const Component = (0, withBindDataSource_1.default)(t);
16
+ return (react_1.default.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 })));
17
17
  };
18
18
  exports.default = (0, react_1.memo)(Consent);
@@ -11,7 +11,7 @@ const Navbar = ({ icon, styles, textStyle, onClose }) => {
11
11
  react_1.default.createElement("button", { className: 'clc-sxp-nav-left', role: 'button', "aria-label": 'back button', onClick: onClose },
12
12
  react_1.default.createElement("img", { src: icon, alt: 'back button' })),
13
13
  react_1.default.createElement("div", { className: 'clc-sxp-nav-title', style: Object.assign(Object.assign({}, textStyle), { paddingLeft: (textStyle === null || textStyle === void 0 ? void 0 : textStyle.textAlign) === 'left' ? '35px' : 0 }), dangerouslySetInnerHTML: {
14
- __html: (0, tool_1.setFontForText)(`#${(_a = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag) !== null && _a !== void 0 ? _a : '标题'}`, textStyle)
14
+ __html: (0, tool_1.setFontForText)(`#${(_a = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag) !== null && _a !== void 0 ? _a : 'title'}`, textStyle)
15
15
  } })));
16
16
  };
17
17
  exports.default = (0, react_1.memo)(Navbar);
@@ -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 ? fk : fromKName,
123
+ fromKName: 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,9 +147,12 @@ 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);
150
151
  handleH5EnterLink();
151
152
  if (repCond) {
152
- event_1.default.emit(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
153
+ setTimeout(() => {
154
+ event_1.default.emit(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
155
+ });
153
156
  backMainFeed('external', selectTag);
154
157
  }
155
158
  }
@@ -102,29 +102,32 @@ 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]);
105
109
  const bffFetch = (0, react_1.useCallback)((path, options) => {
106
110
  if (!bffDataSource)
107
111
  return;
108
112
  const url = bffDataSource.url;
109
- const fakeUserId = (0, localStore_1.storeAndLoadFeUserId)();
110
113
  if (options === null || options === void 0 ? void 0 : options.query) {
111
114
  const queryString = qs_1.default.stringify(options.query);
112
115
  path = `${path}?${queryString}`;
113
116
  }
114
117
  if (options.type === 'beacon' && navigator.sendBeacon) {
115
- return navigator.sendBeacon(`${url}/api/v1${path}`, new Blob([
118
+ return navigator.sendBeacon(`${url}/api/${path}`, new Blob([
116
119
  JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))
117
120
  ], { type: 'application/json;charset=UTF-8' }));
118
121
  }
119
122
  return window
120
- .fetch(`${url}/api/v1${path}`, {
123
+ .fetch(`${url}/api/${path}`, {
121
124
  headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers),
122
125
  method: options.method,
123
126
  body: JSON.stringify(options.body)
124
127
  })
125
128
  .then((res) => res.json())
126
129
  .catch((err) => Promise.reject(err));
127
- }, [bffDataSource]);
130
+ }, [bffDataSource, fakeUserId]);
128
131
  const getRecommendVideos = (0, react_1.useCallback)((query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
129
132
  var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
130
133
  query = {
@@ -161,14 +164,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
161
164
  const recurveRecList = (query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
162
165
  var _v, _w, _x, _y, _z, _0;
163
166
  query.pageNum = pageNum;
164
- result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
167
+ result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', { method: 'POST', body: query }));
165
168
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
166
169
  return undefined;
167
170
  }
168
171
  setLoading(false);
169
172
  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 : []);
170
- setRtcList(getFilterRecList(Object.assign(Object.assign({}, result.data), { recList: list })));
171
- setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result.data), { recList: list })));
173
+ if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
174
+ setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
175
+ setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
176
+ }
172
177
  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));
173
178
  if (isNotNullList) {
174
179
  pageNum = pageNum + 1;
@@ -178,12 +183,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
178
183
  yield recurveRecList(query);
179
184
  if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
180
185
  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 });
181
- return Object.assign(Object.assign({}, result.data), { recList: list });
186
+ return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
182
187
  }
183
188
  if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
184
189
  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 });
185
190
  }
186
- const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
191
+ const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', { method: 'POST', body: query }));
187
192
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
188
193
  return undefined;
189
194
  }
@@ -233,6 +238,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
233
238
  return expire;
234
239
  }, [data]);
235
240
  const bffEventReport = (0, react_1.useCallback)(({ userInfo, eventInfo, reportLayId = true }) => {
241
+ var _a, _b;
236
242
  if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
237
243
  return;
238
244
  }
@@ -240,7 +246,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
240
246
  userInfo = {};
241
247
  }
242
248
  const sessionID = (0, sessionStore_1.storeAndLoadFeSessionId)();
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 + '' }));
249
+ const params = {};
250
+ const queryString = location.search.slice(1);
251
+ (_a = (0, tool_1.splitUrlParams)(queryString)) === null || _a === void 0 ? void 0 : _a.map((val) => {
252
+ const key = val.split('=')[0];
253
+ const value = val.split('=')[1];
254
+ params[key] = value;
255
+ });
256
+ console.log(params, '111');
257
+ const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
258
+ 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 }));
244
259
  const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
245
260
  const realEventInfo = Object.entries(ef)
246
261
  .map(([k, v]) => v && { name: k, value: v })
@@ -249,14 +264,23 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
249
264
  console.log('userInfo:', userInfo);
250
265
  console.log('eventInfo:', ef);
251
266
  console.log('========= 结束 =========');
252
- return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/event/report', {
267
+ return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/event/report/CLD/${(_b = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _b === void 0 ? void 0 : _b['x-app-id']}/${eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.eventSubject}`, {
253
268
  method: 'POST',
254
269
  body: { userInfo: realUserInfo, eventInfo: realEventInfo },
255
270
  type: 'beacon'
256
271
  });
257
- }, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, layoutVariantId, globalConfig, playbookType]);
272
+ }, [
273
+ bffFetch,
274
+ curReqInfo,
275
+ enableReportEvent,
276
+ globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
277
+ layoutVariantId,
278
+ globalConfig,
279
+ playbookType,
280
+ bffDataSource
281
+ ]);
258
282
  const bffFbReport = (0, react_1.useCallback)(({ eventName, product }) => {
259
- var _a, _b, _c, _d, _e;
283
+ var _a, _b, _c, _d, _e, _f;
260
284
  if (!enableReportEvent ||
261
285
  !enabledMetaConversionApi ||
262
286
  (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) ||
@@ -268,7 +292,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
268
292
  const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
269
293
  const fix_par = {
270
294
  event_source_url: (_c = window === null || window === void 0 ? void 0 : window.location) === null || _c === void 0 ? void 0 : _c.href,
271
- external_id: (0, localStore_1.storeAndLoadFeUserId)(),
295
+ external_id: fakeUserId,
272
296
  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 : '',
273
297
  fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
274
298
  fbp: (0, tool_1.getCookie)('_fbp') ? `fb.2.${new Date().getTime()}.${(0, tool_1.getCookie)('_fbp')}` : '',
@@ -320,22 +344,30 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
320
344
  }
321
345
  };
322
346
  getEventParams(jsonParams);
323
- return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/fb/events', {
347
+ 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}`, {
324
348
  method: 'POST',
325
349
  body: jsonParams,
326
350
  type: 'beacon'
327
351
  });
328
- }, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, globalConfig]);
352
+ }, [
353
+ bffFetch,
354
+ enableReportEvent,
355
+ enabledMetaConversionApi,
356
+ globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
357
+ globalConfig,
358
+ fakeUserId,
359
+ bffDataSource
360
+ ]);
329
361
  const bffMutateLike = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
330
- const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/like', { method: 'POST', body }));
362
+ const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
331
363
  return res === null || res === void 0 ? void 0 : res.success;
332
364
  }), [bffFetch]);
333
365
  const bffMutateUnlike = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
334
- const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/unlike', { method: 'POST', body }));
366
+ const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
335
367
  return res === null || res === void 0 ? void 0 : res.success;
336
368
  }), [bffFetch]);
337
369
  const bffSubmitForm = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
338
- const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/customform', { method: 'POST', body }));
370
+ const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
339
371
  return res === null || res === void 0 ? void 0 : res.success;
340
372
  }), [bffFetch]);
341
373
  const bffGetTagList = (0, react_1.useCallback)((data) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
@@ -349,7 +381,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
349
381
  const key = val.split('=')[0];
350
382
  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);
351
383
  })) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
352
- const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
384
+ const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
353
385
  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 : []);
354
386
  }
355
387
  catch (e) {
@@ -428,10 +460,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
428
460
  let curData;
429
461
  let gldata;
430
462
  if (data === null || data === void 0 ? void 0 : data.layoutVariantId) {
463
+ layId = data === null || data === void 0 ? void 0 : data.layoutVariantId;
464
+ setLayoutVariantId(data === null || data === void 0 ? void 0 : data.layoutVariantId);
431
465
  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];
432
466
  if (id) {
433
- layId = id;
434
- setLayoutVariantId(id);
435
467
  curData = dataList === null || dataList === void 0 ? void 0 : dataList.find((item) => (item === null || item === void 0 ? void 0 : item.id) === id);
436
468
  if (curData) {
437
469
  setPageData(curData);
@@ -38,14 +38,16 @@ 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 = '';
41
42
  if ((!(product === null || product === void 0 ? void 0 : product.currency) || !(product === null || product === void 0 ? void 0 : product.price)) && isHiddenDef)
42
43
  return null;
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 = '';
44
+ 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);
45
+ if (typeof price !== 'number')
46
+ return text;
45
47
  let priceSymbol = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.priceSymbol;
46
48
  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 : '' : '$';
47
49
  const isToLocStr = enableFormattedPrice === undefined || enableFormattedPrice;
48
- let decPic = price.toString();
50
+ let decPic = price === null || price === void 0 ? void 0 : price.toString();
49
51
  if (priceSymbol === null || priceSymbol === void 0 ? void 0 : priceSymbol.showTwoDecimalPoint) {
50
52
  decPic = price === null || price === void 0 ? void 0 : price.toFixed(2);
51
53
  }
@@ -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,21 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const tslib_1 = require("tslib");
4
+ const react_1 = tslib_1.__importStar(require("react"));
5
+ require("./index.less");
6
+ const tel_png_1 = tslib_1.__importDefault(require("./tel.png"));
7
+ const ConsentDetail_1 = tslib_1.__importDefault(require("../../popup/ConsentDetail"));
8
+ const Click = (_a) => {
9
+ var { isTel, open, content, style, consentPopupCate, acceptButton, rejectButton } = _a, props = tslib_1.__rest(_a, ["isTel", "open", "content", "style", "consentPopupCate", "acceptButton", "rejectButton"]);
10
+ const visivle = (0, react_1.useMemo)(() => {
11
+ return consentPopupCate || (open && style);
12
+ }, [consentPopupCate, open]);
13
+ const handleClickAccept = () => { };
14
+ const handleClickReject = () => { };
15
+ return (react_1.default.createElement(react_1.default.Fragment, null, isTel ? (react_1.default.createElement("img", { src: tel_png_1.default, style: { objectFit: 'cover', width: '100%', height: '100%' } })) : (react_1.default.createElement(react_1.default.Fragment, null, visivle && (react_1.default.createElement("div", { className: 'consentPopupClick' },
16
+ react_1.default.createElement("div", { className: 'consentPopupClick-container', style: style },
17
+ react_1.default.createElement(ConsentDetail_1.default, { content: content, style: { padding: 0 } }),
18
+ react_1.default.createElement("button", { style: acceptButton === null || acceptButton === void 0 ? void 0 : acceptButton.style, onClick: handleClickAccept }, acceptButton === null || acceptButton === void 0 ? void 0 : acceptButton.text),
19
+ react_1.default.createElement("button", { style: rejectButton === null || rejectButton === void 0 ? void 0 : rejectButton.style, onClick: handleClickReject }, rejectButton === null || rejectButton === void 0 ? void 0 : rejectButton.text))))))));
20
+ };
21
+ exports.default = (0, react_1.memo)(Click);
@@ -0,0 +1,2 @@
1
+ declare const Click: import("../../../../core/create").MaterialComponet<import(".").IClickProps>;
2
+ export { Click };
@@ -0,0 +1,52 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.Click = void 0;
4
+ const tslib_1 = require("tslib");
5
+ const settingRender_1 = tslib_1.__importDefault(require("./settingRender"));
6
+ const _1 = tslib_1.__importDefault(require("."));
7
+ const create_1 = require("../../../../core/create");
8
+ const Click = (0, create_1.createMaterial)(_1.default, {
9
+ displayName: 'Click Consent',
10
+ icon: '',
11
+ category: 'consentPopup',
12
+ type: 'Click',
13
+ related: {
14
+ settingRender: settingRender_1.default,
15
+ bindableProps: []
16
+ },
17
+ defaulSetting: {
18
+ props: {
19
+ 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>',
20
+ acceptButton: {
21
+ text: 'Accept all cookies',
22
+ style: {
23
+ backgroundColor: '#000',
24
+ height: 45,
25
+ color: '#fff',
26
+ fontSize: 12,
27
+ textAlign: 'center',
28
+ marginTop: 5,
29
+ marginBottom: 5
30
+ }
31
+ },
32
+ rejectButton: {
33
+ text: 'Reject all cookies',
34
+ style: {
35
+ backgroundColor: '#000',
36
+ height: 45,
37
+ color: '#fff',
38
+ fontSize: 12,
39
+ textAlign: 'center',
40
+ marginTop: 5,
41
+ marginBottom: 5
42
+ }
43
+ }
44
+ },
45
+ style: {
46
+ backgroundColor: '#fff',
47
+ padding: 18
48
+ }
49
+ },
50
+ sort: 2
51
+ });
52
+ exports.Click = Click;