@shopgate/engage 6.20.0-beta.3 → 6.20.0-beta.4

package/components/RangeSlider/index.js

@@ -1,9 +1,9 @@
-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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}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,{PureComponent}from'react';import PropTypes from'prop-types';import cxs from'classnames';import styles from"./style";import Handle from"./components/Handle";import{generateLinearEasingCallback,generateExponentialEasingCallback,getRangeStyle,getTouchPositionX,getAbsoluteValue,getRelativeValue}from"./helper";/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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,{PureComponent}from'react';import PropTypes from'prop-types';import cxs from'classnames';import styles from"./style";import Handle from"./components/Handle";import{generateLinearEasingCallback,generateExponentialEasingCallback,getRangeStyle,getTouchPositionX,getAbsoluteValue,getRelativeValue}from"./helper";/**
  * The range slider component.
- */var RangeSlider=/*#__PURE__*/function(_PureComponent){_inherits(RangeSlider,_PureComponent);/**
+ */var RangeSlider=/*#__PURE__*/function(_PureComponent){_inherits(RangeSlider,_PureComponent);var _super=_createSuper(RangeSlider);/**
    * Constructor
    * @param {Object} props The component properties
-   */function RangeSlider(props){var _this;_classCallCheck(this,RangeSlider);_this=_possibleConstructorReturn(this,_getPrototypeOf(RangeSlider).call(this,props));_defineProperty(_assertThisInitialized(_this),"handleTouchStart",function(event,index){_this.draggedHandle=index;// Calculate the relative offset to the handles center
+   */function RangeSlider(props){var _this;_classCallCheck(this,RangeSlider);_this=_super.call(this,props);_defineProperty(_assertThisInitialized(_this),"handleTouchStart",function(event,index){_this.draggedHandle=index;// Calculate the relative offset to the handles center
 var handleDOMElement=event.target;// Get the handles bounding rectangle ...
 var handleRect=handleDOMElement.getBoundingClientRect();// ... and calculate its absolute center.
 var handleCenterX=handleRect.left+handleDOMElement.offsetWidth/2;// Store the signed distanced between the current touch offset and the handle center.
@@ -14,7 +14,7 @@ if(_this.state.rangeMin<deltaX){stateUpdate.rangeMax=Math.min(1,deltaX);_this.dr
 _this.draggedHandle=0;stateUpdate.rangeMax=_this.state.rangeMin;stateUpdate.rangeMin=deltaX;_this.draggedHandlePixelOffset=Math.abs(stateUpdate.rangeMin-_this.state.rangeMin);}}else if(_this.draggedHandle===0){// Left handle dragged
 if(_this.state.rangeMax>deltaX){stateUpdate.rangeMin=Math.max(0,deltaX);_this.draggedHandlePixelOffset=Math.abs(stateUpdate.rangeMin-_this.state.rangeMin);}else{// Not in valid range, swap handles
 _this.draggedHandle=1;stateUpdate.rangeMin=_this.state.rangeMax;stateUpdate.rangeMax=deltaX;_this.draggedHandlePixelOffset=Math.abs(stateUpdate.rangeMax-_this.state.rangeMax);}}_this.draggedHandlePixelOffset*=_this.domElement.current.offsetWidth;_this.setState(stateUpdate,_this.triggerChangeCallback);});_defineProperty(_assertThisInitialized(_this),"handleTouchEnd",function(){_this.touchOffset=0;_this.draggedHandle=null;});_defineProperty(_assertThisInitialized(_this),"handleRangeTouch",function(event){var _this$domElement$curr2=_this.domElement.current,offsetWidth=_this$domElement$curr2.offsetWidth,offsetLeft=_this$domElement$curr2.offsetLeft;var dx=(getTouchPositionX(event)-offsetLeft)/offsetWidth;var d0=Math.abs(_this.state.rangeMin-dx);var d1=Math.abs(_this.state.rangeMax-dx);if(d0<d1){_this.draggedHandle=0;}else{_this.draggedHandle=1;}_this.handleTouchMove(event);});_defineProperty(_assertThisInitialized(_this),"handleInputChange",function(event){var max=_this.props.max;var _event$target=event.target,value=_event$target.value,id=_event$target.id;var delta=Math.max(0,Math.min(1,value/(max/100)));var state=id==='price_from'?{rangeMin:delta}:{rangeMax:delta};_this.setState(state);});_this.draggedHandle=null;// 0 for left handle, 1 for right handle or null
-_this.domElement=React.createRef();_this.touchOffset=0;_this.draggedHandlePixelOffset=0;// The absolute pixel delta of the last handle move event.
+_this.domElement=/*#__PURE__*/React.createRef();_this.touchOffset=0;_this.draggedHandlePixelOffset=0;// The absolute pixel delta of the last handle move event.
 _this.state=_this.getRange(props);return _this;}/**
    * Sets the global event listeners when component mounts.
    */_createClass(RangeSlider,[{key:"componentDidMount",value:function componentDidMount(){document.addEventListener('touchend',this.handleTouchEnd);document.addEventListener('touchmove',this.handleTouchMove);}/**
@@ -24,19 +24,19 @@ _this.state=_this.getRange(props);return _this;}/**
    * Removes the global event listeners when component unmounts.
    */},{key:"componentWillUnmount",value:function componentWillUnmount(){document.removeEventListener('touchend',this.handleTouchEnd);document.removeEventListener('touchmove',this.handleTouchMove);}/**
    * Get the easing function.
-   */},{key:"getRange",/**
+   */},{key:"ease",get:function get(){return{linear:generateLinearEasingCallback(this.props.resolution),exponential:generateExponentialEasingCallback(this.props.factor)}[this.props.easing];}/**
+   * Get the function to invert an eased value to it's original value.
+   */},{key:"invertedEase",get:function get(){return{linear:generateLinearEasingCallback(this.props.resolution),exponential:generateExponentialEasingCallback(1/this.props.factor)}[this.props.easing];}/**
    * Get range min and max from props.
    * @param {Object} props The component props.
    * @returns {Object} The new state
-   */value:function getRange(props){var value=props.value,min=props.min,max=props.max;return{rangeMin:this.invertedEase(getRelativeValue(value[0],min,max)),rangeMax:this.invertedEase(getRelativeValue(value[1],min,max))};}/**
+   */},{key:"getRange",value:function getRange(props){var value=props.value,min=props.min,max=props.max;return{rangeMin:this.invertedEase(getRelativeValue(value[0],min,max)),rangeMax:this.invertedEase(getRelativeValue(value[1],min,max))};}/**
    * Processes touch start events on handles.
    * @param {Object} event The touch event
    * @param {number} index The index of the touched handle.
-   */},{key:"triggerChangeCallback",/**
+   */},{key:"triggerChangeCallback",value:/**
    * Calls the change callback in case of a state update.
-   */value:function triggerChangeCallback(){var _this$props=this.props,value=_this$props.value,onChange=_this$props.onChange,min=_this$props.min,max=_this$props.max;if(!onChange){return;}var newRange=[getAbsoluteValue(this.ease(this.state.rangeMin),min,max,true),getAbsoluteValue(this.ease(this.state.rangeMax),min,max,true)];if(newRange!==value){onChange(newRange);}}/**
+   */function triggerChangeCallback(){var _this$props=this.props,value=_this$props.value,onChange=_this$props.onChange,min=_this$props.min,max=_this$props.max;if(!onChange){return;}var newRange=[getAbsoluteValue(this.ease(this.state.rangeMin),min,max,true),getAbsoluteValue(this.ease(this.state.rangeMax),min,max,true)];if(newRange!==value){onChange(newRange);}}/**
    * Renders the component.
    * @returns {JSX}
-   */},{key:"render",value:function render(){var _this$props2=this.props,classNames=_this$props2.classNames,animationSpeed=_this$props2.animationSpeed;var speed=Math.round(1000/animationSpeed*this.draggedHandlePixelOffset);var rangeStyle=getRangeStyle(this.state.rangeMin,this.state.rangeMax,speed>10?speed:0);return React.createElement("div",{className:cxs(classNames.container,'engage__range-slider'),onTouchStart:this.handleRangeTouch,"aria-hidden":true},React.createElement("div",{className:cxs(classNames.outerRange,styles.outerRange),ref:this.domElement},React.createElement("div",{className:cxs(classNames.range,styles.range),style:rangeStyle},React.createElement(Handle,{index:0,onTouchStart:this.handleTouchStart,active:this.draggedHandle===0,classNames:classNames}),React.createElement(Handle,{index:1,onTouchStart:this.handleTouchStart,active:this.draggedHandle===1,classNames:classNames}))));}},{key:"ease",get:function get(){return{linear:generateLinearEasingCallback(this.props.resolution),exponential:generateExponentialEasingCallback(this.props.factor)}[this.props.easing];}/**
-   * Get the function to invert an eased value to it's original value.
-   */},{key:"invertedEase",get:function get(){return{linear:generateLinearEasingCallback(this.props.resolution),exponential:generateExponentialEasingCallback(1/this.props.factor)}[this.props.easing];}}]);return RangeSlider;}(PureComponent);_defineProperty(RangeSlider,"defaultProps",{animationSpeed:500,classNames:{},easing:'linear',factor:2,max:100,min:0,resolution:1,value:[0,100],onChange:null});export default RangeSlider;
+   */},{key:"render",value:function render(){var _this$props2=this.props,classNames=_this$props2.classNames,animationSpeed=_this$props2.animationSpeed;var speed=Math.round(1000/animationSpeed*this.draggedHandlePixelOffset);var rangeStyle=getRangeStyle(this.state.rangeMin,this.state.rangeMax,speed>10?speed:0);return/*#__PURE__*/React.createElement("div",{className:cxs(classNames.container,'engage__range-slider'),onTouchStart:this.handleRangeTouch,"aria-hidden":true},/*#__PURE__*/React.createElement("div",{className:cxs(classNames.outerRange,styles.outerRange),ref:this.domElement},/*#__PURE__*/React.createElement("div",{className:cxs(classNames.range,styles.range),style:rangeStyle},/*#__PURE__*/React.createElement(Handle,{index:0,onTouchStart:this.handleTouchStart,active:this.draggedHandle===0,classNames:classNames}),/*#__PURE__*/React.createElement(Handle,{index:1,onTouchStart:this.handleTouchStart,active:this.draggedHandle===1,classNames:classNames}))));}}]);return RangeSlider;}(PureComponent);_defineProperty(RangeSlider,"defaultProps",{animationSpeed:500,classNames:{},easing:'linear',factor:2,max:100,min:0,resolution:1,value:[0,100],onChange:null});export default RangeSlider;

package/components/RangeSlider/spec.js

@@ -1,4 +1,4 @@
-function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_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 from'react';import{shallow,mount}from'enzyme';import RangeSlider from"./index";import RangeSliderHandle from"./components/Handle";import{generateLinearEasingCallback,generateExponentialEasingCallback,getAbsoluteValue,getRelativeValue}from"./helper";/**
+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 from'react';import{shallow,mount}from'enzyme';import RangeSlider from"./index";import RangeSliderHandle from"./components/Handle";import{generateLinearEasingCallback,generateExponentialEasingCallback,getAbsoluteValue,getRelativeValue}from"./helper";/**
  * Creates a (fake) touch event.
  * @param {number} pageX the x page offset of the simulated touch event
  * @returns {Object} the new fake event containing only the properties required for testing.
@@ -19,10 +19,10 @@ left:pageX-simulatedHandleHalfWidth};}},touches:[{pageX:pageX}]};return touchEve
  * @param {Array} simulateSteps A set of relative horizontal pixel movements to simulate.
  * @param {Function} testCallback An optional callback for the onChange event of the slider.
  */var simulateInputTest=function simulateInputTest(pxWidth,pxOffset,min,max,value,easing,resolutionOrFactor,simulateSteps,testCallback){var config={totalPixelWidth:pxWidth,leftPixelOffset:pxOffset,min:min,max:max,easing:easing,resolution:resolutionOrFactor,factor:resolutionOrFactor,initialValue:value,valuePixelSize:pxWidth/(max-min),currentTouchDeltaX:0};config.currentTouchDeltaX=config.valuePixelSize*value[1];var ease={linear:generateLinearEasingCallback(config.resolution),exponential:generateExponentialEasingCallback(config.factor)}[config.easing];// eslint-disable-next-line require-jsdoc
-var callback=function callback(_ref){var _ref2=_slicedToArray(_ref,2),from=_ref2[0],to=_ref2[1];var currentTouchDeltaX=config.currentTouchDeltaX,valuePixelSize=config.valuePixelSize;var relativeValue=getRelativeValue(currentTouchDeltaX/valuePixelSize,min,max);var expected=getAbsoluteValue(ease(relativeValue),config.min,config.max,true);expect(expected===from||expected===to).toBe(true);if(testCallback){testCallback(config,from,to);}};var wrapper=mount(React.createElement(RangeSlider,{min:config.min,max:config.max,value:config.initialValue,easing:easing,resolution:config.resolution,factor:config.factor,onChange:callback}));expect(wrapper).toMatchSnapshot();// Create a simulated touch event.
+var callback=function callback(_ref){var _ref2=_slicedToArray(_ref,2),from=_ref2[0],to=_ref2[1];var currentTouchDeltaX=config.currentTouchDeltaX,valuePixelSize=config.valuePixelSize;var relativeValue=getRelativeValue(currentTouchDeltaX/valuePixelSize,min,max);var expected=getAbsoluteValue(ease(relativeValue),config.min,config.max,true);expect(expected===from||expected===to).toBe(true);if(testCallback){testCallback(config,from,to);}};var wrapper=mount(/*#__PURE__*/React.createElement(RangeSlider,{min:config.min,max:config.max,value:config.initialValue,easing:easing,resolution:config.resolution,factor:config.factor,onChange:callback}));expect(wrapper).toMatchSnapshot();// Create a simulated touch event.
 var pageX=config.leftPixelOffset+config.currentTouchDeltaX;var touchEvent=createTouchEvent(pageX);var inst=wrapper.instance();inst.handleTouchStart(touchEvent,1);simulateSteps.forEach(function(deltaX){config.currentTouchDeltaX+=deltaX;touchEvent.touches[0].pageX=config.leftPixelOffset+config.currentTouchDeltaX;Object.defineProperty(inst.domElement,'offsetLeft',{get:function get(){return config.leftPixelOffset;},configurable:true});Object.defineProperty(inst.domElement,'offsetWidth',{get:function get(){return config.totalPixelWidth;},configurable:true});inst.handleTouchMove(touchEvent);});inst.handleTouchEnd();};describe.skip('<RangeSlider />',function(){/**
    * Simple attribute tests
-   */it('renders with boundaries',function(){var wrapper=shallow(React.createElement(RangeSlider,{min:0,max:100}));expect(wrapper).toMatchSnapshot();expect(wrapper.find(RangeSliderHandle).length).toBe(2);});it('renders without boundaries',function(){var wrapper=shallow(React.createElement(RangeSlider,null));expect(wrapper).toMatchSnapshot();expect(wrapper.find(RangeSliderHandle).length).toBe(2);});it('renders without a value pair',function(){var wrapper=shallow(React.createElement(RangeSlider,{value:[10,50]}));expect(wrapper).toMatchSnapshot();expect(wrapper.find(RangeSliderHandle).length).toBe(2);});/**
+   */it('renders with boundaries',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(RangeSlider,{min:0,max:100}));expect(wrapper).toMatchSnapshot();expect(wrapper.find(RangeSliderHandle).length).toBe(2);});it('renders without boundaries',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(RangeSlider,null));expect(wrapper).toMatchSnapshot();expect(wrapper.find(RangeSliderHandle).length).toBe(2);});it('renders without a value pair',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(RangeSlider,{value:[10,50]}));expect(wrapper).toMatchSnapshot();expect(wrapper.find(RangeSliderHandle).length).toBe(2);});/**
    * Callback tests
    */it('emits onChange if handle was touched (linear)',function(){simulateInputTest(100,73,// Range slider pixel width and offset.
 0,100,// Range slider minimum and maximum value.
@@ -37,5 +37,5 @@ var pageX=config.leftPixelOffset+config.currentTouchDeltaX;var touchEvent=create
 0.01,// Resolution.
 [// A series of pixel offsets to move the slider handle.
 +10,+10,+10,+10,+10,+10,+10,+10,-10,-10,-10,-10,-10,-10,-10,-10,+3,-15,+17,-80,+104,-23,-12,+67]);});it('emits onChange if the outer range was touched',function(){// eslint-disable-next-line require-jsdoc
-var callback=function callback(value){return expect(value).toEqual([-80,0]);};var wrapper=mount(React.createElement(RangeSlider,{min:-100,max:100,value:[0,0],onChange:callback}));// Create a simulated touch event at a page x offset of 20px.
+var callback=function callback(value){return expect(value).toEqual([-80,0]);};var wrapper=mount(/*#__PURE__*/React.createElement(RangeSlider,{min:-100,max:100,value:[0,0],onChange:callback}));// Create a simulated touch event at a page x offset of 20px.
 var touchEvent=createTouchEvent(20);var inst=wrapper.instance();Object.defineProperty(inst.domElement,'offsetLeft',{get:function get(){return 0;},configurable:true});Object.defineProperty(inst.domElement,'offsetWidth',{get:function get(){return 200;},configurable:true});inst.handleRangeTouch(touchEvent);});});

package/components/ScrollHeader/index.js

@@ -1,6 +1,6 @@
-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);}function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_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,{useState,useCallback,useEffect}from'react';import PropTypes from'prop-types';import{viewScroll$}from'@shopgate/pwa-common/streams/view';import{scrolledIn,scrolledOut,transition}from"./style";/**
+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);}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,{useState,useCallback,useEffect}from'react';import PropTypes from'prop-types';import{viewScroll$}from'@shopgate/pwa-common/streams/view';import{scrolledIn,scrolledOut,transition}from"./style";/**
  * Scroll Header component
  * @param {Object} props props
  * @returns {JSX}
  *
- */function ScrollHeader(_ref){var children=_ref.children,hideOnScroll=_ref.hideOnScroll,scrollOffset=_ref.scrollOffset;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldHideHeader=_useState2[0],setShouldHideHeader=_useState2[1];var onScroll=useCallback(function(scrollEvent){var scrollTop=scrollEvent.scrollTop,scrolled=scrollEvent.scrolled,scrollOut=scrollEvent.scrollOut,scrollIn=scrollEvent.scrollIn;if(scrolled){if(!shouldHideHeader&&scrollOut&&scrollTop>=scrollOffset){setShouldHideHeader(true);}if(shouldHideHeader&&scrollIn){setShouldHideHeader(false);}}},[scrollOffset,shouldHideHeader]);useEffect(function(){if(hideOnScroll){var subscription=viewScroll$.subscribe(onScroll);return function(){return subscription.unsubscribe();};}return undefined;});var className=shouldHideHeader?scrolledOut:scrolledIn;return React.cloneElement(children,_extends({},children.props,{className:"".concat(children.props.className.toString()," ").concat(className," ").concat(transition)}));}ScrollHeader.defaultProps={hideOnScroll:true,scrollOffset:100};export default ScrollHeader;
+ */function ScrollHeader(_ref){var children=_ref.children,hideOnScroll=_ref.hideOnScroll,scrollOffset=_ref.scrollOffset;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldHideHeader=_useState2[0],setShouldHideHeader=_useState2[1];var onScroll=useCallback(function(scrollEvent){var scrollTop=scrollEvent.scrollTop,scrolled=scrollEvent.scrolled,scrollOut=scrollEvent.scrollOut,scrollIn=scrollEvent.scrollIn;if(scrolled){if(!shouldHideHeader&&scrollOut&&scrollTop>=scrollOffset){setShouldHideHeader(true);}if(shouldHideHeader&&scrollIn){setShouldHideHeader(false);}}},[scrollOffset,shouldHideHeader]);useEffect(function(){if(hideOnScroll){var subscription=viewScroll$.subscribe(onScroll);return function(){return subscription.unsubscribe();};}return undefined;});var className=shouldHideHeader?scrolledOut:scrolledIn;return/*#__PURE__*/React.cloneElement(children,_extends({},children.props,{className:"".concat(children.props.className.toString()," ").concat(className," ").concat(transition)}));}ScrollHeader.defaultProps={hideOnScroll:true,scrollOffset:100};export default ScrollHeader;

package/components/SheetDrawer/index.js

@@ -1,4 +1,4 @@
 import React from'react';import{createPortal}from'react-dom';import Sheet from'@shopgate/pwa-ui-shared/Sheet';var node=document.getElementById('portals');/**
  * @param {Object} props The props to be passed to the Sheet.
  * @returns {JSX}
- */function SheetDrawer(props){return createPortal(React.createElement(Sheet,props),node);}export default SheetDrawer;
+ */function SheetDrawer(props){return/*#__PURE__*/createPortal(/*#__PURE__*/React.createElement(Sheet,props),node);}export default SheetDrawer;

package/components/SheetList/components/Item/index.js

@@ -1,17 +1,17 @@
-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 _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 classNames from'classnames';import{withForwardedRef}from'@shopgate/engage/core';import Grid from'@shopgate/pwa-common/components/Grid';import Link from'@shopgate/pwa-common/components/Link';import Glow from'@shopgate/pwa-ui-shared/Glow';import styles from"./style";/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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 classNames from'classnames';import{withForwardedRef}from'@shopgate/engage/core';import Grid from'@shopgate/pwa-common/components/Grid';import Link from'@shopgate/pwa-common/components/Link';import Glow from'@shopgate/pwa-ui-shared/Glow';import styles from"./style";/**
  * The list item component.
- */var Item=/*#__PURE__*/function(_Component){_inherits(Item,_Component);function Item(){_classCallCheck(this,Item);return _possibleConstructorReturn(this,_getPrototypeOf(Item).apply(this,arguments));}_createClass(Item,[{key:"shouldComponentUpdate",/**
+ */var Item=/*#__PURE__*/function(_Component){_inherits(Item,_Component);var _super=_createSuper(Item);function Item(){_classCallCheck(this,Item);return _super.apply(this,arguments);}_createClass(Item,[{key:"shouldComponentUpdate",value:/**
    * Should only update what the `selected` or `disabled` props change.
    * @param {Object} nextProps The next set of component props.
    * @returns {JSX}
-   */value:function shouldComponentUpdate(nextProps){return this.props.isSelected!==nextProps.isSelected||this.props.isDisabled!==nextProps.isDisabled;}/**
+   */function shouldComponentUpdate(nextProps){return this.props.isSelected!==nextProps.isSelected||this.props.isDisabled!==nextProps.isDisabled;}/**
    * Renders the bulk of the content.
    * @param {boolean} [isNested=true] Tells if the content is rendered nested.
    * @returns {JSX}
-   */},{key:"renderContent",value:function renderContent(){var _gridStyles,_titleStyles;var isNested=arguments.length>0&&arguments[0]!==undefined?arguments[0]:true;var _this$props=this.props,isDisabled=_this$props.isDisabled,isSelected=_this$props.isSelected,title=_this$props.title,image=_this$props.image,rightComponent=_this$props.rightComponent,forwardedRef=_this$props.forwardedRef;var gridStyles=(_gridStyles={},_defineProperty(_gridStyles,styles.grid,true),_defineProperty(_gridStyles,styles.selected,isSelected),_gridStyles);var titleStyles=(_titleStyles={},_defineProperty(_titleStyles,styles.title,true),_defineProperty(_titleStyles,styles.disabled,isDisabled),_titleStyles);var ref=isNested?null:forwardedRef;return React.createElement("div",{"data-test-id":this.props.testId,ref:ref,className:"engage__sheet-list__item"},React.createElement(Grid,{className:classNames(gridStyles),component:"div"},image!==null&&React.createElement("div",{className:styles.image},image),React.createElement(Grid.Item,{className:classNames(titleStyles),component:"div",grow:1},title),rightComponent!==null&&React.createElement(Grid.Item,{component:"div",grow:1},rightComponent)));}/**
+   */},{key:"renderContent",value:function renderContent(){var _gridStyles,_titleStyles;var isNested=arguments.length>0&&arguments[0]!==undefined?arguments[0]:true;var _this$props=this.props,isDisabled=_this$props.isDisabled,isSelected=_this$props.isSelected,title=_this$props.title,image=_this$props.image,rightComponent=_this$props.rightComponent,forwardedRef=_this$props.forwardedRef;var gridStyles=(_gridStyles={},_defineProperty(_gridStyles,styles.grid,true),_defineProperty(_gridStyles,styles.selected,isSelected),_gridStyles);var titleStyles=(_titleStyles={},_defineProperty(_titleStyles,styles.title,true),_defineProperty(_titleStyles,styles.disabled,isDisabled),_titleStyles);var ref=isNested?null:forwardedRef;return/*#__PURE__*/React.createElement("div",{"data-test-id":this.props.testId,ref:ref,className:"engage__sheet-list__item"},/*#__PURE__*/React.createElement(Grid,{className:classNames(gridStyles),component:"div"},image!==null&&/*#__PURE__*/React.createElement("div",{className:styles.image},image),/*#__PURE__*/React.createElement(Grid.Item,{className:classNames(titleStyles),component:"div",grow:1},title),rightComponent!==null&&/*#__PURE__*/React.createElement(Grid.Item,{component:"div",grow:1},rightComponent)));}/**
    * @returns {JSX}
    */},{key:"render",value:function render(){var _this$props2=this.props,link=_this$props2.link,linkState=_this$props2.linkState,onClick=_this$props2.onClick,className=_this$props2.className,isDisabled=_this$props2.isDisabled,testId=_this$props2.testId,forwardedRef=_this$props2.forwardedRef,isSelected=_this$props2.isSelected;/**
      * If this item is disabled, selected or doesn't have a valid
      * link or click handler then wrap the content with other components.
      */if(isDisabled||!link&&!onClick){return this.renderContent(false);}// Wrap with a <Link> if the `link` prop is set.
-if(link){return React.createElement(Glow,{ref:forwardedRef,className:className,styles:{hover:styles.glowHover}},React.createElement(Link,{href:link,onClick:onClick,state:linkState,tabIndex:0},this.renderContent()));}return React.createElement("div",{onKeyPress:function onKeyPress(){},onClick:onClick,"data-test-id":testId,ref:forwardedRef,tabIndex:0,role:"option","aria-selected":isSelected},React.createElement(Glow,{className:className,styles:{hover:styles.glowHover}},this.renderContent()));}}]);return Item;}(Component);_defineProperty(Item,"defaultProps",{className:null,forwardedRef:null,image:null,isDisabled:false,isSelected:false,link:null,linkState:null,onClick:null,rightComponent:null,testId:null});export default withForwardedRef(Item);
+if(link){return/*#__PURE__*/React.createElement(Glow,{ref:forwardedRef,className:className,styles:{hover:styles.glowHover}},/*#__PURE__*/React.createElement(Link,{href:link,onClick:onClick,state:linkState,tabIndex:0},this.renderContent()));}return/*#__PURE__*/React.createElement("div",{onKeyPress:function onKeyPress(){},onClick:onClick,"data-test-id":testId,ref:forwardedRef,tabIndex:0,role:"option","aria-selected":isSelected},/*#__PURE__*/React.createElement(Glow,{className:className,styles:{hover:styles.glowHover}},this.renderContent()));}}]);return Item;}(Component);_defineProperty(Item,"defaultProps",{className:null,forwardedRef:null,image:null,isDisabled:false,isSelected:false,link:null,linkState:null,onClick:null,rightComponent:null,testId:null});export default withForwardedRef(Item);

package/components/SheetList/components/Item/spec.js

@@ -1,8 +1,8 @@
 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{mount}from'enzyme';import Glow from'@shopgate/pwa-ui-shared/Glow';import Item from"./index";jest.mock('@shopgate/pwa-common/components/Link',function(){/**
    * Mocked LinkComponent.
    * @return {JSX}
-   */var Link=function Link(){return React.createElement("div",null);};return Link;});describe('<SheetList.Item />',function(){var title='My Title';it('should render with a title but no image',function(){var wrapper=mount(React.createElement(Item,{title:title}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('img').exists()).toBeFalsy();});it('should render with an image',function(){var image=React.createElement("img",{src:"url/to/image",alt:"Alternative text"});var wrapper=mount(React.createElement(Item,{title:title,image:image}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('img').exists()).toBeTruthy();});it('should render with a right component',function(){var rightComponent=React.createElement("span",null,"I`m a span.");var wrapper=mount(React.createElement(Item,{title:title,rightComponent:rightComponent}));expect(wrapper).toMatchSnapshot();expect(wrapper.contains(React.createElement("span",null,"I`m a span."))).toEqual(true);});it('should render without a Glow when selected',function(){var wrapper=mount(React.createElement(Item,{title:title,isSelected:true}));expect(wrapper).toMatchSnapshot();expect(wrapper.find(Glow).exists()).toBeFalsy();});it('should render without a Glow when disabled',function(){var wrapper=mount(React.createElement(Item,{title:title,isDisabled:true}));expect(wrapper).toMatchSnapshot();expect(wrapper.find(Glow).exists()).toBeFalsy();});it('should render with a link',function(){var wrapper=mount(React.createElement(Item,{title:title,link:"url/to/somewhere"}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('Link').exists()).toBeTruthy();});it('should render with an onClick element',function(){var spy=jest.fn();// eslint-disable-next-line require-jsdoc
+   */var Link=function Link(){return/*#__PURE__*/React.createElement("div",null);};return Link;});describe('<SheetList.Item />',function(){var title='My Title';it('should render with a title but no image',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('img').exists()).toBeFalsy();});it('should render with an image',function(){var image=/*#__PURE__*/React.createElement("img",{src:"url/to/image",alt:"Alternative text"});var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title,image:image}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('img').exists()).toBeTruthy();});it('should render with a right component',function(){var rightComponent=/*#__PURE__*/React.createElement("span",null,"I`m a span.");var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title,rightComponent:rightComponent}));expect(wrapper).toMatchSnapshot();expect(wrapper.contains(/*#__PURE__*/React.createElement("span",null,"I`m a span."))).toEqual(true);});it('should render without a Glow when selected',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title,isSelected:true}));expect(wrapper).toMatchSnapshot();expect(wrapper.find(Glow).exists()).toBeFalsy();});it('should render without a Glow when disabled',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title,isDisabled:true}));expect(wrapper).toMatchSnapshot();expect(wrapper.find(Glow).exists()).toBeFalsy();});it('should render with a link',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title,link:"url/to/somewhere"}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('Link').exists()).toBeTruthy();});it('should render with an onClick element',function(){var spy=jest.fn();// eslint-disable-next-line require-jsdoc
 var clickHandler=function clickHandler(){/**
        * The spy can't be assigned directly to the event, since the snapshot gets too big
        * and the test execution is heavily slowed down.
-       */spy();};var wrapper=mount(React.createElement(Item,{title:title,onClick:clickHandler}));wrapper.simulate('click');expect(wrapper).toMatchSnapshot();expect(spy).toHaveBeenCalledTimes(1);});it('should update the component when the isDisabled prop changed',function(){var wrapper=mount(React.createElement(Item,{title:title,isDisabled:true}));var props=wrapper.props();var updated=wrapper.find('Item').instance().shouldComponentUpdate(_extends({},props,{isDisabled:false}));expect(updated).toBe(true);});it('should update the component when the isSelected prop changed',function(){var wrapper=mount(React.createElement(Item,{title:title,isSelected:true}));var props=wrapper.props();var updated=wrapper.find('Item').instance().shouldComponentUpdate(_extends({},props,{isSelected:false}));expect(updated).toBe(true);});});
+       */spy();};var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title,onClick:clickHandler}));wrapper.simulate('click');expect(wrapper).toMatchSnapshot();expect(spy).toHaveBeenCalledTimes(1);});it('should update the component when the isDisabled prop changed',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title,isDisabled:true}));var props=wrapper.props();var updated=wrapper.find('Item').instance().shouldComponentUpdate(_extends({},props,{isDisabled:false}));expect(updated).toBe(true);});it('should update the component when the isSelected prop changed',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Item,{title:title,isSelected:true}));var props=wrapper.props();var updated=wrapper.find('Item').instance().shouldComponentUpdate(_extends({},props,{isSelected:false}));expect(updated).toBe(true);});});

package/components/SheetList/index.js

@@ -1,9 +1,9 @@
-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 _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 classNames from'classnames';import List from'@shopgate/pwa-common/components/List';import Item from"./components/Item";import styles from"./style";/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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 classNames from'classnames';import List from'@shopgate/pwa-common/components/List';import Item from"./components/Item";import styles from"./style";/**
  * The SheetList component.
  * Styled sheet for List component
- */var SheetList=/*#__PURE__*/function(_Component){_inherits(SheetList,_Component);function SheetList(){_classCallCheck(this,SheetList);return _possibleConstructorReturn(this,_getPrototypeOf(SheetList).apply(this,arguments));}_createClass(SheetList,[{key:"render",/**
+ */var SheetList=/*#__PURE__*/function(_Component){_inherits(SheetList,_Component);var _super=_createSuper(SheetList);function SheetList(){_classCallCheck(this,SheetList);return _super.apply(this,arguments);}_createClass(SheetList,[{key:"render",value:/**
    * Renders the component.
    * @returns {JSX}
-   */value:function render(){var _itemClasses;var _this$props=this.props,children=_this$props.children,className=_this$props.className,hasImages=_this$props.hasImages,testId=_this$props.testId;if(!React.Children.count(children)){return null;}var itemClasses=(_itemClasses={},_defineProperty(_itemClasses,styles.item,true),_defineProperty(_itemClasses,styles.itemWithImage,hasImages),_itemClasses);return React.createElement(List,{className:"".concat(className," engage__sheet-list"),role:"listbox"},React.Children.map(children,function(child,index){var _childClasses;if(!React.isValidElement(child)){return null;}// The key for each child.
+   */function render(){var _itemClasses;var _this$props=this.props,children=_this$props.children,className=_this$props.className,hasImages=_this$props.hasImages,testId=_this$props.testId;if(!React.Children.count(children)){return null;}var itemClasses=(_itemClasses={},_defineProperty(_itemClasses,styles.item,true),_defineProperty(_itemClasses,styles.itemWithImage,hasImages),_itemClasses);return/*#__PURE__*/React.createElement(List,{className:"".concat(className," engage__sheet-list"),role:"listbox"},React.Children.map(children,function(child,index){var _childClasses;if(!/*#__PURE__*/React.isValidElement(child)){return null;}// The key for each child.
 var key="child-".concat(index);// Selected state for the child.
-var isSelected=child.props.isSelected;var childClasses=(_childClasses={},_defineProperty(_childClasses,styles.itemSelected,isSelected),_defineProperty(_childClasses,styles.itemNotLast,!isSelected),_childClasses);return React.createElement(List.Item,{className:classNames(itemClasses,childClasses),isSelected:isSelected,key:key,tabIndex:0},React.createElement("div",{className:styles.innerContainer,"data-test-id":testId},child));}));}}]);return SheetList;}(Component);_defineProperty(SheetList,"Item",Item);_defineProperty(SheetList,"defaultProps",{children:null,className:null,hasImages:false,testId:null});export default SheetList;
+var isSelected=child.props.isSelected;var childClasses=(_childClasses={},_defineProperty(_childClasses,styles.itemSelected,isSelected),_defineProperty(_childClasses,styles.itemNotLast,!isSelected),_childClasses);return/*#__PURE__*/React.createElement(List.Item,{className:classNames(itemClasses,childClasses),isSelected:isSelected,key:key,tabIndex:0},/*#__PURE__*/React.createElement("div",{className:styles.innerContainer,"data-test-id":testId},child));}));}}]);return SheetList;}(Component);_defineProperty(SheetList,"Item",Item);_defineProperty(SheetList,"defaultProps",{children:null,className:null,hasImages:false,testId:null});export default SheetList;

package/components/SheetList/spec.js

@@ -1 +1 @@
-import React from'react';import{mount}from'enzyme';import BaseListItem from'@shopgate/pwa-common/components/List/components/Item';import SheetList from"./index";import styles from"./style";describe('<SheetList />',function(){it('should render with two children',function(){var wrapper=mount(React.createElement(SheetList,null,React.createElement(SheetList.Item,{title:"List Item"}),React.createElement(SheetList.Item,{title:"List Item"})));expect(wrapper).toMatchSnapshot();expect(wrapper.find(SheetList.Item).length).toEqual(2);});it('should render a child and add styles for list items with images',function(){var wrapper=mount(React.createElement(SheetList,{hasImages:true},React.createElement(SheetList.Item,{title:"List Item"})));expect(wrapper).toMatchSnapshot();expect(wrapper.find(SheetList.Item).length).toEqual(1);expect(wrapper.find(BaseListItem).first().hasClass(styles.itemWithImage)).toBeTruthy();});it('should not render without children',function(){var wrapper=mount(React.createElement(SheetList,null));expect(wrapper).toMatchSnapshot();expect(wrapper.find(SheetList).html()).toBe(null);});it('should not render invalid children',function(){var wrapper=mount(React.createElement(SheetList,null,React.createElement(SheetList.Item,{title:"List Item"}),"xxx"));expect(wrapper).toMatchSnapshot();expect(wrapper.find(SheetList.Item).length).toEqual(1);});});
+import React from'react';import{mount}from'enzyme';import BaseListItem from'@shopgate/pwa-common/components/List/components/Item';import SheetList from"./index";import styles from"./style";describe('<SheetList />',function(){it('should render with two children',function(){var wrapper=mount(/*#__PURE__*/React.createElement(SheetList,null,/*#__PURE__*/React.createElement(SheetList.Item,{title:"List Item"}),/*#__PURE__*/React.createElement(SheetList.Item,{title:"List Item"})));expect(wrapper).toMatchSnapshot();expect(wrapper.find(SheetList.Item).length).toEqual(2);});it('should render a child and add styles for list items with images',function(){var wrapper=mount(/*#__PURE__*/React.createElement(SheetList,{hasImages:true},/*#__PURE__*/React.createElement(SheetList.Item,{title:"List Item"})));expect(wrapper).toMatchSnapshot();expect(wrapper.find(SheetList.Item).length).toEqual(1);expect(wrapper.find(BaseListItem).first().hasClass(styles.itemWithImage)).toBeTruthy();});it('should not render without children',function(){var wrapper=mount(/*#__PURE__*/React.createElement(SheetList,null));expect(wrapper).toMatchSnapshot();expect(wrapper.find(SheetList).html()).toBe(null);});it('should not render invalid children',function(){var wrapper=mount(/*#__PURE__*/React.createElement(SheetList,null,/*#__PURE__*/React.createElement(SheetList.Item,{title:"List Item"}),"xxx"));expect(wrapper).toMatchSnapshot();expect(wrapper.find(SheetList.Item).length).toEqual(1);});});

package/components/SnackBarContainer/index.js

@@ -2,4 +2,4 @@ import React from'react';import{createPortal}from'react-dom';import{SnackBar}fro
  * The SnackBarContainer component.
  * @param {Object} props The component props.
  * @returns {JSX}
- */function SnackBarContainer(props){if(!props.toasts.length){return null;}return createPortal(React.createElement(SnackBar,props),document.getElementById('portals'));}export default SnackBarContainer;
+ */function SnackBarContainer(props){if(!props.toasts.length){return null;}return/*#__PURE__*/createPortal(/*#__PURE__*/React.createElement(SnackBar,props),document.getElementById('portals'));}export default SnackBarContainer;

package/components/TimeBoundary/index.js

@@ -1,4 +1,4 @@
-import _isEqual from"lodash/isEqual";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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}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,Fragment}from'react';import PropTypes from'prop-types';import{isBefore,isAfter,isBetween}from'@shopgate/pwa-common/helpers/date';import{second$}from'@shopgate/pwa-common/streams/interval';/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}import _isEqual from"lodash/isEqual";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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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,Fragment}from'react';import PropTypes from'prop-types';import{isBefore,isAfter,isBetween}from'@shopgate/pwa-common/helpers/date';import{second$}from'@shopgate/pwa-common/streams/interval';/**
  * The TimeBoundary component.
  * @example
  *    <TimeBoundary
@@ -9,13 +9,13 @@ import _isEqual from"lodash/isEqual";function _typeof(obj){if(typeof Symbol==="f
            {between && <div>Content is inside time boundary</div>}
         )}
  *     </TimeBoundary>
- */var TimeBoundary=/*#__PURE__*/function(_Component){_inherits(TimeBoundary,_Component);/**
+ */var TimeBoundary=/*#__PURE__*/function(_Component){_inherits(TimeBoundary,_Component);var _super=_createSuper(TimeBoundary);/**
    * @inheritDoc
-   */function TimeBoundary(props){var _this;_classCallCheck(this,TimeBoundary);_this=_possibleConstructorReturn(this,_getPrototypeOf(TimeBoundary).call(this,props));_defineProperty(_assertThisInitialized(_this),"clear",function(){if(_this.intervalSubscription){_this.intervalSubscription.unsubscribe();}});_defineProperty(_assertThisInitialized(_this),"checkBoundary",function(){var now=Date.now();var newState={before:isBefore(now,_this.props.start),between:isBetween(now,_this.props.start,_this.props.end),after:isAfter(now,_this.props.end)};if(_isEqual(newState,_this.state)){return;}_this.setState(newState);if(newState.after){// already after, stop timer
+   */function TimeBoundary(props){var _this;_classCallCheck(this,TimeBoundary);_this=_super.call(this,props);_defineProperty(_assertThisInitialized(_this),"clear",function(){if(_this.intervalSubscription){_this.intervalSubscription.unsubscribe();}});_defineProperty(_assertThisInitialized(_this),"checkBoundary",function(){var now=Date.now();var newState={before:isBefore(now,_this.props.start),between:isBetween(now,_this.props.start,_this.props.end),after:isAfter(now,_this.props.end)};if(_isEqual(newState,_this.state)){return;}_this.setState(newState);if(newState.after){// already after, stop timer
 _this.clear();}});_this.state={before:false,between:false,after:false};return _this;}/**
    * @inheritDoc
    */_createClass(TimeBoundary,[{key:"componentDidMount",value:function componentDidMount(){this.intervalSubscription=second$.subscribe(this.checkBoundary);this.checkBoundary();}/**
    * @inheritDoc
-   */},{key:"componentWillUnmount",value:function componentWillUnmount(){this.clear();}/** Clear interval if valid */},{key:"render",/**
+   */},{key:"componentWillUnmount",value:function componentWillUnmount(){this.clear();}/** Clear interval if valid */},{key:"render",value:/**
    * @returns {JSX}
-   */value:function render(){return React.createElement(Fragment,null,this.props.children(this.state));}}]);return TimeBoundary;}(Component);export default TimeBoundary;
+   */function render(){return/*#__PURE__*/React.createElement(Fragment,null,this.props.children(this.state));}}]);return TimeBoundary;}(Component);export default TimeBoundary;

package/components/TimeBoundary/spec.js

@@ -1,6 +1,6 @@
 /* eslint-disable extra-rules/no-single-line-objects */import React from'react';import{mount}from'enzyme';import{second$}from'@shopgate/pwa-common/streams/interval';import TimeBoundary from"./index";describe('<TimeBoundary>',function(){var nowMs=new Date().getTime();var subscription;var subscribeSpy;var children;beforeEach(function(){subscription={unsubscribe:jest.fn()};subscribeSpy=jest.spyOn(second$,'subscribe').mockReturnValue(subscription);children=jest.fn();});afterEach(function(){jest.clearAllMocks();});it('should render valid time span',function(){expect.assertions(1);// -30sec < wrapper < +30sec
-mount(React.createElement(TimeBoundary,{start:new Date(nowMs-30000),end:new Date(nowMs+30000)},children));expect(children).toHaveBeenCalledWith({before:false,between:true,after:false});});it('should not render expired time span',function(){expect.assertions(1);// -60sec < wrapper < -30sec
-mount(React.createElement(TimeBoundary,{start:new Date(nowMs-60000),end:new Date(nowMs-30000)},children));expect(children).toHaveBeenCalledWith({before:false,between:false,after:true});});it('should hide after time span expired',function(){expect.assertions(4);// -30sec < wrapper < +2sec
-var wrapper=mount(React.createElement(TimeBoundary,{start:new Date(nowMs-30000),end:new Date(nowMs+2000)},children));var checkBoundaryMethod=wrapper.instance().checkBoundary;expect(subscribeSpy).toHaveBeenCalledTimes(1);expect(subscribeSpy).toHaveBeenCalledWith(checkBoundaryMethod);// Simulate time is over
+mount(/*#__PURE__*/React.createElement(TimeBoundary,{start:new Date(nowMs-30000),end:new Date(nowMs+30000)},children));expect(children).toHaveBeenCalledWith({before:false,between:true,after:false});});it('should not render expired time span',function(){expect.assertions(1);// -60sec < wrapper < -30sec
+mount(/*#__PURE__*/React.createElement(TimeBoundary,{start:new Date(nowMs-60000),end:new Date(nowMs-30000)},children));expect(children).toHaveBeenCalledWith({before:false,between:false,after:true});});it('should hide after time span expired',function(){expect.assertions(4);// -30sec < wrapper < +2sec
+var wrapper=mount(/*#__PURE__*/React.createElement(TimeBoundary,{start:new Date(nowMs-30000),end:new Date(nowMs+2000)},children));var checkBoundaryMethod=wrapper.instance().checkBoundary;expect(subscribeSpy).toHaveBeenCalledTimes(1);expect(subscribeSpy).toHaveBeenCalledWith(checkBoundaryMethod);// Simulate time is over
 jest.spyOn(Date,'now').mockReturnValue(new Date(nowMs+3000));// simulate rxjs emitting
 checkBoundaryMethod();wrapper.update();expect(subscription.unsubscribe).toHaveBeenCalledTimes(1);expect(children.mock.calls).toEqual([[{after:false,before:false,between:false}],[{after:false,before:false,between:true}],[{after:true,before:false,between:false}]]);});});/* eslint-enable extra-rules/no-single-line-objects */

package/components/VideoPlayer/index.js

@@ -1,14 +1,14 @@
-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 _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);}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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}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,{PureComponent}from'react';import ReactPlayer from'react-player';import{UIEvents}from'@shopgate/pwa-core';import{UI_VISIBILITY_CHANGE}from'@shopgate/pwa-common/constants/ui';/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}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);}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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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,{PureComponent}from'react';import ReactPlayer from'react-player';import{UIEvents}from'@shopgate/pwa-core';import{UI_VISIBILITY_CHANGE}from'@shopgate/pwa-common/constants/ui';/**
  * Video player component
  * @param {Object} props props
  * @returns {JSX}
- */var VideoPlayer=/*#__PURE__*/function(_PureComponent){_inherits(VideoPlayer,_PureComponent);function VideoPlayer(){var _getPrototypeOf2;var _this;_classCallCheck(this,VideoPlayer);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_possibleConstructorReturn(this,(_getPrototypeOf2=_getPrototypeOf(VideoPlayer)).call.apply(_getPrototypeOf2,[this].concat(args)));_defineProperty(_assertThisInitialized(_this),"state",{ready:false,playing:_this.props.playing,userPaused:false/**
+ */var VideoPlayer=/*#__PURE__*/function(_PureComponent){_inherits(VideoPlayer,_PureComponent);var _super=_createSuper(VideoPlayer);function VideoPlayer(){var _this;_classCallCheck(this,VideoPlayer);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_super.call.apply(_super,[this].concat(args));_defineProperty(_assertThisInitialized(_this),"state",{ready:false,playing:_this.props.playing,userPaused:false});_defineProperty(_assertThisInitialized(_this),"getPlayingState",function(){return _this.state.ready&&!_this.state.userPaused&&_this.state.playing;});_defineProperty(_assertThisInitialized(_this),"handleReady",function(){_this.setState({ready:true});});_defineProperty(_assertThisInitialized(_this),"handleError",function(error){if(error&&error.name==='NotAllowedError'){_this.setState({playing:false});}});_defineProperty(_assertThisInitialized(_this),"handlePause",function(){// Check if was not paused programmatically
+if(_this.state.playing){_this.setState({userPaused:true,playing:false});}});_defineProperty(_assertThisInitialized(_this),"handlePlay",function(){if(!_this.state.playing){_this.setState({userPaused:false,playing:true});}});_defineProperty(_assertThisInitialized(_this),"handleVisibilityChange",function(){_this.setState({playing:false});});return _this;}_createClass(VideoPlayer,[{key:"componentDidMount",value:/**
    * @inheritDoc
-   */});_defineProperty(_assertThisInitialized(_this),"getPlayingState",function(){return _this.state.ready&&!_this.state.userPaused&&_this.state.playing;});_defineProperty(_assertThisInitialized(_this),"handleReady",function(){_this.setState({ready:true});});_defineProperty(_assertThisInitialized(_this),"handleError",function(error){if(error&&error.name==='NotAllowedError'){_this.setState({playing:false});}});_defineProperty(_assertThisInitialized(_this),"handlePause",function(){// Check if was not paused programmatically
-if(_this.state.playing){_this.setState({userPaused:true,playing:false});}});_defineProperty(_assertThisInitialized(_this),"handlePlay",function(){if(!_this.state.playing){_this.setState({userPaused:false,playing:true});}});_defineProperty(_assertThisInitialized(_this),"handleVisibilityChange",function(){_this.setState({playing:false});});return _this;}_createClass(VideoPlayer,[{key:"componentDidMount",value:function componentDidMount(){UIEvents.addListener(UI_VISIBILITY_CHANGE,this.handleVisibilityChange);}/**
+   */function componentDidMount(){UIEvents.addListener(UI_VISIBILITY_CHANGE,this.handleVisibilityChange);}/**
    * @inheritDoc
    */},{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){var nextState={playing:nextProps.playing};if(this.props.url!==nextProps.url){nextState.ready=false;}this.setState(nextState);}/**
    * @inheritDoc
-   */},{key:"componentWillUnmount",value:function componentWillUnmount(){UIEvents.removeListener(UI_VISIBILITY_CHANGE,this.handleVisibilityChange);}/** @returns {boolean} */},{key:"render",/**
+   */},{key:"componentWillUnmount",value:function componentWillUnmount(){UIEvents.removeListener(UI_VISIBILITY_CHANGE,this.handleVisibilityChange);}/** @returns {boolean} */},{key:"render",value:/**
    * @returns {JSX}
-   */value:function render(){return React.createElement(ReactPlayer,_extends({playsinline:true},this.props,{playing:this.getPlayingState(),onReady:this.handleReady,onPause:this.handlePause,onPlay:this.handlePlay,onError:this.handleError}));}}]);return VideoPlayer;}(PureComponent);_defineProperty(VideoPlayer,"defaultProps",ReactPlayer.defaultProps);export default VideoPlayer;
+   */function render(){return/*#__PURE__*/React.createElement(ReactPlayer,_extends({playsinline:true},this.props,{playing:this.getPlayingState(),onReady:this.handleReady,onPause:this.handlePause,onPlay:this.handlePlay,onError:this.handleError}));}}]);return VideoPlayer;}(PureComponent);_defineProperty(VideoPlayer,"defaultProps",ReactPlayer.defaultProps);export default VideoPlayer;

package/components/View/__mocks__/index.js

@@ -2,4 +2,4 @@ import React from'react';import PropTypes from'prop-types';// Export context moc
 export{ViewContext}from"./context";/**
  * @param {Object} props The component props.
  * @return {JSX}
- */var MockedView=function MockedView(_ref){var children=_ref.children;return React.createElement("div",null,children);};MockedView.defaultProps={children:null};export default MockedView;
+ */var MockedView=function MockedView(_ref){var children=_ref.children;return/*#__PURE__*/React.createElement("div",null,children);};MockedView.defaultProps={children:null};export default MockedView;

package/components/View/__tests__/index.spec.js

@@ -1 +1 @@
-import React from'react';import{shallow}from'enzyme';import{mockThemeConfig}from'@shopgate/pwa-common/helpers/config/mock';import{setBackgroundColor}from"../style";import View from"../index";jest.mock('@shopgate/pwa-common/helpers/config',function(){return{themeConfig:mockThemeConfig};});jest.mock('@shopgate/pwa-common/context',function(){return{RouteContext:{Consumer:jest.fn(function(_ref){var children=_ref.children;return children({visible:true});})}};});jest.mock("../provider",function(){return function(_ref2){var children=_ref2.children;return children;};});jest.mock("../context");jest.mock("../style",function(){return{__esModule:true,"default":jest.requireActual('../style')["default"],setBackgroundColor:jest.fn()};});describe('engage > components > view > index',function(){beforeEach(jest.clearAllMocks);var wrapper;beforeAll(function(){wrapper=shallow(React.createElement(View,null,React.createElement("div",null,"Page #1")));});it('should initialize with visible route',function(){expect(wrapper.dive()).toMatchSnapshot();});it('should have structured content',function(){expect(wrapper.dive().dive().dive().dive()).toMatchSnapshot();});it('should set background on intialization',function(){wrapper=shallow(React.createElement(View,{background:"#990000"},React.createElement("div",null,"Page #1"))).dive().dive();expect(setBackgroundColor).toBeCalledWith('#990000');});});
+import React from'react';import{shallow}from'enzyme';import{mockThemeConfig}from'@shopgate/pwa-common/helpers/config/mock';import{setBackgroundColor}from"../style";import View from"../index";jest.mock('@shopgate/pwa-common/helpers/config',function(){return{themeConfig:mockThemeConfig};});jest.mock('@shopgate/pwa-common/context',function(){return{RouteContext:{Consumer:jest.fn(function(_ref){var children=_ref.children;return children({visible:true});})}};});jest.mock("../provider",function(){return function(_ref2){var children=_ref2.children;return children;};});jest.mock("../context");jest.mock("../style",function(){return{__esModule:true,"default":jest.requireActual('../style')["default"],setBackgroundColor:jest.fn()};});describe('engage > components > view > index',function(){beforeEach(jest.clearAllMocks);var wrapper;beforeAll(function(){wrapper=shallow(/*#__PURE__*/React.createElement(View,null,/*#__PURE__*/React.createElement("div",null,"Page #1")));});it('should initialize with visible route',function(){expect(wrapper.dive()).toMatchSnapshot();});it('should have structured content',function(){expect(wrapper.dive().dive().dive().dive()).toMatchSnapshot();});it('should set background on intialization',function(){wrapper=shallow(/*#__PURE__*/React.createElement(View,{background:"#990000"},/*#__PURE__*/React.createElement("div",null,"Page #1"))).dive().dive();expect(setBackgroundColor).toBeCalledWith('#990000');});});

package/components/View/__tests__/provider.spec.js

@@ -1 +1 @@
-import React from'react';import{shallow}from'enzyme';import Provider from"../provider";jest.mock("../context");describe('engage > components > view > provider',function(){it('should initialize and provider context',function(){var wrapper=shallow(React.createElement(Provider,null,React.createElement("div",null,"Page #1")));expect(wrapper).toMatchSnapshot();});});
+import React from'react';import{shallow}from'enzyme';import Provider from"../provider";jest.mock("../context");describe('engage > components > view > provider',function(){it('should initialize and provider context',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(Provider,null,/*#__PURE__*/React.createElement("div",null,"Page #1")));expect(wrapper).toMatchSnapshot();});});

package/components/View/components/Above/__tests__/index.spec.js

@@ -1 +1 @@
-import React from'react';import{shallow}from'enzyme';import Above from"../index";jest.mock("../../../context");describe('engage > components > view > components > above',function(){it('should render above',function(){var wrapper=shallow(React.createElement(Above,null)).dive();expect(wrapper).toMatchSnapshot();});});
+import React from'react';import{shallow}from'enzyme';import Above from"../index";jest.mock("../../../context");describe('engage > components > view > components > above',function(){it('should render above',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(Above,null)).dive();expect(wrapper).toMatchSnapshot();});});

package/components/View/components/Above/index.js

@@ -1,3 +1,3 @@
 import React from'react';import{ViewContext}from"../../context";/**
  * @returns {JSX}
- */function ViewAbove(){return React.createElement(ViewContext.Consumer,null,function(_ref){var top=_ref.top;if(!top){return null;}var styles={flexShrink:0,height:"calc(".concat(top,"px + var(--safe-area-inset-top))")};return React.createElement("div",{"aria-hidden":true,style:styles,className:"engage__view__above"});});}export default ViewAbove;
+ */function ViewAbove(){return/*#__PURE__*/React.createElement(ViewContext.Consumer,null,function(_ref){var top=_ref.top;if(!top){return null;}var styles={flexShrink:0,height:"calc(".concat(top,"px + var(--safe-area-inset-top))")};return/*#__PURE__*/React.createElement("div",{"aria-hidden":true,style:styles,className:"engage__view__above"});});}export default ViewAbove;

package/components/View/components/Below/__tests__/index.spec.js

@@ -1 +1 @@
-import React from'react';import{shallow}from'enzyme';import Below from"../index";jest.mock("../../../context");describe('engage > components > view > components > below',function(){it('should render below',function(){var wrapper=shallow(React.createElement(Below,null)).dive();expect(wrapper).toMatchSnapshot();});});
+import React from'react';import{shallow}from'enzyme';import Below from"../index";jest.mock("../../../context");describe('engage > components > view > components > below',function(){it('should render below',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(Below,null)).dive();expect(wrapper).toMatchSnapshot();});});

package/components/View/components/Below/index.js

@@ -1,3 +1,3 @@
 import React from'react';import{ViewContext}from"../../context";/**
  * @returns {JSX}
- */function ViewBelow(){return React.createElement(ViewContext.Consumer,null,function(_ref){var bottom=_ref.bottom;if(!bottom){return null;}var styles={flexShrink:0,height:"calc(".concat(bottom,"px + var(--safe-area-inset-bottom))")};return React.createElement("div",{"aria-hidden":true,style:styles,className:"engage__view__below"});});}export default ViewBelow;
+ */function ViewBelow(){return/*#__PURE__*/React.createElement(ViewContext.Consumer,null,function(_ref){var bottom=_ref.bottom;if(!bottom){return null;}var styles={flexShrink:0,height:"calc(".concat(bottom,"px + var(--safe-area-inset-bottom))")};return/*#__PURE__*/React.createElement("div",{"aria-hidden":true,style:styles,className:"engage__view__below"});});}export default ViewBelow;

package/components/View/components/Content/__tests__/index.spec.js

@@ -1,2 +1,2 @@
-import React from'react';import{shallow}from'enzyme';import Content from"../index";jest.mock('@shopgate/pwa-common/helpers/config',function(){return{shopName:'Test Shop'};});jest.mock('@shopgate/pwa-common/context',function(){return{RouteContext:{Consumer:jest.fn(function(_ref){var children=_ref.children;return children({visible:true,pattern:'page/:pageId,'});})}};});describe('engage > components > view > components > content',function(){beforeEach(jest.clearAllMocks);it('should render content',function(){var wrapper=shallow(React.createElement(Content,{setContentRef:jest.fn()},React.createElement("div",null,"Page #1")),{disableLifecycleMethods:true})// Dive through Route context and into render component
+import React from'react';import{shallow}from'enzyme';import Content from"../index";jest.mock('@shopgate/pwa-common/helpers/config',function(){return{shopName:'Test Shop'};});jest.mock('@shopgate/pwa-common/context',function(){return{RouteContext:{Consumer:jest.fn(function(_ref){var children=_ref.children;return children({visible:true,pattern:'page/:pageId,'});})}};});describe('engage > components > view > components > content',function(){beforeEach(jest.clearAllMocks);it('should render content',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(Content,{setContentRef:jest.fn()},/*#__PURE__*/React.createElement("div",null,"Page #1")),{disableLifecycleMethods:true})// Dive through Route context and into render component
 .dive().dive();expect(wrapper).toMatchSnapshot();});});

package/components/View/components/Content/index.js

@@ -1,21 +1,21 @@
-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);}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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}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 Swipeable from'react-swipeable';import Helmet from'react-helmet';import appConfig from'@shopgate/pwa-common/helpers/config';import event from'@shopgate/pwa-core/classes/Event';import{router}from'@virtuous/conductor';import{RouteContext}from'@shopgate/pwa-common/context';import{EVENT_KEYBOARD_WILL_CHANGE}from'@shopgate/pwa-core/constants/AppEvents';import SurroundPortals from'@shopgate/pwa-common/components/SurroundPortals';import{VIEW_CONTENT}from'@shopgate/pwa-common/constants/Portals';import ConditionalWrapper from"../../../ConditionalWrapper";import Above from"../Above";import Below from"../Below";import styles from"./style";/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}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);}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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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 Swipeable from'react-swipeable';import Helmet from'react-helmet';import appConfig from'@shopgate/pwa-common/helpers/config';import event from'@shopgate/pwa-core/classes/Event';import{router}from'@virtuous/conductor';import{RouteContext}from'@shopgate/pwa-common/context';import{EVENT_KEYBOARD_WILL_CHANGE}from'@shopgate/pwa-core/constants/AppEvents';import SurroundPortals from'@shopgate/pwa-common/components/SurroundPortals';import{VIEW_CONTENT}from'@shopgate/pwa-common/constants/Portals';import ConditionalWrapper from"../../../ConditionalWrapper";import Above from"../Above";import Below from"../Below";import styles from"./style";/**
  * The ViewContent component.
- */var ViewContent=/*#__PURE__*/function(_Component){_inherits(ViewContent,_Component);/**
+ */var ViewContent=/*#__PURE__*/function(_Component){_inherits(ViewContent,_Component);var _super=_createSuper(ViewContent);/**
    * @param {Object} props The component props.
-   */function ViewContent(props){var _this;_classCallCheck(this,ViewContent);_this=_possibleConstructorReturn(this,_getPrototypeOf(ViewContent).call(this,props));_defineProperty(_assertThisInitialized(_this),"handleKeyboardChange",function(_ref){var open=_ref.open,overlap=_ref.overlap;var height=open?overlap:0;if(_this.props.visible&&height!==_this.state.keyboardHeight){_this.setState({keyboardHeight:height});}});_defineProperty(_assertThisInitialized(_this),"handleSwipe",function(e,x,y,isFlick,velocity){var swipeEvent=new CustomEvent('swipe',{detail:{event:e,x:x,y:y,isFlick:isFlick,velocity:velocity}});_this.ref.current.dispatchEvent(swipeEvent);});_this.ref=React.createRef();_this.state={keyboardHeight:0};_this.props.setContentRef(_this.ref);event.addCallback(EVENT_KEYBOARD_WILL_CHANGE,_this.handleKeyboardChange);return _this;}/**
+   */function ViewContent(props){var _this;_classCallCheck(this,ViewContent);_this=_super.call(this,props);_defineProperty(_assertThisInitialized(_this),"handleKeyboardChange",function(_ref){var open=_ref.open,overlap=_ref.overlap;var height=open?overlap:0;if(_this.props.visible&&height!==_this.state.keyboardHeight){_this.setState({keyboardHeight:height});}});_defineProperty(_assertThisInitialized(_this),"handleSwipe",function(e,x,y,isFlick,velocity){var swipeEvent=new CustomEvent('swipe',{detail:{event:e,x:x,y:y,isFlick:isFlick,velocity:velocity}});_this.ref.current.dispatchEvent(swipeEvent);});_this.ref=/*#__PURE__*/React.createRef();_this.state={keyboardHeight:0};_this.props.setContentRef(_this.ref);event.addCallback(EVENT_KEYBOARD_WILL_CHANGE,_this.handleKeyboardChange);return _this;}/**
    * @param {Object} props The component props.
    * @param {Object} state The component state.
    * @returns {Object}
-   */_createClass(ViewContent,[{key:"componentDidMount",/**
+   */_createClass(ViewContent,[{key:"componentDidMount",value:/**
    * Restore the scroll position of the page.
-   */value:function componentDidMount(){this.ref.current.scrollTop=this.context.state.scrollTop;}/**
+   */function componentDidMount(){this.ref.current.scrollTop=this.context.state.scrollTop;}/**
    * Removes the keyboardWillChange listener.
    */},{key:"componentWillUnmount",value:function componentWillUnmount(){router.update(this.context.id,{scrollTop:this.ref.current.scrollTop},false);event.removeCallback(EVENT_KEYBOARD_WILL_CHANGE,this.handleKeyboardChange);}/**
    * @returns {Object}
-   */},{key:"render",/**
-   * @return {JSX}
-   */value:function render(){return React.createElement(Swipeable,{onSwiped:this.handleSwipe,flickThreshold:0.6,delta:10},React.createElement("article",{className:"".concat(styles," engage__view__content ").concat(this.props.className),ref:this.ref,style:this.style},React.createElement(Helmet,{title:appConfig.shopName}),React.createElement(Above,null),React.createElement(ConditionalWrapper,{condition:!this.props.noContentPortal,wrapper:function wrapper(children){return React.createElement(SurroundPortals,{portalName:VIEW_CONTENT},children);}},this.props.children),React.createElement(Below,null)));}},{key:"style",get:function get(){var noScrollOnKeyboard=this.props.noScrollOnKeyboard;var keyboardHeight=this.state.keyboardHeight;return{overflow:noScrollOnKeyboard&&keyboardHeight>0?'hidden':'auto',paddingBottom:"calc(var(--tabbar-height) + ".concat(keyboardHeight,"px)")};}/**
+   */},{key:"style",get:function get(){var noScrollOnKeyboard=this.props.noScrollOnKeyboard;var keyboardHeight=this.state.keyboardHeight;return{overflow:noScrollOnKeyboard&&keyboardHeight>0?'hidden':'auto',paddingBottom:"calc(var(--tabbar-height) + ".concat(keyboardHeight,"px)")};}/**
    * Handles a keyboard change event.
    * @param {boolean} open If the keyboard is now open.
    * @param {boolean} overlap The height of the keyboard.
-   */}],[{key:"getDerivedStateFromProps",value:function getDerivedStateFromProps(props,state){if(props.visible||state.keyboardHeight===0){return null;}return{keyboardHeight:0};}}]);return ViewContent;}(Component);_defineProperty(ViewContent,"contextType",RouteContext);_defineProperty(ViewContent,"defaultProps",{className:'',children:null,noScrollOnKeyboard:false,noContentPortal:false});export default(function(props){return React.createElement(RouteContext.Consumer,null,function(_ref2){var visible=_ref2.visible,_ref2$pattern=_ref2.pattern,pattern=_ref2$pattern===void 0?'':_ref2$pattern;return React.createElement(ViewContent,_extends({},props,{visible:visible,className:"route_".concat(pattern.replace(/[:/]/g,'_'))}));});});
+   */},{key:"render",value:/**
+   * @return {JSX}
+   */function render(){return/*#__PURE__*/React.createElement(Swipeable,{onSwiped:this.handleSwipe,flickThreshold:0.6,delta:10},/*#__PURE__*/React.createElement("article",{className:"".concat(styles," engage__view__content ").concat(this.props.className),ref:this.ref,style:this.style},/*#__PURE__*/React.createElement(Helmet,{title:appConfig.shopName}),/*#__PURE__*/React.createElement(Above,null),/*#__PURE__*/React.createElement(ConditionalWrapper,{condition:!this.props.noContentPortal,wrapper:function wrapper(children){return/*#__PURE__*/React.createElement(SurroundPortals,{portalName:VIEW_CONTENT},children);}},this.props.children),/*#__PURE__*/React.createElement(Below,null)));}}],[{key:"getDerivedStateFromProps",value:function getDerivedStateFromProps(props,state){if(props.visible||state.keyboardHeight===0){return null;}return{keyboardHeight:0};}}]);return ViewContent;}(Component);_defineProperty(ViewContent,"contextType",RouteContext);_defineProperty(ViewContent,"defaultProps",{className:'',children:null,noScrollOnKeyboard:false,noContentPortal:false});export default(function(props){return/*#__PURE__*/React.createElement(RouteContext.Consumer,null,function(_ref2){var visible=_ref2.visible,_ref2$pattern=_ref2.pattern,pattern=_ref2$pattern===void 0?'':_ref2$pattern;return/*#__PURE__*/React.createElement(ViewContent,_extends({},props,{visible:visible,className:"route_".concat(pattern.replace(/[:/]/g,'_'))}));});});

package/components/View/context.js

@@ -1 +1 @@
-import React from'react';export var ViewContext=React.createContext();
+import React from'react';export var ViewContext=/*#__PURE__*/React.createContext();

package/components/View/index.js

@@ -3,7 +3,7 @@ export{ViewContext};/**
  * The View container component.
  * @param {Object} props The component props.
  * @return {JSX}
- */function ViewContainer(_ref){var background=_ref.background,children=_ref.children,noScrollOnKeyboard=_ref.noScrollOnKeyboard,visible=_ref.visible,ariaHidden=_ref['aria-hidden'],noContentPortal=_ref.noContentPortal;if(visible){setBackgroundColor(background);}var style={display:visible?'block':'none'};return React.createElement(ViewProvider,null,React.createElement(ViewContext.Consumer,null,function(_ref2){var setContentRef=_ref2.setContentRef,ariaHiddenContext=_ref2.ariaHidden;return React.createElement("section",{className:"".concat(styles," engage__view"),style:style,"aria-hidden":ariaHidden||ariaHiddenContext},React.createElement(Content,{noScrollOnKeyboard:noScrollOnKeyboard,setContentRef:setContentRef,noContentPortal:noContentPortal},children));}));}ViewContainer.defaultProps={'aria-hidden':true,background:colors.light,children:null,noScrollOnKeyboard:false,noContentPortal:false};/**
+ */function ViewContainer(_ref){var background=_ref.background,children=_ref.children,noScrollOnKeyboard=_ref.noScrollOnKeyboard,visible=_ref.visible,ariaHidden=_ref['aria-hidden'],noContentPortal=_ref.noContentPortal;if(visible){setBackgroundColor(background);}var style={display:visible?'block':'none'};return/*#__PURE__*/React.createElement(ViewProvider,null,/*#__PURE__*/React.createElement(ViewContext.Consumer,null,function(_ref2){var setContentRef=_ref2.setContentRef,ariaHiddenContext=_ref2.ariaHidden;return/*#__PURE__*/React.createElement("section",{className:"".concat(styles," engage__view"),style:style,"aria-hidden":ariaHidden||ariaHiddenContext},/*#__PURE__*/React.createElement(Content,{noScrollOnKeyboard:noScrollOnKeyboard,setContentRef:setContentRef,noContentPortal:noContentPortal},children));}));}ViewContainer.defaultProps={'aria-hidden':true,background:colors.light,children:null,noScrollOnKeyboard:false,noContentPortal:false};/**
  * @param {Object} props The component props.
  * @returns {JSX}
- */export default function View(props){return React.createElement(RouteContext.Consumer,null,function(_ref3){var visible=_ref3.visible;return React.createElement(ViewContainer,_extends({},props,{visible:visible}));});}
+ */export default function View(props){return/*#__PURE__*/React.createElement(RouteContext.Consumer,null,function(_ref3){var visible=_ref3.visible;return/*#__PURE__*/React.createElement(ViewContainer,_extends({},props,{visible:visible}));});}

package/components/View/provider.js

@@ -1,9 +1,11 @@
-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 _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);}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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}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 delay from'lodash/delay';import UIEvents from'@shopgate/pwa-core/emitters/ui';import{emitScrollEvents}from'@shopgate/pwa-common/streams/view';import{MODAL_EVENTS}from'@shopgate/pwa-common/components/ModalContainer';import{ViewContext}from"./context";/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}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);}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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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 delay from'lodash/delay';import UIEvents from'@shopgate/pwa-core/emitters/ui';import{emitScrollEvents}from'@shopgate/pwa-common/streams/view';import{MODAL_EVENTS}from'@shopgate/pwa-common/components/ModalContainer';import{ViewContext}from"./context";/**
  * The ViewProvider component.
- */var ViewProvider=/*#__PURE__*/function(_Component){_inherits(ViewProvider,_Component);function ViewProvider(props){var _this;_classCallCheck(this,ViewProvider);_this=_possibleConstructorReturn(this,_getPrototypeOf(ViewProvider).call(this,props));_defineProperty(_assertThisInitialized(_this),"handleModalShow",function(){_this.activeElement=document.activeElement;_this.setAriaHidden(true);});_defineProperty(_assertThisInitialized(_this),"handleModalHide",function(){if(_this.activeElement&&_this.activeElement.focus){_this.activeElement.focus();}_this.setAriaHidden(false);});_defineProperty(_assertThisInitialized(_this),"setTop",function(value){_this.set('top',value);});_defineProperty(_assertThisInitialized(_this),"setBottom",function(value){_this.set('bottom',value);});_defineProperty(_assertThisInitialized(_this),"setAriaHidden",function(value){_this.set('ariaHidden',value);});_defineProperty(_assertThisInitialized(_this),"setContentRef",function(ref){_this.set('contentRef',ref);// Delay to dispatch actual DOM node
+ */var ViewProvider=/*#__PURE__*/function(_Component){_inherits(ViewProvider,_Component);var _super=_createSuper(ViewProvider);/**
+   * @param {Object} props The component props.
+   */function ViewProvider(props){var _this;_classCallCheck(this,ViewProvider);_this=_super.call(this,props);_defineProperty(_assertThisInitialized(_this),"handleModalShow",function(){_this.activeElement=document.activeElement;_this.setAriaHidden(true);});_defineProperty(_assertThisInitialized(_this),"handleModalHide",function(){if(_this.activeElement&&_this.activeElement.focus){_this.activeElement.focus();}_this.setAriaHidden(false);});_defineProperty(_assertThisInitialized(_this),"setTop",function(value){_this.set('top',value);});_defineProperty(_assertThisInitialized(_this),"setBottom",function(value){_this.set('bottom',value);});_defineProperty(_assertThisInitialized(_this),"setAriaHidden",function(value){_this.set('ariaHidden',value);});_defineProperty(_assertThisInitialized(_this),"setContentRef",function(ref){_this.set('contentRef',ref);// Delay to dispatch actual DOM node
 delay(function(){return emitScrollEvents(ref.current);},250);});_defineProperty(_assertThisInitialized(_this),"getContentRef",function(){return _this.state.contentRef;});_defineProperty(_assertThisInitialized(_this),"scrollTop",function(){var value=arguments.length>0&&arguments[0]!==undefined?arguments[0]:0;var current=_this.state.contentRef.current;if(current){current.scrollTop=value;}});_defineProperty(_assertThisInitialized(_this),"set",function(property,value){if(_this.state[property]!==value){_this.setState(_defineProperty({},property,value));}});_this.state={top:0,bottom:0,contentRef:{current:null},ariaHidden:false};// Last view active element
 _this.activeElement=null;return _this;}/** @inheritDoc */_createClass(ViewProvider,[{key:"componentDidMount",value:function componentDidMount(){UIEvents.addListener(MODAL_EVENTS.SHOW,this.handleModalShow);UIEvents.addListener(MODAL_EVENTS.HIDE,this.handleModalHide);}/** @inheritDoc */},{key:"componentWillUnmount",value:function componentWillUnmount(){UIEvents.removeListener(MODAL_EVENTS.SHOW,this.handleModalShow);UIEvents.removeListener(MODAL_EVENTS.HIDE,this.handleModalHide);}/**
    * @returns {Object}
-   */},{key:"render",/**
+   */},{key:"providerContext",get:function get(){return _extends({},this.state,{set:this.set,setTop:this.setTop,setBottom:this.setBottom,setAriaHidden:this.setAriaHidden,setContentRef:this.setContentRef,getContentRef:this.getContentRef,scrollTop:this.scrollTop});}},{key:"render",value:/**
    * @returns {JSX}
-   */value:function render(){return React.createElement(ViewContext.Provider,{value:this.providerContext},this.props.children);}},{key:"providerContext",get:function get(){return _extends({},this.state,{set:this.set,setTop:this.setTop,setBottom:this.setBottom,setAriaHidden:this.setAriaHidden,setContentRef:this.setContentRef,getContentRef:this.getContentRef,scrollTop:this.scrollTop});}}]);return ViewProvider;}(Component);export default ViewProvider;
+   */function render(){return/*#__PURE__*/React.createElement(ViewContext.Provider,{value:this.providerContext},this.props.children);}}]);return ViewProvider;}(Component);export default ViewProvider;