@sentecacommerce-theme/lib 0.12.90 → 0.12.94

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 (24) hide show
  1. package/dist/cjs/analytics/Pixel/hooks/usePixelFinishOrder.js +1 -1
  2. package/dist/cjs/analytics/Pixel/hooks/usePixelProductClick.js +3 -7
  3. package/dist/cjs/analytics/Pixel/hooks/usePixelProductsImpression.js +42 -32
  4. package/dist/cjs/analytics/Pixel/hooks/usePixelViewBasket.js +1 -1
  5. package/dist/cjs/analytics/Pixel/hooks/usePixelViewCategory.js +10 -3
  6. package/dist/cjs/navigation/components/SearchBox/Components/EmptyBox/index.js +7 -7
  7. package/dist/cjs/navigation/components/SearchBox/index.js +4 -4
  8. package/dist/cjs/ui/components/GridStyles.js +36 -0
  9. package/dist/cjs/ui/components/index.js +12 -0
  10. package/dist/esm/analytics/Pixel/hooks/usePixelFinishOrder.js +1 -1
  11. package/dist/esm/analytics/Pixel/hooks/usePixelProductClick.js +4 -8
  12. package/dist/esm/analytics/Pixel/hooks/usePixelProductsImpression.js +42 -32
  13. package/dist/esm/analytics/Pixel/hooks/usePixelViewBasket.js +1 -1
  14. package/dist/esm/analytics/Pixel/hooks/usePixelViewCategory.js +10 -3
  15. package/dist/esm/navigation/components/SearchBox/Components/EmptyBox/index.js +7 -7
  16. package/dist/esm/navigation/components/SearchBox/index.js +4 -4
  17. package/dist/esm/ui/components/GridStyles.js +26 -0
  18. package/dist/esm/ui/components/index.js +1 -0
  19. package/dist/types/analytics/Pixel/hooks/usePixelViewCategory.d.ts +5 -1
  20. package/dist/types/navigation/components/SearchBox/Components/EmptyBox/index.d.ts +5 -4
  21. package/dist/types/navigation/components/SearchBox/index.d.ts +7 -6
  22. package/dist/types/ui/components/GridStyles.d.ts +10 -0
  23. package/dist/types/ui/components/index.d.ts +1 -0
  24. package/package.json +4 -4
package/dist/cjs/analytics/Pixel/hooks/usePixelFinishOrder.js CHANGED
@@ -16,7 +16,7 @@ var usePixelFinishOrder = function() {
16
16
  if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined) {
17
17
  var pixel = window.pixel;
18
18
  if (payload) {
19
- pixel.finishOrder(payload);
19
+ pixel === null || pixel === void 0 ? void 0 : pixel.finishOrder(payload);
20
20
  }
21
21
  }
22
22
  };
package/dist/cjs/analytics/Pixel/hooks/usePixelProductClick.js CHANGED
@@ -37,18 +37,14 @@ function _objectSpread(target) {
37
37
  }
38
38
  return target;
39
39
  }
40
- var _typeof = function(obj) {
41
- "@swc/helpers - typeof";
42
- return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
43
- };
44
40
  var usePixelProductClick = function() {
45
41
  var defaultMerchant = (0, _index).useConfigState().defaultMerchant;
46
42
  var sendClickEvent = function(param) {
47
43
  var product = param.product, info = param.info;
48
- if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined) {
44
+ if ((0, _index).canUseDOM() && defaultMerchant) {
49
45
  var pixel = window.pixel;
50
- pixel.productClick(product, _objectSpread({}, info, {
51
- merchantKey: defaultMerchant || ''
46
+ pixel === null || pixel === void 0 ? void 0 : pixel.productClick(product, _objectSpread({}, info, {
47
+ merchantKey: defaultMerchant
52
48
  }));
53
49
  }
54
50
  };
package/dist/cjs/analytics/Pixel/hooks/usePixelProductsImpression.js CHANGED
@@ -6,6 +6,7 @@ var _react = _interopRequireDefault(require("react"));
6
6
  var _router = require("next/router");
7
7
  var _index = require("../../../index");
8
8
  var _releva = require("../../Releva");
9
+ var _utils = require("../../../utils");
9
10
  function _arrayLikeToArray(arr, len) {
10
11
  if (len == null || len > arr.length) len = arr.length;
11
12
  for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
@@ -49,10 +50,6 @@ function _nonIterableRest() {
49
50
  function _slicedToArray(arr, i) {
50
51
  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
51
52
  }
52
- var _typeof = function(obj) {
53
- "@swc/helpers - typeof";
54
- return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
55
- };
56
53
  function _unsupportedIterableToArray(o, minLen) {
57
54
  if (!o) return;
58
55
  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
@@ -63,43 +60,56 @@ function _unsupportedIterableToArray(o, minLen) {
63
60
  }
64
61
  var usePixelProductsImpression = function(param) {
65
62
  var productsData = param.productsData, isCarousel = param.isCarousel;
66
- var ref3 = _slicedToArray((0, _index).useBoolean(false), 2), sentAlready = ref3[0], setSentAlready = ref3[1];
63
+ var ref5;
64
+ var ref1 = _slicedToArray((0, _index).useBoolean(false), 2), sentAlready = ref1[0], setSentAlready = ref1[1];
67
65
  var defaultMerchant = (0, _index).useConfigState().defaultMerchant;
68
66
  var router = (0, _router).useRouter();
69
67
  var products = [];
70
68
  if (!isCarousel) {
71
- products = (0, _releva).createMappedProducts(productsData.products);
69
+ products = (0, _releva).createMappedProducts(productsData === null || productsData === void 0 ? void 0 : productsData.products);
72
70
  }
73
71
  _react.default.useEffect(function() {
74
- if (sentAlready || !products.length) return;
75
- router.events.on('routeChangeComplete', function() {
76
- var ref, ref1;
77
- if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined && !((ref = productsData.products) === null || ref === void 0 ? void 0 : (ref1 = ref[0]) === null || ref1 === void 0 ? void 0 : ref1.isPlaceholder) && (productsData === null || productsData === void 0 ? void 0 : productsData.length) > 0) {
78
- var ref2;
79
- var pixel = window.pixel;
80
- var title = window === null || window === void 0 ? void 0 : (ref2 = window.document) === null || ref2 === void 0 ? void 0 : ref2.title;
81
- var sendImpressions = function() {
82
- if (!title || title === 'за') {
83
- setTimeout(function() {
84
- return sendImpressions();
85
- }, 20);
86
- return;
72
+ setSentAlready.off();
73
+ }, [
74
+ router.asPath,
75
+ productsData === null || productsData === void 0 ? void 0 : (ref5 = productsData.products) === null || ref5 === void 0 ? void 0 : ref5.length,
76
+ setSentAlready
77
+ ]);
78
+ _react.default.useEffect(function() {
79
+ var ref, ref2, ref3;
80
+ if (sentAlready || !(products === null || products === void 0 ? void 0 : products.length)) return;
81
+ if ((0, _utils).canUseDOM() && !((ref = productsData.products) === null || ref === void 0 ? void 0 : (ref2 = ref[0]) === null || ref2 === void 0 ? void 0 : ref2.isPlaceholder) && (productsData === null || productsData === void 0 ? void 0 : (ref3 = productsData.products) === null || ref3 === void 0 ? void 0 : ref3.length) > 0) {
82
+ var ref4;
83
+ var pixel = window.pixel;
84
+ var title = window === null || window === void 0 ? void 0 : (ref4 = window.document) === null || ref4 === void 0 ? void 0 : ref4.title;
85
+ var sendImpressions = function() {
86
+ if (!title || title === 'за') {
87
+ setTimeout(function() {
88
+ return sendImpressions();
89
+ }, 20);
90
+ return;
91
+ }
92
+ pixel === null || pixel === void 0 ? void 0 : pixel.productsImpression(!isCarousel ? [
93
+ {
94
+ listName: title,
95
+ products: products
87
96
  }
88
- pixel === null || pixel === void 0 ? void 0 : pixel.productsImpression(!isCarousel ? [
89
- {
90
- listName: title,
91
- products: products
92
- }
93
- ] : productsData, {
94
- merchantKey: defaultMerchant || ''
95
- });
96
- };
97
- sendImpressions();
97
+ ] : productsData, {
98
+ merchantKey: defaultMerchant || ''
99
+ });
98
100
  setSentAlready.on();
99
- }
100
- });
101
+ };
102
+ sendImpressions();
103
+ }
101
104
  }, [
102
- router.route
105
+ router.route,
106
+ defaultMerchant,
107
+ sentAlready,
108
+ products,
109
+ router.events,
110
+ productsData,
111
+ setSentAlready,
112
+ isCarousel,
103
113
  ]);
104
114
  };
105
115
  exports.usePixelProductsImpression = usePixelProductsImpression;
package/dist/cjs/analytics/Pixel/hooks/usePixelViewBasket.js CHANGED
@@ -13,7 +13,7 @@ var usePixelViewBasket = function() {
13
13
  if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined) {
14
14
  var pixel = window.pixel;
15
15
  if (payload) {
16
- pixel.viewBasket(payload);
16
+ pixel === null || pixel === void 0 ? void 0 : pixel.viewBasket(payload);
17
17
  }
18
18
  }
19
19
  };
package/dist/cjs/analytics/Pixel/hooks/usePixelViewCategory.js CHANGED
@@ -7,11 +7,18 @@ var _typeof = function(obj) {
7
7
  return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
8
8
  };
9
9
  var usePixelViewCategory = function() {
10
- var sendViewCategoryEvent = function(categoryBreadcrumb) {
10
+ var sendViewCategoryEvent = function(breadcrumbData) {
11
+ var breadcrumbString = breadcrumbData.reduce(function(res, curr, index) {
12
+ res += curr.name;
13
+ if (index !== breadcrumbData.length - 1) {
14
+ res += '/';
15
+ }
16
+ return res;
17
+ }, '');
11
18
  if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined) {
12
19
  var pixel = window.pixel;
13
- if (categoryBreadcrumb) {
14
- pixel.viewCategory(categoryBreadcrumb);
20
+ if (breadcrumbString) {
21
+ pixel === null || pixel === void 0 ? void 0 : pixel.viewCategory(breadcrumbString);
15
22
  }
16
23
  }
17
24
  };
package/dist/cjs/navigation/components/SearchBox/Components/EmptyBox/index.js CHANGED
@@ -89,38 +89,38 @@ var EmptyBox = function(param) {
89
89
  textColor: textColor || '',
90
90
  onClose: onClose
91
91
  })), /*#__PURE__*/ _react.default.createElement(SuggestedSearches, null, canDisplayPopular && /*#__PURE__*/ _react.default.createElement(_.PopularSearches, {
92
- title: (labels === null || labels === void 0 ? void 0 : labels.popularSearchesLabel) || '',
92
+ title: (labels === null || labels === void 0 ? void 0 : labels.popularSearches) || '',
93
93
  onClose: onClose,
94
94
  textColor: textColor || '',
95
95
  labelsColor: labelsColor || ''
96
96
  }), withRecent && canDisplayRecent && /*#__PURE__*/ _react.default.createElement(_.RecentSearches, {
97
- title: (labels === null || labels === void 0 ? void 0 : labels.recentSearchesLabel) || '',
97
+ title: (labels === null || labels === void 0 ? void 0 : labels.recentSearches) || '',
98
98
  data: searchHistory,
99
99
  onClose: onClose,
100
100
  textColor: textColor || '',
101
101
  labelsColor: labelsColor || ''
102
102
  }))) : /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement(_.Container, {
103
103
  labelsColor: labelsColor,
104
- title: (labels === null || labels === void 0 ? void 0 : labels.productsLabel) || '',
104
+ title: (labels === null || labels === void 0 ? void 0 : labels.products) || '',
105
105
  onlyMobile: true
106
106
  }, /*#__PURE__*/ _react.default.createElement(NoResultsDesc, {
107
107
  className: "SEARCH_BOX_NO_RESULT"
108
- }, "No results found")), /*#__PURE__*/ _react.default.createElement(PromoCol, {
108
+ }, labels === null || labels === void 0 ? void 0 : labels.noResults)), /*#__PURE__*/ _react.default.createElement(PromoCol, {
109
109
  backgroundColor: backgroundColor
110
110
  }, /*#__PURE__*/ _react.default.createElement(_.Products, {
111
111
  data: promoOffers,
112
112
  textColor: textColor || '',
113
113
  labelsColor: labelsColor || '',
114
114
  onClose: onClose,
115
- title: (labels === null || labels === void 0 ? void 0 : labels.promoOffersLabel) || '',
115
+ title: (labels === null || labels === void 0 ? void 0 : labels.promoOffers) || '',
116
116
  offers: true
117
117
  })), /*#__PURE__*/ _react.default.createElement(_.Container, {
118
118
  labelsColor: labelsColor,
119
- title: (labels === null || labels === void 0 ? void 0 : labels.productsLabel) || '',
119
+ title: (labels === null || labels === void 0 ? void 0 : labels.products) || '',
120
120
  onlyDesktop: true
121
121
  }, /*#__PURE__*/ _react.default.createElement(NoResultsDesc, {
122
122
  className: "SEARCH_BOX_NO_RESULT"
123
- }, "No results found"))))));
123
+ }, labels === null || labels === void 0 ? void 0 : labels.noResults))))));
124
124
  };
125
125
  exports.EmptyBox = EmptyBox;
126
126
  var Wrapper = _styledComponents.default.div.attrs({
package/dist/cjs/navigation/components/SearchBox/index.js CHANGED
@@ -203,14 +203,14 @@ var SearchBox = function(param) {
203
203
  data: displayableBrands,
204
204
  onClose: onClose,
205
205
  searchValue: searchValue || '',
206
- title: (labels === null || labels === void 0 ? void 0 : labels.suggestedBrandsLabel) || '',
206
+ title: (labels === null || labels === void 0 ? void 0 : labels.suggestedBrands) || '',
207
207
  labelsColor: labelsColor || '',
208
208
  textColor: textColor || ''
209
209
  })), suggestedCategories.length > 0 && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement(_components.Suggestions, {
210
210
  data: suggestedCategories,
211
211
  onClose: onClose,
212
212
  searchValue: searchValue || '',
213
- title: (labels === null || labels === void 0 ? void 0 : labels.suggestedCategoriesLabel) || '',
213
+ title: (labels === null || labels === void 0 ? void 0 : labels.suggestedCategories) || '',
214
214
  labelsColor: labelsColor || '',
215
215
  textColor: textColor || ''
216
216
  }))), /*#__PURE__*/ _react.default.createElement(ProductsWrapper, {
@@ -218,7 +218,7 @@ var SearchBox = function(param) {
218
218
  }, /*#__PURE__*/ _react.default.createElement(_components.Products, {
219
219
  data: suggestions,
220
220
  bottomMenu: bottomMenu,
221
- title: labels === null || labels === void 0 ? void 0 : labels.productsLabel,
221
+ title: labels === null || labels === void 0 ? void 0 : labels.products,
222
222
  priceColor: priceColor,
223
223
  labelsColor: labelsColor,
224
224
  textColor: textColor,
@@ -227,7 +227,7 @@ var SearchBox = function(param) {
227
227
  productSpacing: productSpacing
228
228
  }), bottomMenu === BottomMenuEnum.promo && promoOffers && /*#__PURE__*/ _react.default.createElement(_components.Products, {
229
229
  data: promoOffers,
230
- title: labels.promoOffersLabel,
230
+ title: labels.promoOffers,
231
231
  labelsColor: labelsColor,
232
232
  textColor: textColor,
233
233
  onClose: onClose,
package/dist/cjs/ui/components/GridStyles.js ADDED
@@ -0,0 +1,36 @@
1
+ Object.defineProperty(exports, "__esModule", {
2
+ value: true
3
+ });
4
+ exports.GridStyles = void 0;
5
+ var _react = _interopRequireDefault(require("react"));
6
+ function _interopRequireDefault(obj) {
7
+ return obj && obj.__esModule ? obj : {
8
+ default: obj
9
+ };
10
+ }
11
+ var GridStyles = function(param) {
12
+ var spaceX = param.spaceX, breakpoints = param.breakpoints, _remSize = param.remSize, remSize = _remSize === void 0 ? 10 : _remSize;
13
+ function getSize(width) {
14
+ return "min-width: calc(".concat(width, "% - ").concat(spaceX / remSize, "rem);") + "max-width: calc(".concat(width, "% - ").concat(spaceX / remSize, "rem);") + "margin: 0 ".concat(spaceX / 2 / remSize, "rem;");
15
+ }
16
+ var keys = Object.keys(breakpoints || {
17
+ xs: {
18
+ min: null
19
+ }
20
+ });
21
+ var transforms = {
22
+ xs: 'default'
23
+ };
24
+ var queries = keys.reduce(function(str, key, index) {
25
+ var min = ((breakpoints === null || breakpoints === void 0 ? void 0 : breakpoints[key]) || {}).min;
26
+ var k = transforms[key] || key;
27
+ if (index && !min) return str;
28
+ return str += "\n @media(min-width: ".concat(min || '1px', ") {\n .size-").concat(k, "-full-bleed {\n width: 100%;\n }\n\n .size-").concat(k, "-full-bleed .Section--inner {\n width: 100vw;\n position: relative;\n left: 50%;\n right: 50%;\n margin-left: -50vw;\n margin-right: -50vw;\n }\n\n .size-").concat(k, "-100 {\n ").concat(getSize(100), "\n }\n\n .size-").concat(k, "-90 {\n ").concat(getSize(90), "\n }\n\n .size-").concat(k, "-80 {\n ").concat(getSize(80), "\n }\n\n .size-").concat(k, "-75 {\n ").concat(getSize(75), "\n }\n\n .size-").concat(k, "-70 {\n ").concat(getSize(70), "\n }\n \n .size-").concat(k, "-66 {\n ").concat(getSize(66.666666), "\n }\n\n .size-").concat(k, "-60 {\n ").concat(getSize(60), "\n }\n\n .size-").concat(k, "-50 {\n ").concat(getSize(50), "\n }\n\n .size-").concat(k, "-40 {\n ").concat(getSize(40), "\n }\n\n .size-").concat(k, "-33 {\n ").concat(getSize(33.333333), "\n }\n\n .size-").concat(k, "-30 {\n ").concat(getSize(30), "\n }\n\n .size-").concat(k, "-25 {\n ").concat(getSize(25), "\n }\n\n .size-").concat(k, "-20 {\n ").concat(getSize(20), "\n }\n\n .size-").concat(k, "-10 {\n ").concat(getSize(10), "\n }\n }\n");
29
+ }, '');
30
+ return(/*#__PURE__*/ _react.default.createElement("style", {
31
+ dangerouslySetInnerHTML: {
32
+ __html: "\n .Page--row {\n display: flex;\n display: -webkit-flex;\n flex-wrap: wrap;\n -webkit-flex-wrap: wrap;\n margin: 0 -".concat(spaceX / remSize / 2, "rem;\n }\n\n .Page__section {\n padding-bottom: 8rem;\n }\n\n .Page--col {\n display: block;\n width: 100%;\n }\n \n .size-default-inherit {\n width: 100%;\n }\n ").concat(queries, "\n ")
33
+ }
34
+ }));
35
+ };
36
+ exports.GridStyles = GridStyles;
package/dist/cjs/ui/components/index.js CHANGED
@@ -26,6 +26,18 @@ Object.keys(_lazyImage).forEach(function(key) {
26
26
  }
27
27
  });
28
28
  });
29
+ var _gridStyles = _interopRequireWildcard(require("./GridStyles"));
30
+ Object.keys(_gridStyles).forEach(function(key) {
31
+ if (key === "default" || key === "__esModule") return;
32
+ if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
33
+ if (key in exports && exports[key] === _gridStyles[key]) return;
34
+ Object.defineProperty(exports, key, {
35
+ enumerable: true,
36
+ get: function() {
37
+ return _gridStyles[key];
38
+ }
39
+ });
40
+ });
29
41
  function _interopRequireWildcard(obj) {
30
42
  if (obj && obj.__esModule) {
31
43
  return obj;
package/dist/esm/analytics/Pixel/hooks/usePixelFinishOrder.js CHANGED
@@ -12,7 +12,7 @@ export var usePixelFinishOrder = function() {
12
12
  if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined) {
13
13
  var pixel = window.pixel;
14
14
  if (payload) {
15
- pixel.finishOrder(payload);
15
+ pixel === null || pixel === void 0 ? void 0 : pixel.finishOrder(payload);
16
16
  }
17
17
  }
18
18
  };
package/dist/esm/analytics/Pixel/hooks/usePixelProductClick.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { useConfigState } from '../../../index';
2
+ import { useConfigState, canUseDOM } from '../../../index';
3
3
  function _defineProperty(obj, key, value) {
4
4
  if (key in obj) {
5
5
  Object.defineProperty(obj, key, {
@@ -28,18 +28,14 @@ function _objectSpread(target) {
28
28
  }
29
29
  return target;
30
30
  }
31
- var _typeof = function(obj) {
32
- "@swc/helpers - typeof";
33
- return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
34
- };
35
31
  export var usePixelProductClick = function() {
36
32
  var defaultMerchant = useConfigState().defaultMerchant;
37
33
  var sendClickEvent = function(param) {
38
34
  var product = param.product, info = param.info;
39
- if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined) {
35
+ if (canUseDOM() && defaultMerchant) {
40
36
  var pixel = window.pixel;
41
- pixel.productClick(product, _objectSpread({}, info, {
42
- merchantKey: defaultMerchant || ''
37
+ pixel === null || pixel === void 0 ? void 0 : pixel.productClick(product, _objectSpread({}, info, {
38
+ merchantKey: defaultMerchant
43
39
  }));
44
40
  }
45
41
  };
package/dist/esm/analytics/Pixel/hooks/usePixelProductsImpression.js CHANGED
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import { useRouter } from 'next/router';
3
3
  import { useConfigState, useBoolean } from '../../../index';
4
4
  import { createMappedProducts } from '../../Releva';
5
+ import { canUseDOM } from '../../../utils';
5
6
  function _arrayLikeToArray(arr, len) {
6
7
  if (len == null || len > arr.length) len = arr.length;
7
8
  for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
@@ -40,10 +41,6 @@ function _nonIterableRest() {
40
41
  function _slicedToArray(arr, i) {
41
42
  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
42
43
  }
43
- var _typeof = function(obj) {
44
- "@swc/helpers - typeof";
45
- return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
46
- };
47
44
  function _unsupportedIterableToArray(o, minLen) {
48
45
  if (!o) return;
49
46
  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
@@ -54,42 +51,55 @@ function _unsupportedIterableToArray(o, minLen) {
54
51
  }
55
52
  export var usePixelProductsImpression = function(param) {
56
53
  var productsData = param.productsData, isCarousel = param.isCarousel;
57
- var ref3 = _slicedToArray(useBoolean(false), 2), sentAlready = ref3[0], setSentAlready = ref3[1];
54
+ var ref5;
55
+ var ref1 = _slicedToArray(useBoolean(false), 2), sentAlready = ref1[0], setSentAlready = ref1[1];
58
56
  var defaultMerchant = useConfigState().defaultMerchant;
59
57
  var router = useRouter();
60
58
  var products = [];
61
59
  if (!isCarousel) {
62
- products = createMappedProducts(productsData.products);
60
+ products = createMappedProducts(productsData === null || productsData === void 0 ? void 0 : productsData.products);
63
61
  }
64
62
  React.useEffect(function() {
65
- if (sentAlready || !products.length) return;
66
- router.events.on('routeChangeComplete', function() {
67
- var ref, ref1;
68
- if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined && !((ref = productsData.products) === null || ref === void 0 ? void 0 : (ref1 = ref[0]) === null || ref1 === void 0 ? void 0 : ref1.isPlaceholder) && (productsData === null || productsData === void 0 ? void 0 : productsData.length) > 0) {
69
- var ref2;
70
- var pixel = window.pixel;
71
- var title = window === null || window === void 0 ? void 0 : (ref2 = window.document) === null || ref2 === void 0 ? void 0 : ref2.title;
72
- var sendImpressions = function() {
73
- if (!title || title === 'за') {
74
- setTimeout(function() {
75
- return sendImpressions();
76
- }, 20);
77
- return;
63
+ setSentAlready.off();
64
+ }, [
65
+ router.asPath,
66
+ productsData === null || productsData === void 0 ? void 0 : (ref5 = productsData.products) === null || ref5 === void 0 ? void 0 : ref5.length,
67
+ setSentAlready
68
+ ]);
69
+ React.useEffect(function() {
70
+ var ref, ref2, ref3;
71
+ if (sentAlready || !(products === null || products === void 0 ? void 0 : products.length)) return;
72
+ if (canUseDOM() && !((ref = productsData.products) === null || ref === void 0 ? void 0 : (ref2 = ref[0]) === null || ref2 === void 0 ? void 0 : ref2.isPlaceholder) && (productsData === null || productsData === void 0 ? void 0 : (ref3 = productsData.products) === null || ref3 === void 0 ? void 0 : ref3.length) > 0) {
73
+ var ref4;
74
+ var pixel = window.pixel;
75
+ var title = window === null || window === void 0 ? void 0 : (ref4 = window.document) === null || ref4 === void 0 ? void 0 : ref4.title;
76
+ var sendImpressions = function() {
77
+ if (!title || title === 'за') {
78
+ setTimeout(function() {
79
+ return sendImpressions();
80
+ }, 20);
81
+ return;
82
+ }
83
+ pixel === null || pixel === void 0 ? void 0 : pixel.productsImpression(!isCarousel ? [
84
+ {
85
+ listName: title,
86
+ products: products
78
87
  }
79
- pixel === null || pixel === void 0 ? void 0 : pixel.productsImpression(!isCarousel ? [
80
- {
81
- listName: title,
82
- products: products
83
- }
84
- ] : productsData, {
85
- merchantKey: defaultMerchant || ''
86
- });
87
- };
88
- sendImpressions();
88
+ ] : productsData, {
89
+ merchantKey: defaultMerchant || ''
90
+ });
89
91
  setSentAlready.on();
90
- }
91
- });
92
+ };
93
+ sendImpressions();
94
+ }
92
95
  }, [
93
- router.route
96
+ router.route,
97
+ defaultMerchant,
98
+ sentAlready,
99
+ products,
100
+ router.events,
101
+ productsData,
102
+ setSentAlready,
103
+ isCarousel,
94
104
  ]);
95
105
  };
package/dist/esm/analytics/Pixel/hooks/usePixelViewBasket.js CHANGED
@@ -9,7 +9,7 @@ export var usePixelViewBasket = function() {
9
9
  if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined) {
10
10
  var pixel = window.pixel;
11
11
  if (payload) {
12
- pixel.viewBasket(payload);
12
+ pixel === null || pixel === void 0 ? void 0 : pixel.viewBasket(payload);
13
13
  }
14
14
  }
15
15
  };
package/dist/esm/analytics/Pixel/hooks/usePixelViewCategory.js CHANGED
@@ -3,11 +3,18 @@ var _typeof = function(obj) {
3
3
  return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
4
4
  };
5
5
  export var usePixelViewCategory = function() {
6
- var sendViewCategoryEvent = function(categoryBreadcrumb) {
6
+ var sendViewCategoryEvent = function(breadcrumbData) {
7
+ var breadcrumbString = breadcrumbData.reduce(function(res, curr, index) {
8
+ res += curr.name;
9
+ if (index !== breadcrumbData.length - 1) {
10
+ res += '/';
11
+ }
12
+ return res;
13
+ }, '');
7
14
  if ((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined) {
8
15
  var pixel = window.pixel;
9
- if (categoryBreadcrumb) {
10
- pixel.viewCategory(categoryBreadcrumb);
16
+ if (breadcrumbString) {
17
+ pixel === null || pixel === void 0 ? void 0 : pixel.viewCategory(breadcrumbString);
11
18
  }
12
19
  }
13
20
  };
package/dist/esm/navigation/components/SearchBox/Components/EmptyBox/index.js CHANGED
@@ -80,38 +80,38 @@ export var EmptyBox = function(param) {
80
80
  textColor: textColor || '',
81
81
  onClose: onClose
82
82
  })), /*#__PURE__*/ React.createElement(SuggestedSearches, null, canDisplayPopular && /*#__PURE__*/ React.createElement(PopularSearches, {
83
- title: (labels === null || labels === void 0 ? void 0 : labels.popularSearchesLabel) || '',
83
+ title: (labels === null || labels === void 0 ? void 0 : labels.popularSearches) || '',
84
84
  onClose: onClose,
85
85
  textColor: textColor || '',
86
86
  labelsColor: labelsColor || ''
87
87
  }), withRecent && canDisplayRecent && /*#__PURE__*/ React.createElement(RecentSearches, {
88
- title: (labels === null || labels === void 0 ? void 0 : labels.recentSearchesLabel) || '',
88
+ title: (labels === null || labels === void 0 ? void 0 : labels.recentSearches) || '',
89
89
  data: searchHistory,
90
90
  onClose: onClose,
91
91
  textColor: textColor || '',
92
92
  labelsColor: labelsColor || ''
93
93
  }))) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Container, {
94
94
  labelsColor: labelsColor,
95
- title: (labels === null || labels === void 0 ? void 0 : labels.productsLabel) || '',
95
+ title: (labels === null || labels === void 0 ? void 0 : labels.products) || '',
96
96
  onlyMobile: true
97
97
  }, /*#__PURE__*/ React.createElement(NoResultsDesc, {
98
98
  className: "SEARCH_BOX_NO_RESULT"
99
- }, "No results found")), /*#__PURE__*/ React.createElement(PromoCol, {
99
+ }, labels === null || labels === void 0 ? void 0 : labels.noResults)), /*#__PURE__*/ React.createElement(PromoCol, {
100
100
  backgroundColor: backgroundColor
101
101
  }, /*#__PURE__*/ React.createElement(Products, {
102
102
  data: promoOffers,
103
103
  textColor: textColor || '',
104
104
  labelsColor: labelsColor || '',
105
105
  onClose: onClose,
106
- title: (labels === null || labels === void 0 ? void 0 : labels.promoOffersLabel) || '',
106
+ title: (labels === null || labels === void 0 ? void 0 : labels.promoOffers) || '',
107
107
  offers: true
108
108
  })), /*#__PURE__*/ React.createElement(Container, {
109
109
  labelsColor: labelsColor,
110
- title: (labels === null || labels === void 0 ? void 0 : labels.productsLabel) || '',
110
+ title: (labels === null || labels === void 0 ? void 0 : labels.products) || '',
111
111
  onlyDesktop: true
112
112
  }, /*#__PURE__*/ React.createElement(NoResultsDesc, {
113
113
  className: "SEARCH_BOX_NO_RESULT"
114
- }, "No results found"))))));
114
+ }, labels === null || labels === void 0 ? void 0 : labels.noResults))))));
115
115
  };
116
116
  var Wrapper = styled.div.attrs({
117
117
  className: 'd-flex flex-column flex-lg-row mx-lg-auto '
package/dist/esm/navigation/components/SearchBox/index.js CHANGED
@@ -173,14 +173,14 @@ export var SearchBox = function(param) {
173
173
  data: displayableBrands,
174
174
  onClose: onClose,
175
175
  searchValue: searchValue || '',
176
- title: (labels === null || labels === void 0 ? void 0 : labels.suggestedBrandsLabel) || '',
176
+ title: (labels === null || labels === void 0 ? void 0 : labels.suggestedBrands) || '',
177
177
  labelsColor: labelsColor || '',
178
178
  textColor: textColor || ''
179
179
  })), suggestedCategories.length > 0 && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Suggestions, {
180
180
  data: suggestedCategories,
181
181
  onClose: onClose,
182
182
  searchValue: searchValue || '',
183
- title: (labels === null || labels === void 0 ? void 0 : labels.suggestedCategoriesLabel) || '',
183
+ title: (labels === null || labels === void 0 ? void 0 : labels.suggestedCategories) || '',
184
184
  labelsColor: labelsColor || '',
185
185
  textColor: textColor || ''
186
186
  }))), /*#__PURE__*/ React.createElement(ProductsWrapper, {
@@ -188,7 +188,7 @@ export var SearchBox = function(param) {
188
188
  }, /*#__PURE__*/ React.createElement(Products, {
189
189
  data: suggestions,
190
190
  bottomMenu: bottomMenu,
191
- title: labels === null || labels === void 0 ? void 0 : labels.productsLabel,
191
+ title: labels === null || labels === void 0 ? void 0 : labels.products,
192
192
  priceColor: priceColor,
193
193
  labelsColor: labelsColor,
194
194
  textColor: textColor,
@@ -197,7 +197,7 @@ export var SearchBox = function(param) {
197
197
  productSpacing: productSpacing
198
198
  }), bottomMenu === BottomMenuEnum.promo && promoOffers && /*#__PURE__*/ React.createElement(Products, {
199
199
  data: promoOffers,
200
- title: labels.promoOffersLabel,
200
+ title: labels.promoOffers,
201
201
  labelsColor: labelsColor,
202
202
  textColor: textColor,
203
203
  onClose: onClose,
package/dist/esm/ui/components/GridStyles.js ADDED
@@ -0,0 +1,26 @@
1
+ import React from 'react';
2
+ export var GridStyles = function(param) {
3
+ var spaceX = param.spaceX, breakpoints = param.breakpoints, _remSize = param.remSize, remSize = _remSize === void 0 ? 10 : _remSize;
4
+ var getSize = function getSize(width) {
5
+ return "min-width: calc(".concat(width, "% - ").concat(spaceX / remSize, "rem);") + "max-width: calc(".concat(width, "% - ").concat(spaceX / remSize, "rem);") + "margin: 0 ".concat(spaceX / 2 / remSize, "rem;");
6
+ };
7
+ var keys = Object.keys(breakpoints || {
8
+ xs: {
9
+ min: null
10
+ }
11
+ });
12
+ var transforms = {
13
+ xs: 'default'
14
+ };
15
+ var queries = keys.reduce(function(str, key, index) {
16
+ var min = ((breakpoints === null || breakpoints === void 0 ? void 0 : breakpoints[key]) || {}).min;
17
+ var k = transforms[key] || key;
18
+ if (index && !min) return str;
19
+ return str += "\n @media(min-width: ".concat(min || '1px', ") {\n .size-").concat(k, "-full-bleed {\n width: 100%;\n }\n\n .size-").concat(k, "-full-bleed .Section--inner {\n width: 100vw;\n position: relative;\n left: 50%;\n right: 50%;\n margin-left: -50vw;\n margin-right: -50vw;\n }\n\n .size-").concat(k, "-100 {\n ").concat(getSize(100), "\n }\n\n .size-").concat(k, "-90 {\n ").concat(getSize(90), "\n }\n\n .size-").concat(k, "-80 {\n ").concat(getSize(80), "\n }\n\n .size-").concat(k, "-75 {\n ").concat(getSize(75), "\n }\n\n .size-").concat(k, "-70 {\n ").concat(getSize(70), "\n }\n \n .size-").concat(k, "-66 {\n ").concat(getSize(66.666666), "\n }\n\n .size-").concat(k, "-60 {\n ").concat(getSize(60), "\n }\n\n .size-").concat(k, "-50 {\n ").concat(getSize(50), "\n }\n\n .size-").concat(k, "-40 {\n ").concat(getSize(40), "\n }\n\n .size-").concat(k, "-33 {\n ").concat(getSize(33.333333), "\n }\n\n .size-").concat(k, "-30 {\n ").concat(getSize(30), "\n }\n\n .size-").concat(k, "-25 {\n ").concat(getSize(25), "\n }\n\n .size-").concat(k, "-20 {\n ").concat(getSize(20), "\n }\n\n .size-").concat(k, "-10 {\n ").concat(getSize(10), "\n }\n }\n");
20
+ }, '');
21
+ return(/*#__PURE__*/ React.createElement("style", {
22
+ dangerouslySetInnerHTML: {
23
+ __html: "\n .Page--row {\n display: flex;\n display: -webkit-flex;\n flex-wrap: wrap;\n -webkit-flex-wrap: wrap;\n margin: 0 -".concat(spaceX / remSize / 2, "rem;\n }\n\n .Page__section {\n padding-bottom: 8rem;\n }\n\n .Page--col {\n display: block;\n width: 100%;\n }\n \n .size-default-inherit {\n width: 100%;\n }\n ").concat(queries, "\n ")
24
+ }
25
+ }));
26
+ };
package/dist/esm/ui/components/index.js CHANGED
@@ -1,2 +1,3 @@
1
1
  export * from './RangeSliderInput';
2
2
  export * from './LazyImage';
3
+ export * from './GridStyles';
package/dist/types/analytics/Pixel/hooks/usePixelViewCategory.d.ts CHANGED
@@ -1,3 +1,7 @@
1
1
  export declare const usePixelViewCategory: () => {
2
- sendViewCategoryEvent: (categoryBreadcrumb: string) => void;
2
+ sendViewCategoryEvent: (breadcrumbData: {
3
+ name: string;
4
+ id: string;
5
+ link: string;
6
+ }[]) => void;
3
7
  };
package/dist/types/navigation/components/SearchBox/Components/EmptyBox/index.d.ts CHANGED
@@ -3,11 +3,12 @@ interface EmptyBoxProps {
3
3
  backgroundColor?: StringField;
4
4
  searchHistory?: any[];
5
5
  labels: GroupField<{
6
- promoOffersLabel: StringField;
7
- productsLabel: StringField;
8
- recentSearchesLabel: StringField;
9
- popularSearchesLabel: StringField;
6
+ promoOffers: StringField;
7
+ products: StringField;
8
+ recentSearches: StringField;
9
+ popularSearches: StringField;
10
10
  blogLabel: StringField;
11
+ noResults: StringField;
11
12
  blog: GroupField<{
12
13
  blogTitle: StringField;
13
14
  image: StringField;
package/dist/types/navigation/components/SearchBox/index.d.ts CHANGED
@@ -1,12 +1,13 @@
1
1
  import { StringField, GroupField, BooleanField, NumberField } from '@sentecacommerce-theme/cms';
2
2
  interface SearchLabels {
3
- recentSearchesLabel: StringField;
4
- popularSearchesLabel: StringField;
5
- suggestedBrandsLabel: StringField;
6
- suggestedCategoriesLabel: StringField;
7
- promoOffersLabel: StringField;
8
- productsLabel: StringField;
3
+ recentSearches: StringField;
4
+ popularSearches: StringField;
5
+ suggestedBrands: StringField;
6
+ suggestedCategories: StringField;
7
+ promoOffers: StringField;
8
+ products: StringField;
9
9
  blogLabel: StringField;
10
+ noResults: StringField;
10
11
  blog: GroupField<{
11
12
  blogTitle: StringField;
12
13
  image: StringField;
package/dist/types/ui/components/GridStyles.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ import { StringField } from '@sentecacommerce-theme/cms';
2
+ export declare const GridStyles: ({ spaceX, breakpoints, remSize, }: {
3
+ breakpoints?: {
4
+ [key: string]: {
5
+ min: StringField;
6
+ };
7
+ } | undefined;
8
+ spaceX: number;
9
+ remSize?: number | undefined;
10
+ }) => JSX.Element;
package/dist/types/ui/components/index.d.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export * from './RangeSliderInput';
2
2
  export * from './LazyImage';
3
+ export * from './GridStyles';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@sentecacommerce-theme/lib",
3
3
  "sideEffects": false,
4
- "version": "0.12.90",
4
+ "version": "0.12.94",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",
7
7
  "types": "dist/types/index.d.ts",
@@ -31,13 +31,13 @@
31
31
  "watch:cjs": "swc src --out-dir dist/cjs -w",
32
32
  "watch:esm": "swc src --out-dir dist/esm --no-swcrc -w"
33
33
  },
34
- "gitHead": "d28453063c2d598346b5663c6fa3530c2ce8bd62",
34
+ "gitHead": "48c1b5df2b10751ae514f0b53e1c6810bd72471c",
35
35
  "peerDependencies": {
36
36
  "react-query": "^2.26.2"
37
37
  },
38
38
  "dependencies": {
39
- "@sentecacommerce-theme/base": "^0.12.90",
40
- "@sentecacommerce-theme/cms": "^0.12.90",
39
+ "@sentecacommerce-theme/base": "^0.12.94",
40
+ "@sentecacommerce-theme/cms": "^0.12.94",
41
41
  "@sentecacommerce/sdk": "2.0.161",
42
42
  "body-scroll-lock": "^3.1.5",
43
43
  "copy-to-clipboard": "^3.3.1",