ordering-ui-external 2.4.5 → 2.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (135) hide show
  1. package/_bundles/{0.ordering-ui.83ddb51fdc85c2b920b0.js → 0.ordering-ui.5657c6a53b3791887fd7.js} +1 -1
  2. package/_bundles/{1.ordering-ui.83ddb51fdc85c2b920b0.js → 1.ordering-ui.5657c6a53b3791887fd7.js} +1 -1
  3. package/_bundles/{2.ordering-ui.83ddb51fdc85c2b920b0.js → 2.ordering-ui.5657c6a53b3791887fd7.js} +1 -1
  4. package/_bundles/{4.ordering-ui.83ddb51fdc85c2b920b0.js → 4.ordering-ui.5657c6a53b3791887fd7.js} +1 -1
  5. package/_bundles/{5.ordering-ui.83ddb51fdc85c2b920b0.js → 5.ordering-ui.5657c6a53b3791887fd7.js} +1 -1
  6. package/_bundles/{6.ordering-ui.83ddb51fdc85c2b920b0.js → 6.ordering-ui.5657c6a53b3791887fd7.js} +1 -1
  7. package/_bundles/{7.ordering-ui.83ddb51fdc85c2b920b0.js → 7.ordering-ui.5657c6a53b3791887fd7.js} +2 -2
  8. package/_bundles/{8.ordering-ui.83ddb51fdc85c2b920b0.js → 8.ordering-ui.5657c6a53b3791887fd7.js} +1 -1
  9. package/_bundles/{9.ordering-ui.83ddb51fdc85c2b920b0.js → 9.ordering-ui.5657c6a53b3791887fd7.js} +1 -1
  10. package/_bundles/ordering-ui.5657c6a53b3791887fd7.js +2 -0
  11. package/_modules/components/OrdersOption/styles.js +1 -1
  12. package/_modules/components/VerticalOrdersLayout/SingleOrderCard/index.js +15 -8
  13. package/_modules/components/VerticalOrdersLayout/styles.js +2 -2
  14. package/_modules/contexts/ThemeContext/index.js +1 -0
  15. package/_modules/themes/five/src/components/AddressList/index.js +8 -7
  16. package/_modules/themes/five/src/components/BusinessBasicInformation/index.js +28 -22
  17. package/_modules/themes/five/src/components/BusinessBasicInformation/styles.js +22 -21
  18. package/_modules/themes/five/src/components/BusinessController/index.js +5 -3
  19. package/_modules/themes/five/src/components/BusinessInformation/index.js +16 -10
  20. package/_modules/themes/five/src/components/BusinessItemAccordion/index.js +5 -8
  21. package/_modules/themes/five/src/components/BusinessListingSearch/index.js +93 -74
  22. package/_modules/themes/five/src/components/BusinessListingSearch/styles.js +10 -4
  23. package/_modules/themes/five/src/components/BusinessProductsCategories/index.js +7 -2
  24. package/_modules/themes/five/src/components/BusinessProductsCategories/styles.js +1 -1
  25. package/_modules/themes/five/src/components/BusinessProductsList/index.js +1 -1
  26. package/_modules/themes/five/src/components/BusinessProductsListing/index.js +38 -13
  27. package/_modules/themes/five/src/components/BusinessProductsListing/styles.js +20 -9
  28. package/_modules/themes/five/src/components/BusinessesListing/layouts/OriginalBusinessesListing/index.js +35 -23
  29. package/_modules/themes/five/src/components/Cart/index.js +7 -3
  30. package/_modules/themes/five/src/components/Checkout/index.js +12 -11
  31. package/_modules/themes/five/src/components/Checkout/styles.js +8 -4
  32. package/_modules/themes/five/src/components/GiftCard/GiftCardUI/index.js +1 -0
  33. package/_modules/themes/five/src/components/GiftCard/PurchaseGiftCard/index.js +4 -3
  34. package/_modules/themes/five/src/components/GiftCard/PurchaseGiftCard/styles.js +14 -8
  35. package/_modules/themes/five/src/components/GiftCard/RedeemGiftCard/index.js +1 -1
  36. package/_modules/themes/five/src/components/Header/index.js +29 -21
  37. package/_modules/themes/five/src/components/Header/styles.js +44 -40
  38. package/_modules/themes/five/src/components/MultiCheckout/index.js +18 -16
  39. package/_modules/themes/five/src/components/MultiOrdersDetails/SingleOrderCard.js +6 -4
  40. package/_modules/themes/five/src/components/MyOrders/index.js +16 -10
  41. package/_modules/themes/five/src/components/MyOrders/styles.js +15 -12
  42. package/_modules/themes/five/src/components/OrderDetails/OrderEta.js +5 -2
  43. package/_modules/themes/five/src/components/OrderDetails/OrderHistory.js +2 -2
  44. package/_modules/themes/five/src/components/OrderDetails/index.js +2 -2
  45. package/_modules/themes/five/src/components/OrderItAgain/styles.js +1 -1
  46. package/_modules/themes/five/src/components/OrderProgress/index.js +15 -4
  47. package/_modules/themes/five/src/components/OrderTypeSelectorContent/index.js +16 -4
  48. package/_modules/themes/five/src/components/PageBanner/styles.js +1 -1
  49. package/_modules/themes/five/src/components/ProductForm/index.js +27 -7
  50. package/_modules/themes/five/src/components/ProductForm/styles.js +40 -31
  51. package/_modules/themes/five/src/components/ProductItemAccordion/index.js +6 -6
  52. package/_modules/themes/five/src/components/RenderProductsLayout/index.js +3 -3
  53. package/_modules/themes/five/src/components/ReviewProduct/index.js +9 -4
  54. package/_modules/themes/five/src/components/ServiceForm/index.js +22 -3
  55. package/_modules/themes/five/src/components/ServiceForm/styles.js +9 -3
  56. package/_modules/themes/five/src/components/SidebarMenu/index.js +19 -10
  57. package/_modules/themes/five/src/components/SignUpForm/index.js +56 -29
  58. package/_modules/themes/five/src/components/SingleOrderCard/index.js +1 -1
  59. package/_modules/themes/five/src/components/SingleOrderCard/styles.js +26 -24
  60. package/_modules/themes/five/src/components/SingleProductCard/layouts/original/index.js +9 -5
  61. package/_modules/themes/five/src/components/SingleProductCard/layouts/original/styles.js +2 -2
  62. package/_modules/themes/five/src/components/UpsellingPage/index.js +2 -1
  63. package/_modules/themes/five/src/components/UserFormDetails/index.js +58 -18
  64. package/_modules/themes/five/src/components/UserFormDetails/styles.js +7 -3
  65. package/_modules/themes/five/src/components/UserPopover/index.js +41 -25
  66. package/_modules/themes/five/src/components/UserProfileForm/index.js +19 -11
  67. package/_modules/themes/five/src/styles/Buttons/index.js +68 -58
  68. package/_modules/themes/five/src/styles/Inputs/index.js +40 -16
  69. package/_modules/utils/index.js +8 -2
  70. package/index.html +1 -1
  71. package/package.json +3 -2
  72. package/src/components/OrdersOption/styles.js +1 -0
  73. package/src/components/VerticalOrdersLayout/SingleOrderCard/index.js +35 -17
  74. package/src/components/VerticalOrdersLayout/styles.js +9 -0
  75. package/src/contexts/ThemeContext/index.js +1 -0
  76. package/src/themes/five/src/components/AddressList/index.js +6 -6
  77. package/src/themes/five/src/components/BusinessBasicInformation/index.js +24 -22
  78. package/src/themes/five/src/components/BusinessBasicInformation/styles.js +24 -3
  79. package/src/themes/five/src/components/BusinessController/index.js +4 -2
  80. package/src/themes/five/src/components/BusinessInformation/index.js +24 -12
  81. package/src/themes/five/src/components/BusinessItemAccordion/index.js +5 -6
  82. package/src/themes/five/src/components/BusinessListingSearch/index.js +127 -101
  83. package/src/themes/five/src/components/BusinessListingSearch/styles.js +15 -0
  84. package/src/themes/five/src/components/BusinessProductsCategories/index.js +7 -2
  85. package/src/themes/five/src/components/BusinessProductsCategories/styles.js +1 -1
  86. package/src/themes/five/src/components/BusinessProductsList/index.js +1 -1
  87. package/src/themes/five/src/components/BusinessProductsListing/index.js +34 -9
  88. package/src/themes/five/src/components/BusinessProductsListing/styles.js +26 -0
  89. package/src/themes/five/src/components/BusinessesListing/layouts/OriginalBusinessesListing/index.js +9 -2
  90. package/src/themes/five/src/components/Cart/index.js +3 -4
  91. package/src/themes/five/src/components/Checkout/index.js +18 -4
  92. package/src/themes/five/src/components/Checkout/styles.js +22 -0
  93. package/src/themes/five/src/components/GiftCard/GiftCardUI/index.js +1 -0
  94. package/src/themes/five/src/components/GiftCard/PurchaseGiftCard/index.js +41 -31
  95. package/src/themes/five/src/components/GiftCard/PurchaseGiftCard/styles.js +15 -4
  96. package/src/themes/five/src/components/GiftCard/RedeemGiftCard/index.js +2 -2
  97. package/src/themes/five/src/components/Header/index.js +17 -5
  98. package/src/themes/five/src/components/Header/styles.js +9 -6
  99. package/src/themes/five/src/components/MultiCheckout/index.js +9 -10
  100. package/src/themes/five/src/components/MultiOrdersDetails/SingleOrderCard.js +8 -5
  101. package/src/themes/five/src/components/MyOrders/index.js +13 -9
  102. package/src/themes/five/src/components/MyOrders/styles.js +3 -1
  103. package/src/themes/five/src/components/OrderDetails/OrderEta.js +3 -2
  104. package/src/themes/five/src/components/OrderDetails/OrderHistory.js +8 -2
  105. package/src/themes/five/src/components/OrderDetails/index.js +2 -2
  106. package/src/themes/five/src/components/OrderItAgain/styles.js +1 -1
  107. package/src/themes/five/src/components/OrderProgress/index.js +16 -5
  108. package/src/themes/five/src/components/OrderTypeSelectorContent/index.js +7 -4
  109. package/src/themes/five/src/components/PageBanner/styles.js +1 -4
  110. package/src/themes/five/src/components/ProductForm/index.js +23 -5
  111. package/src/themes/five/src/components/ProductForm/styles.js +36 -1
  112. package/src/themes/five/src/components/ProductItemAccordion/index.js +37 -29
  113. package/src/themes/five/src/components/RenderProductsLayout/index.js +3 -3
  114. package/src/themes/five/src/components/ReviewProduct/index.js +14 -6
  115. package/src/themes/five/src/components/ServiceForm/index.js +22 -4
  116. package/src/themes/five/src/components/ServiceForm/styles.js +16 -0
  117. package/src/themes/five/src/components/SidebarMenu/index.js +162 -144
  118. package/src/themes/five/src/components/SignUpForm/index.js +4 -3
  119. package/src/themes/five/src/components/SingleOrderCard/index.js +1 -1
  120. package/src/themes/five/src/components/SingleOrderCard/styles.js +9 -1
  121. package/src/themes/five/src/components/SingleProductCard/layouts/original/index.js +13 -3
  122. package/src/themes/five/src/components/SingleProductCard/layouts/original/styles.js +2 -2
  123. package/src/themes/five/src/components/UpsellingPage/index.js +1 -1
  124. package/src/themes/five/src/components/UserFormDetails/index.js +58 -14
  125. package/src/themes/five/src/components/UserFormDetails/styles.js +16 -0
  126. package/src/themes/five/src/components/UserPopover/index.js +26 -15
  127. package/src/themes/five/src/components/UserProfileForm/index.js +18 -9
  128. package/src/themes/five/src/styles/Buttons/index.js +11 -0
  129. package/src/themes/five/src/styles/Inputs/index.js +34 -0
  130. package/src/utils/index.js +5 -0
  131. package/template/app.js +5 -3
  132. package/template/theme.json +335 -24
  133. package/_bundles/ordering-ui.83ddb51fdc85c2b920b0.js +0 -2
  134. /package/_bundles/{7.ordering-ui.83ddb51fdc85c2b920b0.js.LICENSE.txt → 7.ordering-ui.5657c6a53b3791887fd7.js.LICENSE.txt} +0 -0
  135. /package/_bundles/{ordering-ui.83ddb51fdc85c2b920b0.js.LICENSE.txt → ordering-ui.5657c6a53b3791887fd7.js.LICENSE.txt} +0 -0
@@ -8,11 +8,11 @@ exports.TextArea = exports.InputSecundary = exports.InputPrimary = exports.Input
8
8
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
9
9
  var _polished = require("polished");
10
10
  var _Buttons = require("../Buttons");
11
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
11
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23;
12
12
  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); }
13
13
  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; }
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
- var Input = _styledComponents.default.input(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background: #FFF;\n color: #010300;\n border: 1px solid #DBDCDB;\n border-radius: 7.6px;\n font-size: 16px;\n padding: 7px 15px;\n outline: none;\n &:focus {\n border-color: ", ";\n }\n ", "\n &::placeholder,\n &::-webkit-input-placeholder {\n color: #DBDCDB;\n }\n &:-ms-input-placeholder {\n color: #DBDCDB;\n }\n ", "\n ", "\n"])), function () {
15
+ var Input = _styledComponents.default.input(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background: #FFF;\n color: #010300;\n border: 1px solid #DBDCDB;\n border-radius: 7.6px;\n font-size: 16px;\n padding: 7px 15px;\n outline: none;\n &:focus {\n border-color: ", ";\n }\n ", "\n &::placeholder,\n &::-webkit-input-placeholder {\n color: #DBDCDB;\n }\n &:-ms-input-placeholder {\n color: #DBDCDB;\n }\n ", "\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function () {
16
16
  return (0, _polished.darken)(0.07, '#CCC');
17
17
  }, function (_ref) {
18
18
  var w = _ref.w;
@@ -26,34 +26,58 @@ var Input = _styledComponents.default.input(_templateObject || (_templateObject
26
26
  var _props$theme$colors;
27
27
  return (_props$theme$colors = props.theme.colors) === null || _props$theme$colors === void 0 ? void 0 : _props$theme$colors.danger500;
28
28
  });
29
+ }, function (_ref4) {
30
+ var _theme$general, _theme$general$compon, _theme$general$compon2, _theme$general2, _theme$general2$compo, _theme$general2$compo2;
31
+ var theme = _ref4.theme;
32
+ return (theme === null || theme === void 0 ? void 0 : (_theme$general = theme.general) === null || _theme$general === void 0 ? void 0 : (_theme$general$compon = _theme$general.components) === null || _theme$general$compon === void 0 ? void 0 : (_theme$general$compon2 = _theme$general$compon.inputs) === null || _theme$general$compon2 === void 0 ? void 0 : _theme$general$compon2.borderRadius) && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n border-radius: ", ";\n "])), theme === null || theme === void 0 ? void 0 : (_theme$general2 = theme.general) === null || _theme$general2 === void 0 ? void 0 : (_theme$general2$compo = _theme$general2.components) === null || _theme$general2$compo === void 0 ? void 0 : (_theme$general2$compo2 = _theme$general2$compo.inputs) === null || _theme$general2$compo2 === void 0 ? void 0 : _theme$general2$compo2.borderRadius);
33
+ }, function (_ref5) {
34
+ var _theme$general3, _theme$general3$compo, _theme$general3$compo2, _theme$general4, _theme$general4$compo, _theme$general4$compo2;
35
+ var theme = _ref5.theme;
36
+ return (theme === null || theme === void 0 ? void 0 : (_theme$general3 = theme.general) === null || _theme$general3 === void 0 ? void 0 : (_theme$general3$compo = _theme$general3.components) === null || _theme$general3$compo === void 0 ? void 0 : (_theme$general3$compo2 = _theme$general3$compo.inputs) === null || _theme$general3$compo2 === void 0 ? void 0 : _theme$general3$compo2.color) && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n color: ", ";\n "])), theme === null || theme === void 0 ? void 0 : (_theme$general4 = theme.general) === null || _theme$general4 === void 0 ? void 0 : (_theme$general4$compo = _theme$general4.components) === null || _theme$general4$compo === void 0 ? void 0 : (_theme$general4$compo2 = _theme$general4$compo.inputs) === null || _theme$general4$compo2 === void 0 ? void 0 : _theme$general4$compo2.color);
37
+ }, function (_ref6) {
38
+ var _theme$general5, _theme$general5$compo, _theme$general5$compo2, _theme$general6, _theme$general6$compo, _theme$general6$compo2, _theme$general7, _theme$general7$compo, _theme$general7$compo2;
39
+ var theme = _ref6.theme;
40
+ return (theme === null || theme === void 0 ? void 0 : (_theme$general5 = theme.general) === null || _theme$general5 === void 0 ? void 0 : (_theme$general5$compo = _theme$general5.components) === null || _theme$general5$compo === void 0 ? void 0 : (_theme$general5$compo2 = _theme$general5$compo.inputs) === null || _theme$general5$compo2 === void 0 ? void 0 : _theme$general5$compo2.borderColor) && (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n border: 1px solid ", ";\n &::placeholder,\n &::-webkit-input-placeholder,\n &:-ms-input-placeholder {\n color: ", ";\n }\n "])), theme === null || theme === void 0 ? void 0 : (_theme$general6 = theme.general) === null || _theme$general6 === void 0 ? void 0 : (_theme$general6$compo = _theme$general6.components) === null || _theme$general6$compo === void 0 ? void 0 : (_theme$general6$compo2 = _theme$general6$compo.inputs) === null || _theme$general6$compo2 === void 0 ? void 0 : _theme$general6$compo2.borderColor, theme === null || theme === void 0 ? void 0 : (_theme$general7 = theme.general) === null || _theme$general7 === void 0 ? void 0 : (_theme$general7$compo = _theme$general7.components) === null || _theme$general7$compo === void 0 ? void 0 : (_theme$general7$compo2 = _theme$general7$compo.inputs) === null || _theme$general7$compo2 === void 0 ? void 0 : _theme$general7$compo2.borderColor);
29
41
  });
30
42
  exports.Input = Input;
31
- var InputGroup = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n & > ", ":not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n border-left: 0;\n padding-left: 0;\n }\n & > ", ":not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: 0;\n padding-right: 0;\n }\n"])), Input, Input);
43
+ var InputGroup = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n display: flex;\n & > ", ":not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n border-left: 0;\n padding-left: 0;\n }\n & > ", ":not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: 0;\n padding-right: 0;\n }\n"])), Input, Input);
32
44
  exports.InputGroup = InputGroup;
33
- var InputGroupLeft = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n line-height: 34px;\n padding-left: 7px;\n padding-right: 7px;\n font-size: 16px;\n border-width: 1px;\n height: 34px;\n border-style: solid;\n ", "\n & ", " {\n margin-left: -7px;\n ", "\n }\n"])), function (props) {
45
+ var InputGroupLeft = _styledComponents.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n line-height: 34px;\n padding-left: 7px;\n padding-right: 7px;\n font-size: 16px;\n border-width: 1px;\n height: 34px;\n border-style: solid;\n ", "\n & ", " {\n margin-left: -7px;\n ", "\n }\n"])), function (props) {
34
46
  var _props$theme;
35
- return (_props$theme = props.theme) !== null && _props$theme !== void 0 && _props$theme.rtl ? (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n border-left-width: 0;\n border-radius: 34px 34px 0 0;\n "]))) : (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n border-radius: 34px 0 0 34px;\n border-right-width: 0;\n "])));
47
+ return (_props$theme = props.theme) !== null && _props$theme !== void 0 && _props$theme.rtl ? (0, _styledComponents.css)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n border-left-width: 0;\n border-radius: 34px 34px 0 0;\n "]))) : (0, _styledComponents.css)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n border-radius: 34px 0 0 34px;\n border-right-width: 0;\n "])));
36
48
  }, _Buttons.Button, function (props) {
37
49
  var _props$theme2;
38
- return ((_props$theme2 = props.theme) === null || _props$theme2 === void 0 ? void 0 : _props$theme2.rtl) && (0, _styledComponents.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n margin-right: -7px;\n margin-left: 0;\n "])));
50
+ return ((_props$theme2 = props.theme) === null || _props$theme2 === void 0 ? void 0 : _props$theme2.rtl) && (0, _styledComponents.css)(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n margin-right: -7px;\n margin-left: 0;\n "])));
39
51
  });
40
52
  exports.InputGroupLeft = InputGroupLeft;
41
- var TextArea = _styledComponents.default.textarea(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n background: #FFF;\n color: #010300;\n border: 1px solid #DBDCDB;\n border-radius: 7.6px;\n font-size: 16px;\n padding: 7px 15px;\n outline: none;\n resize: none;\n &:focus {\n border-color: ", ";\n }\n ", "\n &::placeholder,\n &::-webkit-input-placeholder {\n color: #DBDCDB;\n }\n &:-ms-input-placeholder {\n color: #DBDCDB;\n }\n"])), function () {
53
+ var TextArea = _styledComponents.default.textarea(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n background: #FFF;\n color: #010300;\n border: 1px solid #DBDCDB;\n border-radius: 7.6px;\n font-size: 16px;\n padding: 7px 15px;\n outline: none;\n resize: none;\n &:focus {\n border-color: ", ";\n }\n ", "\n &::placeholder,\n &::-webkit-input-placeholder {\n color: #DBDCDB;\n }\n &:-ms-input-placeholder {\n color: #DBDCDB;\n }\n\n ", "\n\n ", "\n\n ", "\n"])), function () {
42
54
  return (0, _polished.darken)(0.07, '#CCC');
43
- }, function (_ref4) {
44
- var w = _ref4.w;
45
- return w && (0, _styledComponents.css)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n width: 20%;\n "])));
55
+ }, function (_ref7) {
56
+ var w = _ref7.w;
57
+ return w && (0, _styledComponents.css)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n width: 20%;\n "])));
58
+ }, function (_ref8) {
59
+ var _theme$general8, _theme$general8$compo, _theme$general8$compo2, _theme$general9, _theme$general9$compo, _theme$general9$compo2;
60
+ var theme = _ref8.theme;
61
+ return (theme === null || theme === void 0 ? void 0 : (_theme$general8 = theme.general) === null || _theme$general8 === void 0 ? void 0 : (_theme$general8$compo = _theme$general8.components) === null || _theme$general8$compo === void 0 ? void 0 : (_theme$general8$compo2 = _theme$general8$compo.inputs) === null || _theme$general8$compo2 === void 0 ? void 0 : _theme$general8$compo2.borderRadius) && (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n border-radius: ", ";\n "])), theme === null || theme === void 0 ? void 0 : (_theme$general9 = theme.general) === null || _theme$general9 === void 0 ? void 0 : (_theme$general9$compo = _theme$general9.components) === null || _theme$general9$compo === void 0 ? void 0 : (_theme$general9$compo2 = _theme$general9$compo.inputs) === null || _theme$general9$compo2 === void 0 ? void 0 : _theme$general9$compo2.borderRadius);
62
+ }, function (_ref9) {
63
+ var _theme$general10, _theme$general10$comp, _theme$general10$comp2, _theme$general11, _theme$general11$comp, _theme$general11$comp2;
64
+ var theme = _ref9.theme;
65
+ return (theme === null || theme === void 0 ? void 0 : (_theme$general10 = theme.general) === null || _theme$general10 === void 0 ? void 0 : (_theme$general10$comp = _theme$general10.components) === null || _theme$general10$comp === void 0 ? void 0 : (_theme$general10$comp2 = _theme$general10$comp.inputs) === null || _theme$general10$comp2 === void 0 ? void 0 : _theme$general10$comp2.color) && (0, _styledComponents.css)(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n color: ", ";\n "])), theme === null || theme === void 0 ? void 0 : (_theme$general11 = theme.general) === null || _theme$general11 === void 0 ? void 0 : (_theme$general11$comp = _theme$general11.components) === null || _theme$general11$comp === void 0 ? void 0 : (_theme$general11$comp2 = _theme$general11$comp.inputs) === null || _theme$general11$comp2 === void 0 ? void 0 : _theme$general11$comp2.color);
66
+ }, function (_ref10) {
67
+ var _theme$general12, _theme$general12$comp, _theme$general12$comp2, _theme$general13, _theme$general13$comp, _theme$general13$comp2, _theme$general14, _theme$general14$comp, _theme$general14$comp2;
68
+ var theme = _ref10.theme;
69
+ return (theme === null || theme === void 0 ? void 0 : (_theme$general12 = theme.general) === null || _theme$general12 === void 0 ? void 0 : (_theme$general12$comp = _theme$general12.components) === null || _theme$general12$comp === void 0 ? void 0 : (_theme$general12$comp2 = _theme$general12$comp.inputs) === null || _theme$general12$comp2 === void 0 ? void 0 : _theme$general12$comp2.borderColor) && (0, _styledComponents.css)(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n border: 1px solid ", ";\n &::placeholder,\n &::-webkit-input-placeholder,\n &:-ms-input-placeholder {\n color: ", ";\n }\n "])), theme === null || theme === void 0 ? void 0 : (_theme$general13 = theme.general) === null || _theme$general13 === void 0 ? void 0 : (_theme$general13$comp = _theme$general13.components) === null || _theme$general13$comp === void 0 ? void 0 : (_theme$general13$comp2 = _theme$general13$comp.inputs) === null || _theme$general13$comp2 === void 0 ? void 0 : _theme$general13$comp2.borderColor, theme === null || theme === void 0 ? void 0 : (_theme$general14 = theme.general) === null || _theme$general14 === void 0 ? void 0 : (_theme$general14$comp = _theme$general14.components) === null || _theme$general14$comp === void 0 ? void 0 : (_theme$general14$comp2 = _theme$general14$comp.inputs) === null || _theme$general14$comp2 === void 0 ? void 0 : _theme$general14$comp2.borderColor);
46
70
  });
47
71
  exports.TextArea = TextArea;
48
- var InputGroupRight = (0, _styledComponents.default)(InputGroupLeft)(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n border-radius: 0 34px 34px 0;\n line-height: 34px;\n border-right-width: 1px;\n border-left-width: 0;\n ", "\n & ", " {\n margin-left: 0;\n margin-right: -7px;\n ", "\n }\n \n"])), function (props) {
72
+ var InputGroupRight = (0, _styledComponents.default)(InputGroupLeft)(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n border-radius: 0 34px 34px 0;\n line-height: 34px;\n border-right-width: 1px;\n border-left-width: 0;\n ", "\n & ", " {\n margin-left: 0;\n margin-right: -7px;\n ", "\n }\n \n"])), function (props) {
49
73
  var _props$theme3;
50
- return ((_props$theme3 = props.theme) === null || _props$theme3 === void 0 ? void 0 : _props$theme3.rtl) && (0, _styledComponents.css)(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n border-left-width: 1px;\n border-right-width: 0;\n border-radius: 0 0 34px 34px;\n "])));
74
+ return ((_props$theme3 = props.theme) === null || _props$theme3 === void 0 ? void 0 : _props$theme3.rtl) && (0, _styledComponents.css)(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n border-left-width: 1px;\n border-right-width: 0;\n border-radius: 0 0 34px 34px;\n "])));
51
75
  }, _Buttons.Button, function (props) {
52
76
  var _props$theme4;
53
- return ((_props$theme4 = props.theme) === null || _props$theme4 === void 0 ? void 0 : _props$theme4.rtl) && (0, _styledComponents.css)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n margin-left: -7px;\n margin-right: 0;\n "])));
77
+ return ((_props$theme4 = props.theme) === null || _props$theme4 === void 0 ? void 0 : _props$theme4.rtl) && (0, _styledComponents.css)(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n margin-left: -7px;\n margin-right: 0;\n "])));
54
78
  });
55
79
  exports.InputGroupRight = InputGroupRight;
56
- var InputPrimary = (0, _styledComponents.default)(Input)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n background: #FFF;\n color: ", ";\n border-color: ", ";\n &:focus {\n border-color: ", ";\n }\n"])), function (props) {
80
+ var InputPrimary = (0, _styledComponents.default)(Input)(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n background: #FFF;\n color: ", ";\n border-color: ", ";\n &:focus {\n border-color: ", ";\n }\n"])), function (props) {
57
81
  return props.theme.colors.primary;
58
82
  }, function (props) {
59
83
  return props.theme.colors.primary;
@@ -61,7 +85,7 @@ var InputPrimary = (0, _styledComponents.default)(Input)(_templateObject15 || (_
61
85
  return (0, _polished.darken)(0.1, props.theme.colors.primary);
62
86
  });
63
87
  exports.InputPrimary = InputPrimary;
64
- var InputSecundary = (0, _styledComponents.default)(Input)(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n background: #FFF;\n color: ", ";\n border-color: ", ";\n &:focus {\n border-color: ", ";\n }\n"])), function (props) {
88
+ var InputSecundary = (0, _styledComponents.default)(Input)(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n background: #FFF;\n color: ", ";\n border-color: ", ";\n &:focus {\n border-color: ", ";\n }\n"])), function (props) {
65
89
  return props.theme.colors.secundary;
66
90
  }, function (props) {
67
91
  return props.theme.colors.secundary;
@@ -69,7 +93,7 @@ var InputSecundary = (0, _styledComponents.default)(Input)(_templateObject16 ||
69
93
  return (0, _polished.darken)(0.1, props.theme.colors.secundary);
70
94
  });
71
95
  exports.InputSecundary = InputSecundary;
72
- var InputGroupPrimary = (0, _styledComponents.default)(InputGroup)(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n & > ", " {\n color: ", ";\n border-color: ", ";\n }\n"])), InputGroupLeft, function (props) {
96
+ var InputGroupPrimary = (0, _styledComponents.default)(InputGroup)(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n & > ", " {\n color: ", ";\n border-color: ", ";\n }\n"])), InputGroupLeft, function (props) {
73
97
  return props.theme.colors.primary;
74
98
  }, function (props) {
75
99
  return props.theme.colors.primary;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.verifyDecimals = exports.sortInputFields = exports.shape = exports.scrollTo = exports.reviewCommentList = exports.priceList = exports.lightenDarkenColor = exports.getTraduction = exports.getTimes = exports.getStarWidth = exports.getOrderStatus = exports.getIconCard = exports.getHourMin = exports.getGoogleMapImage = exports.getDistance = exports.getCateringValues = exports.formatUrlVideo = exports.formatSeconds = exports.flatArray = exports.fieldsToSort = exports.convertToRadian = exports.convertHoursToMinutes = exports.checkSiteUrl = exports.capitalize = exports.calendarLanguages = exports.bytesConverter = void 0;
6
+ exports.verifyDecimals = exports.sortInputFields = exports.shape = exports.scrollTo = exports.reviewCommentList = exports.priceList = exports.orderTypeList = exports.lightenDarkenColor = exports.getTraduction = exports.getTimes = exports.getStarWidth = exports.getOrderStatus = exports.getIconCard = exports.getHourMin = exports.getGoogleMapImage = exports.getDistance = exports.getCateringValues = exports.formatUrlVideo = exports.formatSeconds = exports.flatArray = exports.fieldsToSort = exports.convertToRadian = exports.convertHoursToMinutes = exports.checkSiteUrl = exports.capitalize = exports.calendarLanguages = exports.bytesConverter = void 0;
7
7
  var _orderingComponentsExternal = require("ordering-components-external");
8
8
  var _styledComponents = require("styled-components");
9
9
  function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
@@ -406,12 +406,18 @@ var priceList = [{
406
406
  content: '$$$$$'
407
407
  }];
408
408
 
409
+ /**
410
+ * List of order type
411
+ */
412
+ exports.priceList = priceList;
413
+ var orderTypeList = ['delivery', 'pickup', 'eatin', 'curbside', 'drivethru', 'seatdelivery'];
414
+
409
415
  /**
410
416
  * function to manage review comment list
411
417
  * @param {number} param0 type of reviews to return
412
418
  * @returns object with reviews dictionary
413
419
  */
414
- exports.priceList = priceList;
420
+ exports.orderTypeList = orderTypeList;
415
421
  var reviewCommentList = function reviewCommentList(type) {
416
422
  var _useLanguage5 = (0, _orderingComponentsExternal.useLanguage)(),
417
423
  _useLanguage6 = _slicedToArray(_useLanguage5, 2),
package/index.html CHANGED
@@ -8,7 +8,7 @@
8
8
  <link rel="apple-touch-icon" href="/favicon.png">
9
9
  <link rel="android-touch-icon" href="/favicon.png">
10
10
  <link rel="windows-touch-icon" href="/favicon.png">
11
- <link rel="icon" href="/favicon.png" type="image/png" sizes="16x16">
11
+ <link rel="icon" href="/favicon.png" type="image/png" sizes="16x16" id='favicon'>
12
12
  <title><%= htmlWebpackPlugin.options.title %></title>
13
13
  <style type="text/css" id="styles"></style>
14
14
  <style>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ordering-ui-external",
3
- "version": "2.4.5",
3
+ "version": "2.5.0",
4
4
  "description": "Ordering UI Components",
5
5
  "main": "./_modules/index.js",
6
6
  "exports": {
@@ -86,7 +86,8 @@
86
86
  "libphonenumber-js": "^1.9.4",
87
87
  "lodash": "^4.17.19",
88
88
  "moment": "^2.29.4",
89
- "ordering-components-external": "2.5.3",
89
+ "nanoid": "^4.0.0",
90
+ "ordering-components-external": "2.6.0",
90
91
  "polished": "^3.6.6",
91
92
  "react-bootstrap-icons": "^1.7.2",
92
93
  "react-calendar": "^3.3.1",
@@ -243,6 +243,7 @@ export const ImageNotFound = styled.div`
243
243
  `
244
244
 
245
245
  export const BusinessInformation = styled.div`
246
+ width: 80%;
246
247
  display: inline-flex;
247
248
  flex-direction: column;
248
249
  flex: 1;
@@ -47,10 +47,18 @@ const SingleOrderCardUI = (props) => {
47
47
  onRedirectPage({ page, params })
48
48
  }
49
49
 
50
+ const hideBusinessLogo = theme?.orders?.components?.business_logo?.hidden
51
+ const hideDate = theme?.orders?.components?.date?.hidden
52
+ const hideBusinessName = theme?.orders?.components?.business_name?.hidden
53
+ const hideOrderNumber = theme?.orders?.components?.order_number?.hidden
54
+ const hideReviewOrderButton = theme?.orders?.components?.review_order_button?.hidden
55
+ const hideReorderButton = theme?.orders?.components?.reorder_button?.hidden
56
+ const hideOrderStatus = theme?.orders?.components?.order_status?.hidden
57
+
50
58
  return (
51
59
  <SingleCard key={order.id} id='order-card' onClick={(e) => handleClickCard(e, order)}>
52
60
  <OrderPastContent>
53
- {(order.business?.logo || theme.images?.dummies?.businessLogo) && (
61
+ {!hideBusinessLogo && (order.business?.logo || theme.images?.dummies?.businessLogo) && (
54
62
  <>
55
63
  {order?.business?.length > 1 ? (
56
64
  <MultiLogosContainer>
@@ -77,7 +85,9 @@ const SingleOrderCardUI = (props) => {
77
85
  )}
78
86
  <BusinessInformation>
79
87
  <WrapperBusinessTitle>
80
- <h2>{order?.business?.length > 1 ? `${t('GROUP_ORDER', 'Group Order')} ${t('No', 'No')}. ${order?.cart_group_id}` : order.business?.name}</h2>
88
+ {!hideBusinessName && (
89
+ <h2>{order?.business?.length > 1 ? `${t('GROUP_ORDER', 'Group Order')} ${t('No', 'No')}. ${order?.cart_group_id}` : order.business?.name}</h2>
90
+ )}
81
91
  {!order?.business?.length && (
82
92
  <FavoriteWrapper onClick={() => handleChangeFavorite(order)} className='favorite'>
83
93
  {order?.favorite ? <Like /> : <DisLike />}
@@ -85,30 +95,38 @@ const SingleOrderCardUI = (props) => {
85
95
  )}
86
96
  </WrapperBusinessTitle>
87
97
  <OrderInfo>
88
- {order?.id && (
98
+ {!hideOrderNumber && order?.id && (
89
99
  <>
90
100
  <p name='order_number'>{order?.business?.length > 1 ? `${order?.business?.length} ${t('ORDERS', 'orders')}` : `${t('ORDER_NUM', 'Order No.')} ${order.id}`}</p>
91
101
  <BsDot className='dot' />
92
102
  </>
93
103
  )}
94
- <p>{order?.delivery_datetime_utc ? parseDate(order?.delivery_datetime_utc) : parseDate(order?.delivery_datetime, { utc: false })}</p>
104
+ {!hideDate && (
105
+ <p>{order?.delivery_datetime_utc ? parseDate(order?.delivery_datetime_utc) : parseDate(order?.delivery_datetime, { utc: false })}</p>
106
+ )}
95
107
  </OrderInfo>
96
- <p className='status'>{getOrderStatus(order.status)?.value}</p>
108
+ {!hideOrderStatus && (
109
+ <p className='status'>{getOrderStatus(order.status)?.value}</p>
110
+ )}
97
111
  </BusinessInformation>
98
112
  </OrderPastContent>
99
113
  <Reorder>
100
- <Button
101
- outline
102
- disabled={!!order?.review}
103
- color='primary'
104
- className='review'
105
- onClick={() => setOrderSelected(order)}
106
- >
107
- {!!order?.review ? t('REVIEWED', 'Reviewed') : t('REVIEW', 'Review')}
108
- </Button>
109
- <Button color='primary' className='reorder' outline onClick={() => handleReorder(order.id)}>
110
- {orderID === order.id && reorderLoading ? t('LOADING', 'Loading...') : t('REORDER', 'Reorder')}
111
- </Button>
114
+ {!hideReviewOrderButton && (
115
+ <Button
116
+ outline
117
+ disabled={!!order?.review}
118
+ color='primary'
119
+ className='review'
120
+ onClick={() => setOrderSelected(order)}
121
+ >
122
+ {!!order?.review ? t('REVIEWED', 'Reviewed') : t('REVIEW', 'Review')}
123
+ </Button>
124
+ )}
125
+ {!hideReorderButton && typeof order?.id === 'number' && (
126
+ <Button color='primary' className='reorder' outline onClick={() => handleReorder(order.id)}>
127
+ {orderID === order.id && reorderLoading ? t('LOADING', 'Loading...') : t('REORDER', 'Reorder')}
128
+ </Button>
129
+ )}
112
130
  </Reorder>
113
131
  </SingleCard>
114
132
  )
@@ -76,12 +76,21 @@ export const PastLogo = styled.div`
76
76
  object-fit: contain;
77
77
  }
78
78
  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 10px;
79
+ display: none;
80
+
81
+ @media (min-width: 480px) {
82
+ display: block;
83
+ }
79
84
  `
80
85
 
81
86
  export const WrapperBusinessTitle = styled.div`
82
87
  width: 95%;
83
88
  display: flex;
84
89
  gap: 10px;
90
+
91
+ @media (min-width: 480px) {
92
+ width: 80%;
93
+ }
85
94
  `
86
95
 
87
96
  export const Reorder = styled.div`
@@ -101,6 +101,7 @@ export const ThemeProvider = ({ children, ...props }) => {
101
101
  font.rel = 'stylesheet'
102
102
  font.async = true
103
103
  font.defer = true
104
+ font.name = fontFamily.name
104
105
  font.href = `https://fonts.googleapis.com/css2?family=${fontFamily.name}:wght@${fontFamily.weights.join(';')}&display=swap`
105
106
 
106
107
  window.document.body.appendChild(font)
@@ -88,11 +88,11 @@ const AddressListUI = (props) => {
88
88
  address.internal_number === obj.internal_number
89
89
  )))) || []
90
90
 
91
- const showAddress = !orderingTheme?.theme?.profile?.components?.address_list?.components?.address?.hidden
92
- const showIcons = !orderingTheme?.theme?.profile?.components?.address_list?.components?.icons?.hidden
93
- const showZipcode = !orderingTheme?.theme?.profile?.components?.address_list?.components?.zipcode?.hidden
94
- const showInternalNumber = !orderingTheme?.theme?.profile?.components?.address_list?.components?.internal_number?.hidden
95
- const notFoundImage = orderingTheme?.theme?.profile?.components?.address_list?.components?.image
91
+ const showAddress = !theme?.profile?.components?.address_list?.components?.address?.hidden
92
+ const showIcons = !theme?.profile?.components?.address_list?.components?.icons?.hidden
93
+ const showZipcode = !theme?.profile?.components?.address_list?.components?.zipcode?.hidden
94
+ const showInternalNumber = !theme?.profile?.components?.address_list?.components?.internal_number?.hidden
95
+ const notFoundImage = theme?.profile?.components?.address_list?.components?.image
96
96
  const openAddress = (address) => {
97
97
  setCurAddress(address)
98
98
  setAddressOpen(true)
@@ -193,7 +193,7 @@ const AddressListUI = (props) => {
193
193
  const AddressListCallcenterLayout = ({ children }) => {
194
194
  return (
195
195
  <AddressHalfContainer>
196
- <List halfWidth={addressOpen}>
196
+ <List halfWidth={addressOpen} id='address_list'>
197
197
  {children}
198
198
  </List>
199
199
  {addressOpen && (
@@ -36,7 +36,6 @@ import {
36
36
  IconWrapper,
37
37
  BusinessInfoWrapper,
38
38
  WrapperFloatingSearch,
39
- CategorySelectedContainer,
40
39
  SearchWrapper
41
40
  } from './styles'
42
41
  import { BusinessPreorder } from '../BusinessPreorder'
@@ -45,7 +44,6 @@ import dayjs from 'dayjs'
45
44
  import timezone from 'dayjs/plugin/timezone'
46
45
  import isBetween from 'dayjs/plugin/isBetween'
47
46
  import { useWindowSize } from '../../../../../hooks/useWindowSize'
48
- import BsCaretLeftFill from '@meronex/icons/bs/BsCaretLeftFill'
49
47
 
50
48
  dayjs.extend(timezone)
51
49
  dayjs.extend(isBetween)
@@ -65,10 +63,7 @@ export const BusinessBasicInformation = (props) => {
65
63
  handleChangeSortBy,
66
64
  categoryState,
67
65
  errorQuantityProducts,
68
- isCustomerMode,
69
- categoryClicked,
70
- categorySelected,
71
- setCategoryClicked
66
+ isCustomerMode
72
67
  } = props
73
68
  const { business, loading } = businessState
74
69
 
@@ -137,20 +132,32 @@ export const BusinessBasicInformation = (props) => {
137
132
 
138
133
  const handleScroll = () => {
139
134
  const searchElement = document.getElementById('search-component')
140
- if (!searchElement) return
141
- const limit = window.pageYOffset >= searchElement?.offsetTop && window.pageYOffset > 0
142
- if (limit) {
143
- const classAdded = searchElement.classList.contains('fixed-search')
144
- !classAdded && searchElement.classList.add('fixed-search')
145
- } else {
146
- searchElement && searchElement.classList.remove('fixed-search')
135
+ if (searchElement) {
136
+ const limit = window.pageYOffset >= searchElement?.offsetTop && window.pageYOffset > 0
137
+ if (limit) {
138
+ const classAdded = searchElement.classList.contains('fixed-search')
139
+ !classAdded && searchElement.classList.add('fixed-search')
140
+ } else {
141
+ searchElement && searchElement.classList.remove('fixed-search')
142
+ }
143
+ }
144
+
145
+ const businessNameElement = document.getElementById('business_name')
146
+ if (businessNameElement) {
147
+ const limit = window.pageYOffset >= (businessNameElement?.offsetTop - 55) && window.pageYOffset > 0
148
+ if (limit && windowSize.width < 993) {
149
+ const classAdded = businessNameElement.classList.contains('fixed-name')
150
+ !classAdded && businessNameElement.classList.add('fixed-name')
151
+ } else {
152
+ businessNameElement && businessNameElement.classList.remove('fixed-name')
153
+ }
147
154
  }
148
155
  }
149
156
 
150
157
  useEffect(() => {
151
158
  window.addEventListener('scroll', handleScroll)
152
159
  return () => window.removeEventListener('scroll', handleScroll)
153
- }, [])
160
+ }, [windowSize?.width])
154
161
 
155
162
  useEffect(() => {
156
163
  window.scroll({
@@ -161,12 +168,7 @@ export const BusinessBasicInformation = (props) => {
161
168
 
162
169
  const SearchComponent = () => {
163
170
  return (
164
- <WrapperSearch id='search-component' isFlexEnd={windowSize.width >= 768}>
165
- {categorySelected?.name && windowSize.width < 768 && (
166
- <CategorySelectedContainer onClick={() => setCategoryClicked(false)}>
167
- <BsCaretLeftFill /> {categorySelected?.name}
168
- </CategorySelectedContainer>
169
- )}
171
+ <WrapperSearch id='search-component'>
170
172
  <SearchWrapper>
171
173
  <SearchIconWrapper
172
174
  onClick={() => setOpenSearchProducts(true)}
@@ -203,7 +205,7 @@ export const BusinessBasicInformation = (props) => {
203
205
  <BusinessInfoItem isInfoShrunken={isInfoShrunken}>
204
206
  {!loading ? (
205
207
  <TitleWrapper>
206
- <h2 className='bold'>{business?.name}</h2>
208
+ <h2 className='bold' id='business_name'>{business?.name}</h2>
207
209
  {business?.ribbon?.enabled && (
208
210
  <RibbonBox
209
211
  bgColor={business?.ribbon?.color}
@@ -367,7 +369,7 @@ export const BusinessBasicInformation = (props) => {
367
369
  !errorQuantityProducts &&
368
370
  !isInfoShrunken &&
369
371
  !business?.professionals?.length &&
370
- (categoryClicked || windowSize.width >= 993) &&
372
+ // (categoryClicked || windowSize.width >= 993) &&
371
373
  (
372
374
  <SearchComponent />
373
375
  )}
@@ -203,8 +203,9 @@ export const WrapperSearch = styled.div`
203
203
  margin: 15px 0px 0px;
204
204
  display: flex;
205
205
  align-items: center;
206
- justify-content: ${props => props.isFlexEnd ? 'flex-end' : 'space-between'};
206
+ justify-content: flex-end;
207
207
  box-sizing: border-box;
208
+ z-index: 1002;
208
209
 
209
210
  .search-bar {
210
211
  margin-right: 10px;
@@ -241,13 +242,20 @@ export const WrapperSearch = styled.div`
241
242
  &.fixed-search {
242
243
  position: fixed;
243
244
  top: 0;
244
- left: 0;
245
+ right: 0;
245
246
  z-index: 1002;
246
- width: 100vw;
247
+ width: fit-content;
247
248
  margin-top: 0px;
248
249
  background-color: ${props => props.theme.colors.backgroundPage};
249
250
  padding: 10px;
250
251
  }
252
+
253
+ @media (min-width: 993px) {
254
+ &.fixed-search {
255
+ left: 0;
256
+ width: 100vw;
257
+ }
258
+ }
251
259
  `
252
260
 
253
261
  export const BusinessDetail = styled.div`
@@ -356,6 +364,19 @@ export const TitleWrapper = styled.div`
356
364
  overflow: hidden;
357
365
  white-space: nowrap;
358
366
  text-overflow: ellipsis;
367
+ &.fixed-name {
368
+ z-index: 1002;
369
+ position: fixed;
370
+ top: 0;
371
+ width: calc(100vw - 190px);
372
+ padding: 10px 0;
373
+ font-size: 18px;
374
+ ${props => props.theme?.rtl ? css`
375
+ right: 50px;
376
+ ` : css`
377
+ left: 50px;
378
+ `}
379
+ }
359
380
  @media (min-width: 768px) {
360
381
  font-size: 32px;
361
382
  }
@@ -86,6 +86,8 @@ const BusinessControllerUI = (props) => {
86
86
  const hideBusinessReviews = theme?.business_listing_view?.components?.business?.components?.reviews?.hidden
87
87
  const hideBusinessFavorite = theme?.business_listing_view?.components?.business?.components?.favorite?.hidden
88
88
  const hideBusinessOffer = theme?.business_listing_view?.components?.business?.components?.offer?.hidden
89
+ const hideBusinessHeader = theme?.business_listing_view?.components?.business?.components?.header?.hidden
90
+ const hideBusinessFavoriteBadge = theme?.business_listing_view?.components?.business?.components?.featured_badge?.hidden
89
91
 
90
92
  // const handleShowAlert = () => {
91
93
  // setAlertState({ open: true, content: [t('ERROR_ADD_PRODUCT_BUSINESS_CLOSED', 'The Business is closed at the moment')] })
@@ -165,9 +167,9 @@ const BusinessControllerUI = (props) => {
165
167
  {isSkeleton ? (
166
168
  <Skeleton height={isCustomerMode ? 100 : 140} />
167
169
  ) : (
168
- <BusinessHeader bgimage={optimizeImage((businessHeader || business?.header || theme.images?.dummies?.businessHeader), 'h_400,c_limit')} isClosed={!isBusinessOpen}>
170
+ <BusinessHeader bgimage={!hideBusinessHeader ? optimizeImage((businessHeader || business?.header || theme.images?.dummies?.businessHeader), 'h_400,c_limit') : ''} isClosed={!isBusinessOpen}>
169
171
  <BusinessTags>
170
- {(businessFeatured ?? business?.featured) &&
172
+ {(businessFeatured ?? business?.featured) && !hideBusinessFavoriteBadge &&
171
173
  <span className='crown'>
172
174
  <FaCrown />
173
175
  </span>}
@@ -26,6 +26,7 @@ import {
26
26
  } from './styles'
27
27
  import MdClose from '@meronex/icons/md/MdClose'
28
28
  import { ScheduleAccordion } from '../ScheduleAccordion'
29
+ import { useTheme } from 'styled-components'
29
30
 
30
31
  export const BusinessInformationUI = (props) => {
31
32
  const {
@@ -41,10 +42,17 @@ export const BusinessInformationUI = (props) => {
41
42
  const [{ configs }] = useConfig()
42
43
  const [modalImage, setModalImage] = useState(false)
43
44
  const [image, setImage] = useState('')
44
- const [orderingTheme] = useOrderingTheme()
45
+ const theme = useTheme()
45
46
 
46
- const showLocation = !orderingTheme?.theme?.business_view?.components?.information?.components?.location?.hidden
47
- const showSchedule = !orderingTheme?.theme?.business_view?.components?.information?.components?.schedule?.hidden
47
+ const hideLocation = theme?.business_view?.components?.information?.components?.location?.hidden
48
+ const hideSchedule = theme?.business_view?.components?.information?.components?.schedule?.hidden
49
+ const hideDescription = theme?.business_view?.components?.information?.components?.description?.hidden
50
+ const hideAbout = theme?.business_view?.components?.information?.components?.about?.hidden
51
+ const hideVideos = theme?.business_view?.components?.information?.components?.videos?.hidden
52
+ const hideDeliveryTime = theme?.business_view?.components?.information?.components?.delivery_time?.hidden
53
+ const hidePickupTime = theme?.business_view?.components?.information?.components?.pickup_time?.hidden
54
+ const hideImages = theme?.business_view?.components?.information?.components?.images?.hidden
55
+ const hideAddress = theme?.business_view?.components?.information?.components?.address?.hidden
48
56
 
49
57
  const scheduleFormatted = ({ hour, minute }) => {
50
58
  const checkTime = (val) => val < 10 ? `0${val}` : val
@@ -70,20 +78,20 @@ export const BusinessInformationUI = (props) => {
70
78
  </ModalIcon>
71
79
  <BusinessContent>
72
80
  <BusinessTitle>{business?.name}</BusinessTitle>
73
- {business.about && (
81
+ {!hideAbout && business.about && (
74
82
  <>
75
83
  <SectionTitle>{t('BUSINESS_ABOUT', 'Business short description')}</SectionTitle>
76
84
  <Description>{business.about}</Description>
77
85
  </>
78
86
  )}
79
- {business.description && (
87
+ {!hideDescription && business.description && (
80
88
  <>
81
89
  <SectionTitle>{t('BUSINESS_DESCRIPTION', 'Business description')}</SectionTitle>
82
90
  <Description>{business.description}</Description>
83
91
  </>
84
92
  )}
85
93
  {
86
- showLocation && (
94
+ !hideLocation && (
87
95
  <>
88
96
  {businessLocation.location && (
89
97
  <>
@@ -100,7 +108,7 @@ export const BusinessInformationUI = (props) => {
100
108
  </>
101
109
  )}
102
110
  {
103
- business?.address && <BusinessAddress>{business?.address}</BusinessAddress>
111
+ !hideAddress && business?.address && <BusinessAddress>{business?.address}</BusinessAddress>
104
112
  }
105
113
  <Divider />
106
114
  </>
@@ -108,7 +116,7 @@ export const BusinessInformationUI = (props) => {
108
116
  }
109
117
  {businessSchedule?.length > 0 && (
110
118
  <>
111
- {showSchedule && (
119
+ {!hideSchedule && (
112
120
  <>
113
121
  <SectionTitle>{t('OPENING_TIME', 'Opening time')}</SectionTitle>
114
122
  <ScheduleSection>
@@ -128,14 +136,18 @@ export const BusinessInformationUI = (props) => {
128
136
  )}
129
137
  <DeliveryInfo>
130
138
  <div>
131
- <h5>{t('DELIVERY_TIME', 'Delivery Time')}: {convertHoursToMinutes(business?.delivery_time)}</h5>
132
- <h5>{t('PICKUP_TIME', 'Pickup Time')}: {convertHoursToMinutes(business?.pickup_time)}</h5>
139
+ {!hideDeliveryTime && (
140
+ <h5>{t('DELIVERY_TIME', 'Delivery Time')}: {convertHoursToMinutes(business?.delivery_time)}</h5>
141
+ )}
142
+ {!hidePickupTime && (
143
+ <h5>{t('PICKUP_TIME', 'Pickup Time')}: {convertHoursToMinutes(business?.pickup_time)}</h5>
144
+ )}
133
145
  </div>
134
146
  </DeliveryInfo>
135
147
  <Divider />
136
148
  </>
137
149
  )}
138
- {businessVideos?.length > 0 && (
150
+ {!hideVideos && businessVideos?.length > 0 && (
139
151
  <BusinessMediaContent>
140
152
  <SectionTitle>{t('VIDEOS', 'Videos')}</SectionTitle>
141
153
  <div>
@@ -146,7 +158,7 @@ export const BusinessInformationUI = (props) => {
146
158
  </BusinessMediaContent>
147
159
  )}
148
160
  <Divider />
149
- {businessPhotos?.length > 0 && (
161
+ {!hideImages && businessPhotos?.length > 0 && (
150
162
  <BusinessMediaContent>
151
163
  <SectionTitle>{t('IMAGES', 'Images')}</SectionTitle>
152
164
  <div>