@shopgate/engage 7.30.0-alpha.9 → 7.30.0-beta.2

package/locations/components/FulfillmentSelector/FulfillmentSelectorLocation.js

@@ -19,6 +19,7 @@ import FulfillmentSelectorAlternativeLocation from "./FulfillmentSelectorAlterna
  * The FulfillmentSelectorLocation component
  * @returns {JSX}
  */
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 export function FulfillmentSelectorLocation() {
   const {
     selection,
@@ -55,61 +56,78 @@ export function FulfillmentSelectorLocation() {
     return null;
   }
   const isRopeMethodEnabled = isROPISEnabled || isBOPISEnabled || selectionAvailableForProduct;
-  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(SurroundPortals, {
-    portalName: PRODUCT_FULFILLMENT_SELECTOR_LOCATION,
-    portalProps: {
-      productId,
-      location: usedLocation,
-      inventory
-    }
-  }, isRopeMethodEnabled && isOrderable && usedLocation && /*#__PURE__*/React.createElement(Grid, {
-    className: classNames(itemRow, container),
-    component: "div"
-  }, /*#__PURE__*/React.createElement(Grid, {
-    component: "div"
-  }, /*#__PURE__*/React.createElement(ResponsiveContainer, {
-    appAlways: true,
-    breakpoint: "xs"
-  }, /*#__PURE__*/React.createElement(Grid.Item, {
-    className: itemColumn,
-    grow: 1,
-    shrink: 0,
-    component: "div"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: locationName
-  }, usedLocation.name)), /*#__PURE__*/React.createElement(Grid.Item, {
-    className: itemColumn,
-    grow: 1,
-    shrink: 0,
-    component: "div"
-  }, /*#__PURE__*/React.createElement(StockInfo, {
-    productId: productId,
-    location: usedLocation
-  }))), /*#__PURE__*/React.createElement(ResponsiveContainer, {
-    webOnly: true,
-    breakpoint: ">xs"
-  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
-    className: locationName
-  }, usedLocation.name)), /*#__PURE__*/React.createElement("div", {
-    className: itemSpacer
-  }, /*#__PURE__*/React.createElement(StockInfo, {
-    productId: productId,
-    location: usedLocation
-  })))), selectionAvailableForProduct && !locationSupportsFulfillmentMethod ? /*#__PURE__*/React.createElement(FulfillmentSelectorLocationMethodNotAvailable, {
-    method: userFulfillmentMethod
-  }) : null, /*#__PURE__*/React.createElement(ChangeLocationButton, {
-    onClick: handleChangeLocation,
-    disabled: !selected
-  })), isRopeMethodEnabled && selected && !isOrderable && /*#__PURE__*/React.createElement("div", {
-    className: container
-  }, /*#__PURE__*/React.createElement("div", {
-    className: locationName
-  }, usedLocation?.name || ''), /*#__PURE__*/React.createElement(FulfillmentSelectorImpossibleError, null), /*#__PURE__*/React.createElement(ChangeLocationButton, {
-    onClick: handleChangeLocation
-  })), false && !isRopeMethodEnabled ? /*#__PURE__*/React.createElement("div", {
-    className: classNames(unavailable, container)
-  }, i18n.text('locations.no_available')) : null), /*#__PURE__*/React.createElement(FulfillmentSelectorAlternativeLocation, {
-    show: !!isRopeMethodEnabled && !!usedLocation && !!inventory && !isOrderable,
-    productId: productId
-  }));
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsxs(SurroundPortals, {
+      portalName: PRODUCT_FULFILLMENT_SELECTOR_LOCATION,
+      portalProps: {
+        productId,
+        location: usedLocation,
+        inventory
+      },
+      children: [isRopeMethodEnabled && isOrderable && usedLocation && /*#__PURE__*/_jsxs(Grid, {
+        className: classNames(itemRow, container),
+        component: "div",
+        children: [/*#__PURE__*/_jsxs(Grid, {
+          component: "div",
+          children: [/*#__PURE__*/_jsxs(ResponsiveContainer, {
+            appAlways: true,
+            breakpoint: "xs",
+            children: [/*#__PURE__*/_jsx(Grid.Item, {
+              className: itemColumn,
+              grow: 1,
+              shrink: 0,
+              component: "div",
+              children: /*#__PURE__*/_jsx("div", {
+                className: locationName,
+                children: usedLocation.name
+              })
+            }), /*#__PURE__*/_jsx(Grid.Item, {
+              className: itemColumn,
+              grow: 1,
+              shrink: 0,
+              component: "div",
+              children: /*#__PURE__*/_jsx(StockInfo, {
+                productId: productId,
+                location: usedLocation
+              })
+            })]
+          }), /*#__PURE__*/_jsxs(ResponsiveContainer, {
+            webOnly: true,
+            breakpoint: ">xs",
+            children: [/*#__PURE__*/_jsx("div", {
+              children: /*#__PURE__*/_jsx("div", {
+                className: locationName,
+                children: usedLocation.name
+              })
+            }), /*#__PURE__*/_jsx("div", {
+              className: itemSpacer,
+              children: /*#__PURE__*/_jsx(StockInfo, {
+                productId: productId,
+                location: usedLocation
+              })
+            })]
+          })]
+        }), selectionAvailableForProduct && !locationSupportsFulfillmentMethod ? /*#__PURE__*/_jsx(FulfillmentSelectorLocationMethodNotAvailable, {
+          method: userFulfillmentMethod
+        }) : null, /*#__PURE__*/_jsx(ChangeLocationButton, {
+          onClick: handleChangeLocation,
+          disabled: !selected
+        })]
+      }), isRopeMethodEnabled && selected && !isOrderable && /*#__PURE__*/_jsxs("div", {
+        className: container,
+        children: [/*#__PURE__*/_jsx("div", {
+          className: locationName,
+          children: usedLocation?.name || ''
+        }), /*#__PURE__*/_jsx(FulfillmentSelectorImpossibleError, {}), /*#__PURE__*/_jsx(ChangeLocationButton, {
+          onClick: handleChangeLocation
+        })]
+      }), false && !isRopeMethodEnabled ? /*#__PURE__*/_jsx("div", {
+        className: classNames(unavailable, container),
+        children: i18n.text('locations.no_available')
+      }) : null]
+    }), /*#__PURE__*/_jsx(FulfillmentSelectorAlternativeLocation, {
+      show: !!isRopeMethodEnabled && !!usedLocation && !!inventory && !isOrderable,
+      productId: productId
+    })]
+  });
 }

package/locations/components/FulfillmentSelector/FulfillmentSelectorLocationMethodNotAvailable.js

@@ -5,6 +5,7 @@ import { Availability } from '@shopgate/engage/components';
 import { i18n } from '@shopgate/engage/core';
 import { AVAILABILITY_STATE_ALERT } from '@shopgate/engage/product';
 import { ROPIS, BOPIS } from "../../constants";
+import { jsx as _jsx } from "react/jsx-runtime";
 export const container = css({
   fontSize: '0.625rem'
 }).toString();
@@ -27,7 +28,7 @@ export function FulfillmentSelectorLocationMethodNotAvailable({
   if (!label) {
     return null;
   }
-  return /*#__PURE__*/React.createElement(Availability, {
+  return /*#__PURE__*/_jsx(Availability, {
     className: container,
     showWhenAvailable: true,
     text: label,

package/locations/components/FulfillmentSelector/FulfillmentSelectorROPIS.js

@@ -9,6 +9,7 @@ import { useFulfillmentSelectorState } from "./FulfillmentSelector.hooks";
  * Renders the FulfillmentSelectorROPIS components.
  * @returns {JSX}
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 export function FulfillmentSelectorROPIS() {
   const {
     isROPISEnabled,
@@ -17,7 +18,8 @@ export function FulfillmentSelectorROPIS() {
   const classes = classNames({
     [itemRowDisabled.toString()]: !isReady || !isROPISEnabled
   });
-  return /*#__PURE__*/React.createElement("div", {
-    className: classes
-  }, i18n.text(IN_STORE_PICKUP_ROPIS_LABEL));
+  return /*#__PURE__*/_jsx("div", {
+    className: classes,
+    children: i18n.text(IN_STORE_PICKUP_ROPIS_LABEL)
+  });
 }

package/locations/components/FulfillmentSheet/FulfillmentSheet.js

@@ -9,12 +9,16 @@ import { FulfillmentSheetContent } from "./FulfillmentSheetContent";
  * @param {boolean} props.allowClose Whether the sheet can be closed via a button
  * @returns {JSX.Element}
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 export const FulfillmentSheet = ({
   allowClose = true,
   ...props
-}) => /*#__PURE__*/React.createElement(FulfillmentProvider, props, /*#__PURE__*/React.createElement(FulfillmentSheetContent, {
-  allowClose: allowClose
-}));
+}) => /*#__PURE__*/_jsx(FulfillmentProvider, {
+  ...props,
+  children: /*#__PURE__*/_jsx(FulfillmentSheetContent, {
+    allowClose: allowClose
+  })
+});
 FulfillmentSheet.defaultProps = {
   allowClose: true
 };

package/locations/components/FulfillmentSheet/FulfillmentSheetContent.js

@@ -15,6 +15,7 @@ import { sheet } from "./FulfillmentSheet.style";
  * @param {boolean} props.allowClose Whether the sheet can be closed via a button
  * @return {JSX.Element}
  */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const FulfillmentSheetContent = ({
   allowClose = true
 }) => {
@@ -25,15 +26,17 @@ export const FulfillmentSheetContent = ({
     handleClose,
     isLoading
   } = React.useContext(FulfillmentContext);
-  return /*#__PURE__*/React.createElement(SheetDrawer, {
+  return /*#__PURE__*/_jsx(SheetDrawer, {
     isOpen: isOpen,
     title: title,
     onDidClose: handleClose,
     allowClose: allowClose,
-    isLoading: isLoading
-  }, /*#__PURE__*/React.createElement("div", {
-    className: sheet
-  }, isStage(STAGE_SELECT_STORE) && /*#__PURE__*/React.createElement(StoreList, null), isStage(STAGE_RESERVE_FORM) && /*#__PURE__*/React.createElement(ReserveForm, null), isStage(STAGE_RESPONSE_SUCCESS) && /*#__PURE__*/React.createElement(ReservationSuccess, null), isStage(STAGE_RESPONSE_ERROR) && /*#__PURE__*/React.createElement(ReservationError, null), isStage(STAGE_FULFILLMENT_METHOD) && /*#__PURE__*/React.createElement(FulfillmentPath, null)));
+    isLoading: isLoading,
+    children: /*#__PURE__*/_jsxs("div", {
+      className: sheet,
+      children: [isStage(STAGE_SELECT_STORE) && /*#__PURE__*/_jsx(StoreList, {}), isStage(STAGE_RESERVE_FORM) && /*#__PURE__*/_jsx(ReserveForm, {}), isStage(STAGE_RESPONSE_SUCCESS) && /*#__PURE__*/_jsx(ReservationSuccess, {}), isStage(STAGE_RESPONSE_ERROR) && /*#__PURE__*/_jsx(ReservationError, {}), isStage(STAGE_FULFILLMENT_METHOD) && /*#__PURE__*/_jsx(FulfillmentPath, {})]
+    })
+  });
 };
 FulfillmentSheetContent.defaultProps = {
   allowClose: true

package/locations/components/FulfillmentSlotSwitcher/FulfillmentSlotDialog.js

@@ -16,6 +16,7 @@ import fetchFulfillmentSlots from "../../actions/fetchFulfillmentSlots";
  * Map state to props.
  * @returns {Function}
  */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const makeMapStateToProps = () => {
   const getFulfillmentSlotsForLocation = makeGetFulfillmentSlotsForLocation(state => getPreferredLocation(state)?.code || null);
   return state => ({
@@ -249,52 +250,62 @@ const FulfillmentSlotSheet = ({
   const handleChange = useCallback(() => {
     onChange(fulfillmentSlots.find(slot => slot.id === selectedSlot));
   }, [fulfillmentSlots, onChange, selectedSlot]);
-  return /*#__PURE__*/React.createElement(SheetDrawer, {
+  return /*#__PURE__*/_jsx(SheetDrawer, {
     isOpen: isOpen,
     title: i18n.text('locations.your_current_timeslot.dialog.title'),
     onDidClose: onClose,
-    allowClose: allowClose
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.root
-  }, /*#__PURE__*/React.createElement("span", {
-    className: styles.title
-  }, i18n.text('locations.your_current_timeslot.dialog.date')), /*#__PURE__*/React.createElement("div", {
-    className: styles.row
-  }, Object.keys(groupedSlots).map(date => /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    key: date,
-    className: classnames(styles.button, styles.buttonDate, {
-      [styles.buttonActive]: selectedDate === date
-    }),
-    onClick: () => setSelectedDate(date)
-  }, /*#__PURE__*/React.createElement("span", {
-    className: styles.buttonLabel
-  }, moment(date, 'YYYY-MM-DD').format('dddd'), ' ', getMonthDay(date))))), slotGroups && slotGroups.map(group => /*#__PURE__*/React.createElement(Fragment, {
-    key: group.name
-  }, /*#__PURE__*/React.createElement("span", {
-    className: styles.subtitle
-  }, i18n.text(`locations.your_current_timeslot.dialog.${group.name}`)), /*#__PURE__*/React.createElement("div", {
-    className: styles.row
-  }, group.slots.map(slot => /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    key: `${slot.from}-${slot.to}`,
-    onClick: () => setSelectedSlot(slot.id),
-    className: classnames(styles.button, {
-      [styles.buttonDisabled]: slot.status !== 'active',
-      [styles.buttonActive]: slot.id === selectedSlot
+    allowClose: allowClose,
+    children: /*#__PURE__*/_jsxs("div", {
+      className: styles.root,
+      children: [/*#__PURE__*/_jsx("span", {
+        className: styles.title,
+        children: i18n.text('locations.your_current_timeslot.dialog.date')
+      }), /*#__PURE__*/_jsx("div", {
+        className: styles.row,
+        children: Object.keys(groupedSlots).map(date => /*#__PURE__*/_jsx("button", {
+          type: "button",
+          className: classnames(styles.button, styles.buttonDate, {
+            [styles.buttonActive]: selectedDate === date
+          }),
+          onClick: () => setSelectedDate(date),
+          children: /*#__PURE__*/_jsxs("span", {
+            className: styles.buttonLabel,
+            children: [moment(date, 'YYYY-MM-DD').format('dddd'), ' ', getMonthDay(date)]
+          })
+        }, date))
+      }), slotGroups && slotGroups.map(group => /*#__PURE__*/_jsxs(Fragment, {
+        children: [/*#__PURE__*/_jsx("span", {
+          className: styles.subtitle,
+          children: i18n.text(`locations.your_current_timeslot.dialog.${group.name}`)
+        }), /*#__PURE__*/_jsx("div", {
+          className: styles.row,
+          children: group.slots.map(slot => /*#__PURE__*/_jsxs("button", {
+            type: "button",
+            onClick: () => setSelectedSlot(slot.id),
+            className: classnames(styles.button, {
+              [styles.buttonDisabled]: slot.status !== 'active',
+              [styles.buttonActive]: slot.id === selectedSlot
+            }),
+            children: [/*#__PURE__*/_jsx("span", {
+              className: styles.buttonLabelSlot,
+              children: getRange(slot.from, slot.to)
+            }), slot.status !== 'active' ? /*#__PURE__*/_jsx("div", {
+              className: styles.buttonStrikethrough
+            }) : null]
+          }, `${slot.from}-${slot.to}`))
+        })]
+      }, group.name)), /*#__PURE__*/_jsx("div", {
+        className: styles.buttonScheduleContainer,
+        children: /*#__PURE__*/_jsx(Button, {
+          className: styles.buttonSchedule,
+          type: "secondary",
+          onClick: handleChange,
+          disabled: !selectedDate || !selectedSlot,
+          children: i18n.text('locations.your_current_timeslot.dialog.schedule')
+        })
+      })]
     })
-  }, /*#__PURE__*/React.createElement("span", {
-    className: styles.buttonLabelSlot
-  }, getRange(slot.from, slot.to)), slot.status !== 'active' ? /*#__PURE__*/React.createElement("div", {
-    className: styles.buttonStrikethrough
-  }) : null))))), /*#__PURE__*/React.createElement("div", {
-    className: styles.buttonScheduleContainer
-  }, /*#__PURE__*/React.createElement(Button, {
-    className: styles.buttonSchedule,
-    type: "secondary",
-    onClick: handleChange,
-    disabled: !selectedDate || !selectedSlot
-  }, i18n.text('locations.your_current_timeslot.dialog.schedule')))));
+  });
 };
 FulfillmentSlotSheet.defaultProps = {
   isOpen: false,

package/locations/components/FulfillmentSlotSwitcher/FulfillmentSlotProvider.js

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import { UIEvents } from '@shopgate/pwa-core';
 import Dialog from "./FulfillmentSlotDialog";
 import connect from "./FulfillmentSlotProvider.connector";
+import { jsx as _jsx } from "react/jsx-runtime";
 const EVENT_FORCE_OPEN = 'FULFILLMENT_SLOT_FORCE_OPEN';
 
 /**
@@ -50,7 +51,6 @@ const FulfillmentSlotProvider = ({
     setFulfillmentSlot(slot);
     if (promiseRef.current?.resolve) {
       setTimeout(() => {
-        // eslint-disable-next-line no-unused-expressions
         promiseRef.current?.resolve(slot);
         promiseRef.current = null;
       }, 10);
@@ -60,7 +60,7 @@ const FulfillmentSlotProvider = ({
   if (!isFulfillmentScheduling) {
     return null;
   }
-  return /*#__PURE__*/React.createElement(Dialog, {
+  return /*#__PURE__*/_jsx(Dialog, {
     allowClose: allowClose,
     isOpen: isOpen,
     onClose: handleClose,

package/locations/components/FulfillmentSlotSwitcher/FulfillmentSlotSwitcher.js

@@ -1,10 +1,11 @@
-import React, { Fragment, useCallback } from 'react';
+import React, { useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { css } from 'glamor';
 import FulfillmentSlotSwitcherDefault from "./FulfillmentSlotSwitcherDefault";
 import FulfillmentSlotSwitcherBar from "./FulfillmentSlotSwitcherBar";
 import connect from "./FulfillmentSlotSwitcher.connector";
 import { forceOpenFulfillmentSlotDialog } from "./FulfillmentSlotProvider";
+import { jsx as _jsx } from "react/jsx-runtime";
 const styles = {
   card: css({
     boxShadow: '0px 4px 2px rgba(0, 0, 0, 0.05)',
@@ -40,19 +41,20 @@ const FulfillmentSlotSwitcher = ({
   if (!isFulfillmentScheduling) {
     return null;
   }
-  return /*#__PURE__*/React.createElement(Fragment, null, renderBar ? /*#__PURE__*/React.createElement("div", {
-    className: card ? styles.card : undefined
-  }, /*#__PURE__*/React.createElement(FulfillmentSlotSwitcherBar, {
+  return renderBar ? /*#__PURE__*/_jsx("div", {
+    className: card ? styles.card : undefined,
+    children: /*#__PURE__*/_jsx(FulfillmentSlotSwitcherBar, {
+      fulfillmentSlot: isFulfillmentSlotValid ? fulfillmentSlot : null,
+      handleChange: handleOpen,
+      standalone: standalone,
+      editable: editable
+    })
+  }) : /*#__PURE__*/_jsx(FulfillmentSlotSwitcherDefault, {
     fulfillmentSlot: isFulfillmentSlotValid ? fulfillmentSlot : null,
     handleChange: handleOpen,
     standalone: standalone,
     editable: editable
-  })) : /*#__PURE__*/React.createElement(FulfillmentSlotSwitcherDefault, {
-    fulfillmentSlot: isFulfillmentSlotValid ? fulfillmentSlot : null,
-    handleChange: handleOpen,
-    standalone: standalone,
-    editable: editable
-  }));
+  });
 };
 FulfillmentSlotSwitcher.defaultProps = {
   isFulfillmentScheduling: false,

package/locations/components/FulfillmentSlotSwitcher/FulfillmentSlotSwitcherBar.js

@@ -9,6 +9,7 @@ import { getTimeSlotDisplayText } from "./time";
 /**
  * @returns {JSX}
  */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const FulfillmentSlotSwitcherBar = ({
   fulfillmentSlot,
   handleChange,
@@ -16,24 +17,29 @@ const FulfillmentSlotSwitcherBar = ({
   editable
 }) => {
   const displayTime = useMemo(() => getTimeSlotDisplayText(fulfillmentSlot), [fulfillmentSlot]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: wrapper
-  }, /*#__PURE__*/React.createElement("div", {
-    className: classNames(inner, {
-      [innerStandalone]: standalone
+  return /*#__PURE__*/_jsx("div", {
+    className: wrapper,
+    children: /*#__PURE__*/_jsxs("div", {
+      className: classNames(inner, {
+        [innerStandalone]: standalone
+      }),
+      children: [/*#__PURE__*/_jsx("span", {
+        className: heading,
+        children: i18n.text('locations.your_current_timeslot.heading')
+      }), /*#__PURE__*/_jsx("span", {
+        className: name,
+        children: displayTime
+      }), editable && /*#__PURE__*/_jsx(RippleButton, {
+        onClick: handleChange,
+        type: "secondary",
+        className: button,
+        flat: true,
+        children: /*#__PURE__*/_jsx(I18n.Text, {
+          string: "locations.your_current_location.change"
+        })
+      })]
     })
-  }, /*#__PURE__*/React.createElement("span", {
-    className: heading
-  }, i18n.text('locations.your_current_timeslot.heading')), /*#__PURE__*/React.createElement("span", {
-    className: name
-  }, displayTime), editable && /*#__PURE__*/React.createElement(RippleButton, {
-    onClick: handleChange,
-    type: "secondary",
-    className: button,
-    flat: true
-  }, /*#__PURE__*/React.createElement(I18n.Text, {
-    string: "locations.your_current_location.change"
-  }))));
+  });
 };
 FulfillmentSlotSwitcherBar.defaultProps = {
   fulfillmentSlot: null,

package/locations/components/FulfillmentSlotSwitcher/FulfillmentSlotSwitcherDefault.js

@@ -8,27 +8,34 @@ import { getTimeSlotDisplayText } from "./time";
 /**
  * @returns {JSX}
  */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const FulfillmentSlotSwitcherDefault = ({
   handleChange,
   fulfillmentSlot,
   editable
 }) => {
   const displayTime = useMemo(() => getTimeSlotDisplayText(fulfillmentSlot), [fulfillmentSlot]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: wrapper
-  }, /*#__PURE__*/React.createElement("div", {
-    className: heading
-  }, i18n.text('locations.your_current_timeslot.heading')), /*#__PURE__*/React.createElement("div", {
-    className: name
-  }, /*#__PURE__*/React.createElement("span", null, displayTime), /*#__PURE__*/React.createElement(RippleButton, {
-    onClick: handleChange,
-    type: "secondary",
-    className: button,
-    disabled: !editable,
-    flat: true
-  }, /*#__PURE__*/React.createElement(I18n.Text, {
-    string: "locations.your_current_location.change"
-  }))));
+  return /*#__PURE__*/_jsxs("div", {
+    className: wrapper,
+    children: [/*#__PURE__*/_jsx("div", {
+      className: heading,
+      children: i18n.text('locations.your_current_timeslot.heading')
+    }), /*#__PURE__*/_jsxs("div", {
+      className: name,
+      children: [/*#__PURE__*/_jsx("span", {
+        children: displayTime
+      }), /*#__PURE__*/_jsx(RippleButton, {
+        onClick: handleChange,
+        type: "secondary",
+        className: button,
+        disabled: !editable,
+        flat: true,
+        children: /*#__PURE__*/_jsx(I18n.Text, {
+          string: "locations.your_current_location.change"
+        })
+      })]
+    })]
+  });
 };
 FulfillmentSlotSwitcherDefault.defaultProps = {
   fulfillmentSlot: null,

package/locations/components/GlobalLocationSelector/GlobalLocationSelector.js

@@ -13,6 +13,7 @@ import { STAGE_SELECT_STORE, MULTI_LINE_RESERVE } from "../../constants";
  * @param {Object} state State
  * @return {Object}
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 const mapStateToProps = state => ({
   currentRoute: getCurrentRoute(state),
   isLocationBasedShopping: getIsLocationBasedShopping(state),
@@ -66,7 +67,7 @@ const GlobalLocationSelector = ({
   if (!renderComponent) {
     return null;
   }
-  return /*#__PURE__*/React.createElement(FulfillmentSheet, {
+  return /*#__PURE__*/_jsx(FulfillmentSheet, {
     stage: STAGE_SELECT_STORE,
     fulfillmentPath: MULTI_LINE_RESERVE,
     allowClose: false,

package/locations/components/GlobalLocationSwitcher/GlobalLocationSwitcher.js

@@ -9,6 +9,7 @@ import connect from "./GlobalLocationSwitcher.connector";
 /**
  * @returns {JSX}
  */
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const GlobalLocationSwitcher = ({
   isLocationBasedShopping,
   preferredLocation,
@@ -33,26 +34,28 @@ const GlobalLocationSwitcher = ({
   if (!isLocationBasedShopping || !preferredLocation) {
     return null;
   }
-  return /*#__PURE__*/React.createElement(Fragment, null, renderBar ? /*#__PURE__*/React.createElement(GlobalLocationSwitcherBar, {
-    locationName: locationName,
-    handleChange: changeLocationHandler,
-    standalone: standalone
-  }) : /*#__PURE__*/React.createElement(GlobalLocationSwitcherDefault, {
-    locationName: locationName,
-    handleChange: changeLocationHandler,
-    standalone: standalone,
-    editable: editable
-  }), sheetOpen && /*#__PURE__*/React.createElement(FulfillmentSheet, {
-    stage: STAGE_SELECT_STORE,
-    fulfillmentPath: MULTI_LINE_RESERVE,
-    allowClose: true,
-    onClose: closeSheetHandler,
-    isInitialized: true,
-    noProduct: true,
-    noInventory: true,
-    changeOnly: true,
-    open: true
-  }));
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [renderBar ? /*#__PURE__*/_jsx(GlobalLocationSwitcherBar, {
+      locationName: locationName,
+      handleChange: changeLocationHandler,
+      standalone: standalone
+    }) : /*#__PURE__*/_jsx(GlobalLocationSwitcherDefault, {
+      locationName: locationName,
+      handleChange: changeLocationHandler,
+      standalone: standalone,
+      editable: editable
+    }), sheetOpen && /*#__PURE__*/_jsx(FulfillmentSheet, {
+      stage: STAGE_SELECT_STORE,
+      fulfillmentPath: MULTI_LINE_RESERVE,
+      allowClose: true,
+      onClose: closeSheetHandler,
+      isInitialized: true,
+      noProduct: true,
+      noInventory: true,
+      changeOnly: true,
+      open: true
+    })]
+  });
 };
 GlobalLocationSwitcher.defaultProps = {
   isLocationBasedShopping: false,