@shopgate/pwa-ui-shared 7.12.7-beta.1 → 7.20.0-beta.10

package/IndicatorCircle/index.js

@@ -6,4 +6,4 @@ import React from'react';import PropTypes from'prop-types';import{themeConfig}fr
  * @param {Object} props.strokeWidth Stroke width of the circle.
  * @param {bool} props.paused Animation should be paused.
  * @returns {JSX}
- */var IndicatorCircle=function IndicatorCircle(_ref){var size=_ref.size,color=_ref.color,strokeWidth=_ref.strokeWidth,paused=_ref.paused;return React.createElement("svg",{className:styles.spinner(paused),viewBox:"25 25 50 50",width:size,height:size,xmlns:"http://www.w3.org/2000/svg","data-test-id":"loadingIndicator"},React.createElement("circle",{className:styles.circle(color,strokeWidth,paused),cx:"50",cy:"50",r:"20"}));};IndicatorCircle.defaultProps={color:"var(--color-secondary, ".concat(themeConfig.colors.accent,")"),paused:false,size:themeConfig.variables.loadingIndicator.size,strokeWidth:themeConfig.variables.loadingIndicator.strokeWidth};export default IndicatorCircle;
+ */var IndicatorCircle=function IndicatorCircle(_ref){var size=_ref.size,color=_ref.color,strokeWidth=_ref.strokeWidth,paused=_ref.paused;return React.createElement("svg",{className:"".concat(styles.spinner(paused)," ui-shared__indicator-circle"),viewBox:"25 25 50 50",width:size,height:size,xmlns:"http://www.w3.org/2000/svg","data-test-id":"loadingIndicator"},React.createElement("circle",{className:styles.circle(color,strokeWidth,paused),cx:"50",cy:"50",r:"20"}));};IndicatorCircle.defaultProps={color:"var(--color-secondary, ".concat(themeConfig.colors.accent,")"),paused:false,size:themeConfig.variables.loadingIndicator.size,strokeWidth:themeConfig.variables.loadingIndicator.strokeWidth};export default IndicatorCircle;

package/LoadingIndicator/index.js

@@ -1,4 +1,4 @@
-import React from'react';import classNames from'classnames';import IndicatorCircle from"../IndicatorCircle";import styles from"./style";/**
+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 from'react';import PropTypes from'prop-types';import classNames from'classnames';import{themeConfig}from'@shopgate/engage';import IndicatorCircle from"../IndicatorCircle";import{container,imgContainer}from"./style";var _themeConfig$variable=themeConfig.variables.loadingIndicator,_themeConfig$variable2=_themeConfig$variable===void 0?{}:_themeConfig$variable,loadingImageSrc=_themeConfig$variable2.imgSrc;/**
  * Renders a loading indicator.
  * @returns {JSX}
- */var LoadingIndicator=function LoadingIndicator(_ref){var className=_ref.className;return React.createElement("div",{className:classNames(className,styles)},React.createElement(IndicatorCircle,null));};LoadingIndicator.defaultProps={className:null};export default LoadingIndicator;
+ */var LoadingIndicator=function LoadingIndicator(_ref){var className=_ref.className;return React.createElement("div",{className:classNames(className,_defineProperty(_defineProperty({},container,!loadingImageSrc),imgContainer,!!loadingImageSrc),'loading-indicator','ui-shared__loading-indicator')},loadingImageSrc?React.createElement("img",{src:loadingImageSrc,alt:""}):React.createElement(IndicatorCircle,null));};LoadingIndicator.defaultProps={className:null};export default LoadingIndicator;

package/LoadingIndicator/style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;var container=css({display:'block',padding:'1em',textAlign:'center',fontSize:'1.5em',color:"var(--color-secondary, ".concat(colors.accent,")")}).toString();export default container;
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;export var container=css({display:'block',padding:'1em',textAlign:'center',fontSize:'1.5em',color:"var(--color-secondary, ".concat(colors.accent,")")});export var imgContainer=css({display:'flex',justifyContent:'center',' img':{maxWidth:'50vw',maxHeight:'50vh'}});

package/Manufacturer/index.js

@@ -4,4 +4,4 @@ import React from'react';import PropTypes from'prop-types';import styles from"./
  * @param {string} props.text The manufacturer name.
  * @param {string} [props.className] CSS classes.
  * @return {JSX}
- */var Manufacturer=function Manufacturer(_ref){var className=_ref.className,text=_ref.text;return React.createElement("div",{className:"".concat(styles," ").concat(className)},React.createElement("span",{dangerouslySetInnerHTML:{__html:text}}));};Manufacturer.defaultProps={className:''};export default Manufacturer;
+ */var Manufacturer=function Manufacturer(_ref){var className=_ref.className,text=_ref.text;return React.createElement("div",{className:"".concat(styles," ").concat(className," ui-shared__manufacturer")},React.createElement("span",{dangerouslySetInnerHTML:{__html:text}}));};Manufacturer.defaultProps={className:''};export default Manufacturer;

package/Manufacturer/style.js

@@ -1,2 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';export default css({// Before the custom properties the primary color was used for this class.
-color:"var(--color-secondary, ".concat(themeConfig.colors.primary,")")}).toString();
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';export default css({color:"var(--color-primary, ".concat(themeConfig.colors.primary,")")}).toString();

package/MessageBar/index.js

@@ -5,4 +5,4 @@ import React,{memo}from'react';import classnames from'classnames';import PropTyp
  * @param {Object} props.classNames Styling.
  * @returns {JSX}
  * @deprecated Please import from `@shopgate/engage/components` instead.
- */var MessageBar=memo(function(_ref){var messages=_ref.messages,classNames=_ref.classNames;return React.createElement("div",{className:classnames(styles.container,classNames.container),role:messages.length>0?'alert':null},messages.map(function(item){var _item$type=item.type,type=_item$type===void 0?'info':_item$type,message=item.message,_item$messageParams=item.messageParams,messageParams=_item$messageParams===void 0?null:_item$messageParams,translated=item.translated;var messageOutput=!translated?i18n.text(message,messageParams):message;return React.createElement("div",{key:"".concat(type,"-").concat(message),className:classnames(classNames.message,styles[type])},React.createElement("span",{"aria-hidden":true},messageOutput));}));});MessageBar.defaultProps={classNames:{container:null,message:null}};export default MessageBar;
+ */var MessageBar=memo(function(_ref){var messages=_ref.messages,classNames=_ref.classNames;return React.createElement("div",{className:classnames(styles.container,classNames.container,'ui-shared__message-bar'),role:messages.length>0?'alert':null},messages.map(function(item){var _item$type=item.type,type=_item$type===void 0?'info':_item$type,message=item.message,_item$messageParams=item.messageParams,messageParams=_item$messageParams===void 0?null:_item$messageParams,translated=item.translated;var messageOutput=!translated?i18n.text(message,messageParams):message;return React.createElement("div",{key:"".concat(type,"-").concat(message),className:classnames(classNames.message,styles[type])},React.createElement("span",{"aria-hidden":true},messageOutput));}));});MessageBar.defaultProps={classNames:{container:null,message:null}};export default MessageBar;

package/NoResults/index.js

@@ -2,4 +2,4 @@ import React from'react';import PropTypes from'prop-types';import classNames fro
  * The NoResults component.
  * @param {Object} props The component props.
  * @returns {JSX}
- */var NoResults=function NoResults(props){return React.createElement("div",{className:classNames(styles.wrapper,props.className),"data-test-id":"noResults"},React.createElement("div",{className:styles.icon},React.createElement(Icon,null)),React.createElement("div",{className:styles.headline},React.createElement(I18n.Text,{string:props.headlineText,params:props})),React.createElement("div",{className:styles.text},React.createElement(I18n.Text,{string:props.bodyText,params:props})));};NoResults.defaultProps={className:null};export default NoResults;
+ */var NoResults=function NoResults(props){return React.createElement("div",{className:classNames(styles.wrapper,props.className,' ui-shared__no-results'),"data-test-id":"noResults"},React.createElement("div",{className:styles.icon},React.createElement(Icon,null)),React.createElement("div",{className:styles.headline},React.createElement(I18n.Text,{string:props.headlineText,params:props})),React.createElement("div",{className:styles.text},React.createElement(I18n.Text,{string:props.bodyText,params:props})));};NoResults.defaultProps={className:null};export default NoResults;

package/Placeholder/index.js

@@ -1,5 +1,5 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{PureComponent}from'react';import PropTypes from'prop-types';import styles from"./style";/**
+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 styles from"./style";/**
  * The placeholder component.
- */var Placeholder=/*#__PURE__*/function(_PureComponent){_inherits(Placeholder,_PureComponent);function Placeholder(){_classCallCheck(this,Placeholder);return _possibleConstructorReturn(this,_getPrototypeOf(Placeholder).apply(this,arguments));}_createClass(Placeholder,[{key:"render",/* eslint-disable react/no-unused-prop-types */ /* eslint-enable react/no-unused-prop-types */ /**
+ */var Placeholder=/*#__PURE__*/function(_PureComponent){function Placeholder(){_classCallCheck(this,Placeholder);return _callSuper(this,Placeholder,arguments);}_inherits(Placeholder,_PureComponent);return _createClass(Placeholder,[{key:"render",value:/**
    * @returns {JSX}
-   */value:function render(){return React.createElement("div",{className:styles,style:this.props});}}]);return Placeholder;}(PureComponent);_defineProperty(Placeholder,"defaultProps",{height:0,left:0,top:0,width:0});export default Placeholder;
+   */function render(){return React.createElement("div",{className:"".concat(styles," ui-shared__placeholder"),style:this.props});}}]);}(PureComponent);/* eslint-disable react/no-unused-prop-types */ /* eslint-enable react/no-unused-prop-types */_defineProperty(Placeholder,"defaultProps",{height:0,left:0,top:0,width:0});export default Placeholder;

package/PlaceholderLabel/index.js

@@ -2,4 +2,4 @@ import React from'react';import PropTypes from'prop-types';import styles from"./
  * Placeholder for one line texts.
  * @param {Object} props The component props.
  * @return {JSX}
- */var PlaceholderLabel=function PlaceholderLabel(_ref){var children=_ref.children,className=_ref.className,ready=_ref.ready,style=_ref.style;if(!ready){return React.createElement("div",{style:style,className:"".concat(styles.label," ").concat(className)});}return children;};PlaceholderLabel.defaultProps={children:null,className:'',style:null,ready:false};export default PlaceholderLabel;
+ */var PlaceholderLabel=function PlaceholderLabel(_ref){var children=_ref.children,className=_ref.className,ready=_ref.ready,style=_ref.style;if(!ready){return React.createElement("div",{style:style,className:"".concat(styles.label," ").concat(className," ui-shared__placeholder-label")});}return children;};PlaceholderLabel.defaultProps={children:null,className:'',style:null,ready:false};export default PlaceholderLabel;

package/PlaceholderParagraph/index.js

@@ -3,4 +3,4 @@ import React from'react';import PropTypes from'prop-types';import range from'lod
  * Creates a simple paragraph out of PlaceholderLabels.
  * @param {Object} props The component props.
  * @return {JSX}
- */var PlaceholderParagraph=function PlaceholderParagraph(_ref){var className=_ref.className,children=_ref.children,lines=_ref.lines,ready=_ref.ready;if(ready){return children;}return React.createElement("div",null,range(lines).map(function(num){var width=num%2===0?"".concat(widths[(num/2+widths.length)%widths.length],"%"):null;return React.createElement(PlaceholderLabel,{key:num,style:width?{width:width}:null,className:className});}));};PlaceholderParagraph.defaultProps={className:'',lines:3,ready:false};export default PlaceholderParagraph;
+ */var PlaceholderParagraph=function PlaceholderParagraph(_ref){var className=_ref.className,children=_ref.children,lines=_ref.lines,ready=_ref.ready;if(ready){return children;}return React.createElement("div",{className:"ui-shared__placeholder-paragraph"},range(lines).map(function(num){var width=num%2===0?"".concat(widths[(num/2+widths.length)%widths.length],"%"):null;return React.createElement(PlaceholderLabel,{key:num,style:width?{width:width}:null,className:className});}));};PlaceholderParagraph.defaultProps={className:'',lines:3,ready:false};export default PlaceholderParagraph;

package/Price/index.js

@@ -1,4 +1,4 @@
-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 from'react';import PropTypes from'prop-types';import classNames from'classnames';import I18n from'@shopgate/pwa-common/components/I18n';import showTaxDisclaimer from'@shopgate/pwa-common-commerce/market/helpers/showTaxDisclaimer';import styles from"./style";/**
+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 from'react';import PropTypes from'prop-types';import classNames from'classnames';import I18n from'@shopgate/pwa-common/components/I18n';import showTaxDisclaimer from'@shopgate/pwa-common-commerce/market/helpers/showTaxDisclaimer';import{useWidgetSettings}from'@shopgate/engage/core/hooks/useWidgetSettings';import styles from"./style";/**
  * The Price component
  * @param {Object} props The component props
  * @param {string} [props.className] CSS classes
@@ -8,8 +8,10 @@ function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj
  * @param {boolean} props.discounted Tells if the pice is discounted
  * @param {Object} context The component context.
  * @return {JSX}
- */var Price=function Price(props,context){var containerClasses=classNames(styles.container,props.className,_defineProperty({},styles.discounted,props.discounted));var _context$i18n=context.i18n(),__=_context$i18n.__,_p=_context$i18n._p;var ariaPrice;if(props.unitPriceMin){ariaPrice=__('price.from',{price:_p(props.unitPriceMin,props.currency,props.fractions)});}else{ariaPrice=_p(props.unitPrice,props.currency,props.fractions);}ariaPrice=ariaPrice.replace('-',"\u2212");/* eslint-disable jsx-a11y/aria-role */ /**
+ */var Price=function Price(props,context){// Added with PWA 6 - CCP-2372
+var _useWidgetSettings=useWidgetSettings('@shopgate/engage/components/TaxDisclaimer'),show=_useWidgetSettings.show,hint=_useWidgetSettings.hint;// use widget setting if set to true/false, otherwise use market logic
+var showDisclaimer=typeof show==='boolean'?show:showTaxDisclaimer;var containerClasses=classNames(styles.container,props.className,_defineProperty({},styles.discounted,props.discounted),'price',props.discounted?'ui-shared__price-discounted':'ui-shared__price');var _context$i18n=context.i18n(),__=_context$i18n.__,_p=_context$i18n._p;var ariaPrice;if(props.unitPriceMin){ariaPrice=__('price.from',{price:_p(props.unitPriceMin,props.currency,props.fractions)});}else{ariaPrice=_p(props.unitPrice,props.currency,props.fractions);}ariaPrice=ariaPrice.replace('-',"\u2212");/* eslint-disable jsx-a11y/aria-role */ /**
    * A unitPriceMin > 0 means, that the product has child products with different prices.
    * The unitPriceMin contains the lowest of these prices and will be
    * displayed with a 'From' prefix.
-   */return React.createElement("div",{className:containerClasses,"data-test-id":"minPrice: ".concat(props.unitPriceMin," price: ").concat(props.unitPrice," currency: ").concat(props.currency)},React.createElement("span",{role:"text","aria-label":__('price.label',{price:ariaPrice})},props.unitPriceMin?React.createElement(I18n.Text,{string:"price.from"},React.createElement(I18n.Price,{currency:props.currency,fractions:props.fractions,forKey:"price",price:props.unitPriceMin})):React.createElement(React.Fragment,null,props.allowFree&&props.unitPrice===0?React.createElement(I18n.Text,{string:"price.free"}):React.createElement(I18n.Price,{currency:props.currency,fractions:props.fractions,price:props.unitPrice}))),props.taxDisclaimer&&showTaxDisclaimer?React.createElement("div",{role:"text",className:styles.disclaimer,"aria-label":__('product.tax_disclaimer')},"*"):null);/* eslint-enable jsx-a11y/aria-role */};Price.defaultProps={className:'',unitPriceMin:0,discounted:false,fractions:true,taxDisclaimer:false,allowFree:false};Price.contextTypes={i18n:PropTypes.func};export default Price;
+   */return React.createElement("div",{className:containerClasses,"data-test-id":"minPrice: ".concat(props.unitPriceMin," price: ").concat(props.unitPrice," currency: ").concat(props.currency)},React.createElement("span",{role:"text","aria-label":__('price.label',{price:ariaPrice})},props.unitPriceMin?React.createElement(I18n.Text,{string:"price.from"},React.createElement(I18n.Price,{currency:props.currency,fractions:props.fractions,forKey:"price",price:props.unitPriceMin})):React.createElement(React.Fragment,null,props.allowFree&&props.unitPrice===0?React.createElement(I18n.Text,{string:"price.free"}):React.createElement(I18n.Price,{currency:props.currency,fractions:props.fractions,price:props.unitPrice}))),props.taxDisclaimer&&showDisclaimer?React.createElement("div",{role:"text",className:styles.disclaimer,"aria-label":__('product.tax_disclaimer')},hint||'*'):null);/* eslint-enable jsx-a11y/aria-role */};Price.defaultProps={className:'',unitPriceMin:0,discounted:false,fractions:true,taxDisclaimer:false,allowFree:false};Price.contextTypes={i18n:PropTypes.func};export default Price;

package/Price/style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var container=css({display:'flex',position:'relative',whiteSpace:'nowrap'}).toString();var disclaimer=css({color:'initial',fontSize:14,marginLeft:10}).toString();var discounted=css({color:"var(--color-primary, ".concat(themeConfig.colors.primary,")")}).toString();export default{container:container,disclaimer:disclaimer,discounted:discounted};
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var container=css({display:'flex',position:'relative',whiteSpace:'nowrap'}).toString();var disclaimer=css({color:'initial',fontSize:14,position:'absolute',right:-10,top:0}).toString();var discounted=css({color:"var(--color-primary, ".concat(themeConfig.colors.primary,")")}).toString();export default{container:container,disclaimer:disclaimer,discounted:discounted};

package/PriceInfo/index.js

@@ -4,4 +4,4 @@ import React from'react';import PropTypes from'prop-types';import styles from"./
  * @param {string} props.text The price info string e.g. 12,00 € / l
  * @param {string} [props.className] CSS classes
  * @return {JSX}
- */var PriceInfo=function PriceInfo(_ref){var className=_ref.className,text=_ref.text;return React.createElement("div",{className:"".concat(styles," ").concat(className),dangerouslySetInnerHTML:{__html:text},"data-test-id":"priceInfo: ".concat(text)});};PriceInfo.defaultProps={className:''};export default PriceInfo;
+ */var PriceInfo=function PriceInfo(_ref){var className=_ref.className,text=_ref.text;return React.createElement("div",{className:"".concat(styles," ").concat(className," ui-shared__price-info"),dangerouslySetInnerHTML:{__html:text},"data-test-id":"priceInfo: ".concat(text)});};PriceInfo.defaultProps={className:''};export default PriceInfo;

package/PriceStriked/index.js

@@ -1,4 +1,4 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Component}from'react';import PropTypes from'prop-types';import I18n from'@shopgate/pwa-common/components/I18n';import styles from"./style";/**
+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 I18n from'@shopgate/pwa-common/components/I18n';import styles from"./style";/**
  * Calculates the angle for the strike-through line
  * @param {HTMLElement} element The price element
  * @returns {number} the calculated angle
@@ -13,19 +13,19 @@ return Math.round(90-Math.atan(width/height)*(180/Math.PI));};/**
  * @param {string} props.currency The currency of the price
  * @param {string} [props.className] CSS classes
  * @return {JSX}
- */var PriceStriked=/*#__PURE__*/function(_Component){_inherits(PriceStriked,_Component);/**
+ */var PriceStriked=/*#__PURE__*/function(_Component){/**
    * Constructor
    * @param {Object} props The component props
-   */function PriceStriked(props){var _this;_classCallCheck(this,PriceStriked);_this=_possibleConstructorReturn(this,_getPrototypeOf(PriceStriked).call(this,props));_defineProperty(_assertThisInitialized(_this),"setAngle",function(){if(_this.element){_this.angle=calcAngle(_this.element);return true;}return false;});_this.angle=null;_this.element=null;return _this;}/**
-   * Updates the component one more time with the calculated angle
-   * based on the DOM element.
-   */_createClass(PriceStriked,[{key:"componentDidMount",value:function componentDidMount(){if(this.setAngle()){this.forceUpdate();}}/**
+   */function PriceStriked(props){var _this2;_classCallCheck(this,PriceStriked);_this2=_callSuper(this,PriceStriked,[props]);/**
    * Sets the calculated angle for the DOM element
    * and returns true if succeeded.
    * @param {Object} element The target element.
    * @returns {boolean}
-   */},{key:"render",/**
+   */_defineProperty(_this2,"setAngle",function(){if(_this2.element){_this2.angle=calcAngle(_this2.element);return true;}return false;});_this2.angle=null;_this2.element=null;return _this2;}/**
+   * Updates the component one more time with the calculated angle
+   * based on the DOM element.
+   */_inherits(PriceStriked,_Component);return _createClass(PriceStriked,[{key:"componentDidMount",value:function componentDidMount(){if(this.setAngle()){this.forceUpdate();}}},{key:"render",value:/**
    * Renders the component.
    * @returns {JSX}
-   */value:function render(){var _this2=this;var _this$context$i18n=this.context.i18n(),__=_this$context$i18n.__,_p=_this$context$i18n._p;var angleStyle=this.angle?styles.getAngleStyle(this.angle):'';return(// eslint-disable-next-line jsx-a11y/aria-role
-React.createElement("div",{role:"text",className:"".concat(styles.basic," ").concat(this.props.className," ").concat(angleStyle)},React.createElement("span",{ref:function ref(_ref){_this2.element=_ref;},"data-test-id":"strikedPrice: ".concat(this.props.value),"aria-label":__('price.label_old_price',{price:_p(this.props.value,this.props.currency,true)})},React.createElement(I18n.Price,{price:this.props.value,currency:this.props.currency}))));}}]);return PriceStriked;}(Component);_defineProperty(PriceStriked,"defaultProps",{className:''});_defineProperty(PriceStriked,"contextTypes",{i18n:PropTypes.func});export default PriceStriked;
+   */function render(){var _this3=this;var _this$context$i18n=this.context.i18n(),__=_this$context$i18n.__,_p=_this$context$i18n._p;var angleStyle=this.angle?styles.getAngleStyle(this.angle):'';return React.createElement("div",{// eslint-disable-next-line jsx-a11y/aria-role
+role:"text",className:"".concat(styles.basic," ").concat(this.props.className," ").concat(angleStyle," price-striked ui-shared__price-striked")},React.createElement("span",{ref:function ref(_ref){_this3.element=_ref;},"data-test-id":"strikedPrice: ".concat(this.props.value),"aria-label":__('price.label_old_price',{price:_p(this.props.value,this.props.currency,true)})},React.createElement(I18n.Price,{price:this.props.value,currency:this.props.currency})));}}]);}(Component);_defineProperty(PriceStriked,"defaultProps",{className:''});_defineProperty(PriceStriked,"contextTypes",{i18n:PropTypes.func});export default PriceStriked;

package/ProductProperties/index.js

@@ -1,5 +1,5 @@
-import React from'react';import PropTypes from'prop-types';import Ellipsis from'@shopgate/pwa-common/components/Ellipsis';/**
+import React from'react';import PropTypes from'prop-types';import classNames from'classnames';import Ellipsis from'@shopgate/pwa-common/components/Ellipsis';/**
  * The Product Properties component.
  * @param {Object} props The component props.
  * @returns {JSX}
- */var Properties=function Properties(_ref){var lineClamp=_ref.lineClamp,properties=_ref.properties,className=_ref.className;if(!properties.length){return null;}return React.createElement("ul",{className:className},properties.map(function(_ref2){var label=_ref2.label,value=_ref2.value;return React.createElement("li",{key:"".concat(label,"-").concat(value)},lineClamp&&React.createElement(Ellipsis,{rows:lineClamp},"".concat(label,": ").concat(value)),!lineClamp&&"".concat(label,": ").concat(value));}));};Properties.defaultProps={className:null,lineClamp:null,properties:[]};export default Properties;
+ */var Properties=function Properties(_ref){var lineClamp=_ref.lineClamp,properties=_ref.properties,className=_ref.className;if(!properties.length){return null;}return React.createElement("ul",{className:classNames(className,'ui-shared__product-properties')},properties.map(function(_ref2){var label=_ref2.label,value=_ref2.value;return React.createElement("li",{key:"".concat(label,"-").concat(value)},lineClamp&&React.createElement(Ellipsis,{rows:lineClamp},"".concat(label,": ").concat(value)),!lineClamp&&"".concat(label,": ").concat(value));}));};Properties.defaultProps={className:null,lineClamp:null,properties:[]};export default Properties;

package/ProgressBar/index.js

@@ -1,19 +1,13 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _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 Transition from'react-transition-group/Transition';import UIEvents from'@shopgate/pwa-core/emitters/ui';import styles from"./style";var duration=150;var transitionStyles={entering:{transform:'scale(1, 1)'},entered:{transform:'scale(1, 1)'},exited:{transform:'scale(1, 0)'},exiting:{transform:'scale(1, 0)'}};/**
+var _ProgressBar;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,{Component}from'react';import PropTypes from'prop-types';import Transition from'react-transition-group/Transition';import UIEvents from'@shopgate/pwa-core/emitters/ui';import styles from"./style";var duration=150;var transitionStyles={entering:{transform:'scale(1, 1)'},entered:{transform:'scale(1, 1)'},exited:{transform:'scale(1, 0)'},exiting:{transform:'scale(1, 0)'}};/**
  * A component for visualizing any kind of progress.
  * This component will show the current progress in a linear bar.
- */var ProgressBar=/*#__PURE__*/function(_Component){_inherits(ProgressBar,_Component);/**
-   * Shows the progress bar.
-   * @param {string} pattern The router pattern to show the bar for.
-   */ /**
-   * Hides the progress bar.
-   * @param {string} pattern The router pattern to hide the bar from.
-   */ /**
+ */var ProgressBar=/*#__PURE__*/function(_Component){/**
    * The constructor
    * @param {Object} props The component props.
-   */function ProgressBar(props){var _this;_classCallCheck(this,ProgressBar);_this=_possibleConstructorReturn(this,_getPrototypeOf(ProgressBar).call(this,props));_this.state={isAnimating:props.isVisible,isVisible:props.isVisible};return _this;}/**
+   */function ProgressBar(props){var _this2;_classCallCheck(this,ProgressBar);_this2=_callSuper(this,ProgressBar,[props]);_this2.state={isAnimating:props.isVisible,isVisible:props.isVisible};return _this2;}/**
    * Update the state based on props.
    * @param {Object} nextProps The next set of props.
-   */_createClass(ProgressBar,[{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){if(this.props.isVisible===nextProps.isVisible){return;}this.setState(_extends({},nextProps.isVisible&&{isAnimating:true},{isVisible:nextProps.isVisible}));}/**
+   */_inherits(ProgressBar,_Component);return _createClass(ProgressBar,[{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){if(this.props.isVisible===nextProps.isVisible){return;}this.setState(_extends({},nextProps.isVisible&&{isAnimating:true},{isVisible:nextProps.isVisible}));}/**
    * Only update when certain state changes are made.
    * @param {Object} nextProps The next set of props.
    * @param {Object} nextState The next component state.
@@ -21,5 +15,11 @@ function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="s
    */},{key:"shouldComponentUpdate",value:function shouldComponentUpdate(nextProps,nextState){return this.state.isAnimating!==nextState.isAnimating||this.state.isVisible!==nextState.isVisible;}/**
    * Renders the component.
    * @return {JSX}
-   */},{key:"render",value:function render(){var _this2=this;var animationClasses=[styles.innerElement];// Add the animation if we need it.
-if(this.state.isAnimating){animationClasses.push(styles.animating);}return React.createElement(Transition,{"in":this.state.isVisible,timeout:duration,onExited:function onExited(){_this2.setState({isAnimating:false});}},function(state){return React.createElement("div",{className:styles.wrapper(),style:transitionStyles[state]},React.createElement("div",{className:animationClasses.join(' ')}));});}}]);return ProgressBar;}(Component);_defineProperty(ProgressBar,"PROGRESS_BAR_SHOW",'PROGRESS_BAR_SHOW');_defineProperty(ProgressBar,"PROGRESS_BAR_HIDE",'PROGRESS_BAR_HIDE');_defineProperty(ProgressBar,"show",function(pattern){UIEvents.emit(ProgressBar.PROGRESS_BAR_SHOW,pattern);});_defineProperty(ProgressBar,"hide",function(pattern){UIEvents.emit(ProgressBar.PROGRESS_BAR_HIDE,pattern);});_defineProperty(ProgressBar,"defaultProps",{isVisible:true});export default ProgressBar;
+   */},{key:"render",value:function render(){var _this3=this;var animationClasses=[styles.innerElement];// Add the animation if we need it.
+if(this.state.isAnimating){animationClasses.push(styles.animating);}return React.createElement(Transition,{"in":this.state.isVisible,timeout:duration,onExited:function onExited(){_this3.setState({isAnimating:false});}},function(state){return React.createElement("div",{className:"".concat(styles.wrapper()," ui-shared__progress-bar"),style:transitionStyles[state]},React.createElement("div",{className:animationClasses.join(' ')}));});}}]);}(Component);_ProgressBar=ProgressBar;_defineProperty(ProgressBar,"PROGRESS_BAR_SHOW",'PROGRESS_BAR_SHOW');_defineProperty(ProgressBar,"PROGRESS_BAR_HIDE",'PROGRESS_BAR_HIDE');/**
+   * Shows the progress bar.
+   * @param {string} pattern The router pattern to show the bar for.
+   */_defineProperty(ProgressBar,"show",function(pattern){UIEvents.emit(_ProgressBar.PROGRESS_BAR_SHOW,pattern);});/**
+   * Hides the progress bar.
+   * @param {string} pattern The router pattern to hide the bar from.
+   */_defineProperty(ProgressBar,"hide",function(pattern){UIEvents.emit(_ProgressBar.PROGRESS_BAR_HIDE,pattern);});_defineProperty(ProgressBar,"defaultProps",{isVisible:true});export default ProgressBar;

package/RatingNumber/index.js

@@ -4,4 +4,4 @@ import React from'react';import PropTypes from'prop-types';import I18n from'@sho
  * @param {number} props.rating Rating value.
  * @param {string} props.className Class name.
  * @returns {JSX}
- */var RatingNumber=function RatingNumber(_ref){var rating=_ref.rating,className=_ref.className;if(!rating&&rating!==0){return null;}var number=rating/RATING_SCALE_DIVISOR;if(Number.isNaN(number)){return null;}return React.createElement(I18n.Number,{number:number,className:className,fractions:2});};RatingNumber.defaultProps={className:'',rating:null};export default RatingNumber;
+ */var RatingNumber=function RatingNumber(_ref){var rating=_ref.rating,className=_ref.className;if(!rating&&rating!==0){return null;}var number=rating/RATING_SCALE_DIVISOR;if(Number.isNaN(number)){return null;}return React.createElement(I18n.Number,{number:number,className:"".concat(className," ui-shared__rating-number"),fractions:2});};RatingNumber.defaultProps={className:'',rating:null};export default RatingNumber;

package/RatingStars/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 _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 times from'lodash/times';import StarIcon from"../icons/StarIcon";import StarHalfIcon from"../icons/StarHalfIcon";import styles from"./style";import{RATING_SCALE_DIVISOR}from"./constants";/**
+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,{Component}from'react';import PropTypes from'prop-types';import times from'lodash/times';import StarIcon from"../icons/StarIcon";import StarHalfIcon from"../icons/StarHalfIcon";import styles from"./style";import{RATING_SCALE_DIVISOR}from"./constants";/**
  * The available style keys for the rating stars.
  */var numStars=5;/**
  * The rating stars component.
  * @param {Object} props The component props.
  * @returns {JSX}
- */var RatingStars=/*#__PURE__*/function(_Component){_inherits(RatingStars,_Component);function RatingStars(){_classCallCheck(this,RatingStars);return _possibleConstructorReturn(this,_getPrototypeOf(RatingStars).apply(this,arguments));}_createClass(RatingStars,[{key:"shouldComponentUpdate",/**
-   * Context types definition.
-   * @type {{i18n: shim}}
-   */ /**
+ */var RatingStars=/*#__PURE__*/function(_Component){function RatingStars(){_classCallCheck(this,RatingStars);return _callSuper(this,RatingStars,arguments);}_inherits(RatingStars,_Component);return _createClass(RatingStars,[{key:"shouldComponentUpdate",value:/**
    * Only update the component if the star rating changed.
    * @param {Object} nextProps The next component props.
    * @returns {boolean}
-   */value:function shouldComponentUpdate(nextProps){return nextProps.value!==this.props.value;}/**
+   */function shouldComponentUpdate(nextProps){return nextProps.value!==this.props.value;}/**
    * Returns textual version of stars for screen readers.
    * @param {number} stars Number of stars.
    * @returns {string}
@@ -26,5 +23,8 @@ function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="s
    */},{key:"handleSelection",value:function handleSelection(e,pos){var onSelection=this.props.onSelection;e.target.value=pos*RATING_SCALE_DIVISOR;onSelection(e);}/**
    * Renders the component.
    * @returns {JSX}
-   */},{key:"render",value:function render(){var _this=this;var _this$props=this.props,value=_this$props.value,isSelectable=_this$props.isSelectable;var ratedStars=value/RATING_SCALE_DIVISOR;var numFullStars=Math.floor(ratedStars);var numHalfStars=Math.ceil(ratedStars-numFullStars);var size=styles.iconStyles[this.props.display].iconSize;var className=[styles.container,this.props.className,'ui-shared__rating-stars'].join(' ');var iconClassName=[styles.iconStyles[this.props.display].iconStyle,styles.icon].join(' ');var emptyStars=[].concat(times(numStars,function(i){var pos=i+1;var starProps=_extends({className:iconClassName,key:pos},isSelectable&&{'aria-label':_this.getTextualCTA(pos),role:'button',onClick:function onClick(e){return _this.handleSelection(e,pos);}});return React.createElement("div",starProps,React.createElement(StarIcon,{size:size}));}));var filledStars=[].concat(times(numFullStars,function(i){var pos=i+1;var starProps=_extends({className:iconClassName,key:numStars+pos},isSelectable&&{'aria-hidden':true,// Aria hidden since it's basically a duplicate for a screen reader.
-role:'button',onClick:function onClick(e){return _this.handleSelection(e,pos);}});return React.createElement("div",starProps,React.createElement(StarIcon,{size:size}));}),times(numHalfStars,function(i){return React.createElement("div",{className:iconClassName,key:i+numFullStars},React.createElement(StarHalfIcon,{size:size}));}));/* eslint-disable jsx-a11y/aria-role */return React.createElement("div",{role:"text",className:className,"aria-label":this.getTextualFinal(ratedStars),"data-test-id":"ratedStars: ".concat(ratedStars)},React.createElement("div",{className:"".concat(styles.emptyStars," rating-stars-empty")},emptyStars),React.createElement("div",{className:"".concat(styles.filledStars," rating-stars-filled")},filledStars));/* eslint-enable jsx-a11y/aria-role */}}]);return RatingStars;}(Component);_defineProperty(RatingStars,"contextTypes",{i18n:PropTypes.func});_defineProperty(RatingStars,"defaultProps",{className:'',display:'small',isSelectable:false,onSelection:function onSelection(){}});export default RatingStars;
+   */},{key:"render",value:function render(){var _this2=this;var _this$props=this.props,value=_this$props.value,isSelectable=_this$props.isSelectable;var ratedStars=value/RATING_SCALE_DIVISOR;var numFullStars=Math.floor(ratedStars);var numHalfStars=Math.ceil(ratedStars-numFullStars);var size=styles.iconStyles[this.props.display].iconSize;var className=[styles.container,this.props.className,'ui-shared__rating-stars'].join(' ');var iconClassName=[styles.iconStyles[this.props.display].iconStyle,styles.icon].join(' ');var emptyStars=[].concat(times(numStars,function(i){var pos=i+1;var starProps=_extends({className:iconClassName,key:pos},isSelectable&&{'aria-label':_this2.getTextualCTA(pos),role:'button',onClick:function onClick(e){return _this2.handleSelection(e,pos);}});return React.createElement("div",starProps,React.createElement(StarIcon,{size:size}));}));var filledStars=[].concat(times(numFullStars,function(i){var pos=i+1;var starProps=_extends({className:iconClassName,key:numStars+pos},isSelectable&&{'aria-hidden':true,// Aria hidden since it's basically a duplicate for a screen reader.
+role:'button',onClick:function onClick(e){return _this2.handleSelection(e,pos);}});return React.createElement("div",starProps,React.createElement(StarIcon,{size:size}));}),times(numHalfStars,function(i){return React.createElement("div",{className:iconClassName,key:i+numFullStars},React.createElement(StarHalfIcon,{size:size}));}));/* eslint-disable jsx-a11y/aria-role */return React.createElement("div",{role:"text",className:className,"aria-label":this.getTextualFinal(ratedStars),"data-test-id":"ratedStars: ".concat(ratedStars)},React.createElement("div",{className:"".concat(styles.emptyStars," rating-stars-empty")},emptyStars),React.createElement("div",{className:"".concat(styles.filledStars," rating-stars-filled")},filledStars));/* eslint-enable jsx-a11y/aria-role */}}]);}(Component);/**
+   * Context types definition.
+   * @type {{i18n: shim}}
+   */_defineProperty(RatingStars,"contextTypes",{i18n:PropTypes.func});_defineProperty(RatingStars,"defaultProps",{className:'',display:'small',isSelectable:false,onSelection:function onSelection(){}});export default RatingStars;

package/RatingStars/style.js

@@ -1,5 +1,4 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;var container=css({position:'relative'}).toString();var icon=css({display:'inline-block',verticalAlign:'top',outline:0}).toString();var emptyStars=css({color:"var(--color-background-accent, ".concat(themeConfig.colors.shade7,")")}).toString();var filledStars=css({position:'absolute',// Before the custom properties the primary color was used for this class.
-color:"var(--color-secondary, ".concat(colors.primary,")"),top:0}).toString();/**
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;var container=css({position:'relative'}).toString();var icon=css({display:'inline-block',verticalAlign:'top',outline:0}).toString();var emptyStars=css({color:themeConfig.colors.shade7}).toString();var filledStars=css({position:'absolute',color:"var(--color-primary, ".concat(colors.primary,")"),top:0}).toString();/**
  * The rating stars styles that can be selected by passing the style key to the
  * @type {Object}
  */var iconStyles={small:{iconSize:'1em',iconStyle:css({marginRight:'0.1em'}).toString()},big:{iconSize:'1.24em',iconStyle:css({marginRight:'0.12em'}).toString()},large:{iconSize:'2.3em',iconStyle:css({marginRight:'0.23em'}).toString()}};export default{container:container,icon:icon,iconStyles:iconStyles,emptyStars:emptyStars,filledStars:filledStars};

package/Ripple/components/RippleAnimation/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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Component}from'react';import PropTypes from'prop-types';import Transition from'react-inline-transition-group';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import style from"../../style";/**
+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 Transition from'react-inline-transition-group';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import style from"../../style";/**
  * The ripple animation component.
- */var RippleAnimation=/*#__PURE__*/function(_Component){_inherits(RippleAnimation,_Component);function RippleAnimation(){var _getPrototypeOf2;var _this;_classCallCheck(this,RippleAnimation);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_possibleConstructorReturn(this,(_getPrototypeOf2=_getPrototypeOf(RippleAnimation)).call.apply(_getPrototypeOf2,[this].concat(args)));_defineProperty(_assertThisInitialized(_this),"handlePhaseEnd",function(){_this.props.onComplete();});return _this;}_createClass(RippleAnimation,[{key:"render",/**
+ */var RippleAnimation=/*#__PURE__*/function(_Component){function RippleAnimation(){var _this2;_classCallCheck(this,RippleAnimation);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this2=_callSuper(this,RippleAnimation,[].concat(args));_defineProperty(_this2,"handlePhaseEnd",function(){_this2.props.onComplete();});return _this2;}_inherits(RippleAnimation,_Component);return _createClass(RippleAnimation,[{key:"render",value:/**
    * Renders the component.
    * @returns {JSX}
-   */value:function render(){var duration=this.props.duration;return React.createElement(Transition,{childrenStyles:{base:{backgroundColor:this.props.color,height:this.props.size,width:this.props.size,transform:'translate3d(-50%, -50%, 0) scale3d(0, 0, 1)',transition:"opacity ".concat(duration,"ms cubic-bezier(0.25, 0.1, 0.25, 1), transform ").concat(duration,"ms cubic-bezier(0.25, 0.1, 0.25, 1)"),left:this.props.x,top:this.props.y,opacity:0.25},appear:{transform:'translate3d(-50%, -50%, 0) scale3d(1, 1, 1)',opacity:0},enter:{transform:'translate3d(-50%, -50%, 0) scale3d(1, 1, 1)',opacity:0},leave:{}},onPhaseEnd:this.handlePhaseEnd},React.createElement("div",{className:style.ripple}));}}]);return RippleAnimation;}(Component);_defineProperty(RippleAnimation,"defaultProps",{color:themeConfig.colors.dark,duration:300,onComplete:function onComplete(){},size:48,x:0,y:0});export default RippleAnimation;
+   */function render(){var duration=this.props.duration;return React.createElement(Transition,{childrenStyles:{base:{backgroundColor:this.props.color,height:this.props.size,width:this.props.size,transform:'translate3d(-50%, -50%, 0) scale3d(0, 0, 1)',transition:"opacity ".concat(duration,"ms cubic-bezier(0.25, 0.1, 0.25, 1), transform ").concat(duration,"ms cubic-bezier(0.25, 0.1, 0.25, 1)"),left:this.props.x,top:this.props.y,opacity:0.25},appear:{transform:'translate3d(-50%, -50%, 0) scale3d(1, 1, 1)',opacity:0},enter:{transform:'translate3d(-50%, -50%, 0) scale3d(1, 1, 1)',opacity:0},leave:{}},onPhaseEnd:this.handlePhaseEnd},React.createElement("div",{className:style.ripple}));}}]);}(Component);_defineProperty(RippleAnimation,"defaultProps",{color:themeConfig.colors.dark,duration:300,onComplete:function onComplete(){},size:48,x:0,y:0});export default RippleAnimation;

package/Ripple/index.js

@@ -1,11 +1,17 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{PureComponent}from'react';import PropTypes from'prop-types';import{findDOMNode}from'react-dom';import clamp from'lodash/clamp';import{shift}from'@shopgate/pwa-common/helpers/data';import{getOffset}from'@shopgate/pwa-common/helpers/dom';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import RippleAnimation from"./components/RippleAnimation";import style from"./style";/**
+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{findDOMNode}from'react-dom';import clamp from'lodash/clamp';import{shift}from'@shopgate/pwa-common/helpers/data';import{getOffset}from'@shopgate/pwa-common/helpers/dom';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import RippleAnimation from"./components/RippleAnimation";import style from"./style";/**
  * The ripple component.
- */var Ripple=/*#__PURE__*/function(_PureComponent){_inherits(Ripple,_PureComponent);/**
+ */var Ripple=/*#__PURE__*/function(_PureComponent){/**
    * Constructor.
    * @param {Object} props The component props.
-   */function Ripple(props){var _this;_classCallCheck(this,Ripple);_this=_possibleConstructorReturn(this,_getPrototypeOf(Ripple).call(this,props));_defineProperty(_assertThisInitialized(_this),"handleClick",function(event){if(_this.props.disabled){return;}_this.addRipple(event,true);_this.props.onClick();});_defineProperty(_assertThisInitialized(_this),"removeRipple",function(){if(!_this.mounted){return;}_this.setState(function(prevState){var ripples=shift(prevState.ripples);_this.props.onComplete();return{ripples:ripples,hasRipples:!!ripples.length};});});_this.state={ripples:[],nextKey:0,hasRipples:false};_this.duration=500;_this.ignoreNextMouseDown=false;_this.mounted=false;_this.offset=null;_this.position=null;_this.rootNode=null;_this.style=null;return _this;}/**
+   */function Ripple(props){var _this2;_classCallCheck(this,Ripple);_this2=_callSuper(this,Ripple,[props]);/**
+   * Triggers adding of a new ripple on touch start event.
+   * @param {Object} event The even object.
+   */_defineProperty(_this2,"handleClick",function(event){if(_this2.props.disabled){return;}_this2.addRipple(event,true);_this2.props.onClick();});/**
+   * Will be triggered from the ripple animation component, when the
+   * ripple animation is over. It removes the ripple from the queue again.
+   */_defineProperty(_this2,"removeRipple",function(){if(!_this2.mounted){return;}_this2.setState(function(prevState){var ripples=shift(prevState.ripples);_this2.props.onComplete();return{ripples:ripples,hasRipples:!!ripples.length};});});_this2.state={ripples:[],nextKey:0,hasRipples:false};_this2.duration=500;_this2.ignoreNextMouseDown=false;_this2.mounted=false;_this2.offset=null;_this2.position=null;_this2.rootNode=null;_this2.style=null;return _this2;}/**
    * Sets the `mounted` flag to true.
-   */_createClass(Ripple,[{key:"componentDidMount",value:function componentDidMount(){var fill=this.props.fill;// Reference to Ripple container (for now and later).
+   */_inherits(Ripple,_PureComponent);return _createClass(Ripple,[{key:"componentDidMount",value:function componentDidMount(){var fill=this.props.fill;// Reference to Ripple container (for now and later).
 this.rootNode=findDOMNode(this);// eslint-disable-line react/no-find-dom-node
 // Initially set the position values to be in the middle of the element.
 // If the Ripple's starting point has to follow the user's touch
@@ -18,23 +24,25 @@ this.style=!this.props.overflow?{overflow:'hidden',position:'relative'}:null;}/*
    */},{key:"componentWillUnmount",value:function componentWillUnmount(){this.mounted=false;}/**
    * Calculate the size of the ripple.
    * @returns {number}
-   */},{key:"getRipplePosition",/**
+   */},{key:"rippleSize",get:function get(){if(this.props.size){if(this.props.fill){return this.props.size*2;}return this.props.size;}/**
+     * We want the Ripple to fill the element. We set the diameter of the Ripple
+     * to double the distance of the opposing corners of the node. That way the Ripple
+     * will reach the furthest away corner if you click at a corner.
+     */if(this.props.fill){return Math.sqrt(Math.pow(this.rootNode.offsetWidth,2)+Math.pow(this.rootNode.offsetHeight,2))*2;}// Otherwise we set the size to be the smaller of the element's height and width.
+return Math.min(this.rootNode.offsetWidth,this.rootNode.offsetHeight);}/**
    * Calculates the ripple position from the event.
    * @param {Object} event The event object.
    * @returns {Object} An object containing x and y values for the ripple.
-   */value:function getRipplePosition(event){// If the Ripple is to fill the element then we should set the
+   */},{key:"getRipplePosition",value:function getRipplePosition(event){// If the Ripple is to fill the element then we should set the
 // Starting position to be where the user clicked within that element.
 if(this.props.fill){// Determine if event is a touch event.
 var isTouchEvent=event.touches&&event.touches.length;// Find the center points of the event.
 var pageX=isTouchEvent?event.touches[0].pageX:event.pageX;var pageY=isTouchEvent?event.touches[0].pageY:event.pageY;// The pointer location is relative to the element offset.
-this.position.x=pageX-this.offset.left;this.position.y=pageY-this.offset.top;}return this.position;}/**
-   * Triggers adding of a new ripple on touch start event.
-   * @param {Object} event The even object.
-   */},{key:"addRipple",/**
+this.position.x=pageX-this.offset.left;this.position.y=pageY-this.offset.top;}return this.position;}},{key:"addRipple",value:/**
    * Adds a new Ripple to the queue.
    * @param {Object} event The event object.
    * @param {boolean} isTouchGenerated Whether the action was triggered by a touch or click.
-   */value:function addRipple(event,isTouchGenerated){// If the adding of the Ripple was already triggered
+   */function addRipple(event,isTouchGenerated){// If the adding of the Ripple was already triggered
 // By a touch start event, no further action will be done.
 if(this.ignoreNextMouseDown&&!isTouchGenerated){this.ignoreNextMouseDown=false;return;}// Get the position of the element and store it.
 this.offset=getOffset(this.rootNode);// Receive the x and y position for the new Ripple.
@@ -49,9 +57,4 @@ if(!this.state.hasRipples){return null;}return React.createElement("div",{classN
    * @returns {JSX}
    */},{key:"render",value:function render(){/* eslint-disable jsx-a11y/click-events-have-key-events,
     jsx-a11y/no-static-element-interactions */return React.createElement("div",{className:"ui-shared__ripple ".concat(this.props.className),"data-test-id":"Ripple",onClick:this.handleClick,style:this.style},this.renderRipples(),this.props.children);/* eslint-enable jsx-a11y/click-events-have-key-events,
-    jsx-a11y/no-static-element-interactions */}},{key:"rippleSize",get:function get(){if(this.props.size){if(this.props.fill){return this.props.size*2;}return this.props.size;}/**
-     * We want the Ripple to fill the element. We set the diameter of the Ripple
-     * to double the distance of the opposing corners of the node. That way the Ripple
-     * will reach the furthest away corner if you click at a corner.
-     */if(this.props.fill){return Math.sqrt(Math.pow(this.rootNode.offsetWidth,2)+Math.pow(this.rootNode.offsetHeight,2))*2;}// Otherwise we set the size to be the smaller of the element's height and width.
-return Math.min(this.rootNode.offsetWidth,this.rootNode.offsetHeight);}}]);return Ripple;}(PureComponent);_defineProperty(Ripple,"defaultProps",{className:'',color:themeConfig.colors.dark,disabled:false,fill:false,onClick:function onClick(){},onComplete:function onComplete(){},overflow:false,size:null});export default Ripple;
+    jsx-a11y/no-static-element-interactions */}}]);}(PureComponent);_defineProperty(Ripple,"defaultProps",{className:'',color:themeConfig.colors.dark,disabled:false,fill:false,onClick:function onClick(){},onComplete:function onComplete(){},overflow:false,size:null});export default Ripple;

package/RippleButton/index.js

@@ -1,11 +1,11 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _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 Ripple from"../Ripple";import Button from"../Button";import style from"../Button/style";/**
+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,{Component}from'react';import PropTypes from'prop-types';import Ripple from"../Ripple";import Button from"../Button";import style from"../Button/style";/**
  * The ripple button component is a special derivation of the basic button component
  * that adds a ripple effect when clicked.
- */var RippleButton=/*#__PURE__*/function(_Component){_inherits(RippleButton,_Component);function RippleButton(){_classCallCheck(this,RippleButton);return _possibleConstructorReturn(this,_getPrototypeOf(RippleButton).apply(this,arguments));}_createClass(RippleButton,[{key:"render",/**
-   * Renders the component.
-   * @returns {JSX}
-   */value:function render(){if(this.props.disabled){// Don't show the ripple effect when the button is disabled.
-return React.createElement(Button,_extends({},this.buttonProps,{wrapContent:true}),this.props.children);}var rippleProps={className:"".concat(style.contentWrapper," ").concat(this.props.rippleClassName),fill:true,size:this.props.rippleSize};return React.createElement(Button,_extends({},this.buttonProps,{testId:this.props.testId}),React.createElement(Ripple,rippleProps,this.props.children));}},{key:"buttonProps",/**
+ */var RippleButton=/*#__PURE__*/function(_Component){function RippleButton(){_classCallCheck(this,RippleButton);return _callSuper(this,RippleButton,arguments);}_inherits(RippleButton,_Component);return _createClass(RippleButton,[{key:"buttonProps",get:/**
    * Getter for the calculated button props.
    * @returns {Object}
-   */get:function get(){return{className:"".concat(this.props.className," ui-shared__ripple-button"),disabled:this.props.disabled,onClick:this.props.onClick,flat:this.props.flat,type:this.props.type,wrapContent:false,'aria-label':this.props['aria-label'],'aria-haspopup':this.props['aria-haspopup']};}}]);return RippleButton;}(Component);_defineProperty(RippleButton,"defaultProps",_extends({},Button.defaultProps,{rippleClassName:'',rippleSize:null,testId:'Button'}));export default RippleButton;
+   */function get(){return{className:"".concat(this.props.className," ui-shared__ripple-button"),disabled:this.props.disabled,onClick:this.props.onClick,flat:this.props.flat,type:this.props.type,wrapContent:false,'aria-label':this.props['aria-label'],'aria-haspopup':this.props['aria-haspopup']};}/**
+   * Renders the component.
+   * @returns {JSX}
+   */},{key:"render",value:function render(){if(this.props.disabled){// Don't show the ripple effect when the button is disabled.
+return React.createElement(Button,_extends({},this.buttonProps,{wrapContent:true}),this.props.children);}var rippleProps={className:"".concat(style.contentWrapper," ").concat(this.props.rippleClassName),fill:true,size:this.props.rippleSize,overflow:true};return React.createElement(Button,_extends({},this.buttonProps,{testId:this.props.testId}),React.createElement(Ripple,rippleProps,this.props.children));}}]);}(Component);_defineProperty(RippleButton,"defaultProps",_extends({},Button.defaultProps,{rippleClassName:'',rippleSize:null,testId:'Button'}));export default RippleButton;

package/ScannerOverlay/components/ScannerBar/index.js

@@ -2,4 +2,4 @@ import React from'react';import{createPortal}from'react-dom';import PropTypes fr
  * @param {boolean} flashlightState The on/off state of the flashlight.
  * @param {Function} onToggleFlashlight The toggle event triggered by the user.
  * @returns {JSX}
- */var ScannerBar=function ScannerBar(_ref){var flashlightState=_ref.flashlightState,onToggleFlashlight=_ref.onToggleFlashlight;return createPortal(React.createElement(SurroundPortals,{portalName:SCANNER_BAR,portalProps:{flashlightState:flashlightState,onToggleFlashlight:onToggleFlashlight}},React.createElement(Grid,{className:styles.container},React.createElement(Grid.Item,{className:styles.column},React.createElement(FlashlightButton,{onToggle:onToggleFlashlight,flashlightState:flashlightState})),React.createElement(Grid.Item,{className:styles.column},React.createElement(ScannerInstructions,null)))),document.getElementById('AppFooter'));};export default ScannerBar;
+ */var ScannerBar=function ScannerBar(_ref){var flashlightState=_ref.flashlightState,onToggleFlashlight=_ref.onToggleFlashlight;return createPortal(React.createElement(SurroundPortals,{portalName:SCANNER_BAR,portalProps:{flashlightState:flashlightState,onToggleFlashlight:onToggleFlashlight}},React.createElement(Grid,{className:"".concat(styles.container," ui-shared__scanner-bar")},React.createElement(Grid.Item,{className:styles.column},React.createElement(FlashlightButton,{onToggle:onToggleFlashlight,flashlightState:flashlightState})),React.createElement(Grid.Item,{className:styles.column},React.createElement(ScannerInstructions,null)))),document.getElementById('AppFooter'));};export default ScannerBar;

package/ScannerOverlay/index.js

@@ -1,11 +1,11 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Fragment,PureComponent}from'react';import PropTypes from'prop-types';import AppScanner from'@shopgate/pwa-core/classes/Scanner';import CameraOverlay from"./components/CameraOverlay";import ScannerBar from"./components/ScannerBar";/**
+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,{Fragment,PureComponent}from'react';import PropTypes from'prop-types';import AppScanner from'@shopgate/pwa-core/classes/Scanner';import CameraOverlay from"./components/CameraOverlay";import ScannerBar from"./components/ScannerBar";/**
  * The scanner overlay component.
- */var ScannerOverlay=/*#__PURE__*/function(_PureComponent){_inherits(ScannerOverlay,_PureComponent);function ScannerOverlay(props){var _this;_classCallCheck(this,ScannerOverlay);_this=_possibleConstructorReturn(this,_getPrototypeOf(ScannerOverlay).call(this,props));_defineProperty(_assertThisInitialized(_this),"handleToggleFlashlight",function(){_this.setState({flashlight:AppScanner.toggleFlashlight()});});_this.state={flashlight:props.flashlight};return _this;}/**
+ */var ScannerOverlay=/*#__PURE__*/function(_PureComponent){function ScannerOverlay(props){var _this2;_classCallCheck(this,ScannerOverlay);_this2=_callSuper(this,ScannerOverlay,[props]);_defineProperty(_this2,"handleToggleFlashlight",function(){_this2.setState({flashlight:AppScanner.toggleFlashlight()});});_this2.state={flashlight:props.flashlight};return _this2;}/**
    * @param {Object} nextProps New props to apply.
-   */_createClass(ScannerOverlay,[{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){if(this.state.flashlight!==nextProps.flashlight){this.setState({flashlight:nextProps.flashlight});}}},{key:"render",/**
+   */_inherits(ScannerOverlay,_PureComponent);return _createClass(ScannerOverlay,[{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){if(this.state.flashlight!==nextProps.flashlight){this.setState({flashlight:nextProps.flashlight});}}},{key:"render",value:/**
    * Render the camera overlay and the bottom bar with its contents.
    * @returns {JSX}
-   */value:function render(){return React.createElement(Fragment,null,React.createElement(CameraOverlay,null),React.createElement(ScannerBar,{flashlightState:this.state.flashlight,onToggleFlashlight:this.handleToggleFlashlight}));}}]);return ScannerOverlay;}(PureComponent);_defineProperty(ScannerOverlay,"defaultProps",{flashlight:false/**
+   */function render(){return React.createElement(Fragment,null,React.createElement(CameraOverlay,null),React.createElement(ScannerBar,{flashlightState:this.state.flashlight,onToggleFlashlight:this.handleToggleFlashlight}));}}]);}(PureComponent);_defineProperty(ScannerOverlay,"defaultProps",{flashlight:false/**
    * Initializes the component.
    * @param {Object} props The components props.
    */});export default ScannerOverlay;

package/Sheet/components/Header/components/SearchBar/index.js

@@ -0,0 +1,3 @@
+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}from'react';import PropTypes from'prop-types';import classNames from'classnames';import I18n from'@shopgate/pwa-common/components/I18n';import Input from'@shopgate/pwa-common/components/Input';import MagnifierIcon from"../../../../../icons/MagnifierIcon";import styles from"./style";/**
+ * @return {JSX}
+ */var SearchBar=function SearchBar(_ref){var handleChange=_ref.handleChange;var _useState=useState(''),_useState2=_slicedToArray(_useState,2),query=_useState2[0],setQuery=_useState2[1];var name='search';return React.createElement("div",{className:"ui-shared__sheet__search-field","data-test-id":"SearchField"},React.createElement("div",{className:styles.container},React.createElement("div",{className:styles.inputWrapper},React.createElement("form",{onSubmit:function onSubmit(e){e.preventDefault();}},React.createElement("label",{htmlFor:name,className:styles.label},React.createElement("div",{className:styles.icon},React.createElement(MagnifierIcon,null)),!query.length&&React.createElement(I18n.Text,{string:"search.placeholder"})),React.createElement(Input,{name:name,autoComplete:false,className:classNames(styles.input),onChange:function onChange(value){handleChange(value);setQuery(value);},value:query,type:"search"})))));};export default SearchBar;

package/Sheet/components/Header/components/SearchBar/spec.js

@@ -0,0 +1,3 @@
+import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg);var value=info.value;}catch(error){reject(error);return;}if(info.done){resolve(value);}else{Promise.resolve(value).then(_next,_throw);}}function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise(function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value);}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err);}_next(undefined);});};}import React from'react';import{mount}from'enzyme';import SearchBar from"./index";describe('<SearchBar />',function(){it('should call handleChange on input',/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var handleChange,wrapper;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:handleChange=jest.fn();_context.next=3;return mount(React.createElement(SearchBar,{handleChange:handleChange}));case 3:wrapper=_context.sent;expect(wrapper).toMatchSnapshot();// Update input
+wrapper.find('input').first().simulate('change',{target:{name:'search',value:'asdf'}});// Should call with updated state.
+expect(handleChange).toHaveBeenCalledWith('asdf');case 7:case"end":return _context.stop();}},_callee);})));});

package/Sheet/components/Header/components/SearchBar/style.js

@@ -0,0 +1 @@
+import{css}from'glamor';import{themeColors}from'@shopgate/pwa-common/helpers/config';var container=css({display:'flex',flexDirection:'row',flexWrap:'nowrap',marginBottom:4,paddingLeft:16,paddingRight:16,paddingTop:5,paddingBottom:10}).toString();var inputWrapper=css({position:'relative',flexGrow:1}).toString();var input=css({borderRadius:10,width:'100%',padding:'4px 10px 4px 30px',lineHeight:'28px',outline:'none',background:themeColors.shade7,verticalAlign:'middle',WebkitAppearance:'none'}).toString();var label=css({alignItems:'center',color:themeColors.shade3,display:'flex',height:'36px',position:'absolute',pointerEvents:'none',width:'100%'}).toString();var icon=css({padding:'0 6px',color:themeColors.shade3,fontSize:'1.235rem'}).toString();export default{container:container,inputWrapper:inputWrapper,input:input,label:label,icon:icon};