@sentecacommerce-theme/lib 0.12.103 → 0.13.4

package/dist/cjs/listing/utils/buildCategoryQuery.js

@@ -64,7 +64,7 @@ var buildCategoryQuery = function(param) {
                     filter += (ref = config === null || config === void 0 ? void 0 : config.filterExtension) !== null && ref !== void 0 ? ref : '';
                 }
                 if (postFilter) {
-                    if (router.query.cat) filter += '&';
+                    if (filter) filter += '&';
                     filter += postFilter;
                 }
                 break;
@@ -81,6 +81,14 @@ var buildCategoryQuery = function(param) {
                 filter += "text;eq;\"".concat(searchQuery, "\"");
                 if (postFilter) filter += "&".concat(postFilter);
                 break;
+            case _index.ListingTypesEnum.View:
+                filter += applyViewsPostFilter({
+                    postFilter: postFilter
+                });
+                if (config === null || config === void 0 ? void 0 : config.filterExtension) {
+                    filter += filter ? "&".concat(config === null || config === void 0 ? void 0 : config.filterExtension) : config === null || config === void 0 ? void 0 : config.filterExtension;
+                }
+                break;
             default:
                 return "".concat((config === null || config === void 0 ? void 0 : config.filterExtension) + "".concat(postFilter !== null && postFilter !== void 0 ? postFilter : ''));
         }
@@ -113,3 +121,16 @@ var applyBrandsPostFilter = function(param) {
     }
     return '';
 };
+var applyViewsPostFilter = function(param) {
+    var postFilter = param.postFilter;
+    if (postFilter) {
+        var filtersArr = postFilter.split('&');
+        var filters = filtersArr.reduce(function(res, val, i) {
+            if (val.includes('category')) return res;
+            if (!res) return res + "".concat(val);
+            return res += "&".concat(val);
+        }, '');
+        return "".concat(filters);
+    }
+    return '';
+};

package/dist/cjs/seo/components/TranslationsMeta/index.js

@@ -31,6 +31,7 @@ var TranslationsMeta = function() {
     var defaultTranslation = translationsMap[defaultLocale];
     var isError = router.route === '/404' || router.route === '/_error';
     if (isError) return null;
+    if ((allLocales === null || allLocales === void 0 ? void 0 : allLocales.length) < 2) return null;
     var domain = defaultTranslation === null || defaultTranslation === void 0 ? void 0 : defaultTranslation.domain;
     return(/*#__PURE__*/ _react.default.createElement(_head.default, null, allLocales === null || allLocales === void 0 ? void 0 : allLocales.map(function(locale) {
         var translation = translationsMap === null || translationsMap === void 0 ? void 0 : translationsMap[locale];

package/dist/cjs/utils/localStorage.js

@@ -4,12 +4,17 @@ Object.defineProperty(exports, "__esModule", {
 exports.writeToLocalStorage = exports.readFromLocalStorage = void 0;
 var readFromLocalStorage = function(key) {
     if (typeof window !== 'undefined') {
-        return JSON.parse(localStorage.getItem(key));
+        try {
+            return JSON.parse(localStorage.getItem(key));
+        } catch (e) {
+            console.log(e);
+            return null;
+        }
     }
 };
 exports.readFromLocalStorage = readFromLocalStorage;
 var writeToLocalStorage = function(key, data) {
-    if (typeof window !== 'undefined') {
+    if (typeof window !== 'undefined' && data !== undefined) {
         localStorage.setItem(key, JSON.stringify(data));
     }
 };

package/dist/esm/api/myCartApi/index.js

@@ -250,7 +250,9 @@ export var MyCartApiFactory = function() {
                         var product = data.lineItems.find(function(p) {
                             return p.productId === params.productId;
                         });
-                        product && addToCart(product.variant.sku, params.quantity, product.offer.price || product.offer.originalPrice);
+                        if (hasAnalytics) {
+                            product && addToCart(product.variant.sku, params.quantity, product.offer.price || product.offer.originalPrice);
+                        }
                         queryCache.setQueryData([
                             myCartCacheKeys.useIsExisting,
                             params.productId,
@@ -543,6 +545,7 @@ export var MyCartApiFactory = function() {
         });
     };
     var instance;
+    var hasAnalytics = !process.env.NO_ANALYTICS;
     return {
         getInstance: function getInstance() {
             if (!instance) {

package/dist/esm/components/AnalyticsScripts/index.js

@@ -50,6 +50,7 @@ function _unsupportedIterableToArray(o, minLen) {
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
 }
 var isProduction = process.env.NODE_ENV === 'production';
+var hasAnalytics = !process.env.NO_ANALYTICS;
 export function AnalyticsScripts() {
     var ref11, ref1, ref2, ref3, ref4;
     var timeout = useRef(null);
@@ -87,7 +88,7 @@ export function AnalyticsScripts() {
         }
     };
     useEffect(function() {
-        if (!isProduction) return;
+        if (!isProduction && !hasAnalytics) return;
         if (document) {
             timeout.current = setTimeout(initAnalytics, 3500);
             document.addEventListener('scroll', initAnalyticsOnEvent);
@@ -99,7 +100,7 @@ export function AnalyticsScripts() {
     ]);
     var pageView = getPageView(config);
     useEffect(function() {
-        if (!isProduction) return;
+        if (!isProduction && !hasAnalytics) return;
         var handleRouteChange = function(url) {
             if ('browser' in process) {
                 setTimeout(function() {

package/dist/esm/hooks/useCheckoutSubmit/index.js

@@ -82,6 +82,7 @@ export var useCheckoutSubmit = function(param) {
     var onSuccess = param.onSuccess, onBeforeBoricaRedirect = param.onBeforeBoricaRedirect, onBeforePaypalRedirect = param.onBeforePaypalRedirect, onBeforeUniCreditRedirect = param.onBeforeUniCreditRedirect, onError = param.onError, withMeta = param.withMeta, disablePaymentRedirects = param.disablePaymentRedirects;
     var Config = useConfigState();
     var districtMeta = useDistrictMeta();
+    var hasAnalytics = !process.env.NO_ANALYTICS;
     var ref = _slicedToArray(myOrdersApi.useCreate(withMeta ? districtMeta : {}, function() {
         var _ref = _asyncToGenerator(regeneratorRuntime.mark(function _callee(result) {
             var paypalPayment, boricaPayment, uniCreditPayment, boricaResult, paypalResponse, uniCreditStartSessionResponse;
@@ -89,7 +90,9 @@ export var useCheckoutSubmit = function(param) {
                 while(1)switch(_ctx.prev = _ctx.next){
                     case 0:
                         // Analytics
-                        purchase(result, Config);
+                        if (hasAnalytics) {
+                            purchase(result, Config);
+                        }
                         paypalPayment = result.payments.find(function(payment) {
                             return payment.type === PaymentDTOTypeEnum.PaymentServiceProvider && payment.moduleKey === 'Paypal';
                         });

package/dist/esm/hooks/useLineItem/LineItemContext.js

@@ -0,0 +1,75 @@
+import React from 'react';
+import { useProductVariants } from '../useProductVariants';
+import { getTranslatableField } from '../..';
+function _defineProperty(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _objectSpread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
+}
+var LineItemStateContext = /*#__PURE__*/ React.createContext(undefined);
+var CountDispatchContext = /*#__PURE__*/ React.createContext(undefined);
+export function LineItemStateProvider(param) {
+    var product = param.product, children = param.children;
+    var ref = useProductVariants({
+        product: product,
+        defaultVariantId: product.variantId,
+        isLineItem: true
+    }), variants = ref.variants, selectedVariant = ref.selectedVariant, getVariantById = ref.getVariantById, getVariantByAttribute = ref.getVariantByAttribute, getVariantByCombination = ref.getVariantByCombination, selectVariantById = ref.selectVariantById, selectVariantByAttribute = ref.selectVariantByAttribute, selectVariantByCombination = ref.selectVariantByCombination;
+    var state = {
+        variants: variants,
+        selectedVariant: _objectSpread({}, selectedVariant, {
+            name: getTranslatableField(selectedVariant === null || selectedVariant === void 0 ? void 0 : selectedVariant.name),
+            slug: getTranslatableField(selectedVariant === null || selectedVariant === void 0 ? void 0 : selectedVariant.slug)
+        })
+    };
+    var functions = {
+        getVariantById: getVariantById,
+        getVariantByAttribute: getVariantByAttribute,
+        getVariantByCombination: getVariantByCombination,
+        selectVariantById: selectVariantById,
+        selectVariantByAttribute: selectVariantByAttribute,
+        selectVariantByCombination: selectVariantByCombination
+    };
+    return(/*#__PURE__*/ React.createElement(LineItemStateContext.Provider, {
+        value: state
+    }, /*#__PURE__*/ React.createElement(CountDispatchContext.Provider, {
+        value: functions
+    }, children)));
+}
+export function useLineItemState() {
+    var context = React.useContext(LineItemStateContext);
+    if (context === undefined) {
+        throw new Error('useLineItemState must be used within a LineItemStateProvider');
+    }
+    return context;
+}
+export function useLineItemFunctions() {
+    var context = React.useContext(CountDispatchContext);
+    if (context === undefined) {
+        throw new Error('useLineItemFunctions must be used within a LineItemStateProvider');
+    }
+    return context;
+}

package/dist/esm/hooks/useLineItem/index.js

@@ -29,11 +29,12 @@ function _objectSpread(target) {
     }
     return target;
 }
+export { useLineItemFunctions, useLineItemState, LineItemStateProvider } from './LineItemContext';
 export var useLineItem = function(props) {
-    var ref16 = usePrefetchProduct(getTranslatableField(props === null || props === void 0 ? void 0 : props.slug)), onMouseEnter = ref16.onMouseEnter, onMouseLeave = ref16.onMouseLeave, onMouseDown = ref16.onMouseDown;
+    var ref17 = usePrefetchProduct(getTranslatableField(props === null || props === void 0 ? void 0 : props.slug)), onMouseEnter = ref17.onMouseEnter, onMouseLeave = ref17.onMouseLeave, onMouseDown = ref17.onMouseDown;
     var data = React.useMemo(function() {
-        var ref17, ref1, ref2, ref3, ref4, ref5, ref6, ref7, ref8, ref9, ref10, ref11, ref12;
-        var mappedAttributes = (ref17 = Object.keys(props === null || props === void 0 ? void 0 : props.attributes)) === null || ref17 === void 0 ? void 0 : ref17.reduce(function(map, key) {
+        var ref18, ref1, ref2, ref3, ref4, ref5, ref6, ref7, ref8, ref9, ref10, ref11, ref12, ref13;
+        var mappedAttributes = (ref18 = Object.keys(props === null || props === void 0 ? void 0 : props.attributes)) === null || ref18 === void 0 ? void 0 : ref18.reduce(function(map, key) {
             var current = props === null || props === void 0 ? void 0 : props.attributes[key];
             var ref;
             map[key] = {
@@ -54,7 +55,7 @@ export var useLineItem = function(props) {
             }
             return map;
         }, {});
-        var ref13, ref14, ref15;
+        var ref14, ref15, ref16;
         return {
             _id: props === null || props === void 0 ? void 0 : props._id,
             name: getTranslatableField(props === null || props === void 0 ? void 0 : props.name),
@@ -62,18 +63,21 @@ export var useLineItem = function(props) {
                 name: getTranslatableField(props === null || props === void 0 ? void 0 : (ref2 = props.brands) === null || ref2 === void 0 ? void 0 : (ref3 = ref2[0]) === null || ref3 === void 0 ? void 0 : ref3.name),
                 slug: getTranslatableField(props === null || props === void 0 ? void 0 : (ref4 = props.brands) === null || ref4 === void 0 ? void 0 : (ref5 = ref4[0]) === null || ref5 === void 0 ? void 0 : ref5.slug)
             },
+            attributes: props === null || props === void 0 ? void 0 : props.attributes,
+            variantAttributes: (ref6 = props) === null || ref6 === void 0 ? void 0 : ref6.variantAttributes,
+            variants: props === null || props === void 0 ? void 0 : props.variants,
             slug: getTranslatableField(props === null || props === void 0 ? void 0 : props.slug),
             collapseKey: props === null || props === void 0 ? void 0 : props.collapseKey,
             variantId: props === null || props === void 0 ? void 0 : props.variantId,
-            offerId: props === null || props === void 0 ? void 0 : (ref6 = props.offer) === null || ref6 === void 0 ? void 0 : ref6._id,
+            offerId: props === null || props === void 0 ? void 0 : (ref7 = props.offer) === null || ref7 === void 0 ? void 0 : ref7._id,
             offer: props === null || props === void 0 ? void 0 : props.offer,
             sku: props === null || props === void 0 ? void 0 : props.sku,
             images: (props === null || props === void 0 ? void 0 : props.images) || {},
             ratings: props === null || props === void 0 ? void 0 : props.reviewRatingStatistics,
-            price: props === null || props === void 0 ? void 0 : (ref7 = props.offer) === null || ref7 === void 0 ? void 0 : ref7.originalPrice,
-            discountedPrice: props === null || props === void 0 ? void 0 : (ref8 = props.offer) === null || ref8 === void 0 ? void 0 : ref8.discountedPrice,
-            variantOptions: (ref13 = props === null || props === void 0 ? void 0 : props.variantOptions) !== null && ref13 !== void 0 ? ref13 : 0,
-            variantsCount: (ref14 = props === null || props === void 0 ? void 0 : props.variantsCount) !== null && ref14 !== void 0 ? ref14 : 0,
+            price: props === null || props === void 0 ? void 0 : (ref8 = props.offer) === null || ref8 === void 0 ? void 0 : ref8.originalPrice,
+            discountedPrice: props === null || props === void 0 ? void 0 : (ref9 = props.offer) === null || ref9 === void 0 ? void 0 : ref9.discountedPrice,
+            variantOptions: (ref14 = props === null || props === void 0 ? void 0 : props.variantOptions) !== null && ref14 !== void 0 ? ref14 : 0,
+            variantsCount: (ref15 = props === null || props === void 0 ? void 0 : props.variantsCount) !== null && ref15 !== void 0 ? ref15 : 0,
             categories: props === null || props === void 0 ? void 0 : props.categories.map(function(category) {
                 return {
                     name: getTranslatableField(category.name),
@@ -81,9 +85,9 @@ export var useLineItem = function(props) {
                 };
             }),
             inventory: {
-                hasAvailableQuantity: (props === null || props === void 0 ? void 0 : (ref9 = props.inventorySnapshot) === null || ref9 === void 0 ? void 0 : ref9.canOrder) ? true : false,
-                availableQuantity: (props === null || props === void 0 ? void 0 : (ref10 = props.inventorySnapshot) === null || ref10 === void 0 ? void 0 : ref10.canOrder) ? (ref15 = props === null || props === void 0 ? void 0 : (ref11 = props.inventorySnapshot) === null || ref11 === void 0 ? void 0 : ref11.availableQuantity) !== null && ref15 !== void 0 ? ref15 : 0 : 0,
-                maxQuantity: props === null || props === void 0 ? void 0 : (ref12 = props.offer) === null || ref12 === void 0 ? void 0 : ref12.maxQuantity
+                hasAvailableQuantity: (props === null || props === void 0 ? void 0 : (ref10 = props.inventorySnapshot) === null || ref10 === void 0 ? void 0 : ref10.canOrder) ? true : false,
+                availableQuantity: (props === null || props === void 0 ? void 0 : (ref11 = props.inventorySnapshot) === null || ref11 === void 0 ? void 0 : ref11.canOrder) ? (ref16 = props === null || props === void 0 ? void 0 : (ref12 = props.inventorySnapshot) === null || ref12 === void 0 ? void 0 : ref12.availableQuantity) !== null && ref16 !== void 0 ? ref16 : 0 : 0,
+                maxQuantity: props === null || props === void 0 ? void 0 : (ref13 = props.offer) === null || ref13 === void 0 ? void 0 : ref13.maxQuantity
             },
             labels: mapLabelData(props === null || props === void 0 ? void 0 : props.labels),
             getCustomFieldByKey: function(key) {

package/dist/esm/hooks/useProduct/index.js

@@ -1,281 +1,46 @@
 import React from 'react';
 import { getTranslatableField } from '../../';
-import { assignCombinationsToAttributeRules, createCombinationsMap, createCustomFieldsMap, createProductContent, createAttributeRulesMap, createMappedAttributes, processAvailabilityPerStore, getProductVideos, createMappedOptions, createSelectedOption2, formatCategories, createLabelsMap, createCollapseKeyImagesMap } from './utils';
+import { createProductContent, getProductVideos, formatCategories, createCollapseKeyImagesMap } from './utils';
 import { productsApi } from '../../api/productsApi';
 import { assetsFieldsToMap } from '../../utils/assetsToMap';
-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 _arrayWithHoles(arr) {
-    if (Array.isArray(arr)) return arr;
-}
-function _arrayWithoutHoles(arr) {
-    if (Array.isArray(arr)) return _arrayLikeToArray(arr);
-}
-function _defineProperty(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _iterableToArray(iter) {
-    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
-}
-function _iterableToArrayLimit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-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 _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 _objectSpread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _defineProperty(target, key, source[key]);
-        });
-    }
-    return target;
-}
-function _slicedToArray(arr, i) {
-    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
-}
-function _toConsumableArray(arr) {
-    return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
-}
-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(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-}
+import { useProductVariants } from '../useProductVariants';
 var ProductStateContext = /*#__PURE__*/ React.createContext(undefined);
 var CountDispatchContext = /*#__PURE__*/ React.createContext(undefined);
 export function ProductProvider(param) {
     var product = param.product, children = param.children, defaultVariantId = param.defaultVariantId, _includeBrandInName = param.includeBrandInName, includeBrandInName = _includeBrandInName === void 0 ? false : _includeBrandInName;
-    var getVariantsWithInventory = function getVariantsWithInventory() {
-        var ref9;
-        var variantsWithInventory = product === null || product === void 0 ? void 0 : (ref9 = product.variants) === null || ref9 === void 0 ? void 0 : ref9.reduce(function(map, _, index, arr) {
-            var ref10, ref6, ref7, ref8;
-            var currentVariant = arr[index];
-            var mappedAttributes = createMappedAttributes(currentVariant);
-            var mappedOptions = createMappedOptions(currentVariant === null || currentVariant === void 0 ? void 0 : currentVariant.availableOptions) || [];
-            var isAvailable = currentVariant === null || currentVariant === void 0 ? void 0 : (ref10 = currentVariant.inventorySnapshot) === null || ref10 === void 0 ? void 0 : ref10.canOrder;
-            var updatedVariant = _objectSpread({}, currentVariant, {
-                inventory: {
-                    hasAvailableQuantity: (ref6 = currentVariant.inventorySnapshot) === null || ref6 === void 0 ? void 0 : ref6.canOrder,
-                    availableQuantity: (ref7 = currentVariant.inventorySnapshot) === null || ref7 === void 0 ? void 0 : ref7.availableQuantity
-                },
-                isAvailable: isAvailable ? true : false,
-                quantity: isAvailable ? currentVariant === null || currentVariant === void 0 ? void 0 : (ref8 = currentVariant.inventorySnapshot) === null || ref8 === void 0 ? void 0 : ref8.availableQuantity : 0,
-                attributes: mappedAttributes,
-                options: mappedOptions,
-                selectedOptions: [],
-                labels: createLabelsMap(currentVariant.labels),
-                getAttribute: function(rule) {
-                    return getSelectedAttribute(rule, mappedAttributes);
-                },
-                getAttributeByKey: function(key) {
-                    var ref;
-                    return (ref = mappedAttributes.find(function(a) {
-                        return a.name === key;
-                    })) === null || ref === void 0 ? void 0 : ref.value;
-                },
-                getAvailabilityByStore: function() {
-                    var ref;
-                    return processAvailabilityPerStore(currentVariant === null || currentVariant === void 0 ? void 0 : (ref = currentVariant.inventorySnapshot) === null || ref === void 0 ? void 0 : ref.availabilities);
-                }
-            });
-            map[currentVariant._id] = updatedVariant;
-            return map;
-        }, {});
-        return variantsWithInventory || {};
-    };
-    var getCombinationsAndAttributeRules = function getCombinationsAndAttributeRules() {
-        var mappedAttributeRules = createAttributeRulesMap(product);
-        var attributesWithId = Object.keys(variants || {}).map(function(key) {
-            return {
-                variantId: variants === null || variants === void 0 ? void 0 : variants[key]._id,
-                attributes: variants === null || variants === void 0 ? void 0 : variants[key].attributes
-            };
-        });
-        var combinationsMap = createCombinationsMap(Object.keys(mappedAttributeRules), attributesWithId);
-        assignCombinationsToAttributeRules(mappedAttributeRules, combinationsMap);
-        return {
-            combinations: combinationsMap,
-            attributeRules: mappedAttributeRules
-        };
-    };
-    var getDefaultVariant = function getDefaultVariant() {
-        if (!defaultVariantId) return null;
-        return variants[defaultVariantId];
-    };
-    var selectVariantById = function selectVariantById(id) {
-        setSelectedVariant(variants[id]);
-    };
-    var selectVariantByAttribute = function selectVariantByAttribute(key) {
-        var ref;
-        // Get by collapseKey for SD
-        var split = key.split(':');
-        if (split[0] === 'collapseKey') {
-            var id = Object.keys(variants).find(function(el) {
-                return variants[el].collapseKey === split[1];
-            });
-            return setSelectedVariant(variants[id]);
-        }
-        var id1 = (ref = combinations[key]) === null || ref === void 0 ? void 0 : ref.value;
-        setSelectedVariant(variants[id1]);
-    };
-    var selectVariantByCombination = function selectVariantByCombination(key, value) {
-        // Take collapseKey for SD
-        var split = value.split(':');
-        if (split[0] === 'collapseKey') {
-            var id = Object.keys(variants).find(function(el) {
-                var ref;
-                return variants[el].collapseKey === split[1] && ((ref = variants[el].attributes.find(function(attr) {
-                    return attr.name === 'size';
-                })) === null || ref === void 0 ? void 0 : ref.value) === key;
-            });
-            return setSelectedVariant(variants[id]);
-        }
-        var id2 = combinations[key].params[value];
-        setSelectedVariant(variants[id2]);
-    };
-    var selectVariantOptions = function selectVariantOptions(definitionKey, optionKey) {
-        if (selectedVariant) {
-            var newSelectedVariant = _objectSpread({}, selectedVariant);
-            newSelectedVariant.selectedOptions = newSelectedVariant.selectedOptions.filter(function(opt) {
-                return opt.definitionKey !== definitionKey;
-            });
-            newSelectedVariant.selectedOptions = _toConsumableArray(newSelectedVariant.selectedOptions).concat([
-                {
-                    definitionKey: definitionKey,
-                    optionKey: optionKey
-                }, 
-            ]);
-            newSelectedVariant.mappedSelectedOptions = newSelectedVariant.selectedOptions.map(function(option) {
-                return createSelectedOption2(newSelectedVariant.options, option);
-            });
-            setSelectedVariant(newSelectedVariant);
-        }
-    };
-    var getSelectedAttribute = function getSelectedAttribute(rule, attributes) {
-        var ref;
-        var attributeRule = (ref = attributeRules[rule]) === null || ref === void 0 ? void 0 : ref.values;
-        var result;
-        attributes.forEach(function(currentKey) {
-            var found = attributeRule === null || attributeRule === void 0 ? void 0 : attributeRule[currentKey.value];
-            if (found) result = _objectSpread({
-                id: currentKey.value,
-                name: rule
-            }, found);
-        });
-        return result;
-    };
-    var getVariantById = function getVariantById(id) {
-        return variants === null || variants === void 0 ? void 0 : variants[id];
-    };
-    var getVariantByAttribute = function getVariantByAttribute(key) {
-        var ref;
-        var id = (ref = combinations[key]) === null || ref === void 0 ? void 0 : ref.value;
-        return variants === null || variants === void 0 ? void 0 : variants[id];
-    };
-    var getVariantByCombination = function getVariantByCombination(key, value) {
-        var ref11;
-        var split = value === null || value === void 0 ? void 0 : value.split(':');
-        if ((split === null || split === void 0 ? void 0 : split[0]) === 'collapseKey') {
-            var id = Object.keys(variants).find(function(el) {
-                var ref;
-                return variants[el].collapseKey === (split === null || split === void 0 ? void 0 : split[1]) && ((ref = variants[el].attributes.find(function(attr) {
-                    return attr.name === 'size';
-                })) === null || ref === void 0 ? void 0 : ref.value) === key;
-            });
-            return variants[id];
-        }
-        var id3 = (ref11 = combinations[key]) === null || ref11 === void 0 ? void 0 : ref11.params[value];
-        return variants === null || variants === void 0 ? void 0 : variants[id3];
-    };
-    var getCustomFieldValue = function getCustomFieldValue(field) {
-        return customFields === null || customFields === void 0 ? void 0 : customFields[field];
-    };
-    var getCombinationsForAttributeRule = function getCombinationsForAttributeRule(key, id) {
-        var ref, ref12;
-        var result = attributeRules === null || attributeRules === void 0 ? void 0 : (ref = attributeRules[key]) === null || ref === void 0 ? void 0 : (ref12 = ref.values) === null || ref12 === void 0 ? void 0 : ref12[id];
-        return result;
-    };
-    var ref5 = _slicedToArray(React.useState(false), 2), mounted = ref5[0], setMounted = ref5[1];
-    var ref1 = _slicedToArray(React.useState(getCombinationsAndAttributeRules), 2), ref2 = ref1[0], combinations = ref2.combinations, attributeRules = ref2.attributeRules, setCombinationsAndAttributeRules = ref1[1];
-    var ref3 = _slicedToArray(React.useState(getVariantsWithInventory), 2), variants = ref3[0], setVariants = ref3[1];
-    var ref4 = _slicedToArray(React.useState(getDefaultVariant), 2), selectedVariant = ref4[0], setSelectedVariant = ref4[1];
+    var ref38 = useProductVariants({
+        product: product,
+        defaultVariantId: defaultVariantId
+    }), selectedVariant = ref38.selectedVariant, attributeRules = ref38.attributeRules, variants = ref38.variants, getVariantById = ref38.getVariantById, getVariantByAttribute = ref38.getVariantByAttribute, getVariantByCombination = ref38.getVariantByCombination, getCustomFieldValue = ref38.getCustomFieldValue, getCombinationsForAttributeRule = ref38.getCombinationsForAttributeRule, selectVariantById = ref38.selectVariantById, selectVariantByAttribute = ref38.selectVariantByAttribute, selectVariantByCombination = ref38.selectVariantByCombination, selectVariantOptions = ref38.selectVariantOptions;
     var metaData = React.useMemo(function() {
-        var ref, ref13, ref14, ref15, ref16, ref17, ref18, ref19, ref20, ref21, ref22, ref23, ref24, ref25, ref26, ref27, ref28, ref29, ref30, ref31, ref32, ref33, ref34, ref35, ref36, ref37, ref38, ref39, ref40, ref41, ref42, ref43, ref44, ref45, ref46, ref47, ref48, ref49;
+        var ref, ref1, ref2, ref3, ref4, ref5, ref6, ref7, ref8, ref9, ref10, ref11, ref12, ref13, ref14, ref15, ref16, ref17, ref18, ref19, ref20, ref21, ref22, ref23, ref24, ref25, ref26, ref27, ref28, ref29, ref30, ref31, ref32, ref33, ref34, ref35, ref36, ref37;
         var rootCategory = product === null || product === void 0 ? void 0 : (ref = product.categories) === null || ref === void 0 ? void 0 : ref[0];
         var rootCategoryId = rootCategory === null || rootCategory === void 0 ? void 0 : rootCategory.resourceId;
         var metaObj = {
             _id: product === null || product === void 0 ? void 0 : product._id,
-            name: includeBrandInName && (product === null || product === void 0 ? void 0 : (ref13 = product.brands) === null || ref13 === void 0 ? void 0 : (ref14 = ref13[0]) === null || ref14 === void 0 ? void 0 : (ref15 = ref14.resource) === null || ref15 === void 0 ? void 0 : ref15.name) ? "".concat(getTranslatableField(product === null || product === void 0 ? void 0 : (ref16 = product.brands) === null || ref16 === void 0 ? void 0 : (ref17 = ref16[0]) === null || ref17 === void 0 ? void 0 : (ref18 = ref17.resource) === null || ref18 === void 0 ? void 0 : ref18.name), " ").concat(getTranslatableField(selectedVariant === null || selectedVariant === void 0 ? void 0 : selectedVariant.name) || getTranslatableField(product === null || product === void 0 ? void 0 : product.name)) : getTranslatableField(selectedVariant === null || selectedVariant === void 0 ? void 0 : selectedVariant.name) || getTranslatableField(product === null || product === void 0 ? void 0 : product.name),
+            name: includeBrandInName && (product === null || product === void 0 ? void 0 : (ref1 = product.brands) === null || ref1 === void 0 ? void 0 : (ref2 = ref1[0]) === null || ref2 === void 0 ? void 0 : (ref3 = ref2.resource) === null || ref3 === void 0 ? void 0 : ref3.name) ? "".concat(getTranslatableField(product === null || product === void 0 ? void 0 : (ref4 = product.brands) === null || ref4 === void 0 ? void 0 : (ref5 = ref4[0]) === null || ref5 === void 0 ? void 0 : (ref6 = ref5.resource) === null || ref6 === void 0 ? void 0 : ref6.name), " ").concat(getTranslatableField(selectedVariant === null || selectedVariant === void 0 ? void 0 : selectedVariant.name) || getTranslatableField(product === null || product === void 0 ? void 0 : product.name)) : getTranslatableField(selectedVariant === null || selectedVariant === void 0 ? void 0 : selectedVariant.name) || getTranslatableField(product === null || product === void 0 ? void 0 : product.name),
             slug: getTranslatableField(product === null || product === void 0 ? void 0 : product.slug),
             description: getTranslatableField(selectedVariant === null || selectedVariant === void 0 ? void 0 : selectedVariant.description) || getTranslatableField(product === null || product === void 0 ? void 0 : product.description),
             shortDescription: getTranslatableField(selectedVariant === null || selectedVariant === void 0 ? void 0 : selectedVariant.metaDescription) || getTranslatableField(product === null || product === void 0 ? void 0 : product.metaDescription),
             brand: {
-                _id: product === null || product === void 0 ? void 0 : (ref19 = product.brands) === null || ref19 === void 0 ? void 0 : (ref20 = ref19[0]) === null || ref20 === void 0 ? void 0 : ref20.resourceId,
-                name: getTranslatableField(product === null || product === void 0 ? void 0 : (ref21 = product.brands) === null || ref21 === void 0 ? void 0 : (ref22 = ref21[0]) === null || ref22 === void 0 ? void 0 : (ref23 = ref22.resource) === null || ref23 === void 0 ? void 0 : ref23.name),
-                slug: getTranslatableField(product === null || product === void 0 ? void 0 : (ref24 = product.brands) === null || ref24 === void 0 ? void 0 : (ref25 = ref24[0]) === null || ref25 === void 0 ? void 0 : (ref26 = ref25.resource) === null || ref26 === void 0 ? void 0 : ref26.slug),
-                logo: product === null || product === void 0 ? void 0 : (ref27 = product.brands) === null || ref27 === void 0 ? void 0 : (ref28 = ref27[0]) === null || ref28 === void 0 ? void 0 : (ref29 = ref28.resource) === null || ref29 === void 0 ? void 0 : (ref30 = ref29.assets) === null || ref30 === void 0 ? void 0 : (ref31 = ref30[0]) === null || ref31 === void 0 ? void 0 : (ref32 = ref31.sources) === null || ref32 === void 0 ? void 0 : (ref33 = ref32[0]) === null || ref33 === void 0 ? void 0 : ref33.url
+                _id: product === null || product === void 0 ? void 0 : (ref7 = product.brands) === null || ref7 === void 0 ? void 0 : (ref8 = ref7[0]) === null || ref8 === void 0 ? void 0 : ref8.resourceId,
+                name: getTranslatableField(product === null || product === void 0 ? void 0 : (ref9 = product.brands) === null || ref9 === void 0 ? void 0 : (ref10 = ref9[0]) === null || ref10 === void 0 ? void 0 : (ref11 = ref10.resource) === null || ref11 === void 0 ? void 0 : ref11.name),
+                slug: getTranslatableField(product === null || product === void 0 ? void 0 : (ref12 = product.brands) === null || ref12 === void 0 ? void 0 : (ref13 = ref12[0]) === null || ref13 === void 0 ? void 0 : (ref14 = ref13.resource) === null || ref14 === void 0 ? void 0 : ref14.slug),
+                logo: product === null || product === void 0 ? void 0 : (ref15 = product.brands) === null || ref15 === void 0 ? void 0 : (ref16 = ref15[0]) === null || ref16 === void 0 ? void 0 : (ref17 = ref16.resource) === null || ref17 === void 0 ? void 0 : (ref18 = ref17.assets) === null || ref18 === void 0 ? void 0 : (ref19 = ref18[0]) === null || ref19 === void 0 ? void 0 : (ref20 = ref19.sources) === null || ref20 === void 0 ? void 0 : (ref21 = ref20[0]) === null || ref21 === void 0 ? void 0 : ref21.url
             },
             category: {
-                _id: product === null || product === void 0 ? void 0 : (ref35 = product.categories) === null || ref35 === void 0 ? void 0 : (ref36 = ref35[(product === null || product === void 0 ? void 0 : (ref34 = product.categories) === null || ref34 === void 0 ? void 0 : ref34.length) - 1]) === null || ref36 === void 0 ? void 0 : ref36.resourceId,
-                name: getTranslatableField(product === null || product === void 0 ? void 0 : (ref38 = product.categories) === null || ref38 === void 0 ? void 0 : (ref39 = ref38[(product === null || product === void 0 ? void 0 : (ref37 = product.categories) === null || ref37 === void 0 ? void 0 : ref37.length) - 1]) === null || ref39 === void 0 ? void 0 : (ref40 = ref39.resource) === null || ref40 === void 0 ? void 0 : ref40.name),
-                slug: getTranslatableField(product === null || product === void 0 ? void 0 : (ref42 = product.categories) === null || ref42 === void 0 ? void 0 : (ref43 = ref42[(product === null || product === void 0 ? void 0 : (ref41 = product.categories) === null || ref41 === void 0 ? void 0 : ref41.length) - 1]) === null || ref43 === void 0 ? void 0 : (ref44 = ref43.resource) === null || ref44 === void 0 ? void 0 : ref44.slug)
+                _id: product === null || product === void 0 ? void 0 : (ref23 = product.categories) === null || ref23 === void 0 ? void 0 : (ref24 = ref23[(product === null || product === void 0 ? void 0 : (ref22 = product.categories) === null || ref22 === void 0 ? void 0 : ref22.length) - 1]) === null || ref24 === void 0 ? void 0 : ref24.resourceId,
+                name: getTranslatableField(product === null || product === void 0 ? void 0 : (ref26 = product.categories) === null || ref26 === void 0 ? void 0 : (ref27 = ref26[(product === null || product === void 0 ? void 0 : (ref25 = product.categories) === null || ref25 === void 0 ? void 0 : ref25.length) - 1]) === null || ref27 === void 0 ? void 0 : (ref28 = ref27.resource) === null || ref28 === void 0 ? void 0 : ref28.name),
+                slug: getTranslatableField(product === null || product === void 0 ? void 0 : (ref30 = product.categories) === null || ref30 === void 0 ? void 0 : (ref31 = ref30[(product === null || product === void 0 ? void 0 : (ref29 = product.categories) === null || ref29 === void 0 ? void 0 : ref29.length) - 1]) === null || ref31 === void 0 ? void 0 : (ref32 = ref31.resource) === null || ref32 === void 0 ? void 0 : ref32.slug)
             },
             rootCategory: {
                 _id: rootCategoryId,
-                name: getTranslatableField(rootCategory === null || rootCategory === void 0 ? void 0 : (ref45 = rootCategory.resource) === null || ref45 === void 0 ? void 0 : ref45.name),
-                slug: getTranslatableField(rootCategory === null || rootCategory === void 0 ? void 0 : (ref46 = rootCategory.resource) === null || ref46 === void 0 ? void 0 : ref46.slug)
+                name: getTranslatableField(rootCategory === null || rootCategory === void 0 ? void 0 : (ref33 = rootCategory.resource) === null || ref33 === void 0 ? void 0 : ref33.name),
+                slug: getTranslatableField(rootCategory === null || rootCategory === void 0 ? void 0 : (ref34 = rootCategory.resource) === null || ref34 === void 0 ? void 0 : ref34.slug)
             },
             categories: formatCategories(product === null || product === void 0 ? void 0 : product.categories, rootCategoryId),
             reviewRatingStatistics: product === null || product === void 0 ? void 0 : product.reviewRatingStatistics,
-            content: Boolean(selectedVariant === null || selectedVariant === void 0 ? void 0 : (ref47 = selectedVariant.content) === null || ref47 === void 0 ? void 0 : ref47.map(createProductContent).length) ? selectedVariant === null || selectedVariant === void 0 ? void 0 : (ref48 = selectedVariant.content) === null || ref48 === void 0 ? void 0 : ref48.map(createProductContent) : product === null || product === void 0 ? void 0 : (ref49 = product.content) === null || ref49 === void 0 ? void 0 : ref49.map(createProductContent),
+            content: Boolean(selectedVariant === null || selectedVariant === void 0 ? void 0 : (ref35 = selectedVariant.content) === null || ref35 === void 0 ? void 0 : ref35.map(createProductContent).length) ? selectedVariant === null || selectedVariant === void 0 ? void 0 : (ref36 = selectedVariant.content) === null || ref36 === void 0 ? void 0 : ref36.map(createProductContent) : product === null || product === void 0 ? void 0 : (ref37 = product.content) === null || ref37 === void 0 ? void 0 : ref37.map(createProductContent),
             assets: assetsFieldsToMap(product === null || product === void 0 ? void 0 : product.assets)
         };
         return metaObj;
@@ -303,30 +68,6 @@ export function ProductProvider(param) {
         product === null || product === void 0 ? void 0 : product.metaTitle,
         selectedVariant, 
     ]);
-    var customFields = React.useMemo(function() {
-        var mappedFields = createCustomFieldsMap(product === null || product === void 0 ? void 0 : product.custom);
-        return mappedFields;
-    }, [
-        product === null || product === void 0 ? void 0 : product.custom
-    ]);
-    React.useEffect(function() {
-        // prevent unnecessary calculations
-        if (mounted) {
-            setVariants(getVariantsWithInventory());
-        }
-    }, [
-        product
-    ]);
-    React.useMemo(function() {
-        // prevent unnecessary calculations
-        if (!mounted) {
-            return setMounted(true);
-        }
-        var data = getCombinationsAndAttributeRules();
-        setCombinationsAndAttributeRules(data);
-    }, [
-        variants
-    ]);
     var collapsedImages = createCollapseKeyImagesMap(product);
     var state = {
         metaData: metaData,