@ikas/storefront 0.0.167-alpha.20 → 0.0.167-alpha.3

package/build/index.es.js

@@ -11446,15 +11446,12 @@ var IkasOrderLineVariant = /** @class */ (function () {
         get: function () {
             if (!this.slug)
                 return;
-            var variantParams = this.variantValues
-                .map(function (vv) {
-                return vv.variantTypeSlug + "=" + vv.variantNameSlug;
-            })
-                .join("&");
-            if (variantParams)
-                return "/" + this.slug + "?" + variantParams;
-            else
-                return "/" + this.slug;
+            if (!!this.variantValues.length) {
+                return "/" + this.slug + "-" + this.variantValues
+                    .map(function (vv) { return vv.variantNameSlug; })
+                    .join("-");
+            }
+            return "/" + this.slug;
         },
         enumerable: false,
         configurable: true
@@ -17885,7 +17882,7 @@ var FacebookPixel = /** @class */ (function () {
         try {
             !isServer &&
                 window.fbq &&
-                window.fbq("track", "AddToCart", orderLineItemToFBPItem(item, quantity), { eventID: eventId });
+                window.fbq("track", "AddToCart", orderLineItemToFBPItem(item, quantity), { eventId: eventId });
             return;
         }
         catch (err) {
@@ -17907,7 +17904,7 @@ var FacebookPixel = /** @class */ (function () {
         try {
             !isServer &&
                 window.fbq &&
-                window.fbq("track", "Purchase", beginCheckoutFBPItem(checkout), { eventID: eventId });
+                window.fbq("track", "Purchase", beginCheckoutFBPItem(checkout), { eventId: eventId });
             return;
         }
         catch (err) {
@@ -23612,7 +23609,11 @@ var CheckoutViewModel = /** @class */ (function () {
         this.changeStep = function (step) { return __awaiter(_this, void 0, void 0, function () {
             return __generator(this, function (_a) {
                 if (!isServer$1) {
-                    window.location.replace(window.location.pathname + "?id=" + this.checkout.id + "&step=" + step);
+                    window.location.replace("/checkout?id=" + this.checkout.id + "&step=" + step);
+                    // await this.router.replace(
+                    //   `/checkout?id=${this.checkout.id}&step=${step}`
+                    // );
+                    // this.router.reload();
                 }
                 return [2 /*return*/];
             });
@@ -32295,10 +32296,10 @@ var AnalyticsHead = function (_a) {
         blockHTML && (createElement("script", { dangerouslySetInnerHTML: {
                 __html: "dataLayer = [{'gtm.blocklist': ['html']}];",
             } })),
-        gtmId && (createElement("script", { defer: true, dangerouslySetInnerHTML: {
+        gtmId && (createElement("script", { dangerouslySetInnerHTML: {
                 __html: "(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':\n              new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],\n              j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=\n              'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);\n              })(window,document,'script','dataLayer','" + gtmId + "');",
             } })),
-        fbpId && (createElement("script", { defer: true, dangerouslySetInnerHTML: {
+        fbpId && (createElement("script", { dangerouslySetInnerHTML: {
                 __html: "!function(f,b,e,v,n,t,s)\n          {if(f.fbq)return;n=f.fbq=function(){n.callMethod?\n          n.callMethod.apply(n,arguments):n.queue.push(arguments)};\n          if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';\n          n.queue=[];t=b.createElement(e);t.async=!0;\n          t.src=v;s=b.getElementsByTagName(e)[0];\n          s.parentNode.insertBefore(t,s)}(window, document,'script',\n          'https://connect.facebook.net/en_US/fbevents.js');\n          fbq('init', '" + fbpId + "');\n          fbq('track', 'PageView');",
             } })),
         storefrontJSScripts.map(function (script) { return htmlReactParser(script); })));
@@ -41466,14 +41467,18 @@ var IkasPage = observer(function (_a) {
     IkasStorefrontConfig.initWithJson(configJson);
     var store = IkasStorefrontConfig.store;
     var router = useRouter();
-    var _b = useState(false), isBrowser = _b[0], setIsBrowser = _b[1];
+    var _b = useState(false), mounted = _b[0], setMounted = _b[1];
+    var _c = useState(false), isBrowser = _c[0], setIsBrowser = _c[1];
     var settings = useState(new IkasThemeSettings(JSON.parse(settingsStr)))[0];
-    var _c = useState(IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr)), propValues = _c[0], setPropValues = _c[1];
+    var _d = useState(IkasPageDataProvider.initPropValues(propValuesStr, router, settingsStr)), propValues = _d[0], setPropValues = _d[1];
     store.currentPageType = pageType;
     useEffect(function () {
+        //@ts-ignore
+        store.setSettings(settingsStr);
         //@ts-ignore
         store.cartStore.getCart();
         store.checkLocalization();
+        setMounted(true);
     }, []);
     useEffect(function () {
         if (reInitOnBrowser)
@@ -41487,6 +41492,7 @@ var IkasPage = observer(function (_a) {
     var footerComponentPropValue = propValues.find(function (pv) { return pv.component.isFooter; });
     var others = propValues.filter(function (pv) { return !pv.component.isHeader && !pv.component.isFooter; }) || [];
     var pageStyle = {
+        visibility: mounted ? "visible" : "hidden",
         position: "relative",
         minHeight: "100vh",
         display: "flex",
@@ -69912,7 +69918,6 @@ var ThemeEditorComponent = observer(function (_a) {
                 }),
             }),
             checkoutSettings: new IkasCheckoutSettings(),
-            merchantSettings: null,
             customizationProps: __assign({}, propValues),
             returnPolicy: "",
             privacyPolicy: "",
@@ -70121,7 +70126,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, colorScript, settings, storefront_1, salesChannel_1, localizationMap, storefrontJSScripts_1, domain_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:
@@ -70140,7 +70145,6 @@ var SettingsHelper = /** @class */ (function () {
                         return [4 /*yield*/, SettingsHelper.readLocalTheme()];
                     case 2:
                         localTheme = _a.sent();
-                        colorScript = SettingsHelper.createColorScript(localTheme.settings);
                         resolve({
                             storefront: storefront,
                             themeLocalization: new IkasStorefrontThemeLocalization({
@@ -70155,7 +70159,7 @@ var SettingsHelper = /** @class */ (function () {
                                 : new IkasStorefrontRouting({}),
                             favicon: localTheme.settings.favicon,
                             stockPreference: localTheme.settings.stockPreference,
-                            storefrontJSScripts: colorScript ? [colorScript] : [],
+                            storefrontJSScripts: [],
                             domain: "",
                         });
                         return [3 /*break*/, 5];
@@ -70187,11 +70191,6 @@ var SettingsHelper = /** @class */ (function () {
                             var themeLocalization = new IkasStorefrontThemeLocalization(result);
                             var favicon = themeLocalization.themeJson.settings.favicon;
                             var stockPreference = themeLocalization.themeJson.settings.stockPreference;
-                            if (themeLocalization.themeJson.settings) {
-                                var colorScript = SettingsHelper.createColorScript(themeLocalization.themeJson.settings);
-                                if (colorScript)
-                                    storefrontJSScripts_1.push(colorScript);
-                            }
                             resolve({
                                 storefront: storefront_1,
                                 themeLocalization: themeLocalization,
@@ -70352,15 +70351,6 @@ var SettingsHelper = /** @class */ (function () {
             });
         });
     };
-    SettingsHelper.createColorScript = function (settings) {
-        if (!settings.colors)
-            return;
-        return "<script>" + settings.colors
-            .map(function (sc) {
-            return "document.documentElement.style.setProperty(\"" + sc.key + "\",\"" + sc.color + "\");";
-        })
-            .join("\r\n") + "</script> \n    ";
-    };
     return SettingsHelper;
 }());
 

package/build/index.js

@@ -11462,15 +11462,12 @@ var IkasOrderLineVariant = /** @class */ (function () {
         get: function () {
             if (!this.slug)
                 return;
-            var variantParams = this.variantValues
-                .map(function (vv) {
-                return vv.variantTypeSlug + "=" + vv.variantNameSlug;
-            })
-                .join("&");
-            if (variantParams)
-                return "/" + this.slug + "?" + variantParams;
-            else
-                return "/" + this.slug;
+            if (!!this.variantValues.length) {
+                return "/" + this.slug + "-" + this.variantValues
+                    .map(function (vv) { return vv.variantNameSlug; })
+                    .join("-");
+            }
+            return "/" + this.slug;
         },
         enumerable: false,
         configurable: true
@@ -17893,7 +17890,7 @@ var FacebookPixel = /** @class */ (function () {
         try {
             !isServer &&
                 window.fbq &&
-                window.fbq("track", "AddToCart", orderLineItemToFBPItem(item, quantity), { eventID: eventId });
+                window.fbq("track", "AddToCart", orderLineItemToFBPItem(item, quantity), { eventId: eventId });
             return;
         }
         catch (err) {
@@ -17915,7 +17912,7 @@ var FacebookPixel = /** @class */ (function () {
         try {
             !isServer &&
                 window.fbq &&
-                window.fbq("track", "Purchase", beginCheckoutFBPItem(checkout), { eventID: eventId });
+                window.fbq("track", "Purchase", beginCheckoutFBPItem(checkout), { eventId: eventId });
             return;
         }
         catch (err) {
@@ -23620,7 +23617,11 @@ var CheckoutViewModel = /** @class */ (function () {
         this.changeStep = function (step) { return __awaiter(_this, void 0, void 0, function () {
             return __generator(this, function (_a) {
                 if (!isServer$1) {
-                    window.location.replace(window.location.pathname + "?id=" + this.checkout.id + "&step=" + step);
+                    window.location.replace("/checkout?id=" + this.checkout.id + "&step=" + step);
+                    // await this.router.replace(
+                    //   `/checkout?id=${this.checkout.id}&step=${step}`
+                    // );
+                    // this.router.reload();
                 }
                 return [2 /*return*/];
             });
@@ -32303,10 +32304,10 @@ var AnalyticsHead = function (_a) {
         blockHTML && (React.createElement("script", { dangerouslySetInnerHTML: {
                 __html: "dataLayer = [{'gtm.blocklist': ['html']}];",
             } })),
-        gtmId && (React.createElement("script", { defer: true, dangerouslySetInnerHTML: {
+        gtmId && (React.createElement("script", { dangerouslySetInnerHTML: {
                 __html: "(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':\n              new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],\n              j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=\n              'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);\n              })(window,document,'script','dataLayer','" + gtmId + "');",
             } })),
-        fbpId && (React.createElement("script", { defer: true, dangerouslySetInnerHTML: {
+        fbpId && (React.createElement("script", { dangerouslySetInnerHTML: {
                 __html: "!function(f,b,e,v,n,t,s)\n          {if(f.fbq)return;n=f.fbq=function(){n.callMethod?\n          n.callMethod.apply(n,arguments):n.queue.push(arguments)};\n          if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';\n          n.queue=[];t=b.createElement(e);t.async=!0;\n          t.src=v;s=b.getElementsByTagName(e)[0];\n          s.parentNode.insertBefore(t,s)}(window, document,'script',\n          'https://connect.facebook.net/en_US/fbevents.js');\n          fbq('init', '" + fbpId + "');\n          fbq('track', 'PageView');",
             } })),
         storefrontJSScripts.map(function (script) { return htmlReactParser(script); })));
@@ -41446,14 +41447,18 @@ var IkasPage = mobxReactLite.observer(function (_a) {
     IkasStorefrontConfig.initWithJson(configJson);
     var store = IkasStorefrontConfig.store;
     var router$1 = router.useRouter();
-    var _b = React.useState(false), isBrowser = _b[0], setIsBrowser = _b[1];
+    var _b = React.useState(false), mounted = _b[0], setMounted = _b[1];
+    var _c = React.useState(false), isBrowser = _c[0], setIsBrowser = _c[1];
     var settings = React.useState(new IkasThemeSettings(JSON.parse(settingsStr)))[0];
-    var _c = React.useState(IkasPageDataProvider.initPropValues(propValuesStr, router$1, settingsStr)), propValues = _c[0], setPropValues = _c[1];
+    var _d = React.useState(IkasPageDataProvider.initPropValues(propValuesStr, router$1, settingsStr)), propValues = _d[0], setPropValues = _d[1];
     store.currentPageType = pageType;
     React.useEffect(function () {
+        //@ts-ignore
+        store.setSettings(settingsStr);
         //@ts-ignore
         store.cartStore.getCart();
         store.checkLocalization();
+        setMounted(true);
     }, []);
     React.useEffect(function () {
         if (reInitOnBrowser)
@@ -41467,6 +41472,7 @@ var IkasPage = mobxReactLite.observer(function (_a) {
     var footerComponentPropValue = propValues.find(function (pv) { return pv.component.isFooter; });
     var others = propValues.filter(function (pv) { return !pv.component.isHeader && !pv.component.isFooter; }) || [];
     var pageStyle = {
+        visibility: mounted ? "visible" : "hidden",
         position: "relative",
         minHeight: "100vh",
         display: "flex",
@@ -69891,7 +69897,6 @@ var ThemeEditorComponent = mobxReactLite.observer(function (_a) {
                 }),
             }),
             checkoutSettings: new IkasCheckoutSettings(),
-            merchantSettings: null,
             customizationProps: __assign({}, propValues),
             returnPolicy: "",
             privacyPolicy: "",
@@ -70100,7 +70105,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, colorScript, settings, storefront_1, salesChannel_1, localizationMap, storefrontJSScripts_1, domain_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:
@@ -70119,7 +70124,6 @@ var SettingsHelper = /** @class */ (function () {
                         return [4 /*yield*/, SettingsHelper.readLocalTheme()];
                     case 2:
                         localTheme = _a.sent();
-                        colorScript = SettingsHelper.createColorScript(localTheme.settings);
                         resolve({
                             storefront: storefront,
                             themeLocalization: new IkasStorefrontThemeLocalization({
@@ -70134,7 +70138,7 @@ var SettingsHelper = /** @class */ (function () {
                                 : new IkasStorefrontRouting({}),
                             favicon: localTheme.settings.favicon,
                             stockPreference: localTheme.settings.stockPreference,
-                            storefrontJSScripts: colorScript ? [colorScript] : [],
+                            storefrontJSScripts: [],
                             domain: "",
                         });
                         return [3 /*break*/, 5];
@@ -70166,11 +70170,6 @@ var SettingsHelper = /** @class */ (function () {
                             var themeLocalization = new IkasStorefrontThemeLocalization(result);
                             var favicon = themeLocalization.themeJson.settings.favicon;
                             var stockPreference = themeLocalization.themeJson.settings.stockPreference;
-                            if (themeLocalization.themeJson.settings) {
-                                var colorScript = SettingsHelper.createColorScript(themeLocalization.themeJson.settings);
-                                if (colorScript)
-                                    storefrontJSScripts_1.push(colorScript);
-                            }
                             resolve({
                                 storefront: storefront_1,
                                 themeLocalization: themeLocalization,
@@ -70331,15 +70330,6 @@ var SettingsHelper = /** @class */ (function () {
             });
         });
     };
-    SettingsHelper.createColorScript = function (settings) {
-        if (!settings.colors)
-            return;
-        return "<script>" + settings.colors
-            .map(function (sc) {
-            return "document.documentElement.style.setProperty(\"" + sc.key + "\",\"" + sc.color + "\");";
-        })
-            .join("\r\n") + "</script> \n    ";
-    };
     return SettingsHelper;
 }());
 

package/build/utils/settings.d.ts

@@ -7,7 +7,7 @@ import { IkasSalesChannel } from "../models/data/sales-channel/index";
 import { IkasStorefrontRouting } from "../models/data/storefront/routing/index";
 import { IkasStorefrontThemeLocalization } from "../models/data/storefront/theme-localization/index";
 import { IkasThemeFavicon } from "../models/theme/settings/prop/favicon/index";
-import { IkasThemeSettings, IkasThemeStockPreference } from "../models/theme/settings/index";
+import { IkasThemeStockPreference } from "../models/theme/settings/index";
 export declare class SettingsHelper {
     static readLocalTheme(): Promise<IkasTheme>;
     static readSettingsFile(): Promise<any>;
@@ -213,7 +213,6 @@ export declare class SettingsHelper {
         notFound?: undefined;
         revalidate?: undefined;
     }>;
-    static createColorScript(settings: IkasThemeSettings): string | undefined;
 }
 export declare type SettingsData = {
     storefront: IkasStorefront;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ikas/storefront",
-  "version": "0.0.167-alpha.20",
+  "version": "0.0.167-alpha.3",
   "main": "./build/index.js",
   "module": "./build/index.es.js",
   "author": "Umut Ozan Yıldırım",