npm - @athoscommerce/snap-preact - Versions diffs - 1.9.1 → 1.10.0 - Mend

@athoscommerce/snap-preact 1.9.1 → 1.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1771) hide show

package/dist/cjs/src/Templates/Stores/TemplateStore.js CHANGED Viewed

@@ -1,71 +1,22 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TemplatesStore = exports.TEMPLATE_STORE_KEY = void 0;
 exports.transformTranslationsToTheme = transformTranslationsToTheme;
-var mobx_1 = require("mobx");
-var snap_toolbox_1 = require("@athoscommerce/snap-toolbox");
-var ThemeStore_1 = require("./ThemeStore");
-var TargetStore_1 = require("./TargetStore");
-var LibraryStore_1 = require("./LibraryStore");
-var snap_toolbox_2 = require("@athoscommerce/snap-toolbox");
-var RESIZE_DEBOUNCE = 100;
+const mobx_1 = require("mobx");
+const snap_toolbox_1 = require("@athoscommerce/snap-toolbox");
+const ThemeStore_1 = require("./ThemeStore");
+const TargetStore_1 = require("./TargetStore");
+const LibraryStore_1 = require("./LibraryStore");
+const snap_toolbox_2 = require("@athoscommerce/snap-toolbox");
+const RESIZE_DEBOUNCE = 100;
 exports.TEMPLATE_STORE_KEY = 'athos-templates';
-var TemplatesStore = /** @class */ (function () {
-    function TemplatesStore(params) {
-        var _this = this;
-        var _a, _b, _c;
+class TemplatesStore {
+    constructor(params) {
         this.loading = false;
         this.window = { innerWidth: 0 };
-        var _d = params || {}, config = _d.config, settings = _d.settings;
+        const { config, settings } = params || {};
         this.config = config;
-        this.platform = ((_a = config.config) === null || _a === void 0 ? void 0 : _a.platform) || 'other';
+        this.platform = config.config?.platform || 'other';
         this.storage = new snap_toolbox_1.StorageStore({ type: snap_toolbox_1.StorageType.local, key: exports.TEMPLATE_STORE_KEY });
         this.dependencies = {
             storage: this.storage,
@@ -87,41 +38,41 @@ var TemplatesStore = /** @class */ (function () {
         this.library = new LibraryStore_1.LibraryStore({ components: config.components, unlocked: config.unlocked || false });
         this.language =
             (this.settings.editMode && this.storage.get('overrides.config.language')) ||
-                (((_b = this.config.config) === null || _b === void 0 ? void 0 : _b.language) && this.config.config.language in this.library.import.language && this.config.config.language) ||
+                (this.config.config?.language && this.config.config.language in this.library.import.language && this.config.config.language) ||
                 'en';
         this.currency =
             (this.settings.editMode && this.storage.get('overrides.config.currency')) ||
-                (((_c = this.config.config) === null || _c === void 0 ? void 0 : _c.currency) && this.config.config.currency in this.library.import.currency && this.config.config.currency) ||
+                (this.config.config?.currency && this.config.config.currency in this.library.import.currency && this.config.config.currency) ||
                 'usd';
         // import locale selections
-        var importCurrency = this.library.import.currency[this.currency]();
-        var importLanguage = this.library.import.language[this.language]();
+        const importCurrency = this.library.import.currency[this.currency]();
+        const importLanguage = this.library.import.language[this.language]();
         // configure window properties and add event listeners
         if (window) {
             this.setInnerWidth(window.innerWidth);
-            var debouncedHandleResize = (0, snap_toolbox_2.debounce)(function () {
-                _this.setInnerWidth(window.innerWidth);
+            const debouncedHandleResize = (0, snap_toolbox_2.debounce)(() => {
+                this.setInnerWidth(window.innerWidth);
             }, RESIZE_DEBOUNCE);
             window.addEventListener('resize', debouncedHandleResize);
         }
         // theme loading promise
         this.loading = true;
-        var themePromises = [];
+        const themePromises = [];
         // setup local themes
-        var themeConfiguration = config.theme;
+        const themeConfiguration = config.theme;
         // add promise
-        var themeDefer = new Deferred();
+        const themeDefer = new Deferred();
         themePromises.push(themeDefer.promise);
         // import theme dependencies
-        var themeImports = [importCurrency, importLanguage, this.library.import.theme[themeConfiguration.extends]()];
-        Promise.all(themeImports).then(function () {
-            var base = _this.library.themes[themeConfiguration.extends];
-            var overrides = themeConfiguration.overrides || {};
-            var variables = themeConfiguration.variables || {};
-            var currency = _this.library.locales.currencies[_this.currency] || {};
-            var language = _this.library.locales.languages[_this.language] || {};
-            var languageOverrides = transformTranslationsToTheme((_this.config.translations && _this.config.translations[_this.language]) || {});
-            var translatedOverrides = {
+        const themeImports = [importCurrency, importLanguage, this.library.import.theme[themeConfiguration.extends]()];
+        Promise.all(themeImports).then(() => {
+            const base = this.library.themes[themeConfiguration.extends];
+            const overrides = themeConfiguration.overrides || {};
+            const variables = themeConfiguration.variables || {};
+            const currency = this.library.locales.currencies[this.currency] || {};
+            const language = this.library.locales.languages[this.language] || {};
+            const languageOverrides = transformTranslationsToTheme((this.config.translations && this.config.translations[this.language]) || {});
+            const translatedOverrides = {
                 components: overrides.default,
                 responsive: {
                     mobile: overrides.mobile,
@@ -129,27 +80,27 @@ var TemplatesStore = /** @class */ (function () {
                     desktop: overrides.desktop,
                 },
             };
-            var themeConfig = {
+            const themeConfig = {
                 name: 'global',
                 style: themeConfiguration.style,
                 type: 'local',
-                base: base,
+                base,
                 overrides: translatedOverrides,
-                variables: variables,
-                currency: currency,
-                language: language,
-                languageOverrides: languageOverrides,
-                innerWidth: _this.window.innerWidth,
+                variables,
+                currency,
+                language,
+                languageOverrides,
+                innerWidth: this.window.innerWidth,
             };
-            if (_this.settings.editMode) {
-                var themeOverrides = _this.storage.get('overrides.theme.variables') || {};
+            if (this.settings.editMode) {
+                const themeOverrides = this.storage.get('overrides.theme.variables') || {};
                 themeConfig.editorOverrides = { variables: themeOverrides || {} };
             }
-            _this.addTheme(themeConfig);
+            this.addTheme(themeConfig);
             themeDefer.resolve();
         });
-        Promise.all(themePromises).then(function () {
-            _this.loading = false;
+        Promise.all(themePromises).then(() => {
+            this.loading = false;
         });
         (0, mobx_1.makeObservable)(this, {
             loading: mobx_1.observable,
@@ -157,149 +108,114 @@ var TemplatesStore = /** @class */ (function () {
             themes: mobx_1.observable,
         });
     }
-    TemplatesStore.prototype.addTarget = function (target) {
+    addTarget(target) {
         if (target.selector) {
-            var targetArray = getTargetArray(this.targets, target.type);
+            const targetArray = getTargetArray(this.targets, target.type);
             if (!targetArray) {
                 return;
             }
-            var newTarget = new TargetStore_1.TargetStore({
-                target: __assign(__assign({}, target), { index: targetArray.length }),
+            const newTarget = new TargetStore_1.TargetStore({
+                target: { ...target, index: targetArray.length },
             });
             targetArray.push(newTarget);
             return newTarget;
         }
-    };
-    TemplatesStore.prototype.getTarget = function (type, targetIndex) {
-        var _a;
-        return (_a = getTargetArray(this.targets, type)) === null || _a === void 0 ? void 0 : _a[targetIndex];
-    };
-    TemplatesStore.prototype.addTheme = function (config) {
-        var theme = new ThemeStore_1.ThemeStore({
-            config: config,
+    }
+    getTarget(type, targetIndex) {
+        return getTargetArray(this.targets, type)?.[targetIndex];
+    }
+    addTheme(config) {
+        const theme = new ThemeStore_1.ThemeStore({
+            config,
             dependencies: this.dependencies,
             settings: this.settings,
         });
-        var themeLocation = this.themes[config.type] || {};
+        const themeLocation = this.themes[config.type] || {};
         themeLocation[config.name] = theme;
-    };
-    TemplatesStore.prototype.setInnerWidth = function (innerWidth) {
+    }
+    setInnerWidth(innerWidth) {
         if (this.window.innerWidth === innerWidth)
             return;
         this.window.innerWidth = innerWidth;
-        for (var themeName in this.themes.local) {
-            var theme = this.themes.local[themeName];
+        for (const themeName in this.themes.local) {
+            const theme = this.themes.local[themeName];
             theme.setInnerWidth(this.window.innerWidth);
         }
-        for (var themeName in this.themes.library) {
-            var theme = this.themes.library[themeName];
+        for (const themeName in this.themes.library) {
+            const theme = this.themes.library[themeName];
             theme.setInnerWidth(this.window.innerWidth);
         }
-    };
-    TemplatesStore.prototype.getThemeStore = function (themeName) {
+    }
+    getThemeStore(themeName) {
         if (themeName) {
             return this.themes.local[themeName] || this.themes.library[themeName];
         }
-    };
-    TemplatesStore.prototype.setCurrency = function (currencyCode) {
-        return __awaiter(this, void 0, void 0, function () {
-            var currency, themeName, theme, themeName, theme;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        if (!(currencyCode in this.library.import.currency)) return [3 /*break*/, 2];
-                        return [4 /*yield*/, this.library.import.currency[currencyCode]()];
-                    case 1:
-                        _a.sent();
-                        currency = this.library.locales.currencies[currencyCode];
-                        if (currency) {
-                            this.currency = currencyCode;
-                            this.storage.set('overrides.config.currency', this.currency);
-                            for (themeName in this.themes.local) {
-                                theme = this.themes.local[themeName];
-                                theme.setCurrency(currency);
-                            }
-                            for (themeName in this.themes.library) {
-                                theme = this.themes.library[themeName];
-                                theme.setCurrency(currency);
-                            }
-                        }
-                        _a.label = 2;
-                    case 2: return [2 /*return*/];
+    }
+    async setCurrency(currencyCode) {
+        if (currencyCode in this.library.import.currency) {
+            await this.library.import.currency[currencyCode]();
+            const currency = this.library.locales.currencies[currencyCode];
+            if (currency) {
+                this.currency = currencyCode;
+                this.storage.set('overrides.config.currency', this.currency);
+                for (const themeName in this.themes.local) {
+                    const theme = this.themes.local[themeName];
+                    theme.setCurrency(currency);
                 }
-            });
-        });
-    };
-    TemplatesStore.prototype.setLanguage = function (languageCode) {
-        return __awaiter(this, void 0, void 0, function () {
-            var language, themeName, theme, themeName, theme;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        if (!(languageCode in this.library.import.language)) return [3 /*break*/, 2];
-                        return [4 /*yield*/, this.library.import.language[languageCode]()];
-                    case 1:
-                        _a.sent();
-                        language = this.library.locales.languages[languageCode];
-                        if (language) {
-                            this.language = languageCode;
-                            this.storage.set('overrides.config.language', this.language);
-                            for (themeName in this.themes.local) {
-                                theme = this.themes.local[themeName];
-                                theme.setLanguage(language);
-                            }
-                            for (themeName in this.themes.library) {
-                                theme = this.themes.library[themeName];
-                                theme.setLanguage(language);
-                            }
-                        }
-                        _a.label = 2;
-                    case 2: return [2 /*return*/];
+                for (const themeName in this.themes.library) {
+                    const theme = this.themes.library[themeName];
+                    theme.setCurrency(currency);
                 }
-            });
-        });
-    };
-    TemplatesStore.prototype.preLoad = function () {
-        return __awaiter(this, void 0, void 0, function () {
-            var themeName, theme, themeConfig, themeOverrides;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        // preload the library
-                        this.loading = true;
-                        return [4 /*yield*/, this.library.preLoad()];
-                    case 1:
-                        _a.sent();
-                        // build out the library themes
-                        this.themes.library = {};
-                        for (themeName in this.library.themes) {
-                            theme = this.library.themes[themeName];
-                            themeConfig = {
-                                name: themeName,
-                                type: 'library',
-                                base: theme,
-                                language: this.library.locales.languages[this.language] || {},
-                                languageOverrides: transformTranslationsToTheme((this.config.translations && this.config.translations[this.language]) || {}),
-                                currency: this.library.locales.currencies[this.currency] || {},
-                                innerWidth: this.window.innerWidth,
-                            };
-                            if (this.settings.editMode) {
-                                themeOverrides = this.storage.get('overrides.theme.variables') || {};
-                                themeConfig.editorOverrides = { variables: themeOverrides || {} };
-                            }
-                            this.addTheme(themeConfig);
-                        }
-                        this.loading = false;
-                        return [2 /*return*/];
+            }
+        }
+    }
+    async setLanguage(languageCode) {
+        if (languageCode in this.library.import.language) {
+            await this.library.import.language[languageCode]();
+            const language = this.library.locales.languages[languageCode];
+            if (language) {
+                this.language = languageCode;
+                this.storage.set('overrides.config.language', this.language);
+                for (const themeName in this.themes.local) {
+                    const theme = this.themes.local[themeName];
+                    theme.setLanguage(language);
                 }
-            });
-        });
-    };
-    return TemplatesStore;
-}());
+                for (const themeName in this.themes.library) {
+                    const theme = this.themes.library[themeName];
+                    theme.setLanguage(language);
+                }
+            }
+        }
+    }
+    async preLoad() {
+        // preload the library
+        this.loading = true;
+        await this.library.preLoad();
+        // build out the library themes
+        this.themes.library = {};
+        for (const themeName in this.library.themes) {
+            const theme = this.library.themes[themeName];
+            const themeConfig = {
+                name: themeName,
+                type: 'library',
+                base: theme,
+                language: this.library.locales.languages[this.language] || {},
+                languageOverrides: transformTranslationsToTheme((this.config.translations && this.config.translations[this.language]) || {}),
+                currency: this.library.locales.currencies[this.currency] || {},
+                innerWidth: this.window.innerWidth,
+            };
+            if (this.settings.editMode) {
+                const themeOverrides = this.storage.get('overrides.theme.variables') || {};
+                themeConfig.editorOverrides = { variables: themeOverrides || {} };
+            }
+            this.addTheme(themeConfig);
+        }
+        this.loading = false;
+    }
+}
 exports.TemplatesStore = TemplatesStore;
 function getTargetArray(targets, type) {
-    var _a = type.split('/'), category = _a[0], subcategory = _a[1];
+    const [category, subcategory] = type.split('/');
     if (category === 'recommendation' && subcategory) {
         return targets.recommendation[subcategory];
     }
@@ -309,24 +225,22 @@ function getTargetArray(targets, type) {
     return undefined;
 }
 function transformTranslationsToTheme(translations) {
-    var components = {};
-    Object.keys(translations).forEach(function (component) {
+    const components = {};
+    Object.keys(translations).forEach((component) => {
         components[component] = {
             // @ts-ignore - don't know which component it may be
             lang: translations[component],
         };
     });
     return {
-        components: components,
+        components,
     };
 }
-var Deferred = /** @class */ (function () {
-    function Deferred() {
-        var _this = this;
-        this.promise = new Promise(function (resolve, reject) {
-            _this.reject = reject;
-            _this.resolve = resolve;
+class Deferred {
+    constructor() {
+        this.promise = new Promise((resolve, reject) => {
+            this.reject = reject;
+            this.resolve = resolve;
         });
     }
-    return Deferred;
-}());
+}