@shopgate/engage 6.23.0-beta.2 → 6.23.0-beta.4
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/a11y/components/VisuallyHidden/index.js +8 -0
- package/a11y/components/index.js +1 -0
- package/a11y/index.js +1 -1
- package/components/Switch/index.js +9 -2
- package/components/Switch/style.js +1 -1
- package/package.json +7 -7
- package/push-opt-in/components/PushOptInModal/index.js +1 -1
- package/tracking/components/CookieConsentModal/index.js +2 -2
- package/tracking/components/CookieConsentModal/tracking-opt-in.svg +18 -0
- package/tracking/components/PrivacySettings/index.js +2 -2
- package/tracking/components/PrivacySettings/style.js +1 -1
- package/tracking/components/CookieConsentModal/cookieConsent.svg +0 -62
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from'react';import PropTypes from'prop-types';import{css}from'glamor';var styles={root:css({position:'absolute !important',height:'1px',width:'1px',overflow:'hidden',clip:'rect(1px, 1px, 1px, 1px)',whiteSpace:'nowrap'})};/**
|
|
2
|
+
* This component surrounds its children with a wrapper that takes care that they are not visible
|
|
3
|
+
* on the screen, but still accessible by a screen reader.
|
|
4
|
+
* @param {Object} props The component props
|
|
5
|
+
* @param {Object} [props.tag='span'] The tag to be used for the component
|
|
6
|
+
* @param {Object} props.children Component children
|
|
7
|
+
* @returns {JSX.Element}
|
|
8
|
+
*/var VisuallyHidden=function VisuallyHidden(_ref){var _ref$tag=_ref.tag,tag=_ref$tag===void 0?'span':_ref$tag,children=_ref.children;return/*#__PURE__*/React.createElement(tag,{className:styles.root},children);};VisuallyHidden.defaultProps={tag:'span'};export default VisuallyHidden;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export{default as LiveMessage}from"./LiveMessage";export{default as LiveMessenger}from"./LiveMessenger";export{default as Navigation}from"./Navigation";export{default as Section}from"./Section";export{default as VisuallyHidden}from"./VisuallyHidden";
|
package/a11y/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/** @module a11y */ // Components
|
|
2
|
-
export
|
|
2
|
+
export*from"./components";// Helpers
|
|
3
3
|
export*from"./components/LiveMessenger/helpers";// Constants
|
|
4
4
|
export*from"./components/LiveMessenger/constants";
|
|
@@ -1,5 +1,12 @@
|
|
|
1
|
-
import React,{useMemo}from'react';import PropTypes from'prop-types';import
|
|
1
|
+
import React,{useMemo}from'react';import PropTypes from'prop-types';import{VisuallyHidden}from'@shopgate/engage/a11y/components';import styles from"./style";/**
|
|
2
2
|
* The Switch component.
|
|
3
3
|
* @param {Object} props The component props.
|
|
4
|
+
* @param {React.ReactNode} [children=null] Component children are rendered as the checkbox label
|
|
5
|
+
* @param {boolean} [props.checked=false] Whether the checkbox is checked
|
|
6
|
+
* @param {boolean} [props.disabled=false] Whether the checkbox is disabled
|
|
7
|
+
* @param {Function} [props.onChange] Callback invoked when the checkbox changes
|
|
8
|
+
* @param {string} [props.a11yFallbackText=null] Optional text to be presented to screen readers
|
|
9
|
+
* when issues with the regular label are expected e.g. due to problematic layout.
|
|
10
|
+
* @param {string} [props.id=null] Optional custom id for checkbox input and label
|
|
4
11
|
* @returns {JSX.Element}
|
|
5
|
-
*/var Switch=function Switch(_ref){var disabled=_ref.disabled,checked=_ref.checked,onChange=_ref.onChange,id=_ref.id;var switchId=useMemo(function(){return id||Math.random();},[id]);return/*#__PURE__*/React.createElement("div",{className:styles.container},/*#__PURE__*/React.createElement("input",{
|
|
12
|
+
*/var Switch=function Switch(_ref){var disabled=_ref.disabled,checked=_ref.checked,onChange=_ref.onChange,id=_ref.id,a11yFallbackText=_ref.a11yFallbackText,children=_ref.children;var switchId=useMemo(function(){return id||Math.random();},[id]);return/*#__PURE__*/React.createElement("div",{className:styles.container},/*#__PURE__*/React.createElement("input",{type:"checkbox",disabled:disabled,checked:checked,onChange:onChange,className:styles.input,id:switchId}),children&&/*#__PURE__*/React.createElement("label",{htmlFor:switchId},/*#__PURE__*/React.createElement("span",{"aria-hidden":!!a11yFallbackText},children),a11yFallbackText&&/*#__PURE__*/React.createElement(VisuallyHidden,null,a11yFallbackText)));};Switch.defaultProps={children:null,disabled:false,a11yFallbackText:null,checked:false,onChange:null,id:null};export default Switch;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var container=css({display:'flex',flex:1,textAlign:'left',justifyContent:'space-between',flexDirection:'row-reverse',gap:'32px'});var input=css({display:'flex',flexShrink:0,appearance:'none',width:'40px',height:'20px',backgroundColor:'#ccc',borderRadius:'10px',position:'relative',cursor:'pointer',':before':{content:'""',position:'absolute',top:'2px',left:'2px',width:'16px',height:'16px',backgroundColor:'white',borderRadius:'50%',transition:'transform 0.3s'},':checked':{backgroundColor:themeConfig.colors.accent},':checked::before':{transform:'translateX(20px)'},':disabled':{backgroundColor:themeConfig.colors.shade7,cursor:'not-allowed'}});export default{container:container,input:input};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@shopgate/engage",
|
|
3
|
-
"version": "6.23.0-beta.
|
|
3
|
+
"version": "6.23.0-beta.4",
|
|
4
4
|
"description": "Shopgate's ENGAGE library.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Shopgate <support@shopgate.com>",
|
|
@@ -15,12 +15,12 @@
|
|
|
15
15
|
"connect"
|
|
16
16
|
],
|
|
17
17
|
"dependencies": {
|
|
18
|
-
"@shopgate/pwa-common": "6.23.0-beta.
|
|
19
|
-
"@shopgate/pwa-common-commerce": "6.23.0-beta.
|
|
20
|
-
"@shopgate/pwa-core": "6.23.0-beta.
|
|
21
|
-
"@shopgate/pwa-ui-ios": "6.23.0-beta.
|
|
22
|
-
"@shopgate/pwa-ui-material": "6.23.0-beta.
|
|
23
|
-
"@shopgate/pwa-ui-shared": "6.23.0-beta.
|
|
18
|
+
"@shopgate/pwa-common": "6.23.0-beta.4",
|
|
19
|
+
"@shopgate/pwa-common-commerce": "6.23.0-beta.4",
|
|
20
|
+
"@shopgate/pwa-core": "6.23.0-beta.4",
|
|
21
|
+
"@shopgate/pwa-ui-ios": "6.23.0-beta.4",
|
|
22
|
+
"@shopgate/pwa-ui-material": "6.23.0-beta.4",
|
|
23
|
+
"@shopgate/pwa-ui-shared": "6.23.0-beta.4",
|
|
24
24
|
"@virtuous/conductor": "~2.4.0",
|
|
25
25
|
"babel-plugin-transform-es3-member-expression-literals": "^6.8.0",
|
|
26
26
|
"babel-plugin-transform-es3-property-literals": "^6.8.0",
|
|
@@ -7,4 +7,4 @@ if(!modalImageURL&&!modalImageSVG){return pushImage;}// URL overwrite configured
|
|
|
7
7
|
if(modalImageURL){return modalImageURL;}// SVG overwrite configured -> create data url
|
|
8
8
|
try{// Remove any characters outside the Latin1 range
|
|
9
9
|
var decoded=decodeURIComponent(encodeURIComponent(modalImageSVG));// Now we can use btoa to convert the svg to base64
|
|
10
|
-
var base64=btoa(decoded);return"data:image/svg+xml;base64,".concat(base64);}catch(e){return pushImage;}},[modalImageSVG,modalImageURL]);if(!isPushOptInModalVisible){return null;}return/*#__PURE__*/React.createElement(Modal,{isOpened:isPushOptInModalVisible,classes:{content:styles.modalContent,layout:styles.modalLayout}},/*#__PURE__*/React.createElement(Grid,{className:classNames(styles.container,'push-opt-in-modal__container')},/*#__PURE__*/React.createElement(Grid.Item,{className:styles.item},/*#__PURE__*/React.createElement("img",{src:imageSRC,className:classNames(styles.image,'push-opt-in-modal__image'),alt:"","aria-hidden":"true"}),/*#__PURE__*/React.createElement(I18n.Text,{className:classNames(styles.title,'push-opt-in-modal__title'),string:modalTitle||'pushOptInModal.title'}),/*#__PURE__*/React.createElement(I18n.Text,{className:classNames('push-opt-in-modal__message'),string:modalMessage||'pushOptInModal.message'}),/*#__PURE__*/React.createElement(Button,{onClick:allowPushOptIn,type:"primary",className:classNames(styles.button,'push-opt-in-modal__button-allow')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonAllow||'pushOptInModal.buttonAllow'})),/*#__PURE__*/React.createElement(Button,{onClick:denyPushOptIn,type:"plain",className:classNames(styles.button,'push-opt-in-modal__button-deny')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonDeny||'pushOptInModal.buttonDeny',className:styles.buttonText})))));};export default connect(PushOptInModal);
|
|
10
|
+
var base64=btoa(decoded);return"data:image/svg+xml;base64,".concat(base64);}catch(e){return pushImage;}},[modalImageSVG,modalImageURL]);if(!isPushOptInModalVisible){return null;}return/*#__PURE__*/React.createElement(Modal,{isOpened:isPushOptInModalVisible,classes:{content:styles.modalContent,layout:styles.modalLayout}},/*#__PURE__*/React.createElement(Grid,{className:classNames(styles.container,'push-opt-in-modal__container'),role:"alertdialog","aria-modal":true,"aria-labelledby":"pushOptInDialogTitle","aria-describedby":"pushOptInDialogMessage"},/*#__PURE__*/React.createElement(Grid.Item,{className:styles.item},/*#__PURE__*/React.createElement("img",{src:imageSRC,className:classNames(styles.image,'push-opt-in-modal__image'),alt:"","aria-hidden":"true"}),/*#__PURE__*/React.createElement(I18n.Text,{className:classNames(styles.title,'push-opt-in-modal__title'),string:modalTitle||'pushOptInModal.title',id:"pushOptInDialogTitle"}),/*#__PURE__*/React.createElement(I18n.Text,{className:classNames('push-opt-in-modal__message'),string:modalMessage||'pushOptInModal.message',id:"pushOptInDialogMessage"}),/*#__PURE__*/React.createElement(Button,{onClick:allowPushOptIn,type:"primary",className:classNames(styles.button,'push-opt-in-modal__button-allow')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonAllow||'pushOptInModal.buttonAllow'})),/*#__PURE__*/React.createElement(Button,{onClick:denyPushOptIn,type:"plain",className:classNames(styles.button,'push-opt-in-modal__button-deny')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonDeny||'pushOptInModal.buttonDeny',className:styles.buttonText})))));};export default connect(PushOptInModal);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React,{useMemo}from'react';import PropTypes from'prop-types';import{Grid,I18n,Button,Modal,Link}from'@shopgate/engage/components';import{appConfig}from'@shopgate/engage';import{PRIVACY_PATH}from'@shopgate/engage/page';import classNames from'classnames';import connect from"./connector";import cookieImage from"./
|
|
1
|
+
import React,{useMemo}from'react';import PropTypes from'prop-types';import{Grid,I18n,Button,Modal,Link}from'@shopgate/engage/components';import{appConfig}from'@shopgate/engage';import{PRIVACY_PATH}from'@shopgate/engage/page';import classNames from'classnames';import connect from"./connector";import cookieImage from"./tracking-opt-in.svg";import styles from"./style";/**
|
|
2
2
|
* The cookie consent modal component.
|
|
3
3
|
* @param {Object} props The component props.
|
|
4
4
|
* @returns {JSX.Element}
|
|
@@ -7,4 +7,4 @@ if(!modalImageURL&&!modalImageSVG){return cookieImage;}// if URL overwrite confi
|
|
|
7
7
|
if(modalImageURL){return modalImageURL;}// if SVG overwrite configured: create data url
|
|
8
8
|
try{// Remove any characters outside the Latin1 range
|
|
9
9
|
var decoded=decodeURIComponent(encodeURIComponent(modalImageSVG));// Now we can use btoa to convert the svg to base64
|
|
10
|
-
var base64=btoa(decoded);return"data:image/svg+xml;base64,".concat(base64);}catch(e){return cookieImage;}},[modalImageSVG,modalImageURL]);if(!isCookieConsentModalVisible){return null;}return/*#__PURE__*/React.createElement(Modal,{isOpened:isCookieConsentModalVisible,classes:{content:styles.modalContent,layout:styles.modalLayout}},/*#__PURE__*/React.createElement(Grid,{component:"div",className:classNames(styles.container,'cookie-consent-modal__container')},/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.item},/*#__PURE__*/React.createElement("img",{src:imageSRC,className:classNames(styles.image,'cookie-consent-modal__image'),alt:"","aria-hidden":"true"}),/*#__PURE__*/React.createElement(I18n.Text,{className:classNames(styles.title,'cookie-consent-modal__title'),string:modalTitle||'cookieConsentModal.title'}),/*#__PURE__*/React.createElement(I18n.Text,{string:modalMessage||'cookieConsentModal.message',className:classNames('cookie-consent-modal__message'),acceptPlainTextWithPlaceholders:true},/*#__PURE__*/React.createElement(I18n.Placeholder,{forKey:"privacyLink"},/*#__PURE__*/React.createElement(Link,{href:PRIVACY_PATH,tag:"span"},/*#__PURE__*/React.createElement(I18n.Text,{string:"cookieConsentModal.privacyText",className:styles.link})))),/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.buttonWrapper},/*#__PURE__*/React.createElement(Button,{onClick:acceptAllCookies,type:"primary",className:classNames(styles.button,'cookie-consent-modal__button-accept-all')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonAcceptAll||'cookieConsentModal.buttonAcceptAll'})),showRequiredCookiesButton?/*#__PURE__*/React.createElement(Button,{onClick:acceptRequiredCookies,type:"simple",className:classNames(styles.button,'cookie-consent-modal__button-accept-required')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonOnlyRequired||'cookieConsentModal.modalButtonOnlyRequired'})):null,/*#__PURE__*/React.createElement(Button,{onClick:openPrivacySettings,type:"simple",className:classNames(styles.button,'cookie-consent-modal__button-open-settings')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonConfigureSettings||'cookieConsentModal.buttonConfigure'}))))));};export default connect(CookieConsentModal);
|
|
10
|
+
var base64=btoa(decoded);return"data:image/svg+xml;base64,".concat(base64);}catch(e){return cookieImage;}},[modalImageSVG,modalImageURL]);if(!isCookieConsentModalVisible){return null;}return/*#__PURE__*/React.createElement(Modal,{isOpened:isCookieConsentModalVisible,classes:{content:styles.modalContent,layout:styles.modalLayout}},/*#__PURE__*/React.createElement(Grid,{component:"div",className:classNames(styles.container,'cookie-consent-modal__container'),role:"alertdialog","aria-modal":true,"aria-labelledby":"cookieConsentDialogTitle","aria-describedby":"cookieConsentDialogMessage"},/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.item},/*#__PURE__*/React.createElement("img",{src:imageSRC,className:classNames(styles.image,'cookie-consent-modal__image'),alt:"","aria-hidden":"true"}),/*#__PURE__*/React.createElement(I18n.Text,{className:classNames(styles.title,'cookie-consent-modal__title'),string:modalTitle||'cookieConsentModal.title',id:"cookieConsentDialogTitle"}),/*#__PURE__*/React.createElement(I18n.Text,{string:modalMessage||'cookieConsentModal.message',className:classNames('cookie-consent-modal__message'),acceptPlainTextWithPlaceholders:true,id:"cookieConsentDialogMessage"},/*#__PURE__*/React.createElement(I18n.Placeholder,{forKey:"privacyLink"},/*#__PURE__*/React.createElement(Link,{href:PRIVACY_PATH,tag:"span"},/*#__PURE__*/React.createElement(I18n.Text,{string:"cookieConsentModal.privacyText",className:styles.link})))),/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.buttonWrapper},/*#__PURE__*/React.createElement(Button,{onClick:acceptAllCookies,type:"primary",className:classNames(styles.button,'cookie-consent-modal__button-accept-all')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonAcceptAll||'cookieConsentModal.buttonAcceptAll'})),showRequiredCookiesButton?/*#__PURE__*/React.createElement(Button,{onClick:acceptRequiredCookies,type:"simple",className:classNames(styles.button,'cookie-consent-modal__button-accept-required')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonOnlyRequired||'cookieConsentModal.modalButtonOnlyRequired'})):null,/*#__PURE__*/React.createElement(Button,{onClick:openPrivacySettings,type:"simple",className:classNames(styles.button,'cookie-consent-modal__button-open-settings')},/*#__PURE__*/React.createElement(I18n.Text,{string:modalButtonConfigureSettings||'cookieConsentModal.buttonConfigure'}))))));};export default connect(CookieConsentModal);
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
2
|
+
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
3
|
+
<svg width="100%" height="100%" viewBox="0 0 895 895" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
|
4
|
+
<g transform="matrix(1,0,0,1,-197.772,-376.125)">
|
|
5
|
+
<g transform="matrix(1.28727,0,0,1.28727,-185.288,-236.524)">
|
|
6
|
+
<g transform="matrix(1.25456,0,0,1.25456,-164.192,-209.593)">
|
|
7
|
+
<circle cx="645" cy="823.354" r="276.929" style="fill:rgb(235,235,235);"/>
|
|
8
|
+
</g>
|
|
9
|
+
<g transform="matrix(17.6233,0,0,17.6233,433.521,611.874)">
|
|
10
|
+
<path d="M12,0C8.629,2.866 6.516,3 3,3L3,14.535C3,19.138 6.203,20.339 12,24C17.797,20.339 21,19.138 21,14.535L21,3C17.484,3 15.371,2.866 12,0Z" style="fill:rgb(255,115,115);fill-rule:nonzero;"/>
|
|
11
|
+
<path d="M12.99,-1.164C12.419,-1.649 11.581,-1.649 11.01,-1.164C8.014,1.383 6.125,1.472 3,1.472C2.156,1.472 1.472,2.156 1.472,3L1.472,14.535C1.472,17.357 2.45,19.137 4.32,20.771C5.891,22.144 8.2,23.407 11.184,25.292C11.682,25.607 12.318,25.607 12.816,25.292C15.8,23.407 18.109,22.144 19.68,20.771C21.55,19.137 22.528,17.357 22.528,14.535L22.528,3C22.528,2.156 21.844,1.472 21,1.472C17.875,1.472 15.986,1.383 12.99,-1.164ZM12,0C8.629,2.866 6.516,3 3,3L3,14.535C3,19.138 6.203,20.339 12,24C17.797,20.339 21,19.138 21,14.535L21,3C17.484,3 15.371,2.866 12,0Z" style="fill:rgb(216,216,216);"/>
|
|
12
|
+
</g>
|
|
13
|
+
<g transform="matrix(24.4351,0,0,24.4351,340.416,541.775)">
|
|
14
|
+
<path d="M15.762,8.047L11.381,12.522L9.166,10.399L7.93,11.638L11.381,15L17,9.285L15.762,8.047Z" style="fill:white;fill-rule:nonzero;"/>
|
|
15
|
+
</g>
|
|
16
|
+
</g>
|
|
17
|
+
</g>
|
|
18
|
+
</svg>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen);}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useCallback,useState}from'react';import{Button,Grid,I18n,Link,Switch}from'@shopgate/engage/components';import PropTypes from'prop-types';import{PRIVACY_PATH}from'@shopgate/engage/page';import{appConfig}from'@shopgate/engage';import classNames from'classnames';import styles from"./style";import connect from"./connector";/**
|
|
1
|
+
function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen);}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useCallback,useState}from'react';import{Button,Grid,I18n,Link,Switch}from'@shopgate/engage/components';import PropTypes from'prop-types';import{PRIVACY_PATH}from'@shopgate/engage/page';import{appConfig}from'@shopgate/engage';import{i18n}from'@shopgate/engage/core';import classNames from'classnames';import styles from"./style";import connect from"./connector";/**
|
|
2
2
|
* The PrivacySettings component.
|
|
3
3
|
* @returns {JSX.Element}
|
|
4
|
-
*/var PrivacySettings=function PrivacySettings(_ref){var acceptAllCookies=_ref.acceptAllCookies,acceptSelectedCookies=_ref.acceptSelectedCookies,comfortCookiesAcceptedState=_ref.comfortCookiesAcceptedState,statisticsCookiesAcceptedState=_ref.statisticsCookiesAcceptedState;var _appConfig$cookieCons=appConfig.cookieConsent;_appConfig$cookieCons=_appConfig$cookieCons===void 0?{}:_appConfig$cookieCons;var settingsComfortText=_appConfig$cookieCons.settingsComfortText,settingsComfortTitle=_appConfig$cookieCons.settingsComfortTitle,settingsStatisticsText=_appConfig$cookieCons.settingsStatisticsText,settingsStatisticsTitle=_appConfig$cookieCons.settingsStatisticsTitle,settingsRequiredText=_appConfig$cookieCons.settingsRequiredText,settingsRequiredTitle=_appConfig$cookieCons.settingsRequiredTitle;var _useState=useState(comfortCookiesAcceptedState!==null?comfortCookiesAcceptedState:false),_useState2=_slicedToArray(_useState,2),areComfortCookiesSelected=_useState2[0],setAreComfortCookiesSelected=_useState2[1];var _useState3=useState(statisticsCookiesAcceptedState!==null?statisticsCookiesAcceptedState:false),_useState4=_slicedToArray(_useState3,2),areStatisticsCookiesSelected=_useState4[0],setAreStatisticsCookiesSelected=_useState4[1];var handleChangeComfortCookies=useCallback(function(){setAreComfortCookiesSelected(!areComfortCookiesSelected);},[areComfortCookiesSelected]);var handleChangeStatisticsCookies=useCallback(function(){setAreStatisticsCookiesSelected(!areStatisticsCookiesSelected);},[areStatisticsCookiesSelected]);var handleAcceptAllCookies=useCallback(function(){setAreStatisticsCookiesSelected(true);setAreComfortCookiesSelected(true);acceptAllCookies();},[acceptAllCookies]);return/*#__PURE__*/React.createElement(Grid,{component:"div",className:styles.container},/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.item},/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.switchWrapper},/*#__PURE__*/React.createElement("
|
|
4
|
+
*/var PrivacySettings=function PrivacySettings(_ref){var acceptAllCookies=_ref.acceptAllCookies,acceptSelectedCookies=_ref.acceptSelectedCookies,comfortCookiesAcceptedState=_ref.comfortCookiesAcceptedState,statisticsCookiesAcceptedState=_ref.statisticsCookiesAcceptedState;var _appConfig$cookieCons=appConfig.cookieConsent;_appConfig$cookieCons=_appConfig$cookieCons===void 0?{}:_appConfig$cookieCons;var settingsComfortText=_appConfig$cookieCons.settingsComfortText,settingsComfortTitle=_appConfig$cookieCons.settingsComfortTitle,settingsStatisticsText=_appConfig$cookieCons.settingsStatisticsText,settingsStatisticsTitle=_appConfig$cookieCons.settingsStatisticsTitle,settingsRequiredText=_appConfig$cookieCons.settingsRequiredText,settingsRequiredTitle=_appConfig$cookieCons.settingsRequiredTitle;var _useState=useState(comfortCookiesAcceptedState!==null?comfortCookiesAcceptedState:false),_useState2=_slicedToArray(_useState,2),areComfortCookiesSelected=_useState2[0],setAreComfortCookiesSelected=_useState2[1];var _useState3=useState(statisticsCookiesAcceptedState!==null?statisticsCookiesAcceptedState:false),_useState4=_slicedToArray(_useState3,2),areStatisticsCookiesSelected=_useState4[0],setAreStatisticsCookiesSelected=_useState4[1];var handleChangeComfortCookies=useCallback(function(){setAreComfortCookiesSelected(!areComfortCookiesSelected);},[areComfortCookiesSelected]);var handleChangeStatisticsCookies=useCallback(function(){setAreStatisticsCookiesSelected(!areStatisticsCookiesSelected);},[areStatisticsCookiesSelected]);var handleAcceptAllCookies=useCallback(function(){setAreStatisticsCookiesSelected(true);setAreComfortCookiesSelected(true);acceptAllCookies();},[acceptAllCookies]);return/*#__PURE__*/React.createElement(Grid,{component:"div",className:styles.container},/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.item},/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.switchWrapper},/*#__PURE__*/React.createElement(Switch,{onChange:handleChangeComfortCookies,checked:areComfortCookiesSelected,a11yFallbackText:"".concat(i18n.text(settingsComfortTitle||'cookieSettings.comfortTitle'),". ").concat(i18n.text(settingsComfortText||'cookieSettings.comfort'))},/*#__PURE__*/React.createElement("span",{className:styles.title},/*#__PURE__*/React.createElement(I18n.Text,{string:settingsComfortTitle||'cookieSettings.comfortTitle'})),/*#__PURE__*/React.createElement("span",null,/*#__PURE__*/React.createElement(I18n.Text,{string:settingsComfortText||'cookieSettings.comfort'})))),/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.switchWrapper},/*#__PURE__*/React.createElement(Switch,{onChange:handleChangeStatisticsCookies,checked:areStatisticsCookiesSelected,a11yFallbackText:"".concat(i18n.text(settingsStatisticsTitle||'cookieSettings.statisticsTitle'),". ").concat(i18n.text(settingsStatisticsText||'cookieSettings.statistics'))},/*#__PURE__*/React.createElement("span",{className:styles.title},/*#__PURE__*/React.createElement(I18n.Text,{string:settingsStatisticsTitle||'cookieSettings.statisticsTitle'})),/*#__PURE__*/React.createElement("span",null,/*#__PURE__*/React.createElement(I18n.Text,{string:settingsStatisticsText||'cookieSettings.statistics'})))),/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.switchWrapper},/*#__PURE__*/React.createElement(Switch,{disabled:true,checked:true,a11yFallbackText:"".concat(i18n.text(settingsRequiredTitle||'cookieSettings.requiredTitle'),". ").concat(i18n.text(settingsRequiredText||'cookieSettings.required'))},/*#__PURE__*/React.createElement("span",{className:styles.title},/*#__PURE__*/React.createElement(I18n.Text,{string:settingsRequiredTitle||'cookieSettings.requiredTitle'})),/*#__PURE__*/React.createElement("span",null,/*#__PURE__*/React.createElement(I18n.Text,{string:settingsRequiredText||'cookieSettings.required'}))))),/*#__PURE__*/React.createElement(Grid.Item,{component:"div",className:styles.buttonWrapper},/*#__PURE__*/React.createElement(Button,{onClick:function onClick(){return handleAcceptAllCookies();},type:"primary",className:classNames(styles.button,'privacy-settings__button-accept-all')},/*#__PURE__*/React.createElement(I18n.Text,{string:"cookieConsentModal.buttonAcceptAll"})),/*#__PURE__*/React.createElement(Button,{onClick:function onClick(){return acceptSelectedCookies({comfortCookiesAccepted:areComfortCookiesSelected,statisticsCookiesAccepted:areStatisticsCookiesSelected});},type:"simple",className:classNames(styles.button,'privacy-settings__button-accept-selected')},/*#__PURE__*/React.createElement(I18n.Text,{string:"cookieConsentModal.modalButtonConfirmSelected"}))),/*#__PURE__*/React.createElement(Grid.Item,{component:"div"},/*#__PURE__*/React.createElement(I18n.Text,{string:"cookieSettings.privacy"},/*#__PURE__*/React.createElement(I18n.Placeholder,{forKey:"privacyLink"},/*#__PURE__*/React.createElement(Link,{href:PRIVACY_PATH,tag:"span"},/*#__PURE__*/React.createElement(I18n.Text,{string:"cookieConsentModal.privacyText",className:styles.link}))))));};PrivacySettings.defaultProps={comfortCookiesAcceptedState:null,statisticsCookiesAcceptedState:null};export default connect(PrivacySettings);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{css}from'glamor';import{themeColors}from'@shopgate/pwa-common/helpers/config';var button=css({marginTop:'20px'}).toString();var container=css({flexDirection:'column',height:'100vh',textAlign:'center',padding:'30px',justifyContent:'center',display:'flex'}).toString();var buttonWrapper=css({display:'flex',flexDirection:'column',marginBottom:'30px'}).toString();var item=css({display:'flex',flexDirection:'column'}).toString();var link=css({color:themeColors.accent,textDecoration:'underline'}).toString();var switchWrapper=css({marginBottom:'25px',display:'flex',textAlign:'left',justifyContent:'space-between'}).toString();var title=css({fontWeight:'bold',display:'block'
|
|
1
|
+
import{css}from'glamor';import{themeColors}from'@shopgate/pwa-common/helpers/config';var button=css({marginTop:'20px'}).toString();var container=css({flexDirection:'column',height:'100vh',textAlign:'center',padding:'30px',justifyContent:'center',display:'flex'}).toString();var buttonWrapper=css({display:'flex',flexDirection:'column',marginBottom:'30px'}).toString();var item=css({display:'flex',flexDirection:'column'}).toString();var link=css({color:themeColors.accent,textDecoration:'underline'}).toString();var switchWrapper=css({marginBottom:'25px',display:'flex',textAlign:'left',justifyContent:'space-between'}).toString();var title=css({fontWeight:'bold',display:'block'});export default{button:button,container:container,buttonWrapper:buttonWrapper,link:link,item:item,switchWrapper:switchWrapper,title:title};
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
2
|
-
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
3
|
-
<svg width="100%" height="100%" viewBox="0 0 1107 791" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
|
4
|
-
<g transform="matrix(1,0,0,1,-88.9596,-502.577)">
|
|
5
|
-
<g transform="matrix(1.28381,0,0,1.28381,-145.009,-328.293)">
|
|
6
|
-
<g>
|
|
7
|
-
<g transform="matrix(0.738616,0,0,0.7166,142.625,351.19)">
|
|
8
|
-
<path d="M1052.9,1091.68C1052.9,1062.46 1029.88,1038.73 1001.53,1038.73L244.024,1038.73C215.667,1038.73 192.646,1062.46 192.646,1091.68L192.646,1219.08C192.646,1248.3 215.667,1272.03 244.024,1272.03L1001.53,1272.03C1029.88,1272.03 1052.9,1248.3 1052.9,1219.08L1052.9,1091.68Z" style="fill:rgb(193,193,193);"/>
|
|
9
|
-
</g>
|
|
10
|
-
<g transform="matrix(0.859568,0,0,0.833947,80.1965,145.713)">
|
|
11
|
-
<path d="M1052.9,1091.68C1052.9,1062.46 1029.88,1038.73 1001.53,1038.73L244.024,1038.73C215.667,1038.73 192.646,1062.46 192.646,1091.68L192.646,1219.08C192.646,1248.3 215.667,1272.03 244.024,1272.03L1001.53,1272.03C1029.88,1272.03 1052.9,1248.3 1052.9,1219.08L1052.9,1091.68Z" style="fill:rgb(216,216,216);"/>
|
|
12
|
-
</g>
|
|
13
|
-
<g transform="matrix(1.00203,0,0,0.972164,-10.791,-90.8989)">
|
|
14
|
-
<path d="M1052.9,1091.68C1052.9,1062.46 1029.88,1038.73 1001.53,1038.73L244.024,1038.73C215.667,1038.73 192.646,1062.46 192.646,1091.68L192.646,1219.08C192.646,1248.3 215.667,1272.03 244.024,1272.03L1001.53,1272.03C1029.88,1272.03 1052.9,1248.3 1052.9,1219.08L1052.9,1091.68Z" style="fill:rgb(235,235,235);"/>
|
|
15
|
-
</g>
|
|
16
|
-
<g transform="matrix(1.00203,0,0,0.972164,-10.791,-362.62)">
|
|
17
|
-
<path d="M1052.9,1091.68C1052.9,1062.46 1029.88,1038.73 1001.53,1038.73L244.024,1038.73C215.667,1038.73 192.646,1062.46 192.646,1091.68L192.646,1219.08C192.646,1248.3 215.667,1272.03 244.024,1272.03L1001.53,1272.03C1029.88,1272.03 1052.9,1248.3 1052.9,1219.08L1052.9,1091.68Z" style="fill:rgb(235,235,235);"/>
|
|
18
|
-
</g>
|
|
19
|
-
</g>
|
|
20
|
-
<g transform="matrix(1.00052,0,0,1,-19.3912,30.3377)">
|
|
21
|
-
<path d="M953.776,1037.91C953.776,1035.43 951.762,1033.42 949.281,1033.42L424.519,1033.42C422.039,1033.42 420.025,1035.43 420.025,1037.91L420.025,1061.27C420.025,1063.75 422.039,1065.77 424.519,1065.77L949.281,1065.77C951.762,1065.77 953.776,1063.75 953.776,1061.27L953.776,1037.91Z" style="fill:rgb(187,196,198);fill-opacity:0.65;"/>
|
|
22
|
-
</g>
|
|
23
|
-
<g transform="matrix(0.823791,0,0,1,54.8392,-16.3916)">
|
|
24
|
-
<path d="M953.776,1037.91C953.776,1035.43 951.33,1033.42 948.317,1033.42L425.484,1033.42C422.471,1033.42 420.025,1035.43 420.025,1037.91L420.025,1061.27C420.025,1063.75 422.471,1065.77 425.484,1065.77L948.317,1065.77C951.33,1065.77 953.776,1063.75 953.776,1061.27L953.776,1037.91Z" style="fill:rgb(187,196,198);fill-opacity:0.65;"/>
|
|
25
|
-
</g>
|
|
26
|
-
<g transform="matrix(0.904048,0,0,1,21.129,-67.1309)">
|
|
27
|
-
<path d="M953.776,1037.91C953.776,1035.43 951.547,1033.42 948.801,1033.42L424.999,1033.42C422.254,1033.42 420.025,1035.43 420.025,1037.91L420.025,1061.27C420.025,1063.75 422.254,1065.77 424.999,1065.77L948.801,1065.77C951.547,1065.77 953.776,1063.75 953.776,1061.27L953.776,1037.91Z" style="fill:rgb(187,196,198);fill-opacity:0.65;"/>
|
|
28
|
-
</g>
|
|
29
|
-
<g transform="matrix(1.02071,0,0,1.04641,-38.8586,-763.331)">
|
|
30
|
-
<path d="M393.702,1679.71C393.702,1660.56 377.767,1645.02 358.141,1645.02L287.019,1645.02C267.393,1645.02 251.458,1660.56 251.458,1679.71L251.458,1749.29C251.458,1768.44 267.393,1783.98 287.019,1783.98L358.141,1783.98C377.767,1783.98 393.702,1768.44 393.702,1749.29L393.702,1679.71Z" style="fill:rgb(255,115,115);"/>
|
|
31
|
-
<clipPath id="_clip1">
|
|
32
|
-
<path d="M393.702,1679.71C393.702,1660.56 377.767,1645.02 358.141,1645.02L287.019,1645.02C267.393,1645.02 251.458,1660.56 251.458,1679.71L251.458,1749.29C251.458,1768.44 267.393,1783.98 287.019,1783.98L358.141,1783.98C377.767,1783.98 393.702,1768.44 393.702,1749.29L393.702,1679.71Z"/>
|
|
33
|
-
</clipPath>
|
|
34
|
-
<g clip-path="url(#_clip1)">
|
|
35
|
-
<g transform="matrix(0.76313,0,0,0.744387,148.731,1102.32)">
|
|
36
|
-
<path d="M226.411,745.537L243.421,797.888L298.467,797.888L253.934,830.243L270.944,882.594L226.411,850.239L181.879,882.594L198.889,830.243L154.356,797.888L209.402,797.888L226.411,745.537Z" style="fill:white;"/>
|
|
37
|
-
</g>
|
|
38
|
-
</g>
|
|
39
|
-
</g>
|
|
40
|
-
<g transform="matrix(0.933678,0,0,1,8.6838,-241.981)">
|
|
41
|
-
<path d="M953.776,1037.91C953.776,1035.43 951.617,1033.42 948.959,1033.42L424.841,1033.42C422.183,1033.42 420.025,1035.43 420.025,1037.91L420.025,1061.27C420.025,1063.75 422.183,1065.77 424.841,1065.77L948.959,1065.77C951.617,1065.77 953.776,1063.75 953.776,1061.27L953.776,1037.91Z" style="fill:rgb(187,196,198);fill-opacity:0.65;"/>
|
|
42
|
-
</g>
|
|
43
|
-
<g transform="matrix(1,0,0,1,-19.173,-288.71)">
|
|
44
|
-
<path d="M953.776,1037.91C953.776,1035.43 951.761,1033.42 949.279,1033.42L424.522,1033.42C422.04,1033.42 420.025,1035.43 420.025,1037.91L420.025,1061.27C420.025,1063.75 422.04,1065.77 424.522,1065.77L949.279,1065.77C951.761,1065.77 953.776,1063.75 953.776,1061.27L953.776,1037.91Z" style="fill:rgb(187,196,198);fill-opacity:0.65;"/>
|
|
45
|
-
</g>
|
|
46
|
-
<g transform="matrix(0.844941,0,0,1,45.9556,-337.889)">
|
|
47
|
-
<path d="M953.776,1037.91C953.776,1035.43 951.391,1033.42 948.453,1033.42L425.347,1033.42C422.409,1033.42 420.025,1035.43 420.025,1037.91L420.025,1061.27C420.025,1063.75 422.409,1065.77 425.347,1065.77L948.453,1065.77C951.391,1065.77 953.776,1063.75 953.776,1061.27L953.776,1037.91Z" style="fill:rgb(187,196,198);fill-opacity:0.65;"/>
|
|
48
|
-
</g>
|
|
49
|
-
<g transform="matrix(1.02071,0,0,1.04641,-38.8586,-1035.65)">
|
|
50
|
-
<path d="M393.702,1679.71C393.702,1660.56 377.767,1645.02 358.141,1645.02L287.019,1645.02C267.393,1645.02 251.458,1660.56 251.458,1679.71L251.458,1749.29C251.458,1768.44 267.393,1783.98 287.019,1783.98L358.141,1783.98C377.767,1783.98 393.702,1768.44 393.702,1749.29L393.702,1679.71Z" style="fill:rgb(255,115,115);"/>
|
|
51
|
-
<clipPath id="_clip2">
|
|
52
|
-
<path d="M393.702,1679.71C393.702,1660.56 377.767,1645.02 358.141,1645.02L287.019,1645.02C267.393,1645.02 251.458,1660.56 251.458,1679.71L251.458,1749.29C251.458,1768.44 267.393,1783.98 287.019,1783.98L358.141,1783.98C377.767,1783.98 393.702,1768.44 393.702,1749.29L393.702,1679.71Z"/>
|
|
53
|
-
</clipPath>
|
|
54
|
-
<g clip-path="url(#_clip2)">
|
|
55
|
-
<g transform="matrix(0.979712,0,0,0.955649,69.3286,762.785)">
|
|
56
|
-
<text x="193.673px" y="1041.62px" style="font-family:'HelveticaNeue-Bold', 'Helvetica Neue';font-weight:700;font-size:128px;fill:white;">%</text>
|
|
57
|
-
</g>
|
|
58
|
-
</g>
|
|
59
|
-
</g>
|
|
60
|
-
</g>
|
|
61
|
-
</g>
|
|
62
|
-
</svg>
|