ordering-ui-external 10.2.2 → 10.3.1

package/_modules/themes/five/src/components/FavoriteList/index.js

@@ -110,9 +110,9 @@ var FavoriteListUI = function FavoriteListUI(props) {
     events.emit('go_to_page', data);
   };
   var _onProductClick = function onProductClick(product) {
-    var _product$category, _product$category$bus, _product$category2;
-    var slug = product === null || product === void 0 ? void 0 : (_product$category = product.category) === null || _product$category === void 0 ? void 0 : (_product$category$bus = _product$category.business) === null || _product$category$bus === void 0 ? void 0 : _product$category$bus.slug;
-    var categoryId = product === null || product === void 0 ? void 0 : (_product$category2 = product.category) === null || _product$category2 === void 0 ? void 0 : _product$category2.id;
+    var _product$category, _product$category2;
+    var slug = product === null || product === void 0 || (_product$category = product.category) === null || _product$category === void 0 || (_product$category = _product$category.business) === null || _product$category === void 0 ? void 0 : _product$category.slug;
+    var categoryId = product === null || product === void 0 || (_product$category2 = product.category) === null || _product$category2 === void 0 ? void 0 : _product$category2.id;
     var productId = product === null || product === void 0 ? void 0 : product.id;
     if (!categoryId && !productId) {
       if (businessUrlTemplate === '/store/:business_slug' || businessUrlTemplate === '/:business_slug') {
@@ -179,13 +179,13 @@ var FavoriteListUI = function FavoriteListUI(props) {
   var closeOrderModal = function closeOrderModal(e) {
     var outsideModal = !window.document.getElementById('app-modals') || !window.document.getElementById('app-modals').contains(e.target);
     if (outsideModal) {
-      var _reorderState$result, _reorderState$result2, _reorderState$result3;
-      var _businessId = 'businessId:' + (reorderState === null || reorderState === void 0 ? void 0 : (_reorderState$result = reorderState.result) === null || _reorderState$result === void 0 ? void 0 : _reorderState$result.business_id);
+      var _reorderState$result, _reorderState$result2;
+      var _businessId = 'businessId:' + (reorderState === null || reorderState === void 0 || (_reorderState$result = reorderState.result) === null || _reorderState$result === void 0 ? void 0 : _reorderState$result.business_id);
       sessionStorage.setItem('adjust-cart-products', _businessId);
       onRedirectPage && onRedirectPage({
         page: 'business',
         params: {
-          store: reorderState === null || reorderState === void 0 ? void 0 : (_reorderState$result2 = reorderState.result) === null || _reorderState$result2 === void 0 ? void 0 : (_reorderState$result3 = _reorderState$result2.business) === null || _reorderState$result3 === void 0 ? void 0 : _reorderState$result3.slug
+          store: reorderState === null || reorderState === void 0 || (_reorderState$result2 = reorderState.result) === null || _reorderState$result2 === void 0 || (_reorderState$result2 = _reorderState$result2.business) === null || _reorderState$result2 === void 0 ? void 0 : _reorderState$result2.slug
         }
       });
     }
@@ -194,7 +194,7 @@ var FavoriteListUI = function FavoriteListUI(props) {
     if (preorderBusiness) setIsPreorder(true);
   }, [preorderBusiness]);
   (0, _react.useEffect)(function () {
-    var _reorderState$result4;
+    var _reorderState$result3;
     if (!isOrder) return;
     if (reorderState !== null && reorderState !== void 0 && reorderState.error) {
       window.addEventListener('click', closeOrderModal);
@@ -202,18 +202,18 @@ var FavoriteListUI = function FavoriteListUI(props) {
         window.removeEventListener('click', closeOrderModal);
       };
     }
-    if (!(reorderState !== null && reorderState !== void 0 && reorderState.error) && (reorderState === null || reorderState === void 0 ? void 0 : reorderState.loading) === false && reorderState !== null && reorderState !== void 0 && (_reorderState$result4 = reorderState.result) !== null && _reorderState$result4 !== void 0 && _reorderState$result4.business_id) {
-      var _reorderState$result5, _orderState$carts, _orderState$carts$_bu, _favoriteList$favorit, _reorderState$result7;
-      var _businessId = 'businessId:' + (reorderState === null || reorderState === void 0 ? void 0 : (_reorderState$result5 = reorderState.result) === null || _reorderState$result5 === void 0 ? void 0 : _reorderState$result5.business_id);
-      var cartProducts = orderState === null || orderState === void 0 ? void 0 : (_orderState$carts = orderState.carts) === null || _orderState$carts === void 0 ? void 0 : (_orderState$carts$_bu = _orderState$carts[_businessId]) === null || _orderState$carts$_bu === void 0 ? void 0 : _orderState$carts$_bu.products;
+    if (!(reorderState !== null && reorderState !== void 0 && reorderState.error) && (reorderState === null || reorderState === void 0 ? void 0 : reorderState.loading) === false && reorderState !== null && reorderState !== void 0 && (_reorderState$result3 = reorderState.result) !== null && _reorderState$result3 !== void 0 && _reorderState$result3.business_id) {
+      var _reorderState$result4, _orderState$carts, _favoriteList$favorit, _reorderState$result6;
+      var _businessId = 'businessId:' + (reorderState === null || reorderState === void 0 || (_reorderState$result4 = reorderState.result) === null || _reorderState$result4 === void 0 ? void 0 : _reorderState$result4.business_id);
+      var cartProducts = orderState === null || orderState === void 0 || (_orderState$carts = orderState.carts) === null || _orderState$carts === void 0 || (_orderState$carts = _orderState$carts[_businessId]) === null || _orderState$carts === void 0 ? void 0 : _orderState$carts.products;
       var available = cartProducts.every(function (product) {
         return product.valid === true;
       });
-      var orderProducts = favoriteList === null || favoriteList === void 0 ? void 0 : (_favoriteList$favorit = favoriteList.favorites.find(function (order) {
-        var _reorderState$result6;
-        return (order === null || order === void 0 ? void 0 : order.id) === (reorderState === null || reorderState === void 0 ? void 0 : (_reorderState$result6 = reorderState.result) === null || _reorderState$result6 === void 0 ? void 0 : _reorderState$result6.orderId);
+      var orderProducts = favoriteList === null || favoriteList === void 0 || (_favoriteList$favorit = favoriteList.favorites.find(function (order) {
+        var _reorderState$result5;
+        return (order === null || order === void 0 ? void 0 : order.id) === (reorderState === null || reorderState === void 0 || (_reorderState$result5 = reorderState.result) === null || _reorderState$result5 === void 0 ? void 0 : _reorderState$result5.orderId);
       })) === null || _favoriteList$favorit === void 0 ? void 0 : _favoriteList$favorit.products;
-      if (available && reorderState !== null && reorderState !== void 0 && (_reorderState$result7 = reorderState.result) !== null && _reorderState$result7 !== void 0 && _reorderState$result7.uuid && (cartProducts === null || cartProducts === void 0 ? void 0 : cartProducts.length) === (orderProducts === null || orderProducts === void 0 ? void 0 : orderProducts.length)) {
+      if (available && reorderState !== null && reorderState !== void 0 && (_reorderState$result6 = reorderState.result) !== null && _reorderState$result6 !== void 0 && _reorderState$result6.uuid && (cartProducts === null || cartProducts === void 0 ? void 0 : cartProducts.length) === (orderProducts === null || orderProducts === void 0 ? void 0 : orderProducts.length)) {
         onRedirectPage && onRedirectPage({
           page: 'checkout',
           params: {
@@ -221,13 +221,13 @@ var FavoriteListUI = function FavoriteListUI(props) {
           }
         });
       } else {
-        var _reorderState$result8, _reorderState$result9;
+        var _reorderState$result7;
         sessionStorage.setItem('adjust-cart-products', _businessId);
         (cartProducts === null || cartProducts === void 0 ? void 0 : cartProducts.length) !== (orderProducts === null || orderProducts === void 0 ? void 0 : orderProducts.length) && sessionStorage.setItem('already-removed', 'removed');
         onRedirectPage && onRedirectPage({
           page: 'business',
           params: {
-            store: reorderState === null || reorderState === void 0 ? void 0 : (_reorderState$result8 = reorderState.result) === null || _reorderState$result8 === void 0 ? void 0 : (_reorderState$result9 = _reorderState$result8.business) === null || _reorderState$result9 === void 0 ? void 0 : _reorderState$result9.slug
+            store: reorderState === null || reorderState === void 0 || (_reorderState$result7 = reorderState.result) === null || _reorderState$result7 === void 0 || (_reorderState$result7 = _reorderState$result7.business) === null || _reorderState$result7 === void 0 ? void 0 : _reorderState$result7.slug
           }
         });
       }
@@ -251,12 +251,12 @@ var FavoriteListUI = function FavoriteListUI(props) {
       height: '44px'
     }
   }, t('ADD_FAVORITE', 'Add favorite'))), /*#__PURE__*/_react.default.createElement(_styles.FavoriteListWrapper, {
-    isLoading: (favoriteList === null || favoriteList === void 0 ? void 0 : favoriteList.loading) || (favoriteList === null || favoriteList === void 0 ? void 0 : (_favoriteList$favorit2 = favoriteList.favorites) === null || _favoriteList$favorit2 === void 0 ? void 0 : _favoriteList$favorit2.length) === 0
+    isLoading: (favoriteList === null || favoriteList === void 0 ? void 0 : favoriteList.loading) || (favoriteList === null || favoriteList === void 0 || (_favoriteList$favorit2 = favoriteList.favorites) === null || _favoriteList$favorit2 === void 0 ? void 0 : _favoriteList$favorit2.length) === 0
   }, /*#__PURE__*/_react.default.createElement(_styles.FavoriteListing, {
     isOrder: isOrder
   }, /*#__PURE__*/_react.default.createElement(_AutoScroll.AutoScroll, {
     scrollId: "favorite"
-  }, isBusiness && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !(favoriteList !== null && favoriteList !== void 0 && favoriteList.loading) && (favoriteList === null || favoriteList === void 0 ? void 0 : (_favoriteList$favorit3 = favoriteList.favorites) === null || _favoriteList$favorit3 === void 0 ? void 0 : _favoriteList$favorit3.map(function (business, i) {
+  }, isBusiness && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !(favoriteList !== null && favoriteList !== void 0 && favoriteList.loading) && (favoriteList === null || favoriteList === void 0 || (_favoriteList$favorit3 = favoriteList.favorites) === null || _favoriteList$favorit3 === void 0 ? void 0 : _favoriteList$favorit3.map(function (business, i) {
     var _orderState$options, _business$reviews;
     return /*#__PURE__*/_react.default.createElement(_BusinessController.BusinessController, {
       key: business.id,
@@ -264,13 +264,13 @@ var FavoriteListUI = function FavoriteListUI(props) {
       business: business,
       isBusinessOpen: business.open,
       handleCustomClick: handleClickBusiness,
-      orderType: orderState === null || orderState === void 0 ? void 0 : (_orderState$options = orderState.options) === null || _orderState$options === void 0 ? void 0 : _orderState$options.type,
+      orderType: orderState === null || orderState === void 0 || (_orderState$options = orderState.options) === null || _orderState$options === void 0 ? void 0 : _orderState$options.type,
       onPreorderBusiness: setPreorderBusiness,
       businessHeader: business === null || business === void 0 ? void 0 : business.header,
       businessFeatured: business === null || business === void 0 ? void 0 : business.featured,
       businessOffers: business === null || business === void 0 ? void 0 : business.offers,
       businessLogo: business === null || business === void 0 ? void 0 : business.logo,
-      businessReviews: business === null || business === void 0 ? void 0 : (_business$reviews = business.reviews) === null || _business$reviews === void 0 ? void 0 : _business$reviews.total,
+      businessReviews: business === null || business === void 0 || (_business$reviews = business.reviews) === null || _business$reviews === void 0 ? void 0 : _business$reviews.total,
       businessDeliveryPrice: business === null || business === void 0 ? void 0 : business.delivery_price,
       businessDeliveryTime: business === null || business === void 0 ? void 0 : business.delivery_time,
       businessPickupTime: business === null || business === void 0 ? void 0 : business.pickup_time,
@@ -285,9 +285,9 @@ var FavoriteListUI = function FavoriteListUI(props) {
       className: "card",
       business: {},
       isSkeleton: true,
-      orderType: orderState === null || orderState === void 0 ? void 0 : (_orderState$options2 = orderState.options) === null || _orderState$options2 === void 0 ? void 0 : _orderState$options2.type
+      orderType: orderState === null || orderState === void 0 || (_orderState$options2 = orderState.options) === null || _orderState$options2 === void 0 ? void 0 : _orderState$options2.type
     });
-  })), isProduct && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !(favoriteList !== null && favoriteList !== void 0 && favoriteList.loading) && (favoriteList === null || favoriteList === void 0 ? void 0 : (_favoriteList$favorit4 = favoriteList.favorites) === null || _favoriteList$favorit4 === void 0 ? void 0 : _favoriteList$favorit4.map(function (product, i) {
+  })), isProduct && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !(favoriteList !== null && favoriteList !== void 0 && favoriteList.loading) && (favoriteList === null || favoriteList === void 0 || (_favoriteList$favorit4 = favoriteList.favorites) === null || _favoriteList$favorit4 === void 0 ? void 0 : _favoriteList$favorit4.map(function (product, i) {
     return /*#__PURE__*/_react.default.createElement(_SingleProductCard.SingleProductCard, {
       key: "".concat(product.id, "_").concat(i),
       isSoldOut: product.inventoried && !product.quantity,
@@ -303,7 +303,7 @@ var FavoriteListUI = function FavoriteListUI(props) {
       key: "skeleton:".concat(i),
       isSkeleton: true
     });
-  })), isOrder && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !(favoriteList !== null && favoriteList !== void 0 && favoriteList.loading) && (favoriteList === null || favoriteList === void 0 ? void 0 : (_favoriteList$favorit5 = favoriteList.favorites) === null || _favoriteList$favorit5 === void 0 ? void 0 : _favoriteList$favorit5.map(function (order, i) {
+  })), isOrder && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !(favoriteList !== null && favoriteList !== void 0 && favoriteList.loading) && (favoriteList === null || favoriteList === void 0 || (_favoriteList$favorit5 = favoriteList.favorites) === null || _favoriteList$favorit5 === void 0 ? void 0 : _favoriteList$favorit5.map(function (order, i) {
     return /*#__PURE__*/_react.default.createElement(_SingleOrderCard.SingleOrderCard, {
       key: "".concat(order === null || order === void 0 ? void 0 : order.id, "_").concat(i),
       order: order,
@@ -323,7 +323,7 @@ var FavoriteListUI = function FavoriteListUI(props) {
       getOrderStatus: _utils.getOrderStatus,
       handleReorder: handleReorder
     });
-  })), isProfessional && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !(favoriteList !== null && favoriteList !== void 0 && favoriteList.loading) && (favoriteList === null || favoriteList === void 0 ? void 0 : (_favoriteList$favorit6 = favoriteList.favorites) === null || _favoriteList$favorit6 === void 0 ? void 0 : _favoriteList$favorit6.map(function (professional, i) {
+  })), isProfessional && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !(favoriteList !== null && favoriteList !== void 0 && favoriteList.loading) && (favoriteList === null || favoriteList === void 0 || (_favoriteList$favorit6 = favoriteList.favorites) === null || _favoriteList$favorit6 === void 0 ? void 0 : _favoriteList$favorit6.map(function (professional, i) {
     return /*#__PURE__*/_react.default.createElement(_SingleProfessionalCard.SingleProfessionalCard, {
       key: i,
       professional: professional,

package/_modules/themes/five/src/components/Footer/index.js

@@ -26,7 +26,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var Footer = function Footer(_ref) {
-  var _theme$my_products, _theme$my_products$co, _theme$my_products$co2, _theme$my_products$co3, _theme$my_products$co4, _configs$powered_by_o;
+  var _theme$my_products, _configs$powered_by_o;
   var isFooterPage = _ref.isFooterPage;
   var _useState = (0, _react.useState)({
       body: null,
@@ -47,8 +47,8 @@ var Footer = function Footer(_ref) {
   var _useLanguage = (0, _orderingComponentsExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
-  var footerContent = theme === null || theme === void 0 ? void 0 : (_theme$my_products = theme.my_products) === null || _theme$my_products === void 0 ? void 0 : (_theme$my_products$co = _theme$my_products.components) === null || _theme$my_products$co === void 0 ? void 0 : (_theme$my_products$co2 = _theme$my_products$co.theme_settings) === null || _theme$my_products$co2 === void 0 ? void 0 : (_theme$my_products$co3 = _theme$my_products$co2.components) === null || _theme$my_products$co3 === void 0 ? void 0 : (_theme$my_products$co4 = _theme$my_products$co3.values) === null || _theme$my_products$co4 === void 0 ? void 0 : _theme$my_products$co4.footer_content;
-  var enabledPoweredByOrdering = configs === null || configs === void 0 ? void 0 : (_configs$powered_by_o = configs.powered_by_ordering_module) === null || _configs$powered_by_o === void 0 ? void 0 : _configs$powered_by_o.value;
+  var footerContent = theme === null || theme === void 0 || (_theme$my_products = theme.my_products) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.components) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.theme_settings) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.components) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.values) === null || _theme$my_products === void 0 ? void 0 : _theme$my_products.footer_content;
+  var enabledPoweredByOrdering = configs === null || configs === void 0 || (_configs$powered_by_o = configs.powered_by_ordering_module) === null || _configs$powered_by_o === void 0 ? void 0 : _configs$powered_by_o.value;
   var getPage = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
       var source, _yield$ordering$pages, _yield$ordering$pages2, error, result;

package/_modules/themes/five/src/components/ForgotPasswordForm/index.js

@@ -28,7 +28,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var ForgotPasswordUI = function ForgotPasswordUI(props) {
-  var _props$beforeElements, _props$beforeComponen, _theme$images, _theme$images$logos, _props$beforeMidEleme, _props$beforeMidCompo, _formMethods$errors, _formMethods$errors2, _formMethods$errors2$, _formMethods$errors3, _formMethods$errors3$, _props$afterMidElemen, _props$afterMidCompon, _props$afterComponent, _props$afterElements;
+  var _props$beforeElements, _props$beforeComponen, _theme$images, _props$beforeMidEleme, _props$beforeMidCompo, _formMethods$errors, _formMethods$errors2, _formMethods$errors3, _props$afterMidElemen, _props$afterMidCompon, _props$afterComponent, _props$afterElements;
   var hanldeChangeInput = props.hanldeChangeInput,
     handleButtonForgotPasswordClick = props.handleButtonForgotPasswordClick,
     formState = props.formState,
@@ -114,7 +114,7 @@ var ForgotPasswordUI = function ForgotPasswordUI(props) {
   }, /*#__PURE__*/_react.default.createElement("h1", null, t('TITLE_FORGOT_PASSWORD', 'Forgot your password?')), /*#__PURE__*/_react.default.createElement(_styles.FormSide, {
     isPopup: isPopup
   }, /*#__PURE__*/_react.default.createElement("img", {
-    src: theme === null || theme === void 0 ? void 0 : (_theme$images = theme.images) === null || _theme$images === void 0 ? void 0 : (_theme$images$logos = _theme$images.logos) === null || _theme$images$logos === void 0 ? void 0 : _theme$images$logos.logotype,
+    src: theme === null || theme === void 0 || (_theme$images = theme.images) === null || _theme$images === void 0 || (_theme$images = _theme$images.logos) === null || _theme$images === void 0 ? void 0 : _theme$images.logotype,
     alt: "Logo",
     width: "200",
     height: "66",
@@ -131,7 +131,7 @@ var ForgotPasswordUI = function ForgotPasswordUI(props) {
     return /*#__PURE__*/_react.default.createElement(BeforeMidComponents, _extends({
       key: i
     }, props));
-  }), (formMethods === null || formMethods === void 0 ? void 0 : (_formMethods$errors = formMethods.errors) === null || _formMethods$errors === void 0 ? void 0 : _formMethods$errors.email) && /*#__PURE__*/_react.default.createElement(_styles.ValidationText, null, (_formMethods$errors2 = formMethods.errors) === null || _formMethods$errors2 === void 0 ? void 0 : (_formMethods$errors2$ = _formMethods$errors2.email) === null || _formMethods$errors2$ === void 0 ? void 0 : _formMethods$errors2$.message, " ", (formMethods === null || formMethods === void 0 ? void 0 : (_formMethods$errors3 = formMethods.errors) === null || _formMethods$errors3 === void 0 ? void 0 : (_formMethods$errors3$ = _formMethods$errors3.email) === null || _formMethods$errors3$ === void 0 ? void 0 : _formMethods$errors3$.type) === 'required' && '*'), /*#__PURE__*/_react.default.createElement(_Inputs.Input, {
+  }), (formMethods === null || formMethods === void 0 || (_formMethods$errors = formMethods.errors) === null || _formMethods$errors === void 0 ? void 0 : _formMethods$errors.email) && /*#__PURE__*/_react.default.createElement(_styles.ValidationText, null, (_formMethods$errors2 = formMethods.errors) === null || _formMethods$errors2 === void 0 || (_formMethods$errors2 = _formMethods$errors2.email) === null || _formMethods$errors2 === void 0 ? void 0 : _formMethods$errors2.message, " ", (formMethods === null || formMethods === void 0 || (_formMethods$errors3 = formMethods.errors) === null || _formMethods$errors3 === void 0 || (_formMethods$errors3 = _formMethods$errors3.email) === null || _formMethods$errors3 === void 0 ? void 0 : _formMethods$errors3.type) === 'required' && '*'), /*#__PURE__*/_react.default.createElement(_Inputs.Input, {
     type: "email",
     name: "email",
     "aria-label": "email",

package/_modules/themes/five/src/components/GiftCard/PurchaseGiftCard/index.js

@@ -8,6 +8,7 @@ exports.PurchaseGiftCard = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _orderingComponentsExternal = require("ordering-components-external");
 var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
+var _styledComponents = require("styled-components");
 var _Buttons = require("../../../styles/Buttons");
 var _RiRadioButtonFill = _interopRequireDefault(require("@meronex/icons/ri/RiRadioButtonFill"));
 var _MdRadioButtonUnchecked = _interopRequireDefault(require("@meronex/icons/md/MdRadioButtonUnchecked"));
@@ -34,16 +35,27 @@ var PurchaseGiftCardUI = function PurchaseGiftCardUI(props) {
     selectedProduct = props.selectedProduct,
     setSelectedProduct = props.setSelectedProduct,
     handleAccept = props.handleAccept;
+  var theme = (0, _styledComponents.useTheme)();
   var _useLanguage = (0, _orderingComponentsExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
+  var _useUtils = (0, _orderingComponentsExternal.useUtils)(),
+    _useUtils2 = _slicedToArray(_useUtils, 1),
+    optimizeImage = _useUtils2[0].optimizeImage;
   return /*#__PURE__*/_react.default.createElement(_styles.Container, null, /*#__PURE__*/_react.default.createElement("h2", null, t('PURCHASE_GIFT_CARD', 'Purchase gift card')), /*#__PURE__*/_react.default.createElement(_styles.GiftCardsListContainer, null, /*#__PURE__*/_react.default.createElement("p", null, t('SELECT_ONE_OPTION', 'Select one option')), /*#__PURE__*/_react.default.createElement(_styles.GiftCardsWrapper, null, productsListState.loading && _toConsumableArray(Array(5).keys()).map(function (i) {
     return /*#__PURE__*/_react.default.createElement(_styles.GiftCardItem, {
       key: i
-    }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
-      width: 150
+    }, /*#__PURE__*/_react.default.createElement(_styles.IconControl, null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 16,
+      height: 16
+    })), /*#__PURE__*/_react.default.createElement(_styles.CardImageStyled, null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 38,
+      height: 38
+    })), /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 100
     }));
   }), productsListState.products.map(function (product) {
+    var _theme$images;
     return /*#__PURE__*/_react.default.createElement(_styles.GiftCardItem, {
       key: product.id,
       onClick: function onClick() {
@@ -51,7 +63,9 @@ var PurchaseGiftCardUI = function PurchaseGiftCardUI(props) {
       }
     }, /*#__PURE__*/_react.default.createElement(_styles.IconControl, null, (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.id) === product.id ? /*#__PURE__*/_react.default.createElement(_RiRadioButtonFill.default, null) : /*#__PURE__*/_react.default.createElement(_MdRadioButtonUnchecked.default, {
       disabled: true
-    })), /*#__PURE__*/_react.default.createElement("span", null, product.name));
+    })), /*#__PURE__*/_react.default.createElement(_styles.CardImage, {
+      bgimage: optimizeImage((product === null || product === void 0 ? void 0 : product.image) || (theme === null || theme === void 0 || (_theme$images = theme.images) === null || _theme$images === void 0 || (_theme$images = _theme$images.dummies) === null || _theme$images === void 0 ? void 0 : _theme$images.product), 'h_86,c_limit')
+    }), /*#__PURE__*/_react.default.createElement("span", null, product.name));
   }), !productsListState.loading && productsListState.products.length === 0 && /*#__PURE__*/_react.default.createElement(_NotFoundSource.NotFoundSource, null))), /*#__PURE__*/_react.default.createElement(_styles.ActionButtonContainer, null, /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
     type: "button",
     color: "primary",

package/_modules/themes/five/src/components/GiftCard/PurchaseGiftCard/styles.js

@@ -1,14 +1,14 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.IconControl = exports.GiftCardsWrapper = exports.GiftCardsListContainer = exports.GiftCardItem = exports.Container = exports.ActionButtonContainer = void 0;
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
+exports.IconControl = exports.GiftCardsWrapper = exports.GiftCardsListContainer = exports.GiftCardItem = exports.Container = exports.CardImageStyled = exports.CardImage = exports.ActionButtonContainer = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _react = _interopRequireDefault(require("react"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 var Container = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  padding-top: 30px;\n\n  h2 {\n    font-size: 24px;\n    font-weight: 600;\n    text-align: center;\n    margin-top: 0;\n    margin-bottom: 24px;\n  }\n  > p {\n    font-size: 16px;\n    line-height: 24px;\n    margin-top: 0;\n  }\n"])));
 exports.Container = Container;
@@ -20,16 +20,28 @@ var GiftCardItem = _styledComponents.default.div(_templateObject4 || (_templateO
   return props.theme.colors.gray200;
 });
 exports.GiftCardItem = GiftCardItem;
-var IconControl = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  color: ", ";\n  margin-right: 40px;\n  ", "\n  svg {\n    font-size: 24px;\n  }\n\n  svg[disabled] {\n    color: ", ";\n  }\n"])), function (props) {
+var IconControl = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  color: ", ";\n  svg {\n    font-size: 24px;\n  }\n\n  svg[disabled] {\n    color: ", ";\n  }\n"])), function (props) {
   return props.theme.colors.primary;
-}, function (props) {
-  var _props$theme;
-  return ((_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.rtl) && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    margin-left: 40px;\n    margin-right: 0px;\n  "])));
 }, function (props) {
   return props.theme.colors.lightGray;
 });
 exports.IconControl = IconControl;
-var ActionButtonContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  position: sticky;\n  bottom: 0px;\n  background-color: ", ";\n  padding: 15px 20px;\n  > button {\n    height: 44px;\n    width: 100%;\n  }\n"])), function (props) {
+var ActionButtonContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  position: sticky;\n  bottom: 0px;\n  background-color: ", ";\n  padding: 15px 20px;\n  > button {\n    height: 44px;\n    width: 100%;\n  }\n"])), function (props) {
   return props.theme.colors.backgroundPage;
 });
-exports.ActionButtonContainer = ActionButtonContainer;
+exports.ActionButtonContainer = ActionButtonContainer;
+var CardImageStyled = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  box-sizing: border-box;\n  position: relative;\n  background-repeat: no-repeat, repeat;\n  background-size: cover;\n  background-position: center;\n  object-fit: cover;\n  height: 38px;\n  width: 38px;\n  min-width: 38px;\n  min-height: 38px;\n  border-radius: 8px;\n  box-shadow: 0px 1px 4px rgba(0,0,0,0.1);\n  margin: 0 12px;\n"])));
+exports.CardImageStyled = CardImageStyled;
+var CardImage = function CardImage(props) {
+  var style = {};
+  if (props.bgimage) {
+    style.backgroundImage = "url(".concat(props.bgimage, ")");
+  }
+  if (props.soldOut) {
+    style.filter = 'brightness(70%)';
+  }
+  return /*#__PURE__*/_react.default.createElement(CardImageStyled, _extends({}, props, {
+    style: style
+  }), props.children);
+};
+exports.CardImage = CardImage;

package/_modules/themes/five/src/components/GiftCard/RedeemGiftCard/index.js

@@ -129,7 +129,7 @@ var RedeemGiftCardUI = function RedeemGiftCardUI(props) {
       });
     },
     closeOnBackdrop: false
-  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("h2", null, t('GIFT_CARD', 'Gift card')), /*#__PURE__*/_react.default.createElement(_styles.GiftCardInfoContainer, null, /*#__PURE__*/_react.default.createElement("p", null, t('TYPE', 'Type'), ": ", redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.type), /*#__PURE__*/_react.default.createElement("p", null, t('AMOUNT', 'Amount'), ": ", parsePrice(redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.amount)), /*#__PURE__*/_react.default.createElement("p", null, t('FROM', 'From'), ": ", redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : (_redeemedGiftCard$rec = redeemedGiftCard.receiver) === null || _redeemedGiftCard$rec === void 0 ? void 0 : _redeemedGiftCard$rec.name, " ", redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : (_redeemedGiftCard$rec2 = redeemedGiftCard.receiver) === null || _redeemedGiftCard$rec2 === void 0 ? void 0 : _redeemedGiftCard$rec2.lastname), (redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.title) && /*#__PURE__*/_react.default.createElement("p", null, t('TITLE', 'Title'), ": ", redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.title), (redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.message) && /*#__PURE__*/_react.default.createElement("p", null, t('MESSAGES', 'Messages'), ": ", redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.message), /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
+  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("h2", null, t('GIFT_CARD', 'Gift card')), /*#__PURE__*/_react.default.createElement(_styles.GiftCardInfoContainer, null, /*#__PURE__*/_react.default.createElement("p", null, t('TYPE', 'Type'), ": ", redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.type), /*#__PURE__*/_react.default.createElement("p", null, t('AMOUNT', 'Amount'), ": ", parsePrice(redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.amount)), /*#__PURE__*/_react.default.createElement("p", null, t('FROM', 'From'), ": ", redeemedGiftCard === null || redeemedGiftCard === void 0 || (_redeemedGiftCard$rec = redeemedGiftCard.receiver) === null || _redeemedGiftCard$rec === void 0 ? void 0 : _redeemedGiftCard$rec.name, " ", redeemedGiftCard === null || redeemedGiftCard === void 0 || (_redeemedGiftCard$rec2 = redeemedGiftCard.receiver) === null || _redeemedGiftCard$rec2 === void 0 ? void 0 : _redeemedGiftCard$rec2.lastname), (redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.title) && /*#__PURE__*/_react.default.createElement("p", null, t('TITLE', 'Title'), ": ", redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.title), (redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.message) && /*#__PURE__*/_react.default.createElement("p", null, t('MESSAGES', 'Messages'), ": ", redeemedGiftCard === null || redeemedGiftCard === void 0 ? void 0 : redeemedGiftCard.message), /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
     color: "primary",
     onClick: function onClick() {
       return onClose();