ordering-ui-external 14.1.49 → 14.1.52

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

@@ -52,9 +52,8 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var Header = exports.Header = function Header(props) {
-  var _window$location$path, _configState$configs, _configState$configs2, _theme$header, _theme$header2, _orderState$options, _orderState$options2, _Object$keys, _customerState$user, _orderState$options5, _theme$images, _theme$my_products, _theme$images2, _theme$images3, _theme$images4, _theme$my_products2, _theme$images5, _orderState$options7, _orderState$options8, _configState$configs3, _configState$configs4, _configState$configs5, _orderState$options9, _orderState$options10, _configState$configs6, _theme$defaultLanguag2, _theme$defaultLanguag3, _orderState$options11, _configState$configs8, _orderState$options12, _configState$configs9, _configState$configs10, _orderState$options13, _configState$configs11, _orderState$options14, _configState$configs12, _configState$configs13, _orderState$options15, _orderState$options16, _customerState$user2, _customerState$user3, _theme$defaultLanguag4, _theme$defaultLanguag5, _theme$defaultLanguag6, _theme$defaultLanguag7, _theme$defaultLanguag8, _theme$defaultLanguag9;
-  var isHome = props.isHome,
-    location = props.location,
+  var _window$location$path, _configState$configs, _configState$configs2, _theme$header, _theme$header2, _orderState$options, _orderState$options2, _theme$my_products, _Object$keys, _customerState$user, _orderState$options5, _theme$images, _theme$my_products2, _theme$images2, _theme$images3, _theme$images4, _theme$my_products3, _theme$images5, _orderState$options7, _orderState$options8, _configState$configs3, _configState$configs4, _configState$configs5, _orderState$options9, _orderState$options10, _configState$configs6, _theme$defaultLanguag2, _theme$defaultLanguag3, _orderState$options11, _configState$configs8, _orderState$options12, _configState$configs9, _configState$configs10, _orderState$options13, _configState$configs11, _orderState$options14, _configState$configs12, _configState$configs13, _orderState$options15, _orderState$options16, _customerState$user2, _customerState$user3, _theme$defaultLanguag4, _theme$defaultLanguag5, _theme$defaultLanguag6, _theme$defaultLanguag7, _theme$defaultLanguag8, _theme$defaultLanguag9;
+  var location = props.location,
     isShowOrderOptions = props.isShowOrderOptions,
     isHideSignup = props.isHideSignup,
     isCustomerMode = props.isCustomerMode,
@@ -163,6 +162,7 @@ var Header = exports.Header = function Header(props) {
   var isChew = (theme === null || theme === void 0 || (_theme$header = theme.header) === null || _theme$header === void 0 || (_theme$header = _theme$header.components) === null || _theme$header === void 0 || (_theme$header = _theme$header.layout) === null || _theme$header === void 0 || (_theme$header = _theme$header.type) === null || _theme$header === void 0 ? void 0 : _theme$header.toLowerCase()) === 'chew';
   var isHideLanguages = theme === null || theme === void 0 || (_theme$header2 = theme.header) === null || _theme$header2 === void 0 || (_theme$header2 = _theme$header2.components) === null || _theme$header2 === void 0 || (_theme$header2 = _theme$header2.language_selector) === null || _theme$header2 === void 0 ? void 0 : _theme$header2.hidden;
   var cateringTypeString = (orderState === null || orderState === void 0 || (_orderState$options = orderState.options) === null || _orderState$options === void 0 ? void 0 : _orderState$options.type) === 7 ? 'catering_delivery' : (orderState === null || orderState === void 0 || (_orderState$options2 = orderState.options) === null || _orderState$options2 === void 0 ? void 0 : _orderState$options2.type) === 8 ? 'catering_pickup' : null;
+  var franchiseLayout = 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.website_theme) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.components) === null || _theme$my_products === void 0 ? void 0 : _theme$my_products.franchise_slug;
   var cateringValues = (0, _utils.getCateringValues)(cateringTypeString, pathname.includes('store') && (Object === null || Object === void 0 || (_Object$keys = Object.keys(business || {})) === null || _Object$keys === void 0 ? void 0 : _Object$keys.length) > 0 ? business === null || business === void 0 ? void 0 : business.configs : configState === null || configState === void 0 ? void 0 : configState.configs);
   var handleSuccessSignup = function handleSuccessSignup(user) {
     var _user$session;
@@ -291,13 +291,13 @@ var Header = exports.Header = function Header(props) {
     alt: "Logotype",
     width: "170px",
     height: isChew ? '35px' : '45px',
-    src: isChew ? 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.chewLogo : (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.images) === 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.logo) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.components) === null || _theme$my_products === void 0 ? void 0 : _theme$my_products.image) || (theme === null || theme === void 0 || (_theme$images2 = theme.images) === null || _theme$images2 === void 0 || (_theme$images2 = _theme$images2.logos) === null || _theme$images2 === void 0 ? void 0 : _theme$images2.logotype),
+    src: isChew ? 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.chewLogo : (theme === null || theme === void 0 || (_theme$my_products2 = theme.my_products) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.components) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.images) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.components) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.logo) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.components) === null || _theme$my_products2 === void 0 ? void 0 : _theme$my_products2.image) || (theme === null || theme === void 0 || (_theme$images2 = theme.images) === null || _theme$images2 === void 0 || (_theme$images2 = _theme$images2.logos) === null || _theme$images2 === void 0 ? void 0 : _theme$images2.logotype),
     loading: "lazy"
   }), /*#__PURE__*/_react.default.createElement("img", {
     alt: "Isotype",
     width: isChew ? '70px' : '35px',
     height: isChew ? '20px' : '45px',
-    src: isChew ? theme === null || theme === void 0 || (_theme$images3 = theme.images) === null || _theme$images3 === void 0 || (_theme$images3 = _theme$images3.logos) === null || _theme$images3 === void 0 ? void 0 : _theme$images3.chewLogo : windowSize.width <= 768 ? theme === null || theme === void 0 || (_theme$images4 = theme.images) === null || _theme$images4 === void 0 || (_theme$images4 = _theme$images4.logos) === null || _theme$images4 === void 0 ? void 0 : _theme$images4.isotypeInvert : (theme === null || theme === void 0 || (_theme$my_products2 = theme.my_products) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.components) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.images) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.components) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.logo) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.components) === null || _theme$my_products2 === void 0 ? void 0 : _theme$my_products2.image) || (theme === null || theme === void 0 || (_theme$images5 = theme.images) === null || _theme$images5 === void 0 || (_theme$images5 = _theme$images5.logos) === null || _theme$images5 === void 0 ? void 0 : _theme$images5.isotype),
+    src: isChew ? theme === null || theme === void 0 || (_theme$images3 = theme.images) === null || _theme$images3 === void 0 || (_theme$images3 = _theme$images3.logos) === null || _theme$images3 === void 0 ? void 0 : _theme$images3.chewLogo : windowSize.width <= 768 ? theme === null || theme === void 0 || (_theme$images4 = theme.images) === null || _theme$images4 === void 0 || (_theme$images4 = _theme$images4.logos) === null || _theme$images4 === void 0 ? void 0 : _theme$images4.isotypeInvert : (theme === null || theme === void 0 || (_theme$my_products3 = theme.my_products) === null || _theme$my_products3 === void 0 || (_theme$my_products3 = _theme$my_products3.components) === null || _theme$my_products3 === void 0 || (_theme$my_products3 = _theme$my_products3.images) === null || _theme$my_products3 === void 0 || (_theme$my_products3 = _theme$my_products3.components) === null || _theme$my_products3 === void 0 || (_theme$my_products3 = _theme$my_products3.logo) === null || _theme$my_products3 === void 0 || (_theme$my_products3 = _theme$my_products3.components) === null || _theme$my_products3 === void 0 ? void 0 : _theme$my_products3.image) || (theme === null || theme === void 0 || (_theme$images5 = theme.images) === null || _theme$images5 === void 0 || (_theme$images5 = _theme$images5.logos) === null || _theme$images5 === void 0 ? void 0 : _theme$images5.isotype),
     loading: "lazy"
   }))), isShowOrderOptions && windowSize.width >= 576 && /*#__PURE__*/_react.default.createElement(_styles.Menu, {
     id: "center-side",
@@ -320,12 +320,13 @@ var Header = exports.Header = function Header(props) {
       return openModal('address');
     }
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.GeoAlt, null), /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement("p", null, ((_orderState$options8 = orderState.options) === null || _orderState$options8 === void 0 || (_orderState$options8 = _orderState$options8.address) === null || _orderState$options8 === void 0 ? void 0 : _orderState$options8.address) || t('WHAT_IS_YOUR_ADDRESS', 'What\'s your address?')))), !isCustomerMode && (isPreOrderSetting || (configState === null || configState === void 0 || (_configState$configs3 = configState.configs) === null || _configState$configs3 === void 0 || (_configState$configs3 = _configState$configs3.preorder_status_enabled) === null || _configState$configs3 === void 0 ? void 0 : _configState$configs3.value) === undefined) && /*#__PURE__*/_react.default.createElement(_styles.MomentMenu, {
+    isFranchiseSlugOne: franchiseLayout === 'franchise_1',
     onClick: (configState === null || configState === void 0 || (_configState$configs4 = configState.configs) === null || _configState$configs4 === void 0 || (_configState$configs4 = _configState$configs4.max_days_preorder) === null || _configState$configs4 === void 0 ? void 0 : _configState$configs4.value) === -1 || (configState === null || configState === void 0 || (_configState$configs5 = configState.configs) === null || _configState$configs5 === void 0 || (_configState$configs5 = _configState$configs5.max_days_preorder) === null || _configState$configs5 === void 0 ? void 0 : _configState$configs5.value) === 0 ? null : function () {
       return openModal('moment');
     }
   }, /*#__PURE__*/_react.default.createElement("div", null, (_orderState$options9 = orderState.options) !== null && _orderState$options9 !== void 0 && _orderState$options9.moment ? parseDate((_orderState$options10 = orderState.options) === null || _orderState$options10 === void 0 ? void 0 : _orderState$options10.moment, {
     outputFormat: configState === null || configState === void 0 || (_configState$configs6 = configState.configs) === null || _configState$configs6 === void 0 || (_configState$configs6 = _configState$configs6.dates_moment_format) === null || _configState$configs6 === void 0 ? void 0 : _configState$configs6.value
-  }) : t('ASAP_ABBREVIATION', 'ASAP')))), windowSize.width > 768 ? /*#__PURE__*/_react.default.createElement(_OrderTypeSelectorHeader.OrderTypeSelectorHeader, {
+  }) : t('ASAP_ABBREVIATION', 'ASAP')))), franchiseLayout !== 'franchise_1' && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, windowSize.width > 768 ? /*#__PURE__*/_react.default.createElement(_OrderTypeSelectorHeader.OrderTypeSelectorHeader, {
     orderTypeList: orderTypeList,
     onClick: function onClick() {
       return openModal('delivery');
@@ -336,7 +337,7 @@ var Header = exports.Header = function Header(props) {
       return openModal(variant);
     },
     orderTypeList: orderTypeList
-  }))), windowSize.width > 1200 && window.location.pathname === '/search' && /*#__PURE__*/_react.default.createElement(_styles.HeaderSearchMode, null, /*#__PURE__*/_react.default.createElement(_SearchBar.SearchBar, {
+  })))), windowSize.width > 1200 && window.location.pathname === '/search' && /*#__PURE__*/_react.default.createElement(_styles.HeaderSearchMode, null, /*#__PURE__*/_react.default.createElement(_SearchBar.SearchBar, {
     lazyLoad: true,
     search: searchValue,
     placeholder: t('SEARCH_BUSINESSES', 'Search Businesses'),

package/_modules/themes/five/src/components/Header/styles.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.UserEdit = exports.SubMenu = exports.RightHeader = exports.MomentMenu = exports.MenuLink = exports.MenuItem = exports.Menu = exports.LogoHeader = exports.LeftSide = exports.LeftHeader = exports.LanguageSelectorWrapper = exports.InputGroup = exports.InnerHeader = exports.HeaderSearchMode = exports.Header = exports.FarAwayMessage = exports.Divider = exports.CustomerInfo = exports.AddressMenu = exports.AddressFormWrapper = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _polished = require("polished");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
@@ -17,7 +17,7 @@ var Header = exports.Header = _styledComponents.default.div(_templateObject || (
 }, function (props) {
   return !props.isChew && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["1px solid #E9ECEF"])));
 });
-var InnerHeader = exports.InnerHeader = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  color: #FFF;\n  justify-content: space-between;\n  margin: 15px 0;\n  align-items: center;\n  #left-side {\n    width: ", ";\n    justify-content: flex-start;\n  }\n  #right-side {\n    width: ", ";\n    justify-content: flex-end;\n  }\n  #center-side {\n    width: ", ";\n  }\n  @media (min-width: 768px) {\n    #left-side {\n      width: ", ";\n    }\n    #center-side {\n      width: calc(100% - 60px);\n    }\n  }\n  @media (min-width: 1024px) {\n    #center-side {\n      width: calc(100% - 140px);\n    }\n  }\n  @media (min-width: 1200px) {\n    #center-side {\n      width: calc(70% - 200px);\n    }\n  }\n  @media (min-width: 1500px) {\n    #center-side {\n      width: calc(60% - 260px);\n    }\n  }\n"])), function (_ref) {
+var InnerHeader = exports.InnerHeader = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  color: #FFF;\n  justify-content: space-between;\n  margin: 15px 0;\n  align-items: center;\n\n  #left-side {\n    width: ", ";\n    justify-content: flex-start;\n  }\n  #right-side {\n    width: ", ";\n    justify-content: flex-end;\n  }\n  #center-side {\n    width: ", ";\n  }\n\n  @media (min-width: 768px) {\n    #left-side {\n      width: ", ";\n    }\n    #center-side {\n      width: calc(100% - 60px);\n    }\n  }\n\n  @media (min-width: 1024px) {\n    #center-side {\n      width: calc(100% - 140px);\n    }\n  }\n\n  @media (min-width: 1200px) {\n    #center-side {\n      width: calc(70% - 200px);\n    }\n  }\n\n  @media (min-width: 1500px) {\n    #center-side {\n      width: calc(60% - 260px);\n    }\n  }\n"])), function (_ref) {
   var _theme$header;
   var theme = _ref.theme;
   return (theme === null || theme === void 0 || (_theme$header = theme.header) === null || _theme$header === void 0 || (_theme$header = _theme$header.components) === null || _theme$header === void 0 || (_theme$header = _theme$header.layout) === null || _theme$header === void 0 ? void 0 : _theme$header.type) === 'starbucks' ? '30%' : '25%';
@@ -34,7 +34,7 @@ var InnerHeader = exports.InnerHeader = _styledComponents.default.div(_templateO
   var theme = _ref4.theme;
   return (theme === null || theme === void 0 || (_theme$header4 = theme.header) === null || _theme$header4 === void 0 || (_theme$header4 = _theme$header4.components) === null || _theme$header4 === void 0 || (_theme$header4 = _theme$header4.layout) === null || _theme$header4 === void 0 ? void 0 : _theme$header4.type) === 'starbucks' ? '30%' : 'initial';
 });
-var LogoHeader = exports.LogoHeader = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  cursor: pointer;\n  img {\n    width: ", ";\n    height: ", ";\n    margin: 0;\n    vertical-align: middle;\n    margin-left: 10px;\n    ", "\n    @media (min-width: 769px) {\n      ", ";\n      width: ", ";\n      height: ", ";\n    }\n  }\n  ", "\n  @media (min-width: 769px) {\n    img:nth-child(1) {\n      display: block;\n    }\n    img:nth-child(2) {\n      display: none;\n    }\n  }\n"])), function (props) {
+var LogoHeader = exports.LogoHeader = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  cursor: pointer;\n\n  img {\n    width: ", ";\n    height: ", ";\n    margin: 0;\n    vertical-align: middle;\n    margin-left: 10px;\n\n    ", "\n\n    @media (min-width: 769px) {\n      ", ";\n      width: ", ";\n      height: ", ";\n    }\n  }\n\n  ", "\n\n  @media (min-width: 769px) {\n    img:nth-child(1) {\n      display: block;\n    }\n    img:nth-child(2) {\n      display: none;\n    }\n  }\n"])), function (props) {
   var _props$imgW;
   return props.isChew ? '70px' : (_props$imgW = props.imgW) !== null && _props$imgW !== void 0 ? _props$imgW : '35px';
 }, function (props) {
@@ -56,19 +56,19 @@ var LogoHeader = exports.LogoHeader = _styledComponents.default.div(_templateObj
   return !props.disabledResponsive && (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    img:nth-child(1) {\n      display: none;\n    }\n  "])));
 });
 var LeftHeader = exports.LeftHeader = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  align-self: center;\n  display: flex;\n  align-items: center;\n"])));
-var RightHeader = exports.RightHeader = _styledComponents.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  align-self: center;\n  display: flex;\n  #select-input {\n    div {\n      color: ", ";\n    }\n  }\n"])), function (props) {
+var RightHeader = exports.RightHeader = _styledComponents.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  align-self: center;\n  display: flex;\n\n  #select-input {\n    div {\n      color: ", ";\n    }\n  }\n"])), function (props) {
   return props.theme.colors.darkTextColor;
 });
-var Menu = exports.Menu = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-right: 10px;\n  #select-input {\n    border-radius: 7.6px;\n    #list {\n      border-radius: 7.6px;\n    }\n    ", "\n  }\n  &.left-header {\n    background: #F8F9FA;\n    border: none;\n    box-sizing: border-box;\n    border-radius: ", ";\n    margin: 0 15px;\n    flex-grow: 1;\n    padding: 0 10px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    height: 44px;\n    @media (min-width: 850px) {\n      border: 1px solid #DEE2E6;\n      justify-content: space-between;\n    }\n    @media (min-width: 1024px) {\n      margin: 0 20px;\n      padding: 0 20px;\n      margin-left: 45px;\n    }\n    @media (min-width: 1200px) {\n      padding: 0 30px;\n      margin-left: 50px;\n    }\n    @media (min-width: 1500px) {\n      padding: 0 30px;\n      margin: 0 75px;\n    }\n  }\n  > span {\n    #select-input {\n      background: transparent !important;\n    }\n  }\n  .moment-popover {\n    border-left: 1px solid #DEE2E6;\n    border-right: 1px solid #DEE2E6;\n    height: 100%;\n    justify-content: center;\n    width: 200px;\n    display: none;\n    @media (min-width: 1175px) {\n      width: 250px;\n    }\n    \n    @media (min-width: 1400px) {\n      width: 400px;\n    }\n    > div:first-child {\n      width: 100%;\n      display: flex;\n      justify-content: center;\n    }\n  }\n  .address-popover {\n    flex-grow: 1;\n    display: none;\n    > div:first-child {\n      width: 100%;\n    }\n  }\n  .order-type {\n    padding: 0 5px;\n\n    @media (min-width: 1300px) {\n      padding: 0 20px;\n    }\n  }\n  @media (min-width: 850px) {\n    .moment-popover,\n    .address-popover {\n      display: flex;\n    }\n  }\n"])), function (_ref7) {
+var Menu = exports.Menu = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-right: 10px;\n\n  #select-input {\n    border-radius: 7.6px;\n\n    #list {\n      border-radius: 7.6px;\n    }\n\n    ", "\n  }\n\n  &.left-header {\n    background: #F8F9FA;\n    border: none;\n    box-sizing: border-box;\n    border-radius: ", ";\n    margin: 0 15px;\n    flex-grow: 1;\n    padding: 0 10px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    height: 44px;\n\n    @media (min-width: 850px) {\n      border: 1px solid #DEE2E6;\n      justify-content: space-between;\n    }\n\n    @media (min-width: 1024px) {\n      margin: 0 20px;\n      padding: 0 20px;\n      margin-left: 45px;\n    }\n\n    @media (min-width: 1200px) {\n      padding: 0 30px;\n      margin-left: 50px;\n    }\n\n    @media (min-width: 1500px) {\n      padding: 0 30px;\n      margin: 0 75px;\n    }\n  }\n\n  > span {\n    #select-input {\n      background: transparent !important;\n    }\n  }\n\n  .moment-popover {\n    border-left: 1px solid #DEE2E6;\n    border-right: 1px solid #DEE2E6;\n    height: 100%;\n    justify-content: center;\n    width: 200px;\n    display: none;\n\n    @media (min-width: 1175px) {\n      width: 250px;\n    }\n\n    @media (min-width: 1400px) {\n      width: 400px;\n    }\n\n    > div:first-child {\n      width: 100%;\n      display: flex;\n      justify-content: center;\n    }\n  }\n\n  .address-popover {\n    flex-grow: 1;\n    display: none;\n    > div:first-child {\n      width: 100%;\n    }\n  }\n\n  .order-type {\n    padding: 0 5px;\n\n    @media (min-width: 1300px) {\n      padding: 0 20px;\n    }\n  }\n\n\n  @media (min-width: 850px) {\n    .moment-popover,\n    .address-popover {\n      display: flex;\n    }\n  }\n"])), function (_ref7) {
   var isCustomerMode = _ref7.isCustomerMode;
-  return !isCustomerMode && (0, _styledComponents.css)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n      margin: 0px 5px;\n      height: 40px;\n      svg {\n        font-size: 16px;\n      }\n      > div:first-child {\n        height: 100%;\n        padding-left: 10px;\n        padding-right: 10px;\n        @media (min-width: 993px) {\n          padding-left: 13px;\n          padding-right: 13px;\n        }\n      }\n    "])));
+  return !isCustomerMode && (0, _styledComponents.css)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n      margin: 0px 5px;\n      height: 40px;\n\n      svg {\n        font-size: 16px;\n      }\n\n      > div:first-child {\n        height: 100%;\n        padding-left: 10px;\n        padding-right: 10px;\n\n        @media (min-width: 993px) {\n          padding-left: 13px;\n          padding-right: 13px;\n        }\n      }\n    "])));
 }, function (props) {
   return props.isChew ? '8px' : '50px';
 });
 var MenuItem = exports.MenuItem = _styledComponents.default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  display: flex;\n"])));
-var MenuLink = exports.MenuLink = _styledComponents.default.a(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  text-decoration: none;\n  font-size: 14px;\n  padding: 10px;\n  color: #333;\n  cursor: pointer;\n  ", "\n"])), function (_ref8) {
+var MenuLink = exports.MenuLink = _styledComponents.default.a(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  text-decoration: none;\n  font-size: 14px;\n  padding: 10px;\n  color: #333;\n  cursor: pointer;\n\n  ", "\n"])), function (_ref8) {
   var highlight = _ref8.highlight;
-  return highlight && (0, _styledComponents.css)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n    background-color: ", ";\n    color: ", ";\n    border-radius: 7.6px;\n    padding: 11px 15px;\n    &:hover {\n      background: ", ";\n      color: #FFF;\n    }\n  "])), function (props) {
+  return highlight && (0, _styledComponents.css)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n    background-color: ", ";\n    color: ", ";\n    border-radius: 7.6px;\n    padding: 11px 15px;\n\n    &:hover {\n      background: ", ";\n      color: #FFF;\n    }\n  "])), function (props) {
     return props.theme.colors.primary;
   }, function (props) {
     return props.theme.colors.primaryContrast;
@@ -76,10 +76,10 @@ var MenuLink = exports.MenuLink = _styledComponents.default.a(_templateObject13
     return (0, _polished.darken)(0.07, props.theme.colors.primary);
   });
 });
-var SubMenu = exports.SubMenu = (0, _styledComponents.default)(InnerHeader)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  padding: 0px 20px 7px;\n  box-sizing: border-box;\n  margin: 0px;\n  position: relative;\n  @media (min-width: 850px) {\n    display: none;\n  }\n"])));
-var CustomerInfo = exports.CustomerInfo = _styledComponents.default.div(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n  display: none;\n  cursor: pointer;\n  flex: 1;\n  position: relative;\n  @media (min-width: 450px) {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    span {\n      display: flex;\n      align-items: center;\n      margin: 0;\n      p {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n        color: #909BA9;\n      }\n      svg {\n        color: #748194;\n        margin: 0;\n        font-size: 20px;\n        position: absolute;\n        right: 0;\n      }\n    }\n  }\n"])));
+var SubMenu = exports.SubMenu = (0, _styledComponents.default)(InnerHeader)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  padding: 0px 20px 7px;\n  box-sizing: border-box;\n  margin: 0px;\n  position: relative;\n\n  @media (min-width: 850px) {\n    display: none;\n  }\n"])));
+var CustomerInfo = exports.CustomerInfo = _styledComponents.default.div(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n  display: none;\n  cursor: pointer;\n  flex: 1;\n  position: relative;\n  @media (min-width: 450px) {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    span {\n      display: flex;\n      align-items: center;\n      margin: 0;\n      p {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n        color: #909BA9;\n      }\n      svg {\n        color: #748194;\n        margin: 0;\n        font-size: 20px;\n        position: absolute;\n        right: 0;\n      }\n    }\n  }\n"])));
 var UserEdit = exports.UserEdit = _styledComponents.default.div(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  > :first-child{\n     margin-bottom: 20px;\n  }\n"])));
-var AddressMenu = exports.AddressMenu = _styledComponents.default.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n  cursor: pointer;\n  font-size: 14px;\n  font-weight: 600;\n  color: ", ";\n  display: flex;\n  align-items: center;\n  position: relative;\n  span {\n    width: 85%;\n    p {\n      margin: 0;\n      padding: 0;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      overflow: hidden;\n    }\n  }\n  ", "\n  svg {\n    color: ", ";\n    font-size: 16px;\n    margin-right: 10px;\n    ", "\n  }\n  @media (min-width: 765px) {\n    ", "\n  }\n  @media (min-width: 820px) {\n    ", "\n  }\n"])), function (props) {
+var AddressMenu = exports.AddressMenu = _styledComponents.default.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n  cursor: pointer;\n  font-size: 14px;\n  font-weight: 600;\n  color: ", ";\n  display: flex;\n  align-items: center;\n  position: relative;\n\n  span {\n    width: 85%;\n    p {\n      margin: 0;\n      padding: 0;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      overflow: hidden;\n    }\n  }\n\n  ", "\n\n  svg {\n    color: ", ";\n    font-size: 16px;\n    margin-right: 10px;\n    ", "\n  }\n  @media (min-width: 765px) {\n    ", "\n  }\n  @media (min-width: 820px) {\n    ", "\n  }\n"])), function (props) {
   var _props$theme$colors, _props$theme$colors2;
   return props.isChew ? (_props$theme$colors = props.theme.colors) === null || _props$theme$colors === void 0 ? void 0 : _props$theme$colors.backgroundPage : (_props$theme$colors2 = props.theme.colors) === null || _props$theme$colors2 === void 0 ? void 0 : _props$theme$colors2.headingColor;
 }, function (_ref9) {
@@ -98,34 +98,37 @@ var AddressMenu = exports.AddressMenu = _styledComponents.default.div(_templateO
   var isCustomerMode = _ref11.isCustomerMode;
   return !isCustomerMode && (0, _styledComponents.css)(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n      width: 50%;\n    "])));
 });
-var MomentMenu = exports.MomentMenu = _styledComponents.default.div(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n  border-left: 1px solid #DEE2E6;\n  border-right: 1px solid #DEE2E6;\n  height: 100%;\n  justify-content: center;\n  width: 175px;\n  display: none;\n  \n  @media (min-width: 850px) {\n    display: flex;\n  }\n  @media (min-width: 1175px) {\n    width: 250px;\n  }\n  @media (min-width: 1400px) {\n    width: 400px;\n  }\n  > div {\n    cursor: pointer;\n    font-size: 14px;\n    color: #909BA9;\n    display: flex;\n    align-items: center;\n    text-align: center;\n    white-space: nowrap;\n    padding: 0 10px;\n  }\n"])));
-var FarAwayMessage = exports.FarAwayMessage = _styledComponents.default.div(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n  pointer-events: none;\n  position: absolute;\n  display: flex;\n  align-items: center;\n  z-index: 2000;\n  top: 100%;\n  background: ", ";\n  border: 1px solid ", ";\n  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n  border-radius: 7.6px;\n  padding: 6px 15px;\n  box-sizing: border-box;\n  margin: 10px 0px 0px 0px !important;\n  left: 5px;\n  ", "\n  svg {\n    font-size: 20px;\n    color: ", ";\n    margin-right: 10px;\n    ", "\n  }\n  span {\n    font-size: 12px;\n    line-height: 18px;\n    color: ", ";\n  }\n  @media (min-width: 400px) {\n    padding: 8px 20px;\n    font-size: 14px;\n    line-height: 24px;\n    left: 10px;\n    ", "\n  }\n"])), function (props) {
+var MomentMenu = exports.MomentMenu = _styledComponents.default.div(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n  border-left: 1px solid #DEE2E6;\n  ", "\n  height: 100%;\n  justify-content: center;\n  width: 175px;\n  display: none;\n\n  @media (min-width: 850px) {\n    display: flex;\n  }\n\n  @media (min-width: 1175px) {\n    width: 250px;\n  }\n\n  @media (min-width: 1400px) {\n    width: 400px;\n  }\n\n  > div {\n    cursor: pointer;\n    font-size: 14px;\n    color: #909BA9;\n    display: flex;\n    align-items: center;\n    text-align: center;\n    white-space: nowrap;\n    padding: 0 10px;\n  }\n"])), function (_ref12) {
+  var isFranchiseSlugOne = _ref12.isFranchiseSlugOne;
+  return !isFranchiseSlugOne && (0, _styledComponents.css)(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n      border-right: 1px solid #DEE2E6;\n  "])));
+});
+var FarAwayMessage = exports.FarAwayMessage = _styledComponents.default.div(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n  pointer-events: none;\n  position: absolute;\n  display: flex;\n  align-items: center;\n  z-index: 2000;\n  top: 100%;\n  background: ", ";\n  border: 1px solid ", ";\n  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n  border-radius: 7.6px;\n  padding: 6px 15px;\n  box-sizing: border-box;\n  margin: 10px 0px 0px 0px !important;\n\n  left: 5px;\n  ", "\n\n  svg {\n    font-size: 20px;\n    color: ", ";\n    margin-right: 10px;\n    ", "\n  }\n  span {\n    font-size: 12px;\n    line-height: 18px;\n    color: ", ";\n  }\n\n  @media (min-width: 400px) {\n    padding: 8px 20px;\n    font-size: 14px;\n    line-height: 24px;\n    left: 10px;\n    ", "\n  }\n"])), function (props) {
   return props.theme.colors.warning100;
 }, function (props) {
   return props.theme.colors.warning500;
 }, function (props) {
   var _props$theme4;
-  return ((_props$theme4 = props.theme) === null || _props$theme4 === void 0 ? void 0 : _props$theme4.rtl) && (0, _styledComponents.css)(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n    right: 5px;\n    left: initial;\n  "])));
+  return ((_props$theme4 = props.theme) === null || _props$theme4 === void 0 ? void 0 : _props$theme4.rtl) && (0, _styledComponents.css)(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n    right: 5px;\n    left: initial;\n  "])));
 }, function (props) {
   return props.theme.colors.warning500;
 }, function (props) {
   var _props$theme5;
-  return ((_props$theme5 = props.theme) === null || _props$theme5 === void 0 ? void 0 : _props$theme5.rtl) && (0, _styledComponents.css)(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n      margin-right: auto;\n      margin-left: 10px;\n    "])));
+  return ((_props$theme5 = props.theme) === null || _props$theme5 === void 0 ? void 0 : _props$theme5.rtl) && (0, _styledComponents.css)(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n      margin-right: auto;\n      margin-left: 10px;\n    "])));
 }, function (props) {
   return props.theme.colors.headingColor;
 }, function (props) {
   var _props$theme6;
-  return ((_props$theme6 = props.theme) === null || _props$theme6 === void 0 ? void 0 : _props$theme6.rtl) && (0, _styledComponents.css)(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n      right: 10px;\n      left: initial;\n    "])));
+  return ((_props$theme6 = props.theme) === null || _props$theme6 === void 0 ? void 0 : _props$theme6.rtl) && (0, _styledComponents.css)(_templateObject29 || (_templateObject29 = _taggedTemplateLiteral(["\n      right: 10px;\n      left: initial;\n    "])));
 });
-var Divider = exports.Divider = _styledComponents.default.div(_templateObject29 || (_templateObject29 = _taggedTemplateLiteral(["\n  border: 1px solid #DEE2E6;\n  height: 100%;\n"])));
-var AddressFormWrapper = exports.AddressFormWrapper = _styledComponents.default.div(_templateObject30 || (_templateObject30 = _taggedTemplateLiteral(["\n  @media (min-width: 450px) {\n    margin-top: 20px;\n  }\n"])));
-var InputGroup = exports.InputGroup = _styledComponents.default.div(_templateObject31 || (_templateObject31 = _taggedTemplateLiteral(["\n  p {\n    font-weight: 500;\n    font-size: 20px;\n    color: ", ";\n    width: 100%;\n    text-align: left;\n    margin: 0 0 7px 0;\n  }\n"])), function (props) {
+var Divider = exports.Divider = _styledComponents.default.div(_templateObject30 || (_templateObject30 = _taggedTemplateLiteral(["\n  border: 1px solid #DEE2E6;\n  height: 100%;\n"])));
+var AddressFormWrapper = exports.AddressFormWrapper = _styledComponents.default.div(_templateObject31 || (_templateObject31 = _taggedTemplateLiteral(["\n  @media (min-width: 450px) {\n    margin-top: 20px;\n  }\n"])));
+var InputGroup = exports.InputGroup = _styledComponents.default.div(_templateObject32 || (_templateObject32 = _taggedTemplateLiteral(["\n  p {\n    font-weight: 500;\n    font-size: 20px;\n    color: ", ";\n    width: 100%;\n    text-align: left;\n    margin: 0 0 7px 0;\n  }\n"])), function (props) {
   return props.theme.colors.darkTextColor;
 });
-var LanguageSelectorWrapper = exports.LanguageSelectorWrapper = (0, _styledComponents.default)(InputGroup)(_templateObject32 || (_templateObject32 = _taggedTemplateLiteral(["\n  > div {\n    border-radius: 7.6px;\n    text-align: left;\n    background: #F8F9FA !important;\n    border-color: #F8F9FA;\n    background-color: #F8F9FA !important;\n    height: 44px;\n    > div:first-child {\n      height: 44px;\n    }\n    #list {\n      border-radius: 7.6px;\n      background: #F8F9FA !important;\n      border-color: #F8F9FA;\n    }\n  }\n  #select-input {\n    margin-left: 5px;\n  }\n"])));
-var HeaderSearchMode = exports.HeaderSearchMode = _styledComponents.default.div(_templateObject33 || (_templateObject33 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  width: 300px;\n  input {\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n  @media (min-width: 1400px){\n    width: 350px;\n  }\n  @media (min-width: 1200px){\n    width: 300px;\n    div {\n      > span {\n        padding: 7px 0;\n      }\n    }\n  }\n"])));
-var LeftSide = exports.LeftSide = _styledComponents.default.div(_templateObject34 || (_templateObject34 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  @media (min-width: 769px){\n    flex-direction: ", ";\n    width: 62%;\n  }\n"])), function (_ref12) {
-  var _ref13, _theme$header6;
-  var theme = _ref12.theme;
-  return (_ref13 = ['center', 'right']) !== null && _ref13 !== void 0 && _ref13.includes(theme === null || theme === void 0 || (_theme$header6 = theme.header) === null || _theme$header6 === void 0 || (_theme$header6 = _theme$header6.components) === null || _theme$header6 === void 0 || (_theme$header6 = _theme$header6.logo) === null || _theme$header6 === void 0 || (_theme$header6 = _theme$header6.components) === null || _theme$header6 === void 0 || (_theme$header6 = _theme$header6.layout) === null || _theme$header6 === void 0 ? void 0 : _theme$header6.position) ? 'row-reverse' : 'row';
+var LanguageSelectorWrapper = exports.LanguageSelectorWrapper = (0, _styledComponents.default)(InputGroup)(_templateObject33 || (_templateObject33 = _taggedTemplateLiteral(["\n  > div {\n    border-radius: 7.6px;\n    text-align: left;\n    background: #F8F9FA !important;\n    border-color: #F8F9FA;\n    background-color: #F8F9FA !important;\n    height: 44px;\n\n    > div:first-child {\n      height: 44px;\n    }\n\n    #list {\n      border-radius: 7.6px;\n      background: #F8F9FA !important;\n      border-color: #F8F9FA;\n    }\n  }\n  #select-input {\n    margin-left: 5px;\n  }\n"])));
+var HeaderSearchMode = exports.HeaderSearchMode = _styledComponents.default.div(_templateObject34 || (_templateObject34 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  width: 300px;\n  input {\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n  @media (min-width: 1400px){\n    width: 350px;\n  }\n  @media (min-width: 1200px){\n    width: 300px;\n    div {\n      > span {\n        padding: 7px 0;\n      }\n    }\n  }\n"])));
+var LeftSide = exports.LeftSide = _styledComponents.default.div(_templateObject35 || (_templateObject35 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  @media (min-width: 769px){\n    flex-direction: ", ";\n    width: 62%;\n  }\n"])), function (_ref13) {
+  var _ref14, _theme$header6;
+  var theme = _ref13.theme;
+  return (_ref14 = ['center', 'right']) !== null && _ref14 !== void 0 && _ref14.includes(theme === null || theme === void 0 || (_theme$header6 = theme.header) === null || _theme$header6 === void 0 || (_theme$header6 = _theme$header6.components) === null || _theme$header6 === void 0 || (_theme$header6 = _theme$header6.logo) === null || _theme$header6 === void 0 || (_theme$header6 = _theme$header6.components) === null || _theme$header6 === void 0 || (_theme$header6 = _theme$header6.layout) === null || _theme$header6 === void 0 ? void 0 : _theme$header6.position) ? 'row-reverse' : 'row';
 });

package/_modules/themes/five/src/components/HighestRated/franchises/OloHighestRated/index.js

@@ -0,0 +1,116 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HighestRated = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _orderingComponentsExternal = require("ordering-components-external");
+var _OloBusinessController = require("../../../BusinessController/franchises/OloBusinessController");
+var _styles = require("./styles");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var HighestRatedUI = function HighestRatedUI(props) {
+  var _businessesList$busin, _businessesList$busin3, _props$beforeElements, _props$beforeComponen, _businessesList$busin4, _props$afterComponent, _props$afterElements;
+  var businessesList = props.businessesList,
+    handleBusinessClick = props.handleBusinessClick,
+    isCustomLayout = props.isCustomLayout,
+    setHasHighRatedBusiness = props.setHasHighRatedBusiness,
+    isCustomerMode = props.isCustomerMode,
+    favoriteIds = props.favoriteIds,
+    setFavoriteIds = props.setFavoriteIds;
+  var _useLanguage = (0, _orderingComponentsExternal.useLanguage)(),
+    _useLanguage2 = _slicedToArray(_useLanguage, 2),
+    t = _useLanguage2[1];
+  var _useOrder = (0, _orderingComponentsExternal.useOrder)(),
+    _useOrder2 = _slicedToArray(_useOrder, 1),
+    orderState = _useOrder2[0];
+  var isBusinessWithReviews = businessesList === null || businessesList === void 0 || (_businessesList$busin = businessesList.businesses) === null || _businessesList$busin === void 0 ? void 0 : _businessesList$busin.every(function (business) {
+    var _business$reviews;
+    return (business === null || business === void 0 || (_business$reviews = business.reviews) === null || _business$reviews === void 0 ? void 0 : _business$reviews.total) === 0;
+  });
+  (0, _react.useEffect)(function () {
+    if (!businessesList.loading) {
+      setHasHighRatedBusiness(!isBusinessWithReviews);
+    }
+  }, [businessesList === null || businessesList === void 0 ? void 0 : businessesList.businesses]);
+  (0, _react.useEffect)(function () {
+    var _businessesList$busin2;
+    if (!(businessesList !== null && businessesList !== void 0 && (_businessesList$busin2 = businessesList.businesses) !== null && _businessesList$busin2 !== void 0 && _businessesList$busin2.length)) return;
+    var ids = _toConsumableArray(favoriteIds !== null && favoriteIds !== void 0 ? favoriteIds : []);
+    businessesList.businesses.forEach(function (business) {
+      if (business !== null && business !== void 0 && business.favorite) {
+        ids.push(business.id);
+      }
+    });
+    setFavoriteIds && setFavoriteIds(_toConsumableArray(new Set(ids)));
+  }, [businessesList === null || businessesList === void 0 || (_businessesList$busin3 = businessesList.businesses) === null || _businessesList$busin3 === void 0 ? void 0 : _businessesList$busin3.length]);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (_props$beforeElements = props.beforeElements) === null || _props$beforeElements === void 0 ? void 0 : _props$beforeElements.map(function (BeforeElement, i) {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
+      key: i
+    }, BeforeElement);
+  }), (_props$beforeComponen = props.beforeComponents) === null || _props$beforeComponen === void 0 ? void 0 : _props$beforeComponen.map(function (BeforeComponent, i) {
+    return /*#__PURE__*/_react.default.createElement(BeforeComponent, _extends({
+      key: i
+    }, props));
+  }), /*#__PURE__*/_react.default.createElement(_styles.HighestRatedContainer, null, /*#__PURE__*/_react.default.createElement(_styles.Title, null, t('HIGHEST_RATED', 'Highest rated')), /*#__PURE__*/_react.default.createElement(_styles.Description, null, t('TOP_RATINGS_AND_GREAT_SERVICE', 'Top ratings and great service')), /*#__PURE__*/_react.default.createElement(_styles.BusinessListWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.BusinessList, null, !(businessesList !== null && businessesList !== void 0 && businessesList.loading) && (businessesList === null || businessesList === void 0 || (_businessesList$busin4 = businessesList.businesses) === null || _businessesList$busin4 === void 0 ? void 0 : _businessesList$busin4.map(function (business) {
+    var _business$reviews2, _orderState$options;
+    return (business === null || business === void 0 || (_business$reviews2 = business.reviews) === null || _business$reviews2 === void 0 ? void 0 : _business$reviews2.total) > 0 && /*#__PURE__*/_react.default.createElement(_OloBusinessController.BusinessController, {
+      key: business.id,
+      className: "card",
+      business: business,
+      isBusinessOpen: business.open,
+      handleCustomClick: handleBusinessClick,
+      orderType: orderState === null || orderState === void 0 || (_orderState$options = orderState.options) === null || _orderState$options === void 0 ? void 0 : _orderState$options.type,
+      isCustomLayout: isCustomLayout,
+      isCustomerMode: isCustomerMode,
+      favoriteIds: favoriteIds,
+      setFavoriteIds: setFavoriteIds
+    });
+  })), businessesList.loading && _toConsumableArray(Array(8).keys()).map(function (i) {
+    var _orderState$options2;
+    return /*#__PURE__*/_react.default.createElement(_OloBusinessController.BusinessController, {
+      key: i,
+      className: "card",
+      business: {},
+      isSkeleton: true,
+      orderType: orderState === null || orderState === void 0 || (_orderState$options2 = orderState.options) === null || _orderState$options2 === void 0 ? void 0 : _orderState$options2.type
+    });
+  }), businessesList.error && businessesList.error.length > 0 && businessesList.businesses.length === 0 && businessesList.error.map(function (e, i) {
+    return /*#__PURE__*/_react.default.createElement(_styles.ErrorMessage, {
+      key: i
+    }, t('ERROR', 'ERROR'), ": [", (e === null || e === void 0 ? void 0 : e.message) || e, "]");
+  })))), (_props$afterComponent = props.afterComponents) === null || _props$afterComponent === void 0 ? void 0 : _props$afterComponent.map(function (AfterComponent, i) {
+    return /*#__PURE__*/_react.default.createElement(AfterComponent, _extends({
+      key: i
+    }, props));
+  }), (_props$afterElements = props.afterElements) === null || _props$afterElements === void 0 ? void 0 : _props$afterElements.map(function (AfterElement, i) {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
+      key: i
+    }, AfterElement);
+  }));
+};
+var HighestRated = exports.HighestRated = function HighestRated(props) {
+  var highestRatedProps = _objectSpread(_objectSpread({}, props), {}, {
+    UIComponent: HighestRatedUI,
+    initialOrderByValue: 'rating'
+  });
+  return /*#__PURE__*/_react.default.createElement(_orderingComponentsExternal.BusinessList, highestRatedProps);
+};

package/_modules/themes/five/src/components/HighestRated/franchises/OloHighestRated/styles.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Title = exports.HighestRatedContainer = exports.ErrorMessage = exports.Description = exports.BusinessListWrapper = exports.BusinessList = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var HighestRatedContainer = exports.HighestRatedContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding-bottom: 30px;\n"])));
+var ErrorMessage = exports.ErrorMessage = _styledComponents.default.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: 20px;\n  width: 100%;\n  background-color: #CCCCCC;\n  margin: 0px 15px;\n  color: #D81313;\n  font-weight: bold;\n"])));
+var BusinessList = exports.BusinessList = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  box-sizing: border-box;\n  flex-direction: column;\n  #highestRated {\n    > div {\n      width: calc(100vw - 40px);\n      min-width: calc(100vw - 40px);\n\n      @media (min-width: 681px) {\n        width: calc(50vw - 40px);\n        min-width: calc(50vw - 40px);\n      }\n      @media (min-width: 993px) {\n        width: calc(33vw - 40px);\n        min-width: calc(33vw - 40px);\n      }\n      @media (min-width: 1200px) {\n        width: calc(25vw - 40px);\n        min-width: calc(25vw - 40px);\n      }\n    }\n  }\n"])));
+var Title = exports.Title = _styledComponents.default.h2(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  font-weight: 600;\n  font-size: 24px;\n  color: ", ";\n  margin: 42px 20px 5px 20px;\n"])), function (props) {
+  var _props$theme;
+  return (_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.colors.headingColor;
+});
+var Description = exports.Description = _styledComponents.default.p(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  font-size: 14px;\n  color: ", ";\n  margin: 0 20px 15px 20px;\n"])), function (props) {
+  var _props$theme2;
+  return (_props$theme2 = props.theme) === null || _props$theme2 === void 0 ? void 0 : _props$theme2.colors.headingColor;
+});
+var BusinessListWrapper = exports.BusinessListWrapper = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  overflow: scroll hidden;\n  width: 100%;\n"])));

package/_modules/themes/five/src/components/HomeHero/franchises/OloHomeHero/index.js

@@ -0,0 +1,136 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.OloHomeHero = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _styledComponents = require("styled-components");
+var _orderingComponentsExternal = require("ordering-components-external");
+var _styles = require("./styles");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var OloHomeHero = exports.OloHomeHero = function OloHomeHero(props) {
+  var _configs$order_types_, _theme$my_products, _theme$images7, _theme$images8, _theme$images9, _theme$images10, _theme$images11, _theme$defaultLanguag, _theme$defaultLanguag2, _theme$images12;
+  var _useSession = (0, _orderingComponentsExternal.useSession)(),
+    _useSession2 = _slicedToArray(_useSession, 1),
+    auth = _useSession2[0].auth;
+  var _useOrder = (0, _orderingComponentsExternal.useOrder)(),
+    _useOrder2 = _slicedToArray(_useOrder, 2),
+    orderState = _useOrder2[0],
+    changeType = _useOrder2[1].changeType;
+  var _useLanguage = (0, _orderingComponentsExternal.useLanguage)(),
+    _useLanguage2 = _slicedToArray(_useLanguage, 2),
+    t = _useLanguage2[1];
+  var _useConfig = (0, _orderingComponentsExternal.useConfig)(),
+    _useConfig2 = _slicedToArray(_useConfig, 1),
+    configs = _useConfig2[0].configs;
+  var _useState = (0, _react.useState)({
+      listOpen: false,
+      formOpen: false
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    modals = _useState2[0],
+    setModals = _useState2[1];
+  var _useEvent = (0, _orderingComponentsExternal.useEvent)(),
+    _useEvent2 = _slicedToArray(_useEvent, 1),
+    events = _useEvent2[0];
+  var theme = (0, _styledComponents.useTheme)();
+  var configTypes = (configs === null || configs === void 0 || (_configs$order_types_ = configs.order_types_allowed) === null || _configs$order_types_ === void 0 ? void 0 : _configs$order_types_.value.split('|').map(function (value) {
+    return Number(value);
+  })) || [];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    newAddressModalOpened = _useState4[0],
+    setNewAddressModalOpened = _useState4[1];
+  var bgImg = 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.images) === 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.homepage_background) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.components) === null || _theme$my_products === void 0 ? void 0 : _theme$my_products.image;
+  var orderTypeTitle = function orderTypeTitle(type) {
+    var _theme$order_types;
+    return theme === null || theme === void 0 || (_theme$order_types = theme.order_types) === null || _theme$order_types === void 0 || (_theme$order_types = _theme$order_types.components) === null || _theme$order_types === void 0 || (_theme$order_types = _theme$order_types[type]) === null || _theme$order_types === void 0 || (_theme$order_types = _theme$order_types.components) === null || _theme$order_types === void 0 ? void 0 : _theme$order_types.title;
+  };
+  var orderTypeIcon = function orderTypeIcon(typeValue) {
+    var _theme$images, _theme$images2, _theme$images3, _theme$images4, _theme$images5, _theme$images6;
+    return typeValue === 1 ? theme === null || theme === void 0 || (_theme$images = theme.images) === null || _theme$images === void 0 || (_theme$images = _theme$images.general) === null || _theme$images === void 0 ? void 0 : _theme$images.deliveryIco : typeValue === 2 ? theme === null || theme === void 0 || (_theme$images2 = theme.images) === null || _theme$images2 === void 0 || (_theme$images2 = _theme$images2.general) === null || _theme$images2 === void 0 ? void 0 : _theme$images2.pickupIco : typeValue === 3 ? theme === null || theme === void 0 || (_theme$images3 = theme.images) === null || _theme$images3 === void 0 || (_theme$images3 = _theme$images3.general) === null || _theme$images3 === void 0 ? void 0 : _theme$images3.eatinIco : typeValue === 4 ? theme === null || theme === void 0 || (_theme$images4 = theme.images) === null || _theme$images4 === void 0 || (_theme$images4 = _theme$images4.general) === null || _theme$images4 === void 0 ? void 0 : _theme$images4.curbsideIco : typeValue === 5 ? theme === null || theme === void 0 || (_theme$images5 = theme.images) === null || _theme$images5 === void 0 || (_theme$images5 = _theme$images5.general) === null || _theme$images5 === void 0 ? void 0 : _theme$images5.drivethruIco : theme === null || theme === void 0 || (_theme$images6 = theme.images) === null || _theme$images6 === void 0 || (_theme$images6 = _theme$images6.general) === null || _theme$images6 === void 0 ? void 0 : _theme$images6.deliveryIco;
+  };
+  var handleClickOrderType = function handleClickOrderType(value) {
+    if (!(orderState !== null && orderState !== void 0 && orderState.loading)) {
+      changeType(value);
+      events.emit('go_to_page', {
+        page: 'search'
+      });
+    }
+  };
+  (0, _react.useEffect)(function () {
+    return function () {
+      return setModals({
+        listOpen: false,
+        formOpen: false
+      });
+    };
+  }, []);
+  (0, _react.useEffect)(function () {
+    var _orderState$options;
+    if (newAddressModalOpened) return;
+    if (auth && !orderState.loading && !(orderState !== null && orderState !== void 0 && (_orderState$options = orderState.options) !== null && _orderState$options !== void 0 && (_orderState$options = _orderState$options.address) !== null && _orderState$options !== void 0 && _orderState$options.location)) {
+      setModals(_objectSpread(_objectSpread({}, modals), {}, {
+        listOpen: true
+      }));
+      setNewAddressModalOpened(true);
+    }
+  }, [auth, orderState, newAddressModalOpened]);
+  var orderTypes = [{
+    value: 1,
+    text: t('DELIVERY', 'Delivery'),
+    description: t('ORDERTYPE_DESCRIPTION_DELIVERY', 'Delivery description'),
+    image: (_theme$images7 = theme.images) === null || _theme$images7 === void 0 || (_theme$images7 = _theme$images7.deliveryTypes) === null || _theme$images7 === void 0 ? void 0 : _theme$images7.delivery
+  }, {
+    value: 2,
+    text: t('PICKUP', 'Pickup'),
+    description: t('ORDERTYPE_DESCRIPTION_PICKUP', 'Pickup description'),
+    image: (_theme$images8 = theme.images) === null || _theme$images8 === void 0 || (_theme$images8 = _theme$images8.deliveryTypes) === null || _theme$images8 === void 0 ? void 0 : _theme$images8.pickUp
+  }, {
+    value: 3,
+    text: t('EAT_IN', 'Eat in'),
+    description: t('ORDERTYPE_DESCRIPTION_EATIN', 'Eat in description'),
+    image: (_theme$images9 = theme.images) === null || _theme$images9 === void 0 || (_theme$images9 = _theme$images9.deliveryTypes) === null || _theme$images9 === void 0 ? void 0 : _theme$images9.eatIn
+  }, {
+    value: 4,
+    text: t('CURBSIDE', 'Curbside'),
+    description: t('ORDERTYPE_DESCRIPTION_CURBSIDE', 'Curbside description'),
+    image: (_theme$images10 = theme.images) === null || _theme$images10 === void 0 || (_theme$images10 = _theme$images10.deliveryTypes) === null || _theme$images10 === void 0 ? void 0 : _theme$images10.curbside
+  }, {
+    value: 5,
+    text: t('DRIVE_THRU', 'Drive thru'),
+    description: t('ORDERTYPE_DESCRIPTION_DRIVETHRU', 'Drive Thru description'),
+    image: (_theme$images11 = theme.images) === null || _theme$images11 === void 0 || (_theme$images11 = _theme$images11.deliveryTypes) === null || _theme$images11 === void 0 ? void 0 : _theme$images11.driveThru
+  }];
+  return /*#__PURE__*/_react.default.createElement(_styles.HeroContainer, null, /*#__PURE__*/_react.default.createElement(_styles.ContentWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.HeroContent, null, /*#__PURE__*/_react.default.createElement(_styles.Title, null, t('TITLE_HOME', (theme === null || theme === void 0 || (_theme$defaultLanguag = theme.defaultLanguages) === null || _theme$defaultLanguag === void 0 ? void 0 : _theme$defaultLanguag.TITLE_HOME) || 'All We need is Food.')), /*#__PURE__*/_react.default.createElement(_styles.Slogan, null, t('SUBTITLE_HOME', (theme === null || theme === void 0 || (_theme$defaultLanguag2 = theme.defaultLanguages) === null || _theme$defaultLanguag2 === void 0 ? void 0 : _theme$defaultLanguag2.SUBTITLE_HOME) || 'Let\'s start to order food now')), orderTypes && (configTypes ? orderTypes.filter(function (type) {
+    return configTypes === null || configTypes === void 0 ? void 0 : configTypes.includes(type.value);
+  }) : orderTypes).map(function (item, i) {
+    var _item$text;
+    return /*#__PURE__*/_react.default.createElement(_styles.OrderTypeListItemContainer, {
+      key: i,
+      onClick: function onClick() {
+        return handleClickOrderType(item.value);
+      }
+    }, /*#__PURE__*/_react.default.createElement(_styles.IconTypeButton, null, /*#__PURE__*/_react.default.createElement("img", {
+      src: orderTypeIcon(item.value),
+      width: 24,
+      height: 24
+    })), /*#__PURE__*/_react.default.createElement(_styles.OrderTypeTitle, null, orderTypeTitle(item === null || item === void 0 || (_item$text = item.text) === null || _item$text === void 0 || (_item$text = _item$text.replace(' ', '_')) === null || _item$text === void 0 ? void 0 : _item$text.toLowerCase()) || item.text));
+  })), /*#__PURE__*/_react.default.createElement(_styles.HomeImage, {
+    bgimage: bgImg || ((_theme$images12 = theme.images) === null || _theme$images12 === void 0 || (_theme$images12 = _theme$images12.general) === null || _theme$images12 === void 0 ? void 0 : _theme$images12.homeHero)
+  })));
+};

package/_modules/themes/five/src/components/HomeHero/franchises/OloHomeHero/styles.js

@@ -0,0 +1,46 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Title = exports.Slogan = exports.OrderTypeTitle = exports.OrderTypeListItemContainer = exports.IconTypeButton = exports.HomeImage = exports.HeroContent = exports.HeroContainerStyled = exports.HeroContainer = exports.ContentWrapper = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var HeroContainerStyled = exports.HeroContainerStyled = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  height: fit-content;\n  position: relative;\n  ", "\n  padding: 40px;\n  box-sizing: border-box;\n  @media (min-width: 375px) {\n    height: 374px;\n  }\n\n  @media (min-width: 567px) {\n    height: 660px;\n    margin-bottom: 0;\n  }\n"])), function (_ref) {
+  var mb = _ref.mb;
+  return mb && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    margin-bottom: ", ";\n  "])), mb);
+});
+var HeroContainer = exports.HeroContainer = function HeroContainer(props) {
+  return /*#__PURE__*/_react.default.createElement(HeroContainerStyled, props, props.children);
+};
+var ContentWrapper = exports.ContentWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    display: flex;\n\n    height: 100%;\n    padding: 0px 10vw 0px;\n\n    input {\n      width: 90%;\n      margin-bottom: 15px;\n    }\n\n    @media (min-width: 576px) {\n      justify-content: center;\n      padding: 0px 40px 0px;\n      input {\n        width: 97%;\n      }\n    }\n\n    @media (min-width: 768px) {\n      ", "\n    }\n"])), function (props) {
+  var _props$theme;
+  return ((_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.rtl) && (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        padding: 0px 40px 0px;\n      "])));
+});
+var Title = exports.Title = _styledComponents.default.h1(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  margin: 0px;\n  text-align: left;\n  font-weight: 600;\n  font-size: 40px;\n  line-height: 36px;\n  letter-spacing: 0px;\n  color: #000;\n  opacity: 1;\n\n  ", "\n"])), function (props) {
+  var _props$theme2;
+  return ((_props$theme2 = props.theme) === null || _props$theme2 === void 0 ? void 0 : _props$theme2.rtl) && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      text-align: right;\n  "])));
+});
+var Slogan = exports.Slogan = _styledComponents.default.p(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin: 0px;\n  text-align: left;\n  font-size: 18px;\n  font-size: 400;\n  color: #000;\n  opacity: 1;\n  margin-bottom: 30px;\n\n  ", "\n"])), function (props) {
+  var _props$theme3;
+  return ((_props$theme3 = props.theme) === null || _props$theme3 === void 0 ? void 0 : _props$theme3.rtl) && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n      text-align: right;\n  "])));
+});
+var HeroContent = exports.HeroContent = _styledComponents.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  width: 35%;\n  padding: 25px;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.12);\n"])));
+var HomeImage = exports.HomeImage = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  width: 65%;\n  height: 100%;\n  background-image: ", ";\n"])), function (_ref2) {
+  var bgimage = _ref2.bgimage;
+  return "url(".concat(bgimage, ")");
+});
+var OrderTypeListItemContainer = exports.OrderTypeListItemContainer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 75px;\n  border-radius: 7.6px;\n  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.10);\n  padding: 16px;\n  display: flex;\n  box-sizing: border-box;\n  margin-bottom: 15px;\n  cursor: pointer;\n"])));
+var OrderTypeTitle = exports.OrderTypeTitle = _styledComponents.default.p(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  font-size: 16px;\n  box-sizing: border-box;\n"])));
+var IconTypeButton = exports.IconTypeButton = _styledComponents.default.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 44px;\n  height: 44px;\n  background: ", ";\n  border-radius: 44px;\n  margin-right: 30px;\n"])), function (_ref3) {
+  var _theme$colors;
+  var activated = _ref3.activated,
+    theme = _ref3.theme;
+  return activated ? theme === null || theme === void 0 || (_theme$colors = theme.colors) === null || _theme$colors === void 0 ? void 0 : _theme$colors.white : '#F3F9FF';
+});