@shopgate/engage 7.27.3-alpha.15 → 7.27.3-alpha.17

package/components/RangeSlider/index.js

@@ -1,54 +1,42 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{PureComponent}from'react';import PropTypes from'prop-types';import cxs from'classnames';import styles from"./style";import Handle from"./components/Handle";import{isTouchDevice}from"../../core";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){/**
+ */var RangeSlider=/*#__PURE__*/function(_PureComponent){_inherits(RangeSlider,_PureComponent);var _super=_createSuper(RangeSlider);/**
    * Constructor
    * @param {Object} props The component properties
-   */function RangeSlider(props){var _this2;_classCallCheck(this,RangeSlider);_this2=_callSuper(this,RangeSlider,[props]);/**
-   * Processes touch start events on handles.
-   * @param {Object} event The touch event
-   * @param {number} index The index of the touched handle.
-   */_defineProperty(_this2,"handleTouchStart",function(event,index){_this2.addEventListeners();_this2.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.
-_this2.touchOffset=getTouchPositionX(event)-handleCenterX;});/**
-   * Processes move events on handles.
-   * @param {Object} event The touch event
-   */_defineProperty(_this2,"handleTouchMove",function(event){if(_this2.props.min===_this2.props.max){return;}if(_this2.draggedHandle===null){return;}var _this2$domElement$cur=_this2.domElement.current.getBoundingClientRect(),offsetWidth=_this2$domElement$cur.width,offsetLeft=_this2$domElement$cur.left;// Calculate the absolute offset where the element was touched...
-var deltaX=getTouchPositionX(event)-offsetLeft-_this2.touchOffset;// ...and convert it into a relative value between [0...1].
-deltaX=Math.max(0,Math.min(1,deltaX/offsetWidth));var stateUpdate={};if(_this2.draggedHandle===1){// Right handle dragged
-if(_this2.state.rangeMin<deltaX){stateUpdate.rangeMax=Math.min(1,deltaX);_this2.draggedHandlePixelOffset=Math.abs(stateUpdate.rangeMax-_this2.state.rangeMax);}else{// Not in valid range, swap handles
-_this2.draggedHandle=0;stateUpdate.rangeMax=_this2.state.rangeMin;stateUpdate.rangeMin=deltaX;_this2.draggedHandlePixelOffset=Math.abs(stateUpdate.rangeMin-_this2.state.rangeMin);}}else if(_this2.draggedHandle===0){// Left handle dragged
-if(_this2.state.rangeMax>deltaX){stateUpdate.rangeMin=Math.max(0,deltaX);_this2.draggedHandlePixelOffset=Math.abs(stateUpdate.rangeMin-_this2.state.rangeMin);}else{// Not in valid range, swap handles
-_this2.draggedHandle=1;stateUpdate.rangeMin=_this2.state.rangeMax;stateUpdate.rangeMax=deltaX;_this2.draggedHandlePixelOffset=Math.abs(stateUpdate.rangeMax-_this2.state.rangeMax);}}_this2.draggedHandlePixelOffset*=offsetWidth;_this2.setState(stateUpdate,_this2.triggerChangeCallback);});/**
-   * Processes global touch end events for handles.
-   * @param {Object} e The touch event
-   */_defineProperty(_this2,"handleTouchEnd",function(){_this2.removeEventListeners();_this2.touchOffset=0;_this2.draggedHandle=null;});/**
-   * Processes outer range touch end events.
-   * @param {Object} event The touch event
-   */_defineProperty(_this2,"handleRangeTouch",function(event){var _this2$domElement$cur2=_this2.domElement.current.getBoundingClientRect(),offsetWidth=_this2$domElement$cur2.width,offsetLeft=_this2$domElement$cur2.left;var dx=(getTouchPositionX(event)-offsetLeft)/offsetWidth;var d0=Math.abs(_this2.state.rangeMin-dx);var d1=Math.abs(_this2.state.rangeMax-dx);if(d0<d1){_this2.draggedHandle=0;}else{_this2.draggedHandle=1;}_this2.handleTouchMove(event);});/**
-   * Processes the input field values.
-   * @param {Object} event The change event.
-   */_defineProperty(_this2,"handleInputChange",function(event){var max=_this2.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};_this2.setState(state);});_this2.draggedHandle=null;// 0 for left handle, 1 for right handle or null
-_this2.domElement=React.createRef();_this2.touchOffset=0;_this2.draggedHandlePixelOffset=0;// The absolute pixel delta of the last handle move event.
-_this2.state=_this2.getRange(props);_this2.useMouseEvents=!isTouchDevice();return _this2;}/**
+_this.touchOffset=getTouchPositionX(event)-handleCenterX;});_defineProperty(_assertThisInitialized(_this),"handleTouchMove",function(event){if(_this.props.min===_this.props.max){return;}if(_this.draggedHandle===null){return;}var _this$domElement$curr=_this.domElement.current,offsetWidth=_this$domElement$curr.offsetWidth,offsetLeft=_this$domElement$curr.offsetLeft;// Calculate the absolute offset where the element was touched...
+var deltaX=getTouchPositionX(event)-offsetLeft-_this.touchOffset;// ...and convert it into a relative value between [0...1].
+deltaX=Math.max(0,Math.min(1,deltaX/offsetWidth));var stateUpdate={};if(_this.draggedHandle===1){// Right handle dragged
+if(_this.state.rangeMin<deltaX){stateUpdate.rangeMax=Math.min(1,deltaX);_this.draggedHandlePixelOffset=Math.abs(stateUpdate.rangeMax-_this.state.rangeMax);}else{// Not in valid range, swap handles
+_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=/*#__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);}/**
    * Updates the component properties.
    * @param {Object} newProps The new component properties.
-   */_inherits(RangeSlider,_PureComponent);return _createClass(RangeSlider,[{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(newProps){this.setState(this.getRange(newProps));}/**
+   */},{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(newProps){this.setState(this.getRange(newProps));}/**
+   * 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:"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];}/**
-   * Adds event listeners
-   */},{key:"addEventListeners",value:function addEventListeners(){if(this.useMouseEvents){document.addEventListener('mouseup',this.handleTouchEnd);document.addEventListener('mousemove',this.handleTouchMove);}else{document.addEventListener('touchend',this.handleTouchEnd);document.addEventListener('touchmove',this.handleTouchMove);}}/**
-   * Removes event listeners
-   */},{key:"removeEventListeners",value:function removeEventListeners(){if(this.useMouseEvents){document.removeEventListener('mouseup',this.handleTouchEnd);document.removeEventListener('mousemove',this.handleTouchMove);}else{document.removeEventListener('touchend',this.handleTouchEnd);document.removeEventListener('touchmove',this.handleTouchMove);}}/**
    * Get range min and max from props.
    * @param {Object} props The component props.
    * @returns {Object} The new state
-   */},{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))};}},{key:"triggerChangeCallback",value:/**
+   */},{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",value:/**
    * Calls the change callback in case of a state update.
    */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'),onMouseDown: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,useMouseEvents:this.useMouseEvents}),React.createElement(Handle,{index:1,onTouchStart:this.handleTouchStart,active:this.draggedHandle===1,classNames:classNames,useMouseEvents:this.useMouseEvents}))));}}]);}(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,23 +1,6 @@
-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;}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,forwardRef,useEffect}from'react';import PropTypes from'prop-types';import classNames from'classnames';import{useScrollDirectionChange}from'@shopgate/engage/core/hooks';import{root,scrolledIn,scrolledOut,transition}from"./style";/* eslint-disable react/prop-types */ /**
- * A container component that hides its content on scroll down and shows it on scroll up.
+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}
  *
- * @param {Object} props The component props.
- * @param {boolean}  [props.hideOnScroll] Toggle hide-on-scroll (default: true).
- * @param {number} [props.scrollOffset] Pixels to scroll before toggling (default: 100).
- * @param {boolean} [props.onlyShowAtTop] When set to true, the component content will not be shown
- * till the user scrolls to the top of the page again.
- * @param {number} [props.onlyShowAtTopOffset] Pixel threshold from the top of the page at which the
- * component content will reappear when `showOnScrollToTop` is enabled. The content shows again once
- * the scroll position is less than or equal to this value.
- * @param {Function} [props.onChange] Callback function that is called when the header changes
- * @param {string} [props.className] Extra CSS classes on the root element.
- * @param {Object} [props.classes] Override internal class names.
- * @param {string} [props.classes.scrolledIn] Override class for the scrolled-in state
- * (content is hidden).
- * @param {string} [props.classes.scrolledOut] Override class for the scrolled-out state
- * (content is visible).
- * visibility. Contains a boolean indicating whether the header is visible.
- * @param {React.ReactNode} props.children  Content of the header.
- * @param {React.Ref<HTMLDivElement>} ref   Forwarded ref to the header `<div>`.
- * @returns {JSX.Element}
- */function ScrollHeaderBase(_ref,ref){var className=_ref.className,children=_ref.children,_ref$hideOnScroll=_ref.hideOnScroll,hideOnScroll=_ref$hideOnScroll===void 0?true:_ref$hideOnScroll,_ref$scrollOffset=_ref.scrollOffset,scrollOffset=_ref$scrollOffset===void 0?100:_ref$scrollOffset,_ref$onlyShowAtTop=_ref.onlyShowAtTop,onlyShowAtTop=_ref$onlyShowAtTop===void 0?false:_ref$onlyShowAtTop,_ref$onlyShowAtTopOff=_ref.onlyShowAtTopOffset,onlyShowAtTopOffset=_ref$onlyShowAtTopOff===void 0?0:_ref$onlyShowAtTopOff,onChange=_ref.onChange,classes=_ref.classes;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldHideHeader=_useState2[0],setShouldHideHeader=_useState2[1];useScrollDirectionChange({enabled:hideOnScroll,offset:scrollOffset,onlyFireOnScrollUpAtTop:onlyShowAtTop,onlyFireOnScrollUpAtTopOffset:onlyShowAtTopOffset,onScrollDown:function onScrollDown(){setShouldHideHeader(true);},onScrollUp:function onScrollUp(){setShouldHideHeader(false);}});useEffect(function(){if(typeof onChange!=='function'){return;}onChange(!shouldHideHeader);},[onChange,shouldHideHeader]);return React.createElement("div",{ref:ref,className:classNames(root,transition,className,_defineProperty(_defineProperty({},classNames(scrolledIn,classes===null||classes===void 0?void 0:classes.scrolledIn),!shouldHideHeader),classNames(scrolledOut,classes===null||classes===void 0?void 0:classes.scrolledOut),shouldHideHeader))},children);}/* eslint-enable react/prop-types */var ScrollHeader=forwardRef(ScrollHeaderBase);ScrollHeader.displayName='ScrollHeader';ScrollHeader.propTypes={children:PropTypes.node.isRequired,classes:PropTypes.shape({scrolledIn:PropTypes.string,scrolledOut:PropTypes.string}),className:PropTypes.string,hideOnScroll:PropTypes.bool,onChange:PropTypes.func,onlyShowAtTop:PropTypes.bool,onlyShowAtTopOffset:PropTypes.number,scrollOffset:PropTypes.number};ScrollHeader.defaultProps={className:null,hideOnScroll:true,scrollOffset:100,classes:{},onChange:null,onlyShowAtTop:false,onlyShowAtTopOffset:0};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/ScrollHeader/style.js

@@ -1 +1 @@
-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{css}from'glamor';import{responsiveMediaQuery}from'@shopgate/engage/styles';export var root=css(_defineProperty({position:'sticky',left:0,backgroundColor:'#fff'},responsiveMediaQuery('<=xs',{appAlways:true}),{boxShadow:'rgba(0, 0, 0, 0.118) 0px 1px 6px, rgba(0, 0, 0, 0.118) 0px 1px 4px'}));export var scrolledIn=css({'&&':{transform:'translateY(0%)'}});export var scrolledOut=css({'&&':{transform:'translateY(-250%)'}});export var transition=css({transition:'transform 0.2s ease,transform 0.2s'});
+import{css}from'glamor';export var scrolledIn=css({'&&':{transform:'translateY(0%)'}}).toString();export var scrolledOut=css({'&&':{transform:'translateY(-250%)'}}).toString();export var transition=css({transition:'transform 0.2s ease,transform 0.2s'});

package/components/SheetDrawer/index.js

@@ -1,5 +1,4 @@
-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{createPortal}from'react-dom';import classNames from'classnames';import{useTrackModalState}from'@shopgate/engage/a11y/hooks';import{Sheet}from'@shopgate/engage/components';var node=document.getElementById('portals');/**
+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.Element}
- */function SheetDrawer(props){// Track modal visibility for accessibility purposes.
-useTrackModalState(props.isOpen);return createPortal(React.createElement(Sheet,_extends({},props,{className:classNames(props.className,'engage__sheet-drawer')})),node);}export default SheetDrawer;
+ * @returns {JSX}
+ */function SheetDrawer(props){return/*#__PURE__*/createPortal(/*#__PURE__*/React.createElement(Sheet,props),node);}export default SheetDrawer;

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

@@ -1,6 +1,6 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Component}from'react';import PropTypes from'prop-types';import 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){function Item(){_classCallCheck(this,Item);return _callSuper(this,Item,arguments);}_inherits(Item,_Component);return _createClass(Item,[{key:"shouldComponentUpdate",value:/**
+ */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}
@@ -8,10 +8,10 @@ function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="s
    * 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 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,description=_this$props.description;var gridStyles=_defineProperty(_defineProperty({},styles.grid,true),styles.selected,isSelected);var titleStyles=_defineProperty(_defineProperty({},styles.title,true),styles.disabled,isDisabled);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},React.createElement("div",null,title),description&&React.createElement("div",{className:styles.description,dangerouslySetInnerHTML:{__html:description}})),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,LinkComponent=_this$props2.linkComponent,onClick=_this$props2.onClick,className=_this$props2.className,isDisabled=_this$props2.isDisabled,testId=_this$props2.testId,forwardedRef=_this$props2.forwardedRef,isSelected=_this$props2.isSelected;/**
+   */},{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(LinkComponent,{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()));}}]);}(Component);_defineProperty(Item,"defaultProps",{className:null,description:null,forwardedRef:null,image:null,isDisabled:false,isSelected:false,link:null,linkState:null,onClick:null,rightComponent:null,linkComponent:Link,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/components/Item/style.js

@@ -1 +1 @@
-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{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import{responsiveMediaQuery}from'@shopgate/engage/styles';import{IMAGE_SPACE}from"../../style";var colors=themeConfig.colors,variables=themeConfig.variables;var disabled=css({color:colors.shade5,cursor:'not-allowed'}).toString();var selected=css({background:"var(--color-background-accent, ".concat(colors.shade7,")"),boxShadow:"-16px 0 0 0 var(--color-background-accent, ".concat(colors.shade7,") !important")}).toString();var title=css(_defineProperty({width:'100%',marginTop:variables.gap.xsmall,paddingRight:variables.gap.big,hyphens:'auto',overflowWrap:'break-word',wordBreak:'break-word',color:'var(--color-text-high-emphasis)'},responsiveMediaQuery('>xs',{webOnly:true}),{padding:variables.gap.big,margin:0,fontSize:'1.25rem',lineHeight:'1.5rem'})).toString();var description=css(_defineProperty({display:'none'},responsiveMediaQuery('>xs',{webOnly:true}),{display:'block',color:'var(--color-text-medium-emphasis)',fontSize:'0.875rem',lineHeight:'1.25rem',fontWeight:'initial',paddingTop:variables.gap.small}));var grid=css(_defineProperty({alignItems:'center',minHeight:56,padding:"".concat(variables.gap.small,"px 0"),position:'relative',zIndex:2},responsiveMediaQuery('>xs',{webOnly:true}),{padding:0})).toString();var image=css({alignSelf:'flex-start',flexShrink:0,margin:"0 ".concat(variables.gap.big,"px 0 ").concat(-IMAGE_SPACE+variables.gap.big,"px"),width:40}).toString();var glowHover={boxShadow:"-".concat(variables.gap.bigger,"px 0 0 ").concat(colors.shade8,", ").concat(variables.gap.bigger,"px 0 0 ").concat(colors.shade8)};export default{disabled:disabled,selected:selected,title:title,description:description,grid:grid,image:image,glowHover:glowHover};
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import{IMAGE_SPACE}from"../../style";var colors=themeConfig.colors,variables=themeConfig.variables;var disabled=css({color:colors.shade5}).toString();var selected=css({background:colors.shade7,boxShadow:"-16px 0 0 0 ".concat(colors.shade7," !important")}).toString();var title=css({width:'100%',marginTop:variables.gap.xsmall,paddingRight:16,hyphens:'auto',overflowWrap:'break-word',wordBreak:'break-word'}).toString();var grid=css({alignItems:'center',minHeight:56,padding:"".concat(variables.gap.small,"px 0"),position:'relative',zIndex:2}).toString();var image=css({alignSelf:'flex-start',flexShrink:0,margin:"0 ".concat(variables.gap.big,"px 0 ").concat(-IMAGE_SPACE+variables.gap.big,"px"),width:40}).toString();var glowHover={boxShadow:"-".concat(variables.gap.bigger,"px 0 0 ").concat(colors.shade8,", ").concat(variables.gap.bigger,"px 0 0 ").concat(colors.shade8)};export default{disabled:disabled,selected:selected,title:title,grid:grid,image:image,glowHover:glowHover};

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 _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Component}from'react';import PropTypes from'prop-types';import 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){function SheetList(){_classCallCheck(this,SheetList);return _callSuper(this,SheetList,arguments);}_inherits(SheetList,_Component);return _createClass(SheetList,[{key:"render",value:/**
+ */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}
-   */function render(){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=_defineProperty(_defineProperty({},styles.item,true),styles.itemWithImage,hasImages);return React.createElement(List,{className:"".concat(className," engage__sheet-list"),role:"listbox"},React.Children.map(children,function(child,index){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=_defineProperty(_defineProperty({},styles.itemSelected,isSelected),styles.itemNotLast,!isSelected);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));}));}}]);}(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/SheetList/style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables,colors=themeConfig.colors;export var IMAGE_SPACE=72;var item=css({margin:"0 ".concat(variables.gap.big,"px"),cursor:'pointer'}).toString();var itemNotLast=css({'&:not(:last-child)':{boxShadow:"0 1px 0 0 ".concat(colors.darkGray),marginBottom:1}}).toString();var itemSelected=css({background:"var(--color-background-accent, ".concat(colors.shade7,")"),boxShadow:"-".concat(variables.gap.bigger,"px 0 0 var(--color-background-accent, ").concat(colors.shade7,"), ").concat(variables.gap.bigger,"px 0 0 var(--color-background-accent, ").concat(colors.shade7,")"),marginTop:-1}).toString();var itemWithImage=css({marginLeft:IMAGE_SPACE}).toString();var innerContainer=css({minHeight:56,position:'relative'}).toString();export default{item:item,itemNotLast:itemNotLast,itemSelected:itemSelected,itemWithImage:itemWithImage,innerContainer:innerContainer};
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables,colors=themeConfig.colors;export var IMAGE_SPACE=72;var item=css({margin:"0 ".concat(variables.gap.big,"px")}).toString();var itemNotLast=css({'&:not(:last-child)':{boxShadow:"0 1px 0 0 ".concat(colors.darkGray),marginBottom:1}}).toString();var itemSelected=css({background:colors.shade7,boxShadow:"-".concat(variables.gap.bigger,"px 0 0 ").concat(colors.shade7,", ").concat(variables.gap.bigger,"px 0 0 ").concat(colors.shade7),marginTop:-1}).toString();var itemWithImage=css({marginLeft:IMAGE_SPACE}).toString();var innerContainer=css({minHeight:56,position:'relative'}).toString();export default{item:item,itemNotLast:itemNotLast,itemSelected:itemSelected,itemWithImage:itemWithImage,innerContainer:innerContainer};

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/Switch/index.js

@@ -9,4 +9,4 @@ import React,{useMemo}from'react';import PropTypes from'prop-types';import{Visua
  * when issues with the regular label are expected e.g. due to problematic layout.
  * @param {string} [props.id=null] Optional custom id for checkbox input and label
  * @returns {JSX.Element}
- */var Switch=function Switch(_ref){var disabled=_ref.disabled,checked=_ref.checked,onChange=_ref.onChange,id=_ref.id,a11yFallbackText=_ref.a11yFallbackText,children=_ref.children;var switchId=useMemo(function(){return id||Math.random();},[id]);return React.createElement("div",{className:styles.container},React.createElement("input",{type:"checkbox",disabled:disabled,checked:checked,onChange:onChange,className:styles.input,id:switchId}),children&&React.createElement("label",{htmlFor:switchId},React.createElement("span",{"aria-hidden":!!a11yFallbackText},children),a11yFallbackText&&React.createElement(VisuallyHidden,null,a11yFallbackText)));};Switch.defaultProps={children:null,disabled:false,a11yFallbackText:null,checked:false,onChange:null,id:null};export default Switch;
+ */var Switch=function Switch(_ref){var disabled=_ref.disabled,checked=_ref.checked,onChange=_ref.onChange,id=_ref.id,a11yFallbackText=_ref.a11yFallbackText,children=_ref.children;var switchId=useMemo(function(){return id||Math.random();},[id]);return/*#__PURE__*/React.createElement("div",{className:styles.container},/*#__PURE__*/React.createElement("input",{type:"checkbox",disabled:disabled,checked:checked,onChange:onChange,className:styles.input,id:switchId}),children&&/*#__PURE__*/React.createElement("label",{htmlFor:switchId},/*#__PURE__*/React.createElement("span",{"aria-hidden":!!a11yFallbackText},children),a11yFallbackText&&/*#__PURE__*/React.createElement(VisuallyHidden,null,a11yFallbackText)));};Switch.defaultProps={children:null,disabled:false,a11yFallbackText:null,checked:false,onChange:null,id:null};export default Switch;

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 _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Component,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,15 +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){function TimeBoundary(props){var _this2;_classCallCheck(this,TimeBoundary);_this2=_callSuper(this,TimeBoundary,[props]);/** Clear interval if valid */_defineProperty(_this2,"clear",function(){if(_this2.intervalSubscription){_this2.intervalSubscription.unsubscribe();}});/**
-   * Check time boundary.
-   */_defineProperty(_this2,"checkBoundary",function(){var now=new Date(Date.now());var newState={before:isBefore(now,_this2.props.start),between:isBetween(now,_this2.props.start,_this2.props.end),after:isAfter(now,_this2.props.end)};if(_isEqual(newState,_this2.state)){return;}_this2.setState(newState);if(newState.after){// already after, stop timer
-_this2.clear();}});_this2.state={before:false,between:false,after:false};return _this2;}/**
+ */var TimeBoundary=/*#__PURE__*/function(_Component){_inherits(TimeBoundary,_Component);var _super=_createSuper(TimeBoundary);/**
    * @inheritDoc
-   */_inherits(TimeBoundary,_Component);return _createClass(TimeBoundary,[{key:"componentDidMount",value:function componentDidMount(){this.intervalSubscription=second$.subscribe(this.checkBoundary);this.checkBoundary();}/**
+   */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
-   */},{key:"componentWillUnmount",value:function componentWillUnmount(){this.clear();}},{key:"render",value:/**
-   * @returns {JSX}
-   */function render(){return React.createElement(Fragment,null,this.props.children(this.state));}}]);}(Component);_defineProperty(TimeBoundary,"defaultProps",{end:null,start:null/**
+   */_createClass(TimeBoundary,[{key:"componentDidMount",value:function componentDidMount(){this.intervalSubscription=second$.subscribe(this.checkBoundary);this.checkBoundary();}/**
    * @inheritDoc
-   */});export default TimeBoundary;
+   */},{key:"componentWillUnmount",value:function componentWillUnmount(){this.clear();}/** Clear interval if valid */},{key:"render",value:/**
+   * @returns {JSX}
+   */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,17 +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 _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{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){function VideoPlayer(){var _this2;_classCallCheck(this,VideoPlayer);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this2=_callSuper(this,VideoPlayer,[].concat(args));_defineProperty(_this2,"state",{ready:false,playing:_this2.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
-   */});/** @returns {boolean} */_defineProperty(_this2,"getPlayingState",function(){return _this2.state.ready&&!_this2.state.userPaused&&_this2.state.playing;});/** @returns {void} */_defineProperty(_this2,"handleReady",function(){_this2.setState({ready:true});});/**
-   * Not allowed autoplay error (User gesture permission)
-   * @param {Object} error error
-   */_defineProperty(_this2,"handleError",function(error){if(error&&error.name==='NotAllowedError'){_this2.setState({playing:false});}});/** @returns {undefined} */_defineProperty(_this2,"handlePause",function(){// Check if was not paused programmatically
-if(_this2.state.playing){_this2.setState({userPaused:true,playing:false});}});/** @returns {undefined} */_defineProperty(_this2,"handlePlay",function(){if(!_this2.state.playing){_this2.setState({userPaused:false,playing:true});}});/** @returns {undefined} */_defineProperty(_this2,"handleVisibilityChange",function(){_this2.setState({playing:false});});return _this2;}_inherits(VideoPlayer,_PureComponent);return _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);}},{key:"render",value:/**
+   */},{key:"componentWillUnmount",value:function componentWillUnmount(){UIEvents.removeListener(UI_VISIBILITY_CHANGE,this.handleVisibilityChange);}/** @returns {boolean} */},{key:"render",value:/**
    * @returns {JSX}
-   */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}));}}]);}(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/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/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;