pb-sxp-ui 14.0.6 → 14.0.7

package/es/materials/sxp/consentPopup/Swipe/index.js

@@ -0,0 +1,44 @@
+import { __rest } from "tslib";
+import React, { memo, useMemo, useRef } from 'react';
+import './index.less';
+import tel from './tel.png';
+import ConsentDetail from '../../popup/ConsentDetail';
+const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
+const Swipe = (_a) => {
+    var { isTel, open, content, style, consentPopupCate, swipeIcon } = _a, props = __rest(_a, ["isTel", "open", "content", "style", "consentPopupCate", "swipeIcon"]);
+    const touchInfo = useRef();
+    const threshold = 50;
+    const handleTouchStart = (event) => {
+        const touch = event.touches[0];
+        touchInfo.current = { y: touch.clientY, d: 0 };
+    };
+    const handleTouchMove = (event) => {
+        var _a;
+        if (!touchInfo.current)
+            return;
+        const touch = event.touches[0];
+        const dy = touch.clientY - ((_a = touchInfo === null || touchInfo === void 0 ? void 0 : touchInfo.current) === null || _a === void 0 ? void 0 : _a.y);
+        const currentDistance = Math.abs(dy);
+        touchInfo.current = Object.assign(Object.assign({}, touchInfo.current), { d: currentDistance });
+    };
+    const handleTouchEnd = () => {
+        if (!touchInfo.current)
+            return;
+        const { d } = touchInfo.current || {};
+        if (d > threshold) {
+        }
+        touchInfo.current = {};
+    };
+    const handleClickReject = () => { };
+    const visivle = useMemo(() => {
+        return consentPopupCate || (open && style);
+    }, [consentPopupCate, open]);
+    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 },
+        React.createElement("div", { className: 'consentPopupSwipe-container', style: style },
+            React.createElement(ConsentDetail, { content: content, style: { padding: 0 } }),
+            React.createElement("button", { "aria-label": 'close', className: 'consentPopupSwipe-container-close', onClick: handleClickReject },
+                React.createElement("img", { src: closeIcon, alt: 'close' })),
+            swipeIcon && (React.createElement("div", { className: 'consentPopupSwipe-container-swipeIcon', onClick: handleClickReject },
+                React.createElement("img", { src: swipeIcon, alt: 'Swipe Icon' }))))))))));
+};
+export default memo(Swipe);

package/es/materials/sxp/consentPopup/Swipe/material.d.ts

@@ -0,0 +1,2 @@
+declare const Swipe: import("../../../../core/create").MaterialComponet<import(".").ISwipeProps>;
+export { Swipe };

package/es/materials/sxp/consentPopup/Swipe/material.js

@@ -0,0 +1,24 @@
+import settingRender from './settingRender';
+import SwipeComponent from '.';
+import { createMaterial } from '../../../../core/create';
+const Swipe = createMaterial(SwipeComponent, {
+    displayName: 'Swipe Consent',
+    icon: '',
+    category: 'consentPopup',
+    type: 'Swipe',
+    related: {
+        settingRender,
+        bindableProps: []
+    },
+    defaulSetting: {
+        props: {
+            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>'
+        },
+        style: {
+            backgroundColor: '#fff',
+            padding: 18
+        }
+    },
+    sort: 3
+});
+export { Swipe };

package/es/materials/sxp/consentPopup/Swipe/settingRender.d.ts

@@ -0,0 +1,29 @@
+declare const _default: ({
+    title: string;
+    child: ({
+        type: string;
+        label: string;
+        name: string[];
+        addonAfter?: undefined;
+    } | {
+        type: string;
+        label: string;
+        name: string[];
+        addonAfter: string;
+    })[];
+} | {
+    title: string;
+    child: {
+        type: string;
+        name: string[];
+    }[];
+} | {
+    title: string;
+    child: {
+        type: string;
+        label: string;
+        name: string[];
+        text: string;
+    }[];
+})[];
+export default _default;

package/es/materials/sxp/consentPopup/Swipe/settingRender.js

@@ -0,0 +1,43 @@
+export default [
+    {
+        title: '全局设置',
+        child: [
+            {
+                type: 'Switch',
+                label: '弹窗开关',
+                name: ['props', 'open']
+            },
+            {
+                type: 'Color',
+                label: '背景色',
+                name: ['style', 'backgroundColor']
+            },
+            {
+                type: 'Number',
+                label: '内边距',
+                name: ['style', 'padding'],
+                addonAfter: 'px'
+            }
+        ]
+    },
+    {
+        title: '弹窗文本',
+        child: [
+            {
+                type: 'RichText',
+                name: ['props', 'content']
+            }
+        ]
+    },
+    {
+        title: '滑动图标',
+        child: [
+            {
+                type: 'Upload',
+                label: '滑动图标',
+                name: ['props', 'swipeIcon'],
+                text: '建议尺寸：252 * 185'
+            }
+        ]
+    }
+];

package/es/materials/sxp/consentPopup/index.d.ts

@@ -1 +1,3 @@
 export * from './Display/material';
+export * from './Click/material';
+export * from './Swipe/material';

package/es/materials/sxp/consentPopup/index.js

@@ -1 +1,3 @@
 export * from './Display/material';
+export * from './Click/material';
+export * from './Swipe/material';

package/es/materials/sxp/cta/AniLink/index.js

@@ -35,7 +35,7 @@ const AniLink = (_a) => {
             onClick === null || onClick === void 0 ? void 0 : onClick();
         }
     };
-    const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
+    const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || 'Show More';
     const aniTimStyle = useMemo(() => {
         var _a, _b;
         const ani = event === null || event === void 0 ? void 0 : event.animation;

package/es/materials/sxp/cta/AniLinkPopup/index.js

@@ -35,7 +35,7 @@ const AniLinkPopup = (_a) => {
             onClick === null || onClick === void 0 ? void 0 : onClick();
         }
     };
-    const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
+    const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || 'Show More';
     const aniTimStyle = useMemo(() => {
         const ani = event === null || event === void 0 ? void 0 : event.animation;
         if (ani) {

package/es/materials/sxp/popup/ConsentDetail/index.d.ts

@@ -1,8 +1,9 @@
-import React from 'react';
+import React, { CSSProperties } from 'react';
 import './index.less';
 export interface IConsentDetailProps {
     content?: string;
     isTel?: boolean;
+    style?: CSSProperties;
 }
 declare const _default: React.NamedExoticComponent<IConsentDetailProps>;
 export default _default;

package/es/materials/sxp/popup/ConsentDetail/index.js

@@ -2,11 +2,11 @@ import { __rest } from "tslib";
 import React, { memo } from 'react';
 import './index.less';
 const ConsentDetail = (_a) => {
-    var { content, isTel } = _a, props = __rest(_a, ["content", "isTel"]);
+    var { content, isTel, style } = _a, props = __rest(_a, ["content", "isTel", "style"]);
     return (React.createElement("article", { className: 'consentDetail-article', dangerouslySetInnerHTML: {
             __html: typeof content === 'string' ? content : ''
         }, onClick: (e) => {
             e.stopPropagation();
-        } }));
+        }, style: style }));
 };
 export default memo(ConsentDetail);

package/lib/core/components/SxpPageRender/ConsentPopup.js

@@ -4,15 +4,15 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 require("./index.less");
 const withBindDataSource_1 = tslib_1.__importDefault(require("../../../core/hoc/withBindDataSource"));
-const localStore_1 = require("../../../core/utils/localStore");
+const EditorDataProvider_1 = require("../../../core/context/EditorDataProvider");
 const Consent = ({ resolver, globalConfig }) => {
     var _a, _b;
-    const contsentState = (0, react_1.useMemo)(() => {
-        return (0, localStore_1.getContsentState)();
-    }, []);
-    const t = resolver === null || resolver === void 0 ? void 0 : resolver['Display'];
-    const Component = (0, withBindDataSource_1.default)(t);
+    const { consentPopupCate } = (0, EditorDataProvider_1.useEditorDataProvider)();
     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;
-    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 }));
+    if (!value)
+        return null;
+    const t = resolver === null || resolver === void 0 ? void 0 : resolver[value === null || value === void 0 ? void 0 : value.type];
+    const Component = (0, withBindDataSource_1.default)(t);
+    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 })));
 };
 exports.default = (0, react_1.memo)(Consent);

package/lib/core/components/SxpPageRender/Navbar.js

@@ -11,7 +11,7 @@ const Navbar = ({ icon, styles, textStyle, onClose }) => {
         react_1.default.createElement("button", { className: 'clc-sxp-nav-left', role: 'button', "aria-label": 'back button', onClick: onClose },
             react_1.default.createElement("img", { src: icon, alt: 'back button' })),
         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: {
-                __html: (0, tool_1.setFontForText)(`#${(_a = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag) !== null && _a !== void 0 ? _a : '标题'}`, textStyle)
+                __html: (0, tool_1.setFontForText)(`#${(_a = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag) !== null && _a !== void 0 ? _a : 'title'}`, textStyle)
             } })));
 };
 exports.default = (0, react_1.memo)(Navbar);