@ikas/storefront 0.0.166-alpha.6 → 0.0.167-alpha.1

package/build/index.es.js

@@ -1,11 +1,11 @@
-import { makeAutoObservable, configure, makeObservable, observable, runInAction, reaction, computed, action, toJS } from 'mobx';
+import { makeAutoObservable, configure, makeObservable, observable, runInAction, reaction, computed, action } from 'mobx';
 import fs from 'fs';
 import path$1 from 'path';
 import getConfig from 'next/config';
-import React, { createElement, Fragment as Fragment$1, useEffect, useState, useRef, useCallback, useMemo } from 'react';
+import React, { createElement, Fragment as Fragment$1, useEffect, useMemo, useState, useRef, useCallback } from 'react';
 import { observer } from 'mobx-react-lite';
-import Head from 'next/head';
 import { useRouter } from 'next/router';
+import Head from 'next/head';
 import crypto$1 from 'crypto';
 import NextImage from 'next/image';
 import Link from 'next/link';
@@ -10979,6 +10979,7 @@ var IkasStorefrontConfig = /** @class */ (function () {
     };
     IkasStorefrontConfig.getJson = function () {
         return {
+            domain: IkasStorefrontConfig.domain,
             storefrontId: IkasStorefrontConfig.storefrontId || null,
             storefrontRoutingId: IkasStorefrontConfig.storefrontRoutingId || null,
             storefrontThemeId: IkasStorefrontConfig.storefrontThemeId || null,
@@ -22805,7 +22806,7 @@ var MAX_CVC_LENGTH = 4;
 var USE_DIFFERENT_ADDRESS_KEY = "sAddr";
 var isServer$1 = typeof localStorage === "undefined";
 var CheckoutViewModel = /** @class */ (function () {
-    function CheckoutViewModel(checkout, checkoutSettings, router, returnPolicy, privacyPolicy, termsOfService, t) {
+    function CheckoutViewModel(checkout, checkoutSettings, merchantSettings, router, returnPolicy, privacyPolicy, termsOfService, t) {
         var _this = this;
         this.checkout = new IkasCheckout();
         this.checkoutSettings = new IkasCheckoutSettings();
@@ -22950,12 +22951,14 @@ var CheckoutViewModel = /** @class */ (function () {
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
+                        if (!!this.merchantSettings) return [3 /*break*/, 2];
                         merchantId = decodeBase64(IkasStorefrontConfig.config.apiKey || "");
                         _a = this;
                         return [4 /*yield*/, IkasMerchantAPI.listMerchantSettings(merchantId)];
                     case 1:
                         _a.merchantSettings = _b.sent();
-                        return [2 /*return*/];
+                        _b.label = 2;
+                    case 2: return [2 /*return*/];
                 }
             });
         }); };
@@ -23644,6 +23647,8 @@ var CheckoutViewModel = /** @class */ (function () {
         this.privacyPolicy = privacyPolicy;
         this.termsOfService = termsOfService;
         this.t = t;
+        if (merchantSettings)
+            this.merchantSettings = merchantSettings;
         this.isTermsAndConditionsChecked = this.checkoutSettings.isTermsAndConditionsDefaultChecked;
         this.store.cartStore.cart = this.checkout.cart;
         this.init();
@@ -35714,6 +35719,13 @@ var IkasProductDetail = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(IkasProductDetail.prototype, "hasStock", {
+        get: function () {
+            return this.product.variants.some(function (v) { return v.stock > 0; });
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(IkasProductDetail.prototype, "displayedVariantTypes", {
         get: function () {
             var _this = this;
@@ -41241,100 +41253,122 @@ var ThemeComponent = observer(function (_a) {
 });
 
 var IkasPageHead = observer(function (_a) {
-    var _b;
-    var page = _a.page, pageTitle = _a.pageTitle, description = _a.description, pageSpecificDataStr = _a.pageSpecificDataStr, props = __rest(_a, ["page", "pageTitle", "description", "pageSpecificDataStr"]);
-    var ogpMetas = [];
-    var schemas = [];
-    var isCanonicalLinkAdd = false;
-    var canonicalHref = "";
+    var pageType = _a.pageType, pageTitle = _a.pageTitle, pageDescription = _a.pageDescription, pageSpecificDataStr = _a.pageSpecificDataStr, merchantSettingsStr = _a.merchantSettingsStr, addOgpMetas = _a.addOgpMetas;
+    var isBrowser = typeof window !== "undefined";
+    // NextJS sets the lang with routing ids, this overrides it with the locale
     useEffect(function () {
         var _a;
         document.documentElement.lang =
             ((_a = IkasStorefrontConfig.routings.find(function (r) { return r.id === IkasStorefrontConfig.storefrontRoutingId; })) === null || _a === void 0 ? void 0 : _a.locale) || "tr";
     }, []);
-    if (props.addOgpMetas) {
-        ogpMetas.push({
-            property: "og:type",
-            content: "website",
-        });
-        if (typeof window !== "undefined") {
-            ogpMetas.push({
-                property: "og:site_name",
-                content: "https://" + window.location.hostname,
-            });
+    var merchantSettings = useMemo(function () {
+        if (merchantSettingsStr)
+            return new IkasMerchantSettings(JSON.parse(merchantSettingsStr));
+    }, [merchantSettingsStr]);
+    var pageSpecificData = useMemo(function () {
+        if (!pageSpecificDataStr)
+            return pageSpecificDataStr;
+        var parsedData = JSON.parse(pageSpecificDataStr);
+        switch (pageType) {
+            case IkasThemePageType.PRODUCT:
+                return new IkasProductDetail(parsedData.product, parsedData.selectedVariantValues);
+            case IkasThemePageType.CATEGORY:
+                return new IkasCategory(parsedData);
+            case IkasThemePageType.BRAND:
+                return new IkasBrand(parsedData);
+            default:
+                return pageSpecificDataStr;
+        }
+    }, [pageSpecificDataStr]);
+    var href = useMemo(function () {
+        if (pageSpecificData && pageSpecificData.href) {
+            return "https://" + IkasStorefrontConfig.domain + pageSpecificData.href;
         }
-        if (pageTitle) {
+    }, [pageSpecificData]);
+    var ogpMetas = useMemo(function () {
+        var _a;
+        var ogpMetas = [];
+        if (addOgpMetas) {
             ogpMetas.push({
-                property: "og:title",
-                content: pageTitle,
+                property: "og:type",
+                content: "website",
             });
-        }
-        if (description) {
             ogpMetas.push({
-                property: "og:description",
-                content: description,
+                property: "og:site_name",
+                content: "https://" + IkasStorefrontConfig.domain,
             });
-        }
-        if (typeof window !== "undefined") {
+            if (pageTitle) {
+                ogpMetas.push({
+                    property: "og:title",
+                    content: pageTitle,
+                });
+            }
+            if (pageDescription) {
+                ogpMetas.push({
+                    property: "og:description",
+                    content: pageDescription,
+                });
+            }
             ogpMetas.push({
                 property: "og:url",
-                content: window.location.href,
+                content: href ||
+                    (isBrowser ? window.location.href : "") ||
+                    "https://" + IkasStorefrontConfig.domain,
             });
-        }
-        if (props.merchantSettings) {
-            if (pageSpecificDataStr && (page === null || page === void 0 ? void 0 : page.type) === IkasThemePageType.PRODUCT) {
-                var productDetailParsed = JSON.parse(pageSpecificDataStr);
-                var productDetail = new IkasProductDetail(productDetailParsed.product, productDetailParsed.selectedVariantValues);
+            if (pageSpecificData && pageType === IkasThemePageType.PRODUCT) {
+                var productDetail = pageSpecificData;
                 if (productDetail.selectedVariant.mainImage) {
                     ogpMetas.push({
                         property: "og:image",
-                        content: (_b = productDetail.selectedVariant.mainImage) === null || _b === void 0 ? void 0 : _b.src,
+                        content: (_a = productDetail.selectedVariant.mainImage) === null || _a === void 0 ? void 0 : _a.src,
                     });
                 }
             }
-            else {
-                var merchantSettings = new IkasMerchantSettings(JSON.parse(props.merchantSettings));
+            else if (merchantSettings) {
                 ogpMetas.push({
                     property: "og:image",
                     content: merchantSettings.logo.src,
                 });
             }
         }
-    }
-    if (props.merchantSettings) {
-        // for schema.org
-        var merchantSettings = new IkasMerchantSettings(JSON.parse(props.merchantSettings));
-        var websiteSchema = createWebsiteSchema();
-        var storeSchema = createStoreSchema(merchantSettings);
-        schemas.push(websiteSchema);
-        schemas.push(storeSchema);
-    }
-    if (pageSpecificDataStr && (page === null || page === void 0 ? void 0 : page.type) === IkasThemePageType.PRODUCT) {
-        var productDetailParsed = JSON.parse(pageSpecificDataStr);
-        var productDetail = new IkasProductDetail(productDetailParsed.product, productDetailParsed.selectedVariantValues);
-        if (typeof window !== "undefined" && productDetail.product.hasVariant) {
-            isCanonicalLinkAdd =
-                window.location.pathname !== productDetail.product.href;
-            canonicalHref =
-                "https://" + window.location.hostname + productDetail.product.href;
+        return ogpMetas;
+    }, [
+        pageTitle,
+        pageSpecificData,
+        href,
+        pageDescription,
+        merchantSettings,
+        addOgpMetas,
+        merchantSettings,
+    ]);
+    var schemas = useMemo(function () {
+        var schemas = [];
+        if (merchantSettings) {
+            var websiteSchema = createWebsiteSchema();
+            var storeSchema = createStoreSchema(merchantSettings);
+            schemas.push(websiteSchema);
+            schemas.push(storeSchema);
         }
-        var schema = createProductSchema(productDetail);
-        if (schema)
-            schemas.push(schema);
-    }
-    if (pageSpecificDataStr && (page === null || page === void 0 ? void 0 : page.type) === IkasThemePageType.CATEGORY) {
-        var categorySchema = createCategorySchema(pageSpecificDataStr);
-        if (categorySchema)
-            schemas.push(categorySchema);
-        var categoryBreadcrumbSchema = createCategoryBreadcrumbSchema(pageSpecificDataStr);
-        if (categoryBreadcrumbSchema)
-            schemas.push(categoryBreadcrumbSchema);
-    }
+        if (pageSpecificData && pageType === IkasThemePageType.PRODUCT) {
+            var productDetail = pageSpecificData;
+            var schema = createProductSchema(productDetail);
+            if (schema)
+                schemas.push(schema);
+        }
+        if (pageSpecificData && pageType === IkasThemePageType.CATEGORY) {
+            var categorySchema = createCategorySchema(pageSpecificData);
+            var categoryBreadcrumbSchema = createCategoryBreadcrumbSchema(pageSpecificData);
+            if (categorySchema)
+                schemas.push(categorySchema);
+            if (categoryBreadcrumbSchema)
+                schemas.push(categoryBreadcrumbSchema);
+        }
+        return schemas;
+    }, [pageSpecificData, merchantSettings]);
     return (createElement(Head, null,
         createElement("title", null, pageTitle || ""),
-        createElement("meta", { name: "description", content: description || "" }),
-        isCanonicalLinkAdd && createElement("link", { rel: "canonical", href: canonicalHref }),
-        !!props.addOgpMetas &&
+        createElement("meta", { name: "description", content: pageDescription || "" }),
+        !!addOgpMetas &&
             ogpMetas.map(function (ogpMeta, index) { return (createElement("meta", { key: ogpMeta.content + "-" + index, property: ogpMeta.property, content: ogpMeta.content })); }),
         !!schemas.length &&
             schemas.map(function (schema, index) { return (createElement("script", { key: index, type: "application/ld+json", dangerouslySetInnerHTML: {
@@ -41342,66 +41376,30 @@ var IkasPageHead = observer(function (_a) {
                 } })); })));
 });
 function createWebsiteSchema() {
-    var _a;
-    var hostname = "";
-    if (typeof window !== "undefined") {
-        hostname = (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.hostname;
-    }
     return {
         "@context": "https://schema.org",
         "@type": "Website",
-        url: "https://" + hostname,
+        url: "https://" + IkasStorefrontConfig.domain,
     };
 }
 function createStoreSchema(merchantSettings) {
-    var _a, _b;
-    var hostname = "";
-    if (typeof window !== "undefined") {
-        hostname = (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.hostname;
-    }
+    var _a;
     return {
         "@context": "https://schema.org",
         "@type": "Store",
         name: merchantSettings === null || merchantSettings === void 0 ? void 0 : merchantSettings.merchantName,
-        logo: (_b = merchantSettings === null || merchantSettings === void 0 ? void 0 : merchantSettings.logo) === null || _b === void 0 ? void 0 : _b.src,
-        url: "https://" + hostname,
+        logo: (_a = merchantSettings === null || merchantSettings === void 0 ? void 0 : merchantSettings.logo) === null || _a === void 0 ? void 0 : _a.src,
+        url: "https://" + IkasStorefrontConfig.domain,
     };
 }
 function createProductSchema(productDetail) {
     var _a, _b;
     try {
         var isBrowser = typeof window !== "undefined";
-        // TODO this code copy-pasted, organize this block
         if (isBrowser) {
-            var urlParams_1 = new URLSearchParams(window.location.search);
-            var vid_1 = urlParams_1.get("vid");
-            if (vid_1) {
-                var variant = productDetail.product.variants.find(function (v) { return v.id === vid_1; });
-                if (variant) {
-                    productDetail.selectedVariantValues = variant.variantValues;
-                }
-            }
-            else {
-                var productVariantTypeSlugs = productDetail.product.variantTypes.map(function (vt) { return vt.variantType.slug; });
-                var selectedVariantValues_1 = [];
-                productVariantTypeSlugs.forEach(function (slug, vtIndex) {
-                    var productVariantType = productDetail.product.variantTypes[vtIndex];
-                    var variantValueSlug = urlParams_1.get(slug);
-                    if (variantValueSlug) {
-                        var variantValue = productVariantType.variantType.values.find(function (v) { return v.slug === variantValueSlug; });
-                        if (variantValue)
-                            selectedVariantValues_1.push(variantValue);
-                    }
-                });
-                if (selectedVariantValues_1.length ===
-                    productDetail.selectedVariantValues.length) {
-                    productDetail.selectedVariantValues = selectedVariantValues_1;
-                }
-            }
+            IkasPageDataProvider._initProductDetailOnBrowser(productDetail);
         }
-        var productUrl = isBrowser
-            ? "https://" + window.location.hostname + productDetail.href
-            : "";
+        var productUrl = "https://" + IkasStorefrontConfig.domain + productDetail.href;
         return {
             "@context": "https://schema.org/",
             "@type": "Product",
@@ -41432,14 +41430,10 @@ function createProductSchema(productDetail) {
     }
     catch (err) { }
 }
-function createCategorySchema(pageSpecificDataStr) {
+function createCategorySchema(category) {
     var _a, _b, _c;
     try {
-        var categoryParsed = JSON.parse(pageSpecificDataStr);
-        var category = new IkasCategory(categoryParsed);
-        var categoryUrl = typeof window !== undefined
-            ? "https://" + window.location.hostname + category.href
-            : "";
+        var categoryUrl = "https://" + IkasStorefrontConfig.domain + category.href;
         return {
             "@context": "http://schema.org",
             "@type": "CollectionPage",
@@ -41451,10 +41445,8 @@ function createCategorySchema(pageSpecificDataStr) {
     }
     catch (_d) { }
 }
-function createCategoryBreadcrumbSchema(pageSpecificDataStr) {
+function createCategoryBreadcrumbSchema(category) {
     try {
-        var categoryParsed = JSON.parse(pageSpecificDataStr);
-        var category = new IkasCategory(categoryParsed);
         return {
             "@context": "http://schema.org",
             "@type": "BreadcrumbList",
@@ -41462,9 +41454,7 @@ function createCategoryBreadcrumbSchema(pageSpecificDataStr) {
                 "@type": "ListItem",
                 position: index + 1,
                 name: categoryPath.name,
-                item: typeof window !== undefined
-                    ? "https://" + window.location.hostname + categoryPath.href
-                    : "",
+                item: "https://" + IkasStorefrontConfig.domain + categoryPath.href,
             }); }),
         };
     }
@@ -41474,13 +41464,15 @@ function createCategoryBreadcrumbSchema(pageSpecificDataStr) {
 var styles = {"IkasPage":"style-module_IkasPage__ATOib"};
 
 var IkasPage = observer(function (_a) {
-    var propValues = _a.propValues, page = _a.page, pageSpecificDataStr = _a.pageSpecificDataStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, addOgpMetas = _a.addOgpMetas;
+    var propValuesStr = _a.propValuesStr, pageType = _a.pageType, pageTitle = _a.pageTitle, pageDescription = _a.pageDescription, pageSpecificDataStr = _a.pageSpecificDataStr, settingsStr = _a.settingsStr, merchantSettingsStr = _a.merchantSettingsStr, configJson = _a.configJson, reInitOnBrowser = _a.reInitOnBrowser, addOgpMetas = _a.addOgpMetas;
+    IkasStorefrontConfig.initWithJson(configJson);
     var store = IkasStorefrontConfig.store;
-    var settings = useState(new IkasThemeSettings(JSON.parse(settingsStr)))[0];
+    var router = useRouter();
     var _b = useState(false), mounted = _b[0], setMounted = _b[1];
-    if (page) {
-        store.currentPageType = page.type;
-    }
+    var _c = useState(false), isBrowser = _c[0], setIsBrowser = _c[1];
+    var settings = useState(new IkasThemeSettings(JSON.parse(settingsStr)))[0];
+    var _d = useState(IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr)), propValues = _d[0], setPropValues = _d[1];
+    store.currentPageType = pageType;
     useEffect(function () {
         //@ts-ignore
         store.setSettings(settingsStr);
@@ -41489,16 +41481,22 @@ var IkasPage = observer(function (_a) {
         store.checkLocalization();
         setMounted(true);
     }, []);
+    useEffect(function () {
+        if (reInitOnBrowser)
+            setIsBrowser(typeof window !== "undefined");
+        handleAnalytics(pageType, pageSpecificDataStr, store);
+    }, [pageType, pageSpecificDataStr]);
+    useEffect(function () {
+        setPropValues(IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr, isBrowser));
+    }, [isBrowser, propValuesStr, pageType, settingsStr]);
     var headerComponentPropValue = propValues.find(function (pv) { return pv.component.isHeader; });
     var footerComponentPropValue = propValues.find(function (pv) { return pv.component.isFooter; });
     var others = propValues.filter(function (pv) { return !pv.component.isHeader && !pv.component.isFooter; }) || [];
     var visibilityStyle = {
         visibility: mounted ? "visible" : "hidden",
     };
-    if (!page)
-        return null;
     return (createElement(Fragment$1, null,
-        createElement(IkasPageHead, { page: page, pageTitle: page.pageTitle, description: page.description, pageSpecificDataStr: pageSpecificDataStr, merchantSettings: merchantSettings, addOgpMetas: addOgpMetas }),
+        createElement(IkasPageHead, { pageType: pageType, pageTitle: pageTitle, pageDescription: pageDescription, pageSpecificDataStr: pageSpecificDataStr, merchantSettingsStr: merchantSettingsStr, addOgpMetas: addOgpMetas }),
         createElement("div", { style: visibilityStyle, className: styles.IkasPage },
             createElement("div", null,
                 headerComponentPropValue &&
@@ -41511,7 +41509,35 @@ var IkasPage = observer(function (_a) {
 });
 var renderComponent = function (pageComponentPropValue, settings, index) {
     return (createElement(ThemeComponent, { key: pageComponentPropValue.pageComponent.id, index: index, pageComponentPropValue: pageComponentPropValue, settings: settings }));
-};
+};
+function handleAnalytics(pageType, pageSpecificDataStr, store) {
+    try {
+        if (pageType === IkasThemePageType.PRODUCT) {
+            var productDetailParsed = JSON.parse(pageSpecificDataStr);
+            var productDetail = new IkasProductDetail(productDetailParsed.product, productDetailParsed.selectedVariantValues);
+            Analytics.productView(productDetail);
+            // @ts-ignore
+            IkasStorefrontConfig.store.customerStore.onProductView(productDetail.product.id, productDetail.selectedVariant.id);
+        }
+        if (pageType === IkasThemePageType.CATEGORY) {
+            var category = JSON.parse(pageSpecificDataStr);
+            var categoryPath = category.path.map(function (cat) { return cat.name; }).join(" > ");
+            if (category.path.length > 0) {
+                categoryPath = categoryPath + " > " + category.name;
+            }
+            else {
+                categoryPath = category.name;
+            }
+            Analytics.viewCategory(categoryPath, category);
+        }
+        if (pageType === IkasThemePageType.CART) {
+            Analytics.viewCart(store.cartStore.cart);
+        }
+    }
+    catch (err) {
+        console.error(err);
+    }
+}
 
 var IkasPageDataProvider = /** @class */ (function () {
     function IkasPageDataProvider(theme, pageParams, pageType) {
@@ -41540,15 +41566,18 @@ var IkasPageDataProvider = /** @class */ (function () {
     });
     Object.defineProperty(IkasPageDataProvider.prototype, "nextPageData", {
         get: function () {
+            var _a, _b, _c;
             return {
                 props: {
                     propValuesStr: JSON.stringify(this.pageComponentPropValues),
                     pageSpecificDataStr: this.pageSpecificData
                         ? JSON.stringify(this.pageSpecificData || {})
                         : "",
-                    page: toJS(this.page) || null,
+                    pageType: ((_a = this.page) === null || _a === void 0 ? void 0 : _a.type) || IkasThemePageType.CUSTOM,
+                    pageTitle: ((_b = this.page) === null || _b === void 0 ? void 0 : _b.pageTitle) || null,
+                    pageDescription: ((_c = this.page) === null || _c === void 0 ? void 0 : _c.description) || null,
                     settingsStr: JSON.stringify(this.theme.settings || {}),
-                    merchantSettings: this.merchantSettings
+                    merchantSettingsStr: this.merchantSettings
                         ? JSON.stringify(this.merchantSettings)
                         : null,
                     configJson: IkasStorefrontConfig.getJson(),
@@ -42075,33 +42104,36 @@ var IkasPageDataProvider = /** @class */ (function () {
         var _propValue = propValue;
         var productDetail = new IkasProductDetail(_propValue.product, _propValue.selectedVariantValues);
         if (isBrowser) {
-            var urlParams_1 = new URLSearchParams(window.location.search);
-            var vid_1 = urlParams_1.get("vid");
-            if (vid_1) {
-                var variant = productDetail.product.variants.find(function (v) { return v.id === vid_1; });
-                if (variant) {
-                    productDetail.selectedVariantValues = variant.variantValues;
-                }
+            IkasPageDataProvider._initProductDetailOnBrowser(productDetail);
+        }
+        return new IkasProductDetail(productDetail.product, productDetail.selectedVariantValues, router);
+    };
+    IkasPageDataProvider._initProductDetailOnBrowser = function (productDetail) {
+        var urlParams = new URLSearchParams(window.location.search);
+        var vid = urlParams.get("vid");
+        if (vid) {
+            var variant = productDetail.product.variants.find(function (v) { return v.id === vid; });
+            if (variant) {
+                productDetail.selectedVariantValues = variant.variantValues;
             }
-            else {
-                var productVariantTypeSlugs = productDetail.product.variantTypes.map(function (vt) { return vt.variantType.slug; });
-                var selectedVariantValues_1 = [];
-                productVariantTypeSlugs.forEach(function (slug, vtIndex) {
-                    var productVariantType = productDetail.product.variantTypes[vtIndex];
-                    var variantValueSlug = urlParams_1.get(slug);
-                    if (variantValueSlug) {
-                        var variantValue = productVariantType.variantType.values.find(function (v) { return v.slug === variantValueSlug; });
-                        if (variantValue)
-                            selectedVariantValues_1.push(variantValue);
-                    }
-                });
-                if (selectedVariantValues_1.length ===
-                    productDetail.selectedVariantValues.length) {
-                    productDetail.selectedVariantValues = selectedVariantValues_1;
+        }
+        else {
+            var productVariantTypeSlugs = productDetail.product.variantTypes.map(function (vt) { return vt.variantType.slug; });
+            var selectedVariantValues_1 = [];
+            productVariantTypeSlugs.forEach(function (slug, vtIndex) {
+                var productVariantType = productDetail.product.variantTypes[vtIndex];
+                var variantValueSlug = urlParams.get(slug);
+                if (variantValueSlug) {
+                    var variantValue = productVariantType.variantType.values.find(function (v) { return v.slug === variantValueSlug; });
+                    if (variantValue)
+                        selectedVariantValues_1.push(variantValue);
                 }
+            });
+            if (selectedVariantValues_1.length ===
+                productDetail.selectedVariantValues.length) {
+                productDetail.selectedVariantValues = selectedVariantValues_1;
             }
         }
-        return new IkasProductDetail(productDetail.product, productDetail.selectedVariantValues, router);
     };
     IkasPageDataProvider.initAttributePropValue = function (prop, propValue, pageComponentPropValue) {
         pageComponentPropValue.propValues[prop.name] = IkasPageDataProvider._initAttributePropValue(propValue);
@@ -69679,11 +69711,11 @@ var FullscreenLoading = function () {
 
 var IkasCheckoutPage = function (_a) {
     var _b, _c, _d;
-    var checkout = _a.checkout, checkoutSettings = _a.checkoutSettings, customizationProps = _a.customizationProps, returnPolicy = _a.returnPolicy, privacyPolicy = _a.privacyPolicy, termsOfService = _a.termsOfService;
+    var checkout = _a.checkout, checkoutSettings = _a.checkoutSettings, merchantSettings = _a.merchantSettings, customizationProps = _a.customizationProps, returnPolicy = _a.returnPolicy, privacyPolicy = _a.privacyPolicy, termsOfService = _a.termsOfService;
     var t = useTranslation().t;
     var router = useRouter();
     var vm = useState(function () {
-        return new CheckoutViewModel(checkout, checkoutSettings, router, returnPolicy, privacyPolicy, termsOfService, t);
+        return new CheckoutViewModel(checkout, checkoutSettings, merchantSettings, router, returnPolicy, privacyPolicy, termsOfService, t);
     })[0];
     if (vm.step === CheckoutStep.PAYMENT) {
         Analytics.disableHTML();
@@ -69721,9 +69753,9 @@ var IkasCheckoutPage = function (_a) {
         return null;
     }
     return (createElement(Fragment$1, null,
-        createElement(IkasPageHead, { pageTitle: (((_d = vm.merchantSettings) === null || _d === void 0 ? void 0 : _d.merchantName) || "") +
+        createElement(IkasPageHead, { pageType: IkasThemePageType.CHECKOUT, pageTitle: (((_d = vm.merchantSettings) === null || _d === void 0 ? void 0 : _d.merchantName) || "") +
                 " - " +
-                t("checkout-page:securePayment"), description: t("checkout-page:securePayment") }),
+                t("checkout-page:securePayment"), pageDescription: t("checkout-page:securePayment") }),
         createElement("div", { id: "Checkout", className: styles$5.CheckoutPage },
             createElement(ReactTooltip, { place: "top", type: "dark", effect: "solid", arrowColor: "transparent", multiline: true, className: styles$5.ReactTooltipWrap, globalEventOff: "touchstart" }),
             createElement("div", { className: styles$5.Left },
@@ -69942,7 +69974,7 @@ var IkasPageEditor = observer(function () {
             pc.componentId !== ((_d = (_c = vm.theme) === null || _c === void 0 ? void 0 : _c.footerComponent) === null || _d === void 0 ? void 0 : _d.id);
     });
     return (createElement(Fragment$1, null,
-        !!vm.page && (createElement(IkasPageHead, { pageTitle: vm.page.pageTitle, description: vm.page.description })),
+        !!vm.page && (createElement(IkasPageHead, { pageType: vm.page.type, pageTitle: vm.page.pageTitle, pageDescription: vm.page.description })),
         createElement("div", { style: pageStyle },
             createElement("div", null,
                 !!headerPageComponent && (createElement(ThemeEditorComponent, { key: headerPageComponent.id, vm: vm, pageComponent: headerPageComponent })), others === null || others === void 0 ? void 0 :
@@ -70090,7 +70122,7 @@ var SettingsHelper = /** @class */ (function () {
     SettingsHelper.getSettings = function (locale) {
         var _this = this;
         return new Promise(function (resolve) { return __awaiter(_this, void 0, void 0, function () {
-            var isLocal, storefrontResponse, storefront, localTheme, settings, storefront_1, salesChannel_1, localizationMap, storefrontJSScripts_1, themeLocalizationPath, routing_1;
+            var isLocal, storefrontResponse, storefront, localTheme, settings, storefront_1, salesChannel_1, localizationMap, storefrontJSScripts_1, domain_1, themeLocalizationPath, routing_1;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
@@ -70124,6 +70156,7 @@ var SettingsHelper = /** @class */ (function () {
                             favicon: localTheme.settings.favicon,
                             stockPreference: localTheme.settings.stockPreference,
                             storefrontJSScripts: [],
+                            domain: "",
                         });
                         return [3 /*break*/, 5];
                     case 3: return [4 /*yield*/, SettingsHelper.readSettingsFile()];
@@ -70135,6 +70168,7 @@ var SettingsHelper = /** @class */ (function () {
                         salesChannel_1 = new IkasSalesChannel(settings.salesChannel);
                         localizationMap = settings.localizationMap;
                         storefrontJSScripts_1 = settings.storefrontJSScripts || [];
+                        domain_1 = settings.domain;
                         themeLocalizationPath = localizationMap[locale];
                         routing_1 = storefront_1.routings.find(function (r) { return r.id === locale || r.path === locale; });
                         if (!themeLocalizationPath || !routing_1) {
@@ -70161,6 +70195,7 @@ var SettingsHelper = /** @class */ (function () {
                                 favicon: favicon,
                                 stockPreference: stockPreference,
                                 storefrontJSScripts: storefrontJSScripts_1,
+                                domain: domain_1,
                             });
                         });
                         _a.label = 5;
@@ -70172,7 +70207,7 @@ var SettingsHelper = /** @class */ (function () {
     SettingsHelper.getPageData = function (context, isServer, pageType, possiblePageTypes, isEditor) {
         var _a, _b;
         return __awaiter(this, void 0, void 0, function () {
-            var isLocal, isProdEditor, serverRuntimeConfig, locale, settings, storefront, themeLocalization, salesChannel, routing, favicon, stockPreference, storefrontJSScripts, provider, componentIds_1, components, componentDirs, nextI18nConf, currentLocale, i18nReader, translations, extraProps, checkoutComponent, checkoutSettings, customizationProps;
+            var isLocal, isProdEditor, serverRuntimeConfig, locale, settings, storefront, themeLocalization, salesChannel, routing, favicon, stockPreference, storefrontJSScripts, domain, provider, componentIds_1, components, namespaces, nextI18nConf, currentLocale, i18nReader, translations, extraProps, checkoutComponent, checkoutSettings, customizationProps;
             return __generator(this, function (_c) {
                 switch (_c.label) {
                     case 0:
@@ -70198,7 +70233,7 @@ var SettingsHelper = /** @class */ (function () {
                                     notFound: true,
                                 }];
                         }
-                        storefront = settings.storefront, themeLocalization = settings.themeLocalization, salesChannel = settings.salesChannel, routing = settings.routing, favicon = settings.favicon, stockPreference = settings.stockPreference, storefrontJSScripts = settings.storefrontJSScripts;
+                        storefront = settings.storefront, themeLocalization = settings.themeLocalization, salesChannel = settings.salesChannel, routing = settings.routing, favicon = settings.favicon, stockPreference = settings.stockPreference, storefrontJSScripts = settings.storefrontJSScripts, domain = settings.domain;
                         IkasStorefrontConfig.storefrontId = storefront.id;
                         IkasStorefrontConfig.storefrontRoutingId = routing.id;
                         IkasStorefrontConfig.storefrontThemeId = storefront.mainStorefrontThemeId;
@@ -70212,6 +70247,7 @@ var SettingsHelper = /** @class */ (function () {
                         IkasStorefrontConfig.favicon = favicon || null;
                         IkasStorefrontConfig.stockPreference = stockPreference || null;
                         IkasStorefrontConfig.storefrontJSScripts = storefrontJSScripts || [];
+                        IkasStorefrontConfig.domain = domain;
                         provider = new IkasPageDataProvider(themeLocalization.themeJson, context.params, pageType);
                         provider.possiblePageTypes = possiblePageTypes;
                         if (!!isEditor) return [3 /*break*/, 3];
@@ -70230,13 +70266,13 @@ var SettingsHelper = /** @class */ (function () {
                             ? provider.theme.components.map(function (c) { return c.id; })
                             : provider.page.components.map(function (pc) { return pc.componentId; });
                         components = themeLocalization.themeJson.components.filter(function (c) { return isEditor || componentIds_1.includes(c.id); });
-                        componentDirs = __spreadArrays([
-                            "common",
-                            "checkout-page"
-                        ], components.map(function (c) { return c.dir; }));
+                        namespaces = __spreadArrays(["common"], components.map(function (c) { return c.dir; }));
+                        if (pageType === IkasThemePageType.CHECKOUT || isEditor) {
+                            namespaces.push("checkout-page");
+                        }
                         nextI18nConf = serverRuntimeConfig.nextI18nConf;
                         currentLocale = routing.locale;
-                        i18nReader = new I18NFileReader(currentLocale, componentDirs, isLocal ? undefined : nextI18nConf.localePath);
+                        i18nReader = new I18NFileReader(currentLocale, namespaces, isLocal ? undefined : nextI18nConf.localePath);
                         return [4 /*yield*/, i18nReader.read()];
                     case 4:
                         translations = _c.sent();
@@ -70314,15 +70350,10 @@ var SettingsHelper = /** @class */ (function () {
     return SettingsHelper;
 }());
 
-var Page = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { merchantSettings: merchantSettings, settingsStr: settingsStr, page: page, propValues: propValues, addOgpMetas: true }));
+var Page = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var home = observer(Page);
 var getStaticProps = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70332,29 +70363,17 @@ var getStaticProps = function (context) { return __awaiter(void 0, void 0, void
     });
 }); };
 
-var home = /*#__PURE__*/Object.freeze({
+var home$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page,
+    'default': home,
     getStaticProps: getStaticProps
 });
 
-var Page$1 = function (_a) {
-    var page = _a.page, pageSpecificDataStr = _a.pageSpecificDataStr, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var _b = useState(false), isBrowser = _b[0], setIsBrowser = _b[1];
-    var _c = useState(IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr)), propValues = _c[0], setPropValues = _c[1];
-    useEffect(function () {
-        setIsBrowser(typeof window !== "undefined");
-        handleAnalytics(page, pageSpecificDataStr);
-    }, [page, pageSpecificDataStr]);
-    useEffect(function () {
-        setPropValues(IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr, isBrowser));
-    }, [isBrowser, propValuesStr, page]);
-    return (createElement(IkasPage, { page: page, propValues: propValues, pageSpecificDataStr: pageSpecificDataStr, settingsStr: settingsStr, merchantSettings: merchantSettings, addOgpMetas: true }));
+var Page$1 = function (props) {
+    return createElement(IkasPage, __assign({}, props, { addOgpMetas: true, reInitOnBrowser: true }));
 };
 var index$1 = observer(Page$1);
-var getStaticPaths = function (context) { return __awaiter(void 0, void 0, void 0, function () {
+var getStaticPaths = function () { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         return [2 /*return*/, {
                 paths: [],
@@ -70373,35 +70392,7 @@ var getStaticProps$1 = function (context) { return __awaiter(void 0, void 0, voi
             case 1: return [2 /*return*/, _a.sent()];
         }
     });
-}); };
-function handleAnalytics(page, pageSpecificDataStr) {
-    var isServer = typeof window === "undefined";
-    if (!isServer) {
-        try {
-            if (page.type === IkasThemePageType.PRODUCT) {
-                var productDetailParsed = JSON.parse(pageSpecificDataStr);
-                var productDetail = new IkasProductDetail(productDetailParsed.product, productDetailParsed.selectedVariantValues);
-                Analytics.productView(productDetail);
-                // @ts-ignore
-                IkasStorefrontConfig.store.customerStore.onProductView(productDetail.product.id, productDetail.selectedVariant.id);
-            }
-            if (page.type === IkasThemePageType.CATEGORY) {
-                var category = JSON.parse(pageSpecificDataStr);
-                var categoryPath = category.path.map(function (cat) { return cat.name; }).join(" > ");
-                if (category.path.length > 0) {
-                    categoryPath = categoryPath + " > " + category.name;
-                }
-                else {
-                    categoryPath = category.name;
-                }
-                Analytics.viewCategory(categoryPath, category);
-            }
-        }
-        catch (err) {
-            console.error(err);
-        }
-    }
-}
+}); };
 
 var index$2 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -70410,15 +70401,10 @@ var index$2 = /*#__PURE__*/Object.freeze({
     getStaticProps: getStaticProps$1
 });
 
-var Page$2 = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { page: page, settingsStr: settingsStr, propValues: propValues }));
+var Page$2 = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var _slug_ = observer(Page$2);
 var getStaticPaths$1 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     var allSettings, customPagePaths;
     return __generator(this, function (_a) {
@@ -70474,15 +70460,15 @@ var getStaticProps$2 = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var _slug_ = /*#__PURE__*/Object.freeze({
+var _slug_$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$2,
+    'default': _slug_,
     getStaticPaths: getStaticPaths$1,
     getStaticProps: getStaticProps$2
 });
 
 var CheckoutPage = function (_a) {
-    var checkoutSettingsStr = _a.checkoutSettingsStr, customizationProps = _a.customizationProps, configJson = _a.configJson, others = __rest(_a, ["checkoutSettingsStr", "customizationProps", "configJson"]);
+    var merchantSettingsStr = _a.merchantSettingsStr, checkoutSettingsStr = _a.checkoutSettingsStr, customizationProps = _a.customizationProps, configJson = _a.configJson, others = __rest(_a, ["merchantSettingsStr", "checkoutSettingsStr", "customizationProps", "configJson"]);
     var router = useRouter();
     var _b = useState(), checkout = _b[0], setCheckout = _b[1];
     IkasStorefrontConfig.initWithJson(configJson);
@@ -70492,6 +70478,11 @@ var CheckoutPage = function (_a) {
             ? new IkasCheckoutSettings(JSON.parse(checkoutSettingsStr))
             : new IkasCheckoutSettings();
     }, [checkoutSettingsStr]);
+    var merchantSettings = useMemo(function () {
+        return merchantSettingsStr
+            ? new IkasMerchantSettings(JSON.parse(merchantSettingsStr))
+            : null;
+    }, [merchantSettingsStr]);
     useEffect(function () {
         document.documentElement.style.setProperty("--checkout-button-bg-color", (customizationProps === null || customizationProps === void 0 ? void 0 : customizationProps.buttonBgColor) || "#272727");
         document.documentElement.style.setProperty("--checkout-button-text-color", (customizationProps === null || customizationProps === void 0 ? void 0 : customizationProps.buttonTextColor) || "#FFFFFF");
@@ -70539,7 +70530,7 @@ var CheckoutPage = function (_a) {
     }); }, []);
     if (!checkout)
         return createElement(FullscreenLoading, null);
-    return (createElement(IkasCheckoutPage$1, __assign({ checkout: checkout, checkoutSettings: checkoutSettings, customizationProps: customizationProps }, others)));
+    return (createElement(IkasCheckoutPage$1, __assign({ checkout: checkout, merchantSettings: merchantSettings, checkoutSettings: checkoutSettings, customizationProps: customizationProps }, others)));
 };
 var checkout = observer(CheckoutPage);
 var getStaticProps$3 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
@@ -70557,15 +70548,10 @@ var checkout$1 = /*#__PURE__*/Object.freeze({
     getStaticProps: getStaticProps$3
 });
 
-var Page$3 = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$3 = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var index$3 = observer(Page$3);
 var getStaticProps$4 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70575,21 +70561,16 @@ var getStaticProps$4 = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var index$3 = /*#__PURE__*/Object.freeze({
+var index$4 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$3,
+    'default': index$3,
     getStaticProps: getStaticProps$4
 });
 
-var Page$4 = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$4 = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var addresses = observer(Page$4);
 var getStaticProps$5 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70599,21 +70580,16 @@ var getStaticProps$5 = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var addresses = /*#__PURE__*/Object.freeze({
+var addresses$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$4,
+    'default': addresses,
     getStaticProps: getStaticProps$5
 });
 
-var Page$5 = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$5 = function (props) {
+    return createElement(IkasPage, __assign({}, props, { addOgpMetas: true }));
 };
+var index$5 = observer(Page$5);
 var getStaticProps$6 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70623,21 +70599,16 @@ var getStaticProps$6 = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var index$4 = /*#__PURE__*/Object.freeze({
+var index$6 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$5,
+    'default': index$5,
     getStaticProps: getStaticProps$6
 });
 
-var Page$6 = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$6 = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var _id_ = observer(Page$6);
 var getServerSideProps = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70647,21 +70618,16 @@ var getServerSideProps = function (context) { return __awaiter(void 0, void 0, v
     });
 }); };
 
-var _id_ = /*#__PURE__*/Object.freeze({
+var _id_$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$6,
+    'default': _id_,
     getServerSideProps: getServerSideProps
 });
 
-var Page$7 = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { merchantSettings: merchantSettings, settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$7 = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var login = observer(Page$7);
 var getStaticProps$7 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70671,21 +70637,16 @@ var getStaticProps$7 = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var login = /*#__PURE__*/Object.freeze({
+var login$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$7,
+    'default': login,
     getStaticProps: getStaticProps$7
 });
 
-var Page$8 = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { merchantSettings: merchantSettings, settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$8 = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var register = observer(Page$8);
 var getStaticProps$8 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70695,21 +70656,16 @@ var getStaticProps$8 = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var register = /*#__PURE__*/Object.freeze({
+var register$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$8,
+    'default': register,
     getStaticProps: getStaticProps$8
 });
 
-var Page$9 = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { merchantSettings: merchantSettings, settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$9 = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var forgotPassword = observer(Page$9);
 var getStaticProps$9 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70719,21 +70675,16 @@ var getStaticProps$9 = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var forgotPassword = /*#__PURE__*/Object.freeze({
+var forgotPassword$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$9,
+    'default': forgotPassword,
     getStaticProps: getStaticProps$9
 });
 
-var Page$a = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { merchantSettings: merchantSettings, settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$a = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var recoverPassword = observer(Page$a);
 var getStaticProps$a = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70743,25 +70694,16 @@ var getStaticProps$a = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var recoverPassword = /*#__PURE__*/Object.freeze({
+var recoverPassword$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$a,
+    'default': recoverPassword,
     getStaticProps: getStaticProps$a
 });
 
-var Page$b = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    var store = IkasStorefrontConfig.store;
-    useEffect(function () {
-        Analytics.viewCart(store.cartStore.cart);
-    }, []);
-    return (createElement(IkasPage, { settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$b = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var cart = observer(Page$b);
 var getStaticProps$b = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70771,9 +70713,9 @@ var getStaticProps$b = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var cart = /*#__PURE__*/Object.freeze({
+var cart$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$b,
+    'default': cart,
     getStaticProps: getStaticProps$b
 });
 
@@ -70801,15 +70743,10 @@ var editor$1 = /*#__PURE__*/Object.freeze({
     'default': editor
 });
 
-var Page$d = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { settingsStr: settingsStr, page: page, propValues: propValues }));
+var Page$d = function (props) {
+    return createElement(IkasPage, __assign({}, props));
 };
+var favoriteProducts = observer(Page$d);
 var getStaticProps$d = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70819,29 +70756,16 @@ var getStaticProps$d = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var favoriteProducts = /*#__PURE__*/Object.freeze({
+var favoriteProducts$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$d,
+    'default': favoriteProducts,
     getStaticProps: getStaticProps$d
 });
 
-var Page$e = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var _b = useState(false), isBrowser = _b[0], setIsBrowser = _b[1];
-    var initialPropValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    var _c = useState(initialPropValues), propValues = _c[0], setPropValues = _c[1];
-    useEffect(function () {
-        setIsBrowser(typeof window !== "undefined");
-    }, []);
-    useEffect(function () {
-        setPropValues(IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr, isBrowser));
-    }, [isBrowser, propValuesStr]);
-    return (createElement(IkasPage, { merchantSettings: merchantSettings, settingsStr: settingsStr, page: page, propValues: propValues, addOgpMetas: true }));
+var Page$e = function (props) {
+    return createElement(IkasPage, __assign({}, props, { addOgpMetas: true, reInitOnBrowser: true }));
 };
+var search = observer(Page$e);
 var getStaticProps$e = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70851,22 +70775,16 @@ var getStaticProps$e = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var search = /*#__PURE__*/Object.freeze({
+var search$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$e,
+    'default': search,
     getStaticProps: getStaticProps$e
 });
 
-var Page$f = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    if (!propValuesStr || !page)
+var Page$f = function (props) {
+    if (!props.propValuesStr)
         return createElement(Error$1, { statusCode: 404 });
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { merchantSettings: merchantSettings, settingsStr: settingsStr, page: page, propValues: propValues }));
+    return createElement(IkasPage, __assign({}, props));
 };
 var getStaticProps$f = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     var props;
@@ -70893,15 +70811,10 @@ var _404 = /*#__PURE__*/Object.freeze({
     getStaticProps: getStaticProps$f
 });
 
-var Page$g = function (_a) {
-    var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var propValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    return (createElement(IkasPage, { merchantSettings: merchantSettings, settingsStr: settingsStr, page: page, propValues: propValues, addOgpMetas: true }));
+var Page$g = function (props) {
+    return createElement(IkasPage, __assign({}, props, { addOgpMetas: true }));
 };
+var index$7 = observer(Page$g);
 var getStaticProps$g = function (context) { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         switch (_a.label) {
@@ -70911,31 +70824,17 @@ var getStaticProps$g = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var index$5 = /*#__PURE__*/Object.freeze({
+var index$8 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': Page$g,
+    'default': index$7,
     getStaticProps: getStaticProps$g
 });
 
-var Page$h = function (_a) {
-    var page = _a.page, pageSpecificDataStr = _a.pageSpecificDataStr, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr, merchantSettings = _a.merchantSettings, configJson = _a.configJson;
-    IkasStorefrontConfig.initWithJson(configJson);
-    var router = useRouter();
-    var _b = useState(false), isBrowser = _b[0], setIsBrowser = _b[1];
-    var initialPropValues = useMemo(function () {
-        return IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr);
-    }, [propValuesStr]);
-    var _c = useState(initialPropValues), propValues = _c[0], setPropValues = _c[1];
-    useEffect(function () {
-        setIsBrowser(typeof window !== "undefined");
-    }, []);
-    useEffect(function () {
-        setPropValues(IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr, isBrowser));
-    }, [isBrowser, propValuesStr]);
-    return (createElement(IkasPage, { page: page, propValues: propValues, pageSpecificDataStr: pageSpecificDataStr, settingsStr: settingsStr, merchantSettings: merchantSettings, addOgpMetas: true }));
+var Page$h = function (props) {
+    return createElement(IkasPage, __assign({}, props, { addOgpMetas: true, reInitOnBrowser: true }));
 };
-var _slug_$1 = observer(Page$h);
-var getStaticPaths$2 = function (context) { return __awaiter(void 0, void 0, void 0, function () {
+var _slug_$2 = observer(Page$h);
+var getStaticPaths$2 = function () { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         return [2 /*return*/, {
                 paths: [],
@@ -70955,9 +70854,9 @@ var getStaticProps$h = function (context) { return __awaiter(void 0, void 0, voi
     });
 }); };
 
-var _slug_$2 = /*#__PURE__*/Object.freeze({
+var _slug_$3 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    'default': _slug_$1,
+    'default': _slug_$2,
     getStaticPaths: getStaticPaths$2,
     getStaticProps: getStaticProps$h
 });
@@ -71291,4 +71190,4 @@ var en$1 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.assign(/*#__PURE__*/Ob
     'default': en
 }));
 
-export { AccountInfoForm, index$3 as AccountPage, AddressForm, addresses as AddressesPage, Analytics, AnalyticsBody, AnalyticsHead, index$5 as BlogPage, _slug_$2 as BlogSlugPage, cart as CartPage, checkout$1 as CheckoutPage, ContactForm, _slug_ as CustomPage, editor$1 as EditorPage, EmailRule, EqualsRule, favoriteProducts as FavoriteProductsPage, ForgotPasswordForm, forgotPassword as ForgotPasswordPage, IkasAmountTypeEnum$1 as IkasAmountTypeEnum, IkasApplicableProductFilterValue, IkasBaseStore, IkasBlog, IkasBlogAPI, IkasBlogCategory, IkasBlogCategoryList, IkasBlogCategoryListPropValue, IkasBlogCategoryListType, IkasBlogCategoryPropValue, IkasBlogContent, IkasBlogList, IkasBlogListPropValue, IkasBlogListType, IkasBlogMetaData, IkasBlogMetadataTargetType, IkasBlogPropValue, IkasBlogTag, IkasBlogWriter, IkasBrand, IkasBrandAPI, IkasBrandList, IkasBrandListPropValue, IkasBrandListSortType, IkasBrandListType, IkasBrandPropValue, IkasCardAssociation, IkasCardType, IkasCartAPI, IkasCategory, IkasCategoryAPI, IkasCategoryList, IkasCategoryListPropValue, IkasCategoryListSortType, IkasCategoryListType, IkasCategoryPropValue, IkasCheckout, IkasCheckoutAPI, IkasCheckoutRecoveryEmailStatus, IkasCheckoutRecoveryStatus, IkasCheckoutStatus, IkasCityAPI, IkasComponentRenderer, IkasContactForm, IkasContactFormAPI, IkasCountryAPI, IkasCustomer, IkasCustomerAPI, IkasCustomerAddress, IkasDistrictAPI, IkasFavoriteProduct, IkasFavoriteProductAPI, IkasHTMLMetaData, IkasHTMLMetaDataAPI, IkasHTMLMetaDataTargetType, IkasImage, IkasLinkPropValue, IkasLinkType, IkasMerchantAPI, IkasMerchantSettings, IkasNavigationLink, IkasOrder, IkasOrderCancelledReason, IkasOrderLineItem, IkasOrderPackageFulfillStatus, IkasOrderPackageStatus, IkasOrderPaymentStatus, IkasOrderRefundSettings, IkasOrderShippingMethod, IkasOrderStatus, IkasOrderTransaction, IkasPage, IkasPageComponentPropValue, IkasPageDataProvider, IkasPageEditor, IkasPageHead, IkasPaymentMethod, IkasProduct, IkasProductAttribute, IkasProductAttributeAPI, IkasProductAttributeType, IkasProductAttributeValue, IkasProductDetail, IkasProductDetailPropValue, IkasProductFilter, IkasProductFilterDisplayType, IkasProductFilterSettings, IkasProductFilterSortType, IkasProductFilterType, IkasProductFilterValue, IkasProductList, IkasProductListPropValue, IkasProductListSortType, IkasProductListType, IkasProductPrice, IkasProductSearchAPI, IkasProductType, IkasProductVariant, IkasProductVariantType, IkasShippingMethod, IkasShippingMethodEnum, IkasStateAPI, IkasStorefrontConfig, IkasTheme, IkasThemeComponent, IkasThemeComponentProp, IkasThemeComponentPropType, IkasThemeCustomData, IkasThemePage, IkasThemePageComponent, IkasThemePageType, IkasThemeSettings, IkasTransactionStatusEnum, IkasTransactionTypeEnum, IkasVariantSelectionType, IkasVariantType, IkasVariantTypeAPI, IkasVariantValue, Image, home as IndexPage, LessThanRule, LoginForm, login as LoginPage, MaxRule, MinRule, _404 as NotFoundPage, _id_ as OrderDetailPage, OrderLineItemStatusEnum$1 as OrderLineItemStatusEnum, index$4 as OrdersPage, PhoneRule, RangeValue, RecoverPasswordForm, recoverPassword as RecoverPasswordPage, RegisterForm, register as RegisterPage, RequiredRule, search as SearchPage, index$2 as SlugPage, ValidationRule, Validator, ValidatorErrorType, apollo, createTranslationInputData, decodeBase64, findAllIndexes, formatDate, formatMoney, getPlaceholderBlog, getPlaceholderBlogCategory, getPlaceholderBrand, getPlaceholderCategory, getPlaceholderProduct, parseRangeStr, pascalCase, stringSorter, stringToSlug, useTranslation, validatePhoneNumber };
+export { AccountInfoForm, index$4 as AccountPage, AddressForm, addresses$1 as AddressesPage, Analytics, AnalyticsBody, AnalyticsHead, index$8 as BlogPage, _slug_$3 as BlogSlugPage, cart$1 as CartPage, checkout$1 as CheckoutPage, ContactForm, _slug_$1 as CustomPage, editor$1 as EditorPage, EmailRule, EqualsRule, favoriteProducts$1 as FavoriteProductsPage, ForgotPasswordForm, forgotPassword$1 as ForgotPasswordPage, IkasAmountTypeEnum$1 as IkasAmountTypeEnum, IkasApplicableProductFilterValue, IkasBaseStore, IkasBlog, IkasBlogAPI, IkasBlogCategory, IkasBlogCategoryList, IkasBlogCategoryListPropValue, IkasBlogCategoryListType, IkasBlogCategoryPropValue, IkasBlogContent, IkasBlogList, IkasBlogListPropValue, IkasBlogListType, IkasBlogMetaData, IkasBlogMetadataTargetType, IkasBlogPropValue, IkasBlogTag, IkasBlogWriter, IkasBrand, IkasBrandAPI, IkasBrandList, IkasBrandListPropValue, IkasBrandListSortType, IkasBrandListType, IkasBrandPropValue, IkasCardAssociation, IkasCardType, IkasCartAPI, IkasCategory, IkasCategoryAPI, IkasCategoryList, IkasCategoryListPropValue, IkasCategoryListSortType, IkasCategoryListType, IkasCategoryPropValue, IkasCheckout, IkasCheckoutAPI, IkasCheckoutRecoveryEmailStatus, IkasCheckoutRecoveryStatus, IkasCheckoutStatus, IkasCityAPI, IkasComponentRenderer, IkasContactForm, IkasContactFormAPI, IkasCountryAPI, IkasCustomer, IkasCustomerAPI, IkasCustomerAddress, IkasDistrictAPI, IkasFavoriteProduct, IkasFavoriteProductAPI, IkasHTMLMetaData, IkasHTMLMetaDataAPI, IkasHTMLMetaDataTargetType, IkasImage, IkasLinkPropValue, IkasLinkType, IkasMerchantAPI, IkasMerchantSettings, IkasNavigationLink, IkasOrder, IkasOrderCancelledReason, IkasOrderLineItem, IkasOrderPackageFulfillStatus, IkasOrderPackageStatus, IkasOrderPaymentStatus, IkasOrderRefundSettings, IkasOrderShippingMethod, IkasOrderStatus, IkasOrderTransaction, IkasPage, IkasPageComponentPropValue, IkasPageDataProvider, IkasPageEditor, IkasPageHead, IkasPaymentMethod, IkasProduct, IkasProductAttribute, IkasProductAttributeAPI, IkasProductAttributeType, IkasProductAttributeValue, IkasProductDetail, IkasProductDetailPropValue, IkasProductFilter, IkasProductFilterDisplayType, IkasProductFilterSettings, IkasProductFilterSortType, IkasProductFilterType, IkasProductFilterValue, IkasProductList, IkasProductListPropValue, IkasProductListSortType, IkasProductListType, IkasProductPrice, IkasProductSearchAPI, IkasProductType, IkasProductVariant, IkasProductVariantType, IkasShippingMethod, IkasShippingMethodEnum, IkasStateAPI, IkasStorefrontConfig, IkasTheme, IkasThemeComponent, IkasThemeComponentProp, IkasThemeComponentPropType, IkasThemeCustomData, IkasThemePage, IkasThemePageComponent, IkasThemePageType, IkasThemeSettings, IkasTransactionStatusEnum, IkasTransactionTypeEnum, IkasVariantSelectionType, IkasVariantType, IkasVariantTypeAPI, IkasVariantValue, Image, home$1 as IndexPage, LessThanRule, LoginForm, login$1 as LoginPage, MaxRule, MinRule, _404 as NotFoundPage, _id_$1 as OrderDetailPage, OrderLineItemStatusEnum$1 as OrderLineItemStatusEnum, index$6 as OrdersPage, PhoneRule, RangeValue, RecoverPasswordForm, recoverPassword$1 as RecoverPasswordPage, RegisterForm, register$1 as RegisterPage, RequiredRule, search$1 as SearchPage, index$2 as SlugPage, ValidationRule, Validator, ValidatorErrorType, apollo, createTranslationInputData, decodeBase64, findAllIndexes, formatDate, formatMoney, getPlaceholderBlog, getPlaceholderBlogCategory, getPlaceholderBrand, getPlaceholderCategory, getPlaceholderProduct, parseRangeStr, pascalCase, stringSorter, stringToSlug, useTranslation, validatePhoneNumber };