@shopgate/engage 7.29.1-beta.2 → 7.29.1-beta.3

package/locations/components/FulfillmentSelector/FulfillmentSelectorAddToCart.js

@@ -1,10 +1,7 @@
-import _regeneratorRuntime from"@babel/runtime/regenerator";function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}function 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{useEffect}from'react';import{isProductAvailable}from"../../helpers";import{MULTI_LINE_RESERVE,QUICK_RESERVE,DIRECT_SHIP,ROPIS,BOPIS,STAGE_RESERVE_FORM}from"../../constants";import{FulfillmentSheet}from"../FulfillmentSheet";import{FulfillmentPathSelector}from"../FulfillmentPathSelector";import{useFulfillmentSelectorState}from"./FulfillmentSelector.hooks";/**
+import _regeneratorRuntime from"@babel/runtime/regenerator";function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}function 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{useEffect}from'react';import{isProductAvailable}from"../../helpers";import{MULTI_LINE_RESERVE,QUICK_RESERVE,DIRECT_SHIP,ROPIS,BOPIS,STAGE_RESERVE_FORM}from"../../constants";import{FulfillmentSheet}from"../FulfillmentSheet";import{FulfillmentPathSelector}from"../FulfillmentPathSelector";import{useFulfillmentSelectorState}from"./FulfillmentSelector.hooks";/** @typedef {import('../../locations.types').FulfillmentPath} FulfillmentPath */ /**
  * Opens the fulfillment path selector and returns a promise that resolves after selection.
- * @returns {Promise}
- */function promisifiedFulfillmentPathSelector(){return new Promise(function(resolve){FulfillmentPathSelector.open(function(selectedPath){resolve(selectedPath);});});}/**
+ * @returns {Promise<FulfillmentPath>} A promise resolving to the selected fulfillment path.
+ */var promisifiedFulfillmentPathSelector=function promisifiedFulfillmentPathSelector(){return new Promise(function(resolve){FulfillmentPathSelector.open(function(selectedPath){resolve(selectedPath);});});};/**
  * Interject add to cart flow.
- * @returns {JSX}
- */export function FulfillmentSelectorAddToCart(){var _useFulfillmentSelect=useFulfillmentSelectorState(),preferredLocation=_useFulfillmentSelect.preferredLocation,inventory=_useFulfillmentSelect.inventory,selectedLocation=_useFulfillmentSelect.selectedLocation,conditioner=_useFulfillmentSelect.conditioner,fulfillmentPaths=_useFulfillmentSelect.fulfillmentPaths,selection=_useFulfillmentSelect.selection,isDirectShipEnabled=_useFulfillmentSelect.isDirectShipEnabled,isROPISEnabled=_useFulfillmentSelect.isROPISEnabled,isBOPISEnabled=_useFulfillmentSelect.isBOPISEnabled;var usedLocation=selectedLocation||preferredLocation;// Add to cart effect to validate inventory
-useEffect(function(){// Add most late conditioner
-conditioner.addConditioner('fulfillment-inventory',/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var mapping,selectedPath;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:if(!(isDirectShipEnabled&&selection===DIRECT_SHIP)){_context.next=2;break;}return _context.abrupt("return",true);case 2:mapping=_defineProperty(_defineProperty(_defineProperty({},DIRECT_SHIP,isDirectShipEnabled),ROPIS,isROPISEnabled),BOPIS,isBOPISEnabled);if(!(!selection||!mapping[selection]||!usedLocation)){_context.next=5;break;}return _context.abrupt("return",false);case 5:if(isProductAvailable(usedLocation,inventory)){_context.next=7;break;}return _context.abrupt("return",false);case 7:if(!(fulfillmentPaths.length>1)){_context.next=19;break;}_context.next=10;return promisifiedFulfillmentPathSelector();case 10:selectedPath=_context.sent;if(!(selectedPath==='')){_context.next=13;break;}return _context.abrupt("return",false);case 13:if(!(selectedPath===MULTI_LINE_RESERVE)){_context.next=15;break;}return _context.abrupt("return",true);case 15:if(!(selectedPath===QUICK_RESERVE)){_context.next=18;break;}FulfillmentSheet.open({stage:STAGE_RESERVE_FORM,fulfillmentPath:selectedPath});return _context.abrupt("return",false);case 18:return _context.abrupt("return",false);case 19:if(fulfillmentPaths.includes(MULTI_LINE_RESERVE)){_context.next=22;break;}// Open reservation form. Stop adding to a cart
-FulfillmentSheet.open({stage:STAGE_RESERVE_FORM});return _context.abrupt("return",false);case 22:return _context.abrupt("return",isProductAvailable(usedLocation,inventory));case 23:case"end":return _context.stop();}},_callee);})),100);return function(){return conditioner.removeConditioner('fulfillment-inventory');};},[conditioner,fulfillmentPaths,selection,usedLocation,isDirectShipEnabled,isROPISEnabled,isBOPISEnabled,inventory]);return null;}
+ * @returns {JSX.Element|null} The rendered component or null.
+ */export var FulfillmentSelectorAddToCart=function FulfillmentSelectorAddToCart(){var _useFulfillmentSelect=useFulfillmentSelectorState(),preferredLocation=_useFulfillmentSelect.preferredLocation,inventory=_useFulfillmentSelect.inventory,selectedLocation=_useFulfillmentSelect.selectedLocation,conditioner=_useFulfillmentSelect.conditioner,fulfillmentPaths=_useFulfillmentSelect.fulfillmentPaths,selection=_useFulfillmentSelect.selection,isDirectShipEnabled=_useFulfillmentSelect.isDirectShipEnabled,isROPISEnabled=_useFulfillmentSelect.isROPISEnabled,isBOPISEnabled=_useFulfillmentSelect.isBOPISEnabled;var usedLocation=selectedLocation||preferredLocation;useEffect(function(){conditioner.addConditioner('fulfillment-inventory',/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(){var mapping,selectedPath;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:if(!(isDirectShipEnabled&&selection===DIRECT_SHIP)){_context.next=2;break;}return _context.abrupt("return",true);case 2:mapping=_defineProperty(_defineProperty(_defineProperty({},DIRECT_SHIP,isDirectShipEnabled),ROPIS,isROPISEnabled),BOPIS,isBOPISEnabled);if(!(!selection||!mapping[selection]||!usedLocation)){_context.next=5;break;}return _context.abrupt("return",false);case 5:if(isProductAvailable(usedLocation,inventory)){_context.next=7;break;}return _context.abrupt("return",false);case 7:if(!(fulfillmentPaths.length>1)){_context.next=19;break;}_context.next=10;return promisifiedFulfillmentPathSelector();case 10:selectedPath=_context.sent;if(!(selectedPath==='')){_context.next=13;break;}return _context.abrupt("return",false);case 13:if(!(selectedPath===MULTI_LINE_RESERVE)){_context.next=15;break;}return _context.abrupt("return",true);case 15:if(!(selectedPath===QUICK_RESERVE)){_context.next=18;break;}FulfillmentSheet.open({stage:STAGE_RESERVE_FORM,fulfillmentPath:selectedPath});return _context.abrupt("return",false);case 18:return _context.abrupt("return",false);case 19:if(fulfillmentPaths.includes(MULTI_LINE_RESERVE)){_context.next=22;break;}FulfillmentSheet.open({stage:STAGE_RESERVE_FORM});return _context.abrupt("return",false);case 22:return _context.abrupt("return",isProductAvailable(usedLocation,inventory));case 23:case"end":return _context.stop();}},_callee);})),100);return function(){return conditioner.removeConditioner('fulfillment-inventory');};},[conditioner,fulfillmentPaths,selection,usedLocation,isDirectShipEnabled,isROPISEnabled,isBOPISEnabled,inventory]);return null;};

package/locations/components/FulfillmentSelector/FulfillmentSelectorBOPIS.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 classNames from'classnames';import{i18n}from"../../../core";import{IN_STORE_PICKUP_BOPIS_LABEL}from"../../constants";import{itemRowDisabled}from"./FulfillmentSelectorItem.style";import{useFulfillmentSelectorState}from"./FulfillmentSelector.hooks";/**
+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 classNames from'classnames';import{i18n}from'@shopgate/engage/core/helpers';import{IN_STORE_PICKUP_BOPIS_LABEL}from"../../constants";import{itemRowDisabled}from"./FulfillmentSelectorItem.style";import{useFulfillmentSelectorState}from"./FulfillmentSelector.hooks";/**
  * Renders the FulfillmentSelectorBOPIS components.
- * @returns {JSX}
- */export function FulfillmentSelectorBOPIS(){var _useFulfillmentSelect=useFulfillmentSelectorState(),isBOPISEnabled=_useFulfillmentSelect.isBOPISEnabled,isReady=_useFulfillmentSelect.isReady;var classes=classNames(_defineProperty({},itemRowDisabled.toString(),!isReady||!isBOPISEnabled));return React.createElement("div",{className:classes},i18n.text(IN_STORE_PICKUP_BOPIS_LABEL));}
+ * @returns {JSX.Element}
+ */export var FulfillmentSelectorBOPIS=function FulfillmentSelectorBOPIS(){var _useFulfillmentSelect=useFulfillmentSelectorState(),isBOPISEnabled=_useFulfillmentSelect.isBOPISEnabled,isReady=_useFulfillmentSelect.isReady;var classes=classNames(_defineProperty({},itemRowDisabled.toString(),!isReady||!isBOPISEnabled));return React.createElement("div",{className:classes},i18n.text(IN_STORE_PICKUP_BOPIS_LABEL));};

package/locations/components/FulfillmentSelector/FulfillmentSelectorDirectShip.js

@@ -1,5 +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*as React from'react';import classNames from'classnames';import{Grid}from'@shopgate/engage/components';import{i18n}from"../../../core";import{Availability}from"../../../product";import{DIRECT_SHIP_LABEL,DIRECT_SHIP}from"../../constants";import{itemRow,itemColumn,itemRowDisabled}from"./FulfillmentSelectorItem.style";import{useFulfillmentSelectorState}from"./FulfillmentSelector.hooks";import{FulfillmentSelectorImpossibleError}from"./FulfillmentSelectorImpossibleError";/**
  * Renders the direct ship item label.
- * @param {Object} props The component props.
- * @returns {JSX}
- */export function FulfillmentSelectorDirectShip(){var _useFulfillmentSelect=useFulfillmentSelectorState(),productId=_useFulfillmentSelect.productId,selection=_useFulfillmentSelect.selection,isOrderable=_useFulfillmentSelect.isOrderable,isDirectShipEnabled=_useFulfillmentSelect.isDirectShipEnabled,isReady=_useFulfillmentSelect.isReady;var rowClasses=React.useMemo(function(){return classNames(itemRow,_defineProperty({},itemRowDisabled.toString(),!isReady||!isDirectShipEnabled));},[isDirectShipEnabled,isReady]);var selected=selection===DIRECT_SHIP;if(selected&&!isOrderable){return React.createElement(React.Fragment,null,React.createElement("div",null,i18n.text(DIRECT_SHIP_LABEL)),React.createElement(FulfillmentSelectorImpossibleError,null));}return React.createElement(Grid,{className:rowClasses,component:"div"},React.createElement(Grid.Item,{className:itemColumn,grow:1,shrink:0,component:"div"},i18n.text(DIRECT_SHIP_LABEL)),React.createElement(Grid.Item,{className:itemColumn,grow:1,shrink:0,component:"div"},isReady&&isDirectShipEnabled&&isOrderable&&React.createElement(Availability,{productId:productId,fulfillmentSelection:DIRECT_SHIP})));}
+ * @returns {JSX.Element}
+ */export var FulfillmentSelectorDirectShip=function FulfillmentSelectorDirectShip(){var _useFulfillmentSelect=useFulfillmentSelectorState(),productId=_useFulfillmentSelect.productId,selection=_useFulfillmentSelect.selection,isOrderable=_useFulfillmentSelect.isOrderable,isDirectShipEnabled=_useFulfillmentSelect.isDirectShipEnabled,isReady=_useFulfillmentSelect.isReady;var rowClasses=React.useMemo(function(){return classNames(itemRow,_defineProperty({},itemRowDisabled.toString(),!isReady||!isDirectShipEnabled));},[isDirectShipEnabled,isReady]);var selected=selection===DIRECT_SHIP;if(selected&&!isOrderable){return React.createElement(React.Fragment,null,React.createElement("div",null,i18n.text(DIRECT_SHIP_LABEL)),React.createElement(FulfillmentSelectorImpossibleError,null));}return React.createElement(Grid,{className:rowClasses,component:"div"},React.createElement(Grid.Item,{className:itemColumn,grow:1,shrink:0,component:"div"},i18n.text(DIRECT_SHIP_LABEL)),React.createElement(Grid.Item,{className:itemColumn,grow:1,shrink:0,component:"div"},isReady&&isDirectShipEnabled&&isOrderable&&React.createElement(Availability,{productId:productId,fulfillmentSelection:DIRECT_SHIP})));};

package/locations/components/FulfillmentSelector/FulfillmentSelectorHeader.js

@@ -1,4 +1,4 @@
-import React from'react';import{i18n}from'@shopgate/engage/core';import{container}from"./FulfillmentSelectorHeader.style";/**
+import React from'react';import{i18n}from'@shopgate/engage/core/helpers';import{container}from"./FulfillmentSelectorHeader.style";/**
  * Renders the fulfillment selector title.
- * @returns {JSX}
- */export function FulfillmentSelectorHeader(){return React.createElement("div",{role:"heading",className:container},i18n.text('locations.fulfillment.heading'));}
+ * @returns {JSX.Element}
+ */export var FulfillmentSelectorHeader=function FulfillmentSelectorHeader(){return React.createElement("div",{role:"heading",className:container},i18n.text('locations.fulfillment.heading'));};

package/locations/components/FulfillmentSelector/FulfillmentSelectorHeader.style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables;export var container=css({fontWeight:500,marginBottom:variables.gap.xsmall});
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables;export var container=css({fontWeight:500,marginBottom:variables.gap.xsmall}).toString();

package/locations/components/FulfillmentSelector/FulfillmentSelectorItem.js

@@ -1,8 +1,12 @@
-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*as React from'react';import classNames from'classnames';import CheckedIcon from'@shopgate/pwa-ui-shared/icons/RadioCheckedIcon';import UncheckedIcon from'@shopgate/pwa-ui-shared/icons/RadioUncheckedIcon';import{radioContainer,disabled as radioContainerDisabled,activeIcon,activeIconDisabled,inactiveIcon,inactiveIconDisabled,radio,content}from"./FulfillmentSelectorItem.style";import{useFulfillmentSelectorState}from"./FulfillmentSelector.hooks";/**
+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 CheckedIcon from'@shopgate/pwa-ui-shared/icons/RadioCheckedIcon';import UncheckedIcon from'@shopgate/pwa-ui-shared/icons/RadioUncheckedIcon';import{radioContainer,disabled as radioContainerDisabled,activeIcon,activeIconDisabled,inactiveIcon,inactiveIconDisabled,radio,content}from"./FulfillmentSelectorItem.style";import{useFulfillmentSelectorState}from"./FulfillmentSelector.hooks";import{DIRECT_SHIP,ROPIS,BOPIS}from"../../constants";/** @typedef {import('./FulfillmentSelector.types').Selection} Selection */ /**
  * Renders a fulfillment selector radio item.
  * @param {Object} props The component props.
- * @returns {JSX}
- */function FulfillmentSelectorItemUnwrapped(props){var name=props.name,children=props.children,onChange=props.onChange,disabled=props.disabled;var _useFulfillmentSelect=useFulfillmentSelectorState(),selection=_useFulfillmentSelect.selection;var checked=selection===name;/**
+ * @param {Selection} props.name The name of the selection.
+ * @param {React.ReactNode} props.children The child elements.
+ * @param {function(Selection): void} props.onChange The change handler.
+ * @param {boolean} [props.disabled=false] Whether the item is disabled.
+ * @returns {JSX.Element} The rendered component.
+ */var FulfillmentSelectorItemUnwrapped=function FulfillmentSelectorItemUnwrapped(_ref){var name=_ref.name,children=_ref.children,onChange=_ref.onChange,disabled=_ref.disabled;var _useFulfillmentSelect=useFulfillmentSelectorState(),selection=_useFulfillmentSelect.selection;var checked=selection===name;/**
    * Handle the change to the radio item.
-   * @param {Object} event The change event.
-   */function handleChange(event){event.preventDefault();if(disabled){return;}onChange(name);}var containerClasses=classNames(radioContainer.toString(),_defineProperty({},radioContainerDisabled.toString(),disabled));return React.createElement("label",{htmlFor:name,className:containerClasses,onClick:handleChange,role:"radio","aria-checked":checked,tabIndex:"0"},checked?React.createElement(CheckedIcon,{className:disabled?activeIconDisabled:activeIcon}):React.createElement(UncheckedIcon,{className:disabled?inactiveIconDisabled:inactiveIcon}),React.createElement("input",{type:"radio",checked:checked,name:name,className:radio,readOnly:true}),React.createElement("div",{className:content},children));}FulfillmentSelectorItemUnwrapped.defaultProps={disabled:false};export var FulfillmentSelectorItem=React.memo(FulfillmentSelectorItemUnwrapped);
+   * @param {React.MouseEvent<HTMLLabelElement>} event The click event.
+   */var handleChange=function handleChange(event){event.preventDefault();if(disabled){return;}onChange(name);};var containerClasses=classNames(radioContainer.toString(),_defineProperty({},radioContainerDisabled.toString(),disabled));return React.createElement("label",{htmlFor:name,className:containerClasses,onClick:handleChange,role:"radio","aria-checked":checked,tabIndex:"0"},checked?React.createElement(CheckedIcon,{className:disabled?activeIconDisabled:activeIcon}):React.createElement(UncheckedIcon,{className:disabled?inactiveIconDisabled:inactiveIcon}),React.createElement("input",{type:"radio",checked:checked,name:name,className:radio,readOnly:true}),React.createElement("div",{className:content},children));};FulfillmentSelectorItemUnwrapped.defaultProps={disabled:false};export var FulfillmentSelectorItem=React.memo(FulfillmentSelectorItemUnwrapped);

package/locations/components/FulfillmentSelector/FulfillmentSelectorItem.style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables,colors=themeConfig.colors;export var radioContainer=css({display:'flex',flexFlow:'row nowrap',padding:"".concat(variables.gap.xsmall,"px 0")});export var disabled=css({cursor:'not-allowed'});var icon={width:24,height:24,flexShrink:0,marginTop:'-1px',marginRight:variables.gap.small,color:'var(--color-text-medium-emphasis)'};export var inactiveIcon=css(icon).toString();export var inactiveIconDisabled=css(icon,{opacity:0.3}).toString();export var activeIcon=css(icon,{color:"var(--color-primary, ".concat(colors.primary,")")}).toString();export var activeIconDisabled=css(icon,{color:"var(--color-primary, ".concat(colors.primary,")"),opacity:0.3}).toString();export var radio=css({display:'none'});export var content=css({flexGrow:1,color:'var(--color-text-high-emphasis)'});export var itemRow=css({alignContent:'stretch',alignItems:'baseline'}).toString();export var itemRowDisabled=css({opacity:0.3});export var itemSpacer=css({marginLeft:16});export var itemColumn=css({display:'block',width:'50%','&:first-of-type':{paddingRight:variables.gap.small},'&:last-of-type':{textAlign:'right'}}).toString();
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables,colors=themeConfig.colors;export var radioContainer=css({display:'flex',flexFlow:'row nowrap',padding:"".concat(variables.gap.xsmall,"px 0")});export var disabled=css({cursor:'not-allowed'});var icon={width:24,height:24,flexShrink:0,marginTop:'-1px',marginRight:variables.gap.small,color:'var(--color-text-medium-emphasis)'};export var inactiveIcon=css(icon).toString();export var inactiveIconDisabled=css(icon,{opacity:0.3}).toString();export var activeIcon=css(icon,{color:"var(--color-primary, ".concat(colors.primary,")")}).toString();export var activeIconDisabled=css(icon,{color:"var(--color-primary, ".concat(colors.primary,")"),opacity:0.3}).toString();export var radio=css({display:'none'}).toString();export var content=css({flexGrow:1,color:'var(--color-text-high-emphasis)'}).toString();export var itemRow=css({alignContent:'stretch',alignItems:'baseline'}).toString();export var itemRowDisabled=css({opacity:0.3});export var itemSpacer=css({marginLeft:16});export var itemColumn=css({display:'block',width:'50%','&:first-of-type':{paddingRight:variables.gap.small},'&:last-of-type':{textAlign:'right'}}).toString();

package/locations/components/ReserveForm/ReserveForm.js

@@ -1,10 +1,11 @@
-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 _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-phone-number-input/style.css';import React,{useState,useContext,useMemo,useRef,useLayoutEffect,useCallback,Fragment}from'react';import{TextField,RippleButton,RadioGroup,RadioGroupItem,ProgressBar}from'@shopgate/engage/components';import{useFormState}from"../../../core/hooks/useFormState";import{i18n}from"../../../core/helpers/i18n";import{FulfillmentContext}from"../../locations.context";import{ReserveFormPhone}from"./ReserveFormPhone";import{constraints}from"./ReserveForm.constraints";import{form,fieldset,formField,formHeading,pickerSwitch,pickerItem,button,progressBar}from"./ReserveForm.style";var PICKUP_PERSON_ME='me';var PICKUP_PERSON_OTHER='someoneelse';/**
+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 _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-phone-number-input/style.css';import React,{useState,useContext,useMemo,useRef,useLayoutEffect,useCallback,Fragment}from'react';import{TextField,RippleButton,RadioGroup,RadioGroupItem,ProgressBar}from'@shopgate/engage/components';import{i18n}from'@shopgate/engage/core/helpers';import{useFormState}from"../../../core/hooks/useFormState";import{FulfillmentContext}from"../../locations.context";import{ReserveFormPhone}from"./ReserveFormPhone";import{constraints}from"./ReserveForm.constraints";import{form,fieldset,formField,formHeading,pickerSwitch,pickerItem,button,progressBar}from"./ReserveForm.style";// eslint-disable-next-line max-len
+/** @typedef {import('@shopgate/engage/locations/locations.types').ReservationFormValues} ReservationFormValues */var PICKUP_PERSON_ME='me';var PICKUP_PERSON_OTHER='someoneelse';/**
  * Determines the pick up person.
- * @param {Object} userInput The current user input
+ * @param {ReservationFormValues|null} userInput The current user input
  * @return {string}
  */var determinePickupPerson=function determinePickupPerson(userInput){if(!userInput){return PICKUP_PERSON_ME;}var meFields=['firstName','lastName','email','cellPhone'];var otherFields=['firstName2','lastName2','email2','cellPhone2'];var hasMeFields=meFields.every(function(field){return typeof userInput[field]!=='undefined';});var hasOtherFields=otherFields.every(function(field){return typeof userInput[field]!=='undefined';});if(!hasOtherFields||!hasMeFields){return PICKUP_PERSON_ME;}var valuesEqual=meFields.every(function(field,index){return userInput[field]===userInput[otherFields[index]];});return valuesEqual?PICKUP_PERSON_ME:PICKUP_PERSON_OTHER;};/**
  * Renders the quick reservation form.
- * @returns {JSX}
- */function ReserveFormUnwrapped(){var _useContext=useContext(FulfillmentContext),sendReservation=_useContext.sendReservation,userInput=_useContext.userInput;var _useState=useState(determinePickupPerson(userInput)),_useState2=_slicedToArray(_useState,2),picker=_useState2[0],setPicker=_useState2[1];var defaultState={firstName:'',lastName:'',cellPhone:'',email:'',firstName2:'',lastName2:'',cellPhone2:'',email2:''};var validationConstraints=useMemo(function(){return _extends({},constraints,{},picker===PICKUP_PERSON_OTHER&&{firstName2:constraints.firstName,lastName2:constraints.lastName,cellPhone2:constraints.cellPhone,email2:constraints.email});},[picker]);var initialState=userInput?_extends({},defaultState,{},userInput):defaultState;/**
+ * @returns {JSX.Element}
+ */function ReserveFormUnwrapped(){var _useContext=useContext(FulfillmentContext),sendReservation=_useContext.sendReservation,userInput=_useContext.userInput;var _useState=useState(determinePickupPerson(userInput)),_useState2=_slicedToArray(_useState,2),picker=_useState2[0],setPicker=_useState2[1];/** @type {ReservationFormValues} */var defaultState={firstName:'',lastName:'',cellPhone:'',email:'',firstName2:'',lastName2:'',cellPhone2:'',email2:''};var validationConstraints=useMemo(function(){return _extends({},constraints,{},picker===PICKUP_PERSON_OTHER&&{firstName2:constraints.firstName,lastName2:constraints.lastName,cellPhone2:constraints.cellPhone,email2:constraints.email});},[picker]);/** @type {ReservationFormValues} */var initialState=userInput?_extends({},defaultState,{},userInput):defaultState;/**
    * @param {Object} values The form values.
-   */var complete=useCallback(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(values){var response;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:response=values;if(picker===PICKUP_PERSON_ME){response.firstName2=response.firstName;response.lastName2=response.lastName;response.cellPhone2=response.cellPhone;response.email2=response.email;}else{response.firstName2=response.firstName2||response.firstName;response.lastName2=response.lastName2||response.lastName;response.cellPhone2=response.cellPhone2||response.cellPhone;response.email2=response.email2||response.email;}_context.next=4;return sendReservation(response);case 4:case"end":return _context.stop();}},_callee);}));return function(_x){return _ref.apply(this,arguments);};}(),[picker,sendReservation]);var _useFormState=useFormState(initialState,complete,validationConstraints),values=_useFormState.values,handleChange=_useFormState.handleChange,handleSubmit=_useFormState.handleSubmit,changed=_useFormState.changed,valid=_useFormState.valid,_useFormState$validat=_useFormState.validationErrors,validationErrors=_useFormState$validat===void 0?{}:_useFormState$validat,isSubmitting=_useFormState.isSubmitting;var someoneElseRef=useRef(null);useLayoutEffect(function(){if(someoneElseRef.current&&picker===PICKUP_PERSON_OTHER){someoneElseRef.current.scrollIntoView({behavior:'smooth'});}},[picker,someoneElseRef]);return React.createElement(Fragment,null,React.createElement("div",{className:progressBar},React.createElement(ProgressBar,{isVisible:isSubmitting})),React.createElement("form",{onSubmit:handleSubmit,className:form},React.createElement("fieldset",{className:fieldset},React.createElement(TextField,{name:"firstName",value:values.firstName,onChange:handleChange,label:i18n.text('locations.firstName'),className:formField,errorText:i18n.text(validationErrors.firstName)}),React.createElement(TextField,{name:"lastName",value:values.lastName,onChange:handleChange,label:i18n.text('locations.lastName'),className:formField,errorText:i18n.text(validationErrors.lastName)}),React.createElement(ReserveFormPhone,{name:"cellPhone",value:values.cellPhone,onChange:handleChange,label:i18n.text('locations.cellPhone'),errorText:i18n.text(validationErrors.cellPhone)}),React.createElement(TextField,{name:"email",value:values.email,onChange:handleChange,label:i18n.text('locations.emailAddress'),className:formField,errorText:i18n.text(validationErrors.email)})),React.createElement("p",{className:formHeading},i18n.text('locations.who_will_pickup')),React.createElement("div",{className:pickerSwitch},React.createElement(RadioGroup,{name:"picker",direction:"row",value:picker,onChange:setPicker},React.createElement(RadioGroupItem,{label:i18n.text('locations.me'),name:PICKUP_PERSON_ME,className:pickerItem}),React.createElement(RadioGroupItem,{label:i18n.text('locations.someone_else'),name:PICKUP_PERSON_OTHER,className:pickerItem}))),picker===PICKUP_PERSON_OTHER&&React.createElement("fieldset",{className:fieldset,ref:someoneElseRef},React.createElement(TextField,{name:"firstName2",value:values.firstName2,onChange:handleChange,label:i18n.text('locations.firstName'),className:formField,errorText:i18n.text(validationErrors.firstName2)}),React.createElement(TextField,{name:"lastName2",value:values.lastName2,onChange:handleChange,label:i18n.text('locations.lastName'),className:formField,errorText:i18n.text(validationErrors.lastName2)}),React.createElement(ReserveFormPhone,{name:"cellPhone2",value:values.cellPhone2,onChange:handleChange,label:i18n.text('locations.cellPhone'),errorText:i18n.text(validationErrors.cellPhone2)}),React.createElement(TextField,{name:"email2",value:values.email2,onChange:handleChange,label:i18n.text('locations.emailAddress'),className:formField,errorText:i18n.text(validationErrors.email2)})),React.createElement(RippleButton,{type:"secondary",disabled:changed||valid===false||isSubmitting,className:button},i18n.text('locations.place_reservation'))));}export var ReserveForm=hot(ReserveFormUnwrapped);
+   */ /** @param {ReservationFormValues} values */var complete=useCallback(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(values){var response;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:response=values;if(picker===PICKUP_PERSON_ME){response.firstName2=response.firstName;response.lastName2=response.lastName;response.cellPhone2=response.cellPhone;response.email2=response.email;}else{response.firstName2=response.firstName2||response.firstName;response.lastName2=response.lastName2||response.lastName;response.cellPhone2=response.cellPhone2||response.cellPhone;response.email2=response.email2||response.email;}_context.next=4;return sendReservation(response);case 4:case"end":return _context.stop();}},_callee);}));return function(_x){return _ref.apply(this,arguments);};}(),[picker,sendReservation]);var _useFormState=useFormState(initialState,complete,validationConstraints),values=_useFormState.values,handleChange=_useFormState.handleChange,handleSubmit=_useFormState.handleSubmit,changed=_useFormState.changed,valid=_useFormState.valid,_useFormState$validat=_useFormState.validationErrors,validationErrors=_useFormState$validat===void 0?{}:_useFormState$validat,isSubmitting=_useFormState.isSubmitting;var someoneElseRef=useRef(null);useLayoutEffect(function(){if(someoneElseRef.current&&picker===PICKUP_PERSON_OTHER){someoneElseRef.current.scrollIntoView({behavior:'smooth'});}},[picker,someoneElseRef]);return React.createElement(Fragment,null,React.createElement("div",{className:progressBar},React.createElement(ProgressBar,{isVisible:isSubmitting})),React.createElement("form",{onSubmit:handleSubmit,className:form},React.createElement("fieldset",{className:fieldset},React.createElement(TextField,{name:"firstName",value:values.firstName,onChange:handleChange,label:i18n.text('locations.firstName'),className:formField,errorText:i18n.text(validationErrors.firstName)}),React.createElement(TextField,{name:"lastName",value:values.lastName,onChange:handleChange,label:i18n.text('locations.lastName'),className:formField,errorText:i18n.text(validationErrors.lastName)}),React.createElement(ReserveFormPhone,{name:"cellPhone",value:values.cellPhone,onChange:handleChange,label:i18n.text('locations.cellPhone'),errorText:i18n.text(validationErrors.cellPhone)}),React.createElement(TextField,{name:"email",value:values.email,onChange:handleChange,label:i18n.text('locations.emailAddress'),className:formField,errorText:i18n.text(validationErrors.email)})),React.createElement("p",{className:formHeading},i18n.text('locations.who_will_pickup')),React.createElement("div",{className:pickerSwitch},React.createElement(RadioGroup,{name:"picker",direction:"row",value:picker,onChange:setPicker},React.createElement(RadioGroupItem,{label:i18n.text('locations.me'),name:PICKUP_PERSON_ME,className:pickerItem}),React.createElement(RadioGroupItem,{label:i18n.text('locations.someone_else'),name:PICKUP_PERSON_OTHER,className:pickerItem}))),picker===PICKUP_PERSON_OTHER&&React.createElement("fieldset",{className:fieldset,ref:someoneElseRef},React.createElement(TextField,{name:"firstName2",value:values.firstName2,onChange:handleChange,label:i18n.text('locations.firstName'),className:formField,errorText:i18n.text(validationErrors.firstName2)}),React.createElement(TextField,{name:"lastName2",value:values.lastName2,onChange:handleChange,label:i18n.text('locations.lastName'),className:formField,errorText:i18n.text(validationErrors.lastName2)}),React.createElement(ReserveFormPhone,{name:"cellPhone2",value:values.cellPhone2,onChange:handleChange,label:i18n.text('locations.cellPhone'),errorText:i18n.text(validationErrors.cellPhone2)}),React.createElement(TextField,{name:"email2",value:values.email2,onChange:handleChange,label:i18n.text('locations.emailAddress'),className:formField,errorText:i18n.text(validationErrors.email2)})),React.createElement(RippleButton,{type:"secondary",disabled:changed||valid===false||isSubmitting,className:button},i18n.text('locations.place_reservation'))));}export var ReserveForm=hot(ReserveFormUnwrapped);

package/locations/components/ReserveForm/ReserveForm.style.js

@@ -1 +1 @@
-import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables,colors=themeConfig.colors;export var form=css({background:colors.background,padding:"".concat(variables.gap.small*1.5,"px ").concat(variables.gap.small*1.5,"px ").concat(variables.gap.big,"px"),boxShadow:'inset rgba(0, 0, 0, .117647) 0 1px 6px, inset rgba(0, 0, 0, .117647) 0 1px 4px'});export var formHeading=css({fontSize:'1.125rem',fontWeight:'bold',margin:"0 0 ".concat(variables.gap.small,"px")});export var fieldset=css({padding:0,margin:"0 0 ".concat(variables.gap.big,"px"),border:0});export var formField=css({width:'100%',paddingBottom:variables.gap.small});export var phoneField=css({position:'relative',width:'100%',paddingTop:variables.gap.big*0.75,paddingBottom:variables.gap.big*1.25,marginBottom:variables.gap.small,' input.PhoneInputInput':{outline:'none',fontSize:'1rem',lineHeight:'1.1875rem',borderRadius:0,paddingBottom:variables.gap.xsmall*1.5,borderBottom:"1px solid ".concat(colors.shade12),'&:focus':{borderBottom:"2px solid ".concat(colors.primary),paddingBottom:variables.gap.xsmall*1.5-1}}});export var phoneFieldError=css({' input.PhoneInputInput':{borderBottom:"2px solid var(--color-state-alert, ".concat(colors.error,") !important"),paddingBottom:variables.gap.xsmall*1.5-1}});export var phoneFieldErrorText=css({position:'absolute',width:'100%',bottom:2,fontSize:'0.75rem',lineHeight:0.875,color:"var(--color-state-alert, ".concat(colors.error,")"),overflow:'hidden',whiteSpace:'nowrap',textOverflow:'ellipsis'});export var pickerSwitch=css({marginTop:'-1rem'});export var pickerItem=css({paddingRight:variables.gap.xbig,':last-of-type':{paddingRight:0}}).toString();export var button=css({width:'100%'}).toString();export var progressBar=css({height:'4px',position:'relative'});
+import{css}from'glamor';import{themeConfig}from'@shopgate/pwa-common/helpers/config';var variables=themeConfig.variables,colors=themeConfig.colors;export var form=css({background:colors.background,padding:"".concat(variables.gap.small*1.5,"px ").concat(variables.gap.small*1.5,"px ").concat(variables.gap.big,"px"),boxShadow:'inset rgba(0, 0, 0, .117647) 0 1px 6px, inset rgba(0, 0, 0, .117647) 0 1px 4px'});export var formHeading=css({fontSize:'1.125rem',fontWeight:'bold',margin:"0 0 ".concat(variables.gap.small,"px")});export var fieldset=css({padding:0,margin:"0 0 ".concat(variables.gap.big,"px"),border:0});export var formField=css({width:'100%',paddingBottom:variables.gap.small});export var phoneField=css({position:'relative',width:'100%',paddingTop:variables.gap.big*0.75,paddingBottom:variables.gap.big*1.25,marginBottom:variables.gap.small,' input.PhoneInputInput':{outline:'none',fontSize:'1rem',lineHeight:'1.1875rem',borderRadius:0,paddingBottom:variables.gap.xsmall*1.5,borderBottom:"1px solid ".concat(colors.shade12),'&:focus':{borderBottom:"2px solid ".concat(colors.primary),paddingBottom:variables.gap.xsmall*1.5-1}}});export var phoneFieldError=css({' input.PhoneInputInput':{borderBottom:"2px solid var(--color-state-alert, ".concat(colors.error,") !important"),paddingBottom:variables.gap.xsmall*1.5-1}});export var phoneFieldErrorText=css({position:'absolute',width:'100%',bottom:2,fontSize:'0.75rem',lineHeight:0.875,color:"var(--color-state-alert, ".concat(colors.error,")"),overflow:'hidden',whiteSpace:'nowrap',textOverflow:'ellipsis'}).toString();export var pickerSwitch=css({marginTop:'-1rem'});export var pickerItem=css({paddingRight:variables.gap.xbig,':last-of-type':{paddingRight:0}}).toString();export var button=css({width:'100%'}).toString();export var progressBar=css({height:'4px',position:'relative'});

package/locations/components/ReserveForm/ReserveFormPhone.connector.js

@@ -1,3 +1,7 @@
 import{connect}from'react-redux';import{getPreferredLocationAddress}from"../../selectors";/**
- * @returns {Function}
- */function makeMapStateToProps(){return function(state){return{userLocation:getPreferredLocationAddress(state)};};}export default connect(makeMapStateToProps);
+ * @typedef {import('./ReserveFormPhone.types').OwnProps} OwnProps
+ * @typedef {import('./ReserveFormPhone.types').StateProps} StateProps
+ */ /**
+ * Maps state to props.
+ * @returns {function(Object): StateProps} A function that maps state to props.
+ */var makeMapStateToProps=function makeMapStateToProps(){return function(state){return{userLocation:getPreferredLocationAddress(state)};};};export default connect(makeMapStateToProps);

package/locations/components/ReserveForm/ReserveFormPhone.js

@@ -1,5 +1,10 @@
-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*as React from'react';import classnames from'classnames';import{i18n}from'@shopgate/engage/core';import{parsePhoneNumber}from'react-phone-number-input';import PhoneInput from'react-phone-number-input/mobile';import{getCountries}from'react-phone-number-input/input';import en from'react-phone-number-input/locale/en';import de from'react-phone-number-input/locale/de';import es from'react-phone-number-input/locale/es';import fr from'react-phone-number-input/locale/fr';import pt from'react-phone-number-input/locale/pt';import flags from'react-phone-number-input/flags';import TextField from'@shopgate/pwa-ui-shared/TextField';import{useCountriesNames}from'@shopgate/engage/i18n';import{FulfillmentContext}from"../../locations.context";import{formField,phoneField,phoneFieldError,phoneFieldErrorText}from"./ReserveForm.style";import connect from"./ReserveFormPhone.connector";var builtInCountries=getCountries();var locales={en:en,de:de,es:es,fr:fr,pt:pt};/**
+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,{useMemo,useContext,memo,useCallback}from'react';import PropTypes from'prop-types';import classnames from'classnames';import{i18n}from'@shopgate/engage/core';import{parsePhoneNumber}from'react-phone-number-input';import PhoneInput from'react-phone-number-input/mobile';import{getCountries}from'react-phone-number-input/input';import en from'react-phone-number-input/locale/en';import de from'react-phone-number-input/locale/de';import es from'react-phone-number-input/locale/es';import fr from'react-phone-number-input/locale/fr';import pt from'react-phone-number-input/locale/pt';import flags from'react-phone-number-input/flags';import TextField from'@shopgate/pwa-ui-shared/TextField';import{useCountriesNames}from'@shopgate/engage/i18n';import{FulfillmentContext}from"../../locations.context";import{formField,phoneField,phoneFieldError,phoneFieldErrorText}from"./ReserveForm.style";import connect from"./ReserveFormPhone.connector";/**
+ * @typedef {import('./ReserveFormPhone.types').OwnProps} OwnProps
+ * @typedef {import('./ReserveFormPhone.types').StateProps} StateProps
+ */ /**
+ * @typedef {OwnProps & StateProps} Props
+ */var builtInCountries=getCountries();var locales={en:en,de:de,es:es,fr:fr,pt:pt};/**
  * Renders the reserve form phone input maybe with country selection.
- * @param {Object} props The component props.
+ * @param {Props} props The component props.
  * @returns {JSX.Element}
- */var ReserveFormPhoneUnwrapped=React.memo(function(props){var name=props.name,value=props.value,onChange=props.onChange,label=props.label,errorText=props.errorText,userLocation=props.userLocation;var _React$useContext=React.useContext(FulfillmentContext),shopSettings=_React$useContext.shopSettings,userInput=_React$useContext.userInput;var initialValue=React.useMemo(function(){return userInput&&userInput[name]?userInput[name]:'';},[name,userInput]);var supportedCountries=React.useMemo(function(){return shopSettings?shopSettings.supportedCountries:[];},[shopSettings]);var countries=React.useMemo(function(){if(!supportedCountries){return builtInCountries;}var sortedCountries=[].concat(builtInCountries);var sanitizedSupportedCountries=supportedCountries.map(function(country){var pieces=country.split('_');return pieces[0];});sanitizedSupportedCountries.forEach(function(country){sortedCountries.splice(sortedCountries.indexOf(country),1);});return[].concat(sanitizedSupportedCountries,sortedCountries);},[supportedCountries]);var countriesNames=useCountriesNames(supportedCountries,locales);var labels=React.useMemo(function(){var output={};if(!countries){return output;}countries.forEach(function(key){var pieces=key.split('_');output[pieces[0]]=countriesNames[key];});return output;},[countries,countriesNames]);var defaultCountry=React.useMemo(function(){if(!initialValue&&!value&&userLocation){return userLocation.country;}var phoneNumber=parsePhoneNumber(value||'');if(phoneNumber&&phoneNumber.country){return phoneNumber.country;}if(userLocation){return userLocation.country;}return i18n.getLang().split('-')[1];},[initialValue,userLocation,value]);var handleChange=React.useCallback(function(phoneValue){onChange(phoneValue,{target:{name:name}});},[name,onChange]);var phoneClasses=classnames(_defineProperty(_defineProperty({},phoneField,true),phoneFieldError,!!errorText));if(!countries||countries.length===0){return React.createElement(TextField,{name:name,value:value,onChange:onChange,label:label,className:formField,errorText:errorText});}return React.createElement("div",{className:phoneClasses},React.createElement(PhoneInput,{defaultCountry:defaultCountry,addInternationalOption:false,flags:flags,name:name,value:value||'',onChange:handleChange,placeholder:label,countries:countries,labels:labels}),!!errorText&&React.createElement("div",{className:phoneFieldErrorText},errorText));});export var ReserveFormPhone=connect(ReserveFormPhoneUnwrapped);
+ */var ReserveFormPhoneUnwrapped=memo(function(props){var name=props.name,value=props.value,onChange=props.onChange,label=props.label,errorText=props.errorText,userLocation=props.userLocation;var _useContext=useContext(FulfillmentContext),shopSettings=_useContext.shopSettings,userInput=_useContext.userInput;var initialValue=useMemo(function(){return userInput&&userInput[name]?userInput[name]:'';},[name,userInput]);var supportedCountries=useMemo(function(){return shopSettings?shopSettings.supportedCountries:[];},[shopSettings]);var countries=useMemo(function(){if(!supportedCountries){return builtInCountries;}var sortedCountries=[].concat(builtInCountries);var sanitizedSupportedCountries=supportedCountries.map(function(country){var pieces=country.split('_');return pieces[0];});sanitizedSupportedCountries.forEach(function(country){sortedCountries.splice(sortedCountries.indexOf(country),1);});return[].concat(sanitizedSupportedCountries,sortedCountries);},[supportedCountries]);var countriesNames=useCountriesNames(supportedCountries,locales);var labels=useMemo(function(){var output={};if(!countries||!Array.isArray(countries)||countries.length===0){return output;}countries.forEach(function(key){var pieces=key.split('_');output[pieces[0]]=countriesNames[key];});return output;},[countries,countriesNames]);var defaultCountry=useMemo(function(){if(!initialValue&&!value&&userLocation){return userLocation.country;}var phoneNumber=parsePhoneNumber(value||'');if(phoneNumber&&phoneNumber.country){return phoneNumber.country;}if(userLocation&&userLocation.country){return userLocation.country;}return i18n.getLang().split('-')[1];},[initialValue,userLocation,value]);var handleChange=useCallback(function(phoneValue){onChange(phoneValue,{target:{name:name}});},[name,onChange]);var phoneClasses=classnames(_defineProperty(_defineProperty({},phoneField,true),phoneFieldError,!!errorText));if(!countries||countries.length===0){return React.createElement(TextField,{name:name,value:value,onChange:onChange,label:label,className:formField,errorText:errorText});}return React.createElement("div",{className:phoneClasses},React.createElement(PhoneInput,{defaultCountry:defaultCountry,addInternationalOption:false,flags:flags,name:name,value:value||'',onChange:handleChange,placeholder:label,countries:countries,labels:labels}),!!errorText&&React.createElement("div",{className:phoneFieldErrorText},errorText));});ReserveFormPhoneUnwrapped.defaultProps={errorText:'',userLocation:null,value:''};export var ReserveFormPhone=connect(ReserveFormPhoneUnwrapped);

package/locations/components/ReserveForm/ReserveFormPhone.types.js

@@ -0,0 +1,11 @@
+/**
+ * @typedef {Object} OwnProps
+ * @property {string} name
+ * @property {string} value
+ * @property {string} label
+ * @property {string} errorText
+ * @property {(value: string, event: any) => void} onChange
+ */ /**
+ * @typedef {Object} StateProps
+ * @property {Object<string, any> | null} userLocation
+ */

package/locations/components/StoreFinder/Store.context.js

@@ -1 +1,3 @@
-import{createContext}from'react';export var StoreContext=createContext({});
+import{createContext}from'react';/**
+ * @typedef {import('../../locations.types').Location} Location
+ */export var StoreContext=createContext(/** @type {Location} */{});

package/locations/components/StoreFinder/StoreFinderLocation.js

@@ -1,3 +1,3 @@
 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,useMemo}from'react';import classNames from'classnames';import{StoreContext}from"./Store.context";import{StoreFinderContext}from"../../locations.context";import StoreFinderLocationHeader from"./StoreFinderLocationHeader";import{container,selected}from"./StoreFinderLocation.style";import{StoreFinderSelectLocationButton}from"./StoreFinderSelectLocationButton";import StoreFinderStoreInfoButton from"./StoreFinderStoreInfoButton";/**
- * @returns {JSX}
+ * @returns {JSX.Element}
  */var StoreFinderLocation=function StoreFinderLocation(){var store=useContext(StoreContext);var _useContext=useContext(StoreFinderContext),selectedLocation=_useContext.selectedLocation;var isSelected=useMemo(function(){var _ref=selectedLocation||{},code=_ref.code;return store.code===code;},[selectedLocation,store.code]);return React.createElement("div",{className:classNames(container,_defineProperty({},selected,isSelected)),"data-location-code":store.code},React.createElement(StoreFinderLocationHeader,null),React.createElement(StoreFinderSelectLocationButton,null),React.createElement(StoreFinderStoreInfoButton,null));};export default StoreFinderLocation;

package/locations/components/StoreList/Store.context.js

@@ -1 +1,3 @@
-import{createContext}from'react';export var StoreContext=createContext({});
+/**
+ * @typedef {import('../../locations.types').Location} Location
+ */import{createContext}from'react';export var StoreContext=createContext(/** @type {Location} */{});

package/locations/index.js

@@ -5,5 +5,5 @@ export{PRODUCT_FULFILLMENT_SELECTOR,PRODUCT_LOCATION_STOCK_INFO,DIRECT_SHIP,DIRE
 export*from"./selectors";// STREAMS
 export{submitReservationSuccess$,preferredLocationDidUpdate$,preferredLocationDidUpdateGlobal$,preferredLocationDidUpdateGlobalNotOnCategory$,preferredLocationDidUpdateGlobalOnCategory$,preferredLocationDidUpdateGlobalNotOnSearch$,preferredLocationDidUpdateGlobalOnSearch$,sendDefaultLocationCodeSuccess$}from"./locations.streams";// HOOKS
 export{useFulfillmentState}from"./locations.hooks";// TYPES
-// CONTEXT
+export{}from/** @typedef {import('./locations.types').LocationAddress} */ /** @typedef {import('./locations.types').Location} */ /** @typedef {import('./locations.types').LocationsByIdState} */ /** @typedef {import('./locations.types').LocationsByProductIdState} */ /** @typedef {import('./locations.types').FulfillmentPath} */ /** @typedef {import('./locations.types').UserLocationState} */ /** @typedef {import('./locations.types').ReservationFormValues} */ /** @typedef {import('./locations.types').UserLocationFulfillmentMethod} */ /** @typedef {import('./locations.types').UserLocationLocationCode} */ /** @typedef {import('./locations.types').UserFormInputState} */ /** @typedef {import('./locations.types').LocationsState} */ /** @typedef {import('./locations.types').SheetStage} */ /** @typedef {import('./locations.types').SheetCallbackFn} */ /** @typedef {import('./locations.types').SheetOpenParams} */ /** @typedef {import('./locations.types').ReservationResponse} */ /** @typedef {import('./locations.types').LocationOperationHours} */ /** @typedef {import('./locations.types').LocationAware} */ /** @typedef {import('./locations.types').OptionalLocationAware} */"./locations.types";// CONTEXT
 export{FulfillmentContext}from"./locations.context";

package/locations/locations.context.js

@@ -1 +1,32 @@
-import{createContext}from'react';import{STAGE_SELECT_STORE}from"./constants";export var FulfillmentContext=createContext({selectLocation:function selectLocation(){return Promise.resolve();},selectStoreFinderLocation:function selectStoreFinderLocation(){},changeFulfillment:function changeFulfillment(){},sendReservation:function sendReservation(){return Promise.resolve();},isStage:function isStage(){return false;},handleOpen:function handleOpen(){},handleClose:function handleClose(){},setIsLoading:function setIsLoading(){},location:null,storeFinderLocation:null,locations:[],orderNumbers:[],baseProduct:null,product:null,userInput:null,stage:STAGE_SELECT_STORE,title:null,fulfillmentPath:null,fulfillmentMethods:null,enabledFulfillmentMethods:null,shopSettings:null,isOpen:false,errors:null,noLocationSelection:false,isStoreFinder:false,isLoading:false});export var StoreFinderContext=createContext({});
+import{createContext}from'react';import{STAGE_SELECT_STORE}from"./constants";/* eslint-disable max-len */ /** @typedef {import('@shopgate/engage/locations/locations.types').Location} Location */ /** @typedef {import('@shopgate/engage/locations/locations.types').ReservationFormValues} ReservationFormValues */ /** @typedef {import('@shopgate/engage/locations/locations.types').SheetStage} SheetStage */ /** @typedef {import('@shopgate/engage/locations/locations.types').FulfillmentPath} FulfillmentPath */ /** @typedef {import('@shopgate/engage/locations/locations.types').SheetOpenParams} SheetOpenParams */ /** @typedef {import('@shopgate/engage/locations/locations.types').SheetCallbackFn} SheetCallbackFn */ /** @typedef {import('../product/product.types').Product} Product */ /** @typedef {import('../core/config/config.types').ShopSettings} ShopSettings */ /* eslint-enable max-len */ /**
+ * @typedef {Object} FulfillmentContextProps
+ * @property {function(Location): Promise<void>} selectLocation
+ * @property {function(Location): void} selectStoreFinderLocation
+ * @property {(method: string, cartItem: Object<string, any>) => void} changeFulfillment
+ * @property {function(ReservationFormValues): Promise<void>} sendReservation
+ * @property {function(SheetStage): boolean} isStage
+ * @property {function(SheetOpenParams): void} handleOpen
+ * @property {(isLoading: boolean) => void} setIsLoading
+ * @property {SheetCallbackFn} handleClose
+ * @property {Location|null} location
+ * @property {Location|null} storeFinderLocation
+ * @property {Location[]|null} locations
+ * @property {string[]|null} orderNumbers
+ * @property {Product|null} baseProduct
+ * @property {Product|null} product
+ * @property {ReservationFormValues|null} userInput
+ * @property {SheetStage|null} stage
+ * @property {string|null} title
+ * @property {FulfillmentPath|null} fulfillmentPath
+ * @property {string[]|null} fulfillmentMethods
+ * @property {string[]|null} enabledFulfillmentMethods
+ * @property {ShopSettings|null} shopSettings
+ * @property {boolean} isOpen
+ * @property {string[]|null} errors
+ * @property {boolean} [noLocationSelection]
+ * @property {boolean} [isStoreFinder]
+ * @property {boolean} [isLoading]
+ * @property {Object} [meta]
+ */export var FulfillmentContext=createContext(/** @type {FulfillmentContextProps} */{selectLocation:function selectLocation(){return Promise.resolve();},selectStoreFinderLocation:function selectStoreFinderLocation(){},changeFulfillment:function changeFulfillment(){},sendReservation:function sendReservation(){return Promise.resolve();},isStage:function isStage(){return false;},handleOpen:function handleOpen(){},handleClose:function handleClose(){},setIsLoading:function setIsLoading(){},location:null,storeFinderLocation:null,locations:[],orderNumbers:[],baseProduct:null,product:null,userInput:null,stage:STAGE_SELECT_STORE,title:null,fulfillmentPath:null,fulfillmentMethods:null,enabledFulfillmentMethods:null,shopSettings:null,isOpen:false,errors:null,noLocationSelection:false,isStoreFinder:false,isLoading:false});/**
+ * @typedef {Object} StoreFinderContextProps
+ */export var StoreFinderContext=createContext(/** @type {StoreFinderContextProps} */{});

package/locations/locations.types.js

@@ -1 +1,130 @@
-import{DIRECT_SHIP,ROPIS,BOPIS,STAGE_SELECT_STORE,STAGE_RESERVE_FORM,STAGE_RESPONSE_SUCCESS,STAGE_RESPONSE_ERROR,QUICK_RESERVE,MULTI_LINE_RESERVE}from"./constants";
+/**
+ * @typedef {Object} LocationType
+ * @property {string} code
+ * @property {string} name
+ */ /**
+ * @typedef {Object} LocationOperationHours
+ * @property {string|null} sun
+ * @property {string|null} mon
+ * @property {string|null} tue
+ * @property {string|null} wed
+ * @property {string|null} thu
+ * @property {string|null} fri
+ * @property {string|null} sat
+ */ /**
+ * @typedef {Object} LocationProductInventory
+ * @property {boolean} isAvailable
+ * @property {number|null} visible
+ */ /**
+ * @typedef {Object} LocationAddress
+ * @property {string} code
+ * @property {string} name
+ * @property {string} street
+ * @property {string|null} street2
+ * @property {string|null} street3
+ * @property {string|null} street4
+ * @property {string} postalCode
+ * @property {string} city
+ * @property {string} region
+ * @property {string} country
+ * @property {string} [phoneNumber]
+ * @property {string} [faxNumber]
+ * @property {string} [emailAddress]
+ * @property {boolean} isPrimary
+ */ /**
+ * @typedef {Object} Location
+ * @property {string|null} code
+ * @property {string|null} name
+ * @property {string} [status]
+ * @property {string[]} [supportedFulfillmentMethods]
+ * @property {number} [latitude]
+ * @property {number} [longitude]
+ * @property {string} [timeZone]
+ * @property {string} [localeCode]
+ * @property {boolean} [isComingSoon]
+ * @property {boolean} [isDefault]
+ * @property {LocationType} [type]
+ * @property {LocationOperationHours} [operationHours]
+ * @property {LocationAddress} [address]
+ * @property {LocationAddress[]} [addresses]
+ * @property {LocationProductInventory} [productInventory]
+ * @property {number} [distance]
+ * @property {string} [unitSystem]
+ * @property {Object} [inventory]
+ */ /**
+ * @typedef {Object} LocationAware
+ * @property {Location} location
+ * @property {string|null} [fulfillmentMethod]
+ */ /**
+ * @typedef {Object} OptionalLocationAware
+ * @property {Location|null} [location]
+ * @property {string|null} [fulfillmentMethod]
+ */ /**
+ * @typedef {Object} ProductLocations
+ * @property {boolean} isFetching
+ * @property {number} expires
+ * @property {Location[]} locations
+ */ /**
+ * @typedef {Object<string, Location>} LocationsByIdState
+ */ /**
+ * @typedef {Object<string, ProductLocations>} LocationsByProductIdState
+ */ /**
+ * @typedef {Object} UserLocationState
+ * @property {string|null} code
+ * @property {string|null} name
+ * @property {string|null} productCode
+ * @property {number|null} visibleInventory
+ * @property {string|null} addressCode
+ * @property {string|null} fulfillmentMethod
+ */ /**
+ * @typedef {Object} ReservationFormValues
+ * @property {string} [firstName]
+ * @property {string} [lastName]
+ * @property {string} [cellPhone]
+ * @property {string} [email]
+ * @property {string} [firstName2]
+ * @property {string} [lastName2]
+ * @property {string} [cellPhone2]
+ * @property {string} [email2]
+ */ /**
+ * @typedef {Object<string, string|null>} UserFormInputState
+ */ /**
+ * @typedef {(
+ *   typeof import('./constants').QUICK_RESERVE |
+ *   typeof import('./constants').MULTI_LINE_RESERVE
+ * )} FulfillmentPath
+ */ /**
+ * @callback SheetCallbackFn
+ * @param {import('../../locations.types').Location | null} location
+ * @param {string | null} productId
+ * @param {boolean | null} orderSuccess
+ * @returns {void}
+ */ /**
+ * @typedef {(typeof DIRECT_SHIP | typeof ROPIS| typeof BOPIS)} UserLocationFulfillmentMethod
+ */ /**
+ * @typedef {string | null} UserLocationLocationCode
+ */ /**
+ * @typedef {Object} LocationsState
+ * @property {LocationsByIdState|{}} locationsById
+ * @property {LocationsByProductIdState|{}} locationsByProductId
+ * @property {UserLocationState|{}} userLocation
+ * @property {ReservationFormValues} userFormInput
+ * @property {string} userSearchQuery
+ */ /**
+ * @typedef {(
+ *   typeof import('./constants').STAGE_SELECT_STORE |
+ *   typeof import('./constants').STAGE_RESERVE_FORM |
+ *   typeof import('./constants').STAGE_RESPONSE_SUCCESS |
+ *   typeof import('./constants').STAGE_RESPONSE_ERROR
+ * )} SheetStage
+ */ /**
+ * @typedef {Object} SheetOpenParams
+ * @property {SheetCallbackFn} [callback]
+ * @property {SheetStage} [stage]
+ * @property {FulfillmentPath} [fulfillmentPath]
+ * @property {boolean} [changeOnly]
+ */ /**
+ * @typedef {Object} ReservationResponse
+ * @property {string[]|null} orderNumbers
+ * @property {string[]|null} errors
+ */

package/locations/providers/FulfillmentProvider.connector.js

@@ -1,10 +1,14 @@
 import{connect}from'react-redux';import _showModal from'@shopgate/pwa-common/actions/modal/showModal';import{getBaseProduct,getProduct}from'@shopgate/pwa-common-commerce/product/selectors/product';import _addProductsToCart from'@shopgate/pwa-common-commerce/cart/actions/addProductsToCart';import _updateProductsInCart from'@shopgate/pwa-common-commerce/cart/actions/updateProductsInCart';import{getCartProducts,getActiveFulfillmentSlot,getActiveFulfillmentSlotLocationCode}from'@shopgate/engage/cart/cart.selectors';import{makeGetFulfillmentPaths,makeGetEnabledFulfillmentMethods,getShopSettings}from'@shopgate/engage/core/config';import{getRestrictMultiLocationOrders,getFulfillmentSchedulingEnabled}from'@shopgate/engage/core';import{selectLocation as _selectLocation,storeFormInput as _storeFormInput}from"../action-creators";import{getFilteredLocations,makeGetLocationInventory,makeGetLocationsForProduct,getPreferredLocation,getUserFormInput,getProductFulfillmentMethods,getIsFetching}from"../selectors";import{submitReservation as _submitReservation}from"../actions";/**
+ * @typedef {import('./FulfillmentProvider.types').OwnProps} OwnProps
+ * @typedef {import('./FulfillmentProvider.types').StateProps} StateProps
+ * @typedef {import('./FulfillmentProvider.types').DispatchProps} DispatchProps
+ */ /**
  * @returns {Function}
  */function makeMapStateToProps(){/* eslint-disable require-jsdoc */var getProductCode=function getProductCode(_,props){return props.variantId||props.productId||null;};/* eslint-enable require-jsdoc */var getInventory=makeGetLocationInventory(function(state,props){var _getPreferredLocation;return((_getPreferredLocation=getPreferredLocation(state,props))===null||_getPreferredLocation===void 0?void 0:_getPreferredLocation.code)||null;},getProductCode);var getProductLocations=makeGetLocationsForProduct(getProductCode);var getFulfillmentPaths=makeGetFulfillmentPaths();var getEnabledFulfillmentMethods=makeGetEnabledFulfillmentMethods();/**
-   * @param {Object} state The application state.
-   * @param {Object} props The component props.
+   * @param {StateProps} state The application state.
+   * @param {OwnProps} props The component props.
    * @returns {Object}
    */return function(state,props){return{locations:props.noProduct?getFilteredLocations(state,props):getProductLocations(state,props),baseProduct:getBaseProduct(state,props),product:getProduct(state,props),location:getPreferredLocation(state,props),inventory:getInventory(state,props),userInput:getUserFormInput(state),fulfillmentPaths:getFulfillmentPaths(state),fulfillmentMethods:getProductFulfillmentMethods(state,props),enabledFulfillmentMethods:getEnabledFulfillmentMethods(state,props),shopSettings:getShopSettings(state),isFetching:getIsFetching(state),restrictMultiLocationOrders:getRestrictMultiLocationOrders(state),cartProducts:getCartProducts(state),fulfillmentSchedulingEnabled:getFulfillmentSchedulingEnabled(state),activeFulfillmentSlot:getActiveFulfillmentSlot(state),activeFulfillmentSlotLocationCode:getActiveFulfillmentSlotLocationCode(state)};};}/**
- * @param {Function} dispatch The dispatch function.
+ * @param {DispatchProps} dispatch The dispatch function.
  * @returns {Object}
  */var mapDispatchToProps=function mapDispatchToProps(dispatch){return{selectLocation:function selectLocation(){return dispatch(_selectLocation.apply(void 0,arguments));},submitReservation:function submitReservation(){return dispatch(_submitReservation.apply(void 0,arguments));},storeFormInput:function storeFormInput(){return dispatch(_storeFormInput.apply(void 0,arguments));},addProductsToCart:function addProductsToCart(){return dispatch(_addProductsToCart.apply(void 0,arguments));},updateProductsInCart:function updateProductsInCart(){return dispatch(_updateProductsInCart.apply(void 0,arguments));},showModal:function showModal(){return dispatch(_showModal.apply(void 0,arguments));}};};export default connect(makeMapStateToProps,mapDispatchToProps);