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

package/product/components/Characteristics/Swatch/index.js

@@ -1,10 +1,12 @@
-function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});Object.defineProperty(subClass,"prototype",{writable:false});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{PureComponent,Fragment}from'react';import PropTypes from'prop-types';import classNames from'classnames';import Transition from'react-transition-group/Transition';import{VariantSwatch}from'@shopgate/engage/product';import styles from"./style";import transition from"../transition";/**
+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,Fragment}from'react';import PropTypes from'prop-types';import classNames from'classnames';import Transition from'react-transition-group/Transition';import{VariantSwatch}from'@shopgate/engage/product/components';import styles from"./style";import transition from"../transition";/**
  * A single characteristic swatch type.
- */var Swatch=/*#__PURE__*/function(_PureComponent){_inherits(Swatch,_PureComponent);var _super=_createSuper(Swatch);function Swatch(){var _this;_classCallCheck(this,Swatch);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_super.call.apply(_super,[this].concat(args));_defineProperty(_assertThisInitialized(_this),"state",{highlight:false});_defineProperty(_assertThisInitialized(_this),"getLabel",function(charLabel){if(!_this.props.selected){return charLabel;}var value=_this.props.values.find(function(val){return val.id===_this.props.selected;});return"".concat(charLabel," - ").concat(value.label);});_defineProperty(_assertThisInitialized(_this),"handleItemSelection",function(valueId){_this.props.select({id:_this.props.id,value:valueId});});_defineProperty(_assertThisInitialized(_this),"removeHighlight",function(){_this.setState({highlight:false});});return _this;}_createClass(Swatch,[{key:"UNSAFE_componentWillReceiveProps",value:/**
-   * @param {Object} nextProps The next component props.
-   */function UNSAFE_componentWillReceiveProps(nextProps){this.setState({highlight:nextProps.highlight});}/**
+ */var Swatch=/*#__PURE__*/function(_PureComponent){function Swatch(){var _this2;_classCallCheck(this,Swatch);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this2=_callSuper(this,Swatch,[].concat(args));_defineProperty(_this2,"state",{highlight:false});/**
    * @param {string} charLabel The default button label.
    * @return {string}
-   */},{key:"render",value:/**
+   */_defineProperty(_this2,"getLabel",function(charLabel){if(!_this2.props.selected){return charLabel;}var value=_this2.props.values.find(function(val){return val.id===_this2.props.selected;});return"".concat(charLabel," - ").concat(value.label);});/**
+   * @param {string} valueId The ID of the selected value.
+   */_defineProperty(_this2,"handleItemSelection",function(valueId){_this2.props.select({id:_this2.props.id,value:valueId});});_defineProperty(_this2,"removeHighlight",function(){_this2.setState({highlight:false});});return _this2;}_inherits(Swatch,_PureComponent);return _createClass(Swatch,[{key:"UNSAFE_componentWillReceiveProps",value:/**
+   * @param {Object} nextProps The next component props.
+   */function UNSAFE_componentWillReceiveProps(nextProps){this.setState({highlight:nextProps.highlight});}},{key:"render",value:/**
    * @return {JSX}
-   */function render(){var _this2=this;var _this$props=this.props,id=_this$props.id,disabled=_this$props.disabled,charRef=_this$props.charRef,label=_this$props.label,values=_this$props.values;var swatch={id:id,label:label,values:values};return/*#__PURE__*/React.createElement(Fragment,null,/*#__PURE__*/React.createElement(Transition,{"in":this.state.highlight,timeout:500,onEntered:this.removeHighlight},function(state){return/*#__PURE__*/React.createElement("div",{"aria-hidden":true,className:classNames(styles.label,_defineProperty({},styles.labelDisabled,disabled)),ref:charRef,style:transition[state],"data-test-id":label},_this2.getLabel(label));}),/*#__PURE__*/React.createElement("div",{className:styles.items},/*#__PURE__*/React.createElement(VariantSwatch,{swatch:swatch,onClick:this.handleItemSelection})));}}]);return Swatch;}(PureComponent);_defineProperty(Swatch,"defaultProps",{selected:null});export default Swatch;
+   */function render(){var _this3=this;var _this$props=this.props,id=_this$props.id,disabled=_this$props.disabled,charRef=_this$props.charRef,label=_this$props.label,values=_this$props.values;var swatch={id:id,label:label,values:values};return React.createElement(Fragment,null,React.createElement(Transition,{"in":this.state.highlight,timeout:500,onEntered:this.removeHighlight},function(state){return React.createElement("div",{"aria-hidden":true,className:classNames(styles.label,_defineProperty({},styles.labelDisabled,disabled)),ref:charRef,style:transition[state],"data-test-id":label},_this3.getLabel(label));}),React.createElement("div",{className:styles.items},React.createElement(VariantSwatch,{swatch:swatch,onClick:this.handleItemSelection})));}}]);}(PureComponent);_defineProperty(Swatch,"defaultProps",{selected:null});export default Swatch;

package/product/components/Characteristics/index.js

@@ -1,5 +1,12 @@
-function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});Object.defineProperty(subClass,"prototype",{writable:false});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{PureComponent,Fragment}from'react';import PropTypes from'prop-types';import{isBeta}from'@shopgate/engage/core';import Portal from'@shopgate/pwa-common/components/Portal';import{PRODUCT_VARIANT_SELECT,PRODUCT_VARIANT_SELECT_AFTER,PRODUCT_VARIANT_SELECT_BEFORE}from'@shopgate/pwa-common-commerce/product/constants/Portals';import{ProductCharacteristics,ProductContext}from'@shopgate/engage/product';import Characteristic from"./Characteristic";import Swatch from"./Swatch";/**
+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,Fragment}from'react';import PropTypes from'prop-types';import{isBeta}from'@shopgate/engage/core';import{Portal}from'@shopgate/engage/components';import{PRODUCT_VARIANT_SELECT,PRODUCT_VARIANT_SELECT_AFTER,PRODUCT_VARIANT_SELECT_BEFORE}from'@shopgate/engage/product/constants';import{ProductCharacteristics}from'@shopgate/engage/product/components';import{ProductContext}from'@shopgate/engage/product/contexts';import Characteristic from"./Characteristic";import Swatch from"./Swatch";/**
  * The Characteristics component.
- */var Characteristics=/*#__PURE__*/function(_PureComponent){_inherits(Characteristics,_PureComponent);var _super=_createSuper(Characteristics);function Characteristics(){var _this;_classCallCheck(this,Characteristics);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_super.call.apply(_super,[this].concat(args));_defineProperty(_assertThisInitialized(_this),"consumeRenderer",function(_ref){var conditioner=_ref.conditioner,setCharacteristics=_ref.setCharacteristics,characteristics=_ref.characteristics;var _this$props=_this.props,productId=_this$props.productId,variantId=_this$props.variantId;return/*#__PURE__*/React.createElement(ProductCharacteristics,{productId:productId,variantId:variantId,render:_this.renderer,conditioner:conditioner,finishTimeout:200,setCharacteristics:setCharacteristics,characteristics:characteristics});});_defineProperty(_assertThisInitialized(_this),"renderer",function(props){if(isBeta()&&!!props.swatch){return/*#__PURE__*/React.createElement(Swatch,props);}return/*#__PURE__*/React.createElement(Characteristic,props);});return _this;}_createClass(Characteristics,[{key:"render",value:/**
+ */var Characteristics=/*#__PURE__*/function(_PureComponent){function Characteristics(){var _this2;_classCallCheck(this,Characteristics);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this2=_callSuper(this,Characteristics,[].concat(args));/**
+   * @param {Object} props The consumer props.
    * @returns {JSX}
-   */function render(){return/*#__PURE__*/React.createElement(Fragment,null,/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_VARIANT_SELECT_BEFORE}),/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_VARIANT_SELECT},/*#__PURE__*/React.createElement(ProductContext.Consumer,null,this.consumeRenderer)),/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_VARIANT_SELECT_AFTER}));}}]);return Characteristics;}(PureComponent);_defineProperty(Characteristics,"defaultProps",{productId:null,variantId:null});Characteristics.defaultProps={productId:null,variantId:null};export default Characteristics;
+   */_defineProperty(_this2,"consumeRenderer",function(_ref){var conditioner=_ref.conditioner,setCharacteristics=_ref.setCharacteristics,characteristics=_ref.characteristics;var _this2$props=_this2.props,productId=_this2$props.productId,variantId=_this2$props.variantId;return React.createElement(ProductCharacteristics,{productId:productId,variantId:variantId,render:_this2.renderer,conditioner:conditioner,finishTimeout:200,setCharacteristics:setCharacteristics,characteristics:characteristics});});/**
+   * @see ProductCharacteristics.render
+   * @param {Object} props The renderer props.
+   * @returns {JSX}
+   */_defineProperty(_this2,"renderer",function(props){if(isBeta()&&!!props.swatch){return React.createElement(Swatch,props);}return React.createElement(Characteristic,props);});return _this2;}_inherits(Characteristics,_PureComponent);return _createClass(Characteristics,[{key:"render",value:/**
+   * @returns {JSX}
+   */function render(){return React.createElement(Fragment,null,React.createElement(Portal,{name:PRODUCT_VARIANT_SELECT_BEFORE}),React.createElement(Portal,{name:PRODUCT_VARIANT_SELECT},React.createElement(ProductContext.Consumer,null,this.consumeRenderer)),React.createElement(Portal,{name:PRODUCT_VARIANT_SELECT_AFTER}));}}]);}(PureComponent);_defineProperty(Characteristics,"defaultProps",{productId:null,variantId:null});Characteristics.defaultProps={productId:null,variantId:null};export default Characteristics;

package/product/components/Characteristics/transition.js

@@ -1 +1 @@
-import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;export default{entering:{background:colors.primary,color:colors.primaryContrast},entered:{background:colors.primary,color:colors.primaryContrast}};
+import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;export default{entering:{background:"var(--color-primary, ".concat(colors.primary,")"),color:"var(--color-primary-contrast, ".concat(colors.primaryContrast,")")},entered:{background:"var(--color-primary, ".concat(colors.primary,")"),color:"var(--color-primary-contrast, ".concat(colors.primaryContrast,")")}};

package/product/components/Description/index.js

@@ -1,8 +1,7 @@
-import React from'react';import PropTypes from'prop-types';import{SurroundPortals,PlaceholderParagraph,HtmlSanitizer,I18n}from'@shopgate/engage/components';import{PRODUCT_DESCRIPTION}from'@shopgate/engage/product';import{container,title,placeholder,content}from"./style";import connect from"./connector";/**
- * @param {Object} props The component props.
- * @returns {JSX}
- */var Content=function Content(_ref){var html=_ref.html,navigate=_ref.navigate;if(html===''){return null;}return/*#__PURE__*/React.createElement("div",{className:"".concat(container," engage__product__description")},/*#__PURE__*/React.createElement("div",{"aria-hidden":true,className:title},/*#__PURE__*/React.createElement(I18n.Text,{string:"product.description_heading"})),/*#__PURE__*/React.createElement(PlaceholderParagraph,{className:placeholder,ready:!!html},/*#__PURE__*/React.createElement("div",{className:content,"data-test-id":"description"},/*#__PURE__*/React.createElement(HtmlSanitizer,{settings:{html:html,handleClick:navigate}},html))));};Content.defaultProps={html:null,navigate:function navigate(){}};/**
+var _excluded=["html","navigate"];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 _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key];}}return target;}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key];}return target;}import React from'react';import PropTypes from'prop-types';import{SurroundPortals,PlaceholderParagraph,HtmlSanitizer,I18n}from'@shopgate/engage/components';import{PRODUCT_DESCRIPTION}from'@shopgate/engage/product';import classNames from'classnames';import{container,title,placeholder,content}from"./style";import connect from"./connector";/**
  * The product description.
  * @param {Object} props The component props.
- * @returns {JSX}
- */function Description(props){return/*#__PURE__*/React.createElement(SurroundPortals,{portalName:PRODUCT_DESCRIPTION,portalProps:props},/*#__PURE__*/React.createElement(Content,props));}Description.defaultProps={html:null,navigate:function navigate(){}};export default connect(Description);
+ * @param {string} props.html html describing the product
+ * @param {Function} props.navigate where to navigate on click
+ * @returns {JSX.Element}
+ */function Description(_ref){var html=_ref.html,navigate=_ref.navigate,props=_objectWithoutProperties(_ref,_excluded);return React.createElement(SurroundPortals,{portalName:PRODUCT_DESCRIPTION,portalProps:_extends({html:html,navigate:navigate},props)},html!==''&&React.createElement("div",{className:"".concat(container," engage__product__description")},React.createElement("div",{className:classNames(title,'theme__description_heading')},React.createElement(I18n.Text,{string:"product.description_heading"})),React.createElement(PlaceholderParagraph,{className:placeholder,ready:!!html},React.createElement("div",{className:content,"data-test-id":"description"},React.createElement(HtmlSanitizer,{settings:{html:html,handleClick:navigate}},html)))));}Description.defaultProps={html:null,navigate:function navigate(){}};export default connect(Description);

package/product/components/Description/style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;export var container=css({fontSize:'0.875rem',padding:'0.8125rem 1rem 1rem'});export var title=css({fontSize:'1rem',fontWeight:500,marginBottom:'0.5rem'});export var content=css({lineHeight:1.7,overflow:'hidden',wordBreak:['break-all','break-word'],hyphens:'auto',' ul':{listStyle:'disc'},' ol':{listStyle:'decimal'},' ul, ol':{margin:'.75em 0',paddingLeft:'1.2em'},' a':{color:colors.primary,margin:'-.35em',padding:'.35em',position:'relative'}});export var placeholder=css({height:'0.875rem'}).toString();
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;export var container=css({fontSize:'0.875rem',padding:'0.8125rem 1rem 1rem'});export var title=css({fontSize:'1rem',fontWeight:500,marginBottom:'0.5rem',color:'var(--color-text-high-emphasis)'});export var content=css({lineHeight:1.7,overflow:'hidden',wordBreak:['break-all','break-word'],color:'var(--color-text-high-emphasis)',hyphens:'auto',' ul':{listStyle:'disc'},' ol':{listStyle:'decimal'},' ul, ol':{margin:'.75em 0',paddingLeft:'1.2em'},' a':{color:"var(--color-primary, ".concat(colors.primary,")"),margin:'-.35em',padding:'.35em',position:'relative'}});export var placeholder=css({height:'0.875rem'}).toString();

package/product/components/EffectivityDates/helpers.js

@@ -1,15 +1,15 @@
-import{getThemeSettings,isBeta,isAfter,isBefore,addDuration}from'@shopgate/engage/core';import{ALWAYS,NEVER}from"./constants";/**
- * Biuld params to fetch category products
+import{isBeta,isAfter,isBefore,addDuration}from'@shopgate/engage/core/helpers';import{getThemeSettings}from'@shopgate/engage/core/config';import{ALWAYS,NEVER}from"./constants";/**
+ * Build params to fetch category products
  * @returns {Object|{showScheduled: string}}
- */export var buildShowScheduledParams=function buildShowScheduledParams(){if(!isBeta()){return{};}var cachedTime=null;var _ref=getThemeSettings('product')||{},_ref$effectivityDates=_ref.effectivityDates;_ref$effectivityDates=_ref$effectivityDates===void 0?{}:_ref$effectivityDates;var showScheduled=_ref$effectivityDates.showScheduled;if(showScheduled===ALWAYS){showScheduled='P1Y';}else if(showScheduled===NEVER){showScheduled='PT0S';cachedTime=60000;// 1 minute min effective precision
+ */export var buildShowScheduledParams=function buildShowScheduledParams(){if(!isBeta()){return{};}var cachedTime=null;var _ref=getThemeSettings('product')||{},_ref$effectivityDates=_ref.effectivityDates,_ref$effectivityDates2=_ref$effectivityDates===void 0?{}:_ref$effectivityDates,showScheduled=_ref$effectivityDates2.showScheduled;if(showScheduled===ALWAYS){showScheduled='P1Y';}else if(showScheduled===NEVER){showScheduled='PT0S';cachedTime=60000;// 1 minute min effective precision
 }return{cachedTime:cachedTime,params:{showScheduled:showScheduled}};};/**
  * Decide if startDate hint should be shown
  * @param {Date} startDate product.startDate
  * @param {Object} [settings=null] settings
  * @returns {boolean}
- */export var showScheduledLabel=function showScheduledLabel(startDate){var settings=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;if(!startDate||!startDate.getDate()){return false;}var now=new Date();if(isBefore(startDate,now)){return false;}var _ref2=settings||{},_ref2$scheduledProduc=_ref2.scheduledProducts;_ref2$scheduledProduc=_ref2$scheduledProduc===void 0?{}:_ref2$scheduledProduc;var _ref2$scheduledProduc2=_ref2$scheduledProduc.showLabels,showLabels=_ref2$scheduledProduc2===void 0?ALWAYS:_ref2$scheduledProduc2;if(showLabels===NEVER){return false;}if(showLabels===ALWAYS){return true;}var cloned=new Date(startDate.getTime());addDuration(cloned,"-".concat(showLabels));return isAfter(now,cloned);};/**
+ */export var showScheduledLabel=function showScheduledLabel(startDate){var settings=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;if(!startDate||!startDate.getDate()){return false;}var now=new Date();if(isBefore(startDate,now)){return false;}var _ref2=settings||{},_ref2$scheduledProduc=_ref2.scheduledProducts,_ref2$scheduledProduc2=_ref2$scheduledProduc===void 0?{}:_ref2$scheduledProduc,_ref2$scheduledProduc3=_ref2$scheduledProduc2.showLabels,showLabels=_ref2$scheduledProduc3===void 0?ALWAYS:_ref2$scheduledProduc3;if(showLabels===NEVER){return false;}if(showLabels===ALWAYS){return true;}var cloned=new Date(startDate.getTime());addDuration(cloned,"-".concat(showLabels));return isAfter(now,cloned);};/**
  * Decide if endDate hint should be shown
  * @param {Date} endDate product.endDate
  * @param {Object} [settings=null] settings default global settings
  * @returns {boolean}
- */export var showExpiringLabel=function showExpiringLabel(endDate,settings){if(!endDate||!endDate.getDate()){return false;}var _ref3=settings||{},_ref3$expiringProduct=_ref3.expiringProducts;_ref3$expiringProduct=_ref3$expiringProduct===void 0?{}:_ref3$expiringProduct;var _ref3$expiringProduct2=_ref3$expiringProduct.showLabels,showLabels=_ref3$expiringProduct2===void 0?ALWAYS:_ref3$expiringProduct2;if(showLabels===NEVER){return false;}if(showLabels===ALWAYS){return true;}var now=new Date();var cloned=new Date(endDate.getTime());addDuration(cloned,"-".concat(showLabels));return isAfter(now,cloned);};
+ */export var showExpiringLabel=function showExpiringLabel(endDate,settings){if(!endDate||!endDate.getDate()){return false;}var _ref3=settings||{},_ref3$expiringProduct=_ref3.expiringProducts,_ref3$expiringProduct2=_ref3$expiringProduct===void 0?{}:_ref3$expiringProduct,_ref3$expiringProduct3=_ref3$expiringProduct2.showLabels,showLabels=_ref3$expiringProduct3===void 0?ALWAYS:_ref3$expiringProduct3;if(showLabels===NEVER){return false;}if(showLabels===ALWAYS){return true;}var now=new Date();var cloned=new Date(endDate.getTime());addDuration(cloned,"-".concat(showLabels));return isAfter(now,cloned);};

package/product/components/EffectivityDates/index.js

@@ -1,4 +1,4 @@
-import React,{Fragment}from'react';import PropTypes from'prop-types';import classNames from'classnames';import{css}from'glamor';import{isBeta,useWidgetSettings,useWidgetStyles}from'@shopgate/engage/core';import{I18n,TimeBoundary,SurroundPortals}from'@shopgate/engage/components';import{PRODUCT_EFFECTIVITY_DATES}from'@shopgate/pwa-common-commerce/product/constants/Portals';import{showExpiringLabel,showScheduledLabel}from"./helpers";import{hint}from"./style";import connect from"./connector";/**
+import React,{Fragment}from'react';import PropTypes from'prop-types';import classNames from'classnames';import{css}from'glamor';import{isBeta,useWidgetSettings,useWidgetStyles}from'@shopgate/engage/core';import{I18n,TimeBoundary,SurroundPortals}from'@shopgate/engage/components';import{PRODUCT_EFFECTIVITY_DATES}from'@shopgate/pwa-common-commerce/product/constants/Portals';import{showExpiringLabel,showScheduledLabel}from"./helpers";import{hint,notAvailable}from"./style";import connect from"./connector";/**
  * The Product Effectivity Dates component.
  * @return {JSX}
- */var EffectivityDates=function EffectivityDates(_ref){var dates=_ref.dates,children=_ref.children,productNotAvailable=_ref.productNotAvailable,productId=_ref.productId;if(!isBeta()||!dates){return children;}var settings=useWidgetSettings('@shopgate/engage/product/EffectivityDates');var styles=useWidgetStyles('@shopgate/engage/product/EffectivityDates');var startDate=new Date(dates.startDate);var endDate=new Date(dates.endDate);var hintAddClass=styles&&styles.hint?css(styles.hint).toString():null;var hintClass=classNames(hint,hintAddClass);return/*#__PURE__*/React.createElement(SurroundPortals,{portalName:PRODUCT_EFFECTIVITY_DATES,portalProps:{dates:dates,productNotAvailable:productNotAvailable,productId:productId}},/*#__PURE__*/React.createElement(TimeBoundary,{start:startDate,end:endDate},function(_ref2){var before=_ref2.before,between=_ref2.between,after=_ref2.after;if(before){return showScheduledLabel(startDate,settings)?/*#__PURE__*/React.createElement(I18n.Text,{string:"product.available.at",params:{startDate:startDate},className:hintClass}):children;}if(between){return/*#__PURE__*/React.createElement(Fragment,null,children,showExpiringLabel(endDate,settings)&&/*#__PURE__*/React.createElement(I18n.Text,{string:"product.available.until",params:{endDate:endDate},className:hintClass}));}if(after){productNotAvailable();return showExpiringLabel(endDate,settings)?/*#__PURE__*/React.createElement(I18n.Text,{string:"product.available.not",className:hintClass}):children;}return children;}));};EffectivityDates.defaultProps={children:null,dates:null,productId:null};export default connect(EffectivityDates);
+ */var EffectivityDates=function EffectivityDates(_ref){var dates=_ref.dates,children=_ref.children,productNotAvailable=_ref.productNotAvailable,productId=_ref.productId;if(!isBeta()||!dates){return children;}var settings=useWidgetSettings('@shopgate/engage/product/EffectivityDates');var styles=useWidgetStyles('@shopgate/engage/product/EffectivityDates');var startDate=dates.startDate?new Date(dates.startDate):null;var endDate=dates.endDate?new Date(dates.endDate):null;var hintAddClass=styles&&styles.hint?css(styles.hint).toString():null;return React.createElement(SurroundPortals,{portalName:PRODUCT_EFFECTIVITY_DATES,portalProps:{dates:dates,productNotAvailable:productNotAvailable,productId:productId}},React.createElement(TimeBoundary,{start:startDate,end:endDate},function(_ref2){var before=_ref2.before,between=_ref2.between,after=_ref2.after;if(before){return showScheduledLabel(startDate,settings)?React.createElement(I18n.Text,{string:"product.available.at",params:{startDate:startDate},className:classNames(hint,hintAddClass)}):children;}if(between){return React.createElement(Fragment,null,children,showExpiringLabel(endDate,settings)&&React.createElement(I18n.Text,{string:"product.available.until",params:{endDate:endDate},className:classNames(hint,hintAddClass)}));}if(after){productNotAvailable();return showExpiringLabel(endDate,settings)?React.createElement(I18n.Text,{string:"product.available.not",className:classNames(hint,hintAddClass,notAvailable)}):children;}return children;}));};EffectivityDates.defaultProps={children:null,dates:{startDate:null,endDate:null},productId:null};export default connect(EffectivityDates);

package/product/components/EffectivityDates/style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';export var hint=css({color:themeConfig.colors.success,fontSize:'0.75rem'}).toString();
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';export var hint=css({color:"var(--color-state-ok, ".concat(themeConfig.colors.success,")"),fontSize:'0.75rem'}).toString();export var notAvailable=css({color:"var(--color-state-alert, ".concat(themeConfig.colors.error,")"),fontSize:'0.75rem'}).toString();

package/product/components/Header/PriceStriked/index.js

@@ -1,8 +1,5 @@
-import React,{Fragment}from'react';import PropTypes from'prop-types';import Portal from'@shopgate/pwa-common/components/Portal';import{PRODUCT_PRICE_STRIKED,PRODUCT_PRICE_STRIKED_AFTER,PRODUCT_PRICE_STRIKED_BEFORE}from'@shopgate/pwa-common-commerce/product/constants/Portals';import{withPriceCalculation}from'@shopgate/engage/product';import I18n from'@shopgate/pwa-common/components/I18n';import PlaceholderLabel from'@shopgate/pwa-ui-shared/PlaceholderLabel';import StrikePrice from'@shopgate/pwa-ui-shared/PriceStriked';import{useWidgetSettings}from'@shopgate/engage/core/hooks/useWidgetSettings';import connect from"./connector";import styles from"./style";/**
- * @param {Object} props The component props.
- * @return {JSX}
- */var Content=function Content(_ref){var price=_ref.price;var _useWidgetSettings=useWidgetSettings('@shopgate/engage/product/components/Header/PriceStriked'),_useWidgetSettings$ms=_useWidgetSettings.msrpLabel,msrpLabel=_useWidgetSettings$ms===void 0?'price.msrp':_useWidgetSettings$ms,unitPriceStrikedLabel=_useWidgetSettings.unitPriceStrikedLabel;return/*#__PURE__*/React.createElement(PlaceholderLabel,{className:styles.placeholder,ready:price!==null},price&&price.msrp>0&&price.unitPrice!==price.msrp&&/*#__PURE__*/React.createElement(Fragment,null,!!msrpLabel&&/*#__PURE__*/React.createElement(I18n.Text,{string:msrpLabel,className:styles.msrp}),/*#__PURE__*/React.createElement(StrikePrice,{className:styles.msrpStriked,value:price.msrp,currency:price.currency})),price&&!price.msrp&&price.unitPriceStriked>0&&/*#__PURE__*/React.createElement(Fragment,null,!!unitPriceStrikedLabel&&/*#__PURE__*/React.createElement(I18n.Text,{string:unitPriceStrikedLabel,className:styles.msrp}),/*#__PURE__*/React.createElement(StrikePrice,{value:price.unitPriceStriked,currency:price.currency,className:unitPriceStrikedLabel?styles.msrpStriked:''})));};/**
+import React,{Fragment}from'react';import PropTypes from'prop-types';import{Portal,I18n,PlaceholderLabel,PriceStriked as StrikePrice}from'@shopgate/engage/components';import{PRODUCT_PRICE_STRIKED,PRODUCT_PRICE_STRIKED_AFTER,PRODUCT_PRICE_STRIKED_BEFORE}from'@shopgate/engage/product/constants';import{withPriceCalculation}from'@shopgate/engage/product/hocs';import{useWidgetSettings}from'@shopgate/engage/core/hooks';import connect from"./connector";import styles from"./style";/**
  * The PriceStriked component.
  * @param {Object} props The component props.
  * @return {JSX}
- */var PriceStriked=function PriceStriked(props){return/*#__PURE__*/React.createElement(Fragment,null,/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_PRICE_STRIKED_BEFORE}),/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_PRICE_STRIKED},/*#__PURE__*/React.createElement(Content,props)),/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_PRICE_STRIKED_AFTER}));};Content.defaultProps={price:null};export default connect(withPriceCalculation(PriceStriked));
+ */var PriceStriked=function PriceStriked(_ref){var price=_ref.price;var _useWidgetSettings=useWidgetSettings('@shopgate/engage/product/components/Header/PriceStriked'),_useWidgetSettings$ms=_useWidgetSettings.msrpLabel,msrpLabel=_useWidgetSettings$ms===void 0?'price.msrp':_useWidgetSettings$ms,unitPriceStrikedLabel=_useWidgetSettings.unitPriceStrikedLabel;return React.createElement(Fragment,null,React.createElement(Portal,{name:PRODUCT_PRICE_STRIKED_BEFORE}),React.createElement(Portal,{name:PRODUCT_PRICE_STRIKED},React.createElement(PlaceholderLabel,{className:styles.placeholder,ready:price!==null},price&&price.msrp>0&&price.unitPrice!==price.msrp&&React.createElement(Fragment,null,!!msrpLabel&&React.createElement(I18n.Text,{string:msrpLabel,className:styles.msrp}),React.createElement(StrikePrice,{className:styles.msrpStriked,value:price.msrp,currency:price.currency})),price&&!price.msrp&&price.unitPriceStriked>0&&price.unitPrice!==price.unitPriceStriked&&React.createElement(React.Fragment,null,!!unitPriceStrikedLabel&&React.createElement(I18n.Text,{string:unitPriceStrikedLabel,className:styles.msrp}),React.createElement(StrikePrice,{value:price.unitPriceStriked,currency:price.currency})))),React.createElement(Portal,{name:PRODUCT_PRICE_STRIKED_AFTER}));};PriceStriked.defaultProps={price:null};export default connect(withPriceCalculation(PriceStriked));

package/product/components/Header/PriceStriked/style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors,variables=themeConfig.variables;var placeholder=css({height:16,width:'70%',marginTop:5,marginBottom:2}).toString();var msrp=css({color:colors.shade3,fontSize:'0.875rem',marginRight:variables.gap.small/2}).toString();var msrpStriked=css({display:'inline',fontSize:'0.875rem'}).toString();export default{placeholder:placeholder,msrp:msrp,msrpStriked:msrpStriked};
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors,variables=themeConfig.variables;var placeholder=css({height:16,width:'70%',marginTop:5,marginBottom:2}).toString();var msrp=css({color:colors.shade11,fontSize:'0.875rem',marginRight:variables.gap.small/2}).toString();var msrpStriked=css({display:'inline',fontSize:'0.875rem'}).toString();export default{placeholder:placeholder,msrp:msrp,msrpStriked:msrpStriked};

package/product/components/Header/Shipping/components/Label/index.js

@@ -1,6 +1,6 @@
 import React from'react';import PropTypes from'prop-types';import I18n from'@shopgate/pwa-common/components/I18n';import styles from"./style";/**
  * The Shipping Label component.
  * @param {Object} props The component props.
- * @returns {JSX.Element}
- */var Label=function Label(_ref){var className=_ref.className,price=_ref.price,currency=_ref.currency;return/*#__PURE__*/ (// eslint-disable-next-line jsx-a11y/aria-role
-React.createElement("div",{role:"text",className:"".concat(className," ").concat(styles.text)},price>0?/*#__PURE__*/React.createElement(I18n.Text,{string:"shipping.cost"},/*#__PURE__*/React.createElement(I18n.Price,{forKey:"price",price:price,currency:currency})):/*#__PURE__*/React.createElement(I18n.Text,{string:"shipping.free"})));};Label.defaultProps={className:''};export default Label;
+ * @returns {JSX}
+ */var Label=function Label(_ref){var className=_ref.className,price=_ref.price,currency=_ref.currency;return(// eslint-disable-next-line jsx-a11y/aria-role
+React.createElement("div",{role:"text",className:"".concat(className," ").concat(styles.text)},price>0?React.createElement(I18n.Text,{string:"shipping.cost"},React.createElement(I18n.Price,{forKey:"price",price:price,currency:currency})):React.createElement(I18n.Text,{string:"shipping.free"})));};Label.defaultProps={className:''};export default Label;

package/product/components/Header/Shipping/components/Label/style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;var text=css({color:colors.success}).toString();export default{text:text};
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors;var text=css({color:"var(--color-state-ok, ".concat(colors.success,")")}).toString();export default{text:text};

package/product/components/Header/Shipping/index.js

@@ -2,4 +2,4 @@ import React,{Fragment,memo}from'react';import PropTypes from'prop-types';import
  * The Shipping Info component.
  * @param {Object} props The component props.
  * @return {JSX}
- */var Shipping=function Shipping(_ref){var shipping=_ref.shipping;return/*#__PURE__*/React.createElement(Fragment,null,/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_SHIPPING_BEFORE}),/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_SHIPPING},/*#__PURE__*/React.createElement(PlaceholderLabel,{className:styles.placeholder,ready:shipping!==null},shipping&&typeof shipping.price!=='undefined'&&shipping.price!==null&&/*#__PURE__*/React.createElement(Label,{className:"".concat(styles.shipping," engage__product__header__shipping"),price:shipping.price,currency:shipping.currency}))),/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_SHIPPING_AFTER}));};Shipping.defaultProps={shipping:null};export default connect(/*#__PURE__*/memo(Shipping));
+ */var Shipping=function Shipping(_ref){var shipping=_ref.shipping;return React.createElement(Fragment,null,React.createElement(Portal,{name:PRODUCT_SHIPPING_BEFORE}),React.createElement(Portal,{name:PRODUCT_SHIPPING},React.createElement(PlaceholderLabel,{className:styles.placeholder,ready:shipping!==null},shipping&&typeof shipping.price!=='undefined'&&shipping.price!==null&&React.createElement(Label,{className:"".concat(styles.shipping," engage__product__header__shipping"),price:shipping.price,currency:shipping.currency}))),React.createElement(Portal,{name:PRODUCT_SHIPPING_AFTER}));};Shipping.defaultProps={shipping:null};export default connect(memo(Shipping));

package/product/components/Header/Shipping/spec.js

@@ -2,4 +2,4 @@ import React from'react';import{Provider}from'react-redux';import configureStore
    * Creates connected the component
    * @param {Object} state The mocked redux state
    * @return {ReactWrapper}
-   */var createComponent=function createComponent(state){return mount(/*#__PURE__*/React.createElement(Provider,{store:mockedStore(state)},/*#__PURE__*/React.createElement(Shipping,{productId:"fakeId"})),mockRenderOptions);};it('should render shipping price',function(){var component=createComponent(mockedStoreWithShippingPrice);expect(component).toMatchSnapshot();expect(component.html().includes('shipping.cost')).toBe(true);});it('should render free shipping',function(){var component=createComponent(mockedStoreWithFreeShipping);expect(component).toMatchSnapshot();expect(component.html().includes('shipping.free')).toBe(true);});it('should not render when shipping is unknown',function(){var component=createComponent(mockedStoreWithUnknownShipping);expect(component.html()).toBe('');});});
+   */var createComponent=function createComponent(state){return mount(React.createElement(Provider,{store:mockedStore(state)},React.createElement(Shipping,{productId:"fakeId"})),mockRenderOptions);};it('should render shipping price',function(){var component=createComponent(mockedStoreWithShippingPrice);expect(component).toMatchSnapshot();expect(component.html().includes('shipping.cost')).toBe(true);});it('should render free shipping',function(){var component=createComponent(mockedStoreWithFreeShipping);expect(component).toMatchSnapshot();expect(component.html().includes('shipping.free')).toBe(true);});it('should not render when shipping is unknown',function(){var component=createComponent(mockedStoreWithUnknownShipping);expect(component.isEmptyRender()).toBe(true);});});

package/product/components/Header/Tiers/components/Tier/index.js

@@ -2,5 +2,5 @@ import React,{memo}from'react';import PropTypes from'prop-types';import I18n fro
  * @param {Object} props The component props.
  * @returns {JSX}
  */var Tier=function Tier(_ref){var tier=_ref.tier,price=_ref.price;// Skip tier with quantity 1
-if(tier.from<=1){return null;}var i18nKey=tier.from===tier.to?'price.tier.set':'price.tier.range';var params={from:tier.from};return/*#__PURE__*/ (// eslint-disable-next-line jsx-a11y/aria-role
-React.createElement(I18n.Text,{string:i18nKey,params:params,key:tier.from,className:styles.tier,role:"text"},/*#__PURE__*/React.createElement(I18n.Price,{forKey:"price",price:tier.unitPrice,currency:price.currency,className:styles.price})));};export default/*#__PURE__*/memo(Tier);
+if(tier.from<=1){return null;}var i18nKey=tier.from===tier.to?'price.tier.set':'price.tier.range';var params={from:tier.from};return(// eslint-disable-next-line jsx-a11y/aria-role
+React.createElement(I18n.Text,{string:i18nKey,params:params,key:tier.from,className:styles.tier,role:"text"},React.createElement(I18n.Price,{forKey:"price",price:tier.unitPrice,currency:price.currency,className:styles.price})));};export default memo(Tier);

package/product/components/Header/Tiers/components/Tier/spec.js

@@ -1 +1 @@
-import React from'react';import{shallow}from'enzyme';import Tier from"./index";describe('<Tier />',function(){describe('Rendering with data',function(){it('should render tier prices when tier prices are available',function(){var price={tiers:[{from:1,to:2,unitPrice:92.5},{from:3,to:5,unitPrice:77.5},{from:6,to:null,unitPrice:68.5}],currency:'USD'};var tier={from:3,to:5,unitPrice:77.5};var wrapper=shallow(/*#__PURE__*/React.createElement(Tier,{price:price,tier:tier}));expect(wrapper).toMatchSnapshot();});});describe('Rendering without data',function(){it('should render nothing when tier from is less then 1',function(){var tier={from:1};var wrapper=shallow(/*#__PURE__*/React.createElement(Tier,{tier:tier,price:{}}));expect(wrapper).toBeEmptyRender();});});});
+import React from'react';import{shallow}from'enzyme';import Tier from"./index";describe('<Tier />',function(){describe('Rendering with data',function(){it('should render tier prices when tier prices are available',function(){var price={tiers:[{from:1,to:2,unitPrice:92.5},{from:3,to:5,unitPrice:77.5},{from:6,to:null,unitPrice:68.5}],currency:'USD'};var tier={from:3,to:5,unitPrice:77.5};var wrapper=shallow(React.createElement(Tier,{price:price,tier:tier}));expect(wrapper).toMatchSnapshot();});});describe('Rendering without data',function(){it('should render nothing when tier from is less then 1',function(){var tier={from:1};var wrapper=shallow(React.createElement(Tier,{tier:tier,price:{}}));expect(wrapper).toBeEmptyRender();});});});

package/product/components/Header/Tiers/index.js

@@ -2,4 +2,4 @@ import React,{Fragment,memo}from'react';import PropTypes from'prop-types';import
  * The Tiers component.
  * @param {Object} props The component props.
  * @return {JSX}
- */var Tiers=function Tiers(_ref){var price=_ref.price;if(!(price&&price.tiers&&price.tiers.length>0)){return null;}return/*#__PURE__*/React.createElement(Fragment,null,/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_TIERS_BEFORE}),/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_TIERS},/*#__PURE__*/React.createElement("div",{className:"".concat(styles.wrapper," engage__product__header__tiers")},price.tiers.map(function(tier){return/*#__PURE__*/React.createElement(Tier,{tier:tier,price:price,key:"".concat(Object.values(tier).join('_'))});}))),/*#__PURE__*/React.createElement(Portal,{name:PRODUCT_TIERS_AFTER}));};Tiers.defaultProps={price:null};export default connect(/*#__PURE__*/memo(Tiers));
+ */var Tiers=function Tiers(_ref){var price=_ref.price;if(!(price&&price.tiers&&price.tiers.length>0)){return null;}return React.createElement(Fragment,null,React.createElement(Portal,{name:PRODUCT_TIERS_BEFORE}),React.createElement(Portal,{name:PRODUCT_TIERS},React.createElement("div",{className:"".concat(styles.wrapper," engage__product__header__tiers")},price.tiers.map(function(tier){return React.createElement(Tier,{tier:tier,price:price,key:"".concat(Object.values(tier).join('_'))});}))),React.createElement(Portal,{name:PRODUCT_TIERS_AFTER}));};Tiers.defaultProps={price:null};export default connect(memo(Tiers));

package/product/components/Header/Tiers/spec.js

@@ -1 +1 @@
-import React from'react';import{shallow}from'enzyme';import Tiers from"./index";jest.mock("./connector",function(){return function(cmp){return cmp;};});describe('<Tiers />',function(){describe('Rendering with data',function(){it('should render tier prices when tier prices are available',function(){var price={tiers:[{from:1,to:2,unitPrice:92.5},{from:3,to:5,unitPrice:77.5},{from:6,to:null,unitPrice:68.5}],currency:'USD'};var wrapper=shallow(/*#__PURE__*/React.createElement(Tiers,{price:price}));expect(wrapper).toMatchSnapshot();});});describe('Rendering without data',function(){it('should render nothing when price data are not available ({})',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(Tiers,{price:{}}));expect(wrapper).toBeEmptyRender();});it('should render nothing when price data are not available (null)',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(Tiers,{price:null}));expect(wrapper).toBeEmptyRender();});it('should render nothing when tier prices are empty ([])',function(){var price={tiers:[],currency:'USD'};var wrapper=shallow(/*#__PURE__*/React.createElement(Tiers,{price:price}));expect(wrapper).toBeEmptyRender();});it('should render nothing when tier prices are not available (field missing)',function(){var price={currency:'USD'};var wrapper=shallow(/*#__PURE__*/React.createElement(Tiers,{price:price}));expect(wrapper).toBeEmptyRender();});});});
+import React from'react';import{shallow}from'enzyme';import Tiers from"./index";jest.mock("./connector",function(){return function(cmp){return cmp;};});describe('<Tiers />',function(){describe('Rendering with data',function(){it('should render tier prices when tier prices are available',function(){var price={tiers:[{from:1,to:2,unitPrice:92.5},{from:3,to:5,unitPrice:77.5},{from:6,to:null,unitPrice:68.5}],currency:'USD'};var wrapper=shallow(React.createElement(Tiers,{price:price}));expect(wrapper).toMatchSnapshot();});});describe('Rendering without data',function(){it('should render nothing when price data are not available ({})',function(){var wrapper=shallow(React.createElement(Tiers,{price:{}}));expect(wrapper).toBeEmptyRender();});it('should render nothing when price data are not available (null)',function(){var wrapper=shallow(React.createElement(Tiers,{price:null}));expect(wrapper).toBeEmptyRender();});it('should render nothing when tier prices are empty ([])',function(){var price={tiers:[],currency:'USD'};var wrapper=shallow(React.createElement(Tiers,{price:price}));expect(wrapper).toBeEmptyRender();});it('should render nothing when tier prices are not available (field missing)',function(){var price={currency:'USD'};var wrapper=shallow(React.createElement(Tiers,{price:price}));expect(wrapper).toBeEmptyRender();});});});

package/product/components/Header/index.js

@@ -0,0 +1 @@
+export{default as PriceStriked}from"./PriceStriked";export{default as Shipping}from"./Shipping";export{default as Tiers}from"./Tiers";

package/product/components/MapPriceHint/index.js

@@ -1,4 +1,4 @@
 import React from'react';import PropTypes from'prop-types';import{css}from'glamor';import classNames from'classnames';import{SurroundPortals,I18n,TimeBoundary}from'@shopgate/engage/components';import{isBeta,useWidgetSettings,useWidgetStyles}from'@shopgate/engage/core';import{PRODUCT_MAP_PRICE}from'@shopgate/engage/product';import{showHint}from"./helpers";import connect from"./connector";var defaultStyle=css({fontSize:'0.75rem'}).toString();/**
  * The Product Map Price Hint component.
  * @return {JSX}
- */var MapPriceHint=function MapPriceHint(_ref){var price=_ref.price,mapPrice=_ref.mapPrice;if(!isBeta()){return null;}var settings=useWidgetSettings('@shopgate/engage/product/MapPrice');if(!settings.showHint||!settings.hint){return null;}var styles=useWidgetStyles('@shopgate/engage/product/MapPrice');return/*#__PURE__*/React.createElement(SurroundPortals,{portalName:PRODUCT_MAP_PRICE},showHint(price,mapPrice)&&/*#__PURE__*/React.createElement(TimeBoundary,{start:new Date(mapPrice.startDate),end:new Date(mapPrice.endDate)},function(_ref2){var between=_ref2.between;return between&&/*#__PURE__*/React.createElement(I18n.Text,{string:settings.hint,className:classNames('engage__product__map-price-hint',defaultStyle,css(styles.hint).toString())});}));};MapPriceHint.defaultProps={mapPrice:null,price:null};export default connect(MapPriceHint);
+ */var MapPriceHint=function MapPriceHint(_ref){var price=_ref.price,mapPrice=_ref.mapPrice;if(!isBeta()){return null;}var settings=useWidgetSettings('@shopgate/engage/product/MapPrice');if(!settings.showHint||!settings.hint){return null;}var styles=useWidgetStyles('@shopgate/engage/product/MapPrice');return React.createElement(SurroundPortals,{portalName:PRODUCT_MAP_PRICE},showHint(price,mapPrice)&&React.createElement(TimeBoundary,{start:new Date(mapPrice.startDate),end:new Date(mapPrice.endDate)},function(_ref2){var between=_ref2.between;return between&&React.createElement(I18n.Text,{string:settings.hint,className:classNames('engage__product__map-price-hint',defaultStyle,css(styles.hint).toString())});}));};MapPriceHint.defaultProps={mapPrice:null,price:null};export default connect(MapPriceHint);

package/product/components/Media/FeaturedMedia.js

@@ -1,4 +1,4 @@
-var _types;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{SurroundPortals}from'@shopgate/engage/components';import{MEDIA_TYPE_IMAGE,MEDIA_TYPE_VIDEO}from'@shopgate/engage/product';import{PORTAL_PRODUCT_MEDIA}from"../../../components/constants";import MediaImage from"./MediaImage";import FeaturedVideo from"./FeaturedVideo";import{defaultProps,propTypes}from"./props";var types=(_types={},_defineProperty(_types,MEDIA_TYPE_IMAGE,MediaImage),_defineProperty(_types,MEDIA_TYPE_VIDEO,FeaturedVideo),_types);/**
+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{SurroundPortals}from'@shopgate/engage/components';import{MEDIA_TYPE_IMAGE,MEDIA_TYPE_VIDEO}from'@shopgate/engage/product';import{PORTAL_PRODUCT_MEDIA}from"../../../components/constants";import MediaImage from"./MediaImage";import FeaturedVideo from"./FeaturedVideo";import{defaultProps,propTypes}from"./props";var types=_defineProperty(_defineProperty({},MEDIA_TYPE_IMAGE,MediaImage),MEDIA_TYPE_VIDEO,FeaturedVideo);/**
  * The featured media component.
  * @returns {JSX}
- */var FeaturedMedia=function FeaturedMedia(_ref){var type=_ref.type,url=_ref.url,altText=_ref.altText;var TypeRenderer=types[type]||MediaImage;return/*#__PURE__*/React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_MEDIA},/*#__PURE__*/React.createElement(TypeRenderer,{url:url,altText:altText}));};FeaturedMedia.defaultProps=defaultProps;export default FeaturedMedia;
+ */var FeaturedMedia=function FeaturedMedia(_ref){var type=_ref.type,url=_ref.url,altText=_ref.altText;var TypeRenderer=types[type]||MediaImage;return React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_MEDIA},React.createElement(TypeRenderer,{url:url,altText:altText}));};FeaturedMedia.defaultProps=defaultProps;export default FeaturedMedia;

package/product/components/Media/MediaImage.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;}function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen);}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useState,useEffect}from'react';import PropTypes from'prop-types';import classnames from'classnames';import Image from'@shopgate/pwa-common/components/Image';import appConfig from'@shopgate/pwa-common/helpers/config';import{SurroundPortals}from"../../../components";import{PORTAL_PRODUCT_IMAGE}from"../../../components/constants";import{buildMediaImageUrl}from"./helpers";import{useWidgetSettings}from"../../../core";import{defaultProps,propTypes}from"./props";import MediaPlaceholder from"./MediaPlaceholder";import{innerShadow}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;}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,useEffect}from'react';import PropTypes from'prop-types';import classnames from'classnames';import Image from'@shopgate/pwa-common/components/Image';import appConfig from'@shopgate/pwa-common/helpers/config';import{SurroundPortals}from"../../../components";import{PORTAL_PRODUCT_IMAGE}from"../../../components/constants";import{useWidgetSettings}from"../../../core";import{defaultProps,propTypes}from"./props";import MediaPlaceholder from"./MediaPlaceholder";import{innerShadow}from"./style";/**
  * The featured image component.
- * @returns {JSX}
- */var MediaImage=function MediaImage(_ref){var url=_ref.url,altText=_ref.altText,className=_ref.className,params=_ref.params;var _useState=useState(!url),_useState2=_slicedToArray(_useState,2),placeholder=_useState2[0],setPlaceholderEnabled=_useState2[1];var _useWidgetSettings=useWidgetSettings('@shopgate/engage/product/MediaImage'),_useWidgetSettings$sh=_useWidgetSettings.showInnerShadow,showInnerShadow=_useWidgetSettings$sh===void 0?!appConfig.hideProductImageShadow:_useWidgetSettings$sh;useEffect(function(){return setPlaceholderEnabled(!url);},[url]);var classes=classnames(className,_defineProperty({},innerShadow,showInnerShadow));if(placeholder){return/*#__PURE__*/React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_IMAGE},/*#__PURE__*/React.createElement(MediaPlaceholder,{className:classes}));}return/*#__PURE__*/React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_IMAGE},/*#__PURE__*/React.createElement(Image,{src:buildMediaImageUrl(url,params),alt:altText,className:classes,backgroundColor:"transparent",onError:function onError(){return setPlaceholderEnabled(true);}}));};MediaImage.defaultProps={url:defaultProps.url,altText:defaultProps.altText,className:defaultProps.className,params:null};export default MediaImage;
+ * @returns {JSX.Element}
+ */var MediaImage=function MediaImage(_ref){var url=_ref.url,altText=_ref.altText,className=_ref.className,resolutions=_ref.resolutions;var _useState=useState(!url),_useState2=_slicedToArray(_useState,2),placeholder=_useState2[0],setPlaceholderEnabled=_useState2[1];var _useWidgetSettings=useWidgetSettings('@shopgate/engage/product/MediaImage'),_useWidgetSettings$sh=_useWidgetSettings.showInnerShadow,showInnerShadow=_useWidgetSettings$sh===void 0?!appConfig.hideProductImageShadow:_useWidgetSettings$sh;useEffect(function(){return setPlaceholderEnabled(!url);},[url]);var classes=classnames(className,_defineProperty({},innerShadow,showInnerShadow));if(placeholder){return React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_IMAGE},React.createElement(MediaPlaceholder,{className:classes}));}return React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_IMAGE,portalProps:{src:url,resolutions:resolutions}},React.createElement(Image,{src:url,resolutions:resolutions,alt:altText,className:classes,backgroundColor:"transparent",onError:function onError(){return setPlaceholderEnabled(true);},animating:true}));};MediaImage.defaultProps={url:defaultProps.url,altText:defaultProps.altText,className:defaultProps.className,resolutions:undefined};export default MediaImage;

package/product/components/Media/MediaPlaceholder.js

@@ -1,4 +1,4 @@
 import React from'react';import classnames from'classnames';import PlaceholderIcon from'@shopgate/pwa-ui-shared/icons/PlaceholderIcon';import{defaultProps,propTypes}from"./props";import{placeholderContainer,placeholderContent,placeholderIcon}from"./style";/**
  * The media placeholder component.
  * @returns {JSX}
- */var MediaPlaceholder=function MediaPlaceholder(_ref){var className=_ref.className;return/*#__PURE__*/React.createElement("div",{className:classnames(placeholderContainer,className)},/*#__PURE__*/React.createElement("div",{className:placeholderContent,"data-test-id":"placeHolder"},/*#__PURE__*/React.createElement(PlaceholderIcon,{className:placeholderIcon})));};MediaPlaceholder.defaultProps={className:defaultProps.className};export default MediaPlaceholder;
+ */var MediaPlaceholder=function MediaPlaceholder(_ref){var className=_ref.className;return React.createElement("div",{className:classnames(placeholderContainer,className)},React.createElement("div",{className:placeholderContent,"data-test-id":"placeHolder"},React.createElement(PlaceholderIcon,{className:placeholderIcon})));};MediaPlaceholder.defaultProps={className:defaultProps.className};export default MediaPlaceholder;

package/product/components/MediaSlider/components/MediaImage/index.js

@@ -1,4 +1,4 @@
 import React from'react';import PropTypes from'prop-types';import{MediaImage as Image}from"../../../Media";import{full}from"../../style";import{PRODUCT_SLIDER_IMAGE_FORMATS}from"../../constants";/**
  * The product media video slide component.
  * @returns {JSX}
- */var MediaImage=function MediaImage(_ref){var media=_ref.media,onClick=_ref.onClick;return/*#__PURE__*/React.createElement("div",{onClick:onClick,onKeyDown:onClick,role:"button",tabIndex:"0",className:full},/*#__PURE__*/React.createElement(Image,{url:media.url,altText:media.altText,params:PRODUCT_SLIDER_IMAGE_FORMATS[1]}));};MediaImage.displayName='MediaSliderImage';export default MediaImage;
+ */var MediaImage=function MediaImage(_ref){var media=_ref.media,onClick=_ref.onClick;return React.createElement("div",{onClick:onClick,onKeyDown:onClick,role:"button",tabIndex:"0",className:full},React.createElement(Image,{url:media.url,altText:media.altText,resolutions:PRODUCT_SLIDER_IMAGE_FORMATS}));};MediaImage.displayName='MediaSliderImage';export default MediaImage;

package/product/components/MediaSlider/components/MediaVideo/index.js

@@ -1,4 +1,4 @@
 import React from'react';import PropTypes from'prop-types';import{IntersectionVisibility,VideoPlayer}from"../../../../../components";import{useWidgetSettings}from"../../../../../core";import connect from"./connector";import{videoWrapper,videoResponsive,video}from"../../style";/**
  * The media video component.
  * @returns {JSX}
- */var MediaVideo=function MediaVideo(_ref){var connectivityType=_ref.connectivityType,media=_ref.media;var settings=useWidgetSettings('@shopgate/engage/product/MediaSlider');var autoPlay=settings.videos.autoPlay[connectivityType]||false;return/*#__PURE__*/React.createElement(IntersectionVisibility,null,function(_ref2){var visible=_ref2.visible,ratio=_ref2.ratio,setRef=_ref2.setRef;return/*#__PURE__*/React.createElement("div",{ref:setRef,className:videoWrapper},/*#__PURE__*/React.createElement("div",{className:videoResponsive},/*#__PURE__*/React.createElement(VideoPlayer,{url:media.url,playing:autoPlay&&visible&&ratio>0.8,width:"100%",height:"100%",controls:settings.videos.controls,muted:settings.videos.muted,loop:settings.videos.loop,className:video})));});};export default connect(MediaVideo);
+ */var MediaVideo=function MediaVideo(_ref){var connectivityType=_ref.connectivityType,media=_ref.media;var settings=useWidgetSettings('@shopgate/engage/product/MediaSlider');var autoPlay=settings.videos.autoPlay[connectivityType]||false;return React.createElement(IntersectionVisibility,null,function(_ref2){var visible=_ref2.visible,ratio=_ref2.ratio,setRef=_ref2.setRef;return React.createElement("div",{ref:setRef,className:videoWrapper},React.createElement("div",{className:videoResponsive},React.createElement(VideoPlayer,{url:media.url,playing:autoPlay&&visible&&ratio>0.8,width:"100%",height:"100%",controls:settings.videos.controls,muted:settings.videos.muted,loop:settings.videos.loop,className:video})));});};export default connect(MediaVideo);

package/product/components/MediaSlider/index.js

@@ -1,6 +1,6 @@
-var _typeRenders;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{SurroundPortals,Swiper}from'@shopgate/engage/components';import{PRODUCT_MEDIA}from'@shopgate/pwa-common-commerce/product';import{MEDIA_TYPE_IMAGE,MEDIA_TYPE_VIDEO}from"../../constants";import MediaImage from"./components/MediaImage";import MediaVideo from"./components/MediaVideo";import connect from"./connector";import{container}from"./style";var typeRenders=(_typeRenders={},_defineProperty(_typeRenders,MEDIA_TYPE_IMAGE,MediaImage),_defineProperty(_typeRenders,MEDIA_TYPE_VIDEO,MediaVideo),_typeRenders);/**
+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{SurroundPortals,Swiper}from'@shopgate/engage/components';import{PRODUCT_MEDIA}from'@shopgate/pwa-common-commerce/product';import{MEDIA_TYPE_IMAGE,MEDIA_TYPE_VIDEO}from"../../constants";import MediaImage from"./components/MediaImage";import MediaVideo from"./components/MediaVideo";import connect from"./connector";import{container}from"./style";var typeRenders=_defineProperty(_defineProperty({},MEDIA_TYPE_IMAGE,MediaImage),MEDIA_TYPE_VIDEO,MediaVideo);/**
  * The product media slider component.
- * @returns {JSX}
- */var MediaSlider=function MediaSlider(_ref){var navigate=_ref.navigate,featuredMedia=_ref.featuredMedia,media=_ref.media,ariaHidden=_ref['aria-hidden'],renderPlaceholder=_ref.renderPlaceholder,className=_ref.className;var currentSlide=0;/**
+ * @returns {JSX.Element}
+ */var MediaSlider=function MediaSlider(_ref){var navigate=_ref.navigate,featuredMedia=_ref.featuredMedia,media=_ref.media,ariaHidden=_ref['aria-hidden'],renderPlaceholder=_ref.renderPlaceholder,className=_ref.className,paginationType=_ref.paginationType;var currentSlide=0;/**
    * @param {number} slide slide
-   */var setCurrentSlide=function setCurrentSlide(slide){currentSlide=slide;};/** Handle click */var handleSlideClick=function handleSlideClick(){if(!media.length){return;}navigate(currentSlide);};if(!Array.isArray(media)||media.length===0){return renderPlaceholder(featuredMedia);}return/*#__PURE__*/React.createElement("div",{className:container},/*#__PURE__*/React.createElement(SurroundPortals,{portalName:PRODUCT_MEDIA},media&&/*#__PURE__*/React.createElement(Swiper,{loop:media.length>1,indicators:true,onSlideChange:setCurrentSlide,disabled:media.length===1,controls:media.some(function(m){return m.type===MEDIA_TYPE_VIDEO;}),className:className,"aria-hidden":ariaHidden},media.map(function(singleMedia){var Type=typeRenders[singleMedia.type];return/*#__PURE__*/React.createElement(Swiper.Item,{key:Object.values(singleMedia).join('_')},/*#__PURE__*/React.createElement(Type,{media:singleMedia,onClick:handleSlideClick}));}))));};MediaSlider.defaultProps={'aria-hidden':null,className:null,featuredMedia:null,media:null,renderPlaceholder:function renderPlaceholder(featuredMedia){return/*#__PURE__*/React.createElement(MediaImage,featuredMedia);}};export default connect(MediaSlider);
+   */var setCurrentSlide=function setCurrentSlide(slide){currentSlide=slide;};/** Handle click */var handleSlideClick=function handleSlideClick(){if(!media.length){return;}navigate(currentSlide);};if(!Array.isArray(media)||media.length===0){return renderPlaceholder(featuredMedia);}return React.createElement("div",{className:container},React.createElement(SurroundPortals,{portalName:PRODUCT_MEDIA},media&&React.createElement(Swiper,{paginationType:paginationType,loop:media.length>1,indicators:true,onSlideChange:setCurrentSlide,disabled:media.length===1,controls:media.some(function(m){return m.type===MEDIA_TYPE_VIDEO;}),className:className,"aria-hidden":ariaHidden},media.map(function(singleMedia){var Type=typeRenders[singleMedia.type];return React.createElement(Swiper.Item,{key:Object.values(singleMedia).join('_')},React.createElement(Type,{media:singleMedia,onClick:handleSlideClick}));}))));};MediaSlider.defaultProps={'aria-hidden':null,className:null,featuredMedia:null,paginationType:null,media:null,renderPlaceholder:function renderPlaceholder(featuredMedia){return React.createElement(MediaImage,featuredMedia);}};export default connect(MediaSlider);

package/product/components/Options/components/Content/index.js

@@ -1,16 +1,16 @@
-function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});Object.defineProperty(subClass,"prototype",{writable:false});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{PureComponent}from'react';import PropTypes from'prop-types';import Option from"../Option";import TextOption from"../TextOption";import{ProductContext}from"../../../context";import connect from"./connector";/**
+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{ProductContext}from'@shopgate/engage/product/contexts';import Option from"../Option";import TextOption from"../TextOption";import connect from"./connector";/**
  * The Product Options component.
- */var Options=/*#__PURE__*/function(_PureComponent){_inherits(Options,_PureComponent);var _super=_createSuper(Options);function Options(){var _this;_classCallCheck(this,Options);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_super.call.apply(_super,[this].concat(args));_defineProperty(_assertThisInitialized(_this),"handleStoreSelection",function(props){props.options.forEach(function(option){// Only options of type 'select' have a default value. Type 'text' has no default.
-if(option.type!=='select'){return;}_this.context.setOption(option.id,option.items[0].value,option.items[0].price);});});return _this;}_createClass(Options,[{key:"componentDidMount",value:/**
+ */var Options=/*#__PURE__*/function(_PureComponent){function Options(){var _this2;_classCallCheck(this,Options);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this2=_callSuper(this,Options,[].concat(args));/**
+   * @param {Object} props The component props.
+   */_defineProperty(_this2,"handleStoreSelection",function(props){props.options.forEach(function(option){// Only options of type 'select' have a default value. Type 'text' has no default.
+if(option.type!=='select'){return;}_this2.context.setOption(option.id,option.items[0].value,option.items[0].price);});});return _this2;}_inherits(Options,_PureComponent);return _createClass(Options,[{key:"componentDidMount",value:/**
    * Triggers storeSelections when the component is mounted and has options set.
    */function componentDidMount(){if(!this.context||!this.context.setOption||!this.props.options){return;}this.handleStoreSelection(this.props);}/**
    * When the component receives the product options
    * it will set the first value of each option as active
    * @param {Object} nextProps The incoming props.
-   */},{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){if(!this.props.options&&nextProps.options){this.handleStoreSelection(nextProps);}}/**
-   * @param {Object} props The component props.
-   */},{key:"render",value:/**
+   */},{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){if(!this.props.options&&nextProps.options){this.handleStoreSelection(nextProps);}}},{key:"render",value:/**
    * Renders the component
    * @returns {JSX}
-   */function render(){var _this$props=this.props,options=_this$props.options,currentOptions=_this$props.currentOptions;if(!options){return null;}return/*#__PURE__*/React.createElement(ProductContext.Consumer,null,function(_ref){var setOption=_ref.setOption;return/*#__PURE__*/React.createElement("div",{"data-test-id":"optionsPicker",className:"engage__product__options"},options.map(function(option){switch(option.type){case'text':return/*#__PURE__*/React.createElement(TextOption,{key:option.id,id:option.id,label:option.label,value:currentOptions[option.id],info:option.info,onChange:setOption,required:option.required,price:option.price});case'select':return/*#__PURE__*/React.createElement(Option,{key:option.id,label:option.label,id:option.id,items:option.items,value:currentOptions[option.id],onChange:setOption});default:// unknown type
-return null;}}));});}}]);return Options;}(PureComponent);_defineProperty(Options,"contextType",ProductContext);_defineProperty(Options,"defaultProps",{currentOptions:{},options:null});export default connect(Options);
+   */function render(){var _this$props=this.props,options=_this$props.options,currentOptions=_this$props.currentOptions;if(!options){return null;}return React.createElement(ProductContext.Consumer,null,function(_ref){var setOption=_ref.setOption;return React.createElement("div",{"data-test-id":"optionsPicker",className:"engage__product__options"},options.map(function(option){switch(option.type){case'text':return React.createElement(TextOption,{key:option.id,id:option.id,label:option.label,value:currentOptions[option.id],info:option.info,onChange:setOption,required:option.required,price:option.price});case'select':return React.createElement(Option,{key:option.id,label:option.label,id:option.id,items:option.items,value:currentOptions[option.id],onChange:setOption});default:// unknown type
+return null;}}));});}}]);}(PureComponent);_defineProperty(Options,"contextType",ProductContext);_defineProperty(Options,"defaultProps",{currentOptions:{},options:null});export default connect(Options);

package/product/components/Options/components/Content/spec.js

@@ -1,2 +1,2 @@
-import React from'react';import{mount,shallow}from'enzyme';import{PickerUtilize as Picker}from'@shopgate/engage/components';import Options from"./index";jest.mock("../../../context",function(){return{ProductContext:{Consumer:jest.fn(function(_ref){var children=_ref.children;return children({setOption:jest.fn(),currency:'EUR'});})}};});jest.mock('@shopgate/engage/components/View');// Mock the redux connect() method instead of providing a fake store.
-jest.mock("./connector",function(){return function(obj){var newObj=obj;var mockOptions=[{id:'test-id',type:'select',label:'label',items:[{currency:'USD',price:10,priceDifference:0},{currency:'USD',price:10,priceDifference:0}]}];newObj.defaultProps={options:mockOptions,currentOptions:{}};return newObj;};});describe('<Options />',function(){var mockOptions=[{id:'test-id',type:'select',label:'label',items:[{currency:'USD',price:10,priceDifference:0},{currency:'USD',price:10,priceDifference:0}]}];describe('Given the component was mounted to the DOM',function(){it('should match snapshot',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(Options,{currentOptions:{}})).dive();expect(wrapper).toMatchSnapshot();});it('should render correct number of options',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Options,{options:mockOptions}));var picker=wrapper.find(Picker);expect(picker.length).toBe(mockOptions.length);});});});
+import React from'react';import{mount,shallow}from'enzyme';import{PickerUtilize as Picker}from'@shopgate/engage/components';import Options from"./index";jest.mock('@shopgate/engage/components');jest.mock('@shopgate/engage/product/contexts',function(){return{ProductContext:{Consumer:jest.fn(function(_ref){var children=_ref.children;return children({setOption:jest.fn(),currency:'EUR'});})}};});// Mock the redux connect() method instead of providing a fake store.
+jest.mock("./connector",function(){return function(obj){var newObj=obj;var mockOptions=[{id:'test-id',type:'select',label:'label',items:[{currency:'USD',price:10,priceDifference:0},{currency:'USD',price:10,priceDifference:0}]}];newObj.defaultProps={options:mockOptions,currentOptions:{}};return newObj;};});describe('<Options />',function(){var mockOptions=[{id:'test-id',type:'select',label:'label',items:[{currency:'USD',price:10,priceDifference:0},{currency:'USD',price:10,priceDifference:0}]}];describe('Given the component was mounted to the DOM',function(){it('should match snapshot',function(){var wrapper=shallow(React.createElement(Options,{currentOptions:{}})).dive();expect(wrapper).toMatchSnapshot();});it('should render correct number of options',function(){var wrapper=mount(React.createElement(Options,{options:mockOptions}));var picker=wrapper.find(Picker);expect(picker.length).toBe(mockOptions.length);});});});

package/product/components/Options/components/Option/index.js

@@ -1,4 +1,4 @@
-function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}import React from'react';import PropTypes from'prop-types';import{I18n,PickerUtilize as Picker}from'@shopgate/engage/components';import{PriceDifference}from'@shopgate/engage/product';import{ProductContext}from"../../../context";/**
+function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}import React from'react';import PropTypes from'prop-types';import{I18n,PickerUtilize as Picker}from'@shopgate/engage/components';import{PriceDifference}from'@shopgate/engage/product/components';import{ProductContext}from'@shopgate/engage/product/contexts';/**
  * @param {Object} props The component props.
  * @returns {JSX}
- */var Option=function Option(_ref){var id=_ref.id,label=_ref.label,items=_ref.items,value=_ref.value,_onChange=_ref.onChange;return/*#__PURE__*/React.createElement(ProductContext.Consumer,null,function(_ref2){var currency=_ref2.currency;return/*#__PURE__*/React.createElement("div",{key:id,"data-test-id":label},/*#__PURE__*/React.createElement(Picker,{label:label,items:items.map(function(item){return _extends({},item,{rightComponent:/*#__PURE__*/React.createElement(PriceDifference,{currency:currency,difference:item.priceDifference})});}),placeholder:/*#__PURE__*/React.createElement(I18n.Text,{string:"product.pick_an_attribute",params:[label]}),value:value,onChange:function onChange(val){return _onChange(id,val,items.find(function(item){return item.value===val;}).price);}}));});};Option.defaultProps={value:null};export default Option;
+ */var Option=function Option(_ref){var id=_ref.id,label=_ref.label,items=_ref.items,value=_ref.value,_onChange=_ref.onChange;return React.createElement(ProductContext.Consumer,null,function(_ref2){var currency=_ref2.currency;return React.createElement("div",{key:id,"data-test-id":label},React.createElement(Picker,{label:label,items:items.map(function(item){return _extends({},item,{rightComponent:React.createElement(PriceDifference,{currency:currency,difference:item.priceDifference})});}),placeholder:React.createElement(I18n.Text,{string:"product.pick_an_attribute",params:[label]}),value:value,onChange:function onChange(val){return _onChange(id,val,items.find(function(item){return item.value===val;}).price);}}));});};Option.defaultProps={value:null};export default Option;

package/product/components/Options/components/TextOption/components/OptionInfo/index.js

@@ -1,9 +1,9 @@
-function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}import React,{memo}from'react';import PropTypes from'prop-types';import Grid from'@shopgate/pwa-common/components/Grid';import I18n from'@shopgate/pwa-common/components/I18n';import{ProductContext}from"../../../../../context";import styles from"./style";/**
+function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}import React,{memo}from'react';import PropTypes from'prop-types';import{Grid,I18n}from'@shopgate/engage/components';import{ProductContext}from'@shopgate/engage/product/contexts';import styles from"./style";/**
  * The text option info component
  * @param {Object} props The component props
  * @param {Object} context The component context
  * @return {JSX}
- */var OptionInfo=function OptionInfo(_ref,context){var required=_ref.required,label=_ref.label,price=_ref.price,currency=_ref.currency,info=_ref.info,optionInfoId=_ref.optionInfoId;if(!required&&!price){return null;}var _context$i18n=context.i18n(),__=_context$i18n.__,_p=_context$i18n._p;var ariaPrice='';var ariaRequired='';if(price){ariaPrice=__('price.label',{price:_p(price,currency,2).replace('-',"\u2212")});}if(required){ariaRequired=__('common.required');}return/*#__PURE__*/React.createElement(Grid,{className:styles.info},required&&/*#__PURE__*/React.createElement(Grid.Item,{className:styles.required,"aria-hidden":true},/*#__PURE__*/React.createElement(I18n.Text,{string:"common.required"})),!!price&&/*#__PURE__*/React.createElement(Grid.Item,{grow:1,className:styles.price,"aria-hidden":true},"".concat(label,": "),/*#__PURE__*/React.createElement(I18n.Price,{currency:currency,price:price})),/*#__PURE__*/React.createElement("div",{hidden:true,id:optionInfoId},ariaRequired,ariaPrice,info));};OptionInfo.contextTypes={i18n:PropTypes.func};/**
+ */var OptionInfo=function OptionInfo(_ref,context){var required=_ref.required,label=_ref.label,price=_ref.price,currency=_ref.currency,info=_ref.info,optionInfoId=_ref.optionInfoId;if(!required&&!price){return null;}var _context$i18n=context.i18n(),__=_context$i18n.__,_p=_context$i18n._p;var ariaPrice='';var ariaRequired='';if(price){ariaPrice=__('price.label',{price:_p(price,currency,2).replace('-',"\u2212")});}if(required){ariaRequired=__('common.required');}return React.createElement(Grid,{className:styles.info},required&&React.createElement(Grid.Item,{className:styles.required,"aria-hidden":true},React.createElement(I18n.Text,{string:"common.required"})),!!price&&React.createElement(Grid.Item,{grow:1,className:styles.price,"aria-hidden":true},"".concat(label,": "),React.createElement(I18n.Price,{currency:currency,price:price})),React.createElement("div",{hidden:true,id:optionInfoId},ariaRequired,ariaPrice,info));};OptionInfo.contextTypes={i18n:PropTypes.func};/**
  * @param {Object} props The component props.
  * @returns {JSX}
- */var OptionInfoWithProductContext=function OptionInfoWithProductContext(props){return/*#__PURE__*/React.createElement(ProductContext.Consumer,null,function(_ref2){var currency=_ref2.currency;return/*#__PURE__*/React.createElement(OptionInfo,_extends({currency:currency},props));});};export default/*#__PURE__*/memo(OptionInfoWithProductContext);export{OptionInfo};
+ */var OptionInfoWithProductContext=function OptionInfoWithProductContext(props){return React.createElement(ProductContext.Consumer,null,function(_ref2){var currency=_ref2.currency;return React.createElement(OptionInfo,_extends({currency:currency},props));});};export default memo(OptionInfoWithProductContext);export{OptionInfo};

package/product/components/Options/components/TextOption/components/OptionInfo/spec.js

@@ -1 +1 @@
-import React from'react';import{shallow}from'enzyme';import mockRenderOptions from'@shopgate/pwa-common/helpers/mocks/mockRenderOptions';import{OptionInfo}from"./index";var optionInfoText='Some Text';var optionInfoId='some-id';describe('<OptionInfo />',function(){it('should not render when not required and no price',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(OptionInfo,{required:false,label:"",price:0,currency:"EUR",info:optionInfoText,optionInfoId:optionInfoId}),mockRenderOptions);expect(wrapper).toBeEmptyRender();});it('should render required element',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(OptionInfo,{required:true,label:"",price:0,currency:"EUR",info:optionInfoText,optionInfoId:optionInfoId}),mockRenderOptions).dive();expect(wrapper).toMatchSnapshot();});it('should render price element',function(){var wrapper=shallow(/*#__PURE__*/React.createElement(OptionInfo,{required:false,label:"Label",price:10,currency:"EUR",info:optionInfoText,optionInfoId:optionInfoId}),mockRenderOptions).dive();expect(wrapper).toMatchSnapshot();});});
+import React from'react';import{shallow}from'enzyme';import mockRenderOptions from'@shopgate/pwa-common/helpers/mocks/mockRenderOptions';import{OptionInfo}from"./index";var optionInfoText='Some Text';var optionInfoId='some-id';jest.mock('@shopgate/engage/components',function(){var _jest$requireActual=jest.requireActual('@shopgate/pwa-common/components/Grid'),Grid=_jest$requireActual["default"];var _jest$requireActual2=jest.requireActual('@shopgate/pwa-common/components/I18n'),I18n=_jest$requireActual2["default"];return{Grid:Grid,I18n:I18n};});jest.mock('@shopgate/engage/product/contexts',function(){return{ProductContext:{Consumer:function Consumer(_ref){var children=_ref.children;return children({currency:'EUR'});}}};});describe('<OptionInfo />',function(){it('should not render when not required and no price',function(){var wrapper=shallow(React.createElement(OptionInfo,{required:false,label:"",price:0,currency:"EUR",info:optionInfoText,optionInfoId:optionInfoId}),mockRenderOptions);expect(wrapper).toBeEmptyRender();});it('should render required element',function(){var wrapper=shallow(React.createElement(OptionInfo,{required:true,label:"",price:0,currency:"EUR",info:optionInfoText,optionInfoId:optionInfoId}),mockRenderOptions).dive();expect(wrapper).toMatchSnapshot();});it('should render price element',function(){var wrapper=shallow(React.createElement(OptionInfo,{required:false,label:"Label",price:10,currency:"EUR",info:optionInfoText,optionInfoId:optionInfoId}),mockRenderOptions).dive();expect(wrapper).toMatchSnapshot();});});

package/product/components/Options/components/TextOption/components/OptionInfo/style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors,variables=themeConfig.variables;var info=css({marginTop:variables.gap.xsmall,padding:"0 ".concat(variables.gap.big,"px")}).toString();var required=css({color:colors.shade9,fontSize:'0.825rem'}).toString();var price=css({textAlign:'right',fontSize:'0.825rem'}).toString();export default{info:info,required:required,price:price};
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var colors=themeConfig.colors,variables=themeConfig.variables;var info=css({marginTop:variables.gap.xsmall,padding:"0 ".concat(variables.gap.big,"px")}).toString();var required=css({color:"var(--color-text-medium-emphasis, ".concat(colors.shade9,")"),fontSize:'0.825rem'}).toString();var price=css({textAlign:'right',fontSize:'0.825rem'}).toString();export default{info:info,required:required,price:price};