@shopgate/engage 7.12.0-beta.1 → 7.12.0-beta.2
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/cart/components/CartItem/CartItem.js +2 -2
- package/favorites/components/Item/Item.js +3 -3
- package/favorites/components/List/List.js +2 -2
- package/package.json +7 -7
- package/product/hocs/withProductListEntry.js +11 -0
- package/product/hocs/withProductListType.js +11 -0
- package/product/hooks/useProductListEntry.js +5 -0
- package/product/hooks/useProductListType.js +5 -0
- package/product/index.js +4 -3
- package/product/providers/ProductListEntry/context.js +9 -0
- package/product/providers/ProductListEntry/index.js +11 -0
- package/product/providers/ProductListType/context.js +12 -0
- package/product/providers/ProductListType/index.js +14 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import{hot}from'react-hot-loader/root';import*as React from'react';import{SurroundPortals}from'@shopgate/engage/components';import{CART_ITEM_TYPE_PRODUCT,CART_ITEM_TYPE_COUPON,CART_ITEM}from'@shopgate/pwa-common-commerce/cart';import CartItemProduct from"./CartItemProduct";import CartItemCoupon from"./CartItemCoupon";import CartItemProductProvider from"./CartItemProductProvider";/**
|
|
1
|
+
import{hot}from'react-hot-loader/root';import*as React from'react';import{SurroundPortals}from'@shopgate/engage/components';import{CART_ITEM_TYPE_PRODUCT,CART_ITEM_TYPE_COUPON,CART_ITEM}from'@shopgate/pwa-common-commerce/cart';import{ProductListEntryProvider}from'@shopgate/engage/product';import CartItemProduct from"./CartItemProduct";import CartItemCoupon from"./CartItemCoupon";import CartItemProductProvider from"./CartItemProductProvider";/**
|
|
2
2
|
* The cart item component.
|
|
3
3
|
* @param {Object} props The component props.
|
|
4
4
|
* @property {Object} props.item The cart item.
|
|
5
5
|
* @property {Function} props.onFocus A function to indicate when the item has been focussed.
|
|
6
6
|
* @return {JSX.Element}
|
|
7
|
-
*/function CartItem(_ref){var item=_ref.item,onFocus=_ref.onFocus,editable=_ref.editable,currencyOverride=_ref.currencyOverride;if(item.type!==CART_ITEM_TYPE_PRODUCT&&item.type!==CART_ITEM_TYPE_COUPON){return null;}var props={item:item};var isProduct=item.type===CART_ITEM_TYPE_PRODUCT;if(isProduct){return React.createElement(SurroundPortals,{portalName:CART_ITEM,portalProps:props},React.createElement(CartItemProductProvider,{cartItem:item,onFocus:onFocus,isEditable:editable,currencyOverride:currencyOverride},React.createElement(CartItemProduct,null)));}return React.createElement(SurroundPortals,{portalName:CART_ITEM,portalProps:props},React.createElement(CartItemCoupon,{id:item.id,key:item.id,coupon:item.coupon,messages:item.messages,editable:editable}));}CartItem.defaultProps={editable:true,currencyOverride:null};export default hot(React.memo(CartItem));
|
|
7
|
+
*/function CartItem(_ref){var item=_ref.item,onFocus=_ref.onFocus,editable=_ref.editable,currencyOverride=_ref.currencyOverride;if(item.type!==CART_ITEM_TYPE_PRODUCT&&item.type!==CART_ITEM_TYPE_COUPON){return null;}var props={item:item};var isProduct=item.type===CART_ITEM_TYPE_PRODUCT;if(isProduct){var _item$product;return React.createElement(ProductListEntryProvider,{productId:item===null||item===void 0?void 0:(_item$product=item.product)===null||_item$product===void 0?void 0:_item$product.id},React.createElement(SurroundPortals,{portalName:CART_ITEM,portalProps:props},React.createElement(CartItemProductProvider,{cartItem:item,onFocus:onFocus,isEditable:editable,currencyOverride:currencyOverride},React.createElement(CartItemProduct,null))));}return React.createElement(SurroundPortals,{portalName:CART_ITEM,portalProps:props},React.createElement(CartItemCoupon,{id:item.id,key:item.id,coupon:item.coupon,messages:item.messages,editable:editable}));}CartItem.defaultProps={editable:true,currencyOverride:null};export default hot(React.memo(CartItem));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var _css;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,useEffect,useRef}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,i18n}from'@shopgate/engage/core';import{Link,TextLink,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{broadcastLiveMessage}from'@shopgate/engage/a11y';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{updateFavorite}from'@shopgate/pwa-common-commerce/favorites/actions/toggleFavorites';import{openFavoritesCommentDialog}from'@shopgate/pwa-common-commerce/favorites/action-creators';import classNames from'classnames';import Remove from"../RemoveButton";import ItemCharacteristics from"./ItemCharacteristics";import ItemQuantity from"./ItemQuantity";import ItemNotes from"./ItemNotes";import{FAVORITES_LIST_ITEM,FAVORITES_NOTES,FAVORITES_QUANTITY}from"../../constants/Portals";var variables=themeConfig.variables;/**
|
|
1
|
+
var _css;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,useEffect,useRef}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,ProductListEntryProvider}from'@shopgate/engage/product';import{bin2hex,showModal as showModalAction,historyPush as historyPushAction,getThemeSettings,i18n}from'@shopgate/engage/core';import{Link,TextLink,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{broadcastLiveMessage}from'@shopgate/engage/a11y';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{updateFavorite}from'@shopgate/pwa-common-commerce/favorites/actions/toggleFavorites';import{openFavoritesCommentDialog}from'@shopgate/pwa-common-commerce/favorites/action-creators';import classNames from'classnames';import Remove from"../RemoveButton";import ItemCharacteristics from"./ItemCharacteristics";import ItemQuantity from"./ItemQuantity";import ItemNotes from"./ItemNotes";import{FAVORITES_LIST_ITEM,FAVORITES_NOTES,FAVORITES_QUANTITY}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)};};};/**
|
|
4
4
|
* @param {Function} dispatch Dispatch.
|
|
@@ -10,5 +10,5 @@ var _css;function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableTo
|
|
|
10
10
|
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.
|
|
11
11
|
historyPush({pathname:productLink});return false;}broadcastLiveMessage('product.adding_item',{params:{count:1}});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]);var handleChangeQuantity=useCallback(function(newQuantity){// Do nothing when quantity didn't change
|
|
12
12
|
if(newQuantity===quantity)return;updateFavoriteItem(product.id,listId,newQuantity,notes);},[listId,notes,product.id,quantity,updateFavoriteItem]);var handleDeleteComment=useCallback(function(event){event.preventDefault();event.stopPropagation();updateFavoriteItem(product.id,listId,quantity,'');setTimeout(function(){if(notesButtonRef===null||notesButtonRef===void 0?void 0:notesButtonRef.current){// Focus the add button after item deletion to improve a11y
|
|
13
|
-
notesButtonRef.current.focus();}broadcastLiveMessage('favorites.comments.removed');},300);},[listId,product.id,quantity,updateFavoriteItem]);return React.createElement(SurroundPortals,{portalName:FAVORITES_LIST_ITEM,portalProps:product},React.createElement("div",{className:styles.root},React.createElement(Link,{className:styles.imageContainer,component:"div",href:productLink,"aria-hidden":true},React.createElement(ProductImage,{src:product.featuredImageBaseUrl,resolutions:gridResolutions})),React.createElement("div",{className:styles.infoContainer},React.createElement("div",{className:classNames(styles.infoContainerRow)},React.createElement("div",{className:styles.titleWrapper},React.createElement(SurroundPortals,{portalName:FAVORITES_PRODUCT_NAME,portalProps:commonPortalProps},React.createElement(TextLink,{href:productLink,tag:"span",className:styles.titleContainer},React.createElement("span",{className:styles.title// eslint-disable-next-line react/no-danger
|
|
14
|
-
,dangerouslySetInnerHTML:{__html:"".concat(product.name)}})))),React.createElement("div",{className:styles.removeContainer},React.createElement(Remove,{onClick:remove}))),React.createElement(ItemCharacteristics,{characteristics:characteristics}),React.createElement(StockInfoLists,{product:product}),React.createElement("div",{className:styles.infoContainerRow},React.createElement("div",{className:styles.quantityContainer},React.createElement(SurroundPortals,{portalName:FAVORITES_QUANTITY,portalProps:commonPortalProps},React.createElement(ItemQuantity,{quantity:internalQuantity,onChange:handleChangeQuantity})),React.createElement(SurroundPortals,{portalName:FAVORITES_PRODUCT_PRICE,portalProps:commonPortalProps},React.createElement("div",{className:styles.priceContainer},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(SurroundPortals,{portalName:FAVORITES_ADD_TO_CART,portalProps:ctaPortalProps},React.createElement(AddToCart,{onClick:handleAddToCart,isLoading:false,isDisabled:isDisabled,"aria-label":i18n.text('product.add_to_cart')}))),React.createElement(SurroundPortals,{portalName:FAVORITES_NOTES,portalProps:commonPortalProps},React.createElement(ItemNotes,{notes:notes,onClickDeleteComment:handleDeleteComment,onClickOpenComment:handleOpenComment,notesButtonRef:notesButtonRef})))));};FavoriteItem.defaultProps={isBaseProduct:true,isOrderable:true,isRopeProductOrderable:true,hasVariants:false,notes:undefined,quantity:1};export default connect(makeMapStateToProps,mapDispatchToProps)(FavoriteItem);
|
|
13
|
+
notesButtonRef.current.focus();}broadcastLiveMessage('favorites.comments.removed');},300);},[listId,product.id,quantity,updateFavoriteItem]);return React.createElement(ProductListEntryProvider,{productId:product.id},React.createElement(SurroundPortals,{portalName:FAVORITES_LIST_ITEM,portalProps:product},React.createElement("div",{className:styles.root},React.createElement(Link,{className:styles.imageContainer,component:"div",href:productLink,"aria-hidden":true},React.createElement(ProductImage,{src:product.featuredImageBaseUrl,resolutions:gridResolutions})),React.createElement("div",{className:styles.infoContainer},React.createElement("div",{className:classNames(styles.infoContainerRow)},React.createElement("div",{className:styles.titleWrapper},React.createElement(SurroundPortals,{portalName:FAVORITES_PRODUCT_NAME,portalProps:commonPortalProps},React.createElement(TextLink,{href:productLink,tag:"span",className:styles.titleContainer},React.createElement("span",{className:styles.title// eslint-disable-next-line react/no-danger
|
|
14
|
+
,dangerouslySetInnerHTML:{__html:"".concat(product.name)}})))),React.createElement("div",{className:styles.removeContainer},React.createElement(Remove,{onClick:remove}))),React.createElement(ItemCharacteristics,{characteristics:characteristics}),React.createElement(StockInfoLists,{product:product}),React.createElement("div",{className:styles.infoContainerRow},React.createElement("div",{className:styles.quantityContainer},React.createElement(SurroundPortals,{portalName:FAVORITES_QUANTITY,portalProps:commonPortalProps},React.createElement(ItemQuantity,{quantity:internalQuantity,onChange:handleChangeQuantity})),React.createElement(SurroundPortals,{portalName:FAVORITES_PRODUCT_PRICE,portalProps:commonPortalProps},React.createElement("div",{className:styles.priceContainer},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(SurroundPortals,{portalName:FAVORITES_ADD_TO_CART,portalProps:ctaPortalProps},React.createElement(AddToCart,{onClick:handleAddToCart,isLoading:false,isDisabled:isDisabled,"aria-label":i18n.text('product.add_to_cart')}))),React.createElement(SurroundPortals,{portalName:FAVORITES_NOTES,portalProps:commonPortalProps},React.createElement(ItemNotes,{notes:notes,onClickDeleteComment:handleDeleteComment,onClickOpenComment:handleOpenComment,notesButtonRef:notesButtonRef}))))));};FavoriteItem.defaultProps={isBaseProduct:true,isOrderable:true,isRopeProductOrderable:true,hasVariants:false,notes:undefined,quantity:1};export default connect(makeMapStateToProps,mapDispatchToProps)(FavoriteItem);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg);var value=info.value;}catch(error){reject(error);return;}if(info.done){resolve(value);}else{Promise.resolve(value).then(_next,_throw);}}function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise(function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value);}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err);}_next(undefined);});};}import React,{Fragment}from'react';import PropTypes from'prop-types';import{connect}from'react-redux';import{css}from'glamor';import{i18n,showModal}from'@shopgate/engage/core';import{Accordion,Card,ContextMenu,SurroundPortals}from'@shopgate/engage/components';import{makeGetFavorites}from'@shopgate/pwa-common-commerce/favorites/selectors';import{FAVORITES_LIST_CONTEXT_MENU}from"../../constants/Portals";import Item from"../Item";var styles={root:css({margin:'8px 8px 10px'}).toString(),title:css({flex:1}).toString(),divider:css({height:1,width:'calc(100% + 32px)',backgroundColor:'rgb(234, 234, 234)',marginLeft:-16,marginRight:-16,marginBottom:16}).toString()};/**
|
|
1
|
+
import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg);var value=info.value;}catch(error){reject(error);return;}if(info.done){resolve(value);}else{Promise.resolve(value).then(_next,_throw);}}function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise(function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value);}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err);}_next(undefined);});};}import React,{Fragment}from'react';import PropTypes from'prop-types';import{connect}from'react-redux';import{css}from'glamor';import{i18n,showModal}from'@shopgate/engage/core';import{Accordion,Card,ContextMenu,SurroundPortals}from'@shopgate/engage/components';import{ProductListTypeProvider}from'@shopgate/engage/product';import{makeGetFavorites}from'@shopgate/pwa-common-commerce/favorites/selectors';import{FAVORITES_LIST_CONTEXT_MENU}from"../../constants/Portals";import Item from"../Item";var styles={root:css({margin:'8px 8px 10px'}).toString(),title:css({flex:1}).toString(),divider:css({height:1,width:'calc(100% + 32px)',backgroundColor:'rgb(234, 234, 234)',marginLeft:-16,marginRight:-16,marginBottom:16}).toString()};/**
|
|
2
2
|
* Favorite List Label component
|
|
3
3
|
* @return {JSX}
|
|
4
4
|
*/var FavoriteListLabel=function FavoriteListLabel(_ref){var id=_ref.id,title=_ref.title,rename=_ref.rename,remove=_ref.remove;return React.createElement(Fragment,null,React.createElement("span",{className:styles.title},title),React.createElement(SurroundPortals,{portalName:FAVORITES_LIST_CONTEXT_MENU,portalProps:{id:id}},React.createElement(ContextMenu,null,React.createElement(ContextMenu.Item,{onClick:rename},i18n.text('favorites.rename_list')),React.createElement(ContextMenu.Item,{onClick:remove,disabled:id==='DEFAULT'},i18n.text('favorites.remove_list')))));};/**
|
|
@@ -12,4 +12,4 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGenera
|
|
|
12
12
|
*/var mapDispatchToProps=function mapDispatchToProps(dispatch,props){return{remove:function(){var _remove=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(id){var confirmed;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:_context.next=2;return dispatch(showModal({message:'favorites.delete_list_modal.message',title:'favorites.delete_list_modal.title',params:{name:props.name}}));case 2:confirmed=_context.sent;if(confirmed){props.remove(id);}case 4:case"end":return _context.stop();}}},_callee);}));function remove(_x){return _remove.apply(this,arguments);}return remove;}()};};/**
|
|
13
13
|
* Favorite List component
|
|
14
14
|
* @return {JSX}
|
|
15
|
-
*/var FavoriteList=function FavoriteList(_ref3){var id=_ref3.id,name=_ref3.name,items=_ref3.items,_rename=_ref3.rename,remove=_ref3.remove,removeItem=_ref3.removeItem,_addToCart=_ref3.addToCart;return React.createElement(Card,{className:styles.root},React.createElement(Accordion,{className:"",openWithChevron:true,renderLabel:function renderLabel(){return React.createElement(FavoriteListLabel,{id:id,title:name,rename:function rename(newName){return _rename(id,newName);},remove:remove});},chevronPosition:"left",startOpened:true},React.createElement("div",{className:styles.divider}),items.length===0?React.createElement("span",null,i18n.text('favorites.empty')):null,items.filter(function(_ref4){var product=_ref4.product;return product;}).map(function(_ref5,index){var product=_ref5.product,notes=_ref5.notes,quantity=_ref5.quantity;return React.createElement("div",{key:product.id},React.createElement(Item,{product:product,notes:notes,quantity:quantity,listId:id,productId:product.id,addToCart:function addToCart(e){e.preventDefault();e.stopPropagation();return _addToCart(product,quantity);},remove:function remove(e){e.preventDefault();e.stopPropagation();removeItem(product.id);}}),index===items.length-1?null:React.createElement("div",{className:styles.divider}));})));};export default connect(makeMapStateToProps,mapDispatchToProps)(FavoriteList);
|
|
15
|
+
*/var FavoriteList=function FavoriteList(_ref3){var id=_ref3.id,name=_ref3.name,items=_ref3.items,_rename=_ref3.rename,remove=_ref3.remove,removeItem=_ref3.removeItem,_addToCart=_ref3.addToCart;return React.createElement(Card,{className:styles.root},React.createElement(Accordion,{className:"",openWithChevron:true,renderLabel:function renderLabel(){return React.createElement(FavoriteListLabel,{id:id,title:name,rename:function rename(newName){return _rename(id,newName);},remove:remove});},chevronPosition:"left",startOpened:true},React.createElement("div",{className:styles.divider}),items.length===0?React.createElement("span",null,i18n.text('favorites.empty')):null,React.createElement(ProductListTypeProvider,{type:"favoritesList"},items.filter(function(_ref4){var product=_ref4.product;return product;}).map(function(_ref5,index){var product=_ref5.product,notes=_ref5.notes,quantity=_ref5.quantity;return React.createElement("div",{key:product.id},React.createElement(Item,{product:product,notes:notes,quantity:quantity,listId:id,productId:product.id,addToCart:function addToCart(e){e.preventDefault();e.stopPropagation();return _addToCart(product,quantity);},remove:function remove(e){e.preventDefault();e.stopPropagation();removeItem(product.id);}}),index===items.length-1?null:React.createElement("div",{className:styles.divider}));}))));};export default connect(makeMapStateToProps,mapDispatchToProps)(FavoriteList);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@shopgate/engage",
|
|
3
|
-
"version": "7.12.0-beta.
|
|
3
|
+
"version": "7.12.0-beta.2",
|
|
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.12.0-beta.
|
|
20
|
-
"@shopgate/pwa-common-commerce": "7.12.0-beta.
|
|
21
|
-
"@shopgate/pwa-core": "7.12.0-beta.
|
|
22
|
-
"@shopgate/pwa-ui-ios": "7.12.0-beta.
|
|
23
|
-
"@shopgate/pwa-ui-material": "7.12.0-beta.
|
|
24
|
-
"@shopgate/pwa-ui-shared": "7.12.0-beta.
|
|
19
|
+
"@shopgate/pwa-common": "7.12.0-beta.2",
|
|
20
|
+
"@shopgate/pwa-common-commerce": "7.12.0-beta.2",
|
|
21
|
+
"@shopgate/pwa-core": "7.12.0-beta.2",
|
|
22
|
+
"@shopgate/pwa-ui-ios": "7.12.0-beta.2",
|
|
23
|
+
"@shopgate/pwa-ui-material": "7.12.0-beta.2",
|
|
24
|
+
"@shopgate/pwa-ui-shared": "7.12.0-beta.2",
|
|
25
25
|
"@stripe/react-stripe-js": "^1.1.2",
|
|
26
26
|
"@stripe/stripe-js": "^1.3.1",
|
|
27
27
|
"@virtuous/conductor": "~2.5.0",
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
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 ProductListEntryContext from"../providers/ProductListEntry/context";/**
|
|
2
|
+
* Injects the ProductListEntryContext properties into the desired component. Properties will be
|
|
3
|
+
* accessible via the "productListEntry" prop.
|
|
4
|
+
*
|
|
5
|
+
* @param {Function} WrappedComponent The react component to wrap.
|
|
6
|
+
* @returns {JSX}
|
|
7
|
+
*/export default function withProductListEntry(WrappedComponent){/**
|
|
8
|
+
* The actual HOC.
|
|
9
|
+
* @param {Object} props The component props.
|
|
10
|
+
* @returns {JSX}
|
|
11
|
+
*/var WithApp=function WithApp(props){return React.createElement(ProductListEntryContext.Consumer,null,function(contextValue){return React.createElement(WrappedComponent,_extends({},props,{productListEntry:contextValue}));});};var displayName=WrappedComponent.displayName||WrappedComponent.name||'Component';WithApp.displayName="WithProductListEntry(".concat(displayName,")");return WithApp;}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
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 ProductListTypeContext from"../providers/ProductListType/context";/**
|
|
2
|
+
* Injects the ProductListTypeContext properties into the desired component. Properties will be
|
|
3
|
+
* accessible via the "productListType" prop.
|
|
4
|
+
*
|
|
5
|
+
* @param {Function} WrappedComponent The react component to wrap.
|
|
6
|
+
* @returns {JSX}
|
|
7
|
+
*/export default function withProductListType(WrappedComponent){/**
|
|
8
|
+
* The actual HOC.
|
|
9
|
+
* @param {Object} props The component props.
|
|
10
|
+
* @returns {JSX}
|
|
11
|
+
*/var WithApp=function WithApp(props){return React.createElement(ProductListTypeContext.Consumer,null,function(contextValue){return React.createElement(WrappedComponent,_extends({},props,{productListType:contextValue}));});};var displayName=WrappedComponent.displayName||WrappedComponent.name||'Component';WithApp.displayName="WithProductListType(".concat(displayName,")");return WithApp;}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import{useContext}from'react';import ProductListEntryContext,{// eslint-disable-next-line import/named, no-unused-vars
|
|
2
|
+
ProductListEntryContextValue}from"../providers/ProductListEntry/context";/**
|
|
3
|
+
* Provides the properties of the ProductListEntryContext.
|
|
4
|
+
* @returns {ProductListEntryContextValue}
|
|
5
|
+
*/export default function useProductListEntry(){var context=useContext(ProductListEntryContext);return context;}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import{useContext}from'react';import ProductListTypeContext,{// eslint-disable-next-line import/named, no-unused-vars
|
|
2
|
+
ProductListTypeContextValue}from"../providers/ProductListType/context";/**
|
|
3
|
+
* Provides the properties of the ProductListTypeContext.
|
|
4
|
+
* @returns {ProductListTypeContextValue}
|
|
5
|
+
*/export default function useProductListType(){var context=useContext(ProductListTypeContext);return context;}
|
package/product/index.js
CHANGED
|
@@ -7,6 +7,7 @@ export*from'@shopgate/pwa-common-commerce/product/helpers';export*from"./helpers
|
|
|
7
7
|
export*from'@shopgate/pwa-common-commerce/product/selectors/options';export*from'@shopgate/pwa-common-commerce/product/selectors/page';export*from'@shopgate/pwa-common-commerce/product/selectors/price';export*from'@shopgate/pwa-common-commerce/product/selectors/product';export*from'@shopgate/pwa-common-commerce/product/selectors/relations';export*from'@shopgate/pwa-common-commerce/product/selectors/variants';export*from"./selectors/media";export{getProductIsFetching,makeGetProductProperties,makeGetProductEffectivityDates,makeGetProductCharacteristics,makeGetProductFeaturedMedia,makeIsProductActive,makeIsBaseProductActive}from"./selectors/product";export*from"./selectors/price";export*from"./selectors/variants";export*from"./selectors/relations";// STREAMS
|
|
8
8
|
export*from'@shopgate/pwa-common-commerce/product/streams';// COMPONENTS
|
|
9
9
|
export{default as ProductProperties}from"./components/ProductProperties/ProductProperties";export{default as MapPriceHint}from"./components/MapPriceHint";export{default as OrderQuantityHint}from"./components/OrderQuantityHint";export{default as ProductImage}from"./components/ProductImage";export{default as MediaSlider}from"./components/MediaSlider";export{default as QuantityPicker}from"./components/QuantityPicker";export{default as EffectivityDates}from"./components/EffectivityDates";export{Availability}from"./components/Availability";export{default as PriceDifference}from"./components/PriceDifference";export{FeaturedMedia,MediaImage}from"./components/Media";export{VariantSwatch}from"./components/Swatch";export{Swatches}from"./components/Swatches";export{RelationsSlider}from"./components/RelationsSlider";export{default as ProductCard}from"./components/ProductCard";export{default as ProductGridPrice}from"./components/ProductGridPrice";export{default as ProductCharacteristics}from"./components/ProductCharacteristics";export{default as Description}from"./components/Description";export{VariantAvailability}from"./components/ProductVariants";export{PriceInfo}from"./components/PriceInfo";export{ProductName}from"./components/ProductName";export{default as ProductBadges}from"./components/ProductBadges";export{default as ProductDiscountBadge}from"./components/ProductDiscountBadge";export{ProductUnitQuantityPicker,UnitQuantityPicker,CartUnitQuantityPicker}from"./components/UnitQuantityPicker";// HOCs
|
|
10
|
-
export{default as withPriceCalculation}from"./hocs/withPriceCalculation";export{default as withProductStock}from"./hocs/withProductStock";export{default as withProduct}from"./hocs/withProduct";// HOOKs
|
|
11
|
-
export{useLoadProductImage}from"./hooks/useLoadProductImage";// CONTEXTS
|
|
12
|
-
export{ProductContext,VariantContext}from"./components/context";//
|
|
10
|
+
export{default as withPriceCalculation}from"./hocs/withPriceCalculation";export{default as withProductStock}from"./hocs/withProductStock";export{default as withProduct}from"./hocs/withProduct";export{default as withProductListType}from"./hocs/withProductListType";export{default as withProductListEntry}from"./hocs/withProductListEntry";// HOOKs
|
|
11
|
+
export{useLoadProductImage}from"./hooks/useLoadProductImage";export{default as useProductListType}from"./hooks/useProductListType";export{default as useProductListEntry}from"./hooks/useProductListEntry";// CONTEXTS
|
|
12
|
+
export{ProductContext,VariantContext}from"./components/context";export{default as ProductListTypeContext}from"./providers/ProductListType/context";export{default as ProductListEntryContext}from"./providers/ProductListEntry/context";// PROVIDERS
|
|
13
|
+
export{default as ProductListTypeProvider}from"./providers/ProductListType";export{default as ProductListEntryProvider}from"./providers/ProductListEntry";// TYPES
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from'react';/* eslint-disable import/named, no-unused-vars */import{ProductListTypeContextType,ProductListTypeContextSubType}from"../ProductListType/context";/* eslint-enable import/named, no-unused-vars */ /**
|
|
2
|
+
* @typedef ProductListEntryContextValue
|
|
3
|
+
* @property {string} productId A product identifier.
|
|
4
|
+
* @property {ProductListTypeContextType} [productListType=null] Type of the active
|
|
5
|
+
* ProductListTypeContext e.g. "productSlider" or "productGrid".
|
|
6
|
+
* @property {ProductListTypeContextSubType} [productListSubType=null] Optional sub type of the
|
|
7
|
+
* active ProductListTypeContext. Depending on its usage it can make a statement about in which
|
|
8
|
+
* context the product list is used e.g. "widgets".
|
|
9
|
+
*/export{};export default React.createContext({productListType:null,productListSubType:null,productId:null});
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React,{useMemo}from'react';import PropTypes from'prop-types';import useProductListType from"../../hooks/useProductListType";import Context from"./context";/**
|
|
2
|
+
* The ProductListEntryProvider is usually wrapped around components that render products and
|
|
3
|
+
* provides basic information about them.
|
|
4
|
+
*
|
|
5
|
+
* Context values can be accessed via the `useProductListEntry` hook, or injected into a class
|
|
6
|
+
* component via the `withProductListEntry` HOC. Both can be imported via `@shopgate/engage/product`
|
|
7
|
+
*
|
|
8
|
+
* @param {Object} param The component props
|
|
9
|
+
* @param {string} param.productId Product identifier.
|
|
10
|
+
* @returns {JSX}
|
|
11
|
+
*/function ProductListEntryProvider(_ref){var children=_ref.children,productId=_ref.productId;var _useProductListType=useProductListType(),type=_useProductListType.type,subType=_useProductListType.subType;var value=useMemo(function(){return{productListType:type,productListSubType:subType,productId:productId};},[productId,subType,type]);return React.createElement(Context.Provider,{value:value},children);}ProductListEntryProvider.defaultProps={children:null};export default ProductListEntryProvider;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from'react';/* eslint-disable max-len */ /**
|
|
2
|
+
* @typedef {"productSlider"|"productGrid"|"productList"|"favoritesList"|"cart"|"liveshopping"|"pdp"|"productGallery"} ProductListTypeContextType
|
|
3
|
+
*/export{};/**
|
|
4
|
+
* @typedef {"widgets"|"category"} ProductListTypeContextSubType
|
|
5
|
+
*/export{};/* eslint-enable max-len */ /**
|
|
6
|
+
* @typedef ProductListTypeContextValue
|
|
7
|
+
* @property {ProductListTypeContextType} [type=null] Type of the active ProductListTypeContext
|
|
8
|
+
* e.g. "productSlider" or "productGrid".
|
|
9
|
+
* @property {ProductListTypeContextSubType} [subType=null] Optional sub type of the active
|
|
10
|
+
* ProductListTypeContext. Depending on its usage it can make a statement about in which context
|
|
11
|
+
* the product list is used e.g. "widgets".
|
|
12
|
+
*/export{};export default React.createContext({type:null,subType:null});
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React,{useMemo}from'react';import PropTypes from'prop-types';import Context from"./context";/**
|
|
2
|
+
* The ProductListTypeProvider is usually wrapped around components that render product lists.
|
|
3
|
+
* It provides information about the type / purpose of those product lists which can be used
|
|
4
|
+
* by child components or extensions to determine how they are supposed to render their content.
|
|
5
|
+
*
|
|
6
|
+
* Context values can be accessed via the `useProductListType` hook, or injected into a class
|
|
7
|
+
* component via the `withProductListType` HOC. Both can be imported from `@shopgate/engage/product`
|
|
8
|
+
*
|
|
9
|
+
* @param {Object} param The component props
|
|
10
|
+
* @param {string} param.type Type of the context e.g. "productSlider" or "productGrid".
|
|
11
|
+
* @param {string} param.subType Optional sub type of the context. Depending on its usage it can
|
|
12
|
+
* make a statement about in which context the product list is used e.g. "widgets".
|
|
13
|
+
* @returns {JSX}
|
|
14
|
+
*/function ProductListTypeProvider(_ref){var children=_ref.children,type=_ref.type,subType=_ref.subType;var value=useMemo(function(){return{type:type,subType:subType};},[subType,type]);return React.createElement(Context.Provider,{value:value},children);}ProductListTypeProvider.defaultProps={children:null,subType:null};export default ProductListTypeProvider;
|