@shopgate/engage
Version:
Shopgate's ENGAGE library.
12 lines • 4.71 kB
JavaScript
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,{useMemo,useCallback,useState,useRef}from'react';import{getAbsoluteHeight}from'@shopgate/pwa-common/helpers/dom';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import{CART_ITEM_TYPE_PRODUCT}from'@shopgate/pwa-common-commerce/cart/constants';import{CART_INPUT_AUTO_SCROLL_DELAY}from"../../cart.constants";import Context from"./CartItemProductProvider.context";import connect from"./CartItemProductProvider.connector";import CartItemProductProviderLegacy from"./CartItemProductProviderLegacy";var variables=themeConfig.variables;/**
* The CartItemProduct Provider
* @param {Object} props The component props.
* @returns {JSX}
*/var CartItemProductProvider=function CartItemProductProvider(_ref){var currency=_ref.currency,deleteProduct=_ref.deleteProduct,updateProduct=_ref.updateProduct,onFocus=_ref.onFocus,cartItem=_ref.cartItem,isEditable=_ref.isEditable,children=_ref.children,isAndroid=_ref.isAndroid,currencyOverride=_ref.currencyOverride;var id=cartItem.id,product=cartItem.product,quantity=cartItem.quantity,_cartItem$fulfillment=cartItem.fulfillment,fulfillment=_cartItem$fulfillment===void 0?null:_cartItem$fulfillment,_cartItem$messages=cartItem.messages,messages=_cartItem$messages===void 0?[]:_cartItem$messages,status=cartItem.status,subStatus=cartItem.subStatus,orderedQuantity=cartItem.orderedQuantity,unitPromoAmount=cartItem.unitPromoAmount,unitDiscountAmount=cartItem.unitDiscountAmount,price=cartItem.price,promoAmount=cartItem.promoAmount,discountAmount=cartItem.discountAmount,extendedPrice=cartItem.extendedPrice,appliedPromotions=cartItem.appliedPromotions;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),editMode=_useState2[0],setEditMode=_useState2[1];var cartItemRef=useRef();var handleRemove=useCallback(function(){deleteProduct(id);},[deleteProduct,id]);var handleUpdate=useCallback(function(updatedQuantity){updateProduct(id,updatedQuantity);},[id,updateProduct]);var toggleEditMode=useCallback(function(isEnabled){if(isAndroid&&isEnabled){/**
* When the user focuses the quantity input, the keyboard will pop up an overlap the input.
* Therefor the input has to be scrolled into the viewport again. Since between the focus and
* the keyboard appearance some time ticks away, the execution of the scroll code is delayed.
*
* This should not happen on iOS devices, since their web views behave different.
*/setTimeout(function(){var yOffset=-(window.innerHeight/2)+getAbsoluteHeight(cartItemRef.current)+variables.paymentBar.height;if(cartItemRef.current){cartItemRef.current.scrollIntoView({behavior:'smooth',yOffset:yOffset});}},CART_INPUT_AUTO_SCROLL_DELAY);}// Give the keyboard some time to slide out after blur, before further actions are taken.
setTimeout(function(){if(onFocus){onFocus(isEnabled);}},isEnabled?300:0);setEditMode(isEnabled);},[isAndroid,onFocus]);var value=useMemo(function(){return{type:CART_ITEM_TYPE_PRODUCT,currency:currencyOverride||currency,product:product,messages:messages,handleRemove:handleRemove,handleUpdate:handleUpdate,cartItemRef:cartItemRef,toggleEditMode:toggleEditMode,editMode:editMode,isEditable:isEditable,cartItemId:id,cartItem:{id:id,product:product,status:status,subStatus:subStatus,quantity:quantity,orderedQuantity:orderedQuantity,fulfillment:fulfillment,unitPromoAmount:unitPromoAmount,unitDiscountAmount:unitDiscountAmount,price:price,promoAmount:promoAmount,discountAmount:discountAmount,extendedPrice:extendedPrice,appliedPromotions:appliedPromotions}};},[currency,currencyOverride,editMode,fulfillment,handleRemove,handleUpdate,id,isEditable,messages,product,status,subStatus,quantity,orderedQuantity,toggleEditMode,unitPromoAmount,unitDiscountAmount,price,promoAmount,discountAmount,extendedPrice,appliedPromotions]);return React.createElement(Context.Provider,{value:value},React.createElement(CartItemProductProviderLegacy,null,children));};CartItemProductProvider.defaultProps={children:null,isEditable:true,onFocus:function onFocus(){},currencyOverride:null};export default connect(CartItemProductProvider);