@shopgate/engage 7.12.3-beta.1 → 7.20.0-beta.1

package/checkout/actions/prepareCheckout.js

@@ -1,8 +1,8 @@
 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*as Sentry from'@sentry/browser';import{getNeedsPaymentForOrder,getDefaultPaymentMethod,getPaymentMethods}from"../selectors/payment";import{getCheckoutOrder}from"../selectors/order";import{initializeCheckout}from"./initializeCheckout";import{fetchCheckoutOrder}from"./fetchCheckoutOrder";import{updateCheckoutOrder}from"./updateCheckoutOrder";import{fetchPaymentMethods}from"./fetchPaymentMethods";import{errorCheckout}from"./errorCheckout";/**
  * Starts entering the checkout process for the customer.
  * @returns {Function}
- */export var prepareCheckout=function prepareCheckout(_ref){var _ref$initializeOrder=_ref.initializeOrder,initializeOrder=_ref$initializeOrder===void 0?true:_ref$initializeOrder,_ref$initializePaymen=_ref.initializePayment,initializePayment=_ref$initializePaymen===void 0?true:_ref$initializePaymen;return(/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(dispatch,getState){var _order$paymentTransac,_order$paymentTransac2;var defaultPaymentMethod,needsPayment,order,paymentMethods,paymentAlreadyInitialized;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:if(!initializeOrder){_context.next=9;break;}_context.prev=1;_context.next=4;return dispatch(initializeCheckout());case 4:_context.next=9;break;case 6:_context.prev=6;_context.t0=_context["catch"](1);return _context.abrupt("return",dispatch(errorCheckout('checkout.errors.checkCart','shopgate.checkout.initialize',_context.t0)));case 9:_context.next=11;return Promise.all([dispatch(fetchCheckoutOrder()),dispatch(fetchPaymentMethods())]);case 11:// If payment is needed we create a new payment transaction.
+ */export var prepareCheckout=function prepareCheckout(_ref){var _ref$initializeOrder=_ref.initializeOrder,initializeOrder=_ref$initializeOrder===void 0?true:_ref$initializeOrder,_ref$initializePaymen=_ref.initializePayment,initializePayment=_ref$initializePaymen===void 0?true:_ref$initializePaymen;return(/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(dispatch,getState){var _order$paymentTransac,_order$paymentTransac2;var defaultPaymentMethod,needsPayment,order,paymentMethods,paymentAlreadyInitialized;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:if(!initializeOrder){_context.next=9;break;}_context.prev=1;_context.next=4;return dispatch(initializeCheckout());case 4:_context.next=9;break;case 6:_context.prev=6;_context.t0=_context["catch"](1);return _context.abrupt("return",dispatch(errorCheckout('checkout.errors.checkCart','shopgate.checkout.initialize',_context.t0)));case 9:_context.next=11;return Promise.all([dispatch(fetchCheckoutOrder()),dispatch(fetchPaymentMethods())]);case 11:// If payment is needed we create a new payment transaction.
 needsPayment=getNeedsPaymentForOrder(getState());if(!needsPayment){_context.next=16;break;}// Pick payment method.
 defaultPaymentMethod=getDefaultPaymentMethod(getState());if(defaultPaymentMethod){_context.next=16;break;}return _context.abrupt("return",dispatch(errorCheckout('checkout.errors.missingPaymentMethod','shopgate.checkout.getPaymentMethods',{message:'No payment method found.'})));case 16:// Test if order is available in store.
 order=getCheckoutOrder(getState());if(order){_context.next=19;break;}return _context.abrupt("return",dispatch(errorCheckout('checkout.errors.genericInitialize','shopgate.checkout.initialize',{message:'No order received from API'})));case 19:// Put logging info to sentry.
-Sentry.configureScope(function(scope){scope.setTag('checkout_order_id',order.id);scope.addBreadcrumb({category:'checkout',message:"Initialize checkout with order id ".concat(order.id),level:'info'});});paymentMethods=getPaymentMethods(getState());paymentAlreadyInitialized=!!(order===null||order===void 0?void 0:(_order$paymentTransac=order.paymentTransactions)===null||_order$paymentTransac===void 0?void 0:(_order$paymentTransac2=_order$paymentTransac[0])===null||_order$paymentTransac2===void 0?void 0:_order$paymentTransac2.paymentMethod);if(!(needsPayment&&initializePayment&&!paymentAlreadyInitialized&&paymentMethods.length===1)){_context.next=33;break;}_context.prev=23;_context.next=26;return dispatch(updateCheckoutOrder({paymentTransactions:[{paymentMethod:{code:defaultPaymentMethod.code}}]}));case 26:_context.next=28;return dispatch(fetchCheckoutOrder());case 28:_context.next=33;break;case 30:_context.prev=30;_context.t1=_context["catch"](23);return _context.abrupt("return",{success:false,needsPayment:false});case 33:return _context.abrupt("return",{needsPayment:needsPayment,success:true});case 34:case"end":return _context.stop();}}},_callee,null,[[1,6],[23,30]]);}));return function(_x,_x2){return _ref2.apply(this,arguments);};}());};
+Sentry.configureScope(function(scope){scope.setTag('checkout_order_id',order.id);scope.addBreadcrumb({category:'checkout',message:"Initialize checkout with order id ".concat(order.id),level:'info'});});paymentMethods=getPaymentMethods(getState());paymentAlreadyInitialized=!!(order===null||order===void 0?void 0:(_order$paymentTransac=order.paymentTransactions)===null||_order$paymentTransac===void 0?void 0:(_order$paymentTransac2=_order$paymentTransac[0])===null||_order$paymentTransac2===void 0?void 0:_order$paymentTransac2.paymentMethod);if(!(needsPayment&&initializePayment&&!paymentAlreadyInitialized&&paymentMethods.length===1)){_context.next=33;break;}_context.prev=23;_context.next=26;return dispatch(updateCheckoutOrder({paymentTransactions:[{paymentMethod:{code:defaultPaymentMethod.code}}]}));case 26:_context.next=28;return dispatch(fetchCheckoutOrder());case 28:_context.next=33;break;case 30:_context.prev=30;_context.t1=_context["catch"](23);return _context.abrupt("return",{success:false,needsPayment:false});case 33:return _context.abrupt("return",{needsPayment:needsPayment,success:true});case 34:case"end":return _context.stop();}},_callee,null,[[1,6],[23,30]]);}));return function(_x,_x2){return _ref2.apply(this,arguments);};}());};

package/checkout/actions/submitCheckoutOrder.js

@@ -2,4 +2,4 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGenera
  * Completes the checkout order by fulfilling with checkout params for each transaction.
  * @param {Object} payload The action input.
  * @returns {Function}
- */export var submitCheckoutOrder=function submitCheckoutOrder(payload){return(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(dispatch){var pipelineError,pipelineOutput;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:LoadingProvider.setLoading(CHECKOUT_PATTERN);dispatch({type:SUBMIT_CHECKOUT_ORDER,payload:payload});_context.prev=2;_context.next=5;return new PipelineRequest('shopgate.checkout.submit').setInput(payload).setErrorBlacklist([ERROR_CODE_CHECKOUT_GENERIC]).dispatch();case 5:pipelineOutput=_context.sent;dispatch({type:SUBMIT_CHECKOUT_ORDER_SUCCESS});_context.next=14;break;case 9:_context.prev=9;_context.t0=_context["catch"](2);pipelineError=_context.t0;dispatch(errorCheckout('checkout.errors.genericSubmit','shopgate.checkout.submit',_context.t0,false,[1001,1003]));dispatch({type:SUBMIT_CHECKOUT_ORDER_ERROR});case 14:LoadingProvider.unsetLoading(CHECKOUT_PATTERN);if(!pipelineError){_context.next=17;break;}throw pipelineError;case 17:return _context.abrupt("return",pipelineOutput);case 18:case"end":return _context.stop();}}},_callee,null,[[2,9]]);}));return function(_x){return _ref.apply(this,arguments);};}());};
+ */export var submitCheckoutOrder=function submitCheckoutOrder(payload){return(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(dispatch){var pipelineError,pipelineOutput;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:LoadingProvider.setLoading(CHECKOUT_PATTERN);dispatch({type:SUBMIT_CHECKOUT_ORDER,payload:payload});_context.prev=2;_context.next=5;return new PipelineRequest('shopgate.checkout.submit').setInput(payload).setErrorBlacklist([ERROR_CODE_CHECKOUT_GENERIC]).dispatch();case 5:pipelineOutput=_context.sent;dispatch({type:SUBMIT_CHECKOUT_ORDER_SUCCESS});_context.next=14;break;case 9:_context.prev=9;_context.t0=_context["catch"](2);pipelineError=_context.t0;dispatch(errorCheckout('checkout.errors.genericSubmit','shopgate.checkout.submit',_context.t0,false,[1001,1003]));dispatch({type:SUBMIT_CHECKOUT_ORDER_ERROR});case 14:LoadingProvider.unsetLoading(CHECKOUT_PATTERN);if(!pipelineError){_context.next=17;break;}throw pipelineError;case 17:return _context.abrupt("return",pipelineOutput);case 18:case"end":return _context.stop();}},_callee,null,[[2,9]]);}));return function(_x){return _ref.apply(this,arguments);};}());};

package/checkout/actions/updateCheckoutOrder.js

@@ -2,4 +2,4 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGenera
  * Starts entering the checkout process for the customer.
  * @param {Object} payload Order payload.
  * @returns {Function}
- */export var updateCheckoutOrder=function updateCheckoutOrder(payload){return(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(dispatch){var pipelineError;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:dispatch({type:UPDATE_CHECKOUT_ORDER});_context.prev=1;_context.next=4;return new PipelineRequest('shopgate.checkout.updateOrder').setInput(payload).setErrorBlacklist([ERROR_CODE_CHECKOUT_GENERIC,EVALIDATION]).dispatch();case 4:dispatch({type:UPDATE_CHECKOUT_ORDER_SUCCESS});_context.next=11;break;case 7:_context.prev=7;_context.t0=_context["catch"](1);pipelineError=_context.t0;if(_context.t0.code===EVALIDATION){dispatch(validationErrorsCheckout(_context.t0.errors));}else{dispatch(errorCheckout('checkout.errors.genericUpdate','shopgate.checkout.updateOrder',_context.t0,false));dispatch({type:UPDATE_CHECKOUT_ORDER_ERROR});}case 11:if(!pipelineError){_context.next=13;break;}throw pipelineError;case 13:case"end":return _context.stop();}}},_callee,null,[[1,7]]);}));return function(_x){return _ref.apply(this,arguments);};}());};
+ */export var updateCheckoutOrder=function updateCheckoutOrder(payload){return(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(dispatch){var pipelineError;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:dispatch({type:UPDATE_CHECKOUT_ORDER});_context.prev=1;_context.next=4;return new PipelineRequest('shopgate.checkout.updateOrder').setInput(payload).setErrorBlacklist([ERROR_CODE_CHECKOUT_GENERIC,EVALIDATION]).dispatch();case 4:dispatch({type:UPDATE_CHECKOUT_ORDER_SUCCESS});_context.next=11;break;case 7:_context.prev=7;_context.t0=_context["catch"](1);pipelineError=_context.t0;if(_context.t0.code===EVALIDATION){dispatch(validationErrorsCheckout(_context.t0.errors));}else{dispatch(errorCheckout('checkout.errors.genericUpdate','shopgate.checkout.updateOrder',_context.t0,false));dispatch({type:UPDATE_CHECKOUT_ORDER_ERROR});}case 11:if(!pipelineError){_context.next=13;break;}throw pipelineError;case 13:case"end":return _context.stop();}},_callee,null,[[1,7]]);}));return function(_x){return _ref.apply(this,arguments);};}());};

package/checkout/components/Checkout/CheckoutSectionMessages.js

@@ -1,4 +1,4 @@
 function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React from'react';import PropTypes from'prop-types';import classNames from'classnames';import{css}from'glamor';import{errorBehavior}from'@shopgate/engage/core';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables;var styles={wrapper:css({paddingTop:variables.gap.xsmall}).toString(),message:css({fontSize:' 0.75rem'}).toString(),error:css({color:'var(--color-state-alert)'}).toString(),warning:css({color:'var(--color-state-warning)'}).toString(),info:css({color:'var(--color-state-ok)'}).toString()};/**
  * @param {Object} props The component props
  * @returns {JSX}
- */var CheckoutSectionMessages=function CheckoutSectionMessages(_ref){var messages=_ref.messages;if(!Array.isArray(messages)||messages.length===0){return null;}return React.createElement("ul",{className:styles.wrapper},messages.map(function(_ref2){var _classNames;var message=_ref2.message,additionalParams=_ref2.additionalParams,type=_ref2.type;return React.createElement("li",{key:message,className:classNames(styles.message,(_classNames={},_defineProperty(_classNames,styles.error,type==='error'),_defineProperty(_classNames,styles.warning,type==='warning'),_defineProperty(_classNames,styles.info,type==='info'),_classNames))},errorBehavior.getErrorMessage(message,additionalParams));}));};CheckoutSectionMessages.defaultProps={messages:null};export default CheckoutSectionMessages;
+ */var CheckoutSectionMessages=function CheckoutSectionMessages(_ref){var messages=_ref.messages;if(!Array.isArray(messages)||messages.length===0){return null;}return React.createElement("ul",{className:styles.wrapper},messages.map(function(_ref2){var message=_ref2.message,additionalParams=_ref2.additionalParams,type=_ref2.type;return React.createElement("li",{key:message,className:classNames(styles.message,_defineProperty(_defineProperty(_defineProperty({},styles.error,type==='error'),styles.warning,type==='warning'),styles.info,type==='info'))},errorBehavior.getErrorMessage(message,additionalParams));}));};CheckoutSectionMessages.defaultProps={messages:null};export default CheckoutSectionMessages;

package/checkout/components/CheckoutConfirmation/CheckoutConfirmation.js

@@ -3,5 +3,5 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGenera
  * @returns {JSX}
  */var CheckoutConfirmation=function CheckoutConfirmation(_ref){var onContinueShopping=_ref.onContinueShopping,isUserLoggedIn=_ref.isUserLoggedIn,fetchCheckoutOrder=_ref.fetchCheckoutOrder;var _useRoute=useRoute(),order=_useRoute.state.order,query=_useRoute.query;var _useState=useState(null),_useState2=_slicedToArray(_useState,2),orderData=_useState2[0],setOrderData=_useState2[1];// Finding the source of order data.
 // Either from the route state or from a pipeline request.
-useEffect(function(){/** */var handleFetch=/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var data;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:_context.next=2;return fetchCheckoutOrder();case 2:data=_context.sent;setOrderData(data);case 4:case"end":return _context.stop();}}},_callee);}));return function handleFetch(){return _ref2.apply(this,arguments);};}();if(!order){handleFetch();return;}setOrderData(order);},[fetchCheckoutOrder,order,query]);// Map order data to more UI friendly format.
+useEffect(function(){/** */var handleFetch=/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var data;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:_context.next=2;return fetchCheckoutOrder();case 2:data=_context.sent;setOrderData(data);case 4:case"end":return _context.stop();}},_callee);}));return function handleFetch(){return _ref2.apply(this,arguments);};}();if(!order){handleFetch();return;}setOrderData(order);},[fetchCheckoutOrder,order,query]);// Map order data to more UI friendly format.
 var _useMemo=useMemo(function(){if(!orderData){return{};}return{orderNumber:orderData.orderNumber,date:orderData.date,cartItems:convertLineItemsToCartItems(orderData.lineItems),isReserveOnly:isReserveOnlyOrder(orderData),isDirectShipOnly:isDirectShipOnlyOrder(orderData),currencyOverride:orderData.currencyCode};},[orderData]),orderNumber=_useMemo.orderNumber,date=_useMemo.date,cartItems=_useMemo.cartItems,isReserveOnly=_useMemo.isReserveOnly,isDirectShipOnly=_useMemo.isDirectShipOnly,currencyOverride=_useMemo.currencyOverride;if(!orderData||!cartItems){return null;}return React.createElement("div",{className:style.root},React.createElement("div",{className:style.main},React.createElement("div",{className:style.backButtonContainer},React.createElement(ResponsiveBackButton,{label:"checkout.success.continue",onClick:onContinueShopping})),React.createElement("div",{className:style.container},React.createElement("h2",{className:style.heading},i18n.text('checkout.success.title')),React.createElement("p",{className:style.orderNum},i18n.text('checkout.success.order_date',{date:i18n.date(new Date(date).getTime(),'short')}),' | ',i18n.text('checkout.success.order_number',{orderNumber:orderNumber})),React.createElement("div",{className:style.instructions},React.createElement("p",{className:style.body},i18n.text('checkout.success.instructions_1')),React.createElement("p",{className:style.body},i18n.text('checkout.success.instructions_2')))),React.createElement("div",{className:style.cartItems},React.createElement(CartItems,{cartItems:cartItems,onFocus:function onFocus(){},multiLineReservation:true,editable:false,isCheckoutConfirmation:true,isDirectShipOnly:isDirectShipOnly,currencyOverride:currencyOverride})),React.createElement(ResponsiveContainer,{breakpoint:"<md",appAlways:true},React.createElement(CheckoutConfirmationPickUpContact,{order:orderData}),React.createElement(CheckoutConfirmationPickupNotes,{order:orderData}),React.createElement(CheckoutConfirmationShippedTo,{order:orderData}),!isUserLoggedIn&&isReserveOnly?React.createElement(CheckoutConfirmationOrderContact,{order:orderData}):React.createElement(CheckoutConfirmationBilledTo,{order:orderData}),React.createElement(CheckoutConfirmationOrderSummary,{order:orderData}),React.createElement(SupplementalContent,{className:style.supplementalWrapper})),React.createElement("div",{className:style.buttonWrapper},React.createElement(RippleButton,{type:"secondary",disabled:false,className:style.button.toString(),onClick:onContinueShopping},i18n.text('checkout.success.continue')))),React.createElement("div",{className:style.side},React.createElement(ResponsiveContainer,{breakpoint:">=md",webOnly:true},React.createElement(CheckoutConfirmationPickUpContact,{order:orderData}),React.createElement(CheckoutConfirmationPickupNotes,{order:orderData}),React.createElement(CheckoutConfirmationShippedTo,{order:orderData}),!isUserLoggedIn&&isReserveOnly?React.createElement(CheckoutConfirmationOrderContact,{order:orderData}):React.createElement(CheckoutConfirmationBilledTo,{order:orderData}),React.createElement(CheckoutConfirmationOrderSummary,{order:orderData}),React.createElement(SupplementalContent,{className:style.supplementalWrapper}))));};export default hot(connect(CheckoutConfirmation));

package/checkout/components/CheckoutConfirmation/CheckoutConfirmationBilledTo.js

@@ -1,4 +1,4 @@
 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}from'react';import PropTypes from'prop-types';import startCase from'lodash/startCase';import{i18n}from"../../../core/helpers/i18n";import CheckoutConfirmationSection from"./CheckoutConfirmationSection";/**
  * CheckoutConfirmationBilledTo component
  * @returns {JSX}
- */var CheckoutConfirmationBilledTo=function CheckoutConfirmationBilledTo(_ref){var order=_ref.order,className=_ref.className;var content=useMemo(function(){var billing=order.addressSequences.find(function(address){return address.type==='billing';});var firstName=billing.firstName,lastName=billing.lastName,address1=billing.address1,city=billing.city,region=billing.region,postalCode=billing.postalCode;var _ref2=order.paymentTransactions||[{}],_ref3=_slicedToArray(_ref2,1),_ref3$=_ref3[0],payment=_ref3$===void 0?{}:_ref3$;var _payment$paymentInfo=payment.paymentInfo;_payment$paymentInfo=_payment$paymentInfo===void 0?{}:_payment$paymentInfo;var _payment$paymentInfo$=_payment$paymentInfo.card;_payment$paymentInfo$=_payment$paymentInfo$===void 0?{}:_payment$paymentInfo$;var type=_payment$paymentInfo$.type,last4=_payment$paymentInfo$.last4,paymentType=_payment$paymentInfo.type;var hasPayment=order.paymentTransactions&&order.paymentTransactions[0];var address=["".concat(firstName," ").concat(lastName),"".concat(address1||''),"".concat(city?"".concat(city,","):''," ").concat(city&&region?region:''," ").concat(postalCode||'')].filter(Boolean).join('\n');return[].concat(hasPayment&&paymentType==='cc'?[{label:i18n.text('checkout.success.card_holder'),text:address}]:[{label:i18n.text('checkout.success.address'),text:address}],hasPayment&&paymentType==='cc'?[{label:i18n.text('checkout.success.payment_method'),text:"".concat(startCase(type)," **** **** ").concat(last4)}]:[],hasPayment&&paymentType==='paypal'?[{label:i18n.text('checkout.success.payment_method'),text:'PayPal'}]:[]);},[order]);return React.createElement(CheckoutConfirmationSection,{title:"checkout.success.billed_to",content:content,className:className});};CheckoutConfirmationBilledTo.defaultProps={className:null};export default CheckoutConfirmationBilledTo;
+ */var CheckoutConfirmationBilledTo=function CheckoutConfirmationBilledTo(_ref){var order=_ref.order,className=_ref.className;var content=useMemo(function(){var billing=order.addressSequences.find(function(address){return address.type==='billing';});var firstName=billing.firstName,lastName=billing.lastName,address1=billing.address1,city=billing.city,region=billing.region,postalCode=billing.postalCode;var _ref2=order.paymentTransactions||[{}],_ref3=_slicedToArray(_ref2,1),_ref3$=_ref3[0],payment=_ref3$===void 0?{}:_ref3$;var _payment$paymentInfo=payment.paymentInfo,_payment$paymentInfo2=_payment$paymentInfo===void 0?{}:_payment$paymentInfo,_payment$paymentInfo3=_payment$paymentInfo2.card,_payment$paymentInfo4=_payment$paymentInfo3===void 0?{}:_payment$paymentInfo3,type=_payment$paymentInfo4.type,last4=_payment$paymentInfo4.last4,paymentType=_payment$paymentInfo2.type;var hasPayment=order.paymentTransactions&&order.paymentTransactions[0];var address=["".concat(firstName," ").concat(lastName),"".concat(address1||''),"".concat(city?"".concat(city,","):''," ").concat(city&&region?region:''," ").concat(postalCode||'')].filter(Boolean).join('\n');return[].concat(hasPayment&&paymentType==='cc'?[{label:i18n.text('checkout.success.card_holder'),text:address}]:[{label:i18n.text('checkout.success.address'),text:address}],hasPayment&&paymentType==='cc'?[{label:i18n.text('checkout.success.payment_method'),text:"".concat(startCase(type)," **** **** ").concat(last4)}]:[],hasPayment&&paymentType==='paypal'?[{label:i18n.text('checkout.success.payment_method'),text:'PayPal'}]:[]);},[order]);return React.createElement(CheckoutConfirmationSection,{title:"checkout.success.billed_to",content:content,className:className});};CheckoutConfirmationBilledTo.defaultProps={className:null};export default CheckoutConfirmationBilledTo;

package/checkout/components/PaymentMethodButton/PaymentMethodButton.js

@@ -1,4 +1,4 @@
-var _css;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{responsiveMediaQuery}from'@shopgate/engage/styles';import{css}from'glamor';import{useCheckoutContext}from"../../hooks/common";var styles={root:css((_css={outline:'none',border:'1px solid rgba(0, 0, 0, 0.12)',borderRadius:4,background:'#fff',height:52,width:160,display:'flex',flexDirection:'row',justifyContent:'center',alignItems:'center'},_defineProperty(_css,responsiveMediaQuery('xs'),{width:'50%'}),_defineProperty(_css,'&:not(:last-child)',{borderTopRightRadius:0,borderBottomRightRadius:0}),_defineProperty(_css,'&:not(:first-child)',{borderLeft:'none',borderTopLeftRadius:0,borderBottomLeftRadius:0}),_defineProperty(_css,'&:hover',{background:'rgba(0, 0, 0, 0.05)'}),_css)).toString(),active:css({background:'rgba(0, 0, 0, 0.12)','&:hover':{background:'rgba(0, 0, 0, 0.12)'}}).toString()};/**
+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{responsiveMediaQuery}from'@shopgate/engage/styles';import{css}from'glamor';import{useCheckoutContext}from"../../hooks/common";var styles={root:css(_defineProperty(_defineProperty(_defineProperty(_defineProperty({outline:'none',border:'1px solid rgba(0, 0, 0, 0.12)',borderRadius:4,background:'#fff',height:52,width:160,display:'flex',flexDirection:'row',justifyContent:'center',alignItems:'center'},responsiveMediaQuery('xs'),{width:'50%'}),'&:not(:last-child)',{borderTopRightRadius:0,borderBottomRightRadius:0}),'&:not(:first-child)',{borderLeft:'none',borderTopLeftRadius:0,borderBottomLeftRadius:0}),'&:hover',{background:'rgba(0, 0, 0, 0.05)'})).toString(),active:css({background:'rgba(0, 0, 0, 0.12)','&:hover':{background:'rgba(0, 0, 0, 0.12)'}}).toString()};/**
  * Payment Button
  * @param {Object} props Props
  * @returns {JSX}

package/checkout/components/ShippingMethods/ShippingMethods.js

@@ -1,4 +1,4 @@
-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);});};}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;}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{hot}from'react-hot-loader/root';import React,{useCallback,useEffect,useMemo,useState}from'react';import PropTypes from'prop-types';import{css}from'glamor';import classNames from'classnames';import CryptoJs from'crypto-js';import sortBy from'lodash/sortBy';import uniqBy from'lodash/uniqBy';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import{i18n}from'@shopgate/engage/core';import{RadioGroupV2 as RadioGroup,RadioCard,MessageBar}from'@shopgate/engage/components';import{useCheckoutContext}from'@shopgate/engage/checkout/hooks/common';import ShippingMethod from"./ShippingMethod";import connect from"./connector";var variables=themeConfig.variables;var styles={root:css({padding:"0 ".concat(variables.gap.big,"px ").concat(variables.gap.xbig,"px")}).toString(),headline:css({fontSize:'1.25rem',fontWeight:'normal',padding:"0 ".concat(variables.gap.small,"px 0 0"),margin:"0 0 ".concat(variables.gap.small,"px 0"),color:'var(--color-text-high-emphasis)',textTransform:'none'}).toString(),container:css({border:'1px solid #eaeaea',' li:nth-child(2n)':{background:'var(--color-background-accent)'}}).toString(),containerSingle:css({padding:variables.gap.small}).toString(),card:css({display:'flex',alignItems:'center'}).toString(),errorMessage:css({margin:0}).toString(),iOSCard:css({width:'100%',overflow:'hidden',marginBottom:variables.gap.big}).toString()};/**
+import _regeneratorRuntime from"@babel/runtime/regenerator";var _excluded=["serviceLevels"];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);});};}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;}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{hot}from'react-hot-loader/root';import React,{useCallback,useEffect,useMemo,useState}from'react';import PropTypes from'prop-types';import{css}from'glamor';import classNames from'classnames';import CryptoJs from'crypto-js';import sortBy from'lodash/sortBy';import uniqBy from'lodash/uniqBy';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import{i18n}from'@shopgate/engage/core';import{RadioGroupV2 as RadioGroup,RadioCard,MessageBar}from'@shopgate/engage/components';import{useCheckoutContext}from'@shopgate/engage/checkout/hooks/common';import ShippingMethod from"./ShippingMethod";import connect from"./connector";var variables=themeConfig.variables;var styles={root:css({padding:"0 ".concat(variables.gap.big,"px ").concat(variables.gap.xbig,"px")}).toString(),headline:css({fontSize:'1.25rem',fontWeight:'normal',padding:"0 ".concat(variables.gap.small,"px 0 0"),margin:"0 0 ".concat(variables.gap.small,"px 0"),color:'var(--color-text-high-emphasis)',textTransform:'none'}).toString(),container:css({border:'1px solid #eaeaea',' li:nth-child(2n)':{background:'var(--color-background-accent)'}}).toString(),containerSingle:css({padding:variables.gap.small}).toString(),card:css({display:'flex',alignItems:'center'}).toString(),errorMessage:css({margin:0}).toString(),iOSCard:css({width:'100%',overflow:'hidden',marginBottom:variables.gap.big}).toString()};/**
  * Hashes a shipping method
  * @param {Object} method A shipping method
  * @returns {string}
@@ -15,9 +15,9 @@ setSelectedHash(hashShippingMethod(selectedShippingMethod));},[selectedShippingM
    * data handling, we transform the original data structure to the shape which is required for
    * the update request.
    */var shippingMethods=useMemo(function(){// Flat map all service levels of all shipping methods and aggregate with parent (method) data.
-var unsortedLevels=availableShippingMethods.flatMap(function(method){var serviceLevels=method.serviceLevels,methodData=_objectWithoutProperties(method,["serviceLevels"]);return serviceLevels.map(function(serviceLevel){var entry=_extends({},methodData,{serviceLevel:serviceLevel});var hash=hashShippingMethod(entry);return _extends({},entry,{hash:hash});});});// Remove duplicated shipping levels that originated from different shipping methods.
+var unsortedLevels=availableShippingMethods.flatMap(function(method){var serviceLevels=method.serviceLevels,methodData=_objectWithoutProperties(method,_excluded);return serviceLevels.map(function(serviceLevel){var entry=_extends({},methodData,{serviceLevel:serviceLevel});var hash=hashShippingMethod(entry);return _extends({},entry,{hash:hash});});});// Remove duplicated shipping levels that originated from different shipping methods.
 var dedupedLevels=uniqBy(unsortedLevels,function(_ref4){var _serviceLevel$carrier;var serviceLevel=_ref4.serviceLevel;return"".concat(serviceLevel.code,"#").concat((_serviceLevel$carrier=serviceLevel.carrier)===null||_serviceLevel$carrier===void 0?void 0:_serviceLevel$carrier.code);});// Show cheapest service level first followed by alphabetic name.
-return sortBy(dedupedLevels,['serviceLevel.cost','serviceLevel.name']);},[availableShippingMethods]);var onChange=useCallback(/*#__PURE__*/function(){var _ref5=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(event,value){var _shippingMethod$servi,_shippingMethod$servi2,_shippingMethod$servi3;var shippingMethod;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:// Determine the selected shipping method by its hash
+return sortBy(dedupedLevels,['serviceLevel.cost','serviceLevel.name']);},[availableShippingMethods]);var onChange=useCallback(/*#__PURE__*/function(){var _ref5=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(event,value){var _shippingMethod$servi,_shippingMethod$servi2,_shippingMethod$servi3;var shippingMethod;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:// Determine the selected shipping method by its hash
 shippingMethod=shippingMethods.find(function(_ref6){var hash=_ref6.hash;return value===hash;});if(shippingMethod){_context.next=3;break;}return _context.abrupt("return");case 3:// Update the local state
 setSelectedHash(shippingMethod===null||shippingMethod===void 0?void 0:shippingMethod.hash);// Perform the update request
-_context.next=6;return updateShippingMethod({code:shippingMethod===null||shippingMethod===void 0?void 0:shippingMethod.code,serviceLevel:{code:shippingMethod===null||shippingMethod===void 0?void 0:(_shippingMethod$servi=shippingMethod.serviceLevel)===null||_shippingMethod$servi===void 0?void 0:_shippingMethod$servi.code,carrier:{code:shippingMethod===null||shippingMethod===void 0?void 0:(_shippingMethod$servi2=shippingMethod.serviceLevel)===null||_shippingMethod$servi2===void 0?void 0:(_shippingMethod$servi3=_shippingMethod$servi2.carrier)===null||_shippingMethod$servi3===void 0?void 0:_shippingMethod$servi3.code}}});case 6:case"end":return _context.stop();}}},_callee);}));return function(_x,_x2){return _ref5.apply(this,arguments);};}(),[shippingMethods,updateShippingMethod]);if((order===null||order===void 0?void 0:order.status)!=='new'||!orderHasDirectShipItems){return null;}if(shippingMethods.length===0){return React.createElement("div",{className:styles.root},React.createElement("h3",{className:styles.headline},i18n.text('checkout.shippingMethod.title')),React.createElement(MessageBar,{messages:[{type:'error',message:i18n.text("checkout.shippingMethod.errors.".concat(!shippingAddress?'noShippingAddress':'invalidShippingAddress'))}],classNames:{container:styles.errorMessage},showIcons:true}));}return React.createElement("div",{className:styles.root},React.createElement("h3",{className:styles.headline},i18n.text('checkout.shippingMethod.title')),shippingMethods.length===1?React.createElement("div",{className:classNames(styles.container,styles.containerSingle)},React.createElement(ShippingMethod,{shippingMethod:shippingMethods[0]})):React.createElement(RadioGroup,{name:"shipping-methods",value:selectedHash,onChange:onChange,component:"ul",classes:{root:styles.container},disabled:isLoading},shippingMethods.map(function(shippingMethod){return React.createElement(RadioCard,{renderCard:CardComponent,value:shippingMethod.hash,key:shippingMethod.hash},React.createElement(ShippingMethod,{shippingMethod:shippingMethod}));})));};ShippingMethods.defaultProps={orderHasDirectShipItems:false};export default hot(connect(ShippingMethods));
+_context.next=6;return updateShippingMethod({code:shippingMethod===null||shippingMethod===void 0?void 0:shippingMethod.code,serviceLevel:{code:shippingMethod===null||shippingMethod===void 0?void 0:(_shippingMethod$servi=shippingMethod.serviceLevel)===null||_shippingMethod$servi===void 0?void 0:_shippingMethod$servi.code,carrier:{code:shippingMethod===null||shippingMethod===void 0?void 0:(_shippingMethod$servi2=shippingMethod.serviceLevel)===null||_shippingMethod$servi2===void 0?void 0:(_shippingMethod$servi3=_shippingMethod$servi2.carrier)===null||_shippingMethod$servi3===void 0?void 0:_shippingMethod$servi3.code}}});case 6:case"end":return _context.stop();}},_callee);}));return function(_x,_x2){return _ref5.apply(this,arguments);};}(),[shippingMethods,updateShippingMethod]);if((order===null||order===void 0?void 0:order.status)!=='new'||!orderHasDirectShipItems){return null;}if(shippingMethods.length===0){return React.createElement("div",{className:styles.root},React.createElement("h3",{className:styles.headline},i18n.text('checkout.shippingMethod.title')),React.createElement(MessageBar,{messages:[{type:'error',message:i18n.text("checkout.shippingMethod.errors.".concat(!shippingAddress?'noShippingAddress':'invalidShippingAddress'))}],classNames:{container:styles.errorMessage},showIcons:true}));}return React.createElement("div",{className:styles.root},React.createElement("h3",{className:styles.headline},i18n.text('checkout.shippingMethod.title')),shippingMethods.length===1?React.createElement("div",{className:classNames(styles.container,styles.containerSingle)},React.createElement(ShippingMethod,{shippingMethod:shippingMethods[0]})):React.createElement(RadioGroup,{name:"shipping-methods",value:selectedHash,onChange:onChange,component:"ul",classes:{root:styles.container},disabled:isLoading},shippingMethods.map(function(shippingMethod){return React.createElement(RadioCard,{renderCard:CardComponent,value:shippingMethod.hash,key:shippingMethod.hash},React.createElement(ShippingMethod,{shippingMethod:shippingMethod}));})));};ShippingMethods.defaultProps={orderHasDirectShipItems:false};export default hot(connect(ShippingMethods));

package/checkout/paymentMethods/index.js

@@ -13,9 +13,9 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function _extends(){
  */var PaymentMethodProvider=function PaymentMethodProvider(_ref){var order=_ref.order,paymentMethods=_ref.paymentMethods,fetchOrder=_ref.fetchOrder,updateOrder=_ref.updateOrder;var _useState=useState(null),_useState2=_slicedToArray(_useState,2),activePaymentMeta=_useState2[0],setActivePaymentMeta=_useState2[1];var _useContext=useContext(CheckoutContext),setPaymentHandler=_useContext.setPaymentHandler,setPaymentData=_useContext.setPaymentData,needsPayment=_useContext.needsPayment,setButtonLocked=_useContext.setButtonLocked,setLocked=_useContext.setLocked;var paymentMethodRef=useRef();// Set active payment method to the orders first transaction.
 var paymentMethodCode=useMemo(function(){var _order$paymentTransac;var transaction=(_order$paymentTransac=order.paymentTransactions)===null||_order$paymentTransac===void 0?void 0:_order$paymentTransac[0];if(!transaction)return null;return transaction.paymentMethod.code;},[order]);var paymentData=useMemo(function(){return paymentMethods===null||paymentMethods===void 0?void 0:paymentMethods.find(function(p){return p.code===paymentMethodCode;});},[paymentMethodCode,paymentMethods]);var paymentImpl=useMemo(function(){return AVAILABLE_PAYMENT_METHOD.find(function(method){var _paymentData$paymentP;return method.code===(paymentData===null||paymentData===void 0?void 0:(_paymentData$paymentP=paymentData.paymentProvider)===null||_paymentData$paymentP===void 0?void 0:_paymentData$paymentP.code);});},[paymentData]);// Global transaction handler
 // Currently simply redirect fulfill request to the active payment method.
-useEffect(function(){setPaymentHandler({getSupportsRedirect:(paymentImpl===null||paymentImpl===void 0?void 0:paymentImpl.getSupportsRedirect)||function(){return true;},getCustomPayButton:function getCustomPayButton(){return paymentImpl===null||paymentImpl===void 0?void 0:paymentImpl.payButton;},fulfillTransaction:function(){var _fulfillTransaction=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref2){var paymentTransactions,resolved;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:paymentTransactions=_ref2.paymentTransactions;_context.next=3;return paymentMethodRef.current.fulfillTransaction({paymentTransactions:paymentTransactions});case 3:resolved=_context.sent;return _context.abrupt("return",resolved);case 5:case"end":return _context.stop();}}},_callee);}));function fulfillTransaction(_x){return _fulfillTransaction.apply(this,arguments);}return fulfillTransaction;}()});},[paymentImpl,setButtonLocked,setPaymentHandler]);// Map configured payment methods
+useEffect(function(){setPaymentHandler({getSupportsRedirect:(paymentImpl===null||paymentImpl===void 0?void 0:paymentImpl.getSupportsRedirect)||function(){return true;},getCustomPayButton:function getCustomPayButton(){return paymentImpl===null||paymentImpl===void 0?void 0:paymentImpl.payButton;},fulfillTransaction:function(){var _fulfillTransaction=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref2){var paymentTransactions,resolved;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:paymentTransactions=_ref2.paymentTransactions;_context.next=3;return paymentMethodRef.current.fulfillTransaction({paymentTransactions:paymentTransactions});case 3:resolved=_context.sent;return _context.abrupt("return",resolved);case 5:case"end":return _context.stop();}},_callee);}));function fulfillTransaction(_x){return _fulfillTransaction.apply(this,arguments);}return fulfillTransaction;}()});},[paymentImpl,setButtonLocked,setPaymentHandler]);// Map configured payment methods
 var availablePaymentMethods=useMemo(function(){return paymentMethods.map(function(method){return _extends({},AVAILABLE_PAYMENT_METHOD.find(function(m){return m.code===method.paymentProvider.code;}),{internalCode:method.code,settings:method.settings});});},[paymentMethods]);// Change payment method.
-var handleChangePayment=useCallback(/*#__PURE__*/function(){var _ref3=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(code){var meta,_args2=arguments;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1){switch(_context2.prev=_context2.next){case 0:meta=_args2.length>1&&_args2[1]!==undefined?_args2[1]:null;if(!(paymentMethodCode===code)){_context2.next=5;break;}setActivePaymentMeta(meta);setPaymentData({meta:meta});return _context2.abrupt("return");case 5:setLocked(true);_context2.next=8;return updateOrder({paymentTransactions:[{paymentMethod:{code:code}}]});case 8:_context2.next=10;return fetchOrder();case 10:setActivePaymentMeta(meta);setPaymentData({meta:meta});setLocked(false);case 13:case"end":return _context2.stop();}}},_callee2);}));return function(_x2){return _ref3.apply(this,arguments);};}(),[setPaymentData,paymentMethodCode,setLocked,updateOrder,fetchOrder]);// API for the underlying payment methods.
+var handleChangePayment=useCallback(/*#__PURE__*/function(){var _ref3=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(code){var meta,_args2=arguments;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1)switch(_context2.prev=_context2.next){case 0:meta=_args2.length>1&&_args2[1]!==undefined?_args2[1]:null;if(!(paymentMethodCode===code)){_context2.next=5;break;}setActivePaymentMeta(meta);setPaymentData({meta:meta});return _context2.abrupt("return");case 5:setLocked(true);_context2.next=8;return updateOrder({paymentTransactions:[{paymentMethod:{code:code}}]});case 8:_context2.next=10;return fetchOrder();case 10:setActivePaymentMeta(meta);setPaymentData({meta:meta});setLocked(false);case 13:case"end":return _context2.stop();}},_callee2);}));return function(_x2){return _ref3.apply(this,arguments);};}(),[setPaymentData,paymentMethodCode,setLocked,updateOrder,fetchOrder]);// API for the underlying payment methods.
 var paymentMethodApi=useMemo(function(){return{registerPaymentMethod:function registerPaymentMethod(api){setButtonLocked(false);paymentMethodRef.current=api;}};},[setButtonLocked]);// Ignore for ROPIS.
 if(!needsPayment){return null;}// Render the respective payment method provider.
 var _ref4=paymentImpl||{},Provider=_ref4.provider,Content=_ref4.content;return React.createElement(Context.Provider,{value:paymentMethodApi},React.createElement("div",{className:styles.section},React.createElement("h3",{className:styles.headline},i18n.text('checkout.payment.title')),React.createElement("div",{className:styles.buttons},availablePaymentMethods.map(function(method){return React.createElement(method.button,{key:method.internalCode,settings:method.settings,onChange:function onChange(meta){return handleChangePayment(method.internalCode,meta);},active:method.internalCode===paymentMethodCode,activePaymentMeta:activePaymentMeta});})),paymentImpl?React.createElement(Provider,{context:Context,data:paymentData,activePaymentMeta:activePaymentMeta},React.createElement(Content,null)):null));};PaymentMethodProvider.defaultProps={order:null,paymentMethods:null};export default connect(mapStateToProps,mapDispatchToProps)(PaymentMethodProvider);

package/checkout/paymentMethods/paypal/PaypalButtonApp.js

@@ -1,4 +1,4 @@
 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,{useEffect}from'react';import{css}from'glamor';import PropTypes from'prop-types';import{PayPalRiskCheck}from'@shopgate/native-modules';import{useCheckoutContext}from"../../hooks/common";import Button from"../../components/PaymentMethodButton";import paypalLogoUrl from"./paypal_logo.png";var styles={logo:css({width:'60%'}).toString()};/**
  * @param {Object} props The component props
  * @returns {JSX}
- */var PaypalButtonApp=function PaypalButtonApp(props){var settings=props.settings;var _useCheckoutContext=useCheckoutContext(),setLocked=_useCheckoutContext.setLocked;useEffect(function(){if(!settings)return;/** Async handler */var handler=/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:if(!(PayPalRiskCheck===null||PayPalRiskCheck===void 0?void 0:PayPalRiskCheck.setup)){_context.next=10;break;}setLocked(true);_context.prev=2;_context.next=5;return PayPalRiskCheck.setup(settings.env==='sandbox');case 5:_context.next=9;break;case 7:_context.prev=7;_context.t0=_context["catch"](2);case 9:setLocked(false);case 10:case"end":return _context.stop();}}},_callee,null,[[2,7]]);}));return function handler(){return _ref.apply(this,arguments);};}();handler();},[setLocked,settings]);return React.createElement(Button,props,React.createElement("img",{className:styles.logo,src:paypalLogoUrl,alt:"PayPal"}));};PaypalButtonApp.defaultProps={settings:null};export default PaypalButtonApp;
+ */var PaypalButtonApp=function PaypalButtonApp(props){var settings=props.settings;var _useCheckoutContext=useCheckoutContext(),setLocked=_useCheckoutContext.setLocked;useEffect(function(){if(!settings)return;/** Async handler */var handler=/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:if(!(PayPalRiskCheck===null||PayPalRiskCheck===void 0?void 0:PayPalRiskCheck.setup)){_context.next=10;break;}setLocked(true);_context.prev=2;_context.next=5;return PayPalRiskCheck.setup(settings.env==='sandbox');case 5:_context.next=9;break;case 7:_context.prev=7;_context.t0=_context["catch"](2);case 9:setLocked(false);case 10:case"end":return _context.stop();}},_callee,null,[[2,7]]);}));return function handler(){return _ref.apply(this,arguments);};}();handler();},[setLocked,settings]);return React.createElement(Button,props,React.createElement("img",{className:styles.logo,src:paypalLogoUrl,alt:"PayPal"}));};PaypalButtonApp.defaultProps={settings:null};export default PaypalButtonApp;

package/checkout/paymentMethods/paypal/PaypalButtonWeb.js

@@ -3,6 +3,6 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function _slicedToAr
  * @param {Object} props Props
  * @returns {JSX}
  */var PaypalButton=function PaypalButton(_ref){var settings=_ref.settings,_onChange=_ref.onChange,activeFundingSource=_ref.activePaymentMeta,active=_ref.active;var _useCheckoutContext=useCheckoutContext(),setLocked=_useCheckoutContext.setLocked,order=_useCheckoutContext.order;var paypal=usePaypal();// Initialize paypal sdk.
-useEffect(function(){if(!settings||!order)return;/** Async handler */var handler=/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:setLocked(true);_context.prev=1;_context.next=4;return loadWebSdk(settings,order);case 4:_context.next=8;break;case 6:_context.prev=6;_context.t0=_context["catch"](1);case 8:setLocked(false);case 9:case"end":return _context.stop();}}},_callee,null,[[1,6]]);}));return function handler(){return _ref2.apply(this,arguments);};}();handler();},[order,setLocked,settings]);// Create paypal markers (just logic-less logos for each payment method).
+useEffect(function(){if(!settings||!order)return;/** Async handler */var handler=/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:setLocked(true);_context.prev=1;_context.next=4;return loadWebSdk(settings,order);case 4:_context.next=8;break;case 6:_context.prev=6;_context.t0=_context["catch"](1);case 8:setLocked(false);case 9:case"end":return _context.stop();}},_callee,null,[[1,6]]);}));return function handler(){return _ref2.apply(this,arguments);};}();handler();},[order,setLocked,settings]);// Create paypal markers (just logic-less logos for each payment method).
 var marks=useMemo(function(){if(!paypal)return[];return paypal.getFundingSources().map(function(fundingSource){var mark=window.paypal.Marks({fundingSource:fundingSource});if(!mark.isEligible())return null;return[mark,fundingSource];}).filter(function(m){return!!m;});},[paypal]);// Render marks to dom once ready.
 useLayoutEffect(function(){requestAnimationFrame(function(){marks.forEach(function(_ref3,index){var _ref4=_slicedToArray(_ref3,1),mark=_ref4[0];mark.render("#sg-paypal-button-".concat(index));});},[]);},[marks]);return React.createElement(Fragment,null,marks.map(function(_ref5,index){var _ref6=_slicedToArray(_ref5,2),fundingSource=_ref6[1];var isButtonActive=fundingSource===paypal.FUNDING.PAYPAL&&!activeFundingSource?active:active&&fundingSource===activeFundingSource;return React.createElement(Button,{key:fundingSource,onChange:function onChange(){return _onChange(fundingSource);},active:isButtonActive},React.createElement("div",{id:"sg-paypal-button-".concat(index),className:styles.button}));}));};PaypalButton.defaultProps={settings:null,activePaymentMeta:null};export default PaypalButton;

package/checkout/paymentMethods/paypal/PaypalPayButton.js

@@ -8,5 +8,5 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function _extends(){
 var formActions=useRef({});useEffect(function(){formActions.current={onSubmit:onSubmit,onValidate:onValidate};},[onSubmit,onValidate]);// Trigger rendering the paypal button whenever a property changes.
 useLayoutEffect(function(){if(!paypal)return;if(_typeof(fundingSource)==='object')return;if(paypalButton.current){paypalButton.current.close();}var customSettings=getThemeSettings('PayPal')||{};paypalButton.current=paypal.Buttons({fundingSource:fundingSource||paypal.FUNDING.PAYPAL,createOrder:function createOrder(){var _paymentTransactions$;var externalCode=(_paymentTransactions$=paymentTransactions[0])===null||_paymentTransactions$===void 0?void 0:_paymentTransactions$.externalCode;return externalCode;},onInit:function onInit(_,actions){// Here again thanks paypal, there is no way access the actions outside these handlers.
 setPaypalActions(actions);},onClick:function onClick(_,actions){// Trigger manual form validation to comply to paypal standards.
-var isValid=formActions.current.onValidate();if(isValid&&!disabled){return actions.resolve();}return actions.reject();},onApprove:function(){var _onApprove=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(_,actions){var redirect;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:_context.next=2;return formActions.current.onSubmit();case 2:redirect=_context.sent;if(redirect){showModal({type:MODAL_PIPELINE_ERROR,title:null,confirm:null,dismiss:'modal.ok',message:'checkout.errors.paypalFunding'});actions.restart();}case 4:case"end":return _context.stop();}}},_callee);}));function onApprove(_x,_x2){return _onApprove.apply(this,arguments);}return onApprove;}(),style:_extends({label:'pay',color:'white'},customSettings)});paypalButton.current.render(button.current);},[disabled,fundingSource,paymentTransactions,paypal,showModal]);// Sync our internal disabled state with paypals disabled state.
+var isValid=formActions.current.onValidate();if(isValid&&!disabled){return actions.resolve();}return actions.reject();},onApprove:function(){var _onApprove=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(_,actions){var redirect;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:_context.next=2;return formActions.current.onSubmit();case 2:redirect=_context.sent;if(redirect){showModal({type:MODAL_PIPELINE_ERROR,title:null,confirm:null,dismiss:'modal.ok',message:'checkout.errors.paypalFunding'});actions.restart();}case 4:case"end":return _context.stop();}},_callee);}));function onApprove(_x,_x2){return _onApprove.apply(this,arguments);}return onApprove;}(),style:_extends({label:'pay',color:'white'},customSettings)});paypalButton.current.render(button.current);},[disabled,fundingSource,paymentTransactions,paypal,showModal]);// Sync our internal disabled state with paypals disabled state.
 useEffect(function(){if(!paypalActions)return;if(disabled){paypalActions.disable();return;}paypalActions.enable();},[disabled,paypalActions]);if(_typeof(fundingSource)==='object')return null;if(!paypal){return null;}return React.createElement(Fragment,null,React.createElement("h3",{className:styles.headline},i18n.text('checkout.finalizePayment')),React.createElement("div",{ref:button}));};var mapDispatchToProps={showModal:showModal};export default connect(null,mapDispatchToProps)(PaypalPayButton);

package/checkout/paymentMethods/paypal/PaypalProvider.js

@@ -3,4 +3,4 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGenera
  * @return {JSX}
  */var PaypalProvider=function PaypalProvider(_ref){var activeFundingSource=_ref.activePaymentMeta;var _useContext=useContext(PaymentContext),registerPaymentMethod=_useContext.registerPaymentMethod;useEffect(function(){// Register payment method.
 registerPaymentMethod({// Paypal doesn't need to fulfill any transactions.
-fulfillTransaction:function(){var _fulfillTransaction=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref2){var paymentTransactions,_paymentTransactions$,id;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:paymentTransactions=_ref2.paymentTransactions;if(!isAvailable()){_context.next=10;break;}id=paymentTransactions===null||paymentTransactions===void 0?void 0:(_paymentTransactions$=paymentTransactions[0])===null||_paymentTransactions$===void 0?void 0:_paymentTransactions$.id;_context.prev=3;_context.next=6;return PayPalRiskCheck.submit(id);case 6:_context.next=10;break;case 8:_context.prev=8;_context.t0=_context["catch"](3);case 10:return _context.abrupt("return",[]);case 11:case"end":return _context.stop();}}},_callee,null,[[3,8]]);}));function fulfillTransaction(_x){return _fulfillTransaction.apply(this,arguments);}return fulfillTransaction;}()});},[activeFundingSource,registerPaymentMethod]);return null;};PaypalProvider.propTypes={activePaymentMeta:PropTypes.string};PaypalProvider.defaultProps={activePaymentMeta:null};export default PaypalProvider;
+fulfillTransaction:function(){var _fulfillTransaction=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref2){var paymentTransactions,_paymentTransactions$,id;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:paymentTransactions=_ref2.paymentTransactions;if(!isAvailable()){_context.next=10;break;}id=paymentTransactions===null||paymentTransactions===void 0?void 0:(_paymentTransactions$=paymentTransactions[0])===null||_paymentTransactions$===void 0?void 0:_paymentTransactions$.id;_context.prev=3;_context.next=6;return PayPalRiskCheck.submit(id);case 6:_context.next=10;break;case 8:_context.prev=8;_context.t0=_context["catch"](3);case 10:return _context.abrupt("return",[]);case 11:case"end":return _context.stop();}},_callee,null,[[3,8]]);}));function fulfillTransaction(_x){return _fulfillTransaction.apply(this,arguments);}return fulfillTransaction;}()});},[activeFundingSource,registerPaymentMethod]);return null;};PaypalProvider.propTypes={activePaymentMeta:PropTypes.string};PaypalProvider.defaultProps={activePaymentMeta:null};export default PaypalProvider;

package/checkout/paymentMethods/stripe/StripeButton.js

@@ -1,5 +1,5 @@
-import _regeneratorRuntime from"@babel/runtime/regenerator";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 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);});};}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 _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,{useEffect,useState,Fragment}from'react';import PropTypes from'prop-types';import{css}from'glamor';import Button from"../../components/PaymentMethodButton";import{i18n}from"../../../core/helpers/i18n";import{loadSdk}from"./sdk";import{useCheckoutContext}from"../../hooks/common";import connect from"./StripeButton.connector";import googlePayLogo from"./googlepay.png";import applePayLogo from"./applepay.svg";var styles={mark:css({height:32}).toString()};/**
+import _regeneratorRuntime from"@babel/runtime/regenerator";var _excluded=["publishableKey","onChange","active","activePaymentMeta"];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 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);});};}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 _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,{useEffect,useState,Fragment}from'react';import PropTypes from'prop-types';import{css}from'glamor';import Button from"../../components/PaymentMethodButton";import{i18n}from"../../../core/helpers/i18n";import{loadSdk}from"./sdk";import{useCheckoutContext}from"../../hooks/common";import connect from"./StripeButton.connector";import googlePayLogo from"./googlepay.png";import applePayLogo from"./applepay.svg";var styles={mark:css({height:32}).toString()};/**
  * Stripe
  * @param {Object} props Props
  * @returns {JSX}
- */var StripeButton=function StripeButton(_ref){var publishableKey=_ref.publishableKey,_onChange=_ref.onChange,active=_ref.active,subMethod=_ref.activePaymentMeta,props=_objectWithoutProperties(_ref,["publishableKey","onChange","active","activePaymentMeta"]);var _useState=useState(null),_useState2=_slicedToArray(_useState,2),stripeRequest=_useState2[0],setStripeRequest=_useState2[1];var _useState3=useState(null),_useState4=_slicedToArray(_useState3,2),stripeRequestType=_useState4[0],setStripeRequestType=_useState4[1];var _useCheckoutContext=useCheckoutContext(),order=_useCheckoutContext.order;useEffect(function(){if(!publishableKey){return;}/** */var fn=/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var _order$addressSequenc,_order$addressSequenc2;var stripe,req,availability;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:if(order){_context.next=2;break;}return _context.abrupt("return");case 2:_context.next=4;return loadSdk(publishableKey);case 4:stripe=_context.sent;req=stripe.paymentRequest({country:(_order$addressSequenc=order.addressSequences)===null||_order$addressSequenc===void 0?void 0:(_order$addressSequenc2=_order$addressSequenc[0])===null||_order$addressSequenc2===void 0?void 0:_order$addressSequenc2.country,currency:order.currencyCode.toLowerCase(),total:{label:'Checkout',amount:Math.round(order.total*100)}});_context.next=8;return req.canMakePayment();case 8:availability=_context.sent;if(availability){_context.next=11;break;}return _context.abrupt("return");case 11:setStripeRequest(req);setStripeRequestType(availability);case 13:case"end":return _context.stop();}}},_callee);}));return function fn(){return _ref2.apply(this,arguments);};}();fn();},[order,publishableKey]);return React.createElement(Fragment,null,React.createElement(Button,_extends({},props,{onChange:function onChange(){return _onChange(null);},active:active&&!subMethod}),i18n.text('checkout.payment.buttons.stripe')),stripeRequest&&(stripeRequestType===null||stripeRequestType===void 0?void 0:stripeRequestType.applePay)?React.createElement(Button,_extends({},props,{active:!!(active&&subMethod),onChange:function onChange(){return _onChange({stripeRequest:stripeRequest,stripeRequestType:stripeRequestType});}}),React.createElement("img",{className:styles.mark,alt:"ApplePay",src:applePayLogo})):null,stripeRequest&&!(stripeRequestType===null||stripeRequestType===void 0?void 0:stripeRequestType.applePay)?React.createElement(Button,_extends({},props,{active:!!(active&&subMethod),onChange:function onChange(){return _onChange({stripeRequest:stripeRequest,stripeRequestType:stripeRequestType});}}),React.createElement("img",{className:styles.mark,alt:"GooglePay",src:googlePayLogo})):null);};StripeButton.defaultProps={publishableKey:null,activePaymentMeta:null};export default connect(StripeButton);
+ */var StripeButton=function StripeButton(_ref){var publishableKey=_ref.publishableKey,_onChange=_ref.onChange,active=_ref.active,subMethod=_ref.activePaymentMeta,props=_objectWithoutProperties(_ref,_excluded);var _useState=useState(null),_useState2=_slicedToArray(_useState,2),stripeRequest=_useState2[0],setStripeRequest=_useState2[1];var _useState3=useState(null),_useState4=_slicedToArray(_useState3,2),stripeRequestType=_useState4[0],setStripeRequestType=_useState4[1];var _useCheckoutContext=useCheckoutContext(),order=_useCheckoutContext.order;useEffect(function(){if(!publishableKey){return;}/** */var fn=/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var _order$addressSequenc,_order$addressSequenc2;var stripe,req,availability;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:if(order){_context.next=2;break;}return _context.abrupt("return");case 2:_context.next=4;return loadSdk(publishableKey);case 4:stripe=_context.sent;req=stripe.paymentRequest({country:(_order$addressSequenc=order.addressSequences)===null||_order$addressSequenc===void 0?void 0:(_order$addressSequenc2=_order$addressSequenc[0])===null||_order$addressSequenc2===void 0?void 0:_order$addressSequenc2.country,currency:order.currencyCode.toLowerCase(),total:{label:'Checkout',amount:Math.round(order.total*100)}});_context.next=8;return req.canMakePayment();case 8:availability=_context.sent;if(availability){_context.next=11;break;}return _context.abrupt("return");case 11:setStripeRequest(req);setStripeRequestType(availability);case 13:case"end":return _context.stop();}},_callee);}));return function fn(){return _ref2.apply(this,arguments);};}();fn();},[order,publishableKey]);return React.createElement(Fragment,null,React.createElement(Button,_extends({},props,{onChange:function onChange(){return _onChange(null);},active:active&&!subMethod}),i18n.text('checkout.payment.buttons.stripe')),stripeRequest&&(stripeRequestType===null||stripeRequestType===void 0?void 0:stripeRequestType.applePay)?React.createElement(Button,_extends({},props,{active:!!(active&&subMethod),onChange:function onChange(){return _onChange({stripeRequest:stripeRequest,stripeRequestType:stripeRequestType});}}),React.createElement("img",{className:styles.mark,alt:"ApplePay",src:applePayLogo})):null,stripeRequest&&!(stripeRequestType===null||stripeRequestType===void 0?void 0:stripeRequestType.applePay)?React.createElement(Button,_extends({},props,{active:!!(active&&subMethod),onChange:function onChange(){return _onChange({stripeRequest:stripeRequest,stripeRequestType:stripeRequestType});}}),React.createElement("img",{className:styles.mark,alt:"GooglePay",src:googlePayLogo})):null);};StripeButton.defaultProps={publishableKey:null,activePaymentMeta:null};export default connect(StripeButton);

package/checkout/paymentMethods/stripe/StripeCreditCard.js

@@ -1,9 +1,9 @@
-function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{useContext}from'react';import{css}from'glamor';import{themeConfig}from'@shopgate/engage';import{i18n}from'@shopgate/engage/core';import{TextField}from'@shopgate/engage/components';import{getCSSCustomProp}from'@shopgate/engage/styles';import{CardNumberElement,CardCvcElement,CardExpiryElement}from'@stripe/react-stripe-js';import Section from"../../components/Checkout/CheckoutSection";import{useCheckoutContext}from"../../hooks/common";import StripeContext from"./StripeProvider.context";var colors=themeConfig.colors;var styles={root:css({padding:'0 16px',display:'flex',flexDirection:'column',flex:'0 0 auto',' .formElement':{background:"var(--color-background-accent, ".concat(colors.shade8,")"),padding:0,marginBottom:38,borderTopLeftRadius:4,borderTopRightRadius:4,borderBottom:"1px solid ".concat(colors.shade12)},' .formElement label':{color:'var(--color-text-low-emphasis)',paddingLeft:24},' .underline':{marginBottom:0,borderBottom:'none'},' .errorText':{bottom:-20,left:18},' .StripeElement':{paddingLeft:16}}).toString(),secondRow:css({display:'flex',flexDirection:'row'}).toString(),cvc:css({flex:1.5,marginRight:16}).toString(),expiry:css({flex:1}).toString()};/* eslint-disable react/prop-types */ /**
+function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{useContext}from'react';import{css}from'glamor';import{themeConfig}from'@shopgate/engage';import{i18n}from'@shopgate/engage/core';import{TextField}from'@shopgate/engage/components';import{getCSSCustomProp}from'@shopgate/engage/styles';import{CardNumberElement,CardCvcElement,CardExpiryElement}from'@stripe/react-stripe-js';import Section from"../../components/Checkout/CheckoutSection";import{useCheckoutContext}from"../../hooks/common";import StripeContext from"./StripeProvider.context";var colors=themeConfig.colors;var styles={root:css({padding:'0 16px',display:'flex',flexDirection:'column',flex:'0 0 auto',' .formElement':{background:"var(--color-background-accent, ".concat(colors.shade8,")"),padding:0,marginBottom:38,borderTopLeftRadius:4,borderTopRightRadius:4,borderBottom:"1px solid ".concat(colors.shade12)},' .formElement label':{color:'var(--color-text-low-emphasis)',paddingLeft:24},' .underline':{marginBottom:0,borderBottom:'none'},' .errorText':{bottom:-20,left:18},' .StripeElement':{paddingLeft:16}}).toString(),secondRow:css({display:'flex',flexDirection:'row'}).toString(),cvc:css({flex:1.5,marginRight:16}).toString(),expiry:css({flex:1}).toString()};/* eslint-disable react/prop-types */ /**
  * Wrapper
  * @param {Object} Element element
  * @returns {Object}
- */var wrapStripeElement=function wrapStripeElement(Element){var _temp;return _temp=/*#__PURE__*/function(_React$Component){_inherits(_temp,_React$Component);function _temp(){var _getPrototypeOf2;var _this;_classCallCheck(this,_temp);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_possibleConstructorReturn(this,(_getPrototypeOf2=_getPrototypeOf(_temp)).call.apply(_getPrototypeOf2,[this].concat(args)));_defineProperty(_assertThisInitialized(_this),"onChange",function(){_this.props.onChange({target:{value:' '}});});return _this;}_createClass(_temp,[{key:"render",/** Render
-   * @returns {JSX} */value:function render(){return React.createElement(Element,_extends({},this.props,{onChange:this.onChange}));}}]);return _temp;}(React.Component),_temp;};/* eslint-enable react/prop-types */var StripeCardNumberElement=wrapStripeElement(CardNumberElement);var StripeCardCvcElement=wrapStripeElement(CardCvcElement);var StripeCardExpiryElement=wrapStripeElement(CardExpiryElement);/**
+ */var wrapStripeElement=function wrapStripeElement(Element){return(/*#__PURE__*/function(_React$Component){function _class(){var _this2;_classCallCheck(this,_class);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this2=_callSuper(this,_class,[].concat(args));_defineProperty(_this2,"onChange",function(){_this2.props.onChange({target:{value:' '}});});return _this2;}_inherits(_class,_React$Component);return _createClass(_class,[{key:"render",value:/** Render
+   * @returns {JSX} */function render(){return React.createElement(Element,_extends({},this.props,{onChange:this.onChange}));}}]);}(React.Component));};/* eslint-enable react/prop-types */var StripeCardNumberElement=wrapStripeElement(CardNumberElement);var StripeCardCvcElement=wrapStripeElement(CardCvcElement);var StripeCardExpiryElement=wrapStripeElement(CardExpiryElement);/**
  * PickupContactForm
  * @returns {JSX}
  */var StripeCreditCard=function StripeCreditCard(){var _paymentData$meta;var cardRef=React.useRef();var _useContext=useContext(StripeContext),error=_useContext.error,setError=_useContext.setError;var _useCheckoutContext=useCheckoutContext(),needsPayment=_useCheckoutContext.needsPayment,paymentData=_useCheckoutContext.paymentData;// Scrolls to stripe config when error is set.

package/checkout/paymentMethods/stripe/StripeProvider.js

@@ -4,30 +4,30 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function _slicedToAr
  * @param {Object} req  Stripe request.
  * @param {Order} order Order
  * @return {Promise}
- */export var prepareStripeRequestCheckout=function prepareStripeRequestCheckout(stripe,req,order){return new Promise(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(resolve,reject){var availability;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1){switch(_context2.prev=_context2.next){case 0:// Update totals if they updated due to promotions etc.
+ */export var prepareStripeRequestCheckout=function prepareStripeRequestCheckout(stripe,req,order){return new Promise(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(resolve,reject){var availability;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1)switch(_context2.prev=_context2.next){case 0:// Update totals if they updated due to promotions etc.
 req.update({total:{amount:Math.round(order.total*100),label:'Checkout'}});// Recheck availability again.
 _context2.next=3;return req.canMakePayment();case 3:availability=_context2.sent;if(availability){_context2.next=7;break;}reject(availability);return _context2.abrupt("return");case 7:// Handle success
-req.on('paymentmethod',/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(event){return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:resolve(event);case 1:case"end":return _context.stop();}}},_callee);}));return function(_x3){return _ref2.apply(this,arguments);};}());// Handle cancellation
+req.on('paymentmethod',/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(event){return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:resolve(event);case 1:case"end":return _context.stop();}},_callee);}));return function(_x3){return _ref2.apply(this,arguments);};}());// Handle cancellation
 req.on('cancel',function(err){reject(err);});// Show to user
-req.show();case 10:case"end":return _context2.stop();}}},_callee2);}));return function(_x,_x2){return _ref.apply(this,arguments);};}());};/**
+req.show();case 10:case"end":return _context2.stop();}},_callee2);}));return function(_x,_x2){return _ref.apply(this,arguments);};}());};/**
  * Triggers the payment using stripe payment request api.
  * @param {Object} stripe Stripe
  * @param {Object} req Stripe Request
  * @param {Object} order Order
  * @param {Object} activeTransaction Active request
  * @returns {Promise}
- */var triggerStripeRequest=/*#__PURE__*/function(){var _ref3=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(stripe,req,order,activeTransaction){var _activeTransaction$ch;var event,intent,result,step;return _regeneratorRuntime.wrap(function _callee3$(_context3){while(1){switch(_context3.prev=_context3.next){case 0:// Create checkout event on stripe.
+ */var triggerStripeRequest=/*#__PURE__*/function(){var _ref3=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(stripe,req,order,activeTransaction){var _activeTransaction$ch;var event,intent,result,step;return _regeneratorRuntime.wrap(function _callee3$(_context3){while(1)switch(_context3.prev=_context3.next){case 0:// Create checkout event on stripe.
 // For apple pay the event is already created beforehands
 // This is due to safaris limitation that the `show` needs
 // to happen directly inside a gesture handler (click, ..)
 event=req.preparedEvent;if(event){_context3.next=5;break;}_context3.next=4;return prepareStripeRequestCheckout(stripe,req,order);case 4:event=_context3.sent;case 5:// Send over to stripe and let it validate.
-intent=activeTransaction===null||activeTransaction===void 0?void 0:(_activeTransaction$ch=activeTransaction.checkoutParams)===null||_activeTransaction$ch===void 0?void 0:_activeTransaction$ch.paymentIntent;/* eslint-disable camelcase */_context3.next=8;return stripe.confirmCardPayment(intent,{payment_method:event.paymentMethod.id},{handleActions:false});case 8:result=_context3.sent;if(!result.error){_context3.next=12;break;}event.complete('fail');throw result.error;case 12:event.complete('success');if(!(result.paymentIntent.status==='requires_action')){_context3.next=20;break;}_context3.next=16;return stripe.confirmCardPayment(intent);case 16:step=_context3.sent;if(!step.error){_context3.next=19;break;}throw step.error;case 19:return _context3.abrupt("return",step);case 20:return _context3.abrupt("return",result);case 21:case"end":return _context3.stop();}}},_callee3);}));return function triggerStripeRequest(_x4,_x5,_x6,_x7){return _ref3.apply(this,arguments);};}();/**
+intent=activeTransaction===null||activeTransaction===void 0?void 0:(_activeTransaction$ch=activeTransaction.checkoutParams)===null||_activeTransaction$ch===void 0?void 0:_activeTransaction$ch.paymentIntent;/* eslint-disable camelcase */_context3.next=8;return stripe.confirmCardPayment(intent,{payment_method:event.paymentMethod.id},{handleActions:false});case 8:result=_context3.sent;if(!result.error){_context3.next=12;break;}event.complete('fail');throw result.error;case 12:event.complete('success');if(!(result.paymentIntent.status==='requires_action')){_context3.next=20;break;}_context3.next=16;return stripe.confirmCardPayment(intent);case 16:step=_context3.sent;if(!step.error){_context3.next=19;break;}throw step.error;case 19:return _context3.abrupt("return",step);case 20:return _context3.abrupt("return",result);case 21:case"end":return _context3.stop();}},_callee3);}));return function triggerStripeRequest(_x4,_x5,_x6,_x7){return _ref3.apply(this,arguments);};}();/**
  * A Provider that is needed for all stripe based
  * @param {Object} props The components props.
  * @returns {JSX}
- */var StripeProvider=function StripeProvider(_ref4){var children=_ref4.children;var _React$useState=React.useState(null),_React$useState2=_slicedToArray(_React$useState,2),error=_React$useState2[0],setError=_React$useState2[1];var _useCheckoutContext=useCheckoutContext(),order=_useCheckoutContext.order,paymentData=_useCheckoutContext.paymentData;var stripe=useStripe();var elements=useElements();var contextApi=React.useMemo(function(){return{error:error,setError:setError,fulfillTransaction:function(){var _fulfillTransaction=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(_ref5){var _activeTransaction$ch2;var paymentTransactions,activeTransaction,_ref6,_paymentIntent,_ref7,incomingError,paymentIntent;return _regeneratorRuntime.wrap(function _callee4$(_context4){while(1){switch(_context4.prev=_context4.next){case 0:paymentTransactions=_ref5.paymentTransactions;// Make sure api responded with a new payment transaction.
-activeTransaction=paymentTransactions[0];if(activeTransaction===null||activeTransaction===void 0?void 0:(_activeTransaction$ch2=activeTransaction.checkoutParams)===null||_activeTransaction$ch2===void 0?void 0:_activeTransaction$ch2.paymentIntent){_context4.next=5;break;}setError(i18n.text('checkout.errors.noPaymentTransaction'));return _context4.abrupt("return",false);case 5:if(!((paymentData===null||paymentData===void 0?void 0:paymentData.meta)&&(paymentData===null||paymentData===void 0?void 0:paymentData.meta.stripeRequest))){_context4.next=17;break;}_context4.prev=6;_context4.next=9;return triggerStripeRequest(stripe,paymentData.meta.stripeRequest,order,activeTransaction);case 9:_ref6=_context4.sent;_paymentIntent=_ref6.paymentIntent;return _context4.abrupt("return",[{id:activeTransaction.id,checkoutParams:{paymentIntentId:_paymentIntent.id}}]);case 14:_context4.prev=14;_context4.t0=_context4["catch"](6);return _context4.abrupt("return",false);case 17:_context4.next=19;return stripe.confirmCardPayment(activeTransaction.checkoutParams.paymentIntent,{/* eslint-disable-next-line camelcase */payment_method:{card:elements.getElement(CardNumberElement)}});case 19:_ref7=_context4.sent;incomingError=_ref7.error;paymentIntent=_ref7.paymentIntent;if(!incomingError){_context4.next=26;break;}console.error(incomingError,activeTransaction.checkoutParams.paymentIntent);setError(incomingError.message);return _context4.abrupt("return",false);case 26:return _context4.abrupt("return",[{id:activeTransaction.id,checkoutParams:{paymentIntentId:paymentIntent.id}}]);case 27:case"end":return _context4.stop();}}},_callee4,null,[[6,14]]);}));function fulfillTransaction(_x8){return _fulfillTransaction.apply(this,arguments);}return fulfillTransaction;}()};},[elements,error,order,paymentData,stripe]);var _useContext=useContext(PaymentContext),registerPaymentMethod=_useContext.registerPaymentMethod;useEffect(function(){registerPaymentMethod(contextApi);},[contextApi,registerPaymentMethod]);return React.createElement(Context.Provider,{value:contextApi},children);};/**
+ */var StripeProvider=function StripeProvider(_ref4){var children=_ref4.children;var _React$useState=React.useState(null),_React$useState2=_slicedToArray(_React$useState,2),error=_React$useState2[0],setError=_React$useState2[1];var _useCheckoutContext=useCheckoutContext(),order=_useCheckoutContext.order,paymentData=_useCheckoutContext.paymentData;var stripe=useStripe();var elements=useElements();var contextApi=React.useMemo(function(){return{error:error,setError:setError,fulfillTransaction:function(){var _fulfillTransaction=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(_ref5){var _activeTransaction$ch2;var paymentTransactions,activeTransaction,_ref7,_paymentIntent,_ref8,incomingError,paymentIntent;return _regeneratorRuntime.wrap(function _callee4$(_context4){while(1)switch(_context4.prev=_context4.next){case 0:paymentTransactions=_ref5.paymentTransactions;// Make sure api responded with a new payment transaction.
+activeTransaction=paymentTransactions[0];if(activeTransaction===null||activeTransaction===void 0?void 0:(_activeTransaction$ch2=activeTransaction.checkoutParams)===null||_activeTransaction$ch2===void 0?void 0:_activeTransaction$ch2.paymentIntent){_context4.next=5;break;}setError(i18n.text('checkout.errors.noPaymentTransaction'));return _context4.abrupt("return",false);case 5:if(!((paymentData===null||paymentData===void 0?void 0:paymentData.meta)&&(paymentData===null||paymentData===void 0?void 0:paymentData.meta.stripeRequest))){_context4.next=17;break;}_context4.prev=6;_context4.next=9;return triggerStripeRequest(stripe,paymentData.meta.stripeRequest,order,activeTransaction);case 9:_ref7=_context4.sent;_paymentIntent=_ref7.paymentIntent;return _context4.abrupt("return",[{id:activeTransaction.id,checkoutParams:{paymentIntentId:_paymentIntent.id}}]);case 14:_context4.prev=14;_context4.t0=_context4["catch"](6);return _context4.abrupt("return",false);case 17:_context4.next=19;return stripe.confirmCardPayment(activeTransaction.checkoutParams.paymentIntent,{/* eslint-disable-next-line camelcase */payment_method:{card:elements.getElement(CardNumberElement)}});case 19:_ref8=_context4.sent;incomingError=_ref8.error;paymentIntent=_ref8.paymentIntent;if(!incomingError){_context4.next=26;break;}console.error(incomingError,activeTransaction.checkoutParams.paymentIntent);setError(incomingError.message);return _context4.abrupt("return",false);case 26:return _context4.abrupt("return",[{id:activeTransaction.id,checkoutParams:{paymentIntentId:paymentIntent.id}}]);case 27:case"end":return _context4.stop();}},_callee4,null,[[6,14]]);}));function fulfillTransaction(_x8){return _fulfillTransaction.apply(this,arguments);}return fulfillTransaction;}()};},[elements,error,order,paymentData,stripe]);var _useContext=useContext(PaymentContext),registerPaymentMethod=_useContext.registerPaymentMethod;useEffect(function(){registerPaymentMethod(contextApi);},[contextApi,registerPaymentMethod]);return React.createElement(Context.Provider,{value:contextApi},children);};/**
  * A Provider that is needed for all stripe based
  * @param {Object} props The components props.
  * @returns {JSX}
- */var StripeProviderWrapper=function StripeProviderWrapper(_ref8){var publishableKey=_ref8.publishableKey,children=_ref8.children;React.useEffect(function(){if(!publishableKey){return;}loadSdk(publishableKey);},[publishableKey]);return React.createElement(Elements,{stripe:stripePromise},React.createElement(StripeProvider,null,children));};StripeProviderWrapper.defaultProps={publishableKey:null};export default connect(StripeProviderWrapper);
+ */var StripeProviderWrapper=function StripeProviderWrapper(_ref9){var publishableKey=_ref9.publishableKey,children=_ref9.children;React.useEffect(function(){if(!publishableKey){return;}loadSdk(publishableKey);},[publishableKey]);return React.createElement(Elements,{stripe:stripePromise},React.createElement(StripeProvider,null,children));};StripeProviderWrapper.defaultProps={publishableKey:null};export default connect(StripeProviderWrapper);

package/checkout/paymentMethods/stripe/sdk.js

@@ -2,7 +2,7 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGenera
  * Loads the stripe sdk
  * @param {string} publishableKey The publishable stripe key.
  * @returns {Stripe}
- */export var loadSdk=function loadSdk(publishableKey){if(loaded){return promise;}loaded=true;/** */var fn=/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var stripeObject;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:_context.prev=0;_context.next=3;return loadStripe(publishableKey);case 3:stripeObject=_context.sent;stripe=stripeObject;resolve(stripeObject);return _context.abrupt("return",stripeObject);case 9:_context.prev=9;_context.t0=_context["catch"](0);reject(_context.t0);throw _context.t0;case 13:case"end":return _context.stop();}}},_callee,null,[[0,9]]);}));return function fn(){return _ref.apply(this,arguments);};}();return fn();};/**
+ */export var loadSdk=function loadSdk(publishableKey){if(loaded){return promise;}loaded=true;/** */var fn=/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var stripeObject;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:_context.prev=0;_context.next=3;return loadStripe(publishableKey);case 3:stripeObject=_context.sent;stripe=stripeObject;resolve(stripeObject);return _context.abrupt("return",stripeObject);case 9:_context.prev=9;_context.t0=_context["catch"](0);reject(_context.t0);throw _context.t0;case 13:case"end":return _context.stop();}},_callee,null,[[0,9]]);}));return function fn(){return _ref.apply(this,arguments);};}();return fn();};/**
  * Returns the sdk
  * @returns {Object}
  * */export var getSdk=function getSdk(){return stripe;};

package/checkout/providers/AddressBookProvider.js

@@ -8,4 +8,4 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function _extends(){
  */var AddressBookProvider=function AddressBookProvider(_ref){var children=_ref.children,order=_ref.order,billingAddress=_ref.billingAddress,shippingAddress=_ref.shippingAddress,updateCheckoutOrder=_ref.updateCheckoutOrder,fetchCheckoutOrder=_ref.fetchCheckoutOrder,historyPopToRoute=_ref.historyPopToRoute,isPickupContactEnabled=_ref.isPickupContactEnabled;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),isLoading=_useState2[0],setLoading=_useState2[1];var _useRoute=useRoute(),pathname=_useRoute.pathname,routeId=_useRoute.id,_useRoute$params$type=_useRoute.params.type,type=_useRoute$params$type===void 0?ADDRESS_TYPE_BILLING:_useRoute$params$type;var popToCheckout=useCallback(function(){historyPopToRoute({pattern:CHECKOUT_PATTERN,routeId:routeId});},[historyPopToRoute,routeId]);/**
    * @param {Array} addressSequences Address sequences
    * @returns {Array}
-   */var createAddressSequenceIndexes=function createAddressSequenceIndexes(addressSequences){var primaryBillToAddressSequenceIndex=addressSequences.findIndex(function(address){return address.type==='billing';});var primaryShipToAddressSequenceIndex=addressSequences.findIndex(function(address){return address.type==='shipping'||address.type==='pickup';});primaryBillToAddressSequenceIndex=primaryBillToAddressSequenceIndex!==-1?primaryBillToAddressSequenceIndex:undefined;primaryShipToAddressSequenceIndex=primaryShipToAddressSequenceIndex!==-1?primaryShipToAddressSequenceIndex:undefined;return{primaryBillToAddressSequenceIndex:primaryBillToAddressSequenceIndex,primaryShipToAddressSequenceIndex:primaryShipToAddressSequenceIndex};};var updateOrderWithContact=useCallback(/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(contactId){var gotoCheckout,addressSequences,billingFromSequence,_args=arguments;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:gotoCheckout=_args.length>1&&_args[1]!==undefined?_args[1]:true;setLoading(true);_context.prev=2;addressSequences=[];if(type===ADDRESS_TYPE_BILLING){addressSequences.push({customerContactId:contactId,type:'billing'});}else if(billingAddress){addressSequences.push({customerContactId:billingAddress.customerContactId,type:'billing'});}if(type===ADDRESS_TYPE_SHIPPING){addressSequences.push({customerContactId:contactId,type:'shipping'});}else if(shippingAddress){addressSequences.push({customerContactId:shippingAddress.customerContactId,type:'shipping'});}billingFromSequence=addressSequences.find(function(address){return address.type==='billing';});if(billingFromSequence&&isPickupContactEnabled){addressSequences.push({customerContactId:billingFromSequence.customerContactId,type:'pickup'});}_context.next=10;return updateCheckoutOrder(_extends({addressSequences:addressSequences},createAddressSequenceIndexes(addressSequences)));case 10:if(gotoCheckout){popToCheckout();}_context.next=15;break;case 13:_context.prev=13;_context.t0=_context["catch"](2);case 15:setLoading(false);case 16:case"end":return _context.stop();}}},_callee,null,[[2,13]]);}));return function(_x){return _ref2.apply(this,arguments);};}(),[billingAddress,isPickupContactEnabled,popToCheckout,shippingAddress,type,updateCheckoutOrder]);var deleteContactFromOrder=useCallback(/*#__PURE__*/function(){var _ref3=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(contactId){var addressSequences;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1){switch(_context2.prev=_context2.next){case 0:if(Array.isArray(order===null||order===void 0?void 0:order.addressSequences)){_context2.next=2;break;}return _context2.abrupt("return");case 2:addressSequences=order.addressSequences.reduce(function(acc,_ref4){var customerContactId=_ref4.customerContactId,addressType=_ref4.type;if(customerContactId!==contactId){acc.push({type:addressType,customerContactId:customerContactId});}return acc;},[]);_context2.prev=3;_context2.next=6;return updateCheckoutOrder(_extends({addressSequences:addressSequences},createAddressSequenceIndexes(addressSequences)));case 6:_context2.next=10;break;case 8:_context2.prev=8;_context2.t0=_context2["catch"](3);case 10:case"end":return _context2.stop();}}},_callee2,null,[[3,8]]);}));return function(_x2){return _ref3.apply(this,arguments);};}(),[order,updateCheckoutOrder]);useEffect(function(){if(isLoading){LoadingProvider.setLoading(pathname);}else{LoadingProvider.resetLoading(pathname);}return function(){LoadingProvider.resetLoading(pathname);};},[isLoading,pathname]);useEffect(function(){if(!order){fetchCheckoutOrder();}},[fetchCheckoutOrder,order]);var value=useMemo(function(){return{isCheckout:true,updateOrderWithContact:updateOrderWithContact,deleteContactFromOrder:deleteContactFromOrder,popToCheckout:popToCheckout,type:type};},[updateOrderWithContact,deleteContactFromOrder,popToCheckout,type]);return React.createElement(Context.Provider,{value:value},children);};AddressBookProvider.defaultProps={children:null,order:null,billingAddress:null,shippingAddress:null};export default connect(makeMapStateToProp,mapDispatchToProps)(AddressBookProvider);
+   */var createAddressSequenceIndexes=function createAddressSequenceIndexes(addressSequences){var primaryBillToAddressSequenceIndex=addressSequences.findIndex(function(address){return address.type==='billing';});var primaryShipToAddressSequenceIndex=addressSequences.findIndex(function(address){return address.type==='shipping'||address.type==='pickup';});primaryBillToAddressSequenceIndex=primaryBillToAddressSequenceIndex!==-1?primaryBillToAddressSequenceIndex:undefined;primaryShipToAddressSequenceIndex=primaryShipToAddressSequenceIndex!==-1?primaryShipToAddressSequenceIndex:undefined;return{primaryBillToAddressSequenceIndex:primaryBillToAddressSequenceIndex,primaryShipToAddressSequenceIndex:primaryShipToAddressSequenceIndex};};var updateOrderWithContact=useCallback(/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(contactId){var gotoCheckout,addressSequences,billingFromSequence,_args=arguments;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:gotoCheckout=_args.length>1&&_args[1]!==undefined?_args[1]:true;setLoading(true);_context.prev=2;addressSequences=[];if(type===ADDRESS_TYPE_BILLING){addressSequences.push({customerContactId:contactId,type:'billing'});}else if(billingAddress){addressSequences.push({customerContactId:billingAddress.customerContactId,type:'billing'});}if(type===ADDRESS_TYPE_SHIPPING){addressSequences.push({customerContactId:contactId,type:'shipping'});}else if(shippingAddress){addressSequences.push({customerContactId:shippingAddress.customerContactId,type:'shipping'});}billingFromSequence=addressSequences.find(function(address){return address.type==='billing';});if(billingFromSequence&&isPickupContactEnabled){addressSequences.push({customerContactId:billingFromSequence.customerContactId,type:'pickup'});}_context.next=10;return updateCheckoutOrder(_extends({addressSequences:addressSequences},createAddressSequenceIndexes(addressSequences)));case 10:if(gotoCheckout){popToCheckout();}_context.next=15;break;case 13:_context.prev=13;_context.t0=_context["catch"](2);case 15:setLoading(false);case 16:case"end":return _context.stop();}},_callee,null,[[2,13]]);}));return function(_x){return _ref2.apply(this,arguments);};}(),[billingAddress,isPickupContactEnabled,popToCheckout,shippingAddress,type,updateCheckoutOrder]);var deleteContactFromOrder=useCallback(/*#__PURE__*/function(){var _ref3=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(contactId){var addressSequences;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1)switch(_context2.prev=_context2.next){case 0:if(Array.isArray(order===null||order===void 0?void 0:order.addressSequences)){_context2.next=2;break;}return _context2.abrupt("return");case 2:addressSequences=order.addressSequences.reduce(function(acc,_ref4){var customerContactId=_ref4.customerContactId,addressType=_ref4.type;if(customerContactId!==contactId){acc.push({type:addressType,customerContactId:customerContactId});}return acc;},[]);_context2.prev=3;_context2.next=6;return updateCheckoutOrder(_extends({addressSequences:addressSequences},createAddressSequenceIndexes(addressSequences)));case 6:_context2.next=10;break;case 8:_context2.prev=8;_context2.t0=_context2["catch"](3);case 10:case"end":return _context2.stop();}},_callee2,null,[[3,8]]);}));return function(_x2){return _ref3.apply(this,arguments);};}(),[order,updateCheckoutOrder]);useEffect(function(){if(isLoading){LoadingProvider.setLoading(pathname);}else{LoadingProvider.resetLoading(pathname);}return function(){LoadingProvider.resetLoading(pathname);};},[isLoading,pathname]);useEffect(function(){if(!order){fetchCheckoutOrder();}},[fetchCheckoutOrder,order]);var value=useMemo(function(){return{isCheckout:true,updateOrderWithContact:updateOrderWithContact,deleteContactFromOrder:deleteContactFromOrder,popToCheckout:popToCheckout,type:type};},[updateOrderWithContact,deleteContactFromOrder,popToCheckout,type]);return React.createElement(Context.Provider,{value:value},children);};AddressBookProvider.defaultProps={children:null,order:null,billingAddress:null,shippingAddress:null};export default connect(makeMapStateToProp,mapDispatchToProps)(AddressBookProvider);

package/checkout/providers/CheckoutProvider.js

@@ -6,23 +6,23 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGenera
  * Checkout Provider
  * @returns {JSX}
  */var CheckoutProvider=function CheckoutProvider(_ref){var pathPattern=_ref.pathPattern,orderInitialized=_ref.orderInitialized,orderReadOnly=_ref.orderReadOnly,historyReplace=_ref.historyReplace,prepareCheckout=_ref.prepareCheckout,fetchCheckoutOrder=_ref.fetchCheckoutOrder,updateCheckoutOrder=_ref.updateCheckoutOrder,submitCheckoutOrder=_ref.submitCheckoutOrder,showModal=_ref.showModal,children=_ref.children,shopSettings=_ref.shopSettings,billingAddress=_ref.billingAddress,shippingAddress=_ref.shippingAddress,pickupAddress=_ref.pickupAddress,paymentTransactions=_ref.paymentTransactions,fetchCart=_ref.fetchCart,taxLines=_ref.taxLines,userLocation=_ref.userLocation,isDataReady=_ref.isDataReady,fulfillmentSlot=_ref.fulfillmentSlot,orderReserveOnly=_ref.orderReserveOnly,isShippingAddressSelectionEnabled=_ref.isShippingAddressSelectionEnabled,isPickupContactSelectionEnabled=_ref.isPickupContactSelectionEnabled,isGuestCheckout=_ref.isGuestCheckout,campaignAttribution=_ref.campaignAttribution,clearCheckoutCampaign=_ref.clearCheckoutCampaign,checkoutOrder=_ref.order;var _React$useState=React.useState(null),_React$useState2=_slicedToArray(_React$useState,2),paymentButton=_React$useState2[0],setPaymentButton=_React$useState2[1];var paymentHandlerRef=React.useRef(null);var _React$useState3=React.useState(null),_React$useState4=_slicedToArray(_React$useState3,2),paymentData=_React$useState4[0],setPaymentData=_React$useState4[1];var _React$useState5=React.useState(true),_React$useState6=_slicedToArray(_React$useState5,2),isLocked=_React$useState6[0],setLocked=_React$useState6[1];var _React$useState7=React.useState(true),_React$useState8=_slicedToArray(_React$useState7,2),isButtonLocked=_React$useState8[0],setButtonLocked=_React$useState8[1];var _React$useState9=React.useState(true),_React$useState10=_slicedToArray(_React$useState9,2),isLoading=_React$useState10[0],setLoading=_React$useState10[1];var _React$useState11=React.useState(selfPickupConstraints),_React$useState12=_slicedToArray(_React$useState11,2),validationRules=_React$useState12[0],setValidationRules=_React$useState12[1];var _React$useState13=React.useState(false),_React$useState14=_slicedToArray(_React$useState13,2),updateOptIns=_React$useState14[0],_setUpdateOptIns=_React$useState14[1];var defaultOptInFormState=_extends({},initialOptInFormState);var optInFormState=useFormState(defaultOptInFormState,function(){});// Initialize checkout process.
-var _useAsyncMemo=useAsyncMemo(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var _ref3,needsPaymentCheckout,success;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:_context.prev=0;_context.next=3;return prepareCheckout({initializeOrder:!orderInitialized});case 3:_ref3=_context.sent;needsPaymentCheckout=_ref3.needsPayment;success=_ref3.success;setLocked(false);return _context.abrupt("return",{isCheckoutInitialized:success,needsPayment:needsPaymentCheckout});case 10:_context.prev=10;_context.t0=_context["catch"](0);return _context.abrupt("return",{isCheckoutInitialized:false,needsPayment:false});case 13:case"end":return _context.stop();}}},_callee,null,[[0,10]]);})),[],false),_useAsyncMemo2=_slicedToArray(_useAsyncMemo,1),_useAsyncMemo2$=_useAsyncMemo2[0],isCheckoutInitialized=_useAsyncMemo2$.isCheckoutInitialized,needsPayment=_useAsyncMemo2$.needsPayment;// Handle passed errors from external checkout gateway.
+var _useAsyncMemo=useAsyncMemo(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var _ref4,needsPaymentCheckout,success;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:_context.prev=0;_context.next=3;return prepareCheckout({initializeOrder:!orderInitialized});case 3:_ref4=_context.sent;needsPaymentCheckout=_ref4.needsPayment;success=_ref4.success;setLocked(false);return _context.abrupt("return",{isCheckoutInitialized:success,needsPayment:needsPaymentCheckout});case 10:_context.prev=10;_context.t0=_context["catch"](0);return _context.abrupt("return",{isCheckoutInitialized:false,needsPayment:false});case 13:case"end":return _context.stop();}},_callee,null,[[0,10]]);})),[],false),_useAsyncMemo2=_slicedToArray(_useAsyncMemo,1),_useAsyncMemo2$=_useAsyncMemo2[0],isCheckoutInitialized=_useAsyncMemo2$.isCheckoutInitialized,needsPayment=_useAsyncMemo2$.needsPayment;// Handle passed errors from external checkout gateway.
 React.useEffect(function(){var urlParams=new URLSearchParams(window.location.search);var errorCode=urlParams.get('errorCode');if(!errorCode){return;}showModal({title:null,confirm:null,dismiss:'modal.ok',message:'checkout.errors.payment.genericExternal'});},[showModal]);var submitPromise=React.useRef(null);// Handles submit of the checkout form.
-var handleSubmitOrder=React.useCallback(/*#__PURE__*/function(){var _ref4=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(values){var _submitPromise$curren,_submitPromise$curren2,_submitPromise$curren3,_submitPromise$curren4,fulfilledPaymentTransactions,_submitPromise$curren5,_submitPromise$curren6,marketingOptIn,_ref5,paymentTransactionResults,redirectNeeded,_paymentHandlerRef$cu,_submitPromise$curren9,_submitPromise$curren10,_paymentTransactionRe,url,_submitPromise$curren7,_submitPromise$curren8,redirectWanted,_paymentHandlerRef$cu2,_submitPromise$curren11,_submitPromise$curren12,_ref6,_ref7,order;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1){switch(_context2.prev=_context2.next){case 0:setLocked(true);// Update order to set pickup contact.
+var handleSubmitOrder=React.useCallback(/*#__PURE__*/function(){var _ref5=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(values){var _submitPromise$curren,_submitPromise$curren2,_submitPromise$curren3,_submitPromise$curren4,fulfilledPaymentTransactions,_submitPromise$curren5,_submitPromise$curren6,marketingOptIn,_ref7,paymentTransactionResults,redirectNeeded,_paymentHandlerRef$cu,_submitPromise$curren9,_submitPromise$curren10,_paymentTransactionRe3,_paymentTransactionRe4,url,_submitPromise$curren7,_submitPromise$curren8,redirectWanted,_paymentHandlerRef$cu2,_submitPromise$curren11,_submitPromise$curren12,_ref8,_ref9,order;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1)switch(_context2.prev=_context2.next){case 0:setLocked(true);// Update order to set pickup contact.
 if(orderReadOnly){_context2.next=14;break;}_context2.prev=2;_context2.next=5;return updateCheckoutOrder({notes:values.instructions,addressSequences:[_extends({},billingAddress,{customerContactId:billingAddress.customerContactId||undefined})].concat(isShippingAddressSelectionEnabled?_extends({},shippingAddress,{customerContactId:shippingAddress.customerContactId||undefined}):[],isPickupContactSelectionEnabled?_extends({},values.pickupPerson==='me'?_extends({},billingAddress,{customerContactId:billingAddress.customerContactId||undefined,type:'pickup'}):{type:'pickup',firstName:values.firstName,lastName:values.lastName,mobile:values.mobile,emailAddress:values.emailAddress}):[]),primaryBillToAddressSequenceIndex:0,primaryShipToAddressSequenceIndex:1});case 5:_context2.next=12;break;case 7:_context2.prev=7;_context2.t0=_context2["catch"](2);setLocked(false);submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren=submitPromise.current)===null||_submitPromise$curren===void 0?void 0:(_submitPromise$curren2=_submitPromise$curren.resolve)===null||_submitPromise$curren2===void 0?void 0:_submitPromise$curren2.call(_submitPromise$curren);return _context2.abrupt("return");case 12:_context2.next=25;break;case 14:if(!(isGuestCheckout&&isPickupContactSelectionEnabled&&values.instructions)){_context2.next=25;break;}_context2.prev=15;_context2.next=18;return updateCheckoutOrder({notes:values.instructions});case 18:_context2.next=25;break;case 20:_context2.prev=20;_context2.t1=_context2["catch"](15);setLocked(false);submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren3=submitPromise.current)===null||_submitPromise$curren3===void 0?void 0:(_submitPromise$curren4=_submitPromise$curren3.resolve)===null||_submitPromise$curren4===void 0?void 0:_submitPromise$curren4.call(_submitPromise$curren3);return _context2.abrupt("return");case 25:// Fulfill using selected payment method.
-fulfilledPaymentTransactions=[];if(!needsPayment){_context2.next=34;break;}_context2.next=29;return paymentHandlerRef.current.fulfillTransaction({paymentTransactions:paymentTransactions});case 29:fulfilledPaymentTransactions=_context2.sent;if(fulfilledPaymentTransactions){_context2.next=34;break;}setLocked(false);submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren5=submitPromise.current)===null||_submitPromise$curren5===void 0?void 0:(_submitPromise$curren6=_submitPromise$curren5.resolve)===null||_submitPromise$curren6===void 0?void 0:_submitPromise$curren6.call(_submitPromise$curren5);return _context2.abrupt("return");case 34:_context2.prev=34;if(updateOptIns){marketingOptIn=optInFormState.values.marketingOptIn;}_context2.next=38;return submitCheckoutOrder(_extends({paymentTransactions:fulfilledPaymentTransactions,userAgent:getUserAgent(),platform:'engage',marketingOptIn:marketingOptIn},campaignAttribution?{campaignAttribution:campaignAttribution}:{}));case 38:_ref5=_context2.sent;paymentTransactionResults=_ref5.paymentTransactionResults;redirectNeeded=_ref5.redirectNeeded;if(!(redirectNeeded&&paymentTransactionResults.length)){_context2.next=56;break;}_paymentTransactionRe=paymentTransactionResults[0].redirectParams;_paymentTransactionRe=_paymentTransactionRe===void 0?{}:_paymentTransactionRe;url=_paymentTransactionRe.url;if(!isAvailable()){_context2.next=51;break;}_context2.next=48;return InAppBrowser.openLink({url:url,options:{enableDefaultShare:false}});case 48:// On Close we simply unlock the checkout
-setLocked(false);submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren7=submitPromise.current)===null||_submitPromise$curren7===void 0?void 0:(_submitPromise$curren8=_submitPromise$curren7.resolve)===null||_submitPromise$curren8===void 0?void 0:_submitPromise$curren8.call(_submitPromise$curren7);return _context2.abrupt("return");case 51:// Implemented specifically for paypal:
+fulfilledPaymentTransactions=[];if(!needsPayment){_context2.next=34;break;}_context2.next=29;return paymentHandlerRef.current.fulfillTransaction({paymentTransactions:paymentTransactions});case 29:fulfilledPaymentTransactions=_context2.sent;if(fulfilledPaymentTransactions){_context2.next=34;break;}setLocked(false);submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren5=submitPromise.current)===null||_submitPromise$curren5===void 0?void 0:(_submitPromise$curren6=_submitPromise$curren5.resolve)===null||_submitPromise$curren6===void 0?void 0:_submitPromise$curren6.call(_submitPromise$curren5);return _context2.abrupt("return");case 34:_context2.prev=34;if(updateOptIns){marketingOptIn=optInFormState.values.marketingOptIn;}_context2.next=38;return submitCheckoutOrder(_extends({paymentTransactions:fulfilledPaymentTransactions,userAgent:getUserAgent(),platform:'engage',marketingOptIn:marketingOptIn},campaignAttribution?{campaignAttribution:campaignAttribution}:{}));case 38:_ref7=_context2.sent;paymentTransactionResults=_ref7.paymentTransactionResults;redirectNeeded=_ref7.redirectNeeded;if(!(redirectNeeded&&paymentTransactionResults.length)){_context2.next=54;break;}_paymentTransactionRe3=paymentTransactionResults[0].redirectParams,_paymentTransactionRe4=_paymentTransactionRe3===void 0?{}:_paymentTransactionRe3,url=_paymentTransactionRe4.url;if(!isAvailable()){_context2.next=49;break;}_context2.next=46;return InAppBrowser.openLink({url:url,options:{enableDefaultShare:false}});case 46:// On Close we simply unlock the checkout
+setLocked(false);submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren7=submitPromise.current)===null||_submitPromise$curren7===void 0?void 0:(_submitPromise$curren8=_submitPromise$curren7.resolve)===null||_submitPromise$curren8===void 0?void 0:_submitPromise$curren8.call(_submitPromise$curren7);return _context2.abrupt("return");case 49:// Implemented specifically for paypal:
 // https://developer.paypal.com/docs/checkout/integration-features/funding-failure/
 // In the website we don't want to redirect and instead use to paypal sdk to
 // control the "mini browser" / popup.
-redirectWanted=true;if(paymentHandlerRef===null||paymentHandlerRef===void 0?void 0:(_paymentHandlerRef$cu=paymentHandlerRef.current)===null||_paymentHandlerRef$cu===void 0?void 0:_paymentHandlerRef$cu.getSupportsRedirect){redirectWanted=paymentHandlerRef===null||paymentHandlerRef===void 0?void 0:(_paymentHandlerRef$cu2=paymentHandlerRef.current)===null||_paymentHandlerRef$cu2===void 0?void 0:_paymentHandlerRef$cu2.getSupportsRedirect();}if(redirectWanted){window.location.href=url;}else{setLocked(false);}submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren9=submitPromise.current)===null||_submitPromise$curren9===void 0?void 0:(_submitPromise$curren10=_submitPromise$curren9.resolve)===null||_submitPromise$curren10===void 0?void 0:_submitPromise$curren10.call(_submitPromise$curren9,true);return _context2.abrupt("return");case 56:_context2.next=63;break;case 58:_context2.prev=58;_context2.t2=_context2["catch"](34);setLocked(false);submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren11=submitPromise.current)===null||_submitPromise$curren11===void 0?void 0:(_submitPromise$curren12=_submitPromise$curren11.resolve)===null||_submitPromise$curren12===void 0?void 0:_submitPromise$curren12.call(_submitPromise$curren11);return _context2.abrupt("return");case 63:_context2.next=65;return Promise.all([fetchCheckoutOrder(),fetchCart()]);case 65:_ref6=_context2.sent;_ref7=_slicedToArray(_ref6,1);order=_ref7[0];clearCheckoutCampaign();historyReplace({pathname:CHECKOUT_CONFIRMATION_PATTERN,state:{order:order}});// We don't set locked to false to avoid unnecessary UI changes right before
+redirectWanted=true;if(paymentHandlerRef===null||paymentHandlerRef===void 0?void 0:(_paymentHandlerRef$cu=paymentHandlerRef.current)===null||_paymentHandlerRef$cu===void 0?void 0:_paymentHandlerRef$cu.getSupportsRedirect){redirectWanted=paymentHandlerRef===null||paymentHandlerRef===void 0?void 0:(_paymentHandlerRef$cu2=paymentHandlerRef.current)===null||_paymentHandlerRef$cu2===void 0?void 0:_paymentHandlerRef$cu2.getSupportsRedirect();}if(redirectWanted){window.location.href=url;}else{setLocked(false);}submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren9=submitPromise.current)===null||_submitPromise$curren9===void 0?void 0:(_submitPromise$curren10=_submitPromise$curren9.resolve)===null||_submitPromise$curren10===void 0?void 0:_submitPromise$curren10.call(_submitPromise$curren9,true);return _context2.abrupt("return");case 54:_context2.next=61;break;case 56:_context2.prev=56;_context2.t2=_context2["catch"](34);setLocked(false);submitPromise===null||submitPromise===void 0?void 0:(_submitPromise$curren11=submitPromise.current)===null||_submitPromise$curren11===void 0?void 0:(_submitPromise$curren12=_submitPromise$curren11.resolve)===null||_submitPromise$curren12===void 0?void 0:_submitPromise$curren12.call(_submitPromise$curren11);return _context2.abrupt("return");case 61:_context2.next=63;return Promise.all([fetchCheckoutOrder(),fetchCart()]);case 63:_ref8=_context2.sent;_ref9=_slicedToArray(_ref8,1);order=_ref9[0];clearCheckoutCampaign();historyReplace({pathname:CHECKOUT_CONFIRMATION_PATTERN,state:{order:order}});// We don't set locked to false to avoid unnecessary UI changes right before
 // going to confirmation page.
-case 70:case"end":return _context2.stop();}}},_callee2,null,[[2,7],[15,20],[34,58]]);}));return function(_x){return _ref4.apply(this,arguments);};}(),[orderReadOnly,isGuestCheckout,isPickupContactSelectionEnabled,needsPayment,fetchCheckoutOrder,fetchCart,clearCheckoutCampaign,historyReplace,updateCheckoutOrder,billingAddress,isShippingAddressSelectionEnabled,shippingAddress,paymentTransactions,updateOptIns,submitCheckoutOrder,campaignAttribution,optInFormState.values]);var handleUpdateShippingMethod=useCallback(/*#__PURE__*/function(){var _ref8=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(selectedShippingMethod){return _regeneratorRuntime.wrap(function _callee3$(_context3){while(1){switch(_context3.prev=_context3.next){case 0:setLocked(true);_context3.prev=1;_context3.next=4;return updateCheckoutOrder({addressSequences:[_extends({},billingAddress),_extends({},shippingAddress,{orderSegment:{selectedShippingMethod:selectedShippingMethod}})].concat(isGuestCheckout&&pickupAddress?[_extends({},pickupAddress)]:[]),primaryBillToAddressSequenceIndex:0,primaryShipToAddressSequenceIndex:1});case 4:_context3.next=8;break;case 6:_context3.prev=6;_context3.t0=_context3["catch"](1);case 8:_context3.prev=8;_context3.next=11;return fetchCheckoutOrder();case 11:_context3.next=15;break;case 13:_context3.prev=13;_context3.t1=_context3["catch"](8);case 15:setLocked(false);case 16:case"end":return _context3.stop();}}},_callee3,null,[[1,6],[8,13]]);}));return function(_x2){return _ref8.apply(this,arguments);};}(),[billingAddress,pickupAddress,shippingAddress,fetchCheckoutOrder,isGuestCheckout,updateCheckoutOrder]);// Whenever the order is locked we also want to show to loading bar.
+case 68:case"end":return _context2.stop();}},_callee2,null,[[2,7],[15,20],[34,56]]);}));return function(_x){return _ref5.apply(this,arguments);};}(),[orderReadOnly,isGuestCheckout,isPickupContactSelectionEnabled,needsPayment,fetchCheckoutOrder,fetchCart,clearCheckoutCampaign,historyReplace,updateCheckoutOrder,billingAddress,isShippingAddressSelectionEnabled,shippingAddress,paymentTransactions,updateOptIns,submitCheckoutOrder,campaignAttribution,optInFormState.values]);var handleUpdateShippingMethod=useCallback(/*#__PURE__*/function(){var _ref10=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(selectedShippingMethod){return _regeneratorRuntime.wrap(function _callee3$(_context3){while(1)switch(_context3.prev=_context3.next){case 0:setLocked(true);_context3.prev=1;_context3.next=4;return updateCheckoutOrder({addressSequences:[_extends({},billingAddress),_extends({},shippingAddress,{orderSegment:{selectedShippingMethod:selectedShippingMethod}})].concat(isGuestCheckout&&pickupAddress?[_extends({},pickupAddress)]:[]),primaryBillToAddressSequenceIndex:0,primaryShipToAddressSequenceIndex:1});case 4:_context3.next=8;break;case 6:_context3.prev=6;_context3.t0=_context3["catch"](1);case 8:_context3.prev=8;_context3.next=11;return fetchCheckoutOrder();case 11:_context3.next=15;break;case 13:_context3.prev=13;_context3.t1=_context3["catch"](8);case 15:setLocked(false);case 16:case"end":return _context3.stop();}},_callee3,null,[[1,6],[8,13]]);}));return function(_x2){return _ref10.apply(this,arguments);};}(),[billingAddress,pickupAddress,shippingAddress,fetchCheckoutOrder,isGuestCheckout,updateCheckoutOrder]);// Whenever the order is locked we also want to show to loading bar.
 React.useEffect(function(){if(isLocked){setLoading(true);return;}setLoading(false);},[isLocked]);React.useEffect(function(){if(isLoading){LoadingProvider.setLoading(pathPattern);return;}LoadingProvider.resetLoading(pathPattern);},[isLoading,pathPattern]);// Hold form states.
 var formState=useFormState(defaultPickupPersonState,handleSubmitOrder,validationRules);// When "someone-else" is picked for pickup the validation rules need to change.
 React.useEffect(function(){setValidationRules(formState.values.pickupPerson==='me'||isGuestCheckout?selfPickupConstraints:pickupConstraints);},[formState.values.pickupPerson,isGuestCheckout]);var isOrderable=React.useMemo(function(){return typeof(checkoutOrder===null||checkoutOrder===void 0?void 0:checkoutOrder.isOrderable)!=='undefined'?checkoutOrder.isOrderable:true;},[checkoutOrder]);// Create memoized context value.
 var value=React.useMemo(function(){return{setPaymentHandler:function setPaymentHandler(handler){setPaymentButton(function(){return handler.getCustomPayButton();});paymentHandlerRef.current=handler;},paymentButton:paymentButton,paymentData:paymentData,setPaymentData:setPaymentData,paymentTransactions:paymentTransactions,isLocked:isLocked,isButtonLocked:(isLocked||isButtonLocked)&&needsPayment||!isOrderable,isLoading:isLoading,supportedCountries:shopSettings.supportedCountries,countrySortOrder:shopSettings.countrySortOrder,formValidationErrors:convertValidationErrors(formState.validationErrors||{}),formSetValues:formState.setValues,handleSubmitOrder:function handleSubmitOrder(){var promise=new Promise(function(resolve,reject){submitPromise.current={resolve:resolve,reject:reject};});formState.handleSubmit.apply(formState,arguments);return promise;},handleValidation:function handleValidation(){return formState.validate(formState.values);},updateShippingMethod:handleUpdateShippingMethod,defaultPickupPersonState:defaultPickupPersonState,userLocation:userLocation,billingAddress:billingAddress,shippingAddress:shippingAddress,pickupAddress:pickupAddress,taxLines:taxLines,order:checkoutOrder,currencyCode:checkoutOrder===null||checkoutOrder===void 0?void 0:checkoutOrder.currencyCode,needsPayment:needsPayment,orderReserveOnly:orderReserveOnly,isShippingAddressSelectionEnabled:isShippingAddressSelectionEnabled,isPickupContactSelectionEnabled:isPickupContactSelectionEnabled,isGuestCheckout:isGuestCheckout,fulfillmentSlot:fulfillmentSlot,optInFormSetValues:optInFormState.setValues,defaultOptInFormState:defaultOptInFormState,setUpdateOptIns:function setUpdateOptIns(){var val=arguments.length>0&&arguments[0]!==undefined?arguments[0]:true;_setUpdateOptIns(val);},setButtonLocked:setButtonLocked,setLoading:setLoading,setLocked:setLocked};},[paymentButton,paymentData,paymentTransactions,isLocked,isButtonLocked,needsPayment,isOrderable,isLoading,shopSettings.supportedCountries,shopSettings.countrySortOrder,formState,handleUpdateShippingMethod,userLocation,billingAddress,shippingAddress,pickupAddress,taxLines,checkoutOrder,orderReserveOnly,isShippingAddressSelectionEnabled,isPickupContactSelectionEnabled,isGuestCheckout,fulfillmentSlot,optInFormState.setValues,defaultOptInFormState]);// Handle deeplinks from external payment site.
 React.useEffect(function(){if(!isAvailable())return undefined;/**
      * @param {Object} event Event
-     */var listener=/*#__PURE__*/function(){var _ref9=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(event){var _ref10,_ref10$link,link,_link$match,_link$match2,_,_scheme,path,_ref11,_ref12,order;return _regeneratorRuntime.wrap(function _callee4$(_context4){while(1){switch(_context4.prev=_context4.next){case 0:_ref10=(event===null||event===void 0?void 0:event.detail)||{},_ref10$link=_ref10.link,link=_ref10$link===void 0?'':_ref10$link;/* eslint-disable-next-line no-unused-vars */_link$match=link.match(/(.*):\/\/([a-zA-Z0-9-/]*)(.*)/),_link$match2=_slicedToArray(_link$match,3),_=_link$match2[0],_scheme=_link$match2[1],path=_link$match2[2];// Order is done, fetch again to retrieve infos for success page
-if(!(path==='payment/success')){_context4.next=11;break;}_context4.next=5;return Promise.all([fetchCheckoutOrder(),fetchCart()]);case 5:_ref11=_context4.sent;_ref12=_slicedToArray(_ref11,1);order=_ref12[0];historyReplace({pathname:CHECKOUT_CONFIRMATION_PATTERN,state:{order:order}});_context4.next=12;break;case 11:if(path==='payment/error'){showModal({title:null,confirm:null,dismiss:'modal.ok',message:'checkout.errors.payment.genericExternal'});}case 12:case"end":return _context4.stop();}}},_callee4);}));return function listener(_x3){return _ref9.apply(this,arguments);};}();Linking.addEventListener('deepLinkOpened',listener);return function(){Linking.removeEventListener('deepLinkOpened',listener);};},[fetchCart,fetchCheckoutOrder,historyReplace,showModal]);if(!isDataReady||!isCheckoutInitialized){return null;}return React.createElement(Context.Provider,{value:value},children);};CheckoutProvider.defaultProps={orderInitialized:false,orderReadOnly:false,orderReserveOnly:false,isShippingAddressSelectionEnabled:false,isPickupContactSelectionEnabled:false,isGuestCheckout:false};export default connect(CheckoutProvider);/* eslint-enable no-unused-expressions */
+     */var listener=/*#__PURE__*/function(){var _ref11=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(event){var _ref12,_ref12$link,link,_link$match,_link$match2,_,_scheme,path,_ref15,_ref16,order;return _regeneratorRuntime.wrap(function _callee4$(_context4){while(1)switch(_context4.prev=_context4.next){case 0:_ref12=(event===null||event===void 0?void 0:event.detail)||{},_ref12$link=_ref12.link,link=_ref12$link===void 0?'':_ref12$link;/* eslint-disable-next-line no-unused-vars */_link$match=link.match(/(.*):\/\/([a-zA-Z0-9-/]*)(.*)/),_link$match2=_slicedToArray(_link$match,3),_=_link$match2[0],_scheme=_link$match2[1],path=_link$match2[2];// Order is done, fetch again to retrieve infos for success page
+if(!(path==='payment/success')){_context4.next=11;break;}_context4.next=5;return Promise.all([fetchCheckoutOrder(),fetchCart()]);case 5:_ref15=_context4.sent;_ref16=_slicedToArray(_ref15,1);order=_ref16[0];historyReplace({pathname:CHECKOUT_CONFIRMATION_PATTERN,state:{order:order}});_context4.next=12;break;case 11:if(path==='payment/error'){showModal({title:null,confirm:null,dismiss:'modal.ok',message:'checkout.errors.payment.genericExternal'});}case 12:case"end":return _context4.stop();}},_callee4);}));return function listener(_x3){return _ref11.apply(this,arguments);};}();Linking.addEventListener('deepLinkOpened',listener);return function(){Linking.removeEventListener('deepLinkOpened',listener);};},[fetchCart,fetchCheckoutOrder,historyReplace,showModal]);if(!isDataReady||!isCheckoutInitialized){return null;}return React.createElement(Context.Provider,{value:value},children);};CheckoutProvider.defaultProps={orderInitialized:false,orderReadOnly:false,orderReserveOnly:false,isShippingAddressSelectionEnabled:false,isPickupContactSelectionEnabled:false,isGuestCheckout:false};export default connect(CheckoutProvider);/* eslint-enable no-unused-expressions */

package/components/ChipLayout/index.js

@@ -0,0 +1,38 @@
+function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Component}from'react';import PropTypes from'prop-types';import debounce from'lodash/debounce';import I18n from'@shopgate/pwa-common/components/I18n';import RippleButton from'@shopgate/pwa-ui-shared/RippleButton';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import styles from"./style";var variables=themeConfig.variables;/**
+ * The height of one row.
+ * @type {number}
+ */export var CHIP_ROW_HEIGHT=34;/**
+ * The minimum width that a chip should have.
+ * @type {number}
+ */export var CHIP_MINIMUM_WIDTH=60;/**
+ * The ChipLayout component.
+ */var ChipLayout=/*#__PURE__*/function(_Component){function ChipLayout(){var _this2;_classCallCheck(this,ChipLayout);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this2=_callSuper(this,ChipLayout,[].concat(args));/**
+   * Debounced, eg. layout effect
+   */_defineProperty(_this2,"processHiddenElementsDebounced",debounce(_this2.processHiddenElements,50));return _this2;}_inherits(ChipLayout,_Component);return _createClass(ChipLayout,[{key:"componentDidMount",value:/**
+   * When the component mounts we need to initially process all children.
+   */function componentDidMount(){this.processHiddenElementsDebounced();}/**
+   * Eveyry time pathname or other prop changes this callback is called.
+   * This funtion will start processing hidden elements in order to check if "more" button
+   * should be rendered.
+   *
+   * It must be done on every prop change, including the pathname.
+   * Sometimes this component is rendered invisible, then since `.processHiddenElements` uses
+   * refs.clientHeight it would always be zero.
+   */},{key:"componentDidUpdate",value:function componentDidUpdate(){this.processHiddenElementsDebounced();}/**
+   * Returns the maximum height the container should have.
+   * @returns {number}
+   */},{key:"maxContentHeight",get:function get(){// 8 -> container padding.
+return CHIP_ROW_HEIGHT*this.props.maxRows+8;}/**
+   * Returns the more button styles.
+   * @return {string} The store button class name.
+   */},{key:"moreButtonStyles",get:function get(){if(this.props.invertMoreButton){return styles.moreButtonInverted;}return styles.moreButton;}/**
+   * Loops through all children to make sure the more button appears if there is too much content.
+   */},{key:"processHiddenElements",value:function processHiddenElements(){var _this3=this;if(!this.containerRef){return;}// Find out if there are overflowing elements.
+var lastVisibleElement=0;var showMoreButton=this.containerRef.scrollHeight>this.containerRef.clientHeight;var containerHeight=this.containerRef.clientHeight;var chips=Array.from(this.layoutRef.children);this.moreButtonRef.style.display=showMoreButton?'block':'none';this.layoutRef.style.minHeight=showMoreButton?"".concat(this.maxContentHeight,"px"):'0px';// If the more button is not visible we don't need to process anything.
+if(!showMoreButton){return;}// Hide or show chips that are hidden due to overflow.
+chips.forEach(function(child,index){var isVisible=child.offsetTop+child.clientHeight<containerHeight;child.setAttribute('style',"display: ".concat(isVisible?'flex':'none',";"));if(isVisible){lastVisibleElement=index;}});// Hide the more button if previous assumption was incorrect.
+if(lastVisibleElement===chips.length-1){this.moreButtonRef.style.display='none';return;}// Hide elements so that the 'more button' has enough space.
+chips.slice(0,lastVisibleElement+1).reverse().every(function(element){var offsetBottom=element.offsetTop+element.clientHeight;if(_this3.moreButtonRef.offsetTop>offsetBottom){return true;}var buttonSpaceRequired=_this3.moreButtonRef.clientWidth+variables.gap.big;var elementRight=_this3.containerRef.clientWidth-(element.offsetLeft+element.clientWidth);var spaceDiff=buttonSpaceRequired-elementRight;var remainingChipWidth=element.clientWidth-spaceDiff;if(remainingChipWidth>CHIP_MINIMUM_WIDTH){element.setAttribute('style',"max-width: ".concat(remainingChipWidth,"px"));return false;}if(element.offsetTop!==chips[lastVisibleElement].offsetTop){element.setAttribute('style','display: none');return false;}element.setAttribute('style','display: none');return true;});}},{key:"render",value:/**
+   * Renders the component.
+   * @returns {JSX}
+   */function render(){var _this4=this;return React.createElement("div",{ref:function ref(element){_this4.containerRef=element;},className:"".concat(styles.container(this.maxContentHeight)," engage__chip-layout")},React.createElement("div",{ref:function ref(element){_this4.layoutRef=element;},className:styles.layout},this.props.children),React.createElement("div",{ref:function ref(element){_this4.moreButtonRef=element;},className:styles.moreButtonWrapper},React.createElement(RippleButton,{fill:true,type:"plain",className:this.moreButtonStyles,onClick:this.props.handleMoreButton},React.createElement(I18n.Text,{string:this.props.moreLabel}))));}}]);}(Component);_defineProperty(ChipLayout,"defaultProps",{children:null,handleMoreButton:function handleMoreButton(){},invertMoreButton:false,maxRows:2,moreLabel:'more',pathname:''});export default ChipLayout;

package/components/ChipLayout/spec.js

@@ -0,0 +1,5 @@
+import React from'react';import{mount}from'enzyme';import Chip from'@shopgate/pwa-ui-shared/Chip';import ChipsLayout from"./index";/**
+ * Since the component uses the <Measure> component it needs an actual
+ * browser to be tested as it needs a full browser that supports styling and
+ * width/height calculation.
+ */describe('<ChipsLayout />',function(){it('should render with one chip',function(){var Component=React.createElement(ChipsLayout,null,React.createElement(Chip,{id:"some-id"},"foo"));var wrapper=mount(Component);expect(wrapper).toMatchSnapshot();expect(wrapper.find(Chip).length).toEqual(1);expect(wrapper.find(Chip).at(0).find('button').at(1).text()).toEqual('foo');});it('should render with two chips',function(){var Component=React.createElement(ChipsLayout,null,React.createElement(Chip,{id:"some-id"},"foo"),React.createElement(Chip,{id:"some-other-id"},"bar"));var wrapper=mount(Component);expect(wrapper).toMatchSnapshot();expect(wrapper.find(Chip).length).toEqual(2);expect(wrapper.find(Chip).at(0).find('button').at(1).text()).toEqual('foo');expect(wrapper.find(Chip).at(1).find('button').at(1).text()).toEqual('bar');});});