@shopgate/engage 7.3.4-beta.2 → 7.3.4-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/View/index.js +1 -1
- package/favorites/components/Item/Item.js +2 -2
- package/favorites/components/RemoveButton/RemoveButton.js +2 -2
- package/locations/components/FulfillmentSelector/FulfillmentSelectorHeader.js +1 -1
- package/locations/components/StoreList/StoreListSearch.js +1 -1
- package/package.json +7 -7
- package/product/components/Description/index.js +1 -1
- package/product/components/ProductImage/index.js +1 -1
- package/product/components/UnitQuantityPicker/ProductUnitQuantityPicker.js +1 -1
- package/product/components/UnitQuantityPicker/UnitQuantityPicker.js +2 -2
package/components/View/index.js
CHANGED
|
@@ -3,7 +3,7 @@ export{ViewContext};/**
|
|
|
3
3
|
* The View container component.
|
|
4
4
|
* @param {Object} props The component props.
|
|
5
5
|
* @return {JSX}
|
|
6
|
-
*/function ViewContainer(_ref){var background=_ref.background,children=_ref.children,noScrollOnKeyboard=_ref.noScrollOnKeyboard,visible=_ref.visible,ariaHidden=_ref['aria-hidden'];if(visible){setPageBackgroundColor(background);}var style={display:visible?'block':'none'};return React.createElement(ViewProvider,null,React.createElement(ViewContext.Consumer,null,function(_ref2){var setContentRef=_ref2.setContentRef,ariaHiddenContext=_ref2.ariaHidden;return React.createElement("section",{className:styles,style:style,"aria-hidden":ariaHidden||ariaHiddenContext},React.createElement(Content,{noScrollOnKeyboard:noScrollOnKeyboard,setContentRef:setContentRef},children));}));}ViewContainer.defaultProps={'aria-hidden':
|
|
6
|
+
*/function ViewContainer(_ref){var background=_ref.background,children=_ref.children,noScrollOnKeyboard=_ref.noScrollOnKeyboard,visible=_ref.visible,ariaHidden=_ref['aria-hidden'];if(visible){setPageBackgroundColor(background);}var style={display:visible?'block':'none'};return React.createElement(ViewProvider,null,React.createElement(ViewContext.Consumer,null,function(_ref2){var setContentRef=_ref2.setContentRef,ariaHiddenContext=_ref2.ariaHidden;return React.createElement("section",{className:styles,style:style,"aria-hidden":ariaHidden||ariaHiddenContext},React.createElement(Content,{noScrollOnKeyboard:noScrollOnKeyboard,setContentRef:setContentRef},children));}));}ViewContainer.defaultProps={'aria-hidden':true,background:colors.light,children:null,noScrollOnKeyboard:false};/**
|
|
7
7
|
* @param {Object} props The component props.
|
|
8
8
|
* @returns {JSX}
|
|
9
9
|
*/export default function View(props){return React.createElement(RouteContext.Consumer,null,function(_ref3){var visible=_ref3.visible;return React.createElement(ViewContainer,_extends({},props,{visible:visible}));});}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var _css2;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;}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,{useCallback,useMemo,useLayoutEffect,useState}from'react';import PropTypes from'prop-types';import{connect}from'react-redux';import{css}from'glamor';import{MODAL_VARIANT_SELECT}from'@shopgate/pwa-ui-shared/Dialog/constants';import{ProductImage,ITEM_PATH,PriceInfo,isBaseProduct as isBaseProductSelector,isProductOrderable,hasProductVariants}from'@shopgate/engage/product';import{bin2hex,showModal as showModalAction,historyPush as historyPushAction,getThemeSettings
|
|
1
|
+
var _css2;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;}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,{useCallback,useMemo,useLayoutEffect,useState}from'react';import PropTypes from'prop-types';import{connect}from'react-redux';import{css}from'glamor';import{MODAL_VARIANT_SELECT}from'@shopgate/pwa-ui-shared/Dialog/constants';import{ProductImage,ITEM_PATH,PriceInfo,isBaseProduct as isBaseProductSelector,isProductOrderable,hasProductVariants}from'@shopgate/engage/product';import{bin2hex,showModal as showModalAction,historyPush as historyPushAction,getThemeSettings}from'@shopgate/engage/core';import{ResponsiveContainer,Link,SurroundPortals}from'@shopgate/engage/components';import{makeIsRopeProductOrderable,getPreferredLocation,StockInfoLists}from'@shopgate/engage/locations';import{FAVORITES_PRODUCT_NAME,FAVORITES_PRODUCT_PRICE,FAVORITES_ADD_TO_CART}from'@shopgate/engage/favorites';import{responsiveMediaQuery}from'@shopgate/engage/styles';import Price from'@shopgate/pwa-ui-shared/Price';import PriceStriked from'@shopgate/pwa-ui-shared/PriceStriked';import AddToCart from'@shopgate/pwa-ui-shared/AddToCartButton';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import Remove from"../RemoveButton";import ItemCharacteristics from"./ItemCharacteristics";import{FAVORITES_LIST_ITEM,FAVORITES_LIST_ITEM_ACTIONS}from"../../constants/Portals";var variables=themeConfig.variables;/**
|
|
2
2
|
* @return {Function} The extended component props.
|
|
3
3
|
*/var makeMapStateToProps=function makeMapStateToProps(){var isRopeProductOrderable=makeIsRopeProductOrderable(function(state,props){var _getPreferredLocation;return(_getPreferredLocation=getPreferredLocation(state,props))===null||_getPreferredLocation===void 0?void 0:_getPreferredLocation.code;},function(state,props){return props.variantId||props.productId||null;});return function(state,props){return{isBaseProduct:isBaseProductSelector(state,props),hasVariants:hasProductVariants(state,props),isOrderable:isProductOrderable(state,props),isRopeProductOrderable:isRopeProductOrderable(state,props)};};};var mapDispatchToProps={showModal:showModalAction,historyPush:historyPushAction};var styles={root:css({display:'flex',position:'relative','&:not(:last-child)':{marginBottom:48},'&:last-child':{marginBottom:16}}).toString(),imageContainer:css(_defineProperty({flex:0.4,marginRight:18},responsiveMediaQuery('>=md',{webOnly:true}),{width:120,flex:'none'})).toString(),infoContainer:css({flex:1,display:'flex',flexDirection:'column',minWidth:0}),innerInfoContainer:css({flex:1,display:'flex',flexDirection:'row',minWidth:0}),infoContainerLeft:css({flex:1,display:'flex',flexDirection:'column',minWidth:0}),infoContainerRight:css({display:'flex',flexDirection:'column',minWidth:0,marginLeft:8,alignItems:'flex-end'}),priceInfo:css({wordBreak:'break-word',fontSize:'0.875rem',lineHeight:'0.875rem',color:'var(--color-text-low-emphasis)',padding:"".concat(variables.gap.xsmall,"px 0")}).toString(),title:css({fontSize:17,color:'var(--color-text-high-emphasis)',fontWeight:600,whiteSpace:'nowrap',overflow:'hidden',textOverflow:'ellipsis',marginBottom:10}),actions:css((_css2={},_defineProperty(_css2,responsiveMediaQuery('<md',{appAlways:true}),{position:'absolute',bottom:-24,display:'flex',flexDirection:'row',justifyContent:'space-between',alignItems:'center',width:90}),_defineProperty(_css2,responsiveMediaQuery('>=md',{webOnly:true}),{display:'flex',flexDirection:'row',width:100,justifyContent:'space-between',marginLeft:64}),_css2)).toString()};/**
|
|
4
4
|
* Favorite Item component
|
|
5
5
|
* @return {JSX}
|
|
6
6
|
*/var FavoriteItem=function FavoriteItem(_ref){var _product$price,_product$price2,_product$price3;var listId=_ref.listId,product=_ref.product,remove=_ref.remove,addToCart=_ref.addToCart,isBaseProduct=_ref.isBaseProduct,isOrderable=_ref.isOrderable,isRopeProductOrderable=_ref.isRopeProductOrderable,hasVariants=_ref.hasVariants,showModal=_ref.showModal,historyPush=_ref.historyPush;var _ref2=getThemeSettings('AppImages')||{},gridResolutions=_ref2.ListImage;var _useState=useState(!isOrderable&&!hasVariants),_useState2=_slicedToArray(_useState,2),isDisabled=_useState2[0],setIsDisabled=_useState2[1];var currency=((_product$price=product.price)===null||_product$price===void 0?void 0:_product$price.currency)||'EUR';var defaultPrice=((_product$price2=product.price)===null||_product$price2===void 0?void 0:_product$price2.unitPrice)||0;var specialPrice=(_product$price3=product.price)===null||_product$price3===void 0?void 0:_product$price3.unitPriceStriked;var hasStrikePrice=typeof specialPrice==='number'&&specialPrice!==defaultPrice;var price=hasStrikePrice?specialPrice:defaultPrice;var characteristics=(product===null||product===void 0?void 0:product.characteristics)||[];var productLink="".concat(ITEM_PATH,"/").concat(bin2hex(product.id));useLayoutEffect(function(){setIsDisabled(!isOrderable&&!hasVariants);},[hasVariants,isOrderable]);var handleAddToCart=useCallback(function(e){e.preventDefault();e.stopPropagation();if(isBaseProduct&&hasVariants){// Called for a parent product. Users needs to confirm the navigation to the PDP
|
|
7
7
|
showModal({title:null,type:MODAL_VARIANT_SELECT,message:'favorites.modal.message',confirm:'favorites.modal.confirm',dismiss:'common.cancel',params:{productId:product.id}});return false;}if(!isRopeProductOrderable){// Product is not orderable for ROPE. So users need to do some corrections. Just redirect.
|
|
8
|
-
historyPush({pathname:productLink});return false;}return addToCart(e);},[addToCart,hasVariants,historyPush,isBaseProduct,isRopeProductOrderable,product.id,productLink,showModal]);var commonPortalProps=useMemo(function(){var availability=product.availability,id=product.id,name=product.name;return{availability:availability,characteristics:characteristics,id:id,name:name,price:price,listId:listId};},[characteristics,listId,price,product]);var ctaPortalProps=useMemo(function(){return{isLoading:false,noShadow:false,listId:listId,isBaseProduct:isBaseProduct,isDisabled:isDisabled,productId:product.id,handleRemoveFromCart:remove,handleAddToCart:handleAddToCart};},[handleAddToCart,isBaseProduct,isDisabled,listId,product.id,remove]);return React.createElement(SurroundPortals,{portalName:FAVORITES_LIST_ITEM,portalProps:product},React.createElement(
|
|
8
|
+
historyPush({pathname:productLink});return false;}return addToCart(e);},[addToCart,hasVariants,historyPush,isBaseProduct,isRopeProductOrderable,product.id,productLink,showModal]);var commonPortalProps=useMemo(function(){var availability=product.availability,id=product.id,name=product.name;return{availability:availability,characteristics:characteristics,id:id,name:name,price:price,listId:listId};},[characteristics,listId,price,product]);var ctaPortalProps=useMemo(function(){return{isLoading:false,noShadow:false,listId:listId,isBaseProduct:isBaseProduct,isDisabled:isDisabled,productId:product.id,handleRemoveFromCart:remove,handleAddToCart:handleAddToCart};},[handleAddToCart,isBaseProduct,isDisabled,listId,product.id,remove]);return React.createElement(SurroundPortals,{portalName:FAVORITES_LIST_ITEM,portalProps:product},React.createElement(Link,{className:styles.root,component:"div",href:productLink},React.createElement("div",{className:styles.imageContainer},React.createElement(ProductImage,{src:product.featuredImageBaseUrl,resolutions:gridResolutions})),React.createElement("div",{className:styles.infoContainer},React.createElement(SurroundPortals,{portalName:FAVORITES_PRODUCT_NAME,portalProps:commonPortalProps},React.createElement("span",{className:styles.title},product.name)),React.createElement("div",{className:styles.innerInfoContainer},React.createElement("div",{className:styles.infoContainerLeft},React.createElement(ItemCharacteristics,{characteristics:characteristics}),React.createElement(StockInfoLists,{product:product})),React.createElement("div",{className:styles.infoContainerRight},React.createElement(SurroundPortals,{portalName:FAVORITES_PRODUCT_PRICE,portalProps:commonPortalProps},hasStrikePrice?React.createElement(PriceStriked,{value:defaultPrice,currency:currency}):null,React.createElement(Price,{currency:currency,discounted:hasStrikePrice,taxDisclaimer:true,unitPrice:price}),React.createElement(PriceInfo,{product:product,currency:currency,className:styles.priceInfo}))),React.createElement(ResponsiveContainer,{breakpoint:">=md",webOnly:true},React.createElement("div",{className:styles.actions},React.createElement(SurroundPortals,{portalName:FAVORITES_LIST_ITEM_ACTIONS,portalProps:ctaPortalProps},React.createElement(Remove,{onClick:remove}),React.createElement(SurroundPortals,{portalName:FAVORITES_ADD_TO_CART,portalProps:ctaPortalProps},React.createElement(AddToCart,{onClick:handleAddToCart,isLoading:false,isDisabled:isDisabled}))))))),React.createElement(ResponsiveContainer,{breakpoint:"<md",appAlways:true},React.createElement("div",{className:styles.actions},React.createElement(SurroundPortals,{portalName:FAVORITES_LIST_ITEM_ACTIONS,portalProps:ctaPortalProps},React.createElement(Remove,{onClick:remove}),React.createElement(SurroundPortals,{portalName:FAVORITES_ADD_TO_CART,portalProps:ctaPortalProps},React.createElement(AddToCart,{onClick:handleAddToCart,isLoading:false,isDisabled:isDisabled})))))));};FavoriteItem.defaultProps={isBaseProduct:true,isOrderable:true,isRopeProductOrderable:true,hasVariants:false};export default connect(makeMapStateToProps,mapDispatchToProps)(FavoriteItem);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from'react';import PropTypes from'prop-types';import{css}from'glamor';import{
|
|
1
|
+
import React from'react';import PropTypes from'prop-types';import{css}from'glamor';import{Ripple}from'@shopgate/engage/components';import CrossIcon from'@shopgate/pwa-ui-shared/icons/CrossIcon';import{themeShadows,themeColors}from'@shopgate/pwa-common/helpers/config';var styles={root:css({display:'flex',position:'relative',background:themeColors.light,borderRadius:'50%',padding:0,fontSize:20,lineHeight:1,color:"var(--color-secondary, ".concat(themeColors.accent,")"),outline:0,boxShadow:themeShadows.buttons.elevated,height:32,width:32,justifyContent:'center',alignItems:'center'}).toString()};/**
|
|
2
2
|
* The remove favorites button component.
|
|
3
3
|
* @returns {JSX}
|
|
4
|
-
*/var RemoveButton=function RemoveButton(_ref){var onClick=_ref.onClick;return React.createElement("button",{className:styles.root,onClick:onClick,type:"button"
|
|
4
|
+
*/var RemoveButton=function RemoveButton(_ref){var onClick=_ref.onClick;return React.createElement("button",{className:styles.root,onClick:onClick,type:"button"},React.createElement(Ripple,null,React.createElement(CrossIcon,{className:styles.icon})));};export default RemoveButton;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from'react';import{i18n}from'@shopgate/engage/core';import{container}from"./FulfillmentSelectorHeader.style";/**
|
|
2
2
|
* Renders the fulfillment selector title.
|
|
3
3
|
* @returns {JSX}
|
|
4
|
-
*/export function FulfillmentSelectorHeader(){return React.createElement("div",{role:"heading",className:container},i18n.text('locations.fulfillment.heading'));}
|
|
4
|
+
*/export function FulfillmentSelectorHeader(){return React.createElement("div",{role:"heading","aria-hidden":true,className:container},i18n.text('locations.fulfillment.heading'));}
|
|
@@ -18,4 +18,4 @@ setMessage('locations.error_no_store_found');}else{setMessage('');}},[isLoading,
|
|
|
18
18
|
*/var handleLocateMeButton=useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:setInputPostalCode('');setIsLoading(true);_context.next=4;return setGeolocation({productId:productId,isStoreFinder:isStoreFinder});case 4:setIsLoading(false);case 5:case"end":return _context.stop();}}},_callee);})),[isStoreFinder,productId,setGeolocation,setIsLoading]);/**
|
|
19
19
|
* Updates the local state for the postal code input.
|
|
20
20
|
* @param {SyntheticEvent} event A React event object
|
|
21
|
-
*/var handlePostalCodeChange=function handlePostalCodeChange(event){setInputPostalCode(event.target.value);};var countries=useCountriesNames(supportedCountries);var hasSupportedCountries=supportedCountries&&supportedCountries.length>1;return React.createElement(SurroundPortals,{portalName:FULFILLMENT_SHEET_SEARCH,portalProps:{product:product}},React.createElement("div",{className:container},hasSupportedCountries&&React.createElement("div",{className:countriesCell},React.createElement("div",{className:selectContainer},React.createElement("select",{name:"countryCode",value:countryCode,onChange:handleCountrySelectChange,className:select},Object.keys(countries).map(function(key){return React.createElement("option",{className:"option",value:key,key:key},countries[key]);})))),React.createElement("div",{className:inputCell},React.createElement("div",{className:inputContainer},React.createElement("span",{className:inputIcon,"aria-hidden":true},React.createElement(MagnifierIcon,null)),React.createElement("input",{ref:inputEl,name:"postalCode",className:input,value:inputPostalCode,onChange:handlePostalCodeChange,onBlur:handlePostalCodeBlur,onKeyDown:handlePostalCodeSubmitKeyDown,disabled:isLoading,type:"search",autoComplete:"off",autoCorrect:"off",placeholder:i18n.text('locations.search_placeholder')}),React.createElement("button",{onClick:handleLocateMeButton,type:"button",className:inputIcon
|
|
21
|
+
*/var handlePostalCodeChange=function handlePostalCodeChange(event){setInputPostalCode(event.target.value);};var countries=useCountriesNames(supportedCountries);var hasSupportedCountries=supportedCountries&&supportedCountries.length>1;return React.createElement(SurroundPortals,{portalName:FULFILLMENT_SHEET_SEARCH,portalProps:{product:product}},React.createElement("div",{className:container},hasSupportedCountries&&React.createElement("div",{className:countriesCell},React.createElement("div",{className:selectContainer},React.createElement("select",{name:"countryCode",value:countryCode,onChange:handleCountrySelectChange,className:select},Object.keys(countries).map(function(key){return React.createElement("option",{className:"option",value:key,key:key},countries[key]);})))),React.createElement("div",{className:inputCell},React.createElement("div",{className:inputContainer},React.createElement("span",{className:inputIcon,"aria-hidden":true},React.createElement(MagnifierIcon,null)),React.createElement("input",{ref:inputEl,name:"postalCode",className:input,value:inputPostalCode,onChange:handlePostalCodeChange,onBlur:handlePostalCodeBlur,onKeyDown:handlePostalCodeSubmitKeyDown,disabled:isLoading,type:"search",autoComplete:"off",autoCorrect:"off",placeholder:i18n.text('locations.search_placeholder')}),React.createElement("button",{onClick:handleLocateMeButton,type:"button",className:inputIcon},React.createElement(LocatorIcon,null)))),React.createElement("div",{className:radiusCell},isStoreFinder&&React.createElement(StoreListSearchRadius,null))),message&&React.createElement(MessageBar,{messages:[{type:'error',message:message,icon:InfoIcon}],classNames:{icon:iconClass}}));}StoreListSearch.defaultProps={postalCode:null,isStoreFinder:false};export default connect(memo(StoreListSearch));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@shopgate/engage",
|
|
3
|
-
"version": "7.3.4-beta.
|
|
3
|
+
"version": "7.3.4-beta.3",
|
|
4
4
|
"description": "Shopgate's ENGAGE library.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Shopgate <support@shopgate.com>",
|
|
@@ -16,12 +16,12 @@
|
|
|
16
16
|
],
|
|
17
17
|
"dependencies": {
|
|
18
18
|
"@shopgate/native-modules": "1.0.0-beta.18",
|
|
19
|
-
"@shopgate/pwa-common": "7.3.4-beta.
|
|
20
|
-
"@shopgate/pwa-common-commerce": "7.3.4-beta.
|
|
21
|
-
"@shopgate/pwa-core": "7.3.4-beta.
|
|
22
|
-
"@shopgate/pwa-ui-ios": "7.3.4-beta.
|
|
23
|
-
"@shopgate/pwa-ui-material": "7.3.4-beta.
|
|
24
|
-
"@shopgate/pwa-ui-shared": "7.3.4-beta.
|
|
19
|
+
"@shopgate/pwa-common": "7.3.4-beta.3",
|
|
20
|
+
"@shopgate/pwa-common-commerce": "7.3.4-beta.3",
|
|
21
|
+
"@shopgate/pwa-core": "7.3.4-beta.3",
|
|
22
|
+
"@shopgate/pwa-ui-ios": "7.3.4-beta.3",
|
|
23
|
+
"@shopgate/pwa-ui-material": "7.3.4-beta.3",
|
|
24
|
+
"@shopgate/pwa-ui-shared": "7.3.4-beta.3",
|
|
25
25
|
"@stripe/react-stripe-js": "^1.1.2",
|
|
26
26
|
"@stripe/stripe-js": "^1.3.1",
|
|
27
27
|
"@virtuous/conductor": "~2.5.0",
|
|
@@ -2,4 +2,4 @@ import React from'react';import PropTypes from'prop-types';import{SurroundPortal
|
|
|
2
2
|
* The product description.
|
|
3
3
|
* @param {Object} props The component props.
|
|
4
4
|
* @returns {JSX}
|
|
5
|
-
*/function Description(_ref){var html=_ref.html,navigate=_ref.navigate;return React.createElement(SurroundPortals,{portalName:PRODUCT_DESCRIPTION},html!==''&&React.createElement("div",{className:container},React.createElement("div",{className:title},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);
|
|
5
|
+
*/function Description(_ref){var html=_ref.html,navigate=_ref.navigate;return React.createElement(SurroundPortals,{portalName:PRODUCT_DESCRIPTION},html!==''&&React.createElement("div",{className:container},React.createElement("div",{"aria-hidden":true,className:title},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);
|
|
@@ -25,4 +25,4 @@ var showPlaceholder=!nextProps.src&&(!nextProps.srcmap||nextProps.srcmap.length=
|
|
|
25
25
|
* @returns {JSX}
|
|
26
26
|
*/value:function render(){var _this$props=this.props,noBackground=_this$props.noBackground,className=_this$props.className,placeholderSrc=_this$props.placeholderSrc;var showInnerShadow=this.props.widgetSettings.showInnerShadow;if(typeof showInnerShadow==='undefined'){showInnerShadow=!appConfig.hideProductImageShadow;}if(this.state.imageLoadingFailed||this.state.showPlaceholder){var _classnames;// Image is not present or could not be loaded, show a placeholder.
|
|
27
27
|
return React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_IMAGE},React.createElement("div",{className:classnames(styles.placeholderContainer(this.getImageRatio()),(_classnames={},_defineProperty(_classnames,styles.innerShadow,showInnerShadow),_defineProperty(_classnames,className,!!className),_classnames)),"aria-hidden":this.props['aria-hidden']},placeholderSrc?React.createElement(ProductImagePlaceholder,{src:placeholderSrc,showInnerShadow:showInnerShadow,noBackground:noBackground}):React.createElement("div",{className:styles.placeholderContent,"data-test-id":"placeHolder"},React.createElement(PlaceholderIcon,{className:styles.placeholder}))));}// Return the actual image.
|
|
28
|
-
return React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_IMAGE},React.createElement("div",{"aria-hidden":this.props['aria-hidden'],className:className},React.createElement(Image,_extends({},this.props,{className:showInnerShadow?styles.innerShadow:'',backgroundColor:noBackground?'transparent':colors.light,onError:this.imageLoadingFailed}))));}}]);return ProductImage;}(Component);_defineProperty(ProductImage,"defaultProps",{alt:null,animating:true,'aria-hidden':
|
|
28
|
+
return React.createElement(SurroundPortals,{portalName:PORTAL_PRODUCT_IMAGE},React.createElement("div",{"aria-hidden":this.props['aria-hidden'],className:className},React.createElement(Image,_extends({},this.props,{className:showInnerShadow?styles.innerShadow:'',backgroundColor:noBackground?'transparent':colors.light,onError:this.imageLoadingFailed}))));}}]);return ProductImage;}(Component);_defineProperty(ProductImage,"defaultProps",{alt:null,animating:true,'aria-hidden':null,className:null,forcePlaceholder:false,highestResolutionLoaded:function highestResolutionLoaded(){},noBackground:false,ratio:null,resolutions:[{width:50,height:50,blur:2},{width:440,height:440}],src:null,srcmap:null,placeholderSrc:null,widgetSettings:{}});export{ProductImage as UnwrappedProductImage};export default connect(withWidgetSettings(ProductImage,'@shopgate/engage/product/ProductImage'));
|
|
@@ -2,4 +2,4 @@ import React,{useContext,useMemo}from'react';import PropTypes from'prop-types';i
|
|
|
2
2
|
* Renders the quantity picker enriched with current product data.
|
|
3
3
|
* @param {Object} props Props
|
|
4
4
|
* @returns {JSX}
|
|
5
|
-
*/var ProductUnitQuantityPicker=function ProductUnitQuantityPicker(_ref){var children=_ref.children,className=_ref.className,product=_ref.product,disabled=_ref.disabled,stockInfo=_ref.stockInfo;var _useContext=useContext(ProductContext),quantity=_useContext.quantity,setQuantity=_useContext.setQuantity;var _useMemo=useMemo(function(){var min;var max;if((stockInfo===null||stockInfo===void 0?void 0:stockInfo.minOrderQuantity)>0){min=stockInfo.minOrderQuantity;}if((stockInfo===null||stockInfo===void 0?void 0:stockInfo.maxOrderQuantity)>0){max=stockInfo.maxOrderQuantity;}return{minValue:min,maxValue:max};},[stockInfo]),minValue=_useMemo.minValue,maxValue=_useMemo.maxValue;if(!product){return null;}var unit=product.unit,hasCatchWeight=product.hasCatchWeight;var hasUnitWithDecimals=unit&&hasCatchWeight||false;return React.createElement(SurroundPortals,{portalName:PRODUCT_UNIT_QUANTITY_PICKER},React.createElement("div",{className:classNames(styles.root,className)},React.createElement("div",null,React.createElement("div",{className:styles.title},React.createElement(I18n.Text,{string:"product.sections.quantity"})),React.createElement(UnitQuantityPicker,{className:hasUnitWithDecimals?big:small,unit:hasUnitWithDecimals?unit:null,maxDecimals:hasUnitWithDecimals?2:0,incrementStep:hasUnitWithDecimals?0.25:1,decrementStep:hasUnitWithDecimals?0.25:1,onChange:setQuantity,value:quantity,disabled:disabled,minValue:minValue,maxValue:maxValue})),children&&React.createElement("div",null,children)));};ProductUnitQuantityPicker.defaultProps={disabled:false,product:null,stockInfo:null,children:null,className:null};export default withCurrentProduct(connect(ProductUnitQuantityPicker));
|
|
5
|
+
*/var ProductUnitQuantityPicker=function ProductUnitQuantityPicker(_ref){var children=_ref.children,className=_ref.className,product=_ref.product,disabled=_ref.disabled,stockInfo=_ref.stockInfo;var _useContext=useContext(ProductContext),quantity=_useContext.quantity,setQuantity=_useContext.setQuantity;var _useMemo=useMemo(function(){var min;var max;if((stockInfo===null||stockInfo===void 0?void 0:stockInfo.minOrderQuantity)>0){min=stockInfo.minOrderQuantity;}if((stockInfo===null||stockInfo===void 0?void 0:stockInfo.maxOrderQuantity)>0){max=stockInfo.maxOrderQuantity;}return{minValue:min,maxValue:max};},[stockInfo]),minValue=_useMemo.minValue,maxValue=_useMemo.maxValue;if(!product){return null;}var unit=product.unit,hasCatchWeight=product.hasCatchWeight;var hasUnitWithDecimals=unit&&hasCatchWeight||false;return React.createElement(SurroundPortals,{portalName:PRODUCT_UNIT_QUANTITY_PICKER},React.createElement("div",{className:classNames(styles.root,className)},React.createElement("div",null,React.createElement("div",{"aria-hidden":true,className:styles.title},React.createElement(I18n.Text,{string:"product.sections.quantity"})),React.createElement(UnitQuantityPicker,{className:hasUnitWithDecimals?big:small,unit:hasUnitWithDecimals?unit:null,maxDecimals:hasUnitWithDecimals?2:0,incrementStep:hasUnitWithDecimals?0.25:1,decrementStep:hasUnitWithDecimals?0.25:1,onChange:setQuantity,value:quantity,disabled:disabled,minValue:minValue,maxValue:maxValue})),children&&React.createElement("div",null,children)));};ProductUnitQuantityPicker.defaultProps={disabled:false,product:null,stockInfo:null,children:null,className:null};export default withCurrentProduct(connect(ProductUnitQuantityPicker));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{useCallback,useEffect}from'react';import PropTypes from'prop-types';import{
|
|
1
|
+
function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{useCallback,useEffect}from'react';import PropTypes from'prop-types';import{css}from'glamor';import classNames from'classnames';import{themeConfig}from'@shopgate/engage';import{RippleButton,QuantityInput}from'@shopgate/engage/components';var variables=themeConfig.variables,colors=themeConfig.colors;var styles={root:css({display:'flex',flexDirection:'row'}).toString(),input:css({padding:"0 ".concat(variables.gap.small,"px"),textAlign:'center',flex:1,fontSize:15,height:28,width:'100%',backgroundColor:"var(--color-background-accent, ".concat(colors.shade8,")")}).toString(),inputWrapper:css({width:'100%'}),button:css({width:28,' &&':{minWidth:28,padding:0},height:28}).toString(),buttonRipple:css({padding:0}).toString(),buttonNoRadiusLeft:css({' &&':{borderTopLeftRadius:0,borderBottomLeftRadius:0}}).toString(),buttonNoRadiusRight:css({' &&':{borderTopRightRadius:0,borderBottomRightRadius:0}}).toString(),disabled:css({' > div':{padding:0}}).toString()};/**
|
|
2
2
|
* A Quantity Picker with unit support.
|
|
3
3
|
* @returns {JSX}
|
|
4
|
-
*/var UnitQuantityPicker=function UnitQuantityPicker(_ref){var className=_ref.className,onChange=_ref.onChange,value=_ref.value,allowDecrement=_ref.allowDecrement,allowIncrement=_ref.allowIncrement,allowZero=_ref.allowZero,decrementStep=_ref.decrementStep,incrementStep=_ref.incrementStep,maxDecimals=_ref.maxDecimals,unit=_ref.unit,disabled=_ref.disabled,minValue=_ref.minValue,maxValue=_ref.maxValue;var handleDecrement=useCallback(function(){var newValue=value-decrementStep;if(newValue<=0&&!allowZero||minValue&&newValue<minValue){newValue=value;}onChange(newValue);},[allowZero,decrementStep,minValue,onChange,value]);var handleIncrement=useCallback(function(){var newValue=value+incrementStep;if(maxValue&&newValue>maxValue){newValue=value;}onChange(newValue);},[incrementStep,maxValue,onChange,value]);useEffect(function(){if(minValue&&value<minValue){onChange(minValue);}if(maxValue&&value>maxValue){onChange(maxValue);}/* eslint-disable react-hooks/exhaustive-deps */},[]);/* eslint-enable react-hooks/exhaustive-deps */return React.createElement("div",{className:"".concat(styles.root," ").concat(className)},React.createElement(RippleButton,{rippleClassName:styles.buttonRipple,className:classNames(styles.button,styles.buttonNoRadiusRight,_defineProperty({},styles.disabled,disabled)),type:"secondary",disabled:!allowDecrement||disabled,onClick:handleDecrement
|
|
4
|
+
*/var UnitQuantityPicker=function UnitQuantityPicker(_ref){var className=_ref.className,onChange=_ref.onChange,value=_ref.value,allowDecrement=_ref.allowDecrement,allowIncrement=_ref.allowIncrement,allowZero=_ref.allowZero,decrementStep=_ref.decrementStep,incrementStep=_ref.incrementStep,maxDecimals=_ref.maxDecimals,unit=_ref.unit,disabled=_ref.disabled,minValue=_ref.minValue,maxValue=_ref.maxValue;var handleDecrement=useCallback(function(){var newValue=value-decrementStep;if(newValue<=0&&!allowZero||minValue&&newValue<minValue){newValue=value;}onChange(newValue);},[allowZero,decrementStep,minValue,onChange,value]);var handleIncrement=useCallback(function(){var newValue=value+incrementStep;if(maxValue&&newValue>maxValue){newValue=value;}onChange(newValue);},[incrementStep,maxValue,onChange,value]);useEffect(function(){if(minValue&&value<minValue){onChange(minValue);}if(maxValue&&value>maxValue){onChange(maxValue);}/* eslint-disable react-hooks/exhaustive-deps */},[]);/* eslint-enable react-hooks/exhaustive-deps */return React.createElement("div",{className:"".concat(styles.root," ").concat(className)},React.createElement(RippleButton,{rippleClassName:styles.buttonRipple,className:classNames(styles.button,styles.buttonNoRadiusRight,_defineProperty({},styles.disabled,disabled)),type:"secondary",disabled:!allowDecrement||disabled,onClick:handleDecrement},"-"),React.createElement("span",null,React.createElement(QuantityInput,{className:styles.input,value:value,onChange:onChange,maxDecimals:maxDecimals,unit:unit,disabled:disabled,minValue:minValue,maxValue:maxValue})),React.createElement(RippleButton,{type:"secondary",disabled:!allowIncrement||disabled,rippleClassName:styles.buttonRipple,className:classNames(styles.button,styles.buttonNoRadiusLeft,_defineProperty({},styles.disabled,disabled)),onClick:handleIncrement},"+"));};UnitQuantityPicker.defaultProps={className:'',allowZero:false,allowIncrement:true,allowDecrement:true,incrementStep:0.25,decrementStep:0.25,maxDecimals:2,unit:null,disabled:false,minValue:null,maxValue:null};export default UnitQuantityPicker;
|