@shopgate/pwa-ui-shared 7.28.0 → 7.29.0-alpha.10

package/ActionButton/style.js

@@ -1 +1 @@
-function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var halfGapBig=themeConfig.variables.gap.big/2;var containerBase={textAlign:'center'};var container=css(_extends({},containerBase,{margin:"".concat(halfGapBig,"px 0")})).toString();var noGapContainer=css(_extends({},containerBase)).toString();var containerCircle=css(_extends({},containerBase,{margin:"".concat(halfGapBig+4,"px 0")})).toString();export default{container:container,containerCircle:containerCircle,noGapContainer:noGapContainer};
+function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var halfGapBig=themeConfig.variables.gap.big/2;var containerBase={textAlign:'center'};var container=css(_extends({},containerBase,{margin:"".concat(halfGapBig,"px 0")})).toString();var noGapContainer=css(_extends({},containerBase)).toString();var containerCircle=css(_extends({},containerBase,{margin:"".concat(halfGapBig+5,"px 0")})).toString();export default{container:container,containerCircle:containerCircle,noGapContainer:noGapContainer};

package/package.json

@@ -1,17 +1,17 @@
 {
   "name": "@shopgate/pwa-ui-shared",
-  "version": "7.28.0",
+  "version": "7.29.0-alpha.10",
   "description": "Shopgate's shared UI components.",
   "main": "index.js",
   "license": "Apache-2.0",
   "dependencies": {
-    "@shopgate/pwa-ui-ios": "7.28.0",
-    "@shopgate/pwa-ui-material": "7.28.0",
+    "@shopgate/pwa-ui-ios": "7.29.0-alpha.10",
+    "@shopgate/pwa-ui-material": "7.29.0-alpha.10",
     "react-day-picker": "^7.4.8"
   },
   "devDependencies": {
-    "@shopgate/pwa-common": "7.28.0",
-    "@shopgate/pwa-common-commerce": "7.28.0",
+    "@shopgate/pwa-common": "7.29.0-alpha.10",
+    "@shopgate/pwa-common-commerce": "7.29.0-alpha.10",
     "classnames": "2.5.1",
     "react": "~16.14.0"
   },

package/ClientInformation/actions.js

@@ -1,4 +0,0 @@
-import DataRequest from'@shopgate/pwa-core/classes/DataRequest';import setDebugLoggingEnabled from'@shopgate/pwa-core/commands/setDebugLoggingEnabled';/**
- * Enable debug logging.
- * @return {Function} A redux thunk.
- */export var enableDebugLogging=function enableDebugLogging(){return function(){setDebugLoggingEnabled();new DataRequest('ajax_started_live_logging').dispatch();};};

package/ClientInformation/connector.js

@@ -1,10 +0,0 @@
-import{connect}from'react-redux';import{getClientInformation}from'@shopgate/pwa-common/selectors/client';import{enableDebugLogging}from"./actions";/**
- * Maps the contents of the state to the component props.
- * @param {Object} state The current application state.
- * @return {Object} The extended component props.
- */var mapStateToProps=function mapStateToProps(state){var clientInformation=getClientInformation(state);return{appVersion:clientInformation.appVersion,codebaseVersion:clientInformation.codebaseVersion,deviceId:clientInformation.deviceId,libVersion:clientInformation.libVersion};};/**
- * Only update when the codebaseVersion changed.
- * @param {Object} next The next state.
- * @param {Object} prev the previous state.
- * @returns {boolean}
- */var areStatesEqual=function areStatesEqual(next,prev){var prevClient=getClientInformation(prev);var nextClient=getClientInformation(next);return prevClient.codebaseVersion===nextClient.codebaseVersion;};var mapDispatchToProps={enableDebugLogging:enableDebugLogging};export default connect(mapStateToProps,mapDispatchToProps,null,{areStatesEqual:areStatesEqual});

package/ClientInformation/index.js

@@ -1,22 +0,0 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Component}from'react';import PropTypes from'prop-types';import connect from"./connector";import styles from"./style";var TIMEOUT_SHOW_DEVICE_ID=5000;/**
- * Client information component which is shown as the footer of the navigation drawer.
- */var ClientInformation=/*#__PURE__*/function(_Component){/**
-   * The component constructor.
-   * @param {Object} props The component props.
-   */function ClientInformation(props){var _this2;_classCallCheck(this,ClientInformation);_this2=_callSuper(this,ClientInformation,[props]);/**
-   * Starts the timer.
-   */_defineProperty(_this2,"startTimer",function(){_this2.timer=setTimeout(_this2.showDeviceId,TIMEOUT_SHOW_DEVICE_ID);});_defineProperty(_this2,"showDeviceId",function(){if(!_this2.state.isDeviceIdVisible){_this2.setState({isDeviceIdVisible:true});_this2.props.enableDebugLogging();}});/**
-   * Cancels the timer.
-   */_defineProperty(_this2,"cancelTimer",function(){clearTimeout(_this2.timer);});_this2.state={isDeviceIdVisible:false};return _this2;}/**
-   * Setup event listener.
-   */_inherits(ClientInformation,_Component);return _createClass(ClientInformation,[{key:"componentDidMount",value:function componentDidMount(){document.addEventListener('touchend',this.cancelTimer);}/**
-   * @param {Object} nextProps the next component props.
-   * @param {Object} nextState the next component state.
-   * @returns {boolean}
-   */},{key:"shouldComponentUpdate",value:function shouldComponentUpdate(nextProps,nextState){return this.props.codebaseVersion!==nextProps.codebaseVersion||this.state.isDeviceIdVisible!==nextState.isDeviceIdVisible;}/**
-   * Remove event listener.
-   */},{key:"componentWillUnmount",value:function componentWillUnmount(){document.removeEventListener('touchend',this.cancelTimer);}},{key:"render",value:/**
-   * Renders the component.
-   * @return {JSX}
-   */function render(){if(this.props.codebaseVersion===null){return null;}var isDeviceIdVisible=this.state.isDeviceIdVisible;var _this$props=this.props,appVersion=_this$props.appVersion,libVersion=_this$props.libVersion,deviceId=_this$props.deviceId,codebaseVersion=_this$props.codebaseVersion;return React.createElement("div",{className:"ui-shared__client-information ".concat(styles.wrapper),onTouchStart:this.startTimer,"aria-hidden":true},React.createElement("p",{className:styles.unselectable},"App Version:",' ',appVersion,' ',"(",codebaseVersion,")",React.createElement("br",null),"Lib Version:",' ',libVersion),isDeviceIdVisible&&React.createElement("p",{className:styles.deviceId},"Device ID:",' ',deviceId));}}]);}(Component);_defineProperty(ClientInformation,"defaultProps",{appVersion:null,codebaseVersion:null,deviceId:null,libVersion:null});export default connect(ClientInformation);// For testing.
-export{ClientInformation as Unwrapped};

package/ClientInformation/spec.js

@@ -1 +0,0 @@
-function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}import React from'react';import{shallow,mount}from'enzyme';import{Unwrapped as ClientInformation}from"./index";describe('<ClientInformation />',function(){var mockData={appVersion:'1.2.3',libVersion:'4.5.6',codebaseVersion:'7.8.9',deviceId:'my-awesome-device-id',enableDebugLogging:function enableDebugLogging(){}};it('should not render if no data is available',function(){var wrapper=shallow(React.createElement(ClientInformation,_extends({},mockData,{codebaseVersion:null})));expect(wrapper).toMatchSnapshot();expect(wrapper.isEmptyRender()).toBe(true);});it('should re-render when data comes available',function(){var wrapper=shallow(React.createElement(ClientInformation,_extends({},mockData,{codebaseVersion:null})));expect(wrapper.isEmptyRender()).toBe(true);wrapper.setProps({codebaseVersion:mockData.codebaseVersion});expect(wrapper).toMatchSnapshot();expect(wrapper.isEmptyRender()).toBe(false);});describe('App and lib version, and device ID',function(){it('should render the app and lib version',function(){var wrapper=shallow(React.createElement(ClientInformation,_extends({},mockData,{enableDebugLogging:function enableDebugLogging(){}})));expect(wrapper).toMatchSnapshot();var html=wrapper.html();expect(html.indexOf(mockData.appVersion)>0).toBe(true);expect(html.indexOf(mockData.libVersion)>0).toBe(true);expect(html.indexOf(mockData.codebaseVersion)>0).toBe(true);expect(html.indexOf(mockData.deviceId)>0).toBe(false);});it('should show the device ID',function(){var wrapper=mount(React.createElement(ClientInformation,mockData));wrapper.setState({isDeviceIdVisible:true});wrapper.render();expect(wrapper).toMatchSnapshot();var html=wrapper.html();expect(html.indexOf(mockData.appVersion)>0).toBe(true);expect(html.indexOf(mockData.libVersion)>0).toBe(true);expect(html.indexOf(mockData.codebaseVersion)>0).toBe(true);expect(html.indexOf(mockData.deviceId)>0).toBe(true);});});describe('User interaction',function(){jest.useFakeTimers();it('should start the timer if touched',function(){var wrapper=shallow(React.createElement(ClientInformation,mockData));var instance=wrapper.instance();instance.showDeviceId=jest.fn();wrapper.find('div').simulate('touchstart');jest.runAllTimers();expect(wrapper.instance().showDeviceId).toHaveBeenCalled();});it('should abort the timer if touch ends under 5 seconds',function(){var wrapper=mount(React.createElement(ClientInformation,mockData));var instance=wrapper.instance();instance.showDeviceId=jest.fn();wrapper.find('div').simulate('touchstart');instance.cancelTimer();jest.runAllTimers();expect(wrapper.instance().showDeviceId).not.toHaveBeenCalled();});});});

package/ClientInformation/style.js

@@ -1 +0,0 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var wrapper=css({position:'relative',textAlign:'center',color:themeConfig.colors.shade9,fontSize:12,paddingBottom:20});var unselectable=css({WebkitTouchCallout:'none',WebkitUserSelect:'none',userSelect:'none'});var deviceId=css({wordBreak:['keep-all','break-word'],hyphens:'auto',padding:"0 ".concat(themeConfig.variables.gap.big,"px")});export default{wrapper:wrapper,unselectable:unselectable,deviceId:deviceId};